/* Sistema visual de lucom.com.ar — extraído de planes.html.
   Las landings de campaña usan estas mismas clases para verse idénticas.
   Si cambiás algo acá, revisá planes.html (mantiene su CSS inline). */
:root{--rojo:#DA291C;--rojo-osc:#C7251A;--rojo-grad:#B52217;--dark:#16171a;--texto:#3C3C3C;--texto-fuerte:#2D2D2D;--texto-2:#6C6C6C;--borde:#DBDBDB;--accent:#0097A9;--naranja:#FF8300;--satoshi:'Satoshi',-apple-system,BlinkMacSystemFont,sans-serif;}
*{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;}
body{font-family:var(--satoshi);background:#fff;color:var(--texto);-webkit-font-smoothing:antialiased;overflow-x:hidden;text-wrap:pretty;}
a{color:var(--rojo);text-decoration:none;}
a:hover{color:var(--rojo-grad);}
img{max-width:100%;display:block;}
section{scroll-margin-top:80px;}

/* ===== bloque 1 ===== */
:root{
    --rojo:#DA291C;        
    --rojo-osc:#C7251A;     
    --rojo-grad:#B52217;    
    --texto:#3C3C3C;        
    --texto-fuerte:#2D2D2D; 
    --texto-2:#6C6C6C;      
    --gris-tachado:#989898; 
    --teal-bg:#DAF0F3;      
    --accent:#0097A9;       
    --naranja:#FF8300;      
    --borde:#DBDBDB;        
    --card-grad-top:#e0e7f6cc;
    --card-radio:12px;
    
    --roboto:'Satoshi','Roboto',-apple-system,BlinkMacSystemFont,'Segoe UI',Helvetica,Arial,sans-serif;
    --amx:'Satoshi','Roboto',sans-serif;
    --satoshi:'Satoshi','Roboto',-apple-system,BlinkMacSystemFont,sans-serif;
  }
  *{box-sizing:border-box;margin:0;padding:0;}
  html{scroll-behavior:smooth;}
  #grid,#portaGrid{scroll-margin-top:90px;}
  @media(prefers-reduced-motion:reduce){html{scroll-behavior:auto;}}
  body{
    font-family:var(--satoshi);
    background:#fff;
    color:var(--texto);
    -webkit-font-smoothing:antialiased;
    display:flex;
    flex-direction:column;
    min-height:100vh;
  }

  .site-header{
    border-bottom:1px solid rgba(45,45,45,.08);
    background:#fff;
    box-shadow:0 4px 18px rgba(45,45,45,.08);
  }
  .hdr-inner{
    max-width:1040px;margin:0 auto;
    padding:21px 24px;
    display:flex;align-items:center;gap:16px;
  }
  .hdr-logo{height:32px;width:auto;display:block;}
  .hdr-sep{width:1px;height:30px;background:var(--borde);display:block;}
  .hdr-oficial{
    display:flex;align-items:center;gap:10px;
    font-size:13px;font-weight:500;color:var(--texto-2);
  }
  .logo-claro-ph{
    height:30px;min-width:74px;padding:0 12px;
    display:flex;align-items:center;justify-content:center;
    border:1px dashed var(--rojo);border-radius:6px;
    font-size:11px;font-weight:700;color:var(--rojo);
    letter-spacing:.3px;white-space:nowrap;
  }

  .hdr-claro{height:50px;width:auto;display:block;}

  .modepill{
    position:relative;
    margin-left:auto;
    overflow:hidden;
    display:inline-flex;gap:4px;padding:5px;
    background:linear-gradient(180deg,#f6f7fa 0%,#eef0f5 100%);
    border:1px solid rgba(45,45,45,.04);
    border-radius:50px;
    box-shadow:inset 0 1px 2px rgba(255,255,255,.9), inset 0 -1px 2px rgba(45,45,45,.07), 0 2px 6px rgba(45,45,45,.08);
  }
  .pill-thumb{
    position:absolute;top:5px;height:36px;left:5px;width:0;
    border-radius:50px;z-index:0;
    background:linear-gradient(180deg,#ffffff 0%,#fbfbfd 100%);
    box-shadow:0 3px 8px rgba(45,45,45,.16), 0 1px 2px rgba(45,45,45,.1), inset 0 1px 0 #fff;
    transition:left .5s cubic-bezier(.65,0,.35,1), width .5s cubic-bezier(.65,0,.35,1);
  }
  .modepill .mode{
    position:relative;z-index:1;
    display:inline-flex;align-items:center;gap:8px;
    border:none;background:transparent;cursor:pointer;
    font-family:inherit;font-size:13.5px;font-weight:600;color:var(--texto-2);
    height:36px;padding:0 20px;border-radius:50px;white-space:nowrap;
    transition:color .3s ease;
  }
  .modepill .mode svg{width:17px;height:17px;opacity:.55;transition:opacity .25s ease;}
  .modepill .mode:hover{color:var(--texto-fuerte);}
  .modepill .mode:hover svg{opacity:.85;}
  .modepill .mode.active{color:var(--rojo);}
  .modepill .mode.active svg{opacity:1;}

  /* --- Selector principal de modo (botones prominentes en el header) --- */
  .mode-switch{
    margin-left:auto;
    display:flex;gap:13px;align-items:stretch;
  }
  .mode-switch .pill-thumb{display:none;}
  .mode-switch .mode{
    display:inline-flex;align-items:center;gap:8px;
    min-height:43px;padding:0 19px;
    background:#fff;
    border:1px solid rgba(45,45,45,.22);border-radius:50px;
    font-family:inherit;font-size:11px;font-weight:800;letter-spacing:.3px;
    text-transform:uppercase;line-height:1.15;text-align:left;
    color:var(--texto-2);cursor:pointer;
    transition:border-color .25s ease, color .25s ease, background .35s ease, transform .2s ease;
  }
  .mode-switch .mode svg{width:16px;height:16px;flex:none;opacity:.6;transition:opacity .25s ease;}
  .mode-switch .mode:hover{border-color:rgba(45,45,45,.42);color:var(--texto-fuerte);transform:translateY(-1px);}
  .mode-switch .mode:hover svg{opacity:.9;}
  .mode-switch .mode.active{
    color:#fff;border-color:#16171a;
    background:#16171a;
    background-clip:border-box;
  }
  .mode-switch .mode.active svg{opacity:1;}
  @media(prefers-reduced-motion:reduce){
    .mode-switch .mode{transition:none;}
  }
  @media(max-width:860px){
    .hdr-inner{flex-wrap:wrap;}
    .mode-switch{margin-left:0;width:100%;gap:12px;}
    .mode-switch .mode{flex:1 1 0;justify-content:center;}
  }
  @media(max-width:560px){
    .mode-switch{flex-direction:column;}
    .mode-switch .mode{justify-content:flex-start;min-height:52px;}
  }
  @media(prefers-reduced-motion:reduce){
    .pill-thumb{transition:left .2s ease, width .2s ease;}
  }

  @keyframes viewIn{
    from{opacity:0;transform:translateY(10px);}
    to{opacity:1;transform:translateY(0);}
  }
  .view-anim{animation:viewIn .42s cubic-bezier(.22,.61,.36,1);}
  @media(prefers-reduced-motion:reduce){
    .view-anim{animation:none;}
  }

  .hero{
    position:relative;overflow:hidden;width:100%;
    min-height:calc((100vh - 73px) * 0.7);
    min-height:calc((100dvh - 73px) * 0.7);
    display:flex;align-items:center;
    color:#fff;
    border-radius:0 0 36px 36px;
    background:
      radial-gradient(760px 480px at 112% -8%, rgba(218,41,28,.55), transparent 60%),
      radial-gradient(560px 560px at -12% 120%, rgba(0,151,169,.22), transparent 60%),
      linear-gradient(125deg,#23262d 0%,#15171b 56%,#1f222880 100%),
      #16181c;
  }
  .hero--internet{
    background:#16181c;
  }
  .hero--internet::before{
    content:"";position:absolute;inset:0;z-index:0;border-radius:inherit;
    background:var(--img-hero-int,url("uploads/v2/hero.webp")) var(--pos-hero-int,center right) / cover no-repeat;
    transform:scale(1.05);
    animation:heroPan 30s ease-in-out infinite;
    will-change:transform;
  }
  .hero.hero--internet::after{
    content:"";position:absolute;inset:0;top:0;left:0;right:0;bottom:0;
    width:auto;height:auto;border-radius:inherit;z-index:1;
    -webkit-mask:none;mask:none;
    background:
      linear-gradient(90deg, rgba(16,18,22,.5) 0%, rgba(16,18,22,.62) 54%, rgba(16,18,22,.72) 100%),
      linear-gradient(0deg, rgba(16,18,22,.28) 0%, rgba(16,18,22,0) 60%);
  }
  @keyframes heroPan{0%,100%{transform:scale(1.05);}50%{transform:scale(1.11);}}
  @media(prefers-reduced-motion:reduce){.hero--internet::before,.hero--porta::before{animation:none;}}
  .hero--porta{
    background:#16181c;
  }
  .hero--porta::before{
    content:"";position:absolute;inset:0;z-index:0;border-radius:inherit;
    background:var(--img-hero-porta,url("uploads/porta-hero.jpg")) var(--pos-hero-porta,center 30%) / cover no-repeat;
    transform:scale(1.05);
    animation:heroPan 30s ease-in-out infinite;
    will-change:transform;
  }
  .hero.hero--porta::after{
    content:"";position:absolute;inset:0;top:0;left:0;right:0;bottom:0;
    width:auto;height:auto;border-radius:inherit;z-index:1;
    -webkit-mask:none;mask:none;
    background:
      linear-gradient(90deg, rgba(16,18,22,.82) 0%, rgba(16,18,22,.6) 50%, rgba(16,18,22,.35) 100%),
      linear-gradient(0deg, rgba(16,18,22,.3) 0%, rgba(16,18,22,0) 60%);
  }
  .hero::after{
    content:"";position:absolute;right:-180px;top:-180px;width:620px;height:620px;
    border-radius:50%;pointer-events:none;
    background:repeating-radial-gradient(circle at center, rgba(255,255,255,.05) 0 1px, transparent 1px 46px);
    -webkit-mask:radial-gradient(circle at center, #000 60%, transparent 72%);
            mask:radial-gradient(circle at center, #000 60%, transparent 72%);
  }
  .hero-inner{
    position:relative;z-index:2;
    max-width:1040px;margin:0 auto;width:100%;
    padding:48px 24px;
  }
  .hero-kicker{
    display:inline-block;font-family:var(--satoshi);font-size:12.5px;font-weight:700;letter-spacing:1.4px;text-transform:uppercase;
    color:rgba(255,255,255,.72);
    padding:6px 14px;border:1px solid rgba(255,255,255,.22);border-radius:50px;
    margin-bottom:24px;
  }
  
  @keyframes digitFade{from{opacity:0;transform:translateY(6px);}to{opacity:1;transform:translateY(0);}}
  .hero-kicker--free{
    background:#fff;color:var(--texto-fuerte);border-color:#fff;font-weight:800;letter-spacing:1px;
  }
  .hero--porta .hero-kicker{
    background:#fff;color:var(--texto-fuerte);border-color:#fff;font-weight:800;
  }
  
  .hero-inner--2col{
    display:grid;grid-template-columns:1fr .9fr;gap:44px;align-items:center;
  }
  .hero-inner--2col h1{text-wrap:initial;}
  .hero-inner--2col{align-items:stretch;}
  .hero-inner--2col .hero-left{display:flex;flex-direction:column;justify-content:center;}
  .hero-inner--2col .hero-left .hero-cta{margin-top:34px;padding-top:0;align-self:flex-start;}
  .hero-inner--2col .hero-left h1{font-weight:300;font-size:clamp(36px,5.58vw,64.8px);}
  .h1-bold{font-weight:900;}
  .hero-promo{
    position:relative;
    background:linear-gradient(180deg, rgba(16,17,22,.5), rgba(16,17,22,.4));
    border:1px solid rgba(255,255,255,.18);
    border-radius:22px;
    -webkit-backdrop-filter:blur(11px) saturate(1.3);backdrop-filter:blur(11px) saturate(1.3);
    box-shadow:0 24px 60px rgba(0,0,0,.4);
  }
  .ticket-body{padding:27px 29px 23px;text-align:center;display:flex;flex-direction:column;align-items:center;}
  .ticket-tag{
    display:block;font-family:var(--satoshi);font-size:12px;font-weight:400;
    letter-spacing:.4px;color:rgba(255,255,255,.62);margin-top:11px;
  }
  .ticket-price{display:flex;justify-content:center;align-items:baseline;gap:0;}
  .tp-spacer{flex:1;}
  .tp-amount{flex:none;font-family:var(--satoshi);font-size:76px;font-weight:900;letter-spacing:-2.4px;color:#fff;line-height:1;}
  .tp-sign{font-size:.7em;letter-spacing:0;font-weight:700;vertical-align:.1em;}
  .tp-per{flex:1;font-family:var(--satoshi);font-size:19px;font-weight:600;color:rgba(255,255,255,.62);padding-left:8px;}
  .ticket-speed .ts-fibra{font-weight:400;letter-spacing:.6px;opacity:.88;}
  .ticket-speed{
    display:inline-block;margin:0 0 14px;
    font-family:var(--satoshi);font-size:15px;font-weight:900;letter-spacing:-.5px;color:#fff;
    padding:5px 17px;border-radius:50px;white-space:nowrap;
    background:#d6281c;box-shadow:0 6px 16px rgba(131,23,15,.42);
  }
  .ticket-stub{
    display:flex;align-items:center;justify-content:center;flex-direction:column;gap:3px;
    padding:12px 22px;border-top:1px solid rgba(255,255,255,.16);
    font-family:var(--satoshi);font-size:15px;text-align:center;
    background:#fff;border-radius:0 0 22px 22px;
    color:var(--texto-fuerte);
  }
  .ticket-stub b{font-weight:900;color:var(--texto-fuerte);font-size:16px;}
  .stub-detail{font-size:16px;font-weight:500;}
  .hero-offer-mob{display:none;}
  @media(max-width:760px){
    .hero-inner--2col{grid-template-columns:1fr;gap:30px;}
    .hero-promo{max-width:400px;}
  }
  .hero-inner h1{
    font-family:var(--satoshi);font-size:clamp(40px,6.2vw,72px);font-weight:900;letter-spacing:-1.5px;line-height:1.02;
    text-wrap:balance;
  }
  .hero-inner p{font-family:var(--satoshi);margin-top:18px;padding-top:18px;border-top:1px solid rgba(255,255,255,1);font-size:clamp(17px,2vw,22px);color:rgba(255,255,255,.82);font-weight:500;max-width:620px;text-wrap:pretty;}
  .hero-cta{
    margin-top:34px;display:inline-flex;align-items:center;gap:10px;font-family:var(--satoshi);
    background:#d6281c;color:#fff;text-decoration:none;
    height:50px;padding:0 28px;border-radius:100px;font-size:16px;font-weight:600;white-space:nowrap;
    transition:transform .2s ease, box-shadow .2s ease;
  }
  .hero-cta:hover{transform:translateY(-2px);}
  .hero-cta svg{width:18px;height:18px;}

  .hero-inner .word{display:inline-block;}
  @keyframes heroWordIn{
    from{opacity:0;transform:translateY(.5em) rotateX(-55deg);filter:blur(7px);}
    to{opacity:1;transform:none;filter:blur(0);}
  }
  .hero-anim .hero-reveal{
    transform-origin:bottom;
    animation:heroWordIn .5s cubic-bezier(.2,.75,.25,1) backwards;
    animation-delay:var(--d,0s);
  }
  @media(prefers-reduced-motion:reduce){
    .hero-anim .hero-reveal{animation:none;}
  }

  .porta-soon{
    max-width:1040px;margin:0 auto;width:100%;
    padding:90px 24px;text-align:center;
    display:flex;flex-direction:column;align-items:center;
  }
  .porta-ico{
    width:64px;height:64px;border-radius:50%;background:#fff;
    box-shadow:0 4px 14px rgba(45,45,45,.12);
    display:flex;align-items:center;justify-content:center;margin-bottom:18px;
  }
  .porta-ico svg{width:28px;height:28px;}
  .porta-soon h2{font-family:var(--amx);font-size:30px;font-weight:700;color:var(--texto-fuerte);}
  .porta-soon p{margin-top:10px;font-size:16px;color:var(--texto-2);max-width:480px;text-wrap:pretty;}

  .porta-head{max-width:1040px;margin:0 auto;width:100%;padding:44px 24px 4px;text-align:center;}
  .porta-rotulo{
    display:inline-block;background:#FF8300;color:#fff;
    font-size:13px;font-weight:700;letter-spacing:.3px;
    padding:6px 16px;border-radius:50px;margin-top:18px;
    box-shadow:0 4px 10px rgba(255,131,0,.32);
  }
  .porta-tabla-rotulo{
    max-width:1040px;margin:0 auto;width:100%;
    padding:28px 24px 0;text-align:center;
  }
  .porta-tabla-rotulo .porta-rotulo{margin-top:0;}
  .porta-head h2{font-family:var(--amx);font-size:32px;font-weight:700;letter-spacing:-.5px;color:var(--texto-fuerte);}
  .porta-head p{margin-top:10px;font-size:17px;color:var(--texto-2);max-width:560px;margin-left:auto;margin-right:auto;text-wrap:pretty;}
  .porta-scope{
    padding:0 22px 4px;text-align:center;
    font-size:13px;line-height:1.5;color:var(--texto-2);font-weight:400;text-wrap:pretty;
  }

  .origin-wrap{max-width:1040px;margin:0 auto;width:100%;padding:26px 24px 0;text-align:center;}
  .origin-label{font-size:13px;font-weight:700;letter-spacing:.3px;color:var(--texto-2);margin-bottom:12px;}
  .origin-pill{
    display:inline-flex;gap:5px;flex-wrap:wrap;justify-content:center;
    background:linear-gradient(180deg,#f6f7fa 0%,#eef0f5 100%);
    border:1px solid rgba(45,45,45,.06);
    border-radius:50px;padding:5px;
    box-shadow:inset 0 1px 2px rgba(255,255,255,.9),inset 0 -1px 2px rgba(45,45,45,.07),0 2px 6px rgba(45,45,45,.08);
  }
  .origin-btn{
    border:none;background:transparent;cursor:pointer;
    font-family:inherit;font-size:13.5px;font-weight:600;color:var(--texto-2);
    height:38px;padding:0 20px;border-radius:50px;white-space:nowrap;
    transition:color .2s,background .2s,box-shadow .2s;
  }
  .origin-btn:hover{color:var(--texto-fuerte);}
  .origin-btn.active{
    background:#fff;color:var(--rojo);
    box-shadow:0 3px 8px rgba(45,45,45,.16),0 1px 2px rgba(45,45,45,.1);
  }
  @media(max-width:640px){
    .origin-pill{gap:4px;padding:4px;border-radius:18px;}
    .origin-btn{font-size:12.5px;height:36px;padding:0 13px;border-radius:14px;}
  }

  .comp-label{
    max-width:1040px;margin:24px auto 8px;padding:0 24px;
    font-family:var(--satoshi);font-size:11px;font-weight:700;letter-spacing:1.2px;
    text-transform:uppercase;color:var(--texto-2);
  }
  .inc-opt-wrap{max-width:1040px;margin:28px auto 0;width:100%;padding:0 24px;}

  .inc-opt-a{
    display:flex;align-items:center;gap:32px;flex-wrap:wrap;
    background:linear-gradient(100deg,#16191f 0%,#21252d 100%);
    border-radius:22px;padding:30px 36px;
    box-shadow:0 8px 28px rgba(0,0,0,.22);
    border-left:4px solid var(--rojo);
  }
  .io-left{min-width:0;}
  .io-tag{
    font-family:var(--satoshi);font-size:clamp(18px,2.4vw,24px);font-weight:900;
    letter-spacing:-.4px;color:#fff;
    display:block;
  }
  .io-items{display:flex;gap:12px;flex-wrap:wrap;flex:1;justify-content:flex-end;}
  .io-chip{
    display:flex;align-items:center;gap:10px;
    background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.12);
    border-radius:50px;padding:12px 18px;
    font-family:var(--satoshi);font-size:15px;font-weight:600;color:#fff;white-space:nowrap;
  }
  .io-ico{
    width:30px;height:30px;border-radius:50%;flex:none;
    display:flex;align-items:center;justify-content:center;
    background:#d6281c;
    box-shadow:0 4px 10px rgba(131,23,15,.38);
  }
  .io-ico svg{width:16px;height:16px;color:#fff;}

  .inc-opt-b{
    background:#fff;border:1px solid #e7eaf0;border-radius:22px;
    padding:34px 40px;text-align:center;
    box-shadow:0 4px 20px rgba(45,45,45,.07);
  }
  .inc-opt-b h3{
    font-family:var(--satoshi);font-size:clamp(20px,2.6vw,28px);font-weight:900;
    letter-spacing:-.5px;color:var(--texto-fuerte);margin-bottom:28px;
  }
  .iob-items{display:flex;align-items:stretch;justify-content:center;gap:0;}
  .iob-col{display:flex;flex-direction:column;align-items:center;gap:12px;padding:0 36px;flex:1;max-width:280px;}
  .iob-sep{width:1px;background:var(--borde);align-self:stretch;}
  .iob-ico{
    width:60px;height:60px;border-radius:18px;flex:none;
    display:flex;align-items:center;justify-content:center;
    background:#d6281c;
    box-shadow:0 8px 18px rgba(131,23,15,.3);
  }
  .iob-ico svg{width:28px;height:28px;color:#fff;}
  .iob-txt{font-family:var(--satoshi);font-size:16px;font-weight:700;color:var(--texto-fuerte);line-height:1.25;text-wrap:balance;}
  @media(max-width:640px){
    .inc-opt-a{flex-direction:column;gap:20px;border-left:none;border-top:4px solid var(--rojo);}
    .io-items{justify-content:flex-start;}
    .iob-col{padding:0 16px;}
    .iob-sep{display:none;}
  }

  .porta-cta-text{max-width:760px;margin:0 auto;width:100%;padding:34px 24px 0;text-align:center;}
  .porta-cta-text h3{font-family:var(--satoshi);font-size:clamp(20px,2.6vw,26px);font-weight:900;letter-spacing:-.4px;color:var(--texto-fuerte);line-height:1.2;text-wrap:balance;}
  .porta-cta-text p{margin-top:10px;font-size:16px;color:var(--texto-2);text-wrap:pretty;}
  .porta-steps{max-width:1040px;margin:0 auto;width:100%;padding:56px 24px 16px;}
  .porta-steps h3{
    font-family:var(--amx);font-size:26px;font-weight:700;letter-spacing:-.3px;
    color:var(--texto-fuerte);text-align:center;margin-bottom:34px;
  }
  .steps-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:16px;position:relative;}
  .steps-line{
    position:absolute;top:53px;left:10%;right:10%;height:2px;z-index:0;
    background:repeating-linear-gradient(90deg,#f0c5c1 0 8px,transparent 8px 16px);
  }
  .step-card{
    position:relative;z-index:1;background:#fff;
    border:1px solid #e7eaf0;border-radius:18px;
    padding:26px 18px 22px;text-align:center;
    box-shadow:0 2px 10px rgba(45,45,45,.05);
    transition:transform .22s ease, box-shadow .22s ease, border-color .22s ease;
  }
  .step-card:hover{transform:translateY(-4px);box-shadow:0 12px 26px rgba(45,45,45,.1);border-color:#dfe3ec;}
  .step-badge{
    position:absolute;top:14px;right:14px;
    width:24px;height:24px;border-radius:50%;
    background:#2d2d2d;color:#fff;font-size:12px;font-weight:700;
    display:flex;align-items:center;justify-content:center;
    box-shadow:0 2px 6px rgba(0,0,0,.18);
  }
  .step-ico{
    width:56px;height:56px;border-radius:16px;margin:0 auto 16px;
    display:flex;align-items:center;justify-content:center;
    background:linear-gradient(180deg,#fdeceb 0%,#fbe1de 100%);color:var(--rojo);
  }
  .step-ico svg{width:27px;height:27px;}
  .step-ttl{font-size:15px;font-weight:700;color:var(--texto-fuerte);line-height:1.3;text-wrap:balance;}
  .step-desc{margin-top:7px;font-size:13px;color:var(--texto-2);line-height:1.5;text-wrap:pretty;}

  @keyframes stepIn{from{opacity:0;transform:translateY(20px);}to{opacity:1;transform:translateY(0);}}
  .steps-grid.steps-anim .step-card{opacity:0;animation:stepIn .5s cubic-bezier(.22,.61,.36,1) forwards;}
  .steps-grid.steps-anim .step-card:nth-child(2){animation-delay:.12s;}
  .steps-grid.steps-anim .step-card:nth-child(3){animation-delay:.26s;}
  .steps-grid.steps-anim .step-card:nth-child(4){animation-delay:.40s;}
  .steps-grid.steps-anim .step-card:nth-child(5){animation-delay:.54s;}
  .steps-grid.steps-anim .step-card:nth-child(6){animation-delay:.68s;}
  @media(prefers-reduced-motion:reduce){
    .steps-grid.steps-anim .step-card{opacity:1;animation:none;}
  }
  @media(max-width:840px){
    .steps-grid{grid-template-columns:repeat(2,1fr);gap:14px;}
    .steps-line{display:none;}
  }
  @media(max-width:460px){
    .steps-grid{grid-template-columns:1fr;}
  }

  .plan-modal{position:fixed;inset:0;z-index:120;display:none;align-items:center;justify-content:center;padding:24px;background:rgba(20,21,26,.55);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);}
  .plan-modal.open{display:flex;}
  .pm-card{background:#fff;border-radius:22px;width:100%;max-width:440px;max-height:88vh;overflow:auto;box-shadow:0 30px 80px rgba(0,0,0,.4);}
  .pm-head{position:relative;padding:30px 30px 24px;border-bottom:1px solid var(--borde);text-align:center;}
  .pm-head .pm-lead{font-size:14px;color:var(--texto-2);}
  .pm-logo{height:34px;width:auto;display:block;margin:0 auto 16px;}
  .pm-claro{margin-top:6px;font-size:14px;font-weight:600;color:var(--texto-2);}
  .pm-price{font-family:var(--satoshi);font-size:42px;font-weight:900;letter-spacing:-1.5px;color:var(--texto-fuerte);margin-top:6px;line-height:1;}
  .pm-price .pm-mes{font-size:17px;font-weight:600;color:var(--texto-2);}
  .pm-old{display:none;}
  .pm-promo{display:inline-block;margin-top:14px;background:#3c3c3c;color:#fff;font-size:13px;font-weight:700;padding:6px 16px;border-radius:50px;}
  .pm-close{position:absolute;top:16px;right:16px;width:34px;height:34px;border:none;background:var(--borde);border-radius:50%;color:var(--texto-fuerte);font-size:18px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .2s;}
  .pm-close:hover{background:#d8d8d8;}
  .pm-body{padding:22px 30px 30px;}
  .pm-sec{font-family:var(--satoshi);font-size:13px;font-weight:800;text-transform:uppercase;letter-spacing:.6px;color:var(--rojo);margin:18px 0 10px;}
  .pm-sec:first-child{margin-top:0;}
  .pm-li{display:flex;align-items:flex-start;gap:9px;font-size:14.5px;color:var(--texto);line-height:1.4;padding:5px 0;}
  .pm-li svg{width:17px;height:17px;color:#1f8a5b;flex:none;margin-top:1px;}

  .wsp-float{
    position:fixed;right:22px;bottom:22px;z-index:60;
    transition:transform .2s ease, box-shadow .2s ease;
    display:inline-flex;align-items:center;gap:10px;
    background:#25D366;color:#fff;text-decoration:none;
    padding:13px 20px;border-radius:50px;font-weight:600;font-size:15px;
    box-shadow:0 6px 16px rgba(0,0,0,.18);
  }
  .wsp-float:hover{transform:translateY(-2px);box-shadow:0 8px 20px rgba(0,0,0,.22);}
  .wsp-float svg{width:22px;height:22px;flex:none;}
  @media(max-width:520px){
    .wsp-float{font-size:0;gap:0;padding:15px;}
    .wsp-float svg{width:26px;height:26px;}
  }

  .banner-wrap{max-width:1040px;margin:0 auto;width:100%;padding:13px 24px 0;}
  .banner-carousel{overflow:hidden;border-radius:18px;}
  .banner-track{display:flex;}
  .slide{flex:0 0 100%;}
  .banner-dots{display:flex;justify-content:center;gap:8px;margin-top:14px;}
  .dot{width:8px;height:8px;border-radius:50%;background:var(--borde);border:none;padding:0;cursor:pointer;transition:all .3s;}
  .dot:hover{background:var(--gris-tachado);}
  .dot.active{background:var(--rojo);width:22px;border-radius:5px;}
  .banner{
    position:relative;overflow:hidden;
    background:
      radial-gradient(120px 120px at 86% 18%, rgba(218,41,28,.06), transparent 70%),
      radial-gradient(160px 160px at 95% 110%, rgba(0,151,169,.07), transparent 70%),
      linear-gradient(120deg,#eef1f8 0%,#f6f7fb 55%,#f1f3f9 100%);
    border:1px solid #e4e8f1;
    border-radius:18px;
    box-shadow:0 2px 10px rgba(45,45,45,.07);
    padding:26px 32px;
    display:flex;align-items:center;gap:26px;
  }
  .banner-ico{
    flex:none;width:64px;height:64px;border-radius:50%;
    background:#fff;box-shadow:0 4px 14px rgba(45,45,45,.12);
    display:flex;align-items:center;justify-content:center;
  }
  .banner-ico svg{width:30px;height:30px;}
  .banner-ico--img{width:auto;height:auto;border-radius:0;background:none;box-shadow:none;}
  .banner-ico--img img{height:46px;width:auto;display:block;}
  .banner-claroball{height:52px !important;}
  .banner-div{flex:none;width:1px;align-self:stretch;margin:6px 0;background:linear-gradient(180deg,transparent,rgba(45,45,45,.16) 22%,rgba(45,45,45,.16) 78%,transparent);}
  .banner-txt{flex:1;min-width:0;}
  .banner-txt h2{
    font-family:var(--satoshi);
    font-size:30px;font-weight:900;letter-spacing:-.4px;
    color:var(--texto-fuerte);line-height:1.1;
  }
  .banner-txt p{
    font-family:var(--satoshi);margin-top:8px;font-size:16px;color:var(--texto-2);text-wrap:pretty;
  }
  .banner-cta{
    flex:none;
    background:#d6281c;
    color:#fff;border:1px solid transparent;border-radius:100px;
    height:44px;padding:0 30px;font-size:16px;font-weight:600;cursor:pointer;
    transition:all .3s;white-space:nowrap;text-decoration:none;
    display:inline-flex;align-items:center;
  }
  .banner-cta:hover{background:#fff;color:var(--rojo);border-color:var(--rojo);box-shadow:none;}

  .tabs{
    max-width:1040px;margin:0 auto;width:100%;
    padding:30px 24px 4px;
    display:flex;justify-content:center;gap:48px;
    border-bottom:1px solid var(--borde);
  }
  .tab{
    display:flex;align-items:center;gap:9px;
    background:none;border:none;cursor:pointer;
    font-size:18px;font-weight:700;color:var(--gris-tachado);
    padding:0 4px 14px;position:relative;transition:color .2s;
  }
  .tab svg{width:22px;height:22px;}
  .tab:hover{color:var(--texto);}
  .tab.active{color:var(--rojo);}
  .tab.active::after{
    content:"";position:absolute;left:0;right:0;bottom:-1px;height:3px;
    background:var(--rojo);border-radius:3px 3px 0 0;
  }
  .ina-soon{
    text-align:center;color:var(--texto-2);font-size:16px;
    padding:60px 24px;max-width:480px;text-wrap:pretty;
  }
  .ina-card{width:340px;max-width:100%;}
  .ina-card .badge{width:auto;padding:0 18px;font-size:11px;letter-spacing:.3px;}
  .ina-tag{margin:14px 0 0;text-align:center;font-size:16px;}

  .content{flex:1;padding:24px 24px 56px;display:flex;justify-content:center;}
  .grid{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,312px));
    gap:16px;
    width:100%;
    max-width:976px;
    align-items:stretch;
  }

  .qr-banner-wrap{max-width:1040px;margin:0 auto;width:100%;padding:44px 24px 0;}
  .qr-banner{
    position:relative;overflow:hidden;border-radius:24px;
    display:flex;align-items:center;justify-content:space-between;gap:32px;
    padding:44px 44px;color:#fff;
    background:
      linear-gradient(90deg, rgba(16,17,22,.92) 0%, rgba(16,17,22,.74) 48%, rgba(16,17,22,.5) 100%),
      var(--img-wsp,url("uploads/v2/contacto.webp")) var(--pos-wsp,center 38%) / cover no-repeat;
  }
  .qr-divider{display:block;width:260px;max-width:100%;height:1px;background:rgba(255,255,255,.22);margin-top:22px;}
  .qr-banner-logos{
    display:flex;align-items:center;gap:14px;opacity:.92;margin-top:14px;
  }
  .qr-banner-logos img{height:23px;width:auto;display:block;}
  .qr-banner-logos .qbl-claro{height:30px;}
  .qbl-sep{width:1px;height:20px;background:rgba(255,255,255,.35);display:block;}
  .qr-banner-txt{min-width:0;}
  .qr-kicker{
    display:inline-flex;align-items:center;gap:7px;font-family:var(--satoshi);
    font-size:12px;font-weight:700;letter-spacing:.8px;text-transform:uppercase;
    color:#25D366;background:rgba(37,211,102,.14);border:1px solid rgba(37,211,102,.35);
    padding:6px 13px;border-radius:50px;margin-bottom:16px;
  }
  .qr-kicker svg{width:15px;height:15px;}
  .qr-banner-txt h2{font-family:var(--satoshi);font-size:clamp(26px,3.4vw,38px);font-weight:900;letter-spacing:-.6px;line-height:1.05;text-wrap:balance;}
  .qr-banner-txt p{margin-top:12px;font-size:18.5px;color:rgba(255,255,255,.82);max-width:420px;text-wrap:pretty;}
  .qr-card{
    flex:none;background:#fff;border-radius:18px;padding:14px;
    display:flex;align-items:center;justify-content:center;
    box-shadow:0 16px 40px rgba(0,0,0,.35);
  }
  .qr-code{width:154px;height:154px;display:flex;align-items:center;justify-content:center;}
  .qr-code img,.qr-code canvas,.qr-code svg{width:154px !important;height:154px !important;display:block;}
  @media(max-width:640px){
    .qr-banner{flex-direction:column;text-align:center;gap:26px;padding:34px 26px;}
    .qr-banner-txt p{margin-left:auto;margin-right:auto;}
    .qr-divider{margin-left:auto;margin-right:auto;}
    .qr-banner-logos{justify-content:center;}
  }

  .contact{max-width:1040px;margin:0 auto;width:100%;padding:74px 24px 72px;}
  .contact-card{
    position:relative;overflow:hidden;
    background:
      radial-gradient(620px 280px at 100% -10%, rgba(218,41,28,.06), transparent 60%),
      linear-gradient(180deg,#fbfcfe 0%,#ffffff 60%);
    border:1px solid #e7eaf0;border-radius:26px;
    padding:44px 44px 40px;box-shadow:0 18px 46px rgba(45,45,45,.08);
  }
  .contact-head{text-align:center;margin-bottom:30px;display:flex;flex-direction:column;align-items:center;}
  .contact-head h3{font-family:var(--satoshi);font-size:30px;font-weight:900;letter-spacing:-.5px;color:var(--texto-fuerte);}
  .contact-head p{margin-top:9px;font-size:15.5px;color:var(--texto-2);text-wrap:pretty;max-width:480px;}
  .br-desk{display:none;}
  .br-mob{display:none;}
  .de-mob{display:none;}
  @media(min-width:621px){.br-desk{display:inline;}}
  .contact-form{display:flex;flex-direction:column;gap:18px;max-width:680px;margin:0 auto;}
  .field-row{display:grid;grid-template-columns:1fr 1fr;gap:18px;}
  .field{display:flex;flex-direction:column;gap:7px;}
  .field label{font-family:var(--satoshi);font-size:12px;font-weight:700;letter-spacing:.3px;text-transform:uppercase;color:var(--texto-2);}
  .field input,.field textarea,.field select{
    border:1.5px solid transparent;border-radius:13px;padding:0 15px;height:52px;
    font-family:inherit;font-size:15px;color:var(--texto-fuerte);outline:none;
    background:#f3f5f8;transition:border-color .2s, box-shadow .2s, background .2s;
  }
  .field input::placeholder,.field textarea::placeholder{color:#9aa1ac;}
  .field textarea{height:auto;padding:14px 15px;resize:vertical;min-height:92px;}
  .field select{appearance:none;-webkit-appearance:none;cursor:pointer;
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8' fill='none' stroke='%236C6C6C' stroke-width='2'%3E%3Cpath d='M1 1.5l5 5 5-5'/%3E%3C/svg%3E");
    background-repeat:no-repeat;background-position:right 15px center;padding-right:38px;}
  .field input:focus,.field textarea:focus,.field select:focus{background:#fff;border-color:var(--rojo);box-shadow:0 0 0 4px rgba(218,41,28,.1);}
  .field.invalid input,.field.invalid textarea,.field.invalid select{border-color:var(--rojo);background:#fff;}
  .field .err{font-size:12px;color:var(--rojo);min-height:0;font-weight:500;display:none;}
  .field.invalid .err{display:block;}
  .hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0;}
  .contact-btn{
    margin-top:10px;align-self:center;min-width:300px;font-family:var(--satoshi);
    display:inline-flex;align-items:center;justify-content:center;gap:9px;
    background:#d6281c;color:#fff;border:1.5px solid transparent;
    height:54px;border-radius:100px;font-size:16px;font-weight:700;cursor:pointer;
    box-shadow:0 10px 24px rgba(131,23,15,.32);transition:all .25s;
  }
  .contact-btn::after{content:"";width:16px;height:16px;
    -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14'/%3E%3Cpath d='M13 6l6 6-6 6'/%3E%3C/svg%3E") center/contain no-repeat;
            mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14'/%3E%3Cpath d='M13 6l6 6-6 6'/%3E%3C/svg%3E") center/contain no-repeat;
    background:currentColor;transition:transform .25s;}
  .contact-btn:hover{background:#fff;color:var(--rojo);border-color:var(--rojo);box-shadow:0 6px 16px rgba(131,23,15,.18);}
  .contact-btn:hover::after{transform:translateX(3px);}
  .form-ok{
    text-align:center;background:linear-gradient(180deg,#f8faf9,#f2f5f4);color:var(--texto);border:1px solid #e2e8e5;
    border-radius:18px;padding:34px 22px;font-weight:500;font-size:16px;
    transition:opacity .35s ease, transform .35s ease;
  }
  .form-ok--out{opacity:0;transform:translateY(-8px);}
  .form-ok-ico{
    display:flex;align-items:center;justify-content:center;
    width:52px;height:52px;margin:0 auto 14px;border-radius:50%;
    background:#1f8a5b;color:#fff;font-size:26px;font-weight:700;
    box-shadow:0 6px 16px rgba(31,138,91,.32);animation:okPop .4s cubic-bezier(.34,1.56,.5,1) both;
  }
  @keyframes okPop{from{transform:scale(.4);opacity:0;}to{transform:scale(1);opacity:1;}}
  .form-ok b{display:block;font-family:var(--satoshi);font-size:21px;font-weight:900;margin-bottom:6px;color:var(--texto-fuerte);}
  .form-ok-close{display:block;margin-top:12px;font-size:12.5px;font-weight:500;color:#5a9b7c;}
  .form-ok-wa{display:inline-flex;align-items:center;gap:8px;margin-top:16px;background:#25D366;color:#fff;font-weight:800;font-size:14.5px;padding:13px 24px;border-radius:50px;text-decoration:none;}
  .form-ok-wa svg{width:18px;height:18px;fill:currentColor;}
  .form-ok-bar{display:block;margin:18px auto 0;width:200px;max-width:80%;height:5px;border-radius:5px;background:#cfeede;overflow:hidden;}
  .form-ok-bar-fill{display:block;height:100%;width:100%;background:#1f8a5b;border-radius:5px;transform-origin:left;animation:okBar 10s linear forwards;}
  @keyframes okBar{from{transform:scaleX(1);}to{transform:scaleX(0);}}
  @media(max-width:620px){
    .field-row{grid-template-columns:1fr;}
    .contact-card{padding:30px 22px;}
    .contact{padding:54px 18px 56px;}
  }

  .site-footer-v2{
    background:linear-gradient(160deg,#16181c 0%,#1a1d24 60%,#111318 100%);
    border-top:2px solid #d6281c;
    position:relative;overflow:hidden;
  }
  .site-footer-v2::before{
    content:"";position:absolute;top:-120px;right:-80px;
    width:420px;height:420px;border-radius:50%;
    background:radial-gradient(circle,rgba(214,40,28,.12),transparent 68%);
    pointer-events:none;
  }
  .ftv2-top{
    position:relative;max-width:1040px;margin:0 auto;
    display:grid;grid-template-columns:1.5fr 1fr;gap:60px;
    padding:52px 24px 40px;
  }
  .ftv2-logos{display:flex;align-items:center;gap:16px;margin-bottom:20px;}
  .ftv2-logos img{height:32px;width:auto;display:block;}
  .ftv2-logos .ftv2-claro{height:42px;}
  .ftv2-sep{width:1px;height:26px;background:rgba(255,255,255,.2);display:block;}
  .ftv2-tag{
    font-family:var(--satoshi);font-size:14px;color:rgba(255,255,255,.52);
    line-height:1.7;margin-bottom:24px;max-width:320px;text-wrap:pretty;
  }
  .ftv2-social{display:flex;align-items:center;gap:10px;}
  .ftv2-social a{
    width:36px;height:36px;border-radius:10px;
    display:flex;align-items:center;justify-content:center;
    background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.1);
    color:rgba(255,255,255,.65);transition:all .2s;
  }
  .ftv2-social a:hover{background:rgba(214,40,28,.25);border-color:rgba(214,40,28,.4);color:#fff;}
  .ftv2-social svg{width:16px;height:16px;}
  .ftv2-nav{display:grid;grid-template-columns:1fr 1fr;gap:32px;padding-top:4px;}
  .ftv2-h{
    display:block;font-family:var(--satoshi);font-size:11px;font-weight:700;
    letter-spacing:1.2px;text-transform:uppercase;color:rgba(255,255,255,.36);
    margin-bottom:18px;
  }
  .ftv2-col a,.ftv2-addr{
    display:block;font-family:var(--satoshi);font-size:13.5px;
    color:rgba(255,255,255,.62);text-decoration:none;
    line-height:1.6;margin-bottom:10px;transition:color .15s;
  }
  .ftv2-col a:hover{color:#fff;}
  .ftv2-addr{color:rgba(255,255,255,.38);font-size:12.5px;line-height:1.7;}
  .ftv2-bottom{
    position:relative;max-width:1040px;margin:0 auto;
    display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;
    padding:16px 24px;border-top:1px solid rgba(255,255,255,.08);
    font-family:var(--satoshi);font-size:12px;color:rgba(255,255,255,.28);
  }
  .ftv2-badge{
    font-size:11px;font-weight:700;letter-spacing:.4px;text-transform:uppercase;
    color:rgba(214,40,28,.7);background:rgba(214,40,28,.1);
    padding:4px 12px;border-radius:50px;border:1px solid rgba(214,40,28,.2);
  }
  @media(max-width:720px){
    .ftv2-top{grid-template-columns:1fr;gap:32px;}
    .ftv2-nav{grid-template-columns:1fr;}
  }

  .site-footer{
    background:linear-gradient(180deg,#16181c 0%,#161a20 60%,#111318 100%);
    border-top:none;
  }
  .ft2-inner{
    max-width:760px;margin:0 auto;
    display:flex;flex-direction:column;align-items:center;gap:20px;
    padding:34px 24px 32px;text-align:center;
  }
  .ft-logos{display:flex;align-items:center;gap:14px;}
  .ft-logos img{height:34px;width:auto;display:block;}
  .ft-logos .ft-claro{height:46px;}
  .ft-sep{width:1px;height:28px;background:rgba(255,255,255,.28);display:block;}
  .ft2-divh{height:1px;border:0;background:rgba(255,255,255,.12);width:100%;max-width:560px;}
  .ft2-links{
    display:flex;flex-wrap:nowrap;justify-content:center;align-items:center;gap:10px 22px;
  }
  .ft2-links a{
    font-size:14px;font-weight:500;color:rgba(255,255,255,.82);
    text-decoration:none;transition:color .2s;white-space:nowrap;
  }
  .ft2-links a + a{border-left:1px solid rgba(255,255,255,.13);padding-left:22px;}
  .ft2-links a:hover{color:#fff;}
  .ft-social{display:flex;align-items:center;gap:12px;}
  .ft-social a{
    width:40px;height:40px;border-radius:50%;
    display:flex;align-items:center;justify-content:center;
    background:rgba(255,255,255,.1);
    color:#fff;transition:all .2s;
  }
  .ft-social a:hover{background:var(--rojo);color:#fff;transform:translateY(-2px);}
  .ft-social svg{width:19px;height:19px;}
  .ft2-addr{
    font-size:13.5px;line-height:1.6;color:rgba(255,255,255,.62);
    max-width:560px;text-wrap:pretty;
  }
  .ft2-tag{font-size:12.5px;color:rgba(255,255,255,.5);}
  .ft-bottom{
    background:linear-gradient(90deg,#0d0d0d 0%,#1c1c1c 60%,#141414 100%);
  }
  .ft-bottom-inner{
    max-width:1040px;margin:0 auto;
    display:flex;align-items:center;justify-content:center;gap:12px;flex-wrap:wrap;
    padding:16px 24px;font-size:12.5px;color:rgba(255,255,255,.55);
  }
  @media(max-width:760px){
    .ft2-inner{padding:36px 20px 26px;gap:18px;}
    .ft2-links{gap:9px 18px;flex-wrap:wrap;}
  }

  .card{
    background:linear-gradient(180deg,var(--card-grad-top) 0%,#fff 44.5%);
    border-radius:var(--card-radio);
    box-shadow:0 2px 8px rgba(45,45,45,.2);
    display:flex;
    flex-direction:column;
    height:100%;
    position:relative;
    overflow:hidden;
    transition:transform .25s ease, box-shadow .25s ease;
  }
  .card:hover{
    box-shadow:0 2px 8px rgba(45,45,45,.28);
  }

  .head{
    padding:34px 24px 22px;
    text-align:center;
  }
  .card--feat .head{
    padding-top:34px;
  }
  .badge{
    position:absolute;
    top:0;left:50%;
    transform:translateX(-50%);
    background:#FF8300;
    color:#fff;
    font-size:12px;
    font-weight:700;
    line-height:24px;
    width:180px;
    height:22px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:0 0 12px 12px;
    letter-spacing:.2px;
    white-space:nowrap;
    box-shadow:inset 0 -1px 4px #d26c04;
  }
  .plan-nombre{
    font-family:var(--amx);
    font-size:26px;
    font-weight:700;
    letter-spacing:-.2px;
    color:var(--texto-fuerte);
  }
  .plan-linea{
    font-size:18px;
    font-weight:400;
    color:var(--texto);
    margin-top:6px;
  }
  .precio{
    font-family:var(--amx);
    margin-top:14px;
    line-height:1.1;
    color:var(--rojo);
    font-weight:700;
  }
  .precio .monto{
    font-size:36px;
    letter-spacing:-.5px;
  }
  .precio .mes{
    font-family:var(--roboto);
    font-size:18px;
    font-weight:400;
    color:var(--texto);
  }
  
  .card .plan-nombre,
  .card .precio,
  .card .precio .monto{font-family:var(--satoshi);font-weight:900;}
  .card .plan-linea,
  .card .feat-row,
  .card .lbl{font-family:var(--satoshi);}
  .antes{
    margin-top:14px;
    font-size:14px;
    color:var(--texto);
  }
  .antes s{
    color:var(--texto);
    font-weight:500;
    text-decoration-thickness:1px;
  }
  .gratis{
    margin-top:8px;
    font-size:14px;
    font-weight:700;
    font-style:italic;
    line-height:18px;
    color:var(--rojo);
  }

  .incluye{
    background:var(--teal-bg);
    padding:10px 18px 16px;
    text-align:center;
  }
  .incluye-label{
    font-size:13.5px;
    font-weight:500;
    color:#2d2d2d;
    margin-bottom:8px;
  }
  .logos{
    display:flex;
    justify-content:center;
    align-items:center;
    gap:18px;
    min-height:34px;
  }
  .logos img.logo-img{
    height:30px;
    width:auto;
    max-width:110px;
    object-fit:contain;
    display:block;
    filter:brightness(0);
  }
  .logos img[src*="disney"]{height:27px;}
  .logos img[src*="primevideo"]{height:19px;}
  .logos .logo-ph{
    height:30px;
    padding:0 12px;
    display:flex;
    align-items:center;
    justify-content:center;
    border:1px dashed #8fb6b6;
    border-radius:6px;
    font-size:12px;
    font-weight:600;
    color:#3a5b5b;
    background:rgba(255,255,255,.4);
    white-space:nowrap;
  }

  .features{
    padding:18px 24px 6px;
    text-align:center;
  }
  .feat-row{
    font-size:14.5px;
    font-weight:600;
    color:var(--texto);
    line-height:1.5;
    margin:4px 0;
  }
  .feat-row.head-feat{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:7px;
    font-weight:700;
    margin-bottom:6px;
  }
  .feat-row.head-feat svg{flex:none;}

  .toggles{
    padding:16px 24px 18px;
    border-top:1px solid var(--borde);
    border-bottom:1px solid var(--borde);
    margin:14px 0 0;
  }
  .tg-row{
    display:flex;
    align-items:center;
    gap:8px;
    padding:7px 0;
  }
  .tg-row .lbl{
    font-size:14.5px;
    color:var(--texto-2);
    font-weight:400;
    flex:1;
  }
  .tg-row .amt{
    font-size:15px;
    font-weight:700;
    color:var(--texto-2);
    white-space:nowrap;
  }
  .switch{
    position:relative;
    width:35px;height:16px;
    flex:none;
    cursor:pointer;
    display:flex;
    align-items:center;
  }
  .switch input{opacity:0;width:0;height:0;position:absolute;}
  .track{
    position:absolute;
    left:0;top:50%;
    transform:translateY(-50%);
    width:35px;height:12px;
    background:#DBDBDB;
    border-radius:50px;
    box-shadow:inset -2px 1px 1.1px rgba(0,0,0,.25);
    transition:background .3s ease;
  }
  .knob{
    position:absolute;
    top:50%;left:0;
    transform:translateY(-50%);
    width:16px;height:16px;
    background:#F4F4F4;
    border:.5px solid #DBDBDB;
    border-radius:50%;
    box-shadow:0 1px 1px rgba(0,0,0,.24);
    transition:left .3s ease;
  }
  .switch input:checked ~ .track{background:linear-gradient(98deg,#0093a3 0%,#2fbcc4 100%);}
  .switch input:checked ~ .knob{left:19px;}

  .foot{
    padding:22px 24px 24px;
    text-align:center;
    margin-top:auto;
  }
  .cta{
    width:240px;
    max-width:100%;
    margin:0 auto;
    display:block;
    background:#d6281c;
    color:#fff;
    border:1px solid transparent;
    border-radius:100px;
    height:40px;
    padding:0 16px;
    font-family:inherit;
    font-size:16px;
    font-weight:500;
    cursor:pointer;
    box-shadow:inset 0 -4px 10px rgba(45,45,45,.1), inset 0 4px 12px rgba(131,23,15,.1);
    transition:all .3s ease-in-out;
  }
  .cta:hover{
    background:#fff;
    color:var(--rojo);
    border:1px solid var(--rojo);
    box-shadow:none;
  }
  .cta:active{transform:translateY(1px);}
  .conoce{
    display:inline-block;
    margin-top:16px;
    color:var(--rojo);
    font-size:16px;
    font-weight:500;
    text-decoration:none;
  }
  .conoce:hover{text-decoration:underline;}
  .sin-imp{
    margin-top:14px;
    font-size:14px;
    color:var(--texto-2);
  }

  @media(max-width:1000px){
    .grid{grid-template-columns:minmax(0,360px);}
  }
  @media(max-width:720px){
    .banner{flex-direction:column;text-align:center;gap:18px;padding:26px 22px;}
    .tabs{gap:28px;}
  }

/* ===== bloque 2 ===== */
/* ============================================================
     RESPONSIVE MOBILE — breakpoints: 900 / 640 / 480 / 390
  ============================================================ */

  /* --- Header --- */
  @media(max-width:720px){
    .hdr-inner{padding:14px 16px;flex-wrap:wrap;gap:10px;}
    .hdr-logo{height:28px;}
    .hdr-sep{height:24px;}
    .hdr-claro{height:36px;}
    .modepill{margin-left:0;width:100%;}
    .modepill .mode{flex:1;text-align:center;font-size:13px;}
    .pill-thumb{top:5px;}
  }

  /* --- Hero Internet 2 columnas → 1 col en mobile --- */
  @media(max-width:760px){
    .hero{min-height:auto;}
    .hero-inner{padding:36px 20px 32px;}
    .hero-inner--2col{grid-template-columns:1fr;gap:28px;}
    .hero-inner h1{font-size:clamp(34px,8vw,52px);}
    .hero-inner p{font-size:16px;}
    .hero-kicker{font-size:11px;margin-bottom:16px;}
    .hero-cta{height:46px;font-size:15px;padding:0 22px;}
    .hero-promo{max-width:100%;}
    .ticket-body{padding:22px 22px 18px;}
    .tp-amount{font-size:clamp(48px,13vw,72px);}
    .tp-per{font-size:15px;}
    .ticket-tag{font-size:10px;margin-top:8px;}
    .ticket-speed{font-size:12px;padding:6px 14px;margin-bottom:10px;border-radius:10px;}
    .ticket-stub{padding:10px 20px;}
    .ticket-stub b,.stub-detail{font-size:13px;}
    .tp-price-row{gap:4px;}
    .tp-spacer{display:none;}
  }
  @media(max-width:480px){
    .ticket-body{padding:18px 16px 14px;}
    .tp-amount{font-size:clamp(42px,14vw,60px);}
  }

  /* --- Hero portabilidad --- */
  @media(max-width:760px){
    .hero--porta .hero-inner{padding:36px 20px 32px;}
    .hero--porta .hero-inner h1{font-size:clamp(32px,8vw,48px);}
  }

  /* --- Banner carrusel --- */
  @media(max-width:640px){
    .banner-wrap{padding:24px 16px 0;}
    .banner{gap:14px;padding:22px 18px;}
    .banner-txt h2{font-size:20px;}
    .banner-txt p{font-size:14px;}
  }

  /* --- Grid de tarjetas --- */
  @media(max-width:600px){
    .content{padding:0 12px;}
    .grid{grid-template-columns:1fr;max-width:420px;margin-left:auto;margin-right:auto;}
  }

  /* --- Tarjeta plan --- */
  @media(max-width:480px){
    .head{padding:28px 18px 16px;}
    .plan-nombre{font-size:28px;}
    .precio .monto{font-size:30px;}
    .toggles{padding:12px 18px;}
    .foot{padding:14px 18px 18px;}
  }

  /* --- Tabs fibra/inalámbrica --- */
  @media(max-width:520px){
    .tabs{gap:14px;}
    .tab{font-size:14px;padding:0 10px;}
  }

  /* --- Banner de bienvenida / sección --- */
  @media(max-width:600px){
    .banner-wrap{padding:20px 16px 0;}
    .banner-head{padding:32px 16px 4px;}
  }

  /* --- Pasos portabilidad --- */
  @media(max-width:600px){
    .porta-steps{padding:36px 16px 12px;}
    .porta-steps h3{font-size:22px;margin-bottom:24px;}
    .step-card{padding:20px 14px 18px;}
    .step-ico{width:46px;height:46px;border-radius:12px;}
  }

  /* --- Banner QR --- */
  @media(max-width:600px){
    .qr-banner-wrap{padding:28px 16px 0;}
    .qr-banner{padding:28px 20px;border-radius:18px;}
    .qr-banner-txt h2{font-size:22px;}
    .qr-banner-txt p{font-size:14px;}
    .qr-card{padding:10px;}
    .qr-code,.qr-code svg,.qr-code img,.qr-code canvas{width:130px !important;height:130px !important;}
  }

  /* --- Formulario de contacto --- */
  @media(max-width:600px){
    .contact{padding:36px 16px 48px;}
    .contact-card{padding:24px 16px;border-radius:18px;}
    .contact-head h3{font-size:22px;}
    .contact-btn{min-width:0;width:100%;}
  }

  /* --- Modal Conocé más (scroll en mobile) --- */
  @media(max-width:640px){
    .modal-backdrop{align-items:flex-end;padding:0;}
    .modal-box{
      border-radius:22px 22px 0 0;
      max-height:92dvh;
      overflow-y:auto;
      -webkit-overflow-scrolling:touch;
    }
    .modal-logo{display:none;}
  }

  /* --- Portabilidad head --- */
  @media(max-width:600px){
    .porta-head{padding:28px 16px 4px;}
    .porta-head h2{font-size:26px;}
    .porta-head p{font-size:15px;}
  }

  /* --- Footer --- */
  @media(max-width:600px){
    .ftv2-top,.ft-top{padding:28px 16px;}
    .ft-bottom-inner{padding:12px 16px;flex-direction:column;text-align:center;gap:6px;}
  }

  /* --- Flotante WhatsApp: más espacio en mobile --- */
  @media(max-width:480px){
    .wsp-float{right:14px;bottom:16px;}
  }

  /* --- Hero divisor --- */
  @media(max-width:600px){
    .hero-divider{margin:16px 0 12px;}
  }

  /* --- Footer v2 (ftv2) --- */
  @media(max-width:720px){
    .ftv2-top{grid-template-columns:1fr;gap:32px;padding:36px 16px 24px;}
    .ftv2-nav{grid-template-columns:1fr 1fr;gap:16px;}
  }
  @media(max-width:480px){
    .ftv2-nav{grid-template-columns:1fr;gap:8px;}
    .ftv2-bottom{flex-direction:column;text-align:center;gap:6px;padding:12px 16px;}
  }

  /* --- Prevenir scroll horizontal global --- */
  html,body{overflow-x:hidden;max-width:100vw;}

  /* --- Grid de planes: 1fr en mobile (sobreescribe minmax) --- */
  @media(max-width:600px){
    .grid{grid-template-columns:1fr !important;width:100%;}
    .content{padding-left:12px;padding-right:12px;}
  }

  /* --- Tabs inalambrica/fibra en mobile --- */
  @media(max-width:480px){
    .tabs{padding:20px 16px 4px;gap:12px;flex-wrap:wrap;justify-content:center;}
    .tab{font-size:13px;padding-bottom:10px;}
  }

  /* --- inc-opt-wrap (banner incluye) en mobile --- */
  @media(max-width:600px){
    .inc-opt-wrap{padding:0 12px;margin-top:20px;}
    .inc-opt-a{border-radius:16px;}
    .iob-ico{width:36px;height:36px;}
    .iob-txt{font-size:14px;}
  }
  /* Vista mobile habilitada */
  .mobile-block{display:none !important;}

/* ===== bloque 3 ===== */
.mode-switch{display:none !important;}
        .hdr-nav{margin-left:auto;display:flex;align-items:center;gap:26px;}
        .hdr-nav a{font-family:var(--satoshi);font-size:15px;font-weight:600;color:var(--texto-fuerte);text-decoration:none;cursor:pointer;transition:color .2s;}
        .hdr-nav a + a{border-left:1px solid rgba(45,45,45,.14);padding-left:26px;}
        .hdr-nav a:hover{color:var(--rojo);}
        .hdr-nav a.nav-wsp{display:inline-flex;align-items:center;gap:7px;color:#128C4B;font-weight:700;}
        .hdr-nav a.nav-wsp svg{width:17px;height:17px;}
        @media(max-width:640px){
          .hdr-nav{gap:18px;width:100%;justify-content:center;flex-wrap:wrap;margin-left:0;}
          .hdr-nav a{font-size:14px;}
          .hdr-nav a + a{border-left:none;padding-left:0;}
        }

/* ===== bloque 4 ===== */
.claro-bnr-wrap{max-width:1040px;margin:6px auto 2px;width:100%;padding:0 24px;}
    .claro-bnr{border-radius:18px;overflow:hidden;color:#fff;display:flex;align-items:center;gap:26px;padding:24px 30px;
      background:radial-gradient(600px 220px at 100% 0,rgba(255,255,255,.13),transparent 60%),linear-gradient(120deg,#DA291C 0%,#B52217 100%);}
    .claro-bnr .cb-logo{height:52px;width:auto;flex:none;}
    .claro-bnr .cb-div{width:1px;align-self:stretch;background:rgba(255,255,255,.45);margin:4px 0;flex:none;}
    .claro-bnr .cb-txt h3{font-family:var(--satoshi);font-weight:900;letter-spacing:-.4px;line-height:1.05;font-size:24px;}
    .claro-bnr .cb-txt h3 .thin{font-weight:400;}
    .claro-bnr .cb-txt p{font-size:19.5px;color:rgba(255,255,255,.85);margin-top:4px;}
    .claro-bnr .cb-cta{margin-left:auto;display:inline-flex;align-items:center;gap:9px;font-family:var(--satoshi);font-size:14.5px;font-weight:800;cursor:pointer;background:#fff;color:#2A2D33;border-radius:100px;padding:13px 26px;white-space:nowrap;text-decoration:none;border:1.5px solid transparent;transition:all .2s;}
    .claro-bnr .cb-cta svg{width:16px;height:16px;transition:transform .2s;}
    .claro-bnr .cb-cta:hover{transform:translateY(-2px);box-shadow:0 8px 20px rgba(0,0,0,.2);}
    .claro-bnr .cb-cta:hover svg{transform:translateX(3px);}
    @media(max-width:820px){
      .claro-bnr{flex-wrap:wrap;padding:22px 20px;}
      .claro-bnr .cb-div{display:none;}
      .claro-bnr .cb-cta{margin-left:0;width:100%;justify-content:center;}
    }

/* ===== bloque 5 ===== */
.planes-head{padding-top:64px;padding-bottom:28px;}
    .planes-kicker{
      display:inline-block;background:rgba(218,41,28,.1);color:var(--rojo);
      font-size:12px;font-weight:800;letter-spacing:1.2px;text-transform:uppercase;
      padding:7px 16px;border-radius:50px;margin-bottom:16px;
    }
    .planes-head h2{
      font-family:var(--satoshi);font-weight:300;
      font-size:clamp(23px,3.24vw,36px);line-height:1.12;letter-spacing:-.6px;
      color:var(--texto-fuerte);text-wrap:balance;
    }
    .planes-head h2 .hl{font-weight:900;color:var(--texto-fuerte);}
    .porta-sub-1line{max-width:none !important;}
    @media(min-width:680px){.porta-sub-1line{white-space:nowrap;}}

/* ===== bloque 6 ===== */
/* CTA de WhatsApp que reemplaza al QR en mobile */
    .qr-wa-cta{display:none;}
    .qr-sub-mob{display:none;}
    .qr-wa-cta{align-items:center;justify-content:center;gap:8px;background:#25D366;color:#fff;font-family:var(--satoshi);font-weight:800;font-size:12.8px;text-decoration:none;padding:12px 21px;border-radius:100px;}
    .qr-wa-cta svg{width:18px;height:18px;}
    /* Footer: dirección solo visible en mobile (desktop muestra los links) */
    .ft2-addr--mob{display:none;}

/* ===== bloque 7 ===== */
.int-form-sub{max-width:none !important;}
    @media(min-width:680px){.int-form-sub{white-space:nowrap;}}
    .int-form-wrap{max-width:1040px;margin:24px auto 64px;width:100%;padding:0 24px;}
    .int-form-card{background:#fff;border-radius:18px 18px 0 0;border-bottom:5px solid #C4C8CE;box-shadow:0 8px 26px rgba(45,45,45,.10);padding:36px 34px;}
    .int-form-card .chead{margin-bottom:20px;}
    .int-form-card .chead h3{font-family:var(--satoshi);font-size:23px;font-weight:900;color:var(--texto-fuerte);letter-spacing:-.3px;}
    .int-form-card .chead p{font-size:14px;color:var(--texto-2);margin-top:6px;}
    .int-form-card .row2{display:grid;grid-template-columns:1fr 1fr;gap:14px;}
    .int-form-card label{display:block;font-size:12.5px;font-weight:700;color:var(--texto-fuerte);margin-bottom:6px;}
    .int-form-card .field{margin-bottom:14px;}
    .int-form-card .inp{width:100%;font-family:inherit;font-size:14.5px;color:var(--texto-fuerte);padding:12px 14px;border:1.5px solid var(--borde);border-radius:10px;background:#fff;outline:none;transition:border-color .18s,box-shadow .18s;}
    .int-form-card .inp:focus{border-color:var(--rojo);box-shadow:0 0 0 3px rgba(218,41,28,.12);}
    .int-form-card .cbtn{width:100%;border:none;cursor:pointer;font-family:inherit;font-weight:800;font-size:15px;color:#fff;background:var(--rojo);padding:15px;border-radius:11px;margin-top:6px;transition:background .18s;}
    .int-form-card .cbtn:hover{background:var(--rojo-osc);}
    .int-form-card .cbtn svg{width:18px;height:18px;vertical-align:-3px;margin-right:7px;}
    .form-nota{margin-top:12px;font-size:11.5px;line-height:1.5;color:var(--texto-2);text-align:center;}
    @media(max-width:720px){.int-form-card .row2{grid-template-columns:1fr;}}

/* ===== bloque 8 ===== */
.xsell{position:relative;overflow:hidden;color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:66px 24px;min-height:368px;}
    .xsell-in{position:relative;z-index:2;max-width:760px;display:flex;flex-direction:column;align-items:center;transform:translateY(32px);}
    .xsell h2{font-family:var(--satoshi);font-weight:900;letter-spacing:-.7px;line-height:1.05;font-size:clamp(28px,3.8vw,44px);text-wrap:balance;}
    .xsell h2 .thin{font-weight:400;}
    .xsell p{margin:16px auto 0;font-size:clamp(16px,1.6vw,19px);color:rgba(255,255,255,.85);max-width:560px;text-wrap:pretty;}
    .xsell-cta{display:inline-flex;align-items:center;gap:9px;margin-top:28px;font-family:var(--satoshi);font-size:15.5px;font-weight:800;text-decoration:none;cursor:pointer;background:#fff;color:#2A2D33;padding:15px 30px;border-radius:100px;border:1.5px solid transparent;transition:transform .2s,background .2s,color .2s,border-color .2s;box-shadow:0 8px 22px rgba(0,0,0,.22);}
    .xsell-cta svg{width:17px;height:17px;transition:transform .2s;}
    .xsell-cta:hover{transform:translateY(-2px);background:#eceef2;}
    .xsell-cta:hover svg{transform:translateX(3px);}
    .xsell--int{background:linear-gradient(180deg, rgba(22,24,28,.4) 0%, rgba(22,24,28,.45) 40%, rgba(22,24,28,.58) 66%, rgba(22,24,28,.8) 85%, rgba(22,24,28,.95) 96%, #16181c 100%), var(--img-foot-int,url("uploads/internet-cta-oficina.jpg")) var(--pos-foot-int,center 28%) / cover no-repeat;}
    .xsell--porta{background:linear-gradient(180deg, rgba(22,24,28,.4) 0%, rgba(22,24,28,.45) 40%, rgba(22,24,28,.58) 66%, rgba(22,24,28,.8) 85%, rgba(22,24,28,.95) 96%, #16181c 100%), var(--img-foot-porta,url("uploads/internet-banner-hombre.jpg")) var(--pos-foot-porta,center 26%) / cover no-repeat;}
    @media(max-width:600px){.xsell{padding:48px 20px;min-height:300px;}}

/* ===== bloque 9 ===== */
.hero-slider{position:relative;width:100%;}
      .hero-slides{position:relative;}
      .hero-slide{display:none;}
      .hero-slide.active{display:block;animation:heroFade .5s ease;}
      @keyframes heroFade{from{opacity:0;}to{opacity:1;}}
      .hero-slide .hero,.hero-slide .heroalt{border-radius:0 0 36px 36px;}
      /* dots */
      .hero-dots{position:absolute;left:0;right:0;bottom:22px;display:flex;justify-content:center;gap:10px;z-index:6;}
      .hero-dots button{width:10px;height:10px;border-radius:50%;border:none;cursor:pointer;background:rgba(255,255,255,.45);padding:0;transition:background .2s,width .2s;}
      .hero-dots button.on{background:#fff;width:26px;border-radius:6px;}
      /* arrows */
      .hero-arrow{position:absolute;top:50%;transform:translateY(-50%);z-index:6;width:46px;height:46px;border-radius:50%;border:none;cursor:pointer;background:rgba(0,0,0,.32);color:#fff;display:flex;align-items:center;justify-content:center;transition:background .2s;backdrop-filter:blur(4px);}
      .hero-arrow:hover{background:rgba(0,0,0,.5);}
      .hero-arrow svg{width:22px;height:22px;}
      .hero-arrow.prev{left:18px;}
      .hero-arrow.next{right:18px;}
      .heroalt-bleed{width:100%;position:static;left:auto;right:auto;margin:0;}
      .heroalt{position:relative;border-radius:0 0 36px 36px;background:linear-gradient(90deg,rgba(22,23,26,.86) 0%,rgba(22,23,26,.55) 42%,rgba(181,34,23,.15) 70%,rgba(181,34,23,0) 100%),var(--img-hp1,url('uploads/porta-banner-mujer-derecha.jpg'));background-size:cover;background-position:var(--pos-hp1,center);overflow:hidden;}
      .heroalt-in{max-width:1040px;margin:0 auto;padding:78px 24px;min-height:calc((100vh - 73px) * 0.7);min-height:calc((100dvh - 73px) * 0.7);display:flex;flex-direction:column;justify-content:center;}
      .heroalt .kick{display:inline-block;align-self:flex-start;background:#fff;color:var(--texto-fuerte);font-size:12px;font-weight:800;letter-spacing:1px;text-transform:uppercase;padding:6px 14px;border-radius:50px;}
      .heroalt h1,.heroalt .h1v{font-family:var(--satoshi);font-size:clamp(36px,5.58vw,64.8px);font-weight:300;line-height:1.04;letter-spacing:-1px;color:#fff;margin:18px 0 0;text-shadow:0 2px 18px rgba(0,0,0,.35);}
      .heroalt h1 .h1-bold,.heroalt .h1v .h1-bold{font-weight:900;}
      .heroalt p{font-size:19.5px;color:rgba(255,255,255,.9);font-weight:500;line-height:1.45;max-width:430px;margin-top:18px;padding-top:18px;border-top:1px solid rgba(255,255,255,.85);text-shadow:0 1px 10px rgba(0,0,0,.4);}
      .heroalt .hero-cta{margin-top:28px;align-self:flex-start;}
      @media(max-width:680px){
        .heroalt{background:linear-gradient(0deg,rgba(22,23,26,.6),rgba(22,23,26,.82)),var(--img-hp1-m,url('uploads/porta-banner-mujer-derecha.jpg'));background-position:var(--pos-hp1-m,center);}
        .heroalt-in{padding:48px 22px;}
        .heroalt p{max-width:none;font-size:17px;}
        .hero-arrow{width:38px;height:38px;}
        .hero-arrow.prev{left:8px;}.hero-arrow.next{right:8px;}
      }
      .heroalt.heroalt--1{background:linear-gradient(90deg,rgba(22,23,26,.86) 0%,rgba(22,23,26,.55) 42%,rgba(181,34,23,.15) 70%,rgba(181,34,23,0) 100%),var(--img-hp2,url('uploads/porta-hero.jpg'));background-size:cover;background-position:var(--pos-hp2,center);}
      @media(max-width:680px){
        .heroalt.heroalt--1{background:linear-gradient(0deg,rgba(22,23,26,.6),rgba(22,23,26,.82)),var(--img-hp2-m,url('uploads/porta-hero.jpg'));background-position:var(--pos-hp2-m,center);}
      }

/* ===== bloque 10 ===== */
.cmp-tag{max-width:1040px;margin:50px auto 14px;padding:0 24px;display:flex;align-items:center;gap:10px;}
      .cmp-tag .n{display:inline-flex;align-items:center;justify-content:center;width:26px;height:26px;border-radius:8px;background:var(--rojo);color:#fff;font-size:13px;font-weight:800;}
      .cmp-tag .t{font-size:15px;font-weight:800;color:var(--texto-fuerte);}
      .cmp-tag .d{font-size:13px;color:var(--texto-2);}
      .cmp-wrap{max-width:1040px;margin:0 auto 14px;padding:0 24px;}
      .cmp-stage{border-radius:18px;overflow:hidden;box-shadow:0 10px 30px rgba(45,45,45,.13);background:#fff;}
      .cmp label{display:block;font-size:12.5px;font-weight:700;color:var(--texto-fuerte);margin-bottom:6px;}
      .cmp .inp,.cmp select.inp{width:100%;font-family:inherit;font-size:14.5px;color:var(--texto-fuerte);padding:12px 14px;border:1.5px solid var(--borde);border-radius:10px;background:#fff;outline:none;transition:border-color .18s,box-shadow .18s;}
      .cmp .inp:focus{border-color:var(--rojo);box-shadow:0 0 0 3px rgba(218,41,28,.12);}
      .cmp .field{margin-bottom:14px;}
      .cmp .row2{display:grid;grid-template-columns:1fr 1fr;gap:14px;}
      .cmp .cbtn{width:100%;border:none;cursor:pointer;font-family:inherit;font-weight:800;font-size:15px;color:#fff;background:linear-gradient(135deg,#ff5b4d,#DA291C 55%,#a81910);padding:15px;border-radius:11px;box-shadow:0 6px 16px rgba(218,41,28,.3);transition:transform .15s;}
      .cmp .cbtn:hover{transform:translateY(-2px);}
      .cmp .chead h3{font-size:22px;font-weight:900;color:var(--texto-fuerte);letter-spacing:-.3px;}
      .cmp .chead p{font-size:14px;color:var(--texto-2);margin-top:6px;line-height:1.5;}
      /* V9 */
      .cmp9{display:grid;grid-template-columns:1fr .7fr;}
      .cmp9 .form-side{padding:38px 34px;}
      .cmp9 .wa-side{background:linear-gradient(160deg,#25D366,#128C7E);color:#fff;padding:38px 30px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:16px;}
      .cmp9 .wico{width:60px;height:60px;border-radius:50%;background:rgba(255,255,255,.2);display:flex;align-items:center;justify-content:center;}
      .cmp9 .wico svg{width:34px;height:34px;color:#fff;}
      .cmp9 .wa-side h4{font-size:19px;font-weight:900;}
      .cmp9 .wa-side p{font-size:14px;color:rgba(255,255,255,.9);line-height:1.5;}
      .cmp9 .wa-btn{background:#fff;color:#128C7E;font-weight:800;font-size:14px;padding:13px 24px;border-radius:50px;text-decoration:none;margin-top:4px;}
      /* V10 */
      .cmp10{position:relative;padding:0;background:linear-gradient(120deg,rgba(22,23,26,.55),rgba(181,34,23,.35)),url('uploads/porta-banner-mujer.jpg');background-size:cover;background-position:center;}
      .cmp10 .inner{display:grid;grid-template-columns:.85fr 1.15fr;gap:40px;align-items:center;max-width:1040px;margin:0 auto;padding:48px 24px;}
      .cmp10 .pitch{color:#fff;text-shadow:0 1px 14px rgba(0,0,0,.4);}
      .cmp10 .pitch .kick{font-size:12px;font-weight:800;letter-spacing:1px;text-transform:uppercase;color:#ffd2cd;}
      .cmp10 .pitch h3{font-size:34px;font-weight:900;line-height:1.05;margin:10px 0 14px;letter-spacing:-.5px;color:#fff;}
      .cmp10 .pitch p{font-size:15px;color:rgba(255,255,255,.85);line-height:1.5;max-width:380px;}
      .cmp10 .card{background:#fff;border-radius:16px;padding:30px;box-shadow:0 20px 50px rgba(0,0,0,.3);}
      .cmp10-bleed{width:100vw;position:relative;left:50%;right:50%;margin-left:-50vw;margin-right:-50vw;margin-bottom:0;}
      @media(max-width:780px){.cmp9,.cmp10 .inner{grid-template-columns:1fr;}.cmp .row2{grid-template-columns:1fr;}}

/* ===== bloque 11 ===== */
/* ================================================================
   MOBILE REFINADO — nav hamburguesa, tap targets ≥44px, ritmo
   (bloque final: gana en cascada por orden de origen)
   ================================================================ */
@media(min-width:701px){ .hdr-burger{display:none !important;} }
@media(max-width:700px){
  .site-header{position:sticky;top:0;z-index:900;background:#fff;box-shadow:0 1px 0 rgba(0,0,0,.06),0 8px 22px rgba(0,0,0,.05);}
  .hdr-inner{flex-wrap:nowrap !important;padding:11px 16px !important;gap:12px;align-items:center;}
  .hdr-home{gap:11px !important;}
  .hdr-logo{height:25px !important;}
  .hdr-sep{height:22px !important;}
  .hdr-claro{height:33px !important;}

  /* Hamburguesa */
  .hdr-burger{display:inline-flex;flex-direction:column;justify-content:center;gap:5px;margin-left:auto;width:44px;height:44px;border:none;background:transparent;cursor:pointer;padding:11px;border-radius:10px;-webkit-tap-highlight-color:transparent;flex:none;}
  .hdr-burger span{display:block;height:2.5px;width:100%;background:var(--texto-fuerte);border-radius:2px;transition:transform .28s ease,opacity .18s ease;}
  .hdr-burger.open span:nth-child(1){transform:translateY(7.5px) rotate(45deg);}
  .hdr-burger.open span:nth-child(2){opacity:0;}
  .hdr-burger.open span:nth-child(3){transform:translateY(-7.5px) rotate(-45deg);}

  /* Nav como panel desplegable */
  .hdr-nav{display:none;position:absolute;left:0;right:0;top:100%;width:100% !important;margin:0 !important;flex-direction:column !important;gap:0 !important;background:#fff;box-shadow:0 18px 32px rgba(0,0,0,.13);border-top:1px solid #eef0f2;padding:6px 0 14px !important;flex-wrap:nowrap !important;justify-content:flex-start !important;max-height:82vh;overflow-y:auto;-webkit-overflow-scrolling:touch;animation:navDrop .26s ease;}
  .hdr-nav.open{display:flex !important;}
  @keyframes navDrop{from{opacity:0;transform:translateY(-8px);}to{opacity:1;transform:none;}}
  .hdr-nav a{display:flex !important;align-items:center;min-height:56px;padding:0 22px !important;font-size:16px !important;font-weight:600;color:var(--texto-fuerte);border-bottom:1px solid #f2f3f5;justify-content:flex-start;}
  .hdr-nav a.nav-wsp{min-height:56px;padding:0 22px !important;justify-content:flex-start;background:none !important;color:#128C4B !important;border-radius:0;font-weight:700;gap:9px;border-bottom:1px solid #f2f3f5;box-shadow:none;margin:0;}
  .hdr-nav a.nav-wsp svg{width:19px;height:19px;}

  /* Tap targets del contenido */
  .hero-cta{min-height:48px !important;}
  .tab{min-height:46px;display:inline-flex;align-items:center;font-size:15px !important;}
  .conoce{min-height:44px;display:inline-flex !important;align-items:center;}
  .cta{min-height:48px;}
  .mode-cta{min-height:48px;}
  .origin-btn{min-height:44px;}

  /* Legibilidad */
  .ticket-tag{font-size:11px !important;}

  /* Sin desbordes horizontales por 100vw */
  .cmp10-bleed{width:100% !important;left:0 !important;right:0 !important;margin-left:0 !important;margin-right:0 !important;}

  /* 1 · Más gap lateral: tarjetas de planes menos anchas (Internet y Portabilidad) */
  .content{padding-left:clamp(20px,7%,44px) !important;padding-right:clamp(20px,7%,44px) !important;}

  /* 5 · QR: centrado y recortado dentro del cuadro blanco */
  .qr-card{margin-left:auto !important;margin-right:auto !important;padding:12px !important;overflow:hidden;display:flex;align-items:center;justify-content:center;}
  .qr-code{width:132px !important;height:132px !important;margin:0 !important;overflow:hidden;display:flex;align-items:center;justify-content:center;}
  .qr-code svg,.qr-code canvas,.qr-code img{width:132px !important;height:132px !important;margin:0 !important;display:block !important;}

  /* 3 · Banner Claro: comprimir vertical + jerarquía (título > subtítulo) + logo apenas más chico */
  .claro-bnr{padding:20px 18px !important;gap:12px !important;flex-direction:column !important;align-items:center !important;text-align:center !important;}
  .claro-bnr .cb-div{display:none !important;}
  .claro-bnr .cb-txt{align-items:center;}
  .claro-bnr .cb-logo{height:46px !important;}
  .claro-bnr .cb-txt h3{white-space:nowrap;font-size:clamp(14px,4.6vw,20px) !important;line-height:1.1 !important;}
  .claro-bnr .cb-txt p{font-size:13px !important;margin-top:3px !important;line-height:1.25 !important;}
  .claro-bnr .cb-cta{margin:4px auto 0 !important;width:auto !important;}

  /* 2 · Título de planes +15% */
  .planes-head h2{font-size:clamp(26px,3.7vw,40px) !important;}

  /* 4 · Separar la primera fila de planes del selector Fibra/Inalámbrica */
  #grid,#portaGrid,#inaView{margin-top:20px;}
  /* Igualar ancho de la tarjeta inalámbrica al resto (fibra/portabilidad) */
  #inaView{padding-left:0 !important;padding-right:0 !important;width:100% !important;flex:1 1 100% !important;align-self:stretch !important;}
  .ina-card{width:100% !important;max-width:none !important;margin-left:auto !important;margin-right:auto !important;}

  /* 1 · "Ver planes" debajo del cuadro de oferta en el hero */
  .hero-inner--2col{display:flex !important;flex-direction:column !important;}
  .hero-inner--2col .hero-left{display:contents !important;}
  .hero-inner--2col .hero-left h1{order:1;margin-top:82px;}
  .de-mob{display:inline !important;}
  .hero--internet .hero-inner p{margin-top:3px !important;padding-top:10px !important;}
  .hero-inner--2col .hero-left p{order:2;}
  .hero-inner--2col .hero-promo{order:3;}
  .hero-inner--2col .hero-left .hero-cta{order:4;align-self:stretch;justify-content:center;margin-top:22px;}

  /* 6 · Logos del footer -20% */
  .ft-logos img{height:27px !important;}
  .ft-logos .ft-claro{height:37px !important;}

  /* Portabilidad · banner de fibra: texto más corto en una sola línea, un poco más grande */
  #portaMode .claro-bnr .cb-txt h3{white-space:nowrap !important;font-size:clamp(16px,5.2vw,22px) !important;}

  /* Portabilidad · selector de empresa: mismo ancho que la tarjeta de planes */
  .origin-wrap{padding-left:clamp(20px,7%,44px) !important;padding-right:clamp(20px,7%,44px) !important;}
  .origin-pill{display:flex !important;flex-wrap:nowrap !important;width:100% !important;max-width:100%;}
  .origin-btn{flex:1 1 0 !important;font-size:11.5px !important;padding:0 6px !important;white-space:nowrap;justify-content:center;text-align:center;}

  /* Footer · dirección (mobile) +10% respecto al -35% previo */
  .ft2-addr{font-size:9.66px !important;line-height:1.5 !important;}

  /* Footer mobile: reemplazar los links por la dirección */
  .ft2-links{display:none !important;}
  .ft2-addr--desk{display:none !important;}
  .ft2-addr--mob{display:block !important;}

  /* Hero portabilidad: "Tu número de siempre," en una sola línea */
  .heroalt h1,.heroalt .h1v{font-size:33px !important;}

  /* Hero portabilidad: encuadre a la derecha para que se vean las personas (sobreescribe desktop) */
  #portaMode .heroalt{background-position:78% center !important;}
  #portaMode .heroalt.heroalt--1{background-position:72% center !important;}

  /* Hero internet (mobile): imagen propia, retrato, encuadrada en la persona */
  .hero--internet::before{background-image:var(--img-hero-int-m,url("uploads/v2/hero-mob.webp")) !important;background-position:var(--pos-hero-int-m,50% 34%) !important;background-size:cover !important;}
  .hero--porta::before{background-image:var(--img-hero-porta-m,url("uploads/porta-hero.jpg")) !important;background-position:var(--pos-hero-porta-m,50% 30%) !important;background-size:cover !important;}

  /* Hero internet (mobile): reemplazar el ticket oscuro por la barra blanca de oferta */
  .hero--internet .hero-promo{display:none !important;}
  .hero--internet .hero-offer-mob{display:flex !important;order:3;align-items:center;background:#fff;border-radius:12px;padding:12px 8px;box-shadow:0 14px 30px rgba(0,0,0,.28);margin-top:16px;}
  .hero--internet .hero-offer-mob .hom-seg{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:0 8px;}
  .hero--internet .hero-offer-mob .hom-sep{width:1px;align-self:stretch;background:#e4e4e4;margin:2px 0;flex:none;}
  .hero--internet .hero-offer-mob .hom-speed{display:flex;flex-direction:column;align-items:center;line-height:.95;}
  .hero--internet .hero-offer-mob .hom-speed b{font-size:30px;font-weight:900;color:var(--rojo);letter-spacing:-1px;}
  .hero--internet .hero-offer-mob .hom-speed span{font-size:14px;font-weight:500;color:var(--rojo);letter-spacing:.5px;}
  .hero--internet .hero-offer-mob .hom-price{font-size:28px;font-weight:900;letter-spacing:-.8px;color:#16181c;line-height:1;}
  .hero--internet .hero-offer-mob .hom-note{display:block;margin-top:3px;font-size:9px;font-weight:600;color:#9a9a9a;white-space:nowrap;}
  .hero--internet .hero-offer-mob .hom-free b{display:block;font-size:13px;font-weight:900;color:#16181c;line-height:1;}
  .hero--internet .hero-offer-mob .hom-free span{display:block;margin-top:2px;font-size:9.5px;font-weight:600;color:#8a8a8a;white-space:nowrap;}
  .hero--internet .hero-inner--2col .hero-left .hero-cta{border-radius:100px !important;box-shadow:none !important;}

  /* "Contratá internet hoy mismo": 2 líneas + contraste de trazo (thin + "hoy mismo" en negrita) */
  .br-mob{display:inline !important;}
  .cih2{font-weight:300 !important;}
  .cih2 .hl{font-weight:900 !important;color:var(--texto-fuerte) !important;}

  /* "Todos los planes incluyen": máx 2 líneas de texto + fondo de ícono más grande */
  .iob-col{padding:0 4px !important;}
  .iob-txt{font-size:10.5px !important;line-height:1.2 !important;}
  .iob-ico{width:50px !important;height:50px !important;border-radius:15px !important;}
  .iob-ico svg{width:24px !important;height:24px !important;}

  /* Banner cross-sell (sobre el footer): texto -10% (Internet y Portabilidad) */
  .xsell h2{font-size:clamp(25px,3.4vw,40px) !important;}
  .xsell p{font-size:clamp(14.4px,1.5vw,17px) !important;}

  /* Copyright footer -20% (ambos footers) */
  .ft-bottom-inner{font-size:10px !important;}

  /* CTA del banner cross-sell -10% */
  .xsell-cta{font-size:13.95px !important;}

  /* Banner WhatsApp: sin QR en mobile → CTA directo. Orden: logos, texto, CTA */
  .qr-banner{flex-direction:column !important;text-align:center !important;gap:20px !important;}
  .qr-banner-txt{display:flex !important;flex-direction:column;align-items:center;}
  .qr-banner-logos{order:-2 !important;margin-bottom:4px;}
  .qr-banner-txt h2{order:-1 !important;}
  .qr-banner-txt p{order:0 !important;}
  .qr-divider{display:none !important;}
  .qr-sub-desk{display:none !important;}
  .qr-sub-mob{display:inline !important;}
  .br-desk{display:none !important;}
  .qr-card{background:transparent !important;box-shadow:none !important;padding:0 !important;width:100%;}
  .qr-code{display:none !important;}
  .qr-wa-cta{display:inline-flex !important;}
  /* Divisor sutil arriba del título + gap para separar los logos */
  .qr-banner-logos{margin-bottom:20px !important;}
  .qr-banner-txt h2{position:relative;padding-top:22px;margin-top:2px;}
  .qr-banner-txt h2::before{content:"";position:absolute;top:0;left:50%;transform:translateX(-50%);width:210px;max-width:72%;height:1px;background:rgba(255,255,255,.18);}
}

/* ==================================================================
   LANDINGS DE CAMPAÑA — secciones de contenido
   Mismo sistema visual (Satoshi, rojo Claro, tarjetas blancas).
   ================================================================== */
.sec{padding:66px 0;}
.sec--gris{background:#F6F7F9;}
.sec-in{max-width:1040px;margin:0 auto;padding:0 24px;}
.sec-head{margin-bottom:30px;}
.eyebrow{display:inline-flex;align-items:center;gap:9px;font-size:12px;font-weight:800;letter-spacing:1.2px;text-transform:uppercase;color:var(--rojo);margin-bottom:14px;}
.eyebrow::before{content:none;}
.sec h2{font-family:var(--satoshi);font-weight:300;font-size:clamp(23px,3.24vw,36px);line-height:1.12;letter-spacing:-.6px;color:var(--texto-fuerte);text-wrap:balance;}
.sec h2 b,.sec h2 .hl{font-weight:900;color:var(--texto-fuerte);}
.sec .sub{font-size:clamp(15px,1.6vw,17.5px);color:var(--texto-2);font-weight:500;margin-top:14px;max-width:62ch;line-height:1.55;}
.sec .sub b{color:var(--texto-fuerte);font-weight:800;}
.duo{display:grid;grid-template-columns:1.05fr .95fr;gap:38px;align-items:center;}
.duo--rev .duo-txt{order:2;}
.lista{list-style:none;display:grid;gap:15px;margin-top:22px;}
.lista li{display:flex;gap:13px;font-size:15.5px;line-height:1.5;color:var(--texto);}
.lista svg{width:22px;height:22px;flex:none;stroke:var(--rojo);fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;margin-top:1px;}
.lista b{color:var(--texto-fuerte);font-weight:800;}
.tarjeta{background:#fff;border:1px solid var(--borde);border-radius:18px;padding:28px;box-shadow:0 8px 26px rgba(45,45,45,.08);}
.sec--gris .tarjeta{box-shadow:none;}
.tarjeta-top{text-align:center;padding-bottom:20px;border-bottom:1px solid rgba(45,45,45,.08);}
.tarjeta-tag{display:inline-block;background:var(--accent);color:#fff;font-size:11.5px;font-weight:800;letter-spacing:.9px;text-transform:uppercase;padding:6px 14px;border-radius:50px;}
.tarjeta-nombre{font-family:var(--satoshi);font-size:30px;font-weight:900;color:var(--texto-fuerte);margin-top:14px;letter-spacing:-.5px;}
.tarjeta-linea{font-size:14px;color:var(--texto-2);font-weight:600;margin-top:2px;}
.tarjeta-precio{margin-top:12px;font-family:var(--satoshi);}
.tarjeta-precio .monto{font-size:38px;font-weight:900;color:var(--rojo);letter-spacing:-1px;}
.tarjeta-precio .mes{font-size:15px;color:var(--texto-2);font-weight:700;}
/* segmento con/sin línea Claro */
.seg-wrap{display:flex;flex-direction:column;align-items:center;gap:10px;margin-bottom:26px;}
.seg{display:inline-flex;background:#EFF1F4;border-radius:100px;padding:5px;gap:4px;}
.seg button{border:none;cursor:pointer;font-family:var(--satoshi);font-size:14px;font-weight:700;color:var(--texto-2);background:transparent;padding:11px 22px;border-radius:100px;min-height:44px;transition:all .2s;}
.seg button[aria-pressed="true"]{background:#fff;color:var(--texto-fuerte);box-shadow:0 2px 10px rgba(45,45,45,.12);}
.seg-nota{font-size:13.5px;color:var(--texto-2);font-weight:500;text-align:center;}
/* claro pay */
.cpay{display:flex;align-items:center;gap:20px;background:#fff;border:1px solid var(--borde);border-radius:18px;padding:22px 26px;margin-top:32px;box-shadow:0 8px 26px rgba(45,45,45,.07);}
.cpay-pct{font-family:var(--satoshi);font-size:40px;font-weight:900;color:var(--rojo);letter-spacing:-1.5px;flex:none;}
.cpay h3{font-size:17px;font-weight:900;color:var(--texto-fuerte);}
.cpay p{font-size:14.5px;color:var(--texto-2);font-weight:500;margin-top:3px;line-height:1.5;}
/* zonas */
.zonas{display:flex;flex-wrap:wrap;gap:8px;margin-top:22px;}
.zona{background:#fff;border:1px solid var(--borde);border-radius:50px;padding:7px 15px;font-size:13px;font-weight:600;color:var(--texto-2);}
.sec--gris .zona{background:#fff;}
/* especificaciones del módem */
.especs{list-style:none;display:grid;margin-top:18px;}
.especs li{display:flex;justify-content:space-between;gap:14px;font-size:14.5px;padding:11px 0;border-bottom:1px dashed var(--borde);}
.especs li:last-child{border-bottom:0;}
.especs span{color:var(--texto-2);font-weight:500;}
.especs b{color:var(--texto-fuerte);font-weight:800;text-align:right;}
.aviso-cli{margin-top:26px;background:#FFF6EE;border:1px solid #FFD9B8;border-radius:18px;padding:20px 22px;}
.aviso-cli h3{font-size:16.5px;font-weight:900;color:var(--texto-fuerte);margin-bottom:6px;}
.aviso-cli p{font-size:14.5px;color:var(--texto-2);font-weight:500;line-height:1.55;}
.aviso-cli b{color:var(--texto-fuerte);}
/* datos de la oficina */
.local-dato{display:flex;gap:12px;padding:15px 0;border-bottom:1px solid rgba(45,45,45,.08);}
.local-dato:last-child{border-bottom:0;padding-bottom:0;}
.local-dato svg{width:20px;height:20px;flex:none;stroke:var(--rojo);fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;margin-top:2px;}
.local-dato b{display:block;font-size:14.5px;font-weight:900;color:var(--texto-fuerte);margin-bottom:3px;}
.local-dato p{font-size:14px;color:var(--texto-2);font-weight:500;line-height:1.5;}
/* ficha de reseñas */
.ficha{display:grid;grid-template-columns:300px 1fr;gap:22px;align-items:start;}
.ficha-score{background:#fff;border:1px solid var(--borde);border-radius:18px;padding:28px 24px;text-align:center;box-shadow:0 8px 26px rgba(45,45,45,.08);}
.sec--gris .ficha-score{box-shadow:none;}
.ficha-val{font-size:54px;font-weight:900;color:var(--texto-fuerte);line-height:1;letter-spacing:-.03em;}
.estrellas{display:flex;justify-content:center;gap:3px;margin:12px 0 9px;}
.estrellas svg{width:21px;height:21px;fill:#F5A623;}
.ficha-cant{font-size:13.5px;color:var(--texto-2);font-weight:600;line-height:1.5;}
.ficha-marca{font-size:16px;font-weight:900;color:var(--texto-fuerte);margin-bottom:5px;}
.ficha-btn{display:inline-flex;align-items:center;justify-content:center;width:100%;margin-top:18px;min-height:46px;border:1.6px solid var(--borde);border-radius:100px;font-family:var(--satoshi);font-size:14px;font-weight:800;color:var(--texto-fuerte);background:#fff;transition:all .2s;}
.ficha-btn:hover{border-color:var(--rojo);color:var(--rojo);}
.ficha-items{display:grid;grid-template-columns:1fr 1fr;gap:14px;}
.ficha-it{display:flex;gap:13px;background:#fff;border:1px solid var(--borde);border-radius:18px;padding:19px;}
.ficha-it svg{width:22px;height:22px;flex:none;stroke:var(--rojo);fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;margin-top:1px;}
.ficha-it b{display:block;font-size:15px;font-weight:900;color:var(--texto-fuerte);margin-bottom:4px;}
.ficha-it p{font-size:14px;color:var(--texto-2);font-weight:500;line-height:1.5;}
/* FAQ */
.faq{display:grid;gap:12px;max-width:880px;}
.faq details{background:#fff;border:1px solid var(--borde);border-radius:14px;overflow:hidden;}
.sec--gris .faq details{background:#fff;}
.faq summary{cursor:pointer;list-style:none;padding:18px 54px 18px 22px;font-size:16.5px;font-weight:800;color:var(--texto-fuerte);position:relative;min-height:56px;display:flex;align-items:center;}
.faq summary::-webkit-details-marker{display:none;}
.faq summary::after{content:"";position:absolute;right:24px;top:50%;width:10px;height:10px;border-right:2.4px solid var(--rojo);border-bottom:2.4px solid var(--rojo);transform:translateY(-70%) rotate(45deg);transition:transform .22s;}
.faq details[open] summary::after{transform:translateY(-30%) rotate(225deg);}
.faq .resp{padding:0 22px 20px;font-size:15.5px;line-height:1.62;color:var(--texto-2);}
.faq .resp p+p{margin-top:10px;}
.faq .resp b{color:var(--texto-fuerte);font-weight:700;}
/* panel de contratación por WhatsApp */
.wa-panel{background:linear-gradient(160deg,#25D366,#128C7E);color:#fff;border-radius:18px;padding:32px 30px;}
.wa-panel h3{font-family:var(--satoshi);font-size:22px;font-weight:900;color:#fff;}
.wa-panel p{font-size:15px;color:rgba(255,255,255,.9);font-weight:500;margin-top:8px;line-height:1.55;}
.pasos{list-style:none;display:grid;gap:12px;margin:22px 0 24px;}
.pasos li{display:flex;align-items:center;gap:12px;font-size:15px;font-weight:500;}
.paso-n{width:28px;height:28px;flex:none;border-radius:50%;background:rgba(255,255,255,.22);display:flex;align-items:center;justify-content:center;font-size:13.5px;font-weight:900;}
.wa-btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;width:100%;min-height:52px;background:#fff;color:#0B8A46;border-radius:100px;font-family:var(--satoshi);font-size:15.5px;font-weight:800;transition:transform .2s;}
.wa-btn:hover{transform:translateY(-2px);color:#0B8A46;}
.wa-btn svg{width:20px;height:20px;fill:currentColor;}
.wa-legal{font-size:12.5px;color:rgba(255,255,255,.8);margin-top:14px;text-align:center;font-weight:500;}
.cob-form{display:flex;gap:10px;margin-top:18px;}
.cob-form .inp{flex:1;}
.cob-form button{border:none;cursor:pointer;background:#25D366;color:#fff;font-family:var(--satoshi);font-size:14.5px;font-weight:800;padding:0 22px;border-radius:11px;min-height:48px;white-space:nowrap;}
.err{display:block;font-size:12.5px;color:var(--rojo);margin-top:7px;min-height:16px;font-weight:600;}
@media(max-width:860px){
  .sec{padding:46px 0;}
  .duo{grid-template-columns:1fr;gap:26px;}
  .duo--rev .duo-txt{order:0;}
  .ficha{grid-template-columns:1fr;}
  .ficha-items{grid-template-columns:1fr;}
  .cpay{flex-direction:column;text-align:center;gap:12px;}
  .cob-form{flex-direction:column;}
  .cob-form button{width:100%;}
}

/* nav propio de las landings (no usa el panel desplegable de planes.html) */
.lp-nav{margin-left:auto;display:flex;align-items:center;gap:22px;flex-wrap:wrap;justify-content:flex-end;}
.lp-nav a{font-family:var(--satoshi);font-size:14.5px;font-weight:600;color:var(--texto-fuerte);text-decoration:none;transition:color .2s;}
.lp-nav a:hover{color:var(--rojo);}
.lp-nav a.lp-wa{display:inline-flex;align-items:center;gap:7px;background:#25D366;color:#fff;font-weight:800;padding:10px 18px;border-radius:100px;min-height:44px;}
.lp-nav a.lp-wa:hover{color:#fff;background:#1FBE5B;}
.lp-nav a.lp-wa svg{width:17px;height:17px;fill:currentColor;}
@media(max-width:820px){
  .lp-nav{gap:14px;width:100%;justify-content:center;margin-left:0;}
  .lp-nav a{font-size:13.5px;}
  .lp-nav .lp-solo-desk{display:none;}
}

/* --- ajustes de revisión --- */

/* CTA como enlace: el texto va centrado igual que en los botones */
a.cta{display:inline-flex;align-items:center;justify-content:center;text-align:center;}
/* Ficha técnica del módem: menos peso visual */
.especs li{font-size:13.8px;padding:10px 0;}
.especs b{font-weight:700;}
/* Beneficios de la tarjeta: todos con el mismo peso */
.grid .card .features .feat-row{font-weight:500;}

/* Rótulos de sección sin el trazo decorativo adelante */
.eyebrow::before{display:none;content:none;}
.eyebrow{gap:0;}

/* Quiebres de línea parejos: reparte las palabras entre renglones */
.sec .sub,.sec-head .sub,.seg-nota,.tarjeta-linea,.aviso-cli p,.ficha-it p,.local-dato p,.ficha-cant,.wa-panel p,.cpay p,.faq summary{text-wrap:balance;}
.sec h2,.faq .resp p{text-wrap:pretty;}

/* Claro Pay dentro de la tarjeta: pastilla con contorno fino */
.feat-row--pill{margin-top:12px;}
.feat-pill{display:inline-block;border:1px solid rgba(218,41,28,.5);color:var(--rojo);background:#fff;border-radius:100px;padding:7px 15px;font-size:13px;font-weight:700;line-height:1.3;}

/* FAQ en dos columnas y con texto más chico */
.faq{grid-template-columns:1fr 1fr;max-width:none;align-items:start;gap:12px 18px;}
.faq summary{font-size:15px;font-weight:700;padding:15px 44px 15px 18px;min-height:52px;}
.faq summary::after{right:18px;width:9px;height:9px;border-width:2.2px;}
.faq .resp{font-size:14.2px;line-height:1.58;padding:0 18px 17px;}
.faq .resp p+p{margin-top:9px;}
@media(max-width:820px){.faq{grid-template-columns:1fr;}.faq summary{font-size:14.5px;padding:14px 40px 14px 16px;}.faq .resp{font-size:13.8px;padding:0 16px 15px;}}

/* Páginas legales */
.legal-wrap{max-width:820px;margin:0 auto;padding:54px 24px 76px;}
.legal-wrap h1{font-family:var(--satoshi);font-weight:300;font-size:clamp(28px,4vw,40px);color:var(--texto-fuerte);letter-spacing:-.6px;line-height:1.1;}
.legal-meta{font-size:13px;color:var(--texto-2);font-weight:600;margin-top:12px;}
.legal-wrap h2{font-family:var(--satoshi);font-size:19px;font-weight:900;color:var(--texto-fuerte);margin:36px 0 10px;}
.legal-wrap p,.legal-wrap li{font-size:15px;line-height:1.65;color:var(--texto);text-wrap:pretty;}
.legal-wrap p+p{margin-top:10px;}
.legal-wrap ul{margin:10px 0 0 20px;display:grid;gap:8px;}
.legal-wrap b{color:var(--texto-fuerte);font-weight:800;}
.legal-wrap a{color:var(--rojo);text-decoration:underline;}
.legal-nota{background:#F6F7F9;border:1px solid var(--borde);border-radius:14px;padding:18px 20px;margin-top:20px;}
.legal-nota p{font-size:13.5px;color:var(--texto-2);}

/* La sección de planes es el bloque principal: su título pesa más que el resto */
#planes .sec-in h2{font-size:clamp(29px,4.6vw,46px);letter-spacing:-1px;line-height:1.05;}
#planes .sec-in .sub{font-size:clamp(16px,1.7vw,18.5px);margin-top:16px;}
#planes .sec-in .eyebrow{font-size:12.5px;letter-spacing:1.6px;}
#planes{padding-top:74px;}
@media(max-width:860px){#planes{padding-top:50px;}}

/* "Velocidad simétrica" bajo el nombre del plan: más chico y más cerca del título */
.grid .card .plan-linea{font-size:12.8px;margin-top:1px;letter-spacing:.1px;}

.feat-pill{display:inline-flex;align-items:center;gap:6px;}
.feat-pill svg{width:12px;height:12px;flex:none;fill:none;stroke:currentColor;stroke-width:3;stroke-linecap:round;}

/* "Primer Mes Gratis": sin itálica */
.grid .card .gratis{font-style:normal;letter-spacing:.2px;}
/* La pastilla de Claro Pay va primera, con aire abajo */
.feat-row--pill{margin-top:0;margin-bottom:12px;}

/* Cabecera de la tarjeta: menos aire entre líneas para bajar la altura */
.grid .card .head{padding-top:22px;padding-bottom:18px;}
.grid .card .precio{margin-top:8px;}
.grid .card .antes{margin-top:5px;}
.grid .card .gratis{margin-top:7px;}

/* Bajada de presentación + rótulo de la grilla de planes */
.planes-kw{font-family:var(--satoshi);font-size:20px;font-weight:900;color:var(--texto-fuerte);letter-spacing:-.3px;margin-top:38px;}
.planes-kw-sub{font-size:14.5px !important;margin:8px auto 0 !important;}

/* Panel del equipo: el módem sobre fondo rojo de Claro */
.equipo-panel{position:relative;overflow:hidden;border-radius:18px;padding:26px 26px 28px;text-align:center;color:#fff;background:radial-gradient(620px 260px at 100% 0,rgba(255,255,255,.16),transparent 62%),linear-gradient(125deg,#DA291C 0%,#B52217 100%);box-shadow:0 18px 44px rgba(181,34,23,.28);}
.equipo-panel::after{content:"";position:absolute;left:-18%;bottom:-38%;width:150%;height:70%;background:radial-gradient(closest-side,rgba(0,0,0,.22),transparent 70%);pointer-events:none;}
.equipo-tag{position:relative;z-index:2;display:inline-block;background:#fff;color:var(--rojo);font-family:var(--satoshi);font-size:11.5px;font-weight:800;letter-spacing:.9px;text-transform:uppercase;padding:6px 15px;border-radius:50px;}
.equipo-img{position:relative;z-index:2;width:auto;height:auto;max-width:min(64%,240px);margin:6px auto 10px;filter:drop-shadow(0 26px 34px rgba(0,0,0,.34));}
.especs--rojo{position:relative;z-index:2;text-align:left;margin-top:6px;}
.especs--rojo li{border-bottom:1px dashed rgba(255,255,255,.3);}
.especs--rojo span{color:rgba(255,255,255,.82);}
.especs--rojo b{color:#fff;}
.equipo-cta{position:relative;z-index:2;display:inline-flex;align-items:center;justify-content:center;width:100%;min-height:50px;margin-top:22px;background:#fff;color:var(--rojo);border-radius:100px;font-family:var(--satoshi);font-size:15px;font-weight:800;transition:transform .2s;}
.equipo-cta:hover{transform:translateY(-2px);color:var(--rojo-grad);}

/* ===== Bloque de apertura de planes: jerarquía + beneficios en pastillas ===== */
.planes-intro{text-align:center;}
#planes .planes-intro h2{font-size:clamp(29px,4.6vw,46px);letter-spacing:-1px;line-height:1.05;}
.bnf{list-style:none;display:flex;flex-wrap:wrap;justify-content:center;gap:9px;margin:26px auto 0;max-width:800px;}
.bnf li{display:inline-flex;align-items:center;gap:8px;background:#fff;border:1px solid var(--borde);border-radius:100px;padding:9px 17px;font-size:14px;font-weight:700;color:var(--texto-fuerte);box-shadow:0 2px 10px rgba(45,45,45,.05);}
.bnf svg{width:15px;height:15px;flex:none;fill:none;stroke:var(--rojo);stroke-width:3;stroke-linecap:round;stroke-linejoin:round;}
.planes-kw-row{display:flex;flex-direction:column;align-items:center;gap:4px;margin-top:40px;padding-top:26px;border-top:1px solid rgba(45,45,45,.1);max-width:560px;margin-left:auto;margin-right:auto;}
.planes-kw{font-family:var(--satoshi);font-size:19px;font-weight:900;color:var(--texto-fuerte);letter-spacing:-.3px;margin:0;}
.planes-kw-mes{font-size:13.5px;color:var(--texto-2);font-weight:600;}
.planes-intro .seg-wrap{margin-top:20px;margin-bottom:0;}
/* ===== Hero: el cuadro de promo llega hasta la base del botón ===== */
.hero-inner--2col{align-items:stretch;}
.hero-inner--2col .hero-left h1{font-size:clamp(31px,4.3vw,47px);line-height:1.06;}
@media(min-width:701px){.hero-inner--2col .hero-promo{display:flex;flex-direction:column;}}
.hero-inner--2col .hero-promo .ticket-body{flex:1;justify-content:center;}
@media(max-width:860px){.bnf li{font-size:13px;padding:8px 14px;}.planes-kw-row{margin-top:30px;padding-top:22px;}}
@media(max-width:760px){.hero-inner--2col{align-items:center;}}

/* Hero: WhatsApp como acción principal y "Ver planes" como secundaria */
.hero-ctas{display:flex;flex-wrap:wrap;align-items:center;gap:14px;margin-top:30px;}
.hero-wa{display:inline-flex;align-items:center;justify-content:center;gap:10px;background:#25D366;color:#fff;font-family:var(--satoshi);font-size:15.5px;font-weight:800;padding:0 26px;min-height:54px;border-radius:100px;box-shadow:0 14px 30px rgba(37,211,102,.28);transition:transform .2s,background .2s;}
.hero-wa:hover{transform:translateY(-2px);background:#1FBE5B;color:#fff;}
.hero-wa svg{width:20px;height:20px;flex:none;fill:currentColor;}
.hero-ver{display:inline-flex;align-items:center;gap:8px;color:#fff;font-family:var(--satoshi);font-size:15px;font-weight:700;padding:0 22px;min-height:54px;border:1.5px solid rgba(255,255,255,.34);border-radius:100px;transition:border-color .2s,background .2s;}
.hero-ver:hover{color:#fff;border-color:#fff;background:rgba(255,255,255,.08);}
.hero-ver svg{width:17px;height:17px;flex:none;}
@media(max-width:600px){.hero-ctas{flex-direction:column;align-items:stretch;gap:10px;}.hero-wa,.hero-ver{width:100%;}}

/* Sin glows en los CTA */
.hero-wa{box-shadow:none;}
.equipo-cta,.wa-btn,.cta,.lp-nav a.lp-wa,.wsp-float,.cb-cta,.qr-wa-cta,.cob-form button,.ficha-btn{box-shadow:none;}
.hero-wa:hover,.wa-btn:hover,.equipo-cta:hover,.cb-cta:hover{box-shadow:none;}

/* "Ver planes": botón blanco con texto oscuro */
.hero-ver{background:#fff;color:var(--texto-fuerte);border-color:#fff;}
.hero-ver:hover{background:#F1F2F4;color:var(--texto-fuerte);border-color:#F1F2F4;}

/* Pastillas de beneficios: que entren en una sola línea */
.bnf{max-width:none;gap:8px;flex-wrap:wrap;}
.bnf li{padding:9px 15px;font-size:13.6px;white-space:nowrap;}
/* Rótulo de la grilla: más presencia */
.planes-kw-row{max-width:640px;gap:8px;}
.planes-kw{font-size:23px;}
.planes-kw-mes{font-size:14.5px;color:var(--texto-2);font-weight:500;line-height:1.5;text-wrap:balance;}
@media(max-width:900px){.bnf li{white-space:normal;}}

.hero-inner--2col .hero-left h1{font-size:clamp(33px,4.75vw,51px);letter-spacing:-1.2px;}

/* Ticket del hero: transición al cambiar de velocidad */
.ticket-body .ticket-speed,.ticket-body .tp-amount,.hero-offer-mob .hom-speed,.hero-offer-mob .hom-price{transition:opacity .3s ease,transform .3s ease;}
.ticket-body.cambiando .ticket-speed,.ticket-body.cambiando .tp-amount,.hero-offer-mob.cambiando .hom-speed,.hero-offer-mob.cambiando .hom-price{opacity:0;transform:translateY(-10px);}
/* "1 MES GRATIS" con más presencia */
.ticket-stub{padding:17px 22px;gap:4px;}
.ticket-stub b{font-size:20px;letter-spacing:-.2px;}
.ticket-stub .stub-detail{font-size:14.5px;color:var(--texto-2);font-weight:600;}

/* Entrada escalonada de las pastillas de beneficios */
@media(min-width:861px){
  .bnf.anim li{opacity:0;transform:translateY(12px);}
  .bnf.anim.entra li{animation:bnfIn .52s cubic-bezier(.22,.61,.36,1) forwards;}
  .bnf.anim.entra li:nth-child(1){animation-delay:.04s;}
  .bnf.anim.entra li:nth-child(2){animation-delay:.14s;}
  .bnf.anim.entra li:nth-child(3){animation-delay:.24s;}
  .bnf.anim.entra li:nth-child(4){animation-delay:.34s;}
  .bnf.anim.entra li:nth-child(5){animation-delay:.44s;}
  .bnf.anim.entra li:nth-child(6){animation-delay:.54s;}
}
@keyframes bnfIn{to{opacity:1;transform:none;}}
@media(prefers-reduced-motion:reduce){.bnf.anim li{opacity:1;transform:none;animation:none;}}

/* Menos aire entre el último beneficio y el botón */
.grid .card .features{padding-bottom:0;}
.grid .card .foot{padding-top:14px;}

/* La bajada del hero acompaña el ancho del título */
.hero-inner--2col .hero-left p{max-width:none;text-wrap:pretty;}

/* Cambio de velocidad en el ticket: más lento y suave */
.ticket-body .ticket-speed,.ticket-body .tp-amount,.hero-offer-mob .hom-speed,.hero-offer-mob .hom-price{transition:opacity .55s cubic-bezier(.4,0,.2,1),transform .55s cubic-bezier(.4,0,.2,1);}
.ticket-body.cambiando .ticket-speed,.ticket-body.cambiando .tp-amount,.hero-offer-mob.cambiando .hom-speed,.hero-offer-mob.cambiando .hom-price{opacity:0;transform:translateY(-6px);}

.hero-inner--2col .hero-left p{text-wrap:initial;}

/* Cambio de velocidad: se va hacia arriba y el siguiente entra desde abajo */
.ticket-body.cambiando .ticket-speed,.ticket-body.cambiando .tp-amount,.ticket-body.cambiando .ticket-tag,
.hero-offer-mob.cambiando .hom-speed,.hero-offer-mob.cambiando .hom-price{opacity:0;transform:translateY(-12px);}
.ticket-body .ticket-tag{transition:opacity .55s cubic-bezier(.4,0,.2,1),transform .55s cubic-bezier(.4,0,.2,1);}
.ticket-body.entrando .ticket-speed,.ticket-body.entrando .tp-amount,.ticket-body.entrando .ticket-tag,
.hero-offer-mob.entrando .hom-speed,.hero-offer-mob.entrando .hom-price{animation:tickIn .6s cubic-bezier(.22,.61,.36,1) backwards;}
.ticket-body.entrando .tp-amount{animation-delay:.07s;}
.ticket-body.entrando .ticket-tag{animation-delay:.13s;}
@keyframes tickIn{from{opacity:0;transform:translateY(14px);}to{opacity:1;transform:none;}}

/* Título de apertura: contraste de trazo entre la frase liviana y la destacada */
#planes .planes-intro h2 b{font-weight:900;color:var(--texto-fuerte);}

.planes-kw{font-weight:300;}
.planes-kw b{font-weight:900;}

/* Hover del CTA de los planes: apenas un 15% más oscuro, sin cambiar de color */
.grid .card .cta:hover,.cta:hover{background:#c22318;transform:none;box-shadow:none;}

.grid .card .cta:hover,.cta:hover{background:#b62218;color:#fff;border:1px solid transparent;transform:none;box-shadow:none;}

/* Todas las partes del ticket cambian con el mismo tiempo y curva */
.ticket-body .ticket-speed,.ticket-body .tp-amount,.ticket-body .ticket-tag,
.hero-offer-mob .hom-speed,.hero-offer-mob .hom-price{transition:opacity .5s cubic-bezier(.4,0,.2,1),transform .5s cubic-bezier(.4,0,.2,1);}
.ticket-body.entrando .ticket-speed,.ticket-body.entrando .tp-amount,.ticket-body.entrando .ticket-tag,
.hero-offer-mob.entrando .hom-speed,.hero-offer-mob.entrando .hom-price{animation:tickIn .5s cubic-bezier(.4,0,.2,1) backwards;}
.ticket-body.entrando .tp-amount,.ticket-body.entrando .ticket-tag{animation-delay:0s;}

/* "Beneficios exclusivos para nuevos clientes": más grande, con la bajada pareja */
.planes-kw{font-size:clamp(24px,3vw,31px);letter-spacing:-.6px;line-height:1.1;}
.planes-kw-row{max-width:700px;gap:10px;}
.planes-kw-mes{font-size:15px;max-width:52ch;margin:0 auto;text-wrap:balance;}

/* Subtítulo del bloque de planes: un solo trazo */
.planes-kw{font-weight:800;font-size:clamp(22px,2.7vw,28px);letter-spacing:-.5px;}
.planes-kw b{font-weight:inherit;}
/* Sección con foto de fondo oscurecida */
.sec--foto{position:relative;color:#fff;background:linear-gradient(90deg,rgba(14,15,19,.94) 0%,rgba(14,15,19,.82) 48%,rgba(14,15,19,.58) 100%),var(--foto) center/cover no-repeat;}
.sec--foto h2,.sec--foto h3{color:#fff;}
.sec--foto .sub{color:rgba(255,255,255,.88);}
.sec--foto .sub b{color:#fff;}
.sec--foto .eyebrow{color:#fff;}
.sec--foto .lista li{color:rgba(255,255,255,.9);}
.sec--foto .lista b{color:#fff;}
.sec--foto .lista svg{stroke:#fff;}
.sec--foto .tarjeta{box-shadow:0 22px 50px rgba(0,0,0,.4);}
@media(max-width:860px){.sec--foto{background:linear-gradient(0deg,rgba(14,15,19,.94),rgba(14,15,19,.86)),var(--foto) center/cover no-repeat;}}

.planes-kw{font-weight:900;}

/* Foto de fondo: velo parejo para que el texto se lea sobre cualquier parte de la imagen */
.sec--foto{background:linear-gradient(270deg,rgba(14,15,19,.42) 0%,rgba(14,15,19,0) 62%),linear-gradient(0deg,rgba(14,15,19,.74),rgba(14,15,19,.74)),var(--foto) center/cover no-repeat;}
@media(max-width:860px){.sec--foto{background:linear-gradient(0deg,rgba(14,15,19,.86),rgba(14,15,19,.86)),var(--foto) center/cover no-repeat;}}

/* Métricas sobre fondo oscuro (gaming, latencia, velocidad) */
.metricas{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:34px;}
.metrica{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.2);border-radius:18px;padding:24px 22px;}
.metrica b{display:block;font-family:var(--satoshi);font-size:clamp(23px,2.6vw,29px);font-weight:900;color:#fff;letter-spacing:-.7px;margin-bottom:9px;}
.metrica span{display:block;font-size:14.5px;line-height:1.55;color:rgba(255,255,255,.82);font-weight:500;}
.metricas-cta{display:flex;justify-content:center;margin-top:30px;}
@media(max-width:860px){.metricas{grid-template-columns:1fr;}.metricas-cta .hero-wa{width:100%;}}

/* Aviso al cliente existente: dentro de la escala negro / blanco / gris / rojo */
.aviso-cli{background:#F6F7F9;border:1px solid var(--borde);border-left:3px solid var(--rojo);}
.aviso-cli h3{color:var(--texto-fuerte);}

/* FAQ sin negritas */
.faq summary{font-weight:600;}
.faq .resp b{font-weight:600;color:var(--texto-fuerte);}
/* Secciones con foto: velo más parejo para que el título se lea entero */
.sec--foto{background:linear-gradient(0deg,rgba(14,15,19,.84),rgba(14,15,19,.84)),var(--foto) center/cover no-repeat;}

/* Fondo con foto: lo blanco vale solo fuera de las tarjetas */
.sec--foto .tarjeta h3,.sec--foto .tarjeta .tarjeta-nombre{color:var(--texto-fuerte);}
.sec--foto .tarjeta .sub,.sec--foto .tarjeta .tarjeta-linea{color:var(--texto-2);}
.sec--foto .tarjeta .lista li{color:var(--texto);}
.sec--foto .tarjeta .lista b{color:var(--texto-fuerte);}
.sec--foto .tarjeta .lista svg{stroke:var(--rojo);}
.sec--foto .tarjeta .eyebrow{color:var(--rojo);}
/* La columna de texto va en un recuadro para no quedar suelta sobre la foto */
.sec--foto .duo-txt{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.2);border-radius:18px;padding:30px 28px;}
.sec--foto .duo-txt .sub{max-width:none;}
@media(max-width:860px){.sec--foto .duo-txt{padding:24px 20px;}}

.sec--foto h2 b,.sec--foto h2 .hl,.sec--foto h3 b{color:#fff;}

/* Título de apertura: un punto menos de trazo en las dos partes */
#planes .planes-intro h2{font-weight:200;}
#planes .planes-intro h2 b{font-weight:800;}

/* Ícono en lugar de la pastilla en la tarjeta del combo */
.tarjeta-ico{width:56px;height:56px;border-radius:16px;background:rgba(218,41,28,.1);display:inline-flex;align-items:center;justify-content:center;color:var(--rojo);}
.tarjeta-ico svg{width:28px;height:28px;}

/* Gaming: dos columnas, texto a la izquierda y métricas apiladas a la derecha */
.duo--gaming{grid-template-columns:1fr .92fr;align-items:center;gap:42px;}
#gaming .duo-txt{background:none;border:0;padding:0;}
#gaming .metricas{grid-template-columns:1fr;gap:12px;margin-top:0;}
#gaming .metrica{display:grid;grid-template-columns:auto 1fr;align-items:baseline;gap:6px 18px;padding:20px 22px;}
#gaming .metrica b{margin-bottom:0;font-size:clamp(20px,2.1vw,24px);white-space:nowrap;}
#gaming .metrica span{font-size:14px;}
@media(max-width:860px){.duo--gaming{grid-template-columns:1fr;gap:26px;}#gaming .metrica{grid-template-columns:1fr;gap:6px;}#gaming .metrica b{white-space:normal;}}

/* CTAs de WhatsApp en blanco, salvo el del hero y el flotante */
#gaming .hero-wa,.wa-panel .wa-btn,.sec .hero-wa,.equipo-cta{background:#fff;color:var(--texto-fuerte);}
#gaming .hero-wa svg,.sec .hero-wa svg{fill:#25D366;}
#gaming .hero-wa:hover,.sec .hero-wa:hover{background:#F1F2F4;color:var(--texto-fuerte);}
.wa-panel .wa-btn{color:#0B8A46;}
.wa-panel .wa-btn:hover{background:#F1F2F4;color:#0B8A46;}
.equipo-cta{color:var(--rojo);}
.hero .hero-wa{background:#25D366;color:#fff;}
.hero .hero-wa svg{fill:#fff;}
.hero .hero-wa:hover{background:#1FBE5B;color:#fff;}

/* Rótulo en pastilla sobre fondo con foto */
.pill-sec{display:inline-block;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.3);color:#fff;border-radius:100px;padding:7px 16px;font-size:12px;font-weight:800;letter-spacing:1.1px;text-transform:uppercase;margin-bottom:16px;}
/* Métricas con ícono y divisor entre el dato y su explicación */
#gaming .metrica{grid-template-columns:auto 1fr;gap:0 16px;align-items:center;}
.met-ico{grid-row:span 2;width:46px;height:46px;border-radius:14px;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.22);display:inline-flex;align-items:center;justify-content:center;color:#fff;}
.met-ico svg{width:22px;height:22px;}
#gaming .metrica b{align-self:end;padding-bottom:9px;border-bottom:1px solid rgba(255,255,255,.2);margin-bottom:9px;}
.met-txt{align-self:start;}
@media(max-width:860px){#gaming .metrica{grid-template-columns:auto 1fr;}.met-ico{grid-row:span 2;}}
/* Divisor bajo los títulos de sección */
.sec-head h2,.duo-txt h2{padding-bottom:16px;border-bottom:1px solid rgba(45,45,45,.12);margin-bottom:4px;}
.sec--foto .duo-txt h2,.sec--foto .sec-head h2{border-bottom-color:rgba(255,255,255,.22);}
.planes-intro h2{padding-bottom:0;border-bottom:0;margin-bottom:0;}

.planes-kw{font-weight:800;}
.planes-kw-mes{max-width:none;text-wrap:nowrap;white-space:nowrap;}
@media(max-width:760px){.planes-kw-mes{white-space:normal;text-wrap:balance;}}

/* El "/mes" acompaña el cambio de velocidad, igual que el precio */
.ticket-body .tp-per{transition:opacity .5s cubic-bezier(.4,0,.2,1),transform .5s cubic-bezier(.4,0,.2,1);}
.ticket-body.cambiando .tp-per{opacity:0;transform:translateY(-12px);}
.ticket-body.entrando .tp-per{animation:tickIn .5s cubic-bezier(.4,0,.2,1) backwards;}

/* Texto que ve el rastreador antes de que se dibujen las tarjetas */
.grid-fallback{grid-column:1/-1;text-align:center;font-size:15px;line-height:1.6;color:var(--texto-2);font-weight:500;max-width:70ch;margin:0 auto;}

/* Logo de Claro sobre el título de planes */
.planes-logo{height:58px;width:auto;margin:0 auto 18px;}
@media(max-width:860px){.planes-logo{height:46px;margin-bottom:14px;}}

/* Logo de Claro + divisor con extremos en fade */
.planes-logo{height:67px;margin:0 auto 16px;}
.div-fade{display:block;width:min(420px,72%);height:1px;margin:0 auto 22px;background:linear-gradient(90deg,transparent,rgba(45,45,45,.28) 22%,rgba(45,45,45,.28) 78%,transparent);}
@media(max-width:860px){.planes-logo{height:53px;margin-bottom:13px;}.div-fade{margin-bottom:18px;}}

/* Nombre del plan: marca liviana arriba, velocidad en negrita */
.grid .card .plan-nombre{display:flex;flex-direction:column;align-items:center;gap:1px;line-height:1.02;}
.pn-marca{display:block;font-size:.8em;font-weight:400;letter-spacing:-.2px;color:var(--texto-2);}
.pn-vel{display:block;font-weight:900;letter-spacing:-.8px;color:var(--texto-fuerte);}

/* "Velocidad simétrica" en pastilla de contorno fino */
.grid .card .plan-linea{margin-top:7px;}
.linea-pill{display:inline-block;border:1px solid rgba(45,45,45,.22);border-radius:100px;padding:5px 13px;font-size:11.5px;font-weight:600;color:var(--texto-2);letter-spacing:.2px;line-height:1.25;}

/* Logo de Claro: un poco más chico y con más aire antes del divisor */
.planes-logo{height:64px;margin-bottom:26px;}
@media(max-width:860px){.planes-logo{height:50px;margin-bottom:21px;}}

.pn-marca{font-weight:700;color:var(--texto-fuerte);}

/* La etiqueta del plan destacado se apoya por encima del borde de la tarjeta */
.grid{align-items:end;}
.grid .card{height:100%;}
.grid .card--feat{overflow:visible;}
.grid .card--feat .badge{top:0;transform:translate(-50%,-50%);border-radius:100px;height:28px;display:inline-flex;align-items:center;white-space:nowrap;box-shadow:0 4px 12px rgba(255,131,0,.28);}
.grid .card--feat .head{padding-top:26px;}

.pn-marca{color:#5E5E5E;}

/* Sin glows en ninguna parte del sitio */
.grid .card--feat .badge{box-shadow:none;}
.badge,.tarjeta-tag,.linea-pill,.feat-pill,.pill-sec,.bnf li,.zona,.equipo-tag{box-shadow:none;}

/* Métricas de gaming: ícono blanco sobre recuadro rojo, centrado */
#gaming .met-ico{width:54px;height:54px;border-radius:15px;background:var(--rojo);border:0;display:flex;align-items:center;justify-content:center;color:#fff;align-self:center;}
#gaming .met-ico svg{width:28px;height:28px;display:block;stroke:#fff;fill:none;}
#gaming .metrica{align-items:center;gap:2px 18px;}
#gaming .metrica b{align-self:end;}
/* Entrada escalonada al aparecer en pantalla */
@media(min-width:861px){
  .metricas.anim .metrica{opacity:0;transform:translateY(10px);}
  .metricas.anim.entra .metrica{animation:bnfIn .5s cubic-bezier(.22,.61,.36,1) forwards;}
  .metricas.anim.entra .metrica:nth-child(1){animation-delay:.05s;}
  .metricas.anim.entra .metrica:nth-child(2){animation-delay:.16s;}
  .metricas.anim.entra .metrica:nth-child(3){animation-delay:.27s;}
}
@media(prefers-reduced-motion:reduce){.metricas.anim .metrica{opacity:1;transform:none;animation:none;}}

/* Beneficios: entrada un poco más pausada */
@media(min-width:861px){
  .bnf.anim.entra li{animation-duration:.62s;}
  .bnf.anim.entra li:nth-child(1){animation-delay:.12s;}
  .bnf.anim.entra li:nth-child(2){animation-delay:.30s;}
  .bnf.anim.entra li:nth-child(3){animation-delay:.48s;}
  .bnf.anim.entra li:nth-child(4){animation-delay:.66s;}
  .bnf.anim.entra li:nth-child(5){animation-delay:.84s;}
  .bnf.anim.entra li:nth-child(6){animation-delay:1.02s;}
}

/* ===== Banner de Claro Pay ===== */
.cpay{display:grid;grid-template-columns:1.15fr .85fr;align-items:stretch;gap:0;background:var(--rojo);border:0;border-radius:22px;overflow:hidden;padding:0;margin-top:38px;}
.cpay-txt{padding:38px 36px;color:#fff;display:flex;flex-direction:column;align-items:flex-start;}
.cpay-logo{height:40px;width:auto;background:#fff;border-radius:10px;padding:7px 12px;margin-bottom:22px;}
.cpay-big{display:flex;align-items:center;gap:16px;}
.cpay-big b{font-family:var(--satoshi);font-size:clamp(54px,7vw,82px);font-weight:900;line-height:.86;letter-spacing:-3.5px;color:#fff;}
.cpay-big span{font-family:var(--satoshi);font-size:clamp(16px,1.9vw,21px);font-weight:800;line-height:1.16;color:#fff;letter-spacing:-.3px;}
.cpay p{font-size:15px;line-height:1.55;color:rgba(255,255,255,.92);font-weight:500;margin-top:18px;max-width:46ch;}
.cpay-cta{display:inline-flex;align-items:center;gap:9px;background:#fff;color:var(--rojo);font-family:var(--satoshi);font-size:15px;font-weight:800;min-height:50px;padding:0 24px;border-radius:100px;margin-top:24px;transition:background .2s;}
.cpay-cta:hover{background:#F1F2F4;color:var(--rojo);}
.cpay-cta svg{width:17px;height:17px;}
.cpay-foto{width:100%;height:100%;object-fit:cover;display:block;}
@media(max-width:860px){
  .cpay{grid-template-columns:1fr;text-align:left;}
  .cpay-txt{padding:28px 22px;order:2;}
  .cpay-foto{order:1;height:220px;}
  .cpay-cta{width:100%;justify-content:center;}
}

/* Tarjeta del bloque WiFi: mismo tratamiento de nombre que las de la grilla */
#wifiPlan .tarjeta-nombre{display:flex;flex-direction:column;gap:1px;line-height:1.04;}
#wifiPlan .pn-marca{font-size:15px;}
#wifiPlan .pn-vel{font-size:32px;}
#wifiPlan .antes{margin-top:5px;}

/* Logo de Claro Pay sobre la foto, abajo a la derecha */
.cpay-media{position:relative;display:block;}
.cpay-logo{position:absolute;right:18px;bottom:18px;height:52px;width:auto;background:#fff;border-radius:12px;padding:9px 15px;margin:0;}
.cpay p{max-width:56ch;}
@media(max-width:860px){.cpay-media{order:1;}.cpay-logo{height:42px;right:14px;bottom:14px;padding:7px 12px;}}

/* ===== Banner de Claro Pay · versión oscura ===== */
.cpay{grid-template-columns:.85fr 1.15fr;background:#16171a;}
.cpay-media{position:relative;display:block;}
.cpay-foto{width:100%;height:100%;object-fit:cover;display:block;}
.cpay-txt{padding:40px 38px;color:#fff;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;}
.cpay-logo{position:static;height:44px;width:auto;background:#fff;border-radius:11px;padding:8px 13px;margin:0 0 22px;}
.cpay-txt h3{font-family:var(--satoshi);font-size:clamp(22px,2.8vw,33px);font-weight:300;line-height:1.1;letter-spacing:-.9px;color:#fff;padding:0;border:0;margin:0;}
.cpay-txt h3 b{font-weight:900;color:#fff;}
.cpay-monto{display:flex;align-items:baseline;gap:11px;margin-top:20px;padding-top:20px;border-top:1px solid rgba(255,255,255,.18);width:100%;}
.cpay-monto b{font-family:var(--satoshi);font-size:clamp(38px,4.4vw,52px);font-weight:900;color:var(--rojo);letter-spacing:-2px;line-height:1;}
.cpay-monto span{font-size:15px;color:rgba(255,255,255,.75);font-weight:600;line-height:1.35;}
.cpay-lista{list-style:none;padding:0;margin:18px 0 0;display:grid;gap:7px;}
.cpay-lista li{position:relative;padding-left:19px;font-size:14px;color:rgba(255,255,255,.72);font-weight:500;line-height:1.5;}
.cpay-lista li::before{content:"";position:absolute;left:0;top:8px;width:6px;height:6px;border-radius:50%;background:var(--rojo);}
@media(max-width:860px){
  .cpay{grid-template-columns:1fr;}
  .cpay-media{order:1;height:200px;}
  .cpay-txt{order:2;padding:28px 22px;}
}

.cpay-monto span{font-size:17px;color:#fff;font-weight:700;}
.cpay-pie{font-size:15px;line-height:1.55;color:rgba(255,255,255,.8);font-weight:500;margin-top:18px;max-width:54ch;}

/* ===== Tarjeta del plan de entrada (bloque Claro WiFi Hogar) ===== */
.wp{background:#fff;border:1px solid var(--borde);border-radius:20px;overflow:hidden;box-shadow:0 14px 38px rgba(45,45,45,.1);}
.wp-top{background:#16171a;color:#fff;padding:26px 26px 22px;text-align:center;}
.wp-tag{display:inline-block;background:var(--rojo);color:#fff;font-size:11px;font-weight:800;letter-spacing:1.1px;text-transform:uppercase;padding:5px 13px;border-radius:100px;}
.wp-marca{font-size:14.5px;font-weight:700;color:rgba(255,255,255,.72);margin-top:14px;letter-spacing:-.1px;}
.wp-vel{font-family:var(--satoshi);font-size:42px;font-weight:900;color:#fff;letter-spacing:-1.6px;line-height:1.02;}
.wp-pill{margin-top:9px;border-color:rgba(255,255,255,.32);color:rgba(255,255,255,.8);}
.wp-precio{text-align:center;padding:22px 26px 18px;border-bottom:1px solid rgba(45,45,45,.1);}
.wp-antes{font-size:13px;color:var(--gris-tachado);font-weight:600;text-decoration:line-through;min-height:17px;}
.wp-monto{display:flex;align-items:baseline;justify-content:center;gap:3px;margin-top:2px;}
.wp-monto .monto{font-family:var(--satoshi);font-size:42px;font-weight:900;color:var(--rojo);letter-spacing:-1.8px;line-height:1;}
.wp-monto .mes{font-size:15px;color:var(--texto-2);font-weight:700;}
.wp-sinimp{font-size:12.5px;color:var(--texto-2);font-weight:500;margin-top:6px;}
.wp-feats{list-style:none;padding:20px 26px 0;margin:0;display:grid;gap:11px;}
.wp-feats li{display:flex;gap:11px;font-size:14.2px;line-height:1.45;color:var(--texto);font-weight:500;}
.wp-feats svg{width:17px;height:17px;flex:none;fill:none;stroke:var(--rojo);stroke-width:3;stroke-linecap:round;stroke-linejoin:round;margin-top:2px;}
.wp .cta{display:flex;width:calc(100% - 52px);margin:20px 26px 26px;}

/* Bloque con foto al costado */
.duo--foto{grid-template-columns:.9fr 1.1fr;gap:40px;align-items:center;}
.duo-img{width:100%;height:100%;max-height:430px;object-fit:cover;border-radius:20px;display:block;}
@media(max-width:860px){.duo--foto{grid-template-columns:1fr;gap:24px;}.duo-img{max-height:240px;}}

/* Negrita real dentro de los títulos de sección */
.sec h2 b,.sec h2 .hl{font-weight:800;}
.sec--foto h2 b,.sec--foto h2 .hl{color:#fff;}
#planes .planes-intro h2 b{font-weight:800;}

/* "Incluye": nombres de las plataformas, sin depender de logos remotos */
.grid .card .incluye .logos{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;}
.socio{display:inline-block;background:#fff;border:1px solid rgba(45,45,45,.14);border-radius:100px;padding:6px 14px;font-family:var(--satoshi);font-size:13px;font-weight:800;color:var(--texto-fuerte);letter-spacing:-.1px;}
.grid .card .incluye-label{font-size:11px;letter-spacing:.9px;}
/* Logo de Claro del header, sin la bajada de agente */
.hdr-claro{height:26px;}
@media(max-width:600px){.hdr-claro{height:21px;}}

/* Título del combo: marca más chica arriba, oferta abajo */
.h2-tv{font-size:clamp(20px,2.75vw,31px);}
/* Íconos de las listas sobre foto: dentro de un círculo de contorno fino */
.sec--foto .lista li{align-items:center;gap:15px;}
.sec--foto .lista svg{width:20px;height:20px;box-sizing:content-box;padding:10px;border:1px solid rgba(255,255,255,.4);border-radius:50%;margin-top:0;}

.wp-top{padding-top:28px;}
.wp-marca{margin-top:0;}

/* ===== Footer en tres columnas ===== */
.ft-cols{max-width:1040px;margin:0 auto;padding:52px 24px 40px;display:grid;grid-template-columns:1.25fr .85fr .9fr;gap:40px;}
.ft-col h4{font-family:var(--satoshi);font-size:12px;font-weight:900;letter-spacing:1.2px;text-transform:uppercase;color:rgba(255,255,255,.55);margin-bottom:14px;}
.ft-nav{display:flex;flex-direction:column;gap:10px;align-items:flex-start;}
.ft-nav a{font-size:14.5px;color:rgba(255,255,255,.85);font-weight:600;transition:color .2s;}
.ft-nav a:hover{color:#fff;}
.ft-dato{font-size:14px;color:rgba(255,255,255,.6);font-weight:500;}
.ft-wa{display:inline-flex;align-items:center;gap:9px;font-weight:800 !important;color:#fff !important;}
.ft-wa svg{width:17px;height:17px;fill:#25D366;flex:none;}
.ft-col--marca .ft-logos{display:flex;align-items:center;gap:13px;margin-bottom:18px;}
.ft-col--marca .ft-logos img{height:24px;width:auto;}
.ft-col--marca .ft-logos .ft-claro{height:20px;}
.ft-col--marca .ft-sep{width:1px;height:22px;background:rgba(255,255,255,.28);}
.ft-dir{font-size:13.5px;line-height:1.6;color:rgba(255,255,255,.6);font-weight:500;}
.ft-cols .ft-social{display:flex;gap:11px;margin-top:20px;}
@media(max-width:860px){.ft-cols{grid-template-columns:1fr;gap:32px;padding:38px 22px 30px;}}

/* ===== Páginas legales ===== */
.legal .sec-in{max-width:760px;}
.legal-h1{font-family:var(--satoshi);font-size:clamp(30px,4vw,44px);font-weight:900;letter-spacing:-1.2px;color:var(--texto-fuerte);line-height:1.06;}
.legal-fecha{font-size:14px;color:var(--texto-2);font-weight:600;margin-top:10px;padding-bottom:22px;border-bottom:1px solid var(--borde);}
.legal h2{font-family:var(--satoshi);font-size:20px;font-weight:900;color:var(--texto-fuerte);letter-spacing:-.4px;margin:32px 0 10px;padding:0;border:0;}
.legal p{font-size:15.5px;line-height:1.68;color:var(--texto);margin-bottom:12px;}
.legal p b{color:var(--texto-fuerte);font-weight:800;}
.legal ul{margin:0 0 14px;padding-left:20px;display:grid;gap:7px;}
.legal li{font-size:15.5px;line-height:1.6;color:var(--texto);}

/* Combo TV: sin bajada, el título y la lista ocupan mejor el alto */
#combo .h2-tv{font-size:clamp(23px,3.1vw,35px);}
#combo .lista{margin-top:26px;gap:18px;}
#combo .lista li{font-size:16px;}
#combo .duo-txt{padding:34px 30px;}

/* FAQ: apertura y cierre con transición */
.faq details{transition:background .25s;}
.faq .resp{display:grid;grid-template-rows:0fr;opacity:0;padding-top:0;padding-bottom:0;transition:grid-template-rows .38s cubic-bezier(.4,0,.2,1),opacity .28s ease,padding-bottom .38s cubic-bezier(.4,0,.2,1);}
.faq .resp>*{min-height:0;}
.faq details[open] .resp{grid-template-rows:1fr;opacity:1;padding-bottom:20px;}
.faq .resp-in{overflow:hidden;}
/* Logos del footer un 20% más grandes */
.ft-col--marca .ft-logos img{height:29px;}
.ft-col--marca .ft-logos .ft-claro{height:24px;}
.ft-col--marca .ft-sep{height:26px;}

/* El alto lo gobierna .abierta, no el atributo open */
.faq details[open] .resp{grid-template-rows:0fr;opacity:0;padding-bottom:0;}
.faq details.abierta .resp,.faq details[open].abierta .resp{grid-template-rows:1fr;opacity:1;padding-bottom:20px;}
.faq details[open] summary::after{transform:translateY(-70%) rotate(45deg);}
.faq details.abierta summary::after{transform:translateY(-30%) rotate(225deg);}
.faq summary{user-select:none;}

/* Grilla de planes en anchos intermedios: dos columnas centradas */
@media(max-width:1000px){.grid{justify-content:center;}}
@media(min-width:721px) and (max-width:1000px){.grid{grid-template-columns:repeat(2,minmax(0,312px));}}
@media(max-width:720px){.grid{grid-template-columns:minmax(0,360px);}}

/* ===== Ajustes de mobile ===== */
@media(max-width:860px){
  /* Gaming: el ícono se mantiene al costado del dato */
  #gaming .metrica{grid-template-columns:auto 1fr;gap:2px 14px;padding:18px 18px;}
  #gaming .met-ico{grid-row:span 2;width:46px;height:46px;border-radius:13px;}
  #gaming .met-ico svg{width:23px;height:23px;}
  #gaming .metrica b{white-space:normal;font-size:20px;}
  #gaming .metrica span.met-txt{font-size:13.5px;}
  /* Banner de Claro Pay */
  .cpay{margin-top:28px;border-radius:18px;}
  .cpay-logo{height:38px;margin-bottom:16px;}
  .cpay-monto{margin-top:16px;padding-top:16px;}
  .cpay-monto b{font-size:40px;}
  .cpay-monto span{font-size:15px;}
  .cpay-pie{font-size:14px;}
  /* Tarjeta del plan de entrada */
  .wp-vel{font-size:36px;}
  .wp-monto .monto{font-size:36px;}
  .wp .cta{width:calc(100% - 40px);margin:18px 20px 22px;}
  .wp-feats{padding:18px 20px 0;}
  .wp-top,.wp-precio{padding-left:20px;padding-right:20px;}
  /* Bloque de apertura */
  .planes-intro .seg{width:100%;}
  .planes-intro .seg button{flex:1;padding:11px 12px;font-size:13px;}
  .bnf{gap:7px;}
  /* Títulos de sección con foto */
  .sec--foto .duo-txt{padding:22px 18px;}
  .h2-tv{font-size:clamp(21px,5.6vw,27px);}
  /* Imagen lateral */
  .duo-img{max-height:210px;}
}
@media(max-width:600px){
  .sec{padding:38px 0;}
  .sec-in{padding:0 18px;}
  .planes-logo{height:44px;margin-bottom:16px;}
  .div-fade{width:80%;margin-bottom:16px;}
  .planes-kw{font-size:21px;}
  .planes-kw-mes{font-size:13.5px;}
  .bnf li{font-size:12.5px;padding:7px 13px;}
  .faq summary{font-size:14px;padding:13px 38px 13px 15px;min-height:48px;}
  .faq .resp{padding-left:15px;padding-right:15px;font-size:13.6px;}
  .cpay-txt{padding:24px 18px;}
  .ft-cols{padding:32px 18px 26px;}
}

/* ===== Hero en mobile ===== */
@media(max-width:700px){
  /* los botones van después del ticket, no antes del título */
  .hero-inner--2col .hero-left .hero-ctas{order:4;width:100%;}
  /* la tira de oferta reemplaza al ticket de escritorio */
  .hero--internet .hero-promo{display:none !important;}
  .hero--internet .hero-offer-mob{display:flex !important;order:3;width:100%;margin-top:18px;}
}
/* Objetivo táctil del CTA del QR */
.qr-wa-cta{min-height:46px;}

/* ===== Hero mobile: título, divisor, bajada, tira de oferta y botones ===== */
@media(max-width:700px){
  .hero--internet .hero-inner--2col{display:flex;flex-direction:column;align-items:stretch;}
  .hero--internet .hero-left h1{order:1;font-size:clamp(34px,9.4vw,42px);line-height:1.02;letter-spacing:-1.4px;}
  .hero--internet .hero-inner p{order:2;position:relative;margin-top:16px !important;padding-top:18px !important;font-size:16.5px;line-height:1.35;color:rgba(255,255,255,.86);}
  .hero--internet .hero-inner p::before{content:"";position:absolute;top:0;left:0;right:0;height:1px;background:rgba(255,255,255,.4);}
  .hero--internet .hero-offer-mob{order:3;margin-top:20px !important;}
  .hero--internet .hero-left .hero-ctas{order:4;display:flex;flex-direction:column;gap:10px;margin-top:20px;width:100%;}
  .hero--internet .hero-ctas .hero-wa,.hero--internet .hero-ctas .hero-ver{width:100%;min-height:54px;justify-content:center;border-radius:100px;}
}

@media(max-width:700px){
  .hero--internet .hero-left h1{font-size:clamp(25px,7.4vw,34px);}
  .hero--internet .hero-left h1 .h1-bold{white-space:nowrap;}
}

/* Beneficios: tres pastillas en una línea */
.bnf{flex-wrap:nowrap;justify-content:center;gap:10px;max-width:none;}
.bnf li{white-space:nowrap;}
.bnf svg{stroke:var(--rojo);fill:none;stroke-width:2.4;}
@media(max-width:700px){.bnf{flex-wrap:wrap;}.bnf li{white-space:normal;}}
/* Banner Claro Pay: títulos y cifra */
.cpay-txt h3{font-size:clamp(26px,3.4vw,40px);}
.cpay-monto{align-items:baseline;}
.cpay-monto b{align-self:baseline;line-height:.82;}
.cpay-monto span{font-size:19.5px;}
/* Combo: menos aire entre los ítems de la tarjeta */
#combo .tarjeta .lista{gap:8px;}
#combo .tarjeta .lista li{font-size:14.5px;}
/* Pastilla de sección más chica */
.pill-sec{font-size:10.5px;padding:5px 12px;letter-spacing:.9px;}

/* ===== Menú hamburguesa ===== */
.lp-burger{display:none;margin-left:auto;width:46px;height:46px;border:0;background:transparent;cursor:pointer;flex-direction:column;justify-content:center;align-items:center;gap:5px;padding:0;}
.lp-burger span{display:block;width:23px;height:2.2px;background:var(--texto-fuerte);border-radius:2px;transition:transform .28s cubic-bezier(.4,0,.2,1),opacity .2s;}
.lp-burger[aria-expanded="true"] span:nth-child(1){transform:translateY(7.2px) rotate(45deg);}
.lp-burger[aria-expanded="true"] span:nth-child(2){opacity:0;}
.lp-burger[aria-expanded="true"] span:nth-child(3){transform:translateY(-7.2px) rotate(-45deg);}
@media(max-width:820px){
  .site-header .hdr-inner{flex-wrap:nowrap;align-items:center;}
  .lp-burger{display:flex;}
  .lp-nav{position:absolute;top:100%;left:0;right:0;background:#fff;border-top:1px solid var(--borde);box-shadow:0 18px 34px rgba(22,23,26,.14);flex-direction:column;align-items:stretch;justify-content:flex-start;gap:0;padding:6px 18px 18px;margin:0;width:auto;
    display:grid;grid-template-rows:0fr;opacity:0;visibility:hidden;transition:grid-template-rows .3s cubic-bezier(.4,0,.2,1),opacity .24s ease,visibility .3s;}
  .lp-nav>*{min-width:0;}
  .site-header.abierto .lp-nav{grid-template-rows:1fr;opacity:1;visibility:visible;}
  .lp-nav-in{overflow:hidden;display:flex;flex-direction:column;gap:2px;}
  .lp-nav a{display:block;padding:14px 4px;font-size:15.5px;border-bottom:1px solid rgba(45,45,45,.08);}
  .lp-nav a:last-child{border-bottom:0;}
  .lp-nav .lp-solo-desk{display:block;}
  .lp-nav a.lp-wa{justify-content:center;margin-top:12px;padding:0 18px;min-height:50px;border-bottom:0;}
  .site-header{position:relative;}
}

/* Hero con un solo CTA */
.hero-ctas{justify-content:flex-start;}
.hero-ver{background:var(--rojo);color:#fff;border-color:var(--rojo);font-size:15.5px;font-weight:800;padding:0 30px;}
.hero-ver:hover{background:#b62218;color:#fff;border-color:#b62218;}

/* Logo de Claro dentro del hero */
.hero-logo{height:38px;width:auto;display:block;margin-bottom:16px;}
/* Menos aire entre título, bajada y lo que sigue */
.hero-inner--2col .hero-left h1{margin-bottom:0;}
.hero--internet .hero-inner p{margin-top:12px;padding-top:0;}
.hero-ctas{margin-top:22px;}
@media(max-width:700px){
  .hero-logo{order:0;height:30px;margin-bottom:12px;}
  .hero--internet .hero-inner p{margin-top:12px !important;padding-top:13px !important;font-size:15.5px;}
  .hero--internet .hero-offer-mob{margin-top:16px !important;}
  .hero--internet .hero-left .hero-ctas{margin-top:16px;}
}

/* Hero más compacto */
.hero--internet .hero-inner p{margin-top:7px !important;}
.hero-ctas{margin-top:14px;}
@media(max-width:700px){
  .hero--internet .hero-inner p{margin-top:8px !important;padding-top:9px !important;}
  .hero--internet .hero-offer-mob{margin-top:11px !important;}
  .hero--internet .hero-left .hero-ctas{margin-top:11px;}
}

/* En celular, versiones livianas de las fotos de fondo */
@media(max-width:700px){
  #combo{--foto:url('uploads/v2/tv-m.webp') !important;}
  #gaming{--foto:url('uploads/v2/gaming-m.webp') !important;}
  .qr-banner{background:linear-gradient(0deg,rgba(16,17,22,.9),rgba(16,17,22,.9)),url("uploads/v2/contacto-m.webp") center 38%/cover no-repeat !important;}
}

#combo{--foto:url('uploads/v2/tv.webp');}
#gaming{--foto:url('uploads/v2/gaming.webp');}
@media(max-width:700px){#combo{--foto:url('uploads/v2/tv-m.webp');}#gaming{--foto:url('uploads/v2/gaming-m.webp');}}

/* El contenedor interno del menú hereda la separación en escritorio */
.lp-nav-in{display:flex;align-items:center;gap:22px;}
@media(max-width:820px){.lp-nav-in{flex-direction:column;align-items:stretch;gap:2px;}}

/* Grilla de planes: tres columnas también en anchos intermedios (sin tarjeta huérfana) */
@media(min-width:721px) and (max-width:1000px){
  .grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;max-width:100%;}
  .grid .card .plan-nombre .pn-vel{font-size:26px;}
  .grid .card .precio .monto{font-size:30px;}
  .grid .card .head{padding-left:16px;padding-right:16px;}
  .grid .card .features,.grid .card .foot{padding-left:16px;padding-right:16px;}
  .grid .card .feat-row{font-size:13.2px;}
  .grid .card .cta{width:100%;}
  .socio{font-size:11.5px;padding:5px 11px;}
  .feat-pill{font-size:11.5px;padding:6px 12px;}
}
@media(max-width:720px){.grid{display:flex;flex-wrap:wrap;justify-content:center;}.grid .card{width:100%;max-width:360px;}}

/* Tarjeta del combo: cabecera más compacta */
#combo .tarjeta{padding:22px;}
#combo .tarjeta-top{padding-bottom:16px;}
#combo .tarjeta-ico{width:46px;height:46px;border-radius:13px;}
#combo .tarjeta-ico svg{width:24px;height:24px;}
#combo .tarjeta-nombre{font-size:25px;margin-top:10px;}
#combo .tarjeta-linea{margin-top:1px;font-size:13px;}
#combo .tarjeta-precio{margin-top:7px;}
#combo .tarjeta-precio .monto{font-size:33px;}
#combo .tarjeta .lista{margin-top:16px !important;}

/* Título de apertura de planes: 10% más chico en desktop */
@media(min-width:861px){#planes .planes-intro h2{font-size:clamp(26px,4.14vw,41.4px);}}

/* Hero en desktop: divisor entre el titulo y la bajada, con aire a los dos lados
   (replica el tratamiento de mobile, que solo existia debajo de 700px) */
@media(min-width:701px){
  .hero--internet .hero-inner--2col .hero-left h1{margin-bottom:0;}
  .hero--internet .hero-inner--2col .hero-left p{position:relative;margin-top:26px !important;padding-top:26px;}
  .hero--internet .hero-inner--2col .hero-left p::before{content:"";position:absolute;top:0;left:0;width:100%;height:1px;background:rgba(255,255,255,.22);}
}

/* Tarjeta del combo TV HD: mas compacta en desktop (en mobile ya estaba comprimida) */
@media(min-width:701px){
  #combo .tarjeta{padding:18px 20px;}
  #combo .tarjeta-top{padding-bottom:13px;}
  #combo .tarjeta-ico{width:40px;height:40px;border-radius:11px;}
  #combo .tarjeta-ico svg{width:21px;height:21px;}
  #combo .tarjeta-nombre{font-size:22px;margin-top:8px;}
  #combo .tarjeta-linea{margin-top:1px;font-size:12.5px;}
  #combo .tarjeta-precio{margin-top:5px;}
  #combo .tarjeta-precio .monto{font-size:29px;}
  #combo .tarjeta-precio .mes{font-size:14px;}
  #combo .tarjeta .lista{margin-top:13px !important;gap:7px !important;}
  #combo .tarjeta .lista li{font-size:13.8px;line-height:1.3;}
  #combo .tarjeta .lista svg{width:18px;height:18px;}
  #combo .tarjeta .cta{margin-top:16px !important;}
}

/* Tarjeta de TV HD: etiqueta, titulo y precio con mas peso; items mas juntos */
@media(min-width:701px){
  #combo .tarjeta-nombre{font-size:26.4px;margin-top:7px;}
  #combo .tarjeta-precio .monto{font-size:33.4px;}
  #combo .tarjeta-precio .mes{font-size:16px;}
  #combo .tarjeta .lista{gap:4px !important;}
  #combo .tarjeta .lista li{line-height:1.25;}
}

/* Icono de WiFi arriba del titulo del hero */
.hero-ico{display:block;color:#fff;margin-bottom:14px;line-height:0;}
.hero-ico svg{width:34px;height:34px;display:block;}
@media(max-width:700px){.hero-ico{margin-bottom:10px;}.hero-ico svg{width:27px;height:27px;}}

/* Cabecera de la tarjeta del plan de entrada: gradiente con movimiento lento */
#wifiPlan .wp-top{background:linear-gradient(135deg,#08090b 0%,#1b1e23 40%,#34393f 68%,#101317 100%);background-size:220% 220%;background-position:0% 50%;animation:wpShift 22s ease-in-out infinite;}
@keyframes wpShift{0%{background-position:0% 50%}50%{background-position:100% 50%}100%{background-position:0% 50%}}
@media(prefers-reduced-motion:reduce){#wifiPlan .wp-top{animation:none;}}

/* Hero: tira de atributos con icono (solo desktop) */
.hero-tira{display:none;}
@media(min-width:701px){
  .hero-tira{display:flex;gap:26px;margin-top:26px;padding-top:22px;border-top:1px solid rgba(255,255,255,.22);}
  .hero-tira>div{display:flex;flex-direction:column;gap:8px;color:#fff;}
  .hero-tira svg{width:26px;height:26px;stroke:#fff;fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;}
  .hero-tira b{font-size:12.5px;font-weight:700;letter-spacing:.1px;line-height:1.15;}
  .hero-tira i{font-style:normal;font-size:11.5px;color:rgba(255,255,255,.62);font-weight:500;line-height:1.15;}
  .hero--internet .hero-inner--2col .hero-left .hero-ctas{margin-top:26px;}
}
@media(min-width:701px) and (max-width:1000px){.hero-tira{gap:18px;}.hero-tira b{font-size:11.8px;}.hero-tira i{font-size:11px;}}

/* Hero: divisor de arriba igual al de la tira, y "Ver planes" junto al 1 MES GRATIS */
.hero-ver--stub{display:none;}
@media(min-width:701px){
  .hero--internet .hero-inner--2col .hero-left .hero-ctas{display:none;}
  .hero-promo .ticket-stub{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:14px;padding:15px 16px;text-align:center;}
  .ticket-stub .stub-txt{display:flex;flex-direction:column;gap:2px;align-items:center;}
  .hero-ver--stub{display:inline-flex;justify-self:center;min-height:42px;padding:0 18px;font-size:13.5px;font-weight:800;}
  .hero-ver--stub svg{width:15px;height:15px;}
}

/* Mobile: H1 del hero un 10% mas grande */
@media(max-width:700px){.hero--internet .hero-left h1{font-size:clamp(27.5px,8.14vw,37.4px);}}

/* Mobile: las tarjetas de planes toman su alto real.
   En flex con align-items:end, el height:100% se resolvia contra el alto de
   toda la columna y las tarjetas se desbordaban sobre las secciones de abajo. */
@media(max-width:720px){
  .content{align-items:flex-start;}
  .grid{align-items:flex-start;}
  .grid .card{height:auto;align-self:auto;}
}

/* Encabezado en el celular: Claro | Lucom, más chicos que antes (Lucom 25 → 16 px, Claro 24 px).
   En la computadora queda solo Lucom, como estaba. (Tomás, 14-oct-2026) */
.hdr-mob-claro,.hdr-mob-sep{display:none;}
@media(max-width:700px){
  .site-header .hdr-home{gap:9px !important;}
  .hdr-mob-claro{display:block;height:24px;width:auto;}
  .hdr-mob-sep{display:block;width:1px;height:18px;background:rgba(45,45,45,.22);}
  .site-header .hdr-logo{height:16px !important;}
}

/* La línea de precios bajo "Planes de…" ahora es más larga (textos por grupo de anuncios,
   14-oct-2026): corta en renglones parejos y centrados en vez de seguir en uno solo. */
.planes-kw-row .planes-kw-mes{white-space:normal;text-wrap:balance;text-align:center;max-width:62ch;margin:0 auto;}

/* ===== 20-oct-2026: mejoras por el informe de Clarity (mejoras-clarity-2026-10-20.py) ===== */
/* WhatsApp como botón principal de la portada (usa .hero-wa, el mismo botón verde de la
   sección de gaming); «Ver planes» queda como secundario. */
.hero-ver.hero-ver--sec{background:transparent !important;color:#fff !important;border-color:rgba(255,255,255,.45) !important;}
@media (max-width:700px){
  .hero-ctas .hero-ver--sec{min-height:46px;}
}
/* La tarjeta de precio de la portada abre WhatsApp con ese plan. */
a.hero-offer-mob,a.ticket-body{color:inherit;text-decoration:none;cursor:pointer;-webkit-tap-highlight-color:transparent;}
a.hero-offer-mob:active,a.ticket-body:active{transform:scale(.99);}
a.ticket-body:hover{background:rgba(0,0,0,.02);}

/* Encabezado en el celular: solo el logo de Claro, sin Lucom/TCell ni la barra (Tomás, 20-oct-2026). */
@media(max-width:700px){
  .site-header .hdr-logo,.site-header .hdr-mob-sep{display:none !important;}
}

/* Celular: logo de Claro del encabezado un 10 % más grande (24 → 26,4 px) y pastilla blanca de la
   portada un 10 % más alta (67 → 74 px) con una línea roja abajo del 5 % de su alto (Tomás, 31-oct-2026). */
@media(max-width:700px){
  .hdr-mob-claro{height:26.4px;}
  .hero--internet .hero-offer-mob{padding-top:15.5px;padding-bottom:15.5px;box-shadow:inset 0 -3.7px 0 var(--rojo),0 14px 30px rgba(0,0,0,.28);}
}

/* Velocidad (31-oct-2026): las secciones de abajo no se dibujan hasta que se acercan a la pantalla.
   Lighthouse medía casi 1,5 s de estilo y dibujo en el celular. Planes queda afuera: es la que se ve al tocar «Ver planes». */
.sec:not(#planes),.qr-banner-wrap{content-visibility:auto;contain-intrinsic-size:auto 900px;}

/* ================= Portada nueva del celular (31-oct-2026) =================
   Propuestas elegidas por Tomás (artifact «Portadas Lucom Internet»): una por página.
   Solo en el celular: sin encabezado, logo de Claro arriba del título, un solo botón grande.
   En la computadora no se ve y queda la portada de siempre. Medidas en cqw (100cqw = ancho del celular). */
.hx{display:none;}
@media(max-width:700px){
  body.con-hx .site-header,body.con-hx .hero{display:none !important;}
  .hx{display:block;position:relative;overflow:hidden;container-type:inline-size;height:100svh;min-height:178vw;max-height:225vw;background:#000;font-family:var(--satoshi);}
  .hx-foto{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;}
  .hx-logo{position:absolute;left:6.25cqw;top:6.25cqw;height:8.03cqw;width:auto;}
  .hx-arriba{position:absolute;left:6.25cqw;right:6.25cqw;top:25cqw;color:#fff;}
  .hx-abajo{position:absolute;left:6.25cqw;right:6.25cqw;bottom:7cqw;color:#fff;display:flex;flex-direction:column;gap:3.6cqw;}
  .hx-tit{font-size:9.4cqw;line-height:1.02;letter-spacing:-.03em;margin:0;text-wrap:balance;}
  .hx-tit b{font-weight:900;display:block;}
  .hx-tit span{font-weight:300;display:block;}
  .hx-bajada{font-size:4.1cqw;line-height:1.35;margin:2.6cqw 0 0;font-weight:500;}
  .hx-btn{display:flex;align-items:center;justify-content:center;gap:2.6cqw;width:100%;height:16.6cqw;border-radius:100px;border:0;font:800 4.9cqw/1 var(--satoshi);letter-spacing:-.01em;cursor:pointer;text-decoration:none;}
  .hx-btn svg{width:6.2cqw;height:6.2cqw;flex:none;}
  .hx-btn--blanco{background:#fff;color:#16171a;}
  .hx-btn--blanco svg{color:var(--rojo);}
  .hx-btn--negro{background:#16171a;color:#fff;}
  .hx-btn--rojo{background:var(--rojo);color:#fff;}
  .hx-legal{font-size:2.9cqw;opacity:.8;text-align:center;margin:0;}
  .hx-precio{font-weight:900;letter-spacing:-.04em;font-variant-numeric:tabular-nums;line-height:1;}
  .hx-precio small{font-size:.42em;font-weight:600;letter-spacing:0;}
  .hx-chip{align-self:flex-start;display:inline-flex;align-items:center;background:var(--rojo);color:#fff;font-weight:800;font-size:3.3cqw;letter-spacing:.04em;padding:1.6cqw 3.1cqw;border-radius:100px;text-transform:uppercase;}
  .hx-velo{position:absolute;inset:0;}

  /* 1 · Fotos que pasan */
  .hx--p1 .hx-slide{opacity:0;transition:opacity 1.2s ease;}
  .hx--p1 .hx-slide.on{opacity:1;}
  .hx--p1 .hx-velo{background:linear-gradient(180deg,rgba(0,0,0,.62) 0%,rgba(0,0,0,.05) 38%,rgba(0,0,0,.1) 52%,rgba(0,0,0,.86) 74%,#000 100%);}
  .hx--p1 .hx-fila{display:flex;align-items:flex-end;justify-content:space-between;gap:3cqw;}
  .hx--p1 .hx-precio{font-size:14cqw;}
  .hx--p1 .hx-megas{font-size:3.6cqw;font-weight:600;text-align:right;line-height:1.3;}
  .hx--p1 .hx-megas b{font-size:7.2cqw;font-weight:900;display:block;line-height:1;}
  .hx-puntos{position:absolute;top:8.4cqw;right:6.25cqw;display:flex;gap:1.6cqw;}
  .hx-puntos i{width:1.8cqw;height:1.8cqw;border-radius:50%;background:rgba(255,255,255,.4);transition:width .3s;}
  .hx-puntos i.on{background:#fff;width:5cqw;border-radius:2cqw;}

  /* 2 · Rojo pleno, como la placa M */
  .hx--p2{background:var(--rojo);}
  .hx--p2 .hx-arriba{top:24cqw;}
  .hx--p2 .hx-velo{inset:auto 0 0 0;height:55%;background:linear-gradient(180deg,rgba(181,34,23,0) 0%,rgba(181,34,23,.85) 45%,#B52217 100%);}
  .hx-tarjeta{position:absolute;left:5cqw;background:#fff;color:#16171a;border-radius:3.6cqw;padding:2cqw 3cqw;font-size:3.3cqw;font-weight:800;display:flex;align-items:center;gap:2cqw;box-shadow:0 3cqw 7cqw rgba(0,0,0,.25);}
  .hx-tarjeta svg{width:4.6cqw;height:4.6cqw;color:var(--rojo);flex:none;}
  .hx-t1{top:58cqw;}.hx-t2{top:69cqw;}.hx-t3{top:80cqw;}
  .hx--p2 .hx-abajo{gap:3cqw;}
  .hx--p2 .hx-precio{font-size:15cqw;}

  /* 4 · Planes: igual que Hogar pero sobre fondo claro (Tomás, 31-oct: sin los cuadros de velocidad) */
  .hx--p4{background:#EDEDED;}
  .hx--p4 .hx-velo{background:linear-gradient(180deg,rgba(237,237,237,.85) 0%,rgba(237,237,237,0) 30%,rgba(237,237,237,0) 55%,rgba(237,237,237,.94) 74%,#EDEDED 100%);}
  .hx--p4 .hx-arriba,.hx--p4 .hx-abajo{color:#16171a;}
  .hx--p4 .hx-tit span{font-size:7.6cqw;white-space:nowrap;margin-top:1cqw;}
  .hx--p4 .hx-legal{color:#444;opacity:1;}
  .hx--p4 .hx-foto{transform:scale(1.18);transform-origin:50% 0;}
  .hx--p4 .hx-fila,.hx--p5 .hx-fila,.hx--p2 .hx-fila{display:flex;align-items:flex-end;justify-content:space-between;gap:3cqw;}
  .hx--p4 .hx-precio{font-size:14cqw;}
  .hx--p4 .hx-megas,.hx--p5 .hx-megas,.hx--p2 .hx-megas{font-size:3.6cqw;font-weight:600;text-align:right;line-height:1.3;}
  .hx--p4 .hx-megas b,.hx--p5 .hx-megas b,.hx--p2 .hx-megas b{font-size:7.2cqw;font-weight:900;display:block;line-height:1;}

  /* 5 · Institucional, estilo Apple */
  .hx--p5{background:#EDEDED;}
  .hx--p5 .hx-foto{transform:scale(1.24);transform-origin:50% 0;}
  .hx--p5 .hx-arriba{color:#16171a;}
  .hx--p5 .hx-tit b{font-size:11cqw;}
  .hx--p5 .hx-velo{inset:auto 0 0 0;height:40%;background:linear-gradient(180deg,rgba(237,237,237,0) 0%,rgba(237,237,237,.92) 45%,#EDEDED 100%);}
  .hx--p5 .hx-abajo{color:#16171a;gap:3cqw;}
  .hx-linea{display:flex;flex-direction:column;align-items:flex-start;gap:1.6cqw;}
  .hx-linea .hx-precio{font-size:14cqw;}
  .hx-gratis{font-size:3.5cqw;font-weight:800;color:var(--rojo);text-transform:uppercase;letter-spacing:.04em;}
  .hx-link{text-align:center;color:#16171a;font-weight:700;font-size:3.8cqw;text-decoration:none;}
}
@media(max-width:700px) and (prefers-reduced-motion:reduce){.hx--p1 .hx-slide{transition:none;}}
/* El botón flotante de WhatsApp tapaba el botón de la portada nueva: aparece al pasarla. */
@media(max-width:700px){body.con-hx .wsp-float{transition:opacity .3s;}body.con-hx:not(.hx-fuera) .wsp-float{opacity:0;pointer-events:none;}}
/* Menú sutil en la portada nueva, donde van los puntos de las fotos (Tomás, 31-oct). */
.hx-menu{display:none;}
@media(max-width:700px){
  .hx-menu{display:flex;flex-direction:column;justify-content:center;gap:1.3cqw;position:absolute;top:5.2cqw;right:4.2cqw;width:10cqw;height:10cqw;padding:0 2.2cqw;border:0;background:transparent;cursor:pointer;opacity:.85;}
  .hx-menu span{display:block;height:2px;border-radius:2px;background:#fff;}
  .hx-menu span:nth-child(2){width:70%;margin-left:auto;}
  .hx--p4 .hx-menu span,.hx--p5 .hx-menu span{background:#16171a;}
  .hx-puntos{right:16cqw;top:9.3cqw;}
  body.con-hx.hx-menu-abierto .site-header{display:block !important;position:fixed;top:0;left:0;right:0;z-index:1000;}
}
/* 2.ª vuelta (31-oct): «Ver más planes ↓» abajo de todo y una sola aclaración del descuento que no excluye. */
@media(max-width:700px){
  .hx-abajo{bottom:4.5cqw;gap:3cqw;}
  .hx-link{display:flex;justify-content:center;align-items:center;gap:1.4cqw;color:#fff;font-weight:700;font-size:3.8cqw;text-decoration:none;margin-top:-.6cqw;}
  .hx-link span{font-size:4.4cqw;line-height:1;animation:hxBaja 1.8s ease-in-out infinite;}
  .hx--p4 .hx-link,.hx--p5 .hx-link{color:#16171a;}
  .hx-legal{font-size:2.9cqw;}
  .hx-legal [data-hx-base]{font-weight:700;}
}
@keyframes hxBaja{0%,100%{transform:translateY(0)}50%{transform:translateY(.9cqw)}}
@media(max-width:700px) and (prefers-reduced-motion:reduce){.hx-link span{animation:none;}}
/* Megas en recuadro (Tomás, 31-oct): el número sobre transparencia con borde y «megas» en una franja blanca.
   Sobre los fondos claros (Planes, Fibra) la franja va oscura para que se vea. */
@media(max-width:700px){
  .hx .hx-megas{display:inline-flex;flex-direction:column;align-items:stretch;text-align:center;border:1.5px solid #fff;border-radius:2.6cqw;overflow:hidden;line-height:1;flex:none;margin-bottom:1.2cqw;}
  .hx .hx-megas b{display:block;font-size:7.4cqw;font-weight:900;padding:1.6cqw 3.2cqw 1.2cqw;color:#fff;letter-spacing:-.02em;}
  .hx .hx-megas span{display:block;background:#fff;color:#16171a;font-size:2.9cqw;font-weight:800;text-transform:uppercase;letter-spacing:.06em;padding:1cqw 2cqw 1.1cqw;white-space:nowrap;}
  .hx--p4 .hx-megas,.hx--p5 .hx-megas{border-color:#16171a;}
  .hx--p4 .hx-megas b,.hx--p5 .hx-megas b{color:#16171a;}
  .hx--p4 .hx-megas span,.hx--p5 .hx-megas span{background:#16171a;color:#fff;}
}
@media(max-width:700px){
  .hx .hx-fila .hx-precio{font-size:13cqw;white-space:nowrap;}
  .hx .hx-fila{gap:2cqw;}
  .hx .hx-megas span{letter-spacing:.03em;}
}
/* Ajustes de foto (31-oct): en Fibra el logo del módem queda a la vista arriba del precio;
   en Planes la persona baja un poco más para que el texto no le pise el pelo (sin dejar franja arriba). */
@media(max-width:700px){
  /* La foto baja un 6 % y el fondo toma el gris de su borde de arriba, así no queda franja. */
  .hx--p5{background:#E0E0E2;}
  .hx--p5 .hx-foto{transform:translateY(6%);-webkit-mask-image:linear-gradient(180deg,transparent 0,#000 5%);mask-image:linear-gradient(180deg,transparent 0,#000 5%);}
  .hx--p5 .hx-arriba{top:22cqw;}
  .hx--p5 .hx-velo{height:30%;}
  /* Cada foto de la prueba A/B con su propio encuadre: él tiene la cabeza más arriba que ella. */
  .hx--p4 .hx-foto{transform:scale(1.1);transform-origin:50% 0;}
  .hx--p4 .hx-foto.hx-ab-A{transform:scale(1.2);}
}
/* Celulares más bajos (pantalla de menos de 720 px de alto): la foto de Planes baja un poco más. */
@media(max-width:700px) and (max-height:720px){
  .hx--p4 .hx-foto{transform:scale(1.2);}
  .hx--p4 .hx-foto.hx-ab-A{transform:scale(1.3);}
}
/* Fibra (31-oct, 3.ª vuelta): el logo de Claro se movió más arriba dentro de la misma foto (no va superpuesto).
   La foto achica un poco desde abajo en los celulares más bajos para que la chica no toque el título. */
@media(max-width:700px) and (max-height:800px){
  .hx--p5 .hx-foto{transform-origin:50% 100%;transform:translateY(3.5%) scale(.9);}
}
@media(max-width:700px) and (max-height:700px){
  .hx--p5 .hx-foto{transform:translateY(3.5%) scale(.86);}
}