/* Homepage composition; the about chapter lives in home-explore.css. */
.page-home { --scene-blue: #0061e8; --scene-cyan: #80efff; }
.page-home .site-header { background: #041b32e8; backdrop-filter: blur(14px); }
.page-home .editorial-hero { border-bottom: 1px solid #80efff66; }
.page-home .hero-name { font-size: clamp(4rem,7.5vw,9rem); }
.page-home .hero-statement strong { font-size: clamp(1.4rem,2vw,2.5rem); }
.page-home .hero-meta { border-top-color: #ffffff45; }
.page-home .hero-scroll { letter-spacing: .16em; }
.page-home .selected-section { max-width: none; width: 100%; margin: 0; padding: 4.5rem max(var(--page-pad), calc((100% - 1536px)/2)) 3rem; background: #071724; color: #edf8ff; position: relative; overflow: hidden; }
.page-home .selected-heading { margin: 0 0 3.5rem; padding: 0; border: 0; align-items: end; }
.page-home .selected-heading .profile-eyebrow { color: #80bfdc; font-size: .7rem; margin-bottom: 1.7rem; }
.page-home .selected-heading h2 { display: block; font: 700 clamp(4rem,8.5vw,9rem)/.95 var(--sans); letter-spacing: -.07em; color: #e1f5ff; }
.page-home .selected-heading h2 > span { display: block; font: 500 .8rem/1.5 var(--sans); letter-spacing: .15em; color: #8acbe8; margin-top: 1.5rem; }
.page-home .work-index { gap: 1.3rem; padding-bottom: .2rem; }
.work-index button { color: #9fb6c9; background: none; border: 0; padding: .6rem 0; font: 500 .8rem/1.4 var(--sans); cursor: pointer; border-bottom: 1px solid transparent; }
.work-index button[aria-pressed="true"] { color: #97ecff; border-color: #97ecff; }
.work-index button:focus-visible { outline: 2px solid #97ecff; outline-offset: 4px; }
.work-reel { display: flex; align-items: stretch; gap: clamp(5px,.6vw,12px); width: 100%; height: clamp(320px,34vw,650px); perspective: 1600px; }
.work-reel .featured-card { flex: 0 0 4%; min-width: 0; margin: 0; opacity: 1; transform: none; clip-path: none; transition: flex-basis 1000ms cubic-bezier(.16,1,.3,1), flex-grow 1000ms cubic-bezier(.16,1,.3,1); }
.work-reel .featured-card.reel-active { flex: 1 1 0; }
.work-reel .featured-card > a { display: block; height: 100%; }
.page-home .work-reel .featured-card .featured-card__media { height: 100%; width: 100%; aspect-ratio: auto; border: 1px solid #a0d7f020; background: #02070e; box-shadow: none; filter: none; clip-path: none; transform: none; }
.work-reel .featured-card__image { width: 100%; height: 100%; object-fit: cover; filter: saturate(.2) brightness(.55); transform: none !important; transition: filter 650ms; }
.work-reel .reel-active .featured-card__image { object-fit: contain; filter: none; }
.work-reel .featured-card:hover .featured-card__media::after { display: none; }
.work-reel .featured-card__media::before { display: none; }
.work-reel .featured-card__number { top: auto; bottom: .7rem; left: .6rem; color: #c8f5ff; background: transparent; clip-path: none; width: auto; font: 500 .65rem/1 var(--sans); transform: none; }
.work-reel .reel-active .featured-card__number { background: #d3faff; color: #03294d; padding: .45rem; }
.work-reel .featured-card__body { display: none; }
.work-reel a:focus-visible { outline: 2px solid #a1f4ff; outline-offset: 4px; }
.reel-detail { display: grid; grid-template-columns: 6rem minmax(0,1fr) auto; align-items: center; gap: 2rem; padding: 2rem 0 1.6rem; }
.reel-position { font: 500 .7rem/1.5 var(--sans); color: #8babbd; }
.reel-category { color: #7cb9dc; font: 500 .6rem/1.5 var(--sans); letter-spacing: .16em; margin-bottom: .5rem; }
.reel-project-link { display: flex; align-items: baseline; justify-content: space-between; gap: 1rem; }
.reel-title { font: 500 clamp(1.2rem,1.9vw,2rem)/1.5 var(--sans); letter-spacing: -.03em; }
.reel-project-link > span { color: #8eeaff; font-size: 1.5rem; }
.reel-controls { display: flex; gap: .5rem; margin-left: 2rem; }
.reel-controls button { min-height: 42px; padding: .6rem .85rem; border: 1px solid #7dabbe55; color: #b2e8ff; background: transparent; cursor: pointer; }
.reel-controls [data-reel-pause] { min-width: 75px; font-size: .65rem; }
.reel-controls button:hover { background: #b5f6ff; color: #042544; }
.page-home .site-footer { padding-inline: var(--page-pad); }
@media (max-width: 999px) {
.page-home .selected-heading { display: block; margin-bottom: 2rem; }
.page-home .selected-heading h2 { font-size: clamp(3.2rem,11vw,7rem); }
.page-home .selected-heading .work-index { margin-top: 1.5rem; display: flex; justify-content: flex-start; gap: 2rem; }
.work-reel { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 2rem 1.2rem; height: auto; perspective: none; }
.work-reel .featured-card { width: 100%; margin: 0; scroll-margin-top: 90px; }
.page-home .work-reel .featured-card .featured-card__media { aspect-ratio: 16/9; height: auto; }
.work-reel .featured-card__image { object-fit: contain; filter: none; }
.work-reel .featured-card__body { display: block; padding: 0; margin-top: .8rem; border: 0; color: #e4f8ff; }
.work-reel .featured-card h4 { font-size: 1rem; font-weight: 500; line-height: 1.6; }
.work-reel .featured-card__eyebrow { color: #83bcd6; font-size: .55rem; }
.work-reel .featured-card__description, .work-reel .featured-card__footer, .reel-detail { display: none; }
}
@media (max-width: 540px) {
.page-home .selected-section { padding-top: 3rem; }
.work-reel { grid-template-columns: 1fr; gap: 2rem; }
}
@media (prefers-reduced-motion: reduce) {
.work-reel .featured-card, .work-reel .featured-card__image { transition: none; }
}
@media (min-width: 1000px) {
.work-reel { height: clamp(300px,calc(100svh - 500px),650px); }
.page-home .selected-heading { margin-bottom: 2.5rem; }
}

.page-home .work-index button, .reel-controls button { min-height: 44px; }
.page-home .work-index { border-color: #648ca440; }
.reel-controls button:focus-visible { outline: 2px solid #a1f4ff; outline-offset: 4px; }
@media (max-width: 999px) {
.page-home .work-reel .featured-card__number { width: 30px; height: 28px; padding: 0; background: #062447e6; color: #e1f6ff; }
}
/* Refinement of the light-blue composition: fewer controls, quieter rules. */
.reel-detail { padding-block: 1.5rem 1rem; }
.reel-project-link { justify-content: flex-start; width: fit-content; }
.reel-project-link:hover h3 { text-decoration: underline; text-underline-offset: .25em; text-decoration-thickness: 1px; }
.reel-controls { margin-left: 1rem; }
.reel-controls [data-reel-pause] { padding-inline: .25rem; min-width: 60px; border: 0; color: #9ebed1; background: transparent; }
.reel-controls [data-reel-pause]:hover { color: #e4faff; background: transparent; }

/* P3R display rhythm, without adding another section or media layer. */
.page-home .selected-heading h2 { font-family: var(--p3-display); font-weight: 600; font-size: clamp(4.5rem,9vw,9rem); letter-spacing: -.045em; line-height: .82; }
.page-home .selected-heading { position: relative; }
.page-home .selected-heading::after { content: ''; position: absolute; right: 0; top: 0; width: clamp(70px,12vw,180px); height: 4px; background: linear-gradient(90deg,var(--p3-blue) 70%,transparent 70%,transparent 75%,var(--p3-cyan) 75%); transform: skewX(-28deg); }
.page-home .work-index button { position: relative; padding-inline: .55rem; }
.page-home .work-index button[aria-pressed="true"] { background: var(--p3-cyan); color: #052b63; border-color: transparent; clip-path: polygon(8px 0,100% 0,calc(100% - 8px) 100%,0 100%); }
.work-reel .reel-active .featured-card__number { background: var(--p3-cyan); clip-path: polygon(0 0,100% 0,calc(100% - 5px) 100%,0 100%); padding-right: .65rem; }
.page-home .work-index button[aria-pressed="true"]:focus-visible { outline: 2px solid #052b63; outline-offset: -4px; }
/* The images themselves are the project index. Keep only one compact caption. */
.page-home .selected-section { padding-bottom: 2rem; }
.page-home .reel-detail { padding: 1.05rem 0 0; margin: 0; gap: 1rem; grid-template-columns: 1fr auto; }
.page-home .reel-detail > .reel-position, .page-home .reel-category { display: none; }
.page-home .reel-title { font-size: clamp(1rem,1.7vw,1.5rem); }
.page-home .selected-heading { margin-bottom: 2rem; }