/* ==========================================================================
   Cuentix Provi · cuentixprovi.blog
   Hoja de estilo única. Identidad visual propia (ver identidad-visual.md).
   Sin dependencias externas: las fuentes están alojadas en /assets/fonts.
   ========================================================================== */

/* ---------- Fuentes propias (licencia SIL OFL 1.1) ---------- */
@font-face{font-family:"Fraunces";src:url("../fonts/fraunces-latin-400-normal.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Fraunces";src:url("../fonts/fraunces-latin-400-italic.woff2") format("woff2");font-weight:400;font-style:italic;font-display:swap}
@font-face{font-family:"Fraunces";src:url("../fonts/fraunces-latin-600-normal.woff2") format("woff2");font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:"Fraunces";src:url("../fonts/fraunces-latin-700-normal.woff2") format("woff2");font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:"Source Sans 3";src:url("../fonts/source-sans-3-latin-400-normal.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Source Sans 3";src:url("../fonts/source-sans-3-latin-400-italic.woff2") format("woff2");font-weight:400;font-style:italic;font-display:swap}
@font-face{font-family:"Source Sans 3";src:url("../fonts/source-sans-3-latin-600-normal.woff2") format("woff2");font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:"Source Sans 3";src:url("../fonts/source-sans-3-latin-700-normal.woff2") format("woff2");font-weight:700;font-style:normal;font-display:swap}

/* ---------- Tokens ---------- */
:root{
  --papel:#F6F0E4;
  --superficie:#FFFBF3;
  --tinta:#1D1B22;
  --tinta-suave:#4A4651;
  --ciruela:#51284F;
  --ciruela-oscuro:#34173A;
  --ciruela-claro:#EFE6EF;
  --salvia:#6F8F7A;
  --salvia-claro:#DDE7DE;
  --salvia-oscuro:#34543F;
  --arcilla:#9E4A30;
  --arcilla-claro:#F1DDD3;
  --linea:#D9CFBC;

  --serif:"Fraunces","Iowan Old Style","Palatino Linotype",Palatino,Georgia,serif;
  --sans:"Source Sans 3",system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;

  --ancho:1120px;
  --ancho-texto:44rem;
  --radio:14px;
  --sombra:0 1px 0 rgba(29,27,34,.04),0 8px 24px -12px rgba(52,23,58,.22);
}

/* ---------- Base ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;color-scheme:light}
body{margin:0;background:var(--papel);color:var(--tinta);font-family:var(--sans);font-size:1.0625rem;line-height:1.65;text-rendering:optimizeLegibility}
img,svg{max-width:100%;display:block}
h1,h2,h3,h4{font-family:var(--serif);font-weight:600;line-height:1.18;margin:0 0 .6em;color:var(--ciruela-oscuro);letter-spacing:-.01em}
h1{font-size:clamp(2rem,4.6vw,3.3rem);font-weight:700}
h2{font-size:clamp(1.45rem,2.6vw,1.9rem)}
h3{font-size:1.2rem}
p{margin:0 0 1.1em}
a{color:var(--ciruela);text-decoration-thickness:.08em;text-underline-offset:.2em}
a:hover{color:var(--arcilla)}
:focus-visible{outline:3px solid var(--arcilla);outline-offset:3px;border-radius:3px}
ul,ol{padding-left:1.25em}
hr{border:0;border-top:1px solid var(--linea);margin:2rem 0}
.contenedor{width:100%;max-width:var(--ancho);margin-inline:auto;padding-inline:20px}
.contenedor-estrecho{width:100%;max-width:var(--ancho-texto);margin-inline:auto;padding-inline:20px}
.solo-lectores{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.saltar{position:absolute;left:-9999px;top:0;background:var(--ciruela-oscuro);color:#fff;padding:.7rem 1rem;z-index:100}
.saltar:focus{left:12px;top:12px}

/* ---------- Aviso superior (solo Inicio, antes de todo) ---------- */
.aviso-superior{background:var(--ciruela-oscuro);color:#FBF5EA;border-bottom:4px solid var(--arcilla)}
.aviso-superior .contenedor{display:flex;gap:14px;align-items:flex-start;padding-block:14px}
.aviso-superior__sello{flex:none;font:700 .75rem/1 var(--sans);letter-spacing:.14em;text-transform:uppercase;border:1.5px solid #FBF5EA;border-radius:999px;padding:.45rem .8rem;margin-top:2px}
.aviso-superior p{margin:0;font-size:1.02rem;line-height:1.5}
.aviso-superior p+p{margin-top:.2rem;font-size:.95rem;opacity:.92}

/* ---------- Cabecera ---------- */
.cabecera{background:var(--superficie);border-bottom:1px solid var(--linea)}
.cabecera__fila{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px 28px;padding-block:16px}
.marca{display:flex;align-items:center;gap:12px;text-decoration:none;color:inherit}
.marca svg{width:46px;height:46px;flex:none}
.marca__nombre{display:block;font:700 1.55rem/1 var(--serif);color:var(--ciruela-oscuro);letter-spacing:-.015em}
.marca__etiqueta{display:inline-block;margin-top:6px;font:600 .72rem/1.2 var(--sans);letter-spacing:.09em;text-transform:uppercase;color:var(--salvia-oscuro);background:var(--salvia-claro);border-radius:999px;padding:.32rem .7rem}
.menu{display:flex;flex-wrap:wrap;gap:4px 6px}
.menu a{font:600 .98rem/1 var(--sans);text-decoration:none;color:var(--tinta);padding:.65rem .85rem;border-radius:999px}
.menu a:hover{background:var(--ciruela-claro);color:var(--ciruela-oscuro)}
.menu a[aria-current="page"]{background:var(--ciruela);color:#fff}

/* ---------- Inicio: hero ---------- */
.hero{padding:clamp(32px,6vw,72px) 0 clamp(28px,5vw,56px);background:
  radial-gradient(900px 340px at 92% -10%,var(--salvia-claro),transparent 70%),var(--papel)}
.hero__grid{display:grid;grid-template-columns:1.15fr 1fr;gap:clamp(24px,4vw,56px);align-items:start}
.sobretitulo{font:700 .78rem/1.2 var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--arcilla);margin-bottom:.9rem}
.lede{font-size:1.2rem;line-height:1.6;color:var(--tinta-suave);max-width:36rem}
.hero__fichas{display:grid;gap:16px}
.ficha{background:var(--superficie);border:1px solid var(--linea);border-radius:var(--radio);padding:20px 22px;box-shadow:var(--sombra)}
.ficha h2{font-size:1.15rem;margin-bottom:.6rem;display:flex;align-items:center;gap:10px}
.ficha h2 svg{width:26px;height:26px}
.ficha ul{margin:0;padding-left:1.1em;font-size:1rem;line-height:1.5}
.ficha li+li{margin-top:.4rem}
.ficha--es{border-top:5px solid var(--salvia)}
.ficha--no{border-top:5px solid var(--arcilla)}

/* ---------- Inicio: grid de artículos ---------- */
.seccion{padding-block:clamp(36px,6vw,72px)}
.seccion__cab{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:end;gap:8px 24px;margin-bottom:26px}
.seccion__cab h2{margin:0}
.seccion__cab p{margin:0;color:var(--tinta-suave);max-width:30rem}
.grid-articulos{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.tarjeta{display:flex;flex-direction:column;background:var(--superficie);border:1px solid var(--linea);border-radius:var(--radio);overflow:hidden;box-shadow:var(--sombra);transition:transform .18s ease,box-shadow .18s ease}
.tarjeta:hover{transform:translateY(-3px)}
.tarjeta__arte{aspect-ratio:16/9;background:var(--ciruela)}
.tarjeta__arte svg{width:100%;height:100%}
.tarjeta__cuerpo{padding:18px 20px 22px;display:flex;flex-direction:column;gap:8px;flex:1}
.tarjeta__kicker{font:700 .72rem/1.2 var(--sans);letter-spacing:.13em;text-transform:uppercase;color:var(--arcilla);margin:0}
.tarjeta h3{margin:0;font-size:1.28rem}
.tarjeta h3 a{color:var(--ciruela-oscuro);text-decoration:none}
.tarjeta h3 a::after{content:"";position:absolute;inset:0}
.tarjeta{position:relative}
.tarjeta__resumen{margin:0;color:var(--tinta-suave);font-size:.98rem;line-height:1.55}
.tarjeta__meta{margin:auto 0 0;padding-top:8px;font-size:.85rem;color:var(--tinta-suave)}
.tarjeta--destacada{grid-column:span 2;flex-direction:row}
.tarjeta--destacada .tarjeta__arte{aspect-ratio:auto;flex:1.05;min-height:100%}
.tarjeta--destacada .tarjeta__cuerpo{flex:1;padding:26px 28px;justify-content:center}
.tarjeta--destacada h3{font-size:1.65rem}

/* ---------- Inicio: franja "Sabías que" ---------- */
.franja{background:var(--ciruela);color:#FBF5EA}
.franja h2{color:#FBF5EA}
.franja .sobretitulo{color:#F2C9B5}
.datos{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:22px}
.dato{border-top:2px solid rgba(251,245,234,.4);padding-top:16px}
.dato__cifra{font:700 clamp(2.2rem,4.5vw,3.2rem)/1 var(--serif);color:#fff;margin:0 0 .35rem}
.dato p{margin:0 0 .5rem;font-size:1rem;line-height:1.5}
.dato a{color:#F7D8C9;font-weight:600}
.dato a:hover{color:#fff}

/* ---------- Inicio: método breve ---------- */
.metodo{display:grid;grid-template-columns:1fr 1fr;gap:clamp(20px,4vw,56px);align-items:center}
.metodo__nota{background:var(--salvia-claro);border-radius:var(--radio);padding:24px 26px}
.metodo__nota p:last-child{margin:0}

/* ---------- Artículos ---------- */
.articulo__cab{padding:clamp(28px,5vw,56px) 0 20px}
.kicker{font:700 .78rem/1.2 var(--sans);letter-spacing:.15em;text-transform:uppercase;color:var(--arcilla);margin-bottom:.8rem}
.dek{font:italic 400 1.3rem/1.5 var(--serif);color:var(--tinta-suave);margin-bottom:1rem}
.meta{font-size:.92rem;color:var(--tinta-suave);margin-bottom:1.2rem}
.aviso-marca{background:var(--ciruela-claro);border-left:5px solid var(--ciruela);border-radius:0 10px 10px 0;padding:14px 18px;font-size:.98rem;line-height:1.5}
.aviso-marca p{margin:0}
.articulo__portada{margin:10px 0 0}
.articulo__portada .contenedor{padding-inline:20px}
.articulo__portada svg{width:100%;height:auto;max-height:380px;border-radius:var(--radio);background:var(--ciruela)}
.cuerpo{padding-top:30px;padding-bottom:20px}
.cuerpo h2{margin-top:1.8em;padding-top:.2em}
.cuerpo h2 .num{font:600 .8rem/1 var(--sans);letter-spacing:.14em;color:var(--arcilla);display:block;margin-bottom:.45rem}
.cuerpo>p:first-of-type::first-letter{font:700 3.6rem/.9 var(--serif);float:left;padding:.08em .1em 0 0;color:var(--ciruela)}
.sabias{margin:2rem 0;background:var(--arcilla-claro);border-radius:var(--radio);padding:20px 24px;border:1px solid #E4C3B3}
.sabias__titulo{font:700 .78rem/1 var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--arcilla);margin:0 0 .6rem}
.sabias p:last-child{margin:0}
.sabias p{font-size:1.08rem}
.aplica{margin:2rem 0;background:var(--salvia-claro);border-radius:var(--radio);padding:20px 24px}
.aplica h2{margin-top:0;font-size:1.25rem}
.aplica p:last-child{margin:0}
.nota-rigor{font-size:.95rem;color:var(--tinta-suave);border-top:1px dashed var(--linea);padding-top:1rem}
.fuentes{margin-top:2.2rem;border-top:2px solid var(--ciruela);padding-top:1rem}
.fuentes h2{font-size:1.2rem;margin-top:0}
.fuentes ol{font-size:.96rem;line-height:1.55}
.fuentes li+li{margin-top:.55rem}
.relacionados{padding-block:clamp(30px,5vw,56px);border-top:1px solid var(--linea);margin-top:30px}
.relacionados h2{font-size:1.3rem}
.relacionados ul{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:1fr 1fr;gap:16px}
.relacionados a{display:block;background:var(--superficie);border:1px solid var(--linea);border-radius:var(--radio);padding:16px 18px;text-decoration:none;color:var(--ciruela-oscuro);font:600 1.05rem/1.35 var(--serif)}
.relacionados a small{display:block;font:700 .7rem/1 var(--sans);letter-spacing:.13em;text-transform:uppercase;color:var(--arcilla);margin-bottom:.5rem}
.relacionados a:hover{border-color:var(--ciruela)}

/* ---------- Acerca de ---------- */
.editorial{display:grid;grid-template-columns:minmax(280px,5fr) 7fr;gap:clamp(28px,5vw,72px);padding-block:clamp(32px,6vw,72px);align-items:start}
.editorial__lateral{position:sticky;top:20px}
.ilustracion{background:var(--salvia-claro);border-radius:200px 200px var(--radio) var(--radio);overflow:hidden;border:1px solid var(--linea)}
.ilustracion svg{width:100%;height:auto}
.ficha-editorial{margin-top:20px;background:var(--superficie);border:1px solid var(--linea);border-radius:var(--radio);padding:18px 20px;font-size:.95rem}
.ficha-editorial h2{font-size:1.05rem;margin-bottom:.7rem}
.ficha-editorial dl{margin:0;display:grid;grid-template-columns:auto 1fr;gap:.45rem 14px}
.ficha-editorial dt{font-weight:700;color:var(--tinta-suave)}
.ficha-editorial dd{margin:0;overflow-wrap:anywhere}
.editorial__texto h1{margin-bottom:.4em}
.editorial__texto .lede{margin-bottom:1.6rem}
.editorial__texto h2{margin-top:1.8em}
.editorial__texto>p:nth-of-type(2)::first-letter{font:700 3.6rem/.9 var(--serif);float:left;padding:.08em .1em 0 0;color:var(--ciruela)}
.cita{margin:1.8rem 0;padding:6px 0 6px 22px;border-left:5px solid var(--salvia);font:italic 400 1.35rem/1.45 var(--serif);color:var(--ciruela-oscuro)}
.pasos{counter-reset:paso;list-style:none;padding:0;margin:1rem 0 1.4rem}
.pasos li{counter-increment:paso;position:relative;padding:0 0 1rem 3rem}
.pasos li::before{content:counter(paso);position:absolute;left:0;top:0;width:2rem;height:2rem;border-radius:50%;background:var(--ciruela);color:#fff;font:700 .95rem/2rem var(--sans);text-align:center}

/* ---------- Política editorial ---------- */
.cab-politica{padding:clamp(32px,6vw,64px) 0 10px}
.cab-politica .lede{max-width:40rem}
.criterios{list-style:none;counter-reset:criterio;margin:20px 0 0;padding:0;display:grid;gap:0}
.criterio{counter-increment:criterio;display:grid;grid-template-columns:4.5rem 3.2rem 1fr;gap:18px;align-items:start;padding:26px 0;border-top:1px solid var(--linea)}
.criterio:last-child{border-bottom:1px solid var(--linea)}
.criterio::before{content:counter(criterio,decimal-leading-zero);font:700 3rem/1 var(--serif);color:var(--arcilla);opacity:.9}
.criterio__icono{width:52px;height:52px;border-radius:14px;background:var(--ciruela);display:grid;place-items:center}
.criterio__icono svg{width:28px;height:28px;stroke:#FBF5EA;fill:none;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round}
.criterio h2{font-size:1.35rem;margin:0 0 .35rem}
.criterio p{margin:0;max-width:44rem}
.cierre-politica{margin:40px 0 60px;background:var(--salvia-claro);border-radius:var(--radio);padding:22px 26px}
.cierre-politica p:last-child{margin:0}

/* ---------- Páginas legales: documento limpio ---------- */
.documento{max-width:44rem;margin-inline:auto;padding:clamp(28px,5vw,56px) 20px 64px;font-family:var(--serif);font-size:1.06rem;line-height:1.7;counter-reset:seccion}
.documento h1{font-size:clamp(1.8rem,3.4vw,2.4rem);margin-bottom:.3em}
.documento .act{font-family:var(--sans);font-size:.92rem;color:var(--tinta-suave);margin-bottom:2rem;padding-bottom:1rem;border-bottom:1px solid var(--tinta)}
.documento h2{counter-increment:seccion;font-size:1.3rem;margin-top:2em}
.documento h2::before{content:counter(seccion) ". "}
.documento h3{font-size:1.08rem;margin-top:1.4em}
.documento table{width:100%;border-collapse:collapse;font-family:var(--sans);font-size:.95rem;margin:1rem 0 1.4rem}
.documento th,.documento td{border:1px solid var(--linea);padding:.6rem .75rem;text-align:left;vertical-align:top}
.documento th{background:var(--superficie)}
.documento address{font-style:normal}

/* ---------- Pie de página ---------- */
.pie{background:var(--ciruela-oscuro);color:#EADFE9;margin-top:0}
.pie a{color:#F7D8C9}
.pie a:hover{color:#fff}
.pie__aviso{margin:0 0 30px;padding:20px 22px;background:rgba(255,255,255,.07);border:1.5px solid rgba(251,245,234,.55);border-radius:var(--radio)}
.pie__aviso p{margin:0}
.pie__aviso p:first-child{font:600 1.12rem/1.5 var(--serif);color:#fff}
.pie__aviso p+p{margin-top:.5rem;font-size:.95rem}
.pie .contenedor{padding-top:40px;padding-bottom:28px}
.pie__grid{display:grid;grid-template-columns:1.3fr 1fr 1.3fr;gap:30px}
.pie h2{font:700 .75rem/1 var(--sans);letter-spacing:.15em;text-transform:uppercase;color:#F2C9B5;margin-bottom:.9rem}
.pie ul{list-style:none;margin:0;padding:0;font-size:.98rem}
.pie li+li{margin-top:.45rem}
.pie address{font-style:normal;font-size:.96rem;line-height:1.55}
.pie__marca{font:700 1.4rem/1 var(--serif);color:#fff;margin:0 0 .4rem}
.pie__sub{font-size:.95rem;margin:0}
.pie__copy{margin:30px 0 0;padding-top:18px;border-top:1px solid rgba(251,245,234,.25);font-size:.88rem;color:#D8C9D6}
.pie__copy strong{font-weight:600;color:#fff}

/* ---------- Responsive ---------- */
@media (max-width:960px){
  .hero__grid,.metodo,.editorial{grid-template-columns:1fr}
  .editorial__lateral{position:static;max-width:420px}
  .grid-articulos{grid-template-columns:repeat(2,1fr)}
  .tarjeta--destacada{grid-column:span 2}
  .pie__grid{grid-template-columns:1fr 1fr}
}
@media (max-width:640px){
  body{font-size:1rem}
  .contenedor,.contenedor-estrecho{padding-inline:16px}
  .aviso-superior .contenedor{flex-direction:column;gap:8px}
  .grid-articulos,.datos,.relacionados ul,.pie__grid{grid-template-columns:1fr}
  .tarjeta--destacada{grid-column:auto;flex-direction:column}
  .tarjeta--destacada .tarjeta__arte{aspect-ratio:16/9;min-height:0}
  .tarjeta--destacada .tarjeta__cuerpo{padding:18px 20px 22px}
  .criterio{grid-template-columns:3rem 1fr;gap:6px 14px}
  .criterio::before{font-size:2rem;grid-row:1}
  .criterio__icono{width:44px;height:44px;grid-column:2;grid-row:1}
  .criterio>div:last-child{grid-column:1 / -1}
  .documento{padding-inline:16px}
  .documento table{display:block;overflow-x:auto}
  .menu a{padding:.6rem .7rem}
}
@media print{
  .menu,.saltar,.aviso-superior__sello{display:none}
  body{background:#fff}
  .pie{background:#fff;color:#000}
  .pie a,.pie h2,.pie__marca,.pie__aviso p:first-child{color:#000}
}