/* ============================================================
   KIT COMPARTIDO — componentes que usan todas las páginas.
   (COMPARTIDO: las secciones NO lo editan; piden cambios en core_requests)
   Tokens heredados de base.css: --ink --ink-2 --ink-3 --navy --deep --cream --cream-2
   --mute --gold --gold-2 --gold-3 --gold-glow --line --line-2 --gold-grad --serif --sans
   --gut --max --r --r-sm --nav-h --ease --ease-io
   ============================================================ */
:root{
  --ok:#7FD6A8; --warn:#F4D58A; --err:#F09A8C;
  --glass:rgba(13,27,40,.55); --glass-2:rgba(16,39,58,.72);
  --hair:rgba(216,166,70,.24);           /* hilo de oro */
  --sec-y:clamp(88px,13vw,190px);        /* aire vertical entre secciones */
  --fs-body:clamp(1rem,1.05vw,1.08rem);
  --fs-small:.86rem;
  --fs-num:clamp(2.6rem,6.4vw,6.2rem);
}

/* ---------- Ritmo de sección ---------- */
.sec{position:relative;padding-block:var(--sec-y)}
.sec--tight{padding-block:calc(var(--sec-y)*.6)}
.sec--deep{background:linear-gradient(180deg,var(--ink) 0%,var(--deep) 46%,var(--ink) 100%)}
.sec--navy{background:radial-gradient(120% 80% at 50% 0%,var(--navy) 0%,var(--ink) 70%)}
.sec__head{max-width:min(900px,100%);margin-bottom:clamp(40px,6vw,88px)}
.sec__head--center{margin-inline:auto;text-align:center}
.sec__head .lead{margin-top:22px;max-width:62ch}
.sec__head--center .lead{margin-inline:auto}

/* ---------- Texto ---------- */
.body{font-size:var(--fs-body);line-height:1.65;color:var(--cream-2)}
.body strong{color:var(--cream);font-weight:700}
.kicker{font:700 .78rem/1 var(--sans);letter-spacing:.2em;text-transform:uppercase;color:var(--gold-2)}
.cifra{font-family:var(--sans);font-weight:800;font-variant-numeric:tabular-nums lining-nums;letter-spacing:-.02em}
.cifra--xl{font-size:var(--fs-num);line-height:.95}
.cifra small{font-size:.42em;font-weight:700;letter-spacing:0;color:var(--cream-2);margin-left:.18em}
.nota{font-size:var(--fs-small);line-height:1.55;color:var(--mute)}
.link{color:var(--gold-2);text-decoration:underline;text-decoration-color:var(--hair);text-underline-offset:.22em;transition:text-decoration-color .3s}
.link:hover{text-decoration-color:var(--gold-2)}

/* ---------- Tarjeta de vidrio ---------- */
.glass{position:relative;background:var(--glass);border:1px solid var(--line);border-radius:var(--r);
  backdrop-filter:blur(14px) saturate(120%);-webkit-backdrop-filter:blur(14px) saturate(120%);
  padding:clamp(22px,2.6vw,38px);transition:border-color .5s var(--ease),transform .7s var(--ease),background .5s}
.glass--gold{border-color:var(--hair)}
.glass--hover:hover{border-color:var(--gold);transform:translateY(-4px);background:var(--glass-2)}
.glass__n{font:700 .78rem/1 var(--sans);letter-spacing:.18em;color:var(--gold-2);font-variant-numeric:tabular-nums}
.glass h3,.glass .h3{margin:14px 0 10px}

/* ---------- Chips y etiquetas ---------- */
.chip{display:inline-flex;align-items:center;gap:8px;min-height:36px;padding:8px 16px;border:1px solid var(--line-2);border-radius:999px;
  font:600 .84rem/1 var(--sans);color:var(--cream);background:rgba(243,234,219,.04);white-space:nowrap}
.chip--gold{border-color:var(--hair);color:var(--gold-2)}
.chip i{width:7px;height:7px;border-radius:50%;background:var(--gold)}
.tag{display:inline-block;padding:5px 10px;border-radius:999px;background:var(--gold-grad);color:var(--ink);font:800 .68rem/1 var(--sans);letter-spacing:.12em;text-transform:uppercase}
.tag--soft{background:rgba(216,166,70,.14);color:var(--gold-2)}

