/* ============================================================
   DIKKHA Phase 2 — page styles
   Extends the EkkTraining design system in style.css.
   ============================================================ */

/* ---------------- Hero ---------------- */
.dk-hero{
  position:relative;overflow:hidden;
  padding:clamp(52px,8vw,110px) 0 clamp(56px,8vw,100px);
  background:
    radial-gradient(55% 60% at 90% 4%, var(--green-soft), transparent 62%),
    radial-gradient(50% 58% at 2% 26%, var(--gold-soft), transparent 64%),
    linear-gradient(180deg,#fff 0%,var(--bg-soft) 100%);
}
.dk-title{font-size:clamp(2.2rem,5.8vw,4rem);font-weight:700;max-width:19ch}
.dk-status{
  display:inline-flex;align-items:center;gap:.6em;
  margin-top:26px;font-size:.74rem;color:var(--navy);
  background:var(--navy-soft);padding:10px 18px;border-radius:999px;
}
.dk-status::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--gold)}

.dk-stats{display:grid;gap:16px;margin-top:clamp(40px,5vw,60px)}
@media (min-width:700px){.dk-stats{grid-template-columns:repeat(3,1fr);gap:20px}}
.dk-stat{
  padding:28px 26px;border-radius:var(--radius);background:#fff;
  border:1px solid var(--line);box-shadow:var(--shadow-sm);
  transition:transform .35s var(--ease),box-shadow .35s var(--ease);
}
.dk-stat:hover{transform:translateY(-6px);box-shadow:var(--shadow-lg)}

.dk-figure{
  display:block;font-family:"Space Grotesk",sans-serif;font-weight:700;
  font-size:clamp(2.4rem,6vw,3.4rem);line-height:1;letter-spacing:-.03em;
  background:var(--grad-cool);-webkit-background-clip:text;background-clip:text;color:transparent;
}
.dk-figure-gold{background:var(--grad-warm);-webkit-background-clip:text;background-clip:text;color:transparent}
.dk-caption{display:block;margin-top:14px;color:var(--body);font-size:.96rem;max-width:34ch}

/* ---------------- Phase 1 results ---------------- */
.dk-results{display:grid;gap:18px;margin-top:clamp(40px,5vw,56px)}
@media (min-width:700px){.dk-results{grid-template-columns:repeat(3,1fr)}}
.dk-result{
  padding:30px 26px;border-radius:var(--radius);background:#fff;
  border:1px solid var(--line);box-shadow:var(--shadow-md);position:relative;overflow:hidden;
}
.dk-result::before{content:"";position:absolute;left:0;top:0;width:100%;height:5px;background:var(--green)}
.dk-result:nth-child(2)::before{background:var(--gold)}
.dk-result:nth-child(3)::before{background:var(--sky)}
.dk-result p{margin-top:14px;color:var(--body);font-size:.96rem}

.dk-subhead{margin-top:clamp(52px,7vw,84px)!important;margin-bottom:22px}

