/*
 Theme Name:   DentalClinics.io Child
 Theme URI:    https://dentalclinics.io
 Description:  Child theme for dentalclinics.io — Global Dental Tourism Directory
 Author:       DentalClinics.io
 Template:     generatepress
 Version:      1.0.0
*/

/* ═══════════════════════════════════════════════════
   BRAND TOKENS — dentalclinics.io Brand Kit v1.0
   ═══════════════════════════════════════════════════ */
:root {
  /* Primary Teal Palette */
  --teal-900: #062E24;
  --teal-800: #0A4435;
  --teal-700: #0D5A47;
  --teal-600: #0F6E56;
  --teal-500: #1A8A6E;
  --teal-400: #2BA882;
  --teal-300: #5DCAA5;
  --teal-200: #9FE1CB;
  --teal-100: #C8F0E4;
  --teal-50:  #E8F8F3;

  /* Gold Accent */
  --gold-600: #9A6C00;
  --gold-500: #C9A84C;
  --gold-400: #D9BC72;
  --gold-300: #E8D098;
  --gold-100: #FBF5E6;

  /* Neutrals */
  --ink:     #0E1C17;
  --ink-80:  #2A3831;
  --ink-60:  #4D6059;
  --ink-40:  #7D9089;
  --ink-20:  #B2C0BC;
  --ink-10:  #D8E2DF;
  --ink-05:  #EDF2F0;
  --white:   #FAFCFB;

  /* Semantic */
  --bg-page:    #FAFCFB;
  --bg-section: #F2F7F5;
  --bg-dark:    #0A1F19;

  /* Typography */
  --font-display: 'Playfair Display', Georgia, serif;
  --font-body:    'DM Sans', system-ui, sans-serif;
  --font-mono:    'DM Mono', monospace;

  /* Spacing */
  --radius-sm: 6px;
  --radius-md: 12px;
  --radius-lg: 20px;

  /* Shadows */
  --shadow-sm: 0 2px 8px rgba(10,68,53,.08);
  --shadow-md: 0 8px 32px rgba(10,68,53,.12);
  --shadow-lg: 0 24px 64px rgba(10,68,53,.16);
}

/* ═══════════════════════════════════════════════════
   BASE TYPOGRAPHY
   ═══════════════════════════════════════════════════ */
body {
  font-family: var(--font-body);
  background: var(--bg-page);
  color: var(--ink);
  font-size: 16px;
  line-height: 1.7;
  -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-display);
  color: var(--ink-80);
  line-height: 1.2;
  font-weight: 600;
}

h1 { font-size: clamp(2rem, 4vw, 3rem); margin-bottom: 1rem; }
h2 { font-size: clamp(1.5rem, 3vw, 2.2rem); margin-bottom: .75rem; }
h3 { font-size: clamp(1.2rem, 2.5vw, 1.6rem); margin-bottom: .5rem; }
h4 { font-size: 1.1rem; font-family: var(--font-body); font-weight: 600; }

p { margin-bottom: 1.25rem; color: var(--ink-60); }
a { color: var(--teal-600); text-decoration: none; transition: color .2s; }
a:hover { color: var(--teal-500); }

strong { color: var(--ink-80); font-weight: 600; }

/* ═══════════════════════════════════════════════════
   HEADER & NAVIGATION
   ═══════════════════════════════════════════════════ */
.site-header {
  background: rgba(6,20,16,.97) !important;
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  border-bottom: 1px solid rgba(93,202,165,.12);
  position: sticky;
  top: 0;
  z-index: 100;
}

.site-header .header-inner {
  padding: 0 2rem;
  min-height: 68px;
  display: flex;
  align-items: center;
  gap: 1rem;
}

/* ── Logo ── */
.site-branding {
  display: flex;
  align-items: center;
  gap: .55rem;
  flex-shrink: 0;
}

.site-branding .dc-logo-svg {
  width: 30px;
  height: 30px;
  flex-shrink: 0;
}

.site-branding .site-title,
.site-branding p.site-title {
  margin: 0 !important;
  line-height: 1;
}

.site-branding .site-title a,
.site-title a {
  font-family: var(--font-display) !important;
  font-size: 1.05rem !important;
  font-weight: 700 !important;
  color: #ffffff !important;
  letter-spacing: .015em;
  text-decoration: none;
}

.site-branding .site-title a span,
.site-title a span {
  color: var(--teal-300);
}

.site-description {
  display: none !important;
}

