/* WAD Health – Home Care Services in Gurgaon */
/* 1. Page styles (from the WAD Health landing-page theme) */
    :root {
      --primary: #602322;
    }

    .tail-container {
      font-family: 'Inter', system-ui, sans-serif;
    }

    .hero-bg {
      background: linear-gradient(rgba(76, 0, 0, 0.78), rgba(76, 0, 0, 0.85)), url('../assets/images/V1.jpeg') center/cover no-repeat;
    }

    .nav-link {
      transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    }

    .nav-link:hover {
      color: #602322;
      transform: translateY(-2px);
    }

    .stat-card {
      transition: all 0.4s cubic-bezier(0.4, 0.0, 0.2, 1);
    }

    .stat-card:hover {
      transform: translateY(-8px);
      box-shadow: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1);
    }

    .service-card {
      transition: all 0.4s cubic-bezier(0.4, 0.0, 0.2, 1);
    }

    .service-card:hover {
      transform: translateY(-12px);
      box-shadow: 0 25px 50px -12px rgb(76 0 0 / 0.25);
    }

    .therapist-card {
      transition: all 0.4s ease;
    }

    .therapist-card:hover {
      transform: scale(1.03);
    }

    .section-header {
      position: relative;
    }

    .section-header:after {
      content: '';
      position: absolute;
      width: 80px;
      height: 4px;
      background: #602322;
      bottom: -10px;
      left: 50%;
      transform: translateX(-50%);
    }

    .main-logo {
      display: block;
      max-width: 180px;
      margin: 0 auto;
    }

    .faq-premium {
      padding: 110px 20px;
      background: radial-gradient(circle at top, #fff, #f7f3f3);
    }

    /* WIDER LAYOUT FOR PREMIUM FEEL */
    .faq-wrap {
      max-width: 1050px;
      margin: auto;
    }

    /* HEADER */
    .faq-header {
      text-align: center;
      margin-bottom: 55px;
    }

    .faq-tag {
      background: rgba(76, 0, 0, 0.08);
      color: #602322;
      padding: 7px 16px;
      border-radius: 30px;
      font-size: 13px;
      font-weight: 600;
      letter-spacing: 0.5px;
    }

    .faq-header h2 {
      font-size: 46px;
      margin: 16px 0;
      color: #602322;
      font-weight: 700;
      line-height: 1.2;
    }

    .faq-header p {
      color: #666;
      font-size: 16px;
      max-width: 650px;
      margin: 0 auto;
      line-height: 1.6;
    }

    /* BOX */
    .faq-box {
      display: flex;
      flex-direction: column;
      gap: 20px;
    }

    /* ITEM */
    .faq-item {
      background: rgba(255, 255, 255, 0.92);
      backdrop-filter: blur(12px);
      border-radius: 18px;
      border: 1px solid #eee;
      box-shadow: 0 12px 30px rgba(0, 0, 0, 0.06);
      overflow: hidden;
      transition: all 0.3s ease;
      position: relative;
    }

    /* HOVER EFFECT */
    .faq-item:hover {
      transform: translateY(-2px);
      box-shadow: 0 18px 40px rgba(0, 0, 0, 0.08);
    }

    /* LEFT ACCENT LINE */
    .faq-item::before {
      content: "";
      position: absolute;
      left: 0;
      top: 0;
      height: 0%;
      width: 4px;
      background: #602322;
      transition: 0.4s ease;
    }

    .faq-item.active::before {
      height: 100%;
    }

    /* QUESTION */
    .faq-question {
      display: flex;
      justify-content: space-between;
      align-items: center;
      padding: 24px 22px;
      cursor: pointer;
      gap: 15px;
    }

    /* LEFT SIDE */
    .faq-q-left {
      display: flex;
      gap: 14px;
      align-items: center;
    }

    .faq-toggle i {
      transition: transform 0.3s ease;
    }

    .faq-item.active .faq-toggle i {
      transform: rotate(135deg);
    }

    /* NUMBER ICON */
    .faq-icon {
      width: 40px;
      height: 40px;
      background: #602322;
      color: #fff;
      display: flex;
      align-items: center;
      justify-content: center;
      border-radius: 10px;
      font-size: 14px;
      font-weight: 600;
    }

    /* QUESTION TEXT */
    .faq-question h3 {
      font-size: 18px;
      font-weight: 600;
      color: #4c0000;
      line-height: 1.4;
    }

    /* TOGGLE */
    .faq-toggle {
      font-size: 16px;
      font-weight: 300;
      color: #602322;
      transition: 0.3s ease;
    }

    /* ANSWER */
    .faq-answer {
      max-height: 0;
      overflow: hidden;
      padding: 0 22px;
      color: #555;
      font-size: 16px;
      line-height: 1.8;
      transition: all 0.45s ease;
    }

    /* ACTIVE STATE */
    .faq-item.active .faq-answer {
      max-height: 240px;
      padding-bottom: 22px;
    }

    /* ROTATE ICON */
    .faq-item.active .faq-toggle {
      transform: rotate(45deg);
    }

    /* RESPONSIVE */
    @media (max-width: 768px) {

      .faq-header h2 {
        font-size: 32px;
      }

      .faq-question h3 {
        font-size: 16px;
      }

      .faq-answer {
        font-size: 15px;
      }

      .faq-icon {
        width: 36px;
        height: 36px;
        font-size: 13px;
      }
    }
/* 2. Footer styles */
.footer-area-three {
    background: #602322;
    color: #fff;
    padding: 70px 0 25px;
}

.footer-logo {
    max-width: 180px;
    margin-bottom: 20px;
}

.footer-col {
    margin-bottom: 40px;
}

.footer-col h4 {
    color: #fff;
    font-size: 24px;
    font-weight: 600;
    margin-bottom: 25px;
    position: relative;
}

.footer-col h4::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: -8px;
    width: 55px;
    height: 3px;
    background: #d4c8b7;
}

