/* Ver-IA · hoja de estilos compartida */
:root{
  --tinta:#16130E;
  --tinta-suave:#4A423A;
  --papel:#F7F4EE;
  --papel-hueso:#EDE8DE;
  --ambar:#FE7E01;
  --ambar-hondo:#AE5400;
  --linea:#DCD5C7;
  --verde-msj:#1F3A2E;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  background:var(--papel);
  color:var(--tinta);
  font-family:'DM Sans',system-ui,sans-serif;
  font-size:17px;
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
}
.envoltura{max-width:1120px;margin:0 auto;padding:0 24px}
a{color:inherit}
a:focus-visible,.boton:focus-visible,.menu-boton:focus-visible{outline:2.5px solid var(--ambar-hondo);outline-offset:3px;border-radius:4px}

/* ---------- barra ---------- */
.barra{
  position:sticky;top:0;z-index:50;
  background:rgba(10,9,7,.94);
  backdrop-filter:blur(10px);
  border-bottom:1px solid rgba(247,244,238,.14);
}
.barra-int{display:flex;align-items:center;justify-content:space-between;height:68px;gap:16px}
.marca{display:flex;align-items:center;gap:11px;font-weight:700;letter-spacing:-.015em;font-size:19px;text-decoration:none;color:var(--papel)}
.marca-ojo{height:30px;width:auto;flex:none;display:block}
.barra-vinculos{display:flex;align-items:center;gap:28px}
.barra-vinculos a{font-size:15px;text-decoration:none;color:rgba(247,244,238,.72)}
.barra-vinculos a:hover,.barra-vinculos a[aria-current="page"]{color:var(--papel)}
.barra .boton-mini{
  background:var(--ambar);color:#140F08;
  padding:9px 18px;border-radius:999px;font-size:14px;font-weight:500;text-decoration:none;
}
.barra .boton-mini:hover{background:#FF9633}
.menu-boton{
  display:none;align-items:center;justify-content:center;
  width:44px;height:44px;border:none;border-radius:10px;
  background:transparent;color:var(--papel);cursor:pointer;
}
@media(max-width:760px){
  .menu-boton{display:inline-flex}
  .barra-vinculos{
    position:absolute;top:68px;left:0;right:0;display:none;
    flex-direction:column;align-items:stretch;gap:2px;
    background:rgba(10,9,7,.97);padding:10px 24px 24px;
    border-bottom:1px solid rgba(247,244,238,.14);
  }
  .barra-vinculos.abierta{display:flex}
  .barra-vinculos a{font-size:17px;padding:13px 0}
  .barra-vinculos .boton-mini{margin-top:12px;text-align:center;padding:13px 18px;font-size:15px}
}

/* ---------- portada ---------- */
.portada{padding:76px 0 88px}
.portada-red{display:grid;grid-template-columns:1.05fr .95fr;gap:64px;align-items:center}
.rotulo{
  font-family:'DM Mono',monospace;font-size:12px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--ambar-hondo);margin-bottom:22px;
}
h1{
  font-size:clamp(38px,5.2vw,60px);line-height:1.04;letter-spacing:-.034em;
  font-weight:700;margin-bottom:24px;
}
h1 em{font-style:normal;color:var(--ambar-hondo)}
.bajada{font-size:19px;color:var(--tinta-suave);max-width:40ch;margin-bottom:34px}
.acciones{display:flex;gap:12px;flex-wrap:wrap}
.boton{
  display:inline-flex;align-items:center;gap:9px;
  padding:14px 26px;border-radius:999px;
  font-size:16px;font-weight:500;text-decoration:none;
  border:1.5px solid transparent;transition:transform .15s ease,background .15s ease;
}
.boton:active{transform:translateY(1px)}
.boton-lleno{background:var(--tinta);color:var(--papel)}
.boton-lleno:hover{background:var(--ambar-hondo);color:#fff}
.boton-linea{border-color:var(--tinta);color:var(--tinta)}
.boton-linea:hover{background:var(--tinta);color:var(--papel)}
.nota-portada{
  font-family:'DM Mono',monospace;font-size:12.5px;color:var(--tinta-suave);
  margin-top:22px;letter-spacing:.01em;
}
@media(max-width:900px){
  .portada-red{grid-template-columns:1fr;gap:44px}
  .portada{padding:52px 0 64px}
}

/* ---------- panel de mensajes (elemento firma) ---------- */
.telefono{
  background:var(--tinta);border-radius:22px;padding:20px 18px 24px;
  box-shadow:0 24px 60px -28px rgba(22,19,14,.55);
}
.telefono-cabeza{
  display:flex;align-items:center;gap:10px;
  padding-bottom:14px;border-bottom:1px solid rgba(247,244,238,.12);margin-bottom:16px;
}
.telefono-punto{width:9px;height:9px;border-radius:50%;background:var(--ambar)}
.telefono-titulo{color:var(--papel);font-size:14px;font-weight:500}
.telefono-sub{
  font-family:'DM Mono',monospace;font-size:11px;
  color:rgba(247,244,238,.45);margin-left:auto;
}
.msj{
  background:var(--verde-msj);border-radius:14px 14px 14px 4px;
  padding:13px 15px;margin-bottom:10px;
  color:#E9EEEA;font-size:14.5px;line-height:1.5;
  opacity:0;transform:translateY(10px);
  animation:entra .5s ease forwards;
}
.msj:nth-child(2){animation-delay:.25s}
.msj:nth-child(3){animation-delay:.75s}
.msj:nth-child(4){animation-delay:1.25s}
.msj b{color:var(--ambar);font-weight:500}
.msj-hora{
  display:block;font-family:'DM Mono',monospace;font-size:10.5px;
  color:rgba(233,238,234,.45);margin-top:7px;
}
.msj-dato{font-family:'DM Mono',monospace;font-size:13.5px}
@keyframes entra{to{opacity:1;transform:translateY(0)}}
@media(prefers-reduced-motion:reduce){
  .msj{animation:none;opacity:1;transform:none}
}

/* ---------- secciones ---------- */
.seccion{padding:84px 0;border-top:1px solid var(--linea)}
.seccion-tono{background:var(--papel-hueso)}
.encabezado{max-width:56ch;margin-bottom:48px}
h2{font-size:clamp(28px,3.4vw,38px);letter-spacing:-.028em;line-height:1.12;margin-bottom:14px}
.encabezado p{color:var(--tinta-suave);font-size:18px}

.trio{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
@media(max-width:900px){.trio{grid-template-columns:1fr;gap:20px;max-width:560px}}
.carta{
  background:var(--papel);border:1px solid var(--linea);
  border-radius:16px;padding:28px 26px;
}
.carta-etiqueta{
  font-family:'DM Mono',monospace;font-size:11px;letter-spacing:.12em;
  text-transform:uppercase;color:var(--ambar-hondo);margin-bottom:14px;
}
.carta h3{font-size:20px;letter-spacing:-.018em;margin-bottom:10px}
.carta p{color:var(--tinta-suave);font-size:15.5px}

/* ---------- tabla de planes ---------- */
.nota-iva{font-family:'DM Mono',monospace;font-size:12.5px;letter-spacing:.02em;color:var(--tinta-suave);margin-bottom:16px}
.tp{display:grid;grid-template-columns:1.3fr 1fr 1fr 1fr;background:var(--papel);border:1px solid var(--linea);border-radius:18px;overflow:hidden}
.tp>*{padding:13px 20px;border-bottom:1px solid var(--linea);min-width:0}
.tp>*:nth-last-child(-n+4){border-bottom:none}
.tp-plan{border-left:1px solid var(--linea);padding:30px 20px 22px;position:relative}
.tp-plan-nombre{font-size:15px;font-weight:500;color:var(--tinta-suave);margin-bottom:10px}
.tp-precio{font-size:31px;font-weight:700;letter-spacing:-.035em;line-height:1;display:flex;align-items:baseline;gap:8px;flex-wrap:wrap}
.tp-iva-tag{font-family:'DM Mono',monospace;font-size:11px;letter-spacing:.05em;color:var(--ambar-hondo);font-weight:400}
.tp-con-iva{font-family:'DM Mono',monospace;font-size:12px;color:var(--tinta-suave);margin-top:8px}
.tp-cinta{
  position:absolute;top:0;left:20px;
  background:var(--ambar);color:var(--tinta);
  font-family:'DM Mono',monospace;font-size:10.5px;letter-spacing:.1em;
  text-transform:uppercase;padding:4px 11px;border-radius:0 0 8px 8px;
}
.tp-grupo{
  grid-column:1/-1;font-family:'DM Mono',monospace;font-size:11px;letter-spacing:.12em;
  text-transform:uppercase;color:var(--ambar-hondo);background:var(--papel-hueso);padding:10px 20px;
}
.tp-rot{font-size:14.5px;color:var(--tinta-suave);display:flex;align-items:center}
.tp-c{border-left:1px solid var(--linea);font-family:'DM Mono',monospace;font-size:13px;line-height:1.5;display:flex;align-items:center}
.tp-c .mini{display:none}
.tp-no{color:#B9AE9B}
.tp-si{color:var(--ambar-hondo);font-weight:500}
.tp-destaca-2 .c2{background:rgba(254,126,1,.05)}
@media(max-width:860px){
  .tp{display:flex;flex-direction:column;background:transparent;border:none;border-radius:0;overflow:visible}
  .tp>*{order:var(--o);border:1px solid var(--linea);border-top:none;border-bottom:1px solid var(--linea);background:var(--papel)}
  .tp-corner,.tp-rot,.tp-grupo{display:none}
  .tp-plan{border-top:1px solid var(--linea);border-radius:18px 18px 0 0;margin-top:26px;padding:30px 22px 20px}
  .tp-c{justify-content:space-between;gap:18px;padding:12px 22px}
  .tp-c .mini{display:block;font-family:'DM Mono',monospace;font-size:10.5px;letter-spacing:.09em;text-transform:uppercase;color:var(--tinta-suave)}
  .tp-c .val{text-align:right}
  .tp-c.fin{border-radius:0 0 18px 18px}
}
.sub-planes{font-size:21px;letter-spacing:-.02em;margin:56px 0 10px}
.tabla-simple{width:100%;max-width:780px;border-collapse:collapse;font-size:15px}
.tabla-simple th{
  text-align:left;font-family:'DM Mono',monospace;font-size:11px;letter-spacing:.1em;
  text-transform:uppercase;color:var(--ambar-hondo);font-weight:400;
  padding:0 14px 10px 0;border-bottom:1px solid var(--linea);
}
.tabla-simple td{padding:11px 14px 11px 0;border-bottom:1px solid var(--linea);color:var(--tinta-suave);vertical-align:top}
.tabla-simple td+td{font-family:'DM Mono',monospace;font-size:13.5px;color:var(--tinta)}
.tabla-simple td:last-child{color:var(--tinta-suave)}
.dos-col{display:grid;grid-template-columns:1fr 1fr;gap:22px;margin-top:36px;max-width:920px}
@media(max-width:860px){.dos-col{grid-template-columns:1fr}}
.pie-planes{
  font-family:'DM Mono',monospace;font-size:12.5px;color:var(--tinta-suave);
  margin-top:26px;
}

/* ---------- pasos / puntos numerados ---------- */
.pasos{display:grid;grid-template-columns:repeat(3,1fr);gap:32px;counter-reset:paso}
@media(max-width:860px){.pasos{grid-template-columns:1fr;gap:26px}}
.paso{counter-increment:paso}
.paso::before{
  content:counter(paso,decimal-leading-zero);
  display:block;font-family:'DM Mono',monospace;font-size:13px;
  color:var(--ambar-hondo);margin-bottom:12px;
}
.paso h3{font-size:18px;margin-bottom:8px;letter-spacing:-.015em}
.paso p{color:var(--tinta-suave);font-size:15.5px}

/* ---------- puente a infraestructura ---------- */
.puente-red{
  display:grid;grid-template-columns:1.15fr auto;gap:48px;align-items:center;
}
@media(max-width:860px){.puente-red{grid-template-columns:1fr;gap:28px}}
.puente-red p{color:var(--tinta-suave);font-size:18px;max-width:52ch}

/* ---------- cierre ---------- */
.cierre{background:var(--tinta);color:var(--papel);padding:84px 0}
.cierre h2{color:var(--papel);max-width:22ch}
.cierre p{color:rgba(247,244,238,.65);font-size:18px;max-width:46ch;margin:14px 0 32px}
.cierre .boton-lleno{background:var(--ambar);color:var(--tinta)}
.cierre .boton-lleno:hover{background:#FF9633}
.cierre .boton-linea{border-color:rgba(247,244,238,.4);color:var(--papel)}
.cierre .boton-linea:hover{background:var(--papel);color:var(--tinta)}
.cierre-red{display:grid;grid-template-columns:1.1fr .9fr;gap:64px;align-items:center}
@media(max-width:860px){.cierre-red{grid-template-columns:1fr;gap:44px}}
.ficha{list-style:none;margin:0;padding:0;border-top:1px solid rgba(247,244,238,.18)}
.ficha li{
  display:flex;justify-content:space-between;align-items:baseline;gap:20px;
  padding:15px 0;border-bottom:1px solid rgba(247,244,238,.18);
}
.ficha-rot{
  font-family:'DM Mono',monospace;font-size:11px;letter-spacing:.12em;
  text-transform:uppercase;color:rgba(247,244,238,.5);flex:none;
}
.ficha a,.ficha span:last-child{color:var(--papel);font-size:15.5px;text-decoration:none;text-align:right}
.ficha a:hover{color:var(--ambar)}

/* ---------- pie ---------- */
.pie{background:var(--tinta);color:rgba(247,244,238,.5);padding:30px 0 40px;border-top:1px solid rgba(247,244,238,.12)}
.pie-red{display:flex;justify-content:space-between;align-items:center;gap:24px;flex-wrap:wrap}
.pie-logo{height:38px;width:auto;display:block}
.pie a{color:rgba(247,244,238,.82);text-decoration:none}
.pie a:hover{color:var(--ambar)}
.pie-legal{font-family:'DM Mono',monospace;font-size:12px;letter-spacing:.01em;line-height:1.9}

/* ---------- páginas legales ---------- */
.legal{max-width:76ch;padding:64px 0 88px}
.legal .rotulo{margin-bottom:16px}
.legal h1{font-size:clamp(32px,4vw,44px);margin-bottom:10px}
.legal .fecha{font-family:'DM Mono',monospace;font-size:12.5px;color:var(--tinta-suave);margin-bottom:44px}
.legal h2{font-size:22px;margin:44px 0 12px;letter-spacing:-.02em}
.legal h3{font-size:17px;margin:26px 0 8px;letter-spacing:-.015em}
.legal p{color:var(--tinta-suave);font-size:16px;margin-bottom:14px}
.legal ul{color:var(--tinta-suave);font-size:16px;margin:0 0 16px;padding-left:20px}
.legal li{margin-bottom:9px}
.legal strong{color:var(--tinta);font-weight:500}
.legal a{color:var(--ambar-hondo)}
.legal .destacado{
  background:var(--papel-hueso);border-left:3px solid var(--ambar);
  padding:18px 22px;border-radius:0 10px 10px 0;margin:26px 0;
}
.legal .destacado p{margin-bottom:0;color:var(--tinta)}
.legal .volver{
  display:inline-flex;align-items:center;gap:8px;margin-top:52px;
  font-size:15px;text-decoration:none;color:var(--tinta-suave);
}
.legal .volver:hover{color:var(--ambar-hondo)}
.legal table{width:100%;border-collapse:collapse;margin:18px 0 24px;font-size:15px}
.legal th{
  text-align:left;font-family:'DM Mono',monospace;font-size:11px;letter-spacing:.1em;
  text-transform:uppercase;color:var(--ambar-hondo);font-weight:400;
  padding:0 14px 10px 0;border-bottom:1px solid var(--linea);
}
.legal td{padding:12px 14px 12px 0;border-bottom:1px solid var(--linea);color:var(--tinta-suave);vertical-align:top}

/* ================= INFRAESTRUCTURA ================= */

.ico{width:26px;height:26px;flex:none;color:var(--ambar-hondo)}
.ico *{fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}

/* siete frentes */
.frentes{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));
  gap:14px;margin-bottom:44px;
}
.frente{
  background:var(--papel);border:1px solid var(--linea);border-radius:14px;
  padding:20px 18px;display:flex;flex-direction:column;gap:14px;
  font-size:14.5px;font-weight:500;line-height:1.3;
}
.gancho{
  font-size:clamp(22px,2.8vw,30px);letter-spacing:-.024em;line-height:1.22;
  font-weight:700;max-width:34ch;
}
.gancho em{font-style:normal;color:var(--ambar-hondo)}

/* canales cero fricción */
.canales{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
@media(max-width:1000px){.canales{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.canales{grid-template-columns:1fr}}
.canal{
  background:var(--papel);border:1px solid var(--linea);border-radius:16px;
  padding:26px 24px;display:flex;flex-direction:column;gap:14px;
}
.canal h3{font-size:18px;letter-spacing:-.015em}
.canal p{color:var(--tinta-suave);font-size:15px}
.cierre-canales{
  font-family:'DM Mono',monospace;font-size:13px;color:var(--tinta-suave);
  letter-spacing:.02em;margin-top:30px;
}

/* cifras del catálogo */
.cifras{
  display:flex;gap:48px;flex-wrap:wrap;align-items:flex-end;
  background:var(--papel-hueso);border:1px solid var(--linea);border-radius:16px;
  padding:28px 32px;margin-bottom:24px;
}
.cifra-num{font-family:'DM Mono',monospace;font-size:38px;font-weight:500;line-height:1;letter-spacing:-.02em}
.cifra-rot{
  font-family:'DM Mono',monospace;font-size:11px;letter-spacing:.12em;
  text-transform:uppercase;color:var(--tinta-suave);margin-top:8px;
}

/* franjas de categoría */
.categoria{padding:36px 0 42px;border-top:1px solid var(--linea)}
.categoria-cabeza{display:flex;align-items:baseline;gap:16px;margin-bottom:24px;flex-wrap:wrap}
.categoria-num{font-family:'DM Mono',monospace;font-size:13px;color:var(--ambar-hondo)}
.categoria-cabeza h3{font-size:21px;letter-spacing:-.02em}
.categoria-cuenta{
  margin-left:auto;font-family:'DM Mono',monospace;font-size:11.5px;
  letter-spacing:.08em;text-transform:uppercase;color:var(--tinta-suave);
}
.agentes{display:grid;grid-template-columns:repeat(auto-fill,minmax(245px,1fr));gap:16px}
.agente{
  background:var(--papel);border:1px solid var(--linea);border-radius:14px;
  padding:22px 20px;display:flex;flex-direction:column;gap:12px;
}
.seccion-tono .agente,.seccion-tono .frente{background:var(--papel)}
.agente h4{font-size:16.5px;letter-spacing:-.012em;font-weight:700}
.agente p{color:var(--tinta-suave);font-size:14.5px}

/* fases de implementación */
.fases{
  list-style:none;display:grid;grid-template-columns:repeat(4,1fr);
  gap:32px;position:relative;padding-top:30px;
}
.fases::before{
  content:"";position:absolute;top:5px;left:7px;right:7px;height:2px;
  background:var(--linea);
}
.fase{position:relative}
.fase::before{
  content:"";position:absolute;top:-30px;left:0;
  width:12px;height:12px;border-radius:50%;
  background:var(--ambar);outline:3px solid var(--papel-hueso);
}
.fase-num{font-family:'DM Mono',monospace;font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--ambar-hondo);margin-bottom:8px}
.fase h3{font-size:17.5px;letter-spacing:-.015em;margin-bottom:8px}
.fase-agentes{font-family:'DM Mono',monospace;font-size:12.5px;line-height:1.8;color:var(--tinta-suave)}
@media(max-width:860px){
  .fases{grid-template-columns:1fr;gap:34px;padding-top:0;padding-left:30px}
  .fases::before{top:8px;bottom:8px;left:5px;right:auto;width:2px;height:auto}
  .fase::before{top:5px;left:-30px}
}
