@import url('https://fonts.googleapis.com/css2?family=Doto:wght@100..900&family=Playfair+Display:ital,wght@0,400..900;1,400..900&display=swap');
*{
    margin:0;
    padding:0;
    box-sizing:border-box;
    font-family:Inter,sans-serif;
}

body{
    background:#fff;
    color:#222;
}

.container{
    width:90%;
    max-width:1200px;
    margin:auto;
}

.section{
    padding:80px 0;
}
/* ------------------------------------TOP HEADER--------------------------------- */
.header{
    position:fixed;
    width:100%;
    top:0;
    z-index:100;
    background:rgba(255,255,255,.9);
}
.header span{
    font-weight: 800;
}

.nav{
    display:flex;
    justify-content:space-between;
    align-items:center;
    padding:15px 0;
}

.logo{
    display:flex;
    gap:10px;
    align-items:center;
}
.logo img{
    height: 4rem;
}

nav ul{
    display:flex;
    gap:25px;
    list-style:none;
}

nav a{
    text-decoration:none;
    color:#333;
}

.active{
    color:#2c7a42;
}

.btn{
    background:#2c7a42;
    color:#fff;
    padding:12px 24px;
    border-radius:30px;
    text-decoration:none;
}
/* HERO---------------------- */
.hero{
    min-height:100vh;
    background:url(assets/herobg.png) center/cover;
    position:relative;
    display:flex;
    align-items:center;
}

.overlay{
    position:absolute;
    inset:0;
    background:rgba(0,0,0,.25);
}

.hero-content{
    position:relative;
    z-index:2;
}

.hero-text{
    max-width:600px;
}

.hero h1{
    font-size:4rem;
    line-height:1.15;
    margin:20px 0;
}

.hero h1 span{
    color:#3e8f50;
}

.hero p{
    margin-bottom:25px;
}

.hero-buttons{
    display:flex;
    gap:15px;
}

.btn-outline{
    border:1px solid #ddd;
    padding:12px 24px;
    border-radius:30px;
    background:#fff;
    text-decoration:none;
    color:#222;
}

.about-grid,
.contact-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:60px;
    align-items:center;
}

.about img{
    width:100%;
    border-radius:20px;
}
.about-content h2{
    margin: 10px;
    background:#2c7a42;
    width:7.5rem;
    border-radius: 30px;
    padding: 10px;
    font-size: 1.2rem;
    font-weight: 300;
    
}
.section-tag{
    color:#3e8f50;
}
.about-content a{
    text-decoration: none;
    color:#fff;
    
}

.section-title{
    text-align:center;
    margin-bottom:50px;
    font-size:2rem;
}

.service-grid,
/* .therapist-grid,  if more therapist added*/
.testimonial-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:25px;
}

