/* ==========================================================================
   KRYPONCORP — site stylesheet
   Values are taken directly from the Claude Design handoff prototypes.
   ========================================================================== */

:root {
  --navy: #0B1526;
  --navy-deep: #0B1F42;
  --blue: #0C3C7E;
  --blue-hover: #0a3269;
  --blue-bright: #0C4FA0;
  --blue-areas: #003F83;
  --red: #A60002;
  --red-hover: #8c0002;
  --red-light: #ec4b4b;
  --ink: #1c1c1e;
  --ink-heading: #101820;
  --ink-body: #3a3a3c;
  --ink-body-2: #2c2c2e;
  --muted: #6b6b70;
  --placeholder: #8a8a8e;
  --on-dark: #c9d4e6;
  --on-dark-muted: #aab4c4;
  --on-dark-faint: #8fa0b8;
  --hero-copy: #d7dbe2;
  --border: #d0d0d4;
  --card-border: #e2e2e6;
  --page-bg: #f2f3f5;
  --tint-blue: #BCCFE3;
  --tint-red: #F0D9D9;
  --on-red: #f4d9d9;
  --font: 'Archivo', Helvetica, Arial, sans-serif;
}

/* --------------------------------------------------------------------------
   Base
   -------------------------------------------------------------------------- */
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
body {
  margin: 0;
  background: #fff;
  font-family: var(--font);
  color: var(--ink);
  overflow-x: hidden;
}
img { max-width: 100%; }
a { color: inherit; text-decoration: none; }
a:hover { opacity: .85; }
h1, h2, h3, p { margin: 0; }
strong { font-weight: 700; }

input, select, textarea, button { font-family: var(--font); font-size: 13px; color: var(--ink); }
input::placeholder, textarea::placeholder { color: var(--placeholder); font-family: var(--font); }
input:focus-visible, textarea:focus-visible, select:focus-visible,
a:focus-visible, button:focus-visible { outline: 2px solid var(--red); outline-offset: 2px; }

.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;
}

.container { max-width: 1140px; margin: 0 auto; }

/* --------------------------------------------------------------------------
   Buttons
   -------------------------------------------------------------------------- */