/* ── Tooth logo icon via CSS data-URI ── */
.site-branding .site-title a::before,
p.site-title a::before {
  content: '';
  display: inline-block;
  width: 26px;
  height: 26px;
  margin-right: .5rem;
  vertical-align: middle;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 40 44' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M20 3C13.5 3 9 7.8 9 13.5c0 3.8 1.2 7 2.8 9.5 1.4 2.2 2.4 6.8 3 11.8.2 1.6 1.2 2.7 2.4 2.2.7-.3 1.2-1.4 1.5-3.5.5-3 1.1-5.5 1.8-6.5.4-.6.9-.9 1.5-.9s1.1.3 1.5.9c.7 1 1.3 3.5 1.8 6.5.3 2.1.8 3.2 1.5 3.5 1.2.5 2.2-.6 2.4-2.2.6-5 1.6-9.6 3-11.8 1.6-2.5 2.8-5.7 2.8-9.5C31 7.8 26.5 3 20 3Z' fill='%235DCAA5'/%3E%3Ccircle cx='20' cy='13' r='7.5' stroke='rgba(255%2C255%2C255%2C0.25)' stroke-width='1' fill='none'/%3E%3Cline x1='12.5' y1='13' x2='27.5' y2='13' stroke='rgba(255%2C255%2C255%2C0.25)' stroke-width='1'/%3E%3Cpath d='M20 5.5C17 8 17 18 20 20.5C23 18 23 8 20 5.5Z' stroke='rgba(255%2C255%2C255%2C0.25)' stroke-width='1' fill='none'/%3E%3C/svg%3E");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  flex-shrink: 0;
}

/* ── Nav links — clearly visible white ── */
.main-nav a,
.nav-primary a,
.main-navigation a,
.nav-primary .menu > li > a,
#site-navigation a {
  font-family: var(--font-body) !important;
  font-size: .78rem !important;
  font-weight: 700 !important;
  color: rgba(255,255,255,.82) !important;
  letter-spacing: .05em;
  text-transform: uppercase;
  padding: .45rem .9rem !important;
  transition: color .2s;
}

.main-nav a:hover,
.nav-primary a:hover,
.main-navigation a:hover,
.main-navigation .current-menu-item > a,
#site-navigation .current-menu-item > a {
  color: var(--teal-300) !important;
}

/* ── Active indicator ── */
.main-navigation .current-menu-item > a,
.main-navigation .current-page-ancestor > a {
  color: var(--teal-300) !important;
  position: relative;
}

/* ── Dropdown menus ── */
.main-navigation .sub-menu {
  background: rgba(8,26,20,.98) !important;
  border: 1px solid rgba(93,202,165,.15);
  border-radius: var(--radius-md);
  box-shadow: 0 16px 40px rgba(0,0,0,.4);
  min-width: 200px;
}

.main-navigation .sub-menu a {
  text-transform: none !important;
  font-size: .82rem !important;
  font-weight: 500 !important;
  padding: .6rem 1.2rem !important;
  border-bottom: 1px solid rgba(93,202,165,.06);
  display: block !important;
  text-align: left !important;
  width: 100% !important;
  box-sizing: border-box !important;
}

.main-navigation .sub-menu li:last-child a {
  border-bottom: none;
}

/* ═══════════════════════════════════════════════════
   MOBILE NAV TOGGLE
   ═══════════════════════════════════════════════════ */
.menu-toggle,
button.menu-toggle {
  background: transparent !important;
  border: 1.5px solid rgba(93,202,165,.4) !important;
  color: #fff !important;
  border-radius: var(--radius-sm);
  padding: .4rem .7rem !important;
}

/* ═══════════════════════════════════════════════════
   HERO SECTIONS
   ═══════════════════════════════════════════════════ */
.dc-hero {
  background: var(--bg-dark);
  padding: 5rem 2rem 6rem;
  text-align: center;
  position: relative;
  overflow: hidden;
}

.dc-hero::before {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse 60% 80% at 50% 0%, rgba(43,168,130,.18) 0%, transparent 70%);
  pointer-events: none;
}

.dc-hero-eyebrow {
  font-family: var(--font-mono);
  font-size: .75rem;
  font-weight: 500;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--teal-400);
  margin-bottom: 1.25rem;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: .5rem;
}

.dc-hero-eyebrow::before,
.dc-hero-eyebrow::after {
  content: '';
  display: block;
  width: 32px;
  height: 1px;
  background: var(--teal-600);
}

.dc-hero h1 {
  font-family: var(--font-display);
  font-size: clamp(2.2rem, 5vw, 3.8rem);
  font-weight: 700;
  color: var(--white);
  line-height: 1.15;
  max-width: 800px;
  margin: 0 auto 1.25rem;
}

.dc-hero h1 em {
  font-style: normal;
  color: var(--teal-300);
}

