/* Gaming layer: lime + violet palette, dot fields, HUD details and motion. */
:root{--lime:#c3f562;--lime-deep:#aeed2e;--violet:#a855f7;--violet-text:#c69cff;--mono:ui-monospace,"SF Mono","JetBrains Mono",Consolas,monospace}

/* Dot fields: a dot grid that lets lime and violet light through. */
.dotted{position:relative;isolation:isolate}
.dot-field{position:absolute;inset:0;z-index:-1;pointer-events:none;opacity:.42;
  background:radial-gradient(26% 40% at 18% 62%,var(--lime-deep),transparent 72%),radial-gradient(26% 40% at 82% 34%,var(--violet),transparent 72%),radial-gradient(70% 60% at 50% 50%,#ffffffe6,#ffffff59 70%,transparent);
  -webkit-mask-image:radial-gradient(circle at center,#000 1px,transparent 1.5px),radial-gradient(60% 58% at 50% 50%,#000,#000a 55%,transparent 90%);mask-image:radial-gradient(circle at center,#000 1px,transparent 1.5px),radial-gradient(60% 58% at 50% 50%,#000,#000a 55%,transparent 90%);
  -webkit-mask-size:8px 8px,100% 100%;mask-size:8px 8px,100% 100%;-webkit-mask-composite:source-in;mask-composite:intersect;animation:dots-in 1.6s ease .2s both}
.dots-hero{inset:-40px -5% 0;opacity:.3;background:radial-gradient(24% 34% at 28% 40%,var(--lime-deep),transparent 72%),radial-gradient(24% 36% at 78% 52%,var(--violet),transparent 72%),radial-gradient(70% 65% at 50% 45%,#ffffffd9,#ffffff40 70%,transparent)}
.dots-wide{inset:-36px -3%;opacity:.3;border-radius:0}
.dots-top{bottom:auto;height:640px;opacity:.34;background:radial-gradient(22% 40% at 14% 42%,var(--lime-deep),transparent 72%),radial-gradient(24% 44% at 86% 36%,var(--violet),transparent 72%),radial-gradient(70% 60% at 50% 40%,#ffffffcc,#ffffff40 70%,transparent)}
.dots-low{top:auto;height:70%;opacity:.3}
.dots-banner{inset:0;border-radius:inherit;opacity:.5}
.dots-form{left:40%;top:80px;bottom:-20px;opacity:.4;background:radial-gradient(30% 40% at 30% 70%,var(--lime-deep),transparent 72%),radial-gradient(30% 40% at 75% 25%,var(--violet),transparent 72%),radial-gradient(70% 70% at 50% 50%,#ffffffd9,#ffffff40 70%,transparent)}
@keyframes dots-in{from{opacity:0}}

/* Type: HUD-style mono labels and lime headline accents. */
.eyebrow,.tiny,.step-label,.offer-num,.diagram-caption,.number,.looking span,.site-footer h4,.model-flow li:before,.hero-foot{font-family:var(--mono);letter-spacing:.9px}
.hero h1 em,h2 em{color:var(--lime)}h2 em{color:#d9ecbd}
.hero h1{position:relative}.spark{display:inline-block;width:.42em;height:.42em;margin:0 0 .42em .16em;vertical-align:middle;fill:#fff;filter:drop-shadow(0 0 8px #ffffffcc) drop-shadow(0 0 20px #aeed2e80);animation:twinkle 3.2s ease-in-out 1.6s infinite}
@keyframes twinkle{0%,100%{opacity:1;transform:scale(1) rotate(0)}50%{opacity:.55;transform:scale(.72) rotate(45deg)}}
.hero .eyebrow i,.live{display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--lime);box-shadow:0 0 0 3px #aeed2e2e,0 0 12px var(--lime);animation:blink 2s ease-in-out infinite}.live{margin-right:8px;vertical-align:1px}
@keyframes blink{50%{opacity:.35}}

/* Buttons: glow ring like a ready-to-play prompt. */
.button{background:linear-gradient(180deg,var(--lime),var(--lime-deep));color:#0b0d06;box-shadow:0 0 0 6px #aeed2e1f,0 10px 28px #aeed2e26,inset 0 1px 0 #ffffff70}
.hero .button{animation:pulse-ring 2.6s ease-in-out infinite}
@keyframes pulse-ring{50%{box-shadow:0 0 0 11px #aeed2e12,0 10px 32px #aeed2e33,inset 0 1px 0 #ffffff70}}
.button:hover{background:linear-gradient(180deg,#d4fa86,var(--lime))}
.looking b{display:inline-flex;align-items:center;gap:8px}.looking b:before{content:'';width:6px;height:6px;border-radius:50%;background:var(--lime);box-shadow:0 0 8px var(--lime)}
.looking+.looking b:before{background:var(--violet-text);box-shadow:0 0 8px var(--violet)}

/* Hero HUD diagram. */
.distribution-art{border-color:#c3f5623d;box-shadow:var(--glass-shadow),0 0 80px #a855f712,0 0 60px #aeed2e0d}
.hud-svg text{font-family:Inter,Arial,sans-serif}
.hud-svg .ring{transform-origin:220px 170px;animation:spin 40s linear infinite}.hud-svg .ring-rev{animation-duration:60s;animation-direction:reverse}
.hud-svg .packets path{stroke-dasharray:10 90;animation:packet 2.8s linear infinite}.hud-svg .packets path:nth-child(2){animation-delay:-.7s}.hud-svg .packets path:nth-child(3){animation-delay:-1.4s}.hud-svg .packets path:nth-child(4){animation-delay:-2.1s}
.hud-svg .hub-glow{filter:drop-shadow(0 0 14px #aeed2e40)}
.hud-svg .scan{animation:scan 6s ease-in-out infinite}
.hp-bar rect{opacity:.14;animation:hp 4.8s steps(1) infinite}
.hp-bar rect:nth-child(1){animation-delay:0s}.hp-bar rect:nth-child(2){animation-delay:.2s}.hp-bar rect:nth-child(3){animation-delay:.4s}.hp-bar rect:nth-child(4){animation-delay:.6s}.hp-bar rect:nth-child(5){animation-delay:.8s}.hp-bar rect:nth-child(6){animation-delay:1s}.hp-bar rect:nth-child(7){animation-delay:1.2s}.hp-bar rect:nth-child(8){animation-delay:1.4s}.hp-bar rect:nth-child(9){animation-delay:1.6s}.hp-bar rect:nth-child(10){animation-delay:1.8s}.hp-bar rect:nth-child(11){animation-delay:2s}.hp-bar rect:nth-child(12){animation-delay:2.2s}
.hp-bar rect:nth-child(n+9){fill:var(--violet-text)}
@keyframes spin{to{transform:rotate(360deg)}}
@keyframes packet{from{stroke-dashoffset:100}to{stroke-dashoffset:0}}
@keyframes scan{0%{transform:translateY(-46px);opacity:0}15%{opacity:1}85%{opacity:1}100%{transform:translateY(330px);opacity:0}}
@keyframes hp{0%{opacity:.14}1%{opacity:.9}88%{opacity:.9}89%{opacity:.14}}

/* Metrics as a HUD readout. */
.metrics strong{background:linear-gradient(180deg,#fff,#d8e9c6);-webkit-background-clip:text;background-clip:text;color:transparent}.metrics strong span{-webkit-text-fill-color:var(--lime)}

/* Corner brackets on profile cards. */
.corners{position:absolute;inset:10px;pointer-events:none;z-index:2;
  background:linear-gradient(var(--lime),var(--lime)) top left/14px 1.5px,linear-gradient(var(--lime),var(--lime)) top left/1.5px 14px,linear-gradient(var(--lime),var(--lime)) top right/14px 1.5px,linear-gradient(var(--lime),var(--lime)) top right/1.5px 14px,linear-gradient(var(--lime),var(--lime)) bottom left/14px 1.5px,linear-gradient(var(--lime),var(--lime)) bottom left/1.5px 14px,linear-gradient(var(--lime),var(--lime)) bottom right/14px 1.5px,linear-gradient(var(--lime),var(--lime)) bottom right/1.5px 14px;background-repeat:no-repeat;opacity:.55}
.profile-card .catalog-icon{font-weight:650;color:#0b0d06;background:linear-gradient(160deg,var(--lime),var(--lime-deep));border-color:#e9ffc0;box-shadow:0 0 0 6px #aeed2e1a,0 12px 30px #aeed2e2b}

/* Offer card illustrations. */
.game-graphic{height:170px;margin:12px -6px 4px}.game-graphic:before{width:160px;height:80px;background:radial-gradient(var(--lime-deep),var(--violet));opacity:.2;filter:blur(36px)}
.game-graphic svg{width:100%;max-width:300px;height:auto;overflow:visible}.game-graphic text{font-family:Inter,Arial,sans-serif}
.game-graphic .blink{animation:blink 2s ease-in-out infinite}
.game-graphic .spark-sm{transform-box:fill-box;transform-origin:center;filter:drop-shadow(0 0 6px #fff) drop-shadow(0 0 14px #aeed2e99);animation:twinkle 3.2s ease-in-out infinite}
.game-graphic .slot-hot{fill:#c3f562;fill-opacity:.12;filter:drop-shadow(0 0 8px #aeed2e66);animation:slot 2.4s ease-in-out infinite}
.game-graphic .dash-flow{animation:dash 1s linear infinite}
.game-graphic .pulse-core{filter:drop-shadow(0 0 10px #aeed2e55);animation:core 2.4s ease-in-out infinite}
@keyframes slot{50%{fill-opacity:.24}}
@keyframes dash{to{stroke-dashoffset:-12}}
@keyframes core{50%{filter:drop-shadow(0 0 18px #a855f780)}}
.offer-card:hover{border-color:#c3f5628c;box-shadow:var(--glass-shadow),0 0 36px #aeed2e14,0 0 60px #a855f70f}

/* Model flow as a level track. */
.model-flow li{background:linear-gradient(90deg,var(--lime),var(--violet)) top left/0 2px no-repeat,linear-gradient(125deg,#e7f4dc1a,#b8d6bc08);transition:background-size .5s ease}
.model-flow li:hover{background-size:100% 2px,auto}
.model-flow li:nth-child(1){background-size:100% 2px,auto}

/* Compliance standards as badges. */
.std-head{display:flex;align-items:center;justify-content:space-between}
.std-icon{display:grid;place-items:center;width:46px;height:46px;border-radius:14px;color:var(--lime);border:1px solid #c3f56255;background:radial-gradient(circle at 30% 20%,#aeed2e2a,transparent 70%),linear-gradient(140deg,#f0ffd420,#a855f710);box-shadow:inset 0 1px 0 #ffffff40,0 10px 24px #0004}
.compliance-grid article:nth-child(even) .std-icon{color:var(--violet-text);border-color:#c69cff55;background:radial-gradient(circle at 30% 20%,#a855f733,transparent 70%),linear-gradient(140deg,#f0ffd418,#a855f714)}
.std-icon svg,.step-orbit svg,.catalog-icon svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.step-orbit svg circle[r=".9"]{fill:currentColor;stroke:none}
.std-head .number{width:auto;height:auto;border:0;background:none;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none;font-size:9px;color:#8fa385}
.compliance-grid article{transition:border-color .25s,box-shadow .25s}.compliance-grid article:hover{border-color:#c3f5627a;box-shadow:var(--glass-shadow),0 0 30px #aeed2e12}
.not-list li:before{color:#ff8a80}

/* Workflow stages. */
.step-orbit{color:var(--lime)}.workflow-step:nth-child(even) .step-orbit{color:var(--violet-text);border-color:#c69cff55}
.step-label{color:var(--lime)}

/* Product card as an in-game item tooltip. */
.item-card{border-color:#a855f75c;box-shadow:var(--glass-shadow),0 0 50px #a855f714}
.item-card:before{content:'';position:absolute;inset:0 0 auto;height:3px;width:auto;border:0;border-radius:0;box-shadow:none;background:linear-gradient(90deg,var(--lime),var(--violet));top:0;right:0}
.item-card .rarity{color:var(--violet-text)}
.item-card .catalog-icon{color:var(--violet-text);border-color:#c69cff66;background:linear-gradient(140deg,#a855f726,#a855f708)}
.item-card .spec-row dd{font-family:var(--mono);font-size:11px}

/* Banner. */
.partner-banner{border-color:#c3f5624d;overflow:hidden}

@media(max-width:760px){.dots-form{left:0;top:40%}.dots-top{height:520px}.game-graphic{height:150px}.spark{margin-bottom:.3em}}
@media(prefers-reduced-motion:reduce){.dot-field,.spark,.live,.hero .eyebrow i,.hero .button,.hud-svg .ring,.hud-svg .packets path,.hud-svg .scan,.hp-bar rect,.game-graphic *{animation:none!important}.hud-svg .scan{opacity:0}.hp-bar rect{opacity:.85}}
.metrics>.dot-field{display:block}
.spark{filter:drop-shadow(0 0 3px #ffffffb3) drop-shadow(0 0 12px #aeed2e80)}
.step-orbit svg{width:26px;height:26px}
.dots-banner{opacity:.3}

/* Headline rhythm: proportional tracking, relaxed serif accents. */
.hero{align-items:center}
.hero h1{font-size:clamp(56px,6vw,86px);letter-spacing:-.035em;line-height:1.02;margin:0 0 30px}
.hero h1 em{display:inline-block;font-size:1.07em;letter-spacing:-.005em;word-spacing:.03em;line-height:1.02;margin-top:.04em;padding-right:.04em}
h2{letter-spacing:-.032em;line-height:1.04}
h2 em{display:inline-block;font-size:1.06em;letter-spacing:-.004em;word-spacing:.03em;line-height:1.04;margin-top:.06em;padding-right:.04em}
.intro h2,.catalog-copy h2,.contact-grid h2{margin:0}
.catalog-copy>p{margin-top:28px}
.spark{margin:0 0 .5em .14em}
@media(max-width:1100px){.hero h1{font-size:clamp(48px,6.4vw,66px)}}
@media(max-width:760px){.hero h1{font-size:clamp(42px,11.5vw,62px);margin-bottom:24px}.hero h1 em{font-size:1.06em;letter-spacing:-.005em}h2 em{font-size:1.05em}}

/* Transparent mark next to the wordmark. */
.brand img{width:38px;height:38px;margin-right:2px}footer .brand img{width:34px;height:34px}
@media(max-width:720px){.brand img{width:32px;height:32px}}
