:root {
    --black: #070706;
    --black-soft: #0c0c0a;
    --black-lift: #12120f;
    --black-card: #151512;
    --ivory: #e9e6df;
    --ivory-soft: #bbb6ab;
    --muted: #77736a;
    --gold: #c9a35b;
    --gold-bright: #e4c178;
    --gold-dim: #8b6c36;
    --line: rgba(233, 230, 223, .12);
    --line-soft: rgba(233, 230, 223, .07);
    --line-gold: rgba(201, 163, 91, .34);
    --display: "Inter Tight", "Helvetica Neue", Arial, sans-serif;
    --body: "Inter", "Helvetica Neue", Arial, sans-serif;
    --serif: "Instrument Serif", Georgia, serif;
    --header: 78px;
    --container: min(90vw, 1320px);
    --ease-out: cubic-bezier(.16, 1, .3, 1);
    --ease-smooth: cubic-bezier(.65, 0, .35, 1);
}

*,
*::before,
*::after {
    box-sizing: border-box;
}

html {
    background: var(--black);
    scroll-behavior: smooth;
}

body {
    margin: 0;
    overflow-x: hidden;
    color: var(--ivory);
    background: var(--black);
    font-family: var(--body);
    font-size: 15px;
    font-weight: 400;
    line-height: 1.65;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}

body::before {
    position: fixed;
    z-index: 0;
    inset: 0;
    pointer-events: none;
    background-image:
        linear-gradient(90deg, transparent calc(25% - .5px), var(--line-soft) 25%, transparent calc(25% + .5px)),
        linear-gradient(90deg, transparent calc(50% - .5px), var(--line-soft) 50%, transparent calc(50% + .5px)),
        linear-gradient(90deg, transparent calc(75% - .5px), var(--line-soft) 75%, transparent calc(75% + .5px));
    content: "";
    opacity: .45;
}

body.menu-open,
body.is-loading {
    overflow: hidden;
}

main,
.site-footer,
.closing-scene {
    position: relative;
    z-index: 1;
}

::selection {
    color: var(--black);
    background: var(--gold-bright);
}

img {
    display: block;
    max-width: 100%;
}

a {
    color: inherit;
    text-decoration: none;
}

button,
input,
select,
textarea {
    color: inherit;
    font: inherit;
}

button {
    cursor: pointer;
}

h1,
h2,
h3,
p,
figure,
blockquote,
dl,
dd {
    margin-top: 0;
}

h1,
h2,
h3 {
    font-family: var(--display);
    font-weight: 500;
    letter-spacing: -.035em;
    line-height: 1.08;
}

h1 em,
h2 em,
blockquote em {
    color: var(--gold-bright);
    font-family: var(--serif);
    font-weight: 400;
}

.container {
    width: var(--container);
    margin-inline: auto;
}

.section {
    padding: clamp(76px, 8vw, 116px) 0;
    position: relative;
    border-top: 1px solid var(--line-soft);
}

