/* Business Debt Recovery — a trading style of Buzz Legal Ltd.
   Design direction A, approved 30 Aug 2026. Accent is Buzz Legal's claret
   #b8123f, taken from buzzlegal.co.uk, because BDR is a trading style of that
   company and should read as part of it.

   The system, in one line: warm paper ground, white rounded panels with soft
   depth, claret used for the proof band, buttons, numerals and icons.
   The signature component is the STATEMENT (.panel / .stmt) — a ledger line is
   the natural visual language for a debt site, and it carries real arithmetic.

   No photography anywhere. Type, panels and a small line-icon set. */

*{margin:0;padding:0;box-sizing:border-box}
:root{
  --ink:#14110f;
  --c:#b8123f;          /* Buzz Legal claret */
  --c2:#8e0e31;         /* pressed / hover */
  --wash:#fbe8ed;       /* icon chip ground */
  --glow:184,18,63;     /* rgb triplet for shadows and hairlines */
  --paper:#f4f2ec;      /* the page ground — warm, never pure white */
  --panel:#ffffff;
  --rule:#e4e0d6;
  --hair:#efece4;       /* rule inside a white panel */
  --mute:#78756e;
  --soft:#54524d;
  --body:#33312d;
}
html{-webkit-font-smoothing:antialiased;scroll-behavior:smooth}
body{font-family:Inter,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  background:var(--paper);color:var(--ink);font-feature-settings:'ss01','cv05','tnum';
  line-height:1.55}
a{text-decoration:none;color:inherit}
img,svg{display:block;max-width:100%}
.wrap{max-width:1280px;margin:0 auto;padding:0 40px}
/* a single readable column — long-form pages that carry no table of contents */
.wrap.solo{max-width:920px;padding-bottom:12px}
.tnum{font-variant-numeric:tabular-nums}

/* ── buttons ──────────────────────────────────────────────────────────── */
.btn{display:inline-block;background:var(--c);color:#fff;font-weight:700;font-size:.95rem;
  padding:13px 26px;border-radius:100px;box-shadow:0 6px 18px rgba(var(--glow),.22);
  border:none;font-family:inherit;cursor:pointer;text-align:center}
