:root{
    --ink:#14181B;
    --ink-soft:#3B4347;
    --teal:#0E5C68;
    --teal-dark:#0A434C;
    --teal-pale:#E7F0EF;
    --teal-pale-2:#DCEAE9;
    --gold:#C9A24B;
    --gold-soft:#E7D6A6;
    --paper:#FBF8F3;
    --white:#FFFFFF;
    --whatsapp:#25D366;
    --whatsapp-dark:#1DA851;
    --line:#DCD5C6;
    --shadow: 0 20px 50px -20px rgba(14,24,27,0.25);
    --radius-lg: 22px;
    --radius-md: 14px;
    --radius-sm: 8px;
    --neon-1: #17B8A6;
    --neon-2: #C9A24B;
    --neon-3: #0E5C68;
  }

  /* ================= IMAGE PLACEHOLDER ================= */
  .img-slot{
    position:relative;
    border-radius:var(--radius-md);
    border: solid 1px var(--gold);
   background:  url("../assets/images/nosotros.png") center top / cover no-repeat;
   
  }
   .img-slot2{
    position:relative;
    border-radius:var(--radius-md);
    border: solid 1px var(--gold);
   background:  url("../assets/images/VIRTUALES.png") center top / cover no-repeat;
   
  }
  
   .img-slot3{
    position:relative;
    border-radius:var(--radius-md);
    border: solid 1px var(--gold);
   background:  url("../assets/images/ASESORIA.png") center top / cover no-repeat;
   
  }
   .img-slot4{
    position:relative;
    border-radius:var(--radius-md);
    border: solid 1px var(--gold);
   background:  url("../assets/images/PRESENCIAL.png") center top / cover no-repeat;
   
  }
  
  
  /* ================= NEON GRADIENT BORDER ================= */
  .neon-border{
    position:relative;
    border:2px solid transparent;
    background-image: linear-gradient(var(--surface,#fff), var(--surface,#fff)), linear-gradient(120deg, var(--neon-1), var(--neon-2), var(--neon-3), var(--neon-1));
    background-origin: border-box;
    background-clip: padding-box, border-box;
    background-size: 100% 100%, 300% 300%;
    animation: neon-flow 6s ease infinite;
  }
  @keyframes neon-flow{
    0%{ background-position:0 0, 0% 50%; }
    50%{ background-position:0 0, 100% 50%; }
    100%{ background-position:0 0, 0% 50%; }
  }
  .neon-glow{
    box-shadow:
      0 0 0 1px rgba(23,184,166,0.25),
      0 4px 24px -6px rgba(23,184,166,0.35),
      0 4px 24px -10px rgba(201,162,75,0.35);
  }
  .btn-neon{
    position:relative;
    background:var(--ink);
    color:#fff;
    border:2px solid transparent;
    background-image: linear-gradient(var(--ink), var(--ink)), linear-gradient(120deg, var(--neon-1), var(--neon-2), var(--neon-3));
    background-origin: border-box;
    background-clip: padding-box, border-box;
    background-size: 100% 100%, 250% 250%;
    animation: neon-flow 5s ease infinite;
    box-shadow: 0 0 18px -4px rgba(23,184,166,0.55), 0 0 24px -8px rgba(201,162,75,0.4);
  }
  .btn-neon:hover{ transform:translateY(-2px); box-shadow: 0 0 26px -2px rgba(23,184,166,0.75), 0 0 30px -6px rgba(201,162,75,0.6); }

  *{box-sizing:border-box; margin:0; padding:0;}
  html{scroll-behavior:smooth;}
  body{
    font-family:'IBM Plex Sans', sans-serif;
    background:var(--paper);
    color:var(--ink);
    line-height:1.6;
    -webkit-font-smoothing:antialiased;
    overflow-x:hidden;
  }
  img{max-width:100%; display:block;}
  a{color:inherit; text-decoration:none;}
  ul{list-style:none;}
  button{font-family:inherit; cursor:pointer; border:none; background:none;}
  .container{max-width:1180px; margin:0 auto; padding:0 28px;}
  section{position:relative;}

  h1,h2,h3,h4{
    font-family:'Fraunces', serif;
    font-weight:600;
    color:var(--ink);
    letter-spacing:-0.01em;
  }

  .eyebrow{
    font-family:'IBM Plex Mono', monospace;
    font-size:12.5px;
    letter-spacing:0.14em;
    text-transform:uppercase;
    color:var(--teal);
    font-weight:600;
    display:flex;
    align-items:center;
    gap:10px;
    margin-bottom:14px;
  }
  .eyebrow::before{
    content:"";
    width:26px; height:1.5px;
    background:var(--gold);
    display:inline-block;
  }

  .btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:10px;
    padding:15px 28px;
    border-radius:100px;
    font-weight:600;
    font-size:15px;
    transition:transform .18s ease, box-shadow .18s ease, background .18s ease;
    white-space:nowrap;
  }
  .btn-primary{
    background:var(--whatsapp);
    color:#fff;
    box-shadow:0 10px 24px -8px rgba(37,211,102,0.55);
  }
  .btn-primary:hover{ background:var(--whatsapp-dark); transform:translateY(-2px); }
  .btn-outline{
    background:transparent;
    color:var(--ink);
    border:1.5px solid var(--ink);
  }
  .btn-outline:hover{ background:var(--ink); color:var(--white); }
  .btn-ghost-gold{
    background:transparent;
    color:var(--gold-soft);
    border:1.5px solid var(--gold-soft);
  }
  .btn-ghost-gold:hover{ background:var(--gold-soft); color:var(--teal-dark); }

  /* ---------- ICONS ---------- */
  .icon{width:20px; height:20px; flex-shrink:0;}

  /* ---------- HEADER ---------- */
  header{
    position:fixed; top:0; left:0; right:0;
    z-index:100;
    background:rgba(251,248,243,0.86);
    backdrop-filter:blur(14px);
    -webkit-backdrop-filter:blur(14px);
    border-bottom:1px solid rgba(20,24,27,0.08);
    transition:background .3s ease;
  }
  .header-inner{
    display:flex; align-items:center; justify-content:space-between;
    padding:14px 28px;
    max-width:1180px; margin:0 auto;
  }
  .brand{ display:flex; align-items:center; gap:11px; }
  .brand img{ height:46px; width:auto; }
  .brand-text{ font-family:'Fraunces', serif; font-weight:700; font-size:16.5px; line-height:1.15; color:var(--ink); }
  .brand-text span{ display:block; font-family:'IBM Plex Mono', monospace; font-size:10px; font-weight:500; letter-spacing:.09em; color:var(--teal); text-transform:uppercase; margin-top:2px;}

  nav.main-nav{ display:flex; align-items:center; gap:30px; }
  nav.main-nav a{
    font-size:14.5px; font-weight:500; color:var(--ink-soft);
    position:relative; padding:4px 0;
  }
  nav.main-nav a::after{
    content:""; position:absolute; left:0; bottom:-2px; width:0; height:1.5px;
    background:var(--teal); transition:width .25s ease;
  }
  nav.main-nav a:hover::after{ width:100%; }
  nav.main-nav a:hover{ color:var(--teal); }

  .header-cta{ display:flex; align-items:center; gap:18px; }
  .header-cta .btn{ padding:11px 20px; font-size:13.5px; }

  .menu-toggle{ display:none; flex-direction:column; gap:5px; padding:8px; }
  .menu-toggle span{ width:24px; height:2px; background:var(--ink); border-radius:2px; }

  /* ---------- HERO ---------- */


  .hero {
  padding: 150px 0 90px;
  position: relative;
  overflow: hidden;

  background:
    linear-gradient(
      90deg,
      rgba(2, 28, 21, 0.80) 0%,
      rgba(2, 28, 21, 0.45) 50%,
      rgba(2, 28, 21, 0.08) 100%
    ),
    url("../assets/images/hero-principal.png") center / cover no-repeat;
}
@media (max-width: 480px) {
  .hero {
    min-height: 100svh;
    padding: 105px 18px 60px;

    background:
      linear-gradient(
        180deg,
        rgba(2, 28, 21, 0.15) 0%,
        rgba(2, 28, 21, 0.40) 48%,
        rgba(2, 28, 21, 0.96) 100%
      ),
      url("../assets/images/responsivo003.png") center top / cover no-repeat;
  }
}
.hero-bg-slot,
.hero-bg-label {
  display: none;
}
  .hero-grid{ position:relative; z-index:1; }
  .hero .bracket{
    position:absolute; opacity:.5; pointer-events:none;
  }
  .hero-grid{
    display:grid;
    grid-template-columns:1.15fr 0.95fr;
    gap:56px;
    align-items:start;
  }
 



.hero .eyebrow,
.hero .kicker {
  color: #e8bb4f;
  font-weight: 700;
  text-shadow: 0 2px 10px rgba(0, 0, 0, 0.55);
}

.hero .eyebrow::before,
.hero .kicker::before {
  background: #e8bb4f;
}

.hero-lead {
  color: rgba(255, 255, 255, 0.88);
  text-shadow: 0 2px 10px rgba(0, 0, 0, 0.65);
}

.hero .stat-strip {
  border-top-color: rgba(232, 187, 79, 0.65);
}

.hero .stat-num {
  color: #f0c75e;
  text-shadow:
    0 0 15px rgba(240, 199, 94, 0.28),
    0 2px 8px rgba(0, 0, 0, 0.55);
}

.hero .stat-label {
  color: rgba(255, 255, 255, 0.78);
  font-weight: 600;
}

.hero .stat-num span,
.hero .stat-num small {
  color: #ffffff;
}

.hero .btn-outline,
.hero .btn-secondary {
  color: #ffffff;
  border-color: #e8bb4f;
  background: rgba(3, 29, 23, 0.72);
  box-shadow:
    0 0 18px rgba(232, 187, 79, 0.18),
    inset 0 0 12px rgba(255, 255, 255, 0.04);
}

.hero .btn-outline:hover,
.hero .btn-secondary:hover {
  color: #082a22;
  background: #e8bb4f;
  border-color: #f6d77d;
}


  .hero h1{
     color: #ffffff;
  text-shadow: 0 3px 18px rgba(0, 0, 0, 0.55);
    font-size:clamp(34px, 4.6vw, 54px);
    line-height:1.06;
    margin-bottom:22px;
  }
  .hero h1 em{  color: #f0c75e;
  text-shadow:
    0 0 12px rgba(240, 199, 94, 0.35),
    0 3px 16px rgba(255, 190, 13, 0.45); font-style:italic;  }
    
  .hero-lead{
    color: #DCEAE9;
    font-size:17px;   max-width:520px; margin-bottom:34px;
  }
  .hero-actions{ display:flex; gap:14px; flex-wrap:wrap; margin-bottom:46px; }

  .stat-strip{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    border-top:1px solid var(--line);
    padding-top:26px;
    max-width:520px;
  }
  .stat-strip div{ padding-right:14px; }
  .stat-num{
    font-family:'IBM Plex Mono', monospace;
    font-size:clamp(26px,3vw,34px);
    font-weight:600;
    color:var(--teal-dark);
    display:flex;
    align-items:baseline;
    gap:2px;
  }
  .stat-label{
    font-size:12px; color:var(--ink-soft); text-transform:uppercase; letter-spacing:.06em; margin-top:4px;
  }

  /* --- ficha de postulante (hero form) --- */
  .ficha{
    background:var(--ink);
    border-radius:var(--radius-lg);
    padding:34px 30px 30px;
    box-shadow:var(--shadow), 0 0 0 1px rgba(23,184,166,0.3), 0 0 50px -10px rgba(23,184,166,0.35), 0 0 70px -20px rgba(201,162,75,0.3);
    position:relative;
    color:var(--white);
    border:2px solid transparent;
    background-image: linear-gradient(var(--ink), var(--ink)), linear-gradient(120deg, var(--neon-1), var(--neon-2), var(--neon-3), var(--neon-1));
    background-origin: border-box;
    background-clip: padding-box, border-box;
    background-size:100% 100%, 300% 300%;
    animation: neon-flow 8s ease infinite;
  }
  .ficha::before{
    content:"";
    position:absolute; inset:10px;
    border:1px solid rgba(255,255,255,0.12);
    border-radius:16px;
    pointer-events:none;
  }
  .ficha-head{
    display:flex; justify-content:space-between; align-items:flex-start;
    margin-bottom:22px;
    padding-bottom:18px;
    border-bottom:1px dashed rgba(255,255,255,0.22);
  }
  .ficha-head h3{
    color:#fff; font-size:20px; margin-bottom:4px;
  }
  .ficha-head p{ font-size:12.5px; color:rgba(255,255,255,0.55); font-family:'IBM Plex Mono', monospace; letter-spacing:.04em;}
  .ficha-id{
    font-family:'IBM Plex Mono', monospace;
    font-size:11px;
    color:var(--gold-soft);
    border:1px solid rgba(201,162,75,0.5);
    padding:5px 10px;
    border-radius:6px;
    white-space:nowrap;
  }
  .field{ margin-bottom:15px; }
  .field label{
    display:block; font-size:11.5px; color:rgba(255,255,255,0.65);
    text-transform:uppercase; letter-spacing:.07em; margin-bottom:6px;
    font-family:'IBM Plex Mono', monospace;
  }
  .field input, .field select{
    width:100%;
    background:rgba(255,255,255,0.06);
    border:1px solid rgba(255,255,255,0.18);
    border-radius:10px;
    padding:12px 14px;
    color:#fff;
    font-size:14.5px;
    font-family:'IBM Plex Sans', sans-serif;
    transition:border-color .2s ease, background .2s ease;
  }
  .field input::placeholder{ color:rgba(255,255,255,0.35); }
  .field input:focus, .field select:focus{
    outline:none; border-color:var(--gold-soft); background:rgba(255,255,255,0.1);
  }
  .field-row{ display:grid; grid-template-columns:1fr 1fr; gap:12px; }
  .ficha .btn-primary{ width:100%; margin-top:10px; padding:16px; font-size:15.5px;}
  .ficha-note{
    font-size:11.5px; color:rgba(255,255,255,0.45); margin-top:12px; text-align:center;
  }

  /* ---------- SECTION GENERIC ---------- */
  .section{ padding:96px 0; }
  .section-head{ max-width:640px; margin-bottom:52px; }
  .section-head h2{ font-size:clamp(28px,3.4vw,40px); line-height:1.12; }
  .section-head p{ color:var(--ink-soft); font-size:16px; margin-top:14px; }
  .section-alt{ background:var(--teal-pale); }
  .section-dark{ background:var(--ink); color:#fff; }
  .section-dark .section-head h2{ color:#fff; }
  .section-dark .section-head p{ color:rgba(255,255,255,0.65); }

  /* ---------- QUE ES / QUIENES SOMOS ---------- */
  .intro-grid{
    display:grid; grid-template-columns:0.9fr 1.1fr; gap:60px; align-items:center;
  }
  .intro-visual{
    background:var(--teal);
    border-radius:var(--radius-lg);
    padding:40px;
    color:#fff;
    position:relative;
    overflow:hidden;
    min-height:340px;
    display:flex; flex-direction:column; justify-content:space-between;
  }
  .intro-visual svg{ position:absolute; opacity:.18; }
  .intro-visual .quote{ font-family:'Fraunces', serif; font-size:22px; font-style:italic; line-height:1.4; position:relative; z-index:1;}
  .intro-visual .quote-attr{ font-family:'IBM Plex Mono', monospace; font-size:12px; color:var(--gold-soft); margin-top:16px; position:relative; z-index:1;}

  .intro-text p{ color:var(--ink-soft); font-size:16px; margin-bottom:16px; }
  .intro-text p:last-child{ margin-bottom:0; }
  .intro-text strong{ color:var(--ink); }

  .mission-stats{
    display:grid; grid-template-columns:repeat(4,1fr); gap:18px; margin-top:44px;
  }
  .mission-stat{
    background:var(--white);
    border:1px solid var(--line);
    border-radius:var(--radius-md);
    padding:22px 18px;
    text-align:center;
  }
  .mission-stat .num{
    font-family:'IBM Plex Mono', monospace; font-size:28px; font-weight:600; color:var(--teal);
  }
  .mission-stat .lbl{ font-size:12.5px; color:var(--ink-soft); margin-top:6px; }

  /* ---------- RUTA DE EVALUACION ---------- */
  .route{
    position:relative;
    max-width:820px;
    margin:0 auto;
  }
  .route::before{
    content:"";
    position:absolute;
    left:29px; top:12px; bottom:12px;
    width:2px;
    background-image:linear-gradient(var(--gold-soft) 60%, transparent 0%);
    background-size:2px 12px;
    background-repeat:repeat-y;
  }
  .checkpoint{
    position:relative;
    padding-left:78px;
    margin-bottom:14px;
  }
  .checkpoint-num{
    position:absolute; left:0; top:0;
    width:60px; height:60px;
    border-radius:50%;
    background:var(--ink);
    color:var(--gold-soft);
    display:flex; align-items:center; justify-content:center;
    font-family:'IBM Plex Mono', monospace;
    font-size:18px; font-weight:600;
    border:3px solid var(--paper);
    box-shadow:0 0 0 2px var(--ink);
    z-index:1;
  }
  .checkpoint-card{
    background:var(--white);
    border:1px solid var(--line);
    border-radius:var(--radius-md);
    padding:20px 22px;
    cursor:pointer;
    transition:border-color .2s ease, box-shadow .2s ease;
  }
  .checkpoint-card:hover{ border-color:var(--teal); }
  .checkpoint-card.open{
    box-shadow:var(--shadow), 0 0 0 1px rgba(23,184,166,0.25), 0 0 30px -8px rgba(23,184,166,0.4);
    border-color:transparent;
    background-image: linear-gradient(var(--white), var(--white)), linear-gradient(120deg, var(--neon-1), var(--neon-2), var(--neon-3));
    background-origin: border-box;
    background-clip: padding-box, border-box;
  }
  .checkpoint-card{ border:2px solid var(--line); }
  .checkpoint-top{
    display:flex; align-items:center; justify-content:space-between; gap:12px;
  }
  .checkpoint-top h4{ font-size:17px; font-weight:600; }
  .checkpoint-top .elim{
    font-family:'IBM Plex Mono', monospace; font-size:10.5px; color:var(--teal);
    background:var(--teal-pale); padding:4px 9px; border-radius:20px; white-space:nowrap;
    text-transform:uppercase; letter-spacing:.04em;
  }
  .chevron{ transition:transform .25s ease; color:var(--ink-soft); flex-shrink:0; }
  .checkpoint-card.open .chevron{ transform:rotate(180deg); }
  .checkpoint-body{
    max-height:0; overflow:hidden; transition:max-height .3s ease;
  }
  .checkpoint-body-inner{ padding-top:14px; font-size:14.5px; color:var(--ink-soft); }
  .checkpoint-content{
    display:grid;
    grid-template-columns:minmax(0,1fr) 190px;
    gap:22px;
    align-items:stretch;
  }
  .checkpoint-copy p{ margin-bottom:10px; }
  .checkpoint-copy p:last-child{ margin-bottom:0; }
  .checkpoint-body-inner ul{ margin-top:8px; }
  .checkpoint-body-inner li{ padding-left:16px; position:relative; margin-bottom:5px; }
  .checkpoint-body-inner li::before{ content:"—"; position:absolute; left:0; color:var(--gold); }
  .checkpoint-visual{
    min-height:154px;
    border-radius:14px;
    background:
      radial-gradient(circle at 82% 18%, rgba(231,214,166,.4), transparent 34%),
      linear-gradient(145deg, var(--teal-dark), var(--teal));
    color:#fff;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:10px;
    padding:20px;
    overflow:hidden;
    position:relative;
    text-align:center;
  }
  .checkpoint-visual::before{
    content:"";
    position:absolute;
    width:100px; height:100px;
    border:1px solid rgba(255,255,255,.16);
    border-radius:50%;
    animation:visual-orbit 5s ease-in-out infinite;
  }
  .checkpoint-visual svg{
    width:54px; height:54px;
    position:relative;
    stroke:var(--gold-soft);
    filter:drop-shadow(0 0 10px rgba(231,214,166,.55));
    animation:visual-float 3s ease-in-out infinite;
  }
  .checkpoint-visual span{
    position:relative;
    font-family:'IBM Plex Mono', monospace;
    font-size:10px;
    line-height:1.35;
    letter-spacing:.08em;
    text-transform:uppercase;
    color:rgba(255,255,255,.82);
  }
  @keyframes visual-float{
    0%,100%{ transform:translateY(0) rotate(-1deg); }
    50%{ transform:translateY(-7px) rotate(2deg); }
  }
  @keyframes visual-orbit{
    0%,100%{ transform:scale(.92); opacity:.55; }
    50%{ transform:scale(1.08); opacity:1; }
  }

  .route-final{
    --surface:var(--ink);
    margin-top:18px;
    margin-left:78px;
    padding:28px 30px;
    background:var(--ink);
    color:#fff;
    border-radius:22px;
    display:grid;
    grid-template-columns:104px 1fr;
    align-items:center;
    gap:24px;
    overflow:hidden;
    box-shadow:0 20px 55px -20px rgba(14,92,104,.9), 0 0 28px -8px rgba(23,184,166,.8);
  }
  .route-final::after{
    content:"";
    position:absolute;
    width:180px; height:180px;
    right:-70px; top:-80px;
    border-radius:50%;
    background:radial-gradient(circle, rgba(201,162,75,.25), transparent 68%);
    animation:meta-glow 4s ease-in-out infinite;
  }
  .meta-trophy{
    width:96px; height:96px;
    border-radius:26px;
    display:flex;
    align-items:center;
    justify-content:center;
    background:linear-gradient(145deg, rgba(201,162,75,.22), rgba(23,184,166,.14));
    border:1px solid rgba(231,214,166,.35);
    box-shadow:inset 0 0 24px rgba(201,162,75,.12), 0 0 25px rgba(201,162,75,.18);
    animation:trophy-rise 3.4s ease-in-out infinite;
  }
  .meta-trophy svg{
    width:58px; height:58px;
    stroke:var(--gold-soft);
    filter:drop-shadow(0 0 12px rgba(231,214,166,.65));
  }
  .meta-copy{ position:relative; z-index:1; }
  .route-final .flag{
    display:inline-flex;
    font-family:'IBM Plex Mono', monospace;
    font-size:10px;
    background:linear-gradient(90deg,var(--gold),var(--gold-soft));
    color:var(--teal-dark);
    padding:5px 12px;
    border-radius:20px;
    font-weight:700;
    letter-spacing:.08em;
    text-transform:uppercase;
    margin-bottom:8px;
  }
  .route-final h3{ color:#fff; font-size:24px; margin-bottom:6px; }
  .route-final p{ font-size:14px; color:rgba(255,255,255,0.82); max-width:760px; }
  .meta-steps{ display:flex; flex-wrap:wrap; gap:8px; margin-top:14px; }
  .meta-steps span{
    font-family:'IBM Plex Mono', monospace;
    font-size:9.5px;
    letter-spacing:.05em;
    text-transform:uppercase;
    padding:5px 9px;
    border-radius:100px;
    color:var(--gold-soft);
    border:1px solid rgba(231,214,166,.25);
    background:rgba(255,255,255,.05);
  }
  @keyframes trophy-rise{
    0%,100%{ transform:translateY(0) rotate(-2deg); }
    50%{ transform:translateY(-8px) rotate(2deg); }
  }
  @keyframes meta-glow{
    0%,100%{ transform:scale(.85); opacity:.55; }
    50%{ transform:scale(1.15); opacity:1; }
  }

  /* ---------- SERVICIOS ---------- */
  .services-grid{
    display:grid; grid-template-columns:repeat(3,1fr); gap:22px;
  }
  .service-card{
    background:var(--white);
    border-radius:var(--radius-lg);
    padding:0 0 26px;
    overflow:hidden;
    border:2px solid var(--line);
    transition:transform .3s cubic-bezier(.2,.8,.2,1), box-shadow .3s ease, border-color .3s ease;
  }
  .service-card:hover{
    transform:translateY(-8px) scale(1.01);
    box-shadow:var(--shadow), 0 0 0 1px rgba(23,184,166,0.15);
    border-color:transparent;
    background-image: linear-gradient(var(--white), var(--white)), linear-gradient(120deg, var(--neon-1), var(--neon-2), var(--neon-3));
    background-origin: border-box;
    background-clip: padding-box, border-box;
  }
  .service-card-body{ padding:26px 26px 0; }
  .service-icon{
    width:52px; height:52px; border-radius:14px;
    background:var(--teal-pale);
    display:flex; align-items:center; justify-content:center;
    margin-bottom:20px;
    color:var(--teal);
    transition:transform .3s ease;
  }
  .service-card:hover .service-icon{ transform:rotate(-8deg) scale(1.08); }
  .service-card h3{ font-size:19px; margin-bottom:6px; }
  .service-card .tag{
    font-family:'IBM Plex Mono', monospace; font-size:11px; color:var(--gold); text-transform:uppercase; letter-spacing:.05em; margin-bottom:16px; display:block;
  }
  .service-card ul li{
    font-size:14px; color:var(--ink-soft); padding:6px 0 6px 20px; position:relative; border-top:1px solid var(--line);
  }
  .service-card ul li:first-child{ border-top:none; }
  .service-card ul li::before{ content:""; position:absolute; left:0; top:15px; width:6px; height:6px; border-radius:50%; background:var(--gold); }

  /* ---------- METODOLOGIA ---------- */
  .method-grid{
    display:grid; grid-template-columns:repeat(5,1fr); gap:14px;
  }
  .method-item{
    background:rgba(255,255,255,0.05);
    border:1px solid rgba(255,255,255,0.12);
    border-radius:var(--radius-md);
    padding:20px 16px;
    text-align:center;
    position:relative;
    overflow:hidden;
    transition:transform .3s ease, border-color .3s ease, background .3s ease, box-shadow .3s ease;
  }
  .method-item::before{
    content:"";
    position:absolute;
    width:74px; height:74px;
    left:50%; top:24px;
    transform:translateX(-50%);
    background:radial-gradient(circle, rgba(23,184,166,.25), transparent 68%);
    animation:method-glow 3.2s ease-in-out infinite;
  }
  .method-item:hover{
    transform:translateY(-6px);
    border-color:rgba(231,214,166,.48);
    background:rgba(255,255,255,.08);
    box-shadow:0 0 28px -10px rgba(23,184,166,.85);
  }
  .method-icon{
    width:48px; height:48px;
    margin:0 auto 11px;
    border-radius:15px;
    display:flex;
    align-items:center;
    justify-content:center;
    color:var(--gold-soft);
    background:linear-gradient(145deg, rgba(23,184,166,.18), rgba(201,162,75,.12));
    border:1px solid rgba(231,214,166,.28);
    box-shadow:inset 0 0 18px rgba(23,184,166,.1), 0 0 20px -8px rgba(231,214,166,.8);
    position:relative;
    animation:method-float 3s ease-in-out infinite;
  }
  .method-icon svg{
    width:25px; height:25px;
    filter:drop-shadow(0 0 6px rgba(231,214,166,.75));
  }
  .method-item:nth-child(2n) .method-icon{ animation-delay:-.7s; }
  .method-item:nth-child(3n) .method-icon{ animation-delay:-1.4s; }
  .method-item:nth-child(4n) .method-icon{ animation-delay:-2.1s; }
  @keyframes method-float{
    0%,100%{ transform:translateY(0) rotate(0); }
    50%{ transform:translateY(-6px) rotate(3deg); }
  }
  @keyframes method-glow{
    0%,100%{ opacity:.35; transform:translateX(-50%) scale(.8); }
    50%{ opacity:1; transform:translateX(-50%) scale(1.2); }
  }
  .method-item .mnum{
    font-family:'IBM Plex Mono', monospace; color:var(--gold-soft); font-size:11px; margin-bottom:6px; position:relative;
  }
  .method-item p{ font-size:13.5px; color:rgba(255,255,255,0.88); position:relative; }

  /* ---------- REQUISITOS ---------- */
  .tabs{
    display:flex; gap:10px; flex-wrap:wrap; margin-bottom:32px;
  }
  .tab-btn{
    padding:11px 20px;
    border-radius:100px;
    border:1.5px solid var(--line);
    font-size:14px; font-weight:600; color:var(--ink-soft);
    background:var(--white);
    transition:all .2s ease;
  }
  .tab-btn.active{ background:var(--teal); border-color:var(--teal); color:#fff; }
  .tab-panel{ display:none; }
  .tab-panel.active{ display:grid; grid-template-columns:1fr 1fr; gap:16px; }
  .req-item{
    display:flex; align-items:flex-start; gap:12px;
    background:var(--white); border:1px solid var(--line); border-radius:var(--radius-sm);
    padding:16px 18px; font-size:14.5px; color:var(--ink-soft);
  }
  .req-item svg{ flex-shrink:0; margin-top:2px; color:var(--teal); }

  /* ---------- TESTIMONIOS ---------- */
  .testi-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
  .testi-card{
    background:var(--white); border:2px solid var(--line); border-radius:var(--radius-lg);
    padding:28px 24px; display:flex; flex-direction:column; gap:18px;
    transition:transform .3s ease, box-shadow .3s ease, border-color .3s ease;
  }
  .testi-card:hover{
    transform:translateY(-6px);
    border-color:transparent;
    box-shadow:var(--shadow);
    background-image: linear-gradient(var(--white), var(--white)), linear-gradient(120deg, var(--neon-1), var(--neon-2), var(--neon-3));
    background-origin: border-box;
    background-clip: padding-box, border-box;
  }
  .testi-stars{ color:var(--gold); font-size:14px; letter-spacing:2px; }
  .testi-quote{ font-family:'Fraunces', serif; font-style:italic; font-size:16px; line-height:1.5; color:var(--ink); flex-grow:1; }
  .testi-person{ display:flex; align-items:center; gap:12px; border-top:1px solid var(--line); padding-top:16px; }
  .testi-avatar{
    width:48px; height:48px; border-radius:50%;
    background:var(--teal-pale); color:var(--teal); display:flex; align-items:center; justify-content:center;
    font-family:'IBM Plex Mono', monospace; font-weight:600; font-size:8.5px;
    border:2px dashed var(--teal);
    text-align:center; line-height:1.2; flex-shrink:0;
  }
  .testi-person .name{ font-weight:600; font-size:14.5px; }
  .testi-person .role{ font-size:12.5px; color:var(--ink-soft); font-family:'IBM Plex Mono', monospace; }

  /* ---------- CTA FINAL ---------- */
  .cta-final{
    background:linear-gradient(135deg, var(--teal-dark), var(--teal));
    border-radius:28px;
    padding:64px 50px;
    text-align:center;
    position:relative;
    overflow:hidden;
    color:#fff;
    margin:0 28px;
  }
  .cta-final::before, .cta-final::after{
    content:""; position:absolute; border-radius:50%;
    border:1px solid rgba(255,255,255,0.15);
  }
  .cta-final::before{ width:420px; height:420px; top:-220px; right:-120px; animation: float-slow 9s ease-in-out infinite; }
  .cta-final::after{ width:280px; height:280px; bottom:-160px; left:-80px; animation: float-slow 7s ease-in-out infinite reverse; }
  @keyframes float-slow{
    0%,100%{ transform:translateY(0) scale(1); }
    50%{ transform:translateY(-16px) scale(1.05); }
  }
  .cta-bg-label{
    position:absolute; top:18px; left:18px; z-index:1;
    display:flex; align-items:center; gap:8px;
    font-family:'IBM Plex Mono', monospace; font-size:10.5px; color:rgba(255,255,255,0.55);
    border:1px dashed rgba(255,255,255,0.3); border-radius:20px; padding:6px 12px;
  }
  .cta-final .eyebrow{ justify-content:center; color:var(--gold-soft); }
  .cta-final .eyebrow::before{ background:var(--gold-soft); }
  .cta-final h2{ color:#fff; font-size:clamp(28px,4vw,42px); max-width:680px; margin:0 auto 16px; line-height:1.15; }
  .cta-final p{ color:rgba(255,255,255,0.8); max-width:520px; margin:0 auto 34px; font-size:16px; }
  .cta-final-actions{ display:flex; gap:16px; justify-content:center; flex-wrap:wrap; position:relative; z-index:1; }
  .cta-final .btn-outline{ border-color:rgba(255,255,255,0.5); color:#fff; }
  .cta-final .btn-outline:hover{ background:#fff; color:var(--teal-dark); }

  /* ---------- FOOTER ---------- */
  footer{ background:var(--ink); color:rgba(255,255,255,0.7); padding:70px 0 26px; margin-top:100px; }
  .footer-grid{
    display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr; gap:40px; padding-bottom:44px; border-bottom:1px solid rgba(255,255,255,0.1);
  }
  .footer-brand{ display:flex; align-items:center; gap:12px; margin-bottom:16px; }
  .footer-brand img{ height:44px; }
  .footer-brand-text{ font-family:'Fraunces', serif; color:#fff; font-weight:700; font-size:17px; }
  .footer-col h5{
    font-family:'IBM Plex Mono', monospace; font-size:12px; text-transform:uppercase; letter-spacing:.08em;
    color:var(--gold-soft); margin-bottom:16px;
  }
  .footer-col p, .footer-col li{ font-size:14px; margin-bottom:10px; color:rgba(255,255,255,0.65); }
  .footer-col a:hover{ color:#fff; }
  .social-row{ display:flex; gap:10px; margin-top:6px; }
  .social-row a{
    width:38px; height:38px; border-radius:50%; border:1px solid rgba(255,255,255,0.2);
    display:flex; align-items:center; justify-content:center; transition:all .2s ease;
  }
  .social-row a:hover{ background:var(--gold-soft); border-color:var(--gold-soft); color:var(--ink); }
  .footer-bottom{
    display:flex; justify-content:space-between; align-items:center; padding-top:24px; font-size:12.5px; color:rgba(255,255,255,0.4); flex-wrap:wrap; gap:10px;
  }

  /* ---------- FLOATING WHATSAPP ---------- */
  .float-wa-wrap{
    position:fixed; bottom:26px; right:26px; z-index:90;
    width:64px; height:64px;
  }
  .float-wa-ring{
    position:absolute; inset:-6px;
    border-radius:50%;
    background:conic-gradient(from 0deg, var(--neon-1), var(--neon-2), var(--whatsapp), var(--neon-1));
    animation: spin-ring 3.2s linear infinite;
    filter:blur(1px);
  }
  @keyframes spin-ring{ to{ transform:rotate(360deg); } }
  .float-wa{
    position:absolute; inset:4px; z-index:2;
    border-radius:50%;
    background:var(--whatsapp); color:#fff;
    display:flex; align-items:center; justify-content:center;
    box-shadow:0 12px 30px -8px rgba(37,211,102,0.7);
    animation:pulse-wa 2.6s infinite, bob-wa 3.4s ease-in-out infinite;
  }
  .float-wa:hover{ background:var(--whatsapp-dark); }
  @keyframes pulse-wa{
    0%{ box-shadow:0 0 0 0 rgba(37,211,102,0.5), 0 12px 30px -8px rgba(37,211,102,0.6); }
    70%{ box-shadow:0 0 0 14px rgba(37,211,102,0), 0 12px 30px -8px rgba(37,211,102,0.6); }
    100%{ box-shadow:0 0 0 0 rgba(37,211,102,0), 0 12px 30px -8px rgba(37,211,102,0.6); }
  }
  @keyframes bob-wa{
    0%,100%{ transform:translateY(0); }
    50%{ transform:translateY(-5px); }
  }
  .wa-tooltip{
    position:absolute; right:76px; top:50%; transform:translateY(-50%) translateX(6px);
    background:var(--ink); color:#fff;
    padding:9px 14px; border-radius:10px; font-size:13px; font-weight:600;
    white-space:nowrap; box-shadow:var(--shadow);
    opacity:0; pointer-events:none;
    transition:opacity .3s ease, transform .3s ease;
  }
  .wa-tooltip::after{
    content:""; position:absolute; right:-5px; top:50%; transform:translateY(-50%) rotate(45deg);
    width:10px; height:10px; background:var(--ink);
  }
  .wa-tooltip.show{ opacity:1; transform:translateY(-50%) translateX(0); }

  /* ---------- MODALS / POPUPS ---------- */
  .modal-overlay{
    position:fixed; inset:0; z-index:200;
    background:rgba(10,14,16,0.6);
    backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px);
    display:flex; align-items:center; justify-content:center;
    padding:20px;
    opacity:0; pointer-events:none;
    transition:opacity .35s ease;
  }
  .modal-overlay.show{ opacity:1; pointer-events:auto; }
  .modal-card{
    position:relative;
    width:100%; max-width:420px;
    background:var(--ink);
    color:#fff;
    border-radius:24px;
    padding:36px 30px 30px;
    text-align:center;
    transform:translateY(24px) scale(.97);
    transition:transform .4s cubic-bezier(.2,.8,.2,1);
    border:2px solid transparent;
    background-image: linear-gradient(var(--ink), var(--ink)), linear-gradient(120deg, var(--neon-1), var(--neon-2), var(--neon-3), var(--neon-1));
    background-origin: border-box;
    background-clip: padding-box, border-box;
    background-size:100% 100%, 300% 300%;
    animation: neon-flow 7s ease infinite;
    box-shadow: 0 30px 70px -20px rgba(0,0,0,0.6), 0 0 40px -10px rgba(23,184,166,0.35);
  }
  .modal-overlay.show .modal-card{ transform:translateY(0) scale(1); }
  .modal-close{
    position:absolute; top:16px; right:16px;
    width:32px; height:32px; border-radius:50%;
    background:rgba(255,255,255,0.08); color:#fff;
    display:flex; align-items:center; justify-content:center;
    transition:background .2s ease;
  }
  .modal-close:hover{ background:rgba(255,255,255,0.18); }
  .modal-icon{
    width:60px; height:60px; border-radius:50%;
    background:linear-gradient(135deg, var(--neon-1), var(--teal-dark));
    display:flex; align-items:center; justify-content:center;
    margin:0 auto 18px;
    box-shadow:0 0 24px -4px rgba(23,184,166,0.6);
  }
  .promo-education-visual {
  width: 100%;
  height: auto;
  aspect-ratio: 3 / 2;
  margin: 4px 0 20px;
  position: relative;
  overflow: hidden;
  border-radius: 18px;

  background:
    url("../assets/images/popup-libro.png")
    center center / cover no-repeat;

  border: 1px solid rgba(255, 255, 255, 0.1);
}
  .promo-education-visual::before,
  .promo-education-visual::after{
    content:"";
    position:absolute;
    border:1px solid rgba(255,255,255,.12);
    border-radius:50%;
    animation:book-orbit 5s linear infinite;
  }
  .promo-education-visual::before{ width:116px; height:116px; }
  .promo-education-visual::after{ width:148px; height:148px; animation-direction:reverse; animation-duration:7s; }
  .book-illustration{
    width:94px; height:94px;
    position:relative;
    z-index:2;
    stroke:var(--gold-soft);
    filter:drop-shadow(0 0 13px rgba(231,214,166,.58));
    animation:book-float 3s ease-in-out infinite;
  }
  .book-page-left{ transform-origin:48px 58px; animation:page-left 3s ease-in-out infinite; }
  .book-page-right{ transform-origin:48px 58px; animation:page-right 3s ease-in-out infinite; }
  .promo-spark{
    position:absolute;
    z-index:3;
    color:var(--gold-soft);
    font-size:18px;
    filter:drop-shadow(0 0 8px rgba(166, 231, 180, 0.8));
    animation:spark-pop 2.4s ease-in-out infinite;
  }
  .promo-spark.spark-one{ top:28px; left:78px; }
  .promo-spark.spark-two{ right:74px; bottom:28px; animation-delay:-1.1s; }
  .promo-visual-label{
    position:absolute;
    bottom:10px;
    left:50%;
    transform:translateX(-50%);
    z-index:4;
    font-family:'IBM Plex Mono', monospace;
    font-size:9px;
    letter-spacing:.08em;
    text-transform:uppercase;
    color:rgba(255,255,255,.65);
    white-space:nowrap;
  }
  @keyframes book-float{
    0%,100%{ transform:translateY(2px) rotate(-1deg); }
    50%{ transform:translateY(-8px) rotate(1deg); }
  }
  @keyframes page-left{
    0%,100%{ transform:skewY(0deg); }
    50%{ transform:skewY(-4deg); }
  }
  @keyframes page-right{
    0%,100%{ transform:skewY(0deg); }
    50%{ transform:skewY(4deg); }
  }
  @keyframes book-orbit{
    to{ transform:rotate(360deg); }
  }
  @keyframes spark-pop{
    0%,100%{ transform:scale(.72) rotate(0); opacity:.45; }
    50%{ transform:scale(1.16) rotate(16deg); opacity:1; }
  }
  .modal-card h3{ color:#fff; font-size:22px; margin-bottom:10px; }
  .modal-card p{ color:rgba(255,255,255,0.68); font-size:14.5px; margin-bottom:24px; }
  .modal-badge{
    display:inline-flex; align-items:center; gap:6px;
    font-family:'IBM Plex Mono', monospace; font-size:11px; letter-spacing:.06em;
    color:var(--gold-soft); background:rgba(201,162,75,0.12);
    border:1px solid rgba(201,162,75,0.35);
    padding:6px 12px; border-radius:20px; margin-bottom:16px; text-transform:uppercase;
  }
  .modal-actions{ display:flex; flex-direction:column; gap:10px; }
  .modal-actions .btn{ width:100%; }
  .modal-summary{
    text-align:left;
    background:rgba(255,255,255,0.05);
    border:1px solid rgba(255,255,255,0.1);
    border-radius:12px;
    padding:16px 18px;
    margin-bottom:22px;
    font-size:13.5px;
  }
  .modal-summary div{ display:flex; justify-content:space-between; padding:5px 0; color:rgba(255,255,255,0.85); border-bottom:1px dashed rgba(255,255,255,0.1); }
  .modal-summary div:last-child{ border-bottom:none; }
  .modal-summary span:first-child{ color:rgba(255,255,255,0.5); font-family:'IBM Plex Mono', monospace; font-size:11px; text-transform:uppercase; }

  /* ---------- REVEAL ANIMATION ---------- */
  .reveal{ opacity:0; transform:translateY(22px); transition:opacity .7s ease, transform .7s ease; }
  .reveal.in{ opacity:1; transform:translateY(0); }

  /* ---------- RESPONSIVE ---------- */
  @media (max-width:980px){
    nav.main-nav{ display:none; }
    .header-cta .btn-outline{ display:none; }
    .menu-toggle{ display:flex; }
    .hero-grid{ grid-template-columns:1fr; }
    .intro-grid{ grid-template-columns:1fr; }
    .mission-stats{ grid-template-columns:repeat(2,1fr); }
    .services-grid{ grid-template-columns:1fr; }
    .method-grid{ grid-template-columns:repeat(2,1fr); }
    .testi-grid{ grid-template-columns:1fr; }
    .footer-grid{ grid-template-columns:1fr 1fr; }
    .tab-panel.active{ grid-template-columns:1fr; }
    .hero-bg-label{ display:none; }
  }
  @media (max-width:560px){
    .field-row{ grid-template-columns:1fr; }
    .stat-strip{ grid-template-columns:repeat(3,1fr); gap:8px; }
    .footer-grid{ grid-template-columns:1fr; }
    .cta-final{ margin:0 14px; padding:44px 24px; }
    .checkpoint{ padding-left:64px; }
    .checkpoint-num{ width:48px; height:48px; font-size:15px; }
    .route::before{ left:23px; }
    .checkpoint-content{ grid-template-columns:1fr; }
    .checkpoint-visual{ min-height:130px; }
    .route-final{ margin-left:64px; grid-template-columns:1fr; text-align:center; padding:24px 20px; }
    .meta-trophy{ margin:0 auto; }
    .meta-steps{ justify-content:center; }
    .wa-tooltip{ display:none; }
    .modal-card{ padding:30px 20px 24px; }
    .promo-education-visual{ height:138px; }
    .cta-bg-label{ font-size:9.5px; padding:5px 9px; }
  }

  /* ---------- AJUSTE FINO PARA CELULARES PEQUEÑOS ---------- */
  @media (max-width:560px){
    html,
    body{
      width:100%;
      max-width:100%;
      overflow-x:hidden;
    }

    .container{
      width:100%;
      max-width:100%;
      padding-left:16px;
      padding-right:16px;
    }

    .header-inner{
      width:100%;
      padding:10px 14px;
      gap:8px;
    }

    .brand{
      min-width:0;
      gap:7px;
    }

    .brand img{
      height:38px;
      flex-shrink:0;
    }

    .brand-text{
      font-size:14px;
      line-height:1.05;
    }

    .brand-text span{
      font-size:8px;
      letter-spacing:.05em;
    }

    .header-cta{
      gap:5px;
      flex-shrink:0;
    }

    .header-cta .btn{
      padding:9px 13px;
      gap:6px;
      font-size:12px;
    }

    .menu-toggle{
      padding:5px;
      flex-shrink:0;
    }

    .menu-toggle span{
      width:21px;
    }

    .hero{
      width:100%;
      min-height:auto;
      padding:96px 0 56px;
    }

    .hero-grid{
      width:100%;
      max-width:100%;
      grid-template-columns:minmax(0,1fr);
      gap:34px;
      margin:0;
    }

    .hero-grid > *{
      width:100%;
      max-width:100%;
      min-width:0;
    }

    .hero .eyebrow,
    .hero .kicker{
      max-width:100%;
      font-size:10px;
      line-height:1.5;
      letter-spacing:.08em;
      white-space:normal;
    }

    .hero h1{
      max-width:100%;
      font-size:clamp(30px,9.4vw,39px);
      line-height:1.07;
      margin-bottom:18px;
      overflow-wrap:break-word;
    }

    .hero-lead{
      width:100%;
      max-width:none;
      font-size:15px;
      line-height:1.55;
      margin-bottom:26px;
    }

    .hero-actions{
      width:100%;
      display:grid;
      grid-template-columns:minmax(0,1fr);
      gap:12px;
      margin-bottom:34px;
    }

    .hero-actions .btn{
      width:100%;
      max-width:100%;
      padding:14px 16px;
      white-space:normal;
      text-align:center;
    }

    .stat-strip{
      width:100%;
      max-width:none;
      grid-template-columns:repeat(3,minmax(0,1fr));
      gap:6px;
      padding-top:20px;
    }

    .stat-strip div{
      min-width:0;
      padding-right:4px;
    }

    .stat-num{
      font-size:clamp(21px,7vw,27px);
    }

    .stat-label{
      font-size:9px;
      line-height:1.4;
      letter-spacing:.025em;
      overflow-wrap:anywhere;
    }

    .ficha{
      width:100%;
      max-width:100%;
      min-width:0;
      margin:0 auto;
      padding:28px 18px 22px;
      border-radius:18px;
    }

    .ficha::before{
      inset:7px;
      border-radius:13px;
    }

    .ficha-head{
      width:100%;
      min-width:0;
      flex-direction:column;
      align-items:flex-start;
      gap:12px;
      margin-bottom:20px;
      padding-bottom:16px;
    }

    .ficha-head > div{
      width:100%;
      min-width:0;
    }

    .ficha-head h3{
      font-size:19px;
      line-height:1.2;
    }

    .ficha-head p{
      max-width:100%;
      font-size:11px;
      line-height:1.55;
      overflow-wrap:anywhere;
    }

    .ficha-id{
      max-width:100%;
      padding:5px 8px;
      font-size:9px;
      white-space:normal;
      overflow-wrap:anywhere;
    }

    .field,
    .field-row{
      width:100%;
      max-width:100%;
      min-width:0;
    }

    .field-row{
      grid-template-columns:minmax(0,1fr);
      gap:0;
    }

    .field label{
      font-size:10px;
      line-height:1.4;
    }

    .field input,
    .field select{
      width:100%;
      max-width:100%;
      min-width:0;
      padding:12px;
      font-size:16px;
    }

    .ficha .btn-primary{
      width:100%;
      max-width:100%;
      padding:14px 12px;
      font-size:14px;
      white-space:normal;
    }

    .ficha-note{
      padding:0 4px;
      font-size:10px;
      line-height:1.45;
    }

    .float-wa-wrap{
      right:14px;
      bottom:14px;
      width:56px;
      height:56px;
    }

    .promo-education-visual{
      height:auto;
      aspect-ratio:3 / 2;
    }
  }

  @media (max-width:380px){
    .container{
      padding-left:13px;
      padding-right:13px;
    }

    .header-inner{
      padding-left:10px;
      padding-right:10px;
    }

    .brand img{
      height:34px;
    }

    .brand-text{
      font-size:13px;
    }

    .header-cta .btn{
      padding:8px 10px;
      font-size:11px;
    }

    .hero h1{
      font-size:clamp(28px,9.2vw,34px);
    }

    .hero-lead{
      font-size:14.5px;
    }

    .ficha{
      padding:25px 14px 20px;
    }

    .stat-label{
      font-size:8px;
    }
  }

  @media (prefers-reduced-motion: reduce){
    *{ animation:none !important; transition:none !important; }
    html{ scroll-behavior:auto; }
  }
