
:root{
  --bg:#070b12;--bg-soft:#0d1420;--text:#f5f7fb;--muted:rgba(255,255,255,.72);--line:rgba(255,255,255,.10);
  --card:rgba(255,255,255,.035);--glass:rgba(255,255,255,.05);--yellow:#ffd128;--blue:#27b7ff;--red:#ff2d73;--orange:#ff7a00;
  --shadow:0 30px 80px rgba(0,0,0,.28);
}
body.light{--bg:#f7f7f5;--bg-soft:#edf2f7;--text:#111827;--muted:rgba(17,24,39,.72);--line:rgba(17,24,39,.10);--card:rgba(255,255,255,.82);--glass:rgba(255,255,255,.86);--shadow:0 20px 60px rgba(0,0,0,.14)}
*{box-sizing:border-box}body{margin:0;background:#d8d8d8;color:var(--text);font-family:'Inter',sans-serif}a{color:inherit}img{max-width:100%;height:auto}
.toolbar{max-width:1400px;margin:24px auto 0;padding:0 24px;display:flex;justify-content:flex-end}.mode-toggle{appearance:none;border:0;cursor:pointer;font-weight:700;font-size:14px;padding:12px 16px;border-radius:10px;background:var(--yellow);color:#111}
.site-shell{max-width:1400px;margin:18px auto 36px;overflow:hidden;position:relative;background:var(--bg);box-shadow:var(--shadow)}
.site-shell:before{content:"";position:absolute;inset:0;background-image:radial-gradient(rgba(255,255,255,.05) .7px, transparent .7px);background-size:4px 4px;opacity:.18;pointer-events:none}
body.light .site-shell:before{background-image:radial-gradient(rgba(17,24,39,.05) .7px, transparent .7px);opacity:.12}
.site-header{position:relative;z-index:5;border-bottom:1px solid var(--line);background:rgba(7,11,18,.68);backdrop-filter:blur(12px)}body.light .site-header{background:rgba(255,255,255,.78)}
.header-inner{padding:22px 56px;display:flex;justify-content:space-between;align-items:center;gap:24px}.brand-logo,.footer-logo{display:block}.brand-logo{height:54px}
.main-nav{display:flex;gap:28px;align-items:center}.menu{list-style:none;display:flex;gap:28px;margin:0;padding:0}.menu a{text-decoration:none;font-size:16px}
.header-cta,.btn-primary{display:inline-flex;text-decoration:none;align-items:center;justify-content:center;background:var(--yellow);color:#111;font-weight:800;border-radius:8px;padding:14px 20px;font-size:15px}
.hero{display:grid;grid-template-columns:.92fr 1.08fr;min-height:400px;border-bottom:1px solid var(--line);position:relative}
.hero-copy{padding:64px 56px 60px;display:flex;align-items:center;position:relative;z-index:2}.hero-copy h1{margin:0;font-size:70px;line-height:.97;letter-spacing:-.045em;font-weight:900}.hero-copy p{margin:26px 0 0;max-width:560px;color:var(--muted);font-size:20px;line-height:1.65}.hero-actions{margin-top:32px;display:flex;gap:14px;flex-wrap:wrap}
.btn-ghost{display:inline-flex;text-decoration:none;align-items:center;justify-content:center;border:1px solid var(--line);color:var(--text);background:var(--glass);backdrop-filter:blur(8px);border-radius:8px;padding:14px 20px;font-size:15px;font-weight:700}
.kicker{display:inline-flex;gap:10px;align-items:center;margin-bottom:18px;font-size:12px;letter-spacing:.24em;text-transform:uppercase;color:var(--muted)}.kicker:before{content:"";width:42px;height:1px;background:linear-gradient(90deg,var(--yellow),transparent);box-shadow:0 0 10px rgba(255,209,40,.5)}
.neon-yellow{color:var(--yellow);text-shadow:0 0 6px rgba(255,209,40,.85),0 0 20px rgba(255,209,40,.25)}.neon-blue{color:var(--blue);text-shadow:0 0 6px rgba(39,183,255,.75),0 0 18px rgba(39,183,255,.20)}
.hero-visual{position:relative;overflow:hidden;min-height:400px;background:radial-gradient(circle at 56% 38%, rgba(255,194,48,.20), transparent 14%),radial-gradient(circle at 58% 44%, rgba(255,122,0,.16), transparent 24%),radial-gradient(circle at 82% 60%, rgba(39,183,255,.16), transparent 18%),linear-gradient(180deg, rgba(7,11,18,1) 0%, rgba(7,11,18,1) 100%)}
body.light .hero-visual{background:radial-gradient(circle at 56% 38%, rgba(255,194,48,.20), transparent 14%),radial-gradient(circle at 58% 44%, rgba(255,122,0,.14), transparent 24%),radial-gradient(circle at 82% 60%, rgba(39,183,255,.14), transparent 18%),linear-gradient(180deg,#fafafa 0%,#edf2f7 100%)}
.glow{position:absolute;left:36%;top:27%;width:34%;height:34%;background:radial-gradient(circle at 50% 50%, rgba(255,208,70,.42), rgba(255,138,0,.16) 26%, transparent 68%);filter:blur(24px);animation:pulseGlow 5s ease-in-out infinite}
.mist{position:absolute;inset:0;background:radial-gradient(circle at 42% 34%, rgba(255,180,60,.16), transparent 16%),radial-gradient(circle at 48% 48%, rgba(255,150,40,.12), transparent 20%),radial-gradient(circle at 35% 52%, rgba(255,220,170,.08), transparent 18%),radial-gradient(circle at 70% 32%, rgba(255,100,0,.06), transparent 18%);filter:blur(12px);opacity:.92;animation:mistMove 9s ease-in-out infinite}
.beam{position:absolute;height:3px;border-radius:999px;transform:rotate(-47deg);transform-origin:center}.beam-yellow1{left:26%;top:50%;width:44%;background:#ffd128;box-shadow:0 0 26px rgba(255,209,40,.95);animation:beamDrift1 4.4s ease-in-out infinite}.beam-white{left:42%;top:42%;width:32%;background:white;box-shadow:0 0 22px rgba(255,255,255,.92);animation:beamDrift2 5.1s ease-in-out infinite}.beam-yellow2{left:39%;top:64%;width:26%;background:#ffd128;box-shadow:0 0 24px rgba(255,209,40,.9);animation:beamDrift3 4.8s ease-in-out infinite}.beam-blue{left:61%;top:78%;width:27%;background:#17a7f0;box-shadow:0 0 24px rgba(23,167,240,.9);animation:beamDrift4 5.4s ease-in-out infinite}
.cluster{position:absolute;inset:0;animation:clusterFloat 8s ease-in-out infinite}.shape{position:absolute;transform:skewX(-36deg);border-radius:1px}.s1{right:8%;top:7%;width:15%;height:10%;background:var(--yellow);animation:floatA 6.4s ease-in-out infinite}.s2{right:1%;top:16%;width:12%;height:15%;background:var(--red);animation:floatB 7s ease-in-out infinite}.s3{right:14%;top:28%;width:17%;height:17%;background:var(--orange);animation:floatA 7.2s ease-in-out infinite}.s4{right:2%;top:29%;width:15%;height:16%;background:#db193d;animation:floatB 6.8s ease-in-out infinite}.s5{right:18%;top:54%;width:18%;height:15%;background:#32b2f0;animation:floatA 8.2s ease-in-out infinite}.s6{right:6%;top:54%;width:15%;height:15%;background:#28a6e8;animation:floatB 7.6s ease-in-out infinite}
.scanline{position:absolute;inset:0;pointer-events:none}.scanline:after{content:"";position:absolute;top:-8%;left:-28%;width:24%;height:116%;background:linear-gradient(90deg, transparent, rgba(255,255,255,.10), transparent);transform:skewX(-32deg);filter:blur(6px);animation:shinePass 6.5s linear infinite}
.section{padding:42px 56px 56px;position:relative;z-index:1}.editable-content > * + *{margin-top:24px}.trust{max-width:900px;margin:0 auto 28px;display:flex;align-items:center;gap:14px}.trust .line{flex:1;height:1px;background:linear-gradient(90deg, transparent, rgba(255,209,40,.7), transparent);box-shadow:0 0 10px rgba(255,209,40,.35)}.trust p{margin:0;color:var(--muted);text-align:center;font-size:16px}
.grid4{display:grid;gap:18px;grid-template-columns:repeat(4,1fr)}.grid2{display:grid;gap:20px;grid-template-columns:repeat(2,1fr)}.split{display:grid;gap:20px;grid-template-columns:.95fr 1.05fr}
.card{border:1px solid var(--line);border-radius:24px;background:var(--card);padding:28px;box-shadow:inset 0 0 0 1px rgba(255,255,255,.02);backdrop-filter:blur(10px)}.section-card,.cta-card{margin-top:24px}.cta-card{text-align:center}
.iconbox{width:70px;height:70px;border-radius:18px;display:flex;align-items:center;justify-content:center;border:1px solid var(--line);background:var(--glass);margin-bottom:18px;backdrop-filter:blur(8px)}
.icon-text{font-weight:800;font-size:22px}.yellow .icon-text{color:var(--yellow)}.blue .icon-text{color:var(--blue)}.orange .icon-text{color:var(--orange)}.red .icon-text{color:var(--red)}
.card h3{margin:0 0 12px;font-size:28px;line-height:1.05;letter-spacing:-.03em}.card p,.card li,.editable-content p,.editable-content li{color:var(--muted);font-size:15px;line-height:1.78}.card ul,.editor-list{margin:14px 0 0;padding-left:18px}.note{margin-top:14px;color:var(--yellow);font-weight:700;font-size:14px;text-shadow:0 0 8px rgba(255,209,40,.18)}
.category-feature{display:grid;grid-template-columns:1.05fr .95fr;gap:24px;align-items:stretch;margin-top:26px}.category-feature.reverse{grid-template-columns:.95fr 1.05fr}
.media{min-height:320px;border-radius:24px;border:1px solid var(--line);overflow:hidden;position:relative;background:linear-gradient(180deg, rgba(10,15,23,.92), rgba(6,10,16,.98))}body.light .media{background:linear-gradient(180deg,#f4f7fa,#eef2f7)}
.media-title{position:absolute;left:22px;bottom:18px;z-index:3;font-size:14px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
.media.audio{background:radial-gradient(circle at 22% 36%, rgba(255,209,40,.12), transparent 14%),radial-gradient(circle at 76% 28%, rgba(39,183,255,.12), transparent 16%),linear-gradient(180deg, rgba(10,15,23,.94), rgba(6,10,16,.98))}body.light .media.audio{background:radial-gradient(circle at 22% 36%, rgba(255,209,40,.16), transparent 14%),radial-gradient(circle at 76% 28%, rgba(39,183,255,.12), transparent 16%),linear-gradient(180deg,#f7f9fb,#eef2f7)}
.fader-row{position:absolute;left:8%;right:8%;top:18%;bottom:14%;display:grid;grid-template-columns:repeat(8,1fr);gap:14px}.fader{position:relative;border-radius:12px;border:1px solid rgba(255,255,255,.06);background:rgba(255,255,255,.03)}body.light .fader{border-color:rgba(17,24,39,.08);background:rgba(255,255,255,.75)}.fader:before{content:"";position:absolute;left:50%;top:14%;bottom:18%;width:3px;transform:translateX(-50%);background:linear-gradient(180deg, rgba(255,255,255,.10), rgba(255,255,255,.35), rgba(255,255,255,.10))}.fader:after{content:"";position:absolute;left:50%;width:20px;height:12px;transform:translateX(-50%);border-radius:8px;background:var(--yellow);box-shadow:0 0 12px rgba(255,209,40,.32)}
.fader:nth-child(1):after{top:56%}.fader:nth-child(2):after{top:42%}.fader:nth-child(3):after{top:64%}.fader:nth-child(4):after{top:35%}.fader:nth-child(5):after{top:49%}.fader:nth-child(6):after{top:28%}.fader:nth-child(7):after{top:58%}.fader:nth-child(8):after{top:38%}
.meter-stack{position:absolute;right:4%;top:16%;width:10%;height:68%;display:grid;gap:10px}.meter{border-radius:10px;background:linear-gradient(180deg, rgba(39,183,255,.18), rgba(255,209,40,.12));border:1px solid rgba(255,255,255,.06);position:relative;overflow:hidden}.meter:after{content:"";position:absolute;left:18%;right:18%;bottom:0;height:48%;background:linear-gradient(180deg, rgba(39,183,255,.55), rgba(255,209,40,.75))}
.media.lightfx{background:radial-gradient(circle at 58% 38%, rgba(255,194,48,.20), transparent 14%),radial-gradient(circle at 70% 46%, rgba(39,183,255,.18), transparent 18%),linear-gradient(180deg, rgba(9,13,20,.95), rgba(6,9,15,.98))}
.beam-stage{position:absolute;inset:0}.beam-stage .l1,.beam-stage .l2,.beam-stage .l3{position:absolute;height:4px;border-radius:999px;transform:rotate(-40deg)}.beam-stage .l1{left:18%;top:34%;width:52%;background:var(--yellow);box-shadow:0 0 18px rgba(255,209,40,.8)}.beam-stage .l2{left:35%;top:46%;width:44%;background:white;box-shadow:0 0 16px rgba(255,255,255,.85)}.beam-stage .l3{left:48%;top:62%;width:34%;background:var(--blue);box-shadow:0 0 18px rgba(39,183,255,.82)}.beam-stage .shape1,.beam-stage .shape2,.beam-stage .shape3{position:absolute;transform:skewX(-34deg)}.beam-stage .shape1{right:10%;top:18%;width:18%;height:16%;background:var(--yellow)}.beam-stage .shape2{right:5%;top:42%;width:22%;height:18%;background:var(--orange)}.beam-stage .shape3{right:14%;top:64%;width:24%;height:14%;background:var(--blue)}
.media.eventrig{background:radial-gradient(circle at 20% 18%, rgba(255,209,40,.08), transparent 18%),radial-gradient(circle at 80% 22%, rgba(39,183,255,.08), transparent 18%),linear-gradient(180deg, rgba(11,16,24,.96), rgba(6,10,16,.99))}
.truss-scene{position:absolute;inset:0}.truss-top,.truss-mid,.truss-leg{position:absolute;background:linear-gradient(180deg, rgba(255,255,255,.18), rgba(255,255,255,.08))}.truss-top{left:10%;right:10%;top:14%;height:10px;border-radius:8px}.truss-mid{left:16%;right:16%;top:38%;height:8px;border-radius:8px}.truss-leg.l{left:18%;top:14%;bottom:18%;width:8px}.truss-leg.r{right:18%;top:14%;bottom:18%;width:8px}
.diag{position:absolute;height:4px;background:rgba(255,255,255,.16);border-radius:999px}.d1{left:20%;top:18%;width:22%;transform:rotate(38deg)}.d2{left:34%;top:18%;width:22%;transform:rotate(-38deg)}.d3{right:34%;top:18%;width:22%;transform:rotate(38deg)}.d4{right:20%;top:18%;width:22%;transform:rotate(-38deg)}.d5{left:24%;top:42%;width:18%;transform:rotate(34deg)}.d6{left:38%;top:42%;width:18%;transform:rotate(-34deg)}.d7{right:38%;top:42%;width:18%;transform:rotate(34deg)}.d8{right:24%;top:42%;width:18%;transform:rotate(-34deg)}
.hook{position:absolute;top:18%;width:3px;height:34%;background:rgba(255,255,255,.16)}.h1{left:34%}.h2{left:50%}.h3{left:66%}.fixture{position:absolute;top:46%;width:42px;height:24px;border-radius:8px;background:linear-gradient(180deg, rgba(255,255,255,.14), rgba(255,255,255,.06));border:1px solid rgba(255,255,255,.08)}.f1{left:calc(34% - 20px)}.f2{left:calc(50% - 20px)}.f3{left:calc(66% - 20px)}.rig-beam{position:absolute;width:120px;height:120px;border-radius:50%;filter:blur(26px);opacity:.58}.b1{left:20%;bottom:14%;background:radial-gradient(circle, rgba(255,209,40,.58), transparent 68%)}.b2{left:43%;bottom:10%;background:radial-gradient(circle, rgba(39,183,255,.56), transparent 68%)}.b3{right:18%;bottom:16%;background:radial-gradient(circle, rgba(255,122,0,.54), transparent 68%)}
.media.install{background:radial-gradient(circle at 18% 24%, rgba(255,209,40,.10), transparent 16%),radial-gradient(circle at 82% 20%, rgba(39,183,255,.10), transparent 16%),linear-gradient(180deg, rgba(10,15,23,.95), rgba(6,10,16,.99))}.case-stack{position:absolute;left:10%;right:10%;bottom:16%;display:grid;grid-template-columns:1fr 1fr;gap:20px}.case{position:relative;height:78px;border-radius:14px;border:1px solid rgba(255,255,255,.10);background:linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.03))}.case:before{content:"";position:absolute;left:14%;right:14%;top:50%;height:2px;transform:translateY(-50%);background:rgba(255,255,255,.16)}.case:after{content:"";position:absolute;left:50%;top:16px;width:34px;height:12px;transform:translateX(-50%);border-radius:8px;border:2px solid rgba(255,255,255,.16)}.crate-top{position:absolute;left:24%;right:24%;top:16%;height:92px;border-radius:16px;border:1px solid rgba(255,255,255,.10);background:linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.03))}
.site-footer{border-top:1px solid var(--line);padding:24px 56px 34px}.glowline{height:2px;margin-bottom:26px;background:linear-gradient(90deg, transparent, rgba(255,209,40,.95), rgba(39,183,255,.55), transparent);box-shadow:0 0 16px rgba(255,209,40,.6)}.footer-inner{display:flex;justify-content:space-between;align-items:center;gap:24px;color:var(--muted);font-size:15px}.footer-logo{height:42px}.footer-links{display:flex;gap:14px;flex-wrap:wrap}.footer-links a{text-decoration:none}
.form-grid{display:grid;gap:16px;grid-template-columns:1fr 1fr;margin-top:18px}.field label{display:block;margin-bottom:8px;font-size:14px;font-weight:700}.field-full{grid-column:1 / -1}.input,.textarea{border-radius:14px;border:1px solid var(--line);background:var(--glass);backdrop-filter:blur(8px)}.input{height:48px}.textarea{height:140px}
@keyframes pulseGlow{0%,100%{transform:scale(1);opacity:.72}50%{transform:scale(1.06);opacity:1}}@keyframes mistMove{0%,100%{transform:translate3d(0,0,0)}50%{transform:translate3d(12px,-8px,0)}}@keyframes clusterFloat{0%,100%{transform:translate3d(0,0,0)}50%{transform:translate3d(-6px,4px,0)}}@keyframes floatA{0%,100%{transform:skewX(-36deg) translate3d(0,0,0)}50%{transform:skewX(-36deg) translate3d(-5px,4px,0)}}@keyframes floatB{0%,100%{transform:skewX(-36deg) translate3d(0,0,0)}50%{transform:skewX(-36deg) translate3d(5px,-4px,0)}}@keyframes beamDrift1{0%,100%{transform:rotate(-47deg) translate3d(0,0,0);opacity:.95}50%{transform:rotate(-47deg) translate3d(8px,-4px,0);opacity:1}}@keyframes beamDrift2{0%,100%{transform:rotate(-47deg) translate3d(0,0,0);opacity:.85}50%{transform:rotate(-47deg) translate3d(6px,-3px,0);opacity:1}}@keyframes beamDrift3{0%,100%{transform:rotate(-47deg) translate3d(0,0,0);opacity:.95}50%{transform:rotate(-47deg) translate3d(7px,-4px,0);opacity:1}}@keyframes beamDrift4{0%,100%{transform:rotate(-47deg) translate3d(0,0,0);opacity:.9}50%{transform:rotate(-47deg) translate3d(6px,-5px,0);opacity:1}}@keyframes shinePass{0%{transform:translateX(-110%) skewX(-32deg)}100%{transform:translateX(520%) skewX(-32deg)}}
@media (max-width:1100px){.hero,.grid4,.grid2,.split,.category-feature,.category-feature.reverse{grid-template-columns:1fr}}
@media (max-width:860px){.header-inner,.hero-copy,.section,.site-footer{padding-left:24px;padding-right:24px}.menu{display:none}.hero-copy h1{font-size:44px}.hero-copy p{font-size:17px}.footer-inner{flex-direction:column;align-items:flex-start}.form-grid{grid-template-columns:1fr}}



/* Alignment fix for category visuals */
.category-feature{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:40px;
  align-items:center;
  position:relative;
}
.category-feature.reverse{
  grid-template-columns:1fr 1fr;
}
.category-feature .card{
  position:relative;
  z-index:2;
}
.category-feature .media{
  position:relative;
  z-index:1;
  overflow:hidden;
  border-radius:24px;
  align-self:stretch;
}
.category-feature *{
  max-width:100%;
}

/* Precise fix for Licht- und Videotechnik visual */
.media.lightfx{
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:320px;
}
.media.lightfx .beam-stage{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  transform:none;
}
.media.lightfx .l1{left:14%; top:28%; width:46%;}
.media.lightfx .l2{left:30%; top:42%; width:40%;}
.media.lightfx .l3{left:44%; top:58%; width:30%;}
.media.lightfx .shape1{right:8%; top:14%; width:18%; height:14%;}
.media.lightfx .shape2{right:4%; top:38%; width:22%; height:18%;}
.media.lightfx .shape3{right:12%; top:62%; width:24%; height:14%;}

/* Ensure editor wrappers do not distort premium blocks */
.editable-content > .category-feature,
.editable-content > .grid4,
.editable-content > .grid2,
.editable-content > .split,
.editable-content > .trust{
  margin-top:0;
  margin-bottom:24px;
}

@media (max-width:1100px){
  .category-feature,
  .category-feature.reverse{
    grid-template-columns:1fr;
  }
  .media.lightfx .beam-stage{
    width:100%;
    height:100%;
    inset:0;
  }
}



/* Explicit card/icon accent classes */
.card.yellow .icon-text, .card.yellow .iconbox svg { color: var(--yellow); stroke: var(--yellow); }
.card.blue .icon-text, .card.blue .iconbox svg { color: var(--blue); stroke: var(--blue); }
.card.orange .icon-text, .card.orange .iconbox svg { color: var(--orange); stroke: var(--orange); }
.card.red .icon-text, .card.red .iconbox svg { color: var(--red); stroke: var(--red); }

/* Safety reset so service cards are never affected by absolute-position utility classes */
.grid4 .card,
.grid2 .card,
.split .card,
.category-feature .card {
  position: relative;
  left: auto !important;
  top: auto !important;
  right: auto !important;
  bottom: auto !important;
  width: auto !important;
  height: auto;
  transform: none;
}



/* Final card text color fix */
.card h3,
.grid4 .card h3,
.grid2 .card h3,
.split .card h3,
.category-feature .card h3,
.editable-content .card h3 {
  color: #f5f7fb !important;
}

.card p,
.card li,
.grid4 .card p,
.grid4 .card li,
.grid2 .card p,
.grid2 .card li,
.split .card p,
.split .card li,
.category-feature .card p,
.category-feature .card li,
.editable-content .card p,
.editable-content .card li {
  color: rgba(255,255,255,.78) !important;
}

body.light .card h3,
body.light .grid4 .card h3,
body.light .grid2 .card h3,
body.light .split .card h3,
body.light .category-feature .card h3,
body.light .editable-content .card h3 {
  color: #111827 !important;
}

body.light .card p,
body.light .card li,
body.light .grid4 .card p,
body.light .grid4 .card li,
body.light .grid2 .card p,
body.light .grid2 .card li,
body.light .split .card p,
body.light .split .card li,
body.light .category-feature .card p,
body.light .category-feature .card li,
body.light .editable-content .card p,
body.light .editable-content .card li {
  color: rgba(17,24,39,.78) !important;
}

/* Accent letters */
.card.yellow .icon-text { color: #ffd128 !important; }
.card.blue .icon-text { color: #27b7ff !important; }
.card.orange .icon-text { color: #ff7a00 !important; }
.card.red .icon-text { color: #ff2d73 !important; }

/* Keep normal cards visually stable */
.grid4 .card,
.grid2 .card,
.split .card,
.category-feature .card {
  opacity: 1 !important;
  filter: none !important;
}




/* Mobile navigation */
.mobile-nav-toggle{
  display:none;
  width:52px;
  height:52px;
  border:1px solid var(--line);
  background:var(--glass);
  border-radius:12px;
  align-items:center;
  justify-content:center;
  gap:5px;
  flex-direction:column;
  cursor:pointer;
}
.mobile-nav-toggle span{
  display:block;
  width:20px;
  height:2px;
  background:var(--text);
  border-radius:999px;
  transition:transform .25s ease, opacity .25s ease;
}
.mobile-nav-toggle.is-open span:nth-child(1){ transform:translateY(7px) rotate(45deg); }
.mobile-nav-toggle.is-open span:nth-child(2){ opacity:0; }
.mobile-nav-toggle.is-open span:nth-child(3){ transform:translateY(-7px) rotate(-45deg); }

@media (max-width:860px){
  .mobile-nav-toggle{ display:flex; }
  .main-nav{
    position:absolute;
    top:100%;
    left:16px;
    right:16px;
    display:none;
    flex-direction:column;
    align-items:stretch;
    gap:16px;
    padding:18px;
    background:rgba(7,11,18,.96);
    border:1px solid var(--line);
    border-radius:18px;
    box-shadow:0 20px 40px rgba(0,0,0,.28);
    z-index:30;
  }
  body.light .main-nav{ background:rgba(255,255,255,.98); }
  .main-nav.is-open{ display:flex; }
  .main-nav .menu{
    display:flex;
    flex-direction:column;
    gap:14px;
    margin:0;
    padding:0;
  }
  .main-nav .menu li{ list-style:none; }
  .main-nav .header-cta{ width:100%; }
  .header-inner{ position:relative; }
}

