:root{
  --bg:#10131A; --bg2:#13172A; --surf:#161B2A;
  --line:rgba(133,156,199,.14); --line2:rgba(133,156,199,.28);
  --blue-d:#2C378A; --blue:#3D55C4; --blue-l:#5A7AE0; --blue-g:#859CC7;
  --acc:#47E5A0; --warn:#F5A623; --red:#E55555;
  --tx:#DDE4F5; --tx2:#8A99BF; --tx3:#6B7A9E;
  --mono: ui-monospace, "SF Mono", "Cascadia Code", Consolas, monospace;
  --sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{background:var(--bg);color:var(--tx);font-family:var(--sans);line-height:1.6;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
button{font-family:inherit;cursor:pointer;background:none;border:none;color:inherit}
img{max-width:100%;display:block}
.wrap{max-width:1080px;margin:0 auto;padding:0 20px}
::selection{background:var(--blue-d);color:#fff}

.skip{position:absolute;left:-999px;top:0;background:var(--acc);color:#0a0f08;padding:10px 16px;z-index:1000;font-weight:700;border-radius:0 0 6px 0}
.skip:focus{left:0}
:focus-visible{outline:2px solid var(--acc);outline-offset:2px}

/* NAV */
header{
  position:sticky;
  top:0;
  z-index:100;

  background:rgba(16,19,26,.65);

  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);

  border-bottom:1px solid rgba(133,156,199,.10);
}
.navrow{display:flex;align-items:center;justify-content:space-between;height:60px}
.brand{display:flex;align-items:baseline;gap:8px;font-weight:700;font-size:1.05rem;letter-spacing:-.01em}
.brand .b1{color:var(--tx)} .brand .b2{color:var(--acc)}
.brand small{font-family:var(--mono);font-size:.62rem;color:var(--tx3);font-weight:600;letter-spacing:.06em}
nav ul{list-style:none;display:flex;gap:24px;align-items:center}
nav a{font-size:.86rem;color:var(--tx2);transition:color .15s}
nav a:hover{color:var(--tx)}
nav .active-link{color:var(--tx)}
.navcta{
  color:var(--acc)!important;
  font-weight:600;

  padding:7px 12px;
  border:1px solid rgba(71,229,160,.25);
  border-radius:6px;

  background:rgba(71,229,160,.05);
}
.navcta:hover{
  background:rgba(71,229,160,.10);
  border-color:rgba(71,229,160,.45);
}
.has-dd{position:relative}
/* ═══ SERVICES DROPDOWN ═══ */

.has-dd{
  position:relative;
}

.dd{
  position:absolute;
  top:100%;
  left:0;

  background:var(--bg2);
  border:1px solid var(--line);
  border-radius:8px;

  width:190px;
  min-width:190px;
  padding:5px;

  display:none;
  flex-direction:column;

  box-shadow:0 12px 30px rgba(0,0,0,.25);
  z-index:1000;
}

.has-dd:hover .dd,
.has-dd:focus-within .dd{
  display:flex;
}

.dd a{
  padding:7px 10px;
  border-radius:6px;
  font-size:.78rem;
  line-height:1.2;
}

.dd a:hover{
  background:var(--surf);
  color:var(--tx);
}

.has-dd:hover .dd,
.has-dd:focus-within .dd{
  display:flex;
  opacity:1;
  transform:translateX(-50%) translateY(0);
}

.dd-service{
  display:flex;
  align-items:center;
  gap:12px;

  padding:10px;
  border-radius:9px;

  transition:
    background .18s ease,
    transform .18s ease;
}

.dd-service img{
  width:38px;
  height:38px;
  border-radius:8px;
  object-fit:cover;
  flex-shrink:0;

  transition:transform .18s ease;
}

.dd-service span{
  display:flex;
  flex-direction:column;
  min-width:0;
}

.dd-service strong{
  font-size:.82rem;
  color:var(--tx);
  font-weight:600;
  line-height:1.3;
}

.dd-service small{
  color:var(--tx3);
  font-size:.68rem;
  margin-top:2px;
}

.dd-service:hover{
  background:rgba(133,156,199,.08);
  transform:translateX(3px);
}

.dd-service:hover img{
  transform:scale(1.08);
}

.dd-service:hover strong{
  color:#fff;
}
.burger{display:none;width:32px;height:32px;flex-direction:column;justify-content:center;gap:5px}
.burger span{display:block;height:2px;background:var(--tx);border-radius:1px}
.mobmenu{display:none}

/* ═══════════════════════════════════════════════════════════════
   HERO + SHOWCASE — EXPERIENCIA VISUAL CONTINUA
   ═══════════════════════════════════════════════════════════════ */

.hero-intro{
  position:relative;
  overflow:hidden;
}

/* ───────────────────────────────────────────────────────────────
   FONDO COMPARTIDO
   ─────────────────────────────────────────────────────────────── */

.hero-bg{
  position:absolute;
  inset:0;

  z-index:0;

  pointer-events:none;
  overflow:hidden;
}

.hero-bg-img{
  width:100%;
  height:100%;

  object-fit:cover;

  filter:blur(3px);
  transform:scale(1.03);

  opacity:.30;
}

.hero-bg-overlay{
  position:absolute;
  inset:0;

  z-index:1;

  background:
    linear-gradient(
      to bottom,
      rgba(16,19,26,.15) 0%,
      rgba(16,19,26,.25) 25%,
      rgba(16,19,26,.45) 50%,
      rgba(16,19,26,.72) 72%,
      var(--bg) 100%
    );
}

/* ───────────────────────────────────────────────────────────────
   HERO
   ─────────────────────────────────────────────────────────────── */

.hero{
  position:relative;
  padding:110px 0 90px;
  background:transparent;
  border-bottom:none;
  text-align:center;
}

.hero-content{
  position:relative;
  z-index:3;

  display:flex;
  flex-direction:column;
  align-items:center;
}

.hero-eyebrow{
  display:flex;
  align-items:center;
  gap:9px;

  margin-bottom:24px;

  font-family:var(--mono);
  font-size:12px;
  font-weight:600;
  letter-spacing:.12em;
  color:var(--blue-g);
}

.hero-eyebrow .dot{
  width:7px;
  height:7px;
  border-radius:50%;
  background:var(--acc);
  box-shadow:0 0 12px rgba(71,229,160,.55);
}

.hero h1{
  max-width:1000px;
  margin:0 auto;

  font-size:clamp(56px, 7vw, 96px);
  line-height:.98;
  letter-spacing:-.055em;
  font-weight:750;

  color:var(--tx);

  text-wrap:balance;
}

.hero-lede{
  max-width:620px;
  margin:30px auto 0;

  font-size:20px;
  line-height:1.6;

  color:var(--tx2);
}

.hero-actions{
  display:flex;
  justify-content:center;
  gap:12px;

  margin-top:34px;
}

.hero-trust{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:12px;

  margin-top:28px;

  font-size:13px;
  color:var(--tx3);
}

.hero-separator{
  opacity:.5;
}

.hero > .wrap{
  position:relative;
  z-index:3;
}

/* Orb decorativo */

.hero::before{
  content:"";

  position:absolute;

  width:500px;
  height:500px;

  top:-250px;
  right:-180px;

  border-radius:50%;

  border:1px solid rgba(90,122,224,.08);

  animation:heroOrb 12s ease-in-out infinite;

  pointer-events:none;
}

/* Glow decorativo */

.hero::after{
  content:"";

  position:absolute;

  width:300px;
  height:300px;

  bottom:-180px;
  left:-120px;

  border-radius:50%;

  background:rgba(61,85,196,.06);

  filter:blur(50px);

  animation:heroGlow 9s ease-in-out infinite alternate;

  pointer-events:none;
}

/* ───────────────────────────────────────────────────────────────
   SHOWCASE
   ─────────────────────────────────────────────────────────────── */

.abyb-showcase{
  position:relative;

  padding-top:70px;
  padding-bottom:100px;

  background:transparent;

  border-top:none;
  border-bottom:none;
}

.abyb-showcase > .wrap{
  position:relative;
  z-index:3;
}

/* ───────────────────────────────────────────────────────────────
   ANIMACIONES HERO
   ─────────────────────────────────────────────────────────────── */

@keyframes heroOrb{
  0%,100%{
    transform:translate(0,0) scale(1);
  }

  50%{
    transform:translate(-30px,25px) scale(1.08);
  }
}

@keyframes heroGlow{
  from{
    transform:translate(0,0);
  }

  to{
    transform:translate(80px,-40px);
  }
}
.hero-eyebrow{font-family:var(--mono);font-size:.72rem;color:var(--acc);letter-spacing:.04em;margin-bottom:18px;display:flex;align-items:center;gap:8px}
.hero-eyebrow .dot{width:6px;height:6px;border-radius:50%;background:var(--acc);flex-shrink:0}
@media (prefers-reduced-motion:no-preference){.hero-eyebrow .dot{animation:pulse 2.4s ease-in-out infinite}}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.35}}
.breadcrumb{font-family:var(--mono);font-size:.72rem;color:var(--tx3);margin-bottom:16px}
.breadcrumb a{color:var(--tx2)} .breadcrumb a:hover{color:var(--tx)}
h1{font-size:clamp(1.7rem,4vw,2.7rem);font-weight:700;letter-spacing:-.02em;line-height:1.1;max-width:20ch;margin-bottom:18px}
h1 em{font-style:normal;color:var(--blue-l)}
.hero-lede{font-size:1rem;color:var(--tx2);max-width:52ch;margin-bottom:28px}
.hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:36px}
.btn{display:inline-flex;align-items:center;gap:8px;padding:12px 22px;border-radius:6px;font-size:.9rem;font-weight:600;transition:background .15s,border-color .15s,color .15s}
.btn-primary{background:var(--blue);color:#fff} .btn-primary:hover{background:var(--blue-l)}
.btn-outline{border:1px solid var(--line2);color:var(--tx)} .btn-outline:hover{border-color:var(--blue-g);background:rgba(133,156,199,.06)}
.btn-wa{background:#1f9e56;color:#fff} .btn-wa:hover{background:#26b863}
.btn-dc{background:rgba(88,101,242,.14);color:#8b95f5;border:1px solid rgba(88,101,242,.3)} .btn-dc:hover{background:rgba(88,101,242,.24);color:#fff}
.btn-dead{background:transparent;border:1px solid rgba(229,85,85,.3);color:var(--red);cursor:not-allowed}

.honest-strip{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  border:1px solid var(--line);
  border-radius:8px;
  overflow:hidden;

  background:rgba(19,23,42,.65);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
}
.honest-cell{padding:16px 18px;border-right:1px solid var(--line)}
.honest-cell:last-child{border-right:none}
.honest-k{font-family:var(--mono);font-size:.66rem;color:var(--tx3);text-transform:uppercase;letter-spacing:.05em;margin-bottom:6px}
.honest-v{font-size:.86rem;color:var(--tx2)} .honest-v b{color:var(--tx);font-weight:600}

/* SECTIONS */
.sec{padding:56px 0;border-bottom:1px solid var(--line)}
.sec-head{display:flex;align-items:baseline;justify-content:space-between;gap:20px;flex-wrap:wrap;margin-bottom:28px}
.sec-num{font-family:var(--mono);font-size:.72rem;color:var(--tx3)}
.sec-title{font-size:1.4rem;font-weight:700;letter-spacing:-.01em;margin-top:4px}
.sec-note{font-size:.86rem;color:var(--tx2);max-width:40ch}

/* PLANS */
.plans-controls{display:flex;justify-content:flex-end;align-items:center;flex-wrap:wrap;gap:16px;margin-bottom:20px}
.curr{display:flex;border:1px solid var(--line);border-radius:6px;overflow:hidden;font-family:var(--mono);font-size:.76rem}
.curr button{padding:8px 14px;color:var(--tx3);font-weight:600}
.curr button.active{background:var(--blue-d);color:var(--blue-l)}
.notice{font-size:.82rem;color:var(--tx2);background:var(--surf);border:1px solid var(--line);border-left:2px solid var(--warn);border-radius:0 6px 6px 0;padding:12px 16px;margin-bottom:24px}
.notice b{color:var(--tx)}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:1px;background:var(--line);border:1px solid var(--line);border-radius:10px;overflow:hidden}
.card{background:var(--bg2);padding:24px;display:flex;flex-direction:column}
.card.popular{background:var(--surf)}
.card-top{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:14px}
.card-name{font-weight:700;font-size:1.05rem}
.card-sub{font-family:var(--mono);font-size:.72rem;color:var(--tx3);margin-top:2px}
.tag-pop{font-family:var(--mono);font-size:.62rem;color:var(--blue-l);border:1px solid rgba(90,122,224,.4);padding:2px 8px;border-radius:100px;text-transform:uppercase;letter-spacing:.04em;white-space:nowrap}
.avail{display:flex;align-items:center;gap:6px;font-family:var(--mono);font-size:.72rem;margin-bottom:16px}
.avail .dot{width:6px;height:6px;border-radius:50%}
.avail.ok{color:var(--acc)} .avail.ok .dot{background:var(--acc)}
.avail.low{color:var(--warn)} .avail.low .dot{background:var(--warn)}
.avail.out{color:var(--red)} .avail.out .dot{background:var(--red)}
.price{display:flex;align-items:baseline;gap:4px;margin-bottom:2px;font-variant-numeric:tabular-nums}
.price .sym{font-size:.9rem;color:var(--tx2)}
.price .num{font-size:2rem;font-weight:700;letter-spacing:-.02em}
.price-per{font-family:var(--mono);font-size:.68rem;color:var(--tx3);margin-bottom:18px}
hr.div{border:none;border-top:1px solid var(--line);margin-bottom:16px}
.feats{list-style:none;flex:1;margin-bottom:20px}
.feats li{font-size:.82rem;color:var(--tx2);padding:5px 0 5px 18px;position:relative}
.feats li::before{content:"—";position:absolute;left:0;color:var(--tx3)}
.card-btns{display:flex;flex-direction:column;gap:8px;margin-top:auto}
.card-btns .btn{justify-content:center;padding:10px 18px;font-size:.84rem;width:100%}

.custom{border:1px solid var(--line);border-radius:10px;padding:32px}
.custom h3{font-size:1.2rem;font-weight:700;margin-bottom:12px}
.custom p{color:var(--tx2);font-size:.9rem;margin-bottom:18px;max-width:56ch}
.custom .card-btns{flex-direction:row;flex-wrap:wrap}
.custom .btn{width:auto}

/* SERVICE CARDS (hub / index) */
/* ============================================================
   SERVICIOS
   ============================================================ */

.services-section{
  position:relative;
  padding:120px 0 140px;

  background:
    radial-gradient(
      circle at 15% 20%,
      rgba(61,85,196,.16),
      transparent 35%
    ),
    radial-gradient(
      circle at 85% 80%,
      rgba(71,229,160,.06),
      transparent 30%
    ),
    #151A2B;

  border-top:1px solid rgba(133,156,199,.08);
  border-bottom:1px solid rgba(133,156,199,.08);
}


/* CABECERA */

.services-heading{
  max-width:760px;
  margin:0 auto 70px;
  text-align:center;
}

.services-eyebrow{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:9px;

  margin-bottom:22px;

  font-family:var(--mono);
  font-size:12px;
  font-weight:600;
  letter-spacing:.13em;

  color:var(--blue-g);
}

.services-eyebrow .dot{
  width:7px;
  height:7px;
  border-radius:50%;

  background:var(--acc);
  box-shadow:0 0 12px rgba(71,229,160,.5);
}

.services-heading h2{
  margin:0;

  font-size:clamp(42px,5vw,68px);
  line-height:1;
  letter-spacing:-.045em;

  color:var(--tx);
}

.services-heading p{
  max-width:580px;
  margin:24px auto 0;

  font-size:18px;
  line-height:1.6;

  color:var(--tx2);
}


/* GRID */

.svc-grid{
  display:grid;
  grid-template-columns:repeat(3, minmax(0,1fr));
  gap:28px;

  max-width:1200px;
  margin:0 auto;
}


/* TARJETAS */

.svc-card{
  position:relative;

  min-height:500px;

  display:flex;
  flex-direction:column;

  padding:38px;

  text-decoration:none;

  background:
    linear-gradient(
      145deg,
      rgba(255,255,255,.065),
      rgba(255,255,255,.025)
    );

  border:1px solid rgba(133,156,199,.16);
  border-radius:18px;

  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);

  box-shadow:
    0 20px 60px rgba(0,0,0,.18);

  overflow:hidden;

  transition:
    transform .3s ease,
    border-color .3s ease,
    box-shadow .3s ease,
    background .3s ease;
}


/* brillo interno */

.svc-card::before{
  content:"";

  position:absolute;
  inset:0;

  background:
    radial-gradient(
      circle at 50% 0%,
      rgba(90,122,224,.14),
      transparent 45%
    );

  opacity:.6;

  pointer-events:none;
}


/* línea superior */

.svc-card::after{
  content:"";

  position:absolute;

  top:0;
  left:10%;
  right:10%;

  height:1px;

  background:
    linear-gradient(
      90deg,
      transparent,
      rgba(90,122,224,.55),
      transparent
    );

  opacity:.5;
}


.svc-card:hover{
  transform:translateY(-8px);

  border-color:rgba(90,122,224,.42);

  background:
    linear-gradient(
      145deg,
      rgba(61,85,196,.11),
      rgba(255,255,255,.035)
    );

  box-shadow:
    0 30px 80px rgba(0,0,0,.30),
    0 0 40px rgba(61,85,196,.08);
}


/* PARTE SUPERIOR */



.svc-tag{
  padding:6px 9px;

  border:1px solid rgba(71,229,160,.18);
  border-radius:5px;

  font-family:var(--mono);
  font-size:9px;
  letter-spacing:.08em;

  color:var(--acc);
  background:rgba(71,229,160,.04);
}


/* ICONO */

.svc-icon{
  position:relative;
  z-index:2;

  width:80px;
  height:80px;

  display:flex;
  align-items:center;
  justify-content:center;

  margin:50px 0 28px;

  border-radius:16px;

  background:rgba(255,255,255,.035);
  border:1px solid rgba(133,156,199,.12);

  transition:
    transform .3s ease,
    border-color .3s ease;
}

.svc-icon img{
  width:58px;
  height:58px;

  object-fit:contain;
}

.svc-card:hover .svc-icon{
  transform:scale(1.08);

  border-color:rgba(90,122,224,.35);
}


/* TEXTO */

.svc-card h3{
  position:relative;
  z-index:2;

  margin:0;

  font-size:28px;
  line-height:1.1;
  letter-spacing:-.025em;

  color:var(--tx);
}

.svc-card p{
  position:relative;
  z-index:2;

  max-width:480px;

  margin:18px 0 28px;

  font-size:16px;
  line-height:1.65;

  color:var(--tx2);
}


/* PRECIO */

.svc-price{
  position:relative;
  z-index:2;

  display:flex;
  align-items:baseline;
  gap:7px;

  margin-top:auto;
}

.svc-price strong{
  font-size:30px;
  letter-spacing:-.025em;
  color:var(--tx);
}

.svc-price span{
  font-size:14px;
  color:var(--tx3);
}

.svc-price-note{
  position:relative;
  z-index:2;

  margin-top:5px;

  font-size:12px;
  color:var(--tx3);
}


/* BOTÓN */

.svc-button{
  position:relative;
  z-index:2;

  display:flex;
  align-items:center;
  justify-content:space-between;

  width:100%;

  margin-top:28px;
  padding:17px 20px;

  border:1px solid rgba(90,122,224,.35);
  border-radius:9px;

  background:rgba(61,85,196,.12);

  color:var(--tx);

  font-size:15px;
  font-weight:600;

  text-decoration:none;

  transition:
    background .25s ease,
    border-color .25s ease,
    transform .25s ease;
}

.svc-button span{
  font-size:20px;
  transition:transform .25s ease;
}

.svc-card:hover .svc-button{
  background:var(--blue);
  border-color:var(--blue-l);
}

.svc-card:hover .svc-button span{
  transform:translateX(4px);
}


/* PERSONALIZADO */

.svc-icon-plus{
  font-size:42px;
  font-weight:300;
  color:var(--blue-l);
}


/* RESPONSIVE */

@media (max-width:1000px){
  .svc-grid{
    grid-template-columns:repeat(2, minmax(0,1fr));
  }
}

@media (max-width:650px){
  .svc-grid{
    grid-template-columns:1fr;
    gap:20px;
  }

  .svc-card{
    min-height:480px;
  }
}

/* FEATURES */
.feat-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:1px;background:var(--line);border:1px solid var(--line);border-radius:10px;overflow:hidden}
.feat{background:var(--bg2);padding:22px}
.feat-name{font-weight:700;font-size:.92rem;margin-bottom:6px}
.feat-desc{font-size:.82rem;color:var(--tx2)}
.feat-flag{display:inline-flex;align-items:center;gap:6px;font-family:var(--mono);font-size:.68rem;color:var(--warn);margin-top:10px;border-top:1px solid var(--line);padding-top:10px}

