
:root{
  --bg:#000;--fg:#fff;--muted:rgba(255,255,255,.85);--border:rgba(255,255,255,.12);--pill:rgba(255,255,255,.06);
  --a1:#FF3B30;--a2:#FF9500;--a3:#FFCC00;--a4:#34C759;--a5:#007AFF;--a6:#5856D6;--a7:#AF52DE;
}
*{box-sizing:border-box} html,body{margin:0;padding:0;background:var(--bg);color:var(--fg);
  font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,'Helvetica Neue',Arial}
a{color:var(--fg);text-decoration:none} img{max-width:100%;display:block}
.container{max-width:1200px;margin:0 auto;padding:0 20px}
.btn{display:inline-block;padding:14px 20px;border-radius:18px;font-weight:700}
.btn-primary{background:linear-gradient(90deg,var(--a1),var(--a2),var(--a3),var(--a4),var(--a5),var(--a6),var(--a7));color:#fff;box-shadow:0 10px 30px rgba(0,0,0,.35)}
.btn-outline{border:1.5px solid rgba(255,255,255,.85);background:transparent}
.header{position:sticky;top:0;z-index:50;background:rgba(0,0,0,.6);backdrop-filter:blur(6px);border-bottom:1px solid var(--border)}
.header .inner{display:flex;align-items:center;justify-content:space-between;padding:14px 0}
.header .brand{display:flex;align-items:center;gap:10px}
.badge{font-size:10px;opacity:.8}
.hero{position:relative;min-height:86vh;display:flex;align-items:center;padding:80px 0;overflow:hidden}
.hero::before{content:"";position:absolute;inset:0;background:url('https://images.pexels.com/photos/2608517/pexels-photo-2608517.jpeg?auto=compress&cs=tinysrgb&dpr=2&h=1200&w=1600') center/cover no-repeat;filter:brightness(.55)}
.hero .content{position:relative;z-index:2;text-align:center}
h1{font-size:clamp(40px,6vw,72px);line-height:1.05;margin:0} h2{font-size:clamp(28px,4.2vw,44px);margin:0}
p.lead{font-size:clamp(16px,2.4vw,22px);opacity:.92}
.section{padding:80px 0;border-top:1px solid transparent}
.grid{display:grid;gap:18px} .grid-2{grid-template-columns:repeat(2,1fr)} .grid-3{grid-template-columns:repeat(3,1fr)} .grid-4{grid-template-columns:repeat(4,1fr)}
.pill{display:inline-block;padding:4px 8px;border-radius:999px;background:var(--pill);font-size:11px}
.card{border:1px solid var(--border);border-radius:18px;background:rgba(255,255,255,.06);overflow:hidden}
.card .body{padding:14px} .aspect-34{aspect-ratio:3/4;background:#111} .aspect-1{aspect-ratio:1/1;background:#111} .aspect-169{aspect-ratio:16/9;background:#111}
.footer{padding:40px 0;border-top:1px solid var(--border);text-align:center;opacity:.85}
.small{font-size:12px;opacity:.85}
.tagbar span{margin-right:6px}
@media (max-width:767px){.grid-2,.grid-3,.grid-4{grid-template-columns:1fr}}