.btn:hover{background:var(--c2)}
.btn.sm{padding:11px 22px;font-size:.9rem}
.btn.ghost{background:var(--panel);color:var(--ink);box-shadow:0 2px 10px rgba(20,17,15,.07)}
.btn.ghost:hover{background:#fff;color:var(--c)}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,
textarea:focus-visible,[tabindex]:focus-visible{outline:2px solid var(--c);outline-offset:3px}

/* ── masthead ─────────────────────────────────────────────────────────── */
.mast{display:flex;align-items:center;justify-content:space-between;gap:26px;padding:22px 0}
.mark{display:flex;align-items:center;gap:12px;flex-shrink:0}
.mark .tile{background:var(--ink);color:#fff;width:52px;height:52px;border-radius:12px;
  display:flex;align-items:center;justify-content:center;font-weight:900;font-size:1.2rem;
  letter-spacing:-.04em;flex:none}
.mark .wm b{display:block;font-size:.95rem;font-weight:900;letter-spacing:-.03em;
  line-height:1.05;text-transform:uppercase}
.mark .wm i{display:block;font-style:normal;font-size:.62rem;font-weight:700;
  letter-spacing:.14em;text-transform:uppercase;color:var(--mute);margin-top:3px}
.nav{display:flex;gap:24px;font-size:.9rem;font-weight:600;color:var(--soft);flex-wrap:wrap}
.nav a:hover{color:var(--c)}
.nav a.on{color:var(--c)}
@media (max-width:1080px){.mast{flex-wrap:wrap}.nav{order:3;width:100%;gap:18px;
  border-top:1px solid var(--rule);padding-top:14px}}

/* ── hero ─────────────────────────────────────────────────────────────── */
.hero{display:grid;grid-template-columns:1.05fr .95fr;gap:56px;align-items:center;
  padding:44px 0 64px}
.hero h1{font-size:clamp(2.6rem,4.6vw,4.1rem);line-height:1.02;letter-spacing:-.042em;
  font-weight:800}
.hero h1 span{color:var(--c)}
.hero .sub{font-size:1.14rem;line-height:1.62;color:var(--soft);margin-top:22px;max-width:46ch}
.ticks{margin:26px 0 30px;display:grid;gap:11px;list-style:none}
.ticks li{display:flex;gap:11px;align-items:flex-start;font-size:1rem;font-weight:500;
  line-height:1.45}
.ticks svg{flex:none;margin-top:2px;color:var(--c)}
.cta{display:flex;gap:12px;flex-wrap:wrap}
@media (max-width:1000px){.hero{grid-template-columns:1fr;gap:36px;padding-bottom:46px}}

/* ── THE STATEMENT — the signature component ──────────────────────────── */
.panel{background:var(--panel);border-radius:16px;padding:28px 30px 24px;
  box-shadow:0 14px 44px rgba(20,17,15,.09)}
.panel.flat{box-shadow:0 6px 22px rgba(20,17,15,.06)}
.panel .cap{font-size:.65rem;font-weight:900;letter-spacing:.18em;text-transform:uppercase;
  color:var(--mute);display:block;margin-bottom:16px}
.row{display:flex;justify-content:space-between;align-items:baseline;gap:18px;padding:12px 0;
  border-top:1px solid var(--hair);font-size:1rem;line-height:1.4}
.row:first-of-type{border-top:none}
.row span{color:var(--soft)}
.row b{font-weight:700;font-variant-numeric:tabular-nums;white-space:nowrap}
.tot{display:flex;justify-content:space-between;align-items:baseline;gap:18px;
  border-top:2px solid var(--ink);margin-top:8px;padding-top:15px}
.tot span{font-weight:800;font-size:1rem}
.tot b{font-size:2.05rem;font-weight:800;letter-spacing:-.035em;color:var(--c);
  font-variant-numeric:tabular-nums;white-space:nowrap}
.fine{font-size:.79rem;color:var(--mute);line-height:1.55;margin-top:14px}
.fine a{color:var(--c);font-weight:600;border-bottom:1px solid rgba(var(--glow),.3)}
@media (max-width:560px){.tot b{font-size:1.55rem}.panel{padding:22px 20px 20px}}

/* ── full-bleed proof band ────────────────────────────────────────────── */
.band{background:var(--c);color:#fff;padding:52px 0}
.bandin{display:grid;grid-template-columns:repeat(3,1fr);gap:40px;text-align:center}
.bandin h3{font-size:2.7rem;font-weight:800;letter-spacing:-.04em;font-variant-numeric:tabular-nums}
.bandin p{font-size:.97rem;color:rgba(255,255,255,.84);margin-top:8px;line-height:1.5}
.bandin svg{margin:0 auto 14px}
.band a{color:#fff;border-bottom:1px solid rgba(255,255,255,.5)}
@media (max-width:820px){.bandin{grid-template-columns:1fr;gap:30px}.band{padding:40px 0}}

/* ── sections ─────────────────────────────────────────────────────────── */
.sec{padding:70px 0}
.sec.tight{padding-top:0}
.sechead{display:flex;justify-content:space-between;align-items:flex-end;gap:30px;
  margin-bottom:34px;flex-wrap:wrap}
.sechead h2{font-size:clamp(1.85rem,3vw,2.5rem);letter-spacing:-.035em;font-weight:800;
  line-height:1.05;max-width:22ch}
.sechead p{font-size:1rem;color:var(--soft);max-width:38ch;line-height:1.6}
@media (max-width:760px){.sec{padding:48px 0}}

/* ── card grid ────────────────────────────────────────────────────────── */
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.cards.two{grid-template-columns:repeat(2,1fr)}
.card{background:var(--panel);border-radius:16px;padding:28px 26px 26px;
  box-shadow:0 6px 22px rgba(20,17,15,.06);display:flex;flex-direction:column}
.ic{color:var(--c);width:46px;height:46px;border-radius:12px;background:var(--wash);
  display:flex;align-items:center;justify-content:center;margin-bottom:18px;flex:none}
.card h3{font-size:1.2rem;font-weight:800;letter-spacing:-.02em;margin-bottom:9px;line-height:1.25}
.card p{font-size:.96rem;line-height:1.6;color:var(--soft)}
.card .go{display:inline-block;margin-top:auto;padding-top:14px;font-size:.88rem;
  font-weight:700;color:var(--c)}
@media (max-width:980px){.cards,.cards.two{grid-template-columns:repeat(2,1fr)}}
@media (max-width:660px){.cards,.cards.two{grid-template-columns:1fr}}

/* ── the recovery ladder ──────────────────────────────────────────────── */
.ladder{background:var(--panel);border-radius:18px;padding:8px 32px;
  box-shadow:0 6px 22px rgba(20,17,15,.06)}
.rung{display:grid;grid-template-columns:44px 1.1fr 1.6fr auto;gap:26px;padding:24px 0;
  border-top:1px solid var(--hair);align-items:center}
.rung:first-child{border-top:none}
.rung .n{width:34px;height:34px;border-radius:50%;background:var(--c);color:#fff;
  display:flex;align-items:center;justify-content:center;font-weight:800;font-size:.86rem;flex:none}
.rung h4{font-size:1.1rem;font-weight:800;letter-spacing:-.015em}
.rung .who{font-size:.72rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;
  color:var(--mute);margin-top:5px}
.rung p{font-size:.95rem;line-height:1.55;color:var(--soft)}
.rung .fee{font-size:.9rem;font-weight:700;white-space:nowrap;text-align:right}
.rung .fee em{display:block;font-style:normal;font-size:.72rem;font-weight:500;
  color:var(--mute);margin-top:4px}
@media (max-width:900px){.rung{grid-template-columns:34px 1fr;gap:14px 18px}
  .rung p{grid-column:2}.rung .fee{grid-column:2;text-align:left}
  .ladder{padding:8px 22px}}

/* ── pull statement ───────────────────────────────────────────────────── */
.pull{padding:20px 0 10px;max-width:34ch}
.pull q{display:block;font-size:clamp(1.5rem,2.8vw,2.3rem);line-height:1.16;
  letter-spacing:-.03em;font-weight:700;quotes:none}
.pull q b{font-weight:800;color:var(--c)}
.pullwrap{display:grid;grid-template-columns:1.15fr 1fr;gap:56px;align-items:center;
  padding:26px 0 46px}
.pullwrap .pull{max-width:none}
.pullwrap p{font-size:1.02rem;color:var(--soft);line-height:1.68}
@media (max-width:900px){.pullwrap{grid-template-columns:1fr;gap:24px}}

/* ── interior page head ───────────────────────────────────────────────── */
.phead{padding:34px 0 26px;max-width:62ch}
.crumb{font-size:.73rem;font-weight:700;letter-spacing:.09em;text-transform:uppercase;
  color:var(--mute);margin-bottom:20px}
.crumb a:hover{color:var(--c)}
.phead .lab{font-size:.7rem;font-weight:900;letter-spacing:.2em;text-transform:uppercase;
  color:var(--c);margin-bottom:12px}
.phead h1{font-size:clamp(2.1rem,4vw,3.4rem);line-height:1.04;letter-spacing:-.04em;
  font-weight:800}
.phead .std{margin-top:18px;font-size:1.1rem;line-height:1.62;color:var(--soft)}

/* ── long-form ────────────────────────────────────────────────────────── */
.article{display:grid;grid-template-columns:minmax(0,1fr) 260px;gap:56px;
  align-items:start;padding-bottom:56px}
.article.solo{grid-template-columns:minmax(0,72ch)}
.prose{background:var(--panel);border-radius:16px;padding:36px 40px 40px;
  box-shadow:0 6px 22px rgba(20,17,15,.06);min-width:0}
.prose>p{font-size:1.06rem;line-height:1.75;color:var(--body);margin:0 0 22px}
.prose h2{font-size:1.75rem;letter-spacing:-.03em;font-weight:800;margin:44px 0 14px;
  line-height:1.14;scroll-margin-top:20px}
.prose h2:first-child{margin-top:0}
.prose h3{font-size:1.2rem;font-weight:800;margin:30px 0 10px;letter-spacing:-.017em}
.prose ul,.prose ol{margin:0 0 22px 4px;font-size:1.06rem;line-height:1.72;color:var(--body);
  list-style:none}
.prose ol{counter-reset:n}
.prose li{margin-bottom:10px;position:relative;padding-left:24px}
.prose ul li:before{content:'';position:absolute;left:0;top:12px;width:10px;height:2px;
  background:var(--c)}
.prose ol li{counter-increment:n}
.prose ol li:before{content:counter(n)'.';position:absolute;left:0;top:0;color:var(--c);
  font-weight:800;font-size:.95rem}
.prose a{color:var(--c);font-weight:600;border-bottom:1px solid rgba(var(--glow),.32)}
.prose a:hover{border-bottom-color:var(--c)}
.prose strong{font-weight:700;color:var(--ink)}
.prose blockquote{border-left:3px solid var(--c);padding:2px 0 2px 20px;margin:0 0 22px;
  font-weight:600;color:var(--soft)}
.prose .panel,.prose .stmt{margin:0 0 26px;background:var(--paper);box-shadow:none;
  border-top:3px solid var(--c);border-radius:12px}
.prose .row{border-top-color:var(--rule)}
.tablewrap{overflow-x:auto;margin:0 0 26px}
.prose table{width:100%;border-collapse:collapse;font-size:.98rem;min-width:400px}
.prose caption{text-align:left;font-size:.66rem;font-weight:900;letter-spacing:.16em;
  text-transform:uppercase;color:var(--mute);padding-bottom:10px}
.prose th{text-align:left;font-weight:800;font-size:.71rem;letter-spacing:.1em;
  text-transform:uppercase;color:var(--mute);border-bottom:2px solid var(--ink);
  padding:0 14px 9px 0}
.prose td{padding:11px 14px 11px 0;border-bottom:1px solid var(--hair);line-height:1.5;
  color:var(--body);vertical-align:top}
.prose td:last-child,.prose th:last-child{text-align:right;padding-right:0;
  font-variant-numeric:tabular-nums;white-space:nowrap}
.note{background:var(--wash);border-radius:12px;padding:20px 22px;margin:0 0 26px}
.note b{display:block;font-size:.68rem;font-weight:900;letter-spacing:.16em;
  text-transform:uppercase;color:var(--c);margin-bottom:8px}
.note p{font-size:1rem;line-height:1.64;color:var(--body);margin:0 0 10px}
.note p:last-child{margin-bottom:0}
.toc{position:sticky;top:24px;background:var(--panel);border-radius:14px;padding:22px 24px;
  box-shadow:0 6px 22px rgba(20,17,15,.06)}
.toc b{display:block;font-size:.66rem;font-weight:900;letter-spacing:.16em;
  text-transform:uppercase;color:var(--mute);margin-bottom:10px}
.toc a{display:block;font-size:.9rem;font-weight:600;padding:7px 0;line-height:1.35;
  border-top:1px solid var(--hair);color:var(--soft)}
.toc a:first-of-type{border-top:none}
.toc a:hover{color:var(--c)}
@media (max-width:1000px){.article{grid-template-columns:1fr;gap:28px}
  .toc{position:static;order:-1}}
@media (max-width:640px){.prose{padding:26px 22px 30px;border-radius:12px}
  .prose h2{font-size:1.45rem}}

/* ── FAQs ─────────────────────────────────────────────────────────────── */
/* Was broken once: .faqs carried grid-column on the grid CONTAINER, so every
   question became a one-column grid item and the answers rendered as unreadable
   vertical strips. Keep this a plain block; the rows do their own layout. */
.faqs{display:block}
.fq{background:var(--panel);border-radius:14px;padding:24px 28px;margin-bottom:12px;
  box-shadow:0 4px 16px rgba(20,17,15,.05);display:grid;grid-template-columns:1fr 1.4fr;
  gap:34px;align-items:start}
.fq h3{font-size:1.1rem;font-weight:800;letter-spacing:-.015em;line-height:1.32;
  grid-column:1;grid-row:1/-1}
.fq p{grid-column:2;font-size:.99rem;line-height:1.68;color:var(--soft);margin:0 0 12px}
.fq p:last-child{margin-bottom:0}
.fq a{color:var(--c);font-weight:600;border-bottom:1px solid rgba(var(--glow),.3)}
@media (max-width:860px){.fq{grid-template-columns:1fr;gap:12px;padding:22px 22px}
  .fq h3{grid-column:1;grid-row:auto}.fq p{grid-column:1}}

/* ── listing index ────────────────────────────────────────────────────── */
.list{display:grid;gap:12px}
.li{background:var(--panel);border-radius:14px;padding:24px 28px;
  box-shadow:0 4px 16px rgba(20,17,15,.05);display:grid;
  grid-template-columns:46px 1fr 1.15fr;gap:26px;align-items:start}
.li .n{width:34px;height:34px;border-radius:50%;background:var(--wash);color:var(--c);
  display:flex;align-items:center;justify-content:center;font-weight:800;font-size:.8rem;flex:none}
.li h2,.li h3{font-size:1.2rem;font-weight:800;letter-spacing:-.02em;line-height:1.25}
.li h2 a:hover,.li h3 a:hover{color:var(--c)}
.li p{font-size:.97rem;line-height:1.6;color:var(--soft)}
.li .go{font-size:.86rem;font-weight:700;color:var(--c);margin-top:8px;display:inline-block}
.li .meta{font-size:.72rem;font-weight:700;letter-spacing:.09em;text-transform:uppercase;
  color:var(--mute);margin-top:8px}
@media (max-width:860px){.li{grid-template-columns:34px 1fr;gap:12px 18px}
  .li>div:last-child{grid-column:2}}

/* ── fee cards (from direction B, used on pricing + services) ─────────── */
.fees{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.fc{background:var(--panel);border-radius:14px;overflow:hidden;display:flex;
  flex-direction:column;box-shadow:0 6px 22px rgba(20,17,15,.07)}
.fc .hd{background:var(--ink);color:#fff;padding:24px 24px 22px;text-align:center;
  border-top:4px solid var(--c)}
.fc .hd h3{font-size:1.24rem;font-weight:800;letter-spacing:-.02em}
.fc .hd .who{font-size:.78rem;color:#a9a49d;margin-top:7px;font-style:italic}
.fc .hd p{font-size:.9rem;line-height:1.5;color:#d8d3cc;margin-top:14px}
.fc .inc{font-size:.7rem;font-weight:900;letter-spacing:.14em;text-transform:uppercase;
  color:var(--c);text-align:center;padding:20px 24px 2px}
.fc ul{list-style:none;padding:0 24px;margin:0}
.fc li{font-size:.93rem;line-height:1.5;text-align:center;padding:13px 0;
  border-bottom:1px solid var(--hair);color:var(--soft)}
.fc li:last-child{border-bottom:none}
.fc .foot{margin-top:auto;padding:20px 24px 26px;text-align:center}
.fc .price{display:inline-block;background:var(--c);color:#fff;font-weight:800;font-size:1rem;
  padding:14px 30px;border-radius:100px}
.fc .price em{display:block;font-style:normal;font-size:.74rem;font-weight:600;opacity:.86;
  margin-top:3px}
@media (max-width:980px){.fees{grid-template-columns:1fr}}

/* ── calculators ──────────────────────────────────────────────────────── */
.calc{display:grid;grid-template-columns:.95fr 1.05fr;gap:36px;align-items:start;
  padding-bottom:20px}
.calcbox{background:var(--panel);border-radius:16px;padding:28px 30px;
  box-shadow:0 14px 44px rgba(20,17,15,.09)}
.fields{display:grid;gap:18px}
.f label{display:block;font-size:.7rem;font-weight:900;letter-spacing:.14em;
  text-transform:uppercase;color:var(--mute);margin-bottom:7px}
.f input,.f select{width:100%;border:1.5px solid var(--rule);background:var(--paper);
  border-radius:11px;padding:13px 15px;font-size:1rem;font-family:inherit;font-weight:600;
  color:var(--ink)}
.f input:focus,.f select:focus{outline:2px solid var(--c);outline-offset:1px;background:#fff}
.f .hint{font-size:.8rem;color:var(--mute);margin-top:6px;line-height:1.5}
.out{min-height:120px}
.out .empty{background:var(--panel);border-radius:16px;padding:26px 28px;font-size:.97rem;
  color:var(--mute);line-height:1.62;box-shadow:0 6px 22px rgba(20,17,15,.06)}
.out .empty a{color:var(--c);font-weight:600}
.err{color:var(--c);font-weight:700;font-size:.94rem;background:var(--wash);
  border-radius:12px;padding:16px 18px;line-height:1.55}
.err a{border-bottom:1px solid rgba(var(--glow),.4)}
@media (max-width:1000px){.calc{grid-template-columns:1fr}}

/* the end product: print it, copy it, or have it emailed */
.outacts{display:flex;gap:10px;flex-wrap:wrap;margin-top:16px}
.ghostbtn{background:var(--panel);border:1.5px solid var(--rule);color:var(--ink);
  font-weight:700;font-size:.86rem;padding:11px 18px;cursor:pointer;font-family:inherit;
  border-radius:100px}
.ghostbtn:hover{border-color:var(--c);color:var(--c)}
.resultmail{margin-top:14px;background:var(--panel);border-radius:14px;padding:18px 20px;
  display:flex;gap:10px;flex-wrap:wrap;align-items:center;
  box-shadow:0 4px 16px rgba(20,17,15,.05)}
.resultmail label{width:100%;font-size:.7rem;font-weight:900;letter-spacing:.14em;
  text-transform:uppercase;color:var(--mute)}
.resultmail input{flex:1;min-width:200px;border:1.5px solid var(--rule);border-radius:11px;
  padding:12px 14px;font-size:.96rem;font-family:inherit;background:var(--paper)}
.resultmail button{background:var(--c);color:#fff;border:none;font-weight:700;font-size:.94rem;
  padding:12px 22px;cursor:pointer;font-family:inherit;border-radius:100px}
.resultmail button:hover{background:var(--c2)}
.resultmail .msg{width:100%;font-weight:700;color:var(--c);font-size:.9rem}
@media print{.outacts,.resultmail,.nav,.close,.footnav,.capture{display:none}
  body{background:#fff}.panel,.prose{box-shadow:none;border:1px solid #ccc}}

/* ── capture + enquiry ────────────────────────────────────────────────── */
.capture{background:var(--panel);border-radius:18px;padding:32px 36px;
  box-shadow:0 6px 22px rgba(20,17,15,.06);display:grid;grid-template-columns:1fr 1.05fr;
  gap:40px;align-items:center;margin:10px 0 0}
.capture h2{font-size:1.45rem;font-weight:800;letter-spacing:-.022em;margin-bottom:8px}
.capture p{font-size:.99rem;color:var(--soft);line-height:1.62}
.capture form{display:flex;gap:10px;flex-wrap:wrap;align-items:flex-start}
.capture input{flex:1;min-width:210px;border:1.5px solid var(--rule);border-radius:11px;
  padding:13px 15px;font-size:1rem;font-family:inherit;background:var(--paper)}
.capture button{background:var(--c);color:#fff;border:none;font-weight:700;font-size:.98rem;
  padding:14px 26px;cursor:pointer;font-family:inherit;border-radius:100px}
.capture button:hover{background:var(--c2)}
.capture .msg{width:100%;font-weight:700;color:var(--c);font-size:.92rem}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
@media (max-width:900px){.capture{grid-template-columns:1fr;gap:20px;padding:26px 22px}}

.enqgrid{display:grid;grid-template-columns:1.3fr .7fr;gap:40px;align-items:start;
  padding-bottom:50px}
.enq{background:var(--panel);border-radius:18px;padding:32px 36px;
  box-shadow:0 6px 22px rgba(20,17,15,.06)}
.enq textarea{width:100%;border:1.5px solid var(--rule);border-radius:11px;padding:13px 15px;
  font-size:1rem;font-family:inherit;min-height:140px;resize:vertical;background:var(--paper)}
.enq textarea:focus{outline:2px solid var(--c);outline-offset:1px;background:#fff}
.enq .msg{font-weight:700;color:var(--c);font-size:.95rem}
.enqside{background:var(--panel);border-radius:18px;padding:26px 28px;
  box-shadow:0 6px 22px rgba(20,17,15,.06)}
.enqside b{display:block;font-size:.68rem;font-weight:900;letter-spacing:.16em;
  text-transform:uppercase;color:var(--mute);margin:20px 0 8px}
.enqside b:first-child{margin-top:0}
.enqside p{font-size:.94rem;line-height:1.62;color:var(--soft)}
.enqside a{color:var(--c);font-weight:600}
@media (max-width:900px){.enqgrid{grid-template-columns:1fr;gap:22px}.enq{padding:26px 22px}}

/* ── close panel + footer ─────────────────────────────────────────────── */
.close{background:var(--ink);color:#fff;margin-top:16px}
.closein{display:grid;grid-template-columns:1.2fr .8fr;gap:40px;align-items:center;
  padding:64px 0}
.close h2{font-size:clamp(2rem,3.6vw,3.2rem);letter-spacing:-.04em;font-weight:800;
  line-height:1.02}
.close .r a{margin-bottom:14px}
.close .r p{font-size:.9rem;color:#a29c94;line-height:1.6}
@media (max-width:860px){.closein{grid-template-columns:1fr;gap:26px;padding:48px 0}}

.footnav{display:grid;grid-template-columns:repeat(4,1fr);gap:28px;padding:48px 0 30px}
.footnav b{display:block;font-size:.66rem;font-weight:900;letter-spacing:.16em;
  text-transform:uppercase;color:var(--mute);margin-bottom:12px}
.footnav a{display:block;font-size:.92rem;font-weight:600;padding:5px 0;line-height:1.45;
  color:var(--soft)}
.footnav a:hover{color:var(--c)}
.foot{display:flex;justify-content:space-between;gap:30px;flex-wrap:wrap;
  padding:22px 0 46px;font-size:.79rem;color:var(--mute);line-height:1.7;
  border-top:1px solid var(--rule)}
.foot a{border-bottom:1px solid var(--rule)}
.foot a:hover{color:var(--c)}
.foot .reg{max-width:78ch}
.foot strong{color:var(--soft);font-weight:700}
@media (max-width:900px){.footnav{grid-template-columns:repeat(2,1fr);gap:24px}}
@media (max-width:560px){.footnav{grid-template-columns:1fr}.foot{flex-direction:column;gap:14px}
  .wrap{padding:0 22px}}

/* ── instruction form ─────────────────────────────────────────────────── */
.instruct .fsec{font-size:1.15rem;font-weight:800;letter-spacing:-.02em;margin:30px 0 16px;
  padding-bottom:9px;border-bottom:2px solid var(--ink)}
.instruct .fsec:first-of-type{margin-top:0}
.radios{display:flex;gap:18px;flex-wrap:wrap;padding-top:2px}
.rad{display:flex;align-items:center;gap:8px;font-size:.98rem;font-weight:500;cursor:pointer}
.rad input{width:18px;height:18px;accent-color:var(--c);flex:none}
.rad.decl{align-items:flex-start;gap:11px;font-size:.95rem;line-height:1.55;color:var(--soft)}
.rad.decl input{margin-top:3px}
.regime{display:none}
.regime.on{display:block;background:var(--wash);border-radius:12px;padding:16px 18px}
.regime b{display:block;font-size:.68rem;font-weight:900;letter-spacing:.15em;
  text-transform:uppercase;color:var(--c);margin-bottom:7px}
.regime p{font-size:.94rem;line-height:1.6;color:var(--body);margin:0}
.costing{margin:26px 0 4px}
.costing .empty{background:var(--paper);border:1.5px dashed var(--rule);border-radius:14px;
  padding:22px 24px;font-size:.95rem;color:var(--mute);line-height:1.6}
.costing .panel{border-top:3px solid var(--c)}
.instruct textarea{width:100%;border:1.5px solid var(--rule);border-radius:11px;padding:13px 15px;
  font-size:1rem;font-family:inherit;resize:vertical;background:var(--paper)}
.instruct textarea:focus{outline:2px solid var(--c);outline-offset:1px;background:#fff}
.instruct .hint a{color:var(--c);font-weight:600}

/* ── "what happens next" — BELOW the form, never beside it ─────────────── */
/* Next to a long instruction form this was a short column against a very tall
   one, with a wall of dead space under it. Andy, 30 Aug 2026: "it looks stupid
   on the side". */
.nextup{background:var(--panel);border-radius:18px;padding:34px 36px 30px;
  box-shadow:0 6px 22px rgba(20,17,15,.06);margin-bottom:10px}
.nexthead{margin-bottom:26px;max-width:60ch}
.nexthead h2{font-size:1.7rem;font-weight:800;letter-spacing:-.028em;margin-bottom:8px}
.nexthead p{font-size:1rem;line-height:1.6;color:var(--soft)}
.nextgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:28px}
.nextgrid>div{border-top:2px solid var(--ink);padding-top:16px}
.nextgrid .n{display:flex;align-items:center;justify-content:center;width:28px;height:28px;
  border-radius:50%;background:var(--c);color:#fff;font-weight:800;font-size:.8rem;
  margin-bottom:11px}
.nextgrid h3{font-size:1.04rem;font-weight:800;letter-spacing:-.015em;margin-bottom:7px}
.nextgrid p{font-size:.93rem;line-height:1.58;color:var(--soft)}
.nextfine{margin-top:26px;padding-top:18px;border-top:1px solid var(--hair);
  font-size:.85rem;line-height:1.6;color:var(--mute)}
.nextfine a{color:var(--c);font-weight:600}
@media (max-width:980px){.nextgrid{grid-template-columns:repeat(2,1fr);gap:24px}}
@media (max-width:600px){.nextgrid{grid-template-columns:1fr}.nextup{padding:26px 22px 24px}}

/* fee note under the home-page fee cards */
.feenote{background:var(--panel);border-radius:14px;padding:20px 24px;margin-top:16px;
  box-shadow:0 4px 16px rgba(20,17,15,.05);display:grid;grid-template-columns:1fr 1fr;gap:28px}
.feenote p{font-size:.95rem;line-height:1.62;color:var(--soft)}
.feenote a{color:var(--c);font-weight:600;border-bottom:1px solid rgba(var(--glow),.3)}
.feenote strong{color:var(--ink)}
@media (max-width:800px){.feenote{grid-template-columns:1fr;gap:14px}}