/* FAQ */
.faq{max-width:680px}
.faq-item{border-bottom:1px solid var(--line)}
.faq-q{width:100%;display:flex;justify-content:space-between;align-items:center;gap:16px;padding:16px 0;text-align:left;font-weight:600;font-size:.92rem}
.faq-q .plus{font-family:var(--mono);color:var(--tx3);flex-shrink:0;transition:transform .2s}
.faq-item.open .faq-q .plus{transform:rotate(45deg);color:var(--acc)}
.faq-a{max-height:0;overflow:hidden;transition:max-height .25s ease}
@media (prefers-reduced-motion:reduce){.faq-a{transition:none}}
.faq-a p{font-size:.86rem;color:var(--tx2);padding-bottom:18px;max-width:58ch}

/* PARTNERS */
.partner-card{display:flex;align-items:center;gap:18px;border:1px solid var(--line);border-radius:10px;padding:22px;max-width:420px;transition:border-color .15s,background .15s}
.partner-card:hover{border-color:var(--line2);background:rgba(133,156,199,.06)}
.partner-logo{width:56px;height:56px;border-radius:8px;object-fit:cover;flex-shrink:0}
.partner-name{font-weight:700;font-size:1rem;margin-bottom:4px}
.partner-desc{font-size:.84rem;color:var(--tx2)}

