/* Metoteka · sitio v2 · marca nueva (2026-11-01): papel cálido, minimalista, línea de 1 px, letra grande,
   fotos de casa sin personas y un solo tema claro (sin modo oscuro). Parte del sitio.css del paquete de marca
   (capas v2 a v4 del blog de prueba) y cierra con la capa v5 de abajo, que es la que manda.
   Color por tema: html[data-tema="casa|habitos|carga"] cambia el acento y el color del logo.
   Dorado #CFA729: solo en los cuadraditos (el último de la M y el punto del nombre). No es color de interfaz. */
:root{
  --papel:#FBF7EF; --hoja:#FFFDF8; --linea:#E3DACA; --tinta:#2A2724; --suave:#57514A;
  --hecho:#3B3833; --minimo:#8E887E; --vacio:#E9E3D8; --vacio-borde:#B9B1A4; --oro:#CFA729;
  --casa:#B9472A; --sobre-btn:#FFFCF6; --nota:#FFF4C9;
  --prox1:#2F6E73; --prox2:#6B4F7A; --prox3:#3D5A8C;
  --f-tit:"Lora",Georgia,"Times New Roman",serif;
  --f-txt:"Figtree",system-ui,-apple-system,"Segoe UI",sans-serif;
  --f-marca:"Quicksand","Figtree",system-ui,sans-serif;
  --f-mano:"Figtree",system-ui,sans-serif;
  --r:14px; --ancho:1040px;
  color-scheme:light;
}

*,*::before,*::after{box-sizing:border-box}
[hidden]{display:none!important}
html{-webkit-text-size-adjust:100%;scroll-padding-top:16px}
body{margin:0;background-color:var(--papel);color:var(--tinta);font-family:var(--f-txt);font-size:17px;line-height:1.55;
  background-image:linear-gradient(var(--linea) 1px,transparent 1px),linear-gradient(90deg,var(--linea) 1px,transparent 1px);
  background-size:28px 28px;background-attachment:fixed;overflow-x:hidden}
h1,h2,h3{font-family:var(--f-tit);margin:0;text-wrap:balance;font-variation-settings:"wdth" 88;line-height:1.1}
h1{font-size:clamp(2rem,6vw,3.1rem);font-weight:750;font-variation-settings:"wdth" 80;line-height:1.02}
h2{font-size:clamp(1.45rem,3.6vw,2rem);font-weight:700}
h3{font-size:1.2rem;font-weight:700}
p{margin:0}
img,svg{max-width:100%;height:auto}
a{color:inherit;text-decoration-thickness:1px;text-underline-offset:3px}
a:hover{text-decoration-thickness:2px}
:focus-visible{outline:3px solid var(--tinta);outline-offset:3px;border-radius:4px}
ul,ol{margin:0;padding-left:1.2em}
.sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.saltar{position:absolute;left:12px;top:-60px;z-index:20;background:var(--hecho);color:var(--sobre-btn);padding:10px 14px;border-radius:10px;font-weight:700}
.saltar:focus{top:12px}

/* Cabecera */
.cab{background:var(--hoja);border-bottom:1px solid var(--linea);position:relative;z-index:5}
.cab-in{max-width:var(--ancho);margin:0 auto;padding:10px 16px;display:flex;align-items:center;gap:16px;justify-content:space-between}
.marca{display:inline-flex;align-items:center;gap:10px;text-decoration:none;color:var(--tinta);min-height:44px}
.marca img{width:28px;height:28px}
.marca span{font-family:var(--f-marca);font-weight:600;font-size:1.3rem;letter-spacing:.005em}
.logo-o{display:none}
.nav{display:none;align-items:center;gap:4px;font-size:.95rem;font-weight:600}
.nav a{text-decoration:none;padding:10px 10px;border-radius:10px;min-height:44px;display:inline-flex;align-items:center}
.nav a:hover{background:var(--papel)}
.nav a[aria-current="page"]{text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:6px}
.nav .entrar{border:2px solid var(--tinta);padding:8px 14px;margin-left:6px}
.idioma{font-size:.85rem;color:var(--suave);display:inline-flex;align-items:center;gap:2px;margin-left:6px}
.idioma a{padding:10px 6px;min-height:44px;display:inline-flex;align-items:center}
.menu{position:relative}
.menu summary{list-style:none;cursor:pointer;font-weight:700;border:2px solid var(--tinta);border-radius:12px;padding:8px 14px;min-height:44px;display:flex;align-items:center;gap:8px}
.menu summary::-webkit-details-marker{display:none}
.menu summary .sq{width:12px;height:12px}
.menu[open] summary .sq{background:var(--hecho)}
.menu-cuerpo{position:absolute;right:0;top:calc(100% + 8px);background:var(--hoja);border:1px solid var(--linea);border-radius:var(--r);padding:8px;display:grid;min-width:230px;box-shadow:0 1px 0 var(--linea)}
.menu-cuerpo a{text-decoration:none;padding:12px 12px;border-radius:10px;font-weight:600;min-height:44px}
.menu-cuerpo a:hover{background:var(--papel)}
.menu-cuerpo .idioma{border-top:1px solid var(--linea);margin:6px 0 0;padding-top:4px}
@media (min-width:900px){.nav{display:flex}.menu{display:none}}