.visually-hidden {
    width: 1px;
    height: 1px;
    padding: 0;
    position: absolute;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.skip-link {
    position: fixed;
    z-index: 10000;
    top: 12px;
    left: 12px;
    padding: 10px 16px;
    color: var(--black);
    background: var(--ivory);
    transform: translateY(-160%);
    transition: transform .2s;
}

.skip-link:focus {
    transform: translateY(0);
}

.noise {
    position: fixed;
    z-index: 9000;
    inset: 0;
    pointer-events: none;
    opacity: .055;
    background-image:
        radial-gradient(circle at 12% 33%, rgba(255, 255, 255, .32) 0 .55px, transparent .7px),
        radial-gradient(circle at 72% 14%, rgba(255, 255, 255, .26) 0 .45px, transparent .62px),
        radial-gradient(circle at 44% 86%, rgba(255, 255, 255, .23) 0 .5px, transparent .65px);
    background-size: 5px 7px, 7px 5px, 6px 8px;
    mix-blend-mode: soft-light;
}

.pointer-glow {
    width: 520px;
    height: 520px;
    position: fixed;
    z-index: 0;
    top: 0;
    left: 0;
    pointer-events: none;
    border-radius: 50%;
    opacity: .14;
    background: radial-gradient(circle, rgba(201, 163, 91, .2), transparent 67%);
    transform: translate3d(calc(var(--pointer-x, 50vw) - 50%), calc(var(--pointer-y, 50vh) - 50%), 0);
}

.scroll-progress {
    width: 1px;
    height: 100vh;
    position: fixed;
    z-index: 950;
    top: 0;
    right: 0;
    background: rgba(255, 255, 255, .04);
}

.scroll-progress span {
    display: block;
    width: 100%;
    height: calc(var(--scroll-progress, 0) * 100%);
    background: var(--gold-bright);
}

.eyebrow {
    display: flex;
    margin-bottom: 17px;
    align-items: center;
    gap: 10px;
    color: var(--gold);
    font-size: 9px;
    font-weight: 600;
    letter-spacing: .18em;
    line-height: 1.4;
    text-transform: uppercase;
}

.eyebrow::before {
    width: 18px;
    height: 1px;
    background: currentColor;
    content: "";
}

.section-index {
    display: flex;
    align-items: center;
    gap: 13px;
    color: var(--muted);
    font-size: 9px;
    font-weight: 500;
    letter-spacing: .14em;
    text-transform: uppercase;
}

.section-index span {
    display: grid;
    width: 34px;
    height: 34px;
    border: 1px solid var(--line);
    border-radius: 50%;
    color: var(--gold);
    place-items: center;
}

.section-index p {
    margin: 0;
}

.section-heading {
    display: flex;
    margin-bottom: clamp(40px, 5vw, 66px);
    align-items: flex-end;
    justify-content: space-between;
    gap: 40px;
}

.section-heading h2,
.process-heading h2,
.faq-grid h2 {
    max-width: 760px;
    margin: 0;
    font-size: clamp(32px, 3.5vw, 52px);
}

.button {
    display: inline-flex;
    min-height: 48px;
    padding: 0 19px;
    position: relative;
    isolation: isolate;
    align-items: center;
    justify-content: space-between;
    gap: 28px;
    overflow: hidden;
    border: 1px solid var(--line-gold);
    border-radius: 2px;
    background: rgba(7, 7, 6, .2);
    font-size: 9px;
    font-weight: 600;
    letter-spacing: .13em;
    text-transform: uppercase;
    transition: color .45s var(--ease-out), border-color .45s, transform .45s var(--ease-out);
}

.button::before {
    position: absolute;
    z-index: -1;
    inset: 0;
    background: var(--gold-bright);
    content: "";
    transform: translateX(-102%);
    transition: transform .5s var(--ease-out);
}

.button:hover,
.button:focus-visible {
    color: var(--black);
    border-color: var(--gold-bright);
}

.button:hover::before,
.button:focus-visible::before {
    transform: translateX(0);
}

.button--light {
    color: var(--black);
    border-color: var(--ivory);
    background: var(--ivory);
}

.button--compact {
    min-height: 40px;
    padding-inline: 16px;
    gap: 18px;
}

.text-link {
    display: inline-flex;
    padding-bottom: 7px;
    position: relative;
    align-items: center;
    gap: 16px;
    font-size: 9px;
    font-weight: 600;
    letter-spacing: .13em;
    text-transform: uppercase;
}

.text-link::after {
    height: 1px;
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    background: var(--gold);
    content: "";
    transform: scaleX(.25);
    transform-origin: left;
    transition: transform .45s var(--ease-out);
}

.text-link:hover::after,
.text-link:focus-visible::after {
    transform: scaleX(1);
}

.content-note {
    max-width: 620px;
    margin: 30px 0 0;
    color: var(--muted);
    font-size: 10px;
}

/* Cinematic loader */

.site-loader {
    position: fixed;
    z-index: 9999;
    inset: 0;
    overflow: hidden;
    background: #050504;
    transition: visibility .01s 1.25s;
}

.site-loader__curtain {
    position: absolute;
    z-index: 4;
    right: 0;
    left: 0;
    height: 50%;
    background: #050504;
    transition: transform 1.15s var(--ease-smooth);
}

.site-loader__curtain--top {
    top: 0;
    transform-origin: top;
}

.site-loader__curtain--bottom {
    bottom: 0;
    transform-origin: bottom;
}

.site-loader.is-leaving {
    visibility: hidden;
    pointer-events: none;
}

.site-loader.is-leaving .site-loader__curtain--top {
    transform: translateY(-102%);
}

.site-loader.is-leaving .site-loader__curtain--bottom {
    transform: translateY(102%);
}

.site-loader__frame {
    display: grid;
    padding: 24px 30px;
    position: absolute;
    z-index: 5;
    inset: 0;
    grid-template-rows: auto 1fr auto;
    border: 1px solid rgba(255, 255, 255, .08);
    transition: opacity .35s .28s;
}

.site-loader.is-leaving .site-loader__frame {
    opacity: 0;
}

.site-loader__meta,
.site-loader__footer {
    display: grid;
    grid-template-columns: 1fr auto 72px;
    align-items: center;
    gap: 24px;
    color: #6e6a61;
    font-size: 8px;
    font-weight: 600;
    letter-spacing: .18em;
    text-transform: uppercase;
}

.site-loader__meta > span:nth-child(2) {
    text-align: center;
}

.site-loader__meta strong {
    color: var(--gold-bright);
    font-family: var(--display);
    font-size: 15px;
    font-weight: 500;
    letter-spacing: .06em;
    text-align: right;
}

.site-loader__stage {
    display: grid;
    margin: 20px 0;
    position: relative;
    overflow: hidden;
    place-items: center;
    border-top: 1px solid rgba(255, 255, 255, .07);
    border-bottom: 1px solid rgba(255, 255, 255, .07);
}

.site-loader__stage::before,
.site-loader__stage::after {
    width: 1px;
    position: absolute;
    top: 0;
    bottom: 0;
    background: rgba(255, 255, 255, .05);
    content: "";
}

.site-loader__stage::before { left: 33.333%; }
.site-loader__stage::after { right: 33.333%; }

.site-loader__beam {
    width: 34vw;
    height: 100vh;
    position: absolute;
    top: -48vh;
    opacity: .1;
    background: linear-gradient(180deg, var(--gold-bright), transparent 76%);
    filter: blur(9px);
    clip-path: polygon(48% 0, 52% 0, 100% 100%, 0 100%);
    transform-origin: top center;
}

.site-loader__beam--one {
    left: 20vw;
    animation: loader-sweep-one 2.6s var(--ease-smooth) infinite alternate;
}

.site-loader__beam--two {
    right: 18vw;
    animation: loader-sweep-two 3s var(--ease-smooth) infinite alternate;
}

.site-loader__mark {
    position: relative;
    z-index: 2;
}

.site-loader__mark img {
    width: 188px;
    opacity: .96;
}

.site-loader__floor {
    width: min(44vw, 580px);
    height: 1px;
    position: absolute;
    bottom: 24%;
    background: linear-gradient(90deg, transparent, var(--gold-dim), transparent);
    box-shadow: 0 -16px 80px rgba(201, 163, 91, .18);
}

.site-loader__footer {
    grid-template-columns: auto 1fr auto;
}

.site-loader__line {
    height: 1px;
    overflow: hidden;
    background: rgba(255, 255, 255, .08);
}

.site-loader__line span {
    display: block;
    width: 100%;
    height: 100%;
    background: var(--gold);
    transform: translateX(-100%);
    animation: loader-progress 1.65s var(--ease-out) forwards;
}

@keyframes loader-progress {
    to { transform: translateX(0); }
}

@keyframes loader-sweep-one {
    from { transform: rotate(-13deg); }
    to { transform: rotate(8deg); }
}

@keyframes loader-sweep-two {
    from { transform: rotate(10deg); }
    to { transform: rotate(-9deg); }
}

/* Header and navigation */

.site-header {
    display: grid;
    height: var(--header);
    padding: 0 3.8vw;
    position: fixed;
    z-index: 500;
    top: 0;
    right: 0;
    left: 0;
    grid-template-columns: 210px 1fr 210px;
    align-items: center;
    border-bottom: 1px solid transparent;
    transition: height .45s var(--ease-out), background .4s, border-color .4s, transform .45s var(--ease-out);
}

.site-header.is-scrolled {
    height: 64px;
    border-color: var(--line);
    background: rgba(7, 7, 6, .86);
    -webkit-backdrop-filter: blur(18px);
    backdrop-filter: blur(18px);
}

.site-header.is-hidden {
    transform: translateY(-105%);
}

.brand {
    width: 158px;
}

.brand img {
    width: 100%;
    height: auto;
}

.desktop-nav {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: clamp(24px, 3vw, 46px);
}

.desktop-nav a {
    position: relative;
    color: rgba(233, 230, 223, .7);
    font-size: 9px;
    font-weight: 600;
    letter-spacing: .14em;
    text-transform: uppercase;
    transition: color .25s;
}

.desktop-nav a::after {
    width: 14px;
    height: 1px;
    position: absolute;
    right: 0;
    bottom: -11px;
    left: 0;
    margin: auto;
    background: var(--gold);
    content: "";
    opacity: 0;
    transform: scaleX(0);
    transition: opacity .25s, transform .35s var(--ease-out);
}

.desktop-nav a:hover,
.desktop-nav a[aria-current="page"] {
    color: var(--ivory);
}

.desktop-nav a[aria-current="page"]::after {
    opacity: 1;
    transform: scaleX(1);
}

.header-cta {
    justify-self: end;
}

.menu-toggle {
    display: none;
    width: 42px;
    height: 42px;
    padding: 0;
    position: relative;
    border: 1px solid var(--line);
    border-radius: 50%;
    background: rgba(7, 7, 6, .36);
}

.menu-toggle span {
    width: 16px;
    height: 1px;
    position: absolute;
    top: 50%;
    left: 50%;
    background: var(--ivory);
    transition: transform .4s var(--ease-out);
}

.menu-toggle span:first-child { transform: translate(-50%, -3px); }
.menu-toggle span:last-child { transform: translate(-50%, 3px); }
.menu-toggle[aria-expanded="true"] span:first-child { transform: translate(-50%, 0) rotate(45deg); }
.menu-toggle[aria-expanded="true"] span:last-child { transform: translate(-50%, 0) rotate(-45deg); }

.mobile-menu {
    display: grid;
    padding: 104px 7vw 36px;
    position: fixed;
    z-index: 450;
    inset: 0;
    overflow: hidden;
    visibility: hidden;
    grid-template-rows: 1fr auto;
    background: #070706;
    opacity: 0;
    transition: opacity .35s, visibility .01s .35s;
}

.mobile-menu.is-open {
    visibility: visible;
    opacity: 1;
    transition: opacity .35s, visibility .01s;
}

.mobile-menu nav {
    display: flex;
    position: relative;
    z-index: 2;
    flex-direction: column;
    justify-content: center;
}

.mobile-menu nav a {
    display: grid;
    padding: 13px 0;
    grid-template-columns: 38px 1fr;
    align-items: center;
    border-bottom: 1px solid var(--line);
    font-family: var(--display);
    font-size: clamp(27px, 8vw, 39px);
    letter-spacing: -.03em;
    transform: translateY(14px);
    opacity: 0;
    transition: transform .55s var(--ease-out), opacity .45s;
}

.mobile-menu.is-open nav a {
    transform: translateY(0);
    opacity: 1;
}

.mobile-menu.is-open nav a:nth-child(2) { transition-delay: .04s; }
.mobile-menu.is-open nav a:nth-child(3) { transition-delay: .08s; }
.mobile-menu.is-open nav a:nth-child(4) { transition-delay: .12s; }
.mobile-menu.is-open nav a:nth-child(5) { transition-delay: .16s; }

.mobile-menu nav span {
    color: var(--gold);
    font-family: var(--body);
    font-size: 8px;
    letter-spacing: .14em;
}

.mobile-menu__footer {
    display: flex;
    position: relative;
    z-index: 2;
    justify-content: space-between;
    color: var(--muted);
    font-size: 10px;
}

.mobile-menu__footer p {
    margin: 0;
}

.mobile-menu__beam {
    width: 58vw;
    height: 100vh;
    position: absolute;
    right: -7vw;
    bottom: -25vh;
    opacity: .06;
    background: linear-gradient(0deg, var(--gold-bright), transparent 75%);
    clip-path: polygon(48% 0, 52% 0, 100% 100%, 0 100%);
    transform: rotate(-18deg);
}

/* Home hero */

.hero {
    min-height: 100svh;
    padding: calc(var(--header) + 18px) 28px 24px;
    position: relative;
    overflow: hidden;
    background: #050504;
}

.hero__media,
.hero__wash,
.hero__spotlight,
.hero__frame {
    position: absolute;
}

.hero__media {
    inset: calc(var(--header) + 18px) 28px 24px;
    background: url("../images/hero-stage.jpg") center 50% / cover no-repeat;
    transform: scale(1.04);
}

.hero__wash {
    inset: calc(var(--header) + 18px) 28px 24px;
    background:
        linear-gradient(90deg, rgba(7, 7, 6, .9) 0%, rgba(7, 7, 6, .24) 58%, rgba(7, 7, 6, .44) 100%),
        linear-gradient(0deg, rgba(7, 7, 6, .94) 0%, transparent 61%, rgba(7, 7, 6, .35) 100%);
}

.hero__frame {
    inset: calc(var(--header) + 18px) 28px 24px;
    z-index: 2;
    border: 1px solid rgba(255, 255, 255, .13);
    pointer-events: none;
}

.hero__frame::before,
.hero__frame::after {
    width: 42px;
    height: 1px;
    position: absolute;
    top: 50%;
    background: rgba(255, 255, 255, .25);
    content: "";
}

.hero__frame::before { left: -1px; }
.hero__frame::after { right: -1px; }

.hero__spotlight {
    width: 34vw;
    height: 95vh;
    z-index: 1;
    top: -15vh;
    left: 53vw;
    opacity: .11;
    background: linear-gradient(180deg, var(--gold-bright), transparent 78%);
    filter: blur(12px);
    clip-path: polygon(48% 0, 52% 0, 100% 100%, 0 100%);
    transform: rotate(-8deg);
    transform-origin: top center;
    animation: hero-light 9s var(--ease-smooth) infinite alternate;
}

@keyframes hero-light {
    to { transform: rotate(6deg); opacity: .17; }
}

.hero__content {
    display: flex;
    min-height: calc(100svh - var(--header) - 42px);
    padding: 7vh 3vw 6vh;
    position: relative;
    z-index: 3;
    flex-direction: column;
    justify-content: flex-end;
}

.hero__eyebrow {
    display: flex;
    width: 100%;
    max-width: 860px;
    margin-bottom: 18px;
    justify-content: space-between;
    color: rgba(233, 230, 223, .64);
    font-size: 8px;
    font-weight: 600;
    letter-spacing: .16em;
    text-transform: uppercase;
}

.hero__title,
.page-hero h1,
.service-hero h1 {
    max-width: 820px;
    margin: 0;
    font-size: clamp(46px, 5.6vw, 78px);
    letter-spacing: -.055em;
    line-height: .94;
}

.split-title .line {
    display: block;
    padding: 0 0 .04em;
    overflow: hidden;
}

.split-title .line > span {
    display: block;
    transform: translateY(110%);
    animation: title-in 1.05s .35s var(--ease-out) forwards;
}

.split-title .line:nth-child(2) > span {
    animation-delay: .48s;
}

.split-title .line--accent {
    padding-left: .06em;
    color: var(--gold-bright);
    font-family: var(--serif);
    font-style: italic;
    font-weight: 400;
    letter-spacing: -.03em;
}

@keyframes title-in {
    to { transform: translateY(0); }
}

.hero__footer {
    display: grid;
    max-width: 860px;
    margin-top: 30px;
    grid-template-columns: 1fr auto;
    align-items: end;
    gap: 48px;
}

.hero__footer p {
    max-width: 470px;
    margin: 0;
    color: rgba(233, 230, 223, .7);
    font-size: 13px;
    line-height: 1.75;
}

.hero__hud {
    display: flex;
    position: absolute;
    z-index: 4;
    align-items: center;
    color: rgba(233, 230, 223, .45);
    font-size: 7px;
    letter-spacing: .16em;
    text-transform: uppercase;
}

.hero__hud--left {
    top: 50%;
    left: 9px;
    flex-direction: column;
    gap: 4px;
}

.hero__hud--left strong {
    color: var(--gold);
    font-size: 8px;
    font-weight: 500;
}

.hero__hud--right {
    top: 50%;
    right: -25px;
    gap: 8px;
    transform: rotate(90deg);
}

.hero__hud--right i {
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: var(--gold-bright);
    box-shadow: 0 0 12px var(--gold);
}

.scroll-cue {
    display: flex;
    position: absolute;
    z-index: 4;
    right: 56px;
    bottom: 46px;
    align-items: center;
    gap: 12px;
    color: rgba(233, 230, 223, .48);
    font-size: 7px;
    letter-spacing: .16em;
    text-transform: uppercase;
}

.scroll-cue i {
    width: 42px;
    height: 1px;
    overflow: hidden;
    background: rgba(255, 255, 255, .14);
}

.scroll-cue i::after {
    display: block;
    width: 100%;
    height: 100%;
    background: var(--gold);
    content: "";
    animation: scroll-line 2.2s ease-in-out infinite;
    transform: translateX(-100%);
}

@keyframes scroll-line {
    60%, 100% { transform: translateX(100%); }
}

.marquee {
    position: relative;
    z-index: 2;
    overflow: hidden;
    border-top: 1px solid var(--line);
    border-bottom: 1px solid var(--line);
    background: #090908;
}

.marquee__track {
    display: flex;
    width: max-content;
    padding: 14px 0;
    align-items: center;
    animation: marquee 36s linear infinite;
}

.marquee span {
    padding: 0 30px;
    color: rgba(233, 230, 223, .54);
    font-size: 8px;
    font-weight: 600;
    letter-spacing: .18em;
    text-transform: uppercase;
}

.marquee i {
    color: var(--gold-dim);
    font-size: 5px;
    font-style: normal;
}

@keyframes marquee {
    to { transform: translateX(-50%); }
}

/* Introduction */

.intro-section {
    background:
        radial-gradient(circle at 80% 28%, rgba(201, 163, 91, .06), transparent 26%),
        var(--black);
}

.intro-grid {
    display: grid;
    grid-template-columns: .42fr 1.35fr .68fr;
    align-items: start;
    gap: 5vw;
}

.intro-statement h2 {
    max-width: 720px;
    margin: 0 0 28px;
    font-size: clamp(34px, 4vw, 56px);
}

.intro-copy,
.large-copy {
    max-width: 670px;
    color: var(--ivory-soft);
    font-size: clamp(15px, 1.35vw, 18px);
    line-height: 1.75;
}

.intro-statement .text-link {
    margin-top: 18px;
}

.production-card {
    padding: 20px;
    border: 1px solid var(--line);
    background: linear-gradient(145deg, rgba(255, 255, 255, .025), rgba(255, 255, 255, 0));
}

.production-card__head {
    display: flex;
    padding-bottom: 15px;
    align-items: center;
    justify-content: space-between;
    border-bottom: 1px solid var(--line);
    color: var(--muted);
    font-size: 7px;
    font-weight: 600;
    letter-spacing: .16em;
    text-transform: uppercase;
}

.production-card__head i {
    display: flex;
    align-items: center;
    gap: 6px;
    color: var(--gold);
    font-style: normal;
}

.production-card__head i::before {
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: var(--gold);
    content: "";
}

.production-card dl {
    margin: 14px 0 28px;
}

.production-card dl div {
    display: grid;
    padding: 11px 0;
    grid-template-columns: 74px 1fr;
    border-bottom: 1px solid var(--line-soft);
}

.production-card dt {
    color: var(--ivory);
    font-size: 9px;
}

.production-card dd {
    color: var(--muted);
    font-size: 8px;
}

.production-card > p {
    margin: 0;
    color: var(--ivory-soft);
    font-family: var(--display);
    font-size: 15px;
    line-height: 1.45;
}

/* Services */

.services-showcase {
    background: var(--black-soft);
}

.service-list {
    border-top: 1px solid var(--line);
}

.service-row {
    display: grid;
    min-height: 86px;
    padding: 15px 4.8vw;
    position: relative;
    z-index: 2;
    grid-template-columns: 54px minmax(240px, .9fr) minmax(270px, 1fr) 28px;
    align-items: center;
    gap: 2.5vw;
    border-bottom: 1px solid var(--line);
    transition: color .35s, padding .45s var(--ease-out);
}

.service-row::before {
    position: absolute;
    z-index: -1;
    inset: 0;
    background: var(--ivory);
    content: "";
    transform: scaleY(0);
    transform-origin: bottom;
    transition: transform .45s var(--ease-out);
}

.service-row:hover::before,
.service-row:focus-visible::before {
    transform: scaleY(1);
}

.service-row:hover,
.service-row:focus-visible {
    padding-right: 4.3vw;
    padding-left: 5.3vw;
    color: var(--black);
}

.service-row__number {
    color: var(--gold);
    font-size: 8px;
    letter-spacing: .12em;
}

.service-row:hover .service-row__number {
    color: var(--gold-dim);
}

.service-row__title {
    font-family: var(--display);
    font-size: clamp(19px, 2vw, 27px);
    font-weight: 500;
    letter-spacing: -.03em;
}

.service-row__copy {
    max-width: 540px;
    color: var(--muted);
    font-size: 11px;
    line-height: 1.55;
}

.service-row:hover .service-row__copy {
    color: rgba(7, 7, 6, .62);
}

.service-row__arrow {
    font-size: 16px;
    text-align: right;
    transition: transform .35s var(--ease-out);
}

.service-row:hover .service-row__arrow {
    transform: rotate(45deg);
}

.service-preview {
    width: min(20vw, 290px);
    aspect-ratio: 4 / 5;
    position: fixed;
    z-index: 30;
    top: 0;
    left: 0;
    overflow: hidden;
    pointer-events: none;
    border: 1px solid rgba(255, 255, 255, .2);
    opacity: 0;
    box-shadow: 0 28px 80px rgba(0, 0, 0, .5);
    transform: translate3d(var(--preview-x, 0), var(--preview-y, 0), 0) scale(.94);
    transition: opacity .2s, transform .38s var(--ease-out);
}

.service-preview.is-visible {
    opacity: 1;
    transform: translate3d(var(--preview-x, 0), var(--preview-y, 0), 0) scale(1);
}

.service-preview img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Cinematic control scene */

.cinematic-break {
    min-height: 72vh;
    position: relative;
    overflow: hidden;
    border-top: 1px solid var(--line);
    border-bottom: 1px solid var(--line);
}

.cinematic-break__media {
    position: absolute;
    inset: -7%;
    background: url("../images/technical-production.jpg") center 57% / cover no-repeat;
    filter: saturate(.58) contrast(1.08);
}

.cinematic-break__overlay {
    position: absolute;
    inset: 0;
    background:
        linear-gradient(90deg, rgba(7, 7, 6, .92), rgba(7, 7, 6, .22) 70%),
        linear-gradient(0deg, rgba(7, 7, 6, .86), transparent 68%);
}

.cinematic-break__content {
    display: flex;
    min-height: 72vh;
    padding: 72px 0;
    position: relative;
    z-index: 2;
    flex-direction: column;
    justify-content: flex-end;
}

.cinematic-break__hud {
    display: flex;
    width: 100%;
    padding-bottom: 13px;
    position: absolute;
    top: 30px;
    left: 0;
    justify-content: space-between;
    border-bottom: 1px solid var(--line);
    color: rgba(233, 230, 223, .42);
    font-size: 7px;
    letter-spacing: .15em;
}

.cinematic-break blockquote {
    max-width: 780px;
    margin: 0 0 44px;
    font-family: var(--display);
    font-size: clamp(34px, 4.1vw, 58px);
    font-weight: 500;
    letter-spacing: -.04em;
    line-height: 1.08;
}

.cinematic-stats {
    display: grid;
    max-width: 900px;
    padding-top: 22px;
    grid-template-columns: repeat(3, 1fr);
    gap: 28px;
    border-top: 1px solid var(--line);
}

.cinematic-stats div {
    display: grid;
    grid-template-columns: 54px 1fr;
    align-items: baseline;
    gap: 12px;
}

.cinematic-stats strong {
    color: var(--gold-bright);
    font-family: var(--display);
    font-size: 20px;
    font-weight: 500;
}

.cinematic-stats span {
    max-width: 140px;
    color: rgba(233, 230, 223, .6);
    font-size: 8px;
    letter-spacing: .1em;
    line-height: 1.5;
    text-transform: uppercase;
}

/* Process */

.process-section {
    background:
        radial-gradient(circle at 18% 54%, rgba(201, 163, 91, .05), transparent 26%),
        var(--black);
}

.process-heading {
    display: grid;
    margin: 42px 0 52px;
    grid-template-columns: 1.3fr .7fr;
    align-items: end;
    gap: 8vw;
}

.process-heading p {
    max-width: 380px;
    margin: 0;
    color: var(--muted);
    font-size: 12px;
}

.process-layout {
    display: grid;
    grid-template-columns: .72fr 1.28fr;
    align-items: stretch;
    gap: 4vw;
}

.process-visual {
    min-height: 470px;
    position: relative;
    overflow: hidden;
    border: 1px solid var(--line);
}

.process-visual::after {
    position: absolute;
    inset: 0;
    background:
        linear-gradient(180deg, transparent 52%, rgba(7, 7, 6, .88)),
        linear-gradient(90deg, rgba(7, 7, 6, .3), transparent);
    content: "";
}

.process-visual img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    filter: saturate(.58);
    transition: transform 1.2s var(--ease-out), filter .5s;
}

.process-visual:hover img {
    filter: saturate(.9);
    transform: scale(1.035);
}

.process-visual__overlay {
    display: grid;
    position: absolute;
    z-index: 2;
    right: 20px;
    bottom: 18px;
    left: 20px;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    gap: 12px;
    color: rgba(233, 230, 223, .62);
    font-size: 7px;
    letter-spacing: .14em;
    text-transform: uppercase;
}

.process-visual__overlay i {
    height: 1px;
    background: var(--line);
}

.process-list {
    display: flex;
    margin: 0;
    padding: 0;
    flex-direction: column;
    list-style: none;
    border-top: 1px solid var(--line);
}

.process-list li {
    display: grid;
    min-height: 118px;
    padding: 20px 0;
    grid-template-columns: 54px 1fr;
    align-items: center;
    border-bottom: 1px solid var(--line);
    transition: padding .35s var(--ease-out), background .35s;
}

.process-list li:hover {
    padding-right: 16px;
    padding-left: 16px;
    background: rgba(255, 255, 255, .018);
}

.process-list li > span {
    align-self: start;
    padding-top: 5px;
    color: var(--gold);
    font-size: 8px;
}

.process-list h3 {
    margin: 0 0 7px;
    font-size: 23px;
}

.process-list p {
    max-width: 620px;
    margin: 0;
    color: var(--muted);
    font-size: 11px;
}

