:root {
  --navy:#102c42;
  --teal:#168276;
  --teal-dark:#10665d;
  --bg:#f4f7fa;
  --slate:#516273;
  --border:#dce5ec;
  --surface:#fff;
  --radius:16px;
  font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  color:var(--navy);
  background:var(--bg);
  font-synthesis:none}
* {
  box-sizing:border-box}
body {
  margin:0;
  min-height:100vh}
a {
  color:var(--teal-dark);
  text-underline-offset:3px}
button,input,select {
  font:inherit}
button,a,input,select,summary {
  -webkit-tap-highlight-color:transparent}
[hidden],.hidden {
  display:none!important}
:focus-visible {
  outline:3px solid var(--teal);
  outline-offset:4px}
.wrap {
  max-width:1200px;
  margin:auto;
  padding:0 32px}
.nav {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  padding-top:24px;
  padding-bottom:24px;
  border-bottom:1px solid var(--border)}
.brand {
  color:var(--navy);
  font-size:17px;
  font-weight:700;
  text-decoration:none;
  line-height:1.4}
.nav-phone {
  font-size:13px;
  font-weight:600;
  flex-shrink:0;
  text-decoration:none}
.main {
  padding-top:32px;
  padding-bottom:48px}
.hero {
  display:grid;
  grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);
  gap:40px;
  align-items:start}
.intro {
  padding-top:24px}
.eyebrow {
  display:inline-block;
  color:var(--teal-dark);
  font-size:14px;
  font-weight:600}
.intro h1 {
  font-size:clamp(36px,4.2vw,56px);
  line-height:1.12;
  letter-spacing:-1.8px;
  font-weight:700;
  margin:16px 0 24px}
.intro h1 em {
  color:var(--teal);
  font-style:normal}
.intro p {
  color:var(--slate);
  font-size:16px;
  line-height:1.7;
  max-width:440px;
  margin:0 0 24px}
.intro .hero-note {
  font-size:12px;
  max-width:360px}
.panel {
  background:var(--surface);
  border:1px solid var(--border);
  border-radius:var(--radius);
  padding:32px;
  box-shadow:0 8px 32px #102c4208;
  min-width:0}
.progress-head {
  display:flex;
  justify-content:space-between;
  gap:16px;
  color:var(--slate);
  font-size:12px;
  font-weight:600}
.progress {
  height:4px;
  background:#e7edf2;
  border-radius:8px;
  overflow:hidden;
  margin:16px 0 32px}
.progress>div {
  height:100%;
  width:0;
  background:var(--teal);
  border-radius:8px;
  transition:width 180ms ease}
#question-area {
  min-height:0}
.question-title {
  font-size:25px;
  line-height:1.3;
  letter-spacing:-.5px;
  margin:0 0 8px;
  scroll-margin-top:24px}
.question-title:focus {
  outline:none}
.question-sub {
  color:var(--slate);
  font-size:14px;
  line-height:1.6;
  margin:0 0 24px}
.options {
  display:grid;
  gap:12px}
.option {
  display:flex;
  align-items:center;
  gap:12px;
  width:100%;
  text-align:left;
  min-height:56px;
  padding:16px;
  border:1px solid var(--border);
  border-radius:12px;
  background:white;
  color:var(--navy);
  font-size:14px;
  font-weight:500;
  cursor:pointer;
  transition:background 150ms,border-color 150ms,transform 150ms}
