:root{--pink:#ff4fb3;--hot:#ff1f8f;--ink:#111015;--cream:#fff9f2;--silver:#e7e7ed;--blue:#8bd7ff;--line:rgba(17,16,21,.16)}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--cream);color:var(--ink);font-family:'DM Sans',sans-serif;font-size:16px;overflow-x:hidden}
a{color:inherit;text-decoration:none}
img{display:block;width:100%}
.nav-wrap{position:sticky;top:0;z-index:20;background:rgba(255,249,242,.88);backdrop-filter:blur(18px);border-bottom:1px solid var(--line)}
.nav{max-width:1400px;margin:auto;height:78px;padding:0 42px;display:flex;align-items:center;justify-content:space-between}
.wordmark{font-family:'Space Grotesk',sans-serif;font-weight:700;letter-spacing:-.04em;font-size:1.16rem}
.wordmark span{color:var(--pink)}
.nav-links{display:flex;gap:34px;font-weight:600;font-size:.92rem}
.nav-links a:hover{color:var(--hot)}
.mini-cta{background:var(--ink);color:white;border-radius:999px;padding:13px 20px;font-weight:700;font-size:.9rem}
.hero{min-height:750px;max-width:1400px;margin:auto;padding:64px 42px 76px;display:grid;grid-template-columns:1.05fr .95fr;gap:56px;align-items:center}
.eyebrow{font-weight:700;letter-spacing:.12em;font-size:.78rem;text-transform:uppercase}
.eyebrow span{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--hot);margin-right:7px}
.eyebrow.pink{color:var(--hot)}
h1,h2{font-family:'Space Grotesk',sans-serif;letter-spacing:-.065em;margin:0;line-height:.92}
h1{font-size:clamp(3.6rem,6vw,6.6rem);max-width:760px}
h1 em{font-style:italic;color:var(--hot);text-shadow:3px 3px 0 var(--blue);white-space:nowrap}
.lede{font-size:1.22rem;line-height:1.55;max-width:610px;margin:32px 0}
.hero-actions{display:flex;gap:14px;flex-wrap:wrap}
.primary,.secondary{display:inline-flex;align-items:center;gap:25px;border-radius:999px;padding:17px 24px;font-weight:700}
.primary{background:var(--hot);color:white;box-shadow:5px 5px 0 var(--ink)}
.secondary{border:1.5px solid var(--ink)}
.quick-stats{display:flex;gap:42px;margin-top:46px}
.quick-stats div{display:flex;flex-direction:column}
.quick-stats strong{font-family:'Space Grotesk';font-size:1.65rem}
.quick-stats span{font-size:.8rem;text-transform:uppercase;letter-spacing:.08em;color:#68646d}
.hero-visual{position:relative;min-height:620px}
.hero-visual>img{height:620px;object-fit:cover;object-position:center 30%;border-radius:45% 45% 12px 12px;filter:saturate(1.08);box-shadow:14px 16px 0 var(--pink)}
.chrome-label{position:absolute;z-index:2;right:-24px;top:30px;background:linear-gradient(135deg,#fafafa,#b9bac4,#fff);border:1px solid #aaa;border-radius:999px;padding:11px 18px;font-family:'Space Grotesk';font-size:.74rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;transform:rotate(4deg)}
.sticker{position:absolute;z-index:3;font-family:'Space Grotesk';font-weight:800;text-align:center}
.sticker-one{bottom:42px;left:-40px;background:#d9ff48;padding:13px 18px;border:2px solid var(--ink);transform:rotate(-6deg);box-shadow:5px 5px 0 var(--ink)}
.sticker-two{right:-22px;bottom:102px;width:92px;height:92px;border-radius:50%;background:var(--blue);display:grid;place-items:center;border:2px solid var(--ink);transform:rotate(8deg)}
.sparkle{position:absolute;color:var(--hot);font-size:3rem}
.s1{left:-34px;top:80px}
.s2{right:-28px;top:185px}
.marquee{overflow:hidden;background:var(--ink);color:white;border-block:3px solid var(--ink);padding:15px 0;white-space:nowrap}
.marquee div{font-family:'Space Grotesk';font-weight:700;letter-spacing:.1em;font-size:.9rem;word-spacing:18px}
.section{padding:110px max(42px,calc((100vw - 1316px)/2))}
.section-heading{display:grid;grid-template-columns:1fr 2fr;gap:24px;margin-bottom:54px;align-items:end}
.section-heading h2{font-size:clamp(3.4rem,6vw,6.4rem);grid-row:1/3;grid-column:2}
.section-heading>p:last-child{grid-column:1;max-width:360px;line-height:1.6}
.metric-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.metric{min-height:300px;padding:24px;border:1.5px solid var(--ink);display:flex;flex-direction:column;justify-content:flex-end;position:relative}
.metric>span{position:absolute;top:22px;right:22px;font-weight:700}
.metric strong{font:700 clamp(2.9rem,4vw,5rem)/1 'Space Grotesk'}
.metric h3{margin:12px 0 4px;font-size:1.08rem}
.metric p{margin:0;color:inherit;opacity:.7}
.pink-card{background:var(--pink)}
.black-card{background:var(--ink);color:white}
.chrome-card{background:linear-gradient(135deg,#fff,#bbbcc6 45%,#fefefe 70%,#a7a8b0)}
.white-card{background:white}
.audience-strip{display:grid;grid-template-columns:repeat(3,1fr);border:1.5px solid var(--ink);border-top:0}
.audience-strip div{padding:22px 26px;border-right:1.5px solid var(--ink);display:grid}
.audience-strip div:last-child{border:0}
.audience-strip span,.audience-strip small{text-transform:uppercase;letter-spacing:.08em;font-size:.68rem}
.audience-strip strong{font:700 1.45rem 'Space Grotesk';margin:7px 0}
.work{background:var(--ink);color:white}
.section-heading.light .eyebrow{color:var(--pink)}
.gallery{display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:14px}
.gallery figure{margin:0;background:#222;position:relative;overflow:hidden}
.gallery img{height:600px;object-fit:cover;transition:transform .5s ease}
.gallery figure:hover img{transform:scale(1.025)}
.gallery-main img{object-position:center 25%}
.gallery figure:nth-child(2) img{object-position:56% center}
.gallery figcaption{position:absolute;left:0;right:0;bottom:0;padding:55px 20px 18px;background:linear-gradient(transparent,rgba(0,0,0,.82));display:flex;justify-content:space-between;font-weight:700}
.gallery figcaption span{font-size:.9rem;text-transform:uppercase;letter-spacing:.08em}
.about{display:grid;grid-template-columns:1.5fr .8fr;gap:16px}
.about-card{background:var(--pink);padding:64px;border:1.5px solid var(--ink)}
.about-card h2{font-size:clamp(3rem,5vw,5.3rem);max-width:950px}
.about-copy{display:grid;grid-template-columns:1fr 1fr;gap:30px;margin-top:48px;line-height:1.65;font-size:1.06rem}
.services{background:var(--silver);padding:42px;border:1.5px solid var(--ink)}
.services ul{list-style:none;margin:26px 0 0;padding:0}
.services li{display:flex;gap:20px;padding:20px 0;border-top:1px solid rgba(17,16,21,.2);font:600 1.08rem 'Space Grotesk'}
.services li span{font-size:.7rem;color:var(--hot)}
.cta{text-align:center;background:radial-gradient(circle at 15% 20%,var(--blue) 0 4%,transparent 4.3%),radial-gradient(circle at 85% 78%,#d9ff48 0 5%,transparent 5.3%),var(--cream);border-top:1px solid var(--line)}
.cta h2{font-size:clamp(4.5rem,9vw,9.5rem);margin:30px 0}
.cta a{display:inline-flex;gap:40px;background:var(--ink);color:white;border-radius:999px;padding:20px 28px;font-weight:700}
.cta a span{color:var(--pink)}
footer{background:var(--ink);color:white;padding:35px max(42px,calc((100vw - 1316px)/2));display:flex;justify-content:space-between;align-items:center;gap:20px}
.socials{display:flex;gap:24px;font-weight:600;font-size:.85rem}
footer p{font-size:.75rem;color:#aaa}
@media(max-width:1000px){.hero{grid-template-columns:1fr;padding-top:44px}
.hero-visual{max-width:650px}
.section-heading{grid-template-columns:1fr}
.section-heading h2,.section-heading>p:last-child{grid-column:1;grid-row:auto}
.metric-grid{grid-template-columns:1fr 1fr}
.gallery{grid-template-columns:1fr 1fr}
.gallery-main{grid-column:1/3}
.about{grid-template-columns:1fr}
.nav-links{display:none}
}
@media(max-width:650px){.nav{height:68px;padding:0 20px}
.mini-cta{padding:10px 13px;font-size:.78rem}
.hero{padding:44px 20px 58px;gap:38px}
h1{font-size:3.15rem}
.lede{font-size:1.05rem}
.quick-stats{gap:20px;justify-content:space-between}
.quick-stats strong{font-size:1.35rem}
.hero-visual{min-height:470px}
.hero-visual>img{height:470px;border-radius:38% 38% 8px 8px}
.chrome-label{right:-8px}
.sticker-one{left:-4px}
.sticker-two{right:-5px;bottom:80px}
.section{padding:78px 20px}
.section-heading h2{font-size:3.5rem}
.metric-grid{grid-template-columns:1fr}
.metric{min-height:235px}
.audience-strip{grid-template-columns:1fr}
.audience-strip div{border-right:0;border-bottom:1.5px solid var(--ink)}
.gallery{grid-template-columns:1fr}
.gallery-main{grid-column:1}
.gallery img{height:500px}
.about-card{padding:38px 24px}
.about-copy{grid-template-columns:1fr}
.services{padding:34px 24px}
.cta h2{font-size:4.4rem}
.cta a{font-size:.82rem;gap:15px;padding:17px 19px}
footer{align-items:flex-start;flex-direction:column;padding:32px 20px}
.socials{flex-wrap:wrap}
}

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

.gallery{grid-template-columns:repeat(4,1fr)}

.gallery img{height:550px}

.gallery figure:nth-child(1) img{object-position:center 25%}

.gallery figure:nth-child(2) img{object-position:center 20%}

.gallery figure:nth-child(3) img{object-position:56% center}

@media(max-width:1000px){.gallery{grid-template-columns:1fr 1fr}
}

@media(max-width:650px){.gallery{grid-template-columns:1fr}
.gallery img{height:500px}
}
