
:root{
  --bg:#f3f5f2; --bg-2:#e9eeea; --surface:#ffffff;
  --text:#101816; --text-soft:#4a5954; --faint:#7d8a85;
  --accent:#176859; --accent-text:#13584b; --accent-ink:#fff;
  --line:#d6ddd8; --halo:none;
  --deep:#0b1c19; --deep-2:#12302a; --deep-line:rgba(214,236,228,.14);
  --on-deep:#eef5f1; --on-deep-soft:#a9c2b9;
  --glow:#4cc59a; --amber:#e3a33a; --amber-text:#8a5605; --amber-soft:#fbefd9;
  --radius:14px; --radius-sm:10px;
  color-scheme:light
}
body{ background:var(--bg); color:var(--text); overflow-x:clip }
h1,h2,h3{ text-wrap:balance; letter-spacing:-.022em }
.eyebrow{ margin-bottom:var(--sp-2); letter-spacing:.08em }
body .btn, body .btn.primary{ border-radius:10px; padding:.95rem 1.35rem }
.ov-sr{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap }


.ov-bleed{ margin-inline:calc(50% - 50vw); padding-inline:max(clamp(1.1rem,4vw,2.5rem), calc(50vw - 36rem)) }


header.nav{ padding-block:1rem; background:var(--deep); box-shadow:0 0 0 100vmax var(--deep); clip-path:inset(0 -100vmax);
  border-bottom:1px solid var(--deep-line) }
