/* ══════════════════════════════════════════════════════════════
   SPIRIT CUSTOM STORE — MASTER RESPONSIVE LAYER (V22)
   This file loads LAST and is the single source of truth for
   responsive behaviour. It overrides any earlier conflicting rules.
   Breakpoints: 320 · 360 · 375 · 414 · 480 · 576 · 768 · 992 · 1200 · 1400+
   ══════════════════════════════════════════════════════════════ */

/* ---------- 0. GLOBAL SAFETY ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { overflow-x: hidden; }
img, video, svg { max-width: 100%; height: auto; }
.container, .container-xxl, .container-fluid { width: 100%; margin-inline: auto; }

/* Kill any accidental horizontal overflow */
section, .row, .container, .container-xxl { max-width: 100%; }

/* ---------- 1. CONTAINER WIDTHS ---------- */
.container-xxl { padding-inline: 20px; }
@media (min-width: 1400px) { .container-xxl { max-width: 1320px; } }
@media (min-width: 1600px) { .container-xxl { max-width: 1440px; } }
@media (min-width: 1920px) { .container-xxl { max-width: 1600px; } }
@media (max-width: 575px)  { .container-xxl { padding-inline: 16px; } }
@media (max-width: 360px)  { .container-xxl { padding-inline: 13px; } }

/* ---------- 2. SECTION SPACING ---------- */
.section        { padding: 88px 0; }
.section-tight  { padding: 52px 0; }
@media (max-width: 991px) { .section { padding: 64px 0; } .section-tight { padding: 40px 0; } }
@media (max-width: 575px) { .section { padding: 48px 0; } .section-tight { padding: 32px 0; } }

/* ---------- 3. TOPBAR ---------- */
@media (max-width: 767px) { .topbar { display: none !important; } }

/* ---------- 4. NAVBAR ---------- */
.navbar-spirit .container-xxl {
  display: flex; align-items: center; justify-content: space-between;
  flex-wrap: nowrap; gap: 12px; padding-block: 8px;
}
.nav-logo-img  { height: 50px; width: auto; max-width: 210px; object-fit: contain; }
.navbar-toggler {
  display: none; flex-direction: column; gap: 5px;
  border: 2px solid var(--gold); border-radius: 9px;
  padding: 7px 10px; background: transparent; cursor: pointer;
}
.navbar-toggler-icon {
  width: 22px; height: 2px; background: var(--gold);
  border-radius: 2px; display: block; transition: .3s;
}

/* Desktop nav: visible ≥992px */
@media (min-width: 992px) {
  #mainNav { display: flex !important; }
  .navbar-nav { flex-direction: row; align-items: center; }
}

/* Mobile nav: hamburger < 992px */
@media (max-width: 991px) {
  .navbar-toggler { display: flex; }
  #mainNav {
    display: none; width: 100%; flex-basis: 100%;
    background: #0B1526; border-radius: 12px;
    margin-top: 10px; padding: 8px 6px 12px;
    max-height: 78vh; overflow-y: auto;
  }
  #mainNav.show { display: block !important; }
  .navbar-nav { flex-direction: column; gap: 0; width: 100%; }
  .nav-item { width: 100%; border-bottom: 1px solid rgba(255,255,255,.07); }
  .nav-item:last-child { border-bottom: none; }
  .nav-link { padding: 13px 14px !important; font-size: .98rem; }
  .dropdown-menu {
    position: static !important; transform: none !important;
    box-shadow: none; border: none; background: rgba(255,255,255,.04);
    border-radius: 8px; margin: 2px 10px 8px; padding: 4px 0;
    display: none;
  }
  .dropdown-menu.show { display: block; }
  .dropdown-item { padding: 10px 16px; font-size: .9rem; }
  .nav-cta-wrap { width: 100%; padding: 12px 14px 4px; }
  .nav-cta-wrap .btn-spirit { width: 100%; justify-content: center; }
}
@media (max-width: 575px) { .nav-logo-img { height: 40px; } }
@media (max-width: 360px) { .nav-logo-img { height: 36px; } }