/* Estructura */
.envuelve{max-width:var(--ancho);margin:0 auto;padding:24px 16px 56px;display:grid;gap:20px}
.hoja{background:var(--hoja);border:1px solid var(--linea);border-radius:var(--r);padding:clamp(20px,4vw,40px);display:grid;gap:18px;min-width:0}
.hoja.tostada{background:var(--papel);background-image:linear-gradient(var(--linea) 1px,transparent 1px),linear-gradient(90deg,var(--linea) 1px,transparent 1px);background-size:14px 14px}
.lomo{border-left:8px solid var(--casa)}
.bloque{display:grid;gap:12px;min-width:0}
.dos{display:grid;gap:20px}
.tres{display:grid;gap:12px}
@media (min-width:760px){.dos{grid-template-columns:minmax(0,7fr) minmax(0,5fr);align-items:center}.dos.par{grid-template-columns:1fr 1fr;align-items:start}.tres{grid-template-columns:repeat(3,minmax(0,1fr))}}
.eti{font-family:var(--f-tit);font-size:.78rem;font-weight:650;letter-spacing:.12em;text-transform:uppercase;color:var(--suave)}
.debajo{font-size:.9rem;color:var(--suave)}
.fuente{font-size:.85rem;color:var(--suave)}
.grande{font-size:1.12rem}
.mano{font-family:var(--f-mano);font-size:2.1rem;line-height:1;transform:rotate(-3deg);transform-origin:left center;display:inline-block;justify-self:start;color:var(--suave)}
.nota{background:var(--nota);border-radius:10px;padding:12px 16px;font-size:.92rem}
.lista{display:grid;gap:6px}

