@font-face{font-family:Atkinson;src:url("../fonts/atkinson-hyperlegible-400.woff2") format("woff2");font-display:swap;font-weight:400}
@font-face{font-family:Atkinson;src:url("../fonts/atkinson-hyperlegible-700.woff2") format("woff2");font-display:swap;font-weight:700}
@font-face{font-family:BarlowCondensed;src:url("../fonts/barlow-condensed-600.woff2") format("woff2");font-display:swap;font-weight:600}
@font-face{font-family:BarlowCondensed;src:url("../fonts/barlow-condensed-800.woff2") format("woff2");font-display:swap;font-weight:800}
@font-face{font-family:CourierPrime;src:url("../fonts/courier-prime-700.woff2") format("woff2");font-display:swap;font-weight:700}

:root{
  color-scheme:light dark;
  --bg:#eef1f5;
  --surface:#f8fafc;
  --surface-strong:#dde3ec;
  --text:#151b24;
  --text-soft:#505d6d;
  --line:#bbc5d1;
  --accent:#2758c7;
  --accent-soft:#d7e2ff;
  --accent-ink:#f8fbff;
  --error:#9b2525;
  --display:"BarlowCondensed",sans-serif;
  --body:"Atkinson",sans-serif;
  --mono:"CourierPrime",monospace;
  --radius:12px;
  --max:1240px;
}

@media (prefers-color-scheme:dark){
  :root{
    --bg:#11151b;
    --surface:#181e27;
    --surface-strong:#222b37;
    --text:#edf1f7;
    --text-soft:#b2bece;
    --line:#3b4655;
    --accent:#86a8ff;
    --accent-soft:#1c315f;
    --accent-ink:#111827;
    --error:#ff9f9f;
  }
}

*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:6rem}
body{margin:0;background:var(--bg);color:var(--text);font-family:var(--body);font-size:1.05rem;line-height:1.55}
body::before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(120deg,color-mix(in srgb,var(--accent) 5%,transparent),transparent 35%)}
a{color:inherit}
img{display:block;max-width:100%}
button,input,select,textarea{font:inherit}
button{color:inherit}
h1,h2,h3,p{margin-top:0}
h1,h2,h3{font-family:var(--display);line-height:.96;text-wrap:balance}
:focus-visible{outline:3px solid var(--accent);outline-offset:4px}

.skip-link{position:fixed;left:1rem;top:1rem;z-index:100;padding:.75rem 1rem;border-radius:var(--radius);background:var(--accent);color:var(--accent-ink);font-weight:700;transform:translateY(-180%)}
.skip-link:focus{transform:none}

.site-header{width:min(calc(100% - 3rem),var(--max));min-height:76px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:2rem;border-bottom:1px solid var(--line)}
.brand{display:flex;align-items:center;gap:.85rem;text-decoration:none;font-family:var(--display);font-size:1.15rem;font-weight:800;letter-spacing:.02em;text-transform:uppercase;line-height:1}
.brand small{display:block;margin-top:.32rem;color:var(--text-soft);font-family:var(--mono);font-size:.58rem;letter-spacing:.04em;text-transform:none}
.brand-mark{width:40px;height:40px;display:grid;place-items:center;border:1px solid var(--line);border-radius:var(--radius);background:var(--surface);color:var(--accent);font-family:var(--mono);font-size:.72rem}
.site-header nav{display:flex;align-items:center;gap:1.65rem;white-space:nowrap}
.site-header nav a{text-decoration:none;font-size:.87rem;font-weight:700}
.site-header nav a:not(.nav-cta):hover{color:var(--accent)}
.nav-cta{padding:.66rem .9rem;border:1px solid var(--accent);border-radius:var(--radius);color:var(--accent)}

