/* KITZLABS Digital Experience V2 | Copyright (c) 2026 AI Kitz Art & Labs e.U.
   Responsible original-design licensing, reduced motion and progressive enhancement. */
:root{--ease:cubic-bezier(.22,1,.36,1)}
body{--mx:55vw;--my:30vh}
.hero{isolation:isolate}
.hero:before{content:"";position:absolute;z-index:-1;inset:-10% -10% -10% -10%;pointer-events:none;background:radial-gradient(ellipse 28% 29% at var(--mx) var(--my),rgba(172,238,148,.105),transparent 83%),linear-gradient(160deg,rgba(189,240,151,.04),transparent 60%);transition:background .5s}
.hero h1{animation:hero-rise 1.4s var(--ease) both;transform-origin:0 100%;text-shadow:0 16px 65px #0002}
.hero .micro{animation:slide-fade .8s .1s var(--ease) both}
.hero .hero-tail{animation:slide-fade 1.0s .45s var(--ease) both}
.header{transition:height .45s var(--ease),background .45s,box-shadow .45s}
.header.is-scrolled{height:72px;box-shadow:0 15px 35px rgba(0,0,0,.25)}
.logo svg{animation:logo-breathe 7s ease-in-out infinite}
.hero-decor{animation:slow-float 12s ease-in-out infinite;transform-origin:center}
.category-card:nth-child(3n+2) img{object-position:60% 30%}
.category-card:nth-child(4n+3){border-radius:120px 0 0 0}
.category-card:nth-child(4n+4){border-radius:0 0 120px 0}
.product-card{will-change:transform;transform-origin:center;transition:transform .6s var(--ease),box-shadow .6s,border-color .3s}
.product-card:hover{transform:translateY(-12px);box-shadow:0 25px 55px #0007}
.product-card:nth-child(5n+3) .card-image img{object-position:60% 25%}
.product-card:nth-child(6n+4) .card-image img{object-position:40% 45%}
.category-card img,.card-image img{filter:saturate(.9);transition:filter .7s,transform 1.1s var(--ease)}
.category-card:hover img,.product-card:hover .card-image img{filter:saturate(1.13)}
.section-head{position:relative}
.section-head:after{content:"";position:absolute;bottom:-24px;left:0;height:1px;width:100%;background:linear-gradient(90deg,rgba(194,239,157,.7),transparent)}
.detail-visual{overflow:hidden}
.detail-visual img{transition:transform 1s var(--ease)}
.detail-visual:hover img{transform:scale(1.025)}
.scroll-progress{position:fixed;z-index:150;left:0;top:0;width:0;height:3px;background:linear-gradient(90deg,#b2f081,#def3c7);box-shadow:0 0 20px #b2f084}
.motion-active .is-reveal{opacity:0;transform:translateY(44px);filter:blur(8px);transition:opacity 1s var(--ease),transform 1s var(--ease),filter 1s var(--ease)}
.motion-active .is-reveal.in-view{opacity:1;transform:none;filter:none}
.motion-active .is-reveal:nth-child(3n+2){transition-delay:.08s}
.motion-active .is-reveal:nth-child(3n){transition-delay:.17s}
.float-ornament{position:fixed;right:-48px;top:35%;width:150px;height:150px;border-radius:50%;border:1px solid rgba(194,239,157,.13);pointer-events:none;z-index:0;box-shadow:0 0 0 28px rgba(194,239,157,.026),0 0 0 65px rgba(194,239,157,.013);animation:slow-float 14s infinite ease-in-out}
.detail-hero .micro,.inner-heading .kicker{animation:slide-fade 1s var(--ease) both}
.rights-section{padding:clamp(70px,9vw,140px) var(--pad);background:linear-gradient(135deg,#1b3028,#091312);display:grid;grid-template-columns:1.2fr .8fr;gap:55px;border-top:1px solid #779a7644;align-items:center}
.rights-section h2{margin:18px 0 24px;font-size:clamp(36px,5.3vw,82px);line-height:1.05}
.rights-section p{color:#b9ccbd;max-width:580px}
.rights-section a{justify-self:end}
.legal-area{padding:90px var(--pad) 140px;max-width:1440px;margin:0 auto}
.legal-area h1{font-size:clamp(3.4rem,8vw,8rem);margin:35px 0 40px}
.legal-area h2{font-size:clamp(22px,3vw,35px);line-height:1.2;letter-spacing:-.04em;margin-bottom:20px}
.legal-area a:not(.btn){color:#c2ef9d;text-decoration:underline;text-decoration-color:#c2ef9d66;text-underline-offset:3px}
.legal-area p{font-size:clamp(14px,1.35vw,17px);line-height:2;color:#bbcbc3}
.legal-area .legalbox{padding:35px;background:#11201f;border:1px solid #29463a;margin:20px 0 30px}
.legal-area .legalbox h2{margin-top:0}
.legal-grid{display:grid;grid-template-columns:1fr 1fr;gap:40px;margin:50px 0}
.legal-section{border-top:1px solid #3b4c45;padding:32px 0}
.legal-section strong{font-size:20px}
.legal-notice{background:#c2ef9d;color:#0b1710;padding:22px 30px;border-radius:3px;margin:40px 0}
.legal-notice p{color:#16351a;margin:0}
.license-check{display:flex;gap:20px;flex-wrap:wrap;margin-top:45px}
.license-check a{display:inline-flex;padding:13px 18px;border:1px solid #679b64;text-decoration:none!important;font-size:12px;letter-spacing:.06em}
.legal-stamp{color:#9baa9c;font-size:11px;letter-spacing:.13em;margin-top:30px}
.intro-gate{position:fixed;z-index:500;inset:0;background:#071011;display:none;flex-direction:column;justify-content:space-between;padding:clamp(25px,4vw,55px);color:#f2fff0;overflow:hidden;isolation:isolate}
.intro-gate.is-open{display:flex}
.intro-gate.is-leaving{animation:gate-exit .9s var(--ease) both}
.intro-gate:before{content:"";position:absolute;inset:-40%;z-index:-1;background:radial-gradient(circle at 50% 50%,#335b463c,transparent 45%);animation:gate-pulse 5s ease-in-out infinite}
.intro-gate .gate-orbit{position:absolute;inset:50% auto auto 50%;width:min(77vw,790px);aspect-ratio:1;border:1px solid #c2ef9d35;border-radius:50%;transform:translate(-50%,-50%);animation:gate-spin 18s linear infinite;pointer-events:none}
.intro-gate .gate-orbit:after{content:"";position:absolute;inset:12%;border:1px solid #c2ef9d25;border-radius:50%}
.intro-gate .gate-orbit.orbit2{width:min(53vw,540px);transform:translate(-50%,-50%) rotate(45deg);animation-direction:reverse}
.gate-upper,.gate-lower{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:10px;font-weight:800;letter-spacing:.17em}
.gate-lower button{background:transparent;border:1px solid #bfe7ab;padding:12px 18px;color:#f3f5f0;letter-spacing:.1em;cursor:pointer}
.gate-center{text-align:center;z-index:1}
.gate-center .gate-eyebrow{font-size:10px;letter-spacing:.3em;display:block;margin-bottom:28px;color:#bceab2}
.gate-center .gate-word{font-size:clamp(3.3rem,15.5vw,14rem);font-weight:800;letter-spacing:-.105em;line-height:.96;animation:gate-letter 1.3s var(--ease) both}
.gate-word span{color:#c2ef9d}
.gate-center p{font-size:10px;letter-spacing:.18em;color:#c5d6cd;margin-top:32px}
.gate-line{position:absolute;bottom:0;left:0;height:5px;background:#c2ef9d;width:0;animation:gate-loading 3.8s linear both}
.splash-page{min-height:100vh;overflow:hidden}
.splash-scene{min-height:100dvh;position:relative;display:flex;flex-direction:column;justify-content:space-between;padding:clamp(28px,5vw,80px);isolation:isolate;overflow:hidden;background:#071011;color:#fff}
.splash-scene:before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(ellipse at 50% 40%,#284c3844,transparent 60%),repeating-linear-gradient(90deg,transparent 0 100px,#c2ef9d08 101px 102px)}
.splash-scene .splash-upper,.splash-scene .splash-lower{display:flex;justify-content:space-between;align-items:center;gap:10px;font-size:11px;letter-spacing:.2em;font-weight:750}
.splash-scene .splash-middle{text-align:center;position:relative;z-index:1}
.splash-middle>span{font-size:12px;color:#c2ef9d;letter-spacing:.25em}
.splash-middle h1{font-size:clamp(3.3rem,15vw,16rem);font-weight:800;letter-spacing:-.11em;line-height:1;margin:10px 0 25px;animation:gate-letter 1.4s var(--ease) both}
.splash-middle h1 em{font-style:normal;font-family:Sora,sans-serif;color:#c2ef9d}
.splash-middle p{font-size:11px;letter-spacing:.2em}
.splash-scene .splash-ring{position:absolute;width:min(76vw,800px);aspect-ratio:1;left:50%;top:50%;border-radius:50%;border:1px solid #c2ef9d24;transform:translate(-50%,-50%);z-index:-1;animation:gate-spin 24s linear infinite}
.splash-scene .splash-ring:after{content:"";position:absolute;inset:16%;border:1px solid #c2ef9d20;border-radius:50%}
.splash-scene .splash-line{position:absolute;bottom:0;left:0;background:#c2ef9d;height:5px;animation:gate-loading 3.6s linear forwards}
.splash-lower a{padding:14px 16px;border:1px solid #c2ef9d;color:#c2ef9d}
@keyframes hero-rise{from{opacity:0;transform:translateY(80px) skewY(3deg);filter:blur(9px)}to{opacity:1;transform:none;filter:none}}
@keyframes slide-fade{from{opacity:0;transform:translateY(25px)}to{opacity:1;transform:none}}
@keyframes logo-breathe{50%{filter:drop-shadow(0 0 20px #c2ef9d55);transform:scale(1.08)}}
@keyframes slow-float{50%{transform:translate3d(-18px,16px,0) rotate(-2deg)}}
@keyframes gate-loading{to{width:100%}}
@keyframes gate-spin{to{transform:translate(-50%,-50%) rotate(360deg)}}
@keyframes gate-letter{from{opacity:0;transform:scale(.83) translateY(45px);filter:blur(20px)}to{opacity:1;transform:none;filter:none}}
@keyframes gate-pulse{50%{transform:scale(1.2);filter:hue-rotate(30deg)}}
@keyframes gate-exit{to{transform:translateY(-102%);opacity:0;filter:blur(9px)}}
@media(max-width:860px){.rights-section{grid-template-columns:1fr;gap:25px}.rights-section a{justify-self:start}.legal-grid{grid-template-columns:1fr}.gate-upper span:last-child,.splash-upper span:last-child{display:none}}
@media(max-width:600px){.intro-gate{padding:25px 20px}.gate-center .gate-word{font-size:clamp(3.1rem,14.5vw,6rem)}.gate-upper,.gate-lower{font-size:9px;letter-spacing:.06em}.gate-center p{font-size:9px}.intro-gate .gate-orbit{width:100vw}.intro-gate .gate-orbit.orbit2{width:72vw}.splash-scene{padding:30px 20px}.splash-middle h1{font-size:clamp(3.0rem,14.5vw,6.5rem)}.splash-middle>span{font-size:9px;letter-spacing:.12em}.splash-scene .splash-upper,.splash-scene .splash-lower{font-size:9px;letter-spacing:.07em}.legal-area{padding:70px 22px}.legal-area h1{font-size:clamp(2.9rem,12vw,5rem)}.rights-section{padding:75px 20px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}.motion-active .is-reveal{opacity:1;transform:none;filter:none}.intro-gate{display:none!important}}