:root {
      /* Palette pulled from Ann's rainbow-over-lake photo */
      --paper:       #F1EEE8;   /* warm off-white */
      --paper-warm:  #E8E2D6;   /* deeper cream */
      --mist:        #D9D9D6;   /* sky highlight */
      --stone:       #A9AEB3;   /* overcast sky */
      --slate:       #6E7A82;   /* deep water */
      --denim:       #4A5B6E;   /* jeans blue */
      --asphalt:     #4B4E52;   /* wet pavement */
      --charcoal:    #2B2D30;
      --ink:         #1E1E20;   /* her coat, primary text */

      --rust:        #B4693A;   /* autumn foliage - primary accent */
      --rust-deep:   #8F4E27;
      --tan:         #B08C63;   /* boot leather */
      --gold:        #C7B27A;   /* soft rainbow */
      --olive:       #5F6A45;   /* evergreen */

      --muted:       #6E6A65;
      --hairline:    rgba(30, 30, 32, 0.12);
      --hairline-lt: rgba(217, 217, 214, 0.14);

      --serif: 'Fraunces', 'Georgia', ui-serif, serif;
      --sans:  'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

      --max: 1280px;
      --gutter: clamp(1.25rem, 4vw, 3rem);
    }

    * { box-sizing: border-box; }
    html { scroll-behavior: smooth; }
    body {
      margin: 0;
      font-family: var(--sans);
      font-weight: 400;
      font-size: 17px;
      line-height: 1.6;
      color: var(--ink);
      background: var(--paper);
      -webkit-font-smoothing: antialiased;
      text-rendering: optimizeLegibility;
    }
    img { max-width: 100%; display: block; }
    a { color: var(--rust-deep); text-decoration: none; transition: color .2s ease; }
    a:hover { color: var(--ink); }

    .container {
      max-width: var(--max);
      margin: 0 auto;
      padding: 0 var(--gutter);
    }

    /* ---------- NAV ---------- */
    .nav {
      position: absolute; top: 0; left: 0; right: 0; z-index: 50;
    }
    .nav.scrolled {
      position: fixed;
      background: rgba(241, 238, 232, 0.92);
      backdrop-filter: saturate(1.4) blur(14px);
      border-bottom: 1px solid var(--hairline);
      animation: slideDown .35s ease-out;
    }
    @keyframes slideDown { from { transform: translateY(-100%); } to { transform: none; } }
    .nav-inner {
      display: flex; align-items: center; justify-content: space-between;
      padding: 1.5rem var(--gutter);
      max-width: var(--max); margin: 0 auto;
      transition: color .3s ease;
    }
    .nav.dark .nav-inner { color: var(--paper); }
    .nav.dark .nav-inner a { color: var(--paper); }
    .nav.dark .nav-inner .brand { color: var(--paper); }

    .brand {
      font-family: var(--serif); font-weight: 400;
      font-size: 1.4rem; letter-spacing: -0.01em;
      color: var(--ink);
      display: flex; align-items: center; gap: .65rem;
    }
    .brand-mark {
      display: inline-block; width: 10px; height: 10px; border-radius: 50%;
      background: var(--rust);
    }
    .nav-links {
      display: flex; gap: 2.25rem; align-items: center;
      font-size: 0.94rem; font-weight: 400;
    }
    .nav-links a { color: var(--ink); }
    .nav-cta {
      background: var(--ink); color: var(--paper) !important;
      padding: .65rem 1.25rem; border-radius: 999px;
      font-size: 0.9rem; font-weight: 500;
      transition: background .2s ease;
    }
    .nav.dark .nav-cta {
      background: var(--paper); color: var(--ink) !important;
    }
    .nav-cta:hover { background: var(--rust) !important; color: var(--paper) !important; }
    @media (max-width: 780px) { .nav-links a:not(.nav-cta) { display: none; } }

    /* ---------- HERO (full-bleed) ---------- */
    .hero {
      position: relative;
      min-height: 100vh;
      min-height: 100svh;
      display: flex; flex-direction: column;
      justify-content: flex-end;
      overflow: hidden;
      color: var(--paper);
      isolation: isolate;
    }
    .hero-img {
      position: absolute; inset: 0; z-index: -2;
      background-image: url('assets/ann-headshot.jpg');
      background-size: cover;
      background-position: center 55%;
    }
    .hero::before {
      /* soft top-fade for nav legibility */
      content: '';
      position: absolute; inset: 0; z-index: -1;
      background:
        linear-gradient(180deg, rgba(20,22,26,0.55) 0%, rgba(20,22,26,0) 25%, rgba(20,22,26,0) 55%, rgba(20,22,26,0.75) 100%);
    }
    .hero-content {
      padding: 8rem 0 4.5rem;
    }
    .hero-content .container { max-width: 900px; margin-left: 0; padding-right: var(--gutter); padding-left: var(--gutter); }
    @media (min-width: 1280px) {
      .hero-content .container { padding-left: max(var(--gutter), calc((100vw - var(--max)) / 2 + var(--gutter))); }
    }

    .eyebrow {
      display: inline-flex; align-items: center; gap: .65rem;
      font-family: var(--sans);
      font-size: .78rem; font-weight: 500;
      letter-spacing: 0.16em; text-transform: uppercase;
      color: var(--gold);
      margin-bottom: 1.5rem;
    }
    .eyebrow::before {
      content: ''; display: inline-block; width: 28px; height: 1px;
      background: var(--gold);
    }
    .hero h1 {
      font-family: var(--serif);
      font-weight: 300;
      font-size: clamp(2.6rem, 6.5vw, 5rem);
      line-height: 1.02;
      letter-spacing: -0.025em;
      margin: 0 0 1.75rem;
      color: var(--paper);
      max-width: 18ch;
      text-wrap: balance;
    }
    .hero h1 em {
      font-style: italic; font-weight: 400;
      color: var(--gold);
      font-variation-settings: 'opsz' 144;
    }
    .hero-lede {
      font-size: 1.15rem;
      color: var(--mist);
      max-width: 44ch;
      margin: 0 0 2.5rem;
      line-height: 1.55;
    }
    .cta-row { display: flex; gap: 1rem; flex-wrap: wrap; }
    .btn {
      display: inline-flex; align-items: center; gap: .55rem;
      padding: 1rem 1.7rem; border-radius: 999px;
      font-family: var(--sans); font-weight: 500; font-size: .98rem;
      transition: transform .15s ease, background .2s ease, color .2s ease, border-color .2s ease;
      cursor: pointer; border: none; text-decoration: none;
    }
    .btn-primary { background: var(--paper); color: var(--ink); }
    .btn-primary:hover { background: var(--rust); color: var(--paper); transform: translateY(-1px); }
    .btn-ghost { background: transparent; color: var(--paper); border: 1px solid rgba(241,238,232,0.4); }
    .btn-ghost:hover { border-color: var(--paper); background: rgba(241,238,232,0.08); }
    .btn-dark { background: var(--ink); color: var(--paper); }
    .btn-dark:hover { background: var(--rust); color: var(--paper); transform: translateY(-1px); }
    .btn-outline { background: transparent; color: var(--ink); border: 1px solid var(--hairline); }
    .btn-outline:hover { border-color: var(--ink); color: var(--ink); }
    .btn .arrow { transition: transform .2s ease; }
    .btn:hover .arrow { transform: translateX(3px); }

    .hero-attribution {
      position: absolute; bottom: 1.25rem; right: 1.5rem;
      font-size: .72rem; letter-spacing: .08em; text-transform: uppercase;
      color: rgba(241,238,232,0.5);
      z-index: 1;
    }

    /* ---------- TRUST STRIP ---------- */
    .trust {
      background: var(--ink);
      color: var(--paper);
      padding: 2.5rem 0;
      border-bottom: 1px solid rgba(241,238,232,0.06);
    }
    .trust-grid {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: 2rem;
      align-items: center;
    }
    @media (max-width: 780px) { .trust-grid { grid-template-columns: repeat(2, 1fr); gap: 1.75rem; } }
    .trust-item {
      font-family: var(--sans); font-size: .78rem;
      letter-spacing: .14em; text-transform: uppercase;
      color: var(--stone);
      text-align: center;
    }
    .trust-item strong {
      display: block;
      font-family: var(--serif); font-weight: 300;
      font-size: 2rem; letter-spacing: -0.015em;
      color: var(--paper); text-transform: none;
      margin-bottom: .35rem;
    }
    .trust-item strong em { color: var(--gold); font-style: italic; }

    /* ---------- SECTIONS ---------- */
    section { padding: clamp(4.5rem, 10vw, 7.5rem) 0; }
    .section-head { max-width: 680px; margin: 0 0 3.5rem; }
    h2 {
      font-family: var(--serif); font-weight: 300;
      font-size: clamp(2.1rem, 4.5vw, 3.4rem);
      line-height: 1.08; letter-spacing: -0.022em;
      margin: .5rem 0 1.25rem;
      color: var(--ink);
      text-wrap: balance;
    }
    h2 em { font-style: italic; color: var(--rust); font-weight: 400; }
    .section-lede { color: var(--muted); font-size: 1.08rem; max-width: 55ch; }

    /* ---------- ABOUT ---------- */
    .about {
      background: var(--paper-warm);
      position: relative; overflow: hidden;
    }
    .about-grid {
      display: grid; grid-template-columns: 1fr 1.35fr;
      gap: clamp(2.5rem, 6vw, 5rem);
      align-items: start;
    }
    @media (max-width: 900px) { .about-grid { grid-template-columns: 1fr; } }

    .about-visual {
      padding: 2.75rem 2.25rem;
      background: var(--paper);
      border-radius: 4px;
      position: relative;
      border: 1px solid var(--hairline);
    }
    .about-visual::before {
      content: ''; position: absolute; top: -8px; left: -8px; right: 24px; bottom: 24px;
      background: var(--olive); border-radius: 4px; z-index: -1;
    }
    .credentials {
      list-style: none; padding: 0; margin: 0;
      display: grid; gap: 1.5rem;
    }
    .credentials li {
      padding-left: 1.25rem;
      border-left: 2px solid var(--rust);
    }
    .credentials strong {
      display: block;
      font-family: var(--serif); font-size: 1.2rem; font-weight: 500;
      color: var(--ink); margin-bottom: .2rem; letter-spacing: -0.005em;
    }
    .credentials span { font-size: .92rem; color: var(--muted); }

    .about-copy p {
      font-size: 1.06rem; color: var(--charcoal);
      margin: 0 0 1.3rem; line-height: 1.65;
    }
    .about-copy p:first-of-type::first-letter {
      font-family: var(--serif); font-weight: 300;
      font-size: 4rem; float: left;
      line-height: .82; margin: .2rem .55rem 0 0;
      color: var(--rust);
    }
    .signature {
      margin-top: 2rem;
      padding-top: 1.5rem;
      border-top: 1px solid var(--hairline);
      font-family: var(--serif); font-style: italic; font-weight: 300;
      color: var(--olive); font-size: 1.15rem;
    }

    /* ---------- SERVICES ---------- */
    .services-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 1.25rem;
    }
    @media (max-width: 900px) { .services-grid { grid-template-columns: 1fr; } }

    .service {
      background: var(--paper);
      border: 1px solid var(--hairline);
      border-radius: 6px;
      padding: 2.25rem 1.85rem 2rem;
      transition: border-color .25s ease, transform .25s ease, box-shadow .25s ease;
      display: flex; flex-direction: column;
      position: relative;
    }
    .service:hover {
      border-color: var(--rust);
      transform: translateY(-4px);
      box-shadow: 0 20px 40px -25px rgba(30,30,32,0.25);
    }
    .service-num {
      font-family: var(--serif); font-style: italic; font-weight: 300;
      color: var(--rust); font-size: 1.25rem;
      margin-bottom: 1.75rem;
    }
    .service h3 {
      font-family: var(--serif); font-weight: 400;
      font-size: 1.55rem; line-height: 1.2; letter-spacing: -0.015em;
      margin: 0 0 .85rem; color: var(--ink);
    }
    .service p { color: var(--muted); font-size: .98rem; margin: 0 0 1.75rem; flex-grow: 1; }
    .service-link {
      font-size: .9rem; font-weight: 500;
      color: var(--ink); display: inline-flex; align-items: center; gap: .45rem;
      border-bottom: 1px solid var(--hairline); padding-bottom: .2rem; align-self: flex-start;
      transition: border-color .2s ease, color .2s ease;
    }
    .service:hover .service-link { color: var(--rust); border-color: var(--rust); }
    .service-link::after {
      content: '→'; transition: transform .2s ease;
    }
    .service:hover .service-link::after { transform: translateX(3px); }

    /* ---------- ALF FEATURE (dark, standout) ---------- */
    .alf {
      background: var(--ink);
      color: var(--paper);
      position: relative;
      overflow: hidden;
    }
    .alf::before {
      content: '';
      position: absolute; top: -50%; right: -20%; width: 60%; height: 200%;
      background: radial-gradient(ellipse, rgba(180,105,58,0.15) 0%, rgba(180,105,58,0) 60%);
      pointer-events: none;
    }
    .alf .container { position: relative; }
    .alf-grid {
      display: grid; grid-template-columns: 1fr 1fr;
      gap: clamp(2rem, 5vw, 4.5rem); align-items: center;
    }
    @media (max-width: 900px) { .alf-grid { grid-template-columns: 1fr; } }
    .alf .eyebrow { color: var(--gold); }
    .alf .eyebrow::before { background: var(--gold); }
    .alf h2 { color: var(--paper); }
    .alf h2 em { color: var(--gold); }
    .alf-lede { color: var(--stone); font-size: 1.1rem; margin-bottom: 2.25rem; max-width: 42ch; }
    .alf-list {
      list-style: none; padding: 0; margin: 0;
      display: grid; gap: .85rem;
    }
    .alf-list li {
      padding: 1.15rem 1.4rem;
      background: rgba(241,238,232,0.04);
      border-radius: 4px;
      border-left: 3px solid var(--gold);
      color: var(--paper);
      font-size: .98rem;
    }
    .alf-list strong { display: block; margin-bottom: .25rem; font-weight: 500; }
    .alf-list em { font-style: normal; color: var(--stone); font-size: .92rem; line-height: 1.5; }

    /* ---------- CTA BAND ---------- */
    .cta-band {
      background: var(--paper-warm);
      text-align: center;
      padding: clamp(4.5rem, 9vw, 6.5rem) 0;
    }
    .cta-band .eyebrow { justify-content: center; color: var(--rust); }
    .cta-band .eyebrow::before { background: var(--rust); }
    .cta-band h2 { margin: 0 auto 1.25rem; max-width: 22ch; }
    .cta-band .section-lede { margin: 0 auto 2.5rem; }
    .cta-band .cta-row { justify-content: center; }

    /* ---------- FOOTER ---------- */
    footer {
      background: var(--ink); color: var(--stone);
      padding: 4rem 0 2rem;
      font-size: .92rem;
    }
    .footer-grid {
      display: grid; grid-template-columns: 2fr 1fr 1fr 1fr;
      gap: 2rem; margin-bottom: 3rem;
    }
    @media (max-width: 780px) { .footer-grid { grid-template-columns: 1fr 1fr; gap: 2rem 1.5rem; } }
    footer h4 {
      font-family: var(--sans); font-size: .76rem;
      letter-spacing: .16em; text-transform: uppercase;
      color: var(--gold); margin: 0 0 1.1rem; font-weight: 500;
    }
    footer a { color: var(--mist); display: block; padding: .32rem 0; }
    footer a:hover { color: var(--gold); }
    .footer-brand {
      font-family: var(--serif); font-size: 1.5rem; font-weight: 400;
      color: var(--paper); margin-bottom: 1rem;
      display: flex; align-items: center; gap: .6rem;
    }
    .footer-tag { color: var(--stone); font-size: .96rem; max-width: 34ch; line-height: 1.55; }
    .footer-base {
      padding-top: 2rem; border-top: 1px solid rgba(241,238,232,0.08);
      display: flex; justify-content: space-between; flex-wrap: wrap; gap: 1rem;
      color: var(--muted); font-size: .82rem;
    }
    .footer-base a { display: inline; color: var(--stone); }

    /* Entrance */
    @media (prefers-reduced-motion: no-preference) {
      .fade-up { opacity: 0; transform: translateY(20px); animation: fadeUp 1s cubic-bezier(.2,.7,.2,1) forwards; }
      .fade-up.d1 { animation-delay: .15s; }
      .fade-up.d2 { animation-delay: .3s; }
      .fade-up.d3 { animation-delay: .45s; }
      .fade-up.d4 { animation-delay: .6s; }
      @keyframes fadeUp { to { opacity: 1; transform: none; } }
    }

