/* September 2026: editorial hierarchy and a shared, cut-paper motion language. */
:root {
    --motion-snap: cubic-bezier(.18, .85, .22, 1);
    --motion-settle: cubic-bezier(.22, 1, .36, 1);
}

body::before { opacity: .075; }
.hero-loop { opacity: .82; filter: grayscale(.45) contrast(1.16) brightness(.73); }
.hero-wash::after { opacity: .11; animation-duration: 18s; }
.hero-grid { opacity: .08; }
.hero-name-wrap { translate: var(--hero-depth-x, 0px) var(--hero-depth-y, 0px); transition: translate .65s var(--motion-settle); }
.hero-grid { translate: calc(var(--hero-depth-x, 0px) * -1.5) calc(var(--hero-depth-y, 0px) * -1.5); transition: translate .8s var(--motion-settle); }
.hero-name { letter-spacing: -.12em; }
.hero-scroll { bottom: 1rem; }
.profile-section { padding-top: clamp(4.5rem, 7vw, 7rem); }
.profile-layout { padding-top: clamp(3rem, 5vw, 5rem); }
.section-intro { padding-block: clamp(3rem, 5vw, 5rem); }
.section-intro h2 { line-height: 1.12; }
.featured-chapter { padding-bottom: clamp(4.5rem, 8vw, 8rem); }

/* Each chapter gets a black panel, a red cut, then type and a number. */
.chapter-heading[data-reveal] {
    isolation: isolate;
    opacity: 1;
    clip-path: none;
    transform: none;
    background: transparent;
    padding: 1.5rem 1.6rem;
    margin-bottom: 2rem;
    transition: none;
}
.chapter-heading::before {
    position: absolute;
    inset: 0;
    z-index: -2;
    content: "";
    background: var(--ink);
    clip-path: polygon(0 4%, 100% 0, 99% 94%, 0 100%);
    transform-origin: left;
    transition: transform 520ms var(--motion-settle);
}
.chapter-heading::after {
    z-index: -1;
    width: 23%;
    transform-origin: right;
    transition: transform 480ms 80ms var(--motion-settle);
}
.chapter-heading h3 { font-family: var(--sans); font-weight: 900; font-size: clamp(2rem, 3.3vw, 3.6rem); line-height: 1.15; }
.chapter-heading p { line-height: 1.7; letter-spacing: .1em; }
.chapter-heading p span { color: var(--accent); }
.chapter-heading h3, .chapter-heading p, .chapter-count { transition: opacity 300ms, translate 500ms var(--motion-settle); }
.chapter-heading h3 { transition-delay: 130ms; }
.chapter-heading p { transition-delay: 200ms; }
.chapter-count { transition-delay: 260ms; font-size: 3rem; }
@media (prefers-reduced-motion: no-preference) {
    .chapter-heading:not(.is-visible)::before { transform: scaleX(0); }
    .chapter-heading:not(.is-visible)::after { transform: scaleX(0); }
    .chapter-heading:not(.is-visible) :is(h3, p, .chapter-count) { opacity: 0; translate: 24px 0; }
    .chapter-heading:not(.is-visible) .chapter-count { translate: 0 16px; }
}

