/* ===================================================================
   RESPONSIVE HARDENING LAYER
   Cross-device consistency for phones, laptops, desktops, and large displays
   =================================================================== */

:root {
    --safe-top: env(safe-area-inset-top, 0px);
    --safe-right: env(safe-area-inset-right, 0px);
    --safe-bottom: env(safe-area-inset-bottom, 0px);
    --safe-left: env(safe-area-inset-left, 0px);
}

html {
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
}

body {
    min-width: 320px;
}

img,
picture,
video,
canvas,
svg,
iframe {
    max-width: 100%;
    height: auto;
}

main,
section,
article,
.container,
[class*="grid"],
[class*="list"] {
    min-width: 0;
}

.container {
    width: min(var(--container-max-width), 100%);
}

:where(a, button, input, textarea, select) {
    touch-action: manipulation;
}

:where(a, button, input, textarea, select):focus-visible {
    outline: 2px solid rgba(var(--color-primary-rgb), 0.85);
    outline-offset: 2px;
}

@media (max-width: 1100px) {
    :root {
        --container-padding: clamp(0.75rem, 2.5vw, 1.15rem);
    }
}

@media (max-width: 768px) {
    .section-header {
        margin-bottom: 2rem;
    }

    .container {
        padding-left: max(var(--container-padding), var(--safe-left));
        padding-right: max(var(--container-padding), var(--safe-right));
    }

    .hero-cta-group,
    .hero-action-row,
    .cta-buttons {
        flex-wrap: wrap;
    }
}

@media (max-width: 560px) {
    .container {
        padding-left: max(0.75rem, var(--safe-left));
        padding-right: max(0.75rem, var(--safe-right));
    }

    .social-links {
        left: 0.4rem;
    }

    .social-links a {
        min-width: 44px;
        min-height: 44px;
    }
}

@media (max-height: 560px) and (orientation: landscape) {
    section {
        padding: 3.25rem 0;
    }

    .header {
        height: 60px;
    }

    .hero-modern {
        min-height: auto;
    }
}

@media (min-width: 1600px) {
    :root {
        --container-max-width: 1400px;
        --container-padding: 1.5rem;
    }
}

@media (min-width: 2200px) {
    :root {
        --container-max-width: 1680px;
    }

    body {
        font-size: 1.03rem;
    }
}

/* ===================================================================
   FINAL UI LOCK: Projects + Open Source section
   Ensures latest layout wins across cached/older component variants
   =================================================================== */

#github-activity.github-section-modern {
    padding-top: clamp(2.5rem, 6vw, 4rem);
    padding-bottom: clamp(2.25rem, 5vw, 3.5rem);
}

#github-activity .github-unified-layout {
    gap: 1.1rem;
}

#github-activity .github-top-row {
    grid-template-columns: minmax(280px, 332px) minmax(0, 1fr);
    gap: 1rem;
    align-items: start;
}

#github-activity .github-profile-card {
    height: auto !important;
    min-height: 0 !important;
    align-self: start;
    padding: 1.1rem 1.05rem;
    gap: 0.85rem;
}

#github-activity .github-header {
    margin-bottom: 0.2rem;
}

#github-activity .gh-avatar {
    width: 68px;
    height: 68px;
}

#github-activity .gh-metrics {
    gap: 0.45rem;
}

#github-activity .gh-metric {
    min-height: 72px;
    padding: 0.62rem 0.42rem;
}

#github-activity .gh-metric-label {
    white-space: nowrap !important;
    font-size: 0.68rem !important;
    letter-spacing: 0.04em;
    line-height: 1.1;
}

#github-activity .github-heatmap-container {
    margin-top: 0 !important;
    padding: 1.1rem 1.15rem 0.95rem;
    gap: 0.65rem;
    min-height: 0;
}

#github-activity .heatmap-title {
    margin-bottom: 0;
}

#github-activity .heatmap-subtitle {
    margin-top: 0.1rem;
    margin-bottom: 0.1rem;
}