.option:hover {
  border-color:var(--teal);
  background:#f1faf8}
.option:active {
  transform:scale(.995)}
.option[aria-pressed="true"] {
  background:#e8f5f2;
  border-color:var(--teal)}
.option:disabled {
  cursor:default}
.dot {
  height:20px;
  width:20px;
  border:1px solid #a7b6c3;
  border-radius:50%;
  flex-shrink:0;
  display:grid;
  place-items:center}
.option[aria-pressed="true"] .dot {
  background:var(--teal);
  border-color:var(--teal)}
.option[aria-pressed="true"] .dot:after {
  content:'✓';
  font-size:13px;
  color:white}
.actions {
  display:flex;
  justify-content:space-between;
  gap:16px;
  align-items:center;
  margin-top:24px}
.btn {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:48px;
  border:0;
  border-radius:10px;
  padding:12px 20px;
  font-size:14px;
  font-weight:600;
  cursor:pointer;
  transition:background 150ms;
  text-decoration:none}
.back {
  color:var(--slate);
  background:transparent;
  padding-left:0}
.back:disabled {
  opacity:.45;
  cursor:default}
.primary {
  color:white;
  background:var(--teal)}
.primary:hover {
  background:var(--teal-dark)}
.primary:disabled {
  opacity:.65;
  cursor:wait}
.reassurance {
  text-align:right;
  color:var(--slate);
  font-size:12px;
  line-height:1.6;
  margin:16px 0 0}
.supporting-content {
  max-width:840px;
  margin:40px auto 0}
.info-section {
  margin-top:48px}
.info-section h2,.learn-more h2 {
  font-size:25px;
  letter-spacing:-.5px;
  margin:0 0 24px}
.how-steps {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:32px;
  padding-left:24px}
.how-steps li {
  font-size:14px;
  padding-left:4px}
.how-steps li::marker {
  color:var(--teal);
  font-weight:700}
.how-steps p,.faq p,.learn-more p,.guide-card p {
  color:var(--slate);
  font-size:14px;
  line-height:1.7}
.faq details {
  border-bottom:1px solid var(--border);
  padding:20px 0}
.faq summary {
  cursor:pointer;
  line-height:1.6;
  font-size:14px;
  font-weight:600}
.faq p {
  margin:12px 0 0}
.learn-more {
  background:white;
  border:1px solid var(--border);
  border-radius:var(--radius);
  padding:32px;
  margin-top:40px}
.learn-more a,.guide-card a {
  font-size:14px;
  font-weight:600}
.disclosure {
  border-top:1px solid var(--border);
  padding-top:24px;
  margin-top:40px;
  color:var(--slate);
  font-size:12px;
  line-height:1.7}
.disclosure strong {
  font-weight:600}
footer {
  background:#eef2f6;
  border-top:1px solid var(--border);
  padding:24px 0}
.footer-inner {
  display:flex;
  justify-content:space-between;
  gap:24px;
  align-items:center}
.footer-caption,.footer-links {
  font-size:12px;
  color:var(--slate)}
.footer-links {
  display:flex;
  gap:24px;
  flex-wrap:wrap}
.footer-links a {
  color:var(--slate);
  text-decoration:none}
.field-grid {
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:0 16px}
.field {
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:8px;
  margin-bottom:16px}
.field label {
  font-size:13px;
  font-weight:600}
.field input,.field select {
  width:100%;
  min-height:48px;
  border:1px solid var(--border);
  background:white;
  border-radius:10px;
  padding:12px;
  font-size:16px;
  color:var(--navy)}
.field input:focus,.field select:focus {
  outline:2px solid var(--teal);
  outline-offset:2px}
.field input[aria-invalid="true"] {
  border-color:#a3352e}
.field-hint {
  font-size:11px;
  color:var(--slate);
  line-height:1.5}
.fineprint {
  color:var(--slate);
  font-size:12px;
  line-height:1.6}
.checkline {
  display:flex;
  align-items:flex-start;
  gap:12px;
  font-size:12px;
  line-height:1.7;
  margin:16px 0;
  color:var(--slate)}
.checkline input {
  flex-shrink:0;
  margin-top:4px;
  accent-color:var(--teal);
  width:18px;
  height:18px}
.notice {
  border-radius:10px;
  background:var(--bg);
  padding:12px 16px;
  margin:0 0 24px;
  font-size:12px;
  line-height:1.6;
  color:var(--slate)}
.form-error {
  background:#fff2ef;
  border:1px solid #e8a99e;
  border-radius:10px;
  padding:12px 16px;
  margin-top:16px;
  color:#9e3728;
  font-size:13px;
  line-height:1.5}
.success-icon {
  display:grid;
  place-items:center;
  background:#e8f5f2;
  color:var(--teal);
  width:48px;
  height:48px;
  border-radius:50%;
  font-size:24px;
  margin-bottom:24px;
  animation:success-in 180ms ease-out}
.success>p {
  color:var(--slate);
  font-size:14px;
  line-height:1.7}
.summary-card {
  border:1px solid var(--border);
  border-radius:12px;
  padding:20px;
  margin:24px 0;
  background:var(--bg)}
.summary-card h3 {
  margin:0 0 16px;
  font-size:15px}
.summary-card dl {
  margin:0}
.summary-card dl>div+div {
  margin-top:16px}
.summary-card dt {
  font-size:12px;
  color:var(--slate);
  line-height:1.5}
.summary-card dd {
  font-size:14px;
  font-weight:600;
  margin:4px 0 0;
  line-height:1.5}
.call-cta {
  width:100%}
.guide {
  max-width:840px}
.guide .intro {
  padding-top:0;
  text-align:center}
.guide .intro p {
  margin:0 auto 32px;
  max-width:600px}
.guide-card {
  background:white;
  border:1px solid var(--border);
  border-radius:var(--radius);
  padding:32px;
  margin-bottom:24px}
.guide-card h2 {
  font-size:24px;
  margin:0 0 16px}
.guide-cta {
  display:inline-flex}
@keyframes success-in {
  from {
  opacity:0;
  transform:scale(.9)}
to {
  opacity:1;
  transform:scale(1)}
}
@media(max-width:900px) {
  .hero {
  gap:32px;
  grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr)}
.intro h1 {
  font-size:40px}
.panel {
  padding:24px}
}
@media(max-width:700px) {
  .wrap {
  padding-left:20px;
  padding-right:20px}
.nav {
  padding-top:16px;
  padding-bottom:16px;
  gap:12px}
.brand {
  font-size:14px;
  max-width:160px}
.nav-phone {
  font-size:11px}
.main {
  padding-top:24px;
  padding-bottom:40px}
.hero {
  grid-template-columns:1fr;
  gap:24px}
.intro {
  padding-top:0}
.eyebrow {
  font-size:12px}
.intro h1 {
  font-size:34px;
  letter-spacing:-1px;
  margin:8px 0 12px}
.intro h1 br {
  display:none}
.intro p {
  font-size:14px;
  line-height:1.6;
  margin:0;
  max-width:none}
.intro .hero-note {
  display:none}
.panel {
  padding:20px}
.progress {
  margin-bottom:24px}
.question-title {
  font-size:23px}
.question-sub {
  font-size:13px;
  margin-bottom:20px}
#question-area {
  min-height:0}
.option {
  min-height:48px;
  padding:12px}
.reassurance {
  text-align:center}
.supporting-content {
  margin-top:40px}
.how-steps,.field-grid {
  grid-template-columns:1fr}
.how-steps {
  gap:16px}
.footer-inner {
  flex-direction:column;
  align-items:flex-start}
.guide-card,.learn-more {
  padding:24px}
.info-section {
  margin-top:40px}
.guide .intro p {
  margin-bottom:24px}
.actions {
  gap:12px}
.actions .primary {
  padding:12px 16px}
}
@media(prefers-reduced-motion:reduce) {
  *,*::before,*::after {
  animation:none!important;
  transition:none!important;
  scroll-behavior:auto!important}
}


