/* ═══════════════════════════════════════
   EXTAFLOW® — SHARED STYLES
   Usada por todas las páginas del sitio
═══════════════════════════════════════ */

@import url('https://fonts.googleapis.com/css2?family=Bebas+Neue&family=Barlow+Condensed:ital,wght@0,300;0,400;0,600;0,700;0,900;1,400;1,700&family=DM+Sans:ital,wght@0,300;0,400;0,500;1,300;1,400&display=swap');

*{margin:0;padding:0;box-sizing:border-box}
:root{
  --ef:#CCFF00;
  --ef-dim:#99c400;
  --ef-glow:rgba(204,255,0,.35);
  --ef-soft:rgba(204,255,0,.08);
  --bt:#FF5500;
  --bt-glow:rgba(255,85,0,.35);
  --bt-soft:rgba(255,85,0,.08);
  --black:#070707;
  --dark:#0d0d0d;
  --card:#131313;
  --mid:#1a1a1a;
  --border:rgba(255,255,255,.07);
  --border-ef:rgba(204,255,0,.18);
  --border-bt:rgba(255,85,0,.18);
  --text:#e8e8e8;
  --muted:rgba(255,255,255,.42);
  --faint:rgba(255,255,255,.05);
}
html{scroll-behavior:smooth}
body{background:var(--black);color:var(--text);font-family:'DM Sans',sans-serif;overflow-x:hidden}

