/* =========================================================
   Healthcare expert — Narayan Das (dark_theme + design tokens)
   ========================================================= */

.healthcare-expert-page.dark_theme {
    color-scheme: dark;
}

.healthcare-expert-page.dark_theme .hc-expert-page {
    --hc-accent: var(--primary-colors-orange);
    --hc-accent-dark: var(--primary-colors-orange-dark);
    --hc-purple: var(--primary-colors-purple);
    --hc-text: var(--white-scale-900);
    --hc-muted: var(--white-scale-700);
    --hc-muted-2: var(--white-scale-600);
    --hc-border: var(--white-scale-200);
    --hc-surface: var(--background-bg-block);
    --hc-body: var(--background-bg-body);
    --hc-inset: var(--opacity-shade-white-white-100);
    --hc-link: var(--primary-colors-blue);
}

.healthcare-expert-page .hc-expert-page.inner-warper {
    overflow: hidden;
    background: var(--hc-body);
}

/* Hero */
.healthcare-expert-page .hc-expert-hero {
    position: relative;
    padding-bottom: 0;
}

.healthcare-expert-page .hc-expert-hero::before {
    content: "";
    position: absolute;
    inset: 0 0 35%;
    pointer-events: none;
    background:
        radial-gradient(ellipse 70% 55% at 85% 12%, color-mix(in oklab, var(--hc-accent) 20%, transparent), transparent 58%),
        radial-gradient(ellipse 52% 42% at 8% 88%, color-mix(in oklab, var(--hc-purple) 16%, transparent), transparent 55%);
}

.healthcare-expert-page .hc-expert-hero .container {
    position: relative;
    z-index: 1;
}

.healthcare-expert-page .hc-expert-hero__card {
    padding: clamp(22px, 3vw, 36px);
    border-radius: 18px;
    border: 1px solid var(--hc-border);
    background:
        radial-gradient(ellipse 75% 90% at 100% 0%, color-mix(in oklab, var(--hc-accent) 12%, transparent), transparent 58%),
        radial-gradient(ellipse 60% 70% at 0% 100%, color-mix(in oklab, var(--hc-accent) 6%, transparent), transparent 52%),
        var(--hc-surface);
    box-shadow:
        inset 0 1px 0 var(--hc-inset),
        0 16px 40px color-mix(in oklab, var(--hc-text) 8%, transparent);
}

.healthcare-expert-page .hc-expert-hero__eyebrow {
    margin: 0 0 18px;
    font-family: var(--bold);
    font-size: var(--overline);
    line-height: 1.3;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: color-mix(in oklab, var(--hc-accent) 78%, var(--hc-muted));
}

.healthcare-expert-page .hc-expert-hero__inner {
    display: grid;
    grid-template-columns: minmax(200px, 260px) 1fr;
    gap: clamp(24px, 4vw, 48px);
    align-items: center;
}

.healthcare-expert-page .hc-expert-hero__photo {
    margin: 0;
}

.healthcare-expert-page .hc-expert-hero__photo img {
    display: block;
    width: 100%;
    max-width: 260px;
    aspect-ratio: 4 / 5;
    object-fit: cover;
    border-radius: 16px;
    border: 1px solid color-mix(in oklab, var(--hc-accent) 35%, var(--hc-border));
    box-shadow: 0 16px 40px color-mix(in oklab, var(--fix-color-black) 45%, transparent);
}

.healthcare-expert-page .hc-expert-hero__head {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px 16px;
    margin-bottom: 6px;
}

.healthcare-expert-page .hc-expert-hero__head h1 {
    margin: 0;
    color: var(--hc-text);
}

.healthcare-expert-page .hc-expert-hero__linkedin {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 6px 12px;
    font-family: var(--medium);
    font-size: var(--body-1);
    color: var(--hc-text);
    text-decoration: none;
    border-radius: 999px;
    border: 1px solid var(--hc-border);
    background: color-mix(in oklab, var(--hc-body) 55%, var(--hc-surface));
    transition: border-color 0.2s, background 0.2s;
}

.healthcare-expert-page .hc-expert-hero__linkedin:hover {
    border-color: color-mix(in oklab, var(--hc-accent) 45%, var(--hc-border));
    background: color-mix(in oklab, var(--hc-accent) 10%, var(--hc-surface));
    color: var(--hc-text);
}