.dc-hero-sub {
  font-size: clamp(1rem, 2vw, 1.2rem);
  color: var(--ink-20);
  max-width: 560px;
  margin: 0 auto 2.5rem;
  line-height: 1.6;
}

.dc-hero-stats {
  display: flex;
  justify-content: center;
  gap: 3rem;
  margin-bottom: 3rem;
  flex-wrap: wrap;
}

.dc-stat {
  text-align: center;
}

.dc-stat-num {
  font-family: var(--font-display);
  font-size: 2.2rem;
  font-weight: 700;
  color: var(--teal-300);
  line-height: 1;
  display: block;
}

.dc-stat-label {
  font-size: .8rem;
  color: var(--ink-40);
  letter-spacing: .04em;
  text-transform: uppercase;
  margin-top: .25rem;
}

/* ═══════════════════════════════════════════════════
   BUTTONS
   ═══════════════════════════════════════════════════ */
.dc-btn,
.wp-block-button__link,
.button {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  padding: .85rem 2rem;
  border-radius: var(--radius-sm);
  font-family: var(--font-body);
  font-size: .9rem;
  font-weight: 600;
  letter-spacing: .01em;
  cursor: pointer;
  transition: all .2s;
  text-decoration: none;
  border: none;
}

.dc-btn-primary {
  background: var(--teal-600);
  color: var(--white) !important;
}

.dc-btn-primary:hover {
  background: var(--teal-500);
  color: var(--white) !important;
  transform: translateY(-1px);
  box-shadow: var(--shadow-md);
}

.dc-btn-gold {
  background: var(--gold-500);
  color: var(--ink) !important;
}

.dc-btn-gold:hover {
  background: var(--gold-400);
  color: var(--ink) !important;
  transform: translateY(-1px);
  box-shadow: var(--shadow-md);
}

.dc-btn-outline {
  background: transparent;
  color: var(--teal-300) !important;
  border: 1.5px solid var(--teal-600);
}

.dc-btn-outline:hover {
  background: rgba(43,168,130,.1);
  color: var(--teal-300) !important;
}

/* WhatsApp CTA */
.dc-btn-wa {
  background: #25D366;
  color: #fff !important;
  font-weight: 700;
}

.dc-btn-wa:hover {
  background: #1ebe5d;
  color: #fff !important;
  transform: translateY(-1px);
  box-shadow: 0 8px 24px rgba(37,211,102,.3);
}

/* Button group */
.dc-btn-group {
  display: flex;
  gap: 1rem;
  flex-wrap: wrap;
  align-items: center;
}

/* ═══════════════════════════════════════════════════
   SECTIONS
   ═══════════════════════════════════════════════════ */
.dc-section {
  padding: 5rem 2rem;
}

.dc-section-alt {
  background: var(--bg-section);
}

.dc-section-dark {
  background: var(--bg-dark);
}

.dc-section-dark h2,
.dc-section-dark h3,
.dc-section-dark p {
  color: var(--white);
}

.dc-container {
  max-width: 1160px;
  margin: 0 auto;
}

.dc-section-label {
  font-family: var(--font-mono);
  font-size: .72rem;
  font-weight: 500;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--teal-600);
  margin-bottom: .75rem;
  display: flex;
  align-items: center;
  gap: .5rem;
}

.dc-section-label::before {
  content: '';
  display: block;
  width: 24px;
  height: 1px;
  background: var(--teal-400);
}

/* ═══════════════════════════════════════════════════
   CARDS
   ═══════════════════════════════════════════════════ */
.dc-card {
  background: var(--white);
  border: 1px solid var(--ink-10);
  border-radius: var(--radius-md);
  padding: 2rem;
  box-shadow: var(--shadow-sm);
  transition: box-shadow .2s, transform .2s;
}

.dc-card:hover {
  box-shadow: var(--shadow-md);
  transform: translateY(-2px);
}

.dc-card-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 1.5rem;
}

.dc-card-icon {
  width: 48px;
  height: 48px;
  background: var(--teal-50);
  border-radius: var(--radius-sm);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.5rem;
  margin-bottom: 1.25rem;
}

.dc-card h3 {
  font-size: 1.1rem;
  margin-bottom: .5rem;
  color: var(--ink-80);
}

.dc-card p {
  font-size: .9rem;
  color: var(--ink-60);
  margin: 0;
}

/* ═══════════════════════════════════════════════════
   CLINIC CARD
   ═══════════════════════════════════════════════════ */
.dc-clinic-card {
  background: var(--white);
  border: 1px solid var(--ink-10);
  border-radius: var(--radius-lg);
  overflow: hidden;
  box-shadow: var(--shadow-sm);
  transition: box-shadow .2s, transform .2s;
}

