/* Game landing page for Treasure Island (site/index.html). Full-bleed film, one PLAY, then the goods. */
@font-face{font-family:"Pirata One";src:url(/fonts/PirataOne-400-latin.woff2) format("woff2");font-display:swap}
body.land{background:#0e0b14;overflow-x:hidden}
.land .ld-top{position:absolute;inset:0 0 auto 0;z-index:3;display:flex;justify-content:space-between;align-items:center;
  padding:max(14px,env(safe-area-inset-top)) 22px 0;font:600 12px var(--display);letter-spacing:.22em;text-transform:uppercase}
.ld-brand{color:var(--gold);text-decoration:none}.ld-brand span{color:var(--ink);opacity:.8}
.ld-top nav{display:flex;gap:18px;align-items:center}.ld-top nav a{color:var(--dim);text-decoration:none}.ld-top nav a:hover{color:var(--gold)}
.ld-top #who{color:var(--dim)}.ld-top #who a{color:var(--dim)}

.ld-hero{position:relative;min-height:100svh;display:grid;place-items:center;text-align:center;overflow:hidden;isolation:isolate}
.ld-film{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;filter:saturate(.9)}
.ld-shade{position:absolute;inset:0;z-index:-1;background:
  linear-gradient(180deg,rgba(14,11,20,.55) 0%,rgba(14,11,20,.15) 35%,rgba(14,11,20,.25) 60%,#0e0b14 100%),
  radial-gradient(ellipse at 50% 60%,rgba(0,0,0,0) 0%,rgba(14,11,20,.55) 100%)}
.ld-hero-in{padding:90px 20px 70px;max-width:760px}
.ld-kicker{margin:0 0 6px;color:var(--gold);font:600 12px var(--display);letter-spacing:.34em;text-transform:uppercase;text-shadow:0 1px 8px #000}
.ld-title{margin:0;font:400 clamp(58px,13vw,136px)/.95 "Pirata One",serif;letter-spacing:.02em;color:#f0e4cc;
  text-shadow:0 2px 0 #3a2a10,0 6px 24px rgba(0,0,0,.7),0 0 60px rgba(216,176,106,.25)}
.ld-tag{margin:18px auto 30px;max-width:520px;color:#e6dcc8;font-size:clamp(15px,2.2vw,18px);text-shadow:0 1px 6px #000}
.ld-play{display:inline-flex;align-items:center;gap:12px;padding:18px 34px;border-radius:999px;text-decoration:none;
  font:700 clamp(15px,2vw,19px) var(--display);letter-spacing:.22em;text-transform:uppercase;color:var(--on-gold);
  background:linear-gradient(180deg,#eac57c,#c89548);border:1px solid #f3dca4;box-shadow:0 10px 30px rgba(0,0,0,.55),0 0 0 6px rgba(216,176,106,.12);
  transition:transform .15s,box-shadow .15s}
.ld-play:hover{transform:translateY(-2px);box-shadow:0 14px 36px rgba(0,0,0,.6),0 0 0 8px rgba(216,176,106,.18)}
.ld-play em{font-style:normal;background:#2a1c08;color:#eac57c;padding:3px 10px;border-radius:999px;font-size:.7em;letter-spacing:.2em}
.ld-play-ic{font-size:.85em}
.ld-fine{margin:16px 0 0;color:#bfae92;font-size:13px;text-shadow:0 1px 6px #000}
.ld-scroll{position:absolute;bottom:18px;left:50%;transform:translateX(-50%);color:var(--gold);font-size:28px;text-decoration:none;opacity:.7;animation:ld-bob 1.8s ease-in-out infinite}
@keyframes ld-bob{50%{transform:translate(-50%,6px)}}

.ld-sec{max-width:1040px;margin:0 auto;padding:54px 20px}
.ld-sec h2{font:400 clamp(30px,5vw,44px)/1 "Pirata One",serif;letter-spacing:.03em;margin:0 0 22px;color:#f0e4cc}
.ld-three{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.ld-three div{background:var(--card);border:1px solid var(--edge);border-radius:14px;padding:22px 20px}
.ld-three b{display:block;font:700 13px var(--display);letter-spacing:.26em;text-transform:uppercase;color:var(--gold);margin-bottom:8px}
.ld-three span{color:var(--ink);font-size:15px}

.ld-scenes{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;padding-top:0}
.ld-scenes figure{margin:0;position:relative;border-radius:12px;overflow:hidden;border:1px solid var(--edge);aspect-ratio:16/10;background:var(--card)}
.ld-scenes img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .6s ease}
.ld-scenes figure:hover img{transform:scale(1.05)}
.ld-scenes figcaption{position:absolute;left:0;right:0;bottom:0;padding:26px 14px 10px;font:600 11px var(--display);letter-spacing:.24em;text-transform:uppercase;color:#f0e4cc;
  background:linear-gradient(0deg,rgba(14,11,20,.9),rgba(14,11,20,0))}

.ld-faces{display:grid;grid-template-columns:repeat(5,1fr);gap:14px}
.ld-faces figure{margin:0;text-align:center}
.ld-faces img{width:100%;aspect-ratio:1;object-fit:cover;border-radius:50%;border:2px solid var(--gold-deep);box-shadow:0 6px 20px rgba(0,0,0,.5);display:block}
.ld-faces figcaption{margin-top:10px;font:600 11px var(--display);letter-spacing:.2em;text-transform:uppercase;color:var(--dim)}

.ld-wyeth{display:grid;grid-template-columns:1fr 1fr;gap:30px;align-items:center}
.ld-wyeth img{width:100%;border-radius:10px;border:6px solid #2a2232;box-shadow:0 12px 40px rgba(0,0,0,.6);transform:rotate(-1.5deg)}
.ld-wyeth p{color:var(--ink);font-size:16px}

.ld-play-sm{padding:14px 26px;font-size:14px;margin-top:22px}
.ld-foot{text-align:center;color:var(--dim);font-size:13px;padding:30px 20px 60px}
.ld-foot a{color:var(--dim)}

@media (max-width:760px){
  .ld-top{padding-inline:16px}.ld-top nav a:not(:last-of-type){display:none}
  .ld-hero-in{padding:120px 18px 80px}
  .ld-three{grid-template-columns:1fr}
  .ld-scenes{grid-template-columns:1fr 1fr}
  .ld-faces{grid-template-columns:repeat(3,1fr)}.ld-faces figure:nth-child(n+4){display:none}
  .ld-wyeth{grid-template-columns:1fr}.ld-wyeth img{max-width:320px;margin:0 auto;display:block}
  .ld-sec{padding:40px 16px}
}
@media (prefers-reduced-motion:reduce){.ld-scroll{animation:none}.ld-scenes img{transition:none}}