/* Southwest Texas Commercial Real Estate Group */
:root{
  --ink:#14171a; --ink-2:#2b3136; --ink-3:#4a5158;
  --paper:#faf8f5; --paper-2:#f2eee8; --paper-3:#fffdfa;
  --line:#ddd6cb; --line-2:#e9e3da;
  --sand:#b0724a; --sand-dk:#8d5836; --sand-lt:#e8b98d;
  --muted:#6f7377;
  --max:1180px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{
  font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',system-ui,sans-serif;
  background:var(--paper);color:var(--ink);line-height:1.6;
  -webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;
}
img{max-width:100%;display:block}
a{color:inherit}
.wrap{max-width:var(--max);margin:0 auto;padding:0 32px}
h1,h2,h3,h4,.serif{font-family:'Fraunces',Georgia,'Times New Roman',serif;font-weight:400;letter-spacing:-.02em;line-height:1.12}
strong{font-weight:600}
.eyebrow{font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--sand);font-weight:600;margin-bottom:20px}
.eyebrow.light{color:var(--sand-lt)}
.skip{position:absolute;left:-9999px}
.skip:focus{left:16px;top:16px;background:var(--ink);color:var(--paper);padding:10px 16px;z-index:200}

/* ── nav ── */
.nav{position:sticky;top:0;z-index:100;background:rgba(250,248,245,.94);backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}
.nav-in{display:flex;align-items:center;justify-content:space-between;height:76px;gap:24px}
.brand{font-family:'Fraunces',serif;font-size:16.5px;line-height:1.15;text-decoration:none;flex-shrink:0}
.brand-wordmark b{font-weight:500;display:block;letter-spacing:-.01em;font-size:16.5px}
.brand-wordmark > span{font-size:9.5px;letter-spacing:.15em;text-transform:uppercase;color:var(--muted);
  font-family:'Inter',sans-serif;font-weight:500;display:block}
.nav-links{display:flex;gap:22px;align-items:center}
.nav-links a{text-decoration:none;font-size:13px;color:var(--ink-2);font-weight:450;
  transition:color .18s;white-space:nowrap}
.nav-links a.btn{padding:12px 20px;font-size:12.5px}
@media(max-width:1200px) and (min-width:981px){
  .nav-links{gap:16px}
  .nav-links a{font-size:12.5px}
}
.nav-links a:hover,.nav-links a.on{color:var(--sand)}
/* CTA inside nav must not inherit the nav link colour (specificity fix) */
.nav-links a.btn{color:var(--paper);font-weight:500}
.nav-links a.btn:hover{color:var(--paper);background:var(--sand);border-color:var(--sand)}
.nav-toggle{display:none;background:none;border:1px solid var(--line);padding:9px 13px;
  font-size:12px;font-family:inherit;cursor:pointer;color:var(--ink);letter-spacing:.06em}

/* ── buttons ── */
.btn{display:inline-block;background:var(--ink);color:var(--paper);padding:13px 26px;font-size:13px;
  font-weight:500;letter-spacing:.02em;text-decoration:none;border:1px solid var(--ink);
  transition:.18s;cursor:pointer;font-family:inherit}
.btn:hover{background:var(--sand);border-color:var(--sand)}
.btn.ghost{background:transparent;color:var(--ink)}
.btn.ghost:hover{background:var(--ink);color:var(--paper)}
.btn.ghost.light{color:var(--paper);border-color:rgba(250,248,245,.45)}
.btn.ghost.light:hover{background:var(--paper);color:var(--ink);border-color:var(--paper)}
.cta-row{display:flex;gap:14px;flex-wrap:wrap}

/* ── hero ── */
.hero{padding:118px 0 90px;position:relative;overflow:hidden}
.hero:after{content:'';position:absolute;right:-140px;top:30px;width:540px;height:540px;border-radius:50%;
  background:radial-gradient(circle,rgba(176,114,74,.10),transparent 68%);pointer-events:none}