/* Artwork has a complete frame; angular accents live in the labels. */
.featured-card, .featured-card:nth-child(n), .archive-card, .archive-card:nth-child(n) {
    transform: none;
    transition: translate 300ms var(--motion-settle);
}
.featured-card__media, .archive-card__media {
    isolation: isolate;
    border: 2px solid var(--ink);
    clip-path: none;
    filter: none;
    box-shadow: 5px 5px 0 var(--ink);
    transition: box-shadow 240ms, border-color 240ms;
}
.featured-card__media, .featured-card--hero .featured-card__media,
.featured-grid--film .featured-card:first-child .featured-card__media { aspect-ratio: 16 / 9; }
.featured-card__image { height: calc(100% + 24px); transform: translateY(calc(-12px + clamp(-10px, var(--parallax-y, 0px), 10px))) scale(1.025); filter: none; }
.archive-card__image { filter: none; }
.featured-card__media::before { display: none; }
.featured-card__media::after, .archive-card__media::after {
    position: absolute;
    z-index: 3;
    inset: -25% -80%;
    content: "";
    pointer-events: none;
    opacity: 0;
    background: linear-gradient(115deg, transparent 42%, rgba(255,255,255,.28) 49%, rgba(255,255,255,.07) 54%, transparent 61%);
    mix-blend-mode: normal;
    transform: translateX(-42%);
}
.featured-card__number, .archive-card__index {
    z-index: 4;
    top: .7rem;
    left: .7rem;
    width: 38px;
    height: 36px;
    display: grid;
    place-items: center;
    color: var(--paper);
    background: var(--ink);
    font: 400 1.05rem/1 var(--display);
    transform: rotate(-3deg);
    transition: background 180ms, color 180ms, transform 260ms var(--motion-snap);
}
.archive-card__category { z-index: 4; font-size: .6rem; }
.featured-card__body, .archive-card__body {
    margin: 1.1rem 0 0;
    padding: 0 0 0 1rem;
    border-left: 3px solid var(--red-surface);
    clip-path: none;
    background: transparent;
}
.featured-card h4, .archive-card h2 {
    transform: none;
    letter-spacing: -.035em;
    line-height: 1.32;
    white-space: normal;
    overflow-wrap: anywhere;
}
.featured-card h4 { font-size: clamp(1.5rem, 2.4vw, 2.65rem); }
.featured-grid--games .featured-card:nth-child(2) h4 { font-size: clamp(1.5rem, 2.2vw, 2.4rem); white-space: normal; }
.featured-grid--film .featured-card:not(:first-child) h4 {
    font-size: clamp(1.125rem, 1.1vw, 1.3rem);
    white-space: normal;
    overflow-wrap: normal;
}
.archive-card h2 { font-size: clamp(1.1rem, 1.45vw, 1.4rem); }
.featured-card__description, .archive-card__body > p { font-size: .85rem; line-height: 1.8; color: #504d47; }
.featured-card__eyebrow { font-size: .61rem; letter-spacing: .11em; }
.featured-card__footer { border-top: 1px solid var(--line); margin-top: 1rem; padding-top: .85rem; align-items: center; }
.tag-row { gap: .35rem; }
.tag-row span { border: 1px solid var(--line); clip-path: none; background: transparent; font-weight: 500; font-size: .59rem; }
.featured-card__cta { display: inline-block; min-width: max-content; transition: background 180ms, translate 250ms var(--motion-settle); }
.featured-card:hover .featured-card__cta { animation: none; }
.featured-grid--film .featured-card:not(:first-child) .featured-card__cta { display: inline-block; }
.featured-grid--games .featured-card:nth-child(2), .featured-grid--products .featured-card:nth-child(2) { margin-top: 5rem; }
.featured-grid--film .featured-card:first-child { margin-bottom: 1rem; }
@media (min-width: 1000px) {
    .featured-grid--film .featured-card:first-child > a { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); gap: 2rem; align-items: center; }
    .featured-grid--film .featured-card:first-child .featured-card__body { margin: 0; }
}

/* Previews load only after a deliberate hover or keyboard focus. */
.featured-card__preview { position: absolute; inset: 0; z-index: 2; background: var(--ink); opacity: 0; transition: opacity 220ms; pointer-events: none; }
.featured-card__preview video { display: block; width: 100%; height: 100%; object-fit: contain; }
.featured-card.is-previewing .featured-card__preview { opacity: 1; }
.featured-card__preview-label {
    position: absolute; z-index: 4; bottom: .65rem; right: .65rem; padding: .3rem .55rem;
    color: var(--paper); background: rgba(8,8,8,.88); font-size: .61rem; letter-spacing: .04em;
    opacity: 0; translate: 0 4px; transition: opacity 200ms, translate 200ms;
}
.featured-card__preview-label::before { display: inline-block; content: ""; width: 5px; height: 5px; margin-right: .4rem; background: var(--accent); border-radius: 50%; vertical-align: middle; }
.featured-card.is-previewing .featured-card__preview-label { opacity: 1; translate: 0; }