/* ---------- 5. HERO ---------- */
.hero { position: relative; padding: 92px 0 84px; }
.hero h1 { font-size: clamp(2rem, 4.4vw, 3.6rem); line-height: 1.06; }
.hero p.lead-txt { font-size: 1.05rem; max-width: 560px; }

@media (max-width: 991px) {
  .hero { padding: 72px 0 56px; text-align: center; }
  .hero-head, .hero .hero-copy { align-items: center; }
  .hero h1 { font-size: clamp(1.9rem, 6vw, 3rem); }
  .hero p.lead-txt { margin-inline: auto; font-size: .98rem; }
  .hero .d-flex.gap-3 { justify-content: center; }
  .hero-badge { margin-inline: auto; }
  .hero-stats { justify-content: center; }
  .hero-slide-box, .hsb-frame { margin: 30px auto 0; max-width: 460px; }
  .price-strip-wrap { margin-top: 26px; }
}
@media (max-width: 575px) {
  .hero { padding: 60px 0 42px; }
  .hero h1 { font-size: clamp(1.6rem, 8vw, 2.3rem); }
  .hero p.lead-txt { font-size: .92rem; }
  .hero .d-flex.gap-3 { flex-direction: column; gap: 10px !important; width: 100%; }
  .hero .btn-spirit, .hero .btn-outline-light-spirit { width: 100%; justify-content: center; }
  .hero-stats { gap: 18px; margin-top: 22px; }
  .hero-stat b { font-size: 1.25rem; }
}
@media (max-width: 360px) { .hero h1 { font-size: 1.45rem; } }

/* ---------- 6. SECTION TITLES ---------- */
.section-title { font-size: clamp(1.7rem, 3.4vw, 2.6rem); line-height: 1.12; }
.section-lead  { font-size: 1rem; }
@media (max-width: 767px) { .section-title { font-size: clamp(1.5rem, 6vw, 2rem); } }
@media (max-width: 575px) {
  .section-title { font-size: clamp(1.35rem, 7vw, 1.75rem); }
  .section-lead  { font-size: .92rem; }
}

/* ---------- 7. TRUST BAR (4 cards) ---------- */
.trustbar { margin-top: -58px; position: relative; z-index: 5; }
.trust-card { height: 100%; display: flex; gap: 14px; align-items: flex-start; }
@media (max-width: 991px) { .trustbar { margin-top: -40px; } }
@media (max-width: 767px) { .trustbar { margin-top: 0; padding-top: 40px; } }

/* ---------- 8. CATALOGUE / PRODUCT CARDS ---------- */
.cat-grid, .catalogue .row { row-gap: 24px; }
.cat-card { height: 100%; display: flex; flex-direction: column; }
.cat-card .cc-body { flex: 1 1 auto; display: flex; flex-direction: column; }
.cat-card .img-wrap { aspect-ratio: 4/3; overflow: hidden; }
.cat-card .img-wrap img { width: 100%; height: 100%; object-fit: cover; }
@media (max-width: 575px) {
  .cat-card .img-wrap { aspect-ratio: 16/10; }
}

/* ---------- 9. PROCESS / HOW IT WORKS (4 steps) ---------- */
.process-step { height: 100%; }
@media (max-width: 991px) { .proc-head { text-align: center; } .proc-head .btn-ink { margin-top: 14px; } }

/* ---------- 10. COUNTERS ---------- */
@media (max-width: 767px) { .counter-item { text-align: center; margin-bottom: 24px; } }

/* ---------- 11. WHY CHOOSE (2-col list) ---------- */
@media (max-width: 767px) {
  .why-item { border-left: 3px solid var(--gold); padding-left: 14px; margin-bottom: 22px; }
}

/* ---------- 12. INDUSTRIES / chips ---------- */
.ind-chips { display: flex; flex-wrap: wrap; gap: 10px; }
@media (max-width: 991px) { .industries .row { row-gap: 30px; } .ind-copy { text-align: center; } .ind-chips { justify-content: center; } .ind-copy .btn-spirit { margin-inline: auto; } }
@media (max-width: 575px) { .ind-chips { gap: 7px; } .ind-chip { font-size: .78rem; padding: 8px 13px; } }