/* ── NAV ── */
nav{position:fixed;top:0;width:100%;z-index:500;height:72px;display:flex;align-items:center;justify-content:space-between;padding:0 3rem;background:rgba(7,7,7,.92);backdrop-filter:blur(24px);border-bottom:1px solid var(--border)}
.nav-logo{font-family:'Bebas Neue',sans-serif;font-size:1.75rem;letter-spacing:.14em;color:var(--ef);text-shadow:0 0 24px var(--ef-glow);text-decoration:none}
.nav-logo sup{font-size:.5em;vertical-align:super;letter-spacing:0}
.nav-menu{display:flex;gap:0;align-items:center;height:72px}
.nav-item{position:relative;height:100%;display:flex;align-items:center}
.nav-link{text-decoration:none;font-family:'Barlow Condensed',sans-serif;font-size:.82rem;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--muted);padding:0 1.2rem;height:100%;display:flex;align-items:center;transition:color .2s;position:relative}
.nav-link::after{content:'';position:absolute;bottom:0;left:0;width:0;height:2px;background:var(--ef);transition:width .3s}
.nav-link:hover{color:#fff}
.nav-link:hover::after,.nav-link.active::after{width:100%}
.nav-link.active{color:#fff}
.nav-link.bt-link::after{background:var(--bt)}
.nav-link.bt-link:hover{color:var(--bt)}

/* Dropdown */
.nav-item:hover .nav-drop{display:block}
.nav-drop{display:none;position:absolute;top:72px;left:0;min-width:220px;background:rgba(13,13,13,.98);border:1px solid var(--border);border-top:2px solid var(--ef);z-index:100}
.nav-drop a{display:block;padding:.85rem 1.4rem;font-family:'Barlow Condensed',sans-serif;font-size:.82rem;font-weight:600;letter-spacing:.15em;text-transform:uppercase;color:var(--muted);text-decoration:none;border-bottom:1px solid var(--border);transition:all .2s}
.nav-drop a:last-child{border-bottom:none}
.nav-drop a:hover{color:var(--ef);background:var(--ef-soft);padding-left:1.8rem}

.nav-ctas{display:flex;gap:.6rem;align-items:center;margin-left:1.5rem}
.nav-btn{font-family:'Barlow Condensed',sans-serif;font-size:.78rem;font-weight:700;letter-spacing:.18em;text-transform:uppercase;text-decoration:none;padding:.5rem 1.4rem;border-radius:2px;transition:all .25s;white-space:nowrap}
.nav-btn.ghost{border:1px solid var(--border);color:rgba(255,255,255,.5)}
.nav-btn.ghost:hover{border-color:rgba(255,255,255,.3);color:#fff}
.nav-btn.ef{background:var(--ef);color:var(--black)}
.nav-btn.ef:hover{box-shadow:0 0 25px var(--ef-glow);transform:translateY(-1px)}
.nav-btn.bt{background:var(--bt);color:#fff}
.nav-btn.bt:hover{box-shadow:0 0 25px var(--bt-glow);transform:translateY(-1px)}

/* Mobile nav toggle */
.nav-hamburger{display:none;flex-direction:column;gap:5px;cursor:pointer;padding:.5rem}
.nav-hamburger span{width:24px;height:1.5px;background:#fff;transition:all .3s}
.nav-mobile{display:none;position:fixed;top:72px;left:0;width:100%;background:rgba(7,7,7,.98);border-bottom:1px solid var(--border);z-index:499;padding:1.5rem;flex-direction:column;gap:.5rem}
.nav-mobile a{display:block;padding:.9rem 1rem;font-family:'Barlow Condensed',sans-serif;font-size:.9rem;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--muted);text-decoration:none;border-bottom:1px solid var(--border)}
.nav-mobile a:hover{color:var(--ef)}

/* ── PAGE HEADER ── */
.page-header{padding:10rem 3rem 5rem;position:relative;overflow:hidden;border-bottom:1px solid var(--border)}
.page-header-bg{position:absolute;inset:0}
.page-header-content{position:relative;z-index:2;max-width:1280px;margin:0 auto}
.page-eb{font-family:'Barlow Condensed',sans-serif;font-size:.72rem;font-weight:600;letter-spacing:.42em;text-transform:uppercase;display:flex;align-items:center;gap:.8rem;margin-bottom:1.2rem}
.page-eb::before{content:'';width:28px;height:1.5px}
.page-eb.ef{color:var(--ef)}.page-eb.ef::before{background:var(--ef)}
.page-eb.bt{color:var(--bt)}.page-eb.bt::before{background:var(--bt)}
.page-eb.wh{color:rgba(255,255,255,.3)}.page-eb.wh::before{background:rgba(255,255,255,.2)}
.page-title{font-family:'Bebas Neue',sans-serif;font-size:clamp(4rem,9vw,9rem);line-height:.88;letter-spacing:.03em;color:#fff}
.page-title .hl-ef{color:var(--ef);text-shadow:0 0 60px var(--ef-glow)}
.page-title .hl-bt{color:var(--bt);text-shadow:0 0 60px var(--bt-glow)}
.page-desc{font-size:1.05rem;line-height:1.75;color:var(--muted);max-width:580px;margin-top:1.5rem;font-style:italic}

/* ── IMAGE PLACEHOLDER ── */
.img-ph{background:var(--mid);border:1px dashed rgba(255,255,255,.12);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.8rem;position:relative;overflow:hidden;border-radius:3px}
.img-ph::before{content:'';position:absolute;inset:0;background:linear-gradient(135deg,rgba(204,255,0,.02) 0%,transparent 50%,rgba(255,85,0,.02) 100%)}
.img-ph-icon{font-family:'Bebas Neue',sans-serif;font-size:2rem;color:rgba(255,255,255,.1);letter-spacing:.1em}
.img-ph-label{font-family:'Barlow Condensed',sans-serif;font-size:.65rem;font-weight:600;letter-spacing:.25em;text-transform:uppercase;color:rgba(255,255,255,.15);text-align:center;padding:0 1rem}
.img-ph-hint{font-size:.7rem;color:rgba(255,255,255,.08);font-style:italic}
.img-ph.ef-ph{border-color:rgba(204,255,0,.12)}
.img-ph.bt-ph{border-color:rgba(255,85,0,.12)}

/* ── SECTION UTILS ── */
section.sec{padding:6rem 3rem}
section.sec.dark{background:var(--dark)}
section.sec.black{background:var(--black)}
.wrap{max-width:1280px;margin:0 auto}
.sec-div{height:1px;background:var(--border)}

.eb{font-family:'Barlow Condensed',sans-serif;font-size:.72rem;font-weight:600;letter-spacing:.42em;text-transform:uppercase;display:flex;align-items:center;gap:.8rem;margin-bottom:1.4rem}
.eb::before{content:'';width:28px;height:1.5px}
.eb.ef{color:var(--ef)}.eb.ef::before{background:var(--ef)}
.eb.bt{color:var(--bt)}.eb.bt::before{background:var(--bt)}
.eb.wh{color:rgba(255,255,255,.3)}.eb.wh::before{background:rgba(255,255,255,.2)}
.stitle{font-family:'Bebas Neue',sans-serif;font-size:clamp(2.8rem,5vw,5rem);line-height:.9;letter-spacing:.03em}

/* ── BUTTONS ── */
.btn{display:inline-flex;align-items:center;gap:.65rem;padding:.95rem 2.2rem;font-family:'Barlow Condensed',sans-serif;font-weight:700;font-size:.9rem;letter-spacing:.2em;text-transform:uppercase;text-decoration:none;border-radius:2px;transition:all .28s;border:none;cursor:pointer}
.btn.ef{background:var(--ef);color:var(--black)}
.btn.ef:hover{box-shadow:0 0 40px var(--ef-glow);transform:translateY(-2px)}
.btn.bt{background:var(--bt);color:#fff}
.btn.bt:hover{box-shadow:0 0 40px var(--bt-glow);transform:translateY(-2px)}
.btn.outline{background:transparent;color:rgba(255,255,255,.6);border:1px solid rgba(255,255,255,.18)}
.btn.outline:hover{border-color:rgba(255,255,255,.4);color:#fff}
.btn.outline-ef{background:transparent;color:var(--ef);border:1px solid rgba(204,255,0,.3)}
.btn.outline-ef:hover{background:var(--ef-soft)}
.btn.outline-bt{background:transparent;color:var(--bt);border:1px solid rgba(255,85,0,.3)}
.btn.outline-bt:hover{background:var(--bt-soft)}
.btn-arr{transition:transform .2s}
.btn:hover .btn-arr{transform:translateX(4px)}

/* ── CARDS ── */
.card-grid-2{display:grid;grid-template-columns:1fr 1fr;gap:1.5px;background:var(--border);border:1px solid var(--border);border-radius:4px;overflow:hidden}
.card-grid-3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:1.5px;background:var(--border);border:1px solid var(--border);border-radius:4px;overflow:hidden}
.card-grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:1.5px;background:var(--border);border:1px solid var(--border);border-radius:4px;overflow:hidden}
.g-card{background:var(--card);transition:background .3s;padding:2rem 1.8rem}
.g-card:hover{background:var(--mid)}

/* ── TICKER ── */
.ticker{overflow:hidden;padding:.65rem 0}
.ticker.ef-t{background:var(--ef)}
.ticker.bt-t{background:var(--bt)}
.ticker-track{display:flex;white-space:nowrap;animation:tickroll 28s linear infinite}
.bt-t .ticker-track{animation-direction:reverse;animation-duration:22s}
.tick-item{font-family:'Bebas Neue',sans-serif;font-size:1.1rem;letter-spacing:.22em;padding:0 2.5rem;display:inline-flex;align-items:center;gap:2rem}
.ef-t .tick-item{color:var(--black)}
.bt-t .tick-item{color:#fff}
.tick-dot{width:5px;height:5px;border-radius:50%;display:inline-block;flex-shrink:0}
.ef-t .tick-dot{background:rgba(0,0,0,.22)}
.bt-t .tick-dot{background:rgba(255,255,255,.28)}
@keyframes tickroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* ── REVEAL ── */
.rv{opacity:0;transform:translateY(24px);transition:opacity .65s ease,transform .65s ease}
.rv.in{opacity:1;transform:none}
.rv-d1{transition-delay:.1s}.rv-d2{transition-delay:.2s}.rv-d3{transition-delay:.3s}.rv-d4{transition-delay:.4s}

/* ── FOOTER ── */
footer{background:var(--dark);border-top:1px solid var(--border);padding:4rem 3rem 0}
.foot-grid{max-width:1280px;margin:0 auto;display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:3rem;padding-bottom:3rem;border-bottom:1px solid var(--border)}
.foot-brand .foot-logo{font-family:'Bebas Neue',sans-serif;font-size:2.2rem;color:var(--ef);letter-spacing:.14em;text-shadow:0 0 20px var(--ef-glow);display:block;text-decoration:none;margin-bottom:1rem}
.foot-brand .foot-logo sup{font-size:.5em;vertical-align:super;letter-spacing:0}
.foot-brand p{font-size:.83rem;color:var(--muted);line-height:1.7;max-width:230px}
.foot-col h5{font-family:'Barlow Condensed',sans-serif;font-size:.62rem;font-weight:600;letter-spacing:.32em;text-transform:uppercase;color:rgba(255,255,255,.2);margin-bottom:1.2rem}
.foot-col ul{list-style:none;display:flex;flex-direction:column;gap:.55rem}
.foot-col ul li a{text-decoration:none;font-size:.84rem;color:rgba(255,255,255,.4);transition:color .2s}
.foot-col ul li a:hover{color:#fff}
.foot-col ul li a.ef:hover{color:var(--ef)}
.foot-col ul li a.bt:hover{color:var(--bt)}
.foot-bottom{max-width:1280px;margin:0 auto;padding:1.5rem 0;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:1rem}
.foot-copy{font-family:'Barlow Condensed',sans-serif;font-size:.62rem;letter-spacing:.15em;text-transform:uppercase;color:rgba(255,255,255,.18)}
.foot-socials{display:flex;gap:.5rem}
.soc{width:34px;height:34px;border:1px solid var(--border);border-radius:2px;display:flex;align-items:center;justify-content:center;text-decoration:none;font-family:'Barlow Condensed',sans-serif;font-size:.7rem;font-weight:700;color:rgba(255,255,255,.28);transition:all .2s}
.soc:hover{border-color:var(--ef);color:var(--ef)}

/* ── FORM ── */
.f-g{display:flex;flex-direction:column;gap:.4rem}
.f-lbl{font-family:'Barlow Condensed',sans-serif;font-size:.62rem;font-weight:600;letter-spacing:.25em;text-transform:uppercase;color:var(--muted)}
.f-inp{background:var(--mid);border:1px solid var(--border);color:#fff;padding:.9rem 1rem;font-family:'DM Sans',sans-serif;font-size:.87rem;border-radius:2px;outline:none;width:100%;transition:border-color .2s}
.f-inp:focus{border-color:var(--ef)}
.f-inp::placeholder{color:rgba(255,255,255,.2)}
.f-sel{background:var(--mid);border:1px solid var(--border);color:rgba(255,255,255,.6);padding:.9rem 1rem;font-family:'DM Sans',sans-serif;font-size:.87rem;border-radius:2px;outline:none;width:100%;cursor:pointer;appearance:none;background-image:url("data:image/svg+xml,%3Csvg width='10' height='6' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1l4 4 4-4' stroke='rgba(255,255,255,0.3)' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 1rem center}

/* ── RESPONSIVE ── */
/* ── TABLET ── */
@media(max-width:1024px){
  nav{padding:0 1.5rem}
  .nav-menu,.nav-ctas{display:none}
  .nav-hamburger{display:flex}
  .nav-mobile.open{display:flex}
  section.sec{padding:4rem 1.5rem}
  .page-header{padding:8rem 1.5rem 4rem}
  footer{padding:3rem 1.5rem 0}
  .foot-grid{grid-template-columns:1fr 1fr;gap:2rem}
  .card-grid-2,.card-grid-3,.card-grid-4{grid-template-columns:1fr}
}

/* ── MOBILE ── */
@media(max-width:640px){
  nav{height:60px;padding:0 1.2rem}
  .nav-logo{font-size:1.4rem}
  .nav-mobile a{font-size:.82rem;padding:.85rem 1rem}
  section.sec{padding:3rem 1.2rem}
  .page-header{padding:7rem 1.2rem 3rem}
  .stitle{font-size:clamp(2.2rem,9vw,3.5rem)!important}
  .ticker{padding:.5rem 0}
  .tick-item{font-size:.9rem;padding:0 1.5rem;gap:1.2rem}
  footer{padding:2.5rem 1.2rem 0}
  .foot-grid{grid-template-columns:1fr;gap:1.5rem}
  .foot-bottom{flex-direction:column;text-align:center;padding:1.2rem 0}
  .btn{padding:.8rem 1.5rem;font-size:.78rem;letter-spacing:.15em}
  .eb,.page-eb{font-size:.62rem;letter-spacing:.28em}
  .hero-side-stats,.hero-scroll{display:none!important}
}