/* Indesure Recruitment: site styles.
   Art direction: editorial print with an engraved texture. Paper ground, navy ink, engraved line birds, one green accent.
   Structure rules: a 12-column grid, hairline rules and tone shifts instead of boxes and shadows,
   floating cards with soft shadows for panels and calls to action (restored from v34 at the owner's request),
   one radius scale (--radius, --r-md, --r-card), and one typeface (Plus Jakarta Sans, self-hosted).
   Brand colours: blue #353e5a, green #7fbc57. Class names such as .button-lime are historical and render the brand green. */

@font-face{font-family:'Plus Jakarta Sans';src:url(assets/fonts/plus-jakarta-sans-latin.woff2) format('woff2');font-weight:200 800;font-style:normal;font-display:swap}

/* ---------- Tokens ---------- */
:root{
  --paper:#f6f6f3;--white:#fff;--surface:#ecefe8;
  --ink:#353e5a;--ink-deep:#262d44;--ink-soft:#4a5473;
  --text:#222940;--muted:#3a4157;--line:#d9dcd6;--border:#7d8399;
  --accent:#7fbc57;--accent-hover:#93c973;--accent-text:#28571a;--accent-on-dark:#c2e8a3;--accent-tint:#e8f0e0;
  --on-dark:#f2f4f9;--on-dark-2:#e3e6ee;--on-green:#121828;--error:#9b2c22;
  --rule:rgba(53,62,90,.22);--rule-strong:var(--ink);--rule-dark:rgba(255,255,255,.14);
  --shadow-overlay:0 14px 34px rgba(38,45,68,.18);--shadow-photo:0 30px 60px rgba(38,45,68,.18);
  --font:'Plus Jakarta Sans',system-ui,-apple-system,'Segoe UI',Helvetica,Arial,sans-serif;
  --radius:10px;--r-md:12px;--r-card:16px;
  --max:1180px;--gutter:28px;--section:88px;
  --ease:cubic-bezier(.2,.7,.2,1);
}
@media(min-width:1440px){:root{--max:1280px}}
@media(min-width:1680px){:root{--max:1320px}}
@media(max-width:1050px){:root{--section:72px}}
@media(max-width:800px){:root{--section:60px;--gutter:20px}}

/* ---------- Base ---------- */
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:110px;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--font);font-size:1.0625rem;line-height:1.65;-webkit-font-smoothing:antialiased;display:flex;flex-direction:column;min-height:100vh;min-height:100dvh}
@media(max-width:800px){body{font-size:1rem}}
button,input,select,textarea{font:inherit}
a{color:inherit;text-decoration:none}
button{cursor:pointer}
p,h1,h2,h3,figure,blockquote,ol,dl,dd{margin:0}
p{color:var(--text)}
ol{padding:0;list-style:none}
img{max-width:100%;display:block}
::selection{color:var(--paper);background:var(--ink)}
::placeholder{color:var(--muted);opacity:1}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible{outline:3px solid var(--ink);outline-offset:4px}
.site-header :focus-visible,footer :focus-visible,.mobile-bar :focus-visible{outline-color:var(--accent)}
.wrap{width:min(var(--max),calc(100% - 64px));margin-inline:auto}
@media(max-width:800px){.wrap{width:calc(100% - 40px)}}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip-link{position:fixed;top:-100px;left:20px;padding:12px 20px;background:var(--accent);color:var(--on-green);font-weight:600;border-radius:var(--radius);z-index:100}
.skip-link:focus{top:15px}
main{flex:1 0 auto}

/* ---------- Type ---------- */
h1,h2,h3{font-family:var(--font);text-wrap:balance}
h1{font-size:clamp(2.6rem,4.8vw,4.1rem);font-weight:700;line-height:1.08;letter-spacing:-.028em}
h2{font-size:clamp(2rem,3.5vw,2.875rem);font-weight:650;line-height:1.16;letter-spacing:-.02em}
h3{font-size:1.3125rem;font-weight:650;line-height:1.35;letter-spacing:-.015em}
em{font-style:normal}
/* The page's main heading carries the one underlined phrase: a brand signature, not a decoration on every heading */
h1 em{text-decoration:underline;text-decoration-color:rgba(53,62,90,.32);text-decoration-thickness:.055em;text-underline-offset:.12em;text-decoration-skip-ink:auto}
.hero h1 em,.nf h1 em{text-decoration-color:var(--accent)}
/* One label per page at most, in the opening section, in sentence case */
.eyebrow{font-size:.9375rem;font-weight:600;letter-spacing:0;color:var(--muted);margin-bottom:18px}
.section-heading{margin-bottom:44px;max-width:720px}
.section-sub{margin-top:14px;font-size:1.0625rem;color:var(--text);max-width:56ch}
.side-title{font-size:1.0625rem;font-weight:700;line-height:1.4;letter-spacing:-.005em;color:var(--ink-deep);margin-bottom:6px}
.text-link{font-weight:650;color:var(--ink);text-decoration:underline;text-decoration-color:var(--accent);text-decoration-thickness:2px;text-underline-offset:5px;transition:color .15s}
.text-link:hover{color:var(--ink-deep);text-decoration-color:var(--ink)}
.text-button{background:none;border:0;padding:0;text-decoration:underline;text-underline-offset:3px;color:inherit}

