/* =========================================================
   Emily Stout DDS — brand emerald + sage green
   Libre Baskerville (display) · Source Sans 3 (body)
   ========================================================= */

/* ---------- Design tokens ---------- */
:root{
  /* color — real Emily Stout DDS brand: emerald + sage green */
  --ink:        #22301B;   /* deep green-charcoal — headlines & body */
  --ink-2:      #45543A;   /* secondary text */
  --muted:      #6F7B62;   /* tertiary text */
  --brand:      #0F7A45;   /* emerald — primary (logo green) */
  --brand-strong:#065F34;  /* deep emerald */
  --brand-2:    #2E9B5E;   /* bright emerald — gradient partner */
  --aqua:       #7C9166;   /* sage — secondary accent (their header green) */
  --aqua-deep:  #5C7049;   /* deep sage/olive — text accent */
  --aqua-soft:  #E5EDD8;   /* pale sage */
  --sky:        #EDF2E5;   /* pale sage wash */
  --sky-2:      #F5F8EE;
  --paper:      #FFFFFF;
  --line:       #DEE5D0;
  --line-soft:  #EBF0DF;
  --mint:       #DCEDDA;   /* logo circle mint */

  /* type */
  --font-display:"Libre Baskerville", Georgia, "Times New Roman", serif;
  --font-body:"Source Sans 3", "Source Sans Pro", system-ui, -apple-system, "Segoe UI", sans-serif;

  /* radii + shadow */
  --r-sm: 10px;
  --r:    16px;
  --r-lg: 24px;
  --r-xl: 32px;
  --shadow-sm: 0 1px 2px rgba(30,44,22,.06), 0 2px 8px rgba(30,44,22,.05);
  --shadow:    0 12px 30px -12px rgba(30,44,22,.18);
  --shadow-lg: 0 30px 60px -20px rgba(30,44,22,.28);
  --ring: 0 0 0 3px rgba(15,122,69,.32);

  /* layout */
  --wrap: 1180px;
  --pad: clamp(1.15rem, 4vw, 2.5rem);
  --section-y: clamp(4rem, 9vw, 7.5rem);
}

/* ---------- Reset ---------- */
*,*::before,*::after{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; scroll-behavior:smooth; }
@media (prefers-reduced-motion: reduce){ html{ scroll-behavior:auto; } }
body{
  margin:0;
  font-family:var(--font-body);
  color:var(--ink);
  background:var(--paper);
  font-size:clamp(1rem, 0.96rem + 0.2vw, 1.0625rem);
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overflow-x:clip;               /* guardrail against horizontal scroll */
}
img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
button{ font-family:inherit; cursor:pointer; }
h1,h2,h3,h4{ font-family:var(--font-display); font-weight:700; line-height:1.16; letter-spacing:-0.005em; margin:0; color:var(--ink); }
p{ margin:0; }
:focus-visible{ outline:none; box-shadow:var(--ring); border-radius:6px; }

.wrap{ width:100%; max-width:var(--wrap); margin-inline:auto; padding-inline:var(--pad); }

.skip-link{
  position:fixed; left:12px; top:-60px; z-index:200;
  background:var(--ink); color:#fff; padding:.6rem 1rem; border-radius:8px;
  transition:top .2s ease;
}
.skip-link:focus{ top:12px; }