/* Work */

.work-section {
    background: var(--black-soft);
}

.work-grid {
    display: grid;
    grid-template-columns: 1.08fr .92fr;
    gap: 62px 24px;
}

.work-card__media {
    aspect-ratio: 16 / 11;
    position: relative;
    overflow: hidden;
    border: 1px solid var(--line);
    background: var(--black-lift);
}

.work-card:nth-child(2) .work-card__media,
.work-card:nth-child(3) .work-card__media {
    aspect-ratio: 4 / 5;
}

.work-card:nth-child(3) {
    margin-top: -92px;
}

.work-card__media::before {
    position: absolute;
    z-index: 3;
    inset: 0;
    background: var(--black-soft);
    content: "";
    transform: scaleY(0);
    transform-origin: bottom;
    transition: transform .8s var(--ease-out);
}

.work-card:not(.is-revealed) .work-card__media::before {
    transform: scaleY(1);
}

.work-card__media::after {
    position: absolute;
    z-index: 2;
    inset: 0;
    background: linear-gradient(0deg, rgba(7, 7, 6, .5), transparent 48%);
    content: "";
}

.work-card__media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    filter: saturate(.68) contrast(1.04);
    transition: transform 1.2s var(--ease-out), filter .5s;
}

.work-card:hover .work-card__media img {
    filter: saturate(.95);
    transform: scale(1.035);
}

.work-card__media > span {
    padding: 7px 10px;
    position: absolute;
    z-index: 4;
    top: 14px;
    left: 14px;
    border: 1px solid rgba(255, 255, 255, .18);
    background: rgba(7, 7, 6, .52);
    font-size: 7px;
    letter-spacing: .14em;
    text-transform: uppercase;
    -webkit-backdrop-filter: blur(8px);
    backdrop-filter: blur(8px);
}

.work-card__body {
    display: grid;
    padding-top: 16px;
    grid-template-columns: 1fr .85fr;
    gap: 24px;
}

.work-card__body h3 {
    margin: 0;
    font-size: clamp(19px, 2vw, 27px);
}

.work-card__body p {
    margin: 0;
    color: var(--muted);
    font-size: 10px;
    line-height: 1.65;
}

:focus-visible {
    outline: 2px solid var(--v3-gold-hot);
    outline-offset: 3px;
}

/* Testimonials and FAQ */

.testimonial-section {
    overflow: hidden;
    background:
        radial-gradient(circle at 80% 15%, rgba(201, 163, 91, .075), transparent 24%),
        var(--black);
}

.testimonial-shell {
    min-height: 390px;
    padding: clamp(38px, 5vw, 66px);
    position: relative;
    overflow: hidden;
    border: 1px solid var(--line);
    background: rgba(255, 255, 255, .01);
}

.testimonial-shell::before {
    width: 360px;
    height: 360px;
    position: absolute;
    top: -220px;
    right: -70px;
    border: 1px solid var(--line-gold);
    border-radius: 50%;
    box-shadow: 0 0 0 54px rgba(201, 163, 91, .018), 0 0 0 108px rgba(201, 163, 91, .012);
    content: "";
}

.quote-mark {
    position: absolute;
    top: 18px;
    right: 5vw;
    color: var(--gold);
    font-family: var(--serif);
    font-size: 100px;
    line-height: 1;
    opacity: .26;
}

.testimonial {
    display: none;
    max-width: 880px;
    position: relative;
    z-index: 2;
}

.testimonial.is-active {
    display: block;
    animation: quote-in .65s var(--ease-out);
}

@keyframes quote-in {
    from { opacity: 0; transform: translateY(14px); filter: blur(4px); }
}

.testimonial blockquote {
    margin-bottom: 52px;
    font-family: var(--display);
    font-size: clamp(25px, 3vw, 40px);
    font-weight: 500;
    letter-spacing: -.035em;
    line-height: 1.28;
}

.testimonial figcaption {
    display: flex;
    flex-direction: column;
    font-size: 8px;
    letter-spacing: .12em;
    text-transform: uppercase;
}

.testimonial figcaption span {
    margin-top: 4px;
    color: var(--muted);
}

.slider-controls {
    display: flex;
    position: absolute;
    z-index: 4;
    right: clamp(30px, 5vw, 66px);
    bottom: clamp(30px, 5vw, 66px);
    align-items: center;
    gap: 12px;
}

.slider-controls button {
    display: grid;
    width: 36px;
    height: 36px;
    padding: 0;
    border: 1px solid var(--line);
    border-radius: 50%;
    background: transparent;
    place-items: center;
    transition: color .3s, border-color .3s;
}

.slider-controls button:hover {
    color: var(--gold-bright);
    border-color: var(--gold);
}

.slider-controls span {
    color: var(--muted);
    font-size: 8px;
    letter-spacing: .12em;
}

.faq-grid {
    display: grid;
    grid-template-columns: .62fr 1.38fr;
    gap: 8vw;
}

.accordion {
    border-top: 1px solid var(--line);
}

.accordion__item {
    border-bottom: 1px solid var(--line);
}

.accordion h3 {
    margin: 0;
}

.accordion button {
    display: flex;
    width: 100%;
    min-height: 76px;
    padding: 17px 0;
    align-items: center;
    justify-content: space-between;
    gap: 22px;
    border: 0;
    background: transparent;
    text-align: left;
}

.accordion button span {
    font-family: var(--display);
    font-size: 16px;
    letter-spacing: -.015em;
}

.accordion button i {
    width: 14px;
    height: 14px;
    position: relative;
    flex: 0 0 14px;
}

.accordion button i::before,
.accordion button i::after {
    width: 100%;
    height: 1px;
    position: absolute;
    top: 50%;
    background: var(--gold);
    content: "";
    transition: transform .35s var(--ease-out);
}

.accordion button i::after {
    transform: rotate(90deg);
}

.accordion button[aria-expanded="true"] i::after {
    transform: rotate(0);
}

.accordion__panel {
    padding: 0 48px 24px 0;
    color: var(--muted);
    font-size: 12px;
}

.accordion__panel p {
    max-width: 650px;
    margin: 0;
}

/* Internal page heroes */

.page-hero,
.service-hero {
    min-height: 78svh;
    padding: calc(var(--header) + 16px) 28px 24px;
    position: relative;
    overflow: hidden;
    background: #050504;
}

.page-hero__media,
.page-hero__veil,
.service-hero__media,
.service-hero__veil {
    position: absolute;
    inset: calc(var(--header) + 16px) 28px 24px;
}

.page-hero__media,
.service-hero__media {
    background-position: center;
    background-size: cover;
    transform: scale(1.035);
}

.page-hero--about .page-hero__media {
    background-image: url("../images/auditorium.jpg");
    background-position: center 42%;
}

.page-hero--services .page-hero__media {
    background-image: url("../images/creative-lighting.jpg");
}

.page-hero--work .page-hero__media {
    background-image: url("../images/gala-dinner.jpg");
    background-position: center 63%;
}

.page-hero--contact .page-hero__media {
    background-image: url("../images/hero-stage.jpg");
    background-position: center 54%;
}

.page-hero__veil,
.service-hero__veil {
    background:
        linear-gradient(90deg, rgba(7, 7, 6, .92), rgba(7, 7, 6, .2) 76%),
        linear-gradient(0deg, rgba(7, 7, 6, .92), transparent 65%);
}

.page-hero__veil::after,
.service-hero__veil::after {
    position: absolute;
    inset: 0;
    border: 1px solid rgba(255, 255, 255, .12);
    content: "";
}

.page-hero__content,
.service-hero__content {
    display: flex;
    min-height: calc(78svh - var(--header) - 40px);
    padding: 8vh 3vw 6vh;
    position: relative;
    z-index: 2;
    flex-direction: column;
    justify-content: flex-end;
}

.page-hero h1,
.service-hero h1 {
    max-width: 780px;
    font-size: clamp(42px, 5vw, 66px);
}

.page-hero__intro,
.service-hero__intro {
    max-width: 560px;
    margin: 30px 0 0 auto;
    color: rgba(233, 230, 223, .68);
    font-size: 13px;
    line-height: 1.75;
}

/* About */

.about-story__grid {
    display: grid;
    grid-template-columns: .4fr 1.6fr;
    gap: 6vw;
}

.about-story__copy h2 {
    max-width: 850px;
    margin-bottom: 30px;
    font-size: clamp(32px, 3.7vw, 52px);
}

.split-image-section {
    display: grid;
    min-height: 74vh;
    grid-template-columns: 1fr 1fr;
    border-top: 1px solid var(--line);
    border-bottom: 1px solid var(--line);
    background: var(--black-soft);
}

.split-image-section__image {
    overflow: hidden;
    border-right: 1px solid var(--line);
}

.split-image-section__image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    filter: saturate(.65);
}

.split-image-section__content {
    display: flex;
    padding: clamp(50px, 7vw, 100px);
    flex-direction: column;
    justify-content: center;
}

.split-image-section__content h2 {
    margin-bottom: 26px;
    font-size: clamp(32px, 3.8vw, 50px);
}

.split-image-section__content > p:not(.eyebrow) {
    color: var(--muted);
    font-size: 13px;
}

.split-points {
    display: grid;
    margin-top: 35px;
    grid-template-columns: 1fr 1fr;
}

.split-points span {
    padding: 13px 0;
    border-top: 1px solid var(--line);
    color: var(--ivory-soft);
    font-size: 9px;
}

.split-points span:nth-child(odd) {
    margin-right: 20px;
}

.values-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    border-top: 1px solid var(--line);
}

.value-card {
    min-height: 260px;
    padding: 23px;
    border-right: 1px solid var(--line);
    background: rgba(255, 255, 255, .008);
    transition: background .3s;
}

.value-card:hover {
    background: rgba(255, 255, 255, .025);
}

.value-card:first-child {
    padding-left: 0;
}

.value-card:last-child {
    border-right: 0;
}

.value-card > span {
    color: var(--gold);
    font-size: 8px;
}

.value-card h3 {
    margin: 78px 0 13px;
    font-size: 23px;
}

.value-card p {
    color: var(--muted);
    font-size: 11px;
}

.manifesto-section {
    padding-top: 0;
}

.manifesto-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
}

.manifesto-card {
    min-height: 390px;
    padding: clamp(38px, 5vw, 68px);
    border: 1px solid var(--line);
    background: var(--black-soft);
}

.manifesto-card h2 {
    max-width: 620px;
    font-size: clamp(27px, 3vw, 40px);
    line-height: 1.22;
}

.manifesto-card--gold {
    color: var(--black);
    border-color: var(--gold);
    background: var(--gold-bright);
}

.manifesto-card--gold .eyebrow {
    color: var(--gold-dim);
}

/* Services collection */

.services-index__intro {
    display: grid;
    margin-bottom: 60px;
    grid-template-columns: .4fr 1.6fr;
    gap: 5vw;
}

.service-card-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 56px 24px;
}

.service-card__media {
    aspect-ratio: 16 / 10;
    position: relative;
    overflow: hidden;
    border: 1px solid var(--line);
}

.service-card__media::after {
    position: absolute;
    inset: 0;
    background: linear-gradient(0deg, rgba(7, 7, 6, .52), transparent 50%);
    content: "";
}

.service-card__media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    filter: saturate(.64);
    transition: transform 1s var(--ease-out), filter .5s;
}

.service-card:hover .service-card__media img {
    filter: saturate(.94);
    transform: scale(1.035);
}

.service-card__media > span {
    display: grid;
    width: 36px;
    height: 36px;
    position: absolute;
    z-index: 2;
    top: 14px;
    left: 14px;
    border: 1px solid rgba(255, 255, 255, .25);
    border-radius: 50%;
    background: rgba(7, 7, 6, .38);
    font-size: 8px;
    place-items: center;
    -webkit-backdrop-filter: blur(7px);
    backdrop-filter: blur(7px);
}

.service-card__body {
    padding-top: 17px;
}

.service-card__body h2 {
    margin-bottom: 11px;
    font-size: clamp(22px, 2.4vw, 32px);
}

.service-card__body p {
    max-width: 560px;
    margin-bottom: 11px;
    color: var(--muted);
    font-size: 11px;
}

.service-card__body .text-link {
    margin-top: 4px;
}

.service-promise {
    margin-top: 78px;
    border-top: 1px solid var(--line-gold);
    border-bottom: 1px solid var(--line-gold);
    background: linear-gradient(135deg, #15130f, #0b0b09);
}

.promise-grid {
    display: grid;
    grid-template-columns: 1.2fr .8fr;
    align-items: end;
    gap: 8vw;
}

.promise-grid h2 {
    margin: 0;
    font-size: clamp(32px, 3.7vw, 50px);
}

.promise-grid p {
    margin: 0;
    color: var(--muted);
    font-size: 12px;
}

/* Service detail */

.service-hero__media {
    background-image: var(--service-image);
}

.service-hero__meta {
    display: flex;
    margin-bottom: 18px;
    align-items: center;
    gap: 12px;
    color: var(--muted);
    font-size: 8px;
    letter-spacing: .14em;
    text-transform: uppercase;
}

.service-hero__meta span {
    display: grid;
    width: 36px;
    height: 36px;
    border: 1px solid var(--line-gold);
    border-radius: 50%;
    color: var(--gold);
    place-items: center;
}

.service-hero__meta p {
    margin: 0;
}

.service-detail__grid {
    display: grid;
    grid-template-columns: .58fr 1.42fr;
    gap: 9vw;
}

.service-detail__aside {
    align-self: start;
    position: sticky;
    top: 92px;
}

.service-detail__aside > p:not(.eyebrow) {
    max-width: 350px;
    color: var(--muted);
    font-size: 12px;
}

.service-detail__aside .button {
    margin-top: 16px;
}

.service-detail__main .large-copy {
    max-width: 830px;
    margin-bottom: 66px;
    color: var(--ivory);
    font-family: var(--display);
    font-size: clamp(21px, 2.3vw, 32px);
    letter-spacing: -.02em;
    line-height: 1.45;
}

.deliverables ul {
    margin: 0;
    padding: 0;
    border-top: 1px solid var(--line);
    list-style: none;
}

.deliverables li {
    display: grid;
    min-height: 61px;
    padding: 14px 0;
    grid-template-columns: 54px 1fr;
    align-items: center;
    border-bottom: 1px solid var(--line);
    font-family: var(--display);
    font-size: 15px;
    letter-spacing: -.01em;
}

.deliverables li span {
    color: var(--gold);
    font-family: var(--body);
    font-size: 7px;
}

.service-next {
    min-height: 54vh;
    position: relative;
    overflow: hidden;
    border-top: 1px solid var(--line);
}

.service-next > a,
.service-next__content {
    min-height: 54vh;
}

.service-next__media,
.service-next__veil {
    position: absolute;
    inset: 0;
}

.service-next__media {
    background-position: center;
    background-size: cover;
    filter: saturate(.55);
    transition: transform 1.1s var(--ease-out), filter .5s;
}

.service-next:hover .service-next__media {
    filter: saturate(.85);
    transform: scale(1.035);
}

.service-next__veil {
    background: linear-gradient(90deg, rgba(7, 7, 6, .91), rgba(7, 7, 6, .22));
}

.service-next__content {
    display: flex;
    padding: 70px 0;
    position: relative;
    z-index: 2;
    flex-direction: column;
    justify-content: center;
}

.service-next h2 {
    max-width: 850px;
    margin-bottom: 28px;
    font-size: clamp(35px, 4.5vw, 62px);
}

.service-next__content > span {
    display: flex;
    align-items: center;
    gap: 14px;
    font-size: 8px;
    font-weight: 600;
    letter-spacing: .14em;
    text-transform: uppercase;
}

.service-next__content i {
    font-size: 15px;
    font-style: normal;
}

/* Portfolio page */

.portfolio-intro {
    display: grid;
    margin-bottom: 70px;
    grid-template-columns: .4fr 1.6fr;
    gap: 7vw;
}

.portfolio-list {
    display: flex;
    flex-direction: column;
    gap: clamp(72px, 9vw, 120px);
}

.portfolio-item {
    display: grid;
    grid-template-columns: 1.22fr .78fr;
    align-items: center;
    gap: 6vw;
}

.portfolio-item:nth-child(even) {
    grid-template-columns: .78fr 1.22fr;
}

.portfolio-item:nth-child(even) .portfolio-item__media {
    grid-column: 2;
}

.portfolio-item:nth-child(even) .portfolio-item__body {
    grid-row: 1;
    grid-column: 1;
}

.portfolio-item__media {
    aspect-ratio: 16 / 10;
    position: relative;
    overflow: hidden;
    border: 1px solid var(--line);
}

.portfolio-item__media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    filter: saturate(.66);
    transition: transform 1.1s var(--ease-out), filter .5s;
}