.dc-clinic-card:hover {
  box-shadow: var(--shadow-md);
  transform: translateY(-3px);
}

.dc-clinic-badge {
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  padding: .3rem .75rem;
  border-radius: 100px;
  font-size: .72rem;
  font-weight: 600;
  letter-spacing: .03em;
  text-transform: uppercase;
}

.dc-badge-dha {
  background: var(--teal-50);
  color: var(--teal-700);
  border: 1px solid var(--teal-100);
}

.dc-badge-featured {
  background: var(--gold-100);
  color: var(--gold-600);
  border: 1px solid var(--gold-300);
}

/* ═══════════════════════════════════════════════════
   PRICE / COMPARISON TABLE
   ═══════════════════════════════════════════════════ */
.dc-price-table {
  width: 100%;
  border-collapse: collapse;
  font-size: .9rem;
  border-radius: var(--radius-md);
  overflow: hidden;
  box-shadow: var(--shadow-sm);
}

.dc-price-table th {
  background: var(--teal-800);
  color: var(--white);
  font-family: var(--font-body);
  font-weight: 600;
  padding: .9rem 1.25rem;
  text-align: left;
  font-size: .8rem;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.dc-price-table td {
  padding: .85rem 1.25rem;
  border-bottom: 1px solid var(--ink-10);
  color: var(--ink-60);
}

.dc-price-table tr:nth-child(even) td {
  background: var(--bg-section);
}

.dc-price-table .dc-price-highlight {
  color: var(--teal-600);
  font-weight: 700;
}

.dc-price-table .dc-price-savings {
  color: var(--gold-600);
  font-weight: 600;
  font-size: .82rem;
}

/* ═══════════════════════════════════════════════════
   TRUST SIGNALS / BADGES
   ═══════════════════════════════════════════════════ */
.dc-trust-bar {
  background: var(--teal-900);
  padding: 1.25rem 2rem;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 3rem;
  flex-wrap: wrap;
}

.dc-trust-item {
  display: flex;
  align-items: center;
  gap: .6rem;
  color: var(--ink-20);
  font-size: .82rem;
  font-weight: 500;
}

.dc-trust-item span.icon {
  font-size: 1.1rem;
}

/* ═══════════════════════════════════════════════════
   COUNTRY TABS / AUDIENCE SECTIONS
   ═══════════════════════════════════════════════════ */
.dc-country-pill {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  padding: .4rem 1rem;
  border-radius: 100px;
  background: var(--teal-50);
  color: var(--teal-700);
  font-size: .8rem;
  font-weight: 600;
  border: 1px solid var(--teal-100);
}

/* ═══════════════════════════════════════════════════
   HOW IT WORKS — STEPS
   ═══════════════════════════════════════════════════ */
.dc-steps {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 2rem;
  counter-reset: step;
}

.dc-step {
  position: relative;
  padding: 2rem;
  background: var(--white);
  border-radius: var(--radius-md);
  border: 1px solid var(--ink-10);
  text-align: center;
}

.dc-step::before {
  counter-increment: step;
  content: counter(step);
  display: flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: var(--teal-600);
  color: var(--white);
  font-family: var(--font-display);
  font-size: 1.2rem;
  font-weight: 700;
  margin: 0 auto 1.25rem;
}

/* ═══════════════════════════════════════════════════
   FAQ ACCORDION
   ═══════════════════════════════════════════════════ */
.dc-faq details {
  border-bottom: 1px solid var(--ink-10);
  padding: 1.25rem 0;
}

.dc-faq summary {
  font-family: var(--font-body);
  font-weight: 600;
  font-size: 1rem;
  color: var(--ink-80);
  cursor: pointer;
  list-style: none;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
}

.dc-faq summary::after {
  content: '+';
  font-size: 1.4rem;
  color: var(--teal-500);
  flex-shrink: 0;
}

.dc-faq details[open] summary::after { content: '−'; }

.dc-faq details p {
  margin-top: 1rem;
  color: var(--ink-60);
}

/* ═══════════════════════════════════════════════════
   BLOG / POSTS
   ═══════════════════════════════════════════════════ */
.dc-post-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 1.75rem;
}

.dc-post-card {
  background: var(--white);
  border: 1px solid var(--ink-10);
  border-radius: var(--radius-md);
  overflow: hidden;
  transition: box-shadow .2s, transform .2s;
}

.dc-post-card:hover {
  box-shadow: var(--shadow-md);
  transform: translateY(-2px);
}

.dc-post-card-body { padding: 1.5rem; }

