:root {
  --bg: #f7f8f6;
  --surface: #ffffff;
  --surface-2: #eef5f3;
  --text: #17232a;
  --muted: #59686a;
  --primary: #236f72;
  --primary-2: #173942;
  --accent: #b79261;
  --border: #dfe8e4;
  --shadow: 0 18px 44px rgba(23, 45, 52, .11);
  --radius: 12px;
  --max: 1200px;
  --ease-out: cubic-bezier(.2, .75, .25, 1);
  --motion-fast: 180ms;
  --motion-base: 280ms;
  --motion-slow: 680ms;
  font-family: "Segoe UI", Roboto, Arial, Helvetica, sans-serif;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; color: var(--text); background: var(--bg); line-height: 1.7; font-size: 17px; }
img { max-width: 100%; display: block; }
a { color: inherit; }
p { color: var(--muted); }
h1, h2, h3, h4 { line-height: 1.12; margin: 0 0 16px; letter-spacing: 0; color: var(--text); }
h1 { font-size: clamp(2.45rem, 5vw, 5.15rem); max-width: 940px; }
h2 { font-size: clamp(1.7rem, 3vw, 2.55rem); }
h3 { font-size: 1.25rem; }
h4 { font-size: 1.08rem; }
button, input, select, textarea { font: inherit; }
:focus-visible { outline: 3px solid color-mix(in srgb, var(--primary), white 30%); outline-offset: 3px; }
.container { width: min(var(--max), calc(100% - 32px)); margin: 0 auto; }
.narrow { max-width: 820px; }
.skip-link { position: absolute; left: -999px; top: 8px; z-index: 20; background: var(--surface); padding: 10px; }
.skip-link:focus { left: 8px; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.eyebrow { color: var(--primary); text-transform: uppercase; font-weight: 700; letter-spacing: .08em; font-size: .8rem; }
.lead { font-size: clamp(1.08rem, 2vw, 1.32rem); max-width: 760px; color: #445356; }
.button { position: relative; isolation: isolate; overflow: hidden; display: inline-flex; align-items: center; justify-content: center; min-height: 48px; padding: 13px 20px; border-radius: 999px; background: var(--primary); color: white; text-decoration: none; border: 1px solid var(--primary); font-weight: 700; font-size: .95rem; cursor: pointer; box-shadow: 0 12px 24px rgba(35, 111, 114, .18); transition: transform var(--motion-fast) var(--ease-out), box-shadow var(--motion-fast) var(--ease-out), background-color var(--motion-fast) ease, border-color var(--motion-fast) ease; }
.button::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(120deg, transparent 0%, rgba(255,255,255,.24) 48%, transparent 72%); transform: translateX(-130%); transition: transform 620ms var(--ease-out); }
.button:hover { transform: translateY(-2px); box-shadow: 0 16px 30px rgba(35, 111, 114, .22); }
.button:hover::after { transform: translateX(130%); }
.button.small { min-height: 40px; padding: 9px 14px; font-size: .9rem; }
.button.ghost { background: transparent; color: var(--primary); }
.text-link { position: relative; font-weight: 700; color: var(--primary); text-decoration: none; border-bottom: 2px solid color-mix(in srgb, currentColor, transparent 20%); transition: color var(--motion-fast) ease, border-color var(--motion-fast) ease; }
.text-link:hover { border-color: transparent; color: var(--primary-2); }
.text-link::after { content: ""; position: absolute; left: 0; right: 0; bottom: -2px; height: 2px; background: currentColor; transform: scaleX(0); transform-origin: left; transition: transform var(--motion-base) var(--ease-out); }
.text-link:hover::after { transform: scaleX(1); }
.muted { background: var(--surface-2); }
.note { color: var(--primary-2); font-weight: 700; }
.js-enabled .reveal { opacity: 1; transform: none; transition-delay: var(--reveal-delay, 0ms); }
.js-enabled .reveal.is-visible { animation: soft-attention 520ms var(--ease-out) both; animation-delay: var(--reveal-delay, 0ms); }
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
  .js-enabled .reveal { opacity: 1 !important; transform: none !important; }
}

@keyframes soft-attention {
  0% { transform: translateY(10px); }
  55% { transform: translateY(-2px); }
  100% { transform: translateY(0); }
}