/* OZ-ZONE shared site stylesheet — consolidated editorial + evidence layer.
   One custom stylesheet is used consistently across the site.
   Bootstrap and other legacy framework assets remain separate for compatibility. */


/* OZ-ZONE editorial redesign — additive layer; legacy files remain available. */
:root{--ink:#17252d;--muted:#62717a;--paper:#f4f2ec;--white:#fff;--line:#d9dedb;--teal:#126b68;--teal2:#dcece8;--gold:#d4a84f;--navy:#102c3a;--coral:#c56a50;--shadow:0 18px 55px rgba(17,42,52,.10)}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{padding-top:0!important;background:var(--paper)!important;color:var(--ink)!important;font-family:Inter,system-ui,-apple-system,"Segoe UI",sans-serif!important;font-weight:400!important;line-height:1.65}
a{color:var(--teal);text-decoration:none}
a:hover{color:#0b4d4b;text-decoration:underline}
img{max-width:100%;height:auto}
.oz-topbar{background:var(--navy);color:#dce8e7;font-size:.82rem;letter-spacing:.08em;padding:9px max(24px,calc((100vw - 1180px)/2));}
.oz-header{background:rgba(255,255,255,.96);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:1000;backdrop-filter:blur(12px)}
.oz-nav{max-width:1180px;margin:auto;padding:14px 24px;display:flex;align-items:center;justify-content:space-between;gap:24px}
.oz-brand{font-size:1.28rem;font-weight:850;letter-spacing:.14em;color:var(--navy);white-space:nowrap}
.oz-brand span{color:var(--teal)}
.oz-links{display:flex;flex-wrap:wrap;gap:5px 17px;align-items:center}
.oz-links a{font-size:.86rem;color:#344650;font-weight:600}
.oz-links a:hover{color:var(--teal)}
.oz-hero{background:radial-gradient(circle at 82% 25%,rgba(212,168,79,.2),transparent 28%),linear-gradient(125deg,#102c3a,#174e52 68%,#26716b);color:#fff;padding:88px 24px 78px;overflow:hidden}
.oz-hero-inner{max-width:1180px;margin:auto;display:grid;grid-template-columns:1.08fr .92fr;gap:55px;align-items:center}
.oz-kicker{font-size:.75rem;font-weight:800;letter-spacing:.18em;text-transform:uppercase;color:#b7d7d0}
.oz-hero h1{font-family:Georgia,serif;font-weight:500;letter-spacing:-.035em;font-size:clamp(2.7rem,5.2vw,5.1rem);line-height:1.02;margin:18px 0 24px;color:#fff}
.oz-hero p{font-size:1.12rem;line-height:1.8;color:#e0ece8;max-width:650px}
.oz-hero .oz-lead{font-size:1.25rem;color:#fff}
.oz-hero-art{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.16);border-radius:24px;padding:18px;box-shadow:0 24px 70px rgba(0,0,0,.18)}
.oz-wrap{max-width:1180px;margin:auto;padding:70px 24px}
.oz-section-head{max-width:760px;margin-bottom:34px}
.oz-eyebrow{color:var(--teal);font-size:.75rem;letter-spacing:.16em;font-weight:800;text-transform:uppercase}
.oz-section-head h2{font:500 clamp(2rem,3.6vw,3.2rem)/1.12 Georgia,serif;color:var(--navy);margin:12px 0}
.oz-section-head p{color:var(--muted);font-size:1.05rem}
.oz-principles{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.oz-principle,.oz-topic,.oz-source{background:#fff;border:1px solid var(--line);border-radius:16px;padding:25px;box-shadow:0 8px 30px rgba(17,42,52,.035)}
.oz-principle .num{color:var(--gold);font:italic 2rem Georgia,serif}
.oz-principle h3,.oz-topic h3{color:var(--navy);font-size:1.12rem;margin:8px 0}
.oz-principle p,.oz-topic p,.oz-source p{color:var(--muted);margin:0}
.oz-topic-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.oz-topic{position:relative;overflow:hidden;transition:transform .2s,box-shadow .2s}
.oz-topic:hover{transform:translateY(-3px);box-shadow:var(--shadow)}
.oz-topic .tag{font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;color:var(--teal);font-weight:800}
.oz-topic a.more{display:inline-block;margin-top:17px;font-size:.87rem;font-weight:800}
.oz-feature{background:var(--teal2);border-top:1px solid #c7ded8;border-bottom:1px solid #c7ded8}
.oz-feature-inner{max-width:1180px;margin:auto;padding:58px 24px;display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center}
.oz-feature h2{font:500 clamp(1.9rem,3.2vw,2.8rem)/1.12 Georgia,serif;color:var(--navy)}
.oz-feature p{color:#40575b}
.oz-source-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
.oz-source strong{display:block;color:var(--navy);margin-bottom:6px}
.oz-source small{display:block;color:var(--muted);margin-top:7px}
.oz-button{display:inline-block;padding:12px 19px;border-radius:99px;background:var(--gold);color:#17252d;font-weight:800;margin-top:16px}
.oz-button:hover{background:#e2bd70;color:#17252d;text-decoration:none}
.oz-footer{background:var(--navy);color:#d4e1df;padding:36px 24px}
.oz-footer-inner{max-width:1180px;margin:auto;display:flex;justify-content:space-between;gap:25px;flex-wrap:wrap}
.oz-footer a{color:#d4e1df}
.oz-note{font-size:.88rem;color:var(--muted)}
.oz-article-banner{background:var(--navy);color:white;padding:54px 24px}
.oz-article-banner>div{max-width:1180px;margin:auto}
.oz-article-banner h1{font:500 clamp(2.2rem,4vw,3.7rem)/1.1 Georgia,serif;color:#fff}
.oz-article-banner p{color:#dce8e7;max-width:780px}
body>section{padding:32px 0}
@media(max-width:850px){.oz-hero-inner,.oz-feature-inner{grid-template-columns:1fr}.oz-topic-grid{grid-template-columns:repeat(2,1fr)}.oz-nav{align-items:flex-start;flex-direction:column}.oz-links{gap:8px 14px}}
@media(max-width:560px){.oz-hero{padding:58px 20px}.oz-wrap{padding:48px 20px}.oz-topic-grid,.oz-principles,.oz-source-grid{grid-template-columns:1fr}.oz-links a{font-size:.8rem}}

/* Editorial illustrations added without changing legacy article copy */
.oz-editorial-figure{margin:1.6rem 0 2rem;overflow:hidden;border-radius:18px;background:#123f49;box-shadow:0 12px 32px rgba(15,48,56,.12)}
.oz-editorial-figure img{display:block;width:100%;height:auto;max-height:390px;object-fit:cover}
.oz-editorial-figure figcaption{padding:.65rem 1rem;color:#dce9e5;background:#123f49;font-size:.88rem;letter-spacing:.04em}
@media(max-width:700px){.oz-editorial-figure{margin:1rem 0 1.4rem;border-radius:12px}.oz-editorial-figure img{max-height:250px}}







/* Title header: full image visible, side by side */
.oz-title-compact .oz-editorial-figure,
.oz-title-compact .oz-photo {
  margin: 0 !important;
  overflow: visible !important;
  min-height: 200px !important;
}
.oz-title-compact .oz-editorial-figure img,
.oz-title-compact .oz-photo img,
.oz-title-compact img.oz-title-img {
  width: 100% !important;
  height: auto !important;
  max-height: 200px !important;
  object-fit: contain !important;
  object-position: center !important;
  display: block !important;
}





/* TITLE-IMG-NO-CROP v5 — full-width header images */
#title img,
.oz-title-compact img {
  max-height: 300px !important;
  height: auto !important;
  max-width: 100% !important;
  width: auto !important;
  object-fit: contain !important;
}
#title,
.oz-title-compact {
  overflow: visible !important;
  height: auto !important;
  max-height: none !important;
}


/* ------------------------------------------------------------------ */
/* Evidence, photography, charts and editorial-update components.    */
/* This section was consolidated from ozzone-evidence.css.           */
/* ------------------------------------------------------------------ */


/* OZ-ZONE evidence and media layer */
.oz-photo{margin:28px 0 34px;background:#f4f5f1;border-radius:16px;overflow:hidden;border:1px solid #dce3df}
.oz-photo img{display:block;width:100%;max-height:440px;object-fit:cover}
.oz-photo figcaption{padding:10px 14px 12px;font-size:12px;line-height:1.55;color:#596763}
.oz-photo figcaption a{color:#176c68;text-decoration:underline}
.oz-credit{color:#78847f}
.oz-photo-pair{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin:24px 0}
.oz-photo-pair .oz-photo{margin:0}
.oz-data-card{margin:34px 0;padding:24px 26px 22px;background:#f5f7f3;border:1px solid #d9e2dc;border-radius:18px;color:#203d3b}
.oz-data-card h2{font-size:clamp(20px,2.4vw,27px);line-height:1.2;margin:6px 0 16px;color:#183b39}
.oz-data-eyebrow{font-size:11px;text-transform:uppercase;letter-spacing:.14em;font-weight:700;color:#a87937}
.oz-data-svg{width:100%;height:auto;display:block;max-height:240px;margin:12px 0}
.oz-svg-label{font:600 15px Arial,sans-serif;fill:#244441}
.oz-svg-value{font:700 15px Arial,sans-serif;fill:#a36f2f}
.oz-svg-small{font:12px Arial,sans-serif;fill:#687b75}
.oz-svg-bar{fill:#277b75}
.oz-svg-box{fill:#e6eeea;stroke:#b8cbc2;stroke-width:1.5}
.oz-svg-arrow{fill:none;stroke:#a87937;stroke-width:3;stroke-linecap:round}
.oz-data-note{font-size:14px;line-height:1.65;color:#53645e;margin:12px 0 8px}
.oz-data-source{font-size:12px;line-height:1.55;color:#697a74;margin:10px 0 0}
.oz-data-source a{color:#176c68;text-decoration:underline}
.oz-big-stat{display:flex;align-items:baseline;gap:10px;margin:12px 0 4px;color:#1b4945}
.oz-big-stat strong{font-size:clamp(46px,7vw,76px);line-height:1;font-weight:700;letter-spacing:-.05em}
.oz-big-stat span{font-size:18px}
.oz-growth-pill{display:inline-block;background:#e8eee9;border:1px solid #cbd9d0;border-radius:999px;padding:6px 12px;font-size:13px;color:#31544e;font-weight:700}
.oz-footer-line{padding:18px 0 10px;text-align:center;color:#b8c8c2;font-size:12px;letter-spacing:.02em}
@media(max-width:650px){.oz-photo-pair{grid-template-columns:1fr}.oz-data-card{padding:18px 15px}.oz-photo img{max-height:320px}}

.oz-home-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:20px 0}
.oz-home-stats div{background:#e8efea;border-radius:12px;padding:14px}
.oz-home-stats strong{display:block;font-size:27px;color:#1d625c;line-height:1.1;margin-bottom:8px}
.oz-home-stats span{font-size:12px;line-height:1.45;color:#53645e;display:block}
@media(max-width:700px){.oz-home-stats{grid-template-columns:repeat(2,minmax(0,1fr))}}


.oz-editorial-update{margin:36px 0 28px;padding:26px 28px;background:#fffdf8;border:1px solid #d8c8a9;border-left:5px solid #b78a4a;border-radius:14px;color:#294340}
.oz-editorial-update .oz-update-kicker{font-size:11px;letter-spacing:.15em;text-transform:uppercase;font-weight:700;color:#a7793e;margin-bottom:8px}
.oz-editorial-update h2{font-size:25px;line-height:1.22;color:#183b39;margin:6px 0 16px}
.oz-editorial-update p{font-size:15px;line-height:1.72;color:#4e615b;margin:0 0 12px}
.oz-editorial-update .oz-update-sources{font-size:12px;border-top:1px solid #e6dfd2;padding-top:12px;margin-top:15px}
.oz-editorial-update a{color:#176c68;text-decoration:underline}


.oz-detail-chart{margin:26px 0 8px;padding:20px 22px;background:#f0f5f1;border:1px solid #d2ded6;border-radius:14px}
.oz-chart-kicker{font-size:10px;text-transform:uppercase;letter-spacing:.14em;color:#a7783b;font-weight:700}
.oz-detail-chart h3{font-size:20px;line-height:1.25;color:#193e3a;margin:7px 0 13px}
.oz-detail-svg{display:block;width:100%;height:auto;max-height:270px;margin:10px 0}
.oz-d-label{font:600 15px Arial,sans-serif;fill:#284743}
.oz-d-value{font:700 14px Arial,sans-serif;fill:#a36f2f}
.oz-d-small{font:12px Arial,sans-serif;fill:#687a74}
.oz-d-bar{fill:#287b74}.oz-d-track{fill:#dce7e0}
.oz-d-box{fill:#e3eee8;stroke:#b6c9bf;stroke-width:1.4}
.oz-d-box-accent{fill:#f4ead9;stroke:#d5bb8c;stroke-width:1.4}
.oz-d-arrow{fill:none;stroke:#a87937;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
.oz-d-axis{stroke:#bdcbc3;stroke-width:3;stroke-linecap:round}
.oz-d-tick{stroke:#bdcbc3;stroke-width:2}
.oz-d-dot{fill:#277b75;stroke:#fff;stroke-width:3}
.oz-chart-note{font-size:13px;line-height:1.65;color:#53655f;margin:12px 0 8px}
.oz-chart-source{font-size:11px;line-height:1.55;color:#6a7a74;border-top:1px solid #d8e2da;padding-top:10px;margin:10px 0 0}
.oz-chart-source a{color:#176c68;text-decoration:underline}














/* Title header: full image visible, side by side */
.oz-title-compact .oz-editorial-figure,
.oz-title-compact .oz-photo {
  margin: 0 !important;
  overflow: visible !important;
  min-height: 200px !important;
}
.oz-title-compact .oz-editorial-figure img,
.oz-title-compact .oz-photo img,
.oz-title-compact img.oz-title-img {
  width: 100% !important;
  height: auto !important;
  max-height: 200px !important;
  object-fit: contain !important;
  object-position: center !important;
  display: block !important;
}








/* TITLE-IMG-NO-CROP v6 — equal left/right header images */
#title img,
.oz-title-compact img {
  width: 100% !important;
  height: 280px !important;
  max-height: 280px !important;
  object-fit: contain !important;
  object-position: center center !important;
}


/* OZ-ZONE language switcher — isolated from the site's existing layout and typography. */
.oz-language-item{margin-left:8px}
.oz-language-switcher{display:flex;align-items:center;gap:4px;white-space:nowrap}
.oz-language-switcher a{display:inline-block;padding:5px 6px;font-size:11px;line-height:1;font-weight:700;letter-spacing:.03em;border:1px solid rgba(255,255,255,.22);border-radius:4px;color:#eaf3ef;text-decoration:none;background:rgba(255,255,255,.04)}
.oz-language-switcher a:hover,.oz-language-switcher a.oz-lang-active{background:#a7793e;border-color:#a7793e;color:#fff}
@media(max-width:767px){.oz-language-item{margin-left:0}.oz-language-switcher{justify-content:flex-start;padding:8px 15px 12px}}


/* OZ-ZONE translation widget: isolated; does not alter the site's typography or layout. */
.oz-google-translate{position:absolute !important;width:1px !important;height:1px !important;overflow:hidden !important;left:-10000px !important;top:auto !important;}
.oz-google-translate .goog-te-gadget{font-size:0 !important;}
.oz-language-switcher{font-family:inherit;}
body > .skiptranslate{display:none !important;}
iframe.goog-te-banner-frame{display:none !important;}
html{margin-top:0 !important;}

/* Language switcher alignment fix: keep it anchored to the navigation row even
   when translated navigation labels become wider.  The switcher is removed from
   the flex/float flow so French/German cannot push it onto a second line. */
@media(min-width:768px){
  .navbar-collapse{position:relative;}
  .navbar-collapse > .navbar-nav.navbar-right{padding-right:104px;}
  .navbar-collapse > .navbar-nav.navbar-right > .oz-language-item{
    position:absolute !important;
    right:0 !important;
    top:20px !important;
    margin:0 !important;
    float:none !important;
    height:30px !important;
    line-height:30px !important;
    white-space:nowrap !important;
  }
  .navbar-collapse > .navbar-nav.navbar-right > .oz-language-item .oz-language-switcher{
    height:30px !important;
    display:flex !important;
    align-items:center !important;
    flex-wrap:nowrap !important;
  }
  .navbar-collapse > .navbar-nav.navbar-right > .oz-language-item .oz-language-switcher a{
    float:none !important;
    white-space:nowrap !important;
    line-height:18px !important;
  }
}
@media(max-width:767px){
  .navbar-collapse > .navbar-nav.navbar-right > .oz-language-item{
    position:static !important;
    height:auto !important;
    line-height:normal !important;
  }
}


/* Final typography/navigation refinement — preserve the language switcher position while keeping the full navigation on one line. */
@media(min-width:768px){
  .navbar-collapse > .navbar-nav.navbar-right > li > a{white-space:nowrap !important;}
  .navbar-collapse > .navbar-nav.navbar-right > li:not(.oz-language-item) > a{padding-left:10px !important;padding-right:10px !important;}
  .navbar-collapse > .navbar-nav.navbar-right > li.oz-language-item{z-index:20;}
}
/* Slightly larger, more comfortable reading size for the site body. */
body{font-size:16px;}
@media(max-width:767px){body{font-size:16px;}}

/* Final navigation and reading-scale refinement.
   Keep the approved right-hand language switcher, give the header more vertical room,
   and keep every navigation item on the same desktop row. */
@media(min-width:768px){
  header.navbar-fixed-top{min-height:74px !important;}
  header.navbar-fixed-top .navbar-header{min-height:74px !important;}
  header.navbar-fixed-top .navbar-brand{height:74px !important;padding-top:15px !important;padding-bottom:15px !important;}
  header.navbar-fixed-top .navbar-collapse > .navbar-nav.navbar-right{
    display:flex !important;
    flex-wrap:nowrap !important;
    align-items:center !important;
    float:right !important;
    margin-right:0 !important;
    min-height:74px !important;
    padding-right:112px !important;
  }
  header.navbar-fixed-top .navbar-collapse > .navbar-nav.navbar-right > li:not(.oz-language-item){
    float:none !important;
    flex:0 0 auto !important;
  }
  header.navbar-fixed-top .navbar-collapse > .navbar-nav.navbar-right > li:not(.oz-language-item) > a{
    white-space:nowrap !important;
    padding-top:27px !important;
    padding-bottom:27px !important;
  }
  header.navbar-fixed-top .navbar-collapse > .navbar-nav.navbar-right > li.oz-language-item{
    top:22px !important;
    right:0 !important;
  }
}
/* Slightly larger reading text than the previous 16px setting. */
body{font-size:17px;}
@media(max-width:767px){body{font-size:17px;}}

/* Final visual balance: reduce the paired editorial header illustrations so the page header has more breathing room. */
@media(min-width:768px){
  .oz-title-compact table td:nth-child(1) > div,
  .oz-title-compact table td:nth-child(2) > div{min-height:240px !important;}
  .oz-title-compact table td:nth-child(1) img,
  .oz-title-compact table td:nth-child(2) img{height:220px !important;max-height:220px !important;}
}

/* Slightly more compact header imagery for a cleaner, lighter title area. */
@media(min-width:768px){
  .oz-title-compact table td:nth-child(1) > div,
  .oz-title-compact table td:nth-child(2) > div{min-height:210px !important;}
  .oz-title-compact table td:nth-child(1) img,
  .oz-title-compact table td:nth-child(2) img{height:190px !important;max-height:190px !important;}
}


/* FINAL HEADER BALANCE — 2026-10-05
   The earlier #title img rule had higher specificity and therefore kept the
   paired header pictures larger than intended. This final block deliberately
   overrides it without changing page-specific HTML.
*/

/* Article/title headers: more vertical breathing room, smaller paired images. */
@media(min-width:768px){
  .oz-title-compact{
    padding:24px 0 34px !important;
    overflow:visible !important;
    min-height:0 !important;
  }

  .oz-title-compact table{
    margin-top:16px !important;
  }

  .oz-title-compact table td:nth-child(1) > div,
  .oz-title-compact table td:nth-child(2) > div{
    min-height:245px !important;
    height:245px !important;
    box-sizing:border-box !important;
  }

  /* Left illustration: retain a little more presence. */
  .oz-title-compact table td:nth-child(1) img{
    width:100% !important;
    height:215px !important;
    max-height:215px !important;
    object-fit:contain !important;
  }

  /* Right-hand photographs: visibly smaller, as requested. */
  .oz-title-compact table td:nth-child(2) img{
    width:100% !important;
    height:185px !important;
    max-height:185px !important;
    object-fit:contain !important;
  }
}

/* Homepage: give the hero more vertical presence while reducing the artwork
   slightly so the image no longer dominates the header area. */
@media(min-width:768px){
  .oz-hero{
    padding:100px 24px 92px !important;
  }
  .oz-hero-art{
    padding:16px !important;
  }
  .oz-hero-art img{
    width:90% !important;
    max-width:90% !important;
    height:auto !important;
    max-height:520px !important;
    object-fit:contain !important;
    margin:0 auto !important;
  }
}

/* Keep the mobile version comfortable and proportional. */
@media(max-width:767px){
  .oz-title-compact{
    padding:20px 0 28px !important;
  }
  .oz-title-compact table td:nth-child(1) img,
  .oz-title-compact table td:nth-child(2) img{
    height:auto !important;
    max-height:190px !important;
    object-fit:contain !important;
  }
  .oz-hero{
    padding:70px 20px 60px !important;
  }
  .oz-hero-art img{
    width:92% !important;
    max-width:92% !important;
    margin:0 auto !important;
  }
}


/* FINAL HEADER STRUCTURE — SWITCHER ON ITS OWN ROW
   The language switcher is intentionally placed below the logo/navigation row.
   This gives the title/image area the vertical room it needs without shrinking
   the illustrations.
*/
@media(min-width:768px){
  header.navbar-fixed-top{
    min-height:112px !important;
    height:112px !important;
  }

  header.navbar-fixed-top .container{
    position:relative !important;
    min-height:112px !important;
  }

  /* Main logo/navigation row */
  header.navbar-fixed-top .navbar-header{
    min-height:74px !important;
    height:74px !important;
  }

  header.navbar-fixed-top .navbar-brand{
    height:74px !important;
    padding-top:15px !important;
    padding-bottom:15px !important;
  }

  header.navbar-fixed-top .navbar-collapse{
    min-height:74px !important;
    height:74px !important;
  }

  header.navbar-fixed-top .navbar-collapse > .navbar-nav.navbar-right{
    min-height:74px !important;
    height:74px !important;
    padding-right:0 !important;
  }

  /* Remove the switcher from the navigation row completely. */
  header.navbar-fixed-top .navbar-collapse > .navbar-nav.navbar-right > li.oz-language-item{
    position:absolute !important;
    top:74px !important;
    right:0 !important;
    width:auto !important;
    height:38px !important;
    min-height:38px !important;
    margin:0 !important;
    padding:0 !important;
    display:block !important;
    z-index:50 !important;
  }

  header.navbar-fixed-top .oz-language-switcher{
    height:38px !important;
    min-height:38px !important;
    padding:8px 0 7px !important;
    display:flex !important;
    align-items:center !important;
    justify-content:flex-end !important;
    gap:5px !important;
  }

  header.navbar-fixed-top .oz-language-switcher a{
    line-height:18px !important;
  }

  /* Desktop article title/picture section starts below the complete header. */
  body{
    padding-top:112px !important;
  }

  /* Restore a generous, consistent title area. */
  .oz-title-compact{
    padding:28px 0 38px !important;
  }

  .oz-title-compact table{
    margin-top:18px !important;
  }

  .oz-title-compact table td:nth-child(1) > div,
  .oz-title-compact table td:nth-child(2) > div{
    min-height:270px !important;
    height:270px !important;
  }

  .oz-title-compact table td:nth-child(1) img{
    height:235px !important;
    max-height:235px !important;
  }

  .oz-title-compact table td:nth-child(2) img{
    height:215px !important;
    max-height:215px !important;
  }
}

/* Mobile: retain the normal collapsed navigation and don't force the
   desktop two-row header geometry.
   NOTE: body padding-top is controlled only by the final mobile block
   at the end of this file (must match real navbar height to avoid
   the light paper-coloured stripe under the fixed header). */
@media(max-width:767px){
  header.navbar-fixed-top{
    height:auto !important;
    min-height:56px !important;
  }
  /* do NOT set body padding-top here — final mobile block owns it */
}


/* NAVIGATION STABILITY — preserve the original OZ-ZONE colours and prevent
   Bootstrap active-link state from moving the navigation row. */
@media(min-width:768px){
  header.navbar-fixed-top,
  header.navbar-fixed-top .container,
  header.navbar-fixed-top .navbar-collapse{
    overflow:visible !important;
  }

  header.navbar-fixed-top .navbar-collapse > .navbar-nav.navbar-right{
    position:relative !important;
    margin-top:0 !important;
    top:0 !important;
    transform:none !important;
    align-items:stretch !important;
  }

  header.navbar-fixed-top .navbar-collapse > .navbar-nav.navbar-right > li:not(.oz-language-item){
    height:74px !important;
    min-height:74px !important;
    margin-top:0 !important;
    margin-bottom:0 !important;
    top:0 !important;
  }

  header.navbar-fixed-top .navbar-collapse > .navbar-nav.navbar-right > li:not(.oz-language-item) > a{
    height:74px !important;
    min-height:74px !important;
    box-sizing:border-box !important;
    padding-top:27px !important;
    padding-bottom:27px !important;
    margin-top:0 !important;
    margin-bottom:0 !important;
    background-color:#03417e !important;
    color:#bdc3c7 !important;
    border-radius:4px !important;
    line-height:20px !important;
  }

  header.navbar-fixed-top .navbar-collapse > .navbar-nav.navbar-right > li.active:not(.oz-language-item) > a,
  header.navbar-fixed-top .navbar-collapse > .navbar-nav.navbar-right > li.active:not(.oz-language-item) > a:hover,
  header.navbar-fixed-top .navbar-collapse > .navbar-nav.navbar-right > li.active:not(.oz-language-item) > a:focus{
    background-color:#2c3e50 !important;
    color:#fff !important;
  }

  header.navbar-fixed-top .navbar-collapse > .navbar-nav.navbar-right > li:not(.oz-language-item) > a:hover,
  header.navbar-fixed-top .navbar-collapse > .navbar-nav.navbar-right > li:not(.oz-language-item) > a:focus{
    background-color:#03417e !important;
    color:#fff !important;
  }

  header.navbar-fixed-top .navbar-collapse > .navbar-nav.navbar-right > li.oz-language-item{
    top:74px !important;
  }
}

/* FINAL TITLE-CAPTION FIX — keep right-hand explanation visible */
@media(min-width:768px){
  .oz-title-compact table td:nth-child(1) > div,
  .oz-title-compact table td:nth-child(2) > div{
    box-sizing:border-box !important;
    min-height:245px !important;
    height:auto !important;
    justify-content:flex-start !important;
  }

  .oz-title-compact table td:nth-child(1) img,
  .oz-title-compact table td:nth-child(2) img{
    flex:0 0 auto !important;
  }

  .oz-title-compact table td:nth-child(1) > div > div,
  .oz-title-compact table td:nth-child(2) > div > div{
    display:block !important;
    flex:0 0 auto !important;
    width:100% !important;
    box-sizing:border-box !important;
  }
}

/* FINAL HORIZONTAL NAVIGATION BALANCE
   French and German labels need more horizontal room than English.
   Reclaim space without reducing the navigation font size or changing its
   vertical geometry.  This is deliberately the last desktop rule. */
@media(min-width:768px){
  header.navbar-fixed-top .navbar-header{
    width:156px !important;
  }
  header.navbar-fixed-top .navbar-brand{
    width:156px !important;
    padding-left:7px !important;
    padding-right:8px !important;
  }
  header.navbar-fixed-top .navbar-brand img{
    max-width:141px !important;
    width:141px !important;
    height:auto !important;
  }

  header.navbar-fixed-top .navbar-collapse > .navbar-nav.navbar-right > li:not(.oz-language-item) > a{
    padding-left:6px !important;
    padding-right:6px !important;
  }

  /* Keep the menu as one continuous horizontal row; never let a translated
     label create a second line. */
  header.navbar-fixed-top .navbar-collapse > .navbar-nav.navbar-right{
    flex-wrap:nowrap !important;
    white-space:nowrap !important;
  }
}


/* FINAL LOGO / NAVIGATION SPACE FIX
   Give the navigation more horizontal room by reducing the header's reserved
   logo column and moving the logo itself left.  The logo keeps its size;
   only its horizontal position and the space reserved beside it change.
*/
@media(min-width:768px){
  header.navbar-fixed-top .navbar-header{
    width:105px !important;
    min-width:105px !important;
    float:left !important;
  }

  header.navbar-fixed-top .navbar-brand{
    width:141px !important;
    max-width:141px !important;
    margin-left:-40px !important;
    padding-left:0 !important;
    padding-right:0 !important;
  }

  header.navbar-fixed-top .navbar-brand img{
    width:141px !important;
    max-width:141px !important;
    height:auto !important;
    display:block !important;
  }

  /* The navigation remains anchored to the right and gains the space
     released by the smaller logo column. */
  header.navbar-fixed-top .navbar-collapse{
    margin-left:0 !important;
  }

  header.navbar-fixed-top .navbar-collapse > .navbar-nav.navbar-right{
    float:right !important;
    margin-right:0 !important;
  }
}

/* FINAL HEADER WIDTH FIX — logo floats independently of the menu
   The logo must not consume horizontal width needed by the longer French and
   German navigation labels.  Keep the logo on the left, but take it out of
   the width calculation used by the navigation. */
@media(min-width:768px){
  header.navbar-fixed-top .container{
    position:relative !important;
  }

  header.navbar-fixed-top .navbar-header{
    position:absolute !important;
    left:-48px !important;
    top:0 !important;
    width:141px !important;
    min-width:141px !important;
    height:74px !important;
    min-height:74px !important;
    float:none !important;
    z-index:20 !important;
  }

  header.navbar-fixed-top .navbar-brand{
    display:block !important;
    width:141px !important;
    height:74px !important;
    margin:0 !important;
    padding:15px 0 !important;
  }

  header.navbar-fixed-top .navbar-brand img{
    display:block !important;
    width:141px !important;
    max-width:141px !important;
    height:auto !important;
    margin:0 !important;
  }

  /* Full container width is now available to the menu. */
  header.navbar-fixed-top .navbar-collapse{
    width:100% !important;
    margin:0 !important;
    padding-left:0 !important;
    padding-right:0 !important;
    float:none !important;
    border-top:0 !important;
  }

  header.navbar-fixed-top .navbar-collapse > .navbar-nav.navbar-right{
    float:right !important;
    margin-right:0 !important;
    margin-left:0 !important;
    width:auto !important;
    max-width:none !important;
    flex-wrap:nowrap !important;
    white-space:nowrap !important;
  }
}


/* TRANSLATED HEADER RIBBON FIX — French/German only
   The language switcher occupies the lower 38px of the translated header.
   Keep that row the same OZ-ZONE blue as the main navigation; English is untouched. */
@media(min-width:768px){
  body.oz-translated header.navbar-fixed-top,
  body.oz-translated header.navbar-fixed-top .container,
  body.oz-translated header.navbar-fixed-top .navbar-collapse,
  body.oz-translated header.navbar-fixed-top .navbar-collapse > .navbar-nav.navbar-right{
    background-color:#03417e !important;
  }

  /* removed fixed 112px height that caused white gap under nav */
body.oz-translated header.navbar-fixed-top{height:auto!important;min-height:74px!important;}

  body.oz-translated header.navbar-fixed-top .navbar-collapse > .navbar-nav.navbar-right > li.oz-language-item{
    background-color:#03417e !important;
  }

  body.oz-translated header.navbar-fixed-top .navbar-collapse > .navbar-nav.navbar-right > li.oz-language-item .oz-language-switcher{
    background-color:#03417e !important;
  }
}


/* === FIX: remove white stripe under nav on FR/DE (match English header) === */

/* Hide Google Translate chrome that injects white bars */
.goog-te-banner-frame,
.goog-te-banner-frame.skiptranslate,
iframe.goog-te-banner-frame,
body > .skiptranslate,
.goog-te-spinner-pos,
#goog-gt-tt,
.goog-te-balloon-frame {
  display: none !important;
  visibility: hidden !important;
  height: 0 !important;
  max-height: 0 !important;
  overflow: hidden !important;
}

/* Google often shifts the whole page down — undo that */
html body {
  top: 0 !important;
  position: static !important;
}
body.oz-translated {
  top: 0 !important;
  position: static !important;
}

/* Keep translated header the same height/look as English */
@media (min-width: 768px) {
  body.oz-translated header.navbar-fixed-top,
  body.oz-translated header.navbar-fixed-top .container,
  body.oz-translated header.navbar-fixed-top .navbar-collapse,
  body.oz-translated header.navbar-fixed-top .navbar-header,
  body.oz-translated header.navbar-fixed-top .navbar-collapse > .navbar-nav.navbar-right {
    background-color: #03417e !important;
    background-image: none !important;
  }

  body.oz-translated header.navbar-fixed-top {
    height: auto !important;
    min-height: 74px !important;
    max-height: none !important;
    border-bottom: none !important;
    box-shadow: none !important;
  }

  body.oz-translated header.navbar-fixed-top .navbar-header {
    min-height: 74px !important;
  }

  body.oz-translated header.navbar-fixed-top .navbar-brand {
    height: 74px !important;
    padding-top: 15px !important;
    padding-bottom: 15px !important;
  }

  body.oz-translated header.navbar-fixed-top .navbar-collapse > .navbar-nav.navbar-right {
    min-height: 74px !important;
    align-items: center !important;
  }

  /* Longer FR/DE labels: keep one row, slightly tighter */
  body.oz-translated header.navbar-fixed-top .navbar-collapse > .navbar-nav.navbar-right > li:not(.oz-language-item) > a {
    white-space: nowrap !important;
    padding-top: 27px !important;
    padding-bottom: 27px !important;
    padding-left: 8px !important;
    padding-right: 8px !important;
    font-size: 12px !important;
  }

  body.oz-translated header.navbar-fixed-top .navbar-collapse > .navbar-nav.navbar-right > li.oz-language-item {
    top: 22px !important;
    background-color: #03417e !important;
  }

  body.oz-translated header.navbar-fixed-top .navbar-collapse > .navbar-nav.navbar-right > li.oz-language-item .oz-language-switcher {
    background-color: transparent !important;
  }
}

/* No extra gap between fixed header and page content */
/* padding-top for oz-translated set in navbar-clearance fix */

/* Title band should sit flush under the blue bar */
body.oz-translated #title.facts {
  margin-top: 0 !important;
}


/* === FIX: FR/DE language switcher below page links (no overlap with Motivations) === */
@media (min-width: 768px) {
  /* Give the translated header a second band for DE/FR/EN */
  body.oz-translated header.navbar-fixed-top {
    height: auto !important;
    min-height: 98px !important;
    padding-bottom: 0 !important;
  }

  body.oz-translated header.navbar-fixed-top .navbar-header,
  body.oz-translated header.navbar-fixed-top .navbar-brand {
    min-height: 50px !important;
    height: 50px !important;
  }

  body.oz-translated header.navbar-fixed-top .navbar-brand {
    padding-top: 8px !important;
    padding-bottom: 8px !important;
  }

  body.oz-translated header.navbar-fixed-top .navbar-collapse > .navbar-nav.navbar-right {
    min-height: 98px !important;
    align-items: flex-start !important;
    padding-top: 0 !important;
    padding-right: 0 !important; /* free the right edge; switcher sits below */
    position: relative !important;
  }

  /* Page links on the upper row only */
  body.oz-translated header.navbar-fixed-top .navbar-collapse > .navbar-nav.navbar-right > li:not(.oz-language-item) > a {
    padding-top: 14px !important;
    padding-bottom: 10px !important;
    padding-left: 8px !important;
    padding-right: 8px !important;
    font-size: 12px !important;
    white-space: nowrap !important;
  }

  /* Language switcher on its own row under the page links, right-aligned */
  body.oz-translated header.navbar-fixed-top .navbar-collapse > .navbar-nav.navbar-right > li.oz-language-item {
    position: absolute !important;
    top: auto !important;
    bottom: 8px !important;
    right: 12px !important;
    left: auto !important;
    height: auto !important;
    line-height: normal !important;
    margin: 0 !important;
    z-index: 25 !important;
    background: transparent !important;
  }

  body.oz-translated header.navbar-fixed-top .navbar-collapse > .navbar-nav.navbar-right > li.oz-language-item .oz-language-switcher {
    background: transparent !important;
    height: auto !important;
  }

  body.oz-translated header.navbar-fixed-top .navbar-collapse > .navbar-nav.navbar-right > li.oz-language-item .oz-language-switcher a {
    line-height: 18px !important;
  }
}


/* === FIX: smaller active-link highlight (all languages) === */
@media (min-width: 768px) {
  /* English: compact dark pill, vertically centered, no row jump */
  header.navbar-fixed-top .navbar-collapse > .navbar-nav.navbar-right > li.active:not(.oz-language-item) > a,
  header.navbar-fixed-top .navbar-collapse > .navbar-nav.navbar-right > li.active:not(.oz-language-item) > a:hover,
  header.navbar-fixed-top .navbar-collapse > .navbar-nav.navbar-right > li.active:not(.oz-language-item) > a:focus,
  header.navbar-fixed-top .navbar-nav > li.active > a,
  header.navbar-fixed-top .navbar-nav > li.active > a:hover,
  header.navbar-fixed-top .navbar-nav > li.active > a:focus {
    background-color: #2c3e50 !important;
    color: #fff !important;
    /* keep same box as siblings so the label does not drop a row */
    height: 74px !important;
    min-height: 74px !important;
    padding-top: 27px !important;
    padding-bottom: 27px !important;
    padding-left: 10px !important;
    padding-right: 10px !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    line-height: 20px !important;
    border-radius: 4px !important;
    white-space: nowrap !important;
    box-sizing: border-box !important;
    /* visual “smaller signal”: dark bar only behind the text band via inset shadow */
    box-shadow: inset 0 22px 0 0 #03417e, inset 0 -22px 0 0 #03417e !important;
  }

  header.navbar-fixed-top .navbar-collapse > .navbar-nav.navbar-right > li.open:not(.oz-language-item) > a,
  header.navbar-fixed-top .navbar-collapse > .navbar-nav.navbar-right > li.open:not(.oz-language-item) > a:hover,
  header.navbar-fixed-top .navbar-collapse > .navbar-nav.navbar-right > li.open:not(.oz-language-item) > a:focus {
    background-color: #2c3e50 !important;
    height: 74px !important;
    min-height: 74px !important;
    padding-top: 27px !important;
    padding-bottom: 27px !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    line-height: 20px !important;
    border-radius: 4px !important;
    white-space: nowrap !important;
    box-shadow: inset 0 22px 0 0 #03417e, inset 0 -22px 0 0 #03417e !important;
  }

  /* FR/DE: same row as other links; active still visible; no jump */
  body.oz-translated header.navbar-fixed-top .navbar-collapse > .navbar-nav.navbar-right > li.active:not(.oz-language-item) > a,
  body.oz-translated header.navbar-fixed-top .navbar-collapse > .navbar-nav.navbar-right > li.active:not(.oz-language-item) > a:hover,
  body.oz-translated header.navbar-fixed-top .navbar-collapse > .navbar-nav.navbar-right > li.active:not(.oz-language-item) > a:focus,
  body.oz-translated header.navbar-fixed-top .navbar-collapse > .navbar-nav.navbar-right > li.open:not(.oz-language-item) > a,
  body.oz-translated header.navbar-fixed-top .navbar-collapse > .navbar-nav.navbar-right > li.open:not(.oz-language-item) > a:hover,
  body.oz-translated header.navbar-fixed-top .navbar-collapse > .navbar-nav.navbar-right > li.open:not(.oz-language-item) > a:focus {
    background-color: #2c3e50 !important;
    color: #fff !important;
    height: auto !important;
    min-height: 0 !important;
    padding-top: 14px !important;
    padding-bottom: 10px !important;
    padding-left: 8px !important;
    padding-right: 8px !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    line-height: 1.25 !important;
    border-radius: 4px !important;
    white-space: nowrap !important;
    box-shadow: none !important;
    position: relative !important;
    top: 0 !important;
    transform: none !important;
  }

  /* Google Translate wraps text in font tags — keep them on one line */
  body.oz-translated header.navbar-fixed-top .navbar-nav > li > a,
  body.oz-translated header.navbar-fixed-top .navbar-nav > li > a font,
  body.oz-translated header.navbar-fixed-top .navbar-nav > li.active > a font {
    white-space: nowrap !important;
    vertical-align: baseline !important;
  }
}

@media (max-width: 767px) {
  header.navbar-fixed-top .navbar-nav > li.active > a,
  header.navbar-fixed-top .navbar-nav > li.active > a:hover,
  header.navbar-fixed-top .navbar-nav > li.active > a:focus {
    background-color: #2c3e50 !important;
    padding-top: 8px !important;
    padding-bottom: 8px !important;
    margin: 0 !important;
  }
}



/* === FIX: content clears fixed navbar (EN + FR/DE); melting title link readable === */
@media (min-width: 768px) {
  body {
    padding-top: 74px !important;
  }
  body.oz-translated {
    padding-top: 102px !important;
    top: 0 !important;
  }

  #title.facts,
  #title.oz-title-compact,
  body.oz-translated #title.facts,
  body.oz-translated #title.oz-title-compact {
    margin-top: 0 !important;
    padding-top: 20px !important;
    position: relative !important;
    top: 0 !important;
    overflow: visible !important;
  }

  #title.facts p,
  #title.facts a.emerald,
  body.oz-translated #title.facts p,
  body.oz-translated #title.facts a.emerald,
  body.oz-translated #title.facts a.oz-title-cta {
    position: relative !important;
    top: 0 !important;
    visibility: visible !important;
    opacity: 1 !important;
  }
}

/* ============================================================
   Mobile header + always-visible language switcher (phones)
   ============================================================ */

/* Desktop: show the switcher that lives in the nav; hide the mobile copy */
@media (min-width: 992px) {
  .oz-lang-mobile-visible {
    display: none !important;
  }
  .oz-lang-desktop-visible {
    display: block !important;
  }
}

/* Phones + large phones (up to 991px): single-row header, language always visible.
   The old 112px two-row desktop header was leaking onto phones and created
   the light stripe under the logo bar. */
@media (max-width: 991px) {
  .oz-lang-desktop-visible {
    display: none !important;
  }
  .oz-lang-mobile-visible {
    display: block !important;
  }

  /* Match navbar + fine accent line */
  body {
    padding-top: 58px !important; /* 56px bar + 2px gold accent */
    background-color: #f4f2ec !important;
  }
  body.oz-translated {
    padding-top: 58px !important;
  }

  /* Solid dark navbar with fine gold accent line underneath */
  header.navbar.navbar-fixed-top,
  header.navbar.navbar-inverse.navbar-fixed-top.karl-midnight-blue {
    background-color: #03417e !important; /* karl-midnight-blue */
    border: none !important;
    border-bottom: 2px solid #d4a84f !important; /* fine contrasting accent row */
    margin: 0 !important;
    padding: 0 !important;
    min-height: 56px !important;
    height: 56px !important;
    box-shadow: none !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
  }

  header.navbar-fixed-top > .container {
    min-height: 56px !important;
    height: 56px !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }

  header.navbar-fixed-top .navbar-header {
    position: relative !important;
    width: 100% !important;
    min-height: 56px !important;
    height: 56px !important;
    margin: 0 !important;
  }

  header.navbar-fixed-top .navbar-brand {
    height: 56px !important;
    padding-top: 8px !important;
    padding-bottom: 8px !important;
    line-height: 40px !important;
  }

  header.navbar-fixed-top .navbar-brand img {
    max-height: 40px !important;
    width: auto !important;
  }

  /* Language switcher between logo and hamburger */
  header.navbar-fixed-top .oz-lang-mobile-visible {
    position: absolute !important;
    top: 12px !important;
    right: 58px !important;
    left: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    z-index: 1040 !important;
  }

  header.navbar-fixed-top .oz-lang-mobile-visible .oz-language-switcher {
    display: flex !important;
    align-items: center !important;
    gap: 4px !important;
    padding: 0 !important;
    white-space: nowrap !important;
  }

  header.navbar-fixed-top .oz-lang-mobile-visible .oz-language-switcher a {
    display: inline-block !important;
    padding: 5px 7px !important;
    font-size: 11px !important;
    line-height: 1 !important;
    font-weight: 700 !important;
    border: 1px solid rgba(255, 255, 255, 0.35) !important;
    border-radius: 4px !important;
    color: #eaf3ef !important;
    background: rgba(255, 255, 255, 0.08) !important;
    text-decoration: none !important;
  }

  header.navbar-fixed-top .oz-lang-mobile-visible .oz-language-switcher a.oz-lang-active,
  header.navbar-fixed-top .oz-lang-mobile-visible .oz-language-switcher a:hover {
    background: #a7793e !important;
    border-color: #a7793e !important;
    color: #fff !important;
  }

  /* Hamburger on the far right, vertically centred */
  header.navbar-fixed-top .navbar-toggle {
    position: relative !important;
    z-index: 1041 !important;
    float: right !important;
    margin: 10px 0 10px 0 !important;
  }

  /* First content block sits cleanly under the bar — no extra top gap */
  main,
  body > main,
  .oz-hero {
    margin-top: 0 !important;
  }
}






/* ============================================================
   Fine contrasting accent row under the blue header (all sizes)
   ============================================================ */
header.navbar.navbar-fixed-top,
header.navbar.navbar-inverse.navbar-fixed-top.karl-midnight-blue {
  border-bottom: 2px solid #d4a84f !important; /* gold accent — intentional fine row */
  box-shadow: none !important;
}

/* ============================================================
   HARD OVERRIDE — phones & large phones (≤991px)
   Keep a single-row header; gold line stays as the accent under the bar.
   ============================================================ */
@media (max-width: 991px) {
  header.navbar.navbar-fixed-top,
  header.navbar.navbar-inverse.navbar-fixed-top.karl-midnight-blue {
    min-height: 56px !important;
    height: 56px !important;
    max-height: 56px !important;
    background-color: #03417e !important;
    border: none !important;
    border-bottom: 2px solid #d4a84f !important; /* fine contrasting accent */
    margin: 0 !important;
    padding: 0 !important;
    box-shadow: none !important;
    overflow: visible !important;
  }
  header.navbar-fixed-top > .container {
    min-height: 56px !important;
    height: 56px !important;
    max-height: 56px !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }
  header.navbar-fixed-top .navbar-header {
    min-height: 56px !important;
    height: 56px !important;
    float: none !important;
    width: 100% !important;
  }
  header.navbar-fixed-top .navbar-brand {
    height: 56px !important;
    padding-top: 8px !important;
    padding-bottom: 8px !important;
  }
  header.navbar-fixed-top .navbar-brand img {
    max-height: 40px !important;
  }
  /* Hide desktop second-row language positioning */
  header.navbar-fixed-top .navbar-collapse > .navbar-nav.navbar-right > li.oz-language-item.oz-lang-desktop-visible {
    display: none !important;
  }
  body {
    padding-top: 58px !important; /* 56px bar + 2px accent */
  }
  body.oz-translated {
    padding-top: 58px !important;
  }
  main, body > main, .oz-hero {
    margin-top: 0 !important;
  }
}


/* ============================================================
   iOS / mobile open menu panel
   ONLY when the hamburger is open (.in) — never touch the closed
   menu or page content width.
   ============================================================ */
@media (max-width: 991px) {

  /* Closed menu must stay fully hidden and out of layout flow */
  header.navbar-fixed-top .navbar-collapse.collapse:not(.in) {
    display: none !important;
    height: 0 !important;
    overflow: hidden !important;
    padding: 0 !important;
    margin: 0 !important;
    border: none !important;
    box-shadow: none !important;
  }

  /* Open menu only */
  header.navbar-fixed-top .navbar-collapse.in,
  header.navbar-fixed-top .navbar-collapse.collapsing {
    display: block !important;
    background-color: #03417e !important;
    border: none !important;
    border-top: 1px solid rgba(255, 255, 255, 0.12) !important;
    box-shadow: 0 12px 28px rgba(0, 0, 0, 0.35) !important;
    margin: 0 -15px !important; /* full-bleed within Bootstrap container padding */
    padding: 8px 0 12px !important;
    max-height: none !important;
    overflow: visible !important;
    clear: both !important;
  }

  header.navbar-fixed-top .navbar-collapse.in > .navbar-nav,
  header.navbar-fixed-top .navbar-collapse.in > .navbar-nav.navbar-right {
    float: none !important;
    margin: 0 !important;
    width: 100% !important;
    background-color: #03417e !important;
  }

  header.navbar-fixed-top .navbar-collapse.in > .navbar-nav > li,
  header.navbar-fixed-top .navbar-collapse.in > .navbar-nav.navbar-right > li {
    float: none !important;
    display: block !important;
    width: 100% !important;
    margin: 0 !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
  }

  header.navbar-fixed-top .navbar-collapse.in > .navbar-nav > li > a,
  header.navbar-fixed-top .navbar-collapse.in > .navbar-nav.navbar-right > li > a {
    display: block !important;
    float: none !important;
    padding: 12px 18px !important;
    color: #eaf3ef !important;
    background-color: transparent !important;
    border-radius: 0 !important;
    line-height: 1.35 !important;
    white-space: normal !important;
  }

  header.navbar-fixed-top .navbar-collapse.in > .navbar-nav > li.active > a,
  header.navbar-fixed-top .navbar-collapse.in > .navbar-nav > li > a:hover,
  header.navbar-fixed-top .navbar-collapse.in > .navbar-nav > li > a:focus,
  header.navbar-fixed-top .navbar-collapse.in > .navbar-nav.navbar-right > li.active > a,
  header.navbar-fixed-top .navbar-collapse.in > .navbar-nav.navbar-right > li > a:hover,
  header.navbar-fixed-top .navbar-collapse.in > .navbar-nav.navbar-right > li > a:focus {
    background-color: #02305e !important;
    color: #ffffff !important;
  }

  /* Motivations submenu only when parent dropdown is open */
  header.navbar-fixed-top .navbar-collapse.in .dropdown-menu {
    position: static !important;
    float: none !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    background-color: #02305e !important;
    border: none !important;
    box-shadow: none !important;
  }

  header.navbar-fixed-top .navbar-collapse.in .dropdown.open > .dropdown-menu {
    display: block !important;
  }

  header.navbar-fixed-top .navbar-collapse.in .dropdown-menu > li > a {
    display: block !important;
    padding: 10px 18px 10px 28px !important;
    color: #d5e4e8 !important;
    background: transparent !important;
  }

  header.navbar-fixed-top .navbar-collapse.in .dropdown-menu > li > a:hover,
  header.navbar-fixed-top .navbar-collapse.in .dropdown-menu > li > a:focus {
    background-color: #012747 !important;
    color: #ffffff !important;
  }

  header.navbar.navbar-fixed-top {
    z-index: 1040 !important;
  }
}


/* ============================================================
   Mobile content width — full-width text on phones
   Bootstrap col-sm-* without col-xs-12 can stay ~58% wide on
   small screens. Force article columns and title tables full width.
   ============================================================ */
@media (max-width: 767px) {

  /* Main content columns: full width, stacked */
  section.container > .col-sm-4,
  section.container > .col-sm-7,
  section.container > .col-sm-8,
  section.container > .col-sm-6,
  section.container > [class*="col-sm-"],
  section.container .col-sm-4,
  section.container .col-sm-7,
  section.container .col-sm-8,
  section.container .col-sm-6,
  section.container .col-sm-push-8,
  section.container .col-sm-pull-4 {
    width: 100% !important;
    float: none !important;
    left: auto !important;
    right: auto !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 15px !important;
    padding-right: 15px !important;
  }

  /* Title image tables: one column on phones */
  .oz-title-media-table,
  .oz-title-compact table,
  table.oz-title-media-table {
    width: 100% !important;
    display: block !important;
  }
  .oz-title-media-table tbody,
  .oz-title-media-table tr,
  .oz-title-compact table tbody,
  .oz-title-compact table tr {
    display: block !important;
    width: 100% !important;
  }
  .oz-title-media-table td,
  .oz-title-compact table td {
    display: block !important;
    width: 100% !important;
    padding: 8px 0 !important;
  }

  /* Ensure containers use full available width */
  section.container,
  .container {
    width: 100% !important;
    max-width: 100% !important;
    padding-left: 15px !important;
    padding-right: 15px !important;
  }

  /* Article body text comfortable measure */
  section.container p,
  section.container li,
  #biology p,
  #biology1 p,
  main p {
    max-width: 100% !important;
  }
}

/* ============================================================
   Phone content width fixes (problem pages)
   - col-xs-5 / col-xs-6 on main text forced full width
   - biology/hubris/cosmic item grids stack on phones
   - large fixed margins removed on small screens
   ============================================================ */
@media (max-width: 767px) {

  /* Legacy narrow content columns (HTML also corrected) */
  .col-xs-5,
  .col-xs-6,
  .col-xs-7,
  .col-xs-8,
  .col-xs-9,
  .col-xs-10,
  .col-md-7.col-xs-5,
  .col-md-9.col-xs-6,
  .col-md-12.col-xs-6,
  .col-md-3.col-xs-5 {
    width: 100% !important;
    float: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  /* Keep intentional 3-up image thumbs as 2-up on phones, not tiny thirds */
  .col-xs-4 {
    width: 50% !important;
  }

  /* Item grids that were forced to 33% width */
  .biology-items.col-3 > li,
  .hubris-items.col-3 > li,
  .cosmic-items.col-3 > li,
  .biology-items.col-4 > li,
  .hubris-items.col-4 > li {
    width: 100% !important;
    float: none !important;
  }

  .biology-items,
  .hubris-items,
  .cosmic-items {
    margin-right: 0 !important;
  }

  /* Fixed side margins that squeeze content on phones */
  img[style*="margin-left"],
  div[style*="margin-left:50px"],
  div[style*="margin-left:40px"],
  div[style*="margin-left:30px"] {
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  /* Sidebar + text columns stack full width */
  aside.col-sm-4,
  aside.col-sm-5,
  .col-sm-4.col-sm-push-8,
  .col-sm-5.col-sm-push-7,
  .col-sm-7.col-sm-pull-4,
  .col-sm-7.col-sm-pull-5 {
    width: 100% !important;
    float: none !important;
    left: auto !important;
    right: auto !important;
    padding-top: 0 !important;
  }

  aside.col-sm-4 img,
  aside.col-sm-5 img {
    padding-top: 12px !important;
    max-width: 100% !important;
    width: auto !important;
    margin: 0 auto 16px !important;
    display: block !important;
  }
}

/* ============================================================
   Phone header: keep hamburger fully visible
   Logo + DE/FR/EN + ☰ must all fit without clipping.
   ============================================================ */
@media (max-width: 991px) {

  header.navbar-fixed-top,
  header.navbar-fixed-top > .container {
    overflow: visible !important;
  }

  header.navbar-fixed-top > .container {
    position: relative !important;
    padding-left: 10px !important;
    padding-right: 10px !important;
  }

  header.navbar-fixed-top .navbar-header {
    position: relative !important;
    width: 100% !important;
    min-height: 56px !important;
    height: 56px !important;
    overflow: visible !important;
    float: none !important;
    margin: 0 !important;
    /* room for language buttons + hamburger on the right */
    padding-right: 120px !important;
  }

  header.navbar-fixed-top .navbar-brand {
    float: left !important;
    max-width: calc(100% - 130px) !important;
    overflow: hidden !important;
  }

  header.navbar-fixed-top .navbar-brand img {
    max-height: 36px !important;
    width: auto !important;
  }

  /* Hamburger: pinned to the far right, never clipped */
  header.navbar-fixed-top .navbar-toggle {
    position: absolute !important;
    top: 8px !important;
    right: 4px !important;
    z-index: 1050 !important;
    float: none !important;
    margin: 0 !important;
    display: block !important;
    padding: 8px 10px !important;
    background-color: transparent !important;
    border: 1px solid rgba(255,255,255,0.35) !important;
    border-radius: 4px !important;
  }

  header.navbar-fixed-top .navbar-toggle .icon-bar {
    background-color: #fff !important;
  }

  /* Language buttons: left of hamburger, not overlapping it */
  header.navbar-fixed-top .oz-lang-mobile-visible {
    position: absolute !important;
    top: 12px !important;
    right: 52px !important;
    left: auto !important;
    z-index: 1045 !important;
  }

  header.navbar-fixed-top .oz-lang-mobile-visible .oz-language-switcher a {
    padding: 4px 6px !important;
    font-size: 10px !important;
  }
}

/* ============================================================
   Phone body text: full width, left-aligned, no stray floats
   ============================================================ */
@media (max-width: 767px) {

  body,
  main,
  section,
  section.container,
  .container,
  .row {
    max-width: 100% !important;
  }

  .row:before,
  .row:after {
    content: " " !important;
    display: table !important;
  }
  .row:after {
    clear: both !important;
  }

  /* Any leftover half-width columns in body content */
  section .col-md-7,
  section .col-md-6,
  section .col-md-5,
  section .col-md-9,
  section .col-md-8,
  section .col-md-12,
  #emission .col-md-7,
  #emission .col-xs-12 {
    width: 100% !important;
    float: none !important;
    margin: 0 0 16px 0 !important;
    left: auto !important;
    right: auto !important;
  }

  section p,
  section .justify,
  .justify {
    text-align: left !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  section img,
  section .img-responsive {
    max-width: 100% !important;
    height: auto !important;
    display: block !important;
  }
}


/* === FINAL LOCK: no layout jump EN <-> DE/FR === */
/* One fixed header height + one switcher slot for every language. */

/* Kill Google Translate chrome that shifts the page */
html, body {
  top: 0 !important;
  position: static !important;
}
body {
  top: 0 !important;
}
body.oz-translated {
  top: 0 !important;
  position: static !important;
}
.goog-te-banner-frame,
.goog-te-banner-frame.skiptranslate,
iframe.goog-te-banner-frame,
body > .skiptranslate,
.goog-te-spinner-pos,
#goog-gt-tt,
.goog-te-balloon-frame,
.goog-te-menu-frame {
  display: none !important;
  visibility: hidden !important;
  height: 0 !important;
  max-height: 0 !important;
  overflow: hidden !important;
  border: none !important;
}
.skiptranslate,
body > .skiptranslate {
  display: none !important;
  height: 0 !important;
}

/* ----- Desktop: fixed 74px header, switcher pinned top-right ----- */
@media (min-width: 768px) {
  body,
  body.oz-translated {
    padding-top: 74px !important;
    top: 0 !important;
  }

  header.navbar-fixed-top,
  header.navbar.navbar-inverse.navbar-fixed-top.karl-midnight-blue,
  body.oz-translated header.navbar-fixed-top,
  body.oz-translated header.navbar.navbar-inverse.navbar-fixed-top.karl-midnight-blue {
    height: 74px !important;
    min-height: 74px !important;
    max-height: 74px !important;
    overflow: visible !important;
    padding-bottom: 0 !important;
  }

  header.navbar-fixed-top .container,
  body.oz-translated header.navbar-fixed-top .container {
    position: relative !important;
    height: 74px !important;
    min-height: 74px !important;
  }

  header.navbar-fixed-top .navbar-header,
  header.navbar-fixed-top .navbar-brand,
  body.oz-translated header.navbar-fixed-top .navbar-header,
  body.oz-translated header.navbar-fixed-top .navbar-brand {
    height: 74px !important;
    min-height: 74px !important;
    max-height: 74px !important;
  }

  header.navbar-fixed-top .navbar-collapse > .navbar-nav.navbar-right,
  body.oz-translated header.navbar-fixed-top .navbar-collapse > .navbar-nav.navbar-right {
    position: relative !important;
    height: 74px !important;
    min-height: 74px !important;
    max-height: 74px !important;
    padding-right: 110px !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    margin: 0 !important;
    align-items: center !important;
  }

  /* Nav links: same vertical padding EN and translated (prevents height change when labels lengthen) */
  header.navbar-fixed-top .navbar-collapse > .navbar-nav.navbar-right > li:not(.oz-language-item) > a,
  body.oz-translated header.navbar-fixed-top .navbar-collapse > .navbar-nav.navbar-right > li:not(.oz-language-item) > a,
  body.oz-translated header.navbar-fixed-top .navbar-collapse > .navbar-nav.navbar-right > li:not(.oz-language-item) > a font {
    padding-top: 27px !important;
    padding-bottom: 27px !important;
    line-height: 20px !important;
    height: auto !important;
    min-height: 0 !important;
    white-space: nowrap !important;
    font-size: 13px !important;
  }

  /* Language switcher: identical coordinates for EN and DE/FR */
  header.navbar-fixed-top .navbar-collapse > .navbar-nav.navbar-right > li.oz-language-item,
  header.navbar-fixed-top .navbar-collapse > .navbar-nav.navbar-right > li.oz-language-item.oz-lang-desktop-visible,
  body.oz-translated header.navbar-fixed-top .navbar-collapse > .navbar-nav.navbar-right > li.oz-language-item,
  body.oz-translated header.navbar-fixed-top .navbar-collapse > .navbar-nav.navbar-right > li.oz-language-item.oz-lang-desktop-visible {
    position: absolute !important;
    top: 22px !important;
    right: 0 !important;
    bottom: auto !important;
    left: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    float: none !important;
    height: 30px !important;
    min-height: 30px !important;
    max-height: 30px !important;
    line-height: 30px !important;
    width: auto !important;
    display: block !important;
    z-index: 70 !important;
    background: transparent !important;
  }

  header.navbar-fixed-top .navbar-collapse > .navbar-nav.navbar-right > li.oz-language-item .oz-language-switcher,
  body.oz-translated header.navbar-fixed-top .navbar-collapse > .navbar-nav.navbar-right > li.oz-language-item .oz-language-switcher {
    display: flex !important;
    align-items: center !important;
    height: 30px !important;
    background: transparent !important;
  }
}

/* ----- Mobile: fixed 58px header ----- */
@media (max-width: 767px) {
  body,
  body.oz-translated {
    padding-top: 58px !important;
    top: 0 !important;
  }

  header.navbar-fixed-top,
  body.oz-translated header.navbar-fixed-top {
    height: 56px !important;
    min-height: 56px !important;
    max-height: 56px !important;
  }

  header.navbar-fixed-top .oz-lang-mobile-visible,
  body.oz-translated header.navbar-fixed-top .oz-lang-mobile-visible {
    position: absolute !important;
    top: 12px !important;
    right: 58px !important;
    left: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    z-index: 1040 !important;
    display: block !important;
  }
}


/* === FINAL LOCK: identical nav text size EN and DE/FR === */
/* English must use the same size as translated (Google wraps DE/FR in <font>). */
@media (min-width: 768px) {
  header.navbar-fixed-top .navbar-nav > li > a,
  header.navbar-fixed-top .navbar-nav > li > a:link,
  header.navbar-fixed-top .navbar-nav > li > a:visited,
  header.navbar-fixed-top .navbar-collapse > .navbar-nav.navbar-right > li > a,
  header.navbar-fixed-top .navbar-collapse > .navbar-nav.navbar-right > li:not(.oz-language-item) > a,
  body.oz-translated header.navbar-fixed-top .navbar-nav > li > a,
  body.oz-translated header.navbar-fixed-top .navbar-nav > li > a font,
  body.oz-translated header.navbar-fixed-top .navbar-nav > li.active > a,
  body.oz-translated header.navbar-fixed-top .navbar-nav > li.active > a font,
  body.oz-translated header.navbar-fixed-top .navbar-collapse > .navbar-nav.navbar-right > li:not(.oz-language-item) > a,
  body.oz-translated header.navbar-fixed-top .navbar-collapse > .navbar-nav.navbar-right > li:not(.oz-language-item) > a font,
  body.oz-translated header.navbar-fixed-top .navbar-collapse > .navbar-nav.navbar-right > li > a font {
    font-size: 12px !important;
    font-weight: 500 !important;
    line-height: 1.2 !important;
    letter-spacing: 0 !important;
    font-family: Inter, system-ui, -apple-system, "Segoe UI", sans-serif !important;
    white-space: nowrap !important;
    vertical-align: baseline !important;
  }

  /* Same vertical box for every language so the switcher does not jump */
  header.navbar-fixed-top .navbar-collapse > .navbar-nav.navbar-right > li:not(.oz-language-item) > a,
  body.oz-translated header.navbar-fixed-top .navbar-collapse > .navbar-nav.navbar-right > li:not(.oz-language-item) > a {
    padding-top: 26px !important;
    padding-bottom: 26px !important;
    padding-left: 8px !important;
    padding-right: 8px !important;
    height: 74px !important;
    max-height: 74px !important;
    box-sizing: border-box !important;
    display: table-cell !important;
    vertical-align: middle !important;
    float: none !important;
  }

  /* Dropdown parent "Motivations" same treatment */
  header.navbar-fixed-top .navbar-collapse > .navbar-nav.navbar-right > li.dropdown > a,
  body.oz-translated header.navbar-fixed-top .navbar-collapse > .navbar-nav.navbar-right > li.dropdown > a,
  body.oz-translated header.navbar-fixed-top .navbar-collapse > .navbar-nav.navbar-right > li.dropdown > a font {
    font-size: 11px !important;
    height: 74px !important;
    max-height: 74px !important;
    padding-top: 26px !important;
    padding-bottom: 26px !important;
    box-sizing: border-box !important;
  }
}

/* === FINAL: more room for DE/FR nav labels — never under the logo === */
@media (min-width: 768px) {
  header.navbar-fixed-top > .container {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 6px !important;
  }
  /* Logo: compact so French labels never sit under it */
  header.navbar-fixed-top .navbar-header {
    flex: 0 0 112px !important;
    width: 112px !important;
    max-width: 112px !important;
    margin: 0 10px 0 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    float: none !important;
  }
  header.navbar-fixed-top .navbar-brand {
    max-width: 112px !important;
    width: 112px !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin: 0 !important;
    overflow: hidden !important;
  }
  header.navbar-fixed-top .navbar-brand img {
    max-height: 36px !important;
    max-width: 108px !important;
    width: auto !important;
    height: auto !important;
    display: block !important;
  }
  /* Nav takes all remaining space, clear of the logo */
  header.navbar-fixed-top .navbar-collapse {
    flex: 1 1 auto !important;
    min-width: 0 !important;
    margin-left: 0 !important;
    padding-left: 0 !important;
    float: none !important;
  }
  header.navbar-fixed-top .navbar-nav.navbar-right {
    float: right !important;
    margin-left: 0 !important;
  }
  header.navbar-fixed-top .navbar-nav > li > a,
  header.navbar-fixed-top .navbar-nav > li > a font,
  header.navbar-fixed-top .navbar-nav > li > a *,
  body.oz-translated header.navbar-fixed-top .navbar-nav > li > a,
  body.oz-translated header.navbar-fixed-top .navbar-nav > li > a font,
  body.oz-translated header.navbar-fixed-top .navbar-nav > li > a * {
    font-size: 10px !important;
  }
  header.navbar-fixed-top .navbar-collapse > .navbar-nav.navbar-right > li:not(.oz-language-item) > a,
  body.oz-translated header.navbar-fixed-top .navbar-collapse > .navbar-nav.navbar-right > li:not(.oz-language-item) > a {
    padding-left: 4px !important;
    padding-right: 4px !important;
    font-size: 10px !important;
  }



  /* Language switcher stays put */
  header.navbar-fixed-top .navbar-collapse > .navbar-nav.navbar-right > li.oz-language-item,
  body.oz-translated header.navbar-fixed-top .navbar-collapse > .navbar-nav.navbar-right > li.oz-language-item {
    position: absolute !important;
    top: 22px !important;
    right: 0 !important;
    bottom: auto !important;
    height: 30px !important;
  }
}

/* Google Translate font tags must not enlarge anything in the header */
header.navbar-fixed-top font {
  font-size: inherit !important;
  vertical-align: inherit !important;
}

/* === Logo fixed left; nav always starts AFTER it (fixes FR overlap) === */
@media (min-width: 768px) {
  header.navbar.navbar-inverse.navbar-fixed-top.karl-midnight-blue > .container {
    position: relative !important;
    width: 100% !important;
    max-width: 1400px !important;
    padding-left: 8px !important;
    padding-right: 8px !important;
  }

  /* Pin logo to the left edge — out of the nav flow */
  header.navbar.navbar-inverse.navbar-fixed-top.karl-midnight-blue .navbar-header {
    position: absolute !important;
    left: 8px !important;
    top: 0 !important;
    width: 100px !important;
    max-width: 100px !important;
    height: 74px !important;
    margin: 0 !important;
    padding: 0 !important;
    float: none !important;
    overflow: hidden !important;
    z-index: 2 !important;
  }
  header.navbar.navbar-inverse.navbar-fixed-top.karl-midnight-blue .navbar-brand {
    width: 100px !important;
    max-width: 100px !important;
    margin: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    float: none !important;
  }
  header.navbar.navbar-inverse.navbar-fixed-top.karl-midnight-blue .navbar-brand img {
    max-width: 96px !important;
    max-height: 34px !important;
    width: auto !important;
    height: auto !important;
  }

  /* Nav starts to the right of the logo — cannot go underneath */
  header.navbar.navbar-inverse.navbar-fixed-top.karl-midnight-blue .navbar-collapse {
    margin-left: 112px !important;
    padding-left: 0 !important;
    float: none !important;
    width: auto !important;
    display: block !important;
  }
  header.navbar.navbar-inverse.navbar-fixed-top.karl-midnight-blue .navbar-nav.navbar-right {
    float: right !important;
    margin: 0 !important;
  }
  header.navbar.navbar-inverse.navbar-fixed-top.karl-midnight-blue .navbar-nav > li > a,
  header.navbar.navbar-inverse.navbar-fixed-top.karl-midnight-blue .navbar-nav > li > a font,
  header.navbar.navbar-inverse.navbar-fixed-top.karl-midnight-blue .navbar-nav > li > a *,
  body.oz-translated header.navbar.navbar-inverse.navbar-fixed-top.karl-midnight-blue .navbar-nav > li > a,
  body.oz-translated header.navbar.navbar-inverse.navbar-fixed-top.karl-midnight-blue .navbar-nav > li > a font,
  body.oz-translated header.navbar.navbar-inverse.navbar-fixed-top.karl-midnight-blue .navbar-nav > li > a * {
    font-size: 10px !important;
  }
  header.navbar.navbar-inverse.navbar-fixed-top.karl-midnight-blue .navbar-nav.navbar-right > li:not(.oz-language-item) > a {
    padding-left: 4px !important;
    padding-right: 4px !important;
  }
}





/* === FINAL: no blue drop under language switcher === */
header.navbar-fixed-top .navbar-nav.navbar-right > li.oz-language-item,
header.navbar-fixed-top .navbar-nav.navbar-right > li.oz-language-item.oz-lang-desktop-visible,
body.oz-translated header.navbar-fixed-top .navbar-nav.navbar-right > li.oz-language-item,
body.oz-translated header.navbar-fixed-top .navbar-nav.navbar-right > li.oz-language-item.oz-lang-desktop-visible {
  background: transparent !important;
  background-color: transparent !important;
  box-shadow: none !important;
  max-height: 74px !important;
  height: 74px !important;
  overflow: hidden !important;
  top: 0 !important;
  bottom: auto !important;
}
header.navbar-fixed-top .navbar-nav.navbar-right > li.oz-language-item .oz-language-switcher,
body.oz-translated header.navbar-fixed-top .navbar-nav.navbar-right > li.oz-language-item .oz-language-switcher {
  background: transparent !important;
  background-color: transparent !important;
  box-shadow: none !important;
}
/* Do not paint blue behind the switcher slot */
body.oz-translated header.navbar-fixed-top .navbar-collapse > .navbar-nav.navbar-right > li.oz-language-item {
  background-color: transparent !important;
  background: transparent !important;
}

/* === Mobile: menu toggle + language switcher side by side without overlap === */
@media (max-width: 767px) {
  header.navbar-fixed-top {
    min-height: 56px !important;
  }
  header.navbar-fixed-top .navbar-header {
    position: relative !important;
    min-height: 56px !important;
    padding-right: 0 !important;
  }

  /* Hamburger: fixed on the far right with clear hit area */
  header.navbar-fixed-top .navbar-toggle {
    position: absolute !important;
    top: 8px !important;
    right: 8px !important;
    margin: 0 !important;
    z-index: 1060 !important;
    float: none !important;
    display: block !important;
  }

  /* Language switcher: left of hamburger, with a clear gap */
  header.navbar-fixed-top .oz-lang-mobile-visible,
  body.oz-translated header.navbar-fixed-top .oz-lang-mobile-visible {
    position: absolute !important;
    top: 10px !important;
    right: 62px !important; /* was 58; leave room for 44px toggle + gap */
    left: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    z-index: 1050 !important;
    display: flex !important;
    align-items: center !important;
    max-width: calc(100% - 120px) !important; /* never collide with logo or toggle */
  }

  header.navbar-fixed-top .oz-lang-mobile-visible .oz-language-switcher {
    display: flex !important;
    align-items: center !important;
    gap: 3px !important;
    padding: 0 !important;
    margin: 0 !important;
    flex-wrap: nowrap !important;
  }

  header.navbar-fixed-top .oz-lang-mobile-visible .oz-language-switcher a {
    padding: 4px 5px !important;
    font-size: 10px !important;
    line-height: 1 !important;
    min-width: 0 !important;
  }

  /* Logo stays left and does not run under the switches */
  header.navbar-fixed-top .navbar-brand {
    max-width: calc(100% - 160px) !important;
    overflow: hidden !important;
  }
}