/* Contega microsite
   Tokens mirror @contega/tokens v1.3.0 (brand.contega.com.au/tokens/contega.tokens.json).
   Component values are taken from the design system (Storybook): SiteHeader, HeroBand, Section, Eyebrow,
   PillarGrid, AdvisoryProcess (tone dark), ExpertProfile, Quote, EnquiryForm, Input, SiteFooter, DisclosureNotice.
   Fonts: Manuale and Inter load from Google Fonts (linked in index.html). */

:root{
  color-scheme:light;
  /* Primary palette */
  --clay:#C89578; --brick:#803A14; --coral:#FF5A4F; --dark-charcoal:#2C2D2C; --light-silver:#F6F8F8;
  /* Extended palette (used here) */
  --mid-silver:#E8EDEF; --silver:#BAC5CC; --steel:#4B5F6C; --dark-steel:#3E515D;
  --olive:#686B61; --teal:#344244; --dark-teal:#212B2D; --coffee:#46453F; --warm-charcoal:#30312F; --white:#FFFFFF;
  /* Roles */
  --border-default:rgba(44,45,44,.16); --border-inverse:rgba(246,248,248,.16);
  --text-secondary:var(--olive);
  /* Type */
  --font-display:Manuale,Georgia,serif; --font-utility:Inter,Arial,sans-serif;
  /* Motion */
  --motion-fast:160ms; --motion-base:240ms; --motion-slow:320ms;
  /* Radius */
  --radius-control:12px; --radius-pill:999px; --radius-indicator:2px;
  /* Layout */
  --header-h:132px; --header-h-compact:88px;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:var(--header-h-compact)}
body{margin:0;background:var(--light-silver);color:var(--dark-charcoal);font-family:var(--font-utility);font-size:17px;line-height:1.55;-webkit-font-smoothing:antialiased}
img{display:block;max-width:100%}
a{color:inherit}
h1,h2,h3,p,ol,ul,blockquote,figure{margin:0}
ol,ul{padding:0;list-style:none}
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible{outline:2px solid var(--coral);outline-offset:3px}
.skip-link{position:absolute;left:1rem;top:-5rem;z-index:30;padding:.8rem 1rem;background:var(--light-silver)}
.skip-link:focus{top:1rem}
.shell{width:min(100% - 5rem,1360px);margin-inline:auto}

/* Placeholder marker. CONTEGA-GAP: the system has no pattern for "to be confirmed" content. Remove before launch. */
.tbc{outline:1px dashed var(--coral);outline-offset:2px;border-radius:2px;background:rgba(255,90,79,.10)}

/* Functional icons: Lucide, 1.5px stroke */
.icon{width:20px;height:20px;flex:none;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}

/* ---------- SiteHeader (sticky, dark) ---------- */
.site-header{position:sticky;top:0;z-index:20;background:var(--dark-charcoal);color:var(--light-silver)}
.header-inner{min-height:var(--header-h);display:flex;align-items:center;justify-content:space-between;gap:2rem;border-bottom:1px solid var(--border-inverse)}
.brand{display:inline-flex;align-items:center;padding:8px 0}
/* contega wordmark: 240px (shield ~44px, so the 132px header keeps X clear space above and below).
   Compacts to 160px in an 88px header once scrolled, still keeping X. */
.brand-wordmark{display:block;width:240px;height:auto;transition:width var(--motion-base) ease}
.header-inner{transition:min-height var(--motion-base) ease}
.site-header.is-compact .header-inner{min-height:var(--header-h-compact)}
.site-header.is-compact .brand-wordmark{width:160px}
/* In-page nav (standalone franchise page only) */
.site-header nav:not(.site-nav){display:flex;gap:2.5rem;font-size:15px}
.site-header nav:not(.site-nav) a{text-decoration:none;border-bottom:1px solid transparent;padding:1rem 0;transition:border-color var(--motion-fast) ease}
.site-header nav:not(.site-nav) a:hover{border-bottom-color:var(--silver)}
/* Site nav: Solutions (dropdown), How we work, Talk to us (button). Current page gets the Clay underline. */
.site-nav{position:static;display:flex;align-items:center;gap:2.5rem;font-size:15px}
.nav-menu{display:flex;align-items:center;gap:2.5rem}
.nav-menu>li{position:relative}
.nav-menu a,.nav-drop-btn{display:inline-flex;align-items:center;gap:6px;padding:1rem 0;border:0;border-bottom:1px solid transparent;background:none;color:inherit;font:inherit;text-decoration:none;cursor:pointer;transition:border-color var(--motion-fast) ease}
.nav-menu>li>a:hover,.nav-drop-btn:hover{border-bottom-color:var(--silver)}
.nav-menu>li>a[aria-current="page"],.nav-drop-btn.is-current{border-bottom-color:var(--clay);color:var(--white)}
.nav-chev{width:16px;height:16px;transition:transform var(--motion-fast) ease}
.nav-drop.is-open .nav-chev{transform:rotate(180deg)}
.nav-sub{display:none;position:absolute;top:100%;left:-20px;z-index:25;min-width:250px;padding:8px 0;background:var(--dark-charcoal);border:1px solid var(--border-inverse)}
.nav-drop.is-open .nav-sub{display:block}
.nav-sub a{display:flex;width:100%;padding:12px 20px;border-bottom:0}
.nav-sub a:hover{background:var(--warm-charcoal)}
.nav-sub a[aria-current="page"]{color:var(--white);box-shadow:inset 2px 0 0 var(--clay)}
.action-nav{min-height:44px;padding:0 20px;font-size:14px;white-space:nowrap}
@media(max-width:400px){.action-nav{padding:0 14px}.brand-wordmark,.site-header.is-compact .brand-wordmark{width:128px}}
.nav-toggle{display:none;width:44px;height:44px;align-items:center;justify-content:center;border:1px solid var(--border-inverse);border-radius:var(--radius-pill);background:none;color:var(--light-silver);cursor:pointer}
.nav-toggle .icon-close,.nav-toggle[aria-expanded="true"] .icon-menu{display:none}
.nav-toggle[aria-expanded="true"] .icon-close{display:block}
/* Dropdown opens on click only (hover-open made the click appear to do nothing) */
@media(max-width:800px){
 .site-nav{gap:12px}
 .nav-toggle{display:inline-flex}
 .nav-menu{display:none;position:absolute;top:100%;left:0;right:0;flex-direction:column;align-items:stretch;gap:0;padding:8px 1.25rem 20px;background:var(--dark-charcoal);border-top:1px solid var(--border-inverse);border-bottom:1px solid var(--border-inverse)}
 .nav-menu.is-open{display:flex}
 .nav-menu>li{border-bottom:1px solid var(--border-inverse)}
 .nav-menu>li:last-child{border-bottom:0}
 .nav-menu a,.nav-drop-btn{width:100%;justify-content:space-between;padding:16px 0;font-size:17px;border-bottom:0}
 .nav-menu>li>a[aria-current="page"],.nav-drop-btn.is-current{color:var(--clay)}
 .nav-sub{position:static;min-width:0;padding:0 0 12px;border:0}
 .nav-sub a{padding:10px 16px;font-size:16px}
}