#github-activity .heatmap-frame {
    padding: 0.7rem 0.75rem 0.5rem;
}

#github-activity .github-heatmap-img {
    width: 920px;
    min-width: 920px;
}

#github-activity .heatmap-legend {
    gap: 0.35rem;
}

#github-activity .heatmap-dot {
    border: 1px solid rgba(22, 163, 74, 0.28);
}

#github-activity .heatmap-dot.level-1 {
    background: #dcfce7;
}

#github-activity .heatmap-dot.level-2 {
    background: #86efac;
}

#github-activity .heatmap-dot.level-3 {
    background: #4ade80;
}

#github-activity .heatmap-dot.level-4 {
    background: #16a34a;
}

[data-theme="dark"] #github-activity .heatmap-dot.level-1 {
    background: #14532d;
}

[data-theme="dark"] #github-activity .heatmap-dot.level-2 {
    background: #166534;
}

[data-theme="dark"] #github-activity .heatmap-dot.level-3 {
    background: #16a34a;
}

[data-theme="dark"] #github-activity .heatmap-dot.level-4 {
    background: #22c55e;
}

#github-activity .github-projects-heading {
    margin: 0.4rem 0 0;
}

#github-activity .projects-grid-github {
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 1rem;
}

#github-activity .gh-repo-card {
    min-height: 168px !important;
    height: auto !important;
    padding: 1rem 1.05rem !important;
    display: grid;
    grid-template-rows: auto auto auto 1fr auto;
    gap: 0.4rem;
}

#github-activity .gh-repo-header {
    margin-bottom: 0.05rem;
}

#github-activity .gh-repo-title {
    text-wrap: balance;
    word-break: normal;
    overflow-wrap: anywhere;
}

#github-activity .gh-repo-org {
    line-height: 1.3;
}

#github-activity .gh-repo-date {
    margin-top: 0.05rem;
}

#github-activity .gh-repo-view-btn {
    margin-top: 0.45rem;
}

@media (max-width: 1080px) {
    #github-activity .github-top-row {
        grid-template-columns: 1fr;
    }

    #github-activity .github-heatmap-img {
        width: 820px;
        min-width: 820px;
    }
}

@media (max-width: 760px) {
    #github-activity .github-profile-card {
        padding: 0.95rem;
    }

    #github-activity .gh-metric {
        min-height: 66px;
    }

    #github-activity .gh-metric-label {
        font-size: 0.64rem !important;
    }

    #github-activity .github-heatmap-container {
        padding: 0.95rem 0.85rem 0.8rem;
    }

    #github-activity .github-heatmap-img {
        width: 680px;
        min-width: 680px;
    }

    #github-activity .projects-grid-github {
        grid-template-columns: 1fr;
    }

    #github-activity .gh-repo-card {
        min-height: 156px !important;
    }
}

/* ===================================================================
   DEVICE COVERAGE EXTENSIONS
   Final cross-ratio and cross-breakpoint safety net
   =================================================================== */

html,
body {
    overflow-x: hidden;
}

html {
    scroll-padding-top: calc(var(--header-height, 72px) + 12px);
}

:where(
    .hero-title-gradient,
    .hero-title-name,
    .hero-role,
    .section-title-3d,
    .project-card-title,
    .pub-title,
    .leadership-card-title,
    .experience-title,
    .footer-name,
    .contact-method-value
) {
    overflow-wrap: anywhere;
}

:where(
    .hero-grid-3d,
    .skills-experience-grid,
    .contact-grid-modern,
    .footer-grid,
    .github-top-row,
    .about-narrative-grid
) > * {
    min-width: 0;
}

:where(
    .pub-header-info,
    .leadership-card-main,
    .project-card-content,
    .contact-cta-content,
    .contact-method-content,
    .footer-description
) {
    min-width: 0;
}

.project-link-btn,
.doi-link,
.pub-link,
.btn-contact-primary,
.btn-contact-secondary {
    white-space: normal;
}