/* ================================
   SUBPAGE STYLES
   ================================ */

/* Non-hero page header (About/Services/etc) */
.page-hero {
  background: var(--paper-warm);
  padding: 9rem 0 clamp(3rem, 6vw, 5rem);
  border-bottom: 1px solid var(--hairline);
}
.page-hero h1 {
  font-family: var(--serif); font-weight: 300;
  font-size: clamp(2.4rem, 5.5vw, 4.2rem);
  line-height: 1.05; letter-spacing: -0.025em;
  margin: .75rem 0 1.25rem; color: var(--ink);
  max-width: 22ch; text-wrap: balance;
}
.page-hero h1 em { font-style: italic; color: var(--rust); font-weight: 400; }
.page-hero .lede {
  font-size: 1.2rem; color: var(--charcoal);
  max-width: 55ch; margin: 0; line-height: 1.5;
}

/* Nav on light background (subpages) */
.nav.light { position: absolute; }
.nav.light .nav-inner { color: var(--ink); }

/* Prose */
.prose {
  max-width: 68ch; font-size: 1.08rem; color: var(--charcoal); line-height: 1.7;
}
.prose p { margin: 0 0 1.35rem; }
.prose h3 {
  font-family: var(--serif); font-weight: 400; font-size: 1.6rem;
  color: var(--ink); margin: 2.5rem 0 .75rem; letter-spacing: -0.01em;
}
.prose h4 {
  font-family: var(--sans); font-weight: 500; font-size: 1rem;
  color: var(--ink); margin: 1.5rem 0 .5rem; letter-spacing: .02em;
}
.prose ul { padding-left: 1.2rem; margin: 0 0 1.35rem; }
.prose li { margin-bottom: .5rem; }
.prose blockquote {
  margin: 2rem 0; padding: 1rem 0 1rem 1.5rem;
  border-left: 3px solid var(--rust);
  font-family: var(--serif); font-style: italic; font-weight: 300;
  font-size: 1.25rem; color: var(--ink); line-height: 1.45;
}