.eyebrow{
  font-family:var(--font-body);
  font-weight:700; font-size:.78rem; letter-spacing:.14em; text-transform:uppercase;
  color:var(--brand); margin-bottom:.9rem;
}
.u-accent{ color:var(--brand); position:relative; white-space:nowrap; }
.u-accent::after{
  content:""; position:absolute; left:2%; right:2%; bottom:.06em; height:.34em;
  background:linear-gradient(90deg, var(--aqua-soft), rgba(15,122,69,.30));
  border-radius:6px; z-index:-1;
}
.stars{ color:#F5A623; letter-spacing:.06em; font-size:.95em; }

/* ---------- Buttons ---------- */
.btn{
  --btn-bg:var(--brand); --btn-fg:#fff;
  display:inline-flex; align-items:center; justify-content:center; gap:.55rem;
  font-family:var(--font-body); font-weight:600; font-size:.98rem; line-height:1;
  padding:.85rem 1.4rem; border-radius:999px; border:1.5px solid transparent;
  background:var(--btn-bg); color:var(--btn-fg);
  transition:transform .18s ease, box-shadow .2s ease, background .2s ease, color .2s ease, border-color .2s ease;
  white-space:nowrap;
}
.btn:hover{ transform:translateY(-2px); }
.btn:active{ transform:translateY(0); }
.btn--lg{ padding:1.05rem 1.8rem; font-size:1.02rem; }
.btn--block{ width:100%; }

.btn--primary{
  background:linear-gradient(180deg, var(--brand-2), var(--brand));
  box-shadow:0 10px 22px -10px rgba(15,110,60,.7);
}
.btn--primary:hover{ box-shadow:0 16px 30px -12px rgba(15,110,60,.75); }

.btn--ghost{
  background:#fff; color:var(--brand-strong); border-color:var(--line);
  box-shadow:var(--shadow-sm);
}
.btn--ghost:hover{ border-color:var(--brand-2); color:var(--brand); }

.btn--white{ background:#fff; color:var(--brand-strong); box-shadow:var(--shadow); }
.btn--outline-white{ background:transparent; color:#fff; border-color:rgba(255,255,255,.55); }
.btn--outline-white:hover{ background:rgba(255,255,255,.12); border-color:#fff; }

/* ---------- Utility strip ---------- */
.utility{
  background:var(--ink); color:#dce6ce; font-size:.83rem;
}
.utility__inner{ display:flex; align-items:center; justify-content:space-between; gap:1rem; min-height:40px; }
.utility__badge{ display:flex; align-items:center; gap:.5rem; font-weight:500; color:#eef3e6; }
.utility__right{ display:flex; align-items:center; gap:1.4rem; }
.utility__espanol{ color:#c7d8ae; font-weight:600; }
.utility__phone{ display:inline-flex; align-items:center; gap:.4rem; font-weight:600; color:#fff; }
.utility__phone:hover{ color:var(--aqua); }

/* ---------- Header ---------- */
.header{
  position:sticky; top:0; z-index:100;
  background:rgba(255,255,255,.82);
  backdrop-filter:saturate(1.4) blur(12px);
  -webkit-backdrop-filter:saturate(1.4) blur(12px);
  border-bottom:1px solid transparent;
  transition:box-shadow .25s ease, border-color .25s ease, background .25s ease;
}
.header.is-stuck{ box-shadow:0 6px 24px -14px rgba(30,44,22,.35); border-bottom-color:var(--line-soft); }
.header__inner{ display:flex; align-items:center; gap:1.4rem; min-height:74px; }

.brand{ display:inline-flex; align-items:center; gap:.7rem; margin-right:auto; }
.brand__mark{
  display:grid; place-items:center; width:48px; height:48px; border-radius:50%;
  color:var(--brand); background:var(--mint);
  box-shadow:0 6px 14px -9px rgba(15,110,60,.55); border:1px solid #CBE1C3;
}
.brand__text{ display:flex; flex-direction:column; line-height:1; }
.brand__name{ font-family:var(--font-display); font-weight:700; font-size:1.18rem; letter-spacing:-.01em; color:var(--ink); }
.brand__dds{ color:var(--aqua-deep); }
.brand__tag{ font-size:.72rem; letter-spacing:.03em; color:var(--muted); margin-top:.28rem; font-weight:500; }

.nav{ display:flex; align-items:center; gap:.35rem; }
.nav a{
  padding:.55rem .8rem; border-radius:9px; font-weight:600; font-size:.95rem; color:var(--ink-2);
  position:relative; transition:color .18s ease, background .18s ease;
}
.nav a::after{
  content:""; position:absolute; left:.8rem; right:.8rem; bottom:.32rem; height:2px; border-radius:2px;
  background:var(--aqua); transform:scaleX(0); transform-origin:left; transition:transform .22s ease;
}
.nav a:hover{ color:var(--brand); }
.nav a:hover::after{ transform:scaleX(1); }
.header__cta{ display:flex; align-items:center; }

/* hamburger */
.hamburger{
  display:none; width:44px; height:44px; border:1px solid var(--line); border-radius:11px;
  background:#fff; flex-direction:column; align-items:center; justify-content:center; gap:5px;
}
.hamburger span{ width:20px; height:2px; background:var(--ink); border-radius:2px; transition:transform .25s ease, opacity .2s ease; }
.hamburger[aria-expanded="true"] span:nth-child(1){ transform:translateY(7px) rotate(45deg); }
.hamburger[aria-expanded="true"] span:nth-child(2){ opacity:0; }
.hamburger[aria-expanded="true"] span:nth-child(3){ transform:translateY(-7px) rotate(-45deg); }

.mobile-nav{
  display:flex; flex-direction:column; gap:.2rem; padding:1rem var(--pad) 1.4rem;
  border-top:1px solid var(--line-soft); background:#fff;
}
.mobile-nav[hidden]{ display:none; }
.mobile-nav a{ padding:.85rem .4rem; font-weight:600; color:var(--ink); border-bottom:1px solid var(--line-soft); }
.mobile-nav a:last-of-type{ border-bottom:0; }
.mobile-nav .btn{ margin-top:.8rem; }
.mobile-nav__call{ text-align:center; color:var(--brand)!important; border:0!important; }

/* ---------- Hero ---------- */
.hero{ position:relative; overflow:hidden; background:linear-gradient(180deg, var(--sky-2), #fff 70%); }
.hero__glow{
  position:absolute; inset:0; pointer-events:none; z-index:0;
  background:
    radial-gradient(60% 55% at 82% 8%, rgba(124,145,102,.18), transparent 60%),
    radial-gradient(45% 45% at 12% 20%, rgba(46,155,94,.14), transparent 60%);
}
.hero__inner{
  position:relative; z-index:1;
  display:grid; grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr); gap:clamp(2rem,5vw,4.5rem); align-items:center;
  padding-top:clamp(2.6rem,6vw,4.6rem); padding-bottom:clamp(3rem,6vw,5rem);
}
.hero__title{
  font-size:clamp(2.35rem, 1.4rem + 3.9vw, 4.1rem);
  font-weight:700; letter-spacing:-.01em; line-height:1.12; margin-bottom:1.2rem;
}
.hero__lead{ font-size:clamp(1.05rem,1rem + .4vw,1.22rem); color:var(--ink-2); max-width:34ch; margin-bottom:1.9rem; }
.hero__actions{ display:flex; flex-wrap:wrap; gap:.85rem; margin-bottom:2rem; }
.hero__trust{ display:flex; flex-wrap:wrap; gap:1rem 1.8rem; }
.hero__trust-item{ display:flex; align-items:center; gap:.55rem; font-size:.92rem; color:var(--ink-2); }
.hero__trust-item svg{ color:var(--aqua-deep); flex:none; }
.hero__trust-item strong{ color:var(--ink); }

/* hero media + signature */
.hero__media{ position:relative; min-width:0; }
.hero__frame{
  position:relative; border-radius:var(--r-xl); overflow:hidden; z-index:1;
  box-shadow:var(--shadow-lg); border:6px solid #fff;
  aspect-ratio:5/6; background:var(--sky);
  rotate:1.3deg;
}
.hero__frame img{ width:100%; height:100%; object-fit:cover; }

.rating-card{
  position:absolute; top:8%; left:-6%; z-index:2;
  display:flex; align-items:center; gap:.7rem;
  background:#fff; padding:.8rem 1rem; border-radius:16px;
  box-shadow:var(--shadow); border:1px solid var(--line-soft);
}
.rating-card__num{ font-family:var(--font-display); font-weight:700; font-size:1.7rem; color:var(--brand); line-height:1; }
.rating-card__meta{ display:flex; flex-direction:column; gap:.15rem; }
.rating-card__label{ font-size:.74rem; color:var(--muted); font-weight:600; }

.seal{
  position:absolute; bottom:-22px; left:-26px; z-index:3;
  width:128px; height:128px; filter:drop-shadow(0 12px 22px rgba(30,44,22,.22));
}
.seal svg{ width:100%; height:100%; }
.seal__ring{ fill:var(--ink); }
.seal__ring--thin{ fill:none; stroke:rgba(255,255,255,.28); stroke-width:1.2; }
.seal__text{ fill:#fff; font-family:var(--font-body); font-weight:700; font-size:13px; letter-spacing:.14em; }
.seal__star path{ fill:var(--aqua); }
.seal__yr{ fill:#fff; font-family:var(--font-display); font-weight:700; font-size:12px; letter-spacing:.05em; }
.seal svg > text, .seal__text{ animation:spin 26s linear infinite; transform-origin:100px 100px; }

@keyframes spin{ to{ transform:rotate(360deg); } }

/* ---------- Stats band ---------- */
.stats{ background:var(--ink); color:#fff; }
.stats__grid{
  display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:1rem;
  padding-block:clamp(2rem,4vw,2.8rem);
}
.stat{ text-align:center; padding:.4rem 1rem; position:relative; }
.stat + .stat::before{
  content:""; position:absolute; left:0; top:15%; bottom:15%; width:1px; background:rgba(255,255,255,.14);
}
.stat__num{ display:block; font-family:var(--font-display); font-weight:700; font-size:clamp(1.7rem,1.2rem+1.5vw,2.4rem); letter-spacing:-.01em; line-height:1; }
.stat__unit{ color:var(--aqua); }
.stat__label{ display:block; margin-top:.55rem; font-size:.86rem; color:#b4c0a2; }

/* ---------- Section shell ---------- */
.section{ padding-block:var(--section-y); }
.section-head{ max-width:640px; margin:0 auto clamp(2.4rem,4vw,3.4rem); text-align:center; }
.section-title{ font-size:clamp(1.9rem,1.3rem+2vw,2.9rem); }
.section-sub{ margin-top:1rem; color:var(--ink-2); font-size:1.08rem; }

/* ---------- Services ---------- */
.cards{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1.15rem; }
.card{
  background:#fff; border:1px solid var(--line); border-radius:var(--r-lg); padding:1.7rem 1.6rem 1.5rem;
  box-shadow:var(--shadow-sm);
  transition:transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}
.card:hover{ transform:translateY(-6px); box-shadow:var(--shadow); border-color:#cadeb6; }
.card__icon{
  display:grid; place-items:center; width:54px; height:54px; border-radius:15px; margin-bottom:1.1rem;
  color:var(--brand); background:linear-gradient(150deg, var(--sky), var(--aqua-soft));
}
.card:hover .card__icon{ color:var(--aqua-deep); }
.card__title{ font-size:1.24rem; margin-bottom:.5rem; }
.card__title sup{ font-size:.6em; color:var(--muted); }
.card__text{ color:var(--ink-2); font-size:.98rem; margin-bottom:1.1rem; }
.card__link{ display:inline-flex; align-items:center; font-weight:600; color:var(--brand); font-size:.95rem; }
.card__link span{ transition:transform .2s ease; display:inline-block; }
.card__link:hover span{ transform:translateX(4px); }

/* ---------- About ---------- */
.about{ background:linear-gradient(180deg,#fff, var(--sky-2)); }
.about__grid{ display:grid; grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr); gap:clamp(2rem,5vw,4.5rem); align-items:center; }
.about__media{ position:relative; min-width:0; }
.about__frame{
  border-radius:var(--r-xl); overflow:hidden; box-shadow:var(--shadow-lg); border:6px solid #fff;
  aspect-ratio:9/10; background:var(--sky);
}
.about__frame img{ width:100%; height:100%; object-fit:cover; }
.about__quote{
  position:absolute; right:-12px; bottom:-26px; max-width:270px;
  background:var(--brand); color:#fff; padding:1.1rem 1.2rem; border-radius:18px;
  box-shadow:var(--shadow);
}
.about__quote svg{ color:var(--aqua); opacity:.9; margin-bottom:.3rem; }
.about__quote p{ font-size:.95rem; line-height:1.5; }
.about__text{ color:var(--ink-2); margin-bottom:1rem; font-size:1.06rem; }
.about__text em{ color:var(--ink); font-style:italic; }
.checklist{ list-style:none; padding:0; margin:1.4rem 0 1.8rem; display:grid; gap:.7rem; }
.checklist li{ position:relative; padding-left:2rem; color:var(--ink); font-weight:500; }
.checklist li::before{
  content:"✓"; position:absolute; left:0; top:0;
  width:1.4rem; height:1.4rem; display:grid; place-items:center; border-radius:50%;
  background:var(--aqua-soft); color:var(--aqua-deep); font-size:.8rem; font-weight:800;
}

/* ---------- Experience ---------- */
.experience__grid{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:clamp(2rem,5vw,4.5rem); align-items:center; }
.experience__media{ min-width:0; }
.experience__media img{ border-radius:var(--r-xl); box-shadow:var(--shadow-lg); border:6px solid #fff; aspect-ratio:4/3; object-fit:cover; width:100%; }
.feature-list{ display:grid; gap:1.3rem; margin-top:1.9rem; }
.feature{ display:flex; gap:1rem; align-items:flex-start; }
.feature__ico{ flex:none; display:grid; place-items:center; width:44px; height:44px; border-radius:12px; background:var(--sky); color:var(--brand); }
.feature h3{ font-size:1.1rem; margin-bottom:.2rem; }
.feature p{ color:var(--ink-2); font-size:.98rem; }

/* ---------- Reviews ---------- */
.reviews{ background:linear-gradient(180deg,var(--sky-2),#fff); }
.reviews__grid{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1.15rem; }
.review{
  margin:0; background:#fff; border:1px solid var(--line); border-radius:var(--r-lg); padding:1.7rem 1.6rem;
  box-shadow:var(--shadow-sm); display:flex; flex-direction:column;
}
.review blockquote{ margin:.8rem 0 1.3rem; font-size:1.02rem; color:var(--ink); line-height:1.55; }
.review__by{ display:flex; align-items:center; gap:.75rem; margin-top:auto; }
.review__by img{ width:46px; height:46px; border-radius:50%; object-fit:cover; }
.review__by strong{ display:block; font-size:.95rem; }
.review__loc{ display:block; font-size:.82rem; color:var(--muted); }
.reviews__cta{ text-align:center; margin-top:2rem; }

/* ---------- Financing ---------- */
.finance__grid{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1.15rem; }
.finance__card{
  background:#fff; border:1px solid var(--line); border-radius:var(--r-lg); padding:1.7rem 1.6rem;
  box-shadow:var(--shadow-sm);
  transition:transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}
.finance__card:hover{ transform:translateY(-6px); box-shadow:var(--shadow); border-color:#cadeb6; }
.finance__icon{ display:grid; place-items:center; width:50px; height:50px; border-radius:14px; margin-bottom:1.1rem; color:var(--brand); background:linear-gradient(150deg, var(--sky), var(--aqua-soft)); }
.finance__card:hover .finance__icon{ color:var(--aqua-deep); }
.finance__card h3{ font-size:1.3rem; margin-bottom:.5rem; }
.finance__card p{ color:var(--ink-2); font-size:.98rem; margin-bottom:1rem; }

/* ---------- CTA band ---------- */
.cta-band{ background:linear-gradient(120deg, var(--brand-strong), var(--brand) 55%, var(--aqua-deep)); color:#fff; }
.cta-band__inner{
  display:flex; align-items:center; justify-content:space-between; gap:2rem; flex-wrap:wrap;
  padding-block:clamp(2.6rem,5vw,3.8rem);
}
.cta-band__text h2{ color:#fff; font-size:clamp(1.7rem,1.2rem+1.6vw,2.4rem); }
.cta-band__text p{ margin-top:.5rem; color:rgba(255,255,255,.85); }
.cta-band__actions{ display:flex; gap:.85rem; flex-wrap:wrap; }

/* ---------- Contact ---------- */
.contact__grid{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.05fr); gap:clamp(2rem,5vw,4rem); align-items:start; }
.contact__list{ list-style:none; padding:0; margin:2rem 0 0; display:grid; gap:1.3rem; }
.contact__list li{ display:flex; gap:1rem; align-items:flex-start; }
.contact__ico{ flex:none; display:grid; place-items:center; width:44px; height:44px; border-radius:12px; background:var(--sky); color:var(--brand); }
.contact__list a:hover{ color:var(--brand); }
.contact__hours{ line-height:1.7; }

.contact__form-wrap{
  background:#fff; border:1px solid var(--line); border-radius:var(--r-xl);
  box-shadow:var(--shadow); padding:clamp(1.4rem,3vw,2.2rem);
}
.form__title{ font-size:1.35rem; margin-bottom:1.2rem; }
.field{ margin-bottom:1rem; display:flex; flex-direction:column; }
.field-row{ display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
.field label{ font-size:.85rem; font-weight:600; color:var(--ink-2); margin-bottom:.4rem; }
.field input, .field select, .field textarea{
  font-family:inherit; font-size:1rem; color:var(--ink);
  padding:.8rem .9rem; border:1.5px solid var(--line); border-radius:12px; background:var(--sky-2);
  transition:border-color .18s ease, box-shadow .18s ease, background .18s ease;
  width:100%;
}
.field input:focus, .field select:focus, .field textarea:focus{
  outline:none; border-color:var(--brand-2); background:#fff; box-shadow:var(--ring);
}
.field textarea{ resize:vertical; }
.form__note{ margin-top:1rem; padding:.8rem 1rem; border-radius:12px; background:var(--aqua-soft); color:var(--aqua-deep); font-weight:600; font-size:.95rem; }
.form__fineprint{ margin-top:1rem; font-size:.85rem; color:var(--muted); text-align:center; }
.form__fineprint a{ color:var(--brand); font-weight:600; }

.contact__map{ margin-top:clamp(2rem,4vw,3rem); border-radius:var(--r-xl); overflow:hidden; box-shadow:var(--shadow); border:6px solid #fff; }
.contact__map iframe{ display:block; width:100%; height:380px; border:0; filter:saturate(1.05); }

/* ---------- Footer ---------- */
.footer{ background:var(--ink); color:#c2cdb4; padding-top:clamp(3rem,5vw,4.5rem); }
.footer__grid{ display:grid; grid-template-columns:1.6fr 1fr 1fr 1.2fr; gap:2.4rem; padding-bottom:2.8rem; }
.brand--footer .brand__name{ color:#fff; }
.brand--footer .brand__dds{ color:var(--aqua); }
.footer__blurb{ margin:1.1rem 0 1.3rem; font-size:.94rem; max-width:36ch; color:#aab79a; }
.footer__social{ display:flex; gap:.6rem; }
.footer__social a{ display:grid; place-items:center; width:40px; height:40px; border-radius:11px; background:rgba(255,255,255,.07); color:#dce6ce; transition:background .2s ease, color .2s ease, transform .2s ease; }
.footer__social a:hover{ background:var(--aqua); color:#08331d; transform:translateY(-2px); }
.footer__col h4{ color:#fff; font-size:1rem; margin-bottom:1.1rem; font-family:var(--font-body); font-weight:700; letter-spacing:.01em; }
.footer__col a{ display:block; padding:.32rem 0; font-size:.94rem; color:#b4c0a2; transition:color .18s ease; }
.footer__col a:hover{ color:#fff; }
.footer__contact p{ font-size:.94rem; color:#b4c0a2; margin-top:.4rem; }
.footer__hours{ color:#97a585!important; }
.footer__bottom{
  display:flex; align-items:center; justify-content:space-between; gap:1rem; flex-wrap:wrap;
  border-top:1px solid rgba(255,255,255,.1); padding-block:1.4rem; font-size:.85rem; color:#97a585;
}
.footer__legal{ display:flex; align-items:center; gap:1.3rem; flex-wrap:wrap; }
.footer__legal a:hover{ color:#fff; }
.footer__credit{ color:#93a37d; }

/* ---------- Reveal animation ---------- */
.reveal{ opacity:0; transform:translateY(22px); transition:opacity .7s cubic-bezier(.16,1,.3,1), transform .7s cubic-bezier(.16,1,.3,1); }
.reveal.is-in{ opacity:1; transform:none; }

/* ---------- Responsive ---------- */
@media (max-width: 960px){
  .nav, .header__cta{ display:none; }
  .hamburger{ display:flex; }
  .hero__inner{ grid-template-columns:minmax(0,1fr); gap:2.5rem; }
  .hero__media{ max-width:440px; margin-inline:auto; width:100%; }
  .hero__lead{ max-width:52ch; }
  .about__grid, .experience__grid, .contact__grid{ grid-template-columns:minmax(0,1fr); }
  .experience__media{ order:-1; }
  .cards, .reviews__grid, .finance__grid{ grid-template-columns:minmax(0,1fr) minmax(0,1fr); }
  .footer__grid{ grid-template-columns:1fr 1fr; gap:2rem 1.5rem; }
  .footer__brand{ grid-column:1 / -1; }
}
@media (max-width: 620px){
  .utility{ font-size:.76rem; }
  .utility__inner{ gap:.6rem; min-height:36px; }
  .utility__right{ gap:.9rem; }
  .utility__espanol{ display:none; }
  .stats__grid{ grid-template-columns:1fr 1fr; gap:1.4rem .5rem; }
  .stat:nth-child(3)::before, .stat:nth-child(2)::before{ display:none; }
  .stat + .stat::before{ display:none; }
  .cards, .reviews__grid, .finance__grid{ grid-template-columns:1fr; }
  .field-row{ grid-template-columns:1fr; }
  .footer__grid{ grid-template-columns:1fr; }
  .footer__bottom{ justify-content:flex-start; }
  .hero__frame{ rotate:0deg; }
  .seal{ width:104px; height:104px; left:-14px; }
  .cta-band__inner{ flex-direction:column; align-items:flex-start; }
}

/* ---------- Reduced motion ---------- */
@media (prefers-reduced-motion: reduce){
  .reveal{ opacity:1; transform:none; transition:none; }
  .seal svg > text, .seal__text{ animation:none; }
  .btn:hover, .card:hover, .finance__card:hover, .footer__social a:hover{ transform:none; }
  .faq-a{ transition:none; }
  *{ scroll-behavior:auto!important; }
}

/* =========================================================
   INTERIOR PAGES — shared components
   ========================================================= */

/* review initials avatar (replaces stock photo) */
.review__avatar{
  flex:none; display:grid; place-items:center; width:46px; height:46px; border-radius:50%;
  background:linear-gradient(150deg, var(--brand-2), var(--brand)); color:#fff;
  font-family:var(--font-body); font-weight:700; font-size:.95rem; letter-spacing:.02em;
}

/* ---- Page hero / banner ---- */
.page-hero{
  position:relative; overflow:hidden;
  background:linear-gradient(180deg, var(--sky) 0%, var(--sky-2) 70%, #fff 100%);
  padding-top:clamp(2.6rem,5vw,4rem); padding-bottom:clamp(2.6rem,5vw,4rem);
  border-bottom:1px solid var(--line-soft);
}
.page-hero::after{
  content:""; position:absolute; right:-60px; top:-60px; width:280px; height:280px; border-radius:50%;
  background:radial-gradient(circle at 30% 30%, rgba(46,155,94,.12), transparent 70%); pointer-events:none;
}
.page-hero__inner{ position:relative; z-index:1; max-width:760px; }
.crumbs{ font-size:.82rem; color:var(--muted); font-weight:600; margin-bottom:1rem; letter-spacing:.01em; }
.crumbs a{ color:var(--brand); }
.crumbs a:hover{ text-decoration:underline; }
.crumbs span[aria-current]{ color:var(--ink-2); }
.page-hero__eyebrow{ font-family:var(--font-body); font-weight:700; font-size:.78rem; letter-spacing:.14em; text-transform:uppercase; color:var(--brand); margin-bottom:.8rem; }
.page-hero__title{ font-size:clamp(2.1rem,1.4rem+2.6vw,3.4rem); line-height:1.1; }
.page-hero__sub{ margin-top:1rem; font-size:1.12rem; color:var(--ink-2); max-width:60ch; }

/* ---- Document layout: sidebar + article ---- */
.doc{ display:grid; grid-template-columns:minmax(0,250px) minmax(0,1fr); gap:clamp(2rem,4vw,3.4rem); align-items:start; }
.side-nav{ position:sticky; top:96px; }
.side-nav__title{ font-family:var(--font-body); font-weight:700; font-size:.78rem; letter-spacing:.12em; text-transform:uppercase; color:var(--muted); margin:0 0 .8rem .9rem; }
.side-nav ul{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:.15rem; }
.side-nav a{
  display:block; padding:.62rem .9rem; border-radius:10px; font-weight:600; font-size:.95rem; color:var(--ink-2);
  transition:background .16s ease, color .16s ease;
}
.side-nav a:hover{ background:var(--sky); color:var(--brand); }
.side-nav a[aria-current="page"]{ background:var(--brand); color:#fff; font-weight:700; box-shadow:0 8px 16px -9px rgba(15,110,60,.65); }
.side-nav a[aria-current="page"]:hover{ background:var(--brand-strong); color:#fff; }
.side-nav__cta{ margin-top:1.4rem; padding:1.1rem; background:var(--ink); border-radius:var(--r); color:#fff; }
.side-nav__cta p{ font-size:.92rem; color:#cfe0d6; margin-bottom:.8rem; }
.side-nav__cta .btn{ width:100%; }

/* ---- Prose / article ---- */
.prose{ max-width:70ch; }
.prose > * + *{ margin-top:1.15rem; }
.prose p{ color:var(--ink-2); font-size:1.075rem; line-height:1.75; }
.prose h2{ font-size:clamp(1.5rem,1.2rem+1vw,2rem); margin-top:2.6rem; }
.prose h2:first-child, .prose h3:first-child{ margin-top:0; }
.prose h3{ font-size:1.28rem; margin-top:2rem; color:var(--brand-strong); }
.prose h2 + p, .prose h3 + p{ margin-top:.7rem; }
.prose a{ color:var(--brand); font-weight:600; text-decoration:underline; text-underline-offset:2px; text-decoration-color:var(--line); }
.prose a:hover{ text-decoration-color:var(--brand); }
.prose strong{ color:var(--ink); }
.prose ul, .prose ol{ margin-top:1.1rem; padding-left:0; list-style:none; display:grid; gap:.6rem; }
.prose ul li{ position:relative; padding-left:1.9rem; color:var(--ink-2); }
.prose ul li::before{
  content:""; position:absolute; left:0; top:.55em; width:.7rem; height:.7rem; border-radius:3px;
  background:var(--aqua-soft); border:2px solid var(--brand-2); transform:rotate(45deg);
}
.prose ol{ counter-reset:step; }
.prose ol li{ position:relative; padding-left:2.4rem; color:var(--ink-2); counter-increment:step; }
.prose ol li::before{
  content:counter(step); position:absolute; left:0; top:-.05em; width:1.6rem; height:1.6rem; border-radius:50%;
  display:grid; place-items:center; background:var(--brand); color:#fff; font-family:var(--font-body); font-weight:700; font-size:.82rem;
}
.prose blockquote, .callout{
  margin-top:1.6rem; padding:1.2rem 1.4rem 1.2rem 3.3rem; background:var(--aqua-soft);
  border:1px solid #CDDDB8; border-radius:var(--r); color:var(--brand-strong); font-size:1.06rem; position:relative;
}
.prose blockquote::before, .callout::before{
  content:""; position:absolute; left:1.3rem; top:1.35rem; width:1.15rem; height:1.15rem; border-radius:50%;
  background:var(--brand) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23fff' d='M11 7h2v2h-2zm0 4h2v6h-2z'/%3E%3C/svg%3E") center/1.15rem no-repeat;
}
.callout strong{ color:var(--brand-strong); }

/* two-column intro (article + image) */
.lead-split{ display:grid; grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr); gap:clamp(2rem,4vw,3.2rem); align-items:center; }
.lead-split__media img{ border-radius:var(--r-xl); box-shadow:var(--shadow-lg); border:6px solid #fff; aspect-ratio:4/5; object-fit:cover; width:100%; }

/* pill list (e.g., bite problems, quick facts) */
.pills{ list-style:none; padding:0; margin:1.2rem 0 0; display:flex; flex-wrap:wrap; gap:.6rem; }
.pills li{ padding:.5rem 1rem; background:var(--aqua-soft); color:var(--brand-strong); border-radius:999px; font-weight:600; font-size:.92rem; }

/* ---- FAQ accordion ---- */
.faq-list{ max-width:820px; margin-inline:auto; display:grid; gap:.8rem; }
.faq-item{ border:1px solid var(--line); border-radius:var(--r); background:#fff; box-shadow:var(--shadow-sm); overflow:hidden; }
.faq-q{
  width:100%; text-align:left; background:none; border:0; padding:1.15rem 1.3rem; display:flex; align-items:center; gap:1rem;
  font-family:var(--font-display); font-weight:700; font-size:1.08rem; color:var(--ink); line-height:1.35;
}
.faq-q:hover{ color:var(--brand); }
.faq-q__icon{ flex:none; margin-left:auto; width:26px; height:26px; display:grid; place-items:center; border-radius:50%; background:var(--sky); color:var(--brand); transition:transform .25s ease, background .2s ease; }
.faq-q[aria-expanded="true"] .faq-q__icon{ transform:rotate(45deg); background:var(--brand); color:#fff; }
.faq-a{ display:grid; grid-template-rows:0fr; transition:grid-template-rows .32s cubic-bezier(.4,0,.2,1); }
.faq-a__inner{ overflow:hidden; min-height:0; }
.faq-a p{ color:var(--ink-2); padding:0 1.3rem 1.2rem; line-height:1.7; }
.faq-item.is-open .faq-a{ grid-template-rows:1fr; }

/* ---- Resource links ---- */
.res-group{ margin-top:2.4rem; }
.res-group > h2{ font-size:1.35rem; margin-bottom:1rem; }
.res-grid{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1rem; }
.res-card{
  display:block; padding:1.2rem 1.3rem; border:1px solid var(--line); border-radius:var(--r); background:#fff; box-shadow:var(--shadow-sm);
  transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.res-card:hover{ transform:translateY(-4px); box-shadow:var(--shadow); border-color:#cadeb6; }
.res-card h3{ font-size:1.08rem; display:flex; align-items:center; gap:.5rem; }
.res-card h3::after{ content:"↗"; color:var(--brand); font-size:.9em; }
.res-card p{ margin-top:.35rem; color:var(--ink-2); font-size:.95rem; }

/* ---- Blog ---- */
.blog-grid{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1.4rem; }
.post-card{ display:flex; flex-direction:column; border:1px solid var(--line); border-radius:var(--r-lg); background:#fff; box-shadow:var(--shadow-sm); overflow:hidden; transition:transform .2s ease, box-shadow .2s ease; }
.post-card:hover{ transform:translateY(-5px); box-shadow:var(--shadow); }
.post-card__thumb{ aspect-ratio:16/9; background:linear-gradient(140deg, var(--brand), var(--aqua-deep)); position:relative; display:grid; place-items:center; }
.post-card__thumb svg{ width:52px; height:52px; color:rgba(255,255,255,.9); }
.post-card__body{ padding:1.5rem; display:flex; flex-direction:column; flex:1; }
.post-card__meta{ font-size:.8rem; color:var(--muted); font-weight:600; letter-spacing:.04em; text-transform:uppercase; margin-bottom:.6rem; }
.post-card__title{ font-size:1.25rem; line-height:1.25; }
.post-card__excerpt{ margin-top:.7rem; color:var(--ink-2); font-size:.98rem; flex:1; }
.post-card__more{ margin-top:1.1rem; font-weight:600; color:var(--brand); font-size:.95rem; }

/* generic centered narrow section */
.narrow{ max-width:760px; margin-inline:auto; }
.text-center{ text-align:center; }

/* signature signoff */
.signoff{ margin-top:1.6rem; font-family:var(--font-display); font-style:italic; color:var(--brand-strong); font-size:1.2rem; }

/* ---- Interior responsive ---- */
@media (max-width: 900px){
  .doc{ grid-template-columns:1fr; }
  .side-nav{ position:static; }
  .side-nav ul{ flex-flow:row wrap; }
  .side-nav a{ border-left:0; border:1px solid var(--line); }
  .side-nav a[aria-current="page"]{ border-color:var(--brand); }
  .side-nav__cta{ display:none; }
  .lead-split{ grid-template-columns:1fr; }
  .lead-split__media{ order:-1; max-width:420px; }
}
@media (max-width: 620px){
  .res-grid, .blog-grid{ grid-template-columns:1fr; }
}

/* =========================================================
   HOME — real photography, video tour, financing partners
   (added when the practice's own photos replaced stock)
   ========================================================= */

/* ---- Header: real logo lockup ---- */
.brand__logo{ height:46px; width:auto; display:block; }
.brand__logo--footer{ height:40px; }
.brand--footer{ margin-bottom:1.1rem; }

/* ---- About: floating Patients' Choice credential ---- */
.about__badge{
  position:absolute; top:-16px; left:-16px; z-index:2;
  width:88px; height:auto;
  filter:drop-shadow(0 12px 22px rgba(30,44,22,.24));
}

/* ---- Step inside (video + gallery) ---- */
.inside{ background:var(--sky-2); }

.video-frame{
  position:relative; max-width:920px; margin:0 auto clamp(2.2rem,4vw,3.2rem);
  aspect-ratio:16/9; border-radius:var(--r-xl); overflow:hidden;
  border:6px solid #fff; box-shadow:var(--shadow-lg); background:var(--ink);
}
.video-frame iframe{ position:absolute; inset:0; width:100%; height:100%; border:0; display:block; }
.video{
  position:absolute; inset:0; width:100%; height:100%;
  padding:0; margin:0; border:0; background:none; cursor:pointer; display:block; overflow:hidden;
}
.video__poster{ width:100%; height:100%; object-fit:cover; transition:transform .6s ease; }
.video::after{
  content:""; position:absolute; inset:0; pointer-events:none;
  background:
    linear-gradient(180deg, rgba(18,28,14,0) 52%, rgba(18,28,14,.55)),
    radial-gradient(closest-side at 50% 44%, rgba(18,28,14,.34), rgba(18,28,14,.08) 62%, transparent);
}
.video:hover .video__poster{ transform:scale(1.04); }
.video__btn{
  position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); z-index:2;
  display:grid; place-items:center; width:82px; height:82px; border-radius:50%;
  color:#fff; background:linear-gradient(180deg, var(--brand-2), var(--brand));
  box-shadow:0 16px 34px -12px rgba(15,110,60,.85), 0 0 0 10px rgba(255,255,255,.18);
  transition:transform .25s ease;
}
.video__btn svg{ margin-left:4px; }
.video:hover .video__btn{ transform:translate(-50%,-50%) scale(1.08); }
.video:focus-visible{ outline:none; }
.video:focus-visible .video__btn{ box-shadow:0 16px 34px -12px rgba(15,110,60,.85), 0 0 0 4px #fff, 0 0 0 8px var(--brand-2); }
.video__label{
  position:absolute; left:50%; bottom:clamp(14px,4%,26px); transform:translateX(-50%); z-index:2;
  color:#fff; font-weight:600; font-size:.95rem; text-shadow:0 2px 10px rgba(0,0,0,.5);
}

.gallery{
  display:grid; grid-template-columns:repeat(4,minmax(0,1fr));
  grid-auto-rows:clamp(8.5rem,13vw,11.5rem); gap:1rem;
}
.gallery__item{
  margin:0; overflow:hidden; border-radius:var(--r-lg);
  border:5px solid #fff; box-shadow:var(--shadow); background:var(--sky);
}
.gallery__item img{ width:100%; height:100%; object-fit:cover; transition:transform .6s cubic-bezier(.2,.7,.2,1); }
.gallery__item:hover img{ transform:scale(1.06); }
.g-a{ grid-column:span 2; grid-row:span 2; }
.g-b{ grid-column:span 2; }

/* ---- Financing: real partners panel ---- */
.finance__partners{
  margin-top:clamp(1.6rem,3.5vw,2.4rem);
  display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);
  gap:clamp(1.6rem,4vw,3rem); align-items:center;
  background:var(--sky-2); border:1px solid var(--line-soft); border-radius:var(--r-xl);
  padding:clamp(1.5rem,3.5vw,2.6rem);
}
.finance__partners-copy h3{ font-size:1.5rem; margin-bottom:.6rem; }
.finance__partners-copy p{ color:var(--ink-2); margin-bottom:1.3rem; }
.finance__logos{ display:flex; align-items:center; flex-wrap:wrap; gap:1.4rem; margin-bottom:1.6rem; }
.finance__logos img{ height:38px; width:auto; }
.finance__partners-media{ margin:0; border-radius:var(--r-lg); overflow:hidden; border:6px solid #fff; box-shadow:var(--shadow); }
.finance__partners-media a{ display:block; }
.finance__partners-media img{ width:100%; height:auto; display:block; transition:transform .5s cubic-bezier(.2,.7,.2,1); }
.finance__partners-media a:hover img{ transform:scale(1.03); }

/* ---- Contact: exterior photo paired with the map ---- */
.contact__visit{
  margin-top:clamp(2rem,4vw,3rem);
  display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:clamp(1.2rem,3vw,1.8rem); align-items:stretch;
}
.contact__photo{
  position:relative; margin:0; border-radius:var(--r-xl); overflow:hidden;
  box-shadow:var(--shadow); border:6px solid #fff; min-height:100%;
}
.contact__photo img{ width:100%; height:100%; object-fit:cover; display:block; }
.contact__photo figcaption{
  position:absolute; left:0; right:0; bottom:0; padding:1.6rem 1.1rem .85rem;
  color:#fff; font-size:.9rem; font-weight:600;
  background:linear-gradient(180deg, transparent, rgba(18,28,14,.66));
}
.contact__visit .contact__map{ margin-top:0; }

@media (max-width: 960px){
  .gallery{ grid-template-columns:repeat(2,minmax(0,1fr)); grid-auto-rows:clamp(9rem,26vw,13rem); }
  .g-a{ grid-column:span 2; grid-row:span 1; }
  .g-b{ grid-column:span 2; }
  .finance__partners{ grid-template-columns:minmax(0,1fr); }
  .finance__partners-media{ order:-1; }
  .contact__visit{ grid-template-columns:minmax(0,1fr); }
  .contact__photo{ aspect-ratio:16/10; min-height:0; }
}
@media (max-width: 620px){
  .brand__logo{ height:38px; }
  .about__badge{ width:70px; top:-10px; left:-8px; }
  .gallery{ gap:.7rem; }
  .video__btn{ width:66px; height:66px; }
}

@media (prefers-reduced-motion: reduce){
  .video__poster, .gallery__item img, .video__btn, .finance__partners-media img{ transition:none; }
  .video:hover .video__poster, .gallery__item:hover img, .finance__partners-media a:hover img{ transform:none; }
}