.portfolio-item:hover img {
    filter: saturate(.9);
    transform: scale(1.03);
}

.portfolio-item__number {
    display: grid;
    width: 36px;
    height: 36px;
    position: absolute;
    top: 14px;
    left: 14px;
    border: 1px solid rgba(255, 255, 255, .26);
    border-radius: 50%;
    background: rgba(7, 7, 6, .42);
    font-size: 8px;
    place-items: center;
}

.portfolio-item__body h2 {
    margin-bottom: 18px;
    font-size: clamp(29px, 3.3vw, 46px);
}

.portfolio-item__body > p:not(.eyebrow) {
    color: var(--muted);
    font-size: 12px;
}

.portfolio-item__body ul {
    display: flex;
    margin: 24px 0 0;
    padding: 0;
    flex-wrap: wrap;
    gap: 6px;
    list-style: none;
}

.portfolio-item__body li {
    padding: 6px 9px;
    border: 1px solid var(--line);
    color: var(--muted);
    font-size: 7px;
    letter-spacing: .1em;
    text-transform: uppercase;
}

/* Contact */

.contact-grid {
    display: grid;
    grid-template-columns: .6fr 1.4fr;
    gap: 7vw;
}

.contact-aside {
    align-self: start;
    position: sticky;
    top: 92px;
}

.contact-aside h2 {
    margin-bottom: 36px;
    font-size: clamp(29px, 3.5vw, 46px);
}

.contact-lines {
    border-top: 1px solid var(--line);
}

.contact-lines > div {
    display: grid;
    padding: 13px 0;
    grid-template-columns: 72px 1fr;
    border-bottom: 1px solid var(--line);
}

.contact-lines span {
    color: var(--gold);
    font-size: 7px;
    letter-spacing: .13em;
    text-transform: uppercase;
}

.contact-lines p {
    margin: 0;
}

.contact-lines a,
.contact-lines p {
    color: var(--muted);
    font-size: 11px;
}

.contact-response {
    margin-top: 20px;
    color: var(--muted);
    font-size: 9px;
}

.enquiry-panel {
    padding: clamp(30px, 4.5vw, 58px);
    border: 1px solid var(--line);
    background: var(--black-soft);
}

.form-heading {
    display: flex;
    margin-bottom: 36px;
    align-items: center;
    justify-content: space-between;
}

.form-heading span {
    font-family: var(--display);
    font-size: 20px;
}

.form-heading p {
    margin: 0;
    color: var(--muted);
    font-size: 8px;
}

.enquiry-form {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 28px 22px;
}

.field {
    position: relative;
}

.field--wide {
    grid-column: 1 / -1;
}

.field label {
    display: block;
    margin-bottom: 8px;
    color: var(--muted);
    font-size: 7px;
    font-weight: 600;
    letter-spacing: .13em;
    text-transform: uppercase;
}

.field input,
.field select,
.field textarea {
    width: 100%;
    padding: 10px 0;
    border: 0;
    border-bottom: 1px solid var(--line);
    border-radius: 0;
    outline: 0;
    background: transparent;
    font-size: 12px;
    transition: border-color .25s;
}

.field textarea {
    min-height: 112px;
    resize: vertical;
}

.field select {
    color-scheme: dark;
}

.field input:focus,
.field select:focus,
.field textarea:focus {
    border-color: var(--gold);
}

.field input::placeholder,
.field textarea::placeholder {
    color: #4f4c46;
}

.form-submit {
    display: flex;
    margin-top: 8px;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
}

.form-submit p {
    max-width: 250px;
    margin: 0;
    color: var(--muted);
    font-size: 8px;
}

.form-submit p a {
    color: var(--ivory);
    text-decoration: underline;
}

.honeypot {
    position: absolute;
    left: -9999px;
}

.form-errors {
    margin-bottom: 26px;
    padding: 14px;
    border: 1px solid rgba(255, 121, 121, .35);
    color: #ffb0b0;
    background: rgba(130, 30, 30, .1);
    font-size: 11px;
}

.form-errors ul {
    margin-bottom: 0;
}

.form-success {
    display: flex;
    min-height: 380px;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
}

.form-success > span {
    display: grid;
    width: 46px;
    height: 46px;
    margin-bottom: 25px;
    border: 1px solid var(--gold);
    border-radius: 50%;
    color: var(--gold);
    place-items: center;
}

.form-success h2 {
    margin-bottom: 14px;
    font-size: clamp(30px, 3.8vw, 48px);
}

.form-success p {
    max-width: 500px;
    color: var(--muted);
}

.form-success .text-link {
    margin-top: 20px;
}

/* Legal and error */

.legal-hero {
    padding: calc(var(--header) + 90px) 0 70px;
    border-bottom: 1px solid var(--line);
    background: var(--black-soft);
}

.legal-hero h1 {
    margin: 0;
    font-size: clamp(38px, 5vw, 64px);
}

.legal-grid {
    display: grid;
    grid-template-columns: .4fr 1.6fr;
    gap: 7vw;
}

.legal-grid aside {
    color: var(--muted);
    font-size: 10px;
}

.legal-grid article {
    max-width: 780px;
}

.legal-grid h2 {
    margin: 42px 0 13px;
    font-size: 21px;
}

.legal-grid h2:first-child {
    margin-top: 0;
}

.legal-grid p {
    color: var(--ivory-soft);
    font-size: 12px;
}

.legal-grid a {
    color: var(--gold);
    text-decoration: underline;
}

.error-page {
    display: flex;
    min-height: 82vh;
    padding: calc(var(--header) + 70px) 0 80px;
    align-items: center;
    background:
        linear-gradient(90deg, rgba(7, 7, 6, .93), rgba(7, 7, 6, .46)),
        url("../images/hero-stage.jpg") center / cover;
}

.error-page h1 {
    margin-bottom: 24px;
    font-size: clamp(42px, 6vw, 76px);
}

.error-page p:not(.eyebrow) {
    margin-bottom: 26px;
    color: var(--muted);
}

/* Closing and footer */

.closing-scene {
    min-height: 64vh;
    overflow: hidden;
    border-top: 1px solid var(--line);
}

.closing-scene__image {
    position: absolute;
    inset: 0;
    background: url("../images/hero-stage.jpg") center 58% / cover;
    filter: saturate(.5) contrast(1.05);
}

.closing-scene::after {
    position: absolute;
    inset: 0;
    background:
        linear-gradient(90deg, rgba(7, 7, 6, .92), rgba(7, 7, 6, .28)),
        linear-gradient(0deg, rgba(7, 7, 6, .83), transparent 65%);
    content: "";
}

.closing-scene__beam {
    width: 38vw;
    height: 85vh;
    position: absolute;
    z-index: 1;
    top: -18vh;
    right: 2vw;
    opacity: .11;
    background: linear-gradient(180deg, var(--gold-bright), transparent);
    filter: blur(9px);
    clip-path: polygon(48% 0, 52% 0, 100% 100%, 0 100%);
    transform: rotate(-12deg);
}

.closing-scene__content {
    display: flex;
    min-height: 64vh;
    padding: 74px 0;
    position: relative;
    z-index: 2;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
}

.closing-scene h2 {
    max-width: 850px;
    margin-bottom: 32px;
    font-size: clamp(38px, 5vw, 66px);
}

.site-footer {
    padding: 68px 0 24px;
    border-top: 1px solid var(--line);
    background: #050504;
}

.footer-grid {
    display: grid;
    padding-bottom: 58px;
    grid-template-columns: 1.25fr .55fr .8fr 1fr;
    gap: 4vw;
}

.footer-brand img {
    width: 180px;
    margin-bottom: 18px;
}

.footer-brand p {
    max-width: 290px;
    color: var(--muted);
    font-size: 10px;
}

.footer-column {
    display: flex;
    align-items: flex-start;
    flex-direction: column;
    gap: 8px;
}

.footer-label {
    margin-bottom: 10px;
    color: var(--gold);
    font-size: 7px;
    font-weight: 600;
    letter-spacing: .16em;
    text-transform: uppercase;
}

.footer-column a,
.footer-column > p:not(.footer-label) {
    margin: 0;
    color: var(--muted);
    font-size: 10px;
    transition: color .2s;
}

.footer-column a:hover {
    color: var(--ivory);
}