.hero-in{position:relative;z-index:2;max-width:920px}
.hero h1{font-size:clamp(40px,6vw,74px);margin-bottom:28px}
.hero h1 em{font-style:normal;color:var(--sand)}
.lede{font-size:19px;line-height:1.65;color:var(--ink-2);max-width:672px;margin-bottom:40px;font-weight:350}
.page-head{padding:88px 0 60px;border-bottom:1px solid var(--line)}
.page-head h1{font-size:clamp(34px,5vw,56px);margin-bottom:24px;max-width:900px}
.page-head .lede{margin-bottom:0}

/* ── stat band ── */
.stats{background:var(--ink);color:var(--paper);padding:54px 0}
.stat-grid{display:grid;grid-template-columns:repeat(4,1fr)}
.stat{padding:0 30px;border-left:1px solid rgba(250,248,245,.16)}
.stat:first-child{padding-left:0;border-left:none}
.stat .n{font-family:'Fraunces',serif;font-size:38px;color:var(--sand-lt);line-height:1;margin-bottom:12px}
.stat .l{font-size:12.5px;line-height:1.5;color:#a8a49c}
.src{font-size:11px;color:#6d6a64;margin-top:32px;line-height:1.7}
.src a{color:#8f8a82}

/* ── sections ── */
section{padding:100px 0}
section.tight{padding:72px 0}
.alt{background:var(--paper-2)}
.dark{background:var(--ink);color:var(--paper)}
.dark h2,.dark h3{color:var(--paper)}
.dark p{color:#a8a39c}
.sec-head{max-width:800px;margin-bottom:60px}
.sec-head h2{font-size:clamp(29px,4vw,45px);margin-bottom:22px}
.sec-head p{font-size:17px;color:var(--ink-2);font-weight:350;line-height:1.72}
.sec-head p+p{margin-top:18px}
.dark .sec-head p{color:#a8a39c}
.prose{max-width:760px}
.prose p{font-size:16.5px;color:var(--ink-2);font-weight:350;line-height:1.78;margin-bottom:22px}
.prose h3{font-size:24px;margin:44px 0 16px}

/* ── card grids ── */
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line)}
.grid-2{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--line);border:1px solid var(--line)}
.card{background:var(--paper);padding:40px 34px;transition:background .22s}
.card:hover{background:var(--paper-3)}
.alt .card{background:var(--paper-2)}
.alt .card:hover{background:var(--paper)}
.card .num{font-family:'Fraunces',serif;font-size:13px;color:var(--sand);margin-bottom:18px;display:block;letter-spacing:.06em}
.card h3{font-size:21px;margin-bottom:13px;line-height:1.25}
.card p{font-size:14.5px;color:var(--ink-2);line-height:1.65;font-weight:350}
.card .fine{display:block;font-size:12px;color:var(--muted);margin-top:14px;font-style:italic}

/* ── method steps ── */
.method{display:grid;grid-template-columns:repeat(4,1fr);gap:38px}
.step .s{font-family:'Fraunces',serif;font-size:50px;color:var(--line);line-height:1;margin-bottom:14px;display:block}
.dark .step .s{color:#3a4148}
.step h3{font-size:18px;margin-bottom:11px}
.step p{font-size:14px;color:var(--ink-2);font-weight:350;line-height:1.65}

/* ── serve blocks ── */
.serve{display:grid;grid-template-columns:1fr 1fr;gap:50px 58px}
.serve-item{border-top:2px solid var(--ink);padding-top:25px}
.serve-item.lead{border-top-color:var(--sand)}
.serve-item h3{font-size:23px;margin-bottom:8px}
.serve-item .tag{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--sand);
  font-weight:600;margin-bottom:13px;display:block}
.serve-item p{font-size:15px;color:var(--ink-2);font-weight:350;line-height:1.7}
.serve-item ul{margin-top:16px;padding-left:0;list-style:none}
.serve-item li{font-size:14px;color:var(--ink-2);font-weight:350;line-height:1.6;
  padding-left:18px;position:relative;margin-bottom:9px}
.serve-item li:before{content:'';position:absolute;left:0;top:9px;width:6px;height:6px;
  border-radius:50%;background:var(--sand)}

/* ── engagement ── */
.eng{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line)}
.eng-card{background:var(--paper);padding:44px 36px}
.alt .eng-card{background:var(--paper-2)}
.eng-card.feature{background:var(--ink);color:var(--paper)}
.eng-card h3{font-size:25px;margin-bottom:10px}
.eng-card .terms{font-size:12.5px;letter-spacing:.05em;text-transform:uppercase;color:var(--sand);
  font-weight:600;margin-bottom:20px;line-height:1.6}
.eng-card.feature .terms{color:var(--sand-lt)}
.eng-card p{font-size:15px;color:var(--ink-2);font-weight:350;line-height:1.7}
.eng-card.feature p{color:#c4c0b8}
.eng-card ul{margin-top:18px;padding-left:0;list-style:none}
.eng-card li{font-size:13.5px;color:var(--ink-2);font-weight:350;line-height:1.55;
  padding-left:17px;position:relative;margin-bottom:8px}
.eng-card li:before{content:'';position:absolute;left:0;top:8px;width:5px;height:5px;
  border-radius:50%;background:var(--sand)}
.eng-card.feature li{color:#c4c0b8}
.eng-card.feature li:before{background:var(--sand-lt)}
.note{margin-top:32px;font-size:13.5px;color:var(--muted);max-width:820px;line-height:1.72}

/* ── report hub ── */
.report-feature{display:grid;grid-template-columns:1.15fr .85fr;gap:0;border:1px solid var(--line);
  background:var(--paper-3)}
.report-body{padding:52px 46px}
.report-body h2{font-size:32px;margin-bottom:8px}
.report-body .issue{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--sand);
  font-weight:600;margin-bottom:18px}
.report-body p{font-size:15.5px;color:var(--ink-2);font-weight:350;line-height:1.72;margin-bottom:18px}
.report-toc{background:var(--ink);color:var(--paper);padding:52px 42px}
.report-toc h3{font-size:19px;margin-bottom:22px;color:var(--paper)}
.report-toc ol{list-style:none;counter-reset:toc;padding:0}
.report-toc li{counter-increment:toc;font-size:13.5px;color:#a8a39c;line-height:1.5;
  padding-left:30px;position:relative;margin-bottom:14px;font-weight:350}
.report-toc li:before{content:counter(toc,decimal-leading-zero);position:absolute;left:0;top:0;
  font-family:'Fraunces',serif;font-size:12px;color:var(--sand-lt)}
.archive{border-top:1px solid var(--line)}
.archive-row{display:grid;grid-template-columns:150px 1fr 120px;gap:24px;align-items:baseline;
  padding:26px 0;border-bottom:1px solid var(--line)}
.archive-row .date{font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--sand);font-weight:600}
.archive-row h3{font-size:20px;margin-bottom:6px}
.archive-row p{font-size:14px;color:var(--ink-2);font-weight:350;line-height:1.6}
.archive-row .status{font-size:12px;color:var(--muted);text-align:right;font-style:italic}

/* ── forms ── */
.form{max-width:660px}
.field{margin-bottom:24px}
.field label{display:block;font-size:13px;font-weight:600;margin-bottom:8px;color:var(--ink)}
.field .hint{font-size:12.5px;color:var(--muted);font-weight:400;margin-bottom:8px;line-height:1.5}
.field input,.field textarea,.field select{
  width:100%;padding:13px 15px;font-family:inherit;font-size:15px;color:var(--ink);
  background:var(--paper-3);border:1px solid var(--line);border-radius:0;transition:border-color .18s}
.field input:focus,.field textarea:focus,.field select:focus{outline:none;border-color:var(--sand)}
.field textarea{min-height:140px;resize:vertical;line-height:1.6}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.form-note{font-size:12.5px;color:var(--muted);margin-top:18px;line-height:1.6}

/* ── inline callout ── */
.callout{background:var(--ink);color:var(--paper);padding:44px 46px;max-width:760px}
.callout p{font-family:'Fraunces',serif;font-size:23px;line-height:1.4;color:var(--paper)}

/* ── close ── */
.close{background:var(--ink);color:var(--paper);padding:112px 0;text-align:center}
.close h2{font-size:clamp(27px,3.7vw,43px);max-width:920px;margin:0 auto 38px;line-height:1.26;color:var(--paper)}

/* ── footer ── */
.foot{background:var(--paper-2);padding:72px 0 38px;border-top:1px solid var(--line);font-size:13.5px}
.f-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr;gap:46px;margin-bottom:48px}
.f-grid h4{font-family:'Fraunces',serif;font-size:17px;font-weight:500;margin-bottom:14px}
.f-grid p{color:var(--ink-2);line-height:1.85;font-weight:350}
.f-grid a{color:var(--sand-dk)}
.f-links{list-style:none;padding:0}
.f-links li{margin-bottom:8px}
.f-links a{text-decoration:none;color:var(--ink-2)}
.f-links a:hover{color:var(--sand)}
.legal{border-top:1px solid var(--line);padding-top:26px;font-size:11.5px;color:var(--muted);
  line-height:1.85;max-width:1000px}

