/* Layout: 12-col editorial grid, max 1280px; copy-and-image splits instead of text over photos. Palette: white ground (light only), navy ink, lavender buttons, deep violet for small accents, blush for soft bands. */
:root{
  --canvas:#FFFFFF; --surface:#F6F8FD; --ink:#0F1B3D; --ink-2:#56617F;
  --accent:#3F37C9; --btn:#8EA7FF; --btn-hover:#7B95F7; --btn-ink:#0F1B3D; --tint:#FBE8E4; --tint-ink:#7A3B36; --hair:#E3E7F0;
  --chip:rgba(255,255,255,.94); --chip-ink:#0F1B3D; --focus:#3F37C9;
  --f-display:"Inter Tight","Neue Haas Grotesk Display","Helvetica Neue",Helvetica,Arial,system-ui,sans-serif;
  --f-body:"Inter","Helvetica Neue",Helvetica,Arial,system-ui,sans-serif;
  --gutter:clamp(20px,4vw,48px); --maxw:1280px; --r:10px;
  --t-hero:clamp(2.4rem,1.2rem + 5vw,4.75rem);
  --t-h2:clamp(1.85rem,1.25rem + 2.4vw,3.1rem);
  --t-h3:clamp(1.2rem,1.05rem + .5vw,1.45rem);
  --t-body:clamp(1rem,.96rem + .2vw,1.0625rem);
  --t-lead:clamp(1.1rem,1rem + .45vw,1.35rem);
  --t-label:.72rem;
  /* photography stand-ins: daylight colours, identical in both themes */
  --live-sky:#DCE7F7; --live-gr:#CFE2C8; --live-m:#FBFAF6; --live-m2:#C97A6E; --live-w:#AFC6EA; --live-t:#8CBC88; --live-p:#F3E7D4; --live-f:#26355F;
  --learn-sky:#E3ECFA; --learn-gr:#D3E4CC; --learn-m:#F4CBC3; --learn-m2:#B4706A; --learn-w:#FFFFFF; --learn-t:#84B781; --learn-f:#22305A;
  --bel-sky:#DCE8F8; --bel-gr:#BEDAB5; --bel-c:#E0907B; --bel-l:#FFFFFF; --bel-m:#FFFFFF; --bel-m2:#2B3F7A; --bel-w:#BBCFEF; --bel-t:#78AE7B; --bel-f:#1E2B52;
  --bld-sky:#E5EDF9; --bld-gr:#E6E1D5; --bld-m:#F7E8B2; --bld-m2:#3A4F8E; --bld-w:#FFF9E6; --bld-t:#8CBC88; --bld-f:#1E2B52;
  --own-sky:#F8E4DF; --own-m:#FCF7EF; --own-m2:#2347C8; --own-w:#FFE2A0; --own-f:#1E2B52; --own-gr:#EADCCB; --own-t:#86B783;
  --plate-dim:1;
  color-scheme:light;
}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{background:var(--canvas);color:var(--ink);font-family:var(--f-body);font-size:var(--t-body);line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden}
h1,h2,h3,h4{font-family:var(--f-display);font-weight:500;letter-spacing:-.022em;line-height:1.06;margin:0;text-wrap:balance;color:var(--ink)}
p{margin:0;max-width:62ch;text-wrap:pretty}
a{color:inherit}
:focus-visible{outline:2px solid var(--focus);outline-offset:3px;border-radius:4px}
.wrap{max-width:var(--maxw);margin-inline:auto;padding-inline:var(--gutter)}
.label{font-family:var(--f-body);font-size:var(--t-label);font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-2)}
.muted{color:var(--ink-2)}
.skip{position:absolute;left:-999px;top:8px;background:var(--surface);padding:8px 12px;z-index:100}
.skip:focus{left:12px}