/* ---------- 13. BACKINGS (6 numbered) ---------- */
.backing-card { height: 100%; }
@media (max-width: 575px) { .backing-card { padding: 18px 16px; } }

/* ---------- 14. MATERIALS / WATERPROOF / COST split rows ---------- */
@media (max-width: 991px) {
  .split-row, .materials .row, .waterproof .row, .cost .row { row-gap: 30px; }
  .split-media { margin-bottom: 8px; }
  .split-copy { text-align: center; }
  .split-copy .btn-spirit, .split-copy .btn-ink { margin-inline: auto; }
}

/* ---------- 15. ORDER SIZES (2 cards) ---------- */
@media (max-width: 767px) { .order-card { margin-bottom: 20px; } }

/* ---------- 16. BLOG (3 cards) ---------- */
.blog-card { height: 100%; display: flex; flex-direction: column; }
.blog-card .bc-img { aspect-ratio: 3/2; overflow: hidden; }
.blog-card .bc-img img { width: 100%; height: 100%; object-fit: cover; }
.blog-card .bc-body { flex: 1 1 auto; }
@media (max-width: 991px) { .blog .row { row-gap: 26px; } .blog-head { text-align: center; } .blog-head .btn-ink { margin-top: 12px; } }

/* ---------- 17. TESTIMONIALS ---------- */
@media (max-width: 575px) { .t-slide, .testi-card { flex: 0 0 88vw; } }

/* ---------- 18. FAQ ---------- */
@media (max-width: 991px) {
  .faq .row { row-gap: 26px; }
  .faq-media { max-width: 460px; margin-inline: auto; }
}
.accordion-button { font-size: .95rem; }
@media (max-width: 575px) { .accordion-button { font-size: .88rem; padding: 14px 16px; } .accordion-body { font-size: .86rem; } }

/* ---------- 19. CTA BAND ---------- */
@media (max-width: 767px) {
  .cta-band { text-align: center; padding: 40px 20px; }
  .cta-band .d-flex { flex-direction: column; gap: 12px !important; }
  .cta-band .btn-spirit, .cta-band .btn-outline-light-spirit { width: 100%; justify-content: center; }
}

/* ---------- 20. PAYMENT MARQUEE ---------- */
@media (max-width: 575px) { .pay-card { flex: 0 0 150px; height: 92px; } }

/* ---------- 21. REELS ---------- */
.reels-slider {
  display: flex; gap: 18px; overflow-x: auto; scroll-behavior: smooth;
  scrollbar-width: none; -ms-overflow-style: none; padding-bottom: 10px;
  scroll-snap-type: x mandatory;
}
.reels-slider::-webkit-scrollbar { display: none; }
.reel-card { flex: 0 0 280px; scroll-snap-align: start; }
@media (max-width: 767px) { .reel-card { flex: 0 0 240px; } }
@media (max-width: 575px) { .reel-card { flex: 0 0 76vw; } }