/* CONTACT */
.contact-box{border:1px solid var(--line);border-radius:10px;padding:32px;display:flex;justify-content:space-between;align-items:center;gap:24px;flex-wrap:wrap}
.contact-ch{display:flex;gap:28px;flex-wrap:wrap}
.ch-k{font-family:var(--mono);font-size:.68rem;color:var(--tx3);text-transform:uppercase;margin-bottom:4px}
.ch-v{font-weight:600;font-size:.94rem}
.contact-btns{display:flex;gap:10px;flex-wrap:wrap}

/* FOOTER */
footer{padding:28px 0}
.footrow{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:14px}
.footrow small{font-size:.76rem;color:var(--tx3)}
.footlinks{display:flex;gap:16px;flex-wrap:wrap}
.footlinks a{font-size:.76rem;color:var(--tx3)} .footlinks a:hover{color:var(--tx2)}

/* SEO TEXT */
.seo{max-width:760px}
.seo h2{font-size:1.25rem;font-weight:700;margin-bottom:14px;letter-spacing:-.01em}
.seo h3{font-size:1rem;font-weight:700;margin:20px 0 8px}
.seo p{font-size:.88rem;color:var(--tx2);margin-bottom:14px;max-width:64ch}

@media (prefers-reduced-motion:reduce){*{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}}

