/* Solara v0.1.7c theme — black & violet — shared layer loaded after each page's own styles */
:root {
  --bg-primary: #07060b;
  --bg-secondary: #0d0a16;
  --bg-card: rgba(180,140,255, 0.04);
  --text-primary: #f5f3ff;
  --text-secondary: #a59fbf;
  --accent-main: #a855f7;
  --accent-glow: #d8b4fe;
  --accent-hot: #7c3aed;
  --border: rgba(216,180,254, 0.12);
  --border-hover: rgba(216,180,254, 0.35);
  --sun: radial-gradient(circle at 50% 50%, #e9d5ff 0%, #a855f7 35%, #7c3aed 60%, transparent 72%);
}

body { background: var(--bg-primary) !important; letter-spacing: 0.1px; }
body::before {
  background-image: radial-gradient(rgba(216,180,254, 0.07) 1px, transparent 1px) !important;
  background-size: 28px 28px !important;
}
body::after {
  top: -260px !important; width: 900px !important; height: 900px !important;
  background: radial-gradient(circle, rgba(124,58,237, 0.18) 0%, rgba(168,85,247, 0.06) 35%, transparent 65%) !important;
}

/* Floating pill navigation */
.navbar {
  top: 16px !important; left: 50% !important; transform: translateX(-50%);
  width: calc(100% - 32px) !important; max-width: 1080px;
  border: 1px solid var(--border) !important; border-radius: 999px;
  background: rgba(13,10,22, 0.72) !important;
  box-shadow: 0 12px 40px -12px rgba(0, 0, 0, 0.7);
}
.nav-container { height: 60px !important; padding: 0 12px 0 16px !important; }
.logo-icon { border-radius: 50% !important; border-color: var(--border) !important; background: transparent !important; }
.logo-text span { color: var(--accent-hot) !important; }
.nav-link {
  text-transform: none !important; letter-spacing: 0 !important; font-size: 15px !important;
  padding: 8px 14px; border-radius: 999px;
}
.nav-link:hover { background: rgba(216,180,254, 0.08); color: var(--accent-glow) !important; }
.nav-link.active { background: linear-gradient(135deg, var(--accent-glow), var(--accent-main)); color: #0b0712 !important; }
.nav-menu { gap: 4px !important; align-items: center; }
@media (max-width: 768px) {
  .navbar { border-radius: 22px; }
  .nav-menu { border-radius: 0 0 22px 22px; }
}

/* Home hero: centered with a sun */
.hero {
  grid-template-columns: 1fr !important; text-align: center; justify-items: center;
  padding-top: 170px !important; gap: 48px !important; position: relative;
}
.hero::before {
  content: ''; position: absolute; top: 70px; left: 50%; transform: translateX(-50%);
  width: 260px; height: 260px; background: var(--sun); filter: blur(30px); opacity: 0.55;
  z-index: -1; animation: solara-pulse 6s ease-in-out infinite;
}
@keyframes solara-pulse { 50% { opacity: 0.8; transform: translateX(-50%) scale(1.08); } }
.hero-content h1 { font-size: clamp(44px, 7vw, 84px) !important; }
.hero-content p { margin-left: auto !important; margin-right: auto !important; max-width: 620px !important; }
.hero-content .meta-info { justify-content: center; }
.hero-image { width: 100%; max-width: 760px; }
.eyebrow {
  display: inline-flex; align-items: center; gap: 8px; margin-bottom: 22px;
  padding: 6px 14px; border-radius: 999px; font-size: 13px; font-weight: 600;
  color: var(--accent-glow); border: 1px solid var(--border); background: rgba(216,180,254, 0.06);
}

/* Buttons */
.download-btn, .download-btn-large, .dl-btn, .card-btn {
  background: linear-gradient(135deg, var(--accent-glow), var(--accent-main) 55%, var(--accent-hot)) !important;
  color: #0b0712 !important; border-radius: 999px !important; border: none !important;
  box-shadow: 0 10px 30px -10px rgba(124,58,237, 0.6) !important; font-weight: 700 !important;
}
.download-btn:hover, .download-btn-large:hover, .dl-btn:hover { transform: translateY(-2px); filter: brightness(1.08); }

/* Cards & boxes: glass with warm top edge */
.card, .bento-box, .terminal-window, .top-download-box, .search-wrap input {
  background: linear-gradient(180deg, rgba(180,140,255, 0.06), rgba(180,140,255, 0.015)) !important;
  border: 1px solid var(--border) !important; border-radius: 22px !important;
  box-shadow: inset 0 1px 0 rgba(216,180,254, 0.18);
}
.card:hover, .bento-box:hover { border-color: var(--border-hover) !important; transform: translateY(-4px); }
.card-icon { border-radius: 50% !important; background: rgba(168,85,247, 0.12) !important; color: var(--accent-glow) !important; }
.search-wrap input { border-radius: 999px !important; }

/* Articles */
.article-container { padding-top: 140px !important; max-width: 820px !important; }
.article-title {
  background: linear-gradient(135deg, #fff 30%, var(--accent-glow));
  -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent;
}
.breadcrumb { display: inline-block; padding: 6px 14px; border: 1px solid var(--border); border-radius: 999px; font-size: 13px; }
.breadcrumb a { color: var(--accent-glow) !important; }
.article-content h2 { padding-left: 14px; border-left: 3px solid var(--accent-main); }
.article-content a { color: var(--accent-glow) !important; text-decoration-color: rgba(216,180,254, 0.4); }
.note-box, .warning-box {
  border-radius: 16px !important; border: 1px solid var(--border) !important;
  border-left: 4px solid var(--accent-main) !important; background: rgba(168,85,247, 0.06) !important;
}
.warning-box { border-left-color: var(--accent-hot) !important; background: rgba(124,58,237, 0.07) !important; }
table { border-radius: 16px; overflow: hidden; }
th { background: rgba(168,85,247, 0.1) !important; color: var(--accent-glow) !important; }

.container, .page-header { padding-top: 140px !important; }
.category-title i, .bento-box h2 i { color: var(--accent-hot) !important; }

/* Footer */
.footer { border-top: 1px solid var(--border) !important; background: linear-gradient(180deg, transparent, rgba(124,58,237, 0.05)) !important; }
.footer a:hover { color: var(--accent-glow) !important; }
.terminal-body { text-align: left; }
.download-btn-large { white-space: nowrap; }
.seo-intro{font-size:17px!important;color:#ddd6fe!important;border-left:3px solid #a855f7;padding-left:14px}
.seo-related,.seo-faq{margin-top:40px}
.seo-related ul{list-style:none;padding:0!important;display:grid;gap:10px}
.seo-related a{color:#d8b4fe;text-decoration:none}
.seo-faq details{background:rgba(255,255,255,.03);border:1px solid #2a2140;border-radius:14px;padding:14px 18px;margin-bottom:10px}
.seo-faq summary{cursor:pointer;font-weight:600;color:#fff}
.seo-faq details p{margin:10px 0 0!important;color:#a59fbf}
.seo-wrap{max-width:900px;margin:0 auto 60px;padding:0 24px}
.about-text a{color:#d8b4fe;text-decoration:none;border-bottom:1px dashed #a855f7}

/* ===== v0.1.7c layout overrides ===== */
body{background:#07060b!important;font-family:'Outfit',sans-serif}
body::after{background:radial-gradient(circle,rgba(124,58,237,.22) 0%,rgba(168,85,247,.06) 40%,transparent 70%)!important}
.navbar{top:0!important;left:0!important;transform:none!important;width:100%!important;max-width:none!important;border-radius:0!important;
 border:0!important;border-bottom:1px solid rgba(168,85,247,.25)!important;background:rgba(7,6,11,.85)!important;backdrop-filter:blur(18px)}
.nav-container{max-width:1200px;margin:0 auto;height:66px!important;display:flex;align-items:center;gap:24px;padding:0 24px!important}
.nav-menu{margin-left:auto;display:flex;list-style:none}
.logo-icon{border-radius:10px!important}
.logo-text{letter-spacing:2px;font-weight:800!important;color:#fff!important}
.logo-text span{color:#a855f7!important}
.nav-link{border-radius:8px!important;color:#a59fbf!important}
.nav-link.active{background:rgba(168,85,247,.16)!important;color:#d8b4fe!important;box-shadow:inset 0 -2px 0 #a855f7}
.download-btn,.download-btn-large,.dl-btn,.card-btn{color:#fff!important;border-radius:12px!important}
.card,.bento-box,.terminal-window,.top-download-box{border-radius:14px!important;box-shadow:inset 0 1px 0 rgba(216,180,254,.12)!important}
.article-container,.container,.page-header{padding-top:120px!important}
.hero{padding-top:150px!important}
.article-title{background:linear-gradient(135deg,#fff 20%,#c084fc 80%)!important;-webkit-background-clip:text!important;background-clip:text!important}
.article-content h2{border-left:4px solid #a855f7!important;border-bottom:0!important}
.article-content h3{color:#e9d5ff}
.breadcrumb{border-radius:8px!important;background:rgba(168,85,247,.08)}
.seo-intro{border-left-color:#a855f7!important;color:#ddd6fe!important}
.seo-related a{color:#d8b4fe!important}
.seo-faq details{border-color:#2a2140!important;border-radius:10px!important}
.site-footer{margin-top:60px;padding:56px 24px 24px!important;border-top:1px solid rgba(168,85,247,.25)!important;background:linear-gradient(180deg,#07060b,#0d0a16)!important;text-align:left!important}
.f-grid{max-width:1200px;margin:0 auto;display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:32px}
.f-col h4{font-family:'Space Grotesk',sans-serif;color:#fff;font-size:14px;text-transform:uppercase;letter-spacing:1.5px;margin-bottom:14px}
.f-col a{display:block;color:#a59fbf;text-decoration:none;font-size:14px;margin:0 0 9px!important}
.f-col a:hover{color:#d8b4fe!important}
.f-brand p{color:#a59fbf;font-size:14px;margin-top:10px;max-width:280px}
.f-brand .logo-text{font-family:'Space Grotesk',sans-serif;font-size:22px}
.f-bottom{max-width:1200px;margin:36px auto 0;padding-top:18px;border-top:1px solid #2a2140;color:#6b6585;font-size:13px;text-align:center}
@media(max-width:768px){.f-grid{grid-template-columns:1fr 1fr}.nav-container{gap:12px}.nav-menu{gap:0!important}.nav-link{padding:6px 8px!important;font-size:13px!important}}

.logo{display:flex!important;align-items:center;gap:10px;text-decoration:none;background:none!important;box-shadow:none!important;padding:0!important;position:static!important}
.logo-icon{width:36px;height:36px;flex:0 0 36px}
.nav-menu{position:static!important;transform:none!important;flex-direction:row!important;background:none!important;padding:0!important;height:auto!important;width:auto!important;opacity:1!important;visibility:visible!important}
.mobile-toggle,.hamburger,.menu-toggle,.nav-toggle{display:none!important}
@media(max-width:480px){.logo-text{font-size:17px!important;letter-spacing:1px}.nav-container{padding:0 12px!important}.nav-link{padding:6px 6px!important}}

/* ===== Fixed shared header (same on every page) ===== */
.sh-header{position:fixed;top:0;left:0;right:0;z-index:2000;height:64px;margin:0;padding:0;background:rgba(7,6,11,.92);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border-bottom:1px solid rgba(168,85,247,.25);box-sizing:border-box}
.sh-wrap{max-width:1200px;height:64px;margin:0 auto;padding:0 24px;display:flex;align-items:center;justify-content:space-between;box-sizing:border-box}
.sh-logo{display:flex;align-items:center;gap:10px;text-decoration:none;line-height:1}
.sh-logo img{width:32px;height:32px;display:block;border-radius:8px}
.sh-logo span{font-family:'Space Grotesk',sans-serif;font-size:20px;font-weight:800;letter-spacing:2px;color:#fff}
.sh-logo b{color:#a855f7}
.sh-menu{display:flex;align-items:center;gap:4px;margin:0;padding:0}
.sh-link{display:block;padding:8px 14px;border-radius:8px;font-family:'Outfit',sans-serif;font-size:15px;font-weight:600;line-height:1.2;color:#a59fbf;text-decoration:none;text-transform:none;letter-spacing:0;transition:color .2s,background .2s}
.sh-link:hover{color:#d8b4fe;background:rgba(168,85,247,.1)}
.sh-link.sh-active{color:#e9d5ff;background:rgba(168,85,247,.18);box-shadow:inset 0 -2px 0 #a855f7}
@media(max-width:520px){.sh-wrap{padding:0 12px}.sh-logo span{font-size:16px;letter-spacing:1px}.sh-link{padding:6px 7px;font-size:13px}.sh-menu{gap:0}}
