/* WASSIMVISUALS 3.0.2 — Header Studio
   Structural containment, independent logo dimensions, EN/FR/AR RTL.
   Loaded AFTER experience-v3.css: no changes to portfolio/cursor/animation rules. */
html { max-width: 100%; }
body.wv3 { width:100%; max-width:100%; overflow-x:clip; }
body.wv3 .wv3-shell { box-sizing:border-box; max-width:100%; }
.wv3-header-frame {
  position:relative;
  width:100%;
  min-width:0;
  max-width:100%;
  --wv-logo-desktop-width:160px;
  --wv-logo-mobile-width:126px;
  --wv-nav-desktop-height:80px;
  --wv-nav-mobile-height:68px;
  isolation:isolate;
}
body.wv3 .wv3-header-frame > .wv3-nav {
  display:grid;
  grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);
  width:100%; max-width:100%; min-width:0;
  min-height:0; height:var(--wv-nav-desktop-height);
  padding:0; margin:0; gap:clamp(10px,2vw,28px);
  align-items:center; justify-content:initial;
  position:relative; box-sizing:border-box;
  border-bottom:1px solid var(--wv3-line,rgba(31,33,34,.15));
}
body.wv3 .wv3-header-frame .wv3-brand {
  display:inline-flex; width:max-content; max-width:100%; min-width:0;
  align-items:center; justify-self:start; text-decoration:none;
  overflow:hidden; flex:initial;
  direction:ltr; line-height:1;
}
.wv3-logo-slot { display:block; flex:none; width:var(--wv-logo-desktop-width); max-width:100%; min-width:0; }
.wv3-logo-slot.wv3-logo-mobile { display:none; }
body.wv3 .wv3-header-frame .wv3-logo-img,
:is(.casehero,.wv3-case-sticky) .wv3-brand .wv3-logo-img {
  width:100%; max-width:100%; height:auto; max-height:41px;
  object-fit:contain; object-position:left center;
  filter:none!important; transform:none!important;
}
body.wv3 .wv3-header-frame .wv3-brand-text,
:is(.casehero,.wv3-case-sticky) .wv3-brand .wv3-brand-text {
  display:inline-flex; max-width:100%; white-space:nowrap;
  font-family:Inter,Manrope,Arial,sans-serif;
  font-weight:400; font-size:clamp(13px,1.3vw,18px);
  letter-spacing:-.07em; line-height:1.15; direction:ltr;
}
body.wv3 .wv3-header-frame .wv3-brand-text[hidden],
:is(.casehero,.wv3-case-sticky) .wv3-brand .wv3-brand-text[hidden],
.wv3-header-frame .wv3-logo-img[hidden],
:is(.casehero,.wv3-case-sticky) .wv3-logo-img[hidden] {display:none!important;}
.wv3-header-frame .wv3-brand-text strong {font-weight:800;}
.wv3-header-frame .wv3-brand-text span {font-weight:300;}
body.wv3 .wv3-header-frame .wv3-nav-links {
  min-width:0; justify-self:center; display:flex;
  justify-content:center; align-items:center; flex-wrap:nowrap;
  gap:clamp(12px,2vw,32px);
}
body.wv3 .wv3-header-frame .wv3-nav-links > a {font-size:clamp(10px,.85vw,12px);white-space:nowrap;}
body.wv3 .wv3-header-frame .wv3-nav-actions {
  display:flex; flex:none; justify-self:end;
  align-items:center; gap:8px; min-width:0;
}
.wv3-header-frame .wv3-langs { flex:0 0 auto; max-width:100%; }
.wv3-header-frame .wv3-langs a { flex:0 0 auto; }
.wv3-header-frame .wv3-mobile-nav {
  position:absolute; top:calc(var(--wv-nav-desktop-height) - 1px);
  left:0; right:0; width:100%; max-width:100%;
  margin:0; padding:18px; box-sizing:border-box; z-index:50;
  inset-inline:0;
}
/* Switch to two-column layout BEFORE links start colliding with the language controls. */
@media (max-width:1050px) {
  body.wv3 .wv3-header-frame > .wv3-nav {grid-template-columns:minmax(0,1fr) auto;}
  body.wv3 .wv3-header-frame .wv3-nav-links {display:none;}
  body.wv3 .wv3-header-frame .wv3-menu-toggle {display:flex; flex:none;}
}
@media (max-width:700px) {
  body.wv3 .wv3-header-frame > .wv3-nav {height:var(--wv-nav-mobile-height);gap:8px;}
  .wv3-logo-slot.wv3-logo-desktop {display:none;}
  .wv3-logo-slot.wv3-logo-mobile {display:block;width:var(--wv-logo-mobile-width);max-width:100%;}
  body.wv3 .wv3-header-frame .wv3-brand {max-width:100%;}
  body.wv3 .wv3-header-frame .wv3-logo-img {max-height:34px;}
  body.wv3 .wv3-header-frame .wv3-brand-text {font-size:clamp(11px,3.1vw,15px);}
  body.wv3 .wv3-header-frame .wv3-nav-actions {gap:5px;}
  body.wv3 .wv3-header-frame .wv3-langs {gap:1px;padding:3px;}
  body.wv3 .wv3-header-frame .wv3-langs a {min-width:26px;padding:7px 5px;font-size:10px;}
  body.wv3 .wv3-header-frame .wv3-menu-toggle {width:34px;height:34px;padding:0;}
  body.wv3 .wv3-header-frame .wv3-mobile-nav {top:calc(var(--wv-nav-mobile-height) - 1px);}
}
@media (max-width:365px) {
  body.wv3 .wv3-header-frame .wv3-langs a {min-width:25px;padding-inline:4px;font-size:9px;}
  body.wv3 .wv3-header-frame .wv3-nav-actions {gap:3px;}
}
/* In Arabic the header follows page direction, but the Latin brand is kept left-to-right. */
html[dir="rtl"] .wv3-header-frame .wv3-brand,
html[dir="rtl"] :is(.casehero,.wv3-case-sticky) .wv3-brand { direction:ltr; }
html[dir="rtl"] .wv3-header-frame .wv3-logo-img { object-position:right center; }
html[dir="rtl"] .wv3-header-frame .wv3-langs { direction:ltr; }
/* Case Study uses a different header. Apply the same desktop/mobile logo sizes there. */
:is(.casehero,.wv3-case-sticky) .case-topbar {box-sizing:border-box; width:100%; max-width:100%; min-width:0; gap:16px;}
:is(.casehero,.wv3-case-sticky) .wv3-brand.case-brand {
  display:flex; align-items:center; justify-content:flex-start;
  min-width:0; width:var(--wv-logo-desktop-width); max-width:min(50%,var(--wv-logo-desktop-width)); flex:0 0 auto;
  white-space:nowrap; letter-spacing:normal;
  color:inherit; text-decoration:none; direction:ltr;
}
:is(.casehero,.wv3-case-sticky) .wv3-brand .wv3-logo-slot {width:100%;max-width:100%;}
:is(.casehero,.wv3-case-sticky) .wv3-brand .wv3-brand-text {font-size:clamp(12px,1.3vw,18px);letter-spacing:-.07em;}
:is(.casehero,.wv3-case-sticky) .wv3-brand .wv3-brand-text strong {font-weight:800;}
:is(.casehero,.wv3-case-sticky) .wv3-brand .wv3-brand-text span {font-weight:300;}
:is(.casehero,.wv3-case-sticky) .case-back {max-width:55%; min-width:0; overflow-wrap:anywhere; text-align:end;}
@media (max-width:700px) {
  :is(.casehero,.wv3-case-sticky) .wv3-brand.case-brand {width:var(--wv-logo-mobile-width);max-width:min(50%,var(--wv-logo-mobile-width));}
  :is(.casehero,.wv3-case-sticky) .wv3-brand .wv3-logo-slot.wv3-logo-desktop {display:none;}
  :is(.casehero,.wv3-case-sticky) .wv3-brand .wv3-logo-slot.wv3-logo-mobile {display:block;width:100%;}
  :is(.casehero,.wv3-case-sticky) .wv3-brand .wv3-logo-img {max-height:34px;}
  :is(.casehero,.wv3-case-sticky) .wv3-brand .wv3-brand-text {font-size:clamp(10px,3vw,14px);}
  :is(.casehero,.wv3-case-sticky) .case-back {font-size:10px;max-width:47%;line-height:1.5;}
}

