/* ============================================================
   MEDIA / NEWSROOM — Mini Nash
   Brand aesthetic (black + signal red), matches the landing,
   founder page, and the launch film itself. Light + fast.
   ============================================================ */
:root{
  --bg:#06060a; --bg-deep:#03030a;
  --ink:#ffffff; --ink-soft:rgba(255,255,255,.66); --ink-faint:rgba(255,255,255,.40); --ink-ghost:rgba(255,255,255,.12);
  --accent:#ff2545;
  --font-body:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  --font-mono:ui-monospace,"SF Mono",Menlo,Consolas,monospace;
  --maxw:1080px; --ease:cubic-bezier(.16,1,.3,1);
}
*{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;background:var(--bg-deep);}
body{
  font-family:var(--font-body); color:var(--ink-soft); line-height:1.6; min-height:100vh;
  background:
    radial-gradient(900px 600px at 85% -10%, rgba(255,37,69,.14), transparent 60%),
    linear-gradient(180deg,var(--bg) 0%, var(--bg-deep) 100%);
  background-attachment:fixed; -webkit-font-smoothing:antialiased;
}
body::before{ content:""; position:fixed; inset:0; pointer-events:none; z-index:0;
  background-image:linear-gradient(rgba(255,255,255,.03) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.03) 1px,transparent 1px);
  background-size:54px 54px;
  -webkit-mask-image:radial-gradient(circle at 50% 0%, #000, transparent 70%);
  mask-image:radial-gradient(circle at 50% 0%, #000, transparent 70%);
}
.wrap{position:relative; z-index:1; max-width:var(--maxw); margin:0 auto; padding:clamp(1.5rem,4vw,3rem);}
a{color:inherit;}

/* topbar */
.topbar{display:flex; align-items:center; justify-content:space-between; gap:1rem; margin-bottom:clamp(2rem,6vw,3.5rem);}
.topbar__back{font-family:var(--font-mono); font-size:.72rem; letter-spacing:.18em; text-transform:uppercase; color:var(--ink-faint); text-decoration:none; border:1px solid var(--ink-ghost); padding:.5rem .8rem; border-radius:6px; transition:color .2s var(--ease),border-color .2s var(--ease);}
.topbar__back:hover{color:var(--ink); border-color:rgba(255,255,255,.4);}
.topbar__cta{font-family:var(--font-mono); font-size:.72rem; letter-spacing:.14em; text-transform:uppercase; color:var(--accent); text-decoration:none;}
.topbar__cta:hover{text-decoration:underline;}

/* masthead */
.masthead{margin-bottom:clamp(2.4rem,6vw,3.6rem);}
.eyebrow{font-family:var(--font-mono); font-size:.72rem; letter-spacing:.26em; text-transform:uppercase; color:var(--accent); margin-bottom:.85rem;}
.masthead__title{font-size:clamp(3rem,9vw,5.5rem); line-height:.95; letter-spacing:-.03em; font-weight:800; color:var(--ink);}
.masthead__sub{font-size:clamp(1rem,2.4vw,1.15rem); color:var(--ink-soft); margin-top:1rem; max-width:56ch;}
.rule{margin-top:1.6rem; height:0; border:none; border-top:1px solid var(--ink-ghost);}

/* featured film */
.featured{display:grid; grid-template-columns:minmax(0,360px) 1fr; gap:clamp(1.5rem,4vw,3rem); align-items:center; margin:clamp(1.5rem,4vw,2.5rem) 0 clamp(2.5rem,7vw,4rem);}
.film{position:relative; border-radius:18px; overflow:hidden; border:1px solid var(--ink-ghost); box-shadow:0 30px 80px rgba(0,0,0,.5), 0 0 60px rgba(255,37,69,.12); background:#000;}
.film__player{display:block; width:100%; height:auto; aspect-ratio:1080/1350;}
.film__badge{position:absolute; top:14px; left:14px; z-index:2; font-family:var(--font-mono); font-size:.6rem; letter-spacing:.16em; text-transform:uppercase; color:#fff; background:rgba(255,37,69,.92); padding:.35rem .65rem; border-radius:999px;}
.feature__kicker{font-family:var(--font-mono); font-size:.72rem; letter-spacing:.16em; text-transform:uppercase; color:var(--accent); margin-bottom:.7rem;}
.feature__title{font-size:clamp(2rem,4.5vw,3rem); line-height:1.02; letter-spacing:-.025em; font-weight:800; color:var(--ink); margin-bottom:1rem;}
.feature__blurb{font-size:1.05rem; color:var(--ink-soft); margin-bottom:1.6rem; max-width:48ch;}
.actions{display:flex; flex-wrap:wrap; gap:.8rem;}
.btn{display:inline-block; font-weight:700; letter-spacing:.01em; padding:.85rem 1.5rem; border-radius:999px; text-decoration:none; transition:transform .16s var(--ease),box-shadow .16s var(--ease),background .2s var(--ease),color .2s var(--ease),border-color .2s var(--ease);}
.btn--primary{background:var(--accent); color:#fff; box-shadow:0 10px 30px rgba(255,37,69,.3);}
.btn--primary:hover{transform:translateY(-2px); box-shadow:0 14px 40px rgba(255,37,69,.42);}
.btn--ghost{border:1px solid var(--ink-ghost); color:var(--ink);}
.btn--ghost:hover{border-color:var(--accent); color:#fff;}

/* collection */
.section-label{font-family:var(--font-mono); font-size:.72rem; letter-spacing:.2em; text-transform:uppercase; color:var(--ink-faint); margin:0 0 1.3rem;}
.grid{display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:1.2rem;}
.tile{display:block; text-decoration:none; border:1px solid var(--ink-ghost); border-radius:14px; padding:1.5rem 1.4rem; background:rgba(255,255,255,.025); transition:border-color .2s var(--ease),transform .2s var(--ease),background .2s var(--ease);}
.tile:hover{border-color:var(--accent); transform:translateY(-3px); background:rgba(255,37,69,.06);}
.tile__kicker{font-family:var(--font-mono); font-size:.64rem; letter-spacing:.16em; text-transform:uppercase; color:var(--accent);}
.tile__title{font-size:1.3rem; font-weight:700; color:var(--ink); margin:.5rem 0 .4rem; letter-spacing:-.01em;}
.tile__desc{font-size:.92rem; color:var(--ink-faint);}
.tile__more{display:inline-block; margin-top:.9rem; font-family:var(--font-mono); font-size:.7rem; letter-spacing:.1em; color:var(--ink);}
.tile__more::after{content:" →"; color:var(--accent);}
.muted{color:var(--ink-faint); font-size:.95rem; margin-top:1.2rem;}

/* footer */
.foot{margin-top:4rem; padding-top:1.5rem; border-top:1px solid var(--ink-ghost); font-family:var(--font-mono); font-size:.7rem; letter-spacing:.08em; color:var(--ink-faint); display:flex; justify-content:space-between; gap:1rem; flex-wrap:wrap;}
.foot a{color:var(--ink-faint); text-decoration:none;}
.foot a:hover{color:var(--ink);}

@media (max-width:760px){ .featured{grid-template-columns:1fr; max-width:420px; margin-inline:auto;} .foot{flex-direction:column;} }
@media (prefers-reduced-motion:reduce){ html{scroll-behavior:auto;} .btn:hover,.tile:hover{transform:none;} }