:root {
  --ashraf-header-height: 92px;
  --ashraf-mobile-header-height: 74px;
  --ashraf-admin-offset: 0px;
  --ashraf-header-bg: #f3f0e8;
  --ashraf-transparent-text: #fff;
  --ashraf-opaque-text: #20221f;
  --ashraf-burgundy: #70283b;
  --ashraf-burgundy-dark: #54202f;
  --ashraf-cream: #f3f0e8;
}

body.ashraf-custom-header-active .ct-header { display:none !important; }
body.ashraf-custom-header-active { --theme-link-initial-color:inherit; }
.admin-bar { --ashraf-admin-offset:32px; }

.ashraf-header,
.ashraf-header *,
.ashraf-mobile-panel,
.ashraf-mobile-panel * { box-sizing:border-box; }

.ashraf-header {
  --ashraf-scroll:1;
  --ashraf-fg-r:32;
  --ashraf-fg-g:34;
  --ashraf-fg-b:31;
  --ashraf-logo-invert:0;
  position:fixed;
  top:var(--ashraf-admin-offset);
  left:0;
  right:0;
  z-index:99990;
  height:var(--ashraf-header-height);
  color:rgb(var(--ashraf-fg-r),var(--ashraf-fg-g),var(--ashraf-fg-b));
  background:rgba(243,240,232,var(--ashraf-scroll));
  border:0;
  box-shadow:0 10px 35px rgba(32,34,31,calc(.06 * var(--ashraf-scroll)));
  -webkit-backdrop-filter:blur(calc(16px * var(--ashraf-scroll)));
  backdrop-filter:blur(calc(16px * var(--ashraf-scroll)));
  transition:color var(--ashraf-mega-close-speed) var(--ashraf-mega-easing), box-shadow .18s linear;
  overflow:visible;
}

body.ashraf-custom-header-overlay .ashraf-header {
  --ashraf-scroll:0;
  --ashraf-logo-invert:1;
  --ashraf-fg-r:255;
  --ashraf-fg-g:255;
  --ashraf-fg-b:255;
  background:
    linear-gradient(to bottom,rgba(18,19,17,calc(var(--ashraf-hero-shade) * (1 - var(--ashraf-scroll)))),rgba(18,19,17,0)),
    rgba(243,240,232,var(--ashraf-scroll));
}

/* A dedicated cream layer lets the header become opaque in perfect sync with the mega menu. */
/* Opaque header skin. It sits above the moving mega panel and below the header controls,
   so the menu visibly travels from behind the header rather than over its face. */
