:root { color: #1d2721; background: #f5f8ec; font-family: Arial, Helvetica, sans-serif; line-height: 1.5; }
* { box-sizing: border-box; }
body { margin: 0; }
a { color: #075d45; }
.site-header, .site-footer, main { max-width: 1180px; margin: 0 auto; }
.site-header { align-items: center; display: flex; gap: 24px; justify-content: space-between; padding: 20px 28px; }
.brand { color: #173d2c; font-size: 22px; font-weight: 800; text-decoration: none; }
.site-header nav, .site-footer nav { display: flex; flex-wrap: wrap; gap: 18px; }
.site-header nav a, .site-footer a { font-weight: 700; text-decoration: none; }
.hero { align-items: center; display: grid; gap: 48px; grid-template-columns: minmax(0, 1fr) minmax(360px, 1.05fr); padding: 76px 28px 52px; }
.eyebrow { color: #b4461b; font-size: 14px; font-weight: 800; letter-spacing: 0; margin: 0 0 12px; text-transform: uppercase; }
h1, h2 { color: #173d2c; letter-spacing: 0; line-height: 1.1; }
h1 { font-size: 48px; margin: 0; }
h2 { font-size: 28px; margin: 0 0 16px; }
.lead { font-size: 22px; max-width: 630px; margin: 24px 0 6px; }
.translation { color: #4b5b50; font-size: 18px; margin: 0 0 30px; }
.play-link { background: #ef6a32; border: 2px solid #bc4a1e; color: #fff; display: inline-block; font-weight: 800; padding: 13px 20px; text-decoration: none; }
.play-link:hover, .play-link:focus { background: #c64c20; }
.tile-preview { margin: 0; overflow: hidden; }
.tile-preview img { display: block; height: auto; width: 100%; }
.tile-preview figcaption { color: #405046; font-size: 14px; margin-top: 10px; }
.facts { border-bottom: 1px solid #cfd8c6; border-top: 1px solid #cfd8c6; display: grid; grid-template-columns: repeat(3, 1fr); }
.facts article { min-height: 190px; padding: 28px; }
.facts article + article { border-left: 1px solid #cfd8c6; }
.facts h2 { font-size: 20px; }
.facts p { margin: 0; }
.content-section { padding: 72px 28px; }
.two-column { display: grid; gap: 56px; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); }
ol { margin: 0; padding-left: 24px; }
li + li { margin-top: 10px; }
.scoring { background: #dcebbd; }
.scoring p:last-child { font-size: 19px; max-width: 820px; }
.about { border-bottom: 1px solid #cfd8c6; }
.site-footer { align-items: center; display: flex; gap: 24px; justify-content: space-between; padding: 32px 28px; }
.site-footer p { color: #526158; margin: 0; }
@media (max-width: 760px) {
  .site-header, .site-footer { align-items: flex-start; flex-direction: column; }
  .hero, .two-column { grid-template-columns: 1fr; }
  .hero { gap: 30px; padding-top: 42px; }
  h1 { font-size: 38px; }
  .facts { grid-template-columns: 1fr; }
  .facts article + article { border-left: 0; border-top: 1px solid #cfd8c6; }
  .content-section { padding-bottom: 52px; padding-top: 52px; }
}
