/* Atlas site navigation (pairs with atlas-nav.js). Loaded last on every page so it is the header's one look.
 *
 * The header is styled by five older stylesheets (atlas, -redesign, -modern, -glass-test, -ceer), and pages
 * load different subsets of them, so the same header looked different from page to page. Rules here are
 * scoped to #siteHeader and the anv-* classes, with !important only where an older rule already uses it.
 */

:root {
  --anv-h: 72px;
  --anv-bg: rgba(9, 10, 14, .82);
  --anv-bg-solid: rgba(9, 10, 14, .94);
  --anv-line: rgba(255, 255, 255, .09);
  --anv-text: #f4f5f7;
  --anv-muted: rgba(244, 245, 247, .66);
  --anv-red: #e4002b;
  --anv-red-2: #ff2a4a;
  --anv-panel: #12141a;
  --anv-radius: 12px;
  --anv-ease: cubic-bezier(.2, .8, .2, 1);
}

/* ------------------------------------------------------------------ the bar */

html body #siteHeader.site-header {
  position: fixed !important;
  inset: 0 0 auto 0 !important;
  z-index: 1000 !important;
  height: var(--anv-h) !important;
  min-height: var(--anv-h) !important;
  display: flex !important;
  align-items: center !important;
  gap: 18px !important;
  padding: 0 max(20px, env(safe-area-inset-right, 0px)) 0 max(20px, env(safe-area-inset-left, 0px)) !important;
  margin: 0 !important;
  background: linear-gradient(180deg, rgba(0, 0, 0, .55), rgba(0, 0, 0, 0)) !important;
  border: 0 !important;
  border-bottom: 1px solid transparent !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  width: 100% !important;
  max-width: none !important;
  transform: none !important;
  transition: background .25s ease, border-color .25s ease, backdrop-filter .25s ease;
  font-family: Tajawal, "Segoe UI", Tahoma, Arial, sans-serif;
}
html body #siteHeader.site-header.anv-scrolled {
  background: var(--anv-bg) !important;
  -webkit-backdrop-filter: saturate(140%) blur(14px);
  backdrop-filter: saturate(140%) blur(14px);
  border-bottom-color: var(--anv-line) !important;
}

/* brand: both logos, never cut off */
html body #siteHeader.site-header .brand {
  max-width: none !important;
  display: flex !important;
  align-items: center !important;
  flex: 0 0 auto !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  text-decoration: none !important;
}
html body #siteHeader.site-header .brand-logos {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  min-width: 0 !important;
}
html body #siteHeader.site-header .brand-logos img {
  display: block !important;
  width: auto !important;
  min-width: 0 !important;
  min-height: 0 !important;               /* an older min-height beats any max-height */
  max-width: none !important;
  flex: 0 0 auto !important;              /* older rules pin both logos to a 160px flex basis */
  object-fit: contain !important;
  transform: none !important;
}
html body #siteHeader.site-header .brand-logos img.logo-atlas { height: 36px !important; max-height: 36px !important; }
html body #siteHeader.site-header .brand-logos img.logo-3m { height: 28px !important; max-height: 28px !important; }
html body #siteHeader.site-header .brand-logos > span { display: block !important; flex: 0 0 1px !important; border: 0 !important; width: 1px !important; height: 26px !important; background: var(--anv-line) !important; color: transparent !important; font-size: 0 !important; overflow: hidden; }
html body #siteHeader.site-header .brand-text { display: none !important; }

/* ------------------------------------------------------------------ the links */

