/*
Theme Name:  Hello Child
Template:    hello-elementor
Description: Okamoto & Bigley Dentistry - custom child theme.
Version:     2.0.0
Text Domain: hello-child
*/

/* ==========================================================================
   DESIGN TOKENS
   ========================================================================== */
:root {
  --navy:       #232140;
  --navy-deep:  #1C1A33;
  --navy-mid:   #3a3760;
  --gold:       #B89150;
  --gold-h:     #a67f3f;
  --cream:      #FBFAF8;
  --border:     #EEEDF1;
  --border-2:   #ECEAF1;
  --text-d:     #33304A;
  --text-m:     #615F70;
  --text-s:     #9A95A3;
  --mono-dim:   #8C88A8;
  --stars:      #E7C977;
  --f-head:     'Newsreader', serif;
  --f-body:     'Archivo', sans-serif;
  --f-mono:     'JetBrains Mono', monospace;
  --wrap:       1400px;
  --gap:        40px;
  --radius:     10px;
}

/* ==========================================================================
   RESET / BASE
   ========================================================================== */
*,*::before,*::after{box-sizing:border-box;}
body{margin:0;font-family:var(--f-body);color:var(--text-d);background:#fff;line-height:1.65;font-size:19px;-webkit-font-smoothing:antialiased;}
h1,h2,h3,h4,h5,h6{font-family:var(--f-head);color:var(--navy);line-height:1.15;margin:0 0 .5em;font-weight:400;}
h1{font-size:2.7rem;}h2{font-size:2.1rem;}h3{font-size:1.5rem;}h4{font-size:1.2rem;}
p{margin:0 0 1em;}
a{color:var(--navy);text-decoration:none;transition:color .15s;}
a:hover{color:var(--gold);}
img{max-width:100%;height:auto;display:block;}
address{font-style:normal;}
button{cursor:pointer;font-family:var(--f-body);border:none;background:none;}

/* Container */
.container,.hdr-container,.site-footer__container{
  max-width:var(--wrap);margin:0 auto;padding:0 var(--gap);
}

/* ==========================================================================
   HEADER
   ========================================================================== */
.site-header{
  position:sticky;top:0;z-index:200;
  background:#fff;
  box-shadow:0 1px 0 var(--border);
}

/* --- Utility bar --- */
.hdr-util{
  background:var(--navy);
  height:44px;
  display:flex;align-items:center;
}
.hdr-util__inner{
  display:flex;align-items:center;
  justify-content:space-between;
  width:100%;
}
.hdr-util__addr{
  font-size:12px;letter-spacing:.04em;
  color:rgba(255,255,255,.62);
}
.hdr-util__right{
  display:flex;align-items:center;gap:18px;
}
.hdr-util__pay{
  display:inline-flex;align-items:center;
  background:#2F80ED !important;
  color:#fff !important;
  font-family:var(--f-body);
  font-size:11.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;
  padding:7px 16px;border-radius:6px;
  text-decoration:none;line-height:1;
  transition:background .15s;
}
.hdr-util__pay:hover{background:#1F6FD8 !important;color:#fff !important;}
.hdr-util__divider{
  width:1px;height:14px;
  background:rgba(255,255,255,.2);
  display:block;
}
.hdr-util__phone{
  font-size:13px;font-weight:500;
  color:#fff;
  white-space:nowrap;
  transition:color .15s;
}
.hdr-util__phone:hover{color:rgba(255,255,255,.82);}

/* --- Main nav bar --- */
.hdr-main{
  background:#fff;
  position:relative;
}
.hdr-main__inner{
  display:flex;align-items:center;
  justify-content:space-between;
  height:88px;gap:24px;
}

/* --- Logo --- */
.hdr-logo{
  display:flex;align-items:center;
  flex-shrink:0;text-decoration:none;
}
.hdr-logo img,.hdr-logo .custom-logo{
  height:46px;width:auto;display:block;
  max-height:52px;
}

/* --- Desktop Nav --- */
.hdr-nav{flex:1;display:flex;justify-content:center;}
.hdr-nav__list{
  list-style:none;margin:0;padding:0;
  display:flex;align-items:center;gap:0;
}
.hdr-nav__list li{position:static;}
.hdr-nav__link,.hdr-nav__btn{
  display:inline-flex;align-items:center;gap:5px;
  padding:9px 12px;
  font-size:16px;font-weight:500;
  color:var(--text-d);
  text-decoration:none;
  white-space:nowrap;
  transition:color .15s;
  background:none;border:none;
  font-family:var(--f-body);
  line-height:1;
}
.hdr-nav__link:hover,.hdr-nav__btn:hover,
.has-mega.mega-open .hdr-nav__btn{
  color:var(--gold);
}
.hdr-nav__chevron{
  width:8px;height:8px;
  color:var(--gold);flex-shrink:0;
  transition:transform .2s;
}
.has-mega.mega-open .hdr-nav__chevron{transform:rotate(180deg);}

/* --- CTA button --- */
.hdr-cta{
  height:50px;
  display:inline-flex;align-items:center;
  padding:0 22px;
  border-radius:8px;
  background:var(--gold);
  color:#fff;
  font-size:14.5px;font-weight:600;
  white-space:nowrap;flex-shrink:0;
  transition:background .15s;
  font-family:var(--f-body);
  text-decoration:none;
}
.hdr-cta:hover{background:var(--gold-h);color:#fff;}

/* --- Hamburger --- */
.hdr-hamburger{
  display:none;
  flex-direction:column;
  justify-content:space-between;
  width:28px;height:20px;
  background:none;border:none;
  padding:0;flex-shrink:0;
}
.hdr-hamburger span{
  display:block;height:2px;
  background:var(--navy);
  border-radius:2px;
  transition:transform .25s,opacity .2s;
  transform-origin:center;
}
.hdr-hamburger.is-open span:nth-child(1){transform:translateY(9px) rotate(45deg);}
.hdr-hamburger.is-open span:nth-child(2){opacity:0;transform:scaleX(0);}
.hdr-hamburger.is-open span:nth-child(3){transform:translateY(-9px) rotate(-45deg);}

/* ==========================================================================
   MEGA MENUS
   ========================================================================== */
.mega-wrap{
  position:absolute;
  left:0;right:0;top:100%;
  background:#fff;
  border-top:1px solid var(--border-2);
  box-shadow:0 26px 44px -22px rgba(35,33,64,.28);
  z-index:300;
  animation:megaIn .18s ease;
}
@keyframes megaIn{
  from{opacity:0;transform:translateY(-8px);}
  to{opacity:1;transform:translateY(0);}
}
.mega-inner{
  padding:32px 40px 40px;
}
.mega-head{
  display:flex;align-items:baseline;
  justify-content:space-between;
  border-bottom:1px solid var(--border-2);
  padding-bottom:14px;margin-bottom:20px;
}
.mega-title{
  font-family:var(--f-head);
  font-size:27px;color:var(--navy);
  font-weight:400;
}
.mega-view-all{
  font-size:11.5px;letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--gold);font-weight:500;
}
.mega-view-all:hover{color:var(--gold-h);}
.mega-grid{
  column-count:3;column-gap:48px;
}
.mega-grid a{
  display:block;break-inside:avoid;
  font-size:15.5px;color:var(--text-d);
  text-decoration:none;
  padding:10px 0;
  border-bottom:1px solid var(--border-2);
  transition:color .12s;
}
.mega-grid a:hover{color:var(--gold);}

/* ==========================================================================
   MOBILE NAV
   ========================================================================== */
.mobile-nav{
  background:#fff;
  border-top:1px solid var(--border);
  overflow-y:auto;
  max-height:calc(100dvh - 132px);
  -webkit-overflow-scrolling:touch;
}
.mob-nav__list{
  list-style:none;margin:0;padding:0;
}
.mob-nav__list > li{
  border-bottom:1px solid var(--border);
}
.mob-nav__link,.mob-nav__trigger{
  display:flex;align-items:center;
  justify-content:space-between;
  width:100%;padding:17px 24px;
  font-size:17px;font-weight:500;
  color:var(--navy);
  text-decoration:none;
  background:none;border:none;
  font-family:var(--f-body);
  text-align:left;
}
.mob-nav__link:hover,.mob-nav__trigger:hover{color:var(--gold);}
.mob-nav__chev{
  width:16px;height:16px;
  flex-shrink:0;color:var(--gold);
  transition:transform .2s;
}
.mob-mega-open > .mob-nav__trigger .mob-nav__chev{transform:rotate(180deg);}
.mob-sub{
  background:var(--cream);
  border-top:1px solid var(--border);
}
.mob-sub__head{
  display:flex;align-items:center;
  justify-content:space-between;
  padding:14px 24px;
  border-bottom:1px solid var(--border);
}
.mob-sub__title{
  font-family:var(--f-head);
  font-size:18px;color:var(--navy);
}
.mob-sub__all{
  font-size:11px;letter-spacing:.1em;
  text-transform:uppercase;
  color:var(--gold);font-weight:500;
}
.mob-sub__items a{
  display:block;
  padding:12px 24px;
  font-size:15px;color:var(--text-d);
  text-decoration:none;
  border-bottom:1px solid var(--border);
  transition:color .12s;
}
.mob-sub__items a:last-child{border-bottom:0;}
.mob-sub__items a:hover{color:var(--gold);}
.mob-cta-wrap{padding:20px 24px;}
.mob-cta{
  display:flex;align-items:center;
  justify-content:center;
  height:52px;
  background:var(--gold);
  color:#fff;border-radius:8px;
  font-size:15px;font-weight:600;
  font-family:var(--f-body);
  text-decoration:none;
  transition:background .15s;
}
.mob-cta:hover{background:var(--gold-h);color:#fff;}

/* ==========================================================================
   FOOTER
   ========================================================================== */
.site-footer{
  background:var(--navy-deep);
  color:rgba(255,255,255,.7);
  padding:64px 0 0;
}
.site-footer__grid{
  display:grid;
  grid-template-columns:1.4fr 1fr 1fr 1.2fr;
  gap:40px;
  padding-bottom:52px;
}
.footer-logo img,.footer-logo .custom-logo{
  height:44px;width:auto;
  filter:brightness(0) invert(1);
  opacity:.9;
}
.footer-tagline{
  font-size:14px;line-height:1.6;
  color:rgba(255,255,255,.55);
  margin:18px 0 0;max-width:270px;
}
.footer-col-label{
  font-family:var(--f-body);
  font-size:11px;letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--mono-dim);
  margin-bottom:16px;
  display:block;
}
.footer-links{
  list-style:none;margin:0;padding:0;
  display:flex;flex-direction:column;gap:11px;
}
.footer-links a{
  font-size:14px;color:rgba(255,255,255,.72);
  text-decoration:none;transition:color .15s;
}
.footer-links a:hover{color:#fff;}
.footer-addr{
  font-size:14px;line-height:1.65;
  color:rgba(255,255,255,.8);
  margin-bottom:14px;
}
.footer-hours{
  font-size:13.5px;line-height:1.7;
  color:rgba(255,255,255,.5);
  margin-bottom:14px;
}
.footer-phone{
  font-family:var(--f-head);
  font-size:22px;color:#fff;
  text-decoration:none;transition:color .15s;
}
.footer-phone:hover{color:rgba(255,255,255,.8);}
.site-footer__bottom{
  border-top:1px solid rgba(255,255,255,.1);
  padding:22px 0 28px;
  display:flex;align-items:center;
  justify-content:space-between;gap:16px;
}
.footer-copy{
  font-size:12px;color:rgba(255,255,255,.4);
}
.footer-legal{display:flex;gap:18px;}
.footer-legal a{
  font-size:12px;color:rgba(255,255,255,.38);
  text-decoration:none;transition:color .15s;
}
.footer-legal a:hover{color:rgba(255,255,255,.7);}

/* ==========================================================================
   MAIN CONTENT
   ========================================================================== */
.site-main{min-height:50vh;}

/* ==========================================================================
   UTILITY CLASSES
   ========================================================================== */
.eyebrow{
  font-family:var(--f-body);
  font-size:12px;letter-spacing:.2em;
  text-transform:uppercase;
  color:var(--gold);display:block;
}
.section{padding:72px 0;}
.section--surface{background:var(--cream);}
.btn{
  display:inline-flex;align-items:center;
  height:52px;padding:0 28px;
  background:var(--navy);color:#fff;
  border-radius:var(--radius);
  font-size:15px;font-weight:600;
  font-family:var(--f-body);
  text-decoration:none;transition:background .15s;
}
.btn:hover{background:var(--navy-mid);color:#fff;}
.btn--gold{background:var(--gold);}
.btn--gold:hover{background:var(--gold-h);}

/* ==========================================================================
   RESPONSIVE
   ========================================================================== */
@media(max-width:1100px){
  .hdr-nav__link,.hdr-nav__btn{padding:9px 9px;font-size:13.5px;}
  .hdr-cta{padding:0 16px;font-size:13.5px;}
}
@media(max-width:880px){
  .hdr-nav{display:none;}
  .hdr-cta{display:none;}
  .hdr-hamburger{display:flex;}
  .hdr-util__addr{display:none;}
  .hdr-main__inner{height:72px;}
  .hdr-logo img,.hdr-logo .custom-logo{height:40px;}
  .mega-wrap{display:none!important;}
  .site-footer__grid{grid-template-columns:1fr 1fr;gap:32px;}
  h1{font-size:2.1rem;}h2{font-size:1.75rem;}
}
@media(max-width:580px){
  :root{--gap:24px;}
  .site-footer__grid{grid-template-columns:1fr;gap:28px;}
  .site-footer__bottom{flex-direction:column;align-items:flex-start;gap:6px;}
  h1{font-size:1.85rem;}h2{font-size:1.5rem;}
}
/* ==========================================================================
   FIXES - Elementor overrides + layout corrections
   ========================================================================== */

/* 1. UTILITY BAR - flex: 1 ensures inner div expands to full width */
.hdr-util {
  display: block; /* remove outer flex so child can control its own layout */
}
.hdr-util > .hdr-container,
.hdr-util > .hdr-util__inner,
.hdr-util > .hdr-container.hdr-util__inner {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  height: 44px;
  gap: 16px;
  width: 100%;
  max-width: var(--wrap);
  margin: 0 auto;
  padding: 0 var(--gap);
  box-sizing: border-box;
}
.hdr-util__addr {
  flex-shrink: 1;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.hdr-util__right {
  display: flex !important;
  align-items: center;
  gap: 18px;
  flex-shrink: 0;
  white-space: nowrap;
}

/* 2. BUTTONS - strip every Elementor / browser style off our nav buttons */
.site-header .hdr-nav__btn {
  all: unset;
  /* Re-apply our styles */
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 9px 12px;
  font-family: var(--f-body);
  font-size: 14.5px;
  font-weight: 500;
  color: var(--text-d);
  white-space: nowrap;
  cursor: pointer;
  line-height: 1;
  background: transparent;
  border: none;
  box-shadow: none;
  outline: none;
  -webkit-appearance: none;
  appearance: none;
  transition: color .15s;
}
.site-header .hdr-nav__btn:hover,
.site-header .has-mega.mega-open .hdr-nav__btn {
  color: var(--gold) !important;
  background: transparent !important;
  box-shadow: none !important;
}
.site-header .hdr-nav__btn:focus,
.site-header .hdr-nav__btn:focus-visible {
  outline: 2px solid var(--gold);
  outline-offset: 2px;
  background: transparent !important;
}
/* Also reset hamburger from Elementor */
.hdr-hamburger {
  all: unset;
  display: none;
  flex-direction: column;
  justify-content: space-between;
  width: 28px;
  height: 20px;
  cursor: pointer;
  flex-shrink: 0;
}
@media(max-width:880px){
  .hdr-hamburger { display: flex; }
}
.hdr-hamburger span {
  display: block;
  height: 2px;
  background: var(--navy);
  border-radius: 2px;
  transition: transform .25s, opacity .2s;
  transform-origin: center;
}
.hdr-hamburger.is-open span:nth-child(1) { transform: translateY(9px) rotate(45deg); }
.hdr-hamburger.is-open span:nth-child(2) { opacity: 0; transform: scaleX(0); }
.hdr-hamburger.is-open span:nth-child(3) { transform: translateY(-9px) rotate(-45deg); }

/* 3. LOGO - defeat WordPress inline width/height attrs */
.hdr-logo,
.hdr-logo a {
  display: flex;
  align-items: center;
  line-height: 0;
}
.hdr-logo img,
.hdr-logo .custom-logo {
  height: 64px !important;
  width: auto !important;
  max-width: none !important;
  display: block;
}
/* Footer logo white */
.footer-logo img,
.footer-logo .custom-logo {
  height: 64px !important;
  width: auto !important;
  filter: brightness(0) invert(1);
  opacity: .88;
}

/* 4. MOBILE NAV - also strip Elementor from mob-nav__trigger buttons */
.mobile-nav .mob-nav__trigger {
  all: unset;
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  padding: 17px 24px;
  font-family: var(--f-body);
  font-size: 17px;
  font-weight: 500;
  color: var(--navy);
  background: none;
  cursor: pointer;
  box-sizing: border-box;
  text-align: left;
  border: none;
}
.mobile-nav .mob-nav__trigger:hover { color: var(--gold); }
/* ==========================================================================
   HOME PAGE SECTIONS
   ========================================================================== */

/* ---- HERO ---- */
.hero {
  display: grid;
  grid-template-columns: 1.08fr .92fr;
  min-height: 580px;
}
.hero__content {
  padding: 72px 56px 72px 80px;
  background: var(--cream);
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.hero__eyebrow {
  font-family: var(--f-mono);
  font-size: 12.5px;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: var(--gold);
  display: block;
  margin-bottom: 18px;
}
.hero__h1 {
  font-family: var(--f-head);
  font-size: 56px;
  font-weight: 400;
  line-height: 1.04;
  letter-spacing: -.015em;
  color: var(--navy);
  margin: 0 0 20px;
  max-width: 520px;
}
.hero__lead {
  font-size: 17px;
  line-height: 1.6;
  color: var(--text-m);
  max-width: 460px;
  margin: 0 0 30px;
}
.hero__photo {
  position: relative;
  background: linear-gradient(160deg,#E8E7F0 0%,#D9D8E5 100%);
  display: flex;
  align-items: center;
  justify-content: center;
  border-left: 1px solid var(--border);
  overflow: hidden;
}
.hero__photo-label {
  font-family: var(--f-mono);
  font-size: 11.5px;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: #7C7A8A;
  background: rgba(255,255,255,.78);
  border: 1px solid rgba(35,33,64,.08);
  border-radius: 999px;
  padding: 9px 16px;
}
.hero__badge {
  position: absolute;
  left: 28px;
  bottom: 28px;
  background: #fff;
  border-radius: 12px;
  box-shadow: 0 16px 36px -20px rgba(35,33,64,.4);
  padding: 16px 20px;
}
.hero__badge-year {
  font-family: var(--f-head);
  font-size: 30px;
  color: var(--navy);
  line-height: 1;
}
.hero__badge-sub {
  font-size: 12.5px;
  color: var(--text-s);
  margin-top: 4px;
}

/* ---- CF7 Appointment Form ---- */
.appt-form {
  display: flex;
  flex-direction: column;
  gap: 12px;
  max-width: 480px;
}
.appt-form__row {
  display: flex;
  gap: 12px;
}
/* Target CF7-wrapped inputs */
.appt-form .wpcf7-form-control-wrap,
.appt-form__row .wpcf7-form-control-wrap {
  display: block;
  flex: 1;
  min-width: 0;
}
.appt-form__row .wpcf7-form-control-wrap:last-child {
  flex: 0 0 150px;
}
.appt-form input[type="text"],
.appt-form input[type="tel"],
.appt-form input[type="email"] {
  display: block;
  width: 100%;
  height: 52px;
  border: 1px solid #DAD9E1;
  border-radius: 10px;
  padding: 0 16px;
  font-family: var(--f-body);
  font-size: 15px;
  color: var(--navy);
  background: #fff;
  outline: none;
  transition: border-color .15s;
  box-sizing: border-box;
}
.appt-form input:focus {
  border-color: var(--gold);
}
.appt-form input::placeholder { color: #A6A4B2; }
.appt-form .wpcf7-submit,
.appt-form input[type="submit"] {
  display: block !important;
  width: 100% !important;
  height: 54px;
  border: none;
  border-radius: 10px;
  background: var(--navy) !important;
  color: #fff !important;
  font-family: var(--f-body);
  font-size: 15px;
  font-weight: 600;
  cursor: pointer;
  margin-top: 2px;
  transition: background .15s;
  -webkit-appearance: none;
}
.appt-form .wpcf7-submit:hover,
.appt-form input[type="submit"]:hover {
  background: var(--navy-mid) !important;
}
.wpcf7 form.invalid .wpcf7-response-output,
.wpcf7 form.unaccepted .wpcf7-response-output {
  border-color: var(--gold);
  color: var(--text-m);
  font-size: 13px;
  margin: 8px 0 0;
}

/* Inline per-field validation messages. CF7 defaults these to font-size:1em,
   which inherits the form's size and renders oversized. */
.wpcf7 .wpcf7-not-valid-tip {
  font-family: var(--f-body);
  font-size: 12.5px;
  line-height: 1.4;
  margin-top: 5px;
}

/* ---- WELCOME ---- */
.welcome {
  padding: 80px 0 72px;
  background: #fff;
  text-align: center;
}
.welcome__inner { max-width: 860px; margin: 0 auto; }
.welcome__h2 {
  font-family: var(--f-head);
  font-size: 40px;
  font-weight: 400;
  color: var(--navy);
  margin: 14px 0 0;
  line-height: 1.12;
}
.welcome__lead {
  font-size: 17.5px;
  line-height: 1.65;
  color: var(--text-m);
  margin: 18px auto 0;
  max-width: 700px;
}
.stats-row {
  display: grid;
  grid-template-columns: repeat(3,1fr);
  gap: 0;
  margin: 46px auto 0;
  max-width: 880px;
}
.stat {
  padding: 0 16px;
}
.stat + .stat { border-left: 1px solid var(--border-2); }
.stat__num {
  font-family: var(--f-head);
  font-size: 42px;
  color: var(--gold);
  line-height: 1;
  display: block;
}
.stat__desc {
  font-size: 15px;
  color: var(--text-m);
  margin: 8px 0 0;
  line-height: 1.5;
}

/* ---- FEATURED SERVICES ---- */
.services-section {
  padding: 76px 0;
  background: var(--cream);
}
.section-header-row {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  margin-bottom: 34px;
}
.section-header-row h2 { margin: 10px 0 0; }
.view-all-link {
  font-family: var(--f-body);
  font-size: 11.5px;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--navy);
  text-decoration: none;
  border-bottom: 2px solid var(--gold);
  padding-bottom: 3px;
  white-space: nowrap;
  flex-shrink: 0;
  transition: color .15s;
}
.view-all-link:hover { color: var(--gold); }
.services-grid {
  display: grid;
  grid-template-columns: repeat(3,1fr);
  gap: 22px;
}
.service-card {
  background: #fff;
  border: 1px solid var(--border-2);
  border-radius: 14px;
  padding: 26px;
  text-decoration: none;
  display: block;
  transition: box-shadow .15s, transform .15s;
}
.service-card:hover {
  box-shadow: 0 18px 40px -26px rgba(35,33,64,.4);
  transform: translateY(-2px);
}
.service-card__icon {
  width: 46px;
  height: 46px;
  border-radius: 10px;
  background: linear-gradient(135deg,#EDEBF4,#E2E0EC);
}
.service-card__name {
  font-family: var(--f-head);
  font-size: 22px;
  color: var(--navy);
  margin: 18px 0 0;
  font-weight: 400;
}
.service-card__blurb {
  font-size: 14.5px;
  line-height: 1.55;
  color: var(--text-m);
  margin: 8px 0 0;
}
.service-card__cta {
  font-family: var(--f-body);
  font-size: 11.5px;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--gold);
  margin-top: 16px;
  display: block;
}

/* ---- MEET THE DOCTORS ---- */
.doctors-section {
  padding: 80px 0;
  background: #fff;
}
.doctors-inner {
  display: grid;
  grid-template-columns: .9fr 1.1fr;
  gap: 56px;
  align-items: center;
}
.doctors-photo {
  aspect-ratio: 4/3;
  border-radius: 16px;
  background: linear-gradient(135deg,#E7E6EE 0%,#D9D8E4 100%);
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}
.doctors-photo img { width:100%;height:100%;object-fit:cover; }
.doctors-photo__label {
  font-family: var(--f-mono);
  font-size: 11px;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: #7C7A8A;
  background: rgba(255,255,255,.8);
  border-radius: 999px;
  padding: 9px 16px;
}
.doctors-h2 { font-size: 38px; margin: 12px 0 0; line-height: 1.1; }
.doctors-lead {
  font-size: 16.5px;
  line-height: 1.6;
  color: var(--text-m);
  margin: 14px 0 0;
  max-width: 500px;
}
.doctor-cards { margin-top: 26px; display: flex; flex-direction: column; gap: 16px; }
.doctor-card {
  display: flex;
  gap: 16px;
  align-items: flex-start;
}
.doctor-card__photo {
  width: 64px; height: 64px;
  border-radius: 12px;
  background: linear-gradient(135deg,#E7E6EE,#D9D8E4);
  flex-shrink: 0;
  overflow: hidden;
  display:flex;align-items:center;justify-content:center;
}
.doctor-card__photo img { width:100%;height:100%;object-fit:cover; }
.doctor-card__name {
  font-family: var(--f-head);
  font-size: 19px;
  color: var(--navy);
  margin: 0 0 4px;
}
.doctor-card__bio {
  font-size: 14.5px;
  line-height: 1.55;
  color: var(--text-m);
  margin: 0;
}

/* ---- WHY CHOOSE US ---- */
.why-section {
  padding: 80px 0;
  background: var(--navy);
}
.why-section .eyebrow { color: rgba(255,255,255,.45); }
.why-section h2 {
  font-size: 38px;
  color: #fff;
  margin: 12px 0 40px;
}
.why-grid {
  display: grid;
  grid-template-columns: repeat(4,1fr);
  gap: 32px;
}
.why-item__num {
  font-family: var(--f-mono);
  font-size: 13px;
  color: var(--gold);
  display: block;
  margin-bottom: 12px;
}
.why-item__title {
  font-family: var(--f-head);
  font-size: 22px;
  color: #fff;
  font-weight: 400;
  margin: 0 0 10px;
}
.why-item__text {
  font-size: 14.5px;
  line-height: 1.55;
  color: rgba(255,255,255,.68);
  margin: 0;
}

/* ---- REVIEWS ---- */
.reviews-section {
  padding: 80px 0;
  background: #fff;
}
.reviews-head {
  text-align: center;
  margin-bottom: 40px;
}
.stars-row {
  font-size: 22px;
  letter-spacing: 3px;
  color: var(--stars);
  margin-bottom: 12px;
}
.reviews-h2 {
  font-size: 36px;
  margin: 0;
  color: var(--navy);
}
.reviews-grid {
  display: grid;
  grid-template-columns: repeat(3,1fr);
  gap: 24px;
}
.review-card {
  background: var(--cream);
  border: 1px solid #EEEAE1;
  border-radius: 14px;
  padding: 28px;
}
.review-card__stars {
  font-size: 15px;
  letter-spacing: 2px;
  color: var(--stars);
}
.review-card__quote {
  font-family: var(--f-head);
  font-size: 19px;
  line-height: 1.5;
  color: var(--text-d);
  margin: 14px 0 0;
  font-style: italic;
  font-weight: 400;
}
.review-card__attr {
  font-family: var(--f-body);
  font-size: 11.5px;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--text-s);
  margin-top: 18px;
  display: block;
}

/* ---- VISIT US ---- */
.visit-section {
  padding: 0 0 80px;
  background: #fff;
}
.visit-card {
  background: var(--cream);
  border: 1px solid #EEEAE1;
  border-radius: 18px;
  overflow: hidden;
  display: grid;
  grid-template-columns: 1fr 1fr;
}
.visit-map {
  min-height: 380px;
  background: linear-gradient(135deg,#E1E0EA,#D4D3E0);
  display: flex;
  align-items: center;
  justify-content: center;
}
.visit-map__label {
  font-family: var(--f-mono);
  font-size: 11px;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: #6E6C7E;
  background: rgba(255,255,255,.82);
  border-radius: 999px;
  padding: 9px 16px;
}
.visit-info {
  padding: 48px;
}
.visit-info h2 {
  font-size: 34px;
  margin: 12px 0 0;
}
.visit-detail {
  margin-top: 22px;
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.visit-detail__label {
  font-family: var(--f-body);
  font-size: 11px;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--text-s);
  display: block;
  margin-bottom: 4px;
}
.visit-detail__val {
  font-size: 16px;
  color: var(--text-d);
  line-height: 1.5;
  margin: 0;
}
.visit-detail__phone {
  font-family: var(--f-head);
  font-size: 26px;
  color: var(--navy);
  text-decoration: none;
  transition: color .15s;
}
.visit-detail__phone:hover { color: var(--gold); }
.visit-cta { margin-top: 28px; }

/* ---- HOME PAGE RESPONSIVE ---- */
@media(max-width:1024px){
  .hero__content { padding: 60px 40px; }
  .hero__h1 { font-size: 46px; }
  .why-grid { grid-template-columns: repeat(2,1fr); gap: 28px; }
}
@media(max-width:860px){
  .hero { grid-template-columns: 1fr; }
  .hero__photo { min-height: 280px; }
  .hero__content { padding: 52px 32px; }
  .hero__h1 { font-size: 38px; }
  .services-grid { grid-template-columns: 1fr 1fr; }
  .doctors-inner { grid-template-columns: 1fr; gap: 32px; }
  .doctors-photo { aspect-ratio: 16/9; max-width:500px; }
  .visit-card { grid-template-columns: 1fr; }
  .visit-map { min-height: 220px; }
  .reviews-grid { grid-template-columns: 1fr; max-width: 520px; margin: 0 auto; }
  .stats-row { grid-template-columns: 1fr; gap: 24px; }
  .stat + .stat { border-left: none; border-top: 1px solid var(--border-2); padding-top: 20px; }
  .welcome__h2 { font-size: 30px; }
}
@media(max-width:580px){
  .hero__content { padding: 40px 24px; }
  .hero__h1 { font-size: 32px; }
  .services-grid { grid-template-columns: 1fr; }
  .why-grid { grid-template-columns: 1fr; }
  .appt-form__row { flex-direction: column; gap: 12px; }
  .appt-form__row .wpcf7-form-control-wrap:last-child { flex: 1; }
  .section-header-row { flex-direction: column; gap: 12px; align-items: flex-start; }
  .visit-info { padding: 32px 24px; }
}
/* ==========================================================================
   CRITICAL LAYOUT FIXES
   ========================================================================== */

/* 1. HERO - force grid, Elementor sometimes wins on <section> display */
section.hero,
.site-main section.hero {
  display: grid !important;
  grid-template-columns: 1.08fr .92fr !important;
  min-height: 580px;
  align-items: stretch;
  width: 100%;
}
.hero > .hero__content {
  padding: 72px 56px 72px 80px;
  background: #FBFAF8;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.hero > .hero__photo {
  position: relative;
  background: linear-gradient(160deg,#E8E7F0 0%,#D4D3E0 100%);
  display: flex !important;
  align-items: center;
  justify-content: center;
  border-left: 1px solid #EEEDF1;
  overflow: hidden;
  min-height: 480px;
}

/* 2. CF7 FORM ROW - force flex side by side */
.appt-form .appt-form__row,
.appt-form form .appt-form__row,
.appt-form .wpcf7-form .appt-form__row {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  gap: 12px !important;
  width: 100%;
}

/* CF7 wraps each field in a <span class="wpcf7-form-control-wrap"> */
.appt-form .appt-form__row .wpcf7-form-control-wrap {
  flex: 1 1 0% !important;
  min-width: 0 !important;
  width: auto !important;
  display: block;
}
/* Phone (last in row) - fixed narrower width */
.appt-form .appt-form__row .wpcf7-form-control-wrap.your-phone {
  flex: 0 0 148px !important;
  width: 148px !important;
}

/* 3. FORM INPUTS - aggressive override of CF7 / Elementor defaults */
.appt-form input[type="text"],
.appt-form input[type="tel"],
.appt-form input[type="email"],
.hero .wpcf7 input[type="text"],
.hero .wpcf7 input[type="tel"],
.hero .wpcf7 input[type="email"] {
  display: block !important;
  width: 100% !important;
  height: 52px !important;
  border: 1px solid #DAD9E1 !important;
  border-radius: 10px !important;
  padding: 0 16px !important;
  font-family: 'Archivo', sans-serif !important;
  font-size: 15px !important;
  color: #232140 !important;
  background: #fff !important;
  outline: none !important;
  box-shadow: none !important;
  box-sizing: border-box !important;
  -webkit-appearance: none !important;
  appearance: none !important;
  transition: border-color .15s;
}
.appt-form input[type="text"]:focus,
.appt-form input[type="tel"]:focus,
.appt-form input[type="email"]:focus {
  border-color: #B89150 !important;
  outline: none !important;
}
.appt-form input::placeholder,
.hero .wpcf7 input::placeholder { color: #A6A4B2 !important; }

/* 4. SUBMIT BUTTON - nuclear override */
.appt-form input[type="submit"],
.appt-form .wpcf7-submit,
.hero .wpcf7 input[type="submit"],
.hero .wpcf7 .wpcf7-submit {
  display: block !important;
  width: 100% !important;
  height: 54px !important;
  background: #232140 !important;
  background-color: #232140 !important;
  color: #fff !important;
  border: none !important;
  border-radius: 10px !important;
  font-family: 'Archivo', sans-serif !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  cursor: pointer !important;
  text-align: center !important;
  margin-top: 4px !important;
  padding: 0 !important;
  box-sizing: border-box !important;
  -webkit-appearance: none !important;
  appearance: none !important;
  box-shadow: none !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  transition: background-color .15s;
  line-height: 54px !important;
}
.appt-form input[type="submit"]:hover,
.appt-form .wpcf7-submit:hover,
.hero .wpcf7 input[type="submit"]:hover {
  background: #3a3760 !important;
  background-color: #3a3760 !important;
  color: #fff !important;
}

/* 5. HERO RESPONSIVE overrides (mirror main block) */
@media(max-width:860px){
  section.hero, .site-main section.hero {
    grid-template-columns: 1fr !important;
  }
  .hero > .hero__content { padding: 52px 32px !important; }
  .hero > .hero__photo { min-height: 260px !important; }
}
@media(max-width:580px){
  .hero > .hero__content { padding: 40px 24px !important; }
  .appt-form .appt-form__row { flex-direction: column !important; gap: 12px !important; }
  .appt-form .appt-form__row .wpcf7-form-control-wrap.your-phone { flex: 1 1 0% !important; width: 100% !important; }
}
/* --- CF7 auto-p fallback --- */
.appt-form__row > p,
.appt-form .appt-form__row p {
  display: flex !important;
  flex-direction: row !important;
  gap: 12px !important;
  margin: 0 !important;
  padding: 0 !important;
  align-items: flex-start;
}
.appt-form__row p > .wpcf7-form-control-wrap {
  flex: 1 1 0% !important;
  min-width: 0 !important;
  width: auto !important;
  display: block !important;
}
.appt-form__row p > .wpcf7-form-control-wrap[data-name="your-phone"] {
  flex: 0 0 148px !important;
  width: 148px !important;
}
.appt-form p { margin: 0 !important; }
.appt-form br { display: none !important; }

/* ==========================================================================
   HEADER ALIGNMENT FIX
   Main nav bar + mega menus use same full-width approach as utility bar
   ========================================================================== */
/* Remove auto-margin centering from the main nav inner container */
.hdr-main > .hdr-container,
.hdr-main > .hdr-container.hdr-main__inner {
  max-width: none !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  width: 100%;
  box-sizing: border-box;
  /* keeps padding: 0 var(--gap) from the .hdr-container base rule */
}
/* Mega menus should also span to the same edges */
.mega-wrap .hdr-container,
.mega-wrap > .hdr-container {
  max-width: none !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  width: 100%;
}

/* ==========================================================================
   MOBILE NAV FIXES (2026) - full-width panel, no tap highlight, CTA padding
   ========================================================================== */
@media (max-width: 880px){
  /* Hamburger: kill the stray tap/focus highlight (the red box on some browsers) */
  .hdr-hamburger,
  .hdr-hamburger:hover,
  .hdr-hamburger:focus,
  .hdr-hamburger:active,
  .hdr-hamburger.is-open{
    background:transparent !important;
    border:none !important;
    box-shadow:none !important;
    outline:none !important;
    -webkit-tap-highlight-color:transparent;
  }

  /* Mobile menu spans the full width of the screen */
  .mobile-nav{ width:100%; box-sizing:border-box; }
  .mobile-nav[hidden]{ display:none !important; }
  .mobile-nav:not([hidden]){ display:block; }
  .mobile-nav .mob-nav__list{ width:100%; }
  .mobile-nav .mob-nav__list > li{ width:100%; box-sizing:border-box; }
  .mobile-nav .mob-nav__link,
  .mobile-nav .mob-nav__trigger,
  .mobile-nav .mob-sub,
  .mobile-nav .mob-sub__items a{ width:100%; box-sizing:border-box; }

  /* Request appointment button: comfortable side padding, stays centered */
  .mobile-nav .mob-cta-wrap{ padding:20px 24px; }
  .mobile-nav .mob-cta{
    width:100%;
    justify-content:center;
    text-align:center;
    padding:0 28px;
    box-sizing:border-box;
    white-space:nowrap;
  }
}


/* ==========================================================================
   FAQ TOGGLE BACKGROUND FIX - strip stray Elementor button fill (hover/active/open)
   ========================================================================== */
.sp-faq-q, .sp-faq-q:hover, .sp-faq-q:focus, .sp-faq-q:focus-visible, .sp-faq-q:active,
.sp-faq-item.open .sp-faq-q,
.edx-faq-q, .edx-faq-q:hover, .edx-faq-q:focus, .edx-faq-q:focus-visible, .edx-faq-q:active,
.edx-faq-item.open .edx-faq-q{
  background:transparent !important;
  background-color:transparent !important;
  box-shadow:none !important;
  -webkit-tap-highlight-color:transparent;
}


/* ==========================================================================
   FAQ TOGGLE TEXT COLOR FIX - keep text readable (navy), gold on hover, never white
   ========================================================================== */
.sp-faq-q, .edx-faq-q,
.sp-faq-item.open .sp-faq-q, .edx-faq-item.open .edx-faq-q{
  color:#232140 !important;
}
.sp-faq-q:hover, .sp-faq-q:focus, .sp-faq-q:active,
.edx-faq-q:hover, .edx-faq-q:focus, .edx-faq-q:active{
  color:#B89150 !important;
}


/* Footer address -> Google Business Profile link */
.footer-addr-link{color:inherit;text-decoration:none;transition:color .15s;}
.footer-addr-link:hover{color:#B89150;}

.hdr-util__addr-link{color:inherit;text-decoration:none;transition:color .15s;}
.hdr-util__addr-link:hover{color:var(--gold);}


/* ==========================================================================
   UNIFORM NAV ITEM SIZE - mega-menu triggers match plain links at every width
   ========================================================================== */
.site-header .hdr-nav__link,
.site-header .hdr-nav__btn{ font-size:17px !important; }
@media(max-width:1100px){
  .site-header .hdr-nav__link,
  .site-header .hdr-nav__btn{ font-size:14.5px !important; }
}


/* Footer logo size + social icons */
.footer-logo img,.footer-logo .custom-logo{max-width:100%;}
@media(max-width:860px){
  .footer-logo img,.footer-logo .custom-logo{height:50px !important;}
}
.footer-social{display:flex;gap:12px;margin-top:20px;}
.footer-social a{display:flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:50%;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.16);color:rgba(255,255,255,.82);text-decoration:none;transition:background .15s,color .15s,border-color .15s;}
.footer-social a:hover{background:var(--gold);border-color:var(--gold);color:#fff;}
.footer-social svg{width:17px;height:17px;}