.btn { display: inline-block; font-size: 13px; font-weight: 600; border: 0; cursor: pointer; transition: background .15s ease, opacity .15s ease; }
.btn-red { background: var(--red); color: #fff; padding: 13px 30px; }
.btn-red:hover { background: var(--red-hover); opacity: 1; }
.btn-blue { background: var(--blue); color: #fff; padding: 13px 26px; }
.btn-blue:hover { background: var(--blue-hover); opacity: 1; }
.btn-pill { border-radius: 999px; }
.btn-white { background: #fff; color: var(--ink-heading); padding: 10px 20px; border-radius: 999px; font-weight: 600; white-space: nowrap; }
.btn-white:hover { background: #e8e8e8; opacity: 1; }
.btn-outline-white { border: 1.5px solid #fff; color: #fff; padding: 12px 34px; border-radius: 8px; background: transparent; }
.btn-outline-white:hover { background: rgba(255,255,255,.15); opacity: 1; }
.btn-cta {
  background: var(--red); color: #fff; font-size: 12px; font-weight: 700;
  letter-spacing: .08em; padding: 14px 28px; display: inline-block;
}
.btn-cta:hover { background: var(--red-hover); opacity: 1; }

/* --------------------------------------------------------------------------
   Nav
   -------------------------------------------------------------------------- */
.nav {
  display: flex; align-items: center; justify-content: space-between;
  padding: 16px 48px; background: var(--navy);
  position: fixed; top: 0; left: 0; right: 0; z-index: 100;
  transition: background .2s ease, box-shadow .2s ease;
}
.nav--overlay { background: rgba(8,12,20,.55); backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); }
.nav.is-scrolled { background: var(--navy); box-shadow: 0 6px 20px rgba(0,0,0,.25); }
body { padding-top: 56px; }
body.home { padding-top: 0; }
[id] { scroll-margin-top: 70px; }
.nav-brand { display: flex; align-items: center; }
.nav-brand img { height: 24px; display: block; }
.nav-links {
  display: flex; align-items: center; gap: 28px;
  color: #fff; font-size: 13px; font-weight: 500;
}
.nav-toggle {
  display: none; background: transparent; border: 0; padding: 8px; cursor: pointer; color: #fff;
}
.nav-toggle svg { display: block; }

/* --------------------------------------------------------------------------
   Footer
   -------------------------------------------------------------------------- */
.footer {
  background: linear-gradient(rgba(6,14,28,.85), rgba(6,14,28,.85)), url('../assets/banners/image-banner-7-footer.png') center/cover no-repeat;
  color: #fff; border-top: 4px solid var(--red);
}
.footer-inner {
  max-width: 1240px; margin: 0 auto; padding: 34px 40px;
  display: flex; align-items: center; gap: 36px; flex-wrap: wrap;
}
.footer-brand img { height: 24px; display: block; }
.footer-tagline { margin-top: 8px; font-size: 11.5px; color: var(--on-dark-muted); }
.footer-links {
  display: flex; align-items: center; gap: 24px; margin-left: auto;
  font-size: 12.5px; font-weight: 500; flex-wrap: wrap;
}
.footer-links .sep { width: 1px; height: 14px; background: rgba(255,255,255,.3); }
.footer-links .with-icon { display: flex; align-items: center; gap: 8px; font-weight: 600; }
.footer-links .with-icon .ico { color: var(--red-light); display: inline-flex; }
.footer-links .btn-white { padding: 11px 22px; font-size: 12.5px; }
.footer-copy {
  background: rgba(0,0,0,.45); text-align: center; padding: 12px 20px;
  font-size: 10.5px; letter-spacing: .05em; color: var(--on-dark-faint);
}

/* --------------------------------------------------------------------------
   Home — Hero
   -------------------------------------------------------------------------- */
.hero {
  position: relative;
  background: url('../assets/banners/image-banner-1.png') center/cover no-repeat;
  border-bottom: 4px solid var(--red);
}
.hero-body {
  display: flex; flex-direction: column; align-items: center; text-align: center;
  padding: 166px 60px 150px;
}
.hero-body h1 { color: #fff; font-size: 44px; line-height: 1.25; font-weight: 700; max-width: 860px; }
.hero-body p { margin-top: 22px; color: var(--hero-copy); font-size: 15px; line-height: 1.6; max-width: 640px; }
.hero-body .btn-cta { margin-top: 34px; }

/* Every step band */
.every-step {
  background: url('../assets/banners/image-banner-2.png') center/cover no-repeat;
  padding: 64px 60px 72px; color: #fff;
}
.every-step h2 { text-align: center; font-size: 28px; font-weight: 700; }
.every-step .lead {
  margin: 14px auto 0; text-align: center; font-size: 14px; line-height: 1.6;
  color: var(--on-dark); max-width: 520px;
}
.step-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 48px; margin-top: 56px; }
.step { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 16px; }
.step img { height: 56px; }
.step-title { font-size: 19px; font-weight: 700; }
.step p { font-size: 13px; line-height: 1.6; color: var(--on-dark); max-width: 280px; }

/* About */
.about {
  border-top: 4px solid var(--red);
  background:
    linear-gradient(180deg, rgba(6,17,38,.96) 0%, rgba(6,17,38,.75) 34%, rgba(6,17,38,0) 62%),
    url('../assets/banners/image-banner-3.png') center bottom/cover no-repeat;
  padding: 64px 0 300px;
}
.about-inner { max-width: 1140px; margin: 0 auto; padding: 0 40px; }
.about-card { background: rgba(244,246,250,.92); max-width: 520px; padding: 34px 36px 38px; }
.eyebrow { font-size: 11px; font-weight: 600; letter-spacing: .35em; color: var(--ink-body); }
.about-card h2 { margin-top: 14px; font-size: 26px; line-height: 1.3; font-weight: 800; color: var(--ink-heading); max-width: 420px; }
.about-card p { margin-top: 16px; font-size: 12.5px; line-height: 1.65; color: var(--ink-body); }
.about-card .btn-blue { margin-top: 24px; }

/* Going further */
.further { background: #fff; padding: 90px 60px; }
.further-inner { max-width: 1140px; margin: 0 auto; display: flex; align-items: center; gap: 80px; }
.further-media { position: relative; flex: 0 0 46%; }
.further-photo { position: relative; overflow: hidden; }
.further-photo img { display: block; width: 100%; height: 340px; object-fit: cover; }
.further-photo::after { content: ""; position: absolute; inset: 0; background: rgba(12,45,94,.55); }
.further-badges {
  position: absolute; top: 50%; right: -70px; transform: translateY(-50%);
  display: flex; flex-direction: column; gap: 16px;
}
.further-badges img { width: 250px; display: block; filter: drop-shadow(0 10px 24px rgba(0,0,0,.25)); }
.further-copy { flex: 1; max-width: 420px; margin-left: auto; }
.further-copy h2 { font-size: 26px; line-height: 1.3; font-weight: 800; color: var(--ink-heading); }
.further-copy p { margin-top: 16px; font-size: 13px; line-height: 1.7; color: var(--ink-body); }
.further-copy h2 + p { margin-top: 18px; }

/* Solution banner */
.solution { position: relative; }
.solution img { display: block; width: 100%; height: auto; }
.solution-text {
  position: absolute; top: 50%; right: 7%; transform: translateY(-50%); max-width: 360px;
  color: var(--blue-bright); font-size: 32px; line-height: 1.3; font-weight: 800;
}

/* Planning grid */
.planning { background: #fff; padding: 70px 60px; }
.planning-grid { max-width: 1140px; margin: 0 auto; display: grid; grid-template-columns: 1fr 1fr; }
.plan-text { padding: 44px 46px; display: flex; flex-direction: column; justify-content: center; }
.plan-text--blue { background: var(--tint-blue); }
.plan-text--red { background: var(--tint-red); }
.plan-text h3 { font-size: 22px; font-weight: 800; color: var(--ink-heading); }
.plan-text p { margin-top: 14px; font-size: 11.5px; line-height: 1.65; color: var(--ink-body-2); }
.plan-img { display: block; width: 100%; height: 100%; object-fit: cover; }
.plan-img--a { min-height: 300px; }
.plan-img--b { min-height: 340px; }
.plan-label { color: #fff; display: flex; align-items: center; justify-content: center; gap: 14px; padding: 26px; }
.plan-label--blue { background: var(--blue); }
.plan-label--red { background: var(--red); }
.plan-label img { height: 26px; }
.plan-label span { font-size: 17px; font-weight: 700; }

/* Service areas */
.areas {
  background: var(--blue-areas); padding: 44px 60px 40px;
  display: flex; flex-direction: column; align-items: center; gap: 26px;
}
.areas h2 { text-align: center; color: #fff; font-size: 26px; font-weight: 700; }
.areas img { display: block; width: 740px; max-width: 90%; height: auto; filter: drop-shadow(0 8px 24px rgba(0,0,0,.3)); }
.areas p { text-align: center; color: var(--on-dark); font-size: 12.5px; line-height: 1.7; }

/* Qualifications */
.quals { background: #fff; padding: 70px 0 60px; position: relative; }
.quals-inner { max-width: 1240px; margin: 0 auto; position: relative; padding: 0 50px; }
.quals-photo { position: absolute; top: 70px; right: 50px; width: 48%; height: 660px; object-fit: cover; }
.quals-red {
  position: relative; z-index: 2; background: rgba(166,0,2,.9); color: #fff;
  width: 44%; min-width: 440px; padding: 40px 44px 44px; backdrop-filter: blur(6px);
}
.quals-red h2 { font-size: 26px; font-weight: 800; letter-spacing: .04em; }
.quals-red p { margin-top: 14px; font-size: 12.5px; line-height: 1.7; color: var(--on-red); }
.quals-red h2 + p { margin-top: 18px; }
.quals-red .btn-outline-white { margin-top: 26px; }
.quals-blue {
  position: relative; z-index: 2; background: rgba(12,60,126,.93); color: #fff;
  width: 58%; min-width: 560px; margin-top: 48px; padding: 36px 44px 42px; backdrop-filter: blur(6px);
}
.quals-blue h3 { font-size: 19px; font-weight: 700; }
.quals-blue p { margin-top: 14px; font-size: 12px; line-height: 1.7; color: var(--on-dark); }
.quals-blue h3 + p { margin-top: 16px; }

.benefit-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 26px; margin-top: 70px; position: relative; z-index: 2; }
.benefit {
  background: #fff; border: 1px solid var(--card-border); border-top: 4px solid var(--blue);
  padding: 28px 28px 30px; box-shadow: 0 10px 28px rgba(16,24,32,.08);
}
.benefit--red { border-top-color: var(--red); }
.benefit-head { display: flex; align-items: center; gap: 12px; }
.benefit-icon {
  width: 40px; height: 40px; flex: none; background: var(--blue); color: #fff;
  display: inline-flex; align-items: center; justify-content: center;
}
.benefit--red .benefit-icon { background: var(--red); }
.benefit h3 { font-size: 16px; font-weight: 800; color: var(--ink-heading); }
.benefit p { margin-top: 16px; font-size: 12px; line-height: 1.7; color: var(--ink-body); }
.bullets { margin-top: 16px; display: flex; flex-direction: column; gap: 8px; }
.bullet { display: flex; gap: 10px; align-items: flex-start; }
.bullet::before { content: ""; width: 6px; height: 6px; background: var(--red); margin-top: 6px; flex: none; }
.bullet span { font-size: 12px; line-height: 1.6; color: var(--ink-body); }

/* Contact */
.contact { background: url('../assets/banners/image-banner-6.png') center/cover no-repeat; padding: 80px 60px; }
.contact-inner {
  max-width: 1160px; margin: 0 auto; display: flex; align-items: stretch;
  box-shadow: 0 24px 60px rgba(16,24,32,.25);
}
.contact-side {
  flex: 0 0 40%; background: var(--navy-deep); color: #fff; padding: 42px 42px 38px;
  display: flex; flex-direction: column; border-top: 4px solid var(--red);
}
.eyebrow-red { font-size: 11px; font-weight: 700; letter-spacing: .3em; color: var(--red-light); }
.contact-side h2 { margin-top: 12px; font-size: 24px; font-weight: 800; }
.contact-side .lead { margin-top: 14px; font-size: 12.5px; line-height: 1.7; color: var(--on-dark-muted); }
.contact-rows { display: flex; flex-direction: column; gap: 14px; margin-top: 28px; }
.contact-row { display: flex; align-items: center; gap: 14px; }
.contact-row .box {
  width: 38px; height: 38px; flex: none; border: 1.5px solid var(--red);
  display: inline-flex; align-items: center; justify-content: center; color: #fff;
}
.contact-row .lbl { display: block; font-size: 10.5px; font-weight: 600; letter-spacing: .08em; color: var(--on-dark-faint); }
.contact-row .val { display: block; margin-top: 2px; font-size: 14px; font-weight: 700; }
.contact-foot { margin-top: auto; padding-top: 28px; }
.contact-foot .note { border-top: 1px solid rgba(255,255,255,.15); padding-top: 22px; font-size: 12px; line-height: 1.6; color: var(--on-dark-muted); }
.contact-foot .btn-red { margin-top: 14px; padding: 13px 32px; }
.contact-form-wrap { flex: 1; background: #fff; padding: 38px 42px 40px; }
.contact-form-wrap h3 { font-size: 19px; font-weight: 800; color: var(--ink-heading); }
.contact-form-wrap .sub { margin-top: 8px; font-size: 12px; color: var(--muted); }
.contact-form { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; align-content: start; margin-top: 22px; }
.contact-form .form-foot {
  grid-column: 1 / -1; display: flex; justify-content: space-between; align-items: center; gap: 16px; flex-wrap: wrap;
}
.contact-form .fine { font-size: 11px; color: var(--placeholder); max-width: 300px; }
.contact-form .actions { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }
.contact-form .btn-blue { padding: 13px 44px; }
.form-thanks { font-size: 13px; font-weight: 600; color: var(--blue); }

/* --------------------------------------------------------------------------
   Form controls (shared)
   -------------------------------------------------------------------------- */
.input, .select, .textarea {
  width: 100%; border: 1px solid var(--border); background: #fff;
  padding: 14px 16px; font-size: 13px; color: var(--ink);
}
.select { padding: 14px 12px; appearance: auto; }
.textarea { resize: vertical; min-height: 0; }
.span-2 { grid-column: 1 / -1; }
.input-stack { display: flex; flex-direction: column; gap: 6px; }
.input-stack label { font-size: 11px; font-weight: 600; color: var(--muted); }
.input-stack .input { padding: 12px 16px; }
.check-inline {
  display: flex; align-items: center; gap: 10px; font-size: 13px; color: var(--ink-body);
  border: 1px solid var(--border); padding: 0 16px; min-height: 45px;
}
.check-inline input, .consent input { width: 15px; height: 15px; accent-color: var(--red); flex: none; }
.consent { display: flex; align-items: flex-start; gap: 10px; font-size: 11.5px; line-height: 1.6; color: var(--ink-body); }
.consent input { margin-top: 2px; }
.link-red { color: var(--red); font-weight: 600; }
.split-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.hp { position: absolute; left: -9999px; width: 1px; height: 1px; opacity: 0; }

.form-error {
  display: none; grid-column: 1 / -1; background: var(--tint-red); color: var(--red);
  padding: 12px 16px; font-size: 12.5px; line-height: 1.6;
}
.form-error.is-visible { display: block; }
.btn[disabled] { opacity: .6; cursor: default; }

/* --------------------------------------------------------------------------
   Sub-pages (Apply / Quote / Legal)
   -------------------------------------------------------------------------- */
.page-hero { background: var(--blue); border-bottom: 4px solid var(--red); color: #fff; padding: 56px 60px; }
.page-hero--photo {
  background: linear-gradient(rgba(8,15,28,.78), rgba(8,15,28,.78)), url('../assets/banners/image-banner-1.png') center/cover no-repeat;
  padding: 64px 60px;
}
.page-hero--legal { padding: 64px 60px; }
.page-hero h1 { font-size: 34px; font-weight: 800; }
.page-hero--legal h1 { font-size: 36px; }
.page-hero .eyebrow-red + h1 { margin-top: 12px; }
.page-hero p { margin-top: 12px; font-size: 13.5px; line-height: 1.6; color: var(--on-dark); max-width: 560px; }
.page-hero--legal p { font-size: 13px; }
.page-hero .container--narrow { max-width: 900px; }

.form-page { background: var(--page-bg); padding: 64px 60px 80px; }
.form-layout { max-width: 1140px; margin: 0 auto; display: flex; gap: 40px; align-items: flex-start; }
.form-aside { flex: 0 0 320px; display: flex; flex-direction: column; gap: 22px; }
.form-aside h2 { font-size: 21px; font-weight: 800; color: var(--ink-heading); }
.form-aside p { font-size: 12.5px; line-height: 1.7; color: var(--ink-body); }
.aside-list { display: flex; flex-direction: column; gap: 12px; }
.aside-item { display: flex; gap: 12px; align-items: flex-start; }
.aside-item::before { content: ""; width: 8px; height: 8px; background: var(--red); margin-top: 5px; flex: none; }
.aside-item span { font-size: 12.5px; line-height: 1.6; color: var(--ink-body); }
.aside-box { background: var(--blue); color: #fff; padding: 22px 24px; }
.aside-box .lbl { font-size: 12px; font-weight: 700; letter-spacing: .1em; color: var(--on-dark); }
.aside-box .tel { display: block; margin-top: 12px; font-size: 15px; font-weight: 700; }
.aside-box .mail { display: block; margin-top: 6px; font-size: 13px; color: var(--on-dark); }

.form-card {
  flex: 1; min-width: 0; background: #fff; box-shadow: 0 18px 40px rgba(16,24,32,.12);
  padding: 38px 40px 42px; display: flex; flex-direction: column; gap: 14px;
}
.form-section-label { font-size: 12px; font-weight: 700; letter-spacing: .12em; color: var(--red); }
.form-section-label + .form-grid { margin-top: 0; }
.form-grid + .form-section-label { margin-top: 14px; }
.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.form-submit { display: flex; justify-content: flex-end; margin-top: 8px; }
.form-submit .btn { padding: 14px 48px; }

.form-success {
  flex: 1; background: #fff; box-shadow: 0 18px 40px rgba(16,24,32,.12);
  padding: 70px 60px; text-align: center;
}
.form-success .check {
  width: 56px; height: 56px; margin: 0 auto; color: #fff; background: var(--red);
  display: flex; align-items: center; justify-content: center; font-size: 26px; font-weight: 800;
}
.form-success .check--blue { background: var(--blue); }
.form-success h2 { margin-top: 26px; font-size: 23px; font-weight: 800; color: var(--ink-heading); }
.form-success p { margin: 14px auto 0; font-size: 13px; line-height: 1.7; color: var(--ink-body); max-width: 420px; }
.form-success .btn { margin-top: 28px; }
[hidden] { display: none !important; }

/* Legal pages */
.legal { padding: 70px 60px 90px; }
.legal-inner { max-width: 900px; margin: 0 auto; display: flex; flex-direction: column; gap: 36px; }
.legal h2 { font-size: 20px; font-weight: 800; color: var(--ink-heading); }
.legal p { margin-top: 12px; font-size: 13.5px; line-height: 1.75; color: var(--ink-body); }

/* --------------------------------------------------------------------------
   Responsive
   -------------------------------------------------------------------------- */
@media (max-width: 1100px) {
  .further-badges { right: -30px; }
  .further-badges img { width: 200px; }
  .quals-red, .quals-blue { min-width: 0; }
  .quals-photo { width: 44%; }
}

@media (max-width: 960px) {
  body { padding-top: 52px; }
  .nav { padding: 14px 20px; }
  .nav-toggle { display: block; min-width: 44px; min-height: 44px; margin-right: -8px; }
  .nav-links {
    display: none; position: absolute; left: 0; right: 0; top: 100%;
    flex-direction: column; align-items: flex-start; gap: 0;
    background: var(--navy); padding: 8px 20px 20px; border-top: 1px solid rgba(255,255,255,.1);
    max-height: calc(100vh - 52px); overflow-y: auto; box-shadow: 0 16px 30px rgba(0,0,0,.35);
  }
  .nav-links.is-open { display: flex; }
  .nav-links > a { padding: 14px 0; width: 100%; font-size: 15px; border-bottom: 1px solid rgba(255,255,255,.08); }
  .nav-links > .btn-white { width: auto; margin-top: 8px; padding: 10px 20px; }

  .hero-body { padding: 132px 24px 100px; }
  .hero-body h1 { font-size: 34px; }
  .every-step { padding: 56px 24px; }
  .step-grid { grid-template-columns: 1fr; gap: 36px; }
  .about { padding: 56px 0 220px; }
  .about-inner { padding: 0 24px; }

  .further { padding: 64px 24px; }
  .further-inner { flex-direction: column; gap: 40px; }
  .further-media { flex: none; width: 100%; }
  .further-badges { position: static; transform: none; flex-direction: row; justify-content: center; margin-top: 20px; }
  .further-copy { max-width: none; margin-left: 0; }

  .solution img { height: 280px; object-fit: cover; }
  .solution-text {
    position: static; transform: none; max-width: none; font-size: 26px;
    padding: 28px 24px 8px; text-align: center;
  }

  .planning { padding: 56px 24px; }
  .planning-grid { grid-template-columns: 1fr; }
  .plan-img { min-height: 240px; height: 260px; }
  .plan-text { padding: 32px 28px; }

  .areas { padding: 44px 24px 40px; }

  .quals { padding: 56px 0 48px; }
  .quals-inner { padding: 0 24px; }
  .quals-photo { position: static; width: 100%; height: 300px; display: block; margin-bottom: 24px; }
  .quals-red, .quals-blue { width: 100%; }
  .quals-blue { margin-top: 24px; }
  .benefit-grid { grid-template-columns: 1fr; margin-top: 40px; }

  .contact { padding: 56px 24px; }
  .contact-inner { flex-direction: column; }
  .contact-side { flex: none; }
  .contact-form-wrap { padding: 32px 28px; }

  .page-hero, .page-hero--photo, .page-hero--legal { padding: 48px 24px; }
  .page-hero h1, .page-hero--legal h1 { font-size: 30px; }
  .form-page { padding: 48px 24px 64px; }
  .form-layout { flex-direction: column; }
  .form-aside { flex: none; width: 100%; }
  .form-card { width: 100%; padding: 30px 24px 34px; }
  .form-success { padding: 56px 24px; }
  .legal { padding: 56px 24px 72px; }

  .footer-inner { padding: 30px 24px; }
  .footer-links { margin-left: 0; gap: 14px 20px; }
}

@media (max-width: 600px) {
  /* 16px inputs stop iOS from zooming on focus */
  .input, .select, .textarea, .check-inline { font-size: 16px; }
  .btn, .btn-cta, .btn-white { font-size: 14px; }
  .btn-red, .btn-blue, .btn-cta, .btn-outline-white { padding-top: 15px; padding-bottom: 15px; }
  .nav-links > .btn-white { padding: 13px 22px; }
  .footer-links a { padding: 6px 0; }
  .contact-row { min-height: 44px; }
  /* body copy a step larger for phone readability */
  .hero-body p, .every-step .lead, .step p, .about-card p, .further-copy p, .plan-text p,
  .areas p, .quals-red p, .quals-blue p, .benefit p, .bullet span, .contact-side .lead,
  .contact-foot .note, .form-aside p, .aside-item span, .consent, .legal p, .page-hero p,
  .form-success p, .contact-form-wrap .sub { font-size: 14px; }
  .hero-body h1 { font-size: 28px; }
  .every-step h2, .about-card h2, .further-copy h2, .areas h2, .quals-red h2 { font-size: 22px; }
  .about-card { padding: 28px 24px 30px; }
  .form-grid, .contact-form, .split-2 { grid-template-columns: 1fr; }
  .form-submit { justify-content: stretch; }
  .form-submit .btn { width: 100%; }
  .contact-form .actions { width: 100%; }
  .contact-form .btn-blue { width: 100%; }
  .further-badges { flex-direction: column; align-items: center; }
  .solution-text { font-size: 22px; }
  .footer-links .sep { display: none; }
}