@import url('https://fonts.googleapis.com/css2?family=Archivo+Black&family=Space+Grotesk:wght@400;500;600;700&display=swap');

:root {
  --paper: #F6F1E7;
  --ink: #141414;
  --lime: #C6F135;
  --coral: #FF4D3A;
  --border: 3px solid var(--ink);
  --shadow: 6px 6px 0 var(--ink);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  font-family: 'Space Grotesk', sans-serif;
  font-size: 17px;
  line-height: 1.55;
}
body, button, a { color: var(--ink); }
a { text-decoration-thickness: 2px; text-underline-offset: 4px; }
button, a { font-family: inherit; }
svg { display: block; max-width: 100%; }
h1, h2, h3, p { margin-top: 0; }
h1, h2, h3, .brand, .button, .eyebrow, .card-number, .giant-word {
  font-family: 'Archivo Black', sans-serif;
}
h1, h2, h3 { line-height: .98; text-transform: uppercase; }
h1 { font-size: clamp(3.1rem, 7.5vw, 8.7rem); letter-spacing: -.055em; }
h2 { font-size: clamp(2.2rem, 4.6vw, 5.2rem); letter-spacing: -.045em; }
h3 { font-size: clamp(1.35rem, 2vw, 2rem); }
section { scroll-margin-top: 100px; }

.skip-link {
  position: fixed;
  left: 12px;
  top: -100px;
  z-index: 100;
  padding: 10px 14px;
  background: var(--lime);
  border: var(--border);
  font-weight: 700;
}
.skip-link:focus { top: 12px; }

.ticker {
  overflow: hidden;
  border-bottom: var(--border);
  background: var(--lime);
  font-family: 'Archivo Black', sans-serif;
  white-space: nowrap;
}
.ticker-track {
  display: flex;
  width: max-content;
  animation: ticker 24s linear infinite;
}
.ticker span { padding: 8px 0; font-size: .86rem; letter-spacing: .04em; }
@keyframes ticker { to { transform: translateX(-50%); } }

.site-header {
  position: sticky;
  top: 0;
  z-index: 50;
  min-height: 76px;
  padding: 10px clamp(16px, 3vw, 48px);
  display: flex;
  align-items: center;
  gap: 28px;
  background: var(--paper);
  border-bottom: var(--border);
}
.brand {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-size: 1.25rem;
  text-decoration: none;
  white-space: nowrap;
}
.brand-mark {
  display: grid;
  place-items: center;
  width: 38px;
  height: 38px;
  background: var(--coral);
  border: 2px solid var(--ink);
}
.main-nav { display: flex; align-items: center; gap: 25px; margin-left: auto; }
.main-nav a { font-weight: 700; text-decoration: none; }
.main-nav a:hover, .main-nav a:focus-visible { text-decoration: underline; }
.menu-toggle {
  display: none;
  margin-left: auto;
  padding: 8px 12px;
  background: var(--lime);
  border: 2px solid var(--ink);
  font-weight: 800;
}
.button {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  min-height: 52px;
  padding: 12px 20px;
  border: var(--border);
  background: var(--ink);
  color: var(--paper);
  box-shadow: var(--shadow);
  text-decoration: none;
  text-transform: uppercase;
  font-size: .86rem;
  transition: transform .15s ease, box-shadow .15s ease;
}
.button:hover, .button:focus-visible { transform: translate(6px, 6px); box-shadow: 0 0 0 var(--ink); }
.button-small { min-height: 42px; padding: 8px 14px; font-size: .76rem; }
.button-ghost { background: var(--paper); color: var(--ink); }

.hero {
  display: grid;
  grid-template-columns: minmax(0, 1.45fr) minmax(300px, .55fr);
  min-height: 760px;
  background: var(--coral);
  border-bottom: var(--border);
}
.hero-copy { padding: clamp(48px, 7vw, 108px) clamp(18px, 5vw, 76px); }
.hero h1 { max-width: 1120px; margin-bottom: 28px; }
.hero-lead { max-width: 820px; font-size: clamp(1.15rem, 2vw, 1.55rem); font-weight: 600; }
.eyebrow { margin-bottom: 18px; font-size: .82rem; letter-spacing: .09em; text-transform: uppercase; }
.button-row { display: flex; flex-wrap: wrap; gap: 18px; margin: 35px 0 54px; }
.fact-list {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  max-width: 820px;
  margin: 0;
  padding: 0;
  border: var(--border);
  list-style: none;
  background: var(--paper);
  box-shadow: var(--shadow);
}
.fact-list li { padding: 16px 18px; }
.fact-list li + li { border-left: var(--border); }
.fact-list strong, .fact-list span { display: block; }
.fact-list strong { font-family: 'Archivo Black', sans-serif; text-transform: uppercase; }
.fact-list span { font-size: .88rem; }
.hero-symbol {
  display: grid;
  place-items: center;
  padding: 38px;
  background: var(--lime);
  border-left: var(--border);
}
.hero-symbol svg { width: min(100%, 480px); }

