:root{
  --ink:#0c2a22; --ink-2:#4b645d; --bg:#f5f7f6; --card:#fff; --line:#e3e9e6;
  --mint:#39b98c; --mint-h:#4cc89b; --mint-d:#16875f; --mint-dd:#0b5a3f; --mint-s:#e3f5ed; --mint-ss:#f0faf5; --on-mint:#04261a;
  --coral:#fbe7e3; --coral-t:#9c3322; --butter:#fdf1cf; --butter-t:#6b4e00; --sky:#e4eefb; --sky-t:#1d4f8f; --lilac:#ece8fb; --lilac-t:#4c3a9e;
  --r:24px; --max:1260px; --ease:cubic-bezier(.2,.8,.2,1);
  --zr-accent:var(--mint-d); --zr-accent-hover:var(--mint-dd); --zr-ink:var(--ink); --zr-muted:var(--ink-2); --zr-soft:var(--mint-ss); --zr-line:var(--line); --zr-radius:var(--r); --zr-radius-sm:14px;
  --zr-display:"Plus Jakarta Sans",system-ui,sans-serif; --zr-logo-font:"Plus Jakarta Sans",system-ui,sans-serif; --zr-logo-weight:800;
  --zr-plan-bg:#eef3f1; --zr-plan-block:#dde7e3; --zr-plan-green:#d3efe1; --zr-plan-water:#d4e4f7; --zr-plan-text:#4b645d;
  --zr-route-bus:#16875f; --zr-route-bahn:#1d4f8f; --zr-route-park:#9c3322;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;scroll-padding-top:96px}
html,body{overflow-x:clip}
body{font-family:"Plus Jakarta Sans",system-ui,sans-serif;color:var(--ink);background:var(--bg);line-height:1.6;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
img,svg{display:block;max-width:100%}
figure{position:relative}
ul,ol{list-style:none}
:focus-visible{outline:2.5px solid var(--mint-d);outline-offset:3px;border-radius:8px}
.wrap{max-width:var(--max);margin:0 auto;padding:0 28px}
h1,h2,h3{letter-spacing:-.03em;line-height:1.05;font-weight:800}
h2{font-size:clamp(2rem,4vw,3.1rem);margin-top:14px}
.muted{color:var(--ink-2)}
.skip{position:absolute;left:12px;top:-60px;z-index:100;background:var(--ink);color:#fff;padding:.6rem 1rem;border-radius:12px}
.skip:focus{top:12px}
.ribbon{background:var(--ink);color:#dbe9e4;font-size:.78rem;text-align:center;padding:.5rem 16px;line-height:1.4}
.ribbon b{color:#fff}
.tag{display:inline-flex;align-items:center;gap:.45rem;font-size:.8rem;font-weight:700;padding:.4rem .8rem;border-radius:999px;background:var(--mint-s);color:var(--mint-dd)}
.tag.butter{background:var(--butter);color:var(--butter-t)}
.tag.sky{background:var(--sky);color:var(--sky-t)}
.tag.coral{background:#fff;color:var(--coral-t)}
.ico{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round;flex:none}
.ico.sm{width:18px;height:18px}
.ai{position:absolute;left:12px;top:12px;z-index:2;font:700 .66rem/1 "Plus Jakarta Sans",sans-serif;color:#fff;background:rgba(12,42,34,.55);padding:.38rem .6rem;border-radius:999px;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);cursor:help}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.55rem;padding:.9rem 1.3rem;border-radius:14px;font-weight:700;font-size:.95rem;line-height:1;white-space:nowrap;transition:transform .15s,background .2s,border-color .2s}
.btn:active{transform:scale(.98)}
.btn-mint{background:var(--mint);color:var(--on-mint)}
.btn-mint:hover{background:var(--mint-h)}
.btn-soft{background:var(--card);border:1.5px solid var(--line)}
.btn-soft:hover{border-color:var(--mint)}
.btn-glass{color:#fff;border:1.5px solid rgba(255,255,255,.3)}
.btn-glass:hover{border-color:#fff}
.more{display:inline-flex;align-items:center;gap:.4rem;font-weight:700;color:var(--mint-d)}
.more svg{transition:transform .25s var(--ease)}
.more:hover svg{transform:translateX(3px)}

/* header */
.hdr{position:sticky;top:0;z-index:40;background:rgba(245,247,246,.88);backdrop-filter:saturate(1.4) blur(14px);-webkit-backdrop-filter:saturate(1.4) blur(14px)}
.hdr>.wrap{display:flex;align-items:center;gap:22px;height:78px}
.nav{display:flex;gap:2px;margin-left:10px}
.nav a{padding:.5rem .8rem;border-radius:10px;font-size:.92rem;font-weight:600;color:var(--ink-2)}
.nav a:hover{background:#fff;color:var(--ink)}
.hdr .right{margin-left:auto;display:flex;align-items:center;gap:10px}
.live{display:inline-flex;align-items:center;gap:.5rem;font-size:.84rem;font-weight:600;padding:.5rem .85rem;border-radius:999px;background:#fff;border:1px solid var(--line);white-space:nowrap}
.live i{width:8px;height:8px;border-radius:50%;background:var(--mint);box-shadow:0 0 0 4px var(--mint-s)}
.live.closed i{background:#a7b5b0;box-shadow:0 0 0 4px #edf1ef}
.burger{display:none;width:44px;height:44px;border-radius:14px;background:#fff;border:1px solid var(--line);place-items:center}
.drawer{display:none}

/* hero */
.hero{padding:30px 0 30px}
.hero-grid{display:grid;grid-template-columns:1.35fr 1fr;gap:20px}
.hello{background:var(--card);border-radius:32px;padding:52px 52px 34px;display:flex;flex-direction:column}
.hello h1{font-size:clamp(2.6rem,5.2vw,4.5rem);margin:18px 0 16px}
.hello h1 em{font-style:normal;color:var(--mint-d)}
.hello>p{color:var(--ink-2);font-size:1.08rem;max-width:48ch}
.intents{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin-top:34px}
.intent{text-align:left;position:relative;display:flex;flex-direction:column;justify-content:space-between;gap:26px;min-height:132px;padding:20px;border-radius:20px;font-weight:700;font-size:1.08rem;transition:transform .25s var(--ease),box-shadow .25s}
.intent:hover{transform:translateY(-3px);box-shadow:0 14px 30px -14px rgba(12,42,34,.35)}
.intent small{display:block;font-weight:500;font-size:.84rem;margin-top:2px}
.intent .go{position:absolute;right:16px;top:16px;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:rgba(255,255,255,.6)}
.intent .go svg{width:16px;height:16px}
.i-book{background:var(--mint);color:var(--on-mint)}
.i-pain{background:var(--coral);color:var(--coral-t)}
.i-new{background:var(--sky);color:var(--sky-t)}
.i-kid{background:var(--butter);color:var(--butter-t)}
.side{display:grid;grid-template-rows:1fr auto;gap:20px}
.doc{border-radius:32px;overflow:hidden;background:#dfe9e5;min-height:420px}
.doc img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 18%}
.doc .card{position:absolute;left:16px;right:16px;bottom:16px;background:rgba(255,255,255,.94);backdrop-filter:blur(10px);border-radius:20px;padding:16px 18px;display:flex;justify-content:space-between;align-items:center;gap:12px}
.doc .card b{font-size:1.05rem;display:block}
.doc .card span span{font-size:.84rem;color:var(--ink-2)}
.real{font-size:.72rem;font-weight:700;color:var(--mint-dd);background:var(--mint-s);padding:.3rem .55rem;border-radius:999px;white-space:nowrap}
.facts{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.fact{background:var(--card);border-radius:20px;padding:18px}
.fact b{display:block;font-size:1.25rem;font-weight:800;letter-spacing:-.02em}
.fact span{font-size:.8rem;color:var(--ink-2);line-height:1.35;display:block;margin-top:2px}

/* reveal */
.js .rv{opacity:0;transform:translateY(14px);transition:opacity .6s var(--ease),transform .6s var(--ease)}
.js .rv.in{opacity:1;transform:none}

/* dialog */
.detail{margin:auto;width:min(680px,calc(100% - 24px));max-height:calc(100svh - 40px);border:0;border-radius:28px;padding:0;color:var(--ink);background:var(--card);box-shadow:0 40px 80px -20px rgba(12,42,34,.35);overflow:hidden}
.detail[open]{display:flex;flex-direction:column;animation:pop .3s var(--ease)}
.detail::backdrop{background:rgba(12,42,34,.45);backdrop-filter:blur(3px)}
@keyframes pop{from{opacity:0;transform:translateY(14px) scale(.98)}}
#detailBody{overflow:auto;overscroll-behavior:contain}
.detail .close{position:absolute;top:14px;right:14px;z-index:3;width:44px;height:44px;border-radius:14px;background:#fff;display:grid;place-items:center;box-shadow:0 2px 10px rgba(12,42,34,.15)}
.detail figure{aspect-ratio:16/9;overflow:hidden;background:var(--mint-s)}
.detail figure img{width:100%;height:100%;object-fit:cover}
.detail .in{padding:28px 36px 36px}
.detail h2{font-size:2.1rem;margin:14px 0 12px}
.detail h3{font-size:1.15rem;font-weight:700;letter-spacing:-.01em;margin:24px 0 10px}
.detail p{color:var(--ink-2)}
.plist{display:grid;gap:10px}
.plist li{display:flex;gap:12px;align-items:flex-start}
.plist .ck{flex:none;width:24px;height:24px;border-radius:8px;background:var(--mint-s);color:var(--mint-dd);display:grid;place-items:center;margin-top:1px}
.plist .ck svg{width:14px;height:14px;stroke-width:3}
.psteps{counter-reset:s;display:grid;gap:8px}
.psteps li{counter-increment:s;display:flex;gap:12px;align-items:baseline;color:var(--ink-2)}
.psteps li::before{content:counter(s);flex:none;width:26px;height:26px;border-radius:8px;background:var(--ink);color:#fff;font-size:.8rem;font-weight:700;display:grid;place-items:center}
.pnote{display:flex;gap:12px;margin-top:22px;padding:16px 18px;border-radius:16px;background:var(--mint-ss);color:var(--ink-2);font-size:.95rem}
.pnote svg{color:var(--mint-d)}
.detail .row{display:flex;gap:10px;flex-wrap:wrap;margin-top:26px}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .js .rv{opacity:1;transform:none;transition:none}
  .detail[open]{animation:none}
}