/* TopoDraugs v2 — the "wow" layer. Loads after styles.css and only restyles
   what the preview page (/v2/) marks with body.v2. No new colours outside the
   brand palette except the livery lime, which the vehicle concept already uses. */
.v2{--lime:#c9e265;--lime-deep:#9fbd2f;--ease:cubic-bezier(.2,.8,.2,1);--display:clamp(52px,7.4vw,112px)}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ---------- progress + header ---------- */
.scroll-meter{position:fixed;inset:0 0 auto;height:3px;z-index:90;pointer-events:none}
.scroll-meter i{display:block;height:100%;width:100%;background:linear-gradient(90deg,var(--olive),var(--lime));transform-origin:left;transform:scaleX(var(--sp,0))}
.v2 .v2-header{position:fixed;inset:0 0 auto;z-index:60;height:auto;display:block;transition:background .35s,box-shadow .35s,backdrop-filter .35s}
.v2-header-inner{height:84px;display:flex;align-items:center;gap:30px;transition:height .35s var(--ease)}
.v2 .v2-header.scrolled{background:#f4f1e8d9;backdrop-filter:blur(14px) saturate(1.3);-webkit-backdrop-filter:blur(14px) saturate(1.3);box-shadow:0 1px 0 #20251f14}
.v2 .v2-header.scrolled .v2-header-inner{height:64px}
.v2 .v2-header nav{display:flex;gap:28px;margin-left:auto}
.v2 .v2-header nav a{position:relative;font-size:13px;font-weight:680;text-decoration:none}
.v2 .v2-header nav a::after{content:"";position:absolute;left:0;right:0;bottom:-6px;height:2px;background:var(--lime-deep);transform:scaleX(0);transform-origin:right;transition:transform .35s var(--ease)}
.v2 .v2-header nav a:hover::after{transform:scaleX(1);transform-origin:left}
.v2 .header-cta{border-radius:99px;background:var(--ink);color:var(--paper);border-color:var(--ink);padding:11px 18px}
.v2 .header-cta:hover{background:var(--olive-deep)}
.wm-pin{display:inline-block;width:.62em;height:.62em;margin-right:.28em;border-radius:50% 50% 50% 0;transform:rotate(-45deg) translateY(-.05em);background:var(--olive);box-shadow:inset 0 0 0 .16em var(--paper),0 0 0 1px var(--olive)}

/* ---------- hero ---------- */
.hx{position:relative;min-height:max(720px,100svh);display:flex;align-items:center;overflow:hidden;isolation:isolate;background:#efe9d8}
.v2 .hx-stage.hero-scene{position:absolute;inset:0;margin:0;border-radius:0;background:transparent;overflow:hidden;z-index:-1}
.hx-parallax{position:absolute;inset:46px -8% -46px 8%;transform:translate3d(0,var(--hy,0px),0) scale(var(--hs,1.03));transform-origin:70% 100%;will-change:transform}
.hx-img,.hx-fx{position:absolute;inset:0;width:100%;height:100%}
.hx-img{object-fit:cover;object-position:center;animation:hx-in 1.8s var(--ease) both}
@keyframes hx-in{from{opacity:.01;filter:saturate(.4) blur(6px);transform:scale(1.06)}to{opacity:1;filter:none;transform:none}}
.hx-shade{position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,#f4f1e8 0,#f4f1e800 110px),linear-gradient(90deg,#f4f1e8 0,#f4f1e8f0 18%,#f4f1e8b8 36%,#f4f1e800 58%),linear-gradient(0deg,#f4f1e8 0,#f4f1e800 9%)}
.hx-fx{overflow:visible;pointer-events:none}
.hx-sun{mix-blend-mode:screen;animation:hx-sun 6s ease-in-out infinite alternate}
@keyframes hx-sun{from{opacity:.55;transform:scale(.92)}to{opacity:1;transform:scale(1.08)}}
.hx-sun{transform-box:fill-box;transform-origin:center}
.hx-sats circle{fill:#fff;opacity:.9;animation:hx-twinkle 2.4s ease-in-out infinite}
.hx-sats circle:nth-child(2){animation-delay:.8s}.hx-sats circle:nth-child(3){animation-delay:1.6s}
.hx-sats path{fill:none;stroke:#ffffffb0;stroke-width:1.4;stroke-dasharray:4 9;animation:hx-dash 1.6s linear infinite}
@keyframes hx-twinkle{50%{opacity:.25}}
@keyframes hx-dash{to{stroke-dashoffset:-26}}
.hx-gnss circle{fill:none;stroke:var(--lime);stroke-width:3;transform-box:fill-box;transform-origin:center;opacity:0;animation:hx-ping 3s var(--ease) infinite}
.hx-gnss circle:nth-child(2){animation-delay:1s}.hx-gnss circle:nth-child(3){animation-delay:2s}
@keyframes hx-ping{0%{opacity:.95;transform:scale(.4)}100%{opacity:0;transform:scale(3.6)}}
.hx-beam{stroke:var(--lime);stroke-width:2.2;stroke-linecap:round}
.hx-beam-glow{stroke:var(--lime);stroke-width:10;opacity:.45}
.hx-lens{fill:#f6ffc9;filter:drop-shadow(0 0 8px var(--lime))}
.hx-parcel{fill:none;stroke:#fff;stroke-width:3;stroke-linejoin:round;stroke-dasharray:10 7;filter:drop-shadow(0 2px 3px #0005)}
.hx-parcel-fill{fill:var(--lime);opacity:0;transition:opacity 1s}
.hx-parcel-fill.on{opacity:.22}
.hx-points g circle:first-child{fill:#fff;stroke:var(--olive-deep);stroke-width:3}
.hx-points g circle:last-child{fill:none;stroke:#fff;stroke-width:2;transform-box:fill-box;transform-origin:center;animation:hx-ping 1.2s var(--ease) 1 forwards}
.hx-points g{animation:hx-drop .5s var(--ease) both}
@keyframes hx-drop{from{opacity:0;transform:translateY(-26px)}}
.hx-dims text{font:700 15px/1 Inter,ui-sans-serif,system-ui,sans-serif;fill:#fff;paint-order:stroke;stroke:#20251fa0;stroke-width:5px;letter-spacing:.02em;animation:hx-fade .6s ease both}
@keyframes hx-fade{from{opacity:0}}

.hx-copy{position:relative;z-index:2;padding:120px 0 90px}
.hx-copy>*{max-width:640px}
.v2 .hx .eyebrow{margin-bottom:26px}
.hx-title{margin:0;font-size:var(--display);font-weight:720;line-height:.94;letter-spacing:-.06em}
.hx-title .line{display:block;padding-bottom:.06em;clip-path:inset(0 0 0 0);animation:hx-line 1.1s var(--ease) both}
.hx-title .line:nth-child(2){animation-delay:.12s}
.hx-title em.line{font-family:var(--serif);font-weight:500;font-style:italic;color:var(--olive-deep);letter-spacing:-.035em;animation-delay:.26s}
@keyframes hx-line{from{clip-path:inset(0 0 100% 0);transform:translateY(.45em);opacity:.01}to{clip-path:inset(0 0 -10% 0);transform:none;opacity:1}}
.hx-lead{margin:30px 0 0;color:#4d5348;font-size:19px;line-height:1.65;max-width:560px!important}
.hx-search{display:flex;align-items:center;gap:6px;margin-top:34px;padding:7px 7px 7px 20px;background:#fffdfaf2;border:1px solid #20251f1c;border-radius:99px;box-shadow:0 24px 60px #3a44201f,0 2px 0 #fff inset;transition:box-shadow .3s,transform .3s var(--ease)}
.hx-search:focus-within{box-shadow:0 30px 70px #3a442033,0 0 0 4px #c9e26588;transform:translateY(-2px)}
.hx-search-pin{color:var(--olive-deep);font-size:20px}
.hx-search input{flex:1;min-width:0;border:0;background:transparent;padding:12px 6px;font-size:16px;outline:0}
.hx-search input:focus-visible{outline:0}
.hx-search button{display:flex;gap:10px;align-items:center;border:0;border-radius:99px;background:var(--ink);color:var(--paper);padding:15px 22px;font-size:14px;font-weight:780;cursor:pointer;transition:background .25s,transform .25s var(--ease)}
.hx-search button:hover{background:var(--olive-deep)}
.hx-search button span:last-child{transition:transform .25s var(--ease)}
.hx-search button:hover span:last-child{transform:translateX(4px)}
.hx-chips{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:18px}
.hx-chips>span{font-size:12px;color:var(--muted);margin-right:4px}
.hx-chips a{padding:8px 13px;border:1px solid #20251f22;border-radius:99px;background:#fffdfa9c;font-size:12.5px;font-weight:650;text-decoration:none;backdrop-filter:blur(6px);transition:background .2s,border-color .2s,transform .2s var(--ease)}
.hx-chips a:hover{background:var(--lime);border-color:var(--lime-deep);transform:translateY(-2px)}
.v2 .hx .reassurance{font-size:12px;margin-top:20px}
.v2 .hx .motion-toggle{top:auto;bottom:22px;right:22px;border-radius:99px;padding:7px 12px;backdrop-filter:blur(6px)}
.v2 .hx figcaption{right:auto;left:auto;bottom:24px;right:150px;border-radius:99px;padding:5px 10px;font-size:10px}
.hx-reticle{position:absolute;left:0;top:0;z-index:3;pointer-events:none;opacity:0;transition:opacity .25s;transform:translate(var(--rx,0),var(--ry,0))}
.hx-reticle span{position:absolute;left:-22px;top:-22px;width:44px;height:44px;border:1.5px solid #fff;border-radius:50%;box-shadow:0 0 0 1px #20251f40}
.hx-reticle span::before,.hx-reticle span::after{content:"";position:absolute;background:#fff}
.hx-reticle span::before{left:50%;top:-8px;bottom:-8px;width:1.5px;transform:translateX(-50%)}
.hx-reticle span::after{top:50%;left:-8px;right:-8px;height:1.5px;transform:translateY(-50%)}
.hx-reticle b{position:absolute;left:28px;top:12px;white-space:nowrap;padding:3px 7px;border-radius:4px;background:#20251fcc;color:var(--lime);font:700 11px/1.3 ui-monospace,SFMono-Regular,Menlo,monospace}
.hx.aiming .hx-reticle{opacity:1}
.hx.aiming .hx-stage{cursor:none}
.hx-scroll{position:absolute;left:50%;bottom:26px;z-index:3;width:26px;height:42px;margin-left:-13px;border:2px solid #20251f55;border-radius:99px}
.hx-scroll span{position:absolute;left:50%;top:8px;width:4px;height:8px;margin-left:-2px;border-radius:2px;background:var(--ink);animation:hx-wheel 1.8s var(--ease) infinite}
@keyframes hx-wheel{0%{opacity:0;transform:translateY(-4px)}40%{opacity:1}100%{opacity:0;transform:translateY(12px)}}

/* ---------- ticker ---------- */
.ticker{overflow:hidden;background:var(--dark);color:#eef1e2;border-block:1px solid #ffffff14}
.ticker-track{display:flex;align-items:center;gap:34px;width:max-content;padding:20px 0;animation:ticker 42s linear infinite}
.ticker span{font-size:clamp(20px,2.2vw,30px);font-weight:650;letter-spacing:-.03em;white-space:nowrap}
.ticker span:nth-of-type(odd){font-family:var(--serif);font-style:italic;font-weight:500;color:var(--lime)}
.ticker i{font-style:normal;color:#ffffff55}
.ticker:hover .ticker-track{animation-play-state:paused}
@keyframes ticker{to{transform:translateX(-50%)}}

/* ---------- contours canvas (shared) ---------- */
.contours{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:0}
.manifest,.v2 .property-section,.v2 .confidence,.v2-footer{position:relative;isolation:isolate}
.v2 .property-section>.wrap,.v2 .confidence>.wrap,.v2-footer>.wrap,.manifest>.wrap{position:relative;z-index:1}

/* ---------- manifest (positioning) ---------- */
.manifest{padding:130px 0 120px;background:var(--cream)}
.manifest-head h2{margin:18px 0 0;max-width:980px;font-size:clamp(44px,6vw,92px);font-weight:720;line-height:.98;letter-spacing:-.058em}
.manifest-head h2 em{font-family:var(--serif);font-weight:500;color:var(--olive-deep);letter-spacing:-.03em}
.shift-list{list-style:none;margin:70px 0 0;padding:0;border-top:1px solid var(--line)}
.shift{display:grid;grid-template-columns:90px 1fr 1.15fr;gap:30px;align-items:center;padding:30px 0;border-bottom:1px solid var(--line)}
.shift-no{font:700 13px/1 ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--olive)}
.shift .was{margin:0;color:var(--muted);font-size:clamp(17px,1.5vw,21px);line-height:1.4;transition:color .6s .35s}.shift .was span{background:linear-gradient(#8b3826,#8b3826) no-repeat 0 58%/0 2px;transition:background-size .9s var(--ease) .35s}
.shift .now{margin:0;font-size:clamp(20px,2vw,28px);font-weight:680;line-height:1.25;letter-spacing:-.025em;opacity:0;transform:translateX(-18px);transition:opacity .7s .75s,transform .9s var(--ease) .75s}
.shift .now::before{content:"→ ";color:var(--lime-deep)}
.shift.in .was{color:#9a9d93}.shift.in .was span{background-size:100% 2px}
.shift.in .now{opacity:1;transform:none}

/* ---------- journey with walking dog ---------- */
.v2 .v2-journey{padding:120px 0 110px;background:#ecebe0}
.v2 .v2-journey .journey-rail::before{display:none}
.journey-track{position:relative;height:96px;margin:40px 0 -66px;pointer-events:none}
.journey-track::before,.journey-fill{content:"";position:absolute;z-index:0;left:0;right:0;bottom:29px;height:3px;border-radius:3px;background:#cdd2bd}
.journey-fill{right:auto;width:calc(var(--jp,0)*100%);background:linear-gradient(90deg,var(--olive),var(--lime))}
.journey-dog{position:absolute;z-index:3;bottom:28px;left:calc(var(--jp,0)*100%);width:84px;height:auto;transform:translateX(-50%);filter:drop-shadow(0 10px 10px #20251f30);animation:dog-bob .5s ease-in-out infinite alternate;animation-play-state:var(--walk,paused)}
@keyframes dog-bob{to{translate:0 -5px}}
.v2 .journey-rail{margin-top:0}
.v2 .journey-rail li{transition:opacity .5s}
.v2 .journey-rail .step-icon{transition:background .4s,color .4s,transform .4s var(--ease),box-shadow .4s}
.v2 .journey-rail li.lit .step-icon{background:var(--lime);color:var(--ink);transform:scale(1.12);box-shadow:0 0 0 8px #c9e26540}

/* ---------- property finder ---------- */
.v2 .property-section{padding:130px 0;overflow:hidden}
.v2 .property-app{border-radius:14px;box-shadow:0 40px 120px #000a,0 0 0 1px #ffffff1a;transition:box-shadow .4s}
.v2 .property-app:hover{box-shadow:0 50px 140px #000c,0 0 0 1px #c9e26566}
.v2 .property-copy h2{font-size:clamp(40px,4.4vw,64px)}

/* ---------- situations: tilt ---------- */
.tilt{transform:perspective(1100px) rotateX(var(--trx,0deg)) rotateY(var(--try,0deg));transition:transform .5s var(--ease),box-shadow .5s;transform-style:preserve-3d}
.tilt.tilting{transition:transform .08s linear}
.v2 .story{border-radius:14px;overflow:hidden}
.v2 .story:hover{box-shadow:0 30px 70px #26301f24}
.v2 .story-visual img{transition:transform 1.2s var(--ease)}
.v2 .story:hover .story-visual img{transform:scale(1.06)}
.v2 .story-copy a{transition:color .2s,letter-spacing .3s}
.v2 .story-copy a:hover{color:var(--olive-deep);letter-spacing:.02em}

/* ---------- scroll-scrubbed explainer ---------- */
.v2 .v2-scrub{height:280vh;padding:0}
.scrub-sticky{position:sticky;top:0;height:100vh;display:flex;align-items:center;overflow:hidden}
.scrub-sticky>.wrap{width:min(1280px,calc(100% - 64px))}
.scrub-bar{height:3px;margin-top:26px;max-width:320px;background:#c3cbb0;border-radius:3px;overflow:hidden}
.scrub-bar i{display:block;height:100%;background:var(--olive-deep);transform-origin:left;transform:scaleX(var(--tp,0))}
.v2 .transform-visual{border-radius:18px;overflow:hidden;box-shadow:0 40px 100px #26301f2e;transform:scale(calc(.92 + var(--tp,0)*.08))}

/* ---------- road trip ---------- */
.roadtrip{padding:140px 0;overflow:hidden;background:var(--cream)}
.road-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:70px;align-items:center}
.road-copy h2{margin:16px 0 0;font-size:clamp(40px,4.4vw,64px);font-weight:700;line-height:1.01;letter-spacing:-.055em}
.road-copy h2 em{font-family:var(--serif);font-weight:500;color:var(--olive-deep);letter-spacing:-.03em}
.road-copy>p:not(.kicker){margin:24px 0 0;max-width:520px;color:var(--muted);font-size:17px}
.road-facts{list-style:none;margin:34px 0 0;padding:0;display:grid;gap:0;border-top:1px solid var(--line)}
.road-facts li{display:grid;grid-template-columns:120px 1fr;gap:18px;padding:15px 0;border-bottom:1px solid var(--line);font-size:14px}
.road-facts b{font-weight:780}
.road-facts span{color:var(--muted)}
.road-visual{position:relative;margin:0;aspect-ratio:1.45/1}
.road-lines{position:absolute;left:-4%;bottom:-10%;width:112%;height:70%;z-index:0}
.road-lines path{fill:none;stroke:var(--lime-deep);stroke-width:2.5;stroke-dasharray:1400;stroke-dashoffset:calc(1400 - var(--rp,0)*1400);opacity:.8}
.road-lines path:nth-child(2){stroke:var(--olive);opacity:.55}
.road-lines path:nth-child(3){opacity:.35}
.road-car{position:relative;z-index:1;width:100%;height:100%;object-fit:cover;border-radius:20px;box-shadow:0 50px 100px #20251f40;transform:translateX(calc((1 - var(--rp,0))*22%)) rotate(calc((1 - var(--rp,0))*-2deg));opacity:calc(.25 + var(--rp,0)*.75)}
.road-visual figcaption{position:absolute;z-index:2;left:16px;bottom:14px;padding:5px 10px;border-radius:99px;background:#fffdf8e0;font-size:10px;color:var(--muted)}

/* ---------- portal flattens as it arrives ---------- */
.portal-stage{position:relative;perspective:1800px;margin-top:55px}
.v2 .portal-shell{margin-top:0;border-radius:16px;overflow:hidden;transform-origin:50% 0;transform:rotateX(calc((1 - var(--pp,0))*24deg)) scale(calc(.9 + var(--pp,0)*.1));box-shadow:0 60px 120px #26301f30}
.portal-toast{position:absolute;right:-18px;top:90px;display:flex;align-items:center;gap:12px;padding:14px 18px;border-radius:14px;background:var(--paper);box-shadow:0 24px 60px #20251f33;opacity:0;transform:translateY(20px) scale(.95);transition:opacity .6s .2s,transform .7s var(--ease) .2s}
.portal-toast.show{opacity:1;transform:none;animation:toast-nudge 4s ease-in-out 1.4s infinite}
.portal-toast p{margin:0}.portal-toast b,.portal-toast small{display:block}.portal-toast b{font-size:13px}.portal-toast small{font-size:11px;color:var(--muted)}
@keyframes toast-nudge{0%,90%,100%{transform:none}94%{transform:translateX(-5px)}97%{transform:translateX(3px)}}

/* ---------- confidence: Topo floats ---------- */
.v2 .confidence{overflow:hidden}
.dog-stage{position:relative;display:grid;place-items:center;min-height:560px;margin:0}
.dog-halo{position:absolute;width:420px;height:420px;border-radius:50%;background:radial-gradient(circle,#c9e2653b 0,#c9e26500 70%);animation:halo 4s ease-in-out infinite}
@keyframes halo{50%{transform:scale(1.12);opacity:.7}}
.dog-float{position:relative;width:min(380px,80%);height:auto;filter:drop-shadow(0 40px 40px #0007);animation:dog-float 5s ease-in-out infinite}
@keyframes dog-float{50%{transform:translateY(-14px) rotate(-1.5deg)}}
.dog-bubble{position:absolute;top:40px;right:6%;padding:12px 16px;border-radius:16px 16px 16px 4px;background:var(--paper);color:var(--ink);font-family:var(--serif);font-size:19px;box-shadow:0 20px 40px #0004;opacity:0;transform:scale(.6) translateY(10px);transform-origin:0 100%;transition:opacity .4s .5s,transform .6s cubic-bezier(.3,1.6,.5,1) .5s}
.confidence .reveal.in~.dog-stage .dog-bubble,.dog-stage.in .dog-bubble{opacity:1;transform:none}
.v2 .confidence figcaption{position:static;margin-top:10px;color:#c5cabf;font-size:12px;text-align:center;max-width:380px}
.v2 .confidence figure img{object-fit:contain}

/* ---------- business + contact ---------- */
.v2 .portfolio-preview{border-radius:14px;overflow:hidden}
.portfolio-note{margin:0;padding:10px 22px;font-size:10px;color:var(--muted);border-top:1px solid var(--line)}
.form-stage{position:relative}
.form-dog{position:absolute;right:34px;top:-104px;width:118px;height:auto;z-index:0;transform:translateY(40px);opacity:0;transition:transform .8s cubic-bezier(.3,1.5,.5,1) .3s,opacity .4s .3s}
.form-stage.in .form-dog{transform:none;opacity:1}
.form-stage form{position:relative;z-index:1}
.v2 .contact form{border-radius:16px}

/* ---------- footer ---------- */
.v2-footer{padding:120px 0 40px;background:var(--dark);color:#eef1e2;overflow:hidden}
.footer-big{margin:0;font-size:clamp(46px,8vw,128px);font-weight:720;line-height:.95;letter-spacing:-.06em}
.footer-big em{font-family:var(--serif);font-weight:500;color:var(--lime);letter-spacing:-.035em}
.footer-row{display:flex;flex-wrap:wrap;gap:28px;align-items:center;margin-top:80px;padding-top:26px;border-top:1px solid #ffffff1f;font-size:13px}
.footer-row a{text-decoration:none}.footer-row a:hover{color:var(--lime)}
.footer-row .wordmark{margin-right:auto;font-size:22px}
.footer-note{color:#ffffff66;font-size:11px}

/* ---------- reveal (only once JS is known to run) ---------- */
.v2-js .reveal{opacity:0;transform:translateY(34px);transition:opacity .9s var(--ease),transform 1.1s var(--ease)}
.v2-js .reveal.in{opacity:1;transform:none}
.v2-js .hx .reveal{transition-delay:.45s}
.v2-js .hx .hx-lead{transition-delay:.55s}.v2-js .hx .hx-search{transition-delay:.65s}.v2-js .hx .hx-chips{transition-delay:.75s}.v2-js .hx .reassurance{transition-delay:.85s}
.v2-js .shift.reveal{transform:none}
.v2-js .tilt.reveal.in{transform:perspective(1100px) rotateX(var(--trx,0deg)) rotateY(var(--try,0deg))}

/* ---------- smaller screens ---------- */
@media(max-width:1050px){
  .v2 .v2-header nav{display:none}
  .v2 .v2-header .language-switcher{margin-left:auto}
  .hx-parallax{inset:0}
  .road-grid{grid-template-columns:1fr;gap:50px}
  .portal-toast{right:12px;top:auto;bottom:-24px}
}
@media(max-width:860px){
  .hx{display:flex;flex-direction:column;min-height:0;padding-top:74px;background:var(--cream)}
  .hx-copy{order:-1}
  .v2 .hx-stage.hero-scene{position:relative;inset:auto;height:min(118vw,560px);margin:0 12px;border-radius:26px;z-index:0}
  .hx-shade{background:linear-gradient(0deg,#20251f40 0,#20251f00 30%)}
  .hx-copy{padding:18px 0 26px}
  .hx-title{font-size:clamp(46px,13vw,72px)}
  .hx-lead{font-size:16px;margin-top:20px}
  .hx-search{padding-left:14px}
  .hx-search button span:first-child{display:none}
  .hx-scroll{display:none}
  .v2 .hx figcaption{right:auto;left:14px;bottom:14px}
  .v2 .hx .motion-toggle{bottom:14px;right:14px}
  .shift{grid-template-columns:1fr;gap:10px}
  .v2 .v2-scrub{height:auto}
  .scrub-sticky{position:relative;height:auto;padding:90px 0}
  .v2 .transform-visual{transform:none}
  .journey-track{display:none}
  .dog-stage{min-height:420px}
  .form-dog{top:-86px;width:96px}
}
@media(max-width:720px){.scrub-sticky>.wrap{width:calc(100% - 30px)}.manifest{padding:90px 0}.roadtrip{padding:90px 0}.v2-footer{padding-top:80px}}

@media(prefers-reduced-motion:reduce){
  .hx-parallax,.road-car,.v2 .portal-shell,.v2 .transform-visual{transform:none!important}
  .road-car{opacity:1}
  .road-lines path{stroke-dashoffset:0}
  .ticker-track{animation:none}
  .v2-js .reveal{opacity:1;transform:none}
  .shift .now{opacity:1;transform:none}
  .hx-title .line{animation:none}
  .hx-reticle{display:none}
}

/* overflow-x:hidden on html/body turns them into scroll containers and kills position:sticky; clip keeps the guard without that */
html:has(body.v2),body.v2{overflow-x:clip}

/* confidence: undo the v1 figure geometry so Topo sits centred with room for the bubble */
.v2 .confidence figure.dog-stage{height:auto;min-height:600px;align-self:center;padding:90px 0 40px;background:none}
.v2 .confidence figure.dog-stage::before{display:none}
.v2 .confidence figure.dog-stage img{position:relative;left:auto;bottom:auto;width:min(360px,76%);height:auto;transform:none}
.v2 .confidence figure.dog-stage figcaption{position:static;max-width:380px;padding:0;background:none;color:#c5cabf;font-family:var(--font);font-size:12px}
.v2 .dog-bubble{top:96px;right:14%}
@media(max-width:860px){.v2 .confidence figure.dog-stage{min-height:0;padding-top:80px}}

/* situation cards 02/03: real scenes instead of the CSS placeholders */
.v2 .story-visual-side{min-height:0;height:100%;position:relative}
.v2 .story-visual-side img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:35% center}
.v2 .story:not(.story-large){grid-template-columns:1fr 1fr}
@media(max-width:720px){.v2 .story:not(.story-large){grid-template-columns:1fr}.v2 .story-visual-side{height:230px}}

/* the running Topo on the journey line: a gallop, not a bob */
.v2 .journey-dog{width:112px;bottom:22px;animation:dog-gallop .34s ease-in-out infinite alternate;animation-play-state:var(--walk,paused)}
@keyframes dog-gallop{0%{translate:0 0;rotate:-3deg}100%{translate:0 -9px;rotate:4deg}}
.v2 .journey-dog.done{animation:none;rotate:0deg}
.v2 .story:not(.story-large){grid-template-columns:1.25fr 1fr}
.v2 .story-visual-side img[src*="asbuilt"]{object-position:4% center}
.v2 .story-visual-side img[src*="boundary"]{object-position:66% center}
/* handover: mirrored field-day layout, image slides in from the left */
.v2 .handover{padding-top:40px;background:linear-gradient(#f4f1e8,#ecebe0)}
.v2 .handover .road-grid{grid-template-columns:1.2fr .8fr}
.v2 .handover-visual .road-car{transform:translateX(calc((1 - var(--rp,0))*-22%)) rotate(calc((1 - var(--rp,0))*2deg))}
@media(max-width:1050px){.v2 .handover .road-grid{grid-template-columns:1fr}.v2 .handover .road-copy{order:-1}}
/* longer languages: keep the hero headline to three lines and the search above the fold */
html:is([lang=de],[lang=ru],[lang=uk],[lang=lt],[lang=et]) .v2 .hx-title{font-size:clamp(46px,5.9vw,92px)}
html:is([lang=de],[lang=ru],[lang=uk],[lang=lt]) .v2 .hx-lead{font-size:17px}
html:is([lang=de],[lang=ru],[lang=uk]) .v2 .manifest-head h2,html:is([lang=de],[lang=ru],[lang=uk]) .v2 .footer-big{font-size:clamp(40px,5.2vw,80px)}
.pin-dog{display:block;width:210px;height:auto;margin-top:40px;filter:drop-shadow(0 24px 30px #0008);animation:pin-sniff 3.2s ease-in-out infinite}
@keyframes pin-sniff{0%,70%,100%{transform:translateY(0) rotate(0)}78%{transform:translateY(-4px) rotate(-2deg)}86%{transform:translateY(0) rotate(1deg)}}
@media(max-width:1050px){.pin-dog{width:150px;margin-top:24px}}

/* ===== mobile hero v2: full-bleed scene, text on a dark fade, glass search ===== */
@media(max-width:860px){
  .hx{display:block;min-height:100svh;padding:0;background:#1d2219;overflow:hidden}
  .v2 .hx-stage.hero-scene{position:absolute;inset:0;height:auto;margin:0;border-radius:0;z-index:0}
  /* the box keeps the picture's own ratio so the SVG overlay stays glued to it; we slide it instead of object-position */
  .hx-parallax{inset:0 auto 0 50%;height:100%;width:auto;aspect-ratio:1672/941;transform:translateX(-55%)!important;animation:hx-kenburns 16s ease-in-out infinite alternate}
  @keyframes hx-kenburns{from{scale:1.06}to{scale:1}}
  .hx-img{object-fit:fill}
  .hx-survey{display:none}
  .hx-shade{background:linear-gradient(180deg,#f4f1e8 0,#f4f1e800 96px),linear-gradient(180deg,#1d221900 26%,#1d22198c 46%,#1d2219eb 64%,#1d2219 100%)}
  .hx-copy{position:relative;z-index:2;padding:44svh 0 34px;color:#f4f1e8}
  .v2 .hx .eyebrow{color:var(--lime);margin-bottom:14px;font-size:10px}
  .v2 .hx .eyebrow>span:first-child{background:var(--lime);box-shadow:0 0 0 5px #c9e26533}
  .hx-title{color:#fffdf6;font-size:clamp(44px,12.5vw,64px);text-shadow:0 2px 30px #0006}
  .hx-title em.line{color:var(--lime)}
  .hx-lead{color:#dfe4d4;font-size:15.5px;line-height:1.55;margin-top:16px}
  .hx-search{margin-top:22px;background:#fffdfa24;border-color:#ffffff40;backdrop-filter:blur(16px) saturate(1.4);-webkit-backdrop-filter:blur(16px) saturate(1.4);box-shadow:0 20px 50px #0006}
  .hx-search input{color:#fff}.hx-search input::placeholder{color:#ffffffb0}
  .hx-search-pin{color:var(--lime)}
  .hx-search button{background:var(--lime);color:var(--ink)}
  .hx-chips{flex-wrap:nowrap;overflow-x:auto;margin:14px -16px 0;padding:0 16px 4px;scrollbar-width:none;-webkit-mask:linear-gradient(90deg,#000 88%,transparent)}
  .hx-chips::-webkit-scrollbar{display:none}
  .hx-chips>span{display:none}
  .hx-chips a{flex:none;background:#ffffff1c;border-color:#ffffff33;color:#fff;backdrop-filter:blur(10px)}
  .v2 .hx .reassurance{color:#c9d0bd}.v2 .hx .reassurance>span:first-child{color:var(--lime)}
  .v2 .v2-header:not(.scrolled) .language-switcher>button{color:var(--ink)}
}
@media(max-width:860px){
  .hx-parallax{top:56px;bottom:auto;height:min(64svh,560px);transform:translateX(-58%)!important}
  .hx-shade{background:linear-gradient(180deg,#f4f1e8 0,#f4f1e800 110px),linear-gradient(180deg,#1d221900 30%,#1d2219a0 48%,#1d2219f2 62%,#1d2219 100%)}
  .hx-copy{padding-top:47svh}
}
@media(max-width:860px){
  .hx-parallax{transform:translateX(-53%)!important}
  .hx-copy{padding-top:50svh}
  .journey-track{display:block;height:84px;margin:34px 0 18px}
  .journey-track::before,.journey-fill{bottom:14px}
  .v2 .journey-dog{width:86px;bottom:12px}
  .v2 .journey-rail li{padding:18px 0 18px 18px;border-left:2px solid #d3d8c4;transition:border-color .4s}
  .v2 .journey-rail li.lit{border-left-color:var(--lime-deep)}
}
@media(max-width:860px){.hx{background:linear-gradient(180deg,#f4f1e8 0,#f4f1e8 60px,#1d2219 60px)}}
@media(max-width:860px){
  .journey-track{position:sticky;top:62px;z-index:5;margin:24px -16px 8px;padding:0 16px;height:78px;background:linear-gradient(#ecebe0 82%,#ecebe000)}
  .journey-track::before,.journey-fill{left:16px;right:16px}
  .journey-fill{width:calc(var(--jp,0)*(100% - 32px))}
  .v2 .journey-dog{left:calc(16px + var(--jp,0)*(100% - 32px))}
  .v2 .journey-rail{gap:10px}
  .v2 .journey-rail li{display:grid;grid-template-columns:56px 1fr;column-gap:14px;align-items:start;padding:14px 0 14px 14px}
  .v2 .journey-rail li .step-no{position:static;grid-column:2;margin:0}
  .v2 .journey-rail li .step-icon{grid-row:1/span 4;grid-column:1;width:52px;height:52px;font-size:20px;margin:0}
  .v2 .journey-rail li h3{grid-column:2;margin:2px 0 6px}
  .v2 .journey-rail li p{grid-column:2;margin:2px 0}
}
@media(max-width:860px){.journey-track{top:64px;height:96px;padding-top:14px}.v2 .journey-dog{width:78px}}

/* ===== map: tiles must not clip at the frame while the layer slides (the canvas clips) ===== */
.v2 .map-world{overflow:visible}
.v2 .map-canvas{overflow:hidden;border-radius:0}

/* ===== property finder on phones: a real app screen, not a squeezed desktop ===== */
.v2 .map-controls button{border-radius:12px;background:#fffdf5d9;backdrop-filter:blur(10px);border-color:#ffffff99}
.v2 .map-object-card{border-radius:14px;border-left-width:0;box-shadow:0 14px 34px #20251f33;background:#fffdf4e6;backdrop-filter:blur(12px)}
.v2 .map-object-card [data-map-select]{border-radius:99px}
@media(max-width:860px){
  .v2 .property-section{padding:80px 0 70px}
  .v2 .property-app{margin-inline:-6px;border-radius:22px}
  .v2 .app-top{padding:12px 16px;font-size:9px}
  .v2 .map-canvas{height:min(62svh,470px)}
  .v2 .map-controls{flex-direction:column;top:auto;bottom:74px;right:12px;gap:8px}
  .v2 .map-controls button{width:42px;height:42px;min-width:0;padding:0;border-radius:50%;display:grid;place-items:center;font-size:16px}
  .v2 .map-controls [data-map-tour-toggle] span:last-child{display:none}
  .v2 .map-object-card{left:12px;right:12px;top:12px;width:auto;max-width:none;display:grid;grid-template-columns:1fr auto;align-items:center;column-gap:12px;padding:12px 12px 12px 16px}
  .v2 .map-object-card small,.v2 .map-object-card b,.v2 .map-object-card>span{grid-column:1}
  .v2 .map-object-card b{font-size:16px;margin-top:2px}
  .v2 .map-object-card>span{font-size:10px}
  .v2 .map-object-card [data-map-select]{grid-column:2;grid-row:1/span 3;margin:0;width:44px;height:44px;padding:0;font-size:0;display:grid;place-items:center;background:var(--lime);color:var(--ink)}
  .v2 .map-object-card [data-map-select] span[aria-hidden]{font-size:18px}
  .v2 .map-status{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
  .v2 .map-attribution{left:auto;right:8px;bottom:6px;max-width:70%;font-size:7px;padding:2px 6px;border-radius:99px;background:#fffdf5c0;text-align:right}
  .v2 .property-sheet{margin:-34px 10px 10px;width:auto;border-radius:18px;padding:20px 16px 16px;box-shadow:0 -10px 40px #20251f38}
  .v2 .property-sheet h3{font-size:24px;margin-bottom:12px}
  .v2 .search-box{grid-template-columns:40px 1fr 52px;border-radius:14px;overflow:hidden;border-color:#c9cfbd}
  .v2 .search-box input{height:52px;font-size:16px}
  .v2 .search-box button{grid-column:auto;width:52px;height:52px;padding:0;font-size:0;background:var(--ink);position:relative}
  .v2 .search-box button::after{content:"→";font-size:20px;color:var(--lime)}
  .v2 .sheet-options{flex-direction:row;gap:8px;margin-top:12px}
  .v2 .sheet-options button{flex:1;justify-content:center;border:1px solid var(--line);border-radius:99px;padding:10px 12px;font-size:12px;background:#fff}
  .pin-dog{display:none}
}
@media(max-width:860px){
  .manifest-head h2{font-size:clamp(34px,10vw,48px)}
  .shift-list{border-top:0;margin-top:36px;display:grid;gap:14px}
  .shift{position:relative;display:block;padding:16px;border:1px solid var(--line);border-radius:20px;background:#fffdf8e6;box-shadow:0 14px 40px #26301f14}
  .shift-no{position:absolute;right:16px;top:16px}
  .shift .was{font-size:14px;padding-right:34px}
  .shift .was::before{content:"✕ ";color:#8b3826;font-weight:800}
  .shift .now{margin-top:12px;padding:14px 16px;border-radius:14px;background:var(--dark);color:#f4f1e8;font-size:18px;box-shadow:0 10px 24px #20251f40}
  .shift .now::before{content:"✓ ";color:var(--lime)}
}
@media(max-width:1050px){.v2 .roadtrip .road-visual{order:-1}.v2 .handover .road-copy{order:0}}
@media(max-width:860px){.v2 .road-grid{gap:28px}.v2 .road-visual{margin:0 -6px}.v2 .road-car{border-radius:22px}}
.v2 .button{border-radius:99px}
.v2 .portal-intro .button{padding-inline:22px}
@media(max-width:860px){
  .v2 .portal-intro .button{width:100%}
  .portal-stage{perspective:none;margin:34px auto 0;max-width:340px}
  .v2 .portal-shell{transform:none;display:block;border:10px solid #1d2219;border-radius:42px;min-height:0;box-shadow:0 40px 80px #20251f55,inset 0 0 0 1px #ffffff20;position:relative;padding-top:26px;background:#f7f7f1}
  .v2 .portal-shell::before{content:"";position:absolute;top:8px;left:50%;width:96px;height:22px;margin-left:-48px;border-radius:99px;background:#1d2219;z-index:3}
  .v2 .portal-shell aside{display:none}
  .v2 .portal-main{padding:14px 14px 18px}
  .v2 .portal-bar h3{font-size:16px}
  .v2 .next-action{display:grid;grid-template-columns:40px 1fr;gap:10px;border-radius:16px;padding:14px}
  .v2 .next-action .checkmark{width:40px;height:40px}
  .v2 .next-action button{grid-column:1/-1;border-radius:99px;background:var(--dark);color:#fff}
  .v2 .portal-columns{display:grid;gap:10px;margin-top:10px}
  .v2 .timeline,.v2 .contact-card{border-radius:16px;padding:14px}
  .portal-toast{right:-6px;top:auto;bottom:-18px;left:18px}
}
@media(max-width:860px){.v2 .portal-shell .contact-card{display:none}.v2 .portal-bar button{border-radius:50%}.v2 .timeline li{margin-bottom:14px}}
/* phone dock: the two actions that matter, always one thumb away */
.m-dock{display:none}
@media(max-width:860px){
  .m-dock{display:flex;gap:8px;position:fixed;z-index:70;left:12px;right:12px;bottom:calc(12px + env(safe-area-inset-bottom));padding:8px;border-radius:99px;background:#1d2219e8;backdrop-filter:blur(16px) saturate(1.3);-webkit-backdrop-filter:blur(16px) saturate(1.3);box-shadow:0 18px 40px #0006;transform:translateY(140%);transition:transform .45s var(--ease)}
  .m-dock.show{transform:none}
  .m-dock a{display:flex;align-items:center;justify-content:center;gap:8px;height:48px;border-radius:99px;text-decoration:none;font-weight:780;font-size:14px}
  .m-dock-main{flex:1;background:var(--lime);color:var(--ink)}
  .m-dock-side{padding:0 18px;color:#f4f1e8;border:1px solid #ffffff2e}
  .v2 .faq details{border:1px solid var(--line);border-bottom:1px solid var(--line);border-radius:16px;padding:16px 18px;margin-bottom:10px;background:#fffdf8}
  .v2 .faq-list{border-top:0}
  .v2 .faq details[open]{box-shadow:0 14px 34px #26301f14}
  .v2 .contact form{border-radius:22px}
  .v2 .contact input,.v2 .contact textarea{border-radius:12px}
  .v2 .v2-footer{padding-bottom:110px}
}

/* ===== explainer: one real place → surveyed → plan ===== */
.v2 .transform-visual.ex{position:relative;aspect-ratio:3/2;height:auto;background:#1d2219}
.ex-img,.ex-measure{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.ex-place{transition:filter .8s,transform 1.2s var(--ease)}
.ex-plan{opacity:0;transform:scale(1.04);transition:opacity .9s var(--ease),transform 1.2s var(--ease)}
.ex-measure{opacity:0;transition:opacity .5s}
.ex-fill{fill:var(--lime);opacity:0;transition:opacity .8s 1.4s}
.ex-line{fill:none;stroke:#fff;stroke-width:5;stroke-linejoin:round;stroke-dasharray:1;stroke-dashoffset:1;filter:drop-shadow(0 3px 4px #0006)}
.ex-corner circle:first-child{fill:#fff;stroke:var(--olive-deep);stroke-width:5}
.ex-corner circle:last-child{fill:none;stroke:#fff;stroke-width:3;transform-box:fill-box;transform-origin:center;opacity:0}
.ex-spot path{stroke:#fff;stroke-width:4;stroke-linecap:round;filter:drop-shadow(0 2px 2px #0007)}
.ex-corner,.ex-spot,.ex-dims text{opacity:0}
.ex-dims text{font:700 30px/1 Inter,ui-sans-serif,system-ui,sans-serif;fill:#fff;paint-order:stroke;stroke:#20251fb0;stroke-width:8px;text-anchor:middle}
.ex[data-current-view=measure] .ex-place{filter:saturate(.75) brightness(.82)}
.ex[data-current-view=measure] .ex-measure{opacity:1}
.ex[data-current-view=measure] .ex-line{animation:ex-draw 1.6s .5s var(--ease) forwards}
.ex[data-current-view=measure] .ex-fill{opacity:.22}
.ex[data-current-view=measure] .ex-corner{animation:ex-pop .5s var(--d) cubic-bezier(.3,1.6,.5,1) forwards}
.ex[data-current-view=measure] .ex-corner circle:last-child{animation:hx-ping 1.3s calc(var(--d) + .2s) var(--ease) forwards}
.ex[data-current-view=measure] .ex-spot{animation:ex-pop .4s var(--d) ease-out forwards}
.ex[data-current-view=measure] .ex-dims text{animation:ex-fade .6s var(--d) ease forwards}
.ex[data-current-view=plan] .ex-plan{opacity:1;transform:none}
.ex[data-current-view=plan] .ex-place{transform:scale(1.04)}
@keyframes ex-draw{to{stroke-dashoffset:0}}
@keyframes ex-pop{from{opacity:0;transform:translateY(-18px)}to{opacity:1;transform:none}}
@keyframes ex-fade{to{opacity:1}}
.ex-corner,.ex-spot{transform-box:fill-box}
.v2 .transform-visual.ex>p{position:absolute;z-index:3;right:12px;bottom:10px;margin:0;padding:4px 10px;border-radius:99px;background:#fffdf8d9;font-size:10px;color:var(--muted)}
@media(max-width:860px){.v2 .transform-visual.ex{border-radius:20px}}
.v2 .view-tabs{gap:6px;padding:5px;border-radius:99px;background:#fffdf8b0;border:1px solid var(--line);width:max-content}
.v2 .view-tabs button{border:0;border-radius:99px;padding:10px 18px;font-size:12px;transition:background .3s,color .3s}
.v2 .view-tabs button[aria-selected=true]{background:var(--dark);color:#fff}

/* ===== the landing shows the real portal, live, in a phone ===== */
.portal-live{display:grid;grid-template-columns:auto 1fr;gap:64px;align-items:center;margin-top:50px}
.phone-live{width:390px;height:800px;border-radius:52px;border:12px solid #1d2219;background:#1d2219;box-shadow:0 60px 120px #20251f45,inset 0 0 0 1px #ffffff1a;overflow:hidden;position:relative}
.phone-live::before{content:"";position:absolute;z-index:2;top:8px;left:50%;width:110px;height:26px;margin-left:-55px;border-radius:99px;background:#1d2219}
.phone-live iframe{width:100%;height:100%;border:0;border-radius:40px;background:#f4f1e8}
.portal-points ul{list-style:none;padding:0;margin:18px 0 0;display:grid;gap:14px}
.portal-points li{padding:18px 20px;border-radius:20px;background:#fffdf8;border:1px solid var(--line);box-shadow:0 12px 30px #26301f0f}
.portal-points li b{display:block;font-size:18px;letter-spacing:-.02em}
.portal-points li span{color:var(--muted);font-size:14.5px}
.row-btns{display:flex;flex-wrap:wrap;gap:10px;margin-top:22px}
@media(max-width:1050px){.portal-live{grid-template-columns:1fr;justify-items:center;gap:34px}.portal-points{width:100%}}
@media(max-width:860px){.phone-live{width:min(360px,100%);height:720px;border-width:10px}}
.footer-legal{margin-top:0;padding-top:14px;border-top:0;font-size:12px;opacity:.8;gap:18px}
/* wordmark: SVG mark + tight live text (temporary until a logo is approved) */
.wordmark{display:inline-flex;align-items:center;gap:.4em;letter-spacing:-.045em}
.wm-mark{width:1.3em;height:1.3em;flex:none;border-radius:.34em;box-shadow:0 2px 6px #1d221933}
.wm-pin{display:none}
