/* Image-led campaign landing. Existing black / silver / crimson glass system. */
.campaign-landing main { overflow: clip; }
.hero.hero--studio { display:grid; grid-template-columns:1.08fr 1fr; align-items:center; gap:clamp(24px,4vw,64px); max-width:1320px; margin:0 auto; padding:64px 28px 52px; min-height:min(800px,calc(100dvh - 85px)); text-align:left; }
.hero-copy, .hero-visual { min-width:0; }
.hero-eyebrow { display:flex; align-items:center; flex-wrap:wrap; gap:10px; font-family:var(--font-mono); text-transform:uppercase; font-size:11px; letter-spacing:.12em; color:var(--text-2); margin-bottom:28px; }
.hero-eyebrow .icon { color:#ff667d; }
.hero-eyebrow span { margin-left:auto; color:var(--text); letter-spacing:.03em; }
.hero-title { font-size:clamp(45px,5.8vw,78px); line-height:1.02; letter-spacing:-.06em; margin:0; }
.hero-service-role { display:block; font-size:.44em; line-height:1.3; letter-spacing:-.035em; margin-top:18px; color:var(--text-2); }
.hero-tagline { max-width:470px; font-size:16px; line-height:1.8; color:var(--text-2); margin:28px 0; }
.hero-ctas { display:flex; flex-wrap:wrap; gap:12px; }
.hero-ctas .btn { min-height:54px; padding-inline:22px; }
.hero-note { color:var(--text-3); font-size:12px; margin-top:16px; }
.hero-disciplines { display:flex; gap:10px; flex-wrap:wrap; margin-top:36px; }
.hero-disciplines span { border:1px solid var(--g-line); background:var(--studio-surface); border-radius:30px; padding:9px 15px; font-size:11px; color:var(--text-2); box-shadow:inset 0 1px 0 #ffffff0b; }
.hero-visual { padding:10px 4px 30px; position:relative; }
.hero-photo-grid { display:grid; grid-template-columns:1.06fr 1fr; grid-template-rows:240px 240px; gap:12px; transform:rotate(1.5deg); }
.hero-shot { display:block; position:relative; border-radius:20px; overflow:hidden; border:1px solid #ffffff29; background:var(--card); box-shadow:0 20px 50px -32px #000; }
.hero-shot--0 { grid-row:span 2; margin-top:28px; }
.hero-shot--2 { margin-bottom:28px; }
.hero-shot img { width:100%; height:100%; object-fit:cover; transition:transform .32s var(--g-ease); }
.hero-photo-caption { position:absolute; inset:auto 0 0; display:flex; align-items:flex-end; justify-content:space-between; gap:12px; padding:38px 14px 15px; font-size:11px; color:white; background:linear-gradient(transparent,#000b); }
.hero-photo-caption .icon { flex:none; }
.hero-visual-label { display:flex; align-items:center; gap:8px; color:var(--text-3); font-family:var(--font-mono); font-size:10px; margin-top:24px; }
.landing-work,.landing-services,.landing-about,.landing-contact,.landing-faq { padding-block:64px; scroll-margin-top:100px; }
.section-heading { display:flex; align-items:flex-end; justify-content:space-between; flex-wrap:wrap; gap:24px; margin-bottom:28px; }
.section-heading h2,.landing-about h2,.contact-panel h2 { font-size:clamp(30px,3.9vw,48px); line-height:1.12; letter-spacing:-.045em; max-width:700px; margin:12px 0 0; }
.text-link { display:inline-flex; align-items:center; gap:10px; min-height:44px; font-size:13px; text-decoration:underline; text-underline-offset:5px; }
.work-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:28px 20px; }
.selected-project { display:block; min-width:0; }
.selected-project-media { aspect-ratio:4/5; position:relative; overflow:hidden; border-radius:18px; background:var(--card); border:1px solid var(--g-line); }
.selected-project-media img,.selected-project-media video { display:block; width:100%; height:100%; object-fit:cover; transition:transform .32s var(--g-ease); }
.selected-project-caption { display:flex; justify-content:space-between; gap:12px; align-items:center; padding:16px 3px; }
.selected-project-caption h3 { font-size:16px; font-weight:600; margin:0 0 5px; }
.selected-project-caption p { font-size:11px; color:var(--text-3); margin:0; }
.selected-project-caption > .icon { color:var(--text-2); flex:none; }
.project-video { position:absolute; bottom:16px; left:16px; display:flex; gap:7px; align-items:center; padding:8px 12px; background:#151218cc; border:1px solid #ffffff3b; border-radius:30px; backdrop-filter:blur(12px); font-size:12px; }
.offer-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; }
.offer-card { min-width:0; padding:30px; border:1px solid var(--g-line); border-radius:24px; box-shadow:var(--studio-depth); display:flex; align-items:flex-start; flex-direction:column; }
.offer-icon { width:48px; height:48px; display:grid; place-items:center; color:#ff667d; border:1px solid #ffffff24; border-radius:16px; background:linear-gradient(140deg,#ffffff10,#ffffff02); margin-bottom:24px; }
.offer-card h3 { font-size:25px; line-height:1.2; letter-spacing:-.035em; margin:0 0 16px; }
.offer-card p { font-size:14px; line-height:1.8; color:var(--text-2); margin-bottom:24px; }
.offer-card .text-link { margin-top:auto; }
.specialty-links { display:flex; flex-wrap:wrap; gap:10px 26px; margin-top:24px; }
.specialty-links a { display:inline-flex; align-items:center; gap:10px; min-height:44px; color:var(--text-2); font-size:12px; }
.landing-about { max-width:860px; }
.landing-about p:not(.section-label) { font-size:18px; line-height:1.85; color:var(--text-2); margin:24px 0 14px; }
.contact-panel { display:grid; grid-template-columns:1.2fr 1fr; align-items:center; gap:64px; padding:clamp(26px,5vw,64px); border-radius:28px; border:1px solid var(--g-line); box-shadow:var(--studio-depth); background:linear-gradient(125deg,#ffffff0b,#c8102e09); }
.contact-panel p:not(.section-label) { color:var(--text-2); font-size:15px; line-height:1.85; margin-top:24px; }
.contact-actions { display:flex; flex-direction:column; align-items:stretch; gap:14px; min-width:0; }
.contact-actions .btn { min-height:54px; text-align:center; white-space:normal; }
.contact-address { font-size:clamp(16px,2vw,23px); text-align:center; overflow-wrap:anywhere; margin-top:10px; }
.contact-actions > span { color:var(--text-3); text-align:center; font-size:11px; }
.landing-faq { max-width:860px; padding-top:12px; }
.landing-faq h2 { font-size:24px; margin-bottom:24px; }
.landing-faq details { border-top:1px solid var(--g-line); }
.landing-faq summary { cursor:pointer; padding:22px 0; font-size:15px; }
.landing-faq details p { color:var(--text-2); line-height:1.85; padding-bottom:24px; font-size:14px; }
@media(hover:hover) { .hero-shot:hover img,.selected-project:hover img { transform:scale(1.04); } .selected-project:hover h3,.specialty-links a:hover { color:var(--text); } }
@media(max-width:1000px) { .hero.hero--studio { gap:28px; padding-block:48px; } .hero-photo-grid { grid-template-rows:205px 205px; } .hero-ctas .btn { padding-inline:16px; font-size:13px; } .hero-eyebrow span { margin-left:0; } .contact-panel { gap:32px; } .offer-card { padding:24px; } }
@media(max-width:760px) { .hero.hero--studio { grid-template-columns:minmax(0,1fr); padding:42px 24px 24px; min-height:0; gap:32px; } .hero-title { font-size:clamp(44px,9vw,66px); max-width:600px; } .hero-service-role { font-size:.48em; } .hero-tagline { font-size:15px; margin:22px 0; } .hero-eyebrow { margin-bottom:24px; } .hero-eyebrow span { margin-left:auto; } .hero-disciplines { margin-top:24px; } .hero-visual { max-width:560px; width:100%; margin:auto; } .hero-photo-grid { grid-template-rows:185px 185px; } .work-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px 14px; } .offer-grid,.contact-panel { grid-template-columns:minmax(0,1fr); } .landing-work,.landing-services,.landing-about,.landing-contact { padding-block:40px; } .contact-actions { max-width:480px; width:100%; } }
@media(max-width:420px) { .hero-title { font-size:42px; } .hero-eyebrow { font-size:9px; gap:8px; letter-spacing:.06em; } .hero-eyebrow span { margin-left:0; } .hero-ctas { flex-direction:column; align-items:stretch; } .hero-ctas .btn { justify-content:center; } .hero-disciplines { gap:6px; } .hero-disciplines span { padding:8px 10px; font-size:10px; } .hero-photo-grid { grid-template-rows:145px 145px; gap:8px; } .hero-shot { border-radius:14px; } .hero-photo-caption { font-size:9px; padding:28px 9px 10px; } .hero-visual-label { font-size:9px; } .work-grid { grid-template-columns:minmax(0,1fr); } .landing-about p:not(.section-label) { font-size:16px; } }
@media(prefers-reduced-motion:reduce) { .hero-photo-grid { transform:none; } .hero-shot img,.selected-project-media img { transition:none; } .hero-shot:hover img,.selected-project:hover img { transform:none; } }
html[data-motion="reduced"] .hero-photo-grid { transform:none; }
html[data-motion="reduced"] .hero-shot img, html[data-motion="reduced"] .selected-project-media img { transition:none; }