.healthcare-expert-page .hc-expert-hero__linkedin i {
    font-size: 18px;
    color: var(--hc-link);
}

.healthcare-expert-page .hc-expert-hero__role {
    margin: 0 0 14px;
    color: var(--hc-muted);
}

.healthcare-expert-page .hc-expert-hero__experience {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 0 0 22px;
    font-family: var(--medium);
    color: var(--hc-text);
}

.healthcare-expert-page .hc-expert-hero__experience i {
    color: var(--hc-accent);
    font-size: 20px;
}

.healthcare-expert-page .hc-expert-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.healthcare-expert-page .hc-expert-tags li span {
    display: inline-block;
    padding: 7px 12px;
    font-family: var(--medium);
    font-size: var(--caption-text);
    line-height: 1.35;
    color: var(--hc-muted);
    border-radius: 8px;
    border: 1px solid var(--hc-border);
    background: color-mix(in oklab, var(--hc-body) 50%, var(--hc-surface));
}

/* Body */
.healthcare-expert-page .hc-expert-body {
    padding-top: clamp(32px, 5vw, 56px);
    padding-bottom: clamp(64px, 8vw, 120px);
    background: var(--hc-body);
}

.healthcare-expert-page .hc-expert-layout {
    max-width: 960px;
    margin: 0 auto;
}

.healthcare-expert-page .hc-expert-block {
    margin-bottom: clamp(28px, 4vw, 40px);
}

.healthcare-expert-page .hc-expert-block:last-of-type {
    margin-bottom: 0;
}

.healthcare-expert-page .hc-expert-heading {
    position: relative;
    margin: 0 0 clamp(16px, 2.5vw, 22px);
    padding-left: 14px;
    font-family: var(--bold);
    font-size: var(--h3-headline);
    line-height: 1.35;
    color: var(--hc-text);
}

.healthcare-expert-page .hc-expert-heading::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0.12em;
    width: 3px;
    height: 0.82em;
    border-radius: 2px;
    background: linear-gradient(180deg, var(--hc-accent), var(--hc-accent-dark));
}

.healthcare-expert-page .hc-expert-panel {
    padding: clamp(22px, 3vw, 32px);
    border-radius: 16px;
    border: 1px solid var(--hc-border);
    background: var(--hc-surface);
    box-shadow: inset 0 1px 0 var(--hc-inset);
}

.healthcare-expert-page .hc-expert-prose p {
    margin: 0 0 16px;
    font-size: var(--body-2);
    line-height: 1.75;
    color: var(--hc-muted);
}

.healthcare-expert-page .hc-expert-prose p:last-child {
    margin-bottom: 0;
}

.healthcare-expert-page .hc-expert-prose a {
    color: var(--hc-accent);
    font-family: var(--medium);
    text-decoration: underline;
    text-decoration-color: color-mix(in oklab, var(--hc-accent) 45%, transparent);
    text-underline-offset: 3px;
    transition: color 0.2s, text-decoration-color 0.2s;
}

.healthcare-expert-page .hc-expert-prose a:hover {
    color: var(--hc-accent-dark);
    text-decoration-color: var(--hc-accent-dark);
}

.healthcare-expert-page .hc-expert-prose--tight {
    margin-bottom: 16px;
}

.healthcare-expert-page .hc-expert-subheading {
    margin: 24px 0 14px;
    font-family: var(--bold);
    font-size: var(--subtitle-3);
    color: var(--hc-text);
}

/* Expertise grid */
.healthcare-expert-page .hc-expert-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.healthcare-expert-page .hc-expert-grid > li {
    padding: 16px 18px;
    border-radius: 12px;
    border: 1px solid var(--hc-border);
    background: color-mix(in oklab, var(--hc-body) 35%, var(--hc-surface));
    transition: border-color 0.2s, background 0.2s;
}

.healthcare-expert-page .hc-expert-grid > li:hover {
    border-color: color-mix(in oklab, var(--hc-accent) 35%, var(--hc-border));
    background: color-mix(in oklab, var(--hc-accent) 6%, var(--hc-surface));
}