.footer-col p {
    color: #fff !important;
    font-size: 15px;
    line-height: 1.8;
    text-decoration: none;
    margin-bottom: 12px;
}

.footer-col a:hover,
.footer-links li a:hover {
    color: #fff;
    text-decoration: none;
}

.footer-links {
    list-style: none;
    padding: 0;
    margin: 0;
}

.follow-heading {
    margin-top: 30px;
}
.footer-social-icons {
    list-style: none;
    padding: 0;
    margin: 15px 0 0;
    display: flex;
    gap: 18px;
}

.footer-social-icons a {
    width: 42px;
    height: 42px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: transparent;
    transition: all 0.5s ease;
    text-decoration: none;
}

.footer-social-icons i {
    font-size: 24px;
    transition: all 0.5s ease;
}

.footer-social-icons a:hover {
    background: #fff;
}

/* Brand colors on hover */
.footer-social-icons a:hover .fa-instagram {
    color: #E4405F;
}

.footer-social-icons a:hover .fa-facebook {
    color: #1877F2;
}

.footer-social-icons a:hover .fa-linkedin {
    color: #0A66C2;
}

.footer-social-icons a:hover .fa-youtube {
    color: #FF0000;
}

.footer-social-icons a:hover .fa-pinterest {
    color: #e60023;
}
.footer-links li {
    display: flex;
    align-items: center;
    gap: 13px;
    margin-bottom: 12px;
}

.footer-links li a {
    color: #fff;
    font-size: 15px;
    line-height: 1.8;
    text-decoration: none;
}

.footer-col p i {
    margin-right: 8px !important;
}

.footer-services {
    border-top: 1px solid rgba(255,255,255,.15);
    border-bottom: 1px solid rgba(255,255,255,.15);
    padding: 25px 0;
    text-align: center;
}

