@import url('https://fonts.googleapis.com/css2?family=Audiowide&family=Barlow+Condensed:wght@400;500;600;700;800;900&family=Orbitron:wght@400;500;600;700;800;900&display=swap');
:root{--nacht:#050711;--oceaan:#07172a;--roze:#ff2f9f;--roze2:#ff74c8;--turkoois:#38f7e2;--paars:#9d4dff;--wit:#f7f5ff;--muted:#a8b6ce;--lijn:#1d3450;--glow-pink:0 0 8px #ff2f9f,0 0 24px #ff2f9f66;--glow-cyan:0 0 8px #38f7e2,0 0 24px #38f7e266}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:90px}body{margin:0;background:var(--nacht);color:var(--wit);font:16px/1.6 'Barlow Condensed',Arial,sans-serif;overflow-x:hidden;letter-spacing:.015em}body:before{content:"";position:fixed;inset:0;pointer-events:none;z-index:20;opacity:.13;background:repeating-linear-gradient(0deg,transparent 0 3px,#000 4px 5px);mix-blend-mode:soft-light}
a{color:inherit;text-decoration:none;transition:color .25s, text-shadow .25s,transform .25s}a:hover{color:var(--turkoois);text-shadow:0 0 13px #38f7e277}
button,.knop{position:relative;overflow:hidden;isolation:isolate;cursor:pointer;border:1px solid var(--roze);display:inline-flex;align-items:center;justify-content:center;gap:9px;padding:14px 21px;font-family:'Orbitron',sans-serif;font-weight:800;letter-spacing:.07em;text-transform:uppercase;font-size:.68rem;background:linear-gradient(110deg,#ff2f9f,#b42fff);color:white;box-shadow:0 0 14px #ff2f9f44,inset 0 0 12px #ffffff15;transition:transform .25s,box-shadow .25s,filter .25s}
button:before,.knop:before{content:"";position:absolute;top:-80%;left:-45%;width:30%;height:260%;transform:rotate(25deg);background:#ffffff70;transition:left .55s;z-index:-1}
button:hover,.knop:hover{transform:translateY(-4px) scale(1.025);box-shadow:var(--glow-pink);filter:saturate(1.3);color:white}button:hover:before,.knop:hover:before{left:130%}
.sec{background:#071323!important;border:1px solid var(--turkoois)!important;box-shadow:inset 0 0 16px #38f7e20b,0 0 12px #38f7e21c!important}.sec:hover{box-shadow:var(--glow-cyan)!important}
.container{width:min(1190px,calc(100% - 38px));margin:auto}.announcement{padding:10px;text-align:center;background:#090d1b;border-bottom:1px solid #ff2f9f66;font-family:'Orbitron',sans-serif;font-size:.61rem;letter-spacing:.18em;color:var(--turkoois);text-shadow:0 0 10px #38f7e255}
.topbar{position:sticky;top:0;z-index:30;background:#050711eF;backdrop-filter:blur(18px);border-bottom:1px solid #38f7e244;box-shadow:0 8px 30px #0005}.nav{min-height:78px;display:flex;align-items:center;justify-content:space-between;gap:20px}.logo{font-family:'Audiowide',sans-serif;font-size:1.55rem;letter-spacing:.19em;line-height:1;color:#fff;text-shadow:2px 0 var(--roze),-2px 0 var(--turkoois),0 0 20px #ff2f9f55}.logo small{display:block;text-align:center;font-family:'Orbitron',sans-serif;font-size:.48rem;letter-spacing:.5em;margin-top:7px;color:var(--turkoois);text-shadow:0 0 10px #38f7e277}
.navlinks,.navtools{display:flex;gap:22px;font-family:'Orbitron',sans-serif;font-size:.62rem;text-transform:uppercase;letter-spacing:.04em}.navlinks a{position:relative;padding:8px 0}.navlinks a:after{content:"";height:2px;position:absolute;left:0;right:100%;bottom:0;background:var(--roze);box-shadow:var(--glow-pink);transition:right .25s}.navlinks a:hover:after{right:0}
.hero{min-height:680px;display:flex;align-items:center;position:relative;isolation:isolate;overflow:hidden;background:linear-gradient(90deg,#050711f2 0%,#050711bb 45%,#05071130 100%),url('vynor-hero-demo.jpg') center/cover no-repeat}
.hero:before{content:"";position:absolute;z-index:-1;inset:0;background:linear-gradient(115deg,transparent 30%,#ff2f9f12 50%,transparent 68%),linear-gradient(0deg,#050711 0%,transparent 23%);animation:neonwash 8s ease-in-out infinite alternate}
.hero:after{content:"";position:absolute;bottom:0;left:0;right:0;height:3px;background:linear-gradient(90deg,transparent,var(--roze),var(--turkoois),var(--paars),transparent);box-shadow:0 0 22px #ff2f9f}
.hero-content{max-width:750px;padding:100px 0;animation:rise-in .9s both}.eyebrow{color:var(--turkoois);font:700 .67rem 'Orbitron',sans-serif;letter-spacing:.22em;text-transform:uppercase;text-shadow:0 0 14px #38f7e255}.hero h1{font-family:'Audiowide','Orbitron',sans-serif;font-size:clamp(3.1rem,8vw,7.1rem);line-height:.92;letter-spacing:-.045em;margin:22px 0;text-transform:uppercase;text-shadow:3px 3px 0 #ff2f9f, -2px -2px 0 #38f7e233,0 0 38px #ff2f9f55;animation:title-flicker 7s infinite}
.hero p{max-width:540px;color:#e4e9f5;font-size:1.18rem}.actions{display:flex;gap:14px;flex-wrap:wrap;margin-top:30px}.age-note{font-size:.7rem;color:#a3b0c5}
.section{padding:94px 0;position:relative}.section:nth-of-type(even){background:linear-gradient(180deg,#07101e,#080b17)}.section-head{display:flex;justify-content:space-between;align-items:end;gap:30px;margin-bottom:38px}.section h2,.editorial h2{font-family:'Audiowide',sans-serif;font-size:clamp(2rem,4.4vw,3.7rem);line-height:1.05;letter-spacing:-.035em;margin:13px 0;text-shadow:0 0 24px #ff2f9f20}.section-intro{max-width:430px;color:#c4cfdb;font-size:1.12rem}
.products{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:26px}.product-card{position:relative;background:linear-gradient(145deg,#0c1729,#080d18);border:1px solid #ffffff14;transition:transform .35s,border-color .35s,box-shadow .35s;overflow:hidden}.product-card:before{content:"";position:absolute;z-index:2;left:0;top:0;width:100%;height:2px;background:linear-gradient(90deg,transparent,var(--roze),var(--turkoois),transparent);transform:scaleX(.25);opacity:.4;transition:transform .35s,opacity .35s}.product-card:hover{transform:translateY(-9px);border-color:#ff2f9f88;box-shadow:0 20px 50px #0007,0 0 26px #ff2f9f15}.product-card:hover:before{transform:scaleX(1);opacity:1;box-shadow:var(--glow-pink)}
.product-art{min-height:315px;display:flex;align-items:center;justify-content:center;background:radial-gradient(ellipse at 50% 70%,#8c195d77,transparent 48%),linear-gradient(140deg,#24112f,#100d20);position:relative;overflow:hidden}.product-art:before{content:"";position:absolute;inset:-40%;background:repeating-linear-gradient(115deg,transparent 0 38px,#ff60bd0b 39px 40px);transform:perspective(400px) rotateX(30deg);animation:drift 15s linear infinite}.product-art.tropical{background:radial-gradient(ellipse at 50% 70%,#0c9b9877,transparent 48%),linear-gradient(140deg,#102a43,#073d50)}
.can{position:relative;z-index:1;width:116px;height:235px;border-radius:19px 19px 14px 14px;border:2px solid #ffffffa0;background:linear-gradient(90deg,#c51c78,#ff61b2 50%,#a51666);box-shadow:0 22px 45px #0009,0 0 30px #ff2f9f44;display:flex;align-items:center;justify-content:center;text-align:center;font-family:'Orbitron',sans-serif;font-weight:900;transform:rotate(-5deg);animation:float-can 4.5s ease-in-out infinite;transition:transform .4s,filter .4s}.product-card:hover .can{transform:rotate(2deg) translateY(-9px) scale(1.07);filter:drop-shadow(0 0 20px #ff2f9f77)}.can small{display:block;font-size:.5rem;margin-top:12px;letter-spacing:.08em}.tropical .can{background:linear-gradient(90deg,#047e8a,#31d6c7 50%,#087e87);box-shadow:0 22px 45px #0009,0 0 30px #38f7e244}
.product-copy{padding:25px}.product-copy h3{font:1.4rem 'Orbitron',sans-serif;margin:0;text-transform:uppercase}.muted{color:var(--muted)}.specs{display:flex;gap:12px;flex-wrap:wrap;border-block:1px solid var(--lijn);padding:14px 0;margin:18px 0;font-size:.83rem;color:#d7e0ec}.price{font:800 1.65rem 'Orbitron',sans-serif;margin:16px 0;color:white}.product-actions{display:flex;align-items:center;gap:15px;flex-wrap:wrap}.textlink{font:700 .68rem 'Orbitron',sans-serif;text-transform:uppercase;color:var(--turkoois)}
.editorial{min-height:470px;display:flex;align-items:center;position:relative;isolation:isolate;background:linear-gradient(90deg,#080c18ed,#080c1840),url('vynor-lifestyle-demo.jpg') center/cover no-repeat}.editorial:after{content:"";position:absolute;z-index:-1;inset:0;border-block:1px solid #38f7e244;box-shadow:inset 0 0 60px #38f7e20a}.editorial-copy{max-width:520px;padding:80px 0}.editorial p{color:#e0e6ee;font-size:1.15rem}
.values{display:grid;grid-template-columns:repeat(4,1fr);border-block:1px solid var(--lijn)}.value{text-align:center;padding:30px 20px;border-right:1px solid var(--lijn);transition:background .25s,transform .25s}.value:hover{background:#102137;transform:translateY(-5px)}.value:last-child{border:0}.value strong{display:block;color:var(--roze);font:1.4rem 'Orbitron',sans-serif;text-shadow:var(--glow-pink);margin-bottom:8px}.value span{font-size:.9rem;color:#c3ceda}
.split{display:grid;grid-template-columns:1fr 1fr;gap:45px;align-items:center}.split-art{min-height:380px;background:url('vynor-lifestyle-demo.jpg') center/cover;border:1px solid #38f7e244;box-shadow:12px 12px 0 #ff2f9f18,0 0 35px #38f7e20b;transition:transform .4s}.split-art:hover{transform:perspective(800px) rotateY(-3deg) scale(1.015)}.faq details{padding:20px 0;border-bottom:1px solid var(--lijn)}.faq summary{cursor:pointer;font:700 .9rem 'Orbitron',sans-serif;transition:color .2s}.faq summary:hover{color:var(--turkoois)}.faq details[open] summary{color:var(--roze)}.faq details p{color:#bbc7d4}
.footer{border-top:1px solid #38f7e255;padding:55px 0 20px;background:#04060e;box-shadow:0 -10px 35px #38f7e208}.footer-grid{display:grid;grid-template-columns:1.2fr 1fr 1fr 1.2fr;gap:28px}.footer h4{font:700 .7rem 'Orbitron',sans-serif;letter-spacing:.12em;text-transform:uppercase;color:var(--turkoois)}.footer a,.footer p{display:block;color:#b4c1d0;font-size:.9rem;margin:9px 0}.copyright{border-top:1px solid var(--lijn);padding-top:18px;margin-top:30px;color:#8c9aab;font-size:.75rem;display:flex;justify-content:space-between;gap:15px}
.notice{padding:14px;background:#101d30;border-left:3px solid #ff8a55;margin:18px 0;font-size:.9rem}.pagehead{padding:65px 0;background:linear-gradient(120deg,#102a43,#080c18);border-bottom:1px solid #38f7e244}.pagehead h1{font:clamp(2.5rem,6vw,4.5rem) 'Audiowide',sans-serif;line-height:1;margin:12px 0}.detail-layout{display:grid;grid-template-columns:1fr 1fr;gap:42px}.detail-visual{min-height:420px}.detail-info h1{font:clamp(2.5rem,5vw,4rem) 'Audiowide',sans-serif;line-height:1.05}.qty{margin:20px 0}.qty input,.search-input{padding:12px;background:#0b1423;color:white;border:1px solid var(--lijn);width:90px}.cart-row{display:grid;grid-template-columns:1fr auto auto;gap:16px;padding:20px 0;border-bottom:1px solid var(--lijn);align-items:center}.empty{text-align:center;padding:80px 20px}.hidden{display:none}
@keyframes float-can{0%,100%{translate:0 0}50%{translate:0 -11px}}@keyframes drift{from{background-position:0 0}to{background-position:160px 160px}}@keyframes neonwash{from{opacity:.45;transform:translateX(-2%)}to{opacity:1;transform:translateX(2%)}}@keyframes rise-in{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:translateY(0)}}@keyframes title-flicker{0%,94%,96%,100%{opacity:1}95%{opacity:.8}}
@media(max-width:760px){.nav{padding:14px 0;flex-wrap:wrap}.navlinks{order:3;width:100%;justify-content:space-between;gap:8px;font-size:.57rem}.navtools{font-size:.6rem}.hero{min-height:570px;background-position:58% center}.hero-content{padding:75px 0}.hero h1{font-size:clamp(2.7rem,12vw,4.5rem)}.section{padding:62px 0}.section-head{display:block}.section-intro{margin-top:18px}.products,.split,.detail-layout{grid-template-columns:1fr}.values{grid-template-columns:1fr 1fr}.value{border-bottom:1px solid var(--lijn)}.value:nth-child(2){border-right:0}.footer-grid{grid-template-columns:1fr 1fr}.copyright{display:block}.detail-visual{min-height:300px}.product-art{min-height:270px}}
@media(max-width:430px){.navtools{gap:8px}.footer-grid{grid-template-columns:1fr}.hero h1{font-size:2.65rem}.logo{font-size:1.3rem}.navlinks{letter-spacing:0}.product-copy{padding:19px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.01ms!important}}