html body #siteHeader.site-header .desktop-nav {
  flex: 1 1 auto !important;
  display: flex !important;
  justify-content: center !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  background: none !important;
  border: 0 !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  position: static !important;
  transform: none !important;
}
#siteHeader .anv-list { display: flex; align-items: center; gap: 2px; }
#siteHeader .anv-link,
#siteHeader .anv-dd-head .anv-link {
  position: relative;
  display: inline-flex !important;
  align-items: center;
  gap: 6px;
  height: 40px;
  padding: 0 12px !important;
  border-radius: 10px;
  color: var(--anv-muted) !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  line-height: 1 !important;
  letter-spacing: 0 !important;
  text-decoration: none !important;
  white-space: nowrap;
  background: none !important;
  transition: color .15s ease, background .15s ease;
}
#siteHeader .anv-link:hover,
#siteHeader .anv-dd:hover .anv-link,
#siteHeader .anv-dd.is-open .anv-link { color: var(--anv-text) !important; background: rgba(255, 255, 255, .06) !important; }
#siteHeader .anv-link.is-active { color: #fff !important; }
#siteHeader .anv-link::before { content: none !important; display: none !important; }
#siteHeader .anv-list .anv-link::after { content: none !important; }
#siteHeader .anv-list .anv-link.is-active::after {
  content: "" !important;
  display: block !important;
  position: absolute !important;
  inset-inline: 12px !important;
  inset-block: auto 3px !important;
  width: auto !important;
  height: 2px !important;
  border-radius: 2px !important;
  background: var(--anv-red-2) !important;
  opacity: 1 !important;
  transform: none !important;
}
#siteHeader .anv-link:focus-visible,
#siteHeader .anv-toggle:focus-visible,
#siteHeader .anv-panel a:focus-visible { outline: 2px solid var(--anv-red-2); outline-offset: 2px; }
#siteHeader .anv-link--plain { cursor: default; }
#siteHeader .anv-badge,
.anv-drawer .anv-badge {
  display: inline-block;
  padding: 2px 7px;
  border-radius: 99px;
  background: var(--anv-red);
  color: #fff;
  font-size: 10.5px;
  font-weight: 800;
  line-height: 1.4;
}

/* dropdowns: hover on a mouse, the caret button everywhere (keyboard, touch) */
#siteHeader .anv-dd { position: relative; }
#siteHeader .anv-list .anv-dd-head { display: flex !important; align-items: center; gap: 0 !important; margin: 0 !important; padding: 0 !important; }
#siteHeader .anv-list .anv-dd { gap: 0 !important; margin: 0 !important; padding: 0 !important; width: auto !important; min-width: 0 !important; flex: 0 0 auto !important; }
#siteHeader .anv-list .anv-dd-head { justify-content: flex-start !important; width: auto !important; }
#siteHeader .anv-list .anv-dd-head .anv-link { width: auto !important; min-width: 0 !important; flex: 0 0 auto !important; }
#siteHeader .anv-list .anv-link { margin: 0 !important; }          /* older rules indent links that sit inside a div */
#siteHeader .anv-dd-head .anv-link { padding-inline-end: 4px !important; }
#siteHeader .anv-toggle {
  display: inline-grid;
  place-items: center;
  width: 26px;
  height: 40px;
  margin-inline-start: -2px;
  padding: 0;
  border: 0;
  border-radius: 8px;
  background: none;
  color: var(--anv-muted);
  cursor: pointer;
}
#siteHeader .anv-list .anv-toggle {                      /* older header rules give every button a margin and size */
  margin: 0 !important;
  margin-inline-start: -4px !important;
  width: 24px !important;
  min-width: 0 !important;
  height: 40px !important;
  padding: 0 !important;
  border: 0 !important;
  background: none !important;
  box-shadow: none !important;
  flex: 0 0 auto !important;
}
#siteHeader .anv-caret { width: 12px; height: 12px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; transition: transform .2s ease; }
#siteHeader .anv-dd.is-open .anv-caret { transform: rotate(180deg); }
#siteHeader .anv-panel {
  position: absolute;
  top: calc(100% + 8px);
  inset-inline-start: 0;
  min-width: 220px;
  padding: 8px;
  border: 1px solid var(--anv-line);
  border-radius: 14px;
  background: var(--anv-panel);
  box-shadow: 0 20px 50px rgba(0, 0, 0, .45);
  opacity: 0;
  visibility: hidden;
  transform: translateY(-4px);
  transition: opacity .16s ease, transform .16s ease, visibility .16s;
}
#siteHeader .anv-panel::before { content: ""; position: absolute; inset: -10px 0 auto 0; height: 10px; }   /* hover bridge */
#siteHeader .anv-dd.is-open .anv-panel { opacity: 1; visibility: visible; transform: none; }
@media (hover: hover) and (pointer: fine) {
  #siteHeader .anv-dd:hover .anv-panel,
  #siteHeader .anv-dd:focus-within .anv-panel { opacity: 1; visibility: visible; transform: none; }
}
#siteHeader .anv-panel a {
  display: block;
  padding: 9px 12px;
  border-radius: 9px;
  color: var(--anv-muted) !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  text-decoration: none !important;
  white-space: nowrap;
}
#siteHeader .anv-panel a:hover,
#siteHeader .anv-panel a[aria-current="page"] { color: #fff !important; background: rgba(255, 255, 255, .06); }
#siteHeader .anv-dd--mega .anv-panel {
  display: grid;
  grid-template-columns: repeat(3, minmax(180px, 1fr));
  gap: 4px 10px;
  min-width: 620px;
  padding: 14px;
}
#siteHeader .anv-col b { display: block; padding: 4px 12px 6px; color: #fff; font-size: 13px; font-weight: 800; }
#siteHeader .anv-panel .anv-all { grid-column: 1 / -1; margin-top: 4px; border-top: 1px solid var(--anv-line); border-radius: 0 0 9px 9px; color: var(--anv-red-2) !important; font-weight: 700 !important; }

