:root { --ink:#24263b; --muted:#62677c; --line:#dce1ee; --accent:#4e55a2; }
body { color:var(--ink); font-family:"Rubik",system-ui,sans-serif; }
html { scroll-padding-top:110px; }
html,body { overflow-x:clip !important; }
a,button,input,textarea { -webkit-tap-highlight-color:transparent; }
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible { outline:3px solid #4e55a2; outline-offset:5px; }
[hidden] { display:none !important; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.world-fallback { padding:clamp(120px, 18vh, 220px) 0; }
.world-fallback h1 { max-width:14ch; margin:12px 0 18px; font-family:Poppins,system-ui,sans-serif; font-size:clamp(2.6rem,7vw,5.8rem); line-height:.98; letter-spacing:-.045em; color:var(--ink); }
.world-fallback p:not(.eyebrow) { max-width:48ch; color:var(--muted); line-height:1.7; }
.world-fallback ul { display:flex; flex-wrap:wrap; gap:8px 18px; margin:24px 0; padding:0; list-style:none; color:var(--ink); font-size:.9rem; }
.world-fallback li::before { content:'·'; margin-right:8px; color:var(--accent); }
.world-fallback a { color:var(--accent); font-weight:600; }
#world.is-enhanced > .world-fallback { display:none; }
.skip-link { position:fixed; left:20px; top:-100px; z-index:100; padding:14px 20px; border-radius:12px; background:#fff; color:var(--ink); }
.skip-link:focus { top:16px; }
.sw-topbar { font-family:"Rubik",sans-serif; transition:background .2s,box-shadow .2s; }
.sw-topbar.is-past-world { background:rgba(247,248,252,.96); box-shadow:0 1px 0 var(--line); }
.sw-topbar.is-past-world .sw-nav { visibility:hidden; }
/* The compact type keeps the complete message and CTA inside the video stage. */
#world .sw-copy__title { font-size:clamp(2rem,3.6vw,3.55rem) !important; line-height:1.05 !important; }
#world .sw-copy__tags { margin-top:18px !important; }
#world .sw-copy__cta { margin-top:22px; gap:10px; }
#world .sw-btn { font-size:.9rem; padding:13px 18px; line-height:1.4; text-align:center; }
#world .sw-btn--primary { background:linear-gradient(105deg,#a2407a,#4e55a2 65%,#316b9f) !important; }
.page-content { position:relative; z-index:2; background:#f7f8fc; }
.page-shell { width:min(1180px,calc(100% - 96px)); margin-inline:auto; }
.section-space { padding-block:112px; }
h2,h3 { font-family:"Poppins",system-ui,sans-serif; font-weight:600; letter-spacing:-.045em; }
.page-content h2 { font-size:clamp(2rem,3.4vw,3.2rem); line-height:1.13; margin:0; }
.eyebrow { color:var(--accent); font-size:.71rem; font-weight:500; letter-spacing:.13em; line-height:1.6; margin:0 0 20px; }
.section-heading { display:flex; align-items:end; justify-content:space-between; gap:40px; margin-bottom:48px; }
.section-heading>p { color:var(--muted); line-height:1.7; margin:0; }
.case-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:28px; }
.case { border:1px solid var(--line); border-radius:28px; background:#fff; overflow:hidden; }
.case-visual { padding:28px 32px 24px; background:radial-gradient(ellipse at 100% 0,#d9ceee,transparent 65%),#eeedf8; }
.case-audifono .case-visual { background:radial-gradient(ellipse at 100% 0,#c9e7f7,transparent 65%),#edf5fa; }
.case-type { display:flex; justify-content:space-between; gap:14px; font-size:.63rem; letter-spacing:.1em; color:#525777; margin:0; }
.case-brand { font-family:"Poppins",sans-serif; font-size:2.6rem; font-weight:600; letter-spacing:-.05em; margin:27px 0; }
.case-brand span { font-size:1.1rem; font-weight:500; color:#535c8d; letter-spacing:-.02em; }
.case-audifono .case-brand { color:#17688d; }
.case-audifono .case-brand span { color:#17688d; font-size:1.8rem; }
.case-flow { display:flex; flex-direction:column; align-items:center; color:#505572; font-size:.82rem; }
.case-flow>strong { padding:16px 24px; background:rgba(255,255,255,.8); border:1px solid rgba(78,85,162,.16); border-radius:13px; color:var(--ink); font-weight:500; }
.case-flow>div { display:flex; justify-content:center; flex-wrap:wrap; gap:8px; }
.case-flow>div>span { padding:8px 12px; border:1px solid rgba(78,85,162,.16); border-radius:30px; background:rgba(255,255,255,.4); }
.flow-line { display:block; width:1px; height:24px; background:linear-gradient(#cc699b,#5c79bb); }
.diagram-note { text-align:center; font-size:.64rem; color:#62677c; margin:20px 0 0; }
.case-copy { padding:32px; }
.case-copy .eyebrow { font-size:.62rem; margin-bottom:12px; }
.case-copy h3 { font-size:1.65rem; line-height:1.25; margin:0 0 18px; max-width:24ch; }
.case-copy p:not(.eyebrow) { font-size:.95rem; line-height:1.7; color:var(--muted); }
.case-outcome { padding-top:22px; margin-top:22px; border-top:1px solid var(--line); }
.case-outcome>span { font-size:.64rem; letter-spacing:.12em; color:var(--accent); font-weight:500; }
.case-outcome p { margin:8px 0 24px; }
.text-link { display:inline-flex; align-items:center; gap:18px; color:var(--accent); font-size:.9rem; font-weight:500; text-decoration:none; padding-block:8px; }
.text-link:hover { text-decoration:underline; text-underline-offset:5px; }
.people { display:grid; grid-template-columns:1fr 1fr; gap:70px; padding-block:60px 100px; border-top:1px solid var(--line); }
.people>div>p:not(.eyebrow) { margin:0; font-size:1.05rem; line-height:1.8; color:var(--muted); }
.person { display:flex; gap:18px; align-items:center; margin-top:26px; }
.person-monogram { width:64px; height:64px; display:grid; place-items:center; border-radius:20px; background:linear-gradient(135deg,#eee2f0,#dfebfa); color:var(--accent); font-family:"Poppins",sans-serif; font-size:1.6rem; letter-spacing:-.06em; }
.person strong { display:block; font-weight:500; margin-bottom:7px; }
.person div>span { color:var(--muted); font-size:.83rem; }
.contact { background:linear-gradient(125deg,#eee8f5,#edf2fb 70%,#e4f2fa); border-top:1px solid #e2e2f0; }
.contact-grid { display:grid; grid-template-columns:.9fr 1.1fr; gap:80px; align-items:start; }
.contact-copy h2 { font-size:clamp(2.8rem,4.5vw,4.3rem); max-width:11ch; }
.contact-copy h2 span { color:var(--accent); }
.contact-copy>p:not(.eyebrow) { line-height:1.75; color:#555b74; max-width:34ch; }
.contact-copy>p.contact-invitation { font-weight:500; margin-top:28px; color:var(--ink); }
.contact-email { display:inline-flex; align-items:center; gap:24px; color:var(--accent); text-underline-offset:6px; line-height:1.6; }
.contact-logo { display:block; width:min(100%,260px); height:auto; margin-top:30px; }
.contact-form-wrap { padding:32px; border:1px solid rgba(255,255,255,.9); border-radius:26px; background:rgba(255,255,255,.8); box-shadow:0 20px 60px #4e55a20b; }
.form-help { margin:0 0 26px; font-size:.93rem; line-height:1.65; color:#555b74; }
.form-row { display:grid; grid-template-columns:1fr 1fr; gap:18px; }
.field { margin-bottom:22px; min-width:0; }
.field label,.contact-result label { display:block; margin-bottom:9px; font-size:.83rem; font-weight:500; line-height:1.5; }
.field label span { color:var(--muted); font-weight:400; }
input,textarea { width:100%; padding:13px 14px; background:#fff; border:1px solid #cbd1e1; border-radius:10px; font:inherit; font-size:1rem; color:var(--ink); }
input::placeholder,textarea::placeholder { color:#71778b; }
textarea { resize:vertical; min-height:120px; }
.button { display:inline-flex; align-items:center; justify-content:center; gap:24px; padding:15px 22px; font:inherit; font-weight:500; font-size:.93rem; color:#fff; background:linear-gradient(105deg,#a2407a,#4e55a2 65%,#316b9f); border:0; border-radius:30px; cursor:pointer; }
.button:hover { filter:brightness(1.08); }
.form-note { font-size:.76rem; color:var(--muted); line-height:1.6; margin:14px 0 0; }
.contact-result { margin-top:24px; padding-top:22px; border-top:1px solid var(--line); }
.contact-result p { font-size:.9rem; line-height:1.6; }
.contact-result label { color:var(--muted); font-weight:400; }
.contact-result textarea { font-size:.85rem; line-height:1.6; }
.copy-button { margin-top:12px; padding:10px 14px; border:1px solid #b4bad0; background:#fff; color:var(--accent); border-radius:8px; font:inherit; font-size:.84rem; cursor:pointer; }
#copy-status { display:block; font-size:.8rem; margin-top:10px; color:var(--muted); }
.footer { display:flex; align-items:center; justify-content:space-between; gap:24px; padding-block:30px; }
.footer img { display:block; object-fit:contain; }
.footer p { font-size:.82rem; color:#555b74; }
.footer small { font-size:.7rem; color:var(--muted); }
.footer-legal { display:flex; flex-wrap:wrap; justify-content:center; gap:8px 16px; margin-left:auto; max-width:430px; }
.footer-legal a { color:var(--muted); font-size:.75rem; text-underline-offset:4px; }
.footer-legal a:hover { color:var(--accent); }
.static-intro { padding-block:140px 60px; }
@media(min-width:861px) and (max-height:760px) {
  #world .sw-copy { padding:22px; }
  #world .sw-copy__title { font-size:clamp(1.8rem,3.3vw,2.9rem) !important; }
  #world .sw-copy__body { font-size:1rem; margin-top:12px; }
  #world .sw-copy__tags { margin-top:12px !important; }
  #world .sw-copy__eyebrow { margin-top:10px !important; }
}
@media(max-width:1050px) {
  .sw-nav__item { padding-inline:9px !important; }
  .page-shell { width:calc(100% - 56px); }
  .contact-grid { gap:36px; }
  .people { gap:40px; }
}
@media(max-width:860px) {
  html { scroll-padding-top:88px; }
  /* Keep the mobile story focused on the scene and its copy. The route, player
     and progress bar are desktop-oriented navigation chrome. */
  .sw-route, .sw-tour, .sw-scrollbar { display:none !important; }
  #world .sw-copy__title { font-size:clamp(1.75rem,7.1vw,2.8rem) !important; }
  #world .sw-copy__body { font-size:.95rem; }
  #world .sw-copy__tags { gap:6px; margin-top:12px !important; }
  #world .sw-copy__tags li { padding:5px 9px; font-size:.72rem; }
  #world .sw-copy__cta { margin-top:16px; }
  #world .sw-btn { font-size:.8rem; padding:11px 14px; }
  .page-shell { width:calc(100% - 40px); }
  .section-space { padding-block:72px; }
  .section-heading { display:block; margin-bottom:32px; }
  .section-heading>p { margin-top:24px; }
  .section-heading>p br { display:none; }
  .case-grid { grid-template-columns:1fr; gap:24px; }
  .case-visual,.case-copy { padding:26px; }
  .people { grid-template-columns:1fr; gap:26px; padding-block:44px 68px; }
  .contact-grid { grid-template-columns:1fr; gap:36px; }
  .contact-copy h2 { max-width:13ch; }
  .contact-copy>p:not(.eyebrow) { max-width:45ch; }
  .contact-logo { margin:30px auto 0; }
  .contact-form-wrap { padding:24px; }
  .footer { flex-wrap:wrap; gap:14px 24px; }
  .footer small { width:100%; }
  .footer-legal { justify-content:flex-start; margin-left:0; max-width:none; }
}
@media(max-width:480px) {
  .form-row { grid-template-columns:1fr; gap:0; }
  .contact-form-wrap { padding:22px 18px; }
  .case-flow>div { gap:6px; }
  .case-flow>div>span { padding:8px 10px; font-size:.73rem; }
  .footer p { max-width:21ch; }
}
@media(max-width:860px) and (max-height:720px) {
  #world .sw-copy { padding:14px 16px; bottom:44px !important; }
  #world .sw-copy__title { font-size:1.6rem !important; }
  #world .sw-copy__body { font-size:.86rem; line-height:1.4 !important; margin-top:10px !important; }
  #world .sw-copy__tags { display:none; }
  #world .sw-copy__eyebrow { font-size:.65rem; margin-top:8px !important; }
  #world .sw-copy__cta { margin-top:12px; }
}
@media(prefers-reduced-motion:reduce) { html { scroll-behavior:auto !important; } *,*::before,*::after { transition:none !important; } }
@media(max-width:860px) {
  .sw-hint { bottom:16px !important; font-size:.62rem !important; white-space:nowrap; }
}
@media(max-width:860px) {
  #world .sw-copylayer::before { width:100% !important; }
}

/* Compact player: the ring uses the same clock as the scene's reading time. */
.sw-tour { position:absolute; z-index:45; bottom:calc(18px + env(safe-area-inset-bottom)); left:50%; transform:translateX(-50%); display:flex; align-items:center; gap:12px; width:max-content; padding:6px 10px 6px 6px; border:1px solid #ffffffa6; border-radius:999px; background:rgba(247,248,252,.88); backdrop-filter:blur(14px); box-shadow:0 4px 20px #241d2b0c; color:#4e55a2; }
.sw-tour__toggle, .sw-tour__skip { position:relative; display:grid; place-items:center; flex:none; width:48px; height:48px; padding:0; border:0; border-radius:50%; color:inherit; background:transparent; cursor:pointer; text-decoration:none; -webkit-tap-highlight-color:transparent; }
.sw-tour__toggle:hover, .sw-tour__skip:hover { background:#4e55a20b; }
.sw-tour__ring { position:absolute; inset:0; width:48px; height:48px; fill:none; stroke-width:2; transform:rotate(-90deg); pointer-events:none; }
.sw-tour__ring-track { stroke:currentColor; opacity:.12; }
.sw-tour__ring-progress { stroke:currentColor; stroke-linecap:round; }
.sw-tour__icon, .sw-tour__skip svg { width:22px; height:22px; fill:currentColor; pointer-events:none; }
.sw-tour__pause, .sw-tour__skip-bar { fill:none; stroke:currentColor; stroke-width:2.5; stroke-linecap:round; }
.sw-tour__pause { display:none; }
.sw-tour__toggle[aria-pressed="true"] .sw-tour__play { display:none; }
.sw-tour__toggle[aria-pressed="true"] .sw-tour__pause { display:block; }
.sw-tour__counter { min-width:25px; font-size:.75rem; font-weight:500; font-variant-numeric:tabular-nums; letter-spacing:.02em; color:#6a6b82; text-align:center; }
.sw-tour__skip { width:44px; height:44px; }
.sw-tour__status { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); }
#world .sw-hint { display:none; }
@media(max-width:860px) { #world .sw-hint.is-idle { display:flex !important; } }
.sw-tour :focus-visible { outline:3px solid #009bd9; outline-offset:4px; }
@media(max-width:860px) {
  #world .sw-copy { bottom:calc(108px + env(safe-area-inset-bottom)) !important; }
}
.sw-scene.reduced-motion .sw-scene__still { opacity:1 !important; transform:none !important; }

.contact-trap { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); }
#contact-captcha { min-height:0; max-width:100%; margin-bottom:16px; }
#contact-form button:disabled { opacity:.6; cursor:not-allowed; }
#contact-result:empty { display:none; }
#contact-result.is-error { color:#8b2848; background:#fff1f5; }

/* Console easter egg: quiet by default, deliberately unmistakable when found. */
.developer-mode { --dev-accent:#7cf7d4; }
.developer-mode::after { content:''; position:fixed; inset:0; z-index:9998; pointer-events:none; background:linear-gradient(rgba(124,247,212,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(124,247,212,.035) 1px,transparent 1px); background-size:32px 32px; mix-blend-mode:multiply; animation:dev-grid-in .7s ease both; }
.dev-overlay { position:fixed; inset:0; z-index:9999; display:grid; place-items:center; padding:24px; background:rgba(20,22,39,.86); color:#d8fff4; font-family:ui-monospace,SFMono-Regular,Menlo,monospace; opacity:0; animation:dev-overlay-in .45s ease forwards; }
.dev-overlay__window { width:min(680px,100%); padding:clamp(24px,5vw,48px); border:1px solid rgba(124,247,212,.35); background:linear-gradient(145deg,rgba(31,45,59,.97),rgba(22,27,48,.97)); box-shadow:0 24px 100px rgba(0,0,0,.35),0 0 0 1px rgba(124,247,212,.06) inset; }
.dev-overlay__eyebrow { margin:0 0 28px; color:#7cf7d4; font-size:.7rem; letter-spacing:.16em; }
.dev-overlay__title { margin:0; color:#fff; font:600 clamp(1.7rem,5vw,3rem)/1.05 Poppins,system-ui,sans-serif; letter-spacing:-.045em; }
.dev-overlay__copy { max-width:48ch; margin:24px 0 0; color:#aab9bc; font:400 .9rem/1.7 Rubik,system-ui,sans-serif; }
.dev-overlay__prompt { margin:32px 0 0; color:#7cf7d4; font-size:.78rem; }
.dev-overlay__close { margin-top:28px; padding:9px 13px; border:1px solid rgba(124,247,212,.45); background:transparent; color:#d8fff4; font:inherit; font-size:.72rem; cursor:pointer; }
.dev-overlay__close:hover { background:rgba(124,247,212,.1); }
@keyframes dev-overlay-in { to { opacity:1; } }
@keyframes dev-grid-in { from { opacity:0; } to { opacity:1; } }
@media(prefers-reduced-motion:reduce) { .dev-overlay,.developer-mode::after { animation:none; opacity:1; } }

/* A single connected route, with small Git-style elbows between lanes. */
#world .sw-route { width:44px; gap:4px; padding:0; right:10px !important; }
#world .sw-route::before, #world .sw-route__dot::before { content:none; }
.sw-route__lines { position:absolute; inset:0; width:100%; height:100%; overflow:visible; pointer-events:none; fill:none; stroke-width:1.5; stroke-linecap:round; stroke-linejoin:round; opacity:.5; }
#world .sw-route__dot { width:44px; height:44px; padding:0; }
#world .sw-route__dot:nth-of-type(4n + 2), #world .sw-route__dot:nth-of-type(4n + 3) { transform:translateX(-10px); }
#world .sw-route__dot i { width:8px; height:8px; background:color-mix(in srgb,var(--sw-accent) 60%,#f7f8fc); }
#world .sw-route__dot.is-active i { background:var(--sw-accent); transform:scale(1.35); box-shadow:0 0 0 4px color-mix(in srgb,var(--sw-accent) 12%,transparent); }
#world .sw-route__label { display:block; }
#world .sw-route__dot:focus-visible { outline:2px solid var(--sw-accent); outline-offset:-5px; border-radius:50%; }
@media(min-width:861px) { #world .sw-route { right:18px !important; } }
@media(max-height:540px) { #world .sw-route { gap:0; } }
