/* SOJ Video — immersive integrated video page */
body[data-page="video"]{background:#020b08;color:#f7f1e6}
body[data-page="video"] .site-header{background:#043322}
.video-page{background:linear-gradient(180deg,#06150f 0,#020b08 100%)}
.video-hero{
  display:grid;grid-template-columns:minmax(0,1.2fr) minmax(280px,.8fr);gap:48px;align-items:center;
  padding:42px var(--space) 34px;
  background:
    radial-gradient(circle at 82% 18%,rgba(229,198,93,.12),transparent 25%),
    linear-gradient(100deg,#4c0713 0%,#6c1021 52%,#3e0710 100%);
  border-bottom:1px solid rgba(229,198,93,.22)
}
.video-kicker{margin:0 0 11px;color:#f0d477;font:900 11px/1 var(--text);letter-spacing:.18em}
.video-hero h1{margin:0;color:#fff8e9;font:400 clamp(58px,6vw,88px)/.92 var(--editorial);letter-spacing:-.055em}
.video-hero h1 em{color:#f0d477;font-style:normal}
.video-hero-copy>p:last-child{max-width:700px;margin:18px 0 0;color:#f1e5e2;font-size:16px;line-height:1.65}
.video-hero-mark{justify-self:end;display:flex;align-items:center;gap:18px}
.video-hero-mark img{width:118px;height:118px;object-fit:contain;filter:drop-shadow(0 15px 30px rgba(0,0,0,.32))}
.video-hero-mark span{color:#f2dd98;font:900 11px/1.55 var(--text);letter-spacing:.16em}

.video-stage{position:relative;background:#000;border-bottom:1px solid rgba(229,198,93,.2)}
.video-stage-label{
  display:flex;align-items:end;justify-content:space-between;gap:30px;
  padding:16px var(--space);background:#08291e;border-bottom:1px solid rgba(229,198,93,.16)
}
.video-stage-label span{color:#d9be62;font:900 10px/1 var(--text);letter-spacing:.18em}
.video-stage-label strong{color:#fff8e9;font:400 26px/1 var(--editorial);letter-spacing:-.02em;text-align:right}
.video-embed{position:relative;width:100%;aspect-ratio:16/9;background:#000}
.video-embed iframe{position:absolute;inset:0;width:100%;height:100%;border:0;display:block}
.video-stage-foot{
  display:flex;justify-content:space-between;gap:25px;padding:14px var(--space);
  background:#041c14;color:#aebdb4;font-size:12px;font-weight:700;letter-spacing:.08em
}
.video-stage-foot span:first-child{color:#e2c767}
.video-after{
  display:grid;grid-template-columns:minmax(0,1fr) auto;gap:45px;align-items:end;
  padding:38px var(--space) 42px;background:#071d16
}
.video-after p{margin:0 0 8px;color:#d9be62;font:900 10px/1 var(--text);letter-spacing:.18em}
.video-after h2{margin:0;color:#fff8e9;font:400 clamp(42px,4.6vw,62px)/.95 var(--editorial);letter-spacing:-.045em}
.video-after h2 em{color:#d9be62;font-style:normal}
.video-after-actions{display:flex;gap:9px;flex-wrap:wrap;justify-content:flex-end}
.video-after-actions a,.video-after-actions button{
  min-height:46px;padding:0 17px;display:inline-flex;align-items:center;justify-content:center;
  border:1px solid rgba(229,198,93,.28);background:transparent;color:#f5f0e3;border-radius:5px;
  font:800 12px/1 var(--text);cursor:pointer
}
.video-after-actions a:first-child{gap:24px;background:#bd1935;border-color:#bd1935;color:white}
.video-after-actions a:hover,.video-after-actions button:hover{border-color:#e2c767;transform:translateY(-1px)}

@media(max-width:900px){
  .video-hero{grid-template-columns:1fr;padding-top:34px}
  .video-hero-mark{justify-self:start}
  .video-stage-label{align-items:flex-start}
  .video-stage-label strong{font-size:22px}
  .video-after{grid-template-columns:1fr}
  .video-after-actions{justify-content:flex-start}
}
@media(max-width:620px){
  .video-hero{padding:28px 18px 24px;gap:22px}
  .video-hero h1{font-size:50px}
  .video-hero-copy>p:last-child{font-size:15px;line-height:1.55}
  .video-hero-mark img{width:82px;height:82px}
  .video-hero-mark span{font-size:9px}
  .video-stage-label{display:block;padding:13px 18px}
  .video-stage-label strong{display:block;margin-top:7px;text-align:left;font-size:20px;line-height:1.1}
  .video-stage-foot{display:block;padding:12px 18px;font-size:10px;line-height:1.5}
  .video-stage-foot span{display:block}
  .video-stage-foot span+span{margin-top:4px}
  .video-after{padding:30px 18px 34px}
  .video-after-actions{display:grid;grid-template-columns:1fr}
  .video-after-actions a,.video-after-actions button{width:100%;font-size:13px}
}