/* ------------------------------------------------------------------ the buttons on the side */

html body #siteHeader.site-header .header-actions {
  flex: 0 0 auto !important;
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  margin: 0 !important;
  padding: 0 !important;
  background: none !important;
  border: 0 !important;
}
html body #siteHeader.site-header .header-actions .ghost-btn,
html body #siteHeader.site-header .header-actions .primary-btn,
html body #siteHeader.site-header #langBtn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 7px !important;
  height: 40px !important;
  min-height: 40px !important;
  padding: 0 14px !important;
  border-radius: 10px !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  white-space: nowrap !important;
  text-decoration: none !important;
  box-shadow: none !important;
  transform: none !important;
}
html body #siteHeader.site-header .header-actions .ghost-btn {
  background: rgba(255, 255, 255, .04) !important;
  border: 1px solid var(--anv-line) !important;
  color: var(--anv-text) !important;
}
html body #siteHeader.site-header .header-actions .ghost-btn:hover { background: rgba(255, 255, 255, .09) !important; }
html body #siteHeader.site-header .header-actions .primary-btn {
  background: var(--anv-red) !important;
  border: 1px solid var(--anv-red) !important;
  color: #fff !important;
}
html body #siteHeader.site-header .header-actions .primary-btn:hover { background: #c40025 !important; }

/* the dark/light switch some pages have: same size as the rest */
html body #siteHeader.site-header .header-actions #themeBtn,
html body #siteHeader.site-header .header-actions .theme-toggle {
  order: 0 !important;
  width: 40px !important; height: 40px !important; min-width: 40px !important; padding: 0 !important; margin: 0 !important;
  border-radius: 10px !important; border: 1px solid var(--anv-line) !important; background: rgba(255, 255, 255, .04) !important;
  color: var(--anv-text) !important; font-size: 15px !important; box-shadow: none !important;
}
@media (max-width: 1199px) { html body #siteHeader.site-header .header-actions #themeBtn, html body #siteHeader.site-header .header-actions .theme-toggle { display: none !important; } }

/* order on the bar: language, country, log in, and the booking button at the outer edge */
html body #siteHeader.site-header #langBtn { order: 1 !important; }
html body #siteHeader.site-header .change-region-btn { order: 2 !important; }
html body #siteHeader.site-header .header-actions a.ghost-btn { order: 3 !important; }
html body #siteHeader.site-header .header-actions .primary-btn { order: 4 !important; }
html body #siteHeader.site-header #menuBtn { order: 5 !important; }

/* language: the flag of the language you switch to, and its name beside it
   (Arabic page: UK flag + EN; English page: Saudi flag + عربي, the Egyptian one on /egypt pages) */
html body #siteHeader.site-header #langBtn {
  width: auto !important;                 /* older rules fix it at 46px (flex 0 0 40px), too narrow for a flag and «عربي» */
  flex: 0 0 auto !important;
  max-width: none !important;
  min-width: 46px !important;
  overflow: visible !important;
  padding: 0 11px !important;
  gap: 7px !important;
  background: rgba(255, 255, 255, .04) !important;
  border: 1px solid var(--anv-line) !important;
  color: var(--anv-text) !important;
  font-size: 0 !important;
}
html body #siteHeader.site-header #langBtn img,
html body #siteHeader.site-header #langBtn svg,
html body #siteHeader.site-header #langBtn i { display: none !important; }
html body #siteHeader.site-header #langBtn::before {
  content: "" !important;
  display: block !important;
  flex: none !important;
  width: 22px !important;
  height: 15px !important;
  margin: 0 !important;
  border-radius: 3px !important;
  background: url("images/flag-gb.fc5841c6a478.svg") center / cover no-repeat !important;
  box-shadow: 0 0 0 1px rgba(255, 255, 255, .18) !important;
}
html[lang="en"] body #siteHeader.site-header #langBtn::before { background-image: url("images/flag-sa.338a0c77cd6a.svg") !important; }
html[lang="en"].anv-eg body #siteHeader.site-header #langBtn::before { background-image: url("images/flag-eg.d9eacc8c60d8.svg") !important; }
html body #siteHeader.site-header #langBtn::after { content: "EN"; font-size: 13px; font-weight: 800; letter-spacing: .04em; }
html[lang="en"] body #siteHeader.site-header #langBtn::after { content: "عربي"; letter-spacing: 0; }

