/* ===========================================================
   WOLFYCASH · CYBERPUNK / ARASAKA STYLE
   Palette extraída del logo + key art:
   - Negro profundo:        #04100f / #061513
   - Teal neón:             #2EE6C8 (primario), #58fff0 highlight
   - Verde menta gradient:  #6cf3a8
   - Oro:                   #f5c842 / glow #ffe082
   - Plata:                 #d8e2e0 / acento texto
   =========================================================== */

:root{
  --bg:        #04100f;
  --bg-2:      #061a18;
  --bg-3:      #0a2724;
  --panel:     #07211e;
  --line:      #103832;
  --line-2:    #1a4d44;
  --teal:      #2ee6c8;
  --teal-2:    #58fff0;
  --teal-dark: #0d8e7d;
  --gold:      #f5c842;
  --gold-2:    #ffe082;
  --silver:    #d8e2e0;
  --silver-2:  #f5fbfa;
  --dim:       #5d7a76;
  --danger:    #ff4d6a;

  --f-display: 'Orbitron', 'Rajdhani', system-ui, sans-serif;
  --f-body:    'Rajdhani', system-ui, sans-serif;
  --f-mono:    'JetBrains Mono', ui-monospace, monospace;
}

*{box-sizing:border-box;margin:0;padding:0}
html,body{background:var(--bg);color:var(--silver);font-family:var(--f-body);font-size:17px;line-height:1.55;-webkit-font-smoothing:antialiased}
body{
  background:
    radial-gradient(1200px 600px at 80% -10%, rgba(46,230,200,.10), transparent 60%),
    radial-gradient(900px 500px at -10% 20%, rgba(245,200,66,.06), transparent 60%),
    radial-gradient(800px 400px at 50% 110%, rgba(46,230,200,.08), transparent 60%),
    var(--bg);
  overflow-x:hidden;
  min-height:100vh;
}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}

.container{width:min(1240px,92%);margin-inline:auto}
.mono{font-family:var(--f-mono);letter-spacing:.04em;font-size:.78em;text-transform:uppercase}
.dim{color:var(--dim)}
.accent-teal{color:var(--teal);text-shadow:0 0 16px rgba(46,230,200,.55)}
.accent-gold{color:var(--gold);text-shadow:0 0 14px rgba(245,200,66,.45)}