header.nav .brand{ color:#fff }
header.nav nav:not([data-language-picker]) a{ color:var(--on-deep-soft) }
header.nav nav:not([data-language-picker]) a:hover{ color:#fff }
header.nav .ov-nav-cta{ color:var(--glow) !important }
.nav nav a{ white-space:nowrap }
.nav .ov-nav-cta{ font-weight:650 }
@media (max-width:860px){
  header.nav nav:not([data-language-picker]){ flex:1 0 100%; margin-left:0; flex-wrap:nowrap; overflow-x:auto; gap:1.1rem;
    -webkit-overflow-scrolling:touch; scrollbar-width:none; padding-bottom:.2rem }
  header.nav nav::-webkit-scrollbar{ display:none }
}


.ov-hero{ background:var(--deep); color:var(--on-deep); padding-block:clamp(3rem,7vw,6rem) clamp(3rem,6vw,5rem);
  display:grid; gap:clamp(2rem,4vw,3.5rem); position:relative; isolation:isolate }
.ov-hero::before{ content:""; position:absolute; inset:0; z-index:-1; pointer-events:none;
  background:radial-gradient(60rem 30rem at 85% 0%, rgba(76,197,154,.16), transparent 60%) }
.ov-hero .eyebrow{ color:var(--glow) }
.ov-hero .eyebrow::before{ background:var(--glow) }
.ov-hero h1{ font-size:clamp(2.45rem, 1.3rem + 5.4vw, 5.4rem); line-height:1.02; max-width:16ch;
  margin-bottom:var(--sp-3); color:#fff; font-weight:780 }
.ov-lede{ font-size:var(--step-1); line-height:var(--lh-snug); color:var(--on-deep-soft); max-width:40ch;
  margin-bottom:var(--sp-4) }
.ov-actions{ display:flex; flex-wrap:wrap; gap:1rem 1.6rem; align-items:center }
.ov-hero .btn.primary, .ov-close .btn.primary{ background:var(--glow); color:var(--deep);
  box-shadow:0 10px 40px -12px rgba(76,197,154,.7) }
.ov-link{ color:var(--on-deep); font-weight:620; text-underline-offset:.3em }
.ov-fine{ font-size:var(--step--1); color:var(--on-deep-soft); margin-top:var(--sp-2) }
@media (min-width:1100px){
  .ov-hero{ grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr); align-items:center }
}


.ov-board-wrap{ margin:0 }
.ov-board-wrap figcaption{ font-size:var(--step--1); color:var(--on-deep-soft); margin-top:.9rem; max-width:52ch; line-height:1.45 }
.ov-board{ background:var(--deep-2); border:1px solid var(--deep-line); border-radius:var(--radius);
  padding:clamp(.8rem,2vw,1.2rem); box-shadow:0 30px 80px -40px rgba(0,0,0,.8); container-type:inline-size }
.ob-status{ display:flex; align-items:center; gap:.6rem; min-height:2.3rem; font-weight:650; font-size:var(--step--1);
  padding:.45rem .75rem; border-radius:8px; margin-bottom:.9rem; transition:background var(--dur-2), color var(--dur-2) }
.ob-status::before{ content:""; width:.6rem; height:.6rem; border-radius:50%; background:currentColor; flex:none }
.ob-status.is-ok{ background:rgba(76,197,154,.14); color:var(--glow) }
.ob-status.is-hit{ background:rgba(227,163,58,.16); color:var(--amber) }
.ob-grid{ display:grid; grid-template-columns:3.4rem repeat(var(--days),minmax(0,1fr)); row-gap:.45rem;
  position:relative; touch-action:pan-y; user-select:none; -webkit-user-select:none }
.ob-day{ text-align:center; font-size:.68rem; line-height:1.2; color:var(--on-deep-soft); padding-bottom:.35rem;
  font-variant-numeric:tabular-nums }
.ob-day b{ display:block; font-size:.82rem; color:var(--on-deep); font-weight:650 }
.ob-day.we{ opacity:.55 }
.ob-row{ font-size:.78rem; font-weight:700; color:var(--on-deep); align-self:end; padding-bottom:.85rem; font-variant-numeric:tabular-nums }
.ob-lane{ grid-column:2 / -1; display:grid; grid-template-columns:repeat(var(--days),minmax(0,1fr)); height:2.4rem;
  position:relative; border-radius:6px;
  background:rgba(238,245,241,.035) }
.ob-lane.has-track{ height:auto; grid-template-rows:1.7rem 2.4rem }
.ob-lane.has-track .ob-job{ grid-row:2 }
.ob-lane.has-track .ob-trip, .ob-lane.has-track .ob-ghost{ grid-row:1; margin:.1rem 2px .15rem; font-size:.68rem }
.ob-ghost[hidden]{ display:none }
.ob-job, .ob-trip, .ob-ghost{ grid-row:1; margin:.25rem 2px; border-radius:6px; display:flex; align-items:center;
  padding-inline:.45rem; font-size:.72rem; font-weight:650; overflow:hidden; white-space:nowrap;
  font-variant-numeric:tabular-nums; transition:background var(--dur-2), color var(--dur-2), box-shadow var(--dur-2) }
.ob-job{ background:rgba(238,245,241,.12); color:var(--on-deep) }
.ob-job.is-hit{ background:var(--amber); color:var(--deep); box-shadow:0 0 0 2px rgba(227,163,58,.35) }
.ob-job.is-covered{ background:rgba(76,197,154,.24); color:#d8f5ea; box-shadow:inset 0 0 0 1px var(--glow) }
.ob-trip{ position:relative; z-index:2; cursor:grab; color:var(--deep); font-weight:750;
  background:repeating-linear-gradient(135deg, #e7f1ec 0 6px, #cfe3da 6px 12px); justify-content:center; gap:.3rem;
  outline-offset:3px }
.ob-trip:focus-visible{ outline:2px solid var(--glow) }
.ob-trip.is-drag{ cursor:grabbing; box-shadow:0 10px 30px -8px rgba(0,0,0,.6) }
.ob-trip.is-open{ border-top-right-radius:0; border-bottom-right-radius:0;
  -webkit-mask:linear-gradient(90deg,#000 70%,transparent); mask:linear-gradient(90deg,#000 70%,transparent) }
.ob-trip svg{ width:1rem; height:1rem; flex:none }
.ob-ghost{ border:1.5px dashed var(--glow); color:var(--glow); background:rgba(76,197,154,.08) }
.ob-ghost.is-busy{ border-color:var(--amber); color:var(--amber); background:rgba(227,163,58,.08) }
.ob-controls{ display:flex; flex-wrap:wrap; gap:.6rem 1rem; align-items:center; margin-top:1rem }
.ob-btn{ font:inherit; font-size:var(--step--1); font-weight:650; color:var(--on-deep); background:transparent;
  border:1px solid var(--deep-line); border-radius:8px; padding:.6rem .85rem; cursor:pointer; min-height:44px }
.ob-btn:hover:not(:disabled){ border-color:var(--glow); color:#fff }
.ob-btn[aria-pressed="true"]{ background:rgba(76,197,154,.16); border-color:var(--glow); color:#fff }
.ob-btn:disabled{ opacity:.45; cursor:default }
.ob-hint{ font-size:.78rem; color:var(--on-deep-soft); flex:1 1 12rem }
@container (max-width:520px){
  .ob-grid{ grid-template-columns:2.6rem repeat(var(--days),minmax(0,1fr)) }
  .ob-job span{ display:none }
  .ob-row{ font-size:.7rem }
}
@media (prefers-reduced-motion:no-preference){
  .ob-trip.is-nudge{ animation:ob-nudge 1.6s var(--ease) 2 }
  @keyframes ob-nudge{ 0%,100%{ transform:none } 40%{ transform:translateX(10px) } 70%{ transform:translateX(-4px) } }
}


.ov-problem{ display:grid; gap:var(--sp-3); padding-block:var(--sp-5); border-bottom:1px solid var(--line) }
.ov-fact{ font-size:var(--step-1); line-height:1.35; color:var(--text-soft); max-width:26ch }
.ov-fact b{ display:block; color:var(--text); font-size:var(--step-2); letter-spacing:-.02em; margin-bottom:.2rem }
@media (min-width:760px){ .ov-problem{ grid-template-columns:repeat(3,minmax(0,1fr)) } }


.ov-head{ max-width:var(--measure-wide); margin-bottom:var(--sp-4) }
.ov-head h2, .ov-who h2, .ov-switch h2, .ov-price h2{ font-size:var(--step-3); line-height:1.08 }


.ov-loop{ padding-block:var(--sp-6) var(--sp-5) }
.ov-steps{ list-style:none; padding:0; margin:0; position:relative }
.ov-steps::before{ content:""; position:absolute; left:.55rem; top:.6rem; bottom:.6rem; width:2px;
  background:linear-gradient(var(--accent), var(--glow) 60%, var(--accent)); border-radius:2px }
.ov-step{ position:relative; display:grid; gap:var(--sp-3); padding:0 0 var(--sp-5) 2.6rem }
.ov-step::before{ content:""; position:absolute; left:0; top:.35rem; width:1.15rem; height:1.15rem; border-radius:50%;
  background:var(--bg); border:2px solid var(--accent); box-shadow:0 0 0 5px var(--bg) }
.ov-step h3{ font-size:var(--step-2); margin-bottom:.5rem }
.ov-step-text p{ color:var(--text-soft); max-width:var(--measure) }
@media (min-width:900px){
  .ov-step{ grid-template-columns:minmax(0,1fr) minmax(0,1fr); align-items:start; column-gap:var(--sp-5) }
}
.ov-art{ background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); padding:1.1rem 1.2rem;
  font-variant-numeric:tabular-nums; box-shadow:0 1px 0 rgba(16,24,22,.03) }
.ov-mini-row{ display:grid; grid-template-columns:3rem 1.4fr 1.6fr 1.2fr; gap:4px; align-items:center; margin:.35rem 0 }
.ov-mini-row i{ font-style:normal; font-weight:700; font-size:.8rem }
.ov-mini-row b{ height:1.9rem; border-radius:6px; font-size:.72rem; display:flex; align-items:center; padding-inline:.45rem;
  background:var(--bg-2); color:var(--text) }
.ov-mini-row b.lab{ background:repeating-linear-gradient(135deg,#e2ece7 0 6px,#cbddd4 6px 12px) }
.ov-mini-row b.hit{ background:var(--amber-soft); color:var(--amber-text); box-shadow:inset 0 0 0 1.5px var(--amber) }
.ov-card-line{ font-size:var(--step-1); margin-bottom:.4rem }
.ov-card-meta{ color:var(--text-soft); font-size:var(--step--1); line-height:1.5; margin-bottom:.8rem }
.ov-card-sign{ display:inline-flex; gap:.45rem; align-items:center; font-size:var(--step--1); font-weight:650; color:var(--accent-text) }
.ov-card-sign::before{ content:"✓"; display:grid; place-items:center; width:1.35rem; height:1.35rem; border-radius:50%;
  background:var(--accent); color:#fff; font-size:.75rem }
.ov-art-qr{ display:flex; gap:1.1rem; align-items:center; max-width:21rem }
.ov-qr{ width:6.5rem; height:6.5rem; flex:none; background:#fff; border-radius:6px }
.ov-qr path{ fill:var(--text) }
.ov-label-text b{ display:block; font-size:var(--step-2); letter-spacing:-.02em }
.ov-label-text span{ font-size:var(--step--1); color:var(--accent-text); font-weight:650 }
.ov-track{ display:block; height:2.2rem; border-radius:6px; background:var(--bg-2); overflow:hidden }
.ov-track b.lab{ display:block; height:100%; width:85%; margin-left:15%;
  background:repeating-linear-gradient(135deg,#e2ece7 0 6px,#cbddd4 6px 12px);
  -webkit-mask:linear-gradient(90deg,#000 55%,transparent); mask:linear-gradient(90deg,#000 55%,transparent) }
.ov-track-note{ display:block; margin-top:.6rem; font-weight:650; font-size:var(--step--1); color:var(--amber-text) }
.ov-art-release{ display:grid; gap:.55rem }
.ov-art-release .ok{ display:flex; gap:.6rem; align-items:center; font-size:var(--step--1); font-weight:600 }
.ov-art-release .ok::before{ content:"✓"; display:grid; place-items:center; width:1.35rem; height:1.35rem; flex:none;
  border-radius:50%; background:color-mix(in srgb,var(--accent) 14%,#fff); color:var(--accent-text); font-size:.75rem; font-weight:800 }


.ov-shots{ position:relative; margin-bottom:var(--sp-4); display:grid }
.ov-shot{ margin:0; border-radius:12px; overflow:hidden; background:#fff; border:1px solid var(--line);
  box-shadow:0 40px 80px -40px rgba(11,28,25,.45) }
.ov-shot img{ display:block; width:100%; height:auto }
.ov-shot-bar{ display:flex; align-items:center; gap:.4rem; padding:.55rem .8rem; background:var(--bg-2);
  border-bottom:1px solid var(--line); font-size:.72rem; color:var(--text-soft) }
.ov-shot-bar i{ width:.6rem; height:.6rem; border-radius:50%; background:#cdd5d0 }
.ov-shot-bar span{ margin-left:.6rem; background:#fff; border-radius:6px; padding:.15rem .6rem }
.ov-shot-back{ display:none }
@media (min-width:900px){
  .ov-shots{ grid-template-columns:1.35fr 1fr; align-items:end; padding-right:2rem }
  .ov-shot-back{ display:block; margin-left:-12%; margin-bottom:-2.5rem; position:relative; z-index:1 }
}
.ov-surfaces{ padding-block:var(--sp-5); border-top:1px solid var(--line) }
.ov-duo{ display:grid; gap:var(--sp-3) }
@media (min-width:860px){ .ov-duo{ grid-template-columns:1.15fr .85fr } }
.ov-surface{ background:var(--surface); border:1px solid var(--line); border-radius:var(--radius);
  padding:clamp(1.3rem,3vw,2.2rem); display:flex; flex-direction:column; gap:.6rem }
.ov-surface-portal{ background:linear-gradient(160deg, color-mix(in srgb,var(--accent) 7%,#fff), #fff 55%);
  border-color:color-mix(in srgb,var(--accent) 30%,var(--line)) }
.ov-surface h3{ font-size:var(--step-2) }
.ov-url{ font-weight:650; color:var(--accent-text); font-size:var(--step--1); margin-top:-.3rem }
.ov-list{ list-style:none; padding:0; margin:.6rem 0 1.2rem; display:grid; gap:.55rem; color:var(--text-soft) }
.ov-list li{ padding-left:1.5rem; position:relative; line-height:1.45 }
.ov-list li::before{ content:""; position:absolute; left:.1rem; top:.62em; width:.6rem; height:2px; background:var(--accent) }
.ov-surface .btn{ align-self:flex-start; margin-top:auto }
.ov-coming{ font-size:var(--step--1); color:var(--text-soft); margin-top:auto }
.ov-surface .launch-live{ display:flex; flex-wrap:wrap; gap:.7rem; margin-top:auto }
[data-launch="prelaunch"] .launch-live{ display:none }
[data-launch="live"] .launch-prelaunch{ display:none }
[data-store-badge="prelaunch"], [data-store-badge="absent"]{ display:none }
.ov-store{ display:inline-flex; flex-direction:column; padding:.55rem 1rem; border-radius:10px; background:var(--text);
  color:#fff; text-decoration:none; line-height:1.1 }
.ov-store small{ font-size:.66rem; opacity:.8 }
.ov-store b{ font-size:1rem }


.ov-trust{ padding-block:var(--sp-5) }
.ov-grid{ display:grid; gap:1px; background:var(--line); border:1px solid var(--line); border-radius:var(--radius); overflow:hidden }
.ov-cell{ background:var(--surface); padding:1.4rem 1.4rem 1.6rem }
.ov-cell h3{ font-size:var(--step-1); margin-bottom:.45rem; line-height:1.25 }
.ov-cell p{ color:var(--text-soft); font-size:var(--step-0); line-height:1.55 }
@media (min-width:700px){ .ov-grid{ grid-template-columns:repeat(2,minmax(0,1fr)) } }
@media (min-width:1050px){ .ov-grid{ grid-template-columns:repeat(3,minmax(0,1fr)) } }


.ov-who, .ov-switch{ display:grid; gap:var(--sp-4); padding-block:var(--sp-5); border-top:1px solid var(--line); align-items:center }
.ov-who p, .ov-switch p{ color:var(--text-soft); max-width:var(--measure); margin-top:var(--sp-2) }
@media (min-width:900px){ .ov-who, .ov-switch{ grid-template-columns:minmax(0,1fr) minmax(0,1fr) } }
.ov-chips{ list-style:none; padding:0; margin:0; display:flex; flex-wrap:wrap; gap:.55rem }
.ov-chips li{ background:var(--surface); border:1px solid var(--line); border-radius:8px; padding:.55rem .8rem;
  font-weight:600; font-size:var(--step--1) }
.ov-csv{ margin:0; background:var(--deep); color:#d9efe6; border-radius:var(--radius); padding:1.2rem 1.3rem;
  font-size:.85rem; line-height:1.7; overflow-x:auto }


.ov-price{ padding-block:var(--sp-5); border-top:1px solid var(--line) }
.ov-price-card{ background:var(--surface); border:1px solid color-mix(in srgb,var(--accent) 35%,var(--line));
  border-radius:var(--radius); padding:clamp(1.5rem,4vw,3rem); max-width:44rem }
.ov-price-card p:not(.eyebrow){ color:var(--text-soft); margin:var(--sp-2) 0 var(--sp-3); max-width:var(--measure) }


.ov-faq{ padding-top:var(--sp-5); max-width:none; margin-inline:0; display:grid; gap:var(--sp-3) var(--sp-5); align-items:start }
.ov-faq h2{ font-size:var(--step-3) }
@media (min-width:900px){ .ov-faq{ grid-template-columns:minmax(0,.7fr) minmax(0,1.3fr) } .ov-faq h2{ grid-row:1 / span 20 } }
.ov-faq details[open] summary::after{ content:"\2212" }
.ov-close{ background:var(--deep); color:var(--on-deep); text-align:center; padding-block:var(--sp-6);
  margin-bottom:calc(-1 * var(--sp-5)) }
.ov-close h2{ color:#fff; font-size:var(--step-3); max-width:20ch; margin:0 auto var(--sp-4) }
.ov-close .ov-fine{ margin-top:var(--sp-3) }


.ov-doc{ max-width:var(--measure-wide); padding-block:var(--sp-5) }
.ov-doc h1{ font-size:var(--step-3); margin-bottom:var(--sp-3) }
.ov-doc h2{ font-size:var(--step-1); margin:var(--sp-4) 0 var(--sp-1) }
.ov-doc p{ color:var(--text-soft); margin-top:var(--sp-2) }


.ov-langs{ display:flex; flex-wrap:wrap; gap:.4rem 1rem; font-size:var(--step--1) }
.ov-langs a[aria-current="page"]{ color:var(--text); font-weight:650 }