/* country: shows where you are, opens the switcher */
html body #siteHeader.site-header .change-region-btn { font-size: 0 !important; }
html body #siteHeader.site-header .change-region-btn > span { display: none !important; }
html body #siteHeader.site-header .change-region-btn i { font-size: 14px !important; }
html body #siteHeader.site-header .change-region-btn::after { content: "السعودية"; font-size: 14px; font-weight: 700; }
html.anv-eg body #siteHeader.site-header .change-region-btn::after { content: "مصر"; }
html[lang="en"] body #siteHeader.site-header .change-region-btn::after { content: "Saudi Arabia"; }
html[lang="en"].anv-eg body #siteHeader.site-header .change-region-btn::after { content: "Egypt"; }

/* menu button */
html body #siteHeader.site-header #menuBtn {
  display: none !important;
  width: 44px !important;
  height: 44px !important;
  padding: 0 !important;
  margin: 0 !important;
  border: 1px solid var(--anv-line) !important;
  border-radius: 10px !important;
  background: rgba(255, 255, 255, .04) !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 5px !important;
  cursor: pointer;
}
html body #siteHeader.site-header #menuBtn span {
  display: block !important;
  width: 18px !important;
  height: 2px !important;
  margin: 0 !important;
  border-radius: 2px !important;
  background: var(--anv-text) !important;
  transform: none !important;
  opacity: 1 !important;
  position: static !important;
}

/* the older mobile menu is replaced by the drawer */
html body #mobileMenu { display: none !important; }

/* ------------------------------------------------------------------ narrower screens */

@media (max-width: 1380px) {
  #siteHeader .anv-link, #siteHeader .anv-dd-head .anv-link { padding: 0 9px !important; font-size: 14px !important; }
  html body #siteHeader.site-header .header-actions .ghost-btn, html body #siteHeader.site-header .header-actions .primary-btn { padding: 0 11px !important; font-size: 13px !important; }
}
@media (max-width: 1260px) {
  html body #siteHeader.site-header .header-actions a.ghost-btn[href*="login"] { display: none !important; }
}
@media (max-width: 1199px) {
  html body #siteHeader.site-header .desktop-nav,
  html body #siteHeader.site-header .header-actions .change-region-btn,
  html body #siteHeader.site-header .header-actions #langBtn,
  html body #siteHeader.site-header .header-actions a.ghost-btn { display: none !important; }     /* all of these live in the drawer */
  html body #siteHeader.site-header #menuBtn { display: inline-flex !important; }
  html body #siteHeader.site-header { justify-content: space-between !important; }
}
@media (max-width: 560px) {
  :root { --anv-h: 62px; }
  html body #siteHeader.site-header { gap: 10px !important; padding: 0 14px !important; }
  html body #siteHeader.site-header .brand-logos { gap: 8px !important; }
  html body #siteHeader.site-header .brand-logos img.logo-atlas { height: 28px !important; max-height: 28px !important; }
  html body #siteHeader.site-header .brand-logos img.logo-3m { height: 22px !important; max-height: 22px !important; }
  html body #siteHeader.site-header .header-actions .primary-btn { height: 40px !important; padding: 0 12px !important; font-size: 13px !important; }
}

/* ------------------------------------------------------------------ dark only: the light theme is gone, and so is its switch */

#themeBtn, .theme-toggle, #themeToggle, .mode-toggle, [data-theme-toggle],
html body #siteHeader.site-header .header-actions #themeBtn,
html body #siteHeader.site-header .header-actions .theme-toggle { display: none !important; }

/* ------------------------------------------------------------------ the bar folds into a floating pill once you scroll down
   (atlas-nav.js adds .anv-compact past the top of the page and sets --anv-side so the pill fits its contents) */

