/*
Dedicated /trailer/ page — built from Blood Star Official Trailer.docx.
Reuses existing site components wherever the content matches one:
  - .bsw-trailer-section (08-trailer.css) is the actual video card, unchanged,
    just given id="trailer-video" so the hero's CTA can anchor-scroll to it.
  - .bsw-synopsis-row / -media / -panel (10-synopsis.css) for the two
    image+text "story" blocks (reuses the same two verified production
    stills already used on the homepage's own synopsis rows — Bobbi driving,
    Sheriff pulling her over — same film, same real photos, intentional
    reuse not a mistake).
  - .bsw-reception-grid / -card / -attr (09-reception.css) for the 4-quote
    strip, just dropped into a new lightweight wrapper here since the docx
    only supplied 4 quotes (all 4 already verified elsewhere on the site),
    not the homepage's full 8-quote reception section.
  - .bsw-btn / .bsw-distribution-btn-large / .bsw-lead / .bsw-h2 / .bsw-kicker
    / .bsw-section / .bsw-alt for every plain text section (About, Watch CTA)
    rather than inventing new equivalents.
Only genuinely new here: the hero (mirrors .bsw-watch-hero's structure/tokens
from 15-watch.css so the two pages read as siblings), the film-details table,
and the FAQ accordion — neither existed anywhere in this theme yet.

Deliberately alternates flat .bsw-section/.bsw-alt bands with the photo-driven
sections (hero, trailer card, synopsis rows) rather than giving every single
section its own full-bleed background image — the client's feedback on the
Watch page was that stacking many same-shaped photo sections back to back
reads as repetitive; here only the 3 sections that actually need a photo
(hero, trailer poster, two story stills) have one.
*/

/* Standing rule (2026-08-10): every page's hero is full viewport — width:100%, min-height:100vh — on every breakpoint, no smaller mobile override. Keep this in sync with .bsw-watch-hero (15-watch.css) and .bsw-hero-main (07-home-hero.css). */
.bsw-trailerhero{position:relative;overflow:hidden;width:100%;min-height:100vh;display:flex;align-items:center;background-size:cover;background-position:center}
.bsw-trailerhero::before{content:"";position:absolute;inset:0;background:linear-gradient(to right, rgba(0,0,0,.92) 0%, rgba(0,0,0,.72) 32%, rgba(0,0,0,.32) 62%, rgba(0,0,0,.05) 100%)}
.bsw-trailerhero-container{position:relative;z-index:2;max-width:var(--bsw-container-wide);margin:0 auto;padding:150px 32px 80px;width:100%}
.bsw-trailerhero-content{max-width:620px;text-align:left}

.bsw-trailerhero-kicker{margin:0 0 14px;font-family:var(--bsw-font-support);color:var(--bsw-red);font-weight:600;font-size:12px;letter-spacing:2px;text-transform:uppercase;text-align:left}
.bsw-trailerhero-title{margin:0 0 22px;font-family:var(--bsw-font-heading);font-weight:400;line-height:.94;text-transform:uppercase}
.bsw-trailerhero-title span{display:block}
.bsw-trailerhero-title-white{font-size:clamp(48px,7.5vw,88px);color:var(--bsw-text-bright)}
.bsw-trailerhero-title-red{font-size:clamp(48px,7.5vw,88px);color:var(--bsw-red)}
.bsw-trailerhero-tagline{margin:0 0 18px;font-family:var(--bsw-font);font-style:italic;font-size:17px;color:var(--bsw-text-bright)}
.bsw-trailerhero-text{margin:0 0 30px;max-width:480px;font-family:var(--bsw-font);font-size:16px;line-height:1.65;color:#f0f0f0;text-align:left}
.bsw-trailerhero-content .bsw-btn-row{justify-content:flex-start}

@media (max-width:600px){
	.bsw-trailerhero-container{padding:110px 20px 60px}
	.bsw-trailerhero-content{max-width:100%}
	.bsw-trailerhero-text{max-width:100%}
}

/* ===== "About Blood Star" / plain text sections ===== */
.bsw-trailerpage-text{max-width:760px;margin:0 auto;text-align:center}
.bsw-trailerpage-text p{color:var(--bsw-text-body);font-size:15px;line-height:1.8;margin:0 0 18px;text-align:left}
.bsw-trailerpage-text p:last-child{margin-bottom:0}

/* ===== Quote strip (reuses .bsw-reception-grid/-card/-attr) ===== */
.bsw-trailerpage-quotes .bsw-reception-grid{margin-top:44px}

/* ===== Film details table ===== */
.bsw-trailerpage-table{max-width:640px;margin:0 auto;border:1px solid var(--bsw-border-soft);border-radius:var(--bsw-radius);overflow:hidden}
.bsw-trailerpage-row{display:flex;flex-wrap:wrap;border-top:1px solid var(--bsw-border-soft)}
.bsw-trailerpage-row:first-child{border-top:0}
.bsw-trailerpage-row dt{flex:0 0 170px;padding:16px 20px;background:var(--bsw-card-bg);color:var(--bsw-red);font-family:var(--bsw-font-support);font-size:11px;font-weight:600;letter-spacing:1px;text-transform:uppercase;margin:0}
.bsw-trailerpage-row dd{flex:1 1 220px;padding:16px 20px;margin:0;color:var(--bsw-text);font-size:14.5px;line-height:1.6}

@media (max-width:560px){
	.bsw-trailerpage-row{flex-direction:column}
	.bsw-trailerpage-row dt{flex-basis:auto;padding-bottom:4px}
	.bsw-trailerpage-row dd{flex:0 1 auto;padding-top:0}
}

/* ===== FAQ accordion ===== */
.bsw-trailerpage-faq{max-width:760px;margin:0 auto;text-align:left}
.bsw-trailerpage-faq details{background:var(--bsw-card-bg);border:1px solid var(--bsw-border-soft);border-radius:var(--bsw-radius-sm);margin-bottom:12px;overflow:hidden}
.bsw-trailerpage-faq summary{cursor:pointer;list-style:none;padding:18px 50px 18px 22px;font-family:var(--bsw-font-support);font-weight:600;color:var(--bsw-text-bright);font-size:14.5px;position:relative}
.bsw-trailerpage-faq summary::-webkit-details-marker{display:none}
.bsw-trailerpage-faq summary::after{content:"+";position:absolute;right:22px;top:16px;color:var(--bsw-red);font-weight:700;font-size:20px;line-height:1}
.bsw-trailerpage-faq details[open] summary::after{content:"\2212"}
.bsw-trailerpage-faq summary:hover{color:var(--bsw-red)}
.bsw-trailerpage-faq .answer{margin:0;padding:0 22px 20px;color:var(--bsw-text-muted);font-size:14px;line-height:1.7}