/* The Observance of the Sun — shared site stylesheet
   Used by all topic-cluster content pages. Homepage + original 8 pages
   carry their own inline CSS; this file powers everything built by the
   Content Engine from 2026-05-12 onward. */

*{margin:0;padding:0;box-sizing:border-box}
:root{
  --bg:#070608;--w1:#140e0a;--w2:#1e140e;
  --ember:#e8935a;--gold:#eab449;--sun:#fcd34d;--cream:#fef3c7;
  --text:#f5f0e8;--muted:#cdc5b8;--dim:#8a847c;
  --glass:rgba(255,255,255,0.05);--gb:rgba(255,255,255,0.08)
}
html{scroll-behavior:smooth;-webkit-font-smoothing:antialiased}
body{background:var(--bg);color:var(--text);font-family:'DM Sans',system-ui,sans-serif;font-weight:400;line-height:1.75;padding:0 1.5rem}
::selection{background:rgba(234,180,73,0.35)}
h1,h2,h3{font-family:'Playfair Display',Georgia,serif}
a{color:var(--gold);text-decoration:none;border-bottom:1px solid rgba(234,180,73,0.3);transition:all 0.2s}
a:hover{color:var(--ember);border-color:var(--ember)}
img{display:block;max-width:100%}

/* NAV */
.nav{max-width:760px;margin:0 auto;padding:1.5rem 0;display:flex;gap:1.4rem;flex-wrap:wrap;align-items:center;font-size:0.7rem;letter-spacing:2px;text-transform:uppercase;color:var(--dim);border-bottom:1px solid var(--gb)}
.nav a{color:var(--muted);border:none}
.nav a:hover{color:var(--gold)}
.nav a.active{color:var(--gold)}
.nav .brand{font-family:'Playfair Display',serif;font-size:0.9rem;color:var(--gold);letter-spacing:0;text-transform:none;font-weight:500;margin-right:auto}

/* MAIN */
main{max-width:680px;margin:0 auto;padding:3rem 0 5rem}
.kicker{font-size:0.6rem;letter-spacing:6px;text-transform:uppercase;color:var(--ember);margin-bottom:1rem}
h1{font-size:clamp(2.1rem,5.2vw,3.3rem);font-weight:600;line-height:1.07;margin-bottom:1.5rem;letter-spacing:-1px}
h1 i{color:var(--gold);font-style:italic}
.lede{font-size:1.13rem;color:var(--muted);margin-bottom:2.5rem;line-height:1.65}
h2{font-size:clamp(1.4rem,3.5vw,1.85rem);font-weight:500;margin:2.6rem 0 0.9rem;color:var(--cream);letter-spacing:-0.3px}
h2 i{color:var(--gold)}
h3{font-size:1.12rem;font-weight:500;color:var(--text);margin:1.6rem 0 0.5rem}
p{margin-bottom:1.15rem;color:var(--muted);font-size:1rem}
p strong{color:var(--text);font-weight:500}
em{color:var(--cream);font-style:italic}
ul,ol{margin:0 0 1.15rem 1.5rem;color:var(--muted)}
li{margin-bottom:0.5rem}

/* COMPONENTS */
.box{padding:1.4rem 1.6rem;margin:1.5rem 0;background:var(--glass);border-left:3px solid var(--ember);border-radius:6px;font-size:0.96rem}
.box p{margin-bottom:0.6rem}
.box p:last-child{margin-bottom:0}
.fact{display:grid;grid-template-columns:auto 1fr;gap:0.7rem 1.2rem;margin:1.5rem 0;padding:1.5rem;background:var(--glass);border:1px solid var(--gb);border-radius:8px;font-size:0.92rem}
.fact dt{color:var(--ember);letter-spacing:1px;text-transform:uppercase;font-size:0.62rem;padding-top:4px}
.fact dd{color:var(--text)}
.step{display:flex;gap:1.2rem;padding:1.4rem 0;border-bottom:1px solid var(--gb)}
.step:last-child{border-bottom:none}
.step-num{width:42px;height:42px;border-radius:50%;background:linear-gradient(135deg,rgba(232,147,90,0.15),rgba(234,180,73,0.08));border:1.5px solid rgba(232,147,90,0.3);display:flex;align-items:center;justify-content:center;font-family:'Playfair Display',serif;font-size:1.15rem;color:var(--gold);flex-shrink:0}
.step-body h3{margin-top:0}
.qa{padding:1.3rem 0;border-bottom:1px solid var(--gb)}
.qa:last-child{border-bottom:none}
.qa h2{font-size:1.08rem;font-weight:500;color:var(--cream);margin:0 0 0.6rem;font-family:'DM Sans',sans-serif}
.qa h2 .marker{color:var(--gold);font-family:'Playfair Display',serif;margin-right:8px;font-weight:600}
.qa p{font-size:0.96rem}
.cardgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:0.8rem;margin:1.5rem 0}
.linkcard{padding:1.3rem 1.2rem;background:var(--glass);border:1px solid var(--gb);border-radius:8px;text-decoration:none;color:inherit;transition:all 0.3s;display:block}
.linkcard:hover{border-color:rgba(232,147,90,0.3);transform:translateY(-3px);background:rgba(255,255,255,0.06)}
.linkcard h3{font-family:'Playfair Display',serif;font-size:1.05rem;color:var(--gold);margin:0 0 0.35rem;font-weight:500}
.linkcard p{font-size:0.8rem;color:var(--muted);line-height:1.5;margin:0}
.cta{display:inline-block;margin-top:0.5rem;padding:14px 32px;background:var(--ember);color:#0a0806;font-weight:600;font-size:0.75rem;letter-spacing:2.5px;text-transform:uppercase;border-radius:4px;border:none}
.cta:hover{background:var(--gold);border:none;color:#0a0806}
.cta-row{margin-top:2.5rem}
.related{margin-top:3rem;padding-top:2rem;border-top:1px solid var(--gb)}
.related .kicker{margin-bottom:1rem}

/* FOOTER */
footer{max-width:760px;margin:0 auto;padding:2rem 0;border-top:1px solid var(--gb);text-align:center;color:var(--dim);font-size:0.7rem}
footer .fnav{margin-bottom:0.8rem}
footer .fnav a{color:var(--dim);border:none;margin:0 7px;line-height:2}
footer .fnav a:hover{color:var(--gold)}
footer .legal{font-size:0.62rem;color:rgba(255,255,255,0.25);line-height:1.7;max-width:560px;margin:0 auto}