, no

, para que no la alcancen los selectores `header{…}` que esas páginas ya traen. */ .barra-sitio{border-bottom:1px solid var(--border);background:var(--bg);position:static} .barra-sitio .bar{padding:var(--s3) 0} /* Encabezado de página interior: la marca madre siempre a la izquierda y siempre enlazando a la portada del sitio; el producto viene después. */ .marca-padre{display:inline-flex;align-items:center;gap:var(--s3);flex-wrap:wrap} .marca-padre .mark{width:26px;height:26px;flex:none} .marca-padre .sep{color:var(--border-strong)} .marca-padre .producto{font-family:var(--serif);font-size:var(--t-lg);color:var(--muted);letter-spacing:-.01em} .marca-padre a{border:0} .marca-padre a:hover{color:var(--accent)} @media(max-width:560px){.marca-padre .sep,.marca-padre .madre{display:none}} nav.main{display:flex;gap:var(--s4);flex-wrap:wrap;align-items:baseline} nav.main a{font-size:var(--t-sm);color:var(--muted);border-bottom:1px solid transparent;padding-bottom:1px} nav.main a:hover{color:var(--accent);border-bottom-color:var(--accent)} nav.main a[aria-current]{color:var(--ink);border-bottom-color:var(--accent)} main{padding:var(--s6) 0 var(--s7)} .backbar{margin-bottom:var(--s4)} .backbar a{font-size:var(--t-sm);color:var(--soft);border:0} .backbar a:hover{color:var(--accent)} .site-foot{border-top:1px solid var(--border);margin-top:var(--s7); padding:var(--s5) 0 var(--s6);font-size:var(--t-xs);color:var(--soft);line-height:1.65} .site-foot .container{max-width:72ch} /* ---------------- marcas ---------------- */ .mark{display:block;overflow:visible} .mark .n-f{fill:var(--ink);stroke:none} .mark .n-o{fill:var(--bg);stroke:var(--ink);stroke-width:1.4} .mark .e{stroke:var(--ink);fill:none;stroke-width:1.4;stroke-linecap:round} .mark .e-dash{stroke-dasharray:3.2 3} .mark .e-dot{stroke-dasharray:.2 3.4} /* ---------------- frontispicio ---------------- Patrón obligatorio de toda portada de producto: marca · título · bajada · epígrafe · colofón */ .masthead{padding:var(--s6) 0 var(--s5);border-bottom:1px solid var(--border);margin-bottom:var(--s6)} .masthead .mark{width:104px;height:84px;margin-bottom:var(--s5)} .masthead h1{font-family:var(--serif);font-weight:400;font-size:var(--t-display);line-height:1.04; letter-spacing:-.022em;color:var(--ink);margin:0 0 var(--s3);max-width:15ch} .masthead .lede{font-family:var(--serif);font-size:var(--t-lg);line-height:1.5; color:var(--muted);max-width:52ch;margin:0 0 var(--s5)} .epigrafe{font-family:var(--serif);font-style:italic;font-size:var(--t-prose);line-height:1.6; color:var(--text);border-left:2px solid var(--accent);padding-left:var(--s4);max-width:58ch;margin:0} .colofon{display:flex;flex-wrap:wrap;gap:var(--s1) 0;font-size:var(--t-xs); letter-spacing:.03em;color:var(--soft);margin-top:var(--s5)} .colofon span{white-space:nowrap} .colofon span+span::before{content:"·";margin:0 var(--s2);color:var(--border-strong)} .colofon b{font-weight:400;color:var(--text);font-variant-numeric:tabular-nums} @media(max-width:640px){.masthead h1{font-size:32px}.masthead .mark{width:80px;height:64px}} /* ---------------- voz: serif ---------------- */ h1.title{font-family:var(--serif);font-size:var(--t-xl);line-height:1.2;letter-spacing:-.012em; color:var(--ink);margin:0 0 var(--s2);font-weight:400;max-width:26ch} h2.title{font-family:var(--serif);font-size:var(--t-lg);font-weight:400;color:var(--ink);margin:0 0 var(--s2)} .body-text{font-family:var(--serif);font-size:var(--t-prose);line-height:1.68; color:var(--text);max-width:68ch} .body-text p{margin:0 0 var(--s4)} .body-text p:last-child{margin-bottom:0} /* ---------------- aparato: sans ---------------- */ .section{margin-top:var(--s5)} .section h3{font-family:var(--sans);font-size:var(--t-xs);letter-spacing:.09em;text-transform:uppercase; color:var(--soft);margin:0 0 var(--s3);font-weight:500} .note{font-size:var(--t-sm);color:var(--muted);border-left:2px solid var(--border-strong); padding:var(--s1) 0 var(--s1) var(--s3);margin-bottom:var(--s4);max-width:70ch;line-height:1.6} .rotulo{font-family:var(--sans);font-size:var(--t-xs);letter-spacing:.09em; text-transform:uppercase;color:var(--soft)} .chip-wrap{display:flex;flex-wrap:wrap;gap:var(--s2);margin-top:var(--s3)} .chip{display:inline-flex;align-items:baseline;gap:var(--s2);font-size:var(--t-sm); padding:6px var(--s3);border:1px solid var(--border);border-radius:var(--r); background:var(--card);color:var(--text)} .chip:hover{border-color:var(--accent);color:var(--accent)} .chip .n{font-size:var(--t-xs);color:var(--soft)} .card{background:var(--card);border:1px solid var(--border);border-radius:var(--r); padding:var(--s4) var(--s5)} .area-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); gap:var(--s3);margin-top:var(--s3)} .area{display:flex;flex-direction:column;gap:var(--s1);border:1px solid var(--border); border-radius:var(--r);padding:var(--s4);background:var(--card)} .area:hover{border-color:var(--accent)} .area strong{font-family:var(--serif);font-weight:400;color:var(--ink);font-size:var(--t-prose)} .area .sub{font-size:var(--t-sm);color:var(--muted);line-height:1.5} .area.destacada{grid-column:1/-1;border-color:var(--border-strong);background:var(--tint); padding:var(--s5);gap:var(--s2)} .area.destacada strong{font-size:24px} .area.destacada .sub{font-size:var(--t-md);max-width:56ch} /* listas y tablas */ .rel-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:var(--s2)} .rel-list li{font-size:var(--t-sm);line-height:1.5} .rel-list .nota{color:var(--soft);font-style:italic;margin-left:var(--s2)} table.datos{width:100%;border-collapse:collapse;font-size:var(--t-sm);font-variant-numeric:tabular-nums} table.datos th{font-family:var(--sans);font-size:var(--t-xs);letter-spacing:.06em;text-transform:uppercase; color:var(--soft);font-weight:500;text-align:left;padding:var(--s2) var(--s3) var(--s2) 0; border-bottom:1px solid var(--border-strong)} table.datos td{padding:var(--s2) var(--s3) var(--s2) 0;border-bottom:1px solid var(--border);vertical-align:top} table.datos tr:hover td{background:var(--tint)} /* controles */ button,.btn{font-family:var(--sans);font-size:var(--t-sm);padding:7px var(--s4); border:1px solid var(--border-strong);border-radius:var(--r);background:var(--card); color:var(--text);cursor:pointer} button:hover,.btn:hover{border-color:var(--accent);color:var(--accent)} .btn-acc{background:var(--accent);color:var(--bg);border-color:var(--accent)} .btn-sm{font-size:var(--t-xs);padding:4px var(--s3)} input[type=search],input[type=text],select{font-family:var(--sans);font-size:var(--t-sm); padding:6px var(--s3);border:1px solid var(--border);border-radius:var(--r); background:var(--card);color:var(--text);outline:none} input:focus,select:focus{border-color:var(--accent)}