@import url('https://fonts.googleapis.com/css2?family=Lato:ital,wght@0,400;0,700;0,900;1,400&display=swap');

:root { --ink:#1d1d1b; --acid:#76f950; --purple:#662aef; --bone:#f3f0e8; --pink:#ff5d9e; --orange:#ff7a00; --blue:#7bc8ff; --display:"Lato",Arial,sans-serif; --body:"Lato",Arial,sans-serif; }
* { box-sizing:border-box; } html { scroll-behavior:smooth; } body { margin:0; background:var(--ink); color:var(--bone); font-family:var(--body); } a { color:inherit; text-decoration:none; } button,input { font:inherit; }
.topbar { height:68px; padding:0 4.2vw; border-bottom:1px solid rgba(243,240,232,.26); display:flex; align-items:center; gap:24px; font-size:11px; letter-spacing:.05em; font-weight:700; }
.brand { display:inline-flex; align-items:center; line-height:1; } .brand img { display:block; width:136px; height:auto; }.edition { opacity:.7; }.home-link { margin-left:auto; text-decoration:underline; text-underline-offset:4px; }
.hero { padding:104px 8vw 82px; min-height:645px; position:relative; overflow:hidden; background:var(--purple); }.hero-star { position:absolute; width:min(25vw,300px); height:auto; right:6vw; bottom:-6vw; pointer-events:none; z-index:0; }.hero-angle { position:absolute; width:min(6vw,74px); height:auto; left:4.2vw; top:32px; pointer-events:none; z-index:0; }.hero-bolt { position:absolute; width:min(3.5vw,46px); height:auto; left:31vw; top:35px; pointer-events:none; z-index:0; filter:brightness(0) saturate(100%); }
.eyebrow { text-transform:uppercase; font-size:11px; font-weight:900; letter-spacing:.12em; color:var(--purple); margin:0 0 17px; }.hero h1 { font-family:var(--display); font-size:clamp(42px,6.7vw,102px); font-weight:900; line-height:.91; letter-spacing:-.075em; margin:0; max-width:1040px; position:relative; z-index:1; text-transform:uppercase; }.hero h1 em { color:var(--acid); font-style:normal; }.intro { font-size:19px; line-height:1.3; max-width:440px; margin:48px 0 22px; position:relative; z-index:1; }.hero-meta { font-size:12px; font-weight:700; display:flex; gap:10px; position:relative; z-index:1; margin-top:34px; }.jump { display:inline-flex; gap:24px; border-bottom:1px solid var(--bone); padding-bottom:7px; margin-top:67px; font-size:15px; font-weight:700; position:relative; z-index:1; }.jump span { color:var(--acid); }
.statement { background:var(--acid); color:var(--ink); padding:29px 8vw; display:flex; justify-content:space-between; gap:28px; align-items:start; }.statement p { font-size:clamp(22px,3.1vw,42px); font-weight:900; letter-spacing:-.06em; line-height:.96; max-width:810px; margin:0; }.statement span { font-size:11px; font-weight:700; white-space:nowrap; }
.archive { padding:100px 4.2vw 120px; background:var(--bone); color:var(--ink); position:relative; }.archive-head { display:flex; justify-content:space-between; gap:24px; align-items:end; }.archive-logo { display:block; width:144px; height:auto; margin:0 0 38px; }.archive h2,.case-modal h2 { font-family:var(--display); font-size:clamp(42px,5.2vw,80px); font-weight:900; letter-spacing:-.09em; line-height:.85; margin:0; text-transform:uppercase; }.search { width:300px; padding:11px 0; border-bottom:1px solid var(--ink); display:flex; gap:10px; }.search input { width:100%; border:0; background:transparent; outline:0; font-size:13px; }.search input::placeholder { color:#777; }.filters { display:flex; flex-wrap:wrap; gap:8px; margin:68px 0 22px; }.filters button { border:1px solid var(--ink); background:transparent; color:var(--ink); padding:9px 13px; cursor:pointer; border-radius:999px; font-size:13px; }.filters button:hover,.filters button.active { background:var(--purple); color:var(--bone); border-color:var(--purple); }.filters small { opacity:.6; margin-left:4px; }.result-count { font-size:11px; font-weight:700; margin:0 0 16px; }.winner-grid { display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid var(--ink); border-left:1px solid var(--ink); }.winner-card { --accent:var(--purple); padding:18px 20px 21px; min-height:330px; background:var(--bone); border-right:1px solid var(--ink); border-bottom:1px solid var(--ink); display:flex; flex-direction:column; position:relative; transition:.18s ease; }.winner-card:nth-child(6n+2){--accent:var(--purple)}.winner-card:nth-child(6n+3){--accent:var(--acid)}.winner-card:nth-child(6n+4){--accent:var(--purple)}.winner-card:nth-child(6n+5){--accent:var(--acid)}.winner-card:nth-child(6n){--accent:var(--purple)}.winner-card:hover { background:var(--accent); transform:translate(-3px,-3px); box-shadow:4px 4px 0 var(--ink); z-index:1; }.card-top { display:flex; justify-content:space-between; gap:8px; font-size:10px; font-weight:900; text-transform:uppercase; }.card-top b { color:var(--purple); }.winner-card:hover .card-top b { color:var(--ink); }.card-number { margin:30px 0 auto; font:900 58px/.8 var(--display); letter-spacing:-.12em; opacity:.22; }.winner-card h3 { font-family:var(--display); font-size:clamp(22px,2vw,34px); font-weight:900; letter-spacing:-.07em; line-height:.93; margin:0 0 10px; max-width:95%; text-transform:uppercase; }.winner-brand { font-size:15px; margin:0; font-weight:700; }.winner-agency { font-size:10px; font-weight:700; margin:8px 0 20px; text-transform:uppercase; }.card-action { padding:0; background:transparent; border:0; cursor:pointer; font-size:13px; font-weight:700; text-align:left; border-bottom:1px solid var(--ink); align-self:flex-start; }.card-action span { color:var(--purple); margin-left:8px; }.winner-card:hover .card-action span { color:var(--ink); }
footer { padding:28px 4.2vw; background:var(--ink); display:flex; align-items:center; gap:40px; font-size:11px; } footer p{opacity:.7; max-width:440px; margin:0;} footer>a:last-child{margin-left:auto; text-decoration:underline; text-underline-offset:4px; white-space:nowrap; }
.modal-backdrop { position:fixed; inset:0; z-index:10; background:rgba(0,0,0,.73); padding:22px; display:grid; place-items:center; }.case-modal { background:var(--bone); color:var(--ink); width:min(720px,100%); padding:42px; position:relative; box-shadow:10px 10px 0 var(--acid); }.close { position:absolute; right:18px; top:12px; border:0; background:transparent; font-size:34px; cursor:pointer; }.case-modal .eyebrow { color:var(--purple); }.modal-brand { margin:17px 0 26px; font-size:20px; font-weight:700; }.video { aspect-ratio:16/9; background:var(--ink); margin:0 0 28px; }.video iframe { width:100%; height:100%; border:0; }.modal-copy { font-size:21px; line-height:1.15; max-width:560px; }.case-modal dl { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; border-top:1px solid var(--ink); padding-top:16px; margin:34px 0; }.case-modal dt { font-size:10px; font-weight:900; text-transform:uppercase; margin-bottom:7px; }.case-modal dd { margin:0; font-size:13px; }.modal-actions { display:flex; gap:10px; flex-wrap:wrap; }.modal-actions a { padding:12px 16px; font-size:13px; font-weight:700; }.primary { background:var(--purple); color:#fff; }.secondary { border:1px solid var(--ink); }
@media(max-width:760px){.topbar{padding:0 20px}.topbar .brand img{width:120px}.edition{display:none}.hero{padding:80px 24px 75px;min-height:570px}.hero-star{width:46vw;right:5vw;bottom:-4vw}.hero-angle{width:50px;left:21px;top:23px}.hero-bolt{width:29px;left:auto;right:24px;top:27px}.hero h1{font-size:clamp(39px,11vw,59px)}.statement{padding:25px 24px}.archive{padding:72px 20px}.archive-logo{width:126px;margin-bottom:28px}.archive-head{display:block}.search{margin-top:35px;width:100%}.filters{margin-top:42px}.winner-grid{grid-template-columns:1fr}.winner-card{min-height:285px}footer{padding:25px 20px;display:grid;grid-template-columns:1fr 1fr;gap:20px}footer p{grid-column:1/-1;order:3}footer>a:last-child{margin-left:0}.case-modal{padding:32px 25px}.case-modal dl{grid-template-columns:1fr}.hero-meta{flex-wrap:wrap}.home-link{font-size:10px}}
