@import url('https://fonts.googleapis.com/css2?family=Archivo+Black&family=Space+Mono:wght@400;700&display=swap');

:root{--yellow:#e8ff00;--ink:#111}
*{box-sizing:border-box}
body{margin:0;background:#e9e9e9;color:var(--ink);font-family:'Space Mono',monospace}
button{font:inherit;cursor:default}
.deck{max-width:1440px;margin:0 auto}
.intro{background:#151515;color:#fff;padding:18px 48px;display:flex;justify-content:space-between;align-items:center}
.intro strong{font-size:17px;font-family:Arial,sans-serif}.intro span{font-size:13px;color:#b7b7b7;font-family:Arial,sans-serif}
.frame{height:900px;position:relative;overflow:hidden;background:#fff;margin-bottom:40px;box-shadow:0 14px 50px #0002;border:3px solid var(--ink)}
.tag{position:absolute;z-index:6;top:20px;right:22px;background:var(--ink);color:#fff;padding:9px 14px;font-weight:700;font-size:12px;letter-spacing:.08em}
.brand{display:flex;align-items:center;gap:10px;font-family:'Archivo Black',Impact,sans-serif;font-size:17px}
.brand img{width:36px;height:36px;object-fit:contain;filter:grayscale(1) contrast(1.4)}

header{padding:22px 50px;display:flex;justify-content:space-between;align-items:center;border-bottom:3px solid var(--ink)}
.nav{display:flex;align-items:center;gap:24px;font-size:13px;font-weight:700;letter-spacing:.04em}
.cta{border:3px solid var(--ink);background:var(--yellow);color:var(--ink);padding:11px 18px;font-weight:700;font-size:13px}

.hero{display:grid;grid-template-columns:1.3fr .9fr;height:580px}
.bigtxt{padding:55px 40px 0 50px;border-right:3px solid var(--ink)}
h1{font-family:'Archivo Black',Impact,sans-serif;font-size:84px;line-height:.94;margin:0 0 24px;text-transform:uppercase}
h1 mark{background:var(--yellow);color:var(--ink);padding:0 8px;display:inline-block}
.bigtxt p{font-family:Arial,sans-serif;font-size:16px;line-height:1.5;max-width:480px;margin:0 0 28px}
.row{display:flex;align-items:center;gap:16px;border-top:2px solid var(--ink);padding:12px 0;font-weight:700;font-size:14px;letter-spacing:.04em}
.row:last-child{border-bottom:2px solid var(--ink)}
.num{background:var(--ink);color:#fff;padding:4px 9px;font-size:12px}

.photobox{position:relative;padding:40px 40px 0 0}
.photo{height:460px;background:url('assets/3069d95439fd.jpg') center/cover;filter:grayscale(1) contrast(1.25);border:3px solid var(--ink)}
.caption{position:absolute;bottom:18px;left:0;background:var(--ink);color:#fff;font-size:11px;font-weight:700;letter-spacing:.08em;padding:8px 12px}

.ticker{display:flex;border-top:3px solid var(--ink);background:var(--ink)}
.ticker span{flex:1;color:#fff;font-weight:700;font-size:13px;letter-spacing:.06em;padding:20px;border-right:1px solid #ffffff33;text-align:center}
.ticker span:nth-child(odd){background:var(--yellow);color:var(--ink)}
.ticker span:last-child{border-right:0}

.note{max-width:1440px;margin:-15px auto 55px;background:#fff;padding:18px 25px;font-size:14px;line-height:1.5;color:#333;font-family:Arial,sans-serif}

@media(max-width:700px){
  .frame{height:1050px}
  .nav span{display:none}
  header{padding:16px}
  .hero{grid-template-columns:1fr;height:auto}
  .bigtxt{padding:30px 22px 0;border-right:0;border-bottom:3px solid var(--ink)}
  h1{font-size:48px}
  .photobox{padding:24px 22px}
  .photo{height:260px}
  .ticker{flex-wrap:wrap}
  .ticker span{flex:1 1 50%;padding:14px}
}