@media(max-width:980px){
  .grid-3,.grid-2,.eng,.method,.serve,.form-row{grid-template-columns:1fr}
  .report-feature{grid-template-columns:1fr}
  .stat-grid{grid-template-columns:1fr 1fr;gap:30px 0}
  .stat{padding:0 22px}
  .stat:first-child,.stat:nth-child(3){border-left:none;padding-left:0}
  .f-grid{grid-template-columns:1fr}
  .archive-row{grid-template-columns:1fr;gap:8px}
  .archive-row .status{text-align:left}
  .nav-links{display:none;position:absolute;top:76px;left:0;right:0;background:var(--paper);
    border-bottom:1px solid var(--line);flex-direction:column;align-items:flex-start;
    gap:0;padding:8px 32px 20px}
  .nav-links.open{display:flex}
  .nav-links a{padding:12px 0;font-size:15px;width:100%}
  .nav-toggle{display:block}
  section{padding:68px 0}
  .hero{padding:70px 0 58px}
  .page-head{padding:56px 0 44px}
  .wrap{padding:0 22px}
  .report-body,.report-toc{padding:36px 28px}
  .callout{padding:32px 28px}
  .callout p{font-size:19px}
}
@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}

/* ── brand logo (drop-in) ───────────────────────────────
   Put logo.svg / logo.png in this folder and re-run build.js.
   The wordmark below is the fallback when no file is present. */
