*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden}body{font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background-position:center;background-size:cover;color:var(--text);-webkit-font-smoothing:antialiased}.stage{position:relative;height:100%;display:grid;place-items:center;isolation:isolate;transition:filter .5s ease,transform .5s ease}.stage:before{content:"";position:absolute;inset:0;z-index:-2;background:radial-gradient(circle at 50% 48%,rgba(255,255,255,.07),transparent 30%)}.stage:after{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(ellipse at center,transparent 28%,rgba(0,0,0,.32) 100%)}.stage.blur{filter:blur(7px) brightness(.48);transform:scale(1.025)}.hero-logo{width:min(var(--desk),80vw);max-height:70vh;object-fit:contain;filter:drop-shadow(0 18px 45px rgba(0,0,0,.52));animation:logoIn .9s cubic-bezier(.16,1,.3,1) both}@keyframes logoIn{from{opacity:0;transform:scale(.95);filter:blur(7px)}to{opacity:1;transform:scale(1)}}
.radial{position:fixed;left:0;top:50%;transform:translateY(-50%);z-index:100;width:1px;height:1px}.plus{position:absolute;left:0;top:0;transform:translateY(-50%);z-index:110;width:74px;height:108px;border:1px solid color-mix(in srgb,var(--accent) 70%,transparent);border-left:0;border-radius:0 56px 56px 0;background:linear-gradient(110deg,rgba(13,35,50,.97),rgba(5,17,27,.98));color:var(--accent);font-size:34px;font-weight:300;cursor:pointer;box-shadow:10px 0 35px color-mix(in srgb,var(--accent) 22%,transparent),inset -1px 0 0 rgba(255,255,255,.08);transition:.45s cubic-bezier(.16,1,.3,1);-webkit-appearance:none;appearance:none}.plus:before{content:"";position:absolute;inset:-2px -2px -2px 0;border-radius:0 58px 58px 0;border-right:2px solid color-mix(in srgb,var(--accent) 80%,transparent);pointer-events:none}.plus:hover{width:82px;box-shadow:14px 0 44px color-mix(in srgb,var(--accent) 32%,transparent)}.radial.open .plus{transform:translateY(-50%) rotate(0);width:76px}.radial.open .plus{font-size:0}.radial.open .plus:after{content:"×";font-size:34px;color:var(--accent)}
.items{position:absolute;left:62px;top:0;width:330px;height:570px;transform:translateY(-50%);pointer-events:none}.menu-item{position:absolute;left:0;top:50%;display:flex;align-items:center;gap:10px;color:var(--accent);text-decoration:none;opacity:0;transform:translate(-70px,-50%) scale(.55);filter:blur(5px);transition:opacity .32s ease var(--delay),transform .58s cubic-bezier(.16,1,.3,1) var(--delay),filter .3s ease var(--delay)}.radial.open .menu-item{opacity:1;filter:none;pointer-events:auto}.menu-icon{order:2;width:48px;height:48px;display:grid;place-items:center;flex:0 0 48px;border-radius:50%;background:var(--accent);color:#fff;font-size:20px;box-shadow:0 10px 26px rgba(0,0,0,.35),0 0 18px color-mix(in srgb,var(--accent) 20%,transparent)}.menu-item b{order:1;padding:9px 15px;border:1.5px solid var(--accent);border-radius:999px;background:rgba(9,30,43,.92);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);font-size:14px;font-weight:550;white-space:nowrap;box-shadow:0 8px 25px rgba(0,0,0,.3)}
/* Fan: first item top, last item bottom. JS adds --i/--n */
.radial.open .menu-item{transform:translate(calc(35px + (var(--arc,0) * 1px)),calc(-50% + var(--y,0px))) rotate(var(--tilt,0deg))}.menu-item:hover{z-index:3}.menu-item:hover .menu-icon{transform:scale(1.1)}.menu-item:hover b{background:color-mix(in srgb,var(--accent) 12%,rgba(9,30,43,.96))}.menu-icon,.menu-item b{transition:transform .25s,background .25s}.scrim{position:fixed;inset:0;z-index:80;background:rgba(0,8,15,.16);opacity:0;pointer-events:none;transition:opacity .4s}.scrim.show{opacity:1;pointer-events:auto}
@media(max-width:600px){.hero-logo{width:min(var(--mob),78vw);max-height:62vh}.plus{width:66px;height:96px;border-radius:50px 0 0 50px;font-size:30px}.radial.open .plus{width:68px}.items{left:54px;width:260px;height:500px}.menu-icon{width:44px;height:44px;flex-basis:44px;font-size:18px}.menu-item b{font-size:13px;padding:8px 13px}.radial.open .menu-item{transform:translate(calc(18px + (var(--arc,0) * .72px)),calc(-50% + var(--y,0px))) rotate(var(--tilt,0deg))}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition-duration:.01ms!important}}
.icon-svg{width:24px;height:24px;display:block;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.icon-svg .fill{fill:currentColor;stroke:none}.menu-icon{display:flex!important;align-items:center;justify-content:center}

.menu-icon i{font-size:22px;line-height:1}.admin-icon-preview{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:50%;background:#111827;color:#fff;margin-right:8px}

/* v1.7 reference fan layout: icon first, label second */
.menu-item{gap:9px;transform-origin:left center}
.menu-icon{order:1;background:#ff4056;color:#fff;border:1px solid rgba(255,255,255,.12)}
.menu-item b{order:2;background:rgba(7,31,47,.94);color:var(--accent);border-color:var(--accent)}
/* Keep official brand marks recognizable; brand glyph itself uses its familiar brand color on a light disc. */
.menu-item[data-icon="instagram"] .menu-icon{background:#fff;color:#E4405F}
.menu-item[data-icon="facebook"] .menu-icon{background:#fff;color:#1877F2}
.menu-item[data-icon="x"] .menu-icon{background:#fff;color:#000}
.menu-item[data-icon="youtube"] .menu-icon{background:#fff;color:#FF0000}
.menu-item[data-icon="tiktok"] .menu-icon{background:#fff;color:#000}
.menu-item[data-icon="linkedin"] .menu-icon{background:#fff;color:#0A66C2}
.menu-item[data-icon="whatsapp"] .menu-icon{background:#fff;color:#25D366}
.menu-item[data-icon="telegram"] .menu-icon{background:#fff;color:#229ED9}
.menu-item[data-icon="discord"] .menu-icon{background:#fff;color:#5865F2}
.menu-item[data-icon="spotify"] .menu-icon{background:#fff;color:#1DB954}
.menu-item[data-icon="pinterest"] .menu-icon{background:#fff;color:#E60023}
.menu-item[data-icon="snapchat"] .menu-icon{background:#FFFC00;color:#000}

/* v1.8 compact animated tab + true radial menu */
.plus{width:56px!important;height:82px!important;border-radius:0 44px 44px 0!important;font-size:27px!important;animation:menuBreathe 2.7s ease-in-out infinite;box-shadow:8px 0 24px color-mix(in srgb,var(--accent) 15%,transparent),inset -1px 0 0 rgba(255,255,255,.08)!important}
.plus:before{border-radius:0 46px 46px 0!important}
.plus:hover{width:61px!important;box-shadow:11px 0 34px color-mix(in srgb,var(--accent) 30%,transparent)!important}
.radial.open .plus{width:58px!important;animation:none;box-shadow:10px 0 32px color-mix(in srgb,var(--accent) 25%,transparent)!important}
.radial.open .plus:after{font-size:28px!important}
@keyframes menuBreathe{0%,100%{filter:brightness(1);box-shadow:8px 0 24px color-mix(in srgb,var(--accent) 13%,transparent),inset -1px 0 0 rgba(255,255,255,.08)}50%{filter:brightness(1.13);box-shadow:11px 0 34px color-mix(in srgb,var(--accent) 28%,transparent),inset -1px 0 0 rgba(255,255,255,.12)}}
.items{left:28px!important;top:0!important;width:1px!important;height:1px!important;transform:none!important;overflow:visible!important}
.menu-item{left:0!important;top:0!important;transform:translate(-34px,-50%) scale(.45)!important;filter:blur(4px);gap:9px!important;transform-origin:left center!important}
.radial.open .menu-item{transform:translate(var(--x),calc(-50% + var(--y))) scale(1)!important;filter:none!important}
.menu-icon{order:1!important}.menu-item b{order:2!important}
@media(max-width:600px){.plus{width:49px!important;height:72px!important;border-radius:0 38px 38px 0!important;font-size:24px!important}.radial.open .plus{width:51px!important}.radial.open .plus:after{font-size:25px!important}.items{left:23px!important}.menu-icon{width:41px!important;height:41px!important;flex-basis:41px!important}.menu-item b{font-size:12px!important;padding:7px 11px!important}}
@media(prefers-reduced-motion:reduce){.plus{animation:none!important}.menu-item{transition-duration:.01ms!important}}

/* v1.9 toggle repair + attention animation */
.plus{overflow:visible;animation:menuAttention 2.4s ease-in-out infinite!important;will-change:filter,box-shadow}
.plus::before{animation:ringAttention 2.4s ease-in-out infinite}
.radial.open .plus{font-size:0!important;animation:none!important}
.radial.open .plus::before{animation:none}
.radial.open .plus::after{content:"×"!important;position:absolute;inset:0;display:grid;place-items:center;font-size:27px!important;line-height:1;color:var(--accent)}
@keyframes menuAttention{0%,100%{filter:brightness(1);box-shadow:7px 0 20px color-mix(in srgb,var(--accent) 14%,transparent),inset -1px 0 0 rgba(255,255,255,.08)}45%{filter:brightness(1.18);box-shadow:12px 0 38px color-mix(in srgb,var(--accent) 36%,transparent),inset -1px 0 0 rgba(255,255,255,.14)}55%{filter:brightness(1.12);box-shadow:10px 0 31px color-mix(in srgb,var(--accent) 27%,transparent),inset -1px 0 0 rgba(255,255,255,.12)}}
@keyframes ringAttention{0%,100%{opacity:.55;transform:scale(1)}50%{opacity:1;transform:scale(1.035)}}
@media(max-width:600px){.radial.open .plus::after{font-size:24px!important}}


/* v1.10 energetic premium menu */
.plus{background:linear-gradient(120deg,color-mix(in srgb,var(--menu-button) 92%,#fff 8%),var(--menu-button))!important;color:var(--accent)!important;animation:menuAlive 1.65s cubic-bezier(.45,0,.2,1) infinite!important;transform-origin:left center;isolation:isolate}
.plus::before{border-right-color:color-mix(in srgb,var(--accent) 82%,transparent)!important;animation:ringAlive 1.65s ease-in-out infinite!important}
.plus::after{z-index:2}
.plus{box-shadow:10px 0 30px color-mix(in srgb,var(--accent) 24%,transparent),inset -1px 0 rgba(255,255,255,.16)!important}
.radial:not(.open) .plus:hover{transform:translateY(-50%) scale(1.08)!important}
.radial.open .plus{animation:openKick .55s cubic-bezier(.16,1,.3,1) both!important;background:linear-gradient(120deg,color-mix(in srgb,var(--menu-button) 82%,#fff 18%),var(--menu-button))!important}
.radial.open .plus::before{animation:none!important}
.menu-icon{background:var(--menu-icon)!important;box-shadow:0 10px 28px rgba(0,0,0,.35),0 0 0 0 color-mix(in srgb,var(--menu-icon) 45%,transparent)!important}
.menu-item b{background:color-mix(in srgb,var(--menu-label) 94%,transparent)!important}
.menu-item{transition:opacity .22s ease var(--delay),transform .72s cubic-bezier(.18,1.45,.28,1) var(--delay),filter .28s ease var(--delay)!important}
.radial.open .menu-item{animation:itemSpark .68s cubic-bezier(.16,1,.3,1) both;animation-delay:var(--delay)}
.radial.closing .menu-item{transition:opacity .2s ease,transform .42s cubic-bezier(.6,-.35,.75,.15),filter .22s ease!important}
.radial.closing .menu-item:nth-child(even){transform:translate(8px,-50%) scale(.35) rotate(-12deg)!important}
.radial.closing .menu-item:nth-child(odd){transform:translate(8px,-50%) scale(.35) rotate(12deg)!important}
@keyframes menuAlive{0%,100%{filter:brightness(1);transform:translateY(-50%) scale(1);box-shadow:8px 0 22px color-mix(in srgb,var(--accent) 18%,transparent),inset -1px 0 rgba(255,255,255,.12)}35%{filter:brightness(1.18);transform:translateY(-50%) scale(1.045);box-shadow:15px 0 42px color-mix(in srgb,var(--accent) 42%,transparent),inset -1px 0 rgba(255,255,255,.2)}52%{transform:translateY(-50%) scale(1.02)}68%{filter:brightness(1.08);transform:translateY(-50%) scale(1.055)}}
@keyframes ringAlive{0%,100%{opacity:.45;transform:scale(1)}40%{opacity:1;transform:scale(1.06)}70%{opacity:.65;transform:scale(1.025)}}
@keyframes openKick{0%{transform:translateY(-50%) scale(1)}45%{transform:translateY(-50%) scale(1.12)}100%{transform:translateY(-50%) scale(1)}}
@keyframes itemSpark{0%{opacity:0;filter:blur(7px) brightness(1.5)}55%{filter:blur(0) brightness(1.22)}100%{opacity:1;filter:none}}
@media(prefers-reduced-motion:reduce){.plus,.plus::before,.radial.open .menu-item{animation:none!important}}


/* v1.11 icon reliability + soft circular transition */
.menu-icon .icon-svg{display:block;width:23px;height:23px}
.menu-icon .brand-fa{display:none}
.menu-item[data-icon="instagram"] .icon-svg,.menu-item[data-icon="facebook"] .icon-svg,.menu-item[data-icon="x"] .icon-svg,.menu-item[data-icon="youtube"] .icon-svg,.menu-item[data-icon="tiktok"] .icon-svg,.menu-item[data-icon="linkedin"] .icon-svg,.menu-item[data-icon="whatsapp"] .icon-svg,.menu-item[data-icon="telegram"] .icon-svg,.menu-item[data-icon="discord"] .icon-svg,.menu-item[data-icon="spotify"] .icon-svg,.menu-item[data-icon="pinterest"] .icon-svg,.menu-item[data-icon="snapchat"] .icon-svg{display:none}
.menu-item[data-icon="instagram"] .brand-fa,.menu-item[data-icon="facebook"] .brand-fa,.menu-item[data-icon="x"] .brand-fa,.menu-item[data-icon="youtube"] .brand-fa,.menu-item[data-icon="tiktok"] .brand-fa,.menu-item[data-icon="linkedin"] .brand-fa,.menu-item[data-icon="whatsapp"] .brand-fa,.menu-item[data-icon="telegram"] .brand-fa,.menu-item[data-icon="discord"] .brand-fa,.menu-item[data-icon="spotify"] .brand-fa,.menu-item[data-icon="pinterest"] .brand-fa,.menu-item[data-icon="snapchat"] .brand-fa{display:inline-block}
.radial-wave{position:fixed;left:-220px;top:50%;width:440px;height:440px;border-radius:50%;z-index:89;pointer-events:none;transform:translateY(-50%) scale(.12);opacity:0;background:radial-gradient(circle,transparent 0 34%,color-mix(in srgb,var(--accent) 8%,transparent) 46%,color-mix(in srgb,var(--accent) 16%,transparent) 58%,transparent 72%);border:1px solid color-mix(in srgb,var(--accent) 13%,transparent);filter:blur(.2px);transition:transform .78s cubic-bezier(.16,1,.3,1),opacity .42s ease}
.radial-wave.show{transform:translateY(-50%) scale(1);opacity:1;animation:waveBreath 3.2s ease-in-out infinite .8s}
.radial-wave.closing{transform:translateY(-50%) scale(.18);opacity:0;transition:transform .58s cubic-bezier(.55,0,.75,.15),opacity .38s ease}
.menu-item{transition:opacity .34s ease var(--delay),transform .82s cubic-bezier(.16,1,.3,1) var(--delay),filter .42s ease var(--delay)!important}
.radial.open .menu-item{animation:itemSoft .82s cubic-bezier(.16,1,.3,1) both;animation-delay:var(--delay)}
.radial.closing .menu-item{transition:opacity .32s ease,transform .58s cubic-bezier(.4,0,.2,1),filter .3s ease!important}
@keyframes itemSoft{0%{opacity:0;filter:blur(5px);transform:translate(10px,-50%) scale(.72)}65%{opacity:1;filter:blur(0)}100%{opacity:1;filter:none}}
@keyframes waveBreath{0%,100%{filter:brightness(1);opacity:.82}50%{filter:brightness(1.16);opacity:1}}
@media(max-width:600px){.radial-wave{left:-180px;width:360px;height:360px}}
@media(prefers-reduced-motion:reduce){.radial-wave{animation:none!important}}
/* v1.12 icon reliability: every icon has a local inline-SVG fallback. */
.menu-icon .icon-svg{display:block!important;width:23px!important;height:23px!important;opacity:1!important;visibility:visible!important;position:relative!important;z-index:2!important}
.menu-icon .brand-fa{display:none!important}
.menu-icon{overflow:visible!important}

/* V1.13 — icon reliability + softer radial motion */
.menu-icon .icon-svg{display:block!important;width:24px!important;height:24px!important;opacity:1!important;visibility:visible!important;overflow:visible!important;color:inherit!important;fill:none;stroke:currentColor;stroke-width:1.9}
.menu-icon .icon-svg .fill{fill:currentColor!important;stroke:none!important}
.menu-icon{overflow:visible!important}
.menu-item{opacity:0!important;filter:blur(8px)!important;transform:translate(-24px,-50%) scale(.72)!important;transition:opacity .48s ease var(--delay),transform 1.05s cubic-bezier(.22,.8,.22,1) var(--delay),filter .58s ease var(--delay)!important;animation:none!important;will-change:transform,opacity,filter}
.radial.open .menu-item{opacity:1!important;filter:blur(0)!important;transform:translate(var(--x),calc(-50% + var(--y))) scale(1)!important;animation:none!important}
.radial.closing .menu-item{opacity:0!important;filter:blur(6px)!important;transform:translate(calc(var(--x) * .28),calc(-50% + (var(--y) * .28))) scale(.72)!important;transition:opacity .34s ease,transform .64s cubic-bezier(.4,0,.2,1),filter .4s ease!important}
.radial-wave{transition:transform 1.05s cubic-bezier(.22,.8,.22,1),opacity .62s ease!important}
.radial-wave.show{transition:transform 1.1s cubic-bezier(.22,.8,.22,1),opacity .62s ease!important}


/* V1.14 — admin-controlled motion + radial angled labels */
.menu-item{transition-duration:calc(.48s * var(--menu-speed-mult)),calc(1.05s * var(--menu-speed-mult)),calc(.58s * var(--menu-speed-mult))!important}
.menu-item b{transform:rotate(var(--label-angle,0deg));transform-origin:left center;transition:transform calc(.72s * var(--menu-speed-mult)) cubic-bezier(.22,.8,.22,1),opacity calc(.45s * var(--menu-speed-mult)) ease;white-space:nowrap}
.radial:not(.open) .menu-item b{opacity:0;transform:rotate(0deg) translateX(-8px)}
.radial.open .menu-item b{opacity:1;transform:rotate(var(--label-angle,0deg)) translateX(0)}
.radial.closing .menu-item b{opacity:0;transform:rotate(0deg) translateX(-6px)}
.radial-wave{transition-duration:calc(1.05s * var(--menu-speed-mult)),calc(.62s * var(--menu-speed-mult))!important}
.radial-wave.show{transition-duration:calc(1.1s * var(--menu-speed-mult)),calc(.62s * var(--menu-speed-mult))!important}
.radial.closing .menu-item{transition-duration:calc(.34s * var(--menu-speed-mult)),calc(.64s * var(--menu-speed-mult)),calc(.4s * var(--menu-speed-mult))!important}
@media(max-width:600px){.menu-item b{transform-origin:left center}.radial.open .menu-item b{transform:rotate(calc(var(--label-angle,0deg) * .72))}}

/* V1.15 — icons follow the same radial arc angle as their labels */
.menu-icon{
  transform-origin:center center;
  transition:transform calc(.72s * var(--menu-speed-mult)) cubic-bezier(.22,.8,.22,1),background .25s!important;
}
.radial:not(.open) .menu-item .menu-icon{
  transform:rotate(0deg) scale(.88);
}
.radial.open .menu-item .menu-icon{
  transform:rotate(var(--label-angle,0deg)) scale(1);
}
.radial.open .menu-item:hover .menu-icon{
  transform:rotate(var(--label-angle,0deg)) scale(1.1);
}
.radial.closing .menu-item .menu-icon{
  transform:rotate(0deg) scale(.88);
}
@media(max-width:600px){
  .radial.open .menu-item .menu-icon{transform:rotate(calc(var(--label-angle,0deg) * .72)) scale(1)}
  .radial.open .menu-item:hover .menu-icon{transform:rotate(calc(var(--label-angle,0deg) * .72)) scale(1.08)}
}

/* V1.16 — unified radial alignment + restored full-page blur */
/* Icon and label now share one radial axis, preventing drift between them. */
.radial.open .menu-item{
  transform:translate(var(--x),calc(-50% + var(--y))) rotate(var(--label-angle,0deg)) scale(1)!important;
}
.radial.closing .menu-item{
  transform:translate(calc(var(--x) * .28),calc(-50% + (var(--y) * .28))) rotate(0deg) scale(.72)!important;
}
.menu-item .menu-icon,
.menu-item b{
  transform:none!important;
}
.radial:not(.open) .menu-item .menu-icon{transform:scale(.88)!important}
.radial.open .menu-item .menu-icon{transform:scale(1)!important}
.radial.open .menu-item:hover .menu-icon{transform:scale(1.08)!important}
.radial.closing .menu-item .menu-icon{transform:scale(.88)!important}
.radial:not(.open) .menu-item b{opacity:0!important;transform:translateX(-8px)!important}
.radial.open .menu-item b{opacity:1!important;transform:translateX(0)!important}
.radial.closing .menu-item b{opacity:0!important;transform:translateX(-6px)!important}

/* Blur the actual page background too (body background sits behind .stage). */
.scrim{
  background:rgba(0,8,15,.12)!important;
  -webkit-backdrop-filter:blur(0px) brightness(1);
  backdrop-filter:blur(0px) brightness(1);
  transition:opacity calc(.55s * var(--menu-speed-mult)) ease,
             backdrop-filter calc(.72s * var(--menu-speed-mult)) ease,
             -webkit-backdrop-filter calc(.72s * var(--menu-speed-mult)) ease!important;
}
.scrim.show{
  opacity:1!important;
  -webkit-backdrop-filter:blur(7px) brightness(.68);
  backdrop-filter:blur(7px) brightness(.68);
}
.stage.blur{
  filter:blur(4px) brightness(.78)!important;
  transform:scale(1.018)!important;
  transition:filter calc(.72s * var(--menu-speed-mult)) ease,transform calc(.72s * var(--menu-speed-mult)) ease!important;
}
@media(max-width:600px){
  .radial.open .menu-item{transform:translate(var(--x),calc(-50% + var(--y))) rotate(calc(var(--label-angle,0deg) * .72)) scale(1)!important}
  .scrim.show{-webkit-backdrop-filter:blur(6px) brightness(.7);backdrop-filter:blur(6px) brightness(.7)}
}

/* V1.19 — Adaptive About + Contact overlay panels */
.modal-shell{position:fixed;inset:0;z-index:160;display:grid;place-items:center;padding:24px;background:color-mix(in srgb,var(--page-bg) 28%,rgba(0,0,0,.22));backdrop-filter:blur(16px) saturate(.82) brightness(.78);-webkit-backdrop-filter:blur(16px) saturate(.82) brightness(.78);opacity:0;visibility:hidden;pointer-events:none;transition:opacity calc(.48s * var(--menu-speed-mult)) ease,visibility 0s linear calc(.48s * var(--menu-speed-mult))}
.modal-shell.show{opacity:1;visibility:visible;pointer-events:auto;transition-delay:0s}
.modal-card{position:relative;width:min(700px,92vw);max-height:min(80vh,740px);overflow:auto;padding:44px 46px;border:1px solid color-mix(in srgb,var(--accent) 24%,rgba(255,255,255,.12));border-radius:30px;background:linear-gradient(145deg,color-mix(in srgb,var(--page-bg) 82%,#fff 18%),color-mix(in srgb,var(--page-bg) 92%,#000 8%));color:var(--text);box-shadow:0 30px 90px rgba(0,0,0,.34),inset 0 1px 0 rgba(255,255,255,.10);transform:translateY(26px) scale(.965);filter:blur(7px);transition:transform calc(.64s * var(--menu-speed-mult)) cubic-bezier(.16,1,.3,1),filter calc(.48s * var(--menu-speed-mult)) ease,opacity calc(.48s * var(--menu-speed-mult)) ease;opacity:.7}
.modal-shell.show .modal-card{transform:translateY(0) scale(1);filter:blur(0);opacity:1}
.modal-kicker{font-size:11px;letter-spacing:.28em;color:color-mix(in srgb,var(--accent) 72%,var(--text) 28%);margin-bottom:12px}.modal-card h2{color:var(--text);font-size:clamp(28px,5vw,46px);font-weight:500;letter-spacing:-.04em;margin:0 48px 22px 0}.about-copy{font-size:16px;line-height:1.82;color:color-mix(in srgb,var(--text) 86%,transparent);text-wrap:pretty}
.modal-close{position:absolute;right:18px;top:18px;width:42px;height:42px;border:1px solid color-mix(in srgb,var(--text) 18%,transparent);border-radius:50%;background:color-mix(in srgb,var(--text) 7%,transparent);color:var(--text);font-size:25px;font-weight:300;cursor:pointer;transition:.25s}.modal-close:hover{transform:rotate(90deg);background:color-mix(in srgb,var(--text) 13%,transparent)}
.contact-form label{display:block;font-size:12px;letter-spacing:.03em;color:color-mix(in srgb,var(--text) 76%,transparent);margin:0 0 16px}.contact-form label span{opacity:.58}.contact-form input,.contact-form textarea{width:100%;margin-top:8px;border:1px solid color-mix(in srgb,var(--text) 17%,transparent);border-radius:14px;background:color-mix(in srgb,var(--text) 6%,transparent);color:var(--text);padding:14px 15px;outline:none;font:inherit;transition:.25s}.contact-form input:focus,.contact-form textarea:focus{border-color:color-mix(in srgb,var(--accent) 65%,transparent);background:color-mix(in srgb,var(--text) 9%,transparent);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 12%,transparent)}.contact-form textarea{min-height:130px;resize:vertical}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.form-submit{border:1px solid color-mix(in srgb,var(--accent) 55%,transparent);border-radius:999px;padding:13px 20px;background:color-mix(in srgb,var(--menu-button) 82%,var(--page-bg) 18%);color:var(--text);font-weight:600;cursor:pointer;transition:.3s}.form-submit:hover{transform:translateY(-2px);box-shadow:0 10px 28px color-mix(in srgb,var(--accent) 18%,transparent)}.form-submit span{margin-left:10px}.form-submit:disabled{opacity:.55;cursor:wait}.form-status{min-height:22px;margin:14px 0 0;font-size:13px}.form-status.ok{color:#72e6a5}.form-status.err{color:#ff8c96}.hp{position:absolute!important;left:-9999px!important;opacity:0!important;pointer-events:none!important}
@media(max-width:600px){.modal-shell{padding:14px}.modal-card{padding:34px 22px 26px;border-radius:22px;max-height:84vh}.form-grid{grid-template-columns:1fr}.modal-card h2{margin-bottom:18px}.about-copy{font-size:15px;line-height:1.72}}

/* V1.20 — guaranteed readable About / Contact surfaces */
.modal-shell{
  background:rgba(2,8,14,.58)!important;
  backdrop-filter:blur(18px) saturate(.75) brightness(.58)!important;
  -webkit-backdrop-filter:blur(18px) saturate(.75) brightness(.58)!important;
}
.modal-card{
  background:linear-gradient(145deg,rgba(17,27,36,.97),rgba(5,12,18,.98))!important;
  color:#f7fafc!important;
  border-color:rgba(255,255,255,.16)!important;
  box-shadow:0 34px 110px rgba(0,0,0,.58),inset 0 1px 0 rgba(255,255,255,.10)!important;
}
.modal-card h2{color:#ffffff!important}
.modal-kicker{color:#a9c7d8!important}
.about-copy{color:#e6edf2!important}
.modal-close{color:#fff!important;background:rgba(255,255,255,.08)!important;border-color:rgba(255,255,255,.18)!important}
.modal-close:hover{background:rgba(255,255,255,.16)!important}
.contact-form label{color:#d7e0e6!important}
.contact-form input,.contact-form textarea{
  background:rgba(255,255,255,.075)!important;
  border-color:rgba(255,255,255,.18)!important;
  color:#fff!important;
  caret-color:#fff;
}
.contact-form input::placeholder,.contact-form textarea::placeholder{color:rgba(255,255,255,.48)!important}
.contact-form input:focus,.contact-form textarea:focus{background:rgba(255,255,255,.11)!important;border-color:#9fc5d8!important;box-shadow:0 0 0 3px rgba(159,197,216,.14)!important}
.form-submit{background:#f3f7f9!important;color:#0a1620!important;border-color:#fff!important;box-shadow:0 10px 30px rgba(0,0,0,.24)}
.form-submit:hover{background:#fff!important;box-shadow:0 14px 36px rgba(0,0,0,.34)!important}
.form-status.ok{color:#8ff0b8!important}.form-status.err{color:#ffabb2!important}

.captcha-question{display:inline-block!important;margin-left:8px!important;opacity:1!important;font-weight:700;color:#fff!important;letter-spacing:.04em}

/* V1.30 — slightly smaller menu tab */
.plus{width:50px!important;height:78px!important;border-radius:0 42px 42px 0!important;font-size:27px!important}
.plus:hover{width:55px!important}
.radial.open .plus{width:52px!important}
.radial.open .plus::after{font-size:24px!important}
@media(max-width:600px){.plus{width:44px!important;height:70px!important;border-radius:0 38px 38px 0!important;font-size:24px!important}.plus:hover{width:48px!important}.radial.open .plus{width:46px!important}.radial.open .plus::after{font-size:22px!important}}

/* v1.31 — slightly smaller left menu toggle; preserve existing motion and menu layout */
.plus{width:48px!important;height:70px!important;border-radius:0 38px 38px 0!important;font-size:24px!important}
.plus:before{border-radius:0 40px 40px 0!important}
.plus:hover{width:52px!important}
.radial.open .plus{width:50px!important}
.radial.open .plus:after{font-size:25px!important}
@media(max-width:600px){.plus{width:43px!important;height:63px!important;border-radius:0 34px 34px 0!important;font-size:22px!important}.plus:before{border-radius:0 36px 36px 0!important}.plus:hover{width:46px!important}.radial.open .plus{width:45px!important}.radial.open .plus:after{font-size:23px!important}}