/* GreenMét — production stylesheet (design-system tokens + site) */
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700&family=IBM+Plex+Sans:wght@400;500;600;700&family=IBM+Plex+Mono:wght@400;500&display=swap');

/* colors */
/* GreenMét — Color System
 * Derived from the logo: deep forest green (wordmark + leaf vein),
 * cool slate-green (outer leaves + "Met"), vivid leaf-lime (center leaf), cool neutrals.
 */
:root{
  /* ---- Forest (primary) — environmental depth, stability, trust ---- */
  --forest-50:#F1F7F3; --forest-100:#DCEBE2; --forest-200:#B9D7C6; --forest-300:#8FBFA6;
  --forest-400:#5CA07F; --forest-500:#2F805A; --forest-600:#1F6446; --forest-700:#184830;
  --forest-800:#123726; --forest-900:#0C2619;

  /* ---- Leaf (accent) — growth, life, sustainability. Use sparingly. ---- */
  --leaf-50:#F5FAE8; --leaf-100:#E9F3CB; --leaf-200:#D3E79A; --leaf-300:#B8D962;
  --leaf-400:#9BC633; --leaf-500:#78A800; --leaf-600:#628A00; --leaf-700:#4C6C00; --leaf-800:#3A5200;

  /* ---- Steel (secondary) — metallurgy, precision, the industrial "Met" ---- */
  --steel-50:#F3F6F5; --steel-100:#E5EBEA; --steel-200:#CBD6D4; --steel-300:#A7B7B5;
  --steel-400:#7E9391; --steel-500:#5E7472; --steel-600:#47605F; --steel-700:#394D4C;
  --steel-800:#2A3938; --steel-900:#1B2625;

  /* ---- Neutral (cool gray) ---- */
  --neutral-0:#FFFFFF; --neutral-50:#F7F8F8; --neutral-100:#EFF1F1; --neutral-200:#E2E5E5;
  --neutral-300:#CDD2D2; --neutral-400:#A0A7A7; --neutral-500:#737A7A; --neutral-600:#565C5C;
  --neutral-700:#3F4444; --neutral-800:#2B2F2F; --neutral-900:#191C1C;

  /* ---- Semantic ---- */
  --success-500:#1F7A4D; --success-600:#186340; --success-50:#E7F3EC;
  --warning-500:#B4791A; --warning-600:#946014; --warning-50:#FBF1E0;
  --danger-500:#B23B32;  --danger-600:#8F2E27;  --danger-50:#F8E9E7;
  --info-500:#2F6F82;    --info-600:#255767;    --info-50:#E5F0F3;
}
/* typography */
/* GreenMét — Typography scale
 * Display/brand: Poppins (echoes the geometric logo wordmark).
 * Body/UI: IBM Plex Sans (engineered, precise, legible).
 * Data/technical: IBM Plex Mono.
 */
