:root {
  --brand: #05bdb4;
  --brand-dark: #087c78;
  --ink: #143637;
  --cream: #f3fbfa;
  --warm-gray: #dff3f1;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { color: var(--ink); font-family: "Open Sans", Arial, sans-serif; background: #fff; }
a { color: var(--brand); }
a:hover { color: var(--brand-dark); }

.announcement { background: var(--brand-dark); color: #fff; font-size: .78rem; letter-spacing: .08em; text-transform: uppercase; position: sticky; top: 0; z-index: 1040; height: 36px; padding: 0 !important; }
.announcement > a { width: 100%; height: 100%; align-items: center; }
.announcement a { color: #fff; text-decoration: none; }
.site-header { background: rgba(255,255,255,.97); box-shadow: 0 1px 12px rgba(20,54,55,.08); position: sticky; top: 36px; z-index: 1030; }
.brand { color: var(--ink); font: 700 clamp(1.35rem, 2vw, 1.8rem) "Montserrat", sans-serif; letter-spacing: -.04em; text-decoration: none; white-space: nowrap; }
.brand span { color: var(--brand); }
.nav-link { color: var(--ink); font-weight: 600; font-size: .92rem; }
.nav-link:hover, .nav-link.active { color: var(--brand); }
.btn-brand { background: var(--brand); border-color: var(--brand); color: #fff; font-weight: 700; letter-spacing: .02em; padding: .78rem 1.2rem; }
.btn-brand:hover, .btn-brand:focus { background: var(--brand-dark); border-color: var(--brand-dark); color: #fff; }
.navbar-toggler { border: 0; color: var(--ink); }

.hero { min-height: 45vh; display: grid; place-items: center; position: relative; overflow: hidden; color: #fff; background: #073536; }
.appointment-page .hero { min-height: 22.5vh; }
.hero::before { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(4,47,48,.79), rgba(4,47,48,.4)); z-index: 1; }
.hero .hero-image { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center; }
.hero .container { position: relative; z-index: 2; }
.hero h1 { font: 700 clamp(2.5rem, 5vw, 4.7rem)/1.05 "Montserrat", sans-serif; max-width: 760px; margin-bottom: 1.25rem; }
.hero p { font-size: clamp(1rem, 2vw, 1.28rem); max-width: 590px; }

.section { padding: 5.5rem 0; }
.section-soft { background: var(--cream); }
.eyebrow { color: var(--brand); font-size: .79rem; font-weight: 800; letter-spacing: .15em; text-transform: uppercase; }
.section-title { font: 700 clamp(2rem, 3.5vw, 3rem)/1.12 "Montserrat", sans-serif; color: var(--ink); }
.service-card { height: 100%; padding: 1.8rem; background: #fff; border: 1px solid #c8e9e6; box-shadow: 0 8px 24px rgba(20,54,55,.06); transition: transform .2s ease, box-shadow .2s ease; }
.service-card:hover { transform: translateY(-5px); box-shadow: 0 16px 34px rgba(20,54,55,.13); }
.service-icon { color: var(--brand); font-size: 1.8rem; line-height: 1; }
.service-icon-image { width: 2.1rem; height: 2.1rem; object-fit: contain; }
.service-card h3 { margin: 1rem 0 0; font: 700 1.05rem/1.4 "Montserrat", sans-serif; }
.appointment-panel { background: var(--brand-dark); color: #fff; padding: clamp(2rem, 5vw, 4.5rem); }
.appointment-panel h2 { font: 700 clamp(2rem, 3.5vw, 3rem)/1.12 "Montserrat", sans-serif; }
.appointment-panel .btn { background: #fff; color: var(--brand-dark); border: none; font-weight: 700; padding: .8rem 1.1rem; }
.appointment-panel .btn:hover { background: #ccefeb; }

@media (min-width: 992px) {
  .appointment-panel .btn {
    min-height: 72px;
    display: flex;
    align-items: center;
    justify-content: center;
  }
}

.page-hero { padding: 6.5rem 0 4rem; background: var(--cream); }
.page-hero h1 { font: 700 clamp(2.4rem, 5vw, 4rem)/1.1 "Montserrat", sans-serif; }
.feature-image { width: 100%; height: 100%; min-height: 350px; object-fit: cover; }
.prose { font-size: 1.05rem; line-height: 1.85; }
.prose p + p { margin-top: 1.4rem; }
.newsletter { background: var(--warm-gray); }
.newsletter-form { max-width: 600px; margin: 1.5rem auto 0; }
.newsletter-form .form-control { border: 1px solid #b7dedb; min-height: 50px; }
.form-note { min-height: 1.5rem; color: var(--brand-dark); font-size: .9rem; }
.honeypot { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
.footer { background: #092f30; color: #edfafa; }
.footer a { color: #edfafa; text-decoration: none; }
.footer a:hover { color: #7ee4dd; }
.footer .brand { color: #fff; }
.footer .social a { display: inline-flex; align-items: center; justify-content: center; width: 38px; height: 38px; border: 1px solid rgba(255,255,255,.35); border-radius: 50%; }
.copyright { border-top: 1px solid rgba(255,255,255,.16); color: rgba(255,255,255,.7); font-size: .85rem; }
.footer .copyright > a {
  background: var(--brand);
  color: #fff;
  font-weight: 700;
  letter-spacing: .03em;
  padding: .72rem 1.25rem;
  text-decoration: none;
  transition: background .2s ease;
}
.footer .copyright > a:hover { background: #049b94; color: #fff; }
.footer.py-5 { padding-bottom: 0 !important; }
.showcase-frame { min-height: 620px; border: 1px solid #c8e9e6; width: 100%; }

@media (max-width: 991.98px) {
  .navbar-collapse { padding: .8rem 0 1rem; }
  .nav-link { padding: .65rem 0 !important; }
  .hero::before { background: rgba(4,47,48,.68); }
}

@media (max-width: 575.98px) {
  .site-header .navbar {
    padding-left: 1.5rem !important;
    padding-right: 1.5rem !important;
  }

  .section { padding: 4rem 0; }
  .announcement { font-size: .67rem; }
  .page-hero { padding-top: 4rem; }
}

@media (max-width: 991.98px) {
  .footer .copyright > a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100vw;
    margin: 1.5rem 0 0;
    margin-left: 50% !important;
    padding: 1rem 1.25rem;
    transform: translateX(-50%);
  }
}

@media (min-width: 992px) {
  .footer .copyright { position: relative; }
  .footer .copyright > a {
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
  }
}