:root {
  --navy: #292522;
  --teal: #b32025;
  --teal-dark: #8f181c;
  --ink: #2d2a27;
  --muted: #625d57;
  --paper: #faf6f1;
  --warm: #e8d6c3;
  --white: #fff;
  --line: #ded5cb;
  --max: 75rem;
  --radius: .35rem;
  --shadow: 0 1rem 2.5rem rgba(41,37,34,.10);
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; color: var(--ink); background: var(--white); font: 400 1rem/1.65 system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; }
img, svg { display: block; max-width: 100%; height: auto; }
a { color: var(--teal-dark); }
button { font: inherit; }
[hidden] { display: none !important; }
:focus-visible { outline: .2rem solid var(--teal-dark); outline-offset: .2rem; box-shadow: 0 0 0 .4rem var(--white), 0 0 0 .6rem var(--navy); }
.container { width: min(calc(100% - 2rem), var(--max)); margin-inline: auto; }
.skip-link { position: absolute; left: -9999px; }
.skip-link:focus { left: 1rem; top: 1rem; z-index: 100; padding: .75rem 1rem; background: var(--white); }

.site-header { position: sticky; z-index: 50; top: 0; background: rgba(255,255,255,.96); border-bottom: 1px solid var(--line); }
.nav-row { display: flex; min-height: 4.75rem; align-items: center; justify-content: space-between; gap: 1.5rem; }
.brand { font-weight: 800; letter-spacing: .08em; color: var(--navy); text-decoration: none; }
.brand { display: flex; align-items: center; }
.brand img { width: min(12rem, 38vw); max-height: 3.1rem; object-fit: contain; }
.nav-list { display: flex; margin: 0; padding: 0; align-items: center; gap: 1.25rem; list-style: none; }
.nav-list a { color: var(--ink); font-weight: 650; text-decoration: none; }
.nav-list a:hover, .nav-list a[aria-current="page"] { color: var(--teal-dark); }
.nav-toggle { display: none; }

.hero { padding: clamp(3.25rem,6vw,5.5rem) 0; background: linear-gradient(115deg,#f7e9e5 0%,#fff 68%); }
.hero--home { padding: clamp(2rem,4vw,3.5rem) 0; }
.hero--passpal { padding: clamp(2.75rem,5vw,4.5rem) 0; }
.hero--passpal h1 { max-width: 22ch; }
.hero--home h1 { max-width: 26ch; }
.hero--home + .section { padding-top: clamp(2rem,4vw,3.5rem); }
.eyebrow { color: var(--teal-dark); font-size: 1rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
h1, h2, h3 { color: var(--navy); line-height: 1.15; }
h1 { max-width: 15ch; margin: .5rem 0 1.25rem; font-size: clamp(2.6rem,6vw,5.5rem); }
h2 { font-size: clamp(2rem,4vw,3.25rem); }
.lede { max-width: 42rem; color: var(--muted); font-size: 1.22rem; }
main p:not(.eyebrow):not(.lede) { font-size: 1.06rem; }
.button { display: inline-block; padding: .8rem 1.15rem; color: var(--white); background: var(--teal); border-radius: var(--radius); font-weight: 750; text-decoration: none; }
.button:hover { color: var(--white); background: var(--teal-dark); }
.button--secondary { color: var(--navy); background: transparent; border: 1px solid var(--navy); }

.section { padding: clamp(3rem,5vw,5rem) 0; }
.grid-3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.25rem; }
.card { padding: 1.6rem; background: var(--white); border: 1px solid var(--line); border-top: .25rem solid var(--teal); }
.business-matrix { display: grid; grid-template-columns: repeat(2, 1fr); grid-template-rows: repeat(2, 1fr); gap: 1.5rem; }
.business-panel { padding: clamp(1.5rem,4vw,3rem); border: 1px solid var(--line); }
.business-panel h3 { margin-top: 0; font-size: clamp(1.55rem,3vw,2.4rem); }
.business-panel--primary { grid-row: 1 / span 2; background: var(--paper); border-top: .3rem solid var(--teal); }
.business-panel--passpal { color: var(--white); background: #3c302a; border-color: #3c302a; }
.business-panel--passpal h3, .business-panel--passpal a { color: var(--white); }
.business-panel--trade { background: var(--warm); }
.business-links { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .7rem 1.5rem; padding-left: 1.2rem; }
.proof-strip { padding: 1rem 0; color: var(--white); background: var(--navy); }
.proof-list { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1rem; margin: 0; padding: 0; list-style: none; text-align: center; }
.growth-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1.5rem; }
.growth-card { display: flex; min-height: 22rem; padding: clamp(1.5rem,4vw,3rem); flex-direction: column; justify-content: flex-end; }
.growth-card--passpal { color: var(--white); background: #3c302a; }
.growth-card--passpal h3 { color: var(--white); }
.growth-card--passpal .button--secondary { color: var(--navy); background: var(--white); border-color: var(--white); }
.growth-card--passpal .button--secondary:hover { color: var(--white); background: var(--navy); border-color: var(--navy); }
.growth-card--trade { background: var(--warm); }
.site-footer { padding: 3rem 0; color: #dce8ed; background: var(--navy); }
.site-footer a { color: var(--white); }

@media (max-width: 72rem) {
  .nav-toggle { display: block; }
  .nav-list { display: none; position: absolute; top: 100%; right: 0; left: 0; padding: 1rem; flex-direction: column; align-items: flex-start; background: var(--white); border-bottom: 1px solid var(--line); }
  .nav-list[data-open="true"] { display: flex; }
  .site-header:not(.js-enabled) .nav-list { display: flex; position: static; padding: 0; border: 0; }
}

@media (max-width: 52rem) {
  .grid-3, .growth-grid, .proof-list, .business-matrix, .business-links { grid-template-columns: 1fr; }
  .business-matrix { grid-template-rows: auto; }
  .business-panel--primary { grid-row: auto; }
}

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

.table-wrap {
  max-width: 100%;
  overflow-x: auto;
  overscroll-behavior-inline: contain;
  -webkit-overflow-scrolling: touch;
}
.table-wrap:focus-visible { outline: .2rem solid var(--teal-dark); outline-offset: .2rem; }
.table-wrap table { width: 100%; min-width: 42rem; border-collapse: collapse; }
.table-wrap th, .table-wrap td { padding: .75rem; border: 1px solid var(--line); text-align: left; }
.table-wrap caption { padding: 0 0 .75rem; color: var(--navy); font-weight: 750; text-align: left; }