/* Evertide Capital — editorial, restrained. Paper, ink, one accent. No motion. */

@font-face { font-family: "Newsreader"; src: url("/fonts/newsreader.woff2") format("woff2"); font-weight: 200 800; font-style: normal; font-display: swap; }
@font-face { font-family: "Newsreader"; src: url("/fonts/newsreader-italic.woff2") format("woff2"); font-weight: 200 800; font-style: italic; font-display: swap; }
@font-face { font-family: "IBM Plex Sans"; src: url("/fonts/plex-sans-400.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "IBM Plex Sans"; src: url("/fonts/plex-sans-500.woff2") format("woff2"); font-weight: 500; font-style: normal; font-display: swap; }
@font-face { font-family: "IBM Plex Sans"; src: url("/fonts/plex-sans-600.woff2") format("woff2"); font-weight: 600; font-style: normal; font-display: swap; }

:root {
  --paper: #f6f4ef;
  --paper-2: #eeebe4;
  --white: #fff;
  --ink: #15191e;
  --ink-2: #353b42;
  --muted: #6a6f75;
  --rule: #d6d2c9;
  --rule-strong: #15191e;
  --accent: #1f3b35;
  --danger: #9b2c1f;
  --serif: "Newsreader", "Iowan Old Style", Georgia, serif;
  --sans: "IBM Plex Sans", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;

  /* Type scale (major third, 17px base) */
  --t-xs: .8125rem;   /* 13 — labels, legal */
  --t-sm: .9375rem;   /* 15 — UI, notes */
  --t-md: 1.0625rem;  /* 17 — body */
  --t-lg: 1.3125rem;  /* 21 — lede, h3 */
  --t-xl: 1.75rem;    /* 28 — h2 */
  --t-2xl: 2.5rem;    /* 40 — page h1 */
  --t-3xl: 3.375rem;  /* 54 — home h1 */

  --wrap: 1200px;
  --gutter: 2.5rem;
  --space-section: 7rem;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0; background: var(--paper); color: var(--ink-2);
  font: 400 var(--t-md)/1.65 var(--sans);
  -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility;
}
img, svg { display: block; max-width: 100%; }
a { color: var(--accent); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: .2em; }
a:hover { color: var(--ink); }
:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }
p { margin: 0 0 1em; }
h1, h2, h3 { font-family: var(--serif); font-weight: 400; color: var(--ink); margin: 0; font-optical-sizing: auto; }
h1 { font-size: var(--t-2xl); line-height: 1.12; letter-spacing: -.012em; }
h2 { font-size: var(--t-xl); line-height: 1.2; letter-spacing: -.005em; }
h3 { font-size: var(--t-lg); line-height: 1.3; }
strong { font-weight: 600; color: var(--ink); }
address { font-style: normal; }

.visually-hidden { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.skip { position: absolute; left: 1rem; top: -4rem; z-index: 100; background: var(--ink); color: var(--paper); padding: .6rem 1rem; }
.skip:focus { top: 1rem; }

.wrap { max-width: var(--wrap); margin: 0 auto; padding: 0 var(--gutter); }

/* 12-column editorial grid: marginal label (3) + content (8), one empty column on the right. */
.row { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: 2rem; }
.row__label { grid-column: 1 / 4; }
.row__body { grid-column: 4 / 12; }
.row__wide { grid-column: 4 / 13; }

.label {
  font: 500 var(--t-xs)/1.4 var(--sans); letter-spacing: .08em; text-transform: uppercase;
  color: var(--muted); margin: 0 0 1rem;
}
.lede { font-size: var(--t-lg); line-height: 1.55; color: var(--ink-2); max-width: 38em; }
.note { font-size: var(--t-sm); color: var(--muted); }
.measure { max-width: 36em; }

/* ---------- Header ---------- */
.site-header { border-bottom: 1px solid var(--rule); background: var(--paper); }
.site-header__inner { display: flex; align-items: center; justify-content: space-between; height: 76px; }
.brand { font: 500 1.375rem/1 var(--serif); color: var(--ink); text-decoration: none; letter-spacing: -.005em; }
.brand:hover { color: var(--ink); }
.site-nav ul { display: flex; gap: 2.25rem; list-style: none; margin: 0; padding: 0; }
.site-nav a { font-size: var(--t-sm); color: var(--ink-2); text-decoration: none; padding: .35rem 0; border-bottom: 1px solid transparent; }
.site-nav a:hover { color: var(--ink); border-bottom-color: var(--rule); }
.site-nav a[aria-current] { color: var(--ink); border-bottom-color: var(--ink); }
.site-nav ul { align-items: center; }
.site-nav .site-nav__cta { margin-left: -.25rem; }
.site-nav .btn, .site-nav .btn:hover { color: var(--paper); border: 1px solid var(--ink); padding: .7rem 1.1rem; }
.site-nav .btn:hover { border-color: var(--accent); }
.nav-toggle { display: none; background: none; border: 0; padding: .75rem; margin-right: -.75rem; color: var(--ink); cursor: pointer; font: 500 var(--t-sm) var(--sans); }

@media (max-width: 1100px) and (min-width: 861px) {
  .site-nav ul { gap: 1.4rem; }
}
@media (max-width: 860px) {
  .nav-toggle { display: block; }
  .site-header__inner { position: relative; height: 64px; }
  .site-nav { display: none; position: absolute; left: 0; right: 0; top: 64px; z-index: 50; background: var(--paper); border-bottom: 1px solid var(--rule); padding: .5rem var(--gutter) 1.25rem; }
  .site-nav.is-open { display: block; }
  .site-nav ul { flex-direction: column; gap: 0; }
  .site-nav li + li { border-top: 1px solid var(--rule); }
  .site-nav a { display: block; padding: .9rem 0; border: 0; font-size: var(--t-md); }
  .site-nav a[aria-current] { border: 0; text-decoration: underline; text-underline-offset: .3em; }
  .site-nav ul { align-items: stretch; }
  .site-nav .site-nav__cta { margin: .75rem 0 0; border-top: 0 !important; }
  .site-nav .btn { display: block; text-align: center; padding: 1rem; }
}

/* ---------- Page intro ---------- */
.intro { padding: 6.5rem 0 5rem; border-bottom: 1px solid var(--rule); }
.intro h1 { grid-column: 1 / 10; margin-bottom: 1.75rem; }
.intro .label { grid-column: 1 / -1; }
.intro .lede { grid-column: 1 / 9; margin: 0; }
.intro__links { margin: 1.75rem 0 0; font-size: var(--t-sm); display: flex; gap: 2rem; flex-wrap: wrap; }
.intro__cta { grid-column: 1 / 9; margin: 2.25rem 0 0; display: flex; gap: .75rem; flex-wrap: wrap; }

/* ---------- Sections ---------- */
.section { padding: var(--space-section) 0; border-bottom: 1px solid var(--rule); }
.section--alt { background: var(--paper-2); }
.section:last-child { border-bottom: 0; }
.section h2 { margin-bottom: 1.25rem; }
.section .row__label h2 { font-size: var(--t-lg); line-height: 1.35; }
.section .row__body > :last-child { margin-bottom: 0; }

/* Key terms: four columns separated by hairlines */
.terms { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border-top: 1px solid var(--rule-strong); margin: 0; }
.terms > div { padding: 1.5rem 1.5rem 0 0; }
.terms > div + div { padding-left: 1.5rem; border-left: 1px solid var(--rule); }
.terms dt { font: 500 var(--t-xs)/1.4 var(--sans); letter-spacing: .08em; text-transform: uppercase; color: var(--muted); margin-bottom: .6rem; }
.terms dd { margin: 0; font: 400 var(--t-lg)/1.3 var(--serif); color: var(--ink); }
.terms dd span { display: block; font: 400 var(--t-sm)/1.5 var(--sans); color: var(--muted); margin-top: .4rem; }

/* Ruled list: name on the left, description on the right */
.ruled { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--rule-strong); }
.ruled > li, .ruled > div { display: grid; grid-template-columns: minmax(0, 3fr) minmax(0, 5fr); column-gap: 2rem; padding: 1.4rem 0 1.5rem; border-bottom: 1px solid var(--rule); }
.ruled h3, .ruled dt { font: 400 var(--t-lg)/1.3 var(--serif); color: var(--ink); margin: 0; }
.ruled p, .ruled dd { margin: 0; }
.ruled dd p + p { margin-top: .5rem; }
.ruled .flag { display: block; font: 500 var(--t-xs)/1.4 var(--sans); letter-spacing: .08em; text-transform: uppercase; color: var(--accent); margin-top: .35rem; }
dl.ruled { margin: 0; }

/* Numbered process */
.process { list-style: none; margin: 0; padding: 0; counter-reset: step; border-top: 1px solid var(--rule-strong); }
.process li { counter-increment: step; display: grid; grid-template-columns: 3rem minmax(0, 1fr); padding: 1.25rem 0 1.35rem; border-bottom: 1px solid var(--rule); }
.process li::before { content: counter(step); font: 500 var(--t-sm)/1.9 var(--sans); color: var(--muted); font-variant-numeric: tabular-nums; }
.process h3 { font-size: var(--t-lg); margin-bottom: .25rem; }
.process p { margin: 0; }

/* Two-column text blocks */
.cols { display: grid; grid-template-columns: 1fr 1fr; column-gap: 4rem; row-gap: 3rem; }
.cols h3 { margin-bottom: .6rem; }
.cols p:last-child { margin-bottom: 0; }

/* Plain lists */
.list { list-style: none; margin: 0 0 1.25rem; padding: 0; border-top: 1px solid var(--rule); }
.list li { padding: .8rem 0; border-bottom: 1px solid var(--rule); }

.more { font-size: var(--t-sm); font-weight: 500; }

/* ---------- Prose (legal) ---------- */
.prose { max-width: 40em; }
.prose h2 { font-size: var(--t-lg); margin: 2.5rem 0 .75rem; }
.prose ul { padding-left: 1.1rem; margin: 0 0 1em; }
.prose li { margin-bottom: .5rem; }

/* ---------- Forms ---------- */
.form { display: grid; grid-template-columns: 1fr 1fr; gap: 1.5rem 1.5rem; margin-top: 0; }
.field { display: flex; flex-direction: column; min-width: 0; }
.field--full { grid-column: 1 / -1; }
.field label { font: 500 var(--t-sm)/1.4 var(--sans); color: var(--ink); margin-bottom: .45rem; }
.field .opt { font-weight: 400; color: var(--muted); }
.field input, .field select, .field textarea {
  width: 100%; font: 400 var(--t-md)/1.4 var(--sans); color: var(--ink);
  background: var(--white); border: 1px solid #b9b5ac; border-radius: 0;
  padding: .7rem .8rem; min-height: 3rem; appearance: none; -webkit-appearance: none;
}
.field select {
  padding-right: 2.25rem;
  background-image: linear-gradient(45deg, transparent 50%, var(--ink-2) 50%), linear-gradient(135deg, var(--ink-2) 50%, transparent 50%);
  background-position: calc(100% - 1.1rem) 52%, calc(100% - .8rem) 52%;
  background-size: 5px 5px, 5px 5px; background-repeat: no-repeat;
}
.field textarea { min-height: 9rem; resize: vertical; }
.field input:hover, .field select:hover, .field textarea:hover { border-color: var(--ink-2); }
.field input:focus, .field select:focus, .field textarea:focus { outline: 2px solid var(--accent); outline-offset: -1px; border-color: var(--accent); }
.field input::placeholder, .field textarea::placeholder { color: #9a9ea3; }
.field [aria-invalid="true"] { border-color: var(--danger); }
.field__error { margin: .35rem 0 0; font-size: var(--t-xs); color: var(--danger); min-height: 0; }
.field__error:empty { display: none; }
.hp { position: absolute !important; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
.cf-turnstile { grid-column: 1 / -1; min-height: 65px; }
.form-status { grid-column: 1 / -1; margin: 0; font-size: var(--t-sm); }
.form-status:empty { display: none; }
.form-status--error { color: var(--danger); border-left: 2px solid var(--danger); padding-left: .75rem; }
.form__foot { grid-column: 1 / -1; display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; border-top: 1px solid var(--rule); padding-top: 1.5rem; }
.form__foot .note { margin: 0; }
.form-success { border-top: 1px solid var(--rule-strong); padding-top: 1.5rem; }
.form-success h2 { margin-bottom: .75rem; }
.form-success:focus { outline: none; }

.btn {
  display: inline-block; font: 500 var(--t-sm)/1 var(--sans); letter-spacing: .01em;
  background: var(--ink); color: var(--paper); border: 1px solid var(--ink); border-radius: 0;
  padding: 1rem 1.6rem; text-decoration: none; cursor: pointer; white-space: nowrap;
}
.btn:hover { background: var(--accent); border-color: var(--accent); color: var(--white); }
.btn:disabled { opacity: .6; cursor: progress; }
.btn--sm { padding: .7rem 1.1rem; }
.btn--ghost { background: transparent; color: var(--ink); }
.btn--ghost:hover { background: var(--ink); border-color: var(--ink); color: var(--paper); }

/* ---------- Footer ---------- */
.site-footer { background: var(--paper-2); border-top: 1px solid var(--rule); padding: 4.5rem 0 2.5rem; font-size: var(--t-sm); }
.site-footer .row { row-gap: 2rem; }
.site-footer__brand { grid-column: 1 / 5; }
.site-footer__brand p { color: var(--muted); max-width: 22em; margin-top: 1rem; }
.site-footer__col { grid-column: span 2; }
.site-footer__col--wide { grid-column: span 3; }
.site-footer h2 { font: 500 var(--t-xs)/1.4 var(--sans); letter-spacing: .08em; text-transform: uppercase; color: var(--muted); margin: 0 0 1rem; }
.site-footer ul { list-style: none; margin: 0; padding: 0; }
.site-footer li { margin-bottom: .5rem; }
.site-footer a { color: var(--ink-2); text-decoration: none; }
.site-footer a:hover { color: var(--ink); text-decoration: underline; }
.site-footer address { color: var(--ink-2); line-height: 1.6; }
.site-footer__legal { margin-top: 4rem; padding-top: 1.5rem; border-top: 1px solid var(--rule); display: flex; justify-content: space-between; gap: 2rem; color: var(--muted); font-size: var(--t-xs); line-height: 1.6; }
.site-footer__legal p { margin: 0; max-width: 60em; }
.site-footer__legal nav a { color: var(--muted); margin-left: 1.5rem; }

/* ---------- Responsive ---------- */
@media (max-width: 1024px) {
  .row__label { grid-column: 1 / -1; margin-bottom: 1.5rem; }
  .row__body, .row__wide { grid-column: 1 / -1; }
  .intro h1, .intro .lede, .intro__cta { grid-column: 1 / -1; }
  .terms { grid-template-columns: 1fr 1fr; }
  .terms > div:nth-child(3) { border-left: 0; padding-left: 0; }
  .terms > div:nth-child(n+3) { border-top: 1px solid var(--rule); margin-top: 1.5rem; }
  .site-footer__brand { grid-column: 1 / -1; }
  .site-footer__col, .site-footer__col--wide { grid-column: span 4; }
}
@media (max-width: 720px) {
  :root { --t-2xl: 2rem; --t-3xl: 2.375rem; --t-xl: 1.5rem; --t-lg: 1.1875rem; --gutter: 1.25rem; --space-section: 4rem; }
  .intro { padding: 3.5rem 0 3rem; }
  .terms { grid-template-columns: 1fr; }
  .terms > div, .terms > div + div { padding: 1.1rem 0; border-left: 0; margin: 0; }
  .terms > div + div { border-top: 1px solid var(--rule); }
  .ruled > li, .ruled > div { grid-template-columns: 1fr; row-gap: .4rem; }
  .cols { grid-template-columns: 1fr; row-gap: 2rem; }
  .form { grid-template-columns: 1fr; }
  .form__foot { flex-direction: column-reverse; align-items: stretch; }
  .btn { width: 100%; text-align: center; }
  .site-footer__col, .site-footer__col--wide { grid-column: 1 / -1; }
  .site-footer__legal { flex-direction: column; }
  .site-footer__legal nav a { margin: 0 1.5rem 0 0; }
}

/* Helpers (inline styles are blocked by the CSP) */
.cols--spaced { margin-top: 3rem; }
.more--spaced { margin-top: 2rem; }
.ruled dd .more { margin-top: .6rem; }
.prose > h2:first-child { margin-top: 0; }
.intro--404 { min-height: 50vh; border-bottom: 0; }

/* ---------- Photography ---------- */
/* Plate closing the page intro. On desktop it spans columns 1–11 so its right edge meets the end of the
   body column and the hairline rules below; full width at ≤1024px where the body column is full width too.
   Photos carry a shared baked-in grade (see CREDITS.txt); the CSS adds a light accent wash on top. */
.intro__media { grid-column: 1 / 12; position: relative; margin: 4.5rem 0 0; aspect-ratio: 12 / 5; overflow: hidden; background: var(--paper-2); }
.intro__media--hero { aspect-ratio: 16 / 7; margin-top: 5rem; }
.intro__media img { width: 100%; height: 100%; object-fit: cover; filter: saturate(.9) contrast(.96); }
.intro__media::after { content: ""; position: absolute; inset: 0; background: var(--accent); mix-blend-mode: soft-light; opacity: .22; pointer-events: none; }
@media (max-width: 1024px) {
  .intro__media { grid-column: 1 / -1; }
}
@media (max-width: 720px) {
  .intro__media, .intro__media--hero { aspect-ratio: 16 / 9; margin-top: 2.75rem; }
}

/* ---------- Hero with lead form ---------- */
/* Lead pages open with a two-column hero: headline, value proposition and three points on the left, the
   short form card on the right, so the whole form (including Turnstile and submit) sits above the fold at
   1280x800. Below 961px it stacks as headline → form → points, so on phones the form follows a compact
   headline and one-line subhead. */
.hero { padding: 2.75rem 0 3.5rem; border-bottom: 1px solid var(--rule); }
.hero__grid {
  display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 31rem); column-gap: 4.5rem;
  grid-template-areas: "head form" "aside form"; grid-template-rows: auto 1fr; align-items: start;
}
.hero__head { grid-area: head; padding-top: 1.75rem; }
.hero__form { grid-area: form; }
.hero__aside { grid-area: aside; }
.hero h1 { margin-bottom: 1rem; }
.hero--home h1 { font-size: 2.875rem; line-height: 1.1; letter-spacing: -.016em; }
.hero__sub { font: 400 var(--t-lg)/1.45 var(--serif); color: var(--ink); margin: 0 0 1.5rem; }
.hero__lede { max-width: 34em; margin-bottom: 1.75rem; }
.hero__points { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--rule-strong); max-width: 34em; }
.hero__points li { padding: .85rem 0; border-bottom: 1px solid var(--rule); font-size: var(--t-sm); line-height: 1.55; }
.hero__alt { margin: .9rem 0 0; font-size: var(--t-sm); text-align: center; color: var(--muted); }

.form-card { background: var(--white); border: 1px solid var(--rule); border-top: 2px solid var(--ink); padding: 1.5rem 1.75rem 1.4rem; scroll-margin-top: 1rem; }
.form-card__head { margin-bottom: 1.1rem; }
.form-card__head h2 { font-size: var(--t-xl); margin-bottom: .3rem; }
.form-card__head .note { margin: 0; line-height: 1.45; }
.form-card .form-success { border-top: 0; padding-top: 0; }

.form--compact { gap: .85rem 1rem; }
.form--compact .field label { font-size: var(--t-xs); margin-bottom: .3rem; }
.form--compact .field input, .form--compact .field select, .form--compact .field textarea { min-height: 2.75rem; padding: .55rem .75rem; font-size: var(--t-sm); }
.form--compact .field textarea { min-height: 4.75rem; }
.form--compact .cf-turnstile { min-height: 65px; }
.form--compact .form__foot { flex-direction: column; align-items: stretch; gap: .6rem; border-top: 0; padding-top: 0; }
.form--compact .form__foot .note { font-size: var(--t-xs); text-align: center; }
.form--compact .btn { width: 100%; text-align: center; padding: 1rem 1.25rem; }

.form__more { font-size: var(--t-xs); }
.form__more summary { cursor: pointer; color: var(--accent); font-weight: 500; list-style: none; width: max-content; max-width: 100%; }
.form__more summary::-webkit-details-marker { display: none; }
.form__more summary::before { content: "+"; display: inline-block; width: 1em; font-weight: 400; }
.form__more[open] summary::before { content: "\2212"; }
.form__more-body { display: grid; grid-template-columns: 1fr 1fr; gap: .85rem 1rem; margin-top: .85rem; }

/* Photo plate that used to close the intro now sits between the hero and the page content. */
.plate { padding: 4rem 0 0; }
.plate__media { position: relative; margin: 0; aspect-ratio: 12 / 5; overflow: hidden; background: var(--paper-2); }
.plate__media--hero { aspect-ratio: 16 / 6; }
.plate__media img { width: 100%; height: 100%; object-fit: cover; filter: saturate(.9) contrast(.96); }
.plate__media::after { content: ""; position: absolute; inset: 0; background: var(--accent); mix-blend-mode: soft-light; opacity: .22; pointer-events: none; }
.plate + .section { border-top: 0; }

@media (max-width: 1100px) {
  .hero__grid { column-gap: 3rem; grid-template-columns: minmax(0, 1fr) minmax(0, 28rem); }
}
@media (max-width: 960px) {
  .hero__grid { grid-template-columns: minmax(0, 1fr); grid-template-areas: "head" "form" "aside"; }
  .hero__head { padding-top: 0; }
  .hero__aside { margin-top: 2.5rem; }
  .hero__form { max-width: 34rem; }
}
@media (max-width: 720px) {
  .hero { padding: 1.1rem 0 2.5rem; }
  .hero .label { display: none; }
  .hero h1, .hero--home h1 { font-size: 1.5rem; line-height: 1.18; margin-bottom: .4rem; }
  .hero__sub { font-size: var(--t-sm); line-height: 1.4; margin-bottom: .9rem; color: var(--ink-2); }
  .form-card { padding: 1rem 1rem 1rem; margin: 0 -.25rem; }
  .form-card__head { margin-bottom: .75rem; }
  .form-card__head h2 { font-size: 1.3125rem; }
  .form--compact { grid-template-columns: 1fr 1fr; gap: .6rem .75rem; }
  .form--compact > .field { grid-column: 1 / -1; }
  .form--compact > .field--half-sm { grid-column: auto; justify-content: flex-end; }
  .form--compact .field input, .form--compact .field select { min-height: 2.6rem; }
  .form__more-body { grid-template-columns: 1fr; }
  .intro__cta { flex-direction: column; }
  .plate { padding-top: 2.5rem; }
  .plate__media, .plate__media--hero { aspect-ratio: 16 / 9; }
}