.skip-link {
  position:absolute;
  width:1px;
  height:1px;
  padding:0;
  overflow:hidden;
  clip-path:inset(50%);
  white-space:nowrap;
}
.skip-link:focus-visible {
  position:fixed;
  left:16px;
  top:8px;
  width:auto;
  height:auto;
  padding:12px 16px;
  overflow:visible;
  clip-path:none;
  z-index:10;
  background:white;
  border-radius:8px;
}
.supporting-content>.info-section:first-child {
  margin-top:0}
.nav a,.footer-links a {
  display:inline-flex;
  align-items:center;
  min-height:44px}
.checkline {
  padding:8px 0;
  cursor:pointer}
.faq summary {
  min-height:44px;
  align-content:center}
.option,.btn,.summary-card dd {
  overflow-wrap:anywhere}
.intro h1 em {
  color:var(--teal-dark)}
.field-hint {
  font-size:12px}
.question-title:focus-visible {
  outline:2px solid var(--teal);
  outline-offset:4px}
.panel[data-step="state"] {
  padding-bottom:24px}
@media(max-width:360px) {
  .wrap {
  padding-left:16px;
  padding-right:16px}
.nav {
  flex-wrap:wrap;
  gap:0 12px}
.brand {
  max-width:none}
.nav-phone {
  font-size:12px}
.panel {
  padding:16px}
.intro h1 {
  font-size:30px}
.actions {
  flex-wrap:wrap}
.actions .primary {
  flex:1}
.footer-links {
  gap:8px 20px}
}

@media(max-width:700px) {
  .home .intro h1 {font-size:clamp(28px,7.8vw,34px);line-height:1.16;letter-spacing:-.7px;}
  .home .intro h1 em {display:block;}
}