.footer-bottom {
    display: grid;
    padding-top: 18px;
    grid-template-columns: 1fr 1fr 1fr;
    border-top: 1px solid var(--line);
    color: #5c5952;
    font-size: 7px;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.footer-bottom p {
    margin: 0;
}

.footer-bottom > div {
    display: flex;
    justify-content: center;
    gap: 18px;
}

.footer-signoff {
    text-align: right;
}

.whatsapp-float {
    display: grid;
    width: 44px;
    height: 44px;
    position: fixed;
    z-index: 300;
    right: 18px;
    bottom: 18px;
    border: 1px solid var(--line-gold);
    border-radius: 50%;
    color: var(--black);
    background: var(--gold-bright);
    box-shadow: 0 14px 35px rgba(0, 0, 0, .38);
    place-items: center;
    transition: transform .35s var(--ease-out);
}

.whatsapp-float:hover {
    transform: scale(1.08);
}

.whatsapp-float span {
    font-size: 7px;
    font-weight: 700;
    letter-spacing: .08em;
}

/* Motion */

.js .reveal {
    opacity: 0;
    filter: blur(5px);
    transform: translateY(22px);
    clip-path: inset(0 0 10% 0);
    transition:
        opacity .85s var(--ease-out),
        transform .85s var(--ease-out),
        filter .85s var(--ease-out),
        clip-path .85s var(--ease-out);
}

.js .reveal.is-revealed {
    opacity: 1;
    filter: blur(0);
    transform: translateY(0);
    clip-path: inset(0 0 0 0);
}

/* Responsive */

@media (max-width: 1080px) {
    :root {
        --container: min(90vw, 960px);
    }

    .site-header {
        padding-inline: 5vw;
        grid-template-columns: 1fr auto;
    }

    .desktop-nav,
    .header-cta {
        display: none;
    }

    .menu-toggle {
        display: block;
    }

    .intro-grid {
        grid-template-columns: .42fr 1.58fr;
    }

    .production-card {
        grid-column: 2;
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 20px;
    }

    .production-card__head {
        grid-column: 1 / -1;
    }

    .production-card dl {
        margin: 0;
    }

    .production-card > p {
        align-self: end;
    }

    .service-row {
        grid-template-columns: 44px 1fr 1fr 24px;
    }

    .footer-grid {
        grid-template-columns: 1.2fr .7fr .9fr;
    }

    .footer-contact {
        grid-column: 2 / -1;
    }
}

@media (max-width: 760px) {
    :root {
        --header: 68px;
        --container: 88vw;
    }

    body {
        font-size: 14px;
    }

    body::before {
        background-image: linear-gradient(90deg, transparent calc(50% - .5px), var(--line-soft) 50%, transparent calc(50% + .5px));
    }

    .section {
        padding: 68px 0;
    }

    .brand {
        width: 145px;
    }

    .site-header {
        height: var(--header);
        padding: 0 6vw;
    }

    .site-header.is-scrolled {
        height: 60px;
    }

    .pointer-glow,
    .service-preview,
    .hero__hud,
    .scroll-cue {
        display: none;
    }

    .site-loader__frame {
        padding: 17px;
    }

    .site-loader__meta {
        grid-template-columns: 1fr auto;
    }

    .site-loader__meta > span:nth-child(2) {
        display: none;
    }

    .site-loader__meta strong {
        font-size: 12px;
    }

    .site-loader__footer {
        grid-template-columns: 1fr;
        gap: 10px;
    }

    .site-loader__footer > span:last-child {
        display: none;
    }

    .site-loader__mark img {
        width: 154px;
    }

    .site-loader__beam {
        width: 78vw;
    }

    .hero {
        min-height: 100svh;
        padding: var(--header) 10px 10px;
    }

    .hero__media,
    .hero__wash,
    .hero__frame {
        inset: var(--header) 10px 10px;
    }

    .hero__media {
        background-position: 61% center;
    }

    .hero__content {
        min-height: calc(100svh - var(--header) - 10px);
        padding: 90px 4vw 7vh;
    }

    .hero__eyebrow {
        margin-bottom: 15px;
    }

    .hero__eyebrow span:last-child {
        display: none;
    }

    .hero__title {
        max-width: 100%;
        font-size: clamp(39px, 12.5vw, 51px);
        line-height: .98;
    }

    .hero__footer {
        margin-top: 24px;
        grid-template-columns: 1fr;
        gap: 22px;
    }

    .hero__footer p {
        max-width: 340px;
        font-size: 12px;
    }

    .hero__footer .button {
        justify-self: start;
    }

    .marquee__track {
        padding: 12px 0;
    }

    .marquee span {
        padding: 0 22px;
    }

    .section-heading {
        margin-bottom: 38px;
        align-items: flex-start;
        flex-direction: column;
    }

    .section-heading h2,
    .process-heading h2,
    .faq-grid h2 {
        font-size: clamp(28px, 9.5vw, 39px);
    }

    .intro-grid,
    .about-story__grid,
    .services-index__intro,
    .portfolio-intro {
        grid-template-columns: 1fr;
        gap: 30px;
    }

    .intro-statement h2 {
        font-size: clamp(29px, 9.5vw, 40px);
    }

    .intro-copy,
    .large-copy {
        font-size: 15px;
    }

    .production-card {
        grid-column: auto;
        display: block;
    }

    .production-card dl {
        margin: 14px 0 25px;
    }

    .service-row {
        min-height: 70px;
        padding: 13px 6vw;
        grid-template-columns: 36px 1fr 18px;
        gap: 10px;
    }

    .service-row:hover {
        padding-right: 6vw;
        padding-left: 6vw;
    }

    .service-row__copy {
        display: none;
    }

    .service-row__title {
        font-size: 17px;
        line-height: 1.2;
    }

    .service-row__arrow {
        font-size: 13px;
    }

    .cinematic-break,
    .cinematic-break__content {
        min-height: 66vh;
    }

    .cinematic-break__content {
        padding: 64px 0 46px;
    }

    .cinematic-break__hud {
        font-size: 6px;
    }

    .cinematic-break__hud span:last-child {
        display: none;
    }

    .cinematic-break blockquote {
        margin-bottom: 34px;
        font-size: 31px;
    }

    .cinematic-stats {
        grid-template-columns: 1fr;
        gap: 13px;
    }

    .cinematic-stats div {
        grid-template-columns: 42px 1fr;
    }

    .process-heading {
        margin: 34px 0 40px;
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .process-layout {
        grid-template-columns: 1fr;
        gap: 30px;
    }

    .process-visual {
        min-height: 360px;
    }

    .process-list li {
        min-height: 104px;
        grid-template-columns: 40px 1fr;
    }

    .work-grid,
    .service-card-grid {
        grid-template-columns: 1fr;
        gap: 48px;
    }

    .work-card:nth-child(3) {
        margin-top: 0;
    }

    .work-card__media,
    .work-card:nth-child(2) .work-card__media,
    .work-card:nth-child(3) .work-card__media {
        aspect-ratio: 4 / 3;
    }

    .work-card__body {
        grid-template-columns: 1fr;
        gap: 8px;
    }

    .testimonial-shell {
        min-height: 430px;
        padding: 34px 24px;
    }

    .testimonial blockquote {
        margin-bottom: 36px;
        font-size: 24px;
    }

    .quote-mark {
        right: 18px;
        font-size: 72px;
    }

    .slider-controls {
        right: 24px;
        bottom: 28px;
    }

    .faq-grid {
        grid-template-columns: 1fr;
        gap: 34px;
    }

    .accordion button {
        min-height: 68px;
    }

    .accordion__panel {
        padding-right: 12px;
    }

    .page-hero,
    .service-hero {
        min-height: 72svh;
        padding: var(--header) 10px 10px;
    }

    .page-hero__media,
    .page-hero__veil,
    .service-hero__media,
    .service-hero__veil {
        inset: var(--header) 10px 10px;
    }

    .page-hero__content,
    .service-hero__content {
        min-height: calc(72svh - var(--header) - 10px);
        padding: 86px 4vw 44px;
    }

    .page-hero h1,
    .service-hero h1 {
        font-size: clamp(35px, 11vw, 48px);
        line-height: 1;
    }

    .page-hero__intro,
    .service-hero__intro {
        margin: 23px 0 0;
        font-size: 12px;
    }

    .split-image-section {
        grid-template-columns: 1fr;
    }

    .split-image-section__image {
        height: 58vh;
        border-right: 0;
        border-bottom: 1px solid var(--line);
    }

    .split-image-section__content {
        padding: 58px 6vw;
    }

    .split-image-section__content h2 {
        font-size: 32px;
    }

    .values-grid {
        grid-template-columns: 1fr;
    }

    .value-card,
    .value-card:first-child {
        min-height: 0;
        padding: 22px 0 26px;
        border-right: 0;
        border-bottom: 1px solid var(--line);
    }

    .value-card h3 {
        margin-top: 35px;
    }

    .manifesto-grid {
        grid-template-columns: 1fr;
    }

    .manifesto-card {
        min-height: 310px;
        padding: 36px 27px;
    }

    .service-card__media {
        aspect-ratio: 4 / 3;
    }

    .service-promise {
        margin-top: 0;
    }

    .promise-grid,
    .service-detail__grid {
        grid-template-columns: 1fr;
        gap: 38px;
    }

    .promise-grid h2 {
        font-size: 32px;
    }

    .service-detail__aside,
    .contact-aside {
        position: static;
    }

    .service-detail__main .large-copy {
        margin-bottom: 48px;
        font-size: 21px;
    }

    .deliverables li {
        grid-template-columns: 38px 1fr;
        font-size: 14px;
    }

    .service-next,
    .service-next > a,
    .service-next__content {
        min-height: 48vh;
    }

    .portfolio-item,
    .portfolio-item:nth-child(even) {
        grid-template-columns: 1fr;
        gap: 24px;
    }

    .portfolio-item:nth-child(even) .portfolio-item__media,
    .portfolio-item:nth-child(even) .portfolio-item__body {
        grid-row: auto;
        grid-column: auto;
    }

    .portfolio-item__media {
        aspect-ratio: 4 / 3;
    }

    .contact-grid {
        grid-template-columns: 1fr;
        gap: 46px;
    }

    .enquiry-panel {
        width: 100vw;
        margin-left: -6vw;
        padding: 36px 6vw;
        border-right: 0;
        border-left: 0;
    }

    .enquiry-form {
        grid-template-columns: 1fr;
    }

    .field--wide {
        grid-column: auto;
    }

    .form-heading,
    .form-submit {
        align-items: flex-start;
        flex-direction: column;
    }

    .legal-grid {
        grid-template-columns: 1fr;
    }

    .legal-hero {
        padding-top: 132px;
    }

    .closing-scene,
    .closing-scene__content {
        min-height: 56vh;
    }

    .closing-scene h2 {
        font-size: clamp(34px, 10.5vw, 45px);
    }

    .footer-grid {
        padding-bottom: 42px;
        grid-template-columns: 1fr 1fr;
        gap: 36px 20px;
    }

    .footer-brand,
    .footer-contact {
        grid-column: 1 / -1;
    }

    .footer-bottom {
        grid-template-columns: 1fr;
        gap: 13px;
    }

    .footer-bottom > div {
        justify-content: flex-start;
    }

    .footer-signoff {
        text-align: left;
    }
}

@media (max-width: 380px) {
    .hero__title {
        font-size: 37px;
    }

    .mobile-menu nav a {
        font-size: 27px;
    }

    .mobile-menu__footer {
        align-items: flex-start;
        flex-direction: column;
        gap: 5px;
    }
}

@media (prefers-reduced-motion: reduce) {
    html {
        scroll-behavior: auto;
    }

    *,
    *::before,
    *::after {
        scroll-behavior: auto !important;
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .01ms !important;
    }

    .js .reveal {
        opacity: 1;
        filter: none;
        transform: none;
        clip-path: none;
    }

    .pointer-glow {
        display: none;
    }
}

@media (hover: none) {
    .pointer-glow,
    .service-preview {
        display: none;
    }
}

/* =====================================================
   GOLDEN STAGE V3 — CINEMATIC PRODUCTION HOUSE
   ===================================================== */

:root {
    --v3-black: #040403;
    --v3-carbon: #090908;
    --v3-panel: #11110f;
    --v3-ivory: #f4f1e9;
    --v3-muted: #aaa69c;
    --v3-gold: #e4bc68;
    --v3-gold-hot: #ffda83;
    --v3-gold-dim: #947338;
    --v3-line: rgba(244, 241, 233, .14);
    --v3-line-hot: rgba(228, 188, 104, .44);
    --v3-mono: "IBM Plex Mono", monospace;
    --display: "Manrope", "Helvetica Neue", Arial, sans-serif;
    --serif: "Manrope", "Helvetica Neue", Arial, sans-serif;
    --font-display: "Manrope", "Helvetica Neue", Arial, sans-serif;
    --font-body: "Manrope", "Helvetica Neue", Arial, sans-serif;
    --header-h: 84px;
    --container: min(90vw, 1380px);
    --ease: cubic-bezier(.22, 1, .36, 1);
    --ease-cinematic: cubic-bezier(.76, 0, .24, 1);
}

html {
    background: var(--v3-black);
}

body {
    background:
        radial-gradient(circle at var(--pointer-x, 50%) var(--pointer-y, 22%), rgba(228, 188, 104, .045), transparent 30vw),
        var(--v3-black);
    color: var(--v3-ivory);
    font-family: var(--font-body);
    font-size: 15px;
    line-height: 1.65;
}

body::before {
    background-image:
        linear-gradient(rgba(255, 255, 255, .018) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, .018) 1px, transparent 1px);
    background-size: 78px 78px;
    mask-image: linear-gradient(to bottom, black, transparent 82%);
    opacity: .42;
}

h1,
h2,
h3,
.large-copy,
.testimonial blockquote,
.mobile-menu nav a {
    font-family: var(--font-display);
    font-weight: 500;
    letter-spacing: -.045em;
    line-height: 1.06;
}

h1 em,
h2 em,
blockquote em,
.line--accent {
    color: var(--v3-gold-hot);
    font-family: var(--font-display);
    font-style: normal;
    font-weight: 600;
}

.split-title .line--accent,
.split-title .line--accent > span {
    color: var(--v3-gold-hot);
    font-family: var(--font-display);
    font-style: normal;
    font-weight: 600;
}

.eyebrow {
    gap: 12px;
    margin-bottom: 18px;
    color: var(--v3-gold);
    font-family: var(--v3-mono);
    font-size: 10px;
    font-weight: 500;
    letter-spacing: .16em;
}

.eyebrow::before {
    width: 22px;
    background: var(--v3-gold);
    box-shadow: 0 0 10px rgba(228, 188, 104, .6);
}

.section {
    padding: clamp(92px, 9vw, 145px) 0;
}

.section-heading {
    margin-bottom: clamp(48px, 5.5vw, 78px);
}

.section-heading h2,
.process-heading h2,
.faq-grid h2 {
    max-width: 850px;
    font-size: clamp(38px, 4vw, 58px);
    letter-spacing: -.05em;
}

.section-index {
    font-family: var(--v3-mono);
    font-size: 10px;
}

.section-index span {
    border-color: var(--v3-line);
    background: rgba(255, 255, 255, .018);
}

.button {
    min-height: 54px;
    padding: 0 22px;
    border-color: var(--v3-line);
    border-radius: 12px;
    font-family: var(--v3-mono);
    font-size: 10px;
    font-weight: 500;
    letter-spacing: .1em;
}

.button::before {
    border-radius: 10px;
    background: var(--v3-gold-hot);
}

.button__arrow {
    display: grid;
    width: 25px;
    height: 25px;
    border: 1px solid currentColor;
    border-radius: 50%;
    place-items: center;
    transition: transform .45s var(--ease);
}

.button:hover .button__arrow {
    transform: rotate(45deg);
}

.button--light {
    color: #0a0907;
    background: var(--v3-ivory);
    box-shadow: 0 12px 48px rgba(0, 0, 0, .22);
}

.text-link {
    font-family: var(--v3-mono);
    font-size: 10px;
    letter-spacing: .11em;
}

/* V3 opening sequence */

.site-loader--v3 {
    display: block;
    z-index: 20000;
    overflow: hidden;
    background: #000;
    opacity: 1;
    visibility: visible;
}

.site-loader--v3::before,
.site-loader--v3::after {
    display: none;
}

.site-loader__reel {
    width: min(53vw, 780px);
    height: min(62vh, 650px);
    position: absolute;
    z-index: 9;
    inset: 50% auto auto 50%;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, .15);
    background: #050505;
    transform: translate(-50%, -50%);
    box-shadow: 0 0 0 1px rgba(228, 188, 104, .08), 0 45px 120px rgba(0, 0, 0, .7);
    transition: transform 1.25s var(--ease-cinematic), opacity .75s;
}

.site-loader__shot {
    margin: 0;
    position: absolute;
    inset: 0;
    opacity: 0;
    clip-path: inset(100% 0 0);
    transform: scale(1.12);
    transition:
        opacity .22s linear,
        clip-path .75s var(--ease-cinematic),
        transform 1.4s var(--ease);
}

.site-loader__shot.is-active {
    z-index: 2;
    opacity: 1;
    clip-path: inset(0);
    transform: scale(1.02);
}

.site-loader__shot::after {
    position: absolute;
    inset: 0;
    background:
        linear-gradient(180deg, rgba(0, 0, 0, .06), rgba(0, 0, 0, .58)),
        linear-gradient(90deg, rgba(0, 0, 0, .35), transparent 50%, rgba(0, 0, 0, .18));
    content: "";
}

.site-loader__shot img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    filter: saturate(.72) contrast(1.1);
}

.site-loader__shot figcaption {
    display: flex;
    z-index: 3;
    right: 20px;
    bottom: 17px;
    left: 20px;
    position: absolute;
    align-items: center;
    justify-content: space-between;
    color: rgba(255, 255, 255, .72);
    font-family: var(--v3-mono);
    font-size: 9px;
    letter-spacing: .12em;
    text-transform: uppercase;
}

.site-loader__shot figcaption span {
    color: var(--v3-gold-hot);
}

.site-loader__grain {
    z-index: 10;
    position: absolute;
    inset: -30%;
    background-image:
        radial-gradient(circle at 20% 30%, rgba(255, 255, 255, .55) 0 .45px, transparent .7px),
        radial-gradient(circle at 70% 65%, rgba(255, 255, 255, .4) 0 .4px, transparent .75px);
    background-size: 3px 3px, 5px 5px;
    opacity: .075;
    pointer-events: none;
    animation: v3-grain .18s steps(2) infinite;
}

.site-loader__aperture {
    width: 50.5%;
    z-index: 8;
    position: absolute;
    top: 0;
    bottom: 0;
    background:
        linear-gradient(90deg, rgba(228, 188, 104, .03), transparent),
        #020202;
    transition: transform 1.08s var(--ease-cinematic);
}

.site-loader__aperture--left {
    left: 0;
    transform-origin: left center;
}

.site-loader__aperture--right {
    right: 0;
    transform-origin: right center;
}

.site-loader__interface {
    z-index: 12;
    position: absolute;
    inset: 0;
    transition: opacity .55s ease, transform .8s var(--ease);
}

.site-loader__topline {
    display: grid;
    top: 24px;
    right: 30px;
    left: 30px;
    padding-bottom: 16px;
    position: absolute;
    grid-template-columns: 1fr auto 1fr;
    gap: 20px;
    border-bottom: 1px solid rgba(255, 255, 255, .13);
    color: rgba(255, 255, 255, .52);
    font-family: var(--v3-mono);
    font-size: 8px;
    letter-spacing: .14em;
}

.site-loader__topline span:nth-child(2) {
    color: var(--v3-gold);
}

.site-loader__topline span:last-child {
    text-align: right;
}

.site-loader__identity {
    display: flex;
    width: min(310px, 70vw);
    z-index: 10;
    top: 50%;
    left: 50%;
    position: absolute;
    align-items: center;
    flex-direction: column;
    transform: translate(-50%, -50%);
}

.site-loader__identity img {
    width: 215px;
    filter: drop-shadow(0 0 28px rgba(255, 255, 255, .11));
    animation: v3-loader-mark 1.5s var(--ease) both;
}

.site-loader__identity p {
    margin: 18px 0 0;
    color: rgba(255, 255, 255, .48);
    font-family: var(--v3-mono);
    font-size: 8px;
    letter-spacing: .18em;
    text-transform: uppercase;
}

.site-loader__pulse {
    width: 8px;
    height: 8px;
    margin-bottom: 24px;
    border: 1px solid var(--v3-gold);
    border-radius: 50%;
    box-shadow: 0 0 0 0 rgba(228, 188, 104, .6);
    animation: v3-pulse 1.2s infinite;
}

.site-loader__console {
    display: grid;
    right: 30px;
    bottom: 25px;
    left: 30px;
    padding-top: 16px;
    position: absolute;
    align-items: end;
    grid-template-columns: 240px 1fr 54px;
    gap: 24px;
    border-top: 1px solid rgba(255, 255, 255, .13);
}

.site-loader__console > div:first-child {
    display: grid;
    gap: 5px;
}

.site-loader__console span,
.site-loader__console i,
.site-loader__console strong {
    font-family: var(--v3-mono);
    font-style: normal;
}

.site-loader__console span {
    color: var(--v3-gold-hot);
    font-size: 9px;
    letter-spacing: .13em;
}

.site-loader__console i {
    color: rgba(255, 255, 255, .34);
    font-size: 7px;
    letter-spacing: .1em;
}

.site-loader__console strong {
    color: var(--v3-gold-hot);
    font-size: 25px;
    font-weight: 400;
    line-height: 1;
    text-align: right;
}

.site-loader__progress {
    height: 2px;
    overflow: hidden;
    background: rgba(255, 255, 255, .12);
}