/* ---------- Hero ---------- */
.hero{background:var(--dark-charcoal);color:var(--light-silver)}
.hero-inner{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:clamp(2rem,5vw,5rem);min-height:max(620px,min(calc(100svh - 132px),880px));padding-block:4.5rem}
.hero-copy{max-width:820px}
/* The shield sits whole inside the content grid, centred on the copy. Pause control sits underneath. */
.hero-art{position:relative;justify-self:end;width:min(42vw,600px,calc((100svh - 300px) * 1.307));min-width:340px} /* landscape frame (D-55) */
.hero-frame{display:block;width:100%;height:auto;aspect-ratio:549.72/420.6}
/* Pause control sits inside the lower-right block of the frame */
.hero-art .motion-toggle{position:absolute;right:3%;bottom:4%;background:rgba(44,45,44,.55);border-color:rgba(246,248,248,.6);backdrop-filter:blur(4px)}
.slide{opacity:0;transition:opacity 1400ms ease-in-out}
.slide.is-active{opacity:1}
.motion-toggle{width:40px;height:40px;border-radius:var(--radius-pill);display:inline-flex;align-items:center;justify-content:center;background:var(--dark-charcoal);border:1px solid rgba(246,248,248,.28);color:var(--light-silver);cursor:pointer;transition:border-color var(--motion-fast) ease}
.motion-toggle:hover{border-color:var(--clay)}
.motion-toggle .icon{width:16px;height:16px}
.motion-toggle .icon-play,.motion-toggle[aria-pressed="true"] .icon-pause{display:none}
.motion-toggle[aria-pressed="true"] .icon-play{display:block}

/* Eyebrow */
.eyebrow{font-size:12px;line-height:1.2;font-weight:600;letter-spacing:.12em;text-transform:uppercase}
.hero .eyebrow{color:var(--clay);margin-bottom:2.5rem}
.eyebrow-light{color:var(--clay);margin-bottom:1.5rem} /* decorative label: Clay by brand-owner decision */
.eyebrow-dark{color:var(--clay);margin-bottom:1.5rem}
.group-label{font-size:12px;line-height:1.2;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--text-secondary);margin-bottom:1rem}

/* Display: Inter statement with Manuale Italic on the emphasised word (landing template) */
h1{font-family:var(--font-utility);font-weight:400;font-size:clamp(3.1rem,5.2vw,5.5rem);line-height:.95;letter-spacing:-.055em;margin-bottom:2.2rem;text-wrap:balance}
@media(min-width:1024px){.h1-line{display:block;white-space:nowrap}}
h1 em{font-family:var(--font-display);font-style:italic;font-weight:400;font-size:1.046em;letter-spacing:-.035em}
.hero-lede{font-size:clamp(1.1rem,1.5vw,1.3rem);line-height:1.55;max-width:600px;color:var(--silver);margin-bottom:2.6rem}
h2{font-family:var(--font-display);font-weight:300;font-size:clamp(2.75rem,4.8vw,4rem);line-height:.95;letter-spacing:-.045em;text-wrap:balance}
h3{font-family:var(--font-display);font-weight:400;font-size:32px;line-height:1.08;letter-spacing:-.025em}

/* Actions */
.actions{display:flex;flex-wrap:wrap;align-items:center;gap:1rem 2rem}
.action{display:inline-flex;align-items:center;gap:.75rem;min-height:56px;padding:0 24px;border-radius:var(--radius-pill);font:inherit;font-size:15px;font-weight:600;line-height:1.2;text-decoration:none;border:1px solid transparent;cursor:pointer;transition:background-color var(--motion-fast) ease,border-color var(--motion-fast) ease,color var(--motion-fast) ease}
.action-accent{background:var(--coral);color:var(--dark-teal)}
.action-accent:hover{background:var(--clay)}
.action-primary{min-height:48px;padding:0 20px;background:var(--dark-charcoal);color:var(--white)}
.action-primary:hover{background:var(--steel)}
.text-link{display:inline-flex;align-items:center;gap:.5rem;width:fit-content;font-size:15px;font-weight:600;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:4px;border-radius:var(--radius-indicator)}
.text-link:hover{text-decoration-thickness:2px}
.text-link .icon{width:16px;height:16px}

/* ---------- Section ---------- */
.section{padding:96px 0}
.section-canvas{background:var(--light-silver)}
.section-subtle{background:var(--mid-silver)}
.section-dark{background:var(--dark-charcoal);color:var(--light-silver)}
.section-head{max-width:900px;margin-bottom:64px}
.section-lede{font-size:clamp(1.1rem,1.5vw,1.3rem);line-height:1.55;max-width:720px;margin-top:1.75rem}

/* PillarGrid (default) */
.pillar-grid{display:grid;grid-template-columns:repeat(3,1fr);border-left:1px solid var(--border-default);border-top:1px solid var(--border-default)}
.pillar-grid li{display:flex;flex-direction:column;min-height:300px;padding:32px;background:var(--white);border-right:1px solid var(--border-default);border-bottom:1px solid var(--border-default)}
.numeral{font-size:12px;line-height:1.2;font-weight:600;letter-spacing:.12em;font-variant-numeric:tabular-nums}
/* Numerals are decorative (aria-hidden): Clay, as in the system */
.pillar-grid .numeral{color:var(--clay)}
.card-top{display:flex;align-items:center;justify-content:space-between}
.pillar-mark{width:40px;height:40px;fill:var(--clay);opacity:.5} /* PillarGrid mark-shield */
.pillar-grid h3{margin-top:auto;padding-top:96px;margin-bottom:16px}
.pillar-grid p{font-size:15px;line-height:1.45;color:var(--text-secondary);max-width:65ch}

/* Approach flow (AdvisoryProcess, connected). Shield icons at a size where the linework reads,
   joined by a 1.5px Clay dashed connector with a Lucide chevron at its midpoint. */
.flow{--icon-w:118px;--icon-h:144px;--conn-gap:28px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin-top:24px}
.flow-step{position:relative;display:flex;flex-direction:column;align-items:center;text-align:center;padding:0 16px}
.flow-icon{width:var(--icon-w);height:var(--icon-h);margin-bottom:40px}
.flow-step h3{margin-bottom:14px}
.flow-step p{font-size:17px;line-height:1.55;color:var(--text-secondary);max-width:28ch}
.flow-connector{position:absolute;top:calc(var(--icon-h) / 2);left:calc(50% + var(--icon-w) / 2 + var(--conn-gap));right:calc(-50% + var(--icon-w) / 2 + var(--conn-gap));height:1.5px;
  background:repeating-linear-gradient(90deg,var(--clay) 0 8px,transparent 8px 16px);display:flex;align-items:center;justify-content:center}
.flow-connector .icon{width:20px;height:20px;color:var(--clay);background:var(--mid-silver);padding:0 4px;box-sizing:content-box}
.section-canvas .flow-connector .icon{background:var(--light-silver)}

/* Statement (statement-lg): Inter with Manuale Italic on the emphasised words */
/* HeroBand art: a large tonal shield bleeding off the edge, decorative only */
.band-art{position:absolute;top:50%;right:0;height:165%;width:auto;aspect-ratio:1;transform:translate(22%,-50%);pointer-events:none}
.statement-band .band-art{height:270%;transform:translate(12%,-46%);fill:var(--brick);opacity:.13}
/* Clay band (Section tone clay). Dark Charcoal on Clay is 5.3:1. */
.statement-band{position:relative;overflow:hidden;background:var(--clay);color:var(--dark-charcoal);padding:160px 0}
.statement-inner{position:relative;z-index:1}
.statement{font-family:var(--font-utility);font-weight:400;font-size:clamp(2.4rem,4.2vw,3.25rem);line-height:.95;letter-spacing:-.055em;max-width:1024px;text-wrap:balance}
.statement em{font-family:var(--font-display);font-style:italic;font-weight:400;font-size:1.046em;letter-spacing:-.035em}

