:root{
  --max-w: 1100px;
  --pad: 16px;
  --glass: rgba(255,255,255,0.08);
  --glass-strong: rgba(0,0,0,0.35);
  --text: #f3f4f6;
  --muted: #cbd5e1;
  --accent: #f59e0b;
}

/* ===== Full-bleed background (desktop + mobile from header.php) ===== */
.site-bg{
  position: fixed; inset: 0; z-index: -1;
  background-image:
    var(--bg-gradient, radial-gradient(80% 60% at 50% 20%, #1f2937 0%, #0b1020 60%, #000 100%)),
    var(--bg-url-desktop);
  background-size: cover; background-position: center;
  filter: saturate(1) contrast(1.05);
}
@media (max-width: 767px){
  .site-bg{
    background-image:
      var(--bg-gradient, radial-gradient(80% 60% at 50% 20%, #1f2937 0%, #0b1020 60%, #000 100%)),
      var(--bg-url-mobile);
  }
}

body{ margin:0; color:var(--text); font-family: system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans,sans-serif; background: transparent; }

/* ===== Header ===== */
.site-header{ position: sticky; top:0; backdrop-filter: blur(8px); background: linear-gradient(180deg, rgba(0,0,0,0.55), rgba(0,0,0,0.15)); border-bottom: 1px solid rgba(255,255,255,0.08); z-index: 50; }
.header-inner{ display:flex; align-items:center; justify-content:space-between; max-width:var(--max-w); margin:0 auto; padding: 10px var(--pad); }
.brand{ display:flex; align-items:center; gap:12px; }
.brand img.custom-logo{ width:52px; height:52px; object-fit:cover; border-radius:10px; }
.brand__placeholder{ display:inline-flex; }
.brand__square{ width:52px; height:52px; border-radius:10px; background: rgba(255,255,255,0.08); outline:2px dashed rgba(255,255,255,0.18); outline-offset: -6px; }
.site-title{ font-weight:700; color:var(--text); text-decoration:none; letter-spacing:0.2px; }

/* Nav */
.menu-toggle{ background:transparent; border:0; display:flex; flex-direction:column; gap:4px; padding:8px; cursor:pointer; }
.menu-toggle .bar{ width:24px; height:2px; background:#fff; display:block; border-radius:1px; }
.site-nav{ position: fixed; top:60px; right: var(--pad); background: rgba(0,0,0,0.6); backdrop-filter: blur(8px); border:1px solid rgba(255,255,255,0.08); padding:10px 14px; border-radius:12px; display:none; }
.site-nav.is-open{ display:block; }
.site-nav ul{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:8px; }
.site-nav a{ color:var(--text); text-decoration:none; }
@media (min-width: 900px){
  .site-nav{ position:static; display:block; background:transparent; border:0; padding:0; }
  .site-nav ul{ flex-direction:row; gap:18px; }
  .menu-toggle{ display:none; }
}

/* ===== Layout ===== */
.container{ max-width: var(--max-w); margin: clamp(16px, 4vw, 36px) auto; padding: 0 var(--pad); }
.container--home{ margin-top: clamp(24px, 8vw, 64px); }

/* Content cards (glass on background) */
.content-card{ background: linear-gradient(180deg, var(--glass-strong), rgba(0,0,0,0.25)); border:1px solid rgba(255,255,255,0.08); border-radius: 16px; padding: clamp(16px, 3vw, 28px); box-shadow: 0 10px 30px rgba(0,0,0,0.25); }
.entry-title{ margin-top:0; }


/* ===== Footer ===== */
.site-footer{ text-align:center; padding: 24px var(--pad) 40px; color: var(--muted); }