main{overflow:hidden}
.section-shell,.facts,.site-footer{width:min(calc(100% - 3rem),var(--max));margin:0 auto}
.hero{width:min(calc(100% - 3rem),var(--max));min-height:calc(100dvh - 76px);margin:0 auto;display:grid;grid-template-columns:minmax(0,.78fr) minmax(520px,1.22fr);align-items:center;gap:4rem;padding:4rem 0}
.hero-copy{min-width:0;max-width:590px;align-self:start;margin-top:clamp(1rem,7vh,4.5rem)}
.eyebrow{margin-bottom:1.2rem;color:var(--accent);font-family:var(--mono);font-size:.74rem;letter-spacing:.07em;text-transform:uppercase}
h1{max-width:690px;margin-bottom:1.4rem;font-size:clamp(3.5rem,5.7vw,6rem);font-weight:800;letter-spacing:-.035em;text-transform:uppercase}
.hero-lede{max-width:540px;margin-bottom:2rem;color:var(--text-soft);font-size:1.2rem;line-height:1.45}
.hero-actions{display:flex;flex-wrap:wrap;gap:.8rem}
.button{min-height:50px;display:inline-flex;align-items:center;justify-content:center;padding:.8rem 1.05rem;border:1px solid transparent;border-radius:var(--radius);text-decoration:none;font-weight:700;white-space:nowrap;cursor:pointer;transition:transform 150ms ease,background-color 150ms ease,border-color 150ms ease}
.button:active{transform:translateY(1px)}
.button-primary{background:var(--accent);color:var(--accent-ink)}
.button-primary:hover{background:color-mix(in srgb,var(--accent) 86%,var(--text))}
.button-secondary{border-color:var(--line);background:var(--surface)}
.button-secondary:hover{border-color:var(--accent);color:var(--accent)}
.hero-media{min-width:0;margin:0;border-radius:var(--radius);overflow:hidden;background:#11151b;box-shadow:0 24px 70px color-mix(in srgb,var(--text) 16%,transparent)}
.hero-media img{width:100%;aspect-ratio:3/2;object-fit:cover}
.hero-media figcaption{padding:.75rem 1rem;background:var(--surface);color:var(--text-soft);font-size:.78rem}

.facts{display:grid;grid-template-columns:1.05fr .95fr 1.1fr .9fr;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.facts div{padding:1.4rem 1.2rem 1.4rem 0}
.facts div+div{padding-left:1.2rem;border-left:1px solid var(--line)}
.facts strong,.facts span{display:block}
.facts strong{font-family:var(--display);font-size:1.55rem;text-transform:uppercase}
.facts span{margin-top:.2rem;color:var(--text-soft);font-size:.82rem}

.motion-sample,.concept,.scope,.process,.rights,.request{padding:7rem 0;border-top:1px solid var(--line)}
.section-intro,.scope-heading{max-width:770px;margin-bottom:3rem}
h2{margin-bottom:1.2rem;font-size:clamp(3rem,5vw,5.1rem);font-weight:800;letter-spacing:-.025em;text-transform:uppercase}
.section-intro p,.scope-heading p,.request-copy>p,.rights-copy p{max-width:620px;color:var(--text-soft)}

.motion-sample{display:grid;grid-template-columns:minmax(300px,.62fr) minmax(460px,1.38fr);gap:6rem;align-items:center}
.motion-media{width:min(100%,410px);margin:0;border-radius:var(--radius);overflow:hidden;background:#11151b;box-shadow:0 24px 70px color-mix(in srgb,var(--text) 14%,transparent)}
.motion-media video{width:100%;height:auto;display:block;background:#11151b}
.motion-media figcaption{padding:.8rem 1rem;background:var(--surface);color:var(--text-soft);font-size:.78rem}
.motion-copy>p{max-width:620px;color:var(--text-soft);font-size:1.12rem}
.motion-packages{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin:2rem 0}
.motion-packages article{padding:1.35rem;border:1px solid var(--line);border-radius:var(--radius);background:var(--surface)}
.motion-packages h3{margin-bottom:.65rem;font-size:1.45rem;text-transform:uppercase}
.motion-packages p{margin-bottom:0;color:var(--text-soft);font-size:.9rem}

.concept-gallery{display:grid;grid-template-columns:.86fr 1.28fr .86fr;gap:1rem;align-items:start}
.campaign-frame{margin:0}
.campaign-frame:nth-child(2){margin-top:3.5rem}
.campaign-crop{position:relative;aspect-ratio:4/5;overflow:hidden;border-radius:var(--radius);background:var(--surface-strong)}
.campaign-crop img{position:absolute;top:0;width:300%;max-width:none;height:100%;object-fit:cover}
.campaign-frame-studio img{left:0}
.campaign-frame-organic img{left:-100%}
.campaign-frame-paid img{left:-200%}
.campaign-frame figcaption{display:grid;grid-template-columns:auto 1fr;gap:1rem;padding:1rem 0;color:var(--text-soft);font-size:.84rem}
.campaign-frame figcaption strong{color:var(--text);font-family:var(--display);font-size:1.25rem;text-transform:uppercase}

.scope{display:grid;grid-template-columns:minmax(320px,.78fr) minmax(550px,1.22fr);gap:6rem}
.scope-heading{position:sticky;top:7rem;align-self:start}
.scope-columns{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.scope-columns section{padding:1.6rem;border:1px solid var(--line);border-radius:var(--radius);background:var(--surface)}
.scope-columns h3{font-size:1.65rem;text-transform:uppercase}
.scope-columns ul{margin:0;padding:0;list-style:none}
.scope-columns li{position:relative;padding-left:1rem;color:var(--text-soft)}
.scope-columns li+li{margin-top:.8rem}
.scope-columns li::before{content:"";position:absolute;left:0;top:.72em;width:6px;height:2px;background:var(--accent)}
.scope-limit{grid-column:1/-1;background:var(--accent-soft)!important;border-color:var(--accent)!important}
.scope-limit p{margin-bottom:0;color:var(--text-soft)}

.process h2{max-width:780px}
.process ol{margin:3rem 0 0;padding:0;list-style:none}
.process li{display:grid;grid-template-columns:minmax(160px,.35fr) minmax(0,1fr);gap:2rem;padding:1.5rem 0;border-bottom:1px solid var(--line)}
.process li:first-child{border-top:1px solid var(--line)}
.process strong{font-family:var(--display);font-size:2rem;text-transform:uppercase}
.process span{max-width:680px;color:var(--text-soft);font-size:1.1rem}

.rights{display:grid;grid-template-columns:minmax(340px,.85fr) minmax(450px,1.15fr);gap:6rem;align-items:start}
.rights-copy p:first-child{color:var(--text);font-size:1.25rem}

.request{display:grid;grid-template-columns:minmax(330px,.76fr) minmax(500px,1.24fr);gap:6rem}
.request-copy{position:sticky;top:7rem;align-self:start}
.price{margin:2.5rem 0 1rem;padding-top:1.5rem;border-top:1px solid var(--line)}
.price strong,.price span{display:block}
.price strong{font-family:var(--display);font-size:4.4rem;line-height:1;text-transform:uppercase}
.price span{max-width:480px;margin-top:.5rem;color:var(--text-soft);font-size:.9rem}
.payment-note{font-size:.9rem}
form{padding:2rem;border:1px solid var(--line);border-radius:var(--radius);background:var(--surface)}
.form-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1rem}
label{display:block;margin-bottom:1.1rem;font-weight:700;font-size:.9rem}
input,select,textarea{width:100%;margin-top:.42rem;padding:.78rem .85rem;border:1px solid var(--line);border-radius:var(--radius);background:var(--bg);color:var(--text)}
input,select{min-height:48px}
textarea{min-height:132px;resize:vertical}
input::placeholder,textarea::placeholder{color:color-mix(in srgb,var(--text-soft) 92%,transparent)}
input:hover,select:hover,textarea:hover{border-color:color-mix(in srgb,var(--accent) 65%,var(--line))}
input:focus,select:focus,textarea:focus{border-color:var(--accent);outline:2px solid color-mix(in srgb,var(--accent) 24%,transparent)}
.field-error{display:block;min-height:1.15rem;margin-top:.25rem;color:var(--error);font-weight:400;font-size:.78rem}
.confirm-row{display:grid;grid-template-columns:22px 1fr;gap:.7rem;align-items:start;margin:1.1rem 0 1.4rem;color:var(--text-soft);font-weight:400}
.confirm-row input{width:20px;height:20px;min-height:20px;margin:2px 0 0;accent-color:var(--accent)}
.form-note,#form-status{max-width:620px;margin:.9rem 0 0;color:var(--text-soft);font-size:.82rem}
#form-status{min-height:1.25rem;color:var(--error)}

.site-footer{display:grid;grid-template-columns:1fr auto auto;gap:2.5rem;align-items:end;padding:3rem 0 4rem;border-top:1px solid var(--line);color:var(--text-soft);font-size:.88rem}
.site-footer strong,.site-footer span{display:block}
.site-footer strong{color:var(--text);font-family:var(--display);font-size:1.2rem;text-transform:uppercase}
.site-footer nav{display:flex;gap:1.2rem}
.site-footer a{color:var(--accent)}

@media (prefers-reduced-motion:no-preference){
  .hero-copy{animation:enter 600ms cubic-bezier(.16,1,.3,1) both}
  .hero-media{animation:enter 700ms 80ms cubic-bezier(.16,1,.3,1) both}
  @keyframes enter{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
}

@media (max-width:980px){
  .hero{grid-template-columns:1fr;min-height:auto;gap:2.5rem;padding:5rem 0}.hero-copy{max-width:760px;margin-top:0}
  .facts{grid-template-columns:repeat(2,1fr)}.facts div:nth-child(3){border-left:0;border-top:1px solid var(--line)}.facts div:nth-child(4){border-top:1px solid var(--line)}
  .motion-sample,.scope,.rights,.request{grid-template-columns:1fr;gap:3.5rem}.motion-media{width:min(100%,460px)}.scope-heading,.request-copy{position:static}
}

@media (max-width:720px){
  body{font-size:1rem}.site-header,.hero,.section-shell,.facts,.site-footer{width:min(calc(100% - 2rem),var(--max))}
  .site-header{min-height:70px}.brand{font-size:1rem}.brand small{display:none}.brand-mark{width:36px;height:36px}.site-header nav{gap:0}.site-header nav a:not(.nav-cta){display:none}.nav-cta{font-size:.72rem;padding:.55rem .65rem}
  .hero{padding:3.5rem 0}.hero-lede{font-size:1.12rem}h1{font-size:clamp(3.15rem,14vw,4.6rem)}.hero-actions{display:grid}.hero-actions .button{width:100%}.hero-media figcaption{font-size:.72rem}
  .facts{grid-template-columns:1fr}.facts div,.facts div+div{padding:1rem 0;border-left:0;border-top:1px solid var(--line)}.facts div:first-child{border-top:0}
  .motion-sample,.concept,.scope,.process,.rights,.request{padding:5rem 0}.motion-packages{grid-template-columns:1fr}.motion-media{width:100%}.concept-gallery{grid-template-columns:1fr}.campaign-frame:nth-child(2){margin-top:0}.campaign-crop{aspect-ratio:4/3}.campaign-frame figcaption{grid-template-columns:1fr;gap:.2rem}
  .scope-columns{grid-template-columns:1fr}.scope-limit{grid-column:auto}.process li{grid-template-columns:1fr;gap:.4rem}.process strong{font-size:1.7rem}
  .form-grid{grid-template-columns:1fr}form{padding:1.25rem}.site-footer{grid-template-columns:1fr;align-items:start}.site-footer nav{flex-direction:column;gap:.45rem}
}

@media (max-width:420px){
  .site-header{gap:.75rem}.brand>span:last-child{display:none}.site-header nav{margin-left:auto}.nav-cta{font-size:.72rem}
}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}.button{transition:none}
}