/* ---------- Meet Gareth ---------- */
.gareth-grid{display:grid;grid-template-columns:minmax(0,11fr) minmax(0,10fr);gap:clamp(3rem,6vw,6rem);align-items:center}
.section-dark{position:relative;overflow:hidden}
.gareth-grid{position:relative;z-index:1}
/* Steel shield on Dark Charcoal.
   The art column stretches to the copy's height. The composite is scaled so Gareth's photo
   (808 of the image's 1332 px height) equals that height, and anchored bottom-right to the end of the copy.
   The rest of the shield runs off the top and left, clipped by the section. */
.section-gareth{position:relative;overflow:hidden;background:var(--dark-charcoal);color:var(--light-silver)}
.section-gareth .gareth-grid{grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);align-items:center}
.gareth-art{margin:0}
/* Cut-out portrait (7 Oct): floats in the section, centred on the copy */
.section-gareth .gareth-grid{align-items:center}
.gareth-art{justify-self:center;width:min(100%,460px)}
.gareth-art img{display:block;width:100%;height:auto;aspect-ratio:1300/1496}
.section-gareth .gareth-copy{position:relative;z-index:1}
.gareth-copy h2{font-size:clamp(2.75rem,4.8vw,4rem);margin-bottom:1rem}
.gareth-role{font-size:17px;color:var(--silver);margin-bottom:2rem}
.gareth-copy>p:not(.eyebrow):not(.gareth-role){font-size:17px;line-height:1.6;color:var(--silver);max-width:600px}
.gareth-copy>p+p{margin-top:1rem}
.gareth-copy .text-link{margin-top:.5rem}
/* Quote */
.quote{padding-left:24px;border-left:3px solid var(--coral);margin:2.5rem 0}
.quote blockquote p{font-family:var(--font-display);font-weight:300;font-size:32px;line-height:1.08;letter-spacing:-.025em}
.quote-dark blockquote p{color:var(--light-silver)}

/* ---------- Talk to us ---------- */
.talk-grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(2.5rem,6vw,6rem);align-items:start}
.talk-intro h2{margin-bottom:0}
.talk-details{display:grid;gap:20px;margin:40px 0 0}
.talk-details dt{font-size:12px;line-height:1.2;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--text-secondary);margin-bottom:6px}
.talk-details dd{margin:0;font-size:17px;line-height:1.5}
.talk-details address{font-style:normal}
.talk-details a{text-decoration:underline;text-decoration-color:var(--clay);text-underline-offset:4px}
.enquiry{background:var(--white);border:1px solid var(--border-default);padding:clamp(1.5rem,3.5vw,3rem)}

/* EnquiryForm */
.enquiry h3{margin-bottom:12px}
.enquiry-intro{font-size:15px;line-height:1.45;color:var(--text-secondary);margin-bottom:32px}
.enquiry-form{display:flex;flex-direction:column;gap:24px}
.form-pair{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.field{display:flex;flex-direction:column;gap:8px}
.field label{font-size:15px;line-height:1.2;font-weight:600}
.req{color:var(--brick)}
.opt{font-weight:400;color:var(--text-secondary)}
.hint{font-size:13px;line-height:1.45;color:var(--text-secondary);margin-top:-4px}
.field input,.field textarea{font:inherit;font-size:17px;color:var(--dark-charcoal);background:var(--white);border:1px solid var(--steel);border-radius:var(--radius-control);width:100%;transition:border-color var(--motion-fast) ease,box-shadow var(--motion-fast) ease}
.field input{height:48px;padding:0 16px}
.field textarea{min-height:158px;padding:12px 16px;resize:vertical;line-height:1.5}
.field input:hover,.field textarea:hover{border-color:var(--dark-charcoal)}
.field [aria-invalid="true"]{border-color:var(--brick);border-width:2px}
.check{display:flex;gap:12px;align-items:flex-start}
.check input{flex:none;width:24px;height:24px;margin:0;accent-color:var(--dark-charcoal);border-radius:var(--radius-indicator)}
.check label{font-size:15px;line-height:1.45}
.enquiry-form .action{align-self:flex-start}
.form-status{font-size:15px;line-height:1.45;color:var(--brick)}
.form-status:empty{display:none}
.form-status.is-success{color:var(--dark-charcoal)}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}

/* ---------- Legal pages ---------- */
.legal{min-height:60vh}
.legal-title{font-family:var(--font-display);font-weight:300;font-size:clamp(2.75rem,4.8vw,4rem);line-height:.95;letter-spacing:-.045em}
.legal-meta{margin-top:1.25rem;font-size:15px;color:var(--text-secondary)}
/* Reading column: left-aligned text, centred on the page. Header and footer stay on the site grid. */
.legal .section-head{max-width:720px;margin-inline:auto}
.legal-body{max-width:720px;margin-inline:auto;display:grid;gap:1.25rem;font-size:17px;line-height:1.65}
.legal-body h2{font-size:28px;line-height:1.1;margin-top:1.75rem}
.legal-body h3{font-family:var(--font-utility);font-size:17px;font-weight:600;letter-spacing:0;margin-top:.5rem}
.legal-body ul{list-style:disc;padding-left:1.25rem;display:grid;gap:.4rem}
.legal-body a{text-underline-offset:3px}
/* Review markers for the legal drafts. Remove once approved. */
.legal-draft{padding:16px 20px;border-left:3px solid var(--coral);background:var(--white);font-size:15px;line-height:1.5}
.legal-note{padding:12px 16px;border:1px dashed var(--steel);background:var(--mid-silver);font-size:14px;line-height:1.5;color:var(--dark-charcoal)}
mark.tbc{color:inherit;background:rgba(255,90,79,.14);outline:1px dashed var(--coral);outline-offset:1px;border-radius:2px;padding:0 .15em}
.legal-q{display:inline;margin-left:.35em;font-size:13px;font-style:italic;color:var(--brick)}
.enquiry-form .check a{text-underline-offset:3px}


