:root{
  --bg:#0c0d0a;
  --bg-2:#13150f;
  --line:rgba(233,231,223,.12);
  --line-2:rgba(233,231,223,.22);
  --ink:#e9e7df;
  --ink-2:#b4b5a9;
  --ink-3:#85877b;
  --brand:#88ac2e;          /* PVZ logo green */
  --brand-hi:#a3c946;
  --charcoal:#404041;       /* PVZ logo box */
  --ease-out:cubic-bezier(0.23,1,0.32,1);
  --ease-in-out:cubic-bezier(0.77,0,0.175,1);
  --pad:clamp(16px,4vw,56px);
  --display:'Archivo',system-ui,sans-serif;
  --mono:'JetBrains Mono',ui-monospace,monospace;
  /* z scale: canvas 0, content 1, nav 20, grain 30 */
}
*{box-sizing:border-box;margin:0;padding:0}
html{background:var(--bg);color-scheme:dark;-webkit-text-size-adjust:100%}
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}
body{background:var(--bg);color:var(--ink);font-family:var(--display);font-size:18px;line-height:1.55;overflow-x:hidden;-webkit-font-smoothing:antialiased}
img{display:block;max-width:100%}
a{color:inherit}
::selection{background:var(--brand);color:#0c0d0a}
:focus-visible{outline:2px solid var(--brand-hi);outline-offset:3px;border-radius:2px}
html{scrollbar-color:#3a3d33 var(--bg);scrollbar-width:thin}
::-webkit-scrollbar{width:10px;height:10px}
::-webkit-scrollbar-track{background:var(--bg)}
::-webkit-scrollbar-thumb{background:#3a3d33;border-radius:10px;border:2px solid var(--bg)}

.grain{position:fixed;inset:-50%;z-index:30;pointer-events:none;opacity:.06;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
#scene{position:fixed;inset:0;width:100vw;height:100vh;height:100lvh;z-index:0;display:block;pointer-events:none}
main,.foot{position:relative;z-index:1}

.ico{width:1.1em;height:1.1em;flex:none}
.btn{--h:52px;display:inline-flex;align-items:center;gap:.6em;height:var(--h);padding:0 26px;border-radius:999px;font:600 15px/1 var(--display);font-stretch:105%;letter-spacing:.01em;text-decoration:none;white-space:nowrap;cursor:pointer;
  transition:transform 160ms var(--ease-out),background-color 200ms ease,color 200ms ease,border-color 200ms ease}
.btn:active{transform:scale(.97)}
.btn-solid{background:var(--brand);color:#0c0d0a}
.btn-ghost{border:1px solid var(--line-2);color:var(--ink);background:rgba(12,13,10,.35);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.btn-sm{--h:40px;padding:0 18px;font-size:14px}
@media (hover:hover) and (pointer:fine){
  .btn-solid:hover{background:var(--brand-hi)}
  .btn-ghost:hover{border-color:var(--ink)}
  .btn-solid:hover .ico{transform:translateX(3px)}
}
.btn .ico{transition:transform 200ms var(--ease-out)}

/* NAV */
.nav{position:fixed;top:0;left:0;right:0;z-index:20;height:76px;display:flex;align-items:center;gap:32px;padding:0 var(--pad);
  transition:background-color 300ms ease,backdrop-filter 300ms ease,border-color 300ms ease;border-bottom:1px solid transparent}
.nav.scrolled{background:rgba(12,13,10,.72);backdrop-filter:blur(14px) saturate(140%);-webkit-backdrop-filter:blur(14px) saturate(140%);border-bottom-color:var(--line)}
.nav-logo img{height:48px;width:auto}
.nav-links{display:flex;gap:26px;margin-left:auto;font-size:14px;color:var(--ink-2);font-weight:500}
.nav-links a{white-space:nowrap;text-decoration:none;color:var(--ink-2);padding:8px 2px;transition:color 200ms ease}
@media (hover:hover){.nav-links a:hover{color:var(--ink)}}
.nav-tel{display:none;align-items:center;gap:8px;font:500 14px var(--mono);color:var(--ink);text-decoration:none;white-space:nowrap}
.nav-tel .ico{filter:invert(.9)}
@media (min-width:1280px){.nav-tel{display:inline-flex}}
.nav-end{display:flex;align-items:center;gap:18px}
.lang{font:500 12px var(--mono);color:var(--ink-3);letter-spacing:.06em}
@media (max-width:1180px){.nav-links{display:none}.nav-end{margin-left:auto}}

/* HERO */
.hero{min-height:100svh;min-height:100dvh;position:relative;display:flex;flex-direction:column;justify-content:flex-end;padding:96px var(--pad) clamp(40px,7vh,88px)}
.hero::before{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse 66% 78% at 96% 96%,rgba(12,13,10,.94),rgba(12,13,10,.78) 42%,rgba(12,13,10,.3) 68%,transparent 85%),linear-gradient(to top,rgba(12,13,10,.6),transparent 30%),linear-gradient(to bottom,rgba(12,13,10,.6),transparent 15%)}
.hero-copy{position:relative;max-width:min(980px,100%)}
.hero-title{font-size:clamp(44px,6.3vw,104px);line-height:.92;font-weight:800;font-stretch:72%;letter-spacing:-.025em;text-transform:uppercase;text-wrap:balance}
.hero-title .line{display:block}
.hero-title .line:last-child{color:var(--brand)}
.hero-sub{margin-top:24px;max-width:46ch;font-size:clamp(17px,1.35vw,20px);color:var(--ink);text-wrap:pretty}
.hero-cta{margin-top:32px;display:flex;flex-wrap:wrap;gap:12px}
@media (min-width:861px){
  .hero-copy{margin-left:auto;max-width:min(740px,52vw)}
  .hero-title{font-size:clamp(44px,5vw,86px)}
}
/* photo-only page (?hero=photo): photo is mirrored, so the empty road is bottom-left */
@media (min-width:861px){
  .hero-photo .hero-copy{margin-left:0}
  .hero-photo .hero::before{background:radial-gradient(ellipse 66% 78% at 4% 96%,rgba(12,13,10,.94),rgba(12,13,10,.78) 42%,rgba(12,13,10,.3) 68%,transparent 85%),linear-gradient(to top,rgba(12,13,10,.6),transparent 30%),linear-gradient(to bottom,rgba(12,13,10,.6),transparent 15%)}
  .hero-photo .hero-status{left:auto;right:var(--pad)}
}
/* 3D-model version of the hero (?hero=3d): copy bottom-left, complex top-right */
@media (min-width:861px){
  .hero-3d .hero-copy{margin-left:0;max-width:min(980px,100%)}
  .hero-3d .hero-title{font-size:clamp(44px,6.3vw,104px)}
  .hero-3d .hero::before{background:radial-gradient(ellipse 60% 55% at 12% 88%,rgba(12,13,10,.88),transparent 72%),linear-gradient(to top,rgba(12,13,10,.75),transparent 42%),linear-gradient(to bottom,rgba(12,13,10,.55),transparent 16%)}
  .hero-3d .hero-status{left:auto;right:var(--pad)}
}
.hero-status{position:absolute;left:var(--pad);bottom:clamp(40px,7vh,88px);display:flex;align-items:center;gap:10px;font:500 13px var(--mono);color:var(--ink-2);letter-spacing:.02em}
.status-dot{width:8px;height:8px;border-radius:50%;background:var(--ink-3)}
.hero-status.open .status-dot{background:var(--brand);box-shadow:0 0 0 0 rgba(136,172,46,.6);animation:ping 2.4s var(--ease-out) infinite}
@keyframes ping{0%{box-shadow:0 0 0 0 rgba(136,172,46,.55)}80%,100%{box-shadow:0 0 0 12px rgba(136,172,46,0)}}

/* hero intro (JS adds .ready) */
.js .hero-title .line,.js .hero-sub,.js .hero-cta,.js .hero-status,.js .nav{opacity:0}
.js .hero-title .line{transform:translateY(40%);filter:blur(10px)}
.js .hero-sub,.js .hero-cta{transform:translateY(16px)}
.ready .hero-title .line,.ready .hero-sub,.ready .hero-cta,.ready .hero-status,.ready .nav{opacity:1;transform:none;filter:none;
  transition:opacity 900ms var(--ease-out),transform 1100ms var(--ease-out),filter 900ms var(--ease-out),background-color 300ms ease,border-color 300ms ease}
.ready .hero-title .line:nth-child(1){transition-delay:350ms}
.ready .hero-title .line:nth-child(2){transition-delay:450ms}
.ready .hero-sub{transition-delay:650ms}
.ready .hero-cta{transition-delay:750ms}
.ready .hero-status{transition-delay:1100ms}
.ready .nav{transition-delay:200ms}

/* scroll room for the photo -> 3D -> submarine dive (merged hero only) */
.dive{height:0}
.hero-mix .dive{height:120vh}

/* XXL */
.xxl{position:relative;height:500vh}
.xxl-pin{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden;padding:110px var(--pad) 56px;display:grid;grid-template-columns:minmax(0,440px) 1fr;grid-template-rows:auto 1fr auto;gap:0 40px}
.xxl-heading{grid-column:1/-1;font-size:clamp(28px,3.4vw,52px);font-weight:800;font-stretch:72%;text-transform:uppercase;line-height:.95;letter-spacing:-.02em;max-width:22ch}
.xxl-rail{grid-column:1;grid-row:3;list-style:none;display:flex;gap:18px;font:500 12px var(--mono);color:var(--ink-3);letter-spacing:.04em;text-transform:uppercase}
.xxl-rail li{transition:color 300ms ease}
.xxl-rail li.on{color:var(--ink)}
.xxl-cards{grid-column:1;grid-row:2;display:grid;align-items:center}
.xcard{grid-area:1/1;opacity:0;pointer-events:none;visibility:hidden}
.xcard.on{opacity:1;visibility:visible;pointer-events:auto}
.xcard h3{font-size:clamp(26px,2.6vw,38px);font-weight:700;font-stretch:85%;line-height:1.02;letter-spacing:-.01em}
.xcard p{margin-top:14px;color:var(--ink-2);max-width:40ch}
.specs{margin-top:28px;display:grid;grid-template-columns:repeat(3,auto);justify-content:start;align-items:end;gap:22px 34px}
.specs div{display:flex;flex-direction:column-reverse;gap:6px}
.specs dt{font:500 11px var(--mono);color:var(--ink-3);text-transform:uppercase;letter-spacing:.06em}
.specs dd{font:500 clamp(30px,3vw,44px)/1 var(--mono);letter-spacing:-.04em;color:var(--ink);font-variant-numeric:tabular-nums}
.specs dd small{font-size:.42em;letter-spacing:0;color:var(--brand);margin-left:4px}
.xcard .anim{display:inline-block}
.xxl-progress{grid-column:1/-1;grid-row:3;align-self:end;justify-self:end;width:min(320px,40vw);height:1px;background:var(--line);position:relative}
.xxl-progress span{position:absolute;inset:0;background:var(--brand);transform-origin:left;transform:scaleX(0)}

/* SECTION HEADINGS */
.sec-title{font-size:clamp(34px,4.6vw,72px);font-weight:800;font-stretch:72%;text-transform:uppercase;line-height:.94;letter-spacing:-.02em;max-width:16ch;text-wrap:balance}
.sec-lead{margin-top:18px;color:var(--ink-2);max-width:52ch}

/* reveal (JS) */
.js [data-reveal]{opacity:0;transform:translateY(28px)}
.js [data-reveal].in{opacity:1;transform:none;transition:opacity 800ms var(--ease-out),transform 1000ms var(--ease-out)}

/* EXPERIENCES */
.exp{padding:clamp(100px,16vh,180px) var(--pad) clamp(80px,12vh,140px);background:linear-gradient(to bottom,transparent,var(--bg) 18%);position:relative}
.exp-list{list-style:none;margin-top:56px;border-top:1px solid var(--line)}
.exp-row{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1.4fr) auto;align-items:center;gap:24px 40px;padding:30px 0;border-bottom:1px solid var(--line);position:relative;cursor:default}
.exp-thumb{display:none}
.exp-name{font-size:clamp(24px,2.6vw,40px);font-weight:700;font-stretch:80%;line-height:1;letter-spacing:-.01em;transition:transform 400ms var(--ease-out),color 300ms ease}
.exp-desc{color:var(--ink-2);max-width:44ch}
.exp-price{text-align:right;display:flex;flex-direction:column;align-items:flex-end;gap:4px}
.exp-price span{font:500 28px/1 var(--mono);color:var(--brand);letter-spacing:-.03em}
.exp-price span .ico{width:28px;height:28px;filter:invert(62%) sepia(52%) saturate(560%) hue-rotate(38deg) brightness(92%)}
.exp-price small{font:400 12px var(--mono);color:var(--ink-3)}
@media (hover:hover) and (pointer:fine){
  .exp-row:hover .exp-name{transform:translateX(12px);color:var(--brand-hi)}
}
.exp-float{position:fixed;left:0;top:0;width:340px;aspect-ratio:4/3;pointer-events:none;z-index:5;border-radius:6px;overflow:hidden;opacity:0;transform:translate3d(-999px,-999px,0) scale(.9);transition:opacity 250ms ease;will-change:transform}
.exp-float.show{opacity:1}
.exp-float img{width:100%;height:100%;object-fit:cover}

/* EXHIBITIONS */
.ex{padding:clamp(80px,12vh,140px) var(--pad);background:var(--bg)}
.bento{margin-top:56px;display:grid;grid-template-columns:1.6fr 1fr;grid-template-rows:auto auto;gap:16px}
.bento>*{border-radius:6px;overflow:hidden;position:relative}
.b-photo{grid-row:1/3;min-height:560px}
.b-photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:35% center;transform:scale(1.08);transition:transform 1200ms var(--ease-out)}
.b-photo.in img{transform:scale(1)}
.b-photo::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(12,13,10,.92) 0%,rgba(12,13,10,.2) 45%,transparent 70%)}
.b-photo figcaption{position:absolute;left:0;right:0;bottom:0;z-index:1;padding:clamp(22px,3vw,40px)}
.bento h3{font-size:clamp(26px,2.4vw,36px);font-weight:700;font-stretch:80%;line-height:1;letter-spacing:-.01em}
.bento p{margin-top:12px;color:var(--ink-2);max-width:42ch}
.b-enigma{background:#1a1c16;padding:clamp(22px,3vw,40px);min-height:300px;display:flex;flex-direction:column}
.cipher{font:500 clamp(46px,5vw,76px)/1 var(--mono);letter-spacing:.12em;color:var(--brand);margin-bottom:auto;padding-bottom:28px}
.sr-word{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.rotors{position:absolute;top:clamp(22px,3vw,40px);right:clamp(22px,3vw,40px);display:flex;gap:6px}
.rotors span{width:30px;height:42px;border:1px solid var(--line-2);border-radius:4px;display:grid;place-items:center;font:500 13px var(--mono);color:var(--ink-2)}
.b-fort{background:linear-gradient(160deg,#20231b,#121410 70%);padding:clamp(22px,3vw,40px);min-height:260px}
.fort-num{font:500 clamp(56px,6vw,96px)/1 var(--mono);letter-spacing:-.05em;margin-bottom:22px}
.fort-num small{font-size:.36em;color:var(--brand);letter-spacing:0;margin-left:6px}

/* QUOTE */
.quote{padding:clamp(120px,22vh,240px) var(--pad);display:grid;place-items:center;text-align:center;background:var(--bg)}
.quote p{font-size:clamp(34px,5.6vw,92px);font-weight:300;font-stretch:72%;line-height:1.02;letter-spacing:-.02em;max-width:18ch;text-transform:uppercase;text-wrap:balance}
.quote .w{display:inline-block;opacity:.14;transition:opacity 300ms linear}
.quote .w.lit{opacity:1}
.quote .w.em{color:var(--brand);font-weight:700}

/* NEWS */
.news{padding:clamp(60px,10vh,120px) 0 clamp(80px,12vh,140px);background:var(--bg)}
.news-head{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;padding:0 var(--pad)}
.muted-link{font:500 13px var(--mono);color:var(--ink-3);cursor:default;white-space:nowrap}
.news-track{margin-top:48px;display:grid;grid-auto-flow:column;grid-auto-columns:clamp(270px,30vw,420px);gap:20px;overflow-x:auto;scroll-snap-type:x mandatory;padding:0 var(--pad) 18px;scroll-padding:0 var(--pad);scrollbar-width:thin}
.ncard{scroll-snap-align:start}
.nimg{aspect-ratio:3/2;border-radius:6px;overflow:hidden;background:var(--bg-2)}
.nimg img{width:100%;height:100%;object-fit:cover;transition:transform 700ms var(--ease-out),filter 500ms ease;filter:grayscale(.5) contrast(1.05)}
@media (hover:hover) and (pointer:fine){.ncard:hover .nimg img{transform:scale(1.04);filter:none}}
.ncard time{display:block;margin-top:18px;font:500 12px var(--mono);color:var(--ink-3);letter-spacing:.03em}
.ncard h3{margin-top:8px;font-size:20px;font-weight:600;line-height:1.2;font-stretch:92%;text-wrap:balance}

/* VISIT */
.visit{padding:clamp(80px,14vh,160px) var(--pad);background:linear-gradient(to bottom,var(--bg),#10120d)}
.visit-title{font-size:clamp(56px,11vw,180px);max-width:none;line-height:.86}
.visit-grid{margin-top:64px;display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:56px;border-top:1px solid var(--line);padding-top:40px}
.visit h3{font:500 12px var(--mono);color:var(--ink-3);text-transform:uppercase;letter-spacing:.08em;margin-bottom:22px}
.hours-list{list-style:none;display:grid;gap:18px}
.hours-list li{display:grid;gap:4px;padding-left:16px;position:relative;color:var(--ink-3)}
.hours-list li span:first-child{font-weight:600;color:var(--ink-2)}
.hours-list li span:last-child{font:400 14px/1.6 var(--mono)}
.hours-list li.now{color:var(--ink)}
.hours-list li.now span:first-child{color:var(--ink)}
.hours-list li.now::before{content:"";position:absolute;left:0;top:4px;bottom:4px;width:2px;background:var(--brand);border-radius:2px}
.note{margin-top:22px;font-size:14px;color:var(--ink-3);max-width:40ch}
.price-hero{display:flex;align-items:baseline;gap:6px;margin-bottom:14px;flex-wrap:wrap}
.p-num{font:500 64px/1 var(--mono);letter-spacing:-.05em}
.p-cur{font:500 24px var(--mono);color:var(--brand)}
.p-lab{color:var(--ink-2);font-size:14px;margin-left:8px;max-width:22ch;line-height:1.3}
.price-rest{margin-top:20px;display:grid;gap:10px}
.price-rest div{display:flex;justify-content:space-between;gap:16px;font-size:15px;color:var(--ink-2)}
.price-rest dd{font-family:var(--mono);color:var(--ink);font-variant-numeric:tabular-nums}
.contact{display:flex;flex-direction:column;align-items:flex-start;gap:12px}
.big-tel{font:500 clamp(32px,3vw,44px)/1 var(--mono);letter-spacing:-.04em;text-decoration:none;margin-bottom:10px;transition:color 200ms ease}
@media (hover:hover){.big-tel:hover{color:var(--brand-hi)}}
.c-line{display:flex;gap:10px;align-items:flex-start;color:var(--ink-2);font-size:15px;text-decoration:none;overflow-wrap:anywhere}
.c-line .ico{filter:invert(.9);margin-top:3px}
.contact .btn{margin-top:18px}

/* TICKETS: plain steps for parents */
.visit-today{margin-top:22px;font:500 clamp(17px,1.5vw,21px)/1.4 var(--mono);color:var(--brand-hi)}
.howto{list-style:none;margin-top:44px;display:grid;gap:0;max-width:880px;border-top:1px solid var(--line)}
.howto li{display:grid;grid-template-columns:56px 1fr;gap:20px;align-items:start;padding:24px 0;border-bottom:1px solid var(--line)}
.howto-ico{width:56px;height:56px;border-radius:50%;background:var(--brand);display:grid;place-items:center}
.howto-ico img{width:28px;height:28px}
.howto h3{font:700 clamp(20px,1.8vw,26px)/1.15 var(--display);font-stretch:88%;color:var(--ink);text-transform:none;letter-spacing:0;margin:4px 0 6px}
.howto p{color:var(--ink-2);max-width:52ch}
.howto a{color:var(--brand-hi);text-underline-offset:3px}
.good-to-know{list-style:none;margin-top:44px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 40px;color:var(--ink-2);font-size:16px}
.good-to-know li{display:flex;gap:12px;align-items:flex-start}
.good-to-know .ico{filter:invert(.9);margin-top:3px}
.contact .btn .ico{filter:none}

/* sticky ticket bar on phones */
.mbar{display:none}
@media (max-width:860px){
  .mbar{display:flex;gap:10px;position:fixed;left:0;right:0;bottom:0;z-index:25;padding:12px 16px calc(12px + env(safe-area-inset-bottom));
    background:rgba(12,13,10,.86);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-top:1px solid var(--line);
    transform:translateY(110%);transition:transform 320ms var(--ease-out)}
  .mbar.show{transform:none}
  .mbar .btn{flex:1;justify-content:center;--h:52px}
  .mbar .mbar-call{flex:0 0 auto}
  .mbar .mbar-call .ico{filter:invert(.9)}
  .good-to-know{grid-template-columns:1fr}
  .foot{padding-bottom:110px}
}

/* GUIDE TEASER */
.gt{position:relative;background:var(--bg);padding:clamp(90px,14vh,160px) var(--pad);display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:48px;align-items:center}
.gt .btn{margin-top:30px}
.gt-stamps{list-style:none;display:flex;flex-wrap:wrap;gap:16px;justify-content:center;max-width:460px;justify-self:center}
.gt-stamps li{width:84px;height:84px;border-radius:50%;display:grid;place-items:center;font:700 30px var(--display);color:var(--brand);border:4px double var(--brand);transform:rotate(calc((var(--i,0) - 3) * 4deg))}
.gt-stamps li:nth-child(1){--i:0}.gt-stamps li:nth-child(2){--i:1;opacity:.85}.gt-stamps li:nth-child(3){--i:2;opacity:.7}.gt-stamps li:nth-child(4){--i:3;border-style:dashed;border-width:2px;color:var(--ink-3);border-color:var(--line-2)}
.gt-stamps li:nth-child(n+5){border-style:dashed;border-width:2px;color:var(--ink-3);border-color:var(--line-2)}
@media (max-width:860px){.gt{grid-template-columns:1fr}.gt-stamps li{width:64px;height:64px;font-size:24px}}

/* GUIDE: Noč v muzeju */
.guide-open main,.guide-open .foot,.guide-open .nav,.guide-open .mbar{visibility:hidden}
.guide-open,.guide-open body{overflow:hidden}
.guide{position:fixed;inset:0;z-index:35;touch-action:none;user-select:none;-webkit-user-select:none;color:var(--ink);cursor:grab}
.guide:active{cursor:grabbing}
.g-top{position:absolute;top:0;left:0;right:0;display:flex;justify-content:space-between;align-items:center;gap:16px;padding:14px var(--pad);background:linear-gradient(rgba(12,13,10,.78),transparent);pointer-events:none}
.g-top>*{pointer-events:auto}
.g-title{display:flex;align-items:baseline;gap:14px;flex-wrap:wrap}
.g-title strong{font:800 24px/1 var(--display);font-stretch:78%;text-transform:uppercase;letter-spacing:-.01em}
#g-progress{font:500 14px var(--mono);color:var(--brand-hi)}
.g-close{height:44px;padding:0 20px;border-radius:999px;border:1px solid var(--line-2);background:rgba(12,13,10,.6);color:var(--ink);font:600 15px var(--display);cursor:pointer;transition:border-color 200ms ease,transform 160ms var(--ease-out)}
.g-close:active{transform:scale(.97)}
@media (hover:hover){.g-close:hover{border-color:var(--ink)}}
.g-markers{position:absolute;inset:0;pointer-events:none;overflow:hidden}
.g-marker{position:absolute;left:0;top:0;display:flex;align-items:center;gap:8px;margin:-22px 0 0 -22px;padding:0;border:0;background:none;color:var(--ink);cursor:pointer;pointer-events:auto;will-change:transform}
.g-pin{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;background:var(--brand);color:#0c0d0a;font:800 19px var(--display);box-shadow:0 0 0 0 rgba(136,172,46,.55);animation:gpulse 2.2s var(--ease-out) infinite;transition:transform 200ms var(--ease-out)}
@keyframes gpulse{0%{box-shadow:0 0 0 0 rgba(136,172,46,.55)}80%,100%{box-shadow:0 0 0 16px rgba(136,172,46,0)}}
.g-marker.done .g-pin{background:#e9e7df;animation:none}
.g-marker.done .g-pin::after{content:"";position:absolute;width:12px;height:7px;border-left:3px solid #0c0d0a;border-bottom:3px solid #0c0d0a;transform:translate(13px,-12px) rotate(-45deg);background:#e9e7df;box-shadow:0 0 0 3px #e9e7df;border-radius:1px}
.g-marker.on .g-pin{transform:scale(1.18)}
.g-pin-label{padding:7px 12px;border-radius:999px;background:rgba(12,13,10,.82);border:1px solid var(--line-2);font:600 14px var(--display);white-space:nowrap}
@media (hover:hover) and (pointer:fine){.g-marker:hover .g-pin{transform:scale(1.12)}}
.g-card{position:absolute;right:24px;top:84px;width:min(440px,calc(100% - 48px));overflow:hidden;background:rgba(15,17,12,.9);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border:1px solid var(--line-2);border-radius:16px;padding:24px;touch-action:pan-y;user-select:text;-webkit-user-select:text;cursor:auto;box-shadow:0 24px 60px rgba(0,0,0,.45)}
.g-start,.g-done{left:50%;right:auto;top:50%;transform:translate(-50%,-50%);width:min(520px,calc(100% - 32px));text-align:left}
.g-card h2{font:800 clamp(28px,3vw,40px)/1 var(--display);font-stretch:78%;text-transform:uppercase;letter-spacing:-.01em}
.g-card p{margin-top:12px;color:var(--ink);font-size:17px;line-height:1.5}
.g-small{color:var(--ink-2)!important;font-size:15px!important}
.g-card .btn{margin-top:20px}
.g-station.in{animation:gin 420ms var(--ease-out)}
.g-quizcard .g-q{font:700 clamp(22px,2.2vw,28px)/1.2 var(--display);text-transform:none;letter-spacing:0;font-stretch:90%}
.g-quizcard .g-answers{margin-top:18px}
@keyframes gin{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
.g-media img{width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:10px;margin-bottom:12px}
@media (max-height:760px){.g-media{display:none}}
.g-step{font:500 13px var(--mono)!important;color:var(--brand-hi)!important;margin:0 0 6px!important}
.g-fact{background:rgba(136,172,46,.12);border-radius:10px;padding:12px 14px;font-size:16px!important}
.g-fact strong{color:var(--brand-hi)}
.g-quiz{margin-top:20px;padding-top:18px;border-top:1px solid var(--line)}
.g-q{font:700 20px/1.3 var(--display)}
.g-answers{display:grid;gap:10px;margin-top:14px}
.g-answer{min-height:54px;padding:12px 16px;border-radius:12px;border:1px solid var(--line-2);background:rgba(233,231,223,.04);color:var(--ink);font:500 17px/1.3 var(--display);text-align:left;cursor:pointer;transition:border-color 200ms ease,background-color 200ms ease,transform 160ms var(--ease-out)}
.g-answer:active{transform:scale(.98)}
@media (hover:hover){.g-answer:not(:disabled):hover{border-color:var(--ink)}}
.g-answer.right{background:var(--brand);border-color:var(--brand);color:#0c0d0a;font-weight:700}
.g-answer:disabled{cursor:default}
.g-answer.wrong{animation:gshake 380ms var(--ease-out)}
@keyframes gshake{20%{transform:translateX(-6px)}40%{transform:translateX(6px)}60%{transform:translateX(-4px)}80%{transform:translateX(3px)}}
.g-feedback{min-height:1.4em;color:var(--ink-2)!important;font-size:16px!important}
.g-feedback.ok{color:var(--brand-hi)!important;font-weight:600}
.g-nav{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px}
.g-nav .btn{margin-top:0;flex:1 1 auto;justify-content:center}
.g-nav .btn:disabled{opacity:.35;cursor:default}
.guide [hidden]{display:none!important}
.g-label{display:block;margin-top:18px;font:600 14px var(--display);color:var(--ink-2)}
.g-input{width:100%;margin-top:8px;height:50px;padding:0 14px;border-radius:12px;border:1px solid var(--line-2);background:rgba(233,231,223,.06);color:var(--ink);font:500 17px var(--display)}
.g-input::placeholder{color:var(--ink-3)}
.g-input:focus{outline:2px solid var(--brand-hi);outline-offset:2px}
#g-cert{display:block;width:100%;height:auto;margin-top:16px;border-radius:8px}
.g-pass{position:absolute;bottom:18px;left:50%;transform:translateX(-50%);display:flex;gap:8px;padding:8px 10px;background:rgba(12,13,10,.84);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid var(--line);border-radius:999px;max-width:calc(100% - 24px)}
.g-stamp{width:44px;height:44px;border-radius:50%;border:2px dashed var(--line-2);background:none;color:var(--ink-3);font:700 16px var(--display);cursor:pointer;display:grid;place-items:center;transition:transform 200ms var(--ease-out),border-color 200ms ease}
.g-stamp.done{border:4px double var(--brand);color:var(--brand);transform:rotate(-8deg)}
.g-stamp.on{box-shadow:0 0 0 2px var(--ink)}
.g-stamp.pop{animation:gpop 520ms var(--ease-out)}
@keyframes gpop{0%{transform:rotate(-8deg) scale(1)}40%{transform:rotate(-14deg) scale(1.35)}100%{transform:rotate(-8deg) scale(1)}}
.g-dot{position:fixed;width:6px;height:6px;margin:-3px 0 0 -3px;border-radius:50%;background:#fff;box-shadow:0 0 10px rgba(255,255,255,.9);pointer-events:none;z-index:40}
@media (max-width:860px){
  .g-title strong{font-size:20px}
  .g-pin-label{display:none}
  .g-marker.on .g-pin-label{display:block}
  .g-station{left:10px;right:10px;width:auto;top:auto;bottom:76px;padding:16px}
  .g-card p{font-size:16px;margin-top:8px}
  .g-card h2{font-size:26px}
  .g-fact{font-size:15px!important;padding:10px 12px}
  .g-answer{min-height:50px;font-size:16px}
  .g-nav{margin-top:14px}
  .g-media img{aspect-ratio:21/8}
  .g-stamp{width:38px;height:38px;font-size:14px}
  .g-pass{gap:5px;bottom:14px}
}
@media (prefers-reduced-motion:reduce){.g-pin{animation:none}.g-station.in{animation:none}}

.guide::before{content:"";position:absolute;inset:0;background:rgba(12,13,10,.55);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);opacity:0;transition:opacity 500ms ease;pointer-events:none}
.guide.welcome::before{opacity:1}
.g-start{width:min(560px,calc(100% - 28px))!important;padding:28px}
.g-wlead{font-size:19px!important;color:var(--ink)!important}
.g-steps{list-style:none;margin-top:20px;display:grid;gap:14px}
.g-steps li{display:grid;grid-template-columns:44px 1fr;gap:14px;align-items:start}
.g-sn{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;background:var(--brand);color:#0c0d0a;font:800 19px var(--display)}
.g-steps strong{display:block;font:700 18px/1.25 var(--display)}
.g-steps span:not(.g-sn){display:block;color:var(--ink-2);font-size:16px;line-height:1.4}
.g-wpass{display:flex;align-items:center;gap:6px;margin-top:20px;flex-wrap:wrap}
.g-wpass i{width:26px;height:26px;border-radius:50%;border:2px dashed var(--line-2)}
.g-wpass i.done{border:3px double var(--brand)}
.g-wpass b{margin-left:8px;padding:5px 12px;border-radius:999px;border:1px solid var(--brand);color:var(--brand-hi);font:600 14px var(--display)}
.g-start .btn{width:100%;justify-content:center;--h:56px;font-size:17px}
@media (max-width:860px){.g-start{padding:20px}.g-wtitle{font-size:28px!important}.g-steps{gap:10px}}
@media (max-height:700px){.g-steps span:not(.g-sn){display:none}}

.guide.done-open .g-pass,.guide.done-open .g-markers{display:none}
.g-done{width:min(1080px,calc(100% - 32px))!important;padding:24px}
.g-done-grid{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);gap:28px;align-items:center}
.g-done #g-cert{margin:0;border-radius:6px;box-shadow:0 18px 40px rgba(0,0,0,.45)}
.g-done-side h2{font-size:clamp(28px,2.6vw,38px)}
.g-reward{margin-top:16px;padding:14px 16px;border:1.5px dashed var(--brand);border-radius:12px;display:grid;gap:4px;background:rgba(136,172,46,.08)}
.g-reward-k{font:500 12px var(--mono);color:var(--brand-hi);text-transform:uppercase;letter-spacing:.06em}
.g-reward strong{font:600 28px var(--mono);letter-spacing:.08em;color:var(--ink);user-select:all}
.g-reward span:last-child{color:var(--ink-2);font-size:15px;line-height:1.4}
@media (max-width:860px){
  .g-done{padding:16px}
  .g-done-grid{grid-template-columns:1fr;gap:14px}
  .g-done-side h2{font-size:24px}
  .g-done-side p{font-size:15px;margin-top:6px}
  .g-done .g-label{margin-top:10px}
  .g-done .g-input{height:46px}
  .g-reward{margin-top:10px;padding:10px 12px}
  .g-reward strong{font-size:22px}
  .g-reward span:last-child{font-size:14px}
}

/* FOOTER */
.foot{background:#0a0b08;border-top:1px solid var(--line);padding:56px var(--pad) 32px}
.foot-top{display:flex;justify-content:space-between;gap:48px;flex-wrap:wrap}
.foot-logo{height:64px;width:auto}
.foot-cols{display:grid;grid-template-columns:repeat(3,auto);gap:16px 56px}
.foot-cols div{display:flex;flex-direction:column;gap:10px;font-size:14px;color:var(--ink-3)}
.foot-cols span{cursor:default}
.foot-bottom{margin-top:56px;padding-top:24px;border-top:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;gap:24px;font-size:12px;color:var(--ink-3)}
.social{display:flex;gap:10px}
.social a{width:40px;height:40px;border:1px solid var(--line-2);border-radius:50%;display:grid;place-items:center;transition:border-color 200ms ease,transform 160ms var(--ease-out)}
.social a:active{transform:scale(.95)}
@media (hover:hover){.social a:hover{border-color:var(--ink)}}
.social img{width:18px;height:18px;filter:invert(.9)}

/* MOBILE */
@media (max-width:860px){
  .nav{height:64px;gap:12px}
  .nav-logo img{height:38px}
  .lang{display:none}
  .hero{padding-bottom:96px}
  .hero-status{left:var(--pad);right:auto;bottom:36px}
  .hero::before{background:linear-gradient(to top,rgba(12,13,10,.97) 0%,rgba(12,13,10,.9) 48%,rgba(12,13,10,.45) 64%,transparent 80%),linear-gradient(to bottom,rgba(12,13,10,.55),transparent 14%)}
  .hero-cta .btn{flex:1 1 auto;justify-content:center}
  .xxl{height:520vh}
  .xxl-pin{grid-template-columns:1fr;grid-template-rows:auto 1fr auto auto;padding:84px var(--pad) 28px}
  .xxl-cards{grid-row:3;align-items:end}
  .xcard p{font-size:15px}
  .specs{grid-template-columns:repeat(3,auto);gap:14px 22px;margin-top:20px}
  .specs dd{font-size:26px}
  .xxl-rail{grid-row:4;margin-top:18px;gap:12px;font-size:10.5px;flex-wrap:wrap}
  .xxl-progress{grid-row:1;align-self:start;justify-self:start;width:100%;margin-top:-14px}
  .exp-row{grid-template-columns:1fr auto;gap:10px 16px;padding:24px 0}
  .exp-thumb{display:block;grid-column:1/-1;width:100%;height:auto;aspect-ratio:16/10;object-fit:cover;border-radius:6px;margin-bottom:8px}
  .exp-name{grid-column:1}
  .exp-price{grid-column:2;grid-row:2}
  .exp-desc{grid-column:1/-1}
  .exp-float{display:none}
  .bento{grid-template-columns:1fr}
  .b-photo{grid-row:auto;min-height:440px}
  .visit-grid{grid-template-columns:1fr;gap:48px}
  .foot-cols{grid-template-columns:1fr 1fr}
  .foot-bottom{flex-direction:column;align-items:flex-start}
}
@media (max-width:420px){
  .specs{grid-template-columns:repeat(2,auto)}
}
@media (max-width:560px){
  .rotors{display:none}
  .b-photo::after{background:linear-gradient(to top,rgba(12,13,10,.95) 0%,rgba(12,13,10,.6) 50%,transparent 80%)}
}

@media (prefers-reduced-motion:reduce){
  .js .hero-title .line,.js .hero-sub,.js .hero-cta,.js .hero-status,.js .nav,.js [data-reveal]{transform:none!important;filter:none!important}
  .ready .hero-title .line,.ready .hero-sub,.ready .hero-cta,.ready .hero-status,.ready .nav,.js [data-reveal].in{transition:opacity 300ms ease!important}
  .hero-status.open .status-dot{animation:none}
  .exp-float{display:none}
  .b-photo img{transform:none!important}
}
