/* ==========================================================================
   components.css · bloques de contenido
   Compartidos entre index.html (diapositivas) y las páginas interiores
   ========================================================================== */

.stack{display:grid;gap:16px;}
.stack-sm{display:grid;gap:10px;}
.stack-lg{display:grid;gap:26px;}

/* ---------- Portada ---------- */
.hero-title{margin-top:14px;}
.hero-title em{font-style:normal;color:var(--red);}
.hero-lede{margin-top:12px;max-width:34ch;}

.trust-row{display:grid;gap:9px;margin-top:4px;}
.trust-row li{
  list-style:none;display:flex;align-items:center;gap:10px;
  font-size:.88rem;font-weight:500;color:var(--ink-2);
}
.trust-row svg{flex:none;color:var(--red);}

.hero-figure{
  position:relative;width:100%;aspect-ratio:16/10;
  border-radius:var(--radius-lg);margin-bottom:2px;
}

/* ---------- Tarjetas de elección (aéreo / marítimo) ---------- */
.choice{display:grid;gap:13px;}
.choice-card{
  display:block;position:relative;overflow:hidden;
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);
  padding:16px;
  transition:transform .2s cubic-bezier(.22,1,.36,1),box-shadow .2s ease,border-color .2s ease;
}
.choice-card:hover{transform:translateY(-3px);box-shadow:var(--shadow-lg);}
.choice-card.is-air:hover{border-color:#BBD3EE;}
.choice-card.is-sea:hover{border-color:#B4DCE1;}

.choice-top{display:flex;align-items:flex-start;gap:13px;}
.choice-ico{
  width:48px;height:48px;flex:none;border-radius:13px;
  display:flex;align-items:center;justify-content:center;
}
.choice-card.is-air .choice-ico{background:var(--air-soft);color:var(--air);}
.choice-card.is-sea .choice-ico{background:var(--sea-soft);color:var(--sea);}
.choice-head{flex:1;min-width:0;}
.choice-head h3{margin-top:7px;}

.choice-points{margin:13px 0 0;padding:0;display:grid;gap:6px;}
.choice-points li{
  list-style:none;display:flex;gap:9px;align-items:flex-start;
  font-size:.86rem;line-height:1.45;color:var(--ink-2);
}
.choice-points li::before{
  content:"";flex:none;width:5px;height:5px;border-radius:50%;
  background:var(--ink-3);margin-top:8px;opacity:.55;
}

.choice-foot{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  margin-top:15px;padding-top:14px;border-top:1px solid var(--line-2);
}
.choice-price{line-height:1.15;}
.choice-price .amt{
  font-family:var(--display);font-weight:800;font-size:1.22rem;color:var(--ink);
  letter-spacing:-.02em;display:block;
}
.choice-price .amt .num{font-family:var(--numeral);font-weight:700;}
.choice-price .note{font-size:.7rem;color:var(--ink-3);display:block;margin-top:3px;}
.choice-go{
  display:inline-flex;align-items:center;gap:7px;flex:none;
  font-family:var(--display);font-weight:700;font-size:.85rem;
}
.choice-card.is-air .choice-go{color:var(--air);}
.choice-card.is-sea .choice-go{color:var(--sea);}
.choice-card:hover .choice-go svg{transform:translateX(3px);}
.choice-go svg{transition:transform .2s ease;}

/* ---------- Selector de pestañas + comparación ---------- */
.tabs{
  display:grid;grid-template-columns:1fr 1fr;gap:4px;
  padding:4px;background:var(--paper-2);border-radius:12px;
  position:relative;
}
.tabs button{
  padding:11px 8px;border-radius:9px;
  font-family:var(--display);font-weight:700;font-size:.9rem;
  color:var(--ink-3);display:flex;align-items:center;justify-content:center;gap:7px;
  transition:color .22s ease;position:relative;z-index:1;
}
.tabs button svg{width:17px;height:17px;}
.tabs button.is-active{color:var(--paper);}
.tabs .tab-pill{
  position:absolute;top:4px;left:4px;bottom:4px;
  width:calc(50% - 4px);border-radius:9px;
  background:var(--air);
  transition:transform .34s cubic-bezier(.22,1,.36,1),background-color .34s ease;
  z-index:0;
}
.tabs[data-mode="sea"] .tab-pill{transform:translateX(100%);background:var(--sea);}

.cmp{margin-top:16px;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;}
.cmp-row{
  display:grid;grid-template-columns:1fr auto;gap:14px;align-items:center;
  padding:13px 15px;border-bottom:1px solid var(--line-2);
}
.cmp-row:last-child{border-bottom:0;}
.cmp-row:nth-child(odd){background:#FAFBFD;}
.cmp-k{font-size:.82rem;color:var(--ink-3);font-weight:500;}
.cmp-v{
  font-family:var(--display);font-weight:700;font-size:.92rem;
  color:var(--ink);text-align:right;letter-spacing:-.01em;
}
.cmp-v .num{font-family:var(--numeral);font-weight:700;}

.help-note{
  margin-top:16px;padding:15px;border-radius:var(--radius);
  background:var(--gold-soft);border:1px solid #F0E4C4;
}
.help-note h4{color:var(--ink);margin-bottom:5px;}
.help-note p{font-size:.86rem;line-height:1.55;color:var(--ink-2);}

/* ---------- Pasos numerados (secuencia real) ---------- */
.steps{display:grid;gap:2px;counter-reset:step;}
.step{
  display:flex;gap:14px;padding:14px 0;
  border-bottom:1px solid var(--line-2);
}
.step:last-child{border-bottom:0;}
.step-n{
  flex:none;width:30px;height:30px;border-radius:9px;
  background:var(--red-soft);color:var(--red);
  display:flex;align-items:center;justify-content:center;
  font-family:var(--numeral);font-weight:700;font-size:.82rem;
}
.step-b h4{color:var(--ink);margin-bottom:4px;}
.step-b p{font-size:.86rem;line-height:1.55;color:var(--ink-2);}

/* ---------- Tarjetas de beneficio ---------- */
.benefits{display:grid;grid-template-columns:1fr 1fr;gap:11px;}
.benefit{
  padding:16px 14px;border:1px solid var(--line);border-radius:var(--radius);
  background:var(--paper);box-shadow:var(--shadow-sm);
}
.benefit-ico{
  width:38px;height:38px;border-radius:11px;margin-bottom:11px;
  background:var(--red-soft);color:var(--red);
  display:flex;align-items:center;justify-content:center;
}
.benefit h4{color:var(--ink);margin-bottom:5px;font-size:.95rem;}
.benefit p{font-size:.8rem;line-height:1.5;color:var(--ink-2);}

/* ---------- Calculadora ---------- */
.calc-modes{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-bottom:16px;}
.calc-mode{
  padding:13px 10px;border-radius:12px;border:1.5px solid var(--line);
  background:var(--paper);display:flex;align-items:center;gap:9px;
  font-family:var(--display);font-weight:700;font-size:.88rem;color:var(--ink-3);
  transition:border-color .2s ease,background-color .2s ease,color .2s ease;
}
.calc-mode svg{width:19px;height:19px;flex:none;}
.calc-mode.is-active{color:var(--ink);}
.calc-mode[data-mode="air"].is-active{border-color:var(--air);background:var(--air-soft);color:var(--air);}
.calc-mode[data-mode="sea"].is-active{border-color:var(--sea);background:var(--sea-soft);color:var(--sea);}

.field{display:grid;gap:6px;}
.field label{
  font-family:var(--display);font-weight:600;font-size:.78rem;
  letter-spacing:.02em;color:var(--ink-2);
}
.field input,.field select,.field textarea{
  width:100%;min-height:50px;padding:13px 14px;
  border:1.5px solid var(--line);border-radius:11px;
  background:var(--paper);color:var(--ink);
  /* 16px EXPLICITOS en px, no rem: por debajo iOS hace zoom al enfocar */
  font-family:var(--numeral);font-size:16px;font-weight:600;
  transition:border-color .18s ease,box-shadow .18s ease;
  -webkit-appearance:none;appearance:none;
}
.field textarea{font-family:var(--body);font-weight:400;font-size:16px;min-height:88px;resize:vertical;line-height:1.5;}
.field input::placeholder,.field textarea::placeholder{color:#AEB7C6;font-weight:400;}
.field input:focus,.field select:focus,.field textarea:focus{
  outline:none;border-color:var(--red);box-shadow:0 0 0 4px var(--red-soft);
}
.field-grid{display:grid;grid-template-columns:1fr 1fr;gap:11px;}
.field-suffix{position:relative;}
.field-suffix .unit{
  position:absolute;right:14px;top:50%;transform:translateY(-50%);
  font-family:var(--display);font-weight:600;font-size:.8rem;color:var(--ink-3);
  pointer-events:none;
}
.field-suffix input{padding-right:46px;}

.calc-out{
  margin-top:16px;padding:17px;border-radius:var(--radius);
  background:var(--ink);color:#fff;
  display:flex;align-items:center;justify-content:space-between;gap:14px;
}
.calc-out .k{
  font-family:var(--display);font-weight:600;font-size:.72rem;
  letter-spacing:.11em;text-transform:uppercase;color:rgba(255,255,255,.6);
}
.calc-out .v{
  font-family:var(--numeral);font-weight:700;font-size:1.6rem;
  color:#fff;letter-spacing:-.02em;line-height:1.1;margin-top:3px;
}
.calc-out .v small{font-size:.82rem;font-weight:400;color:rgba(255,255,255,.65);margin-left:3px;}
.calc-out .sub{font-size:.72rem;color:rgba(255,255,255,.55);margin-top:4px;}

/* ---------- Testimonios (marcadores) ---------- */
.tst{display:grid;gap:11px;}
.tst-card{
  padding:13px 14px;border:1px solid var(--line);border-radius:var(--radius);
  background:var(--paper);box-shadow:var(--shadow-sm);
}
.tst-stars{display:flex;gap:2px;color:var(--gold);margin-bottom:7px;}
.tst-quote{font-size:.85rem;line-height:1.5;color:var(--ink-2);}
.tst-card.is-placeholder .tst-quote{color:#9AA5B6;font-style:italic;}
.tst-who{
  display:flex;align-items:center;gap:9px;margin-top:9px;
  padding-top:9px;border-top:1px solid var(--line-2);
}
.tst-av{
  width:29px;height:29px;border-radius:50%;flex:none;
  background:var(--paper-3);color:var(--ink-3);
  display:flex;align-items:center;justify-content:center;
  font-family:var(--display);font-weight:700;font-size:.8rem;
}
.tst-name{font-family:var(--display);font-weight:700;font-size:.82rem;color:var(--ink);}
.tst-meta{font-size:.7rem;color:var(--ink-3);}

/* ---------- Tablas de tarifas ---------- */
.rates{border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;}
.rates-row{
  display:grid;grid-template-columns:1fr auto;gap:14px;align-items:center;
  padding:14px 16px;border-bottom:1px solid var(--line-2);
}
.rates-row:last-child{border-bottom:0;}
.rates-row.is-head{
  background:var(--paper-2);
  font-family:var(--display);font-weight:700;font-size:.7rem;
  letter-spacing:.1em;text-transform:uppercase;color:var(--ink-3);
  padding-top:11px;padding-bottom:11px;
}
.rates-row.is-best{background:var(--gold-soft);}
.rates-k{font-family:var(--numeral);font-weight:600;font-size:.92rem;color:var(--ink-2);}
.rates-v{
  font-family:var(--numeral);font-weight:700;font-size:1.02rem;
  color:var(--ink);text-align:right;letter-spacing:-.01em;
}
.rates-v small{
  display:block;                       /* la unidad baja a su propio renglon */
  font-family:var(--body);font-weight:500;font-size:.72rem;
  color:var(--ink-3);margin-left:0;margin-top:2px;
}
.rates-row.is-best .rates-v{color:var(--gold);}
.rates-3{grid-template-columns:1fr auto auto;}
.rates-3 .rates-v{min-width:82px;}

/* ---------- Avisos ---------- */
.notice{
  padding:14px 15px;border-radius:12px;
  font-size:.82rem;line-height:1.55;color:var(--ink-2);
  background:var(--paper-2);border-left:3px solid var(--ink-3);
}
.notice.is-warn{background:var(--gold-soft);border-left-color:var(--gold);}
.notice strong{color:var(--ink);font-weight:600;}

/* ---------- Lista de preparación ---------- */
.prep-list{margin:0;padding:0;display:grid;gap:0;}
.prep-list li{
  list-style:none;display:flex;align-items:center;gap:10px;
  padding:9px 0;border-bottom:1px solid var(--line-2);
  font-size:.85rem;color:var(--ink-2);
}
.prep-list li:last-child{border-bottom:0;}
.prep-list li::before{content:"—";color:var(--ink-3);font-weight:600;}

/* ==========================================================================
   Páginas interiores (desplazamiento vertical tradicional)
   ========================================================================== */
body.page-doc{padding-top:var(--topbar-h);padding-bottom:var(--botnav-h);}

.sec{padding:44px var(--gutter);max-width:680px;margin:0 auto;}
.sec-tint{background:var(--paper-2);max-width:none;}
.sec-tint > .sec-in{max-width:680px;margin:0 auto;}
.sec-head{margin-bottom:22px;}
.sec-head h2{margin-top:12px;}
.sec-head .lede{margin-top:11px;}

.pagehero{
  position:relative;overflow:hidden;
  padding:38px var(--gutter) 34px;
  background:var(--paper);
  border-bottom:1px solid var(--line);
}
.pagehero-in{max-width:680px;margin:0 auto;position:relative;z-index:1;}
.pagehero h1{margin-top:13px;}
.pagehero .lede{margin-top:13px;max-width:40ch;}
.pagehero-art{
  position:absolute;right:-40px;top:-30px;
  width:250px;height:250px;opacity:.07;pointer-events:none;z-index:0;
}
.pagehero.is-air .pagehero-art{color:var(--air);}
.pagehero.is-sea .pagehero-art{color:var(--sea);}

.quickfacts{
  display:grid;gap:1px;margin-top:22px;
  background:var(--line);border:1px solid var(--line);border-radius:var(--radius);
  overflow:hidden;
}
.qf{background:var(--paper);padding:13px 15px;display:flex;align-items:center;gap:11px;}
.qf svg{flex:none;color:var(--ink-3);}
.qf > span{display:block;min-width:0;}
.qf .qf-v{
  display:block;                       /* antes quedaba pegado en el mismo renglon */
  font-family:var(--display);font-weight:700;font-size:.95rem;
  color:var(--ink);letter-spacing:-.01em;line-height:1.3;
}
.qf .qf-v .num{font-family:var(--numeral);font-weight:700;}
.qf .qf-k{display:block;font-size:.74rem;color:var(--ink-3);margin-top:4px;line-height:1.35;}

.backlink{
  display:inline-flex;align-items:center;gap:8px;
  font-family:var(--display);font-weight:600;font-size:.84rem;color:var(--ink-3);
  padding:8px 0;
}
.backlink:hover{color:var(--red);}
.backlink svg{transition:transform .2s ease;}
.backlink:hover svg{transform:translateX(-3px);}

.split{display:grid;gap:13px;}
.split-card{
  padding:18px;border:1px solid var(--line);border-radius:var(--radius);
  background:var(--paper);box-shadow:var(--shadow-sm);
}
.split-card h3{margin-bottom:8px;}
.split-card p{font-size:.88rem;line-height:1.6;color:var(--ink-2);}
.split-card .btn{margin-top:15px;}

.chiplist{display:flex;flex-wrap:wrap;gap:8px;}
.chiplist span{
  padding:8px 13px;border-radius:100px;background:var(--paper-2);
  border:1px solid var(--line);font-size:.83rem;font-weight:500;color:var(--ink-2);
}

/* cierre oscuro de las páginas interiores */
.endcta{
  background:var(--ink);color:#fff;position:relative;overflow:hidden;
  padding:46px var(--gutter) 52px;
}
.endcta::before{
  content:"";position:absolute;inset:0;
  background:
    radial-gradient(85% 60% at 50% 0%,rgba(193,18,31,.24),transparent 62%),
    radial-gradient(60% 45% at 88% 100%,rgba(176,136,41,.16),transparent 66%);
}
.endcta-in{position:relative;z-index:1;max-width:680px;margin:0 auto;}
.endcta h2{color:#fff;}
.endcta .eyebrow{color:#fff;}
.endcta p{color:rgba(255,255,255,.72);}
.endcta .fine{color:rgba(255,255,255,.48);}
.endcta .btn-ghost{background:rgba(255,255,255,.07);color:#fff;border-color:rgba(255,255,255,.24);box-shadow:none;}
.endcta .btn-ghost:hover{background:rgba(255,255,255,.13);}
.endcta .prep-list li{color:rgba(255,255,255,.7);border-color:rgba(255,255,255,.12);}
.endcta .prep-list li::before{color:var(--gold);}

.sitefoot{
  background:var(--ink);color:rgba(255,255,255,.5);
  padding:0 var(--gutter) 28px;
}
.sitefoot-in{
  max-width:680px;margin:0 auto;
  padding-top:24px;border-top:1px solid rgba(255,255,255,.1);
  display:grid;gap:14px;text-align:center;
}
.sitefoot .kc-static{color:rgba(255,255,255,.42);}
.sitefoot-links{display:flex;justify-content:center;gap:18px;flex-wrap:wrap;}
.sitefoot-links a{font-size:.82rem;color:rgba(255,255,255,.62);}
.sitefoot-links a:hover{color:#fff;}

/* ---------- Confirmación del formulario ---------- */
.form-done{
  display:none;padding:26px 20px;text-align:center;
  border:1px solid var(--line);border-radius:var(--radius-lg);
  background:var(--paper);box-shadow:var(--shadow-md);
}
.form-done.show{display:block;animation:slideItemIn .5s cubic-bezier(.22,1,.36,1) forwards;opacity:0;}
.form-done .tick{
  width:52px;height:52px;border-radius:50%;margin:0 auto 15px;
  background:var(--red-soft);color:var(--red);
  display:flex;align-items:center;justify-content:center;
}
.form-done h3{margin-bottom:9px;}
.form-done p{font-size:.9rem;line-height:1.6;color:var(--ink-2);}

.radio-row{display:grid;gap:9px;}
.radio-opt{
  /* contiene el input absoluto: sin esto se escapaba y desbordaba 41px */
  position:relative;overflow:hidden;
  display:flex;align-items:center;gap:11px;
  padding:14px 15px;border:1.5px solid var(--line);border-radius:12px;
  background:var(--paper);cursor:pointer;
  transition:border-color .18s ease,background-color .18s ease;
}
.radio-opt input{position:absolute;opacity:0;pointer-events:none;}
.radio-opt .dot{
  width:19px;height:19px;border-radius:50%;border:2px solid var(--line);
  flex:none;position:relative;transition:border-color .18s ease;
}
.radio-opt .dot::after{
  content:"";position:absolute;inset:3px;border-radius:50%;
  background:var(--red);transform:scale(0);transition:transform .2s cubic-bezier(.22,1,.36,1);
}
.radio-opt span.lbl{font-family:var(--display);font-weight:600;font-size:.92rem;color:var(--ink);}
.radio-opt:has(input:checked){border-color:var(--red);background:var(--red-soft);}
.radio-opt:has(input:checked) .dot{border-color:var(--red);}
.radio-opt:has(input:checked) .dot::after{transform:scale(1);}
.radio-opt svg{margin-left:auto;flex:none;color:var(--ink-3);}

/* ---------- Escritorio ---------- */
@media (min-width:768px){
  .sec{padding:64px var(--gutter);}
  .pagehero{padding:60px var(--gutter) 52px;}
  .pagehero-art{width:360px;height:360px;right:-50px;top:-50px;}
  .choice{grid-template-columns:1fr 1fr;gap:18px;}
  .choice-card{padding:22px;}
  .benefits{gap:14px;}
  .benefit{padding:20px 18px;}
  .split{grid-template-columns:1fr 1fr;gap:18px;}
  .tst{grid-template-columns:repeat(3,1fr);}
  .quickfacts{grid-template-columns:repeat(auto-fit,minmax(150px,1fr));}
  .endcta{padding:72px var(--gutter) 78px;}
  .hero-lede{max-width:44ch;}
  .field-grid{grid-template-columns:repeat(4,1fr);}
}

@media (min-width:768px){
  .slide-inner,.slide-scroll{max-width:920px;}
  /* espacio libre para la pastilla flotante de navegación */
  .slide-scroll,.slide-inner{padding-bottom:96px;}
  body.page-doc{padding-bottom:104px;}
}

/* ==========================================================================
   Escritorio: aprovechar el ancho en vez de encajonarlo todo al centro
   ========================================================================== */
@media (min-width:1024px){
  .sec{max-width:1120px;}
  .sec-tint > .sec-in{max-width:1120px;}
  .pagehero-in,.endcta-in,.sitefoot-in{max-width:1120px;}

  /* el titular a la izquierda y el texto de apoyo a la derecha */
  .sec-head{
    display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);
    gap:14px 56px;align-items:end;margin-bottom:30px;
  }
  .sec-head .eyebrow{grid-column:1;grid-row:1;}
  .sec-head h2{grid-column:1;grid-row:2;margin-top:12px;}
  .sec-head .lede{grid-column:2;grid-row:2;margin-top:0;align-self:end;}

  .pagehero h1{max-width:17ch;}
  .pagehero .lede{max-width:52ch;}
}

@media (min-width:1280px){
  .slide-inner,.slide-scroll{max-width:1120px;}
  .sec,.sec-tint > .sec-in,.pagehero-in,.endcta-in,.sitefoot-in{max-width:1240px;}
  /* procesos largos en dos columnas: menos scroll y menos aire muerto */
  .steps{grid-template-columns:1fr 1fr;column-gap:52px;}
  .steps-compact{grid-template-columns:1fr 1fr;column-gap:52px;}
  .split{gap:24px;}
}

@media (min-width:1600px){
  .slide-inner,.slide-scroll{max-width:1240px;}
  .sec,.sec-tint > .sec-in,.pagehero-in,.endcta-in,.sitefoot-in{max-width:1360px;}
}

/* ---------- Tira de ruta China → México (detalle de portada) ---------- */
.routestrip{
  display:flex;align-items:center;gap:11px;
  padding:8px 14px;width:max-content;max-width:100%;
  border:1px solid var(--line);border-radius:100px;
  background:rgba(255,255,255,.72);
  backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);
  box-shadow:var(--shadow-sm);
}
.rs-node{
  display:flex;align-items:center;gap:6px;white-space:nowrap;
  font-family:var(--display);font-weight:700;font-size:.68rem;
  letter-spacing:.11em;text-transform:uppercase;color:var(--ink);
}
.rs-node i{width:6px;height:6px;border-radius:50%;background:var(--red);flex:none;}
.rs-node.is-end i{background:var(--gold);}
.rs-line{flex:1;min-width:46px;height:14px;color:var(--ink-3);}
.rs-line path{stroke-dasharray:2 3.5;animation:rsFlow 2.4s linear infinite;}
@keyframes rsFlow{to{stroke-dashoffset:-11;}}

/* ---------- Métrica destacada ---------- */
.metric{display:flex;align-items:baseline;gap:7px;}
.metric .m-v{font-family:var(--numeral);font-weight:700;font-size:1.35rem;color:var(--ink);letter-spacing:-.02em;}
.metric .m-k{font-size:.76rem;color:var(--ink-3);}

/* ---------- Pasos compactos (procesos largos) ---------- */
.steps-compact{display:grid;gap:0;}
.steps-compact li{
  list-style:none;display:flex;align-items:flex-start;gap:13px;
  padding:11px 0;border-bottom:1px solid var(--line-2);
  font-size:.89rem;line-height:1.5;color:var(--ink-2);
}
.steps-compact li:last-child{border-bottom:0;}
.steps-compact li::before{
  counter-increment:sc;content:counter(sc);
  flex:none;width:24px;height:24px;border-radius:7px;
  background:var(--paper-2);color:var(--ink-3);
  font-family:var(--numeral);font-weight:700;font-size:.72rem;
  display:flex;align-items:center;justify-content:center;margin-top:1px;
}
.steps-compact{counter-reset:sc;padding:0;margin:0;}
.steps-compact.is-sea li::before{background:var(--sea-soft);color:var(--sea);}
.steps-compact.is-air li::before{background:var(--air-soft);color:var(--air);}

/* ---------- Fórmula ---------- */
.formula{
  padding:16px;border-radius:var(--radius);text-align:center;
  background:var(--ink);color:#fff;
}
.formula .f-k{font-family:var(--display);font-weight:600;font-size:.68rem;letter-spacing:.13em;text-transform:uppercase;color:rgba(255,255,255,.55);}
.formula .f-v{font-family:var(--numeral);font-weight:700;font-size:1.02rem;margin-top:7px;letter-spacing:-.01em;line-height:1.4;}

/* ==========================================================================
   Portada en dos columnas (solo escritorio)
   ========================================================================== */
.hero-grid{display:block;}
.hero-col{display:flex;flex-direction:column;}
.routeboard{display:none;}

@media (min-width:900px){
  .slide-inner.is-wide{max-width:1120px;}
  .hero-grid{
    display:grid;grid-template-columns:1.02fr .98fr;
    gap:52px;align-items:center;
  }
  .routeboard{
    display:block;
    border:1px solid var(--line);border-radius:var(--radius-lg);
    background:rgba(255,255,255,.78);
    backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
    box-shadow:var(--shadow-md);overflow:hidden;
  }
}

.rb-top{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:14px 18px;border-bottom:1px solid var(--line-2);
  background:var(--paper-2);
}
.rb-top .rb-t{
  font-family:var(--display);font-weight:700;font-size:.66rem;
  letter-spacing:.16em;text-transform:uppercase;color:var(--ink-3);
}
.rb-live{display:flex;align-items:center;gap:7px;font-size:.68rem;color:var(--ink-3);}
.rb-live i{
  width:6px;height:6px;border-radius:50%;background:var(--red);flex:none;
  animation:rbPulse 2.1s ease-in-out infinite;
}
@keyframes rbPulse{0%,100%{opacity:1;transform:scale(1);}50%{opacity:.35;transform:scale(.82);}}

.rb-row{
  display:grid;grid-template-columns:1fr auto;gap:6px 16px;
  padding:16px 18px;border-bottom:1px solid var(--line-2);
}
.rb-mode{
  display:flex;align-items:center;gap:9px;
  font-family:var(--display);font-weight:700;font-size:1rem;color:var(--ink);
}
.rb-mode svg{width:19px;height:19px;flex:none;}
.rb-row.is-air .rb-mode svg{color:var(--air);}
.rb-row.is-sea .rb-mode svg{color:var(--sea);}
.rb-min{
  font-family:var(--numeral);font-weight:700;font-size:.9rem;color:var(--ink);
  text-align:right;align-self:center;
}
.rb-dest{
  grid-column:1 / -1;display:flex;align-items:center;gap:7px;
  font-size:.8rem;color:var(--ink-3);
}
.rb-dest svg{width:14px;height:14px;flex:none;}

.rb-foot{
  padding:14px 18px;display:flex;align-items:center;gap:10px;
  font-size:.78rem;color:var(--ink-3);
}
.rb-foot svg{width:16px;height:16px;flex:none;color:var(--gold);}

/* ==========================================================================
   Pantallas cortas (iPhone SE y similares) — se aprieta todo un poco
   ========================================================================== */
@media (max-width:767px) and (max-height:700px){
  h1{font-size:1.72rem;}
  h2{font-size:1.42rem;}
  .lede{font-size:.94rem;line-height:1.55;}
  .btn{min-height:48px;font-size:.94rem;}
  .slide-inner,.slide-scroll{
    padding-top:calc(var(--topbar-h) + 10px);
    padding-bottom:calc(var(--botnav-h) + 12px);
  }
  .choice-card{padding:13px;}
  .choice-points{margin-top:10px;gap:4px;}
  .choice-points li{font-size:.81rem;}
  .choice-foot{margin-top:12px;padding-top:11px;}
  .trust-row li{font-size:.83rem;}
  .trust-row{gap:7px;}
  .step{padding:11px 0;}
  .benefit{padding:13px 11px;}
  .benefit-ico{width:33px;height:33px;margin-bottom:8px;}
  .routestrip{padding:6px 12px;}
  .scrollcue .mouse{height:30px;width:20px;}
}

/* ==========================================================================
   Ajustes para que cada diapositiva quepa sin desplazamiento interno
   ========================================================================== */

/* Línea compacta de datos dentro de las tarjetas de elección */
.choice-meta{
  margin-top:11px;font-size:.84rem;line-height:1.45;color:var(--ink-2);font-weight:500;
}
.choice-meta .num{font-weight:700;color:var(--ink);}
.choice-note{margin-top:5px;font-size:.8rem;line-height:1.4;color:var(--ink-3);}

/* Requisitos del cierre como fichas en una sola línea envolvente */
.prep-chips{display:flex;flex-wrap:wrap;gap:7px;margin:0;padding:0;}
.prep-chips li{
  list-style:none;padding:6px 11px;border-radius:100px;
  font-size:.78rem;font-weight:500;
  background:rgba(255,255,255,.09);
  border:1px solid rgba(255,255,255,.16);
  color:rgba(255,255,255,.82);
}

/* Texto de apoyo que se retira en pantallas bajas para no forzar el scroll */
@media (max-height:780px) and (max-width:767px){
  .hide-short{display:none !important;}
}

/* Compactado adicional en teléfonos bajos */
@media (max-width:767px) and (max-height:700px){
  .choice-ico{width:42px;height:42px;border-radius:11px;}
  .choice-meta{margin-top:9px;font-size:.81rem;}
  .step{padding:9px 0;}
  .step-n{width:27px;height:27px;}
  .step-b p{font-size:.82rem;line-height:1.45;}
  .tst-card{padding:11px 12px;}
  .tst-quote{font-size:.82rem;}
  .acc-head{padding:13px 2px;font-size:.92rem;}
  .prep-chips li{padding:5px 10px;font-size:.75rem;}
}

/* Teléfonos muy bajos (360x640 y similares): último nivel de compactado */
@media (max-width:767px) and (max-height:690px){
  h2{font-size:1.3rem;}
  .eyebrow{font-size:.64rem;}
  .slide-inner,.slide-scroll{
    padding-top:calc(var(--topbar-h) + 8px);
    padding-bottom:calc(var(--botnav-h) + 8px);
  }
  .choice{gap:10px;}
  .choice-card{padding:11px 12px;}
  .choice-ico{width:38px;height:38px;border-radius:10px;}
  .choice-meta{margin-top:7px;font-size:.79rem;}
  .choice-foot{margin-top:10px;padding-top:9px;}
  .choice-price .amt{font-size:1.08rem;}
  .choice-price .note{font-size:.66rem;}
  .benefits{gap:9px;}
  .benefit{padding:11px 10px;}
  .benefit-ico{width:30px;height:30px;margin-bottom:6px;border-radius:9px;}
  .benefit h4{font-size:.87rem;}
  .benefit p{font-size:.76rem;line-height:1.4;}
  .notice{padding:11px 12px;font-size:.78rem;}
  .tst{gap:8px;}
  .tst-card{padding:10px 11px;}
  .tst-quote{font-size:.79rem;line-height:1.45;}
  .tst-stars{margin-bottom:5px;}
  .tst-who{margin-top:7px;padding-top:7px;}
  .tst-av{width:26px;height:26px;font-size:.72rem;}
  .step{padding:8px 0;}
  .step-b h4{font-size:.9rem;}
  .acc-head{padding:11px 2px;font-size:.88rem;}
  .calc-out{padding:13px;}
  .calc-out .v{font-size:1.4rem;}
}

/* Ajuste fino de la sección de opiniones en pantallas bajas */
@media (max-width:767px) and (max-height:690px){
  .tst{gap:6px;}
  .tst-card{padding:8px 11px;}
  .tst-quote{font-size:.77rem;line-height:1.42;}
  .tst-who{margin-top:6px;padding-top:6px;}
}

/* ==========================================================================
   Ancho de la portada en pantallas grandes
   Va al final a propósito: la regla .is-wide del bloque de 900px
   aparece después en el archivo y ganaría por orden de cascada.
   ========================================================================== */
@media (min-width:1280px){ .slide-inner.is-wide{max-width:1280px;} }
@media (min-width:1600px){ .slide-inner.is-wide{max-width:1440px;} }
@media (min-width:1900px){ .slide-inner.is-wide{max-width:1560px;} }