/* Two-col layouts */
.split { display: grid; grid-template-columns: 1fr 1.4fr; gap: clamp(2rem, 6vw, 5rem); align-items: start; }
@media (max-width: 900px) { .split { grid-template-columns: 1fr; } }
.split-side {
  position: sticky; top: 6rem;
  padding: 2rem 1.75rem;
  background: var(--paper);
  border: 1px solid var(--hairline); border-radius: 6px;
}
.split-side h4 {
  font-family: var(--sans); font-size: .76rem;
  letter-spacing: .14em; text-transform: uppercase;
  color: var(--rust); margin: 0 0 1rem; font-weight: 500;
}
.split-side ul { list-style: none; padding: 0; margin: 0; }
.split-side li { padding: .55rem 0; border-bottom: 1px solid var(--hairline); }
.split-side li:last-child { border-bottom: none; }
.split-side a { color: var(--ink); font-size: .95rem; display: block; }
.split-side a:hover { color: var(--rust); }

/* Service detail blocks */
.service-block {
  padding: 2.5rem 0; border-top: 1px solid var(--hairline);
}
.service-block:first-child { border-top: none; padding-top: 0; }
.service-block .num {
  font-family: var(--serif); font-style: italic; font-weight: 300;
  color: var(--rust); font-size: 1.1rem; margin-bottom: .75rem;
}
.service-block h3 {
  font-family: var(--serif); font-weight: 400;
  font-size: 2rem; line-height: 1.15; letter-spacing: -0.02em;
  margin: 0 0 1rem; color: var(--ink);
}
.service-block .conditions {
  display: flex; flex-wrap: wrap; gap: .5rem; margin: 1.25rem 0 0;
  list-style: none; padding: 0;
}
.service-block .conditions li {
  padding: .4rem .85rem;
  background: var(--paper-warm);
  border: 1px solid var(--hairline);
  border-radius: 999px;
  font-size: .85rem; color: var(--charcoal);
  margin: 0;
}

