/* =========================================================================
   ICO VISUAL REFRESH (founder brief, 2026-10-05; docs/design-system.md)
   Quiet, warm and human. Navy ink, one muted text colour, one line colour,
   one green accent. Inter for text and headings at normal letter-spacing,
   radii 6 (controls) and 10 (buttons, cards, panels), a 4px spacing grid.
   Few borders and no decorative labels: see "Design rules" in README.md.

   SCOPE: every rule below starts with html:not(.ico-embed-avrei), so the
   American Valor REI embed (public/css/embed-av-rei.css) renders exactly as
   before. Visual only: no field, step, copy or behaviour changes here.
   ========================================================================= */

/* Inter under its own family name, so the AV REI embed (whose fallback stack
   names "Inter") never picks it up. A face only downloads when used. */
@font-face {
  font-family: 'ICO Inter';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url(/fonts/inter-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'ICO Inter';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url(/fonts/inter-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* ---- Tokens ------------------------------------------------------------- */
html:not(.ico-embed-avrei) {
  --ico-page: #f7f5f1;
  --ico-surface: #ffffff;
  --ico-sunken: #f1eee8;
  --ico-ink: #142235;
  --ico-muted: #4a5662;
  /* One muted text colour and one line colour (2026-11-04): the old
     "subtle" grey and the lighter hairline now resolve to the same values. */
  --ico-subtle: var(--ico-muted);
  --ico-line: #d9d3c9;
  --ico-line-strong: var(--ico-line);
  --ico-accent: #176b52;
  --ico-accent-hover: #0f513f;
  --ico-accent-soft: #eef5f1;
  --ico-danger: #a33a3a;
  --ico-r-sm: 6px;
  --ico-r-md: 10px;
  --ico-r-lg: 10px;
  --ico-font: 'ICO Inter', Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;

  /* Re-point the legacy layer's tokens at the refresh palette. */
  --font-body: var(--ico-font);
  --font-display: var(--ico-font);
  --trust-navy: var(--ico-ink);
  --trust-green: var(--ico-accent);
  --trust-green-dark: var(--ico-accent-hover);
  --trust-warm: var(--ico-page);
  --trust-white: var(--ico-surface);
  --trust-panel: var(--ico-sunken);
  --trust-sage: var(--ico-sunken);
  --trust-muted: var(--ico-muted);
  --trust-border: var(--ico-line);
  --trust-radius-sm: var(--ico-r-sm);
  --trust-radius-md: var(--ico-r-md);
  --trust-radius-lg: var(--ico-r-lg);
  --trust-shadow: none;
  --ink: var(--ico-ink);
  --ink-dim: var(--ico-muted);
  --line: var(--ico-line);
  --accent: var(--ico-accent);
  --glow: transparent;
  scroll-padding-top: 80px;
}

html:not(.ico-embed-avrei),
html:not(.ico-embed-avrei) body {
  background: var(--ico-page) !important;
  color: var(--ico-ink) !important;
  font-family: var(--ico-font) !important;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

html:not(.ico-embed-avrei) body { line-height: 1.6; }

html:not(.ico-embed-avrei) ::selection { background: #d5e6dc; color: var(--ico-ink); }

/* One focus treatment everywhere: a 2px accent outline. */
html:not(.ico-embed-avrei) a:focus-visible,
html:not(.ico-embed-avrei) button:focus-visible,
html:not(.ico-embed-avrei) select:focus-visible,
html:not(.ico-embed-avrei) textarea:focus-visible,
html:not(.ico-embed-avrei) input[type="checkbox"]:focus-visible,
html:not(.ico-embed-avrei) input[type="radio"]:focus-visible,
html:not(.ico-embed-avrei) [tabindex]:not([tabindex="-1"]):focus-visible {
  outline: 2px solid var(--ico-accent) !important;
  outline-offset: 2px !important;
}
/* Step headings take focus programmatically (for screen readers); they are not
   controls, so no ring. */
html:not(.ico-embed-avrei) [tabindex="-1"]:focus,
html:not(.ico-embed-avrei) [tabindex="-1"]:focus-visible { outline: none !important; }

html:not(.ico-embed-avrei) .skip-link {
  background: var(--ico-ink) !important;
  border-radius: 0 0 var(--ico-r-md) var(--ico-r-md) !important;
}

html:not(.ico-embed-avrei) .container {
  width: min(100% - 48px, 1120px) !important;
  padding-inline: 0 !important;
}
html:not(.ico-embed-avrei) .hero-v3-inner { padding-left: 0 !important; }

/* ---- Type --------------------------------------------------------------- */
html:not(.ico-embed-avrei) h1,
html:not(.ico-embed-avrei) h2,
html:not(.ico-embed-avrei) h3,
html:not(.ico-embed-avrei) h4 { font-family: var(--ico-font) !important; }

html:not(.ico-embed-avrei) .section-kicker,
html:not(.ico-embed-avrei) .hero-v3-eyebrow {
  margin: 0 0 12px !important;
  color: var(--ico-accent) !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  letter-spacing: 0 !important;
  line-height: 1.4 !important;
  text-transform: none !important;
}
html:not(.ico-embed-avrei) .section-kicker::before,
html:not(.ico-embed-avrei) .hero-v3-eyebrow::before { display: none !important; }

html:not(.ico-embed-avrei) .v2-heading,
html:not(.ico-embed-avrei) .form-section .v2-heading,
html:not(.ico-embed-avrei) .faq .v2-heading,
html:not(.ico-embed-avrei) .areas-v2 .v2-heading,
html:not(.ico-embed-avrei) .process-v2 .v2-heading {
  color: var(--ico-ink) !important;
  font-family: var(--ico-font) !important;
  font-size: clamp(30px, 3.2vw, 40px) !important;
  font-weight: 600 !important;
  letter-spacing: 0 !important;
  line-height: 1.15 !important;
}

html:not(.ico-embed-avrei) .v2-sub,
html:not(.ico-embed-avrei) .form-section .v2-sub,
html:not(.ico-embed-avrei) .faq .v2-sub,
html:not(.ico-embed-avrei) .areas-v2 .v2-sub {
  margin-top: 12px !important;
  color: var(--ico-muted) !important;
  font-size: 17px !important;
  line-height: 1.6 !important;
}

/* ---- Header ------------------------------------------------------------- */
html:not(.ico-embed-avrei) .header,
html:not(.ico-embed-avrei) .header.header--v2,
html:not(.ico-embed-avrei) .header.header--v2.scrolled {
  background: var(--ico-page) !important;
  border-bottom: 1px solid var(--ico-line) !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}
html:not(.ico-embed-avrei) .header-inner { min-height: 68px !important; padding-block: 12px !important; }

html:not(.ico-embed-avrei) .header .logo-mark,
html:not(.ico-embed-avrei) .logo-mark {
  width: 36px !important;
  height: 36px !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  filter: none !important;
}
html:not(.ico-embed-avrei) .logo { gap: 12px !important; }
html:not(.ico-embed-avrei) .header .logo-name,
html:not(.ico-embed-avrei) .logo-name,
html:not(.ico-embed-avrei) .footer-v2-wordmark {
  font-family: var(--ico-font) !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  letter-spacing: 0 !important;
}
html:not(.ico-embed-avrei) .header .logo-tagline,
html:not(.ico-embed-avrei) .header--v2 .logo-tagline,
html:not(.ico-embed-avrei) .logo-tagline,
html:not(.ico-embed-avrei) .footer-v2-brand .logo-tagline {
  font-size: 12px !important;
  font-weight: 400 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}

html:not(.ico-embed-avrei) .nav.nav--v2,
html:not(.ico-embed-avrei) .nav { gap: 28px !important; }
html:not(.ico-embed-avrei) .nav.nav--v2 a,
html:not(.ico-embed-avrei) .nav a {
  color: var(--ico-muted) !important;
  font-size: 15px !important;
  font-weight: 500 !important;
  letter-spacing: 0 !important;
}
html:not(.ico-embed-avrei) .nav.nav--v2 a:hover,
html:not(.ico-embed-avrei) .nav a:hover { color: var(--ico-ink) !important; }
html:not(.ico-embed-avrei) .nav.nav--v2 a::after,
html:not(.ico-embed-avrei) .nav a::after { display: none !important; }

/* Primary buttons: one accent, flat, 10px radius. (The legal pages' header
   has a plain .nav, hence the second selector.) */
html:not(.ico-embed-avrei) .nav.nav--v2 a.btn-nav,
html:not(.ico-embed-avrei) .nav a.btn-nav,
html:not(.ico-embed-avrei) .mobile-nav a.btn-nav,
html:not(.ico-embed-avrei) .btn-v3-primary,
html:not(.ico-embed-avrei) .btn-primary,
html:not(.ico-embed-avrei) .form-wrapper .btn-primary,
html:not(.ico-embed-avrei) .form-wrapper .btn-step,
html:not(.ico-embed-avrei) .mobile-sticky-cta .msc-btn {
  background: var(--ico-accent) !important;
  background-image: none !important;
  border: 1px solid var(--ico-accent) !important;
  border-radius: var(--ico-r-md) !important;
  color: #ffffff !important;
  box-shadow: none !important;
  font-family: var(--ico-font) !important;
  font-weight: 600 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  transform: none !important;
  transition: background-color 0.15s ease, border-color 0.15s ease !important;
}
html:not(.ico-embed-avrei) .nav.nav--v2 a.btn-nav:hover,
html:not(.ico-embed-avrei) .nav a.btn-nav:hover,
html:not(.ico-embed-avrei) .mobile-nav a.btn-nav:hover,
html:not(.ico-embed-avrei) .btn-v3-primary:hover,
html:not(.ico-embed-avrei) .btn-primary:hover,
html:not(.ico-embed-avrei) .form-wrapper .btn-primary:hover,
html:not(.ico-embed-avrei) .form-wrapper .btn-step:hover,
html:not(.ico-embed-avrei) .mobile-sticky-cta .msc-btn:hover {
  background: var(--ico-accent-hover) !important;
  border-color: var(--ico-accent-hover) !important;
  color: #ffffff !important;
  transform: none !important;
  box-shadow: none !important;
}
html:not(.ico-embed-avrei) .nav.nav--v2 a.btn-nav,
html:not(.ico-embed-avrei) .nav a.btn-nav {
  display: inline-flex !important;
  align-items: center !important;
  min-height: 40px !important;
  padding: 0 16px !important;
  font-size: 14px !important;
}

html:not(.ico-embed-avrei) .mobile-menu-btn {
  width: 44px !important;
  height: 44px !important;
  background: var(--ico-surface) !important;
  border: 1px solid var(--ico-line) !important;
  border-radius: var(--ico-r-md) !important;
  box-shadow: none !important;
  color: var(--ico-ink) !important;
}
html:not(.ico-embed-avrei) .mobile-nav {
  background: var(--ico-surface) !important;
  border-top: 1px solid var(--ico-line) !important;
  box-shadow: 0 8px 24px rgba(20, 34, 53, 0.08) !important;
}
html:not(.ico-embed-avrei) .mobile-nav a {
  min-height: 48px;
  color: var(--ico-ink) !important;
  font-size: 16px !important;
  font-weight: 500 !important;
  border-bottom-color: var(--ico-line) !important;
}
html:not(.ico-embed-avrei) .mobile-nav a.btn-nav {
  justify-content: center !important;
  margin-top: 12px;
}

/* ---- Hero --------------------------------------------------------------- */
html:not(.ico-embed-avrei) .hero-v3 {
  padding: clamp(64px, 9vw, 112px) 0 clamp(56px, 7vw, 88px) !important;
  background: var(--ico-page) !important;
  border-bottom: 0 !important;
}
html:not(.ico-embed-avrei) .hero-v3::before,
html:not(.ico-embed-avrei) .hero-v3::after,
html:not(.ico-embed-avrei) .hero-v3-mesh { display: none !important; }

html:not(.ico-embed-avrei) .hero-v3-inner {
  padding-right: 0 !important;
  max-width: 1120px !important;
}
html:not(.ico-embed-avrei) .hero-v3-title {
  max-width: 14em !important;
  margin: 0 0 20px !important;
  color: var(--ico-ink) !important;
  font-family: var(--ico-font) !important;
  font-size: clamp(40px, 5.4vw, 68px) !important;
  font-weight: 600 !important;
  letter-spacing: 0 !important;
  line-height: 1.04 !important;
}
html:not(.ico-embed-avrei) .hero-v3-title .h3-light,
html:not(.ico-embed-avrei) .hero-v3-title .h3-heavy {
  color: var(--ico-ink) !important;
  background: none !important;
  -webkit-text-fill-color: currentColor !important;
  font-weight: inherit !important;
  font-style: normal !important;
}
html:not(.ico-embed-avrei) .hero-v3-title .h3-heavy { color: var(--ico-accent) !important; }
html:not(.ico-embed-avrei) .hero-v3-sub {
  max-width: 36em !important;
  margin: 0 0 32px !important;
  color: var(--ico-muted) !important;
  font-size: clamp(17px, 1.4vw, 19px) !important;
  line-height: 1.6 !important;
}
html:not(.ico-embed-avrei) .hero-v3-cta { margin: 0 0 32px !important; }
html:not(.ico-embed-avrei) .btn-v3-primary {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  min-height: 52px !important;
  padding: 0 24px !important;
  font-size: 16px !important;
}
html:not(.ico-embed-avrei) .btn-v3-primary .btn-v3-arrow {
  font-family: var(--ico-font) !important;
  transform: none !important;
}

html:not(.ico-embed-avrei) .hero-v3-stats {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 8px 24px !important;
  margin: 0 !important;
  padding: 0 !important;
  color: var(--ico-muted) !important;
  font-size: 14px !important;
  letter-spacing: 0 !important;
}
html:not(.ico-embed-avrei) .hero-v3-stats li {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  padding: 0 !important;
  background: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}
html:not(.ico-embed-avrei) .hero-v3-stats li::before {
  content: "" !important;
  display: inline-block !important;
  width: 6px !important;
  height: 6px !important;
  margin-right: 6px !important;
  border-radius: 999px !important;
  background: var(--ico-accent) !important;
}
html:not(.ico-embed-avrei) .hero-v3-stats .num {
  color: var(--ico-ink) !important;
  font-family: var(--ico-font) !important;
  font-size: inherit !important;
  font-weight: 600 !important;
  letter-spacing: 0 !important;
}

/* ---- Process ------------------------------------------------------------ */
html:not(.ico-embed-avrei) .process-v2 {
  padding: clamp(64px, 8vw, 104px) 0 !important;
  background: var(--ico-surface) !important;
  border-top: 1px solid var(--ico-line) !important;
  border-bottom: 1px solid var(--ico-line) !important;
}
html:not(.ico-embed-avrei) .process-v2 .process-steps { max-width: none !important; }
html:not(.ico-embed-avrei) .process-v2 .v2-steps {
  margin: 32px 0 0 !important;
  border-top: 1px solid var(--ico-line) !important;
}
html:not(.ico-embed-avrei) .process-v2 .v2-steps > li {
  grid-template-columns: 48px 1fr !important;
  align-items: start !important;
  gap: 16px !important;
  padding: 24px 0 !important;
  border-bottom: 1px solid var(--ico-line) !important;
}
html:not(.ico-embed-avrei) .process-v2 .v2-step-num {
  padding-top: 2px;
  color: var(--ico-subtle) !important;
  font-family: var(--ico-font) !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  letter-spacing: 0 !important;
  font-variant-numeric: tabular-nums;
}
html:not(.ico-embed-avrei) .process-v2 .v2-steps h3 {
  margin: 0 0 4px !important;
  color: var(--ico-ink) !important;
  font-size: 17px !important;
  font-weight: 600 !important;
  letter-spacing: 0 !important;
}
html:not(.ico-embed-avrei) .process-v2 .v2-steps p {
  margin: 0 !important;
  color: var(--ico-muted) !important;
  font-size: 15px !important;
  line-height: 1.6 !important;
}

@media (min-width: 960px) {
  html:not(.ico-embed-avrei) .process-v2 .process-steps {
    display: grid !important;
    grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
    grid-template-rows: auto 1fr;
    column-gap: 64px;
  }
  html:not(.ico-embed-avrei) .process-v2 .process-steps > .section-kicker { grid-column: 1; grid-row: 1; }
  html:not(.ico-embed-avrei) .process-v2 .process-steps > .v2-heading { grid-column: 1; grid-row: 2; align-self: start; }
  html:not(.ico-embed-avrei) .process-v2 .process-steps > .v2-steps {
    grid-column: 2;
    grid-row: 1 / span 2;
    margin-top: 0 !important;
  }
  html:not(.ico-embed-avrei) .process-v2 .v2-steps > li:first-child { padding-top: 24px !important; }
}

/* ---- Form section ------------------------------------------------------- */
html:not(.ico-embed-avrei) .form-section {
  padding: clamp(64px, 8vw, 104px) 0 !important;
  background: var(--ico-sunken) !important;
  border: 0 !important;
}
html:not(.ico-embed-avrei) .form-section-header--v2 { margin: 0 auto 40px !important; max-width: 640px !important; }

html:not(.ico-embed-avrei) .form-wrapper {
  max-width: 800px !important;
  padding: 32px 40px 40px !important;
  background: var(--ico-surface) !important;
  border: 1px solid var(--ico-line) !important;
  border-radius: var(--ico-r-lg) !important;
  box-shadow: none !important;
}

/* Step track */
html:not(.ico-embed-avrei) .form-wrapper .step-track {
  margin: 0 0 16px !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
}
html:not(.ico-embed-avrei) .sti-dot {
  width: 28px !important;
  height: 28px !important;
  background: var(--ico-surface) !important;
  border: 1px solid var(--ico-line-strong) !important;
  box-shadow: none !important;
  color: var(--ico-subtle) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
}
html:not(.ico-embed-avrei) .step-indicator.active .sti-dot,
html:not(.ico-embed-avrei) .step-indicator.completed .sti-dot {
  background: var(--ico-accent) !important;
  border-color: var(--ico-accent) !important;
  color: #ffffff !important;
  box-shadow: none !important;
}
html:not(.ico-embed-avrei) .sti-label {
  color: var(--ico-subtle) !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}
html:not(.ico-embed-avrei) .step-indicator.active .sti-label { color: var(--ico-ink) !important; font-weight: 600 !important; }
html:not(.ico-embed-avrei) .sti-line { height: 1px !important; background: var(--ico-line) !important; }
html:not(.ico-embed-avrei) .step-indicator.completed + .sti-line { background: var(--ico-accent) !important; }
html:not(.ico-embed-avrei) .progress-bar-wrap {
  height: 2px !important;
  margin: 0 !important;
  background: var(--ico-line) !important;
  border-radius: 0 !important;
}
html:not(.ico-embed-avrei) .progress-bar {
  background: var(--ico-accent) !important;
  background-image: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

html:not(.ico-embed-avrei) .form-step {
  padding: 32px 0 0 !important;
  background: transparent !important;
}
html:not(.ico-embed-avrei) .step-header { margin-bottom: 24px !important; }
html:not(.ico-embed-avrei) .step-header h3,
html:not(.ico-embed-avrei) .v2-mid-heading {
  margin: 0 !important;
  color: var(--ico-ink) !important;
  font-family: var(--ico-font) !important;
  font-size: 22px !important;
  font-weight: 600 !important;
  letter-spacing: 0 !important;
  line-height: 1.3 !important;
}
html:not(.ico-embed-avrei) .v2-mid-heading { font-size: 18px !important; }
html:not(.ico-embed-avrei) .step-header p {
  margin: 4px 0 0 !important;
  color: var(--ico-muted) !important;
  font-size: 15px !important;
  line-height: 1.55 !important;
}
html:not(.ico-embed-avrei) .step-header--mid {
  margin-top: 32px !important;
  padding-top: 32px !important;
  border-top: 1px solid var(--ico-line) !important;
}

html:not(.ico-embed-avrei) .form-grid,
html:not(.ico-embed-avrei) .form-grid--step2 {
  gap: 20px 16px !important;
  margin-bottom: 20px !important;
}
html:not(.ico-embed-avrei) .form-group { gap: 6px !important; }
html:not(.ico-embed-avrei) .form-grid--slim.autofill-revealed .form-group--autofill {
  display: flex !important;
  flex-direction: column !important;
}

/* Labels read in sentence case ("First name *") without touching markup. */
html:not(.ico-embed-avrei) .form-wrapper .form-group > label:not(.consent-label):not(.condition-card) {
  display: block !important;
  color: var(--ico-ink) !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  letter-spacing: 0 !important;
  line-height: 1.4 !important;
  text-transform: lowercase !important;
}
html:not(.ico-embed-avrei) .form-wrapper .form-group > label:not(.consent-label):not(.condition-card)::first-letter {
  text-transform: uppercase !important;
}

html:not(.ico-embed-avrei) .form-wrapper input[type="text"],
html:not(.ico-embed-avrei) .form-wrapper input[type="number"],
html:not(.ico-embed-avrei) .form-wrapper input[type="email"],
html:not(.ico-embed-avrei) .form-wrapper input[type="tel"],
html:not(.ico-embed-avrei) .form-wrapper select,
html:not(.ico-embed-avrei) .form-group input:not([type="checkbox"]):not([type="radio"]),
html:not(.ico-embed-avrei) .form-group select {
  min-height: 48px !important;
  height: 48px;
  padding: 0 14px !important;
  background-color: var(--ico-surface) !important;
  border: 1px solid var(--ico-line-strong) !important;
  border-radius: var(--ico-r-sm) !important;
  box-shadow: none !important;
  color: var(--ico-ink) !important;
  font-family: var(--ico-font) !important;
  font-size: 16px !important;
  line-height: 1.4 !important;
  transition: border-color 0.15s ease, box-shadow 0.15s ease !important;
}
html:not(.ico-embed-avrei) .form-wrapper select,
html:not(.ico-embed-avrei) .form-group select {
  -webkit-appearance: none !important;
  appearance: none !important;
  padding-right: 40px !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%234a5662' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: right 14px center !important;
  background-size: 16px 16px !important;
}
html:not(.ico-embed-avrei) .form-wrapper input::placeholder { color: #8a929a !important; opacity: 1; }
html:not(.ico-embed-avrei) .form-wrapper input:not([type="checkbox"]):not([type="radio"]):hover,
html:not(.ico-embed-avrei) .form-wrapper select:hover { border-color: #b9b2a6 !important; }
html:not(.ico-embed-avrei) .form-wrapper input:not([type="checkbox"]):not([type="radio"]):focus,
html:not(.ico-embed-avrei) .form-wrapper select:focus {
  outline: none !important;
  border-color: var(--ico-accent) !important;
  box-shadow: 0 0 0 1px var(--ico-accent) !important;
}
html:not(.ico-embed-avrei) .form-wrapper input.error:not([type="checkbox"]):not([type="radio"]),
html:not(.ico-embed-avrei) .form-wrapper input[aria-invalid="true"]:not([type="checkbox"]):not([type="radio"]),
html:not(.ico-embed-avrei) .form-wrapper select.error,
html:not(.ico-embed-avrei) .form-wrapper select[aria-invalid="true"] {
  border-color: var(--ico-danger) !important;
  box-shadow: 0 0 0 1px var(--ico-danger) !important;
}
html:not(.ico-embed-avrei) .error-msg {
  min-height: 0 !important;
  color: var(--ico-danger) !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  line-height: 1.4 !important;
}
html:not(.ico-embed-avrei) .error-msg:empty { display: none !important; }

html:not(.ico-embed-avrei) .field-note,
html:not(.ico-embed-avrei) .address-helper {
  color: var(--ico-subtle) !important;
  font-size: 13px !important;
  line-height: 1.5 !important;
}
html:not(.ico-embed-avrei) .address-helper:empty { display: none !important; }
html:not(.ico-embed-avrei) .address-clear-btn {
  margin-top: 2px !important;
  padding: 4px 0 !important;
  color: var(--ico-subtle) !important;
  font-size: 13px !important;
  opacity: 1 !important;
  text-underline-offset: 3px;
}
html:not(.ico-embed-avrei) .address-clear-btn:hover { color: var(--ico-ink) !important; }
html:not(.ico-embed-avrei) .form-grid-note { margin: 0 !important; font-size: 14px !important; }
html:not(.ico-embed-avrei) .form-reveal-toggle {
  padding: 4px 0 !important;
  color: var(--ico-accent) !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  text-decoration: underline !important;
  text-decoration-thickness: 1px !important;
  text-underline-offset: 3px !important;
}

/* Address suggestions: the one place a soft shadow earns its keep. */
html:not(.ico-embed-avrei) .address-suggestions {
  border: 1px solid var(--ico-line) !important;
  border-radius: var(--ico-r-md) !important;
  box-shadow: 0 8px 24px rgba(20, 34, 53, 0.08) !important;
  background: var(--ico-surface) !important;
}
html:not(.ico-embed-avrei) .address-suggestion {
  color: var(--ico-ink) !important;
  border-color: var(--ico-line) !important;
}
html:not(.ico-embed-avrei) .address-suggestion:hover,
html:not(.ico-embed-avrei) .address-suggestion.active,
html:not(.ico-embed-avrei) .address-suggestion[aria-selected="true"] { background: var(--ico-page) !important; }
html:not(.ico-embed-avrei) .address-suggestion-line2 { color: var(--ico-subtle) !important; }

html:not(.ico-embed-avrei) .address-confirm {
  padding: 12px 16px !important;
  background: #fbf6ec !important;
  border: 1px solid #e8d7b5 !important;
  border-radius: var(--ico-r-md) !important;
}
html:not(.ico-embed-avrei) .address-confirm-hint { color: var(--ico-muted) !important; opacity: 1 !important; font-size: 13px !important; }
html:not(.ico-embed-avrei) .address-confirm-label { font-weight: 500 !important; font-size: 14px !important; color: var(--ico-ink) !important; }
html:not(.ico-embed-avrei) .address-confirm-label input[type="checkbox"] { accent-color: var(--ico-accent) !important; }

/* Consent */
html:not(.ico-embed-avrei) .form-consent-group,
html:not(.ico-embed-avrei) .form-wrapper .form-consent-group {
  margin: 4px 0 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}
html:not(.ico-embed-avrei) .consent-label,
html:not(.ico-embed-avrei) .form-wrapper .consent-label {
  gap: 10px !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  color: var(--ico-subtle) !important;
  font-size: 12px !important;
  font-weight: 400 !important;
  letter-spacing: 0 !important;
  line-height: 1.5 !important;
  text-transform: none !important;
}
html:not(.ico-embed-avrei) .consent-checkbox,
html:not(.ico-embed-avrei) .consent-label input[type="checkbox"] {
  width: 20px !important;
  height: 20px !important;
  min-width: 20px !important;
  min-height: 20px !important;
  margin: 0 !important;
  box-shadow: none !important;
  accent-color: var(--ico-accent) !important;
}
html:not(.ico-embed-avrei) .consent-label a,
html:not(.ico-embed-avrei) .form-privacy a {
  color: var(--ico-accent) !important;
  text-decoration: underline !important;
  text-decoration-thickness: 1px !important;
  text-underline-offset: 3px !important;
}

/* Actions */
html:not(.ico-embed-avrei) .form-actions {
  gap: 12px !important;
  margin-top: 24px !important;
  padding-top: 0 !important;
}
html:not(.ico-embed-avrei) .btn-primary,
html:not(.ico-embed-avrei) .btn-outline,
html:not(.ico-embed-avrei) .btn-ghost {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  min-height: 48px !important;
  padding: 0 24px !important;
  border-radius: var(--ico-r-md) !important;
  font-family: var(--ico-font) !important;
  font-size: 16px !important;
  font-weight: 600 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  box-shadow: none !important;
}
html:not(.ico-embed-avrei) .btn-outline,
html:not(.ico-embed-avrei) .btn-ghost {
  background: var(--ico-surface) !important;
  border: 1px solid var(--ico-line-strong) !important;
  color: var(--ico-ink) !important;
}
html:not(.ico-embed-avrei) .btn-outline:hover,
html:not(.ico-embed-avrei) .btn-ghost:hover {
  background: var(--ico-page) !important;
  border-color: #b9b2a6 !important;
  transform: none !important;
}
html:not(.ico-embed-avrei) .form-privacy {
  color: var(--ico-subtle) !important;
  font-size: 13px !important;
  line-height: 1.5 !important;
}
html:not(.ico-embed-avrei) #step2 .form-actions {
  flex-direction: row !important;
  align-items: center !important;
  justify-content: space-between !important;
}

/* Condition cards: calm list, sentence case, one selected state. */
html:not(.ico-embed-avrei) .condition-cards { gap: 8px !important; }
html:not(.ico-embed-avrei) .condition-card,
html:not(.ico-embed-avrei) .condition-card * {
  text-transform: none !important;
  letter-spacing: 0 !important;
}
html:not(.ico-embed-avrei) .condition-card-inner {
  padding: 16px 12px !important;
  background: var(--ico-surface) !important;
  border: 1px solid var(--ico-line) !important;
  border-radius: var(--ico-r-md) !important;
  box-shadow: none !important;
  color: var(--ico-ink) !important;
  font-weight: 400 !important;
  transition: border-color 0.15s ease, background-color 0.15s ease !important;
}
html:not(.ico-embed-avrei) .condition-card:hover .condition-card-inner {
  border-color: var(--ico-line-strong) !important;
  transform: none !important;
}
html:not(.ico-embed-avrei) .condition-card input:checked + .condition-card-inner {
  background: var(--ico-accent-soft) !important;
  border-color: var(--ico-accent) !important;
  box-shadow: inset 0 0 0 1px var(--ico-accent) !important;
}
html:not(.ico-embed-avrei) .condition-card input:focus-visible + .condition-card-inner {
  outline: 2px solid var(--ico-accent) !important;
  outline-offset: 2px !important;
}
html:not(.ico-embed-avrei) .condition-card-inner .cond-icon {
  width: 32px !important;
  height: 32px !important;
  margin-bottom: 8px !important;
  background: none !important;
  color: var(--ico-subtle) !important;
}
html:not(.ico-embed-avrei) .condition-card-inner .cond-icon svg { width: 28px !important; height: 28px !important; }
html:not(.ico-embed-avrei) .condition-card input:checked + .condition-card-inner .cond-icon { color: var(--ico-accent) !important; }
html:not(.ico-embed-avrei) .cond-stars {
  color: #9aa1a8 !important;
  font-size: 12px !important;
  font-weight: 400 !important;
}
html:not(.ico-embed-avrei) .cond-stars span { color: var(--ico-subtle) !important; }
html:not(.ico-embed-avrei) .condition-card input:checked + .condition-card-inner .cond-stars { color: var(--ico-accent) !important; }
html:not(.ico-embed-avrei) .condition-card-inner h4 {
  margin: 0 0 4px !important;
  color: var(--ico-ink) !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  line-height: 1.35 !important;
}
html:not(.ico-embed-avrei) .condition-card-inner p {
  color: var(--ico-muted) !important;
  font-size: 13px !important;
  font-weight: 400 !important;
  line-height: 1.45 !important;
}
html:not(.ico-embed-avrei) .cond-badge {
  padding: 2px 8px !important;
  background: var(--ico-sunken) !important;
  border: 0 !important;
  border-radius: var(--ico-r-sm) !important;
  color: var(--ico-muted) !important;
  font-size: 12px !important;
  font-weight: 500 !important;
}
html:not(.ico-embed-avrei) .condition-card input:checked + .condition-card-inner .cond-badge {
  background: var(--ico-surface) !important;
  color: var(--ico-accent) !important;
}
html:not(.ico-embed-avrei) .condition-card input:checked + .condition-card-inner::after,
html:not(.ico-embed-avrei) .condition-card input:checked ~ .condition-card-inner::after {
  background: var(--ico-accent) !important;
  box-shadow: none !important;
}
html:not(.ico-embed-avrei) .condition-more-btn {
  min-height: 48px !important;
  padding: 8px 16px !important;
  background: var(--ico-surface) !important;
  border: 1px solid var(--ico-line-strong) !important;
  border-radius: var(--ico-r-md) !important;
  color: var(--ico-ink) !important;
  font-family: var(--ico-font) !important;
}
html:not(.ico-embed-avrei) .condition-more-btn .cmb-label { font-size: 15px !important; font-weight: 600 !important; }
html:not(.ico-embed-avrei) .condition-more-btn .cmb-hint { color: var(--ico-subtle) !important; font-size: 13px !important; }

html:not(.ico-embed-avrei) .step2-rescue {
  background: var(--ico-page) !important;
  border: 1px solid var(--ico-line) !important;
  border-radius: var(--ico-r-md) !important;
  box-shadow: none !important;
  color: var(--ico-muted) !important;
}

/* Step 3 shell around the chat (inline styles in index.html, hence !important). */
html:not(.ico-embed-avrei) #step3 .step3-head { padding: 0 0 4px !important; }
html:not(.ico-embed-avrei) #step3 .step3-back,
html:not(.ico-embed-avrei) #step3 .step3-restart {
  min-height: 40px !important;
  padding: 0 14px !important;
  background: var(--ico-surface) !important;
  border: 1px solid var(--ico-line-strong) !important;
  border-radius: var(--ico-r-md) !important;
  color: var(--ico-ink) !important;
  font-size: 14px !important;
  font-weight: 500 !important;
}
html:not(.ico-embed-avrei) #step3 .step3-back:hover,
html:not(.ico-embed-avrei) #step3 .step3-restart:hover { background: var(--ico-page) !important; }
html:not(.ico-embed-avrei) #step3 .step3-title {
  color: var(--ico-ink) !important;
  font-family: var(--ico-font) !important;
  font-size: 20px !important;
  font-weight: 600 !important;
  letter-spacing: 0 !important;
}
html:not(.ico-embed-avrei) #step3 .step3-addr { color: var(--ico-subtle) !important; font-size: 14px !important; }
html:not(.ico-embed-avrei) #step3 .step3-iframe {
  border: 1px solid var(--ico-line-strong) !important;
  border-radius: var(--ico-r-lg) !important;
  box-shadow: none !important;
}

/* Legacy results markup (kept for safety; step 3 renders the chat). */
html:not(.ico-embed-avrei) .offer-card,
html:not(.ico-embed-avrei) .offer-decision,
html:not(.ico-embed-avrei) .market-breakdown,
html:not(.ico-embed-avrei) .offer-insights {
  border: 1px solid var(--ico-line) !important;
  border-radius: var(--ico-r-lg) !important;
  box-shadow: none !important;
}
html:not(.ico-embed-avrei) .cash-card--featured { border-top: 1px solid var(--ico-accent) !important; }
html:not(.ico-embed-avrei) .offer-range { font-variant-numeric: tabular-nums; }

/* ---- Dialogs and overlays ----------------------------------------------- */
html:not(.ico-embed-avrei) .loading-overlay,
html:not(.ico-embed-avrei) .modal-overlay,
html:not(.ico-embed-avrei) .legal-modal-overlay {
  background: rgba(20, 34, 53, 0.5) !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}
html:not(.ico-embed-avrei) .loading-box,
html:not(.ico-embed-avrei) .modal,
html:not(.ico-embed-avrei) .legal-modal {
  background: var(--ico-surface) !important;
  border: 1px solid var(--ico-line) !important;
  border-radius: var(--ico-r-lg) !important;
  box-shadow: 0 16px 40px rgba(20, 34, 53, 0.14) !important;
  color: var(--ico-ink) !important;
}
html:not(.ico-embed-avrei) .legal-modal-head { border-bottom-color: var(--ico-line) !important; }
html:not(.ico-embed-avrei) .loading-title,
html:not(.ico-embed-avrei) .modal h3,
html:not(.ico-embed-avrei) .legal-modal h3 {
  color: var(--ico-ink) !important;
  font-family: var(--ico-font) !important;
  font-weight: 600 !important;
  letter-spacing: 0 !important;
}
html:not(.ico-embed-avrei) .modal p,
html:not(.ico-embed-avrei) .loading-steps,
html:not(.ico-embed-avrei) .legal-modal-body { color: var(--ico-muted) !important; }
html:not(.ico-embed-avrei) .modal-close,
html:not(.ico-embed-avrei) .legal-modal-close {
  min-width: 44px;
  min-height: 44px;
  border-radius: var(--ico-r-md) !important;
  color: var(--ico-ink) !important;
}

/* ---- FAQ ---------------------------------------------------------------- */
html:not(.ico-embed-avrei) .faq.faq--v2,
html:not(.ico-embed-avrei) .faq {
  padding: clamp(24px, 3vw, 40px) 0 clamp(64px, 8vw, 104px) !important;
  background: var(--ico-page) !important;
  border: 0 !important;
}
html:not(.ico-embed-avrei) .faq .faq-item {
  background: transparent !important;
  border: 0 !important;
  border-bottom: 1px solid var(--ico-line) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}
html:not(.ico-embed-avrei) .faq .faq-item:first-child { border-top: 1px solid var(--ico-line) !important; }
html:not(.ico-embed-avrei) .faq .faq-item.open { background: transparent !important; }
html:not(.ico-embed-avrei) .faq .faq-q {
  min-height: 64px !important;
  padding: 20px 0 !important;
  color: var(--ico-ink) !important;
  font-family: var(--ico-font) !important;
  font-size: 17px !important;
  font-weight: 500 !important;
  letter-spacing: 0 !important;
  text-align: left !important;
}
html:not(.ico-embed-avrei) .faq .faq-q:hover { color: var(--ico-accent) !important; }
html:not(.ico-embed-avrei) .faq .faq-icon {
  color: var(--ico-subtle) !important;
  font-weight: 400 !important;
  font-size: 20px !important;
}
html:not(.ico-embed-avrei) .faq .faq-a { padding: 0 32px 20px 0 !important; }
html:not(.ico-embed-avrei) .faq .faq-a,
html:not(.ico-embed-avrei) .faq .faq-a p {
  color: var(--ico-muted) !important;
  font-size: 15px !important;
  line-height: 1.65 !important;
}

/* ---- Areas served ------------------------------------------------------- */
html:not(.ico-embed-avrei) .areas-v2 {
  padding: clamp(64px, 8vw, 96px) 0 !important;
  background: var(--ico-surface) !important;
  border: 0 !important;
}
/* Left-aligned like the FAQ; the cities are one plain sentence, not chips. */
html:not(.ico-embed-avrei) .areas-v2-inner {
  max-width: none !important;
  margin: 0 auto !important;
  text-align: left !important;
}
html:not(.ico-embed-avrei) .areas-v2 .v2-heading { max-width: 22em; margin: 0 0 16px !important; font-weight: 600 !important; }
html:not(.ico-embed-avrei) .areas-v2 .v2-sub { max-width: 40em; margin: 0 0 12px !important; }
html:not(.ico-embed-avrei) .areas-v2 .areas-v2-cities { color: var(--ico-ink) !important; }
html:not(.ico-embed-avrei) .areas-v2-note { max-width: 40em; margin: 20px 0 0 !important; color: var(--ico-muted) !important; font-size: 16px !important; }
html:not(.ico-embed-avrei) .areas-v2-note a { color: var(--ico-accent) !important; font-weight: 600 !important; }

/* ---- Footer ------------------------------------------------------------- */
html:not(.ico-embed-avrei) .footer.footer--v2,
html:not(.ico-embed-avrei) .footer {
  padding: 48px 0 !important;
  background: var(--ico-ink) !important;
  color: #c9d2da !important;
}
html:not(.ico-embed-avrei) .footer .logo-mark { border-radius: 8px !important; }
html:not(.ico-embed-avrei) .footer-v2-links a {
  color: #c9d2da !important;
  font-size: 14px !important;
  font-weight: 400 !important;
}
html:not(.ico-embed-avrei) .footer-v2-links a:hover { color: #ffffff !important; }
html:not(.ico-embed-avrei) .footer-v2-copy,
html:not(.ico-embed-avrei) .footer-v2-disclaimer { color: #c9d2da !important; font-size: 13px !important; }
html:not(.ico-embed-avrei) .footer a:focus-visible { outline-color: #ffffff !important; }

/* ---- Mobile sticky CTA -------------------------------------------------- */
html:not(.ico-embed-avrei) .mobile-sticky-cta {
  padding: 12px 16px calc(12px + env(safe-area-inset-bottom, 0px)) !important;
  background: var(--ico-page) !important;
  background-image: none !important;
  border-top: 1px solid var(--ico-line) !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}
html:not(.ico-embed-avrei) .mobile-sticky-cta .msc-btn {
  min-height: 48px !important;
  font-size: 16px !important;
}
html:not(.ico-embed-avrei) .mobile-sticky-cta .msc-arrow { font-family: var(--ico-font) !important; font-size: 16px !important; }

/* ---- Tablet ------------------------------------------------------------- */
@media (max-width: 980px) {
  html:not(.ico-embed-avrei) .hero-v3-inner { padding-right: 0 !important; }
  html:not(.ico-embed-avrei) .condition-cards { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
}

/* ---- Phone -------------------------------------------------------------- */
@media (max-width: 768px) {
  html:not(.ico-embed-avrei) .container { width: min(100% - 32px, 1120px) !important; }
  html:not(.ico-embed-avrei) .header-inner { min-height: 60px !important; padding-block: 8px !important; }
  html:not(.ico-embed-avrei) .header .logo-mark,
  html:not(.ico-embed-avrei) .logo-mark { width: 32px !important; height: 32px !important; }
  html:not(.ico-embed-avrei) .header .logo-name,
  html:not(.ico-embed-avrei) .logo-name { font-size: 14px !important; }

  html:not(.ico-embed-avrei) .hero-v3 { padding: 48px 0 48px !important; }
  html:not(.ico-embed-avrei) .hero-v3-title {
    font-size: clamp(36px, 10.4vw, 48px) !important;
    line-height: 1.06 !important;
    overflow-wrap: normal !important;
  }
  html:not(.ico-embed-avrei) .hero-v3-sub { font-size: 17px !important; margin-bottom: 24px !important; }
  html:not(.ico-embed-avrei) .hero-v3-cta { margin-bottom: 24px !important; }
  html:not(.ico-embed-avrei) .hero-v3-cta .btn-v3-primary {
    width: 100% !important;
    justify-content: center !important;
  }
  html:not(.ico-embed-avrei) .hero-v3-stats {
    display: flex !important;
    grid-template-columns: none !important;
    gap: 8px 16px !important;
    font-size: 14px !important;
  }
  html:not(.ico-embed-avrei) .hero-v3-stats li {
    flex-direction: row !important;
    padding: 0 !important;
    background: none !important;
    border: 0 !important;
    text-align: left !important;
  }
  html:not(.ico-embed-avrei) .hero-v3-stats .num { font-size: inherit !important; }

  html:not(.ico-embed-avrei) .process-v2,
  html:not(.ico-embed-avrei) .form-section,
  html:not(.ico-embed-avrei) .faq,
  html:not(.ico-embed-avrei) .faq.faq--v2,
  html:not(.ico-embed-avrei) .areas-v2 { padding: 56px 0 !important; }
  html:not(.ico-embed-avrei) .v2-heading,
  html:not(.ico-embed-avrei) .process-v2 .v2-heading,
  html:not(.ico-embed-avrei) .form-section .v2-heading,
  html:not(.ico-embed-avrei) .faq .v2-heading,
  html:not(.ico-embed-avrei) .areas-v2 .v2-heading { font-size: 30px !important; }
  html:not(.ico-embed-avrei) .v2-sub,
  html:not(.ico-embed-avrei) .form-section .v2-sub,
  html:not(.ico-embed-avrei) .faq .v2-sub,
  html:not(.ico-embed-avrei) .areas-v2 .v2-sub { font-size: 16px !important; }
  html:not(.ico-embed-avrei) .process-v2 .v2-steps > li { grid-template-columns: 36px 1fr !important; gap: 12px !important; padding: 20px 0 !important; }
  html:not(.ico-embed-avrei) .process-v2 .v2-steps h3 { font-size: 16px !important; }

  html:not(.ico-embed-avrei) .form-section-header--v2 { margin-bottom: 24px !important; }
  html:not(.ico-embed-avrei) .form-wrapper {
    padding: 20px 16px 24px !important;
    border-radius: var(--ico-r-lg) !important;
  }
  html:not(.ico-embed-avrei) .form-step { padding: 24px 0 0 !important; }
  html:not(.ico-embed-avrei) .step-header h3 { font-size: 20px !important; }
  html:not(.ico-embed-avrei) .form-grid,
  html:not(.ico-embed-avrei) .form-grid--step2 { gap: 16px !important; }
  html:not(.ico-embed-avrei) .step-track .sti-label {
    display: block !important;
    max-width: 96px !important;
    font-size: 12px !important;
    line-height: 1.25 !important;
    text-align: center !important;
  }
  html:not(.ico-embed-avrei) .form-actions .btn-primary,
  html:not(.ico-embed-avrei) .form-actions .btn-outline { width: 100% !important; }
  html:not(.ico-embed-avrei) #step2 .form-actions { flex-direction: column !important; align-items: stretch !important; }

  html:not(.ico-embed-avrei) .condition-cards { grid-template-columns: 1fr !important; }
  html:not(.ico-embed-avrei) .condition-card-inner {
    padding: 16px !important;
    column-gap: 12px !important;
  }
  html:not(.ico-embed-avrei) .condition-card-inner .cond-icon {
    margin: 0 !important;
    align-self: start !important;
    justify-content: center !important;
    align-items: center !important;
    background: var(--ico-page) !important;
    border-radius: var(--ico-r-sm) !important;
  }
  html:not(.ico-embed-avrei) .condition-card-inner .cond-icon svg { width: 20px !important; height: 20px !important; }
  html:not(.ico-embed-avrei) .condition-card input:checked + .condition-card-inner .cond-icon { background: var(--ico-surface) !important; }

  html:not(.ico-embed-avrei) #step3 .step3-back,
  html:not(.ico-embed-avrei) #step3 .step3-restart { min-height: 44px !important; font-size: 14px !important; padding: 0 12px !important; }
  html:not(.ico-embed-avrei) #step3 .step3-title { font-size: 17px !important; }
  html:not(.ico-embed-avrei) #step3 .step3-iframe { border-radius: var(--ico-r-md) !important; }

  html:not(.ico-embed-avrei) .faq .faq-q { font-size: 16px !important; }
  html:not(.ico-embed-avrei) .footer.footer--v2,
  html:not(.ico-embed-avrei) .footer { padding: 40px 0 calc(40px + env(safe-area-inset-bottom, 0px)) !important; }
}

@media (max-width: 430px) {
  html:not(.ico-embed-avrei) .container { width: min(100% - 32px, 1120px) !important; }
  html:not(.ico-embed-avrei) .hero-v3 { padding: 40px 0 40px !important; }
  html:not(.ico-embed-avrei) .hero-v3-stats { font-size: 13px !important; gap: 8px 14px !important; }
  html:not(.ico-embed-avrei) .form-wrapper { padding: 16px 16px 20px !important; }
  html:not(.ico-embed-avrei) .form-step { padding: 20px 0 0 !important; }
}

@media (prefers-reduced-motion: reduce) {
  html:not(.ico-embed-avrei) *,
  html:not(.ico-embed-avrei) *::before,
  html:not(.ico-embed-avrei) *::after { transition-duration: 0.01ms !important; animation-duration: 0.01ms !important; }
}

/* =========================================================================
   OFFER-FIRST HERO (founder, 2026-11-02)
   The first thing a visitor sees is "Get your cash offer now" and the form
   itself, with the 30-second explanation beside it (desktop) or above it
   (phone). The steps list moves under the form on phones so the first
   fields stay above the fold.
   ========================================================================= */
html:not(.ico-embed-avrei) .form-section.form-section--hero {
  padding: 40px 0 72px !important;
  background: var(--ico-page) !important;
  border-bottom: 0 !important;
}
html:not(.ico-embed-avrei) .offer-hero {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr);
  gap: 24px;
}
html:not(.ico-embed-avrei) .offer-hero .form-wrapper {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  box-shadow: none !important;
}
html:not(.ico-embed-avrei) .offer-hero-copy {
  margin: 0 !important;
  max-width: 560px !important;
  text-align: left !important;
}
html:not(.ico-embed-avrei) .offer-hero-copy .section-kicker { margin: 0 0 12px !important; }
html:not(.ico-embed-avrei) .offer-hero-title {
  margin: 0 0 16px !important;
  color: var(--ico-ink) !important;
  font-family: var(--ico-font) !important;
  font-size: clamp(40px, 5.4vw, 60px) !important;
  font-weight: 650 !important;
  letter-spacing: 0 !important;
  line-height: 1.02 !important;
}
html:not(.ico-embed-avrei) .offer-hero-sub {
  margin: 0 0 28px !important;
  color: var(--ico-muted) !important;
  font-size: 19px !important;
  line-height: 1.5 !important;
}
html:not(.ico-embed-avrei) .offer-hero-sub strong { color: var(--ico-ink) !important; font-weight: 700 !important; }
html:not(.ico-embed-avrei) .offer-hero-steps {
  display: grid !important;
  gap: 12px !important;
  margin: 8px 0 0 !important;
  padding: 0 !important;
  border: 0 !important;
  list-style: none !important;
}
html:not(.ico-embed-avrei) .offer-hero-steps li {
  display: grid !important;
  grid-template-columns: 20px minmax(0, 1fr) !important;
  gap: 4px !important;
  align-items: start !important;
  color: var(--ico-muted) !important;
  font-size: 15px !important;
  line-height: 1.5 !important;
}
html:not(.ico-embed-avrei) .offer-hero-steps strong { color: var(--ico-ink) !important; font-weight: 600 !important; }
/* The steps are a real sequence: plain numerals in the body face. */
html:not(.ico-embed-avrei) .ohs-num {
  display: block !important;
  width: auto !important;
  height: auto !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: none !important;
  color: var(--ico-ink) !important;
  font-size: inherit !important;
  font-weight: 600 !important;
  font-variant-numeric: tabular-nums;
}
html:not(.ico-embed-avrei) .ohs-num::after { content: "."; }

/* New step 1 / step 2 controls on the refresh palette. */
html:not(.ico-embed-avrei) {
  --cm-accent: var(--ico-accent);
  --cm-accent-soft: var(--ico-accent-soft);
  --cm-ink: var(--ico-ink);
  --cm-muted: var(--ico-muted);
  --cm-line: var(--ico-line-strong);
  --cm-surface: var(--ico-surface);
  --cm-sunken: var(--ico-sunken);
}
html:not(.ico-embed-avrei) .form-wrapper .field-label { color: var(--ico-ink) !important; }
html:not(.ico-embed-avrei) #step1 .form-grid--slim + .form-grid--slim { margin-top: 0 !important; }

@media (min-width: 1024px) {
  html:not(.ico-embed-avrei) .form-section.form-section--hero { padding: 56px 0 88px !important; }
  html:not(.ico-embed-avrei) .offer-hero {
    grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
    gap: 56px;
    align-items: start;
  }
  html:not(.ico-embed-avrei) .offer-hero-copy {
    position: sticky;
    top: 112px;
    padding-top: 24px;
  }
}

@media (max-width: 1023px) {
  /* Phone and tablet: headline, then the form, then how it works. */
  html:not(.ico-embed-avrei) .offer-hero-copy { display: contents !important; }
  html:not(.ico-embed-avrei) .offer-hero-copy > .section-kicker,
  html:not(.ico-embed-avrei) .offer-hero-title,
  html:not(.ico-embed-avrei) .offer-hero-sub { order: 0; margin-bottom: 0 !important; }
  html:not(.ico-embed-avrei) .offer-hero .form-wrapper { order: 1; }
  html:not(.ico-embed-avrei) .offer-hero-steps { order: 2; }
  html:not(.ico-embed-avrei) .offer-hero { gap: 12px; }
  html:not(.ico-embed-avrei) .offer-hero .form-wrapper,
  html:not(.ico-embed-avrei) .offer-hero-steps { margin-top: 12px !important; }
}

@media (max-width: 768px) {
  html:not(.ico-embed-avrei) .form-section.form-section--hero { padding: 24px 0 48px !important; }
  html:not(.ico-embed-avrei) .offer-hero-title { font-size: clamp(36px, 10.4vw, 44px) !important; }
  html:not(.ico-embed-avrei) .offer-hero-sub { font-size: 17px !important; }
  html:not(.ico-embed-avrei) .form-actions { margin-top: 16px !important; }
}
html:not(.ico-embed-avrei) #step1 .form-consent-group { margin-top: 0 !important; }
html:not(.ico-embed-avrei) .partner-notice { color: var(--ico-subtle) !important; }

/* =========================================================================
   PLAIN DETAILS (2026-11-04, "Design rules" in README.md)
   Small text in solid colours, no box inside the form card, and the legal
   pages on the same palette as the form. Still scoped away from AV REI.
   ========================================================================= */
html:not(.ico-embed-avrei) .field-optional {
  margin-left: 4px !important;
  color: var(--ico-muted) !important;
  font-size: 13px !important;
  font-weight: 400 !important;
  opacity: 1 !important;
}
/* "We found your home": a confirmation line, not a tinted box in the card. */
html:not(.ico-embed-avrei) .home-found {
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
}
html:not(.ico-embed-avrei) .home-found--confirm { margin-bottom: 24px !important; }
html:not(.ico-embed-avrei) .home-found-kicker { font-size: 14px !important; }

/* ---- Legal pages and the legal dialog ---------------------------------- */
html:not(.ico-embed-avrei) .legal-hero {
  padding: clamp(40px, 6vw, 72px) 0 8px !important;
  background: var(--ico-page) !important;
  border: 0 !important;
}
html:not(.ico-embed-avrei) .legal-hero::after { display: none !important; }
html:not(.ico-embed-avrei) .legal-hero h1 {
  margin: 0 0 8px !important;
  color: var(--ico-ink) !important;
  font-size: clamp(32px, 4vw, 44px) !important;
  font-weight: 600 !important;
  letter-spacing: 0 !important;
  line-height: 1.15 !important;
}
html:not(.ico-embed-avrei) .legal-hero p { color: var(--ico-muted) !important; font-size: 17px !important; }
html:not(.ico-embed-avrei) .legal-hero .legal-back { margin: 0 0 16px !important; font-size: 14px !important; }
html:not(.ico-embed-avrei) .legal-back a {
  color: var(--ico-muted) !important;
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
}
html:not(.ico-embed-avrei) .legal-back a:hover { color: var(--ico-ink) !important; }
html:not(.ico-embed-avrei) .legal-body { padding: 40px 0 96px !important; background: var(--ico-page) !important; }
html:not(.ico-embed-avrei) .legal-layout { gap: 64px !important; }
html:not(.ico-embed-avrei) .legal-toc {
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
}
html:not(.ico-embed-avrei) .legal-toc h2 {
  margin: 0 0 8px !important;
  color: var(--ico-ink) !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}
html:not(.ico-embed-avrei) .legal-toc a {
  padding: 6px 0 !important;
  border: 0 !important;
  color: var(--ico-muted) !important;
  font-size: 14px !important;
}
html:not(.ico-embed-avrei) .legal-toc a:hover { color: var(--ico-ink) !important; }
html:not(.ico-embed-avrei) .legal-effective {
  display: block !important;
  margin: 0 0 32px !important;
  padding: 0 !important;
  background: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  color: var(--ico-muted) !important;
  font-size: 14px !important;
  font-weight: 500 !important;
}
html:not(.ico-embed-avrei) .legal-content h2,
html:not(.ico-embed-avrei) .legal-content h3,
html:not(.ico-embed-avrei) .legal-content h4 { color: var(--ico-ink) !important; letter-spacing: 0 !important; }
html:not(.ico-embed-avrei) .legal-content p,
html:not(.ico-embed-avrei) .legal-content li { color: var(--ico-muted) !important; }
html:not(.ico-embed-avrei) .legal-content strong { color: var(--ico-ink) !important; }
/* One link colour: the accent (some links carry an older inline green). */
html:not(.ico-embed-avrei) .legal-content a,
html:not(.ico-embed-avrei) .legal-modal-body a {
  color: var(--ico-accent) !important;
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
}
html:not(.ico-embed-avrei) .legal-content a:hover,
html:not(.ico-embed-avrei) .legal-modal-body a:hover { color: var(--ico-accent-hover) !important; }
/* Partner entries, feature lists, notices and contact details read as part
   of the text: no boxes, no icon tiles, no decorative emoji. */
html:not(.ico-embed-avrei) .legal-content .partner-card,
html:not(.ico-embed-avrei) .legal-content .contact-box,
html:not(.ico-embed-avrei) .legal-content .access-card,
html:not(.ico-embed-avrei) .legal-content .notice-box {
  margin: 0 0 24px !important;
  padding: 0 !important;
  background: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}
html:not(.ico-embed-avrei) .legal-content .contact-box { margin-top: 0 !important; }
html:not(.ico-embed-avrei) .legal-content .notice-box,
html:not(.ico-embed-avrei) .legal-content .notice-box strong { color: var(--ico-ink) !important; font-size: 15.5px !important; }
html:not(.ico-embed-avrei) .legal-content .partner-card h3,
html:not(.ico-embed-avrei) .legal-content .contact-box h3 { font-size: 17px !important; margin: 0 0 4px !important; }
html:not(.ico-embed-avrei) .legal-content .partner-role {
  color: var(--ico-muted) !important;
  font-size: 14px !important;
  font-weight: 500 !important;
}
html:not(.ico-embed-avrei) .legal-content .access-card { display: block !important; margin-bottom: 16px !important; }
html:not(.ico-embed-avrei) .legal-content .access-card-icon,
html:not(.ico-embed-avrei) .legal-content .legal-icon { display: none !important; }
html:not(.ico-embed-avrei) .legal-content .access-card h4 { margin: 0 0 2px !important; font-size: 16px !important; }
html:not(.ico-embed-avrei) .legal-content .contact-box ul { margin: 0 !important; }
html:not(.ico-embed-avrei) .legal-content .contact-box ul li { padding: 2px 0 !important; border: 0 !important; }
html:not(.ico-embed-avrei) .legal-modal-head { padding-inline: 24px !important; }
html:not(.ico-embed-avrei) .legal-modal-body { padding: 20px 24px 28px !important; }
html:not(.ico-embed-avrei) .legal-modal-body .legal-effective { margin-bottom: 20px !important; }
html:not(.ico-embed-avrei) .legal-modal-body h2 { color: var(--ico-ink) !important; }

@media (max-width: 768px) {
  html:not(.ico-embed-avrei) .faq,
  html:not(.ico-embed-avrei) .faq.faq--v2 { padding-top: 16px !important; }
  html:not(.ico-embed-avrei) .faq-inner { gap: 24px !important; }
  html:not(.ico-embed-avrei) .legal-hero { padding: 32px 0 0 !important; }
  html:not(.ico-embed-avrei) .legal-hero h1 { font-size: 32px !important; }
  html:not(.ico-embed-avrei) .legal-body { padding: 32px 0 56px !important; }
  html:not(.ico-embed-avrei) .legal-layout { gap: 32px !important; }
}

/* =========================================================================
   POLISH (2026-11-04, second pass): headings that break evenly, answers and
   steps at reading size, a readable line length on the legal pages, and a
   few phone details. Same palette, same scope: AV REI is untouched.
   ========================================================================= */
html:not(.ico-embed-avrei) h1,
html:not(.ico-embed-avrei) h2,
html:not(.ico-embed-avrei) h3 { text-wrap: balance; }
html:not(.ico-embed-avrei) p,
html:not(.ico-embed-avrei) li { text-wrap: pretty; }

/* "30 seconds or less" reads as one phrase, and the line breaks fall between
   phrases at every width. */
html:not(.ico-embed-avrei) .offer-hero-sub { text-wrap: balance; }
html:not(.ico-embed-avrei) .offer-hero-sub strong { white-space: nowrap; }

/* How it works and the FAQ answers at reading size (16px, was 15px). */
html:not(.ico-embed-avrei) .offer-hero-steps li { font-size: 16px !important; }
html:not(.ico-embed-avrei) .faq .faq-a,
html:not(.ico-embed-avrei) .faq .faq-a p { font-size: 16px !important; }

/* Legal pages: 16px text on a measure of about 70 characters (it ran to
   about 100 across the full column). */
html:not(.ico-embed-avrei) .legal-content { max-width: 37rem; }
html:not(.ico-embed-avrei) .legal-content p,
html:not(.ico-embed-avrei) .legal-content li { font-size: 16px !important; }

/* Pressed state for the primary actions. */
html:not(.ico-embed-avrei) .btn-primary:active,
html:not(.ico-embed-avrei) .form-wrapper .btn-step:active,
html:not(.ico-embed-avrei) .nav a.btn-nav:active,
html:not(.ico-embed-avrei) .mobile-sticky-cta .msc-btn:active { transform: translateY(1px) !important; }

@media (max-width: 768px) {
  /* Each step label on one line ("Your details" wrapped to two). */
  html:not(.ico-embed-avrei) .step-track .sti-label { white-space: nowrap; }
  /* The FAQ heading sits with its questions, not 56px above them. */
  html:not(.ico-embed-avrei) .faq .v2-heading { margin-bottom: 0 !important; }
}

/* =========================================================================
   USABILITY PASS (2026-11-10): found by walking the form as a seller would,
   on a phone, a tablet and a desktop. Same palette, same scope: the American
   Valor REI embed is untouched.
   ========================================================================= */

/* The header keeps one height. It lost 8px once the page had scrolled 40px,
   which nudged everything under it mid-scroll. */
html:not(.ico-embed-avrei) .header,
html:not(.ico-embed-avrei) .header.scrolled {
  padding: 10px 0 !important;
  transition: none !important;
}

/* ---- Address screen ----------------------------------------------------- */
/* Typing it out by hand is the fallback, so its link reads as one: muted and
   left-aligned under the box. The button is the one green thing here. */
html:not(.ico-embed-avrei) .form-grid-note { text-align: left !important; }
html:not(.ico-embed-avrei) .form-reveal-toggle {
  color: var(--ico-muted) !important;
  font-weight: 400 !important;
}
html:not(.ico-embed-avrei) .form-reveal-toggle:hover { color: var(--ico-ink) !important; }

/* The line under the address box: a confirmation reads as one, and a request
   for the city, state and zip is body text, not a footnote. */
html:not(.ico-embed-avrei) .address-helper[data-state="success"] {
  color: var(--ico-accent) !important;
  font-weight: 500 !important;
}
html:not(.ico-embed-avrei) .address-helper[data-state="ask"] {
  color: var(--ico-ink) !important;
  font-size: 14px !important;
}

/* ---- Details screen ----------------------------------------------------- */
@media (max-width: 768px) {
  /* The way forward first, Back under it (Back sat on top of the button). */
  html:not(.ico-embed-avrei) #step2 .form-actions .btn-step { order: -1; }
}

/* ---- Offer screen ------------------------------------------------------- */
/* The heading and the address on the left, one "Edit details" button on the
   right, then the chat, sized to what is left of the screen (index.html
   measures --ico-offer-top) so the offer, the button under it and the message
   box are all visible without scrolling the page as well as the chat. */
html:not(.ico-embed-avrei) #step3 .step3-head {
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: 16px !important;
  padding: 0 0 12px !important;
}
html:not(.ico-embed-avrei) #step3 .step3-heading { min-width: 0; }
html:not(.ico-embed-avrei) #step3 .step3-title {
  margin: 0 !important;
  font-size: 22px !important;
  line-height: 1.3 !important;
  text-align: left !important;
}
html:not(.ico-embed-avrei) #step3 .step3-addr {
  margin: 2px 0 0 !important;
  padding: 0 !important;
  color: var(--ico-muted) !important;
  font-size: 14px !important;
  line-height: 1.4 !important;
  text-align: left !important;
  overflow-wrap: anywhere;
}
html:not(.ico-embed-avrei) #step3 .step3-back {
  flex-shrink: 0;
  cursor: pointer;
  font-family: var(--ico-font) !important;
}
html:not(.ico-embed-avrei) #step3 .step3-frame {
  height: min(880px, max(480px, calc(100dvh - var(--ico-offer-top, 190px) - 16px)));
  margin-top: 0;
}
/* The chat fills its frame exactly. An older phone rule (styles.css) gave the
   iframe its own, taller height, so it ran past the frame and over whatever
   came next on the page. */
html:not(.ico-embed-avrei) #step3 .step3-frame .step3-iframe { height: 100% !important; }
html:not(.ico-embed-avrei) #step3 .step3-loading {
  border-color: var(--ico-line) !important;
  border-radius: var(--ico-r-lg) !important;
}
html:not(.ico-embed-avrei) #step3 .step3-foot { margin: 8px 0 0 !important; }
html:not(.ico-embed-avrei) #step3 .step3-restart {
  min-height: 44px !important;
  padding: 0 !important;
  background: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  color: var(--ico-muted) !important;
  font-family: var(--ico-font) !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
  cursor: pointer;
}
html:not(.ico-embed-avrei) #step3 .step3-restart:hover { background: none !important; color: var(--ico-ink) !important; }

