/* Media reviews grid (uses tokens from site.css) */
.media-wrap{ max-width:1280px; margin:0 auto; padding:0 24px; }
/* vehicle-make filter chips (KOL page) */
.media-makes{ display:flex; flex-wrap:wrap; gap:10px; margin:20px 0 4px; }
.media-make{ display:inline-flex; align-items:center; padding:9px 18px; border-radius:100px; font-size:14px; font-weight:550; color:var(--ink-2,#444); background:#f2f2f4; text-decoration:none; white-space:nowrap; transition:background .15s, color .15s; }
.media-make:hover{ background:#e6e6ea; color:var(--ink,#1d1d1f); }
.media-make.on{ background:#16161a; color:#fff; }
.media-hero{ background:linear-gradient(135deg,#0a0a0c,#1d1d1f 55%,#2c1414); color:#fff; padding:120px 0 72px; text-align:center; }
.media-eyebrow{ text-transform:uppercase; letter-spacing:.14em; font-size:13px; font-weight:600; color:#ff6b82; margin:0 0 16px; }
.media-h1{ font-size:clamp(34px,5vw,60px); line-height:1.05; font-weight:700; margin:0 auto; max-width:16ch; }
.media-lead{ margin:20px auto 0; max-width:58ch; font-size:18px; line-height:1.5; color:rgba(255,255,255,.72); }
.media-body{ padding:64px 0 96px; background:#fff; }
.media-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(300px,1fr)); gap:24px; }
.media-card{ display:block; text-decoration:none; color:inherit; border-radius:16px; overflow:hidden; background:#fff; border:1px solid rgba(0,0,0,.08); transition:transform .25s, box-shadow .25s; }
.media-card:hover{ transform:translateY(-4px); box-shadow:0 24px 50px -28px rgba(0,0,0,.26); }
.media-thumb{ position:relative; aspect-ratio:16/9; background:#111114; overflow:hidden; }
.media-thumb img{ width:100%; height:100%; object-fit:cover; display:block; }
.media-play{ position:absolute; inset:0; display:flex; align-items:center; justify-content:center; font-size:46px; color:#fff; opacity:.92; text-shadow:0 2px 12px rgba(0,0,0,.5); }
.media-play .ti{ color:#ff0033; }
.media-card-body{ padding:16px 18px 20px; }
.media-title{ font-size:16px; font-weight:600; line-height:1.35; margin:0 0 8px; color:var(--ink,#1d1d1f); display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.media-creator{ font-size:14px; color:var(--ink-3,#86868b); margin:0; }

/* ===== search + count + pagination ===== */
.media-search{ display:flex; align-items:center; gap:10px; max-width:720px; margin:0 auto 18px; background:#fff; border:1px solid rgba(0,0,0,.14); border-radius:100px; padding:6px 6px 6px 20px; position:relative; }
.media-search > i{ color:#86868b; font-size:19px; }
.media-search input{ flex:1; border:0; outline:0; font-size:16px; padding:11px 4px; background:none; font-family:inherit; color:#1d1d1f; }
.media-search button{ background:var(--brand-red,#c8102e); color:#fff; border:0; border-radius:100px; padding:11px 26px; font-size:15px; font-weight:600; cursor:pointer; font-family:inherit; transition:background .15s; }
.media-search button:hover{ background:var(--brand-red-dark,#8c0a1f); }
.media-search-clear{ position:absolute; right:118px; color:#86868b; display:flex; }
.media-search-clear:hover{ color:var(--brand-red,#c8102e); }
.media-count{ text-align:center; color:#6e6e73; font-size:14.5px; margin:0 0 26px; }
.media-count strong{ color:var(--ink,#1d1d1f); }
.media-empty{ text-align:center; padding:60px 20px; color:#6e6e73; }
.media-empty i{ font-size:46px; color:#c7c7cc; display:block; margin-bottom:12px; }
.media-empty p{ font-size:17px; margin:0 0 18px; }

.media-pager{ margin-top:40px; }
.media-pager .pagination{ list-style:none; display:flex; flex-wrap:wrap; gap:6px; justify-content:center; padding:0; margin:0; }
.media-pager .pagination li{ list-style:none; margin:0; }
.media-pager .pagination li a,
.media-pager .pagination li span{ display:inline-flex; align-items:center; justify-content:center; min-width:42px; height:42px; padding:0 13px; border:1px solid rgba(0,0,0,.12); border-radius:10px; font-size:14px; font-weight:600; text-decoration:none; color:var(--ink,#1d1d1f); background:#fff; transition:border-color .15s, color .15s; }
.media-pager .pagination li a:hover{ border-color:var(--brand-red,#c8102e); color:var(--brand-red,#c8102e); }
.media-pager .pagination li.active span{ background:var(--brand-red,#c8102e); color:#fff; border-color:var(--brand-red,#c8102e); }
.media-pager .pagination li.disabled span{ color:#c7c7cc; background:#fafafb; }

/* ===== video / review detail ===== */
.mv{ background:#fff; }
.mv-crumb{ font-size:13px; color:#86868b; padding:28px 0 0; display:flex; align-items:center; gap:6px; flex-wrap:wrap; }
.mv-crumb a{ color:#0071e3; text-decoration:none; }
.mv-crumb i{ font-size:14px; opacity:.6; }
.mv-crumb span{ color:#6e6e73; max-width:46ch; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.mv-top{ padding:24px 0 8px; }
/* big on-page player: video full-width on top, details below (keeps viewers on-site) */
/* top section spans the same width as the Full-review section below (media-wrap 1280),
   so the player + creator bio line up with the review content instead of sitting narrower */
.mv-grid{ display:block; }
.mv-player{ margin:0 auto 26px; max-width:1040px; }
.mv-meta{ width:100%; }
.mv-embed{ position:relative; aspect-ratio:16/9; border-radius:16px; overflow:hidden; background:#000; box-shadow:0 30px 60px -34px rgba(0,0,0,.5); }
.mv-embed iframe{ position:absolute; inset:0; width:100%; height:100%; border:0; }
.mv-embed-fallback{ display:flex; flex-direction:column; align-items:center; justify-content:center; gap:10px; color:#fff; text-decoration:none; }
.mv-embed-fallback i{ font-size:54px; color:#ff0033; }
.mv-meta .media-eyebrow{ margin-bottom:10px; }
.mv-title{ font-size:clamp(22px,2.4vw,30px); line-height:1.18; font-weight:700; margin:0 0 14px; color:var(--ink,#1d1d1f); }
.mv-tag{ display:inline-block; text-decoration:none; }
.mv-creator{ display:flex; align-items:flex-start; gap:12px; margin:18px 0 4px; padding:14px 0; border-top:1px solid rgba(0,0,0,.08); border-bottom:1px solid rgba(0,0,0,.08); }
.mv-avatar{ width:46px; height:46px; border-radius:50%; object-fit:cover; flex-shrink:0; }
.mv-creator-name{ font-weight:650; font-size:15px; margin:0; color:var(--ink,#1d1d1f); }
/* bio carries real line breaks (one fact per line) — preserve them */
.mv-creator-title{ font-size:13px; color:#5a5a60; margin:4px 0 0; white-space:pre-line; line-height:1.55; }
.mv-actions{ display:flex; gap:10px; flex-wrap:wrap; margin:20px 0 18px; }
.mv-btn-red,.mv-btn-line{ display:inline-flex; align-items:center; gap:8px; padding:12px 22px; border-radius:11px; font-size:14.5px; font-weight:600; text-decoration:none; cursor:pointer; }
.mv-btn-red{ background:var(--brand-red,#c8102e); color:#fff; }
.mv-btn-red:hover{ background:var(--brand-red-dark,#8c0a1f); }
.mv-btn-line{ border:1px solid rgba(0,0,0,.16); color:var(--ink,#1d1d1f); }
.mv-btn-line:hover{ border-color:var(--brand-red,#c8102e); color:var(--brand-red,#c8102e); }
.mv-facts{ list-style:none; margin:6px 0 0; padding:0; }
.mv-facts li{ display:flex; align-items:center; gap:9px; font-size:13.5px; color:#6e6e73; padding:5px 0; }
.mv-facts i{ color:#1f9d55; font-size:17px; }
.mv-article{ padding:40px 0 10px; }
.mv-h2{ font-size:22px; font-weight:680; margin:0 0 18px; color:var(--ink,#1d1d1f); }
.mv-frame{ width:100%; border:0; display:block; min-height:300px; background:#fff; }
.mv-related{ padding:40px 0 20px; }
@media(max-width:880px){ .mv-grid{ grid-template-columns:1fr; gap:22px; } }
@media(max-width:560px){ .media-search{ flex-wrap:wrap; border-radius:16px; padding:10px 14px; } .media-search button{ width:100%; } .media-search-clear{ display:none; } }