.section { padding: clamp(65px, 8vw, 125px) clamp(18px, 5vw, 76px); }
.section-heading {
  display: grid;
  grid-template-columns: minmax(150px, .4fr) minmax(300px, 1.25fr) minmax(250px, .65fr);
  gap: 30px;
  align-items: end;
  margin-bottom: 56px;
}
.section-heading h2, .section-heading p { margin-bottom: 0; }
.section-heading.compact { grid-template-columns: .35fr 1.65fr; }
.service-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 30px; }
.service-card {
  position: relative;
  min-height: 430px;
  padding: 34px;
  display: flex;
  flex-direction: column;
  border: var(--border);
  background: var(--paper);
  box-shadow: var(--shadow);
}
.accent-lime { background: var(--lime) !important; }
.accent-coral { background: var(--coral) !important; }
.card-number {
  width: max-content;
  margin-bottom: 46px;
  padding: 4px 10px;
  border: 2px solid var(--ink);
  background: var(--ink);
  color: var(--paper);
  font-size: 1.1rem;
}
.service-card h3 { max-width: 75%; }
.tick-list { margin: 10px 0 28px; padding: 0; list-style: none; }
.tick-list li::before { content: '✓'; margin-right: 10px; font-weight: 800; }
.arrow-link { margin-top: auto; font-weight: 800; text-transform: uppercase; }
.arrow-link span { font-size: 1.5rem; }

.about-section { display: grid; grid-template-columns: 1fr 1fr; border-block: var(--border); }
.about-panel {
  position: relative;
  min-height: 720px;
  padding: clamp(30px, 5vw, 70px);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  background: var(--lime);
  border-right: var(--border);
}
.giant-word { font-size: clamp(4rem, 12vw, 11rem); line-height: .8; letter-spacing: -.08em; }
.about-panel p { position: relative; z-index: 2; margin: 0; font-family: 'Archivo Black', sans-serif; font-size: clamp(1.4rem, 3vw, 3rem); line-height: 1; }
.door-shape {
  position: absolute;
  right: 10%;
  bottom: 0;
  width: 42%;
  height: 62%;
  border: 8px solid var(--ink);
  border-bottom: 0;
  background: var(--coral);
}
.door-shape span {
  position: absolute;
  left: 19%;
  bottom: 0;
  width: 62%;
  height: 38%;
  border: 7px solid var(--ink);
  border-bottom: 0;
  background: var(--paper);
}
.about-copy { padding: clamp(55px, 7vw, 110px) clamp(25px, 6vw, 90px); }
.steps { margin: 42px 0 0; padding: 0; list-style: none; border-top: var(--border); }
.steps li { display: grid; grid-template-columns: 58px 1fr; gap: 18px; padding: 24px 0; border-bottom: var(--border); }
.steps li > span { font-family: 'Archivo Black', sans-serif; font-size: 2rem; }
.steps strong { font-family: 'Archivo Black', sans-serif; text-transform: uppercase; }
.steps p { margin: 5px 0 0; }

.highlights { background: var(--coral); border-bottom: var(--border); }
.highlight-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.highlight-tile {
  min-height: 260px;
  padding: 26px;
  border: var(--border);
  background: var(--paper);
  box-shadow: var(--shadow);
}
.highlight-tile > span { display: block; margin-bottom: 38px; font-family: 'Archivo Black', sans-serif; font-size: 2.5rem; }
.highlight-tile h3 { margin-bottom: 15px; }

.testimonials { border-bottom: var(--border); }
.testimonial-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 25px; }
.quote-card {
  min-height: 340px;
  margin: 0;
  padding: 30px;
  display: flex;
  flex-direction: column;
  border: var(--border);
  background: var(--paper);
  box-shadow: var(--shadow);
}
.quote-card blockquote { margin: 0 0 30px; font-size: clamp(1.2rem, 2vw, 1.65rem); font-weight: 700; line-height: 1.3; }
.quote-card figcaption { margin-top: auto; padding-top: 18px; border-top: 2px solid var(--ink); }
.quote-card figcaption strong, .quote-card figcaption span { display: block; }

