/* ==========================================================================
   Merrow Consulting - theme-forge "tf-consult-agency" theme
   Archetype: Muted-earth editorial consultancy (full-bleed photo hero +
   numbered tint rows). Likeness target: Crowdy "Consult" demo.
   Fonts: Rubik (display 700/800) + Work Sans (body 400/500), self-hosted woff2.
   All color flows from :root props. Zero external requests at runtime.
   ========================================================================== */

/* ---- self-hosted fonts (latin subset) ---- */
@font-face { font-family:"Rubik"; font-style:normal; font-weight:700; font-display:swap; src:url("../fonts/rubik-700.woff2") format("woff2"); }
@font-face { font-family:"Rubik"; font-style:normal; font-weight:800; font-display:swap; src:url("../fonts/rubik-800.woff2") format("woff2"); }
@font-face { font-family:"Work Sans"; font-style:normal; font-weight:400; font-display:swap; src:url("../fonts/worksans-400.woff2") format("woff2"); }
@font-face { font-family:"Work Sans"; font-style:normal; font-weight:500; font-display:swap; src:url("../fonts/worksans-500.woff2") format("woff2"); }

/* ---- tokens ---- */
:root {
  --ink:#16181A;          /* near-black text / dark bands */
  --paper:#FFFFFF;
  --slate:#626B75;        /* muted body */
  --accent:#5E9B76;       /* sage/mint green (deep for AA on white) */
  --accent-light:#E7EFE6; /* faint sage flourish tint */
  --tint-a:#D6DECB;       /* muted sage section tint (service rows) */
  --tint-b:#BAC9D4;       /* cool blue-gray section tint (stats) */
  --tint-c:#F1F6F6;       /* pale cool tint (process panel) */
  --dark:#121212;         /* dark panel / footer */

  --line:#E6E8E4;         /* hairline on light */
  --line-dark:rgba(255,255,255,.14);
  --on-dark:#FFFFFF;
  --on-dark-muted:#AEB2B0;
  --sage-strong:#8FBF9B;  /* brighter sage for contact card + markers */

  --font-display:"Rubik", system-ui, sans-serif;
  --font-body:"Work Sans", system-ui, sans-serif;

  /* type scale (ref: h1 80/lh80/800, h2 50/700, h3 22/700, body 18/400) */
  --fs-hero:clamp(2.5rem, 1.2rem + 4.7vw, 5rem);        /* 40-80 */
  --fs-h1:clamp(2.3rem, 1.4rem + 3.6vw, 4rem);          /* 37-64 */
  --fs-h2:clamp(2rem, 1.2rem + 2.6vw, 3.125rem);        /* 32-50 */
  --fs-h3-big:clamp(1.9rem, 1.3rem + 1.9vw, 2.5rem);    /* 30-40 row/dedicated titles */
  --fs-h3:clamp(1.2rem, 1.05rem + 0.5vw, 1.375rem);     /* 19-22 */
  --fs-body:clamp(1rem, 0.95rem + 0.25vw, 1.125rem);    /* 16-18 */
  --fs-lead:clamp(1.06rem, 0.98rem + 0.3vw, 1.1875rem); /* 17-19 */
  --fs-small:0.9375rem;
  --fs-over:0.8125rem;    /* overline 13 */
  --fs-count:clamp(3rem, 1.5rem + 5vw, 5rem); /* 30+ figure */

  --s1:4px; --s2:8px; --s3:12px; --s4:16px; --s5:24px; --s6:32px;
  --s7:48px; --s8:64px; --s9:96px; --s10:130px;

  --r-pill:999px;
  --r-card:0px;           /* ref uses square-ish cards / sharp corners */
  --r-btn:999px;

  --sh-1:0 2px 10px rgba(20,24,26,.06);
  --sh-2:0 20px 50px rgba(20,24,26,.10);

  --t-base:300ms;
  --ease:cubic-bezier(.22,.61,.36,1);

  --wrap:1397px;
  --wrap-wide:1520px;
  --gutter:clamp(20px, 3vw, 44px);
  --edge:clamp(20px, 13.9vw, 200px); /* left inset for hero/row text ~200 @1440 */
}