/* ---------- Solutions: real estate ---------- */
/* Where risk sits: three-column list (area / what can go wrong / how we advise). CONTEGA-GAP: no marketing table pattern in the system. */
/* One white panel: header row and body rows share the same grid and padding, so columns line up */
.risk-table{background:var(--white);border:1px solid var(--border-default)}
.risk-head{display:grid;grid-template-columns:1fr 1.4fr 1.4fr;gap:32px;padding:18px 32px;border-bottom:1px solid var(--steel);font-size:12px;line-height:1.2;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--text-secondary)}
.risk-row{display:grid;grid-template-columns:1fr 1.4fr 1.4fr;gap:32px;padding:28px 32px}
.risk-row+.risk-row{border-top:1px solid var(--border-default)}
.risk-area .numeral{display:block;color:var(--clay);margin-bottom:10px}
.risk-area h3{font-size:24px;line-height:1.15}
.risk-cell p{font-size:15px;line-height:1.55;color:var(--steel)}
.risk-cell .risk-label{display:none}
/* Franchise groups: illustrative white-label card */
.networks-grid{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(3rem,7vw,7rem);align-items:center}
.networks-grid h2{margin-bottom:1.5rem}
.networks-lede{font-size:clamp(1.05rem,1.4vw,1.2rem);line-height:1.6;color:var(--silver);max-width:560px}
.wl-card{margin:0;padding:32px;background:var(--light-silver);color:var(--dark-charcoal);border-radius:var(--radius-control)}
.wl-brand{display:flex;flex-direction:column;gap:4px;padding-bottom:20px;border-bottom:1px solid var(--border-default)}
.wl-name{font-family:var(--font-display);font-size:28px;line-height:1.1;letter-spacing:-.02em}
.wl-sub{font-size:13px;color:var(--text-secondary)}
.wl-list{display:grid;gap:12px;padding:20px 0}
.wl-list li,.checklist li{display:flex;gap:12px;align-items:flex-start;font-size:15px;line-height:1.5}
.wl-list .icon,.checklist .icon{width:18px;height:18px;margin-top:2px;color:var(--brick)}
.wl-powered{display:flex;align-items:center;gap:10px;padding-top:16px;border-top:1px solid var(--border-default);font-size:13px;color:var(--text-secondary)}
.wl-powered img{height:18px;width:auto}
.wl-caption{margin-top:16px;font-size:12px;color:var(--text-secondary)}
/* Start with a review */
.review-grid{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(3rem,7vw,7rem);align-items:start}
.review-grid h2{max-width:720px}
.review-list{margin-top:2.5rem;padding-top:2rem;border-top:1px solid var(--border-default)}
.enquiry-call{margin-top:20px;font-size:15px;color:var(--text-secondary)}
.enquiry-call a{color:var(--dark-charcoal);text-underline-offset:3px}
.checklist{display:grid;gap:14px}
.review-close{margin-top:28px;padding-top:24px;border-top:1px solid var(--border-default);font-family:var(--font-utility);font-size:26px;line-height:1.1;letter-spacing:-.04em}
.review-close em{font-family:var(--font-display);font-style:italic;font-size:1.046em;letter-spacing:-.03em}
@media(max-width:900px){
 .risk-head{display:none}
 .risk-row{grid-template-columns:1fr;gap:16px;padding:24px}
 .risk-cell .risk-label{display:block;font-size:12px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--text-secondary);margin-bottom:4px}
 .networks-grid,.review-grid{grid-template-columns:1fr}
}



/* Four-step flow (real estate page) */
.flow-4{--icon-w:98px;--icon-h:120px;--conn-gap:20px;grid-template-columns:repeat(4,minmax(0,1fr))}
.flow-4 .numeral{display:block;color:var(--clay);margin-bottom:8px}
.flow-4 .flow-step p{max-width:30ch}
@media(max-width:900px){.flow-4{grid-template-columns:1fr}}


/* ---------- Franchise groups (standalone page) ---------- */
.h1-long{font-size:clamp(2.6rem,4.4vw,4.4rem);line-height:1}
.fg-hero{grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr)}
.fg-panel{align-self:center;padding:32px;border:1px solid var(--border-inverse);background:var(--warm-charcoal, #30312F)}
.fg-panel-label{color:var(--clay);margin-bottom:8px}
.fg-list li{display:grid;grid-template-columns:28px 1fr;gap:12px;padding:20px 0;border-bottom:1px solid var(--border-inverse)}
.fg-list li:last-child{border-bottom:0;padding-bottom:0}
.fg-list .numeral{color:var(--clay);padding-top:6px}
.fg-list h3{font-size:22px;line-height:1.15;margin-bottom:6px}
.fg-list p{font-size:15px;line-height:1.5;color:var(--silver)}
.fg-shared-copy{max-width:760px;margin-top:40px;display:grid;gap:1rem;font-size:18px;line-height:1.6}
.pillar-grid-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.pillar-grid-2 li{min-height:240px}
.pillar-grid-2 h3{padding-top:56px}
.steps-4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px}
.steps-4 li{padding-top:20px;border-top:1px solid var(--steel)}
.steps-4 .numeral{display:block;color:var(--clay);margin-bottom:12px}
.steps-4 p{font-size:17px;line-height:1.55}
.fg-tech-list{display:grid;gap:14px;margin-top:2rem}
.fg-tech-list li{display:flex;gap:12px;align-items:flex-start;font-size:16px;line-height:1.55;color:var(--silver)}
.fg-tech-list strong{color:var(--light-silver);font-weight:600}
.fg-tech-list .icon{width:18px;height:18px;margin-top:3px;color:var(--clay)}
@media(max-width:1100px){.steps-4{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:900px){.fg-hero,.pillar-grid-2,.steps-4{grid-template-columns:1fr}.pillar-grid-2 li{min-height:0}.pillar-grid-2 h3{padding-top:0;margin-top:40px}}

/* ---------- A Cohabit Group company ---------- */
.group-band{background:var(--mid-silver);padding:72px 0}
.group-inner{display:grid;grid-template-columns:320px minmax(0,1fr);gap:clamp(2rem,5vw,4.5rem);align-items:center;max-width:1040px}
.group-logo{display:block;width:100%;max-width:320px;border:0;outline-offset:6px}
.group-logo img{display:block;width:100%;height:auto}
.group-copy h2{font-size:32px;line-height:1.08;letter-spacing:-.025em;font-weight:400;margin-bottom:12px}
.group-copy p{font-size:17px;line-height:1.6;color:var(--steel);max-width:640px;margin-bottom:16px}
.visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.footer-brand a{color:var(--light-silver);text-underline-offset:3px;text-decoration-color:var(--clay)}
.footer-social{display:inline-flex;align-items:center;gap:10px;margin-top:20px;font-size:15px;text-decoration:none}
.footer-social:hover span{text-decoration:underline}
.footer-social .icon{width:18px;height:18px;color:var(--clay)}
@media(max-width:800px){.group-band{padding:56px 0}.group-inner{grid-template-columns:1fr}.group-logo{max-width:260px}}

/* ---------- SiteFooter (dark) ---------- */
.site-footer{background:var(--dark-charcoal);color:var(--silver);padding:64px 0 48px}
.footer-top{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2fr);gap:48px}
.footer-brand img{width:240px;height:auto;margin-bottom:52px} /* two-tone lock-up at a size where "risk advisory" reads; X clear space below */
.footer-brand p{font-size:15px;line-height:1.45}
.footer-cols{display:grid;grid-template-columns:1.25fr .85fr .85fr 1.25fr;gap:32px}
.footer-licence p:not(.footer-heading){font-size:15px;line-height:1.55}
.footer-col{display:flex;flex-direction:column;gap:16px}
.footer-heading{font-size:12px;line-height:1.2;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--clay)}
.footer-col ul{display:flex;flex-direction:column;gap:12px}
.footer-col li{font-size:15px;line-height:1.45}
.footer-col a{text-decoration:none}
.footer-col a:hover{text-decoration:underline;text-underline-offset:3px}
.footer-base{margin-top:56px;padding-top:24px;border-top:1px solid var(--border-inverse);font-size:13px;line-height:1.45}

