:root{--bg:#0a0a0c;--bg2:#131316;--bg3:#1b1b20;--ink:#f6f3fa;--mag:#4f8dff;--mag2:#8ab4ff;--pur:#ff9f1c;--pur2:#ffb84d;--grn:#4ccf6a;--grn2:#1f6b3a;--line:rgba(246,243,250,.14);--fd:'Archivo',system-ui,sans-serif;--fn:'Pacifico',cursive;--ease:cubic-bezier(.2,.8,.2,1);--pad:clamp(20px,5vw,72px)}
*{box-sizing:border-box;margin:0;padding:0}
html{overflow-x:clip}
body{background:var(--bg);color:var(--ink);font-family:var(--fd);font-size:18px;line-height:1.55;font-weight:500;-webkit-font-smoothing:antialiased;overflow-x:clip}
body.lock{overflow:hidden}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
a:hover{color:var(--grn)}
ul{list-style:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
.wrap{width:min(1320px,calc(100% - 2*var(--pad)));margin:0 auto}
h1,h2,h3{font-weight:800;letter-spacing:-.035em;line-height:1;text-wrap:balance;font-variation-settings:"wdth" 108}
h2{font-size:clamp(42px,5.6vw,84px)}
p{text-wrap:pretty}
.lead{font-size:clamp(19px,1.5vw,23px);line-height:1.5}
.neon{font-family:var(--fn);font-weight:400;letter-spacing:0;color:#fff;text-shadow:0 0 6px #fff,0 0 14px var(--mag),0 0 34px var(--mag),0 0 70px var(--mag);animation:flicker 7s infinite}
.neon.pur{text-shadow:0 0 6px #fff,0 0 14px rgba(246,243,250,.85),0 0 34px rgba(246,243,250,.45),0 0 70px rgba(246,243,250,.25)}
.neon.grn{text-shadow:0 0 6px #fff,0 0 14px var(--grn),0 0 34px var(--grn),0 0 70px var(--grn)}
@keyframes flicker{0%,93%,96%,100%{opacity:1}94%{opacity:.72}95%{opacity:.94}}
.script{font-family:var(--fn);font-weight:400;letter-spacing:0;font-size:clamp(26px,2.3vw,34px);color:var(--grn);display:inline-block;transform:rotate(-2deg);line-height:1.1;margin-bottom:22px}
.script.g{color:var(--grn)}.script.p{color:var(--grn)}
.mag{color:var(--mag2)}.pu{color:var(--grn)}.gr{color:var(--grn)}
.glow{position:absolute;pointer-events:none;border-radius:50%}

/* buttons */
.btn{position:relative;display:inline-flex;align-items:center;gap:12px;padding:20px 34px;border-radius:999px;font-weight:700;font-size:18px;line-height:1;overflow:hidden;isolation:isolate;white-space:nowrap;transition:transform .45s var(--ease),box-shadow .45s var(--ease),color .45s var(--ease),border-color .45s var(--ease),background .45s}
.btn .lbl{position:relative;display:block;height:1.2em;line-height:1.2em;overflow:hidden}
.btn .lbl span{display:block;transition:transform .5s cubic-bezier(.76,0,.24,1)}
.btn .lbl span+span{position:absolute;top:100%;left:0;width:100%}
.btn:hover .lbl span{transform:translateY(-100%)}
.btn .arr{display:inline-block;transition:transform .5s cubic-bezier(.76,0,.24,1)}
.btn:hover .arr{transform:translateX(7px)}
.btn-mag{background:var(--mag);color:#fff}
.btn-mag::after{content:"";position:absolute;top:-40%;left:-60%;width:40%;height:180%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.55),transparent);transform:skewX(-20deg);transition:left .7s var(--ease);z-index:1}
.btn-mag:hover{transform:translateY(-3px);box-shadow:0 0 24px rgba(79,141,255,.55),0 0 60px rgba(79,141,255,.35),0 18px 40px -14px rgba(79,141,255,.6)}
.btn-mag:hover::after{left:130%}
.btn-line{border:1.5px solid rgba(246,243,250,.5);color:var(--ink)}
.btn-line::before{content:"";position:absolute;inset:0;background:var(--ink);transform:translateY(101%);transition:transform .5s cubic-bezier(.76,0,.24,1);z-index:-1;border-radius:inherit}
.btn-line:hover{color:#0a0a0c;border-color:var(--ink)}
.btn-line:hover::before{transform:none}
.btn-pur{border:1.5px solid rgba(246,243,250,.45);color:#fff;transition:color .3s,transform .5s var(--ease)}
.btn-pur::before{content:"";position:absolute;left:50%;top:50%;width:140%;aspect-ratio:1;border-radius:50%;background:var(--ink);transform:translate(-50%,-50%) scale(0);transition:transform .6s var(--ease);z-index:-1}
.btn-pur:hover{transform:translateY(-3px);color:var(--bg);border-color:var(--ink)}
.btn-pur:hover::before{transform:translate(-50%,-50%) scale(1)}
.btn-white{background:#fff;color:#0a0a0c}
.btn-white::before{content:"";position:absolute;inset:0;background:#0a0a0c;transform:translateY(101%);transition:transform .5s cubic-bezier(.76,0,.24,1);z-index:-1;border-radius:inherit}
.btn-white:hover{color:#fff}
.btn-white:hover::before{transform:none}
.btn-sm{padding:15px 26px;font-size:17px}
.circ{width:56px;height:56px;border-radius:50%;border:1.5px solid var(--line);display:grid;place-items:center;font-size:22px;color:var(--ink);transition:background .35s,color .35s,transform .45s var(--ease),box-shadow .35s;background:rgba(10,10,12,.5)}
.circ:hover{background:var(--ink);border-color:var(--ink);color:var(--bg);transform:scale(1.06)}

.scrollbar{position:fixed;top:0;left:0;height:3px;width:100%;z-index:70;transform-origin:left;transform:scaleX(0);background:var(--ink)}

/* nav */
.nav{position:fixed;top:0;left:0;right:0;z-index:60;padding:16px 0;transition:padding .45s var(--ease),background .45s,border-color .45s;border-bottom:1px solid transparent}
.nav.scrolled{background:rgba(10,10,12,.78);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-color:var(--line);padding:10px 0}
.nav .wrap{display:flex;align-items:center;justify-content:space-between;gap:24px}
.logo img{height:60px;width:auto;transition:height .45s var(--ease)}
.nav.scrolled .logo img{height:48px}
.nav-links{display:flex;gap:2px}
.nav-links a{position:relative;padding:10px 14px;font-size:17px;font-weight:600;color:var(--ink)}
.nav-links a::after{content:"";position:absolute;left:14px;right:14px;bottom:5px;height:2px;background:var(--ink);transform:scaleX(0);transform-origin:right;transition:transform .45s var(--ease)}
.nav-links a:hover{color:var(--ink)}
.nav-links a:hover::after,.nav-links a.act::after{transform:scaleX(1);transform-origin:left}
.burger{display:none;width:52px;height:52px;border-radius:50%;border:1.5px solid var(--line);position:relative;z-index:70;background:rgba(10,10,12,.5)}
.burger i{position:absolute;left:15px;width:20px;height:2px;background:var(--ink);transition:transform .45s var(--ease),top .45s var(--ease)}
.burger i:first-child{top:21px}.burger i:last-child{top:29px}
.menu-open .burger i:first-child{top:25px;transform:rotate(45deg)}
.menu-open .burger i:last-child{top:25px;transform:rotate(-45deg)}
.menu{position:fixed;inset:0;z-index:55;background:var(--bg);display:flex;flex-direction:column;justify-content:center;padding:100px var(--pad) 40px;transform:translateY(-100%);transition:transform .7s cubic-bezier(.76,0,.24,1);visibility:hidden;overflow:hidden}
.menu .glow{right:-30%;bottom:-30%;width:80vw;height:80vw;background:radial-gradient(circle,rgba(246,243,250,.07),transparent 60%)}
.menu-open .menu{transform:none;visibility:visible}
.menu a.big{display:block;font-size:clamp(38px,9vw,64px);font-weight:800;letter-spacing:-.03em;padding:10px 0;border-bottom:1px solid var(--line);opacity:0;transform:translateY(20px);transition:opacity .6s var(--ease),transform .6s var(--ease);position:relative;z-index:1}
.menu a.big small{font-family:var(--fn);font-weight:400;font-size:.42em;color:var(--grn);margin-left:18px;letter-spacing:0}
.menu-open .menu a.big{opacity:1;transform:none}
.menu .btn{margin-top:36px;align-self:flex-start;position:relative;z-index:1}

/* hero */
.hero{position:relative;min-height:100vh;padding:160px 0 110px;display:flex;align-items:center;overflow:hidden}
.hero-bg{position:absolute;inset:-12% 0 0 0}
.hero-bg img{width:100%;height:100%;object-fit:cover;object-position:50% 55%}
.hero-bg::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(10,10,12,.96) 0%,rgba(10,10,12,.86) 38%,rgba(10,10,12,.4) 72%,rgba(10,10,12,.3) 100%),linear-gradient(0deg,var(--bg) 0%,transparent 35%)}
.hero .glow{width:60vw;height:60vw;max-width:800px;max-height:800px;right:-10vw;top:-15vw;background:radial-gradient(circle,rgba(246,243,250,.07),transparent 62%)}
.hero .wrap{position:relative;z-index:1;width:min(1500px,calc(100% - 2*var(--pad)));display:grid;grid-template-columns:minmax(0,1.45fr) minmax(0,.55fr);gap:clamp(32px,5vw,72px);align-items:center}
.crumb{display:inline-flex;align-items:center;gap:10px;font-size:17px;font-weight:600;margin-bottom:30px;color:#fff}
.crumb a{display:inline-flex;align-items:center;gap:8px;padding:10px 18px;border:1.5px solid var(--line);border-radius:999px;background:rgba(10,10,12,.5);transition:border-color .3s,background .3s}
.crumb a:hover{border-color:var(--ink);color:#fff;background:rgba(246,243,250,.1)}
.crumb a .arr{display:inline-block;transition:transform .4s var(--ease)}
.crumb a:hover .arr{transform:translateX(-5px)}
h1{font-size:clamp(44px,5.7vw,86px);line-height:.98;letter-spacing:-.04em}
.ln{display:block;overflow:hidden;padding-bottom:.1em;margin-bottom:-.1em}
.ln>span{display:block;transform:translateY(110%);animation:up 1s var(--ease) forwards;animation-delay:var(--d,0s)}
@keyframes up{to{transform:none}}
.ln.neonln{overflow:visible}
.ln.neonln>span{transform:translateY(30px);opacity:0;animation:fadeup 1s var(--ease) forwards}
@keyframes fadeup{to{transform:none;opacity:1}}
h1 .neon{font-size:.92em;display:block;margin-top:.12em;padding:0 .1em .12em 0;line-height:1.15}
.hero p{margin-top:32px;max-width:620px}
.cta{display:flex;flex-wrap:wrap;gap:16px;margin-top:44px}
.cta .btn{padding:24px 40px;font-size:19px}
.fade-in{opacity:0;animation:fade 1.2s var(--ease) forwards;animation-delay:var(--d,0s)}
@keyframes fade{to{opacity:1}}
.hero-media{position:relative;justify-self:end;width:min(400px,100%)}
.hero-shot{position:relative;aspect-ratio:4/5;border-radius:34px;overflow:hidden;border:1px solid var(--line);box-shadow:0 60px 120px -40px rgba(0,0,0,.95);transform:rotate(2deg);display:flex;flex-direction:column;justify-content:flex-end;padding:clamp(24px,3vw,36px)}
.hero-shot img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transform:scale(1.15)}
.hero-shot::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(10,10,12,.94) 0%,rgba(10,10,12,.35) 45%,transparent 70%)}
.hero-shot>*{position:relative;z-index:1}
.hero-shot .k{font-family:var(--fn);color:var(--grn);font-size:26px;display:block;margin-bottom:6px}
.hero-shot b{display:block;font-size:clamp(44px,4.4vw,64px);font-weight:900;letter-spacing:-.04em;line-height:.95;color:#fff}
.hero-shot span.m{display:block;font-size:19px;font-weight:600;margin-top:10px}
@keyframes floaty{0%,100%{translate:0 0}50%{translate:0 -10px}}

/* band */
.band{position:relative;z-index:2;margin:-30px 0 -10px;transform:rotate(-2.5deg) scale(1.04);background:var(--ink);color:var(--bg);padding:22px 0;overflow:hidden;display:flex}
.band .t{display:flex;flex-shrink:0;animation:mq 30s linear infinite;white-space:nowrap}
.band span{font-size:clamp(24px,2.8vw,38px);font-weight:800;letter-spacing:-.02em;line-height:1;display:inline-flex;align-items:center;gap:28px;padding-right:28px;text-transform:uppercase;font-variation-settings:"wdth" 110}
.band span em{font-family:var(--fn);font-style:normal;font-weight:400;text-transform:none;font-size:1.05em}
.band span::after{content:"→";font-weight:400}
@keyframes mq{to{transform:translateX(-100%)}}

/* werkplekken */
.wp{padding:clamp(120px,14vw,190px) 0 clamp(90px,10vw,150px)}
.wp .wrap{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(40px,6vw,96px);align-items:start}
.wp-left{position:sticky;top:130px}
.wp-left .lead{margin-top:28px;max-width:440px}
.wp-left .shot{margin-top:40px;border-radius:24px;overflow:hidden;aspect-ratio:4/3;max-width:460px;transform:rotate(-3deg);box-shadow:0 40px 80px -30px rgba(0,0,0,.9);position:relative}
.wp-left .shot img{width:100%;height:100%;object-fit:cover;transform:scale(1.2)}
.wp-left .shot .cap{position:absolute;left:18px;bottom:14px;font-family:var(--fn);font-size:26px;color:#fff;text-shadow:0 0 10px var(--grn)}
.row{position:relative;display:grid;grid-template-columns:1fr auto;gap:20px 30px;align-items:center;padding:34px 0;border-top:1px solid var(--line);transition:padding-left .5s var(--ease)}
.row:last-child{border-bottom:1px solid var(--line)}
.row::before{content:"";position:absolute;left:0;top:0;height:100%;width:3px;background:var(--c);box-shadow:0 0 14px var(--c);transform:scaleY(0);transition:transform .5s var(--ease)}
.row:hover,.row:focus-visible{padding-left:24px}
.row:hover::before,.row:focus-visible::before{transform:none}
.row h3{font-size:clamp(26px,2.6vw,40px);margin-bottom:10px}
.row p{font-size:19px;max-width:460px}
.row .pr{font-size:clamp(34px,3.6vw,56px);font-weight:900;letter-spacing:-.04em;line-height:1;font-variation-settings:"wdth" 116;text-align:right;color:var(--c);text-shadow:0 0 30px color-mix(in oklab,var(--c) 50%,transparent)}
.row .pr small{display:block;font-size:17px;font-weight:600;color:var(--ink);letter-spacing:0;text-shadow:none;margin-top:8px;font-variation-settings:"wdth" 100}
.row .badge{display:inline-flex;align-items:center;gap:10px;margin-top:14px;font-size:17px;font-weight:700;color:#fff}
.row .badge::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--c);box-shadow:0 0 8px var(--c)}

/* trajecten */
.tra{position:relative;overflow:hidden;padding:clamp(120px,14vw,200px) 0}
.tra .bg{position:absolute;inset:-12% 0}
.tra .bg img{width:100%;height:100%;object-fit:cover;filter:brightness(.45)}
.tra .bg::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,var(--bg),rgba(10,10,12,.35) 30%,rgba(10,10,12,.35) 70%,var(--bg))}
.tra .wrap{position:relative}
.tra h2{max-width:900px}
.tra-text{font-size:clamp(28px,3.6vw,54px);font-weight:700;letter-spacing:-.03em;line-height:1.15;max-width:1100px;margin-top:clamp(30px,4vw,56px)}
.tra-text .w{opacity:.42;transition:opacity .35s}
.tra-text .w.on{opacity:1}
.tra-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:clamp(50px,6vw,80px)}
.tcard{border:1px solid var(--line);border-radius:24px;padding:28px;background:rgba(10,10,12,.72);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);position:relative;overflow:hidden;transition:transform .5s var(--ease),border-color .5s}
.tcard:hover{transform:translateY(-6px);border-color:var(--c)}
.tcard .k{font-family:var(--fn);font-size:24px;color:var(--c);display:block;margin-bottom:12px}
.tcard b{display:block;font-size:clamp(22px,1.8vw,28px);font-weight:800;letter-spacing:-.02em;line-height:1.1}
.tcard p{margin-top:12px;font-size:18px}

/* pakketten */
.pk{padding:clamp(100px,12vw,170px) 0}
.pk-head{display:grid;grid-template-columns:1.1fr .9fr;gap:40px;align-items:end}
.pk-head .lead{max-width:520px}
.phase{margin-top:clamp(40px,5vw,72px);display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);background:var(--bg2);border:1px solid var(--line);border-radius:34px;overflow:hidden}
.phase .pic{position:relative;min-height:420px}
.phase .pic img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transform:scale(1.06);transition:opacity .9s var(--ease),transform 1.8s var(--ease)}
.phase .pic img.on{opacity:1;transform:none}
.phase .pic::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(10,10,12,.7),transparent 45%)}
.phase .pic .cap{position:absolute;left:clamp(22px,3vw,36px);bottom:clamp(18px,3vw,30px);z-index:1;font-family:var(--fn);font-size:clamp(30px,3.4vw,50px);color:#fff;line-height:1.1;opacity:0;translate:0 12px;transition:opacity .6s,translate .6s var(--ease);text-shadow:0 0 6px #fff,0 0 16px var(--c),0 0 40px var(--c)}
.phase .pic .cap.on{opacity:1;translate:0 0}
.phase .ctl{padding:clamp(32px,4vw,60px);display:flex;flex-direction:column;justify-content:center;gap:26px}
.phase h3{font-size:clamp(30px,3vw,46px)}
.range{position:relative;padding:14px 0 0}
.range input{-webkit-appearance:none;appearance:none;width:100%;height:44px;background:transparent;margin:0;cursor:pointer;display:block}
.range input::-webkit-slider-runnable-track{height:3px;background:var(--line);border-radius:2px}
.range input::-moz-range-track{height:3px;background:var(--line);border-radius:2px}
.range input::-webkit-slider-thumb{-webkit-appearance:none;width:32px;height:32px;border-radius:50%;background:var(--ink);border:5px solid var(--bg2);margin-top:-14.5px;box-shadow:0 0 0 1.5px var(--ink);transition:transform .3s var(--ease)}
.range input::-moz-range-thumb{width:22px;height:22px;border-radius:50%;background:var(--ink);border:5px solid var(--bg2);box-shadow:0 0 0 1.5px var(--ink)}
.range input:hover::-webkit-slider-thumb,.range input:focus-visible::-webkit-slider-thumb{transform:scale(1.15)}
.range input:focus-visible{outline:none}
.range .fill{position:absolute;left:0;top:34.5px;height:3px;background:var(--ink);pointer-events:none;border-radius:2px;transition:width .4s var(--ease)}
.range .stops{position:absolute;left:0;right:0;top:32px;display:flex;justify-content:space-between;pointer-events:none;padding:0 14px}
.range .stops i{width:8px;height:8px;border-radius:50%;background:rgba(246,243,250,.5)}
.rlabels{display:flex;justify-content:space-between;gap:8px}
.rlabels button{font-size:18px;font-weight:700;color:var(--ink);opacity:.55;transition:opacity .3s,color .3s;text-align:center;padding:4px 0;line-height:1.2}
.rlabels button:first-child{text-align:left}.rlabels button:last-child{text-align:right}
.rlabels button.on{opacity:1;color:#fff}
.rlabels button:hover{opacity:1}
.phase .out{border-top:1px solid var(--line);padding-top:24px;min-height:150px}
.phase .out .k{font-family:var(--fn);font-size:24px;color:var(--c);display:block;margin-bottom:6px}
.phase .out b{display:block;font-size:clamp(28px,2.6vw,40px);font-weight:800;letter-spacing:-.03em;line-height:1.05}
.phase .out p{margin-top:12px;font-size:19px;max-width:480px}
.packs{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:20px;align-items:stretch}
.pack{background:var(--bg2);border:1px solid var(--line);border-radius:30px;padding:clamp(28px,3vw,42px);display:flex;flex-direction:column;gap:16px;position:relative;overflow:hidden;transition:transform .55s var(--ease),border-color .55s,box-shadow .55s,opacity .5s;--c:rgba(79,141,255,.35);--bc:var(--mag)}
.pack .glow{right:-30%;top:-30%;width:70%;aspect-ratio:1;background:radial-gradient(circle,var(--c),transparent 65%);opacity:0;transition:opacity .6s}
.pack>:not(.glow){position:relative}
.pack.hi{transform:translateY(-8px);border-color:var(--bc);box-shadow:0 40px 80px -40px rgba(0,0,0,.9),0 0 50px -20px var(--bc)}
.pack:hover{transform:translateY(-10px) scale(1.045);border-color:var(--bc);box-shadow:0 50px 100px -40px rgba(0,0,0,.95),0 0 70px -20px var(--bc);z-index:2}
@media(hover:hover){.packs:hover .pack:not(:hover){transform:scale(.97);opacity:.6;filter:saturate(.7)}}
.pack{transition:transform .6s var(--ease),border-color .5s,box-shadow .6s,opacity .5s,filter .5s}
@media(prefers-reduced-motion:reduce){.pack:hover,.packs:hover .pack:not(:hover){transform:none}}
.pack:hover .glow,.pack.hi .glow{opacity:1}
.packs.pick .pack:not(.hi){opacity:.7}
.pack.p{--c:rgba(255,159,28,.4);--bc:var(--pur)}
.pack.g{--c:rgba(76,207,106,.35);--bc:var(--grn)}
.pack .ph{aspect-ratio:16/10;margin:calc(-1*clamp(28px,3vw,42px)) calc(-1*clamp(28px,3vw,42px)) 10px;overflow:hidden;position:relative}
.pack .ph img{width:100%;height:100%;object-fit:cover;transition:transform 1s var(--ease);filter:brightness(.85)}
.pack:hover .ph img,.pack.hi .ph img{transform:scale(1.05)}
.pack .ph::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,var(--bg2),transparent 45%)}
.pack .ph .rec{position:absolute;left:clamp(28px,3vw,42px);top:22px;font-family:var(--fn);font-size:24px;color:#fff;text-shadow:0 0 6px #fff,0 0 14px var(--pur),0 0 30px var(--pur);z-index:1}
.pack .script{margin-bottom:0;font-size:24px}
.pack h3{font-size:clamp(36px,3vw,48px);letter-spacing:-.035em}
.pack .price{font-size:clamp(28px,2.4vw,36px);font-weight:800;letter-spacing:-.02em;line-height:1.1;color:var(--bc);text-shadow:0 0 24px var(--c);padding:6px 0 10px;border-bottom:1px solid var(--line)}
.pack .price small{font-weight:500;font-size:18px;letter-spacing:0;color:var(--ink);text-shadow:none}
.pack p{font-size:19px}
.pack ul{display:flex;flex-direction:column}
.pack li{padding:12px 0;border-top:1px solid var(--line);font-size:18px;font-weight:600;display:flex;gap:14px;align-items:center}
.pack li:first-child{border-top:0}
.pack li::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--bc);box-shadow:0 0 8px var(--bc);flex:none}
.pack .btn{align-self:flex-start;margin-top:auto}
.pdots{display:none;justify-content:center;gap:8px;margin-top:18px}
.pdots button{width:12px;height:12px;border-radius:50%;background:var(--line);transition:background .3s,transform .3s}
.pdots button.on{background:var(--ink);transform:scale(1.2)}
.calc{margin-top:clamp(40px,5vw,64px);display:grid;grid-template-columns:1.1fr .9fr;border-radius:34px;overflow:hidden;background:var(--bg2);color:#fff;border:1px solid var(--line)}
.calc .txt{padding:clamp(32px,4vw,64px);display:flex;flex-direction:column;justify-content:center;gap:16px}
.calc h3{font-size:clamp(30px,3.4vw,50px);letter-spacing:-.035em;color:#fff}
.calc p{font-size:clamp(18px,1.3vw,21px);color:#fff}
.calc .sum{background:#0a0a0c;padding:clamp(32px,4vw,56px);display:flex;flex-direction:column;justify-content:center}
.calc .sum .li{display:flex;justify-content:space-between;gap:20px;padding:16px 0;border-bottom:1px solid var(--line);font-size:19px;font-weight:600}
.calc .sum .li b{font-weight:800;white-space:nowrap}
.calc .sum .tot{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;padding-top:22px}
.calc .sum .tot span{font-size:19px;font-weight:700}
.calc .sum .tot b{font-size:clamp(34px,3.4vw,50px);font-weight:900;letter-spacing:-.04em;line-height:1;color:var(--grn);white-space:nowrap;transition:opacity .3s}
.calc .sum .tot b.sw{opacity:0}
.calc .sum small{display:block;margin-top:16px;font-size:17px;font-weight:500}

/* vergelijking */
.cmp{padding:clamp(100px,12vw,170px) 0;background:var(--bg2)}
.cmp-head{display:flex;justify-content:space-between;align-items:flex-end;gap:32px;flex-wrap:wrap}
.cmp-head .lead{max-width:460px}
.base{margin-top:clamp(40px,5vw,64px);display:grid;grid-template-columns:auto 1fr;gap:20px 40px;align-items:center;padding:28px 34px;border-radius:26px;background:var(--bg);border:1px solid var(--line)}
.base .k{font-family:var(--fn);font-size:26px;color:var(--grn);line-height:1.1;white-space:nowrap}
.base ul{display:flex;flex-wrap:wrap;gap:10px 28px}
.base li{font-size:18px;font-weight:700;display:inline-flex;align-items:center;gap:12px}
.base li::before{content:"";width:9px;height:9px;border-radius:50%;background:var(--grn);box-shadow:0 0 10px var(--grn)}
.table{margin-top:18px;border:1px solid var(--line);border-radius:30px;overflow:hidden;background:var(--bg);--hi:1}
.tr{display:grid;grid-template-columns:1.5fr repeat(3,1fr);align-items:stretch;border-top:1px solid var(--line)}
.tr:first-child{border-top:0}
.tr>div{padding:24px 26px;font-size:19px;font-weight:600;text-align:center;display:flex;align-items:center;justify-content:center;transition:background .4s}
.tr>div:first-child{text-align:left;justify-content:flex-start;font-weight:700;font-size:clamp(18px,1.4vw,21px)}
.tr.head>div{flex-direction:column;gap:4px;font-size:clamp(22px,2vw,30px);font-weight:800;letter-spacing:-.02em;padding:28px 26px;cursor:pointer}
.tr.head .sc{display:block;font-family:var(--fn);font-weight:400;font-size:19px;letter-spacing:0;color:var(--ink)}
.table.c0 .tr>div:nth-child(2),.table.c1 .tr>div:nth-child(3),.table.c2 .tr>div:nth-child(4){background:rgba(246,243,250,.045)}
.table.c0 .tr.head>div:nth-child(2),.table.c1 .tr.head>div:nth-child(3),.table.c2 .tr.head>div:nth-child(4){box-shadow:inset 0 3px 0 var(--hc)}
.tr .dot{display:inline-block;width:16px;height:16px;border-radius:50%;background:var(--c);box-shadow:0 0 12px var(--c);transform:scale(0);transition:transform .5s var(--ease)}
.table.in .tr .dot{transform:none}
.tr .dash{display:inline-block;width:18px;height:2px;background:rgba(246,243,250,.3)}
.tr.price>div{font-size:clamp(20px,1.7vw,26px);font-weight:800;letter-spacing:-.02em;padding:28px 26px}
.tr.price>div:nth-child(2){color:var(--mag2)}.tr.price>div:nth-child(3){color:var(--pur2)}.tr.price>div:nth-child(4){color:var(--grn)}
.cmp-note{margin-top:22px;font-size:18px;max-width:640px}

/* oplevert */
.value{padding:clamp(100px,12vw,170px) 0;position:relative;overflow:hidden}
.value .wrap{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(40px,6vw,100px);align-items:center}
.value h2{margin-bottom:28px}
.vlist{margin-top:34px}
.vlist li{position:relative;padding:22px 0 22px 64px;border-top:1px solid var(--line);font-size:clamp(19px,1.5vw,23px);font-weight:600;line-height:1.35}
.vlist li:last-child{border-bottom:1px solid var(--line)}
.vlist li::before{content:attr(data-n);position:absolute;left:0;top:20px;width:42px;height:42px;border-radius:50%;border:1.5px solid var(--c);color:var(--c);display:grid;place-items:center;font-size:17px;font-weight:800;box-shadow:0 0 14px color-mix(in oklab,var(--c) 45%,transparent)}
.vshot{position:relative;aspect-ratio:4/5;max-height:760px;border-radius:32px;overflow:hidden;border:1px solid var(--line);box-shadow:0 60px 120px -40px rgba(0,0,0,.95)}
.vshot img{width:100%;height:100%;object-fit:cover;transform:scale(1.2)}
.vshot::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(10,10,12,.7),transparent 45%)}
.vshot .tag{position:absolute;left:clamp(22px,3vw,36px);bottom:clamp(18px,3vw,30px);z-index:1;font-size:clamp(32px,3.4vw,50px)}

/* faq */
.faq{padding:clamp(100px,12vw,170px) 0;background:var(--bg2)}
.faq .wrap{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(40px,6vw,96px)}
.faq-left{position:sticky;top:130px;align-self:start}
.faq-left .lead{margin-top:28px;max-width:420px}
.faq-left .shot{margin-top:40px;border-radius:24px;overflow:hidden;aspect-ratio:4/5;max-width:380px;transform:rotate(-3deg);box-shadow:0 40px 80px -30px rgba(0,0,0,.9);position:relative}
.faq-left .shot img{width:100%;height:100%;object-fit:cover;transform:scale(1.2)}
.faq-left .shot .tag{position:absolute;left:22px;bottom:18px;font-size:clamp(28px,2.6vw,40px)}
.q{border-top:1px solid var(--line);position:relative}
.q:last-child{border-bottom:1px solid var(--line)}
.q::before{content:"";position:absolute;left:0;top:0;width:3px;height:100%;background:var(--ink);transform:scaleY(0);transform-origin:top;transition:transform .5s var(--ease)}
.q.open::before{transform:none}
.q button{width:100%;display:flex;align-items:center;gap:22px;padding:28px 0;text-align:left;font-size:clamp(22px,1.9vw,30px);font-weight:700;letter-spacing:-.02em;line-height:1.15;transition:color .3s,padding-left .45s var(--ease)}
.q button:hover,.q.open button{padding-left:22px}
.q button:hover{color:#fff}
.q .n{flex:none;font-family:var(--fn);font-weight:400;font-size:22px;color:var(--grn);letter-spacing:0;width:38px;transition:color .3s}
.q .t{flex:1}
.pm{flex:0 0 52px;height:52px;border-radius:50%;border:1.5px solid rgba(246,243,250,.35);display:grid;place-items:center;font-size:28px;font-weight:400;transition:transform .5s var(--ease),background .4s,color .4s,box-shadow .4s,border-color .4s}
.q button:hover .pm{border-color:var(--ink)}
.q.open .pm{background:var(--ink);color:var(--bg);border-color:var(--ink);transform:rotate(45deg)}
.a{max-height:0;overflow:hidden;transition:max-height .55s var(--ease)}
.a p{padding:0 0 32px 82px;font-size:20px;max-width:720px;line-height:1.5}
.faq-cta{margin-top:28px;display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap;padding:26px 30px;border-radius:24px;background:var(--bg);border:1px solid var(--line)}
.faq-cta b{font-size:clamp(20px,1.7vw,26px);font-weight:800;letter-spacing:-.02em;display:block}
.faq-cta p{font-size:18px;margin-top:4px}

/* cta */
.cta-sec{position:relative;overflow:hidden;padding:clamp(120px,14vw,200px) 0;text-align:center}
.cta-sec .bg{position:absolute;inset:-12% 0}
.cta-sec .bg img{width:100%;height:100%;object-fit:cover;filter:brightness(.5)}
.cta-sec .bg::after{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at 50% 50%,rgba(10,10,12,.25),rgba(10,10,12,.85) 75%),linear-gradient(0deg,var(--bg),transparent 25%,transparent 75%,var(--bg))}
.cta-sec .wrap{position:relative;display:flex;flex-direction:column;align-items:center}
.cta-sec h2{font-size:clamp(46px,7vw,110px);max-width:14ch;line-height:1.05}
.cta-sec h2 .neon{display:inline-block;padding:0 .12em .1em;line-height:1.2}
.cta-sec .lead{margin-top:30px;max-width:560px}
.cta-sec .cta{justify-content:center}
.cta-sec .note{margin-top:26px;font-size:18px;font-weight:600;display:inline-flex;gap:12px;align-items:center}
.cta-sec .note::before{content:"";width:10px;height:10px;border-radius:50%;background:var(--grn);box-shadow:0 0 10px var(--grn)}

/* footer */
footer{position:relative;overflow:hidden;background:var(--bg)}
.foot-hero{position:relative;height:clamp(460px,78vh,820px);display:flex;align-items:flex-end;justify-content:center;overflow:hidden}
.foot-hero .bg{position:absolute;inset:-15% 0 0}
.foot-hero .bg img{width:100%;height:100%;object-fit:cover;filter:brightness(.75)}
.foot-hero .bg::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,var(--bg) 6%,rgba(10,10,12,.15) 50%,rgba(10,10,12,.55))}
.foot-hero .hup{position:relative;font-size:clamp(150px,34vw,560px);font-weight:900;letter-spacing:-.07em;line-height:.78;font-variation-settings:"wdth" 122;color:#fff;margin-bottom:-.06em;user-select:none}
.foot-hero .hup b{color:var(--mag);text-shadow:0 0 40px var(--mag)}
.foot-hero .tag{position:absolute;top:clamp(48px,9vw,120px);left:50%;translate:-50% 0;font-size:clamp(28px,3.4vw,48px);white-space:nowrap}
.foot-cta{position:relative;z-index:2;display:flex;justify-content:center;margin-top:-30px}
.foot-grid{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:32px;padding:56px 0 40px;border-top:1px solid var(--line);margin-top:56px}
.foot-links{display:flex;gap:6px 30px;flex-wrap:wrap;justify-content:center;font-size:18px;font-weight:700}
.foot-links a{position:relative;padding:6px 0}
.foot-links a::after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;background:var(--ink);transform:scaleX(0);transform-origin:right;transition:transform .45s var(--ease)}
.foot-links a:hover{color:var(--ink)}
.foot-links a:hover::after{transform:scaleX(1);transform-origin:left}
.foot-bottom{display:flex;justify-content:space-between;align-items:center;gap:24px;flex-wrap:wrap;padding:0 0 44px;font-size:17px;font-weight:600}
.foot-bottom .neon{font-size:22px;animation:none}