/* header */
header.site{position:sticky;top:env(safe-area-inset-top,0px);z-index:50;background:color-mix(in srgb,var(--canvas) 92%,transparent);backdrop-filter:saturate(1.2) blur(10px);-webkit-backdrop-filter:saturate(1.2) blur(10px);border-bottom:1px solid var(--hair)}
.bar{display:flex;align-items:center;justify-content:space-between;gap:24px;height:68px}
.brand{display:inline-flex;align-items:center;gap:12px;text-decoration:none;font-family:var(--f-display);font-weight:600;letter-spacing:.24em;font-size:.95rem}
.brand svg{width:22px;height:22px;flex:none}
.brand .sq{fill:none;stroke:var(--ink);stroke-width:1.4}
.brand .sq.on{fill:var(--btn);stroke:var(--btn)}
nav.primary ul{display:flex;gap:4px;list-style:none;margin:0;padding:0}
nav.primary a{display:block;text-decoration:none;font-size:.9rem;padding:10px 12px;border-radius:8px;color:var(--ink-2);transition:color .18s,background-color .18s}
nav.primary a:hover{color:var(--ink)}
nav.primary a[aria-current="page"]{color:var(--ink)}
nav.primary a[aria-current="page"]::after{content:"";display:block;height:1px;background:var(--ink);margin-top:3px}
.menu-btn{display:none;align-items:center;gap:10px;background:none;border:1px solid var(--hair);color:var(--ink);font:500 .85rem var(--f-body);padding:10px 14px;border-radius:8px;cursor:pointer;min-height:44px}
.menu-btn .lines{width:16px;height:10px;position:relative}
.menu-btn .lines::before,.menu-btn .lines::after{content:"";position:absolute;left:0;right:0;height:1.5px;background:currentColor;transition:transform .2s}
.menu-btn .lines::before{top:1px}.menu-btn .lines::after{bottom:1px}
.menu-btn[aria-expanded="true"] .lines::before{transform:translateY(3.5px) rotate(45deg)}
.menu-btn[aria-expanded="true"] .lines::after{transform:translateY(-3.5px) rotate(-45deg)}
@media (max-width:900px){
  .menu-btn{display:inline-flex}
  nav.primary{position:absolute;left:0;right:0;top:100%;background:var(--canvas);border-bottom:1px solid var(--hair);display:none}
  nav.primary.open{display:block}
  nav.primary ul{flex-direction:column;gap:0;padding:8px var(--gutter) 20px}
  nav.primary a{font-family:var(--f-display);font-size:1.5rem;color:var(--ink);padding:14px 0;border-bottom:1px solid var(--hair);border-radius:0}
  nav.primary li:last-child a{border-bottom:0}
  nav.primary a[aria-current="page"]::after{display:none}
  nav.primary a[aria-current="page"]{color:var(--accent)}
}

/* buttons */
.actions{display:flex;flex-wrap:wrap;align-items:center;gap:14px 28px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:50px;padding:0 24px;border-radius:8px;background:var(--btn);color:var(--btn-ink);text-decoration:none;font:500 .95rem var(--f-body);border:0;cursor:pointer;transition:transform .18s,background-color .18s}
.btn:hover{background:var(--btn-hover)}
.btn:active{transform:translateY(1px)}
.btn .arr{transition:transform .18s}
.btn:hover .arr{transform:translateX(3px)}
.tlink{display:inline-flex;align-items:center;gap:8px;min-height:44px;font-weight:500;font-size:.95rem;text-decoration:none;color:var(--ink);border-bottom:1px solid var(--hair);transition:border-color .18s}
.tlink:hover{border-color:var(--ink)}

/* sections */
.page{animation:fade .22s ease-out}
@keyframes fade{from{opacity:.4}to{opacity:1}}
section{padding-block:clamp(64px,9vw,128px)}
section + section{border-top:1px solid var(--hair)}
section.band{background:var(--tint);border-top:0}
section.band + section{border-top:0}
.sec-head{display:grid;gap:18px;margin-bottom:clamp(36px,5vw,64px);max-width:760px}
.sec-head h2{font-size:var(--t-h2)}
.sec-head p{font-size:var(--t-lead);color:var(--ink-2);line-height:1.5}

/* hero */
.hero{padding-block:clamp(40px,7vw,96px) clamp(56px,8vw,112px);border-top:0}
.hero-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:clamp(28px,4vw,56px);align-items:center}
.hero-copy{grid-column:span 7;display:grid;gap:22px;min-width:0}
.hero-media{grid-column:span 5;min-width:0}
.hero h1{font-size:var(--t-hero);letter-spacing:-.032em;line-height:1.0}
.hero .sub{font-family:var(--f-display);font-size:clamp(1.25rem,1.05rem + .9vw,1.8rem);font-weight:400;letter-spacing:-.012em;line-height:1.25;color:var(--ink);text-wrap:balance}
.hero .body{color:var(--ink-2);max-width:48ch}
.hero .actions{margin-top:10px}
.br-d{display:inline}
@media (max-width:900px){
  .hero-copy,.hero-media{grid-column:1 / -1}
}
@media (max-width:360px){.br-d{display:none}}