.dc-post-tag {
  display: inline-block;
  padding: .25rem .75rem;
  background: var(--teal-50);
  color: var(--teal-700);
  border-radius: 100px;
  font-size: .72rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .04em;
  margin-bottom: .75rem;
}

/* ═══════════════════════════════════════════════════
   CONTENT PAGES (inner pages)
   ═══════════════════════════════════════════════════ */
.entry-content h2 {
  margin-top: 2.5rem;
  margin-bottom: 1rem;
  padding-bottom: .5rem;
  border-bottom: 2px solid var(--teal-100);
}

.entry-content h3 {
  margin-top: 2rem;
  margin-bottom: .75rem;
  color: var(--teal-700);
}

.entry-content ul,
.entry-content ol {
  margin: 0 0 1.25rem 1.5rem;
  color: var(--ink-60);
}

.entry-content li { margin-bottom: .4rem; }

.entry-content table {
  width: 100%;
  border-collapse: collapse;
  margin: 2rem 0;
  font-size: .9rem;
}

.entry-content table th {
  background: var(--teal-800);
  color: var(--white);
  padding: .8rem 1rem;
  text-align: left;
  font-weight: 600;
}

.entry-content table td {
  padding: .75rem 1rem;
  border-bottom: 1px solid var(--ink-10);
}

.entry-content table tr:nth-child(even) td {
  background: var(--bg-section);
}

/* Callout box */
.dc-callout {
  background: var(--teal-50);
  border-left: 4px solid var(--teal-500);
  border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
  padding: 1.25rem 1.5rem;
  margin: 2rem 0;
}

.dc-callout-gold {
  background: var(--gold-100);
  border-left-color: var(--gold-500);
}

/* ═══════════════════════════════════════════════════
   FOOTER
   ═══════════════════════════════════════════════════ */
.site-footer {
  background: var(--teal-900) !important;
  color: var(--ink-20);
  padding: 4rem 2rem 2rem;
}

.site-footer a { color: var(--teal-300); }
.site-footer a:hover { color: var(--white); }

.dc-footer-grid {
  display: grid;
  grid-template-columns: 2fr 1fr 1fr 1fr;
  gap: 3rem;
  max-width: 1160px;
  margin: 0 auto 3rem;
}

.dc-footer-brand {
  font-family: var(--font-display);
  font-size: 1.2rem;
  font-weight: 600;
  color: var(--teal-300);
  margin-bottom: .75rem;
}

.dc-footer-tagline {
  font-family: var(--font-mono);
  font-size: .72rem;
  letter-spacing: .1em;
  color: var(--teal-600);
  text-transform: uppercase;
  margin-bottom: 1rem;
}

.dc-footer-nav h4 {
  font-family: var(--font-body);
  font-size: .78rem;
  font-weight: 600;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--ink-40);
  margin-bottom: 1rem;
}

.dc-footer-nav ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

.dc-footer-nav li { margin-bottom: .5rem; }
.dc-footer-nav a { font-size: .88rem; color: var(--ink-20); }
.dc-footer-nav a:hover { color: var(--teal-300); }

.dc-footer-bottom {
  border-top: 1px solid rgba(93,202,165,.1);
  padding-top: 2rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  max-width: 1160px;
  margin: 0 auto;
  font-size: .8rem;
  color: var(--ink-40);
  flex-wrap: wrap;
  gap: 1rem;
}

/* ═══════════════════════════════════════════════════
   RESPONSIVE
   ═══════════════════════════════════════════════════ */
@media (max-width: 768px) {
  .dc-hero { padding: 3.5rem 1.25rem 4rem; }
  .dc-hero-stats { gap: 1.5rem; }
  .dc-section { padding: 3rem 1.25rem; }
  .dc-trust-bar { gap: 1.5rem; padding: 1rem; }
  .dc-footer-grid { grid-template-columns: 1fr 1fr; gap: 2rem; }
  .dc-btn-group { flex-direction: column; align-items: stretch; text-align: center; }

  .site-header .header-inner { padding: 0 1rem; }
  .main-navigation a { font-size: .75rem; padding: .3rem .6rem; }
}

@media (max-width: 480px) {
  .dc-footer-grid { grid-template-columns: 1fr; }
  .dc-hero h1 { font-size: 1.9rem; }
  .dc-stat-num { font-size: 1.8rem; }
}

/* ═══════════════════════════════════════════════════
   AESTHETIC POLISH
   ═══════════════════════════════════════════════════ */

/* Smooth scroll */
html { scroll-behavior: smooth; }

/* Hero gradient shimmer line */
.dc-hero::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent 0%, var(--teal-500) 50%, transparent 100%);
}

