/* ==========================================================================
   Mortgages Calculators UK Core Stylesheet
   Design system: system-font stack (zero network requests), fluid type,
   dark-mode aware, CLS-safe. Keep this file the ONLY blocking stylesheet.
   ========================================================================== */

:root{
  --brand-900:#06283d;
  --brand-800:#0b3a56;
  --brand-700:#11507a;
  --brand-600:#1668a0;
  --brand-500:#2287c9;
  --accent-600:#00806a;
  --accent-500:#00a383;
  --accent-400:#1fc39d;
  --accent-100:#e3f7f2;
  --amber-500:#d98004;
  --amber-100:#fef3e2;
  --rose-600:#b3243c;
  --rose-100:#fdeaee;

  --ink-900:#0d1b25;
  --ink-700:#2c4152;
  --ink-500:#5b7183;
  --ink-400:#7d92a3;
  --line:#dfe7ee;
  --line-strong:#c6d3de;
  --bg:#ffffff;
  --bg-soft:#f5f8fb;
  --bg-sunk:#eef3f8;
  --card:#ffffff;

  --shadow-sm:0 1px 2px rgba(13,27,37,.06),0 1px 3px rgba(13,27,37,.08);
  --shadow-md:0 4px 6px -1px rgba(13,27,37,.07),0 10px 22px -8px rgba(13,27,37,.12);
  --shadow-lg:0 18px 40px -14px rgba(6,40,61,.24);

  --r-sm:8px; --r-md:12px; --r-lg:18px; --r-xl:26px;
  --wrap:1180px;
  --pad:clamp(1rem,4vw,2rem);
  --font:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif;
  --mono:ui-monospace,SFMono-Regular,"SF Mono",Menlo,Consolas,monospace;
}

@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    --ink-900:#eaf2f8; --ink-700:#c2d2de; --ink-500:#93a8b8; --ink-400:#7b91a3;
    --line:#1f3444; --line-strong:#2b455a;
    --bg:#0a141c; --bg-soft:#0f1e29; --bg-sunk:#132532; --card:#101f2b;
    --brand-900:#d7ecfa; --brand-700:#5cb2e6; --brand-600:#4aa5dd;
    --accent-100:#0d2f2a; --amber-100:#2e2410; --rose-100:#33161d;
    --shadow-sm:0 1px 2px rgba(0,0,0,.4);
    --shadow-md:0 6px 18px -6px rgba(0,0,0,.55);
    --shadow-lg:0 20px 44px -16px rgba(0,0,0,.7);
  }
}
:root[data-theme="dark"]{
  --ink-900:#eaf2f8; --ink-700:#c2d2de; --ink-500:#93a8b8; --ink-400:#7b91a3;
  --line:#1f3444; --line-strong:#2b455a;
  --bg:#0a141c; --bg-soft:#0f1e29; --bg-sunk:#132532; --card:#101f2b;
  --brand-900:#d7ecfa; --brand-700:#5cb2e6; --brand-600:#4aa5dd;
  --accent-100:#0d2f2a; --amber-100:#2e2410; --rose-100:#33161d;
  --shadow-sm:0 1px 2px rgba(0,0,0,.4);
  --shadow-md:0 6px 18px -6px rgba(0,0,0,.55);
  --shadow-lg:0 20px 44px -16px rgba(0,0,0,.7);
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:84px}
body{
  margin:0;background:var(--bg);color:var(--ink-900);
  font-family:var(--font);font-size:17px;line-height:1.68;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
}
img,svg,video{max-width:100%;height:auto;display:block}
a{color:var(--brand-600);text-underline-offset:3px}
a:hover{color:var(--accent-600)}
:focus-visible{outline:3px solid var(--accent-500);outline-offset:2px;border-radius:4px}