.montage{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.montage .plate{aspect-ratio:4/5;border-radius:var(--r)}
.montage .plate .tag{position:absolute;left:10px;bottom:10px;background:var(--chip);color:var(--chip-ink);font-size:.66rem;font-weight:500;letter-spacing:.14em;padding:5px 8px;border-radius:5px}

/* plates (photography) */
.plate{position:relative;overflow:hidden;background:var(--hair);max-width:100%;filter:brightness(var(--plate-dim))}
.plate img{position:absolute;inset:0;width:100%;height:100%;display:block;object-fit:cover}
figure{margin:0}

/* pillars */
.pillars{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(20px,3vw,40px) clamp(20px,3vw,32px)}
.pillar{display:grid;gap:18px;min-width:0}
.pillar .plate{aspect-ratio:3/2;border-radius:var(--r)}
.pillar .meta{display:grid;grid-template-columns:auto 1fr;gap:4px 18px;align-items:baseline}
.pillar .meta .label{grid-row:span 2;color:var(--accent);font-size:.78rem;padding-top:4px;min-width:5.2em}
.pillar h3{font-size:var(--t-h3)}
.pillar p{color:var(--ink-2)}
@media (max-width:700px){
  .pillars{grid-template-columns:1fr;gap:44px}
  .pillar .plate{aspect-ratio:4/3}
  .pillar .meta{grid-template-columns:1fr}
  .pillar .meta .label{grid-row:auto;padding:0}
}

/* typographic trios */
.trio{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(28px,4vw,56px)}
.trio > div{display:grid;gap:12px;align-content:start;padding-top:22px;border-top:1px solid var(--ink);min-width:0}
.trio h3{font-size:var(--t-h3)}
.trio p{color:var(--ink-2)}
.trio.big h3{font-size:clamp(1.6rem,1.2rem + 1.4vw,2.3rem);letter-spacing:.02em;font-weight:500}
@media (max-width:800px){.trio{grid-template-columns:1fr;gap:36px}}

.split{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:clamp(28px,4vw,56px);align-items:start}
.split > .l{grid-column:span 5;min-width:0}
.split > .r{grid-column:7 / span 6;display:grid;gap:22px;min-width:0}
.split h2{font-size:var(--t-h2)}
.split .r p{font-size:var(--t-lead);line-height:1.55}
.split .r p + p{color:var(--ink-2);font-size:var(--t-body)}
@media (max-width:900px){.split > .l,.split > .r{grid-column:1 / -1}}

/* owner teaser */
.teaser{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:clamp(24px,4vw,56px);align-items:center}
.teaser .plate{grid-column:span 5;aspect-ratio:4/3;border-radius:var(--r)}
.teaser .copy{grid-column:7 / span 6;display:grid;gap:20px;min-width:0}
.teaser h2{font-size:var(--t-h2)}
.teaser p{color:var(--ink-2)}
@media (max-width:900px){.teaser .plate,.teaser .copy{grid-column:1 / -1}}

/* closing */
.closing{display:grid;gap:22px}
.closing h2{font-size:clamp(2.1rem,1.3rem + 3.4vw,4rem);letter-spacing:-.03em;max-width:16ch}
.closing .lead{font-size:var(--t-lead);color:var(--ink-2)}
.signature{font-family:var(--f-display);font-style:italic;font-weight:400;color:var(--ink);font-size:1.05rem;margin-top:20px;padding-top:24px;border-top:1px solid var(--hair);max-width:none}

/* inner-page hero */
.phero{padding-block:clamp(48px,8vw,112px) clamp(48px,7vw,96px);border-top:0}
.phero h1{font-size:clamp(2.3rem,1.3rem + 4vw,4.5rem);letter-spacing:-.03em;line-height:1.02;max-width:17ch}
.phero .intro{display:grid;gap:16px;margin-top:28px}
.phero .intro p{font-size:var(--t-lead);color:var(--ink-2);line-height:1.5}
.phero-split{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:clamp(28px,4vw,56px);align-items:center}
.phero-split .copy{grid-column:span 6;min-width:0;display:grid;gap:24px}
.phero-split .plate{grid-column:span 6;aspect-ratio:5/4;border-radius:var(--r)}
.phero-split h1{max-width:13ch}
@media (max-width:900px){.phero-split .copy,.phero-split .plate{grid-column:1 / -1}.phero-split .plate{aspect-ratio:4/3}}

/* partner structures list */
.rows{display:grid;border-top:1px solid var(--ink)}
.rows > div{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:12px 32px;padding-block:28px;border-bottom:1px solid var(--hair);align-items:baseline}
.rows h3{grid-column:span 5;font-size:var(--t-h3)}
.rows p{grid-column:6 / span 7;color:var(--ink-2)}
@media (max-width:760px){.rows h3,.rows p{grid-column:1 / -1}}

/* process */
.steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(24px,3vw,40px);counter-reset:s}
.steps li{list-style:none;display:grid;gap:12px;align-content:start;min-width:0}
.steps .n{font-family:var(--f-display);font-size:.85rem;color:var(--accent);letter-spacing:.08em;font-variant-numeric:tabular-nums;display:flex;align-items:center;gap:12px}
.steps .n::after{content:"";flex:1;height:1px;background:var(--hair)}
.steps h3{font-size:var(--t-h3)}
.steps p{color:var(--ink-2)}
.steps{padding:0;margin:0}
@media (max-width:800px){.steps{grid-template-columns:1fr;gap:32px}}

