/*
Theme Name: Quantum Technologies — Starter
Theme URI:  https://d3qtech.com
Author: Quantum Technologies
Description: Modern interactive theme for Advanced AI & Quantum Computing company.
Version: 1.0
Text Domain: quantum-tech
*/

:root{
  --brand-1: #0f172a;
  --accent-1: #00d1ff;
  --accent-2: #8b5cf6;
  --muted: #94a3b8;
  --glass: rgba(255,255,255,0.06);
  --card-bg: rgba(255,255,255,0.03);
  --radius: 14px;
  --max-width: 1200px;
  --gap: 24px;
}

*{box-sizing:border-box}
body{font-family:Inter,system-ui,-apple-system,'Segoe UI',Roboto,Arial;
background:linear-gradient(180deg,var(--brand-1) 0%,#071029 100%);
color:#e6eef8;margin:0}
.container{max-width:var(--max-width);margin:0 auto;padding:40px 20px}

/* Changed .header to .site-header to match header.php */
.site-header{display:flex;align-items:center;justify-content:space-between;padding:18px 20px}

/* Fixed the logo selector.
  It now targets the .site-logo class from header.php
  and sets a max-height to keep it from being too big.
*/
.site-logo {
    max-height: 60px;
    width: auto;
    vertical-align: middle;
}

/* Ensure the logo container and the spacer have the exact same width 
   to keep the navigation menu perfectly centered. */
.logo-container,
.header-spacer {
    width: 100px; /* Must match the logo's width */
}

.nav a{color:var(--muted);text-decoration:none;padding:8px;border-radius:10px; align-items:center}
.nav a:hover{color:var(--accent-1)}
.hero{position:relative;padding:80px 20px;border-radius:20px;overflow:hidden;margin-bottom:36px}
.hero .hero-inner{display:grid;grid-template-columns:1fr 420px;gap:30px;align-items:center}
.hero h1{font-size:44px;line-height:1.02;margin:0}
.button{padding:12px 18px;border-radius:12px;background:linear-gradient(90deg,var(--accent-1),var(--accent-2));color:#041025;font-weight:700;text-decoration:none}
.card{background:var(--card-bg);padding:18px;border-radius:var(--radius);box-shadow:0 6px 24px rgba(2,6,22,0.6)}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--gap)}
.blog-list{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.footer{padding:32px 20px;margin-top:40px;border-top:1px solid rgba(255,255,255,0.03);display:flex;justify-content:space-between;align-items:center}
@media(max-width:980px){.hero .hero-inner{grid-template-columns:1fr}.grid-3,.blog-list{grid-template-columns:1fr}}