.site-loader__progress span {
    display: block;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, var(--v3-gold-dim), var(--v3-gold-hot));
    transform: scaleX(0);
    transform-origin: left;
    animation: v3-loader-progress 2.35s linear forwards;
    box-shadow: 0 0 14px var(--v3-gold);
}

.site-loader.is-ignited .site-loader__aperture--left {
    transform: translateX(-104%);
}

.site-loader.is-ignited .site-loader__aperture--right {
    transform: translateX(104%);
}

.site-loader.is-ignited .site-loader__interface {
    opacity: 0;
    transform: scale(1.035);
}

.site-loader.is-ignited .site-loader__reel {
    opacity: 0;
    transform: translate(-50%, -50%) scale(1.28);
}

@keyframes v3-loader-progress {
    to { transform: scaleX(1); }
}

@keyframes v3-loader-mark {
    from { opacity: 0; filter: blur(13px); transform: scale(.9); }
    to { opacity: 1; filter: blur(0) drop-shadow(0 0 28px rgba(255, 255, 255, .11)); transform: scale(1); }
}

@keyframes v3-pulse {
    70% { box-shadow: 0 0 0 12px rgba(228, 188, 104, 0); }
    100% { box-shadow: 0 0 0 0 rgba(228, 188, 104, 0); }
}

@keyframes v3-grain {
    0% { transform: translate(0, 0); }
    25% { transform: translate(2%, -3%); }
    50% { transform: translate(-3%, 2%); }
    75% { transform: translate(3%, 4%); }
    100% { transform: translate(-2%, -2%); }
}

/* Navigation */

.site-header {
    width: calc(100% - 36px);
    height: 72px;
    max-width: 1680px;
    margin-inline: auto;
    padding: 9px 10px 9px 17px;
    z-index: 10000;
    top: 18px;
    right: 18px;
    left: 18px;
    border: 1px solid rgba(255, 255, 255, .13);
    border-radius: 16px;
    background: linear-gradient(180deg, rgba(13, 13, 11, .68), rgba(6, 6, 5, .52));
    box-shadow: 0 16px 54px rgba(0, 0, 0, .2);
    backdrop-filter: blur(18px) saturate(1.25);
    -webkit-backdrop-filter: blur(18px) saturate(1.25);
    transform: none;
    transition:
        top .45s var(--ease),
        background .45s,
        border-color .45s,
        box-shadow .45s;
}

.site-header.is-scrolled {
    top: 10px;
    border-color: rgba(228, 188, 104, .28);
    background: rgba(6, 6, 5, .88);
    box-shadow: 0 20px 70px rgba(0, 0, 0, .48);
}

.site-header.is-hidden {
    transform: none;
}

.brand {
    width: 142px;
    padding-right: 18px;
    border-right: 1px solid var(--v3-line);
}

.brand img {
    width: 132px;
}

.desktop-nav {
    display: flex;
    padding: 5px;
    justify-self: center;
    gap: 2px;
    border: 1px solid rgba(255, 255, 255, .09);
    border-radius: 11px;
    background: rgba(255, 255, 255, .035);
}

.desktop-nav a {
    display: flex;
    min-height: 41px;
    padding: 0 17px;
    position: relative;
    align-items: center;
    gap: 8px;
    border-radius: 8px;
    color: rgba(244, 241, 233, .9);
    font-size: 12.5px;
    font-weight: 600;
    letter-spacing: -.01em;
    transition: color .35s, background .35s, transform .35s var(--ease);
}

.desktop-nav a span {
    color: var(--v3-gold);
    font-family: var(--v3-mono);
    font-size: 7px;
    font-weight: 400;
    letter-spacing: .04em;
    opacity: .65;
}

.desktop-nav a::after {
    width: 4px;
    height: 4px;
    right: 50%;
    bottom: 2px;
    position: absolute;
    border-radius: 50%;
    background: var(--v3-gold-hot);
    content: "";
    opacity: 0;
    transform: translate(50%, 6px);
    box-shadow: 0 0 10px var(--v3-gold);
    transition: opacity .3s, transform .35s var(--ease);
}

.desktop-nav a:hover,
.desktop-nav a[aria-current="page"] {
    color: #fff;
    background: rgba(255, 255, 255, .07);
    transform: translateY(-1px);
}

.desktop-nav a:hover::after,
.desktop-nav a[aria-current="page"]::after {
    opacity: 1;
    transform: translate(50%, 0);
}

.header-cta {
    min-height: 50px;
    padding: 0 13px 0 18px;
    gap: 18px;
    border-color: rgba(228, 188, 104, .45);
    background: linear-gradient(135deg, rgba(228, 188, 104, .16), rgba(228, 188, 104, .04));
    color: var(--v3-ivory);
}

.header-cta .button__arrow {
    color: #0a0907;
    background: var(--v3-gold-hot);
}

.menu-toggle {
    display: none;
    width: auto;
    height: 50px;
    padding: 0 10px 0 17px;
    align-items: center;
    gap: 13px;
    border: 1px solid rgba(228, 188, 104, .35);
    border-radius: 11px;
    background: rgba(228, 188, 104, .09);
}

.site-header .menu-toggle > .menu-toggle__label {
    width: auto;
    height: auto;
    top: auto;
    left: auto;
    position: relative;
    color: #fff;
    background: transparent;
    font-family: var(--v3-mono);
    font-size: 9px;
    letter-spacing: .12em;
    transform: none;
    text-transform: uppercase;
}

.site-header .menu-toggle > .menu-toggle__icon {
    width: 31px;
    height: 31px;
    top: auto;
    left: auto;
    position: relative;
    border-radius: 8px;
    background: var(--v3-gold-hot);
    transform: none;
}

.menu-toggle__icon i {
    width: 12px;
    height: 1px;
    top: 50%;
    left: 50%;
    position: absolute;
    background: #0b0905;
    transition: transform .4s var(--ease);
}

.menu-toggle__icon i:first-child {
    transform: translate(-50%, -3px);
}

.menu-toggle__icon i:last-child {
    transform: translate(-50%, 3px);
}

.menu-toggle[aria-expanded="true"] .menu-toggle__icon i:first-child {
    transform: translate(-50%, 0) rotate(45deg);
}

.menu-toggle[aria-expanded="true"] .menu-toggle__icon i:last-child {
    transform: translate(-50%, 0) rotate(-45deg);
}

.site-header .menu-toggle[aria-expanded="true"] > .menu-toggle__label,
.site-header .menu-toggle[aria-expanded="true"] > .menu-toggle__icon {
    transform: none;
}

.mobile-menu {
    display: grid;
    z-index: 9990;
    position: fixed;
    inset: 0;
    grid-template-columns: 42% 58%;
    background: #050504;
    opacity: 0;
    visibility: hidden;
    transform: none;
    transition: opacity .42s, visibility .42s;
}

.mobile-menu.is-open {
    opacity: 1;
    visibility: visible;
    transform: none;
}

.mobile-menu__backdrop {
    z-index: 0;
    position: absolute;
    inset: 0;
    background:
        radial-gradient(circle at 78% 28%, rgba(228, 188, 104, .12), transparent 28%),
        linear-gradient(90deg, transparent, rgba(255, 255, 255, .025));
}

.mobile-menu__visual {
    margin: 100px 0 24px 24px;
    z-index: 1;
    position: relative;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, .12);
    opacity: 0;
    clip-path: inset(0 100% 0 0);
    transition: opacity .6s .18s, clip-path .9s .1s var(--ease-cinematic);
}

.mobile-menu.is-open .mobile-menu__visual {
    opacity: 1;
    clip-path: inset(0);
}

.mobile-menu__visual::after {
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, transparent 42%, rgba(0, 0, 0, .72));
    content: "";
}

.mobile-menu__visual img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    filter: saturate(.75);
    transform: scale(1.04);
    transition: opacity .18s, transform 1.2s var(--ease);
}

.mobile-menu__visual img.is-changing {
    opacity: .15;
    transform: scale(1.1);
}

.mobile-menu__visual > span {
    z-index: 2;
    right: 24px;
    bottom: 22px;
    left: 24px;
    position: absolute;
    color: rgba(255, 255, 255, .7);
    font-family: var(--v3-mono);
    font-size: 8px;
    letter-spacing: .14em;
    text-transform: uppercase;
}

.mobile-menu__panel {
    display: flex;
    padding: 126px 7vw 36px;
    z-index: 1;
    flex-direction: column;
    border-left: 1px solid var(--v3-line);
    opacity: 0;
    transform: translateX(34px);
    transition: opacity .55s .22s, transform .7s .18s var(--ease);
}

.mobile-menu.is-open .mobile-menu__panel {
    opacity: 1;
    transform: translateX(0);
}

.mobile-menu__kicker {
    display: flex;
    margin: 0 0 24px;
    align-items: center;
    gap: 10px;
    color: var(--v3-muted);
    font-family: var(--v3-mono);
    font-size: 8px;
    letter-spacing: .14em;
    text-transform: uppercase;
}

.mobile-menu__kicker i {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--v3-gold);
    box-shadow: 0 0 12px var(--v3-gold);
}

.mobile-menu nav {
    display: block;
    width: 100%;
    margin: 0;
}

.mobile-menu nav a {
    display: grid;
    min-height: 76px;
    padding: 0;
    align-items: center;
    grid-template-columns: 42px 1fr 35px;
    gap: 12px;
    border-bottom: 1px solid var(--v3-line);
    color: var(--v3-ivory);
    font-size: clamp(27px, 3.2vw, 45px);
    letter-spacing: -.05em;
    opacity: 1;
    transform: none;
}

.mobile-menu nav a:first-child {
    border-top: 1px solid var(--v3-line);
}

.mobile-menu nav a span {
    color: var(--v3-gold);
    font-family: var(--v3-mono);
    font-size: 8px;
    letter-spacing: .1em;
}

.mobile-menu nav a strong {
    font-weight: 500;
    transition: color .3s, transform .4s var(--ease);
}

.mobile-menu nav a > i {
    display: grid;
    width: 31px;
    height: 31px;
    border: 1px solid var(--v3-line);
    border-radius: 50%;
    color: var(--v3-gold);
    font-family: var(--v3-mono);
    font-size: 10px;
    font-style: normal;
    place-items: center;
    transition: background .3s, color .3s, transform .45s var(--ease);
}

.mobile-menu nav a:hover strong,
.mobile-menu nav a:focus-visible strong {
    color: var(--v3-gold-hot);
    transform: translateX(9px);
}

.mobile-menu nav a:hover > i,
.mobile-menu nav a:focus-visible > i {
    color: #080705;
    background: var(--v3-gold-hot);
    transform: rotate(45deg);
}

.mobile-menu__footer {
    display: flex;
    width: 100%;
    margin-top: auto;
    padding-top: 25px;
    position: static;
    justify-content: space-between;
    gap: 18px;
    border-top: 1px solid var(--v3-line);
    color: var(--v3-muted);
    font-family: var(--v3-mono);
    font-size: 8px;
    letter-spacing: .08em;
}

.mobile-menu__footer p {
    margin: 0;
}

/* Hero reel */

.hero--home {
    min-height: 100svh;
    padding: 18px;
    background: #030302;
}

.hero-reel {
    position: absolute;
    inset: 18px;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, .16);
    border-radius: 2px;
    background: #060604;
}

.hero-reel__frame {
    margin: 0;
    position: absolute;
    inset: 0;
    opacity: 0;
    clip-path: inset(0 0 0 100%);
    transform: scale(1.08);
    transition:
        opacity .55s linear,
        clip-path 1.15s var(--ease-cinematic),
        transform 6.8s linear;
}

.hero-reel__frame.is-active {
    z-index: 2;
    opacity: 1;
    clip-path: inset(0);
    transform: scale(1.015);
}

.hero-reel__frame img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center 48%;
    filter: saturate(.78) contrast(1.06) brightness(.82);
}

.hero-reel__frame:nth-child(2) img {
    object-position: center 55%;
}

.hero-reel__frame figcaption {
    display: flex;
    z-index: 5;
    right: 20px;
    bottom: 20px;
    position: absolute;
    align-items: center;
    gap: 12px;
    color: rgba(255, 255, 255, .7);
    font-family: var(--v3-mono);
    font-size: 8px;
    letter-spacing: .11em;
    text-transform: uppercase;
}

.hero-reel__frame figcaption span {
    display: grid;
    width: 26px;
    height: 26px;
    border: 1px solid rgba(255, 255, 255, .28);
    border-radius: 50%;
    color: var(--v3-gold-hot);
    place-items: center;
}

.hero__media {
    display: none;
}

.hero__wash {
    z-index: 3;
    background:
        linear-gradient(90deg, rgba(2, 2, 1, .8) 0%, rgba(2, 2, 1, .42) 42%, rgba(2, 2, 1, .1) 72%),
        linear-gradient(180deg, rgba(0, 0, 0, .32), transparent 35%, rgba(0, 0, 0, .74));
}

.hero__spotlight {
    z-index: 4;
    top: -32%;
    right: 2%;
    left: auto;
    width: 42vw;
    height: 126%;
    opacity: .2;
    filter: blur(22px);
    background: linear-gradient(165deg, rgba(255, 229, 171, .35), transparent 62%);
    clip-path: polygon(44% 0, 62% 0, 100% 100%, 0 100%);
    transform: rotate(-6deg);
    animation: v3-spotlight 10s ease-in-out infinite alternate;
}

.hero__scan {
    width: 34%;
    z-index: 5;
    top: 18px;
    bottom: 18px;
    left: -40%;
    position: absolute;
    background: linear-gradient(90deg, transparent, rgba(255, 229, 171, .08), transparent);
    transform: skewX(-12deg);
    animation: v3-scan 9s 2.8s ease-in-out infinite;
    pointer-events: none;
}

.hero__frame {
    z-index: 7;
    inset: 32px;
    border-color: rgba(255, 255, 255, .13);
}

.hero__frame::before,
.hero__frame::after {
    width: 36px;
    height: 36px;
    position: absolute;
    content: "";
    border-color: var(--v3-gold);
}

.hero__frame::before {
    top: -1px;
    left: -1px;
    border-top: 1px solid;
    border-left: 1px solid;
}

.hero__frame::after {
    right: -1px;
    bottom: -1px;
    border-right: 1px solid;
    border-bottom: 1px solid;
}

.hero__content {
    min-height: 100%;
    padding: 170px 3.5vw 92px;
    z-index: 8;
    justify-content: flex-end;
}

.hero__eyebrow {
    max-width: 860px;
    padding: 0 0 17px;
    border-bottom: 1px solid rgba(255, 255, 255, .18);
    color: rgba(255, 255, 255, .72);
    font-family: var(--v3-mono);
    font-size: 8px;
    letter-spacing: .14em;
}

.hero__eyebrow span:first-child {
    display: flex;
    align-items: center;
    gap: 9px;
}

.hero__eyebrow span:first-child i {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--v3-gold-hot);
    box-shadow: 0 0 12px var(--v3-gold);
}

.hero__title {
    max-width: 860px;
    margin: 25px 0 27px;
    font-size: clamp(50px, 5.3vw, 76px);
    font-weight: 500;
    letter-spacing: -.065em;
    line-height: .97;
    text-shadow: 0 8px 45px rgba(0, 0, 0, .38);
}

.hero__title .line {
    overflow: hidden;
}

.hero__title .line > span {
    display: block;
    transform: translateY(115%);
    transition: transform 1.05s var(--ease-cinematic);
}

.hero__title .line:nth-child(2) > span {
    transition-delay: .12s;
}

body.is-ready .hero__title .line > span {
    transform: translateY(0);
}