/* Stat counter aesthetic */
.dc-hero-stats {
  padding: 2rem 0;
  border-top: 1px solid rgba(93,202,165,.1);
  border-bottom: 1px solid rgba(93,202,165,.1);
}

/* Section label refined */
.dc-section-label {
  background: var(--teal-50);
  color: var(--teal-700) !important;
  padding: .3rem .85rem .3rem .6rem;
  border-radius: 100px;
  display: inline-flex;
  border: 1px solid var(--teal-100);
  width: auto;
  margin-bottom: 1.25rem;
}
.dc-section-label::before { display: none; }

/* Cards — glass shimmer on hover */
.dc-card {
  position: relative;
  overflow: hidden;
}
.dc-card::before {
  content: '';
  position: absolute;
  top: 0; left: -100%;
  width: 100%; height: 100%;
  background: linear-gradient(90deg, transparent, rgba(93,202,165,.04), transparent);
  transition: left .4s ease;
  pointer-events: none;
}
.dc-card:hover::before { left: 100%; }

/* Price table — highlight last column (savings) */
.dc-price-table td:last-child {
  color: var(--teal-600);
  font-weight: 600;
}

/* Steps — teal left border accent */
.dc-step {
  border-left: 3px solid var(--teal-400);
}

/* FAQ — refined */
.dc-faq {
  border: 1px solid var(--ink-10);
  border-radius: var(--radius-md);
  padding: 0 1.5rem;
  background: var(--white);
}
.dc-faq details:first-child { border-top: none; }

/* Callout — icon */
.dc-callout strong:first-child::before {
  content: '💡 ';
}
.dc-callout-gold strong:first-child::before {
  content: '★ ';
}

/* CTA sections */
.dc-section-dark .dc-btn-group {
  justify-content: center;
}

/* Trust bar — teal divider dots */
.dc-trust-item + .dc-trust-item::before {
  content: '·';
  color: var(--teal-700);
  margin-right: 3rem;
  font-size: 1.5rem;
  line-height: 1;
}

/* Page title on inner pages */
.entry-title {
  font-family: var(--font-display);
  font-size: clamp(1.8rem, 3.5vw, 2.8rem);
  color: var(--ink);
  border-bottom: 2px solid var(--teal-100);
  padding-bottom: .75rem;
  margin-bottom: 2rem;
}

/* Blog archive post cards */
.entry-header h2 a { color: var(--ink-80); }
.entry-header h2 a:hover { color: var(--teal-600); }

/* GeneratePress content width override */
.inside-article,
.entry-content {
  max-width: 100% !important;
  padding: 0 !important;
}

/* ═══ GP OVERRIDES ═══ */

.header-wrap {
  background-color: var(--teal-900) !important;
}

#masthead,
.site-header {
  background-color: var(--teal-900) !important;
}

.main-navigation,
.main-navigation ul ul {
  background-color: var(--teal-900) !important;
}

.main-navigation .main-nav ul li a, 
.main-navigation .main-nav ul > li > a,
#site-navigation a,
.main-nav ul li a,
.main-navigation .menu-bar-items,
.main-navigation .menu-toggle,
#masthead .main-navigation a {
  color: #FFFFFF !important;
}

.main-title a,
.main-title a:hover {
  color: #FFFFFF !important;
}

.mobile-header .mobile-toggle-button {
  background-color: var(--teal-900) !important;
  border-radius: 0;
  padding: 10px;
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}

/* CONTENT LAYOUT */

.content-area-wrap {
  max-width: 1100px;
  margin: 0 auto;
  padding: 40px;
}

h1, h2, h3, h4, h5, h6 {
  color: var(--teal-900);
  font-family: var(--font-display) !important;
  font-weight: bold;
  line-height: 1.1em;
}

p {
  color: #333;
  font-size: 16px;
  line-height: 1.5em;
  margin-bottom: 20px;
}

a {
  color: var(--gold-500);
}

table th, table td {
  border: 1px solid #ddd;
}

table tr:nth-child(even) {
  background-color: #f9f9f9;
}

button, .wp-block-button {
  background-color: var(--teal-900);
  color: #FFFFFF;
  padding: 10px 20px;
  border: none;
  border-radius: 5px;
  cursor: pointer;
}

