/* Homepage compact rhythm. The desktop and other pages keep their own layouts. */
@media screen and (max-width:420px){
  .home-page .hero-actions{grid-template-columns:1fr}
}

@media screen and (max-width:760px), screen and (orientation:landscape) and (max-width:960px) and (max-height:500px){
  .home-page .hero-location-line{display:block}
  .home-page .hero-actions a{display:flex;align-items:center;justify-content:space-between;gap:8px}
  .home-page .section{padding-block:48px}
  .home-page .section-heading{margin-bottom:24px}
  .home-page .home-updates{padding:20px 14px;gap:24px}
  .home-page .news-list li{padding-block:16px}
  .home-page .features{gap:10px}
  .home-page .features article{padding:20px 18px 20px 56px}
  .home-page .features .number{top:20px;left:16px}
  .home-page .features h3{margin-bottom:10px}
  .home-page .symptom-grid{gap:6px}
  .home-page .symptom-grid a{min-height:52px;padding:12px 14px}
  .home-page .symptom-group-private{margin-top:22px}

  /* Keep every card's label, title and description; remove the empty arrow row. */
  .home-page .treatment-grid{gap:8px}
  .home-page .treatment-grid>a{
    display:grid;grid-template-columns:minmax(0,1fr) 20px;
    align-content:start;gap:6px 12px;padding:18px 16px;min-height:0;
  }
  .home-page .treatment-grid>a>span{grid-column:1;font-size:11px;line-height:1.5}
  .home-page .treatment-grid h3{grid-column:1;margin:0;font-size:20px;line-height:1.5}
  .home-page .treatment-grid p{grid-column:1;margin:0;line-height:1.75}
  .home-page .treatment-grid b{position:static;grid-column:2;grid-row:1/4;align-self:center}
  .home-page .more-treatments{margin-top:18px;gap:4px 18px}
  .home-page .more-treatments a{display:inline-flex;align-items:center;min-height:44px}
  .home-page .lip-feature{margin-bottom:44px;padding:26px 20px}
  .home-page .equipment-inner{padding-block:48px}
  .home-page .home-equipment-showcase .equipment-inner{gap:24px}
  .home-page .clinic-section{gap:22px}
  .home-page .policy-section{margin-bottom:44px;padding:32px 21px}
  .home-page .instagram-section{gap:10px;margin-bottom:36px}
  .home-page .instagram-card{padding:20px 18px}
  .home-page .reservation-section{padding-block:44px}
  .home-page .local-faq{padding-block:44px 48px}

  /* Scope to this embed only; PHP and the reservation app stylesheet are unchanged. */
  .home-page #ndc-reservation-availability{padding:0}
  .home-page .ndc-availability{padding:24px 12px 26px}
  .home-page .ndc-av-kicker{margin-bottom:10px;font-size:12px}
  .home-page .ndc-av-kicker::after{margin-top:8px}
  .home-page .ndc-av-title{font-size:clamp(24px,6.6vw,29px);line-height:1.45;margin-bottom:12px}
  .home-page .ndc-av-note{font-size:14px;line-height:1.8;margin-bottom:18px}
  .home-page .ndc-av-box{padding:18px 10px 16px}
  .home-page .ndc-av-updated{font-size:14px;margin-bottom:8px}
  .home-page .ndc-av-note-inner{font-size:13px;line-height:1.8;margin-bottom:16px}
  .home-page .ndc-av-day{margin-bottom:14px}
  .home-page .ndc-av-dayhead>div{padding:9px 6px}
  .home-page .ndc-av-row{min-height:66px}
  .home-page .ndc-av-row>div{padding:6px 4px}
  .home-page .ndc-av-legend{padding-top:14px;font-size:13px;line-height:1.8}

  /* Native details: all original links and clinic text stay in the DOM. */
  .home-page .footer{padding-top:28px;padding-bottom:calc(88px + env(safe-area-inset-bottom))}
  .home-page .footer-top{gap:20px}
  .home-page .footer-accordion{width:100%;border-top:1px solid #4c5b65}
  .home-page .footer-accordion>summary{
    display:flex;align-items:center;justify-content:space-between;gap:16px;
    min-height:56px;padding:14px 0;cursor:pointer;list-style:none;
    color:#f4f1ea;font-size:15px;line-height:1.6;
  }
  .home-page .footer-accordion>summary::-webkit-details-marker{display:none}
  .home-page .footer-accordion>summary::after{
    content:"";width:8px;height:8px;flex:0 0 8px;margin-right:5px;
    border-right:1.5px solid #d7c19b;border-bottom:1.5px solid #d7c19b;
    transform:rotate(45deg);transition:transform .18s ease;
  }
  .home-page .footer-accordion[open]>summary::after{transform:rotate(225deg)}
  .home-page .footer-accordion nav{gap:0;padding-bottom:14px}
  .home-page .footer-accordion nav a{display:flex;align-items:center;min-height:44px;padding:8px 0}
  .home-page .footer-accordion-wrap{margin-top:0}
  .home-page .footer-accordion .clinic-facts{width:100%;margin:0;padding:0 0 18px;border:0}
  .home-page .footer-bottom{margin-top:10px;padding-top:18px;gap:16px;align-items:center}
}

/* Short landscape phones: use height as well as width, without affecting tablets. */
@media screen and (orientation:landscape) and (max-width:960px) and (max-height:500px){
  @view-transition{navigation:none}
  .home-page .header{position:relative;min-height:56px;padding:6px 24px;flex-wrap:nowrap;gap:16px}
  .home-page .header .brand{transform:none;gap:8px}
  .home-page .header .brand-logo{width:40px;height:40px;margin:0}
  .home-page .header .brand-jp{font-size:18px;white-space:nowrap}
  .home-page .header .brand-en{font-size:8px}
  .home-page .desktop-nav,.home-page .header-book{display:none}
  .home-page .mobile-menu{display:block;margin-left:auto;font-size:13px}
  .home-page .mobile-menu summary{padding:12px 0;cursor:pointer}
  .home-page .mobile-menu nav{position:absolute;z-index:5;top:100%;left:0;right:0;max-height:calc(100dvh - 80px);overflow-y:auto;overscroll-behavior:contain;background:var(--b-paper);padding:8px 24px;box-shadow:0 12px 18px #182b3d15}
  .home-page .mobile-menu nav a{display:block;padding:10px 0;border-bottom:1px solid var(--b-line);font-size:15px}
  .home-page .home-hero-v2,.home-page .home-hero-media,.home-page .home-hero-content{min-height:0}
  .home-page .home-hero-content{justify-content:flex-start;padding:16px 0 0}
  .home-page .home-hero-panel{width:100%;margin:0;padding:18px 24px;box-sizing:border-box}
  .home-page .home-hero-panel>.eyebrow{font-size:10px;line-height:1.5;margin-bottom:10px}
  .home-page .home-hero-panel h1{font-size:30px;line-height:1.4;letter-spacing:.045em;white-space:normal}
  .home-page .home-hero-panel .hero-lead{font-size:14px;line-height:1.7;margin-top:12px}
  .home-page .hero-location-line{display:inline-block}
  .home-page .home-hero-panel .hero-tags{display:flex!important;flex-wrap:wrap;gap:8px!important;margin:14px 0!important}
  .home-page .home-hero-panel .hero-tags>.hero-tag-chip{width:auto!important;min-height:44px!important;padding:8px 14px!important;font-size:13px!important}
  .home-page .hero-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:0}
  .home-page .hero-actions a{min-height:44px;padding:10px 14px;font-size:13px;gap:20px}
  .home-page .home-hero-location{position:static;display:flex;flex-wrap:wrap;justify-content:flex-start;margin:12px 0 0;width:100%;border:0}
  .home-page .home-hero-location span{padding:8px 12px;font-size:11px}
  .home-page .home-hero-media figcaption{top:2px;bottom:auto;left:24px;font-size:9px}
  .home-page .home-quick-actions{margin-top:0}
  .home-page .home-updates{grid-template-columns:minmax(0,1fr)}
  .home-page #ndc-reservation-availability .ndc-av-dayhead{position:static;box-shadow:none}
  .home-page .questionnaire-cta-home-inner{display:block;padding:20px 24px}
  .home-page .questionnaire-cta-home-button{width:auto;margin-top:14px;min-height:44px}
  .home-page .instagram-section{grid-template-columns:1fr}
  .home-page .instagram-card{gap:18px;min-height:0}
  .home-page .instagram-card>div{min-width:0;flex:1}
  .home-page .instagram-card h2{font-size:22px}
  .home-page .instagram-open{font-size:13px;white-space:nowrap}
  .home-page .footer-top{flex-direction:column;align-items:stretch}
  .home-page .footer{padding-bottom:28px}
  /* Keep the same shortcuts, in normal flow so they cannot cover a short screen. */
  .home-page .mobile-actions{position:static;display:grid;grid-template-columns:repeat(4,minmax(0,1fr))!important;transform:none!important;opacity:1!important}
  .home-page .mobile-actions a{min-height:44px;padding:8px 4px;text-align:center}
}
