/* DebtPivot shared styles for standalone pages (v3, Nov 2026) */
:root{
  --navy:#0f2240; --teal:#0a8c6e; --teal-light:#12b08a; --gold:#c9963a; --gold-light:#f0bb60;
  --bg:#faf8f3; --card:#ffffff; --soft:#f2ede4; --line:#e8e0d5;
  --text:#1a1a2e; --text-mid:#4a5568; --text-light:#6b7a90;
  --link:#08795f; --warn-bg:#fff6e5; --warn-line:#e7b45a; --urgent-bg:#fdeeee; --urgent-line:#d9534f;
  --shadow:0 4px 30px rgba(15,34,64,.08);
}
@media (prefers-color-scheme: dark){
  :root{
    --bg:#0c1626; --card:#13223a; --soft:#182b47; --line:#24395a;
    --text:#e8edf5; --text-mid:#b8c4d6; --text-light:#8fa0b8;
    --link:#3fd1a8; --warn-bg:#2b2412; --warn-line:#b8862f; --urgent-bg:#2e1617; --urgent-line:#d9534f;
    --shadow:0 4px 30px rgba(0,0,0,.35);
  }
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:'DM Sans',system-ui,sans-serif;background:var(--bg);color:var(--text);line-height:1.7;font-size:17px}
a{color:var(--link)}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid var(--gold);outline-offset:2px;border-radius:3px}
.skip{position:absolute;left:-999px;top:0;background:var(--gold);color:var(--navy);padding:8px 14px;z-index:2000}
.skip:focus{left:8px;top:8px}

