/* Content pages — brand-consistent, standalone (no dependency on the React build) */
:root{
  --ivory:#f7f2eb; --paper:#fbf8f4; --taupe:#927867; --ink:#463a34;
  --muted:#6d5c52; --soft:#8a7a70; --line:#ddd0c5; --sand:#efe6db;
  --ff-display:"Playfair Display",Georgia,serif;
  --ff-label:"Manrope","DM Sans",system-ui,sans-serif;
  --ff-body:"DM Sans",system-ui,-apple-system,sans-serif;
}
*{box-sizing:border-box}
html{overflow-x:clip;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--ivory);color:var(--ink);font-family:var(--ff-body);
  line-height:1.75;overflow-x:clip}
img{max-width:100%;height:auto;display:block}
a{color:inherit}

/* header */
.hdr{position:sticky;top:0;z-index:40;display:flex;align-items:center;justify-content:space-between;
  gap:16px;padding:16px 5.5vw;background:rgba(246,243,239,.96);border-bottom:1px solid rgba(36,28,26,.13);
  -webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}
.hdr-brand{display:flex;align-items:center;gap:11px;text-decoration:none}
.hdr-mark{width:34px;height:42px;flex:0 0 auto}
.hdr-word b{display:block;font:500 13px/1 var(--ff-label);letter-spacing:.19em;color:var(--ink)}
.hdr-word small{display:block;margin-top:4px;font:600 6px/1 var(--ff-label);letter-spacing:.5em;color:var(--taupe)}
.hdr-cta{font:600 10px var(--ff-label);letter-spacing:.14em;text-transform:uppercase;color:var(--ink);
  text-decoration:none;border-bottom:1px solid rgba(70,58,52,.45);padding-bottom:6px;white-space:nowrap}
.hdr-cta:hover{color:var(--taupe);border-color:var(--taupe)}

/* breadcrumb */
.crumb{padding:18px 5.5vw 0;font:500 10.5px var(--ff-label);letter-spacing:.12em;
  text-transform:uppercase;color:var(--soft)}
.crumb a{color:var(--soft);text-decoration:none}
.crumb a:hover{color:var(--taupe)}
.crumb span{margin:0 8px;opacity:.6}

/* hero */
.phero{padding:clamp(34px,5vw,60px) 5.5vw clamp(28px,4vw,46px);max-width:1180px;margin:0 auto}
.phero .eyebrow{margin:0 0 12px;font:600 10.5px var(--ff-label);letter-spacing:.24em;
  text-transform:uppercase;color:var(--taupe)}
.phero h1{margin:0 0 20px;font:400 clamp(36px,5.4vw,68px)/1.06 var(--ff-display);
  letter-spacing:-.015em;max-width:17ch}
.phero .standfirst{margin:0;font-size:clamp(17px,1.7vw,20px);line-height:1.68;color:var(--muted);max-width:62ch}

/* article */
.wrap{max-width:1180px;margin:0 auto;padding:0 5.5vw clamp(60px,7vw,100px)}
.article{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:clamp(32px,5vw,72px);align-items:start}
.prose{min-width:0;max-width:72ch}
.prose h2{margin:clamp(40px,4.5vw,62px) 0 16px;font:400 clamp(26px,3vw,38px)/1.18 var(--ff-display)}
.prose h2:first-child{margin-top:0}
.prose h3{margin:34px 0 10px;font:500 17px/1.4 var(--ff-label);letter-spacing:.01em}
.prose p{margin:0 0 18px;font-size:16.5px;color:var(--muted)}
.prose strong{color:var(--ink);font-weight:600}
.prose ul,.prose ol{margin:0 0 20px;padding-inline-start:20px;color:var(--muted);font-size:16.5px}
.prose li{margin-bottom:9px}
.prose figure{margin:32px 0}
.prose figure img{border-radius:12px}
.prose figcaption{margin-top:10px;font:500 11.5px var(--ff-label);letter-spacing:.1em;
  text-transform:uppercase;color:var(--soft)}
.lede{font-size:18px!important;color:var(--ink)!important}

/* pull facts */
.facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:1px;
  background:var(--line);border:1px solid var(--line);margin:30px 0}
.facts div{background:var(--paper);padding:20px}
.facts b{display:block;font:400 28px/1 var(--ff-display);color:var(--ink);margin-bottom:7px}
.facts span{font:500 10.5px var(--ff-label);letter-spacing:.14em;text-transform:uppercase;color:var(--soft)}

/* callout */
.note{border-inline-start:3px solid var(--taupe);background:var(--paper);
  padding:18px 22px;margin:28px 0}
.note p{margin:0;font-size:15.5px}

/* side rail */
.rail{position:sticky;top:96px}
.rail-card{background:var(--paper);border:1px solid var(--line);padding:24px}
.rail-card h4{margin:0 0 8px;font:400 22px/1.2 var(--ff-display)}
.rail-card p{margin:0 0 18px;font-size:14px;color:var(--muted);line-height:1.65}
.rail-cta{display:block;text-align:center;padding:15px;background:var(--taupe);color:#fff;
  text-decoration:none;font:600 10.5px var(--ff-label);letter-spacing:.16em;text-transform:uppercase}
.rail-cta:hover{background:#7d6a5e}
.rail-links{margin-top:26px;border-top:1px solid var(--line);padding-top:20px}
.rail-links p{margin:0 0 12px;font:600 10px var(--ff-label);letter-spacing:.16em;
  text-transform:uppercase;color:var(--soft)}
.rail-links a{display:block;padding:8px 0;font-size:14.5px;color:var(--muted);text-decoration:none;
  border-bottom:1px solid rgba(221,208,197,.6)}
.rail-links a:hover{color:var(--taupe)}

/* closing cta */
.endcta{background:var(--sand);padding:clamp(52px,6vw,86px) 5.5vw;text-align:center}
.endcta h2{margin:0 0 14px;font:400 clamp(28px,3.4vw,44px)/1.15 var(--ff-display)}
.endcta p{margin:0 auto 26px;max-width:52ch;color:var(--muted)}
.endcta a{display:inline-block;padding:17px 32px;background:var(--taupe);color:#fff;text-decoration:none;
  font:600 11px var(--ff-label);letter-spacing:.16em;text-transform:uppercase}
.endcta a:hover{background:#7d6a5e}

/* footer */
.ftr{background:var(--ivory);border-top:1px solid var(--line);padding:46px 5.5vw 54px}
.ftr-nav{max-width:1180px;margin:0 auto;display:grid;
  grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:30px}
.ftr-nav h5{margin:0 0 14px;font:600 10px var(--ff-label);letter-spacing:.17em;
  text-transform:uppercase;color:var(--soft)}
.ftr-nav a{display:block;padding:5px 0;font-size:14.5px;color:var(--muted);text-decoration:none}
.ftr-nav a:hover{color:var(--taupe)}
.ftr-base{max-width:1180px;margin:38px auto 0;padding-top:24px;border-top:1px solid var(--line);
  font-size:12.5px;color:var(--soft);line-height:1.7}

@media (max-width:900px){
  .article{grid-template-columns:minmax(0,1fr);gap:40px}
  .rail{position:static}
}
@media (max-width:640px){
  .hdr{padding:14px 22px}
  .crumb,.phero,.wrap{padding-left:22px;padding-right:22px}
  .prose p,.prose ul,.prose ol{font-size:16px}
}