/* Casa Clara: papel de plano, azul cobalto, amarillo de marcador y un plano de casa que es el menú */
:root{
 --paper:#f6f8fc;--ink:#18223d;--ink-soft:#4b5675;--line:#c8d2ea;--tint:#e6ecfb;
 --link:#2a43a5;--accent:#ffcd2e;--accent-ink:#2f2400;--focus:#2a43a5;--radius:3px;
 --font-head:"Young Serif",Georgia,"Times New Roman",serif;
 --font-body:"Figtree",system-ui,-apple-system,"Segoe UI",sans-serif;
 --font-ui:"Figtree",system-ui,-apple-system,"Segoe UI",sans-serif;
 --body-size:17.5px;--body-lh:1.7;--measure:68ch;--wrap:1160px;--brand-weight:400;
}
@media (prefers-color-scheme:dark){
 :root{--paper:#0e1530;--ink:#e8ecfa;--ink-soft:#aab4d6;--line:#29376a;--tint:#172150;--link:#a3b4ff;--focus:#ffcd2e}
}
body{background-image:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px);background-size:32px 32px;background-attachment:fixed;background-blend-mode:normal}
.site-header{background-color:var(--paper)}
.site-footer{background:var(--tint)}
main{background:linear-gradient(var(--paper),var(--paper));}
.logo .l1{fill:none;stroke:var(--link);stroke-width:2.4;stroke-linejoin:round}
.logo .l2{fill:none;stroke:var(--accent);stroke-width:2.8}
@media (prefers-color-scheme:dark){.logo .l1{stroke:var(--accent)}}
.motif{color:var(--link)}
.motif *{fill:none;stroke:currentColor;stroke-width:2}
.article-head .cat a{color:var(--link);font-weight:700}
.row-title{font-weight:400}
.prose h2{font-weight:400}
.btn{background:var(--link);border-color:var(--link);color:#fff}
.btn-ghost{background:transparent;color:var(--link)}
.btn:hover{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}
@media (prefers-color-scheme:dark){.btn{color:#0e1530;background:var(--link);border-color:var(--link)}.btn-ghost{color:var(--link);background:transparent}}

/* Portada */
.hero{padding:clamp(2.2rem,6vw,4.5rem) 0 clamp(2.5rem,5vw,4rem);background:var(--paper);border-bottom:2px solid var(--ink)}
.hero-grid{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(2rem,5vw,4rem);align-items:center}
.hero h1{font-size:clamp(2.4rem,5.6vw,4.3rem);font-weight:400;letter-spacing:-.02em;line-height:1.05;margin-bottom:1.3rem}
.hero-sub{font-size:1.25em;color:var(--ink-soft);max-width:30ch;margin-bottom:1.8rem}
.plan{display:block;width:100%;color:var(--ink);background:var(--paper);border:2px solid var(--ink)}
.plan .furn rect,.plan .furn circle{fill:none;stroke:var(--ink-soft);stroke-width:1.6;opacity:.7}
.plan .room rect{fill:transparent;stroke:var(--ink);stroke-width:5;transition:fill .15s}
.plan .room:hover rect,.plan .room:focus-visible rect{fill:var(--accent)}
.plan .room:focus-visible{outline:none}
.plan .room:focus-visible rect{stroke:var(--link);stroke-width:7}
.plan .rn{font:400 25px var(--font-head);fill:var(--ink);pointer-events:none}
.plan .rc{font:600 15px var(--font-ui);fill:var(--ink-soft);pointer-events:none}
.plan .room:hover .rn,.plan .room:hover .rc{fill:var(--accent-ink)}
@media (prefers-color-scheme:dark){.plan .room:hover rect{fill:var(--accent)}}
.plan-list{display:none;list-style:none;margin:0;padding:0;border:2px solid var(--ink)}
.plan-list a{display:flex;justify-content:space-between;align-items:baseline;padding:.95rem 1rem;color:var(--ink);text-decoration:none;font:400 1.25rem var(--font-head);background:var(--paper)}
.plan-list li+li a{border-top:1px solid var(--line)}
.plan-list small{font:600 .85rem var(--font-ui);color:var(--ink-soft)}
.plan-note{font:400 .88rem var(--font-ui);color:var(--ink-soft);margin:.7rem 0 0}
@media (max-width:900px){.hero-grid{grid-template-columns:1fr}.hero-sub{max-width:none}}
@media (max-width:600px){.plan{display:none}.plan-list{display:block}.plan-note{display:none}}

.block{padding:clamp(2.5rem,6vw,4rem) 0 0}
.block-title{font-size:clamp(1.6rem,3vw,2.2rem);font-weight:400;margin-bottom:1.4rem;display:inline-block;background:linear-gradient(transparent 62%,var(--accent) 62% 92%,transparent 92%);padding:0 .2rem}
@media (prefers-color-scheme:dark){.block-title{background:linear-gradient(transparent 62%,rgba(255,205,46,.35) 62% 92%,transparent 92%)}}
.featured{list-style:none;margin:0;padding:0;display:grid;gap:.9rem}
.featured a{display:grid;grid-template-columns:minmax(0,1fr);gap:.25rem;padding:1rem 1.2rem;background:var(--paper);border:1.5px solid var(--ink);border-left:8px solid var(--accent);color:var(--ink);text-decoration:none}
.featured a:hover{background:var(--tint)}
.ft{font:400 1.35rem/1.2 var(--font-head)}
.fd{color:var(--ink-soft);font-size:.97em;max-width:70ch}

.grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,1fr);gap:0;border-top:1.5px solid var(--ink);border-left:1.5px solid var(--ink)}
.grid li{border-right:1.5px solid var(--ink);border-bottom:1.5px solid var(--ink);background:var(--paper)}
.grid a{display:block;height:100%;padding:1.2rem 1.3rem 1.3rem;color:var(--ink);text-decoration:none}
.grid a:hover{background:var(--tint)}
.g-cat{display:block;font:700 .85rem var(--font-ui);color:var(--link);margin-bottom:.4rem}
.g-title{display:block;font:400 1.3rem/1.2 var(--font-head);margin-bottom:.5rem}
.g-desc{display:block;color:var(--ink-soft);font-size:.95em}
@media (max-width:700px){.grid{grid-template-columns:1fr}}

.principles{margin-top:clamp(3rem,7vw,5rem);background:var(--tint);border-top:2px solid var(--ink);border-bottom:2px solid var(--ink);padding:clamp(2.5rem,6vw,4rem) 0}
.pr-grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:2rem}
.pr-grid strong{display:block;font:400 1.25rem var(--font-head);margin-bottom:.5rem}
.pr-grid span{font-size:.97em;color:var(--ink-soft)}
@media (max-width:900px){.pr-grid{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.pr-grid{grid-template-columns:1fr}}

/* Contenido legible sobre el papel cuadriculado */
.list-page,.prose-page,.article{background:var(--paper);padding-top:.1rem;margin-top:0}
.article.wrap,.list-page.wrap,.prose-page.wrap{padding-inline:clamp(1rem,3vw,2.2rem);border-inline:1px solid var(--line)}
