/* ============================================================================
   GHS Law — design system
   Tokens from docs/design.md, synced from the approved Claude Design project.
   Fonts are self-hosted (see /assets/fonts) because _headers sets a
   default-src 'self' CSP and BUILD-RULES.md §7 forbids CDN delivery.
   ========================================================================== */

@font-face{font-family:'Newsreader';font-style:italic;font-weight:300 400;font-display:swap;src:url('/assets/fonts/newsreader-italic-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Newsreader';font-style:italic;font-weight:300 400;font-display:swap;src:url('/assets/fonts/newsreader-italic-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Newsreader';font-style:normal;font-weight:200 600;font-display:swap;src:url('/assets/fonts/newsreader-normal-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Newsreader';font-style:normal;font-weight:200 600;font-display:swap;src:url('/assets/fonts/newsreader-normal-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:400;font-display:swap;src:url('/assets/fonts/ibm-plex-mono-400-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:400;font-display:swap;src:url('/assets/fonts/ibm-plex-mono-400-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:500;font-display:swap;src:url('/assets/fonts/ibm-plex-mono-500-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:500;font-display:swap;src:url('/assets/fonts/ibm-plex-mono-500-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}

:root {
  /* grounds */
  --ghs-bg:          #1C1A15;
  --ghs-bg-panel:    #232019;
  --ghs-bg-deep:     #141109;
  --ghs-bg-card:     #26231C;
  --ghs-bg-card-alt: #211E17;

  /* ink */
  --ghs-ink:         #ECE5D5;
  --ghs-ink-muted:   #ACA491;
  --ghs-ink-invert:  #1C1A15;

  /* accent */
  --ghs-accent:      #93A99A;
  --ghs-accent-hi:   #B4C1B7;
  --ghs-error:       #E8836F;   /* added in build — design had no error state */

  /* hairlines */
  --ghs-line:        rgba(236,229,213,.12);
  --ghs-line-strong: rgba(236,229,213,.16);
  --ghs-line-soft:   rgba(236,229,213,.10);
  --ghs-hover-wash:  rgba(237,231,218,.04);

  /* type */
  --ghs-font-display: 'Newsreader', 'Noto Serif SC', Georgia, 'Times New Roman', serif;
  --ghs-font-mono:    'IBM Plex Mono', 'Noto Sans SC', ui-monospace, SFMono-Regular, Menlo, monospace;

  --ghs-t-hero:  clamp(44px, 8.6vw, 132px);
  --ghs-t-h1:    clamp(40px, 7vw, 104px);
  --ghs-t-h1-lg: clamp(44px, 8vw, 120px);
  --ghs-t-h2:    clamp(32px, 4.6vw, 68px);
  --ghs-t-h2-sm: clamp(28px, 3.4vw, 48px);
  --ghs-t-h3:    clamp(24px, 2.9vw, 40px);
  --ghs-t-stat:  clamp(40px, 4.5vw, 60px);
  --ghs-t-lead:  clamp(17px, 1.5vw, 21px);
  --ghs-t-body:  clamp(16px, 1.25vw, 19px);
  --ghs-t-label: 12px;
  --ghs-t-nav:   11.5px;
  --ghs-t-micro: 10px;

  /* space + shape */
  --ghs-container:    1440px;
  --ghs-gutter:       clamp(20px, 4vw, 56px);
  --ghs-section-y:    clamp(80px, 14vh, 180px);
  --ghs-section-y-sm: clamp(60px, 10vh, 120px);
  --ghs-gap-lg:       clamp(40px, 7vw, 120px);
  --ghs-gap:          clamp(16px, 3vw, 48px);
  --ghs-radius-pill:  100px;
  --ghs-radius:       2px;
  --ghs-radius-card:  3px;
  --h:                88px;
}

/* ---- reset ------------------------------------------------------------- */
* { box-sizing: border-box; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  background: var(--ghs-bg);
  color: var(--ghs-ink);
  font-family: var(--ghs-font-display);
  font-size: var(--ghs-t-body);
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  overflow-x: hidden;
}
::selection { background: var(--ghs-accent); color: #17150F; }
a { color: inherit; text-decoration: none; }
img { max-width: 100%; height: auto; display: block; }
input, textarea, button, select { font-family: inherit; font-size: inherit; }
h1, h2, h3, h4 { font-weight: 300; margin: 0; }

/* Focus ring — the design defined hover states but no focus. Required. */
:focus-visible {
  outline: 2px solid var(--ghs-accent);
  outline-offset: 3px;
  border-radius: 1px;
}

.ghs-skip {
  position: absolute; left: -9999px; top: 0; z-index: 999;
  background: var(--ghs-ink); color: var(--ghs-ink-invert);
  padding: 12px 20px; font-family: var(--ghs-font-mono); font-size: 12px;
}
.ghs-skip:focus { left: 12px; top: 12px; }
.ghs-sr { position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0; }

/* ---- texture ----------------------------------------------------------- */
.ghs-grain {
  pointer-events: none; position: fixed; inset: 0; z-index: 9; opacity: .035;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)'/%3E%3C/svg%3E");
  mix-blend-mode: overlay;
}

/* ---- layout ------------------------------------------------------------ */
.ghs-container { max-width: var(--ghs-container); margin: 0 auto; padding: 0 var(--ghs-gutter); width: 100%; }
.ghs-band { padding: var(--ghs-section-y) 0; }
.ghs-band--sm     { padding: var(--ghs-section-y-sm) 0; }
.ghs-band--rule   { border-top: 1px solid var(--ghs-line); }
.ghs-band--center { text-align: center; }
.ghs-band--panel {
  background: var(--ghs-bg-panel);
  background-image: repeating-linear-gradient(135deg, rgba(236,229,213,.025) 0 1px, transparent 1px 7px);
}
.ghs-band--deep {
  background: var(--ghs-bg-deep);
  background-image: repeating-linear-gradient(135deg, rgba(236,229,213,.022) 0 1px, transparent 1px 7px);
}
.ghs-two   { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1.15fr); gap: var(--ghs-gap-lg); align-items: start; }
.ghs-split { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 24px; }
.ghs-split__main { min-width: 0; }
.ghs-measure { max-width: 62ch; }
.ghs-band--center .ghs-measure { margin-inline: auto; }
.ghs-grid { display: grid; gap: var(--ghs-gap); }
.ghs-grid--2 { grid-template-columns: repeat(2, minmax(0,1fr)); }
.ghs-grid--3 { grid-template-columns: repeat(3, minmax(0,1fr)); }
.ghs-grid--4 { grid-template-columns: repeat(4, minmax(0,1fr)); }

/* ---- type -------------------------------------------------------------- */
.ghs-eyebrow {
  font-family: var(--ghs-font-mono); font-size: var(--ghs-t-label);
  letter-spacing: .24em; text-transform: uppercase; color: var(--ghs-accent);
  margin-bottom: 22px; display: block;
}
.ghs-eyebrow--rule { display: flex; align-items: center; gap: 14px; letter-spacing: .28em; }
.ghs-eyebrow--rule::before { content: ""; width: 34px; height: 1px; background: var(--ghs-accent); flex: none; }

.ghs-h1 { font-size: var(--ghs-t-h1); line-height: .98; letter-spacing: -.02em; margin: 0 0 22px; text-wrap: balance; }
.ghs-h1--lg { font-size: var(--ghs-t-h1-lg); line-height: .94; }
.ghs-h2 { font-size: var(--ghs-t-h2); line-height: 1.02; letter-spacing: -.02em; margin: 0 0 clamp(28px,4vw,44px); text-wrap: balance; }
.ghs-h2--sm { font-size: var(--ghs-t-h2-sm); line-height: 1.15; letter-spacing: -.015em; }
.ghs-h2--display { font-size: clamp(38px, 6.5vw, 96px); line-height: .98; }
.ghs-band--center .ghs-h2 { margin-inline: auto; max-width: 18ch; }

.ghs-lead { font-size: var(--ghs-t-lead); line-height: 1.5; color: var(--ghs-ink-muted); margin: 0 0 clamp(28px,4vh,44px); max-width: 56ch; }
.ghs-band--center .ghs-lead { margin-inline: auto; }
.ghs-prose { display: flex; flex-direction: column; gap: 22px; font-size: var(--ghs-t-body); line-height: 1.6; color: var(--ghs-ink-muted); max-width: 62ch; }
.ghs-prose p { margin: 0; }
.ghs-prose a { color: var(--ghs-accent); text-decoration: underline; text-underline-offset: 3px; }
.ghs-prose a:hover { color: var(--ghs-accent-hi); }
.ghs-prose h2, .ghs-prose h3 { color: var(--ghs-ink); margin: 14px 0 0; }
.ghs-prose h2 { font-size: clamp(24px,2.6vw,34px); }
.ghs-prose h3 { font-size: clamp(20px,2vw,26px); }
.ghs-prose ul, .ghs-prose ol { margin: 0; padding-left: 1.3em; display: flex; flex-direction: column; gap: 9px; }
.ghs-prose blockquote { margin: 6px 0; padding-left: 20px; border-left: 2px solid var(--ghs-accent); color: var(--ghs-ink); font-style: italic; }

/* ---- actions ----------------------------------------------------------- */
.ghs-btn {
  display: inline-flex; align-items: center; gap: 11px;
  font-family: var(--ghs-font-mono); font-size: 12px; letter-spacing: .12em;
  text-transform: uppercase; padding: 16px 26px; border-radius: var(--ghs-radius-pill);
  border: 1px solid transparent; cursor: pointer;
  transition: background .35s, color .35s, border-color .35s, transform .35s;
}
.ghs-btn--light { background: var(--ghs-ink); color: var(--ghs-ink-invert); }
.ghs-btn--light:hover { background: var(--ghs-accent-hi); }
.ghs-btn--ghost { background: transparent; color: var(--ghs-ink); border-color: var(--ghs-line-strong); }
.ghs-btn--ghost:hover { background: var(--ghs-ink); color: var(--ghs-ink-invert); }
.ghs-btn--sm { padding: 11px 20px; font-size: 11px; }
.ghs-btn__arrow { font-size: 14px; line-height: 1; }
.ghs-link {
  font-family: var(--ghs-font-mono); font-size: var(--ghs-t-nav); letter-spacing: .14em;
  text-transform: uppercase; border-bottom: 1px solid var(--ghs-ink); padding-bottom: 5px;
  transition: color .3s, border-color .3s; white-space: nowrap;
}
.ghs-link:hover { color: var(--ghs-accent); border-color: var(--ghs-accent); }

/* ---- header ------------------------------------------------------------ */
.ghs-header {
  position: fixed; top: 0; left: 0; right: 0; z-index: 40; height: var(--h);
  display: flex; align-items: center;
  transition: background .4s, border-color .4s, backdrop-filter .4s;
  border-bottom: 1px solid transparent;
}
.ghs-header.is-scrolled {
  background: rgba(28,26,21,.86); backdrop-filter: blur(14px);
  border-bottom-color: var(--ghs-line);
}
.ghs-header__inner { display: flex; align-items: center; justify-content: space-between; gap: 24px; width: 100%; }
.ghs-wordmark { display: flex; align-items: baseline; gap: 12px; flex: none; }
.ghs-wordmark__mark { font-family: var(--ghs-font-mono); font-weight: 500; letter-spacing: .28em; font-size: 15px; }
.ghs-wordmark__full { font-family: var(--ghs-font-mono); font-size: 9.5px; letter-spacing: .24em; text-transform: uppercase; opacity: .5; }

.ghs-nav { display: flex; align-items: center; gap: clamp(14px,2.4vw,34px);
  font-family: var(--ghs-font-mono); font-size: var(--ghs-t-nav);
  letter-spacing: .14em; text-transform: uppercase; white-space: nowrap; }
.ghs-nav > li { list-style: none; position: relative; }
.ghs-nav ul { list-style: none; margin: 0; padding: 0; }
.ghs-nav__link { padding: 6px 0; opacity: .85; transition: opacity .3s; display: inline-flex; align-items: center; gap: 6px; }
.ghs-nav__link:hover, .ghs-nav__link[aria-current="page"] { opacity: 1; }
.ghs-nav__link[aria-current="page"] { color: var(--ghs-accent); }

.ghs-nav__has-sub > .ghs-nav__sub {
  position: absolute; top: 100%; left: -20px; padding-top: 14px; width: 340px;
  opacity: 0; visibility: hidden; transform: translateY(-6px);
  transition: opacity .28s, transform .28s, visibility .28s;
}
.ghs-nav__has-sub:hover > .ghs-nav__sub,
.ghs-nav__has-sub:focus-within > .ghs-nav__sub { opacity: 1; visibility: visible; transform: none; }
.ghs-nav__sub-inner {
  background: var(--ghs-bg-panel); border: 1px solid var(--ghs-line-soft);
  border-radius: var(--ghs-radius); padding: 14px 6px;
  box-shadow: 0 30px 60px -20px rgba(0,0,0,.5);
}
.ghs-nav__sub a {
  display: flex; align-items: baseline; gap: 14px; padding: 9px 20px;
  text-transform: none; letter-spacing: 0; transition: background .25s;
}
.ghs-nav__sub a:hover { background: rgba(255,255,255,.06); }
.ghs-nav__sub-n { font-family: var(--ghs-font-mono); font-size: 10px; opacity: .4; width: 20px; flex: none; }
.ghs-nav__sub-t { font-family: var(--ghs-font-display); font-size: 16px; }
.ghs-caret { font-size: 8px; transition: transform .3s; }
.ghs-nav__has-sub:hover .ghs-caret { transform: rotate(180deg); }

.ghs-header__end { display: flex; align-items: center; gap: 18px; flex: none; }
.ghs-tel { font-family: var(--ghs-font-mono); font-size: 11.5px; letter-spacing: .08em; opacity: .8; transition: opacity .3s, color .3s; }
.ghs-tel:hover { opacity: 1; color: var(--ghs-accent); }

.ghs-burger { display: none; background: none; border: 0; color: inherit; cursor: pointer; padding: 8px; }
.ghs-burger span { display: block; width: 22px; height: 1px; background: currentColor; margin: 5px 0; transition: transform .3s, opacity .3s; }
.ghs-header.is-open .ghs-burger span:nth-child(1) { transform: translateY(6px) rotate(45deg); }
.ghs-header.is-open .ghs-burger span:nth-child(2) { opacity: 0; }
.ghs-header.is-open .ghs-burger span:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }

/* ---- hero -------------------------------------------------------------- */
.ghs-hero {
  position: relative; min-height: 100vh; min-height: 100svh;
  display: flex; flex-direction: column; justify-content: flex-end;
  padding: calc(var(--h) + 40px) var(--ghs-gutter) clamp(48px,7vh,90px);
  overflow: hidden;
}
.ghs-hero__canvas { position: absolute; inset: 0; width: 100%; height: 100%; z-index: 0; }
.ghs-hero__scrim {
  position: absolute; inset: 0; z-index: 1; pointer-events: none;
  background: linear-gradient(180deg, rgba(28,26,21,.55) 0%, rgba(28,26,21,0) 28%, rgba(28,26,21,.12) 66%, rgba(28,26,21,.94) 100%);
}
.ghs-hero__inner { position: relative; z-index: 2; max-width: var(--ghs-container); margin: 0 auto; width: 100%; }
.ghs-hero__title { font-size: var(--ghs-t-hero); line-height: 1.02; letter-spacing: -.02em; margin: 0; text-wrap: balance; }
.ghs-hero__mask { display: block; overflow: hidden; padding-bottom: .16em; margin-bottom: -.16em; }
.ghs-hero__line { display: block; }
.ghs-hero__line--accent { font-style: italic; color: var(--ghs-accent); }
.ghs-hero__foot { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 32px; margin-top: clamp(28px,5vh,52px); }
.ghs-hero__sub { max-width: 520px; margin: 0; font-size: var(--ghs-t-lead); line-height: 1.5; color: var(--ghs-ink-muted); }
.ghs-hero__scroll {
  position: absolute; right: var(--ghs-gutter); bottom: 22px; z-index: 2;
  font-family: var(--ghs-font-mono); font-size: var(--ghs-t-micro); letter-spacing: .22em;
  text-transform: uppercase; opacity: .35; display: flex; align-items: center; gap: 10px;
}
@keyframes ghsBob { 0%,100%{transform:translateY(0)} 50%{transform:translateY(6px)} }
.ghs-bob { animation: ghsBob 2s ease-in-out infinite; }

/* page hero (non-home) */
.ghs-phero { padding-top: calc(var(--h) + clamp(70px,12vh,150px)); padding-bottom: clamp(40px,7vh,80px); }

/* ---- rows -------------------------------------------------------------- */
.ghs-rows { display: flex; flex-direction: column; }
.ghs-row {
  display: grid; grid-template-columns: 80px minmax(0,1.1fr) minmax(0,1.4fr) 40px;
  gap: var(--ghs-gap); align-items: center;
  padding: clamp(22px,3vh,34px) 8px; border-top: 1px solid var(--ghs-line-strong);
  transition: padding-left .4s, background .4s;
}
.ghs-rows > .ghs-row:last-child { border-bottom: 1px solid var(--ghs-line-strong); }
.ghs-row:hover { background: var(--ghs-hover-wash); padding-left: 24px; }
.ghs-row--compact { grid-template-columns: minmax(0,1fr) 40px; }
.ghs-row__n { font-family: var(--ghs-font-mono); font-size: 13px; opacity: .4; }
.ghs-row__title { font-size: var(--ghs-t-h3); line-height: 1.05; letter-spacing: -.01em; }
.ghs-row--compact .ghs-row__title { font-size: clamp(18px,2vw,26px); }
.ghs-row__blurb { font-size: clamp(14px,1.05vw,16px); line-height: 1.5; color: var(--ghs-ink-muted); max-width: 46ch; }
.ghs-row__arrow { font-size: 20px; opacity: .5; text-align: right; }

/* ---- cards ------------------------------------------------------------- */
.ghs-card {
  background: var(--ghs-bg-card); border: 1px solid var(--ghs-line-soft);
  border-radius: var(--ghs-radius-card); padding: clamp(24px,2.4vw,36px);
  display: flex; flex-direction: column; gap: 12px; min-height: 240px;
  transition: background .35s, border-color .35s, transform .35s;
}
.ghs-card:hover { background: #2B2820; border-color: var(--ghs-line-strong); transform: translateY(-2px); }
.ghs-card__n { font-family: var(--ghs-font-mono); font-size: 11px; opacity: .4; letter-spacing: .1em; }
.ghs-card__title { font-size: clamp(20px,2.1vw,28px); line-height: 1.1; }
.ghs-card__body { font-size: 15px; line-height: 1.55; color: var(--ghs-ink-muted); margin: 0; }

/* ---- stats ------------------------------------------------------------- */
.ghs-stats { display: flex; flex-direction: column; gap: 26px; padding-top: 18px; }
.ghs-stats--row { flex-direction: row; flex-wrap: wrap; gap: clamp(28px,5vw,80px); padding-top: 40px; }
.ghs-stat { border-top: 1px solid var(--ghs-line); padding-top: 16px; flex: 1 1 180px; }
.ghs-stat__k { font-size: var(--ghs-t-stat); line-height: 1; letter-spacing: -.02em; font-weight: 300; }
.ghs-stat__v { font-family: var(--ghs-font-mono); font-size: 11px; letter-spacing: .14em; text-transform: uppercase; opacity: .55; margin-top: 10px; }

/* ---- quotes ------------------------------------------------------------ */
.ghs-quote {
  background: var(--ghs-bg-card); border: 1px solid var(--ghs-line-soft);
  border-radius: var(--ghs-radius-card); padding: 36px 34px; margin: 0;
  display: flex; flex-direction: column; justify-content: space-between; min-height: 260px;
}
.ghs-quote__text { margin: 0; font-size: var(--ghs-t-lead); line-height: 1.45; color: var(--ghs-ink); font-weight: 300; }
.ghs-quote__text::before { content: "\201C"; }
.ghs-quote__text::after  { content: "\201D"; }
.ghs-quote__by { margin-top: 26px; font-family: var(--ghs-font-mono); font-size: 11px; letter-spacing: .16em; text-transform: uppercase; color: var(--ghs-accent); }
.ghs-quote__by::before { content: "— "; }
.ghs-quote--lg { background: none; border: 0; padding: 0; min-height: 0; text-align: center; }
.ghs-quote--lg .ghs-quote__text { font-size: clamp(24px,3.2vw,44px); line-height: 1.2; }

/* marquee */
.ghs-marq-wrap { overflow: hidden; }
.ghs-marq { display: flex; width: max-content; gap: 28px; animation: ghsMarq 60s linear infinite; }
.ghs-marq:hover { animation-play-state: paused; }
.ghs-marq .ghs-quote { flex: none; width: min(78vw, 440px); }
@keyframes ghsMarq { from { transform: translateX(0) } to { transform: translateX(-50%) } }

/* ---- people ------------------------------------------------------------ */
.ghs-person { display: block; }
.ghs-person__img {
  width: 100%; aspect-ratio: 3/4; object-fit: cover; object-position: center top;
  background: repeating-linear-gradient(135deg, var(--ghs-bg-card) 0 11px, var(--ghs-bg-card-alt) 11px 22px);
  border: 1px solid var(--ghs-line-soft); border-radius: var(--ghs-radius);
  filter: grayscale(1) contrast(1.02); transition: filter .5s, transform .5s;
}
.ghs-person:hover .ghs-person__img { filter: grayscale(0); }
.ghs-person__name { margin-top: 14px; font-size: 20px; line-height: 1.1; }
.ghs-person__quals { font-family: var(--ghs-font-mono); font-size: 10px; letter-spacing: .06em; opacity: .45; margin-top: 4px; }
.ghs-person__role { font-family: var(--ghs-font-mono); font-size: 10.5px; letter-spacing: .08em; text-transform: uppercase; opacity: .55; margin-top: 5px; }

/* team bios — open by default, in the DOM, crawlable */
.ghs-bio { border-top: 1px solid var(--ghs-line); padding: 26px 0; }
.ghs-bio__head { display: grid; grid-template-columns: 120px minmax(0,1fr); gap: clamp(20px,3vw,44px); align-items: start; }
.ghs-bio__img { width: 120px; aspect-ratio: 3/4; object-fit: cover; object-position: center top;
  border: 1px solid var(--ghs-line-soft); border-radius: var(--ghs-radius); filter: grayscale(1); }
.ghs-bio__body { min-width: 0; }
.ghs-bio__name { font-size: clamp(24px,2.6vw,34px); line-height: 1.1; }
.ghs-bio__text { margin-top: 14px; }

/* ---- FAQ + details ----------------------------------------------------- */
.ghs-faq { margin: 0; }
.ghs-faq__q { font-size: clamp(18px,1.8vw,24px); border-top: 1px solid var(--ghs-line); padding-top: 20px; margin-top: 20px; }
.ghs-faq__a { margin: 10px 0 0; color: var(--ghs-ink-muted); line-height: 1.6; }
.ghs-details { margin: 0; display: flex; flex-direction: column; gap: 20px; }
.ghs-details--inline { display: flex; flex-wrap: wrap; gap: clamp(24px,5vw,72px); }
.ghs-details__k { font-family: var(--ghs-font-mono); font-size: 11px; letter-spacing: .16em; text-transform: uppercase; opacity: .5; }
.ghs-details__v { font-size: clamp(17px,1.5vw,21px); margin: 6px 0 0; display: block; }
a.ghs-details__v:hover { color: var(--ghs-accent); }

/* ---- posts ------------------------------------------------------------- */
.ghs-post {
  background: var(--ghs-bg); border: 1px solid var(--ghs-line-soft);
  border-radius: var(--ghs-radius-card); padding: clamp(24px,2.4vw,36px);
  display: flex; flex-direction: column; justify-content: space-between; gap: 16px;
  min-height: 280px; transition: background .35s, border-color .35s, transform .35s;
}
.ghs-band--panel .ghs-post, .ghs-band--deep .ghs-post { background: var(--ghs-bg); }
.ghs-post:hover { border-color: var(--ghs-accent); transform: translateY(-2px); }
.ghs-post__meta { font-family: var(--ghs-font-mono); font-size: 10.5px; letter-spacing: .12em; text-transform: uppercase; opacity: .45; }
.ghs-post__title { font-size: clamp(21px,2.2vw,30px); line-height: 1.15; }
.ghs-post__excerpt { font-size: 15px; line-height: 1.55; color: var(--ghs-ink-muted); margin: 0; }
.ghs-post__more { font-family: var(--ghs-font-mono); font-size: 11px; letter-spacing: .14em; text-transform: uppercase; color: var(--ghs-accent); }
.ghs-tags { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 26px; }
.ghs-tag {
  font-family: var(--ghs-font-mono); font-size: 10.5px; letter-spacing: .12em; text-transform: uppercase;
  border: 1px solid var(--ghs-line-strong); border-radius: var(--ghs-radius-pill); padding: 7px 14px;
  transition: border-color .3s, color .3s;
}
.ghs-tag:hover, .ghs-tag[aria-current="page"] { border-color: var(--ghs-accent); color: var(--ghs-accent); }

/* ---- article ----------------------------------------------------------- */
.ghs-article { max-width: 68ch; }
.ghs-article .ghs-prose { max-width: none; }

/* ---- form -------------------------------------------------------------- */
.ghs-form { display: flex; flex-direction: column; gap: 26px; }
.ghs-field { display: flex; flex-direction: column; gap: 9px; }
.ghs-field__label { font-family: var(--ghs-font-mono); font-size: 11px; letter-spacing: .16em; text-transform: uppercase; opacity: .6; }
.ghs-field__req { color: var(--ghs-accent); }
.ghs-input, .ghs-textarea, .ghs-select {
  background: transparent; border: 0; border-bottom: 1px solid var(--ghs-line-strong);
  color: var(--ghs-ink); padding: 12px 0; font-size: 17px; border-radius: 0;
  transition: border-color .3s;
}
.ghs-input:focus, .ghs-textarea:focus, .ghs-select:focus { outline: none; border-bottom-color: var(--ghs-accent); }
.ghs-input::placeholder, .ghs-textarea::placeholder { color: var(--ghs-ink-muted); opacity: .5; }
.ghs-textarea { resize: vertical; min-height: 130px; font-family: var(--ghs-font-display); }
.ghs-select { appearance: none; cursor: pointer; }
.ghs-select option { background: var(--ghs-bg-panel); color: var(--ghs-ink); }
.ghs-field--half { display: grid; grid-template-columns: 1fr 1fr; gap: 26px; }
.ghs-form__status { font-family: var(--ghs-font-mono); font-size: 12px; letter-spacing: .06em; }
.ghs-form__status[data-state="error"] { color: var(--ghs-error); }
.ghs-form__status[data-state="ok"] { color: var(--ghs-accent); }

/* ---- map --------------------------------------------------------------- */
.ghs-map {
  display: block; position: relative; aspect-ratio: 3/2; border-radius: var(--ghs-radius-card);
  border: 1px solid var(--ghs-line-soft); overflow: hidden;
  background: repeating-linear-gradient(135deg, var(--ghs-bg-card) 0 13px, var(--ghs-bg-card-alt) 13px 26px);
}
.ghs-map__label {
  position: absolute; left: 0; right: 0; bottom: 0; padding: 16px;
  font-family: var(--ghs-font-mono); font-size: 11px; letter-spacing: .1em;
  text-transform: uppercase; background: linear-gradient(180deg, transparent, rgba(20,17,9,.9));
}

/* ---- footer ------------------------------------------------------------ */
.ghs-footer { background: var(--ghs-bg-deep); padding: clamp(56px,9vh,96px) 0 40px; border-top: 1px solid var(--ghs-line); }
.ghs-footer__grid { display: grid; grid-template-columns: minmax(0,1.2fr) minmax(0,1fr) minmax(0,1fr); gap: clamp(32px,5vw,72px); }
.ghs-footer__h { font-family: var(--ghs-font-mono); font-size: 11px; letter-spacing: .2em; text-transform: uppercase; opacity: .5; margin-bottom: 18px; }
.ghs-footer ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 11px; }
.ghs-footer a:hover { color: var(--ghs-accent); }
.ghs-footer__tagline { font-size: clamp(20px,2.2vw,30px); line-height: 1.2; max-width: 18ch; }
.ghs-footer__base { margin-top: clamp(40px,6vh,64px); padding-top: 24px; border-top: 1px solid var(--ghs-line); display: flex; flex-wrap: wrap; gap: 12px 28px; justify-content: space-between; }
.ghs-footer__legal { font-family: var(--ghs-font-mono); font-size: 10.5px; line-height: 1.7; opacity: .4; max-width: 70ch; }

/* ---- Live Edit add-section region -------------------------------------- */
[data-cs-sections]:empty { min-height: 0; }

/* ---- reveal ------------------------------------------------------------
   NOTE: the hidden state is applied by JS (assets/js/ghs.js), never in CSS.
   A CSS opacity:0 default would hide content from crawlers and no-JS visitors.
   Sections inserted by the Live Edit widget carry no [data-reveal] at all —
   see live-edit/sections.js.                                               */

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
  .ghs-marq { animation: none; }
}

/* ---- responsive -------------------------------------------------------- */
@media (max-width: 1080px) {
  .ghs-grid--4 { grid-template-columns: repeat(3, minmax(0,1fr)); }
  .ghs-footer__grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 900px) {
  .ghs-two { grid-template-columns: 1fr; gap: 40px; }
  .ghs-row { grid-template-columns: 48px minmax(0,1fr) 30px; }
  .ghs-row__blurb { display: none; }
  .ghs-tel { display: none; }

  .ghs-burger { display: block; }
  .ghs-nav {
    position: fixed; inset: var(--h) 0 0; background: var(--ghs-bg-panel);
    flex-direction: column; align-items: flex-start; justify-content: flex-start;
    gap: 4px; padding: 28px var(--ghs-gutter); overflow-y: auto; font-size: 14px;
    transform: translateX(100%); transition: transform .4s cubic-bezier(.16,1,.3,1);
    visibility: hidden;
  }
  /* Open state is a class on the <ul> itself rather than a descendant selector
     off the header (.ghs-header.is-open .ghs-nav). Both work; this form is one
     less thing to reason about, and it pairs with the visibility toggle below.

     `visibility: hidden` on the closed panel is the part that matters: without
     it the off-screen menu still takes focus, so a keyboard or screen-reader
     user tabs from the burger straight into a menu nobody can see. */
  .ghs-nav.is-open { transform: translateX(0); visibility: visible; }
  .ghs-nav > li { width: 100%; border-bottom: 1px solid var(--ghs-line); }
  .ghs-nav__link { padding: 16px 0; width: 100%; }
  .ghs-nav__has-sub > .ghs-nav__sub {
    position: static; width: auto; padding-top: 0; opacity: 1; visibility: visible;
    transform: none; display: none;
  }
  .ghs-nav__has-sub.is-open > .ghs-nav__sub { display: block; }
  .ghs-nav__sub-inner { background: none; border: 0; box-shadow: none; padding: 0 0 14px; }
  .ghs-nav__sub a { padding: 9px 0; }
  .ghs-caret { margin-left: auto; font-size: 11px; }
}
@media (max-width: 720px) {
  .ghs-grid--3, .ghs-grid--4 { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .ghs-footer__grid { grid-template-columns: 1fr; }
  .ghs-field--half { grid-template-columns: 1fr; }
  .ghs-bio__head { grid-template-columns: 92px minmax(0,1fr); gap: 20px; }
  .ghs-bio__img { width: 92px; }
  .ghs-stats--row { gap: 24px; }
}
@media (max-width: 520px) {
  .ghs-grid--2, .ghs-grid--3, .ghs-grid--4 { grid-template-columns: 1fr; }
  .ghs-wordmark__full { display: none; }
  .ghs-hero__scroll { display: none; }
}