/* Southern California Debt Solutions brand layer (2026-11-10).
   Loaded last on every page except the home page, on top of article-theme / root-article-bridge /
   en.css / popup-cta.css and the pages' own <style>. Brand kit: Charcoal #0F1012, Burgundy #6B1F2B,
   Terracotta #C75A3A, Champagne #C9B293, Ivory #F4EDE4, Walnut #6F4A34; Lato 300 + Noto Sans TC. */
:root{
  --b-charcoal:#0F1012;--b-charcoal-2:#17181B;--b-burgundy:#6B1F2B;--b-terracotta:#C75A3A;
  --b-champagne:#C9B293;--b-ivory:#F4EDE4;--b-walnut:#6F4A34;
  --b-paper:#FFFDF9;--b-ink:#231C17;--b-ink-2:#4a3d33;--b-muted:#7a6a5d;--b-line:#e6dccf;--b-link:#9A4A2E;
  --b-gold:linear-gradient(135deg,#F1DFC0 0%,#C9B293 38%,#8E7353 70%,#D9C3A0 100%);
  --b-en:"Lato","Helvetica Neue",Arial,sans-serif;--b-zh:"Noto Sans TC","PingFang TC","Microsoft JhengHei",sans-serif;
  /* variables used by the older theme files */
  --page:var(--b-ivory);--surface:var(--b-paper);--text:var(--b-ink);--muted:var(--b-muted);--line:var(--b-line);
  --rule:var(--b-line);--accent:var(--b-link);--btn:var(--b-charcoal);--btn-hover:#2a2420;
  --hero-1:var(--b-charcoal);--hero-2:var(--b-charcoal-2);
  --rb-page:var(--b-ivory);--rb-surface:var(--b-paper);--rb-text:var(--b-ink);--rb-muted:var(--b-muted);--rb-line:var(--b-line);--rb-accent:var(--b-link);
  --popup-overlay:rgba(15,16,18,.62);--popup-card-bg:var(--b-paper);--popup-title:var(--b-ink);--popup-text:var(--b-ink-2);
  --popup-muted:var(--b-muted);--popup-check:var(--b-terracotta);--popup-primary:var(--b-charcoal);--popup-primary-hover:#2a2420;
  --popup-shadow:0 30px 70px -20px rgba(15,16,18,.5);--popup-radius:4px;
}
html,body,.article-page{background:var(--b-ivory)!important;color:var(--b-ink)!important;font-family:var(--b-zh)!important;font-weight:400}
a{color:var(--b-link)}
::selection{background:rgba(199,90,58,.22)}

/* ---- top bar ---- */
.site-nav{background:rgba(15,16,18,.94)!important;border-bottom:1px solid rgba(201,178,147,.22)!important;backdrop-filter:blur(12px)}
.site-nav .nav-row{min-height:66px}
.brand{display:inline-flex!important;align-items:center;gap:12px;color:var(--b-ivory)!important;text-decoration:none!important;text-transform:none!important;font-weight:400!important}
.brand-mark{width:30px;height:34px;flex-shrink:0}
.brand-text{display:flex;flex-direction:column;line-height:1.2}
.brand-zh{font-family:var(--b-zh);font-size:15px;letter-spacing:.145em;color:var(--b-ivory)}
.brand-en{font-family:var(--b-en);font-weight:300;font-size:8.5px;letter-spacing:.37em;font-kerning:none;text-transform:uppercase;color:var(--b-champagne);margin-top:3px}
.site-nav .nav-links a{color:rgba(244,237,228,.72)!important;font-size:13px;letter-spacing:.12em;text-decoration:none!important}
.site-nav .nav-links a:hover{color:var(--b-ivory)!important}
.site-nav .nav-links a[href*="/calculator"]{padding:8px 16px!important;background:var(--b-gold);color:#1A1410!important;border-radius:2px!important;font-weight:500}
.en-page .lang-switch{border-color:var(--b-champagne)!important;color:var(--b-champagne)!important}

/* ---- page + hero ---- */
.page,main{background:var(--b-paper)!important}
.article-hero,.article-page .hero{background:radial-gradient(700px 360px at 90% 0%,rgba(107,31,43,.55),transparent 65%),linear-gradient(180deg,var(--b-charcoal),var(--b-charcoal-2))!important;border-bottom:0!important;color:var(--b-ivory)}
.article-hero h1,.article-page .hero h1{color:var(--b-ivory)!important;font-family:var(--b-zh)!important;font-weight:400!important;letter-spacing:.04em!important;line-height:1.3!important;font-size:clamp(30px,4.6vw,50px)!important;max-width:20ch}
.article-kicker,.article-page .hero .kicker{font-family:var(--b-en)!important;font-weight:300!important;letter-spacing:.37em!important;color:var(--b-champagne)!important}
.article-meta,.article-page .hero .meta{color:rgba(244,237,228,.6)!important}
.article-hero .lead,.article-hero p{color:rgba(244,237,228,.78)!important}
.article-divider{border-top-color:rgba(201,178,147,.3)!important}
h1,h2,h3{font-family:var(--b-zh)}
main>h1{color:var(--b-ink)!important;font-weight:400!important;letter-spacing:.04em!important}

/* ---- article body ---- */
.article-body p,.card p,.intro{color:var(--b-ink-2)!important}
.article-body h2,.card h2,.faq h2,.related h2{color:var(--b-ink)!important;font-weight:500!important;letter-spacing:.04em!important}
.article-body h2{position:relative;padding-top:18px}
.article-body h2::before{content:"";position:absolute;top:0;left:0;width:34px;height:2px;background:var(--b-terracotta)}
.article-body h3{color:var(--b-ink)!important;font-weight:500!important}
.article-body ul,.article-body ol,.article-body li{color:var(--b-ink-2)!important}
.toc h2{color:var(--b-walnut)!important;font-family:var(--b-en)!important;font-weight:300!important;letter-spacing:.3em!important}
.toc li{color:var(--b-ink-2)!important}
.article-body .card,.article-body .risk-position-box,.article-body .callout,.article-body details.faq,.article-body .grid-3{border-left-color:var(--b-champagne)!important}
.article-body .card h3,.article-body .risk-position-box h3,.article-body .callout h3,.article-body details.faq summary{color:var(--b-walnut)!important}
.answer-box{background:#f7f0e6!important;border-left-color:var(--b-terracotta)!important}
.answer-box b{color:var(--b-walnut)!important}
.cta-box{background:#f7f0e6!important;border-left-color:var(--b-terracotta)!important}
.cta-box a{color:var(--b-link)!important}
.meta{color:var(--b-muted)!important}

/* ---- buttons + CTAs ---- */
.btn{border-radius:2px!important;border-color:var(--b-line)!important;color:var(--b-ink-2)!important}
.btn.primary,.article-page .btn.primary,.submit{background:var(--b-charcoal)!important;border-color:var(--b-charcoal)!important;color:var(--b-ivory)!important;border-radius:2px!important;letter-spacing:.08em}
.btn.primary:hover,.submit:hover{background:#2a2420!important}
.mini-cta{background:var(--b-charcoal)!important;border:0!important;border-radius:2px!important;padding:26px 26px 24px!important;position:relative;overflow:hidden}
.mini-cta::before{content:"";position:absolute;inset:0;background:radial-gradient(420px 200px at 100% 0%,rgba(107,31,43,.6),transparent 70%);pointer-events:none}
.mini-cta>*{position:relative}
.mini-cta h3{color:var(--b-ivory)!important;font-weight:400!important;letter-spacing:.06em}
.mini-cta p{color:rgba(244,237,228,.75)!important}
.mini-cta-btn{background:var(--b-gold)!important;border:0!important;border-radius:2px!important;color:#1A1410!important;font-weight:500;letter-spacing:.12em;padding:11px 20px!important}
.article-page .calc-cta{background:var(--b-paper)!important;border:1px solid var(--b-line)!important;border-left:3px solid var(--b-terracotta)!important;border-radius:2px!important;box-shadow:none!important}
.article-page .calc-cta .calc-eyebrow{color:var(--b-terracotta)!important}
.article-page .calc-cta .calc-title{color:var(--b-ink)!important;font-weight:500!important}
.article-page .calc-cta .calc-copy{color:var(--b-ink-2)!important}
.article-page .calc-cta .calc-btn{background:var(--b-charcoal)!important;border-radius:2px!important;color:var(--b-ivory)!important;letter-spacing:.08em}
.article-page .calc-cta .calc-note{color:var(--b-muted)!important}

/* ---- FAQ, related, cards ---- */
.faq details,details.faq{border-bottom-color:var(--b-line)!important}
.faq summary,details.faq summary{color:var(--b-ink)!important}
.faq details p,details.faq p{color:var(--b-ink-2)!important}
.related,.faq{border-top-color:var(--b-line)!important}
.related a{color:var(--b-link)!important}
.card{border-top-color:var(--b-line)!important}
.card h2 a{color:var(--b-ink)!important}
.card-link{border-radius:2px!important;border-color:var(--b-line)!important;background:#fff!important}
.card-link:hover{border-color:var(--b-champagne)!important}
.card-link h3{color:var(--b-ink)!important}
.card-link p{color:var(--b-muted)!important}

/* ---- forms (EN contact) ---- */
.en-form{border-radius:2px!important;border-color:var(--b-line)!important}
.en-form h2.step span{background:var(--b-charcoal)!important;color:var(--b-champagne)!important}
.en-form input:focus,.en-form select:focus{border-color:var(--b-walnut)!important;box-shadow:0 0 0 3px rgba(111,74,52,.15)!important}
.en-form .choice input:checked+span{border-color:var(--b-walnut)!important;background:#f7f0e6!important;box-shadow:0 0 0 1px var(--b-walnut)!important}
.en-form .choice input:checked+span::before{border-color:var(--b-walnut)!important;background:radial-gradient(var(--b-walnut) 45%,transparent 50%)!important}
.en-form .trust li{color:var(--b-walnut)!important;background:#f7f0e6!important}

/* ---- popup ---- */
.popup-window{border:1px solid var(--b-line)}
.popup-primary{background:var(--b-charcoal)!important;color:var(--b-ivory)!important;border-radius:2px!important}

/* ---- footer ---- */
.site-footer{background:var(--b-charcoal)!important;border-top:0!important;color:rgba(244,237,228,.55)}
.site-footer .en-body{color:var(--b-champagne)!important;font-family:var(--b-en);font-weight:300;letter-spacing:.3em!important}
.site-footer .disclaimer{color:rgba(244,237,228,.5)!important;line-height:1.8}
.site-footer a{color:rgba(244,237,228,.8)!important}
.site-footer a:hover{color:var(--b-champagne)!important}

@media(max-width:640px){
  .brand-zh{font-size:13px;letter-spacing:.12em}
  .brand-en{font-size:6.8px;letter-spacing:.2em;white-space:nowrap}
  .brand-mark{width:26px;height:30px}
  .site-nav .nav-links{gap:10px}
  .site-nav .nav-links a{font-size:12px;letter-spacing:.06em}
  .site-nav .nav-links a[href*="/calculator"]{padding:7px 10px!important}
}

/* ---- standalone guide layout (minimum-payment-risk) ---- */
.topbar{background:rgba(15,16,18,.94)!important;border-bottom:1px solid rgba(201,178,147,.22)!important;backdrop-filter:blur(12px)}
.topbar .nav a{color:rgba(244,237,228,.72)!important;letter-spacing:.12em}
.topbar .nav a:hover{color:var(--b-ivory)!important}
.hero h1{color:var(--b-ivory)!important;font-family:var(--b-zh)!important;font-weight:400!important;letter-spacing:.04em!important}
.hero .kicker{color:var(--b-champagne)!important;letter-spacing:.2em!important}
.hero .lead{color:rgba(244,237,228,.78)!important}
.hero .meta{color:rgba(244,237,228,.55)!important}
.article-inner h2{color:var(--b-ink)!important;font-weight:500!important;letter-spacing:.04em!important}
.section-intro{color:var(--b-terracotta)!important;font-family:var(--b-en);letter-spacing:.3em!important}
.takeaway{border-left-color:var(--b-terracotta)!important;background:#f7f0e6!important}
.takeaway-label{color:var(--b-walnut)!important}
.cta{background:var(--b-charcoal)!important;color:var(--b-ivory)!important;border:0!important;border-radius:2px!important;padding:26px 28px!important}
.cta .cta-copy,.cta p{color:rgba(244,237,228,.8)!important}
.cta-btn{background:var(--b-gold)!important;color:#1A1410!important;border:0!important;border-radius:2px!important}
.cta-link{color:var(--b-champagne)!important}
.site-nav .nav-links a{white-space:nowrap}
@media(max-width:430px){
  .site-nav .nav-links a[href="/articles/"],.site-nav .nav-links a[href="/en/articles/"]{display:none}
  .brand-en{font-size:6.2px;letter-spacing:.16em}
}
.site-nav .nav-links a.lang-switch{background:none!important;color:var(--b-champagne)!important;border:1px solid var(--b-champagne)!important;padding:2px 12px!important;border-radius:99px!important;font-weight:400}
