/* Dedicated composition for phones held upright. */
@media (max-width:767px) and (orientation:portrait){
 :root{--pad:clamp(20px,5.8vw,30px)}
 html{scroll-padding-top:calc(88px + env(safe-area-inset-top,0px))}
 body{font-size:15px;line-height:1.75;-webkit-text-size-adjust:100%}
 main,section,.wrap,.hero-discover>*{min-width:0}
 .section,.center-section{padding-block:76px}
 .site-header,.site-header.scrolled{height:calc(76px + env(safe-area-inset-top,0px));padding:calc(10px + env(safe-area-inset-top,0px)) var(--pad) 10px;gap:12px}
 .site-header .brand{min-width:0;max-width:calc(100% - 60px);gap:11px}
 .brand-logo{width:48px;height:48px}
 .brand-copy{font-size:22px;min-width:0}
 .brand small{font-size:9px;max-width:215px}
 .menu-button{width:48px;height:48px;flex-shrink:0}
 .mobile-nav{padding:24px var(--pad) 30px;gap:8px;max-height:calc(100svh - 76px - env(safe-area-inset-top,0px));overflow-y:auto;overscroll-behavior:contain}
 .mobile-nav a{font-size:30px;line-height:1.35;padding:7px 0;min-height:48px}
 .button{font-size:14px;min-height:52px;padding:16px 22px}
 .text-link{font-size:13px;min-height:44px;gap:18px}
 .section-label{font-size:11px;margin-bottom:22px}
 h2,.split-heading h2{font-size:clamp(37px,10.8vw,51px);line-height:1.06}
 .split-heading{display:block;margin-bottom:34px}
 .split-heading>p{font-size:15px;max-width:none;margin-top:24px;line-height:1.8}

 /* Keep the room recognizable instead of cropping it into a narrow strip. */
 .hero.hero-panorama .hero-sticky{min-height:0}
 .hero-panorama .hero-photo,body.hero-motion .hero-panorama .hero-photo{height:64svh;min-height:0}
 .hero-panorama .hero-photo>img{object-position:40% center;transform:scale(1.08)}
 .hero-veil,.hero-shade{height:100svh;min-height:0}
 .hero-veil{background:linear-gradient(180deg,#002c324d,transparent 30%,#003c4370 48%,#003c43 65%,#003c43 100%)}
 .hero-shade{background:linear-gradient(180deg,#003c4380,#003c43e8 60%,#003c43)}
 .hero-intro,body.hero-motion .hero-panorama .hero-intro{min-height:0;height:100svh;padding-top:110px;padding-bottom:calc(96px + env(safe-area-inset-bottom,0px));gap:0;align-items:flex-end}
 .hero-intro>div{width:100%;max-width:440px}
 .hero-panorama .hero-eyebrow{font-size:10px;line-height:1.65;max-width:300px;margin-bottom:15px}
 .hero-panorama h1{font-size:clamp(38px,10.4vw,54px);line-height:1.04;letter-spacing:-.045em;max-width:440px}
 .hero-panorama .hero-description{font-size:13px;line-height:1.75;max-width:365px;margin-top:16px;color:#e2eee7}
 .hero-panorama .hero-actions{margin-top:22px}
 .hero-panorama .hero-actions .button{font-size:13px;min-height:52px;padding:16px 22px;gap:28px}
 .hero-panorama .hero-bottom{bottom:calc(20px + env(safe-area-inset-bottom,0px));width:auto;font-size:9px;gap:0}
 .hero-bottom .scroll-line{height:28px}
 .hero-panorama .motion-toggle{right:80px;bottom:calc(11px + env(safe-area-inset-bottom,0px));width:94px;min-height:44px;justify-content:center;gap:7px;padding:6px;flex-direction:row}
 .hero-panorama .motion-toggle span{font-size:9px;line-height:1.4;text-align:left}
 body.hero-motion .hero-panorama{height:270svh}
 body.hero-motion .hero-panorama .hero-sticky{height:100svh;min-height:0}
 .hero-discover{display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:auto auto 400px auto auto;gap:14px;min-height:0;height:auto;padding:80px var(--pad) 85px}
 .discover-copy{display:contents;max-width:none}
 .discover-copy .section-label{display:none}
 .discover-copy h2{grid-column:1;grid-row:1;max-width:none;font-size:clamp(34px,9.1vw,48px);line-height:1.1;text-align:center;margin:0}
 .discover-copy h2 br{display:none}
 .discover-copy h2 br:after{content:' '}
 .discover-description{grid-column:1;grid-row:2;text-align:center;font-size:13px;line-height:1.7;max-width:365px;margin:0 auto}
 .discover-role{grid-column:1;grid-row:4;text-align:center;max-width:none!important;font-size:21px;line-height:1.25;margin:0}
 .discover-role small{max-width:none!important;font-size:11px;line-height:1.5;margin-top:6px}
 .discover-copy .text-link{grid-column:1;grid-row:5;justify-self:center;max-width:none;margin:0;font-size:12px;min-height:38px;padding:5px 0}
 .discover-visual,body.hero-motion .discover-visual{grid-column:1;grid-row:3;position:relative;inset:auto;width:100%;height:100%;min-height:0;max-width:400px;margin:0 auto;align-self:stretch;overflow:clip}
 .discover-portrait{height:100%;width:100%;object-fit:contain;object-position:center bottom;filter:drop-shadow(0 12px 16px #002c3233)}
 .hero-panorama .hero-art{inset:8% -2% 5%;height:auto;width:auto;margin:0;opacity:.17}
 body.hero-motion .hero-discover{padding-top:calc(98px + env(safe-area-inset-top,0px));padding-bottom:calc(85px + env(safe-area-inset-bottom,0px));grid-template-rows:auto auto minmax(0,1fr) auto auto;gap:9px}

 .intro-strip>.wrap{gap:10px;justify-content:space-between;font-size:11px;padding-block:22px}
 .intro-strip i{flex-shrink:0;width:3px;height:3px}
 .approach{display:block}
 .approach h2{font-size:clamp(37px,10.5vw,48px)}
 .approach-copy{margin-top:32px}
 .approach-copy .lead{font-size:28px;line-height:1.35;margin-bottom:24px}
 .approach-copy>p:not(.lead){font-size:15px;line-height:1.85}
 .steps{margin-top:34px}
 .steps>div{grid-template-columns:28px minmax(0,1fr);gap:8px 14px;padding:24px 0}
 .steps>div>span{font-size:11px}
 .steps h3{font-size:25px;margin-bottom:6px}
 .steps p{font-size:14px;line-height:1.8}
 .nutrition-section{display:block}
 .nutrition-photo{min-height:0;height:auto;aspect-ratio:4/5;max-height:none}
 .nutrition-photo>img{object-position:center}
 .photo-label{font-size:12px;left:var(--pad);bottom:26px;right:var(--pad)}
 .nutrition-copy{padding:58px var(--pad) 70px}
 .nutrition-copy h2{font-size:clamp(36px,10vw,48px);margin-bottom:28px}
 .nutrition-copy>p:not(.section-label){font-size:15px;line-height:1.85}
 .nutrition-points{margin:28px 0}
 .nutrition-points span{font-size:14px;line-height:1.65;padding:13px 0}
 .tanita{padding:20px 0}
 .tanita summary{font-size:14px;line-height:1.6;gap:16px}
 .tanita>div{gap:17px;align-items:flex-start}
 .tanita p{font-size:13px;line-height:1.85}
 .tanita img{width:75px;height:170px;flex-shrink:0}
 .nutrition-copy>.text-link{font-size:13px;line-height:1.6}

 /* Give each device a centered vertical stage beneath the text. */
 .technology-section{height:245svh}
 .technology-sticky{height:100svh;min-height:0;display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:auto minmax(0,1fr);gap:20px;padding-top:calc(98px + env(safe-area-inset-top,0px));padding-bottom:calc(66px + env(safe-area-inset-bottom,0px))}
 .technology-heading{grid-row:1;width:100%}
 .technology-heading .section-label{font-size:11px;margin-bottom:14px}
 .technology-heading h2{font-size:clamp(30px,8.5vw,40px);line-height:1.1;max-width:440px}
 .technology-heading h2 br{display:none}
 .technology-heading>p:not(.section-label){font-size:13px;line-height:1.65;max-width:360px;margin-top:15px}
 .technology-heading .text-link{max-width:none;font-size:12px;line-height:1.5;margin-top:12px;min-height:35px;gap:16px}
 .device-stage{grid-row:2;position:relative;inset:auto;width:100%;height:100%;min-height:0;margin:0;perspective:1200px}
 .device-slide{justify-content:flex-end;gap:10px;padding-inline:var(--pad);min-height:0}
 .device-slide>img{width:85%;height:calc(100% - 85px);min-height:0;max-height:none;object-fit:contain}
 .device-slide>div{height:75px;flex-shrink:0;width:100%;text-align:center;margin:0;padding:0}
 .device-slide>div>span{font-size:11px}
 .device-slide h3{font-size:28px;margin:5px 0 9px}
 .device-slide p{font-size:12px;max-width:360px;margin-inline:auto;line-height:1.55}
 .device-aura{inset:8% 12% 21%}
 .technology-bottom{bottom:calc(23px + env(safe-area-inset-bottom,0px));gap:18px}
 .device-counter{font-size:11px}

 .filters{position:sticky;top:calc(76px + env(safe-area-inset-top,0px));z-index:12;display:flex;flex-wrap:nowrap;gap:9px;overflow-x:auto;scrollbar-width:none;background:var(--paper);margin:26px calc(-1 * var(--pad)) 16px;padding:13px var(--pad);border-bottom:1px solid var(--line);scroll-padding-inline:var(--pad)}
 .filters::-webkit-scrollbar{display:none}
 .filter{flex-shrink:0;font-size:13px;min-height:46px;padding:11px 20px}
 .treatment-grid{grid-template-columns:minmax(0,1fr);gap:0}
 .treatment-card{grid-template-columns:minmax(0,1fr) 34px;column-gap:20px;min-height:0;padding:28px 0 27px}
 .treatment-category{font-size:11px}
 .treatment-icon{width:30px;height:35px}
 .treatment-card h3{grid-column:1;font-size:29px;margin:13px 0 15px}
 .treatment-card>p{font-size:14px;line-height:1.85;max-width:none}
 .card-link{font-size:12px;margin-top:22px;align-items:center}
 .card-link>span{font-size:23px}
 .treatment-note{font-size:12px;line-height:1.8;gap:14px;padding-top:24px;margin-top:4px}
 .note-mark{font-size:23px;flex-shrink:0}
 .team-lead{display:flex;gap:32px;margin-bottom:62px}
 .portrait-rosanna{width:100%;max-width:440px;aspect-ratio:4/5}
 .portrait-rosanna>img{height:100%;top:0;object-fit:contain}
 .team-lead .role{font-size:12px;line-height:1.7;margin-bottom:20px}
 .team-lead h3{font-size:clamp(38px,11vw,50px);margin-bottom:24px}
 .team-lead>div>p:not(.role){font-size:15px;line-height:1.85;margin-bottom:19px;max-width:none}
 .team-grid{grid-template-columns:minmax(0,1fr);gap:50px}
 .team-member:nth-child(n){margin-top:0}
 .team-member>.portrait{width:100%;max-width:440px;margin-inline:auto;aspect-ratio:4/5}
 .team-member h3{font-size:33px;margin-top:23px}
 .team-member .role{font-size:12px;line-height:1.7;min-height:0;margin-top:10px;max-width:none}
 .team-member .bio{font-size:15px;line-height:1.85;max-width:none;margin-top:16px}
 .portrait-ring{top:14%;width:76%;left:12%}

 /* Show the whole room image; put captions and controls in their own area. */
 .gallery-main{height:auto;overflow:hidden;isolation:isolate}
 .gallery-main>img{position:relative;width:100%;height:auto;max-height:none;object-fit:contain}
 .gallery-main:after{display:none}
 .gallery-overlay{position:relative;inset:auto;padding:24px 22px 85px;background:var(--deep)}
 .gallery-overlay>span{font-size:29px;line-height:1.15}
 .gallery-overlay p{font-size:14px;line-height:1.75;max-width:none;margin-top:12px}
 .gallery-arrows{bottom:20px;right:22px;gap:12px}
 .gallery-arrows button{width:48px;height:48px;font-size:22px}
 .gallery-count{font-size:11px;top:16px;right:16px;padding:6px 11px}
 .room-tabs{gap:25px;scroll-padding-inline:8px}
 .room-tabs button{font-size:12px;min-height:52px;padding:18px 0}
 .faq{display:block}
 .faq-list{margin-top:34px}
 .faq h2{font-size:clamp(37px,10vw,48px)}
 .faq-list summary{font-size:15px;line-height:1.65;gap:18px;min-height:32px}
 .faq-list details{padding:23px 0}
 .faq-list details>p{font-size:14px;line-height:1.85;padding-right:0;margin-top:18px}
 .contact-section{padding-top:76px}
 .contact-top{display:block}
 .contact-top h2{font-size:clamp(39px,10.7vw,52px)}
 .contact-top>div>p:not(.section-label){font-size:15px;line-height:1.85;margin:27px 0}
 .contact-top .button{width:100%;font-size:14px;min-height:56px}
 .contact-details{margin-top:52px;gap:33px}
 .contact-details h3{font-size:15px;margin-bottom:13px}
 .contact-details p,.contact-details a,.contact-details a.email{font-size:14px;line-height:1.8}
 .contact-details a{min-height:35px;overflow-wrap:anywhere}
 .hours dl{font-size:13px}
 .hours dl>div{padding:10px 0}
 .footer-mark{margin-top:52px;font-size:21vw}
 footer{align-items:flex-start;gap:22px;padding-top:28px;padding-bottom:calc(98px + env(safe-area-inset-bottom,0px))}
 .footer-wordmark{font-size:28px}
 footer>p{font-size:12px;line-height:1.8}
 footer>a:last-child{font-size:12px;min-height:44px}
 .whatsapp-float{width:52px;height:52px;right:17px;bottom:calc(18px + env(safe-area-inset-bottom,0px))}
 dialog{width:calc(100% - 24px);max-height:calc(100svh - 24px);margin:auto}
 .dialog-close{width:44px;height:44px;top:12px;right:12px}
 .dialog-visual{min-height:230px;max-height:300px;padding:30px}
 .dialog-visual img{height:240px}
 .dialog-copy{padding:30px 24px 35px}
 .dialog-copy h2{font-size:36px;line-height:1.1;margin-top:12px;margin-bottom:24px}
 .dialog-copy>p:not(.section-label){font-size:14px;line-height:1.85}
 .dialog-copy .dialog-note{font-size:12px!important;line-height:1.8}
 .dialog-copy .button{font-size:13px;line-height:1.6;min-height:56px;padding:16px 19px}
 body.motion-reduced .technology-sticky{display:block;padding-block:70px;height:auto;min-height:0}
 body.motion-reduced .device-stage{display:grid;grid-template-columns:1fr;grid-auto-rows:410px;gap:32px;width:auto;margin:30px var(--pad) 0}
 body.motion-reduced .device-slide{height:410px;min-height:0;padding-inline:0}
 body.motion-reduced .device-slide>img{height:315px}
}
@media(max-width:767px) and (orientation:portrait) and (max-height:740px){
 .hero-panorama h1{font-size:clamp(35px,10vw,43px)}
 .hero-panorama .hero-eyebrow{font-size:9px;margin-bottom:11px}
 .hero-panorama .hero-description{font-size:12px;line-height:1.65;margin-top:13px}
 .hero-panorama .hero-actions{margin-top:17px}
 .hero-panorama .hero-actions .button{min-height:48px;padding:13px 19px;font-size:12px}
 .hero-intro,body.hero-motion .hero-panorama .hero-intro{padding-bottom:calc(84px + env(safe-area-inset-bottom,0px))}
 .hero-discover .discover-description{display:none}
 body.hero-motion .hero-discover{padding-top:calc(92px + env(safe-area-inset-top,0px));padding-bottom:calc(78px + env(safe-area-inset-bottom,0px));grid-template-rows:auto 0 minmax(0,1fr) auto auto;gap:7px}
 .discover-role{font-size:19px}
 .discover-role small{font-size:10px}
 .discover-copy .text-link{font-size:11px;min-height:30px}
 .technology-sticky{padding-top:calc(89px + env(safe-area-inset-top,0px));padding-bottom:62px;gap:13px}
 .technology-heading .section-label{margin-bottom:10px}
 .technology-heading>p:not(.section-label){display:none}
 .technology-heading .text-link{font-size:11px;margin-top:12px;min-height:30px}
 .device-slide h3{font-size:25px;margin:5px 0 7px}
 .device-slide p{font-size:11px}
}
@media(max-width:767px) and (orientation:portrait) and (prefers-reduced-motion:reduce){
 .technology-sticky{display:block;padding-block:70px;height:auto;min-height:0}
 .device-stage{display:grid;grid-template-columns:1fr;grid-auto-rows:410px;gap:32px;width:auto;margin:30px var(--pad) 0}
 .device-slide{height:410px;min-height:0;padding-inline:0}
 .device-slide>img{height:315px}
}
