/* style.css - page layout and article card */
:root{
  --wrap-width: 1100px;
  --page-bg: #f6f7f8;
  --card-bg: #fff;
  --muted: #666;
  --accent: #6aaa64;
}

html,body{
  margin:0;
  padding:0;
  font-family: "Helvetica Neue", Arial, sans-serif;
  color: #111;
  scrollbar-width: thin;
}

 

/* Header */
.site-header{
  background: #ffffff;
  border-bottom: 1px solid #e7e7e7;
}
.site-header .wrap{
  display:flex;
  align-items:center;
  padding:18px 20px;
}
.site-title{
  margin:0;
  font-size:22px;
  color:#111;
}

 
#game-iframe{
  width: 100%;
  height: 900px;
  border: 0;
  display:block;
}

/* Article card */
.card{
   
  padding: 5rem;
  box-shadow: 0 8px 30px rgb(44 158 255 / 22%);
  margin-top: 100px;
  color:#222;
}
.card h1,
.card h2{
  margin-top: 0;
  color:#111;
}
.card p{
  color:var(--muted);
  line-height:1.8;
  margin: 14px 0;
  font-size:16px;
}
.card strong{
  color:#111;
}

/* Footer */
.site-footer{
  background:#0f1720;
  color:#cbd5e1;
  padding: 20px 0;
}
.site-footer .wrap{
  display:flex;
  align-items:center;
  justify-content:center;
}
.site-footer p{
  margin:0;
  font-size:14px;
}

/* Responsive */
@media (max-width:900px){
  #game-iframe{ height: 620px; }
  .card{ padding:18px; }
  .site-title{ font-size:18px; }
}
@media (max-width:520px){
  #game-iframe{ height: 580px; }
  .wrap{ padding:12px; }
  .card p{ font-size:15px; line-height:1.7; }
}