.hero__title .line--accent > span {
    color: var(--v3-gold-hot);
    font-family: var(--font-display);
    font-style: normal;
    font-weight: 600;
}

.hero__footer {
    width: min(860px, 100%);
    align-items: flex-end;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 35px;
}

.hero__footer p {
    max-width: 565px;
    color: rgba(255, 255, 255, .72);
    font-size: 14px;
    line-height: 1.75;
}

.hero__hud {
    z-index: 9;
    font-family: var(--v3-mono);
    font-size: 7px;
    letter-spacing: .12em;
}

.hero__hud--left {
    top: 110px;
    bottom: auto;
    left: 52px;
}

.hero__hud--left strong {
    color: var(--v3-gold-hot);
    font-size: 8px;
    font-weight: 400;
}

.hero__hud--right {
    top: 110px;
    right: 52px;
    bottom: auto;
}

.hero__hud--right i {
    background: #7fdf96;
    box-shadow: 0 0 10px #7fdf96;
    animation: v3-status 1.5s ease-in-out infinite;
}

.hero-reel__controls {
    display: flex;
    z-index: 10;
    right: 52px;
    bottom: 63px;
    position: absolute;
    flex-direction: column;
    gap: 10px;
}

.hero-reel__controls button {
    display: grid;
    width: 100px;
    padding: 6px 0;
    align-items: center;
    grid-template-columns: 1fr 20px;
    gap: 9px;
    border: 0;
    color: rgba(255, 255, 255, .45);
    background: transparent;
}

.hero-reel__controls button span {
    height: 1px;
    position: relative;
    overflow: hidden;
    background: rgba(255, 255, 255, .22);
}

.hero-reel__controls button span::after {
    position: absolute;
    inset: 0;
    background: var(--v3-gold-hot);
    content: "";
    transform: scaleX(0);
    transform-origin: left;
}

.hero-reel__controls button i {
    font-family: var(--v3-mono);
    font-size: 7px;
    font-style: normal;
}

.hero-reel__controls button.is-active {
    color: var(--v3-gold-hot);
}

.hero-reel__controls button.is-active span::after {
    animation: v3-hero-timeline 5.2s linear forwards;
}

.scroll-cue {
    z-index: 10;
    right: auto;
    bottom: 37px;
    left: 52px;
    color: rgba(255, 255, 255, .45);
    font-family: var(--v3-mono);
    font-size: 7px;
}

.scroll-cue i {
    width: 38px;
    background: rgba(255, 255, 255, .25);
}

.scroll-cue i::after {
    background: var(--v3-gold-hot);
    animation: v3-scroll-line 2s ease-in-out infinite;
}

@keyframes v3-spotlight {
    to { opacity: .3; transform: rotate(5deg) translateX(-7vw); }
}

@keyframes v3-scan {
    0%, 15% { left: -40%; opacity: 0; }
    35%, 58% { opacity: 1; }
    75%, 100% { left: 110%; opacity: 0; }
}

@keyframes v3-status {
    50% { opacity: .35; }
}

@keyframes v3-hero-timeline {
    to { transform: scaleX(1); }
}

@keyframes v3-scroll-line {
    0% { transform: scaleX(0); transform-origin: left; }
    45% { transform: scaleX(1); transform-origin: left; }
    55% { transform: scaleX(1); transform-origin: right; }
    100% { transform: scaleX(0); transform-origin: right; }
}

/* Home sections */

.marquee {
    height: 62px;
    border-color: rgba(228, 188, 104, .24);
    background: #080806;
}

