:root { --red:#ff0020; --ink:#101010; --paper:#f3f1ed; --line:#c9c6c0; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--paper); color:var(--ink); font-family:Arial,Helvetica,sans-serif; }
a { color:inherit; text-decoration:none; }
.shell { width:min(100% - 48px, 1440px); margin-inline:auto; }
.nav { height:110px; display:grid; grid-template-columns:1fr auto 1fr; align-items:center; border-bottom:1px solid var(--line); }
.logo-link img { display:block; width:142px; height:auto; }
.nav-links { display:flex; gap:34px; font-size:14px; }
.nav-links a,.text-link { position:relative; }
.nav-links a:after,.text-link:after { content:""; position:absolute; left:0; right:100%; bottom:-5px; height:1px; background:var(--red); transition:.25s; }
.nav-links a:hover:after,.text-link:hover:after { right:0; }
.nav-cta { justify-self:end; background:var(--red); color:white; padding:15px 20px; font-size:14px; font-weight:700; }
.nav-cta span { margin-left:20px; }
.hero { padding:92px 0 0; min-height:760px; }
.eyebrow { text-transform:uppercase; letter-spacing:.13em; font-size:12px; font-weight:700; animation:hero-rise .7s .08s both cubic-bezier(.22,.7,.25,1); }
.hero h1 { font-size:clamp(70px,10vw,154px); line-height:.84; letter-spacing:-.065em; margin:62px 0 64px; font-weight:800; animation:hero-rise .9s .18s both cubic-bezier(.22,.7,.25,1); }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.rotating-word { display:inline-grid; vertical-align:baseline; }
.rotating-word>span { grid-area:1/1; opacity:0; animation:word-cycle 8s infinite both cubic-bezier(.22,.7,.25,1); }
.rotating-word>span:nth-child(2) { animation-delay:2s; }
.rotating-word>span:nth-child(3) { animation-delay:4s; }
.rotating-word>span:nth-child(4) { animation-delay:6s; }
em { color:var(--red); font-style:normal; }
.second-look { position:relative; display:inline-block; clip-path:inset(0 100% 0 0); animation:second-look-loop 4.5s .75s infinite both cubic-bezier(.75,0,.2,1); }
.second-look:after { content:""; position:absolute; left:0; right:0; bottom:-.08em; height:.045em; min-height:4px; background:var(--red); transform:scaleX(0); transform-origin:left; animation:second-look-line-loop 4.5s .75s infinite both cubic-bezier(.22,.7,.25,1); }
.hero-bottom { display:flex; justify-content:flex-end; margin-left:40%; animation:hero-rise .75s 1.05s both cubic-bezier(.22,.7,.25,1); }
.text-link { justify-self:end; font-size:14px; font-weight:700; }
.text-link span { margin-left:26px; color:var(--red); }
.ticker { margin-top:92px; border-top:1px solid var(--line); border-bottom:1px solid var(--line); height:64px; display:flex; align-items:center; justify-content:space-between; color:var(--red); font-size:19px; font-weight:700; text-transform:uppercase; overflow:hidden; animation:hero-rise .7s 1.25s both cubic-bezier(.22,.7,.25,1); }
.ticker i { color:var(--ink); font-style:normal; }
.work-section { padding:130px 0 150px; background:#fff; }
.section-heading { display:grid; grid-template-columns:1fr 2fr; margin-bottom:90px; }
.section-heading>div { display:flex; gap:28px; align-items:flex-start; text-transform:uppercase; font-size:12px; letter-spacing:.08em; font-weight:700; }
.section-heading p { margin:2px 0 0; }
.index { color:var(--red); }
.section-heading h2 { margin:0; font-size:clamp(48px,6.2vw,92px); line-height:.96; letter-spacing:-.055em; }
.project-grid { display:grid; grid-template-columns:repeat(12,1fr); gap:38px 24px; }
.project { grid-column:span 6; }
.project-3,.project-4 { grid-column:span 4; }
.project-image { background:#eee; overflow:hidden; aspect-ratio:1.29; }
.project-image img { width:100%; height:100%; object-fit:cover; transition:transform .6s cubic-bezier(.2,.7,.2,1); }
.project:hover img { transform:scale(1.035); }
.project-meta { display:flex; justify-content:space-between; gap:20px; padding-top:14px; border-top:1px solid var(--ink); margin-top:12px; }
.project-meta h3,.project-meta p { margin:0; font-size:14px; }
.project-meta p { color:#6c6c6c; text-align:right; }
.services { padding:140px 0 160px; }
.services-title { margin-bottom:60px; }
.service { display:grid; grid-template-columns:70px 1fr 1fr 40px; align-items:center; border-top:1px solid var(--ink); padding:29px 0; }
.service:last-child { border-bottom:1px solid var(--ink); }
.service>span { color:var(--red); font-size:13px; }
.service h3 { margin:0; font-size:clamp(40px,5vw,72px); letter-spacing:-.05em; }
.service p { font-weight:700; margin:0 0 10px; }
.service small { color:#666; }
.service b { justify-self:end; font-size:22px; color:var(--red); }
.process { background:var(--ink); color:white; padding:140px 0; }
.process-grid { display:grid; grid-template-columns:1fr 2fr; }
.process-grid>div:first-child { display:flex; gap:28px; text-transform:uppercase; letter-spacing:.08em; font-size:12px; font-weight:700; }
.process-grid>div:first-child p { margin:2px 0; }
.light { color:#ff8e9c; }
.process-copy h2 { font-size:clamp(45px,5.6vw,82px); line-height:1; letter-spacing:-.05em; margin:0; max-width:1100px; }
.process-copy>p { font-size:20px; line-height:1.5; max-width:660px; margin:55px 0 80px; color:#bcbcbc; }
.steps { display:grid; grid-template-columns:repeat(4,1fr); border-top:1px solid #555; }
.steps span { padding:18px 0; font-size:14px; }
.steps b { color:var(--red); margin-right:12px; }
.contact { padding:140px 0 80px; }
.contact>p { text-transform:uppercase; letter-spacing:.1em; font-size:12px; font-weight:700; }
.contact h2 { font-size:clamp(68px,10vw,150px); line-height:.85; letter-spacing:-.07em; margin:80px 0 100px; }
.contact-grid { display:grid; grid-template-columns:2fr 1fr; gap:clamp(60px,8vw,140px); border-top:1px solid var(--ink); padding-top:40px; }
.contact-form { display:flex; flex-direction:column; gap:30px; }
.field-row { display:grid; grid-template-columns:1fr 1fr; gap:24px; }
.contact-form label { display:flex; flex-direction:column; gap:12px; text-transform:uppercase; letter-spacing:.09em; font-size:11px; font-weight:700; }
.contact-form input,.contact-form select,.contact-form textarea { width:100%; border:0; border-bottom:1px solid #8d8b86; border-radius:0; background:transparent; color:var(--ink); padding:10px 0 14px; font:16px/1.4 Arial,Helvetica,sans-serif; outline:none; resize:vertical; }
.contact-form textarea { min-height:130px; }
.contact-form input:focus,.contact-form select:focus,.contact-form textarea:focus { border-color:var(--red); }
.contact-form button { align-self:flex-start; border:0; background:var(--red); color:white; padding:17px 22px; font-size:14px; font-weight:700; cursor:pointer; }
.contact-form button span { margin-left:34px; }
.form-note { margin:-16px 0 0; max-width:560px; color:#6c6c6c; font-size:12px; line-height:1.45; }
.contact-info { border-left:1px solid var(--line); padding-left:40px; }
.contact-info>p { margin:0 0 55px; text-transform:uppercase; letter-spacing:.1em; font-size:11px; font-weight:700; color:var(--red); }
.contact-info dl { margin:0; }
.contact-info dl div { border-top:1px solid var(--line); padding:17px 0 28px; }
.contact-info dt { margin-bottom:8px; text-transform:uppercase; letter-spacing:.09em; font-size:10px; color:#777; }
.contact-info dd { margin:0; font-size:18px; line-height:1.4; }
.contact-info a:hover { color:var(--red); }
.back-to-top { position:fixed; z-index:20; right:22px; bottom:22px; display:flex; align-items:center; gap:18px; background:var(--ink); color:white; padding:14px 16px; font-size:12px; font-weight:700; text-transform:uppercase; letter-spacing:.08em; box-shadow:0 8px 30px #0002; }
.back-to-top:hover { background:var(--red); }
.footer { height:150px; border-top:1px solid var(--line); display:grid; grid-template-columns:1fr 1fr 1fr; align-items:center; font-size:12px; color:#666; }
.footer img { width:112px; }
.footer p:nth-child(2) { text-align:center; }.footer p:last-child { text-align:right; }
@keyframes hero-rise { from { opacity:0; transform:translateY(34px); } to { opacity:1; transform:translateY(0); } }
@keyframes word-cycle { 0% { opacity:0; transform:translateY(.3em); } 5%,20% { opacity:1; transform:translateY(0); } 25%,100% { opacity:0; transform:translateY(-.3em); } }
@keyframes second-look-loop { 0% { clip-path:inset(0 100% 0 0); } 16%,72% { clip-path:inset(0 0 0 0); } 88%,100% { clip-path:inset(0 0 0 100%); } }
@keyframes second-look-line-loop { 0%,8% { transform:scaleX(0); transform-origin:left; } 22%,72% { transform:scaleX(1); transform-origin:left; } 88%,100% { transform:scaleX(0); transform-origin:right; } }
@media (max-width:800px) {
  .shell { width:min(100% - 28px,1440px); }.nav { height:82px; grid-template-columns:1fr auto; }.logo-link img { width:112px; }.nav-links { display:none; }.nav-cta { padding:12px 14px; }.hero { padding-top:70px; min-height:auto; }.hero h1 { font-size:19vw; margin:50px 0; }.hero-bottom { margin-left:0; grid-template-columns:1fr; }.text-link { justify-self:start; }.ticker { margin-top:60px; width:calc(100% + 28px); gap:34px; justify-content:flex-start; white-space:nowrap; }.section-heading,.process-grid { grid-template-columns:1fr; gap:42px; }.work-section,.services,.process { padding:90px 0; }.section-heading { margin-bottom:55px; }.project,.project-3,.project-4 { grid-column:span 12; }.service { grid-template-columns:42px 1fr 30px; }.service>div { grid-column:2/4; padding-top:16px; }.service h3 { font-size:48px; }.steps { grid-template-columns:1fr 1fr; }.contact { padding:90px 0 60px; }.contact h2 { margin:60px 0 80px; }.contact-grid { grid-template-columns:1fr; gap:70px; }.field-row { grid-template-columns:1fr; }.contact-info { border-left:0; border-top:1px solid var(--line); padding:30px 0 0; }.contact-info>p { margin-bottom:30px; }.back-to-top { right:14px; bottom:14px; }.footer { grid-template-columns:1fr 1fr; height:130px; }.footer p:nth-child(2) { display:none; }
}
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } * { transition:none!important; animation:none!important; }.rotating-word>span { display:none; opacity:1; transform:none; }.rotating-word>span:first-child { display:block; }.second-look { clip-path:none; }.second-look:after { transform:scaleX(1); } }