.break{position:relative;height:clamp(440px,85vh,860px);overflow:hidden;background:var(--bg)}
.break .bg{position:absolute;inset:-14% 0}
.break .bg img{width:100%;height:100%;object-fit:cover}
.break::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,var(--bg),rgba(10,10,12,.15) 28%,rgba(10,10,12,.1) 72%,var(--bg))}
.break .bq{position:absolute;left:var(--pad);right:var(--pad);bottom:clamp(44px,9vw,110px);text-align:center;font-size:clamp(36px,5vw,72px);line-height:1.2;z-index:1}
.pack .ph{aspect-ratio:16/10;margin:calc(-1*clamp(28px,3vw,42px)) calc(-1*clamp(28px,3vw,42px)) 10px;overflow:hidden;position:relative}
.pack .ph img{width:100%;height:100%;object-fit:cover;transition:transform 1s var(--ease);filter:brightness(.85)}
.pack:hover .ph img,.pack.hi .ph img{transform:scale(1.05)}
.pack .ph::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,var(--bg2),transparent 45%)}
.pack .ph .rec{position:absolute;left:clamp(28px,3vw,42px);top:22px;font-family:var(--fn);font-size:24px;color:#fff;text-shadow:0 0 6px #fff,0 0 14px var(--pur),0 0 30px var(--pur);z-index:1}
[data-reveal]{opacity:0;transform:translateY(34px);transition:opacity 1s var(--ease),transform 1s var(--ease);transition-delay:var(--d,0s)}
[data-reveal].in{opacity:1;transform:none}

/* responsive */
@media(max-width:1060px){
 .nav-links,.nav .btn{display:none}
 .burger{display:block}
 .hero .wrap{grid-template-columns:1fr}
 .hero-media{justify-self:stretch;width:100%;margin-top:60px}
 .hero-shot{aspect-ratio:16/10;transform:none}
 .hero-shot img{object-position:50% 22%;transform:none !important}
 .wp .wrap,.faq .wrap,.value .wrap,.pk-head,.calc,.phase{grid-template-columns:1fr}
 .packs{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:14px;margin:26px calc(-1*var(--pad)) 0;padding:12px var(--pad) 20px;scrollbar-width:none}
 .packs::-webkit-scrollbar{display:none}
 .pack{flex:0 0 min(340px,82%);scroll-snap-align:center}
 .packs.pick .pack:not(.hi){opacity:1}
 .pack:hover,.pack.hi{transform:none}
 .packs{scroll-padding-inline:var(--pad)}
 .pdots{display:flex}
 .phase .pic{min-height:0;aspect-ratio:16/10}
 .wp-left,.faq-left{position:static}
 .wp-left .shot{display:none}
 .tra-grid{grid-template-columns:1fr}
 .vshot{order:-1;aspect-ratio:4/5;max-height:none;max-width:420px}
 .vshot img{object-position:50% 22%;transform:none !important}
 .faq-left .shot{display:none}
 .base{grid-template-columns:1fr}
 .q .n{display:none}
 .a p{padding-left:14px}
 .q button:hover,.q.open button{padding-left:14px}
 .foot-grid{grid-template-columns:1fr;justify-items:center;text-align:center}
 .foot-bottom{justify-content:center;text-align:center}
 .calc .sum{order:-1}
 .row{grid-template-columns:1fr}
 .row .pr{text-align:left}
 .row .pr small{display:inline;margin-left:8px}
}
@media(max-width:900px){
 .tr{grid-template-columns:1.3fr repeat(3,.7fr)}
 .tr>div{padding:16px 10px;font-size:17px}
 .tr>div:first-child{padding-left:18px;font-size:17px}
 .tr.head>div{font-size:19px;padding:18px 10px}
 .tr.head .sc{display:none}
 .tr .dot{width:14px;height:14px}
 .tr.price>div{font-size:17px;padding:18px 8px}
}
@media(max-width:640px){
 .hero{padding:130px 0 80px}
 .btn{padding:18px 26px}
 .cta .btn{width:100%;justify-content:center}
 .logo img{height:50px}
 .hero-shot{aspect-ratio:4/5}
 .band{transform:rotate(-3deg) scale(1.08)}
 .foot-hero .tag{font-size:26px}
 .rlabels button{font-size:17px}
 .vshot .tag{font-size:26px}
}
@media(prefers-reduced-motion:reduce){
 *{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important}
 .ln>span{transform:none;opacity:1}
 [data-reveal]{opacity:1;transform:none}
 .table .tr .dot{transform:none}
}

/* photo visibility */
.hero-bg{inset:-12% -3% 0 -3%}
.hero-bg::after{background:linear-gradient(90deg,rgba(10,10,12,.94) 0%,rgba(10,10,12,.78) 32%,rgba(10,10,12,.22) 58%,rgba(10,10,12,0) 78%),linear-gradient(0deg,var(--bg) 0%,transparent 22%)}
.hero-shot::after{background:linear-gradient(0deg,rgba(10,10,12,.88) 0%,rgba(10,10,12,.4) 30%,transparent 46%)}
.hero-shot{transition:transform .8s var(--ease),box-shadow .8s var(--ease),translate .3s ease-out}
.wp-left .shot .cap,.phase .pic .cap,.vshot .tag{background:rgba(10,10,12,.66);padding:10px 20px 12px;border-radius:16px}
.phase .pic::after,.vshot::after{background:none}
.tra .bg img{filter:none}
.tra .bg::after{background:linear-gradient(0deg,var(--bg),transparent 20%,transparent 80%,var(--bg))}
.tra-text{background:rgba(10,10,12,.74);padding:clamp(22px,3vw,40px);border-radius:28px}
.tra .script,.tra h2{position:relative}
.tra h2{display:inline-block;background:rgba(10,10,12,.74);padding:14px 22px 18px;border-radius:22px;margin-left:-22px}
.tcard{background:rgba(10,10,12,.84);backdrop-filter:none;-webkit-backdrop-filter:none}
.pack .ph img{filter:none}
.pack .ph::after{background:linear-gradient(0deg,var(--bg2),transparent 26%)}
.cta-sec .bg img{filter:none}
.cta-sec .bg::after{background:linear-gradient(0deg,var(--bg),transparent 18%,transparent 82%,var(--bg))}
.cta-sec .wrap{background:rgba(10,10,12,.74);border-radius:40px;padding:clamp(40px,5vw,80px) clamp(24px,4vw,64px);width:min(1000px,calc(100% - 2*var(--pad)))}
.foot-hero .bg img{filter:none}
.foot-hero .bg::after{background:linear-gradient(0deg,var(--bg) 5%,rgba(10,10,12,.05) 45%,rgba(10,10,12,.35))}
.break::after{background:linear-gradient(0deg,var(--bg),transparent 18%,transparent 82%,var(--bg))}
.break .bq{background:rgba(10,10,12,.6);display:inline-block;left:50%;right:auto;translate:-50% 0;padding:14px 32px;border-radius:22px;max-width:calc(100% - 2*var(--pad))}
.faq-left .shot.art{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:22px;padding:28px;background:var(--bg);background-image:radial-gradient(rgba(246,243,250,.14) 1px,transparent 1.6px);background-size:22px 22px;border:1px solid var(--line);transform:none;box-shadow:0 40px 80px -30px rgba(0,0,0,.9),0 0 80px -30px rgba(255,159,28,.5)}

/* photo focus */
img[src$="1081.webp"],img[src$="1082.webp"]{object-position:50% 28%}
img[src$="1038.webp"]{object-position:50% 34%}
img[src$="1105.webp"],img[src$="1108.webp"]{object-position:50% 62%}
img[src$="1085.webp"],img[src$="1087.webp"]{object-position:50% 46%}
img[src$="1071.webp"]{object-position:40% 40%}
img[src$="1037.webp"]{object-position:62% 45%}
img[src$="1083.webp"]{object-position:50% 38%}
img[src$="1051.webp"]{object-position:66% 50%}
img[src$="1053.webp"],img[src$="1061.webp"]{object-position:72% 50%}
img[src$="1066.webp"],img[src$="1067.webp"]{object-position:60% 50%}
.tra{background:var(--bg2)}
.tra .bg{display:none}
.tra-top{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(36px,5vw,80px);align-items:center}
.tra-pic{position:relative;aspect-ratio:4/5;max-height:720px;border-radius:260px 260px 32px 32px;overflow:hidden;border:1px solid var(--line);box-shadow:0 60px 120px -40px rgba(0,0,0,.95),0 0 90px -30px rgba(255,159,28,.4);justify-self:end;width:min(100%,520px)}
.tra-pic img{width:100%;height:100%;object-fit:cover;object-position:50% 58%}
.tra h2{background:none;padding:0;margin-left:0;display:block}
.tra-text{background:none;padding:0;font-size:clamp(22px,2.1vw,32px);margin-top:28px;max-width:640px}
.tcard{background:var(--bg)}
@media(max-width:1060px){.tra-top{grid-template-columns:1fr}.tra-pic{justify-self:start;aspect-ratio:4/5;max-width:420px}
.hero-bg::after{background:linear-gradient(0deg,var(--bg) 0%,rgba(10,10,12,.9) 42%,rgba(10,10,12,.6) 68%,rgba(10,10,12,.25) 100%)}}
.faq-left .shot.art{display:block;padding:0;background:var(--bg);background-image:none;border:1px solid var(--line);box-shadow:0 40px 80px -30px rgba(0,0,0,.9)}
.vshot.art{background:var(--bg2);border:1px solid var(--line)}
.base{grid-template-columns:minmax(0,.5fr) minmax(0,1fr);align-items:center;gap:20px clamp(28px,4vw,56px);padding:24px 34px 24px 24px}
.base .k{display:block;margin-bottom:14px}
.base-art{aspect-ratio:4/3;border-radius:20px;overflow:hidden;background:var(--bg2)}
.base ul{flex-direction:column;gap:6px;display:flex}
@media(max-width:1060px){.base{grid-template-columns:1fr}.base-art{max-width:420px}}

/* rings */
.hero-media{z-index:1}
/* row thumbs */
.row{grid-template-columns:1fr auto auto}
.row .thumbs{display:flex;gap:8px;width:0;overflow:hidden;transition:width .6s var(--ease);order:3}
.row:hover .thumbs,.row:focus-visible .thumbs,.row.open .thumbs{width:clamp(180px,22vw,300px)}
.row .thumbs img{flex:none;width:calc((clamp(180px,22vw,300px) - 16px)/3);aspect-ratio:3/4;object-fit:cover;border-radius:12px;transform:translateX(30px) rotate(4deg);opacity:0;transition:transform .6s var(--ease),opacity .5s}
.row .thumbs img:nth-child(2){transition-delay:.06s}.row .thumbs img:nth-child(3){transition-delay:.12s}
.row:hover .thumbs img,.row:focus-visible .thumbs img,.row.open .thumbs img{transform:none;opacity:1}
.row .pr{order:2}
/* collage */
.collage{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.3fr) minmax(0,.9fr);gap:18px;margin-top:clamp(40px,5vw,64px);align-items:center}
.collage .col{display:flex;flex-direction:column;gap:18px}
.ci{border-radius:24px;overflow:hidden;border:1px solid var(--line);background:var(--bg2);transition:transform .7s var(--ease)}
.ci.ph{aspect-ratio:4/5;cursor:zoom-in;margin:0}
.ci.ph img{width:100%;height:100%;object-fit:cover;transition:transform 1s var(--ease)}
.ci.ph:hover img{transform:scale(1.05)}
.ci.k{padding:22px 24px 24px}
.ci.k .ck{font-family:var(--fn);font-size:22px;color:var(--mag2);display:block}
.ci.k b{display:block;font-size:clamp(34px,3vw,48px);font-weight:900;letter-spacing:-.04em;line-height:1;margin-top:8px;color:#fff}
.ci.k small{display:block;font-size:17px;font-weight:600;margin-top:8px}
.ci.k2 .ck{color:var(--grn)}.ci.k3 .ck{color:var(--pur2)}
.ci.main{padding:clamp(28px,3.4vw,48px);display:flex;flex-direction:column;gap:16px;border-color:rgba(76,207,106,.5)}
.ci.main h3{font-size:clamp(30px,3vw,44px)}
.ci.main p{font-size:19px}
.ci.main .tot{border-top:1px solid var(--line);padding-top:18px;margin-top:4px}
.ci.main .tot span{display:block;font-size:18px;font-weight:700}
.ci.main .tot b{display:block;font-size:clamp(40px,4vw,64px);font-weight:900;letter-spacing:-.04em;line-height:1;color:var(--grn);margin-top:6px;transition:opacity .3s}
.ci.main .tot b.sw{opacity:0}
.ci.main .note{font-size:17px}
.p1{transform:rotate(-3deg)}.k1{transform:rotate(2deg)}.k2{transform:rotate(-2deg)}.p2{transform:rotate(3deg)}.k3{transform:rotate(-1.5deg)}
.ci:hover{transform:rotate(0)}
@media(max-width:1060px){
 .row{grid-template-columns:1fr}
 .row .thumbs{width:100%;order:3}
 .row .thumbs img{opacity:1;transform:none;width:calc((100% - 16px)/3);aspect-ratio:3/2}
 .collage{grid-template-columns:1fr 1fr}
 .collage .col.mid{grid-column:1/-1;order:-1}
 .ci{transform:none!important}
}
@media(max-width:640px){.collage{grid-template-columns:1fr}.ci.ph{aspect-ratio:4/3}}
@media(max-width:640px){
 .btn{max-width:100%;white-space:normal;text-align:center}
 .btn .lbl{height:auto;line-height:1.25}
 .btn .lbl span+span{display:none}
 .btn:hover .lbl span{transform:none}
 .foot-hero .hup{font-size:clamp(96px,34vw,560px)}
}
.dots button{width:48px;height:48px}
.rlabels button{min-height:48px}
.foot-links a{display:inline-flex;align-items:center;min-height:44px}
.crumb a{min-height:48px}
.bandwrap{overflow:hidden;position:relative;z-index:2;margin:-30px 0 -10px;padding:30px 0}
.band{margin:0}
.pdots button{width:44px;height:44px;background:none;position:relative}
.pdots button::before{content:"";position:absolute;left:50%;top:50%;translate:-50% -50%;width:12px;height:12px;border-radius:50%;background:var(--line);transition:background .3s,transform .3s}
.pdots button.on::before{background:var(--ink);transform:scale(1.2)}
.pdots button.on{box-shadow:none;transform:none}

/* a11y + interaction states */
.skip{position:fixed;left:16px;top:16px;z-index:200;background:var(--ink);color:var(--bg);padding:14px 22px;border-radius:999px;font-weight:700;font-size:17px;transform:translateY(-200%);transition:transform .3s}
.skip:focus{transform:none;outline:3px solid #fff;outline-offset:3px}
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,[tabindex]:focus-visible{outline:3px solid var(--ink);outline-offset:4px;box-shadow:0 0 0 7px rgba(246,243,250,.2)}
.btn:active{transform:translateY(0) scale(.97)}
.circ:active,.chip:active,.seg button:active,.rooms button:active,.rlabels button:active,.dots button:active{transform:scale(.95)}
.ferr{display:none;margin-top:18px;padding:14px 18px;border-radius:14px;border:1.5px solid #ff5c5c;background:rgba(255,92,92,.12);font-size:17px;font-weight:600}
.ferr.on{display:block}
@media(max-height:760px) and (min-width:1061px){
 .hero{padding:110px 0 60px;min-height:0}
 .hero h1{font-size:clamp(40px,4.3vw,58px)}
 .hero .pill{margin-bottom:18px}
 .hero p.lead{margin-top:16px;font-size:19px;max-width:560px}
 .hero .cta{margin-top:22px}
 .hero .cta .btn{padding:17px 28px;font-size:18px}
 .hero .scenes{margin-top:26px}
 .cue{display:none}
}
@media(prefers-reduced-motion:reduce){.band .t,.bmq .t,.photomq .t,.aw-mq .t{animation:none!important}.sticker,.vcard .play::before{animation:none!important}}

.hero-bg img{transition:opacity 1.6s var(--ease)}
.hero-bg img.on{animation:drift 30s ease-in-out infinite alternate}
@keyframes drift{from{transform:scale(1.09) translateX(1.5%)}to{transform:scale(1) translateX(0)}}
@media(prefers-reduced-motion:reduce){.hero-bg img.on{animation:none!important}}

/* faq motion */
@keyframes sweep{0%{opacity:1;transform:translateX(-100%)}100%{opacity:0;transform:translateX(250%)}}
.q::after{content:"";position:absolute;left:0;top:-1px;height:1px;width:35%;background:linear-gradient(90deg,transparent,var(--grn),transparent);opacity:0;pointer-events:none;transform:translateX(-100%)}
.q:hover::after{animation:sweep 1s var(--ease)}
.q button{transition:color .3s,padding-left .5s var(--ease),opacity .4s}
.q .n{transform:translateX(-6px);opacity:.7;transition:color .3s,transform .5s var(--ease),opacity .4s}
.q button:hover .n,.q.open .n{transform:none;opacity:1;color:#fff}
.q .t{transition:transform .5s var(--ease)}
.q button:hover .t{transform:translateX(6px)}
.pm{transition:transform .7s cubic-bezier(.34,1.56,.64,1),background .35s,border-color .35s,color .35s}
.q button:hover .pm{transform:scale(1.1)}
.q.open .pm{transform:rotate(135deg) scale(1)}
.q.open button:hover .pm{transform:rotate(135deg) scale(1.1)}
.a p{opacity:0;transform:translateY(12px);transition:opacity .5s var(--ease),transform .6s var(--ease)}
.q.open .a p{opacity:1;transform:none;transition-delay:.12s}
@media(hover:hover){.faq-list:hover .q:not(:hover):not(.open) button{opacity:.55}}
@media(prefers-reduced-motion:reduce){.q:hover::after{animation:none}.q .n,.a p{transform:none;opacity:1}}

/* footer hero: photo-filled letters, soft edges */
.foot-hero{height:clamp(420px,70vh,760px)}
.foot-hero .bg img{opacity:.26;filter:saturate(.9)}
.foot-hero .bg::after{background:linear-gradient(0deg,var(--bg) 4%,rgba(10,10,12,.25) 38%,rgba(10,10,12,.45) 70%,var(--bg) 100%)}
.foot-hero .hup{color:transparent;background:url(img/1083.webp) 40% 35%/cover no-repeat;-webkit-background-clip:text;background-clip:text;clip-path:inset(100% 0 0 0);transition:clip-path 1.5s var(--ease) .15s;animation:hupdrift 32s ease-in-out infinite alternate;filter:saturate(1.15) contrast(1.05)}
.foot-hero.in .hup{clip-path:inset(-12% 0 0 0)}
.foot-hero .hup b{color:var(--mag);text-shadow:none}
@keyframes hupdrift{from{background-position:40% 35%}to{background-position:60% 55%}}
.foot-hero .tag{opacity:0;translate:-50% 14px;transition:opacity 1s var(--ease) .6s,translate 1s var(--ease) .6s}
.foot-hero.in .tag{opacity:1;translate:-50% 0}
@media(prefers-reduced-motion:reduce){.foot-hero .hup{animation:none;clip-path:none}.foot-hero .tag{opacity:1;translate:-50% 0}}