:root {
      --blue: #1976d2;
      --blue-dark: #0759ad;
      --green: #20c92d;
      --green-dark: #0da91c;
      --ink: #207add;
      --muted: #64748b;
      --light: #f5fbff;
      --line: #e6eef5;
      --white: #fff;
      --shadow: 0 18px 50px rgba(16, 35, 61, .10);
    }

    html { scroll-behavior: smooth; }
    body {
      font-family: "Manrope", sans-serif;
      color: var(--ink);
      background: #fff;
      overflow-x: hidden;
    }

    a { text-decoration: none; }
    section { scroll-margin-top: 85px; }

    .topbar {
      background: var(--ink);
      color: #dce8f4;
      font-size: .86rem;
    }
    .topbar a { color: #fff; }

    .navbar {
      background: rgba(255,255,255,.94);
      backdrop-filter: blur(12px);
      box-shadow: 0 4px 20px rgba(16,35,61,.06);
    }
    .navbar-brand img {
      width: 150px;
      height: auto;
      object-fit: contain;
    }
    .nav-link {
      color: var(--ink) !important;
      font-weight: 700;
      font-size: .93rem;
      margin: 0 .25rem;
    }
    .nav-link:hover { color: var(--blue) !important; }

    .btn-main {
      background: linear-gradient(135deg, var(--blue), #2d8de7);
      color: #fff;
      border: 0;
      border-radius: 50px;
      padding: 13px 23px;
      font-weight: 800;
      box-shadow: 0 12px 25px rgba(25,118,210,.22);
      transition: .25s ease;
    }
    .btn-main:hover {
      color: #fff;
      transform: translateY(-2px);
      box-shadow: 0 16px 30px rgba(25,118,210,.30);
    }
    .btn-green {
      background: var(--green);
      color: #fff;
      border: 0;
      border-radius: 50px;
      padding: 13px 23px;
      font-weight: 800;
      transition: .25s ease;
    }
    .btn-green:hover { background: var(--green-dark); color: #fff; transform: translateY(-2px); }

    .hero {
      min-height: 680px;
      display: flex;
      align-items: center;
      position: relative;
      overflow: hidden;
      background:
        radial-gradient(circle at 82% 18%, rgba(32,201,45,.12), transparent 28%),
        radial-gradient(circle at 8% 80%, rgba(25,118,210,.10), transparent 30%),
        linear-gradient(135deg, #f5fbff 0%, #ffffff 55%, #f5fff5 100%);
    }
    .hero::before {
      content: "";
      position: absolute;
      width: 540px;
      height: 540px;
      right: -180px;
      top: -170px;
      border: 80px solid rgba(25,118,210,.05);
      border-radius: 50%;
    }
    .hero::after {
      content: "";
      position: absolute;
      width: 320px;
      height: 320px;
      left: -170px;
      bottom: -160px;
      border: 55px solid rgba(32,201,45,.06);
      border-radius: 50%;
    }
    .eyebrow {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      color: var(--blue-dark);
      background: rgba(25,118,210,.08);
      border: 1px solid rgba(25,118,210,.12);
      border-radius: 50px;
      padding: 8px 13px;
      font-size: .78rem;
      font-weight: 800;
      text-transform: uppercase;
      letter-spacing: .08em;
    }
    .hero h1 {
      font-size: 60px;
      line-height: 1.03;
      font-weight: 800;
      letter-spacing: -.055em;
      margin: 20px 0;
    }
    .hero h1 span { color: var(--blue); }
    .hero .lead {
      color: #53677f;
      max-width: 650px;
      font-size: 1.08rem;
      line-height: 1.8;
    }

    .hero-card {
      position: relative;
      z-index: 2;
      background: #fff;
      border-radius: 28px;
      padding: 16px;
      box-shadow: var(--shadow);
      transform: rotate(1.5deg);
    }
    .hero-visual {
      min-height: 470px;
      border-radius: 22px;
      overflow: hidden;
      position: relative;
      background:
        linear-gradient(180deg, rgba(6,33,59,.04), rgba(6,33,59,.28)),
        url("slider.webp") center/cover;
    }
    .hero-visual::after {
      content: "";
      position: absolute;
      inset: auto 18px 18px 18px;
      height: 115px;
      border-radius: 20px;
      background: rgba(255,255,255,.94);
      box-shadow: 0 10px 35px rgba(0,0,0,.10);
    }
    .hero-mini {
      position: absolute;
      z-index: 2;
      left: 35px;
      right: 35px;
      bottom: 36px;
    }
    .hero-mini .rating {
      color: #f6a800;
      font-size: 1rem;
      letter-spacing: 2px;
    }
    .hero-mini strong { font-size: 1.05rem; }
    .hero-mini small { color: var(--muted); }

    .trust-strip {
      margin-top: -38px;
      position: relative;
      z-index: 5;
    }
    .trust-box {
      background: #fff;
      border: 1px solid var(--line);
      border-radius: 20px;
      box-shadow: var(--shadow);
      padding: 20px 24px;
    }
    .trust-item {
      display: flex;
      align-items: center;
      gap: 12px;
      height: 100%;
    }
    .trust-icon {
      width: 48px; height: 48px;
      display: grid; place-items: center;
      border-radius: 14px;
      color: var(--blue);
      background: #edf7ff;
      font-size: 1.3rem;
      flex: 0 0 auto;
    }
    .trust-item strong { display: block; font-size: 1.1rem; }
    .trust-item span { color: var(--muted); font-size: .82rem; }

    .section-pad { padding: 100px 0; }
    .section-soft { background: var(--light); }
    .section-title {
      max-width: 760px;
      margin: 0 auto 50px;
      text-align: center;
    }
    .section-title .kicker {
      color: var(--green-dark);
      font-weight: 800;
      text-transform: uppercase;
      letter-spacing: .12em;
      font-size: .78rem;
    }
    .section-title h2 {
      font-size: 40px;
      line-height: 1.12;
      font-weight: 800;
      letter-spacing: -.04em;
      margin: 10px 0 16px;
    }
    .section-title p { color: var(--muted); line-height: 1.8; }

    .about-img {
      min-height: 560px;
      border-radius: 28px;
      background:
        linear-gradient(180deg, rgba(16,35,61,.02), rgba(16,35,61,.16)),
        url("about.webp") center/cover;
      box-shadow: var(--shadow);
    }
    .about-content h2 {
      font-size: 40px;
      font-weight: 800;
      letter-spacing: -.045em;
    }
    .about-content p { color: var(--muted); line-height: 1.85; }
    .check-list { list-style: none; padding: 0; margin: 25px 0; }
    .check-list li {
      display: flex;
      gap: 12px;
      align-items: flex-start;
      margin: 13px 0;
      font-weight: 700;
    }
    .check-list i { color: var(--green-dark); font-size: 1.2rem; }

    .service-card {
      height: 100%;
      background: #fff;
      border: 1px solid var(--line);
      border-radius: 22px;
      padding: 28px;
      transition: .25s ease;
      box-shadow: 0 8px 25px rgba(16,35,61,.04);
    }
    .service-card:hover {
      transform: translateY(-7px);
      box-shadow: var(--shadow);
      border-color: rgba(25,118,210,.20);
    }
    .service-icon {
      width: 58px; height: 58px;
      border-radius: 18px;
      display: grid; place-items: center;
      background: linear-gradient(135deg, #e9f6ff, #f1fff1);
      color: var(--blue);
      font-size: 1.55rem;
      margin-bottom: 20px;
    }
    .service-card h4 { font-size: 1.18rem; font-weight: 800; }
    .service-card p { color: var(--muted); line-height: 1.7; margin-bottom: 0; }

    .condition {
      border-radius: 20px;
      min-height: 190px;
      padding: 25px;
      display: flex;
      flex-direction: column;
      justify-content: end;
      color: #fff;
      position: relative;
      overflow: hidden;
      background-size: cover;
      background-position: center;
    }
    .condition::before {
      content: "";
      position: absolute;
      inset: 0;
      background: linear-gradient(180deg, rgba(10,30,50,.05), rgba(10,30,50,.82));
    }
    .condition > * { position: relative; z-index: 1; }
    .condition h4 { font-weight: 800; margin-bottom: 5px; }
    .condition p { margin: 0; font-size: .86rem; opacity: .88; }
    .c1 { background-image: url("https://images.unsplash.com/photo-1559757175-0eb30cd8c063?auto=format&fit=crop&w=700&q=80"); }
    .c2 { background-image: url("https://images.unsplash.com/photo-1609840114035-3c981b782dfe?auto=format&fit=crop&w=700&q=80"); }
    .c3 { background-image: url("https://images.unsplash.com/photo-1598256989800-fe5f95da9787?auto=format&fit=crop&w=700&q=80"); }
    .c4 { background-image: url("https://images.unsplash.com/photo-1538805060514-97d9cc17730c?auto=format&fit=crop&w=700&q=80"); }

    .why-card {
      background: #fff;
      border-radius: 20px;
      padding: 28px;
      height: 100%;
      border: 1px solid var(--line);
    }
    .why-number {
      color: var(--blue);
      font-size: .75rem;
      font-weight: 900;
      letter-spacing: .12em;
    }
    .why-card h4 { font-weight: 800; margin: 8px 0 10px; }
    .why-card p { color: var(--muted); line-height: 1.7; margin: 0; }

    .doctor-wrap {
      border-radius: 28px;
      background: linear-gradient(135deg, #0e6bc7, #20c92d);
      padding: 1px;
      box-shadow: var(--shadow);
    }
    .doctor-inner {
      background: #fff;
      border-radius: 27px;
      padding: 40px;
    }
    .doctor-img {
      width: 100%;
      min-height: 410px;
      border-radius: 20px;
      background:
        url("https://images.unsplash.com/photo-1612349317150-e413f6a5b16d?auto=format&fit=crop&w=900&q=85") center/cover;
    }
    .doctor-inner h2 {
      font-weight: 800;
      letter-spacing: -.04em;
      font-size: clamp(2rem, 4vw, 3rem);
    }
    .doctor-inner p { color: var(--muted); line-height: 1.8; }

    .review-card {
      height: 100%;
      padding: 30px;
      background: #fff;
      border: 1px solid var(--line);
      border-radius: 22px;
      box-shadow: 0 8px 30px rgba(16,35,61,.04);
    }
    .review-stars { color: #f5a900; letter-spacing: 2px; }
    .review-card p { color: #52657b; line-height: 1.8; margin: 18px 0; }
    .review-card strong { font-size: .95rem; }

    .cta {
      position: relative;
      overflow: hidden;
      border-radius: 32px;
      background: linear-gradient(120deg, #0759ad, #1976d2 55%, #20c92d);
      color: #fff;
      padding: 65px;
    }
    .cta::before {
      content: "";
      position: absolute;
      width: 350px;
      height: 350px;
      right: -120px;
      top: -180px;
      border: 55px solid rgba(255,255,255,.10);
      border-radius: 50%;
    }
    .cta h2 { font-weight: 800; letter-spacing: -.04em; font-size: clamp(2rem, 4vw, 3.2rem); }
    .cta p { color: rgba(255,255,255,.80); max-width: 650px; line-height: 1.8; }

    .contact-card {
      background: #fff;
      border: 1px solid var(--line);
      border-radius: 24px;
      padding: 28px;
      height: 100%;
      box-shadow: 0 10px 35px rgba(16,35,61,.05);
    }
    .contact-row {
      display: flex;
      gap: 15px;
      align-items: flex-start;
      margin-bottom: 22px;
    }
    .contact-row .icon {
      width: 46px; height: 46px;
      display: grid; place-items: center;
      border-radius: 14px;
      background: #edf7ff;
      color: var(--blue);
      flex: 0 0 auto;
    }
    .contact-row strong { display: block; margin-bottom: 3px; }
    .contact-row span, .contact-row a { color: var(--muted); line-height: 1.6; }

    .map-box {
      min-height: 100%;
      border-radius: 24px;
      overflow: hidden;
      border: 1px solid var(--line);
      box-shadow: var(--shadow);
    }
    .map-box iframe { width: 100%; height: 100%; min-height: 430px; border: 0; }

    footer {
      background: #08182b;
      color: #9db1c6;
      padding: 0px 0 15px;
    }
    footer img { width: 180px; filter: brightness(0) invert(1); }
    footer h5 { color: #fff; font-weight: 800; }
    footer a { color: #b9c9d8; }
    footer a:hover { color: #fff; }
    .footer-bottom { border-top: 1px solid rgba(255,255,255,.10); padding-top: 20px; font-size: .84rem; }

    .floating-wa {
      position: fixed;
      right: 20px;
      bottom: 20px;
      width: 58px;
      height: 58px;
      border-radius: 50%;
      display: grid;
      place-items: center;
      background: #25d366;
      color: #fff;
      font-size: 1.65rem;
      box-shadow: 0 12px 30px rgba(37,211,102,.30);
      z-index: 999;
    }

    .back-top {
      position: fixed;
      right: 20px;
      bottom: 90px;
      width: 42px;
      height: 42px;
      border: 0;
      border-radius: 50%;
      background: var(--ink);
      color: #fff;
      display: none;
      place-items: center;
      z-index: 998;
    }
    .back-top.show { display: grid; }

    @media (max-width: 991.98px) {
      .hero { min-height: auto; padding: 80px 0 90px; }
      .hero-card { margin-top: 45px; }
      .trust-strip { margin-top: -25px; }
      .section-pad { padding: 75px 0; }
      .about-img { min-height: 420px; margin-bottom: 35px; }
      .doctor-img { min-height: 350px; margin-bottom: 25px; }
      .cta { padding: 45px 30px; }
    }

    @media (max-width: 575.98px) {
      .navbar-brand img { width: 145px; }
      .hero h1 { font-size: 2.65rem; }
      .hero-visual { min-height: 380px; }
      .trust-box { padding: 18px; }
      .section-pad { padding: 65px 0; }
      .cta { border-radius: 22px; padding: 38px 24px; }
      .doctor-inner { padding: 25px; }
    }


    @media screen and (max-width: 767px){
      .topbar{
        display: none;
      } .navbar-brand img {
    width: 98px;
  }  .hero {
    min-height: auto;
    padding: 42px 0 60px;
  } .hero h1 {
    font-size: 30px;
  }
  .hero .lead{
    font-size: 16px
    }
    .btn{
      padding: 6px 23px;font-size: 15px;
    }  .hero-card {
    margin-top: -19px;
  }
  .hero-visual::after{
    height: 150px
  }
  .about-content h2, .section-title h2 {
  font-size: 28px;
}
section{
  overflow-x: hidden
}

  }