/* lamplight.html - the Lamplight games' landing page (2026-10-26). Warm, dark, lamplit: the games'
   own look (gold signage on near-black, baize green), inside the shared Metre2 header and footer. */
.ll-hero, .ll-rooms, .ll-regs, .ll-faq { --ll-bg: #14100b; --ll-panel: #1d1710; --ll-line: #3a2d1c; --ll-gold: #e6b85c; --ll-gold-2: #f3d58e; --ll-text: #efe4cf; --ll-dim: #b9a888; --ll-felt: #1f5b3c; background: var(--ll-bg); color: var(--ll-text); }

.ll-hero { padding: 88px 0 64px; text-align: center; background: radial-gradient(ellipse 60% 70% at 50% 0%, rgba(230,184,92,.22), transparent 70%), var(--ll-bg); border-bottom: 1px solid var(--ll-line); }
.ll-pre, .ll-kicker { font-family: var(--mono); font-size: 12px; letter-spacing: .22em; text-transform: uppercase; color: var(--ll-gold); margin: 0 0 10px; }
.ll-hero h1 { font-size: clamp(48px, 9vw, 96px); line-height: 1; letter-spacing: .04em; margin: 0 0 18px; color: var(--ll-gold-2); text-shadow: 0 0 28px rgba(230,184,92,.35); }
.ll-lede { max-width: 640px; margin: 0 auto; font-size: 18px; line-height: 1.55; color: var(--ll-dim); }
.ll-jump { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin-top: 28px; }
.ll-jump a { font-family: var(--mono); font-size: 12px; letter-spacing: .12em; text-transform: uppercase; color: var(--ll-gold); border: 1px solid var(--ll-line); border-radius: 999px; padding: 8px 14px; text-decoration: none; }
.ll-jump a:hover { border-color: var(--ll-gold); }

.ll-rooms { padding: 64px 0; }
.ll-room { display: grid; grid-template-columns: 1.15fr 1fr; gap: 40px; align-items: center; padding: 36px 0; border-bottom: 1px solid var(--ll-line); scroll-margin-top: 90px; }
.ll-room:last-child { border-bottom: 0; }
.ll-room:nth-child(even) .ll-shot { order: 2; }
.ll-shot { display: block; border-radius: 14px; overflow: hidden; border: 1px solid var(--ll-line); box-shadow: 0 30px 60px -30px rgba(0,0,0,.8); }
.ll-shot img { display: block; width: 100%; height: auto; }
.ll-copy h2 { font-size: 32px; margin: 0 0 12px; color: var(--ll-text); }
.ll-copy h2 a { color: var(--ll-text); text-decoration: none; }
.ll-copy h2 a:hover { color: var(--ll-gold-2); }
.ll-copy p { color: var(--ll-dim); font-size: 16px; line-height: 1.6; margin: 0 0 20px; }
.ll-actions { display: flex; flex-wrap: wrap; gap: 10px; }
.ll-rooms .btn-primary { background: var(--ll-gold); border-color: var(--ll-gold); color: #1a1208; }
.ll-rooms .btn-primary:hover { background: var(--ll-gold-2); }
.ll-rooms .btn-secondary { background: transparent; color: var(--ll-text); border: 1px solid var(--ll-line); }
.ll-rooms .btn-secondary:hover { border-color: var(--ll-gold); color: var(--ll-gold-2); }

.ll-regs { padding: 64px 0; background: radial-gradient(ellipse 70% 80% at 50% 100%, rgba(31,91,60,.35), transparent 70%), var(--ll-panel); border-top: 1px solid var(--ll-line); border-bottom: 1px solid var(--ll-line); text-align: center; }
.ll-regs h2 { font-size: 32px; margin: 0 0 10px; color: var(--ll-gold-2); }
.ll-reg-list { list-style: none; padding: 0; margin: 32px 0 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; text-align: left; }
.ll-reg-list li { background: rgba(0,0,0,.25); border: 1px solid var(--ll-line); border-radius: 12px; padding: 16px 18px; }
.ll-reg-list strong { display: block; font-family: var(--mono); letter-spacing: .14em; text-transform: uppercase; color: var(--ll-gold); font-size: 13px; margin-bottom: 6px; }
.ll-reg-list span { color: var(--ll-dim); font-size: 14px; line-height: 1.5; }

.ll-faq { padding: 64px 0 80px; }
.ll-faq h2 { font-size: 28px; margin: 0 0 20px; color: var(--ll-gold-2); }
.ll-faq .faq-item { border-top: 1px solid var(--ll-line); padding: 18px 0; }
.ll-faq .faq-item h3 { font-size: 17px; margin: 0 0 6px; color: var(--ll-text); }
.ll-faq .faq-item p { margin: 0; color: var(--ll-dim); line-height: 1.6; }

.lamplight-all { margin: 18px 0 0; font-weight: 600; }

@media (max-width: 860px) {
  .ll-room { grid-template-columns: 1fr; gap: 20px; }
  .ll-room:nth-child(even) .ll-shot { order: 0; }
  .ll-reg-list { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 520px) {
  .ll-hero { padding: 64px 0 48px; }
  .ll-reg-list { grid-template-columns: 1fr; }
  .ll-copy h2, .ll-regs h2 { font-size: 26px; }
}