:root{--gold:#ffc10e;--gold-deep:#e0a800;}
  .btn.gold{background:var(--gold);border-color:var(--gold);color:#0b0c10}
  .btn.gold:hover{background:#ffd044;border-color:#ffd044}
  .hero .media img{position:absolute;right:0;top:0;width:54%;height:100%;object-fit:cover;object-position:50% 0%;opacity:.75;mask-image:linear-gradient(90deg,transparent 0%,#000 28%);-webkit-mask-image:linear-gradient(90deg,transparent 0%,#000 28%)}
  .hero .marks .mark{width:clamp(120px,14vw,190px);height:auto}
  .hero .marks .word{width:clamp(220px,28vw,420px);height:auto;padding-bottom:10px}
  @media (max-width:900px){.hero .wrap{grid-template-columns:1fr}.hero .marks{flex-direction:column;align-items:flex-start;gap:20px}.hero .slash{right:-30vw;width:40vw;opacity:.6}.hero .slash.two{display:none}.hero .media img{width:100%;object-position:50% 0%;opacity:.35;mask-image:none;-webkit-mask-image:none}}
  .gallery .grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
  .tile{position:relative;aspect-ratio:3/4;overflow:hidden;border:1px solid var(--line);background:var(--raised)}
  @media (max-width:900px){.gallery .head{grid-template-columns:1fr}.gallery .grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
/* small phones: keep "QUARTERBACK" inside the screen (longest word ≈ 7.95em) */
@media (max-width:420px){.hero h1{font-size:min(42px,calc((100vw - 32px) / 7.95))}}