.card,
.therapist-card,
.testimonial{
    background:#fff;
    padding:25px;
    border-radius:18px;
    box-shadow:0 5px 20px rgba(0,0,0,.1);
}
.card{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}
.therapist-grid{
    place-self: center;
}
.therapist-card img{
    height: 12rem;
    border: 2px ;

}
.therapist-card{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.card img{
    height:10rem;
    margin-bottom:15px;
}

.benefits{
    background:#ffffff;
}
.benefits img{
    height: 10rem;
}

.benefit-grid{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:25px;
    text-align:center;
}

.gallery-grid{
    display:grid;
    grid-template-columns:repeat(6,1fr);
    gap:15px;
}

.gallery img{
    width:100%;
    border-radius:12px;
}

/* -------------------CTA---------------------- */
.cta{
    padding:40px 0;
}

.cta-box{
    background:linear-gradient(
    90deg,#1d6b35,#4caf50);
    color:white;
    padding:40px;
    border-radius:20px;
    display:flex;
    justify-content:space-between;
    align-items:center;
}

.btn-yellow{
    background:#ffc928;
    color:#111;
    text-decoration:none;
    padding:14px 28px;
    border-radius:30px;
    font-weight:600;
}
.testimonials section h1 span{
    color:#3e8f50;
}


/* --------------------Contact--------------------------- */

/* Contact section */
.contact-section {
    padding: 80px 8%;
    background: #f9faf8;
}

.section-title {
    text-align: center;
    margin-bottom: 50px;
}

.section-title h5 {
    color: #2f7d32;
    letter-spacing: 2px;
    margin-bottom: 10px;
}

.section-title h2 {
    font-size: 42px;
    color: #222;
}

.contact-wrapper {
    display: grid;
    grid-template-columns: 1.3fr 1fr;
    gap: 35px;
}

.contact-form-box,
.contact-info {
    background: #fff;
    border-radius: 18px;
    padding: 30px;
    box-shadow: 0 5px 25px rgba(0,0,0,0.08);
}

.row {
    display: flex;
    gap: 15px;
}

.row input {
    width: 50%;
}

input,
textarea {
    width: 100%;
    padding: 15px;
    border: 1px solid #ddd;
    border-radius: 10px;
    margin-bottom: 15px;
    font-size: 15px;
}

input:focus,
textarea:focus {
    outline: none;
    border-color: #2f7d32;
}

button {
    background: #2f7d32;
    color: white;
    border: none;
    padding: 15px 30px;
    border-radius: 40px;
    cursor: pointer;
    font-size: 16px;
    transition: 0.3s;
}

button:hover {
    background: #256728;
}

.info-card {
    margin-bottom: 20px;
}

.info-card h4 {
    color: #2f7d32;
    margin-bottom: 8px;
}

.map-box {
    margin-top: 20px;
    overflow: hidden;
    border-radius: 15px;
}

.map-box iframe {
    width: 100%;
    height: 280px;
    border: 0;
}

#status {
    margin-top: 15px;
    color: green;
    font-weight: 600;
}

@media(max-width:900px){

    .contact-wrapper{
        grid-template-columns:1fr;
    }

    .row{
        flex-direction:column;
    }

    .row input{
        width:100%;
    }
}

.footer{
    background:#14532d;
    color:white;
    text-align:center;
    padding:20px;
}


    /* =========================================================
   AYTRC POSTER-STYLE THERAPY CARDS
   ========================================================= */
      .poster-services {
        background:
          radial-gradient(
            circle at 50% 0%,
            rgba(226, 247, 218, 0.9),
            transparent 34%
          ),
          linear-gradient(180deg, #f8fff5 0%, #ffffff 100%);
        position: relative;
        overflow: hidden;
      }

      .poster-heading {
        text-align: center;
        max-width: 900px;
        margin: 0 auto 35px;
      }

      .poster-heading > span {
        display: inline-block;
        color: #174d2d;
        font-weight: 800;
        letter-spacing: 2px;
        font-size: 13px;
        margin-bottom: 5px;
      }

      .poster-heading h2 {
        margin: 0;
        text-transform: uppercase;
        color: #123d27;
        font-size: clamp(28px, 4vw, 46px);
        font-weight: 900;
        letter-spacing: 0.5px;
      }

      .poster-heading h2::first-letter {
        color: #f2c400;
      }

      .poster-heading p {
        margin: 8px 0 0;
        color: #4b6d54;
        font-style: italic;
        font-weight: 600;
      }

      .poster-service-grid {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 18px;
        max-width: 1120px;
        margin: 0 auto;
      }

      .poster-card {
        position: relative;
        min-height: 310px;
        padding: 18px 20px 20px;
        border-radius: 18px;
        border: 3px solid rgba(255, 255, 255, 0.95);
        box-shadow: 0 8px 22px rgba(32, 76, 43, 0.13);
        overflow: hidden;
        transition:
          transform 0.25s ease,
          box-shadow 0.25s ease;
      }

      .poster-card:hover {
        transform: translateY(-5px);
        box-shadow: 0 14px 30px rgba(32, 76, 43, 0.2);
      }

      .poster-card::after {
        content: "";
        position: absolute;
        width: 150px;
        height: 150px;
        right: -45px;
        bottom: -60px;
        border-radius: 50%;
        background: rgba(255, 255, 255, 0.28);
        pointer-events: none;
      }

      .poster-card-head {
        display: flex;
        align-items: center;
        gap: 13px;
        margin-bottom: 14px;
        padding: 10px 13px;
        border-radius: 12px;
        color: #fff;
      }

      .poster-card-head h3 {
        margin: 0;
        font-size: clamp(16px, 1.7vw, 21px);
        line-height: 1.12;
        font-weight: 900;
      }

      .poster-card-head p {
        margin: 5px 0 0;
        color: #fff8e8;
        font-family: Georgia, serif;
        font-style: italic;
        font-weight: 700;
        font-size: 14px;
      }

      .poster-icon {
        flex: 0 0 58px;
        width: 58px;
        height: 58px;
        display: grid;
        place-items: center;
        border-radius: 50%;
        background: rgba(255, 255, 255, 0.18);
        border: 2px solid rgba(255, 255, 255, 0.85);
        color: #fff;
        font-size: 30px;
        line-height: 1;
        text-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
      }

      .poster-card ul {
        margin: 0;
        padding: 0 5px 0 23px;
        list-style: none;
      }

      .poster-card li {
        position: relative;
        margin: 6px 0;
        color: #193c6d;
        font-size: 14px;
        line-height: 1.25;
        font-weight: 600;
      }

      .poster-card li::before {
        content: "";
        position: absolute;
        width: 9px;
        height: 9px;
        border-radius: 50%;
        left: -19px;
        top: 0.38em;
        background: currentColor;
      }

      .poster-tagline {
        position: absolute;
        right: 18px;
        bottom: 14px;
        max-width: 170px;
        text-align: right;
        color: rgba(27, 73, 45, 0.76);
        font-family: Georgia, serif;
        font-size: 14px;
        font-style: italic;
        font-weight: 800;
      }

      /* Poster palette */
      .mental {
        background: linear-gradient(135deg, #fff0f6, #ffe3ef);
      }
      .mental .poster-card-head {
        background: #bd2c69;
      }
      .mental .poster-card li {
        color: #a82b68;
      }

      .digestive {
        background: linear-gradient(135deg, #fff8e6, #fff0c9);
      }
      .digestive .poster-card-head {
        background: #e87913;
      }
      .digestive .poster-card li {
        color: #c96a16;
      }

      .respiratory {
        background: linear-gradient(135deg, #edf9ff, #dcefff);
      }
      .respiratory .poster-card-head {
        background: #2478c7;
      }
      .respiratory .poster-card li {
        color: #286bb0;
      }

      .cardiovascular {
        background: linear-gradient(135deg, #fff0f2, #ffe0e4);
      }
      .cardiovascular .poster-card-head {
        background: #df2631;
      }
      .cardiovascular .poster-card li {
        color: #c82938;
      }

      .musculoskeletal {
        background: linear-gradient(135deg, #fff9e9, #fff0c8);
      }
      .musculoskeletal .poster-card-head {
        background: #a9682d;
      }
      .musculoskeletal .poster-card li {
        color: #a7682e;
      }

      .metabolic {
        background: linear-gradient(135deg, #edf9f0, #ddf2e4);
      }
      .metabolic .poster-card-head {
        background: #267b58;
      }
      .metabolic .poster-card li {
        color: #277356;
      }

      .women {
        background: linear-gradient(135deg, #fff0f7, #ffe0ee);
      }
      .women .poster-card-head {
        background: #cf2c68;
      }
      .women .poster-card li {
        color: #b32968;
      }

      .skin {
        background: linear-gradient(135deg, #f7efff, #eee1ff);
      }
      .skin .poster-card-head {
        background: #6540a5;
      }
      .skin .poster-card li {
        color: #5e429a;
      }

      .autoimmune {
        background: linear-gradient(135deg, #f1efff, #e5e0ff);
      }
      .autoimmune .poster-card-head {
        background: #5b4aae;
      }
      .autoimmune .poster-card li {
        color: #5644a1;
      }

      .geriatric {
        background: linear-gradient(135deg, #fff9df, #ffefb5);
      }
      .geriatric .poster-card-head {
        background: #d29a20;
      }
      .geriatric .poster-card li {
        color: #aa7820;
      }

      .urinary {
        background: linear-gradient(135deg, #eaf8ff, #dcefff);
      }
      .urinary .poster-card-head {
        background: #2877bd;
      }
      .urinary .poster-card li {
        color: #286da8;
      }

      .men {
        background: linear-gradient(135deg, #fff0f2, #ffe0e4);
      }
      .men .poster-card-head {
        background: #c9253b;
      }
      .men .poster-card li {
        color: #b7273d;
      }

      .poster-footer-strip {
        display: flex;
        justify-content: center;
        align-items: center;
        flex-wrap: wrap;
        gap: 15px;
        max-width: 1120px;
        margin: 24px auto 0;
        padding: 14px 20px;
        border-radius: 12px;
        background: linear-gradient(90deg, #173c2b, #245a39, #173c2b);
        color: #fff;
        font-weight: 700;
        box-shadow: 0 7px 18px rgba(20, 55, 35, 0.16);
      }

      .poster-footer-strip i {
        width: 2px;
        height: 20px;
        background: #e2ca35;
      }

      @media (max-width: 850px) {
        .poster-service-grid {
          grid-template-columns: 1fr;
        }

        .poster-card {
          min-height: 0;
        }

        .poster-tagline {
          position: static;
          max-width: none;
          margin-top: 12px;
          text-align: right;
        }
      }

      @media (max-width: 520px) {
        .poster-card {
          padding: 13px;
        }

        .poster-card-head {
          padding: 8px;
        }

        .poster-icon {
          flex-basis: 48px;
          width: 48px;
          height: 48px;
          font-size: 25px;
        }

        .poster-card li {
          font-size: 13px;
        }

        .poster-footer-strip {
          gap: 8px;
          font-size: 13px;
        }

        .poster-footer-strip i {
          height: 16px;
        }
      }