/*
 * Image Dental Care & Implant Centre
 * Color tokens and responsive styling. Customize :root first.
 */
:root {
    --blue:#103f34;
    --blue2:#428b6c;
    --text:#193f36;
    --muted:#637b72;
    --light:#f3f8f2;
    --line:#dbe8dd;
    --white:#fff
}
* {
    box-sizing:border-box
}
html {
    scroll-behavior:smooth;
    scroll-padding-top:90px
}
body {
    margin:0;
    font-family:'DM Sans',sans-serif;
    color:var(--text);
    background:#fff
}
button,input,select {
    font:inherit
}
button {
    cursor:pointer
}
a {
    color:inherit;
    text-decoration:none
}
img {
    display:block;
    max-width:100%
}
.shell {
    width:min(90%,1330px);
    margin:auto
}
.header {
    position:absolute;
    z-index:20;
    top:0;
    left:0;
    width:100%;
    color:#fff
}
.navbar {
    height:105px;
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:20px
}
.brand {
    display:flex;
    gap:10px;
    align-items:center;
    line-height:.95;
    letter-spacing:-.04em;
    font-family:Outfit,sans-serif;
    font-weight:500;
    font-size:23px;
    white-space:nowrap
}
.brand b {
    font-weight:800
}
.brand small {
    display:block;
    font-family:'DM Sans',sans-serif;
    font-size:8px;
    letter-spacing:.22em;
    font-weight:700;
    margin-top:8px
}
.tooth {
    font-size:37px;
    color:#edce6e;
    line-height:1
}
.navlinks {
    display:flex;
    gap:27px;
    align-items:center
}
.navlinks a {
    font-size:13px;
    font-weight:700;
    transition:opacity .2s
}
.navlinks a:hover {
    opacity:.7
}
.nav-actions {
    display:flex;
    gap:14px
}
.button {
    border:1px solid transparent;
    border-radius:8px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:12px;
    padding:16px 24px;
    font-weight:700;
    font-size:14px;
    transition:transform .2s,background .2s,box-shadow .2s;
    text-align:center
}
.button:hover {
    transform:translateY(-2px);
    box-shadow:0 12px 30px #0002
}
.primary {
    background:#367f60;
    color:white
}
.ghost {
    color:white;
    border-color:#ffffff70;
    background:#ffffff0b
}
.dark {
    background:var(--blue);
    color:white
}
.ghost-dark {
    color:var(--blue);
    border-color:#a8d9ce
}
.compact {
    padding:13px 18px
}
.menu {
    display:none;
    color:white;
    font-size:26px;
    background:transparent;
    border:0
}
.hero {
    height:min(860px,100svh);
    min-height:620px;
    position:relative;
    overflow:hidden;
    background:#123e35;
    color:white
}
.slide {
    position:absolute;
    inset:0;
    background-image:var(--bg);
    background-size:cover;
    background-position:center;
    opacity:0;
    transform:scale(1.06);
    transition:opacity 1.2s ease,transform 6s ease
}
.slide.active {
    opacity:1;
    transform:scale(1)
}
.hero-overlay {
    position:absolute;
    inset:0;
    background:linear-gradient(90deg,#082e29f5 0%,#104336d9 32%,#295a4766 66%,#254a3a2b),linear-gradient(0deg,#13392e80,transparent 40%)
}
.hero-inner {
    position:relative;
    z-index:2;
    height:100%;
    display:flex;
    flex-direction:column;
    align-items:flex-start;
    justify-content:center;
    padding-top:90px
}
.kicker {
    display:block;
    color:#3d8765;
    letter-spacing:.16em;
    font-size:12px;
    font-weight:800;
    margin-bottom:22px
}
.bright {
    color:#e9eac1
}
h1,h2,h3,p {
    margin-top:0
}
h1,h2,h3 {
    font-family:Outfit,sans-serif;
    letter-spacing:-.047em
}
h1 {
    font-size:clamp(46px,5.1vw,79px);
    line-height:1.09;
    max-width:850px;
    margin-bottom:25px
}
h1 em,h2 em {
    font-style:normal;
    color:#e8cc73
}
.hero p {
    max-width:580px;
    font-size:17px;
    line-height:1.85;
    color:#e8f3e9
}
.hero-buttons {
    display:flex;
    gap:13px;
    flex-wrap:wrap;
    margin-top:17px
}
.hero-bottom {
    width:100%;
    display:flex;
    justify-content:space-between;
    align-items:end;
    position:absolute;
    bottom:50px;
    left:0
}
.hero-bottom b,.hero-bottom small {
    display:block
}
.hero-bottom b {
    font-size:17px
}
.hero-bottom small {
    font-size:13px;
    color:#d4e8da;
    margin-top:9px
}
.slider-controls {
    display:flex;
    align-items:center;
    gap:18px
}
.slider-controls button {
    width:41px;
    height:41px;
    background:#ffffff1a;
    color:white;
    border:1px solid #ffffff70;
    border-radius:50%;
    font-size:20px
}
.slider-controls span {
    font-size:12px;
    letter-spacing:.15em
}
.infobar {
    background:#18594e;
    color:white
}
.info-grid {
    display:grid;
    grid-template-columns:repeat(3,1fr);
    min-height:155px;
    align-items:center
}
.info-grid>div {
    display:flex;
    gap:22px;
    align-items:center;
    padding:28px 42px;
    border-right:1px solid #ffffff35
}
.info-grid>div:last-child {
    border:0
}
.info-ico {
    font-size:35px;
    color:#5d8de4
}
.info-grid strong {
    display:block;
    font-size:18px;
    margin-bottom:9px
}
.info-grid small {
    font-size:13px;
    color:#bcc7e6;
    line-height:1.6;
    display:block
}
.section {
    padding:115px 0
}
.light {
    background:var(--light)
}
.split {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:clamp(45px,8vw,130px);
    align-items:center
}
h2 {
    font-size:clamp(37px,4.1vw,60px);
    line-height:1.13;
    margin-bottom:28px
}
h3 {
    font-size:29px;
    line-height:1.2
}
p {
    font-size:16px;
    color:var(--muted);
    line-height:1.9
}
.photo-stack {
    position:relative;
    padding:0 60px 45px 0
}
.bigphoto {
    width:86%;
    height:510px;
    object-fit:cover;
    border-radius:150px 18px 18px 18px
}
.smallphoto {
    width:44%;
    height:245px;
    object-fit:cover;
    position:absolute;
    right:0;
    bottom:0;
    border:8px solid white;
    border-radius:20px
}
.since {
    position:absolute;
    top:60px;
    right:0;
    background:#e7f4e9;
    padding:22px;
    border-radius:18px
}
.since b {
    font-size:42px;
    font-family:Outfit,sans-serif
}
.since small {
    font-size:12px;
    display:block
}
.pill-list {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:14px;
    margin:32px 0
}
.pill-list span {
    font-size:13px;
    font-weight:700
}
.section-head {
    text-align:center;
    max-width:780px;
    margin:0 auto 50px
}
.section-head p {
    max-width:630px;
    margin:auto
}
.cards {
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:23px
}
.treatment-card {
    border-radius:17px;
    background:white;
    overflow:hidden;
    box-shadow:0 14px 34px #1829510b;
    transition:transform .2s
}
.treatment-card:hover {
    transform:translateY(-5px)
}
.treatment-card img {
    width:100%;
    height:230px;
    object-fit:cover
}
.card-body {
    padding:26px
}
.card-body span,.num {
    font-size:11px;
    letter-spacing:.13em;
    font-weight:800;
    color:#6085ca
}
.card-body h3 {
    font-size:25px;
    margin:12px 0
}
.card-body p {
    font-size:14px;
    line-height:1.8
}
.card-body a {
    font-size:13px;
    font-weight:800;
    color:#315eb4
}
.intro-align {
    margin-bottom:95px
}
.align-photo img {
    height:540px;
    width:100%;
    object-fit:cover;
    border-radius:140px 20px 20px 20px
}
.slim {
    margin-top:65px
}
.benefits {
    display:flex;
    flex-wrap:wrap;
    justify-content:center;
    gap:12px;
    margin:35px auto 64px;
    max-width:1050px
}
.benefits span {
    background:#edf7ed;
    color:#267e6f;
    border:1px solid #d5e6d6;
    border-radius:100px;
    padding:12px 20px;
    font-size:13px;
    font-weight:700
}
.option-grid {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:22px
}
.option {
    background:#f5f9f1;
    border:1px solid #dce9de;
    border-radius:20px;
    padding:44px
}
.option h3 {
    margin:17px 0
}
.option ul {
    padding-left:21px;
    line-height:2;
    font-size:14px
}
.fine {
    font-size:12px!important;
    color:#697a92
}
.comparison {
    padding:47px 8%;
    text-align:center;
    border-radius:20px;
    background:var(--blue);
    color:white;
    margin-top:30px
}
.comparison h3 {
    font-size:32px
}
.comparison p {
    color:#e0f0e4;
    max-width:750px;
    margin:auto
}
.steps {
    display:grid;
    grid-template-columns:repeat(5,1fr);
    gap:13px
}
.step {
    border-top:3px solid #5e87d7;
    padding:20px 12px
}
.step b {
    color:#5378c7;
    font-size:12px
}
.step h3 {
    font-size:19px;
    margin:17px 0 9px
}
.step p {
    font-size:13px;
    line-height:1.8
}
.travel-note {
    margin:65px 0;
    background:#edf7ed;
    border-radius:18px;
    padding:40px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:40px
}
.travel-note p {
    max-width:760px;
    margin:0
}
.travel-note h3 {
    font-size:27px;
    margin:0 0 10px
}
.faqs {
    max-width:880px;
    margin:0 auto
}
.faqs details {
    border-bottom:1px solid var(--line);
    padding:19px 0
}
.faqs summary {
    font-weight:700;
    cursor:pointer;
    font-size:17px;
    padding-right:24px
}
.faqs p {
    font-size:14px;
    margin:12px 0
}
.smile-cta {
    background:linear-gradient(120deg,#125d53,#4a9a87);
    color:white;
    text-align:center;
    border-radius:24px;
    padding:60px 25px;
    margin-top:75px
}
.smile-cta h3 {
    font-size:35px
}
.smile-cta p {
    color:#e0e7fb
}
.smile-cta button {
    margin:5px
}
.why-list {
    margin-top:25px
}
.why-list>div {
    display:flex;
    gap:25px;
    padding:15px 0;
    border-bottom:1px solid #d9e7da;
    font-weight:700
}
.why-list b {
    color:#367f60
}
.round-photo {
    width:100%;
    height:550px;
    object-fit:cover;
    border-radius:20px 140px 20px 20px
}
.narrow {
    max-width:730px
}
.center {
    text-align:center
}
.tour-grid {
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:22px;
    margin-top:65px
}
.tour-grid article {
    background:white;
    border-radius:14px;
    padding:25px
}
.tour-grid b {
    color:#5381ce
}
.tour-grid h3 {
    font-size:22px;
    margin:14px 0
}
.tour-grid p {
    font-size:13px
}
.contact {
    color:white;
    background:linear-gradient(135deg,#115d52,#268474)
}
.contact h2 {
    color:white
}
.contact p {
    color:#d6e5d7
}
.contact-grid {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:12%;
    align-items:center
}
.contact-detail {
    display:grid;
    gap:9px;
    margin:30px 0;
    color:#e9f2e3
}
.contact-detail span {
    font-size:14px
}
.contact-card {
    background:white;
    color:var(--text);
    border-radius:20px;
    padding:38px
}
.contact-card h3 {
    font-size:30px
}
.contact-card p {
    font-size:13px
}
form label {
    font-size:12px;
    font-weight:700;
    display:block;
    margin:17px 0
}
form input,form select {
    width:100%;
    height:45px;
    border:1px solid #d7e4da;
    border-radius:8px;
    background:#fff;
    color:#245d51;
    padding:10px;
    margin-top:7px
}
.full {
    width:100%
}
.form-status {
    font-size:13px!important;
    color:#287c70!important
}
footer {
    background:#123e36;
    color:white;
    padding:65px 0 20px
}
.footgrid {
    display:grid;
    grid-template-columns:2fr 1fr 1fr 1.8fr;
    gap:45px
}
.footgrid a:not(.brand) {
    display:block;
    color:#dae8dc;
    font-size:13px;
    margin-top:15px
}
.footgrid p {
    font-size:13px;
    color:#c6cfe8;
    line-height:1.7;
    margin-top:25px
}
.footgrid h4 {
    font-size:15px;
    margin:6px 0 25px
}
.foot-bottom {
    margin-top:58px;
    border-top:1px solid #ffffff23;
    padding-top:25px;
    display:flex;
    justify-content:space-between;
    gap:15px;
    font-size:12px;
    color:#bcc6e5
}
.modal {
    position:fixed;
    inset:0;
    z-index:50;
    display:none
}
.modal.open {
    display:block
}
.modal-overlay {
    position:absolute;
    inset:0;
    background:#123e36d9
}
.modal-box {
    position:absolute;
    top:50%;
    left:50%;
    transform:translate(-50%,-50%);
    background:white;
    border-radius:20px;
    width:min(92%,520px);
    padding:38px;
    max-height:92vh;
    overflow-y:auto
}
.modal-box h2 {
    font-size:35px
}
.modal-box p {
    font-size:13px
}
.modal-close {
    position:absolute;
    right:18px;
    top:15px;
    border:0;
    background:transparent;
    font-size:29px
}
.reveal {
    opacity:0;
    transform:translateY(22px);
    transition:opacity .65s ease,transform .65s ease
}
.reveal.visible {
    opacity:1;
    transform:none
}
@media(max-width:1050px) {
    .navlinks {
        gap:13px
    }
    .navlinks a {
        font-size:12px
    }
    .brand {
        font-size:19px
    }
    .cards {
        grid-template-columns:repeat(2,1fr)
    }
    .steps {
        grid-template-columns:repeat(3,1fr)
    }
    .tour-grid {
        grid-template-columns:repeat(2,1fr)
    }
}
@media(max-width:800px) {
    .shell {
        width:min(91%,650px)
    }
    .navbar {
        height:82px
    }
    .navlinks {
        display:none;
        position:absolute;
        top:82px;
        left:0;
        right:0;
        background:#f2faf7;
        padding:22px 5%;
        flex-direction:column;
        align-items:stretch;
        gap:0;
        box-shadow:0 12px 20px #0002
    }
    .navlinks.open {
        display:flex
    }
    .navlinks a {
        font-size:15px;
        padding:13px
    }
    .menu {
        display:block
    }
    .nav-actions .compact {
        display:none
    }
    .hero {
        min-height:700px;
        height:90svh
    }
    .hero-inner {
        padding-top:115px
    }
    .hero-bottom {
        bottom:30px
    }
    .hero p {
        font-size:15px
    }
    .info-grid {
        grid-template-columns:1fr
    }
    .info-grid>div {
        border-right:0;
        border-bottom:1px solid #ffffff35;
        padding:22px 0
    }
    .info-grid>div:last-child {
        border:0
    }
    .section {
        padding:78px 0
    }
    .split,.contact-grid {
        grid-template-columns:1fr;
        gap:45px
    }
    .photo-stack {
        max-width:550px
    }
    .cards,.option-grid {
        grid-template-columns:1fr
    }
    .steps {
        grid-template-columns:repeat(2,1fr)
    }
    .travel-note {
        flex-direction:column;
        align-items:flex-start
    }
    .footgrid {
        grid-template-columns:repeat(2,1fr);
        gap:28px
    }
    .tour-grid {
        grid-template-columns:1fr 1fr
    }
    .round-photo {
        height:390px
    }
    .align-photo img {
        height:360px
    }
    .intro-align {
        margin-bottom:60px
    }
}
@media(max-width:520px) {
    .hero {
        min-height:660px
    }
    .hero-inner {
        justify-content:center
    }
    .hero h1 {
        font-size:42px
    }
    .hero-buttons {
        width:100%
    }
    .hero-buttons .button {
        padding:13px
    }
    .hero-bottom small {
        font-size:11px
    }
    .section {
        padding:65px 0
    }
    h2 {
        font-size:36px
    }
    .photo-stack {
        padding:0 30px 30px 0
    }
    .bigphoto {
        height:370px
    }
    .smallphoto {
        height:175px
    }
    .since {
        padding:14px
    }
    .since b {
        font-size:28px
    }
    .pill-list {
        grid-template-columns:1fr
    }
    .cards,.option-grid,.steps,.tour-grid,.footgrid {
        grid-template-columns:1fr
    }
    .option {
        padding:28px
    }
    .smile-cta {
        padding:40px 20px
    }
    .contact-card {
        padding:25px
    }
    .foot-bottom {
        flex-direction:column
    }
    .info-grid strong {
        font-size:16px
    }
    .slide {
        background-position:55% center
    }
}
@media(prefers-reduced-motion:reduce) {
    *,*:before,*:after {
        scroll-behavior:auto!important;
        animation:none!important;
        transition:none!important
    }
    .reveal {
        opacity:1;
        transform:none
    }
}

/* Green / ivory / muted yellow design refinements */
:root  {
     --accent-yellow: #f0d77d;
     --forest-deep: #103f34;
}
.header .tooth  {
     color: var(--accent-yellow);
}
.hero-overlay  {
     background: linear-gradient(90deg, rgba(7,43,35,.94) 0%, rgba(13,59,45,.79) 34%, rgba(17,60,46,.33) 68%, rgba(22,53,38,.14) 100%);
}
.hero h1 em  {
     color: var(--accent-yellow);
}
.hero .slide  {
     background-position: center 43%;
}
.primary:hover  {
     background: #23694f;
}
.infobar  {
     background: #103f34;
}
.image-note  {
     max-width: 900px;
     margin: 0 auto;
     padding: 12px 22px 24px;
     font-size: 11px;
     opacity: .72;
     text-align: center;
}
.button:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible, summary:focus-visible  {
     outline: 3px solid var(--accent-yellow);
     outline-offset: 3px;
}
@media (max-width: 780px)  {
     .hero  {
         min-height: 680px;
    }
     .hero-overlay  {
         background: linear-gradient(90deg,rgba(7,43,35,.91),rgba(12,56,43,.55));
    }
     .hero .slide  {
         background-position: 59% center;
    }
}


/* ===========================================================
   LOGO-BASED BRAND UPDATE (v3)
   Kept original full-bleed hero slider and page structure.
   Colors: white / turquoise green / warm yellow.
   =========================================================== */
:root {
  --blue: #287c70;
  --blue2: #74bbb2;
  --text: #293e3b;
  --muted: #617b76;
  --light: #f2faf7;
  --line: #d9ece7;
  --accent-yellow: #e4bc7d;
  --forest-deep: #287c70;
}
.header {
  color: #263d39;
  background: rgba(255, 255, 255, .96);
  box-shadow: 0 2px 22px rgba(24, 78, 70, .06);
}
.brand-logo {
  flex: 0 0 auto;
  max-width: 220px;
}
.brand-logo img {
  width: 215px;
  height: auto;
  max-height: 81px;
  object-fit: contain;
}
.navlinks a { color:#293e3b; }
.menu { color:#293e3b; }
.primary {
  background: linear-gradient(105deg, #7bc4b7, #e7c58b);
  color: #243d38;
}
.primary:hover { background:linear-gradient(105deg,#60b7a8,#dfb472); }
.dark { background:#237b71; color:white; }
.hero { background:#22786e; }
.hero-overlay {
  background: linear-gradient(90deg,rgba(20,91,79,.92) 0%,rgba(30,109,92,.78) 32%,rgba(25,102,83,.36) 66%,rgba(27,110,95,.12) 100%),linear-gradient(0deg,rgba(18,91,74,.24),transparent 45%);
}
.hero h1 em { color:#ffe0a2; }
.infobar { background:#268779; }
.info-ico { color:#ffe0a2; }
.kicker { color:#2c9081; }
.kicker.bright { color:#e9ca8e; }
.ghost-dark { border-color:#8ac9be; }

/* Dentist section deliberately separate from the homepage slider. */
.doctor-section { background: #f2faf7; }
.doctor-layout {
  display:grid;
  grid-template-columns:minmax(240px,.8fr) minmax(0,1.2fr);
  align-items:center;
  gap:clamp(28px,6vw,90px);
}
.doctor-image {
  background: white;
  border-radius: 34px;
  overflow:hidden;
  box-shadow: 0 18px 55px rgba(34,105,93,.12);
  border: 1px solid #e1efea;
  max-width: 440px;
}
.doctor-image img { display:block; width:100%; height:auto; }
.doctor-details h3 { font-size: 25px; color:#267e72; margin:18px 0 8px; }
.doctor-details p { color:#617b76; max-width:600px; }
.doctor-verification { font-size:13px; }
.doctor-details .button { margin-top:16px; }
@media (max-width:1050px) {
  .brand-logo img { width:185px; }
  .navlinks { gap:16px; }
}
@media (max-width:800px) {
  .doctor-layout { grid-template-columns:1fr; }
  .doctor-image { width:min(420px,100%); margin:auto; }
  .brand-logo img { width:175px; }
  .header { background:rgba(255,255,255,.97); }
  .navlinks.open { background:#fff; color:#293e3b; }
}
@media (max-width:520px) {
  .brand-logo img { width:155px; }
  .doctor-layout {gap:26px;}
}


/* ==========================================================
   FINAL LAYOUT AND BRAND CORRECTIONS — October 2026
   Keep color palette to white / teal-green / warm gold.
   These rules intentionally supersede older theme declarations.
   ========================================================== */
:root { --blue:#277d70; --blue2:#70b7a7; --text:#24433a; --accent-yellow:#e8c77c; }
html,body { overflow-x:clip; }
.header { background:rgba(255,255,255,.98); color:#26433e; }
.navbar { min-height:76px; height:auto; padding-block:10px; }
.brand-logo, .brand-logo img { flex-shrink:0; }
.brand-logo img { width:clamp(120px,12vw,158px) !important; height:auto; max-height:66px; object-fit:contain; }
.navlinks { gap:clamp(8px,1.1vw,20px); }
.navlinks a { color:#24433a; white-space:nowrap; }
.nav-dropdown { display:flex;align-items:center;gap:2px;position:relative; }
.dropdown-toggle { border:0;background:transparent;color:#246f61;font-size:20px;padding:5px 7px;line-height:1; }
.dropdown-menu { display:none;position:absolute;top:100%;left:0;min-width:290px;background:white;border-radius:12px;padding:9px;box-shadow:0 20px 48px #174c3d30;border:1px solid #d9e8e2;z-index:50; }
.dropdown-menu a { display:block;font-size:13px;padding:10px 12px;border-radius:7px;color:#25453d;white-space:normal; }
.dropdown-menu a:hover,.dropdown-menu a:focus-visible { background:#e8f5ef;opacity:1; }
.nav-dropdown:hover .dropdown-menu,.nav-dropdown:focus-within .dropdown-menu,.nav-dropdown.expanded .dropdown-menu { display:block; }
.menu { color:#27685d; }
.hero { min-height:720px;height:auto; }
.hero-inner { min-height:720px;height:auto; padding-top:145px;padding-bottom:50px;justify-content:center;gap:0; }
.hero h1 { font-size:clamp(40px,5vw,72px);max-width:820px;overflow-wrap:break-word; }
.hero p { max-width:610px; }
.hero-buttons { margin-top:22px;position:relative;z-index:2; }
.hero-bottom { position:static !important; margin-top:clamp(32px,6vh,75px);width:100%;align-items:center;gap:22px; }
.hero-bottom > span { flex:1;min-width:0; }
.hero-bottom small { white-space:normal; }
.slider-controls { flex-shrink:0; }
.infobar { background:#217a6e !important; }
.info-ico { color:#f1d08b; }
.primary { background:linear-gradient(105deg,#80c9b7,#e8c783);color:#193f35; }
.dark { background:#26796d; }
.ghost-dark { color:#26796d;border-color:#91c8bc; }
.kicker { color:#328778; }
.kicker.bright { color:#f1ce83; }
.card-body a, .treatment-card a, .why-list b { color:#247d6c !important; }
.comparison { background:linear-gradient(120deg,#216f65,#5ca991) !important; }
.travel-note { background:linear-gradient(120deg,#eaf6ed,#faf2dd) !important; }
.contact { background:linear-gradient(120deg,#125b52,#288676) !important; }
.contact h2 em,.smile-cta h3 em { color:#f1d38e; }
.contact-card .form-status {color:#237f6f!important;}
footer { background:#123e36 !important; }
footer a:hover { color:#e8c783; }
.doctor-section { background:#f2faf7; }
/* Service inner pages */
.service-page { padding-top:112px; }
.service-banner { background:linear-gradient(115deg,#125b52,#2c8a77);padding:88px 0 78px;color:white; }
.service-banner .kicker { color:#f1d38e; }
.service-banner h1 { font-size:clamp(38px,5vw,65px);max-width:900px;line-height:1.12; }
.service-banner p { max-width:850px;color:#ebf6f1;font-size:18px; }
.service-banner .button {margin-top:18px;}
.service-content { padding:70px 0 100px; }
.service-layout {display:grid;grid-template-columns:minmax(0,1fr) minmax(245px,.34fr);gap:55px;align-items:start;}
.service-article {min-width:0;}
.service-article h2 {font-size:clamp(27px,3.4vw,42px);color:#225e53;margin:42px 0 16px;}
.service-article h2:first-child {margin-top:0;}
.service-article h3 {font-size:23px;margin:24px 0 10px;color:#254a41;}
.service-article p,.service-article li {font-size:16px;color:#537069;line-height:1.8;}
.service-article ul,.service-article ol {padding-left:24px;}
.service-article li {margin-bottom:9px;}
.service-sidebar {position:sticky;top:95px;background:#f3faf7;border:1px solid #d8ece3;padding:25px;border-radius:20px;}
.service-sidebar h3 {font-size:22px;color:#235e52;}
.service-sidebar a:not(.button) {display:block;padding:11px 0;border-bottom:1px solid #d9ebe4;color:#2b665a;font-weight:600;font-size:14px;}
.service-sidebar a.active {color:#a47b36;}
.service-sidebar .button {margin-top:20px;width:100%;text-align:center;}
.service-faq {background:#f3faf7;border:1px solid #d8ece4;border-radius:12px;padding:0 20px;margin:12px 0;}
.service-faq summary {padding:17px 0;cursor:pointer;font-weight:700;color:#225c51;}
.service-faq p {margin-top:0;}
.service-cta {background:#eaf7f0;border-radius:20px;padding:26px;margin-top:50px;}
@media(max-width:1080px) { .navlinks {gap:10px;} .navlinks a {font-size:12px;} }
@media(max-width:800px) {
  .navbar {min-height:76px;}
  .navlinks {top:100%;max-height:calc(100dvh - 76px);overflow:auto;}
  .nav-dropdown {flex-wrap:wrap;width:100%;justify-content:space-between;}
  .dropdown-label {flex:1;}
  .dropdown-menu {position:static;min-width:0;width:100%;box-shadow:none;border:0;background:#f0f8f4;}
  .navlinks .dropdown-menu a {font-size:13px;padding:10px 12px;}
  .hero,.hero-inner {min-height:700px;}
  .hero-inner {padding-top:120px;padding-bottom:40px;}
  .hero-bottom {margin-top:34px;}
  .service-layout {grid-template-columns:1fr;}
  .service-sidebar {position:static;}
  .service-page {padding-top:76px;}
}
@media(max-width:520px) {
  .navbar {min-height:72px;}
  .brand-logo img {width:120px !important;max-height:60px;}
  .hero,.hero-inner {min-height:730px;}
  .hero-inner {padding-top:105px;padding-bottom:32px;}
  .hero h1 {font-size:clamp(33px,9vw,43px);line-height:1.12;}
  .hero-buttons {flex-direction:column;align-items:stretch;width:100%;}
  .hero-buttons .button {width:100%;white-space:normal;text-align:center;min-height:46px;}
  .hero-bottom {align-items:flex-start;gap:12px;flex-wrap:wrap;}
  .slider-controls {margin-left:auto;}
  .service-banner {padding:64px 0 55px;}
  .service-content {padding:52px 0 70px;}
}
@media(prefers-reduced-motion:reduce) { .slide {transition:none!important;} .reveal {transform:none!important;transition:none!important;opacity:1!important;} }


/* ==========================================
   Treatments navigation — refined dropdown
   One aligned clickable control + card menu
   ========================================== */
.navlinks .nav-dropdown { position:relative; display:flex; align-items:center; flex:0 0 auto; }
.navlinks .dropdown-trigger {
  display:inline-flex; align-items:center; justify-content:center; gap:9px;
  border:1px solid transparent; border-radius:10px;
  background:transparent; color:#24483e; font:inherit; font-weight:700;
  line-height:1.2; padding:11px 12px; white-space:nowrap;
  cursor:pointer; transition:color .2s,background .2s,border-color .2s;
}
.navlinks .dropdown-trigger:hover,
.navlinks .dropdown-trigger:focus-visible,
.navlinks .nav-dropdown.expanded .dropdown-trigger {
  background:#eaf7ef; border-color:#c7e6d7; color:#176c57;
}
.navlinks .dropdown-trigger:focus-visible {outline:2px solid #28856a;outline-offset:2px;}
.dropdown-chevron {flex:none;transition:transform .2s ease;}
.nav-dropdown.expanded .dropdown-chevron {transform:rotate(180deg);}
.navlinks .dropdown-menu {
  display:block; position:absolute; top:calc(100% + 12px); left:50%;
  transform:translate(-50%,-7px); width:min(570px,calc(100vw - 32px));
  padding:18px; border:1px solid #dbeae2; border-radius:18px;
  background:#fff; box-shadow:0 22px 60px rgba(16,69,47,.17);
  z-index:100; opacity:0; visibility:hidden; pointer-events:none;
  transition:opacity .18s ease,transform .18s ease,visibility .18s ease;
}
.navlinks .nav-dropdown.expanded .dropdown-menu {
  opacity:1;visibility:visible;pointer-events:auto;transform:translate(-50%,0);
}
.navlinks .dropdown-heading {
  margin:0 0 11px; padding:0 7px 10px;
  color:#4d7e6c; font-size:12px; font-weight:800;
  letter-spacing:.09em; text-transform:uppercase; border-bottom:1px solid #e9f0eb;
}
.navlinks .dropdown-items {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:5px;}
.navlinks .dropdown-items a {
  display:flex;justify-content:space-between;align-items:center;gap:10px;
  padding:13px 12px; border-radius:10px;
  color:#23483b; font-size:13px; font-weight:650; white-space:normal;
  line-height:1.35; transition:background .18s,color .18s;
}
.navlinks .dropdown-items a span {color:#70a991;font-size:17px;flex:none;}
.navlinks .dropdown-items a:hover,.navlinks .dropdown-items a:focus-visible {
  background:#eaf7ef; color:#176c57;
}
@media (max-width:800px) {
  .navlinks .nav-dropdown {width:100%;display:block;}
  .navlinks .dropdown-trigger {width:100%;justify-content:space-between;padding:13px 14px;}
  .navlinks .dropdown-menu {
    position:static;left:auto;top:auto;transform:none !important;
    width:100%;min-width:0;padding:0 8px;max-height:0;overflow:hidden;
    opacity:0;visibility:hidden;box-shadow:none;border:0;border-radius:12px;
    background:#f1f8f4;transition:max-height .24s ease,opacity .18s ease,padding .18s ease;
  }
  .navlinks .nav-dropdown.expanded .dropdown-menu {
    max-height:700px;visibility:visible;opacity:1;padding:12px 8px;margin-top:5px;
  }
  .navlinks .dropdown-items {grid-template-columns:1fr;}
  .navlinks .dropdown-items a {padding:11px 12px;font-size:13px;}
}
@media (prefers-reduced-motion:reduce) {
  .navlinks .dropdown-menu,.dropdown-chevron {transition:none;}
}

/* Header stability: nav never wraps outside its row. */
.navbar {display:flex;align-items:center;justify-content:space-between;flex-wrap:nowrap;gap:14px;}
.navlinks {display:flex;align-items:center;justify-content:center;flex:1 1 auto;min-width:0;gap:clamp(8px,1.1vw,17px);}
.navlinks > a, .navlinks > .nav-dropdown {flex:0 0 auto;}
.nav-actions {display:flex;align-items:center;flex:0 0 auto;}
.navlinks .dropdown-trigger {font-size:13px;padding:9px 8px;}
@media(max-width:1160px) {
  .navlinks {display:none;position:absolute;top:100%;left:0;right:0;flex-direction:column;align-items:stretch;justify-content:flex-start;gap:0;padding:15px max(20px,5%);background:white;box-shadow:0 16px 30px rgba(0,0,0,.1);max-height:calc(100dvh - 76px);overflow-y:auto;}
  .navlinks.open {display:flex;}
  .navlinks > a {width:100%;font-size:15px;padding:13px;}
  .navlinks .nav-dropdown {width:100%;display:block;}
  .navlinks .dropdown-trigger {width:100%;display:flex;justify-content:space-between;font-size:15px;padding:13px;}
  .navlinks .dropdown-menu {position:static;left:auto;top:auto;transform:none!important;width:100%;min-width:0;padding:0;max-height:0;overflow:hidden;opacity:0;visibility:hidden;pointer-events:none;box-shadow:none;border:0;border-radius:12px;background:#f1f8f4;transition:max-height .2s ease,opacity .2s ease;}
  .navlinks .nav-dropdown.expanded .dropdown-menu {max-height:650px;opacity:1;visibility:visible;pointer-events:auto;padding:12px;margin-top:5px;}
  .navlinks .dropdown-items {grid-template-columns:1fr;}
  .menu {display:block;}
  .nav-actions .compact {display:none;}
}


/* === ABOUT PAGE: responsive sections and team profiles === */
.about-page {overflow:clip;color:#23493d;}
.about-intro {padding:90px 0 84px;background:linear-gradient(120deg,#f0f8f3 0%,#ffffff 58%,#f9f3e3 100%);}
.about-intro-layout {display:grid;grid-template-columns:1.08fr .92fr;align-items:center;gap:clamp(32px,6vw,100px);}
.about-intro h1 {font-size:clamp(42px,5.5vw,76px);line-height:1.06;letter-spacing:-.035em;margin:14px 0 24px;color:#153d34;}
.about-intro h1 em,.about-page h2 em {color:#48977c;font-style:normal;}
.about-intro p {font-size:clamp(16px,1.5vw,20px);max-width:590px;line-height:1.75;color:#536d64;}
.about-intro .button {margin-top:20px;}
.about-intro-photo {border-radius:28px;overflow:hidden;background:#e6f2eb;max-width:440px;justify-self:center;box-shadow:0 20px 70px #0b3a2619;}
.about-intro-photo img {width:100%;height:480px;object-fit:cover;object-position:center 25%;}
.about-story-layout {display:grid;grid-template-columns:1fr 1fr;gap:65px;align-items:center;}
.about-page h2 {font-size:clamp(35px,4vw,58px);line-height:1.1;letter-spacing:-.03em;color:#183e34;margin:15px 0 24px;}
.about-page p {line-height:1.78;}
.about-story-points {display:grid;gap:14px;}
.about-story-points>div {display:grid;grid-template-columns:45px 1fr;gap:2px 12px;border-bottom:1px solid #dce9df;padding:15px 0;}
.about-story-points span {grid-row:span 2;color:#439a79;font-size:21px;font-weight:800;}
.about-story-points strong {font-size:19px;}
.about-story-points p {margin:0;color:#658078;}
.about-value-grid {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:23px;}
.about-value-card {border:1px solid #dcece2;border-radius:24px;background:#fff;padding:38px;box-shadow:0 9px 28px #14352709;}
.about-value-card h3 {font-size:28px;margin:12px 0;}
.about-value-card p {color:#5c746b;}
.value-icon {display:grid;place-items:center;width:55px;height:55px;background:#e8f6ec;color:#338768;border-radius:16px;font-size:25px;}
.about-milestones {padding:34px 0;background:#155345;color:#fff;}
.milestone-grid {display:grid;grid-template-columns:.7fr 1fr 1.65fr;gap:28px;}
.milestone-grid>div {display:flex;flex-direction:column;gap:5px;border-right:1px solid #ffffff30;padding:15px 27px 15px 0;}
.milestone-grid>div:last-child {border:0;}
.milestone-grid strong {font-size:clamp(23px,2.5vw,38px);font-weight:800;color:#eed38b;}
.milestone-grid span {color:#e7f3e8;font-size:14px;line-height:1.6;}
.about-team-section .section-head {max-width:800px;}
.founder-feature {display:grid;grid-template-columns:.72fr 1.28fr;gap:40px;align-items:center;background:#eaf6ed;border:1px solid #d3eadd;border-radius:26px;padding:30px;margin:35px 0 70px;}
.founder-image {border-radius:22px;overflow:hidden;max-height:480px;background:#fff;}
.founder-image img {width:100%;height:480px;object-fit:cover;object-position:center 20%;}
.founder-feature h3 {font-size:clamp(29px,3vw,42px);margin:10px 0;color:#174f40;}
.founder-feature strong {display:block;color:#368b70;margin-bottom:15px;font-size:16px;}
.founder-feature p {color:#50695f;}
.team-heading {margin:55px 0 23px;}
.team-heading h3 {font-size:clamp(25px,3vw,34px);margin:0;color:#1a4d40;}
.team-heading p {margin:7px 0;color:#64796f;}
.team-profile-grid {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;}
.team-profile {border:1px solid #dfebe5;border-radius:20px;overflow:hidden;background:#fff;box-shadow:0 12px 26px #0e43230b;}
.team-photo {height:290px;background:#e7f1e9;overflow:hidden;display:flex;justify-content:center;align-items:center;}
.team-photo img {height:100%;width:100%;object-fit:cover;object-position:center 20%;}
.team-no-photo {background:linear-gradient(135deg,#d5ecde,#f6ebca);}
.team-no-photo span {display:grid;place-items:center;width:105px;height:105px;border:2px solid #478d75;border-radius:50%;font-size:38px;color:#246c53;font-weight:700;}
.team-profile-body {padding:22px;}
.team-profile-body h4 {margin:0 0 4px;font-size:22px;line-height:1.3;color:#214c3e;}
.team-profile-body>span {font-size:14px;font-weight:700;color:#538b6e;}
.team-profile-body p {color:#64786c;margin:10px 0 0;font-size:14px;}
.team-gallery {display:grid;grid-template-columns:repeat(3,1fr);gap:18px;}
.team-gallery img {width:100%;aspect-ratio:3/4;object-fit:cover;object-position:top;border-radius:17px;background:#ecf1e9;}
.about-last-cta {background:#f0f7f2;}
.about-cta-inner {display:flex;justify-content:space-between;align-items:center;gap:30px;}
.about-cta-inner h2 {max-width:700px;}
.about-cta-inner p {color:#667d73;}
@media(max-width:980px){.about-intro-layout,.about-story-layout,.founder-feature {grid-template-columns:1fr;}.about-intro-photo{max-width:360px;}.team-profile-grid{grid-template-columns:repeat(2,minmax(0,1fr));}.milestone-grid{grid-template-columns:repeat(2,1fr);}.milestone-grid .milestone-patients{grid-column:1/-1;}.about-cta-inner{flex-direction:column;align-items:flex-start;}}
@media(max-width:610px){.about-intro{padding:50px 0 65px;}.about-intro h1{font-size:clamp(38px,10vw,54px);}.about-intro-photo img{height:350px;}.about-value-grid,.team-profile-grid,.team-gallery,.milestone-grid{grid-template-columns:1fr;}.milestone-grid .milestone-patients{grid-column:auto;}.milestone-grid>div{border-right:0;border-bottom:1px solid #ffffff30;padding:10px 0 18px;}.founder-feature{padding:15px;margin-bottom:48px;}.founder-image img{height:350px;}.team-photo{height:310px;}.about-value-card{padding:26px;}}

/* About page content must be visible even if scripts are blocked. */
.about-page .reveal { opacity: 1; transform: none; }

/* NOV 2026: about image, staff row, service journeys, reviews/map and lead form */
.about-intro-photo{width:min(100%,390px);aspect-ratio:3/4;align-self:center;display:flex;align-items:center;justify-content:center;}
.about-intro-photo img{display:block;width:100%;height:100%;min-height:0;object-fit:contain;object-position:center center;}
.team-profile-grid.support-four{grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;}
.support-four .team-photo{height:245px;}.support-four .team-profile-body{padding:18px;}.support-four .team-profile-body h4{font-size:19px;}
@media(max-width:1080px){.team-profile-grid.support-four{grid-template-columns:repeat(2,minmax(0,1fr));}.support-four .team-photo{height:285px;}}
@media(max-width:580px){.team-profile-grid.support-four{grid-template-columns:1fr;}.support-four .team-photo{height:360px;}.about-intro-photo{max-width:320px;}}
.process-gallery{padding:72px 0;background:#f4f8f3;}.process-heading{max-width:740px;margin-bottom:30px;}.process-heading h2{font-size:clamp(30px,4vw,46px);color:#185344;margin:10px 0;}.process-heading p{color:#61786f;}.process-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;}.process-card{background:white;border:1px solid #dae9df;border-radius:20px;overflow:hidden;box-shadow:0 10px 24px #0c412110;}.process-card img{width:100%;aspect-ratio:4/3;object-fit:cover;}.process-card-body{padding:20px 22px 24px;}.process-card-body span{font-size:12px;font-weight:800;color:#438b73;letter-spacing:.1em;}.process-card-body h3{font-size:22px;color:#1f5042;margin:8px 0;}.process-card-body p{color:#60786d;margin:0;}
@media(max-width:780px){.process-grid{grid-template-columns:1fr 1fr;}}@media(max-width:560px){.process-grid{grid-template-columns:1fr;}}
.reviews-location{background:#fafbf9;}.reviews-map-grid{display:grid;grid-template-columns:0.8fr 1.2fr;gap:25px;align-items:stretch;}.reviews-panel,.map-panel{border:1px solid #d9e8df;border-radius:24px;background:white;overflow:hidden;}.reviews-panel{padding:32px;display:flex;flex-direction:column;align-items:flex-start;}.reviews-panel h3{font-size:27px;color:#1f5848;margin:10px 0;}.reviews-panel p{color:#667e74;}.review-icon{font-size:28px;color:#d4a64e;}.reviews-panel .button{margin-top:20px;}.reviews-panel .review-note{font-size:12px;margin-top:20px;}.map-panel iframe{width:100%;min-height:300px;display:block;border:0;}.map-caption{padding:18px 24px;}.map-caption strong{color:#164c40;}.map-caption p{font-size:14px;color:#607469;margin:5px 0;}.map-caption a{color:#287760;font-weight:700;}@media(max-width:780px){.reviews-map-grid{grid-template-columns:1fr;}}
.lead-lock{overflow:hidden;}.lead-overlay[hidden]{display:none!important;}.lead-overlay{position:fixed;z-index:10000;inset:0;display:grid;place-items:center;padding:18px;}.lead-backdrop{position:absolute;inset:0;background:#0a2824b5;backdrop-filter:blur(6px);}.lead-dialog{position:relative;display:grid;grid-template-columns:0.85fr 1fr;width:min(840px,100%);max-height:min(92dvh,850px);overflow:auto;border-radius:23px;background:#fff;box-shadow:0 25px 100px #0004;}.lead-close{position:absolute;z-index:2;top:12px;right:14px;background:#eff6f1;border:0;border-radius:100%;width:40px;height:40px;font-size:25px;color:#185241;cursor:pointer;}.lead-aside{background:linear-gradient(155deg,#155344,#287d68);color:white;padding:42px 28px;display:flex;flex-direction:column;justify-content:center;}.lead-aside>img{width:205px;max-width:85%;margin-bottom:36px;background:#fff;border-radius:10px;padding:8px;}.lead-kicker{color:#efd08c;font-weight:800;letter-spacing:.13em;font-size:12px;}.lead-aside h2{color:white;font-size:clamp(25px,3vw,37px);line-height:1.18;margin:14px 0;}.lead-aside p{color:#d8ede5;}.lead-contact{display:grid;gap:8px;margin-top:26px;font-weight:700;}.lead-contact a{color:#ffe1a5;}.lead-form-wrap{padding:44px 36px 30px;}.lead-form-wrap h2{font-size:30px;color:#185444;line-height:1.14;margin:12px 0 10px;}.lead-form-wrap>p{font-size:14px;color:#687970;}.lead-form-wrap form{display:grid;gap:13px;margin-top:22px;}.lead-form-wrap label{display:grid;gap:5px;color:#335248;font-size:13px;font-weight:700;}.lead-form-wrap input,.lead-form-wrap select{width:100%;min-width:0;min-height:45px;border:1px solid #cdded4;border-radius:10px;padding:10px 13px;background:white;color:#234d40;font:inherit;}.lead-form-wrap .lead-consent{display:flex;align-items:flex-start;gap:9px;font-size:12px;font-weight:500;}.lead-consent input{min-height:0;width:17px;min-width:17px;height:17px;margin-top:2px;}.lead-submit{border:0;border-radius:10px;background:linear-gradient(110deg,#7dc7b2,#eed088);color:#173f35;padding:13px 18px;font-weight:800;cursor:pointer;}.lead-call{margin-top:16px;color:#60776b;}.lead-call a{font-weight:800;color:#25765d;}.lead-status{margin:0;color:#215b46;font-size:12px;}.lead-fab{position:fixed;right:20px;bottom:19px;z-index:700;border:0;border-radius:100px;background:linear-gradient(100deg,#7dcbb5,#f1d18d);color:#174f42;padding:14px 18px;font-weight:800;box-shadow:0 10px 24px #183f2e40;cursor:pointer;}.lead-fab span{margin-left:8px;}@media(max-width:680px){.lead-dialog{grid-template-columns:1fr;max-height:94dvh;}.lead-aside{padding:20px 24px;}.lead-aside>img{width:140px;margin-bottom:12px;}.lead-aside h2{font-size:22px;margin:8px 0;}.lead-aside p,.lead-contact{display:none;}.lead-form-wrap{padding:26px 22px;}.lead-form-wrap h2{font-size:25px;}.lead-fab{right:12px;bottom:12px;}}

/* ===== Founder portrait refinement (About page only) ===== */
.about-intro-photo {
  position: relative; width: min(100%, 410px); max-width: 100%;
  aspect-ratio: 4 / 5; min-height: 0; padding: 16px 16px 0;
  overflow: hidden; align-self: center; justify-self: center;
  display: flex; align-items: flex-end; justify-content: center;
  border-radius: 42px 42px 30px 30px;
  background: linear-gradient(145deg, #e0f1e9 0%, #f6faf6 52%, #e7d9ad 100%);
  box-shadow: 0 24px 56px rgba(27, 82, 64, .12);
  isolation: isolate;
}
.about-intro-photo::before {
  content: ''; position: absolute; z-index: -1; width: 85%; aspect-ratio: 1;
  border-radius: 50%; background: rgba(134,203,176,.28);
  bottom: -24%; left: 8%;
}
.about-intro-photo img {
  width: 100%; height: 100%; max-height: none; min-height: 0;
  object-fit: contain; object-position: center bottom;
  filter: saturate(.98) contrast(1.015);
}
@media (max-width: 680px) {
  .about-intro-photo { width: min(100%, 345px); aspect-ratio: 4/5; padding: 12px 12px 0; }
  .about-intro-photo img { height: 100%; object-fit: contain; object-position: center bottom; }
}
/* Visible, unobtrusive WhatsApp confirmation */
.form-status.whatsapp-ready { color: #147559; font-weight: 700; line-height: 1.5; }


/* =====================================================
   ENQUIRY POPUP — SMOOTH OPEN / CLOSE TRANSITIONS
   The popup is initially hidden by its [hidden] attribute.
   When shown, .is-visible fades in the overlay and lifts the dialog.
===================================================== */
.lead-overlay:not([hidden]) {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity 320ms ease, visibility 320ms ease;
}

.lead-overlay.is-visible:not([hidden]) {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}

.lead-overlay .lead-dialog {
  opacity: 0;
  transform: translateY(18px) scale(0.97);
  transition: transform 320ms cubic-bezier(.2,.8,.2,1), opacity 320ms ease;
  will-change: transform, opacity;
}

.lead-overlay.is-visible .lead-dialog {
  opacity: 1;
  transform: translateY(0) scale(1);
}

@media (prefers-reduced-motion: reduce) {
  .lead-overlay:not([hidden]),
  .lead-overlay .lead-dialog {
    transition-duration: 0ms;
  }
}