h1,h2,h3,h4{line-height:1.22;margin:0 0 .55em;letter-spacing:-.018em;font-weight:750;color:var(--ink-900)}
h1{font-size:clamp(1.95rem,1.25rem + 2.6vw,3.05rem)}
h2{font-size:clamp(1.45rem,1.08rem + 1.45vw,2.05rem);margin-top:2.2em}
h3{font-size:clamp(1.14rem,1rem + .6vw,1.4rem);margin-top:1.9em}
h4{font-size:1.05rem;margin-top:1.5em}
p{margin:0 0 1.1em}
ul,ol{padding-left:1.25em;margin:0 0 1.2em}
li{margin-bottom:.45em}
strong{font-weight:680;color:var(--ink-900)}
small{font-size:.86rem;color:var(--ink-500)}
hr{border:0;border-top:1px solid var(--line);margin:2.5rem 0}

.wrap{max-width:var(--wrap);margin-inline:auto;padding-inline:var(--pad)}
.wrap-narrow{max-width:790px;margin-inline:auto;padding-inline:var(--pad)}
.skip{position:absolute;left:-9999px;top:0;background:var(--accent-600);color:#fff;padding:.7rem 1.1rem;z-index:200;border-radius:0 0 8px 0}
.skip:focus{left:0}
.visually-hidden{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ---------- Header ---------- */
/* Utility bar: live market context, a signal competitors do not surface */
.topbar{background:var(--brand-900);color:rgba(255,255,255,.9);font-size:.8rem;border-bottom:1px solid rgba(255,255,255,.08)}
:root[data-theme="dark"] .topbar{background:#061019}
.topbar .wrap{display:flex;align-items:center;gap:.6rem 1.4rem;min-height:36px;flex-wrap:wrap}
.topbar .tb-item{display:flex;align-items:center;gap:.4rem;white-space:nowrap}
.topbar .tb-item b{color:#fff;font-weight:700}
.topbar .pulse{width:7px;height:7px;border-radius:50%;background:var(--accent-400);box-shadow:0 0 0 0 rgba(31,195,157,.7);animation:mcpulse 2.4s infinite}
@keyframes mcpulse{0%{box-shadow:0 0 0 0 rgba(31,195,157,.55)}70%{box-shadow:0 0 0 7px rgba(31,195,157,0)}100%{box-shadow:0 0 0 0 rgba(31,195,157,0)}}
.topbar .tb-right{margin-left:auto;display:flex;gap:1.2rem;align-items:center}
.topbar a{color:rgba(255,255,255,.82);text-decoration:none;font-weight:600}
.topbar a:hover{color:#fff;text-decoration:underline}
@media (max-width:720px){.topbar .tb-right{display:none}.topbar .wrap{justify-content:center}}

.site-header{
  position:sticky;top:0;z-index:60;background:color-mix(in srgb,var(--bg) 88%,transparent);
  backdrop-filter:saturate(180%) blur(12px);border-bottom:1px solid var(--line);
}
.hdr{display:flex;align-items:center;gap:1rem;min-height:66px}
.brand{display:flex;align-items:center;gap:.6rem;font-weight:800;font-size:1.06rem;color:var(--ink-900);text-decoration:none;letter-spacing:-.02em;flex-shrink:0}
.brand:hover{color:var(--ink-900)}
.brand-mark{width:34px;height:34px;border-radius:9px;background:linear-gradient(140deg,var(--accent-500),var(--brand-600));display:grid;place-items:center;color:#fff;font-size:1rem;font-weight:800;flex-shrink:0}
.brand em{font-style:normal;color:var(--accent-600)}
.nav{margin-left:auto;display:flex;align-items:center;gap:.15rem}
.nav a{padding:.5rem .7rem;border-radius:8px;font-size:.94rem;font-weight:560;color:var(--ink-700);text-decoration:none}
.nav a:hover,.nav a[aria-current="page"]{background:var(--bg-sunk);color:var(--brand-600)}
.has-drop{position:relative}
.has-drop>button{
  display:flex;align-items:center;gap:.3rem;background:none;border:0;font:inherit;font-size:.94rem;font-weight:560;
  color:var(--ink-700);padding:.5rem .7rem;border-radius:8px;cursor:pointer;
}
.has-drop>button:hover{background:var(--bg-sunk);color:var(--brand-600)}
.has-drop>button::after{content:"";width:6px;height:6px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg) translateY(-2px);transition:transform .18s}
.has-drop[data-open="true"]>button::after{transform:rotate(225deg) translateY(-1px)}
.drop{
  position:absolute;top:calc(100% + 8px);left:0;min-width:270px;background:var(--card);
  border:1px solid var(--line);border-radius:var(--r-md);box-shadow:var(--shadow-lg);
  padding:.4rem;display:none;
}
.has-drop[data-open="true"] .drop{display:block}
.drop a{display:block;padding:.55rem .7rem;border-radius:8px;font-size:.92rem}
.drop a span{display:block;font-size:.78rem;color:var(--ink-500);font-weight:450}
.nav-toggle{display:none;margin-left:auto;background:var(--bg-sunk);border:1px solid var(--line);border-radius:9px;width:42px;height:38px;cursor:pointer;color:var(--ink-900);align-items:center;justify-content:center;flex-direction:column;gap:4px}
.nav-toggle i{display:block;width:18px;height:2px;background:currentColor;border-radius:2px}
.theme-btn{background:var(--bg-sunk);border:1px solid var(--line);border-radius:9px;width:38px;height:38px;cursor:pointer;font-size:1rem;color:var(--ink-700);margin-left:.4rem}

@media (max-width:980px){
  .nav-toggle{display:flex}
  .nav{position:fixed;inset:66px 0 auto;flex-direction:column;align-items:stretch;background:var(--bg);border-bottom:1px solid var(--line);padding:.6rem var(--pad) 1.4rem;gap:.1rem;max-height:calc(100dvh - 66px);overflow:auto;display:none;box-shadow:var(--shadow-lg)}
  .nav[data-open="true"]{display:flex}
  .nav a,.has-drop>button{padding:.72rem .4rem;font-size:1rem;width:100%;text-align:left}
  .drop{position:static;border:0;box-shadow:none;padding:0 0 .4rem .8rem;background:transparent;min-width:0}
  .theme-btn{margin:.6rem 0 0;width:100%;height:42px}
}

/* ---------- Buttons ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.5rem;
  padding:.78rem 1.35rem;border-radius:11px;font-weight:650;font-size:.97rem;
  text-decoration:none;border:1px solid transparent;cursor:pointer;font-family:inherit;
  transition:transform .12s ease,box-shadow .18s ease,background .18s;
}
.btn:active{transform:translateY(1px)}
.btn-primary{background:linear-gradient(135deg,var(--accent-500),var(--accent-600));color:#fff;box-shadow:0 6px 16px -6px rgba(0,128,106,.6)}
.btn-primary:hover{color:#fff;box-shadow:0 10px 22px -8px rgba(0,128,106,.7)}
.btn-ghost{background:var(--card);border-color:var(--line-strong);color:var(--ink-900)}
.btn-ghost:hover{border-color:var(--accent-500);color:var(--accent-600)}
.btn-sm{padding:.5rem .85rem;font-size:.87rem;border-radius:9px}
.btn-block{width:100%}

/* ---------- Hero ---------- */
.hero{
  position:relative;overflow:hidden;
  background:linear-gradient(168deg,var(--bg-soft) 0%,var(--bg) 62%);
  border-bottom:1px solid var(--line);padding:clamp(1.8rem,4vw,3.2rem) 0 clamp(2rem,5vw,3.4rem);
}
.hero::before{content:"";position:absolute;top:-140px;right:-120px;width:460px;height:460px;border-radius:50%;background:radial-gradient(circle,rgba(0,163,131,.14),transparent 68%);pointer-events:none}
.hero-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:2rem;align-items:start;position:relative}
@media (min-width:1000px){.hero-grid{grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);gap:2.6rem}}
.eyebrow{display:inline-flex;align-items:center;gap:.45rem;background:var(--accent-100);color:var(--accent-600);font-size:.78rem;font-weight:700;letter-spacing:.05em;text-transform:uppercase;padding:.34rem .78rem;border-radius:999px;margin-bottom:1rem}
.hero p.lede{font-size:clamp(1.02rem,.97rem + .3vw,1.16rem);color:var(--ink-700);max-width:56ch}
.trust-row{display:flex;flex-wrap:wrap;gap:.5rem .9rem;margin-top:1.3rem;padding:0;list-style:none}
.trust-row li{display:flex;align-items:center;gap:.4rem;font-size:.88rem;color:var(--ink-500);margin:0}
.trust-row li::before{content:"✓";color:var(--accent-500);font-weight:800}

/* ---------- Calculator ---------- */
.calc{background:var(--card);border:1px solid var(--line);border-radius:var(--r-xl);box-shadow:var(--shadow-lg);overflow:hidden}
.calc-head{padding:1.15rem 1.4rem;border-bottom:1px solid var(--line);background:var(--bg-soft);display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap}
.calc-head h2,.calc-head p.calc-title{margin:0;font-size:1.06rem;font-weight:750;letter-spacing:-.01em}
.calc-body{padding:1.4rem}
@media (min-width:640px){.calc-body{padding:1.6rem}}

.field{margin-bottom:1.05rem}
.field>label,.field-label{display:flex;align-items:center;gap:.4rem;font-size:.86rem;font-weight:640;color:var(--ink-700);margin-bottom:.4rem}
.hint{font-size:.79rem;color:var(--ink-400);margin:.35rem 0 0;line-height:1.45}
.input-wrap{position:relative;display:flex;align-items:center}
.input-wrap .pre,.input-wrap .suf{position:absolute;font-size:.95rem;color:var(--ink-500);font-weight:600;pointer-events:none}
.input-wrap .pre{left:.9rem}
.input-wrap .suf{right:.9rem}
.input-wrap:has(.pre) input{padding-left:2rem}
.input-wrap:has(.suf) input{padding-right:2.4rem}
input[type=text],input[type=number],input[type=email],select,textarea{
  width:100%;padding:.72rem .9rem;font:inherit;font-size:1rem;font-weight:600;
  color:var(--ink-900);background:var(--bg);border:1.5px solid var(--line-strong);
  border-radius:10px;transition:border-color .15s,box-shadow .15s;-moz-appearance:textfield;
}
input:focus,select:focus,textarea:focus{outline:0;border-color:var(--accent-500);box-shadow:0 0 0 3px rgba(0,163,131,.16)}
input::-webkit-outer-spin-button,input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
select{cursor:pointer;background-image:linear-gradient(45deg,transparent 50%,var(--ink-500) 50%),linear-gradient(135deg,var(--ink-500) 50%,transparent 50%);background-position:calc(100% - 18px) 55%,calc(100% - 13px) 55%;background-size:5px 5px,5px 5px;background-repeat:no-repeat;-webkit-appearance:none;appearance:none;padding-right:2.4rem}
textarea{min-height:130px;font-weight:450;line-height:1.6}

input[type=range]{width:100%;-webkit-appearance:none;appearance:none;background:transparent;padding:0;border:0;margin:.55rem 0 0;height:22px;cursor:pointer}
input[type=range]::-webkit-slider-runnable-track{height:6px;border-radius:99px;background:var(--bg-sunk);border:1px solid var(--line)}
input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:20px;height:20px;border-radius:50%;background:var(--accent-500);border:3px solid var(--card);box-shadow:var(--shadow-sm);margin-top:-8px}
input[type=range]::-moz-range-track{height:6px;border-radius:99px;background:var(--bg-sunk);border:1px solid var(--line)}
input[type=range]::-moz-range-thumb{width:16px;height:16px;border-radius:50%;background:var(--accent-500);border:3px solid var(--card)}

.grid-2{display:grid;grid-template-columns:1fr;gap:0 1rem}
@media (min-width:560px){.grid-2{grid-template-columns:1fr 1fr}}
.grid-3{display:grid;grid-template-columns:1fr;gap:0 1rem}
@media (min-width:640px){.grid-3{grid-template-columns:repeat(3,1fr)}}

.seg{display:flex;background:var(--bg-sunk);border:1px solid var(--line);border-radius:11px;padding:3px;gap:3px}
.seg label{flex:1;position:relative}
.seg input{position:absolute;opacity:0;width:0;height:0}
.seg span{display:block;text-align:center;padding:.52rem .4rem;border-radius:8px;font-size:.88rem;font-weight:640;color:var(--ink-500);cursor:pointer;transition:all .15s;user-select:none}
.seg input:checked+span{background:var(--card);color:var(--accent-600);box-shadow:var(--shadow-sm)}
.seg input:focus-visible+span{outline:2px solid var(--accent-500);outline-offset:1px}

/* ---------- Results ---------- */
.result-panel{background:linear-gradient(160deg,var(--brand-900),var(--brand-700));border-radius:var(--r-lg);padding:1.5rem;color:#fff;margin-bottom:1.3rem}
:root[data-theme="dark"] .result-panel,
@media (prefers-color-scheme:dark){}
.result-panel .rp-label{font-size:.82rem;text-transform:uppercase;letter-spacing:.07em;font-weight:700;color:rgba(255,255,255,.72);margin:0 0 .2rem}
.result-panel .rp-value{font-size:clamp(2.1rem,1.5rem + 2.4vw,3rem);font-weight:800;letter-spacing:-.03em;line-height:1.05;margin:0;color:#fff;font-variant-numeric:tabular-nums}
.result-panel .rp-value span{font-size:.42em;font-weight:650;opacity:.8}
.rp-split{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin-top:1.15rem;padding-top:1.15rem;border-top:1px solid rgba(255,255,255,.18)}
.rp-split div p{margin:0}
.rp-split .k{font-size:.78rem;color:rgba(255,255,255,.7);text-transform:uppercase;letter-spacing:.05em;font-weight:650}
.rp-split .v{font-size:1.18rem;font-weight:730;color:#fff;font-variant-numeric:tabular-nums}

.stat-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:.8rem;margin:1.2rem 0}
.stat{background:var(--bg-soft);border:1px solid var(--line);border-radius:var(--r-md);padding:.9rem 1rem}
.stat .k{font-size:.76rem;text-transform:uppercase;letter-spacing:.05em;color:var(--ink-500);font-weight:700;margin:0 0 .18rem}
.stat .v{font-size:1.3rem;font-weight:780;margin:0;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.stat .sub{font-size:.78rem;color:var(--ink-400);margin:.15rem 0 0}
.stat.good .v{color:var(--accent-600)}
.stat.warn .v{color:var(--amber-500)}
.stat.bad .v{color:var(--rose-600)}

.chart-wrap{display:grid;gap:1.2rem;align-items:center;margin:1.4rem 0}
@media (min-width:620px){.chart-wrap{grid-template-columns:190px 1fr}}
.legend{list-style:none;padding:0;margin:0}
.legend li{display:flex;align-items:center;gap:.6rem;padding:.45rem 0;border-bottom:1px dashed var(--line);font-size:.92rem;margin:0}
.legend li:last-child{border-bottom:0}
.legend .dot{width:12px;height:12px;border-radius:4px;flex-shrink:0}
.legend .amt{margin-left:auto;font-weight:750;font-variant-numeric:tabular-nums}

/* ---------- Tables ---------- */
.table-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;border:1px solid var(--line);border-radius:var(--r-md);margin:1.3rem 0;background:var(--card)}
table{width:100%;border-collapse:collapse;font-size:.92rem;min-width:520px}
caption{text-align:left;padding:.85rem 1rem;font-size:.85rem;color:var(--ink-500);border-bottom:1px solid var(--line);font-weight:600}
th,td{padding:.68rem .9rem;text-align:left;border-bottom:1px solid var(--line);font-variant-numeric:tabular-nums}
thead th{background:var(--bg-sunk);font-size:.78rem;text-transform:uppercase;letter-spacing:.045em;font-weight:750;color:var(--ink-700);white-space:nowrap;position:sticky;top:0}
tbody tr:last-child td{border-bottom:0}
tbody tr:hover{background:var(--bg-soft)}
td.num,th.num{text-align:right}
tr.year-row{background:var(--bg-soft);font-weight:700}

/* ---------- Content blocks ---------- */
.section{padding:clamp(2.4rem,5vw,4rem) 0}
.section-soft{background:var(--bg-soft);border-block:1px solid var(--line)}
.section-head{max-width:66ch;margin-bottom:2rem}
.section-head h2{margin-top:0}
.section-head p{color:var(--ink-700);font-size:1.03rem;margin-bottom:0}

.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(255px,1fr));gap:1rem}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r-lg);padding:1.35rem;box-shadow:var(--shadow-sm);transition:transform .18s,box-shadow .18s,border-color .18s;display:flex;flex-direction:column}
a.card{text-decoration:none;color:inherit}
a.card:hover{transform:translateY(-3px);box-shadow:var(--shadow-md);border-color:var(--accent-400);color:inherit}
.card h3{margin:0 0 .45rem;font-size:1.08rem}
.card p{font-size:.93rem;color:var(--ink-500);margin:0}
.card .ico{width:42px;height:42px;border-radius:11px;background:var(--accent-100);color:var(--accent-600);display:grid;place-items:center;font-size:1.2rem;margin-bottom:.85rem}
.card .more{margin-top:auto;padding-top:.9rem;font-size:.87rem;font-weight:700;color:var(--accent-600)}

