/* konteo.es · páginas interiores (precios, demo) · mismo mundo que la home: tinta, oro de línea,
   Caslon para lo que se dice, Instrument Sans para lo que se lee. Sin cuadros, sin tarjetas. */
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%}
body.pagina{background:var(--k-tinta);color:var(--k-crema);font-family:var(--k-texto);font-size:17px;line-height:1.55;-webkit-font-smoothing:antialiased;
  background-image:radial-gradient(60% 40% at 50% -10%,rgba(201,164,92,.08),transparent 70%)}
a{color:inherit}
::selection{background:var(--k-oro);color:var(--k-tinta)}
:focus-visible{outline:2px solid var(--k-oro-luz);outline-offset:4px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

#nav{position:fixed;inset:0 0 auto 0;z-index:20;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:14px clamp(16px,4vw,48px);
     background:linear-gradient(rgba(14,21,36,.92),rgba(14,21,36,0))}
#nav a{text-decoration:none;font-size:12px;letter-spacing:.28em;text-transform:uppercase;color:var(--k-oro);padding:12px 0;border-bottom:1px solid transparent;width:max-content}
#nav a:hover,#nav a[aria-current]{border-bottom-color:var(--k-oro)}
#nav .lado{width:max-content} #nav .der{justify-self:end}
#nav .sello{display:grid;place-items:center;position:relative;width:64px;height:64px;color:var(--k-oro);padding:0;border:0}
#nav .sello svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
#nav .sello b{font-family:var(--k-display);font-weight:400;font-size:9.5px;letter-spacing:.22em;color:var(--k-oro-luz)}

.hoja-pagina{max-width:880px;margin:0 auto;padding:18vh 6vw 8vh}
.cartela{display:flex;align-items:center;gap:14px;font-size:11px;letter-spacing:.3em;text-transform:uppercase;color:var(--k-oro);margin-bottom:1.2em}
.cartela::before{content:"";flex:0 0 28px;height:1px;background:var(--k-oro-linea)}
h1{font-family:var(--k-display);font-weight:400;font-size:clamp(34px,5.2vw,64px);line-height:1.08;letter-spacing:.004em;color:var(--k-crema);text-wrap:balance;max-width:16ch}
h1 em,h2 em{font-style:normal;color:var(--k-oro-luz)}
.entradilla{margin-top:1.4em;font-size:clamp(17px,1.6vw,21px);color:var(--k-crema-2);max-width:56ch;text-wrap:pretty}
section{margin-top:12vh}
h2{font-family:var(--k-display);font-weight:400;font-size:clamp(26px,3.4vw,42px);line-height:1.14;color:var(--k-crema);text-wrap:balance;max-width:20ch}
h3{font-family:var(--k-display);font-weight:400;font-size:clamp(20px,2.2vw,26px);line-height:1.2;color:var(--k-oro-luz)}
p{max-width:58ch;color:var(--k-crema-2);text-wrap:pretty}
p+p{margin-top:1em}
b{color:var(--k-crema);font-weight:500}
.filete{display:block;width:64px;height:1px;background:var(--k-oro);opacity:.8;margin:1.4em 0}

/* la cifra: grande y sola */
.cifra{font-family:var(--k-display);font-size:clamp(72px,12vw,150px);line-height:1;color:var(--k-oro-luz);letter-spacing:-.01em;font-variant-numeric:tabular-nums;margin-top:.2em}
.cifra small{font-family:var(--k-texto);font-size:clamp(14px,1.4vw,18px);letter-spacing:.24em;text-transform:uppercase;color:var(--k-oro);display:block;margin-top:.5em}
.frases{list-style:none;margin-top:2.2em;max-width:60ch}
.frases li{padding:1em 0;border-top:1px solid var(--k-filete-2);color:var(--k-crema-2)}
.frases li:last-child{border-bottom:1px solid var(--k-filete-2)}
.linea-final{margin-top:1.6em;font-family:var(--k-display);font-size:clamp(20px,2.2vw,26px);color:var(--k-crema)}