.card-wrap {
  border: 1px solid #ddd;
  border-radius: 5px;
  padding: 20px;
  background-color: #fff;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

/* MOBILE RESPONSIVE */

.main-navigation ul li a {
  min-height: 44px !important;
  display: flex !important;
  align-items: center !important;
}
/* Sub-menu links: left-aligned, vertically centred */
.main-navigation .sub-menu li a {
  display: flex !important;
  align-items: center !important;
  min-height: 0 !important;
  padding: .65rem 1.2rem !important;
}

.mobile-header .mobile-nav-menu {
  background-color: var(--teal-900) !important;
  padding: 20px;
  width: 100%;
  height: 100vh;
  display: flex;
  justify-content: center;
  align-items: center;
}

#masthead ul li a,
.main-navigation .main-nav ul > li > a {
  min-height: 44px !important;
}

/* FOOTER */

.footer-widgets-wrap {
  background-color: var(--teal-900) !important;
}

.footer-widgets {
  color: #FFFFFF;
}

/* ═══════════════════════════════════════════════════
   STICKY HEADER WRAPPER (JS-injected #dc-sticky-header)
   ═══════════════════════════════════════════════════ */
#dc-sticky-header {
  position: sticky;
  top: 0;
  z-index: 9999;
  width: 100%;
}
/* Override any individual sticky declarations now that wrapper handles it */
#dc-sticky-header .site-header,
#dc-sticky-header .main-navigation {
  position: static !important;
}

/* ═══════════════════════════════════════════════════
   HIDE WORDPRESS PAGE TITLE when page has a custom hero
   (PHP filter handles it too, this is a CSS safety net)
   ═══════════════════════════════════════════════════ */
.page .entry-header:has(+ .entry-content .dc-hero) {
  display: none;
}
/* Broader fallback: hide entry-header for all pages with dc-hero */
.page:has(.dc-hero) .entry-header {
  display: none;
}

/* ═══════════════════════════════════════════════════
   SPACE OPTIMISATION — reduce excessive padding
   ═══════════════════════════════════════════════════ */
.dc-hero {
  padding: 3.5rem 2rem 4rem !important;
}
.dc-section {
  padding: 3rem 2rem !important;
}
.inside-article {
  padding: 0 !important;
}
.entry-content {
  padding: 0 !important;
}
/* Tighter heading margins inside sections */
.dc-section h2 {
  margin-top: 0;
}
/* Reduce gap between hero and first section */
.dc-hero + .dc-section,
.dc-hero + * > .dc-section:first-child {
  margin-top: 0;
}

/* ═══════════════════════════════════════════════════
   HERO FALLBACK — pages using h2/p directly in .dc-hero
   (without .dc-container structure)
   ═══════════════════════════════════════════════════ */
.dc-hero h2 {
  font-family: var(--font-display);
  font-size: clamp(1.8rem, 4vw, 3rem);
  font-weight: 700;
  color: var(--white);
  line-height: 1.2;
  max-width: 800px;
  margin: 0 auto 1.25rem;
}
.dc-hero > p {
  color: var(--ink-20);
  max-width: 620px;
  margin: 0 auto 1.5rem;
}

/* ═══════════════════════════════════════════════════
   FAQ — div-based variant (dc-faq-item / dc-faq-question / dc-faq-answer)
   ═══════════════════════════════════════════════════ */
.dc-faq-item {
  border-bottom: 1px solid var(--ink-10);
  padding: 1.25rem 0;
}
.dc-faq-item:first-child { border-top: 1px solid var(--ink-10); }
.dc-faq-question {
  font-family: var(--font-body);
  font-size: 1rem;
  font-weight: 600;
  color: var(--ink-80);
  margin: 0 0 .75rem;
  cursor: default;
}
.dc-faq-answer p {
  margin-bottom: .5rem;
  color: var(--ink-60);
}

/* ═══════════════════════════════════════════════════
   ORDERED LIST — dc-list-numbered
   ═══════════════════════════════════════════════════ */
.dc-list-numbered {
  list-style: none;
  counter-reset: dc-step;
  padding: 0;
  margin: 1.5rem 0;
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}
.dc-list-numbered li {
  counter-increment: dc-step;
  display: flex;
  gap: 1rem;
  align-items: flex-start;
  background: var(--white);
  border: 1px solid var(--ink-10);
  border-radius: var(--radius-md);
  padding: 1.25rem 1.5rem;
  box-shadow: var(--shadow-sm);
}
.dc-list-numbered li::before {
  content: counter(dc-step);
  flex-shrink: 0;
  width: 2rem;
  height: 2rem;
  background: var(--teal-600);
  color: #fff;
  font-weight: 700;
  font-size: .85rem;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: .1rem;
}

/* ═══════════════════════════════════════════════════
   PRICE TABLE — div wrapper support
   Allows <div class="dc-price-table"><h3>…</h3><table>…</table></div>
   ═══════════════════════════════════════════════════ */
