/* ==========================================================================
   Declaration Dental additions (on top of the shared Village-derived layout)
   ========================================================================== */

/* Logo is a two-line lockup (about 2.4:1), so size it by height */
.site-logo { width: auto; height: 62px; }
.site-header__inner { min-height: var(--header-h); }
@media (max-width: 1179px) { .site-logo { height: 54px; width: auto; } }
@media (max-width: 767px)  { .site-logo { height: 48px; width: auto; } }
.footer-logo { width: min(100%, 300px); height: auto; }
.hero__video { object-position: 50% 55%; }
/* Hero headline is three stacked lines; only "Healthy Smiles." is tan italic (inline on line 3) */
.hero__line { display: block; }
.hero__title-em--inline { display: inline; }

/* Services: numbered editorial tiles (no stock photography needed) */
.service-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.service-card .card-link {
  display: flex; flex-direction: column; height: 100%;
  padding: clamp(22px, 2.2vw, 32px);
  background: var(--vd-white); border: 1px solid var(--vd-line); border-radius: var(--radius-md);
  transition: border-color var(--dur) var(--ease), box-shadow var(--dur) var(--ease), transform var(--dur) var(--ease);
}
.service-card .card-link:hover { border-color: var(--vd-taupe-500); box-shadow: var(--shadow-soft); transform: translateY(-3px); }
.service-num {
  display: block; margin-bottom: clamp(28px, 4vw, 56px);
  font-family: var(--font-serif); font-style: italic; font-size: 2.25rem; line-height: 1; color: var(--vd-taupe-500);
}
.service-card .card-title { flex: none; margin: 0; border: 0; padding: 0; }
.service-card__text { margin: 0.8rem 0 0; font-size: 1rem; line-height: 1.6; color: var(--color-text-muted); }

/* Services sits on the same blue as the FAQ: light heading/intro/chips, white tiles stay white */
.services { background: var(--vd-blue-700); color: var(--vd-ivory-100); }
.services .section-head h2 { color: var(--vd-ivory-100); }
.services .section-head p { color: rgba(253, 246, 238, 0.9); }
.services .service-card .card-link { border-color: transparent; }
.services .service-card .card-link:hover { border-color: var(--vd-taupe-300); box-shadow: 0 24px 44px -26px rgba(0, 0, 0, 0.55); }
.services .service-links a { background: transparent; border-color: rgba(253, 246, 238, 0.45); color: var(--vd-ivory-100); }
.services .service-links a:hover { background: rgba(253, 246, 238, 0.14); border-color: var(--vd-ivory-100); color: var(--vd-white); }

/* Smile center before / after */
.smile__pair { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(16px, 2vw, 28px); }
.smile__pair figure { position: relative; margin: 0; overflow: hidden; border-radius: var(--radius-md); background: var(--vd-ivory-200); }
.smile__pair img { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; }
.smile__pair figcaption {
  position: absolute; left: 14px; bottom: 14px; padding: 5px 14px;
  font-size: var(--fs-label); letter-spacing: 0.14em; text-transform: uppercase; font-weight: 500;
  background: rgba(253, 246, 238, 0.94); color: var(--vd-blue-900); border-radius: 2px;
}

/* Team */
.team-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: clamp(18px, 2.2vw, 32px); }
.team-card .card-link { display: block; }
.team-card .card-media { aspect-ratio: 4 / 4.6; }
.team-card .card-media img { object-position: 50% 22%; }
.team-card__name { margin: 1rem 0 0.1rem; font-family: var(--font-serif); font-weight: 500; font-size: 1.625rem; line-height: 1.15; color: var(--vd-blue-900); }
.team-card__role { margin: 0; font-size: var(--fs-small); letter-spacing: 0.08em; text-transform: uppercase; color: var(--vd-taupe-700); }

.card-media--soft { background: var(--vd-white); border: 1px solid var(--vd-line); }
.card-media--soft img { object-fit: contain; padding: 6%; }

/* Contact (no web form on the live site: phone, address, hours instead) */
.contact-list { display: grid; gap: 1.4rem; margin: 1.6rem 0 1.8rem; padding: 0; list-style: none; }
.contact-list li { display: grid; gap: 0.4rem; }
.contact-list__label { font-size: var(--fs-label); letter-spacing: 0.14em; text-transform: uppercase; font-weight: 500; color: var(--vd-taupe-700); }
.contact-list__big { font-family: var(--font-serif); font-size: clamp(2rem, 1.5rem + 1.6vw, 2.75rem); line-height: 1.1; color: var(--vd-blue-900); text-decoration: none; }
.contact-list__note { font-size: var(--fs-small); color: var(--color-text-muted); }
.contact-list a { color: var(--vd-blue-900); }
.contact-actions { display: flex; flex-wrap: wrap; gap: 12px; }
.contact-card__media img { object-position: 50% 30%; }

@media (max-width: 1100px) {
  .service-grid, .team-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
  .smile__pair { grid-template-columns: 1fr; }
  .team-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
  .service-grid { grid-template-columns: 1fr; }
  .service-num { margin-bottom: 20px; }
}