.callout{border-left:4px solid var(--accent-500);background:var(--accent-100);padding:1.05rem 1.2rem;border-radius:0 var(--r-md) var(--r-md) 0;margin:1.6rem 0}
.callout p:last-child{margin-bottom:0}
.callout strong{color:var(--accent-600)}
.callout.warn{border-color:var(--amber-500);background:var(--amber-100)}
.callout.warn strong{color:var(--amber-500)}

details.faq{border:1px solid var(--line);border-radius:var(--r-md);margin-bottom:.65rem;background:var(--card);overflow:hidden}
details.faq summary{padding:1rem 1.15rem;font-weight:670;cursor:pointer;list-style:none;display:flex;align-items:center;justify-content:space-between;gap:1rem;font-size:1rem}
details.faq summary::-webkit-details-marker{display:none}
details.faq summary::after{content:"+";font-size:1.4rem;color:var(--accent-600);font-weight:400;line-height:1;flex-shrink:0}
details.faq[open] summary::after{content:"−"}
details.faq[open] summary{border-bottom:1px solid var(--line)}
details.faq .faq-body{padding:1rem 1.15rem 0}
details.faq .faq-body>*:last-child{margin-bottom:1rem}

.breadcrumbs{font-size:.83rem;color:var(--ink-500);padding:.9rem 0 0}
.breadcrumbs ol{list-style:none;display:flex;flex-wrap:wrap;gap:.4rem;padding:0;margin:0}
.breadcrumbs li{margin:0;display:flex;gap:.4rem;align-items:center}
.breadcrumbs li+li::before{content:"›";color:var(--ink-400)}
.breadcrumbs a{color:var(--ink-500);text-decoration:none}
.breadcrumbs a:hover{color:var(--accent-600);text-decoration:underline}