.marquee::before,
.marquee::after {
    width: 80px;
    z-index: 2;
    position: absolute;
    top: 0;
    bottom: 0;
    background: linear-gradient(90deg, #080806, transparent);
    content: "";
}

.marquee::before {
    left: 0;
}

.marquee::after {
    right: 0;
    transform: rotate(180deg);
}

.marquee__track {
    gap: 23px;
    color: rgba(244, 241, 233, .72);
    font-family: var(--v3-mono);
    font-size: 9px;
    letter-spacing: .12em;
}

.marquee__track i {
    color: var(--v3-gold-hot);
    font-size: 8px;
}

.intro-section {
    overflow: hidden;
    background:
        radial-gradient(circle at 86% 46%, rgba(228, 188, 104, .08), transparent 25%),
        #070706;
}

.intro-grid {
    align-items: start;
    grid-template-columns: 170px minmax(0, 1fr) minmax(280px, 390px);
    gap: clamp(35px, 5vw, 80px);
}

.intro-statement h2 {
    max-width: 760px;
    margin-bottom: 30px;
    font-size: clamp(39px, 4.25vw, 62px);
}

.intro-copy {
    max-width: 660px;
    color: var(--v3-muted);
    font-size: 15px;
    line-height: 1.8;
}

.production-card {
    min-height: 430px;
    padding: 24px;
    overflow: hidden;
    border-color: var(--v3-line);
    border-radius: 2px;
    background:
        linear-gradient(145deg, rgba(228, 188, 104, .08), transparent 42%),
        rgba(255, 255, 255, .025);
    box-shadow: 0 40px 100px rgba(0, 0, 0, .24);
}

.production-card::after {
    width: 120%;
    height: 1px;
    left: -10%;
    position: absolute;
    background: linear-gradient(90deg, transparent, var(--v3-gold-hot), transparent);
    content: "";
    animation: v3-signal-scan 4.8s ease-in-out infinite;
    box-shadow: 0 0 20px rgba(228, 188, 104, .45);
}

.production-card__signal {
    display: flex;
    height: 85px;
    margin-bottom: 20px;
    align-items: center;
    gap: 9px;
    border-bottom: 1px solid var(--v3-line);
}

.production-card__signal span {
    display: block;
    width: 3px;
    height: 22px;
    background: var(--v3-gold);
    transform-origin: center;
    animation: v3-eq .9s ease-in-out infinite alternate;
}

.production-card__signal span:nth-child(2) { animation-delay: -.2s; }
.production-card__signal span:nth-child(3) { animation-delay: -.45s; }
.production-card__signal span:nth-child(4) { animation-delay: -.1s; }
.production-card__signal span:nth-child(5) { animation-delay: -.35s; }

.production-card__head {
    font-family: var(--v3-mono);
}

.production-card__head i {
    display: flex;
    align-items: center;
    gap: 7px;
    color: #8dd49d;
}

.production-card__head i b {
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: currentColor;
    box-shadow: 0 0 10px currentColor;
}

.production-card dl {
    border-top: 1px solid var(--v3-line);
}

.production-card dl > div {
    border-color: var(--v3-line);
}

.production-card dt {
    color: var(--v3-ivory);
    font-size: 12px;
}

.production-card dd {
    color: var(--v3-muted);
    font-family: var(--v3-mono);
    font-size: 8px;
}

.production-card > p {
    color: var(--v3-gold-hot);
    font-size: 15px;
}

@keyframes v3-eq {
    to { height: 62px; opacity: .45; }
}

@keyframes v3-signal-scan {
    0%, 10% { top: 0; opacity: 0; }
    25%, 75% { opacity: .75; }
    90%, 100% { top: 100%; opacity: 0; }
}

.services-showcase {
    background: var(--v3-black);
}

.service-list {
    border-top-color: var(--v3-line);
}

.service-row {
    min-height: 96px;
    padding: 0 4.5vw;
    grid-template-columns: 58px minmax(280px, .85fr) minmax(300px, 1fr) 42px;
    border-color: var(--v3-line);
    background:
        radial-gradient(circle at var(--row-x, 50%) 50%, rgba(228, 188, 104, .1), transparent 22%),
        transparent;
    transition:
        color .35s,
        background .4s,
        padding .5s var(--ease);
}

.service-row::before {
    width: 3px;
    right: auto;
    left: 0;
    background: var(--v3-gold-hot);
    transform: scaleY(0);
    transform-origin: center;
}

.service-row:hover {
    padding-right: 4vw;
    padding-left: 5vw;
    background-color: rgba(255, 255, 255, .025);
}

.service-row:hover::before {
    transform: scaleY(1);
}

.service-row__number {
    color: var(--v3-gold);
    font-family: var(--v3-mono);
    font-size: 8px;
}

.service-row__title {
    font-size: clamp(19px, 1.65vw, 25px);
    font-weight: 500;
    letter-spacing: -.04em;
}

.service-row__copy {
    max-width: 570px;
    color: rgba(244, 241, 233, .67);
    font-size: 12.5px;
    line-height: 1.55;
}

.service-row__arrow {
    display: grid;
    width: 35px;
    height: 35px;
    border: 1px solid var(--v3-line);
    border-radius: 50%;
    color: var(--v3-gold);
    place-items: center;
    transition: color .3s, background .3s, transform .45s var(--ease);
}

.service-row:hover .service-row__arrow {
    color: #090705;
    background: var(--v3-gold-hot);
    transform: rotate(45deg);
}

.service-preview {
    width: min(23vw, 340px);
    height: min(15vw, 220px);
    border: 1px solid rgba(228, 188, 104, .5);
    border-radius: 2px;
    box-shadow: 0 25px 70px rgba(0, 0, 0, .62), 0 0 0 7px rgba(4, 4, 3, .55);
}

.service-preview img {
    filter: saturate(.8) contrast(1.06);
}

.cinematic-break {
    min-height: 76vh;
    border-color: var(--v3-line);
}

.cinematic-break::after {
    width: 36%;
    top: -20%;
    bottom: -20%;
    left: 50%;
    position: absolute;
    background: linear-gradient(90deg, transparent, rgba(255, 228, 164, .12), transparent);
    content: "";
    filter: blur(18px);
    transform: translateX(-50%) rotate(-12deg);
    animation: v3-break-beam 8s ease-in-out infinite alternate;
}

.cinematic-break__media {
    filter: saturate(.7) contrast(1.1);
}

.cinematic-break__overlay {
    background:
        linear-gradient(90deg, rgba(0, 0, 0, .77), rgba(0, 0, 0, .18) 70%),
        linear-gradient(180deg, rgba(0, 0, 0, .18), rgba(0, 0, 0, .72));
}

.cinematic-break__content blockquote {
    max-width: 920px;
    font-size: clamp(40px, 4.6vw, 66px);
    line-height: 1.02;
}

.cinematic-stats {
    max-width: 960px;
    border-color: var(--v3-line);
}

.cinematic-stats strong {
    color: var(--v3-gold-hot);
    font-family: var(--v3-mono);
}

@keyframes v3-break-beam {
    to { left: 74%; transform: translateX(-50%) rotate(5deg); }
}

.process-section {
    background:
        linear-gradient(90deg, transparent 50%, rgba(255, 255, 255, .012) 50%),
        #070706;
}

.process-heading {
    margin-bottom: 65px;
}

.process-layout {
    align-items: start;
    grid-template-columns: minmax(320px, .72fr) minmax(0, 1.28fr);
    gap: clamp(50px, 6vw, 100px);
}

.process-visual {
    height: min(68vh, 680px);
    top: 120px;
    position: sticky;
    overflow: hidden;
    border-color: var(--v3-line);
}

.process-visual::after {
    position: absolute;
    inset: 0;
    border: 1px solid transparent;
    background: linear-gradient(135deg, rgba(228, 188, 104, .22), transparent 35%) border-box;
    content: "";
    pointer-events: none;
}

.process-visual img {
    filter: saturate(.62) contrast(1.12);
    transition: transform 1.2s var(--ease), filter .7s;
}

.process-visual:hover img {
    filter: saturate(.92) contrast(1.05);
    transform: scale(1.035);
}

.process-list {
    border-top: 1px solid var(--v3-line);
}

.process-list li {
    min-height: 145px;
    padding: 27px 18px 27px 0;
    position: relative;
    grid-template-columns: 38px 1fr;
    border-color: var(--v3-line);
    opacity: .48;
    transition: opacity .55s, padding .55s var(--ease), background .55s;
}

.process-list li::before {
    width: 2px;
    top: 0;
    bottom: 0;
    left: -1px;
    position: absolute;
    background: var(--v3-gold-hot);
    content: "";
    transform: scaleY(0);
    transform-origin: top;
    transition: transform .65s var(--ease);
    box-shadow: 0 0 15px rgba(228, 188, 104, .5);
}

.process-list li.is-active,
.process-list li:hover {
    padding-left: 24px;
    opacity: 1;
    background: linear-gradient(90deg, rgba(228, 188, 104, .07), transparent 70%);
}

.process-list li.is-active::before,
.process-list li:hover::before {
    transform: scaleY(1);
}

.process-list li > span {
    color: var(--v3-gold);
    font-family: var(--v3-mono);
    font-size: 8px;
}

.process-list h3 {
    margin-bottom: 9px;
    font-size: 24px;
}

.process-list p {
    max-width: 630px;
    color: var(--v3-muted);
    font-size: 12px;
    line-height: 1.65;
}

.work-section {
    background: #050504;
}

.work-grid {
    gap: 56px 24px;
}

.work-card {
    position: relative;
}

.work-card::after,
.portfolio-item::after,
.service-card::after {
    position: absolute;
    inset: -1px;
    border: 1px solid transparent;
    background: radial-gradient(circle at var(--card-x, 50%) var(--card-y, 50%), rgba(228, 188, 104, .6), transparent 30%) border-box;
    content: "";
    opacity: 0;
    pointer-events: none;
    transition: opacity .4s;
    mask: linear-gradient(#000 0 0) padding-box, linear-gradient(#000 0 0);
    mask-composite: exclude;
}

.work-card:hover::after,
.portfolio-item:hover::after,
.service-card:hover::after {
    opacity: 1;
}

.work-card__media,
.portfolio-item__media,
.service-card__media {
    overflow: hidden;
    border: 1px solid var(--v3-line);
    transition: transform .25s ease-out, border-color .35s;
    transform-style: preserve-3d;
}

.work-card__media::after,
.portfolio-item__media::after,
.service-card__media::after {
    position: absolute;
    inset: 0;
    background:
        linear-gradient(180deg, transparent 54%, rgba(0, 0, 0, .72)),
        linear-gradient(90deg, rgba(255, 255, 255, .06), transparent 20%);
    content: "";
    pointer-events: none;
}

.work-card__media img,
.portfolio-item__media img,
.service-card__media img {
    filter: saturate(.72) contrast(1.06);
    transition: transform 1.1s var(--ease), filter .65s;
}

.work-card:hover .work-card__media img,
.portfolio-item:hover .portfolio-item__media img,
.service-card:hover .service-card__media img {
    filter: saturate(1) contrast(1.02);
    transform: scale(1.055);
}

.work-card__media > span {
    z-index: 2;
    border-color: rgba(255, 255, 255, .2);
    border-radius: 8px;
    background: rgba(4, 4, 3, .56);
    backdrop-filter: blur(12px);
    font-family: var(--v3-mono);
    font-size: 8px;
}

.work-card__body h3 {
    font-size: 22px;
}

.work-card__body p {
    color: var(--v3-muted);
    font-size: 12px;
}

.testimonial-section {
    background:
        radial-gradient(circle at 80% 20%, rgba(228, 188, 104, .08), transparent 28%),
        #0a0a08;
}

.testimonial-shell {
    min-height: 420px;
    padding: clamp(44px, 6vw, 84px);
    border-color: var(--v3-line);
    background: rgba(255, 255, 255, .018);
}

.testimonial blockquote {
    max-width: 960px;
    font-size: clamp(31px, 3.2vw, 48px);
    line-height: 1.22;
}

.testimonial figcaption strong {
    font-size: 12px;
}

.testimonial figcaption span,
.content-note {
    color: var(--v3-muted);
    font-family: var(--v3-mono);
    font-size: 8px;
}

.slider-controls button {
    width: 42px;
    height: 42px;
    border-color: var(--v3-line);
    background: rgba(255, 255, 255, .025);
}

.slider-controls button:hover {
    color: #070604;
    background: var(--v3-gold-hot);
}

.faq-section {
    background: #070706;
}

.accordion__item {
    border-color: var(--v3-line);
}

.accordion button {
    min-height: 78px;
    font-size: 14px;
}

.accordion button i {
    width: 31px;
    height: 31px;
    border: 1px solid var(--v3-line);
    border-radius: 50%;
}

.accordion button i::before,
.accordion button i::after {
    width: 10px;
    background: var(--v3-gold);
}

.accordion__panel p {
    color: var(--v3-muted);
    font-size: 13px;
}

/* Internal pages */

.page-hero,
.service-hero {
    min-height: 92svh;
    padding: 18px;
    background: var(--v3-black);
}

.page-hero__media,
.service-hero__media {
    inset: 18px;
    border: 1px solid rgba(255, 255, 255, .13);
    filter: saturate(.72) contrast(1.08);
}

.page-hero__veil,
.service-hero__veil {
    background:
        linear-gradient(90deg, rgba(0, 0, 0, .82), rgba(0, 0, 0, .34) 60%, rgba(0, 0, 0, .15)),
        linear-gradient(180deg, rgba(0, 0, 0, .18), rgba(0, 0, 0, .76));
}

.page-hero::after,
.service-hero::after {
    right: 32px;
    bottom: 32px;
    left: 32px;
    height: 1px;
    position: absolute;
    background: linear-gradient(90deg, var(--v3-gold), rgba(255, 255, 255, .14), transparent);
    content: "";
}

.page-hero__content,
.service-hero__content {
    min-height: 92svh;
    padding-top: 165px;
    padding-bottom: 85px;
    justify-content: flex-end;
}

.page-hero h1,
.service-hero h1 {
    max-width: 940px;
    font-size: clamp(45px, 4.7vw, 66px);
    font-weight: 500;
    letter-spacing: -.06em;
}

.page-hero__intro,
.service-hero__intro {
    max-width: 620px;
    color: rgba(255, 255, 255, .72);
    font-size: 14px;
    line-height: 1.75;
}

.service-hero__meta {
    border-color: var(--v3-line);
    background: rgba(5, 5, 4, .34);
    backdrop-filter: blur(12px);
}

.service-card {
    border-color: var(--v3-line);
    background: rgba(255, 255, 255, .018);
}

.service-card__body h2 {
    font-size: 22px;
}

.service-card__body p,
.about-story__copy p,
.service-promise p,
.portfolio-intro p {
    color: var(--v3-muted);
    font-size: 13px;
    line-height: 1.75;
}

.values-section,
.manifesto-section,
.portfolio-section,
.contact-section,
.legal-content {
    background: #070706;
}

.value-card,
.manifesto-card {
    border-color: var(--v3-line);
    background: rgba(255, 255, 255, .018);
}

.manifesto-card--gold {
    color: #080705;
    background: linear-gradient(135deg, var(--v3-gold-hot), #b8893f);
}

.portfolio-item {
    border-color: var(--v3-line);
}

.portfolio-item__number,
.deliverables li::before {
    color: var(--v3-gold);
    font-family: var(--v3-mono);
}

.contact-aside,
.enquiry-panel {
    border-color: var(--v3-line);
    background: rgba(255, 255, 255, .018);
}

.contact-lines > div,
.field input,
.field select,
.field textarea {
    border-color: var(--v3-line);
}

.field input,
.field select,
.field textarea {
    min-height: 54px;
    border-radius: 8px;
    background: rgba(255, 255, 255, .025);
    font-size: 13px;
    transition: border-color .3s, background .3s, box-shadow .3s;
}

.field input:focus,
.field select:focus,
.field textarea:focus {
    border-color: var(--v3-gold);
    background: rgba(228, 188, 104, .035);
    box-shadow: 0 0 0 3px rgba(228, 188, 104, .08);
    outline: 0;
}

.field label,
.form-heading > span {
    font-family: var(--v3-mono);
    font-size: 8px;
    letter-spacing: .1em;
}

.closing-scene {
    min-height: 68vh;
    border-color: var(--v3-line);
}

.closing-scene__image {
    filter: saturate(.7) contrast(1.08);
}

.closing-scene__content h2 {
    font-size: clamp(39px, 4.3vw, 62px);
}

.site-footer {
    background: #030302;
}

.footer-grid,
.footer-bottom {
    border-color: var(--v3-line);
}

.footer-label,
.footer-bottom {
    font-family: var(--v3-mono);
}

.footer-column a {
    font-size: 12px;
}

.footer-brand p,
.footer-contact p,
.footer-bottom {
    color: var(--v3-muted);
}

.whatsapp-float {
    width: 52px;
    height: 52px;
    right: 22px;
    bottom: 22px;
    border: 1px solid rgba(255, 255, 255, .24);
    background: var(--v3-gold-hot);
    box-shadow: 0 12px 40px rgba(0, 0, 0, .42), 0 0 0 6px rgba(228, 188, 104, .07);
    font-family: var(--v3-mono);
}

/* Reveal language */

.js .reveal {
    opacity: 0;
    filter: blur(9px);
    transform: translateY(36px);
    clip-path: inset(0 0 18% 0);
    transition:
        opacity .85s var(--ease) var(--reveal-delay, 0ms),
        filter .95s var(--ease) var(--reveal-delay, 0ms),
        transform 1s var(--ease) var(--reveal-delay, 0ms),
        clip-path 1s var(--ease) var(--reveal-delay, 0ms);
}

.js .reveal.is-revealed {
    opacity: 1;
    filter: blur(0);
    transform: translateY(0);
    clip-path: inset(0);
}

/* Cursor */

.cursor-ring {
    display: none;
    width: 34px;
    height: 34px;
    z-index: 19990;
    top: 0;
    left: 0;
    position: fixed;
    border: 1px solid rgba(228, 188, 104, .7);
    border-radius: 50%;
    opacity: 0;
    transform: translate3d(calc(var(--cursor-x, -100px) - 17px), calc(var(--cursor-y, -100px) - 17px), 0);
    pointer-events: none;
    transition: width .35s var(--ease), height .35s var(--ease), opacity .3s, background .35s, border-color .35s;
}

.cursor-ring span {
    width: 3px;
    height: 3px;
    top: 50%;
    left: 50%;
    position: absolute;
    border-radius: 50%;
    background: var(--v3-gold-hot);
    transform: translate(-50%, -50%);
}

.cursor-ring.is-visible {
    opacity: 1;
}

.cursor-ring.is-hover {
    width: 58px;
    height: 58px;
    border-color: rgba(228, 188, 104, .25);
    background: rgba(228, 188, 104, .09);
    transform: translate3d(calc(var(--cursor-x, -100px) - 29px), calc(var(--cursor-y, -100px) - 29px), 0);
}

@media (pointer: fine) {
    .cursor-ring {
        display: block;
    }
}

/* Page transition */

.page-transition {
    z-index: 19000;
    position: fixed;
    inset: 0;
    visibility: hidden;
    pointer-events: none;
}

.page-transition div {
    width: 50.2%;
    top: 0;
    bottom: 0;
    position: absolute;
    background:
        linear-gradient(90deg, rgba(228, 188, 104, .045), transparent),
        #030302;
    transform: scaleX(0);
    transition: transform .68s var(--ease-cinematic);
}

.page-transition div:first-child {
    left: 0;
    transform-origin: left;
}

.page-transition div:nth-child(2) {
    right: 0;
    transform-origin: right;
}

.page-transition > span {
    z-index: 2;
    top: 50%;
    left: 50%;
    position: absolute;
    color: var(--v3-gold);
    font-family: var(--v3-mono);
    font-size: 8px;
    letter-spacing: .16em;
    opacity: 0;
    text-transform: uppercase;
    transform: translate(-50%, -50%);
    transition: opacity .25s .3s;
}

.page-transition.is-active {
    visibility: visible;
}

.page-transition.is-active div {
    transform: scaleX(1);
}

.page-transition.is-active > span {
    opacity: 1;
}

/* Responsive */

@media (max-width: 1100px) {
    .site-header {
        grid-template-columns: auto 1fr auto;
    }

    .desktop-nav {
        justify-self: end;
    }

    .desktop-nav a {
        padding-inline: 12px;
    }

    .header-cta {
        display: none;
    }

    .intro-grid {
        grid-template-columns: 130px minmax(0, 1fr) 300px;
    }

    .service-row {
        grid-template-columns: 46px minmax(250px, .9fr) minmax(250px, 1fr) 40px;
    }
}

@media (max-width: 860px) {
    :root {
        --container: min(90vw, 720px);
    }

    .site-header {
        height: 66px;
        top: 12px;
        right: 12px;
        left: 12px;
        width: calc(100% - 24px);
        padding: 7px 7px 7px 14px;
        grid-template-columns: 1fr auto;
        border-radius: 14px;
    }

    .site-header.is-scrolled {
        top: 7px;
    }

    .brand {
        width: 125px;
        padding-right: 0;
        border-right: 0;
    }

    .brand img {
        width: 118px;
    }

    .desktop-nav,
    .header-cta {
        display: none;
    }

    .menu-toggle {
        display: flex;
    }

    .mobile-menu {
        display: block;
    }

    .mobile-menu__visual {
        height: 35vh;
        margin: 88px 12px 0;
    }

    .mobile-menu__visual > span {
        right: 16px;
        bottom: 14px;
        left: 16px;
    }

    .mobile-menu__panel {
        height: 65vh;
        padding: 24px 22px 24px;
        border-left: 0;
    }

    .mobile-menu__kicker {
        margin-bottom: 13px;
    }

    .mobile-menu nav a {
        min-height: 54px;
        grid-template-columns: 30px 1fr 31px;
        font-size: 27px;
    }

    .mobile-menu nav a > i {
        width: 28px;
        height: 28px;
    }

    .mobile-menu__footer {
        padding-top: 15px;
    }

    .hero--home,
    .page-hero,
    .service-hero {
        min-height: 100svh;
        padding: 10px;
    }

    .hero-reel {
        inset: 10px;
    }

    .hero__frame {
        inset: 68px 19px 19px;
    }

    .hero__content {
        min-height: 100svh;
        padding: 145px 29px 82px;
    }

    .hero__eyebrow {
        display: block;
        padding-bottom: 11px;
    }

    .hero__eyebrow span:last-child {
        display: none;
    }

    .hero__title {
        max-width: 100%;
        margin: 22px 0 25px;
        font-size: clamp(41px, 12.2vw, 49px);
        letter-spacing: -.065em;
    }

    .hero__footer {
        display: grid;
        align-items: start;
        grid-template-columns: 1fr;
        gap: 20px;
    }

    .hero__footer p {
        max-width: 100%;
        margin: 0;
        font-size: 12px;
        line-height: 1.72;
    }

    .hero__footer .button {
        width: max-content;
    }

    .hero__hud--left {
        top: 98px;
        left: 30px;
    }

    .hero__hud--right {
        top: 98px;
        right: 30px;
    }

    .hero-reel__controls {
        right: 26px;
        bottom: 29px;
        flex-direction: row;
        gap: 8px;
    }

    .hero-reel__controls button {
        width: 34px;
        grid-template-columns: 1fr;
    }

    .hero-reel__controls button i,
    .scroll-cue {
        display: none;
    }

    .hero-reel__frame figcaption {
        display: none;
    }

    .hero__spotlight {
        right: -30%;
        width: 90vw;
    }

    .marquee {
        height: 52px;
    }

    .intro-grid {
        grid-template-columns: 1fr;
        gap: 38px;
    }

    .intro-statement h2 {
        font-size: clamp(35px, 9.8vw, 45px);
    }

    .production-card {
        min-height: 390px;
    }

    .section-heading {
        align-items: flex-start;
        flex-direction: column;
    }

    .section-heading h2,
    .process-heading h2,
    .faq-grid h2 {
        font-size: clamp(34px, 9vw, 43px);
    }

    .service-row {
        min-height: 86px;
        padding: 16px 5vw;
        grid-template-columns: 32px 1fr 34px;
        gap: 10px;
    }

    .service-row__copy {
        display: none;
    }

    .service-row__title {
        font-size: 18px;
        line-height: 1.2;
    }

    .service-row__arrow {
        width: 31px;
        height: 31px;
    }

    .cinematic-break {
        min-height: 650px;
    }

    .cinematic-break__content blockquote {
        font-size: clamp(35px, 9vw, 46px);
    }

    .process-layout {
        grid-template-columns: 1fr;
        gap: 36px;
    }

    .process-visual {
        height: 54vh;
        top: auto;
        position: relative;
    }

    .process-list li {
        min-height: 126px;
        opacity: 1;
    }

    .process-list li.is-active {
        padding-left: 18px;
    }

    .work-grid {
        gap: 40px;
    }

    .testimonial-shell {
        min-height: 390px;
        padding: 38px 25px;
    }

    .testimonial blockquote {
        font-size: 28px;
    }

    .page-hero__media,
    .service-hero__media {
        inset: 10px;
    }

    .page-hero__content,
    .service-hero__content {
        min-height: 100svh;
        padding: 150px 18px 68px;
    }

    .page-hero h1,
    .service-hero h1 {
        font-size: clamp(39px, 10.8vw, 48px);
    }

    .page-hero::after,
    .service-hero::after {
        right: 20px;
        bottom: 20px;
        left: 20px;
    }

    .site-loader__reel {
        width: calc(100vw - 42px);
        height: 62vh;
    }

    .site-loader__topline {
        right: 18px;
        left: 18px;
        grid-template-columns: 1fr auto;
    }

    .site-loader__topline span:last-child {
        display: none;
    }

    .site-loader__identity img {
        width: 180px;
    }

    .site-loader__console {
        right: 18px;
        bottom: 18px;
        left: 18px;
        grid-template-columns: 1fr 45px;
        gap: 16px;
    }

    .site-loader__progress {
        display: none;
    }

    .cursor-ring {
        display: none;
    }
}

@media (max-width: 430px) {
    .menu-toggle {
        height: 46px;
        padding-left: 13px;
        gap: 9px;
    }

    .site-header .menu-toggle > .menu-toggle__icon {
        width: 29px;
        height: 29px;
    }

    .mobile-menu__visual {
        height: 30vh;
    }

    .mobile-menu__panel {
        height: 70vh;
        padding: 19px 20px 20px;
    }

    .mobile-menu nav a {
        min-height: 52px;
        font-size: 25px;
    }

    .mobile-menu__footer {
        align-items: flex-start;
        flex-direction: column;
        gap: 4px;
    }

    .hero__content {
        padding-right: 28px;
        padding-left: 28px;
    }

    .hero__title {
        font-size: clamp(39px, 11.6vw, 47px);
    }

    .button {
        min-height: 50px;
    }

    .section {
        padding: 82px 0;
    }
}

@media (prefers-reduced-motion: reduce) {
    .site-loader__shot,
    .site-loader__reel,
    .site-loader__aperture,
    .site-loader__interface,
    .hero-reel__frame,
    .hero__title .line > span {
        transition: none !important;
    }

    .site-loader__grain,
    .site-loader__pulse,
    .site-loader__progress span,
    .hero__spotlight,
    .hero__scan,
    .hero-reel__controls button span::after,
    .production-card::after,
    .production-card__signal span {
        animation: none !important;
    }

    .hero__title .line > span {
        transform: none;
    }

    .cursor-ring {
        display: none !important;
    }
}