/* Samurai Movie Jam page (src/smj.mjs) */
*,*::before,*::after{box-sizing:border-box}
body.smj{margin:0;background:#000;color:#fff;font-family:Poppins,"Helvetica Neue",Arial,sans-serif;font-weight:200;-webkit-font-smoothing:antialiased}
.smj img{max-width:100%;height:auto}
.smj a img{display:block}
.smj .wrap{max-width:980px;margin:0 auto;padding:0 16px}
.smj-hero{position:relative;width:100%;aspect-ratio:1575/651;min-height:300px;overflow:hidden;display:grid;place-items:center;background:#111}
.smj-hero .bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.smj-hero h1{position:relative;margin:0;width:min(57%,924px)}
.smj-hero .logo{display:block;width:100%;filter:drop-shadow(0 4px 18px rgba(0,0,0,.45))}
.smj-intro{background:#000;padding:70px 0 46px}
.smj-intro p{font-size:24px;line-height:1.4;margin:0 0 34px}
.follow{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:16px 22px;width:min(1100px,calc(100vw - 32px));position:relative;left:50%;transform:translateX(-50%)}
.follow .grp{display:flex;flex-wrap:nowrap;align-items:center;gap:14px;flex:none}
.follow .b{white-space:nowrap;font-weight:900;font-size:28px;text-transform:uppercase;letter-spacing:-.01em}
.follow .l{white-space:nowrap;font-weight:300;font-size:29px;text-transform:uppercase}
.follow a{flex:none;display:block}
.follow .pill{position:relative;top:-1px}
.follow .icons{display:flex;gap:14px;flex:none}
.follow .icons img{width:39px;height:39px;min-width:39px;flex:none;object-fit:contain;transition:transform .15s}
.smj .pill{display:block;height:var(--pill,44px);width:auto;max-width:none;filter:drop-shadow(0 7px 6px rgba(0,0,0,.38));transition:transform .15s}
.smj a:hover .pill{transform:translateY(-1px) scale(1.03)}
.follow a:hover img{transform:scale(1.06)}
.smj-latest{background:#d3d3d3;color:#000;padding:52px 0 72px}
.smj-player{display:block;width:100%;aspect-ratio:16/9;height:auto;border:0;border-radius:12px;background:#282828}
.smj-player.show{aspect-ratio:auto;height:352px}
.smj-latest .eyebrow{font-family:Caveat,cursive;font-weight:700;font-size:30px;letter-spacing:-1.5px;color:#fd8e32;margin:0;line-height:1.1}
.smj-latest .numrow{display:flex;align-items:center;gap:10px}
.smj-latest .num{font-weight:900;font-size:32px;color:#9b9b9b;margin:0;line-height:1;text-transform:uppercase}
.smj-latest .listen{display:flex;gap:8px}
.smj-latest .listen a{display:block}
.smj-latest .listen img{display:block;width:32px;height:32px;object-fit:contain;transition:transform .15s}
.smj-latest .listen a:hover img{transform:scale(1.1)}
.smj-latest h2{font-weight:900;font-size:66px;line-height:.9;margin:2px 0 8px;text-transform:uppercase;overflow-wrap:anywhere}
.smj-latest .desc{font-size:18px;line-height:1.4;margin:0 0 22px;max-width:820px}
.smj-merch{background:#9b9b9b;padding:0;position:relative;z-index:1}
.smj-merch .wrap{display:grid;grid-template-columns:440fr 540fr;gap:0 8px;align-items:center;min-height:410px}
.smj-merch .shirt{width:100%;max-width:511px;margin:-90px 0 -30px;filter:drop-shadow(0 8px 14px rgba(0,0,0,.35));transform:rotate(-6.4deg) scale(1.05);transform-origin:50% 50%;will-change:transform}
.smj-hero .logo{transform-origin:50% 50%;will-change:transform}
.smj-merch h2{font-weight:900;font-size:60px;line-height:.8;margin:0;text-transform:uppercase;color:#fff}
.smj-merch p{font-size:24px;margin:8px 0 6px;color:#fff;line-height:1}
.smj-merch div a{display:inline-block;margin-top:14px}
.smj-email{background:#000;text-align:center;padding:12px 16px}
.smj-email p{margin:0;font-weight:300;font-size:32px;line-height:1.4}
.smj-email a{color:#f49305;overflow-wrap:anywhere}
.smj-foot{background:#000;text-align:center;padding:44px 16px 56px;border-top:1px solid #1d1d1d}
.smj-foot img{width:200px}
@media (max-width:900px){
  .smj-intro{padding:44px 0 36px}.smj-intro p{font-size:19px}
  .follow .b,.follow .l{font-size:22px}
  .smj-latest{padding:40px 0 48px}.smj-latest .desc{font-size:16px}
  .smj-latest h2{font-size:clamp(40px,11vw,66px)}
  .smj-merch .wrap{grid-template-columns:1fr;text-align:center;justify-items:center;padding-bottom:36px}
  .smj-merch{overflow-x:clip}
  .smj-merch .shirt{margin:-20px auto 0;max-width:380px}
  .smj-merch h2{font-size:clamp(36px,10vw,60px);margin:0 auto}.smj-merch h2 br{display:none}
  .smj-email p{font-size:clamp(18px,5vw,32px)}
}
@media (max-width:560px){
  .smj-hero{aspect-ratio:auto;min-height:0;height:62vw}
  .smj-hero h1{width:92%}
  .follow .grp:first-child{flex-direction:column;gap:12px}
  .smj .pill{height:auto;width:auto;max-height:var(--pill,44px);max-width:100%}
}