/* =================== FX OVERLAYS =================== */
.fx-scanlines{
  position:fixed;inset:0;pointer-events:none;z-index:9999;
  background:repeating-linear-gradient(to bottom, rgba(255,255,255,.025) 0 1px, transparent 1px 3px);
  mix-blend-mode:overlay;opacity:.5;
}
.fx-grid{
  position:fixed;inset:0;pointer-events:none;z-index:0;
  background-image:
    linear-gradient(rgba(46,230,200,.05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(46,230,200,.05) 1px, transparent 1px);
  background-size: 60px 60px;
  mask-image:radial-gradient(ellipse at center, #000 30%, transparent 80%);
}
.fx-vignette{
  position:fixed;inset:0;pointer-events:none;z-index:1;
  background:radial-gradient(ellipse at center, transparent 50%, rgba(0,0,0,.8) 100%);
}

/* =================== STATUS BAR =================== */
.status-bar{
  position:relative;z-index:10;
  background:linear-gradient(90deg, #02100e, #061a18, #02100e);
  border-bottom:1px solid var(--line);
  font-family:var(--f-mono);
  font-size:11px;
  color:var(--dim);
}
.status-bar__inner{display:flex;justify-content:space-between;gap:24px;padding:8px 0;flex-wrap:wrap}
.status-bar__item{display:inline-flex;align-items:center;gap:8px;letter-spacing:.08em;text-transform:uppercase}
.dot{width:7px;height:7px;background:var(--teal);box-shadow:0 0 8px var(--teal);display:inline-block;animation:blink 1.6s infinite}
.dot--gold{background:var(--gold);box-shadow:0 0 8px var(--gold)}
.dot--live{background:var(--teal)}
@keyframes blink{50%{opacity:.3}}

/* =================== NAV =================== */
.nav{position:sticky;top:0;z-index:50;background:rgba(4,16,15,.85);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.nav__inner{display:flex;align-items:center;justify-content:space-between;padding:14px 0;gap:24px}
.brand{display:flex;align-items:center;gap:12px}
.brand__logo{width:54px;height:54px;object-fit:contain;filter:drop-shadow(0 0 12px rgba(46,230,200,.45))}
.brand__logo--sm{width:42px;height:42px}
.brand__text{display:flex;flex-direction:column;line-height:1}
.brand__name{font-family:var(--f-display);font-weight:900;font-size:22px;letter-spacing:.06em;color:var(--silver-2)}
.brand__tag{color:var(--teal);font-family:var(--f-mono);font-size:10px;letter-spacing:.18em;margin-top:4px}
.nav__links{display:flex;gap:28px;font-family:var(--f-mono);font-size:13px;text-transform:uppercase;letter-spacing:.1em}
.nav__links a{color:var(--silver);opacity:.75;transition:opacity .15s, color .15s}
.nav__links a:hover{opacity:1;color:var(--teal)}
.nav__cta{font-size:13px}
@media(max-width:900px){.nav__links{display:none}}

/* =================== BOTONES (Arasaka cut) =================== */
.btn{
  --b: 14px;
  display:inline-flex;align-items:center;gap:10px;
  font-family:var(--f-display);font-weight:700;letter-spacing:.1em;text-transform:uppercase;
  font-size:14px;padding:12px 22px;cursor:pointer;border:0;
  position:relative;transition:transform .15s, filter .15s;
  clip-path: polygon(0 0, calc(100% - var(--b)) 0, 100% var(--b), 100% 100%, var(--b) 100%, 0 calc(100% - var(--b)));
}
.btn .ico{width:18px;height:18px}
.btn--primary{
  background:linear-gradient(135deg, #ffe9a0 0%, var(--gold) 35%, #d99a14 70%, #b88a14 130%);
  background-size:220% 220%;
  color:#1a1200;
  box-shadow:0 0 0 1px var(--gold), 0 0 28px rgba(245,200,66,.55), 0 0 60px rgba(245,200,66,.25), inset 0 0 0 1px rgba(255,240,200,.45);
  animation:neonPulse 2.2s ease-in-out infinite, gradMove 6s ease-in-out infinite;
  position:relative;overflow:hidden;
  text-shadow:0 0 14px rgba(255,255,255,.35);
}
.btn--primary::before{
  content:"";position:absolute;top:0;left:-120%;width:60%;height:100%;
  background:linear-gradient(90deg, transparent, rgba(255,255,255,.7), transparent);
  transform:skewX(-20deg);
  animation:shine 2.6s ease-in-out infinite;
  pointer-events:none;
}
.btn--primary::after{
  content:"";position:absolute;inset:-6px;pointer-events:none;
  clip-path:inherit;
  box-shadow:0 0 0 2px rgba(245,200,66,.6);
  opacity:0;animation:ringPulse 2s ease-out infinite;
}
.btn--primary:hover{filter:brightness(1.15) saturate(1.15);transform:translateY(-2px) scale(1.02);animation-duration:1s, 6s}
@keyframes neonPulse{
  0%,100%{box-shadow:0 0 0 1px var(--gold), 0 0 22px rgba(245,200,66,.45), 0 0 44px rgba(245,200,66,.22), inset 0 0 0 1px rgba(255,240,200,.35)}
  50%{box-shadow:0 0 0 1px var(--gold), 0 0 36px rgba(245,200,66,.85), 0 0 80px rgba(245,200,66,.45), 0 0 120px rgba(46,230,200,.15), inset 0 0 0 1px rgba(255,240,200,.55)}
}
@keyframes shine{
  0%{left:-120%}
  60%,100%{left:140%}
}
@keyframes gradMove{
  0%,100%{background-position:0% 50%}
  50%{background-position:100% 50%}
}
@keyframes ringPulse{
  0%{opacity:.7;transform:scale(.96)}
  100%{opacity:0;transform:scale(1.12)}
}

/* Make XL/LG buttons even more eye-catching */
.btn--lg,.btn--xl{font-weight:800}
.btn--xl::after{inset:-10px;box-shadow:0 0 0 2px rgba(245,200,66,.6)}
.btn--xl{
  background:linear-gradient(135deg, var(--teal-2) 0%, var(--teal) 30%, #1bb39a 65%, var(--gold) 110%);
  background-size:240% 240%;
}
.btn--ghost{background:transparent;color:var(--teal);box-shadow:inset 0 0 0 1px var(--teal-dark)}
.btn--ghost:hover{background:rgba(46,230,200,.08);color:var(--teal-2)}
.btn--lg{font-size:15px;padding:16px 28px;--b:18px}
.btn--xl{font-size:17px;padding:20px 36px;--b:22px}
.ico--arrow{margin-left:4px}

/* =================== HERO =================== */
.hero{position:relative;z-index:5;padding:90px 0 70px}
.hero__inner{display:grid;grid-template-columns:1.15fr .85fr;gap:60px;align-items:center}
.hero__chips{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:28px}
.chip{
  display:inline-flex;align-items:center;gap:10px;
  padding:8px 14px;font-family:var(--f-mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;
  background:rgba(46,230,200,.08);color:var(--teal);
  clip-path:polygon(8px 0,100% 0,calc(100% - 8px) 100%,0 100%);
  border-left:2px solid var(--teal);
}
.chip__id{color:var(--silver);opacity:.6}
.chip--gold{color:var(--gold);background:rgba(245,200,66,.08);border-left-color:var(--gold)}
.chip--gold .chip__id{opacity:.5}

.hero__title{
  font-family:var(--f-display);font-weight:900;letter-spacing:.01em;line-height:.95;
  font-size:clamp(40px, 6.2vw, 84px);
}
.hero__title .line{display:block;white-space:nowrap}
.line--silver{
  background:linear-gradient(180deg, #fff 0%, #b5c4c1 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent;
  text-shadow:0 0 30px rgba(255,255,255,.08);
}
.line--teal{
  background:linear-gradient(180deg, var(--teal-2) 0%, var(--teal) 60%, var(--teal-dark) 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent;
  filter:drop-shadow(0 0 18px rgba(46,230,200,.35));
}
.line--gold{
  background:linear-gradient(180deg, #fff5d2 0%, var(--gold) 50%, #b88a14 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent;
  filter:drop-shadow(0 0 18px rgba(245,200,66,.35));
}
.line--mix{display:block}
.word{display:inline-block}
.word--teal{
  background:linear-gradient(180deg, var(--teal-2) 0%, var(--teal) 60%, var(--teal-dark) 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent;
  filter:drop-shadow(0 0 18px rgba(46,230,200,.4));
}
.word--gold{
  background:linear-gradient(180deg, #fff5d2 0%, var(--gold) 50%, #b88a14 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent;
  filter:drop-shadow(0 0 18px rgba(245,200,66,.4));
}
.hero__sub{margin:24px 0 32px;color:#bccbc9;font-size:18px;max-width:620px}
.hero__sub strong{color:var(--silver-2)}
.hero__ctas{display:flex;gap:14px;flex-wrap:wrap;margin-bottom:42px}
.hero__stats{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;border-top:1px solid var(--line);padding-top:24px;max-width:720px}
.stat{display:flex;flex-direction:column;gap:4px}
.stat__num{font-family:var(--f-display);font-weight:800;font-size:26px;color:var(--silver-2);letter-spacing:.02em}
.stat__lbl{font-family:var(--f-mono);font-size:10.5px;color:var(--dim);text-transform:uppercase;letter-spacing:.1em}

/* HERO LOGO - banner above title with tight orbit animation */
.hero__logo-wrap{
  position:relative;display:inline-flex;justify-content:center;align-items:center;
  margin:0 auto 14px;width:auto;
  will-change:transform;
}
.hero__logo-big{
  width:260px;height:auto;display:block;position:relative;z-index:3;
  filter:drop-shadow(0 6px 24px rgba(46,230,200,.4)) drop-shadow(0 0 60px rgba(245,200,66,.18));
  animation:logoFloat 5s ease-in-out infinite;
}
/* soft radial glow that hides PNG edges */
.hero__logo-glow{
  position:absolute;inset:-20%;z-index:1;pointer-events:none;border-radius:50%;
  background:
    radial-gradient(circle at 50% 50%, rgba(46,230,200,.35) 0%, rgba(46,230,200,.12) 40%, transparent 65%),
    radial-gradient(circle at 50% 50%, rgba(245,200,66,.22) 0%, transparent 55%);
  animation:logoGlowPulse 4s ease-in-out infinite;
}
/* rings disabled - PNG has asymmetric content, perfect circles look off-center */
.hero__logo-rings{position:absolute;inset:0;z-index:2;pointer-events:none}
.ring,.orbit,.orbit--rev,.orbit__dot{display:none}

/* twinkling sparks tight around logo */
.spark{
  position:absolute;color:#fff;font-size:14px;line-height:1;
  filter:drop-shadow(0 0 5px var(--teal));
  animation:twinkle 2.4s ease-in-out infinite;
}
.spark--1{top:-2%;right:8%;color:var(--gold);filter:drop-shadow(0 0 5px var(--gold));animation-delay:0s}
.spark--2{bottom:4%;right:-2%;animation-delay:.6s}
.spark--3{bottom:6%;left:-2%;color:var(--gold);filter:drop-shadow(0 0 5px var(--gold));animation-delay:1.2s}
.spark--4{top:6%;left:6%;animation-delay:1.8s}

@keyframes spin{to{transform:translate3d(-50%,-50%,0) rotate(360deg)}}
@keyframes spinRev{to{transform:translate3d(-50%,-50%,0) rotate(-360deg)}}
@keyframes twinkle{
  0%,100%{opacity:0;transform:scale(.5)}
  50%{opacity:1;transform:scale(1.1)}
}
@keyframes logoFloat{
  0%,100%{transform:translateY(0)}
  50%{transform:translateY(-6px)}
}
@keyframes logoGlowPulse{
  0%,100%{opacity:.7}
  50%{opacity:1}
}

/* HERO panel */
.hero__right{position:relative}
.hero__panel{
  position:relative;background:linear-gradient(160deg, #061a18 0%, #02100e 100%);
  padding:18px;
  clip-path:polygon(0 22px, 22px 0, calc(100% - 60px) 0, calc(100% - 60px) 16px, 100% 16px, 100% 100%, 22px 100%, 0 calc(100% - 22px));
  box-shadow:0 0 0 1px var(--line-2), 0 30px 80px rgba(0,0,0,.6), inset 0 0 60px rgba(46,230,200,.06);
}
.hero__panel::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(180deg, transparent 0%, rgba(46,230,200,.04) 100%);
}
.panel__head{display:flex;justify-content:space-between;color:var(--teal);font-size:11px;padding:0 4px 12px;border-bottom:1px dashed var(--line-2)}
.hero__mascot{margin:14px auto;max-width:88%;filter:drop-shadow(0 20px 40px rgba(0,0,0,.6)) drop-shadow(0 0 30px rgba(46,230,200,.18))}
.panel__hud{border-top:1px dashed var(--line-2);padding-top:14px;display:flex;flex-direction:column;gap:8px}
.hud-row{display:flex;justify-content:space-between;font-size:12px}
.hud-row .mono{font-size:11px}
.hud-bar{height:6px;background:var(--bg-3);position:relative;margin-top:6px;clip-path:polygon(0 0,calc(100% - 6px) 0,100% 100%,0 100%)}
.hud-bar span{position:absolute;inset:0;width:var(--w);background:linear-gradient(90deg, var(--teal-dark), var(--teal), var(--teal-2));box-shadow:0 0 12px var(--teal)}
.hud-foot{margin-top:6px;font-size:10px;color:var(--teal);opacity:.8}
.hero__corner{
  position:absolute;top:-12px;right:24px;background:var(--gold);color:#1a0d00;padding:4px 10px;
  font-size:10px;letter-spacing:.18em;clip-path:polygon(8px 0,100% 0,calc(100% - 8px) 100%,0 100%);
  box-shadow:0 0 16px rgba(245,200,66,.5)
}

@media(max-width:1000px){
  .hero{padding:50px 0}
  .hero__inner{grid-template-columns:1fr;gap:40px}
  .hero__stats{grid-template-columns:repeat(2,1fr)}
}

/* =================== MARQUEE =================== */
.marquee{
  border-top:1px solid rgba(245,200,66,.25);border-bottom:1px solid rgba(245,200,66,.25);
  background:linear-gradient(90deg,#0e0a02,#1a1206,#0e0a02);
  overflow:hidden;padding:16px 0;position:relative;z-index:5;
}
.marquee__track{display:flex;gap:28px;white-space:nowrap;animation:slide 16s linear infinite;font-family:var(--f-display);font-weight:700;letter-spacing:.18em;color:#fff5d2;font-size:18px;text-shadow:0 0 12px rgba(245,200,66,.35)}
.marquee__track .sep{color:var(--gold);opacity:.85}
@keyframes slide{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* =================== SECTIONS =================== */
.section{position:relative;z-index:5;padding:90px 0}
.section--alt{background:linear-gradient(180deg, transparent 0%, rgba(46,230,200,.03) 50%, transparent 100%);border-block:1px solid var(--line)}
.section__head{max-width:820px;margin-bottom:52px}
.kicker{color:var(--teal);font-size:12px;letter-spacing:.22em;display:inline-block;padding:6px 12px;background:rgba(46,230,200,.08);border-left:2px solid var(--teal);margin-bottom:18px}
.section__title{font-family:var(--f-display);font-weight:900;font-size:clamp(30px, 4vw, 52px);line-height:1.05;letter-spacing:.01em;color:var(--silver-2)}
.section__lead{margin-top:18px;color:#bccbc9;font-size:18px;max-width:720px}

/* =================== GRIDS =================== */
.grid{display:grid;gap:18px}
.grid--3{grid-template-columns:repeat(3,1fr)}
.grid--4{grid-template-columns:repeat(4,1fr)}
@media(max-width:1000px){.grid--3,.grid--4{grid-template-columns:repeat(2,1fr)}}
@media(max-width:600px){.grid--3,.grid--4{grid-template-columns:1fr}}

/* =================== STEPS =================== */
.step{
  position:relative;background:linear-gradient(160deg, var(--panel), #03110f);
  padding:26px 22px;
  clip-path:polygon(0 16px,16px 0,100% 0,100% calc(100% - 16px),calc(100% - 16px) 100%,0 100%);
  box-shadow:0 0 0 1px var(--line-2), inset 0 0 40px rgba(46,230,200,.04);
  transition:transform .2s, box-shadow .2s;
}
.step:hover{transform:translateY(-3px);box-shadow:0 0 0 1px var(--teal-dark),0 20px 40px rgba(0,0,0,.5),inset 0 0 40px rgba(46,230,200,.08)}
.step__num{position:absolute;top:14px;right:18px;color:var(--teal);font-size:11px;opacity:.7}
.step__icon{width:46px;height:46px;display:flex;align-items:center;justify-content:center;background:rgba(46,230,200,.08);color:var(--teal);margin-bottom:18px;clip-path:polygon(0 0,calc(100% - 8px) 0,100% 8px,100% 100%,8px 100%,0 calc(100% - 8px))}
.step__icon svg{width:26px;height:26px}
.step h3{font-family:var(--f-display);font-weight:800;font-size:17px;letter-spacing:.06em;color:var(--silver-2);margin-bottom:8px}
.step p{font-size:15px;color:#a8b8b6}
.step a{color:var(--teal);border-bottom:1px solid var(--teal-dark)}

/* =================== CARDS (oportunidades) =================== */
.card{
  position:relative;background:linear-gradient(160deg, #07221f 0%, #03110f 100%);
  padding:26px 24px 22px;
  clip-path:polygon(0 0,calc(100% - 22px) 0,100% 22px,100% 100%,22px 100%,0 calc(100% - 22px));
  box-shadow:0 0 0 1px var(--line-2);
  transition:transform .2s, box-shadow .2s;
  display:flex;flex-direction:column;gap:14px;
}
.card:hover{transform:translateY(-4px);box-shadow:0 0 0 1px var(--teal-dark), 0 20px 50px rgba(0,0,0,.55)}
.card__head{display:flex;justify-content:space-between;align-items:flex-start}
.card__icon{width:54px;height:54px;display:flex;align-items:center;justify-content:center;background:rgba(46,230,200,.1);color:var(--teal);clip-path:polygon(0 0,calc(100% - 10px) 0,100% 10px,100% 100%,10px 100%,0 calc(100% - 10px));box-shadow:inset 0 0 20px rgba(46,230,200,.15)}
.card__icon svg{width:28px;height:28px}
.card__tag{color:var(--gold);font-size:10px;letter-spacing:.18em;padding:4px 8px;background:rgba(245,200,66,.08);border:1px solid rgba(245,200,66,.25)}
.card h3{font-family:var(--f-display);font-weight:800;font-size:18px;letter-spacing:.04em;color:var(--silver-2)}
.card p{font-size:14.5px;color:#a8b8b6}
.card__meta{list-style:none;border-top:1px dashed var(--line-2);padding-top:14px;display:flex;flex-direction:column;gap:6px;font-size:11px}
/* gold variant for opportunity cards */
.card--gold{background:linear-gradient(160deg, #2a1f04 0%, #0e0a02 100%);box-shadow:inset 0 0 0 1px #7a5a08}
.card--gold .card__icon{background:rgba(245,200,66,.12);color:var(--gold);box-shadow:inset 0 0 20px rgba(245,200,66,.18)}
.card--gold .card__tag{color:var(--teal);background:rgba(46,230,200,.1);border-color:var(--teal-dark)}
.card--gold h3{color:#fff5d2}
.card--gold:hover{box-shadow:0 0 0 1px var(--gold), 0 20px 50px rgba(0,0,0,.6), 0 0 30px rgba(245,200,66,.2)}
.card__meta li{display:flex;justify-content:space-between;color:var(--dim)}
.card__meta strong{color:var(--silver-2);font-family:var(--f-mono);font-weight:600}

/* =================== CALLOUT =================== */
.callout{
  margin-top:36px;display:flex;gap:18px;align-items:flex-start;
  padding:22px 26px;background:linear-gradient(90deg, rgba(245,200,66,.08), transparent);
  border-left:3px solid var(--gold);
  clip-path:polygon(0 0,calc(100% - 14px) 0,100% 14px,100% 100%,14px 100%,0 calc(100% - 14px));
}
.callout .ico--lg{width:32px;height:32px;color:var(--gold);flex-shrink:0;margin-top:2px}
.callout strong{font-family:var(--f-display);letter-spacing:.06em;color:var(--gold);font-size:15px;display:block;margin-bottom:6px}
.callout p{color:#bccbc9;font-size:15px}

/* =================== PAY GRID =================== */
.pay-grid{display:grid;grid-template-columns:repeat(8,1fr);gap:12px}
.pay{
  display:flex;flex-direction:column;align-items:center;gap:10px;
  padding:22px 10px;background:#06201d;
  clip-path:polygon(0 10px,10px 0,100% 0,100% calc(100% - 10px),calc(100% - 10px) 100%,0 100%);
  box-shadow:inset 0 0 0 1px var(--line-2);
  font-family:var(--f-mono);font-size:10.5px;letter-spacing:.1em;text-align:center;color:var(--silver);
  transition:color .2s, box-shadow .2s;
}
.pay:hover{color:var(--teal-2);box-shadow:inset 0 0 0 1px var(--teal-dark), 0 0 24px rgba(46,230,200,.18)}
.pay__icon{width:48px;height:48px;display:flex;align-items:center;justify-content:center;color:var(--teal)}
.pay__icon svg{width:32px;height:32px}
@media(max-width:1100px){.pay-grid{grid-template-columns:repeat(4,1fr)}}
@media(max-width:600px){.pay-grid{grid-template-columns:repeat(2,1fr)}}

/* =================== FEAT =================== */
.feat{
  background:linear-gradient(160deg, #07221f, #03110f);
  padding:28px 26px;
  clip-path:polygon(0 0,calc(100% - 14px) 0,100% 14px,100% 100%,14px 100%,0 calc(100% - 14px));
  box-shadow:inset 0 0 0 1px var(--line-2);
}
.feat__icon{width:54px;height:54px;display:flex;align-items:center;justify-content:center;color:var(--teal);background:rgba(46,230,200,.1);margin-bottom:18px;clip-path:polygon(0 0,calc(100% - 10px) 0,100% 10px,100% 100%,10px 100%,0 calc(100% - 10px))}
.feat__icon svg{width:28px;height:28px}
.feat h3{font-family:var(--f-display);font-weight:800;font-size:17px;letter-spacing:.06em;color:var(--silver-2);margin-bottom:8px}
.feat p{color:#a8b8b6;font-size:15px}
.feat{position:relative;overflow:hidden}
.feat::after{
  content:"";position:absolute;top:0;right:0;width:60px;height:60px;pointer-events:none;
  background:linear-gradient(135deg, transparent 50%, rgba(46,230,200,.18) 50%);
}
.feat--gold{background:linear-gradient(160deg, #2a1f04, #0e0a02);box-shadow:inset 0 0 0 1px #7a5a08}
.feat--gold .feat__icon{color:var(--gold);background:rgba(245,200,66,.12)}
.feat--gold h3{color:#fff5d2}
.feat--gold::after{background:linear-gradient(135deg, transparent 50%, rgba(245,200,66,.25) 50%)}
.feat--gold:hover{box-shadow:inset 0 0 0 1px var(--gold), 0 0 30px rgba(245,200,66,.2)}
.feat:hover{box-shadow:inset 0 0 0 1px var(--teal-dark), 0 0 30px rgba(46,230,200,.15);transition:box-shadow .25s}

/* =================== FEATURED / TICKET =================== */
.featured{display:grid;grid-template-columns:1.2fr .8fr;gap:48px;align-items:center}
.featured__left h2{font-family:var(--f-display);font-weight:900;font-size:clamp(28px, 3.6vw, 44px);line-height:1.05;color:var(--silver-2);margin:14px 0 18px}
.featured__left p{color:#bccbc9;font-size:17px;max-width:560px;margin-bottom:26px}
.ticket{
  background:linear-gradient(160deg, #07221f, #02100e);
  padding:22px 24px;
  clip-path:polygon(0 0,calc(100% - 22px) 0,100% 22px,100% calc(100% - 12px),calc(100% - 12px) 100%,12px 100%,0 calc(100% - 12px),0 12px);
  box-shadow:0 0 0 1px var(--line-2), 0 30px 60px rgba(0,0,0,.5);
  position:relative;
}
.ticket__head{display:flex;justify-content:space-between;border-bottom:1px dashed var(--line-2);padding-bottom:12px;font-size:11px}
.ticket__head .mono:first-child{color:var(--teal)}
.ticket__body{display:flex;flex-direction:column;gap:10px;padding:16px 0}
.ticket__row{display:flex;justify-content:space-between;font-size:13px;font-family:var(--f-mono);color:var(--silver-2)}
.ticket__row .mono{font-size:11px}
.ticket__bar{height:1px;background:repeating-linear-gradient(90deg, var(--line-2) 0 6px, transparent 6px 12px);margin:6px 0}
.ticket__foot{padding-top:12px;border-top:1px dashed var(--line-2);color:var(--gold);font-size:11px;text-align:center;letter-spacing:.18em}
@media(max-width:900px){.featured{grid-template-columns:1fr}}

/* =================== FAQ =================== */
.faq{display:flex;flex-direction:column;gap:10px;max-width:920px}
.faq__item{
  background:linear-gradient(160deg, #07221f, #03110f);
  box-shadow:inset 0 0 0 1px var(--line-2);
  clip-path:polygon(0 0,calc(100% - 12px) 0,100% 12px,100% 100%,12px 100%,0 calc(100% - 12px));
}
.faq__item summary{
  cursor:pointer;list-style:none;padding:18px 22px;
  font-family:var(--f-display);font-weight:700;letter-spacing:.04em;font-size:16px;color:var(--silver-2);
  display:flex;align-items:center;gap:14px;
  transition:color .15s;
}
.faq__item summary::-webkit-details-marker{display:none}
.faq__item summary .mono{color:var(--teal);font-size:11px;flex-shrink:0}
.faq__item summary::after{content:"+";margin-left:auto;color:var(--teal);font-size:22px;font-weight:300;transition:transform .2s}
.faq__item[open] summary::after{content:"−"}
.faq__item[open] summary{color:var(--teal-2)}
.faq__item p{padding:0 22px 20px 22px;color:#a8b8b6;font-size:15px;max-width:780px}
.faq__item a{color:var(--teal);border-bottom:1px solid var(--teal-dark)}

/* =================== CTA FINAL =================== */
.cta{position:relative;padding:120px 0;overflow:hidden;z-index:5}
.cta__inner{position:relative;text-align:center;display:flex;flex-direction:column;align-items:center;gap:18px}
.cta__bg{
  position:absolute;inset:-40px;z-index:-1;
  background:
    radial-gradient(600px 300px at 50% 50%, rgba(46,230,200,.18), transparent 70%),
    radial-gradient(400px 200px at 50% 60%, rgba(245,200,66,.12), transparent 70%);
}
.cta__title{font-family:var(--f-display);font-weight:900;font-size:clamp(32px, 5vw, 64px);line-height:1.05;color:var(--silver-2)}
.cta__sub{color:#bccbc9;font-size:18px;max-width:560px}
.cta__foot{margin-top:18px;color:var(--dim);font-size:11px;letter-spacing:.2em}

/* =================== FOOTER =================== */
.footer{border-top:1px solid var(--line);background:#02100e;position:relative;z-index:5;padding-top:50px}
.footer__inner{display:grid;grid-template-columns:1fr 2fr;gap:40px;padding-bottom:40px}
.footer__brand{display:flex;align-items:center;gap:14px}
.footer__cols{display:grid;grid-template-columns:repeat(3,1fr);gap:30px}
.footer__cols h4{color:var(--teal);font-size:11px;letter-spacing:.2em;margin-bottom:12px;font-weight:600}
.footer__cols a{display:block;color:var(--silver);opacity:.75;font-size:14.5px;padding:4px 0;transition:opacity .15s, color .15s}
.footer__cols a:hover{opacity:1;color:var(--teal)}
.footer__cols span.dim{font-size:13px;line-height:1.5}
.footer__bottom{border-top:1px solid var(--line);padding:18px 0;display:flex;justify-content:space-between;font-size:11px;color:var(--dim);width:min(1240px,92%)}
@media(max-width:800px){.footer__inner{grid-template-columns:1fr}.footer__cols{grid-template-columns:1fr;gap:18px}.footer__bottom{flex-direction:column;gap:6px;text-align:center}}

/* =================== SELECTION =================== */
/* =================== HERO BULLETS =================== */
.hero__bullets{list-style:none;display:flex;flex-direction:column;gap:8px;margin:0 0 28px;max-width:560px}
.hero__bullets li{display:flex;align-items:center;gap:12px;font-size:15.5px;color:#cfdedb}
.hero__bullets .ico{color:var(--teal);width:18px;height:18px;flex-shrink:0;background:rgba(46,230,200,.12);padding:3px;clip-path:polygon(0 0,calc(100% - 4px) 0,100% 4px,100% 100%,4px 100%,0 calc(100% - 4px))}

/* =================== LIVE PAYMENTS =================== */
.live{position:relative;z-index:5;padding:42px 0;border-bottom:1px solid var(--line);background:linear-gradient(180deg, transparent, rgba(46,230,200,.03), transparent)}
.live__head{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px;flex-wrap:wrap;gap:14px}
.live__metrics{display:flex;gap:18px;flex-wrap:wrap}
.live__metric{font-size:12px}
.live__metric strong{font-size:15px;letter-spacing:.05em}
.live__grid{display:grid;gap:8px}
.live__row{
  display:grid;grid-template-columns:60px 1.4fr 1.1fr .9fr .8fr;gap:14px;align-items:center;
  padding:12px 18px;background:linear-gradient(90deg, #061a18, #07221f, #061a18);
  font-size:13.5px;color:var(--silver);
  clip-path:polygon(0 0,calc(100% - 10px) 0,100% 10px,100% 100%,10px 100%,0 calc(100% - 10px));
  box-shadow:inset 0 0 0 1px var(--line-2);
  transition:box-shadow .3s;
}
.live__user{color:var(--silver-2);font-weight:600;font-family:var(--f-mono);font-size:13px;letter-spacing:.02em}
.live__bank{color:#fff5d2;font-size:12px;letter-spacing:.08em}
.live__amt{font-size:14.5px;font-weight:700}
.live__row .badge{padding:3px 10px;background:rgba(46,230,200,.1);color:var(--teal);font-size:10px;letter-spacing:.14em;clip-path:polygon(4px 0,100% 0,calc(100% - 4px) 100%,0 100%);text-align:center}
/* freshly-added row pop animation */
.live__row--fresh{
  box-shadow:inset 0 0 0 1px var(--gold), 0 0 28px rgba(245,200,66,.35);
  animation:liveFresh 3s ease-out;
}
@keyframes liveFresh{
  0%{box-shadow:inset 0 0 0 2px var(--gold), 0 0 50px rgba(245,200,66,.7);transform:translateX(-8px);opacity:0}
  20%{transform:translateX(0);opacity:1}
  100%{box-shadow:inset 0 0 0 1px var(--line-2)}
}

/* HISTORY TOGGLE */
.live__toggle{
  display:flex;align-items:center;gap:10px;
  margin-top:18px;width:100%;justify-content:center;
  padding:14px 22px;background:linear-gradient(90deg, rgba(46,230,200,.05), rgba(245,200,66,.06), rgba(46,230,200,.05));
  border:0;cursor:pointer;color:var(--silver-2);
  font-family:var(--f-display);font-weight:700;letter-spacing:.14em;font-size:12.5px;
  clip-path:polygon(0 0,calc(100% - 12px) 0,100% 12px,100% 100%,12px 100%,0 calc(100% - 12px));
  box-shadow:inset 0 0 0 1px rgba(245,200,66,.25);
  transition:background .25s, box-shadow .25s, color .25s;
}
.live__toggle:hover{background:linear-gradient(90deg, rgba(46,230,200,.1), rgba(245,200,66,.14), rgba(46,230,200,.1));color:#fff;box-shadow:inset 0 0 0 1px var(--gold), 0 0 20px rgba(245,200,66,.2)}
.live__toggle .ico{width:16px;height:16px;color:var(--gold);transition:transform .25s}
.live__toggle--open .ico{transform:rotate(180deg)}
.live__toggle .dim{font-size:10.5px;letter-spacing:.18em}

/* HISTORY PANEL */
.live__history[hidden]{display:none !important}
.live__history{
  margin-top:14px;display:grid;gap:6px;
  max-height:560px;overflow-y:auto;
  padding:14px 14px 18px;
  background:linear-gradient(180deg, rgba(46,230,200,.03), rgba(0,0,0,.3));
  border:1px solid var(--line-2);
  animation:histIn .35s ease-out;
}
@keyframes histIn{from{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}
.live__history::-webkit-scrollbar{width:6px}
.live__history::-webkit-scrollbar-thumb{background:var(--teal-dark);border-radius:3px}
.live__history::-webkit-scrollbar-track{background:rgba(0,0,0,.3)}
.live__hist-day{
  margin:10px 0 4px;font-size:10.5px;color:var(--gold);letter-spacing:.22em;
  padding:6px 10px;background:rgba(245,200,66,.07);border-left:2px solid var(--gold);
}
.live__hist-day:first-child{margin-top:0}
.live__row--hist{
  grid-template-columns:50px 60px 1.3fr 1.1fr .8fr .8fr;
  padding:9px 14px;font-size:12.5px;
  animation:none;
  background:linear-gradient(90deg, rgba(7,34,31,.6), rgba(6,26,24,.6));
}
.live__row--hist .live__user{font-size:12px}
.live__row--hist .live__bank{font-size:11px}
.live__row--hist .live__amt{font-size:13px}
.live__hist-empty{padding:30px;text-align:center;font-size:12px}

@media(max-width:800px){
  .live__row{grid-template-columns:auto 1fr auto;gap:6px 10px;font-size:12.5px}
  .live__row .live__bank{display:none}
  .live__row .badge{font-size:9.5px}
  .live__row--hist{grid-template-columns:40px 44px 1fr auto auto;gap:4px 8px}
  .live__row--hist .live__date{font-size:10px}
  .live__row--hist .live__time{font-size:10.5px}
  .live__row--hist .live__bank{display:none}
}

/* =================== TRUSTPILOT =================== */
.trust{
  position:relative;z-index:5;padding:60px 0;
  background:linear-gradient(180deg, rgba(46,230,200,.04), rgba(245,200,66,.04));
  border-block:1px solid var(--line-2);
}
.trust__inner{display:grid;grid-template-columns:1fr 1.1fr 1fr;gap:40px;align-items:center}
.trust__score{display:flex;flex-direction:column;gap:10px}
.trust__stars{display:flex;gap:4px}
.star{width:30px;height:30px;color:var(--gold);filter:drop-shadow(0 0 8px rgba(245,200,66,.5))}
.trust__num{display:flex;align-items:baseline;gap:6px;font-family:var(--f-display)}
.trust__num strong{font-size:54px;font-weight:900;color:var(--silver-2);line-height:1;background:linear-gradient(180deg, #fff, #b5c4c1);-webkit-background-clip:text;background-clip:text;color:transparent}
.trust__num span{font-size:22px;color:var(--dim)}
.trust__meta{display:flex;flex-direction:column;gap:4px;font-size:12px}
.trust__meta .mono:first-child{color:var(--gold);letter-spacing:.18em;font-weight:700;font-size:14px}
.trust__bars{display:flex;flex-direction:column;gap:8px}
.bar{display:grid;grid-template-columns:32px 1fr 50px;gap:12px;align-items:center;font-size:11px}
.bar__track{height:8px;background:var(--bg-3);position:relative;clip-path:polygon(0 0,calc(100% - 4px) 0,100% 100%,0 100%);box-shadow:inset 0 0 0 1px var(--line-2)}
.bar__track span{display:block;height:100%;background:linear-gradient(90deg, var(--teal-dark), var(--teal), var(--teal-2));box-shadow:0 0 8px rgba(46,230,200,.4)}
.bar:nth-child(1) .bar__track span{background:linear-gradient(90deg, #0d8e7d, var(--teal), var(--gold))}
.trust__badges{display:flex;flex-direction:column;gap:12px}
.tbadge{display:flex;align-items:center;gap:14px;padding:14px 16px;background:rgba(4,16,15,.6);clip-path:polygon(0 0,calc(100% - 10px) 0,100% 10px,100% 100%,10px 100%,0 calc(100% - 10px));box-shadow:inset 0 0 0 1px var(--line-2)}
.tbadge svg{width:30px;height:30px;color:var(--teal);flex-shrink:0}
.tbadge strong{font-family:var(--f-display);letter-spacing:.06em;color:var(--silver-2);font-size:14px;display:block}
.tbadge .mono{font-size:10px}
@media(max-width:1000px){
  .trust__inner{grid-template-columns:1fr;gap:24px}
}

/* =================== REVIEWS WALL =================== */
.section--reviews{
  background:
    radial-gradient(800px 400px at 100% 0%, rgba(46,230,200,.06), transparent 60%),
    radial-gradient(700px 350px at 0% 100%, rgba(245,200,66,.05), transparent 60%);
}
.section__head--center{margin-inline:auto;text-align:center;display:flex;flex-direction:column;align-items:center}
.logo-mark{
  width:64px;height:64px;margin-bottom:16px;object-fit:contain;
  filter:drop-shadow(0 0 18px rgba(46,230,200,.5)) drop-shadow(0 0 30px rgba(245,200,66,.2));
  animation:logoFloat 5s ease-in-out infinite;
}
.logo-mark--xl{width:120px;height:120px;margin-bottom:18px;filter:drop-shadow(0 0 30px rgba(46,230,200,.6)) drop-shadow(0 0 60px rgba(245,200,66,.3))}
@media(max-width:600px){
  .logo-mark{width:54px;height:54px;margin-bottom:12px}
  .logo-mark--xl{width:90px;height:90px}
}
.section__head--center .section__lead{margin-inline:auto}
.reviews{column-count:3;column-gap:18px}
@media(max-width:1000px){.reviews{column-count:2}}
@media(max-width:680px){.reviews{column-count:1}}
.review{
  break-inside:avoid;margin-bottom:18px;
  background:linear-gradient(160deg, #07221f 0%, #03110f 100%);
  padding:20px 20px 14px;
  clip-path:polygon(0 0,calc(100% - 14px) 0,100% 14px,100% 100%,14px 100%,0 calc(100% - 14px));
  box-shadow:inset 0 0 0 1px var(--line-2);
  display:flex;flex-direction:column;gap:12px;
  transition:transform .2s, box-shadow .2s;
}
.review:hover{transform:translateY(-2px);box-shadow:inset 0 0 0 1px var(--teal-dark), 0 16px 32px rgba(0,0,0,.45)}
.review--lg{
  background:linear-gradient(160deg, rgba(46,230,200,.08), #03110f);
  box-shadow:inset 0 0 0 1px var(--teal-dark);
}
.review--lg::before{content:"";display:block;height:3px;background:linear-gradient(90deg, var(--teal), var(--gold));margin:-20px -20px 0;clip-path:polygon(0 0,100% 0,calc(100% - 14px) 100%,0 100%)}
.review header{display:grid;grid-template-columns:auto 1fr auto;gap:12px;align-items:center}
.avatar{
  width:42px;height:42px;display:flex;align-items:center;justify-content:center;
  background:linear-gradient(135deg, var(--teal-dark), var(--teal));color:#021412;
  font-family:var(--f-display);font-weight:800;font-size:14px;letter-spacing:.04em;
  clip-path:polygon(0 0,calc(100% - 6px) 0,100% 6px,100% 100%,6px 100%,0 calc(100% - 6px));
}
.review--lg .avatar{background:linear-gradient(135deg, var(--gold), #c89a16);color:#1a0d00}
.review header strong{font-family:var(--f-display);font-size:14.5px;letter-spacing:.04em;color:var(--silver-2);display:block}
.review header .dim{font-size:10.5px;display:block;margin-top:2px}
.stars5,.stars4{display:flex;gap:2px}
.stars5::before,.stars4::before{
  content:"";display:inline-block;width:78px;height:14px;color:var(--gold);
  background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 78 14'><g fill='%23f5c842'><path d='M7 0l1.8 4.3L13 4.7l-3.3 2.8L11 12 7 9.6 3 12l1.3-4.5L1 4.7l4.2-.4z'/><path d='M23 0l1.8 4.3L29 4.7l-3.3 2.8L27 12l-4-2.4L19 12l1.3-4.5L17 4.7l4.2-.4z'/><path d='M39 0l1.8 4.3L45 4.7l-3.3 2.8L43 12l-4-2.4L35 12l1.3-4.5L33 4.7l4.2-.4z'/><path d='M55 0l1.8 4.3L61 4.7l-3.3 2.8L59 12l-4-2.4L51 12l1.3-4.5L49 4.7l4.2-.4z'/><path d='M71 0l1.8 4.3L77 4.7l-3.3 2.8L75 12l-4-2.4L67 12l1.3-4.5L65 4.7l4.2-.4z'/></g></svg>") no-repeat;
}
.stars4::before{
  background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 78 14'><g><path fill='%23f5c842' d='M7 0l1.8 4.3L13 4.7l-3.3 2.8L11 12 7 9.6 3 12l1.3-4.5L1 4.7l4.2-.4z'/><path fill='%23f5c842' d='M23 0l1.8 4.3L29 4.7l-3.3 2.8L27 12l-4-2.4L19 12l1.3-4.5L17 4.7l4.2-.4z'/><path fill='%23f5c842' d='M39 0l1.8 4.3L45 4.7l-3.3 2.8L43 12l-4-2.4L35 12l1.3-4.5L33 4.7l4.2-.4z'/><path fill='%23f5c842' d='M55 0l1.8 4.3L61 4.7l-3.3 2.8L59 12l-4-2.4L51 12l1.3-4.5L49 4.7l4.2-.4z'/><path fill='%235d7a76' d='M71 0l1.8 4.3L77 4.7l-3.3 2.8L75 12l-4-2.4L67 12l1.3-4.5L65 4.7l4.2-.4z'/></g></svg>") no-repeat;
}
/* Reviews collapsed state with fade */
.reviews--collapsed{position:relative;max-height:1100px;overflow:hidden}
.reviews--collapsed::after{
  content:"";position:absolute;left:0;right:0;bottom:0;height:200px;pointer-events:none;
  background:linear-gradient(180deg, transparent, #04100f 90%);
}
@media(max-width:600px){
  .reviews--collapsed{max-height:1700px}
}

.review p{font-size:14.5px;color:#bccbc9;line-height:1.55}
.review p strong{color:var(--silver-2)}
.review footer{padding-top:10px;border-top:1px dashed var(--line-2);font-size:10px;letter-spacing:.16em}
.reviews__more{display:flex;justify-content:center;margin-top:30px}

/* =================== FLOATING TELEGRAM CTA =================== */
.float-tg{
  position:fixed;bottom:24px;right:24px;z-index:80;
  display:inline-flex;align-items:center;gap:10px;
  padding:14px 22px;font-family:var(--f-display);font-weight:800;letter-spacing:.08em;text-transform:uppercase;
  font-size:13px;color:#021412;
  background:linear-gradient(135deg, var(--teal) 0%, var(--teal-dark) 100%);
  clip-path:polygon(0 0,calc(100% - 14px) 0,100% 14px,100% 100%,14px 100%,0 calc(100% - 14px));
  box-shadow:0 0 0 1px var(--teal-2), 0 0 28px rgba(46,230,200,.6), 0 12px 32px rgba(0,0,0,.5);
  animation:floatPulse 2s ease-in-out infinite;
  overflow:hidden;
}
.float-tg::before{
  content:"";position:absolute;top:0;left:-120%;width:60%;height:100%;
  background:linear-gradient(90deg, transparent, rgba(255,255,255,.5), transparent);
  transform:skewX(-20deg);animation:shine 2.6s ease-in-out infinite;
}
.float-tg svg{width:20px;height:20px}
.float-tg:hover{filter:brightness(1.1);transform:translateY(-2px) scale(1.02)}
.float-tg__dot{position:absolute;top:-4px;right:-4px;width:14px;height:14px;background:var(--gold);border-radius:50%;box-shadow:0 0 12px var(--gold);animation:blink 1s infinite}
@keyframes floatPulse{
  0%,100%{box-shadow:0 0 0 1px var(--teal-2), 0 0 24px rgba(46,230,200,.5), 0 12px 32px rgba(0,0,0,.5)}
  50%{box-shadow:0 0 0 1px var(--teal-2), 0 0 40px rgba(46,230,200,.85), 0 0 70px rgba(46,230,200,.4), 0 12px 32px rgba(0,0,0,.5)}
}
@media(max-width:600px){.float-tg{bottom:14px;right:14px;font-size:11px;padding:10px 16px}.float-tg__lbl{display:none}.float-tg svg{width:22px;height:22px}}

/* =================== CONTACT STRIPS =================== */
.cstrip{
  position:relative;z-index:5;padding:40px 0;overflow:hidden;
  background:linear-gradient(90deg, #02100e 0%, #052a26 50%, #02100e 100%);
  border-block:1px solid var(--teal-dark);
}
.cstrip::before, .cstrip::after{
  content:"";position:absolute;left:0;right:0;height:1px;
  background:linear-gradient(90deg, transparent, var(--teal), var(--gold), var(--teal), transparent);
  background-size:200% 100%;animation:bandSlide 4s linear infinite;
}
.cstrip::before{top:0}
.cstrip::after{bottom:0}
@keyframes bandSlide{0%{background-position:0% 0}100%{background-position:200% 0}}
.cstrip__inner{display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap}
.cstrip__msg{display:flex;align-items:center;gap:18px}
.cstrip__msg svg{width:42px;height:42px;color:var(--teal);flex-shrink:0;filter:drop-shadow(0 0 12px rgba(46,230,200,.6));animation:wobble 2.5s ease-in-out infinite}
@keyframes wobble{0%,100%{transform:rotate(-4deg)}50%{transform:rotate(4deg)}}
.cstrip__msg strong{display:block;font-family:var(--f-display);font-size:20px;letter-spacing:.04em;color:var(--silver-2);margin-bottom:4px}
.cstrip__msg .mono{color:var(--teal);font-size:11px;letter-spacing:.18em}
.cstrip--gold{background:linear-gradient(90deg, #02100e 0%, #2a1f04 50%, #02100e 100%);border-color:#7a5a08}
.cstrip--gold::before, .cstrip--gold::after{background:linear-gradient(90deg, transparent, var(--gold), var(--teal), var(--gold), transparent);background-size:200% 100%}
.cstrip--gold .cstrip__msg svg{color:var(--gold);filter:drop-shadow(0 0 12px rgba(245,200,66,.6))}
.cstrip--gold .cstrip__msg .mono{color:var(--gold)}

/* =================== ANIMATED ACCENTS =================== */
.line--teal, .line--gold{animation:textGlow 3.6s ease-in-out infinite}
@keyframes textGlow{
  0%,100%{filter:drop-shadow(0 0 14px rgba(46,230,200,.25))}
  50%{filter:drop-shadow(0 0 22px rgba(46,230,200,.55)) drop-shadow(0 0 40px rgba(46,230,200,.25))}
}
.line--gold{animation-name:textGlowGold;animation-delay:.6s}
@keyframes textGlowGold{
  0%,100%{filter:drop-shadow(0 0 14px rgba(245,200,66,.25))}
  50%{filter:drop-shadow(0 0 22px rgba(245,200,66,.55)) drop-shadow(0 0 40px rgba(245,200,66,.25))}
}

/* hero panel scan-line animation */
.hero__panel::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(180deg, transparent 0%, rgba(46,230,200,.18) 50%, transparent 100%);
  height:80px;animation:scanY 4s linear infinite;mix-blend-mode:screen;
}
@keyframes scanY{0%{transform:translateY(-80px)}100%{transform:translateY(560px)}}

/* card hover gradient border */
.card{position:relative}
.card::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(120deg, transparent 30%, rgba(46,230,200,.5) 50%, transparent 70%);
  background-size:300% 100%;background-position:200% 0;
  clip-path:polygon(0 0,calc(100% - 22px) 0,100% 22px,100% 100%,22px 100%,0 calc(100% - 22px));
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;
  padding:1px;opacity:0;transition:opacity .25s;
}
.card:hover::before{opacity:1;animation:borderShift 2s linear infinite}
@keyframes borderShift{0%{background-position:200% 0}100%{background-position:-200% 0}}

/* marquee glow on hover */
.marquee__track span:not(.sep){transition:color .2s, text-shadow .2s}
.marquee:hover .marquee__track{animation-play-state:paused}
.marquee__track span:not(.sep):hover{color:#fff;text-shadow:0 0 16px var(--gold)}

/* chip pulse */
.chip{animation:chipPulse 3s ease-in-out infinite}
.chip--gold{animation-delay:1.5s}
@keyframes chipPulse{
  0%,100%{box-shadow:inset 2px 0 0 var(--teal)}
  50%{box-shadow:inset 2px 0 0 var(--teal), 0 0 18px rgba(46,230,200,.25)}
}
.chip--gold{animation-name:chipPulseGold}
@keyframes chipPulseGold{
  0%,100%{box-shadow:inset 2px 0 0 var(--gold)}
  50%{box-shadow:inset 2px 0 0 var(--gold), 0 0 18px rgba(245,200,66,.3)}
}

/* live row enter animation */
.live__row{animation:liveIn .5s ease-out backwards}
.live__row:nth-child(1){animation-delay:0s}
.live__row:nth-child(2){animation-delay:.08s}
.live__row:nth-child(3){animation-delay:.16s}
.live__row:nth-child(4){animation-delay:.24s}
.live__row:nth-child(5){animation-delay:.32s}
.live__row:nth-child(6){animation-delay:.40s}
@keyframes liveIn{from{opacity:0;transform:translateX(-20px)}to{opacity:1;transform:translateX(0)}}

/* dot live extra glow */
.dot--live{animation:liveDot 1.4s ease-in-out infinite}
@keyframes liveDot{
  0%,100%{box-shadow:0 0 6px var(--teal), 0 0 0 0 rgba(46,230,200,.6)}
  70%{box-shadow:0 0 8px var(--teal), 0 0 0 8px rgba(46,230,200,0)}
}

/* CTA final - ring expanding */
.cta__bg{animation:bgPulse 5s ease-in-out infinite}
@keyframes bgPulse{0%,100%{opacity:.85}50%{opacity:1}}

/* stat number count-up shimmer */
.stat__num{background:linear-gradient(90deg, var(--silver-2), var(--teal), var(--silver-2));background-size:200% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:shimmer 4s linear infinite}
@keyframes shimmer{0%{background-position:0% 0}100%{background-position:200% 0}}

/* =================== MOBILE OVERHAUL =================== */
html, body{overflow-x:hidden;-webkit-text-size-adjust:100%}

/* Tablet & below */
@media(max-width:900px){
  .container{width:min(1240px,94%)}
  .section{padding:64px 0}
  .section__head{margin-bottom:36px}
  .section__lead{font-size:16px}
  .marquee__track{font-size:14px;gap:18px}
  .marquee{padding:12px 0}

  /* status bar - keep only essential */
  .status-bar__inner{gap:10px;font-size:10px;padding:6px 0;justify-content:center}
  .status-bar .mono{display:none}

  /* nav */
  .nav__inner{padding:10px 0;gap:10px}
  .brand__logo{width:42px;height:42px}
  .brand__name{font-size:17px}
  .brand__tag{display:none}
  .nav__cta{font-size:11px;padding:10px 14px;--b:10px}
  .nav__cta .ico{width:14px;height:14px}

  /* hero - mobile: LOGO (small banner) + TITLE + BUTTONS in first fold */
  .hero{padding:12px 0 28px}
  .hero__inner{display:flex;flex-direction:column;gap:8px}
  .hero__right{order:-1;display:flex;justify-content:center}
  .hero__panel{display:none}
  .hero__corner{display:none}
  .hero__logo-wrap{margin:0 auto 4px}
  .hero__logo-big{width:160px}
  .hero__logo-glow{inset:-20%}
  .hero__logo-rings{inset:-4%}
  .hero__chips{display:none}
  .hero__left{text-align:center}
  .hero__sub{margin-left:auto;margin-right:auto}
  .hero__stats{margin-left:auto;margin-right:auto}
  .hero__title{font-size:clamp(28px, 8vw, 52px);line-height:1;letter-spacing:0}
  .hero__sub{font-size:15px;margin:10px auto 16px;line-height:1.45;max-width:460px}
  .hero__ctas{gap:10px;margin-bottom:22px;flex-direction:column;align-items:stretch}
  .hero__ctas .btn{width:100%;justify-content:center;font-size:14px;padding:14px 18px}
  .hero__stats{grid-template-columns:repeat(2,1fr);gap:16px;padding-top:20px}
  .stat{align-items:center;text-align:center}
  .stat__num{font-size:22px}
  .stat__lbl{font-size:9.5px}

  /* live ticker mobile */
  .live{padding:30px 0}
  .live__head{margin-bottom:14px;gap:8px}
  .live__metric strong{font-size:14px}
  .live__row{
    grid-template-columns:46px 1fr auto;
    grid-template-areas:
      "time user amount"
      "time bank badge";
    gap:2px 10px;padding:10px 14px;font-size:13px;
  }
  .live__row .live__time{grid-area:time;align-self:center;font-size:11px}
  .live__row .live__user{grid-area:user;font-size:13px}
  .live__row .live__bank{grid-area:bank;display:block;font-size:10.5px;color:var(--gold);opacity:.85}
  .live__row .live__amt{grid-area:amount;justify-self:end;font-size:15px;font-weight:700}
  .live__row .badge{grid-area:badge;justify-self:end;font-size:9.5px;padding:2px 8px}

  /* steps & cards */
  .step{padding:22px}
  .step h3{font-size:16px}
  .step p{font-size:14px}
  .card{padding:22px}
  .card h3{font-size:16px}
  .card p{font-size:14px}
  .card__meta{font-size:12px}
  .feat{padding:22px}
  .feat h3{font-size:16px}
  .feat p{font-size:14px}

  /* callout */
  .callout{padding:18px 20px;gap:14px}
  .callout strong{font-size:14px}
  .callout p{font-size:13.5px}
  .callout .ico--lg{width:24px;height:24px}

  /* contact strips */
  .cstrip{padding:30px 0}
  .cstrip__inner{flex-direction:column;align-items:stretch;gap:18px;text-align:center}
  .cstrip__msg{flex-direction:column;text-align:center;gap:12px}
  .cstrip__msg svg{width:36px;height:36px}
  .cstrip__msg strong{font-size:16px;line-height:1.3}
  .cstrip__msg .mono{font-size:10px;display:block}
  .cstrip .btn{width:100%;justify-content:center;font-size:13px;padding:14px 18px}

  /* featured */
  .featured{gap:28px}
  .featured__left h2{font-size:26px}
  .featured__left p{font-size:15px}
  .featured__cta .btn{width:100%;justify-content:center}
  .ticket{padding:18px 20px}

  /* trust */
  .trust{padding:40px 0}
  .trust__inner{gap:24px;text-align:center}
  .trust__score{align-items:center}
  .trust__stars{justify-content:center}
  .star{width:24px;height:24px}
  .trust__num strong{font-size:42px}
  .trust__num span{font-size:18px}
  .tbadge{padding:12px 14px;gap:10px}
  .tbadge svg{width:24px;height:24px}
  .tbadge strong{font-size:12.5px}

  /* reviews */
  .section--reviews{padding:60px 0}
  .review{padding:18px 18px 12px;gap:10px}
  .review header{grid-template-columns:auto 1fr;gap:10px}
  .review header > .stars5,.review header > .stars4{grid-column:1 / -1}
  .review header strong{font-size:13.5px}
  .review header .dim{font-size:10px}
  .avatar{width:38px;height:38px;font-size:13px}
  .review p{font-size:13.5px;line-height:1.5}
  .review footer{font-size:9.5px;letter-spacing:.12em}

  /* faq */
  .faq__item summary{padding:18px 20px;font-size:14.5px}
  .faq__item div{padding:0 20px 18px;font-size:14px}

  /* CTA final */
  .cta{padding:70px 0}
  .cta__title{font-size:clamp(28px, 7.5vw, 44px)}
  .cta__sub{font-size:15px}
  .cta .btn--xl{width:100%;justify-content:center;font-size:14px;padding:16px 22px;--b:16px}

  /* footer */
  .footer{padding-top:36px}
  .footer__inner{padding-bottom:30px;gap:30px}
  .footer__cols{grid-template-columns:1fr 1fr;gap:24px}
  .footer__cols span.dim{grid-column:1 / -1;font-size:12.5px}

  /* floating button keeps space */
  body{padding-bottom:env(safe-area-inset-bottom)}
}

/* Phone */
@media(max-width:600px){
  .container{width:min(1240px,94%)}
  .section{padding:50px 0}
  .section__head{margin-bottom:28px}
  .section__title{font-size:clamp(24px, 7.5vw, 36px)}
  .kicker{font-size:10.5px;padding:5px 10px;margin-bottom:14px}

  /* status bar - just live indicator */
  .status-bar__inner{font-size:9.5px}
  .status-bar__item:nth-child(2){display:none}

  /* nav */
  .nav__inner{padding:8px 0}
  .brand__logo{width:36px;height:36px}
  .brand__name{font-size:15px;letter-spacing:.04em}
  .nav__cta span{display:none}
  .nav__cta{padding:9px 11px;--b:8px}
  .nav__cta .ico{width:16px;height:16px}

  /* hero */
  .hero{padding:24px 0 36px}
  .hero__inner{gap:28px}
  .hero__chips{margin-bottom:16px}
  .chip{font-size:9.5px;padding:7px 10px}
  .chip__id{display:none}
  .hero__title{font-size:clamp(24px, 7.5vw, 42px);letter-spacing:0}
  .hero__sub{font-size:15.5px;margin:16px 0 18px}
  .hero__bullets{margin-bottom:22px}
  .hero__bullets li{font-size:13.5px;gap:10px}
  .hero__bullets .ico{width:16px;height:16px}
  .hero__panel{padding:12px}
  .hero__mascot{max-width:55%;margin:8px auto}
  .hud-row,.hud-row .mono{font-size:10.5px}

  /* marquee */
  .marquee__track{font-size:12px;gap:14px;animation-duration:12s}

  /* live ticker */
  .live{padding:24px 0}
  .live .kicker{font-size:9.5px}
  .live__total{font-size:11px}
  .live__row{padding:10px 12px;font-size:12px}

  /* operación / oportunidades / pagos / protocolo */
  .step__num{font-size:14px}
  .pay{padding:14px;font-size:11px}
  .pay__icon{width:38px;height:38px}
  .pay__icon svg{width:24px;height:24px}

  /* contact strips */
  .cstrip{padding:24px 0}
  .cstrip__msg strong{font-size:15px}
  .cstrip__msg .mono{font-size:9.5px}
  .cstrip .btn{font-size:12px;padding:13px 16px;letter-spacing:.06em}

  /* trust */
  .trust{padding:32px 0}
  .star{width:22px;height:22px}
  .trust__num strong{font-size:36px}
  .bar{font-size:10px}

  /* reviews */
  .reviews{column-count:1;column-gap:0}
  .review{padding:16px 16px 10px}
  .review p{font-size:13px}

  /* CTA final */
  .cta{padding:54px 0}
  .cta__sub{font-size:14px}

  /* footer */
  .footer__cols{grid-template-columns:1fr}

  /* floating button */
  .float-tg{
    bottom:max(14px, env(safe-area-inset-bottom));right:14px;
    font-size:0;padding:14px;
    --b:12px;
  }
  .float-tg svg{width:24px;height:24px}
  .float-tg__lbl{display:none}
  .float-tg__dot{width:12px;height:12px;top:-3px;right:-3px}

  /* primary buttons mobile - tighter */
  .btn--lg{font-size:14px;padding:14px 20px;--b:14px}
  .btn--xl{font-size:15px;padding:16px 24px;--b:16px}

  /* prevent ring pulse from causing horizontal scroll */
  .btn--primary::after{display:none}
}

/* Very small phones */
@media(max-width:380px){
  .hero__title{font-size:24px;letter-spacing:0}
  .section__title{font-size:24px}
  .brand__text{display:none}
  .status-bar__item:nth-child(4){display:none}
  .live__row{font-size:11.5px;padding:9px 10px}
  .live__row .live__amt{font-size:13.5px}
}

/* Reduce motion */
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important}
}

::selection{background:var(--teal);color:#021412}
::-webkit-scrollbar{width:10px;height:10px}
::-webkit-scrollbar-track{background:#02100e}
::-webkit-scrollbar-thumb{background:var(--line-2);border-radius:0}
::-webkit-scrollbar-thumb:hover{background:var(--teal-dark)}