.footer-services h5 {
    color: #fff;
    margin-bottom: 20px;
    font-size: 20px;
}

.services-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 18px;
}

.services-list a {
    color: #fff;
    text-decoration: none;
}

.services-list a:hover {
    color: #fff;
    text-decoration: none;
}

.footer-bottom {
    text-align: center;
    padding-top: 20px;
    font-size: 14px;
}

/* Tablet */

@media (max-width: 991px) {
    .footer-col {
        text-align: center;
    }

    .footer-col h4::after {
        left: 50%;
        transform: translateX(-50%);
    }

    .footer-social-icons {
        justify-content: center;
    }
}

/* Mobile */

@media (max-width: 767px) {

    .footer-area-three {
        padding: 50px 0 20px;
    }

    .footer-logo {
        display: block;
        margin: 0 auto 20px;
    }

    .services-list {
        flex-direction: column;
        gap: 10px;
    }
}

.fa-solid, .fas {
    margin-right: 0 !important;
}


.hightlight-text {
    font-weight: 700;
}





.footer-services {
  border-top: 1px solid rgba(255, 255, 255, 0.1);
  padding: 15px 0;
}

.services-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 20px;
}

.services-list li {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 15px;
}

.services-list i {
  font-size: 12px;
}

.services-list a {
  text-decoration: none;
  color: inherit;
}

.services-title {
  font-weight: 600;
  font-size: 18px;
  margin-bottom: 10px;
  display: inline-block;
  color: #fff;
  /* adjust color if needed */
}


.services-list a:hover {
  text-decoration: none;
}