/* ---------- Buttons ---------- */
.button{display:inline-flex;align-items:center;justify-content:center;gap:18px;min-height:56px;padding:16px 24px;border:1px solid transparent;border-radius:var(--radius);font-size:.9375rem;font-weight:650;line-height:1.4;text-align:center;transition:background-color .18s,color .18s,border-color .18s}
/* Arrow on every large button (v34 look) */
.button:not(.button-small)::after{content:'';flex:none;width:18px;height:18px;background:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14m-6-6 6 6-6 6'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14m-6-6 6 6-6 6'/%3E%3C/svg%3E") center/contain no-repeat}
.button-lime{background:var(--accent);color:var(--on-green)}
.button-lime:hover{background:var(--accent-hover)}
.button-dark{background:var(--ink);color:var(--white)}
.button-dark:hover{background:var(--ink-deep)}
.button-small{min-height:42px;padding:10px 18px;font-size:.88rem}

/* ---------- Header (navy, white bird logo, wing edge) ---------- */
.site-header{position:sticky;top:0;z-index:30;background:var(--ink);color:var(--white)}
.nav-inner{height:92px;display:flex;align-items:center;justify-content:space-between;gap:30px}
/* Logo: the bird beside RECRUITMENT / BY INDESURE, set to the brand logo's proportions.
   Everything scales from --bh, the bird's height. */
.wordmark{--bh:50px;display:inline-flex;align-items:center;gap:calc(var(--bh) * .38);color:var(--white)}
.wordmark img{display:block;height:var(--bh);width:auto;flex:none}
.logo-text{display:grid;justify-items:center;row-gap:calc(var(--bh) * .04);margin-top:calc(var(--bh) * -.035);line-height:1;text-transform:uppercase}
.logo-text strong{font-size:calc(var(--bh) * .4277);font-weight:800;letter-spacing:.042em;margin-right:-.042em}
.logo-text span{font-size:calc(var(--bh) * .236);font-weight:500;letter-spacing:.135em;margin-right:-.135em;word-spacing:.12em}
#navigation{display:flex;align-items:center;gap:28px;font-weight:500}
#navigation a{white-space:nowrap}
#navigation>a:not(.button){display:inline-flex;align-items:center;min-height:44px;padding-block:10px;font-size:1rem;color:var(--on-dark-2)}
#navigation>a:not(.button):hover{color:var(--white);text-decoration:underline;text-decoration-thickness:1px;text-decoration-color:rgba(255,255,255,.7);text-underline-offset:8px}
#navigation>a[aria-current=page],#navigation>a[aria-current=page]:hover{color:var(--white);text-decoration:underline;text-decoration-color:var(--accent);text-decoration-thickness:3px;text-underline-offset:8px}
.nav-phone{gap:8px;padding-left:28px;border-left:1px solid rgba(255,255,255,.16);font-weight:600}
.nav-phone::before{content:'';display:inline-block;width:18px;height:18px;background:var(--accent);-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22 16.9v3a2 2 0 0 1-2.2 2 19.8 19.8 0 0 1-8.6-3.1 19.5 19.5 0 0 1-6-6A19.8 19.8 0 0 1 2.1 4.2 2 2 0 0 1 4.1 2h3a2 2 0 0 1 2 1.7c.1.9.4 1.8.7 2.7a2 2 0 0 1-.5 2.1L8 9.8a16 16 0 0 0 6 6l1.3-1.3a2 2 0 0 1 2.1-.4c.9.3 1.8.6 2.7.7a2 2 0 0 1 1.7 2z'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22 16.9v3a2 2 0 0 1-2.2 2 19.8 19.8 0 0 1-8.6-3.1 19.5 19.5 0 0 1-6-6A19.8 19.8 0 0 1 2.1 4.2 2 2 0 0 1 4.1 2h3a2 2 0 0 1 2 1.7c.1.9.4 1.8.7 2.7a2 2 0 0 1-.5 2.1L8 9.8a16 16 0 0 0 6 6l1.3-1.3a2 2 0 0 1 2.1-.4c.9.3 1.8.6 2.7.7a2 2 0 0 1 1.7 2z'/%3E%3C/svg%3E") center/contain no-repeat}
.header-wing{position:absolute;left:0;right:0;bottom:-47px;width:100%;height:48px;pointer-events:none;overflow:visible}
.header-wing .wing-front{fill:var(--ink)}
.header-wing .wing-back{fill:var(--accent)}
/* "Hiring?" button: only in the mobile menu, the desktop bar keeps one button */
.nav-hire{display:none}
.menu-toggle{display:none;background:none;border:0;width:44px;height:44px;position:relative}
.menu-bars,.menu-bars::before,.menu-bars::after{position:absolute;left:10px;width:24px;height:2px;background:var(--white);content:'';transition:transform .2s}
.menu-bars{top:21px}
.menu-bars::before{left:0;top:-7px}
.menu-bars::after{left:0;top:7px}
.menu-toggle[aria-expanded=true] .menu-bars{background:transparent}
.menu-toggle[aria-expanded=true] .menu-bars::before{transform:translateY(7px) rotate(45deg)}
.menu-toggle[aria-expanded=true] .menu-bars::after{transform:translateY(-7px) rotate(-45deg)}
/* The logo needs the menu to collapse before the links would touch it */
@media(max-width:1080px){
  .menu-toggle{display:block}
  #navigation{display:none;position:absolute;top:92px;left:0;right:0;z-index:2;background:var(--ink);flex-direction:column;align-items:stretch;gap:0;padding:8px 32px 22px;border-top:1px solid rgba(255,255,255,.1)}
  #navigation.open{display:flex;border-radius:0 0 var(--r-card) var(--r-card);border-bottom:3px solid var(--accent);box-shadow:0 22px 44px rgba(20,24,40,.28)}
  #navigation>a:not(.button){padding:14px 0;border-bottom:1px solid rgba(255,255,255,.08)}
  .nav-phone{padding-left:0;border-left:0}
  #navigation .button{margin-top:14px}
  #navigation .button.nav-hire{display:inline-flex;margin-top:10px}
  .site-header:has(#navigation.open) .header-wing{visibility:hidden}
}
@media(max-width:800px){
  .nav-inner{height:76px}
  #navigation{top:76px;padding-inline:20px}
  .header-wing{bottom:-31px;height:32px}
  .site-header .wordmark{--bh:42px}
}

/* ---------- Page canvas: engraved birds in the margins ----------
   Long pages carry five birds, short pages three, so the density stays the same. */
main{position:relative;isolation:isolate;overflow-x:clip;background:
  url(assets/bird-engraved.svg) no-repeat right -330px top 760px/840px auto,
  url(assets/bird-engraved-flip.svg) no-repeat left -360px top 30%/660px auto,
  url(assets/bird-engraved.svg) no-repeat right -300px top 54%/720px auto,
  url(assets/bird-engraved-flip.svg) no-repeat left -320px top 77%/600px auto,
  url(assets/bird-engraved.svg) no-repeat right -240px top 98%/580px auto,
  var(--paper)}
main.main-short{background:
  url(assets/bird-engraved.svg) no-repeat right -320px top 480px/760px auto,
  url(assets/bird-engraved-flip.svg) no-repeat left -340px top 58%/620px auto,
  url(assets/bird-engraved.svg) no-repeat right -260px top 99%/560px auto,
  var(--paper)}
@media(max-width:800px){
  main{background-size:460px auto,400px auto,420px auto,360px auto,340px auto,auto;background-position:right -190px top 560px,left -170px top 30%,right -160px top 53%,left -150px top 75%,right -130px top 96%,0 0}
  main.main-short{background-size:440px auto,380px auto,340px auto,auto;background-position:right -190px top 420px,left -160px top 58%,right -130px top 99%,0 0}
}

/* ---------- Sections and dividers ---------- */
.section{position:relative;padding-block:var(--section)}
/* Section divider: a fine arc that echoes the header wing, with the logo's bird in a white seal at its peak */
.hero+.section::before,.section+.section:not(.closing)::before{content:'';position:absolute;left:50%;top:-20px;transform:translateX(-50%);width:min(var(--max),calc(100% - 64px));height:40px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1180 40' preserveAspectRatio='none'%3E%3ClinearGradient id='g' x1='0' x2='1'%3E%3Cstop offset='0' stop-color='%23353e5a' stop-opacity='0'/%3E%3Cstop offset='.28' stop-color='%23353e5a' stop-opacity='.22'/%3E%3Cstop offset='.43' stop-color='%237fbc57'/%3E%3Cstop offset='.57' stop-color='%237fbc57'/%3E%3Cstop offset='.72' stop-color='%23353e5a' stop-opacity='.22'/%3E%3Cstop offset='1' stop-color='%23353e5a' stop-opacity='0'/%3E%3C/linearGradient%3E%3Cpath d='M0 32C300 32 420 8 590 8S880 32 1180 32' fill='none' stroke='url(%23g)' stroke-width='1.5' vector-effect='non-scaling-stroke'/%3E%3C/svg%3E") no-repeat center/100% 100%;pointer-events:none}
.hero+.section::after,.section+.section:not(.closing)::after{content:'';position:absolute;left:50%;top:-34px;transform:translateX(-50%);width:52px;height:52px;border-radius:50%;background:var(--white) url(assets/bird-navy.svg) no-repeat 50% 50%/28px auto;border:1px solid var(--line);pointer-events:none}
@media(max-width:800px){
  .hero+.section::before,.section+.section:not(.closing)::before{width:calc(100% - 40px)}
  .hero+.section::after,.section+.section:not(.closing)::after{width:44px;height:44px;top:-30px;background-size:22px auto}
}

/* ---------- Home: hero ---------- */
.hero{position:relative;padding:64px 0}
.hero-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gutter);align-items:center}
.hero-copy{grid-column:1/span 7}
.hero-visual{grid-column:8/span 5;position:relative;height:540px;isolation:isolate}
.hero h1{font-size:clamp(2.4rem,4.2vw,3.6rem);line-height:1.06}
@media(min-width:1680px){.hero h1{font-size:3.85rem}}
.hero-description{font-size:1.1875rem;line-height:1.7;color:var(--text);max-width:44ch;margin-top:22px}
@media(min-width:1680px){.hero-description{font-size:1.25rem}}
/* Route panel: tabs share one grid cell so switching never resizes the hero */
/* Photo with the feather-cut corners and an offset outline */
.hero-visual::before{content:'';position:absolute;inset:22px -22px -22px 22px;border:1.5px solid rgba(53,62,90,.35);border-radius:200px 28px 200px 28px;z-index:-1}
.hero-image{height:100%;border-radius:200px 28px 200px 28px;box-shadow:var(--shadow-photo);background:#2c3550 url(assets/lloyds.webp) center/cover no-repeat}
.hero-roles{position:absolute;left:-34px;bottom:40px;display:grid;gap:6px;max-width:300px;padding:20px 22px;background:var(--white);border-radius:var(--r-card);box-shadow:var(--shadow-overlay)}
.hero-roles-live{display:flex;align-items:center;gap:8px;font-size:.875rem;font-weight:700;color:var(--accent-text)}
.hero-roles-live .dot{width:8px;height:8px;border-radius:50%;background:var(--accent)}
.hero-roles strong{font-size:1.0625rem;line-height:1.35;font-weight:650;color:var(--ink)}
.hero-roles-link{font-size:.9375rem;font-weight:650;color:var(--ink);text-decoration:underline;text-underline-offset:.25em;text-decoration-color:var(--accent);text-decoration-thickness:2px}
.hero-roles:hover .hero-roles-link{text-decoration-color:var(--ink)}
/* Sector line under the hero */
.hero-proofbar{display:grid;justify-items:center;margin-top:56px;padding-top:28px;border-top:1px solid var(--line)}
.hero-sectors{display:flex;flex-direction:column;align-items:center;gap:12px;text-align:center}
.hero-sectors-label{font-size:.9375rem;font-weight:600;color:var(--muted)}
.sector-big{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;justify-content:center;row-gap:6px}
.sector-big li{padding:0 22px;border-left:1px solid var(--line);font-size:1.25rem;font-weight:750;letter-spacing:-.015em;line-height:1.3;color:var(--ink-deep)}
.sector-big li:first-child{border-left:0;padding-left:0}
.sector-big li:last-child{padding-right:0}
.sector-sub{margin-top:-2px;max-width:70ch;font-size:.875rem;line-height:1.6;font-weight:500;color:var(--muted);text-wrap:balance}
.sector-sub strong{font-weight:700;color:var(--ink)}
/* One load reveal: the hero settles in once */
@keyframes hero-rise{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.hero-rise{animation:hero-rise .3s var(--ease) both}
@media(max-width:980px){
  .hero-copy,.hero-visual{grid-column:1/-1}
  .hero-visual{height:360px;margin-top:44px}
  .hero-roles{left:16px}
  .sector-big{flex-direction:column;align-items:center;row-gap:2px}
  .sector-big li{border-left:0;padding:0;font-size:1.125rem}
}
@media(min-width:601px) and (max-width:980px){.hero-visual{height:420px;margin-bottom:24px}.hero-roles{left:24px;bottom:28px}}
@media(max-width:800px){.hero{padding:44px 0 52px}.hero-description{font-size:1.0625rem}.hero-visual::before{inset:14px -10px -14px 14px}}
@media(max-width:600px){
  .hero{padding-top:40px}
  .hero-visual{height:300px;margin-bottom:64px}
  .hero-roles{left:14px;right:14px;bottom:-52px;max-width:none}
  .hero-proofbar{margin-top:40px}
}

/* ---------- Ruled rows: title left, description right on the grid ---------- */
.why-head{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gutter);margin-bottom:48px}
.why-head h2{grid-column:1/span 8}
.why-lead{grid-column:1/span 6;margin-top:18px;font-size:1.125rem;line-height:1.65;color:var(--text)}
.ruled-rows{border-top:2px solid var(--rule-strong)}
.ruled-row{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gutter);padding:30px 0;border-bottom:1px solid var(--rule)}
.ruled-row h3{grid-column:1/span 4;font-size:1.375rem;color:var(--ink-deep)}
.ruled-row p{grid-column:6/span 6;font-size:1.0625rem;line-height:1.65;max-width:60ch}
@media(max-width:800px){
  .why-head h2,.why-lead{grid-column:1/-1}
  .ruled-row h3,.ruled-row p{grid-column:1/-1}
  .ruled-row p{margin-top:8px}
  .ruled-row{padding:24px 0}
}

/* ---------- Home: how it works (restored v28 design: audience switch + one journey line in a panel) ---------- */
.how-head{display:flex;flex-direction:column;align-items:center;gap:30px;margin-bottom:34px;text-align:center}
.how-intro{max-width:640px;margin:0 auto}
.how-intro .eyebrow{display:flex;justify-content:center;margin-bottom:12px;font-size:.8125rem;font-weight:700;letter-spacing:.09em;text-transform:uppercase;color:var(--muted)}
.how-intro h2{font-size:clamp(1.75rem,2.6vw,2.25rem)}
.how-prompt{margin-top:12px;font-size:1.0625rem;color:var(--text)}
.audience-switch{display:grid;grid-template-columns:1fr 1fr;gap:10px;width:min(820px,100%);padding:10px;background:var(--white);border:1px solid var(--line);border-radius:30px;box-shadow:0 14px 32px rgba(38,45,68,.16)}
.audience-switch button{position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:4px;min-height:0;padding:26px 30px;border:2px solid var(--ink);border-radius:22px;background:var(--white);color:var(--ink);text-align:left;cursor:pointer;transition:background-color .18s,box-shadow .18s,transform .18s}
.audience-switch button::after{content:'';position:absolute;right:26px;top:50%;width:22px;height:22px;transform:translateY(-50%);background:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14m-6-6 6 6-6 6'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14m-6-6 6 6-6 6'/%3E%3C/svg%3E") center/contain no-repeat;transition:transform .18s}
.audience-switch button:hover{background:var(--paper);transform:translateY(-2px);box-shadow:0 10px 24px rgba(38,45,68,.14)}
.audience-switch button[aria-selected=true]{background:var(--ink);border-color:var(--ink);color:var(--white)}
.audience-switch button[aria-selected=true]:hover{background:var(--ink);transform:none}
.audience-switch button[aria-selected=true]::after{transform:translateY(-50%) rotate(90deg)}
.audience-switch button:focus-visible{outline:3px solid var(--accent-text);outline-offset:3px}
.aud-label{font-size:clamp(1.25rem,2vw,1.625rem);font-weight:700;line-height:1.2;letter-spacing:-.02em}
.aud-sub{font-size:.9375rem;font-weight:500;color:var(--text)}
.audience-switch button[aria-selected=true] .aud-sub{color:var(--on-dark)}
.journey{padding:52px 52px 40px;background:var(--white);border:1px solid var(--line);border-radius:24px;box-shadow:0 2px 14px rgba(38,45,68,.08)}
.journey[hidden]{display:none}
.journey-steps{position:relative;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:48px;list-style:none;margin:0;padding:0}
.journey-steps::before{content:'';position:absolute;top:8px;left:8px;right:8px;height:2px;background:linear-gradient(90deg,var(--ink) 0%,var(--ink) 55%,rgba(53,62,90,.18) 100%)}
.journey-steps li{position:relative;min-width:0;padding-top:40px}
.journey-steps li::before{content:'';position:absolute;top:0;left:0;width:18px;height:18px;border:2px solid var(--ink);border-radius:50%;background:var(--white)}
.journey-steps li:first-child::before{background:var(--ink)}
.journey-stage{display:block;font-size:.8125rem;font-weight:700;letter-spacing:.09em;text-transform:uppercase;color:var(--muted)}
.journey-steps h3{margin-top:8px;font-size:1.375rem}
.journey-steps p{max-width:32ch;margin-top:8px;font-size:1rem}
.journey-cta{display:flex;flex-wrap:wrap;align-items:center;gap:16px 22px;margin-top:44px;padding-top:32px;border-top:1px solid var(--line)}
.journey-cta p{font-size:1rem;font-weight:500;color:var(--text)}
@media(prefers-reduced-motion:reduce){.audience-switch button:hover{transform:none}}
@media(max-width:800px){
  .audience-switch{gap:8px;padding:8px;border-radius:24px}
  .audience-switch button{padding:18px 16px 18px 18px;border-radius:18px}
  .audience-switch button::after{display:none}
  .aud-sub{font-size:.8125rem}
  .journey{padding:32px 24px 28px;border-radius:20px}
  .journey-steps{grid-template-columns:1fr;gap:28px}
  .journey-steps::before{top:8px;bottom:8px;left:8px;right:auto;width:2px;height:auto;background:linear-gradient(180deg,var(--ink) 0%,var(--ink) 55%,rgba(53,62,90,.18) 100%)}
  .journey-steps li{padding:0 0 0 40px}
}

/* ---------- Reviews (v34 look): navy featured quote + two quotes on rules ---------- */
/* Team photo: feather-cut corners mirroring the hero photo, caption set on the image */
.team-photo{position:relative;display:flex;flex-direction:column;flex:1 1 auto;margin:32px 0 0;isolation:isolate}
.team-photo picture{display:block;position:relative;flex:1 1 auto;min-height:380px}
.team-photo picture img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 22%;border-radius:160px 28px 160px 28px;box-shadow:16px 16px 0 -1.5px var(--paper),16px 16px 0 0 rgba(53,62,90,.38),var(--shadow-photo)}
.team-photo::after{content:'';position:absolute;left:0;right:0;bottom:0;height:62%;border-radius:0 0 160px 28px;background:linear-gradient(180deg,rgba(24,29,46,0) 0%,rgba(24,29,46,.55) 45%,rgba(24,29,46,.92) 100%);pointer-events:none;z-index:1}
.team-photo figcaption{position:absolute;left:30px;right:30px;bottom:28px;z-index:2;color:var(--white)}
.team-photo figcaption strong{display:block;font-size:1.0625rem;font-weight:700;color:var(--white)}
.team-photo figcaption span{display:block;margin-top:2px;max-width:30ch;font-size:.875rem;color:var(--on-dark)}
@media(max-width:980px){
  .reviews{padding-bottom:72px}
  .reviews-intro{grid-column:1/-1}
  .reviews-intro h2{max-width:none}
  .team-photo picture{min-height:0;aspect-ratio:4/3;flex:none}
  .team-photo picture img{object-position:50% 18%;border-radius:110px 24px 110px 24px;box-shadow:10px 10px 0 -1.5px var(--paper),10px 10px 0 0 rgba(53,62,90,.38),0 18px 40px rgba(38,45,68,.16)}
  .team-photo::after{border-radius:0 0 110px 24px}
  .team-photo figcaption{left:22px;bottom:20px}
}
@media(max-width:800px){.quote-pair{grid-template-columns:1fr;gap:32px;margin-top:40px}}

/* ---------- Closing: one sentence, one button, contact details ---------- */
.closing{padding-top:0}
.closing-inner{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gutter);align-items:start;padding-top:48px;border-top:2px solid var(--rule-strong)}
.closing-copy{grid-column:1/span 7}
.closing-copy h2{font-size:clamp(1.9rem,3vw,2.6rem)}
.closing-copy>p{margin-top:14px;max-width:46ch;font-size:1.0625rem}
.closing-actions{display:flex;align-items:center;flex-wrap:wrap;gap:16px 26px;margin-top:28px}
.closing-details{grid-column:9/span 4}
.closing-details>div{display:grid;grid-template-columns:90px minmax(0,1fr);gap:12px;padding:14px 0;border-bottom:1px solid var(--rule)}
.closing-details>div:first-child{padding-top:4px}
.closing-details dt{font-size:.875rem;font-weight:600;color:var(--muted)}
.closing-details dd{font-size:.9375rem;font-weight:650;color:var(--ink);overflow-wrap:anywhere}
.closing-details a{text-decoration:underline;text-decoration-color:var(--accent);text-underline-offset:4px}
@media(max-width:980px){.closing-copy,.closing-details{grid-column:1/-1}.closing-details{margin-top:36px}}

/* ---------- Inner page openings ---------- */
.page-hero,.post-header{position:relative;padding:88px 0 40px;color:var(--ink)}
.page-hero h1{font-size:clamp(2.5rem,5vw,3.9rem);max-width:15em}
.page-lead{margin-top:24px;max-width:46ch;font-size:1.1875rem;line-height:1.7;color:var(--text)}
.page-lead a{color:var(--accent-text);text-decoration:underline;text-underline-offset:.2em}
.page-hero-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gutter);align-items:end}
.page-hero-grid>div{grid-column:1/span 7}
.hero-note{grid-column:9/span 4;padding-top:18px;border-top:2px solid var(--rule-strong)}
.page-hero-actions{display:flex;flex-wrap:wrap;align-items:center;gap:14px 24px;margin-top:30px}
.apply-steps{counter-reset:step;margin-top:6px}
.apply-steps li{counter-increment:step;display:grid;grid-template-columns:26px minmax(0,1fr);padding:12px 0;border-bottom:1px solid var(--rule)}
.apply-steps li::before{content:counter(step) '.';grid-row:span 2;font-weight:700;color:var(--ink)}
.apply-steps strong{font-size:1rem;font-weight:700;line-height:1.4;color:var(--ink-deep)}
.apply-steps span{font-size:.9375rem;line-height:1.5;color:var(--text)}
.hero-aside-note{margin-top:14px;font-size:.9375rem;color:var(--text)}
.hero-aside-note a{font-weight:650;color:var(--ink);text-decoration:underline;text-decoration-color:var(--accent);text-decoration-thickness:2px;text-underline-offset:4px}
.tick-list{list-style:none;margin:6px 0 0;padding:0}
.tick-list li{padding:12px 0;border-bottom:1px solid var(--rule);font-weight:600;line-height:1.45;color:var(--ink)}
@media(max-width:980px){.page-hero-grid>div,.hero-note{grid-column:1/-1}.hero-note{margin-top:40px}}
@media(max-width:800px){.page-hero,.post-header{padding:56px 0 24px}}