/* ---------- Responsive ---------- */
@media(max-width:1024px){
 .talk-grid,.gareth-grid{grid-template-columns:1fr}
 /* Stacked: Gareth first, his photo filling the art box, with the shield running off the top;
    the copy follows below, clear of the Steel shield */
 .section-gareth .gareth-grid{grid-template-columns:1fr;gap:40px}
 .section-gareth .gareth-copy{order:-1}
 .gareth-art{width:min(100%,360px)}
 .footer-top{grid-template-columns:1fr}
}
@media(max-width:900px){
 .hero-inner{grid-template-columns:1fr;min-height:0;padding-block:4rem 3rem;gap:3rem}
 .hero-copy{max-width:none}
 .hero-art{justify-self:center;width:min(100%,560px);min-width:0}
 .pillar-grid{grid-template-columns:1fr}
 .flow{--icon-w:92px;--icon-h:112px;grid-template-columns:1fr;row-gap:0}
 .flow-icon{margin-bottom:28px}
 .flow-connector{position:relative;top:auto;left:auto;right:auto;width:1.5px;height:88px;margin:32px auto;
   background:repeating-linear-gradient(180deg,var(--clay) 0 8px,transparent 8px 16px)}
 .flow-connector .icon{transform:rotate(90deg);padding:4px 0;flex:none}
 /* Stacked cards size to their content: no auto margin, no min-height, so nothing can clip */
 .pillar-grid li{min-height:auto;height:auto}
 .pillar-grid h3{padding-top:0;margin-top:40px}
 .statement-band{padding:96px 0}
 .statement-band .band-art{height:190%;transform:translate(30%,-50%)}
}
@media(max-width:800px){
 .shell{width:min(100% - 2.5rem,680px)}
 :root{--header-h:88px;--header-h-compact:72px}
 .brand-wordmark{width:160px}
 .site-header.is-compact .brand-wordmark{width:130px}
 .site-header nav:not(.site-nav){gap:1.2rem;font-size:14px}
 .section{padding:72px 0}
 .section-head{margin-bottom:48px}
 .footer-cols{grid-template-columns:1fr 1fr}
}
@media(max-width:560px){
 .shell{width:calc(100% - 2rem)}
 .site-header nav:not(.site-nav) a:not(:last-child){display:none}
 .hero .eyebrow{margin-bottom:1.8rem}
 h1{font-size:clamp(3rem,13vw,4.2rem)}
 .hero-lede{font-size:1.08rem}
 h2{font-size:2.6rem}
 .form-pair{grid-template-columns:1fr}
 .footer-cols{grid-template-columns:1fr}
}
/* ---------- v43: shared CTA card, contact page, Solutions strip, Corporate page ---------- */
/* CTA card (replaces the per-page forms; the one form lives on /contact/) */
.enquiry-cta .action{margin-top:0}
.action-lg{min-height:56px;padding:0 24px}
.section-head .section-lede+.section-lede{margin-top:1rem}

/* Contact page */
.page-hero{background:var(--dark-charcoal);color:var(--light-silver);padding:96px 0 80px}
.page-hero .eyebrow{color:var(--clay);margin-bottom:2rem}
.page-hero h1{font-size:clamp(3rem,5vw,5rem);margin-bottom:1.75rem}
.page-hero .hero-lede{margin-bottom:0}
.talk-details-first{margin-top:0}
.enquiry-title{font-family:var(--font-display);font-weight:400;font-size:32px;line-height:1.08;letter-spacing:-.025em;margin-bottom:12px}
.field select{font:inherit;font-size:17px;color:var(--dark-charcoal);height:48px;padding:0 44px 0 16px;width:100%;border:1px solid var(--steel);border-radius:var(--radius-control);appearance:none;-webkit-appearance:none;cursor:pointer;
  background:var(--white) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232C2D2C' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") no-repeat right 14px center/20px 20px}
.field select:hover{border-color:var(--dark-charcoal)}
select:focus-visible{outline:2px solid var(--coral);outline-offset:3px}

/* Homepage: Solutions strip */
.solution-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
.solution-card{display:flex;flex-direction:column;height:100%;min-height:320px;padding:40px;background:var(--white);border:1px solid var(--border-default);text-decoration:none;transition:border-color var(--motion-fast) ease}
.solution-card:hover{border-color:var(--steel)}
.solution-card h3{margin-top:auto;padding-top:72px;margin-bottom:14px}
.solution-card p{font-size:16px;line-height:1.55;color:var(--text-secondary);max-width:52ch;margin-bottom:28px}
.solution-card .text-link{text-decoration:underline;text-decoration-color:var(--clay)}
.solution-card:hover .text-link{text-decoration-thickness:2px}

/* Corporate: credentials strip */
.cred-strip{background:var(--warm-charcoal);color:var(--light-silver);border-top:1px solid var(--border-inverse)}
.cred-list{display:grid;grid-template-columns:repeat(4,minmax(0,1fr))}
.cred-list li{display:flex;gap:14px;align-items:flex-start;padding:30px 28px;font-size:15px;line-height:1.45;border-left:1px solid var(--border-inverse)}
.cred-list li:first-child{border-left:0;padding-left:0}
.cred-mark{width:20px;height:20px;flex:none;color:var(--clay);margin-top:1px}

/* Corporate: client segments (3 x 2) */
.segment-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-left:1px solid var(--border-default);border-top:1px solid var(--border-default)}
.segment-grid li{padding:32px;background:var(--white);border-right:1px solid var(--border-default);border-bottom:1px solid var(--border-default)}
.segment-grid .numeral{display:block;color:var(--clay);margin-bottom:40px}
.segment-grid h3{font-size:26px;line-height:1.1;margin-bottom:12px}
.segment-grid p{font-size:15px;line-height:1.5;color:var(--text-secondary)}
.segment-grid a{color:var(--dark-charcoal);text-underline-offset:3px;text-decoration-color:var(--clay)}

/* Corporate: statement band with supporting copy */
h2.statement{font-family:var(--font-utility);font-weight:400}
.statement-body{max-width:680px;margin-top:2.5rem;display:grid;gap:1rem;font-size:clamp(1.05rem,1.4vw,1.2rem);line-height:1.6}

/* Corporate: How we work, step rows shown in full (icon and title stay in view beside long copy) */
.step-rows{display:grid}
.step-row{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,7fr);gap:clamp(2rem,6vw,6rem);padding:56px 0;border-top:1px solid var(--silver)}
.step-row:last-child{padding-bottom:0}
.step-head{align-self:start;position:sticky;top:calc(var(--header-h-compact) + 32px)}
.step-icon{width:98px;height:120px;margin-bottom:28px}
.step-head .numeral{display:block;color:var(--clay);margin-bottom:10px;text-transform:uppercase}
.step-head h3{font-size:40px;margin-bottom:12px}
.step-sub{font-family:var(--font-display);font-weight:300;font-size:24px;line-height:1.2;letter-spacing:-.02em;color:var(--steel);max-width:22ch}
.step-body{display:grid;gap:1.25rem;font-size:17px;line-height:1.6;max-width:720px}
.def-list{display:grid;border-top:1px solid var(--border-default)}
.def-list li{padding:14px 0;border-bottom:1px solid var(--border-default);font-size:16px;line-height:1.55;color:var(--steel)}
.def-list strong{color:var(--dark-charcoal);font-weight:600}
.receive{margin-top:.5rem;padding:22px 26px;background:var(--white);border-left:3px solid var(--clay)}
.receive-label{font-size:12px;line-height:1.2;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--text-secondary);margin-bottom:8px}
.receive p:not(.receive-label){font-size:17px;line-height:1.55}

/* Corporate: What we place */
.cover-pair{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
.cover-card{padding:40px;background:var(--white);border:1px solid var(--border-default)}
.cover-card h3{margin:0 0 16px}
.cover-card p{font-size:16px;line-height:1.6;color:var(--text-secondary)}
.cover-diff{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,7fr);gap:clamp(2rem,5vw,5rem);margin:24px 0 72px;padding:48px 40px;background:var(--dark-charcoal);color:var(--light-silver)}
.cover-diff h3{color:var(--light-silver)}
.cover-diff p{font-size:17px;line-height:1.6;color:var(--silver)}
.cover-advice{margin-top:1.25rem;padding-top:1.25rem;border-top:1px solid var(--border-inverse)}
.cover-advice em{font-family:var(--font-display);font-style:italic;font-size:22px;line-height:1.3;color:var(--light-silver)}
.cover-list{background:var(--white);border:1px solid var(--border-default)}
.cover-list li{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,7fr);gap:32px;padding:26px 32px;align-items:baseline}
.cover-list li+li{border-top:1px solid var(--border-default)}
.cover-list h3{font-size:24px;line-height:1.15}
.cover-list p{font-size:16px;line-height:1.55;color:var(--steel)}

