.project-hero{min-height:680px;position:relative;background:url('assets/genie/banner.webp') center/cover no-repeat;display:flex;align-items:stretch}.project-hero>.container{position:relative;display:flex;flex-direction:column;align-items:start;padding-block:28px 64px}.back{background:var(--cream);padding:8px 16px;border-radius:40px;font-size:1rem}.hero-label{background:rgba(255,253,215,.95);padding:34px 44px;margin-top:auto;max-width:720px;border-radius:4px}.hero-label h1{font-size:clamp(3.5rem,6vw,6rem)}.hero-label p:last-child{margin-top:22px;font-size:1.35rem}.hero-label .eyebrow{margin-bottom:18px}.project-nav{background:var(--cream);border-bottom:1px solid var(--line)}.project-nav>div{display:flex;gap:36px;padding-block:24px;flex-wrap:wrap}.project-copy{margin-top:26px;max-width:38ch;font-size:1.25rem}.game-section,.characters-section,.animation-section{background:var(--brown)}.game-art img{width:100%;display:block;border-radius:8px}.game-art figcaption{font-size:.875rem;margin-top:12px}.store-links{display:flex;gap:14px;flex-wrap:wrap;margin-top:32px}.pill,.paging button{display:inline-flex;justify-content:center;align-items:center;border:1px solid var(--ink);border-radius:40px;background:var(--cream);color:var(--ink);font:600 1rem 'Source Sans 3',sans-serif;padding:12px 22px;cursor:pointer}.pill:hover{background:#efedc4;text-decoration:none}.gallery-controls{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-block:28px}.paging{display:flex;align-items:center;gap:18px}.paging button{padding:8px 17px;font-size:1.3rem}.paging button:disabled{opacity:.35;cursor:default}.paging span{font-size:1rem}.dome-wrap{height:620px;position:relative;border:1px solid var(--line);border-radius:16px;overflow:hidden}.genies-section .item__image{background:var(--cream);border:1px solid var(--line)}.genies-section .item__image img{object-fit:contain}.genies-section .item__image:focus-visible{outline:3px solid var(--ink);outline-offset:-3px}.genie-grid{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:12px}.genie-grid button{border:1px solid var(--line);background:transparent;border-radius:10px;padding:8px;cursor:pointer}.genie-grid img{width:100%;aspect-ratio:1;object-fit:contain}.subheading{margin-block:54px 26px}.subheading h3{font-size:2.2rem;margin-bottom:12px}.subheading p{max-width:50ch}.art-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px}.art-card{background:transparent;border:0;padding:0;text-align:left;color:var(--ink);font:inherit;cursor:pointer;min-width:0}.art-card img{display:block;width:100%;aspect-ratio:4/3;object-fit:contain;background:var(--cream);border-radius:6px;transition:transform .2s}.art-card:hover img{transform:translateY(-3px)}.art-card span{display:block;margin-top:10px;font-size:.9375rem;overflow-wrap:anywhere}.background-paging{margin-bottom:0}.project-page .ag-panel__label{background:var(--cream);padding:7px 12px;border-radius:4px;left:12px;right:12px;bottom:12px}.project-page .ag-panel:not(.ag-panel--active) .ag-panel__label{display:none}.project-page .ag-panel__text{text-shadow:none;font-size:1rem}.animation-grid{display:grid;grid-template-columns:1.4fr 1fr;gap:56px;align-items:start}.animation-grid video{display:block;width:100%;max-height:620px;background:#2B3827;border-radius:8px}.animation-grid h3{font-size:1.8rem}.video-links{display:grid;grid-template-columns:1fr 1fr;gap:0 25px;margin-top:24px}.video-links a{padding:18px 0;border-bottom:1px solid var(--line)}.project-footer{padding-block:36px;display:flex;justify-content:space-between;align-items:center;gap:24px}.art-dialog{border:0;padding:50px 22px 18px;background:var(--cream);color:var(--ink);width:min(1100px,94vw);max-height:94dvh;border-radius:12px}.art-dialog::backdrop{background:rgba(20,30,18,.8)}.art-dialog figure{text-align:center}.art-dialog img{max-width:100%;width:auto;max-height:75dvh;object-fit:contain}.art-dialog figcaption{font-size:1rem;padding-top:8px}.close-art{position:absolute;right:16px;top:12px;font:600 1rem 'Source Sans 3';color:var(--ink);border:1px solid var(--ink);border-radius:24px;background:var(--cream);padding:6px 16px;cursor:pointer}button:focus-visible{outline:3px solid var(--ink);outline-offset:4px}.project-page .sphere-main{position:absolute;inset:0;display:grid;place-items:center;overflow:hidden;touch-action:none;user-select:none;background:var(--cream)}@media(max-width:900px){.art-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.genie-grid{grid-template-columns:repeat(5,minmax(0,1fr))}.animation-grid{gap:30px}.project-hero{min-height:600px}.hero-label{padding:30px}.project-nav>div{gap:20px}}@media(max-width:649px){.project-hero{min-height:580px;background-position:60% top}.hero-label{padding:25px 20px;margin-top:160px}.hero-label h1{font-size:3.3rem}.hero-label .eyebrow{font-size:.75rem}.hero-label p:last-child{font-size:1.15rem}.project-hero>.container{padding-bottom:24px}.project-nav>div{gap:12px 22px;font-size:1rem}.gallery-controls{align-items:start;flex-direction:column}.dome-wrap{height:480px}.art-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:22px 14px}.genie-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.animation-grid{grid-template-columns:1fr}.project-footer{flex-wrap:wrap;font-size:1rem}.project-footer .brand{width:100%}.project-page .accordion-gallery--vertical{height:610px!important}.project-page .ag-panel{min-height:45px}.project-page .ag-panel__text{white-space:normal}.project-page .ag-panel__label{padding:5px 8px}.project-page .ag-panel__bar{display:none}}@media(prefers-reduced-motion:reduce){.art-card img{transition:none}}

/* Full-width artwork and uncropped backgrounds */
.genies-section .dome-wrap{width:calc(100% + var(--page-gutter)*2);margin-inline:calc(-1 * var(--page-gutter));border-inline:0;border-radius:0}.backgrounds-section .ag-panel{background:var(--cream);box-shadow:none;border:1px solid var(--line)}.backgrounds-section .ag-panel__media{width:100%!important;height:100%!important;left:0;top:0;transform:none!important}.backgrounds-section .ag-panel__media img{object-fit:contain}.backgrounds-section .ag-panel__overlay{display:none}.game-art img{max-height:540px;object-fit:contain}.shorts-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:32px 24px}.short-player{min-width:0}.short-player iframe{display:block;width:100%;aspect-ratio:9/16;border:0;border-radius:8px;background:var(--cream)}.short-player figcaption{padding-top:12px;font-size:1.125rem}.short-player a{display:inline-block;padding-block:6px}@media(max-width:1000px){.shorts-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:540px){.shorts-grid{grid-template-columns:1fr;gap:32px}.short-player{width:min(100%,360px);margin-inline:auto}}