html body #siteHeader.site-header {
  transition: top .55s var(--anv-ease), left .55s var(--anv-ease), right .55s var(--anv-ease), height .45s var(--anv-ease), min-height .45s var(--anv-ease),
    border-radius .55s var(--anv-ease), padding .55s var(--anv-ease), background .3s ease, border-color .3s ease, box-shadow .45s ease !important;
}
html body #siteHeader.site-header.anv-compact {
  inset: 12px var(--anv-side, 16px) auto var(--anv-side, 16px) !important;
  width: auto !important;
  height: 60px !important;
  min-height: 60px !important;
  padding: 0 10px 0 16px !important;
  border-radius: 999px !important;
  border: 1px solid var(--anv-line) !important;
  background: var(--anv-bg-solid) !important;
  -webkit-backdrop-filter: saturate(150%) blur(18px);
  backdrop-filter: saturate(150%) blur(18px);
  box-shadow: 0 18px 50px rgba(0, 0, 0, .45), 0 0 0 1px rgba(255, 255, 255, .03) inset !important;
}
html[dir="rtl"] body #siteHeader.site-header.anv-compact { padding: 0 16px 0 10px !important; }

/* the links fold away toward the middle, one after another */
html body #siteHeader.site-header .desktop-nav { max-width: 1200px; transition: max-width .55s var(--anv-ease), opacity .3s ease; }
html body #siteHeader.site-header.anv-compact .desktop-nav { max-width: 0 !important; flex: 0 1 0 !important; opacity: 0; overflow: hidden !important; pointer-events: none; }
#siteHeader .anv-list > * { transition: transform .45s var(--anv-ease), opacity .3s ease; transition-delay: calc(var(--k, 0) * 35ms); }
#siteHeader.anv-compact .anv-list > * { transform: translateY(-10px) scale(.8); opacity: 0; transition-delay: 0ms; }

/* the language, country and log-in buttons fold into the menu */
html body #siteHeader.site-header .header-actions #langBtn,
html body #siteHeader.site-header .header-actions .change-region-btn,
html body #siteHeader.site-header .header-actions a.ghost-btn {
  max-width: 240px;
  transition: max-width .5s var(--anv-ease), opacity .25s ease, padding .5s var(--anv-ease), margin .5s var(--anv-ease), border-width .5s ease !important;
}
html body #siteHeader.site-header.anv-compact .header-actions #langBtn,
html body #siteHeader.site-header.anv-compact .header-actions .change-region-btn,
html body #siteHeader.site-header.anv-compact .header-actions a.ghost-btn {
  max-width: 0 !important;
  min-width: 0 !important;
  flex-basis: 0 !important;
  padding: 0 !important;
  margin-inline: -4px !important;
  border-width: 0 !important;
  opacity: 0 !important;
  overflow: hidden !important;
  pointer-events: none;
}
/* and the menu button comes in to open them */
html body #siteHeader.site-header.anv-compact #menuBtn { display: inline-flex !important; border-radius: 50% !important; animation: anv-pop .45s var(--anv-ease) both; }
html body #siteHeader.site-header.anv-compact .header-actions .primary-btn { border-radius: 999px !important; }
@keyframes anv-pop { from { opacity: 0; transform: scale(.4) rotate(-90deg); } to { opacity: 1; transform: none; } }

@media (max-width: 1199px) {
  html body #siteHeader.site-header.anv-compact { height: 56px !important; min-height: 56px !important; border-radius: 20px !important; padding: 0 8px 0 14px !important; }
  html[dir="rtl"] body #siteHeader.site-header.anv-compact { padding: 0 14px 0 8px !important; }
  html body #siteHeader.site-header.anv-compact #menuBtn { animation: none; border-radius: 12px !important; }
}
@media (prefers-reduced-motion: reduce) {
  html body #siteHeader.site-header, #siteHeader .anv-list > *, html body #siteHeader.site-header .desktop-nav { transition: none !important; }
  html body #siteHeader.site-header.anv-compact #menuBtn { animation: none; }
}

/* ------------------------------------------------------------------ mobile drawer */

html.anv-lock, html.anv-lock body { overflow: hidden !important; }
.anv-drawer { position: fixed; inset: 0; z-index: 2147483000;   /* above the floating WhatsApp / call buttons */
  font-family: Tajawal, "Segoe UI", Tahoma, Arial, sans-serif; }
