:root{
  --bg:#0b1a24; --card:#0f2533; --ink:#f5e8d6; --muted:#b9c6d1; --brand:#c88a3a;
}
*{box-sizing:border-box}
html,body{margin:0;background:var(--bg);color:var(--ink);font-family:system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif}
a{color:#ffd27a;text-decoration:none}
a:hover{text-decoration:underline}
.container{max-width:1100px;margin:0 auto;padding:24px}
/* NAV */
nav{position:sticky;top:0;z-index:10;background:#09141c;border-bottom:1px solid rgba(255,255,255,.06)}
.nav-inner{display:flex;align-items:center;justify-content:space-between;gap:18px}
.brand{display:flex;align-items:center;gap:12px}
.brand img{height:42px}
.menu{display:flex;gap:12px;flex-wrap:wrap}
.menu a{padding:8px 12px;border:1px solid rgba(255,255,255,.12);border-radius:8px}
.menu a.active{background:#0f2533}
/* HERO */
.hero{display:grid;grid-template-columns:1.1fr .9fr;gap:24px;align-items:center;padding:36px 0}
.badge{display:inline-block;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.12);padding:8px 12px;border-radius:999px;color:var(--muted)}
h1{font-size:clamp(28px,4vw,46px);line-height:1.05;margin:8px 0 10px}
.lead{color:var(--muted)}
.cta{margin-top:14px;display:flex;gap:12px;flex-wrap:wrap}
.btn{background:var(--brand);color:#111;padding:10px 14px;border-radius:10px;font-weight:700}
.btn.alt{background:transparent;border:1px solid rgba(255,255,255,.2);color:var(--ink)}
.hero-media{display:flex;align-items:center;justify-content:center;background:#0f2230;border:1px solid rgba(255,255,255,.08);border-radius:12px;min-height:280px}
.hero-logo{max-width:520px;width:100%;height:auto;padding:16px}
/* CARDS */
.grid{display:grid;gap:16px;grid-template-columns:repeat(auto-fill,minmax(220px,1fr))}
.card{background:var(--card);border:1px solid rgba(255,255,255,.08);border-radius:14px;overflow:hidden}
.card img{width:100%;height:280px;object-fit:cover;display:block}
.card .p{padding:12px 14px;color:var(--muted)}
/* MISC */
.banner{display:inline-block;background:#b00020;color:#fff;font-weight:800;padding:8px 12px;border-radius:8px;text-transform:uppercase;letter-spacing:.5px}
footer{border-top:1px solid rgba(255,255,255,.06);padding:24px 0;margin-top:32px;color:var(--muted);text-align:center}
.partner{display:flex;flex-direction:column;gap:8px;margin-top:12px}
.kme{max-width:240px;width:100%;height:auto;background:#fff;border-radius:6px;padding:6px}
.pdf-embed{width:100%;height:820px;border:0;border-radius:12px;background:#0a1a20}
@media (max-width:900px){.hero{grid-template-columns:1fr}}

/* ===== Mobile polish ===== */
@media (max-width: 600px) {
  /* Container breathing room */
  .container { 
    max-width: 100%;
    padding: 16px 14px;
  }

  /* Nav */
  nav { position: sticky; top: 0; z-index: 10; }
  .nav-inner {
    display: grid;
    grid-template-columns: auto 1fr;
    align-items: center;
    gap: 10px 12px;
    padding: 10px 14px;
  }
  .brand img { height: 28px; }           /* smaller crest/logo */
  .menu {
    justify-self: end;
    display: grid;
    grid-auto-flow: column;
    gap: 8px;                             /* tighter button gaps */
  }
  .menu a { padding: 8px 10px; font-size: 13px; }

  /* Headings & pill */
  h1 { font-size: 28px; line-height: 1.1; margin: 10px 0 8px; }
  .tag-pill { font-size: 12px; padding: 6px 10px; }

  /* Hero becomes single column */
  .hero { 
    display: grid;
    grid-template-columns: 1fr;
    gap: 14px;
    padding: 8px 0 4px;
  }
  .hero-text { order: 1; }
  .hero-media { order: 2; }
  .hero-media img,
  .hero-media video { 
    width: 100%;
    height: auto;
    display: block;
    border-radius: 8px;
  }

  /* Buttons: full width, stacked */
  .btn-row {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
    margin: 12px 0 6px;
  }
  .btn, .btn-primary { width: 100%; text-align: center; }

  /* One Sheet: fit nicely on phone */
  .pdf-embed,
  object[type="application/pdf"] {
    width: 100% !important;
    max-width: 100%;
    height: 65vh;              /* tall enough to read, not endless */
    border-radius: 8px;
  }

  /* Cards/grids on Cast & Creatives */
  .grid { 
    display: grid;
    grid-template-columns: 1fr 1fr;       /* 2-up on phones */
    gap: 12px;
  }
  @media (max-width: 420px) {
    .grid { grid-template-columns: 1fr; } /* 1-up on very small phones */
  }
  .card img { width: 100%; height: auto; border-radius: 8px; }

  /* Footer */
  footer { font-size: 12px; padding: 16px 12px; text-align: center; }
}