:root { --ink:#090909; --paper:#fff; --muted:#a7a7a1; --line:rgba(9,9,9,.2); }
* { box-sizing:border-box; } html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:var(--paper); font:16px "DM Sans",Arial,sans-serif; }
.grain { position:fixed; z-index:3; inset:0; pointer-events:none; opacity:.025; background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 160 160' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"); }
.site-header { height:80px; padding:0 5.6vw; display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid var(--line); position:relative; z-index:4; }.wordmark { color:inherit; text-decoration:none; font:600 14px "DM Sans",sans-serif; letter-spacing:-.03em; } nav { display:flex; gap:28px; margin-left:auto; margin-right:48px; } nav a,.header-email { color:inherit; text-decoration:none; font-size:11px; font-weight:600; letter-spacing:.02em; }
.hero { min-height:610px; padding:106px 8.8vw 54px; position:relative; display:flex; flex-direction:column; align-items:center; }.hero h1,.section-heading h2,.about-section h2 { margin:0; max-width:970px; font:500 clamp(60px,8vw,126px)/.83 "Bodoni Moda",Georgia,serif; letter-spacing:-.07em; }.hero h1 { max-width:1100px; font-size:clamp(40px,5.6vw,84px); line-height:.9; text-align:center; }.hero em,h2 em,h3 em { font-weight:500; }.hero-bottom { margin-top:76px; display:flex; flex-direction:column; align-items:center; gap:26px; position:relative; z-index:1; }.hero-bottom p { max-width:760px; margin:0; font-size:14px; line-height:1.7; text-align:center; }.circle-link { width:48px; height:48px; color:inherit; border:1px solid currentColor; border-radius:50%; display:grid; place-items:center; text-decoration:none; color:var(--ink); font-size:20px; transition:.2s ease; }.circle-link:hover { background:var(--ink); color:var(--paper); }
.eyebrow,.project-number,.file-slot { font:10px "DM Mono",monospace; letter-spacing:.07em; text-transform:uppercase; }.eyebrow { margin:0 0 25px; color:rgba(9,9,9,.62); }
.work-section { background:var(--ink); color:var(--paper); padding:104px 8.8vw 0; }.section-heading h2 { font-size:clamp(54px,6.2vw,94px); }.feature-project { max-width:680px; padding:103px 0 84px; }.project-number { margin:0 0 23px; color:rgba(255,255,255,.58); }.feature-project h3,.reels h3,.ferrero-project h3 { margin:0 0 25px; font:500 clamp(57px,6.5vw,96px)/.8 "Bodoni Moda",Georgia,serif; letter-spacing:-.075em; }.feature-project>p:last-child,.reels-intro>p,.ferrero-intro>p:last-child { max-width:440px; margin:0; color:rgba(255,255,255,.7); font-size:14px; line-height:1.7; }
.reels { border-top:1px solid rgba(255,255,255,.27); padding:76px 0 110px; }.reels-intro { display:grid; grid-template-columns:1fr 1fr; gap:7vw; align-items:end; margin-bottom:45px; }.reels h3 { margin:0; font-size:clamp(47px,5.2vw,75px); }.reel-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }.reel-card video { display:block; width:100%; height:380px; object-fit:cover; background:#000; }.reel-card h4 { margin:16px 0 7px; font-weight:500; font-size:13px; }.file-slot { margin:0; color:rgba(255,255,255,.45); text-transform:none; letter-spacing:0; }
.ferrero-project { margin:0 -8.8vw; padding:104px 8.8vw 120px; background:var(--paper); color:var(--ink); }.ferrero-project .project-number { color:rgba(9,9,9,.55); }.ferrero-project h3 { font-size:clamp(54px,6vw,88px); }.ferrero-intro { display:grid; grid-template-columns:1fr 1fr; column-gap:8vw; align-items:end; margin-bottom:57px; }.ferrero-intro .project-number { grid-column:1/-1; }.ferrero-intro h3 { margin:0; }.ferrero-intro>p:last-child { color:rgba(9,9,9,.7); margin-bottom:8px; }.ferrero-gallery { display:grid; grid-template-columns:1fr 1fr; gap:16px; }.ferrero-image { margin:0; overflow:hidden; background:#e5e5e1; }.ferrero-image--wide { grid-column:1/-1; }.ferrero-image img { display:block; width:100%; height:100%; object-fit:cover; aspect-ratio:16/9; transition:transform .45s ease; }.ferrero-image:not(.ferrero-image--wide) img { aspect-ratio:4/3; }.ferrero-image--storyboard { grid-column:1/-1; }.ferrero-image--storyboard img { aspect-ratio:16/9; }.ferrero-image:hover img { transform:scale(1.018); }
.about-section { padding:120px 8.8vw 135px; display:grid; grid-template-columns:1fr 1.15fr; gap:8vw; }.about-section>div { grid-column:2; }.about-section h2 { font-size:clamp(53px,6vw,88px); }.about-section>div>p:not(.eyebrow) { max-width:500px; margin:42px 0 28px; line-height:1.75; font-size:15px; }.about-section>div>p:not(.eyebrow) + p:not(.eyebrow) { margin-top:-8px; }.text-link { color:inherit; border-bottom:1px solid currentColor; padding-bottom:5px; text-decoration:none; font-size:13px; font-weight:600; }
 .ferrero-image--storyboard img { object-fit:contain; transform:scale(.92); background:#151515; } .ferrero-image--storyboard:hover img { transform:scale(.95); }
footer { padding:75px 8.8vw 26px; color:var(--paper); background:var(--ink); } footer .eyebrow { color:rgba(255,255,255,.57); }.footer-email { display:inline-block; margin:5px 0 95px; max-width:100%; overflow-wrap:anywhere; color:inherit; text-decoration:none; font:500 clamp(39px,5.5vw,80px)/.9 "Bodoni Moda",Georgia,serif; letter-spacing:-.065em; }.footer-bottom { display:flex; justify-content:space-between; flex-wrap:wrap; gap:10px; padding-top:19px; border-top:1px solid rgba(255,255,255,.35); font:10px "DM Mono",monospace; }.footer-bottom a { color:inherit; text-decoration:none; }
@media (max-width:760px) { .site-header { height:68px; padding:0 6vw; }.wordmark { font-size:12px; } nav { display:none; }.header-email { font-size:11px; }.hero { min-height:570px; padding:85px 7vw 48px; }.hero-mark { top:278px; right:-150px; width:98vw; }.hero-bottom { margin-top:62px; }.work-section { padding:76px 7vw 0; }.feature-project { padding:76px 0 65px; }.reels { padding:64px 0 76px; }.reels-intro,.ferrero-intro,.about-section { display:block; }.reels-intro h3 { margin-bottom:24px; }.reel-grid { grid-template-columns:1fr; gap:34px; }.reel-card video { height:430px; }.ferrero-project { margin:0 -7vw; padding:75px 7vw 80px; }.ferrero-intro h3 { margin-bottom:25px; }.ferrero-gallery { grid-template-columns:1fr; gap:12px; }.ferrero-image--wide,.ferrero-image--storyboard { grid-column:auto; }.ferrero-image img,.ferrero-image:not(.ferrero-image--wide) img,.ferrero-image--storyboard img { aspect-ratio:4/3; }.about-section { padding:85px 7vw; }.about-section>div>p:not(.eyebrow) { margin-top:34px; } footer { padding:65px 7vw 25px; }.footer-email { margin-bottom:75px; font-size:clamp(32px,9vw,52px); } }
