/*
 * INFINITI / Editorial edition
 * Visual direction: bright, human, confident. Original content and interactions preserved.
 * Local fonts; no reference-site assets or copy.
 */
@font-face {
  font-family: "Satoshi";
  src: url("./fonts/satoshi-regular.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Satoshi";
  src: url("./fonts/satoshi-bold.woff2") format("woff2");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Satoshi";
  src: url("./fonts/satoshi-black.woff2") format("woff2");
  font-weight: 900;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Allura";
  src: url("./fonts/allura-regular.ttf") format("truetype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
:root {
  --font-display: "Satoshi", system-ui, sans-serif;
  --font-body: "Satoshi", system-ui, sans-serif;
  --font-script: "Allura", cursive;
  --sans: var(--font-body);
  --serif: var(--font-display);
  --brand: #a658a8;
  --brand-deep: #783d80;
  --brand-ink: #65306e;
  --brand-tint: #f6eff7;
  --navy: #211c29;
  --navy-2: #302039;
  --bg: #fff;
  --surface: #fff;
  --alt: #f8f5f8;
  --text: #242027;
  --muted: #625a66;
  --line: #e6dfe7;
  --wrap: 1240px;
  --r: 3px;
  --text-small: clamp(.8125rem, .79rem + .12vw, .875rem);
  --text-ui: clamp(.875rem, .84rem + .12vw, .9375rem);
  --text-note: var(--text-small);
  --text-body: clamp(1rem, .95rem + .17vw, 1.125rem);
  --text-lede: clamp(1.125rem, 1rem + .3vw, 1.3rem);
  --text-card: clamp(1.4rem, 1.1rem + .6vw, 1.8rem);
  --text-section: clamp(2rem, 1.25rem + 2vw, 3.4rem);
  --text-home: clamp(2.6rem, 1rem + 3.8vw, 4.7rem);
  --text-script: clamp(3.3rem, 1rem + 4.7vw, 5.7rem);
  --space-1: .25rem;
  --space-2: .5rem;
  --space-3: .75rem;
  --space-4: 1rem;
  --space-5: 1.25rem;
  --space-6: 1.5rem;
  --space-8: 2rem;
  --space-10: 2.5rem;
  --space-12: 3rem;
  --space-16: 4rem;
  --space-20: 5rem;
  --space-24: 6rem;
  --section-space: clamp(var(--space-12), 6vw, var(--space-24));
}
body { font: 400 var(--text-body)/1.7 var(--font-body); background: var(--surface); }
h1, h2, h3 { font-family: var(--font-display); font-weight: 900; letter-spacing: -.045em; }
h2 { font-size: var(--text-section); line-height: 1.1; }
h3 { font-size: var(--text-card); line-height: 1.25; letter-spacing: -.025em; }
.wrap { padding-inline: var(--space-8); }
.section, .content { padding-block: var(--section-space); }
.eyebrow { font: 700 var(--text-small)/1.6 var(--font-body); letter-spacing: .16em; }
.btn, .nav-cta { border-radius: var(--r); font: 700 var(--text-ui)/1.35 var(--font-body); min-height: 52px; padding: var(--space-4) var(--space-6); }
.btn-primary { background: var(--brand-deep); border-color: var(--brand-deep); }
.btn-outline { border-color: var(--brand-deep); color: var(--brand-ink); }
.btn:hover { transform: none; }
:focus-visible { outline: 3px solid var(--brand-ink); outline-offset: 5px; }

/* A crisp, quiet navigation lets the opening do the talking. */
.site-header { background: var(--surface); color: var(--text); border-bottom: 1px solid var(--line); box-shadow: none; }
.hdr { min-height: 102px; gap: var(--space-6); }
.brand { flex-shrink: 0; }
.brand img { width: 106px; }
.hdr-call, .hdr-call:hover { color: var(--brand-ink); font-weight: 700; }
.site-nav { background: var(--surface); border-top-color: var(--line); }
.site-nav a, .site-nav a[aria-current="page"] { color: var(--text); border-color: var(--line); }
.nav-group > summary { color: var(--text); border-color: var(--line); font-weight: 700; }
.site-nav .sub a, .site-nav .sub a[aria-current="page"] { color: var(--brand-ink); }
.site-nav .sub a:hover, .nav-group > summary:hover, .nav-group[open] > summary { background: var(--brand-tint); }
.site-nav .nav-cta { color: #fff !important; }
.menu-btn { color: var(--text); border: 1px solid var(--line); border-radius: var(--r); }
.bars, .bars::before, .bars::after { background: var(--brand-ink); }
.site-nav .sub { border: 1px solid var(--line); border-radius: var(--r); box-shadow: 0 16px 32px #211c2912; }

/* Keep both original headline sentences; change only their visual treatment. */
.home-hero { background: var(--surface); padding: var(--space-12) 0 0; overflow: hidden; }
.signature-hero { grid-template-columns: 1.02fr 1fr; gap: var(--space-8); align-items: center; }
.hero-copy { position: relative; z-index: 2; }
.home-hero .hero-copy { padding-bottom: var(--space-12); }
.home-hero .eyebrow { color: var(--brand-ink); font-size: var(--text-small); margin-bottom: var(--space-6); }
.home-hero h1 { max-width: none; font-size: var(--text-home); line-height: 1.02; font-weight: 900; color: #1b171d; margin-bottom: var(--space-6); letter-spacing: -.055em; }
.hero-statement { display: block; max-width: 10ch; }
.hero-script { display: block; font: 400 var(--text-script)/.92 var(--font-script); color: var(--brand-ink); letter-spacing: -.02em; max-width: 14ch; margin-top: var(--space-3); padding-bottom: var(--space-2); }
.home-hero .lede { font-size: var(--text-lede); line-height: 1.65; color: var(--text); max-width: 48ch; }
.hero-areas { font-size: var(--text-ui); font-weight: 700; color: var(--brand-ink); margin-top: var(--space-6); }
.home-hero .btn-row { gap: var(--space-3); margin-top: var(--space-6); }
.home-hero .btn { border-radius: var(--r); font-size: var(--text-ui); padding-inline: var(--space-5); }
.home-hero .btn-primary { background: var(--brand-deep); border-color: var(--brand-deep); }
.home-hero .btn-outline { border-color: var(--brand-ink); color: var(--brand-ink); }
.home-hero .btn-outline:hover { background: var(--brand-tint); color: var(--brand-ink); }
.home-hero .hero-note { font-size: var(--text-small); margin-top: var(--space-5); color: var(--muted); }
.signature-photo { margin: 0; align-self: center; display: flex; align-items: stretch; position: relative; }
.signature-photo img { width: calc(100% + var(--space-16)); max-width: none; height: 520px; min-height: 0; object-fit: cover; object-position: 45% center; border-radius: 0; mask-image: linear-gradient(90deg, transparent, #000 4%, #000 96%, transparent); }
.signature-photo figcaption { left: var(--space-6); bottom: var(--space-8); background: #fff; border: 0; border-left: 3px solid var(--brand-deep); padding: var(--space-4) var(--space-6); border-radius: 0; box-shadow: none; }
.signature-photo figcaption span { font-size: var(--text-small); color: var(--muted); }
.signature-photo figcaption strong { font: 900 var(--text-card)/1.4 var(--font-display); color: var(--text); }

/* Honest, existing capabilities instead of invented proof numbers. */
.home-trust-section { padding: 0; background: var(--brand-ink); }
.home-trust-section .trust { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0; border: 0; padding: 0; margin: 0; }
.home-trust-section .trust span { background: transparent; border: 0; border-right: 1px solid #ffffff35; border-radius: 0; color: #fff; font-size: var(--text-body); font-weight: 700; line-height: 1.45; padding: var(--space-8); display: flex; align-items: center; }
.home-trust-section .trust span:first-child { padding-left: 0; }
.home-trust-section .trust span:last-child { border-right: 0; }
.home-trust-section .trust span::before { display: none; }
.home-trust-section + .section { padding-top: var(--section-space); }

/* Editorial photography, with two compact service rows underneath. */
.sec-head { max-width: 780px; margin: 0 auto var(--space-12); text-align: center; }
.sec-head p { margin-inline: auto; }
.svc-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-6); }
.svc-card a { border: 0; border-radius: 0; background: var(--alt); padding: var(--space-8); box-shadow: none; position: relative; }
.svc-card a:hover { transform: none; box-shadow: none; background: var(--brand-tint); }
.svc-card h3 { font-size: var(--text-card); }
.svc-card.has-photo a { padding-top: calc(260px + var(--space-8)); overflow: hidden; }
.care-editorial-photo { position: absolute; top: 0; left: 0; width: 100%; height: 260px; object-fit: cover; }
.svc-card:nth-child(2) .care-editorial-photo { object-position: center 42%; }
.svc-rate { border-radius: 0; padding: 0; background: transparent; color: var(--brand-ink); font-size: var(--text-small); letter-spacing: .025em; margin-bottom: var(--space-3); }
.svc-card .more { font-size: var(--text-ui); padding-top: var(--space-2); }
.svc-card:not(.has-photo) a { background: var(--surface); border-top: 2px solid var(--brand-deep); padding-inline: 0; }

/* A decisive full-width brand moment, not another row of boxes. */
.client-approach { background: #2c1b33 !important; color: #fff; position: relative; }
.client-approach .approach-layout { gap: var(--space-20); }
.client-approach .eyebrow, .client-approach h2, .client-approach h3 { color: #fff; }
.client-approach .approach-intro h2 { font-size: var(--text-section); max-width: 12ch; }
.client-approach .approach-intro > p:not(.eyebrow), .client-approach .approach-list p { color: #e3dce6; }
.client-approach a, .client-approach .approach-number { color: #e9b6ea; }
.client-approach .approach-list li { border-color: #ffffff25; gap: var(--space-5); padding-block: var(--space-6); }
.client-approach .approach-list h3 { font-size: var(--text-lede); letter-spacing: -.01em; font-weight: 700; }
.client-approach .approach-list p { font-size: var(--text-body); }
.client-approach .approach-values { margin-top: var(--space-8); }

/* Calculator keeps its familiar structure, rate states and detailed estimate. */
.care-calculator { background: var(--alt); padding-block: var(--section-space); --care-accent: var(--brand-ink); --care-bright: var(--brand-deep); --care-soft: var(--brand-tint); }
.care-calculator-heading { margin-bottom: var(--space-10); }
.care-calculator-heading h2 { font: 900 var(--text-section)/1.1 var(--font-display); color: var(--text); letter-spacing: -.04em; }
.care-calculator-card { border: 1px solid var(--line); border-radius: var(--r); box-shadow: 0 12px 48px #211c2908; }
.care-choice, .care-estimate, .care-payment-box, .care-interest-box, .care-quote-panel, .care-interest-button, .care-quote-toggle, .care-call-button { border-radius: var(--r); }
.care-estimate { background: var(--brand-tint); }
.care-quote-toggle { background: var(--brand-deep); }
.care-range input::-webkit-slider-thumb { background: var(--brand-deep); box-shadow: 0 0 0 1px var(--brand-deep); }
.care-range input::-moz-range-thumb { background: var(--brand-deep); }

.steps { gap: var(--space-6); }
.steps li { padding: var(--space-8) 0 0; border: 0; border-top: 1px solid var(--line); border-radius: 0; }
.steps li::before { position: static; margin-bottom: var(--space-5); width: auto; height: auto; display: block; color: var(--brand-deep); background: transparent; border-radius: 0; font: 900 var(--text-section)/1 var(--font-display); }
.steps h3 { font-size: var(--text-lede); }
.coverage-heading { max-width: 780px; margin-bottom: var(--space-10); }
.coverage-grid { gap: 0 var(--space-8); }
.coverage-grid a { min-height: 76px; border-radius: 0; border-bottom: 1px solid var(--line); background: var(--surface); padding-inline: 0; }
.coverage-grid a:hover { background: var(--brand-tint); }
.zip-panel { background: var(--brand-ink); border-radius: 0; margin-top: var(--space-8); padding: var(--space-12); }
.zip-panel h3 { font-size: var(--text-card); }
.zip-inquiry input, .zip-inquiry .btn { border-radius: var(--r); }
.family-resources { background: var(--alt); text-align: center; }
.family-resources h2 { margin-inline: auto; max-width: 22ch; }
.family-resources p:not(.eyebrow) { margin-inline: auto; }
.family-resources .btn-row { justify-content: center; gap: var(--space-8); }
.cta { background: var(--brand-ink); border-radius: 0; }
.cta h2 { color: #fff; }
.site-footer { background: #211a27; }
.foot-name { font-family: var(--font-display); font-weight: 900; font-size: var(--text-card); }
.foot-h { font: 700 var(--text-ui)/1.4 var(--font-body); letter-spacing: .06em; text-transform: uppercase; }
.foot-legal { font-size: var(--text-small); }
.mobile-call { background: var(--brand-ink); }

/* Carry the same design language through all existing inner pages. */
.page-hero:not(.home-hero) { background: var(--alt); padding-block: var(--space-16); color: var(--text); border-bottom: 1px solid var(--line); }
.page-hero:not(.home-hero)::after { display: none; }
.page-hero:not(.home-hero) h1 { color: var(--text); font-size: var(--text-section); max-width: 25ch; letter-spacing: -.045em; }
.page-hero:not(.home-hero) .lede { color: var(--muted); font-size: var(--text-lede); }
.crumbs ol, .crumbs a { color: var(--brand-ink); font-size: var(--text-small); }
.prose h2 { font-size: var(--text-card); letter-spacing: -.025em; }
.prose h3 { font-size: var(--text-lede); font-weight: 700; }
.side-card { background: var(--alt); border: 0; border-top: 3px solid var(--brand-deep); border-radius: 0; padding: var(--space-8); }
.side-h { font: 900 var(--text-lede)/1.3 var(--font-display); }
.form, .table-wrap, .area-card a, .pay-card, .why, .note-box, .faq, .resource-card { border-radius: var(--r); box-shadow: none; }
.form { padding: var(--space-8); }
.form-h { font: 900 var(--text-card)/1.3 var(--font-display); }
.resource-card { padding: var(--space-8); background: var(--surface); }
.resource-card h3 { font: 700 var(--text-lede)/1.4 var(--font-display); }
.family-guide-photo img { border-radius: 0; }
.faq summary h2 { font-family: var(--font-body); font-size: var(--text-body); font-weight: 700; letter-spacing: 0; }
.faq[open] { border-color: var(--brand); }
.faq summary { min-height: 64px; }

@media (min-width: 1280px) {
  .site-nav { gap: var(--space-3); }
  .site-nav > ul > li > a, .nav-group > summary { font-size: var(--text-small); padding-inline: var(--space-2); }
  .nav-group .sub { min-width: 288px; }
  .hdr-call { font-size: var(--text-small); }
}
@media (max-width: 1279px) {
  .site-nav { background: var(--surface); max-height: calc(100dvh - 180px); }
  .site-nav .sub { border: 0; box-shadow: none; }
  .site-nav .sub a { color: var(--brand-ink); }
  .site-nav .sub a:hover { background: var(--brand-tint); }
  .signature-photo img { min-height: 0; }
}
@media (min-width: 701px) and (max-width: 999px) {
  .signature-hero { grid-template-columns: 1.1fr .9fr; gap: var(--space-4); }
  .home-hero h1 { font-size: clamp(2.5rem, 5vw, 3.5rem); }
  .hero-script { font-size: clamp(3.2rem, 6vw, 4.5rem); }
  .home-hero .btn-row { flex-direction: column; align-items: flex-start; }
  .signature-photo img { width: calc(100% + var(--space-12)); height: 420px; min-height: 0; object-position: 42% center; }
  .home-trust-section .trust { grid-template-columns: repeat(2, 1fr); }
  .home-trust-section .trust span { padding: var(--space-6); border-bottom: 1px solid #ffffff35; }
  .home-trust-section .trust span:first-child { padding-left: var(--space-6); }
}
@media (max-width: 700px) {
  .wrap { padding-inline: var(--space-5); }
  .hdr { min-height: 84px; gap: var(--space-3); }
  .brand img { width: 82px; }
  .home-hero { padding-top: var(--space-8); }
  .signature-hero { grid-template-columns: 1fr; gap: 0; }
  .home-hero .hero-copy { padding-bottom: var(--space-8); }
  .home-hero .eyebrow { margin-bottom: var(--space-5); }
  .home-hero h1 { font-size: var(--text-home); line-height: 1.02; max-width: none; }
  .hero-statement { max-width: 11ch; }
  .hero-script { font-size: var(--text-script); max-width: 15ch; line-height: .96; margin-top: var(--space-3); }
  .home-hero .lede { font-size: var(--text-body); line-height: 1.7; }
  .hero-areas { margin-top: var(--space-5); font-size: var(--text-small); }
  .home-hero .btn-row { gap: var(--space-3); }
  .home-hero .btn { width: 100%; }
  .signature-photo { margin: 0 calc(-1 * var(--space-5)); }
  .signature-photo img { min-height: 0; height: 270px; width: 100%; object-position: 45% center; mask-image: linear-gradient(180deg, transparent, #000 8%, #000); }
  .signature-photo figcaption { bottom: var(--space-5); left: var(--space-5); padding: var(--space-3) var(--space-5); }
  .signature-photo figcaption strong { font-size: var(--text-lede); }
  .home-trust-section .trust { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .home-trust-section .trust span { padding: var(--space-5) var(--space-4); font-size: var(--text-small); border-bottom: 1px solid #ffffff35; }
  .home-trust-section .trust span:first-child { padding-left: var(--space-4); }
  .home-trust-section .trust span:nth-child(2) { border-right: 0; }
  .home-trust-section .trust span:nth-child(n+3) { border-bottom: 0; }
  .sec-head { text-align: left; margin-bottom: var(--space-8); }
  .svc-grid { grid-template-columns: 1fr; gap: var(--space-5); }
  .svc-card a { padding: var(--space-6); }
  .svc-card.has-photo a { padding-top: calc(210px + var(--space-6)); }
  .care-editorial-photo { height: 210px; }
  .client-approach .approach-layout { gap: var(--space-10); }
  .client-approach .approach-intro h2 { max-width: 13ch; }
  .care-calculator-card { padding: var(--space-5); }
  .care-calculator-heading { text-align: left; margin-bottom: var(--space-8); }
  .care-calculator-heading p { font-size: var(--text-body); }
  .steps { gap: var(--space-8); }
  .steps li { padding-top: var(--space-5); }
  .coverage-heading { text-align: left; }
  .coverage-grid { gap: 0; }
  .coverage-grid a { padding-inline: 0; }
  .zip-panel { padding: var(--space-8) var(--space-5); }
  .family-resources { text-align: left; }
  .family-resources .btn-row { justify-content: flex-start; gap: var(--space-4); }
  .page-hero:not(.home-hero) { padding-block: var(--space-10); }
  .side-card, .form { padding: var(--space-6); }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition: none !important; }
}
