/* =====================================================================
   Reef Stone Construction — stylesheet, rebuilt 23 Sep 2026.

   Built from two research passes (see the vault note "Website Research —
   what premium builders' sites do"): the premium 2026 look is restraint.
   One serif for display, one grotesk for everything else, warm neutrals,
   no shadows, no rounded corners, borderless tiles, big photographs with
   room around them, and motion that is CSS-only and switched off for
   anyone who asks for reduced motion.

   Brand colours per the Brand Guidelines: charcoal #2E2E2E, baby blue
   #A7D4F7 (the logo), warm white #FAFAF8, light grey #E5E7EA. Andy asked
   for a brighter blue on the site: #35A7F5 carries buttons (with charcoal
   text, 5.2:1) and large numerals; #0E8BE0 carries display accents and
   underlines where a blue has to read as text (3.5:1 at display sizes).
   ===================================================================== */

:root{
  color-scheme:light;
  /* colour */
  --charcoal:#2E2E2E;          /* ink */
  --ink:#232323;
  --graphite:#5A5A58;          /* secondary text */
  --paper:#FAFAF8;             /* page */
  --plaster:#F1EEE8;           /* alternate sections — warm, not grey */
  --stone:#FAFAF8;             /* legacy alias */
  --stone-alt:#F1EEE8;
  --white:#fff;
  --line:color-mix(in oklab, var(--charcoal) 12%, transparent);
  --line-strong:color-mix(in oklab, var(--charcoal) 22%, transparent);
  --sky:#A7D4F7;               /* the logo's blue — soft panels only */
  --coastal-lt:#A7D4F7;
  --blue:#A7D4F7;              /* the logo's blue — buttons (charcoal text, 8.7:1) */
  --blue-ink:#0A6FBF;
  --blue-hover:#8CC6F3;
  --blue-light:#35A7F5;        /* thin rules and the nav underline only */
  --sand:#0A6FBF;              /* legacy alias */
  --sand-dk:#085EA6;
  --coastal:#2E2E2E;           /* links are charcoal; the blue underlines */
  --dark:#1F1F1F;
  /* type scale — fluid, 360px → 1440px */
  --step--1:clamp(.885rem,.872rem + .06vw,.924rem);
  --step-0:clamp(1.1rem,1.05rem + .22vw,1.25rem);
  --step-1:clamp(1.275rem,1.191rem + .37vw,1.526rem);
  --step-2:clamp(1.53rem,1.386rem + .64vw,1.961rem);
  --step-3:clamp(1.836rem,1.608rem + 1.01vw,2.52rem);
  --step-4:clamp(2.203rem,1.858rem + 1.53vw,3.238rem);
  --step-5:clamp(2.644rem,2.138rem + 2.25vw,4.161rem);
  /* space */
  --gutter:clamp(1.25rem,.833rem + 1.85vw,2.5rem);
  --section-y:clamp(3.5rem,2.4rem + 4.9vw,7rem);
  --space-s:clamp(1rem,.938rem + .28vw,1.188rem);
  --space-m:clamp(1.5rem,1.396rem + .46vw,1.813rem);
  --space-l:clamp(2rem,1.875rem + .56vw,2.375rem);
  --space-xl:clamp(3rem,2.813rem + .83vw,3.563rem);
  --wrap:78rem;
  --wrap-text:44rem;
  --radius:0;
  /* motion */
  --ease-out-expo:cubic-bezier(.16,1,.3,1);
  --ease-out-soft:cubic-bezier(.23,1,.32,1);
  --dur-fast:160ms;--dur-base:280ms;
  --serif:"Instrument Serif",Georgia,"Times New Roman",serif;
  --sans:"Schibsted Grotesk",-apple-system,"Segoe UI",Helvetica,Arial,sans-serif;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;font-optical-sizing:auto;font-synthesis:none;-webkit-text-size-adjust:100%;scrollbar-gutter:stable}
body{
  margin:0;background:var(--paper);color:var(--charcoal);
  font-family:var(--sans);font-weight:400;font-size:var(--step-0);line-height:1.65;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;height:auto;display:block}
a{color:var(--coastal);text-decoration:underline;text-decoration-color:var(--blue);
  text-decoration-thickness:1px;text-underline-offset:.2em;
  transition:text-decoration-color var(--dur-fast) var(--ease-out-soft),color var(--dur-fast) var(--ease-out-soft)}
a:hover{text-decoration-thickness:2px;color:var(--ink)}
h1,h2,h3,h4{margin:0 0 .5em;color:var(--charcoal);text-wrap:balance}
h1,h2,.display{font-family:var(--sans);font-weight:600;letter-spacing:-.025em}
h1{font-size:var(--step-5);line-height:1.04}
h2{font-size:var(--step-3);line-height:1.1}
h3{font-family:var(--sans);font-weight:600;font-size:var(--step-1);line-height:1.2;letter-spacing:-.012em}
h4{font-family:var(--sans);font-weight:600;font-size:var(--step--1);letter-spacing:.1em;text-transform:uppercase}
p{margin:0 0 1.1em;text-wrap:pretty}
.wrap{width:min(100% - var(--gutter)*2,var(--wrap));margin-inline:auto}
.narrow{width:min(100% - var(--gutter)*2,var(--wrap-text))}
.skip{position:absolute;left:-9999px}
.skip:focus{left:1rem;top:1rem;z-index:99;background:var(--blue);color:var(--charcoal);padding:.6rem 1rem}
:focus-visible{outline:2px solid var(--blue-ink);outline-offset:3px}
[id]{scroll-margin-top:7rem}

/* ---------- buttons ---------- */
.btn{display:inline-flex;align-items:center;gap:.5em;min-height:2.9rem;padding:.8rem 1.5rem;
  border:1px solid transparent;border-radius:8px;font-family:var(--sans);font-weight:500;
  font-size:var(--step-0);letter-spacing:0;text-decoration:none;cursor:pointer;
  transition:background-color var(--dur-fast) var(--ease-out-soft),border-color var(--dur-fast) var(--ease-out-soft),color var(--dur-fast) var(--ease-out-soft)}