.dc-price-table h3 {
  font-size: 1.1rem;
  color: var(--ink-80);
  margin-bottom: 1rem;
}
.dc-price-table > table {
  width: 100%;
  border-collapse: collapse;
  border-radius: var(--radius-md);
  overflow: hidden;
  box-shadow: var(--shadow-sm);
  font-size: .92rem;
}
.dc-price-table > table th {
  background: var(--teal-800);
  color: #fff;
  padding: .85rem 1rem;
  text-align: left;
  font-weight: 600;
}
.dc-price-table > table td {
  padding: .75rem 1rem;
  border-bottom: 1px solid var(--ink-10);
  color: var(--ink-60);
}
.dc-price-table > table tr:nth-child(even) td {
  background: var(--bg-section);
}

/* ═══════════════════════════════════════════════════
   PATIENT INQUIRY FORM — dc-patient-form
   ═══════════════════════════════════════════════════ */
.dc-patient-form {
  background: #fff;
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-md);
  padding: 2.5rem 2rem;
  max-width: 780px;
  margin: 0 auto 3rem;
}

/* Section headings inside form */
.dc-form-section-title {
  font-family: var(--font-display);
  font-size: 1.1rem;
  font-weight: 600;
  color: var(--teal-800);
  margin: 1.75rem 0 .75rem;
  padding-bottom: .4rem;
  border-bottom: 2px solid var(--teal-100);
}
.dc-form-section-title:first-child {
  margin-top: 0;
}

/* Field wrapper */
.dc-field-wrap {
  display: flex;
  flex-direction: column;
  gap: .35rem;
  margin-bottom: 1.1rem;
}
.dc-field-wrap label {
  font-size: .875rem;
  font-weight: 600;
  color: var(--ink-60);
}
.dc-req { color: var(--teal-600); margin-left: 2px; }

/* Two-column row */
.dc-form-row-2 {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1rem;
}
@media (max-width: 560px) {
  .dc-form-row-2 { grid-template-columns: 1fr; }
}

/* Input / select / textarea base */
.dc-patient-form input[type="text"],
.dc-patient-form input[type="email"],
.dc-patient-form input[type="tel"],
.dc-patient-form select,
.dc-patient-form textarea {
  width: 100%;
  padding: .65rem .9rem;
  border: 1.5px solid var(--ink-10);
  border-radius: var(--radius-sm);
  font-family: var(--font-body);
  font-size: .95rem;
  color: var(--ink);
  background: var(--bg-page);
  transition: border-color .18s, box-shadow .18s;
  box-sizing: border-box;
}
.dc-patient-form input:focus,
.dc-patient-form select:focus,
.dc-patient-form textarea:focus {
  outline: none;
  border-color: var(--teal-500);
  box-shadow: 0 0 0 3px rgba(26,138,110,.15);
}
.dc-patient-form textarea {
  resize: vertical;
  min-height: 90px;
}

/* Field hint */
.dc-field-hint {
  font-size: .78rem;
  color: var(--ink-40);
  margin-top: .1rem;
}

/* Consent checkbox row */
.dc-form-consent {
  display: flex;
  align-items: flex-start;
  gap: .65rem;
  margin: 1.5rem 0 1.75rem;
  font-size: .85rem;
  color: var(--ink-60);
  line-height: 1.4;
}
.dc-form-consent input[type="checkbox"] {
  width: 18px;
  height: 18px;
  flex-shrink: 0;
  margin-top: .1rem;
  accent-color: var(--teal-600);
}

/* Submit button */
.dc-submit-btn {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  background: var(--teal-600);
  color: #fff;
  font-family: var(--font-body);
  font-size: 1rem;
  font-weight: 600;
  padding: .8rem 2rem;
  border: none;
  border-radius: var(--radius-sm);
  cursor: pointer;
  transition: background .18s, transform .12s;
  width: 100%;
  justify-content: center;
}
.dc-submit-btn:hover { background: var(--teal-700); }
.dc-submit-btn:active { transform: scale(.98); }
.dc-submit-btn:disabled {
  background: var(--ink-20);
  cursor: not-allowed;
}

/* Feedback messages */
.dc-form-message {
  display: none;
  border-radius: var(--radius-sm);
  padding: 1rem 1.25rem;
  margin-top: 1rem;
  font-size: .92rem;
}
.dc-form-success {
  display: block;
  background: var(--teal-50);
  border: 1.5px solid var(--teal-300);
  color: var(--teal-800);
}
.dc-form-error-msg {
  display: block;
  background: #FFF3F3;
  border: 1.5px solid #F8BBBB;
  color: #8B1A1A;
}