/* V3.0.8 — Compact language selector, flag of selected locale.
   The dropdown is anchored to the selector and does not increase header width. */
body.wv3 .wv3-header-frame .wv-lang-switch{
  position:relative; z-index:35;display:block; flex:none; width:auto;
  max-width:max-content; padding:3px; overflow:visible;
  direction:ltr; border-radius:999px;
}
body.wv3 .wv3-header-frame .wv-lang-current{
  display:inline-flex;align-items:center;justify-content:center; gap:7px;
  cursor:pointer;min-height:33px;padding:6px 10px;
  border-radius:999px;list-style:none;user-select:none;
  color:#1b1c1b;font:750 11px/1 Inter,Manrope,Arial,sans-serif;
}
body.wv3 .wv3-header-frame .wv-lang-current::-webkit-details-marker{display:none}
body.wv3 .wv3-header-frame .wv-lang-current::marker{content:''}
body.wv3 .wv3-header-frame .wv-lang-current img,
body.wv3 .wv3-header-frame .wv-lang-options img{
  width:27px;height:20px;flex:0 0 27px;object-fit:contain;
  filter:none;transform:none;
}
body.wv3 .wv3-header-frame .wv-lang-current svg{width:12px;height:12px;flex:none;transition:transform .2s ease}
body.wv3 .wv3-header-frame .wv-lang-switch[open] .wv-lang-current svg{transform:rotate(180deg)}
body.wv3 .wv3-header-frame .wv-lang-current:focus-visible,
body.wv3 .wv3-header-frame .wv-lang-options a:focus-visible{outline:2px solid #161616;outline-offset:2px}
body.wv3 .wv3-header-frame .wv-lang-options{
  position:absolute;top:calc(100% + 10px);inset-inline-end:0;
  z-index:500;min-width:215px;padding:7px;display:flex;flex-direction:column;gap:2px;
  background:#f7f7f5;border:1px solid #d1d3ce;border-radius:16px;
  box-shadow:0 18px 45px #0002;direction:ltr;
}
body.wv3 .wv3-header-frame .wv-lang-switch:not([open]) .wv-lang-options{display:none}
body.wv3 .wv3-header-frame .wv-lang-options>a{
  display:flex;flex:none;align-items:center;justify-content:flex-start;min-width:0;
  gap:11px;width:100%;padding:11px 10px;border-radius:11px;
  font:600 12px/1.4 Inter,Manrope,Arial,sans-serif;
  text-decoration:none;text-align:start;white-space:nowrap;color:#262725;
}
body.wv3 .wv3-header-frame .wv-lang-options>a:hover,
body.wv3 .wv3-header-frame .wv-lang-options>a.is-current{background:#e5e6e3;color:#101010}
body.wv3 .wv3-header-frame .wv-lang-name{flex:1}
body.wv3 .wv3-header-frame .wv-lang-code{font:700 10px/1 Inter,Manrope,Arial,sans-serif;color:#7a7e7a}
@media(max-width:700px){
 body.wv3 .wv3-header-frame .wv-lang-current{padding:5px 6px;gap:5px;min-height:29px;font-size:10px}
 body.wv3 .wv3-header-frame .wv-lang-current img{width:24px;height:18px;flex-basis:24px}
 body.wv3 .wv3-header-frame .wv-lang-options{min-width:200px}
}
@media(max-width:360px){
 body.wv3 .wv3-header-frame .wv-lang-current{padding:5px 3px}
 body.wv3 .wv3-header-frame .wv-lang-current svg{width:10px}
}
/* Keep the open language panel in front of the page without affecting the menu portal. */
body.wv3 .wv3-header-frame{z-index:40}
body.wv3 .wv3-header-frame > .wv3-nav{overflow:visible}