/* ---------- About ---------- */
.prose{display:grid;gap:20px;max-width:680px}
.prose p{font-size:1.0625rem;color:var(--text)}
.prose h2{margin-top:28px}
/* About: story and culture as two-column rows, mission on a navy card, values in the hero card */
.about{padding-top:72px}
.about-row{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gutter);row-gap:20px;align-items:start}
.about-row h2{grid-column:1/span 5;font-size:clamp(1.75rem,3vw,2.375rem);line-height:1.18;letter-spacing:-.025em}
.about-copy{grid-column:7/span 6;display:grid;gap:18px}
.about-copy p{font-size:1.0625rem;line-height:1.75;color:var(--text)}
.mission-card{display:grid;grid-template-columns:minmax(0,1.35fr) auto;align-items:center;gap:32px 56px;margin-block:72px;padding:48px 52px;background:var(--ink);color:var(--white);border-radius:24px;box-shadow:0 24px 56px rgba(38,45,68,.2)}
.mission-card .side-title{margin:0 0 12px;font-size:.8125rem;font-weight:700;letter-spacing:.09em;text-transform:uppercase;color:var(--on-dark-2)}
.mission-text{font-size:clamp(1.375rem,2.3vw,1.75rem);font-weight:600;line-height:1.4;letter-spacing:-.018em;color:var(--white);max-width:30ch}
.mission-actions{display:flex;flex-direction:column;gap:12px}
.mission-card :focus-visible{outline-color:var(--accent)}
.button-ghost{background:transparent;color:var(--white);border-color:rgba(255,255,255,.55)}
.button-ghost:hover{background:rgba(255,255,255,.1);border-color:var(--white);transform:translateY(-2px)}
/* Values in the hero card: numbered circles */
.values{list-style:none;margin:0;padding:0;counter-reset:value}
.values li{display:flex;align-items:center;gap:16px;padding:12px 0;border-top:1px solid var(--line);font-size:1.3125rem;font-weight:650;letter-spacing:-.018em;color:var(--ink)}
.values li:first-child{border-top:0;padding-top:2px}
.values li::before{counter-increment:value;content:'0' counter(value);flex:none;display:grid;place-items:center;width:38px;height:38px;border-radius:50%;background:var(--accent-tint);color:#28571a;font-size:.8125rem;font-weight:700;letter-spacing:.02em}
/* Join the team: one card under the team grid */
.join-card{display:flex;align-items:center;justify-content:space-between;gap:24px 48px;margin-top:56px;padding:32px 40px;background:var(--white);border:1px solid var(--line);border-left:4px solid var(--accent);border-radius:20px;box-shadow:var(--shadow-soft)}
.join-card h3{font-size:1.375rem;letter-spacing:-.015em;color:var(--ink-deep)}
.join-card p{margin-top:8px;max-width:62ch;font-size:1rem;line-height:1.65;color:var(--text)}
.join-card .button{flex:none}
@media(max-width:980px){
  .about-row h2,.about-copy{grid-column:1/-1}
  .mission-card{grid-template-columns:1fr;margin-block:56px}
  .mission-actions{flex-direction:row;flex-wrap:wrap}
}
@media(max-width:800px){.about{padding-top:48px}.mission-card{padding:36px 28px;border-radius:20px}.join-card{flex-direction:column;align-items:flex-start;padding:28px 24px}}
/* Meet the team */
.staff-grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:40px var(--gutter)}
.staff-card{display:grid;align-content:start;gap:4px}
.staff-photo{aspect-ratio:1/1;overflow:hidden;border-radius:var(--r-card);background:var(--ink);margin-bottom:14px}
.staff-photo img{width:100%;height:100%;object-fit:cover;object-position:center 30%}
.staff-initials{display:flex;align-items:center;justify-content:center;width:100%;height:100%;font-size:clamp(2.25rem,5vw,3.5rem);font-weight:700;letter-spacing:.02em;color:var(--accent-on-dark)}
.staff-card h3{font-size:1.125rem;font-weight:700;line-height:1.3;color:var(--ink-deep)}
.staff-card p{font-size:.9375rem;line-height:1.5;color:var(--muted)}
@media(max-width:980px){.staff-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:640px){.staff-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 16px}.staff-card h3{font-size:1rem}.staff-card p{font-size:.875rem}}