.project-card-title,
.project-card-description,
.pub-title,
.pub-summary,
.leadership-card-org,
.leadership-card-subdate,
.contact-method-value,
.footer-description {
    overflow-wrap: anywhere;
}

@media (max-width: 1100px) {
    .leadership-list-compact {
        max-width: 100%;
    }

    .leadership-card-compact {
        grid-template-columns: minmax(0, 1fr);
        align-items: start;
    }

    .leadership-view-btn {
        width: 100%;
        justify-self: stretch;
        text-align: center;
    }

    .projects-grid-modern,
    .github-unified-layout .projects-grid-github,
    .projects-grid-github,
    .certifications-grid-modern,
    .certifications-grid {
        grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr));
    }
}

@media (max-width: 900px) {
    .pub-card-header,
    .publication-card-modern.compact .pub-card-header {
        flex-direction: column;
        align-items: flex-start;
    }

    .pub-status-badge,
    .publication-card-modern.compact .pub-status-badge {
        position: static;
        top: auto;
        right: auto;
        width: fit-content;
        margin-bottom: 0.25rem;
    }

    .pub-meta-info,
    .pub-actions,
    .pub-links-section,
    .pub-doi {
        flex-wrap: wrap;
        align-items: flex-start;
    }

    .pub-links-section {
        flex-direction: column;
    }

    .project-links {
        flex-wrap: wrap;
    }

    .project-link-btn {
        min-width: calc(50% - 0.5rem);
    }

    .footer-grid {
        gap: 2rem;
    }
}

@media (max-width: 768px) {
    .hero-modern-3d,
    .skills-experience-section,
    .projects-section-modern,
    .publications-section-modern,
    .leadership-section-modern,
    .contact-section-modern,
    .footer-modern {
        overflow: clip;
    }

    .pub-card-header,
    .leadership-header,
    .project-links,
    .contact-cta-actions,
    .footer-logo {
        gap: 0.85rem;
    }

    .pub-authors-section,
    .pub-abstract-section,
    .pub-keywords-section,
    .pub-metrics,
    .education-timeline-item,
    .education-highlight-card,
    .project-card-content,
    .contact-cta-card,
    .contact-methods-modern {
        padding-left: clamp(1rem, 4vw, 1.3rem);
        padding-right: clamp(1rem, 4vw, 1.3rem);
    }

    .pub-stats-box {
        grid-template-columns: 1fr;
    }

    .contact-grid-modern,
    .skills-experience-grid {
        gap: 1.5rem;
    }
}

@media (max-width: 560px) {
    .project-link-btn,
    .btn-contact-primary,
    .btn-contact-secondary,
    .doi-link {
        width: 100%;
    }

    .pub-meta-info,
    .authors-more,
    .project-tech-tags,
    .keywords-cloud {
        gap: 0.5rem;
    }

    .pub-metrics,
    .pub-authors-section,
    .pub-abstract-section,
    .pub-keywords-section,
    .pub-stats-box,
    .publication-card-modern,
    .leadership-card-compact,
    .project-card-content,
    .contact-cta-card,
    .contact-method-item {
        border-radius: 16px;
    }

    .footer-bottom {
        align-items: center;
    }
}

@media (max-width: 420px) {
    .pub-icon,
    .leadership-icon,
    .cert-icon-modern,
    .interest-icon-modern {
        width: 48px;
        height: 48px;
    }

    .project-image-container {
        height: 188px;
    }

    #github-activity .github-heatmap-img {
        width: 560px;
        min-width: 560px;
    }

    .chatbot-window {
        width: 100vw;
    }
}

@media (max-height: 760px) and (orientation: landscape) {
    body {
        padding-left: 0;
    }

    .social-sidebar {
        display: none;
    }

    .hero-modern-3d {
        min-height: auto;
        padding-top: 96px;
        padding-bottom: 56px;
    }

    .scroll-hint {
        display: none;
    }
}
