/* 2026-10-16 design review: shorter page, calmer hero, 14px type floor, 44px touch targets.
   Loaded after option-b.css on the four index pages only. */

/* ---- Hero: the film poster stays fully visible; only a play button sits on it ---- */
.ob-callout { margin-top:28px!important; }
.sf-hero-video.sf-film-idle .sf-film-play { z-index:2; }

/* ---- Value path and benefits read as one section ---- */
.ob-section-3 > .sf-shell { padding-bottom:32px!important; }
#approach { background:#12232f!important; border-top:0!important; }
#approach > .sf-shell { padding-top:32px!important; }

/* ---- Practice list: one group at a time (tabs built by sf-design.js) ---- */
.sf-tabs { display:flex; flex-wrap:wrap; gap:0 28px; margin:36px 0 0; border-bottom:1px solid rgba(164,184,211,.35); }
.sf-tab { min-height:44px; padding:10px 2px; margin-bottom:-1px; background:none; border:0; border-bottom:2px solid transparent; color:#c4d0df; font:600 14px/1.3 Inter,system-ui,sans-serif; cursor:pointer; }
.sf-tab:hover { color:#f7fbff; }
.sf-tab[aria-selected="true"] { color:#f7fbff; border-bottom-color:#66d9f2; }
.sf-prac-list > [role="tabpanel"] { margin-top:0!important; }
.sf-prac-list > [role="tabpanel"][hidden] { display:none; }
.sf-prac-list > [role="tabpanel"] > .sf-tab-label { display:none!important; }
.sf-tabs + .sf-prac-grid { margin-top:8px!important; }
.sf-prac-list .sf-prac-row { padding-top:20px!important; padding-bottom:20px!important; }

/* ---- Type: Inter + Newsreader only, 14px floor ---- */
.sf-stream-saved small, .sf-prac small, .sf-task span, .sf-task em, .sf-prac-out em { font-size:14px!important; }
.sf-prac-chip { font-size:14px; }
.ob-eyebrow span, .sf-flow-label, .sf-prac-out b { font-size:14px!important; }
@media(max-width:1080px) { .sf-prac-out b { font-size:14px!important; } }

/* ---- Touch targets (44px) on phones ---- */
@media(max-width:760px) {
  .sf-lang a { min-height:44px!important; padding:0 8px!important; display:inline-flex!important; align-items:center; }
  footer a, .ob-section a[href^="mailto:"] { display:inline-flex; align-items:center; min-height:44px; }
  footer .sf-shell, footer .sf-shell > div { gap:0 18px!important; }
}

/* ---- Header: the full booking label is longer in DE/FR/IT, so those pages switch to the menu button a little earlier ---- */
@media(min-width:1081px) and (max-width:1260px) {
  html:not([lang="en"]) .sf-nav-links { display:none!important; }
  html:not([lang="en"]) .sf-menu-btn { display:inline-flex; }
  html:not([lang="en"]) .sf-mnav { display:flex!important; }
  html:not([lang="en"]) .sf-mnav[hidden] { display:none!important; }
}

/* ---- Tabs scroll sideways on phones instead of wrapping to three rows ---- */
@media(max-width:760px) {
  .sf-tabs { width:calc(100vw - 48px); max-width:100%; flex-wrap:nowrap; overflow-x:auto; gap:0 22px; margin-top:28px; scrollbar-width:none; }
  .sf-tabs::-webkit-scrollbar { display:none; }
  .sf-tab { flex:none; white-space:nowrap; }
}