/* ============================================================
   Deidox.org — Free Burma Rangers 2: The Battle Within (FBR2 campaign).
   Dark; giving sections carry a faint amber undertone. Film-edge
   production timeline. Shared chrome in site.css.
   ============================================================ */

.tbw-wrap { max-width: 52rem; margin-inline: auto; padding-inline: var(--gutter); }

/* 1 · Hero */
.tbw-hero { position: relative; min-height: 82vh; display: flex; align-items: flex-end; color: #fff; overflow: hidden;
  background: var(--ink-950) url("/assets/stills/tbw-river.jpg") center 32%/cover no-repeat; }
.tbw-hero__overlay { position: absolute; inset: 0; z-index: 1;
  background: linear-gradient(180deg, rgba(10,15,20,0.55) 0%, rgba(10,15,20,0.25) 35%, rgba(7,11,15,0.96) 100%),
    radial-gradient(70% 60% at 80% 12%, rgba(12,192,223,0.16), transparent 60%); }
.tbw-hero__in { position: relative; z-index: 2; width: 100%; max-width: var(--container-wide); margin-inline: auto; padding: 0 var(--gutter) clamp(3rem, 7vh, 6rem); }
.tbw-hero__in .eyebrow { color: var(--cyan-400); }
.tbw-hero h1 { font-family: var(--font-display); font-weight: var(--weight-medium); font-size: clamp(2.5rem, 6vw, 5rem); line-height: 1.02; letter-spacing: -0.025em; margin: var(--space-5) 0 0; text-wrap: balance; }
.tbw-hero__sub { font-family: var(--font-mono); font-size: var(--text-body-sm); letter-spacing: 0.08em; color: rgba(255,255,255,0.6); margin: var(--space-4) 0 0; }
.tbw-hero__sub i { font-style: italic; }
.tbw-hero__hook { font-size: clamp(1.1rem, 1.6vw, 1.375rem); line-height: 1.55; color: rgba(255,255,255,0.84); margin: var(--space-6) 0 0; max-width: 54ch; }
.tbw-hero__cta { margin-top: var(--space-8); }

/* 2 · The story */
.tbw-story { background: var(--ink-950); }
.tbw-player { position: relative; aspect-ratio: 16/9; border-radius: var(--radius-frame); overflow: hidden; background: radial-gradient(120% 120% at 50% 30%, #16242e 0%, #0b1117 60%, #070b0f 100%); }
.tbw-player iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.tbw-player__poster { position: absolute; inset: 0; cursor: pointer; }
.tbw-player__poster img { width: 100%; height: 100%; object-fit: cover; }
.tbw-player__poster::after { content: ""; position: absolute; inset: 0; background: rgba(7,11,15,0.3); }
.tbw-player__play { position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); z-index: 2; width: 84px; height: 84px; border-radius: var(--radius-pill); background: var(--cyan-400); color: #061015; border: 0; cursor: pointer; display: flex; align-items: center; justify-content: center; box-shadow: var(--shadow-cyan); transition: transform var(--dur-base) var(--ease-out); }
.tbw-player__poster:hover .tbw-player__play { transform: translate(-50%,-50%) scale(1.08); }
.tbw-player__play .material-symbols-sharp { font-size: 42px; margin-left: 3px; font-variation-settings: 'FILL' 1, 'wght' 500; }
.tbw-player__note { text-align: center; margin: var(--space-4) 0 0; font-family: var(--font-mono); font-size: var(--text-eyebrow); letter-spacing: 0.12em; text-transform: uppercase; color: rgba(255,255,255,0.45); }
.tbw-story__copy { max-width: 44rem; margin: clamp(2.5rem, 5vw, 4rem) auto 0; text-align: center; }
.tbw-story__copy .eyebrow { justify-content: center; color: var(--cyan-400); }
.tbw-lead { font-family: var(--font-display); font-weight: var(--weight-regular); font-size: clamp(1.6rem, 3.2vw, 2.4rem); line-height: 1.3; color: #fff; margin: var(--space-5) 0 0; }
.tbw-story__copy p:not(.tbw-lead) { color: rgba(255,255,255,0.76); font-size: var(--text-body-lg); line-height: var(--leading-relaxed); margin: var(--space-5) auto 0; max-width: 50ch; }

/* 3 · A world that has changed */
.tbw-world { background: var(--ink-950); }
.tbw-world__head { text-align: center; margin-bottom: var(--space-10); }
.tbw-world__head .eyebrow { justify-content: center; color: var(--cyan-400); }
.tbw-world__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-6); max-width: 60rem; margin-inline: auto; }
.tbw-ctx { margin: 0; }
.tbw-ctx__media { aspect-ratio: 4/3; border-radius: var(--radius-md); background-size: cover; background-position: center; position: relative; overflow: hidden; box-shadow: var(--shadow-md); }
.tbw-ctx__media::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 40%, rgba(7,11,15,0.55) 100%); box-shadow: inset 0 0 60px rgba(0,0,0,0.4); }
.tbw-ctx figcaption { color: rgba(255,255,255,0.78); font-size: var(--text-body); line-height: var(--leading-snug); margin-top: var(--space-4); }
@media (max-width: 760px) { .tbw-world__grid { grid-template-columns: 1fr; max-width: 30rem; } }