.brand{display:flex;align-items:center;text-decoration:none}
.brand-logo{height:42px;width:auto;max-width:280px;object-fit:contain;display:block}
.brand-logo + .brand-wordmark{display:none}
.brand-wordmark{display:block}
.foot-logo{height:46px;width:auto;max-width:280px;object-fit:contain;margin-bottom:16px}
@media(max-width:980px){
  .brand-logo{height:34px;max-width:200px}
}

/* ═══════════════════════════════════════════════════════════
   BRAND RE-SKIN — colours sampled from the SWTCRE logo
   navy #0C174F · gradient coral #FF3241 → mint #8FE9AE → teal #00C7BF
   ═══════════════════════════════════════════════════════════ */
:root{
  --ink:#0C174F;          /* brand navy — dark surfaces, headings, buttons */
  --ink-2:#333E5C;        /* body copy on light */
  --ink-3:#4A5578;
  --paper:#FFFFFF;
  --paper-2:#F4F6FA;
  --paper-3:#FAFBFD;
  --line:#DDE3EF;
  --line-2:#E8ECF4;
  --sand:#04756B;         /* accent on light backgrounds (AA on white) */
  --sand-dk:#045F57;
  --sand-lt:#5FE3D6;      /* accent on navy */
  --coral:#FF7362;        /* from the mark's gradient — used sparingly */
  --muted:#6B7590;
}