/* Contact form */
.contact-grid { display: grid; grid-template-columns: 1fr 1.4fr; gap: clamp(2rem, 5vw, 4rem); }
@media (max-width: 900px) { .contact-grid { grid-template-columns: 1fr; } }
.contact-info h4 {
  font-family: var(--sans); font-size: .76rem;
  letter-spacing: .14em; text-transform: uppercase;
  color: var(--rust); margin: 2rem 0 .5rem; font-weight: 500;
}
.contact-info h4:first-child { margin-top: 0; }
.contact-info p, .contact-info a {
  display: block; font-size: 1.05rem; color: var(--ink); margin: 0;
  padding: 0; line-height: 1.5;
}
form .field { margin-bottom: 1.5rem; }
form label {
  display: block; font-size: .82rem; font-weight: 500;
  letter-spacing: .08em; text-transform: uppercase;
  color: var(--charcoal); margin-bottom: .5rem;
}
form input, form textarea, form select {
  width: 100%; padding: .9rem 1rem;
  border: 1px solid var(--hairline); border-radius: 4px;
  background: var(--paper); color: var(--ink);
  font-family: var(--sans); font-size: 1rem;
  transition: border-color .2s ease;
}
form input:focus, form textarea:focus, form select:focus {
  outline: none; border-color: var(--rust);
}
form textarea { min-height: 140px; resize: vertical; }
form .row { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
@media (max-width: 600px) { form .row { grid-template-columns: 1fr; } }
.form-note {
  font-size: .85rem; color: var(--muted); margin: -.5rem 0 1rem;
}
.form-status {
  margin-top: 1.5rem;
  padding: 1.25rem 1.5rem;
  border-radius: 4px;
  font-size: 1rem;
  line-height: 1.5;
}
.form-status.success {
  background: rgba(95,106,69,0.08);
  border-left: 3px solid var(--olive);
  color: var(--charcoal);
}
.form-status.success strong { color: var(--olive); }
.form-status.error {
  background: rgba(180,105,58,0.08);
  border-left: 3px solid var(--rust);
  color: var(--charcoal);
}

/* Insurance table */
.plans {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: .75rem; margin: 2rem 0;
}
.plans li {
  padding: 1rem 1.25rem; background: var(--paper); border: 1px solid var(--hairline);
  border-radius: 4px; font-size: .98rem; color: var(--ink); list-style: none;
}