/* ---------- Jobs list (written by the editor) ---------- */
.job-list{list-style:none;margin:0;padding:0;border-top:2px solid var(--rule-strong)}
.job-row{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1.8fr) auto;gap:32px;align-items:center;padding:28px 0;border-bottom:1px solid var(--rule)}
.job-title h3{font-size:1.3125rem;margin-top:6px}
.job-title h3 a:hover{text-decoration:underline;text-decoration-color:var(--accent);text-decoration-thickness:2px;text-underline-offset:4px}
.job-status{display:flex;flex-wrap:wrap;align-items:center;gap:4px 14px;font-size:.875rem;font-weight:600;color:var(--muted)}
.job-tag{font-weight:700;color:var(--accent-text)}
.job-more-link{display:inline-block;margin-top:8px;font-size:.9375rem;font-weight:650;color:var(--ink);text-decoration:underline;text-decoration-color:var(--accent);text-decoration-thickness:2px;text-underline-offset:4px}
.job-facts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.job-facts dt{font-size:.8125rem;font-weight:500;color:var(--muted)}
.job-facts dd{margin-top:4px;font-size:.9375rem;font-weight:650;color:var(--ink)}
.jobs-empty{display:grid;gap:12px;justify-items:start;padding:28px 0;border-top:2px solid var(--rule-strong);border-bottom:1px solid var(--rule)}
.jobs-empty .button{margin-top:8px}
.job-more{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-top:28px}
.clients-inner{display:flex;align-items:center;justify-content:space-between;gap:40px}
.clients-inner h2{max-width:20ch;font-size:clamp(1.9rem,3vw,2.5rem)}
.clients-inner p{margin-top:16px;max-width:44ch}
.clients-actions{display:flex;flex-wrap:wrap;gap:12px;flex:none}
@media(max-width:980px){.job-row{grid-template-columns:1fr;gap:18px}.job-row .job-apply{justify-self:start}.clients-inner{flex-direction:column;align-items:flex-start}}
@media(max-width:800px){.job-row{padding:24px 0}.job-more{flex-direction:column;align-items:flex-start}}
@media(max-width:640px){.clients-actions{width:100%}.clients-actions .button{flex:1 1 220px}}
@media(max-width:600px){.job-facts{grid-template-columns:1fr 1fr}.job-facts div:last-child{grid-column:1/-1}}
/* Single job page */
.job-page-facts{grid-template-columns:repeat(auto-fit,minmax(150px,1fr));max-width:760px;margin-top:28px;padding:18px 0;border-top:2px solid var(--rule-strong);border-bottom:1px solid var(--rule)}
.job-page-actions{display:flex;flex-wrap:wrap;align-items:center;gap:14px 24px;margin-top:26px}
@media(max-width:640px){.job-page-facts{grid-template-columns:1fr 1fr}}

/* ---------- Clients ---------- */
.split{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gutter);align-items:start}
.split>h2{grid-column:1/span 5}
.split>.prose{grid-column:7/span 6}
.sector-index{display:grid;grid-template-columns:1fr 1fr;column-gap:64px;border-top:2px solid var(--rule-strong)}
.sector-index>div{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:20px;padding:24px 0;border-bottom:1px solid var(--rule)}
.sector-index dt{font-size:1.1875rem;font-weight:700;letter-spacing:-.01em;color:var(--ink-deep)}
.sector-index dd{font-size:1rem;line-height:1.6;color:var(--text)}
.client-coverage{padding-block:64px}
.coverage{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gutter);align-items:end}
.coverage h2{grid-column:1/span 6;font-size:clamp(1.8rem,3vw,2.5rem)}
.coverage-line{grid-column:8/span 5;font-size:1.25rem;font-weight:500;line-height:1.55;color:var(--ink)}
.faq-wrap{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gutter);align-items:start}
.faq-wrap>h2{grid-column:1/span 4}
.faq{grid-column:6/span 7;border-top:2px solid var(--rule-strong)}
.faq details{border-bottom:1px solid var(--rule)}
.faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:16px;padding:20px 0;font-size:1.0625rem;font-weight:700;color:var(--ink-deep)}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:'';flex:none;width:14px;height:14px;background:linear-gradient(var(--ink),var(--ink)) center/14px 2px no-repeat,linear-gradient(var(--ink),var(--ink)) center/2px 14px no-repeat;transition:transform .2s var(--ease)}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details p{padding:0 0 20px;max-width:62ch;color:var(--text)}
.faq details a{font-weight:650;color:var(--ink);text-decoration:underline;text-decoration-color:var(--accent);text-decoration-thickness:2px;text-underline-offset:3px}
@media(max-width:980px){
  .split>h2,.split>.prose,.coverage h2,.coverage-line,.faq-wrap>h2,.faq{grid-column:1/-1}
  .split>.prose,.coverage-line,.faq{margin-top:28px}
  .sector-index{grid-template-columns:1fr}
}
@media(max-width:640px){.sector-index>div{grid-template-columns:1fr;gap:6px;padding:18px 0}}

/* ---------- Blog ---------- */
.blog-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px}
.post-card{display:flex;flex-direction:column;background:var(--white);border:1px solid var(--line);border-radius:var(--r-card);overflow:hidden}
.post-card-media{aspect-ratio:16/10;overflow:hidden;background:var(--ink) url(assets/bird.svg) no-repeat center/72px}
.post-card-media img{width:100%;height:100%;object-fit:cover}
.post-card-body{display:flex;flex-direction:column;gap:12px;flex:1;padding:24px 26px 28px}
.post-card h2,.post-card h3{margin:0;font-size:1.4375rem;font-weight:650;line-height:1.28;letter-spacing:-.02em}
.post-card h2 a:hover{text-decoration:underline;text-decoration-color:var(--accent);text-decoration-thickness:2px;text-underline-offset:4px}
.post-card p{font-size:.9375rem}
.post-card .read-more{margin-top:auto;padding-top:8px;font-size:.9375rem;font-weight:650;text-decoration:underline;text-decoration-color:var(--accent);text-decoration-thickness:2px;text-underline-offset:5px}
.post-meta{display:flex;flex-wrap:wrap;align-items:center;gap:4px 14px;font-size:.875rem;color:var(--muted)}
.post-tag{font-weight:700;color:var(--accent-text)}
.blog-empty{padding:32px 0;border-top:2px solid var(--rule-strong);border-bottom:1px solid var(--rule)}
.post-header .post-meta{margin-top:22px}
.post-header h1{font-size:clamp(2.2rem,4.4vw,3.4rem);max-width:20em;margin-top:18px}
.post-back{font-size:.9375rem;font-weight:500;color:var(--ink);text-decoration:underline;text-underline-offset:4px}
.post-hero-image{width:min(var(--max),calc(100% - 64px));margin:-1px auto 0}
.post-hero-image img{width:100%;max-height:520px;object-fit:cover;border-radius:var(--r-card)}
.post-body{padding:60px 0 28px}
.post-content{max-width:700px;margin-inline:auto;font-size:1.125rem;line-height:1.75;color:var(--text)}
.post-content>*+*{margin-top:1.25em}
.post-content h2{font-size:1.9rem;margin-top:2em;line-height:1.2;color:var(--ink)}
.post-content h3{font-size:1.4rem;margin-top:1.8em;line-height:1.3;color:var(--ink)}
.post-content a{color:var(--accent-text);text-decoration:underline;text-underline-offset:.2em;font-weight:600}
.post-content ul,.post-content ol{display:block;padding-left:1.3em;list-style:revert}
.post-content li+li{margin-top:.45em}
.post-content blockquote{padding:22px 0;border-top:2px solid var(--rule-strong);border-bottom:1px solid var(--rule);font-size:1.375rem;font-weight:500;line-height:1.5;letter-spacing:-.01em;color:var(--ink)}
.post-content img{margin-block:1.6em;border-radius:var(--r-md)}
.post-content hr{margin-block:2.2em;border:0;border-top:1px solid var(--line)}
.post-content table{width:100%;border-collapse:collapse;font-size:.95rem}
.post-content th,.post-content td{padding:10px 8px;border-bottom:1px solid var(--line);text-align:left}
/* Closing line under a post or job: same quiet treatment as the page closing */
.post-cta{display:flex;align-items:center;justify-content:space-between;gap:28px;max-width:700px;margin:56px auto 0;padding-top:32px;border-top:2px solid var(--rule-strong)}
.post-cta h2{margin:0;font-size:1.6rem;color:var(--ink-deep)}
.post-cta p{margin-top:8px;font-size:.9375rem;color:var(--text)}
.post-cta .button{flex:none}
@media(max-width:980px){.blog-grid{grid-template-columns:1fr 1fr}}
@media(max-width:800px){
  .blog-grid{grid-template-columns:1fr}
  .post-hero-image{width:calc(100% - 40px)}
  .post-content{font-size:1.0625rem}
  .post-cta{flex-direction:column;align-items:flex-start}
}

