body.product-page{
  --product-glow-x:70%;
  --product-glow-y:22%;
}

body.product-page .product-hero{
  min-height:860px;
  padding:152px 0 92px;
  background:
    radial-gradient(circle at var(--product-glow-x) var(--product-glow-y),rgba(255,196,61,.22),transparent 28%),
    radial-gradient(circle at 12% 72%,rgba(233,255,88,.08),transparent 26%),
    linear-gradient(180deg,#0b0b09 0%,#090908 58%,#0d0d0b 100%);
}

body.product-page .product-hero::before{
  opacity:.34;
  background-size:74px 74px;
  mask-image:linear-gradient(to bottom,#000 0%,rgba(0,0,0,.88) 48%,transparent 94%);
}

body.product-page .product-hero::after{
  content:"";
  position:absolute;
  inset:-20% -12% auto auto;
  width:64vw;
  height:64vw;
  min-width:520px;
  min-height:520px;
  pointer-events:none;
  opacity:.33;
  background:
    repeating-conic-gradient(from 18deg,rgba(255,196,61,.22) 0 1.5deg,transparent 1.5deg 14deg),
    radial-gradient(circle,transparent 0 48%,rgba(255,196,61,.16) 49% 50%,transparent 51% 100%);
  border-radius:50%;
  filter:blur(.2px);
  animation:productRadar 24s linear infinite;
}

body.product-page .product-hero-grid{
  align-items:center;
}

body.product-page .product-hero h1{
  max-width:820px;
  text-shadow:0 18px 46px rgba(0,0,0,.28);
}

body.product-page .product-lead{
  max-width:680px;
}

body.product-page .product-badges span{
  background:rgba(255,255,255,.035);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.02);
}

.product-art-v5{
  min-height:560px;
  border-radius:34px;
  isolation:isolate;
  display:grid;
  place-items:center;
  overflow:hidden;
  background:
    radial-gradient(circle at calc(50% + var(--tilt-x,0px)) calc(42% + var(--tilt-y,0px)),rgba(255,196,61,.18),transparent 34%),
    radial-gradient(circle at 18% 18%,rgba(255,255,255,.06),transparent 28%),
    linear-gradient(145deg,#191914,#090908 74%);
  border:1px solid rgba(255,255,255,.16);
  box-shadow:0 34px 100px rgba(0,0,0,.38),inset 0 1px 0 rgba(255,255,255,.08);
}

.product-art-v5::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:0;
  background-image:
    linear-gradient(rgba(255,255,255,.045) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.045) 1px,transparent 1px);
  background-size:29px 29px;
  mask-image:radial-gradient(circle at 50% 44%,#000,transparent 70%);
}

.product-art-v5::after{
  content:"";
  position:absolute;
  inset:-20% auto -20% 46%;
  z-index:2;
  width:2px;
  background:linear-gradient(180deg,transparent,rgba(255,196,61,.78),transparent);
  box-shadow:0 0 26px rgba(255,196,61,.44);
  opacity:.55;
  animation:productScan 4.6s ease-in-out infinite;
}

.product-art-v5 .product-visual{
  position:relative;
  z-index:5;
  width:min(82%,440px);
  height:315px;
  transform:translate3d(calc(var(--tilt-x,0px) * .22),calc(var(--tilt-y,0px) * .22),0) scale(1.08);
  filter:drop-shadow(0 26px 44px rgba(0,0,0,.3));
}

.product-v5-orbit{
  position:absolute;
  z-index:1;
  left:50%;
  top:48%;
  border-radius:50%;
  border:1px solid rgba(255,196,61,.22);
  transform:translate(-50%,-50%);
  pointer-events:none;
}

.product-v5-orbit::before{
  content:"";
  position:absolute;
  width:9px;
  height:9px;
  border-radius:50%;
  background:var(--yellow);
  box-shadow:0 0 0 7px rgba(255,196,61,.08),0 0 24px rgba(255,196,61,.52);
}

.product-v5-orbit--outer{
  width:390px;
  height:390px;
  animation:spin 20s linear infinite;
}

.product-v5-orbit--outer::before{left:48px;top:72px}

.product-v5-orbit--mid{
  width:282px;
  height:282px;
  border-style:dashed;
  border-color:rgba(255,255,255,.18);
  animation:spin 15s linear infinite reverse;
}

.product-v5-orbit--mid::before{
  right:28px;
  bottom:58px;
  background:var(--acid);
}

.product-v5-orbit--core{
  width:155px;
  height:155px;
  border-color:rgba(255,196,61,.28);
  animation:productPulseRing 3.6s ease-in-out infinite;
}

.product-v5-orbit--core::before{display:none}

.product-v5-chip{
  position:absolute;
  z-index:6;
  min-width:112px;
  padding:12px 13px 11px;
  border:1px solid rgba(255,255,255,.15);
  border-radius:13px;
  background:rgba(10,10,9,.62);
  backdrop-filter:blur(14px);
  color:var(--white);
  box-shadow:0 16px 36px rgba(0,0,0,.28);
  transform:translate3d(calc(var(--tilt-x,0px) * .16),calc(var(--tilt-y,0px) * .16),0);
}

.product-v5-chip span{
  display:block;
  font:700 8px var(--mono);
  letter-spacing:.1em;
  color:var(--muted);
  text-transform:uppercase;
}

.product-v5-chip strong{
  display:block;
  margin-top:8px;
  font-size:18px;
  letter-spacing:-.04em;
}

.product-v5-chip--a{left:26px;top:74px;animation:productFloat 4.8s ease-in-out infinite}
.product-v5-chip--b{right:30px;top:58px;animation:productFloat 5.4s ease-in-out infinite reverse}
.product-v5-chip--c{right:38px;bottom:106px;animation:productFloat 5.8s ease-in-out infinite}

.product-v5-console{
  position:absolute;
  left:26px;
  right:26px;
  bottom:24px;
  z-index:6;
  min-height:76px;
  display:grid;
  grid-template-columns:1fr auto;
  gap:20px;
  align-items:center;
  padding:16px 18px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:17px;
  background:rgba(10,10,9,.58);
  backdrop-filter:blur(18px);
}

.product-v5-console span{
  display:block;
  font:700 8px var(--mono);
  letter-spacing:.12em;
  color:var(--muted);
  text-transform:uppercase;
}

.product-v5-console strong{
  display:block;
  margin-top:6px;
  font-size:18px;
  letter-spacing:-.035em;
}

.product-v5-bars{
  display:flex;
  align-items:flex-end;
  gap:5px;
  height:38px;
}

.product-v5-bars i{
  display:block;
  width:6px;
  height:40%;
  border-radius:4px 4px 0 0;
  background:var(--yellow);
  animation:productBars 1.4s ease-in-out infinite;
}

.product-v5-bars i:nth-child(2){animation-delay:.12s}
.product-v5-bars i:nth-child(3){animation-delay:.24s}
.product-v5-bars i:nth-child(4){animation-delay:.36s}
.product-v5-bars i:nth-child(5){animation-delay:.48s}
.product-v5-bars i:nth-child(6){animation-delay:.6s}

body[data-product-visual="anonymizer"] .product-art-v5 .product-visual{width:min(88%,520px)}
body[data-product-visual="presentations"] .product-art-v5 .product-visual{width:min(84%,500px)}
body[data-product-visual="voice"] .product-art-v5 .product-visual{width:min(80%,430px)}

body.product-page .product-summary{
  background:linear-gradient(180deg,#0d0d0b 0%,#12120f 100%);
  color:var(--white);
  padding:86px 0 94px;
  position:relative;
  overflow:hidden;
}

body.product-page .product-summary::before,
body.product-page .product-security::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  opacity:.18;
  background-image:
    linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px);
  background-size:56px 56px;
}