.ashraf-header::before {
  content:"";
  position:absolute;
  inset:0;
  z-index:2;
  background:var(--ashraf-header-bg);
  opacity:0;
  pointer-events:none;
  transition:opacity var(--ashraf-mega-close-speed) var(--ashraf-mega-easing);
}
.ashraf-header.is-mega-active::before {
  opacity:1;
  transition-duration:var(--ashraf-mega-open-speed);
}
body.ashraf-custom-header-overlay .ashraf-header.is-mega-active { color:var(--ashraf-opaque-text); transition-duration:var(--ashraf-mega-open-speed); }
body.ashraf-custom-header-overlay .ashraf-header.is-mega-active .ashraf-header-logo-image { filter:brightness(0) invert(0); transition-duration:var(--ashraf-mega-open-speed); }
body.ashraf-custom-header-overlay .ashraf-header.is-mega-active .ashraf-header__cta { background:var(--ashraf-burgundy); border-color:var(--ashraf-burgundy); color:#fff !important; transition-duration:var(--ashraf-mega-open-speed); }

.ashraf-header__inner {
  position:relative;
  z-index:auto;
  width:min(var(--ashraf-header-content-width),calc(100% - 64px));
  height:100%;
  margin:0 auto;
  display:grid;
  grid-template-columns:minmax(210px,.9fr) minmax(0,1.5fr) auto;
  align-items:center;
  gap:32px;
}
.ashraf-header__brand-wrap { min-width:0; position:relative; z-index:4; }
.ashraf-header__nav { position:static; z-index:auto; }
.ashraf-header-brand { color:inherit !important; text-decoration:none !important; }
.ashraf-header-brand--text { display:inline-block; font-family:Georgia,"Times New Roman",serif; font-size:22px; font-weight:400; line-height:1; letter-spacing:-.025em; white-space:nowrap; }
.ashraf-header-logo-image { display:block; width:auto; max-width:210px; max-height:46px; object-fit:contain; filter:brightness(0) invert(var(--ashraf-logo-invert)); transition:filter var(--ashraf-mega-close-speed) var(--ashraf-mega-easing); }

.ashraf-header__nav { min-width:0; justify-self:center; align-self:stretch; display:flex; align-items:stretch; }
.ashraf-header-menu,.ashraf-header-menu ul { list-style:none; margin:0; padding:0; }
.ashraf-header-menu { display:flex; align-items:stretch; justify-content:center; gap:clamp(18px,2.2vw,38px); height:100%; }
.ashraf-header-menu > li { position:static; margin:0; height:100%; display:flex; align-items:stretch; }
.ashraf-header-menu > li > a {
  position:relative;
  z-index:4;
  display:flex;
  align-items:center;
  height:100%;
  color:inherit !important;
  text-decoration:none !important;
  font-family:var(--ashraf-nav-font);
  font-size:var(--ashraf-nav-size);
  line-height:1;
  letter-spacing:var(--ashraf-nav-spacing);
  text-transform:uppercase;
  font-weight:var(--ashraf-nav-weight);
  white-space:nowrap;
}
.ashraf-header-menu > li > a::after { content:""; position:absolute; left:0; right:100%; bottom:25px; height:1px; background:currentColor; transition:right .25s ease; }
.ashraf-header-menu > li:hover > a::after,
.ashraf-header-menu > li.is-mega-open > a::after,
.ashraf-header-menu > li.current-menu-item > a::after,
.ashraf-header-menu > li.current_page_item > a::after { right:0; }

/* Full-bleed panel: background spans the entire viewport while its grid content
   remains constrained by --ashraf-mega-content-width via the horizontal padding below. */
.ashraf-header-menu > li > .sub-menu {
  position:absolute;
  top:calc(100% - var(--ashraf-mega-overlap));
  left:50%;
  right:auto;
  z-index:1;
  width:100vw;
  max-width:none;
  min-width:0;
  padding:var(--ashraf-mega-padding) max(32px,calc((100vw - var(--ashraf-mega-content-width)) / 2));
  display:grid;
  grid-template-columns:repeat(var(--ashraf-mega-columns),minmax(0,1fr));
  gap:var(--ashraf-mega-gap);
  background:var(--ashraf-mega-bg);
  color:var(--ashraf-mega-text);
  border:0;
  box-shadow:0 26px 60px rgba(32,34,31,.13);
  transform:translate3d(-50%,calc(-100% - var(--ashraf-header-height)),0);
  transform-origin:top center;
  pointer-events:none;
  transition:transform var(--ashraf-mega-close-speed) var(--ashraf-mega-easing);
  will-change:transform;
  backface-visibility:hidden;
}
.ashraf-header-menu > li.is-mega-open > .sub-menu {
  transform:translate3d(-50%,0,0);
  pointer-events:auto;
  transition-duration:var(--ashraf-mega-open-speed);
}

.ashraf-header-menu > li > .sub-menu > li { min-width:0; margin:0; }
.ashraf-header-menu > li > .sub-menu > li.ashraf-mega-span-2 { grid-column:span 2; }
.ashraf-header-menu > li > .sub-menu > li > a:not(.ashraf-mega-image-link),
.ashraf-mega-heading {
  display:block;
  color:var(--ashraf-mega-text) !important;
  font-family:var(--ashraf-mega-heading-font);
  font-size:var(--ashraf-mega-heading-size);
  line-height:1.15;
  letter-spacing:-.025em;
  font-weight:var(--ashraf-mega-heading-weight);
  text-transform:none;
  text-decoration:none !important;
  margin:0 0 10px;
  padding:0;
}
.ashraf-mega-note { margin:0 0 16px; color:var(--ashraf-mega-muted); font-size:13px; line-height:1.55; }
.ashraf-mega-image-link { display:block; width:100%; aspect-ratio:var(--ashraf-mega-image-ratio); margin:0 0 20px; padding:0 !important; overflow:hidden; background:#e7e4db; }
.ashraf-mega-image-link--static { cursor:default; }
.ashraf-mega-image { display:block; width:100%; height:100%; object-fit:cover; transition:transform .45s ease; }
.ashraf-mega-image-link:not(.ashraf-mega-image-link--static):hover .ashraf-mega-image { transform:scale(1.025); }

.ashraf-header-menu > li > .sub-menu > li > .sub-menu { position:static; display:block; opacity:1; visibility:visible; transform:none; pointer-events:auto; background:transparent; border:0; box-shadow:none; min-width:0; padding:5px 0 0; }
.ashraf-header-menu > li > .sub-menu > li > .sub-menu li { margin:0; }
.ashraf-header-menu > li > .sub-menu > li > .sub-menu a { display:block; color:var(--ashraf-mega-muted) !important; text-decoration:none !important; font-family:var(--ashraf-mega-link-font); font-size:var(--ashraf-mega-link-size); line-height:1.4; letter-spacing:.09em; text-transform:uppercase; font-weight:var(--ashraf-mega-link-weight); padding:7px 0; transition:color .2s ease,transform .2s ease; }
.ashraf-header-menu > li > .sub-menu > li > .sub-menu a:hover,
.ashraf-header-menu > li > .sub-menu > li > .sub-menu a:focus-visible { color:var(--ashraf-mega-accent) !important; transform:translateX(3px); }

.ashraf-header__actions { display:flex; align-items:center; justify-content:flex-end; gap:18px; position:relative; z-index:4; }
.ashraf-header__cta { display:inline-flex; align-items:center; justify-content:center; min-height:44px; padding:0 19px; border:1px solid var(--ashraf-burgundy); border-radius:999px; background:var(--ashraf-burgundy); color:#fff !important; text-decoration:none !important; font-size:11px; font-weight:700; letter-spacing:.11em; text-transform:uppercase; transition:background var(--ashraf-mega-close-speed) var(--ashraf-mega-easing),color var(--ashraf-mega-close-speed) var(--ashraf-mega-easing),border-color var(--ashraf-mega-close-speed) var(--ashraf-mega-easing),transform .2s ease; }
body.ashraf-custom-header-overlay .ashraf-header:not(.is-mega-active) .ashraf-header__cta { background:transparent; border-color:currentColor; color:inherit !important; }
.ashraf-header__cta:hover { transform:translateY(-1px); }

.ashraf-menu-toggle { display:none; align-items:center; gap:10px; min-height:44px; border:0; background:transparent; color:inherit; padding:0; cursor:pointer; font:inherit; }
.ashraf-menu-toggle__label { font-size:11px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; }
.ashraf-menu-toggle__icon { position:relative; width:24px; height:14px; }
.ashraf-menu-toggle__icon i { position:absolute; left:0; width:24px; height:1px; background:currentColor; }
.ashraf-menu-toggle__icon i:first-child { top:3px; }
.ashraf-menu-toggle__icon i:last-child { bottom:3px; }

.ashraf-header-spacer { height:var(--ashraf-header-height); }
body.ashraf-custom-header-overlay .ashraf-header-spacer { height:0; }

.ashraf-mobile-panel { position:fixed; inset:var(--ashraf-admin-offset) 0 0; z-index:100000; background:var(--ashraf-burgundy); color:var(--ashraf-cream); opacity:0; visibility:hidden; pointer-events:none; transform:translateY(-12px); transition:opacity .28s ease,transform .36s var(--ashraf-mega-easing),visibility 0s linear .36s; overflow:auto; }
.ashraf-mobile-panel.is-open { opacity:1; visibility:visible; pointer-events:auto; transform:none; transition-delay:0s; }
.ashraf-mobile-panel__inner { width:min(900px,calc(100% - 48px)); margin:0 auto; padding:25px 0 138px; }
.ashraf-mobile-panel__top { display:flex; align-items:center; justify-content:space-between; min-height:54px; }
.ashraf-mobile-panel__brand .ashraf-header-brand--text { color:var(--ashraf-cream) !important; }
.ashraf-mobile-panel__brand .ashraf-header-logo-image { filter:brightness(0) invert(1); }
.ashraf-mobile-close { position:relative; width:48px; height:48px; border:1px solid rgba(255,255,255,.35); border-radius:50%; background:transparent; cursor:pointer; }
.ashraf-mobile-close span { position:absolute; top:23px; left:13px; width:20px; height:1px; background:#fff; }
.ashraf-mobile-close span:first-child { transform:rotate(45deg); }
.ashraf-mobile-close span:last-child { transform:rotate(-45deg); }
.ashraf-mobile-panel__nav { margin:38px 0 44px; }
.ashraf-mobile-menu,.ashraf-mobile-menu ul { list-style:none; margin:0; padding:0; }
.ashraf-mobile-menu { counter-reset:ashraf-nav; display:block; }
.ashraf-mobile-menu > li { counter-increment:ashraf-nav; border-bottom:1px solid rgba(255,255,255,.18); }
.ashraf-mobile-menu > li > a { display:grid; grid-template-columns:44px 1fr; align-items:baseline; gap:8px; padding:18px 0; color:var(--ashraf-cream) !important; text-decoration:none !important; font-family:Georgia,"Times New Roman",serif; font-size:clamp(34px,9vw,58px); font-weight:400; letter-spacing:-.035em; line-height:1.05; text-transform:none; }
.ashraf-mobile-menu > li > a::before { content:counter(ashraf-nav,decimal-leading-zero); font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; font-size:10px; letter-spacing:.14em; opacity:.62; }
.ashraf-mobile-menu .sub-menu { position:static !important; display:block !important; transform:none !important; pointer-events:auto !important; width:auto !important; padding:0 0 15px 52px !important; background:transparent !important; box-shadow:none !important; }
.ashraf-mobile-menu .sub-menu .sub-menu { padding-left:16px !important; }
.ashraf-mobile-menu .sub-menu a { color:rgba(255,255,255,.74) !important; font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif !important; font-size:13px !important; letter-spacing:.08em !important; text-transform:uppercase !important; padding:8px 0 !important; margin:0 !important; }
.ashraf-mobile-menu .ashraf-mega-image-link,.ashraf-mobile-menu .ashraf-mega-note,.ashraf-mobile-menu .ashraf-mega-heading { display:none !important; }
.ashraf-mobile-panel__footer {
  position:fixed;
  left:50%;
  bottom:0;
  z-index:100003;
  width:min(900px,calc(100% - 48px));
  transform:translateX(-50%);
  border-top:1px solid rgba(255,255,255,.22);
  padding:18px 0 calc(18px + env(safe-area-inset-bottom));
  background:var(--ashraf-burgundy);
}
.ashraf-mobile-panel__footer::before {
  content:"";
  position:absolute;
  left:-24px; right:-24px; bottom:100%; height:34px;
  pointer-events:none;
  background:linear-gradient(to bottom,rgba(112,40,59,0),var(--ashraf-burgundy));
}
.ashraf-mobile-panel__cta { display:flex; align-items:center; justify-content:space-between; min-height:58px; padding:0 22px; border-radius:999px; background:var(--ashraf-cream); color:var(--ashraf-burgundy) !important; text-decoration:none !important; font-size:11px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; }
.ashraf-mobile-panel__footer p { display:none; }
body.ashraf-mobile-menu-open { overflow:hidden; }

@media (max-width:1120px) {
  .ashraf-header__inner { grid-template-columns:1fr auto; }
  .ashraf-header__nav,.ashraf-header__cta { display:none; }
  .ashraf-menu-toggle { display:inline-flex; }
}
@media (max-width:782px) { .admin-bar { --ashraf-admin-offset:46px; } }
@media (max-width:760px) {
  :root { --ashraf-header-height:var(--ashraf-mobile-header-height); }
  .ashraf-header__inner { width:calc(100% - 36px); gap:16px; }
  .ashraf-header-brand--text { font-size:18px; }
  .ashraf-header-logo-image { max-width:165px; max-height:38px; }
}
@media (max-width:420px) { .ashraf-menu-toggle__label { display:none; } .ashraf-mobile-panel__inner,.ashraf-mobile-panel__footer { width:calc(100% - 32px); } }
@media (prefers-reduced-motion:reduce) {
  body.ashraf-respect-reduced-motion .ashraf-header,
  body.ashraf-respect-reduced-motion .ashraf-header *,
  body.ashraf-respect-reduced-motion .ashraf-mobile-panel { transition:none !important; animation:none !important; }
}


/* v3.2 — Site-wide full-bleed Ashraf page heroes.
   Pages opt in by using `ashraf-page-hero` on their hero Cover block. */
body.ashraf-custom-header-overlay .site-main {
  --content-vertical-spacing:0px !important;
}
body.ashraf-custom-header-overlay .site-main,
body.ashraf-custom-header-overlay main,
body.ashraf-custom-header-overlay article,
body.ashraf-custom-header-overlay .entry-content,
body.ashraf-custom-header-overlay .ct-container,
body.ashraf-custom-header-overlay .ct-container-full {
  margin-top:0 !important;
  padding-top:0 !important;
}

/* v3.6 — Blocksy normal page templates place entry content inside .ct-container
   and may apply Content Area Vertical Spacing through data-vertical-spacing.
   Hero pages must start flush beneath the overlay header, just like the homepage. */
body.ashraf-custom-header-overlay .ct-container[data-vertical-spacing],
body.ashraf-custom-header-overlay .ct-container-full[data-vertical-spacing],
body.ashraf-custom-header-overlay [data-vertical-spacing] {
  padding-top:0 !important;
  margin-top:0 !important;
}
body.ashraf-custom-header-overlay .entry-content > .ashraf-page-hero:first-child {
  margin-top:0 !important;
}


/* v3.7 — Pages with a custom Ashraf hero do not need Blocksy's own page-title
   hero above the Gutenberg content. On ordinary pages Blocksy renders this as
   .hero-section before the content container, which creates a visible strip
   above the custom Cover hero. Limit this to overlay pages only. */
body.ashraf-custom-header-overlay .hero-section[data-type],
body.ashraf-custom-header-overlay .site-main > .hero-section,
body.ashraf-custom-header-overlay main > .hero-section {
  display:none !important;
}

/* Keep the top of the actual Gutenberg hero flush after removing the theme title. */
body.ashraf-custom-header-overlay .ashraf-page-hero:first-child,
body.ashraf-custom-header-overlay .entry-content > .ashraf-page-hero:first-child {
  margin-top:0 !important;
}

/* v3.3 — Book a Visit location chooser */
.ashraf-booking-chooser {
  position:fixed;
  z-index:99996;
  top:calc(var(--ashraf-admin-offset) + var(--ashraf-header-height) - 1px);
  left:0;
  width:100%;
  background:var(--ashraf-mega-bg);
  color:var(--ashraf-mega-text);
  border-top:1px solid rgba(32,34,31,.08);
  box-shadow:0 22px 55px rgba(32,34,31,.10);
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transform:translateY(-24px);
  transition:transform var(--ashraf-mega-open-speed) var(--ashraf-mega-easing),opacity calc(var(--ashraf-mega-open-speed) * .7) ease,visibility 0s linear var(--ashraf-mega-open-speed);
}
.ashraf-booking-chooser.is-open {
  opacity:1;
  visibility:visible;
  pointer-events:auto;
  transform:translateY(0);
  transition:transform var(--ashraf-mega-open-speed) var(--ashraf-mega-easing),opacity calc(var(--ashraf-mega-open-speed) * .7) ease,visibility 0s;
}
.ashraf-booking-chooser__inner { position:relative; width:min(calc(100% - 64px),var(--ashraf-mega-content-width)); margin:0 auto; padding:48px 0 52px; display:grid; grid-template-columns:minmax(250px,.72fr) minmax(520px,1.28fr); gap:72px; align-items:end; }
.ashraf-booking-chooser__eyebrow { margin:0 0 14px; color:var(--ashraf-mega-accent); font-family:var(--ashraf-mega-link-font); font-size:10px; font-weight:700; letter-spacing:.18em; text-transform:uppercase; }
.ashraf-booking-chooser__intro h2 { margin:0 0 16px; color:var(--ashraf-mega-text); font-family:var(--ashraf-mega-heading-font); font-size:clamp(38px,4vw,62px); font-weight:var(--ashraf-mega-heading-weight); line-height:.98; letter-spacing:-.035em; }
.ashraf-booking-chooser__intro > p:last-child { max-width:480px; margin:0; color:var(--ashraf-mega-muted); font-size:14px; line-height:1.65; }
.ashraf-booking-chooser__locations { border-top:1px solid rgba(32,34,31,.16); }
.ashraf-booking-location { display:grid; grid-template-columns:42px 1fr auto; gap:18px; align-items:center; min-height:112px; border-bottom:1px solid rgba(32,34,31,.16); color:var(--ashraf-mega-text) !important; text-decoration:none !important; transition:padding .28s ease,color .28s ease,background .28s ease; }
.ashraf-booking-location:hover,.ashraf-booking-location:focus-visible { padding-left:14px; color:var(--ashraf-mega-accent) !important; background:rgba(112,40,59,.035); }
.ashraf-booking-location__number { align-self:start; padding-top:32px; color:var(--ashraf-mega-muted); font-size:9px; font-weight:700; letter-spacing:.14em; }
.ashraf-booking-location__body { display:flex; flex-direction:column; gap:7px; min-width:0; }
.ashraf-booking-location__body strong { font-family:var(--ashraf-mega-heading-font); font-size:30px; font-weight:var(--ashraf-mega-heading-weight); line-height:1; }
.ashraf-booking-location__body small { color:var(--ashraf-mega-muted); font-size:11px; letter-spacing:.05em; line-height:1.4; }
.ashraf-booking-location__arrow { font-size:25px; transition:transform .28s ease; }
.ashraf-booking-location:hover .ashraf-booking-location__arrow { transform:translateX(6px); }
.ashraf-booking-chooser__close { position:absolute; top:24px; right:0; width:44px; height:44px; border:0; background:transparent; cursor:pointer; }
.ashraf-booking-chooser__close span { position:absolute; left:11px; top:21px; width:22px; height:1px; background:currentColor; }
.ashraf-booking-chooser__close span:first-child { transform:rotate(45deg); }
.ashraf-booking-chooser__close span:last-child { transform:rotate(-45deg); }
.ashraf-header.is-booking-active::before { opacity:1; transition-duration:var(--ashraf-mega-open-speed); }
body.ashraf-custom-header-overlay .ashraf-header.is-booking-active { color:var(--ashraf-opaque-text); transition-duration:var(--ashraf-mega-open-speed); }
body.ashraf-custom-header-overlay .ashraf-header.is-booking-active .ashraf-header-logo-image { filter:brightness(0) invert(0); transition-duration:var(--ashraf-mega-open-speed); }
body.ashraf-custom-header-overlay .ashraf-header.is-booking-active .ashraf-header__cta { background:var(--ashraf-burgundy); border-color:var(--ashraf-burgundy); color:#fff !important; }
.ashraf-header__cta.ashraf-booking-trigger,.ashraf-mobile-panel__cta.ashraf-booking-trigger { font-family:inherit; cursor:pointer; }
.ashraf-mobile-panel__cta.ashraf-booking-trigger { width:100%; border:0; }
@media (max-width:1120px) {
  .ashraf-booking-chooser { top:calc(var(--ashraf-admin-offset) + var(--ashraf-mobile-header-height) - 1px); }
  .ashraf-booking-chooser__inner { width:calc(100% - 40px); padding:34px 0 38px; grid-template-columns:1fr; gap:28px; align-items:start; }
  .ashraf-booking-chooser__intro { padding-right:48px; }
  .ashraf-booking-chooser__intro h2 { font-size:clamp(38px,9vw,54px); }
  .ashraf-booking-location { min-height:92px; grid-template-columns:34px 1fr auto; gap:12px; }
  .ashraf-booking-location__number { padding-top:26px; }
  .ashraf-booking-location__body strong { font-size:26px; }
}
@media (max-width:520px) {
  .ashraf-booking-location__body small { font-size:10px; }
  .ashraf-booking-chooser__inner { width:calc(100% - 32px); }
}
@media (prefers-reduced-motion:reduce) {
  body.ashraf-respect-reduced-motion .ashraf-booking-chooser,
  body.ashraf-respect-reduced-motion .ashraf-booking-location,
  body.ashraf-respect-reduced-motion .ashraf-booking-location__arrow { transition:none !important; }
}


/* v3.4 — Keep Book a Visit permanently visible at the bottom of the mobile menu */
@media (max-width:1120px) {
  .ashraf-mobile-panel__footer { display:block; }
  .ashraf-mobile-panel__cta { width:100%; min-height:60px; box-shadow:0 10px 28px rgba(32,34,31,.14); }
}

/* =========================================================
   v3.8 — Site-wide image reveal + hover motion
   Homepage and internal page heroes are intentionally excluded.
   Values are supplied by the plugin settings as CSS custom properties.
   ========================================================= */

.wp-block-image,
.wp-block-cover:not(.ashraf-page-hero),
.ashraf-photo,
.ashraf-image,
.ashraf-portrait,
.miraal-portrait,
.ashraf-dentist-image {
  overflow:hidden;
  isolation:isolate;
}

.wp-block-image img,
.wp-block-cover:not(.ashraf-page-hero) > .wp-block-cover__image-background,
.ashraf-photo img,
.ashraf-image img,
.ashraf-portrait img,
.miraal-portrait img,
.ashraf-dentist-image img {
  display:block;
  transform:scale(1);
  transform-origin:center center;
  transition:transform var(--ashraf-image-hover-duration,2.2s) cubic-bezier(.22,.61,.36,1) !important;
  will-change:transform;
}

/* JS applies this before an eligible image has completed its first reveal. */
.ashraf-image-reveal-pending {
  transform:scale(var(--ashraf-image-reveal-scale,1.035)) !important;
  transition:none !important;
}

.ashraf-image-reveal-active {
  animation:ashrafImageReveal var(--ashraf-image-reveal-duration,3.6s) cubic-bezier(.22,.61,.36,1) forwards !important;
  transition:none !important;
}

@keyframes ashrafImageReveal {
  from { transform:scale(var(--ashraf-image-reveal-scale,1.035)); }
  to { transform:scale(1); }
}

.ashraf-image-reveal-done {
  transform:scale(1) !important;
  animation:none !important;
  transition:transform var(--ashraf-image-hover-duration,2.2s) cubic-bezier(.22,.61,.36,1) !important;
}

.wp-block-image:hover img.ashraf-image-reveal-done,
.wp-block-cover:not(.ashraf-page-hero):hover > .wp-block-cover__image-background.ashraf-image-reveal-done,
.ashraf-photo:hover img.ashraf-image-reveal-done,
.ashraf-image:hover img.ashraf-image-reveal-done,
.ashraf-portrait:hover img.ashraf-image-reveal-done,
.miraal-portrait:hover img.ashraf-image-reveal-done,
.ashraf-dentist-slide:hover .ashraf-dentist-image img.ashraf-image-reveal-done,
.ashraf-dentist-image:hover img.ashraf-image-reveal-done {
  transform:scale(var(--ashraf-image-hover-scale,1.035)) !important;
}

/* Images remain hoverable even when the scroll reveal is disabled. */
body.ashraf-image-reveal-disabled .wp-block-image:hover img,
body.ashraf-image-reveal-disabled .wp-block-cover:not(.ashraf-page-hero):hover > .wp-block-cover__image-background,
body.ashraf-image-reveal-disabled .ashraf-photo:hover img,
body.ashraf-image-reveal-disabled .ashraf-image:hover img,
body.ashraf-image-reveal-disabled .ashraf-portrait:hover img,
body.ashraf-image-reveal-disabled .miraal-portrait:hover img,
body.ashraf-image-reveal-disabled .ashraf-dentist-slide:hover .ashraf-dentist-image img,
body.ashraf-image-reveal-disabled .ashraf-dentist-image:hover img {
  transform:scale(var(--ashraf-image-hover-scale,1.035));
}

/* =========================================================
   v4.0 — Header design controls + centered/image-led mega menus
   ========================================================= */
.ashraf-header__inner {
  width:min(var(--ashraf-header-content-width),calc(100% - (var(--ashraf-header-side-padding) * 2)));
  gap:var(--ashraf-header-gap);
}
.ashraf-header-menu { gap:var(--ashraf-nav-gap); }
.ashraf-header__cta { background:var(--ashraf-cta-bg); border-color:var(--ashraf-cta-border); color:var(--ashraf-cta-text)!important; }
body.ashraf-custom-header-overlay .ashraf-header.is-mega-active .ashraf-header__cta { background:var(--ashraf-cta-bg); border-color:var(--ashraf-cta-border); color:var(--ashraf-cta-text)!important; }

/* Logo viewport: negative margins make cropped pixels stop contributing to layout size. */
.ashraf-header-brand--image { display:inline-flex; max-width:100%; overflow:visible; }
.ashraf-header-logo-viewport { display:block; overflow:hidden; max-width:min(var(--ashraf-logo-width),var(--ashraf-logo-max-desktop),100%); }
.ashraf-header-logo-image {
  display:block; width:var(--ashraf-logo-width); max-width:var(--ashraf-logo-max-desktop); height:auto; max-height:none; object-fit:contain;
  margin-top:calc(-1 * var(--ashraf-logo-crop-top));
  margin-bottom:calc(-1 * var(--ashraf-logo-crop-bottom));
}
.ashraf-header-brand--image.has-horizontal-crop .ashraf-header-logo-image {
  margin-left:calc(-1 * var(--ashraf-logo-crop-left));
  margin-right:calc(-1 * var(--ashraf-logo-crop-right));
  width:calc(var(--ashraf-logo-width) + var(--ashraf-logo-crop-left) + var(--ashraf-logo-crop-right));
  max-width:none;
}

/* Center the submenu columns as a group by default rather than stretching them edge-to-edge. */
.ashraf-header-menu > li > .sub-menu {
  grid-template-columns:repeat(var(--ashraf-mega-columns),minmax(140px,var(--ashraf-mega-column-width)));
  min-height:var(--ashraf-mega-min-height);
  align-items:start;
}
.ashraf-header.ashraf-mega-align-center .ashraf-header-menu > li > .sub-menu { justify-content:center; }
.ashraf-header.ashraf-mega-align-left .ashraf-header-menu > li > .sub-menu { justify-content:start; }
.ashraf-header.ashraf-mega-align-right .ashraf-header-menu > li > .sub-menu { justify-content:end; }
.ashraf-header-menu > li.ashraf-panel-align-center > .sub-menu { justify-content:center!important; }
.ashraf-header-menu > li.ashraf-panel-align-left > .sub-menu { justify-content:start!important; }
.ashraf-header-menu > li.ashraf-panel-align-right > .sub-menu { justify-content:end!important; }
.ashraf-header.no-mega-shadow .ashraf-header-menu > li > .sub-menu { box-shadow:none; }

/* Image placement controls. */
.ashraf-mega-column { position:relative; }
.ashraf-mega-column .ashraf-mega-image-link { border-radius:var(--ashraf-mega-radius); }
.ashraf-mega-column.ashraf-image-bottom { display:flex; flex-direction:column; }
.ashraf-mega-column.ashraf-image-bottom > .ashraf-mega-image-link { order:20; margin:16px 0 0; }
.ashraf-mega-column.ashraf-image-left,
.ashraf-mega-column.ashraf-image-right { display:grid; grid-template-columns:minmax(100px,.9fr) minmax(0,1.1fr); column-gap:20px; align-items:start; }
.ashraf-mega-column.ashraf-image-left > .ashraf-mega-image-link { grid-column:1; grid-row:1 / span 4; margin:0; }
.ashraf-mega-column.ashraf-image-left > :not(.ashraf-mega-image-link) { grid-column:2; }
.ashraf-mega-column.ashraf-image-right { grid-template-columns:minmax(0,1.1fr) minmax(100px,.9fr); }
.ashraf-mega-column.ashraf-image-right > .ashraf-mega-image-link { grid-column:2; grid-row:1 / span 4; margin:0; }
.ashraf-mega-column.ashraf-image-right > :not(.ashraf-mega-image-link) { grid-column:1; }

/* Image-feature submenu: a large image tile with title, note and child links over it. */
.ashraf-mega-column.ashraf-mega-card-overlay {
  min-height:clamp(230px,25vw,380px); overflow:hidden; border-radius:var(--ashraf-mega-radius); padding:clamp(20px,2.2vw,34px);
  display:flex; flex-direction:column; justify-content:flex-end; isolation:isolate; color:#fff;
}
.ashraf-mega-column.ashraf-mega-card-overlay > .ashraf-mega-image-link {
  position:absolute; inset:0; z-index:-2; width:100%; height:100%; aspect-ratio:auto; margin:0; border-radius:inherit;
}
.ashraf-mega-column.ashraf-mega-card-overlay::after { content:""; position:absolute; inset:0; z-index:-1; background:linear-gradient(to top,rgba(20,20,18,.72),rgba(20,20,18,.08) 72%); pointer-events:none; }
.ashraf-mega-column.ashraf-mega-card-overlay > a:not(.ashraf-mega-image-link),
.ashraf-mega-column.ashraf-mega-card-overlay > .ashraf-mega-heading { color:#fff!important; margin-top:auto; }
.ashraf-mega-column.ashraf-mega-card-overlay > .ashraf-mega-note { color:rgba(255,255,255,.78); }
.ashraf-mega-column.ashraf-mega-card-overlay > .sub-menu { padding-top:4px; }
.ashraf-mega-column.ashraf-mega-card-overlay > .sub-menu a { color:rgba(255,255,255,.82)!important; }
.ashraf-mega-column.ashraf-mega-card-overlay > .sub-menu a:hover { color:#fff!important; }

.ashraf-mobile-panel { background:var(--ashraf-mobile-bg); color:var(--ashraf-mobile-text); }
.ashraf-mobile-panel__brand .ashraf-header-brand--text,.ashraf-mobile-menu > li > a { color:var(--ashraf-mobile-text)!important; }
.ashraf-mobile-panel__footer { background:var(--ashraf-mobile-bg); }
.ashraf-mobile-panel__footer::before { background:linear-gradient(to bottom,transparent,var(--ashraf-mobile-bg)); }

@media (max-width:760px) {
  .ashraf-header-logo-viewport { max-width:min(var(--ashraf-logo-width),var(--ashraf-logo-max-mobile),100%); }
  .ashraf-header-logo-image { max-width:var(--ashraf-logo-max-mobile); }
}

/* =========================================================
   v4.1 — Stable menu switching + editorial image tiles
   ========================================================= */
/* Switching directly between desktop menu titles should swap panels without
   replaying the full slide-out/slide-in animation. */
.ashraf-header.is-mega-switching .ashraf-header-menu > li > .sub-menu {
  transition:none !important;
}

/* Image-led page tiles: desktop-only editorial treatment. */
@media (min-width: 1001px) {
  .ashraf-mega-column.ashraf-mega-card-overlay {
    display:flex;
    flex-direction:column;
    justify-content:flex-end;
  }
  .ashraf-mega-column.ashraf-mega-card-overlay.ashraf-overlay-bottom-center {
    align-items:center;
    text-align:center;
  }
  .ashraf-mega-column.ashraf-mega-card-overlay.ashraf-overlay-center {
    justify-content:center;
    align-items:center;
    text-align:center;
  }
  .ashraf-mega-column.ashraf-mega-card-overlay.ashraf-overlay-top-left {
    justify-content:flex-start;
  }
  .ashraf-header-menu .ashraf-mega-image.ashraf-mega-image-reveal {
    animation:ashrafMegaImageReveal var(--ashraf-image-reveal-duration,3.6s) cubic-bezier(.22,.61,.36,1) forwards !important;
  }
  @keyframes ashrafMegaImageReveal {
    from { transform:scale(var(--ashraf-image-reveal-scale,1.035)); }
    to { transform:scale(1); }
  }
}

/* =========================================================
   v4.2 — Dynamic columns, clickable image tiles, mobile headings
   ========================================================= */
@media (min-width:1001px) {
  /* Each mega menu now sizes from the columns it actually contains. */
  .ashraf-header-menu > li > .sub-menu {
    display:flex !important;
    flex-wrap:nowrap;
    width:min(calc(100vw - 64px),var(--ashraf-mega-content-width));
    grid-template-columns:none !important;
  }
  .ashraf-header-menu > li > .sub-menu > li.ashraf-mega-column {
    flex:0 1 var(--ashraf-column-width,var(--ashraf-mega-column-width));
    width:var(--ashraf-column-width,var(--ashraf-mega-column-width));
    min-width:140px;
  }
  .ashraf-header-menu > li > .sub-menu > li.ashraf-mega-span-2:not([style*="--ashraf-column-width"]) {
    flex-basis:calc((var(--ashraf-mega-column-width) * 2) + var(--ashraf-mega-gap));
    width:calc((var(--ashraf-mega-column-width) * 2) + var(--ashraf-mega-gap));
  }
  /* The title link becomes a stretched link across the complete image tile. */
  .ashraf-mega-card-overlay > a:not(.ashraf-mega-image-link) { position:relative; z-index:2; color:var(--ashraf-tile-heading)!important; font-size:var(--ashraf-tile-heading-size)!important; }
  .ashraf-mega-card-overlay > a:not(.ashraf-mega-image-link)::before { content:""; position:absolute; z-index:-1; inset:-1000px; }
  .ashraf-mega-card-overlay { clip-path:inset(0 round var(--ashraf-mega-radius)); }
  .ashraf-mega-card-overlay::after { background:linear-gradient(to top,rgba(20,20,18,var(--ashraf-tile-overlay)),rgba(20,20,18,.04) 76%)!important; }
  .ashraf-mega-card-overlay > .ashraf-mega-heading { color:var(--ashraf-tile-heading)!important; font-size:var(--ashraf-tile-heading-size)!important; }
  .ashraf-mega-card-overlay > .ashraf-mega-note,
  .ashraf-mega-card-overlay > .sub-menu a { color:var(--ashraf-tile-text)!important; font-size:var(--ashraf-tile-text-size)!important; position:relative; z-index:3; }
}

/* Structural subsection labels remain visible in the mobile navigation. */
@media (max-width:1000px) {
  .ashraf-mobile-menu .ashraf-mega-heading {
    display:block !important;
    color:var(--ashraf-mobile-text)!important;
    font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important;
    font-size:11px!important;
    font-weight:700!important;
    letter-spacing:.14em!important;
    line-height:1.3!important;
    text-transform:uppercase!important;
    opacity:.62;
    padding:13px 0 5px!important;
  }
  .ashraf-mobile-menu .ashraf-mega-column--heading > a { display:none!important; }
}

/* =========================================================
   v4.3 — Full-bleed panels + reliable tile zoom/colours
   ========================================================= */
@media (min-width:1001px) {
  /* The panel itself is always viewport-wide. Content is constrained by
     responsive side padding, so custom column widths never shrink the panel. */
  .ashraf-header-menu > li > .sub-menu {
    width:100vw !important;
    max-width:none !important;
    padding-left:max(32px,calc((100vw - var(--ashraf-mega-content-width)) / 2)) !important;
    padding-right:max(32px,calc((100vw - var(--ashraf-mega-content-width)) / 2)) !important;
  }

  /* v4.1 reveal animation and hover transform both use transform. Explicitly
     retire the reveal animation on hover so the configured hover zoom wins. */
  .ashraf-header-menu .ashraf-mega-image-link:hover .ashraf-mega-image,
  .ashraf-header-menu .ashraf-mega-card-overlay:hover > .ashraf-mega-image-link .ashraf-mega-image {
    animation:none !important;
    transform:scale(var(--ashraf-image-hover-scale,1.035)) !important;
    transition:transform var(--ashraf-image-hover-duration,2.2s) cubic-bezier(.22,.61,.36,1) !important;
  }
  .ashraf-header-menu .ashraf-mega-image {
    transform-origin:center center;
    transition:transform var(--ashraf-image-hover-duration,2.2s) cubic-bezier(.22,.61,.36,1) !important;
  }

  /* Tile typography is intentionally isolated from general mega-menu colours. */
  .ashraf-header-menu > li > .sub-menu > li.ashraf-mega-card-overlay > a:not(.ashraf-mega-image-link),
  .ashraf-header-menu > li > .sub-menu > li.ashraf-mega-card-overlay > .ashraf-mega-heading {
    color:var(--ashraf-tile-heading,#fff) !important;
    -webkit-text-fill-color:var(--ashraf-tile-heading,#fff) !important;
  }
  .ashraf-header-menu > li > .sub-menu > li.ashraf-mega-card-overlay > .ashraf-mega-note,
  .ashraf-header-menu > li > .sub-menu > li.ashraf-mega-card-overlay > .sub-menu a,
  .ashraf-header-menu > li > .sub-menu > li.ashraf-mega-card-overlay > .sub-menu a:visited {
    color:var(--ashraf-tile-text,#fff) !important;
    -webkit-text-fill-color:var(--ashraf-tile-text,#fff) !important;
  }
  .ashraf-header-menu > li > .sub-menu > li.ashraf-mega-card-overlay > .sub-menu a:hover,
  .ashraf-header-menu > li > .sub-menu > li.ashraf-mega-card-overlay > .sub-menu a:focus-visible {
    color:var(--ashraf-tile-heading,#fff) !important;
    -webkit-text-fill-color:var(--ashraf-tile-heading,#fff) !important;
  }
}

/* =========================================================
   v4.4 — Smooth image-card hover + independent card controls
   ========================================================= */
@media (min-width:1001px) {
  /* Entrance motion lives on the image frame. Hover motion lives on the image.
     Keeping them on separate elements prevents the hover transform from snapping. */
  .ashraf-header-menu .ashraf-mega-image-link {
    overflow:hidden;
    transform:scale(1);
    transform-origin:center center;
  }
  .ashraf-header-menu .ashraf-mega-image-link.ashraf-mega-image-reveal {
    animation:ashrafMegaFrameReveal var(--ashraf-image-reveal-duration,3.6s) cubic-bezier(.22,.61,.36,1) both !important;
  }
  @keyframes ashrafMegaFrameReveal {
    from { transform:scale(var(--ashraf-image-reveal-scale,1.035)); }
    to { transform:scale(1); }
  }
  /* Disable the old image-level reveal from v4.1. */
  .ashraf-header-menu .ashraf-mega-image.ashraf-mega-image-reveal { animation:none !important; }

  .ashraf-header-menu .ashraf-mega-image {
    transform:scale(1) !important;
    transform-origin:center center;
    transition:transform var(--ashraf-tile-hover-duration,var(--ashraf-image-hover-duration,2.2s)) cubic-bezier(.22,.61,.36,1) !important;
    animation:none;
  }
  .ashraf-header-menu .ashraf-mega-image-link:hover .ashraf-mega-image,
  .ashraf-header-menu .ashraf-mega-card-overlay:hover > .ashraf-mega-image-link .ashraf-mega-image {
    transform:scale(var(--ashraf-tile-hover-scale,var(--ashraf-image-hover-scale,1.035))) !important;
    transition:transform var(--ashraf-tile-hover-duration,var(--ashraf-image-hover-duration,2.2s)) cubic-bezier(.22,.61,.36,1) !important;
    animation:none !important;
  }

  /* Explicit card variables beat the generic mega-menu colour rules. */
  .ashraf-header-menu > li > .sub-menu > li.ashraf-mega-card-overlay > a:not(.ashraf-mega-image-link),
  .ashraf-header-menu > li > .sub-menu > li.ashraf-mega-card-overlay > a:not(.ashraf-mega-image-link):visited,
  .ashraf-header-menu > li > .sub-menu > li.ashraf-mega-card-overlay > .ashraf-mega-heading {
    color:var(--ashraf-tile-heading,#fff) !important;
    -webkit-text-fill-color:var(--ashraf-tile-heading,#fff) !important;
  }
  .ashraf-header-menu > li > .sub-menu > li.ashraf-mega-card-overlay > .ashraf-mega-note {
    color:var(--ashraf-tile-text,#fff) !important;
    -webkit-text-fill-color:var(--ashraf-tile-text,#fff) !important;
  }
}

/* =========================================================
   v4.5.0 — per-item typography overrides
   Blank meta values inherit the existing global design.
   ========================================================= */
@media (min-width: 981px) {
  .ashraf-header-menu > li > .sub-menu > li.ashraf-mega-column > a:not(.ashraf-mega-image-link),
  .ashraf-header-menu > li > .sub-menu > li.ashraf-mega-column > .ashraf-mega-heading {
    font-family:var(--ashraf-item-title-font,var(--ashraf-mega-heading-font))!important;
    font-size:var(--ashraf-item-title-size,var(--ashraf-mega-heading-size))!important;
    color:var(--ashraf-item-title-color,var(--ashraf-mega-text))!important;
    -webkit-text-fill-color:var(--ashraf-item-title-color,var(--ashraf-mega-text))!important;
    font-weight:var(--ashraf-item-title-weight,var(--ashraf-mega-heading-weight))!important;
    font-style:var(--ashraf-item-title-style,inherit)!important;
    letter-spacing:var(--ashraf-item-title-letter,inherit)!important;
    line-height:var(--ashraf-item-title-line,inherit)!important;
    text-transform:var(--ashraf-item-title-transform,inherit)!important;
    text-align:var(--ashraf-item-title-align,inherit)!important;
    margin-top:var(--ashraf-item-title-mt,0)!important;
    margin-bottom:var(--ashraf-item-title-mb,inherit)!important;
  }
  .ashraf-header-menu > li > .sub-menu > li.ashraf-mega-column > .ashraf-mega-note {
    font-family:var(--ashraf-item-note-font,var(--ashraf-mega-note-font))!important;
    font-size:var(--ashraf-item-note-size,var(--ashraf-mega-note-size))!important;
    color:var(--ashraf-item-note-color,var(--ashraf-mega-muted))!important;
    -webkit-text-fill-color:var(--ashraf-item-note-color,var(--ashraf-mega-muted))!important;
    font-weight:var(--ashraf-item-note-weight,var(--ashraf-mega-note-weight))!important;
    font-style:var(--ashraf-item-note-style,inherit)!important;
    letter-spacing:var(--ashraf-item-note-letter,inherit)!important;
    line-height:var(--ashraf-item-note-line,inherit)!important;
    text-transform:var(--ashraf-item-note-transform,inherit)!important;
    text-align:var(--ashraf-item-note-align,inherit)!important;
    margin-top:var(--ashraf-item-note-mt,0)!important;
    margin-bottom:var(--ashraf-item-note-mb,16px)!important;
  }
  .ashraf-header-menu > li > .sub-menu > li.ashraf-mega-column > .sub-menu a {
    font-family:var(--ashraf-item-link-font,var(--ashraf-mega-link-font))!important;
    font-size:var(--ashraf-item-link-size,var(--ashraf-mega-link-size))!important;
    color:var(--ashraf-item-link-color,var(--ashraf-mega-muted))!important;
    -webkit-text-fill-color:var(--ashraf-item-link-color,var(--ashraf-mega-muted))!important;
    font-weight:var(--ashraf-item-link-weight,var(--ashraf-mega-link-weight))!important;
    font-style:var(--ashraf-item-link-style,inherit)!important;
    letter-spacing:var(--ashraf-item-link-letter,inherit)!important;
    line-height:var(--ashraf-item-link-line,inherit)!important;
    text-transform:var(--ashraf-item-link-transform,inherit)!important;
    text-align:var(--ashraf-item-link-align,inherit)!important;
  }
  .ashraf-header-menu > li > .sub-menu > li.ashraf-mega-column > .sub-menu > li { margin-bottom:var(--ashraf-item-link-gap,inherit)!important; }
  .ashraf-mega-column.ashraf-title-bumpers > a:not(.ashraf-mega-image-link),
  .ashraf-mega-column.ashraf-title-bumpers > .ashraf-mega-heading { display:flex!important;align-items:center;gap:var(--ashraf-item-bumper-gap,8px); }
  .ashraf-mega-column.ashraf-title-bumpers > a:not(.ashraf-mega-image-link)::before,
  .ashraf-mega-column.ashraf-title-bumpers > a:not(.ashraf-mega-image-link)::after,
  .ashraf-mega-column.ashraf-title-bumpers > .ashraf-mega-heading::before,
  .ashraf-mega-column.ashraf-title-bumpers > .ashraf-mega-heading::after { content:"";display:inline-block;flex:0 0 var(--ashraf-item-bumper-width,18px);width:var(--ashraf-item-bumper-width,18px);height:var(--ashraf-item-bumper-thickness,1px);background:var(--ashraf-item-bumper-color,#9EAD91); }
  /* Per-item overrides intentionally win over image-card global defaults. */
  .ashraf-header-menu > li > .sub-menu > li.ashraf-mega-card-overlay > a:not(.ashraf-mega-image-link),
  .ashraf-header-menu > li > .sub-menu > li.ashraf-mega-card-overlay > .ashraf-mega-heading { color:var(--ashraf-item-title-color,var(--ashraf-tile-heading,#fff))!important;-webkit-text-fill-color:var(--ashraf-item-title-color,var(--ashraf-tile-heading,#fff))!important;font-size:var(--ashraf-item-title-size,var(--ashraf-tile-heading-size))!important; }
  .ashraf-header-menu > li > .sub-menu > li.ashraf-mega-card-overlay > .ashraf-mega-note { color:var(--ashraf-item-note-color,var(--ashraf-tile-text,#fff))!important;-webkit-text-fill-color:var(--ashraf-item-note-color,var(--ashraf-tile-text,#fff))!important;font-size:var(--ashraf-item-note-size,var(--ashraf-tile-text-size))!important; }
}


/* =========================================================
   v4.7.0 — role-specific global typography hierarchy
   Follow Global inherits the matching role, never a generic parent.
   ========================================================= */
@media (min-width:981px) {
  .ashraf-header-menu > li > .sub-menu > li.ashraf-mega-card-overlay > a:not(.ashraf-mega-image-link),
  .ashraf-header-menu > li > .sub-menu > li.ashraf-mega-card-overlay > .ashraf-mega-heading {
    font-family:var(--ashraf-item-title-font,var(--ashraf-tile-heading-font,var(--ashraf-mega-heading-font)))!important;
    font-size:var(--ashraf-item-title-size,var(--ashraf-tile-heading-size))!important;
    font-weight:var(--ashraf-item-title-weight,var(--ashraf-tile-heading-weight,400))!important;
    color:var(--ashraf-item-title-color,var(--ashraf-tile-heading,#fff))!important;
    -webkit-text-fill-color:var(--ashraf-item-title-color,var(--ashraf-tile-heading,#fff))!important;
  }
  .ashraf-header-menu > li > .sub-menu > li.ashraf-mega-card-overlay > .ashraf-mega-note {
    font-family:var(--ashraf-item-note-font,var(--ashraf-tile-text-font,var(--ashraf-mega-note-font)))!important;
    font-size:var(--ashraf-item-note-size,var(--ashraf-tile-text-size))!important;
    font-weight:var(--ashraf-item-note-weight,var(--ashraf-tile-text-weight,400))!important;
    color:var(--ashraf-item-note-color,var(--ashraf-tile-text,#fff))!important;
    -webkit-text-fill-color:var(--ashraf-item-note-color,var(--ashraf-tile-text,#fff))!important;
  }
}

/* =========================================================
   v5.0.0 — consolidated authoritative mega-menu interaction layer
   ========================================================= */
@media (min-width:1001px) {
  /* Full-bleed panel, centered dynamic content. */
  .ashraf-header-menu > li > .sub-menu {
    width:100vw!important; max-width:none!important;
    padding-left:max(32px,calc((100vw - var(--ashraf-mega-content-width))/2))!important;
    padding-right:max(32px,calc((100vw - var(--ashraf-mega-content-width))/2))!important;
  }

  /* Normal role hierarchy. */
  .ashraf-header-menu > li > .sub-menu > li.ashraf-mega-column > a:not(.ashraf-mega-image-link),
  .ashraf-header-menu > li > .sub-menu > li.ashraf-mega-column > .ashraf-mega-heading {
    transition:color var(--ashraf-mega-hover-duration,.25s) ease,-webkit-text-fill-color var(--ashraf-mega-hover-duration,.25s) ease,transform var(--ashraf-mega-hover-duration,.25s) ease!important;
  }
  .ashraf-header-menu > li > .sub-menu > li.ashraf-mega-column > .ashraf-mega-note {
    transition:color var(--ashraf-mega-hover-duration,.25s) ease,-webkit-text-fill-color var(--ashraf-mega-hover-duration,.25s) ease!important;
  }
  .ashraf-header-menu > li > .sub-menu > li.ashraf-mega-column > .sub-menu a {
    transition:color var(--ashraf-mega-hover-duration,.25s) ease,-webkit-text-fill-color var(--ashraf-mega-hover-duration,.25s) ease,transform var(--ashraf-mega-hover-duration,.25s) ease!important;
  }
  .ashraf-header-menu > li > .sub-menu > li.ashraf-mega-column > a:not(.ashraf-mega-image-link):hover,
  .ashraf-header-menu > li > .sub-menu > li.ashraf-mega-column > a:not(.ashraf-mega-image-link):focus-visible,
  .ashraf-header-menu > li > .sub-menu > li.ashraf-mega-column > .ashraf-mega-heading:hover {
    color:var(--ashraf-item-title-hover-color,var(--ashraf-mega-heading-hover,var(--ashraf-mega-accent)))!important;
    -webkit-text-fill-color:var(--ashraf-item-title-hover-color,var(--ashraf-mega-heading-hover,var(--ashraf-mega-accent)))!important;
  }
  .ashraf-header-menu > li > .sub-menu > li.ashraf-mega-column > .ashraf-mega-note:hover {
    color:var(--ashraf-item-note-hover-color,var(--ashraf-mega-note-hover,var(--ashraf-mega-accent)))!important;
    -webkit-text-fill-color:var(--ashraf-item-note-hover-color,var(--ashraf-mega-note-hover,var(--ashraf-mega-accent)))!important;
  }
  .ashraf-header-menu > li > .sub-menu > li.ashraf-mega-column > .sub-menu a:hover,
  .ashraf-header-menu > li > .sub-menu > li.ashraf-mega-column > .sub-menu a:focus-visible {
    color:var(--ashraf-item-link-hover-color,var(--ashraf-mega-link-hover,var(--ashraf-mega-accent)))!important;
    -webkit-text-fill-color:var(--ashraf-item-link-hover-color,var(--ashraf-mega-link-hover,var(--ashraf-mega-accent)))!important;
    transform:translateX(3px);
  }

  /* Image cards keep their own role defaults, but per-item custom values still win. */
  .ashraf-header-menu > li > .sub-menu > li.ashraf-mega-card-overlay:hover > a:not(.ashraf-mega-image-link),
  .ashraf-header-menu > li > .sub-menu > li.ashraf-mega-card-overlay:hover > .ashraf-mega-heading {
    color:var(--ashraf-item-title-hover-color,var(--ashraf-tile-heading-hover,var(--ashraf-tile-heading,#fff)))!important;
    -webkit-text-fill-color:var(--ashraf-item-title-hover-color,var(--ashraf-tile-heading-hover,var(--ashraf-tile-heading,#fff)))!important;
  }
  .ashraf-header-menu > li > .sub-menu > li.ashraf-mega-card-overlay:hover > .ashraf-mega-note,
  .ashraf-header-menu > li > .sub-menu > li.ashraf-mega-card-overlay:hover > .sub-menu a {
    color:var(--ashraf-item-note-hover-color,var(--ashraf-tile-text-hover,var(--ashraf-tile-text,#fff)))!important;
    -webkit-text-fill-color:var(--ashraf-item-note-hover-color,var(--ashraf-tile-text-hover,var(--ashraf-tile-text,#fff)))!important;
  }

  /* Same slow hover zoom language as the rest of the site. */
  .ashraf-header-menu .ashraf-mega-image {
    transform:scale(1)!important;
    transition:transform var(--ashraf-tile-hover-duration,var(--ashraf-image-hover-duration,2.2s)) cubic-bezier(.22,.61,.36,1)!important;
  }
  .ashraf-header-menu .ashraf-mega-image-link:hover .ashraf-mega-image,
  .ashraf-header-menu .ashraf-mega-card-overlay:hover > .ashraf-mega-image-link .ashraf-mega-image {
    transform:scale(var(--ashraf-tile-hover-scale,var(--ashraf-image-hover-scale,1.035)))!important;
  }
}