
:root{
  --bg:#f4efe8;
  --bg-soft:#efe7dc;
  --paper:#fbf8f3;
  --paper-2:#f1ebe2;
  --ink:#181512;
  --ink-soft:#28231f;
  --muted:#6a635a;
  --muted-2:#867d73;
  --rule:#d7cec1;
  --rule-strong:#cbbfad;
  --accent:#7a6957;
  --accent-2:#40372f;
  --accent-soft:#e9dfd2;
  --shadow:0 18px 40px rgba(24,21,18,.04);
  --radius:14px;
  --radius-sm:10px;
  --container:min(1240px, calc(100vw - 2.75rem));
  --measure:72ch;
  --measure-wide:84ch;
  --font-serif: "Iowan Old Style", "Palatino Linotype", "Book Antiqua", Baskerville, Georgia, ui-serif, serif;
  --font-sans: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  color:var(--ink);
  font-family:var(--font-sans);
  line-height:1.78;
  background:
    radial-gradient(circle at top right, rgba(122,105,87,.10), transparent 28%),
    linear-gradient(180deg, #f6f1ea 0%, var(--bg) 34%, #f6f2ec 100%);
  text-rendering:optimizeLegibility;
}
body::before{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  background:linear-gradient(180deg, rgba(255,255,255,.22), transparent 28%);
}
a{color:inherit;text-decoration:none}
a:hover{text-decoration:none}
img{max-width:100%}
.container{width:var(--container);margin-inline:auto}
.skip-link{position:absolute;left:-999px}
.skip-link:focus{left:1rem;top:1rem;background:#fff;padding:.8rem 1rem;border-radius:8px;z-index:99;border:1px solid var(--rule)}

.site-header{
  position:sticky; top:0; z-index:30;
  border-bottom:1px solid rgba(203,191,173,.7);
  background:rgba(246,241,234,.82);
  backdrop-filter:blur(14px);
}
.site-header.is-scrolled{background:rgba(246,241,234,.92)}
.header-inner{
  display:flex; align-items:center; justify-content:space-between;
  gap:1.5rem; min-height:84px;
}
.brand{
  display:flex; align-items:center; gap:.9rem;
  color:var(--ink); letter-spacing:.02em;
  min-width:0;
}
.brand-mark{
  width:34px; height:34px; border-radius:50%;
  border:1px solid var(--rule-strong);
  background:linear-gradient(180deg, rgba(255,255,255,.7), rgba(233,223,210,.9));
  position:relative;
  flex:0 0 auto;
}
.brand-mark:before,.brand-mark:after{
  content:""; position:absolute; background:var(--accent-2); border-radius:999px;
}
.brand-mark:before{width:2px;height:16px;left:12px;top:8px;transform:rotate(-8deg)}
.brand-mark:after{width:2px;height:16px;right:12px;top:8px;transform:rotate(8deg)}
.brand > div{
  display:flex;
  flex-direction:column;
  gap:.12rem;
  line-height:1;
  font-weight:700;
}
.brand > div:first-line{font-size:1rem}
.brand small{
  display:block;
  color:var(--muted);
  font-weight:500;
  font-size:.72rem;
  letter-spacing:.11em;
  text-transform:uppercase;
  line-height:1.25;
}
.desktop-nav{display:flex;gap:1.35rem;align-items:center;flex-wrap:wrap}
.desktop-nav a{
  color:var(--muted);
  padding:.25rem 0;
  font-size:.78rem;
  font-weight:600;
  letter-spacing:.16em;
  text-transform:uppercase;
  border-bottom:1px solid transparent;
  transition:color .16s ease, border-color .16s ease;
}
.desktop-nav a.active,.desktop-nav a:hover{
  color:var(--ink);
  border-color:var(--ink);
}
.mobile-toggle{
  display:none;
  border:0;
  background:transparent;
  padding:.45rem 0;
  font:inherit; color:var(--ink);
  text-transform:uppercase;
  letter-spacing:.14em;
  font-size:.78rem;
  font-weight:700;
}
.mobile-panel{display:none;padding:0 0 1rem}
.mobile-panel nav{display:grid;gap:.2rem;border-top:1px solid var(--rule);padding-top:.6rem}
.mobile-panel a{
  padding:.82rem 0;
  color:var(--muted);
  border-bottom:1px solid rgba(215,206,193,.7);
}
.mobile-panel a.active{color:var(--ink)}

main{padding-bottom:3.5rem}
.hero{padding:6rem 0 4rem}
.hero-grid{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(360px,.92fr);gap:3.5rem;align-items:end}
.hero-card,.panel,.callout,.card,.resource-card,.faq-card,.source-card,.sidebar,.cta-band,.read-path{
  background:rgba(251,248,243,.55);
  border:1px solid rgba(203,191,173,.75);
  border-radius:var(--radius);
  box-shadow:var(--shadow);
}
.home .hero .hero-card:first-child{
  background:none;
  border:0;
  box-shadow:none;
  padding:0;
}
.hero-card{padding:2.1rem}
.hero-card.hero-illustration{
  position:relative;
  overflow:hidden;
  min-height:560px;
  background:
    radial-gradient(circle at top right, rgba(233,223,210,.16), transparent 30%),
    linear-gradient(160deg, #1f1a17 0%, #2a241f 52%, #171412 100%);
  color:#f9f6f2;
  border-color:#2f2924;
  box-shadow:0 22px 60px rgba(24,21,18,.16);
}
.hero-card.hero-illustration::before,
.hero-card.hero-illustration::after{
  content:"";
  position:absolute;
  inset:auto;
  border-radius:50%;
  pointer-events:none;
}
.hero-card.hero-illustration::before{
  width:620px;height:620px;right:-200px;top:-120px;
  background:repeating-radial-gradient(circle at center, rgba(255,255,255,.08) 0 1px, transparent 1px 30px);
  opacity:.4;
}
.hero-card.hero-illustration::after{
  width:220px;height:220px;left:-50px;bottom:-80px;
  background:radial-gradient(circle at center, rgba(233,223,210,.25), transparent 62%);
}
.hero-note,.rule-list{position:relative;z-index:1}
.eyebrow,.kicker{
  display:inline-flex; align-items:center; gap:.55rem;
  color:var(--accent);
  font-size:.74rem;
  letter-spacing:.18em;
  text-transform:uppercase;
  font-weight:700;
}
.eyebrow::before,.kicker::before{
  content:"";
  width:2rem;height:1px;
  background:currentColor;
  opacity:.6;
}
.hero-card.hero-illustration .eyebrow{color:#d9ccb9}
.hero-card.hero-illustration .eyebrow::before{background:#d9ccb9}
.hero h1,.section h2,.content h2,.page-hero h1,.card h3,.resource-card h3,.faq-card h3,.source-card h3,.note-title,.read-path h3,.stat strong{
  font-family:var(--font-serif);
  font-weight:600;
  letter-spacing:-.03em;
  color:var(--ink-soft);
}
.hero h1{
  font-size:clamp(3.6rem, 8vw, 6.7rem);
  line-height:.93;
  margin:1.05rem 0 1.15rem;
  max-width:12ch;
}
.hero p{color:var(--muted);font-size:1.06rem;max-width:60ch;margin:0}
.hero .lede{font-size:1.14rem;max-width:58ch}
.actions{display:flex;flex-wrap:wrap;gap:.85rem;margin-top:1.65rem}
.button{
  display:inline-flex; align-items:center; justify-content:center;
  min-height:44px;
  padding:.9rem 1.2rem;
  border-radius:999px;
  font-weight:650;
  border:1px solid transparent;
  transition:transform .18s ease, background .18s ease, color .18s ease, border-color .18s ease;
}
.button:hover{transform:translateY(-1px)}
.button.primary{background:var(--ink);color:#fff}
.button.secondary{background:transparent;color:var(--ink);border-color:var(--rule-strong)}
.button.ghost{background:transparent;color:var(--ink);border-color:var(--rule)}
.badge-row,.tag-row{display:flex;flex-wrap:wrap;gap:.8rem;margin-top:1.25rem}
.badge,.tag{
  padding:0;
  border:0;
  border-radius:0;
  background:none;
  color:var(--muted-2);
  font-size:.82rem;
  font-weight:600;
  letter-spacing:.04em;
}
.badge:not(:last-child)::after,
.tag:not(:last-child)::after{
  content:"/";
  margin-left:.8rem;
  color:var(--rule-strong);
}
.hero-note{display:grid;gap:1.1rem}
.note-title{font-size:1.6rem;line-height:1.04;margin:0;color:#f6f1ea}
.rule-list{display:grid;gap:1rem;margin-top:auto;padding-top:2rem}
.rule-item{padding-top:1rem;border-top:1px solid rgba(233,223,210,.18)}
.rule-item:first-child{border-top:0;padding-top:0}
.rule-item strong{
  display:block;
  margin-bottom:.3rem;
  color:#d9ccb9;
  font-size:.72rem;
  text-transform:uppercase;
  letter-spacing:.18em;
}
.rule-item span{color:rgba(249,246,242,.8)}
.pullquote{font-family:var(--font-serif);font-size:clamp(1.7rem,3vw,2.45rem);line-height:1.06;letter-spacing:-.03em;margin:0;color:#f6f1ea}

.section{padding:3.6rem 0}
.section h2{font-size:clamp(2rem, 4vw, 3.55rem);line-height:.98;margin:0 0 .95rem}
.section-intro{max-width:var(--measure);color:var(--muted);margin:.15rem 0 0}
.grid-2,.grid-3,.grid-4{display:grid;gap:1.15rem}
.grid-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.grid-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.grid-4{grid-template-columns:repeat(4,minmax(0,1fr))}
.card,.resource-card,.faq-card,.source-card,.read-path{
  position:relative;
  padding:1.55rem;
  overflow:hidden;
  transition:transform .18s ease,border-color .18s ease,background .18s ease;
}
.card::before,.resource-card::before,.faq-card::before,.source-card::before,.read-path::before{
  content:"";
  position:absolute;
  left:1.55rem; right:1.55rem; top:0;
  height:2px; background:linear-gradient(90deg, var(--accent), transparent 72%);
  opacity:.5;
}
.card h3,.resource-card h3,.faq-card h3,.source-card h3{margin:.5rem 0 .55rem;font-size:1.42rem;line-height:1.04}
.card p,.resource-card p,.faq-card p,.source-card p,.read-path p{margin:0;color:var(--muted)}
.card:hover,.resource-card:hover,.faq-card:hover,.source-card:hover,.read-path:hover{
  transform:translateY(-2px);
  border-color:var(--accent);
}
.stats{gap:1rem}
.stat{
  padding:1.45rem 1.35rem 1.25rem;
  background:linear-gradient(180deg, rgba(251,248,243,.72), rgba(245,239,232,.46));
}
.stat strong{display:block;font-size:1.85rem;line-height:1.01;margin-bottom:.45rem}
.stat span{color:var(--muted)}

.page-hero{padding:4.2rem 0 2rem}
.page-hero .hero-card{
  background:none;
  border:0;
  border-radius:0;
  box-shadow:none;
  padding:0 0 1.7rem;
  border-bottom:1px solid var(--rule-strong);
}
.breadcrumbs{
  font-size:.74rem;
  color:var(--muted);
  margin-bottom:1rem;
  text-transform:uppercase;
  letter-spacing:.18em;
}
.breadcrumbs a{color:var(--muted)}
.page-hero h1{font-size:clamp(2.9rem, 6vw, 5rem);line-height:.95;margin:.95rem 0 .7rem;max-width:12ch}
.page-hero p{max-width:52ch;color:var(--muted);font-size:1.08rem}

.layout{
  display:grid;
  grid-template-columns:240px minmax(0, 760px);
  justify-content:space-between;
  gap:3rem;
  align-items:start;
}
.sidebar{
  position:sticky; top:104px;
  padding:0;
  background:none;
  border:0;
  box-shadow:none;
  border-radius:0;
}
.sidebar h3{
  margin:.15rem 0 1rem;
  font-size:.72rem;
  text-transform:uppercase;
  letter-spacing:.18em;
  color:var(--muted-2);
  font-weight:700;
}
.sidebar nav{display:grid;gap:0;border-top:1px solid var(--rule-strong)}
.sidebar a{
  display:block;
  padding:.92rem 0;
  border-radius:0;
  color:var(--muted);
  border-bottom:1px solid rgba(215,206,193,.72);
  transition:color .16s ease,padding-left .16s ease;
}
.sidebar a.active,.sidebar a:hover{background:none;color:var(--ink);padding-left:.4rem}
.content{min-width:0}
.content > section,.panel,.callout{
  padding:1.8rem 0 0;
  margin:0 0 2rem;
  background:none;
  border:0;
  border-top:1px solid rgba(203,191,173,.75);
  border-radius:0;
  box-shadow:none;
}
.content > section:last-child{margin-bottom:0}
.content h2{margin:.05rem 0 .8rem;font-size:2.1rem;line-height:1.02;max-width:var(--measure-wide)}
.content h3{
  margin:1.25rem 0 .42rem;
  font-size:1.18rem;
  font-family:var(--font-serif);
  letter-spacing:-.02em;
}
.content p,.content li{max-width:var(--measure)}
.content ul,.content ol{padding-left:1.2rem}
.content li{margin:.42rem 0}
.quick-answer{
  background:linear-gradient(180deg, rgba(241,235,226,.78), rgba(251,248,243,.62));
  border:1px solid rgba(203,191,173,.85);
  border-top-width:1px;
  border-radius:var(--radius);
  padding:1.35rem 1.45rem;
  box-shadow:var(--shadow);
}
.quick-answer h2{font-size:1.65rem}
.fact-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.9rem}
.fact{
  padding:1rem 1.05rem;
  border-radius:var(--radius-sm);
  background:rgba(251,248,243,.76);
  border:1px solid rgba(203,191,173,.62);
}
.fact strong{display:block;margin-bottom:.3rem}
.compare{
  overflow:auto;
  border:1px solid rgba(203,191,173,.85);
  border-radius:12px;
  background:rgba(251,248,243,.92);
}
.compare table{width:100%;border-collapse:collapse}
.compare th,.compare td{
  padding:1rem 1.05rem;
  text-align:left;
  vertical-align:top;
  border-bottom:1px solid rgba(215,206,193,.82);
}
.compare tr:last-child td{border-bottom:0}
.compare th{
  background:rgba(241,235,226,.9);
  font-size:.72rem;
  text-transform:uppercase;
  letter-spacing:.18em;
  color:var(--muted-2);
  font-weight:700;
}
.compare tbody tr{transition:background .16s ease}
.compare tbody tr:hover{background:rgba(233,223,210,.22)}
.compare caption{padding:1rem 1rem 0;text-align:left;color:var(--muted);caption-side:top}
.notice{
  padding:1rem 1.05rem;
  border-radius:12px;
  background:rgba(233,223,210,.55);
  border:1px solid rgba(203,191,173,.84);
}
.next-links{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem;margin-top:1.15rem}
.cta-band{padding:1.6rem;background:linear-gradient(135deg, rgba(233,223,210,.65), rgba(251,248,243,.72))}
.list-clean{list-style:none;padding:0;margin:0}
.list-clean li{padding:.6rem 0;border-bottom:1px solid rgba(203,191,173,.55)}
.list-clean li:last-child{border-bottom:0}
.source-card a.url{display:block;margin-top:.55rem;word-break:break-word;font-size:.92rem;color:var(--muted)}
.site-footer{margin-top:3rem;padding:3.2rem 0 3rem;border-top:1px solid var(--rule-strong)}
.footer-grid{display:grid;grid-template-columns:1.35fr .75fr .75fr .85fr;gap:1rem}
.footer-col h3{
  margin:.1rem 0 .7rem;
  font-size:.72rem;
  text-transform:uppercase;
  letter-spacing:.18em;
  color:var(--muted-2);
  font-weight:700;
}
.footer-col a{display:block;padding:.28rem 0;color:var(--muted);transition:color .16s ease,padding-left .16s ease}
.footer-col a:hover{color:var(--ink);padding-left:.2rem}
.footer-meta{margin-top:1rem;color:var(--muted);font-size:.92rem;max-width:72ch}
.search-box{
  width:100%; padding:.95rem 0;
  border:0; border-bottom:1px solid var(--rule-strong);
  border-radius:0; background:transparent; font:inherit;color:var(--ink)
}
.search-box:focus{outline:none;border-color:var(--ink)}
.editorial-columns{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.numbered{counter-reset:item;list-style:none;padding:0;margin:0;display:grid;gap:1rem}
.numbered li{
  position:relative;
  padding:1.1rem 1.2rem 1.1rem 4rem;
  border:1px solid rgba(203,191,173,.82);
  border-radius:12px;
  background:rgba(251,248,243,.84);
}
.numbered li:before{
  counter-increment:item;
  content:counter(item, decimal-leading-zero);
  position:absolute;
  left:1.15rem; top:1rem;
  color:var(--accent);
  font-family:var(--font-serif);
  font-size:1.15rem;
  line-height:1;
}
.read-path h3{margin:.2rem 0 .45rem;font-size:1.5rem}
.read-path ul{margin:.65rem 0 0;padding-left:1.15rem}
.muted{color:var(--muted)}
.centered{max-width:var(--measure)}
.minor{font-size:.95rem;color:var(--muted)}
.link-cluster{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem}

.home .section[data-added="seo-pathways"]{
  padding-top:0;
}
.home .section[data-added="seo-pathways"] .container{
  padding-top:2rem;
  border-top:1px solid rgba(203,191,173,.78);
}
.home .section[data-added="seo-pathways"] h2,
.home .section h2,
.home .section .kicker,
.home .read-path h3,
.home .stat strong{
  max-width:18ch;
}
.home .editorial-columns .read-path{
  min-height:100%;
}
.footer-note{display:none}

@media (max-width: 1100px){
  .hero-grid,.layout,.footer-grid,.grid-4,.grid-3,.editorial-columns,.next-links,.link-cluster{grid-template-columns:1fr}
  .grid-2,.fact-grid{grid-template-columns:1fr}
  .layout{gap:2rem}
  .sidebar{position:relative;top:auto}
}
@media (max-width: 980px){
  .desktop-nav{display:none}
  .mobile-toggle,.mobile-panel[data-open="true"]{display:block}
  .hero{padding-top:3.75rem}
  .hero-card.hero-illustration{min-height:420px}
}
@media (max-width: 760px){
  :root{--container:min(100vw - 1.4rem, 100vw - 1.4rem)}
  .header-inner{min-height:72px}
  .brand small{display:none}
  .hero{padding-top:3rem}
  .hero h1{font-size:clamp(2.7rem, 14vw, 4.3rem);max-width:none}
  .page-hero h1{max-width:none}
  .hero-card{padding:1.4rem}
  .section{padding:2.6rem 0}
  .page-hero{padding-top:2.6rem}
}