@media (max-width:760px){
  nav ul{display:none}
  .burger{display:flex}
  .mobmenu.open{display:flex;flex-direction:column;gap:2px;padding:12px 0 18px;border-top:1px solid var(--line)}
  .mobmenu a{padding:10px 0;font-size:.9rem;color:var(--tx2)}
  .mobmenu .mob-sub{padding-left:14px;display:flex;flex-direction:column}
  .honest-strip{grid-template-columns:1fr}
  .honest-cell{border-right:none;border-bottom:1px solid var(--line)}
  .honest-cell:last-child{border-bottom:none}
  .contact-box{flex-direction:column;align-items:flex-start}
  .sec{padding:44px 0}
}
/* ═══ SCROLL REVEAL ═══ */

.scroll-reveal{
  opacity:0;
  transform:translateY(24px);

  transition:
    opacity .6s ease,
    transform .6s ease;
}

.scroll-reveal.is-visible{
  opacity:1;
  transform:translateY(0);
}

.svc-card:nth-child(2){
  transition-delay:.05s;
}

.svc-card:nth-child(3){
  transition-delay:.1s;
}

.svc-card:nth-child(4){
  transition-delay:.15s;
}

.svc-card:nth-child(5){
  transition-delay:.2s;
}

.svc-card:nth-child(6){
  transition-delay:.25s;
}

