/* ==========================================================================
   KASAT & SABOO LLP — "Meridian" theme
   Deep petrol → jade gradients, marigold accent, warm ivory canvas.
   Fraunces (display) + Plus Jakarta Sans (body) + Space Grotesk (labels).
   Variable names are kept identical to the classic theme so both themes
   are drop-in interchangeable.
   ========================================================================== */

:root{
  /* remapped core tokens */
  --navy:#0C3B4A; --navy-2:#0F4B5C; --slate:#2C6E7F;
  --ivory:#FBF7F1; --paper:#FFFFFF;
  --gold:#F5A623; --gold-soft:#FFC968; --gold-deep:#B85C15;
  --ink:#14303B; --muted:#5A7480; --muted-dark:#A9C6CE;
  --line:rgba(12,59,74,.12); --line-strong:rgba(12,59,74,.22); --line-dark:rgba(255,255,255,.16);
  --ok:#1B7A6E; --err:#C24A2E;

  /* new to this theme */
  --jade:#1B7A6E; --jade-2:#25998A; --mint:#E4F4EE; --sky:#DDEFF6; --coral:#E8664F;
  --sand:#FDF1DC;
  --grad-deep:linear-gradient(135deg,#0C3B4A 0%,#125A63 55%,#1B7A6E 100%);
  --grad-warm:linear-gradient(135deg,#F5A623 0%,#E8664F 100%);
  --grad-mint:linear-gradient(135deg,#E4F4EE 0%,#DDEFF6 100%);

  --serif:"Fraunces",Georgia,serif;
  --sans:"Plus Jakarta Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif;
  --mono:"Space Grotesk",ui-monospace,SFMono-Regular,Menlo,monospace;

  --r:20px; --r-sm:14px; --pill:999px;
  --sh-1:0 10px 30px rgba(12,59,74,.08);
  --sh-2:0 24px 60px rgba(12,59,74,.16);
  --sh-warm:0 16px 38px rgba(245,166,35,.28);

  --pad-x:clamp(20px,5vw,64px); --sec-y:clamp(70px,8.5vw,126px); --maxw:1240px;
  --ease:cubic-bezier(.22,.61,.36,1);
}

/* ---------- base ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:110px}
body{margin:0;color:var(--ink);font-family:var(--sans);font-size:17px;line-height:1.7;
  -webkit-font-smoothing:antialiased;overflow-x:hidden;position:relative;
  background:
    radial-gradient(58vw 46vw at 88% -6%, rgba(245,166,35,.22), transparent 62%),
    radial-gradient(52vw 44vw at -8% 12%, rgba(27,122,110,.18), transparent 60%),
    radial-gradient(46vw 40vw at 96% 58%, rgba(232,102,79,.10), transparent 60%),
    var(--ivory);
  background-attachment:fixed;
}
img,svg{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit;color:inherit}
h1,h2,h3,h4{margin:0;font-weight:600;letter-spacing:-.022em}
p{margin:0}
ul,ol{margin:0;padding:0;list-style:none}
table{border-collapse:collapse;width:100%}
::selection{background:var(--gold);color:#0C3B4A}
:focus-visible{outline:3px solid var(--gold);outline-offset:3px;border-radius:6px}
.skip{position:absolute;left:-9999px;top:0;z-index:300;background:var(--navy);color:#fff;padding:12px 20px;border-radius:var(--pill)}
.skip:focus{left:12px;top:12px}
.wrap{width:100%;max-width:var(--maxw);margin:0 auto;padding-inline:var(--pad-x)}
.section{padding-block:var(--sec-y);position:relative}
.section--tight{padding-top:0}
.paper{background:var(--paper)}

/* dark blocks become deep gradient panels */
.dark{background:var(--grad-deep);color:#EAF6F4;position:relative;overflow:hidden}
.dark::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(40vw 30vw at 88% 8%, rgba(245,166,35,.24), transparent 65%),
             radial-gradient(36vw 30vw at 4% 92%, rgba(37,153,138,.34), transparent 62%)}
.dark>*{position:relative;z-index:2}
.dark p{color:#B9D8D6}

/* ---------- type ---------- */
.display{font-family:var(--serif);font-weight:600;line-height:1.03;letter-spacing:-.03em;
  font-variation-settings:"SOFT" 30,"WONK" 1}
h1.display{font-size:clamp(40px,6vw,80px)}
h2.display{font-size:clamp(31px,4.4vw,56px)}
h3.display{font-size:clamp(21px,2.2vw,29px);line-height:1.18}
.display em{font-style:italic;background:var(--grad-warm);-webkit-background-clip:text;background-clip:text;color:transparent}
.dark .display em{background:linear-gradient(120deg,#FFC968,#FFE3A8);-webkit-background-clip:text;background-clip:text;color:transparent}
.eyebrow{font-family:var(--mono);font-size:11px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;
  color:var(--gold-deep);display:inline-flex;align-items:center;gap:9px;margin-bottom:20px;
  background:var(--sand);border:1px solid rgba(184,92,21,.2);padding:7px 15px 7px 12px;border-radius:var(--pill)}
.eyebrow::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--grad-warm);flex:none}
.dark .eyebrow{color:#FFD79A;background:rgba(255,201,104,.12);border-color:rgba(255,201,104,.28)}
.lede{font-size:clamp(16.5px,1.25vw,19px);color:var(--muted);max-width:64ch}
.dark .lede{color:#C6E2E0}
.prose p{color:var(--muted);max-width:72ch}
.prose p+p{margin-top:18px}
.prose h3{font-family:var(--serif);font-size:clamp(21px,2vw,27px);color:var(--navy);margin:34px 0 12px}
.mono-note{font-family:var(--mono);font-size:12px;letter-spacing:.02em;color:var(--muted);line-height:1.8}

/* ---------- buttons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:15px 30px;font-size:14px;
  font-weight:700;letter-spacing:.01em;text-transform:none;border:0;border-radius:var(--pill);
  background:var(--grad-deep);color:#fff;cursor:pointer;box-shadow:var(--sh-1);
  transition:transform .3s var(--ease),box-shadow .3s var(--ease),filter .3s var(--ease)}
.btn:hover{transform:translateY(-3px);box-shadow:var(--sh-2);filter:saturate(1.15)}
.btn--ghost{background:transparent;color:var(--navy);box-shadow:none;border:1.5px solid rgba(12,59,74,.22)}
.btn--ghost:hover{background:rgba(12,59,74,.05);box-shadow:none;transform:translateY(-3px)}
.btn--gold{background:var(--grad-warm);color:#3A1D06;box-shadow:var(--sh-warm)}
.btn--sm{padding:11px 22px;font-size:13px}
.dark .btn{background:var(--grad-warm);color:#3A1D06;box-shadow:var(--sh-warm)}
.dark .btn--ghost{background:rgba(255,255,255,.08);color:#EAF6F4;border:1.5px solid rgba(255,255,255,.28);box-shadow:none}
.dark .btn--ghost:hover{background:rgba(255,255,255,.16)}
.btn .ar{transition:transform .3s var(--ease)}
.btn:hover .ar{transform:translateX(4px)}
.tlink{display:inline-flex;align-items:center;gap:8px;font-size:14.5px;font-weight:700;color:var(--jade);
  position:relative;padding-bottom:3px}
.tlink::after{content:"";position:absolute;left:0;bottom:0;height:2px;width:100%;border-radius:2px;
  background:var(--grad-warm);transform:scaleX(.28);transform-origin:left;transition:transform .45s var(--ease)}
.tlink:hover::after{transform:scaleX(1)}
.tlink .ar{transition:transform .4s var(--ease)}
.tlink:hover .ar{transform:translateX(5px)}
.dark .tlink{color:#FFD79A}

/* ---------- reveal ---------- */
.rv{opacity:0;transform:translateY(22px);transition:opacity .8s var(--ease),transform .8s var(--ease)}
.rv.in{opacity:1;transform:none}
.rv.d1{transition-delay:.08s}.rv.d2{transition-delay:.16s}.rv.d3{transition-delay:.24s}
.rv.d4{transition-delay:.32s}.rv.d5{transition-delay:.4s}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}
  .rv{opacity:1;transform:none}
}

/* ---------- utility bar + header ---------- */
.ubar{background:var(--grad-deep);color:#B9D8D6;font-family:var(--mono);font-size:11.5px;letter-spacing:.02em;
  text-transform:none}
.ubar__in{display:flex;align-items:center;justify-content:space-between;gap:18px;height:40px;overflow:hidden}
.ubar a{transition:color .3s}
.ubar a:hover{color:var(--gold-soft)}
.ubar__r{display:flex;gap:18px;align-items:center;white-space:nowrap}
.ubar .dot{color:var(--gold)}

.hdr{position:sticky;top:0;z-index:100;background:rgba(255,255,255,.82);backdrop-filter:saturate(180%) blur(18px);
  border-bottom:1px solid rgba(12,59,74,.08)}
.hdr__in{display:flex;align-items:center;justify-content:space-between;gap:20px;height:86px}
.brand{display:flex;align-items:center;gap:13px}
.brand__mk{width:auto;height:52px;flex:none;border:0;border-radius:0;display:grid;place-items:center;
  background:none;box-shadow:none;color:var(--navy);transition:transform .4s var(--ease)}
.brand:hover .brand__mk{transform:translateY(-2px)}
.brand{align-items:center}
.brand>span:last-child{display:flex;flex-direction:column}
.brand__nm{display:block;font-family:var(--serif);font-weight:600;font-size:20px;line-height:1.05;
  color:var(--navy);white-space:nowrap}
.brand__sub{display:block;font-family:var(--mono);font-size:10px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--jade);margin-top:5px;white-space:nowrap}
.nav{display:flex;align-items:center;gap:4px;flex-wrap:nowrap}
.nav__i{position:relative}
.nav__i>a{display:inline-flex;align-items:center;gap:7px;font-size:14.5px;font-weight:600;padding:10px 15px;
  border-radius:var(--pill);white-space:nowrap;transition:background .3s,color .3s}
.nav__i:hover>a,.nav__i.active>a{background:var(--mint);color:var(--jade)}
.nav__i.has>a::before{content:"";width:5px;height:5px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;
  transform:rotate(45deg) translateY(-2px);order:2;opacity:.6;transition:transform .3s}
.nav__i.has:hover>a::before{transform:rotate(225deg) translateY(-1px)}
.drop{position:absolute;top:calc(100% + 6px);left:0;min-width:274px;background:#fff;border-radius:var(--r);
  padding:10px;opacity:0;visibility:hidden;transform:translateY(10px);box-shadow:var(--sh-2);
  transition:opacity .3s var(--ease),transform .3s var(--ease),visibility .3s}
.nav__i:hover .drop,.nav__i:focus-within .drop{opacity:1;visibility:visible;transform:none}
.drop a{display:block;padding:11px 16px;font-size:14.5px;font-weight:500;color:var(--muted);border-radius:12px;
  transition:color .25s,background .25s,transform .25s}
.drop a:hover{color:var(--navy);background:var(--mint);transform:translateX(3px)}
.burger{display:none;width:46px;height:46px;border:0;border-radius:14px;background:var(--mint);cursor:pointer;
  align-items:center;justify-content:center;flex-direction:column;gap:5px}
.burger span{display:block;width:18px;height:2px;border-radius:2px;background:var(--navy);
  transition:transform .35s var(--ease),opacity .35s}
.burger[aria-expanded="true"] span:nth-child(1){transform:translateY(4px) rotate(45deg)}
.burger[aria-expanded="true"] span:nth-child(2){opacity:0}
.burger[aria-expanded="true"] span:nth-child(3){transform:translateY(-3px) rotate(-45deg)}
.mnav{position:fixed;inset:0;z-index:99;background:var(--grad-deep);color:#fff;overflow-y:auto;
  padding:96px var(--pad-x) 56px;opacity:0;visibility:hidden;transform:translateY(-10px);
  transition:opacity .45s var(--ease),transform .45s var(--ease),visibility .45s}
.mnav.open{opacity:1;visibility:visible;transform:none}
.mnav a{display:block;font-family:var(--serif);font-weight:600;font-size:27px;line-height:1.5;
  border-bottom:1px solid rgba(255,255,255,.14);padding:9px 0}
.mnav a.sub{font-family:var(--sans);font-size:15px;font-weight:500;color:#B9D8D6;padding:8px 0 8px 18px}
.mnav__ft{margin-top:30px;font-family:var(--mono);font-size:12px;color:#B9D8D6;line-height:2}

/* ---------- page hero ---------- */
.phero{background:var(--grad-deep);color:#EAF6F4;position:relative;overflow:hidden;
  padding-block:clamp(62px,8vw,110px);border-radius:0 0 clamp(24px,4vw,48px) clamp(24px,4vw,48px)}
.phero::after{content:"";position:absolute;inset:0;
  background:radial-gradient(38vw 30vw at 90% 0%, rgba(245,166,35,.3), transparent 62%),
             radial-gradient(34vw 30vw at 0% 100%, rgba(37,153,138,.4), transparent 60%)}
.phero__bg{position:absolute;inset:0;opacity:.22;pointer-events:none;z-index:1}
.phero__bg path{stroke:#FFC968}
.phero__in{position:relative;z-index:3;max-width:76ch}
.phero h1{margin-bottom:18px}
.phero p{font-size:clamp(16px,1.25vw,19px);color:#C6E2E0;max-width:64ch}
.crumb{display:flex;gap:10px;flex-wrap:wrap;font-family:var(--mono);font-size:12px;color:#9FC6C9;margin-bottom:26px}
.crumb a:hover{color:var(--gold-soft)}
.crumb span{color:var(--gold-soft)}

/* ---------- home hero ---------- */
.hero{padding-top:clamp(46px,6vw,86px);padding-bottom:clamp(40px,5vw,74px);overflow:hidden;position:relative}
.hero__grid{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(30px,5vw,70px);align-items:center}
.hero__kicker{font-family:var(--mono);font-size:12.5px;letter-spacing:.03em;color:var(--jade);margin-bottom:22px;
  display:inline-flex;align-items:center;gap:9px;background:var(--mint);padding:8px 16px;border-radius:var(--pill)}
.hero__kicker b{color:var(--navy);font-weight:700}
.hero h1{margin-bottom:24px}
.hero h1 .l2{display:block;background:var(--grad-warm);-webkit-background-clip:text;background-clip:text;color:transparent}
.hero__p{max-width:48ch;color:var(--muted);font-size:clamp(16px,1.3vw,19px)}
.hero__cta{display:flex;flex-wrap:wrap;gap:14px;margin-top:34px}
.hero__meta{margin-top:38px;padding-top:20px;border-top:1px solid var(--line);font-family:var(--mono);font-size:13px;
  letter-spacing:.02em;color:var(--muted)}
.hero__meta span{color:var(--gold);font-weight:700}

/* recolour the inherited ledger artwork for this palette */
.hero__art{position:relative}
.hero__art::before{content:"";position:absolute;inset:6% 4%;border-radius:32px;
  background:radial-gradient(circle at 30% 20%, rgba(245,166,35,.28), transparent 60%),
             radial-gradient(circle at 80% 80%, rgba(27,122,110,.26), transparent 62%);
  filter:blur(26px);animation:float 13s ease-in-out infinite alternate}
.hero__art svg{position:relative}
.hero__art svg rect{fill:rgba(27,122,110,.12)}
.hero__art svg rect[fill="none"]{fill:none;stroke:rgba(12,59,74,.28)}
.hero__art svg g[stroke] path{stroke:rgba(12,59,74,.16)}
.hero__art svg path[stroke="#8A6E3C"],.hero__art svg path[stroke="#C3A96B"]{stroke:#F5A623;stroke-width:1.6}
.hero__art svg circle{fill:#E8664F}
.hero__art svg .pulse{fill:#F5A623}
.hero__art svg text{fill:#7C97A1;font-family:var(--mono)}
@keyframes float{from{transform:translate3d(0,0,0) scale(1)}to{transform:translate3d(0,-16px,0) scale(1.05)}}
.dr{stroke-dasharray:1;stroke-dashoffset:1;animation:draw 2.4s var(--ease) forwards}
@keyframes draw{to{stroke-dashoffset:0}}
.node{animation:drift 17s ease-in-out infinite alternate}
@keyframes drift{from{transform:translateX(0)}to{transform:translateX(200px)}}
.pulse{animation:pulse 4.2s ease-in-out infinite}
@keyframes pulse{0%,100%{opacity:.3;r:5}50%{opacity:.9;r:10}}

/* ---------- stats / values ---------- */
.trust{border:0;background:transparent;padding-block:clamp(10px,2vw,24px)}
.trust__grid{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(12px,1.6vw,22px);
  padding-inline:var(--pad-x);max-width:var(--maxw);margin:0 auto}
.trust__i{padding:clamp(24px,2.8vw,34px);border:0;border-radius:var(--r);background:#fff;box-shadow:var(--sh-1);
  transition:transform .4s var(--ease),box-shadow .4s var(--ease)}
.trust__i:hover{transform:translateY(-6px);box-shadow:var(--sh-2)}
.trust__i:nth-child(2){background:var(--mint)}
.trust__i:nth-child(3){background:var(--sand)}
.trust__i:nth-child(4){background:var(--sky)}
.trust__n{font-family:var(--serif);font-weight:600;font-size:clamp(34px,4.4vw,56px);line-height:1;letter-spacing:-.03em;
  background:var(--grad-deep);-webkit-background-clip:text;background-clip:text;color:transparent}
.trust__i:nth-child(3) .trust__n{background:var(--grad-warm);-webkit-background-clip:text;background-clip:text;color:transparent}
.trust__n .u{-webkit-text-fill-color:#E8664F}
.trust__l{font-family:var(--mono);font-size:12px;letter-spacing:.02em;color:var(--muted);margin-top:12px;line-height:1.6}
.vals{background:var(--grad-warm);color:#3A1D06;padding:clamp(18px,2.2vw,26px) 0}
.vals__in{display:flex;align-items:center;justify-content:center;gap:clamp(14px,4vw,52px);flex-wrap:wrap;text-align:center}
.vals__w{font-family:var(--serif);font-weight:600;font-size:clamp(19px,2.1vw,28px);letter-spacing:-.02em}
.vals__d{width:8px;height:8px;background:#3A1D06;opacity:.45;border-radius:50%;transform:none;flex:none}

/* ---------- section head ---------- */
.sec-head{display:grid;grid-template-columns:1fr auto;gap:24px;align-items:end;margin-bottom:clamp(32px,4.4vw,58px)}
.sec-head p.hint{max-width:32ch;color:var(--muted);font-size:15.5px}
.dark .sec-head p.hint{color:#B9D8D6}

/* ---------- cards ---------- */
.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:clamp(30px,5vw,80px)}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(20px,2.2vw,28px)}
.grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(16px,1.8vw,24px);background:transparent;border:0}
.card{background:#fff;border:0;border-radius:var(--r);padding:clamp(24px,2.6vw,34px);display:flex;flex-direction:column;
  box-shadow:var(--sh-1);position:relative;overflow:hidden;
  transition:transform .45s var(--ease),box-shadow .45s var(--ease)}
.card::before{content:"";position:absolute;left:0;right:0;top:0;height:4px;background:var(--grad-warm);
  transform:scaleX(0);transform-origin:left;transition:transform .5s var(--ease)}
.card:hover{transform:translateY(-8px);box-shadow:var(--sh-2)}
.card:hover::before{transform:scaleX(1)}
.card__k{font-family:var(--mono);font-size:11.5px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;
  color:var(--jade);background:var(--mint);display:inline-block;padding:6px 13px;border-radius:var(--pill)}
.card__t{font-family:var(--serif);font-weight:600;font-size:clamp(20px,1.9vw,26px);color:var(--navy);
  margin:18px 0 10px;line-height:1.18;letter-spacing:-.02em}
.card__d{font-size:15px;color:var(--muted);line-height:1.66}
.card__b{margin-top:auto;padding-top:22px}
.tile{background:#fff;border-radius:var(--r);padding:clamp(24px,2.6vw,34px);box-shadow:var(--sh-1);
  transition:transform .45s var(--ease),box-shadow .45s var(--ease)}
.tile:hover{transform:translateY(-6px);box-shadow:var(--sh-2)}
.tile:nth-child(4n+2){background:var(--mint)}
.tile:nth-child(4n+3){background:var(--sand)}
.tile:nth-child(4n+4){background:var(--sky)}
.tile .card__k{background:rgba(255,255,255,.72)}
.dark .tile{background:rgba(255,255,255,.07);backdrop-filter:blur(6px);border:1px solid rgba(255,255,255,.12);box-shadow:none}
.dark .tile:nth-child(4n+2),.dark .tile:nth-child(4n+3),.dark .tile:nth-child(4n+4){background:rgba(255,255,255,.07)}
.dark .tile:hover{background:rgba(255,255,255,.13)}
.dark .card__t{color:#fff}
.dark .card__d{color:#B9D8D6}
.dark .card__k{color:#FFD79A;background:rgba(255,201,104,.14)}

/* ---------- service rows ---------- */
.svc{border:0;display:grid;gap:14px}
.svc__row{border:0;border-radius:var(--r);background:#fff;box-shadow:var(--sh-1);
  display:grid;grid-template-columns:auto 1fr auto;gap:clamp(16px,2.4vw,30px);align-items:center;
  padding:clamp(22px,2.4vw,30px);position:relative;overflow:hidden;
  transition:transform .4s var(--ease),box-shadow .4s var(--ease)}
.svc__row::before{content:"";position:absolute;left:0;top:0;bottom:0;width:5px;background:var(--grad-warm);
  transform:scaleY(0);transform-origin:top;transition:transform .45s var(--ease)}
.svc__row:hover{transform:translateY(-4px) translateX(4px);box-shadow:var(--sh-2)}
.svc__row:hover::before{transform:scaleY(1)}
.svc__n{font-family:var(--mono);font-size:14px;font-weight:700;color:#fff;background:var(--grad-deep);
  width:46px;height:46px;border-radius:14px;display:grid;place-items:center;letter-spacing:0}
.svc__row:nth-child(2n) .svc__n{background:var(--grad-warm);color:#3A1D06}
.svc__t{font-family:var(--serif);font-weight:600;font-size:clamp(21px,2.2vw,29px);color:var(--navy);line-height:1.15;
  letter-spacing:-.025em}
.svc__t small{display:block;font-family:var(--sans);font-weight:400;font-size:15px;color:var(--muted);margin-top:9px;
  letter-spacing:0;max-width:60ch;line-height:1.6}
.svc__go{font-family:var(--sans);font-size:14px;font-weight:700;color:var(--jade);white-space:nowrap;
  background:var(--mint);padding:10px 18px;border-radius:var(--pill);transition:background .35s,color .35s,transform .35s}
.svc__row:hover .svc__go{background:var(--grad-warm);color:#3A1D06;transform:translateX(4px)}

/* ---------- bullet lists ---------- */
.pts{columns:2;column-gap:clamp(24px,4vw,58px)}
.pts li{break-inside:avoid;display:flex;gap:12px;padding:10px 0;font-size:15.5px;color:var(--muted);line-height:1.55}
.pts li::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--grad-warm);flex:none;margin-top:9px}
.pts--1{columns:1}
.dark .pts li{color:#C6E2E0}

/* ---------- team ---------- */
.tm__cat{font-family:var(--mono);font-size:12px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;
  color:var(--jade);background:var(--mint);display:inline-block;padding:9px 20px;border-radius:var(--pill);
  border:0;margin:clamp(30px,3.6vw,48px) 0 clamp(20px,2.4vw,30px)}
.tm__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(20px,2.2vw,30px)}
.tm__grid--2{grid-template-columns:repeat(2,minmax(0,392px));justify-content:center}
@media (min-width:1021px){
  .tm__cat{display:block;width:fit-content;margin-left:auto;margin-right:auto;text-align:center}
}
.tm__c{background:#fff;border:0;border-radius:var(--r);padding:clamp(24px,2.6vw,32px);box-shadow:var(--sh-1);
  transition:transform .45s var(--ease),box-shadow .45s var(--ease)}
.tm__c:hover{transform:translateY(-8px);box-shadow:var(--sh-2)}
.tm__ph{width:96px;height:96px;flex:none;position:relative;border:0;border-radius:50%;overflow:hidden;
  background:var(--grad-deep);display:grid;place-items:center;margin-bottom:20px;
  box-shadow:0 0 0 4px #fff,0 0 0 7px rgba(245,166,35,.55)}
.tm__ph img{width:100%;height:100%;object-fit:cover;object-position:top center;position:absolute;inset:0}
.tm__ph i{font-family:var(--serif);font-style:normal;font-weight:600;font-size:30px;color:var(--gold-soft)}
.tm__nm{font-family:var(--serif);font-weight:600;font-size:clamp(21px,2vw,26px);color:var(--navy);line-height:1.15;letter-spacing:-.025em}
.tm__q{font-family:var(--mono);font-size:12px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;
  color:var(--gold-deep);margin:12px 0 5px}
.tm__r{font-size:14px;color:var(--jade);font-weight:600}
.tm__b{font-size:15px;color:var(--muted);line-height:1.66;margin-top:18px;padding-top:18px;border-top:1px solid var(--line)}
.tm__c--lead{grid-column:span 3;display:grid;grid-template-columns:auto 1fr;gap:clamp(24px,3vw,44px);align-items:start;
  background:var(--grad-mint)}
.tm__c--lead .tm__ph{width:136px;height:136px;margin-bottom:0}
.tm__c--lead .tm__b{max-width:80ch;border-top-color:rgba(12,59,74,.14)}

/* ---------- clientele ---------- */
.cli{display:grid;grid-template-columns:repeat(6,1fr);gap:clamp(10px,1.2vw,16px);background:transparent;border:0}
.cli__i{background:#fff;border-radius:var(--r-sm);padding:22px 14px;text-align:center;box-shadow:var(--sh-1);
  transition:transform .35s var(--ease),box-shadow .35s var(--ease),background .35s}
.cli__i:nth-child(3n+1){background:var(--mint)}
.cli__i:nth-child(5n+3){background:var(--sand)}
.cli__i:nth-child(7n+5){background:var(--sky)}
.cli__i:hover{transform:translateY(-6px) rotate(-1.5deg);box-shadow:var(--sh-2);background:var(--grad-deep)}
.cli__i span{font-size:14px;font-weight:600;line-height:1.35;color:var(--navy);transition:color .35s;display:block}
.cli__i:hover span{color:#fff}
.cli__i em{display:grid;place-items:center;width:50px;height:50px;border-radius:50%;margin:0 auto 14px;
  background:rgba(245,166,35,.16);color:var(--gold-deep);font-style:normal;
  transition:background .35s var(--ease),color .35s var(--ease),transform .35s var(--ease)}
.cli__i em svg{width:25px;height:25px}
.cli__i:hover em{background:rgba(255,255,255,.16);color:var(--gold-soft);transform:scale(1.08)}

/* ---------- testimonials ---------- */
.tst{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(18px,2.2vw,28px)}
.tst__c{border:0;border-radius:var(--r);background:#fff;box-shadow:var(--sh-1);padding:clamp(24px,2.6vw,32px);
  padding-top:clamp(38px,4vw,48px);display:flex;flex-direction:column;margin:0;position:relative;
  transition:transform .45s var(--ease),box-shadow .45s var(--ease)}
.tst__c::before{content:"\201C";position:absolute;top:6px;left:22px;font-family:var(--serif);font-size:74px;
  line-height:1;color:var(--gold);opacity:.55}
.tst__c:hover{transform:translateY(-7px);box-shadow:var(--sh-2)}
.tst__c:nth-child(3n+2){background:var(--grad-mint)}
.tst__m{font-family:var(--sans);font-size:16.5px;font-style:normal;line-height:1.62;color:var(--ink);margin:0;font-weight:500}
.tst__f{margin-top:auto;padding-top:22px}
.tst__nm{font-size:15.5px;font-weight:700;color:var(--navy)}
.tst__rl{font-family:var(--mono);font-size:12px;color:var(--jade);margin-top:5px}

/* ---------- glance ---------- */
.glance{border:0;border-radius:var(--r);background:#fff;box-shadow:var(--sh-1);overflow:hidden}
.glance__h{display:flex;align-items:baseline;justify-content:space-between;gap:16px;padding:22px clamp(22px,2.6vw,32px);
  background:var(--grad-deep);color:#fff;flex-wrap:wrap}
.glance__h h3{font-family:var(--serif);font-weight:600;font-size:clamp(20px,2vw,26px);color:#fff}
.glance__h span{font-family:var(--mono);font-size:12px;color:#9FC6C9}
.glance__g{display:grid;grid-template-columns:repeat(3,1fr)}
.glance__i{padding:20px clamp(20px,2.6vw,30px);border-right:1px solid var(--line);border-bottom:1px solid var(--line);
  transition:background .35s}
.glance__i:hover{background:var(--mint)}
.glance__i:nth-child(3n){border-right:0}
.glance__k{font-family:var(--mono);font-size:11px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;
  color:var(--gold-deep);margin-bottom:7px}
.glance__v{font-size:16px;line-height:1.5;color:var(--navy);font-weight:600}
.glance__i--wide{grid-column:span 3;border-right:0;border-bottom:0}

/* ---------- tables ---------- */
.tbl-wrap{overflow-x:auto;border:0;border-radius:var(--r);background:#fff;box-shadow:var(--sh-1)}
table.tbl{min-width:520px;font-size:15px}
table.tbl caption{text-align:left;padding:20px 24px;font-family:var(--serif);font-weight:600;font-size:21px;color:#fff;
  background:var(--grad-deep)}
table.tbl th{font-family:var(--mono);font-size:11.5px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;
  color:var(--jade);text-align:left;padding:14px 24px;background:var(--mint);white-space:nowrap}
table.tbl td{padding:14px 24px;border-bottom:1px solid var(--line);color:var(--muted);vertical-align:top}
table.tbl tr:last-child td{border-bottom:0}
table.tbl td:first-child{color:var(--navy);font-weight:600}
table.tbl tbody tr:hover td{background:var(--sand)}

/* ---------- resources ---------- */
.kb{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(18px,2.2vw,28px)}
.kb__g{background:#fff;border-radius:var(--r);padding:clamp(22px,2.4vw,28px);box-shadow:var(--sh-1)}
.kb__g h3{font-family:var(--serif);font-weight:600;font-size:22px;color:var(--navy);padding-bottom:14px;
  border-bottom:2px solid var(--mint);margin-bottom:8px;letter-spacing:-.02em}
.kb__g li{border-bottom:1px solid var(--line)}
.kb__g li:last-child{border-bottom:0}
.kb__g a{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px 0;font-size:15px;
  font-weight:500;color:var(--muted);transition:color .3s,padding-left .3s var(--ease)}
.kb__g a:hover{color:var(--jade);padding-left:8px}
.kb__g a::after{content:"→";font-size:13px;color:var(--gold);opacity:0;transition:opacity .3s}
.kb__g a:hover::after{opacity:1}
.kb__g a[target="_blank"]::after{content:"↗"}

/* ---------- calculators ---------- */
.tabs{display:flex;flex-wrap:wrap;gap:8px;background:transparent;border:0;margin-bottom:34px}
.tabs button{flex:0 1 auto;background:#fff;border:0;padding:13px 22px;font-family:var(--sans);font-size:14.5px;
  font-weight:600;letter-spacing:0;text-transform:none;color:var(--muted);cursor:pointer;border-radius:var(--pill);
  box-shadow:var(--sh-1);transition:transform .3s var(--ease),color .3s,background .3s,box-shadow .3s}
.tabs button:hover{transform:translateY(-2px);color:var(--jade)}
.tabs button[aria-selected="true"]{background:var(--grad-deep);color:#fff;box-shadow:var(--sh-2)}
.calc{display:none}
.calc.on{display:block}
.calc__grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(22px,3vw,44px);align-items:start}
.calc__panel{background:#fff;border:0;border-radius:var(--r);padding:clamp(24px,3vw,38px);box-shadow:var(--sh-1)}
.calc__out{background:var(--grad-deep);color:#fff;padding:clamp(26px,3vw,38px);border-radius:var(--r);
  position:sticky;top:130px;box-shadow:var(--sh-2);overflow:hidden}
.calc__out::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(30vw 24vw at 100% 0%, rgba(245,166,35,.3), transparent 60%)}
.calc__out>*{position:relative;z-index:2}
.calc__out h4{font-family:var(--mono);font-size:12px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;
  color:#FFD79A;margin-bottom:20px}
.calc__big{font-family:var(--serif);font-weight:600;font-size:clamp(36px,4.6vw,56px);line-height:1;color:#fff;letter-spacing:-.03em}
.calc__big small{display:block;font-family:var(--mono);font-size:12.5px;letter-spacing:.02em;text-transform:none;
  color:#9FC6C9;margin-top:14px;font-weight:400}
.calc__rows{margin-top:26px;border-top:1px solid rgba(255,255,255,.16)}
.calc__rows div{display:flex;justify-content:space-between;gap:16px;padding:12px 0;
  border-bottom:1px solid rgba(255,255,255,.12);font-size:15px}
.calc__rows span:first-child{color:#B9D8D6}
.calc__rows span:last-child{font-variant-numeric:tabular-nums;font-weight:600}
.calc__rows div.tot{border-bottom:0;margin-top:6px;padding:14px 16px;border-radius:14px;background:rgba(245,166,35,.16)}
.calc__rows div.tot span{color:#FFD79A;font-weight:700}
.fld{margin-bottom:22px}
.fld label{display:block;font-family:var(--mono);font-size:11.5px;font-weight:600;letter-spacing:.06em;
  text-transform:uppercase;color:var(--jade);margin-bottom:9px}
.fld input,.fld select,.fld textarea{width:100%;background:var(--ivory);border:1.5px solid transparent;
  padding:14px 16px;font-size:16px;border-radius:14px;transition:border-color .3s var(--ease),background .3s}
.fld select{-webkit-appearance:none;appearance:none;cursor:pointer;
  background-image:linear-gradient(45deg,transparent 50%,var(--jade) 50%),linear-gradient(135deg,var(--jade) 50%,transparent 50%);
  background-position:calc(100% - 20px) 24px,calc(100% - 14px) 24px;background-size:6px 6px,6px 6px;background-repeat:no-repeat}
.fld textarea{resize:vertical;min-height:110px;line-height:1.6}
.fld input:focus,.fld select:focus,.fld textarea:focus{outline:none;border-color:var(--gold);background:#fff}
.fld .hintline{font-family:var(--sans);font-size:13px;color:var(--muted);margin-top:9px;line-height:1.55}
.fld-row{display:grid;grid-template-columns:1fr 1fr;gap:clamp(14px,1.8vw,22px)}
.seg{display:flex;gap:6px;background:transparent;border:0}
.seg button{flex:1;background:var(--ivory);border:0;padding:13px;font-family:var(--sans);font-size:14px;font-weight:600;
  letter-spacing:0;text-transform:none;color:var(--muted);cursor:pointer;border-radius:12px;transition:background .3s,color .3s}
.seg button:hover{background:var(--mint)}
.seg button[aria-pressed="true"]{background:var(--grad-deep);color:#fff}
.disclaim{margin-top:28px;border-left:0;border-radius:var(--r-sm);background:var(--sand);
  padding:18px 22px;font-size:14.5px;color:#6B4A21;line-height:1.65}
.disclaim strong{color:var(--gold-deep)}
.disclaim .tlink{color:var(--gold-deep)}

/* ---------- forms ---------- */
.form{background:#fff;border:0;border-radius:var(--r);padding:clamp(26px,3.2vw,44px);box-shadow:var(--sh-2)}
.form__row{display:grid;grid-template-columns:1fr 1fr;gap:clamp(14px,1.8vw,22px)}
.form__ft{display:flex;align-items:center;justify-content:space-between;gap:18px;flex-wrap:wrap;margin-top:8px}
.form__note{font-family:var(--sans);font-size:13.5px;color:var(--muted);max-width:34ch;line-height:1.6}
.msg{display:none;padding:16px 20px;margin-top:20px;font-size:15px;border:0;border-radius:14px;font-weight:600}
.msg.show{display:block}
.msg--ok{background:var(--mint);color:var(--ok)}
.msg--err{background:#FBE6DF;color:var(--err)}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}

/* ---------- contact ---------- */
.ct__blk{border-top:0;background:#fff;border-radius:var(--r-sm);padding:18px 20px;margin-top:14px;box-shadow:var(--sh-1)}
.ct__lab{font-family:var(--mono);font-size:11.5px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;
  color:var(--gold-deep);margin-bottom:8px}
.ct__val{font-size:16px;line-height:1.7;color:var(--navy);font-weight:500}
.ct__val a{color:var(--jade);font-weight:600}
.ct__val a:hover{color:var(--gold-deep)}
.mapbox{margin-top:22px;border:0;border-radius:var(--r);overflow:hidden;background:#fff;box-shadow:var(--sh-1)}
.mapbox iframe{width:100%;height:320px;border:0;display:block;filter:saturate(.9);transition:filter .5s}
.mapbox:hover iframe{filter:saturate(1.1)}

/* ---------- CTA ---------- */
.cta{text-align:center;position:relative;overflow:hidden}
.cta__in{max-width:820px;margin:0 auto;position:relative;z-index:3}
.cta .eyebrow{justify-content:center}
.cta__b{margin-top:34px;display:flex;justify-content:center;gap:14px;flex-wrap:wrap}
.cta__bg{position:absolute;inset:0;opacity:.16;pointer-events:none;z-index:1}
.cta__bg path{stroke:#FFC968}
.section.cta:not(.dark){background:var(--grad-mint);border-radius:clamp(24px,4vw,48px);margin-inline:clamp(12px,3vw,40px)}

/* ---------- footer ---------- */
.ft{background:var(--grad-deep);color:#C6E2E0;padding-top:clamp(56px,6.5vw,92px);position:relative;overflow:hidden;
  border-radius:clamp(24px,4vw,48px) clamp(24px,4vw,48px) 0 0;margin-top:clamp(30px,4vw,60px)}
.ft::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(40vw 30vw at 92% 6%, rgba(245,166,35,.22), transparent 62%)}
.ft>*{position:relative;z-index:2}
.ft__grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1.2fr;gap:clamp(26px,3.6vw,54px)}
.ft__d{font-size:15px;color:#B9D8D6;max-width:40ch;margin-top:18px}
.ft h4{font-family:var(--mono);font-size:12px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;
  color:#FFD79A;margin-bottom:18px}
.ft li{margin-bottom:11px}
.ft li a{font-size:15px;color:#C6E2E0;transition:color .3s,padding-left .3s}
.ft li a:hover{color:var(--gold-soft);padding-left:5px}
.ft address{font-style:normal;font-size:15px;color:#C6E2E0;line-height:1.85}
.ft address a{color:var(--gold-soft)}
.ft .brand__mk{background:none;color:#fff;box-shadow:none}
.ft .brand__nm{color:#fff}
.ft .brand__sub{color:#FFD79A}
.ft__bar{margin-top:clamp(38px,4.4vw,64px);border-top:1px solid rgba(255,255,255,.16);padding:24px 0 32px;
  display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}
.ft__bar p,.ft__bar a{font-family:var(--mono);font-size:12px;letter-spacing:0;text-transform:none;color:#9FC6C9}
.ft__bar a:hover{color:var(--gold-soft)}
.ft__legal{display:flex;gap:20px;flex-wrap:wrap}

/* ---------- responsive ---------- */
@media (max-width:1320px){ .nav__i>a{font-size:14px;padding:9px 12px} }
@media (max-width:1180px){ .nav__i>a{font-size:13.5px;padding:8px 9px} .brand__nm{font-size:18px} }
@media (max-width:1020px){
  .hero__grid{grid-template-columns:1fr;gap:40px}
  .hero__art{order:2;max-width:560px}
  .grid-2,.calc__grid{grid-template-columns:1fr}
  .calc__out{position:static}
  .grid-3,.tst,.tm__grid{grid-template-columns:1fr 1fr}
  .tm__c--lead{grid-column:span 2}
  .grid-4,.kb{grid-template-columns:repeat(2,1fr)}
  .cli{grid-template-columns:repeat(4,1fr)}
  .trust__grid{grid-template-columns:repeat(2,1fr)}
  .glance__g{grid-template-columns:1fr 1fr}
  .glance__i:nth-child(3n){border-right:1px solid var(--line)}
  .glance__i:nth-child(2n){border-right:0}
  .glance__i--wide{grid-column:span 2}
}
@media (max-width:1080px){
  .nav,.hdr .btn{display:none}
  .burger{display:flex}
  .ubar__in{justify-content:center}
  .ubar__l{display:none}
}
@media (max-width:720px){
  body{font-size:16px}
  .sec-head{grid-template-columns:1fr;align-items:start}
  .grid-3,.grid-4,.tst,.tm__grid,.kb,.form__row,.fld-row{grid-template-columns:1fr}
  .trust__grid{grid-template-columns:1fr 1fr}
  .tm__c--lead{grid-column:span 1;grid-template-columns:1fr}
  .tm__c--lead .tm__ph{margin-bottom:18px}
  .cli{grid-template-columns:repeat(2,1fr)}
  .pts{columns:1}
  .glance__g{grid-template-columns:1fr}
  .glance__i{border-right:0!important}
  .glance__i--wide{grid-column:span 1}
  .ft__grid{grid-template-columns:1fr}
  .svc__row{grid-template-columns:auto 1fr;gap:16px}
  .svc__go{display:none}
  .hero__cta .btn,.cta__b .btn{flex:1 1 100%}
  .tabs button{flex:1 1 44%}
}


/* ---------- ampersand ----------
   Fraunces' display ampersand is too decorative for headline use, so every
   ampersand inside serif type is set in the UI face at a slightly smaller size.
   site.js wraps them in <span class="amp"> automatically.                     */
.amp{font-family:var(--sans);font-weight:500;font-size:.88em;font-style:normal;
  letter-spacing:0;padding-inline:.04em}
.brand__nm .amp{font-weight:600;font-size:.9em}

/* compact brand lock-up on small screens */
@media (max-width:720px){
  .brand__mk,.brand__mk svg{height:38px}
  .brand__nm{font-size:17px}
  .brand__sub{font-size:9px;letter-spacing:.12em}
}


/* ---------- CA logo ---------- */
.brand__mk{width:auto;height:52px;flex:none;border:0;border-radius:0;padding:0;display:grid;place-items:center;
  background:none;box-shadow:none;transition:transform .4s var(--ease)}
.brand__mk img{height:52px;width:auto;display:block}
.brand:hover .brand__mk{transform:translateY(-2px)}
.ft .brand__mk{background:#fff;padding:7px 9px;border-radius:12px;height:auto;box-shadow:var(--sh-1)}
.ft .brand__mk img{height:40px}
@media (max-width:720px){
  .brand__mk,.brand__mk img{height:44px}
  .ft .brand__mk{height:auto}
  .ft .brand__mk img{height:38px}
}

/* ---------- dropdown hover bridge ----------
   The panel sits a few pixels below the nav item, and the pointer used to lose
   :hover while crossing that gap, which closed the menu before it could be
   reached. An invisible strip below the item keeps the hover unbroken, and the
   short close delay forgives a pointer that strays sideways.                  */
.nav__i.has::after{content:"";position:absolute;top:100%;left:-8px;width:296px;height:18px;pointer-events:auto}
.drop{transition-delay:.14s}
.nav__i:hover .drop,.nav__i:focus-within .drop{transition-delay:0s}

/* ---------- insights ---------- */
.post__wrap{padding-top:clamp(30px,4vw,54px)}
.crumb--light{color:var(--muted);margin-bottom:22px}
.crumb--light a{color:var(--jade)}
.post{max-width:78ch;margin:0 auto}
.post h1.display{font-size:clamp(32px,4.6vw,58px);margin:6px 0 14px}
.post__meta{font-family:var(--mono);font-size:13px;color:var(--jade);margin-bottom:22px}
.post__lede{font-size:clamp(18px,1.5vw,21px);color:var(--ink);padding:20px 24px;background:var(--mint);
  border-radius:var(--r);margin-bottom:30px}
.post__body{font-size:17.5px;line-height:1.75;color:var(--muted)}
.post__body p{margin:0 0 20px}
.post__body h2,.post__body h3,.post__body h4{font-family:var(--serif);color:var(--navy);letter-spacing:-.02em;
  margin:34px 0 12px;line-height:1.2}
.post__body h2{font-size:clamp(24px,2.4vw,31px)}
.post__body h3{font-size:clamp(20px,2vw,25px)}
.post__body strong{color:var(--ink)}
.post__body a{color:var(--jade);font-weight:600;border-bottom:2px solid rgba(27,122,110,.25)}
.post__body a:hover{border-bottom-color:var(--gold)}
.post__list{margin:0 0 20px;padding-left:0}
.post__list li{position:relative;padding:7px 0 7px 26px}
.post__list li::before{content:"";position:absolute;left:0;top:17px;width:9px;height:9px;border-radius:50%;
  background:var(--grad-warm)}
.post__body blockquote{margin:26px 0;padding:20px 26px;background:var(--sand);border-radius:var(--r);
  font-family:var(--serif);font-size:clamp(19px,1.8vw,23px);line-height:1.42;color:var(--navy)}
.post__foot{margin-top:40px;padding-top:26px;border-top:1px solid var(--line);display:flex;align-items:center;
  gap:16px;flex-wrap:wrap}
.post__foot .mono-note{flex:1 1 320px;margin:0}

/* ---------- financing spectrum ---------- */
.spectrum{position:relative;padding-top:8px}
.spectrum__ends{display:flex;justify-content:space-between;font-family:var(--mono);font-size:11.5px;
  letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin-bottom:10px}
.spectrum__rail{position:absolute;left:0;right:0;top:34px;height:4px;border-radius:4px;
  background:linear-gradient(90deg,var(--gold),var(--jade))}
.spectrum__grid{display:grid;grid-template-columns:repeat(6,1fr);gap:10px;padding-top:22px}
.spectrum__i{background:#fff;border-radius:var(--r);padding:18px 16px;box-shadow:var(--sh-1);position:relative;
  transition:transform .35s var(--ease),box-shadow .35s var(--ease)}
.spectrum__i::before{content:"";position:absolute;top:-18px;left:20px;width:11px;height:11px;border-radius:50%;
  background:var(--gold);box-shadow:0 0 0 4px var(--ivory)}
.spectrum__i:nth-child(n+4)::before{background:var(--jade)}
.spectrum__i:hover{transform:translateY(-5px);box-shadow:var(--sh-2)}
.spectrum__k{display:block;font-family:var(--mono);font-size:10.5px;letter-spacing:.06em;text-transform:uppercase;
  color:var(--gold-deep);margin-bottom:8px}
.spectrum__i b{display:block;font-family:var(--serif);font-weight:600;font-size:18px;color:var(--navy);
  letter-spacing:-.02em;margin-bottom:7px;line-height:1.15}
.spectrum__d{font-size:13.5px;color:var(--muted);line-height:1.5}

/* ---------- budget chart ---------- */
.chartcard{background:#fff;border-radius:var(--r);box-shadow:var(--sh-1);padding:clamp(20px,2.6vw,32px)}
.chartcard svg{width:100%;height:auto}
.chartcard__legend{display:flex;gap:22px;flex-wrap:wrap;margin-bottom:14px;font-family:var(--mono);
  font-size:12px;color:var(--muted)}
.chartcard__legend i{display:inline-block;width:14px;height:3px;border-radius:3px;margin-right:7px;vertical-align:middle}

/* ---------- registration registry ----------
   Each card carries its statutory form reference and an icon for the department
   it belongs to, split from the description by a dashed rule — so the grid can
   be scanned by form number as easily as by name. */
.reg{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(14px,1.8vw,22px)}
.reg__i{background:#fff;border-radius:var(--r);padding:clamp(20px,2.2vw,26px);box-shadow:var(--sh-1);
  display:flex;flex-direction:column;
  transition:transform .35s var(--ease),box-shadow .35s var(--ease)}
.reg__i:hover{transform:translateY(-5px);box-shadow:var(--sh-2)}
.reg__top{display:flex;align-items:center;justify-content:space-between;gap:14px;
  padding-bottom:15px;margin-bottom:17px;border-bottom:1px dashed rgba(184,92,21,.3)}
.reg__f{font-family:var(--mono);font-size:10.5px;font-weight:600;letter-spacing:.13em;
  text-transform:uppercase;color:var(--gold-deep);line-height:1.5}
.reg__ic{width:42px;height:42px;flex:none;border-radius:50%;border:1.5px solid rgba(184,92,21,.32);
  display:grid;place-items:center;color:var(--gold-deep);
  transition:background .35s var(--ease),color .35s var(--ease),border-color .35s var(--ease),transform .45s var(--ease)}
.reg__ic svg{width:20px;height:20px}
.reg__i:hover .reg__ic{background:var(--grad-warm);color:#fff;border-color:transparent;transform:rotate(-8deg) scale(1.06)}
.reg__t{font-family:var(--serif);font-weight:600;font-size:clamp(19px,1.8vw,23px);color:var(--navy);
  margin:0 0 10px;line-height:1.2;letter-spacing:-.02em}
.reg__d{font-size:14.5px;color:var(--muted);line-height:1.62}

/* ---------- accounting software ----------
   Restrained on purpose: the vendors' brand colours are loud next to this
   palette, so the marks are small, the product names are set in the site's own
   type, and the cards match every other card on the page. */
.soft{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(14px,1.8vw,22px)}
.soft__i{background:#fff;border-radius:var(--r);padding:clamp(20px,2.2vw,26px);box-shadow:var(--sh-1);
  transition:transform .35s var(--ease),box-shadow .35s var(--ease)}
.soft__i:hover{transform:translateY(-5px);box-shadow:var(--sh-2)}
.soft__head{display:flex;align-items:center;gap:14px;padding-bottom:16px;margin-bottom:16px;
  border-bottom:1px solid var(--line)}
.soft__head img{width:42px;height:42px;flex:none;object-fit:contain}
.soft__head b{display:block;font-family:var(--serif);font-weight:600;font-size:19px;color:var(--navy);
  letter-spacing:-.02em;line-height:1.1}
.soft__head span{display:block;font-family:var(--mono);font-size:10.5px;letter-spacing:.1em;
  text-transform:uppercase;color:var(--jade);margin-top:5px}
.soft__d{font-size:14.5px;color:var(--muted);line-height:1.62}

/* home page band — one line on desktop, still compact on a phone */
.softstrip{background:#fff;border-radius:var(--r);box-shadow:var(--sh-1);padding:clamp(18px,2.2vw,26px) clamp(20px,2.6vw,32px);
  display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:clamp(20px,3vw,44px);align-items:center}
.softstrip__lab{font-family:var(--mono);font-size:10.5px;font-weight:600;letter-spacing:.16em;
  text-transform:uppercase;color:var(--gold-deep);margin-bottom:8px}
.softstrip__h{font-family:var(--serif);font-weight:600;font-size:clamp(18px,1.7vw,22px);color:var(--navy);
  letter-spacing:-.02em;line-height:1.25;margin:0;max-width:24ch}
.softstrip__list{display:flex;align-items:center;gap:clamp(16px,2.4vw,30px);flex-wrap:wrap}
.softstrip__list li{display:flex;align-items:center;gap:9px}
.softstrip__list img{width:32px;height:32px;object-fit:contain;flex:none}
.softstrip__list span{font-size:14.5px;font-weight:600;color:var(--navy);white-space:nowrap}
.softstrip__cta{white-space:nowrap}

@media (max-width:1020px){
  .spectrum__grid{grid-template-columns:repeat(3,1fr);padding-top:14px}
  .spectrum__rail{display:none}
  .spectrum__i::before{display:none}
  .reg,.soft{grid-template-columns:repeat(2,1fr)}
  .softstrip{grid-template-columns:1fr;gap:20px}
  .softstrip__h{max-width:none}
}
@media (max-width:720px){
  .spectrum__grid,.reg,.soft{grid-template-columns:1fr}
  .reg__ic{width:38px;height:38px}
  .reg__ic svg{width:18px;height:18px}
  .spectrum__ends{display:none}
  .softstrip{padding:20px}
  .softstrip__list{gap:14px 18px}
  .softstrip__list img{width:28px;height:28px}
  .softstrip__list span{font-size:13.5px}
  .soft__head img{width:38px;height:38px}
}

/* ---------- rotation chips ---------- */
.chips{display:flex;flex-wrap:wrap;gap:10px}
.chips span{font-family:var(--sans);font-size:15px;font-weight:600;color:var(--navy);background:#fff;
  border-radius:999px;padding:12px 22px;box-shadow:var(--sh-1);
  transition:transform .3s var(--ease),background .3s var(--ease),color .3s var(--ease)}
.chips span:hover{transform:translateY(-3px);background:var(--grad-warm);color:#3A1D06}

/* ---------- alumni voices ----------
   Longer than the client testimonials, and of uneven length, so they run in
   columns and break where they fall rather than being forced onto a grid. */
/* ---------- article voices ----------
   A grid rather than CSS columns. Columns fill top-to-bottom, so cards never
   line up across the page and nth-child tinting lands in an apparently random
   pattern. In a grid, each row aligns, and the attribution is pinned to the
   bottom of every card so the names sit on a common baseline. */
.voices{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px,2vw,24px);align-items:stretch}
.voice{display:flex;flex-direction:column;margin:0;background:#fff;border-radius:var(--r);
  padding:clamp(22px,2.4vw,30px);box-shadow:var(--sh-1);position:relative;overflow:hidden;
  transition:transform .35s var(--ease),box-shadow .35s var(--ease)}
.voice:hover{transform:translateY(-4px);box-shadow:var(--sh-2)}
.voice::before{content:"\201C";position:absolute;top:6px;right:22px;font-family:var(--serif);font-size:64px;
  line-height:1;color:var(--gold);opacity:.32;pointer-events:none}
.voice__m{margin:0;font-size:15px;line-height:1.62;color:var(--muted);flex:1}
.voice__m p{margin:0 0 12px}
.voice__m p:last-child{margin-bottom:0}
.voice__f{margin-top:auto;padding-top:16px;border-top:1px solid var(--line)}
.voice__nm{font-family:var(--serif);font-weight:600;font-size:18px;color:var(--navy);letter-spacing:-.01em}
.voice__rl{font-family:var(--mono);font-size:11.5px;color:var(--jade);margin-top:5px}
/* alternate cards tint, which reads as a checkerboard once the grid aligns */
.voice:nth-child(2n){background:var(--grad-mint)}
.voice:nth-child(2n) .voice__f{border-top-color:rgba(12,59,74,.14)}
@media (max-width:1020px){ .voices{grid-template-columns:repeat(2,1fr)} }
@media (max-width:720px){ .voices{grid-template-columns:1fr} }

