/*

Theme Name: Flat Gray
Theme URI:  https://example.local/flat-gray
Author:      ChatGPT
Author URI:  https://openai.com
Description: Minimal WordPress theme — flat design, rounded corners, grayscale palette.
Version:     1.0
License:     GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: flat-gray
*/

:root{
  --g-95: #fafafa;
  --g-90: #f5f5f5;
  --g-80: #eeeeee;
  --g-70: #e0e0e0;
  --g-60: #cfcfcf;
  --g-50: #bdbdbd;
  --g-40: #9e9e9e;
  --g-30: #757575;
  --g-20: #616161;
  --g-10: #424242;
  --g-0:  #212121;
  --radius: 12px;
  --container-max: 1100px;
}

*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial;
  background:var(--g-95);
  color:var(--g-10);
  line-height:1.5;
}

a{color:var(--g-10);text-decoration:none}
a:hover{text-decoration:underline}

.site{
  max-width:var(--container-max);
  margin:36px auto;
  padding:24px;
}

.header-card{
  background:linear-gradient(180deg,var(--g-95),var(--g-90));
  border-radius:var(--radius);
  padding:20px 24px;
  box-shadow:0 1px 0 rgba(0,0,0,0.02), 0 6px 18px rgba(0,0,0,0.03);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
}

.site-title{
  margin:0;font-size:1.4rem;font-weight:600;color:var(--g-0);
}
.site-description{color:var(--g-40);font-size:0.95rem}

.nav{
  display:flex;gap:12px;align-items:center;
}
.nav a{
  padding:8px 12px;border-radius:10px;background:var(--g-90);color:var(--g-20);font-weight:500;
}
.nav a:hover{background:var(--g-80)}

.main{
  display:grid;grid-template-columns:1fr 320px;gap:24px;margin-top:24px;
}

.card{
  background:var(--g-95);
  border-radius:var(--radius);
  padding:18px;
  border:1px solid var(--g-80);
  box-shadow:0 4px 10px rgba(0,0,0,0.04);
}

.post-card{
  background:linear-gradient(180deg,var(--g-95),var(--g-90));
}

.post-title{font-size:1.15rem;margin:0 0 8px 0;color:var(--g-0)}
.post-meta{color:var(--g-40);font-size:0.9rem;margin-bottom:12px}
.post-excerpt{color:var(--g-30)}

.sidebar .widget{margin-bottom:18px}

.button{
  display:inline-block;padding:10px 14px;border-radius:10px;background:var(--g-80);color:var(--g-0);font-weight:600;border:1px solid var(--g-70);
}
.button.alt{background:transparent;border:1px solid var(--g-70);color:var(--g-20)}

input[type="search"],input[type="text"],textarea,select{
  width:100%;padding:10px;border-radius:10px;border:1px solid var(--g-80);background:var(--g-95);color:var(--g-10);
}

.posts{display:flex;flex-direction:column;gap:16px}

.site-footer{margin-top:28px;text-align:center;color:var(--g-40);font-size:0.9rem}

@media (max-width:900px){
  .main{grid-template-columns:1fr}
  .site{padding:16px;margin:20px}
}