/* ---------- 22. GALLERY FILTERS + GRID ---------- */
.gal-filters { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; margin-bottom: 34px; }
.gal-btn {
  background: #fff; border: 2px solid var(--line); border-radius: 999px;
  padding: 8px 17px; font: 600 .82rem/1 var(--font-body, sans-serif);
  color: var(--ink); cursor: pointer; transition: all .25s ease; white-space: nowrap;
}
.gal-btn:hover, .gal-btn.active {
  background: var(--gold); border-color: var(--gold); color: #fff;
  transform: translateY(-2px); box-shadow: 0 6px 16px rgba(79,163,224,.32);
}
.gal-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; }
.gal-item { border-radius: 14px; overflow: hidden; position: relative; background: var(--line); }
.gal-item.hide { display: none !important; }
.gal-link { display: block; position: relative; aspect-ratio: 4/3; overflow: hidden; }
.gal-link img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease; }
.gal-link:hover img { transform: scale(1.07); }
.gal-cap {
  position: absolute; inset: 0; padding: 14px;
  background: linear-gradient(0deg, rgba(8,14,26,.82), transparent 55%);
  display: flex; flex-direction: column; justify-content: flex-end;
  opacity: 0; transition: opacity .3s ease;
}
.gal-link:hover .gal-cap { opacity: 1; }
.gal-cap span { color: rgba(255,255,255,.8); font-size: .76rem; }
.gal-cap b { color: #fff; font-size: .9rem; }
@media (max-width: 1199px) { .gal-grid { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 767px)  { .gal-grid { grid-template-columns: repeat(2, 1fr); gap: 12px; } }
@media (max-width: 575px)  { .gal-btn { font-size: .74rem; padding: 7px 13px; } }
@media (max-width: 360px)  { .gal-grid { grid-template-columns: 1fr; } }

/* ---------- 23. FOOTER ---------- */
.footer-logo-img { height: 54px; width: auto; max-width: 210px; object-fit: contain; }
@media (max-width: 991px) {
  .footer-spirit .row > [class*="col-"] { margin-bottom: 30px; }
}
@media (max-width: 575px) {
  .footer-spirit { padding-top: 46px; }
  .footer-logo-img { height: 46px; }
  .footer-spirit .social { justify-content: flex-start; }
}

/* ---------- 24. PAGE HERO (inner pages) ---------- */
.ph-inner { padding: 82px 0 66px; }
@media (max-width: 991px) { .ph-inner { padding: 68px 0 52px; text-align: center; } .ph-chips { justify-content: center; } }
@media (max-width: 575px) { .ph-inner { padding: 56px 0 42px; } .ph-inner h1 { font-size: clamp(1.5rem, 7vw, 2.1rem); } }

/* ---------- 25. DESIGN PAGES (blueprint) ---------- */
@media (max-width: 991px) {
  .dp-hero { padding: 72px 0 54px; text-align: center; }
  .dp-hero .sub, .dp-chips { justify-content: center; margin-inline: auto; }
  .dp-sheet { margin-top: 28px; text-align: left; }
  .dp-flow { grid-template-columns: 1fr 1fr; }
  .dp-flow::before { display: none; }
}
@media (max-width: 575px) {
  .dp-hero { padding: 56px 0 42px; }
  .dp-flow { grid-template-columns: 1fr; }
}

/* ---------- 26. WHATSAPP BOT ---------- */
.wa-bot { position: fixed; left: 22px; bottom: 22px; z-index: 200; }
.wa-panel { width: 320px; max-width: calc(100vw - 40px); }
@media (max-width: 575px) {
  .wa-bot { left: 14px; bottom: 14px; }
  .wa-bot-btn { width: 54px; height: 54px; font-size: 1.5rem; }
  .wa-panel { width: 300px; left: 0; }
}

/* ---------- 27. PROMO / MISC ---------- */
.btn-spirit, .btn-ink, .btn-outline-light-spirit { white-space: nowrap; }
@media (max-width: 575px) {
  .btn-spirit, .btn-ink, .btn-outline-light-spirit { font-size: .88rem; padding: 12px 22px; }
}

/* ---------- 28. LANDSCAPE PHONE ---------- */
@media (max-height: 460px) and (orientation: landscape) {
  .hero { padding: 46px 0 34px; }
  #mainNav { max-height: 70vh; }
}

/* ---------- 29. PRINT ---------- */
@media print {
  .topbar, .navbar-spirit, .wa-bot, .reels-sec, .cta-band, .pay-sec { display: none !important; }
  .section { padding: 20px 0; }
}

/* ============================================================
   Final responsive consolidation patch
   Keeps the existing design while resolving duplicate navbar,
   mobile menu, icon, filtering, media and footer conflicts.
   ============================================================ */
:root{--chrome-2:#AEB9C6;}

.navbar-spirit{position:sticky;top:0;z-index:1040;background:rgba(255,255,255,.96);backdrop-filter:blur(12px);}
.navbar-spirit.menu-open{transform:none!important;}
.navbar-spirit .container-xxl{display:flex;align-items:center;justify-content:space-between;gap:12px;}
.nav-logo-img{height:52px;width:auto;max-width:220px;object-fit:contain;}
.navbar-toggler{position:relative;display:none;align-items:center;justify-content:center;width:44px;height:38px;padding:0;border:2px solid var(--gold);border-radius:10px;background:transparent;box-shadow:none;}
.navbar-toggler:focus{box-shadow:0 0 0 .18rem rgba(79,163,224,.25);}
.navbar-toggler-icon,.navbar-toggler-icon::before,.navbar-toggler-icon::after{display:block;width:22px;height:2px;background:var(--gold);border-radius:999px;transition:transform .25s ease,opacity .25s ease;content:"";}
.navbar-toggler-icon{position:relative;background-image:none!important;}
.navbar-toggler-icon::before{position:absolute;left:0;top:-7px;}
.navbar-toggler-icon::after{position:absolute;left:0;top:7px;}
.navbar-toggler[aria-expanded="true"] .navbar-toggler-icon{background:transparent;}
.navbar-toggler[aria-expanded="true"] .navbar-toggler-icon::before{top:0;transform:rotate(45deg);}
.navbar-toggler[aria-expanded="true"] .navbar-toggler-icon::after{top:0;transform:rotate(-45deg);}
.navbar-spirit .dropdown-item.active,.navbar-spirit .dropdown-item:active{background:var(--gold-soft);color:var(--ink);}

@media (min-width:992px){
  .navbar-toggler{display:none!important;}
  #mainNav{display:flex!important;align-items:center;}
  .navbar-spirit .dropdown-menu{margin-top:.45rem;}
}

@media (max-width:991.98px){
  .navbar-spirit{position:sticky;top:0;}
  .navbar-spirit .container-xxl{flex-wrap:wrap;padding:8px 16px;}
  .navbar-toggler{display:flex!important;}
  #mainNav{flex-basis:100%;width:100%;background:#0B1526;border:1px solid rgba(255,255,255,.08);border-radius:14px;margin-top:10px;padding:8px;box-shadow:0 18px 40px rgba(13,27,42,.24);max-height:calc(100vh - 96px);overflow-y:auto;overscroll-behavior:contain;}
  #mainNav:not(.show){display:none!important;}
  #mainNav.show{display:block!important;}
  #mainNav .navbar-nav{width:100%;flex-direction:column!important;align-items:stretch;gap:0;}
  #mainNav .nav-item{width:100%;border-bottom:1px solid rgba(255,255,255,.08);}
  #mainNav .nav-item:last-child{border-bottom:0;}
  #mainNav .nav-link{display:flex;align-items:center;justify-content:space-between;color:#F4F7FA!important;padding:12px 14px!important;border-radius:9px;font-size:.96rem;}
  #mainNav .nav-link::after{display:none;}
  #mainNav .nav-link:hover,#mainNav .nav-link.active{background:rgba(79,163,224,.16);color:#fff!important;}
  #mainNav .dropdown-menu{position:static!important;transform:none!important;float:none;display:none;margin:2px 8px 8px 18px;padding:5px;background:rgba(255,255,255,.06);border:0;border-radius:10px;box-shadow:none;min-width:0;}
  #mainNav .dropdown-menu.show{display:block;}
  #mainNav .dropdown-item{white-space:normal;color:#E6EDF6;border-radius:8px;padding:10px 12px;font-size:.9rem;}
  #mainNav .dropdown-item:hover,#mainNav .dropdown-item.active{background:rgba(79,163,224,.18);color:#fff;}
  #mainNav .btn-spirit{width:100%;justify-content:center;margin-top:12px;}
  .nav-logo-img{height:44px;max-width:190px;}
  .hero,.sp-hero,.page-hero{overflow:hidden;}
  .hero .d-flex.gap-3{flex-wrap:wrap;}
}

@media (max-width:575.98px){
  body{font-size:15px;}
  .nav-logo-img{height:39px;max-width:168px;}
  .navbar-spirit .container-xxl{padding-inline:14px;}
  #mainNav{max-height:calc(100vh - 84px);}
  .hero{padding-top:54px!important;padding-bottom:40px!important;}
  .hero h1{font-size:clamp(1.65rem,8vw,2.25rem)!important;}
  .hero p.lead-txt{font-size:.94rem;}
  .hero-stats{gap:14px;}
  .hero-stat{min-width:92px;}
  .cat-card .img-wrap,.gal-link{aspect-ratio:4/3;}
  .gal-filters{justify-content:flex-start;overflow-x:auto;flex-wrap:nowrap;padding-bottom:8px;margin-inline:-4px;scrollbar-width:thin;}
  .gal-btn{flex:0 0 auto;font-size:.78rem;padding:8px 14px;}
  .footer .row{row-gap:8px;}
  .footer-logo-img{height:44px;}
  .footer-bottom{gap:10px;text-align:left;}
  .wa-panel{right:0;max-width:calc(100vw - 28px);}
}

.gal-item.hide,.gal-item.hidden{display:none!important;}
.gal-item[aria-hidden="false"]{display:block;}
.reel-card video,.reel-card img{width:100%;height:100%;object-fit:cover;}
.footer-logo-img{width:auto;max-width:220px;object-fit:contain;}
.footer .social a{display:inline-flex;align-items:center;justify-content:center;}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.01ms!important;}
}

/* QA patch 2026-07: eliminate horizontal page overflow from animated marquee/slider tracks. */
html, body { max-width: 100%; overflow-x: hidden; }
.t-marquee { width: 100%; max-width: 100vw; overflow: hidden; }
.t-track { will-change: transform; }
@media (max-width: 575px) {
  .t-marquee { margin-inline: 0; }
  .t-track { gap: 14px; padding-inline: 8px; }
}

/* FINAL PRODUCTION QA PATCH — targeted UI fixes only */
.announcement-bar{
  height:42px;
  overflow:hidden;
  display:flex;
  align-items:center;
  justify-content:center;
  background:linear-gradient(135deg,var(--ink),var(--ink-2));
  color:#fff;
  border-bottom:1px solid rgba(211,154,58,.35);
  box-shadow:0 8px 22px rgba(11,18,38,.10);
  position:relative;
  z-index:1039;
}
.announcement-bar::before{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(90deg,transparent,rgba(211,154,58,.14),transparent);
  pointer-events:none;
}
.announcement-inner{
  height:42px;
  min-width:min(100%,920px);
  display:flex;
  flex-direction:column;
  align-items:center;
  animation:announcementRotate 9s cubic-bezier(.4,0,.2,1) infinite;
  will-change:transform;
}
.announcement-inner span{
  height:42px;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:0 18px;
  white-space:nowrap;
  font:800 clamp(.76rem,2.4vw,.92rem)/1 var(--font-body);
  letter-spacing:.015em;
  color:#fff;
  text-align:center;
}
@keyframes announcementRotate{
  0%,28%{transform:translateY(0)}
  34%,62%{transform:translateY(-42px)}
  68%,95%{transform:translateY(-84px)}
  100%{transform:translateY(0)}
}
.navbar-spirit{
  transition:transform .28s cubic-bezier(.4,0,.2,1),box-shadow .25s ease,padding .25s ease,background-color .25s ease;
  will-change:transform;
}
.navbar-spirit.nav-hidden{transform:translate3d(0,-110%,0)!important;}
.navbar-spirit.menu-open,.navbar-spirit:focus-within{transform:translate3d(0,0,0)!important;}

/* Testimonials bug fix: restore visible heading and original continuous marquee. */
.t-marquee{
  overflow:hidden;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);
  mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);
}
.t-track,.t-track.rev{
  width:max-content!important;
  max-width:none;
  margin:0;
  display:flex;
  flex-wrap:nowrap;
  justify-content:flex-start;
  gap:20px;
  padding:6px 10px;
  overflow:visible;
  scrollbar-width:auto;
  -ms-overflow-style:auto;
  scroll-snap-type:none;
  animation:tslide 68s linear infinite!important;
}
.t-track.rev{animation-duration:82s!important;animation-direction:reverse!important;}
.t-marquee:hover .t-track{animation-play-state:paused!important;}
.t-slide{
  flex:0 0 372px;
  max-width:none;
  opacity:1;
  transform:none;
  scroll-snap-align:none;
}
.t-slide .testi-card{
  transition:transform .35s ease,box-shadow .35s ease,border-color .35s ease,background-color .35s ease;
}
.t-slide .testi-card:hover{
  transform:translateY(-5px);
  box-shadow:0 18px 38px rgba(11,18,38,.14);
  border-color:rgba(211,154,58,.55);
}
.section .text-center:has(+ .t-marquee),.section:has(.t-marquee) > .container-xxl:first-child .text-center{
  opacity:1;
  transform:none;
}
@media(max-width:575.98px){
  .announcement-bar,.announcement-inner,.announcement-inner span{height:40px;}
  @keyframes announcementRotate{
    0%,28%{transform:translateY(0)}
    34%,62%{transform:translateY(-40px)}
    68%,95%{transform:translateY(-80px)}
    100%{transform:translateY(0)}
  }
  .t-slide{flex:0 0 285px;max-width:none;}
}

