/* =============================================
   Casino Hydra — 10 Header Styles
   Light + Dark themes · Mobile responsive
   ============================================= */

/* ===== BASE RESET & SHARED ===== */
.hdr *,.hdr *::before,.hdr *::after{box-sizing:border-box}
.hdr{position:sticky;top:0;z-index:70;transition:background .3s}
.hdr .container{max-width:1240px;margin:0 auto;padding:0 20px}
.hdr a{text-decoration:none}

/* Logo */
.hdr__logo{display:flex;align-items:center;gap:10px;font-weight:900;text-decoration:none;white-space:nowrap}
.hdr__logo img{height:44px;width:auto;display:block}
.hdr__logo--text{font-size:20px}

/* Universal dark theme — white text */
.hdr.hdr--dark{color:#fff}
.hdr.hdr--dark .hdr__logo--text{color:#fff}
.hdr.hdr--dark .hdr-searchline input[type="search"]{color:#fff}
.hdr.hdr--dark .hdr-searchline input::placeholder{color:rgba(255,255,255,.45)}
.hdr.hdr--dark .hdr__nav .menu>li>a{color:#fff}
.hdr.hdr--dark .hdr__nav .menu .menu-title{color:#fff}
.hdr.hdr--dark .lang-switch .sep{color:rgba(255,255,255,.2)}
.hdr.hdr--dark .drawer-extras .lang-switch a{color:rgba(255,255,255,.6)}
.hdr.hdr--dark .drawer-extras .lang-switch a.active{color:#fff}

/* Universal light theme — dark text */
.hdr.hdr--light{color:#111}
.hdr.hdr--light .hdr__logo--text{color:#111}
.hdr.hdr--light .hdr-searchline input[type="search"]{color:#111}
.hdr.hdr--light .hdr-searchline input::placeholder{color:rgba(0,0,0,.4)}
.hdr.hdr--light .hdr__nav .menu>li>a{color:#222}
.hdr.hdr--light .hdr__nav .menu .menu-title{color:#222}
.hdr.hdr--light .lang-switch .sep{color:rgba(0,0,0,.15)}
.hdr.hdr--light .drawer-extras .lang-switch a{color:rgba(0,0,0,.5)}
.hdr.hdr--light .drawer-extras .lang-switch a.active{color:#111}

/* Search line (desktop) */
.hdr-searchline{display:flex;align-items:center;gap:8px;width:100%;padding:6px 6px 6px 14px;transition:all .2s;margin:8px 0;align-self:center}
.hdr-searchline input[type="search"]{flex:1;border:0;outline:0;background:transparent;font-size:14px;padding:4px 4px;color:inherit}
.hdr-searchline input::placeholder{opacity:.5}
.hdr-searchline button{display:inline-flex;align-items:center;justify-content:center;width:32px;height:28px;border:none;cursor:pointer;transition:all .2s}
.hdr-searchline button svg{width:18px;height:18px;stroke:currentColor;stroke-width:2;fill:none;stroke-linecap:round}

/* Actions */
.hdr__actions{display:flex;align-items:center;gap:12px}

/* Lang switch */
.lang-switch{display:inline-flex;align-items:center;gap:10px;padding:8px 10px;transition:all .2s}
.lang-switch a{display:inline-flex;align-items:center;gap:6px;text-decoration:none;font-weight:800;font-size:13px;transition:all .2s}
.lang-flag{display:inline-block;width:18px;height:12px;border-radius:2px;box-shadow:0 0 0 1px rgba(0,0,0,.1) inset}
.lang-flag.ua{background:linear-gradient(#1e90ff 0 50%,#ffd500 50% 100%)}
.lang-flag.ru{background:#c8ccd1;background-image:linear-gradient(#c8ccd1,#9aa0a6)}

/* Bonus CTA */
.btn-bonus{display:inline-flex;align-items:center;gap:6px;height:36px;padding:0 16px;border-radius:999px;font-weight:800;font-size:13px;transition:all .2s;white-space:nowrap}
.btn-bonus .emoji{font-size:16px;line-height:1}
@keyframes hdr-glow{0%,100%{box-shadow:0 0 0 rgba(255,77,97,0)}50%{box-shadow:0 0 0 6px rgba(255,77,97,.15),0 6px 18px rgba(255,77,97,.35)}}

/* Mobile bonus icon */
.hdr-bonusicon{display:none;align-items:center;justify-content:center;width:36px;height:36px;border-radius:10px;text-decoration:none;color:#fff}
.hdr-bonusicon .emoji{font-size:18px}
.hdr-bonusicon .icon-img{width:20px;height:20px;object-fit:contain}

/* Burger buttons */
.hdr__burger{display:none;align-items:center;justify-content:center;width:36px;height:36px;border:none;cursor:pointer;transition:all .2s}
.hdr__burger .icon{width:20px;height:20px}
.hdr__burger svg{stroke:currentColor;stroke-width:2;fill:none;stroke-linecap:round}

/* Nav */
.hdr__nav .menu{display:flex;gap:4px;align-items:center;list-style:none;margin:0;padding:3px 0}
.hdr__nav .menu>li>a{position:relative;display:inline-flex;align-items:center;gap:8px;font-weight:700;padding:5px 10px;font-size:14px;transition:all .15s}
.hdr__nav .menu .menu-icon{width:22px;height:22px;display:inline-block}
.hdr__nav .menu .menu-emoji{display:inline-block;width:22px;height:22px;line-height:22px;text-align:center;font-size:18px}
.hdr__nav .menu .badge{margin-left:6px;font-size:10px;font-weight:900;letter-spacing:.2px;padding:2px 8px;border-radius:999px}
@keyframes hdr-badge{0%,100%{transform:translateY(0)}50%{transform:translateY(-2px)}}
.hdr__nav .menu .badge{animation:hdr-badge 1.8s ease-in-out infinite}

/* Drawer extras (mobile) */
.drawer-extras{display:none}
.drawer-close{display:none;position:sticky;top:8px;margin-left:auto;width:36px;height:36px;align-items:center;justify-content:center;font-size:18px;line-height:1;border:none;cursor:pointer}
.drawer-close-text{display:none;width:calc(100% - 40px);margin:14px 20px 20px;height:40px;border-radius:999px;font-weight:800;letter-spacing:.2px;border:none;cursor:pointer}

/* Search modal (mobile) */
.search-modal{position:fixed;inset:0;display:none;z-index:9999}
.search-modal.is-visible{display:block}
.search-modal__backdrop{position:absolute;inset:0;background:rgba(0,0,0,.55);backdrop-filter:blur(2px)}
.search-modal__panel{position:absolute;left:0;right:0;top:var(--hdr-h,76px);padding:12px 16px}
.search-modal__actions{position:absolute;right:16px;top:12px;z-index:10000}
.search-modal__close{width:36px;height:36px;border-radius:8px;display:inline-flex;align-items:center;justify-content:center;border:none;cursor:pointer}
@media(min-width:993px){.search-modal{display:none!important}}


/* =================================================================
   STYLE 1 — Glassmorphism
   ================================================================= */
.hdr-s1{--hdr-h:56px;font-family:'Outfit',system-ui,sans-serif}
.hdr-s1 .hdr__bar{display:grid;grid-template-columns:auto 1fr auto;gap:20px;align-items:center;height:var(--hdr-h)}
.hdr-s1 .hdr-searchline{border-radius:10px}
.hdr-s1 .hdr-searchline button{border-radius:6px}
.hdr-s1 .lang-switch{border-radius:8px}
.hdr-s1 .btn-bonus{border-radius:999px;animation:hdr-glow 2s ease-in-out infinite}
.hdr-s1 .hdr__burger{border-radius:8px}
.hdr-s1 .hdr-bonusicon{border-radius:10px}
.hdr-s1 .hdr__nav .menu>li>a{border-radius:8px}
/* Dark */
.hdr-s1.hdr--dark{background:rgba(20,25,32,.92);backdrop-filter:blur(20px) saturate(1.2);border-bottom:1px solid rgba(255,255,255,.06)}
.hdr-s1.hdr--dark .hdr__logo{color:#fff}
.hdr-s1.hdr--dark .hdr-searchline{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.08);color:#fff}
.hdr-s1.hdr--dark .hdr-searchline button{background:rgba(255,255,255,.08);color:#9fb0bb}
.hdr-s1.hdr--dark .lang-switch{border:1px solid rgba(255,255,255,.08)}
.hdr-s1.hdr--dark .lang-switch a{color:#8891a0}.hdr-s1.hdr--dark .lang-switch a.active{color:#fff}
.hdr-s1.hdr--dark .btn-bonus{background:linear-gradient(135deg,#ff4d61,#ff7a8a);color:#fff;border:1px solid rgba(255,255,255,.12)}
.hdr-s1.hdr--dark .hdr-bonusicon{background:linear-gradient(135deg,#ff4d61,#ff7a8a);border:1px solid rgba(255,255,255,.12)}
.hdr-s1.hdr--dark .hdr__burger{border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.06);color:#fff}
.hdr-s1.hdr--dark .hdr__nav{background:rgba(26,32,40,.95);border-top:1px solid rgba(255,255,255,.06);border-bottom:1px solid rgba(255,255,255,.06)}
.hdr-s1.hdr--dark .hdr__nav .menu>li>a{color:#fff}
.hdr-s1.hdr--dark .hdr__nav .menu>li>a:hover{background:rgba(255,255,255,.06)}
.hdr-s1.hdr--dark .hdr__nav .menu .badge{background:#ff4d61;color:#fff}
.hdr-s1.hdr--dark .search-modal__panel{background:rgba(20,25,32,.98)}
.hdr-s1.hdr--dark .search-modal__close{background:rgba(255,255,255,.08);color:#fff}
.hdr-s1.hdr--dark .drawer-close{background:rgba(255,255,255,.06);color:#fff;border:1px solid rgba(255,255,255,.08);border-radius:8px}
.hdr-s1.hdr--dark .drawer-close-text{background:rgba(255,255,255,.06);color:#fff;border:1px solid rgba(255,255,255,.08)}
.hdr-s1.hdr--dark .drawer-extras{border-bottom:1px solid rgba(255,255,255,.08)}
/* Light */
.hdr-s1.hdr--light{background:rgba(255,255,255,.92);backdrop-filter:blur(20px) saturate(1.2);border-bottom:1px solid rgba(0,0,0,.06)}
.hdr-s1.hdr--light .hdr__logo{color:#111}
.hdr-s1.hdr--light .hdr-searchline{background:rgba(0,0,0,.04);border:1px solid rgba(0,0,0,.08);color:#111}
.hdr-s1.hdr--light .hdr-searchline button{background:rgba(0,0,0,.06);color:#555}
.hdr-s1.hdr--light .lang-switch{border:1px solid rgba(0,0,0,.08)}
.hdr-s1.hdr--light .lang-switch a{color:#888}.hdr-s1.hdr--light .lang-switch a.active{color:#111}
.hdr-s1.hdr--light .btn-bonus{background:linear-gradient(135deg,#ff4d61,#ff7a8a);color:#fff}
.hdr-s1.hdr--light .hdr-bonusicon{background:linear-gradient(135deg,#ff4d61,#ff7a8a)}
.hdr-s1.hdr--light .hdr__burger{border:1px solid rgba(0,0,0,.08);background:rgba(0,0,0,.04);color:#333}
.hdr-s1.hdr--light .hdr__nav{background:#f7f8fa;border-top:1px solid rgba(0,0,0,.06);border-bottom:1px solid rgba(0,0,0,.06)}
.hdr-s1.hdr--light .hdr__nav .menu>li>a{color:#222}
.hdr-s1.hdr--light .hdr__nav .menu>li>a:hover{background:rgba(0,0,0,.04)}
.hdr-s1.hdr--light .hdr__nav .menu .badge{background:#ff4d61;color:#fff}
.hdr-s1.hdr--light .search-modal__panel{background:#fff}
.hdr-s1.hdr--light .search-modal__close{background:#f0f0f0;color:#333}
.hdr-s1.hdr--light .drawer-close{background:#f0f0f0;color:#333;border-radius:8px}
.hdr-s1.hdr--light .drawer-close-text{background:#f0f0f0;color:#333}
.hdr-s1.hdr--light .drawer-extras{border-bottom:1px solid rgba(0,0,0,.06)}


/* =================================================================
   STYLE 2 — Clean Minimal
   ================================================================= */
.hdr-s2{--hdr-h:50px;font-family:'Plus Jakarta Sans',system-ui,sans-serif}
.hdr-s2 .hdr__bar{display:grid;grid-template-columns:auto 1fr auto;gap:24px;align-items:center;height:var(--hdr-h)}
.hdr-s2 .hdr-searchline{border-radius:99px}
.hdr-s2 .hdr-searchline button{border-radius:50%;width:30px;height:30px}
.hdr-s2 .lang-switch{border-radius:8px}
.hdr-s2 .btn-bonus{border-radius:999px}
.hdr-s2 .hdr__burger{border-radius:50%}
.hdr-s2 .hdr-bonusicon{border-radius:50%}
.hdr-s2 .hdr__nav .menu>li>a{border-radius:8px}
/* Dark */
.hdr-s2.hdr--dark{background:#1a1a1f;border-bottom:1px solid rgba(255,255,255,.06)}
.hdr-s2.hdr--dark .hdr__logo{color:#fff}
.hdr-s2.hdr--dark .hdr-searchline{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.08);color:#fff}
.hdr-s2.hdr--dark .hdr-searchline button{background:#fff;color:#111}
.hdr-s2.hdr--dark .lang-switch a{color:#666}.hdr-s2.hdr--dark .lang-switch a.active{color:#fff}
.hdr-s2.hdr--dark .btn-bonus{background:#fff;color:#111}
.hdr-s2.hdr--dark .hdr-bonusicon{background:#fff;color:#111}
.hdr-s2.hdr--dark .hdr__burger{border:1px solid rgba(255,255,255,.1);background:transparent;color:#fff}
.hdr-s2.hdr--dark .hdr__nav{background:#131316;border-bottom:1px solid rgba(255,255,255,.06)}
.hdr-s2.hdr--dark .hdr__nav .menu>li>a{color:#ddd}.hdr-s2.hdr--dark .hdr__nav .menu>li>a:hover{background:rgba(255,255,255,.05)}
.hdr-s2.hdr--dark .hdr__nav .menu .badge{background:#ff4d61;color:#fff}
.hdr-s2.hdr--dark .search-modal__panel{background:#1a1a1f}
.hdr-s2.hdr--dark .search-modal__close,.hdr-s2.hdr--dark .drawer-close{background:rgba(255,255,255,.08);color:#fff;border-radius:50%}
.hdr-s2.hdr--dark .drawer-close-text{background:rgba(255,255,255,.06);color:#fff;border:1px solid rgba(255,255,255,.08)}
.hdr-s2.hdr--dark .drawer-extras{border-bottom:1px solid rgba(255,255,255,.08)}
/* Light */
.hdr-s2.hdr--light{background:#fff;border-bottom:1px solid #eee}
.hdr-s2.hdr--light .hdr__logo{color:#111}
.hdr-s2.hdr--light .hdr-searchline{background:#f4f5f7;border:1px solid #e5e7eb;color:#111}
.hdr-s2.hdr--light .hdr-searchline button{background:#111;color:#fff}
.hdr-s2.hdr--light .lang-switch a{color:#888}.hdr-s2.hdr--light .lang-switch a.active{color:#111}
.hdr-s2.hdr--light .btn-bonus{background:#111;color:#fff}
.hdr-s2.hdr--light .hdr-bonusicon{background:#111;color:#fff}
.hdr-s2.hdr--light .hdr__burger{border:1px solid #e5e7eb;background:#fff;color:#333}
.hdr-s2.hdr--light .hdr__nav{background:#fafafa;border-bottom:1px solid #eee}
.hdr-s2.hdr--light .hdr__nav .menu>li>a{color:#333}.hdr-s2.hdr--light .hdr__nav .menu>li>a:hover{background:rgba(0,0,0,.04)}
.hdr-s2.hdr--light .hdr__nav .menu .badge{background:#ff4d61;color:#fff}
.hdr-s2.hdr--light .search-modal__panel{background:#fff}
.hdr-s2.hdr--light .search-modal__close,.hdr-s2.hdr--light .drawer-close{background:#f0f0f0;color:#333;border-radius:50%}
.hdr-s2.hdr--light .drawer-close-text{background:#f5f5f5;color:#333}
.hdr-s2.hdr--light .drawer-extras{border-bottom:1px solid #eee}


/* =================================================================
   STYLE 3 — Neon Cyberpunk
   ================================================================= */
.hdr-s3{--hdr-h:54px;--neon:#38bdf8;--neon-alt:#f43f5e;font-family:'Unbounded','Outfit',system-ui,sans-serif}
.hdr-s3 .hdr__bar{display:grid;grid-template-columns:auto 1fr auto;gap:20px;align-items:center;height:var(--hdr-h)}
.hdr-s3 .hdr__logo{font-size:18px;letter-spacing:1px}
.hdr-s3 .hdr-searchline{border-radius:4px}.hdr-s3 .hdr-searchline input{font-size:13px}
.hdr-s3 .hdr-searchline button{border-radius:4px;width:32px;height:28px}
.hdr-s3 .btn-bonus{border-radius:4px;text-transform:uppercase;letter-spacing:1.5px;font-size:11px}
.hdr-s3 .hdr__burger{border-radius:4px}
.hdr-s3 .hdr-bonusicon{border-radius:4px}
.hdr-s3 .hdr__nav .menu>li>a{border-radius:4px;font-size:12px;letter-spacing:.5px;text-transform:uppercase}
/* Dark */
.hdr-s3.hdr--dark{background:#0a0a12;border-bottom:1px solid rgba(56,189,248,.15)}
.hdr-s3.hdr--dark .hdr__logo{color:var(--neon);text-shadow:0 0 20px rgba(56,189,248,.4)}
.hdr-s3.hdr--dark .hdr-searchline{background:rgba(56,189,248,.06);border:1px solid rgba(56,189,248,.2);color:#fff}
.hdr-s3.hdr--dark .hdr-searchline button{background:rgba(56,189,248,.15);color:var(--neon)}
.hdr-s3.hdr--dark .lang-switch a{color:#4b5563}.hdr-s3.hdr--dark .lang-switch a.active{color:var(--neon);text-shadow:0 0 10px rgba(56,189,248,.5)}
.hdr-s3.hdr--dark .btn-bonus{background:linear-gradient(135deg,var(--neon-alt),#ec4899);color:#fff;box-shadow:0 0 20px rgba(244,63,94,.3)}
.hdr-s3.hdr--dark .hdr-bonusicon{background:linear-gradient(135deg,var(--neon-alt),#ec4899)}
.hdr-s3.hdr--dark .hdr__burger{border:1px solid rgba(56,189,248,.2);background:rgba(56,189,248,.06);color:var(--neon)}
.hdr-s3.hdr--dark .hdr__nav{background:#08080f;border-bottom:1px solid rgba(56,189,248,.1)}
.hdr-s3.hdr--dark .hdr__nav .menu>li>a{color:#ccc}.hdr-s3.hdr--dark .hdr__nav .menu>li>a:hover{background:rgba(56,189,248,.1);color:var(--neon)}
.hdr-s3.hdr--dark .hdr__nav .menu .badge{background:var(--neon-alt);color:#fff;box-shadow:0 0 10px rgba(244,63,94,.4)}
.hdr-s3.hdr--dark .search-modal__panel{background:#0a0a12;border-bottom:1px solid rgba(56,189,248,.15)}
.hdr-s3.hdr--dark .search-modal__close,.hdr-s3.hdr--dark .drawer-close{background:rgba(56,189,248,.1);color:var(--neon);border-radius:4px}
.hdr-s3.hdr--dark .drawer-close-text{background:rgba(56,189,248,.06);color:var(--neon);border:1px solid rgba(56,189,248,.15)}
.hdr-s3.hdr--dark .drawer-extras{border-bottom:1px solid rgba(56,189,248,.1)}
/* Light */
.hdr-s3.hdr--light{--neon:#0284c7;--neon-alt:#e11d48;background:#f0f9ff;border-bottom:1px solid rgba(2,132,199,.15)}
.hdr-s3.hdr--light .hdr__logo{color:var(--neon)}
.hdr-s3.hdr--light .hdr-searchline{background:rgba(2,132,199,.06);border:1px solid rgba(2,132,199,.15);color:#111}
.hdr-s3.hdr--light .hdr-searchline button{background:rgba(2,132,199,.1);color:var(--neon)}
.hdr-s3.hdr--light .lang-switch a{color:#888}.hdr-s3.hdr--light .lang-switch a.active{color:var(--neon)}
.hdr-s3.hdr--light .btn-bonus{background:linear-gradient(135deg,var(--neon-alt),#f43f5e);color:#fff}
.hdr-s3.hdr--light .hdr-bonusicon{background:linear-gradient(135deg,var(--neon-alt),#f43f5e);color:#fff}
.hdr-s3.hdr--light .hdr__burger{border:1px solid rgba(2,132,199,.15);background:rgba(2,132,199,.06);color:var(--neon)}
.hdr-s3.hdr--light .hdr__nav{background:#e0f2fe;border-bottom:1px solid rgba(2,132,199,.1)}
.hdr-s3.hdr--light .hdr__nav .menu>li>a{color:#333}.hdr-s3.hdr--light .hdr__nav .menu>li>a:hover{background:rgba(2,132,199,.08);color:var(--neon)}
.hdr-s3.hdr--light .hdr__nav .menu .badge{background:var(--neon-alt);color:#fff}
.hdr-s3.hdr--light .search-modal__panel{background:#f0f9ff}
.hdr-s3.hdr--light .search-modal__close,.hdr-s3.hdr--light .drawer-close{background:rgba(2,132,199,.08);color:var(--neon);border-radius:4px}
.hdr-s3.hdr--light .drawer-close-text{background:rgba(2,132,199,.06);color:var(--neon)}
.hdr-s3.hdr--light .drawer-extras{border-bottom:1px solid rgba(2,132,199,.1)}


/* =================================================================
   STYLE 4 — Centered Nav (single row)
   ================================================================= */
.hdr-s4{--hdr-h:54px;font-family:'Sora',system-ui,sans-serif}
.hdr-s4 .hdr__bar{display:flex;align-items:center;gap:12px;height:var(--hdr-h)}
.hdr-s4 .hdr__nav--inline{flex:1;display:flex;justify-content:center}
.hdr-s4 .hdr__nav--inline .menu{padding:0}
.hdr-s4 .hdr-searchline{width:190px;border-radius:10px}
.hdr-s4 .hdr-searchline input{font-size:13px}
.hdr-s4 .hdr-searchline button{border-radius:6px;width:32px;height:30px}
.hdr-s4 .btn-bonus{border-radius:10px}
.hdr-s4 .hdr__burger{border-radius:8px}
.hdr-s4 .hdr-bonusicon{border-radius:10px}
.hdr-s4 .hdr__nav .menu>li>a{border-radius:8px;font-size:13px}
/* Note: Style 4 puts nav INLINE in the bar, .hdr__nav section hidden on desktop */
.hdr-s4 .hdr__nav--separate{display:none}
/* Dark */
.hdr-s4.hdr--dark{background:#141820;border-bottom:1px solid rgba(255,255,255,.06)}
.hdr-s4.hdr--dark .hdr__logo{color:#fff}
.hdr-s4.hdr--dark .hdr-searchline{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.08);color:#fff}
.hdr-s4.hdr--dark .hdr-searchline button{background:rgba(255,255,255,.08);color:#8891a0}
.hdr-s4.hdr--dark .lang-switch a{color:#666}.hdr-s4.hdr--dark .lang-switch a.active{color:#fff}
.hdr-s4.hdr--dark .btn-bonus{background:linear-gradient(135deg,#10b981,#059669);color:#fff;box-shadow:0 4px 16px rgba(16,185,129,.25)}
.hdr-s4.hdr--dark .hdr-bonusicon{background:linear-gradient(135deg,#10b981,#059669)}
.hdr-s4.hdr--dark .hdr__burger{border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.06);color:#fff}
.hdr-s4.hdr--dark .hdr__nav--inline .menu>li>a{color:#fff}.hdr-s4.hdr--dark .hdr__nav--inline .menu>li>a:hover{background:rgba(255,255,255,.06)}
.hdr-s4.hdr--dark .hdr__nav--inline .menu .badge{background:#10b981;color:#fff}
.hdr-s4.hdr--dark .search-modal__panel{background:#141820}
.hdr-s4.hdr--dark .hdr__nav--separate{background:#141820}
.hdr-s4.hdr--dark .hdr__nav--separate .menu>li>a{color:#fff}
.hdr-s4.hdr--dark .hdr__nav--separate .menu>li>a:hover{background:rgba(255,255,255,.06)}
.hdr-s4.hdr--dark .hdr__nav--separate .menu .badge{background:#10b981;color:#fff}
.hdr-s4.hdr--dark .search-modal__close,.hdr-s4.hdr--dark .drawer-close{background:rgba(255,255,255,.06);color:#fff;border-radius:8px}
.hdr-s4.hdr--dark .drawer-close-text{background:rgba(255,255,255,.06);color:#fff;border:1px solid rgba(255,255,255,.08)}
.hdr-s4.hdr--dark .drawer-extras{border-bottom:1px solid rgba(255,255,255,.08)}
/* Light */
.hdr-s4.hdr--light{background:#fff;border-bottom:1px solid #e5e7eb}
.hdr-s4.hdr--light .hdr__logo{color:#111}
.hdr-s4.hdr--light .hdr-searchline{background:#f4f5f7;border:1px solid #e5e7eb;color:#111}
.hdr-s4.hdr--light .hdr-searchline button{background:#e5e7eb;color:#555}
.hdr-s4.hdr--light .lang-switch a{color:#888}.hdr-s4.hdr--light .lang-switch a.active{color:#111}
.hdr-s4.hdr--light .btn-bonus{background:linear-gradient(135deg,#10b981,#059669);color:#fff}
.hdr-s4.hdr--light .hdr-bonusicon{background:linear-gradient(135deg,#10b981,#059669);color:#fff}
.hdr-s4.hdr--light .hdr__burger{border:1px solid #e5e7eb;background:#fff;color:#333}
.hdr-s4.hdr--light .hdr__nav--inline .menu>li>a{color:#333}.hdr-s4.hdr--light .hdr__nav--inline .menu>li>a:hover{background:rgba(0,0,0,.04)}
.hdr-s4.hdr--light .hdr__nav--inline .menu .badge{background:#10b981;color:#fff}
.hdr-s4.hdr--light .search-modal__panel{background:#fff}
.hdr-s4.hdr--light .hdr__nav--separate{background:#fff}
.hdr-s4.hdr--light .hdr__nav--separate .menu>li>a{color:#333}
.hdr-s4.hdr--light .hdr__nav--separate .menu>li>a:hover{background:rgba(0,0,0,.04)}
.hdr-s4.hdr--light .hdr__nav--separate .menu .badge{background:#10b981;color:#fff}
.hdr-s4.hdr--light .search-modal__close,.hdr-s4.hdr--light .drawer-close{background:#f0f0f0;color:#333;border-radius:8px}
.hdr-s4.hdr--light .drawer-close-text{background:#f5f5f5;color:#333}
.hdr-s4.hdr--light .drawer-extras{border-bottom:1px solid #eee}


/* =================================================================
   STYLE 5 — Compact Single-Line
   ================================================================= */
.hdr-s5{--hdr-h:48px;font-family:'Instrument Sans',system-ui,sans-serif}
.hdr-s5 .hdr__bar{display:flex;align-items:center;gap:12px;height:var(--hdr-h)}
.hdr-s5 .hdr__logo{font-size:16px}
.hdr-s5 .hdr__nav--inline{display:flex}
.hdr-s5 .hdr__nav--inline .menu{padding:0;gap:2px}
.hdr-s5 .hdr__nav--inline .menu>li>a{padding:5px 10px;font-size:13px;border-radius:6px}
.hdr-s5 .hdr-searchline{width:170px;border-radius:8px;margin-left:auto}
.hdr-s5 .hdr-searchline input{font-size:13px;padding:4px 4px}
.hdr-s5 .hdr-searchline button{border-radius:6px;width:28px;height:28px}
.hdr-s5 .btn-bonus{border-radius:8px;height:36px;padding:0 14px;font-size:12px}
.hdr-s5 .hdr__burger{border-radius:8px;width:36px;height:36px}
.hdr-s5 .hdr-bonusicon{border-radius:8px;width:36px;height:36px}
.hdr-s5 .hdr__nav--separate{display:none}
/* Dark */
.hdr-s5.hdr--dark{background:#18181b;border-bottom:1px solid rgba(255,255,255,.06)}
.hdr-s5.hdr--dark .hdr__logo{color:#fff}
.hdr-s5.hdr--dark .hdr-searchline{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.08);color:#fff}
.hdr-s5.hdr--dark .hdr-searchline button{background:rgba(255,255,255,.08);color:#71717a}
.hdr-s5.hdr--dark .lang-switch a{color:#71717a;font-size:12px}.hdr-s5.hdr--dark .lang-switch a.active{color:#fff}
.hdr-s5.hdr--dark .btn-bonus{background:#f59e0b;color:#000}
.hdr-s5.hdr--dark .hdr-bonusicon{background:#f59e0b;color:#000}
.hdr-s5.hdr--dark .hdr__burger{border:1px solid rgba(255,255,255,.08);background:transparent;color:#fff}
.hdr-s5.hdr--dark .hdr__nav--inline .menu>li>a{color:#ddd}.hdr-s5.hdr--dark .hdr__nav--inline .menu>li>a:hover{background:rgba(255,255,255,.06)}
.hdr-s5.hdr--dark .hdr__nav--inline .menu .badge{background:#f59e0b;color:#000}
.hdr-s5.hdr--dark .search-modal__panel{background:#18181b}
.hdr-s5.hdr--dark .hdr__nav--separate{background:#18181b}
.hdr-s5.hdr--dark .hdr__nav--separate .menu>li>a{color:#ddd}
.hdr-s5.hdr--dark .hdr__nav--separate .menu>li>a:hover{background:rgba(255,255,255,.06)}
.hdr-s5.hdr--dark .hdr__nav--separate .menu .badge{background:#f59e0b;color:#000}
.hdr-s5.hdr--dark .search-modal__close,.hdr-s5.hdr--dark .drawer-close{background:rgba(255,255,255,.08);color:#fff;border-radius:8px}
.hdr-s5.hdr--dark .drawer-close-text{background:rgba(255,255,255,.06);color:#fff}
.hdr-s5.hdr--dark .drawer-extras{border-bottom:1px solid rgba(255,255,255,.08)}
/* Light */
.hdr-s5.hdr--light{background:#fff;border-bottom:1px solid #e5e7eb}
.hdr-s5.hdr--light .hdr__logo{color:#111}
.hdr-s5.hdr--light .hdr-searchline{background:#f9fafb;border:1px solid #e5e7eb;color:#111}
.hdr-s5.hdr--light .hdr-searchline button{background:#e5e7eb;color:#555}
.hdr-s5.hdr--light .lang-switch a{color:#888;font-size:12px}.hdr-s5.hdr--light .lang-switch a.active{color:#111}
.hdr-s5.hdr--light .btn-bonus{background:#f59e0b;color:#000}
.hdr-s5.hdr--light .hdr-bonusicon{background:#f59e0b;color:#000}
.hdr-s5.hdr--light .hdr__burger{border:1px solid #e5e7eb;background:#fff;color:#333}
.hdr-s5.hdr--light .hdr__nav--inline .menu>li>a{color:#333}.hdr-s5.hdr--light .hdr__nav--inline .menu>li>a:hover{background:#f0f0f0}
.hdr-s5.hdr--light .hdr__nav--inline .menu .badge{background:#f59e0b;color:#000}
.hdr-s5.hdr--light .search-modal__panel{background:#fff}
.hdr-s5.hdr--light .hdr__nav--separate{background:#fff}
.hdr-s5.hdr--light .hdr__nav--separate .menu>li>a{color:#333}
.hdr-s5.hdr--light .hdr__nav--separate .menu>li>a:hover{background:#f0f0f0}
.hdr-s5.hdr--light .hdr__nav--separate .menu .badge{background:#f59e0b;color:#000}
.hdr-s5.hdr--light .search-modal__close,.hdr-s5.hdr--light .drawer-close{background:#f0f0f0;color:#333;border-radius:8px}
.hdr-s5.hdr--light .drawer-close-text{background:#f5f5f5;color:#333}
.hdr-s5.hdr--light .drawer-extras{border-bottom:1px solid #eee}


/* =================================================================
   STYLE 6 — Topbar + Main + Nav (3 levels)
   ================================================================= */
.hdr-s6{--hdr-h:auto;font-family:'Manrope',system-ui,sans-serif}
.hdr-s6 .hdr-topbar{font-size:11px;padding:3px 0}
.hdr-s6 .hdr-topbar .container{display:flex;align-items:center;justify-content:space-between}
.hdr-s6 .hdr-topbar-left{display:flex;align-items:center;gap:16px}
.hdr-s6 .hdr-topbar-right{display:flex;align-items:center;gap:16px}
.hdr-s6 .hdr__bar{display:grid;grid-template-columns:auto 1fr auto;gap:20px;align-items:center;height:52px}
.hdr-s6 .hdr-searchline{border-radius:10px}
.hdr-s6 .hdr-searchline button{border-radius:6px;width:32px;height:28px}
.hdr-s6 .btn-bonus{border-radius:10px}
.hdr-s6 .hdr__burger{border-radius:8px}
.hdr-s6 .hdr-bonusicon{border-radius:10px}
.hdr-s6 .hdr__nav .menu>li>a{border-radius:8px;font-size:13px}
/* Dark */
.hdr-s6.hdr--dark .hdr-topbar{background:#0f172a;border-bottom:1px solid rgba(255,255,255,.06);color:#64748b}
.hdr-s6.hdr--dark .hdr-topbar a{color:#94a3b8;text-decoration:none}
.hdr-s6.hdr--dark .hdr-topbar .lang-switch a{color:#94a3b8}.hdr-s6.hdr--dark .hdr-topbar .lang-switch a.active{color:#fff}
.hdr-s6.hdr--dark .hdr__main{background:#1e293b}
.hdr-s6.hdr--dark .hdr__logo{color:#fff}
.hdr-s6.hdr--dark .hdr-searchline{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.08);color:#fff}
.hdr-s6.hdr--dark .hdr-searchline button{background:#3b82f6;color:#fff}
.hdr-s6.hdr--dark .btn-bonus{background:linear-gradient(135deg,#f97316,#ea580c);color:#fff;box-shadow:0 4px 16px rgba(249,115,22,.3)}
.hdr-s6.hdr--dark .hdr-bonusicon{background:linear-gradient(135deg,#f97316,#ea580c)}
.hdr-s6.hdr--dark .hdr__burger{border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.06);color:#fff}
.hdr-s6.hdr--dark .hdr__nav{background:#0f172a;border-bottom:1px solid rgba(255,255,255,.06)}
.hdr-s6.hdr--dark .hdr__nav .menu>li>a{color:#e2e8f0}.hdr-s6.hdr--dark .hdr__nav .menu>li>a:hover{background:rgba(255,255,255,.06)}
.hdr-s6.hdr--dark .hdr__nav .menu .badge{background:#f97316;color:#fff}
.hdr-s6.hdr--dark .search-modal__panel{background:#1e293b}
.hdr-s6.hdr--dark .search-modal__close,.hdr-s6.hdr--dark .drawer-close{background:rgba(255,255,255,.06);color:#fff;border-radius:8px}
.hdr-s6.hdr--dark .drawer-close-text{background:rgba(255,255,255,.06);color:#fff;border:1px solid rgba(255,255,255,.08)}
.hdr-s6.hdr--dark .drawer-extras{border-bottom:1px solid rgba(255,255,255,.08)}
/* Light */
.hdr-s6.hdr--light .hdr-topbar{background:#f8fafc;border-bottom:1px solid #e2e8f0;color:#64748b}
.hdr-s6.hdr--light .hdr-topbar a{color:#475569;text-decoration:none}
.hdr-s6.hdr--light .hdr-topbar .lang-switch a{color:#94a3b8}.hdr-s6.hdr--light .hdr-topbar .lang-switch a.active{color:#111}
.hdr-s6.hdr--light .hdr__main{background:#fff}
.hdr-s6.hdr--light .hdr__logo{color:#111}
.hdr-s6.hdr--light .hdr-searchline{background:#f1f5f9;border:1px solid #e2e8f0;color:#111}
.hdr-s6.hdr--light .hdr-searchline button{background:#3b82f6;color:#fff}
.hdr-s6.hdr--light .btn-bonus{background:linear-gradient(135deg,#f97316,#ea580c);color:#fff}
.hdr-s6.hdr--light .hdr-bonusicon{background:linear-gradient(135deg,#f97316,#ea580c);color:#fff}
.hdr-s6.hdr--light .hdr__burger{border:1px solid #e2e8f0;background:#fff;color:#333}
.hdr-s6.hdr--light .hdr__nav{background:#f1f5f9;border-bottom:1px solid #e2e8f0}
.hdr-s6.hdr--light .hdr__nav .menu>li>a{color:#334155}.hdr-s6.hdr--light .hdr__nav .menu>li>a:hover{background:rgba(0,0,0,.04)}
.hdr-s6.hdr--light .hdr__nav .menu .badge{background:#f97316;color:#fff}
.hdr-s6.hdr--light .search-modal__panel{background:#fff}
.hdr-s6.hdr--light .search-modal__close,.hdr-s6.hdr--light .drawer-close{background:#f0f0f0;color:#333;border-radius:8px}
.hdr-s6.hdr--light .drawer-close-text{background:#f5f5f5;color:#333}
.hdr-s6.hdr--light .drawer-extras{border-bottom:1px solid #e2e8f0}
@media(max-width:992px){.hdr-s6 .hdr-topbar{display:none}}


/* =================================================================
   STYLE 7 — Brutalist / Raw
   ================================================================= */
.hdr-s7{--hdr-h:54px;font-family:'Archivo',system-ui,sans-serif}
.hdr-s7 .hdr__bar{display:grid;grid-template-columns:auto 1fr auto;gap:20px;align-items:center;height:var(--hdr-h)}
.hdr-s7 .hdr__logo{font-size:22px;text-transform:uppercase;letter-spacing:2px}
.hdr-s7 .hdr-searchline{border-radius:0}
.hdr-s7 .hdr-searchline button{border-radius:0;width:32px;height:28px}
.hdr-s7 .btn-bonus{border-radius:0;text-transform:uppercase;letter-spacing:1px;font-size:12px}
.hdr-s7 .hdr__burger{border-radius:0}
.hdr-s7 .hdr-bonusicon{border-radius:0}
.hdr-s7 .hdr__nav .menu>li>a{border-radius:0;text-transform:uppercase;font-size:13px;font-weight:900;letter-spacing:.5px}
/* Dark */
.hdr-s7.hdr--dark{background:#000;border-bottom:3px solid #fff}
.hdr-s7.hdr--dark .hdr__logo{color:#fff}
.hdr-s7.hdr--dark .hdr-searchline{background:transparent;border:2px solid #fff;color:#fff}
.hdr-s7.hdr--dark .hdr-searchline button{background:#fff;color:#000}
.hdr-s7.hdr--dark .lang-switch a{color:#666;text-transform:uppercase;letter-spacing:1px;font-size:12px}.hdr-s7.hdr--dark .lang-switch a.active{color:#fff}
.hdr-s7.hdr--dark .btn-bonus{background:#fff;color:#000}
.hdr-s7.hdr--dark .hdr-bonusicon{background:#fff;color:#000}
.hdr-s7.hdr--dark .hdr__burger{border:2px solid #fff;background:transparent;color:#fff}
.hdr-s7.hdr--dark .hdr__nav{background:#111;border-bottom:3px solid #fff}
.hdr-s7.hdr--dark .hdr__nav .menu>li>a{color:#fff}.hdr-s7.hdr--dark .hdr__nav .menu>li>a:hover{background:#fff;color:#000}
.hdr-s7.hdr--dark .hdr__nav .menu .badge{background:#ff0;color:#000;border-radius:0}
.hdr-s7.hdr--dark .search-modal__panel{background:#000;border-bottom:3px solid #fff}
.hdr-s7.hdr--dark .search-modal__close,.hdr-s7.hdr--dark .drawer-close{background:transparent;border:2px solid #fff;color:#fff;border-radius:0}
.hdr-s7.hdr--dark .drawer-close-text{background:transparent;border:2px solid #fff;color:#fff;border-radius:0}
.hdr-s7.hdr--dark .drawer-extras{border-bottom:2px solid #fff}
/* Light */
.hdr-s7.hdr--light{background:#fff;border-bottom:3px solid #000}
.hdr-s7.hdr--light .hdr__logo{color:#000}
.hdr-s7.hdr--light .hdr-searchline{background:transparent;border:2px solid #000;color:#000}
.hdr-s7.hdr--light .hdr-searchline button{background:#000;color:#fff}
.hdr-s7.hdr--light .lang-switch a{color:#999;text-transform:uppercase;letter-spacing:1px;font-size:12px}.hdr-s7.hdr--light .lang-switch a.active{color:#000}
.hdr-s7.hdr--light .btn-bonus{background:#000;color:#fff}
.hdr-s7.hdr--light .hdr-bonusicon{background:#000;color:#fff}
.hdr-s7.hdr--light .hdr__burger{border:2px solid #000;background:transparent;color:#000}
.hdr-s7.hdr--light .hdr__nav{background:#f5f5f5;border-bottom:3px solid #000}
.hdr-s7.hdr--light .hdr__nav .menu>li>a{color:#000}.hdr-s7.hdr--light .hdr__nav .menu>li>a:hover{background:#000;color:#fff}
.hdr-s7.hdr--light .hdr__nav .menu .badge{background:#ff0;color:#000;border-radius:0}
.hdr-s7.hdr--light .search-modal__panel{background:#fff;border-bottom:3px solid #000}
.hdr-s7.hdr--light .search-modal__close,.hdr-s7.hdr--light .drawer-close{background:transparent;border:2px solid #000;color:#000;border-radius:0}
.hdr-s7.hdr--light .drawer-close-text{background:transparent;border:2px solid #000;color:#000;border-radius:0}
.hdr-s7.hdr--light .drawer-extras{border-bottom:2px solid #000}


/* =================================================================
   STYLE 8 — Rounded / Soft (floating bar)
   ================================================================= */
.hdr-s8{--hdr-h:auto;font-family:'DM Sans',system-ui,sans-serif}
.hdr-s8 .hdr-s8-wrap{padding:8px 16px 0}
.hdr-s8 .hdr__bar{display:flex;align-items:center;gap:14px;height:48px;border-radius:16px;padding:0 16px}
.hdr-s8 .hdr-searchline{border-radius:14px;flex:1}
.hdr-s8 .hdr-searchline input{font-size:13px}
.hdr-s8 .hdr-searchline button{border-radius:10px;width:32px;height:30px}
.hdr-s8 .btn-bonus{border-radius:14px}
.hdr-s8 .hdr__burger{border-radius:12px}
.hdr-s8 .hdr-bonusicon{border-radius:14px}
.hdr-s8 .hdr__nav{padding:4px 16px}
.hdr-s8 .hdr__nav .menu>li>a{border-radius:12px;font-size:13px}
/* Dark */
.hdr-s8.hdr--dark{background:linear-gradient(180deg,#1a1a2e 0%,#16213e 100%)}
.hdr-s8.hdr--dark .hdr__bar{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.06)}
.hdr-s8.hdr--dark .hdr__logo{color:#fff}
.hdr-s8.hdr--dark .hdr-searchline{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.06);color:#fff}
.hdr-s8.hdr--dark .hdr-searchline button{background:rgba(255,255,255,.08);color:#818cf8}
.hdr-s8.hdr--dark .lang-switch a{color:#6b7280}.hdr-s8.hdr--dark .lang-switch a.active{color:#fff}
.hdr-s8.hdr--dark .btn-bonus{background:linear-gradient(135deg,#818cf8,#6366f1);color:#fff;box-shadow:0 4px 16px rgba(129,140,248,.3)}
.hdr-s8.hdr--dark .hdr-bonusicon{background:linear-gradient(135deg,#818cf8,#6366f1)}
.hdr-s8.hdr--dark .hdr__burger{border:1px solid rgba(255,255,255,.06);background:rgba(255,255,255,.06);color:#fff}
.hdr-s8.hdr--dark .hdr__nav .menu>li>a{color:#ddd}.hdr-s8.hdr--dark .hdr__nav .menu>li>a:hover{background:rgba(129,140,248,.1)}
.hdr-s8.hdr--dark .hdr__nav .menu .badge{background:#818cf8;color:#fff;border-radius:10px}
.hdr-s8.hdr--dark .search-modal__panel{background:#1a1a2e}
.hdr-s8.hdr--dark .search-modal__close,.hdr-s8.hdr--dark .drawer-close{background:rgba(255,255,255,.06);color:#fff;border-radius:12px}
.hdr-s8.hdr--dark .drawer-close-text{background:rgba(255,255,255,.06);color:#fff;border:1px solid rgba(255,255,255,.06);border-radius:999px}
.hdr-s8.hdr--dark .drawer-extras{border-bottom:1px solid rgba(255,255,255,.06)}
/* Light */
.hdr-s8.hdr--light{background:linear-gradient(180deg,#f0f4ff 0%,#e8edff 100%)}
.hdr-s8.hdr--light .hdr__bar{background:rgba(255,255,255,.8);border:1px solid rgba(99,102,241,.1)}
.hdr-s8.hdr--light .hdr__logo{color:#111}
.hdr-s8.hdr--light .hdr-searchline{background:rgba(99,102,241,.06);border:1px solid rgba(99,102,241,.1);color:#111}
.hdr-s8.hdr--light .hdr-searchline button{background:rgba(99,102,241,.08);color:#6366f1}
.hdr-s8.hdr--light .lang-switch a{color:#888}.hdr-s8.hdr--light .lang-switch a.active{color:#111}
.hdr-s8.hdr--light .btn-bonus{background:linear-gradient(135deg,#818cf8,#6366f1);color:#fff}
.hdr-s8.hdr--light .hdr-bonusicon{background:linear-gradient(135deg,#818cf8,#6366f1);color:#fff}
.hdr-s8.hdr--light .hdr__burger{border:1px solid rgba(99,102,241,.1);background:#fff;color:#333}
.hdr-s8.hdr--light .hdr__nav .menu>li>a{color:#333}.hdr-s8.hdr--light .hdr__nav .menu>li>a:hover{background:rgba(99,102,241,.08)}
.hdr-s8.hdr--light .hdr__nav .menu .badge{background:#6366f1;color:#fff;border-radius:10px}
.hdr-s8.hdr--light .search-modal__panel{background:#f0f4ff}
.hdr-s8.hdr--light .search-modal__close,.hdr-s8.hdr--light .drawer-close{background:rgba(99,102,241,.08);color:#6366f1;border-radius:12px}
.hdr-s8.hdr--light .drawer-close-text{background:#fff;color:#333;border-radius:999px}
.hdr-s8.hdr--light .drawer-extras{border-bottom:1px solid rgba(99,102,241,.1)}
@media(max-width:992px){.hdr-s8 .hdr-s8-wrap{padding:8px 10px 0}.hdr-s8 .hdr__bar{border-radius:14px;padding:0 14px}}


/* =================================================================
   STYLE 9 — Luxury / Art Deco (gold)
   ================================================================= */
.hdr-s9{--hdr-h:56px;--gold:#d4af37;--gold-dark:#b8941e;font-family:'Bricolage Grotesque',system-ui,sans-serif}
.hdr-s9 .hdr__bar{display:grid;grid-template-columns:auto 1fr auto;gap:24px;align-items:center;height:var(--hdr-h)}
.hdr-s9 .hdr__logo{font-size:20px}
.hdr-s9 .hdr-searchline{border-radius:8px}
.hdr-s9 .hdr-searchline button{border-radius:6px;width:32px;height:28px}
.hdr-s9 .btn-bonus{border-radius:8px}
.hdr-s9 .hdr__burger{border-radius:8px}
.hdr-s9 .hdr-bonusicon{border-radius:8px}
.hdr-s9 .hdr__nav .menu>li>a{border-radius:8px;font-size:13px}
/* Dark */
.hdr-s9.hdr--dark{background:linear-gradient(180deg,#1a1408 0%,#0f0c04 100%);border-bottom:1px solid rgba(212,175,55,.2)}
.hdr-s9.hdr--dark .hdr__logo{color:var(--gold)}
.hdr-s9.hdr--dark .hdr-searchline{background:rgba(212,175,55,.06);border:1px solid rgba(212,175,55,.15);color:var(--gold)}
.hdr-s9.hdr--dark .hdr-searchline input::placeholder{color:rgba(212,175,55,.35)}
.hdr-s9.hdr--dark .hdr-searchline button{background:rgba(212,175,55,.15);color:var(--gold)}
.hdr-s9.hdr--dark .lang-switch a{color:#8b7335}.hdr-s9.hdr--dark .lang-switch a.active{color:var(--gold)}
.hdr-s9.hdr--dark .btn-bonus{background:linear-gradient(135deg,var(--gold),var(--gold-dark));color:#000;box-shadow:0 4px 20px rgba(212,175,55,.25)}
.hdr-s9.hdr--dark .hdr-bonusicon{background:linear-gradient(135deg,var(--gold),var(--gold-dark));color:#000}
.hdr-s9.hdr--dark .hdr__burger{border:1px solid rgba(212,175,55,.2);background:rgba(212,175,55,.06);color:var(--gold)}
.hdr-s9.hdr--dark .hdr__nav{background:rgba(15,12,4,.9);border-top:1px solid rgba(212,175,55,.08);border-bottom:1px solid rgba(212,175,55,.12)}
.hdr-s9.hdr--dark .hdr__nav .menu>li>a{color:#c8a832}.hdr-s9.hdr--dark .hdr__nav .menu>li>a:hover{background:rgba(212,175,55,.1)}
.hdr-s9.hdr--dark .hdr__nav .menu .badge{background:var(--gold);color:#000}
.hdr-s9.hdr--dark .search-modal__panel{background:#1a1408}
.hdr-s9.hdr--dark .search-modal__close,.hdr-s9.hdr--dark .drawer-close{background:rgba(212,175,55,.1);color:var(--gold);border-radius:8px}
.hdr-s9.hdr--dark .drawer-close-text{background:rgba(212,175,55,.06);color:var(--gold);border:1px solid rgba(212,175,55,.15)}
.hdr-s9.hdr--dark .drawer-extras{border-bottom:1px solid rgba(212,175,55,.12)}
/* Light */
.hdr-s9.hdr--light{background:linear-gradient(180deg,#fffcf0 0%,#fff8e1 100%);border-bottom:1px solid rgba(180,140,20,.15)}
.hdr-s9.hdr--light .hdr__logo{color:#8b6914}
.hdr-s9.hdr--light .hdr-searchline{background:rgba(180,140,20,.06);border:1px solid rgba(180,140,20,.12);color:#5a4510}
.hdr-s9.hdr--light .hdr-searchline input::placeholder{color:rgba(90,69,16,.3)}
.hdr-s9.hdr--light .hdr-searchline button{background:rgba(180,140,20,.1);color:#8b6914}
.hdr-s9.hdr--light .lang-switch a{color:#b8941e}.hdr-s9.hdr--light .lang-switch a.active{color:#8b6914}
.hdr-s9.hdr--light .btn-bonus{background:linear-gradient(135deg,#d4af37,#b8941e);color:#000}
.hdr-s9.hdr--light .hdr-bonusicon{background:linear-gradient(135deg,#d4af37,#b8941e);color:#000}
.hdr-s9.hdr--light .hdr__burger{border:1px solid rgba(180,140,20,.15);background:rgba(180,140,20,.06);color:#8b6914}
.hdr-s9.hdr--light .hdr__nav{background:#fff8e1;border-top:1px solid rgba(180,140,20,.08);border-bottom:1px solid rgba(180,140,20,.1)}
.hdr-s9.hdr--light .hdr__nav .menu>li>a{color:#5a4510}.hdr-s9.hdr--light .hdr__nav .menu>li>a:hover{background:rgba(180,140,20,.08)}
.hdr-s9.hdr--light .hdr__nav .menu .badge{background:#d4af37;color:#000}
.hdr-s9.hdr--light .search-modal__panel{background:#fffcf0}
.hdr-s9.hdr--light .search-modal__close,.hdr-s9.hdr--light .drawer-close{background:rgba(180,140,20,.08);color:#8b6914;border-radius:8px}
.hdr-s9.hdr--light .drawer-close-text{background:rgba(180,140,20,.06);color:#8b6914}
.hdr-s9.hdr--light .drawer-extras{border-bottom:1px solid rgba(180,140,20,.1)}


/* =================================================================
   STYLE 10 — Aurora / Gradient Mesh
   ================================================================= */
.hdr-s10{--hdr-h:54px;font-family:'Space Grotesk',system-ui,sans-serif}
.hdr-s10 .hdr__bar{display:grid;grid-template-columns:auto 1fr auto;gap:20px;align-items:center;height:var(--hdr-h);position:relative;z-index:1}
.hdr-s10 .hdr__logo{font-size:18px}
.hdr-s10 .hdr-searchline{border-radius:12px}
.hdr-s10 .hdr-searchline button{border-radius:8px;width:32px;height:28px}
.hdr-s10 .btn-bonus{border-radius:12px;border:1px solid rgba(255,255,255,.1)}
.hdr-s10 .hdr__burger{border-radius:10px}
.hdr-s10 .hdr-bonusicon{border-radius:12px}
.hdr-s10 .hdr__nav{position:relative;z-index:1}
.hdr-s10 .hdr__nav .menu>li>a{border-radius:10px;font-size:13px}
/* Dark */
.hdr-s10.hdr--dark{background:#0c0c1a;position:relative;overflow:hidden}
.hdr-s10.hdr--dark::before{content:'';position:absolute;top:-50%;left:-20%;width:60%;height:200%;background:radial-gradient(circle,rgba(139,92,246,.12) 0%,transparent 70%);pointer-events:none}
.hdr-s10.hdr--dark::after{content:'';position:absolute;top:-50%;right:-20%;width:50%;height:200%;background:radial-gradient(circle,rgba(59,130,246,.08) 0%,transparent 70%);pointer-events:none}
.hdr-s10.hdr--dark .hdr__logo{color:#fff;background:linear-gradient(135deg,#8b5cf6,#3b82f6);-webkit-background-clip:text;-webkit-text-fill-color:transparent}
.hdr-s10.hdr--dark .hdr__logo img{-webkit-text-fill-color:initial}
.hdr-s10.hdr--dark .hdr-searchline{background:rgba(139,92,246,.08);border:1px solid rgba(139,92,246,.15);color:#fff}
.hdr-s10.hdr--dark .hdr-searchline button{background:linear-gradient(135deg,rgba(139,92,246,.2),rgba(59,130,246,.2));color:#a78bfa}
.hdr-s10.hdr--dark .lang-switch a{color:#6b7280}.hdr-s10.hdr--dark .lang-switch a.active{color:#a78bfa}
.hdr-s10.hdr--dark .btn-bonus{background:linear-gradient(135deg,#8b5cf6,#6366f1,#3b82f6);color:#fff;box-shadow:0 4px 20px rgba(139,92,246,.3)}
.hdr-s10.hdr--dark .hdr-bonusicon{background:linear-gradient(135deg,#8b5cf6,#3b82f6)}
.hdr-s10.hdr--dark .hdr__burger{border:1px solid rgba(139,92,246,.15);background:rgba(139,92,246,.06);color:#a78bfa}
.hdr-s10.hdr--dark .hdr__nav{background:rgba(12,12,26,.95);border-top:1px solid rgba(139,92,246,.08);border-bottom:1px solid rgba(139,92,246,.08)}
.hdr-s10.hdr--dark .hdr__nav .menu>li>a{color:#ddd}.hdr-s10.hdr--dark .hdr__nav .menu>li>a:hover{background:rgba(139,92,246,.1)}
.hdr-s10.hdr--dark .hdr__nav .menu .badge{background:linear-gradient(135deg,#8b5cf6,#3b82f6);color:#fff}
.hdr-s10.hdr--dark .search-modal__panel{background:#0c0c1a}
.hdr-s10.hdr--dark .search-modal__close,.hdr-s10.hdr--dark .drawer-close{background:rgba(139,92,246,.1);color:#a78bfa;border-radius:10px}
.hdr-s10.hdr--dark .drawer-close-text{background:rgba(139,92,246,.06);color:#a78bfa;border:1px solid rgba(139,92,246,.12)}
.hdr-s10.hdr--dark .drawer-extras{border-bottom:1px solid rgba(139,92,246,.1)}
/* Light */
.hdr-s10.hdr--light{background:#f5f3ff;position:relative;overflow:hidden}
.hdr-s10.hdr--light::before{content:'';position:absolute;top:-50%;left:-20%;width:60%;height:200%;background:radial-gradient(circle,rgba(139,92,246,.08) 0%,transparent 70%);pointer-events:none}
.hdr-s10.hdr--light::after{content:'';position:absolute;top:-50%;right:-20%;width:50%;height:200%;background:radial-gradient(circle,rgba(59,130,246,.06) 0%,transparent 70%);pointer-events:none}
.hdr-s10.hdr--light .hdr__logo{color:#111;background:linear-gradient(135deg,#7c3aed,#2563eb);-webkit-background-clip:text;-webkit-text-fill-color:transparent}
.hdr-s10.hdr--light .hdr__logo img{-webkit-text-fill-color:initial}
.hdr-s10.hdr--light .hdr-searchline{background:rgba(124,58,237,.06);border:1px solid rgba(124,58,237,.1);color:#111}
.hdr-s10.hdr--light .hdr-searchline button{background:rgba(124,58,237,.1);color:#7c3aed}
.hdr-s10.hdr--light .lang-switch a{color:#888}.hdr-s10.hdr--light .lang-switch a.active{color:#7c3aed}
.hdr-s10.hdr--light .btn-bonus{background:linear-gradient(135deg,#8b5cf6,#3b82f6);color:#fff}
.hdr-s10.hdr--light .hdr-bonusicon{background:linear-gradient(135deg,#8b5cf6,#3b82f6);color:#fff}
.hdr-s10.hdr--light .hdr__burger{border:1px solid rgba(124,58,237,.1);background:rgba(124,58,237,.04);color:#7c3aed}
.hdr-s10.hdr--light .hdr__nav{background:#ede9fe;border-top:1px solid rgba(124,58,237,.06);border-bottom:1px solid rgba(124,58,237,.06)}
.hdr-s10.hdr--light .hdr__nav .menu>li>a{color:#333}.hdr-s10.hdr--light .hdr__nav .menu>li>a:hover{background:rgba(124,58,237,.08)}
.hdr-s10.hdr--light .hdr__nav .menu .badge{background:linear-gradient(135deg,#7c3aed,#2563eb);color:#fff}
.hdr-s10.hdr--light .search-modal__panel{background:#f5f3ff}
.hdr-s10.hdr--light .search-modal__close,.hdr-s10.hdr--light .drawer-close{background:rgba(124,58,237,.06);color:#7c3aed;border-radius:10px}
.hdr-s10.hdr--light .drawer-close-text{background:#fff;color:#7c3aed}
.hdr-s10.hdr--light .drawer-extras{border-bottom:1px solid rgba(124,58,237,.08)}


/* =================================================================
   MOBILE RESPONSIVE — ALL STYLES
   ================================================================= */
@media(max-width:992px){
  .hdr .hdr__logo img{height:36px}
  
  /* Styles 1-3, 6-10: Two-row layout → single row mobile */
  .hdr-s1 .hdr__bar,.hdr-s2 .hdr__bar,.hdr-s3 .hdr__bar,
  .hdr-s6 .hdr__bar,.hdr-s7 .hdr__bar,.hdr-s9 .hdr__bar,.hdr-s10 .hdr__bar{
    grid-template-columns:1fr auto auto auto;gap:8px
  }
  /* Styles 4-5: Already single row → adjust */
  .hdr-s4 .hdr__bar,.hdr-s5 .hdr__bar{flex-wrap:nowrap;gap:8px}
  .hdr-s4 .hdr__nav--inline,.hdr-s5 .hdr__nav--inline{display:none}
  /* Show separate nav drawer on mobile for styles 4,5 */
  .hdr-s4 .hdr__nav--separate,.hdr-s5 .hdr__nav--separate{display:block}
  /* Style 8: Floating bar shrink */
  .hdr-s8 .hdr__bar{gap:8px}
  
  /* Hide desktop elements */
  .hdr .hdr-searchline{display:none}
  .hdr .hdr__actions{display:none}
  .hdr .lang-switch.desktop-only{display:none}
  
  /* Show mobile elements */
  .hdr .hdr-bonusicon{display:inline-flex}
  .hdr .hdr__burger{display:inline-flex}
  
  /* Nav → drawer */
  .hdr .hdr__nav:not(.hdr__nav--inline){
    position:fixed;left:0;right:0;top:0;bottom:0;overflow:auto;
    transform:translateY(-6px);opacity:0;pointer-events:none;
    transition:opacity .18s ease,transform .18s ease;
    z-index:999
  }
  .hdr .hdr__nav:not(.hdr__nav--inline).is-open{opacity:1;pointer-events:auto;transform:none}
  .hdr .hdr__nav .menu{flex-direction:column;padding:14px 0}
  .hdr .hdr__nav .menu>li>a{padding:10px 14px;width:100%}
  
  .hdr .drawer-extras{display:block;padding:12px 20px}
  .hdr .drawer-close{display:inline-flex}
  .hdr .drawer-close-text{display:block}
  
  /* Search modal */
  .hdr .search-modal__panel .hdr-searchline{display:flex !important;padding-right:66px !important}
}