/* header */
.dp-nav{position:sticky;top:0;z-index:1000;background:rgba(15,34,64,.97);height:68px;padding:0 24px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid rgba(201,150,58,.2)}
.dp-logo{font-family:'Playfair Display',Georgia,serif;font-size:22px;font-weight:900;color:#fff;text-decoration:none;letter-spacing:-.5px}
.dp-logo span{color:var(--gold)}
.dp-links{display:flex;gap:4px;list-style:none;align-items:center}
.dp-links a{color:rgba(255,255,255,.8);text-decoration:none;font-size:14px;font-weight:500;padding:8px 14px;border-radius:6px}
.dp-links a:hover,.dp-links a[aria-current="page"]{color:#fff;background:rgba(201,150,58,.15)}
.dp-links .dp-cta{background:var(--teal);color:#fff}
.dp-links .dp-cta:hover{background:var(--teal-light)}
.dp-toggle{display:none;background:none;border:0;width:44px;height:44px;cursor:pointer}
.dp-toggle span{display:block;width:22px;height:2px;margin:5px auto;background:#fff}
@media (max-width:900px){
  .dp-toggle{display:block;margin-left:auto}
  .dp-links{display:none;position:absolute;top:68px;left:0;right:0;flex-direction:column;align-items:stretch;background:var(--navy);padding:8px 0;box-shadow:0 12px 28px rgba(0,0,0,.25)}
  .dp-links.open{display:flex}
  .dp-links a{display:block;padding:14px 20px;border-radius:0}
  .dp-links .dp-cta{margin:10px 20px;text-align:center;border-radius:6px}
}

/* hero */
.dp-hero{background:var(--navy);color:#fff;padding:64px 24px 56px;position:relative;overflow:hidden}
.dp-hero::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse 60% 80% at 50% 0%,rgba(10,140,110,.22) 0%,transparent 70%)}
.dp-hero-in{position:relative;max-width:860px;margin:0 auto}
.dp-crumb{font-size:13px;color:rgba(255,255,255,.65);margin-bottom:14px}
.dp-crumb a{color:var(--gold-light);text-decoration:none}
.dp-tag{display:inline-block;font-size:11px;font-weight:700;letter-spacing:2px;text-transform:uppercase;padding:5px 14px;border-radius:100px;margin-bottom:14px;background:rgba(201,150,58,.15);color:var(--gold-light);border:1px solid rgba(201,150,58,.35)}
.dp-hero h1{font-family:'Playfair Display',Georgia,serif;font-size:clamp(32px,5vw,50px);line-height:1.15;font-weight:900;margin-bottom:16px}
.dp-hero p{font-size:18px;color:rgba(255,255,255,.78);max-width:680px}
.dp-updated{margin-top:16px;font-size:13px;color:rgba(255,255,255,.55)}

/* body */
.dp-main{max-width:860px;margin:0 auto;padding:48px 24px 24px}
.dp-main h2{font-family:'Playfair Display',Georgia,serif;font-size:clamp(24px,3.4vw,32px);line-height:1.25;color:var(--text);margin:44px 0 14px}
.dp-main h2:first-child{margin-top:0}
.dp-main h3{font-size:19px;margin:26px 0 8px;color:var(--text)}
.dp-main p{margin-bottom:16px;color:var(--text-mid)}
.dp-main ul,.dp-main ol{margin:0 0 18px 22px;color:var(--text-mid)}
.dp-main li{margin-bottom:8px}
.dp-main strong{color:var(--text)}
.dp-box{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:22px 24px;margin:22px 0;box-shadow:var(--shadow)}
.dp-box h3:first-child{margin-top:0}
.dp-note{background:var(--soft);border-left:4px solid var(--teal);border-radius:0 10px 10px 0;padding:16px 20px;margin:20px 0}
.dp-warn{background:var(--warn-bg);border-left:4px solid var(--warn-line);border-radius:0 10px 10px 0;padding:16px 20px;margin:20px 0}
.dp-urgent{background:var(--urgent-bg);border-left:4px solid var(--urgent-line);border-radius:0 10px 10px 0;padding:16px 20px;margin:20px 0}
.dp-note p:last-child,.dp-warn p:last-child,.dp-urgent p:last-child{margin-bottom:0}
.dp-steps{counter-reset:s;list-style:none;margin-left:0!important}
.dp-steps>li{counter-increment:s;position:relative;padding-left:48px;margin-bottom:18px}
.dp-steps>li::before{content:counter(s);position:absolute;left:0;top:0;width:32px;height:32px;border-radius:50%;background:var(--teal);color:#fff;font-weight:700;display:flex;align-items:center;justify-content:center;font-size:15px}
.dp-table{width:100%;border-collapse:collapse;margin:16px 0 22px;font-size:15px}
.dp-table th,.dp-table td{text-align:left;padding:10px 12px;border-bottom:1px solid var(--line);vertical-align:top}
.dp-table th{background:var(--navy);color:#fff;font-size:13px;letter-spacing:.4px}
.dp-table-wrap{overflow-x:auto}
.dp-btn{display:inline-flex;align-items:center;gap:8px;background:var(--teal);color:#fff;border:0;border-radius:8px;padding:13px 22px;font-size:15px;font-weight:700;font-family:inherit;cursor:pointer;text-decoration:none;min-height:44px}
.dp-btn:hover{background:var(--teal-light)}
.dp-btn.alt{background:transparent;color:var(--link);border:1.5px solid var(--line)}
.dp-sources{font-size:14px;color:var(--text-light)}
.dp-sources li{margin-bottom:6px}

/* letters */
.dp-letter{position:relative;background:var(--card);border:1px dashed var(--line);border-radius:12px;padding:20px 22px;margin:14px 0 24px}
.dp-letter pre{white-space:pre-wrap;font-family:'DM Sans',system-ui,sans-serif;font-size:15px;color:var(--text);line-height:1.6}
.dp-copy{position:absolute;top:12px;right:12px;font-size:13px;padding:8px 14px;min-height:36px}

/* cards grid (help hub) */
.dp-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:18px;margin:20px 0 30px}
.dp-card{display:block;background:var(--card);border:1px solid var(--line);border-radius:14px;padding:22px;text-decoration:none;color:var(--text);transition:transform .2s,box-shadow .2s}
.dp-card:hover{transform:translateY(-3px);box-shadow:var(--shadow)}
.dp-card .k{font-size:11px;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;color:var(--teal);margin-bottom:6px}
.dp-card .k.urgent{color:var(--urgent-line)}
.dp-card h3{font-family:'Playfair Display',Georgia,serif;font-size:20px;margin:0 0 6px}
.dp-card p{font-size:15px;color:var(--text-mid);margin:0}

/* support block */
.dp-support{background:var(--soft);border:1px solid var(--line);border-radius:14px;padding:22px 24px;margin:36px 0 10px}
.dp-support h2{font-size:22px!important;margin:0 0 8px!important}
.dp-support p{margin-bottom:8px}

/* budget tool */
.bb-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px 18px}
.bb-grid label{display:flex;flex-direction:column;font-size:13px;font-weight:600;color:var(--text-mid);gap:5px}
.bb-grid input{font:inherit;font-size:16px;padding:10px 12px;border:1.5px solid var(--line);border-radius:8px;background:var(--card);color:var(--text);min-height:44px}
.bb-section{font-weight:700;color:var(--text);grid-column:1/-1;margin-top:10px;font-size:15px;letter-spacing:.3px}
.bb-out{display:none;margin-top:22px;scroll-margin-top:84px}
.bb-row{display:flex;justify-content:space-between;gap:12px;padding:9px 0;border-bottom:1px solid var(--line);font-size:15px}
.bb-row b{color:var(--text)}
.bb-good{color:var(--teal)!important}
.bb-bad{color:var(--urgent-line)!important}
.bb-bar{height:14px;border-radius:100px;background:var(--line);overflow:hidden;display:flex;margin:12px 0 6px}
.bb-bar i{display:block;height:100%}
@media (max-width:640px){.bb-grid{grid-template-columns:1fr}}

/* footer */
.dp-foot{background:var(--navy);color:rgba(255,255,255,.62);padding:48px 24px 28px;margin-top:56px;font-size:14px}
.dp-foot-grid{max-width:1140px;margin:0 auto;display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:36px}
.dp-foot h2{font-size:12px!important;letter-spacing:1.5px;text-transform:uppercase;color:#fff;margin:0 0 12px!important;font-family:'DM Sans',system-ui,sans-serif!important}
.dp-foot ul{list-style:none}
.dp-foot li{margin-bottom:8px}
.dp-foot a{color:rgba(255,255,255,.7);text-decoration:none}
.dp-foot a:hover{color:var(--gold-light)}
.dp-foot .dp-logo{display:inline-block;margin-bottom:10px}
.dp-foot-bottom{max-width:1140px;margin:30px auto 0;padding-top:20px;border-top:1px solid rgba(255,255,255,.1);display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px;font-size:13px}
@media (max-width:900px){.dp-foot-grid{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.dp-foot-grid{grid-template-columns:1fr}body{font-size:16px}}
@media print{.dp-nav,.dp-foot,.dp-copy,.dp-support{display:none}body{background:#fff;color:#000}}
@media (prefers-reduced-motion: reduce){*,*::before,*::after{transition:none!important;animation:none!important;scroll-behavior:auto!important}}

/* v4 additions */
@media (max-width:1150px) and (min-width:901px){.dp-links a{padding:8px 9px;font-size:13.5px}}
.dp-kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;margin:22px 0}
.dp-kpi{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:16px}
.dp-kpi b{display:block;font-family:'Playfair Display',Georgia,serif;font-size:24px;color:var(--teal);line-height:1.2}
.dp-kpi span{font-size:13px;color:var(--text-light)}
.dp-two{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:18px 0}
.dp-two .dp-box{margin:0}
.dp-pro h3{color:var(--teal)!important}
.dp-con h3{color:var(--urgent-line)!important}
@media (max-width:640px){.dp-two{grid-template-columns:1fr}}
.dp-cta-box{background:var(--navy);color:#fff;border-radius:14px;padding:26px;margin:34px 0;text-align:center}
.dp-cta-box h2{color:#fff!important;margin:0 0 8px!important;font-size:24px!important}
.dp-cta-box p{color:rgba(255,255,255,.8)!important;margin-bottom:16px}
.dp-cta-box .dp-btn.alt{color:#fff;border-color:rgba(255,255,255,.35)}
.dp-disclose{font-size:13px;color:var(--text-light);border-left:3px solid var(--gold);padding:6px 0 6px 12px;margin:12px 0}
.tool-out{display:none;margin-top:20px}
.tool-out.show{display:block}
.dp-table td.good{color:var(--teal);font-weight:700}
.dp-table td.bad{color:var(--urgent-line);font-weight:700}