/* Reels: full-height media cards, keep badge, remove caption-class collision */
.reel-card{background:transparent!important;}
.reel-card:hover{transform:translateY(-5px)!important;box-shadow:0 18px 38px rgba(0,0,0,.34)!important;}
.reel-vid{width:100%;height:auto;aspect-ratio:9/16;object-fit:cover;display:block;background:#0B1226;}
.reel-caption{
  color:#fff;
  position:relative;
  z-index:2;
  padding:0;
  margin:0;
  background:transparent;
}
.reel-caption b{display:block;color:#fff;font-size:.95rem;line-height:1.3;}
.reel-caption>span:first-of-type{display:block;font-size:.78rem;color:rgba(255,255,255,.78);margin-top:4px;}
.reel-caption .reel-social-tag{display:inline-flex;}

/* Remove residual spinning/animated hover pseudo-elements and tilt-like hover behavior */
.mg-shimmer::after,.mg-glow::before{content:none!important;display:none!important;animation:none!important;}
.mg-shimmer,.mg-glow{overflow:hidden;}
.cat-card,.trust-card,.process-step,.blog-card,.order-card,.sp-feature,.price-pill,.reel-card,.btn-spirit,.btn-ink,.gal-btn,.g-filter button{
  transition:transform .35s ease,box-shadow .35s ease,border-color .35s ease,background-color .35s ease,color .35s ease!important;
}
.cat-card:hover,.trust-card:hover,.process-step:hover,.blog-card:hover,.order-card:hover,.sp-feature:hover,.price-pill:hover{
  transform:translateY(-5px)!important;
  box-shadow:0 18px 38px rgba(11,18,38,.14)!important;
  border-color:rgba(211,154,58,.55)!important;
}
.btn-spirit:hover,.btn-ink:hover,.gal-btn:hover,.g-filter button:hover{
  transform:translateY(-3px)!important;
  box-shadow:0 14px 28px rgba(11,18,38,.16)!important;
}
.cat-card:hover .img-wrap img,.blog-card:hover .img-wrap img,.gal-link:hover img{transform:scale(1.06)!important;}
@media(prefers-reduced-motion:reduce){
  .announcement-inner{animation:none!important;}
  .t-slide,.section:has(.t-marquee) .text-center{opacity:1!important;transform:none!important;transition:none!important;}
}

/* Production QA: preserve one-line announcement panel height during rotation. */
.announcement-inner span{flex:0 0 42px;}
@media(max-width:575.98px){.announcement-inner span{flex-basis:40px;}}

