/* INFINITI's local, family-centered visual identity. Preserve inner-page layout. */
@media (min-width: 1000px) {
  .site-nav { gap: .6rem; }
  .site-nav > ul > li > a { white-space: nowrap; font-size: .8125rem; padding-inline: .48rem; }
  .site-nav .nav-cta { white-space: nowrap; font-size: .8125rem; padding-inline: 1rem !important; }
  .hdr-call { font-size: .8125rem; }
}
.home-hero {
  background: #f4edf5;
  color: var(--navy);
  padding: 3.8rem 0 4.2rem;
  overflow: visible;
}
.home-hero::after, .home-hero::before { display: none; }
.signature-hero { display: grid; grid-template-columns: 1fr 1fr; gap: 3.2rem; align-items: center; }
.home-hero .eyebrow { font-size: .75rem; line-height: 1.6; letter-spacing: .13em; color: #793f7d; margin: 0 0 1.35rem; }
.home-hero h1 {
  font-size: clamp(2.75rem, 4.7vw, 4.7rem);
  line-height: 1.03;
  letter-spacing: -.045em;
  color: #242038;
  max-width: 11ch;
  font-weight: 500;
  margin-bottom: 1.4rem;
}
.home-hero .lede { font-size: clamp(1rem, .95rem + .2vw, 1.1rem); color: #53505e; line-height: 1.8; max-width: 46ch; }
.home-hero .btn-row { gap: .8rem; margin-top: 1.7rem; }
.home-hero .btn { font-size: .875rem; padding-inline: 1.2rem; border-radius: 7px; }
.home-hero .btn-primary { background: #873d8b; border-color: #873d8b; color: #fff; }
.home-hero .btn-primary:hover { background: #69306c; }
.home-hero .btn-outline { color: #6e2f70; border-color: #ad87af; }
.home-hero .btn-outline:hover { background: #e9d9eb; }
.home-hero .hero-note { font-size: .8125rem; margin-top: 1.2rem; color: #645b6d; line-height: 1.7; }
.home-hero .hero-note a { color: #6e2f70; white-space: nowrap; }
.signature-photo { position: relative; margin: 0; }
.signature-photo img { width: 100%; height: 510px; object-fit: cover; object-position: 57% center; border-radius: 130px 16px 16px 16px; }
.signature-photo figcaption { position: absolute; bottom: -22px; left: -24px; padding: 1.35rem 1.8rem; background: #fffdf8; box-shadow: 0 10px 24px #24203816; border-left: 4px solid #b15bb2; border-radius: 5px; }
.signature-photo figcaption span { display: block; font-size: .8125rem; letter-spacing: .03em; color: #62566a; }
.signature-photo figcaption strong { font: 500 clamp(1.3rem, 1rem + .5vw, 1.65rem)/1.5 var(--serif); color: #3a294a; }
.home-trust-section { padding: 1.5rem 0 0; background: #fbf8f5; }
.home-trust-section .trust { margin-bottom: 0; background: none; border: 0; border-bottom: 1px solid #e3d9e3; border-radius: 0; padding: .75rem 0 1.8rem; }
.home-trust-section .trust span { font-size: .8125rem; color: #63556b; }
.home-trust-section + .section { padding-top: 4rem; }
.family-resources { background: #f7f1f7; }
.family-resources h2 { max-width: 25ch; }
.family-resources p:not(.eyebrow) { max-width: 60ch; color: var(--muted); }
.resource-intro { max-width: 70ch; color: var(--muted); margin-bottom: 2.5rem; }
.resource-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.4rem; margin: 0; padding: 0; list-style: none; }
.resource-card { border: 1px solid #e0d3e3; border-radius: 14px; padding: 1.7rem; display: flex; flex-direction: column; align-items: flex-start; background: #fdfafd; }
.resource-card h3 { font: 500 1.4rem/1.35 var(--serif); margin-bottom: 1rem; }
.resource-card h3 a { text-decoration: none; }
.resource-card h3 a:hover { text-decoration: underline; }
.resource-card .eyebrow { color: #82418b; font-size: .6875rem; margin-bottom: 1rem; }
.resource-review, .resource-origin { font-size: .8125rem; color: var(--muted); }
.resource-card .more { margin-top: auto; padding-top: 1.3rem; }
@media (max-width: 950px) { .resource-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 950px) {
  .signature-hero { gap: 2rem; }
  .signature-photo img { height: 465px; border-top-left-radius: 90px; }
  .home-hero .btn-row { align-items: stretch; }
}
@media (max-width: 700px) {
  .home-hero { padding: 2.6rem 0 2.8rem; }
  .signature-hero { grid-template-columns: 1fr; gap: 2rem; }
  .home-hero h1 { max-width: 13ch; font-size: clamp(2.9rem, 11vw, 4rem); }
  .home-hero .eyebrow { margin-bottom: 1rem; font-size: .75rem; }
  .home-hero .lede { line-height: 1.75; }
  .home-hero .btn-row { flex-direction: column; }
  .home-hero .btn { width: 100%; }
  .signature-photo { margin: 0 0 .6rem .6rem; }
  .signature-photo img { height: 315px; border-top-left-radius: 90px; }
  .signature-photo figcaption { left: -.6rem; bottom: -15px; padding: 1rem 1.3rem; }
  .home-trust-section .trust { justify-content: flex-start; gap: .65rem 1.2rem; }
  .resource-grid { grid-template-columns: 1fr; }
}

/* Client-centered navigation: native disclosures work with keyboard and touch. */
:root {
  --text-ui: .875rem;
  --text-note: .8125rem;
  --text-section: clamp(1.7rem, 3vw, 2.3rem);
  --text-home: clamp(2.6rem, 4.3vw, 4rem);
  --space-sm: .5rem;
  --space-md: 1rem;
  --space-lg: 1.5rem;
  --space-xl: 2.5rem;
  --space-section: 4rem;
}
.nav-group { position: relative; }
.nav-group > summary {
  display: flex; align-items: center; justify-content: space-between;
  gap: var(--space-sm); min-height: 48px; cursor: pointer;
  color: var(--surface); font-size: var(--text-ui); font-weight: 500;
  list-style: none; padding: var(--space-md) 0;
  border-bottom: 1px solid #ffffff18; white-space: nowrap;
}
.nav-group > summary::-webkit-details-marker { display: none; }
.nav-group > summary::marker { content: ""; }
.nav-group[open] > summary svg { transform: rotate(180deg); }
.nav-group:not([open]) > .sub { display: none; }
.nav-group[open] > .sub { display: block; }
.site-nav .sub a { min-height: 44px; display: flex; align-items: center; font-size: var(--text-ui); }
.site-nav .nav-cta { display: inline-flex; align-items: center; justify-content: center; line-height: 1.2; background: var(--brand-deep) !important; }
.site-nav a[aria-current="page"], .nav-group > .is-current { text-decoration: underline; text-underline-offset: 6px; }
.home-hero h1 { font-size: var(--text-home); max-width: 16ch; line-height: 1.08; }
.hero-areas { font-size: var(--text-ui); color: var(--brand-ink); line-height: 1.65; margin-top: var(--space-md); }
.home-hero .hero-note { margin-bottom: 0; }
.approach-layout { display: grid; gap: var(--space-xl); }
.approach-intro h2 { font-size: var(--text-section); max-width: 17ch; }
.approach-intro > p:not(.eyebrow) { color: var(--muted); max-width: 49ch; }
.text-link { font-weight: 600; display: inline-flex; align-items: center; gap: var(--space-sm); min-height: 44px; }
.approach-values { font-size: var(--text-ui); margin-top: var(--space-lg); }
.approach-list { list-style: none; margin: 0; padding: 0; }
.approach-list li { display: grid; grid-template-columns: 2rem 1fr; gap: var(--space-md); padding: var(--space-lg) 0; border-top: 1px solid var(--line); }
.approach-list li:first-child { padding-top: 0; border-top: 0; }
.approach-number { color: var(--brand-ink); font-size: var(--text-note); padding-top: .2rem; font-weight: 600; }
.approach-list h3 { font-size: 1.3rem; }
.approach-list p { color: var(--muted); font-size: 1rem; margin-bottom: 0; }
.family-guide-photo { margin: var(--space-xl) 0 0; }
.family-guide-photo img { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; border-radius: var(--r); }
.family-link-list { display: grid; gap: 0; }
.family-link-list > a { display: flex; align-items: center; justify-content: space-between; gap: var(--space-md); padding: var(--space-lg) 0; border-bottom: 1px solid var(--line); text-decoration: none; }
.family-link-list > a:hover strong { text-decoration: underline; }
.family-link-list small { display: block; color: var(--muted); font-size: var(--text-ui); margin-top: var(--space-sm); }
#getting-started { scroll-margin-top: 7rem; }
.metro-coverage { background: var(--surface); }
.coverage-heading { max-width: 65ch; margin: 0 auto var(--space-xl); text-align: center; }
.coverage-heading h2 { font-size: var(--text-section); }
.coverage-heading p { color: var(--muted); }
.coverage-heading .eyebrow { color: var(--brand-ink); }
.coverage-grid { list-style: none; padding: 0; margin: 0 0 var(--space-xl); display: grid; gap: var(--space-md); }
.coverage-grid a { display: flex; align-items: center; gap: var(--space-md); min-height: 68px; background: var(--brand-tint); color: var(--navy); border-radius: 8px; padding: var(--space-md) var(--space-lg); text-decoration: none; }
.coverage-grid a:hover { background: #ead9ed; }
.coverage-grid svg { flex-shrink: 0; color: var(--brand-deep); }
.coverage-grid a > span:not(.area-card-arrow) { font-weight: 500; }
.area-card-arrow { margin-left: auto; color: var(--brand-ink); }
.zip-panel { background: var(--brand-deep); color: var(--surface); padding: var(--space-xl); border-radius: var(--r); text-align: center; }
.zip-panel h3 { color: var(--surface); font-size: var(--text-section); }
.zip-panel p { margin-inline: auto; }
.zip-inquiry { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: center; gap: var(--space-md); margin: var(--space-lg) 0; }
.zip-inquiry > div { text-align: left; flex: 0 1 260px; }
.zip-inquiry label { display: block; font-size: var(--text-ui); margin-bottom: var(--space-sm); }
.zip-inquiry input { width: 100%; min-height: 52px; border: 2px solid #dac8df; border-radius: 8px; padding: .8rem var(--space-md); font: inherit; color: var(--navy); background: var(--surface); }
.zip-inquiry .btn { min-height: 52px; border-radius: 8px; }
.zip-panel .zip-help { font-size: var(--text-note); margin-bottom: 0; max-width: 68ch; }
.zip-help a { color: var(--surface); white-space: nowrap; }
.area-inquiry-note { background: var(--brand-tint); padding: var(--space-md); border-radius: 8px; }
@media (min-width: 640px) {
  .coverage-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 900px) {
  .approach-layout { grid-template-columns: 1fr 1.15fr; gap: var(--space-section); }
  .coverage-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (min-width: 1000px) and (max-width: 1279px) {
  body { padding-bottom: 64px; }
  .mobile-call { display: flex; }
  .menu-btn { display: inline-flex; }
  .hdr-call { order: 0; margin-left: auto; }
  .hdr-call span { display: inline; }
  .site-nav { display: none !important; position: absolute; left: 0; right: 0; top: 100%; background: var(--navy); padding: var(--space-sm) 1.25rem var(--space-lg); margin: 0; max-height: calc(100dvh - 156px); overflow: auto; }
  .site-nav.open { display: block !important; }
  .site-nav > ul { display: block; }
  .site-nav .sub { position: static; background: none; box-shadow: none; min-width: 0; }
  .site-nav .sub a { color: #e4e1f0; }
  .site-nav .nav-cta { width: 100%; margin-top: var(--space-md); }
}
@media (max-width: 1279px) {
  .site-nav { max-height: calc(100dvh - 156px); overscroll-behavior: contain; }
  .site-nav .sub { padding: 0 0 var(--space-sm) var(--space-md) !important; }
  .site-nav .sub a { color: #e4e1f0; padding: .65rem var(--space-sm); }
  .site-nav .sub a:hover { background: #ffffff0d; }
}
@media (min-width: 1280px) {
  .site-nav { gap: var(--space-sm); }
  .site-nav > ul { gap: 0; align-items: center; }
  .site-nav > ul > li > a { display: flex; align-items: center; min-height: 48px; }
  .site-nav > ul > li > a, .nav-group > summary { padding: .65rem .55rem; font-size: var(--text-note); border: 0; border-radius: 8px; }
  .nav-group > summary:hover, .nav-group[open] > summary { background: #ffffff12; }
  .nav-group .sub { min-width: 288px; padding: var(--space-sm) !important; top: calc(100% + 4px); }
  .site-nav .sub a { font-size: var(--text-ui); color: var(--navy); padding: .65rem var(--space-md); }
  .nav-entry:last-child .sub { left: auto; right: 0; }
  .site-nav .nav-cta { background: var(--brand-deep) !important; font-size: var(--text-note); padding-inline: var(--space-md) !important; }
  .hdr-call { font-size: var(--text-note); }
}
@media (min-width: 1280px) and (max-width: 1399px) {
  .hdr-call span { display: none; }
}
@media (max-width: 700px) {
  .home-hero h1 { font-size: var(--text-home); max-width: 16ch; }
  .zip-panel { padding: var(--space-lg); }
  .zip-inquiry { display: grid; }
  .zip-inquiry > div { width: 100%; }
  .coverage-grid a { padding-inline: var(--space-md); }
}