@keyframes card-light-sweep {
    0% { opacity: 0; transform: translateX(-42%); }
    25% { opacity: 1; }
    100% { opacity: 0; transform: translateX(42%); }
}
@media (hover: hover) and (pointer: fine) {
    .featured-card:hover, .archive-card:hover { translate: 0 -5px; }
    .featured-card:hover .featured-card__media, .archive-card:hover .archive-card__media { border-color: var(--red-surface); box-shadow: 7px 7px 0 var(--red-surface); }
    .featured-card:hover .featured-card__media::after, .archive-card:hover .archive-card__media::after { animation: card-light-sweep 650ms var(--motion-snap) both; }
    .featured-card:hover .featured-card__image { filter: none; transform: translateY(calc(-12px + clamp(-10px, var(--parallax-y, 0px), 10px))) scale(1.055); }
    .featured-card:hover .featured-card__number, .archive-card:hover .archive-card__index { color: var(--ink); background: var(--accent); transform: rotate(0deg); }
    .featured-card:hover .featured-card__cta { translate: 3px -1px; }
}
.featured-card:focus-within .featured-card__media, .archive-card:focus-within .archive-card__media { border-color: var(--red-surface); box-shadow: 7px 7px 0 var(--red-surface); }
.featured-card:focus-within .featured-card__cta { background: var(--red-surface); }
.button:hover, .project-action:hover { transform: translateY(-3px); filter: none; }
.button, .project-action { transition: color 180ms, background 180ms, transform 240ms var(--motion-settle), box-shadow 240ms; }

/* A compact archive opener gets visitors to the art sooner. */
.archive-hero { min-height: 350px; padding: 5.25rem var(--page-pad) 2.5rem; grid-template-columns: minmax(0, 1fr) minmax(260px, .45fr); }
.archive-hero__meta { top: 2rem; }
.archive-hero h1 { font-size: clamp(4.5rem, 9vw, 9rem); line-height: .9; }
.archive-hero h1 br { display: none; }
.archive-hero h1 em { margin-left: .15em; }
.archive-hero__side { padding: 1rem; }
.archive-hero__side p { white-space: normal; font-size: .9rem; }
.archive-hero__side span { margin-top: .5rem; }
.archive-browser { padding-top: 2rem; }
.archive-toolbar { border-left-width: 4px; padding: 1rem 1.3rem; }
.archive-search input { font-size: clamp(1.05rem, 1.8vw, 1.6rem); }
.category-filter { margin-block: 1.2rem 2.25rem; }
.category-filter button { border-width: 2px; clip-path: polygon(3% 0, 100% 0, 96% 100%, 0 100%); }
.category-filter button.is-active { transform: translateY(-2px); box-shadow: 3px 3px 0 var(--ink); }
.archive-grid { row-gap: 3rem; }
.archive-card__body > div:first-child { padding-right: 1.5rem; }
.archive-card__body > div:first-child > span { transition: translate 250ms var(--motion-settle); }

/* Section content stays readable while its editorial accents move. */
.resume-entry:hover { transform: none; padding-left: 0; padding-right: 0; background: rgba(227,19,27,.045); }
.project-hero__title h1, .project-hero--title-long .project-hero__title h1 { text-shadow: 2px 2px 0 var(--paper), 5px 5px 0 var(--red); }
.project-hero__summary { transform: none; }
.project-section-heading { padding-block: .65rem; }
.project-hero__top { border-bottom-width: 3px; }
.capability-grid article, .capability-grid article:nth-child(even) { transform: none; clip-path: polygon(0 0, 100% 0, 100% 95%, 95% 100%, 0 100%); border-width: 2px; }
.capability-grid article:hover { transform: translateY(-5px); }
.contact-links a { transition: color 200ms, background 200ms, padding 250ms var(--motion-settle); }
.contact-links a:hover { transform: none; }

