@font-face {
    font-family: "Cormorant Garamond"; font-style: normal; font-weight: 300 700; font-display: swap;
    src: url("../fonts/cormorant-normal-latin-ext.woff2") format("woff2");
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
    font-family: "Cormorant Garamond"; font-style: normal; font-weight: 300 700; font-display: swap;
    src: url("../fonts/cormorant-normal-latin.woff2") format("woff2");
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
    font-family: "Cormorant Garamond"; font-style: italic; font-weight: 300 700; font-display: swap;
    src: url("../fonts/cormorant-italic-latin-ext.woff2") format("woff2");
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
    font-family: "Cormorant Garamond"; font-style: italic; font-weight: 300 700; font-display: swap;
    src: url("../fonts/cormorant-italic-latin.woff2") format("woff2");
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
    font-family: "Manrope"; font-style: normal; font-weight: 200 800; font-display: swap;
    src: url("../fonts/manrope-latin-ext.woff2") format("woff2");
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
    font-family: "Manrope"; font-style: normal; font-weight: 200 800; font-display: swap;
    src: url("../fonts/manrope-latin.woff2") format("woff2");
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root {
    --ink: #090a0a;
    --panel: #111313;
    --panel-soft: #181b1b;
    --panel-raised: #1e2120;
    --line: rgba(243, 239, 231, .16);
    --line-strong: rgba(243, 239, 231, .3);
    --paper: #f3efe7;
    --muted: #a8ada8;
    --accent: #ef654c;
    --accent-dim: #9f4335;
    --cyan: #57999b;
    --violet: #6c527a;
    --sans: "Century Gothic", CenturyGothic, AppleGothic, "Trebuchet MS", Arial, sans-serif;
    --serif: "Century Gothic", CenturyGothic, AppleGothic, "Trebuchet MS", Arial, sans-serif;
    --timeline-h: 142px;
    --page-x: clamp(1.25rem, 5.5vw, 6.5rem);
    color-scheme: dark;
}

* { box-sizing: border-box; }
html { scroll-behavior: auto; background: var(--ink); scroll-padding-top: 74px; }
body { margin: 0; padding-bottom: var(--timeline-h); overflow-x: hidden; color: var(--paper); background: var(--ink); font: 400 1rem/1.7 var(--sans); }
html, body { scrollbar-width: none; }
html::-webkit-scrollbar, body::-webkit-scrollbar { display: none; width: 0; height: 0; }
body.menu-open, body.dialog-open { overflow: hidden; }
a { color: inherit; text-decoration: none; }
button, input, select, textarea { color: inherit; font: inherit; }
button { cursor: pointer; }
img, video { display: block; max-width: 100%; }
::selection { color: #140b09; background: var(--accent); }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.skip-link { position: fixed; left: 1rem; top: -5rem; z-index: 100; padding: .7rem 1rem; background: var(--paper); color: var(--ink); }
.skip-link:focus { top: 1rem; }
:focus-visible { outline: 2px solid var(--accent); outline-offset: 4px; }

.topbar {
    position: fixed; inset: 0 0 auto; z-index: 30; height: 74px; display: grid;
    grid-template-columns: 1fr auto 1fr; align-items: center; gap: 2rem; padding: 0 var(--page-x);
    border-bottom: 1px solid rgba(255,255,255,.1); background: linear-gradient(#090a0aeb, #090a0a6b); backdrop-filter: blur(16px);
    transition: background .25s ease, height .25s ease;
}
.topbar.is-scrolled { height: 62px; background: rgba(9,10,10,.94); }
.brand { display: inline-flex; align-items: center; gap: .7rem; width: max-content; font-size: .8rem; font-weight: 600; letter-spacing: .17em; }
.brand-mark { width: 9px; height: 9px; background: var(--accent); transform: rotate(45deg); box-shadow: 8px 8px 0 var(--paper); }
.desktop-nav { display: flex; gap: clamp(1rem, 2.2vw, 2.4rem); color: #c3c5c0; font-size: .75rem; letter-spacing: .11em; text-transform: uppercase; }
.desktop-nav a, .nav-cta { position: relative; transition: color .2s ease; }
.desktop-nav a::after { content: ""; position: absolute; inset: auto 0 -.55rem; height: 1px; transform: scaleX(0); transform-origin: left; background: var(--accent); transition: transform .2s ease; }
.desktop-nav a:hover::after, .desktop-nav a:focus-visible::after, .desktop-nav a.is-active::after { transform: scaleX(1); }
.desktop-nav a:hover, .desktop-nav a:focus-visible, .nav-cta:hover, .nav-cta:focus-visible { color: white; }
.nav-cta { justify-self: end; padding-bottom: .25rem; border-bottom: 1px solid var(--accent); font-size: .75rem; font-weight: 600; letter-spacing: .11em; text-transform: uppercase; }
.menu-toggle { display: none; justify-self: end; width: 42px; height: 42px; padding: 0; border: 1px solid var(--line); background: transparent; }
.menu-toggle > span:not(.sr-only) { display: block; width: 18px; height: 1px; margin: 5px auto; background: var(--paper); transition: transform .2s ease; }
.menu-toggle[aria-expanded="true"] > span:first-child { transform: translateY(3px) rotate(45deg); }
.menu-toggle[aria-expanded="true"] > span:nth-child(2) { transform: translateY(-3px) rotate(-45deg); }
.mobile-menu { position: fixed; inset: 64px 0 var(--timeline-h); z-index: 29; padding: 2rem 1.25rem; background: rgba(9,10,10,.98); }
.mobile-menu[hidden] { display: none; }
.mobile-menu-time { display: flex; justify-content: space-between; margin-bottom: 1.5rem; color: var(--muted); font-size: .75rem; letter-spacing: .12em; }
.mobile-menu > a { display: grid; grid-template-columns: 64px 1fr; align-items: baseline; padding: .65rem 0; border-top: 1px solid var(--line); font: 500 clamp(1.65rem, 8vw, 2.5rem)/1.15 var(--serif); }
.mobile-menu > a span { color: var(--accent); font: 500 .75rem/1 var(--sans); letter-spacing: .08em; }

.hero { position: relative; min-height: 100svh; display: flex; align-items: flex-end; padding: 9rem var(--page-x) calc(var(--timeline-h) + 5rem); overflow: hidden; }
.hero-media, .hero-vignette { position: absolute; inset: 0; }
.hero-media { background: #202422; overflow: hidden; container-type: size; }
.hero-youtube { position: absolute; top: 50%; left: 50%; width: 100%; height: 100%; min-width: 100%; min-height: 100%; width: max(100cqw, 177.778cqh); height: max(100cqh, 56.25cqw); max-width: none; border: 0; transform: translate(-50%, -50%); pointer-events: none; }
.hero-media > video, .placeholder-media > img, .placeholder-media > video { width: 100%; height: 100%; object-fit: cover; }
.placeholder-shot { position: absolute; inset: 0; background-position: center; background-size: cover; }
.placeholder-shot--one { background: radial-gradient(circle at 67% 34%, #777d74 0 3%, transparent 3.5%), radial-gradient(ellipse at 67% 59%, #353b37 0 11%, transparent 11.5%), linear-gradient(120deg, transparent 0 39%, #3b413c 39% 55%, transparent 55%), linear-gradient(165deg, #60665f 0 45%, #292e2b 46% 72%, #121414 73%); filter: saturate(.55); opacity: .9; transform: scale(1.03); }
.placeholder-shot--two { background: linear-gradient(90deg, transparent 0 60%, rgba(240,235,221,.13) 60% 72%, transparent 72%); mix-blend-mode: screen; }
.media-placeholder { position: absolute; top: 1rem; right: 1rem; z-index: 2; padding: .35rem .55rem; border: 1px solid rgba(255,255,255,.25); color: #dad8d1; font-size: .75rem; letter-spacing: .12em; }
.hero .media-placeholder { top: 97px; right: var(--page-x); }
.film-grain { position: absolute; inset: -25%; opacity: .1; background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.75' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.55'/%3E%3C/svg%3E"); animation: grain .5s steps(2) infinite; }
.hero-vignette { background: linear-gradient(90deg, rgba(5,6,6,.91) 0%, rgba(5,6,6,.53) 45%, rgba(5,6,6,.06) 77%), linear-gradient(0deg, #090a0a 0%, transparent 46%); }
.hero-content { position: relative; z-index: 2; min-width: 0; width: min(900px, 90vw); }
.hero-logo { display: block; width: clamp(180px, 24vw, 340px); height: auto; margin: 0 0 1.75rem; filter: drop-shadow(0 12px 30px rgba(0,0,0,.3)); }
.eyebrow, .kicker { margin: 0 0 1.2rem; color: var(--accent); font-size: .75rem; font-weight: 600; letter-spacing: .15em; text-transform: uppercase; }
.eyebrow { display: flex; flex-wrap: wrap; align-items: center; gap: .4rem .75rem; color: #caccc7; line-height: 1.45; }
.eyebrow span { color: var(--accent); }
.eyebrow span::before { content: ""; display: inline-block; width: 6px; height: 6px; margin: 0 .45rem .05rem 0; border-radius: 50%; background: currentColor; box-shadow: 0 0 0 4px rgba(239,101,76,.15); }
h1 { margin: 0; font: 400 clamp(3.5rem, 9.6vw, 9rem)/.76 var(--serif); letter-spacing: -.055em; text-wrap: balance; }
.tagline { margin: 1.8rem 0 0; font: italic 500 clamp(1.5rem, 2.5vw, 2.3rem)/1.2 var(--serif); color: #ded9d0; }
.hero-statement { display: flex; flex-direction: column; margin-top: 2.4rem; padding-left: 1.1rem; border-left: 1px solid var(--accent); }
.hero-statement strong { font: 500 clamp(1.25rem, 2vw, 1.75rem)/1.2 var(--serif); }
.hero-statement span { color: #bfc1bc; font-size: 1rem; }
.hero-actions { display: flex; flex-wrap: wrap; gap: .8rem; margin-top: 2.2rem; }
.button { display: inline-flex; align-items: center; justify-content: space-between; gap: 2rem; min-height: 50px; padding: .8rem 1rem; border: 1px solid var(--line); background: transparent; font-size: .75rem; font-weight: 600; letter-spacing: .11em; text-transform: uppercase; transition: transform .2s ease, background .2s ease, border-color .2s ease; }
.button:hover { transform: translateY(-2px); border-color: var(--paper); }
.button--primary { min-width: 270px; border-color: var(--accent); background: var(--accent); color: #140b09; }
.button--ghost { background: rgba(10,11,11,.25); backdrop-filter: blur(10px); }
.scroll-cue { position: absolute; right: var(--page-x); bottom: calc(var(--timeline-h) + 3.4rem); z-index: 3; display: flex; align-items: center; gap: .75rem; color: #a4a7a2; font-size: .75rem; letter-spacing: .14em; }
.scroll-cue span { display: block; width: 34px; height: 1px; background: var(--accent); }

.section { position: relative; padding: clamp(6rem, 11vw, 11rem) var(--page-x); border-top: 1px solid rgba(255,255,255,.08); }
.section-grid { display: grid; grid-template-columns: minmax(260px, .8fr) minmax(400px, 1.2fr); gap: clamp(3rem, 8vw, 9rem); }
.section-grid--wide { grid-template-columns: minmax(320px, 1.1fr) minmax(330px, .9fr); }
.section-heading h2, .films-heading h2, .packages-heading h2, .reviews-heading h2, .faq-heading h2, .contact-heading h2, .tech-heading h2, .about-copy h2 {
    margin: 0; max-width: 930px; font: 500 clamp(2.8rem, 6.5vw, 6.5rem)/.92 var(--serif); letter-spacing: -.04em; text-wrap: balance;
}
.section-heading h2 em { color: var(--muted); font-weight: 500; }
.section-intro { max-width: 570px; margin: 2rem 0 0; color: var(--muted); font-size: 1.05rem; }
.section-heading--sticky { align-self: start; position: sticky; top: 110px; }

.section--why { background: radial-gradient(circle at 82% 22%, rgba(87,153,155,.08), transparent 30%), var(--ink); }
.why-copy { align-self: end; max-width: 620px; padding-top: 8rem; color: #c2c5c0; font-size: clamp(1.05rem, 1.35vw, 1.25rem); }
.why-copy blockquote { margin: 2.5rem 0 0; padding: 0 0 0 1.4rem; border-left: 1px solid var(--accent); color: var(--paper); font: italic 500 clamp(1.5rem, 2.4vw, 2.2rem)/1.25 var(--serif); }
.moments-strip { display: grid; grid-template-columns: repeat(4, 1fr); gap: .6rem; margin-top: clamp(4rem, 8vw, 8rem); }
.moment-card { position: relative; aspect-ratio: 3/4; overflow: hidden; border: 1px solid rgba(255,255,255,.1); background: linear-gradient(150deg, rgba(255,255,255,.11), transparent 40%), linear-gradient(30deg, #171b1a, #303632); }
.moment-card:nth-child(2) { margin-top: 3rem; background: linear-gradient(160deg, #3d4039, #171918 62%); }
.moment-card:nth-child(3) { background: linear-gradient(130deg, #171918, #353b3a 63%); }
.moment-card:nth-child(4) { margin-top: 3rem; background: linear-gradient(30deg, #242a27, #454840); }
.moment-card > span:last-child { position: absolute; inset: auto 1rem 1rem; color: rgba(255,255,255,.65); font-size: .75rem; letter-spacing: .1em; }
.frame-corner { position: absolute; inset: 1rem auto auto 1rem; width: 24px; height: 24px; border-top: 1px solid var(--accent); border-left: 1px solid var(--accent); }

.section--style { background: var(--panel); }
.style-list { display: flex; flex-direction: column; gap: 4.5rem; }
.style-card { display: grid; grid-template-columns: 46% 1fr; gap: 2rem; align-items: center; }
.style-preview { position: relative; aspect-ratio: 16/9; overflow: hidden; background: linear-gradient(145deg, rgba(239,101,76,.12), transparent 40%), linear-gradient(35deg, #171a19, #343a36); }
.style-preview::before { content: ""; position: absolute; width: 40%; height: 56%; left: 30%; top: 25%; border-radius: 50% 50% 4px 4px; background: rgba(237,234,224,.09); filter: blur(1px); }
.style-preview > span { position: absolute; z-index: 2; left: 1rem; top: 1rem; color: var(--accent); font-size: .75rem; }
.style-preview > i { position: absolute; z-index: 2; inset: 12px; border: 1px solid rgba(255,255,255,.1); }
.style-preview > b { position: absolute; z-index: 2; right: 1rem; bottom: 1rem; font-size: .75rem; font-weight: 500; letter-spacing: .11em; }
.style-card h3, .custom-card h3, .partner-card h3 { margin: .3rem 0 .8rem; font: 500 clamp(2rem, 3vw, 3rem)/1 var(--serif); }
.style-card p, .custom-card p, .partner-card p { margin: 0; color: var(--muted); }
.play-button { position: absolute; left: 50%; top: 50%; display: grid; place-items: center; width: 88px; height: 88px; border: 1px solid rgba(255,255,255,.7); border-radius: 50%; transform: translate(-50%,-50%); background: rgba(8,9,9,.28); backdrop-filter: blur(6px); transition: transform .25s ease, background .25s ease; }
.video-open:hover .play-button { transform: translate(-50%,-50%) scale(1.08); background: var(--accent); }
.play-button i { width: 0; height: 0; margin-left: 5px; border-top: 8px solid transparent; border-bottom: 8px solid transparent; border-left: 13px solid var(--paper); }
.frame-time { position: absolute; inset: auto 1.5rem 1.5rem auto; color: var(--accent); font-size: .8rem; letter-spacing: .1em; }
.section--films { padding-inline: 0; background: linear-gradient(180deg, #0c0e0e, var(--ink)); }
.films-heading { display: grid; grid-template-columns: 1fr 1fr; align-items: end; padding: 0 var(--page-x) 3rem; }
.films-heading .kicker { grid-column: 1 / -1; }
.films-heading h2 { font-size: clamp(4rem, 9vw, 9rem); }
.films-heading > p:last-child { max-width: 380px; justify-self: end; color: var(--muted); }
.film-list { border-top: 1px solid var(--line); }
.film-card { position: relative; display: grid; grid-template-columns: minmax(320px, .9fr) 1.1fr; gap: clamp(1rem, 3vw, 3rem); align-items: center; width: 100%; padding: 1.2rem var(--page-x); border: 0; border-bottom: 1px solid var(--line); text-align: left; background: transparent; transition: background .3s ease; }
.film-card:hover { background: rgba(255,255,255,.035); }
.film-preview { position: relative; aspect-ratio: 16/9; overflow: hidden; background: linear-gradient(145deg, rgba(239,101,76,.12), transparent 40%), linear-gradient(30deg, #242827, #3c433e); }
.film-card--cyan .film-preview { background: linear-gradient(145deg, rgba(87,153,155,.18), transparent 44%), linear-gradient(30deg, #1a2020, #363f3c); }
.film-card--amber .film-preview { background: linear-gradient(145deg, rgba(190,146,63,.18), transparent 44%), linear-gradient(30deg, #1e1d19, #454136); }
.film-card--green .film-preview { background: linear-gradient(145deg, rgba(73,123,92,.2), transparent 44%), linear-gradient(30deg, #171c19, #334139); }
.film-card--violet .film-preview { background: linear-gradient(145deg, rgba(108,82,122,.22), transparent 44%), linear-gradient(30deg, #1a181d, #3f3943); }
.film-preview::before { content: ""; position: absolute; left: 42%; top: 25%; width: 20%; height: 58%; border-radius: 50% 50% 3px 3px; background: rgba(240,237,229,.08); }
.film-timecode { position: absolute; top: 1rem; left: 1rem; z-index: 2; color: var(--accent); font-size: .75rem; letter-spacing: .1em; }
.play-button--small { width: 58px; height: 58px; }
.film-info { display: grid; grid-template-columns: 1fr 110px 90px; gap: 1.5rem; align-items: end; }
.film-info > span { display: flex; flex-direction: column; }
.film-info strong { font: 500 clamp(1.6rem, 2.5vw, 2.5rem)/1.05 var(--serif); }
.film-info em { margin-top: .4rem; color: var(--muted); font-style: normal; }
.film-info small { margin-bottom: .25rem; color: #737874; font-size: .75rem; letter-spacing: .1em; }

.section--workflow { background: radial-gradient(circle at 80% 30%, rgba(108,82,122,.11), transparent 33%), var(--panel); }
.multicam { display: grid; grid-template-columns: repeat(2, 1fr); gap: .65rem; align-self: end; }
.multicam-monitor { position: relative; aspect-ratio: 16/10; padding: .75rem; border: 1px solid var(--line); background: linear-gradient(140deg, #323734, #171918); color: #aeb2ad; font-size: .75rem; letter-spacing: .1em; }
.multicam-monitor:nth-child(2) { background: linear-gradient(140deg, #2c3030, #151717); }
.multicam-monitor:nth-child(3) { grid-column: 1 / -1; aspect-ratio: 16/5; background: linear-gradient(140deg, #383a34, #171918); }
.multicam-monitor b { position: absolute; inset: auto .75rem .75rem auto; color: var(--paper); font-size: .75rem; font-weight: 500; }
.multicam-audio { grid-column: 1 / -1; display: flex; align-items: center; gap: 2px; height: 34px; padding: 4px; border: 1px solid var(--line); }
.multicam-audio span { width: 50px; color: var(--muted); font-size: .75rem; }
.multicam-audio i { flex: 1; height: calc(15% + var(--wave, 25%)); background: var(--cyan); }.multicam-audio i:nth-child(2n) { height: 70%; }.multicam-audio i:nth-child(3n) { height: 38%; }
.workflow-quote { max-width: 1250px; margin: clamp(5rem, 9vw, 9rem) auto 0; text-align: center; color: var(--paper); font: italic 500 clamp(1.65rem, 2.65vw, 2.5rem)/1.35 var(--serif); }
.workflow-quote span { display: block; white-space: nowrap; }

.section--packages { background: #0c0d0d; }
.packages-heading { display: grid; grid-template-columns: 1fr minmax(300px, .7fr); gap: 2rem; align-items: end; margin-bottom: 4rem; }
.packages-heading .kicker { grid-column: 1 / -1; }
.packages-heading p:last-child { margin: 0; color: var(--muted); }
.packages-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: .75rem; align-items: stretch; }
.package-card { position: relative; display: flex; flex-direction: column; padding: 1.5rem; border: 1px solid var(--line); background: var(--panel); }
.package-card--featured { border-color: var(--accent); background: linear-gradient(180deg, rgba(239,101,76,.08), transparent 28%), var(--panel); }
.package-topline { display: flex; justify-content: space-between; gap: 1rem; min-height: 24px; color: #777d78; font-size: .75rem; letter-spacing: .08em; }
.package-topline strong { color: var(--accent); font-weight: 600; }
.package-card h3 { min-height: 2.1em; margin: 2rem 0 .6rem; font: 500 clamp(2.2rem, 3.7vw, 3.8rem)/.9 var(--serif); }
.package-subtitle { min-height: 3.4em; margin: 0; color: var(--muted); }
.package-price { margin: 1.5rem 0; font: 500 1.7rem/1 var(--serif); }
.mini-timeline { padding: .6rem 0; border-block: 1px solid var(--line); }
.mini-timeline > div { display: grid; grid-template-columns: 90px 1fr; align-items: center; height: 24px; }
.mini-timeline span { color: #7f8580; font-size: .75rem; }
.mini-timeline i { display: block; height: 12px; background: repeating-linear-gradient(90deg, #3c686a 0 13%, transparent 13% 15%, #3c686a 15% 32%, transparent 32% 35%); }
.mini-timeline > div:nth-child(2n) i { background: repeating-linear-gradient(90deg, #5c486a 0 25%, transparent 25% 27%, #5c486a 27% 52%, transparent 52% 55%); }
.package-card ul { flex: 1; margin: 1.4rem 0; padding: 0; list-style: none; }
.package-card li { position: relative; padding: .55rem 0 .55rem 1.2rem; border-bottom: 1px solid rgba(255,255,255,.06); color: #c1c4bf; font-size: .9rem; }
.package-card li::before { content: ""; position: absolute; left: 0; top: 1.2rem; width: 5px; height: 5px; background: var(--accent); }
.package-card .button { width: 100%; margin-top: auto; flex-shrink: 0; }
.package-card--featured .button { border-color: var(--accent); }

.section--custom { background: var(--panel); }
.section--custom > .section-heading { max-width: 950px; margin-bottom: 4rem; }
.custom-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: .8rem; }
.custom-card { min-height: 380px; display: flex; flex-direction: column; padding: clamp(1.5rem, 3vw, 3rem); border: 1px solid var(--line); background: linear-gradient(135deg, rgba(255,255,255,.025), transparent); }
.custom-card h3 { margin-top: auto; max-width: 500px; }
.custom-card p { max-width: 620px; }
.text-link { align-self: flex-start; margin-top: 1.5rem; padding-bottom: .2rem; border-bottom: 1px solid var(--accent); font-size: .75rem; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; }
.text-link span { margin-left: .6rem; color: var(--accent); }

.section--about { display: grid; grid-template-columns: minmax(320px, .9fr) minmax(340px, 1.1fr); gap: clamp(3rem, 8vw, 9rem); align-items: center; background: #0b0c0c; }
.about-media { position: relative; aspect-ratio: 4/5; overflow: hidden; background: radial-gradient(circle at 50% 30%, rgba(232,229,219,.18), transparent 10%), radial-gradient(ellipse at 50% 57%, rgba(232,229,219,.1), transparent 25%), linear-gradient(145deg, #3a3e3a, #131515 66%); }
.focus-bracket { position: absolute; left: 50%; top: 42%; width: 38%; height: 38%; transform: translate(-50%,-50%); border: 1px solid rgba(239,101,76,.65); }
.focus-bracket::before { content: "+"; position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); color: var(--accent); }
.about-copy > p:not(.kicker) { max-width: 630px; color: var(--muted); font-size: 1.05rem; }
.about-copy h2 { margin-bottom: 2rem; }
.signature { display: block; margin-top: 2rem; color: var(--paper); font: italic 500 1.5rem/1 var(--serif); }

.section--tech { text-align: center; background: radial-gradient(circle at 50% 45%, rgba(87,153,155,.1), transparent 35%), var(--panel); }
.tech-heading h2 { margin-inline: auto; max-width: 1050px; }
.tech-brands { display: grid; grid-template-columns: repeat(3, 1fr); max-width: 1050px; margin: 5rem auto 2rem; border-block: 1px solid var(--line); }
.tech-brands > div { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 1rem; min-height: 150px; padding: 2rem 1rem; border-left: 1px solid var(--line); }
.tech-brands > div:first-child { border-left: 0; }
.tech-brands strong { font: 500 clamp(2.4rem, 5vw, 5rem)/1 var(--serif); letter-spacing: -.03em; }
.tech-logo { width: min(78%, 250px); height: 64px; object-fit: contain; filter: grayscale(1) brightness(0) invert(1); opacity: .94; }
.tech-brands span { color: var(--muted); font-size: .8rem; letter-spacing: .12em; text-transform: uppercase; }
.tech-note { max-width: 650px; margin: 0 auto; color: #858a85; font-size: .85rem; }

.section--partners { background: #0b0c0c; }
.partners-intro { max-width: 600px; padding-top: 4rem; }
.partners-intro p { color: #c3c5c1; font-size: 1.05rem; }
.partners-intro small { display: block; margin-top: 1.5rem; padding-left: 1rem; border-left: 1px solid var(--accent); color: var(--muted); font-size: .8rem; }
.partner-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: .7rem; margin-top: 5rem; }
.partner-card { padding-bottom: 1.4rem; border-bottom: 1px solid var(--line); }
.partner-image { position: relative; aspect-ratio: 4/3; margin-bottom: 1.2rem; overflow: hidden; background: linear-gradient(140deg, #2f3431, #151716); }
.partner-image span { position: absolute; left: .8rem; bottom: .7rem; color: #a4a8a3; font-size: .75rem; letter-spacing: .08em; }
.partner-category { color: var(--accent); font-size: .75rem; letter-spacing: .11em; text-transform: uppercase; }
.partner-card h3 { font-size: 2rem; }
.partner-card p { font-size: .9rem; }
.partner-card blockquote { margin: 1rem 0; color: #c7c9c5; font: italic 500 1.15rem/1.3 var(--serif); }
.partner-card > small { color: #7c817c; font-size: .75rem; }
.partner-links { display: flex; gap: 1rem; margin-top: 1rem; font-size: .75rem; text-transform: uppercase; }
.partner-links a { border-bottom: 1px solid var(--accent); }

.section--reviews { background: var(--panel); }
.reviews-heading { max-width: 980px; margin-bottom: 4rem; }
.reviews-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: .8rem; }
.review-card { display: grid; grid-template-columns: 90px 1fr; gap: 1.25rem; padding: 1.4rem; border: 1px solid var(--line); }
.review-photo { aspect-ratio: 1; background: linear-gradient(145deg, #3d423e, #1b1e1c); }
.review-photo span { display: block; padding: .5rem; color: #a7aaa6; font-size: .75rem; }
.review-card blockquote { grid-column: 1 / -1; min-height: 150px; margin: 1.5rem 0 0; font: italic 500 clamp(1.35rem, 2vw, 1.9rem)/1.25 var(--serif); }
.review-card p { grid-column: 1 / -1; margin: 0; font-size: .85rem; font-weight: 600; }
.review-card p span { display: block; color: var(--muted); font-size: .75rem; font-weight: 400; }

.section--faq { display: grid; grid-template-columns: minmax(280px, .8fr) minmax(420px, 1.2fr); gap: clamp(3rem, 8vw, 9rem); background: #0b0c0c; }
.faq-heading { position: sticky; top: 110px; align-self: start; }
.faq-heading h2 { font-size: clamp(2.7rem, 5vw, 5.2rem); }
.faq-list { border-top: 1px solid var(--line); }
.faq-list details { border-bottom: 1px solid var(--line); }
.faq-list summary { position: relative; display: grid; grid-template-columns: 1fr 20px; gap: 1rem; align-items: center; padding: 1.35rem 0; cursor: pointer; list-style: none; font-weight: 500; }
.faq-list summary::-webkit-details-marker { display: none; }
.faq-list summary i { position: relative; width: 16px; height: 16px; }
.faq-list summary i::before, .faq-list summary i::after { content: ""; position: absolute; left: 0; top: 7px; width: 16px; height: 1px; background: var(--paper); transition: transform .2s ease; }
.faq-list summary i::after { transform: rotate(90deg); }
.faq-list details[open] summary i::after { transform: rotate(0); }
.faq-list details > div { display: grid; grid-template-rows: 0fr; transition: grid-template-rows .3s ease; }
.faq-list details[open] > div { grid-template-rows: 1fr; }
.faq-list details > div p { min-height: 0; overflow: hidden; margin: 0 0 1.5rem; max-width: 630px; color: var(--muted); }

.section--contact { display: grid; grid-template-columns: minmax(300px, .8fr) minmax(440px, 1.2fr); gap: clamp(3rem, 8vw, 9rem); background: radial-gradient(circle at 18% 20%, rgba(239,101,76,.11), transparent 31%), var(--panel); }
.contact-heading { align-self: start; position: sticky; top: 110px; }
.contact-heading h2 { font-size: clamp(3.5rem, 7vw, 7rem); }
.contact-heading > p:not(.kicker) { color: var(--muted); font: italic 500 1.6rem/1.2 var(--serif); }
.contact-line { display: grid; grid-template-columns: 80px 1fr; gap: 1rem; padding: .7rem 0; border-top: 1px solid var(--line); font-size: .75rem; letter-spacing: .08em; }
.contact-line:first-of-type { margin-top: 3rem; }
.contact-line span { color: #737873; }
.contact-line strong { font-weight: 500; }
.status-ready { color: var(--cyan); }
.contact-form { display: flex; flex-direction: column; gap: 1.25rem; }
.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.contact-form label { display: flex; flex-direction: column; gap: .5rem; color: #b9bcb7; font-size: .8rem; font-weight: 600; letter-spacing: .07em; text-transform: uppercase; }
.contact-form input, .contact-form select, .contact-form textarea { width: 100%; padding: .85rem 0; border: 0; border-bottom: 1px solid var(--line-strong); border-radius: 0; background: transparent; color: var(--paper); font-size: 1rem; letter-spacing: normal; text-transform: none; outline: none; transition: border-color .2s ease; }
.contact-form select { background-color: var(--panel); }
.contact-form textarea { resize: vertical; }
.contact-form input:focus, .contact-form select:focus, .contact-form textarea:focus { border-color: var(--accent); }
.contact-form [aria-invalid="true"] { border-color: #ff836e; }
.contact-form .field-error { color: #ff9a88; font-size: .75rem; letter-spacing: 0; text-transform: none; }
.honeypot { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
.form-privacy { margin: 0; color: #7d827d; font-size: .75rem; }
.form-footer { display: flex; gap: 2rem; align-items: center; }
.form-footer p { margin: 0; max-width: 340px; color: var(--muted); font: italic 500 1.15rem/1.3 var(--serif); }
.contact-form button[disabled] { cursor: wait; opacity: .65; }
.form-status { min-height: 28px; padding-left: 1rem; border-left: 1px solid transparent; color: var(--muted); }
.form-status.is-success { border-color: var(--cyan); color: #9ac7c5; }
.form-status.is-error { border-color: #ff836e; color: #ffae9f; }

.footer { display: grid; grid-template-columns: 1fr auto; gap: 1.5rem 3rem; align-items: end; padding: 5rem var(--page-x) 3rem; border-top: 1px solid var(--line); background: #070808; }
.footer-brand { font-size: .8rem; }
.footer > p { grid-column: 1 / -1; margin: 1rem 0 2rem; font: italic 500 clamp(2.5rem, 6vw, 6rem)/1 var(--serif); }
.footer > div { display: flex; gap: 1.5rem; font-size: .8rem; letter-spacing: .08em; text-transform: uppercase; }
.footer > div a { border-bottom: 1px solid var(--accent); }
.footer small { grid-column: 1 / -1; max-width: 850px; color: #747974; font-size: .75rem; }
.footer > span { justify-self: end; color: #747974; font-size: .75rem; }

.master-timeline { position: fixed; z-index: 25; inset: auto 0 0; height: var(--timeline-h); padding: 0 2.5rem 12px 5.7rem; overflow: hidden; border-top: 1px solid #343737; background: rgba(14,16,16,.96); box-shadow: 0 -18px 45px rgba(0,0,0,.3); backdrop-filter: blur(16px); }
.timeline-time { height: 30px; display: flex; align-items: center; justify-content: space-between; color: #8f938f; font: 500 .75rem/1 var(--sans); letter-spacing: .09em; }
.timeline-time span:first-child { color: var(--accent); }
.timeline-time span:nth-child(2) { color: #c0c4bf; }
.timeline-stage { position: relative; }
.track { position: relative; display: flex; align-items: center; height: 30px; border-top: 1px solid rgba(255,255,255,.07); }
.track > span { position: absolute; left: -4.55rem; width: 4rem; color: #777c78; font-size: .75rem; letter-spacing: .07em; }
.timeline-clips { position: relative; width: 100%; height: 19px; overflow: hidden; background: #151818; }
.timeline-clip { position: absolute; inset-block: 0; display: block; min-width: 2px; border: 1px solid rgba(190,226,224,.2); border-right: 2px solid #0e1010; opacity: .62; transform-origin: center; transition: opacity .25s ease, filter .25s ease, transform .25s ease; }
.timeline-clip--intro { background: linear-gradient(90deg, #47797b 0 36%, #315557 36% 68%, #426e70 68%); }
.timeline-clip--story { background: linear-gradient(110deg, #365b5d, #213c3e 58%, #4b6c69); }
.timeline-clip--style { background: repeating-linear-gradient(90deg, #416d6f 0 18%, #273f41 18% 23%, #527d78 23% 41%, #1d3032 41% 46%); }
.timeline-clip--films { background: repeating-linear-gradient(90deg, #304f51 0 17%, #456f72 17% 31%, #22393b 31% 34%); }
.timeline-clip--multicam { background: repeating-linear-gradient(90deg, #4c7c7e 0 9%, #60496a 9% 16%, #2b4c4e 16% 25%, #725442 25% 29%); }
.timeline-clip--packages { background: linear-gradient(90deg, #34595b 0 32%, #765263 32% 65%, #405f54 65%); }
.timeline-clip--custom { background: linear-gradient(90deg, #563f61 0 48%, #171c1c 48% 52%, #42696b 52%); }
.timeline-clip--portrait { background: linear-gradient(105deg, #63584c, #383c38 54%, #776451); }
.timeline-clip--tech { background: repeating-linear-gradient(90deg, #4d5654 0 28%, #242a29 28% 33%); }
.timeline-clip--partners { background: repeating-linear-gradient(90deg, #3f6768 0 20%, #253f40 20% 24%, #654e42 24% 43%, #202f30 43% 47%); }
.timeline-clip--reviews { background: repeating-linear-gradient(90deg, #624a6c 0 25%, #332b39 25% 29%, #4e7070 29% 54%); }
.timeline-clip--faq { background: repeating-linear-gradient(90deg, #384f50 0 8%, #1d2829 8% 11%); }
.timeline-clip--contact { background: linear-gradient(90deg, #71473f, var(--accent)); }
.track--voice .timeline-clip { border-color: rgba(205,177,220,.22); box-shadow: inset 0 0 0 999px rgba(91,65,104,.35); }
.track--voice .timeline-clip--story, .track--voice .timeline-clip--reviews { box-shadow: inset 0 0 0 999px rgba(112,77,127,.12); }
.track--atmos .timeline-clip { border-color: rgba(100,160,155,.2); box-shadow: inset 0 0 0 999px rgba(22,56,54,.52); }
.timeline-clip.is-current { z-index: 2; opacity: 1; filter: brightness(1.38) saturate(1.12); transform: scaleY(1.08); outline: 1px solid rgba(255,255,255,.34); outline-offset: -1px; }
.timeline-chapter-links { position: absolute; z-index: 6; inset: 0; }
.timeline-seek-link { position: absolute; inset-block: 0; min-width: 2px; border-inline: 1px solid transparent; transition: background .2s ease, border-color .2s ease; }
.timeline-seek-link:hover { border-color: rgba(255,255,255,.18); background: rgba(255,255,255,.07); }
.timeline-seek-link:focus-visible { z-index: 2; outline: 2px solid var(--accent); outline-offset: -2px; background: rgba(239,101,76,.1); }
.chapter-markers { position: absolute; inset: -5px 0 auto; height: 5px; }
.chapter-markers i { position: absolute; width: 1px; height: 5px; background: rgba(255,255,255,.3); }
.playhead { position: absolute; z-index: 5; top: -9px; bottom: 0; left: 0; width: 1px; background: var(--accent); will-change: left; transition: left .12s linear; pointer-events: none; }
.playhead b { position: absolute; top: 0; left: -5px; width: 11px; height: 8px; background: var(--accent); clip-path: polygon(0 0,100% 0,50% 100%); }

.video-dialog, .contact-dialog { max-width: none; padding: 0; border: 1px solid var(--line-strong); background: var(--panel); color: var(--paper); box-shadow: 0 30px 100px rgba(0,0,0,.7); }
.video-dialog { width: min(1100px, calc(100vw - 2rem)); }
.contact-dialog { width: min(1180px, calc(100vw - 3rem)); max-height: calc(100dvh - 2rem); overflow-y: auto; opacity: 0; transform: translateY(22px) scale(.975); transform-origin: center; transition: opacity .34s ease, transform .34s cubic-bezier(.22,.8,.25,1); }
.contact-dialog.is-open { opacity: 1; transform: translateY(0) scale(1); }
.contact-dialog.is-closing { transition-duration: .24s; }
.video-dialog::backdrop { background: rgba(0,0,0,.86); backdrop-filter: blur(8px); }
.contact-dialog::backdrop { background: rgba(0,0,0,0); backdrop-filter: blur(0); transition: background .34s ease, backdrop-filter .34s ease; }
.contact-dialog.is-open::backdrop { background: rgba(0,0,0,.86); backdrop-filter: blur(8px); }
.contact-dialog.is-closing::backdrop { transition-duration: .24s; }
.dialog-bar { display: flex; justify-content: space-between; align-items: center; padding: .8rem 1rem; border-bottom: 1px solid var(--line); font-size: .75rem; letter-spacing: .1em; }
.dialog-bar button { padding: .3rem; border: 0; background: transparent; color: var(--muted); }
.contact-dialog .dialog-bar { position: sticky; top: 0; z-index: 3; background: rgba(17,19,19,.96); backdrop-filter: blur(14px); }
.contact-dialog-intro { padding: 1.4rem 2rem 0; }
.contact-dialog-intro .kicker { margin-bottom: .55rem; }
.contact-dialog-intro h2 { margin: 0; font: 500 clamp(2rem, 3.5vw, 3.25rem)/1 var(--serif); }
.contact-dialog .contact-form { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem 1.5rem; padding: 1.5rem 2rem 2rem; }
.contact-dialog .form-row,
.contact-dialog .modal-message-field,
.contact-dialog .form-privacy,
.contact-dialog .form-footer,
.contact-dialog .form-status { grid-column: 1 / -1; }
.dialog-video { position: relative; aspect-ratio: 16/9; background: linear-gradient(145deg, #343a36, #111312 70%); }
.dialog-video > video, .dialog-video > iframe { position: absolute; inset: 0; z-index: 2; width: 100%; height: 100%; border: 0; background: #000; }
.dialog-placeholder { position: absolute; inset: 0; }

.reveal { opacity: 1; transform: translateY(0); transition: opacity .75s ease, transform .75s cubic-bezier(.2,.7,.2,1); }
.reveal.is-pending { opacity: 0; transform: translateY(26px); }
@keyframes grain { 0% { transform: translate(0,0); } 25% { transform: translate(3%,-2%); } 50% { transform: translate(-2%,3%); } 75% { transform: translate(2%,2%); } }

@media (max-width: 1100px) {
    .desktop-nav { gap: 1rem; }
    .desktop-nav a:nth-child(4), .desktop-nav a:nth-child(5) { display: none; }
    .packages-grid { grid-template-columns: 1fr; gap: 1rem; }
    .package-card--featured { transform: none; }
    .package-card ul { min-height: 0; }
    .partner-grid { grid-template-columns: repeat(2, 1fr); }
    .reviews-grid { grid-template-columns: 1fr; }
    .review-card { grid-template-columns: 90px 1fr; }
    .review-card blockquote { min-height: 0; }
}

@media (max-width: 800px) {
    :root { --timeline-h: 92px; }
    html { scroll-padding-top: 64px; }
    .topbar, .topbar.is-scrolled { grid-template-columns: 1fr auto; height: 64px; }
    .desktop-nav, .nav-cta { display: none; }
    .menu-toggle { display: block; }
    .hero { padding: 7rem var(--page-x) calc(var(--timeline-h) + 4rem); }
    .hero-vignette { background: linear-gradient(0deg, #090a0a 0%, rgba(5,6,6,.38) 72%), linear-gradient(90deg, rgba(5,6,6,.64), transparent); }
    .hero-content { width: 100%; }
    .hero .media-placeholder { top: 82px; }
    .scroll-cue { display: none; }
    .section-grid, .section-grid--wide, .section--about, .section--faq, .section--contact { grid-template-columns: 1fr; }
    .section-heading--sticky, .faq-heading, .contact-heading { position: static; }
    .why-copy { padding-top: 0; }
    .workflow-quote span { white-space: normal; }
    .moments-strip { grid-template-columns: repeat(2, 1fr); }
    .moment-card:nth-child(2), .moment-card:nth-child(4) { margin-top: 1.5rem; }
    .style-card { grid-template-columns: 42% 1fr; }
    .film-card { grid-template-columns: minmax(240px, .85fr) 1.15fr; padding-inline: var(--page-x); }
    .film-info { grid-template-columns: 1fr; gap: .7rem; }
    .film-info > span:nth-child(n+2) { display: none; }
    .packages-heading { grid-template-columns: 1fr; }
    .packages-heading .kicker { grid-column: auto; }
    .partner-grid { grid-template-columns: repeat(2, 1fr); }
    .section--contact { gap: 4rem; }
    .contact-dialog { width: calc(100vw - 1rem); max-height: calc(100dvh - 1rem); }
    .contact-dialog .contact-form { display: flex; gap: 1.25rem; }
    .master-timeline { padding: 0 1rem 8px 3.7rem; }
    .timeline-time { height: 26px; }
    .track { height: 26px; }
    .track > span { left: -3.15rem; width: 2.8rem; font-size: .75rem; }
    .timeline-clips { height: 16px; }
    .track--atmos { display: none; }
    .playhead { top: -9px; }
    .chapter-markers { top: -5px; }
}

@media (max-width: 560px) {
    .hero-content { max-width: calc(100vw - (2 * var(--page-x))); }
    .hero-logo { width: clamp(160px, 46vw, 230px); margin-bottom: 1.15rem; }
    h1 { font-size: clamp(3.2rem, 17vw, 4.6rem); }
    .hero-actions, .form-footer { flex-direction: column; align-items: stretch; }
    .button, .button--primary { width: 100%; min-width: 0; gap: .75rem; white-space: normal; }
    .hero-statement { margin-top: 1.8rem; }
    .contact-dialog-intro { padding: 1.35rem 1.25rem 0; }
    .contact-dialog .contact-form { padding: 1.35rem 1.25rem; }
    .moments-strip { gap: .4rem; }
    .moment-card:nth-child(2), .moment-card:nth-child(4) { margin-top: 1rem; }
    .style-card { grid-template-columns: 1fr; gap: 1.2rem; }
    .style-preview { aspect-ratio: 16/9; }
    .play-button { width: 66px; height: 66px; }
    .films-heading { grid-template-columns: 1fr; }
    .films-heading > p:last-child { justify-self: start; }
    .film-card { grid-template-columns: 1fr; gap: .7rem; padding-block: .8rem; }
    .film-info strong { font-size: 1.4rem; }
    .multicam { grid-template-columns: 1fr; }
    .multicam-monitor, .multicam-monitor:nth-child(3), .multicam-audio { grid-column: 1; }
    .custom-grid, .tech-brands, .partner-grid, .form-row { grid-template-columns: 1fr; }
    .custom-card { min-height: 320px; }
    .tech-brands > div { border-left: 0; border-top: 1px solid var(--line); }
    .tech-brands > div:first-child { border-top: 0; }
    .partner-grid { gap: 2.5rem; }
    .faq-list details > div p { margin-left: 0; }
    .footer { grid-template-columns: 1fr; }
    .footer > div { flex-direction: column; align-items: flex-start; }
    .footer > span { justify-self: start; }
    .master-timeline { padding-right: .6rem; }
    .timeline-time span:nth-child(2) { display: none; }
}

@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
    .contact-dialog, .contact-dialog::backdrop { transition-duration: .34s !important; }
    .contact-dialog.is-closing, .contact-dialog.is-closing::backdrop { transition-duration: .24s !important; }
    .reveal, .reveal.is-pending { opacity: 1; transform: none; }
}