/* Corporate: Why Contega (eight points, dark) */
.why-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:clamp(2.5rem,6vw,6rem)}
.why-grid li{display:grid;grid-template-columns:40px 1fr;gap:12px;padding:28px 0;border-top:1px solid var(--border-inverse)}
.why-grid .numeral{color:var(--clay);padding-top:8px}
.why-grid h3{font-size:24px;line-height:1.15;margin-bottom:10px;color:var(--light-silver)}
.why-grid p{font-size:16px;line-height:1.6;color:var(--silver);max-width:52ch}

/* Corporate: stakeholders and claims, side by side */
.duo-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(3rem,7vw,7rem)}
.duo-item h2{font-size:clamp(2.2rem,3.4vw,3rem)}
.duo-item .section-lede{font-size:clamp(1.05rem,1.3vw,1.15rem)}

/* Corporate: closing */
.close-actions{margin-top:2.5rem}
.contact-card h3{margin-bottom:28px}
.contact-card .talk-details{margin-top:0}
.footer-disclosure{margin-top:40px;font-size:13px;line-height:1.5;max-width:900px}

@media(max-width:1100px){.cred-list{grid-template-columns:repeat(2,minmax(0,1fr))}.cred-list li:nth-child(3){border-left:0;padding-left:0}.cred-list li:nth-child(n+3){border-top:1px solid var(--border-inverse)}}
@media(max-width:1024px){.segment-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:900px){
 .solution-grid,.cover-pair,.why-grid,.duo-grid{grid-template-columns:1fr}
 .solution-card{min-height:0;padding:32px}.solution-card h3{padding-top:40px}
 .step-row,.cover-diff{grid-template-columns:1fr}
 .step-head{position:static}
 .step-row{gap:28px;padding:44px 0}
 .cover-diff{padding:32px 24px;gap:20px}
 .cover-list li{grid-template-columns:1fr;gap:8px;padding:22px 24px}
 .page-hero{padding:64px 0 56px}
}
@media(max-width:640px){
 .segment-grid,.cred-list{grid-template-columns:1fr}
 .cred-list li{border-left:0;padding:18px 0}
 .cred-list li+li{border-top:1px solid var(--border-inverse)}
 .cover-card{padding:28px}
}

/* ---------- v44: How we work page ---------- */
.flow-more{display:flex;justify-content:center;margin-top:56px}
.flow-more .text-link{text-decoration-color:var(--clay)}
.understand-grid{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:clamp(3rem,7vw,7rem);align-items:center}
.understand-grid .section-lede a{color:var(--dark-charcoal);text-underline-offset:4px;text-decoration-color:var(--clay)}
.flow-2{grid-template-columns:repeat(2,minmax(0,1fr));margin-top:0}
.flow-2 .flow-step h3{margin-bottom:0}
.section-head-icon{display:grid;grid-template-columns:80px minmax(0,1fr);gap:40px;align-items:start;max-width:980px}
.head-icon{width:80px;height:98px}
.six-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 clamp(2rem,4vw,4rem)}
.six-steps li{padding:28px 0 40px;border-top:1px solid var(--steel)}
.six-steps .numeral{display:block;color:var(--clay);margin-bottom:20px}
.six-steps h3{font-size:26px;line-height:1.1;margin-bottom:12px}
.six-steps p{font-size:16px;line-height:1.6;color:var(--steel)}
.receive-wide{margin-top:24px;max-width:900px}
.compare-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(3rem,7vw,7rem);align-items:start}
.compare-body{display:grid;gap:2rem;font-size:clamp(1.05rem,1.4vw,1.2rem);line-height:1.6;color:var(--silver);padding-top:2.6rem}
.receive-dark{background:var(--warm-charcoal);color:var(--light-silver)}
.receive-dark .receive-label{color:var(--clay)}
.eyebrow-band{color:var(--dark-charcoal);margin-bottom:1.5rem}
@media(min-width:1100px){.statement-one{max-width:none;white-space:nowrap;font-size:clamp(2.2rem,3.3vw,3.1rem)}}
.pillar-grid-4{grid-template-columns:repeat(4,minmax(0,1fr))}
.pillar-grid-4 h3{font-size:26px;line-height:1.1;padding-top:72px}
@media(max-width:1100px){.pillar-grid-4{grid-template-columns:repeat(2,minmax(0,1fr))}.six-steps{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:900px){.understand-grid,.compare-grid{grid-template-columns:1fr}.compare-body{padding-top:0}.flow-2{grid-template-columns:repeat(2,minmax(0,1fr))}.flow-2 .flow-connector{display:none}}
@media(max-width:640px){.pillar-grid-4,.six-steps{grid-template-columns:1fr}.section-head-icon{grid-template-columns:1fr;gap:24px}}

/* ---------- v46: one closing pattern, franchise link, band shield size ---------- */
/* Closing section on every page: copy and button left, Contact details card right */
.close-grid{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(3rem,7vw,7rem);align-items:start}
.close-grid h2{max-width:720px}
.close-grid .contact-card{margin-top:2.6rem}
@media(max-width:900px){.close-grid{grid-template-columns:1fr}.close-grid .contact-card{margin-top:0}}
/* Secondary button on dark */
.action-ghost{min-height:48px;padding:0 20px;background:transparent;color:var(--light-silver);border-color:rgba(246,248,248,.5)}
.action-ghost:hover{border-color:var(--clay);color:var(--white)}
.networks-actions{margin-top:2rem}
/* Clay band shield: capped, so taller bands (with supporting copy) match the homepage proportion */
.statement-band .band-art{height:min(270%,1150px)}
@media(max-width:900px){.statement-band .band-art{height:min(190%,720px)}}

/* ---------- How we work: one journey in four stages (v49) ---------- */
/* Each stage: sticky head (icon, number, name) on the left, as on the Corporate page; detail on the right.
   A Clay dashed rail runs down from icon to icon. */
.journey{position:relative;display:grid}
.j-stage{position:relative;display:grid;grid-template-columns:minmax(0,4fr) minmax(0,7fr);gap:clamp(2rem,6vw,6rem);padding:0 0 80px}
.j-stage::before{content:"";position:absolute;left:39px;top:112px;bottom:8px;width:1.5px;background:repeating-linear-gradient(180deg,var(--clay) 0 8px,transparent 8px 16px)}
.j-stage-last{padding-bottom:0}
.j-stage-last::before{display:none}
.j-head{align-self:start;position:sticky;top:calc(var(--header-h-compact) + 32px);display:grid;grid-template-columns:80px minmax(0,1fr);column-gap:28px;align-items:center}
.j-head .j-icon,.j-head .j-loop{grid-row:1 / span 2}
.j-icon{position:relative;z-index:1;width:80px;height:98px;background:var(--light-silver);box-shadow:0 0 0 8px var(--light-silver)}
.j-loop{position:relative;z-index:1;background:var(--light-silver);display:inline-flex;align-items:center;justify-content:center;width:72px;height:72px;margin:13px 4px;border:1.5px solid var(--clay);border-radius:50%;color:var(--clay)}
.j-loop .icon{width:28px;height:28px}
.j-head .numeral{align-self:end;color:var(--clay);margin-bottom:6px}
.j-head h3{align-self:start;font-size:clamp(2.2rem,3.4vw,2.9rem);line-height:1}
.j-body{max-width:760px}
/* First line of the right-hand copy sits on the bottom of the stage name (desktop) */
@media(min-width:901px){.j-body{padding-top:calc((98px - clamp(2.2rem,3.4vw,2.9rem) - 20px) / 2 + clamp(2.2rem,3.4vw,2.9rem) - 1.25 * clamp(1.35rem,2vw,1.6rem) + 16px)}}
.j-sub{font-family:var(--font-display);font-weight:300;font-size:clamp(1.35rem,2vw,1.6rem);line-height:1.25;letter-spacing:-.02em;color:var(--steel)}
.j-intro{margin-top:1.25rem;font-size:17px;line-height:1.6}
.j-steps{display:grid;margin:2rem 0 1.5rem;border-top:1px solid var(--border-default)}
.j-steps>li{display:grid;grid-template-columns:40px minmax(0,1fr);gap:16px;padding:22px 0;border-bottom:1px solid var(--border-default)}
.j-n{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:50%;background:var(--dark-charcoal);color:var(--light-silver);font-size:13px;font-weight:600}
.j-steps h4{font-family:var(--font-display);font-weight:400;font-size:22px;line-height:1.15;letter-spacing:-.015em;margin:2px 0 8px}
.j-steps p{font-size:16px;line-height:1.6;color:var(--steel)}
.j-callout{margin-top:18px;padding:26px 28px;background:var(--dark-charcoal)}
.j-steps .j-callout p{font-size:16px;line-height:1.6;color:var(--silver)}
.j-steps .j-callout .receive-label{font-size:12px;color:var(--clay)}
.j-steps .j-callout .j-callout-title{font-family:var(--font-display);font-weight:300;font-size:24px;line-height:1.2;letter-spacing:-.02em;color:var(--light-silver);margin-bottom:12px}
.j-steps .j-callout .j-callout-receive{margin-top:14px;padding-top:14px;border-top:1px solid var(--border-inverse);color:var(--light-silver)}
.j-callout-receive strong{color:var(--clay);font-weight:600}
.j-points{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 40px;margin-top:1.75rem;border-top:1px solid var(--border-default)}
.j-points li{padding:16px 0;border-bottom:1px solid var(--border-default);font-size:15px;line-height:1.55;color:var(--steel)}
.j-points strong{display:block;color:var(--dark-charcoal);font-weight:600;margin-bottom:2px}
@media(max-width:900px){
 /* Mobile: icon on the left, stage number and name beside it, detail below. No sticky. */
 .j-stage{grid-template-columns:1fr;gap:20px;padding:0 0 56px}
 .j-stage::before{left:25px;top:76px}
 .j-head{position:relative;top:auto;margin:0;padding:0;display:grid;grid-template-columns:52px minmax(0,1fr);column-gap:20px;align-items:center}
 .j-head .j-icon{position:static;grid-row:1 / span 2;width:52px;height:64px;box-shadow:0 0 0 6px var(--light-silver)}
 .j-head .numeral{align-self:end;margin-bottom:4px}
 .j-head h3{font-size:2rem}
 .j-body{padding-top:0;padding-left:72px}
 .j-sub{font-size:1.25rem}
 .j-points{grid-template-columns:1fr}
 .j-steps>li{grid-template-columns:32px minmax(0,1fr);gap:12px}
 .j-callout{padding:22px 20px}
}
@media(max-width:480px){.j-body{padding-left:0}.j-stage::before{bottom:auto;height:0}}

/* ---------- v49: one approach, four stages, on every page ---------- */
/* Stage label: number and stage name, used above sector headlines (Corporate, Real estate) */
.stage-label{font-size:12px;line-height:1.2;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--clay);margin-bottom:10px}
.stage-label span{color:var(--text-secondary);margin-right:6px}
.step-head h3{font-size:clamp(1.7rem,2.4vw,2.1rem);line-height:1.1;max-width:16ch}
.flow-step .stage-label{font-size:12px;line-height:1.2;color:var(--clay);max-width:none;margin-bottom:8px}
.flow-home{--icon-w:98px;--icon-h:120px}
.flow-more-left{justify-content:flex-start;margin-top:40px}
.j-pair{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;margin-top:2rem}
.j-block{padding:26px 28px;background:var(--white);border:1px solid var(--border-default)}
.j-block-icon{width:44px;height:54px;margin-bottom:16px}
.j-block h4{font-family:var(--font-display);font-weight:400;font-size:26px;line-height:1.1;letter-spacing:-.02em;margin-bottom:8px}
.j-block-lead{font-family:var(--font-display);font-weight:300;font-size:19px;line-height:1.3;color:var(--steel);margin-bottom:12px}
.j-block p:not(.j-block-lead){font-size:15px;line-height:1.6;color:var(--steel)}
@media(max-width:900px){.j-pair{grid-template-columns:1fr}}