:root{
  --font-display:'Poppins','Segoe UI',system-ui,sans-serif;
  --font-body:'IBM Plex Sans','Segoe UI',system-ui,sans-serif;
  --font-mono:'IBM Plex Mono','SFMono-Regular',ui-monospace,monospace;

  --weight-regular:400; --weight-medium:500; --weight-semibold:600; --weight-bold:700;

  /* Type scale — 1.250 major-third, base 16px */
  --text-2xs:0.6875rem; /*11*/ --text-xs:0.75rem; /*12*/ --text-sm:0.875rem; /*14*/
  --text-base:1rem; /*16*/ --text-lg:1.125rem; /*18*/ --text-xl:1.375rem; /*22*/
  --text-2xl:1.75rem; /*28*/ --text-3xl:2.1875rem; /*35*/ --text-4xl:2.75rem; /*44*/
  --text-5xl:3.4375rem; /*55*/ --text-6xl:4.25rem; /*68*/

  --leading-tight:1.1; --leading-snug:1.25; --leading-normal:1.5; --leading-relaxed:1.65;
  --tracking-tight:-0.02em; --tracking-snug:-0.01em; --tracking-normal:0; --tracking-wide:0.04em; --tracking-caps:0.12em;
}
/* spacing */
/* GreenMét — Spacing scale (4px base grid) */
:root{
  --space-0:0; --space-1:0.25rem; --space-2:0.5rem; --space-3:0.75rem; --space-4:1rem;
  --space-5:1.5rem; --space-6:2rem; --space-7:2.5rem; --space-8:3rem; --space-9:4rem;
  --space-10:5rem; --space-11:6rem; --space-12:8rem;
  /* Layout */
  --container-max:1280px; --container-narrow:768px; --gutter:1.5rem; --section-y:6rem;
}
/* radius */
/* GreenMét — Border radius. Restrained, engineered — never pill-soft on structure. */
:root{
  --radius-none:0; --radius-xs:2px; --radius-sm:4px; --radius-md:6px; --radius-lg:10px;
  --radius-xl:16px; --radius-2xl:24px; --radius-full:999px;
}
/* shadows */
/* GreenMét — Elevation. Soft, cool-tinted, low-spread. Premium restraint. */
:root{
  --shadow-xs:0 1px 2px rgba(12,38,25,0.06);
  --shadow-sm:0 1px 3px rgba(12,38,25,0.08),0 1px 2px rgba(12,38,25,0.04);
  --shadow-md:0 4px 12px rgba(12,38,25,0.08),0 2px 4px rgba(12,38,25,0.05);
  --shadow-lg:0 12px 28px rgba(12,38,25,0.10),0 4px 10px rgba(12,38,25,0.05);
  --shadow-xl:0 24px 56px rgba(12,38,25,0.14),0 8px 20px rgba(12,38,25,0.06);
  --shadow-focus:0 0 0 3px rgba(120,168,0,0.35);
  --shadow-inset:inset 0 1px 2px rgba(12,38,25,0.06);
}
/* motion */
/* GreenMét — Motion. Calm, precise, engineered. No bounce. */
:root{
  --ease-standard:cubic-bezier(0.4,0,0.2,1); /* @kind other */
  --ease-out:cubic-bezier(0.16,1,0.3,1); /* @kind other */
  --ease-in:cubic-bezier(0.4,0,1,1); /* @kind other */
  --duration-fast:120ms; /* @kind other */
  --duration-base:200ms; /* @kind other */
  --duration-slow:320ms; /* @kind other */
  --duration-slower:520ms; /* @kind other */
}

/* semantic */
/* GreenMét — Semantic aliases (role tokens). Consume these, not raw scales. */
:root{
  --brand:var(--forest-700); --brand-strong:var(--forest-800); --brand-deep:var(--forest-900);
  --brand-hover:var(--forest-600); --accent:var(--leaf-500); --accent-hover:var(--leaf-600);
  --secondary:var(--steel-600);

  /* Text */
  --text-strong:var(--forest-900); --text-body:var(--neutral-800); --text-muted:var(--neutral-600);
  --text-subtle:var(--neutral-500); --text-inverse:var(--neutral-0); --text-accent:var(--forest-700);
  --text-on-brand:#EAF3EE; --text-link:var(--forest-700); --text-link-hover:var(--forest-600);

  /* Surfaces */
  --surface-page:var(--neutral-0); --surface-subtle:var(--neutral-50); --surface-muted:var(--neutral-100);
  --surface-card:var(--neutral-0); --surface-brand:var(--forest-700); --surface-inverse:var(--forest-900);
  --surface-accent-tint:var(--leaf-50); --surface-brand-tint:var(--forest-50);

  /* Borders */
  --border-subtle:var(--neutral-200); --border-default:var(--neutral-300); --border-strong:var(--neutral-400);
  --border-brand:var(--forest-700); --focus-ring:var(--leaf-500);
}
/* fonts */
/* GreenMét — Webfonts (Google Fonts).
 * NOTE: the exact logo wordmark font is proprietary/unknown; Poppins is the nearest common match.
 */

/* base */
/* GreenMét — Base element defaults */
:root{ color-scheme:light; }
*{ box-sizing:border-box; }
body{
  margin:0; font-family:var(--font-body); font-size:var(--text-base);
  line-height:var(--leading-normal); color:var(--text-body);
  background:var(--surface-page); -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
}
h1,h2,h3,h4,h5{ font-family:var(--font-display); color:var(--text-strong); margin:0 0 0.4em; line-height:var(--leading-tight); letter-spacing:var(--tracking-tight); font-weight:var(--weight-semibold); }
h1{ font-size:var(--text-4xl); } h2{ font-size:var(--text-3xl); } h3{ font-size:var(--text-2xl); }
h4{ font-size:var(--text-xl); } h5{ font-size:var(--text-lg); }
p{ margin:0 0 1em; }
a{ color:var(--text-link); text-decoration:none; transition:color var(--duration-fast) var(--ease-standard); }
a:hover{ color:var(--text-link-hover); text-decoration:underline; text-underline-offset:2px; }
:focus-visible{ outline:2px solid var(--focus-ring); outline-offset:2px; }
code,kbd,samp{ font-family:var(--font-mono); font-size:0.9em; }
::selection{ background:var(--leaf-200); color:var(--forest-900); }
@keyframes gm-spin{ to{ transform:rotate(360deg); } }
@keyframes gm-fade-in{ from{ opacity:0; transform:translateY(6px); } to{ opacity:1; transform:none; } }
/* ---- site ---- */

