/* HEAD SPA 30, Nitra. Plain CSS, no build step. */
:root{
  --canvas:#0a0d0b;--canvas-2:#0e1310;--panel:#131a15;--panel-2:#192219;
  --accent:#d9b56a;--accent-hover:#ecd08f;--accent-muted:rgba(217,181,106,.16);
  --water:#8cc3b6;--olive:#6f7a3d;
  --text-primary:#f2ede2;--text-secondary:#b3b8ab;--text-tertiary:#8a9086;
  --line:rgba(242,237,226,.10);--line-strong:rgba(217,181,106,.42);
  --display:"Fraunces",Georgia,"Times New Roman",serif;
  --body:"Manrope","Segoe UI",Helvetica,Arial,sans-serif;
  --mono:"JetBrains Mono","SFMono-Regular",Menlo,Consolas,monospace;
  --ease:cubic-bezier(.22,.8,.2,1);--ease-soft:cubic-bezier(.4,0,.2,1);
  --tshadow:0 1px 2px rgba(5,7,6,.9),0 3px 12px rgba(5,7,6,.6),0 10px 24px rgba(5,7,6,.5);
  --radius-s:12px;--radius-m:16px;--radius:22px;--radius-l:28px;--label:11px;--wrap:1180px;--veil:0ms;
}
*,*::before,*::after{box-sizing:border-box}
html{overflow-x:hidden;overflow-x:clip;scroll-behavior:smooth;-webkit-text-size-adjust:100%;text-size-adjust:100%;background:var(--canvas)}
body{margin:0;overflow-x:hidden;overflow-x:clip;background:var(--canvas);color:var(--text-primary);font-family:var(--body);font-size:16px;line-height:1.6;font-feature-settings:"kern" 1,"liga" 1;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;opacity:0;transition:opacity .9s var(--ease-soft)}
body.ready,body.veiling{opacity:1}
@keyframes bodyFallback{to{opacity:1}}
body{animation:bodyFallback 0s linear 2.5s forwards}
body.ready,body.veiling{animation:none}
body.veiling{transition:none}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;cursor:pointer}
img,svg{max-width:100%;display:block}
h1,h2,h3,h4{margin:0;font-weight:400}
p{margin:0}
ul,ol{margin:0;padding:0;list-style:none}
.wrap{width:min(var(--wrap),calc(100% - 48px));margin-inline:auto}
[hidden]{display:none!important}
.vh{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:4px}
.skip{position:fixed;left:16px;top:16px;z-index:200;padding:12px 16px;background:var(--accent);color:#141208;font-weight:700;border-radius:10px;transform:translateY(-120px);transition:transform .25s var(--ease)}
.skip:focus{transform:none}

/* ---------- the breath: one rhythm for every glow (4s in, 6s out) ---------- */
@keyframes breathe{0%{opacity:var(--bo,.5)}40%{opacity:var(--bh,1)}100%{opacity:var(--bo,.5)}}

/* ---------- environment: one fixed background layer, one light handed through the rooms ---------- */
.env{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden}
.env.covered{visibility:hidden}
.env.covered .glow{animation-play-state:paused}
.env .glow{position:absolute;width:70vmax;height:70vmax;border-radius:50%;opacity:.55}
.env .g1{--bo:.42;--bh:.62;left:-25vmax;top:-20vmax;background:radial-gradient(circle,rgba(217,181,106,.13),rgba(217,181,106,.05) 40%,transparent 68%);animation:envA 90s var(--ease-soft) -30s infinite alternate,breathe 10s var(--ease-soft) infinite}
.env .g2{--bo:.42;--bh:.62;right:-30vmax;bottom:-30vmax;background:radial-gradient(circle,rgba(140,195,182,.10),rgba(140,195,182,.04) 40%,transparent 68%);animation:envB 110s var(--ease-soft) -50s infinite alternate,breathe 10s var(--ease-soft) -5s infinite}
.env .g3,.env .g4{width:60vmax;height:60vmax;opacity:var(--go,0);transform:translate3d(var(--gx,0px),var(--gy,0px),0);transition:transform 2400ms var(--ease-soft),opacity 1400ms var(--ease-soft);animation:none}
.env .g3{left:calc(20vw - 30vmax);top:calc(60vh - 30vmax);background:radial-gradient(circle,rgba(140,195,182,.12),rgba(140,195,182,.05) 40%,transparent 68%)}
.env .g4{left:calc(69vw - 30vmax);top:calc(72vh - 30vmax);background:radial-gradient(circle,rgba(217,181,106,.14),rgba(217,181,106,.05) 40%,transparent 68%)}
body[data-scene="hero"] .env .g4{--go:.55}
body[data-scene="cennik"] .env .g4{--gx:-6vw;--gy:-10vh;--go:.25}
body[data-scene="cennik"] .env .g3{--gx:24vw;--gy:-20vh;--go:.3}
body[data-scene="rezervacia"] .env .g3{--gx:18vw;--gy:-26vh;--go:.32}
body[data-scene="rezervacia"] .env .g4{--gx:-12vw;--gy:-18vh;--go:.34}
body[data-scene="poukaz"] .env .g4{--gx:10vw;--gy:-30vh;--go:.5}
body[data-scene="poukaz"] .env .g3{--go:0}
body[data-scene="ritual"] .env .g3{--gx:10vw;--gy:-10vh;--go:.45}
body[data-scene="chodidla"] .env .g2{--gx:-6vw;--gy:6vh;--go:.5}
body[data-scene="chodidla"] .env .g3{--gx:6vw;--gy:14vh;--go:.3}
body[data-scene="chodidla"] .env .g4{--go:.12}
body[data-scene="ritual"] .env .g4{--go:.15}
body[data-scene="preco"] .env .g3{--gx:14vw;--gy:-24vh;--go:.34}
body[data-scene="preco"] .env .g4{--gx:-10vw;--gy:-16vh;--go:.2}
body[data-scene="galeria"] .env .g3{--gx:-8vw;--gy:-30vh;--go:.35}
body[data-scene="galeria"] .env .g4{--gx:18vw;--gy:-24vh;--go:.3}
body[data-scene="faq"] .env .g3{--go:.2}
body[data-scene="faq"] .env .g4{--go:.15}
body[data-scene="kontakt"] .env .g4{--gx:-40vw;--gy:-30vh;--go:.55}
body[data-scene="kontakt"] .env .g3{--go:0}
body[data-scene="footer"] .env .g3,body[data-scene="footer"] .env .g4{--go:0}
.env .grain{position:absolute;inset:0;opacity:.05;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
@keyframes envA{to{transform:translate(12vmax,10vmax)}}
@keyframes envB{to{transform:translate(-14vmax,-8vmax)}}
/* stillness: hidden tab, idle visitor, off-screen section */
body.paused *,body.paused *::before,body.paused *::after{animation-play-state:paused!important}
body.idle .env .glow,body.idle .ticket,body.idle .pin::after,body.idle .cue .drop{animation-play-state:paused}
.gift:not(.live) .ticket,.book:not(.live) .ticket,.contact:not(.live) .pin::after{animation-play-state:paused}

/* ---------- the mark draws itself (veil, ticket, footer) ---------- */
.mark .ring,.mark .wave{stroke-dasharray:1;stroke-dashoffset:0;transition:stroke-dashoffset 700ms var(--ease) 100ms}
.mark .wave{transition-duration:600ms;transition-delay:450ms}
.mark .ring{transform:rotate(-90deg);transform-origin:50% 50%}
.mark .num{transition:opacity 350ms var(--ease-soft) 650ms}
.veil:not(.drawn) .mark .ring,.veil:not(.drawn) .mark .wave,.rv:not(.in) .mark .ring,.rv:not(.in) .mark .wave{stroke-dashoffset:1}
.veil:not(.drawn) .mark .num,.rv:not(.in) .mark .num{opacity:0}
.veil{position:fixed;inset:0;z-index:300;pointer-events:none;display:none}
body.veiling .veil{display:block}
.veil.gone{display:none!important}
.veil .scene{position:absolute;inset:0;overflow:hidden;transform-origin:50% 52%;transition:transform 1300ms cubic-bezier(.6,0,.2,1),opacity 800ms var(--ease-soft) 380ms}
.veil.through .scene{transform:scale(3.8);opacity:0}
.veil .door{--dh:min(84vh,136vw);position:absolute;left:50%;top:50%;width:calc(var(--dh)*.58);height:var(--dh);margin:calc(var(--dh)*-.5) 0 0 calc(var(--dh)*-.29);perspective:1400px;perspective-origin:50% 45%}
.veil .doorway{position:absolute;inset:0;background:#0a0d0b;box-shadow:0 0 0 200vmax #e4dcd7;transition:background 700ms var(--ease-soft)}
.veil.lift .doorway{background:transparent}
.veil .doorway::before{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at 50% 60%,rgba(217,181,106,.35),rgba(217,181,106,.08) 45%,transparent 70%);opacity:0;transition:opacity 900ms var(--ease-soft) 250ms;pointer-events:none}
.veil.lift .doorway::before{opacity:1}
.veil .frame{position:absolute;inset:calc(var(--dh)*-.05) calc(var(--dh)*-.055) 0;border:solid #3a4c41;border-width:calc(var(--dh)*.05) calc(var(--dh)*.055) 0;box-shadow:inset 0 0 0 1px rgba(255,255,255,.08),inset 0 0 0 calc(var(--dh)*.012) #2c3b32,inset 0 0 0 calc(var(--dh)*.014) rgba(255,255,255,.07),0 0 0 1px rgba(0,0,0,.25),0 24px 60px rgba(0,0,0,.28);pointer-events:none}
.veil .sill{position:absolute;left:calc(var(--dh)*-.055);right:calc(var(--dh)*-.055);top:100%;height:5vh;background:linear-gradient(#5a5652,#3f3c39);box-shadow:0 30px 40px rgba(0,0,0,.18)}
.veil .leaf{position:absolute;top:0;bottom:0;width:50%;background:linear-gradient(180deg,#34453b,#2d3d33 60%,#293830);box-shadow:inset 0 0 0 1px rgba(255,255,255,.05);backface-visibility:hidden;transition:transform 1150ms cubic-bezier(.65,0,.25,1) 60ms}
.veil .leaf.l{left:0;transform-origin:left center;border-right:1px solid rgba(0,0,0,.45)}
.veil .leaf.r{right:0;transform-origin:right center;border-left:1px solid rgba(255,255,255,.04);transition-delay:140ms}
.veil.lift .leaf.l{transform:rotateY(104deg)}
.veil.lift .leaf.r{transform:rotateY(-104deg)}
.veil .p{position:absolute;left:15%;right:15%;border:1px solid rgba(255,255,255,.10);box-shadow:inset 0 0 0 calc(var(--dh)*.006) rgba(0,0,0,.28),inset 0 0 0 calc(var(--dh)*.009) rgba(255,255,255,.06),0 1px 0 rgba(255,255,255,.05);background:linear-gradient(180deg,rgba(255,255,255,.02),rgba(0,0,0,.04))}
.veil .p.t{top:5.5%;height:47%}
.veil .p.m{top:65%;height:8%}
.veil .p.b{top:78.5%;height:15.5%}
.veil .p.b2{display:none}
.veil .knock{position:absolute;left:50%;top:59%;width:calc(var(--dh)*.075);height:calc(var(--dh)*.075);margin-left:calc(var(--dh)*-.0375);border-radius:50%;border:calc(var(--dh)*.007) solid #c9a45c;box-shadow:0 2px 3px rgba(0,0,0,.45),inset 0 1px 1px rgba(255,255,255,.35)}
.veil .knock::before{content:"";position:absolute;left:50%;top:calc(var(--dh)*-.028);width:calc(var(--dh)*.032);height:calc(var(--dh)*.032);margin-left:calc(var(--dh)*-.016);border-radius:50%;background:radial-gradient(circle at 35% 35%,#eed49a,#b8924a 70%);box-shadow:0 2px 3px rgba(0,0,0,.45)}
.veil .handle{position:absolute;left:8%;top:60%;width:calc(var(--dh)*.02);height:calc(var(--dh)*.12);border-radius:999px;background:linear-gradient(90deg,#b8924a,#eed49a,#b8924a);box-shadow:0 2px 3px rgba(0,0,0,.4)}
.veil .handle::after{content:"";position:absolute;left:0;top:22%;width:calc(var(--dh)*.05);height:calc(var(--dh)*.014);border-radius:999px;background:linear-gradient(180deg,#eed49a,#b8924a);box-shadow:0 2px 3px rgba(0,0,0,.4)}
.veil .mark{position:absolute;left:50%;top:50%;width:96px;height:96px;margin:-48px 0 0 -48px;transform-origin:50% 50%;transition:transform 850ms cubic-bezier(.7,0,.2,1)}
body.veiling .nav .mark,body.veiling .nav .name,body.veiling .nav .links,body.veiling .nav .btn{opacity:0}
.nav .name,.nav .links{transition:opacity 600ms var(--ease-soft)}
.nav .btn{transition:opacity 600ms var(--ease-soft),transform .35s var(--ease),background .35s,border-color .35s,color .35s}

/* ---------- nav ---------- */
.nav{position:fixed;left:0;right:0;top:0;z-index:100;height:80px;display:flex;align-items:center}
.nav::before{content:"";position:absolute;inset:0;background:rgba(10,13,11,0);opacity:0;transition:opacity .5s var(--ease-soft);pointer-events:none;background:rgba(10,13,11,.9);backdrop-filter:blur(16px) saturate(1.1);border-bottom:1px solid var(--line)}
.nav.solid::before{opacity:1}
.nav{transition:transform .5s var(--ease)}
.nav.hide{transform:translateY(-100%)}
.nav.hide .wrap{pointer-events:none}
.nav .wrap{position:relative;display:flex;align-items:center;justify-content:space-between;gap:20px}
.brand{display:flex;align-items:center;gap:12px}
.brand .mark{width:44px;height:44px;flex:0 0 44px}
.brand .name{display:grid;line-height:1.1}
.brand .name small{font-family:var(--mono);font-size:10px;letter-spacing:.24em;text-transform:uppercase;color:var(--text-tertiary)}
.brand .name strong{font-family:var(--display);font-weight:500;font-size:17px;letter-spacing:.02em}
.links{display:flex;gap:26px;align-items:baseline;font-size:13.5px;font-weight:500;color:var(--text-secondary)}
.links a{position:relative;padding:4px 0;transition:color .3s}
.links a::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:var(--accent);transform:scaleX(0);transform-origin:right;transition:transform .45s var(--ease),opacity .3s}
.links a:hover{color:var(--text-primary)}
.links a:hover::after{transform:scaleX(1);transform-origin:left}
.links a.cur::after{transform:scaleX(1);opacity:.5}
.btn{position:relative;isolation:isolate;display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:14px 22px;border-radius:999px;font-weight:700;font-size:14px;letter-spacing:.01em;border:1px solid transparent;transition:transform .35s var(--ease),background .35s,border-color .35s,color .35s;text-shadow:none}
.btn.primary{background:linear-gradient(135deg,var(--accent-hover),var(--accent) 60%,#b8924a);color:#141208;box-shadow:0 10px 30px rgba(217,181,106,.18)}
.btn.primary::after{content:"";position:absolute;inset:-1px;border-radius:inherit;box-shadow:0 16px 40px rgba(217,181,106,.28);opacity:0;transition:opacity .35s var(--ease);pointer-events:none;z-index:-1}
.btn.primary:hover{transform:translateY(-2px)}
.btn.primary:hover::after{opacity:1}
.btn.ghost{border-color:rgba(242,237,226,.22);background:rgba(10,13,11,.5);color:var(--text-primary)}
.btn.ghost:hover{border-color:var(--line-strong);transform:translateY(-2px)}
.btn.small{padding:11px 16px;font-size:12.5px}
.nav .btn{padding:11px 18px;font-size:13px}
@media (pointer:coarse){
  .btn,.chip,.faq-q,.card-toggle{min-height:44px;display:inline-flex;align-items:center;justify-content:center}
  .choice span,.choices.small span{min-height:44px}
  .linkbtn{min-height:44px;display:inline-flex;align-items:center}
  .map-link,.lb-close,.shot .open{min-height:44px;min-width:44px}
  .btn:active,.mbar a:active,.chip:active{transform:scale(.97);transition-duration:80ms}
}

/* mobile menu: a full-height sheet from the right, native dialog */
.nav-actions{display:flex;align-items:center;gap:10px}
.menu-btn{display:none;position:relative;width:44px;height:44px;border-radius:var(--radius-s);border:1px solid var(--line);background:rgba(10,13,11,.5);padding:0}
.menu-btn span{position:absolute;left:12px;right:12px;height:1.5px;background:var(--text-primary);transition:transform .35s var(--ease),top .35s var(--ease)}
.menu-btn span:first-child{top:17px} .menu-btn span:last-child{top:25px}
.menu-btn[aria-expanded="true"] span:first-child{top:21px;transform:rotate(45deg)} .menu-btn[aria-expanded="true"] span:last-child{top:21px;transform:rotate(-45deg)}
.drawer{position:fixed;inset:0;width:100%;height:100%;max-width:none;max-height:none;margin:0;padding:0;border:0;background:transparent;color:var(--text-primary)}
.drawer::backdrop{background:rgba(6,8,7,.6);backdrop-filter:blur(6px)}
.drawer-in{position:absolute;top:0;right:0;bottom:0;width:min(420px,100%);display:flex;flex-direction:column;padding:22px 24px 30px;background:linear-gradient(180deg,#121915,#0a0d0b);border-left:1px solid var(--line);box-shadow:-30px 0 80px rgba(0,0,0,.5);transform:translateX(30px);opacity:0;transition:transform .45s var(--ease),opacity .35s var(--ease)}
.drawer[open] .drawer-in{transform:none;opacity:1}
.drawer-top{display:flex;align-items:center;justify-content:space-between;min-height:44px}
.drawer-brand{font-family:var(--mono);font-size:var(--label);letter-spacing:.24em;text-transform:uppercase;color:var(--accent)}
.drawer-close{width:44px;height:44px;border-radius:var(--radius-s);border:1px solid var(--line);background:rgba(10,13,11,.5);font-size:26px;line-height:1;color:var(--text-primary)}
.drawer-links{display:grid;margin-top:26px}
.drawer-links a{display:flex;align-items:baseline;gap:16px;padding:15px 0;border-bottom:1px solid var(--line);font-family:var(--display);font-size:clamp(24px,6.4vw,30px);letter-spacing:-.01em;transition:color .3s,padding-left .35s var(--ease)}
.drawer-links a span{font-family:var(--mono);font-size:var(--label);letter-spacing:.16em;color:var(--accent);min-width:2.2ch}
.drawer-links a:hover,.drawer-links a:focus-visible{color:var(--accent-hover);padding-left:6px}
.drawer[open] .drawer-links a{animation:menuIn .6s var(--ease) both;animation-delay:calc(60ms + var(--i,0)*45ms)}
@keyframes menuIn{from{opacity:0;transform:translateX(18px)}}
.drawer-foot{margin-top:auto;padding-top:24px;display:grid;gap:10px}
.drawer-foot .btn{justify-content:center}
.drawer-foot p{font-size:13px;color:var(--text-secondary);line-height:1.6}
.drawer-foot p a{color:var(--text-primary);border-bottom:1px solid var(--line-strong)}
body.drawer-open{overflow:hidden}
.today{font-weight:600;color:var(--text-primary)}
.today:empty{display:none}
.today .dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:#6fcf97;margin-right:8px;position:relative;top:-1px;box-shadow:0 0 12px rgba(111,207,151,.6)}
.today.closed .dot{background:#c97b5a;box-shadow:0 0 12px rgba(201,123,90,.5)}
.today-line{margin-top:18px;line-height:1.45;text-wrap:pretty}
.today-line .today{font-size:14px;font-weight:500;color:var(--text-secondary)}
.today-line .today .dot{width:7px;height:7px;margin-right:7px}
.today-line:has(.today:empty){display:none}
.band[data-fx="drift"] .today-line{--kf:clamp(0,(var(--k,0) - .68)*3.4,1);opacity:var(--kf);transform:translateY(calc((1 - var(--kf))*12px))}
.band[data-fx="rise"] .today-line{margin-top:14px}
.hero-static .today-line{opacity:0;transform:translateY(18px);transition:opacity 1000ms var(--ease),transform 1000ms var(--ease);transition-delay:calc(var(--veil,0ms) + var(--i,0)*110ms)}
body.open .hero-static .today-line{opacity:1;transform:none}

/* ---------- hero ---------- */
.hero{position:relative;height:360vh;z-index:1}
.stage{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden;background:var(--canvas)}
.stage canvas{position:absolute;inset:0;width:100%;height:100%;will-change:transform;transform:translateZ(0)}
.stage .fallback{position:absolute;inset:0;background:radial-gradient(ellipse 60% 70% at 66% -10%,rgba(217,181,106,.22),transparent 60%),radial-gradient(ellipse 30% 8% at 66% 80%,rgba(140,195,182,.35),transparent 70%),linear-gradient(180deg,#0e1310,#0a0d0b)}
.stage .scrim{position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse 120% 90% at 50% 45%,rgba(8,10,9,0) 35%,rgba(8,10,9,.62) 100%)}
.band{position:absolute;left:0;right:0;top:0;bottom:0;display:flex;align-items:center;padding:0 max(24px,calc((100% - var(--wrap)) / 2 + 24px));opacity:0;pointer-events:none;text-shadow:var(--tshadow);--k:0}
.band.on{pointer-events:auto}
.band::before{content:"";position:absolute;left:-4%;top:-4%;width:64%;height:108%;pointer-events:none;opacity:calc(.25 + .75*var(--k,1));background:radial-gradient(ellipse 70% 62% at 42% 50%,rgba(6,8,7,var(--scrim,.66)) 0%,rgba(6,8,7,calc(var(--scrim,.66)*.66)) 46%,rgba(6,8,7,0) 76%)}
.band .inner{position:relative;max-width:min(58%,720px)}
.band .kicker{display:flex;align-items:center;gap:12px;font-family:var(--mono);font-size:11px;letter-spacing:.24em;text-transform:uppercase;color:var(--accent);margin-bottom:22px}
.band .kicker::before{content:"";width:34px;height:1px;background:var(--accent);transform:scaleX(0);transform-origin:left;transition:transform 800ms var(--ease)}
body.open .band .kicker::before,body.open .hero-static .kicker::before{transform:scaleX(1);transition-delay:calc(var(--veil,0ms) + 200ms)}
.band h1,.band h2,.band .line{font-family:var(--display);font-weight:400;letter-spacing:-.02em;line-height:1.02;margin:0}
.band h1{font-size:clamp(52px,7.4vw,112px);max-width:9ch}
.band h2{font-size:clamp(40px,5.8vw,86px);max-width:12ch}
.band .line{font-size:clamp(30px,3.6vw,52px);max-width:22ch;line-height:1.16}
.band .line em,.band h1 em,.band h2 em{font-style:italic;font-weight:300;color:var(--accent-hover)}
.band .sub{margin-top:22px;font-size:clamp(16px,1.35vw,20px);line-height:1.55;color:#ddd8cc;max-width:46ch}
.band .cta{margin-top:30px;display:flex;gap:12px;flex-wrap:wrap}
.band .w{display:inline-block;white-space:nowrap}
.band.on .w{will-change:transform}
.band .c{display:inline-block}
/* drift-down */
.band[data-fx="drift"] .cta{--kb:clamp(0,(var(--k,0) - .55)*3,1);opacity:var(--kb);transform:translateY(calc((1 - var(--kb))*14px))}
.band[data-fx="drift"] .w{--kc:clamp(0,(var(--k,0) - var(--th,0))*2.8,1);opacity:var(--kc);transform:translateY(calc((1 - var(--kc))*-26px))}
/* punch */
.band[data-fx="punch"] .w{--kc:clamp(0,(var(--k,0) - var(--th,0))*3,1);--ks:clamp(0,(var(--k,0) - var(--th,0) - var(--sd,.1))*var(--ss,3.2),1);opacity:var(--kc);transform:scale(calc(.6 + (.4 + var(--ov,.12))*var(--kc) - var(--ov,.12)*var(--ks)))}
.band[data-fx="punch"] .w.em{--ov:.24;--sd:.16;--ss:2.6}
/* blur-to-sharp */
.band[data-fx="blur"] .soft{position:absolute;inset:0;filter:blur(10px);opacity:calc(1 - var(--k,0));pointer-events:none}
.band[data-fx="blur"] .sharp{opacity:var(--k,0)}
.band[data-fx="blur"] .stack{position:relative}
/* scatter */
.band[data-fx="scatter"] .c{--kc:clamp(0,(var(--k,0) - var(--th,0))*2.6,1);opacity:var(--kc);transform:translate(calc((1 - var(--kc))*var(--jx,0px)),calc((1 - var(--kc))*var(--jy,0px))) rotate(calc((1 - var(--kc))*var(--jr,0deg)))}
/* rise, staged settle */
.band[data-fx="rise"] .w{--kc:clamp(0,(var(--k,0) - var(--th,0))*3.2,1);opacity:var(--kc);transform:translateY(calc((1 - var(--kc))*22px))}
.band[data-fx="rise"] .sub{--ks:clamp(0,(var(--k,0) - .62)*4,1);opacity:var(--ks);transform:translateY(calc((1 - var(--ks))*14px))}
.band[data-fx="rise"] .cta{--kb:clamp(0,(var(--k,0) - .76)*5,1);opacity:var(--kb);transform:translateY(calc((1 - var(--kb))*14px))}
.cue{position:absolute;left:50%;bottom:28px;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:8px;font-family:var(--mono);font-size:var(--label);letter-spacing:.24em;text-transform:uppercase;color:var(--text-secondary);opacity:0;transition:opacity .8s var(--ease-soft) .6s;pointer-events:none}
.cue.show{opacity:.85}
.cue .drop{width:14px;height:20px;border-radius:50% 50% 50% 50%/40% 40% 60% 60%;border:1px solid var(--accent);animation:dropBob 2.8s var(--ease-soft) infinite}
.cue:not(.show) .drop{animation-play-state:paused}
@keyframes dropBob{0%,100%{transform:translateY(0);opacity:.6}50%{transform:translateY(8px);opacity:1}}
.hud{position:absolute;right:max(24px,calc((100% - var(--wrap)) / 2 + 24px));bottom:34px;display:flex;gap:10px;align-items:center;font-family:var(--mono);font-size:var(--label);letter-spacing:.14em;text-transform:uppercase;color:var(--text-secondary);padding:9px 13px;border-radius:10px;background:rgba(10,13,11,.7);border:1px solid var(--line);text-shadow:0 1px 3px rgba(5,7,6,.85)}
.hud b{color:var(--accent);font-weight:400;min-width:3ch;display:inline-block;text-align:right}
@media (max-height:560px){.cue,.hud{display:none}}

/* the facts row under the hero buttons */
.facts{display:flex;flex-wrap:wrap;gap:10px 28px;margin-top:30px;padding-top:20px;border-top:1px solid rgba(242,237,226,.14);max-width:560px}
.facts li{display:flex;align-items:baseline;gap:8px}
.facts b{font-family:var(--display);font-weight:500;font-size:22px;line-height:1;color:var(--accent-hover);white-space:nowrap}
.facts span{font-family:var(--mono);font-size:var(--label);letter-spacing:.14em;text-transform:uppercase;color:var(--text-secondary)}
.band[data-fx="drift"] .facts{--kf:clamp(0,(var(--k,0) - .7)*3.4,1);opacity:var(--kf);transform:translateY(calc((1 - var(--kf))*12px))}
.hero-static .facts{opacity:0;transform:translateY(18px);transition:opacity 1000ms var(--ease),transform 1000ms var(--ease);transition-delay:calc(var(--veil,0ms) + var(--i,0)*110ms)}
body.open .hero-static .facts{opacity:1;transform:none}

/* static hero (two gates; strings identical in JS) */
.hero-static{display:none;position:relative;z-index:1;min-height:100svh;padding:130px 0 60px;align-items:flex-end;overflow:hidden}
.hero-static .art{position:absolute;inset:0;z-index:0}
.hero-static .art canvas{width:100%;height:100%;display:block}
.hero-static .art::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,13,11,.25),rgba(10,13,11,.55) 60%,var(--canvas) 100%)}
.hero-static .wrap{position:relative;z-index:1}
.hero-static .kicker{display:flex;align-items:center;gap:12px;font-family:var(--mono);font-size:var(--label);letter-spacing:.24em;text-transform:uppercase;color:var(--accent);margin-bottom:18px}
.hero-static .kicker::before{content:"";width:28px;height:1px;background:var(--accent);transform:scaleX(0);transform-origin:left;transition:transform 800ms var(--ease)}
.hero-static h1{font-family:var(--display);font-size:clamp(50px,14vw,88px);line-height:1;letter-spacing:-.02em;text-shadow:var(--tshadow)}
.hero-static h1 em{font-style:italic;font-weight:300;color:var(--accent-hover)}
.hero-static p{margin-top:18px;font-size:17px;color:#ddd8cc;max-width:34ch;text-shadow:var(--tshadow)}
.hero-static .cta{margin-top:26px;display:flex;gap:12px;flex-wrap:wrap}
.hero-static .kicker,.hero-static h1,.hero-static p,.hero-static .cta{opacity:0;transform:translateY(18px);transition:opacity 1000ms var(--ease),transform 1000ms var(--ease);transition-delay:calc(var(--veil,0ms) + var(--i,0)*110ms)}
body.open .hero-static :is(.kicker,h1,p,.cta){opacity:1;transform:none}
@media (max-height: 500px),(prefers-reduced-motion: reduce){
  .hero{display:none}
  .hero-static{display:flex}
}
@media (min-width:901px){.hero-static{align-items:center}.hero-static p{max-width:30ch}}

/* ---------- sections ---------- */
main{position:relative;z-index:1}
.site{position:relative;background:linear-gradient(180deg,var(--canvas) 0,transparent 240px)}
section{position:relative;padding:120px 0;scroll-margin-top:80px}
.kicker{display:flex;align-items:center;gap:12px;font-family:var(--mono);font-size:11px;letter-spacing:.24em;text-transform:uppercase;color:var(--accent)}
.kicker::before{content:"";width:28px;height:1px;background:var(--accent);transform:scaleX(0);transform-origin:left;transition:transform 800ms var(--ease)}
.rv.in .kicker::before{transform:scaleX(1)}
.h2{font-family:var(--display);font-weight:400;letter-spacing:-.02em;line-height:1.02;font-size:clamp(38px,5vw,68px);margin-top:16px}
.h2 em{font-style:italic;font-weight:300;color:var(--accent-hover)}
/* headlines rise out of a masked slot, line by line */
.h2.lines{display:flex;flex-direction:column;align-items:flex-start}
.h2 .ln{display:block;overflow:hidden;padding:.1em .12em .2em .06em;margin:-.1em -.12em -.2em -.06em}
.h2 .li{display:block;transform:translateY(125%);transition:transform 1100ms var(--ease)}
.rv.in .h2 .li{transform:none}
.rv.in .h2 .ln:nth-child(2) .li{transition-delay:120ms}
.rv.in .h2.part .ln:nth-child(1) .li{transition-delay:90ms}
.rv.in .h2.part .ln:nth-child(2) .li{transition-delay:210ms}
.rv .part.has-h2,.rv .part.h2{transform:none}
.lede{color:var(--text-secondary);font-size:17px;line-height:1.7;max-width:52ch}
/* the two gold dividers draw from the centre and let one light pass */
.divider{width:min(var(--wrap),calc(100% - 48px));height:1px;margin:0 auto;background:linear-gradient(90deg,transparent,var(--line-strong),transparent);position:relative;overflow:hidden;transform:scaleX(0);transform-origin:center;transition:transform 1200ms var(--ease)}
.divider.in{transform:scaleX(1)}
.divider::after{content:"";position:absolute;top:0;left:0;width:18%;height:1px;background:linear-gradient(90deg,transparent,#fff0c2,transparent);transform:translateX(-120%)}
.divider.in::after{animation:pass 2600ms var(--ease-soft) 500ms 1 forwards}
@keyframes pass{to{transform:translateX(660%)}}

/* entrances */
.rv .part{opacity:0;transform:translateY(22px);transition:opacity .9s var(--ease),transform .9s var(--ease)}
.rv.in .part{opacity:1;transform:none}
.rv.in .part:nth-child(2){transition-delay:.09s}
.rv.in .part:nth-child(3){transition-delay:.18s}
.rv.in .part:nth-child(4){transition-delay:.27s}
.rv.in .part:nth-child(5){transition-delay:.36s}
.rv.in .part:nth-child(6){transition-delay:.45s}
.rv.in .part:nth-child(7){transition-delay:.54s}
.rv.in .part:nth-child(8){transition-delay:.63s}
.rv.in.done .part{transition-delay:0s}

/* ritual steps: the water line lights each numeral as it reaches it */
.ritual .grid,.feet .grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:70px;align-items:start}
.ritual .sticky,.feet .sticky{position:sticky;top:120px}
.ritual .h2,.feet .h2{font-size:clamp(38px,4.3vw,60px)}
.ritual .lede,.feet .lede{margin-top:22px}
.steps{position:relative;padding-left:56px}
.steps .stream{position:absolute;left:19px;top:8px;width:4px;height:calc(100% - 16px);overflow:visible}
.steps .stream path{stroke:var(--water);stroke-width:2;fill:none;stroke-linecap:round;opacity:.9;filter:drop-shadow(0 0 6px rgba(140,195,182,.5))}
.steps .stream .base{stroke:rgba(242,237,226,.08);filter:none}
.step{position:relative;padding:26px 0}
.step::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:var(--line);transform:scaleX(0);transform-origin:left;transition:transform 900ms var(--ease) 150ms}
.step.lit::after{transform:scaleX(1)}
.step:last-child::after{display:none}
.step .n{position:absolute;left:-56px;top:26px;width:42px;height:42px;border-radius:50%;display:grid;place-items:center;font-family:var(--mono);font-size:11px;color:var(--accent);border:1px solid var(--line-strong);background:var(--canvas);opacity:.45;transition:opacity 600ms var(--ease)}
.step .n::after{content:"";position:absolute;inset:-1px;border-radius:50%;border:1px solid var(--accent);box-shadow:0 0 18px rgba(217,181,106,.3);opacity:0;transition:opacity 600ms var(--ease)}
.step.lit .n,.step.lit .n::after{opacity:1}
.step h3{font-family:var(--display);font-weight:500;font-size:24px;letter-spacing:-.01em}
.step p{margin-top:8px;color:var(--text-secondary);max-width:48ch}

.step-cta{display:flex;align-items:center;gap:18px;flex-wrap:wrap;padding-top:30px}
.step-cta span{font-family:var(--mono);font-size:var(--label);letter-spacing:.14em;text-transform:uppercase;color:var(--text-tertiary)}
.after{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;margin-top:22px}
.after .note{margin:0;max-width:58ch}
.faq-more{display:flex;align-items:center;justify-content:space-between;gap:18px;flex-wrap:wrap;padding:26px 0 0}
.faq-more p{font-family:var(--display);font-size:22px}
.faq-more .cta{display:flex;gap:10px;flex-wrap:wrap}

/* links answer the hand the same way: a static hairline, a gold line that enters left and leaves right */
.info a::before,footer .col a::before{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:var(--line-strong)}
.info a::after,footer .col a::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:var(--accent);transform:scaleX(0);transform-origin:right;transition:transform .45s var(--ease)}
.info a:hover::after,footer .col a:hover::after{transform:scaleX(1);transform-origin:left}

/* the quote and the mood scenes in the ritual section */
.ritual .quote{margin-top:30px;padding-top:24px;border-top:1px solid var(--line);font-family:var(--display);font-size:clamp(20px,1.7vw,24px);line-height:1.3;color:var(--text-secondary);max-width:26ch}
.ritual .quote em{font-style:italic;font-weight:300;color:var(--accent-hover)}

/* price list: a ledger */
.head{display:grid;grid-template-columns:1.1fr .9fr;gap:60px;align-items:end}
.head .lede{margin-top:0}
.menu .head{margin-bottom:44px}
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:26px}
.stats div{padding:16px 18px;border:1px solid var(--line);border-radius:var(--radius-m);background:rgba(19,26,21,.6)}
.stats b{display:block;font-family:var(--display);font-weight:500;font-size:clamp(22px,1.9vw,28px);line-height:1;color:var(--accent-hover);white-space:nowrap;font-variant-numeric:tabular-nums;font-feature-settings:"tnum" 1}
.stats i{font-style:normal}
.stats span{display:block;margin-top:6px;font-family:var(--mono);font-size:var(--label);letter-spacing:.14em;text-transform:uppercase;color:var(--text-tertiary)}
.tools{position:sticky;top:72px;z-index:20;display:flex;flex-direction:column;align-items:flex-start;gap:8px;padding:12px;border:1px solid var(--line);border-radius:18px;background:rgba(10,13,11,.86);backdrop-filter:blur(16px);margin-bottom:12px}
.chip-row{display:flex;flex-wrap:wrap;align-items:center;gap:8px;width:100%}
.chip-row + .chip-row{padding-top:10px;border-top:1px solid var(--line)}
.chip-row > b{flex:none;min-width:104px;font-family:var(--mono);font-size:var(--label);font-weight:400;letter-spacing:.16em;text-transform:uppercase;color:var(--text-tertiary)}
.chip{appearance:none;border:1px solid var(--line);background:rgba(25,34,25,.7);color:var(--text-secondary);padding:9px 14px;border-radius:999px;font-family:var(--mono);font-size:var(--label);letter-spacing:.08em;text-transform:uppercase;transition:background .3s,color .3s,border-color .3s,transform .35s var(--ease)}
.chip:hover{border-color:var(--line-strong);color:var(--text-primary)}
.chip[aria-pressed="true"]{background:linear-gradient(135deg,var(--accent-hover),var(--accent));color:#141208;border-color:var(--accent)}
.count{font-family:var(--mono);font-size:11px;letter-spacing:.1em;color:var(--text-tertiary);margin:0 0 22px 4px;min-height:1.6em}
.cat{display:flex;align-items:center;gap:18px;margin:44px 0 12px;font-family:var(--mono);font-size:var(--label);letter-spacing:.22em;text-transform:uppercase;color:var(--accent)}
.cat:first-child{margin-top:0}
.cat b{font-family:var(--display);font-weight:500;font-size:22px;letter-spacing:0;text-transform:none;color:var(--text-primary)}
.cat::after{content:"";flex:1;height:1px;background:linear-gradient(90deg,var(--line-strong),transparent);transform:scaleX(0);transform-origin:left;transition:transform 1000ms var(--ease) 100ms}
.cat.in::after{transform:scaleX(1)}
.cat.hidden,.card.hidden{display:none}
.list{display:grid;gap:10px}
.card{position:relative;display:grid;grid-template-columns:56px 1fr auto;gap:22px;padding:26px 28px;border:1px solid var(--line);border-radius:var(--radius);background:linear-gradient(160deg,rgba(25,34,25,.75),rgba(19,26,21,.85));transition:border-color .4s,transform .5s var(--ease),box-shadow .5s var(--ease)}
.card:hover{border-color:var(--line-strong);transform:translateY(-2px);box-shadow:0 24px 60px rgba(0,0,0,.3)}
.card.featured{border-color:var(--line-strong);background:radial-gradient(circle at 90% 10%,rgba(217,181,106,.14),transparent 30%),linear-gradient(160deg,rgba(29,40,29,.9),rgba(19,26,21,.9))}
.card.reco{border-color:var(--water);box-shadow:0 0 0 1px rgba(140,195,182,.35),0 0 40px rgba(140,195,182,.12)}
@keyframes cardIn{from{opacity:0;transform:translateY(10px)}}
.card.pop{animation:cardIn 700ms var(--ease) both;animation-delay:calc(min(var(--i,0),10)*45ms)}
.card .glyph{width:56px;height:56px;border-radius:var(--radius-m);display:grid;place-items:center;border:1px solid var(--line);background:rgba(10,13,11,.5);color:var(--accent)}
.card .glyph svg{width:26px;height:26px}
.card .mini{display:flex;gap:10px;align-items:center;font-family:var(--mono);font-size:var(--label);letter-spacing:.16em;text-transform:uppercase;color:var(--text-tertiary)}
.card .mini .badge{color:#141208;background:var(--accent);padding:3px 8px;border-radius:999px;letter-spacing:.12em}
.card h3{font-family:var(--display);font-weight:500;font-size:clamp(22px,2.2vw,30px);line-height:1.08;letter-spacing:-.01em;margin-top:8px}
.card .tag{margin-top:6px;color:var(--text-secondary);font-size:14px;font-style:italic;font-family:var(--display)}
.card .desc{margin-top:12px;color:var(--text-secondary);font-size:14.5px;line-height:1.65;max-width:62ch}
.card .meta{text-align:right;display:grid;gap:10px;justify-items:end;align-content:start}
.card .meta span{font-family:var(--mono);font-size:var(--label);letter-spacing:.12em;text-transform:uppercase;color:var(--text-tertiary);white-space:nowrap;transition:transform 350ms var(--ease)}
.card .meta strong{position:relative;font-family:var(--display);font-weight:500;font-size:34px;line-height:1;color:var(--accent-hover);transition:color 350ms,transform 350ms var(--ease)}
.card .meta strong::after{content:"";position:absolute;left:0;right:0;bottom:-6px;height:1px;background:var(--accent);transform:scaleX(0);transform-origin:right;transition:transform 450ms var(--ease) 50ms}
.card .actions{grid-column:2/4;display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin-top:4px}
.card-toggle{appearance:none;border:1px solid var(--line);background:rgba(10,13,11,.4);color:var(--text-primary);padding:10px 14px;border-radius:999px;font-family:var(--mono);font-size:var(--label);letter-spacing:.1em;text-transform:uppercase;transition:border-color .3s,background .3s}
.card-toggle:hover{border-color:var(--line-strong)}
.card-toggle i{position:relative;display:inline-block;width:16px;height:16px;margin-left:8px;border-radius:50%;border:1px solid var(--line-strong);font-size:0;vertical-align:middle;transition:border-color .3s}
.card-toggle i::before,.card-toggle i::after{content:"";position:absolute;left:50%;top:50%;width:8px;height:1px;background:var(--accent);transform:translate(-50%,-50%);transition:transform .35s var(--ease)}
.card-toggle i::after{transform:translate(-50%,-50%) rotate(90deg)}
.card-toggle[aria-expanded="true"] i::after{transform:translate(-50%,-50%) rotate(90deg) scaleX(0)}
.card .panel{grid-column:2/4;display:grid;grid-template-rows:0fr;transition:grid-template-rows 320ms var(--ease-soft)}
.card .panel>div{overflow:hidden;opacity:0;transform:translateY(-6px);transition:opacity 300ms var(--ease-soft),transform 400ms var(--ease)}
.card .about{padding-top:16px;margin-top:8px;border-top:1px solid var(--line)}
.card .about .lbl{display:block;font-family:var(--mono);font-size:var(--label);letter-spacing:.2em;text-transform:uppercase;color:var(--accent);margin-bottom:8px}
.card .about p{color:var(--text-secondary);font-size:14.5px;line-height:1.65;max-width:62ch}
.card .about p+p{margin-top:8px}
.card .about+ol{border-top:0;padding-top:12px}
.card .panel ol{counter-reset:s;display:grid;grid-template-columns:1fr 1fr;gap:6px 24px;padding-top:16px;margin-top:8px;border-top:1px solid var(--line)}
.card .panel li{counter-increment:s;position:relative;padding-left:30px;font-size:13.5px;color:var(--text-secondary);line-height:1.55;opacity:0;transform:translateY(4px);transition:opacity 350ms,transform 350ms var(--ease)}
.card .panel li::before{content:counter(s,decimal-leading-zero);position:absolute;left:0;top:0;font-family:var(--mono);font-size:var(--label);color:var(--accent);line-height:2}
.card.open .panel{grid-template-rows:1fr;transition:grid-template-rows 450ms var(--ease)}
.card.open .panel>div{opacity:1;transform:none;transition-delay:80ms}
.card.open .panel li{opacity:1;transform:none;transition-delay:calc(60ms + var(--i,0)*22ms)}
.note{margin-top:20px;font-size:12.5px;color:var(--text-tertiary)}
/* the hand: buttons lean toward the cursor, cards carry a light under it (fine pointers only, never with reduced motion) */
@media (hover:hover) and (pointer:fine){
  .btn.primary{transition:transform .35s var(--ease),background .35s,border-color .35s,color .35s;transform:translate(var(--mx,0px),var(--my,0px))}
  .btn.primary:hover{transform:translate(var(--mx,0px),calc(var(--my,0px) - 2px))}
  .card::before{content:"";position:absolute;inset:0;border-radius:inherit;background:radial-gradient(420px circle at var(--lx,50%) var(--ly,50%),rgba(217,181,106,.10),transparent 60%);opacity:0;transition:opacity .5s;pointer-events:none}
  .card:hover::before{opacity:1}
  .whys li::before{content:"";position:absolute;inset:0;background:radial-gradient(360px circle at var(--lx,50%) var(--ly,50%),rgba(140,195,182,.08),transparent 60%);opacity:0;transition:opacity .5s;pointer-events:none}
  .whys li:hover::before{opacity:1}
}
/* gold arrives with the hand (fine pointers only; touch keeps gold at rest) */
@media (hover:hover) and (pointer:fine){
  .card .meta strong{color:var(--text-primary)}
  .card:hover .meta strong,.card.featured .meta strong,.card.reco .meta strong{color:var(--accent-hover)}
  .card:hover .meta strong{transform:translateY(-1px)}
  .card:hover .meta strong::after{transform:scaleX(1);transform-origin:left}
  .card:hover .meta span{transform:translateY(-2px)}
  .card:not(.featured):not(.reco):not(:hover) .btn.small{background:rgba(10,13,11,.4);color:var(--text-primary);border-color:var(--line);box-shadow:none}
  .faq-q:hover .pm{transform:scale(1.08);border-color:var(--accent)}
}

/* gift: pick, fill in, send */
.gift .head .cta{margin-top:22px;display:flex;gap:12px;flex-wrap:wrap}
.order{display:grid;grid-template-columns:1.15fr .85fr;gap:50px;align-items:start;margin-top:48px}
.vform{padding:36px;border:1px solid var(--line-strong);border-radius:var(--radius-l);background:linear-gradient(150deg,rgba(29,40,29,.85),rgba(14,19,16,.95));box-shadow:0 40px 100px rgba(0,0,0,.35)}
.vf{border:0;padding:0;margin:0;min-width:0}
.vf+.vf{margin-top:30px;padding-top:26px;border-top:1px solid var(--line)}
.vf legend{display:flex;align-items:center;gap:12px;padding:0;margin-bottom:16px;font-family:var(--display);font-size:22px;color:var(--text-primary)}
.vf legend span{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:50%;border:1px solid var(--accent);font-family:var(--mono);font-size:11px;color:var(--accent)}
.choices{display:flex;flex-wrap:wrap;gap:8px}
.choice{position:relative;cursor:pointer}
.choice input{position:absolute;opacity:0;width:1px;height:1px}
.choice span{display:inline-flex;align-items:center;min-height:42px;padding:9px 16px;border:1px solid var(--line);border-radius:999px;background:rgba(10,13,11,.45);font-size:14px;font-weight:600;color:var(--text-secondary);transition:border-color .3s,color .3s,background .3s,transform .3s var(--ease)}
.choice:hover span{border-color:var(--line-strong);color:var(--text-primary)}
.choice input:checked+span{border-color:var(--accent);background:var(--accent-muted);color:var(--accent-hover)}
.choice input:focus-visible+span{outline:2px solid var(--accent);outline-offset:3px}
.choices.small{margin-top:14px}
.choices.small span{min-height:38px;padding:7px 14px;font-size:13px}
.field{margin-top:14px}
.field label{display:block;margin-bottom:6px;font-family:var(--mono);font-size:var(--label);letter-spacing:.18em;text-transform:uppercase;color:var(--text-secondary)}
.field label b{color:var(--accent);font-weight:400}
.field input,.field select,.field textarea{width:100%;padding:12px 14px;border:1px solid var(--line);border-radius:var(--radius-s);background:rgba(10,13,11,.55);color:var(--text-primary);font:inherit;font-size:15px;line-height:1.4;transition:border-color .3s,box-shadow .3s}
.field select{appearance:none;-webkit-appearance:none;padding-right:38px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4 6l4 4 4-4' fill='none' stroke='%23d9b56a' stroke-width='1.5'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center;background-size:14px}
.field select option{background:#131a15;color:var(--text-primary)}
.field textarea{resize:vertical;min-height:64px}
.field input::placeholder,.field textarea::placeholder{color:var(--text-tertiary)}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px rgba(217,181,106,.15)}
.field.invalid input{border-color:#e08e78}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:0 14px}
.ritual-pick{margin-top:18px}
.err{margin-top:16px;padding:12px 14px;border:1px solid rgba(224,142,120,.5);border-radius:var(--radius-s);background:rgba(224,142,120,.08);color:#f0b8a6;font-size:13.5px}
.vform .cta{margin-top:26px;display:flex;gap:12px;flex-wrap:wrap}
.fine{margin-top:16px;font-size:12.5px;line-height:1.6;color:var(--text-tertiary)}
.sent{margin-top:18px;padding:16px 18px;border:1px solid var(--line-strong);border-radius:14px;background:var(--accent-muted);font-size:14.5px;line-height:1.6;color:var(--text-primary)}
.sent a{color:var(--accent-hover);text-decoration:underline;text-underline-offset:3px}
.order>.part:last-child{position:sticky;top:110px;padding:0 14px}
.ticket{position:relative;min-height:300px;padding:32px;border-radius:24px;border:1px solid var(--accent);background:linear-gradient(145deg,#1b2a24,#0c1712);display:flex;flex-direction:column;justify-content:space-between;gap:22px;box-shadow:0 30px 70px rgba(0,0,0,.4);transform:rotate(1.5deg);animation:float 10s var(--ease-soft) -3s infinite alternate}
@keyframes float{to{transform:rotate(1.5deg) translateY(-8px)}}
.ticket::before,.ticket::after{content:"";position:absolute;width:26px;height:26px;border-radius:50%;background:var(--canvas-2);border:1px solid var(--accent);top:50%;transform:translateY(-50%)}
.ticket::before{left:-14px}
.ticket::after{right:-14px}
.ticket small{font-family:var(--mono);font-size:var(--label);letter-spacing:.18em;text-transform:uppercase;color:var(--text-secondary);line-height:1.6;overflow-wrap:anywhere}
.ticket .mark{width:70px;height:70px}
.ticket strong{display:block;font-family:var(--display);font-weight:400;font-style:italic;font-size:34px;line-height:1.15;letter-spacing:-.01em;color:var(--accent-hover);overflow-wrap:anywhere}
.ticket strong.long{font-size:24px}
.ticket .t-for{display:block;margin-top:8px;font-size:15px;color:var(--text-secondary)}

/* booking: pick a ritual, a day and a time window; the message leaves from the guest's own phone */
.lbl{display:block;margin-bottom:6px;font-family:var(--mono);font-size:var(--label);letter-spacing:.18em;text-transform:uppercase;color:var(--text-secondary)}
.field label small{font-family:var(--body);text-transform:none;letter-spacing:0;font-size:11.5px;color:var(--text-tertiary)}
.hint{margin-top:8px;font-size:13px;line-height:1.55;color:var(--text-tertiary)}
.hint.warn{color:#f0b8a6}
.hint .linkbtn{margin-left:8px}
.more{display:flex;flex-wrap:wrap;gap:8px 22px;margin-top:16px}
.linkbtn{appearance:none;background:none;border:0;border-bottom:1px solid var(--line-strong);padding:0 0 2px;font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--accent);cursor:pointer;transition:color .3s,border-color .3s}
.linkbtn:hover{color:var(--accent-hover)}
.linkbtn[aria-expanded="true"]{color:var(--text-secondary);border-color:var(--line)}
.vform .cta .call{align-self:center;font-size:13.5px;color:var(--text-secondary);text-decoration:underline;text-underline-offset:4px;text-decoration-color:var(--line-strong)}
.vform .cta .call:hover{color:var(--text-primary)}
.choice input:disabled+span{opacity:.32;cursor:not-allowed}
.field input[type="date"],.field input[type="time"]{color-scheme:dark;min-height:46px}
.field input[type="date"]::-webkit-calendar-picker-indicator,.field input[type="time"]::-webkit-calendar-picker-indicator{filter:invert(.8) sepia(.6) saturate(2) hue-rotate(5deg);cursor:pointer}
.field select optgroup{background:#131a15;color:var(--accent);font-style:normal}
.field select.flash{animation:flash 1300ms var(--ease)}
@keyframes flash{0%{box-shadow:0 0 0 0 rgba(217,181,106,0)}25%{box-shadow:0 0 0 5px rgba(217,181,106,.38);border-color:var(--accent)}100%{box-shadow:0 0 0 0 rgba(217,181,106,0)}}
.err ul{margin:6px 0 0 18px;padding:0;list-style:disc}
.err li+li{margin-top:2px}
.sent .cta{margin-top:14px;display:flex;flex-wrap:wrap;gap:8px}
.vform .fine .btn.small{margin-top:4px}
.book .ticket strong.long{font-size:24px}

/* why: four facts, one grid, no cards for the sake of cards */
.whys{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;margin-top:54px;background:var(--line);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}
.whys li{position:relative;padding:30px 26px 32px;background:linear-gradient(170deg,rgba(25,34,25,.7),rgba(14,19,16,.9));transition:background .5s}
.whys li::after{content:"";position:absolute;left:26px;right:26px;top:0;height:1px;background:linear-gradient(90deg,var(--accent),transparent);opacity:0;transition:opacity .5s}
.whys li:hover{background:linear-gradient(170deg,rgba(33,45,33,.85),rgba(16,22,18,.95))}
.whys li:hover::after{opacity:1}
.wn{display:block;font-family:var(--mono);font-size:11px;letter-spacing:.2em;color:var(--accent)}
.whys h3{font-family:var(--display);font-weight:500;font-size:23px;line-height:1.15;margin:14px 0 10px;letter-spacing:-.01em}
.whys p{color:var(--text-secondary);font-size:14.5px;line-height:1.65}
.whys.three{grid-template-columns:repeat(3,1fr)}
.about .sub-head{margin-top:64px}
.about .sub-head .h3{font-family:var(--display);font-weight:500;font-size:clamp(26px,2.6vw,36px);letter-spacing:-.01em;margin-top:10px}
.about .sub-head+.whys{margin-top:26px}
.mantra{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:64px;padding-top:34px;border-top:1px solid var(--line)}
.mantra p{font-family:var(--display);font-size:clamp(22px,2vw,28px);line-height:1.25;color:var(--text-secondary)}
.mantra em{font-style:italic;font-weight:300;color:var(--accent-hover)}
.gift-occ{margin:16px 0 22px;color:var(--text-secondary);font-size:15px;line-height:1.65}
.why-cta{margin-top:30px;display:flex;gap:12px;flex-wrap:wrap}
.map{margin-top:50px}
.map .part{position:relative;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;background:var(--panel);aspect-ratio:21/9}
.map .part::before{content:"Mostná 226/30 · Nitra";position:absolute;inset:0;display:grid;place-items:center;font-family:var(--mono);font-size:var(--label);letter-spacing:.2em;text-transform:uppercase;color:var(--text-tertiary)}
.map iframe{position:relative;display:block;width:100%;height:100%;border:0;filter:grayscale(1) invert(.92) hue-rotate(160deg) saturate(.5) brightness(.85) contrast(1.05)}
.map-link{position:absolute;right:16px;bottom:16px;padding:10px 16px;border-radius:999px;background:rgba(10,13,11,.85);border:1px solid var(--line-strong);backdrop-filter:blur(10px);font-size:13px;font-weight:700;color:var(--text-primary);transition:transform .35s var(--ease),border-color .3s}
.map-link:hover{transform:translateY(-2px);border-color:var(--accent)}

/* gallery: one real door, five quiet windows behind it */
.shots{display:grid;grid-template-columns:repeat(12,1fr);gap:14px;margin-top:48px}
.shot{position:relative;margin:0;min-width:0}
.shot .frame{position:relative;height:100%;overflow:hidden;border-radius:var(--radius);border:1px solid var(--line-strong);background:var(--canvas-2)}
.shot .frame::after{content:"";position:absolute;inset:10px;border:1px solid rgba(217,181,106,.22);border-radius:14px;pointer-events:none;transition:opacity .5s var(--ease);opacity:.75}
.shot img,.shot canvas{display:block;width:100%;height:100%;object-fit:cover;transition:transform 1200ms var(--ease)}
.shot .open{position:absolute;inset:0;appearance:none;border:0;background:none;cursor:zoom-in;padding:0}
.shot .open:focus-visible{outline:2px solid var(--accent);outline-offset:-6px;border-radius:var(--radius)}
.shot .pill{position:absolute;top:22px;left:22px;z-index:2;padding:6px 10px;border:1px solid var(--line);border-radius:999px;background:rgba(10,13,11,.62);backdrop-filter:blur(6px);font-family:var(--mono);font-size:var(--label);letter-spacing:.2em;color:var(--text-secondary)}
.shot .pill.kresba{left:auto;right:22px;color:var(--accent);border-color:var(--line-strong)}
.shot .cap{position:absolute;left:0;right:0;bottom:0;z-index:2;padding:64px 24px 22px;background:linear-gradient(0deg,rgba(8,11,9,.92),rgba(8,11,9,.55) 45%,rgba(8,11,9,0));pointer-events:none}
.shot .cap b{display:block;font-family:var(--display);font-weight:500;font-size:21px;letter-spacing:-.01em;color:var(--text-primary)}
.shot .cap span{display:block;margin-top:4px;color:var(--text-secondary);font-size:14px;line-height:1.5;max-width:42ch}
.shot.door{grid-column:1/6;grid-row:1/3}
.shot.door img{object-position:43% 58%;transform:scale(1.3);transform-origin:43% 58%}
.shot.voda{grid-column:6/9;aspect-ratio:1/1}
.shot.rings{grid-column:9/13;aspect-ratio:4/3}
.shot.rings img{object-fit:cover;object-position:47% 60%;transform:scale(2.15);transform-origin:47% 60%}
.shot.steam{grid-column:6/13;aspect-ratio:16/9}
.shot.word{grid-column:1/5;aspect-ratio:4/3}
.shot.gold{grid-column:5/13;aspect-ratio:2.72/1}
.shot.word .frame{display:flex;flex-direction:column;justify-content:space-between;padding:26px;background:linear-gradient(160deg,#141c17,#0c110e)}
.shot.word .frame::before{content:"";position:absolute;right:-10%;top:-30%;width:70%;height:90%;border-radius:50%;background:radial-gradient(circle,rgba(217,181,106,.16),transparent 68%);--bo:.55;--bh:.9;animation:breathe 10s var(--ease-soft) infinite;pointer-events:none}
.shot.word .mark{width:44px;height:44px;position:relative;z-index:1}
.shot.word blockquote{position:relative;z-index:1;margin:0;font-family:var(--display);font-style:italic;font-weight:300;font-size:clamp(21px,1.85vw,27px);line-height:1.28;letter-spacing:-.01em;color:var(--text-primary);max-width:17ch}
.shot.word blockquote em{font-style:italic;color:var(--accent-hover)}
.shot.word small{position:relative;z-index:1;font-family:var(--mono);font-size:var(--label);letter-spacing:.2em;text-transform:uppercase;color:var(--text-tertiary)}
.shot.word .pill{top:auto;bottom:26px;left:auto;right:26px}
.gallery:not(.live) .shot.word .frame::before{animation-play-state:paused}
body.idle .shot.word .frame::before{animation-play-state:paused}
.gallery .note{margin-top:18px;text-align:right}
@media (hover:hover) and (pointer:fine){
  .shot .frame:hover img,.shot .frame:hover canvas{transform:scale(1.04)}
  .shot.door .frame:hover img{transform:scale(1.18)}
  .shot.rings .frame:hover img{transform:scale(2.24)}
  .shot .frame:hover::after{opacity:1;border-color:rgba(217,181,106,.5)}
}
/* lightbox: the native dialog gives focus trapping and Escape for free */
.lb{width:min(92vw,900px);max-height:92vh;padding:0;border:1px solid var(--line-strong);border-radius:var(--radius);background:var(--canvas-2);color:var(--text-primary);overflow:hidden}
.lb::backdrop{background:rgba(5,7,6,.86);backdrop-filter:blur(4px)}
.lb[open]{animation:lbIn .5s var(--ease)}
.lb[open]::backdrop{animation:lbBack .5s var(--ease-soft)}
@keyframes lbIn{from{opacity:0;transform:translateY(14px) scale(.98)}}
@keyframes lbBack{from{opacity:0}}
.lb img{display:block;width:100%;max-height:76vh;object-fit:contain;background:#070a08}
.lb .lb-cap{padding:16px 22px 20px;font-size:14.5px;line-height:1.55;color:var(--text-secondary)}
.lb .lb-close{position:absolute;top:12px;right:12px;z-index:2;width:42px;height:42px;border:1px solid var(--line);border-radius:50%;background:rgba(10,13,11,.7);color:var(--text-primary);font-size:22px;line-height:1;cursor:pointer}
.lb .lb-close:hover{border-color:var(--accent)}


/* faq */
.faq .grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:60px;align-items:start}
.faq .sticky{position:sticky;top:120px}
.faq .lede{margin-top:20px}
.faq-item{position:relative}
.faq-item::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:var(--line);transform:scaleX(0);transform-origin:left;transition:transform 1000ms var(--ease)}
.faq-item:first-child::before{content:"";position:absolute;left:0;right:0;top:0;height:1px;background:var(--line-strong);transform:scaleX(0);transform-origin:left;transition:transform 1000ms var(--ease)}
.rv.in .faq-item::after,.rv.in .faq-item:first-child::before{transform:scaleX(1)}
.rv.in .faq-item:nth-child(2)::after{transition-delay:90ms}
.rv.in .faq-item:nth-child(3)::after{transition-delay:180ms}
.rv.in .faq-item:nth-child(4)::after{transition-delay:270ms}
.rv.in .faq-item:nth-child(5)::after{transition-delay:360ms}
.rv.in .faq-item:nth-child(6)::after{transition-delay:450ms}
.faq-q{width:100%;display:flex;justify-content:space-between;align-items:center;gap:20px;background:none;border:0;padding:22px 0;text-align:left;font-family:var(--display);font-weight:500;font-size:21px;letter-spacing:-.005em;color:var(--text-primary)}
.faq-q .pm{position:relative;flex:0 0 30px;width:30px;height:30px;border-radius:50%;border:1px solid var(--line-strong);transition:transform 300ms var(--ease),border-color 300ms}
.faq-q .pm::before,.faq-q .pm::after{content:"";position:absolute;left:50%;top:50%;width:12px;height:1px;background:var(--accent);transform:translate(-50%,-50%);transition:transform .35s var(--ease)}
.faq-q .pm::after{transform:translate(-50%,-50%) rotate(90deg)}
.faq-q[aria-expanded="true"] .pm::after{transform:translate(-50%,-50%) rotate(0)}
.faq-a{display:grid;grid-template-rows:0fr;transition:grid-template-rows 320ms var(--ease-soft)}
.faq-a>div{overflow:hidden;color:var(--text-secondary);line-height:1.75;font-size:15px;opacity:0;transform:translateY(-6px);transition:opacity 300ms var(--ease-soft),transform 400ms var(--ease)}
.faq-a p{padding-bottom:22px;max-width:60ch}
.faq-item.open .faq-a{grid-template-rows:1fr;transition:grid-template-rows 450ms var(--ease)}
.faq-item.open .faq-a>div{opacity:1;transform:none;transition-delay:80ms}

/* contact: the frame is drawn */
.contact{padding:140px 0}
.contact .box{position:relative;display:grid;grid-template-columns:1.2fr .8fr;gap:60px;align-items:end;padding:70px 0}
.contact .box::before,.contact .box::after{content:"";position:absolute;left:0;right:0;height:1px;background:var(--line);transform:scaleX(0);transform-origin:left;transition:transform 1400ms var(--ease)}
.contact .box::before{top:0}
.contact .box::after{bottom:0;transition-delay:250ms}
.contact .box.in::before,.contact .box.in::after{transform:scaleX(1)}
.contact .h2{font-size:clamp(44px,7vw,96px);max-width:12ch}
.contact .lede{margin-top:22px}
.contact .cta{margin-top:34px;display:flex;gap:12px;flex-wrap:wrap}
.info{display:grid;gap:22px}
.info div{position:relative;padding-top:16px}
.info div::before{content:"";position:absolute;left:0;right:0;top:0;height:1px;background:var(--line);transform:scaleX(0);transform-origin:left;transition:transform 1000ms var(--ease)}
.rv.in .info div::before{transform:scaleX(1)}
.rv.in .info div:nth-child(2)::before{transition-delay:80ms}
.rv.in .info div:nth-child(3)::before{transition-delay:160ms}
.info h4{font-family:var(--mono);font-size:var(--label);letter-spacing:.2em;text-transform:uppercase;color:var(--accent);margin-bottom:8px}
.info p,.info a{display:block;color:var(--text-secondary);font-size:15px;line-height:1.7}
.info a{position:relative;width:fit-content}
.info a:hover{color:var(--text-primary)}
.pin{display:inline-block;width:9px;height:9px;border-radius:50%;background:var(--accent);margin-right:8px;position:relative;top:-1px}
.pin::after{content:"";position:absolute;inset:-5px;border-radius:50%;border:1px solid var(--accent);--bo:.2;--bh:.7;opacity:.2;animation:breathe 10s var(--ease-soft) infinite}

/* footer */
footer{position:relative;z-index:1;padding:50px 0 40px;border-top:1px solid var(--line);background:var(--canvas)}
footer .grid{display:grid;grid-template-columns:1.3fr .8fr .8fr .8fr;gap:30px}
footer p{color:var(--text-tertiary);font-size:13px;line-height:1.7;max-width:36ch;margin-top:14px}
footer h4{font-family:var(--mono);font-size:var(--label);letter-spacing:.2em;text-transform:uppercase;color:var(--accent);margin-bottom:12px}
footer .col a,footer .col span{display:block;color:var(--text-secondary);font-size:13.5px;line-height:2;transition:color .3s}
footer .col a{position:relative;width:fit-content;line-height:1.7;margin:3px 0}
footer .col a:hover{color:var(--accent-hover)}
footer .bottom{display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;margin-top:34px;padding-top:20px;border-top:1px solid var(--line);font-family:var(--mono);font-size:var(--label);letter-spacing:.08em;color:var(--text-tertiary)}
footer .bottom .credit a{color:var(--text-secondary);border-bottom:1px solid var(--line-strong);transition:color .3s,border-color .3s}
footer .bottom .credit a:hover{color:var(--accent-hover);border-color:var(--accent)}

/* mobile bar */
.mbar{display:none}

/* ---------- responsive ---------- */
@media (max-width:1100px){
  .band .inner{max-width:min(66%,720px)}
}
@media (max-width:900px){
  section{padding:90px 0}
  .links{display:none}
  .menu-btn{display:block}
  .whys{grid-template-columns:1fr 1fr}
  .map .part{aspect-ratio:16/10}
  .ritual .grid,.feet .grid,.faq .grid,.contact .box,.head{grid-template-columns:1fr;gap:34px}
  .ritual .sticky,.feet .sticky,.faq .sticky{position:static}
  .order{grid-template-columns:1fr;gap:34px}
  .order>.part:last-child{position:static;padding:0 14px}
  .shots{grid-template-columns:repeat(6,1fr)}
  .shot.door{grid-column:1/4;grid-row:1/3}
  .shot.voda{grid-column:4/7;aspect-ratio:4/3}
  .shot.rings{grid-column:4/7;aspect-ratio:4/3}
  .shot.steam{grid-column:1/7;aspect-ratio:21/9}
  .shot.word{grid-column:1/4;aspect-ratio:4/3}
  .shot.gold{grid-column:4/7;aspect-ratio:4/3}
  .card{grid-template-columns:1fr auto;gap:16px}
  .card .glyph{display:none}
  .card .actions,.card .panel{grid-column:1/3}
  .tools{position:relative;top:auto}
  .chip-row > b{min-width:100%;margin-bottom:-2px}
  footer .grid{grid-template-columns:1fr 1fr}
}
@media (max-width:720px){
  .env .g3,.env .g4{width:40vmax;height:40vmax;transform:none!important}
}
@media (max-width:640px){
  .wrap{width:calc(100% - 32px)}
  .divider{width:calc(100% - 32px)}
  section{padding:72px 0}
  .brand .name small{display:none}
  .nav{height:68px}
  .nav .btn{padding:10px 14px;font-size:12px}
  .h2{font-size:clamp(34px,10vw,46px)}
  .steps{padding-left:46px}
  .step .n{left:-46px;width:36px;height:36px}
  .steps .stream{left:16px}
  .shots{grid-template-columns:1fr;gap:18px;margin-top:40px}
  .shot.door,.shot.voda,.shot.rings,.shot.steam,.shot.word,.shot.gold{grid-column:auto;grid-row:auto}
  .shot.door{aspect-ratio:4/5}
  .shot.voda,.shot.word{aspect-ratio:4/3}
  .shot.rings{aspect-ratio:3/2}
  .shot.steam,.shot.gold{aspect-ratio:16/10}
  .shot .cap{padding:56px 18px 18px}
  .shot .cap b{font-size:19px}
  .shot.word .pill{display:none}
  .shot.word small{font-size:10.5px;letter-spacing:.16em}
  .gallery .note{text-align:left}
  .vform{padding:22px;border-radius:22px}
  .grid2{grid-template-columns:1fr}
  .vf legend{font-size:19px}
  .stats{grid-template-columns:1fr}
  .stats div{display:flex;justify-content:space-between;align-items:baseline}
  .stats span{margin:0}
  .card{padding:20px;grid-template-columns:1fr}
  .card .meta{text-align:left;justify-items:start;grid-auto-flow:column;align-items:baseline;gap:14px}
  .card .actions,.card .panel{grid-column:1}
  .card .panel ol{grid-template-columns:1fr}
  .ticket{transform:none;animation:none;min-height:240px}
  .faq-q{font-size:18px}
  .contact{padding:90px 0 110px}
  .whys,.whys.three{grid-template-columns:1fr}
  .mantra{grid-template-columns:1fr;gap:14px;margin-top:44px}
  .about .sub-head{margin-top:44px}
  .whys li{padding:24px 20px 26px}
  .map .part{aspect-ratio:4/3}
  .nav .btn{display:none}
  .menu-btn{display:block}
  .contact .box{padding:40px 0}
  footer .grid{grid-template-columns:1fr}
  .hero-static .cta{display:grid}
  .facts{gap:10px 20px;margin-top:24px}
  .facts b{font-size:19px}
  .after,.faq-more{align-items:flex-start;flex-direction:column}
  .hero-static{padding-bottom:104px}
  .mbar{display:grid;position:fixed;left:10px;right:10px;bottom:10px;z-index:90;grid-template-columns:.8fr 1.2fr;gap:7px;padding:7px;border:1px solid var(--line-strong);border-radius:var(--radius-m);background:rgba(10,13,11,.92);backdrop-filter:blur(18px);box-shadow:0 18px 50px rgba(0,0,0,.4)}
  .mbar a{display:flex;align-items:center;justify-content:center;min-height:46px;border-radius:11px;font-size:13px;font-weight:700;transition:transform .35s var(--ease)}
  .mbar a:first-child{border:1px solid var(--line);color:var(--text-primary)}
  .mbar a:last-child{background:linear-gradient(135deg,var(--accent-hover),var(--accent));color:#141208}
  body{padding-bottom:76px}
}


/* ---------- the journey on a phone: text sits low, full width, above the fixed bar ---------- */
@media (max-width:640px){
  .band{align-items:flex-end;padding:0 16px 132px}
  .band .inner{max-width:100%}
  .band::before{left:-10%;top:auto;bottom:-8%;width:120%;height:86%;background:linear-gradient(180deg,rgba(6,8,7,0) 0%,rgba(6,8,7,calc(var(--scrim,.66)*.75)) 32%,rgba(6,8,7,var(--scrim,.66)) 100%)}
  .band .kicker{margin-bottom:14px}
  .band h1{font-size:clamp(46px,13.6vw,62px);max-width:none;line-height:1}
  .band h2{font-size:clamp(38px,11.4vw,54px);max-width:none;line-height:1.02}
  .band .line{font-size:clamp(23px,6.6vw,30px);max-width:none;line-height:1.22}
  .band .sub{margin-top:14px;font-size:16px;max-width:none}
  .band .cta{margin-top:20px;display:grid;gap:10px}
  .band .facts{display:grid;grid-template-columns:1fr 1fr;margin-top:18px;padding-top:14px;gap:8px 18px}
  .band .facts b{font-size:18px}
  .band .today-line{margin-top:14px}
  .hud{display:none}
  /* the cue lives in its own strip between the text and the fixed bar, never over the copy */
  .cue{bottom:82px;gap:6px;font-size:10px;letter-spacing:.22em}
  .cue .drop{width:12px;height:17px}
  .stage .scrim{background:radial-gradient(ellipse 140% 90% at 50% 40%,rgba(8,10,9,0) 30%,rgba(8,10,9,.7) 100%)}
}
@media (max-width:640px) and (max-height:700px){
  .band{padding-bottom:124px}
  .cue{bottom:80px}
  .band .facts{display:none}
  .band h1{font-size:clamp(42px,12vw,54px)}
  .band .sub{font-size:15px}
}

/* ---------- reduced motion: final states, stopped drives, no veil ---------- */
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none!important;transition:none!important;transition-delay:0s!important}
  body{opacity:1}
  .veil{display:none!important}
  .rv .part{opacity:1;transform:none}
  .mark .ring,.mark .wave{stroke-dashoffset:0!important}
  .mark .num,.rv:not(.in) .mark .num,.veil:not(.drawn) .mark .num,.nav .mark,.nav .name,.nav .links,.nav .btn{opacity:1}

  .hero-static :is(.kicker,h1,p,.cta,.facts){opacity:1;transform:none}
  .band .facts{opacity:1;transform:none}
  .kicker::before,.band .kicker::before,.hero-static .kicker::before,.h2 .li,.divider,.cat::after,.step::after,.contact .box::before,.contact .box::after,.info div::before,.faq-item::after,.faq-item:first-child::before{transform:none}
  .divider::after{display:none}
  .step .n,.step .n::after{opacity:1}
  .steps .stream path{stroke-dashoffset:0!important}
  .env .g3,.env .g4{opacity:.18!important;transform:none!important}
  .ticket{transform:none}
  .card .panel>div,.card .panel li,.faq-a>div{opacity:1;transform:none}
}

/* ==========================================================
   MATERSKÝ SALÓN: Salón 30
   ========================================================== */
.salon{background:linear-gradient(180deg,transparent,rgba(19,26,21,.55) 30%,rgba(19,26,21,.55) 70%,transparent)}
.salon-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:18px;margin-top:54px}
.scard{position:relative;overflow:hidden;padding:32px 30px 34px;border:1px solid var(--line);border-radius:var(--radius);
  background:linear-gradient(165deg,rgba(25,34,25,.7),rgba(14,19,16,.92));transition:border-color .5s var(--ease),transform .5s var(--ease)}
.scard::before{content:"";position:absolute;left:-40%;top:-120%;width:55%;height:340%;pointer-events:none;
  background:linear-gradient(100deg,transparent,rgba(217,181,106,.10),transparent);transform:translateX(-40%) rotate(8deg);
  opacity:0;transition:opacity .5s var(--ease),transform 1.1s var(--ease)}
.scard:hover{border-color:var(--line-strong);transform:translateY(-3px)}
.scard:hover::before{opacity:1;transform:translateX(260%) rotate(8deg)}
.sn{display:block;font-family:var(--mono);font-size:11px;letter-spacing:.2em;color:var(--accent)}
.scard h3{font-family:var(--display);font-weight:500;font-size:25px;line-height:1.15;margin:14px 0 12px;letter-spacing:-.01em}
.scard p{color:var(--text-secondary);font-size:15px;line-height:1.68}
.slink{display:inline-block;margin-top:14px;font-size:13.5px;font-weight:600;color:var(--accent);
  border-bottom:1px solid var(--line-strong);padding-bottom:2px;transition:color .3s,border-color .3s}
.slink:hover{color:var(--accent-hover);border-color:var(--accent-hover)}
.salon-price{display:grid;grid-template-columns:1.25fr .75fr;gap:40px;align-items:end;margin-top:44px}
.sprice{margin:10px 0 0;padding:0;list-style:none;border-top:1px solid var(--line)}
.sprice li{display:flex;align-items:baseline;gap:16px;padding:13px 2px;border-bottom:1px solid var(--line);transition:color .35s}
.sprice li::after{content:"";flex:1;order:1;height:1px;margin-bottom:4px;
  background:repeating-linear-gradient(90deg,var(--line) 0 3px,transparent 3px 7px)}
.sprice span{order:0;font-size:15px;color:var(--text-secondary)}
.sprice b{order:2;font-family:var(--mono);font-size:14px;font-variant-numeric:tabular-nums;color:var(--text-primary);letter-spacing:.02em}
.sprice li:hover span{color:var(--text-primary)}
.sprice li:hover b{color:var(--accent-hover)}
.salon-cta{display:flex;flex-direction:column;gap:12px;align-items:stretch}
@media (max-width:900px){
  .salon-grid{grid-template-columns:1fr;gap:14px}
  .salon-price{grid-template-columns:1fr;gap:26px;align-items:stretch}
}

/* ==========================================================
   TÍM
   ========================================================== */
.team-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:54px}
.tcard{position:relative;overflow:hidden;padding:28px 28px 32px;border:1px solid var(--line);border-radius:var(--radius);
  background:linear-gradient(165deg,rgba(25,34,25,.7),rgba(14,19,16,.92));
  transition:border-color .5s var(--ease),transform .5s var(--ease)}
.tcard:hover{border-color:var(--line-strong);transform:translateY(-3px)}
.tface{position:relative;aspect-ratio:4/5;border-radius:calc(var(--radius) - 6px);overflow:hidden;
  background:radial-gradient(120% 90% at 50% 15%,rgba(140,195,182,.10),rgba(10,13,11,.9) 70%);
  display:flex;align-items:center;justify-content:center}
.tface img{width:100%;height:100%;object-fit:cover;display:block}
.tmark{width:84px;height:84px;opacity:.8}
.tcard.is-empty .tface{aspect-ratio:3/2;border:1px dashed var(--line-strong)}
.tcard.is-empty .tname{color:var(--text-secondary)}
.tnum{display:block;margin-top:22px;font-family:var(--mono);font-size:11px;letter-spacing:.2em;color:var(--accent)}
.tname{font-family:var(--display);font-weight:500;font-size:25px;line-height:1.15;margin:10px 0 6px;letter-spacing:-.01em}
.trole{font-family:var(--mono);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--accent);margin-bottom:12px}
.tbio{color:var(--text-secondary);font-size:15px;line-height:1.68}
.team-foot{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:20px;margin-top:34px}
.team-foot .note{color:var(--text-secondary);font-size:15px;line-height:1.7;max-width:640px}
.team-foot .note a{color:var(--accent);border-bottom:1px solid var(--line-strong);padding-bottom:1px}
.team-foot .note a:hover{color:var(--accent-hover)}
@media (max-width:900px){
  .team-grid{grid-template-columns:1fr;gap:14px}
  .tface{aspect-ratio:16/9}
  .team-foot{flex-direction:column;align-items:flex-start}
}
@media (prefers-reduced-motion:reduce){.tcard:hover{transform:none}}

/* ==========================================================
   NOVÉ ANIMÁCIE
   ========================================================== */
/* tenká zlatá linka postupu čítania */
.prog{position:fixed;left:0;top:0;z-index:110;height:2px;width:100%;transform:scaleX(0);transform-origin:left;
  background:linear-gradient(90deg,rgba(217,181,106,0),var(--accent) 22%,var(--accent-hover) 60%,var(--water));
  opacity:0;transition:opacity .45s var(--ease-soft);pointer-events:none}
.prog.on{opacity:.9}

/* bodka "dnes otvorené" jemne dýcha */
@keyframes dotPulse{0%,100%{box-shadow:0 0 0 0 rgba(111,207,151,.42)}55%{box-shadow:0 0 0 7px rgba(111,207,151,0)}}
.today .dot{animation:dotPulse 3.4s var(--ease-soft) infinite}
.today.closed .dot{animation:none}

/* prejazd svetla po hlavnom tlačidle (pozadie sa oreže o vlastný polomer, netreba overflow) */
.btn.primary::before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;
  background:linear-gradient(100deg,transparent 42%,rgba(255,255,255,.38) 50%,transparent 58%);
  background-size:300% 100%;background-position:140% 0;background-repeat:no-repeat;
  transition:background-position .9s var(--ease)}
.btn.primary:hover::before,.btn.primary:focus-visible::before{background-position:-40% 0}

/* karta rituálu sleduje kurzor jemným leskom */
.card,.scard{--lx:50%;--ly:50%}
.card::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;opacity:0;
  background:radial-gradient(240px circle at var(--lx) var(--ly),rgba(217,181,106,.13),transparent 70%);
  transition:opacity .45s var(--ease-soft)}
.scard::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;opacity:0;
  background:radial-gradient(260px circle at var(--lx) var(--ly),rgba(140,195,182,.10),transparent 70%);
  transition:opacity .45s var(--ease-soft)}
@media (hover:hover) and (pointer:fine){.scard:hover::after{opacity:1}}
@media (hover:hover) and (pointer:fine){.card:hover::after{opacity:1}}

@media (prefers-reduced-motion:reduce){
  .prog{display:none}
  .today .dot{animation:none}
  .btn.primary::before,.scard::before,.card::after,.scard::after{display:none}
  .scard:hover{transform:none}
}

/* ==========================================================
   RITUÁLY PRE CHODIDLÁ
   ========================================================== */
.feet-art{margin:30px 0 0;max-width:440px}
.feet-art svg{display:block;width:100%;height:auto;overflow:visible}
.feet-art figcaption{margin-top:10px;font-size:13px;line-height:1.5;color:var(--text-tertiary);max-width:42ch}
.feet-art .fa-feet{filter:drop-shadow(0 0 14px rgba(217,181,106,.14))}

/* Celá scéna beží v jednom osemsekundovom kruhu: kvapka dopadne, hladina sa
   rozbehne v kruhoch, para stúpne a chodidlá sa o kúsok prepadnú do vody. */
.feet-art .fa-glow{animation:faGlow 8s var(--ease-soft) infinite}
@keyframes faGlow{0%,100%{opacity:.75}46%{opacity:1}}

/* kvapka padá z výšky, zrýchli a v hladine zmizne */
.fa-drop{animation:faDrop 8s cubic-bezier(.55,0,.85,.35) infinite}
@keyframes faDrop{
  0%{transform:translateY(0) scaleY(1);opacity:0}
  6%{opacity:.9}
  30%{transform:translateY(138px) scaleY(1.45);opacity:.9}
  33%{transform:translateY(142px) scaleY(.5);opacity:0}
  100%{transform:translateY(142px);opacity:0}
}
/* kruhy po dopade, druhý o kúsok neskôr */
.fa-rings .ring{opacity:0;transform-box:fill-box;transform-origin:center}
.ring-a{animation:faRing 8s var(--ease-soft) infinite}
.ring-b{animation:faRing 8s var(--ease-soft) .5s infinite}
@keyframes faRing{
  0%,32%{transform:scale(.4);opacity:0}
  36%{opacity:.65}
  62%,100%{transform:scale(9);opacity:0}
}

/* para stúpa a mizne, každý prameň v inom rytme */
.fa-steam path{stroke-dasharray:130;stroke-dashoffset:130;opacity:0}
.fa-steam .s1{animation:faSteam 8s var(--ease-soft) 3.4s infinite}
.fa-steam .s2{animation:faSteam 8s var(--ease-soft) 3.9s infinite}
.fa-steam .s3{animation:faSteam 8s var(--ease-soft) 4.5s infinite}
.fa-steam .s4{animation:faSteam 8s var(--ease-soft) 5.1s infinite}
@keyframes faSteam{
  0%{stroke-dashoffset:130;opacity:0;transform:translateY(8px)}
  10%{opacity:.5}
  38%{stroke-dashoffset:0;opacity:.34}
  60%,100%{stroke-dashoffset:0;opacity:0;transform:translateY(-20px)}
}

/* hladina sa vlní, tri vrstvy proti sebe */
.fa-ripples path{animation:faRipple 9s ease-in-out infinite}
.fa-ripples .r2{animation-duration:11s;animation-direction:reverse;opacity:.7}
.fa-ripples .r3{animation-duration:13s;opacity:.45}
@keyframes faRipple{0%,100%{transform:translateX(-16px)}50%{transform:translateX(16px)}}

/* chodidlá sa po dopade kvapky o kúsok prepadnú a prsty sa uvoľnia */
.fa-feet .foot{transform-box:fill-box;transform-origin:50% 100%}
.foot-l{animation:faSink 8s var(--ease-soft) infinite}
.foot-r{animation:faSink 8s var(--ease-soft) .35s infinite}
@keyframes faSink{0%,26%{transform:translateY(0)}42%{transform:translateY(2.5px)}70%,100%{transform:translateY(0)}}
.fa-feet .toes{transform-box:fill-box;transform-origin:50% 100%}
.foot-l .toes{animation:faToes 8s var(--ease-soft) infinite}
.foot-r .toes{animation:faToes 8s var(--ease-soft) .35s infinite}
@keyframes faToes{0%,30%{transform:translateY(0) rotate(0)}44%{transform:translateY(-2px) rotate(-2.5deg)}66%,100%{transform:translateY(0) rotate(0)}}

/* citrusový plátok sa zľahka kolíše */
.fa-props .citrus{transform-box:fill-box;transform-origin:center;animation:faBob 6s ease-in-out infinite}
@keyframes faBob{0%,100%{transform:translateY(0) rotate(-3deg)}50%{transform:translateY(-3px) rotate(3deg)}}

@media (prefers-reduced-motion:reduce){
  .fa-steam path{animation:none;stroke-dashoffset:0;opacity:.3}
  .fa-ripples path,.fa-props .citrus,.fa-drop,.fa-rings .ring,
  .fa-feet .foot,.fa-feet .toes,.feet-art .fa-glow{animation:none}
  .fa-drop{opacity:0}
}

.feet-pick{display:grid;gap:10px;margin-top:26px}
.fbtn{position:relative;display:grid;grid-template-columns:1fr auto auto;align-items:baseline;gap:14px;
  padding:16px 20px;border:1px solid var(--line);border-radius:var(--radius-m);
  background:linear-gradient(160deg,rgba(25,34,25,.7),rgba(14,19,16,.9));
  transition:border-color .4s var(--ease),transform .4s var(--ease),background .4s}
.fbtn b{font-family:var(--display);font-weight:500;font-size:19px;letter-spacing:-.01em}
.fbtn span{font-family:var(--mono);font-size:var(--label);letter-spacing:.14em;text-transform:uppercase;color:var(--text-tertiary)}
.fbtn i{font-style:normal;font-family:var(--mono);font-size:15px;font-variant-numeric:tabular-nums;color:var(--accent)}
.fbtn:hover{border-color:var(--line-strong);transform:translateX(4px);background:linear-gradient(160deg,rgba(33,45,33,.85),rgba(16,22,18,.95))}
.fbtn.gold{border-color:var(--line-strong);
  background:radial-gradient(circle at 92% 12%,rgba(217,181,106,.16),transparent 34%),linear-gradient(160deg,rgba(29,40,29,.9),rgba(19,26,21,.9))}
.fbtn.gold i{color:var(--accent-hover)}
.feet .fine{max-width:46ch;margin-top:14px}
@media (max-width:640px){
  .fbtn{grid-template-columns:1fr auto;row-gap:6px;padding:15px 17px}
  .fbtn b{grid-column:1/-1}
}

/* ==========================================================
   PREPÍNAČ JAZYKA
   ========================================================== */
.lang{position:relative;flex:none}
.lang-btn{display:inline-flex;align-items:center;gap:7px;min-height:40px;padding:0 12px;
  border:1px solid var(--line);border-radius:999px;background:rgba(25,34,25,.7);color:var(--text-secondary);
  font-family:var(--mono);font-size:var(--label);letter-spacing:.1em;
  transition:border-color .3s var(--ease),color .3s var(--ease),background .3s var(--ease)}
.lang-btn:hover,.lang-btn[aria-expanded="true"]{border-color:var(--line-strong);color:var(--text-primary);background:rgba(33,45,33,.85)}
.lang-btn svg{opacity:.8}
.lang-menu{position:absolute;top:calc(100% + 10px);right:0;z-index:60;min-width:186px;display:grid;gap:2px;padding:7px;
  border:1px solid var(--line-strong);border-radius:var(--radius-m);background:rgba(14,19,16,.97);
  backdrop-filter:blur(18px);box-shadow:0 18px 46px rgba(3,5,4,.7);animation:langIn .26s var(--ease)}
@keyframes langIn{from{opacity:0;transform:translateY(-8px) scale(.97)}to{opacity:1;transform:none}}
.lang-opt{display:flex;align-items:center;gap:11px;width:100%;padding:10px 12px;border:0;border-radius:10px;
  background:none;color:var(--text-secondary);text-align:left;transition:background .25s,color .25s}
.lang-opt b{flex:none;width:26px;font-family:var(--mono);font-size:var(--label);font-weight:400;letter-spacing:.1em;color:var(--text-tertiary)}
.lang-opt span{font-size:14.5px}
.lang-opt:hover{background:rgba(217,181,106,.1);color:var(--text-primary)}
.lang-opt:hover b{color:var(--accent)}
.lang-opt[aria-pressed="true"]{background:var(--accent-muted);color:var(--text-primary)}
.lang-opt[aria-pressed="true"] b{color:var(--accent-hover)}
@media (prefers-reduced-motion:reduce){.lang-menu{animation:none}}
@media (max-width:860px){
  .lang-btn{min-height:44px;padding:0 13px}
  .lang-menu{right:auto;left:50%;transform:translateX(-50%);min-width:176px}
  .lang-opt{padding:13px 12px}
  @keyframes langIn{from{opacity:0}to{opacity:1}}
}

/* ==========================================================
   MOBIL: dotykové ciele a filter, ktorý nezaberie celú obrazovku
   ========================================================== */
@media (max-width:640px){
  /* Filter mal jedenásť čipov v zalamovaných riadkoch a zjedol celú výšku
     obrazovky. Každá skupina je teraz jeden riadok, ktorý sa posúva prstom. */
  .tools{padding:11px 0 11px 14px;gap:6px}
  /* Bez prichytávania: snap zarovnával čip na okraj kontajnera, teda pod nálepku. */
  .chip-row{flex-wrap:nowrap;overflow-x:auto;overflow-y:hidden;
    -webkit-overflow-scrolling:touch;scrollbar-width:none;padding-bottom:2px;padding-right:14px}
  .chip-row::-webkit-scrollbar{display:none}
  .chip-row > b{min-width:auto;width:auto;position:sticky;left:0;z-index:1;padding-right:14px;
    background:linear-gradient(90deg,var(--canvas) 0,var(--canvas) 76%,rgba(10,13,11,0))}
  .chip-row .chip{flex:none}
  .tools > .chip{margin-left:14px}
  .chip-row + .chip-row{margin-top:2px;padding-top:11px;border-top:1px solid var(--line)}

  /* Telefón, e-mail, mapa a odkazy v pätičke sú na mobile najčastejšie ťukané.
     Dvadsaťšesť pixelov na výšku je málo, preto majú vlastný väčší cieľ. */
  .info a,footer .col a,.map-link,.slink,.credit a{
    min-height:44px;display:inline-flex;align-items:center}
  footer .col a{padding-right:6px}

  /* Nadpis nad hero sa lámal tak, že na druhom riadku zostalo samotné mesto. */
  .kicker{letter-spacing:.18em}
}
@media (max-width:400px){
  .kicker{font-size:10px;letter-spacing:.14em}
}

/* ==========================================================
   VÝBER PODĽA ČASU A ROZPOČTU
   ========================================================== */
.finder{display:flex;flex-wrap:wrap;align-items:flex-end;gap:10px;margin:0 0 14px}
.fx{display:grid;gap:6px}
.fx > span{font-family:var(--mono);font-size:var(--label);letter-spacing:.14em;text-transform:uppercase;color:var(--text-tertiary)}
.fx select{appearance:none;min-height:46px;padding:0 38px 0 15px;border:1px solid var(--line);border-radius:999px;
  background-color:rgba(25,34,25,.7);color:var(--text-primary);font-family:var(--body);font-size:14.5px;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='8' fill='none' stroke='%23d9b56a' stroke-width='1.6'><path d='M1 1.5 6 6.5 11 1.5'/></svg>");
  background-repeat:no-repeat;background-position:right 15px center;
  transition:border-color .3s var(--ease),background-color .3s var(--ease)}
.fx select:hover{border-color:var(--line-strong)}
.fx select:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
/* obmedzený výber je vidieť aj bez rozbalenia */
.fx select:not([value="999"]):not([value="9999"]){border-color:var(--line)}
.finder .fx-clear{min-height:46px;padding:0 4px;background:none;border:0;color:var(--text-tertiary);
  font-size:13.5px;text-decoration:underline;text-underline-offset:4px;transition:color .3s}
.finder .fx-clear:hover{color:var(--accent-hover)}
.no-hit{margin:6px 0 0;padding:16px 18px;border:1px dashed var(--line-strong);border-radius:var(--radius-m);
  color:var(--text-secondary);font-size:14.5px;background:rgba(25,34,25,.4)}
@media (max-width:640px){
  .finder{gap:8px}
  .fx{flex:1 1 calc(50% - 4px);min-width:0}
  .fx select{width:100%;padding:0 34px 0 13px;font-size:14px}
  .finder .fx-clear{flex:1 1 100%;text-align:left;min-height:44px}
}

/* poznámka pod hodnotami poukazu */
.vf-hint{margin-top:12px;max-width:52ch}