/* Real estate: franchise summary panel */
.networks-grid .fg-list .fg-panel-label{font-size:11px;margin-bottom:6px}
.networks-grid .fg-list p:not(.fg-panel-label){font-size:15px;line-height:1.5;color:var(--silver)}

/* Four nav items: tighten spacing on narrower desktops */
@media(min-width:801px) and (max-width:1100px){.site-nav,.nav-menu{gap:1.5rem}.site-header .brand-wordmark{width:190px}}

/* ---------- v50: mobile tidy ---------- */
@media(max-width:900px){
 /* Corporate stage rows: small icon beside the stage label, headline below */
 .step-head{display:grid;grid-template-columns:52px minmax(0,1fr);column-gap:18px;align-items:center}
 .step-icon{grid-row:1;width:52px;height:64px;margin:0}
 .step-head .stage-label{grid-column:2;grid-row:1;margin:0}
 .step-head h3{grid-column:1 / -1;margin-top:18px;max-width:none}
 /* Four-stage flows (homepage, real estate, franchise): smaller icons and connectors when stacked */
 .flow-4{--icon-w:64px;--icon-h:78px}
 .flow-4 .flow-icon{margin-bottom:18px}
 .flow-4 .flow-connector{height:48px;margin:20px auto}
}
/* Contact page: form first when stacked */
@media(max-width:1024px){.talk-grid .enquiry{order:-1}}

/* ---------- v51: Join us ---------- */
.join-copy{max-width:880px}
.join-copy .section-lede{max-width:none}
.join-copy .section-lede:first-child{margin-top:0}
.close-grid .section-lede a{text-underline-offset:3px;text-decoration-color:var(--clay)}

