/* PlayReview — layout.css : grid, header, footer, page structure */
.wrap{max-width:1160px;margin:0 auto;padding:0 24px}
@media (max-width:600px){.wrap{padding:0 16px}}

.site-header{
  background:var(--bg-dark);
  color:var(--text-dark-bg);
  background-image:
    linear-gradient(0deg, rgba(217,142,58,.06) 1px, transparent 1px),
    linear-gradient(90deg, rgba(217,142,58,.06) 1px, transparent 1px);
  background-size:28px 28px;
}
.site-header .wrap{display:flex;align-items:center;justify-content:space-between;padding-top:16px;padding-bottom:16px;flex-wrap:wrap;gap:12px}
.site-header a{color:var(--text-dark-bg);text-decoration:none}
.brand{font-family:'Fraunces',serif;font-weight:600;font-size:var(--fs-22)}
.brand span{color:var(--accent)}
.badge-18{
  display:inline-flex;align-items:center;gap:.35em;
  border:1px solid var(--accent);color:var(--accent);
  font-size:var(--fs-12);font-weight:600;padding:.25em .6em;border-radius:999px;
  letter-spacing:.02em;
}
.main-nav ul{list-style:none;display:flex;gap:18px;margin:0;padding:0;flex-wrap:wrap}
.main-nav a{font-size:var(--fs-14);font-weight:600}
.main-nav a:hover{color:var(--accent)}

.hero{background:var(--bg-dark);color:var(--text-dark-bg);padding:48px 0}
.hero h1{color:var(--text-dark-bg);max-width:22ch}
.hero p{color:var(--text-dark-bg);max-width:60ch}

.breadcrumbs{font-size:var(--fs-12);padding:14px 0;color:#5b6a68}
.breadcrumbs ol{list-style:none;display:flex;flex-wrap:wrap;gap:.4em;margin:0;padding:0}
.breadcrumbs li:not(:last-child)::after{content:"›";margin-left:.4em;color:#9aa6a4}
.breadcrumbs a{color:#3d5451}

main{display:block;padding:8px 0 48px}
.content-col{max-width:68ch}

.grid-2{display:grid;grid-template-columns:1fr;gap:24px}
@media (min-width:900px){.grid-2{grid-template-columns:2fr 1fr}}
.grid-cards{display:grid;grid-template-columns:1fr;gap:20px}
@media (min-width:600px){.grid-cards{grid-template-columns:1fr 1fr}}
@media (min-width:1200px){.grid-cards{grid-template-columns:1fr 1fr 1fr}}

.site-footer{background:var(--bg-dark);color:var(--text-dark-bg);padding:40px 0 24px;margin-top:40px}
.site-footer a{color:var(--text-dark-bg)}
.site-footer h4{color:var(--text-dark-bg);font-size:var(--fs-16)}
.footer-grid{display:grid;grid-template-columns:1fr;gap:28px}
@media (min-width:900px){.footer-grid{grid-template-columns:2fr 1fr 1fr}}
.footer-grid ul{list-style:none;margin:0;padding:0}
.footer-grid li{margin-bottom:.4em;font-size:var(--fs-14)}
.footer-bottom{border-top:1px solid var(--border-dark);margin-top:28px;padding-top:16px;font-size:var(--fs-12);color:#b7c4c1}
.responsible-strip{
  background:var(--surface-dark);border:1px solid var(--border-dark);
  border-radius:8px;padding:14px 18px;margin-bottom:24px;font-size:var(--fs-14);
}
.responsible-strip a{color:var(--accent);font-weight:600}

@media (max-width:900px){
  .main-nav{width:100%}
  .main-nav ul{gap:12px}
}