/* ===== Epic Essay – Dissertation Page ===== */
:root{
    --wrap: min(96vw, 1200px);
    --ink:#0f172a;
    --muted:#64748b;
    --card:#ffffff;
    --primary-500:#3b82f6; /* blue-500 */
    --primary-600:#2563eb; /* brand blue */
    --primary-700:#1e47d7;
    --accent:#ff7a45;
    --ring: rgba(37,99,235,.22);
    --radius:18px;
    --shadow: 0 18px 40px rgba(2,6,23,.10);
    --shadow-lg: 0 30px 70px rgba(2,6,23,.14);
}

/* Page wrapper (subtle blue gradient like the rest of the site) */
.page{
    background:
        radial-gradient(1100px 600px at 80% -5%, rgba(37,99,235,.10), transparent 60%),
        radial-gradient(900px 540px at 10% 0%, rgba(59,130,246,.08), transparent 60%),
        linear-gradient(180deg,#f5f8ff 0%, #eef2ff 55%, #edf1ff 100%);
    color:var(--ink);
    font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
}

/* Fluid container */
.wrap{max-width:var(--wrap); margin:auto; padding: clamp(20px, 4vw, 40px) 0}

/* ---------- HERO ---------- */
.d-hero{
    padding: clamp(36px, 6vw, 64px) 0 10px;
}
.d-hero__title{
    font-weight: 800;
    letter-spacing:-0.02em;
    font-size: clamp(34px, 5.2vw, 66px);
    margin: 0 0 10px;
    background: linear-gradient(90deg, #0f172a, #0b176b 60%, #0f172a);
    -webkit-background-clip: text; -webkit-text-fill-color: transparent;
}
.d-hero__sub{
    font-size: clamp(16px, 1.7vw, 20px);
    color:#334155;
    max-width: 72ch;
    margin: 0 0 18px;
}
.d-hero__cta{
    display:flex; gap:12px; flex-wrap:wrap; margin-top:10px;
}
.btn{
    display:inline-flex; align-items:center; gap:10px;
    border-radius: 999px; padding: 12px 20px;
    font-weight:700; text-decoration:none; transition:.18s ease;
}
.btn--accent{
    background:var(--accent); color:#fff; box-shadow:0 16px 28px rgba(255,122,69,.26);
}
.btn--ghost{
    border:2px solid var(--primary-600); color:var(--primary-600); background:#fff;
}
.btn:hover{ transform: translateY(-1px) }

/* ---------- STATS (cards with hover + optional counter-ready) ---------- */
.stats{
    display:grid; gap:14px;
    grid-template-columns: repeat(3, minmax(0,1fr));
    margin-top:18px;
}
.stat{
    background:#fff; border-radius:16px; box-shadow:var(--shadow);
    padding:16px 18px; display:flex; align-items:center; gap:12px;
    transition:.2s; border:1px solid #e6ecff;
}
.stat:hover{ transform: translateY(-3px); box-shadow:var(--shadow-lg) }
.stat__icon{
    width:42px; height:42px; border-radius:12px; display:grid; place-items:center;
    color:#fff; flex:0 0 42px;
    background: linear-gradient(135deg,#22d3ee,#2563eb);
    box-shadow: inset 0 -6px 10px rgba(0,0,0,.08);
}
.stat__num{ font-size: clamp(20px, 2.6vw, 28px); font-weight:800; line-height:1 }
.stat__label{ color:var(--muted); font-weight:600; font-size:14px }

/* ---------- SERVICES GRID ---------- */
.services{
    margin-top: clamp(26px, 4vw, 38px);
    display:grid; gap:18px;
    grid-template-columns: repeat(3, minmax(0,1fr));
}
.card{
    background:var(--card); border-radius: var(--radius);
    box-shadow: var(--shadow); border:1px solid #e7ecff;
    padding: 22px; display:flex; flex-direction:column; gap:12px;
}
.card__head{ display:flex; align-items:center; gap:12px; }
.card__icon{
    width:48px;height:48px;border-radius:14px;display:grid;place-items:center;color:#fff;
    background:linear-gradient(135deg,#22d3ee,#2563eb);
}
.card h3{ margin:0; font-size:20px }
.card p{ margin:0; color:#475569 }
.card ul{ margin:8px 0 0; padding-left:18px; color:#334155 }
.card li{ margin:6px 0 }
.card .cta-row{ margin-top:auto; display:flex; gap:10px; }
.btn--pill{ border-radius:999px; padding:10px 16px; font-weight:700 }

/* ---------- PROCESS STEPS ---------- */
.process{
    margin-top: clamp(34px,5vw,52px);
    display:grid; gap:18px;
    grid-template-columns: repeat(5, minmax(120px,1fr));
}
.step{
    background:#fff; border-radius:16px; border:1px solid #e7ecff;
    box-shadow: var(--shadow); padding:16px; text-align:center;
}
.step__icon{
    width:54px;height:54px;margin:0 auto 8px;border-radius:14px;display:grid;place-items:center;
    background:linear-gradient(135deg,#a78bfa,#6366f1); color:#fff; font-size:22px;
}
.step b{ display:block; margin-bottom:4px }
.step small{ color:var(--muted) }

/* ---------- WHY CHOOSE ---------- */
.usp{
    margin-top: clamp(34px,5vw,52px);
    display:grid; gap:18px;
    grid-template-columns: repeat(3, minmax(0,1fr));
}
.usp .card{ min-height: 170px }

/* ---------- TESTIMONIAL ---------- */
.testi{
    margin-top: clamp(34px,6vw,56px);
    display:grid; gap:16px; grid-template-columns: 1fr;
}
.quote{
    background:#fff; border-radius:20px; box-shadow: var(--shadow-lg);
    border:1px solid #e7ecff; padding:22px;
}
.stars{ color:#f59e0b; letter-spacing:2px; font-size:18px; margin-bottom:6px }
.quote__meta{ color:var(--muted); font-weight:600 }

/* ---------- FAQ (details/summary) ---------- */
.faq{ margin-top: clamp(20px,4vw,36px) }
.faq details{
    background:#fff; border-radius:14px; border:1px solid #e7ecff; box-shadow:var(--shadow);
    margin-bottom:12px; padding:14px 16px;
}
.faq summary{
    cursor:pointer; list-style:none; font-weight:700; color:#0f172a;
}
.faq summary::-webkit-details-marker{ display:none }
.faq p{ color:#475569; margin:8px 0 0 }

/* ---------- Responsive ---------- */
@media (max-width: 1024px){
    .services{ grid-template-columns:1fr 1fr }
    .process{ grid-template-columns: repeat(3, minmax(0,1fr)) }
    .usp{ grid-template-columns:1fr 1fr }
}
@media (max-width: 640px){
    .stats{ grid-template-columns: 1fr 1fr 1fr }
    .services, .usp{ grid-template-columns:1fr }
    .process{ grid-template-columns: repeat(2, minmax(0,1fr)) }
    .d-hero__cta{ justify-content:center }
}

/* Focus states */
:where(a,button,.btn):focus-visible{ outline:0; box-shadow:0 0 0 4px var(--ring) }