/* ---------- Pasos numerados ---------- */
.steps{display:grid;gap:clamp(18px,2.4vw,34px);counter-reset:step}
.step{position:relative;padding-left:64px;counter-increment:step}
.step:before{content:counter(step,decimal-leading-zero);position:absolute;left:0;top:-2px;font:500 italic 2rem/1 var(--serif);color:var(--gold-2)}
.step h3{font:700 1.08rem/1.3 var(--sans);color:var(--cream);margin-bottom:6px}
.step p{color:var(--cream-2);line-height:1.6}

/* ---------- Cifras ---------- */
.stat{display:grid;gap:8px;padding-top:20px;border-top:1px solid var(--line-2)}
.stat b{font:800 clamp(2rem,4vw,3.6rem)/1 var(--sans);font-variant-numeric:tabular-nums;letter-spacing:-.02em;color:var(--cream)}
.stat span{font-size:.92rem;line-height:1.45;color:var(--cream-2)}

/* ---------- Lista con palomita ---------- */
.checks{display:grid;gap:12px}
.checks li{position:relative;padding-left:30px;color:var(--cream-2);line-height:1.5}
.checks li:before{content:"";position:absolute;left:0;top:.28em;width:18px;height:18px;border-radius:50%;
  background:var(--gold-grad);-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2a10 10 0 1 0 0 20 10 10 0 0 0 0-20Zm-1.2 14.2-4-4 1.4-1.4 2.6 2.6 5.4-5.4 1.4 1.4-6.8 6.8Z'/%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'%3E%3Cpath d='M12 2a10 10 0 1 0 0 20 10 10 0 0 0 0-20Zm-1.2 14.2-4-4 1.4-1.4 2.6 2.6 5.4-5.4 1.4 1.4-6.8 6.8Z'/%3E%3C/svg%3E") center/contain no-repeat}

/* ---------- Acordeón (FAQ) — usa <details class="acc"> ---------- */
.acc{border-bottom:1px solid var(--line-2)}
.acc:first-of-type{border-top:1px solid var(--line-2)}
.acc>summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:24px;
  padding:clamp(20px,2.4vw,30px) 0;font:500 clamp(1.15rem,1.9vw,1.6rem)/1.25 var(--serif);color:var(--cream);min-height:44px;transition:color .3s}
.acc>summary::-webkit-details-marker{display:none}
.acc>summary:after{content:"";flex:none;width:34px;height:34px;border:1px solid var(--line-2);border-radius:50%;
  background:linear-gradient(var(--gold-2),var(--gold-2)) center/12px 1.5px no-repeat,linear-gradient(var(--gold-2),var(--gold-2)) center/1.5px 12px no-repeat;
  transition:transform .6s var(--ease),border-color .3s}
.acc[open]>summary{color:var(--gold-2)}
.acc[open]>summary:after{transform:rotate(135deg);border-color:var(--gold)}
.acc>summary:hover:after{border-color:var(--gold)}
.acc__body{padding:0 0 clamp(22px,2.4vw,32px);max-width:72ch;color:var(--cream-2);line-height:1.7}

/* ---------- Formularios ---------- */
.field{position:relative;display:block}
.field>span{display:block;margin-bottom:8px;font:600 .8rem/1.2 var(--sans);letter-spacing:.06em;color:var(--cream-2)}
.field input,.field select,.field textarea{width:100%;min-height:52px;padding:14px 16px;border:1px solid var(--line-2);border-radius:var(--r-sm);
  background:rgba(5,9,15,.55);color:var(--cream);font:500 1rem/1.3 var(--sans);transition:border-color .3s,box-shadow .3s,background .3s}
.field textarea{min-height:120px;resize:vertical}
.field select{appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23F4D58A' stroke-width='1.8'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center;background-size:18px;padding-right:44px}
.field input::placeholder,.field textarea::placeholder{color:var(--mute)}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--gold);box-shadow:0 0 0 3px rgba(216,166,70,.18);background:rgba(8,18,28,.8)}
.field.is-error input,.field.is-error select,.field.is-error textarea{border-color:var(--err)}
.field__msg{display:block;margin-top:6px;font-size:.8rem;color:var(--err);min-height:1em}
.field__hint{display:block;margin-top:6px;font-size:.8rem;color:var(--mute)}
.range{width:100%;appearance:none;height:44px;background:transparent;cursor:pointer}
.range::-webkit-slider-runnable-track{height:3px;border-radius:3px;background:linear-gradient(90deg,var(--gold) var(--p,50%),var(--line-2) var(--p,50%))}
.range::-moz-range-track{height:3px;border-radius:3px;background:var(--line-2)}
.range::-moz-range-progress{height:3px;border-radius:3px;background:var(--gold)}
.range::-webkit-slider-thumb{appearance:none;width:26px;height:26px;margin-top:-12px;border-radius:50%;background:var(--gold-grad);border:3px solid var(--ink);box-shadow:0 0 0 1px var(--gold),0 6px 20px rgba(216,166,70,.45)}
.range::-moz-range-thumb{width:22px;height:22px;border-radius:50%;background:var(--gold-2);border:3px solid var(--ink);box-shadow:0 0 0 1px var(--gold)}
.form-ok,.form-err{display:none;padding:18px 20px;border-radius:var(--r-sm);font-weight:600;line-height:1.5}
.form-ok{border:1px solid rgba(127,214,168,.4);background:rgba(127,214,168,.08);color:var(--ok)}
.form-err{border:1px solid rgba(240,154,140,.4);background:rgba(240,154,140,.08);color:var(--err)}
.is-ok>.form-ok,.is-err>.form-err{display:block}