/* ---------- v52: cover pages (Business insurance package) ---------- */
/* Split section: eyebrow and heading left, reading copy right */
.split{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,7fr);gap:clamp(2rem,6vw,6rem);align-items:start}
.split h2{font-size:clamp(2.2rem,3.4vw,3rem);line-height:1}
.split-body{display:grid;gap:1.1rem;font-size:17px;line-height:1.65;max-width:720px;padding-top:2.6rem}
.cover-card-dark{background:var(--dark-charcoal);border-color:var(--dark-charcoal);color:var(--light-silver)}
.cover-card .stage-label{margin-bottom:20px;color:var(--brick)}
.cover-card-dark .stage-label{color:var(--clay)}
.pkg-more{margin-top:28px;font-size:17px;line-height:1.6;max-width:760px}
.pkg-more a{color:var(--brick);text-underline-offset:3px}
.split-list{list-style:disc;padding-left:1.25rem;display:grid;gap:.35rem}
.pkg-pair .checklist li{font-size:17px}
.cover-card-dark .checklist .icon{color:var(--clay)}
.decision-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
.decision-grid h3{font-size:22px;line-height:1.15}
.decision-grid .numeral{margin-bottom:28px}
/* Solutions dropdown group labels */
.nav-sub-label{padding:12px 20px 4px;font-size:11px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--blue-grey,#9DA7B8)}
.nav-sub-label~.nav-sub-label{margin-top:6px;border-top:1px solid var(--border-inverse);padding-top:14px}
@media(max-width:1100px){.decision-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:900px){.split{grid-template-columns:1fr;gap:1rem}.split-body{padding-top:0}}
@media(max-width:640px){.decision-grid{grid-template-columns:1fr}}
@media(max-width:800px){.nav-sub-label{padding:10px 16px 2px}}

/* ---------- v53: motion (brand site, Motion section) ----------
   Tokens: 160ms feedback, 240ms reveal, 320ms closing beat. Plays once. Only active when JS adds .m-ready
   (never with reduced motion), so the page is complete without it. */
@keyframes m-rise{from{opacity:0;transform:translateY(.3em)}to{opacity:1;transform:none}}
@keyframes m-float{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@keyframes m-fade{from{opacity:0}to{opacity:1}}
@keyframes m-draw-x{from{clip-path:inset(-16px 100% -16px 0)}to{clip-path:inset(-16px 0 -16px 0)}}
@keyframes m-draw-y{from{clip-path:inset(0 -16px 100% -16px)}to{clip-path:inset(0 -16px 0 -16px)}}
@keyframes m-drop{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}

/* 1. Reveal: sections and grids settle in as they arrive */
.m-ready .m-reveal:not(.flow):not(.statement-band){opacity:0}
.m-ready .m-reveal.m-in:not(.flow):not(.statement-band){animation:m-float var(--motion-base) cubic-bezier(0,0,.2,1) both}
/* Card grids: children follow one another */
.m-ready :is(.pillar-grid,.segment-grid,.why-grid,.six-steps,.cover-pair,.cover-list).m-reveal{opacity:1}
.m-ready :is(.pillar-grid,.segment-grid,.why-grid,.six-steps,.cover-pair,.cover-list).m-reveal>*{opacity:0}
.m-ready :is(.pillar-grid,.segment-grid,.why-grid,.six-steps,.cover-pair,.cover-list).m-in>*{animation:m-float var(--motion-base) cubic-bezier(0,0,.2,1) both}
.m-ready .m-in>:nth-child(2){animation-delay:60ms}.m-ready .m-in>:nth-child(3){animation-delay:120ms}.m-ready .m-in>:nth-child(4){animation-delay:180ms}
.m-ready .m-in>:nth-child(5){animation-delay:240ms}.m-ready .m-in>:nth-child(6){animation-delay:300ms}.m-ready .m-in>:nth-child(7){animation-delay:360ms}.m-ready .m-in>:nth-child(8){animation-delay:420ms}.m-ready .m-in>:nth-child(9){animation-delay:480ms}

/* 3. The approach draws itself: each stage appears, then the Clay connector draws to the next */
.m-ready .flow.m-reveal .flow-step>:not(.flow-connector){opacity:0}
/* The connector line is 1.5px; the clip extends 16px past it so the chevron is never cut */
.m-ready .flow.m-reveal .flow-connector{clip-path:inset(-16px 100% -16px 0)}
.m-ready .flow.m-in .flow-step>:not(.flow-connector){animation:m-float var(--motion-base) cubic-bezier(0,0,.2,1) both;animation-delay:var(--m-d)}
.m-ready .flow.m-in .flow-connector{animation:m-draw-x var(--motion-slow) cubic-bezier(.2,0,0,1) both;animation-delay:calc(var(--m-d) + 160ms)}
@media(max-width:900px){
 .m-ready .flow.m-reveal .flow-connector{clip-path:inset(0 -16px 100% -16px)}
 .m-ready .flow.m-in .flow-connector{animation-name:m-draw-y}
}

/* 5. Statements land on the emphasis */
.m-ready .statement-band .m-w{display:inline-block;opacity:0}
.m-keep{white-space:nowrap}
.m-ready .statement-band.m-in .m-w{animation:m-rise var(--motion-slow) cubic-bezier(0,0,.2,1) both}
.m-ready .statement-band.m-in .m-em{animation-duration:480ms}

/* 7. Menus ease open */
.m-ready .nav-drop.is-open .nav-sub{animation:m-drop var(--motion-fast) cubic-bezier(0,0,.2,1) both}
@media(max-width:800px){.m-ready .nav-menu.is-open{animation:m-drop var(--motion-base) cubic-bezier(0,0,.2,1) both}}

/* 8. Arrows lean the way they point (feedback, 160ms) */
.m-lean-x,.m-lean-y,.m-lean-xy{transition:transform var(--motion-fast) cubic-bezier(.2,0,0,1)}
a:hover>.m-lean-x,a:focus-visible>.m-lean-x,a:hover .m-lean-x,button:hover .m-lean-x{transform:translateX(3px)}
a:hover .m-lean-y,a:focus-visible .m-lean-y{transform:translateY(3px)}
a:hover .m-lean-xy,a:focus-visible .m-lean-xy{transform:translate(2px,-2px)}
.solution-card:hover .m-lean-x{transform:translateX(3px)}

/* ---------- v56: cover pages ---------- */
.decision-grid.decision-grid-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.decision-grid.decision-grid-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.decision-grid h3 a{color:inherit;text-underline-offset:4px;text-decoration-color:var(--clay)}
.hero-lede.hero-lede-2{margin-top:-1.4rem}
.split-subhead{margin-top:.75rem;font-size:12px;line-height:1.2;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--brick)}
.exclusions .checklist{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:40px}
.exclusions .checklist a{color:var(--light-silver);text-underline-offset:3px;text-decoration-color:var(--clay)}
.cover-card-dark .checklist li{color:var(--light-silver)}
/* Inline prompt: a quiet nudge to talk to an adviser mid-page */
.inline-prompt{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px 28px;margin-top:40px;padding-top:28px;border-top:1px solid var(--border-default)}
.inline-prompt p{font-size:18px;line-height:1.5;max-width:52ch}
.action-secondary{min-height:48px;padding:0 20px;background:transparent;color:var(--dark-charcoal);border-color:var(--dark-charcoal)}
.action-secondary:hover{background:var(--dark-charcoal);color:var(--white)}
@media(max-width:1100px){.decision-grid.decision-grid-3{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:640px){.decision-grid.decision-grid-3,.decision-grid.decision-grid-2,.exclusions .checklist{grid-template-columns:1fr}}

/* ---------- v59: homepage Solutions, By cover links ---------- */
.cover-links-label{margin-top:48px}
.cover-links{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:24px;border-top:1px solid var(--border-default)}
.cover-links li{border-bottom:1px solid var(--border-default)}
.cover-links a{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:20px 4px;font-family:var(--font-display);font-size:22px;line-height:1.2;letter-spacing:-.015em;text-decoration:none;transition:color var(--motion-fast) ease}
.cover-links a .icon{width:18px;height:18px;flex:none;color:var(--clay);transition:transform var(--motion-fast) cubic-bezier(.2,0,0,1)}
.cover-links a:hover{color:var(--brick)}
.cover-links a:hover .icon,.cover-links a:focus-visible .icon{transform:translateX(3px)}
@media(max-width:900px){.cover-links{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:560px){.cover-links{grid-template-columns:1fr}.cover-links a{font-size:20px}}

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