/* Shared classic choreography and restrained interaction feedback.
   Reduced motion and print remain immediate. */
html[data-experience="classic"] {
    --classic-ease: cubic-bezier(.22, .61, .36, 1);
    --classic-feedback: 220ms;
    --classic-disclosure: 360ms;
}

/* Stable typography and logos prevent the timeline from jumping under the mouse. */
html[data-experience="classic"] .experience-card { will-change: auto; }
html[data-experience="classic"] .experience-card .experience-logo { width: 3rem; height: 3rem; padding: .25rem; }
html[data-experience="classic"] .experience-card .experience-title { font-size: 1.125rem; }
@media (min-width: 768px) {
    html[data-experience="classic"] .experience-card .experience-title { font-size: 1.25rem; }
}
.experience-details { display: contents; }
html[data-experience="classic"] .experience-details {
    display: grid;
    grid-template-rows: 0fr;
    opacity: 0;
    visibility: hidden;
    margin-top: 0;
}
html[data-experience="classic"] .experience-card .experience-responsibilities {
    min-height: 0;
    max-height: none;
    opacity: 1;
    margin-top: 0;
    overflow: hidden;
}
html[data-experience="classic"] .experience-card:is(.is-pinned, :focus-visible) .experience-details {
    grid-template-rows: 1fr;
    opacity: 1;
    visibility: visible;
    margin-top: .75rem;
}
html[data-experience="classic"] .experience-pin-indicator { transform: scale(.96); }
html[data-experience="classic"] .experience-card.is-pinned .experience-pin-indicator { transform: scale(1); }

/* Keep the existing materials, without spinning icons or zooming photographs. */
html[data-experience="classic"] .language-flag { transform: none !important; }
html[data-experience="classic"] .language-bar-fill { box-shadow: none !important; }
html[data-experience="classic"] .project-image { filter: none; }
html[data-experience="classic"] .project-tech-reveal { transform: translateY(6px); }
html[data-experience="classic"] .project-tech-pill { transform: none; opacity: 1; transition-delay: 0s !important; }
html[data-experience="classic"] .classic-name-gradient::before,
html[data-experience="classic"] .classic-name-gradient::after { display: none; }
html[data-experience="classic"] :is(.btn-primary, .btn-secondary, .ai-launcher):hover { transform: none; }
html[data-experience="classic"] .classic-scroll-indicator:hover { transform: translate(-50%, 0); }
html[data-experience="classic"] :is([class*="hover:scale-110"], [class*="group-hover:scale-110"]) { scale: 1 !important; }

@media (hover: hover) and (pointer: fine) {
    html[data-experience="classic"] .experience-card:hover .experience-details {
        grid-template-rows: 1fr; opacity: 1; visibility: visible; margin-top: .75rem;
    }
    html[data-experience="classic"] .portfolio-screen :is(.card-hover, .language-card):hover {
        border-color: color-mix(in srgb, var(--primary-color) 35%, var(--border-primary));
        box-shadow: 0 12px 28px var(--shadow-md), inset 0 1px 0 var(--surface-highlight);
    }
    html[data-experience="classic"] .group:hover .project-tech-reveal { transform: translateY(0); }
}

@media (prefers-reduced-motion: no-preference) {
    html[data-experience="classic"] :is(.card-hover, .language-card, .skill-badge, a, button, .contact-input, .floating-field, .experience-title, .project-title) {
        transition: color var(--classic-feedback) ease, background-color var(--classic-feedback) ease,
            border-color var(--classic-feedback) ease, box-shadow 280ms var(--classic-ease), opacity var(--classic-feedback) ease !important;
    }
    html[data-experience="classic"] .experience-details {
        transition: grid-template-rows var(--classic-disclosure) var(--classic-ease),
            margin-top var(--classic-disclosure) var(--classic-ease), opacity 220ms ease,
            visibility var(--classic-disclosure) !important;
    }
    html[data-experience="classic"] :is(.project-tech-reveal, .experience-pin-indicator) {
        transition: transform 280ms var(--classic-ease), opacity 220ms ease !important;
    }
    html[data-experience="classic"] .project-image-overlay { transition: opacity 280ms ease !important; }
    html[data-experience="classic"] .floating-label { transition: top 200ms var(--classic-ease), transform 200ms var(--classic-ease), font-size 200ms ease, color 200ms ease !important; }
}

@media print {
    html[data-experience="classic"] .experience-details { display: block; opacity: 1; visibility: visible; margin-top: .75rem; }
    html[data-experience="classic"] *, html[data-experience="classic"] *::before, html[data-experience="classic"] *::after { transition: none !important; }
}

/* Classic is an animated portfolio. Avatar choreography belongs to the guided view. */
html[data-experience="classic"] .classic-bg { animation: none; }
html[data-experience="classic"] .classic-role { min-height: 3.75em; }
html[data-experience="classic"] .classic-rotate-words { max-width: calc(100% - 2rem); vertical-align: middle; }
html[data-experience="classic"] .classic-particle { display: block; }
html[data-experience="classic"] .classic-cursor::after { display: block; }
html[data-experience="classic"] .language-bar-fill { animation: none; }
html[data-experience="classic"] [data-classic-motion-state]:not([data-classic-motion-state="ready"]) {
    translate: var(--classic-entry-x, 0px) var(--classic-entry-y, 0px);
    transition: none !important;
}
html[data-experience="classic"] .classic-letter { transform-origin: 50% 100%; }
@media (prefers-reduced-motion: no-preference) {
    html[data-experience="classic"] .classic-scroll-indicator svg { animation: classic-scroll-nudge 2.8s ease-in-out infinite; }
    html[data-experience="classic"] .classic-name-gradient { background-size: 220% 100%; animation: classic-name-light 12s ease-in-out infinite; }
    html[data-experience="classic"] :is(.tilt-card, .classic-magnetic, .magnetic) {
        transition: transform 180ms var(--classic-ease), border-color 220ms ease, box-shadow 280ms var(--classic-ease) !important;
    }
    html[data-experience="classic"] .project-image { transition: transform 480ms var(--classic-ease) !important; }
    html[data-experience="classic"] .skill-badge { transition: translate 200ms var(--classic-ease), color 220ms ease, background-color 220ms ease, border-color 220ms ease !important; }
    html[data-experience="classic"] .skill-badge:hover { translate: 0 -2px; }
}
@media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) {
    html[data-experience="classic"] .group:hover .project-image { transform: scale(1.025); }
}
@keyframes classic-scroll-nudge { 0%, 65%, 100% { transform: translateY(0); } 35% { transform: translateY(5px); } }
@keyframes classic-name-light { 0%, 100% { background-position: 0% 50%; } 50% { background-position: 100% 50%; } }
@media (max-width: 639px) {
    html[data-experience="classic"] .classic-particle:nth-last-child(-n+3) { display: none; }
    html[data-experience="classic"] .classic-orb { filter: blur(42px); }
}
@media (prefers-reduced-motion: reduce), print {
    html[data-experience="classic"] *, html[data-experience="classic"] *::before, html[data-experience="classic"] *::after {
        animation: none !important; transition: none !important; scroll-behavior: auto !important;
    }
    html[data-experience="classic"] [data-classic-motion-state] { opacity: 1 !important; translate: none !important; }
    html[data-experience="classic"] :is(.classic-letter, .classic-rotate-words, .tilt-card, .magnetic, .classic-magnetic, .project-image) { transform: none !important; }
}

html[data-experience="classic"] .experience-card:hover { transform: none; }

html[data-experience="classic"] .classic-cursor::after { height: 1em; top: auto; bottom: .15em; }