/* Background grid and featured animation */
.backgrounds-section .art-grid{align-items:start}.backgrounds-section .art-card img{aspect-ratio:auto;height:auto;width:100%;object-fit:contain}.animation-feature{width:min(100%,1100px);margin:0 auto 56px}.animation-feature video{display:block;width:100%;height:auto;aspect-ratio:1134/692;object-fit:contain;background:var(--ink);border-radius:8px}@media(max-width:600px){.animation-feature{margin-bottom:32px}}

/* Stack section supporting copy below each heading */
.project-page .section-heading{display:block}.project-page .section-heading>p{margin-top:22px;max-width:52ch}.project-page .section-heading>div{max-width:760px}

/* Section hierarchy */
.project-page .section-kicker{font-family:Amaranth,sans-serif;font-size:clamp(1.35rem,2vw,1.9rem);line-height:1.2;letter-spacing:.12em;margin:0}.project-page .section-tagline{font-family:'Source Sans 3',sans-serif!important;font-size:1.25rem!important;font-style:italic;line-height:1.45;margin-top:18px!important;max-width:48ch!important}.project-page .section-heading .section-kicker{font-size:clamp(1.35rem,2vw,1.9rem)}.project-page .section-heading .section-tagline{margin-top:18px!important}.project-page .subheading .section-kicker{font-size:1rem;letter-spacing:.12em}.project-page .subheading .section-tagline{font-size:2.2rem!important;font-style:normal;font-family:Amaranth,sans-serif!important;margin-top:10px!important}.project-hero{padding-bottom:88px}.hero-project-logo{display:block;width:min(260px,70%);height:auto;margin-top:26px}.project-nav{position:relative;z-index:4;margin-top:-88px;background:rgba(255,253,215,.94);backdrop-filter:blur(8px);border-top:1px solid var(--line)}.game-art img{object-fit:contain}.game-art figcaption{display:none}@media(max-width:649px){.project-hero{padding-bottom:78px}.project-nav{margin-top:-78px}.hero-project-logo{width:min(220px,85%)}}

/* Landing composition and larger section headings */
.project-page .hero-label{position:relative}.project-page .hero-project-logo{position:absolute;left:calc(100% + 110px);bottom:24px;width:clamp(240px,22vw,410px);margin:0}.project-page .section-kicker,.project-page .section-heading .section-kicker{font-size:clamp(1.9rem,3vw,2.8rem);letter-spacing:.1em}.project-page .dome-wrap{height:900px}.project-page .genies-section .sphere-root{height:100%}@media(max-width:1000px){.project-page .hero-project-logo{left:calc(100% + 44px);width:clamp(210px,24vw,320px)}}@media(max-width:649px){.project-page .hero-project-logo{position:static;width:min(230px,80%);margin:26px auto 0}.project-page .dome-wrap{height:680px}}

