@import url('https://fonts.googleapis.com/css2?family=El+Messiri:wght@400..700&display=swap');

/* ============================================================
   TOPBAR — THEME 5 (Mint Meadow) — FULLY TOKENIZED
   File: ebtb6-5.css | HTML prefix: ebtb6
   Fresh mint identity:
     • pale mint-cream bar with engraved botanical rules
     • swaying mint leaves + drifting seed sparks
     • herbarium rules, archival textures, cool mint tones

   THEME IDENTITY (other sections must match when numbered 5):
     background: pale mint cream → mint gradient
     shapes:     leaf / seed / arch + engraved rules
     decor:      pressed leaf sway, drifting seeds, specimen rules
     animation:  slow leaf sway, seed drift, engraved shimmer
     fonts:      Fraunces (botanical serif) + Amiri (Arabic)
     ============================================================ */

.ebtb6-bar {
  /* =========================================================
     GLOBAL / CORE
     ========================================================= */
  --ebtb6-font-family: 'El Messiri', sans-serif;
  --ebtb6-font-family-accent: 'El Messiri', sans-serif;

  --ebtb6-animation-ease: cubic-bezier(0.4, 0, 0.2, 1);
  --ebtb6-animation-infinite: infinite;
  --ebtb6-animation-alternate: alternate;
  --ebtb6-animation-alternate-reverse: alternate-reverse;
  --ebtb6-animation-linear: linear;

  --ebtb6-spacing-gap-xs: 0.45rem;
  --ebtb6-spacing-gap-sm: 0.6rem;
  --ebtb6-spacing-gap-md: 0.85rem;
  --ebtb6-spacing-gap-lg: 1.15rem;

  --ebtb6-blur-glass: 6px;
  --ebtb6-blur-shell: 40px;
  --ebtb6-radius-pill: 999px;
  --ebtb6-radius-circle: 50%;
  --ebtb6-radius-card: 8px;
  --ebtb6-radius-chip: 4px;

  --ebtb6-transition-duration: 0.3s;

  /* =========================================================
     COLORS — SECTION
     ========================================================= */
  --ebtb6-bar-background: linear-gradient(180deg, #f2fbf7 0%, #e6f6f0 55%, #d9f0e8 100%);
  --ebtb6-shell-orb-a-background: radial-gradient(circle, rgba(120, 205, 170, 0.3), transparent 70%);
  --ebtb6-shell-orb-b-background: radial-gradient(circle, rgba(80, 170, 140, 0.2), transparent 70%);
  --ebtb6-shell-shard-a-background: linear-gradient(135deg, #5cb894, #3e8f70);
  --ebtb6-shell-shard-b-background: linear-gradient(135deg, #82cdb0, #52a787);
  --ebtb6-shell-spark-a-background: #2f8a68;
  --ebtb6-shell-spark-b-background: #5cb894;
  --ebtb6-shell-spark-c-background: #2f8a68;
  --ebtb6-shell-line-a-background: repeating-linear-gradient(90deg, rgba(47, 138, 104, 0.45) 0 1px, transparent 1px 12px);
  --ebtb6-shell-line-b-background: linear-gradient(90deg, transparent, rgba(47, 138, 104, 0.35), transparent);

  /* =========================================================
     COLORS — RAIL
     ========================================================= */
  --ebtb6-rail-top-background: linear-gradient(90deg, transparent, rgba(47, 138, 104, 0.4), transparent);
  --ebtb6-rail-bottom-background: linear-gradient(90deg, transparent, rgba(47, 138, 104, 0.4), transparent);

  /* =========================================================
     COLORS — STATUS
     ========================================================= */
  --ebtb6-status-background: rgba(255, 255, 255, 0.55);
  --ebtb6-status-hover-background: rgba(120, 205, 170, 0.22);
  --ebtb6-status-color: #2f7a5e;
  --ebtb6-status-dot-background: #3fae83;
  --ebtb6-status-shadow: 0 1px 0 rgba(255, 255, 255, 0.7) inset, 0 1px 3px rgba(47, 138, 104, 0.12);

  /* =========================================================
     COLORS — TICKER
     ========================================================= */
  --ebtb6-ticker-background: transparent;
  --ebtb6-ticker-tag-background: rgba(47, 138, 104, 0.1);
  --ebtb6-ticker-tag-color: #2f7a5e;
  --ebtb6-ticker-text-color: #3f7a62;
  --ebtb6-ticker-shadow: none;

  /* =========================================================
     COLORS — CONTACT
     ========================================================= */
  --ebtb6-contact-ico-color: #3fae83;
  --ebtb6-contact-value-color: #2f7a5e;
  --ebtb6-contact-link-hover-color: #2f8a68;
  --ebtb6-contact-link-background: transparent;
  --ebtb6-contact-link-hover-background: rgba(47, 138, 104, 0.06);
  --ebtb6-contact-sep-background: #3fae83;

  /* =========================================================
     COLORS — SOCIAL
     ========================================================= */
  --ebtb6-social-link-background: rgba(255, 255, 255, 0.5);
  --ebtb6-social-link-color: #2f7a5e;
  --ebtb6-social-link-hover-background: #3fae83;
  --ebtb6-social-link-hover-color: #ffffff;

  /* =========================================================
     COLORS — CTA
     ========================================================= */
  --ebtb6-cta-background: linear-gradient(180deg, #3fae83, #2e8a68);
  --ebtb6-cta-color: #ffffff;
  --ebtb6-cta-hover-background: linear-gradient(180deg, #57bd93, #359a75);
  --ebtb6-cta-hover-color: #ffffff;
  --ebtb6-cta-shadow: 0 4px 14px rgba(47, 138, 104, 0.25);
  --ebtb6-cta-hover-shadow: 0 6px 18px rgba(47, 138, 104, 0.35);

  /* =========================================================
     TYPOGRAPHY
     ========================================================= */
  --ebtb6-bar-font-size: 0.84rem;
  --ebtb6-bar-font-weight: 400;
  --ebtb6-bar-letter-spacing: 0.02em;

  --ebtb6-status-font-size: 0.76rem;
  --ebtb6-status-font-weight: 600;

  --ebtb6-ticker-tag-font-size: 0.72rem;
  --ebtb6-ticker-tag-font-weight: 700;
  --ebtb6-ticker-text-font-size: 0.78rem;

  --ebtb6-contact-font-size: 0.84rem;
  --ebtb6-contact-icon-font-size: 0.72rem;

  --ebtb6-social-icon-font-size: 0.78rem;

  --ebtb6-cta-font-size: 0.76rem;
  --ebtb6-cta-font-weight: 700;
  --ebtb6-cta-text-transform: uppercase;

  /* =========================================================
     SPACING
     ========================================================= */
  --ebtb6-bar-min-height: 46px;
  --ebtb6-bar-padding-y: 0;
  --ebtb6-bar-padding-x: 1.2rem;
  --ebtb6-bar-margin: 0;

  --ebtb6-track-gap: 1.15rem;

  --ebtb6-status-padding-y: 0.35rem;
  --ebtb6-status-padding-x: 0.8rem;
  --ebtb6-status-gap: 0.5rem;
  --ebtb6-status-dot-width: 8px;
  --ebtb6-status-dot-height: 8px;

  --ebtb6-ticker-gap: 0.7rem;
  --ebtb6-ticker-flex-basis: 380px;
  --ebtb6-ticker-padding-y: 0.25rem;
  --ebtb6-ticker-padding-x: 0.6rem;

  --ebtb6-contact-gap: 1.15rem;
  --ebtb6-contact-link-gap: 0.45rem;
  --ebtb6-contact-link-padding-y: 0.4rem;
  --ebtb6-contact-link-padding-x: 0.4rem;
  --ebtb6-contact-sep-width: 7px;
  --ebtb6-contact-sep-height: 7px;

  --ebtb6-social-gap: 0.5rem;
  --ebtb6-social-link-size: 30px;

  --ebtb6-cta-gap: 0.5rem;
  --ebtb6-cta-padding-y: 0.5rem;
  --ebtb6-cta-padding-x: 1.05rem;

  /* =========================================================
     LAYOUT
     ========================================================= */
  --ebtb6-bar-position: relative;
  --ebtb6-bar-display: flex;
  --ebtb6-bar-align-items: center;
  --ebtb6-bar-z-index: 900;
  --ebtb6-bar-overflow: hidden;
  --ebtb6-bar-isolation: isolate;

  --ebtb6-shell-position: absolute;
  --ebtb6-shell-inset: 0;
  --ebtb6-shell-z-index: 0;
  --ebtb6-shell-overflow: hidden;
  --ebtb6-shell-pointer-events: none;

  --ebtb6-decor-position: absolute;

  --ebtb6-shell-orb-a-width: 360px;
  --ebtb6-shell-orb-a-height: 360px;
  --ebtb6-shell-orb-a-top: -200px;
  --ebtb6-shell-orb-a-inline-start: -120px;

  --ebtb6-shell-orb-b-width: 300px;
  --ebtb6-shell-orb-b-height: 300px;
  --ebtb6-shell-orb-b-bottom: -180px;
  --ebtb6-shell-orb-b-inline-end: -90px;

  --ebtb6-shell-shard-a-width: 46px;
  --ebtb6-shell-shard-a-height: 30px;
  --ebtb6-shell-shard-a-top: 8px;
  --ebtb6-shell-shard-a-inline-end: 120px;
  --ebtb6-shell-shard-a-rotate: -16deg;

  --ebtb6-shell-shard-b-width: 14px;
  --ebtb6-shell-shard-b-height: 22px;
  --ebtb6-shell-shard-b-top: 14px;
  --ebtb6-shell-shard-b-inline-start: 96px;
  --ebtb6-shell-shard-b-rotate: 40deg;

  --ebtb6-shell-spark-a-width: 6px;
  --ebtb6-shell-spark-a-height: 6px;
  --ebtb6-shell-spark-a-top: 22px;
  --ebtb6-shell-spark-a-inline-end: 86px;

  --ebtb6-shell-spark-b-width: 5px;
  --ebtb6-shell-spark-b-height: 5px;
  --ebtb6-shell-spark-b-bottom: 12px;
  --ebtb6-shell-spark-b-inline-end: 40%;

  --ebtb6-shell-spark-c-width: 7px;
  --ebtb6-shell-spark-c-height: 7px;
  --ebtb6-shell-spark-c-top: 12px;
  --ebtb6-shell-spark-c-inline-start: 26%;

  --ebtb6-shell-line-a-width: 100%;
  --ebtb6-shell-line-a-height: 1px;
  --ebtb6-shell-line-a-bottom: 16px;
  --ebtb6-shell-line-a-inset-inline: 0;
  --ebtb6-shell-line-a-opacity: 0.8;

  --ebtb6-shell-line-b-width: 78%;
  --ebtb6-shell-line-b-height: 1px;
  --ebtb6-shell-line-b-top: 10px;
  --ebtb6-shell-line-b-inline-start: 11%;
  --ebtb6-shell-line-b-opacity: 0.55;

  --ebtb6-rail-top-position: absolute;
  --ebtb6-rail-top-top: 0;
  --ebtb6-rail-top-inset-inline: 0;
  --ebtb6-rail-top-height: 1px;

  --ebtb6-rail-bottom-position: absolute;
  --ebtb6-rail-bottom-bottom: 0;
  --ebtb6-rail-bottom-inset-inline: 0;
  --ebtb6-rail-bottom-height: 1px;

  --ebtb6-track-display: flex;
  --ebtb6-track-align-items: center;
  --ebtb6-track-justify-content: space-between;
  --ebtb6-track-width: 100%;
  --ebtb6-track-max-width: 1340px;
  --ebtb6-track-margin-inline: auto;
  --ebtb6-track-position: relative;
  --ebtb6-track-z-index: 1;

  --ebtb6-status-order: 0;
  --ebtb6-status-display: inline-flex;
  --ebtb6-status-align-items: center;
  --ebtb6-status-flex-shrink: 0;
  --ebtb6-status-text-decoration: none;

  --ebtb6-ticker-order: 1;
  --ebtb6-ticker-display: flex;
  --ebtb6-ticker-align-items: center;
  --ebtb6-ticker-flex-grow: 1;
  --ebtb6-ticker-flex-shrink: 1;
  --ebtb6-ticker-overflow: hidden;
  --ebtb6-ticker-move-display: flex;
  --ebtb6-ticker-move-flex-wrap: nowrap;
  --ebtb6-ticker-run-display: inline-flex;
  --ebtb6-ticker-run-align-items: center;

  --ebtb6-contact-order: 2;
  --ebtb6-contact-display: flex;
  --ebtb6-contact-align-items: center;
  --ebtb6-contact-flex-shrink: 0;
  --ebtb6-contact-link-display: inline-flex;
  --ebtb6-contact-link-align-items: center;
  --ebtb6-contact-link-text-decoration: none;
  --ebtb6-contact-link-white-space: nowrap;

  --ebtb6-social-order: 3;
  --ebtb6-social-display: flex;
  --ebtb6-social-align-items: center;
  --ebtb6-social-list-style: none;
  --ebtb6-social-flex-shrink: 0;
  --ebtb6-social-item-display: flex;
  --ebtb6-social-link-display: flex;
  --ebtb6-social-link-align-items: center;
  --ebtb6-social-link-justify-content: center;
  --ebtb6-social-link-text-decoration: none;

  --ebtb6-cta-order: 4;
  --ebtb6-cta-display: inline-flex;
  --ebtb6-cta-align-items: center;
  --ebtb6-cta-flex-shrink: 0;
  --ebtb6-cta-text-decoration: none;
  --ebtb6-cta-white-space: nowrap;

  /* =========================================================
     BORDER
     ========================================================= */
  --ebtb6-bar-border: 1px solid rgba(47, 138, 104, 0.18);
  --ebtb6-bar-border-radius: 0;

  --ebtb6-status-border: 1px solid rgba(47, 138, 104, 0.22);
  --ebtb6-status-border-radius: 4px;

  --ebtb6-ticker-border: none;
  --ebtb6-ticker-border-radius: 0;

  --ebtb6-contact-link-border: none;
  --ebtb6-contact-link-border-radius: 2px;

  --ebtb6-social-link-border: 1px solid rgba(47, 138, 104, 0.28);
  --ebtb6-social-link-border-radius: 4px;

  --ebtb6-cta-border: 1px solid rgba(47, 138, 104, 0.55);
  --ebtb6-cta-border-radius: 3px;

  /* =========================================================
     SHADOW
     ========================================================= */
  --ebtb6-bar-shadow: 0 4px 14px rgba(47, 138, 104, 0.18);
  --ebtb6-cta-shadow: 0 4px 14px rgba(47, 138, 104, 0.25);
  --ebtb6-cta-hover-shadow: 0 6px 18px rgba(47, 138, 104, 0.35);

  /* =========================================================
     ANIMATION — DURATIONS / DELAYS / KEYFRAME VALUES
     ========================================================= */
  --ebtb6-animation-orb-a-duration: 5s;
  --ebtb6-animation-orb-b-duration: 7s;
  --ebtb6-animation-shard-a-duration: 6s;
  --ebtb6-animation-shard-b-duration: 5.5s;
  --ebtb6-animation-spark-a-duration: 4s;
  --ebtb6-animation-spark-a-delay: 0s;
  --ebtb6-animation-spark-b-duration: 5s;
  --ebtb6-animation-spark-b-delay: 1.2s;
  --ebtb6-animation-spark-c-duration: 4.5s;
  --ebtb6-animation-spark-c-delay: 0.6s;
  --ebtb6-animation-sheen-duration: 9s;
  --ebtb6-animation-ticker-duration: 34s;

  --ebtb6-animation-orb-a-translate-x: 0px;
  --ebtb6-animation-orb-a-translate-y: 10px;
  --ebtb6-animation-orb-a-scale: 1.08;
  --ebtb6-animation-orb-b-translate-x: -8px;
  --ebtb6-animation-orb-b-translate-y: -8px;
  --ebtb6-animation-orb-b-scale: 1.05;

  --ebtb6-animation-leaf-rotate-start: -24deg;
  --ebtb6-animation-leaf-rotate-end: -8deg;
  --ebtb6-animation-leaf-b-rotate-start: 32deg;
  --ebtb6-animation-leaf-b-rotate-end: 48deg;

  --ebtb6-animation-spark-scale-start: 1;
  --ebtb6-animation-spark-scale-end: 0.6;
  --ebtb6-animation-spark-opacity-start: 0;
  --ebtb6-animation-spark-opacity-visible: 0.7;
  --ebtb6-animation-spark-opacity-end: 0;
  --ebtb6-animation-spark-rise-distance: -46px;

  --ebtb6-animation-ticker-translate-start: 0;
  --ebtb6-animation-ticker-translate-end: -50%;

  /* =========================================================
     REVEAL / TRANSITIONS
     ========================================================= */
  --ebtb6-reveal-opacity-start: 0;
  --ebtb6-reveal-opacity-end: 1;
  --ebtb6-reveal-translate-distance: 12px;
  --ebtb6-reveal-transition-duration: 0.6s;
  --ebtb6-status-transition-duration: var(--ebtb6-transition-duration);
  --ebtb6-contact-transition-duration: var(--ebtb6-transition-duration);
  --ebtb6-social-transition-duration: var(--ebtb6-transition-duration);
  --ebtb6-cta-transition-duration: var(--ebtb6-transition-duration);
  --ebtb6-hover-lift-distance: -2px;

  /* =========================================================
     RESPONSIVE — BREAKPOINT TOKENS
     ========================================================= */
  --ebtb6-track-gap-mobile: 0.9rem;
  --ebtb6-bar-padding-x-mobile: 0.9rem;
  --ebtb6-contact-font-size-mobile: 0.76rem;
  --ebtb6-social-link-size-mobile: 28px;
  --ebtb6-cta-padding-x-mobile: 0.9rem;
  --ebtb6-status-font-size-mobile: 0.7rem;

  /* =========================================================
     BASE RULES (desktop)
     ========================================================= */
  position: var(--ebtb6-bar-position);
  display: var(--ebtb6-bar-display);
  align-items: var(--ebtb6-bar-align-items);
  min-height: var(--ebtb6-bar-min-height);
  padding: var(--ebtb6-bar-padding-y) var(--ebtb6-bar-padding-x);
  margin: var(--ebtb6-bar-margin);
  background: var(--ebtb6-bar-background);
  font-family: "El Messiri", sans-serif;
  font-size: var(--ebtb6-bar-font-size);
  font-weight: var(--ebtb6-bar-font-weight);
  letter-spacing: var(--ebtb6-bar-letter-spacing);
  border: var(--ebtb6-bar-border);
  border-radius: var(--ebtb6-bar-border-radius);
  box-shadow: var(--ebtb6-bar-shadow);
  z-index: var(--ebtb6-bar-z-index);
  overflow: var(--ebtb6-bar-overflow);
  isolation: var(--ebtb6-bar-isolation);
}

/* ============================ SHELL ============================ */
.ebtb6-shell {
  position: var(--ebtb6-shell-position);
  inset: var(--ebtb6-shell-inset);
  z-index: var(--ebtb6-shell-z-index);
  overflow: var(--ebtb6-shell-overflow);
  pointer-events: var(--ebtb6-shell-pointer-events);
}

.ebtb6-shell-orb {
  position: var(--ebtb6-decor-position);
  border-radius: var(--ebtb6-radius-circle);
  filter: blur(var(--ebtb6-blur-shell));
}
.ebtb6-shell-orb-a {
  width: var(--ebtb6-shell-orb-a-width);
  height: var(--ebtb6-shell-orb-a-height);
  top: var(--ebtb6-shell-orb-a-top);
  inset-inline-start: var(--ebtb6-shell-orb-a-inline-start);
  background: var(--ebtb6-shell-orb-a-background);
  animation-name: eb6-orb-a;
  animation-duration: var(--ebtb6-animation-orb-a-duration);
  animation-timing-function: var(--ebtb6-animation-ease);
  animation-iteration-count: var(--ebtb6-animation-infinite);
  animation-direction: var(--ebtb6-animation-alternate);
}
.ebtb6-shell-orb-b {
  width: var(--ebtb6-shell-orb-b-width);
  height: var(--ebtb6-shell-orb-b-height);
  bottom: var(--ebtb6-shell-orb-b-bottom);
  inset-inline-end: var(--ebtb6-shell-orb-b-inline-end);
  background: var(--ebtb6-shell-orb-b-background);
  animation-name: eb6-orb-b;
  animation-duration: var(--ebtb6-animation-orb-b-duration);
  animation-timing-function: var(--ebtb6-animation-ease);
  animation-iteration-count: var(--ebtb6-animation-infinite);
  animation-direction: var(--ebtb6-animation-alternate-reverse);
}

.ebtb6-shell-shard {
  position: var(--ebtb6-decor-position);
}
.ebtb6-shell-shard-a {
  width: var(--ebtb6-shell-shard-a-width);
  height: var(--ebtb6-shell-shard-a-height);
  top: var(--ebtb6-shell-shard-a-top);
  inset-inline-end: var(--ebtb6-shell-shard-a-inline-end);
  border-radius: 70% 0 70% 0;
  background: var(--ebtb6-shell-shard-a-background);
  transform: rotate(var(--ebtb6-shell-shard-a-rotate));
  animation-name: eb6-leaf;
  animation-duration: var(--ebtb6-animation-shard-a-duration);
  animation-timing-function: var(--ebtb6-animation-ease);
  animation-iteration-count: var(--ebtb6-animation-infinite);
  animation-direction: var(--ebtb6-animation-alternate);
}
.ebtb6-shell-shard-b {
  width: var(--ebtb6-shell-shard-b-width);
  height: var(--ebtb6-shell-shard-b-height);
  top: var(--ebtb6-shell-shard-b-top);
  inset-inline-start: var(--ebtb6-shell-shard-b-inline-start);
  border-radius: var(--ebtb6-radius-circle);
  background: var(--ebtb6-shell-shard-b-background);
  transform: rotate(var(--ebtb6-shell-shard-b-rotate));
  animation-name: eb6-leaf-b;
  animation-duration: var(--ebtb6-animation-shard-b-duration);
  animation-timing-function: var(--ebtb6-animation-ease);
  animation-iteration-count: var(--ebtb6-animation-infinite);
  animation-direction: var(--ebtb6-animation-alternate);
}

.ebtb6-shell-spark {
  position: var(--ebtb6-decor-position);
  border-radius: var(--ebtb6-radius-circle);
  box-shadow: 0 0 10px 1px rgba(63, 174, 131, 0.4);
}
.ebtb6-shell-spark-a {
  width: var(--ebtb6-shell-spark-a-width);
  height: var(--ebtb6-shell-spark-a-height);
  top: var(--ebtb6-shell-spark-a-top);
  inset-inline-end: var(--ebtb6-shell-spark-a-inline-end);
  background: var(--ebtb6-shell-spark-a-background);
  animation-name: eb6-seed;
  animation-duration: var(--ebtb6-animation-spark-a-duration);
  animation-delay: var(--ebtb6-animation-spark-a-delay);
  animation-timing-function: var(--ebtb6-animation-ease);
  animation-iteration-count: var(--ebtb6-animation-infinite);
}
.ebtb6-shell-spark-b {
  width: var(--ebtb6-shell-spark-b-width);
  height: var(--ebtb6-shell-spark-b-height);
  bottom: var(--ebtb6-shell-spark-b-bottom);
  inset-inline-end: var(--ebtb6-shell-spark-b-inline-end);
  background: var(--ebtb6-shell-spark-b-background);
  animation-name: eb6-seed;
  animation-duration: var(--ebtb6-animation-spark-b-duration);
  animation-delay: var(--ebtb6-animation-spark-b-delay);
  animation-timing-function: var(--ebtb6-animation-ease);
  animation-iteration-count: var(--ebtb6-animation-infinite);
}
.ebtb6-shell-spark-c {
  width: var(--ebtb6-shell-spark-c-width);
  height: var(--ebtb6-shell-spark-c-height);
  top: var(--ebtb6-shell-spark-c-top);
  inset-inline-start: var(--ebtb6-shell-spark-c-inline-start);
  background: var(--ebtb6-shell-spark-c-background);
  animation-name: eb6-seed;
  animation-duration: var(--ebtb6-animation-spark-c-duration);
  animation-delay: var(--ebtb6-animation-spark-c-delay);
  animation-timing-function: var(--ebtb6-animation-ease);
  animation-iteration-count: var(--ebtb6-animation-infinite);
}

.ebtb6-shell-line-a {
  position: var(--ebtb6-decor-position);
  width: var(--ebtb6-shell-line-a-width);
  height: var(--ebtb6-shell-line-a-height);
  bottom: var(--ebtb6-shell-line-a-bottom);
  inset-inline: var(--ebtb6-shell-line-a-inset-inline);
  opacity: var(--ebtb6-shell-line-a-opacity);
  background: var(--ebtb6-shell-line-a-background);
  background-size: 12px 1px;
  animation-name: eb6-sheen;
  animation-duration: var(--ebtb6-animation-sheen-duration);
  animation-timing-function: var(--ebtb6-animation-linear);
  animation-iteration-count: var(--ebtb6-animation-infinite);
}
.ebtb6-shell-line-b {
  position: var(--ebtb6-decor-position);
  width: var(--ebtb6-shell-line-b-width);
  height: var(--ebtb6-shell-line-b-height);
  top: var(--ebtb6-shell-line-b-top);
  inset-inline-start: var(--ebtb6-shell-line-b-inline-start);
  opacity: var(--ebtb6-shell-line-b-opacity);
  background: var(--ebtb6-shell-line-b-background);
}

/* ============================ RAIL ============================ */
.ebtb6-rail-top {
  position: var(--ebtb6-rail-top-position);
  top: var(--ebtb6-rail-top-top);
  inset-inline: var(--ebtb6-rail-top-inset-inline);
  height: var(--ebtb6-rail-top-height);
  background: var(--ebtb6-rail-top-background);
}
.ebtb6-rail-bottom {
  position: var(--ebtb6-rail-bottom-position);
  bottom: var(--ebtb6-rail-bottom-bottom);
  inset-inline: var(--ebtb6-rail-bottom-inset-inline);
  height: var(--ebtb6-rail-bottom-height);
  background: var(--ebtb6-rail-bottom-background);
}

/* ============================ TRACK ============================ */
.ebtb6-track {
  display: var(--ebtb6-track-display);
  align-items: var(--ebtb6-track-align-items);
  justify-content: var(--ebtb6-track-justify-content);
  gap: var(--ebtb6-track-gap);
  width: var(--ebtb6-track-width);
  max-width: var(--ebtb6-track-max-width);
  margin-inline: var(--ebtb6-track-margin-inline);
  position: var(--ebtb6-track-position);
  z-index: var(--ebtb6-track-z-index);
}

/* ============================ STATUS ============================ */
.ebtb6-status {
  order: var(--ebtb6-status-order);
  display: var(--ebtb6-status-display);
  align-items: var(--ebtb6-status-align-items);
  gap: var(--ebtb6-status-gap);
  flex-shrink: var(--ebtb6-status-flex-shrink);
  padding: var(--ebtb6-status-padding-y) var(--ebtb6-status-padding-x);
  border: var(--ebtb6-status-border);
  border-radius: var(--ebtb6-status-border-radius);
  background: var(--ebtb6-status-background);
  box-shadow: var(--ebtb6-status-shadow);
  color: var(--ebtb6-status-color);
  font-family: "El Messiri", sans-serif;
  font-size: var(--ebtb6-status-font-size);
  font-weight: var(--ebtb6-status-font-weight);
  text-decoration: var(--ebtb6-status-text-decoration);
  transition: all var(--ebtb6-status-transition-duration) var(--ebtb6-animation-ease);
}
.ebtb6-status:hover { background: var(--ebtb6-status-hover-background); }
.ebtb6-status-dot {
  width: var(--ebtb6-status-dot-width);
  height: var(--ebtb6-status-dot-height);
  border-radius: var(--ebtb6-radius-circle);
  background: var(--ebtb6-status-dot-background);
  box-shadow: 0 0 0 3px rgba(63, 174, 131, 0.16);
}

/* ============================ TICKER ============================ */
.ebtb6-ticker {
  order: var(--ebtb6-ticker-order);
  display: var(--ebtb6-ticker-display);
  align-items: var(--ebtb6-ticker-align-items);
  gap: var(--ebtb6-ticker-gap);
  flex-grow: var(--ebtb6-ticker-flex-grow);
  flex-shrink: var(--ebtb6-ticker-flex-shrink);
  flex-basis: var(--ebtb6-ticker-flex-basis);
  padding: var(--ebtb6-ticker-padding-y) var(--ebtb6-ticker-padding-x);
  border: var(--ebtb6-ticker-border);
  border-radius: var(--ebtb6-ticker-border-radius);
  background: var(--ebtb6-ticker-background);
  box-shadow: var(--ebtb6-ticker-shadow);
  overflow: var(--ebtb6-ticker-overflow);
}
.ebtb6-ticker-tag {
  display: var(--ebtb6-ticker-run-display);
  align-items: var(--ebtb6-ticker-align-items);
  gap: var(--ebtb6-spacing-gap-xs);
  flex-shrink: 0;
  padding: 0.2rem 0.55rem;
  border-radius: var(--ebtb6-radius-chip);
  background: var(--ebtb6-ticker-tag-background);
  color: var(--ebtb6-ticker-tag-color);
  font-size: var(--ebtb6-ticker-tag-font-size);
  font-weight: var(--ebtb6-ticker-tag-font-weight);
}
.ebtb6-ticker-tag i { font-size: var(--ebtb6-ticker-tag-font-size); }
.ebtb6-ticker-move {
  display: var(--ebtb6-ticker-move-display);
  flex-wrap: var(--ebtb6-ticker-move-flex-wrap);
  animation-name: eb6-ticker;
  animation-duration: var(--ebtb6-animation-ticker-duration);
  animation-timing-function: var(--ebtb6-animation-linear);
  animation-iteration-count: var(--ebtb6-animation-infinite);
}
.ebtb6-ticker-run {
  display: var(--ebtb6-ticker-run-display);
  flex-shrink: 0;
  white-space: nowrap;
  color: var(--ebtb6-ticker-text-color);
  font-size: var(--ebtb6-ticker-text-font-size);
}
.ebtb6-bar:hover .ebtb6-ticker-move { animation-play-state: paused; }

/* ============================ CONTACT ============================ */
.ebtb6-contact {
  order: var(--ebtb6-contact-order);
  display: var(--ebtb6-contact-display);
  align-items: var(--ebtb6-contact-align-items);
  gap: var(--ebtb6-contact-gap);
  flex-shrink: var(--ebtb6-contact-flex-shrink);
}
.ebtb6-contact-link {
  display: var(--ebtb6-contact-link-display);
  align-items: var(--ebtb6-contact-link-align-items);
  gap: var(--ebtb6-contact-link-gap);
  padding: var(--ebtb6-contact-link-padding-y) var(--ebtb6-contact-link-padding-x);
  border: var(--ebtb6-contact-link-border);
  border-radius: var(--ebtb6-contact-link-border-radius);
  background: var(--ebtb6-contact-link-background);
  color: var(--ebtb6-contact-value-color);
  font-family: "El Messiri", sans-serif;
  font-size: var(--ebtb6-contact-font-size);
  text-decoration: var(--ebtb6-contact-link-text-decoration);
  white-space: var(--ebtb6-contact-link-white-space);
  transition: all var(--ebtb6-contact-transition-duration) var(--ebtb6-animation-ease);
}
.ebtb6-contact-link:hover {
  background: var(--ebtb6-contact-link-hover-background);
  color: var(--ebtb6-contact-link-hover-color);
  transform: translateY(var(--ebtb6-hover-lift-distance));
}
.ebtb6-contact-ico { font-size: var(--ebtb6-contact-icon-font-size); color: var(--ebtb6-contact-ico-color); }
.ebtb6-contact-sep {
  width: var(--ebtb6-contact-sep-width);
  height: var(--ebtb6-contact-sep-height);
  border-radius: var(--ebtb6-radius-chip);
  background: var(--ebtb6-contact-sep-background);
  transform: rotate(45deg);
}

/* ============================ SOCIAL ============================ */
.ebtb6-social {
  order: var(--ebtb6-social-order);
  display: var(--ebtb6-social-display);
  align-items: var(--ebtb6-social-align-items);
  gap: var(--ebtb6-social-gap);
  list-style: var(--ebtb6-social-list-style);
  margin: 0;
  padding: 0;
  flex-shrink: var(--ebtb6-social-flex-shrink);
}
.ebtb6-social-item { display: var(--ebtb6-social-item-display); }
.ebtb6-social-link {
  display: var(--ebtb6-social-link-display);
  align-items: var(--ebtb6-social-link-align-items);
  justify-content: var(--ebtb6-social-link-justify-content);
  width: var(--ebtb6-social-link-size);
  height: var(--ebtb6-social-link-size);
  border: var(--ebtb6-social-link-border);
  border-radius: var(--ebtb6-social-link-border-radius);
  background: var(--ebtb6-social-link-background);
  color: var(--ebtb6-social-link-color);
  font-size: var(--ebtb6-social-icon-font-size);
  text-decoration: var(--ebtb6-social-link-text-decoration);
  transition: all var(--ebtb6-social-transition-duration) var(--ebtb6-animation-ease);
}
.ebtb6-social-link:hover {
  background: var(--ebtb6-social-link-hover-background);
  color: var(--ebtb6-social-link-hover-color);
  transform: translateY(var(--ebtb6-hover-lift-distance));
}

/* ============================ CTA ============================ */
.ebtb6-cta {
  order: var(--ebtb6-cta-order);
  display: var(--ebtb6-cta-display);
  align-items: var(--ebtb6-cta-align-items);
  gap: var(--ebtb6-cta-gap);
  flex-shrink: var(--ebtb6-cta-flex-shrink);
  padding: var(--ebtb6-cta-padding-y) var(--ebtb6-cta-padding-x);
  border: var(--ebtb6-cta-border);
  border-radius: var(--ebtb6-cta-border-radius);
  background: var(--ebtb6-cta-background);
  box-shadow: var(--ebtb6-cta-shadow);
  color: var(--ebtb6-cta-color);
  font-family: "El Messiri", sans-serif;
  font-size: var(--ebtb6-cta-font-size);
  font-weight: var(--ebtb6-cta-font-weight);
  text-transform: var(--ebtb6-cta-text-transform);
  text-decoration: var(--ebtb6-cta-text-decoration);
  white-space: var(--ebtb6-cta-white-space);
  transition: all var(--ebtb6-cta-transition-duration) var(--ebtb6-animation-ease);
}
.ebtb6-cta:hover {
  background: var(--ebtb6-cta-hover-background);
  color: var(--ebtb6-cta-hover-color);
  box-shadow: var(--ebtb6-cta-hover-shadow);
  transform: translateY(var(--ebtb6-hover-lift-distance));
}
.ebtb6-cta-arrow { font-size: var(--ebtb6-cta-font-size); }

/* ============================ REVEAL ============================ */
.ebtb6-reveal {
  opacity: var(--ebtb6-reveal-opacity-start);
  transform: translateY(var(--ebtb6-reveal-translate-distance));
  transition: opacity var(--ebtb6-reveal-transition-duration) var(--ebtb6-animation-ease),
    transform var(--ebtb6-reveal-transition-duration) var(--ebtb6-animation-ease);
}
.ebtb6-reveal.ebtb6-in {
  opacity: var(--ebtb6-reveal-opacity-end);
  transform: translateY(0);
}

/* ============================ KEYFRAMES ============================ */
@keyframes eb6-orb-a {
  0% { transform: translate(0, 0) scale(1); }
  100% { transform: translate(var(--ebtb6-animation-orb-a-translate-x), var(--ebtb6-animation-orb-a-translate-y)) scale(var(--ebtb6-animation-orb-a-scale)); }
}
@keyframes eb6-orb-b {
  0% { transform: scale(1); }
  100% { transform: translate(var(--ebtb6-animation-orb-b-translate-x), var(--ebtb6-animation-orb-b-translate-y)) scale(var(--ebtb6-animation-orb-b-scale)); }
}
@keyframes eb6-leaf {
  0% { transform: rotate(var(--ebtb6-animation-leaf-rotate-start)) translateX(2px); }
  100% { transform: rotate(var(--ebtb6-animation-leaf-rotate-end)) translateX(-2px); }
}
@keyframes eb6-leaf-b {
  0% { transform: rotate(var(--ebtb6-animation-leaf-b-rotate-start)) translateY(1px); }
  100% { transform: rotate(var(--ebtb6-animation-leaf-b-rotate-end)) translateY(-2px); }
}
@keyframes eb6-seed {
  0% { transform: translateY(0) scale(var(--ebtb6-animation-spark-scale-start)); opacity: var(--ebtb6-animation-spark-opacity-start); }
  18% { opacity: var(--ebtb6-animation-spark-opacity-visible); }
  100% { transform: translateY(var(--ebtb6-animation-spark-rise-distance)) scale(var(--ebtb6-animation-spark-scale-end)); opacity: var(--ebtb6-animation-spark-opacity-end); }
}
@keyframes eb6-sheen {
  0% { background-position-x: 0; }
  100% { background-position-x: 24px; }
}
@keyframes eb6-ticker {
  0% { transform: translateX(var(--ebtb6-animation-ticker-translate-start)); }
  100% { transform: translateX(var(--ebtb6-animation-ticker-translate-end)); }
}

/* ============================================================
   RESPONSIVE
   ============================================================ */
/* Mini Screen */
@media (max-width: 320px) {
  .ebtb6-bar {
    --ebtb6-track-gap: var(--ebtb6-track-gap-mobile);
    --ebtb6-bar-padding-x: var(--ebtb6-bar-padding-x-mobile);
    --ebtb6-contact-font-size: var(--ebtb6-contact-font-size-mobile);
    --ebtb6-social-link-size: var(--ebtb6-social-link-size-mobile);
    --ebtb6-cta-padding-x: var(--ebtb6-cta-padding-x-mobile);
    --ebtb6-status-font-size: var(--ebtb6-status-font-size-mobile);
  }
  .ebtb6-status,
  .ebtb6-ticker,
  .ebtb6-social,
  .eb6-c-wa { display: none !important; }
  .ebtb6-shell-shard-a,
  .ebtb6-shell-shard-b,
  .ebtb6-shell-spark-a,
  .ebtb6-shell-spark-b,
  .ebtb6-shell-spark-c { display: none !important; }
}
/* Small Phone */
@media (min-width: 321px) and (max-width: 375px) {
  .ebtb6-bar {
    --ebtb6-track-gap: var(--ebtb6-track-gap-mobile);
    --ebtb6-bar-padding-x: var(--ebtb6-bar-padding-x-mobile);
    --ebtb6-contact-font-size: var(--ebtb6-contact-font-size-mobile);
    --ebtb6-social-link-size: var(--ebtb6-social-link-size-mobile);
    --ebtb6-cta-padding-x: var(--ebtb6-cta-padding-x-mobile);
    --ebtb6-status-font-size: var(--ebtb6-status-font-size-mobile);
  }
  .ebtb6-status,
  .ebtb6-ticker,
  .ebtb6-social,
  .eb6-c-wa { display: none !important; }
  .ebtb6-shell-shard-a,
  .ebtb6-shell-shard-b,
  .ebtb6-shell-spark-a,
  .ebtb6-shell-spark-b,
  .ebtb6-shell-spark-c { display: none !important; }
}
/* Medium Phone */
@media (min-width: 376px) and (max-width: 425px) {
  .ebtb6-bar {
    --ebtb6-track-gap: var(--ebtb6-track-gap-mobile);
    --ebtb6-bar-padding-x: var(--ebtb6-bar-padding-x-mobile);
    --ebtb6-contact-font-size: var(--ebtb6-contact-font-size-mobile);
    --ebtb6-social-link-size: var(--ebtb6-social-link-size-mobile);
    --ebtb6-cta-padding-x: var(--ebtb6-cta-padding-x-mobile);
    --ebtb6-status-font-size: var(--ebtb6-status-font-size-mobile);
  }
  .ebtb6-status,
  .ebtb6-ticker,
  .ebtb6-social,
  .eb6-c-wa { display: none !important; }
  .ebtb6-shell-shard-a,
  .ebtb6-shell-shard-b,
  .ebtb6-shell-spark-a,
  .ebtb6-shell-spark-b,
  .ebtb6-shell-spark-c { display: none !important; }
}
/* Large Phone */
@media (min-width: 426px) and (max-width: 480px) {
  .ebtb6-bar {
    --ebtb6-track-gap: var(--ebtb6-track-gap-mobile);
    --ebtb6-bar-padding-x: var(--ebtb6-bar-padding-x-mobile);
    --ebtb6-contact-font-size: var(--ebtb6-contact-font-size-mobile);
    --ebtb6-social-link-size: var(--ebtb6-social-link-size-mobile);
    --ebtb6-cta-padding-x: var(--ebtb6-cta-padding-x-mobile);
    --ebtb6-status-font-size: var(--ebtb6-status-font-size-mobile);
  }
  .ebtb6-status,
  .ebtb6-ticker,
  .ebtb6-social,
  .eb6-c-wa { display: none !important; }
  .ebtb6-shell-shard-a,
  .ebtb6-shell-shard-b,
  .ebtb6-shell-spark-a,
  .ebtb6-shell-spark-b,
  .ebtb6-shell-spark-c { display: none !important; }
}
/* Small Tablet */
@media (min-width: 481px) and (max-width: 600px) {
  .ebtb6-bar {
    --ebtb6-track-gap: var(--ebtb6-track-gap-mobile);
    --ebtb6-bar-padding-x: var(--ebtb6-bar-padding-x-mobile);
    --ebtb6-contact-font-size: var(--ebtb6-contact-font-size-mobile);
    --ebtb6-social-link-size: var(--ebtb6-social-link-size-mobile);
    --ebtb6-cta-padding-x: var(--ebtb6-cta-padding-x-mobile);
    --ebtb6-status-font-size: var(--ebtb6-status-font-size-mobile);
  }
  .ebtb6-status,
  .ebtb6-ticker,
  .eb6-c-wa { display: none !important; }
  .ebtb6-shell-shard-a,
  .ebtb6-shell-shard-b { display: none !important; }
}
/* Medium Tablet */
@media (min-width: 601px) and (max-width: 768px) {
  .ebtb6-bar {
    --ebtb6-track-gap: var(--ebtb6-track-gap-mobile);
    --ebtb6-bar-padding-x: var(--ebtb6-bar-padding-x-mobile);
    --ebtb6-contact-font-size: var(--ebtb6-contact-font-size-mobile);
    --ebtb6-social-link-size: var(--ebtb6-social-link-size-mobile);
    --ebtb6-cta-padding-x: var(--ebtb6-cta-padding-x-mobile);
    --ebtb6-status-font-size: var(--ebtb6-status-font-size-mobile);
  }
  .ebtb6-status,
  .ebtb6-ticker,
  .eb6-c-wa { display: none !important; }
  .ebtb6-shell-shard-a,
  .ebtb6-shell-shard-b { display: none !important; }
}
/* Large Tablet */
@media (min-width: 769px) and (max-width: 1024px) {
  .ebtb6-bar {
    --ebtb6-track-gap: var(--ebtb6-track-gap-mobile);
  }
  .eb6-c-wa { display: none !important; }
}
/* Small Desktop */
@media (min-width: 1025px) and (max-width: 1280px) {
  /* base */
}
/* Medium Desktop */
@media (min-width: 1281px) and (max-width: 1440px) {
  /* base */
}
/* Large Desktop */
@media (min-width: 1441px) and (max-width: 1920px) {
  /* base */
}
/* Extra Large Screens */
@media (min-width: 1921px) {
  /* base */
}

@media (prefers-reduced-motion: reduce) {
  .ebtb6-shell-orb,
  .ebtb6-shell-shard,
  .ebtb6-shell-spark,
  .ebtb6-shell-line-a,
  .ebtb6-ticker-move { animation: none !important; }
  .ebtb6-reveal { opacity: var(--ebtb6-reveal-opacity-end); transform: none; }
}

/* ============================================================
   TRANSITIONAL — keeps old header offset until header rebuild
   ============================================================ */
:root {
  --ebtb5-topbar-height: 46px;
}
