/* ABOUT HERO */
.about-hero{
  padding:4.5rem 0 4rem;
  background:linear-gradient(135deg,#ffffff,#fff9e5);
}
.about-hero-title{
  font-weight:800;
  font-size:2.4rem;
  line-height:1.2;
}
.about-hero-title span{
  color:#ffc300;
}
.about-hero-text{
  margin-top:1rem;
  max-width:460px;
  color:#4b5563;
}
.about-hero-list{
  list-style:none;
  padding:0;
  margin:1rem 0 1.4rem;
  color:#374151;
  font-size:.95rem;
}
.about-hero-list li{
  margin-bottom:.3rem;
}
.about-hero-list i{
  color:#22c55e;
  margin-right:.45rem;
}
.about-hero-btn{
  background:#ffc300;
  color:#111;
  padding:.75rem 1.9rem;
  border-radius:999px;
  font-weight:700;
  border:none;
  box-shadow:0 14px 32px rgba(0,0,0,.25);
  transition:transform .25s, box-shadow .25s, background .25s;
  text-decoration:none;
}
.about-hero-btn:hover{
  background:#ffd85b;
  transform:translateY(-3px);
  box-shadow:0 20px 40px rgba(0,0,0,.3);
}

/* doctor card */
.about-hero-card{
  position:relative;
  border-radius:40px;
  overflow:hidden;
  box-shadow:0 24px 70px rgba(0,0,0,.2);
}
.about-hero-card img{
  width:100%;
  display:block;
  height: 400px;
}
.about-hero-badge{
  position:absolute;
  bottom:14px;
  right:14px;
  background:rgba(15,23,42,.9);
  color:#f9fafb;
  padding:.45rem .9rem;
  border-radius:999px;
  font-size:.8rem;
  box-shadow:0 10px 24px rgba(0,0,0,.5);
}
.about-hero-badge span{
  font-weight:700;
  margin-right:.3rem;
}

/* ABOUT DETAIL */
/* OUR STORY */
.about-story{
  background:radial-gradient(circle at top,#fff9e5,#ffffff 55%);

}
.about-story-card{
  position:relative;
  padding:2.1rem 2rem 2.2rem;
  border-radius:26px;
  background:#ffffff;
  box-shadow:0 20px 60px rgba(0,0,0,.08);
  overflow:hidden;
  text-align:center;         /* center everything inside */
}

.about-chip{
  display:inline-block;      /* shrink to its text */
  margin:0 auto .7rem;       /* center horizontally */
}

.about-story-card::before{
  content:"";
  position:absolute;
  left:0;
  top:0;
  bottom:0;
  width:4px;
  background:linear-gradient(180deg,#facc15,#f97316);
}
.about-story-card::after{
  content:"";
  position:absolute;
  right:-80px;
  top:-80px;
  width:220px;
  height:220px;
  border-radius:50%;
  background:radial-gradient(circle,#fde68a,#fbbf24);
  opacity:.18;
}
.about-chip{
  display:inline-flex;
  align-items:center;
  gap:.35rem;
  font-size:.75rem;
  text-transform:uppercase;
  letter-spacing:.12em;
  color:#92400e;
  background:#fef3c7;
  padding:.25rem .8rem;
  border-radius:999px;
  margin-bottom:.7rem;
  
}
.about-story-title{
  font-weight:800;
  font-size:1.9rem;
  margin-bottom:.7rem;
  text-align: center;
}
.about-story-text{
  color:#4b5563;
  font-size:.96rem;
  line-height:1.8;
}

/* fade-up animation for story */
.about-story .row{
  opacity:0;
  transform:translateY(40px);
  transition:opacity .7s ease-out, transform .7s ease-out;
}
.about-story.visible .row{
  opacity:1;
  transform:translateY(0);
}

/* WHY PATIENTS CHOOSE US */

/* WHY PATIENTS CHOOSE US */

.about-reasons{
  background:#ffffff;
}
.reasons-card{
  max-width:1100px;
  margin:0 auto;
  padding:2rem 2rem 2.3rem;
  border-radius:28px;
  background:linear-gradient(135deg,#fffaf0,#ffe9a3);
  box-shadow:0 24px 70px rgba(0,0,0,.12);
  text-align:center;
  position:relative;
  overflow:hidden;
}
.reasons-card::before{
  content:"";
  position:absolute;
  inset:-40%;
  background:radial-gradient(circle at top,#fde68a,transparent 55%);
  opacity:.45;
}
.about-reasons-title{
  position:relative;
  font-weight:800;
  font-size:2rem;
  margin-bottom:.4rem;
}
.about-reasons-text{
  position:relative;
  color:#4b5563;
  font-size:.95rem;
  max-width:620px;
  margin:0 auto 1.5rem;
}

/* pill grid */
.about-pill-grid{
  position:relative;
  z-index:1;
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:.9rem .9rem;
}
.about-pill{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:.55rem;
  background:#fffdf5;
  border-radius:999px;
  padding:.55rem 1.2rem;
  font-size:.9rem;
  color:#374151;
  border:1px solid #fde68a;
  box-shadow:0 12px 28px rgba(0,0,0,.06);
  transform:translateY(20px);
  opacity:0;
  transition:opacity .5s ease-out, transform .5s ease-out, box-shadow .25s;
}
.about-pill i{
  color:#fbbf24;
  font-size:1.05rem;
}

/* staggered animation */
.about-reasons.visible .about-pill{
  opacity:1;
  transform:translateY(0);
}
.about-pill:nth-child(1){ transition-delay:.1s;}
.about-pill:nth-child(2){ transition-delay:.2s;}
.about-pill:nth-child(3){ transition-delay:.3s;}
.about-pill:nth-child(4){ transition-delay:.4s;}

/* hover */
.about-pill:hover{
  box-shadow:0 18px 40px rgba(0,0,0,.14);
  transform:translateY(-3px);
}

/* responsive */
@media (max-width:767.98px){
  .reasons-card{
    padding:1.7rem 1.3rem 2rem;
  }
  .about-pill-grid{
    grid-template-columns:1fr;
  }
}