:root{ --e:cubic-bezier(.16,1,.3,1); }
*{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{ margin:0; background:#fff; }
a{ color:var(--forest-700); } a:hover{ color:var(--forest-500); }
#services,#expertise,#founder,#contact{ scroll-margin-top:92px; }
.gmw{ max-width:1280px; margin:0 auto; padding:0 clamp(24px,5vw,64px); }
.gsec{ padding:clamp(88px,13vh,168px) 0; }
.eyebrow{ font-family:'IBM Plex Mono',monospace; font-size:12px; letter-spacing:0.22em; text-transform:uppercase; color:var(--steel-600); display:flex; align-items:center; gap:14px; }
.eyebrow::before{ content:''; width:26px; height:1px; background:var(--leaf-600); display:inline-block; }
.eyebrow.on-dark{ color:rgba(255,255,255,0.6); }
.eyebrow.on-dark::before{ background:var(--leaf-400); }
.reveal{ opacity:1; transform:none; }
.reveal.in{ opacity:1; transform:none; }
.stagger>*{ opacity:1; transform:none; }
.stagger.in>*{ opacity:1; transform:none; }
.clip{ clip-path:none; }
.clip.in{ clip-path:none; }
.clip>img,.clip>div>img{ transform:none; }
.clip.in>img,.clip.in>div>img{ transform:none; }
.ml{ display:block; }
.ml>span{ display:block; transform:none; }
.ml.in>span{ transform:none; }
.svc-row{ transition:background .45s var(--e); }
.svc-row:hover{ background:var(--neutral-50); }
.svc-row:hover .svc-ar{ transform:translateX(8px); color:var(--leaf-700); }
.svc-row:hover .svc-t{ color:var(--forest-600); }
.svc-ar{ transition:transform .45s var(--e), color .3s; }
.svc-t{ transition:color .35s; }
.idx-row{ transition:padding-left .4s var(--e), color .3s; }
.idx-row:hover{ padding-left:12px; color:var(--forest-700); }
.gm-pbtn .gm-pbtn-sheen{ position:absolute; inset:0; border-radius:inherit; background:linear-gradient(120deg,transparent 25%,rgba(255,255,255,0.22) 50%,transparent 75%); transform:translateX(-130%); transition:transform .85s var(--e); pointer-events:none; }
.gm-pbtn:hover .gm-pbtn-sheen{ transform:translateX(130%); }
.gm-pbtn:hover{ transform:translateY(-2px); }
.gm-pbtn .gm-pbtn-ar{ transition:transform .4s var(--e); }
.gm-pbtn:hover .gm-pbtn-ar{ transform:translateX(4px); }
.gm-pbtn:focus-visible{ outline:2px solid var(--leaf-400); outline-offset:3px; }
.gm-logorow img{ height:clamp(44px,4.6vw,64px); width:auto; max-width:230px; object-fit:contain; filter:grayscale(1) opacity(0.6); transition:filter .5s var(--e); }
.gm-logorow img.gm-logo-lg{ height:clamp(74px,8vw,112px); max-width:150px; }
.gm-logorow img.gm-logo-wide{ height:auto; width:clamp(150px,17vw,232px); max-width:232px; }
.gm-logorow img:hover{ filter:grayscale(0) opacity(1); }
.gm-fcol a{ color:rgba(255,255,255,0.6); text-decoration:none; transition:color .25s, padding-left .3s var(--e); }
.gm-fcol a:hover{ color:#fff; padding-left:3px; }
.gm-fsoc a{ transition:color .3s,border-color .3s,background .3s,transform .3s; }
.gm-fsoc a:hover{ color:#fff; border-color:var(--leaf-400); background:rgba(255,255,255,0.06); transform:translateY(-2px); }
.gm-skip{ position:fixed; left:16px; top:-56px; z-index:200; background:var(--forest-800); color:#fff; padding:10px 16px; border-radius:4px; font-family:'IBM Plex Sans',sans-serif; font-size:14px; text-decoration:none; transition:top .2s; }
.gm-skip:focus{ top:16px; }
@media (max-width:900px){ .gm-2{ grid-template-columns:1fr !important; } .gm-svc{ grid-template-columns:auto 1fr !important; } .gm-svc .svc-d{ grid-column:1 / -1 !important; padding-top:8px; } .gm-sticky{ position:static !important; top:auto !important; } }
@media (max-width:760px){ .gm-fieldrow{ grid-template-columns:1fr 1fr !important; height:auto !important; } .gm-fieldrow figure{ height:auto !important; aspect-ratio:4/3; } .gm-fieldrow figure:first-child{ grid-column:1 / -1; aspect-ratio:16/9; } }
@media (max-width:640px){ .gm-statrow{ grid-template-columns:1fr !important; } .gm-statcell{ padding:22px 0 0 !important; } }
.gm-statcell + .gm-statcell{ border-left:1px solid var(--neutral-200); padding-left:clamp(28px,3.4vw,56px); }
@media (max-width:640px){ .gm-statcell + .gm-statcell{ border-left:none !important; padding-left:0 !important; border-top:1px solid var(--neutral-200); } }
@media (max-width:820px){ .gm-foot-grid{ grid-template-columns:1fr 1fr !important; gap:40px 32px !important; } .gm-foot-brand{ grid-column:1 / -1; max-width:none !important; } .gm-foot-end{ align-items:flex-start !important; text-align:left !important; } }

.gm-fld{ height:46px; padding:0 14px; width:100%; box-sizing:border-box; background:rgba(255,255,255,0.05); border:1px solid rgba(255,255,255,0.16); border-radius:4px; color:#fff; font-family:'IBM Plex Sans',sans-serif; font-size:15px; outline:none; transition:border-color .25s, box-shadow .25s, background .25s; }
textarea.gm-fld{ height:auto; min-height:104px; padding:12px 14px; resize:vertical; line-height:1.5; }
.gm-fld::placeholder{ color:rgba(255,255,255,0.42); }
.gm-fld:focus{ border-color:var(--leaf-400); box-shadow:0 0 0 3px rgba(155,198,51,0.20); background:rgba(255,255,255,0.08); }
.gm-fld option{ color:#141c19; }
.gm-submit:hover{ background:var(--leaf-400) !important; transform:translateY(-2px); }
.gm-submit:focus-visible{ outline:2px solid var(--leaf-300); outline-offset:3px; }
.gm-submit:disabled{ cursor:default; }
@media (max-width:540px){ .gm-frow{ grid-template-columns:1fr !important; } }
@media (max-width:900px){ .clip{ clip-path:none !important; } .clip>img,.clip>div>img{ transform:none !important; } .reveal,.stagger>*{ opacity:1 !important; transform:none !important; } }

.gm-nav{ position:fixed; top:0; left:0; right:0; z-index:100; transition:transform .45s var(--e),background .35s,box-shadow .35s,border-color .35s; border-bottom:1px solid transparent; }
.gm-nav.is-hidden{ transform:translateY(-105%); }
.gm-nav-in{ max-width:1280px; margin:0 auto; padding:0 clamp(24px,5vw,64px); height:76px; display:flex; align-items:center; justify-content:space-between; gap:32px; }
.gm-nav.is-solid{ background:rgba(255,255,255,0.82); backdrop-filter:saturate(140%) blur(14px); -webkit-backdrop-filter:saturate(140%) blur(14px); border-bottom-color:rgba(20,55,38,0.1); box-shadow:0 6px 24px rgba(12,38,25,0.06); }
.gm-brand{ display:inline-flex; align-items:center; height:46px; text-decoration:none; }
.gm-logo{ height:42px; width:auto; display:block; }
.gm-logo-dark{ display:none; }
.gm-nav.is-solid .gm-logo-light{ display:none; }
.gm-nav.is-solid .gm-logo-dark{ display:block; }
.gm-links{ display:flex; align-items:center; gap:clamp(24px,3vw,40px); }
.gm-links a{ font-family:'IBM Plex Sans',sans-serif; font-weight:500; font-size:14.5px; text-decoration:none; color:rgba(255,255,255,0.82); padding-bottom:5px; background-image:linear-gradient(var(--leaf-400),var(--leaf-400)); background-repeat:no-repeat; background-position:0 100%; background-size:0 2px; transition:background-size .35s var(--e),color .3s; }
.gm-links a:hover,.gm-links a.is-active{ background-size:100% 2px; }
.gm-nav.is-solid .gm-links a{ color:var(--neutral-600); }
.gm-nav.is-solid .gm-links a.is-active{ color:var(--forest-800); }
.gm-nav-right{ display:flex; align-items:center; gap:16px; }
.gm-nav-cta{ display:inline-flex; align-items:center; justify-content:center; height:40px; padding:0 20px; border-radius:var(--radius-sm); font-family:'IBM Plex Sans',sans-serif; font-weight:600; font-size:14px; text-decoration:none; border:1px solid rgba(255,255,255,0.55); background:rgba(255,255,255,0.06); color:#fff; transition:background .3s,border-color .3s,filter .2s; }
.gm-nav-cta:hover{ filter:brightness(1.08); }
.gm-nav.is-solid .gm-nav-cta{ background:var(--forest-700); border-color:transparent; color:#fff; box-shadow:0 1px 2px rgba(12,38,25,0.12); }
.gm-nav-prog{ position:absolute; left:0; top:0; height:3px; width:100%; pointer-events:none; }
.gm-nav-prog>i{ display:block; height:100%; width:100%; transform:scaleX(0); transform-origin:0 50%; background:linear-gradient(90deg,var(--leaf-600),var(--leaf-400)); box-shadow:0 0 10px rgba(120,168,0,0.45); }
.gm-burger{ display:none; width:44px; height:44px; background:none; border:none; cursor:pointer; flex-direction:column; justify-content:center; align-items:center; gap:5px; padding:0; }
.gm-burger span{ display:block; width:22px; height:2px; background:#fff; transition:transform .3s,opacity .3s,background .3s; }
.gm-nav.is-solid .gm-burger span{ background:var(--forest-800); }
.gm-burger.is-open span:nth-child(1){ transform:translateY(7px) rotate(45deg); }
.gm-burger.is-open span:nth-child(2){ opacity:0; }
.gm-burger.is-open span:nth-child(3){ transform:translateY(-7px) rotate(-45deg); }
.gm-mnav{ overflow:hidden; max-height:0; opacity:0; transition:max-height .5s var(--e),opacity .35s; background:#fff; border-top:1px solid transparent; display:flex; flex-direction:column; padding:0 clamp(24px,5vw,64px); }
.gm-mnav.is-open{ max-height:560px; opacity:1; border-top-color:var(--neutral-200); box-shadow:0 20px 40px -18px rgba(12,38,25,0.22); padding-top:8px; padding-bottom:22px; }
.gm-mnav>a{ font-family:Poppins,sans-serif; font-weight:500; font-size:18px; color:var(--forest-800); text-decoration:none; padding:15px 0; border-bottom:1px solid var(--neutral-100); }
.gm-mnav-contact{ display:flex; flex-direction:column; gap:8px; padding:16px 0 4px; }
.gm-mnav-contact a{ font-family:'IBM Plex Sans',sans-serif; font-size:15px; color:var(--neutral-700); text-decoration:none; padding:3px 0; }
.gm-mnav-cta{ margin-top:16px; display:inline-flex; align-items:center; justify-content:center; height:50px; border-radius:var(--radius-sm); background:var(--leaf-500); color:var(--forest-900); font-family:'IBM Plex Sans',sans-serif; font-weight:600; font-size:15px; text-decoration:none; }
@media (max-width:880px){ .gm-links{ display:none; } .gm-nav-cta{ display:none; } .gm-burger{ display:flex; } }
.gm-scrollcue{ position:absolute; left:50%; bottom:22px; transform:translateX(-50%); z-index:5; display:flex; flex-direction:column; align-items:center; gap:9px; text-decoration:none; opacity:0; animation:gm-cue-in .6s var(--e) 1.1s forwards; }
.gm-scrollcue span{ font-family:'IBM Plex Mono',monospace; font-size:10px; letter-spacing:0.26em; text-transform:uppercase; color:rgba(255,255,255,0.55); }
.gm-scrollcue i{ display:block; width:1px; height:34px; background:linear-gradient(rgba(255,255,255,0.55),rgba(255,255,255,0)); animation:gm-cue 2.4s ease-in-out infinite; }
@keyframes gm-cue{ 0%{ transform:translateY(0); opacity:.9; } 50%{ transform:translateY(8px); opacity:.35; } 100%{ transform:translateY(0); opacity:.9; } }
@keyframes gm-cue-in{ to{ opacity:1; } }
@media (max-height:760px){ .gm-scrollcue{ display:none; } }
@media (prefers-reduced-motion: reduce){ .reveal,.stagger>*,.ml>span,.clip,.clip>img{ transition:none !important; opacity:1 !important; transform:none !important; clip-path:none !important; } html{ scroll-behavior:auto; } .gm-scrollcue{ animation:none !important; opacity:1 !important; } .gm-scrollcue i{ animation:none !important; } }