/* ---------- Tabla ---------- */
.tbl{width:100%;border-collapse:collapse;font-size:.96rem}
.tbl th{font:700 .74rem/1.2 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--gold-2);text-align:left;padding:14px 16px;border-bottom:1px solid var(--hair)}
.tbl td{padding:16px;border-bottom:1px solid var(--line);color:var(--cream-2);vertical-align:top}
.tbl td:first-child{color:var(--cream);font-weight:600}
.tbl-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;border:1px solid var(--line);border-radius:var(--r)}

/* ---------- Bloque de código (API) ---------- */
.code{font:500 .86rem/1.7 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;color:var(--cream-2);background:rgba(5,9,15,.72);
  border:1px solid var(--line);border-radius:var(--r-sm);padding:18px 20px;overflow-x:auto;white-space:pre;tab-size:2}
.code .k{color:var(--gold-2)} .code .s{color:#B9D7C4} .code .n{color:#E7B98B} .code .c{color:var(--mute)} .code .v{color:var(--cream)}

/* ---------- Medios ---------- */
.media{position:relative;overflow:hidden;border-radius:var(--r);background:var(--ink-2)}
.media>img,.media>video{width:100%;height:100%;object-fit:cover;display:block}
.media--line{border:1px solid var(--hair)}
.media__shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(5,9,15,0) 35%,rgba(5,9,15,.86) 100%);pointer-events:none}
.ilustrativo{font:600 .7rem/1.3 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--mute)}

/* ---------- Rejillas ---------- */
.grid-2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(18px,2.4vw,34px)}
.grid-3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(16px,2vw,28px)}
.grid-4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(14px,1.8vw,24px)}
.split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(32px,6vw,110px);align-items:center}
@media (max-width:1023px){.grid-4{grid-template-columns:repeat(2,minmax(0,1fr))}.grid-3{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:767px){.grid-2,.grid-3,.grid-4,.split{grid-template-columns:minmax(0,1fr)}}

/* ---------- Marca de página activa en el menú ---------- */
.nav__links a[aria-current=page]{color:var(--gold-2)}
.nav__links a[aria-current=page]:after{transform:scaleX(1);transform-origin:left}
.nav__lang a span{display:none}
.mmenu__cta{color:var(--gold-2)!important}

/* ---------- Preloader corto en páginas interiores ---------- */
html.pl-skip .pl{display:none}

/* ---------- Movimiento reducido: nada queda oculto ---------- */
html.reduce [data-reveal]{opacity:1!important;transform:none!important}
@media (prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.001ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important}}

/* ---------- Menú con 8 enlaces: compacto y, si no cabe, hamburguesa ---------- */
.nav__links{gap:clamp(14px,1.7vw,30px)}
.nav__links a{font-size:clamp(.78rem,.86vw,.9rem);white-space:nowrap}
@media (max-width:1240px){.nav__links{display:none}.nav__burger{display:block}}

/* ---------- Sección cuyo JS no cargó (core.js agrega .is-nojs tras reintentar): contenido visible y desplazable a mano ---------- */
html.reveal-on .is-nojs [data-reveal]{opacity:1;transform:none}
/* Controles que solo funcionan con el JS de su sección: fuera si ese JS no cargó (el carril queda con scroll-snap nativo). */
.is-nojs .eco__ctrl,.is-nojs .eco__dots,.is-nojs .eco__play,.is-nojs .eco__hint,
.is-nojs .cu-arrow,.is-nojs .cu-dot,.is-nojs .nv-arrow,.is-nojs .ap__pause,.is-nojs .tj-pause{display:none!important}
.is-nojs .eco__track{overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain}