@font-face { font-family:'Neue Machina'; src:url('../fonts/NeueMachina-Regular.woff2') format('woff2'); font-weight:400; font-display:swap; }
@font-face { font-family:'Neue Machina'; src:url('../fonts/NeueMachina-Medium.woff2') format('woff2'); font-weight:500; font-display:swap; }
@font-face { font-family:'Neue Machina'; src:url('../fonts/NeueMachina-Bold.woff2') format('woff2'); font-weight:700; font-display:swap; }
@font-face { font-family:'Gilroy'; src:url('../fonts/Gilroy-Regular.woff2') format('woff2'); font-weight:400; font-display:swap; }
@font-face { font-family:'Gilroy'; src:url('../fonts/Gilroy-Medium.woff2') format('woff2'); font-weight:500; font-display:swap; }
@font-face { font-family:'Gilroy'; src:url('../fonts/Gilroy-Bold.woff2') format('woff2'); font-weight:700; font-display:swap; }

:root {
    --paper:#f2f0ea;
    --paper-deep:#d9d6cd;
    --ink:#121210;
    --muted:#6d6b66;
    --line:rgba(29,29,27,.2);
    --clay:#ff5b37;
    --clay-dark:#a53624;
    --cobalt:#2558ff;
    --lime:#dfff52;
    --cream:#f8f0e2;
    --display:'Neue Machina',sans-serif;
    --text:'Gilroy',sans-serif;
    --ease:cubic-bezier(.22,1,.36,1);
}

*,*::before,*::after { box-sizing:border-box; margin:0; padding:0; }
html { scroll-behavior:auto; }
html.lenis,html.lenis body { height:auto; }
.lenis.lenis-smooth { scroll-behavior:auto!important; }
body { overflow-x:hidden; background:var(--paper); color:var(--ink); font-family:var(--text); line-height:1.5; -webkit-font-smoothing:antialiased; }
body.has-custom-cursor { cursor:none; }
body.has-custom-cursor a,body.has-custom-cursor button { cursor:none; }
body.has-custom-cursor:has(input:focus),body.has-custom-cursor:has(textarea:focus) { cursor:text; }
body.menu-open,body.modal-open { overflow:hidden; }
a { color:inherit; text-decoration:none; }
button,input,textarea { font:inherit; }
button { color:inherit; }
img { display:block; width:100%; }
::selection { background:var(--ink); color:var(--paper); }
.container { width:min(1480px,calc(100% - clamp(32px,7vw,112px))); margin-inline:auto; }
.section { padding:clamp(88px,13vw,190px) 0; }
.visually-hidden { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.icon-arrow { width:22px; height:22px; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:square; stroke-linejoin:miter; transition:transform .35s var(--ease); }
.cursor { position:fixed; left:0; top:0; z-index:4000; width:24px; height:24px; border:3px solid #fff; border-radius:50%; pointer-events:none; transform:translate(-50%,-50%); mix-blend-mode:difference; transition:width .28s var(--ease),height .28s var(--ease),background-color .28s ease; }
.cursor::before { content:''; position:absolute; top:50%; left:50%; width:6px; height:6px; border-radius:50%; background:#fff; transform:translate(-50%,-50%); transition:opacity .2s ease; }
.cursor-label { position:absolute; top:50%; left:50%; opacity:0; color:var(--paper); font-size:11px; transform:translate(-50%,-50%) scale(.7); white-space:nowrap; transition:opacity .2s ease,transform .28s var(--ease); }
.cursor.is-active { width:82px; height:82px; background:var(--ink); border-color:var(--paper); mix-blend-mode:normal; }
.cursor.is-active::before { opacity:0; }
.cursor.is-active .cursor-label { opacity:1; transform:translate(-50%,-50%) scale(1); }
.ambient-canvas,.contact-canvas { position:absolute; inset:0; width:100%; height:100%; pointer-events:auto; }
.hero-noise { position:absolute; inset:0; pointer-events:none; opacity:.08; 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='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.25'/%3E%3C/svg%3E"); mix-blend-mode:multiply; }
.section-label { margin-bottom:24px; color:var(--clay); font-size:12px; font-weight:700; letter-spacing:.16em; text-transform:uppercase; }
.status-dot { display:inline-block; width:8px; height:8px; margin-right:8px; border-radius:50%; background:var(--lime); box-shadow:0 0 0 5px rgba(223,255,82,.16); }

.header { position:fixed; inset:0 0 auto; z-index:1000; display:grid; grid-template-columns:1fr auto 1fr; align-items:center; padding:20px clamp(16px,3.8vw,58px); transition:transform .45s var(--ease),background-color .35s ease,color .35s ease; }
.header.is-scrolled { background:rgba(240,238,232,.94); border-bottom:1px solid var(--line); backdrop-filter:blur(12px); }
.logo,.footer-logo { font-family:var(--display); font-size:26px; font-weight:700; letter-spacing:-.06em; }
.logo span,.footer-logo span { color:var(--clay); }
.nav { display:flex; align-items:center; gap:32px; }
.nav-link,.header-contact { position:relative; font-size:15px; font-weight:500; }
.nav-link::after,.header-contact::after,.footer-links a::after { content:''; position:absolute; left:0; right:0; bottom:-4px; height:1px; background:currentColor; transform:scaleX(0); transform-origin:right; transition:transform .35s var(--ease); }
.nav-link:hover::after,.header-contact:hover::after,.footer-links a:hover::after { transform:scaleX(1); transform-origin:left; }
.header-contact { justify-self:end; }
.burger { display:none; justify-self:end; width:44px; height:44px; border:0; background:transparent; position:relative; cursor:pointer; }
.burger span { position:absolute; left:9px; width:26px; height:1px; background:currentColor; transition:transform .35s var(--ease); }
.burger span:first-child { transform:translateY(-4px); }
.burger span:last-child { transform:translateY(4px); }
.burger.is-open span:first-child { transform:rotate(45deg); }
.burger.is-open span:last-child { transform:rotate(-45deg); }
.mobile-menu { position:fixed; inset:0; z-index:900; display:grid; place-items:center; background:var(--paper); opacity:0; visibility:hidden; transition:opacity .35s ease,visibility .35s; }
.mobile-menu.is-open { opacity:1; visibility:visible; }
.mobile-menu nav { display:flex; flex-direction:column; align-items:center; gap:16px; }
.mobile-menu a { font-family:var(--display); font-size:clamp(32px,9vw,58px); line-height:1.1; }

.hero { position:relative; min-height:100dvh; padding:clamp(128px,17vh,190px) 0 clamp(44px,7vh,76px); display:flex; align-items:stretch; isolation:isolate; overflow:hidden; }
.hero > .container { position:relative; z-index:1; }
.hero-layout { display:grid; grid-template-columns:repeat(12,1fr); grid-template-rows:auto 1fr; gap:clamp(28px,4vw,64px) 24px; }
.hero-title { grid-column:1/-1; align-self:start; max-width:100%; font-family:var(--display); font-weight:500; font-size:clamp(48px,8.8vw,145px); line-height:.91; letter-spacing:-.065em; text-transform:uppercase; mix-blend-mode:multiply; }
.hero-kicker { grid-column:1/-1; align-self:start; margin-bottom:-18px; font-size:12px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; }
.hero-title span { display:block; overflow:hidden; }
.hero-title span:nth-child(2) { padding-left:8vw; }
.hero-title span:nth-child(3) { padding-left:23vw; color:var(--clay); }
.hero-note { grid-column:1/span 3; align-self:end; display:flex; flex-direction:column; gap:28px; font-size:clamp(16px,1.35vw,19px); }
.hero-meta { grid-column:5/-1; display:flex; justify-content:space-between; align-self:end; margin-top:-2px; padding-top:14px; border-top:1px solid rgba(18,18,16,.35); font-size:11px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; }
.text-link { width:max-content; display:inline-flex; align-items:center; gap:12px; border-bottom:1px solid currentColor; padding-bottom:5px; font-weight:700; }
.text-link:hover .icon-arrow,.submit-button:hover .icon-arrow { transform:translateX(6px); }
.hero-reel { grid-column:5/-1; align-self:end; display:grid; grid-template-columns:1.6fr .8fr; gap:18px; align-items:end; }
.hero-shot { position:relative; overflow:hidden; background:var(--paper-deep); }
.hero-shot-wide { aspect-ratio:16/8.5; }
.hero-shot-tall { aspect-ratio:3/4; }
.hero-shot img { height:100%; object-fit:cover; }
.hero-shot:hover img { transform:scale(1.025); }
.hero-shot figcaption { position:absolute; left:12px; bottom:10px; padding:5px 8px; background:var(--paper); font-size:12px; font-weight:500; }

.section-title { font-family:var(--display); font-weight:500; font-size:clamp(40px,6.4vw,98px); line-height:.98; letter-spacing:-.055em; text-transform:uppercase; }
.about { position:relative; background:var(--ink); color:var(--paper); }
.about-layout { display:grid; grid-template-columns:repeat(12,1fr); gap:clamp(56px,10vw,150px) 24px; }
.about .section-title { grid-column:1/span 10; }
.about-copy { grid-column:7/-1; display:grid; grid-template-columns:1fr 1fr; gap:30px; font-size:clamp(17px,1.5vw,22px); color:#c8c5bd; }
.principles-list { grid-column:1/span 10; border-top:1px solid rgba(240,238,232,.25); }
.principles-list>div { display:grid; grid-template-columns:1fr 2fr; gap:32px; padding:28px 0; border-bottom:1px solid rgba(240,238,232,.25); }
.principles-list dt { font-family:var(--display); font-size:clamp(19px,1.8vw,27px); }
.principles-list dd { max-width:62ch; color:#aaa7a0; font-size:16px; }

.services-title { max-width:11ch; margin-bottom:clamp(60px,9vw,130px); }
.services-list { border-top:1px solid var(--line); }
.service-row { display:grid; grid-template-columns:minmax(260px,1fr) 1.2fr minmax(190px,.55fr); gap:32px; align-items:start; padding:clamp(28px,4vw,52px) 0; border-bottom:1px solid var(--line); }
.service-row h3 { font-family:var(--display); font-size:clamp(28px,3.5vw,54px); font-weight:500; letter-spacing:-.035em; transition:transform .45s var(--ease),color .35s ease; }
.service-row:hover h3 { transform:translateX(10px); color:var(--clay); }
.service-scope { max-width:48ch; font-size:clamp(16px,1.4vw,20px); }
.service-terms { text-align:right; color:var(--muted); font-size:14px; white-space:nowrap; }
.industries-line { width:min(760px,70%); margin:clamp(72px,10vw,140px) 0 0 auto; font-family:var(--display); font-size:clamp(22px,2.7vw,40px); line-height:1.24; letter-spacing:-.025em; }

.works { background:var(--clay); color:var(--cream); }
.works-heading { display:grid; grid-template-columns:2fr 1fr; gap:40px; align-items:end; margin-bottom:clamp(60px,8vw,110px); }
.works-heading p { max-width:40ch; justify-self:end; font-size:clamp(16px,1.4vw,20px); }
.works-grid { display:flex; flex-direction:column; gap:clamp(76px,10vw,150px); }
.work-card { width:100%; min-width:0; cursor:pointer; }
.work-button { display:block; width:100%; color:inherit; text-align:left; border:0; background:none; cursor:pointer; }
.work-media { overflow:hidden; aspect-ratio:16/8.2; background:var(--clay-dark); }
.work-card:nth-child(even) { width:82%; margin-left:auto; }
.work-card:nth-child(even) .work-media { aspect-ratio:16/9; }
.work-media img { height:100%; object-fit:cover; }
.work-card:hover .work-media img { transform:scale(1.025); }
.work-info { display:grid; grid-template-columns:1fr auto; gap:16px; padding-top:18px; border-top:1px solid rgba(248,240,226,.45); margin-top:18px; }
.work-kicker { display:block; margin-bottom:12px; font-size:11px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; opacity:.72; }
.work-title { font-family:var(--display); font-size:clamp(34px,5.2vw,82px); line-height:.94; font-weight:500; letter-spacing:-.055em; text-transform:uppercase; }
.work-type { margin-top:5px; color:rgba(248,240,226,.75); font-size:14px; }
.work-index { font-family:var(--display); font-size:clamp(28px,4vw,60px); font-variant-numeric:tabular-nums; }
.works-footer { margin-top:clamp(72px,10vw,140px); display:flex; justify-content:flex-end; }
.text-link-dark { color:var(--cream); }

.process-layout { display:grid; grid-template-columns:repeat(12,1fr); gap:clamp(56px,9vw,130px) 24px; align-items:start; }
.process-heading { grid-column:1/span 5; position:sticky; top:130px; align-self:start; }
.process-heading > p:last-child { max-width:42ch; margin-top:28px; color:var(--muted); font-size:17px; }
.process-list { grid-column:7/-1; list-style:none; border-top:1px solid var(--line); }
.process-list li { display:grid; grid-template-columns:130px 1fr; gap:24px; padding:32px 0 56px; border-bottom:1px solid var(--line); }
.process-verb { color:var(--clay); font-weight:700; }
.process-list h3 { font-family:var(--display); font-size:clamp(23px,2.3vw,34px); font-weight:500; letter-spacing:-.025em; }
.process-list p { max-width:48ch; margin-top:12px; color:var(--muted); font-size:16px; }
.engagement { grid-column:7/-1; margin-top:clamp(24px,4vw,56px); padding-top:clamp(40px,6vw,80px); border-top:1px solid var(--ink); display:grid; grid-template-columns:1fr 1fr; gap:40px; position:relative; z-index:1; background:var(--paper); }
.engagement h3 { font-family:var(--display); font-size:clamp(25px,3vw,44px); font-weight:500; line-height:1.14; letter-spacing:-.035em; }
.engagement p { color:var(--muted); font-size:17px; }

.testimonials { background:var(--paper-deep); }
.testimonial-layout { display:grid; grid-template-columns:repeat(12,1fr); gap:40px 24px; }
.testimonial-feature { grid-column:2/span 9; min-height:390px; display:flex; flex-direction:column; justify-content:space-between; }
.testimonial-feature>p { font-family:var(--display); font-size:clamp(30px,4.3vw,66px); line-height:1.12; letter-spacing:-.04em; }
.testimonial-feature footer { margin-top:42px; font-size:16px; color:var(--muted); }
.testimonial-feature footer strong { color:var(--ink); }
.testimonial-nav { grid-column:2/span 9; display:flex; gap:8px; padding-top:30px; border-top:1px solid var(--line); }
.testimonial-tab { position:relative; min-width:44px; height:44px; border:0; background:transparent; cursor:pointer; color:var(--muted); }
.testimonial-tab::after { content:''; position:absolute; left:8px; right:8px; bottom:8px; height:2px; background:var(--line); transform:scaleX(.5); transition:transform .3s var(--ease),background-color .3s ease; }
.testimonial-tab[aria-selected="true"] { color:var(--ink); }
.testimonial-tab[aria-selected="true"]::after { transform:scaleX(1); background:var(--clay); }

.contact { background:var(--ink); color:var(--paper); }
.contact { position:relative; isolation:isolate; overflow:hidden; }
.contact > .container { position:relative; z-index:1; }
.contact-canvas { opacity:.44; mix-blend-mode:screen; }
.contact-layout { display:grid; grid-template-columns:repeat(12,1fr); gap:64px 24px; }
.contact-heading { grid-column:1/span 6; }
.contact-heading .section-title { font-size:clamp(40px,5.6vw,84px); }
.contact-heading p { max-width:48ch; margin-top:34px; color:#aaa7a0; font-size:17px; }
.contact-heading>a { display:inline-block; margin-top:28px; border-bottom:1px solid currentColor; font-size:clamp(18px,1.8vw,26px); }
.contact-form { grid-column:8/-1; display:grid; grid-template-columns:1fr 1fr; gap:28px 24px; align-content:start; }
.form-field { display:flex; flex-direction:column; gap:9px; }
.form-field label { font-size:13px; color:#aaa7a0; }
.form-field input,.form-field textarea { width:100%; border:0; border-bottom:1px solid rgba(240,238,232,.28); border-radius:0; outline:0; background:transparent; color:var(--paper); padding:5px 0 12px; font-size:17px; resize:vertical; transition:border-color .25s ease; }
.form-field input:focus,.form-field textarea:focus { border-color:var(--paper); }
.form-field-wide { grid-column:1/-1; }
.submit-button { grid-column:1/-1; width:100%; min-height:58px; padding:16px 20px; border:1px solid var(--paper); background:var(--paper); color:var(--ink); display:flex; justify-content:space-between; align-items:center; font-weight:700; cursor:pointer; transition:transform .25s var(--ease),background-color .25s ease,color .25s ease; }
.submit-button:hover { background:transparent; color:var(--paper); }
.submit-button:active { transform:translateY(2px); }
.form-status { grid-column:1/-1; min-height:24px; color:#aaa7a0; font-size:14px; }
:focus-visible { outline:2px solid var(--lime); outline-offset:5px; }

.footer { padding:55px 0 26px; background:var(--ink); color:var(--paper); border-top:1px solid rgba(240,238,232,.2); }
.footer-main { display:grid; grid-template-columns:1fr 2fr 1fr; gap:30px; align-items:start; padding-bottom:52px; }
.footer-main>p { max-width:32ch; color:#aaa7a0; }
.footer-links { justify-self:end; display:flex; gap:20px; }
.footer-links a { position:relative; }
.footer-bottom { border-top:1px solid rgba(240,238,232,.2); padding-top:22px; display:flex; justify-content:space-between; gap:20px; color:#85827d; font-size:13px; }

.case-modal { position:fixed; inset:0; z-index:3000; display:grid; place-items:center; opacity:0; visibility:hidden; transition:opacity .35s ease,visibility .35s; }
.case-modal.is-open { opacity:1; visibility:visible; }
.case-modal-backdrop { position:absolute; inset:0; background:rgba(29,29,27,.8); backdrop-filter:blur(8px); }
.case-modal-body { position:relative; width:min(1050px,calc(100% - 32px)); max-height:92dvh; overflow:auto; overscroll-behavior:contain; background:var(--paper); padding:clamp(28px,5vw,72px); transform:translateY(24px); transition:transform .45s var(--ease); }
.case-modal.is-open .case-modal-body { transform:translateY(0); }
.case-modal-close { position:sticky; top:0; float:right; width:44px; height:44px; border:1px solid var(--ink); background:var(--paper); cursor:pointer; z-index:2; }
.case-modal-close span { position:absolute; left:9px; top:21px; width:24px; height:1px; background:var(--ink); }
.case-modal-close span:first-child { transform:rotate(45deg); }
.case-modal-close span:last-child { transform:rotate(-45deg); }
.case-modal-title { max-width:14ch; padding-top:35px; font-family:var(--display); font-size:clamp(34px,5vw,70px); line-height:1; letter-spacing:-.05em; }
.case-modal-meta { margin:22px 0 30px; color:var(--clay-dark); }
.case-modal-desc { max-width:70ch; margin-bottom:46px; font-size:18px; }
.case-modal-gallery { display:flex; flex-direction:column; gap:22px; }
.case-modal-gallery img { background:var(--paper-deep); }

[data-scroll-fade] { opacity:0; transform:translateY(28px); }

@media (max-width:1000px) {
    .hero-note { grid-column:1/span 4; }
    .hero-reel { grid-column:5/-1; }
    .service-row { grid-template-columns:1fr 1.2fr; }
    .service-terms { grid-column:2; text-align:left; }
    .process-heading { grid-column:1/span 5; }
    .process-list { grid-column:6/-1; }
    .testimonial-feature,.testimonial-nav { grid-column:1/span 11; }
    .contact-heading { grid-column:1/span 6; }
    .contact-form { grid-column:7/-1; }
}

@media (max-width:760px) {
    body { cursor:auto; }
    .container { width:calc(100% - 32px); }
    .section { padding:80px 0; }
    .header { grid-template-columns:1fr auto; padding:12px 16px; }
    .nav,.header-contact { display:none; }
    .burger { display:block; }
    .hero { min-height:auto; padding:120px 0 48px; }
    .hero-layout { display:flex; flex-direction:column; gap:34px; }
    .hero-title { width:100%; font-size:clamp(29px,8.2vw,52px); letter-spacing:-.1em; }
    .hero-kicker { margin-bottom:-16px; font-size:10px; }
    .hero-meta { order:4; margin-top:4px; font-size:9px; }
    .hero-meta span:last-child { display:none; }
    .hero-title span:nth-child(2),.hero-title span:nth-child(3) { padding-left:0; }
    .hero-note { width:min(100%,34ch); max-width:none; align-self:flex-start; order:2; }
    .hero-reel { width:100%; align-self:flex-start; order:3; grid-template-columns:minmax(0,1.55fr) minmax(0,.8fr); gap:8px; }
    .hero-shot figcaption { display:none; }
    .about .section-title,.about-copy,.principles-list { grid-column:1/-1; }
    .about-copy { grid-template-columns:1fr; }
    .principles-list>div { grid-template-columns:1fr; gap:10px; }
    .service-row { grid-template-columns:1fr; gap:16px; }
    .service-terms { grid-column:auto; text-align:left; }
    .industries-line { width:100%; margin-left:0; }
    .works-heading { grid-template-columns:1fr; align-items:start; }
    .works-heading p { justify-self:start; }
    .works-grid { display:flex; flex-direction:column; gap:60px; }
    .work-card:nth-child(n) { margin-top:0; }
    .work-card:nth-child(even) { width:90%; margin-left:10%; }
    .work-media,.work-card:nth-child(even) .work-media { aspect-ratio:4/3; }
    .work-title { font-size:clamp(30px,9.5vw,50px); }
    .process-layout { display:flex; flex-direction:column; }
    .process-heading { position:static; }
    .process-list li { grid-template-columns:1fr; padding-bottom:36px; }
    .engagement { grid-column:1/-1; grid-template-columns:1fr; }
    .testimonial-feature,.testimonial-nav { grid-column:1/-1; }
    .testimonial-feature { min-height:430px; }
    .testimonial-nav { overflow-x:auto; }
    .contact-heading,.contact-form { grid-column:1/-1; }
    .contact-form { grid-template-columns:1fr; }
    .form-field-wide,.submit-button,.form-status { grid-column:auto; }
    .footer-main { grid-template-columns:1fr; }
    .footer-links { justify-self:start; flex-wrap:wrap; }
    .footer-bottom { flex-direction:column; }
}

@media (pointer:coarse) {
    .cursor { 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; }
    [data-scroll-fade] { opacity:1; transform:none; }
}