.contact-section {
  display: grid;
  grid-template-columns: 1.15fr .85fr;
  gap: clamp(40px, 8vw, 130px);
  padding: clamp(65px, 9vw, 130px) clamp(18px, 5vw, 76px);
  background: var(--lime);
  border-bottom: var(--border);
}
.contact-section h2 { max-width: 900px; }
.contact-section > div > p:last-child { max-width: 750px; font-size: 1.15rem; }
.contact-card { border: var(--border); background: var(--paper); box-shadow: var(--shadow); }
.contact-line { display: block; padding: 22px; border-bottom: var(--border); text-decoration: none; }
.contact-line span, .contact-line strong { display: block; }
.contact-line span { margin-bottom: 5px; font-size: .76rem; font-weight: 800; }
.contact-card .button { margin: 24px; }

.site-footer {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 30px;
  padding: 48px clamp(18px, 5vw, 76px) 30px;
  background: var(--ink);
  color: var(--paper);
}
.site-footer a { color: var(--paper); }
.footer-brand strong, .footer-brand span { display: block; }
.footer-brand strong { font-family: 'Archivo Black', sans-serif; font-size: 1.7rem; }
.footer-links { display: flex; flex-wrap: wrap; gap: 20px; align-items: start; }
.site-footer > p { grid-column: 1 / -1; margin: 25px 0 0; padding-top: 20px; border-top: 2px solid var(--paper); font-size: .82rem; }

.policy-main { padding-bottom: 100px; }
.policy-hero { padding: clamp(55px, 8vw, 120px) clamp(18px, 5vw, 76px); background: var(--coral); border-bottom: var(--border); }
.policy-hero h1 { max-width: 1100px; margin-bottom: 25px; }
.policy-layout { display: grid; grid-template-columns: 280px minmax(0, 950px); gap: clamp(35px, 7vw, 110px); padding: 70px clamp(18px, 5vw, 76px); }
.policy-index { position: sticky; top: 105px; align-self: start; display: grid; border: var(--border); box-shadow: var(--shadow); }
.policy-index strong, .policy-index a { padding: 12px 15px; border-bottom: 2px solid var(--ink); }
.policy-index strong { background: var(--lime); }
.policy-index a:last-child { border-bottom: 0; }
.policy-content section { padding: 0 0 48px; margin-bottom: 48px; border-bottom: var(--border); }
.policy-content h2 { font-size: clamp(1.8rem, 3.4vw, 3.4rem); }
.policy-number { display: inline-block; margin-bottom: 18px; padding: 5px 11px; background: var(--ink); color: var(--paper); font-family: 'Archivo Black', sans-serif; }
.policy-content a { font-weight: 700; }

@media (max-width: 980px) {
  .main-nav {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    display: none;
    margin: 0;
    padding: 18px;
    flex-direction: column;
    align-items: stretch;
    background: var(--paper);
    border-bottom: var(--border);
  }
  .main-nav.is-open { display: flex; }
  .menu-toggle { display: block; }
  .header-cta { display: none; }
  .hero { grid-template-columns: 1fr; }
  .hero-symbol { min-height: 420px; border-left: 0; border-top: var(--border); }
  .section-heading, .section-heading.compact { grid-template-columns: 1fr; }
  .about-section { grid-template-columns: 1fr; }
  .about-panel { min-height: 580px; border-right: 0; border-bottom: var(--border); }
  .highlight-grid { grid-template-columns: repeat(2, 1fr); }
  .testimonial-grid { grid-template-columns: 1fr; }
  .contact-section { grid-template-columns: 1fr; }
}

@media (max-width: 680px) {
  body { font-size: 16px; }
  h1 { font-size: clamp(2.75rem, 15vw, 5rem); }
  .site-header { min-height: 68px; gap: 12px; }
  .brand { font-size: 1rem; }
  .brand-mark { width: 33px; height: 33px; }
  .hero { min-height: 0; }
  .hero-copy { padding-top: 55px; padding-bottom: 65px; }
  .hero-symbol { min-height: 320px; padding: 24px; }
  .fact-list { grid-template-columns: 1fr; }
  .fact-list li + li { border-left: 0; border-top: var(--border); }
  .service-grid, .highlight-grid { grid-template-columns: 1fr; }
  .service-card { min-height: 390px; padding: 25px; }
  .about-panel { min-height: 440px; }
  .contact-card .button { margin: 18px; }
  .site-footer { grid-template-columns: 1fr; }
  .site-footer > p { grid-column: auto; }
  .footer-links { flex-direction: column; }
  .policy-layout { grid-template-columns: 1fr; }
  .policy-index { position: static; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .ticker-track { animation: none; }
  .button { transition: none; }
}