/* Public site art direction. The base stylesheet still serves admin and preview. */
:root {
  --bg: #0b1015;
  --surface: #10161b;
  --border: rgba(222, 232, 235, .14);
  --text: #f2f0e9;
  --muted: #a4adb3;
  --brand-orange: #e98748;
  --brand-orange-hover: #fba96c;
  --studio-canvas: #0b1015;
  --studio-orange: #e98748;
  --studio-muted: #a4adb3;
  --studio-lime: #c9daa5;
}
body { background: #0b1015; color: #f2f0e9; }
body::before { content: ""; position: fixed; inset: 0; pointer-events: none; z-index: 500; opacity: .09; background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.74' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.27'/%3E%3C/svg%3E"); }
body:has(.cinematic-home) main,
body:has(.projects-page) main,
body:has(.project-story) main,
body:has(.studio-story) main,
body:has(.news-redesign) main,
body:has(.activity-page) main { padding: 0; }
body:has(.cinematic-home) main > .container,
body:has(.projects-page) main > .container,
body:has(.project-story) main > .container,
body:has(.studio-story) main > .container,
body:has(.news-redesign) main > .container,
body:has(.activity-page) main > .container { max-width: none; width: 100%; padding: 0; }
.site-footer { position: relative; background: #080c10; border-top: 1px solid rgba(240,240,230,.14); }
.site-footer .container { max-width: 1720px; width: calc(100% - 80px); padding-inline: 0; }
.site-footer__grid { padding-top: 88px; padding-bottom: 80px; }
.site-footer__brand p { max-width: 380px; }
.site-footer__logo strong { font-size: 18px; letter-spacing: .11em; }
.site-footer__nav > span { color: #e98748; }
.site-footer__nav a { color: #b3bdbe; }
.site-footer__nav a:hover { color: #f2f0e9; }
.scroll-top { border-radius: 0; }

.cinematic-home { background: #0b1015; color: #f2f0e9; overflow: clip; }
.cinematic-home h1, .cinematic-home h2, .cinematic-home h3 { font-family: Impact, "Arial Narrow", "Segoe UI", sans-serif; font-weight: 900; letter-spacing: -.04em; line-height: .93; text-wrap: balance; }
.cinematic-home em { font-style: normal; color: #e98748; }
.cinematic-label { display: inline-flex; align-items: center; gap: 11px; color: #e9a570; font-size: 11px; font-weight: 850; letter-spacing: .17em; line-height: 1.35; text-transform: uppercase; }
.cinematic-label__line { width: 31px; height: 1px; background: currentColor; }
.cinematic-label__sep { color: rgba(244,240,232,.45); margin-inline: 3px; }
.cinematic-link { display: inline-flex; align-items: center; justify-content: space-between; gap: 18px; min-height: 44px; color: #f5f2eb; border-bottom: 1px solid rgba(244,242,234,.7); font-size: 11px; font-weight: 850; letter-spacing: .13em; text-transform: uppercase; transition: color .25s, border-color .25s; }
.cinematic-link:hover { color: #e9a570; border-color: #e9a570; }
.cinematic-button { display: inline-flex; align-items: center; justify-content: space-between; gap: 32px; min-height: 56px; padding: 0 23px; background: #e98748; color: #101217; font-size: 12px; font-weight: 900; letter-spacing: .09em; text-transform: uppercase; transition: background .25s, transform .25s; }
.cinematic-button:hover { background: #ffc189; transform: translateY(-2px); }
.cinematic-button span, .cinematic-link span { font-size: 18px; font-weight: 500; line-height: 1; }
.cinematic-hero { position: relative; display: flex; flex-direction: column; justify-content: flex-end; width: 100%; min-height: 760px; min-height: 100svh; isolation: isolate; background: #192c3e; overflow: hidden; }
.cinematic-hero::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, rgba(5,10,17,.84) 0%, rgba(5,10,17,.49) 32%, rgba(5,10,17,.08) 68%), linear-gradient(0deg, rgba(5,10,17,.9) 0%, transparent 43%), linear-gradient(180deg, rgba(5,10,17,.96), rgba(5,10,17,.25) 20%, transparent 34%); }
.cinematic-hero__scene, .cinematic-hero__scene img, .cinematic-hero__grain { position: absolute; inset: 0; width: 100%; height: 100%; z-index: -2; }
.cinematic-hero__scene img { object-fit: cover; object-position: 55% 48%; transform: scale(1.12); animation: scene-arrive 1.8s cubic-bezier(.15,.6,.25,1) both; }
.cinematic-hero__grain { z-index: -1; opacity: .2; background: radial-gradient(circle at 83% 60%, rgba(225,235,244,.18), transparent 30%); mix-blend-mode: screen; }
.cinematic-hero__top { position: absolute; top: 120px; left: max(5vw, calc((100vw - 1720px) / 2)); right: max(5vw, calc((100vw - 1720px) / 2)); display: flex; justify-content: space-between; color: rgba(241,244,245,.75); font-size: 10px; font-weight: 800; letter-spacing: .18em; }
.cinematic-hero__content { display: flex; align-items: end; justify-content: space-between; gap: 35px; width: min(90%, 1720px); margin: 0 auto; padding: 190px 0 145px; }
.cinematic-hero__copy { max-width: 900px; animation: type-arrive .95s .2s both; }
.cinematic-hero__top h1 { margin: 0; font: inherit; letter-spacing: inherit; text-wrap: wrap; }
.cinematic-hero__title { max-width: 10ch; margin: 23px 0 22px; font-size: clamp(84px, 9.4vw, 178px); text-transform: uppercase; }
.cinematic-hero__description { max-width: 445px; color: #e2e8e8; font-size: clamp(17px, 1.4vw, 22px); line-height: 1.42; }
.cinematic-hero__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 18px 32px; margin-top: 34px; }
.cinematic-hero__scroll { display: inline-flex; align-items: center; gap: 15px; margin-bottom: 7px; color: #f1f3ef; font-size: 10px; font-weight: 800; letter-spacing: .15em; white-space: nowrap; text-transform: uppercase; }
.cinematic-hero__scroll span { color: #e98748; font-size: 20px; }
.cinematic-hero__rail { position: absolute; inset: auto 0 0; display: grid; grid-template-columns: repeat(5, 1fr); border-top: 1px solid rgba(238,243,244,.23); background: rgba(5,10,17,.48); backdrop-filter: blur(9px); padding-inline: max(5vw, calc((100vw - 1720px) / 2)); }
/* One column per public game (data-count is set by the template). */
.cinematic-hero__rail[data-count="1"] { grid-template-columns: repeat(1, 1fr); }
.cinematic-hero__rail[data-count="2"] { grid-template-columns: repeat(2, 1fr); }
.cinematic-hero__rail[data-count="3"] { grid-template-columns: repeat(3, 1fr); }
.cinematic-hero__rail[data-count="4"] { grid-template-columns: repeat(4, 1fr); }
.cinematic-hero__rail a { display: flex; align-items: center; gap: 12px; min-height: 70px; padding: 0 17px; color: #f1f4f3; border-left: 1px solid rgba(238,243,244,.16); font-size: 12px; font-weight: 800; letter-spacing: .02em; white-space: nowrap; transition: background .2s; }
.cinematic-hero__rail a:last-child { border-right: 1px solid rgba(238,243,244,.16); }
.cinematic-hero__rail a:hover, .cinematic-hero__rail a.is-hero { background: rgba(233,135,72,.16); }
.cinematic-hero__rail a span { color: #e9a570; font-size: 10px; letter-spacing: .12em; }
.cinematic-intro { display: grid; grid-template-columns: 1fr 2fr 1fr; gap: 36px; align-items: end; width: min(90%, 1720px); margin: 0 auto; padding: clamp(108px, 13vw, 200px) 0 clamp(70px, 9vw, 145px); }
.cinematic-intro h2 { font-size: clamp(78px, 9.2vw, 160px); text-transform: uppercase; }
.cinematic-intro > p:last-child { max-width: 290px; padding-bottom: 8px; color: #b5bec1; font-size: 16px; line-height: 1.6; }
.cinematic-project { position: relative; display: flex; align-items: end; min-height: 740px; min-height: min(960px, 88svh); margin: 0 2.6vw 24px; isolation: isolate; overflow: hidden; background: #171e23; }
.cinematic-project__visual, .cinematic-project__visual::after { position: absolute; inset: 0; z-index: -2; }
.cinematic-project__visual::after { content: ""; z-index: 0; background: linear-gradient(90deg, rgba(5,9,12,.87), rgba(5,9,12,.18) 75%), linear-gradient(0deg, rgba(5,9,12,.82), transparent 55%); }
.cinematic-project__visual img { width: 100%; height: 100%; object-fit: cover; transition: transform .9s cubic-bezier(.18,.65,.22,1); }
.cinematic-project:hover .cinematic-project__visual img { transform: scale(1.035); }
.cinematic-project__content { width: min(90%, 1600px); margin: 0 auto; padding: 110px 0 88px; }
.cinematic-project__overline { display: flex; gap: 24px; align-items: center; color: #e9b487; font-size: 11px; font-weight: 850; letter-spacing: .14em; text-transform: uppercase; }
.cinematic-project__overline span:first-child { font-size: 17px; letter-spacing: 0; }
.cinematic-project h3 { max-width: 12ch; margin: 20px 0 22px; font-size: clamp(75px, 10vw, 175px); text-transform: uppercase; }
.cinematic-project__content > p { max-width: 440px; color: #e2e4df; font-size: clamp(18px, 1.6vw, 24px); line-height: 1.45; }
.cinematic-project__actions { display: flex; align-items: center; gap: 32px; margin-top: 30px; }
.cinematic-project__play { color: #d9e4e5; font-size: 11px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.cinematic-project__play:hover { color: #e9a570; }
.cinematic-project--cat-clicker { min-height: 760px; background: #2b2019; }
.cinematic-project--cat-clicker .cinematic-project__visual { left: 31%; }
.cinematic-project--cat-clicker .cinematic-project__visual img { height: 145%; object-position: 48% 57%; transform: translateY(-31%); }
.cinematic-project--cat-clicker:hover .cinematic-project__visual img { transform: translateY(-31%) scale(1.025); }
.cinematic-project--cat-clicker .cinematic-project__visual::after { background: linear-gradient(90deg, #211b19 0%, rgba(33,27,25,.72) 24%, transparent 69%), linear-gradient(0deg, rgba(33,27,25,.3), transparent 55%); }
.cinematic-project--cat-clicker h3 { max-width: 8ch; color: #fff0da; }
.cinematic-project--cat-clicker .cinematic-project__content { padding-bottom: 135px; }
.cinematic-project--sausage-parkour { min-height: 720px; background: #18283a; }
.cinematic-project--sausage-parkour .cinematic-project__visual img { object-position: 52% 48%; }
.cinematic-project--sausage-parkour .cinematic-project__visual::after { background: linear-gradient(90deg, rgba(8,20,37,.88), rgba(8,20,37,.14) 73%), linear-gradient(0deg, rgba(8,20,37,.65), transparent 57%); }
.cinematic-project--sausage-parkour .cinematic-project__content { margin-left: auto; margin-right: 5%; width: min(39%, 610px); padding-block: 150px; }
.cinematic-project--sausage-parkour .cinematic-project__visual::after { background: linear-gradient(270deg, rgba(8,20,37,.87), rgba(8,20,37,.04) 82%), linear-gradient(0deg, rgba(8,20,37,.3), transparent 60%); }
.cinematic-project--sausage-parkour h3 { font-size: clamp(68px, 8vw, 150px); }
.cinematic-project--s-lumberjack { min-height: 880px; background: #132318; }
.cinematic-project--s-lumberjack .cinematic-project__visual img { object-position: 50% 54%; }
.cinematic-project--s-lumberjack .cinematic-project__visual::after { background: linear-gradient(0deg, rgba(3,13,7,.95), rgba(3,13,7,.05) 76%); }
.cinematic-project--s-lumberjack .cinematic-project__content { text-align: center; padding-bottom: 66px; }
.cinematic-project--s-lumberjack .cinematic-project__overline, .cinematic-project--s-lumberjack .cinematic-project__actions { justify-content: center; }
.cinematic-project--s-lumberjack h3, .cinematic-project--s-lumberjack .cinematic-project__content > p { margin-left: auto; margin-right: auto; }
.cinematic-project--s-lumberjack h3 { max-width: none; color: #f2f7dc; }
.cinematic-project--grid-royale { min-height: 720px; background: radial-gradient(circle at 73% 45%, #24536a 0%, #102735 35%, #0c1b26 70%); }
.cinematic-project--grid-royale .cinematic-project__visual::after, .cinematic-project--grim-cure .cinematic-project__visual::after { background: none; }
.cinematic-project--grid-royale .cinematic-project__symbol { position: absolute; top: 11%; right: 7%; width: min(47vw, 620px); aspect-ratio: 1; opacity: .8; transform: rotate(-13deg); background-image: linear-gradient(90deg, transparent 32%, rgba(127,219,227,.5) 32.3%, rgba(127,219,227,.5) 33%, transparent 33.3%, transparent 66%, rgba(127,219,227,.5) 66.3%, rgba(127,219,227,.5) 67%, transparent 67.3%), linear-gradient(0deg, transparent 32%, rgba(127,219,227,.5) 32.3%, rgba(127,219,227,.5) 33%, transparent 33.3%, transparent 66%, rgba(127,219,227,.5) 66.3%, rgba(127,219,227,.5) 67%, transparent 67.3%); filter: drop-shadow(0 0 40px rgba(78,215,255,.2)); }
.cinematic-project--grid-royale .cinematic-project__symbol::before { content: "×"; position: absolute; left: 6%; top: 0; color: #9be7e6; font: 900 clamp(130px, 22vw, 300px)/1 Impact, sans-serif; }
.cinematic-project--grid-royale .cinematic-project__symbol::after { content: "○"; position: absolute; right: 0; bottom: -10%; color: #e98748; font: 900 clamp(150px, 23vw, 330px)/1 Impact, sans-serif; }
.cinematic-project--grid-royale h3 { max-width: 9ch; }
.cinematic-project--grim-cure { min-height: 770px; background: radial-gradient(circle at 80% 30%, rgba(179,99,78,.2), transparent 30%), linear-gradient(120deg, #21161b, #111319 73%); }
.cinematic-project--grim-cure .cinematic-project__symbol { position: absolute; right: 9%; top: 16%; width: min(38vw, 520px); aspect-ratio: .8; opacity: .4; border: 2px solid #d99776; border-radius: 50% 50% 15% 15%; box-shadow: inset 0 0 0 35px rgba(11,16,21,.7), 0 0 130px rgba(210,90,66,.2); transform: rotate(13deg); }
.cinematic-project--grim-cure .cinematic-project__symbol::before { content: ""; position: absolute; top: 26%; left: -16%; width: 132%; height: 35%; border: 2px solid #d99776; border-radius: 50%; transform: rotate(-23deg); }
.cinematic-project--grim-cure h3 { max-width: 9ch; color: #f2d9cc; }
.cinematic-portfolio__end { display: flex; justify-content: space-between; align-items: center; width: min(90%, 1720px); margin: 0 auto; padding: 35px 0 150px; color: #b7bfc0; border-top: 1px solid rgba(243,244,238,.16); font-size: 11px; font-weight: 850; letter-spacing: .13em; text-transform: uppercase; }
.cinematic-portfolio__end a { color: #f3f2eb; }
.cinematic-portfolio__end a:hover { color: #e9a570; }

.cinematic-studio { position: relative; display: grid; grid-template-columns: 45% 55%; min-height: 820px; background: #d7d6ca; color: #12191c; overflow: hidden; }
.cinematic-studio__image { overflow: hidden; }
.cinematic-studio__image img { width: 100%; height: 100%; object-fit: cover; object-position: 48% 50%; filter: saturate(.7) contrast(1.08); }
.cinematic-studio__body { align-self: center; padding: clamp(65px, 9vw, 150px); }
.cinematic-studio .cinematic-label { color: #9b512e; }
.cinematic-studio h2 { max-width: 900px; margin: 38px 0; font-size: clamp(72px, 7.7vw, 140px); text-transform: uppercase; }
.cinematic-studio em { color: #ad5c32; }
.cinematic-studio__body > p:not(.cinematic-label) { max-width: 490px; font-size: clamp(17px, 1.4vw, 22px); line-height: 1.55; }
.cinematic-studio .cinematic-link { margin-top: 43px; color: #12191c; border-color: #12191c; }
.cinematic-studio .cinematic-link:hover { color: #ad5c32; border-color: #ad5c32; }
.cinematic-pulse { padding: clamp(120px, 13vw, 210px) max(5vw, calc((100vw - 1720px) / 2)); background: radial-gradient(circle at 91% 5%, rgba(35,91,102,.23), transparent 30%), #0b141a; }
.cinematic-pulse__heading { display: flex; align-items: end; justify-content: space-between; gap: 35px; margin-bottom: 72px; }
.cinematic-pulse h2 { margin-top: 24px; font-size: clamp(65px, 7.4vw, 135px); text-transform: uppercase; }
.cinematic-pulse__dashboard { border: 1px solid rgba(181,216,224,.22); background: #0d1c23; box-shadow: 0 30px 80px rgba(0,0,0,.22); }
.cinematic-pulse__stats { display: grid; grid-template-columns: repeat(3, 1fr); }
.cinematic-pulse__stats > div { display: flex; flex-direction: column; justify-content: space-between; min-height: 260px; padding: 32px 38px; border-right: 1px solid rgba(181,216,224,.22); border-bottom: 1px solid rgba(181,216,224,.22); }
.cinematic-pulse__stats > div:last-child { border-right: 0; }
.cinematic-pulse__stats span, .cinematic-pulse__stats small, .cinematic-pulse__stream-head { color: #99b2b9; font-size: 11px; font-weight: 850; letter-spacing: .15em; text-transform: uppercase; }
.cinematic-pulse__stats strong { color: #e5f1ef; font: 900 clamp(80px, 8.5vw, 150px)/.85 Impact, "Arial Narrow", sans-serif; }
.cinematic-pulse__stats small { color: #c0d2d5; }
.cinematic-pulse__stream { padding: 0 38px 22px; }
.cinematic-pulse__stream-head { display: flex; justify-content: space-between; gap: 15px; padding: 23px 0; }
.cinematic-pulse__stream a { display: grid; grid-template-columns: 160px 190px 1fr 20px; gap: 20px; align-items: center; min-height: 72px; border-top: 1px solid rgba(181,216,224,.17); }
.cinematic-pulse__stream a:hover { color: #e9a570; }
.cinematic-pulse__stream a time, .cinematic-pulse__stream a span { color: #a9bcc1; font-size: 12px; }
.cinematic-pulse__stream a strong { font-size: 16px; font-weight: 650; }
.cinematic-pulse__stream a b { font-weight: 400; }
.cinematic-pulse__stream > p { padding: 25px 0 18px; border-top: 1px solid rgba(181,216,224,.17); color: #b5c8ca; font-size: 15px; }
.cinematic-updates { padding: clamp(120px, 12vw, 190px) max(5vw, calc((100vw - 1720px) / 2)); background: #11171b; }
.cinematic-updates__heading { display: grid; grid-template-columns: 1fr 3fr auto; gap: 30px; align-items: end; padding-bottom: 45px; }
.cinematic-updates h2 { font-size: clamp(78px, 9vw, 160px); text-transform: uppercase; }
.cinematic-updates h2 span, .cinematic-end h2 span { color: #e98748; }
.cinematic-updates__feed { border-top: 1px solid rgba(243,245,239,.25); }
.cinematic-updates__feed article { display: grid; grid-template-columns: 20% 1fr 1.1fr auto; gap: 28px; align-items: center; padding: 28px 0; border-bottom: 1px solid rgba(243,245,239,.17); }
.cinematic-updates__feed article.is-featured { grid-template-columns: 20% 1.15fr .9fr auto; min-height: 235px; }
.cinematic-updates__meta { display: flex; flex-direction: column; gap: 7px; color: #d2b296; font-size: 11px; font-weight: 850; letter-spacing: .1em; text-transform: uppercase; }
.cinematic-updates h3 { font-family: "Segoe UI", sans-serif; font-size: clamp(20px, 2.8vw, 39px); font-weight: 800; letter-spacing: -.045em; line-height: 1.1; }
.cinematic-updates .is-featured h3 { font-size: clamp(34px, 3.4vw, 56px); }
.cinematic-updates h3 a:hover { color: #e9a570; }
.cinematic-updates__feed article > p { max-width: 410px; color: #aeb9b9; font-size: 14px; line-height: 1.5; }
.cinematic-updates__empty { padding: 45px 0; color: #aeb9b9; }
.cinematic-end { display: grid; grid-template-columns: 1fr 2.2fr 1fr; gap: 30px; align-items: end; padding: clamp(135px, 16vw, 260px) max(5vw, calc((100vw - 1720px) / 2)); background: radial-gradient(circle at 85% 45%, rgba(215,95,55,.12), transparent 30%), #0a0e12; }
.cinematic-end h2 { font-size: clamp(87px, 10.5vw, 200px); text-transform: uppercase; }
.cinematic-end > div p { margin-bottom: 28px; color: #b3bec0; font-size: 16px; line-height: 1.55; }
@keyframes scene-arrive { from { opacity: .55; transform: scale(1.19); } to { opacity: 1; transform: scale(1.12); } }
@keyframes type-arrive { from { opacity: 0; transform: translateY(34px); } to { opacity: 1; transform: none; } }

/* Public secondary pages share the same scale, palette, and edge-to-edge imagery. */
.projects-page, .project-story, .studio-story, .news-redesign { background: #0b1015; color: #f2f0e9; }
.projects-page__hero { position: relative; display: flex; flex-direction: column; justify-content: flex-end; isolation: isolate; overflow: hidden; width: 100%; min-height: 850px; min-height: 91svh; padding: 180px 5vw 95px; border: 0; background: #142029; }
.projects-page__hero::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, #0b151c 0%, rgba(11,21,28,.94) 32%, rgba(11,21,28,.2) 80%), linear-gradient(0deg, rgba(11,21,28,.92), transparent 43%); }
.projects-page__hero > p, .projects-page__hero > h1, .projects-page__hero > div:not(.projects-page__hero-media) { position: relative; z-index: 1; }
.projects-page__hero > div.projects-page__hero-media { position: absolute; inset: 0 0 0 45%; display: grid; grid-template-columns: repeat(3, 1fr); gap: 7px; z-index: -2; transform: skewX(-7deg) scale(1.15); }
.projects-page__hero > div.projects-page__hero-media[data-count="1"] { grid-template-columns: repeat(1, 1fr); }
.projects-page__hero > div.projects-page__hero-media[data-count="2"] { grid-template-columns: repeat(2, 1fr); }
.projects-page__hero-media img { width: 100%; height: 100%; object-fit: cover; }
.projects-page__hero-media img[data-game="cat-clicker"] { object-position: 53% center; }
.projects-page__hero-media img[data-game="sausage-parkour"] { object-position: 51% center; }
.projects-page__hero-media img[data-game="s-lumberjack"] { object-position: 54% center; }
.projects-page__hero h1 { max-width: 1100px; font-size: clamp(82px, 10.3vw, 170px); color: #f2f0e9; }
.projects-page__hero > div:not(.projects-page__hero-media) { max-width: 880px; }
.projects-page__hero > div > p { max-width: 680px; color: #bac4c5; }
.projects-page__rail, .project-story__rail { border-color: rgba(243,244,238,.15); padding-inline: 5vw; }
.projects-page__rail a, .project-story__rail a { color: #b7c0c2; }
.projects-page__list { width: min(90%, 1720px); }
.project-panel { min-height: 680px; padding-block: 80px; border-color: rgba(243,244,238,.16); }
.project-panel__media { background: #172127; overflow: hidden; }
.project-panel__media img { object-fit: cover; transition: transform .6s ease; }
.project-panel__media:hover img { transform: scale(1.03); }
.project-panel h2 { color: #f2f0e9; }
.project-panel__copy > p { color: #b6c1c2; }
.project-panel[id="grid-royale"] .project-panel__media { background: radial-gradient(circle at 55% 45%, #254e60, #0b2634); }
.project-panel[id="grid-royale"] .project-panel__media::before { content: "×  ○"; display: grid; place-items: center; width: 100%; min-height: 470px; color: rgba(163,235,237,.83); font: 900 clamp(110px, 16vw, 250px)/1 Impact, sans-serif; transform: rotate(-12deg); }
.project-panel[id="grim-cure"] .project-panel__media { background: radial-gradient(circle at 65% 35%, #513139, #21171d 75%); }
.project-panel[id="grim-cure"] .project-panel__media::before { content: "✚"; display: grid; place-items: center; width: 100%; min-height: 470px; color: rgba(223,161,135,.8); font: 900 clamp(160px, 22vw, 330px)/1 Georgia, serif; }
.project-story__hero { min-height: 770px; min-height: 91svh; background: radial-gradient(circle at 70% 35%, #26323a, #10171c); }
.project-story__hero-copy { width: min(90%, 1720px); padding-bottom: 115px; }
.project-story__hero-copy h1 { max-width: 15ch; margin: 22px 0; font-size: clamp(82px, 10.3vw, 176px); color: #fffaf1; }
.project-story__eyebrow { color: #ffc394 !important; }
.project-story__hero-lead { max-width: 520px; color: #e2e8e7; font-size: clamp(18px, 1.5vw, 23px); line-height: 1.45; }
.project-story__hero > img { object-position: center; }
.project-story__shade { background: linear-gradient(90deg, rgba(5,10,14,.88), rgba(5,10,14,.12) 72%), linear-gradient(0deg, rgba(5,10,14,.87), transparent 70%); }
.project-story--cat-clicker .project-story__hero > img { top: -45%; height: 155%; object-position: center; }
.project-story--sausage-parkour .project-story__hero > img { object-position: 52% center; }
.project-story--s-lumberjack .project-story__hero > img { top: -20%; height: 122%; object-position: center; }
.project-story--grid-royale .project-story__hero { background: radial-gradient(circle at 74% 42%, #2a6276, #0f2634 48%, #0a151e); }
.project-story--grid-royale .project-story__hero::before { content: "×  ○"; position: absolute; top: 15%; right: 6%; color: rgba(151,228,233,.43); font: 900 clamp(160px, 24vw, 460px)/1 Impact, sans-serif; transform: rotate(-18deg); }
.project-story--grim-cure .project-story__hero { background: radial-gradient(circle at 80% 40%, #633a42, #24181d 43%, #100e14); }
.project-story--grim-cure .project-story__hero::before { content: "✚"; position: absolute; top: -10%; right: 9%; color: rgba(226,164,136,.2); font: 900 clamp(350px, 50vw, 900px)/1 Georgia, serif; }
.project-story__intro, .project-story__feature, .project-story__section, .project-story__footer { width: min(90%, 1250px); }
.project-story__intro { border-bottom: 1px solid rgba(243,244,238,.16); }
.project-story__lead { color: #f2f0e9; }
.project-story__description, .project-story__feature-copy > div { color: #b4bfc1; }
.project-story__feature, .project-story__section, .project-story__footer { border-color: rgba(243,244,238,.16); }
.project-story__screenshots { gap: 18px; }
.project-story__screenshots img { aspect-ratio: 16/9; }
.project-button { border-radius: 0; }
.project-button--solid { background: #e98748; color: #101217; }
.project-button--solid:hover { background: #ffc189; }
.studio-story__hero { position: relative; display: flex; flex-direction: column; justify-content: flex-end; isolation: isolate; overflow: hidden; width: 100%; min-height: 810px; min-height: 93svh; padding: 170px 5vw 100px; background: #182434; }
.studio-story__hero::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, rgba(5,11,18,.83), rgba(5,11,18,.18) 75%), linear-gradient(0deg, rgba(5,11,18,.91), transparent 56%); }
.studio-story__hero > p, .studio-story__hero > h1 { position: relative; z-index: 1; }
.studio-story__hero h1 { max-width: 1300px; margin: 20px 0; font-size: clamp(86px, 10.5vw, 170px); color: #fffaf1; }
.studio-story__hero-media { position: absolute; inset: 0; z-index: -2; width: 100%; max-height: none; overflow: hidden; }
.studio-story__hero-media img { width: 100%; height: 100%; max-height: none; object-fit: cover; object-position: 56% 52%; }
.studio-story__lead { max-width: 500px; margin: 0; color: #f2f0e9; }
.studio-story__section { width: min(90%, 1400px); }
.studio-story__copy { color: #b4bfc1; }
.news-redesign { width: min(90%, 1720px); padding-top: clamp(180px, 18vw, 300px); }
.news-redesign__hero { display: block; }
.news-redesign__hero h1 { margin: 25px 0 0; max-width: none; font-family: Impact, "Arial Narrow", sans-serif; font-size: clamp(80px, 10vw, 175px); line-height: .98; letter-spacing: -.025em; overflow-wrap: anywhere; }
.news-redesign__intro { max-width: 1050px; margin-top: 33px; }
.news-redesign__intro p { color: #bbc5c6; }
.news-feed__item, .news-filters, .news-redesign__note { border-color: rgba(243,244,238,.17); }
.news-feed__copy > p { color: #b4bfc1; }
.news-feed__media { background: #16232a; }
.news-feed__no-media { color: rgba(238,240,233,.35); }
.news-redesign__empty { min-height: 270px; display: flex; align-items: center; }

/* The log is deliberately more structured than the portfolio. */
.activity-page { min-height: 100svh; padding: 175px max(5vw, calc((100vw - 1720px) / 2)) 150px; background: radial-gradient(circle at 92% 7%, rgba(32,89,100,.26), transparent 30%), #0a141a; }
.activity-page__hero { display: grid; grid-template-columns: 1fr 1.4fr; gap: 35px; align-items: end; padding-bottom: 55px; border-bottom: 1px solid rgba(183,218,223,.23); }
.activity-page__hero .eyebrow { color: #e9a570; font-size: 11px; font-weight: 850; letter-spacing: .16em; text-transform: uppercase; }
.activity-page__hero h1 { grid-column: 2; font: 900 clamp(84px, 10vw, 165px)/.98 Impact, "Arial Narrow", sans-serif; text-transform: uppercase; letter-spacing: -.025em; }
.activity-page__hero > p { grid-column: 2; color: #b2c3c8; font-size: 17px; }
.activity-page__stats { display: grid; grid-template-columns: repeat(3, 1fr); margin: 45px 0 60px; border: 1px solid rgba(183,218,223,.23); }
.activity-page__stats > div { display: flex; flex-direction: column; gap: 7px; min-height: 205px; padding: 27px 32px; border-right: 1px solid rgba(183,218,223,.23); }
.activity-page__stats > div:last-child { border: 0; }
.activity-page__stats strong { margin-top: auto; color: #f0f4f0; font: 900 clamp(62px, 6vw, 106px)/.85 Impact, sans-serif; }
.activity-page__stats strong.is-date { font-size: clamp(30px, 3vw, 48px); }
.activity-page__stats span { color: #aec2c6; font-size: 11px; font-weight: 850; letter-spacing: .12em; text-transform: uppercase; }
.activity-page__filters { display: flex; flex-wrap: wrap; gap: 14px 25px; padding: 20px 0; border-top: 1px solid rgba(183,218,223,.23); border-bottom: 1px solid rgba(183,218,223,.23); }
.activity-page__filters--projects { border-top: 0; }
.activity-page__filters a { color: #a8b9bd; font-size: 11px; font-weight: 800; letter-spacing: .11em; text-transform: uppercase; }
.activity-page__filters a:hover, .activity-page__filters a.is-active { color: #efb07d; }
.activity-page__timeline { margin-top: 65px; }
.activity-page__month { display: grid; grid-template-columns: 22% 1fr; gap: 30px; padding: 40px 0; border-top: 1px solid rgba(183,218,223,.23); }
.activity-page__month h2 { color: #e9a570; font: 900 clamp(25px, 2.3vw, 37px)/1 Impact, sans-serif; text-transform: uppercase; }
.activity-page__entry { display: grid; grid-template-columns: 160px 1fr 1.3fr 20px; gap: 20px; align-items: start; padding: 23px 0; border-bottom: 1px solid rgba(183,218,223,.16); }
.activity-page__entry:first-child { padding-top: 0; }
.activity-page__entry time, .activity-page__entry small { color: #a8bcc1; font-size: 12px; }
.activity-page__entry time { grid-column: 1; grid-row: 1 / span 2; }
.activity-page__entry small { grid-column: 2; grid-row: 1 / span 2; }
.activity-page__entry h3 { grid-column: 3; grid-row: 1; font-size: clamp(18px, 1.5vw, 25px); line-height: 1.2; }
.activity-page__entry p { grid-column: 3; grid-row: 2; color: #afc0c4; font-size: 14px; line-height: 1.5; }
.activity-page__entry > a { grid-column: 4; grid-row: 1 / span 2; }
.activity-page__entry a:hover { color: #e9a570; }
.activity-page__empty { display: flex; align-items: center; min-height: 240px; color: #b0c1c5; font-size: 17px; }

@media (max-width: 1050px) {
  .cinematic-intro, .cinematic-end { grid-template-columns: 1fr 2fr; }
  .cinematic-intro > p:last-child, .cinematic-end > div { grid-column: 2; }
  .cinematic-updates__heading { grid-template-columns: 1fr 3fr; }
  .cinematic-updates__heading .cinematic-link { grid-column: 2; justify-self: start; }
  .cinematic-updates__feed article { grid-template-columns: 160px 1fr auto; }
  .cinematic-updates__feed article > p { grid-column: 2; }
  .cinematic-studio__body { padding: 65px; }
}
@media (max-width: 760px) {
  .site-footer .container { width: calc(100% - 36px); }
  .site-footer__grid { padding-top: 65px; }
  .cinematic-hero { min-height: 844px; min-height: 100svh; }
  .cinematic-hero__scene img { object-position: 58% 50%; }
  .cinematic-hero::after { background: linear-gradient(0deg, rgba(6,13,22,.97) 0%, rgba(6,13,22,.3) 56%, rgba(6,13,22,.97) 100%), linear-gradient(90deg, rgba(6,13,22,.55), transparent 76%); }
  .cinematic-hero__top { top: 97px; left: 18px; right: 18px; font-size: 8px; }
  .cinematic-hero__content { width: calc(100% - 36px); padding: 250px 0 85px; }
  .cinematic-hero__title { max-width: 7ch; margin: 16px 0; font-size: clamp(60px, 16vw, 105px); line-height: 1.08; }
  .cinematic-hero__description { max-width: 315px; font-size: 16px; }
  .cinematic-hero__actions { gap: 8px 20px; margin-top: 24px; }
  .cinematic-hero__actions .cinematic-button { min-height: 52px; }
  .cinematic-hero__scroll { display: none; }
  .cinematic-hero__rail { display: none; }
  .cinematic-intro { display: block; width: calc(100% - 36px); padding: 95px 0 60px; }
  .cinematic-intro h2 { margin: 18px 0; font-size: clamp(60px, 15vw, 100px); line-height: 1.07; }
  .cinematic-intro > p:last-child { font-size: 15px; }
  .cinematic-project { min-height: 670px; min-height: 82svh; margin: 0 0 12px; }
  .cinematic-project__content, .cinematic-project--sausage-parkour .cinematic-project__content { width: calc(100% - 36px); margin: 0 auto; padding: 75px 0 43px; text-align: left; }
  .cinematic-project h3, .cinematic-project--sausage-parkour h3 { max-width: 9ch; font-size: clamp(62px, 15vw, 100px); line-height: 1.07; }
  .cinematic-project__content > p { max-width: 350px; font-size: 17px; }
  .cinematic-project__actions { gap: 25px; }
  .cinematic-project--cat-clicker .cinematic-project__visual { left: 0; }
  .cinematic-project--cat-clicker .cinematic-project__visual img { object-position: 50% 50%; }
  .cinematic-project--cat-clicker .cinematic-project__visual::after { background: linear-gradient(0deg, rgba(31,24,22,.98), rgba(31,24,22,.05) 75%); }
  .cinematic-project--cat-clicker .cinematic-project__content { padding-bottom: 42px; }
  .cinematic-project--sausage-parkour .cinematic-project__visual img { height: 135%; object-position: 55% 50%; transform: translateY(-26%); }
  .cinematic-project--sausage-parkour .cinematic-project__visual::after { background: linear-gradient(0deg, rgba(8,20,37,.96), rgba(8,20,37,.02) 76%), linear-gradient(180deg, rgba(8,20,37,.72), transparent 25%); }
  .cinematic-project--s-lumberjack .cinematic-project__content { text-align: left; padding-bottom: 42px; }
  .cinematic-project--s-lumberjack .cinematic-project__overline, .cinematic-project--s-lumberjack .cinematic-project__actions { justify-content: flex-start; }
  .cinematic-project--s-lumberjack h3, .cinematic-project--s-lumberjack .cinematic-project__content > p { margin-left: 0; }
  .cinematic-project--grid-royale .cinematic-project__symbol { right: -25%; top: 8%; width: 105vw; }
  .cinematic-project--grim-cure .cinematic-project__symbol { right: -24%; top: 7%; width: 88vw; }
  .cinematic-portfolio__end { width: calc(100% - 36px); padding: 32px 0 90px; }
  .cinematic-studio { display: flex; flex-direction: column; min-height: 0; }
  .cinematic-studio__image { height: 360px; }
  .cinematic-studio__body { padding: 70px 18px 90px; }
  .cinematic-studio h2 { margin: 24px 0; font-size: clamp(62px, 15vw, 95px); }
  .cinematic-studio__body > p:not(.cinematic-label) { font-size: 17px; }
  .cinematic-pulse, .cinematic-updates { padding: 95px 18px; }
  .cinematic-pulse__heading { display: block; margin-bottom: 38px; }
  .cinematic-pulse__heading .cinematic-link { margin-top: 23px; }
  .cinematic-pulse h2 { font-size: clamp(57px, 13vw, 90px); }
  .cinematic-pulse__stats { grid-template-columns: 1fr 1fr; }
  .cinematic-pulse__stats > div { min-height: 160px; padding: 22px; }
  .cinematic-pulse__stats > div:nth-child(2) { border-right: 0; }
  .cinematic-pulse__stats > div:last-child { grid-column: 1 / -1; min-height: 150px; }
  .cinematic-pulse__stats strong { font-size: 78px; }
  .cinematic-pulse__stream { padding: 0 22px 10px; }
  .cinematic-pulse__stream a { grid-template-columns: 1fr auto; gap: 5px; padding: 15px 0; }
  .cinematic-pulse__stream a time, .cinematic-pulse__stream a span, .cinematic-pulse__stream a strong { grid-column: 1; }
  .cinematic-pulse__stream a b { grid-column: 2; grid-row: 1 / span 3; }
  .cinematic-updates__heading { display: block; padding-bottom: 38px; }
  .cinematic-updates h2 { margin: 16px 0; font-size: clamp(62px, 14vw, 93px); }
  .cinematic-updates__feed article, .cinematic-updates__feed article.is-featured { display: block; min-height: 0; padding: 28px 0; }
  .cinematic-updates__meta { flex-direction: row; flex-wrap: wrap; gap: 5px 12px; }
  .cinematic-updates h3, .cinematic-updates .is-featured h3 { margin: 15px 0; font-size: 29px; }
  .cinematic-updates__feed article > p { margin-bottom: 14px; }
  .cinematic-end { display: block; padding: 115px 18px 130px; }
  .cinematic-end h2 { margin: 25px 0; font-size: clamp(82px, 17vw, 120px); }
  .cinematic-end > div p { max-width: 330px; }
  .projects-page__hero, .studio-story__hero { width: 100%; min-height: 760px; min-height: 95svh; padding: 125px 18px 70px; }
  .projects-page__hero > div.projects-page__hero-media { inset: 0 0 0 10%; transform: skewX(-7deg) scale(1.23); }
  .projects-page__hero::after { background: linear-gradient(0deg, rgba(7,15,21,.98), rgba(7,15,21,.16) 80%); }
  .studio-story__hero::after { background: linear-gradient(0deg, rgba(5,11,18,.95), rgba(5,11,18,.13) 80%); }
  .news-redesign { width: calc(100% - 36px); padding-top: 125px; }
  .projects-page__hero h1 { font-size: clamp(58px, 14vw, 90px); }
  .projects-page__list { width: calc(100% - 36px); }
  .project-panel { min-height: 0; padding: 45px 0; }
  .project-panel[id="grid-royale"] .project-panel__media::before, .project-panel[id="grim-cure"] .project-panel__media::before { min-height: 270px; }
  .project-story__hero { min-height: 720px; min-height: 90svh; }
  .project-story__hero-copy { width: calc(100% - 36px); padding-bottom: 55px; }
  .project-story__hero-copy h1 { font-size: clamp(62px, 14vw, 100px); }
  .project-story--s-lumberjack .project-story__hero-copy h1 { font-size: clamp(32px, 9.4vw, 58px); white-space: nowrap; }
  .project-story__hero-lead { font-size: 17px; }
  .project-story__intro, .project-story__feature, .project-story__section, .project-story__footer { width: calc(100% - 36px); }
  .project-story__section h2 { font-size: clamp(34px, 10vw, 54px); overflow-wrap: anywhere; }
  .project-story__feature { grid-template-columns: minmax(0, 1fr); }
  .project-story__feature > * { min-width: 0; }
  .project-story__feature-copy h2 { font-size: clamp(34px, 10vw, 48px); overflow-wrap: anywhere; }
  .studio-story__hero h1 { font-size: clamp(58px, 14vw, 95px); }
  .studio-story__hero-media { margin-inline: 0; }
  .studio-story__section { width: calc(100% - 36px); }
  .news-redesign__hero h1 { font-size: clamp(42px, 14vw, 78px); line-height: 1.04; letter-spacing: -.02em; }
  .activity-page { padding: 130px 18px 100px; }
  .activity-page__hero { display: block; }
  .activity-page__hero h1 { margin: 20px 0; font-size: clamp(47px, 13.2vw, 75px); line-height: 1.04; letter-spacing: -.02em; }
  .activity-page__stats { grid-template-columns: 1fr 1fr; }
  .activity-page__stats > div { min-height: 150px; padding: 20px; }
  .activity-page__stats > div:nth-child(2) { border-right: 0; }
  .activity-page__stats > div:last-child { grid-column: 1 / -1; border-top: 1px solid rgba(183,218,223,.23); }
  .activity-page__stats strong { font-size: 72px; }
  .activity-page__month { display: block; }
  .activity-page__month h2 { margin-bottom: 20px; }
  .activity-page__entry { grid-template-columns: 1fr auto; gap: 6px 16px; }
  .activity-page__entry time, .activity-page__entry small, .activity-page__entry h3, .activity-page__entry p { grid-column: 1; grid-row: auto; }
  .activity-page__entry > a { grid-column: 2; grid-row: 1 / span 4; }
}
@media (prefers-reduced-motion: reduce) {
  .cinematic-hero__scene img, .cinematic-hero__copy { animation: none !important; transform: none !important; }
  .cinematic-button, .cinematic-project__visual img { transition: none !important; }
}