/*
Theme Name: GP Lite Pro
Theme URI: https://example.com/
Author: Your Name
Author URI: https://example.com/
Description: Lightweight, GeneratePress-like, professional & AdSense-friendly WordPress theme.
Version: 1.0.0
License: GPL v2 or later
Text Domain: gp-lite-pro
*/

/* =========================
   ROOT VARIABLES
========================= */
:root{
  --gp-container: 1200px;
  --gp-gap: 18px;
  --gp-radius: 14px;
  --gp-border: 1px solid rgba(0,0,0,.08);

  --gp-bg: #ffffff;
  --gp-surface: #ffffff;
  --gp-text: #111827;
  --gp-muted: #6b7280;
  --gp-link: #2563eb;
  --gp-link-hover: #1d4ed8;

  --gp-shadow: 0 10px 25px rgba(0,0,0,.06);
}

/* =========================
   RESET / BASE
========================= */
*,
*::before,
*::after{
  box-sizing: border-box;
}

html{
  -webkit-text-size-adjust:100%;
}

body{
  margin:0;
  font-family: system-ui, -apple-system, BlinkMacSystemFont,
               "Segoe UI", Roboto, Arial, sans-serif;
  font-size:16px;
  line-height:1.65;
  color:var(--gp-text);
  background:var(--gp-bg);
}

img{
  max-width:100%;
  height:auto;
  display:block;
}

a{
  color:var(--gp-link);
  text-decoration:none;
}

a:hover{
  color:var(--gp-link-hover);
  text-decoration:underline;
}

.container{
  max-width:var(--gp-container);
  margin-inline:auto;
  padding-inline:16px;
}

/* =========================
   ACCESSIBILITY
========================= */
.skip-link{
  position:absolute;
  left:-9999px;
  top:auto;
  width:1px;
  height:1px;
  overflow:hidden;
}

.skip-link:focus{
  position:fixed;
  left:16px;
  top:16px;
  width:auto;
  height:auto;
  padding:10px 14px;
  background:#000;
  color:#fff;
  z-index:9999;
  border-radius:10px;
}

/* =========================
   HEADER
========================= */
.site-header{
  position:sticky;
  top:0;
  z-index:50;
  background:rgba(255,255,255,.92);
  backdrop-filter: blur(12px);
  border-bottom:var(--gp-border);
}

.header-inner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  padding-block:12px;
}

.brand{
  display:flex;
  align-items:center;
  gap:12px;
}

.site-title{
  margin:0;
  font-size:18px;
  font-weight:700;
  line-height:1.2;
}

.site-title a{
  color:inherit;
}

.site-desc{
  margin:0;
  font-size:13px;
  color:var(--gp-muted);
}

/* =========================
   NAVIGATION
========================= */
.nav-toggle{
  display:none;
  align-items:center;
  justify-content:center;
  width:44px;
  height:44px;
  border:var(--gp-border);
  border-radius:12px;
  background:var(--gp-surface);
  cursor:pointer;
}

.nav-toggle:focus{
  outline:2px solid rgba(37,99,235,.35);
  outline-offset:2px;
}

.primary-nav ul{
  list-style:none;
  margin:0;
  padding:0;
  display:flex;
  gap:14px;
}

.primary-nav a{
  padding:10px 12px;
  border-radius:12px;
  color:var(--gp-text);
  font-weight:500;
}

.primary-nav a:hover{
  background:rgba(0,0,0,.04);
  text-decoration:none;
}

/* =========================
   HEADER AD (CLS SAFE)
========================= */
.header-ad{
  padding-block:12px 14px;
}

.gplite-ad{
  display:flex;
  align-items:center;
  justify-content:center;
  border:var(--gp-border);
  border-radius:var(--gp-radius);
  background:rgba(0,0,0,.02);
  overflow:hidden;
}

.gplite-ad ins{
  display:block;
  width:100%;
}

/* =========================
   LAYOUT
========================= */
.site-main{
  padding-block:22px;
}

.layout{
  display:grid;
  grid-template-columns: 1fr 320px;
  gap:var(--gp-gap);
  align-items:start;
}

/* =========================
   CONTENT
========================= */
.card{
  background:var(--gp-surface);
  border:var(--gp-border);
  border-radius:var(--gp-radius);
  box-shadow:var(--gp-shadow);
}

.content-area .card{
  padding:18px;
}

.post-card{
  padding:16px;
  margin-bottom:var(--gp-gap);
}

.entry-title{
  margin:0 0 10px;
  font-size:28px;
  line-height:1.25;
}

.post-card h2{
  margin:0 0 8px;
  font-size:20px;
  line-height:1.3;
}

.entry-meta{
  font-size:13px;
  color:var(--gp-muted);
  margin-bottom:14px;
}

.entry-meta a{
  color:inherit;
}

.entry-content p{
  margin:0 0 14px;
}

.entry-content h2,
.entry-content h3,
.entry-content h4{
  margin-top:24px;
}

.excerpt{
  margin:0;
  color:var(--gp-muted);
}

/* =========================
   SIDEBAR
========================= */
.sidebar .widget{
  padding:16px;
  margin-bottom:var(--gp-gap);
}

.widget-title{
  margin:0 0 10px;
  font-size:16px;
}

/* =========================
   PAGINATION
========================= */
.pagination{
  display:flex;
  justify-content:center;
  gap:10px;
  padding-block:16px;
}

.pagination a,
.pagination span{
  padding:10px 14px;
  border:var(--gp-border);
  border-radius:12px;
}

.pagination .current{
  background:rgba(37,99,235,.10);
  border-color:rgba(37,99,235,.30);
}

/* =========================
   COMMENTS
========================= */
.comment-list{
  list-style:none;
  padding:0;
}

.comment{
  margin-bottom:18px;
}

/* =========================
   FOOTER
========================= */
.site-footer{
  border-top:var(--gp-border);
  padding-block:22px;
  background:rgba(0,0,0,.02);
  color:var(--gp-muted);
}

.footer-inner{
  display:flex;
  justify-content:space-between;
  gap:14px;
  flex-wrap:wrap;
}

/* =========================
   MOBILE
========================= */
@media (max-width: 980px){
  .layout{
    grid-template-columns:1fr;
  }

  .nav-toggle{
    display:inline-flex;
  }

  .primary-nav{
    display:none;
    width:100%;
  }

  .primary-nav.is-open{
    display:block;
  }

  .primary-nav ul{
    flex-direction:column;
    padding-block:12px;
  }

  .primary-nav a{
    padding:12px;
  }
}
