/* Huematzin — hoja de estilo común (casa, calendario, cuentos) */
:root{
  --ink:#17130F; --ink-soft:#241D16; --ink-line:#3A2F24;
  --paper:#EFE2C3; --paper-dim:#E4D5B0;
  --jade:#4C8A76; --jade-dim:#396456; --cochineal:#B24638; --gold:#C99A4E;
  --ink-text:#D9CDB8; --ink-text-dim:#9C9080;
  color-scheme:dark;
}
*{box-sizing:border-box}
html{scroll-padding-top:72px}
body{margin:0;background:var(--ink);color:var(--ink-text);font-family:'Inter',system-ui,sans-serif;font-size:17px;line-height:1.7;-webkit-font-smoothing:antialiased;
  padding-bottom:env(safe-area-inset-bottom,0px)}
a{color:var(--gold)}
.display{font-family:'Fraunces',Georgia,serif;font-optical-sizing:auto}
.wrap{max-width:760px;margin:0 auto;padding:0 20px}
.wrap-wide{max-width:1040px;margin:0 auto;padding:0 20px}
@media (min-width:640px){.wrap,.wrap-wide{padding:0 28px}}

/* Navegación común */
.topnav{position:sticky;top:0;z-index:10;background:rgba(23,19,15,.94);backdrop-filter:blur(6px);border-bottom:1px solid var(--ink-line);padding-top:env(safe-area-inset-top,0px)}
.topnav .wrap-wide{display:flex;align-items:center;gap:6px 18px;flex-wrap:wrap;min-height:56px;padding-block:8px}
.topnav .brand{font-family:'Fraunces',serif;font-size:21px;color:var(--paper);text-decoration:none;margin-right:auto;font-weight:500}
.topnav nav{display:flex;gap:4px 16px;flex-wrap:wrap}
.topnav nav a{color:var(--ink-text-dim);text-decoration:none;font-size:15px;padding:4px 0;border-bottom:2px solid transparent}
.topnav nav a:hover{color:var(--paper)}
.topnav nav a[aria-current="page"]{color:var(--paper);border-bottom-color:var(--gold)}

/* Portada */
.hero{padding:72px 0 56px;position:relative;overflow:hidden}
.hero-eyebrow{color:var(--gold);font-size:15px;margin:0 0 18px;font-family:'Fraunces',serif;font-style:italic}
h1.wordmark{font-size:clamp(52px,10vw,104px);font-weight:500;line-height:.98;margin:0 0 24px;color:var(--paper);letter-spacing:-.01em}
.hero-sub{font-size:19px;max-width:540px;margin:0}
.hero-sub em{color:var(--jade);font-style:normal;font-family:'Fraunces',serif}
.hero-glyph{position:absolute;right:-30px;top:20px;width:240px;opacity:.5}
@media (max-width:640px){.hero{padding:44px 0 36px}.hero-glyph{display:none}}

.section{padding:72px 0}
.section + .section{border-top:1px solid var(--ink-line)}
@media (max-width:640px){.section{padding:48px 0}}
.section-head{display:flex;justify-content:space-between;align-items:baseline;gap:16px;margin-bottom:36px;flex-wrap:wrap}
.section-head h2{font-family:'Fraunces',serif;font-weight:500;font-size:clamp(26px,4vw,38px);color:var(--paper);margin:0}
.section-head .count{font-size:14px;color:var(--ink-text-dim)}
.section-intro{max-width:620px;margin:-16px 0 36px;font-size:16px}

/* Puertas de la casa */
.doors{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:20px}
.door{display:flex;flex-direction:column;gap:10px;background:var(--ink-soft);border:1px solid var(--ink-line);border-top:3px solid var(--c,var(--gold));
  padding:26px 24px;text-decoration:none;color:var(--ink-text);transition:transform .15s ease,border-color .15s ease}
.door:hover{transform:translateY(-2px);border-color:var(--c,var(--gold))}
.door .tag{font-family:'Fraunces',serif;font-style:italic;font-size:14px;color:var(--c,var(--gold));margin:0}
.door h3{font-family:'Fraunces',serif;font-weight:500;font-size:25px;color:var(--paper);margin:0;line-height:1.2}
.door p{margin:0;font-size:15px;color:var(--ink-text-dim)}
.door .go{margin-top:auto;font-size:14px;color:var(--paper)}

/* Tarjetas de amate */
.codex-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:24px}
.codex-card{background:var(--paper);color:var(--ink);padding:30px 26px;position:relative;
  clip-path:polygon(0% 1.5%,3% 0%,97% .8%,100% 2.2%,99.3% 98%,96% 100%,4% 99.2%,.6% 97.5%)}