/* Botones */
.btn{font:700 1rem var(--f-txt);background:var(--hecho);color:var(--sobre-btn);border:2px solid var(--hecho);border-radius:12px;padding:14px 22px;min-height:52px;cursor:pointer;text-decoration:none;display:inline-flex;align-items:center;justify-content:center;gap:10px;text-align:center}
.btn:hover{text-decoration:underline}
.btn.linea{background:transparent;color:var(--tinta);border-color:var(--tinta)}
.btn .sq{width:14px;height:14px;background:transparent;box-shadow:inset 0 0 0 2px currentColor}
.botones{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.enlace-flecha{font-weight:700}

/* Casillas (registro) */
.sq{display:inline-block;width:18px;height:18px;border-radius:20%;background:var(--vacio);box-shadow:inset 0 0 0 1px var(--vacio-borde);flex:none}
.sq.h{background:var(--hecho);box-shadow:none}.sq.m{background:var(--minimo);box-shadow:none}.sq.o{background:var(--oro);box-shadow:none}
.sq.hoy{outline:1.5px solid var(--tinta);outline-offset:2px}
.registro{display:grid;gap:8px;justify-items:start}
.registro .fila{display:flex;gap:10px}
.registro .dias{display:flex;gap:10px;font-size:.8rem;color:var(--suave)}
.registro .dias span{width:40px;text-align:center}
.registro .dias b{width:40px;text-align:center;color:var(--tinta);font-weight:800}
.registro .rot{display:flex;gap:10px;font-size:.72rem;color:var(--suave);min-height:1.2em}
.registro .rot span{width:40px;text-align:center}
.registro .fila .sq{width:40px;height:40px}
.registro .fila .sq.hoy{outline:2px solid var(--tinta);outline-offset:3px}
.registro .cuenta{font-family:var(--f-tit);font-weight:750;font-size:1.5rem;font-variant-numeric:tabular-nums;font-variation-settings:"wdth" 82}
.registro .cuenta small{font-family:var(--f-txt);font-weight:500;font-size:.95rem;color:var(--suave)}
@media (max-width:420px){.registro .fila,.registro .dias,.registro .rot{gap:7px}.registro .fila .sq,.registro .dias span,.registro .dias b,.registro .rot span{width:34px}.registro .fila .sq{height:34px}}
.sello{animation:sello .42s cubic-bezier(.2,.9,.25,1)}
@keyframes sello{0%{transform:scale(1.22)}100%{transform:scale(1)}}
@media (prefers-reduced-motion:reduce){.sello{animation:none}}
.leyenda{display:flex;flex-wrap:wrap;gap:8px 18px;font-size:.9rem;color:var(--suave);padding:0;list-style:none}
.leyenda li{display:flex;align-items:center;gap:8px}

/* Legales */
.borrador{background:var(--nota);border:2px dashed var(--suave);border-radius:12px;padding:12px 16px;font-weight:700}
.legal h2{font-size:1.3rem;margin-top:10px}
.legal ol{display:grid;gap:8px}


.pl-banda{background:var(--nota);border-bottom:1px solid var(--linea);font-size:.92rem}
.pl-banda p{max-width:var(--ancho);margin:0 auto;padding:10px 16px}
.pl-pend{display:block;font-family:var(--f-txt);font-size:.75rem;font-weight:700;letter-spacing:.02em;color:var(--suave);background:var(--nota);border-radius:6px;padding:2px 8px;justify-self:start;width:max-content;max-width:100%}

/* Pie */
.pie{border-top:1px solid var(--linea);background:var(--hoja)}
.pie-in{max-width:var(--ancho);margin:0 auto;padding:28px 16px 36px;display:grid;gap:22px;font-size:.92rem}
@media (min-width:760px){.pie-in{grid-template-columns:1.3fr 1fr 1fr}}
.pie h2{font-family:var(--f-tit);font-size:.8rem;letter-spacing:.12em;text-transform:uppercase;color:var(--suave);font-weight:650;margin-bottom:8px}
.pie ul{list-style:none;padding:0;display:grid;gap:2px}
.pie ul a{display:inline-flex;min-height:36px;align-items:center}
.pie .vende{color:var(--suave)}
.pie .firma{grid-column:1/-1;display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;border-top:1px solid var(--linea);padding-top:16px}

/* ---------- Blog ---------- */
.con-lateral{display:grid;gap:24px;min-width:0}
@media (min-width:960px){.con-lateral{grid-template-columns:minmax(0,1fr) 300px;align-items:start}}
.columna{display:grid;gap:20px;min-width:0}
.intro{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 18px;padding:4px 4px 0}
.intro p{max-width:62ch;color:var(--suave)}
.titulo-lista{font-size:1.3rem;margin:8px 0 2px}
.tarjetas{display:grid;gap:16px;grid-template-columns:repeat(auto-fill,minmax(min(100%,260px),1fr))}
.tarjeta{background:var(--hoja);border:1px solid var(--linea);border-radius:var(--r);overflow:hidden;display:grid;grid-template-rows:auto 1fr;min-width:0}
.tarjeta-img{margin:0;aspect-ratio:16/9;background:var(--papel);overflow:hidden;border-bottom:1px solid var(--linea);display:grid;place-items:center}
.tarjeta-img svg,.tarjeta-img img,.cabecera-img svg,.cabecera-img img{display:block;width:100%;height:100%;object-fit:cover}
.ilus-lomo{fill:var(--c)}
.tarjeta-txt{padding:16px 18px 20px;display:grid;gap:8px;align-content:start}
.tarjeta h3{font-size:1.25rem}
.tarjeta h2 a,.tarjeta h3 a{text-decoration:none}
.tarjeta h2 a:hover,.tarjeta h3 a:hover{text-decoration:underline}
.tarjeta p{color:var(--suave);font-size:.98rem}
.tarjeta.destacado{grid-template-rows:auto}
.tarjeta.destacado .tarjeta-txt{padding:20px 22px 24px;gap:10px}
.tarjeta.destacado h2{font-size:clamp(1.7rem,4.4vw,2.4rem);font-weight:750;font-variation-settings:"wdth" 82}
.tarjeta.destacado p{font-size:1.06rem}
@media (min-width:760px){.tarjeta.destacado{grid-template-columns:1.15fr 1fr}.tarjeta.destacado .tarjeta-img{aspect-ratio:auto;min-height:100%;border-bottom:0;border-right:1px solid var(--linea);background-image:linear-gradient(var(--linea) 1px,transparent 1px),linear-gradient(90deg,var(--linea) 1px,transparent 1px);background-size:14px 14px}.tarjeta.destacado .tarjeta-img svg{height:auto}}
.leer{justify-self:start;min-height:44px;padding:10px 18px}
.meta{display:flex;flex-wrap:wrap;align-items:center;gap:4px 8px;font-size:.85rem;color:var(--suave)}
.cat{font-weight:700;text-decoration:none;color:var(--c);display:inline-flex;align-items:center;gap:6px}
.cat::before{content:"";width:10px;height:10px;border-radius:2px;background:var(--c)}
.cat:hover{text-decoration:underline}
.paginacion{display:flex;flex-wrap:wrap;gap:6px;align-items:center;justify-content:center;margin-top:8px}
.paginacion a,.paginacion span{min-width:44px;min-height:44px;display:inline-flex;align-items:center;justify-content:center;padding:0 12px;border-radius:10px;border:1px solid var(--linea);background:var(--hoja);text-decoration:none;font-weight:600}
.paginacion span[aria-current]{background:var(--hecho);color:var(--sobre-btn);border-color:var(--hecho)}
.vacio{background:var(--hoja);border:1px dashed var(--vacio-borde);border-radius:var(--r);padding:18px}
.cabecera-lista{display:grid;gap:6px}

/* Barra lateral */
.lateral{display:grid;gap:16px;min-width:0}
.widget{background:var(--hoja);border:1px solid var(--linea);border-radius:var(--r);padding:18px;display:grid;gap:10px}
.widget h2{font-family:var(--f-tit);font-size:.8rem;letter-spacing:.12em;text-transform:uppercase;color:var(--suave);font-weight:650}
.widget ul{list-style:none;padding:0;display:grid;gap:4px}
.widget li{display:flex;flex-wrap:wrap;gap:2px 8px;align-items:baseline}
.widget li a{min-height:36px;display:inline-flex;align-items:center;gap:8px}
.widget li time{font-size:.8rem;color:var(--suave);width:100%}
.widget .recientes li a{min-height:0;padding:4px 0}
.punto{width:10px;height:10px;border-radius:2px;background:var(--c);display:inline-block}
.cuenta-n{font-size:.85rem;color:var(--suave)}
.buscador{display:flex;gap:8px}
.buscador input{flex:1;min-width:0;font:inherit;font-size:1rem;padding:10px 12px;min-height:44px;border-radius:10px;border:1.5px solid var(--vacio-borde);background:var(--papel);color:var(--tinta)}
.buscador button{font:700 .95rem var(--f-txt);border-radius:10px;border:2px solid var(--hecho);background:var(--hecho);color:var(--sobre-btn);padding:0 14px;min-height:44px;cursor:pointer}
.nube{display:flex;flex-wrap:wrap;gap:6px}
.nube a{font-size:.88rem;text-decoration:none;border:1px solid var(--linea);background:var(--papel);border-radius:999px;padding:6px 12px;min-height:36px;display:inline-flex;align-items:center}
.nube a:hover{border-color:var(--tinta)}
.cats-grandes{list-style:none;padding:0;display:grid;gap:12px;grid-template-columns:repeat(auto-fill,minmax(min(100%,240px),1fr))}
.cats-grandes li{background:var(--hoja);border:1px solid var(--linea);border-left:8px solid var(--c);border-radius:var(--r);padding:16px 18px;display:grid;gap:6px}
.cats-grandes a{font-family:var(--f-tit);font-weight:700;font-size:1.25rem}

/* Artículo */
.articulo{gap:16px}
.migas ol{list-style:none;padding:0;margin:0;display:flex;flex-wrap:wrap;gap:4px;font-size:.85rem;color:var(--suave)}
.migas li+li::before{content:"›";margin-right:4px}
.migas a{display:inline-block;padding:4px 0}
.bajada{font-size:1.15rem;color:var(--suave);max-width:62ch}
.cabecera-img{margin:4px 0 0;aspect-ratio:16/9;border-radius:12px;overflow:hidden;border:1px solid var(--linea);background:var(--papel)}
.toc{background:var(--papel);border-radius:12px;padding:14px 18px;display:grid;gap:6px;max-width:68ch}
.toc ol{display:grid;gap:2px}
.toc a{display:inline-block;padding:4px 0}
.prosa{max-width:68ch;display:grid;gap:16px;min-width:0}
.prosa h2{margin-top:16px;scroll-margin-top:16px}
.prosa h3{margin-top:6px}
.prosa p,.prosa li{font-size:1.08rem;line-height:1.7}
.prosa ul{display:grid;gap:8px}
.consejo{border-left:4px solid var(--casa);background:var(--papel);border-radius:0 12px 12px 0;padding:16px 18px;display:grid;gap:8px}
.consejo h2{margin:0}
.caja-fuentes{border:1px solid var(--linea);background:var(--papel);border-radius:12px;padding:16px 18px;display:grid;gap:8px;max-width:68ch}
.caja-fuentes h2{font-size:1.1rem}
.fuentes{font-size:.9rem;color:var(--suave);display:grid;gap:8px;padding-left:1.2em;margin:0}
.fuentes a{word-break:break-word}
.etiquetas-art{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.etiquetas-art > span{font-weight:700;font-size:.9rem;margin-right:4px}
.autor{display:grid;grid-template-columns:auto 1fr;gap:14px;align-items:start;border-top:1px solid var(--linea);border-bottom:1px solid var(--linea);padding:16px 0;max-width:68ch}
.autor img{width:44px;height:44px}
.autor p{color:var(--suave);font-size:.95rem}
.compartir{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.compartir > span{font-weight:700;font-size:.9rem;margin-right:4px}
.compartir a,.compartir button{font:600 .9rem var(--f-txt);color:var(--tinta);text-decoration:none;border:1.5px solid var(--tinta);background:transparent;border-radius:10px;padding:8px 14px;min-height:44px;display:inline-flex;align-items:center;cursor:pointer}
.relacionados{display:grid;gap:12px}

/* Comentarios */
.comentarios{display:grid;gap:16px;max-width:68ch}
.comentarios-lista{list-style:none;padding:0;margin:0;display:grid;gap:12px}
.comentario{background:var(--papel);border-radius:12px;padding:14px 16px;display:grid;gap:6px}
.comentario .quien{font-weight:700}
.comentario .quien time{font-weight:400;font-size:.85rem;color:var(--suave);margin-left:8px}
.comentario .texto{white-space:pre-line;overflow-wrap:anywhere}
.comentario .respuesta{margin:6px 0 0 14px;border-left:3px solid var(--casa);background:var(--hoja);border-radius:0 10px 10px 0;padding:10px 14px;display:grid;gap:4px}
.form-com{display:grid;gap:14px;background:var(--hoja);border:1px solid var(--linea);border-radius:var(--r);padding:18px}
.campo{display:grid;gap:6px;font-weight:600}
.campo small{font-weight:400;color:var(--suave)}
.campo input,.campo textarea{font:inherit;font-weight:400;font-size:1rem;padding:10px 12px;min-height:44px;border-radius:10px;border:1.5px solid var(--vacio-borde);background:var(--papel);color:var(--tinta);width:100%}
.campo textarea{min-height:140px;resize:vertical}
.chk{display:grid;grid-template-columns:auto 1fr;gap:10px;align-items:start;font-size:.95rem}
.chk input{width:22px;height:22px;margin:1px 0 0;accent-color:var(--hecho)}
.trampa{position:absolute!important;left:-9999px;width:1px;height:1px;overflow:hidden}
.estado-com{font-weight:600}
.estado-com.ok{color:var(--bien,#2F6B3E)}
.estado-com.error{color:var(--alerta,#9A3B2A)}

/* Suscripción, encuesta y aviso de cookies */
.suscribir{display:grid;gap:10px;max-width:68ch}
.suscribir h2{font-size:1.35rem}
.articulo .suscribir,.encuesta{border:2px solid var(--tinta);border-radius:var(--r);padding:18px;background:var(--hoja)}
.suscribir.compacta{gap:8px}
.suscribir.compacta h2{font-family:var(--f-tit);font-size:1.05rem;letter-spacing:0;text-transform:none;color:var(--tinta);font-weight:700}
.widget .suscribir.compacta .chk{font-size:.85rem}
.form-sus{display:grid;gap:12px}
.encuesta{display:grid;gap:10px;max-width:68ch}
.encuesta h2{font-size:1.35rem}
.enc-ops{display:grid;gap:8px;grid-template-columns:repeat(auto-fit,minmax(min(100%,150px),1fr))}
.op-enc{font:600 1rem var(--f-txt);background:var(--papel);color:var(--tinta);border:2px solid var(--linea);border-radius:12px;padding:12px 14px;min-height:48px;cursor:pointer;text-align:left}
.op-enc:hover{border-color:var(--tinta)}
.op-enc[aria-pressed="true"]{border-color:var(--tinta);background:var(--hoja)}
.barras{list-style:none;padding:0;display:grid;gap:8px}
.barras li{display:grid;grid-template-columns:minmax(0,9em) 1fr auto;gap:10px;align-items:center;font-size:.95rem}
.b-barra{height:12px;border-radius:4px;background:var(--vacio);overflow:hidden}
.b-barra span{display:block;height:100%;background:var(--hecho)}
.b-val{font-variant-numeric:tabular-nums;font-weight:700}
.enlace-boton{font:inherit;color:inherit;background:none;border:0;padding:0;min-height:36px;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.aviso-cookies{position:fixed;left:0;right:0;bottom:0;z-index:30;padding:0 12px 12px;pointer-events:none}
.aviso-in{pointer-events:auto;max-width:760px;margin:0 auto;background:var(--hoja);border:2px solid var(--tinta);border-radius:var(--r);padding:16px 18px;display:grid;gap:10px;box-shadow:0 1px 0 var(--linea);max-height:80vh;overflow:auto}
.ck-bot .btn{flex:1 1 140px}
.ck-conf{display:grid;gap:10px}
.tabla{width:100%;border-collapse:collapse;font-size:.95rem}
.tabla th,.tabla td{text-align:left;vertical-align:top;padding:10px 12px;border-bottom:1px solid var(--linea)}
.tabla th{font-family:var(--f-tit);font-weight:700}
.tabla-envuelve{overflow-x:auto;border:1px solid var(--linea);border-radius:12px;max-width:100%}
.tabla-envuelve:focus-visible{outline:3px solid var(--tinta)}
.tarjeta.destacado{border-left:8px solid var(--c)}
.tarjeta.destacado .ilus-lomo{display:none}


/* ===== v2 · Papel cálido limpio (31-10 / 01-11): sin cuadrícula de fondo, títulos en Lora, un solo acento (salvia) ===== */
:root{--papel:#FBF7EF;--hoja:#FFFDF8;--linea:#E8DFCF;--tinta:#2A2724;--suave:#5E5852;--hecho:#2A2724;--acento:#3E7D4E;--acento-sobre:#FFFFFF;--acento-claro:#E3EDE2;--f-tit:"Lora",Georgia,"Times New Roman",serif;--r:18px}
body{background-image:none}
h1,h2,h3{font-variation-settings:normal;font-weight:600;letter-spacing:-.01em;line-height:1.15}
h1{font-size:clamp(2.1rem,6.4vw,3.4rem);line-height:1.08}
h2{font-size:clamp(1.5rem,3.6vw,2rem)}
.btn{background:var(--acento);color:var(--acento-sobre);border-color:var(--acento);border-radius:6px;letter-spacing:.08em;text-transform:uppercase;font-size:.9rem}
.btn:hover{text-decoration:none;filter:brightness(.92)}
.btn.linea{background:transparent;color:var(--tinta);border-color:var(--tinta)}
/* aviso superior y cabecera */
.aviso-sup{background:var(--acento-claro);text-align:center;padding:6px 12px;line-height:1.1}
.aviso-sup .mano{font-size:1.6rem;transform:none;color:var(--tinta);display:inline-block}
.cab{background:var(--papel);border-bottom:1px solid var(--linea)}
.cab-in{padding:14px 16px}
.marca span{font-family:var(--f-marca);font-size:1.5rem}
.nav{gap:2px;font-size:.78rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase}
.nav a[aria-current="page"]{text-decoration:none;box-shadow:inset 0 -3px 0 var(--acento);border-radius:0}
.nav a:hover{background:transparent;box-shadow:inset 0 -3px 0 var(--linea)}
/* portada */
.hero{display:grid;gap:28px;align-items:center;background:var(--hoja);border:1px solid var(--linea);border-radius:var(--r);padding:clamp(24px,5vw,56px);overflow:hidden}
.hero-txt{display:grid;gap:18px;justify-items:start}
.hero h1{max-width:18ch}
.hero p{max-width:46ch;font-size:1.12rem;color:var(--suave)}
.sello{width:clamp(150px,34vw,260px);aspect-ratio:1;border-radius:50%;background:var(--acento);display:grid;place-items:center;justify-self:center}
.sello img{width:58%;height:auto;background:var(--papel);border-radius:22%;padding:8%}
@media (min-width:760px){.hero{grid-template-columns:1.4fr 1fr}.sello{justify-self:end}}
.titulo-lista{margin-top:12px}
/* tarjetas y barra lateral */
.tarjeta{border-radius:var(--r);box-shadow:0 1px 0 var(--linea)}
.tarjeta h3,.tarjeta.destacado h2{font-weight:600;font-variation-settings:normal}
.tarjeta.destacado{border-left-width:1px}
.widget{background:transparent;border:0;border-top:1px solid var(--linea);border-radius:0;padding:18px 0 4px}
.widget h2{font-family:var(--f-tit);font-style:italic;font-weight:500;font-size:1.25rem;letter-spacing:0;text-transform:none;color:var(--tinta)}
.widget li a{font-size:.8rem;letter-spacing:.12em;text-transform:uppercase;font-weight:600;text-decoration:none}
.widget li a:hover{text-decoration:underline}
.eti{letter-spacing:.14em}
.pie{background:var(--hoja)}

/* ===== v2.1 · más de hogar: letras más grandes, menú sin mayúsculas, sin cuadrícula ===== */
body{font-size:18px;line-height:1.62}
.nav{font-size:1rem;font-weight:600;letter-spacing:0;text-transform:none;gap:6px}
.btn{letter-spacing:0;text-transform:none;font-size:1.05rem;border-radius:999px;padding:14px 28px}
.widget li a{font-size:1rem;letter-spacing:0;text-transform:none;font-weight:600}
.eti{letter-spacing:.04em;text-transform:none;font-size:.9rem}
.hero h1{max-width:12ch}
.ilus-hogar{justify-self:center;width:min(100%,340px)}
.ilus-hogar svg{display:block;width:100%;height:auto}
@media (min-width:760px){.ilus-hogar{justify-self:end}}
.tarjeta-img,.tarjeta.destacado .tarjeta-img{background-image:none;background-color:var(--acento-claro)}
.aviso-sup{background:var(--acento-claro)}

@media (min-width:760px){.hero{grid-template-columns:1fr 1fr}.ilus-hogar{width:100%;max-width:420px}}

/* ===== v3 · minimalista: casi sin color, líneas finas (1 px) ===== */
:root{--acento:#2A2724;--acento-sobre:#FBF7EF;--acento-claro:transparent;--linea:#E3DACA}
h1,h2,h3{font-weight:500}
.cab{border-bottom:1px solid var(--linea)}
.nav a[aria-current="page"]{box-shadow:inset 0 -1px 0 var(--tinta)}
.nav a:hover{box-shadow:inset 0 -1px 0 var(--suave)}
.btn{background:transparent;color:var(--tinta);border:1px solid var(--tinta);font-weight:600;box-shadow:none}
.btn:hover{background:var(--tinta);color:var(--papel);filter:none}
.hero{background:transparent;border:0;border-bottom:1px solid var(--linea);border-radius:0;padding:clamp(28px,6vw,64px) 0}
.ilus-hogar{color:var(--tinta)}
.tarjeta,.tarjeta.destacado{background:transparent;border:1px solid var(--linea);border-left:1px solid var(--linea);box-shadow:none;border-radius:6px}
.tarjeta-img,.tarjeta.destacado .tarjeta-img{background:transparent!important;border-color:var(--linea)}
.ilus-lomo{fill:var(--tinta);opacity:.35}
.cat{color:var(--suave);font-weight:600}
.cat::before,.punto{background:var(--tinta);opacity:.5;width:7px;height:7px;border-radius:50%}
.cats-grandes li{background:transparent;border-left:1px solid var(--linea);border-radius:6px}
.widget{border-top:1px solid var(--linea)}
.widget h2{font-weight:400}
.chip,.nube a,.nube span{background:transparent;border:1px solid var(--linea)}
.hoja{background:transparent;border:1px solid var(--linea);border-radius:6px;box-shadow:none}
input,select,textarea{border:1px solid var(--linea)}
.buscador button,button.btn{border-radius:999px}
.pie{background:transparent;border-top:1px solid var(--linea)}
.pie .firma{border-top:1px solid var(--linea)}

/* ===== v3.1 · un color sutil (terracota apagada) en los detalles ===== */
:root{--acento:#B9472A;--acento-sobre:#FBF7EF}
.nav a[aria-current="page"]{box-shadow:inset 0 -2px 0 var(--acento)}
.nav a:hover{box-shadow:inset 0 -2px 0 var(--acento)}
.btn:hover{background:var(--acento);border-color:var(--acento);color:var(--acento-sobre)}
a:hover{color:var(--acento)}
.cat::before,.punto{opacity:.9}
.hero .btn{border-color:var(--acento);color:var(--acento)}
.hero .btn:hover{color:var(--acento-sobre)}
.ilus-hogar img{display:block;width:100%;height:auto;border-radius:6px}
.tarjeta-img img{width:100%;height:100%;object-fit:cover;display:block}
.hero{border-bottom-color:var(--acento)}
@media (min-width:760px){.hero{grid-template-columns:1fr 1.15fr}.ilus-hogar{max-width:none}}

/* ===== v4 · detalle editorial y movimiento sutil ===== */
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
h1,h2,h3{text-wrap:balance}
p,li{text-wrap:pretty}
body{font-size:18px;line-height:1.65}
.hero h1{font-size:clamp(2.6rem,5.4vw,4.3rem);line-height:1.04;letter-spacing:-.015em;max-width:11ch}
.hero{padding:clamp(32px,7vw,88px) 0 clamp(24px,4vw,48px);border-bottom:0}
.ilus-hogar img{aspect-ratio:5/4;object-fit:cover;border-radius:3px}
@media (min-width:760px){.hero{grid-template-columns:1fr 1.1fr;gap:clamp(24px,5vw,72px)}}
.tira{display:flex;gap:5px;margin:0 0 clamp(32px,6vw,64px)}
.tira i{width:11px;height:11px;border:1px solid var(--tinta);border-radius:2.5px;opacity:.7}
.tira i:nth-child(-n+4){background:var(--tinta);opacity:.8}
.tira i.r{background:var(--acento);border-color:var(--acento);opacity:1}
.titulo-lista{margin:clamp(32px,5vw,56px) 0 18px}
.tarjeta{transition:border-color .2s}
.tarjeta-img{overflow:hidden;aspect-ratio:16/10}
.tarjeta-img img{transition:scale .6s cubic-bezier(.2,.7,.2,1)}
.tarjeta:has(a:hover) .tarjeta-img img,.tarjeta:has(a:focus-visible) .tarjeta-img img{scale:1.035}
.tarjeta:has(a:hover),.tarjeta:has(a:focus-visible){border-color:var(--acento)}
.tarjeta h2 a,.tarjeta h3 a{text-decoration:none;background:linear-gradient(currentColor,currentColor) 0 100%/0 1px no-repeat;transition:background-size .3s}
.tarjeta h2 a:hover,.tarjeta h3 a:hover{background-size:100% 1px;text-decoration:none}
.widget h2{font-style:normal;font-weight:500}
a,button{transition:color .15s,background-color .15s,border-color .15s}
.widget li a,.pie ul a,.nube a{min-height:44px}
.progreso{position:fixed;top:0;left:0;right:0;height:2px;background:var(--acento);transform-origin:0 50%;transform:scaleX(0);z-index:30;pointer-events:none}
@supports (animation-timeline:scroll()){.progreso{animation:prog linear both;animation-timeline:scroll(root)}}
@keyframes prog{to{transform:scaleX(1)}}
@media (prefers-reduced-motion:no-preference){
  @supports (animation-timeline:view()){.tarjeta,.hoja{animation:ent linear both;animation-timeline:view();animation-range:entry 0% entry 35%}}
  @keyframes ent{from{opacity:0;translate:0 14px}}
  @view-transition{navigation:auto}
}

.hero h1{max-width:none;font-size:clamp(2.3rem,4.2vw,3.3rem)}
@media (min-width:760px){.hero{grid-template-columns:1.05fr 1fr;gap:clamp(20px,3vw,40px)}}

/* logo completo */
.marca .logo-full{width:auto;height:46px;display:block;color:var(--acento)}
.marca:hover{text-decoration:none}

/* ===== color por tema: el logo y el acento cambian según la página ===== */
html[data-tema="casa"]{--acento:#B9472A}
html[data-tema="habitos"]{--acento:#3E7D4E}
html[data-tema="carga"]{--acento:#1E2D5A}

/* ===== v5 · marca nueva 2026-11-01: un solo tema claro, colores explícitos, logo nuevo y fotos ===== */
:root{--papel:#FBF7EF;--hoja:#FFFDF8;--linea:#E3DACA;--tinta:#2A2724;--suave:#5E5852;--hecho:#2A2724;--sobre-btn:#FBF7EF;
  --oro:#CFA729;--casa:#B9472A;--habitos:#3E7D4E;--carga:#1E2D5A;--acento:#B9472A;--acento-sobre:#FBF7EF;--acento-claro:transparent;
  --vacio:#F1EBE0;--vacio-borde:#C9C0B2;--minimo:#8E887E;--nota:#FFF4C9;color-scheme:light}
html{background-color:#FBF7EF;color:#2A2724}
body{background-color:var(--papel);background-image:none;color:var(--tinta)}
html[data-tema="casa"]{--acento:#B9472A}
html[data-tema="habitos"]{--acento:#3E7D4E}
html[data-tema="carga"]{--acento:#1E2D5A}
/* logo: <svg class="logo-full"><use href="/assets/metoteka-logo.svg#logo"/></svg>; la M toma el color del tema */
.marca{color:var(--tinta)}
.marca .logo-full{height:40px;width:auto;display:block;color:var(--acento)}
.pie .marca .logo-full{height:34px}
@media (max-width:420px){.marca .logo-full{height:34px}}
.menu summary{border:1px solid var(--tinta);border-radius:999px;font-weight:600}
.menu summary .sq{border-radius:20%;box-shadow:inset 0 0 0 1px var(--tinta);background:transparent}
.menu[open] summary .sq{background:var(--acento);box-shadow:none}
.menu-cuerpo{border-radius:6px}
/* categoría: un punto chico con su color (la única nota de color en tarjetas y listas) */
.cat::before,.punto{background:var(--c,var(--tinta));opacity:1;width:8px;height:8px;border-radius:50%}
.cats-grandes li{border-left:3px solid var(--c,var(--linea))}
/* fotos */
.tarjeta-img,.cabecera-img{background:#EFE7DA}
.cabecera-img{border-radius:6px}
.cabecera-img img{display:block;width:100%;height:100%;object-fit:cover}
.autor img{border-radius:0}
/* botones y piezas con borde de 1 px */
.articulo .suscribir,.encuesta,.aviso-in{border:1px solid var(--linea);border-radius:6px}
.compartir a,.compartir button,.op-enc{border-width:1px}
.buscador input,.campo input,.campo textarea{border:1px solid var(--linea);background:var(--hoja)}
.buscador button{background:transparent;color:var(--tinta);border:1px solid var(--tinta)}
.buscador button:hover{background:var(--acento);border-color:var(--acento);color:var(--acento-sobre)}
.paginacion span[aria-current]{background:var(--tinta);border-color:var(--tinta);color:var(--papel)}
.consejo,.comentario .respuesta{border-left-color:var(--acento)}
.lomo{border-left-color:var(--acento)}
.sq.hoy,.registro .fila .sq.hoy{outline-width:1px}
.saltar{background:var(--tinta);color:var(--papel)}