/* ==========================================================================
   OTTO · Site Header — base (couleurs/tailles pilotees par l'onglet STYLE)
   ========================================================================== */

@font-face{font-family:"Suisse Intl";src:url("https://www.ottorl.ai/hubfs/suisseintl--regular.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Suisse Intl";src:url("https://www.ottorl.ai/hubfs/suisseintl--medium.woff2") format("woff2");font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:"Suisse Intl";src:url("https://www.ottorl.ai/hubfs/suisseintl--semibold.woff2") format("woff2");font-weight:600;font-style:normal;font-display:swap}

.otto-header{position:relative;
  --otto-font:"Suisse Intl",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  --otto-border:rgba(0,0,0,0.08);
  width:100%; z-index:1000; font-family:var(--otto-font);
  -webkit-font-smoothing:antialiased;
  box-shadow:0 1px 0 rgba(0,0,0,0.04), 0 8px 30px rgba(0,0,0,0.03);
  transition:box-shadow .2s ease;
}
.otto-header.is-sticky{position:sticky;top:0;}
.otto-header *{box-sizing:border-box;}

.otto-header__inner{
  max-width:1200px; margin:0 auto;
  display:flex; align-items:center; gap:28px;
  padding-left:24px; padding-right:24px;
}

/* Logo */
.otto-header__logo{flex:0 0 auto;display:flex;align-items:center;text-decoration:none;}
.otto-header__logo img{height:40px;width:auto;max-width:100%;display:block;object-fit:contain;}

/* Menu */
.otto-header__nav{flex:1 1 auto;display:flex;align-items:center;}
.otto-header__nav .hs-menu-wrapper,
.otto-header__nav .hs-menu-wrapper > ul{display:flex;align-items:center;gap:28px;margin:0;padding:0;list-style:none;}
.otto-header__nav ul li{position:relative;list-style:none;}
.otto-header__nav a{text-decoration:none;font-size:15px;font-weight:500;letter-spacing:-0.01em;padding:6px 0;display:inline-block;position:relative;transition:color .15s ease;}
.otto-header__nav > .hs-menu-wrapper > ul > li > a::after{content:"";position:absolute;left:0;bottom:-2px;height:2px;width:0;transition:width .2s ease;}
.otto-header__nav > .hs-menu-wrapper > ul > li > a:hover::after{width:100%;}
.otto-header__nav .hs-menu-children-wrapper{position:absolute;top:100%;left:0;min-width:220px;background:#fff;border:1px solid var(--otto-border);border-radius:12px;box-shadow:0 20px 50px rgba(0,0,0,0.10);padding:10px;margin-top:0;display:none;flex-direction:column;gap:2px;z-index:10;}
.otto-header__nav li:hover > .hs-menu-children-wrapper{display:flex;}
.otto-header__nav .hs-menu-children-wrapper a{padding:8px 12px;border-radius:8px;font-size:14px;}
.otto-header__nav .hs-menu-children-wrapper a:hover{background:rgba(59,130,246,0.06);}

/* Cluster droit */
.otto-header__right{flex:0 0 auto;display:flex;align-items:center;gap:18px;margin-left:auto;}

/* Switcher (pill reconstruite par module.js, scalable) */
.otto-lang{display:inline-flex;align-items:center;}
.otto-lang__pill{display:inline-flex;align-items:center;gap:3px;padding:4px;border:1px solid var(--otto-border);border-radius:999px;background:#fff;}
.otto-lang__item{display:inline-block;font-family:var(--otto-font);font-size:13px;font-weight:600;line-height:1;text-decoration:none;color:#555;padding:6px 12px;border-radius:999px;white-space:nowrap;transition:color .15s ease,background .15s ease;}
.otto-lang__item:hover{color:#0A0A0A;}
.otto-lang__item.is-active{color:#fff;background:linear-gradient(135deg,#6EE7B7 0%,#3B82F6 100%);}

/* CTA */
.otto-cta{display:inline-flex;align-items:center;gap:8px;font-size:15px;text-decoration:none;padding:11px 22px;white-space:nowrap;box-shadow:0 8px 24px rgba(59,130,246,0.18);transition:transform .15s ease,box-shadow .15s ease;}
.otto-cta:hover{transform:translateY(-1px);box-shadow:0 12px 32px rgba(59,130,246,0.28);}

/* Burger mobile */
.otto-header__burger{display:none;flex-direction:column;gap:5px;background:none;border:0;cursor:pointer;padding:8px;}
.otto-header__burger span{display:block;width:22px;height:2px;background:#0A0A0A;transition:transform .2s ease,opacity .2s ease;}
.otto-header__burger[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg);}
.otto-header__burger[aria-expanded="true"] span:nth-child(2){opacity:0;}
.otto-header__burger[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}

@media (max-width:900px){
  .otto-header__inner{padding-left:15px;padding-right:15px;gap:14px;}
  .otto-header__burger{display:flex;}
  .otto-header__nav{position:absolute;top:100%;left:0;right:0;background:#fff;border-top:1px solid var(--otto-border);box-shadow:0 20px 40px rgba(0,0,0,0.08);padding:16px 20px;display:none;z-index:20;}
  .otto-header__nav.is-open{display:block;}
  .otto-header__nav .hs-menu-wrapper > ul{flex-direction:column;align-items:flex-start;gap:8px;width:100%;}
}

/* ============================================================
   RESPONSIVE — anti-debordement mobile (ajout pur, stress-teste)
   Ne modifie rien du desktop : uniquement des regles @media + filets
   ============================================================ */
.otto-header{position:relative;}
.otto-header__inner{min-width:0;}
.otto-header__right{min-width:0;}
.otto-cta{flex-shrink:1;min-width:0;}

@media (max-width:560px){
  .otto-header__inner{gap:10px;padding-left:15px;padding-right:15px;}
  .otto-header__logo img{height:40px;width:auto;max-width:100%;display:block;object-fit:contain;}
  .otto-cta{padding:9px 14px;font-size:13px;}
  .otto-lang__item{padding:5px 9px;font-size:12px;}
}

@media (max-width:400px){
  .otto-header__inner{gap:6px;padding-left:15px;padding-right:15px;}
  .otto-header__logo img{height:40px;width:auto;max-width:100%;display:block;object-fit:contain;}
  .otto-header__right{gap:6px;}
  .otto-cta{padding:7px 10px;font-size:11px;max-width:100px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
  .otto-lang__item{padding:4px 7px;font-size:11px;}
  .otto-lang__pill{padding:2px;gap:2px;}
  .otto-header__burger{padding:6px;}
}

@media (max-width:340px){
  .otto-cta{max-width:80px;padding:6px 9px;}
  .otto-header__logo img{height:40px;width:auto;max-width:100%;display:block;object-fit:contain;}
  .otto-header__inner{gap:5px;}
}

/* logo : ratio toujours preserve */

@media (max-width:560px){ .otto-header__logo img{height:32px;} }
@media (max-width:400px){ .otto-header__logo img{height:28px;} }
/* pont anti-trou flyout : maintient le hover entre l'entree et le sous-menu */
.otto-header__nav li.hs-item-has-children{position:relative;}
.otto-header__nav li.hs-item-has-children > a::before{content:'';position:absolute;left:0;right:0;top:100%;height:14px;}
.otto-header__nav .hs-menu-children-wrapper{padding-top:14px;}
/* garder ouvert tant qu'on survole le li OU le sous-menu */
.otto-header__nav li:hover > .hs-menu-children-wrapper,
.otto-header__nav .hs-menu-children-wrapper:hover{display:flex;}
/* menu mobile : positionnement correct sous le header */
@media (max-width:900px){
  .otto-header__nav{position:absolute;top:100%;left:0;right:0;width:100%;background:#fff;border-top:1px solid rgba(0,0,0,0.08);box-shadow:0 20px 40px rgba(0,0,0,0.10);padding:16px 20px;display:none;z-index:1000;max-height:80vh;overflow-y:auto;}
  .otto-header__nav.is-open{display:block;}
  .otto-header__nav .hs-menu-wrapper,
  .otto-header__nav .hs-menu-wrapper > ul{flex-direction:column;align-items:flex-start;gap:4px;width:100%;}
  .otto-header__nav .hs-menu-wrapper > ul > li{width:100%;}
  .otto-header__nav a{display:block;width:100%;padding:10px 0;font-size:16px;}
  /* sous-menus : en flux normal sur mobile, pas en flyout */
  .otto-header__nav .hs-menu-children-wrapper{position:static;display:block;box-shadow:none;border:0;padding:0 0 0 16px;margin:0;min-width:0;}
}
/* mobile : liberer la place pour le burger (logo + switcher + burger seulement) */
@media (max-width:900px){
  .otto-header__burger{display:flex !important;flex:0 0 auto;order:3;z-index:1001;}
  .otto-header__right{flex:0 1 auto;min-width:0;gap:8px;}
  .otto-cta{display:none !important;}          /* CTA cache de la barre sur mobile */
  .otto-lang{flex:0 0 auto;}
}
/* menu mobile : jamais tronque */
@media (max-width:900px){
  .otto-header{overflow:visible !important;}
  .otto-header__inner{overflow:visible !important;}
  .otto-header__nav.is-open{display:block !important;max-height:none !important;height:auto !important;overflow:visible !important;}
}
/* ============================================================
   MEGA MENU (v3 epure + visuels, valide 21/08/2026)
   Actif seulement quand .otto-header.has-mega (settings.enable_mega).
   Ajout pur : ne touche a rien de la nav classique.
   ============================================================ */
.otto-header.has-mega{
  --omg-text:#0A0A0A;
  --omg-muted:#4A4A4A;
  --omg-dim:#8A8A8A;
  --omg-border:rgba(0,0,0,.08);
  --omg-border-strong:rgba(0,0,0,.14);
  --omg-bg:#FFFFFF;
  --omg-surface:#F7F7F5;
  --omg-grad:linear-gradient(135deg,#6EE7B7 0%,#3B82F6 100%);
  --omg-tint:linear-gradient(135deg,rgba(110,231,183,.14) 0%,rgba(59,130,246,.14) 100%);
  --omg-tint-hover:linear-gradient(135deg,rgba(110,231,183,.3) 0%,rgba(59,130,246,.3) 100%);
  --omg-blue:#3B82F6;
  --omg-ease:cubic-bezier(.25,.46,.45,.94);
}

/* --- Items de nav --- */
.otto-meganav{display:flex;align-items:center;gap:30px;flex:1 1 auto;}
.otto-nav__item{position:relative;}
.otto-nav__item--mega{position:static;}
.otto-meganav .otto-nav__link{
  position:relative;display:inline-flex;align-items:center;gap:5px;
  font-family:var(--otto-font);font-size:15px;font-weight:400;letter-spacing:-.005em;
  color:var(--omg-text);text-decoration:none;background:none;border:0;padding:6px 0;cursor:pointer;
  transition:color .18s var(--omg-ease);
}
.otto-meganav .otto-nav__link::after{
  content:"";position:absolute;left:0;right:0;bottom:-2px;height:2px;border-radius:2px;
  background:var(--omg-grad);
  transform:scaleX(0);transform-origin:left center;
  transition:transform .22s var(--omg-ease);
}
.otto-nav__item.is-open > .otto-nav__link::after,
.otto-meganav .otto-nav__link:hover::after,
.otto-meganav .otto-nav__link:focus-visible::after{transform:scaleX(1);}
.otto-meganav .otto-nav__link:focus-visible{outline:2px solid var(--omg-blue);outline-offset:4px;border-radius:3px;}
.otto-nav__chev{
  width:9px;height:9px;border-right:1.6px solid currentColor;border-bottom:1.6px solid currentColor;
  transform:translateY(-2px) rotate(45deg);opacity:.55;
  transition:transform .22s var(--omg-ease),opacity .22s var(--omg-ease);
}
.otto-nav__item.is-open .otto-nav__chev{transform:translateY(1px) rotate(-135deg);opacity:1;}
/* Zone tampon : la souris peut traverser le gap libelle -> panneau */
.otto-nav__item[data-nav] > .otto-nav__link::before{content:"";position:absolute;left:-15px;right:-15px;top:100%;height:24px;}

/* --- Panneau mega (full width, ancre sur le header) --- */
.otto-mega{
  position:absolute;left:0;right:0;top:100%;
  background:var(--omg-bg);
  box-shadow:0 40px 80px -30px rgba(0,0,0,.14);
  overflow:hidden;
  opacity:0;visibility:hidden;pointer-events:none;
  transform:translateY(-6px);
  transition:opacity .22s var(--omg-ease),transform .28s var(--omg-ease),visibility .28s;
  z-index:900;
}
.otto-mega::before{
  content:"";position:absolute;top:0;left:0;right:0;height:1px;
  background:var(--omg-grad);opacity:.85;
}
.otto-nav__item.is-open .otto-mega{opacity:1;visibility:visible;pointer-events:auto;transform:translateY(0);}
.otto-mega__inner{
  max-width:1200px;margin:0 auto;
  display:grid;grid-template-columns:1fr 1fr 1fr 320px;gap:0;
}
.otto-mega__col{padding:46px 40px 50px 0;}
.otto-mega__col:first-child{padding-left:24px;}
.otto-mega__col + .otto-mega__col{padding-left:40px;border-left:1px solid var(--omg-border);}
.otto-mega__col--wide{grid-column:1 / 3;}

.otto-col__title{
  margin:0 0 20px;font-size:10.5px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;
  color:var(--omg-dim);
}
.otto-col__title--spaced{margin-top:26px;}

/* --- Lien mega : typo pure + icone nue --- */
.otto-header__nav a.otto-mlink{
  position:relative;display:flex;gap:13px;align-items:flex-start;
  padding:10px 0;text-decoration:none;font-weight:400;font-size:inherit;
}
.otto-header__nav a.otto-mlink:focus-visible{outline:2px solid var(--omg-blue);outline-offset:3px;border-radius:4px;}
.otto-mlink__ico{
  flex:0 0 auto;width:19px;height:19px;margin-top:1px;
  display:flex;align-items:center;justify-content:center;
  color:var(--omg-dim);
  transition:color .18s var(--omg-ease);
}
.otto-header__nav a.otto-mlink:hover .otto-mlink__ico{color:var(--omg-blue);}
.otto-mlink__ico svg{width:17px;height:17px;stroke:currentColor;fill:none;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;}
.otto-mlink__body{display:block;min-width:0;}
.otto-mlink__label{
  display:inline-flex;align-items:center;gap:8px;
  font-size:15px;font-weight:500;color:var(--omg-text);letter-spacing:-.012em;line-height:1.3;
}
.otto-mlink__label::after{
  content:"\2192";font-weight:400;font-size:13px;color:var(--omg-blue);
  opacity:0;transform:translateX(-5px);
  transition:opacity .18s var(--omg-ease),transform .22s var(--omg-ease);
}
.otto-header__nav a.otto-mlink:hover .otto-mlink__label::after,
.otto-header__nav a.otto-mlink:focus-visible .otto-mlink__label::after{opacity:1;transform:translateX(0);}
.otto-mlink__desc{
  display:block;margin:3px 0 0;font-size:12.5px;line-height:1.5;color:var(--omg-dim);letter-spacing:-.003em;
  max-width:30ch;
}
.otto-header__nav a.otto-mlink:hover .otto-mlink__desc{color:var(--omg-muted);}
.otto-header__nav a.otto-mlink--plain{padding:7px 0;}
.otto-mlink--plain .otto-mlink__label{font-size:14px;font-weight:400;color:var(--omg-muted);}
.otto-header__nav a.otto-mlink--plain:hover .otto-mlink__label{color:var(--omg-text);}
.otto-mega__more{margin-top:12px;}

/* --- Badges --- */
.otto-mbadge{
  font-size:9.5px;font-weight:600;letter-spacing:.07em;text-transform:uppercase;
  padding:2.5px 7px;border-radius:999px;line-height:1;white-space:nowrap;
  background:none;border:1px solid #6EE7B7;color:var(--omg-blue);
}

/* --- Colonne vedette --- */
.otto-mega__feat{position:relative;padding:46px 24px 50px 40px;}
.otto-mega__feat::before{
  content:"";position:absolute;z-index:-1;top:0;bottom:0;left:0;right:-100vw;
  background:var(--omg-surface);border-left:1px solid var(--omg-border);
}
.otto-feat__head{display:flex;align-items:baseline;justify-content:space-between;gap:10px;}
.otto-feat__head .otto-col__title{margin-bottom:20px;}
.otto-header__nav a.otto-feat__all{
  font-size:12px;font-weight:500;color:var(--omg-blue);text-decoration:none;white-space:nowrap;padding:0;
}
.otto-header__nav a.otto-feat__all:hover{text-decoration:underline;color:var(--omg-blue);}

/* --- Carte vedette : teinte gradient + arc --- */
.otto-header__nav a.otto-mcard{display:block;text-decoration:none;padding:0;}
.otto-mcard__visual{
  display:flex;align-items:flex-end;height:112px;border-radius:12px;overflow:hidden;
  background:var(--omg-tint);border:1px solid var(--omg-border);
  position:relative;padding:12px;
  transition:background .3s var(--omg-ease);
}
.otto-mcard__visual::after{
  content:"";position:absolute;right:-34px;top:-34px;width:120px;height:120px;border-radius:50%;
  border:2.5px solid transparent;
  background:linear-gradient(var(--omg-bg),var(--omg-bg)) padding-box,var(--omg-grad) border-box;
  opacity:.9;
}
.otto-header__nav a.otto-mcard:hover .otto-mcard__visual{border-color:var(--omg-border-strong);}

.otto-mcard__tag{
  position:relative;z-index:2;font-size:9.5px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;
  color:var(--omg-text);border:1px solid var(--omg-border-strong);
  padding:4px 10px;border-radius:999px;background:var(--omg-bg);
}
.otto-mcard__body{display:block;padding:15px 0 0;}
.otto-mcard__title{display:block;margin:0;font-size:17.5px;font-weight:600;line-height:1.25;color:var(--omg-text);letter-spacing:-.022em;}
.otto-mcard__meta{display:block;margin:7px 0 0;font-size:12.5px;line-height:1.55;color:var(--omg-muted);}
.otto-mcard__cta{display:inline-flex;align-items:center;gap:6px;margin-top:12px;font-size:12.5px;font-weight:600;color:var(--omg-text);}
.otto-mcard__cta span{color:var(--omg-blue);transition:transform .2s var(--omg-ease);}
.otto-header__nav a.otto-mcard:hover .otto-mcard__cta span{transform:translateX(4px);}

/* --- Feed blog : vignette teintee (ou image reelle) + filets --- */
.otto-header__nav a.otto-post{display:flex;gap:13px;align-items:flex-start;padding:11px 0;text-decoration:none;border-bottom:1px solid var(--omg-border);}
.otto-header__nav a.otto-post:last-of-type{border-bottom:0;}
.otto-post__thumb{
  flex:0 0 auto;width:58px;height:44px;border-radius:9px;
  background:var(--omg-tint);border:1px solid var(--omg-border);
  position:relative;overflow:hidden;margin-top:2px;
  background-size:cover;background-position:center;
  transition:background .25s var(--omg-ease);
}
.otto-post__thumb::after{
  content:"";position:absolute;left:50%;top:50%;width:18px;height:18px;
  transform:translate(-50%,-50%);border-radius:50%;
  border:2px solid transparent;
  background:linear-gradient(var(--omg-bg),var(--omg-bg)) padding-box,var(--omg-grad) border-box;
  opacity:.9;
}
.otto-post__thumb--img::after{display:none;}
.otto-header__nav a.otto-post:hover .otto-post__thumb:not(.otto-post__thumb--img){background:var(--omg-tint-hover);}
.otto-post__body{display:block;min-width:0;}
.otto-post__meta{display:block;font-size:10px;font-weight:500;letter-spacing:.1em;text-transform:uppercase;color:var(--omg-dim);}
.otto-post__title{display:block;margin:5px 0 0;font-size:13.5px;font-weight:500;line-height:1.4;color:var(--omg-text);letter-spacing:-.01em;}
.otto-header__nav a.otto-post:hover .otto-post__title{
  background:var(--omg-grad);-webkit-background-clip:text;background-clip:text;color:transparent;
}

/* --- Feed events --- */
.otto-evgrid{display:grid;grid-template-columns:1fr 1fr;gap:4px 44px;}
.otto-header__nav a.otto-ev{display:flex;gap:14px;align-items:flex-start;padding:12px 0;text-decoration:none;border-bottom:1px solid var(--omg-border);}
.otto-evgrid .otto-ev:nth-last-child(-n+2){border-bottom:0;}
.otto-ev__date{
  flex:0 0 auto;width:46px;text-align:center;padding:7px 0 8px;border-radius:10px;
  background:var(--omg-tint);color:var(--omg-text);
  transition:background .2s var(--omg-ease);
}
.otto-header__nav a.otto-ev:hover .otto-ev__date{background:var(--omg-tint-hover);}
.otto-ev__d{display:block;font-size:16px;font-weight:600;line-height:1;letter-spacing:-.01em;font-variant-numeric:tabular-nums;}
.otto-ev__m{display:block;font-size:9.5px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;margin-top:3px;color:var(--omg-dim);}
.otto-ev__body{display:block;min-width:0;}
.otto-ev__title{display:block;font-size:14px;font-weight:500;color:var(--omg-text);line-height:1.35;letter-spacing:-.01em;}
.otto-header__nav a.otto-ev:hover .otto-ev__title{
  background:var(--omg-grad);-webkit-background-clip:text;background-clip:text;color:transparent;
}
.otto-ev__where{display:block;margin:3px 0 0;font-size:12px;color:var(--omg-dim);}

/* --- Barre basse --- */
.otto-mega__foot{
  position:relative;grid-column:1 / -1;
  display:flex;align-items:center;gap:28px;flex-wrap:wrap;
  padding:15px 24px;
}
.otto-mega__foot::before{
  content:"";position:absolute;z-index:-1;top:0;bottom:0;left:-100vw;right:-100vw;
  border-top:1px solid var(--omg-border);
}
.otto-header__nav .otto-mega__foot a{font-size:12.5px;font-weight:500;color:var(--omg-muted);text-decoration:none;padding:0;}
.otto-header__nav .otto-mega__foot a:hover{color:var(--omg-text);}
.otto-header__nav .otto-mega__foot a.is-accent{margin-left:auto;color:var(--omg-blue);font-weight:600;}

/* --- Dropdown compact (Company) --- */
.otto-drop{
  position:absolute;top:calc(100% + 14px);left:-18px;min-width:198px;
  background:var(--omg-bg);border:1px solid var(--omg-border);border-radius:12px;
  box-shadow:0 30px 60px -20px rgba(0,0,0,.16);padding:9px 4px;overflow:hidden;
  opacity:0;visibility:hidden;pointer-events:none;transform:translateY(-6px);
  transition:opacity .18s var(--omg-ease),transform .2s var(--omg-ease),visibility .2s;
  z-index:900;
}
.otto-drop::before{
  content:"";position:absolute;top:0;left:0;right:0;height:1px;
  background:var(--omg-grad);opacity:.85;
}
.otto-nav__item.is-open .otto-drop{opacity:1;visibility:visible;pointer-events:auto;transform:translateY(0);}
.otto-header__nav .otto-drop a{
  display:block;padding:9px 15px;text-decoration:none;
  font-size:14px;font-weight:400;color:var(--omg-muted);letter-spacing:-.008em;
  transition:color .15s,padding-left .2s var(--omg-ease);
}
.otto-header__nav .otto-drop a:hover{color:var(--omg-text);padding-left:20px;}

/* ============================================================
   MEGA — MOBILE : les memes items deviennent des accordeons
   dans le volet .otto-header__nav.is-open existant.
   ============================================================ */
@media (max-width:900px){
  .otto-meganav{display:none;}
  .otto-meganav.is-open{display:block;}
  .otto-meganav .otto-nav__item{width:100%;border-bottom:1px solid var(--omg-border);}
  .otto-meganav .otto-nav__item:last-child{border-bottom:0;}
  .otto-meganav .otto-nav__link{
    width:100%;display:flex;justify-content:space-between;align-items:center;
    font-size:17px;font-weight:500;padding:15px 0;
  }
  .otto-meganav .otto-nav__link::after,
  .otto-nav__item[data-nav] > .otto-nav__link::before{display:none;}
  /* Panneaux : statiques, plies/deplies */
  .otto-mega,.otto-drop{
    position:static;opacity:1;visibility:visible;pointer-events:auto;transform:none;
    display:none;box-shadow:none;border:0;padding:0;min-width:0;overflow:visible;
  }
  .otto-mega::before,.otto-drop::before{display:none;}
  .otto-nav__item.is-open .otto-mega,
  .otto-nav__item.is-open .otto-drop{display:block;}
  .otto-mega__inner{display:block;max-width:none;}
  .otto-mega__col{padding:0 0 14px;border:0 !important;}
  .otto-mega__col:first-child,
  .otto-mega__col + .otto-mega__col{padding-left:0;}
  .otto-col__title{margin:10px 0 6px;}
  /* On garde l'essentiel sur mobile : liens + events. Vedette et barre basse masquees. */
  .otto-mega__feat,.otto-mega__foot{display:none;}
  .otto-header__nav a.otto-mlink{padding:8px 0;}
  .otto-mlink__desc{display:none;}
  .otto-evgrid{grid-template-columns:1fr;gap:0;}
  .otto-evgrid .otto-ev:nth-last-child(-n+2){border-bottom:1px solid var(--omg-border);}
  .otto-evgrid .otto-ev:last-child{border-bottom:0;}
  .otto-header__nav .otto-drop a{padding:8px 0;}
  .otto-header__nav .otto-drop a:hover{padding-left:6px;color:var(--omg-text);}
}

/* ============================================================
   MEGA — grilles adaptatives (colonnes vides = jamais rendues)
   --cN pour les megas generiques, --evN pour Events
   ============================================================ */
.otto-mega__inner--c1{grid-template-columns:1.15fr 400px;}
.otto-mega__inner--c2{grid-template-columns:1fr 1fr 340px;}
.otto-mega__inner--c3{grid-template-columns:1fr 1fr 1fr 320px;}
.otto-mega__inner--ev2{grid-template-columns:1.55fr 360px;}
.otto-mega__inner--ev3{grid-template-columns:1fr 1fr .9fr 320px;}
.otto-mega__inner--ev2 .otto-mega__col--wide{grid-column:auto;}

/* Carte vedette avec image reelle (posee par module.js depuis la page events) */
.otto-mcard__visual--img{background-size:cover;background-position:center;}
.otto-mcard__visual--img::after{display:none;}
.otto-mcard__visual--img .otto-mcard__tag{
  background:rgba(255,255,255,.94);color:#050505;border-color:transparent;
}

/* ============================================================
   RESOURCES — le blog en hero : article vedette + liste, colonne
   Help Center compacte, carte Support a droite
   ============================================================ */
.otto-mega__inner--res{grid-template-columns:1fr 1fr;}
.otto-blogzone{display:grid;grid-template-columns:1fr 1fr;gap:0 36px;}
.otto-header__nav a.otto-bfeat{display:block;text-decoration:none;padding:0;}
/*x*/.otto-bfeat__visual{
  display:block;height:124px;border-radius:12px;overflow:hidden;
  background:var(--omg-tint);border:1px solid var(--omg-border);
  background-size:cover;background-position:center;position:relative;
  margin-bottom:12px;
  transition:background .25s var(--omg-ease);
}
.otto-bfeat__visual:not(.otto-bfeat__visual--img)::after{
  content:"";position:absolute;right:-28px;top:-28px;width:100px;height:100px;border-radius:50%;
  border:2.5px solid transparent;
  background:linear-gradient(var(--omg-bg),var(--omg-bg)) padding-box,var(--omg-grad) border-box;
  opacity:.9;
}
.otto-header__nav a.otto-bfeat:hover .otto-bfeat__visual:not(.otto-bfeat__visual--img){background:var(--omg-tint-hover);}
.otto-bfeat__title{
  display:block;margin:5px 0 0;font-size:16px;font-weight:600;line-height:1.3;
  color:var(--omg-text);letter-spacing:-.018em;
}
.otto-header__nav a.otto-bfeat:hover .otto-bfeat__title{
  background:var(--omg-grad);-webkit-background-clip:text;background-clip:text;color:transparent;
}
/* liste des articles suivants : rangs typographiques, filets fins */
.otto-blogzone__list .otto-post{padding:12px 0;}
.otto-blogzone__list .otto-post:first-child{padding-top:2px;}
/* colonne Help Center compacte : liens sans desc, icones fines */
.otto-mega__inner--res .otto-mega__col:not(.otto-mega__col--wide) .otto-mlink{padding:8px 0;}

@media (max-width:900px){
  .otto-blogzone{display:block;}
  .otto-bfeat__visual{height:96px;}
  .otto-mega__inner--res{display:block;}
}

/* ============================================================
   PASSE VISUELLE — tuiles, vignettes, stat, previews
   ============================================================ */
/* Icone en tuile teintee (plus de presence que le trait nu) */
.otto-mlink__ico{
  width:38px;height:38px;border-radius:10px;margin-top:0;
  background:var(--omg-tint);border:1px solid var(--omg-border);
  color:var(--omg-text);
  transition:background .2s var(--omg-ease),color .2s var(--omg-ease);
}
.otto-header__nav a.otto-mlink:hover .otto-mlink__ico{
  background:var(--omg-tint-hover);color:var(--omg-blue);
}
.otto-mlink__ico svg{width:18px;height:18px;}
/* Vignette image sur un lien (champ img) */
.otto-mlink__thumb{
  flex:0 0 auto;width:58px;height:42px;border-radius:9px;
  background-size:cover;background-position:center;
  border:1px solid var(--omg-border);
}
/* Stat en grand dans une carte (ex. 81%) */
.otto-mcard__visual{flex-direction:column;align-items:flex-start;justify-content:flex-end;gap:8px;}
.otto-mcard__stat{
  position:relative;z-index:2;display:block;
  font-size:44px;font-weight:600;letter-spacing:-.04em;line-height:1;
  background:var(--omg-grad);-webkit-background-clip:text;background-clip:text;color:transparent;
}
/* Article vedette : visuel plus grand */
.otto-bfeat__visual{height:150px;}
.otto-bfeat__title{font-size:16.5px;}
/* Rang event avec vignette image (mode auto) */
.otto-ev__thumb{
  flex:0 0 auto;width:60px;height:44px;border-radius:9px;
  background-size:cover;background-position:center;
  border:1px solid var(--omg-border);
}
@media (max-width:900px){
  .otto-mlink__ico{width:32px;height:32px;}
  .otto-ev__thumb{display:none;}
}

/* Panneau a 1 colonne (Solutions) : liens en rangees-cartes pleine largeur */
.otto-mega__inner--c1 .otto-mega__col .otto-mlink{
  padding:16px 0;border-bottom:1px solid var(--omg-border);gap:16px;align-items:center;
}
.otto-mega__inner--c1 .otto-mega__col .otto-mlink:last-child{border-bottom:0;}
.otto-mega__inner--c1 .otto-mega__col .otto-mlink__ico{width:46px;height:46px;border-radius:12px;}
.otto-mega__inner--c1 .otto-mega__col .otto-mlink__ico svg{width:21px;height:21px;}
.otto-mega__inner--c1 .otto-mega__col .otto-mlink__label{font-size:16px;}
.otto-mega__inner--c1 .otto-mega__col .otto-mlink__desc{max-width:60ch;font-size:13px;}

/* ============================================================
   BLOG — carte hero (mode solo = horizontale et large)
   ============================================================ */
.otto-blogzone--solo{display:block;}
.otto-header__nav a.otto-bhero{display:block;text-decoration:none;padding:0;}
.otto-blogzone--solo .otto-bhero{display:grid;grid-template-columns:250px 1fr;gap:22px;align-items:start;}
.otto-bhero__visual{
  display:block;height:158px;border-radius:12px;overflow:hidden;position:relative;
  background:var(--omg-tint);border:1px solid var(--omg-border);
  background-size:cover;background-position:center;margin-bottom:12px;
}
.otto-blogzone--solo .otto-bhero__visual{height:168px;margin-bottom:0;}
.otto-bhero__visual:not(.otto-bhero__visual--img)::after{
  content:"";position:absolute;right:-28px;top:-28px;width:104px;height:104px;border-radius:50%;
  border:2.5px solid transparent;
  background:linear-gradient(var(--omg-bg),var(--omg-bg)) padding-box,var(--omg-grad) border-box;opacity:.9;
}
.otto-bhero__kicker{
  position:absolute;left:12px;top:12px;z-index:2;
  font-size:9.5px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;
  background:var(--omg-bg);color:var(--omg-text);
  padding:4px 10px;border-radius:999px;border:1px solid var(--omg-border);
}
.otto-bhero__body{display:block;min-width:0;}
.otto-bhero__title{
  display:block;font-size:17px;font-weight:600;line-height:1.28;
  color:var(--omg-text);letter-spacing:-.02em;
}
.otto-header__nav a.otto-bhero:hover .otto-bhero__title{
  background:var(--omg-grad);-webkit-background-clip:text;background-clip:text;color:transparent;
}
.otto-bhero__stand{
  display:block;margin:9px 0 0;font-size:13px;line-height:1.5;color:var(--omg-muted);
}
.otto-bhero__by{
  display:flex;flex-wrap:wrap;gap:10px;align-items:baseline;margin:12px 0 0;
  font-size:11.5px;color:var(--omg-dim);letter-spacing:.01em;
}
.otto-bhero__by b{font-weight:600;color:var(--omg-text);}

/* Resources : Help Center (etroit) | blog (large) | Support */



/* Resources : Help Center (large, 2 colonnes de liens) | carte blog */




/* ============================================================
   RESOURCES — option C : une carte de chaque cote, symetrie stricte
   ============================================================ */
.otto-mega__col--half{padding:46px 44px 50px 0;}
.otto-mega__inner--res .otto-mega__col--half + .otto-mega__col--half{
  padding:46px 24px 50px 44px;border-left:1px solid var(--omg-border);
}
.otto-mega__inner--res .otto-mcard__visual{height:136px;}
.otto-halflist{
  display:grid;grid-template-columns:1fr 1fr;gap:0 24px;margin-top:18px;
  padding-top:14px;border-top:1px solid var(--omg-border);
}
.otto-halflist .otto-mlink{padding:8px 0;}
.otto-halflist .otto-mlink__ico{width:32px;height:32px;border-radius:9px;}
.otto-halflist .otto-mlink__ico svg{width:16px;height:16px;}
.otto-halflist .otto-mlink__label{font-size:14px;}
@media (max-width:900px){
  .otto-mega__col--half,.otto-mega__inner--res .otto-mega__col--half + .otto-mega__col--half{
    padding:0 0 14px;border-left:0;
  }
  .otto-halflist{grid-template-columns:1fr;}
}

/* ============================================================
   RESOURCES — carte enrichie, aucun effet de zoom
   ============================================================ */
.otto-mcard__visual{transition:border-color .2s var(--omg-ease);}
.otto-mcard__byline{
  display:flex;flex-wrap:wrap;gap:12px;align-items:baseline;margin:10px 0 0;
  font-size:11.5px;color:var(--omg-dim);
}
.otto-mcard__byline b{font-weight:600;color:var(--omg-text);}
.otto-mega__inner--res .otto-mcard__visual{height:168px;}
.otto-mega__inner--res .otto-mcard__title{font-size:18px;}
.otto-mega__inner--res .otto-mcard__meta{font-size:13px;}
/* liste des articles suivants (apparait des le 2e article publie) */
.otto-blogslot__more{display:grid;gap:0;margin-top:14px;}
.otto-blogslot__more .otto-post{display:flex;gap:12px;align-items:flex-start;
  padding:11px 0;text-decoration:none;border-top:1px solid var(--omg-border);}
.otto-blogslot__more .otto-post__thumb{width:46px;height:46px;margin-top:1px;}

/* ============================================================
   CARTE BLOG — visuel CARRE a gauche, texte a droite.
   Format de reference des visuels du blog : 2400x2400 (1:1),
   verifie sur l'image type The Last Word. Cadre 1:1 = aucun crop.
   ============================================================ */
.otto-header__nav .otto-blogslot a.otto-mcard{
  display:grid;grid-template-columns:148px 1fr;gap:20px;align-items:start;
}
.otto-blogslot .otto-mcard__visual{
  height:auto;aspect-ratio:1 / 1;   /* visuels du blog : carres */
  align-items:flex-start;padding:10px;
  background-position:top center;
}
.otto-blogslot .otto-mcard__visual::after{
  right:-30px;top:-30px;width:92px;height:92px;
}
.otto-blogslot .otto-mcard__body{padding:0;}
.otto-blogslot .otto-mcard__title{font-size:16.5px;line-height:1.3;}
.otto-blogslot .otto-mcard__meta{font-size:12.5px;margin-top:8px;}

/* replis navigateurs sans aspect-ratio */
@supports not (aspect-ratio: 1 / 1){
  .otto-blogslot .otto-mcard__visual{height:148px;}
}
@media (max-width:900px){
  .otto-header__nav .otto-blogslot a.otto-mcard{grid-template-columns:104px 1fr;gap:14px;}
}

/* ============================================================
   RESOURCES — les deux colonnes partagent les memes lignes :
   titre / contenu / liste. Les filets au-dessus des listes
   tombent donc exactement au meme niveau a gauche et a droite.
   ============================================================ */
.otto-mega__inner--res{grid-template-rows:auto 1fr auto;}
.otto-mega__inner--res > .otto-mega__col--half{
  grid-row:1 / -1;
  display:grid;
  grid-template-rows:subgrid;
  align-content:start;
}
.otto-mega__inner--res > .otto-mega__col--half > .otto-halflist{margin-top:0;}
/* repli si subgrid indisponible : hauteur minimale sur la carte blog */
@supports not (grid-template-rows: subgrid){
  .otto-blogslot{min-height:268px;}
}
/* visuel du blog plus grand */
.otto-header__nav .otto-blogslot a.otto-mcard{grid-template-columns:232px 1fr;gap:26px;}
@supports not (aspect-ratio: 1 / 1){
  .otto-blogslot .otto-mcard__visual{height:232px;}
}
@media (max-width:900px){
  .otto-mega__inner--res > .otto-mega__col--half{display:block;}
  .otto-header__nav .otto-blogslot a.otto-mcard{grid-template-columns:104px 1fr;gap:14px;}
}

/* ============================================================
   STICKY — le wrapper HubSpot qui contient le header ne fait que
   la hauteur du header : position:sticky n'a donc aucune marge
   pour coller. On bascule en position:fixed (classe posee par
   module.js, qui compense la hauteur sur le parent).
   ============================================================ */
.otto-header.is-fixed{
  position:fixed;top:0;left:0;right:0;width:100%;
  z-index:1000;
}
.otto-header.is-fixed.has-mega{z-index:1000;}