/*
Theme Name: SparkleWise v7.3 Hierarchical Menu
Theme URI: https://sparklewise.net/
Author: SparkleWise
Description: SparkleWise responsive editorial theme with multilingual blog, categories, FAQ and music player.
Version: 7.3.0
Requires at least: 6.0
*/
:root{
 --bg:#06101d;--bg2:#09192b;--panel:rgba(8,20,35,.88);--gold:#e4b76d;--gold2:#f1cc86;
 --text:#f5f1e8;--muted:#aab4c1;--line:rgba(228,183,109,.24);--max:1380px;
}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--text);font-family:Inter,Arial,sans-serif;line-height:1.6}
a{color:inherit;text-decoration:none}button,input,textarea{font:inherit}
.site-header{position:absolute;top:0;left:0;right:0;height:92px;z-index:30;display:flex;align-items:center;justify-content:space-between;padding:0 5.5%;background:rgba(3,10,19,.93);border-bottom:1px solid rgba(228,183,109,.12)}
.brand{display:flex;align-items:center;gap:12px;min-width:230px}.brand-mark{color:var(--gold2);font-size:48px;line-height:1}.brand-text{display:block;font:700 30px Georgia,serif;letter-spacing:.3px}.brand-tag{display:block;color:#c4c0b7;font-size:10px;letter-spacing:4px;margin-top:-3px}
.nav{display:flex;align-items:center;gap:31px;margin-left:auto;margin-right:28px}.nav a{font-weight:600;font-size:15px;white-space:nowrap;position:relative}.nav a:hover,.nav a.active{color:var(--gold2)}.nav a.active:after{content:"";position:absolute;left:0;right:0;bottom:-13px;height:2px;background:var(--gold)}
.tools{display:flex;align-items:center;gap:13px}.languages{display:flex;gap:12px}.languages a{font-size:13px;color:#b7bfca}.languages a.active{color:var(--gold2);font-weight:700}.moon{font-size:25px;color:var(--gold2)}.mobile-btn{display:none;background:none;border:0;color:white;font-size:27px}
.hero{position:relative;min-height:350px;background-image:url('assets/images/hero-clean.jpg');background-size:cover;background-position:center;overflow:hidden}
.hero:before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(3,10,19,.98) 0 92px,rgba(3,10,19,.22) 92px 100%),linear-gradient(90deg,rgba(3,10,19,.98) 0,rgba(3,10,19,.94) 42%,rgba(3,10,19,.12) 60%,transparent 76%);pointer-events:none}.hero:after{content:"";position:absolute;left:0;top:0;bottom:0;width:55%;background:rgba(3,10,19,.94);pointer-events:none}
.hero-copy{position:relative;z-index:2;padding:132px 0 42px 12.2%;max-width:780px}.eyebrow{color:var(--gold);font-size:13px;letter-spacing:5px;text-transform:uppercase;margin-bottom:10px}.hero-copy h1{font:700 clamp(38px,4.2vw,64px)/1.03 Georgia,serif;margin:0 0 15px;max-width:740px;color:var(--gold2);text-shadow:0 1px 0 rgba(0,0,0,.25)}.hero-copy p{font:italic 19px/1.4 Georgia,serif;color:#f4f0e8;margin:0;max-width:620px}
.container{width:min(var(--max),90%);margin:auto}.blog-section{padding:28px 0 60px;background:radial-gradient(circle at 50% 0,rgba(23,56,96,.45),transparent 52%),var(--bg)}
.toolbar{display:flex;align-items:center;justify-content:space-between;gap:25px;margin-bottom:22px}.filters{display:flex;gap:12px;align-items:center;flex-wrap:wrap}.filter{border:0;background:none;color:#e8e9ec;padding:11px 18px;border-radius:30px;cursor:pointer;font-weight:600}.filter.active{background:linear-gradient(135deg,var(--gold2),#f0c65d);color:#101722}.search{width:280px;border:1px solid rgba(255,255,255,.22);border-radius:30px;height:43px;display:flex;align-items:center;padding:0 15px}.search input{width:100%;background:none;border:0;outline:0;color:white}.search input::placeholder{color:#8995a3}.search span{color:var(--gold2);font-size:21px}
.blog-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}.post-card{border:1px solid rgba(228,183,109,.28);border-radius:9px;overflow:hidden;background:rgba(2,12,22,.7);transition:.25s}.post-card:hover{transform:translateY(-3px);border-color:rgba(228,183,109,.65)}.post-image{aspect-ratio:441/183;overflow:hidden}.post-image img{width:100%;height:100%;object-fit:cover;display:block}.post-body{padding:18px 22px 20px}.badge{display:inline-block;background:linear-gradient(135deg,var(--gold2),#e3ad54);color:#171c24;border-radius:20px;padding:4px 13px;font-size:12px;font-weight:700}.post-body h2{font:700 28px/1.12 Georgia,serif;margin:12px 0 8px}.excerpt{color:#bac3ce;margin:0 0 16px}.meta{display:flex;justify-content:space-between;gap:10px;align-items:center;color:#9ba5b2;font-size:13px}.read{color:var(--gold2);font-weight:700}
.pagination{text-align:center;padding:35px 0 8px}.pagination a,.pagination span{display:inline-flex;width:38px;height:38px;align-items:center;justify-content:center;border-radius:50%;margin:0 4px}.pagination .current{background:var(--gold2);color:#18202b}
.quote-strip{padding:28px 0;text-align:center;color:#dbc18f;font:italic 20px Georgia,serif}.quote-strip:before,.quote-strip:after{content:"";display:inline-block;width:70px;height:1px;background:var(--line);vertical-align:middle;margin:0 18px}
.site-footer{position:relative;background:linear-gradient(180deg,#030b15 0%,#040d18 55%,#020914 100%);padding:55px 0 22px;overflow:hidden}.site-footer:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 78% 18%,rgba(20,54,92,.18),transparent 38%),linear-gradient(180deg,rgba(2,10,19,.08),rgba(2,10,19,.18));pointer-events:none}.footer-inner{position:relative;z-index:1;width:min(var(--max),90%);margin:auto;display:grid;grid-template-columns:1.2fr 1fr 1.3fr;gap:45px}.footer-brand{font:700 29px Georgia,serif}.footer-desc{color:#aab2bd;max-width:390px}.socials{display:flex;gap:10px;margin-top:22px}.socials a{width:40px;height:40px;border:1px solid var(--gold);border-radius:50%;display:grid;place-items:center;color:var(--gold2);font-weight:700}.footer-title{color:var(--gold);font-size:11px;letter-spacing:3px;text-transform:uppercase}.footer-links a{display:block;color:#b8c0ca;margin:7px 0}.newsletter{display:flex;border:1px solid rgba(228,183,109,.45);border-radius:30px;padding:4px;margin-top:15px}.newsletter input{flex:1;background:none;border:0;outline:0;color:white;padding:8px 14px}.newsletter button{border:0;border-radius:50%;width:38px;height:38px;background:var(--gold2);color:#111;cursor:pointer}.copyright{position:relative;z-index:1;width:min(var(--max),90%);margin:35px auto 0;padding-top:18px;border-top:1px solid rgba(255,255,255,.1);display:flex;justify-content:space-between;color:#788493;font-size:12px}
.popup-backdrop{display:none;position:fixed;inset:0;background:rgba(0,0,0,.72);backdrop-filter:blur(5px);z-index:100}.popup-backdrop.show{display:grid;place-items:center}.popup{width:min(650px,90%);background:linear-gradient(145deg,#092f64,#061a38);border:1px solid rgba(228,183,109,.7);border-radius:18px;padding:38px 42px;box-shadow:0 25px 80px rgba(0,0,0,.55);position:relative}.popup-close{position:absolute;right:18px;top:13px;background:none;border:0;color:white;font-size:26px;cursor:pointer}.popup h2{font:700 32px/1.12 Georgia,serif;color:#f5f1e8;margin:0 30px 18px 0}.popup p{color:#d3dce8;margin:0 0 23px}.popup-actions{display:flex;gap:12px}.btn{display:inline-block;border-radius:30px;padding:11px 20px;font-weight:700}.btn-gold{background:var(--gold2);color:#152033}.btn-outline{border:1px solid var(--gold2);color:var(--gold2)}
.page-shell{width:min(900px,90%);margin:0 auto;padding:140px 0 80px}.page-shell h1{font:700 clamp(38px,6vw,62px)/1.05 Georgia,serif;color:var(--gold2);margin:0 0 16px}.page-shell h2,.page-shell h3{font-family:Georgia,serif}.page-shell p,.page-shell li{color:#bdc6d1}.page-shell form{background:rgba(10,26,44,.7);border:1px solid var(--line);padding:25px;border-radius:14px}.page-shell input,.page-shell textarea{width:100%;background:#061321;border:1px solid rgba(255,255,255,.15);color:white;padding:12px 14px;border-radius:8px;outline:0}.page-shell button{background:var(--gold2);border:0;border-radius:25px;padding:11px 22px;cursor:pointer}.faq-item{padding:18px 0;border-bottom:1px solid rgba(255,255,255,.12)}.faq-answer{color:#aeb9c7}
.mobile-nav{display:none}

@media(max-width:1050px){
 .nav{gap:17px;margin-right:12px}.nav a{font-size:13px}.brand-text{font-size:25px}.brand-mark{font-size:40px}.hero-copy{padding-left:9%}
}
@media(max-width:800px){
 .site-header{height:72px;padding:0 5%;background:rgba(3,10,19,.96)}.brand{min-width:0}.brand-text{font-size:22px}.brand-tag{font-size:7px;letter-spacing:2.5px}.brand-mark{font-size:33px}.nav{display:none}.tools{gap:10px}.languages{gap:8px}.moon{display:none}.mobile-btn{display:block}.mobile-nav{display:none;position:absolute;top:72px;left:0;right:0;background:#071526;border-bottom:1px solid var(--line);padding:12px 5%;}.site-header.open .mobile-nav{display:block}.mobile-nav a{display:block;padding:11px 0;border-bottom:1px solid rgba(255,255,255,.07)}.hero{min-height:360px;background-position:62% center}.hero:before{background:linear-gradient(180deg,rgba(3,10,19,.99) 0 72px,rgba(3,10,19,.35) 72px 100%),linear-gradient(90deg,rgba(3,10,19,.97),rgba(3,10,19,.55),transparent)}.hero:after{top:0;width:74%;background:rgba(3,10,19,.78)}.hero-copy{padding:135px 7% 30px}.hero-copy h1{font-size:38px}.hero-copy p{font-size:16px}.toolbar{align-items:stretch;flex-direction:column}.search{width:100%}.blog-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:15px}.post-body{padding:14px}.post-body h2{font-size:22px}.excerpt{font-size:14px}.meta{font-size:11px}.footer-inner{grid-template-columns:1fr 1fr}.copyright{display:block}.copyright span{display:block;margin-top:5px}
}
@media(max-width:560px){
 .hero{min-height:420px;background-position:66% center}.hero-copy{padding-top:145px}.hero-copy h1{font-size:34px}.hero-copy p{font-size:15px}.filters{gap:5px;flex-wrap:nowrap;overflow-x:auto;padding-bottom:5px}.filter{padding:9px 13px;white-space:nowrap}.blog-grid{grid-template-columns:1fr}.post-body h2{font-size:25px}.footer-inner{grid-template-columns:1fr}.quote-strip{font-size:17px;padding:25px 8%}.quote-strip:before,.quote-strip:after{display:none}.popup{padding:30px 24px}.popup h2{font-size:25px}.popup p{font-size:14px}.popup-actions{flex-direction:column}.btn{text-align:center}
}


/* v2 clean layout — no horizontal scrolling and no baked-in duplicate footer UI */
html,body{max-width:100%;overflow-x:hidden}
.filters{min-width:0;flex:1;justify-content:flex-start}
.filter{flex:0 0 auto}
@media (max-width:1050px){
  .toolbar{gap:16px}
  .filters{gap:6px}
  .filter{padding:10px 13px;font-size:14px}
  .search{width:240px;flex:0 0 240px}
}
@media (max-width:800px){
  .toolbar{display:block}
  .filters{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;width:100%;margin-bottom:14px}
  .filter{width:100%;padding:10px 6px;text-align:center;white-space:normal}
  .search{width:100%;max-width:none}
  .site-footer{padding-top:42px}
}
@media (max-width:560px){
  .filters{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
  .filter{font-size:13px;padding:10px 7px}
  .footer-inner{gap:28px}
  .copyright{margin-top:28px}
}


/* v3 single-post fix */
.single-post-shell{background:radial-gradient(circle at 50% 0,rgba(23,56,96,.38),transparent 48%),var(--bg);min-height:55vh;padding:130px 0 75px}
.single-post-inner{width:min(900px,90%);margin:auto}
.single-post{background:rgba(3,13,24,.72);border:1px solid rgba(228,183,109,.22);border-radius:14px;padding:38px 44px 50px;box-shadow:0 20px 60px rgba(0,0,0,.2)}
.single-post h1{font:700 clamp(38px,6vw,64px)/1.08 Georgia,serif;color:var(--gold2);margin:0 0 8px}
.single-post-meta{color:#8f9aaa;font-size:13px;margin-bottom:28px}
.single-post-featured{margin:0 -10px 32px;border-radius:10px;overflow:hidden;max-height:480px}
.single-post-featured img{display:block;width:100%;height:auto;max-height:480px;object-fit:cover}
.single-post .entry-content{font-size:18px;line-height:1.85;color:#d2d9e1}
.single-post .entry-content p{margin:0 0 20px;color:#d2d9e1}
.single-post .entry-content h2,.single-post .entry-content h3{color:#f2d18e;margin:32px 0 12px;font-family:Georgia,serif}
.single-post .entry-content ul,.single-post .entry-content ol{color:#c9d2dc;padding-left:25px}
.single-post .entry-content a{color:var(--gold2);text-decoration:underline}
@media(max-width:560px){.single-post-shell{padding:105px 0 45px}.single-post{padding:26px 20px 34px}.single-post h1{font-size:34px}.single-post .entry-content{font-size:16px;line-height:1.75}.single-post-featured{margin:0 -5px 24px}.filters{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;overflow:visible}.filter{width:100%;white-space:normal}}

.faq-static-content{margin:0 0 38px}.faq-static-content h2,.faq-static-content h3{color:var(--gold2);margin:28px 0 8px}.faq-static-content p,.faq-static-content li{color:#bdc6d1;line-height:1.75}.faq-static-content strong{color:#fff}


/* v4.3 clean chrome — keep the real header as the only visible navigation layer */
.site-header{isolation:isolate}
.site-header + *{position:relative}
.hero{isolation:isolate}
.site-footer{isolation:isolate}


/* v4.4 language-safe header + hide baked navigation inside hero artwork */
.primary-menu{display:flex;align-items:center;gap:31px;margin:0;padding:0}
.primary-menu a{font-weight:600;font-size:15px;white-space:nowrap;position:relative}
.primary-menu a:hover{color:var(--gold2)}
.mobile-primary-menu a{display:block;padding:11px 0;border-bottom:1px solid rgba(255,255,255,.07)}
/* The hero artwork contains an old, baked-in AZ navigation bar. Cover it without touching the real header. */
.hero:before{background:linear-gradient(180deg,rgba(3,10,19,1) 0 150px,rgba(3,10,19,.22) 150px 100%),linear-gradient(90deg,rgba(3,10,19,.98) 0,rgba(3,10,19,.94) 42%,rgba(3,10,19,.12) 60%,transparent 76%)}
@media(max-width:1050px){.primary-menu{gap:17px}.primary-menu a{font-size:13px}}
@media(max-width:800px){.primary-menu{display:block}.hero:before{background:linear-gradient(180deg,rgba(3,10,19,1) 0 125px,rgba(3,10,19,.35) 125px 100%),linear-gradient(90deg,rgba(3,10,19,.97),rgba(3,10,19,.55),transparent)}}


/* v7.3 — keep the WordPress menu hierarchy exactly as configured in Appearance → Menus.
   Parents stay top-level; their children remain dropdown submenus. */
.site-header .nav .sw-menu{
  display:flex;
  align-items:center;
  gap:31px;
  margin:0;
  padding:0;
  list-style:none;
}
.site-header .nav .sw-menu > li{
  position:relative;
  margin:0 0 -10px;
  padding:0 0 10px;
  list-style:none;
}
.site-header .nav .sw-menu a{
  display:block;
  font-weight:600;
  font-size:15px;
  line-height:1.2;
  white-space:nowrap;
  position:relative;
}
/* The 10px offset below now lives inside the li's own padding (see
   margin/padding above) instead of an empty gap between the li and the
   dropdown. That keeps the visual spacing identical while making the
   hover area continuous, so moving the mouse from the parent link
   straight down into the submenu no longer crosses a dead zone that
   closes the dropdown. */
.site-header .nav .sw-menu .sub-menu{
  display:none;
  position:absolute;
  top:100%;
  left:0;
  min-width:190px;
  margin:0;
  padding:8px 0;
  list-style:none;
  background:#071526;
  border:1px solid rgba(255,255,255,.12);
  border-radius:12px;
  box-shadow:0 15px 35px rgba(0,0,0,.35);
  z-index:100;
}
.site-header .nav .sw-menu > li:hover > .sub-menu,
.site-header .nav .sw-menu > li:focus-within > .sub-menu{
  display:block;
}
.site-header .nav .sw-menu .sub-menu li{
  margin:0;
  padding:0;
  list-style:none;
}
.site-header .nav .sw-menu .sub-menu a{
  padding:10px 16px;
  font-size:14px;
}
.site-header .nav .sw-menu .sub-menu a:hover{
  background:rgba(255,255,255,.06);
}
.site-header .mobile-nav .sw-menu{
  margin:0;
  padding:0;
  list-style:none;
}
.site-header .mobile-nav .sw-menu li{
  list-style:none;
  margin:0;
  padding:0;
}
.site-header .mobile-nav .sw-menu a{
  display:block;
  padding:11px 0;
  border-bottom:1px solid rgba(255,255,255,.07);
}
.site-header .mobile-nav .sw-menu .sub-menu{
  display:block;
  position:static;
  margin:0;
  padding:0 0 0 16px;
  background:transparent;
  border:0;
  box-shadow:none;
}
.site-header .mobile-nav .sw-menu .sub-menu a{
  font-size:13px;
  padding:8px 0;
}

/* Do not hide the real nested menu with old fallback rules. */
.site-header .nav ul ul{
  display:none;
}
.site-header .nav .sw-menu .sub-menu{
  display:none;
}
.site-header .nav .sw-menu > li:hover > .sub-menu,
.site-header .nav .sw-menu > li:focus-within > .sub-menu{
  display:block;
}

@media(max-width:1050px){
  .site-header .nav .sw-menu{gap:17px}
  .site-header .nav .sw-menu a{font-size:13px}
}
@media(max-width:800px){
  .site-header .nav .sw-menu{display:block}
}