@media (max-width: 999px) and (min-width: 821px) {
    .archive-hero { grid-template-columns: 1fr; min-height: 340px; }
    .archive-hero__side { justify-self: end; margin-top: 1rem; }
    .archive-hero__side p { display: none; }
    .archive-hero__side strong { font-size: 2rem; }
    .featured-card__footer { flex-wrap: wrap; }
}
@media (max-width: 820px) {
    .hero-name-wrap, .hero-grid { translate: none; }
    .hero-loop { filter: grayscale(.55) contrast(1.12) brightness(.7); }
    .hero-scroll { bottom: 1rem; }
    .profile-section { padding-top: 4rem; }
    .profile-layout { padding-top: 3rem; }
    .section-intro { padding-block: 3rem; }
    .section-intro h2 { font-size: clamp(2rem, 9.5vw, 3.6rem); }
    .section-intro h2 em { display: block; width: fit-content; max-width: 100%; margin-top: .18em; }
    .section-rule, .section-rule--light { grid-template-columns: 2.5rem 1fr; gap: .8rem; background-image: linear-gradient(90deg, var(--red-surface) 0 2.5rem, transparent 2.5rem); }
    .project-hero__title h1, .project-hero--title-long .project-hero__title h1 { text-shadow: 1px 1px 0 var(--paper), 3px 3px 0 var(--red); }
    .chapter-heading[data-reveal] { display: grid; grid-template-columns: 1fr auto; gap: .65rem 1rem; padding: 1.2rem; }
    .chapter-heading p { grid-column: 1; font-size: .54rem; }
    .chapter-heading h3 { grid-column: 1; font-size: 2rem; }
    .chapter-count { grid-column: 2; grid-row: 1 / 3; align-self: center; font-size: 2.5rem; }
    .featured-grid--games .featured-card:nth-child(2), .featured-grid--products .featured-card:nth-child(2) { margin-top: 0; }
    .featured-card__body, .archive-card__body { padding-left: .8rem; }
    .featured-card__footer { flex-wrap: wrap; }
    .featured-card__image { height: 100%; transform: none; }
    .featured-card:hover .featured-card__image { transform: none; filter: none; }
    .featured-grid--film .featured-card:first-child { margin-bottom: 0; }
    .featured-card__media, .archive-card__media { box-shadow: 3px 3px 0 var(--ink); }
    .archive-hero { display: grid; min-height: 270px; grid-template-columns: 1fr; padding: 4.5rem var(--page-pad) 2.5rem; }
    .archive-hero h1 { position: relative; font-size: clamp(3.5rem, 15vw, 7rem); bottom: auto; left: 0; }
    .archive-hero__meta { top: 1.5rem; }
    .archive-hero__side { position: relative; width: auto; right: auto; bottom: auto; justify-self: end; margin-top: 1.25rem; padding: .4rem .7rem; }
    .archive-hero__side span { margin: 0; }
    .archive-hero__side strong { font-size: 1.7rem; }
    .archive-browser { padding-top: 1.5rem; }
    .archive-toolbar { padding: .9rem; gap: .8rem; }
    .archive-result-meta strong { font-size: 2rem; }
    .archive-search input { font-size: 1rem; }
    .category-filter { gap: .5rem; margin-bottom: 1.75rem; }
    .category-filter button { padding-inline: .65rem; }
    .archive-card h2 { font-size: 1.2rem; }
    .tag-row span { font-size: .58rem; }
}
@media (hover: none) {
    .button:hover, .project-action:hover, .capability-grid article:hover, .archive-card:hover { transform: none; }
    .archive-card:hover .archive-card__image { transform: none; }
    .featured-card:hover .featured-card__image { filter: none; }
    .featured-card:hover .featured-card__cta { translate: none; }
    .featured-card__media::after, .archive-card__media::after { display: none; }
}
@media (hover: none) and (min-width: 821px) {
    .featured-card:hover .featured-card__image { transform: translateY(-12px) scale(1.025); }
}
@media (prefers-reduced-motion: reduce) {
    .hero-name-wrap, .hero-grid, .chapter-heading :is(h3, p, .chapter-count) { translate: none !important; }
    .chapter-heading::before, .chapter-heading::after { transform: none !important; }
    .chapter-heading :is(h3, p, .chapter-count) { opacity: 1 !important; }
    .featured-card, .archive-card, .featured-card__cta { translate: none !important; }
    .featured-card__media::after, .archive-card__media::after { display: none; }
    .featured-card__preview, .featured-card__preview-label { display: none; }
}
@media print {
    .chapter-heading::before { transform: none; }
    .hero-name-wrap, .hero-grid { translate: none; }
}