/* ---------- 404 ---------- */
.nf{padding-block:72px 96px}
.nf-grid{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:48px;align-items:center}
.nf h1{margin:0 0 18px;font-size:clamp(2.4rem,5vw,3.8rem);line-height:1.05;color:var(--ink-deep)}
.nf-lead{max-width:34em;margin:0 0 28px;font-size:1.125rem;line-height:1.65;color:var(--text)}
.nf-actions{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:32px}
.nf-links{max-width:34em;padding-top:22px;border-top:1px solid var(--line)}
.nf-links p{margin:0 0 10px;font-weight:700;color:var(--ink-deep)}
.nf-links ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:4px 24px}
.nf-links a{display:inline-flex;align-items:center;min-height:40px;font-weight:600;color:var(--ink);text-decoration:underline;text-decoration-color:var(--accent);text-decoration-thickness:2px;text-underline-offset:5px}
.nf-links a:hover{color:var(--ink-deep)}
.nf-art{display:flex;align-items:center;justify-content:center;gap:clamp(6px,1.5vw,16px);user-select:none}
.nf-digit{font-size:clamp(7rem,16vw,12.5rem);font-weight:800;line-height:1;letter-spacing:-.04em;color:var(--ink)}
.nf-zero{display:grid;place-items:center;width:clamp(120px,15vw,200px);aspect-ratio:1/1;border-radius:50%;background:var(--white);border:clamp(10px,1.4vw,16px) solid var(--accent)}
.nf-zero img{width:66%;height:auto;animation:nf-in .3s var(--ease) both}
@keyframes nf-in{from{opacity:0;transform:translateY(6px) rotate(-4deg)}to{opacity:1;transform:none}}
@media(max-width:980px){.nf{padding-block:48px 72px}.nf-grid{grid-template-columns:1fr;gap:28px}.nf-art{order:-1;justify-content:flex-start}}
@media(max-width:480px){.nf-links ul{grid-template-columns:1fr}}

