/* ============================================================================
   Dr Jonathan Toussaint — mediation, workplace & professional services
   The most STRUCTURED site of the estate: charcoal ink + cool slate neutral +
   one steel-teal accent, slab display (Zilla Slab) over a calm humanist sans
   (Inter), on a confident ruled grid. Deliberately unlike the hub's warm
   parchment/foliage, literary Fraunces/Spectral, centred personal-brand DNA.
   ============================================================================ */

/* ---- Fonts (self-hosted; no external font links) ------------------------- */
@font-face{font-family:"Zilla Slab";font-style:normal;font-weight:400;font-display:swap;src:url(/assets/fonts/zillaslab-400-normal-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Zilla Slab";font-style:normal;font-weight:400;font-display:swap;src:url(/assets/fonts/zillaslab-400-normal-latin-ext.woff2) format("woff2");unicode-range:U+0100-024F,U+0259,U+1E00-1EFF,U+2020,U+20A0-20AB,U+20AD-20CF,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Zilla Slab";font-style:normal;font-weight:500;font-display:swap;src:url(/assets/fonts/zillaslab-500-normal-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Zilla Slab";font-style:normal;font-weight:500;font-display:swap;src:url(/assets/fonts/zillaslab-500-normal-latin-ext.woff2) format("woff2");unicode-range:U+0100-024F,U+0259,U+1E00-1EFF,U+2020,U+20A0-20AB,U+20AD-20CF,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Zilla Slab";font-style:normal;font-weight:600;font-display:swap;src:url(/assets/fonts/zillaslab-600-normal-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Zilla Slab";font-style:normal;font-weight:600;font-display:swap;src:url(/assets/fonts/zillaslab-600-normal-latin-ext.woff2) format("woff2");unicode-range:U+0100-024F,U+0259,U+1E00-1EFF,U+2020,U+20A0-20AB,U+20AD-20CF,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Zilla Slab";font-style:normal;font-weight:700;font-display:swap;src:url(/assets/fonts/zillaslab-700-normal-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Zilla Slab";font-style:normal;font-weight:700;font-display:swap;src:url(/assets/fonts/zillaslab-700-normal-latin-ext.woff2) format("woff2");unicode-range:U+0100-024F,U+0259,U+1E00-1EFF,U+2020,U+20A0-20AB,U+20AD-20CF,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Inter";font-style:normal;font-weight:400;font-display:swap;src:url(/assets/fonts/inter-400-normal-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Inter";font-style:normal;font-weight:400;font-display:swap;src:url(/assets/fonts/inter-400-normal-latin-ext.woff2) format("woff2");unicode-range:U+0100-024F,U+0259,U+1E00-1EFF,U+2020,U+20A0-20AB,U+20AD-20CF,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Inter";font-style:normal;font-weight:500;font-display:swap;src:url(/assets/fonts/inter-500-normal-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Inter";font-style:normal;font-weight:500;font-display:swap;src:url(/assets/fonts/inter-500-normal-latin-ext.woff2) format("woff2");unicode-range:U+0100-024F,U+0259,U+1E00-1EFF,U+2020,U+20A0-20AB,U+20AD-20CF,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Inter";font-style:normal;font-weight:600;font-display:swap;src:url(/assets/fonts/inter-600-normal-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Inter";font-style:normal;font-weight:600;font-display:swap;src:url(/assets/fonts/inter-600-normal-latin-ext.woff2) format("woff2");unicode-range:U+0100-024F,U+0259,U+1E00-1EFF,U+2020,U+20A0-20AB,U+20AD-20CF,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Inter";font-style:normal;font-weight:700;font-display:swap;src:url(/assets/fonts/inter-700-normal-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Inter";font-style:normal;font-weight:700;font-display:swap;src:url(/assets/fonts/inter-700-normal-latin-ext.woff2) format("woff2");unicode-range:U+0100-024F,U+0259,U+1E00-1EFF,U+2020,U+20A0-20AB,U+20AD-20CF,U+2113,U+2C60-2C7F,U+A720-A7FF}

/* ---- Tokens -------------------------------------------------------------- */
:root{
  --ink:#15191E;          /* near-black slate — text + dark surfaces */
  --ink-2:#1E242B;        /* raised dark panel */
  --ink-3:#2A323B;        /* dark hairline / raised chip on dark */
  --slate:#48525C;        /* body text on light (AA on paper) */
  --slate-2:#66727E;      /* muted secondary */
  --line:#DCE2E6;         /* hairline rules on light */
  --line-2:#EAEEF0;       /* faint fill / row line */
  --line-dk:rgba(255,255,255,.14); /* rules on dark */
  --paper:#F3F5F6;        /* cool off-white page */
  --paper-2:#FFFFFF;      /* card white */
  --wash:#E7ECEE;         /* cool wash panel */
  --teal:#155E5C;         /* steel teal — links, accents (AA on white) */
  --teal-2:#1C7A76;       /* brighter teal for large text / on dark */
  --teal-dk:#0E4746;      /* hover */
  --teal-wash:#E4EEED;    /* faint teal fill */
  --amber:#B4671F;        /* warm counter-accent, used sparingly */
  --focus:#1C7A76;
  --maxw:1200px;
  --gut:clamp(1.15rem,4vw,2.4rem);
  --r:4px;                /* structured = tight radii, not pills */
  --r-lg:8px;
  --shadow:0 1px 2px rgba(21,25,30,.05),0 8px 28px -14px rgba(21,25,30,.16);
  --shadow-lg:0 2px 4px rgba(21,25,30,.06),0 24px 60px -24px rgba(21,25,30,.28);
  --ease:cubic-bezier(.22,.61,.36,1);
  --sans:"Inter",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --slab:"Zilla Slab",Georgia,"Times New Roman",serif;
}

/* ---- Reset / base -------------------------------------------------------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{
  margin:0;font-family:var(--sans);color:var(--ink);background:var(--paper);
  font-size:clamp(1rem,.97rem + .18vw,1.075rem);line-height:1.62;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
  font-feature-settings:"cv05" 1,"ss01" 1;
}
img{max-width:100%;height:auto;display:block}
a{color:var(--teal);text-underline-offset:.15em;text-decoration-thickness:.06em}
a:hover{color:var(--teal-dk)}
h1,h2,h3,h4{font-family:var(--slab);font-weight:600;line-height:1.1;letter-spacing:-.01em;color:var(--ink);margin:0 0 .5em}
h1{font-size:clamp(2.35rem,1.5rem + 3.6vw,4.05rem);font-weight:700;line-height:1.02;letter-spacing:-.02em}
h2{font-size:clamp(1.7rem,1.25rem + 1.9vw,2.5rem)}
h3{font-size:clamp(1.2rem,1.05rem + .6vw,1.45rem)}
h4{font-size:1.05rem;font-weight:600}
p{margin:0 0 1.1em}
strong{font-weight:600;color:var(--ink)}
:focus-visible{outline:2.5px solid var(--focus);outline-offset:3px;border-radius:2px}
::selection{background:var(--teal);color:#fff}
::placeholder{color:hsl(206 8% 60% / .55)}
[hidden]{display:none !important}
hr{border:0;border-top:1px solid var(--line);margin:0}

/* ---- Layout scaffold ----------------------------------------------------- */
.shell{max-width:var(--maxw);margin-inline:auto;padding-inline:var(--gut)}
.shell-narrow{max-width:760px}
section{padding-block:clamp(3rem,2rem + 4.5vw,5.75rem)}
.section-tight{padding-block:clamp(2.2rem,1.6rem + 2.5vw,3.4rem)}
.on-ink{background:var(--ink);color:#D8DEE3}
.on-ink h1,.on-ink h2,.on-ink h3,.on-ink h4{color:#fff}
.on-ink a{color:#8FD6D0}
.on-ink strong{color:#fff}
.on-wash{background:var(--wash)}
.on-paper2{background:var(--paper-2)}

/* index label — the structured signature: "01 / Mediation" ruled eyebrow */
.eyebrow{
  display:flex;align-items:center;gap:.7rem;
  font-family:var(--sans);font-weight:600;font-size:.72rem;letter-spacing:.14em;
  text-transform:uppercase;color:var(--teal);margin:0 0 1.1rem;
}
.eyebrow::before{content:attr(data-index);font-variant-numeric:tabular-nums;color:var(--slate-2);font-weight:600}
.eyebrow .rule{flex:1;height:1px;background:var(--line);min-width:1.5rem}
.on-ink .eyebrow{color:var(--teal-2)}
.on-ink .eyebrow .rule{background:var(--line-dk)}
.on-ink .eyebrow::before{color:#7C8894}

.lede{font-size:clamp(1.1rem,1.03rem + .5vw,1.32rem);line-height:1.55;color:var(--slate);max-width:60ch}
.on-ink .lede{color:#B7C0C8}
.measure{max-width:64ch}
.muted{color:var(--slate-2)}
.small{font-size:.85rem;line-height:1.55}

/* ---- Header -------------------------------------------------------------- */
.site-head{position:sticky;top:0;z-index:60;background:rgba(243,245,246,.86);backdrop-filter:saturate(1.4) blur(10px);border-bottom:1px solid var(--line)}
.site-head__row{display:flex;align-items:center;justify-content:space-between;gap:1rem;height:70px}
.brand{display:flex;align-items:center;gap:.65rem;text-decoration:none;color:var(--ink)}
.brand:hover{color:var(--ink)}
.brand__mark{flex:none;width:34px;height:34px}
.brand__name{font-family:var(--slab);font-weight:700;font-size:1.12rem;line-height:1;letter-spacing:-.01em}
.brand__sub{display:block;font-family:var(--sans);font-weight:600;font-size:.6rem;letter-spacing:.18em;text-transform:uppercase;color:var(--slate-2);margin-top:.25rem}
.nav{display:flex;align-items:center;gap:.35rem}
.nav a{font-family:var(--sans);font-weight:500;font-size:.94rem;color:var(--slate);text-decoration:none;padding:.5rem .7rem;border-radius:var(--r);transition:color .18s var(--ease),background .18s var(--ease)}
.nav a:hover{color:var(--ink);background:var(--line-2)}
body[data-page="mediation"] .nav a[href="/mediation/"],
body[data-page="coaching"] .nav a[href="/coaching/"],
body[data-page="supervision"] .nav a[href="/supervision/"],
body[data-page="about"] .nav a[href="/about/"]{color:var(--teal);background:var(--teal-wash)}
.nav .btn{margin-left:.4rem}
.nav-toggle{display:none;align-items:center;gap:.5rem;background:var(--ink);color:#fff;border:0;border-radius:var(--r);padding:.55rem .8rem;font-family:var(--sans);font-weight:600;font-size:.9rem;cursor:pointer}
.nav-toggle svg{width:16px;height:16px}

/* ---- Buttons ------------------------------------------------------------- */
.btn{
  display:inline-flex;align-items:center;gap:.5rem;font-family:var(--sans);font-weight:600;
  font-size:.96rem;line-height:1;text-decoration:none;cursor:pointer;border:1px solid transparent;
  padding:.82rem 1.35rem;border-radius:var(--r);transition:transform .18s var(--ease),background .18s var(--ease),border-color .18s var(--ease),box-shadow .18s var(--ease);
}
.btn svg{width:16px;height:16px;transition:transform .2s var(--ease)}
.btn--primary{background:var(--teal);color:#fff}
.btn--primary:hover{background:var(--teal-dk);color:#fff;transform:translateY(-2px);box-shadow:0 10px 22px -12px rgba(14,71,70,.6)}
.btn--primary:hover svg{transform:translateX(3px)}
.btn--ink{background:var(--ink);color:#fff}
.btn--ink:hover{background:#000;color:#fff;transform:translateY(-2px)}
.btn--ghost{background:transparent;color:var(--ink);border-color:var(--line)}
.btn--ghost:hover{border-color:var(--ink);color:var(--ink);transform:translateY(-2px)}
.on-ink .btn--ghost{color:#fff;border-color:var(--line-dk)}
.on-ink .btn--ghost:hover{border-color:#fff;background:rgba(255,255,255,.06)}
.btn--lg{padding:1rem 1.6rem;font-size:1.02rem}
.btn-row{display:flex;flex-wrap:wrap;gap:.75rem;align-items:center}
@media (prefers-reduced-motion:reduce){.btn:hover{transform:none}.btn:hover svg{transform:none}}

/* ---- Grids --------------------------------------------------------------- */
.grid{display:grid;gap:clamp(1.4rem,1rem + 2vw,2.6rem)}
.g-2{grid-template-columns:repeat(2,1fr)}
.g-3{grid-template-columns:repeat(3,1fr)}
.split{display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(1.8rem,1rem + 3.5vw,4rem);align-items:center}
.split--text-right{grid-template-columns:.85fr 1.15fr}
@media (max-width:900px){.g-3{grid-template-columns:1fr 1fr}.split,.split--text-right{grid-template-columns:1fr}}
@media (max-width:640px){.g-2,.g-3{grid-template-columns:1fr}}

/* ---- Hero (masthead) ----------------------------------------------------- */
.masthead{position:relative;padding-top:clamp(2.6rem,1.6rem + 4vw,4.6rem);padding-bottom:clamp(2.6rem,1.6rem + 4vw,4.2rem);overflow:hidden}
.masthead::before{content:"";position:absolute;inset:0;background:
  linear-gradient(180deg,var(--paper-2),var(--paper));z-index:-2}
.masthead__grid{display:grid;grid-template-columns:1.08fr .92fr;gap:clamp(1.8rem,1rem + 4vw,4.5rem);align-items:center}
@media (max-width:880px){.masthead__grid{grid-template-columns:1fr;gap:2.4rem}}
.masthead h1{margin-bottom:.35em}
.masthead .kicker{display:inline-flex;align-items:center;gap:.55rem;font-family:var(--sans);font-weight:600;font-size:.76rem;letter-spacing:.14em;text-transform:uppercase;color:var(--teal);margin-bottom:1.4rem}
.masthead .kicker::before{content:"";width:26px;height:2px;background:var(--teal);border-radius:2px}
.cred-row{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:1.7rem}
.chip{display:inline-flex;align-items:center;gap:.4rem;font-family:var(--sans);font-weight:500;font-size:.82rem;color:var(--slate);background:var(--paper-2);border:1px solid var(--line);padding:.4rem .7rem;border-radius:var(--r)}
.chip svg{width:14px;height:14px;color:var(--teal);flex:none}

/* framed portrait — formal crop, ink frame, corner tick */
.portrait-frame{position:relative;background:var(--ink);padding:10px;border-radius:var(--r-lg);box-shadow:var(--shadow-lg)}
.portrait-frame img{border-radius:3px;width:100%;aspect-ratio:1/1;object-fit:cover;object-position:50% 42%;filter:saturate(.82) contrast(1.02)}
.portrait-frame__tag{position:absolute;left:10px;bottom:10px;right:10px;background:linear-gradient(0deg,rgba(21,25,30,.92),rgba(21,25,30,0));color:#fff;padding:1.7rem 1rem .95rem;border-radius:0 0 3px 3px;font-family:var(--sans)}
.portrait-frame__tag .n{font-family:var(--slab);font-weight:600;font-size:1.05rem;line-height:1.15}
.portrait-frame__tag .r{font-size:.78rem;color:#9FD4CF;font-weight:500;letter-spacing:.02em;margin-top:.15rem}

/* ---- Engagement shaper (signature) --------------------------------------- */
.shaper{background:var(--ink);color:#D8DEE3;border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--shadow-lg)}
.shaper__head{padding:clamp(1.5rem,1rem + 2vw,2.2rem) clamp(1.5rem,1rem + 2vw,2.3rem) 0}
.shaper__head h2{color:#fff;font-size:clamp(1.5rem,1.2rem + 1.2vw,2rem);margin-bottom:.3em}
.shaper__head p{color:#AEB8C0;max-width:56ch;margin-bottom:0}
.shaper__body{padding:clamp(1.5rem,1rem + 2vw,2.3rem);display:grid;gap:1.75rem}
.shaper__step{display:grid;gap:.8rem}
.shaper__legend{display:flex;align-items:baseline;gap:.6rem;font-family:var(--sans);font-weight:600;font-size:.95rem;color:#fff;margin:0;padding:0;border:0}
.shaper__legend .num{font-family:var(--slab);font-weight:700;font-size:.82rem;color:var(--teal-2);font-variant-numeric:tabular-nums;letter-spacing:.05em}
.opts{display:grid;gap:.6rem;grid-template-columns:repeat(3,1fr)}
.opts--2{grid-template-columns:repeat(3,1fr)}
@media (max-width:560px){.opts,.opts--2{grid-template-columns:1fr 1fr}}
.opt{position:relative}
.opt input{position:absolute;opacity:0;inset:0;cursor:pointer;margin:0}
.opt label{display:flex;flex-direction:column;gap:.15rem;height:100%;cursor:pointer;
  background:var(--ink-2);border:1px solid var(--ink-3);border-radius:var(--r);
  padding:.75rem .8rem;transition:border-color .18s var(--ease),background .18s var(--ease),transform .12s var(--ease)}
.opt label .t{font-family:var(--sans);font-weight:600;font-size:.92rem;color:#EAEEF0}
.opt label .d{font-size:.76rem;color:#8E99A3;line-height:1.35}
.opt label:hover{border-color:#3C4650}
.opt input:checked+label{border-color:var(--teal-2);background:rgba(28,122,118,.16);transform:translateY(-1px)}
.opt input:checked+label .t{color:#fff}
.opt input:focus-visible+label{outline:2.5px solid var(--teal-2);outline-offset:2px}
.shaper__foot{border-top:1px solid var(--line-dk);padding:clamp(1.25rem,1rem + 1.4vw,1.7rem) clamp(1.5rem,1rem + 2vw,2.3rem);display:flex;flex-wrap:wrap;gap:1rem;align-items:center;justify-content:space-between}
.shaper__summary{font-size:.95rem;color:#B7C0C8;max-width:46ch;margin:0}
.shaper__summary b{color:#fff;font-weight:600}

/* ---- Cards --------------------------------------------------------------- */
.card{background:var(--paper-2);border:1px solid var(--line);border-radius:var(--r-lg);padding:clamp(1.3rem,1rem + 1vw,1.75rem)}
.card h3{margin-bottom:.4em}
.card p:last-child{margin-bottom:0}

/* service pillar — numbered, ruled, hover-lift with a top keyline */
.pillar{position:relative;display:flex;flex-direction:column;background:var(--paper-2);border:1px solid var(--line);border-radius:var(--r-lg);padding:1.6rem 1.5rem 1.5rem;text-decoration:none;color:inherit;transition:transform .2s var(--ease),box-shadow .2s var(--ease),border-color .2s var(--ease)}
.pillar::before{content:"";position:absolute;left:0;top:0;height:3px;width:38%;background:var(--teal);border-radius:var(--r-lg) 0 0 0;transition:width .28s var(--ease)}
.pillar:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg);border-color:transparent;color:inherit}
.pillar:hover::before{width:100%}
.pillar__n{font-family:var(--slab);font-weight:700;font-size:.82rem;color:var(--slate-2);font-variant-numeric:tabular-nums;letter-spacing:.05em;margin-bottom:1rem}
.pillar__ico{width:38px;height:38px;color:var(--teal);margin-bottom:1rem}
.pillar h3{font-size:1.28rem;margin-bottom:.45em}
.pillar p{color:var(--slate);font-size:.97rem;margin-bottom:1.1rem}
.pillar__more{margin-top:auto;font-family:var(--sans);font-weight:600;font-size:.9rem;color:var(--teal);display:inline-flex;align-items:center;gap:.4rem}
.pillar__more svg{width:15px;height:15px;transition:transform .2s var(--ease)}
.pillar:hover .pillar__more svg{transform:translateX(4px)}
@media (prefers-reduced-motion:reduce){.pillar:hover{transform:none}.pillar:hover::before{width:38%}}

/* feature list with teal tick */
.ticks{list-style:none;margin:0;padding:0;display:grid;gap:.7rem}
.ticks li{position:relative;padding-left:1.8rem;color:var(--slate)}
.ticks li::before{content:"";position:absolute;left:0;top:.42em;width:14px;height:8px;border-left:2px solid var(--teal);border-bottom:2px solid var(--teal);transform:rotate(-45deg)}
.ticks li strong{display:block;color:var(--ink);font-weight:600}
.on-ink .ticks li{color:#B7C0C8}
.on-ink .ticks li strong{color:#fff}
.on-ink .ticks li::before{border-color:var(--teal-2)}

/* numbered process steps */
.steps{counter-reset:step;display:grid;gap:1.15rem}
.step{display:grid;grid-template-columns:auto 1fr;gap:1.1rem;align-items:start}
.step__n{counter-increment:step;flex:none;width:42px;height:42px;display:grid;place-items:center;font-family:var(--slab);font-weight:700;font-size:1.1rem;color:var(--teal);background:var(--teal-wash);border-radius:50%}
.step__n::before{content:counter(step,decimal-leading-zero)}
.step h4{margin-bottom:.25em}
.step p{margin:0;color:var(--slate);font-size:.96rem}

/* definition / credential list */
.deflist{display:grid;gap:0}
.deflist__row{display:grid;grid-template-columns:minmax(9rem,.4fr) 1fr;gap:1.2rem;padding:1rem 0;border-top:1px solid var(--line)}
.deflist__row:last-child{border-bottom:1px solid var(--line)}
.deflist__row dt{font-family:var(--slab);font-weight:600;color:var(--ink)}
.deflist__row dd{margin:0;color:var(--slate)}
@media (max-width:560px){.deflist__row{grid-template-columns:1fr;gap:.2rem}}

/* stat / marker row */
.markers{display:grid;grid-template-columns:repeat(3,1fr);gap:0;border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;background:var(--paper-2)}
.marker{padding:1.4rem 1.3rem;border-left:1px solid var(--line)}
.marker:first-child{border-left:0}
.marker .k{font-family:var(--slab);font-weight:700;font-size:clamp(1.6rem,1.3rem + 1vw,2.1rem);color:var(--ink);line-height:1}
.marker .l{font-size:.86rem;color:var(--slate-2);margin-top:.4rem}
@media (max-width:640px){.markers{grid-template-columns:1fr}.marker{border-left:0;border-top:1px solid var(--line)}.marker:first-child{border-top:0}}

/* pull quote */
.pull{font-family:var(--slab);font-weight:500;font-size:clamp(1.4rem,1.1rem + 1.5vw,2.05rem);line-height:1.32;color:var(--ink);max-width:24ch;letter-spacing:-.01em}
.on-ink .pull{color:#fff}
.pull--lead{border-left:3px solid var(--teal);padding-left:1.3rem}

/* ---- Page head (inner pages) --------------------------------------------- */
.page-head{background:var(--ink);color:#D8DEE3;padding-block:clamp(2.6rem,1.8rem + 3.5vw,4.4rem);position:relative;overflow:hidden}
.page-head::after{content:"";position:absolute;right:-8%;top:-40%;width:46%;height:180%;background:radial-gradient(circle at center,rgba(28,122,118,.22),transparent 62%);pointer-events:none}
.page-head h1{color:#fff;max-width:16ch}
.page-head .lede{color:#B7C0C8;position:relative}
.page-head .eyebrow{color:var(--teal-2)}
.page-head .eyebrow .rule{background:var(--line-dk)}
.page-head .eyebrow::before{color:#7C8894}

/* ---- Forms --------------------------------------------------------------- */
.form-card{background:var(--paper-2);border:1px solid var(--line);border-radius:var(--r-lg);padding:clamp(1.5rem,1.1rem + 1.6vw,2.2rem);box-shadow:var(--shadow)}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:1.1rem}
.field{display:flex;flex-direction:column;gap:.4rem}
.field--full{grid-column:1/-1}
.field label{font-family:var(--sans);font-weight:600;font-size:.9rem;color:var(--ink)}
.field .hint{font-weight:400;color:var(--slate-2);font-size:.82rem}
input,select,textarea{font-family:var(--sans);font-size:1rem;color:var(--ink);background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:.7rem .8rem;width:100%;transition:border-color .16s var(--ease),box-shadow .16s var(--ease)}
select{appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%2348525C' d='M1 1l5 5 5-5'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right .85rem center;padding-right:2.2rem}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--teal);box-shadow:0 0 0 3px rgba(28,122,118,.16)}
textarea{resize:vertical;min-height:8.5rem}
.form-hint{color:var(--slate-2);font-size:.85rem}
.form-result{margin-top:1.1rem;border-radius:var(--r);padding:1rem 1.15rem}
.form-result--ok{background:var(--teal-wash);border:1px solid #BFDDDA;color:#0E4746}
.form-result--err{background:#FBEAE5;border:1px solid #F0C7BB;color:#8A3216}
@media (max-width:560px){.form-grid{grid-template-columns:1fr}}

.callout{background:var(--teal-wash);border:1px solid #C9E2E0;border-radius:var(--r-lg);padding:1.2rem 1.35rem}
.callout h4{margin:0 0 .35em;color:var(--teal-dk)}
.callout p{margin:0;color:var(--slate);font-size:.92rem}

/* contact rows */
.contact-list{display:grid;gap:1.1rem}
.contact-list__row{display:grid;grid-template-columns:auto 1fr;gap:.9rem;align-items:start}
.contact-list__ico{flex:none;width:38px;height:38px;display:grid;place-items:center;background:var(--paper-2);border:1px solid var(--line);border-radius:var(--r);color:var(--teal)}
.contact-list__ico svg{width:18px;height:18px}
.contact-list__row .k{font-family:var(--slab);font-weight:600;color:var(--ink);font-size:.95rem}
.contact-list__row a{font-weight:500}

/* ---- Enquiry CTA band ---------------------------------------------------- */
.cta-band{background:var(--ink);color:#D8DEE3;position:relative;overflow:hidden}
.cta-band::after{content:"";position:absolute;left:-6%;bottom:-60%;width:40%;height:180%;background:radial-gradient(circle at center,rgba(28,122,118,.20),transparent 60%);pointer-events:none}
.cta-band__grid{display:grid;grid-template-columns:1.3fr .7fr;gap:2rem;align-items:center;position:relative}
@media (max-width:820px){.cta-band__grid{grid-template-columns:1fr;gap:1.5rem}}
.cta-band h2{color:#fff;margin-bottom:.4em}
.cta-band p{color:#B7C0C8;margin-bottom:0;max-width:52ch}
.cta-band .eyebrow{color:var(--teal-2)}
.cta-band .eyebrow .rule{background:var(--line-dk)}
/* ghost button sits on the dark band — force light text/border (base .btn--ghost is ink-on-ink) */
.cta-band .btn--ghost{color:#fff;border-color:var(--line-dk)}
.cta-band .btn--ghost:hover{border-color:#fff;background:rgba(255,255,255,.06);color:#fff}

/* ---- Footer -------------------------------------------------------------- */
.site-foot{background:var(--ink);color:#94A0AA;padding-top:clamp(2.6rem,2rem + 2.5vw,3.6rem);padding-bottom:2rem;font-size:.9rem}
.site-foot__top{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:2rem;padding-bottom:2.2rem;border-bottom:1px solid var(--line-dk)}
@media (max-width:760px){.site-foot__top{grid-template-columns:1fr;gap:1.6rem}}
.site-foot h4{color:#fff;font-family:var(--slab);font-size:1.05rem;margin:0 0 .7rem}
.foot-col-label{font-family:var(--sans);font-weight:600;font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:#6C7883;margin:0 0 .9rem}
.site-foot a{color:#AEB8C0;text-decoration:none}
.site-foot a:hover{color:#fff}
.foot-links{list-style:none;margin:0;padding:0;display:grid;gap:.55rem}
.site-foot__bottom{display:flex;flex-wrap:wrap;gap:.8rem 1.4rem;justify-content:space-between;align-items:center;padding-top:1.5rem;font-size:.82rem;color:#6C7883}
.site-foot__bottom a{color:#8E99A3}
.foot-disclosure{max-width:70ch;line-height:1.5}

/* ---- Off-canvas drawer (mobile nav) -------------------------------------- */
.drawer{position:fixed;inset:0;z-index:80;visibility:hidden;pointer-events:none}
.drawer[data-open]{visibility:visible;pointer-events:auto}
.drawer__scrim{position:absolute;inset:0;background:rgba(21,25,30,.5);opacity:0;transition:opacity .28s var(--ease)}
.drawer[data-open] .drawer__scrim{opacity:1}
.drawer__panel{position:absolute;top:0;right:0;height:100%;width:min(86vw,340px);background:var(--paper-2);box-shadow:var(--shadow-lg);transform:translateX(100%);transition:transform .3s var(--ease);display:flex;flex-direction:column;padding:1.3rem}
.drawer[data-open] .drawer__panel{transform:translateX(0)}
.drawer__head{display:flex;align-items:center;justify-content:space-between;margin-bottom:1.2rem}
.drawer__close{background:var(--line-2);border:0;border-radius:var(--r);width:40px;height:40px;display:grid;place-items:center;cursor:pointer;color:var(--ink)}
.drawer__close svg{width:18px;height:18px}
.drawer nav{display:grid;gap:.2rem}
.drawer nav a{font-family:var(--slab);font-weight:600;font-size:1.15rem;color:var(--ink);text-decoration:none;padding:.75rem .4rem;border-bottom:1px solid var(--line-2)}
.drawer nav a:hover{color:var(--teal)}
.drawer .btn{margin-top:1.2rem;justify-content:center}
@media (prefers-reduced-motion:reduce){.drawer__panel,.drawer__scrim{transition:none}}

@media (max-width:860px){
  .nav a:not(.btn){display:none}
  .nav .btn{display:none}
  .nav-toggle{display:inline-flex}
}

/* ---- Reveal on scroll ---------------------------------------------------- */
.reveal{opacity:0;transform:translateY(18px);transition:opacity .6s var(--ease),transform .6s var(--ease)}
.reveal.in{opacity:1;transform:none}
.reveal-d1{transition-delay:.08s}.reveal-d2{transition-delay:.16s}.reveal-d3{transition-delay:.24s}
@media (prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none;transition:none}}

/* ---- Utilities ----------------------------------------------------------- */
.mt-0{margin-top:0}.mt-1{margin-top:.6rem}.mt-2{margin-top:1.2rem}.mt-3{margin-top:2rem}
.mb-0{margin-bottom:0}
.center{text-align:center}
.stack>*+*{margin-top:1.1rem}
.skip-link{position:absolute;left:-999px;top:0;background:var(--ink);color:#fff;padding:.7rem 1rem;z-index:200;border-radius:0 0 var(--r) 0}
.skip-link:focus{left:0;color:#fff}
.prose p{color:var(--slate)}
.prose h2{margin-top:1.6em}
.prose h3{margin-top:1.4em;color:var(--ink)}
.prose ul{color:var(--slate);padding-left:1.2rem}
.prose li{margin-bottom:.4rem}
