/* ============================================================
   VANTAGE NEUROSPINE CENTER — style.css
   Navy · White · Teal  |  Luxury Medical
   ============================================================ */

/* === 1. TOKENS & RESET === */
:root {
  --navy:        #0A1F3D;
  --navy-dark:   #061529;
  --navy-mid:    #122B50;
  --teal:        #0EA5C5;
  --teal-dark:   #0C8FAD;
  --teal-light:  #E0F5FA;
  --teal-xlight: #F0FAFD;
  --gold:        #C9A961;
  --gold-light:  #E8D5A0;
  --white:       #FFFFFF;
  --off-white:   #F4F8FB;
  --gray-100:    #EBF0F5;
  --gray-300:    #CBD5E1;
  --gray-500:    #7A8AA0;
  --gray-700:    #3A4A5C;
  --red:         #C0392B;
  --red-light:   #FDEAEA;
  --text-dark:   #0A1629;
  --text-mid:    #3D4F63;
  --text-light:  #6B7A8D;
  --shadow-sm:   0 2px 8px rgba(10,31,61,.08);
  --shadow-md:   0 8px 32px rgba(10,31,61,.12);
  --shadow-lg:   0 20px 60px rgba(10,31,61,.16);
  --shadow-teal: 0 8px 32px rgba(14,165,197,.22);
  --radius-sm:   8px;
  --radius-md:   16px;
  --radius-lg:   24px;
  --radius-xl:   40px;
  --transition:  all .3s cubic-bezier(.25,.46,.45,.94);
  --font-serif:  'Cormorant Garamond', Georgia, serif;
  --font-sans:   'Inter', system-ui, sans-serif;
}
*,*::before,*::after { box-sizing:border-box; margin:0; padding:0; }
html { scroll-behavior:smooth; font-size:16px; }
body { font-family:var(--font-sans); background:var(--white); color:var(--text-dark); overflow-x:hidden; line-height:1.7; }
img { max-width:100%; height:auto; display:block; }
a { text-decoration:none; color:inherit; }
ul { list-style:none; }
button { cursor:pointer; font-family:inherit; border:none; background:none; }

/* === 2. TYPOGRAPHY === */
h1,h2,h3,h4 { font-family:var(--font-serif); line-height:1.18; }
.section-tag {
  display:inline-flex; align-items:center; gap:10px;
  font-size:.72rem; font-weight:700; letter-spacing:2.5px;
  text-transform:uppercase; color:var(--teal);
  margin-bottom:18px;
}
.section-tag::before {
  content:''; display:block; width:28px; height:2.5px;
  background:var(--teal); border-radius:2px; flex-shrink:0;
}
.section-tag--white { color:rgba(255,255,255,.8); }
.section-tag--white::before { background:rgba(255,255,255,.5); }

.section-title {
  font-size:clamp(1.9rem,3.8vw,2.9rem); font-weight:600;
  color:var(--navy); margin-bottom:14px;
}
.section-title--white { color:var(--white); }
.section-subtitle {
  font-size:1.02rem; color:var(--text-light);
  line-height:1.8; max-width:600px;
}
.section-subtitle--white { color:rgba(255,255,255,.68); }

/* === 3. UTILITIES === */
.container      { max-width:1200px; margin:0 auto; padding:0 24px; }
.container--wide{ max-width:1400px; margin:0 auto; padding:0 32px; }
.section-pad    { padding:96px 0; }
.section-pad--sm{ padding:64px 0; }
.text-center    { text-align:center; }
.mx-auto        { margin-left:auto; margin-right:auto; }

/* Teal accent vertical rule — our signature element */
.teal-rule { border-left:3px solid var(--teal); padding-left:16px; }