/* 4 · Production timeline — film-edge rail */
.tbw-timeline { background: var(--ink-950); }
.tbw-timeline__head { max-width: 46rem; margin: 0 auto var(--space-12); text-align: center; }
.tbw-timeline__head .eyebrow { justify-content: center; color: var(--cyan-400); }
.tbw-timeline__head h2 { font-family: var(--font-display); font-weight: var(--weight-medium); font-size: var(--text-h2); color: #fff; margin: var(--space-5) 0 0; letter-spacing: var(--tracking-tight); text-wrap: balance; }
.tbw-rail { position: relative; max-width: 42rem; margin-inline: auto; }
.tbw-rail::before { content: ""; position: absolute; left: 15px; top: 10px; bottom: 10px; width: 0; border-left: 2px dashed rgba(12,192,223,0.5); }
.tbw-phase { position: relative; padding: 0 0 clamp(2rem, 4vw, 2.75rem) 58px; }
.tbw-phase:last-child { padding-bottom: 0; }
.tbw-phase__node { position: absolute; left: 10px; top: 6px; width: 12px; height: 12px; background: var(--cyan-400); opacity: 0.55; z-index: 2; }
.tbw-phase__status { display: inline-block; font-family: var(--font-mono); font-size: var(--text-eyebrow); letter-spacing: 0.14em; text-transform: uppercase; color: rgba(255,255,255,0.5); }
.tbw-phase__status--done { color: var(--state-success, #3FB984); }
.tbw-phase__status--goal { color: var(--amber, #EBA046); }
.tbw-phase h3 { font-family: var(--font-display); font-weight: var(--weight-medium); font-size: var(--text-h4); color: #fff; margin: var(--space-2) 0 0; line-height: var(--leading-snug); }
.tbw-phase p { color: rgba(255,255,255,0.72); line-height: var(--leading-relaxed); margin: var(--space-3) 0 0; max-width: 50ch; }
/* current phase — cyan weight */
.tbw-phase--current { padding-left: 58px; }
.tbw-phase--current .tbw-phase__node { width: 18px; height: 18px; left: 7px; top: 4px; opacity: 1; box-shadow: var(--shadow-cyan); }
.tbw-phase--current .tbw-phase__status { color: var(--cyan-400); }
.tbw-phase--current h3 { font-size: clamp(1.5rem, 3vw, 2.1rem); color: #fff; }
.tbw-phase--current p { color: rgba(255,255,255,0.85); }

/* 5 · Why a feature film */
.tbw-why { background: var(--ink-950); }
.tbw-why__in { max-width: 46rem; margin-inline: auto; text-align: center; }
.tbw-why__in .eyebrow { justify-content: center; }
.tbw-why__in > p { color: rgba(255,255,255,0.76); font-size: var(--text-body-lg); line-height: var(--leading-relaxed); margin: var(--space-6) auto 0; max-width: 52ch; }
.tbw-why__couplet { font-family: var(--font-display); font-style: italic; font-size: clamp(1.4rem, 3vw, 2.1rem); line-height: 1.4; color: #fff; margin: var(--space-8) auto 0; }

/* 6 · Ways to support (amber) */
.tbw-support { position: relative; background: var(--ink-950); overflow: hidden; padding-block: clamp(3rem, 6vw, 5.5rem); border-top: 1px solid rgba(255,255,255,0.08); }
.tbw-support__glow { position: absolute; inset: 0; z-index: 0; pointer-events: none;
  background: radial-gradient(60% 45% at 50% 12%, rgba(235,160,70,0.13), transparent 62%),
    radial-gradient(60% 45% at 50% 100%, rgba(235,160,70,0.08), transparent 60%); }
.tbw-support .container { position: relative; z-index: 1; }
.tbw-support__head { text-align: center; max-width: 46rem; margin: 0 auto var(--space-10); }
.tbw-support__head .eyebrow { color: var(--cyan-400); }
.tbw-support__head h2 { font-family: var(--font-display); font-weight: var(--weight-medium); font-size: var(--text-h2); color: #fff; margin: var(--space-5) 0 0; letter-spacing: var(--tracking-tight); text-wrap: balance; }
.tbw-support__head p { color: rgba(255,255,255,0.72); line-height: var(--leading-relaxed); margin: var(--space-4) 0 0; }
.tbw-tiers { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(1.5rem, 3vw, 2.5rem); max-width: 60rem; margin-inline: auto; align-items: stretch; }
.tbw-tier { border: 1px solid rgba(255,255,255,0.12); background: rgba(255,255,255,0.022); padding: clamp(1.75rem, 3vw, 2.5rem); display: flex; flex-direction: column; }
.tbw-tier h3 { font-family: var(--font-display); font-weight: var(--weight-medium); font-size: var(--text-h3); color: #fff; margin: 0; letter-spacing: var(--tracking-tight); }
.tbw-tier > p { color: rgba(255,255,255,0.74); line-height: var(--leading-relaxed); margin: var(--space-4) 0 0; }
.tbw-tier__eyebrow { font-family: var(--font-mono); font-size: var(--text-eyebrow); letter-spacing: 0.14em; text-transform: uppercase; color: var(--amber, #EBA046); margin-bottom: var(--space-3); display: block; }
.tbw-tier--sponsor { border-color: rgba(235,160,70,0.35); background: rgba(235,160,70,0.05); }
.tbw-sponsor__figure { font-size: var(--text-body-lg); color: #fff; }
.tbw-sponsor__figure b { color: var(--amber, #EBA046); font-weight: var(--weight-semibold); }
.tbw-tier--sponsor .btn { margin-top: auto; align-self: flex-start; }
.tbw-tier .btn { margin-top: var(--space-5); }

/* Fundraise Up embed slot */
.tbw-slot { margin: var(--space-5) 0 0; border: 1.5px dashed rgba(12,192,223,0.4); border-radius: var(--radius-md); min-height: 240px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: var(--space-3); text-align: center; padding: var(--space-8) var(--space-5); background: rgba(255,255,255,0.015); }
.tbw-slot .material-symbols-sharp { font-family: 'Material Symbols Sharp'; font-size: 40px; color: var(--cyan-400); font-variation-settings: 'FILL' 1, 'wght' 300; }
.tbw-slot b { font-family: var(--font-sans); font-size: var(--text-body); color: #fff; }
.tbw-slot > span { font-family: var(--font-mono); font-size: var(--text-eyebrow); letter-spacing: 0.1em; text-transform: uppercase; color: rgba(255,255,255,0.5); }
.tbw-slot small { font-size: var(--text-body-sm); color: rgba(255,255,255,0.55); max-width: 34ch; line-height: var(--leading-relaxed); }
.tbw-slot small b { color: #fff; font-weight: var(--weight-semibold); }

.tbw-trustline { display: flex; align-items: center; justify-content: center; gap: 8px; margin: var(--space-8) 0 0; font-size: var(--text-body-sm); color: rgba(255,255,255,0.6); }
.tbw-trustline .material-symbols-sharp { font-size: 18px; color: var(--cyan-400); }
@media (max-width: 760px) { .tbw-tiers { grid-template-columns: 1fr; } }

/* 7 · Quiet close */
.tbw-close { background: var(--ink-950); text-align: center; padding-block: clamp(3rem, 6vw, 5rem); border-top: 1px solid rgba(255,255,255,0.08); }
.tbw-close__line { font-family: var(--font-display); font-style: italic; font-size: clamp(1.4rem, 3vw, 2.1rem); color: #fff; margin: 0 auto; max-width: 40ch; }
.tbw-morelink { display: inline-flex; align-items: center; gap: 8px; margin-top: var(--space-6); font-family: var(--font-mono); font-size: var(--text-body-sm); letter-spacing: 0.08em; text-transform: uppercase; color: var(--cyan-400); text-decoration: none; border-bottom: 1px solid rgba(12,192,223,0.4); padding-bottom: 4px; transition: color 0.2s var(--ease-out), border-color 0.2s var(--ease-out); }
.tbw-morelink .material-symbols-sharp { font-size: 18px; }
.tbw-morelink:hover { color: #fff; border-color: #fff; }

/* --- production pass: hero rhythm + fixed-header clearance --- */
.tbw-hero__in{padding-top:clamp(7rem,12vh,9rem)}
.tbw-hero h1{margin-top:var(--space-4)}
.tbw-hero__sub{margin-top:var(--space-3)}
.tbw-hero__hook{margin-top:var(--space-6)}
.tbw-hero__cta{margin-top:var(--space-8)}
.tbw-slot .btn{margin:var(--space-4) 0}

.trust-row{margin-top:var(--space-4);display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:var(--space-3) var(--space-5)}
.trust-row__item{display:inline-flex;align-items:center;gap:6px;font-family:var(--font-mono);font-size:.68rem;letter-spacing:.06em;text-transform:uppercase;color:rgba(255,255,255,.5)}
.trust-row__item .material-symbols-sharp{font-size:15px;color:var(--cyan-400,#0CC0DF);font-variation-settings:'FILL' 1,'wght' 400}

/* ============ embedded Fundraise Up Donation Form container (FBR2) ============ */
.tbw-slot--embedded{
  border: 1px solid rgba(12,192,223,.22);
  background: #0E141B;
  padding: var(--space-6);
  min-height: 0;
  display: block;
  text-align: left;
  max-width: 30rem;
  margin-inline: auto;
}
.give-slot__note{
  margin-top: var(--space-5);
  font-size: var(--text-body-sm);
  color: rgba(255,255,255,.6);
  line-height: var(--leading-relaxed);
  text-align: center;
}
.tbw-slot--embedded .trust-row{ text-align: center; }