/* ── navy header ── */
.nav{background:rgba(12,23,79,.96);border-bottom:1px solid rgba(255,255,255,.12)}
.nav-links a{color:#C6CEE4}
.nav-links a:hover,.nav-links a.on{color:var(--sand-lt)}
.brand-wordmark b{color:#fff}
.brand-wordmark > span{color:#8E9AC0}
.nav-toggle{border-color:rgba(255,255,255,.3);color:#fff}
/* CTA sits on navy — invert it */
.nav-links a.btn{background:#fff;color:var(--ink);border-color:#fff}
.nav-links a.btn:hover{background:var(--sand-lt);color:var(--ink);border-color:var(--sand-lt)}
.brand{gap:13px}
.brand-mark{height:40px;width:auto;flex-shrink:0}
.brand-logo + .brand-wordmark{display:block}   /* mark never hides the wordmark */
@media(max-width:980px){
  .nav-links{background:var(--ink);border-bottom-color:rgba(255,255,255,.12)}
  .brand-mark{height:32px}
  .brand{gap:10px}
}

/* ── hero glow picks up the mark's teal ── */
.hero:after{background:radial-gradient(circle,rgba(0,199,191,.10),transparent 68%)}

/* ── stat band: coral numerals against navy ── */
.stat .n{color:var(--coral)}
.stat .l{color:#AEB8D2}
.src{color:#7B87A8}
.src a{color:#A3AEC9}

/* ── dark sections ── */
.stats,.dark,.close,.callout,.eng-card.feature,.report-toc{background:var(--ink)}
.dark p,.close p,.report-toc li{color:#AEB8D2}
.step .s{color:var(--line)}
.dark .step .s{color:#2B3768}

/* ── navy footer ── */
.foot{background:var(--ink);border-top:none;color:#AEB8D2}
.foot h4{color:#fff}
.f-grid p{color:#AEB8D2}
.f-grid a,.f-links a{color:#C6CEE4}
.f-grid a:hover,.f-links a:hover{color:var(--sand-lt)}
.legal{border-top-color:rgba(255,255,255,.14);color:#7B87A8}
.foot-logo{height:64px;margin-bottom:20px}

/* ── bio block ── */
.bio{display:grid;grid-template-columns:290px 1fr;gap:54px;align-items:start}
.bio > div:first-child{position:sticky;top:104px}
.bio-photo{width:100%;height:auto;aspect-ratio:4/5;object-fit:cover;object-position:center 20%;border:1px solid var(--line)}
.bio-caption{font-size:12.5px;color:var(--muted);margin-top:14px;line-height:1.5}
@media(max-width:820px){
  .bio{grid-template-columns:1fr;gap:32px}
  .bio > div:first-child{position:static}
  .bio-photo{max-width:260px}
}

/* ═══════════════════════════════════════════════════════════
   FINAL · DESERT DUSK — navy + bone + brick, editorial cards
   Accent moved to the warm end of the logo gradient so it reads
   against the navy instead of sinking into it.
   ═══════════════════════════════════════════════════════════ */
:root{
  --ink:#0C174F; --ink-2:#3B4257; --ink-3:#565E76;
  --paper:#FBF8F3; --paper-2:#F3EDE3; --paper-3:#FFFDF9;
  --line:#E4DACA; --line-2:#EFE7DB;
  --sand:#C0392A; --sand-dk:#9E2D20; --sand-lt:#FF9276;
  --coral:#FF9276; --muted:#6E6A72;
}

/* warm the ambient glow */
.hero:after{background:radial-gradient(circle,rgba(192,57,42,.09),transparent 66%)}

/* stat band */
.stat .n{color:#FF9276}
.stat .l{color:#B3BAD0}
.src{color:#8A93AE}
.src a{color:#AEB6CC}

/* nav */
.nav{background:rgba(12,23,79,.96)}
.nav-links a{color:#CBD1E4}
.nav-links a:hover,.nav-links a.on{color:#FF9276}
.nav-links a.btn{background:#FBF8F3;color:var(--ink);border-color:#FBF8F3}
.nav-links a.btn:hover{background:#FF9276;color:var(--ink);border-color:#FF9276}

/* ── editorial cards: rules, not boxes ── */
.grid-3,.grid-2{background:transparent;border:none;gap:0}
.card{
  background:transparent;
  border-top:1px solid var(--line);
  padding:34px 46px 44px 0;
  transition:none;
}
.alt .card,.card:hover,.alt .card:hover{background:transparent}
.grid-3 > .card:nth-child(3n),.grid-2 > .card:nth-child(2n){padding-right:0}
.card .num{margin-bottom:16px}
.card h3{margin-bottom:12px}

/* engagement tiers follow suit; the featured one stays a solid block */
.eng{background:transparent;border:none;gap:0 40px}
.eng-card{background:transparent;border-top:1px solid var(--line);padding:34px 0 42px}
.alt .eng-card{background:transparent}
.eng-card.feature{
  background:var(--ink);border-top-color:var(--ink);
  padding:34px 32px 42px;margin-top:0;
}

/* report + archive pick up the warm rule colour automatically */
.report-feature{border-color:var(--line);background:var(--paper-3)}
.bio-photo{border-color:var(--line)}

/* footer stays navy against the bone page */
.foot{background:var(--ink);border-top:none}
.f-grid a:hover,.f-links a:hover{color:#FF9276}
.legal{border-top-color:rgba(255,255,255,.14)}

@media(max-width:980px){
  .card{padding:30px 0 34px!important}
  .eng{gap:0}
  .eng-card.feature{padding:30px 24px 34px}
}

/* ── guide cluster ── */
.byline{font-size:13.5px;color:var(--muted);margin-top:-8px}
.byline strong{color:var(--ink-2);font-weight:600}
.guide{display:grid;grid-template-columns:minmax(0,1fr) 292px;gap:64px;align-items:start}
.guide-body{max-width:720px}
.guide-body h2{font-size:27px;margin:44px 0 16px;padding-top:26px;border-top:1px solid var(--line)}
.guide-body h2:first-of-type{border-top:none;padding-top:0;margin-top:0}
.guide-body h3{font-size:19px;margin:28px 0 10px}
.guide-body p{font-size:16.5px;color:var(--ink-2);font-weight:350;line-height:1.78;margin-bottom:20px}
.guide-body strong{color:var(--ink);font-weight:600}
.guide-body a{color:var(--sand-dk);text-decoration:underline;text-underline-offset:2px;
  text-decoration-thickness:1px;text-decoration-color:var(--line)}
.guide-body a:hover{text-decoration-color:var(--sand)}
.guide-body ul,.guide-body ol{margin:0 0 22px;padding-left:20px}
.guide-body li{font-size:16.5px;color:var(--ink-2);font-weight:350;line-height:1.72;margin-bottom:10px}
.guide-body li::marker{color:var(--sand)}
.guide-body table{width:100%;border-collapse:collapse;margin:8px 0 24px;font-size:14.5px}
.guide-body th{text-align:left;font-weight:600;color:var(--ink);border-bottom:1.5px solid var(--ink);
  padding:9px 14px 9px 0;font-size:12px;letter-spacing:.07em;text-transform:uppercase}
.guide-body td{padding:10px 14px 10px 0;border-bottom:1px solid var(--line);color:var(--ink-2);font-weight:350}
.faq-item{border-top:1px solid var(--line);padding-top:18px;margin-bottom:22px}
.faq-item h3{font-size:17.5px;margin:0 0 8px}
.faq-item p{font-size:15.5px;margin:0}
.sources{font-size:13px!important;color:var(--muted)!important;line-height:1.7!important;
  border-top:1px solid var(--line);padding-top:20px;margin-top:36px}
.guide-aside{position:sticky;top:104px}
.aside-block{border-top:2px solid var(--ink);padding-top:16px;margin-bottom:30px}
.aside-block .lbl{display:block;font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;
  color:var(--sand);font-weight:600;margin-bottom:12px}
.aside-block a{display:block;font-family:'Fraunces',Georgia,serif;font-size:15.5px;color:var(--ink);
  text-decoration:none;line-height:1.3;margin-bottom:12px}
.aside-block a:hover{color:var(--sand-dk)}
.aside-block.cta{background:var(--ink);border-top:none;padding:24px}
.aside-block.cta .lbl{color:var(--sand-lt)}
.aside-block.cta p{font-size:14px;color:#AEB8D2;line-height:1.6;margin-bottom:16px;font-weight:350}
.aside-block.cta .btn{background:#FBF8F3;color:var(--ink);border-color:#FBF8F3;padding:11px 20px;font-size:12.5px}
.aside-block.cta .btn:hover{background:var(--sand-lt);border-color:var(--sand-lt)}

/* hub */
.hub-cluster{border-top:1px solid var(--line);padding-top:34px;margin-bottom:56px}
.hub-cluster h2{font-size:31px;margin-bottom:12px}
.hub-cluster h2 a{color:var(--ink);text-decoration:none}
.hub-cluster h2 a:hover{color:var(--sand-dk)}
.hub-cluster > p{font-size:16.5px;color:var(--ink-2);font-weight:350;line-height:1.72;
  max-width:760px;margin-bottom:26px}
.hub-spokes{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:0 44px}
.hub-spoke{display:block;text-decoration:none;border-top:1px solid var(--line);padding:18px 0 20px}
.hub-spoke strong{display:block;font-family:'Fraunces',Georgia,serif;font-size:18px;font-weight:500;
  color:var(--ink);margin-bottom:7px;line-height:1.25}
.hub-spoke span{display:block;font-size:14px;color:var(--ink-2);font-weight:350;line-height:1.6}
.hub-spoke:hover strong{color:var(--sand-dk)}

@media(max-width:980px){
  .guide{grid-template-columns:1fr;gap:44px}
  .guide-aside{position:static}
  .aside-block.cta{padding:22px}
}

/* --- language toggle --- */
.nav-lang{display:inline-flex;align-items:center;gap:10px;letter-spacing:.07em}
.nav-lang a{font-size:11.5px;letter-spacing:.07em;text-transform:uppercase;opacity:.55}
.nav-lang a+a{border-left:1px solid;padding-left:10px}
.nav-lang a:hover{opacity:1}
.nav-lang a.on{opacity:1;font-weight:600}
@media(max-width:1180px){.nav-links{gap:17px}}
@media(max-width:900px){
  .nav-lang{width:100%;padding-top:14px;margin-top:4px;border-top:1px solid rgba(0,0,0,.09)}
  .nav-lang a{font-size:13px;padding:0}
}

/* --- long-form research pages ---
   .hero.sub was never defined, so case studies inherited the homepage hero:
   118px top / 90px bottom, then a 100px section on top of that. And .prose
   had no rule for h2 or for lists, so headings collided with the list above
   them and bullets fell back to browser defaults. */
.hero.sub{padding:86px 0 44px}
.hero.sub h1{font-size:clamp(30px,4.4vw,46px)}
.hero.sub .lede{margin-bottom:0}
.hero.sub + section{padding-top:54px}
.prose > :first-child{margin-top:0}
.prose h2{font-size:28px;margin:52px 0 18px}
.prose ul,.prose ol{margin:0 0 24px;padding-left:20px}
.prose li{font-size:16.5px;color:var(--ink-2);font-weight:350;line-height:1.78;margin-bottom:8px}
.prose li::marker{color:var(--sand)}
/* `class="wrap prose"` collapsed the whole page body to a 760px centred column,
   so the text sat indented from the h1 above it. Keep the wrap full width and
   constrain the measure on the children instead — body and heading now share a
   left edge. */
.wrap.prose{max-width:var(--max)}
.wrap.prose > *{max-width:790px}
.wrap.prose > table,.wrap.prose > .tbl,.wrap.prose > figure{max-width:none}
/* .hero-in collapses its .wrap to 920px, which indents the hero relative to the
   nav, the footer and the body below it. On the homepage that reads as a design
   choice; on a case study, where the h1 sits directly above body copy, it reads
   as broken. Fix it here only. */
.hero.sub > .hero-in{max-width:var(--max)}
.hero.sub > .hero-in > *{max-width:920px}
.archive-row .status a{color:var(--muted);text-decoration:none;border-bottom:1px solid var(--line)}
.archive-row .status a:hover{color:var(--sand-dk);border-bottom-color:var(--sand)}
@media(max-width:980px){
  .hero.sub{padding:54px 0 28px}
  .hero.sub + section{padding-top:34px}
  .prose h2{font-size:24px;margin:40px 0 14px}
  section.tight{padding:46px 0}
}