:root {
  --void: #05060a;
  --graphite: #10131a;
  --ice: #7ee8ff;
  --ember: #e8b86d;
  --fog: #9aa0aa;
  --paper: #f2eee6;
  --plasma: #8b7cff;
  --status-h: 42px;
  --ease: cubic-bezier(0.22, 1, 0.36, 1);
  --accent: var(--ice);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
html, body {
  margin: 0;
  background: var(--void);
  color: var(--paper);
  font-family: Poppins, system-ui, sans-serif;
}
body {
  overflow-x: hidden;
  padding-bottom: var(--status-h);
}
body::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background:
    radial-gradient(900px 500px at 12% -10%, rgba(126,232,255,0.1), transparent 55%),
    radial-gradient(700px 480px at 92% 8%, rgba(139,124,255,0.08), transparent 50%),
    radial-gradient(600px 400px at 70% 100%, rgba(232,184,109,0.05), transparent 46%);
}
body::after {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  opacity: 0.18;
  background-image:
    linear-gradient(rgba(255,255,255,0.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,0.035) 1px, transparent 1px);
  background-size: 72px 72px;
  mask-image: radial-gradient(ellipse at center, #000 30%, transparent 78%);
}
a { color: inherit; text-decoration: none; }
button, input, textarea { font: inherit; color: inherit; }
::selection { background: rgba(126, 232, 255, 0.35); color: #f7fbff; }
::-webkit-scrollbar { width: 8px; }
::-webkit-scrollbar-thumb { background: rgba(126,232,255,0.22); }

.noise {
  pointer-events: none;
  position: fixed;
  inset: 0;
  z-index: 40;
  opacity: 0.04;
  mix-blend-mode: overlay;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

#signal-field { position: fixed; inset: 0; z-index: 0; pointer-events: none; }

.wrap { width: min(1380px, calc(100% - 40px)); margin: 0 auto; }
.rule {
  height: 1px;
  margin: 0 20px;
  background: linear-gradient(90deg, transparent, rgba(126,232,255,0.35), rgba(232,184,109,0.25), transparent);
}

.kicker {
  margin: 0;
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.22em;
  text-transform: uppercase;
}
.ice { color: var(--ice); }
.ember { color: var(--ember); }
.fog { color: var(--fog); }

.panel, .panel-hot {
  position: relative;
  border: 1px solid rgba(255,255,255,0.08);
  background: linear-gradient(180deg, rgba(18,22,30,0.92), rgba(10,12,16,0.88));
  box-shadow: 0 24px 80px rgba(0,0,0,0.32);
  transition: border-color 0.35s var(--ease), transform 0.35s var(--ease), box-shadow 0.35s var(--ease);
}
.panel:hover { border-color: rgba(255,255,255,0.16); transform: translateY(-3px); }
.panel-hot {
  border-color: rgba(126,232,255,0.45);
  background:
    radial-gradient(120% 90% at 100% 0%, rgba(126,232,255,0.12), transparent 48%),
    linear-gradient(180deg, rgba(18,22,30,0.96), rgba(10,12,16,0.9));
  box-shadow: 0 20px 70px rgba(126,232,255,0.08);
}

.corners::before, .corners::after {
  content: "";
  position: absolute;
  width: 14px;
  height: 14px;
  pointer-events: none;
}
.corners::before { top: 8px; left: 8px; border-top: 1px solid var(--ice); border-left: 1px solid var(--ice); }
.corners::after { right: 8px; bottom: 8px; border-right: 1px solid var(--ember); border-bottom: 1px solid var(--ember); }

.btn, .btn-ghost {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  border: 1px solid rgba(126,232,255,0.4);
  padding: 15px 26px;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  cursor: pointer;
  background: transparent;
  color: var(--ice);
  transition: 0.25s var(--ease);
}
.btn { background: var(--ice); color: var(--void); border-color: var(--ice); box-shadow: 0 0 28px rgba(126,232,255,0.18); }
.btn:hover { background: var(--paper); box-shadow: 0 0 36px rgba(226,220,200,0.16); }
.btn-ghost:hover { background: rgba(126,232,255,0.1); border-color: var(--ice); }
.btn-wa, .nav-wa, .link-wa {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
}
.btn-wa::before, .nav-wa::before, .link-wa::before {
  content: "";
  width: 15px;
  height: 15px;
  flex: none;
  background: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M17.472 14.382c-.297-.149-1.758-.867-2.03-.967-.273-.099-.471-.148-.67.15-.197.297-.767.966-.94 1.164-.173.199-.347.223-.644.075-.297-.15-1.255-.463-2.39-1.475-.883-.788-1.48-1.761-1.653-2.059-.173-.297-.018-.458.13-.606.134-.133.298-.347.446-.52.149-.174.198-.298.298-.497.099-.198.05-.371-.025-.52-.075-.149-.669-1.612-.916-2.207-.242-.579-.487-.5-.669-.51-.173-.008-.371-.01-.57-.01-.198 0-.52.074-.792.372-.272.297-1.04 1.016-1.04 2.479 0 1.462 1.065 2.875 1.213 3.074.149.198 2.096 3.2 5.077 4.487.709.306 1.262.489 1.694.625.712.227 1.36.195 1.871.118.571-.085 1.758-.719 2.006-1.413.248-.694.248-1.289.173-1.413-.074-.124-.272-.198-.57-.347m-5.421 7.403h-.004a9.87 9.87 0 01-5.031-1.378l-.361-.214-3.741.982.998-3.648-.235-.374a9.86 9.86 0 01-1.51-5.26c.001-5.45 4.436-9.884 9.888-9.884 2.64 0 5.122 1.03 6.988 2.898a9.825 9.825 0 012.893 6.994c-.003 5.45-4.435 9.884-9.885 9.884m8.413-18.297A11.815 11.815 0 0012.05 0C5.495 0 .16 5.335.157 11.892c0 2.096.547 4.142 1.588 5.945L.057 24l6.305-1.654a11.882 11.882 0 005.683 1.448h.005c6.554 0 11.89-5.335 11.893-11.893a11.821 11.821 0 00-3.48-8.413z'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M17.472 14.382c-.297-.149-1.758-.867-2.03-.967-.273-.099-.471-.148-.67.15-.197.297-.767.966-.94 1.164-.173.199-.347.223-.644.075-.297-.15-1.255-.463-2.39-1.475-.883-.788-1.48-1.761-1.653-2.059-.173-.297-.018-.458.13-.606.134-.133.298-.347.446-.52.149-.174.198-.298.298-.497.099-.198.05-.371-.025-.52-.075-.149-.669-1.612-.916-2.207-.242-.579-.487-.5-.669-.51-.173-.008-.371-.01-.57-.01-.198 0-.52.074-.792.372-.272.297-1.04 1.016-1.04 2.479 0 1.462 1.065 2.875 1.213 3.074.149.198 2.096 3.2 5.077 4.487.709.306 1.262.489 1.694.625.712.227 1.36.195 1.871.118.571-.085 1.758-.719 2.006-1.413.248-.694.248-1.289.173-1.413-.074-.124-.272-.198-.57-.347m-5.421 7.403h-.004a9.87 9.87 0 01-5.031-1.378l-.361-.214-3.741.982.998-3.648-.235-.374a9.86 9.86 0 01-1.51-5.26c.001-5.45 4.436-9.884 9.888-9.884 2.64 0 5.122 1.03 6.988 2.898a9.825 9.825 0 012.893 6.994c-.003 5.45-4.435 9.884-9.885 9.884m8.413-18.297A11.815 11.815 0 0012.05 0C5.495 0 .16 5.335.157 11.892c0 2.096.547 4.142 1.588 5.945L.057 24l6.305-1.654a11.882 11.882 0 005.683 1.448h.005c6.554 0 11.89-5.335 11.893-11.893a11.821 11.821 0 00-3.48-8.413z'/%3E%3C/svg%3E") center / contain no-repeat;
}
.btn-wa {
  border: 1px solid #25d366;
  padding: 15px 26px;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  background: #25d366;
  color: #07250f;
  box-shadow: 0 0 28px rgba(37, 211, 102, 0.22);
  transition: 0.25s var(--ease);
}
.btn-wa:hover { background: #6aff9d; border-color: #6aff9d; }
.link-wa {
  margin-top: 26px;
  margin-left: 14px;
  color: #25d366;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.16em;
  text-transform: uppercase;
}
.header-actions { display: flex; align-items: center; gap: 8px; }
.nav-wa {
  border: 1px solid rgba(37, 211, 102, 0.55);
  padding: 9px 14px;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: #25d366;
}
.nav-wa:hover { background: rgba(37, 211, 102, 0.12); }
nav.mob .nav-wa { justify-content: flex-start; border: 0; padding: 0; }
@media (max-width: 420px) {
  .nav-wa { padding: 9px 10px; font-size: 0; gap: 0; }
  .nav-wa::before { width: 16px; height: 16px; }
}

header {
  position: fixed;
  inset: 0 0 auto;
  z-index: 30;
  border-bottom: 1px solid transparent;
}
header.scrolled { border-color: rgba(126,232,255,0.16); background: rgba(5,6,10,0.72); backdrop-filter: blur(16px); }
.header-row { height: 72px; display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.brand { display: flex; align-items: center; gap: 12px; }
.mark {
  width: 34px; height: 34px;
  display: grid; place-items: center;
  border: 1px solid rgba(126,232,255,0.35);
  background: #06070b;
  color: var(--ice);
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.06em;
  line-height: 1;
  flex: none;
}
.brand > span:not(.mark) { font-size: 12px; font-weight: 500; letter-spacing: 0.2em; text-transform: uppercase; color: var(--fog); }
nav.desk { display: none; gap: 28px; font-size: 12px; font-weight: 500; }
nav.desk a { position: relative; color: var(--fog); }
nav.desk a::after {
  content: "";
  position: absolute;
  left: 0; bottom: -6px;
  width: 100%; height: 1px;
  background: var(--ice);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.3s var(--ease);
}
nav.desk a:hover, nav.desk a.on { color: var(--paper); }
nav.desk a:hover::after, nav.desk a.on::after { transform: scaleX(1); }
.nav-cta {
  border: 1px solid rgba(126,232,255,0.4);
  padding: 9px 14px;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ice);
}
#menu-btn { display: inline; background: none; border: 0; color: var(--fog); text-transform: uppercase; font-size: 12px; cursor: pointer; }
nav.mob { display: none; padding: 0 20px 18px; background: rgba(5,6,10,0.94); }
nav.mob.open { display: grid; gap: 14px; }
nav.mob a { color: var(--fog); font-weight: 500; }

#boot {
  position: fixed;
  inset: 0;
  z-index: 50;
  display: grid;
  place-items: center;
  background: var(--void);
  transition: opacity 0.5s var(--ease);
  animation: bootOut 0.45s 1.15s forwards;
}
#boot.hide { opacity: 0; pointer-events: none; visibility: hidden; }
.boot-box { width: min(420px, 80vw); text-align: center; position: relative; }
.boot-ring {
  position: absolute;
  inset: -40px;
  border: 1px solid rgba(126,232,255,0.15);
  border-radius: 50%;
  animation: spin 8s linear infinite;
}
.boot-box .logo { font-size: 68px; font-weight: 600; margin: 0; letter-spacing: -0.04em; }
.boot-line { height: 1px; background: linear-gradient(90deg, transparent, var(--ice), var(--ember), transparent); transform-origin: left; animation: draw 0.8s var(--ease) forwards; }

main { position: relative; z-index: 10; }

.hero {
  min-height: 100svh;
  display: grid;
  align-items: center;
  padding: 120px 0 48px;
}
.inner-hero { min-height: auto; padding: 128px 0 56px; }
.inner-hero h1 { max-width: 14ch; }
.hero-grid { display: grid; gap: 56px; }
.hero h1 {
  margin: 18px 0 0;
  max-width: 12ch;
  font-size: clamp(46px, 8vw, 92px);
  line-height: 0.98;
  letter-spacing: -0.045em;
  font-weight: 600;
}
.hero.inner-hero h1 { max-width: 14ch; }
.inner-hero .preview-box { min-height: 580px; }
.hero h1 em { font-weight: 500; }
.shimmer {
  background: linear-gradient(100deg, #f2eee6 0%, #7ee8ff 40%, #e8b86d 62%, #f2eee6 100%);
  background-size: 220% 100%;
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  animation: shimmer 8s linear infinite;
}
.hero p.lead { max-width: 34rem; color: var(--fog); line-height: 1.85; font-size: 16px; }
#status-line { min-height: 24px; margin: 22px 0 0; font-size: 13px; font-weight: 500; color: var(--ice); }
.cta-row, .chip-row { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 28px; }
.chip {
  border: 1px solid rgba(255,255,255,0.1);
  background: transparent;
  color: var(--fog);
  padding: 7px 13px;
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  cursor: pointer;
  transition: 0.25s var(--ease);
}
.chip.on { border-color: var(--ice); background: rgba(126,232,255,0.1); color: var(--ice); }

.preview-box {
  position: relative;
  min-height: 420px;
  overflow: hidden;
}
.preview-box.panel:hover { transform: none; }
.preview-card {
  position: relative;
  z-index: 1;
  height: 100%;
  display: flex;
  flex-direction: column;
  padding: 28px 28px 56px;
}
.preview-top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
}
.preview-card h3 {
  margin: 22px 0 0;
  font-size: clamp(28px, 4vw, 42px);
  color: var(--ice);
}
.preview-card p:not(.kicker) {
  margin: 14px 0 0;
  max-width: 28ch;
  color: var(--fog);
  line-height: 1.7;
}
.preview-card ul {
  list-style: none;
  padding: 0;
  margin: 22px 0 0;
}
.preview-card li {
  display: flex;
  gap: 12px;
  margin: 10px 0;
  font-size: 14px;
}
.preview-card li::before {
  content: "";
  width: 6px;
  height: 1px;
  margin-top: 10px;
  background: var(--ice);
  flex: none;
}
.preview-meta {
  position: absolute;
  inset: auto 0 0;
  display: flex;
  justify-content: space-between;
  padding: 14px 18px;
  font-size: 10px;
  font-weight: 500;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--fog);
  background: linear-gradient(transparent, rgba(5,6,10,0.88));
  z-index: 2;
  pointer-events: none;
}
.scan {
  position: absolute;
  inset: 0 auto auto 0;
  height: 1px;
  width: 36%;
  background: linear-gradient(90deg, transparent, var(--ice));
  animation: scan 3.8s linear infinite;
  z-index: 3;
  pointer-events: none;
}

.ticker {
  overflow: hidden;
  border-block: 1px solid rgba(255,255,255,0.06);
  padding: 14px 0;
}
.ticker-track {
  display: flex;
  gap: 48px;
  width: max-content;
  animation: ticker 28s linear infinite;
  font-size: 12px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--fog);
}
.ticker b { color: var(--ice); font-weight: 500; }

section { padding: 108px 0; }
.sec-head { display: grid; gap: 8px; margin-bottom: 40px; }
.hizmet-head { align-items: center; gap: 24px; }
.hizmet-portrait {
  position: relative;
  overflow: hidden;
  width: 100%;
  max-width: 220px;
  aspect-ratio: 4 / 5;
  min-height: 0;
  padding: 0;
  background: #10131a;
}
.hizmet-portrait.panel:hover { transform: none; }
h2 {
  margin: 12px 0 0;
  font-size: clamp(34px, 5.4vw, 64px);
  letter-spacing: -0.045em;
  font-weight: 600;
}
h2 em, h3 em { font-weight: 500; }
h3 { margin: 14px 0 0; font-size: clamp(22px, 3vw, 34px); letter-spacing: -0.03em; font-weight: 600; }

.reveal { opacity: 1; transform: none; }

.stats, .audience, .services, .offers { display: grid; gap: 16px; }
.stats { grid-template-columns: repeat(2, 1fr); margin-bottom: 64px; }
.stat, .aud, .svc, .offer { padding: 28px; }
.stat b { display: block; font-size: 42px; color: var(--ice); letter-spacing: -0.05em; }
.stat span, .aud p, .svc p, .offer p { color: var(--fog); line-height: 1.7; }
.aud { min-height: 160px; }
.aud h3 { font-size: 20px; }

.ico {
  width: 42px; height: 42px;
  display: grid; place-items: center;
  border: 1px solid rgba(126,232,255,0.2);
  color: var(--ice);
  font-size: 18px;
}
.svc-top, .row-between { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; flex-wrap: wrap; }
.svc h3.on { color: var(--ice); }
.svc ul, .offer ul, .about ul { list-style: none; padding: 0; margin: 22px 0 0; }
.svc li, .offer li, .about li { display: flex; gap: 12px; margin: 10px 0; font-size: 14px; }
.svc li::before, .offer li::before, .about li::before {
  content: ""; width: 6px; height: 1px; margin-top: 10px; background: var(--ice); flex: none;
}
.link { display: inline-flex; margin-top: 26px; color: var(--ice); font-size: 12px; font-weight: 600; letter-spacing: 0.16em; text-transform: uppercase; }
.svc .link + .link { margin-top: 10px; }

.offer { display: flex; flex-direction: column; min-height: 100%; }
.offer .pack-cta { margin-top: auto; display: grid; gap: 8px; }
.offer .btn, .offer .btn-ghost, .offer .btn-wa { width: 100%; }
.svc .link-wa { margin-left: 0; display: inline-flex; }
.aud-links .link-wa { margin-top: 16px; margin-left: 0; }
.fields .cta-row { margin-top: 8px; }
.foot .link-wa { margin: 8px 0 0; }
.offer.featured { transform: none; }
@media (min-width: 1100px) {
  .offer.featured { transform: translateY(-12px) scale(1.02); }
}

.work { display: grid; gap: 28px; padding: 36px 0; border-top: 1px solid rgba(255,255,255,0.07); }
.work:last-of-type { border-bottom: 1px solid rgba(255,255,255,0.07); }
.shot {
  position: relative;
  aspect-ratio: 16/8;
  overflow: hidden;
  isolation: isolate;
}
.shot::after {
  content: "";
  position: absolute;
  inset: 0;
  background: repeating-linear-gradient(180deg, transparent, transparent 17px, rgba(255,255,255,0.03) 18px);
}
.shot-orb {
  position: absolute;
  width: 42%;
  aspect-ratio: 1;
  border-radius: 50%;
  filter: blur(8px);
  right: 12%;
  top: 18%;
  opacity: 0.7;
}
.shot.noir { background: linear-gradient(135deg, #120e0c, #3b2a20 55%, #0c1114); }
.shot.noir .shot-orb { background: radial-gradient(circle, #e8b86d, transparent 68%); }
.shot.ice { background: linear-gradient(135deg, #07151a, #123843 55%, #0a1014); }
.shot.ice .shot-orb { background: radial-gradient(circle, #7ee8ff, transparent 68%); }
.shot.ember { background: linear-gradient(135deg, #160f08, #5a3612 55%, #0e0c0a); }
.shot.ember .shot-orb { background: radial-gradient(circle, #ffb45a, transparent 68%); }
.shot.violet { background: linear-gradient(135deg, #100e1c, #2c2258 55%, #0a0b12); }
.shot.violet .shot-orb { background: radial-gradient(circle, #8b7cff, transparent 68%); }
.shot-ui {
  position: absolute;
  inset: 16px auto auto 16px;
  z-index: 2;
  font-size: 11px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--ice);
}
.shot-ui strong { display: block; margin-top: 8px; font-size: 22px; letter-spacing: -0.03em; color: var(--paper); text-transform: none; }
.playhead { position: absolute; top: 0; bottom: 0; width: 1px; background: var(--ice); z-index: 3; box-shadow: 0 0 18px var(--ice); left: 18%; }

.pipe-grid { display: grid; gap: 48px; }
#pipeline { list-style: none; padding: 0; margin: 0; display: grid; gap: 0; position: relative; }
#pipeline::before {
  content: "";
  position: absolute;
  left: 22px;
  top: 18px;
  bottom: 18px;
  width: 1px;
  background: linear-gradient(var(--ice), rgba(232,184,109,0.3), transparent);
}
.pipe-step {
  padding: 22px 22px 22px 56px;
  display: flex;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 12px;
}
.dot {
  width: 10px; height: 10px; border-radius: 50%;
  background: rgba(255,255,255,0.15);
  flex: none;
  margin-top: 8px;
  box-shadow: 0 0 0 6px rgba(5,6,10,1);
}
.pipe-step.live .dot { background: var(--ice); box-shadow: 0 0 0 6px rgba(5,6,10,1), 0 0 16px var(--ice); }
.pipe-step.done .dot { background: var(--ember); }

.quiz { padding: 28px; min-height: 320px; }
.quiz h3 { margin-top: 10px; }
.quiz-opts { display: grid; gap: 10px; margin-top: 24px; }
.qopt {
  text-align: left;
  border: 1px solid rgba(255,255,255,0.1);
  background: transparent;
  color: var(--paper);
  padding: 16px 18px;
  cursor: pointer;
  transition: 0.25s var(--ease);
}
.qopt:hover, .qopt.on { border-color: var(--ice); background: rgba(126,232,255,0.08); color: var(--ice); }
.quiz-out h3 { font-size: 36px; }
.fark-wrap { position: relative; }
.fark-lines {
  position: absolute;
  inset: -8% -4% auto auto;
  width: min(72%, 820px);
  height: auto;
  pointer-events: none;
  z-index: 0;
}
.fark-head { position: relative; z-index: 1; max-width: 720px; margin-bottom: 40px; }
.fark-head h2 { margin-top: 14px; }
.fark-head .lead { margin-top: 16px; }
.compare-frame {
  position: relative;
  z-index: 1;
  border: 1px solid rgba(126,232,255,0.38);
  background: rgba(7, 9, 12, 0.72);
}
.cmp-row { padding: 36px 40px; }
.cmp-row + .cmp-row { border-top: 1px solid rgba(126,232,255,0.28); }
.cmp-good {
  background: linear-gradient(180deg, rgba(126,232,255,0.07), transparent 70%);
}
.cmp-row ul {
  list-style: none;
  padding: 0;
  margin: 22px 0 0;
  display: grid;
  gap: 14px 48px;
}
.cmp-row li {
  color: var(--paper);
  line-height: 1.55;
  padding-left: 18px;
  position: relative;
}
.cmp-row li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.65em;
  width: 6px;
  height: 1px;
  background: var(--ice);
}
.ritim-wrap { position: relative; }
.ritim-lines {
  position: absolute;
  left: 0;
  right: 0;
  top: 42%;
  width: 100%;
  height: auto;
  pointer-events: none;
  z-index: 0;
}
.ritim-frame {
  position: relative;
  z-index: 1;
  display: grid;
  border: 1px solid rgba(126,232,255,0.38);
  background: rgba(7, 9, 12, 0.72);
}
.ritim-cell {
  padding: 36px 40px;
  border-bottom: 1px solid rgba(126,232,255,0.2);
}
.ritim-cell h3 { margin-top: 12px; }
.ritim-cell p { color: var(--fog); line-height: 1.7; margin: 12px 0 0; }
.ritim-now { background: linear-gradient(180deg, rgba(126,232,255,0.08), transparent 72%); }
.ilke-wrap { position: relative; }
.ilke-lines {
  position: absolute;
  inset: 0 0 auto auto;
  width: min(70%, 780px);
  pointer-events: none;
  z-index: 0;
}
.ilke-frame {
  position: relative;
  z-index: 1;
  display: grid;
  border: 1px solid rgba(126,232,255,0.38);
  background: rgba(7, 9, 12, 0.72);
}
.ilke-cell {
  padding: 36px 40px;
  border-bottom: 1px solid rgba(126,232,255,0.2);
}
.ilke-cell h3 { margin-top: 12px; }
.ilke-cell p { color: var(--fog); line-height: 1.7; margin: 12px 0 0; }

.about-grid, .intake-grid { display: grid; gap: 48px; }
.studio-plate {
  position: relative;
  overflow: hidden;
  min-height: 560px;
  padding: 0;
  background: #10131a;
}
.studio-plate.panel:hover { transform: none; }
.studio-photo {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 52% 10%;
}
.studio-plate-overlay {
  position: absolute;
  inset: auto 0 0;
  z-index: 1;
  padding: 96px 24px 24px;
  background: linear-gradient(180deg, transparent, rgba(6, 7, 11, 0.92) 62%);
}
.studio-plate-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}
.studio-name {
  margin: 8px 0 6px;
  font-size: clamp(28px, 4vw, 40px);
  letter-spacing: -0.04em;
  font-weight: 600;
}
.studio-lines {
  list-style: none;
  padding: 0;
  margin: 28px 0 0;
  display: grid;
  gap: 0;
  border-top: 1px solid rgba(255,255,255,0.08);
}
.studio-lines li {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 14px 0;
  border-bottom: 1px solid rgba(255,255,255,0.08);
  font-size: 16px;
}
.studio-lines span {
  width: 28px;
  color: var(--ice);
  font-size: 11px;
  letter-spacing: 0.16em;
}
.studio-facts {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 12px;
  margin-top: auto;
  padding-top: 22px;
}
.studio-facts b {
  display: block;
  font-size: 22px;
  color: var(--ice);
  letter-spacing: -0.04em;
}
.studio-facts span {
  font-size: 10px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--fog);
}
.about-points {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  margin-top: 28px;
}
.about-points article {
  padding: 16px;
  border: 1px solid rgba(255,255,255,0.08);
}
.about-points span {
  display: block;
  font-size: 11px;
  letter-spacing: 0.16em;
  color: var(--ember);
}
.about-points h3 {
  margin: 8px 0 0;
  font-size: 16px;
}
.about-points p {
  margin: 8px 0 0;
  color: var(--fog);
  font-size: 13px;
  line-height: 1.6;
}

.modules, .sector-grid { display: grid; gap: 12px; }
.module { padding: 20px 22px; min-height: 148px; }
.module h3 { margin-top: 10px; font-size: 18px; }
.module p { margin: 8px 0 0; color: var(--fog); font-size: 13px; line-height: 1.6; }
.sector-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 24px;
}
.sector-search {
  min-width: min(280px, 100%);
  margin: 0;
  border: 1px solid rgba(255,255,255,0.12);
  background: transparent;
  padding: 10px 12px;
  color: var(--paper);
}
.sector-card {
  display: flex;
  flex-direction: column;
  width: 100%;
  padding: 22px;
  text-align: left;
  color: inherit;
  cursor: pointer;
}
.sector-card h3 { margin-top: 8px; font-size: 22px; }
.sector-card p { margin: 8px 0 0; color: var(--fog); font-size: 14px; line-height: 1.65; }
.sector-card ul { list-style: none; padding: 0; margin: 14px 0 0; }
.sector-card li { display: flex; gap: 10px; margin: 6px 0; font-size: 13px; }
.sector-card li::before {
  content: "";
  width: 6px;
  height: 1px;
  margin-top: 9px;
  background: var(--ice);
  flex: none;
}
.sector-card .link { margin-top: auto; padding-top: 16px; }

form { padding: 32px; }
label { display: block; margin-bottom: 22px; }
label span { display: block; }
input, textarea, select {
  width: 100%;
  margin-top: 8px;
  border: 0;
  border-bottom: 1px solid rgba(255,255,255,0.14);
  background: transparent;
  padding: 12px 0;
  outline: none;
  transition: border-color 0.25s;
}
select {
  border-radius: 0;
  appearance: none;
  cursor: pointer;
}
select option { background: #10131a; color: var(--paper); }
input:focus, textarea:focus, select:focus { border-color: var(--ice); }
textarea { resize: none; }
.ok { display: none; min-height: 240px; }
.ok.show { display: block; }
form.sent .fields { display: none; }

footer { border-top: 1px solid rgba(255,255,255,0.05); padding: 48px 0 72px; }
.foot { display: grid; gap: 16px; color: var(--fog); font-size: 14px; }
.foot b { color: var(--paper); }

#status {
  position: fixed;
  inset: auto 0 0;
  z-index: 40;
  height: var(--status-h);
  border-top: 1px solid rgba(255,255,255,0.06);
  background: rgba(5,6,10,0.82);
  backdrop-filter: blur(10px);
}
.status-row {
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  font-size: 10px;
  font-weight: 500;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--fog);
}
.live-dot {
  width: 6px; height: 6px; border-radius: 50%; background: var(--ice);
  box-shadow: 0 0 0 4px rgba(126,232,255,0.14);
  animation: pulse 1.6s ease-in-out infinite;
}
.status-left { display: flex; align-items: center; gap: 10px; }
#status-channels { display: none; gap: 14px; overflow: hidden; }

@keyframes shimmer { to { background-position: -120% 0; } }
@keyframes draw { from { transform: scaleX(0); } to { transform: scaleX(1); } }
@keyframes pulse { 50% { opacity: 0.45; transform: scale(0.72); } }
@keyframes scan { 0% { transform: translateY(-20%); opacity: 0; } 15% { opacity: 0.7; } 100% { transform: translateY(120%); opacity: 0; } }
@keyframes ticker { to { transform: translateX(-50%); } }
@keyframes spin { to { transform: rotate(360deg); } }
@keyframes bootOut { to { opacity: 0; visibility: hidden; pointer-events: none; } }

.commerce { padding: 132px 0 108px; }
.commerce h1 {
  margin: 16px 0 0;
  max-width: 16ch;
  font-size: clamp(40px, 6vw, 72px);
  letter-spacing: -0.045em;
  font-weight: 600;
}
.commerce h1 em { font-weight: 500; }
.commerce > .wrap > .lead { max-width: 40rem; margin-top: 20px; line-height: 1.8; }
.plat-layers, .plat-grid, .plat-split { display: grid; gap: 16px; margin-top: 40px; }
.plat-layers article, .plat-card, .plat-split article, .plat-grid article { padding: 28px; }
.plat-layers h3, .plat-card h3 { margin-top: 16px; }
.plat-layers p, .plat-card p, .plat-split p, .plat-grid article p { color: var(--fog); line-height: 1.7; margin: 12px 0 0; }
.plat-card { display: flex; flex-direction: column; min-height: 100%; color: inherit; }
.plat-card .link, .plat-card .plat-actions { margin-top: auto; padding-top: 22px; }
.plat-grid ul {
  list-style: none;
  padding: 0;
  margin: 22px 0 0;
}
.plat-grid li {
  position: relative;
  padding-left: 14px;
  margin: 10px 0 0;
  font-size: 14px;
  line-height: 1.55;
}
.plat-grid li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 8px;
  width: 4px;
  height: 4px;
  background: var(--ice);
}
.plat-grid .link { display: inline-flex; margin-top: 18px; }
.diag-grid .link { display: inline-block; margin-top: 18px; }
.plat-card:hover { border-color: rgba(126,232,255,0.4); }
.plat-layer { margin-top: 64px; }
.plat-note { margin: 12px 0 0; max-width: 40rem; line-height: 1.7; font-size: 14px; }
.plat-note .link { margin-top: 8px; }
.plat-block { margin-top: 72px; }
.plat-block .btn { margin-top: 28px; }
.plat-block ul { list-style: none; padding: 0; margin: 22px 0 0; }
.plat-block li { display: flex; gap: 12px; margin: 10px 0; font-size: 14px; }
.plat-block li::before {
  content: "";
  width: 6px;
  height: 1px;
  margin-top: 10px;
  background: var(--ice);
  flex: none;
}
.axis-hint { font-size: 12px !important; margin-top: 6px !important; }
.plat-chips { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 20px; }
.plat-chips a {
  border: 1px solid rgba(255,255,255,0.1);
  padding: 8px 12px;
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--fog);
}
.plat-chips a:hover { border-color: rgba(126,232,255,0.4); color: var(--ice); }
.commerce .back { display: inline-block; margin-bottom: 28px; }
.commerce .back:hover { color: var(--ice); }
.aud-link { display: block; color: inherit; }
.aud-link .link { margin-top: 16px; }
.aud-links { display: flex; flex-wrap: wrap; gap: 0 18px; }
.aud-links .link { margin-top: 16px; }

.market-hero {
  min-height: 0;
  padding: 140px 0 48px;
  align-items: start;
}
.market-hero h1 { max-width: 14ch; }
.market-grid {
  display: grid;
  gap: 16px;
}
.market-card {
  appearance: none;
  width: 100%;
  padding: 24px;
  text-align: left;
  cursor: pointer;
}
.market-view .cta-row { margin-top: 36px; }
.market-card h3 { margin-top: 12px; }
.market-card p {
  margin: 10px 0 0;
  color: var(--fog);
  line-height: 1.65;
  font-size: 14px;
}
.market-view { scroll-margin-top: 96px; }
.market-view[hidden] { display: none !important; }

@media (min-width: 800px) {
  .plat-layers, .plat-split, .plat-grid { grid-template-columns: 1fr 1fr; }
  .plat-grid-3 { grid-template-columns: 1fr 1fr 1fr; }
}
@media (min-width: 1100px) {
  .plat-layers, .plat-grid { grid-template-columns: repeat(3, 1fr); }
  .plat-grid-4 { grid-template-columns: repeat(4, 1fr); }
}

@media (min-width: 800px) {
  .hero-grid, .about-grid, .intake-grid, .pipe-grid, .work { grid-template-columns: 1.08fr 0.92fr; align-items: center; }
  .about-grid { grid-template-columns: 0.88fr 1.12fr; align-items: stretch; }
  .pipe-grid { grid-template-columns: 0.72fr 1.28fr; align-items: start; }
  .pipe-grid > div:first-child { position: sticky; top: 120px; }
  .services, .offers, .audience, .sector-grid, .market-grid { grid-template-columns: 1fr 1fr; }
  .modules { grid-template-columns: repeat(4, 1fr); }
  .modules .module:nth-child(n+5) { grid-column: span 1; }
  .ilke-frame { grid-template-columns: 1fr 1fr; }
  .ilke-cell:nth-child(odd) { border-right: 1px solid rgba(126,232,255,0.2); }
  .ilke-cell:nth-child(n+3) { border-bottom: 0; }
  .ritim-frame { grid-template-columns: 1fr 1fr; }
  .ritim-cell:nth-child(odd) { border-right: 1px solid rgba(126,232,255,0.2); }
  .ritim-cell:nth-child(n+3) { border-bottom: 0; }
  .cmp-row ul { grid-template-columns: 1fr 1fr; }
  .stats { grid-template-columns: repeat(4, 1fr); }
  nav.desk { display: flex; }
  #menu-btn, nav.mob { display: none !important; }
  #status-channels { display: flex; }
  #status-channels span:nth-child(n+4) { display: none; }
  .foot { grid-template-columns: 1fr auto 1fr; align-items: center; }
  .foot :last-child { text-align: right; }
  .sec-head { grid-template-columns: 1.1fr 0.7fr; align-items: end; }
  .hizmet-head { grid-template-columns: 200px 1fr; align-items: center; }
}
@media (min-width: 1100px) {
  .offers { grid-template-columns: repeat(3, 1fr); }
  .audience { grid-template-columns: repeat(5, 1fr); }
  .quiz-opts { grid-template-columns: 1fr 1fr; }
  .modules { grid-template-columns: repeat(7, 1fr); }
  .sector-grid { grid-template-columns: repeat(3, 1fr); }
  .market-grid { grid-template-columns: repeat(3, 1fr); }
  #status-channels span:nth-child(n+4) { display: inline; }
}
.inner-hero .preview-box { min-height: 580px; }
.machine-note {
  margin: 14px 0 0;
  font-size: 12px;
  line-height: 1.55;
  color: var(--fog);
}
.machine-note b {
  display: block;
  margin-bottom: 4px;
  color: var(--ice);
  font-size: 10px;
  font-weight: 500;
  letter-spacing: 0.16em;
  text-transform: uppercase;
}
.diag-grid, .spec-grid, .unseen-grid, .tr-grid, .arch-grid {
  display: grid;
  gap: 16px;
}
.diag-grid article, .spec-grid article, .unseen-grid article, .tr-grid article, .arch-grid article {
  padding: 28px;
}
.diag-grid h3, .spec-grid h3, .unseen-grid h3, .tr-grid h3, .arch-grid h3 { margin-top: 14px; }
.diag-grid p, .tr-grid p, .arch-grid p {
  margin: 12px 0 0;
  color: var(--fog);
  line-height: 1.7;
}
.spec-grid { margin-top: 28px; }
.spec-grid ul, .unseen-grid ul {
  list-style: none;
  padding: 0;
  margin: 18px 0 0;
}
.spec-grid li, .unseen-grid li {
  display: flex;
  gap: 10px;
  margin: 8px 0;
  font-size: 14px;
  line-height: 1.55;
}
.spec-grid li::before, .unseen-grid li::before {
  content: "";
  width: 6px;
  height: 1px;
  margin-top: 10px;
  background: var(--ice);
  flex: none;
}
.os-layers .svc p { margin-top: 12px; }
.arch-cost {
  margin-top: 16px !important;
  color: var(--ember) !important;
  font-size: 13px;
}
.pack-out {
  margin: 16px 0 22px !important;
  font-size: 13px;
}
.inline-ice { color: var(--ice); }
.field-row {
  display: grid;
  gap: 18px;
}
.checkset {
  border: 0;
  padding: 0;
  margin: 0 0 22px;
}
.checkset legend { margin-bottom: 12px; }
.check {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 0 0 10px;
  font-size: 14px;
  color: var(--paper);
}
.check input {
  width: auto;
  margin: 0;
  accent-color: var(--ice);
}
.os-sectors .sector-card { min-height: 210px; }

@media (min-width: 800px) {
  .diag-grid, .unseen-grid, .tr-grid { grid-template-columns: 1fr 1fr; }
  .spec-grid, .arch-grid { grid-template-columns: 1fr 1fr 1fr; }
  .field-row { grid-template-columns: 1fr 1fr; }
}
@media (min-width: 1100px) {
  .diag-grid, .unseen-grid, .tr-grid { grid-template-columns: repeat(4, 1fr); }
  .os-sectors { grid-template-columns: repeat(4, 1fr); }
}

@media (max-width: 799px), (pointer: coarse) {
  body { cursor: auto; }
  .cursor, .cursor-dot { display: none; }
  .about-points { grid-template-columns: 1fr; }
}
.desk-card { display: flex; flex-direction: column; }
.desk-card ul {
  list-style: none;
  padding: 0;
  margin: 18px 0 0;
}
.desk-card li {
  position: relative;
  padding-left: 14px;
  margin: 8px 0 0;
  color: var(--paper);
  font-size: 14px;
  line-height: 1.55;
}
.desk-card li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 8px;
  width: 4px;
  height: 4px;
  background: var(--ice);
}
.desk-card .link { margin-top: auto; padding-top: 22px; }
.desk-card .link-wa,
.sector-card .link-wa {
  margin-top: 12px;
  margin-left: 0;
}
.plat-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 22px; }
.quote-docks {
  position: fixed;
  inset: auto 16px 20px 16px;
  z-index: 24;
  display: flex;
  gap: 8px;
}
.quote-dock {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--ice);
  background: var(--ice);
  color: var(--void);
  padding: 14px 16px;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  text-decoration: none;
}
.quote-dock-wa {
  background: #25d366;
  border-color: #25d366;
  color: #07250f;
}
.quote-dock-wa::before {
  content: "";
  width: 15px;
  height: 15px;
  margin-right: 8px;
  background: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M17.472 14.382c-.297-.149-1.758-.867-2.03-.967-.273-.099-.471-.148-.67.15-.197.297-.767.966-.94 1.164-.173.199-.347.223-.644.075-.297-.15-1.255-.463-2.39-1.475-.883-.788-1.48-1.761-1.653-2.059-.173-.297-.018-.458.13-.606.134-.133.298-.347.446-.52.149-.174.198-.298.298-.497.099-.198.05-.371-.025-.52-.075-.149-.669-1.612-.916-2.207-.242-.579-.487-.5-.669-.51-.173-.008-.371-.01-.57-.01-.198 0-.52.074-.792.372-.272.297-1.04 1.016-1.04 2.479 0 1.462 1.065 2.875 1.213 3.074.149.198 2.096 3.2 5.077 4.487.709.306 1.262.489 1.694.625.712.227 1.36.195 1.871.118.571-.085 1.758-.719 2.006-1.413.248-.694.248-1.289.173-1.413-.074-.124-.272-.198-.57-.347m-5.421 7.403h-.004a9.87 9.87 0 01-5.031-1.378l-.361-.214-3.741.982.998-3.648-.235-.374a9.86 9.86 0 01-1.51-5.26c.001-5.45 4.436-9.884 9.888-9.884 2.64 0 5.122 1.03 6.988 2.898a9.825 9.825 0 012.893 6.994c-.003 5.45-4.435 9.884-9.885 9.884m8.413-18.297A11.815 11.815 0 0012.05 0C5.495 0 .16 5.335.157 11.892c0 2.096.547 4.142 1.588 5.945L.057 24l6.305-1.654a11.882 11.882 0 005.683 1.448h.005c6.554 0 11.89-5.335 11.893-11.893a11.821 11.821 0 00-3.48-8.413z'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M17.472 14.382c-.297-.149-1.758-.867-2.03-.967-.273-.099-.471-.148-.67.15-.197.297-.767.966-.94 1.164-.173.199-.347.223-.644.075-.297-.15-1.255-.463-2.39-1.475-.883-.788-1.48-1.761-1.653-2.059-.173-.297-.018-.458.13-.606.134-.133.298-.347.446-.52.149-.174.198-.298.298-.497.099-.198.05-.371-.025-.52-.075-.149-.669-1.612-.916-2.207-.242-.579-.487-.5-.669-.51-.173-.008-.371-.01-.57-.01-.198 0-.52.074-.792.372-.272.297-1.04 1.016-1.04 2.479 0 1.462 1.065 2.875 1.213 3.074.149.198 2.096 3.2 5.077 4.487.709.306 1.262.489 1.694.625.712.227 1.36.195 1.871.118.571-.085 1.758-.719 2.006-1.413.248-.694.248-1.289.173-1.413-.074-.124-.272-.198-.57-.347m-5.421 7.403h-.004a9.87 9.87 0 01-5.031-1.378l-.361-.214-3.741.982.998-3.648-.235-.374a9.86 9.86 0 01-1.51-5.26c.001-5.45 4.436-9.884 9.888-9.884 2.64 0 5.122 1.03 6.988 2.898a9.825 9.825 0 012.893 6.994c-.003 5.45-4.435 9.884-9.885 9.884m8.413-18.297A11.815 11.815 0 0012.05 0C5.495 0 .16 5.335.157 11.892c0 2.096.547 4.142 1.588 5.945L.057 24l6.305-1.654a11.882 11.882 0 005.683 1.448h.005c6.554 0 11.89-5.335 11.893-11.893a11.821 11.821 0 00-3.48-8.413z'/%3E%3C/svg%3E") center / contain no-repeat;
}
@media (max-width: 799px) {
  body.commerce-page,
  body.ugc-page { padding-bottom: 72px; }
}
@media (min-width: 800px) {
  .quote-docks { display: none; }
}

.quote-modal {
  position: fixed;
  inset: 0;
  z-index: 55;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 24px 16px calc(var(--status-h) + 24px);
}
.quote-modal.open { display: flex; }
.quote-modal-backdrop {
  position: absolute;
  inset: 0;
  border: 0;
  padding: 0;
  cursor: pointer;
  background: rgba(5, 6, 10, 0.82);
  backdrop-filter: blur(14px);
}
.quote-modal-dialog {
  position: relative;
  z-index: 1;
  width: min(960px, 100%);
  max-height: min(88vh, calc(100vh - var(--status-h) - 48px));
  overflow: auto;
  padding: 52px 24px 24px;
  background:
    radial-gradient(120% 90% at 100% 0%, rgba(126,232,255,0.1), transparent 48%),
    linear-gradient(180deg, rgba(16,19,26,0.98), rgba(8,10,14,0.96));
  border: 1px solid rgba(126,232,255,0.28);
  box-shadow: 0 28px 90px rgba(0,0,0,0.48);
}
.quote-modal-dialog:hover { transform: none; }
.quote-modal-dialog .panel:hover { transform: none; }
.quote-modal-close {
  position: absolute;
  top: 16px;
  right: 16px;
  z-index: 2;
  border: 1px solid rgba(255,255,255,0.12);
  background: transparent;
  color: var(--fog);
  padding: 8px 12px;
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  cursor: pointer;
}
.quote-modal-close:hover {
  color: var(--ice);
  border-color: rgba(126,232,255,0.4);
}
.quote-modal .intake-grid { gap: 28px; }
body.quote-open { overflow: hidden; }
body.quote-open .quote-docks { display: none !important; }

.wa-float {
  position: fixed;
  right: 18px;
  bottom: calc(var(--status-h) + 18px);
  z-index: 45;
  width: 58px;
  height: 58px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: #25d366;
  color: #fff;
  box-shadow: 0 12px 32px rgba(37, 211, 102, 0.38);
  transition: transform 0.3s var(--ease), box-shadow 0.3s var(--ease);
}
.wa-float svg { width: 30px; height: 30px; fill: currentColor; }
.wa-float:hover {
  transform: translateY(-3px) scale(1.06);
  box-shadow: 0 18px 40px rgba(37, 211, 102, 0.5);
}
.wa-float::before {
  content: "";
  position: absolute;
  inset: -5px;
  border-radius: 50%;
  border: 1px solid rgba(37, 211, 102, 0.5);
  animation: waPulse 2s ease-out infinite;
  pointer-events: none;
}
.wa-float span {
  position: absolute;
  right: calc(100% + 12px);
  padding: 8px 12px;
  border-radius: 8px;
  background: rgba(16, 19, 26, 0.94);
  border: 1px solid rgba(255, 255, 255, 0.1);
  color: var(--paper);
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0.02em;
  white-space: nowrap;
  opacity: 0;
  transform: translateX(6px);
  pointer-events: none;
  transition: opacity 0.25s var(--ease), transform 0.25s var(--ease);
}
.wa-float:hover span,
.wa-float:focus-visible span {
  opacity: 1;
  transform: none;
}
@keyframes waPulse {
  to { transform: scale(1.22); opacity: 0; }
}
@media (max-width: 799px) {
  body.commerce-page .wa-float { display: none; }
  .wa-float span { display: none; }
}
body.quote-open .wa-float { visibility: hidden; pointer-events: none; }

@media (prefers-reduced-motion: reduce) {
  .shimmer { animation: none; color: var(--paper); background: none; }
  .ticker-track, .boot-ring, .scan, .wa-float::before { animation: none; }
  html { scroll-behavior: auto; }
  .reveal { opacity: 1; transform: none; }
}
