
.dp-page{
    --dp-forest:#0F2A1B;     
    --dp-forest-deep:#081C10;
    --dp-sage:#4C7A5A;
    --dp-sage-soft:#EEF3EC;
    --dp-clay:#BE6B4F;
    --dp-clay-soft:#F6E7DF;
    --dp-cream:#FAF7F1;
    --dp-ink:#20281F;
    --dp-ink-70: rgba(32,40,31,0.72);
    --dp-line:#E3DCCE;
    --dp-font-display:'display-serif;
    --dp-font-body:'display-serif;
    font-family: var(--dp-font-body);
    color: var(--dp-ink);
    background: var(--dp-cream);
}
.dp-page h1, .dp-page h2, .dp-page h3, .dp-page h4, .dp-page h5{
    /*font-family: var(--dp-font-display);*/
    color: var(--dp-forest-deep);
    letter-spacing: -0.01em;
}
.dp-page p{ color: var(--dp-ink-70); line-height: 1.75; }

/* ---------- shared layout ---------- */
.dp-section{ padding: 5rem 0; }
.dp-section--tight{ padding: 3.5rem 0; }
.dp-section--alt{ background: #F2EFE6; }
.dp-container{ max-width: 1140px; margin: 0 auto; padding: 0 1.25rem; }
.dp-kicker{
    display:inline-flex; align-items:center; gap:.5rem;
    font-family: var(--dp-font-body);
    font-weight:700; font-size:.72rem;
    letter-spacing:.14em; text-transform:uppercase; color: var(--dp-clay);
}
.dp-kicker::before{ content:""; width:22px; height:2px; background: var(--dp-clay); display:inline-block; }
.dp-heading{ font-size: clamp(1.7rem, 2.6vw, 2.3rem); font-weight:600; margin: .6rem 0 0; }
.dp-lede{ max-width: 680px; }
.dp-header-block{ margin-bottom: 3rem; }
.dp-header-block.dp-center{ 
    text-align:center;     
    max-width: 700px; 
    margin-left:auto; 
    margin-right:auto; }

/* ---------- hero ---------- */
.dp-hero{
    position:relative; 
    display:flex; 
    align-items:center; 
    min-height: 640px;
     background-image: url("../img/11111111111.jpg");
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
    overflow: hidden;
}
.dp-hero::before{
    content:""; 
    position:absolute; 
    inset:0;
    background: linear-gradient(160deg, rgba(8,28,16,.90) 0%, rgba(8,28,16,.62) 48%, rgba(8,28,16,.88) 100%);
}
.dp-hero-inner{ 
    position:relative; 
    z-index:2; 
    max-width: 760px; 
    margin: 0 auto; 
    text-align:center; 
    padding: 0 1.25rem; 
}
.dp-hero-ring{
    width:64px; 
    height:64px; 
    margin:0 auto 1.5rem; 
    border-radius:50%;
    border:1px solid rgba(255,255,255,.35); 
    display:flex; 
    align-items:center; 
    justify-content:center;
    box-shadow: 0 0 0 10px rgba(255,255,255,.06);
}
.dp-hero .dp-hero-title{
    font-family: var(--dp-font-display); 
    color:#fff; 
    font-weight:600;
    font-size: clamp(2.1rem, 4.4vw, 3.4rem); 
    line-height:1.12; margin: 0;
}
.dp-hero .dp-hero-title em{ font-style: italic; color:#E7C9BB; }
.dp-hero p{ color: rgba(255,255,255,.82); margin-top:1.2rem; font-size:1.05rem; }
.dp-btn{
    display:inline-flex; align-items:center; gap:.5rem; border-radius:999px;
    padding:.85rem 1.9rem; font-weight:700; font-size:.95rem; text-decoration:none;
    background: var(--dp-clay); color:#fff; border:1px solid var(--dp-clay); transition:.2s ease;
}
.dp-btn:hover{ background: transparent; color:#fff; }
.dp-btn--outline{ background:transparent; color: var(--dp-forest-deep); border:1px solid var(--dp-forest-deep); }
.dp-btn--outline:hover{ background: var(--dp-forest-deep); color:#fff; }

/* ---------- circles (signature motif) ---------- */
.dp-circle{
    position:relative; flex:none; display:flex; align-items:center; justify-content:center;
    border-radius:50%; background: var(--dp-forest); color:#fff;
    font-family: var(--dp-font-display);
}
.dp-circle::after{
    content:""; position:absolute; inset:-7px; border-radius:50%;
    border:1px solid rgba(15,42,27,.18);
}
.dp-circle--num{ width:52px; height:52px; font-size:1.15rem; font-weight:600; }
.dp-circle--icon{ width:52px; height:52px; background: var(--dp-clay); font-size:1.3rem; }
.dp-circle--icon::after{ border-color: rgba(190,107,79,.25); }
.dp-circle--sm{ width:38px; height:38px; font-size:1rem; }
.dp-circle--sm::after{ inset:-5px; }

/* ---------- intro (two column, no card) ---------- */
.dp-intro-media{ position:relative; }
.dp-intro-media img{ width:100%; height:100%; min-height:320px; object-fit:cover; border-radius:6px; }
.dp-intro-tag{
    position:absolute; left:1.25rem; bottom:-1.25rem; background:#fff;
    border-radius:6px; padding:.9rem 1.2rem; box-shadow: 0 14px 30px rgba(15,42,27,.14);
    font-family: var(--dp-font-display); font-size:.95rem; color: var(--dp-forest-deep);
    display:flex; align-items:center; gap:.6rem;
}
.dp-intro-tag .dp-circle{ width:34px; height:34px; }
.dp-intro-tag .dp-circle::after{ display:none; }

/* ---------- doctor panel ---------- */
.dp-doctor-panel{
    position:relative; border-radius:8px; overflow:hidden; min-height:400px;
    box-shadow: 0 20px 40px rgba(15,42,27,.12);
}
.dp-doctor-panel img{ width:100%; height:100%; object-fit:cover; position:absolute; inset:0; }
.dp-doctor-caption{
    position:absolute; left:0; right:0; bottom:0; padding:1.5rem;
    background: linear-gradient(0deg, rgba(8,28,16,.92), rgba(8,28,16,0));
    color:#fff;
}
.dp-doctor-caption strong{ font-family: var(--dp-font-display); font-size:1.15rem; display:block; }
.dp-doctor-caption span{ font-size:.8rem; letter-spacing:.06em; text-transform:uppercase; color: #E7C9BB; }

/* ---------- numbered feature rows (why dr pragati) ---------- */
.dp-timeline{ position:relative; }
.dp-timeline::before{
    content:""; position:absolute; left:26px; top:12px; bottom:12px; width:1px;
    background: var(--dp-line);
}
.dp-timeline-item{ position:relative; display:flex; gap:1.5rem; padding-bottom:2.4rem; }
.dp-timeline-item:last-child{ padding-bottom:0; }
.dp-timeline-item h5{ font-size:1.15rem; font-weight:600; margin:.3rem 0 .5rem; }
.dp-timeline-item p{ margin:0; }

/* ---------- service rows (icon + text, replaces cards) ---------- */
.dp-service-list{ display:flex; flex-direction:column; }
.dp-service-item{
    display:flex; gap:1.4rem; padding:1.6rem 0; border-top:1px solid var(--dp-line);
}
.dp-service-item:last-child{ border-bottom:1px solid var(--dp-line); }
.dp-service-item h4{ font-size:1.15rem; font-weight:600; margin:0 0 .5rem; }
.dp-service-item p, .dp-service-item ul{ margin:0; }
.dp-service-item ul{ padding-left:1.1rem; }
.dp-service-item li{ color: #000; margin-bottom:.35rem; }
.dp-service-item li strong{ color: var(--dp-ink); }

/* ---------- pill grid (conditions we treat) ---------- */
.dp-pill-grid{ display:flex; flex-wrap:wrap; gap:.75rem; }
.dp-pill{
    display:flex; align-items:center; gap:.65rem; background:#fff; border:1px solid var(--dp-line);
    border-radius:999px; padding:.65rem 1.1rem .65rem .65rem; flex: 1 1 260px;
}
.dp-pill .dp-circle--sm{ background: var(--dp-sage-soft); color: var(--dp-forest); }
.dp-pill .dp-circle--sm::after{ display:none; }
.dp-pill-text strong{ display:block; font-size:.92rem; color: var(--dp-forest-deep); }
.dp-pill-text span{ font-size:15px; color: #000; }

/* ---------- callout (lucknow skin challenge) ---------- */
.dp-callout{
    border-left:3px solid var(--dp-clay); background:#fff; border-radius:0 8px 8px 0;
    padding:2rem 2.2rem; box-shadow: 0 10px 26px rgba(15,42,27,.06);
}

/* ---------- consultation steps (real sequence) ---------- */
.dp-steps{ counter-reset: dpstep; }
.dp-step{ display:flex; gap:1.4rem; align-items:flex-start; margin-bottom:1.9rem; }
.dp-step:last-child{ margin-bottom:0; }
.dp-step h5{ font-size:1.05rem; font-weight:600; margin:0 0 .3rem; }
.dp-step p{ margin:0; }

/* ---------- faq ---------- */
.dp-faq .accordion-item{ border:none; border-bottom:1px solid var(--dp-line); border-radius:0; background:transparent; }
.dp-faq .accordion-button{
    font-family: var(--dp-font-display); font-weight:600; color: var(--dp-forest-deep);
    background:transparent; box-shadow:none; padding:1.3rem .25rem;
}
.dp-faq .accordion-button:not(.collapsed){ color: var(--dp-clay); background:transparent; box-shadow:none; }
.dp-faq .accordion-body{ padding: 0 .25rem 1.4rem; }

/* ---------- appointment ---------- */
.dp-appt{ background: var(--dp-forest-deep); border-radius:12px; overflow:hidden; }
.dp-appt-form{ padding: 3rem; }
.dp-appt .dp-kicker{ color:#E7C9BB; }
.dp-appt .dp-kicker::before{ background:#E7C9BB; }
.dp-appt h2{ color:#fff; }
.dp-appt p{ color: rgba(255,255,255,.7); }
.dp-appt-form .form-label{ color: rgba(255,255,255,.75); }
.dp-appt-form .form-control{
    background: rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.18); color:#fff; border-radius:6px;
}
.dp-appt-form .form-control::placeholder{ color: rgba(255,255,255,.4); }
.dp-map-frame{ height:100%; min-height:420px; }
.dp-map-frame iframe{ width:100%; height:100%; min-height:420px; border:0; display:block; }

@media (max-width: 767px){
    .dp-appt-form{ padding: 2rem 1.4rem; }
    .dp-intro-tag{ position:static; margin-top:1rem; }
}
