/* ============================================================
   EVERGREEN TALENTS — Design System as Code (tokens + base)
   Source of truth: 06 Clients/Evergreen Talents/Evergreen Talents Branding.md
   Luxury-editorial modelling agency. Playfair + Inter. ONE accent = gold.
   Sharp corners. No gradients. "Subtract rather than add."
   ============================================================ */

:root {
  /* --- Colour (LOCKED) --- */
  --et-ink:        #141414;  /* primary text, headings, dark UI */
  --et-gold:       #D5AD5F;  /* THE only accent — buttons, rules, labels */
  --et-gold-dark:  #C2994B;  /* hover / link states */
  --et-dark:       #1C1C1C;  /* dark section background */
  --et-white:      #FFFFFF;  /* page background */
  --et-divider:    #333333;  /* structural borders */
  --et-muted:      #888888;  /* secondary text, captions */
  --et-line:       #DFDFDF;  /* light borders / hairlines */
  --et-section:    #F2F2F2;  /* light section fill */
  --et-offwhite:   #FBFBFB;  /* soft card fill */
  /* gold as translucent for hairlines on dark */
  --et-gold-15:    rgba(213,173,95,.15);
  --et-gold-30:    rgba(213,173,95,.30);
  --et-gold-50:    rgba(213,173,95,.50);

  /* --- Type (LOCKED) --- */
  --et-serif: 'Playfair Display', Georgia, 'Times New Roman', serif;
  --et-sans:  'Inter', 'Helvetica Neue', Arial, sans-serif;

  /* fluid type scale — editorial, generous */
  --t-display: clamp(2.8rem, 1.6rem + 5.4vw, 6rem);     /* hero H1 */
  --t-h1:      clamp(2.2rem, 1.4rem + 3.4vw, 3.6rem);
  --t-h2:      clamp(1.8rem, 1.2rem + 2.6vw, 2.9rem);
  --t-h3:      clamp(1.3rem, 1.05rem + 1.1vw, 1.8rem);
  --t-h4:      clamp(1.1rem, 1rem + 0.5vw, 1.35rem);
  --t-body:    clamp(1rem, 0.96rem + 0.18vw, 1.0625rem); /* ~16-17px */
  --t-small:   0.875rem;
  --t-label:   0.6875rem;   /* 11px overline / H5 pattern */

  /* --- Space scale (8pt-ish, fluid) --- */
  --s1: 0.5rem;  --s2: 1rem;   --s3: 1.5rem;  --s4: 2rem;
  --s5: 3rem;    --s6: 4rem;   --s7: 6rem;    --s8: 8rem;
  --s-sec: clamp(4rem, 2.5rem + 6vw, 9rem);   /* vertical section rhythm */

  /* --- Layout --- */
  --maxw: 1400px;        /* Elementor container parity */
  --maxw-text: 62ch;
  --gutter: clamp(1.25rem, 0.5rem + 3vw, 3.5rem);

  /* --- Misc (LOCKED: sharp corners, no soft depth) --- */
  --radius: 0px;
  --rule: 1px solid var(--et-line);
  --rule-gold: 1px solid var(--et-gold);
  --ease: cubic-bezier(0.22, 1, 0.36, 1);
  --dur: 0.6s;
}

/* ---------- reset ---------- */
*,*::before,*::after { box-sizing: border-box; }
* { margin: 0; }
html { -webkit-text-size-adjust: 100%; }
body {
  font-family: var(--et-sans);
  font-size: var(--t-body);
  line-height: 1.75;
  color: var(--et-ink);
  background: var(--et-white);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
img,svg,video { display: block; max-width: 100%; height: auto; }
a { color: inherit; text-decoration: none; }
button { font: inherit; color: inherit; cursor: pointer; border: 0; background: none; }
ul { list-style: none; padding: 0; }

/* ---------- type ---------- */
h1,h2,h3,h4 { font-family: var(--et-serif); font-weight: 400; line-height: 1.08; letter-spacing: -0.01em; }
h1 { font-size: var(--t-h1); }
h2 { font-size: var(--t-h2); }
h3 { font-size: var(--t-h3); line-height: 1.25; }
h4 { font-size: var(--t-h4); }
p  { max-width: var(--maxw-text); }

/* The H5 / overline / eyebrow pattern (LOCKED spec) */
.et-eyebrow {
  font-family: var(--et-sans);
  font-size: var(--t-label);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.18em;
  color: var(--et-gold);
  display: inline-block;
}

/* ---------- layout helpers ---------- */
.et-wrap { width: min(100% - (var(--gutter) * 2), var(--maxw)); margin-inline: auto; }
.et-narrow { width: min(100% - (var(--gutter) * 2), 880px); margin-inline: auto; }
.et-section { padding-block: var(--s-sec); }

/* ---------- buttons (LOCKED specs) ---------- */
.et-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: .6em;
  font-family: var(--et-sans);
  font-size: var(--t-label);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.18em;
  line-height: 1;
  padding: 16px 40px;
  border-radius: var(--radius);
  border: 1px solid var(--et-gold);
  background: var(--et-gold);
  color: var(--et-white);
  transition: background var(--dur) var(--ease), color var(--dur) var(--ease), border-color var(--dur) var(--ease);
}
.et-btn:hover { background: var(--et-ink); color: var(--et-gold); border-color: var(--et-ink); }

/* ghost / secondary */
.et-btn--ghost { background: transparent; color: var(--et-ink); border-color: var(--et-ink); }
.et-btn--ghost:hover { background: var(--et-ink); color: var(--et-gold); border-color: var(--et-ink); }

/* on dark backgrounds */
.et-on-dark .et-btn--ghost { color: var(--et-gold); border-color: var(--et-gold); }
.et-on-dark .et-btn--ghost:hover { background: var(--et-gold); color: var(--et-ink); }

/* ---------- a quiet gold hairline divider ---------- */
.et-rule-gold { width: 56px; height: 1px; background: var(--et-gold); border: 0; }

/* ---------- motion: reveal-on-scroll base ---------- */
.et-reveal { opacity: 0; transform: translateY(24px); }
.et-reveal.is-in { opacity: 1; transform: none; transition: opacity 0.9s var(--ease), transform 0.9s var(--ease); }
@media (prefers-reduced-motion: reduce) {
  .et-reveal { opacity: 1 !important; transform: none !important; }
  * { scroll-behavior: auto !important; }
}

/* ============================================================
   GHL host-reset (harmless standalone) — bake into <style> when
   deploying into a GHL Custom-Code page. See ghl_custom_page_deploy.
   ============================================================ */
.c-section,.fullSection,.c-row,.c-column,
.c-section>.inner,.c-row>.inner,.c-column>.inner { padding:0 !important; margin:0 !important; }
.c-row,.c-column,.c-row>.inner,.c-column>.inner,.c-section>.inner { max-width:none !important; width:100% !important; }
.bgCover,.bg-fixed { background: var(--et-white) !important; }