@media (max-width: 991px) {

    .footer-links li {
        display: flex;
        justify-content: center;
        align-items: center;
        gap: 10px;
    }

}
/* 3. Home Care page additions */
html{scroll-behavior:smooth;scroll-padding-top:90px}
.heading-font{font-family:'Playfair Display',Georgia,serif;letter-spacing:-.01em}
.hero-bg{background:linear-gradient(105deg,rgba(58,0,0,.93) 0%,rgba(76,0,0,.84) 55%,rgba(76,0,0,.72) 100%),url('../assets/images/V1.jpeg') 70% center/cover no-repeat}
.btn-cream,.btn-ghost,.btn-maroon{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:52px;padding:0 30px;border-radius:999px;font-weight:600;font-size:16px;text-decoration:none;transition:all .3s ease}
.btn-cream{background:#d4c8b7;color:#3a0000}.btn-cream:hover{background:#fff;color:#602322;transform:translateY(-2px);box-shadow:0 14px 28px rgba(0,0,0,.25)}
.btn-ghost{border:2px solid rgba(255,255,255,.65);color:#fff}.btn-ghost:hover{background:#fff;color:#602322}
.btn-maroon{background:#602322;color:#fff}.btn-maroon:hover{background:#3a0000;color:#fff;transform:translateY(-2px);box-shadow:0 14px 28px rgba(96,35,34,.3)}
.svc-link{display:inline-flex;align-items:center;gap:8px;font-weight:600;color:#602322;text-decoration:none;border-top:1px solid #eee;padding-top:16px}
.svc-link i{transition:transform .3s ease}.svc-link:hover{color:#3a0000}.svc-link:hover i{transform:translateX(5px)}
/* FAQ toggle: single clean rotation */
.faq-item.active .faq-toggle i{transform:none}
.faq-item.active .faq-toggle{transform:rotate(45deg)}
.faq-question:focus-visible{outline:3px solid #602322;outline-offset:-3px;border-radius:18px}
.faq-answer a{text-decoration:none}
/* Footer details */
.footer-col a,.footer-links li a{color:#fff;text-decoration:none}
.footer-col p a{display:inline}
.footer-services p.services-title{color:#fff;font-size:20px;margin-bottom:20px}
.services-list li{display:flex;align-items:center;gap:8px}.services-list li i{color:#d4c8b7}
.footer-links li i{color:#d4c8b7}
.map-are iframe{display:block}
/* Mobile sticky call bar */
.mobile-bar{position:fixed;left:0;right:0;bottom:0;z-index:60;display:flex;gap:1px;background:#3a0000;box-shadow:0 -6px 20px rgba(0,0,0,.25)}
.mobile-bar a{flex:1;display:flex;align-items:center;justify-content:center;gap:8px;min-height:56px;color:#fff;font-weight:600;text-decoration:none;background:#602322}
.mobile-bar a.wa{background:#1f7a4d}
/* Keyboard focus + motion */
a:focus-visible,button:focus-visible,input:focus-visible,[role=button]:focus-visible{outline:3px solid #d4c8b7;outline-offset:2px}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}}

/* 4. Process timeline (How Our Home Care Service Works) */
.proc{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:28px;position:relative}
.proc::before,.proc::after{content:"";position:absolute;top:42px;left:12.5%;right:12.5%;height:4px;border-radius:4px;background:#e9dede}
.proc::after{background:linear-gradient(90deg,#602322,#a0524f);transform-origin:left center}
.proc-step{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;text-align:center}
.proc-node{position:relative;flex:none;width:84px;height:84px;margin-bottom:28px;border-radius:50%;border:4px solid #602322;background:#602322;color:#fff;font-size:30px;display:flex;align-items:center;justify-content:center;box-shadow:0 12px 26px rgba(96,35,34,.25)}
.proc-num{position:absolute;top:-8px;right:-8px;width:30px;height:30px;border-radius:50%;border:3px solid #fff;background:#d4c8b7;color:#3a0000;font:700 14px/24px Inter,sans-serif;text-align:center}
.proc-card{position:relative;width:100%;flex:1;background:#fff;border:1px solid #eadfdf;border-radius:24px;padding:28px 24px;box-shadow:0 12px 30px rgba(96,35,34,.08);transition:transform .4s cubic-bezier(.4,0,.2,1),box-shadow .4s,border-color .4s}
.proc-card::before{content:"";position:absolute;top:-28px;left:50%;width:4px;height:28px;margin-left:-2px;background:#602322;border-radius:4px}
.proc-card:hover{transform:translateY(-8px);border-color:#602322;box-shadow:0 26px 50px -14px rgba(76,0,0,.3)}
.proc-label{display:inline-block;margin-bottom:12px;padding:4px 12px;border-radius:99px;background:rgba(96,35,34,.07);color:#602322;font-size:12px;font-weight:600;letter-spacing:.05em}
.proc-card h3{margin:0 0 10px;font-size:21px;line-height:1.3;font-weight:700;color:#602322}
.proc-card p{margin:0;color:#666;line-height:1.7}
/* animated state (added by JS when the section scrolls into view) */
.proc-ready:not(.in-view)::after{transform:scaleX(0)}
.proc-ready:not(.in-view) .proc-node{background:#fff;border-color:#e9dede;color:#602322;box-shadow:none}
.proc-ready:not(.in-view) .proc-card{opacity:0;transform:translateY(26px)}
.proc-ready:not(.in-view) .proc-card::before{background:#e9dede}
.proc-ready.in-view::after{animation:procFill 3s linear both}
.proc-ready.in-view .proc-node{animation:nodeOn .55s ease both;animation-delay:calc(var(--i)*1s)}
.proc-ready.in-view .proc-card{animation:cardIn .7s ease both;animation-delay:calc(var(--i)*1s + .15s)}
.proc-ready.in-view .proc-step:last-child .proc-node::after{content:"";position:absolute;inset:-4px;border-radius:50%;border:2px solid #602322;opacity:0;animation:ring 2.4s ease-out 3.6s infinite}
@keyframes procFill{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes procFillY{from{transform:scaleY(0)}to{transform:scaleY(1)}}
@keyframes nodeOn{0%{background:#fff;border-color:#e9dede;color:#602322;transform:scale(.85)}60%{transform:scale(1.14)}100%{background:#602322;border-color:#602322;color:#fff;transform:scale(1)}}
@keyframes cardIn{from{opacity:0;transform:translateY(26px)}to{opacity:1;transform:none}}
@keyframes ring{0%{transform:scale(1);opacity:.55}100%{transform:scale(1.6);opacity:0}}
@media(max-width:1023px){
.proc{grid-template-columns:1fr;gap:32px}
.proc-step{flex-direction:row;align-items:flex-start;text-align:left;gap:26px}
.proc-node{width:72px;height:72px;margin-bottom:0;font-size:26px}
.proc-card{flex:1;min-width:0;padding:22px 20px}
.proc-card::before{top:34px;left:-26px;width:26px;height:4px;margin:0}
.proc::before,.proc::after{display:none}
.proc-step:not(:last-child)::before,.proc-step:not(:last-child)::after{content:"";position:absolute;left:34px;top:36px;width:4px;height:calc(100% + 32px);background:#e9dede;border-radius:4px;z-index:0}
.proc-step:not(:last-child)::after{background:#602322;transform-origin:center top}
.proc-node,.proc-card{z-index:1}
.proc-ready:not(.in-view) .proc-step::after{transform:scaleY(0)}
.proc-ready.in-view .proc-step:not(:last-child)::after{animation:procFillY 1s linear both;animation-delay:calc(var(--i)*1s)}
}
/* 5. Medical Attendant section */
.att-col{display:flex;flex-direction:column;background:#fff;border:1px solid #eadfdf;border-radius:28px;overflow:hidden;box-shadow:0 10px 30px rgba(96,35,34,.06);transition:transform .45s cubic-bezier(.4,0,.2,1),box-shadow .45s,border-color .45s}
.att-col:hover,.att-col:focus-within{transform:translateY(-12px);border-color:#602322;box-shadow:0 30px 60px -15px rgba(76,0,0,.35)}
.att-head{padding:32px 28px 26px;background:#f7f3f3;color:#602322;transition:background .45s,color .45s}
.att-ic{width:64px;height:64px;border-radius:18px;background:#602322;color:#fff;font-size:26px;display:flex;align-items:center;justify-content:center;transition:background .45s,color .45s,transform .45s}
.att-head h3{margin:20px 0 10px;font-family:'Playfair Display',Georgia,serif;font-size:26px;line-height:1.2;font-weight:700;color:inherit}
.att-head p{margin:0;line-height:1.6;color:#6b5555;transition:color .45s}
.att-col:hover .att-head{background:#602322;color:#fff}
.att-col:hover .att-ic{background:#d4c8b7;color:#3a0000;transform:rotate(-6deg) scale(1.06)}
.att-col:hover .att-head p{color:rgba(255,255,255,.88)}
.att-lead{margin:0;padding:24px 28px 14px;color:#555;line-height:1.7;font-size:15px}
.att-list{list-style:none;margin:0;padding:0 14px 20px}
.att-list li{display:flex;gap:12px;padding:12px 14px;border-bottom:1px solid #f0e8e8;color:#444;font-size:15px;line-height:1.55;transition:background .25s,padding-left .25s}
.att-list li:last-child{border-bottom:0}
.att-list li i{flex:none;margin-top:4px;color:#602322;font-size:14px}
.att-list li:hover{background:#f7f3f3;padding-left:20px}
.att-cta{display:flex;align-items:center;justify-content:center;gap:10px;margin:auto 24px 24px;min-height:50px;border-radius:999px;border:2px solid #602322;color:#602322;font-weight:600;text-decoration:none;transition:background .3s,color .3s}
.att-cta i{transition:transform .3s}
.att-col:hover .att-cta{background:#602322;color:#fff}.att-cta:hover i{transform:translateX(5px)}