@media (max-width: 1023px) {
  /* With the offer on screen, "Get your cash offer now" and how to fill in
     the form have done their job. */
  html[data-ico-step="3"]:not(.ico-embed-avrei) .offer-hero-title,
  html[data-ico-step="3"]:not(.ico-embed-avrei) .offer-hero-sub,
  html[data-ico-step="3"]:not(.ico-embed-avrei) .offer-hero-steps { display: none !important; }
  html[data-ico-step="3"]:not(.ico-embed-avrei) .offer-hero .form-wrapper { margin-top: 0 !important; }
}

@media (max-width: 768px) {
  /* On a phone the chat is the card: no form card around it and no tracker
     above it, which gives the offer the full width of the screen. */
  html[data-ico-step="3"]:not(.ico-embed-avrei) .form-section.form-section--hero { padding-top: 16px !important; }
  html[data-ico-step="3"]:not(.ico-embed-avrei) #offer-form .form-wrapper {
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
  }
  html[data-ico-step="3"]:not(.ico-embed-avrei) .form-wrapper .step-track,
  html[data-ico-step="3"]:not(.ico-embed-avrei) .form-wrapper .progress-bar-wrap { display: none !important; }
  html[data-ico-step="3"]:not(.ico-embed-avrei) #step3.form-step { padding: 0 !important; }
  html:not(.ico-embed-avrei) #step3 .step3-title { font-size: 20px !important; }
  html:not(.ico-embed-avrei) #step3 .step3-frame {
    height: max(440px, calc(100dvh - var(--ico-offer-top, 170px) - 12px));
  }
}