.codex-card .tag{font-family:'Fraunces',serif;font-style:italic;font-size:14px;color:var(--jade-dim);margin:0 0 12px}
.codex-card h3{font-family:'Fraunces',serif;font-weight:500;font-size:23px;margin:0 0 12px;line-height:1.25}
.codex-card h3 a{color:inherit}
.codex-card p{font-size:15px;color:#4A4032;margin:0 0 16px}
.codex-card .meta{font-size:13px;color:#7A6E58;border-top:1px solid #D7C79E;padding-top:12px;margin:0}
.codex-card.jade{border-top:3px solid var(--jade)} .codex-card.cochineal{border-top:3px solid var(--cochineal)}
.card-top{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}
.fav-btn{background:none;border:none;cursor:pointer;font-size:22px;line-height:1;padding:2px;color:#A8996D;flex-shrink:0}
.fav-btn.is-fav{color:var(--cochineal)} .fav-btn:disabled{cursor:default;opacity:.5}

/* Tonalpohualli */
.tonal-card{background:linear-gradient(180deg,var(--ink-soft) 0%,var(--ink) 100%);border:1px solid var(--ink-line);padding:36px 32px;display:grid;grid-template-columns:auto 1fr;gap:32px;align-items:center}
.tonal-glyph-box{width:130px;height:130px;border:2px solid var(--gold);border-radius:50%;display:flex;align-items:center;justify-content:center;background:var(--ink)}
.tonal-glyph-box svg{width:80px;height:80px}
.tonal-eyebrow{font-family:'Fraunces',serif;font-style:italic;color:var(--gold);font-size:14px;margin:0 0 6px}
.tonal-text h3{font-family:'Fraunces',serif;font-weight:500;font-size:clamp(28px,4vw,36px);color:var(--paper);margin:0 0 4px}
.tonal-date{font-size:14px;color:var(--ink-text-dim);margin:0 0 14px}
.tonal-note{font-size:14px;max-width:62ch;margin:0}
.tonal-note strong{color:var(--jade);font-weight:500}
@media (max-width:600px){.tonal-card{grid-template-columns:1fr;text-align:center;justify-items:center;padding:28px 20px}}

.signs{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px}
.sign{border:1px solid var(--ink-line);background:var(--ink-soft);padding:12px 14px}
.sign b{display:block;color:var(--paper);font-family:'Fraunces',serif;font-weight:500;font-size:17px}
.sign small{color:var(--ink-text-dim);font-size:13px}
.sign .n{float:right;color:var(--gold);font-size:13px;font-variant-numeric:tabular-nums}
.sign.today{border-color:var(--gold);box-shadow:inset 0 0 0 1px var(--gold)}
.trecena{display:flex;flex-wrap:wrap;gap:8px}
.trecena span{border:1px solid var(--ink-line);padding:6px 10px;font-size:14px;font-variant-numeric:tabular-nums}
.trecena span.today{border-color:var(--gold);color:var(--paper)}
.picker{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin:0 0 20px}
input[type=date],input[type=email]{background:var(--ink-soft);border:1px solid var(--ink-line);color:var(--ink-text);padding:9px 12px;border-radius:3px;font:inherit;font-size:15px}
.btn{background:var(--jade-dim);border:none;color:var(--paper);padding:9px 16px;border-radius:3px;font:inherit;font-size:14px;font-weight:500;cursor:pointer;text-decoration:none;display:inline-block}
.btn:hover{background:var(--jade)}
.btn.ghost{background:transparent;border:1px solid var(--ink-line);color:var(--ink-text-dim)}
:focus-visible{outline:2px solid var(--gold);outline-offset:2px}

/* Cuento */
.story{background:var(--ink-soft);padding:48px 36px;clip-path:polygon(0% .8%,2% 0%,98% .4%,100% 1.2%,99.6% 99.1%,98% 100%,2% 99.6%,0% 98.8%)}
.story h3{font-family:'Fraunces',serif;font-weight:500;font-size:15px;color:var(--gold);margin:0 0 6px;font-style:italic}
.story .title{font-family:'Fraunces',serif;font-size:28px;color:var(--paper);font-weight:500;margin:0 0 20px;line-height:1.2}
.story h4{font-family:'Fraunces',serif;font-weight:500;font-size:18px;color:var(--jade);margin:30px 0 8px}
.story p{font-size:16px;margin:0 0 14px;max-width:62ch}
.story .closing{font-family:'Fraunces',serif;font-style:italic;color:var(--paper-dim);font-size:19px;margin-top:22px}
@media (max-width:640px){.story{padding:32px 20px}}

/* Cuenta */
.account-bar{padding:14px 0;border-bottom:1px solid var(--ink-line)}
.account-inner{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.account-inner .brand-mini{font-family:'Fraunces',serif;font-style:italic;font-size:15px;color:var(--gold)}
.auth-form{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.auth-form input{width:min(240px,100%)}
.signed-in{display:flex;align-items:center;gap:12px;font-size:14px;flex-wrap:wrap}
.auth-msg{font-size:13px;color:var(--jade)}

.manifesto{padding:8px 0 64px;border-bottom:1px solid var(--ink-line)}
.manifesto p{font-family:'Fraunces',serif;font-style:italic;font-size:clamp(21px,3.2vw,28px);line-height:1.5;color:var(--paper-dim);max-width:680px;margin:0 0 22px}
.manifesto .signoff{font-family:'Inter',sans-serif;font-style:normal;font-size:15px;color:var(--ink-text-dim)}
.values{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:32px}
.value h3{font-family:'Fraunces',serif;font-weight:500;font-size:19px;color:var(--paper);margin:0 0 8px}
.value p{font-size:15px;color:var(--ink-text-dim);margin:0}
footer{padding:56px 0 calc(56px + env(safe-area-inset-bottom,0px));border-top:1px solid var(--ink-line)}
footer .foot-line{font-family:'Fraunces',serif;font-style:italic;font-size:18px;color:var(--paper-dim);max-width:480px;margin:0 0 18px}
footer .foot-meta{font-size:13px;color:var(--ink-text-dim)}
footer nav{display:flex;gap:6px 18px;flex-wrap:wrap;margin:0 0 18px}
footer nav a{color:var(--ink-text-dim);font-size:14px}

/* Signos ilustrados del calendario: SVG locales, sin dependencias externas. */
.sign-glyph{display:block;width:76px;height:76px;margin:4px auto 12px}
.sign-glyph svg{display:block;width:100%;height:100%}
.tonal-glyph-box svg{width:94px;height:94px}