/* SPARX — brands page extras (loaded after main.css) */
.page-hero{min-height:auto;padding-top:150px;padding-bottom:70px}
.page-hero .hero-grid{align-items:center}
.page-hero h1{font-family:var(--f-display);font-weight:400;font-size:clamp(3rem,7.5vw,6rem);line-height:.95;letter-spacing:3px}
.page-hero h1 span{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.page-hero .hero-sub{margin-top:22px}
.proof-card{padding:34px}
.proof-card .logo{width:84px;height:84px;border-radius:50%;object-fit:cover;border:2px solid rgba(155,48,255,.6);margin-bottom:18px;box-shadow:var(--glow-p)}
.proof-card h2{font:400 2rem/1.05 var(--f-display);letter-spacing:2px;margin:6px 0 10px}
.proof-card>p{color:var(--muted)}
.mini{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:22px}
.mini div{padding:14px;border:1px solid var(--line-soft);border-radius:14px;background:var(--surface)}
.mini b{display:block;font:400 1.9rem var(--f-display);letter-spacing:2px;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.mini span{color:var(--muted);font-size:.9rem}

.metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-bottom:18px}
.metric b{display:block;font:400 clamp(2.6rem,4vw,3.6rem)/1 var(--f-display);letter-spacing:2px;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.metric span{display:block;font-weight:600;margin:10px 0 6px}
.metric small{font:400 .68rem var(--f-mono);letter-spacing:2px;color:var(--muted);text-transform:uppercase}
.plat-lists{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.plat-lists h3{font:400 1.7rem var(--f-display);letter-spacing:3px;margin-bottom:14px}
.plat-lists li{display:flex;justify-content:space-between;gap:12px;padding:11px 0;border-bottom:1px solid var(--line-soft);color:var(--muted)}
.plat-lists li:last-child{border:0}
.plat-lists strong{color:var(--text);font-family:var(--f-mono);font-size:.9rem}
.row-head{display:flex;justify-content:space-between;align-items:end;gap:30px;flex-wrap:wrap;margin-bottom:clamp(30px,4vw,50px)}
.row-head p{color:var(--muted);max-width:520px}

.featured{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}
.campaign{padding:0;display:block;text-decoration:none}
.campaign>img{width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;transition:transform .6s}
.campaign:hover>img{transform:scale(1.04)}
.campaign-body{padding:24px 26px 28px}
.campaign-tag{font:700 .72rem var(--f-mono);letter-spacing:2px;color:var(--blue);margin-bottom:10px}
.campaign h3{font:400 1.6rem var(--f-display);letter-spacing:2px;margin-bottom:6px}
.campaign p{color:var(--muted)}
.meshy-collage{display:grid;grid-template-columns:1fr 1fr;gap:2px;background:#000}
.meshy-reel{position:relative;display:block;aspect-ratio:1/1;overflow:hidden}
.meshy-reel img{width:100%;height:100%;object-fit:cover;transition:transform .6s}
.meshy-reel:hover img{transform:scale(1.05)}
.meshy-result{position:absolute;left:10px;bottom:10px;padding:6px 12px;border-radius:999px;background:rgba(5,5,15,.82);backdrop-filter:blur(8px);font:700 .75rem var(--f-mono)}
.meshy-result b{color:var(--blue)}
.mesh-links{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}
.mesh-links a{font:700 .72rem var(--f-mono);letter-spacing:1px;text-decoration:none;padding:7px 12px;border:1px solid var(--line);border-radius:999px;transition:background .2s}
.mesh-links a:hover{background:rgba(155,48,255,.2)}

.archive{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.archive a{display:flex;gap:16px;align-items:center;text-decoration:none;padding:12px;border-radius:16px;border:1px solid var(--line-soft);background:var(--surface);transition:transform .3s,border-color .3s,background .3s}
.archive a:hover{transform:translateY(-4px);border-color:var(--line);background:var(--surface-2)}
.archive-thumb{flex:none;width:128px;aspect-ratio:16/10;border-radius:10px;overflow:hidden;background:#000}
.archive-thumb img{width:100%;height:100%;object-fit:cover}
.archive small{display:block;font:700 .66rem var(--f-mono);letter-spacing:2px;color:var(--blue);text-transform:uppercase}
.archive strong{display:block;font:400 1.25rem var(--f-display);letter-spacing:1.5px;margin:2px 0}
.archive span{color:var(--muted);font-size:.92rem;line-height:1.3;display:block}

.formats{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.format b{display:block;font:400 1.5rem var(--f-display);letter-spacing:2px;margin-bottom:8px}
.format p{color:var(--muted)}
.cta-box{display:grid;grid-template-columns:1.3fr 1fr;gap:30px;align-items:center;padding:clamp(34px,6vw,70px);border-radius:28px;border:1px solid var(--line);background:radial-gradient(800px circle at 0% 0%,rgba(155,48,255,.22),transparent 60%),linear-gradient(160deg,var(--surface-2),var(--surface))}
.cta-box h2{font:400 clamp(2.2rem,5vw,3.8rem)/1 var(--f-display);letter-spacing:3px;margin:10px 0 14px}
.cta-box p{color:var(--muted)}
.cta-actions{display:grid;gap:12px}
.cta-actions .btn{justify-content:center;text-align:center;word-break:break-word;letter-spacing:1px}

@media(max-width:1060px){.archive{grid-template-columns:repeat(2,1fr)}.formats{grid-template-columns:repeat(2,1fr)}.metrics{grid-template-columns:repeat(2,1fr)}}
@media(max-width:860px){.plat-lists,.featured,.cta-box{grid-template-columns:1fr}}
@media(max-width:600px){.archive{grid-template-columns:1fr}.formats{grid-template-columns:1fr}.metrics{gap:12px}.archive-thumb{width:110px}}

.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;counter-reset:s}
.step b{display:block;font:400 3.4rem/1 var(--f-display);color:transparent;-webkit-text-stroke:1.5px rgba(0,212,255,.55);letter-spacing:2px;margin-bottom:8px}
.step h3{font:400 1.5rem var(--f-display);letter-spacing:3px;margin-bottom:6px}
.step p{color:var(--muted)}
@media(max-width:1060px){.steps{grid-template-columns:repeat(2,1fr)}}
@media(max-width:600px){.steps{grid-template-columns:1fr}}