/* Two-column landing, inline section navigation, and interactive links */
.project-hero>.container{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-rows:auto 1fr;align-items:center;column-gap:clamp(40px,7vw,120px)}.project-hero>.container>.back{grid-column:1/-1;grid-row:1;justify-self:start}.project-page .hero-label{grid-column:1;grid-row:2;width:100%;position:static}.project-page .hero-project-logo{grid-column:2;grid-row:2;position:static;width:min(100%,520px);justify-self:center;margin:0}.project-page .project-nav{margin-top:32px;background:transparent;border:0;backdrop-filter:none}.project-page .project-nav>div{padding:0;gap:24px}.project-page .project-nav a{font-size:1rem}.project-page a,.project-page button{transition:font-weight .2s ease,color .2s ease}.project-page .navigation a,.project-page .project-nav a,.project-page .back,.project-page .pill,.project-page .paging button,.project-page .video-links a,.project-page .project-footer a,.project-page .close-art{position:relative;text-decoration:none}.project-page .navigation a::after,.project-page .project-nav a::after,.project-page .back::after,.project-page .pill::after,.project-page .paging button::after,.project-page .video-links a::after,.project-page .project-footer a::after,.project-page .close-art::after{content:"";position:absolute;left:50%;bottom:2px;width:100%;height:2px;background:currentColor;transform:translateX(-50%) scaleX(0);transform-origin:center;transition:transform .24s ease}.project-page .navigation a:hover,.project-page .project-nav a:hover,.project-page .back:hover,.project-page .pill:hover,.project-page .paging button:hover,.project-page .video-links a:hover,.project-page .project-footer a:hover,.project-page .close-art:hover{font-weight:700;text-decoration:none}.project-page .navigation a:hover::after,.project-page .project-nav a:hover::after,.project-page .back:hover::after,.project-page .pill:hover::after,.project-page .paging button:hover::after,.project-page .video-links a:hover::after,.project-page .project-footer a:hover::after,.project-page .close-art:hover::after{transform:translateX(-50%) scaleX(1)}
@media(max-width:649px){.project-hero>.container{display:flex;flex-direction:column;align-items:stretch;row-gap:24px}.project-hero>.container>.back{order:1}.project-page .hero-label{order:2}.project-page .hero-project-logo{order:3;width:min(80%,300px);align-self:center}.project-page .project-nav{margin-top:28px}.project-page .project-nav>div{gap:16px 22px}}

/* Pill controls invert their colors on hover */
.project-page .pill::after{display:none}
.project-page .pill:hover{background:var(--ink);color:var(--cream);font-weight:700;text-decoration:none}

/* Christopher's Genie palette and background carousel */
.project-page{--ink:#fff;--cream:#1D7783;--brown:#4ECAA2;--line:rgba(255,255,255,.4);background:#1D7783;color:#fff}
.project-page .game-section,.project-page .characters-section,.project-page .animation-section{background:#4ECAA2}
.project-page .genies-section,.project-page .backgrounds-section{background:#1D7783}
.project-page .hero-label{background:rgba(29,119,131,.95)}
.project-page .genies-section .sphere-main,.project-page .genies-section .item__image{background:#1D7783}
.project-page .pill,.project-page .paging button,.project-page .back,.project-page .close-art{background:#1D7783;color:#fff;transition:background-color .2s,color .2s}
.project-page .pill:hover:not(:disabled),.project-page .paging button:hover:not(:disabled),.project-page .back:hover,.project-page .close-art:hover{background:#fff;color:#1D7783}
.project-page .paging button::after,.project-page .back::after,.project-page .close-art::after{display:none}
.carousel-controls{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:24px}
.carousel-controls>div{display:flex;gap:12px}.carousel-controls button:disabled{opacity:.35;cursor:default}
.background-track{display:flex;gap:24px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:thin;scrollbar-color:#fff transparent;padding-block:4px 18px}
.background-slide{flex:0 0 calc((100% - 48px)/3);min-width:0;scroll-snap-align:start;border:0;padding:0;background:transparent;cursor:pointer;border-radius:6px}
.background-slide img{display:block;width:100%;height:auto;object-fit:contain;border-radius:6px}
.background-slide:focus-visible{outline:3px solid white;outline-offset:-3px}
@media(max-width:900px){.background-slide{flex-basis:calc((100% - 24px)/2)}}
@media(max-width:540px){.background-slide{flex-basis:100%}}
@media(prefers-reduced-motion:reduce){.project-page .pill,.project-page .paging button,.project-page .back,.project-page .close-art{transition:none}}

.project-page .game-info-images{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;align-items:center}.project-page .game-info-images img{display:block;width:100%;height:auto;max-height:none;object-fit:contain}
