body.splash-active{overflow:hidden}
.brand-scroll-progress{position:fixed;z-index:250;top:0;left:0;width:100%;height:4px;pointer-events:none;background:transparent;opacity:1;transition:opacity 180ms ease}
.splash-active .brand-scroll-progress{opacity:0}
.brand-scroll-progress span{display:block;width:100%;height:100%;background:linear-gradient(90deg,#1937f7 0%,#5168ff 58%,#fec70b 100%);box-shadow:0 0 12px #1937f780;transform:scaleX(0);transform-origin:left center;will-change:transform}
.site-splash{position:fixed;inset:0;z-index:200;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:22px;background:radial-gradient(120% 90% at 70% 10%,#1b2fb0 0%,#0b1230 55%,#05081c 100%);opacity:1;transition:opacity 480ms ease;contain:layout paint}
.site-splash.is-leaving{opacity:0;pointer-events:none}
.site-splash-logo{display:block;width:min(320px,62vw);height:auto;object-fit:contain;opacity:0;transform:translateY(8px) scale(.98);transition:opacity 480ms ease,transform 650ms cubic-bezier(.2,.8,.2,1)}
.site-splash-tagline{margin:0;color:#aab1d4;font-size:11px;font-weight:700;letter-spacing:4px;line-height:1;text-indent:4px;opacity:0;transform:translateY(5px);transition:opacity 420ms ease 140ms,transform 520ms ease 140ms}
.site-splash-track{width:min(240px,62vw);height:3px;border-radius:3px;background:#ffffff1f;overflow:hidden}
.site-splash-bar{display:block;width:100%;height:100%;border-radius:inherit;background:linear-gradient(90deg,#1937f7,#fec70b);transform:scaleX(0);transform-origin:left;transition:transform 1350ms cubic-bezier(.4,0,.2,1)}
.site-splash.is-running .site-splash-logo,.site-splash.is-running .site-splash-tagline{opacity:1;transform:none}
.site-splash.is-running .site-splash-bar{transform:scaleX(1)}
.footer-brand img[src="./upgo-logo-light.svg"]{filter:none}
section[id]{scroll-margin-top:110px}
.ticker-track{animation:ticker 42s linear infinite}
.ticker-track.ticker-ready{animation:ticker-loop var(--ticker-duration,45s) linear infinite;will-change:transform}
.ticker:hover .ticker-track,.ticker:focus-within .ticker-track{animation-play-state:paused}
@keyframes ticker-loop{from{transform:translateX(0)}to{transform:translateX(var(--ticker-distance,-1800px))}}
@media(prefers-reduced-motion:reduce){.ticker{overflow-x:auto}.ticker-track.ticker-ready{animation:none!important;transform:none;will-change:auto}.ticker-track>[aria-hidden=true]{display:none}}
/* Layered brand lighting, confined to the Top Offers section. */
.offers{position:relative;isolation:isolate;background:radial-gradient(ellipse at 4% 18%,#1937f759 0,transparent 48%),radial-gradient(ellipse at 95% 72%,#1937f747 0,transparent 44%),radial-gradient(ellipse at 70% 0%,#536bff24 0,transparent 38%),linear-gradient(135deg,#101a40 0%,#080c1e 48%,#121b3c 100%)}
.offers::before{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(115deg,transparent 20%,#8198ff0c 36%,transparent 52%),radial-gradient(ellipse at 90% 0%,#fec70b0b,transparent 30%);box-shadow:inset 0 1px #a9b7ff25,inset 0 90px 100px -80px #0009,inset 0 -90px 100px -70px #000b}
.offers::after{content:'';position:absolute;inset:0;z-index:0;pointer-events:none;opacity:var(--offer-glow-opacity,0);background:radial-gradient(circle 430px at var(--offer-glow-x,50%) var(--offer-glow-y,50%),rgba(55,100,255,.22),transparent 68%),radial-gradient(circle 190px at var(--offer-glow-x,50%) var(--offer-glow-y,50%),rgba(254,199,11,.08),transparent 72%);transition:opacity .32s ease}
.offers>.section-shell{position:relative;z-index:1}
.offers .offer-carousel{border-color:#b6c4ff36;box-shadow:0 32px 70px -22px #000b,0 0 65px -25px #1937f780,inset 0 1px #ffffff18}
.offers .offer-carousel{border:0;border-radius:0;overflow:visible;box-shadow:none}
.offers .offer-stage{overflow:hidden;border:1px solid #b6c4ff36;border-radius:24px;background:linear-gradient(108deg,#1e3266 0%,#15284f 38%,#0d1938 58%,#080e22 100%);box-shadow:0 32px 70px -22px #000b,0 0 65px -25px #1937f780,inset 0 1px #ffffff18}
.offers .offer-image-wrap{background:radial-gradient(ellipse at 43% 38%,#496dff52 0%,#21408f35 34%,transparent 72%),radial-gradient(ellipse at 58% 96%,#fec70b10 0,transparent 48%);box-shadow:none}
.offers .offer-image-wrap::before{opacity:.6;mask-image:radial-gradient(ellipse at 45% 40%,#000,transparent 80%)}
.offers .offer-image-wrap::after{display:none}
.offers .carousel-controls{min-height:68px;margin-top:14px;padding:0 4px;background:transparent;border-top:0}
a:focus-visible,button:focus-visible{outline:3px solid #fec70b;outline-offset:5px}
.hero .eyebrow{color:#fff}
.reveal-ready{opacity:0;translate:0 25px;transition:opacity .65s ease,translate .65s cubic-bezier(.2,.7,.2,1);transition-delay:var(--reveal-delay,0ms)}
.reveal-ready.is-visible{opacity:1;translate:0 0}
.hero-visual{translate:var(--hero-x,0px) var(--hero-y,0px);transition:translate .3s ease-out}
.button span{transition:transform .25s}.button:hover span{transform:translate(3px,-3px)}
.desktop-nav a{position:relative}.desktop-nav a:after{content:'';position:absolute;bottom:-10px;left:0;right:0;height:2px;background:#1937f7;transform:scaleX(0);transform-origin:left;transition:transform .25s}.desktop-nav a[aria-current]:after{transform:scaleX(1)}
.advantage-grid article{position:relative;overflow:hidden}.advantage-grid article:after{content:'';position:absolute;bottom:0;left:0;height:3px;width:100%;background:#1937f7;transform:scaleX(0);transform-origin:left;transition:transform .3s}.advantage-grid article:hover:after{transform:scaleX(1)}

/* UPGO advantage cards — branded icon system, pills and richer hover depth */
.advantage-grid article{isolation:isolate;transition:transform .32s cubic-bezier(.2,.8,.2,1),background .32s,border-color .32s,box-shadow .32s}
.advantage-grid article:before{content:'';position:absolute;z-index:-1;width:180px;height:180px;right:-75px;bottom:-95px;border-radius:50%;background:radial-gradient(circle,rgba(25,55,247,.18),rgba(25,55,247,0) 70%);opacity:0;transform:scale(.65);transition:opacity .35s,transform .45s cubic-bezier(.2,.8,.2,1)}
.advantage-grid article:nth-child(even):before{background:radial-gradient(circle,rgba(254,199,11,.3),rgba(254,199,11,0) 70%)}
.advantage-grid article:hover{background:linear-gradient(135deg,#eef1ff 0%,#fafbff 58%,#fff5c9 100%);border-color:rgba(25,55,247,.34);box-shadow:0 22px 48px rgba(25,55,247,.13);transform:translateY(-7px)}
.advantage-grid article:nth-child(even):hover{background:linear-gradient(135deg,#fff2b8 0%,#fffdf3 55%,#eef1ff 100%)}
.advantage-grid article:hover:before{opacity:1;transform:scale(1)}
.advantage-grid article:after{height:4px;background:linear-gradient(90deg,#1937f7 0%,#5168ff 58%,#fec70b 100%)}
.card-top{position:relative;z-index:1;align-items:center}
.card-top b{display:inline-flex;align-items:center;gap:7px;color:#fff;background:linear-gradient(90deg,#1937f7 0%,#536bff 100%);padding:7px 12px;border-radius:999px;box-shadow:0 7px 18px rgba(25,55,247,.18);transition:transform .3s,box-shadow .3s}
.card-top b:before{content:'';width:5px;height:5px;border-radius:50%;background:#fec70b;box-shadow:0 0 0 3px rgba(254,199,11,.18)}
.advantage-grid article:nth-child(even) .card-top b{color:#182357;background:linear-gradient(90deg,#fec70b 0%,#ffdc61 100%);box-shadow:0 7px 18px rgba(254,199,11,.18)}
.advantage-grid article:nth-child(even) .card-top b:before{background:#1937f7;box-shadow:0 0 0 3px rgba(25,55,247,.12)}
.advantage-icon{position:relative;z-index:1;display:grid;place-items:center;width:54px;height:54px;margin-top:32px;border-radius:16px;color:#fff;background:linear-gradient(135deg,#1937f7 0%,#536bff 100%);box-shadow:0 13px 28px rgba(25,55,247,.22);transition:transform .36s cubic-bezier(.2,.8,.2,1),box-shadow .36s}
.advantage-icon:after{content:'';position:absolute;width:12px;height:12px;right:-3px;top:-3px;border-radius:50%;background:#fec70b;border:3px solid #fff}
.advantage-icon svg{width:28px;height:28px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.advantage-grid article:nth-child(even) .advantage-icon{color:#1937f7;background:linear-gradient(135deg,#fec70b 0%,#ffdc61 100%);box-shadow:0 13px 28px rgba(254,199,11,.25)}
.advantage-grid article:nth-child(even) .advantage-icon:after{background:#1937f7}
.advantage-grid h3{position:relative;z-index:1;margin-top:23px;transition:color .3s,transform .3s}
.advantage-grid article>p{position:relative;z-index:1;transition:color .3s}
.advantage-grid article:hover .advantage-icon{transform:translateY(-4px) rotate(-3deg) scale(1.06);box-shadow:0 18px 32px rgba(25,55,247,.27)}
.advantage-grid article:nth-child(even):hover .advantage-icon{transform:translateY(-4px) rotate(3deg) scale(1.06);box-shadow:0 18px 32px rgba(254,199,11,.31)}
.advantage-grid article:hover .card-top b{transform:translateY(-2px);box-shadow:0 10px 22px rgba(25,55,247,.24)}
.advantage-grid article:hover h3{color:#1937f7;transform:translateY(-2px)}
.advantage-grid article:hover>p{color:#303a64}

@media (max-width:640px){.advantage-icon{margin-top:26px}.advantage-grid h3{margin-top:20px}}
.insight-card{transition:transform .3s,box-shadow .3s}.insight-card:hover{transform:translateY(-7px);box-shadow:0 18px 35px #10132220}
.event-controls{display:flex;gap:8px;align-items:center;margin-top:18px}.event-controls button{border:1px solid #1937f740;background:transparent;color:#1937f7;border-radius:8px;min-width:44px;min-height:44px;cursor:pointer;font-weight:700}.event-controls button[aria-pressed=true]{background:#1937f7;color:#fff}.event-controls .event-pause{margin-left:6px;padding:0 12px;font-size:12px}
.event-banner{min-height:295px}.event-copy h2{min-height:2.3em}.event-copy p{min-height:3.2em}.event-copy.content-enter{animation:event-enter .4s ease}.event-label span:last-child{align-self:center}.event-art>span{transition:transform .4s}.event-banner:hover .event-art>span{transform:rotate(0deg) scale(1.08)}
@keyframes event-enter{from{opacity:.5;translate:0 7px}to{opacity:1;translate:0 0}}
.offer-stage{touch-action:pan-y}.ticker:focus-within .ticker-track{animation-play-state:paused}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.reveal-ready{opacity:1;translate:none}.hero-visual{translate:none}.insight-card:hover{transform:none}}
@media(prefers-reduced-motion:reduce){.site-splash-logo,.site-splash-tagline{opacity:1;transform:none}.site-splash-bar{transform:scaleX(1)}}
/* Ticker is explicitly requested to stay live, even when OS motion is reduced. */
@media(prefers-reduced-motion:reduce){.ticker{overflow:hidden}.ticker .ticker-track.ticker-ready{animation:ticker-loop var(--ticker-duration,45s) linear infinite!important;will-change:transform}.ticker .ticker-track:not(.ticker-ready){animation:ticker 60s linear infinite!important}.ticker .ticker-track>[aria-hidden=true]{display:flex}}
.ticker:hover .ticker-track,.ticker:focus-within .ticker-track{animation-play-state:paused!important}

/* Smooth crossfade between autoplaying offers. */
.offer-image-wrap img,.rank-watermark,.offer-info>*{opacity:1;transform:translateY(0);transition:opacity .34s ease,transform .42s cubic-bezier(.2,.7,.2,1)}
.offer-info>*:nth-child(2){transition-delay:.025s}.offer-info>*:nth-child(3){transition-delay:.05s}.offer-info>*:nth-child(4){transition-delay:.075s}.offer-info>*:nth-child(5){transition-delay:.1s}
.offer-stage.is-switching .offer-image-wrap img,.offer-stage.is-switching .rank-watermark,.offer-stage.is-switching .offer-info>*{opacity:0;transform:translateY(9px);transition-delay:0s}
@media(prefers-reduced-motion:reduce){.offer-image-wrap img,.rank-watermark,.offer-info>*{transition:opacity .34s ease,transform .42s cubic-bezier(.2,.7,.2,1)!important}}

/* Compact event banner + audience-specific entry points. */
.hero-actions>.button:first-child{background:#fec70b;border-color:#fec70b;color:#101322;box-shadow:0 8px 24px #0002}
.hero-actions>.button:first-child:hover{background:#ffdc61;border-color:#ffdc61;box-shadow:0 12px 30px #fec70b44}
.process-line>span:last-child{color:#fec70b;background:#fec70b16;border:1px solid #fec70b66;border-radius:8px;padding:9px 13px;margin-block:-10px}
.process-line>span:last-child b{color:#fec70b}
.advantages .section-heading h2{font-size:clamp(38px,4.2vw,60px);letter-spacing:-.055em}
.advantages .section-heading .heading-line{white-space:nowrap}
.advantages .section-heading h2 em,.insights .section-heading h2 em{color:#1937f7;background:linear-gradient(90deg,#122994,#1937f7 55%,#3563c9);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent}
@media(max-width:760px){.advantages .section-heading h2{font-size:clamp(24px,7vw,34px)}}
.event-banner{min-height:220px;grid-template-columns:1.45fr .55fr}
.event-copy{padding:27px 36px;max-width:870px}
.event-copy h2{min-height:0;font-size:clamp(25px,2.15vw,34px);margin:12px 0 7px;line-height:1.08}
.event-copy p{min-height:0;max-width:720px;margin:0 0 9px;font-size:14px;line-height:1.5}
.event-art{min-height:220px}
.event-art>span{font-size:96px}
.event-controls{position:absolute;right:28px;bottom:22px;z-index:3;margin:0}
.event-controls button.event-dot{min-width:28px;min-height:28px;width:28px;height:28px;padding:0;border:0;background:transparent;display:grid;place-items:center}
.event-controls .event-dot:before{content:'';width:7px;height:7px;border-radius:99px;background:#1937f74d;transition:width .25s,background .25s}
.event-controls .event-dot[aria-pressed=true]:before{width:20px;background:#1937f7}
.event-controls{gap:0}
.event-controls .event-pause{min-height:36px}
.audience-actions{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:14px;margin-bottom:24px}
.audience-card{min-height:108px;padding:20px 24px 20px 28px;border:1px solid #e0e4f0;border-radius:18px;display:flex;align-items:center;justify-content:space-between;gap:22px;overflow:hidden;position:relative;transition:transform .28s,box-shadow .28s,border-color .28s}
.audience-card:before{content:'';position:absolute;width:170px;height:170px;border-radius:50%;right:-90px;top:-105px;background:radial-gradient(circle,rgba(25,55,247,.13),transparent 68%);pointer-events:none}
.audience-card:hover{transform:translateY(-4px);box-shadow:0 16px 34px rgba(25,55,247,.12);border-color:rgba(25,55,247,.28)}
.audience-card p{margin:0 0 5px;font:700 11px/1.2 "Space Grotesk",sans-serif;letter-spacing:.13em;color:#1937f7}
.audience-card h2{margin:0;font:650 clamp(19px,1.55vw,24px)/1.15 "Space Grotesk",sans-serif;letter-spacing:-.035em}
.audience-brand{background:linear-gradient(110deg,#f4f6ff 0%,#fff 62%,#fff9df 100%)}
.audience-publisher{color:#fff;border-color:#263dbe;background:radial-gradient(circle at 84% 20%,rgba(83,107,255,.55),transparent 38%),linear-gradient(115deg,#101a43 0%,#1937f7 145%)}
.audience-publisher:before{background:radial-gradient(circle,rgba(254,199,11,.16),transparent 68%)}
.audience-publisher p{color:#fec70b}
.audience-button{position:relative;z-index:1;flex:0 0 auto;min-height:50px;padding:0 20px;border-radius:12px;display:inline-flex;align-items:center;gap:10px;background:#111a51;color:#fff;font:700 13px/1 "Space Grotesk",sans-serif;transition:transform .25s,background .25s,box-shadow .25s}
.audience-publisher .audience-button{background:#fff;color:#11152d}
.audience-button:hover{transform:translateY(-2px);background:#1937f7;box-shadow:0 10px 24px rgba(25,55,247,.22)}
.audience-publisher .audience-button:hover{background:#fec70b;color:#11152d}
.audience-button span{transition:transform .25s}.audience-button:hover span{transform:translate(2px,-2px)}
.audience-actions .audience-card{min-height:82px;padding:14px 20px;gap:14px;border-radius:14px;align-items:center}
.audience-actions .audience-button{min-height:42px;padding:0 16px}
.audience-actions .audience-card h2{font-size:20px}
@media(max-width:420px){.audience-actions .audience-card{flex-wrap:wrap}.audience-actions .audience-card h2{font-size:19px}}
@media(max-width:760px){.event-banner{min-height:0}.event-copy{padding:24px 22px 78px}.event-copy h2{font-size:27px}.event-copy p{font-size:14px}.event-controls{left:22px;right:auto;bottom:20px}.audience-actions{grid-template-columns:1fr;gap:10px;margin-bottom:14px}.audience-card{min-height:116px;padding:20px;align-items:flex-end}.audience-card h2{font-size:20px}.audience-button{min-height:44px;padding:0 14px;font-size:12px}}

/* Editorial event slider: compact copy, full visual, persistent navigation. */
.hero-symbol{position:absolute;left:50%;top:48%;width:clamp(230px,25vw,350px);transform:translate(-50%,-50%);transform-style:preserve-3d;perspective:1100px;isolation:isolate}
.hero-symbol:before{content:none}
.hero-symbol .u-stage{position:relative;width:100%;aspect-ratio:272/312;transform-style:preserve-3d;animation:u-stage-float 10s cubic-bezier(.45,.05,.55,.95) infinite;will-change:transform}
.hero-symbol img{display:block;width:100%;height:100%;object-fit:contain;backface-visibility:hidden}
.hero-symbol .u-stage:after{content:none}
@keyframes u-halo{0%,100%{opacity:.65;transform:scale(.95)}50%{opacity:1;transform:scale(1.08)}}
@keyframes u-sheen{0%,20%{background-position:150% 0;opacity:0}35%,65%{opacity:.55}80%,100%{background-position:-50% 0;opacity:0}}
.event-banner{grid-template-columns:1.1fr 1fr;min-height:260px;background:radial-gradient(ellipse at 5% 0%,#1937f744,transparent 65%),#101a40;color:#fff;border:1px solid #536bff44;isolation:isolate}
.event-banner .event-copy{padding:28px 10px 28px 34px;max-width:none;align-self:center;min-width:0}
.event-banner .event-label{font-size:12px;color:#fec70b}
.event-banner .event-label span:first-child{background:#fec70b19;border:1px solid #fec70b66;border-radius:999px;color:#fec70b;padding:5px 11px}
.event-banner .event-copy h2{font-size:clamp(26px,2.65vw,35px);line-height:1.12;letter-spacing:-.035em;margin:13px 0 10px;min-height:0;text-wrap:balance}
.event-banner .event-copy p{font-size:16px;line-height:1.5;color:#c7d0ee;max-width:none;min-height:0;margin:0 0 16px;text-wrap:pretty}
.event-banner .text-link{display:inline-flex;align-items:center;gap:12px;color:#101a40;background:#fec70b;padding:10px 17px;border-radius:9px;font-size:14px;transition:background .2s,box-shadow .2s}
.event-banner .text-link:hover{background:#ffdc61;box-shadow:0 6px 22px #fec70b33}
.event-banner .event-art{display:block;position:relative;min-height:260px;align-self:stretch;overflow:hidden;mask-image:linear-gradient(90deg,transparent,#000 16%)}
.event-visual{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transform:translateX(24px) scale(1.06);filter:blur(4px);transition:opacity .65s ease,transform .8s cubic-bezier(.16,1,.3,1),filter .65s ease}
.event-visual.is-active{opacity:1;transform:translateX(0) scale(1);filter:blur(0)}
.event-banner .event-controls{left:auto;right:22px;bottom:14px;gap:3px;padding:4px 8px;background:#0a1038b3;backdrop-filter:blur(12px);border:1px solid #ffffff26;border-radius:999px}
.event-controls button.event-arrow{width:36px;height:36px;min-width:36px;min-height:36px;border:1px solid #ffffff40;border-radius:50%;background:#ffffff0d;color:#fff;font:400 28px/1 sans-serif;display:grid;place-items:center;padding:0;cursor:pointer}
.event-controls button.event-arrow:hover{background:#fec70b;color:#101a40;border-color:#fec70b}
.event-banner .event-dot:before{background:#ffffff66}
.event-banner .event-dot[aria-pressed=true]:before{background:#fec70b}
@media(max-width:760px){.event-banner{grid-template-columns:1.2fr 1fr}.event-banner .event-copy{padding:24px 8px 24px 22px}.event-banner .event-copy h2{font-size:26px}.event-banner .event-copy p{font-size:14px}.event-banner .event-art{min-height:280px}.event-banner .event-controls{right:12px;bottom:12px}}
@media(max-width:520px){.event-banner{grid-template-columns:1fr}.event-banner .event-copy{padding:24px 22px 12px}.event-banner .event-copy h2{min-height:2.24em}.event-banner .event-art{min-height:185px;mask-image:linear-gradient(180deg,transparent,#000 14%)}.event-visual{object-fit:contain}.event-banner .event-controls{right:14px;bottom:12px}}
@media(prefers-reduced-motion:reduce){.event-banner .event-visual{transform:none;filter:none;transition:opacity .3s ease!important}}
@media(min-width:761px){.event-banner{grid-template-columns:1.3fr 1fr}}
@media(max-width:520px){.event-banner .event-copy h2{min-height:0}}

/* Centered navigation icons and a lightweight layered 3D brand symbol. */
.event-controls .event-arrow svg{display:block;width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.hero-symbol .u-layer{position:absolute;inset:0;transform-style:preserve-3d}
.hero-symbol .layer-01{transform:translateZ(30px);opacity:1;filter:none}
.hero-symbol .layer-02{transform:translateZ(20px);opacity:.96;filter:none}
.hero-symbol .layer-03{transform:translateZ(10px);opacity:1;filter:none}
.hero-symbol .layer-04{transform:translateZ(0);opacity:.96;filter:none}
.hero-symbol .layer-05{transform:translateZ(-10px);opacity:1;filter:none}
.hero-symbol .layer-06{transform:translateZ(-20px);opacity:.94;filter:none}
.hero-symbol .layer-07{transform:translateZ(-30px);opacity:.78;filter:none}
@keyframes u-stage-float{0%{transform:translate3d(0,5px,0) rotateX(4deg) rotateY(-18deg)}50%{transform:translate3d(0,-7px,0) rotateX(-4deg) rotateY(18deg)}100%{transform:translate3d(0,5px,0) rotateX(4deg) rotateY(-18deg)}}
@media(prefers-reduced-motion:reduce){.hero-symbol .u-stage{animation:none;transform:rotateX(1deg) rotateY(4deg)}}
.insight-card{padding:0 24px 24px;min-height:460px}
.insight-card:after{display:none}
.insight-thumb{margin:0 -24px 22px;aspect-ratio:16/9;overflow:hidden;flex-shrink:0;background:#101a40}
.insight-thumb img{width:100%;height:100%;display:block;object-fit:cover;transition:transform .55s cubic-bezier(.2,.7,.2,1)}
.insight-card:hover .insight-thumb img{transform:scale(1.045)}
.insight-card>span{font-size:12px;margin-bottom:18px}
.insight-card>div{margin-top:0;flex:1}
.insight-card h3{font-size:24px;margin-bottom:24px}
.offer-info .metrics{gap:10px}
.offer-info{background:transparent;color:#fff;border-left:0;box-shadow:none}
.offer-info h3{color:#fec70b}
.offer-info .offer-tags span{background:rgba(91,115,255,.16);color:#91a2ff;border:1px solid rgba(91,115,255,.2)}
.offer-info .offer-tags span:last-child{background:#fec70b;color:#101322;border-color:#fec70b}
.offer-info .demo-label,.offer-info .metrics small{color:rgba(255,255,255,.5)}
.offer-info .metrics>div{min-height:92px;justify-content:center;padding:13px 14px;border:1px solid rgba(255,255,255,.12);border-radius:12px;background:rgba(255,255,255,.045)}
.offer-info .metrics>div{transition:transform .25s ease,background .25s ease,border-color .25s ease,box-shadow .25s ease}
.offer-info .metrics>div:nth-child(1){background:rgba(91,115,255,.1);border-color:rgba(109,131,255,.3)}
.offer-info .metrics>div:nth-child(2){background:rgba(255,138,36,.09);border-color:rgba(255,138,36,.3)}
.offer-info .metrics>div:nth-child(1):hover{transform:translateY(-3px);background:rgba(91,115,255,.19);border-color:rgba(126,148,255,.72);box-shadow:0 12px 28px rgba(55,86,255,.2),inset 0 0 22px rgba(91,115,255,.09)}
.offer-info .metrics>div:nth-child(2):hover{transform:translateY(-3px);background:rgba(255,138,36,.17);border-color:rgba(255,151,66,.7);box-shadow:0 12px 28px rgba(255,117,24,.17),inset 0 0 22px rgba(255,138,36,.08)}
.offer-info .metrics>div:nth-child(3):hover{transform:translateY(-3px);background:rgba(254,199,11,.1);border-color:rgba(254,199,11,.55);box-shadow:0 12px 28px rgba(254,199,11,.13),inset 0 0 22px rgba(254,199,11,.06)}
.offer-stage:not(.is-switching) .offer-image-wrap:hover img{transform:translateY(-3px) scale(1.035)}
.offer-info .metrics strong{font-family:"Space Grotesk",sans-serif;font-size:clamp(25px,2.1vw,31px);font-weight:700;line-height:1;letter-spacing:-.045em;color:#fff;white-space:nowrap}
.offer-info #offer-payout{color:#91a6ff}
.offer-info #offer-ar{color:#ff8a24}
.offer-info .geo-flag{display:block;width:46px;height:31px;object-fit:cover;border-radius:5px;box-shadow:0 0 0 1px rgba(255,255,255,.22)}
.insight-card small,.insight-card button{font-size:12px}
.hero .signal-card{background:rgba(10,18,55,.82);border-color:rgba(255,255,255,.28);box-shadow:0 12px 30px rgba(3,8,35,.28);backdrop-filter:blur(8px)}
.hero .signal-card small{color:rgba(255,255,255,.78);font-weight:700}
.hero .signal-card strong{color:#fff;text-shadow:0 1px 10px rgba(0,0,0,.22)}
@media(max-width:760px){.insight-card{min-height:0}.insight-card h3{font-size:25px}}

/* Mobile event card: tighter copy, larger full-bleed art, unobstructed controls. */
@media(max-width:520px){
  .event-banner{
    border-radius:22px;
    background:
      radial-gradient(circle at 12% 2%,rgba(57,88,255,.34),transparent 42%),
      linear-gradient(155deg,#17275f 0%,#10183f 58%,#0b1234 100%);
    box-shadow:0 18px 42px rgba(12,25,72,.18);
  }
  .event-banner .event-copy{padding:22px 20px 8px}
  .event-banner .event-label{font-size:10px;letter-spacing:.14em}
  .event-banner .event-label span:first-child{padding:4px 10px}
  .event-banner .event-copy h2{
    max-width:17ch;
    margin:14px 0 10px;
    font-size:clamp(27px,8vw,32px);
    line-height:1.08;
    letter-spacing:-.04em;
    text-wrap:balance;
  }
  .event-banner .event-copy p{
    margin:0 0 16px;
    font-size:15px;
    line-height:1.5;
    text-wrap:pretty;
  }
  .event-banner .text-link{
    min-height:46px;
    padding:0 18px;
    border-radius:12px;
    font-size:14px;
  }
  .event-banner .event-art{
    min-height:235px;
    margin-top:-4px;
    mask-image:linear-gradient(180deg,transparent 0,#000 18%,#000 100%);
  }
  .event-banner .event-art:after{
    content:"";
    position:absolute;
    inset:auto 0 0;
    height:66px;
    z-index:2;
    pointer-events:none;
    background:linear-gradient(180deg,transparent,rgba(6,12,43,.4));
  }
  .event-banner .event-visual{
    height:calc(100% + 22px);
    object-fit:cover;
    object-position:center 56%;
  }
  .event-banner .event-controls{
    left:50%;
    right:auto;
    bottom:14px;
    z-index:4;
    transform:translateX(-50%);
    gap:2px;
    padding:5px 8px;
    background:rgba(8,14,48,.78);
    border-color:rgba(255,255,255,.2);
    box-shadow:0 10px 26px rgba(0,0,0,.25);
  }
  .event-controls button.event-arrow{
    width:34px;
    height:34px;
    min-width:34px;
    min-height:34px;
  }
  .event-controls button.event-dot{
    width:24px;
    min-width:24px;
    min-height:34px;
  }
  .event-banner .event-dot[aria-pressed=true]:before{width:18px}
}

@media(max-width:380px){
  .event-banner .event-copy{padding-inline:18px}
  .event-banner .event-copy h2{font-size:26px}
  .event-banner .event-art{min-height:215px}
}

/* ==========================================================
   2. 3D Card Tilt (Audience cards only)
   ========================================================== */
.audience-card {
  transform-style: preserve-3d;
  transition: transform 0.22s cubic-bezier(0.2, 0.8, 0.2, 1), box-shadow 0.25s ease;
  will-change: transform;
}

.audience-card.has-tilt {
  transform: perspective(900px) rotateX(var(--card-rotate-x, 0deg)) rotateY(var(--card-rotate-y, 0deg)) scale3d(1.015, 1.015, 1.015);
  transition: none; /* smooth tracking during mousemove */
}

/* ==========================================================
   3. Offer GEO Filter & Title Actions
   ========================================================== */
.offer-geo-filter {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
  margin-bottom: 24px;
}

.filter-label {
  font-family: "Space Grotesk", sans-serif;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.12em;
  color: rgba(255, 255, 255, 0.5);
  margin-right: 4px;
}

.geo-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 15px;
  border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, 0.18);
  background: rgba(255, 255, 255, 0.05);
  color: rgba(255, 255, 255, 0.8);
  font-family: "Space Grotesk", sans-serif;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  backdrop-filter: blur(8px);
  transition: all 0.22s ease;
}

.geo-btn:hover {
  background: rgba(255, 255, 255, 0.14);
  color: #fff;
  border-color: rgba(255, 255, 255, 0.35);
  transform: translateY(-2px);
}

.geo-btn.is-active {
  background: #1937f7;
  color: #fff;
  border-color: #5168ff;
  box-shadow: 0 4px 18px rgba(25, 55, 247, 0.45);
}

.geo-mini-flag {
  border-radius: 3px;
  object-fit: cover;
  box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.2);
}

.offer-title-row {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
  margin-bottom: 36px;
}

.offer-title-row h3 {
  margin: 0 !important;
}

.copy-offer-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 12px;
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(255, 255, 255, 0.16);
  color: rgba(255, 255, 255, 0.78);
  font-family: "Space Grotesk", sans-serif;
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.2s ease;
}

.copy-offer-btn:hover {
  background: rgba(255, 255, 255, 0.18);
  color: #fff;
  border-color: rgba(255, 255, 255, 0.35);
  transform: translateY(-1px);
}

.copy-offer-btn.copied {
  background: #10b981;
  color: #fff;
  border-color: #10b981;
}

.offer-action-group {
  display: flex;
  align-items: center;
  gap: 14px;
  flex-wrap: wrap;
}

.button-outline-glass {
  background: rgba(255, 255, 255, 0.07);
  border: 1px solid rgba(255, 255, 255, 0.22);
  color: #fff;
  font-family: "Space Grotesk", sans-serif;
  font-size: 14px;
  font-weight: 600;
  min-height: 54px;
  padding: 0 20px;
  border-radius: 10px;
  cursor: pointer;
  transition: all 0.22s ease;
}

.button-outline-glass:hover {
  background: rgba(255, 255, 255, 0.16);
  border-color: rgba(255, 255, 255, 0.45);
  transform: translateY(-2px);
}

/* ==========================================================
   4. Floating AM Widget & Modal Sheet
   ========================================================== */
.am-float-pill {
  position: fixed;
  right: 24px;
  bottom: 24px;
  z-index: 95;
}

.am-float-btn {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 8px 18px 8px 10px;
  border-radius: 999px;
  background: linear-gradient(135deg, #10193d 0%, #172765 100%);
  border: 1px solid rgba(83, 107, 255, 0.4);
  box-shadow: 0 12px 36px rgba(10, 18, 55, 0.45), 0 0 20px rgba(25, 55, 247, 0.2);
  color: #fff;
  cursor: pointer;
  transition: transform 0.25s cubic-bezier(0.2, 0.8, 0.2, 1), box-shadow 0.25s ease;
}

.am-float-btn:hover {
  transform: translateY(-4px) scale(1.03);
  box-shadow: 0 16px 42px rgba(10, 18, 55, 0.55), 0 0 28px rgba(25, 55, 247, 0.35);
  border-color: rgba(254, 199, 11, 0.5);
}

.am-avatar-wrap {
  position: relative;
  width: 38px;
  height: 38px;
  border-radius: 50%;
  background: #1937f7;
  display: grid;
  place-items: center;
  color: #fff;
}

.am-online-dot {
  position: absolute;
  top: 1px;
  right: 1px;
  width: 10px;
  height: 10px;
  background: #10b981;
  border-radius: 50%;
  border: 2px solid #10193d;
}

.am-float-text {
  display: flex;
  flex-direction: column;
  text-align: left;
}

.am-float-text strong {
  font-family: "Space Grotesk", sans-serif;
  font-size: 13px;
  font-weight: 700;
  line-height: 1.2;
}

.am-float-text small {
  font-size: 11px;
  color: #c5cded;
}

.am-badge-ping {
  position: absolute;
  top: -3px;
  right: -3px;
  width: 12px;
  height: 12px;
  background: #fec70b;
  border-radius: 50%;
  animation: pulse-ping 2s cubic-bezier(0, 0, 0.2, 1) infinite;
}

@keyframes pulse-ping {
  0% { transform: scale(0.9); opacity: 1; }
  75%, 100% { transform: scale(2.2); opacity: 0; }
}

/* Modal Dialog */
body.modal-locked {
  overflow: hidden;
}

.am-modal-backdrop {
  position: fixed;
  inset: 0;
  z-index: 220;
  background: rgba(6, 10, 28, 0.72);
  backdrop-filter: blur(10px);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.28s ease;
}

.am-modal-backdrop.is-open {
  opacity: 1;
  pointer-events: auto;
}

.am-modal-dialog {
  width: min(480px, 100%);
  background: #0f1636;
  border: 1px solid rgba(83, 107, 255, 0.35);
  border-radius: 22px;
  box-shadow: 0 28px 70px rgba(0, 0, 0, 0.55), 0 0 50px rgba(25, 55, 247, 0.22);
  color: #fff;
  overflow: hidden;
  transform: translateY(20px) scale(0.97);
  transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}

.am-modal-backdrop.is-open .am-modal-dialog {
  transform: translateY(0) scale(1);
}

.am-modal-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 20px 24px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
  background: rgba(255, 255, 255, 0.02);
}

.am-header-profile {
  display: flex;
  align-items: center;
  gap: 14px;
}

.am-profile-avatar {
  position: relative;
  width: 44px;
  height: 44px;
  border-radius: 14px;
  background: linear-gradient(135deg, #1937f7, #536bff);
  display: grid;
  place-items: center;
  font-family: "Space Grotesk", sans-serif;
  font-weight: 800;
  font-size: 16px;
  letter-spacing: -0.02em;
}

.am-status-online {
  position: absolute;
  bottom: -2px;
  right: -2px;
  width: 12px;
  height: 12px;
  background: #10b981;
  border-radius: 50%;
  border: 2px solid #0f1636;
}

.am-header-profile h3 {
  margin: 0;
  font-family: "Space Grotesk", sans-serif;
  font-size: 17px;
  font-weight: 700;
}

.am-header-profile p {
  margin: 2px 0 0;
  font-size: 12px;
  color: #a2b0e6;
}

.am-close-btn {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.07);
  border: 1px solid rgba(255, 255, 255, 0.14);
  color: rgba(255, 255, 255, 0.7);
  font-size: 14px;
  cursor: pointer;
  display: grid;
  place-items: center;
  transition: all 0.2s ease;
}

.am-close-btn:hover {
  background: rgba(255, 255, 255, 0.18);
  color: #fff;
}

.am-modal-body {
  padding: 24px;
}

.am-modal-intro {
  margin: 0 0 18px;
  font-size: 14px;
  color: #c7d1f5;
  line-height: 1.5;
}

.am-option-link {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 16px;
  border-radius: 14px;
  background: linear-gradient(135deg, rgba(36, 161, 222, 0.16) 0%, rgba(25, 55, 247, 0.16) 100%);
  border: 1px solid rgba(36, 161, 222, 0.35);
  color: #fff;
  transition: all 0.22s ease;
}

.am-option-link:hover {
  background: linear-gradient(135deg, rgba(36, 161, 222, 0.28) 0%, rgba(25, 55, 247, 0.28) 100%);
  border-color: #24a1de;
  transform: translateY(-2px);
  box-shadow: 0 8px 24px rgba(36, 161, 222, 0.2);
}

.am-option-icon.tg-icon {
  width: 44px;
  height: 44px;
  border-radius: 12px;
  background: #24a1de;
  display: grid;
  place-items: center;
  color: #fff;
  flex-shrink: 0;
}

.am-option-info {
  display: flex;
  flex-direction: column;
  gap: 2px;
  flex: 1;
}

.am-option-info strong {
  font-family: "Space Grotesk", sans-serif;
  font-size: 15px;
}

.am-option-info span {
  font-size: 12px;
  color: #b9c7f2;
}

.am-arrow {
  font-size: 20px;
  color: #24a1de;
  font-weight: 700;
}

.am-copy-box {
  margin-top: 16px;
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 12px;
  padding: 12px 14px;
}

.am-copy-label {
  font-size: 11px;
  color: rgba(255, 255, 255, 0.5);
  font-weight: 600;
  display: block;
  margin-bottom: 6px;
}

.am-copy-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.am-copy-row code {
  font-family: "Space Grotesk", monospace;
  font-size: 15px;
  font-weight: 700;
  color: #fec70b;
}

.copy-handle-btn {
  padding: 5px 12px;
  border-radius: 6px;
  background: #1937f7;
  color: #fff;
  border: 0;
  font-family: "Space Grotesk", sans-serif;
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
  transition: background 0.2s;
}

.copy-handle-btn:hover {
  background: #3955ff;
}

.am-topics {
  margin-top: 18px;
}

.am-topics-label {
  display: block;
  font-size: 11px;
  font-family: "Space Grotesk", sans-serif;
  letter-spacing: 0.08em;
  color: rgba(255, 255, 255, 0.5);
  margin-bottom: 8px;
}

.am-topic-pills {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.topic-pill {
  border: 1px solid rgba(255, 255, 255, 0.16);
  background: rgba(255, 255, 255, 0.05);
  color: #d1dbfc;
  font-size: 12px;
  padding: 6px 12px;
  border-radius: 999px;
  cursor: pointer;
  transition: all 0.2s ease;
}

.topic-pill:hover {
  background: rgba(254, 199, 11, 0.15);
  border-color: rgba(254, 199, 11, 0.4);
  color: #fec70b;
}

.am-modal-footer {
  padding: 14px 24px;
  background: rgba(0, 0, 0, 0.2);
  border-top: 1px solid rgba(255, 255, 255, 0.08);
  font-size: 11px;
  color: rgba(255, 255, 255, 0.45);
  text-align: center;
}

@media (max-width: 640px) {
  .am-float-pill {
    right: 16px;
    bottom: 16px;
  }
  .am-float-text small {
    display: none;
  }
  .offer-action-group {
    flex-direction: column;
    align-items: stretch;
  }
  .offer-action-group .button,
  .offer-action-group .button-outline-glass {
    width: 100%;
    justify-content: center;
  }
}

/* ==========================================================
   Feature 6: Traffic Tags & Metric View Mode Toggle
   ========================================================== */
.offer-submeta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 12px;
  margin-bottom: 22px;
  padding-bottom: 14px;
  border-bottom: 1px dashed rgba(255, 255, 255, 0.12);
}

.traffic-tags-row {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}

.submeta-label {
  font-family: "Space Grotesk", sans-serif;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.12em;
  color: rgba(255, 255, 255, 0.45);
}

.traffic-tag {
  font-size: 12px;
  font-weight: 600;
  color: #ffdc61;
  background: rgba(254, 199, 11, 0.1);
  padding: 4px 10px;
  border-radius: 6px;
  border: 1px solid rgba(254, 199, 11, 0.25);
}

.metric-toggle-group {
  display: inline-flex;
  background: rgba(0, 0, 0, 0.25);
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 8px;
  padding: 3px;
  gap: 3px;
}

.metric-toggle-btn {
  border: 0;
  background: transparent;
  color: rgba(255, 255, 255, 0.6);
  font-family: "Space Grotesk", sans-serif;
  font-size: 11px;
  font-weight: 700;
  padding: 5px 10px;
  border-radius: 5px;
  cursor: pointer;
  transition: all 0.2s ease;
}

.metric-toggle-btn.is-active {
  background: #1937f7;
  color: #fff;
  box-shadow: 0 2px 8px rgba(25, 55, 247, 0.4);
}

.geo-metric-mini {
  display: flex;
  align-items: center;
  gap: 8px;
}

.geo-flag-mini {
  border-radius: 3px;
  box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.2);
}

/* ==========================================================
   Feature 1: Interactive Scale & Earnings Calculator
   ========================================================== */
.scale-calc-card {
  margin-top: 36px;
  background: linear-gradient(135deg, rgba(23, 39, 101, 0.75) 0%, rgba(13, 22, 58, 0.88) 100%);
  border: 1px solid rgba(83, 107, 255, 0.35);
  border-radius: 24px;
  padding: 38px 44px;
  box-shadow: 0 24px 60px rgba(4, 9, 32, 0.5), inset 0 1px rgba(255, 255, 255, 0.15);
  backdrop-filter: blur(12px);
}

.calc-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 28px;
  flex-wrap: wrap;
  padding-bottom: 28px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.calc-badge {
  display: inline-block;
  font-family: "Space Grotesk", sans-serif;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.14em;
  color: #fec70b;
  background: rgba(254, 199, 11, 0.14);
  border: 1px solid rgba(254, 199, 11, 0.35);
  padding: 4px 10px;
  border-radius: 6px;
  margin-bottom: 10px;
}

.calc-header h3 {
  font-family: "Space Grotesk", sans-serif;
  font-size: clamp(22px, 2.2vw, 32px);
  font-weight: 700;
  letter-spacing: -0.04em;
  margin: 0 0 8px;
  color: #fff;
}

.calc-header p {
  margin: 0;
  color: rgba(255, 255, 255, 0.65);
  font-size: 14px;
}

.calc-market-select {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.calc-label {
  font-family: "Space Grotesk", sans-serif;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.1em;
  color: rgba(255, 255, 255, 0.5);
}

.calc-pills {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

.calc-pill {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  border: 1px solid rgba(255, 255, 255, 0.16);
  background: rgba(255, 255, 255, 0.06);
  color: rgba(255, 255, 255, 0.85);
  font-family: "Space Grotesk", sans-serif;
  font-size: 13px;
  font-weight: 600;
  padding: 8px 16px;
  border-radius: 999px;
  cursor: pointer;
  transition: all 0.2s ease;
}

.calc-pill:hover {
  background: rgba(255, 255, 255, 0.15);
  color: #fff;
}

.calc-pill.is-active {
  background: #fec70b;
  color: #101322;
  border-color: #fec70b;
  box-shadow: 0 4px 16px rgba(254, 199, 11, 0.35);
}

.calc-grid {
  display: grid;
  grid-template-columns: 1.2fr 0.8fr;
  gap: 36px;
  margin-top: 32px;
  align-items: center;
}

.slider-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 16px;
  font-size: 15px;
  color: rgba(255, 255, 255, 0.85);
}

.slider-val {
  font-family: "Space Grotesk", sans-serif;
  font-size: 20px;
  font-weight: 700;
  color: #fec70b;
}

.slider-track-wrap {
  margin-bottom: 24px;
}

#calc-orders-slider {
  width: 100%;
  height: 8px;
  border-radius: 5px;
  background: rgba(255, 255, 255, 0.16);
  outline: none;
  cursor: pointer;
  -webkit-appearance: none;
}

#calc-orders-slider::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background: #fec70b;
  box-shadow: 0 0 12px rgba(254, 199, 11, 0.7);
  cursor: pointer;
  transition: transform 0.15s ease;
}

#calc-orders-slider::-webkit-slider-thumb:hover {
  transform: scale(1.2);
}

.slider-marks {
  display: flex;
  justify-content: space-between;
  margin-top: 10px;
  font-family: "Space Grotesk", sans-serif;
  font-size: 11px;
  font-weight: 600;
  color: rgba(255, 255, 255, 0.4);
}

.calc-perks {
  display: flex;
  flex-direction: column;
  gap: 9px;
  margin-top: 20px;
}

.perk-item {
  font-size: 13px;
  color: #b5c4f2;
}

.result-box {
  background: linear-gradient(135deg, rgba(25, 55, 247, 0.3) 0%, rgba(16, 25, 68, 0.6) 100%);
  border: 1px solid rgba(83, 107, 255, 0.45);
  border-radius: 18px;
  padding: 30px 28px;
  display: flex;
  flex-direction: column;
  box-shadow: 0 16px 40px rgba(0, 0, 0, 0.35);
}

.result-eyebrow {
  font-family: "Space Grotesk", sans-serif;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.12em;
  color: rgba(255, 255, 255, 0.6);
  margin-bottom: 8px;
}

.result-num-row {
  display: flex;
  align-items: baseline;
  gap: 10px;
  margin-bottom: 12px;
}

.result-num {
  font-family: "Space Grotesk", sans-serif;
  font-size: clamp(38px, 4vw, 54px);
  font-weight: 800;
  line-height: 1;
  color: #fff;
  letter-spacing: -0.05em;
  text-shadow: 0 4px 20px rgba(25, 55, 247, 0.5);
}

.result-currency {
  font-family: "Space Grotesk", sans-serif;
  font-size: 14px;
  color: rgba(255, 255, 255, 0.65);
  font-weight: 600;
}

.result-sub {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 10px;
  margin-bottom: 22px;
  padding-bottom: 16px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.12);
  font-size: 13px;
  color: rgba(255, 255, 255, 0.75);
}

.result-sub strong {
  color: #fec70b;
}

.tier-badge {
  display: inline-block;
  font-family: "Space Grotesk", sans-serif;
  font-size: 11px;
  font-weight: 700;
  padding: 4px 10px;
  border-radius: 999px;
}

.tier-starter {
  background: rgba(255, 255, 255, 0.1);
  color: #fff;
}

.tier-vip {
  background: rgba(254, 199, 11, 0.18);
  color: #fec70b;
  border: 1px solid rgba(254, 199, 11, 0.4);
}

.tier-diamond {
  background: linear-gradient(90deg, #10b981, #06b6d4);
  color: #fff;
  box-shadow: 0 4px 14px rgba(16, 185, 129, 0.35);
}

.button-calc {
  background: #fec70b;
  color: #101322;
  border-color: #fec70b;
  box-shadow: 0 8px 24px rgba(254, 199, 11, 0.25);
  font-weight: 700;
}

.button-calc:hover {
  background: #ffdc61;
  border-color: #ffdc61;
  box-shadow: 0 12px 30px rgba(254, 199, 11, 0.4);
}

/* ==========================================================
   Feature 5: Live Activity Social Proof Feed
   ========================================================== */
.live-activity-card {
  position: fixed;
  left: 24px;
  bottom: 24px;
  z-index: 110;
  display: flex;
  align-items: center;
  gap: 14px;
  max-width: 420px;
  padding: 13px 18px 13px 14px;
  border-radius: 14px;
  background: rgba(13, 20, 48, 0.92);
  border: 1px solid rgba(83, 107, 255, 0.4);
  box-shadow: 0 16px 40px rgba(3, 8, 30, 0.5), 0 0 24px rgba(25, 55, 247, 0.2);
  backdrop-filter: blur(14px);
  color: #fff;
  transform: translateY(120px) scale(0.95);
  opacity: 0;
  pointer-events: none;
  transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.35s ease;
}

.live-activity-card.is-visible {
  transform: translateY(0) scale(1);
  opacity: 1;
  pointer-events: auto;
}

.activity-pulse-icon {
  position: relative;
  width: 36px;
  height: 36px;
  flex-shrink: 0;
  border-radius: 10px;
  background: linear-gradient(135deg, #1937f7, #536bff);
  display: grid;
  place-items: center;
  font-size: 16px;
}

.activity-ring {
  position: absolute;
  inset: -3px;
  border-radius: 13px;
  border: 2px solid #fec70b;
  animation: activity-ring 2.2s ease-out infinite;
  opacity: 0;
}

@keyframes activity-ring {
  0% { transform: scale(0.85); opacity: 0.8; }
  100% { transform: scale(1.3); opacity: 0; }
}

.activity-content {
  flex: 1;
  min-width: 0;
}

.activity-title-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 2px;
}

.activity-title-row strong {
  font-family: "Space Grotesk", sans-serif;
  font-size: 13px;
  font-weight: 700;
  color: #fff;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.activity-time {
  font-size: 10px;
  color: rgba(255, 255, 255, 0.45);
  flex-shrink: 0;
}

.activity-desc {
  margin: 0;
  font-size: 12px;
  color: #c7d2f7;
  line-height: 1.4;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.activity-desc strong {
  color: #fec70b;
}

.activity-close {
  background: none;
  border: 0;
  color: rgba(255, 255, 255, 0.45);
  font-size: 12px;
  cursor: pointer;
  padding: 4px;
  display: grid;
  place-items: center;
  transition: color 0.15s;
}

.activity-close:hover {
  color: #fff;
}

@media (max-width: 860px) {
  .calc-grid {
    grid-template-columns: 1fr;
    gap: 28px;
  }
  .scale-calc-card {
    padding: 28px 24px;
  }
}

@media (max-width: 640px) {
  .live-activity-card {
    left: 14px;
    right: 14px;
    bottom: 84px;
    max-width: none;
  }
  .offer-submeta {
    flex-direction: column;
    align-items: flex-start;
  }
}

/* ============================================================
   THEME TOGGLE BUTTON & DARK MODE STYLING
   ============================================================ */
.theme-toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: 10px;
  border: 1px solid var(--line, #e5e7ee);
  background: rgba(255, 255, 255, 0.85);
  color: var(--ink, #101322);
  cursor: pointer;
  padding: 0;
  transition: all 0.22s cubic-bezier(0.2, 0.8, 0.2, 1);
  position: relative;
  overflow: hidden;
}

.theme-toggle:hover {
  border-color: #1937f7;
  color: #1937f7;
  transform: translateY(-1px);
  box-shadow: 0 4px 14px rgba(25, 55, 247, 0.12);
}

.theme-toggle svg {
  position: absolute;
  transition: transform 0.35s cubic-bezier(0.2, 0.8, 0.2, 1), opacity 0.25s ease;
}

/* Default (Light mode): Show Moon icon (click to go Dark) */
.theme-toggle .icon-sun {
  opacity: 0;
  transform: rotate(-90deg) scale(0.6);
}
.theme-toggle .icon-moon {
  opacity: 1;
  transform: rotate(0) scale(1);
}

/* Dark mode: Show Sun icon (click to go Light) */
[data-theme="dark"] .theme-toggle .icon-sun {
  opacity: 1;
  transform: rotate(0) scale(1);
}
[data-theme="dark"] .theme-toggle .icon-moon {
  opacity: 0;
  transform: rotate(90deg) scale(0.6);
}

/* Mobile Theme Toggle row */
.mobile-nav-top-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-bottom: 14px;
  margin-bottom: 6px;
  border-bottom: 1px solid var(--line, #e5e7ee);
}

.mobile-nav-theme-label {
  font-size: 13px;
  font-weight: 600;
  color: var(--muted, #666b7b);
}

.theme-toggle-mobile {
  width: auto;
  height: 38px;
  padding: 0 14px 0 36px;
  font-size: 13px;
  font-weight: 700;
  border-radius: 8px;
}

.theme-toggle-mobile svg {
  left: 10px;
}

.theme-mode-text {
  font-family: "Space Grotesk", sans-serif;
  font-size: 12px;
}

/* ============================================================
   [data-theme="dark"] OVERRIDES
   ============================================================ */
/* ============================================================
   [data-theme="dark"] OVERRIDES & CONTRAST REFINEMENTS
   ============================================================ */
/* Base brand logo toggle */
.brand-logo-dark {
  display: none;
}
.brand-logo-light {
  display: block;
}

[data-theme="dark"] {
  --ink: #f0f3ff;
  --muted: #a6b2d9;
  --line: #1e2548;
  --soft: #121733;
  --white: #10142b;
  color-scheme: dark;
}

[data-theme="dark"] body {
  background-color: #0b0f24;
  color: #e3e8fc;
}

[data-theme="dark"] .site-header {
  background: rgba(11, 15, 36, 0.88);
  border-bottom-color: rgba(255, 255, 255, 0.08);
}

/* Header logo: show official upgo-logo-light.svg in dark mode */
[data-theme="dark"] .brand-logo-light {
  display: none;
}
[data-theme="dark"] .brand-logo-dark {
  display: block;
  width: 100%;
  height: auto;
  filter: none;
}

[data-theme="dark"] .desktop-nav a {
  color: #c7d1f5;
}
[data-theme="dark"] .desktop-nav a:hover {
  color: #fec70b;
}

[data-theme="dark"] .login {
  color: #e2e8ff;
}

[data-theme="dark"] .theme-toggle {
  background: #151a3a;
  border-color: #273059;
  color: #fec70b;
}
[data-theme="dark"] .theme-toggle:hover {
  border-color: #fec70b;
  box-shadow: 0 4px 16px rgba(254, 199, 11, 0.18);
}

[data-theme="dark"] .menu-toggle {
  background: #151a3a;
  border-color: #273059;
}
[data-theme="dark"] .menu-toggle span {
  background: #e2e8ff;
}

[data-theme="dark"] .mobile-nav {
  background: #0f1430;
  border-bottom-color: #232a50;
  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.55);
}
[data-theme="dark"] .mobile-nav a {
  color: #e2e8ff;
}
[data-theme="dark"] .mobile-nav-top-row {
  border-bottom-color: #232a50;
}
[data-theme="dark"] .mobile-nav-theme-label {
  color: #8f9bc0;
}

/* Event banner: Ensure text, description, and action button are crystal clear */
[data-theme="dark"] .event-banner {
  background: linear-gradient(115deg, #131a40 0%, #171f45 50%, #201e2f 100%);
  border: 1px solid rgba(255, 255, 255, 0.12);
  color: #ffffff;
}
[data-theme="dark"] .event-copy h2 {
  color: #ffffff;
}
[data-theme="dark"] .event-copy p {
  color: #c7d2f7;
}
[data-theme="dark"] .event-banner .text-link {
  color: #101322 !important;
  background: #fec70b;
  font-weight: 800;
  box-shadow: 0 4px 14px rgba(254, 199, 11, 0.25);
}
[data-theme="dark"] .event-banner .text-link:hover {
  background: #ffdc61;
}

/* Hero section buttons fix: outline button text must be distinct against white background */
.hero .hero-actions .button.pending-link:first-child {
  background: #fec70b;
  color: #101322;
  border-color: #fec70b;
  font-weight: 800;
}
.hero .hero-actions .button.pending-link:first-child:hover {
  background: #ffdc61;
  box-shadow: 0 10px 24px rgba(254, 199, 11, 0.35);
}
.hero .hero-actions .button.button-outline {
  background: #ffffff;
  color: #101322 !important;
  border-color: #ffffff;
  font-weight: 700;
}
.hero .hero-actions .button.button-outline:hover {
  background: #f0f3ff;
  color: #1937f7 !important;
}

/* Audience cards: Brand card (white in light mode) darkens */
[data-theme="dark"] .audience-brand {
  background: #131733;
  border: 1px solid #232b57;
  color: #e3e8fc;
}
[data-theme="dark"] .audience-brand h2 {
  color: #ffffff;
}
[data-theme="dark"] .audience-brand p {
  color: #8c98c2;
}
[data-theme="dark"] .audience-brand .audience-button {
  background: #1d2552;
  border-color: #313c77;
  color: #ffffff;
}
[data-theme="dark"] .audience-brand .audience-button:hover {
  background: #1937f7;
  border-color: #1937f7;
}

/* Advantage section headings & yellow highlights */
[data-theme="dark"] .section-heading h2 {
  color: #ffffff !important;
}
[data-theme="dark"] .section-heading h2 em,
[data-theme="dark"] .section-heading em,
[data-theme="dark"] h2 em,
[data-theme="dark"] .advantages .section-heading h2 em,
[data-theme="dark"] .insights .section-heading h2 em,
[data-theme="dark"] #insights .section-heading h2 em {
  color: #fec70b !important;
  background: none !important;
  -webkit-background-clip: initial !important;
  background-clip: initial !important;
  -webkit-text-fill-color: #fec70b !important;
  font-style: normal;
}
[data-theme="dark"] .section-heading>p {
  color: #c0caf0 !important;
}

[data-theme="dark"] .advantage-grid {
  border-color: #1d2448;
}
[data-theme="dark"] .advantage-grid article {
  background: #0f1430;
  border-color: #1d2448;
}
[data-theme="dark"] .advantage-grid article:hover {
  background: linear-gradient(135deg, #161e47 0%, #1c2352 58%, #2d2a1c 100%);
  border-color: #3b4d99;
  box-shadow: 0 22px 48px rgba(0, 0, 0, 0.45);
}
[data-theme="dark"] .advantage-grid article:nth-child(even):hover {
  background: linear-gradient(135deg, #2b2510 0%, #1a1e3d 55%, #182255 100%);
}
[data-theme="dark"] .advantage-grid h3,
[data-theme="dark"] .advantage-grid article h3,
[data-theme="dark"] .advantage-grid article:hover h3 {
  color: #ffffff !important;
}
[data-theme="dark"] .advantage-grid p,
[data-theme="dark"] .advantage-grid article p,
[data-theme="dark"] .advantage-grid article>p {
  color: #d1dcff !important;
}
[data-theme="dark"] .advantage-grid article:hover p,
[data-theme="dark"] .advantage-grid article:hover>p {
  color: #ffffff !important;
}
[data-theme="dark"] .advantage-icon:after {
  border-color: #0f1430;
}

/* Insights section & Yellow Card text contrast fix */
[data-theme="dark"] #insights .section-heading h2 em {
  color: #fec70b !important;
  background: none !important;
  -webkit-background-clip: initial !important;
  background-clip: initial !important;
  -webkit-text-fill-color: #fec70b !important;
}
.insight-card.yellow {
  color: #101322 !important;
}
.insight-card.yellow > span {
  color: #242940 !important;
  font-weight: 800;
}
.insight-card.yellow small {
  color: #363d59 !important;
  opacity: 0.95;
  font-weight: 700;
}
.insight-card.yellow h3 {
  color: #101322 !important;
}
.insight-card.yellow button {
  color: #101322 !important;
  border-color: #242940 !important;
  opacity: 0.85;
  font-weight: 700;
}

/* Ticker badge fix */
.ticker-track b {
  background: #101322 !important;
  color: #ffffff !important;
}

/* Offer info side (inside dark offers carousel) */
[data-theme="dark"] .offer-info {
  background: #101533;
  color: #ffffff;
}
[data-theme="dark"] .offer-info h3 {
  color: #ffffff;
}
[data-theme="dark"] .metric-bar {
  background: #1d254e;
}
[data-theme="dark"] .copy-offer-btn {
  background: #171e44;
  border-color: #2a356b;
  color: #c7d2f7;
}
[data-theme="dark"] .copy-offer-btn:hover {
  background: #232c63;
  color: #ffffff;
}
[data-theme="dark"] .button-outline-glass {
  background: rgba(255, 255, 255, 0.05);
  border-color: rgba(255, 255, 255, 0.15);
  color: #c7d2f7;
}
[data-theme="dark"] .button-outline-glass:hover {
  background: rgba(255, 255, 255, 0.1);
  color: #fff;
}






/* ============================================================
   LANGUAGE SWITCHER (VN | EN)
   ============================================================ */
.lang-switcher {
  display: inline-flex;
  align-items: center;
  height: 38px;
  padding: 3px;
  background: rgba(16, 25, 61, 0.05);
  border: 1px solid var(--line, #e5e7ee);
  border-radius: 10px;
  transition: all 0.22s ease;
  user-select: none;
}

.lang-btn {
  border: none;
  background: transparent;
  color: var(--muted, #666b7b);
  font-family: "Space Grotesk", sans-serif;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.02em;
  padding: 0 10px;
  height: 30px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 7px;
  cursor: pointer;
  transition: all 0.2s cubic-bezier(0.2, 0.8, 0.2, 1);
  line-height: 1;
}

.lang-btn:hover {
  color: #1937f7;
}

.lang-btn.is-active {
  background: #1937f7;
  color: #ffffff;
  box-shadow: 0 2px 8px rgba(25, 55, 247, 0.28);
}

.lang-divider {
  width: 1px;
  height: 14px;
  background: var(--line, #e5e7ee);
  margin: 0 1px;
  transition: opacity 0.15s ease;
}

/* Dark mode styling for language switcher */
[data-theme="dark"] .lang-switcher {
  background: rgba(255, 255, 255, 0.06);
  border-color: rgba(255, 255, 255, 0.12);
}

[data-theme="dark"] .lang-btn {
  color: rgba(255, 255, 255, 0.65);
}

[data-theme="dark"] .lang-btn:hover {
  color: #ffffff;
}

[data-theme="dark"] .lang-btn.is-active {
  background: #3b82f6;
  color: #ffffff;
  box-shadow: 0 2px 10px rgba(59, 130, 246, 0.4);
}

[data-theme="dark"] .lang-divider {
  background: rgba(255, 255, 255, 0.15);
}

/* Mobile language row */
.mobile-nav-lang-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-bottom: 14px;
  margin-bottom: 6px;
  border-bottom: 1px solid var(--line, #e5e7ee);
}

.mobile-nav-lang-label {
  font-size: 13px;
  font-weight: 600;
  color: var(--muted, #666b7b);
}

.lang-switcher-mobile {
  height: 38px;
  border-radius: 8px;
}

.lang-switcher-mobile .lang-btn {
  height: 30px;
  padding: 0 12px;
  font-size: 12px;
}


/* Heading line balance and nowrap utilities */
.nowrap {
  white-space: nowrap;
}

.offer-heading h2,
.final-cta h2 {
  text-wrap: balance;
}

@media (min-width: 1050px) {
  .section-heading.offer-heading {
    grid-template-columns: 1.25fr 0.75fr;
  }
}