/* Buttons */
.btn {
  display:inline-flex; align-items:center; gap:8px;
  padding:13px 30px; border-radius:100px;
  font-size:.88rem; font-weight:600; letter-spacing:.4px;
  transition:var(--transition); white-space:nowrap; border:none; cursor:pointer;
}
.btn--teal    { background:var(--teal); color:var(--white); }
.btn--teal:hover { background:var(--teal-dark); transform:translateY(-2px); box-shadow:var(--shadow-teal); }
.btn--outline { background:transparent; color:var(--white); border:1.5px solid rgba(255,255,255,.45); }
.btn--outline:hover { background:rgba(255,255,255,.08); border-color:var(--white); }
.btn--navy    { background:var(--navy); color:var(--white); }
.btn--navy:hover { background:var(--navy-dark); transform:translateY(-2px); box-shadow:var(--shadow-md); }
.btn--ghost-teal { background:transparent; color:var(--teal); border:1.5px solid var(--teal); }
.btn--ghost-teal:hover { background:var(--teal); color:var(--white); }
.btn--emergency { background:var(--red); color:var(--white); }
.btn--emergency:hover { background:#a93226; transform:translateY(-2px); }

/* Fade-in animation */
.fade-in { opacity:0; transform:translateY(24px); transition:opacity .65s ease, transform .65s ease; }
.fade-in.visible { opacity:1; transform:translateY(0); }
.fade-in-d1 { transition-delay:.1s; }
.fade-in-d2 { transition-delay:.2s; }
.fade-in-d3 { transition-delay:.3s; }
.fade-in-d4 { transition-delay:.4s; }

/* === 4. EMERGENCY BANNER === */
.emergency-banner {
  background:linear-gradient(90deg,#7b0000,var(--red),#7b0000);
  color:var(--white); text-align:center;
  padding:9px 20px; font-size:.82rem; font-weight:600; letter-spacing:.4px;
}
.emergency-banner a { color:#ffd0cc; text-decoration:underline; }
.pulse-dot {
  display:inline-block; width:7px; height:7px;
  background:#fff; border-radius:50%; margin-right:8px;
  animation:pulse 1.5s infinite; vertical-align:middle;
}
@keyframes pulse {
  0%,100% { opacity:1; transform:scale(1); }
  50%      { opacity:.35; transform:scale(.55); }
}

/* === 5. NAVBAR === */
.navbar {
  position:sticky; top:0; z-index:900;
  background:rgba(6,21,41,.96);
  backdrop-filter:blur(20px); -webkit-backdrop-filter:blur(20px);
  border-bottom:1px solid rgba(255,255,255,.06);
  transition:var(--transition);
}
.navbar.scrolled { box-shadow:0 4px 28px rgba(0,0,0,.35); }
.navbar__inner {
  display:flex; align-items:center; justify-content:space-between;
  height:70px;
}
.navbar__brand { display:flex; align-items:center; gap:12px; }
.navbar__logo-img { height:42px; width:auto; }
.navbar__brand-text { display:flex; flex-direction:column; line-height:1.1; }
.navbar__brand-name {
  font-family:var(--font-serif); font-size:1.15rem; font-weight:600;
  color:var(--white); letter-spacing:.2px;
}
.navbar__brand-sub {
  font-size:.62rem; color:var(--teal); letter-spacing:1.8px;
  text-transform:uppercase; font-weight:500;
}
.navbar__nav { display:flex; align-items:center; gap:2px; }
.navbar__nav a {
  font-size:.82rem; font-weight:500;
  color:rgba(255,255,255,.72); padding:8px 13px;
  border-radius:var(--radius-sm); transition:var(--transition);
}
.navbar__nav a:hover, .navbar__nav a.active {
  color:var(--white); background:rgba(255,255,255,.08);
}
.navbar__nav a.active { color:var(--teal); }
.navbar__cta { display:flex; align-items:center; gap:10px; }
.navbar__emergency {
  font-size:.78rem; font-weight:700; color:#ff7b7b;
  padding:7px 14px; border:1.5px solid rgba(255,107,107,.4);
  border-radius:100px; transition:var(--transition);
  display:flex; align-items:center; gap:6px;
}
.navbar__emergency:hover { background:rgba(255,107,107,.1); border-color:#ff7b7b; }
.navbar__book {
  background:var(--teal); color:var(--white);
  padding:9px 22px; border-radius:100px;
  font-size:.82rem; font-weight:700; transition:var(--transition);
}
.navbar__book:hover { background:var(--teal-dark); box-shadow:var(--shadow-teal); }
.navbar__hamburger { display:none; flex-direction:column; gap:5px; padding:8px; }
.navbar__hamburger span { display:block; width:23px; height:2px; background:var(--white); border-radius:2px; transition:var(--transition); }

/* Mobile Menu */
.mobile-menu {
  display:none; position:fixed; inset:0; top:70px; z-index:899;
  background:rgba(6,21,41,.98); backdrop-filter:blur(20px);
  padding:32px 24px; flex-direction:column; gap:8px;
  overflow-y:auto;
}
.mobile-menu.open { display:flex; }
.mobile-menu a {
  color:rgba(255,255,255,.82); font-size:1rem; font-weight:500;
  padding:14px 16px; border-radius:var(--radius-sm);
  border-bottom:1px solid rgba(255,255,255,.06); display:block;
}
.mobile-menu a:hover { color:var(--white); background:rgba(255,255,255,.07); }
.mobile-menu__cta { margin-top:20px; display:flex; flex-direction:column; gap:10px; }

/* === 6. FLOATING BUTTONS === */
.float-buttons { position:fixed; right:20px; bottom:28px; z-index:800; display:flex; flex-direction:column; gap:12px; }
.float-btn {
  width:52px; height:52px; border-radius:50%; display:flex;
  align-items:center; justify-content:center; font-size:1.3rem;
  box-shadow:0 4px 20px rgba(0,0,0,.22); transition:var(--transition);
  cursor:pointer; border:none; position:relative;
}
.float-btn:hover { transform:scale(1.1); }
.float-btn--wa  { background:#25D366; color:#fff; }
.float-btn--call{ background:var(--teal); color:#fff; }
.float-btn__tip {
  position:absolute; right:62px; background:var(--navy-dark); color:#fff;
  font-size:.72rem; font-weight:600; padding:4px 10px; border-radius:6px;
  white-space:nowrap; opacity:0; pointer-events:none; transition:var(--transition);
}
.float-btn:hover .float-btn__tip { opacity:1; }

/* === 7. PAGE HERO (inner pages) === */
.page-hero {
  background:linear-gradient(135deg,var(--navy-dark) 0%,var(--navy-mid) 100%);
  padding:80px 0 70px; position:relative; overflow:hidden;
}
.page-hero::after {
  content:''; position:absolute; inset:0;
  background:
    radial-gradient(ellipse at 80% 50%,rgba(14,165,197,.15) 0%,transparent 60%),
    linear-gradient(rgba(14,165,197,.04) 1px,transparent 1px),
    linear-gradient(90deg,rgba(14,165,197,.04) 1px,transparent 1px);
  background-size:auto,50px 50px,50px 50px; pointer-events:none;
}
.page-hero__content { position:relative; z-index:1; }
.page-hero__crumb {
  display:flex; align-items:center; gap:8px;
  font-size:.78rem; color:rgba(255,255,255,.5);
  margin-bottom:20px;
}
.page-hero__crumb a { color:var(--teal); }
.page-hero__crumb span { color:rgba(255,255,255,.3); }
.page-hero__title {
  font-family:var(--font-serif); font-size:clamp(2rem,4.5vw,3.4rem);
  font-weight:600; color:var(--white); margin-bottom:14px;
}
.page-hero__sub { font-size:1rem; color:rgba(255,255,255,.65); max-width:560px; }

/* === 8. HOMEPAGE HERO === */
.hero {
  min-height:100vh; display:flex; align-items:center;
  background:var(--navy-dark); position:relative; overflow:hidden;
}
.hero__bg {
  position:absolute; inset:0;
  background:
    radial-gradient(ellipse at 70% 50%,rgba(14,165,197,.13) 0%,transparent 55%),
    radial-gradient(ellipse at 10% 80%,rgba(14,165,197,.08) 0%,transparent 40%);
}
.hero__grid-lines {
  position:absolute; inset:0;
  background-image:
    linear-gradient(rgba(14,165,197,.04) 1px,transparent 1px),
    linear-gradient(90deg,rgba(14,165,197,.04) 1px,transparent 1px);
  background-size:60px 60px;
}
.hero__inner {
  display:grid; grid-template-columns:1fr 1fr;
  align-items:center; gap:60px;
  padding:120px 0 80px; position:relative; z-index:2;
}
.hero__eyebrow {
  display:inline-flex; align-items:center; gap:10px;
  background:rgba(14,165,197,.12); border:1px solid rgba(14,165,197,.25);
  border-radius:100px; padding:6px 16px 6px 10px;
  font-size:.72rem; font-weight:700; letter-spacing:2px;
  text-transform:uppercase; color:var(--teal); margin-bottom:28px;
}
.hero__eyebrow-dot { width:6px; height:6px; background:var(--teal); border-radius:50%; animation:pulse 2s infinite; }
.hero__title {
  font-family:var(--font-serif); font-size:clamp(2.6rem,5.5vw,4.4rem);
  font-weight:600; color:var(--white); line-height:1.1; margin-bottom:10px;
}
.hero__title-name { color:var(--teal); display:block; }
.hero__credential {
  display:inline-block; background:rgba(201,169,97,.15);
  border:1px solid rgba(201,169,97,.3); border-radius:100px;
  padding:4px 16px; font-size:.78rem; font-weight:600;
  color:var(--gold); letter-spacing:1px; margin-bottom:22px;
}
.hero__subtitle {
  font-size:1.02rem; color:rgba(255,255,255,.68);
  line-height:1.85; max-width:520px; margin-bottom:38px;
}
.hero__cta { display:flex; flex-wrap:wrap; gap:12px; margin-bottom:56px; }
.hero__stats {
  display:flex; gap:36px; padding-top:40px;
  border-top:1px solid rgba(255,255,255,.1); flex-wrap:wrap;
}
.hero__stat-val {
  font-family:var(--font-serif); font-size:2rem; font-weight:700;
  color:var(--teal); display:block; line-height:1;
}
.hero__stat-lbl {
  font-size:.72rem; color:rgba(255,255,255,.45);
  text-transform:uppercase; letter-spacing:1px; margin-top:4px; display:block;
}

/* Hero photo */
.hero__photo-wrap { position:relative; display:flex; justify-content:center; align-items:center; }
.hero__photo-frame {
  position:relative; border-radius:var(--radius-lg);
  overflow:hidden; max-width:460px; width:100%;
  box-shadow:0 32px 80px rgba(0,0,0,.4), 0 0 0 1px rgba(14,165,197,.25);
}
.hero__photo-frame::before {
  content:''; position:absolute; inset:0; z-index:1;
  background:linear-gradient(to top,rgba(10,31,61,.6) 0%,transparent 50%);
}
.hero__photo { width:100%; aspect-ratio:4/5; object-fit:cover; object-position:center top; transition:opacity .35s ease; }
.hero__photo-badge {
  position:absolute; bottom:24px; left:24px; right:24px; z-index:2;
  background:rgba(6,21,41,.88); backdrop-filter:blur(12px);
  border:1px solid rgba(14,165,197,.25); border-radius:var(--radius-md);
  padding:16px 20px; display:flex; align-items:center; gap:14px;
  text-decoration:none; transition:var(--transition); cursor:pointer;
}
.hero__photo-badge:hover {
  background:rgba(6,21,41,.96); border-color:rgba(14,165,197,.5);
  transform:translateY(-2px);
}
.hero__photo-badge-arrow {
  margin-left:auto; color:var(--teal); font-size:1rem; flex-shrink:0;
  opacity:.7; transition:var(--transition);
}
.hero__photo-badge:hover .hero__photo-badge-arrow { opacity:1; transform:translate(2px,-2px); }
.hero__photo-badge-icon {
  width:42px; height:42px; background:rgba(14,165,197,.15);
  border:1px solid rgba(14,165,197,.3); border-radius:10px;
  display:flex; align-items:center; justify-content:center; font-size:1.1rem; flex-shrink:0;
}
.hero__photo-badge-title { font-size:.82rem; font-weight:700; color:var(--white); display:block; }
.hero__photo-badge-sub   { font-size:.7rem; color:rgba(255,255,255,.45); display:block; }
.hero__teal-ring {
  position:absolute; width:110%; height:110%; left:-5%; top:-5%;
  border-radius:var(--radius-lg); z-index:-1;
  background:linear-gradient(135deg,var(--teal) 0%,transparent 50%);
  opacity:.15;
}

/* === 9. TRUST STRIP === */
.trust-strip { background:var(--off-white); padding:28px 0; border-top:1px solid var(--gray-100); border-bottom:1px solid var(--gray-100); }
.trust-strip__inner { display:flex; align-items:center; justify-content:center; flex-wrap:wrap; gap:28px 48px; }
.trust-item { display:flex; align-items:center; gap:9px; }
.trust-item__icon { color:var(--teal); font-size:1rem; }
.trust-item__text { font-size:.8rem; font-weight:600; color:var(--gray-700); letter-spacing:.3px; }

/* === 10. ABOUT TEASER === */
.about-teaser { background:var(--white); }
.about-teaser__grid { display:grid; grid-template-columns:1fr 1fr; gap:72px; align-items:center; }
.about-teaser__photo { position:relative; }
.about-teaser__img {
  width:100%; aspect-ratio:4/5; object-fit:cover;
  object-position:center top; border-radius:var(--radius-lg);
  box-shadow:var(--shadow-lg);
}
.about-teaser__img-placeholder {
  width:100%; aspect-ratio:4/5;
  background:linear-gradient(135deg,var(--navy-mid),var(--navy));
  border-radius:var(--radius-lg); display:flex; flex-direction:column;
  align-items:center; justify-content:center; color:rgba(255,255,255,.2);
  font-size:4rem;
}
.about-teaser__img-placeholder p { font-family:var(--font-serif); font-size:.9rem; margin-top:12px; color:rgba(255,255,255,.3); }
.about-teaser__photo-accent {
  position:absolute; bottom:-16px; right:-16px; width:80%; height:80%;
  border:2px solid var(--teal); border-radius:var(--radius-lg);
  opacity:.2; z-index:-1;
}
.about-teaser__credentials { display:flex; flex-wrap:wrap; gap:10px; margin-bottom:28px; }
.credential-pill {
  background:var(--teal-light); color:var(--teal-dark);
  border:1px solid rgba(14,165,197,.2); border-radius:100px;
  padding:5px 14px; font-size:.76rem; font-weight:600; letter-spacing:.3px;
}
.about-teaser__bio { font-size:1rem; color:var(--text-mid); line-height:1.85; margin-bottom:16px; }
.about-teaser__list { margin:20px 0 32px; display:flex; flex-direction:column; gap:10px; }
.about-teaser__list li {
  display:flex; align-items:flex-start; gap:10px;
  font-size:.92rem; color:var(--text-mid);
}
.about-teaser__list li::before {
  content:''; width:6px; height:6px; background:var(--teal);
  border-radius:50%; flex-shrink:0; margin-top:8px;
}

/* === 11. SPECIALTIES === */
.specialties { background:var(--off-white); }
.specialties__grid { display:grid; grid-template-columns:repeat(4,1fr); gap:24px; margin-top:56px; }
.spec-card {
  background:var(--white); border-radius:var(--radius-md);
  padding:32px 28px; border:1px solid var(--gray-100);
  box-shadow:var(--shadow-sm); transition:var(--transition);
  position:relative; overflow:hidden;
}
.spec-card::before {
  content:''; position:absolute; top:0; left:0; right:0; height:3px;
  background:var(--teal); transform:scaleX(0); transform-origin:left;
  transition:transform .35s ease;
}
.spec-card:hover { transform:translateY(-6px); box-shadow:var(--shadow-md); }
.spec-card:hover::before { transform:scaleX(1); }
.spec-card__icon { font-size:2.2rem; margin-bottom:18px; }
.spec-card__title { font-family:var(--font-serif); font-size:1.35rem; color:var(--navy); margin-bottom:10px; font-weight:600; }
.spec-card__desc  { font-size:.88rem; color:var(--text-light); line-height:1.75; margin-bottom:20px; }
.spec-card__link  { font-size:.82rem; font-weight:700; color:var(--teal); display:flex; align-items:center; gap:6px; }
.spec-card__link:hover { gap:10px; }

/* === 12. STATS STRIP === */
.stats-strip { background:linear-gradient(135deg,var(--navy-dark),var(--navy-mid)); padding:72px 0; }
.stats-strip__grid { display:grid; grid-template-columns:repeat(4,1fr); gap:0; }
.stats-strip__item {
  text-align:center; padding:24px 20px;
  border-right:1px solid rgba(255,255,255,.08);
}
.stats-strip__item:last-child { border-right:none; }
.stats-strip__val {
  font-family:var(--font-serif); font-size:3rem; font-weight:700;
  color:var(--teal); display:block; line-height:1;
}
.stats-strip__lbl {
  font-size:.78rem; color:rgba(255,255,255,.5);
  text-transform:uppercase; letter-spacing:1.2px; margin-top:8px; display:block;
}

/* === 13. TESTIMONIALS === */
.testimonials { background:var(--white); }
.testimonials__grid { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; margin-top:56px; }
.testimonial-card {
  background:var(--off-white); border-radius:var(--radius-md);
  padding:32px 28px; border:1px solid var(--gray-100);
  border-left:3px solid var(--teal); transition:var(--transition);
}
.testimonial-card:hover { box-shadow:var(--shadow-md); }
.testimonial-card__stars { color:var(--teal); font-size:1rem; letter-spacing:2px; margin-bottom:16px; }
.testimonial-card__text  { font-size:.95rem; color:var(--text-mid); line-height:1.8; margin-bottom:24px; font-style:italic; }
.testimonial-card__author{ display:flex; align-items:center; gap:12px; }
.testimonial-card__avatar{
  width:40px; height:40px; border-radius:50%;
  background:var(--teal-light); display:flex; align-items:center;
  justify-content:center; font-size:1.1rem; flex-shrink:0;
}
.testimonial-card__name   { font-size:.88rem; font-weight:700; color:var(--navy); }
.testimonial-card__detail { font-size:.75rem; color:var(--text-light); }

/* === 14. BLOG CARDS === */
.blog-section { background:var(--off-white); }
.blog-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; margin-top:56px; }
.blog-card {
  background:var(--white); border-radius:var(--radius-md);
  overflow:hidden; box-shadow:var(--shadow-sm);
  border:1px solid var(--gray-100); transition:var(--transition);
  display:flex; flex-direction:column;
}
.blog-card:hover { transform:translateY(-5px); box-shadow:var(--shadow-md); }
.blog-card__img {
  height:180px; background:linear-gradient(135deg,var(--navy-mid),var(--navy));
  display:flex; align-items:center; justify-content:center; font-size:3rem;
  position:relative; overflow:hidden;
}
.blog-card__img img { width:100%; height:100%; object-fit:cover; position:absolute; inset:0; }
.blog-card__body { padding:24px; flex:1; display:flex; flex-direction:column; }
.blog-card__cat  {
  display:inline-block; background:var(--teal-light); color:var(--teal-dark);
  font-size:.68rem; font-weight:700; letter-spacing:1px; text-transform:uppercase;
  padding:3px 10px; border-radius:100px; margin-bottom:12px;
}
.blog-card__title {
  font-family:var(--font-serif); font-size:1.18rem; font-weight:600;
  color:var(--navy); line-height:1.3; margin-bottom:10px;
}
.blog-card__excerpt { font-size:.86rem; color:var(--text-light); line-height:1.75; flex:1; margin-bottom:20px; }
.blog-card__footer { display:flex; justify-content:space-between; align-items:center; }
.blog-card__date   { font-size:.76rem; color:var(--text-light); }
.blog-card__link   { font-size:.82rem; font-weight:700; color:var(--teal); display:flex; align-items:center; gap:4px; }
.blog-card__link:hover { gap:8px; }

/* === 15. CTA SECTION === */
.cta-section { background:linear-gradient(135deg,var(--navy-dark),var(--navy-mid)); padding:80px 0; }
.cta-section__inner { text-align:center; max-width:640px; margin:0 auto; }
.cta-section__title { font-family:var(--font-serif); font-size:clamp(1.8rem,3.5vw,2.6rem); color:var(--white); margin-bottom:14px; font-weight:600; }
.cta-section__sub   { color:rgba(255,255,255,.65); font-size:1rem; margin-bottom:36px; line-height:1.8; }
.cta-section__btns  { display:flex; justify-content:center; flex-wrap:wrap; gap:14px; }

/* === 16. FOOTER === */
.footer { background:var(--navy-dark); padding:64px 0 0; }
.footer__grid { display:grid; grid-template-columns:2fr 1fr 1fr 1.5fr; gap:48px; padding-bottom:48px; border-bottom:1px solid rgba(255,255,255,.07); }
.footer__brand-name { font-family:var(--font-serif); font-size:1.3rem; color:var(--white); font-weight:600; margin-bottom:6px; }
.footer__brand-sub  { font-size:.7rem; color:var(--teal); letter-spacing:1.8px; text-transform:uppercase; margin-bottom:16px; }
.footer__brand-desc { font-size:.86rem; color:rgba(255,255,255,.45); line-height:1.8; margin-bottom:22px; max-width:300px; }
.footer__social { display:flex; gap:10px; }
.footer__social-btn {
  width:36px; height:36px; border-radius:8px;
  background:rgba(255,255,255,.07); color:rgba(255,255,255,.6);
  display:flex; align-items:center; justify-content:center;
  font-size:.9rem; transition:var(--transition);
}
.footer__social-btn:hover { background:var(--teal); color:var(--white); }
.footer__col-title { font-size:.72rem; font-weight:700; letter-spacing:2px; text-transform:uppercase; color:var(--teal); margin-bottom:20px; }
.footer__links { display:flex; flex-direction:column; gap:10px; }
.footer__links a { font-size:.86rem; color:rgba(255,255,255,.45); transition:var(--transition); display:flex; align-items:center; gap:6px; }
.footer__links a:hover { color:var(--white); padding-left:4px; }
.footer__contact-item { display:flex; gap:12px; margin-bottom:16px; }
.footer__contact-icon { color:var(--teal); font-size:1rem; margin-top:2px; flex-shrink:0; }
.footer__contact-label { font-size:.72rem; color:rgba(255,255,255,.35); text-transform:uppercase; letter-spacing:1px; display:block; margin-bottom:2px; }
.footer__contact-val   { font-size:.86rem; color:rgba(255,255,255,.65); }
.footer__contact-val a { color:rgba(255,255,255,.65); }
.footer__contact-val a:hover { color:var(--white); }
.footer__bottom { padding:20px 0; display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:10px; }
.footer__copy   { font-size:.78rem; color:rgba(255,255,255,.28); }
.footer__bottom-links { display:flex; gap:20px; }
.footer__bottom-links a { font-size:.78rem; color:rgba(255,255,255,.28); transition:var(--transition); }
.footer__bottom-links a:hover { color:rgba(255,255,255,.65); }

/* === 17. CONTACT PAGE === */
.contact-section { background:var(--off-white); }
.contact-grid { display:grid; grid-template-columns:1.1fr 1fr; gap:48px; align-items:start; }
.contact-form-wrap { background:var(--white); border-radius:var(--radius-lg); padding:40px; box-shadow:var(--shadow-md); }
.contact-info-wrap { display:flex; flex-direction:column; gap:24px; }
.contact-info-card { background:var(--white); border-radius:var(--radius-md); padding:28px; box-shadow:var(--shadow-sm); }
.contact-info-card h3 { font-family:var(--font-serif); font-size:1.2rem; color:var(--navy); margin-bottom:16px; }
.contact-detail { display:flex; gap:12px; margin-bottom:14px; align-items:flex-start; }
.contact-detail__icon { color:var(--teal); font-size:1.1rem; margin-top:2px; flex-shrink:0; }
.contact-detail__label { font-size:.74rem; color:var(--text-light); text-transform:uppercase; letter-spacing:1px; display:block; margin-bottom:2px; }
.contact-detail__val   { font-size:.92rem; color:var(--text-dark); font-weight:500; }
.contact-detail__val a { color:var(--teal); }
.contact-map  { border-radius:var(--radius-md); overflow:hidden; height:220px; background:var(--gray-100); }
.contact-map iframe { width:100%; height:100%; border:none; display:block; }
.contact-map-card {
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  text-align:center; gap:6px; padding:40px 28px; min-height:200px;
  text-decoration:none; position:relative; overflow:hidden;
  background:
    linear-gradient(135deg, var(--teal-xlight) 0%, var(--off-white) 100%);
  background-image:
    radial-gradient(circle at 80% 20%, rgba(14,165,197,.08) 0%, transparent 50%),
    linear-gradient(rgba(14,165,197,.05) 1px,transparent 1px),
    linear-gradient(90deg,rgba(14,165,197,.05) 1px,transparent 1px);
  background-size: auto, 28px 28px, 28px 28px;
  transition:var(--transition);
}
.contact-map-card:hover { background-color:var(--teal-light); }
.contact-map-card__icon  { font-size:2.4rem; margin-bottom:6px; }
.contact-map-card__title { font-family:var(--font-serif); font-size:1.15rem; color:var(--navy); font-weight:600; }
.contact-map-card__sub   { font-size:.84rem; color:var(--text-light); }
.contact-map-card__arrow {
  position:absolute; top:16px; right:18px; color:var(--teal);
  font-size:1.1rem; opacity:.6; transition:var(--transition);
}
.contact-map-card:hover .contact-map-card__arrow { opacity:1; transform:translate(2px,-2px); }
.emergency-card { background:linear-gradient(135deg,#7b0000,var(--red)); border-radius:var(--radius-md); padding:24px 28px; color:var(--white); }
.emergency-card h3 { font-family:var(--font-serif); font-size:1.3rem; margin-bottom:8px; }
.emergency-card p  { font-size:.88rem; opacity:.8; margin-bottom:16px; }
.emergency-card a  { display:inline-flex; align-items:center; gap:8px; background:rgba(255,255,255,.15); border:1px solid rgba(255,255,255,.3); color:#fff; padding:10px 20px; border-radius:100px; font-size:.86rem; font-weight:700; }
.emergency-card a:hover { background:rgba(255,255,255,.25); }

/* Form styles */
.form-title   { font-family:var(--font-serif); font-size:1.6rem; color:var(--navy); margin-bottom:6px; }
.form-sub     { font-size:.86rem; color:var(--text-light); margin-bottom:32px; }
.form-row     { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.form-group   { margin-bottom:18px; }
.form-label   { display:block; font-size:.78rem; font-weight:600; color:var(--text-dark); letter-spacing:.3px; margin-bottom:6px; }
.form-input, .form-select, .form-textarea {
  width:100%; padding:11px 16px; border-radius:var(--radius-sm);
  border:1.5px solid var(--gray-300); font-family:var(--font-sans);
  font-size:.9rem; color:var(--text-dark); background:var(--off-white);
  transition:var(--transition); outline:none;
}
.form-input:focus, .form-select:focus, .form-textarea:focus {
  border-color:var(--teal); background:var(--white);
  box-shadow:0 0 0 3px rgba(14,165,197,.12);
}
.form-textarea { min-height:110px; resize:vertical; }
.form-submit   { width:100%; padding:15px; font-size:.92rem; }
.form-success  { text-align:center; padding:40px 20px; }
.form-success__icon  { font-size:3rem; margin-bottom:16px; }
.form-success__title { font-family:var(--font-serif); font-size:1.6rem; color:var(--navy); margin-bottom:8px; }
.form-success__sub   { color:var(--text-light); font-size:.92rem; }

/* === 18. SERVICES PAGE === */
.services-tabs { background:var(--off-white); }
.tabs-nav { display:flex; gap:8px; flex-wrap:wrap; margin-bottom:48px; }
.tab-btn {
  padding:9px 22px; border-radius:100px; font-size:.84rem; font-weight:600;
  border:1.5px solid var(--gray-300); color:var(--text-mid);
  background:var(--white); transition:var(--transition); cursor:pointer;
}
.tab-btn.active, .tab-btn:hover { background:var(--teal); color:var(--white); border-color:var(--teal); }
.tab-panel { display:none; }
.tab-panel.active { display:block; }
.services-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
.service-card {
  background:var(--white); border-radius:var(--radius-md); padding:28px;
  border:1px solid var(--gray-100); box-shadow:var(--shadow-sm);
  transition:var(--transition);
}
.service-card:hover { transform:translateY(-4px); box-shadow:var(--shadow-md); border-color:var(--teal-light); }
.service-card__num   { font-size:.72rem; font-weight:700; color:var(--teal); letter-spacing:2px; margin-bottom:10px; }
.service-card__title { font-family:var(--font-serif); font-size:1.25rem; color:var(--navy); margin-bottom:10px; font-weight:600; }
.service-card__desc  { font-size:.87rem; color:var(--text-light); line-height:1.75; margin-bottom:14px; }
.service-card__tag   { display:inline-block; background:var(--teal-light); color:var(--teal-dark); font-size:.68rem; font-weight:700; letter-spacing:1px; text-transform:uppercase; padding:3px 10px; border-radius:100px; }

/* UBE highlight section */
.ube-highlight { background:linear-gradient(135deg,var(--navy-dark),var(--navy-mid)); }
.ube-grid { display:grid; grid-template-columns:1fr 1fr; gap:72px; align-items:center; }
.ube-comparison { margin-top:32px; }
.ube-comparison__row { display:grid; grid-template-columns:1fr 1fr; gap:16px; margin-top:20px; }
.compare-col h4 { font-size:.74rem; font-weight:700; letter-spacing:1.5px; text-transform:uppercase; margin-bottom:14px; padding-bottom:10px; border-bottom:1px solid rgba(255,255,255,.1); }
.compare-col--good h4 { color:var(--teal); }
.compare-col--bad  h4 { color:rgba(255,255,255,.4); }
.compare-item { font-size:.84rem; color:rgba(255,255,255,.7); display:flex; align-items:center; gap:8px; margin-bottom:10px; }
.compare-item--good::before { content:'✓'; color:var(--teal); font-weight:700; }
.compare-item--bad::before  { content:'✗'; color:rgba(255,107,107,.7); font-weight:700; }
.pain-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:20px; }
.pain-card {
  background:var(--white); border-radius:var(--radius-md); padding:24px;
  border:1px solid var(--gray-100); box-shadow:var(--shadow-sm);
  transition:var(--transition); text-align:center;
}
.pain-card:hover { transform:translateY(-4px); box-shadow:var(--shadow-md); }
.pain-card__icon  { font-size:1.8rem; margin-bottom:12px; }
.pain-card__title { font-family:var(--font-serif); font-size:1rem; color:var(--navy); font-weight:600; margin-bottom:6px; }
.pain-card__desc  { font-size:.8rem; color:var(--text-light); line-height:1.65; }

/* === 19. ABOUT PAGE === */
.credentials-section { background:var(--off-white); }
.timeline { position:relative; max-width:700px; }
.timeline::before { content:''; position:absolute; left:20px; top:0; bottom:0; width:2px; background:var(--teal-light); }
.timeline-item { position:relative; padding:0 0 36px 60px; }
.timeline-dot {
  position:absolute; left:12px; top:4px; width:18px; height:18px;
  border-radius:50%; background:var(--teal); border:3px solid var(--white);
  box-shadow:0 0 0 2px var(--teal-light);
}
.timeline-item__year  { font-size:.72rem; font-weight:700; color:var(--teal); letter-spacing:1.5px; text-transform:uppercase; margin-bottom:6px; }
.timeline-item__title { font-family:var(--font-serif); font-size:1.1rem; color:var(--navy); margin-bottom:4px; }
.timeline-item__sub   { font-size:.86rem; color:var(--text-light); }
.membership-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:16px; }
.membership-item {
  background:var(--white); border-radius:var(--radius-sm); padding:16px 20px;
  border:1px solid var(--gray-100); display:flex; align-items:center; gap:12px;
  font-size:.88rem; color:var(--text-mid); font-weight:500;
}
.membership-item::before { content:'🏅'; font-size:1rem; }

/* === 20. BLOG PAGE === */
.blog-page { background:var(--off-white); }
.blog-filters { display:flex; gap:8px; flex-wrap:wrap; margin-bottom:40px; }
.filter-btn {
  padding:7px 20px; border-radius:100px; font-size:.8rem; font-weight:600;
  border:1.5px solid var(--gray-300); color:var(--text-mid);
  background:var(--white); transition:var(--transition); cursor:pointer;
}
.filter-btn.active, .filter-btn:hover { background:var(--teal); color:var(--white); border-color:var(--teal); }
.blog-grid-lg { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
.blog-card-lg .blog-card__img { height:220px; }
.blog-card-featured {
  grid-column:span 3; display:grid; grid-template-columns:1fr 1.4fr;
  background:var(--white); border-radius:var(--radius-md);
  overflow:hidden; box-shadow:var(--shadow-sm); border:1px solid var(--gray-100);
  transition:var(--transition);
}
.blog-card-featured:hover { box-shadow:var(--shadow-md); }
.blog-card-featured__img  { height:100%; min-height:280px; background:linear-gradient(135deg,var(--navy-mid),var(--navy)); display:flex; align-items:center; justify-content:center; font-size:5rem; }
.blog-card-featured__body { padding:36px 40px; display:flex; flex-direction:column; justify-content:center; }
.blog-card-featured__title { font-family:var(--font-serif); font-size:1.7rem; color:var(--navy); line-height:1.25; margin-bottom:14px; font-weight:600; }

/* === 21. BLOG POST PAGE === */
.blog-post { background:var(--white); }
.blog-post__layout { display:grid; grid-template-columns:1fr 320px; gap:60px; align-items:start; }
.blog-post__article {}
.blog-post__header  { margin-bottom:40px; }
.blog-post__meta { display:flex; align-items:center; gap:16px; flex-wrap:wrap; margin-bottom:20px; }
.blog-post__meta-item { font-size:.8rem; color:var(--text-light); display:flex; align-items:center; gap:6px; }
.blog-post__title { font-family:var(--font-serif); font-size:clamp(1.8rem,3.5vw,2.8rem); color:var(--navy); line-height:1.2; margin-bottom:18px; font-weight:600; }
.blog-post__img   { width:100%; aspect-ratio:16/9; background:linear-gradient(135deg,var(--navy-mid),var(--navy)); border-radius:var(--radius-md); margin-bottom:36px; display:flex; align-items:center; justify-content:center; font-size:5rem; overflow:hidden; }
.blog-post__img img { width:100%; height:100%; object-fit:cover; }
.blog-post__body h2 { font-family:var(--font-serif); font-size:1.6rem; color:var(--navy); margin:32px 0 14px; }
.blog-post__body h3 { font-family:var(--font-serif); font-size:1.25rem; color:var(--navy); margin:24px 0 10px; }
.blog-post__body p  { font-size:.97rem; color:var(--text-mid); line-height:1.85; margin-bottom:16px; }
.blog-post__body ul { margin:14px 0 20px 20px; }
.blog-post__body ul li { font-size:.97rem; color:var(--text-mid); line-height:1.8; margin-bottom:8px; }
.blog-post__body blockquote {
  border-left:3px solid var(--teal); padding:16px 24px;
  margin:24px 0; background:var(--teal-xlight); border-radius:0 var(--radius-sm) var(--radius-sm) 0;
  font-style:italic; color:var(--text-mid);
}
.blog-post__sidebar { position:sticky; top:90px; }
.sidebar-card { background:var(--off-white); border-radius:var(--radius-md); padding:28px; margin-bottom:24px; border:1px solid var(--gray-100); }
.sidebar-card h4 { font-family:var(--font-serif); font-size:1.05rem; color:var(--navy); margin-bottom:16px; }
.sidebar-related-item { display:flex; gap:12px; margin-bottom:14px; padding-bottom:14px; border-bottom:1px solid var(--gray-100); }
.sidebar-related-item:last-child { border-bottom:none; margin-bottom:0; padding-bottom:0; }
.sidebar-related-item__icon { width:40px; height:40px; background:var(--teal-light); border-radius:var(--radius-sm); display:flex; align-items:center; justify-content:center; font-size:1.1rem; flex-shrink:0; }
.sidebar-related-item__title { font-size:.84rem; color:var(--navy); font-weight:600; line-height:1.35; }
.sidebar-related-item__cat   { font-size:.72rem; color:var(--text-light); margin-top:3px; }

/* === 21B. AREAS SERVED PAGE === */
.area-group { margin-bottom:44px; }
.area-group__title { font-family:var(--font-serif); font-size:1.3rem; color:var(--navy); font-weight:600; margin-bottom:6px; }
.area-group__note { font-size:.86rem; color:var(--text-light); margin-bottom:14px; }
.area-group__chips { display:flex; flex-wrap:wrap; gap:8px; }
.area-chip {
  display:inline-block; background:var(--white); color:var(--text-mid);
  border:1px solid var(--gray-300); border-radius:100px;
  padding:6px 16px; font-size:.82rem; font-weight:500;
  text-decoration:none; transition:var(--transition);
}
.area-chip:not(.area-chip--static):hover { background:var(--teal); color:var(--white); border-color:var(--teal); }
.area-chip--static { cursor:default; color:var(--text-light); }

/* === 21C. GALLERY CAROUSEL === */
.gallery-carousel {
  position:relative; max-width:780px; margin:48px auto 0;
  border-radius:var(--radius-lg); overflow:hidden;
  box-shadow:var(--shadow-lg); background:var(--navy-dark);
}
.gallery-carousel--compact { max-width:600px; margin-top:36px; }
.gallery-carousel__track {
  position:relative; width:100%; aspect-ratio:16/10;
  overflow:hidden;
}
.gallery-carousel--compact .gallery-carousel__track { aspect-ratio:4/3; }
.gallery-slide {
  position:absolute; inset:0; opacity:0; transition:opacity .6s ease;
  pointer-events:none;
}
.gallery-slide.active { opacity:1; pointer-events:auto; }
.gallery-slide img { width:100%; height:100%; object-fit:cover; }
.gallery-slide__caption {
  position:absolute; bottom:0; left:0; right:0;
  background:linear-gradient(to top, rgba(6,21,41,.92), transparent);
  padding:32px 24px 18px; color:var(--white);
}
.gallery-slide__category {
  display:inline-block; background:rgba(14,165,197,.2); border:1px solid rgba(14,165,197,.4);
  color:var(--teal); font-size:.68rem; font-weight:700; letter-spacing:1.5px; text-transform:uppercase;
  padding:3px 12px; border-radius:100px; margin-bottom:8px;
}
.gallery-slide__text { font-size:.92rem; font-weight:500; line-height:1.4; }
.gallery-carousel__arrow {
  position:absolute; top:50%; transform:translateY(-50%);
  width:40px; height:40px; border-radius:50%;
  background:rgba(255,255,255,.15); backdrop-filter:blur(8px);
  border:1px solid rgba(255,255,255,.25); color:var(--white);
  font-size:1.4rem; display:flex; align-items:center; justify-content:center;
  cursor:pointer; z-index:5; transition:var(--transition);
}
.gallery-carousel__arrow:hover { background:rgba(255,255,255,.28); }
.gallery-carousel__arrow--prev { left:14px; }
.gallery-carousel__arrow--next { right:14px; }
.gallery-carousel__dots {
  position:absolute; bottom:14px; left:0; right:0; z-index:5;
  display:flex; justify-content:center; gap:7px;
}
.gallery-dot {
  width:7px; height:7px; border-radius:50%; background:rgba(255,255,255,.35);
  border:none; cursor:pointer; transition:var(--transition); padding:0;
}
.gallery-dot.active { background:var(--teal); width:20px; border-radius:4px; }

/* === 22. RESPONSIVE === */
@media (max-width: 1100px) {
  .specialties__grid { grid-template-columns:repeat(2,1fr); }
  .footer__grid      { grid-template-columns:1fr 1fr; }
  .blog-post__layout { grid-template-columns:1fr; }
  .blog-post__sidebar{ position:static; }
}
@media (max-width: 900px) {
  #galleryGrid { grid-template-columns:repeat(3,1fr) !important; }
  #areasGrid { grid-template-columns:repeat(3,1fr) !important; }
  #homeGalleryTeaser { grid-template-columns:repeat(4,1fr) !important; }
  .hero__inner         { grid-template-columns:1fr; gap:40px; padding:100px 0 60px; }
  .hero__photo-wrap    { order:-1; }
  .hero__photo-frame   { max-width:380px; margin:0 auto; }
  .about-teaser__grid  { grid-template-columns:1fr; gap:40px; }
  .contact-grid        { grid-template-columns:1fr; }
  .ube-grid            { grid-template-columns:1fr; gap:40px; }
  .stats-strip__grid   { grid-template-columns:repeat(2,1fr); }
  .stats-strip__item   { border-bottom:1px solid rgba(255,255,255,.08); }
  .testimonials__grid  { grid-template-columns:1fr 1fr; }
  .blog-grid           { grid-template-columns:1fr 1fr; }
  .blog-card-featured  { grid-column:span 2; }
  .navbar__nav         { display:none; }
  .navbar__cta         { display:none; }
  .navbar__hamburger   { display:flex; }
  .services-grid       { grid-template-columns:repeat(2,1fr); }
  .pain-grid           { grid-template-columns:repeat(2,1fr); }
  .blog-grid-lg        { grid-template-columns:repeat(2,1fr); }
  .blog-card-featured  { grid-column:span 2; grid-template-columns:1fr; }
  .membership-grid     { grid-template-columns:1fr; }
}
/* === STICKY MOBILE CTA BAR (Contact page) === */
.sticky-cta-bar { display:none; }
@media (max-width: 768px) {
  .sticky-cta-bar {
    display:flex; position:fixed; bottom:0; left:0; right:0; z-index:950;
    background:var(--navy-dark); border-top:1px solid rgba(255,255,255,.08);
    padding:10px 16px calc(10px + env(safe-area-inset-bottom));
    gap:10px; box-shadow:0 -6px 24px rgba(0,0,0,.3);
  }
  .sticky-cta-bar .btn { flex:1; justify-content:center; padding:13px 16px; }
  body#page-contact .float-buttons { display:none; }
  body#page-contact { padding-bottom:64px; }
}

@media (max-width: 600px) {
  #galleryGrid { grid-template-columns:repeat(2,1fr) !important; }
  #aboutGalleryTeaser { grid-template-columns:repeat(2,1fr) !important; }
  #areasGrid { grid-template-columns:repeat(2,1fr) !important; }
  #homeGalleryTeaser { grid-template-columns:repeat(2,1fr) !important; }
  .section-pad       { padding:64px 0; }
  .hero__stats       { gap:24px; }
  .hero__title       { font-size:2.4rem; }
  .specialties__grid { grid-template-columns:1fr; }
  .stats-strip__grid { grid-template-columns:1fr 1fr; }
  .testimonials__grid{ grid-template-columns:1fr; }
  .blog-grid         { grid-template-columns:1fr; }
  .blog-card-featured{ grid-column:span 1; grid-template-columns:1fr; }
  .footer__grid      { grid-template-columns:1fr; }
  .form-row          { grid-template-columns:1fr; }
  .services-grid     { grid-template-columns:1fr; }
  .pain-grid         { grid-template-columns:1fr 1fr; }
  .blog-grid-lg      { grid-template-columns:1fr; }
}
@media (prefers-reduced-motion: reduce) {
  .fade-in, .btn, .spec-card, .blog-card { transition:none !important; animation:none !important; }
  .fade-in { opacity:1; transform:none; }
}