.btn:hover{text-decoration:none}
.btn:active{scale:.98}
.btn-gold{background:var(--blue);color:var(--charcoal);border-color:var(--blue)}
.btn-gold:hover{background:var(--blue-hover);border-color:var(--blue-hover);color:var(--charcoal)}
.btn-outline{background:transparent;color:var(--charcoal);border-color:var(--charcoal)}
.btn-outline:hover{background:var(--charcoal);color:#fff}
.btn-ghost{background:transparent;color:var(--charcoal);border-color:var(--line-strong)}
.btn-ghost:hover{border-color:var(--charcoal);color:var(--charcoal)}
.btn-dark{background:var(--charcoal);color:#fff;border-color:var(--charcoal)}
.btn-dark:hover{background:var(--ink);color:#fff}
.ic{width:20px;height:20px;flex:none}
.ic.sm{width:16px;height:16px}

/* ---------- header ---------- */
.site-header{background:var(--paper);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:40}
.topbar{border-bottom:1px solid var(--line)}
.topbar .wrap{display:flex;justify-content:flex-end;gap:1.6rem;padding:.45rem 0;
  font-size:var(--step--1);color:var(--graphite)}
.topbar a{color:var(--graphite);text-decoration:none;display:inline-flex;align-items:center;gap:.4rem}
.topbar a:hover{color:var(--charcoal)}
.topbar .ic{width:14px;height:14px;color:var(--blue-ink)}
.head-inner{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.8rem 0}
.brand{display:block;text-decoration:none}
.brand img{width:auto;height:134px}
.main-nav{display:flex;align-items:center;gap:1.6rem}
.main-nav > ul{list-style:none;display:flex;gap:1.5rem;margin:0;padding:0}
.main-nav > ul > li{position:relative}
.main-nav a{font-size:.98rem;font-weight:500;color:var(--charcoal);text-decoration:none;padding:.4rem 0;display:inline-block}
.main-nav a:hover{color:var(--blue-ink)}
.main-nav a[aria-current="page"]{position:relative}
.main-nav a[aria-current="page"]::after{content:"";position:absolute;left:0;right:0;bottom:-.1rem;height:2px;background:var(--sky)}
.nav-cta{padding:.65rem 1.15rem;font-size:.95rem;white-space:nowrap}
.main-nav .nav-cta,.main-nav .nav-cta:hover{color:var(--charcoal)}
.nav-toggle{display:none;background:none;border:0;padding:.5rem;cursor:pointer}
.nav-toggle span{display:block;width:24px;height:2px;background:var(--charcoal);margin:5px 0;transition:transform var(--dur-base) var(--ease-out-expo),opacity var(--dur-fast)}
.has-sub .submenu{display:none;position:absolute;left:-1rem;top:100%;background:var(--paper);border:1px solid var(--line);
  list-style:none;margin:0;padding:.5rem 0;min-width:17rem;z-index:50}
.has-sub:hover .submenu,.has-sub:focus-within .submenu{display:block}
.submenu a{display:block;padding:.45rem 1.1rem;font-weight:400;font-size:.93rem}
.submenu a:hover{background:var(--plaster);color:var(--charcoal)}

/* ---------- crumbs ---------- */
.crumbs{font-size:var(--step--1);color:var(--graphite);border-bottom:1px solid var(--line)}
.crumbs .wrap{padding:.7rem 0}
.crumbs a{color:var(--graphite);text-decoration:none}
.crumbs a:hover{color:var(--charcoal)}
.crumbs .sep{color:var(--line-strong);margin:0 .3rem}
.crumbs span[aria-current]{color:var(--charcoal)}

/* ---------- inner-page hero (light) ---------- */
.hero{background:var(--paper);padding:var(--space-xl) 0 var(--space-l);border-bottom:1px solid var(--line)}
.hero > .wrap{max-width:var(--wrap)}
.hero h1{max-width:20ch}
.kicker{font-family:var(--sans);font-size:.74rem;letter-spacing:.12em;text-transform:uppercase;
  color:var(--graphite);margin:0 0 1rem;font-weight:600}
.lead,.hero .lead,.post-body .lead{font-size:var(--step-1);line-height:1.4;letter-spacing:-.008em;color:var(--graphite);max-width:60ch}
.hero-actions{display:flex;flex-wrap:wrap;gap:.7rem;margin-top:var(--space-m)}
.hero.has-photo{background-size:cover;background-position:center;color:#fff}
.hero.has-photo h1,.hero.has-photo .lead{color:#fff}
.hero.has-photo .kicker{color:#fff}
.hero.has-photo .btn-ghost{border-color:#fff;color:#fff}

/* ---------- sections ---------- */
.section{padding:var(--section-y) 0}
.section.alt{background:var(--plaster)}
.section.dark{background:var(--dark);color:#E9E9E7}
.section.dark h2,.section.dark h3{color:#fff}
.eyebrow{font-size:.74rem;letter-spacing:.12em;text-transform:uppercase;color:var(--graphite);font-weight:600;margin:0 0 .8rem}
.display{font-size:var(--step-4);line-height:1.05;margin:.1rem 0 .7rem;max-width:22ch}
.section-lead{color:var(--graphite);max-width:60ch;margin-bottom:var(--space-l);font-size:var(--step-0)}
.two{display:grid;grid-template-columns:7fr 5fr;gap:var(--space-xl);align-items:start}
.two-wide{display:grid;grid-template-columns:7fr 5fr;gap:var(--space-xl);align-items:start}
.grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--gutter)}

/* tiles — borderless, whole tile is the link */
.card{display:block;background:transparent;border:0;border-top:1px solid var(--line-strong);padding:1.3rem 0 1.6rem;
  color:inherit;text-decoration:none;transition:opacity var(--dur-fast) var(--ease-out-soft)}
.card:hover{text-decoration:none}
.grid:has(.card:hover) .card:not(:hover){opacity:.55}
.card .ic{width:24px;height:24px;color:var(--blue-ink);margin-bottom:.9rem}
.card h3{margin:0 0 .45rem;font-size:var(--step-1)}
.card p{color:var(--graphite);font-size:var(--step-0);margin:0 0 .9rem}
.card .more{font-size:var(--step--1);font-weight:600;color:var(--charcoal);letter-spacing:.02em;position:relative;padding-right:1.2em}
.card .more::after{content:"";position:absolute;right:.2em;top:.45em;width:.5em;height:.5em;
  border-right:1.5px solid var(--blue-ink);border-top:1.5px solid var(--blue-ink);transform:rotate(45deg);
  transition:right var(--dur-fast) var(--ease-out-expo)}
.card:hover .more::after{right:0}
.card .tag{display:inline-block;font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;color:var(--graphite);font-weight:600;margin-bottom:.7rem}
.post h3{font-weight:600;font-size:var(--step-1);letter-spacing:-.015em}
.card.project img{width:100%;aspect-ratio:3/2;object-fit:cover;margin-bottom:.9rem}

.panel{background:var(--white);border:1px solid var(--line);padding:1.5rem 1.6rem}
.panel.dark{background:var(--dark);color:#E9E9E7;border-color:var(--dark)}
.panel.dark h3{color:#fff}
.panel h3{margin-bottom:.7rem}
.tick{list-style:none;padding:0;margin:0 0 1rem}
.tick li{position:relative;padding:.45rem 0 .45rem 1.7rem;border-bottom:1px solid var(--line)}
.tick li::before{content:"";position:absolute;left:.15rem;top:.95rem;width:.6rem;height:.35rem;
  border-left:2px solid var(--blue-ink);border-bottom:2px solid var(--blue-ink);transform:rotate(-45deg)}
.steps{list-style:none;padding:0;margin:0;counter-reset:s;display:grid;gap:0}
.steps li{counter-increment:s;position:relative;padding:1.1rem 0 1.1rem 3.4rem;border-top:1px solid var(--line)}
.steps li::before{content:counter(s,decimal-leading-zero);position:absolute;left:0;top:1.2rem;
  font-family:var(--sans);font-weight:600;font-size:var(--step-1);line-height:1;color:var(--sky);-webkit-text-stroke:.5px var(--charcoal);paint-order:stroke fill;letter-spacing:-.02em}
.steps h3{margin:0 0 .3rem;font-size:var(--step-0)}
.steps li p{margin:0;color:var(--graphite)}
.steps-list{counter-reset:s;list-style:none;padding:0;margin:0 0 1.6rem;max-width:var(--wrap-text)}
.steps-list li{counter-increment:s;position:relative;padding:.6rem 0 .6rem 3rem;border-top:1px solid var(--line)}
.steps-list li::before{content:counter(s,decimal-leading-zero);position:absolute;left:0;top:.6rem;font-family:var(--sans);font-weight:600;font-size:var(--step-0);color:var(--sky);-webkit-text-stroke:.5px var(--charcoal);paint-order:stroke fill}
.note{background:var(--plaster);border-left:2px solid var(--blue);padding:1rem 1.2rem;margin:1.4rem 0}
.note p:last-child{margin:0}
.source{font-size:var(--step--1);color:var(--graphite)}
.byline{font-size:var(--step--1);color:var(--graphite);letter-spacing:.02em}
.tiny{font-size:var(--step--1);color:var(--graphite)}
.mt{margin-top:1.6rem}

/* prose (advice articles) */
.post-body h1{max-width:18ch}
.prose{font-size:var(--step-0);line-height:1.7;max-width:68ch}
.prose h2{font-size:var(--step-3);margin:2.2rem 0 .8rem}
.prose h3{margin:1.6rem 0 .6rem}
.prose ul,.prose ol{padding-left:1.2rem}
.prose li{margin:.35rem 0}
.prose blockquote{margin:1.6rem 0;padding:.2rem 0 .2rem 1.2rem;border-left:2px solid var(--blue);color:var(--graphite);font-size:var(--step-1);font-weight:500}
.table-scroll{overflow-x:auto;margin:1.4rem 0}
.prose table{border-collapse:collapse;width:100%;font-size:var(--step--1)}
.prose th,.prose td{text-align:left;padding:.6rem .7rem;border-bottom:1px solid var(--line);vertical-align:top}
.prose th{font-weight:600}

/* FAQs */
.faqs{border-top:1px solid var(--line-strong)}
.faqs details{border-bottom:1px solid var(--line)}
.faqs summary{cursor:pointer;list-style:none;position:relative;padding:1rem 2.4rem 1rem 0;font-weight:500;font-size:var(--step-0)}
.faqs summary::-webkit-details-marker{display:none}
.faqs summary::after{content:"+";position:absolute;right:.2rem;top:.75rem;font-size:1.5rem;font-weight:300;color:var(--blue-ink);line-height:1;
  transition:transform var(--dur-base) var(--ease-out-expo)}
.faqs details[open] summary::after{transform:rotate(45deg)}
.faqs .ans{padding:0 0 1.2rem;color:var(--graphite);max-width:68ch}
.faqs .ans p:last-child{margin:0}

/* band (page-bottom call to action) */
.band{background:var(--dark);color:#E9E9E7;padding:var(--space-xl) 0}
.band h2{color:#fff;margin-bottom:.4rem}
.band p{color:#C9C9C6;max-width:52ch;margin:0}
.band-inner{display:flex;align-items:center;justify-content:space-between;gap:2rem;flex-wrap:wrap}
.band-actions{display:flex;gap:.7rem;flex-wrap:wrap}
.band .btn-ghost{border-color:rgba(255,255,255,.5);color:#fff}
.band .btn-ghost:hover{border-color:#fff}

/* form */
.form{display:grid;gap:1rem;max-width:36rem}
.field{display:grid;gap:.35rem}
.field label{font-size:var(--step--1);font-weight:600;letter-spacing:.02em}
.field input,.field select,.field textarea{font:inherit;padding:.8rem .9rem;border:1px solid var(--line-strong);border-radius:6px;
  background:var(--white);color:var(--charcoal);width:100%}
.field input:focus,.field select:focus,.field textarea:focus{outline:2px solid var(--blue-ink);outline-offset:1px;border-color:var(--blue-ink)}
.hp{position:absolute;left:-9999px}

/* ---------- footer ---------- */
.site-footer{background:var(--dark);color:#C9C9C6;padding:var(--space-xl) 0 var(--space-m);margin-top:0}
.foot-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:var(--space-xl)}
.foot-logo{width:min(260px,70%);height:auto;margin-bottom:1.1rem}
.foot-blurb{color:#B9B9B6;max-width:38ch;font-size:var(--step--1)}
.foot-contact{list-style:none;padding:0;margin:1rem 0 0;display:grid;gap:.5rem;font-size:var(--step--1)}
.foot-contact li{display:flex;align-items:center;gap:.55rem}
.site-footer .ic{width:15px;height:15px;color:var(--blue-light)}
.site-footer h4{color:#fff;margin-bottom:.8rem}
.foot-links{list-style:none;padding:0;margin:0;display:grid;gap:.4rem;font-size:var(--step--1)}
.site-footer a{color:#D9D9D6;text-decoration:none}
.site-footer a:hover{color:#fff;text-decoration:underline;text-decoration-color:var(--blue)}
.foot-base{margin-top:var(--space-l);padding-top:1rem;border-top:1px solid rgba(255,255,255,.12);
  display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap;font-size:var(--step--1);color:#9A9A97}
.foot-base p{margin:0}

/* ---------- floating WhatsApp (desktop) + sticky bar (mobile) ---------- */
.wa-float{position:fixed;right:1.2rem;bottom:1.2rem;z-index:50;display:inline-flex;align-items:center;gap:.5rem;
  background:var(--charcoal);color:#fff;padding:.75rem 1.05rem;font-weight:500;font-size:.92rem;text-decoration:none;
  border:1px solid transparent;border-radius:999px;transition:background-color var(--dur-fast) var(--ease-out-soft)}
.wa-float:hover{background:var(--ink);text-decoration:none;color:#fff}
.wa-float .ic{width:18px;height:18px;color:var(--blue-light)}
.mobile-bar{display:none}

/* ---------- photographs ---------- */
.photo-band{margin:0;overflow:clip;background:var(--plaster)}
.photo-band img{width:100%;height:auto;max-height:560px;object-fit:cover;display:block}
.photo-strip{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--gutter)}
.photo-strip img{width:100%;aspect-ratio:3/2;object-fit:cover}

/* ===================== home page ===================== */
.hero-split{background:var(--paper);padding:var(--space-xl) 0 var(--space-xl);border-bottom:1px solid var(--line)}
.hs-grid{display:grid;grid-template-columns:6fr 6fr;gap:var(--space-xl);align-items:center}
.hs-copy h1{font-size:var(--step-5);line-height:1.04;margin:.3rem 0 1rem;max-width:15ch}
.hs-copy h1 .accent{color:var(--sky);-webkit-text-stroke:.7px var(--charcoal);paint-order:stroke fill}
.hs-copy .lead{max-width:40ch}
.hs-copy .hero-actions{margin:var(--space-m) 0 var(--space-m)}
.hs-tags{list-style:none;display:flex;flex-wrap:wrap;gap:1.4rem;padding:0;margin:0;
  font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--graphite);font-weight:500}
.hs-photo{margin:0;overflow:clip;background:var(--plaster)}
.hs-photo img{width:100%;aspect-ratio:4/3;object-fit:cover;display:block}
.hs-photo figcaption{display:none}
.ribbon{background:var(--paper);border-bottom:1px solid var(--line);padding:.8rem 0}
.ribbon .wrap{display:flex;gap:1.4rem;align-items:center;justify-content:center;flex-wrap:wrap;
  font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;color:var(--graphite);font-weight:500}
.ribbon i{display:block;width:56px;height:1px;background:var(--sky)}
.num-cards{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--gutter);border-top:1px solid var(--line-strong)}
.num-card{display:block;padding:1.4rem 0 1.6rem;color:inherit;text-decoration:none;border-top:2px solid transparent;margin-top:-1px;
  transition:border-color var(--dur-base) var(--ease-out-expo)}
.num-card:hover{border-top-color:var(--sky);text-decoration:none}
.num-cards:has(.num-card:hover) .num-card:not(:hover){opacity:.6;transition:opacity var(--dur-fast)}
.num-card .num,.steps-5 .num{display:block;font-family:var(--sans);font-weight:600;font-size:var(--step-2);line-height:1;color:var(--sky);-webkit-text-stroke:.5px var(--charcoal);paint-order:stroke fill;letter-spacing:-.02em;margin-bottom:1.1rem}
.num-card h3{font-size:var(--step-1);margin:0 0 .45rem}
.num-card p{font-size:var(--step-0);color:var(--graphite);margin:0 0 1rem}
.num-card .more{font-size:var(--step--1);font-weight:600;color:var(--charcoal)}
.num-card.is-accent{background:transparent}
.stats{border-top:1px solid var(--line-strong)}
.stat-row{display:flex;align-items:baseline;gap:1.2rem;padding:1.4rem 0;border-bottom:1px solid var(--line)}
.stat-row:last-child{border-bottom:0}
.stat{font-family:var(--sans);font-weight:600;font-size:var(--step-4);line-height:1;color:var(--sky);-webkit-text-stroke:.7px var(--charcoal);paint-order:stroke fill;letter-spacing:-.03em;min-width:2.4ch}
.stat-label{font-size:.74rem;letter-spacing:.12em;text-transform:uppercase;color:var(--graphite);font-weight:600}
.arrow-link{font-weight:500}
.steps-5{display:grid;grid-template-columns:repeat(5,1fr);gap:var(--gutter);border-top:1px solid var(--line-strong)}
.steps-5 > div{padding:1.4rem 0 .6rem}
.steps-5 h3{font-size:var(--step-0);margin:0 0 .4rem}
.steps-5 p{font-size:var(--step--1);color:var(--graphite);margin:0}
.mosaic{display:grid;grid-template-columns:1.6fr 1fr;grid-template-rows:1fr 1fr;gap:var(--gutter)}
.mosaic img{width:100%;height:100%;object-fit:cover;display:block}
.mosaic .m-big{grid-row:span 2}
.mosaic img:not(.m-big){aspect-ratio:3/2}
.cta-band{background:var(--dark);color:#fff;padding:var(--space-xl) 0}
.cta-inner{display:flex;align-items:center;justify-content:space-between;gap:2rem;flex-wrap:wrap}
.cta-inner .eyebrow{color:var(--blue-light)}
.cta-inner .display{margin:0;color:#fff}
.cta-band .btn-dark{background:var(--blue);border-color:var(--blue);color:var(--charcoal)}
.cta-band .btn-dark:hover{background:var(--blue-hover);border-color:var(--blue-hover);color:var(--charcoal)}

/* who runs your job */
.team{display:grid;grid-template-columns:1fr;gap:0;border-top:1px solid var(--line-strong)}
.member{display:grid;grid-template-columns:300px 1fr;gap:clamp(1.5rem,3vw,3rem);align-items:start;padding:var(--space-l) 0;border-bottom:1px solid var(--line)}
.member:last-child{border-bottom:0}
.member-text{max-width:60ch}
.member-photo{width:100%;max-width:300px;aspect-ratio:1;object-fit:cover;margin:0;filter:none}
.member h3{margin:0 0 .15rem;font-weight:600;font-size:var(--step-2)}
.member .role{font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--graphite);font-weight:600;margin:0 0 .9rem}
.member p{font-size:var(--step-0);color:var(--graphite);margin:0;line-height:1.65}

/* ---------- motion: CSS only, scroll-driven, off for reduced motion ---------- */
@media (prefers-reduced-motion:no-preference){
  @supports (animation-timeline:view()){
    .num-card,.card,.member,.steps-5 > div,.mosaic img,.photo-strip img,.photo-band img,.stat-row{
      animation:rise linear both;animation-timeline:view();animation-range:entry 0% entry 55%}
    .num-card:nth-child(2),.steps-5 > div:nth-child(2),.card:nth-child(2){animation-range:entry 0% entry 65%}
    .num-card:nth-child(3),.steps-5 > div:nth-child(3),.card:nth-child(3){animation-range:entry 0% entry 75%}
    .num-card:nth-child(4),.steps-5 > div:nth-child(4){animation-range:entry 0% entry 85%}
  }
  @view-transition{navigation:auto}
  ::view-transition-group(*){animation-duration:260ms;animation-timing-function:var(--ease-out-soft)}
}
@keyframes rise{from{opacity:0;translate:0 20px}to{opacity:1;translate:0 0}}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .num-card,.card,.member,.steps-5 > div,.mosaic img,.photo-strip img,.photo-band img,.stat-row{animation:none;opacity:1;translate:none}
  ::view-transition-group(*){animation:none!important}
}

/* ---------- responsive ---------- */
@media (max-width:64em){
  .hs-grid,.two,.two-wide,.team{grid-template-columns:1fr}
  .hs-copy h1{max-width:16ch}
  .num-cards{grid-template-columns:1fr 1fr}
  .steps-5{grid-template-columns:1fr 1fr}
  .grid{grid-template-columns:1fr 1fr}
  .foot-grid{grid-template-columns:1fr 1fr}
  .mosaic{grid-template-columns:1fr;grid-template-rows:auto}
  .mosaic .m-big{grid-row:auto}
  .brand img{height:112px}
}
@media (max-width:48em){
  .member{grid-template-columns:1fr}
  .member-photo{max-width:220px}
  .topbar{display:none}
  .nav-toggle{display:block}
  .main-nav{position:fixed;inset:0;top:0;background:var(--paper);flex-direction:column;align-items:flex-start;
    justify-content:flex-start;padding:6.5rem var(--gutter) 2rem;gap:1.2rem;transform:translateX(100%);
    transition:transform var(--dur-base) var(--ease-out-expo);z-index:39;overflow:auto}
  .main-nav.open{transform:none}
  .main-nav > ul{flex-direction:column;gap:.2rem;width:100%}
  .main-nav a{font-size:var(--step-1);padding:.5rem 0;display:block}
  .has-sub .submenu{display:block;position:static;border:0;padding:.2rem 0 .6rem 1rem;min-width:0;background:transparent}
  .submenu a{font-size:var(--step-0)}
  .nav-cta{margin-top:.6rem}
  .site-header{z-index:41}
  .nav-toggle{position:relative;z-index:42}
  .num-cards,.steps-5,.grid,.foot-grid,.photo-strip{grid-template-columns:1fr}
  .band-inner,.cta-inner{flex-direction:column;align-items:flex-start}
  .brand img{height:112px}
  .wa-float{display:none}
  .mobile-bar{display:grid;grid-template-columns:1fr 1fr 1fr;position:fixed;left:0;right:0;bottom:0;z-index:50;
    background:var(--charcoal);border-top:1px solid rgba(255,255,255,.12)}
  .mobile-bar a{display:flex;align-items:center;justify-content:center;gap:.45rem;padding:.9rem .5rem;
    color:#fff;font-size:.9rem;font-weight:500;text-decoration:none;min-height:3rem}
  .mobile-bar a + a{border-left:1px solid rgba(255,255,255,.12)}
  .mobile-bar .ic{width:16px;height:16px;color:var(--blue-light)}
  body{padding-bottom:3.2rem}
}
@media (max-width:26em){.brand img{height:96px}}

/* ---------- photographs: one grade across a mixed set, roofline-safe crop ----------
   Third research pass (colour & imagery): a light, uniform grade converges phone
   shots and pro shots; object-position 50% 42% keeps rooflines in frame when a
   box gets squat. Scoped to photographs only — never the logo or icons. */
.hs-photo img,.mosaic img,.photo-strip img,.photo-band img,.card.project img{
  filter:saturate(.9) contrast(1.05);object-position:var(--focus,50% 42%)}

/* ===================== home page — editorial redesign (23 Sep 2026) =====================
   Scoped to .home so nothing below touches the other 26 pages until the homepage is
   approved. Andy's brief: bright, modern, premium, architectural, Caribbean; photography
   dominant; asymmetric editorial layouts; baby blue as a restrained accent; a stronger
   blue (#69B5ED) for calls to action only; hairlines and crops instead of boxes. */
.home .btn-gold{background:#69B5ED;border-color:#69B5ED;color:var(--charcoal)}
.home .btn-gold:hover{background:#57A9E6;border-color:#57A9E6;color:var(--charcoal)}
.home h1,.home .display{font-weight:500;letter-spacing:-.03em}
.home .display{max-width:16ch;margin-bottom:.6rem}
.home .section-lead{margin-bottom:var(--space-m)}
.home .more{font-size:var(--step--1);font-weight:600;color:var(--charcoal);letter-spacing:.02em;position:relative;padding-right:1.2em}
.home .more::after{content:"";position:absolute;right:.2em;top:.45em;width:.5em;height:.5em;
  border-right:1.5px solid var(--blue-ink);border-top:1.5px solid var(--blue-ink);transform:rotate(45deg);
  transition:right var(--dur-fast) var(--ease-out-expo)}
.home a:hover .more::after{right:0}
.sec-head{display:flex;justify-content:space-between;align-items:flex-end;gap:2rem;flex-wrap:wrap;margin-bottom:var(--space-l)}
.sec-head .display{margin-bottom:0}
.sec-head .arrow-link{margin-bottom:.35rem;white-space:nowrap}

/* hero: full-bleed photograph, copy panel rising over its bottom-left corner */
.hero-ed{background:var(--paper)}
.hero-ed-photo{margin:0;height:clamp(28rem,74vh,48rem);overflow:clip;background:var(--plaster)}
.hero-ed-photo img{width:100%;height:100%;object-fit:cover;object-position:58% 62%}
.hero-ed-panel{position:relative;z-index:1;background:var(--paper);max-width:37rem;
  margin-top:clamp(-11rem,-15vw,-7rem);padding:clamp(1.6rem,2.6vw,2.4rem) clamp(1.6rem,3vw,3rem) 0 0}
.hero-ed-panel::before{content:"";display:block;width:3.5rem;height:2px;background:var(--sky);margin-bottom:1.3rem}
.hero-ed-panel .kicker{margin-bottom:.8rem}
.hero-ed-panel h1{font-size:var(--step-5);line-height:1.02;max-width:13ch;margin:0 0 .9rem}
.hero-ed-panel .lead{max-width:34ch;font-size:var(--step-1)}
.hero-ed-panel .hero-actions{margin-top:var(--space-m)}

/* statement */
.intro-ed{padding:calc(var(--section-y)*.8) 0;border-bottom:1px solid var(--line)}
.intro-grid{display:grid;grid-template-columns:3fr 9fr;gap:var(--space-l);align-items:start}
.intro-grid .eyebrow{margin-top:.5rem}
.statement{font-size:var(--step-2);line-height:1.3;letter-spacing:-.015em;max-width:32ch;margin:0 0 1.5rem;font-weight:400}
.meta-line{list-style:none;padding:0;margin:0;display:flex;flex-wrap:wrap;gap:.6rem 2rem;font-size:var(--step--1);color:var(--graphite)}
.meta-line li{position:relative;padding-left:1rem}
.meta-line li::before{content:"";position:absolute;left:0;top:.55em;width:.4rem;height:.4rem;background:var(--sky);outline:1px solid var(--charcoal);outline-offset:-1px}
.meta-line a{color:inherit;text-decoration-color:var(--sky)}

/* services: one tall photographic tile, two horizontal ones */
.svc-grid{display:grid;grid-template-columns:7fr 5fr;grid-template-rows:auto auto;gap:var(--gutter) var(--space-xl)}
.svc{display:flex;flex-direction:column;color:inherit;text-decoration:none;min-width:0}
.svc:hover{text-decoration:none}
.svc img{width:100%;object-fit:cover;background:var(--plaster)}
.svc-lg{grid-row:span 2}
.svc-lg img{flex:1;min-height:0;aspect-ratio:auto;object-position:50% 45%}
.svc-sm{display:grid;grid-template-columns:1fr 1fr;gap:1.2rem;align-items:end}
.svc-sm img{aspect-ratio:4/3}
.svc-text{border-top:1px solid var(--line-strong);padding-top:1rem;margin-top:1.1rem}
.svc-sm .svc-text{margin-top:0}
.svc-n{display:block;font-size:.72rem;letter-spacing:.12em;color:var(--graphite);font-weight:600;margin-bottom:.5rem}
.svc h3{margin:0 0 .35rem;font-size:var(--step-2);font-weight:500;letter-spacing:-.02em}
.svc-sm h3{font-size:var(--step-1)}
.svc p{color:var(--graphite);margin:0 0 .7rem;font-size:var(--step-0)}
.svc-grid:has(.svc:hover) .svc:not(:hover){opacity:.6;transition:opacity var(--dur-fast)}
.svc-also{margin:var(--space-l) 0 0;padding-top:1rem;border-top:1px solid var(--line);color:var(--graphite);font-size:var(--step--1);max-width:72ch}
.svc-also a{color:var(--charcoal)}

/* full-width photograph with a one-line caption row */
.bleed{background:var(--plaster)}
.bleed > img{width:100%;height:clamp(20rem,64vh,40rem);object-fit:cover;object-position:50% 58%}
.bleed-row{display:flex;justify-content:space-between;align-items:baseline;gap:2rem;flex-wrap:wrap;padding:1rem 0 1.1rem;font-size:var(--step--1);color:var(--graphite)}
.bleed-row p{margin:0}

/* experience */
.exp-grid{display:grid;grid-template-columns:5fr 6fr;gap:var(--space-xl);align-items:center}
.exp-photo{margin:0}
.exp-photo img{width:100%;aspect-ratio:4/5;object-fit:cover;object-position:34% 50%}
.exp-copy p{max-width:52ch}
.hair-list{list-style:none;padding:0;margin:1.3rem 0 1.5rem;border-top:1px solid var(--line-strong);max-width:52ch}
.hair-list li{padding:.7rem 0;border-bottom:1px solid var(--line);color:var(--charcoal)}

/* process */
.process-grid{display:grid;grid-template-columns:5fr 7fr;gap:var(--space-xl);align-items:start}
.process{list-style:none;padding:0;margin:0;counter-reset:p;border-top:1px solid var(--line-strong)}
.process li{counter-increment:p;display:grid;grid-template-columns:3.4rem 1fr;gap:.15rem 1rem;padding:1.1rem 0;border-bottom:1px solid var(--line)}
.process li::before{content:counter(p,decimal-leading-zero);font-weight:500;font-size:var(--step-1);line-height:1.25;color:var(--sky);
  -webkit-text-stroke:.5px var(--charcoal);paint-order:stroke fill;letter-spacing:-.02em}
.process h3{grid-column:2;margin:0 0 .2rem;font-size:var(--step-0);font-weight:600}
.process p{grid-column:2;margin:0;color:var(--graphite)}

/* material detail strip: three crops, three shapes, bottom-aligned */
.detail-grid{display:grid;grid-template-columns:5fr 4fr 3fr;gap:var(--gutter);align-items:end}
.detail-grid img{width:100%;object-fit:cover;background:var(--plaster)}
.detail-grid img:nth-child(1){aspect-ratio:4/3;object-position:50% 60%}
.detail-grid img:nth-child(2){aspect-ratio:1/1}
.detail-grid img:nth-child(3){aspect-ratio:3/4;object-position:50% 40%}

/* questions + close */
.faq-grid{display:grid;grid-template-columns:4fr 8fr;gap:var(--space-xl);align-items:start}
.faq-ed{border-top:1px solid var(--line)}
.close-ed{background:var(--plaster);border-top:1px solid var(--line);padding:var(--section-y) 0}
.close-grid{display:grid;grid-template-columns:7fr 5fr;gap:var(--space-xl);align-items:center}
.close-grid .section-lead{margin-bottom:0}
.close-actions{display:flex;flex-direction:column;gap:.7rem;align-items:flex-start;justify-self:end}
.close-actions .btn{min-width:16rem;justify-content:center}

/* photographs on the home page take the same light grade as the rest of the site */
.hero-ed-photo img,.svc img,.bleed > img,.exp-photo img,.detail-grid img{filter:saturate(.92) contrast(1.04)}

/* motion: the same CSS-only reveals, never the hero */
@media (prefers-reduced-motion:no-preference){
  @supports (animation-timeline:view()){
    .svc,.exp-photo,.process li,.detail-grid img,.statement,.faq-ed .faqs{
      animation:rise linear both;animation-timeline:view();animation-range:entry 0% entry 55%}
    .svc-sm:nth-child(2){animation-range:entry 0% entry 65%}
    .svc-sm:nth-child(3){animation-range:entry 0% entry 75%}
    .detail-grid img:nth-child(2){animation-range:entry 0% entry 65%}
    .detail-grid img:nth-child(3){animation-range:entry 0% entry 75%}
  }
}
@media (prefers-reduced-motion:reduce){
  .svc,.exp-photo,.process li,.detail-grid img,.statement,.faq-ed .faqs{animation:none;opacity:1;translate:none}
}

/* responsive */
@media (max-width:64em){
  .intro-grid,.exp-grid,.process-grid,.faq-grid,.close-grid{grid-template-columns:1fr}
  .svc-grid{grid-template-columns:1fr;grid-template-rows:auto}
  .svc-lg{grid-row:auto}
  .svc-lg img{flex:none;aspect-ratio:3/2}
  .close-actions{justify-self:start}
  .detail-grid{grid-template-columns:1fr 1fr}
  .detail-grid img:nth-child(1){grid-column:span 2;aspect-ratio:2/1}
  .detail-grid img:nth-child(2),.detail-grid img:nth-child(3){aspect-ratio:4/3}
}
@media (max-width:48em){
  .hero-ed-photo{height:clamp(19rem,56vh,26rem)}
  .hero-ed-panel{margin-top:-2.4rem;padding:1.4rem 1rem 0 0;max-width:none}
  .hero-ed-panel h1{max-width:none}
  .svc-sm{grid-template-columns:1fr}
  .svc-sm .svc-text{margin-top:1rem}
  .detail-grid{grid-template-columns:1fr}
  .detail-grid img:nth-child(1){grid-column:auto;aspect-ratio:3/2}
  .detail-grid img:nth-child(2),.detail-grid img:nth-child(3){aspect-ratio:3/2}
  .close-actions .btn{min-width:0;width:100%}
}

/* ===================== homepage V2 — ChatGPT design pass, 23 Sep 2026 =====================
   Real-work photography first. Editorial structure, stronger proportions, no generated worker,
   no project showcase. Scoped to .home-v2 so inner pages remain untouched. */
.home-v2{overflow:clip;background:var(--paper)}
.home-v2 h1,.home-v2 h2,.home-v2 h3{font-family:var(--sans)}
.home-v2 h1{font-size:clamp(3.4rem,7.1vw,7.4rem);line-height:.91;letter-spacing:-.055em;font-weight:550;max-width:10ch;margin:0}
.home-v2 h2{font-size:clamp(2.35rem,4.4vw,4.8rem);line-height:.98;letter-spacing:-.045em;font-weight:520;margin:0}
.home-v2 h3{font-size:clamp(1.35rem,1.6vw,1.8rem);font-weight:560;letter-spacing:-.025em}
.home-v2 .btn{border-radius:0;min-height:3.15rem;padding:.85rem 1.35rem}
.home-v2 .btn-gold{background:var(--sky);border-color:var(--sky)}
.home-v2 .btn-gold:hover{background:var(--blue-hover);border-color:var(--blue-hover)}
.v2-kicker{font-size:.8rem;letter-spacing:.12em;text-transform:uppercase;color:var(--graphite);font-weight:650;margin:0 0 1.15rem}
.v2-text-link{display:inline-flex;align-items:center;gap:.55rem;font-weight:600;text-decoration:none;border-bottom:1px solid var(--sky);padding-bottom:.15rem;color:var(--charcoal)}
.v2-text-link:hover{border-bottom-color:var(--charcoal);text-decoration:none}
.v2-text-link .ic{width:16px;height:16px;color:var(--blue-ink)}

/* hero — photograph first, then an editorial text row. No floating card. */
.v2-hero{padding:clamp(2.4rem,5vw,5.2rem) 0 0;background:var(--paper)}
.v2-hero-head{display:grid;grid-template-columns:7fr 4fr;gap:clamp(2rem,6vw,6rem);align-items:end;margin-bottom:clamp(1.2rem,2.2vw,2rem);position:relative}
.v2-hero-head::after{content:"";position:absolute;left:0;bottom:calc(-1 * clamp(1.2rem,2.2vw,2rem));width:5rem;height:3px;background:var(--sky);outline:1px solid var(--charcoal);outline-offset:-1px;transform:translateY(50%);z-index:1}
.v2-hero-copy{max-width:34rem;padding-bottom:.35rem}
.v2-hero-copy>p{font-size:clamp(1.12rem,1.6vw,1.45rem);line-height:1.42;color:var(--graphite);margin:0}
.v2-actions{display:flex;align-items:center;gap:1.4rem;flex-wrap:wrap;margin-top:1.7rem}
.v2-hero-photo{margin:0;width:100%;height:clamp(24rem,54vw,48rem);overflow:hidden;background:var(--plaster)}
.v2-hero-photo img{width:100%;height:100%;object-fit:cover;object-position:50% 50%;filter:saturate(.9) contrast(1.03) brightness(1.03)}
.v2-proof{display:grid;grid-template-columns:repeat(4,1fr);border-bottom:1px solid var(--line-strong)}
.v2-proof>div{padding:1.7rem 1.5rem 1.8rem 0;border-right:1px solid var(--line)}
.v2-proof>div+div{padding-left:1.35rem}
.v2-proof>div:last-child{border-right:0}
.v2-proof span{font-size:.78rem;letter-spacing:.1em;color:var(--blue-ink);font-weight:650;display:block;margin-bottom:.7rem}
.v2-proof strong{display:block;font-size:1.2rem;font-weight:620;margin-bottom:.35rem;letter-spacing:-.01em}
.v2-proof small{display:block;color:var(--graphite);font-size:.95rem;line-height:1.5}

/* intro */
.v2-intro{padding:clamp(3.4rem,6vw,6.4rem) 0;background:var(--paper)}
.v2-intro-grid{display:grid;grid-template-columns:3fr 9fr;gap:var(--space-xl);align-items:start}
.v2-intro-grid h2{max-width:15ch;margin-bottom:1.4rem}
.v2-intro-grid>div>p{font-size:clamp(1.08rem,1.45vw,1.3rem);line-height:1.55;color:var(--graphite);max-width:58ch;margin:0}

/* services — three substantial tiles, no tiny side cards */
.v2-services{background:var(--plaster);padding:clamp(4.5rem,8vw,8rem) 0}
.v2-section-head{display:grid;grid-template-columns:1fr auto;gap:2rem;align-items:end;margin-bottom:clamp(2rem,4vw,3.5rem)}
.v2-section-head h2{max-width:13ch}
.v2-service-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(1.1rem,2.2vw,2rem)}
.v2-service{color:inherit;text-decoration:none;display:block}
.v2-service:hover{text-decoration:none}
.v2-service figure{margin:0;overflow:hidden;background:#ddd}
.v2-service figure img{width:100%;aspect-ratio:4/3;object-fit:cover;filter:saturate(.88) contrast(1.035) brightness(1.02);transition:transform 480ms var(--ease-out-expo)}
.v2-service:nth-child(1) figure img{object-position:66% 46%}
.v2-service:nth-child(2) figure img{object-position:50% 53%}
.v2-service:hover figure img{transform:scale(1.018)}
.v2-service-copy{padding:1.2rem 0 0;border-top:1px solid var(--charcoal);margin-top:1rem}
.v2-service-copy span{font-size:.68rem;letter-spacing:.12em;color:var(--blue-ink);font-weight:650}
.v2-service-copy h3{margin:.45rem 0 .45rem}
.v2-service-copy p{color:var(--graphite);margin:0;max-width:34ch}
.v2-service-links{display:flex;flex-wrap:wrap;gap:.55rem 1.4rem;margin-top:clamp(2rem,4vw,3.5rem);padding-top:1.2rem;border-top:1px solid var(--line-strong)}
.v2-service-links a{font-size:.88rem;color:var(--charcoal);text-decoration-color:var(--sky)}

/* experience — copy + two real photographs */
.v2-experience{padding:clamp(4.7rem,8vw,8.5rem) 0;background:var(--paper)}
.v2-exp-grid{display:grid;grid-template-columns:5fr 7fr;gap:clamp(2.5rem,6vw,6.5rem);align-items:center}
.v2-exp-copy h2{max-width:10ch;margin-bottom:1.4rem}
.v2-exp-copy>p:not(.v2-kicker){color:var(--graphite);max-width:48ch;font-size:1.05rem}
.v2-lines{list-style:none;padding:0;margin:2rem 0;border-top:1px solid var(--line-strong)}
.v2-lines li{padding:.82rem 0;border-bottom:1px solid var(--line);font-size:.95rem}
.v2-exp-photos{display:grid;grid-template-columns:5fr 4fr;gap:var(--gutter);align-items:end}
.v2-exp-photos img{width:100%;object-fit:cover;filter:saturate(.9) contrast(1.03) brightness(1.025)}
.v2-exp-photos img:first-child{aspect-ratio:4/5}
.v2-exp-photos img:last-child{aspect-ratio:3/4;margin-bottom:-3rem}

/* process */
.v2-process{background:var(--charcoal);color:#fff;padding:clamp(4.5rem,8vw,7.5rem) 0}
.v2-process h2,.v2-process h3{color:#fff}
.v2-process .v2-kicker{color:var(--sky)}
.v2-section-head-light>p{color:#CFCFCA;max-width:34ch;margin:0 0 .3rem}
.v2-process-grid{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(5,1fr);border-top:1px solid rgba(255,255,255,.3)}
.v2-process-grid li{padding:1.35rem 1.2rem 0 0;border-right:1px solid rgba(255,255,255,.18);min-height:12rem}
.v2-process-grid li+li{padding-left:1.2rem}
.v2-process-grid li:last-child{border-right:0}
.v2-process-grid span{display:block;color:var(--sky);font-size:.72rem;letter-spacing:.12em;font-weight:650;margin-bottom:2.5rem}
.v2-process-grid h3{margin:0 0 .5rem;font-size:1.12rem}
.v2-process-grid p{color:#CFCFCA;font-size:.9rem;line-height:1.5;margin:0}

/* craft */
.v2-craft{padding:clamp(4.5rem,8vw,8rem) 0;background:var(--paper)}
.v2-craft-grid{display:grid;grid-template-columns:1.25fr .8fr .8fr;gap:var(--gutter);align-items:end}
.v2-craft-grid figure{margin:0;overflow:hidden;background:var(--plaster)}
.v2-craft-grid img{width:100%;height:100%;object-fit:cover;filter:saturate(.88) contrast(1.03) brightness(1.025)}
.v2-craft-wide{height:clamp(24rem,43vw,38rem)}
.v2-craft-grid figure:nth-child(2){height:clamp(20rem,34vw,30rem)}
.v2-craft-grid figure:nth-child(3){height:clamp(17rem,28vw,25rem)}

/* FAQ + close */
.v2-faq{padding:clamp(4.5rem,8vw,8rem) 0;border-top:1px solid var(--line);background:var(--paper)}
.v2-faq-grid{display:grid;grid-template-columns:4fr 8fr;gap:var(--space-xl);align-items:start}
.v2-faq-grid h2{max-width:8ch}
.v2-faq .faqs summary{font-size:1rem;padding:1.15rem 2.4rem 1.15rem 0}
.v2-close{background:var(--plaster);padding:clamp(4rem,7vw,6.5rem) 0;border-top:1px solid var(--line)}
.v2-close-grid{display:grid;grid-template-columns:7fr 5fr;gap:var(--space-xl);align-items:end}
.v2-close h2{max-width:11ch;margin-bottom:1rem}
.v2-close p:not(.v2-kicker){color:var(--graphite);max-width:48ch;margin:0}
.v2-close-actions{display:flex;align-items:center;justify-content:flex-end;gap:1.3rem;flex-wrap:wrap}

@media (prefers-reduced-motion:no-preference){
  @supports (animation-timeline:view()){
    .v2-service,.v2-exp-copy,.v2-exp-photos img,.v2-process-grid li,.v2-craft-grid figure,.v2-faq .faqs{
      animation:rise linear both;animation-timeline:view();animation-range:entry 0% entry 52%}
  }
}

@media (max-width:64em){
  .v2-hero-head{grid-template-columns:1fr;gap:1.8rem;align-items:start}
  .home-v2 h1{max-width:12ch}
  .v2-hero-copy{max-width:42rem}
  .v2-intro-grid,.v2-exp-grid,.v2-faq-grid,.v2-close-grid{grid-template-columns:1fr}
  .v2-service-grid{grid-template-columns:1fr 1fr}
  .v2-service:last-child{grid-column:1/-1;display:grid;grid-template-columns:1.1fr .9fr;gap:1.4rem;align-items:end}
  .v2-service:last-child .v2-service-copy{margin-top:0}
  .v2-process-grid{grid-template-columns:repeat(3,1fr)}
  .v2-process-grid li:nth-child(3){border-right:0}
  .v2-process-grid li:nth-child(n+4){border-top:1px solid rgba(255,255,255,.18);margin-top:1.2rem;padding-top:1.4rem}
  .v2-craft-grid{grid-template-columns:1fr 1fr}
  .v2-craft-wide{grid-column:1/-1;height:32rem}
  .v2-close-actions{justify-content:flex-start}
}

@media (max-width:48em){
  .v2-hero{padding-top:2.2rem}
  .home-v2 h1{font-size:clamp(3.15rem,14vw,5rem);line-height:.92}
  .home-v2 h2{font-size:clamp(2.25rem,10vw,3.4rem)}
  .v2-hero-photo{height:23rem;margin-top:.2rem}
  .v2-hero-photo img{object-position:52% 50%}
  .v2-proof{grid-template-columns:1fr 1fr}
  .v2-proof>div{border-bottom:1px solid var(--line);padding:1.15rem .9rem 1.2rem 0}
  .v2-proof>div+div{padding-left:.9rem}
  .v2-proof>div:nth-child(2){border-right:0}
  .v2-proof>div:nth-child(n+3){border-bottom:0}
  .v2-intro{padding:3rem 0}
  .v2-intro-grid{gap:1rem}
  .v2-section-head{grid-template-columns:1fr;align-items:start;gap:1rem}
  .v2-service-grid{grid-template-columns:1fr}
  .v2-service:last-child{grid-column:auto;display:block}
  .v2-service:last-child .v2-service-copy{margin-top:1rem}
  .v2-exp-photos{grid-template-columns:1fr 1fr;gap:.75rem}
  .v2-exp-photos img:first-child,.v2-exp-photos img:last-child{aspect-ratio:3/4;margin:0}
  .v2-process-grid{grid-template-columns:1fr}
  .v2-process-grid li,.v2-process-grid li+li{border-right:0;border-top:1px solid rgba(255,255,255,.18);padding:1.25rem 0;min-height:0;margin:0}
  .v2-process-grid li:first-child{border-top:0}
  .v2-process-grid span{margin-bottom:.6rem}
  .v2-craft-grid{grid-template-columns:1fr}
  .v2-craft-wide,.v2-craft-grid figure:nth-child(2),.v2-craft-grid figure:nth-child(3){grid-column:auto;height:20rem}
  .v2-close-actions{align-items:flex-start;flex-direction:column}
}

/* V2 refinement: keep the whole homepage light; the process becomes a pale coastal panel. */
.v2-process{background:color-mix(in oklab,var(--sky) 22%,var(--paper));color:var(--charcoal)}
.v2-process h2,.v2-process h3{color:var(--charcoal)}
.v2-process .v2-kicker{color:var(--blue-ink)}
.v2-section-head-light>p{color:var(--graphite)}
.v2-process-grid{border-top-color:var(--line-strong)}
.v2-process-grid li{border-right-color:var(--line);}
.v2-process-grid span{color:var(--blue-ink)}
.v2-process-grid p{color:var(--graphite)}
@media (max-width:64em){.v2-process-grid li:nth-child(n+4){border-top-color:var(--line)}}
@media (max-width:48em){.v2-process-grid li,.v2-process-grid li+li{border-top-color:var(--line)}}