/* ===== REE Header Navigation ===== */
:root{
  --reeH-blue:#2665E2;
  --reeH-violet:#C26DE6;
  --reeH-text:#F5F5F5;
  --reeH-dark:#0A1320;
  --reeH-dd-bg:#FFFFFF;
  --reeH-dd-last:#F5F5F5;
  --reeH-radius-s:8px;
  --reeH-header-h:72px;
  --reeH-grad:linear-gradient(90deg,rgba(27,40,72,1) 0%, rgba(10,18,32,1) 100%);
  --reeH-sep-grad:linear-gradient(90deg,#2665E2 0%, #C26DE6 100%);
}

.ree-hnav, .ree-hnav *{box-sizing:border-box}
.ree-hnav{
  position:fixed; inset:0 0 auto 0; height:var(--reeH-header-h);
  z-index:9999; background:var(--reeH-grad);
  display:flex; align-items:center; box-shadow:0 8px 20px rgba(0,0,0,.18);
  transition: transform .25s ease; /* for mobile hide/show */
}
.ree-hnav__wrap{
  width:100%; padding:0 80px;
  display:grid; grid-template-columns:auto 1fr auto;
  align-items:center; gap:24px;
  position:relative; z-index:0;
}
.ree-hnav__logo img{width:170px;height:auto;display:block;transition:filter .25s ease}

/* Desktop nav */
.ree-hnav__nav{display:flex;justify-content:center}
.ree-hnav__list{display:flex;align-items:center;justify-content:center;gap:40px;list-style:none;margin:0;padding:0}
.ree-hnav__item{position:relative}
.ree-hnav__link{
  position:relative;display:inline-flex;align-items:center;gap:6px;
  font:400 14px/28px Roboto,system-ui,Arial,sans-serif;
  color:var(--reeH-text);text-decoration:none;white-space:nowrap
}
/* non-clickable desktop link: no hand cursor */
.ree-hnav__link--nolink,
.ree-hnav__link--nolink:hover,
.ree-hnav__link--nolink:focus{
  cursor:default !important;
}

/* RESET ZA DROPDOWN BUTTONE – skida bijelu pozadinu/border */
.ree-hnav__item--hasdd > .ree-hnav__link{
  background:transparent;
  border:0;
  padding:0;
}

.ree-hnav__link::after{
  content:"";position:absolute;left:0;right:0;bottom:0;height:1px;width:0;margin:0 auto;
  background:linear-gradient(90deg,#2665E2 0%, #C26DE6 100%);transition:width .3s ease
}
.ree-hnav__link:hover::after{width:100%}
.ree-hnav__item--hasdd>.ree-hnav__link::after{display:none}
.ree-hnav__chev{transition:transform .18s ease;transform-origin:50% 45%}
.ree-hnav__item--hasdd:is(:hover,:focus-within) .ree-hnav__chev{transform:rotate(180deg)}
.ree-hnav__item--hasdd::after{content:"";position:absolute;left:-10px;right:-10px;height:12px;top:100%}

/* --- ACTIVE PAGE UNDERLINE (white), desktop --- */
.ree-hnav__item.is-current > .ree-hnav__link::after,
.ree-hnav__link[aria-current="page"]::after{
  width:100%;
  background:#ffffff;
}

/* Dropdown (desktop) */
.ree-hnav__dd{
  position:absolute;top:100%;left:50%;transform:translate(-50%,6px);
  min-width:246px;background:var(--reeH-dd-bg);border:1px solid #E5E5E5;
  border-radius:18px;box-shadow:0 22px 46px rgba(0,0,0,.32);
  padding:0;opacity:0;pointer-events:none;overflow:hidden;
  transition:opacity .18s ease, transform .18s ease
}
.ree-hnav__item--hasdd:is(:hover,:focus-within)>.ree-hnav__dd{
  opacity:1;pointer-events:auto;transform:translate(-50%,0)
}
.ree-hnav__dd-item{
  position:relative;
  display:flex;align-items:center;justify-content:center;padding:14px 18px;
  font:600 14px/1 Roboto,system-ui,Arial,sans-serif;color:var(--reeH-dark);
  text-decoration:none;transition:background .18s ease,color .18s ease;text-align:center
}
.ree-hnav__dd-item:hover{color:#f5f5f5;background:linear-gradient(90deg,#2665E2 0%, #C26DE6 100%)}
/* non-clickable dropdown item: no hand cursor */
.ree-hnav__dd-item--nolink,
.ree-hnav__dd-item--nolink:hover,
.ree-hnav__dd-item--nolink:focus{
  cursor:default !important;
}

.ree-hnav__dd-sep{display:block;height:1px;width:100%;background:var(--reeH-sep-grad)}
.ree-hnav__dd-item--addon{background:var(--reeH-dd-last);color:var(--reeH-dark)}
.ree-hnav__dd-item--addon:hover{background:linear-gradient(90deg,#2665E2 0%, #C26DE6 100%);color:#fff}
.ree-hnav__badge{background:rgba(10,18,32,.5);color:#fff;font:700 9px/1 Roboto,system-ui,Arial,sans-serif;padding:6px 10px;border-radius:56px;margin-left:8px}

/* ====== CTA LAYOUT ====== */
.ree-hnav__cta-wrap {
  display: flex;
  align-items: center;
  gap: 12px;
}

/* --- Base CTA Style --- */
.ree-hnav__cta {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px; /* Spacing for Icon + Text */
  height: 40px;
  padding: 0 28px; /* Adjusted to 28px to match provided snippet */
  border-radius: 8px;
  background: #2665E2;
  color: #fff;
  text-decoration: none;
  overflow: hidden;
  box-shadow: 0 10px 24px -12px rgba(0,0,0,.35);
  transition: background-color 0.2s ease, opacity 0.2s ease, box-shadow 0.2s ease;
  white-space: nowrap;
  backface-visibility: hidden;
  transform: translateZ(0);
  border: none;
}

/* CTA Icon */
.ree-hnav__cta-icon {
  position: relative;
  z-index: 1;
  width: 16px;
  height: auto;
  display: block;
  filter: brightness(0) invert(1); /* Forces SVG purely white */
}

/* --- Primary CTA specific hover layer --- */
.ree-hnav__cta:not(.ree-hnav__cta--secondary)::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, #2665E2 0%, #C26DE6 100%);
  opacity: 0;
  transition: opacity .35s ease;
}
.ree-hnav__cta:not(.ree-hnav__cta--secondary):hover::before,
.ree-hnav__cta:not(.ree-hnav__cta--secondary):focus-visible::before {
  opacity: 1;
}

/* --- Secondary CTA override (ALMA Platform Gradient Border) --- */
.ree-hnav__cta--secondary {
  background-color: transparent;
  color: #fff;
  /* Solid blue line by default - changed to 2px to match gradient snippet */
  box-shadow: inset 0 0 0 2px #2665E2, 0 10px 24px -12px rgba(0,0,0,.35);
}

.ree-hnav__cta--secondary::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 8px;
  padding: 2px; /* Set to 2px as per provided snippet */
  background: linear-gradient(90deg, #2665E2 0%, #C26DE6 100%);
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
  pointer-events: none;
  z-index: 0;
  opacity: 0; /* Hidden by default (hover effect preserved) */
  transition: opacity 0.25s ease;
}

.ree-hnav__cta--secondary:hover,
.ree-hnav__cta--secondary:focus-visible {
  background-color: rgba(255, 255, 255, 0.12);
  /* Removes solid blue line so gradient can shine through */
  box-shadow: inset 0 0 0 0px #2665E2, 0 10px 24px -12px rgba(0,0,0,.35);
}

.ree-hnav__cta--secondary:hover::before,
.ree-hnav__cta--secondary:focus-visible::before {
  opacity: 1; /* Reveals gradient border */
}

/* --- Current page (ADDED 2026-11-01): the button holds its hover look, as the active dropdown items do --- */
.ree-hnav__cta:not(.ree-hnav__cta--secondary).is-current::before { opacity: 1; }
.ree-hnav__cta--secondary.is-current {
  background-color: rgba(255, 255, 255, 0.12);
  box-shadow: inset 0 0 0 0px #2665E2, 0 10px 24px -12px rgba(0,0,0,.35);
}
.ree-hnav__cta--secondary.is-current::before { opacity: 1; }

.ree-hnav__cta-label {
  position: relative;
  padding-top: 1px;
  z-index: 1;
  font: 700 14px/1 Roboto, sans-serif;
  color: #F5F5F5;
}

/* Burger (mobile trigger) — 18px icon + glow + fallbacks */
.ree-hnav__burger{
  display:none;
  appearance:none;
  background:transparent;
  border:0;
  padding:10px;
  margin:0;
  line-height:0;
  color:#f5f5f5;
  cursor:pointer;
  grid-column:3;
  justify-self:end;
}
.ree-hnav__burger:hover{ filter: brightness(1.08); }

/* Base fallback: svg as background-image (icon carries the animated glow) */
.ree-hnav__burger-icon{
  width:18px; height:18px; display:block;
  background-image:url('https://6291954.fs1.hubspotusercontent-na1.net/hubfs/6291954/Rebrained/Reeinvented/Website/Icons/Navigation%20Menu%20Icon.svg');
  background-repeat:no-repeat;
  background-position:center;
  background-size:contain;
  filter: invert(96%) sepia(2%) saturate(180%) hue-rotate(180deg) brightness(105%) contrast(90%)
          drop-shadow(0 0 6px rgba(245,245,245,.22));
  animation: iconGlowPulse 2.6s ease-in-out infinite;
  transition: filter .2s ease;
}
.ree-hnav__burger:hover .ree-hnav__burger-icon{
  filter: invert(96%) sepia(2%) saturate(180%) hue-rotate(180deg) brightness(105%) contrast(90%)
          drop-shadow(0 0 12px rgba(245,245,245,.5));
}

/* If mask is supported, use true color + the same animated glow */
@supports ((-webkit-mask-image:url("")) or (mask-image:url(""))){
  .ree-hnav__burger-icon{
    background-image:none;
    background-color:#f5f5f5;
    -webkit-mask-image:var(--burger-icon, url('https://6291954.fs1.hubspotusercontent-na1.net/hubfs/6291954/Rebrained/Reeinvented/Website/Icons/Navigation%20Menu%20Icon.svg'));
            mask-image:var(--burger-icon, url('https://6291954.fs1.hubspotusercontent-na1.net/hubfs/6291954/Rebrained/Reeinvented/Website/Icons/Navigation%20Menu%20Icon.svg'));
    -webkit-mask-repeat:no-repeat;       mask-repeat:no-repeat;
    -webkit-mask-position:center;        mask-position:center;
    -webkit-mask-size:contain;           mask-size:contain;
    filter: drop-shadow(0 0 6px rgba(245,245,245,.22));
    animation: iconGlowPulse 2.6s ease-in-out infinite;
  }
  .ree-hnav__burger:hover .ree-hnav__burger-icon{ filter: drop-shadow(0 0 12px rgba(245,245,245,.5)); }
}

/* ===== Mobile off-canvas ===== */
.ree-hnav__mobile{
  position:fixed; inset:0; 
  z-index:2; 
  pointer-events:none;
}
.ree-hnav__mobile-inner{
  position:absolute; top:0; bottom:0; right:0; width:min(86vw,420px);
  background:#fff; transform:translateX(100%); transition:transform .25s ease;
  box-shadow:-10px 0 30px rgba(0,0,0,.25); display:flex; flex-direction:column;
  padding:20px; z-index:2;
  overflow:hidden;
  padding-bottom:calc(20px + env(safe-area-inset-bottom));
  /* UPDATED 2026-11-01: the closed panel sits just past the right edge and its -10px 0 30px shadow painted a grey
     band about 40px wide into every page, at every width (measured 252 to 208 grey at x 1405 to 1439 on a white
     page at 1440). Hidden while closed, it paints nothing and its links leave the tab order. The visibility
     switch waits for the slide out, so closing still animates. */
  visibility:hidden; transition:transform .25s ease, visibility 0s linear .25s;
}
.ree-hnav__mobile-scrim{
  position:absolute; inset:0;
  background:rgba(10,19,32,.42);                 /* brand-navy tint, not flat black */
  -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px);  /* premium blur of the page behind */
  opacity:0; transition:opacity .25s ease;
  z-index:1; cursor:pointer;                       /* click anywhere here to close */
}

/* open state */
.ree-hnav__mobile[aria-hidden="false"]{pointer-events:auto}
.ree-hnav__mobile[aria-hidden="false"] .ree-hnav__mobile-inner{transform:translateX(0);visibility:visible;transition:transform .25s ease, visibility 0s}
.ree-hnav__mobile[aria-hidden="false"] .ree-hnav__mobile-scrim{opacity:1}

/* Hide header background when menu is open */
.ree-hnav.is-menu-open{
  box-shadow:none;
  /* UPDATED 2026-11-01: above the announcement strip's 10000 while the menu is open. The menu runs from the top of
     the screen and the strip covered its close button with the strip's own X, so a tap there closed the strip. */
  z-index:10001;
}

.ree-hnav__mobile-close{align-self:flex-end;background:transparent;border:0;font:700 28px/1 system-ui,Arial,sans-serif;color:#0A1320}

/* Mobile list (SCROLLABLE) */
.ree-mnav{
  list-style:none; margin:10px 0 0; padding:0 4px 12px 4px;
  display:flex; flex-direction:column; gap:6px;
  flex:1 1 auto; 
  min-height:0;
  overflow-y:auto;
  -webkit-overflow-scrolling:touch;
  overscroll-behavior:contain;
}
.ree-mnav__item{display:block}
.ree-mnav__link{display:block;padding:12px 4px;font:500 16px/1.2 Roboto,system-ui,Arial,sans-serif;color:#0A1320;text-decoration:none}
/* non-clickable mobile top link: no hand cursor */
.ree-mnav__link--nolink,
.ree-mnav__link--nolink:hover,
.ree-mnav__link--nolink:focus{
  cursor:default !important;
}

.ree-mnav__item--hasdd{padding-top:6px;margin-top:6px}
.ree-mnav__toggle{width:100%;display:flex;align-items:center;justify-content:space-between;gap:10px;text-align:left;background:#f7f7f9;border:1px solid #eee;border-radius:8px;padding:12px 12px;font:600 15px/1.2 Roboto,system-ui,Arial,sans-serif;color:#0A1320;position:relative;transition:background .2s ease,border-color .2s ease}
/* Chevron on the mobile dropdown toggle — mirrors the desktop chevron, rotates on open */
.ree-mnav__toggle-chev{width:16px;height:16px;flex:0 0 auto;color:inherit;transition:transform .25s ease,color .2s ease}
.ree-mnav__toggle[aria-expanded="true"] .ree-mnav__toggle-chev{transform:rotate(180deg)}
/* Premium-restrained hover: brand-tinted border + bg, chevron picks up brand blue.
   Children links keep the bolder gradient hover; the parent toggle stays subtle. */
.ree-mnav__toggle:not(.is-current):hover{background:#eef2fb;border-color:#2665E2}
.ree-mnav__toggle:not(.is-current):hover .ree-mnav__toggle-chev{color:#2665E2}
.ree-mnav__toggle:focus-visible{outline:2px solid #2665E2;outline-offset:2px}
.ree-mnav__dd{list-style:none;margin:6px 0 0 0;padding:0;display:none}
/* Open accordion: stack dd-links with a small gap so consecutive active/hover
   highlights don't touch (Leon: "nema gaps izmedju aktivnih dugmadi"). */
.ree-mnav__dd[aria-hidden="false"]{display:flex;flex-direction:column;gap:4px}
.ree-mnav__dd-link{display:block;padding:10px 12px;font:400 15px/1.2 Roboto,system-ui,Arial,sans-serif;color:#0A1320;text-decoration:none;width:100%;box-sizing:border-box;border-radius:8px;}
/* non-clickable mobile dropdown link: no hand cursor */
.ree-mnav__dd-link--nolink,
.ree-mnav__dd-link--nolink:hover,
.ree-mnav__dd-link--nolink:focus{
  cursor:default !important;
}

.ree-mnav__dd-link.is-addon{background:#f5f5f7;border-radius:6px}
.ree-mnav__badge{display:inline-block;margin-left:8px;background:#0A1320;color:#fff;border-radius:56px;padding:4px 8px;font:700 10px/1 Roboto,system-ui,Arial,sans-serif}

.ree-mnav__cta{
  margin-top:14px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.ree-mnav__cta .ree-hnav__cta {
  width: 100%;
}

/* ===== Responsive (force to avoid collisions) =====
   Breakpoint 1439px (was 1200): measured the desktop bar — logo(170) + nav(768,
   nowrap, centered) + CTAs(~248) + 80px side padding + 24px grid gaps needs
   ~1440px to keep a comfortable ~40px gap each side of the nav. Below that the
   nav crowds, and below ~1345px it overlaps the logo + CTAs (the cramped state).
   So we drop to the hamburger BEFORE it gets cramped rather than shrinking the
   bar. Common 1366/1280 laptops now get a clean burger, not a squeezed nav. */
@media (max-width:1439px){
  .ree-hnav__wrap{padding-left:30px; padding-right:30px;}
  header.ree-hnav .ree-hnav__nav,
  header.ree-hnav .ree-hnav__cta-wrap{ display:none !important; }
  header.ree-hnav .ree-hnav__burger{
    display:inline-flex !important;
    align-items:center; justify-content:center;
  }
  .ree-hnav.is-hidden{ transform: translateY(-110%); }
}

/* Kill any legacy bars if present */
.ree-hnav__burger-bar{ display:none !important; }

/* Mobile sidemenu: ALMA secondary CTA — darken label & icon for white background.
   Breakpoint kept in sync with the main responsive switch above (1439px). */
@media (max-width: 1439px) {
  .ree-mnav__cta .ree-hnav__cta--secondary {
    color: #0A1320;
  }
  .ree-mnav__cta .ree-hnav__cta--secondary .ree-hnav__cta-label {
    color: #0A1320;
  }
  .ree-mnav__cta .ree-hnav__cta--secondary .ree-hnav__cta-icon {
    filter: brightness(0); /* Black icon instead of white */
  }
  /* Hover: the desktop secondary CTA lightens (white 12%) on the dark bar, which
     is invisible on the white drawer. Mirror the intent by DARKENING instead —
     a subtle navy tint. Text/icon stay dark; the gradient border still reveals
     via the base .ree-hnav__cta--secondary:hover::before rule. */
  .ree-mnav__cta .ree-hnav__cta--secondary:hover,
  .ree-mnav__cta .ree-hnav__cta--secondary:focus-visible,
  .ree-mnav__cta .ree-hnav__cta--secondary.is-current {
    background-color: rgba(10, 19, 32, 0.08);
  }
}

/* Right-align helpers */
.ree-hnav__logo { grid-column: 1; }
.ree-hnav__nav  { grid-column: 2; }
.ree-hnav__cta-wrap,
.ree-hnav__burger { grid-column: 3; justify-self: end; }

/* ====== GLOW ANIMATIONS ====== */
@keyframes iconGlowPulse{
  0%,100%{ filter: drop-shadow(0 0 6px rgba(245,245,245,.22)); }
  50%    { filter: drop-shadow(0 0 14px rgba(245,245,245,.44)); }
}
@keyframes logoGlow{
  0%,100% { filter: drop-shadow(0 0 4px rgba(245,245,245,.20)); }
  50%     { filter: drop-shadow(0 0 10px rgba(245,245,245,.50)); }
}
.ree-hnav__logo:hover img,
.ree-hnav__logo:focus-visible img,
.ree-hnav__logo:active img{
  animation: logoGlow 2.4s ease-in-out infinite;
}

/* === Hamburger icon halo (Safari-friendly), on the ICON itself === */
.ree-hnav__burger-icon{
  position: relative;
  width: 18px;
  height: 18px;
}
.ree-hnav__burger-icon::before{
  content:"";
  position:absolute;
  inset:-8px;
  border-radius:50%;
  pointer-events:none;
  z-index:-1;
  background: radial-gradient(closest-side, rgba(245,245,245,.70), rgba(245,245,245,0));
  opacity:.65;
  transform: scale(.92);
  animation: reeIconHalo 2.1s ease-in-out infinite;
}
.ree-hnav__burger:hover .ree-hnav__burger-icon::before{ opacity:.95; }
@media (hover:none){
  .ree-hnav__burger-icon::before{
    inset:-10px; opacity:.8; animation-duration:1.9s;
  }
}
@keyframes reeIconHalo{
  0%,100%{ opacity:.55; transform:scale(.90); }
  50%    { opacity:1;   transform:scale(1.12); }
}

/* ============================================================
   MENU EFFECTS kept from prior steps (active colors for proto/solu)
   ============================================================ */

/* Generic: ACTIVE dropdown items (e.g. Success Stories) */
.ree-hnav__dd-item.is-current,
.ree-hnav__dd-item[aria-current="page"]{
  color:#f5f5f5;
  background:linear-gradient(90deg,#2665E2 0%, #C26DE6 100%);
}

/* Desktop dropdown items: ACTIVE = solid color (no hover effect on them) */
.ree-hnav__item--proto .ree-hnav__dd-item.is-current,
.ree-hnav__item--proto .ree-hnav__dd-item[aria-current="page"]{
  background:#2665E2 !important; color:#fff;
}
.ree-hnav__item--solu .ree-hnav__dd-item.is-current,
.ree-hnav__item--solu .ree-hnav__dd-item[aria-current="page"]{
  background:#A942EF !important; color:#fff;
}

/* Mobile menu: hover on dropdown links (unchanged) */
.ree-mnav__dd-link:hover{
  color:#fff;
  background:linear-gradient(90deg,#2665E2 0%, #C26DE6 100%);
  border-radius:8px;
}

/* Mobile menu: ACTIVE dropdown links (generic, e.g. Success Stories) */
.ree-mnav__dd-link.is-current,
.ree-mnav__dd-link[aria-current="page"]{
  color:#fff;
  background:linear-gradient(90deg,#2665E2 0%, #C26DE6 100%);
  border-radius:8px;
}

/* Mobile menu: ACTIVE dropdown links = solid (no hover change) for proto/solu */
.ree-mnav__item--proto .ree-mnav__dd-link.is-current,
.ree-mnav__item--proto .ree-mnav__dd-link[aria-current="page"]{
  background:#2665E2 !important; color:#fff; border-radius:8px;
}
.ree-mnav__item--solu .ree-mnav__dd-link.is-current,
.ree-mnav__item--solu .ree-mnav__dd-link[aria-current="page"]{
  background:#A942EF !important; color:#fff; border-radius:8px;
}

/* Active category toggle (generic): solid brand blue + white text. Chevron
   inherits #fff. Solid (not the brand gradient) because white-on-gradient drops
   to ~3.17:1 at the violet end (#C26DE6) which fails WCAG AA for 15px text;
   solid #2665E2 is 5.2:1. proto/solu rules below keep their own solid colors. */
.ree-mnav__toggle.is-current{
  background:#2665E2;
  color:#fff;
  border-color:transparent;
}
/* Mobile section headers (AI-Driven …): color instead of underline when active */
.ree-mnav__item--proto .ree-mnav__toggle.is-current{
  background:#2665E2; color:#fff; border-color:transparent;
}
.ree-mnav__item--solu .ree-mnav__toggle.is-current{
  background:#A942EF; color:#fff; border-color:transparent;
}
/* remove underline on active toggles */
.ree-mnav__toggle.is-current::after{ display:none !important; }

/* === NEW: underline for ACTIVE top-level links in the mobile menu === */
.ree-mnav__link{ position:relative; }
.ree-mnav__link::after{
  content:""; position:absolute; left:0; right:0; bottom:-2px;
  height:1px; width:0; margin:0 auto;
  background:var(--reeH-sep-grad); transition:width .3s ease;
}
.ree-mnav__link:hover::after,
.ree-mnav__link:focus-visible::after{ width:100%; }
.ree-mnav__link.is-current::after,
.ree-mnav__link[aria-current="page"]::after{ width:100%; }

/* ===== Dropdown stacking so underlines/separators don't clash ===== */
.ree-hnav__dd{ display:block; }
.ree-hnav__dd-item{ position:relative; z-index:1; width:100%; }
.ree-hnav__dd-sep{ position:relative; z-index:0; }

.ree-hnav__item--proto.is-current > .ree-hnav__link::after,
.ree-hnav__item--solu.is-current > .ree-hnav__link::after {
  width:100%;
  background:#ffffff; /* same as active underline */
}

/* ===== Fix: active underline on dropdown triggers (center-out, not under chevron) ===== */
.ree-hnav__item--hasdd > .ree-hnav__link::after{
  display:block;
  position:absolute;
  left:0;
  right:18px; /* keep 18px clear for chevron area */
  bottom:0;
  height:1px;
  margin:0;
  background:#fff;
  transform-origin:center;
  transform:scaleX(0);
  opacity:0;
  transition:transform .35s ease, opacity .2s ease;
}

.ree-hnav__item--hasdd.is-current > .ree-hnav__link::after,
.ree-hnav__item--hasdd > .ree-hnav__link[aria-current="page"]::after{
  opacity:1;
  transform:scaleX(1);
}

/* Keep non-active triggers from showing any hover underline */
.ree-hnav__item--hasdd:not(.is-current) > .ree-hnav__link:hover::after,
.ree-hnav__item--hasdd:not(.is-current) > .ree-hnav__link:focus-visible::after{
  opacity:0;
  transform:scaleX(0);
}

/* === FIX: underline only under the text (exclude chevron) === */
.ree-hnav__item--hasdd > .ree-hnav__link::after{
  right:18px !important;                 /* 12px chevron + 6px gap */
}

/* Active state for dropdown triggers: use left/right, not width */
.ree-hnav__item--hasdd.is-current > .ree-hnav__link::after,
.ree-hnav__item--hasdd > .ree-hnav__link[aria-current="page"]::after{
  left:0 !important;
  right:18px !important;
  width:auto !important;
  margin:0 !important;
  background:#fff !important;
  transform-origin:center !important;
  transform:scaleX(1) !important;
  opacity:1 !important;
}

/* Keep hover from re-expanding under the chevron */
.ree-hnav__item--hasdd.is-current > .ree-hnav__link:hover::after,
.ree-hnav__item--hasdd.is-current > .ree-hnav__link:focus-visible::after{
  left:0 !important;
  right:18px !important;
  width:auto !important;
}

/* === NEW: ACTIVE underline for any dropdown parent (incl. Success Stories) === */
/* If ANY dropdown item is active (is-current / aria-current), underline the parent link */
.ree-hnav__item--hasdd:has(.ree-hnav__dd-item.is-current) > .ree-hnav__link::after,
.ree-hnav__item--hasdd:has(.ree-hnav__dd-item[aria-current="page"]) > .ree-hnav__link::after{
  opacity:1 !important;
  transform:scaleX(1) !important;
  left:0 !important;
  right:18px !important;
  width:auto !important;
  background:#fff !important;
}

@media (prefers-reduced-motion: reduce) {
  .ree-hnav__burger-icon { animation: none; }
  .ree-hnav__burger-icon::before { animation: none; }
  .ree-hnav__logo:hover img,
  .ree-hnav__logo:focus-visible img,
  .ree-hnav__logo:active img { animation: none; }
  .ree-hnav { transition: none; }
  .ree-hnav__mobile-inner,
  .ree-hnav__mobile-scrim { transition: none; }
  .ree-hnav__dd,
  .ree-hnav__chev { transition: none; }
  /* mobile accordion toggle + its chevron (added this session) */
  .ree-hnav__mobile-scrim { -webkit-backdrop-filter: none; backdrop-filter: none; }
  .ree-mnav__toggle,
  .ree-mnav__toggle-chev { transition: none; }
}