.healthcare-expert-page .hc-expert-grid h3 {
    position: relative;
    margin: 0 0 8px;
    padding-left: 14px;
    font-family: var(--bold);
    font-size: var(--subtitle-2);
    line-height: 1.35;
    color: var(--hc-text);
}

.healthcare-expert-page .hc-expert-grid h3::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0.45em;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--hc-accent);
}

.healthcare-expert-page .hc-expert-grid p {
    margin: 0;
    font-size: var(--body-1);
    line-height: 1.65;
    color: var(--hc-muted);
}

/* Links */
.healthcare-expert-page .hc-expert-links {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin: 0 0 24px;
    padding: 0;
    list-style: none;
}

.healthcare-expert-page .hc-expert-links a {
    display: inline-block;
    padding: 8px 14px;
    font-family: var(--medium);
    font-size: var(--caption-text);
    color: var(--hc-text);
    text-decoration: none;
    border-radius: 8px;
    border: 1px solid var(--hc-border);
    background: color-mix(in oklab, var(--hc-body) 40%, var(--hc-surface));
    transition: border-color 0.2s, background 0.2s;
}

.healthcare-expert-page .hc-expert-links a:hover {
    border-color: color-mix(in oklab, var(--hc-accent) 45%, var(--hc-border));
    background: color-mix(in oklab, var(--hc-accent) 10%, var(--hc-surface));
    color: var(--hc-text);
}

.healthcare-expert-page .hc-expert-questions {
    margin: 0;
    padding: 16px 18px 16px 2rem;
    border-radius: 12px;
    border: 1px dashed color-mix(in oklab, var(--hc-accent) 28%, var(--hc-border));
    background: color-mix(in oklab, var(--hc-accent) 5%, var(--hc-body));
    color: var(--hc-muted);
    font-size: var(--body-2);
}

.healthcare-expert-page .hc-expert-questions li {
    margin-bottom: 8px;
    line-height: 1.55;
}

.healthcare-expert-page .hc-expert-questions li::marker {
    color: var(--hc-accent);
}

/* Quote */
.healthcare-expert-page .hc-expert-quote {
    margin: 0;
    padding: clamp(22px, 3vw, 32px);
    border-radius: 16px;
    border: 1px solid var(--hc-border);
    border-left: 4px solid var(--hc-accent);
    background:
        linear-gradient(90deg, color-mix(in oklab, var(--hc-accent) 10%, transparent) 0%, transparent 42%),
        var(--hc-surface);
    box-shadow: inset 0 1px 0 var(--hc-inset);
}

.healthcare-expert-page .hc-expert-quote p {
    margin: 0 0 14px;
    font-size: var(--body-3);
    line-height: 1.7;
    font-style: italic;
    color: var(--hc-text);
}

.healthcare-expert-page .hc-expert-quote cite {
    display: block;
    font-family: var(--bold);
    font-size: var(--body-1);
    font-style: normal;
    letter-spacing: 0.02em;
    color: var(--hc-accent);
}

/* Focus */
.healthcare-expert-page .hc-expert-focus-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.healthcare-expert-page .hc-expert-focus-grid li {
    padding: 10px 14px;
    font-family: var(--medium);
    font-size: var(--body-1);
    color: var(--hc-muted);
    border-radius: 10px;
    border: 1px solid var(--hc-border);
    background: color-mix(in oklab, var(--hc-body) 45%, var(--hc-surface));
}

/* CTA */
.healthcare-expert-page .hc-expert-cta {
    margin-top: clamp(36px, 5vw, 48px);
    padding-top: 32px;
    border-top: 1px solid var(--hc-border);
    text-align: center;
}

@media (max-width: 991px) {
    .healthcare-expert-page .hc-expert-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 767px) {
    .healthcare-expert-page .hc-expert-hero__inner {
        grid-template-columns: 1fr;
        text-align: center;
    }

    .healthcare-expert-page .hc-expert-hero__photo img {
        max-width: 220px;
        margin: 0 auto;
    }

    .healthcare-expert-page .hc-expert-hero__head,
    .healthcare-expert-page .hc-expert-hero__experience,
    .healthcare-expert-page .hc-expert-tags {
        justify-content: center;
    }
}