body.product-page .fact-grid{
  position:relative;
  z-index:1;
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:14px;
  border:0;
}

body.product-page .fact{
  min-height:178px;
  padding:28px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:18px;
  background:linear-gradient(145deg,rgba(255,255,255,.055),rgba(255,255,255,.018));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06);
}

body.product-page .fact strong{
  color:var(--yellow);
  font-size:clamp(35px,4.3vw,58px);
}

body.product-page .fact p{color:#c6c2b8}

body.product-page .product-story{
  background:
    radial-gradient(circle at 12% 18%,rgba(255,196,61,.16),transparent 24%),
    var(--paper);
  padding:52px 0 126px;
  position:relative;
}

body.product-page .story-grid{
  border-top:1px solid rgba(10,10,9,.18);
}

body.product-page .benefit-list{
  gap:12px;
  border:0;
}

body.product-page .benefit{
  min-height:184px;
  border:1px solid rgba(10,10,9,.16);
  border-radius:18px;
  background:rgba(255,255,255,.3);
  box-shadow:0 18px 40px rgba(10,10,9,.05);
}

body.product-page .workflow{
  position:relative;
  overflow:hidden;
  background:
    radial-gradient(circle at 88% 14%,rgba(255,255,255,.36),transparent 26%),
    linear-gradient(135deg,var(--yellow) 0%,#ffcf57 100%);
}

body.product-page .workflow::before{
  content:"";
  position:absolute;
  inset:auto -8% -18% 48%;
  width:560px;
  height:560px;
  border-radius:50%;
  border:1px solid rgba(10,10,9,.14);
  box-shadow:0 0 0 58px rgba(10,10,9,.035),0 0 0 116px rgba(10,10,9,.024);
}

body.product-page .workflow-grid{
  position:relative;
  z-index:1;
  gap:12px;
  border:0;
}

body.product-page .work-step{
  min-height:260px;
  border:1px solid rgba(10,10,9,.2);
  border-radius:18px;
  background:rgba(10,10,9,.055);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.24);
}

body.product-page .product-security{
  position:relative;
  overflow:hidden;
  background:linear-gradient(180deg,#11110f,#0a0a09);
}

body.product-page .security-card{
  position:relative;
  z-index:1;
  box-sizing:border-box;
  min-width:0;
  width:100%;
  border-radius:22px;
  background:linear-gradient(145deg,rgba(255,255,255,.055),rgba(255,255,255,.02));
  box-shadow:0 22px 60px rgba(0,0,0,.2),inset 0 1px 0 rgba(255,255,255,.06);
}

body.product-page .security-card.highlight{
  background:
    radial-gradient(circle at 86% 18%,rgba(255,255,255,.42),transparent 30%),
    var(--yellow);
}

body.product-page .product-final{
  background:
    radial-gradient(circle at 18% 12%,rgba(255,196,61,.2),transparent 26%),
    var(--paper);
}

body.product-v5-ready .v5-reveal{
  opacity:0;
  transform:translateY(22px);
  transition:opacity .7s ease,transform .7s ease;
  transition-delay:var(--v5-delay,0ms);
}

body.product-v5-ready .v5-reveal.v5-visible{
  opacity:1;
  transform:none;
}

@keyframes productRadar{to{transform:rotate(360deg)}}
@keyframes productScan{0%,100%{transform:translateX(-170px);opacity:0}16%{opacity:.6}52%{opacity:.42}82%{opacity:.1;transform:translateX(185px)}}
@keyframes productPulseRing{0%,100%{transform:translate(-50%,-50%) scale(1);opacity:.7}50%{transform:translate(-50%,-50%) scale(1.08);opacity:1}}
@keyframes productFloat{0%,100%{margin-top:0}50%{margin-top:-8px}}
@keyframes productBars{0%,100%{height:30%}50%{height:100%}}

@media(max-width:980px){
  body.product-page .product-hero{min-height:auto}
  .product-art-v5{min-height:500px}
  .product-v5-chip--b{display:none}
  .product-v5-orbit--outer{width:340px;height:340px}
  .product-v5-orbit--mid{width:248px;height:248px}
  body.product-page .fact-grid{grid-template-columns:1fr}
}

@media(max-width:640px){
  body.product-page .product-hero{padding-top:122px;padding-bottom:62px}
  body.product-page .product-back{margin-bottom:34px}
  body.product-page .product-hero-grid{gap:24px}
  body.product-page .product-hero h1{font-size:52px}
  body.product-page .product-lead{font-size:19px;line-height:1.42;margin-top:24px}
  body.product-page .product-badges{margin-top:22px}
  body.product-page .hero-actions{margin-top:28px}
  body.product-page .product-hero::after{min-width:360px;min-height:360px;opacity:.18}
  .product-art-v5{min-height:365px;border-radius:24px}
  .product-art-v5 .product-visual{width:88%;height:245px;transform:scale(.84)}
  body[data-product-visual] .product-art-v5 .product-visual{width:92%}
  .product-v5-orbit--outer{width:270px;height:270px}
  .product-v5-orbit--mid{width:196px;height:196px}
  .product-v5-orbit--core{width:124px;height:124px}
  .product-v5-chip{min-width:92px;padding:9px 10px;border-radius:11px}
  .product-v5-chip span{font-size:7px}
  .product-v5-chip strong{font-size:14px}
  .product-v5-chip--a{left:16px;top:42px}
  .product-v5-chip--c{right:16px;bottom:82px}
  .product-v5-console{left:14px;right:14px;bottom:14px;min-height:58px;padding:12px 13px;border-radius:14px}
  .product-v5-console strong{font-size:14px}
  .product-v5-bars{height:30px}
  body.product-page .product-summary{padding:64px 0}
  body.product-page .fact{min-height:150px}
  body.product-page .benefit{min-height:160px}
}

@media(prefers-reduced-motion:reduce){
  .product-art-v5::after,
  body.product-page .product-hero::after,
  .product-v5-orbit,
  .product-v5-chip,
  .product-v5-bars i,
  .product-v5-orbit--core{
    animation:none!important;
  }
  body.product-v5-ready .v5-reveal{
    opacity:1;
    transform:none;
    transition:none;
  }
}