.dk-proof{
  padding:28px 26px;border-radius:var(--radius);background:#fff;
  border:1px solid var(--line);box-shadow:var(--shadow-sm);
  transition:transform .35s var(--ease),box-shadow .35s var(--ease);
}
.dk-proof:hover{transform:translateY(-6px);box-shadow:var(--shadow-lg)}
.dk-proof h3{font-size:1.18rem;margin-bottom:10px}
.dk-proof p{font-size:.94rem}
.dk-icon{
  display:inline-flex;align-items:center;justify-content:center;
  width:54px;height:54px;margin-bottom:18px;border-radius:18px;background:var(--green-soft);
}
.dk-icon svg{width:26px;height:26px;fill:none;stroke:var(--green);
  stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.dk-proof:nth-child(2) .dk-icon{background:var(--gold-soft)}
.dk-proof:nth-child(2) .dk-icon svg{stroke:var(--gold)}
.dk-proof:nth-child(3) .dk-icon{background:var(--sky-soft)}
.dk-proof:nth-child(3) .dk-icon svg{stroke:var(--sky)}

/* ---------------- Ambition ---------------- */
.dk-growth{display:grid;gap:18px;margin-top:clamp(40px,5vw,60px)}
@media (min-width:768px){.dk-growth{grid-template-columns:repeat(3,1fr)}}
.dk-jump{
  padding:32px 28px;border-radius:var(--radius-lg);background:#fff;
  border:1px solid var(--line);box-shadow:var(--shadow-sm);
}
.dk-jump-line{display:flex;align-items:baseline;flex-wrap:wrap;gap:.35em;
  font-family:"Space Grotesk",sans-serif;font-weight:700;letter-spacing:-.03em;line-height:1.05}
.dk-from{font-size:clamp(1.4rem,3.4vw,1.9rem);color:var(--muted)}
.dk-arrow{font-size:clamp(1.2rem,2.8vw,1.6rem);color:var(--gold)}
.dk-to{font-size:clamp(2.1rem,5.4vw,3rem);
  background:var(--grad-warm);-webkit-background-clip:text;background-clip:text;color:transparent}
.dk-jump:nth-child(2) .dk-to{background:var(--grad-fresh);-webkit-background-clip:text;background-clip:text}
.dk-jump:nth-child(3) .dk-to{background:var(--grad-cool);-webkit-background-clip:text;background-clip:text}

/* ---------------- Curriculum ---------------- */
.dk-tracks{display:grid;gap:18px;margin-top:clamp(40px,5vw,60px)}
@media (min-width:600px){.dk-tracks{grid-template-columns:1fr 1fr}}
@media (min-width:1024px){.dk-tracks{grid-template-columns:repeat(3,1fr)}}
.dk-track{
  position:relative;overflow:hidden;padding:32px 28px 36px;
  border-radius:var(--radius);background:#fff;
  border:1px solid var(--line);box-shadow:var(--shadow-sm);
  transition:transform .35s var(--ease),box-shadow .35s var(--ease);
}
.dk-track::after{content:"";position:absolute;left:0;bottom:0;height:5px;width:0;
  background:var(--grad-warm);transition:width .5s var(--ease)}
.dk-track:nth-child(3n+2)::after{background:var(--grad-fresh)}
.dk-track:nth-child(3n)::after{background:var(--grad-cool)}
.dk-track:hover{transform:translateY(-6px);box-shadow:var(--shadow-lg)}
.dk-track:hover::after{width:100%}
.dk-track .num{
  display:inline-flex;align-items:center;justify-content:center;
  width:46px;height:46px;border-radius:15px;margin-bottom:16px;
  background:var(--gold-soft);color:var(--gold);font-weight:500;font-size:.84rem;
}
.dk-track:nth-child(3n+2) .num{background:var(--green-soft);color:var(--green)}
.dk-track:nth-child(3n) .num{background:var(--sky-soft);color:var(--sky)}
.dk-track h3{font-size:1.22rem;line-height:1.25}

/* ---------------- Inclusion gallery ---------------- */
.dk-gallery{display:grid;gap:20px}
@media (min-width:560px){.dk-gallery{grid-template-columns:1fr 1fr}}
.dk-photo{margin:0}
.dk-photo-frame{
  display:flex;align-items:center;justify-content:center;
  aspect-ratio:4/3;border-radius:var(--radius);
  border:2px dashed var(--line-strong);background:#fff;
}
.dk-photo-frame .mono{font-size:.7rem;color:var(--muted);text-align:center;padding:0 16px}
.dk-photo figcaption{margin-top:14px;font-size:.9rem;color:var(--body);line-height:1.5}

/* ---------------- Pipeline ---------------- */
.dk-pipeline{display:grid;gap:18px;margin-top:clamp(40px,5vw,60px)}
@media (min-width:768px){.dk-pipeline{grid-template-columns:repeat(4,1fr)}}
.dk-pipeline li{
  padding:28px 24px 26px;border-radius:var(--radius);background:#fff;
  border:1px solid var(--line);box-shadow:var(--shadow-sm);
}
.dk-step{display:block;color:var(--navy);margin-bottom:12px;font-size:.74rem;font-weight:500}
.dk-pipeline h3{font-size:1.14rem}
.dk-pipeline li.is-in .j-bar::after{width:100%}
.dk-pipeline li:nth-child(2) .j-bar::after{transition-delay:.12s;background:var(--grad-fresh)}
.dk-pipeline li:nth-child(3) .j-bar::after{transition-delay:.24s;background:var(--grad-cool)}
.dk-pipeline li:nth-child(4) .j-bar::after{transition-delay:.36s;background:var(--grad-warm)}

/* ---------------- Partners ---------------- */
.dk-partners{display:grid;gap:20px;margin-top:clamp(40px,5vw,60px)}
@media (min-width:768px){.dk-partners{grid-template-columns:1fr 1fr}}
.dk-partners li{
  padding:clamp(28px,3.5vw,40px);border-radius:var(--radius-lg);background:#fff;
  border:1px solid var(--line);box-shadow:var(--shadow-sm);
  transition:transform .3s var(--ease),box-shadow .3s var(--ease);
}
.dk-partners li:hover{transform:translateY(-5px);box-shadow:var(--shadow-lg)}
.dk-partners h3{font-size:clamp(1.2rem,2.6vw,1.5rem);margin-bottom:8px}
.dk-partners p{color:var(--body);font-size:.96rem}

@media (prefers-reduced-motion:reduce){
  .dk-pipeline .j-bar::after{width:100%}
  .dk-track::after{transition:none}
}