.anv-drawer[hidden] { display: none !important; }
.anv-scrim { position: absolute; inset: 0; background: rgba(0, 0, 0, .55); opacity: 0; transition: opacity .22s ease; }
.anv-sheet {
  position: absolute;
  inset-block: 0;
  inset-inline-end: 0;
  width: min(420px, 100%);
  display: flex;
  flex-direction: column;
  background: #0d0f14;
  border-inline-start: 1px solid var(--anv-line);
  color: var(--anv-text);
  transform: translateX(-100%);
  transition: transform .24s cubic-bezier(.2, .8, .2, 1);
  padding-top: env(safe-area-inset-top, 0px);
  padding-bottom: env(safe-area-inset-bottom, 0px);
}
[dir="rtl"] .anv-sheet, html[dir="rtl"] .anv-sheet { transform: translateX(-100%); }
html[dir="ltr"] .anv-sheet { transform: translateX(100%); }
.anv-drawer.is-open .anv-scrim { opacity: 1; }
.anv-drawer.is-open .anv-sheet { transform: none; }
.anv-sheet-top { display: flex; align-items: center; justify-content: space-between; padding: 14px 16px; border-bottom: 1px solid var(--anv-line); }
.anv-sheet-title { font-size: 17px; }
.anv-close { width: 42px; height: 42px; display: grid; place-items: center; border: 1px solid var(--anv-line); border-radius: 10px; background: none; color: var(--anv-text); cursor: pointer; }
.anv-close svg { width: 20px; height: 20px; stroke: currentColor; stroke-width: 2; stroke-linecap: round; }
.anv-drawer-body { flex: 1; overflow-y: auto; padding: 12px 12px 18px; display: flex; flex-direction: column; gap: 2px; }
.anv-drawer-tools { display: flex; gap: 8px; margin-bottom: 8px; }
.anv-chip .anv-flag { width: 22px; height: 15px; border-radius: 3px; object-fit: cover; box-shadow: 0 0 0 1px rgba(255, 255, 255, .18); }
.anv-chip { display: inline-flex; align-items: center; justify-content: center; gap: 8px; flex: 1; height: 42px; border: 1px solid var(--anv-line); border-radius: 10px; background: rgba(255, 255, 255, .04); color: var(--anv-text); font: inherit; font-size: 14px; font-weight: 700; cursor: pointer; }
.anv-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  min-height: 52px;
  padding: 0 12px;
  border-radius: 10px;
  color: var(--anv-text) !important;
  font-size: 16.5px;
  font-weight: 700;
  text-decoration: none !important;
  list-style: none;
  cursor: pointer;
}
.anv-row::-webkit-details-marker { display: none; }
.anv-row:hover { background: rgba(255, 255, 255, .05); }
.anv-row.is-active, .anv-acc.is-active > .anv-row { color: #fff !important; background: rgba(228, 0, 43, .14); }
.anv-drawer .anv-caret { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; transition: transform .2s ease; }
.anv-acc[open] > .anv-row .anv-caret { transform: rotate(180deg); }
.anv-acc-body { display: flex; flex-direction: column; padding: 2px 10px 10px; }
.anv-acc-body b { padding: 10px 12px 4px; color: var(--anv-muted); font-size: 12.5px; font-weight: 800; letter-spacing: .02em; }
.anv-acc-body a { padding: 11px 12px; border-radius: 9px; color: var(--anv-muted) !important; font-size: 15px; text-decoration: none !important; }
.anv-acc-body a:hover, .anv-acc-body a[aria-current="page"] { color: #fff !important; background: rgba(255, 255, 255, .05); }
.anv-acc-body .anv-all { color: var(--anv-red-2) !important; font-weight: 700; }
.anv-drawer-cta { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: auto; padding-top: 16px; }
.anv-btn { display: flex; align-items: center; justify-content: center; height: 48px; border-radius: 12px; font-size: 15px; font-weight: 800; text-decoration: none !important; }
.anv-btn--ghost { border: 1px solid var(--anv-line); color: var(--anv-text) !important; }
.anv-btn--primary { background: var(--anv-red); color: #fff !important; }

@media (prefers-reduced-motion: reduce) {
  html body #siteHeader.site-header, #siteHeader .anv-panel, .anv-sheet, .anv-scrim, .anv-caret { transition: none !important; }
}