.meta-row{display:flex;flex-wrap:wrap;gap:.5rem 1.1rem;font-size:.85rem;color:var(--ink-500);margin:0 0 1.6rem;padding:0;list-style:none}
.meta-row li{margin:0}
.tag{display:inline-block;background:var(--bg-sunk);border:1px solid var(--line);color:var(--ink-700);font-size:.75rem;font-weight:700;padding:.2rem .6rem;border-radius:999px;letter-spacing:.02em}

.toc{background:var(--bg-soft);border:1px solid var(--line);border-radius:var(--r-md);padding:1.1rem 1.3rem;margin:1.8rem 0}
.toc p{font-weight:750;font-size:.86rem;text-transform:uppercase;letter-spacing:.05em;margin:0 0 .6rem;color:var(--ink-500)}
.toc ol{margin:0;padding-left:1.15rem;font-size:.94rem}
.toc li{margin-bottom:.3rem}

.author-box{display:flex;gap:1rem;align-items:flex-start;background:var(--bg-soft);border:1px solid var(--line);border-radius:var(--r-lg);padding:1.2rem;margin:2.4rem 0}
.author-box .av{width:52px;height:52px;border-radius:50%;background:linear-gradient(140deg,var(--accent-500),var(--brand-600));color:#fff;display:grid;place-items:center;font-weight:800;font-size:1.1rem;flex-shrink:0}
.author-box p{margin:0;font-size:.9rem;color:var(--ink-500)}
.author-box .nm{font-weight:750;color:var(--ink-900);font-size:.98rem}

.rel-list{list-style:none;padding:0;margin:0;display:grid;gap:.55rem}
.rel-list a{display:flex;gap:.6rem;align-items:baseline;padding:.7rem .9rem;background:var(--card);border:1px solid var(--line);border-radius:10px;text-decoration:none;font-size:.94rem;font-weight:600;color:var(--ink-900)}
.rel-list a:hover{border-color:var(--accent-400);color:var(--accent-600)}
.rel-list a::before{content:"→";color:var(--accent-500);font-weight:800}

.cta-band{background:linear-gradient(140deg,var(--brand-900),var(--brand-700));color:#fff;border-radius:var(--r-xl);padding:clamp(1.8rem,4vw,2.8rem);text-align:center;margin:0}
.cta-band h2{color:#fff;margin-top:0}
.cta-band p{color:rgba(255,255,255,.85);max-width:56ch;margin-inline:auto}
.cta-band .btn-ghost{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.35);color:#fff}
.cta-band .btn-ghost:hover{background:rgba(255,255,255,.2);color:#fff}

/* ---------- Footer ---------- */
.site-footer{background:var(--bg-soft);border-top:1px solid var(--line);padding:3.2rem 0 1.6rem;margin-top:4rem;font-size:.92rem;position:relative}
.site-footer::before{content:"";position:absolute;inset:0 0 auto;height:3px;background:linear-gradient(90deg,var(--accent-500),var(--brand-600),var(--accent-500))}
.foot-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:2rem}
.foot-brand{grid-column:1/-1;max-width:34ch}
@media (min-width:900px){.foot-brand{grid-column:span 1;max-width:30ch}}
.foot-brand p{color:var(--ink-500);font-size:.88rem;margin:.8rem 0 0}
.foot-badges{display:flex;flex-wrap:wrap;gap:.4rem;margin-top:1rem}
.foot-badges span{font-size:.72rem;font-weight:700;letter-spacing:.03em;text-transform:uppercase;background:var(--card);border:1px solid var(--line);color:var(--ink-500);padding:.25rem .6rem;border-radius:6px}
.foot-updated{display:inline-flex;align-items:center;gap:.4rem;font-size:.78rem;color:var(--accent-600);font-weight:700;background:var(--accent-100);padding:.25rem .65rem;border-radius:999px}
.foot-grid h3,.foot-grid .foot-h{font-size:.8rem;font-weight:750;text-transform:uppercase;letter-spacing:.07em;color:var(--ink-500);margin:0 0 .8rem}
.foot-grid ul{list-style:none;padding:0;margin:0}
.foot-grid li{margin-bottom:.45rem}
.foot-grid a{color:var(--ink-700);text-decoration:none;font-size:.92rem}
.foot-grid a:hover{color:var(--accent-600);text-decoration:underline}
.foot-bottom{border-top:1px solid var(--line);margin-top:2.4rem;padding-top:1.4rem;display:flex;flex-wrap:wrap;gap:.8rem 1.4rem;justify-content:space-between;color:var(--ink-500);font-size:.85rem}
.foot-bottom p{margin:0}
.disclaimer{font-size:.82rem;color:var(--ink-400);line-height:1.6;margin-top:1.4rem;padding-top:1.4rem;border-top:1px solid var(--line)}

.mb-0{margin-bottom:0}.mt-0{margin-top:0}.center{text-align:center}
.chip-row{display:flex;flex-wrap:wrap;gap:.5rem;margin:1.2rem 0}
.chip{background:var(--bg-sunk);border:1px solid var(--line);border-radius:999px;padding:.35rem .85rem;font-size:.84rem;font-weight:600;color:var(--ink-700);text-decoration:none}
.chip:hover{border-color:var(--accent-400);color:var(--accent-600)}

@media print{
  .site-header,.site-footer,.nav,.cta-band,.btn{display:none!important}
  body{font-size:12pt}
  .calc{box-shadow:none;border:1px solid #999}
}
@media (prefers-reduced-motion:reduce){
  *{animation-duration:.01ms!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
}