/* la regla del x3: tres renglones de un libro */
.tercios{list-style:none;margin-top:2em;max-width:62ch}
.tercios li{display:grid;grid-template-columns:auto 1fr;gap:22px;align-items:baseline;padding:1.1em 0;border-top:1px solid var(--k-filete-2)}
.tercios li:last-child{border-bottom:1px solid var(--k-filete-2)}
.tercios .frac{font-family:var(--k-display);font-size:clamp(28px,3.4vw,44px);color:var(--k-oro-luz);font-variant-numeric:tabular-nums;min-width:2.2ch}
.tercios p{max-width:none}

/* los escalones, debajo y más pequeños */
.escalones{list-style:none;margin-top:2em;max-width:62ch}
.escalones li{display:grid;grid-template-columns:auto 1fr;gap:22px;align-items:baseline;padding:1.1em 0;border-top:1px solid var(--k-filete-2)}
.escalones li:last-child{border-bottom:1px solid var(--k-filete-2)}
.escalones .precio{font-family:var(--k-display);font-size:clamp(22px,2.6vw,32px);color:var(--k-oro-luz);font-variant-numeric:tabular-nums;white-space:nowrap}
.escalones .precio small{font-family:var(--k-texto);font-size:11px;letter-spacing:.2em;color:var(--k-oro);display:block}
.escalones h3{font-size:clamp(18px,2vw,23px)}
.micro{margin-top:1.2em;font-size:14px;color:var(--k-apagado)}

/* preguntas y respuestas, sin acordeones */
.objeciones{list-style:none;margin-top:2em;max-width:62ch}
.objeciones li{padding:1.1em 0;border-top:1px solid var(--k-filete-2)}
.objeciones li:last-child{border-bottom:1px solid var(--k-filete-2)}
.objeciones q{display:block;font-family:'Libre Caslon Text',Georgia,serif;font-style:italic;font-size:clamp(17px,1.7vw,21px);color:var(--k-crema);quotes:"«" "»"}
.objeciones p{margin-top:.5em}

/* la demo: el hueco del móvil en oro de línea */
.movil-hueco{display:grid;grid-template-columns:auto 1fr;gap:40px;align-items:center}
.movil-hueco .marco{width:min(48vw,240px);color:var(--k-oro)}
.movil-hueco .marco svg{width:100%;height:auto;display:block;overflow:visible}
.gestos ol{list-style:none;margin-top:2em;display:grid;gap:0;max-width:62ch}
.gestos li{display:grid;grid-template-columns:auto 1fr;gap:22px;padding:1.2em 0;border-top:1px solid var(--k-filete-2)}
.gestos li:last-child{border-bottom:1px solid var(--k-filete-2)}
.gestos .num{font-family:var(--k-display);font-size:clamp(22px,2.6vw,32px);color:var(--k-oro-luz);min-width:2ch}
.gestos p{margin-top:.4em}

.cierre-pagina{margin-top:12vh;padding-top:3em;border-top:1px solid var(--k-filete)}
.cierre-pagina p{font-family:var(--k-display);font-size:clamp(20px,2.4vw,30px);color:var(--k-crema);max-width:26ch;line-height:1.3}
.cierre-pagina a{color:var(--k-oro-luz);text-decoration:none;border-bottom:1px solid var(--k-oro)}
.cierre-pagina a:hover{border-bottom-color:var(--k-oro-luz)}

#pie{border-top:1px solid var(--k-filete-2);padding:34px 6vw 48px;display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap;font-size:13.5px;color:var(--k-apagado);max-width:880px;margin:6vh auto 0}
#pie nav{display:flex;gap:22px;flex-wrap:wrap}
#pie a{text-decoration:none;color:var(--k-crema-2);border-bottom:1px solid transparent;padding:12px 0;display:inline-block}
#pie a:hover{border-bottom-color:var(--k-oro)}

@media (max-width:720px){
  #nav{padding:10px 14px} #nav a{font-size:10.5px;letter-spacing:.2em} #nav .sello{width:52px;height:52px}
  .hoja-pagina{padding-top:14vh}
  .movil-hueco{grid-template-columns:1fr}
  .movil-hueco .marco{width:200px;margin:0 auto}
  .tercios li,.escalones li,.gestos li{grid-template-columns:1fr;gap:6px}
}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}