/* Sparkling Home NavBar — dark theme port of src/components/NavBar.tsx. */
:root{--sn-pink:#f9a8d4;--sn-bg:#111827;--sn-ink:#ffffff;--sn-hover:#1f2937;--sn-dark:#111827;--sn-dark-2:#1f2937;}

/* The theme wraps this part in <header class="site-header">. Reserve vertical space on
   inner pages because the navbar is position:fixed; on the home the hero sits under it. */
.wp-block-template-part.site-header{display:block;min-height:84px;}
@media (min-width:768px){.wp-block-template-part.site-header{min-height:100px;}}
body.home .wp-block-template-part.site-header,
body.page-id-6 .wp-block-template-part.site-header{min-height:0;height:0;overflow:hidden;}
/* The block theme applies `:where(.wp-site-blocks) > * { margin-block-start:40px }` between
   top-level blocks, which puts a 40px white band above <main>. On the home the hero must sit
   flush under the fixed navbar, so zero that margin (and the header's) here. */
body.home .wp-site-blocks > main,
body.page-id-6 .wp-site-blocks > main{margin-block-start:0;}
body.home .wp-site-blocks > header.site-header,
body.page-id-6 .wp-site-blocks > header.site-header{margin-block-start:0;margin-block-end:0;}

.sn-navbar,.sn-navbar *{box-sizing:border-box;}
.sn-navbar{position:fixed;top:0;left:0;right:0;width:100%;background:var(--sn-bg);color:var(--sn-ink);z-index:50;padding-top:.625rem;padding-bottom:.625rem;transition:all .3s ease;}
@media (min-width:768px){.sn-navbar{padding-top:.75rem;padding-bottom:.75rem;}}
.sn-navbar.sn-scrolled{padding-top:.375rem;padding-bottom:.375rem;box-shadow:0 10px 20px -5px rgba(0,0,0,.5);}
.sn-navbar.sn-open{padding-bottom:.75rem;}

.sn-container{max-width:1280px;margin-left:auto;margin-right:auto;padding-left:.75rem;padding-right:.75rem;}
@media (min-width:640px){.sn-container{padding-left:1rem;padding-right:1rem;}}

.sn-bar{display:flex;flex-direction:row;gap:.5rem;align-items:center;justify-content:space-between;}

/* Logo (square emblem) */
.sn-logo-link{display:inline-flex;align-items:center;flex-shrink:0;text-decoration:none;}
.sn-logo{display:block;height:64px;width:auto;}
@media (min-width:768px){.sn-logo{height:76px;}}

/* Right cluster */
.sn-right{display:flex;align-items:center;gap:.25rem;}
@media (min-width:640px){.sn-right{gap:.5rem;}}
@media (min-width:768px){.sn-right{gap:1rem;}}

/* Social icons */
.sn-social{display:flex;align-items:center;gap:.5rem;}
@media (min-width:640px){.sn-social{gap:1rem;}}
@media (min-width:768px){.sn-social{gap:1.5rem;}}
.sn-icon{display:inline-flex;align-items:center;justify-content:center;padding:.375rem;border-radius:9999px;color:var(--sn-ink);transition:color .2s ease,background-color .2s ease;}
.sn-icon svg{width:24px;height:24px;display:block;}
.sn-icon .sn-fill{fill:var(--sn-ink);transition:fill .2s ease;}
.sn-icon .sn-stroke{stroke:currentColor;}
.sn-icon:hover{background:var(--sn-hover);color:var(--sn-pink);}
.sn-icon:hover .sn-fill{fill:var(--sn-pink);}
@media (max-width:767px){.sn-icon svg{width:18px;height:18px;}}
.sn-icon-google{display:none;}
@media (min-width:475px){.sn-icon-google{display:inline-flex;}}

/* Desktop menu */
.sn-desktop-nav{display:none;margin-left:1rem;}
@media (min-width:1024px){.sn-desktop-nav{display:block;}}
.sn-desktop-nav ul{display:flex;gap:2rem;list-style:none;margin:0;padding:0;}
.sn-desktop-nav a{color:var(--sn-ink);text-decoration:none;transition:color .2s ease;}
.sn-desktop-nav a:hover{color:var(--sn-pink);}

/* Mobile toggle button */
.sn-menu-btn{display:inline-flex;align-items:center;justify-content:center;background:none;border:0;cursor:pointer;color:var(--sn-ink);padding:.5rem;border-radius:.375rem;-webkit-tap-highlight-color:transparent;}
.sn-menu-btn:focus{outline:none;box-shadow:0 0 0 2px var(--sn-pink);}
.sn-menu-btn svg{width:24px;height:24px;}
@media (max-width:767px){.sn-menu-btn svg{width:20px;height:20px;}}
@media (min-width:1024px){.sn-menu-btn{display:none;}}
.sn-menu-btn .sn-icon-close{display:none;}
.sn-navbar.sn-open .sn-menu-btn .sn-icon-open{display:none;}
.sn-navbar.sn-open .sn-menu-btn .sn-icon-close{display:inline-flex;}

/* Mobile dropdown */
.sn-mobile{overflow:hidden;transition:all .3s ease-in-out;max-height:0;opacity:0;margin-top:0;}
@media (min-width:1024px){.sn-mobile{display:none;}}
.sn-navbar.sn-open .sn-mobile{max-height:16rem;opacity:1;margin-top:.75rem;}
.sn-mobile-nav{background:var(--sn-dark-2);border-radius:.5rem;box-shadow:0 10px 15px -3px rgba(0,0,0,.3);}
.sn-mobile-nav ul{display:flex;flex-direction:column;padding:.5rem 0;margin:0;list-style:none;}
.sn-mobile-nav a{display:flex;align-items:center;padding:.75rem 1rem;color:#fff;text-decoration:none;transition:background-color .2s ease;}
.sn-mobile-nav a:hover{background:#374151;}
.sn-mobile-nav a svg{width:18px;height:18px;margin-right:.75rem;color:var(--sn-pink);flex-shrink:0;}
