/* EGATO page v34 layer (2026-10-24 review). Loaded after structure.css; selectors repeat the rules they replace.
   Fold into the main sheets later if preferred. */

/* EGATO green (#48BB7A, the exact green of the official logo files) on the three main buttons and the active
   gallery dot. Dark text on it measures 7.8:1. */
.btn-primary{background:#48bb7a;color:#111}
@media(hover:hover) and (pointer:fine){.btn-primary:hover{background:#5fcb8d;color:#111}}
[data-feature-gallery] .feature-pagination [data-feature-to][aria-pressed=true]:before{background:#48bb7a}

/* Hero 360: the frame follows the 16:9 video, so its play control sits in the video's own corner. */
.hero-orbit{width:min(100%,1173px,max(570px,calc(54svh*16/9)));height:auto;aspect-ratio:16/9;margin-inline:auto}

/* App throttle screenshot: only the throttle controls show (no status bar, no limit card), at the gauge screen's scale. */
[data-feature-gallery] .feature-media--crop>.settings-crop{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);height:calc((100% - 56px)*.6117);width:auto;aspect-ratio:1185/1575;border-radius:16px}

/* FAQ questions are sentences: sentence case reads faster than tracked capitals. */
.faq-item>summary{text-transform:none;letter-spacing:0;font-size:1rem;font-weight:500}

/* Full-size touch targets for the logo and footer links. */
.site-header .brand,.footer-row .brand{display:inline-flex;align-items:center;min-height:44px}
.footer-row>div a{min-width:44px;justify-content:center}

/* Phone menu: a 44px trigger that turns into an X while open. */
.mobile-menu summary{width:44px;align-items:center}
.mobile-menu[open] summary span:first-child{transform:translateY(3px) rotate(45deg)}
.mobile-menu[open] summary span:last-child{transform:translateY(-3px) rotate(-45deg)}

@media(max-width:699px){
 /* Hero control: icon only, top right, clear of the wheels. The button text stays as its accessible name. */
 .hero-orbit .media-toggle{top:8px;right:8px;bottom:auto;width:44px;height:44px;min-height:44px;padding:0;font-size:0;line-height:0;display:inline-flex;align-items:center;justify-content:center}
 .hero-orbit .media-toggle:before{margin:0;font-size:.75rem;line-height:1}

 /* Hardware gallery: progress dots on phones, and the next slide peeks in. */
 .engineering [data-feature-gallery] .feature-pagination{display:flex}
 [data-feature-gallery][data-feature-ready=true] .feature-pagination [data-feature-to]{min-width:32px}
 [data-feature-gallery][data-feature-ready=true] .feature-controls{padding-inline:12px;gap:6px}
 [data-feature-gallery][data-feature-ready=true] .feature-slide{flex:0 0 86%}
 [data-feature-gallery] .feature-media--crop{min-height:380px}
 [data-feature-gallery] .feature-media--crop>.settings-crop{height:min(320px,calc(100% - 48px))}

 /* Nothing under 14px on phones. */
 .product-title p,.stage-enquiry,.spec-group>summary,.faq-item>summary{font-size:.9375rem}
 .header-cta,.discover,.media-toggle,.order-note,.note,figcaption,.app-availability,.form-privacy{font-size:.875rem}
 .full-film>summary,.full-film>summary span,.full-film figcaption{font-size:.875rem}
 .start-cinema figcaption,.jump-photo figcaption,.team-grid figcaption,.race-proof-film figcaption{font-size:.875rem}
 .film-caption span,.film-caption p{font-size:.875rem}
 .holeshot-story .center-copy .note,.holeshot-story figcaption a{font-size:.875rem}
 .spec-highlights strong span,.spec-highlights p{font-size:.875rem}
 .privacy h2,.privacy p,.footer-row p,.footer-row>div a{font-size:.875rem}
 [data-feature-gallery][data-feature-ready=true] [data-feature-status],[data-feature-gallery] .feature-copy .note{font-size:.875rem}
}