/* ---------- Footer ---------- */
footer{position:relative;margin-top:48px;padding-bottom:20px;background:var(--ink-deep);color:var(--on-dark)}
.footer-wing{position:absolute;left:0;right:0;top:-47px;width:100%;height:48px;transform:scale(-1,-1);pointer-events:none}
.footer-wing .wing-front{fill:var(--ink-deep)}
.footer-wing .wing-back{fill:var(--accent)}
footer .wordmark{--bh:46px}
.footer-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr 1.8fr;gap:36px 28px;padding-block:48px 40px;border-bottom:1px solid rgba(255,255,255,.12)}
.footer-about{max-width:34ch;margin:18px 0 20px;font-size:.9375rem;line-height:1.65;color:var(--on-dark)}
.footer-heading{margin:0 0 12px;font-size:.8125rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--accent-on-dark)}
.footer-col ul{list-style:none;margin:0;padding:0;display:grid;gap:2px}
.footer-col a{display:inline-flex;align-items:center;gap:10px;min-height:40px;font-size:.9375rem;font-weight:500;color:var(--white)}
.footer-col a:hover{text-decoration:underline;text-underline-offset:5px;text-decoration-thickness:1px}
.footer-contact a{overflow-wrap:anywhere}
.footer-place{display:inline-flex;align-items:flex-start;gap:10px;padding-top:9px;font-size:.9375rem;line-height:1.5;color:var(--on-dark)}
.footer-icon{flex:none;width:16px;height:16px;background:var(--accent-on-dark);-webkit-mask:var(--i) center/contain no-repeat;mask:var(--i) center/contain no-repeat}
.footer-place .footer-icon{margin-top:3px}
.footer-icon-phone{--i:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22 16.9v3a2 2 0 0 1-2.2 2 19.8 19.8 0 0 1-8.6-3.1 19.5 19.5 0 0 1-6-6A19.8 19.8 0 0 1 2.1 4.2 2 2 0 0 1 4.1 2h3a2 2 0 0 1 2 1.7c.1.9.4 1.8.7 2.7a2 2 0 0 1-.5 2.1L8 9.8a16 16 0 0 0 6 6l1.3-1.3a2 2 0 0 1 2.1-.4c.9.3 1.8.6 2.7.7a2 2 0 0 1 1.7 2z'/%3E%3C/svg%3E")}
.footer-icon-mail{--i:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='18' height='14' rx='2'/%3E%3Cpath d='m3 7 9 6 9-6'/%3E%3C/svg%3E")}
.footer-icon-pin{--i:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 21s-7-6.2-7-11.5a7 7 0 0 1 14 0C19 14.8 12 21 12 21z'/%3E%3Ccircle cx='12' cy='9.5' r='2.5'/%3E%3C/svg%3E")}
.socials{display:flex;gap:10px}
.social{display:grid;place-items:center;width:44px;height:44px;border:1px solid rgba(255,255,255,.2);border-radius:50%;transition:background-color .18s,border-color .18s}
.social svg{width:19px;height:19px;fill:var(--white)}
.social:hover{background:var(--accent);border-color:var(--accent)}
.social:hover svg{fill:var(--ink)}
.footer-bottom{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px;padding-top:20px;font-size:.875rem;color:var(--on-dark)}
.footer-legal{display:grid;gap:4px}
.footer-policies{display:flex;flex-wrap:wrap;gap:4px 22px}
.footer-policies .text-button{display:inline-flex;align-items:center;min-height:44px;font-size:.875rem;color:var(--on-dark)}
.footer-policies .text-button:hover{color:var(--white)}
@media(max-width:980px){.footer-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:28px 20px;padding-block:40px 32px}.footer-brand,.footer-contact{grid-column:1/-1}}
@media(max-width:800px){footer{padding-bottom:calc(92px + env(safe-area-inset-bottom,0px))}.footer-wing{top:-31px;height:32px}}
@media(max-width:420px){.footer-col a{font-size:.875rem}}

/* ---------- Mobile action bar ---------- */
.mobile-bar{display:none}
@media(max-width:800px){
  .mobile-bar{display:grid;grid-template-columns:1.2fr 1fr;gap:10px;position:fixed;left:0;right:0;bottom:0;z-index:25;padding:10px 14px calc(10px + env(safe-area-inset-bottom,0px));background:rgba(255,255,255,.97);border-top:1px solid var(--line);transition:transform .25s var(--ease)}
  .mobile-bar .button{min-height:48px;padding:10px;font-size:.9375rem}
  .mobile-bar .button::after{display:none}
  .mobile-bar.is-tucked{transform:translateY(110%)}
  .has-cookie-banner .mobile-bar.is-tucked{transform:none}
}

/* ---------- Dialogs and forms ---------- */
body.modal-open{overflow:hidden}
dialog{width:min(600px,calc(100% - 32px));max-height:90dvh;padding:38px 40px;border:none;border-radius:var(--r-card);background:var(--paper);color:var(--ink);box-shadow:0 24px 80px rgba(0,0,0,.27)}
dialog::backdrop{background:rgba(38,45,68,.7)}
.dialog-close{position:absolute;top:12px;right:16px;width:34px;height:34px;border:0;background:none;font-size:1.7rem;line-height:1;color:var(--ink)}
.dialog-heading h2{font-size:2rem}
.dialog-heading>p:last-child{margin-top:12px;font-size:.9375rem;color:var(--text)}
.preview-notice{margin:18px 0;padding:10px 13px;border-radius:var(--radius);background:var(--accent-tint);font-size:.8125rem;color:#1f3a10}
form label{display:block;margin-bottom:16px;font-size:.875rem;font-weight:600;line-height:1.5}
input:not([type=file]),select,textarea{display:block;width:100%;min-height:48px;margin-top:7px;padding:12px 13px;border:1px solid var(--border);border-radius:var(--radius);background:var(--white);color:var(--ink);font-size:1rem;line-height:1.5;font-weight:400}
input:not([type=file]):focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--ink);outline-offset:2px;border-color:var(--ink)}
input:user-invalid,select:user-invalid,textarea:user-invalid{border-color:var(--error)}
textarea{resize:vertical}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.optional{margin-left:6px;font-size:.8125rem;font-weight:400;color:var(--muted)}
.file-drop{margin-bottom:16px;padding:18px;border:1px dashed var(--border);border-radius:var(--r-md);background:var(--white);text-align:center}
.file-drop.drag-over{border-color:var(--ink);background:var(--accent-tint)}
.file-icon{display:block;margin-bottom:6px;font-size:1.5rem;line-height:1}
.file-drop label{margin:0;font-size:.9375rem}
.file-drop label span{display:block;font-size:.8125rem;font-weight:400;color:var(--muted)}
.file-drop input{display:block;width:100%;max-width:270px;min-height:0;margin:12px auto 0;padding:0;border:0;font-size:.8125rem}
input::file-selector-button{margin-right:10px;padding:8px 12px;border:0;border-radius:var(--radius);background:var(--ink);color:var(--white);font-family:var(--font);cursor:pointer}
.file-drop>p{margin-top:8px;font-size:.8125rem;color:var(--muted);overflow-wrap:anywhere}
.file-drop #file-status{font-weight:600}
.form-submit{width:100%;font-size:1rem}
.form-note{margin-top:14px;font-size:.8125rem;line-height:1.7;color:var(--muted)}
.form-feedback{margin-top:16px;padding:16px;border:1px solid #a9cf8f;border-radius:var(--r-md);background:var(--accent-tint);font-size:.9375rem}
.form-feedback strong{display:block;margin-bottom:4px}
@media(max-width:800px){dialog{padding:30px 20px}.form-row{grid-template-columns:1fr;gap:0}}
/* Privacy notice */
#privacy-dialog .dialog-heading{margin-bottom:8px}
#privacy-dialog .privacy-copy{font-size:1rem;line-height:1.6}
.privacy-copy a{text-decoration:underline}
.privacy-block{padding-block:18px;border-top:1px solid #dfe3ea}
.privacy-block:first-of-type{padding-top:8px;border-top:0}
.privacy-block h3{margin:0 0 8px;font-size:1.0625rem;font-weight:700;color:var(--ink-deep)}
.privacy-list{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.privacy-list li{position:relative;padding-left:24px}
.privacy-list li::before{content:'';position:absolute;left:2px;top:.55em;width:9px;height:9px;border-radius:50%;background:var(--accent)}
.cookie-types{display:grid;gap:12px;margin-top:4px}
.cookie-type{display:grid;gap:8px;padding:16px 18px;border:1px solid #dfe3ea;border-radius:var(--r-md);background:var(--white)}
.cookie-type-head{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px}
.cookie-type h4{margin:0;font-size:1rem;font-weight:700;color:var(--ink-deep)}
.cookie-type .privacy-list{font-size:.9375rem}
.cookie-pill{display:inline-flex;align-items:center;min-height:26px;padding:2px 10px;border-radius:var(--radius);background:#eef0f5;font-size:.8125rem;font-weight:700;color:var(--ink)}
.cookie-pill-on{background:var(--accent-tint);color:var(--accent-text)}
.privacy-change{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px 16px;margin-top:16px}
.cookie-settings-inline{min-height:48px;padding:12px 20px}
.cookie-provider{padding-top:8px;border-top:1px solid #eceff4;font-size:.875rem;color:var(--muted)}

/* ---------- Cookie banner ---------- */
.cookie-banner{position:fixed;z-index:60;left:max(20px,env(safe-area-inset-left,0px));bottom:calc(20px + env(safe-area-inset-bottom,0px));width:min(440px,calc(100vw - 40px));padding:22px 22px 20px;border:1px solid #d9dde6;border-radius:var(--r-card);background:var(--white);color:var(--text);box-shadow:0 18px 50px rgba(38,45,68,.22)}
.cookie-banner h2{margin:0 0 8px;font-size:1.125rem;line-height:1.3;color:var(--ink-deep)}
.cookie-banner p{margin:0 0 16px;font-size:.9375rem;line-height:1.6}
.cookie-banner .text-button{font-weight:600;color:var(--ink)}
.cookie-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.cookie-btn{min-height:48px;padding:12px 16px;font-weight:700}
.cookie-btn[data-cookie-choice=accept]{background:var(--accent);color:var(--on-green)}
.cookie-btn[data-cookie-choice=accept]:hover{background:var(--accent-hover)}
.cookie-btn[data-cookie-choice=decline]{background:var(--ink);color:var(--white)}
.cookie-btn[data-cookie-choice=decline]:hover{background:var(--ink-deep)}
@media(max-width:980px){.cookie-banner{left:12px;right:12px;width:auto;bottom:calc(88px + env(safe-area-inset-bottom,0px))}}

/* =====================================================================
   v34 look, restored at the owner's request: high-visibility buttons,
   floating cards with soft shadows, navy featured review.
   ===================================================================== */
:root{--shadow-soft:0 2px 14px rgba(38,45,68,.08);--shadow-lift:0 14px 32px rgba(38,45,68,.16)}

/* Buttons: green glow, lift on hover */
.button{transition:background-color .18s,color .18s,border-color .18s,transform .18s,box-shadow .18s}
.button-lime{box-shadow:0 6px 18px rgba(127,188,87,.38)}
.button-lime:hover,.button-dark:hover{transform:translateY(-2px)}
.cookie-btn::after,.cookie-settings-inline::after{display:none}
.cookie-btn{box-shadow:none}
.cookie-btn:hover{transform:none}

/* Hero panel and its tabs */
.monogram{flex:none;display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:var(--ink);color:var(--white);font-weight:700}
/* Live roles card on the photo */
.hero-roles{border-radius:18px;transition:transform .18s,box-shadow .18s}
.hero-roles:hover{transform:translateY(-3px);box-shadow:var(--shadow-lift)}
.hero-roles-live{font-size:.75rem;letter-spacing:.08em;text-transform:uppercase}
.hero-roles-live .dot{box-shadow:0 0 0 4px rgba(127,188,87,.22)}

/* One floating panel around ruled lists (Why rows, Clients sector index) */
.card-panel{background:var(--white);border:1px solid var(--line);border-radius:24px;box-shadow:var(--shadow-soft)}
.ruled-rows.card-panel{padding:6px 44px;border-top:1px solid var(--line)}
.ruled-rows.card-panel .ruled-row:last-child{border-bottom:0}
.sector-index.card-panel{padding:10px 44px;border-top:1px solid var(--line)}
.sector-index.card-panel>div:nth-last-child(-n+2){border-bottom:0}
@media(max-width:980px){.sector-index.card-panel>div:nth-last-child(2){border-bottom:1px solid var(--rule)}}
@media(max-width:800px){.ruled-rows.card-panel,.sector-index.card-panel{padding:4px 24px;border-radius:20px}}

/* Clients: the four-step process in the same panel as How it works */
.journey-panel{margin-top:0}
.journey-steps-4{grid-template-columns:repeat(4,minmax(0,1fr));gap:36px}
.journey-steps-4 p{max-width:none}
.journey-steps-4 li:nth-child(-n+2)::before{background:var(--ink)}
.journey-steps a{font-weight:650;color:var(--ink);text-decoration:underline;text-decoration-color:var(--accent);text-decoration-thickness:2px;text-underline-offset:3px}
@media(max-width:980px){.journey-steps-4{grid-template-columns:1fr 1fr;row-gap:32px}.journey-steps-4::before{display:none}}
@media(max-width:640px){.journey-steps-4{grid-template-columns:1fr}}

/* Reviews: navy featured quote, two quotes with letter circles */
@media(min-width:981px){.reviews{padding-bottom:104px}}
.reviews-layout{display:grid;grid-template-columns:minmax(0,.75fr) minmax(0,1.25fr);grid-template-rows:auto 1fr;gap:44px 88px;align-items:start}
.reviews-intro{display:flex;flex-direction:column;align-self:stretch}
.reviews-intro h2{max-width:12ch}
.reviews-intro{grid-column:1;grid-row:span 2}
.review-feature{position:relative;margin:0 0 12px;padding:56px 56px 44px;overflow:hidden;background:var(--ink);color:var(--white);border-radius:24px;box-shadow:0 24px 56px rgba(38,45,68,.22)}
.review-feature::before{content:'\201C';position:absolute;top:-34px;right:34px;font-size:12rem;line-height:1;font-weight:700;color:rgba(255,255,255,.08)}
.review-feature blockquote{position:relative;font-size:1.5rem;font-weight:500;line-height:1.5;letter-spacing:-.012em;color:var(--white)}
.review-more{display:grid;grid-template-columns:1fr 1fr;gap:52px;align-self:start}
.review-quote{margin:0;padding-top:26px;border-top:2px solid var(--ink)}
.review-quote blockquote{font-size:1.0625rem;font-weight:500;line-height:1.65;color:var(--ink)}
.review-feature figcaption,.review-quote figcaption{display:flex;align-items:center;gap:14px;margin-top:26px}
.review-feature figcaption strong,.review-quote figcaption strong{display:block;font-weight:700}
.review-feature figcaption span span,.review-quote figcaption span span{display:block;font-size:.875rem;font-weight:500}
.review-feature figcaption span span{color:var(--on-dark)}
.review-quote figcaption span span{color:var(--muted)}
.review-feature .monogram{background:var(--white);color:var(--ink)}
.proof-pair{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:44px;align-items:start}
.proof-pair .review-feature{margin:0}
@media(min-width:981px) and (max-width:1240px){.reviews-layout{column-gap:64px}}
@media(max-width:980px){
  .reviews-layout{grid-template-columns:1fr;grid-template-rows:none;gap:36px}
  .reviews-intro{grid-row:auto}
  .proof-pair{grid-template-columns:1fr;gap:32px}
}
@media(max-width:800px){
  .review-feature{padding:40px 28px 32px;border-radius:20px}
  .review-feature blockquote{font-size:1.25rem}
  .review-more{grid-template-columns:1fr;gap:32px}
}

/* Jobs and Clients side boxes */
.hero-aside{grid-column:9/span 4;display:grid;gap:16px;padding:28px 30px;background:var(--white);border:1px solid var(--line);border-radius:20px;box-shadow:var(--shadow-soft)}
.hero-aside .side-title{margin:0;font-size:.8125rem;font-weight:700;letter-spacing:.09em;text-transform:uppercase;color:var(--muted)}
.hero-aside .apply-steps{display:grid;gap:14px;margin:0}
.hero-aside .apply-steps li{grid-template-columns:34px 1fr;column-gap:14px;align-items:start;padding:0;border:0}
.hero-aside .apply-steps li::before{content:counter(step);display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:var(--ink);color:var(--white);font-size:.875rem;font-weight:700}
.hero-aside .hero-aside-note{margin:0;padding-top:14px;border-top:1px solid var(--line)}
.hero-aside .tick-list{display:grid;gap:12px;margin:0}
.hero-aside .tick-list li{position:relative;padding:0 0 0 32px;border:0}
.hero-aside .tick-list li::before{content:'';position:absolute;left:0;top:.05em;width:22px;height:22px;border-radius:50%;background:var(--accent-tint) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2328571a' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12.5 4.5 4.5L19 7.5'/%3E%3C/svg%3E") no-repeat center/13px}
@media(max-width:980px){.hero-aside{grid-column:1/-1;margin-top:40px}}
@media(max-width:640px){.hero-aside{padding:24px 22px}}

/* Jobs list panel */
.job-list{overflow:hidden;background:var(--white);border:1px solid var(--line);border-radius:24px;box-shadow:var(--shadow-soft)}
.job-row{padding:30px 36px;border-top:1px solid var(--line);border-bottom:0;transition:background-color .18s}
.job-row:first-child{border-top:0}
.job-row:hover{background:#fafbf8}
.job-tag{display:inline-flex;align-items:center;min-height:24px;padding:2px 10px;border-radius:99px;background:var(--accent-tint);font-size:.75rem;letter-spacing:.06em;text-transform:uppercase}
.job-facts dt{font-size:.75rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase}
.job-more{margin-top:32px;padding:24px 30px;background:var(--white);border:1px dashed var(--border);border-radius:var(--r-card)}
.jobs-empty{padding:40px;background:var(--white);border:1px solid var(--line);border-radius:24px;box-shadow:var(--shadow-soft)}
@media(max-width:800px){.job-row{padding:24px}.jobs-empty{padding:28px 24px}}
.job-page-facts{padding:22px 24px;background:var(--white);border:1px solid var(--line);border-radius:var(--r-card)}

/* Questions as cards */
.faq{display:grid;gap:12px;border-top:0}
.faq details{background:var(--white);border:1px solid var(--line);border-radius:var(--r-md);box-shadow:var(--shadow-soft)}
.faq summary{padding:20px 22px}
.faq summary::after{width:22px;height:22px;border-radius:50%;background:var(--accent-tint) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2328571a' stroke-width='2.6' stroke-linecap='round'%3E%3Cpath d='M12 6v12M6 12h12'/%3E%3C/svg%3E") no-repeat center/12px}
.faq details p{padding:0 22px 20px}

/* Blog cards, post and job call-to-action box */
.post-card{box-shadow:var(--shadow-soft);transition:transform .18s,box-shadow .18s}
.post-card:hover{transform:translateY(-3px);box-shadow:var(--shadow-lift)}
.blog-empty{padding:44px;background:var(--white);border:1px dashed var(--border);border-radius:var(--r-card);text-align:center}
.post-cta{padding:34px 36px;background:var(--ink);color:var(--white);border:0;border-radius:20px}
.post-cta h2{color:var(--white)}
.post-cta p{color:var(--on-dark)}
.post-cta :focus-visible{outline-color:var(--accent)}
@media(max-width:800px){.post-cta{padding:28px 24px}}

/* Team photos */
.staff-photo{box-shadow:0 10px 30px rgba(38,45,68,.12)}
.staff-initials{background:radial-gradient(circle at 30% 20%,var(--ink-soft),var(--ink-deep))}


/* Home: compact Why section (statement left, three short points right) */
.why{padding-block:64px}
.why-compact{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gutter);align-items:center}
.why-compact .why-head{grid-column:1/span 5;display:block;margin:0}
.why-compact .why-head h2{font-size:clamp(1.9rem,2.8vw,2.4rem)}
.why-compact .why-lead{margin:16px 0 18px;font-size:1.0625rem}
.why-compact .card-panel{grid-column:7/span 6;padding:4px 32px}
.why-compact .ruled-row{display:block;padding:18px 0}
.why-compact .ruled-row h3{font-size:1.125rem}
.why-compact .ruled-row p{margin-top:4px;font-size:.96875rem;max-width:none}
@media(max-width:980px){.why-compact .why-head,.why-compact .card-panel{grid-column:1/-1}.why-compact .card-panel{margin-top:28px}}
@media(max-width:800px){.why{padding-block:56px}.why-compact .card-panel{padding:4px 22px}}


/* ---------- Jobs board: filters, coloured job types, show more ---------- */
.job-tag.tag-green{background:#e8f0e0;color:#28571a}
.job-tag.tag-navy{background:#e4e7ef;color:#262d44}
.job-tag.tag-blue{background:#e1ecf7;color:#1c4670}
.job-tag.tag-teal{background:#dcefec;color:#145650}
.job-tag.tag-amber{background:#f7ead2;color:#6b4206}
.job-tag.tag-rose{background:#f6e1e5;color:#7a2433}
.job-tag.tag-grey{background:#ebebe8;color:#3a4157}
.post-meta .job-tag{min-height:22px}
/* Industry labels: outlined in the chosen colour, so they read differently from the filled job type labels */
.job-tag.job-industry{background:var(--white);box-shadow:inset 0 0 0 1.5px currentColor}
.job-filters{display:flex;flex-wrap:wrap;align-items:flex-end;gap:14px 18px;margin-bottom:18px;padding:18px 22px;background:var(--white);border:1px solid var(--line);border-radius:var(--r-card);box-shadow:var(--shadow-soft)}
.job-filters[hidden]{display:none}
.job-filter{display:grid;gap:6px;min-width:220px;margin:0;font-size:.8125rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.job-filter select{min-width:220px;margin-top:0;min-height:48px;padding:10px 40px 10px 14px;border:1.5px solid var(--ink);border-radius:var(--radius);background:var(--white) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23353e5a' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") no-repeat right 12px center/18px;-webkit-appearance:none;appearance:none;font-size:1rem;font-weight:600;letter-spacing:0;text-transform:none;color:var(--ink);cursor:pointer}
.job-filter select:hover{background-color:var(--paper)}
.job-filters-clear{min-height:48px;padding:0 4px;font-weight:650;color:var(--ink);text-decoration-color:var(--accent);text-decoration-thickness:2px;text-underline-offset:5px}
.job-count{margin:0 0 12px;font-size:.9375rem;font-weight:600;color:var(--muted)}
.job-count:empty{display:none}
.job-row[hidden],.job-list[hidden]{display:none}
.job-row.is-first{border-top:0}
.job-noresults{padding:28px 30px;background:var(--white);border:1px dashed var(--border);border-radius:var(--r-card);color:var(--text)}
.job-noresults .text-button{font-weight:650;color:var(--ink);text-decoration-color:var(--accent);text-decoration-thickness:2px;text-underline-offset:4px}
.job-showmore-wrap{display:flex;justify-content:center;margin-top:24px}
.job-showmore-wrap:has(.job-showmore[hidden]){display:none}
@media(max-width:640px){.job-filters{padding:16px}.job-filter,.job-filter select{min-width:0;width:100%}.job-filter{flex:1 1 100%}}

/* ---------- Blog pages ---------- */
.pager{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:12px 18px;margin-top:48px}
.pager-nums{display:flex;flex-wrap:wrap;gap:8px;list-style:none;margin:0;padding:0}
.pager-num{display:grid;place-items:center;min-width:44px;height:44px;padding:0 10px;border:1.5px solid var(--ink);border-radius:var(--radius);background:var(--white);font-weight:700;color:var(--ink);transition:background-color .18s,color .18s,transform .18s}
a.pager-num:hover{background:var(--paper);transform:translateY(-2px)}
.pager-num[aria-current=page]{background:var(--ink);color:var(--white)}
.pager-step{display:inline-flex;align-items:center;min-height:44px;font-weight:650;color:var(--ink);text-decoration:underline;text-decoration-color:var(--accent);text-decoration-thickness:2px;text-underline-offset:5px}
.pager-step[aria-disabled=true]{color:var(--muted);text-decoration:none;opacity:.55}

/* ---------- Reduced motion: no movement at all ---------- */
/* Blog post: who wrote it, and "Keep reading" links to other posts */
.post-byline{margin-top:10px;font-size:.9375rem;color:var(--text)}
.post-byline a{font-weight:650;color:var(--ink);text-decoration:underline;text-decoration-color:var(--accent);text-decoration-thickness:2px;text-underline-offset:4px}
.post-related{max-width:700px;margin:56px auto 0}
.post-related h2{font-size:1.25rem;margin-bottom:8px}
.post-related ul{list-style:none;margin:0;padding:0;border-top:2px solid var(--rule-strong)}
.post-related li{border-bottom:1px solid var(--rule)}
.post-related a{display:flex;justify-content:space-between;align-items:baseline;gap:8px 24px;flex-wrap:wrap;padding:16px 0;color:var(--ink)}
.post-related a span{font-weight:650;font-size:1.0625rem;text-decoration:underline;text-decoration-color:transparent;text-decoration-thickness:2px;text-underline-offset:4px;transition:text-decoration-color .2s ease}
.post-related a:hover span{text-decoration-color:var(--accent)}
.post-related small{font-size:.875rem;color:var(--muted)}

/* Clients we work with: a wide pyramid under "Specialists in" (smaller row on top) */
.client-wall{display:grid;justify-items:center;gap:18px;width:100%;margin-top:34px;padding-top:28px;border-top:1px solid var(--line);text-align:center}
.client-wall-label{font-size:.9375rem;font-weight:600;color:var(--muted)}
.client-row{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:16px 56px}
.client-row+.client-row{margin-top:2px}
.client-logo img{display:block;height:34px;width:auto;max-width:170px;object-fit:contain;filter:grayscale(1);opacity:.78;transition:filter .3s var(--ease-out),opacity .3s var(--ease-out)}
.logo-square img{height:48px}
.logo-mid img{height:40px}
.logo-wide img{height:30px}
.client-word{font-size:1.0625rem;font-weight:800;letter-spacing:.07em;text-transform:uppercase;color:var(--ink-soft);line-height:34px}
.client-members-label{margin-top:6px}
@media(hover:hover) and (pointer:fine){.client-logo img:hover{filter:none;opacity:1}}
@media(max-width:640px){.client-row{display:grid;grid-template-columns:repeat(2,auto);justify-content:center;justify-items:center;align-items:center;gap:16px 34px}.client-logo img{max-width:132px}.logo-square img{height:40px}.logo-mid img{height:32px}.logo-wide img{height:24px}.client-word{font-size:.9375rem;line-height:28px}}

/* Employers page: Sedgwick partnership case study */
.case-panel{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gutter);row-gap:32px;padding:48px 52px;background:var(--white);border:1px solid var(--line);border-radius:24px;box-shadow:var(--shadow-soft)}
.case-head{grid-column:1/span 5}
.case-kicker{font-size:.8125rem;font-weight:700;letter-spacing:.09em;text-transform:uppercase;color:var(--accent-text)}
.case-head h2{margin-top:10px;font-size:clamp(1.75rem,2.8vw,2.25rem);line-height:1.15;letter-spacing:-.025em;text-wrap:balance}
.case-stats{display:grid;grid-template-columns:repeat(3,auto);justify-content:start;gap:0;margin:30px 0 0;padding-top:24px;border-top:2px solid var(--rule-strong)}
.case-stats div{display:flex;flex-direction:column;padding:0 26px;border-left:1px solid var(--line)}
.case-stats div:first-child{padding-left:0;border-left:0}
.case-stats dd{order:-1;margin:0;font-size:clamp(2rem,3.4vw,2.75rem);font-weight:800;line-height:1;letter-spacing:-.03em;color:var(--ink-deep);font-variant-numeric:tabular-nums}
.case-stats dt{margin-top:8px;max-width:12ch;font-size:.875rem;line-height:1.35;font-weight:600;color:var(--muted)}
.case-body{grid-column:7/span 6;display:grid;gap:16px;align-content:start}
.case-body p{font-size:1.0625rem;line-height:1.75;color:var(--text)}
.case-body strong{font-weight:700;color:var(--ink-deep)}
.case-body .case-note{font-size:.8125rem;line-height:1.5;color:var(--muted)}
.case-cta{grid-column:1/-1;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px 32px;padding-top:28px;border-top:1px solid var(--line)}
.case-cta p{font-size:1.25rem;font-weight:700;letter-spacing:-.012em;color:var(--ink-deep)}
@media(max-width:980px){.case-head,.case-body{grid-column:1/-1}.case-panel{padding:40px 36px}}
@media(max-width:640px){
  .case-panel{padding:30px 22px;border-radius:20px;row-gap:26px}
  .case-stats div{padding:0 14px}
  .case-stats dt{font-size:.8125rem}
  .case-cta{flex-direction:column;align-items:flex-start}
  .case-cta p{font-size:1.125rem}
}

/* =====================================================================
   Motion. One system for every animation on the site:
   - only transform and opacity animate (handled by the graphics card, no layout or repaint work)
   - hover shadows fade in on a separate layer instead of being redrawn every frame
   - one easing curve and three durations, so everything feels like the same hand made it
   - hover effects only on devices with a real pointer; presses give instant feedback
   - all of it switches off for visitors who ask their device for reduced motion
   ===================================================================== */
:root{--ease-out:cubic-bezier(.22,1,.36,1);--t-press:.12s;--t-hover:.3s;--t-enter:.45s}

/* Buttons: soft lift, arrow glides forward, a small press-in on click */
.button{transition:transform var(--t-hover) var(--ease-out),background-color .2s ease,color .2s ease,border-color .2s ease}
.button:not(.button-small)::after{transition:transform var(--t-hover) var(--ease-out)}
.button:active{transform:translateY(0) scale(.975);transition-duration:var(--t-press)}
.text-link,.read-more,.hero-aside-note a{transition:color .2s ease,text-underline-offset var(--t-hover) var(--ease-out),text-decoration-color .2s ease}

/* Cards: the hover shadow lives on its own layer and only fades */
.post-card,.audience-switch button{position:relative}
.post-card,.hero-roles,.audience-switch button{transition:transform var(--t-hover) var(--ease-out),background-color .2s ease}
.post-card::before,.hero-roles::before,.audience-switch button::before{content:'';position:absolute;inset:0;z-index:-1;border-radius:inherit;box-shadow:var(--shadow-lift);opacity:0;transition:opacity var(--t-hover) var(--ease-out);pointer-events:none}
.post-card{overflow:visible;isolation:isolate}
.post-card-media{border-radius:calc(var(--r-card) - 1px) calc(var(--r-card) - 1px) 0 0}
.post-card-media img{transition:transform .6s var(--ease-out)}
.hero-roles,.audience-switch button{isolation:isolate}
.audience-switch button:hover{box-shadow:none}
.post-card:hover{box-shadow:var(--shadow-soft)}
.hero-roles:hover{box-shadow:var(--shadow-overlay)}
.job-row{transition:background-color .25s ease}
.pager-num{transition:transform var(--t-hover) var(--ease-out),background-color .2s ease}
.social{transition:background-color .2s ease,border-color .2s ease,transform var(--t-hover) var(--ease-out)}

@media(hover:hover) and (pointer:fine){
  .button:not(.button-small):hover::after{transform:translateX(3px)}
  .text-link:hover,.read-more:hover,.hero-aside-note a:hover{text-underline-offset:3px}
  .post-card:hover::before,.hero-roles:hover::before,.audience-switch button:hover::before{opacity:1}
  .audience-switch button[aria-selected=true]:hover::before{opacity:0}
  .post-card:hover .post-card-media img{transform:scale(1.03)}
  .social:hover{transform:translateY(-2px)}
}
/* Touch screens: no lift that sticks after a tap */
@media(hover:none){
  .button:hover,.button-ghost:hover,.post-card:hover,.hero-roles:hover,.audience-switch button:hover,a.pager-num:hover{transform:none}
}

/* Opening animation for the homepage hero */
.hero-rise{animation:hero-rise .7s var(--ease-out) both}
/* Hero headline: each sentence starts on its own line, and no line ends on a single word */
.hero h1 .h1-line{display:block;text-wrap:balance}
.hero .eyebrow{text-wrap:balance}
@media(max-width:640px){.hero h1{font-size:min(2.4rem,calc((100vw - 40px) / 11.4))}}

/* Hero filter line: says who the site is for before anything else */
.hero-filter{display:inline-flex;align-items:flex-start;gap:10px;font-weight:650;color:var(--ink)}
.filter-dot{flex:none;width:9px;height:9px;margin-top:.42em;border-radius:50%;background:var(--accent);box-shadow:0 0 0 4px var(--accent-tint)}
/* Track record card on the photo (Website settings > Homepage), balancing the live roles card */
.hero-track{position:absolute;top:30px;right:22px;display:grid;gap:3px;max-width:250px;padding:16px 20px 18px;background:var(--white);border-radius:var(--r-card);box-shadow:var(--shadow-overlay)}
.hero-track-label{font-size:.75rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--accent-text)}
.hero-track strong{font-size:1.5rem;font-weight:800;line-height:1.15;letter-spacing:-.02em;color:var(--ink-deep)}
.hero-track-sub{font-size:.8125rem;line-height:1.45;font-weight:500;color:var(--muted)}
@media(max-width:980px){.hero-track{top:18px;right:18px}}
@media(max-width:640px){.hero-track{top:12px;right:12px;max-width:188px;padding:10px 14px 12px;gap:1px}.hero-track-label{font-size:.6875rem}.hero-track strong{font-size:1.125rem}.hero-track-sub{font-size:.75rem;line-height:1.4}}

/* Hero: the two routes in (find a role, find staff), styled like the site's main buttons */
.hero-routes{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;max-width:600px;margin-top:34px}
.route{position:relative;display:grid;align-content:center;gap:6px;min-height:150px;padding:22px 64px 22px 24px;border-radius:var(--r-card);transition:transform var(--t-hover) var(--ease-out),background-color .2s ease}
.route::after{content:'';position:absolute;right:22px;top:50%;width:24px;height:24px;transform:translateY(-50%);background:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14m-6-6 6 6-6 6'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14m-6-6 6 6-6 6'/%3E%3C/svg%3E") center/contain no-repeat;transition:transform var(--t-hover) var(--ease-out)}
.route-label{font-size:.75rem;font-weight:700;letter-spacing:.09em;text-transform:uppercase}
.route strong{font-size:clamp(1.125rem,1.45vw,1.3125rem);font-weight:750;line-height:1.25;letter-spacing:-.015em;text-wrap:balance}
.route-action{margin-top:8px;font-size:.9375rem;font-weight:700;white-space:nowrap;text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:4px}
.route-lime .route-action{text-decoration-color:rgba(18,24,40,.45)}
.route-dark .route-action{color:var(--white);text-decoration-color:var(--accent)}
.route-time{display:inline-block;font-weight:500;text-decoration:none}
@media(min-width:641px) and (max-width:1240px){.route{padding-right:50px}.route::after{right:16px;width:20px;height:20px}.route-action{font-size:.875rem}}
.route-lime{background:var(--accent);color:var(--on-green);box-shadow:0 6px 18px rgba(127,188,87,.38)}
.route-lime:hover{background:var(--accent-hover)}
.route-dark{background:var(--ink);color:var(--white);box-shadow:0 10px 24px rgba(38,45,68,.22)}
.route-dark:hover{background:var(--ink-deep)}
.route-dark .route-label{color:var(--on-dark-2)}
.route:focus-visible{outline:3px solid var(--accent-text);outline-offset:3px}
.route:active{transform:scale(.98);transition-duration:var(--t-press)}
@media(hover:hover) and (pointer:fine){.route:hover{transform:translateY(-2px)}.route:hover::after{transform:translate(3px,-50%)}}
.hero-quote{display:flex;align-items:center;gap:14px;max-width:600px;margin:28px 0 0;padding-top:20px;border-top:1px solid var(--line)}
.hero-quote .monogram{width:38px;height:38px;font-size:.9rem}
.hero-quote>div{flex:1;min-width:0}
.hero-quote blockquote{margin:0;font-size:.9375rem;font-weight:500;line-height:1.5;color:var(--ink)}
.hero-quote figcaption{margin-top:4px;font-size:.8125rem;font-weight:500;color:var(--muted)}
@media(max-width:640px){.hero-routes{grid-template-columns:1fr;gap:12px}.route{min-height:0;padding:20px 60px 20px 20px}.route strong{font-size:1.25rem}}
@keyframes hero-rise{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}

/* Mobile menu: drops in, links follow a beat behind; the bars cross smoothly */
.menu-bars,.menu-bars::before,.menu-bars::after{transition:transform var(--t-hover) var(--ease-out),background-color .15s ease}
@media(max-width:1080px){
  #navigation.open{animation:menu-in .38s var(--ease-out) both}
  #navigation.open>*{animation:fade-up .4s var(--ease-out) both}
  #navigation.open>:nth-child(2){animation-delay:.03s}
  #navigation.open>:nth-child(3){animation-delay:.06s}
  #navigation.open>:nth-child(4){animation-delay:.09s}
  #navigation.open>:nth-child(5){animation-delay:.12s}
  #navigation.open>:nth-child(6){animation-delay:.15s}
  #navigation.open>:nth-child(7){animation-delay:.18s}
}
@keyframes menu-in{from{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:none}}
@keyframes fade-up{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}

/* Forms (CV, hiring brief, privacy): the panel rises as the page dims behind it */
dialog[open]{animation:dialog-in var(--t-enter) var(--ease-out)}
dialog[open]::backdrop{animation:backdrop-in .3s ease}
@keyframes dialog-in{from{opacity:0;transform:translateY(16px) scale(.98)}to{opacity:1;transform:none}}
@keyframes backdrop-in{from{opacity:0}to{opacity:1}}

/* Hero tabs (I'm a candidate / I'm hiring): the two panels cross-fade */

/* How it works panels, newly shown job rows, opened questions: a short fade up */
.panel-in{animation:fade-up var(--t-enter) var(--ease-out) both}
.job-row.row-in{animation:fade-up .4s var(--ease-out) both}
.faq details[open]>:not(summary){animation:fade-up .35s var(--ease-out) both}
.faq summary::after{transition:transform var(--t-hover) var(--ease-out)}
.job-noresults:not([hidden]){animation:fade-up .35s var(--ease-out) both}

/* Cookie notice and the phone action bar */
.cookie-banner:not([hidden]){animation:fade-up var(--t-enter) var(--ease-out) .25s both}
.mobile-bar{transition:transform .4s var(--ease-out)}

@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}