/* about */
.memoir{display:grid;gap:14px;margin-top:32px;max-width:60ch}
.memoir p{font-family:var(--f-display);font-size:clamp(1.2rem,1.05rem + .7vw,1.6rem);line-height:1.35;letter-spacing:-.01em;color:var(--ink)}
.memoir p.muted{color:var(--ink-2)}
.mv{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(28px,4vw,56px)}
.mv > div{display:grid;gap:16px;align-content:start;min-width:0}
.mv h2{font-size:clamp(1.5rem,1.2rem + 1.2vw,2.1rem)}
.mv p{font-family:var(--f-display);font-size:clamp(1.6rem,1.2rem + 1.6vw,2.5rem);line-height:1.15;letter-spacing:-.02em;text-wrap:balance;max-width:20ch}
@media (max-width:760px){.mv{grid-template-columns:1fr}}
.about-montage{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin-top:clamp(40px,6vw,72px)}
.about-montage .plate{aspect-ratio:3/4;border-radius:var(--r)}
@media (max-width:700px){.about-montage{grid-template-columns:1fr 1fr}}

/* contact */
.contact-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:clamp(28px,4vw,64px);align-items:start}
.contact-grid .intro{grid-column:span 5;display:grid;gap:22px;min-width:0}
.contact-grid .intro h1{font-size:clamp(2.3rem,1.3rem + 4vw,4.25rem);letter-spacing:-.03em;line-height:1.02}
.contact-grid .intro p{font-size:var(--t-lead);color:var(--ink-2);line-height:1.5}
.contact-grid .formwrap{grid-column:7 / span 6;min-width:0}
@media (max-width:900px){.contact-grid .intro,.contact-grid .formwrap{grid-column:1 / -1}}
form{display:grid;gap:22px;background:var(--surface);border:1px solid var(--hair);border-radius:12px;padding:clamp(20px,3vw,36px)}
.field{display:grid;gap:8px}
.field label,fieldset legend{font-size:.85rem;font-weight:500;color:var(--ink)}
.field .opt{color:var(--ink-2);font-weight:400}
input[type=text],input[type=email],textarea{width:100%;font:inherit;font-size:16px;color:var(--ink);background:var(--canvas);border:1px solid var(--hair);border-radius:8px;padding:13px 14px;min-height:50px;transition:border-color .18s}
textarea{min-height:140px;resize:vertical;line-height:1.5}
input:focus,textarea:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 22%,transparent)}
[aria-invalid="true"]{border-color:#B4483A !important}
.err{font-size:.8rem;color:#B4483A}
fieldset{border:0;padding:0;margin:0;display:grid;gap:10px}
.choices{display:grid;gap:8px}
.choice{position:relative}
.choice input{position:absolute;opacity:0;pointer-events:none}
.choice label{display:flex;align-items:center;gap:12px;min-height:52px;padding:12px 14px;border:1px solid var(--hair);border-radius:8px;background:var(--canvas);cursor:pointer;font-size:.95rem;transition:border-color .18s,background-color .18s}
.choice label::before{content:"";width:16px;height:16px;flex:none;border-radius:50%;border:1.5px solid var(--ink-2);background:var(--canvas);transition:box-shadow .18s,border-color .18s}
.choice input:checked + label{border-color:var(--accent);background:color-mix(in srgb,var(--accent) 7%,var(--canvas))}
.choice input:checked + label::before{border-color:var(--accent);box-shadow:inset 0 0 0 4px var(--canvas),inset 0 0 0 9px var(--accent)}
.choice input:focus-visible + label{outline:2px solid var(--focus);outline-offset:2px}
.micro{font-size:.8rem;color:var(--ink-2);line-height:1.5}
[hidden]{display:none!important}
.sent{display:grid;gap:14px;background:var(--surface);border:1px solid var(--hair);border-radius:12px;padding:clamp(24px,3vw,40px)}
.sent h2{font-size:var(--t-h3)}
.sent .note{font-size:.8rem;color:var(--ink-2);border-top:1px solid var(--hair);padding-top:14px}

/* legal */
.legal{max-width:760px;display:grid;gap:22px}
.legal h1{font-size:clamp(2rem,1.4rem + 2.5vw,3.25rem);letter-spacing:-.025em}
.legal blockquote{margin:0;padding:24px 0 0;border-top:1px solid var(--ink);font-size:var(--t-lead);line-height:1.55}
.legal .tbd{background:var(--tint);border-radius:8px;padding:16px 18px;color:var(--ink-2);font-size:.9rem}

/* legal long-form (from legal handoff; uses live theme tokens) */
.legal-section{padding-block:0;border-top:0;margin-top:.8rem;max-width:780px}
.legal-section h2{font-size:clamp(1.15rem,2vw,1.45rem);line-height:1.32;margin-bottom:.6rem}
.legal-section p{line-height:1.75;margin:0;overflow-wrap:anywhere}
.legal-date{font-size:.82rem;color:var(--ink-2);margin:0}
.legal-review-note{font-size:.9rem;background:var(--tint);color:var(--tint-ink);border-left:3px solid var(--tint-ink);border-radius:8px;padding:14px 16px;margin:0}

/* footer */
footer.site{border-top:1px solid var(--hair);padding-block:56px 40px}
.foot{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:32px}
.foot .id{grid-column:span 5;display:grid;gap:10px;align-content:start;min-width:0}
.foot .id p{color:var(--ink-2);font-size:.92rem}
.foot nav{grid-column:7 / span 6;min-width:0}
.foot ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:2px 24px}
.foot ul a{display:inline-block;text-decoration:none;color:var(--ink-2);font-size:.9rem;padding:7px 0}
.foot ul a:hover{color:var(--ink)}
.foot .base{grid-column:1 / -1;display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;padding-top:24px;border-top:1px solid var(--hair);font-size:.8rem;color:var(--ink-2)}
@media (max-width:760px){.foot .id,.foot nav{grid-column:1 / -1}}

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

/* image credits */
.legal-credits{padding-block:0 clamp(40px,6vw,72px)}
.legal-credits h2{font-size:1.1rem;margin:0 0 10px}
.legal-credits p,.legal-credits li{font-size:.85rem;color:var(--ink-2)}
.legal-credits ul{margin:8px 0 0;padding-left:1.1em;display:grid;gap:4px}
.legal-credits a{color:inherit;text-decoration:underline}

/* footer legal notice, enquiry-form status */
.foot .base .foot-notice{flex:1 1 100%;max-width:78ch;line-height:1.55}
.form-status{margin:0;font-size:.9rem;line-height:1.55;background:var(--tint);color:var(--tint-ink);border-left:3px solid var(--tint-ink);border-radius:8px;padding:14px 16px}
.btn[disabled]{opacity:.65;cursor:not-allowed}
.btn[disabled]:hover{background:var(--btn)}
.btn[disabled]:hover .arr{transform:none}