@media (prefers-reduced-motion:reduce){

  .scroll-reveal{
    opacity:1;
    transform:none;
    transition:none;
  }

}
```css
/* ═══════════════════════════════════════════════════════════════
   ABYB HOST — SHOWCASE INTERACTIVO
   ═══════════════════════════════════════════════════════════════ */

.abyb-showcase{
  padding-top:70px;
  padding-bottom:100px;
}

.abyb-panels{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:10px;

  margin-top:38px;

  min-height:460px;
}

/* ───────────────────────────────────────────────────────────────
   TARJETA
   ─────────────────────────────────────────────────────────────── */

.abyb-panel{
  position:relative;
  min-width:0;
  overflow:hidden;

  background:
    linear-gradient(
      145deg,
      rgba(44,55,138,.12),
      rgba(19,23,42,.96) 45%,
      rgba(15,18,28,.98)
    );

  border:1px solid var(--line);
  border-radius:14px;

  padding:16px;

  cursor:pointer;

  transition:
    flex .45s cubic-bezier(.22,1,.36,1),
    transform .35s ease,
    border-color .35s ease,
    box-shadow .35s ease,
    background .35s ease;
}

/*
   Cuando una tarjeta recibe hover:
   las demás se hacen un poco más pequeñas visualmente.
*/
.abyb-panel:hover,
.abyb-panel:focus-visible,
.abyb-panel.active{
  transform:translateY(-4px);
  border-color:rgba(71,229,160,.48);

  box-shadow:
    0 18px 45px rgba(0,0,0,.28),
    0 0 35px rgba(44,55,138,.16);
}

/* Brillo interno */

.abyb-panel::before{
  content:"";
  position:absolute;
  inset:0;

  background:
    radial-gradient(
      circle at 50% 0%,
      rgba(44,55,138,.22),
      transparent 55%
    );

  opacity:.45;
  pointer-events:none;

  transition:opacity .35s ease;
}

.abyb-panel:hover::before,
.abyb-panel:focus-visible::before,
.abyb-panel.active::before{
  opacity:1;
}

/* Línea de brillo */

.abyb-panel::after{
  content:"";
  position:absolute;
  left:12%;
  right:12%;
  top:0;

  height:1px;

  background:
    linear-gradient(
      90deg,
      transparent,
      var(--acc),
      var(--blue),
      transparent
    );

  opacity:0;

  transition:opacity .35s ease;
}

.abyb-panel:hover::after,
.abyb-panel:focus-visible::after,
.abyb-panel.active::after{
  opacity:.85;
}


/* ───────────────────────────────────────────────────────────────
   SOLAPA SUPERIOR
   ─────────────────────────────────────────────────────────────── */

.panel-top{
  position:relative;
  z-index:2;

  display:flex;
  align-items:center;
  gap:7px;

  width:max-content;

  padding:5px 9px;

  background:rgba(10,13,21,.82);

  border:1px solid rgba(255,255,255,.07);
  border-radius:6px;

  color:var(--tx);
  font-size:.67rem;
  font-weight:700;
  letter-spacing:.08em;
}

.panel-spark{
  color:#d8b86a;

  font-size:.78rem;

  transition:
    transform .35s ease,
    color .35s ease;
}

.abyb-panel:hover .panel-spark,
.abyb-panel.active .panel-spark{
  color:var(--acc);
  transform:rotate(18deg) scale(1.15);
}


/* ───────────────────────────────────────────────────────────────
   CONTENIDO
   ─────────────────────────────────────────────────────────────── */

.panel-content{
  position:relative;
  z-index:1;

  height:calc(100% - 36px);

  display:flex;
  flex-direction:column;
  justify-content:flex-end;

  padding-top:12px;
}

.panel-copy{
  transition:transform .4s cubic-bezier(.22,1,.36,1);
}

.abyb-panel:hover .panel-copy,
.abyb-panel:focus-visible .panel-copy,
.abyb-panel.active .panel-copy{
  transform:translateY(-2px);
}

.panel-copy h3{
  margin:0 0 8px;

  color:var(--tx);

  font-size:1.05rem;
  line-height:1.2;
}

.panel-copy p{
  margin:0;
  color:var(--tx2);
  font-size:.79rem;
  line-height:1.55;
}

.panel-detail{
  display:inline-block;

  margin-top:13px;

  color:var(--acc);

  font-size:.68rem;
  font-weight:700;
  letter-spacing:.03em;
}


/* ───────────────────────────────────────────────────────────────
   ILUSTRACIONES
   ─────────────────────────────────────────────────────────────── */

.panel-illustration{
  position:absolute;

  top:5%;
  left:50%;

  width:100%;
  height:52%;

  transform:
    translate(-50%, 12px)
    scale(.92);

  opacity:.28;

  transition:
    transform .5s cubic-bezier(.22,1,.36,1),
    opacity .4s ease;
}

.abyb-panel:hover .panel-illustration,
.abyb-panel:focus-visible .panel-illustration,
.abyb-panel.active .panel-illustration{
  transform:
    translate(-50%, 0)
    scale(1);

  opacity:1;
}

.panel-illustration svg{
  width:100%;
  height:100%;
  overflow:visible;
}


/* ARGENTINA */

.arg-map{
  fill:rgba(44,55,138,.3);
  stroke:var(--blue-l);
  stroke-width:2;
}

.map-node{
  fill:var(--acc);

  filter:
    drop-shadow(0 0 7px rgba(71,229,160,.8));
}

.map-line{
  fill:none;
  stroke:rgba(71,229,160,.7);
  stroke-width:2;
  stroke-dasharray:5 5;
}


/* BUENO */

.server{
  fill:rgba(44,55,138,.35);
  stroke:rgba(90,122,224,.7);
  stroke-width:2;

  transition:
    fill .35s ease,
    stroke .35s ease;
}

.abyb-panel:hover .server,
.abyb-panel.active .server{
  fill:rgba(44,55,138,.65);
  stroke:var(--blue-l);
}

.server-light{
  fill:var(--acc);

  filter:
    drop-shadow(0 0 5px rgba(71,229,160,.75));
}

.bolt{
  fill:var(--acc);

  filter:
    drop-shadow(0 0 8px rgba(71,229,160,.7));
}


/* BARATO */

.coin{
  stroke:var(--acc);
  stroke-width:2;
}

.coin-back{
  fill:rgba(44,55,138,.3);
}

.coin-main{
  fill:rgba(71,229,160,.08);
}

.coin-symbol{
  fill:none;
  stroke:var(--acc);
  stroke-width:4;
  stroke-linecap:round;
}

.coin-line{
  stroke:var(--acc);
  stroke-width:2;
}


/* ───────────────────────────────────────────────────────────────
   VIDEO
   ─────────────────────────────────────────────────────────────── */

.abyb-video-panel{
  border-color:rgba(71,229,160,.28);

  box-shadow:
    0 0 28px rgba(44,55,138,.13);
}

.panel-video{
  position:absolute;

  top:4%;
  left:0;

  width:100%;
  height:53%;

  overflow:hidden;

  border-radius:9px;

  background:#090b10;

  border:1px solid rgba(90,122,224,.3);

  transition:
    transform .45s cubic-bezier(.22,1,.36,1),
    border-color .35s ease,
    box-shadow .35s ease;
}

.abyb-video-panel:hover .panel-video,
.abyb-video-panel:focus-visible .panel-video,
.abyb-video-panel.active .panel-video{
  border-color:rgba(71,229,160,.5);

  box-shadow:
    0 0 25px rgba(44,55,138,.22);
}

.panel-video video{
  display:block;

  width:100%;
  height:100%;

  object-fit:cover;
}

.video-overlay{
  position:absolute;
  inset:0;

  display:flex;
  align-items:center;
  justify-content:center;

  pointer-events:none;

  background:
    radial-gradient(
      circle,
      rgba(44,55,138,.08),
      rgba(5,7,12,.2)
    );
}

.video-play{
  width:42px;
  height:42px;

  display:flex;
  align-items:center;
  justify-content:center;

  padding-left:2px;

  border:1px solid rgba(255,255,255,.25);
  border-radius:50%;

  background:rgba(8,10,17,.7);

  color:var(--tx);

  font-size:.8rem;

  opacity:.8;

  transition:
    transform .3s ease,
    background .3s ease,
    opacity .3s ease;
}

.abyb-video-panel:hover .video-play{
  transform:scale(1.08);
  background:rgba(44,55,138,.75);
  opacity:1;
}


/* ───────────────────────────────────────────────────────────────
   RESPONSIVE
   ─────────────────────────────────────────────────────────────── */

@media (max-width:900px){

  .abyb-panels{
    grid-template-columns:repeat(2, 1fr);
  }

  .abyb-video-panel{
    grid-column:span 2;
  }

}


@media (max-width:620px){

  .abyb-panels{
    grid-template-columns:1fr;
    min-height:0;
  }

  .abyb-video-panel{
    grid-column:auto;
  }

  .abyb-panel{
    min-height:330px;
  }

  .panel-illustration{
    height:50%;
  }

}


/* ───────────────────────────────────────────────────────────────
   REDUCIR ANIMACIONES
   ─────────────────────────────────────────────────────────────── */

@media (prefers-reduced-motion:reduce){

  .abyb-panel,
  .panel-copy,
  .panel-illustration,
  .panel-video,
  .panel-spark{
    transition:none;
  }

}
.fq-title{
  text-align:center;font-size:clamp(28px,5vw,48px);
  line-height:1.15;font-weight:500;margin:0 auto 48px;max-width:16em;
}
.fq{max-width:940px;margin:0 auto}
.fq-item{border-bottom:1px solid rgba(128,128,128,.3)}
.fq-item:first-child{border-top:1px solid rgba(128,128,128,.3)}

.fq-q{
  width:100%;display:flex;justify-content:space-between;align-items:center;
  gap:24px;padding:22px 4px;background:none;border:0;
  color:inherit;font:inherit;font-size:clamp(15px,2.2vw,17px);
  text-align:left;cursor:pointer;
}
.fq-q:hover{opacity:.8}
.fq-q:focus-visible{outline:2px solid currentColor;outline-offset:2px}

.fq-plus{font-size:26px;line-height:1;flex-shrink:0;transition:transform .25s ease}
.fq-item.open .fq-plus{transform:rotate(45deg)}

.fq-a{display:grid;grid-template-rows:0fr;transition:grid-template-rows .3s ease}
.fq-a-inner{overflow:hidden;visibility:hidden;transition:visibility .3s}
.fq-item.open .fq-a{grid-template-rows:1fr}
.fq-item.open .fq-a-inner{visibility:visible}
.fq-a p{margin:0;padding:0 4px 22px;opacity:.85;line-height:1.6}
.fq-a a{color:inherit;text-decoration:underline}

@media (prefers-reduced-motion:reduce){
  .fq-a,.fq-plus{transition:none}
}