/* ---- reset / base ---- */
*,*::before,*::after { box-sizing:border-box; }
html { -webkit-text-size-adjust:100%; scroll-behavior:smooth; }
body {
  margin:0; background:var(--paper); color:var(--ink);
  font-family:var(--font-body); font-size:var(--fs-body); line-height:1.55;
  font-weight:400; -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;
}
img { max-width:100%; display:block; }
a { color:inherit; text-decoration:none; }
button { font-family:inherit; cursor:pointer; }
h1,h2,h3,h4 { font-family:var(--font-display); font-weight:800; line-height:1.0; margin:0; letter-spacing:-0.02em; color:var(--ink); }
h3 { font-weight:700; }
p { margin:0; }
svg { display:block; }
:focus-visible { outline:2px solid var(--accent); outline-offset:3px; }
::selection { background:var(--accent); color:#fff; }
.skip { position:absolute; left:-9999px; top:0; background:var(--ink); color:#fff; padding:10px 16px; z-index:200; }
.skip:focus { left:12px; top:12px; }

/* ---- layout primitives ---- */
.wrap { width:100%; max-width:var(--wrap); margin:0 auto; padding:0 var(--gutter); }
.section { padding:var(--s10) 0; }
.center { text-align:center; }

/* icons default sizing (prevents 300x150 default) */
.ico { width:22px; height:22px; display:inline-block; flex:none; }
.ico svg { width:100%; height:100%; }

/* ---- overline ---- */
.over {
  display:inline-block; font-family:var(--font-body); font-weight:500;
  font-size:var(--fs-over); letter-spacing:.18em; text-transform:uppercase;
  color:var(--ink); padding-bottom:6px; border-bottom:1.5px solid currentColor;
}
.over--muted { color:var(--slate); }
.over--dark { color:var(--on-dark); }

/* ---- buttons ---- */
.btn { display:inline-flex; align-items:center; gap:10px; font-family:var(--font-body);
  font-weight:500; font-size:var(--fs-small); line-height:1; padding:16px 26px;
  border-radius:var(--r-btn); border:1.5px solid transparent; transition:all var(--t-base) var(--ease); }
.btn .ico { width:26px; height:26px; padding:5px; border-radius:50%; }
.btn--dark { background:var(--dark); color:#fff; }
.btn--dark .ico { background:#fff; color:var(--dark); }
.btn--dark:hover { background:#000; }
.btn--white { background:#fff; color:var(--ink); }
.btn--white .ico { background:var(--ink); color:#fff; }
.btn--white:hover { background:var(--accent-light); }
.btn--outline { background:transparent; color:var(--ink); border-color:var(--ink); }
.btn--outline .ico { background:var(--ink); color:#fff; }
.btn--outline:hover { background:var(--ink); color:#fff; }
.btn--outline:hover .ico { background:#fff; color:var(--ink); }
.btn--block { width:100%; justify-content:center; }

/* underlined text link with arrow (ref grammar) */
.arrowlink { display:inline-flex; align-items:center; gap:10px; font-weight:500;
  padding-bottom:5px; border-bottom:1.5px solid var(--ink); transition:gap var(--t-base) var(--ease); }
.arrowlink .ico { width:16px; height:16px; }
.arrowlink:hover { gap:16px; }
.arrowlink--dark { border-color:var(--on-dark); color:var(--on-dark); }

/* =====================================================================
   HEADER (transparent overlay on hero; solid on inners / on scroll)
   ===================================================================== */
.site-header { position:absolute; top:0; left:0; right:0; z-index:100;
  height:82px; display:flex; align-items:center;
  border-bottom:1px solid var(--line-dark); transition:background var(--t-base), color var(--t-base); }
.site-header .wrap { max-width:var(--wrap-wide); display:flex; align-items:center; gap:24px; }
.brand { display:inline-flex; align-items:center; gap:10px; font-family:var(--font-display);
  font-weight:800; font-size:1.3rem; letter-spacing:.02em; color:var(--on-dark); }
.brand__mark { width:24px; height:24px; flex:none; }
.nav { display:flex; align-items:center; gap:30px; margin:0 auto; }
.nav__item { position:relative; }
.nav__link { display:inline-flex; align-items:center; gap:6px; font-weight:500;
  font-size:0.95rem; color:var(--on-dark); padding:8px 0; }
.nav__caret { width:14px; height:14px; }
.dropdown { position:absolute; top:100%; left:-14px; min-width:230px; background:#fff;
  border:1px solid var(--line); box-shadow:var(--sh-2); padding:8px; opacity:0;
  visibility:hidden; transform:translateY(8px); transition:all var(--t-base) var(--ease); }
.nav__item:hover .dropdown { opacity:1; visibility:visible; transform:translateY(0); }
.dropdown a { display:block; padding:10px 14px; color:var(--ink); font-size:0.92rem; }
.dropdown a small { display:block; color:var(--slate); font-size:0.78rem; margin-top:2px; }
.dropdown a:hover { background:var(--accent-light); }
.header-right { display:flex; align-items:center; gap:18px; margin-left:auto; }
.header-search { width:22px; height:22px; color:var(--on-dark); background:transparent; border:none; padding:0; }
.header-cta { padding:13px 22px; }
.nav-toggle { display:none; width:44px; height:44px; align-items:center; justify-content:center;
  background:transparent; border:1px solid var(--line-dark); color:var(--on-dark); }
.nav-toggle .ico { width:22px; height:22px; }

/* solid variant (inner pages + stuck) */
.site-header--solid, .site-header.is-stuck {
  position:fixed; background:#fff; border-bottom:1px solid var(--line); color:var(--ink); }
.site-header--solid .brand, .is-stuck .brand,
.site-header--solid .nav__link, .is-stuck .nav__link,
.site-header--solid .header-search, .is-stuck .header-search { color:var(--ink); }
.site-header--solid .nav-toggle, .is-stuck .nav-toggle { border-color:var(--line); color:var(--ink); }
.site-header--solid .header-cta, .is-stuck .header-cta { background:var(--dark); color:#fff; }
.site-header--solid .header-cta .ico, .is-stuck .header-cta .ico { background:#fff; color:var(--dark); }
/* spacer so fixed solid header doesn't overlap inner page content */
.header-spacer { height:82px; }

/* mobile panel */
.mobile-panel { position:fixed; inset:0; z-index:150; background:#fff; color:var(--ink);
  padding:24px var(--gutter); display:flex; flex-direction:column;
  visibility:hidden; opacity:0; transform:translateX(100%);
  transition:transform var(--t-base) var(--ease), opacity var(--t-base), visibility var(--t-base); }
.mobile-panel.open { visibility:visible; opacity:1; transform:translateX(0); }
.mobile-panel__head { display:flex; align-items:center; justify-content:space-between; margin-bottom:20px; }
.mobile-panel__head .brand { color:var(--ink); }
.mobile-panel__close { width:44px; height:44px; background:transparent; border:1px solid var(--line);
  display:flex; align-items:center; justify-content:center; }
.mobile-panel__close .ico { width:22px; height:22px; }
.mobile-panel nav { display:flex; flex-direction:column; gap:4px; }
.mobile-panel nav a { padding:14px 4px; font-family:var(--font-display); font-weight:700;
  font-size:1.3rem; border-bottom:1px solid var(--line); }
.mobile-panel nav a.sub { font-family:var(--font-body); font-weight:500; font-size:1rem;
  padding-left:18px; color:var(--slate); }
.mobile-panel nav a.btn { margin-top:20px; border:none; justify-content:center; }

/* =====================================================================
   HERO
   ===================================================================== */
.hero { position:relative; min-height:min(996px, 112vh); overflow:hidden; background:var(--dark); }
.hero__photo { position:absolute; inset:0; }
.hero__photo img { width:100%; height:100%; object-fit:cover; opacity:0; }
.hero__photo img:first-of-type { opacity:1; }
.hero__photo::before { content:""; position:absolute; inset:0;
  background:radial-gradient(120% 90% at 0% 0%, rgba(60,20,30,.55), transparent 42%); }
.hero__inner { position:relative; z-index:2; min-height:min(996px,112vh);
  max-width:var(--wrap-wide); margin:0 auto; padding-inline:var(--edge);
  display:flex; flex-direction:column; justify-content:center; }
.hero__copy { max-width:667px; }
.hero__pill { display:inline-block; background:var(--dark); color:#fff; font-weight:500;
  font-size:var(--fs-small); padding:9px 20px; border-radius:var(--r-pill); margin-bottom:22px; }
.hero h1 { font-size:var(--fs-hero); font-weight:800; color:#fff; line-height:1.0; }
.hero__rule { width:200px; height:2px; background:rgba(255,255,255,.85); margin:26px 0 16px 220px; }
.hero__sub { color:#fff; font-weight:700; font-size:var(--fs-lead); max-width:210px; margin-left:220px; }
.hero__panel { position:absolute; right:0; bottom:0; z-index:2; width:min(524px,40vw);
  background:var(--dark); color:#fff; padding:40px 44px; overflow:hidden; }
.hero__panel-x { position:absolute; right:-20px; bottom:-30px; font-family:var(--font-display);
  font-weight:800; font-size:230px; line-height:1; color:rgba(255,255,255,.05); pointer-events:none; }
.hero__panel p { position:relative; font-size:var(--fs-lead); font-weight:500; }

/* =====================================================================
   BAND 2 - PROCESS + CORE FEATURES INTRO
   ===================================================================== */
/* ref: the process copy sits inside a pale tinted panel that runs from the wrap's
   left content edge to x=916 (the same boundary the service-row photos start at),
   with the intro column outside it on white. */
.processband { background:var(--paper); padding:0; }
.processband .wrap { max-width:var(--wrap-wide); display:grid; grid-template-columns:2.36fr 1fr;
  gap:clamp(40px,7.6vw,110px); align-items:stretch; }
.proc-panel { background:var(--tint-c); padding:var(--s10) 54px var(--s10) 0; }
.proc-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:44px 40px; }
.proc-item .proc-ico { width:56px; height:56px; color:var(--ink); margin-bottom:26px; }
.proc-item .proc-ico svg { width:100%; height:100%; }
.proc-item h3 { font-size:var(--fs-h3); margin-bottom:10px; }
.proc-item p { color:var(--slate); font-size:var(--fs-small); }
.proc-item--wide { grid-column:1; }
.proc-photo { grid-column:2 / 4; grid-row:2; align-self:end; }
.proc-photo img { width:100%; height:280px; object-fit:cover; }
.feat-intro { position:relative; min-height:100%; display:flex; flex-direction:column;
  padding:var(--s10) 0; }
.feat-intro h2 { font-size:var(--fs-h2); margin:22px 0 22px; }
.feat-intro p { color:var(--slate); }
.feat-intro .btn { align-self:flex-start; margin-top:auto; }
.feat-intro .btn { margin-top:60px; }

/* =====================================================================
   BAND 3 - SERVICE ROWS (continuous sage, right photos)
   ===================================================================== */
/* ref: the sage panel starts at the wrap gutter (x=43) and runs flush to the right
   edge; the body copy still lands at x=200 and the photo column still starts at 916. */
.servicerows { background:var(--tint-a); margin-left:var(--gutter); }
.srow { display:grid; grid-template-columns:1fr minmax(360px,524px); align-items:stretch; }
.srow__body { padding:96px 0 96px calc(var(--edge) - var(--gutter)); padding-right:60px; max-width:calc(var(--wrap-wide)/2 + 120px); }
.srow__num { display:inline-flex; align-items:center; gap:10px; font-weight:500; font-size:var(--fs-over); letter-spacing:.16em;
  text-transform:uppercase; padding-bottom:5px; border-bottom:1.5px solid var(--ink); margin-bottom:60px; }
.srow__dash { display:block; width:16px; height:1.5px; background:currentColor; font-style:normal; }
.srow__title { font-size:var(--fs-h3-big); font-weight:800; max-width:12ch; margin-bottom:22px; }
.srow__body > p { color:var(--slate); max-width:44ch; margin-bottom:26px; }
.srow__checks { list-style:none; margin:0 0 34px; padding:0; display:flex; flex-direction:column; gap:14px; }
.srow__checks li { display:flex; align-items:center; gap:12px; font-weight:500; }
.srow__checks .ico { width:20px; height:20px; color:var(--accent); }
.srow__photo { position:relative; }
.srow__photo img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }

/* =====================================================================
   BAND 4 - DEDICATED / X-GLYPH
   ===================================================================== */
.dedicated { background:var(--paper); text-align:center; padding:var(--s10) 0; }
.dedicated .wrap { max-width:980px; }
.dedicated h2 { font-size:var(--fs-h3-big); font-weight:800; line-height:1.18; margin-bottom:34px; }
.dedicated h2 .muted { color:var(--slate); }
.dedicated .arrowlink { margin-bottom:70px; }
.xglyph { width:min(320px,70vw); aspect-ratio:1; margin:0 auto; }
.xglyph img { width:100%; height:100%; object-fit:cover;
  clip-path:polygon(0 0,26% 0,50% 32%,74% 0,100% 0,64% 50%,100% 100%,74% 100%,50% 68%,26% 100%,0 100%,36% 50%); }

/* =====================================================================
   BAND 5 - STATS / FUN FACT
   ===================================================================== */
.stats { background:var(--tint-b); }
.stats__photo { height:min(640px,60vh); }
.stats__photo img { width:100%; height:100%; object-fit:cover; }
.stats__panel { max-width:var(--wrap-wide); margin:0 auto; padding:64px var(--edge) 80px;
  display:grid; grid-template-columns:1.1fr 1fr 0.9fr; gap:54px; align-items:start; }
.stats__lead { position:relative; }
.stats__marker { position:absolute; left:-6px; top:-30px; width:64px; height:26px;
  background:var(--accent); transform:skewX(-24deg); }
.stats__lead .over { margin-bottom:22px; }
.stats__lead h2 { font-size:var(--fs-h2); }
.stats-tabs { list-style:none; margin:0; padding:0; }
.stats-tab { width:100%; text-align:left; background:transparent; border:none;
  border-top:1px solid rgba(22,24,26,.22); display:grid; grid-template-columns:auto 1fr;
  gap:18px; align-items:baseline; padding:22px 0; cursor:pointer; font-family:inherit; }
.stats-tab:last-child { border-bottom:1px solid rgba(22,24,26,.22); }
.stats-tab__n { font-weight:500; color:var(--slate); font-size:var(--fs-small); }
.stats-tab__t { font-family:var(--font-display); font-weight:700; font-size:1.15rem; line-height:1.2; }
.stats-tab[aria-expanded="true"] .stats-tab__t { color:var(--ink); }
.stats-tab__t small { display:block; font-family:var(--font-body); font-weight:400;
  font-size:0.9rem; color:var(--slate); margin-top:8px; max-width:34ch;
  max-height:0; overflow:hidden; opacity:0; transition:all var(--t-base) var(--ease); }
.stats-tab[aria-expanded="true"] .stats-tab__t small { max-height:80px; opacity:1; margin-top:10px; }
.stats__count .num { font-family:var(--font-display); font-weight:800; font-size:var(--fs-count); line-height:1; }
.stats__count p { color:var(--slate); margin-top:16px; }

/* =====================================================================
   BAND 6 - TESTIMONIALS (manual arrows)
   ===================================================================== */
.testi { background:var(--paper); text-align:center; }
.testi__head { margin-bottom:60px; }
.testi__head h2 { font-size:var(--fs-h2); margin-top:18px; }
.testi__stage { position:relative; max-width:var(--wrap); margin:0 auto; }
.testi__track { overflow:hidden; }
.testi__slides { display:flex; transition:transform 500ms var(--ease); }
.testi__slide { flex:0 0 100%; display:grid; grid-template-columns:407px 1fr; gap:70px;
  align-items:center; text-align:left; }
.testi__photo { width:407px; height:460px; }
.testi__photo img { width:100%; height:100%; object-fit:cover; }
.testi__quotemark { font-family:var(--font-display); font-weight:800; font-size:90px;
  line-height:.6; color:var(--ink); height:56px; }
.testi__quote { font-family:var(--font-display); font-weight:700; font-size:clamp(1.3rem,1rem+1.3vw,1.9rem);
  line-height:1.28; margin:20px 0 30px; }
.testi__by { border-left:3px solid var(--accent); padding-left:16px; }
.testi__name { font-family:var(--font-display); font-weight:700; }
.testi__role { color:var(--slate); font-size:var(--fs-small); }
.testi__arrow { position:absolute; top:50%; transform:translateY(-50%); width:44px; height:44px;
  background:transparent; border:none; color:var(--ink); }
.testi__arrow .ico { width:30px; height:30px; }
.testi__arrow--prev { left:-10px; }
.testi__arrow--next { right:-10px; }
/* the base glyph is a down chevron; rotate each arrow so it points its own way */
.testi__arrow--prev .ico { transform:rotate(90deg); }
.testi__arrow--next .ico { transform:rotate(-90deg); }

/* =====================================================================
   BAND 7 - SPECIALIZATION (dark)
   ===================================================================== */
.spec { background:var(--dark); color:var(--on-dark); }
.spec__grid { display:grid; grid-template-columns:1fr 1fr; align-items:stretch; }
.spec__photo { position:relative; min-height:520px; }
.spec__photo img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.spec__body { padding:96px var(--edge) 96px 70px; }
.spec__body .over { color:var(--on-dark); border-color:var(--on-dark); margin-bottom:30px; }
.spec__body h2 { color:#fff; font-size:var(--fs-h2); margin-bottom:26px; }
.spec__body > p { color:var(--on-dark-muted); max-width:48ch; margin-bottom:30px; }
.spec__body > p b { color:#fff; font-weight:500; }
.spec__checks { list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:16px; }
.spec__checks li { display:flex; align-items:center; gap:12px; font-weight:500; color:#fff; }
.spec__checks .ico { width:18px; height:18px; color:var(--accent); }

/* =====================================================================
   BAND 8 - BLOG INSIGHT
   ===================================================================== */
.blog { background:var(--paper); }
.blog__head { display:flex; justify-content:space-between; align-items:flex-end; gap:30px; margin-bottom:56px; }
.blog__head h2 { font-size:var(--fs-h2); max-width:16ch; }
.blog__grid { display:grid; grid-template-columns:repeat(3,1fr); gap:44px; }
.post__img { width:100%; height:270px; object-fit:cover; margin-bottom:22px; }
.post__meta { display:flex; align-items:center; gap:14px; margin-bottom:14px; }
.post__cat { background:var(--accent-light); color:var(--ink); font-size:0.78rem; font-weight:500;
  padding:5px 12px; }
.post__date { color:var(--slate); font-size:var(--fs-small); }
.post h3 { font-size:var(--fs-h3-big); font-weight:800; line-height:1.15; }
.post h3 a:hover { color:var(--accent); }

/* =====================================================================
   PRE-FOOTER + FOOTER
   ===================================================================== */
.prefoot { max-width:100%; }
.prefoot .wrap { max-width:var(--wrap-wide); display:grid; grid-template-columns:1fr 1.4fr; padding-right:0; }
.prefoot__hours { position:relative; background:var(--sage-strong); color:var(--ink);
  font-weight:500; padding:34px 40px; display:flex; align-items:center; gap:10px; }
.prefoot__hours b { font-weight:700; }
.prefoot__hours::after { content:""; position:absolute; left:44px; bottom:-18px; width:36px; height:18px;
  background:var(--sage-strong); clip-path:polygon(0 0,100% 0,50% 100%); }
.prefoot__cta { background:#1c1c1c; color:#fff; padding:34px 40px; display:flex; align-items:center;
  justify-content:space-between; gap:20px; font-family:var(--font-display); font-weight:700; font-size:1.15rem; }
.prefoot__cta .ico { width:34px; height:34px; padding:8px; border:1.5px solid rgba(255,255,255,.4); border-radius:50%; }
.prefoot__cta:hover .ico { background:#fff; color:var(--dark); }

.footer { background:var(--dark); color:var(--on-dark-muted); padding:80px 0 40px; }
.footer .wrap { max-width:var(--wrap-wide); }
.footer__top { display:grid; grid-template-columns:1.4fr repeat(3,1fr) 1.3fr; gap:40px; }
.footer .brand { color:#fff; }
.footer__col h4 { color:#fff; font-family:var(--font-display); font-weight:700; font-size:1.15rem; margin-bottom:22px; }
.footer__col ul { list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:14px; }
.footer__col a:hover { color:#fff; }
.footer__news form { display:flex; border:1px solid var(--line-dark); background:#1c1c1c; }
.footer__news input { flex:1; background:transparent; border:none; color:#fff; padding:14px 16px; font-family:inherit; }
.footer__news input::placeholder { color:var(--on-dark-muted); }
.footer__news button { background:transparent; border:none; color:#fff; padding:0 16px; }
.footer__news button .ico { width:22px; height:22px; }
.footer__bottom { display:flex; align-items:center; justify-content:space-between; gap:20px;
  margin-top:56px; padding-top:26px; border-top:1px solid var(--line-dark); flex-wrap:wrap; }
.footer__social { display:flex; gap:16px; }
.footer__social a { color:var(--on-dark-muted); }
.footer__social a:hover { color:#fff; }
.footer__social .ico { width:20px; height:20px; }
.footer__legal { color:var(--on-dark-muted); font-size:0.82rem; max-width:70ch; line-height:1.6; }
.footer__copy b { color:#fff; font-weight:500; }

.scrolltop { position:fixed; right:24px; bottom:24px; z-index:90; width:46px; height:46px;
  background:var(--dark); color:#fff; border:none; border-radius:50%; display:flex;
  align-items:center; justify-content:center; opacity:0; visibility:hidden; transition:all var(--t-base); }
.scrolltop.show { opacity:1; visibility:visible; }
.scrolltop .ico { width:22px; height:22px; }

/* =====================================================================
   INNER PAGE HEADER
   ===================================================================== */
.pagehead { padding:70px 0 60px; background:var(--paper); }
.pagehead .wrap { max-width:var(--wrap-wide); }
.pagehead__top { display:grid; grid-template-columns:170px 1fr; gap:40px; align-items:start; }
.pagehead .over { margin-top:12px; }
.pagehead h1 { font-size:clamp(2.5rem,1.4rem+4.5vw,4.5rem); font-weight:800; line-height:1.02; max-width:15ch; }
.pagehead__aside { color:var(--slate); }
.pagehead__aside p { margin-bottom:22px; }
.pagehead__split { display:grid; grid-template-columns:1.3fr 1fr; gap:60px; align-items:start; margin-top:20px; }

/* generic feature block */
.feature { display:grid; grid-template-columns:1fr 1fr; gap:64px; align-items:center; }
.feature--rev .feature__media { order:2; }
.feature__media img { width:100%; height:100%; object-fit:cover; }
.feature h2 { font-size:var(--fs-h2); margin-bottom:22px; }
.feature p { color:var(--slate); margin-bottom:18px; }
.checklist { list-style:none; margin:20px 0 30px; padding:0; display:flex; flex-direction:column; gap:14px; }
.checklist li { display:flex; align-items:flex-start; gap:12px; }
.checklist .ico { width:20px; height:20px; color:var(--accent); margin-top:3px; }
.checklist b { font-weight:500; }
.checklist span { color:var(--slate); }

/* milestone timeline (about) */
.timeline { border-top:1px solid var(--line); }
.milestone { display:grid; grid-template-columns:170px 1fr; gap:40px; padding:32px 0;
  border-bottom:1px solid var(--line); }
.milestone__year { font-weight:500; color:var(--slate); font-size:var(--fs-small); }
.milestone h3 { font-size:var(--fs-h3-big); font-weight:800; margin-bottom:10px; }
.milestone p { color:var(--slate); max-width:44ch; }

/* badge medallion (about) */
.medallion { background:var(--dark); color:#fff; text-align:center; padding:60px var(--gutter); }
.medallion__seal { width:120px; height:120px; margin:0 auto 26px; border:2px solid var(--accent);
  border-radius:50%; display:flex; align-items:center; justify-content:center;
  font-family:var(--font-display); font-weight:800; font-size:1.6rem; color:var(--accent); }
.medallion p { max-width:60ch; margin:0 auto; color:var(--on-dark-muted); }
.medallion p b { color:#fff; font-weight:500; }

/* team grid */
.teamgrid { display:grid; grid-template-columns:repeat(4,1fr); gap:34px; }
.member__photo { position:relative; overflow:hidden; margin-bottom:18px; }
.member__photo img { width:100%; aspect-ratio:4/5; object-fit:cover; }
.member__social { position:absolute; inset:auto 0 0 0; display:flex; justify-content:center; gap:14px;
  padding:14px; background:linear-gradient(transparent,rgba(18,18,18,.8));
  transform:translateY(100%); transition:transform var(--t-base) var(--ease); }
.member__photo:hover .member__social { transform:translateY(0); }
.member__social a { color:#fff; }
.member__social .ico { width:18px; height:18px; }
.member h3 { font-size:var(--fs-h3); text-align:center; }
.member p { text-align:center; color:var(--slate); font-size:var(--fs-small); margin-top:4px; }

/* numbered service list (service page) */
.numlist { border-top:1px solid var(--line); }
.numrow { display:grid; grid-template-columns:70px 1fr auto; gap:30px; align-items:center;
  padding:30px 0; border-bottom:1px solid var(--line); transition:padding var(--t-base) var(--ease); }
.numrow__n { font-weight:500; color:var(--slate); font-size:var(--fs-small); }
.numrow h3 { font-size:var(--fs-h3-big); font-weight:800; margin-bottom:8px; }
.numrow p { color:var(--slate); max-width:60ch; }
.numrow__arrow { width:40px; height:40px; border:1.5px solid var(--line); border-radius:50%;
  display:flex; align-items:center; justify-content:center; color:var(--ink); }
.numrow__arrow .ico { width:18px; height:18px; }
.numrow:hover { padding-left:14px; }
.numrow:hover .numrow__arrow { background:var(--ink); color:#fff; border-color:var(--ink); }

/* dark accordion (service page) */
.darkband { background:var(--dark); color:var(--on-dark); }
.acc { border-top:1px solid var(--line-dark); }
.acc__item { border-bottom:1px solid var(--line-dark); }
.acc__q { width:100%; text-align:left; background:transparent; border:none; color:#fff;
  font-family:var(--font-display); font-weight:700; font-size:1.15rem; padding:24px 0;
  display:flex; align-items:center; justify-content:space-between; gap:20px; }
.acc__q .ico { width:22px; height:22px; flex:none; color:var(--accent); transition:transform var(--t-base); }
.acc__item[open] .acc__q .ico { transform:rotate(45deg); }
.acc__a { color:var(--on-dark-muted); padding:0 0 24px; max-width:70ch; }

/* partners logos */
.partners__row { display:flex; flex-wrap:wrap; align-items:center; justify-content:center;
  gap:60px; margin-top:50px; }
.partners__logo { color:var(--slate); opacity:.75; }
.partners__logo svg { height:34px; width:auto; }

/* CTA band (service work-with-us) */
.ctaband { background:var(--paper); text-align:center; padding:var(--s10) 0; }
.ctaband h2 { font-size:var(--fs-h1); max-width:20ch; margin:18px auto 34px; }

/* =====================================================================
   CONTACT
   ===================================================================== */
.contact__map { position:relative; }
.contact__map > svg { width:100%; height:min(520px,60vh); display:block; }
.contact__card { position:absolute; left:var(--edge); top:8%;
  width:min(360px,80vw); background:var(--sage-strong); color:var(--ink); padding:44px 40px; }
.contact__card .brand { color:var(--ink); margin-bottom:80px; }
.contact__card h3 { font-size:var(--fs-h3); margin-bottom:16px; }
.contact__card a { display:block; font-weight:500; margin-bottom:8px; }
.contact-grid { display:grid; grid-template-columns:1fr 1.1fr; gap:70px; align-items:start; }
.contact-info h2 { font-size:var(--fs-h2); margin:16px 0 20px; }
.contact-info p { color:var(--slate); margin-bottom:26px; }
.contact-rows { list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:20px; }
.contact-rows li { display:flex; gap:16px; align-items:flex-start; }
.contact-rows .ci { width:44px; height:44px; flex:none; background:var(--accent-light); color:var(--accent);
  display:flex; align-items:center; justify-content:center; }
.contact-rows .ci .ico { width:20px; height:20px; }
.contact-rows dt { font-weight:500; }
.contact-rows dd { margin:2px 0 0; color:var(--slate); }
.formcard { background:#fff; border:1px solid var(--line); padding:40px; box-shadow:var(--sh-1); }
.field { margin-bottom:18px; }
.field label { display:block; font-weight:500; font-size:var(--fs-small); margin-bottom:8px; }
.field input, .field select, .field textarea { width:100%; padding:14px 16px; border:1px solid var(--line);
  background:#fff; font-family:inherit; font-size:1rem; color:var(--ink); }
.field textarea { min-height:130px; resize:vertical; }
.form__consent { color:var(--slate); font-size:0.82rem; margin-top:14px; }
.form__success { display:none; padding:20px; background:var(--accent-light); border-left:3px solid var(--accent); }
.form__success.show { display:block; }

/* =====================================================================
   REVEALS + REDUCED MOTION
   ===================================================================== */
.reveal { opacity:0; transform:translateY(24px); transition:opacity 600ms var(--ease), transform 600ms var(--ease);
  transition-delay:calc(var(--i,0) * 80ms); }
.reveal.in { opacity:1; transform:none; }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior:auto; }
  *, *::before, *::after { animation-duration:.001ms !important; transition-duration:.001ms !important; }
  .reveal { opacity:1; transform:none; }
  .testi__slides { transition:none; }
}

/* =====================================================================
   RESPONSIVE
   ===================================================================== */
@media (max-width:1100px) {
  .footer__top { grid-template-columns:1fr 1fr 1fr; }
  .footer__brand { grid-column:1 / -1; }
}
@media (max-width:980px) {
  :root { --edge:clamp(20px,6vw,44px); }
  .hero__rule, .hero__sub { margin-left:0; }
  .nav, .header-search { display:none; }
  .nav-toggle { display:flex; }
  .header-cta { display:none; }
  .processband .wrap { grid-template-columns:1fr; gap:0; }
  .proc-panel { padding:var(--s10) var(--gutter) var(--s10) 0; margin-right:calc(var(--gutter) * -1); }
  .feat-intro { padding-top:0; }
  .feat-intro .btn { margin-top:24px; }
  .servicerows { margin-left:0; }
  .srow { grid-template-columns:1fr; }
  .srow__body { padding:60px var(--edge); }
  .srow__photo { height:320px; }
  .stats__panel { grid-template-columns:1fr; gap:40px; }
  .spec__grid { grid-template-columns:1fr; }
  .spec__photo { min-height:340px; }
  .spec__body { padding:60px var(--edge); }
  .testi__slide { grid-template-columns:1fr; gap:30px; }
  .testi__photo { width:100%; height:340px; }
  .testi__arrow--prev { left:0; } .testi__arrow--next { right:0; }
  .blog__grid { grid-template-columns:1fr; gap:36px; }
  .teamgrid { grid-template-columns:1fr 1fr; }
  .feature { grid-template-columns:1fr; gap:36px; }
  .feature--rev .feature__media { order:0; }
  .contact-grid { grid-template-columns:1fr; gap:40px; }
  .pagehead__top { grid-template-columns:1fr; gap:16px; }
  .pagehead__split { grid-template-columns:1fr; gap:30px; }
  .prefoot .wrap { grid-template-columns:1fr; }
  .footer__top { grid-template-columns:1fr 1fr; }
  .contact__card { position:static; transform:none; width:100%; }
  .contact__map > svg { height:320px; }
}
@media (max-width:620px) {
  :root { --s10:72px; }
  .proc-grid { grid-template-columns:1fr 1fr; gap:34px 26px; }
  .proc-photo { grid-column:1 / 3; grid-row:auto; }
  .hero__panel { position:static; width:100%; }
  .hero__inner { padding-block:120px 0; justify-content:flex-end; }
  .hero { min-height:auto; }
  .hero__photo::after { content:""; position:absolute; inset:0;
    background:linear-gradient(180deg, rgba(18,18,18,.25) 0%, rgba(18,18,18,.55) 60%, rgba(18,18,18,.8) 100%); }
  .hero__inner, .hero__panel p, .hero__copy { position:relative; z-index:2; }
  .blog__head { flex-direction:column; align-items:flex-start; }
  .teamgrid { grid-template-columns:1fr; }
  .footer__top { grid-template-columns:1fr; }
  .numrow { grid-template-columns:40px 1fr; }
  .numrow__arrow { display:none; }
  .prefoot__hours, .prefoot__cta { padding:26px var(--gutter); }
}