/* Mobile bar (≤760px): logo · Subscribe · language · ☰ — four variants (html.mv1..mv4).
   Spacing scale: 4 / 8 / 12 / 16 px. All controls share one height (--h) so they line up. */
.m-ld{display:none}
@media (max-width:760px){
  .nv4{--h:38px}
  .nv4 .in{display:flex;align-items:center;gap:12px;padding:10px 16px}
  .nv4 .l,.nv4 .r .ld{display:none !important}
  .nv4 .brand{order:1;flex:1 1 0;min-width:0}
  .nv4 .brand img{height:36px;width:auto}
  .nv4 .r{order:2;flex:none}
  .nv4 .m-left{order:3;flex:1 1 0;display:flex;align-items:center;justify-content:flex-end;gap:4px}
  .m-ld{display:block}
  .nv4 .cta{height:var(--h);display:inline-flex;align-items:center;padding:0 14px;font-size:11px;letter-spacing:1px}
  /* burger: icon only, 38px touch target */
  .nv4 .burger{width:var(--h);height:var(--h);justify-content:center;padding:0;color:#fff}
  .nv4 .burger b{display:none}
  .nv4 .burger i,.nv4 .burger i::before,.nv4 .burger i::after{width:20px}
  .nv4 .burger i::before{top:-6px}.nv4 .burger i::after{top:6px}
  /* language */
  .m-ld summary{height:var(--h);padding:0 6px;gap:5px;color:#fff;font-size:12px;letter-spacing:1px}
  .m-ld summary svg{width:15px;height:15px}
  .m-ld .dd{right:-44px;top:calc(100% + 12px)}

  /* ---- V1 · one line, Subscribe centred, hairline between language and menu ---- */
  html.mv1 .nv4 .m-left{gap:0}
  html.mv1 .nv4 .m-ld{padding-right:6px;margin-right:6px;border-right:1px solid rgba(255,255,255,.28)}

  /* ---- V2 · two tiers: bar + full-width Subscribe strip ---- */
  html.mv2 .nv4 .in{flex-wrap:wrap;row-gap:0;padding-bottom:0}
  html.mv2 .nv4 .brand{flex:1 1 auto}
  html.mv2 .nv4 .m-left{order:2;flex:none}
  html.mv2 .nv4 .r{order:3;flex:0 0 calc(100% + 32px);margin:10px -16px 0}
  html.mv2 .nv4 .cta{width:100%;justify-content:center;height:40px;font-size:12px;letter-spacing:1.4px}
  html.mv2 .nv4 .m-ld{padding-right:6px;margin-right:6px;border-right:1px solid rgba(255,255,255,.28)}

  /* ---- V3 · boxed controls, same height and border ---- */
  html.mv3 .nv4{--h:36px}
  html.mv3 .nv4 .brand img{height:34px}
  html.mv3 .nv4 .m-left{gap:6px}
  html.mv3 .nv4 .m-ld summary,html.mv3 .nv4 .burger{border:1px solid rgba(255,255,255,.4)}
  html.mv3 .nv4 .m-ld summary svg:first-child{display:none}
  html.mv3 .nv4 .m-ld summary{padding:0 9px}

  /* ---- V4 · actions grouped on the right, logo gets the room ---- */
  html.mv4 .nv4 .brand{flex:1 1 auto}
  html.mv4 .nv4 .brand img{height:40px}
  html.mv4 .nv4 .r{order:3}
  html.mv4 .nv4 .m-left{order:4;flex:none;gap:0}
  html.mv4 .nv4 .in{gap:8px}
  html.mv4 .nv4 .m-ld summary svg:first-child{display:none}
  html.mv4 .nv4 .m-ld{border-left:1px solid rgba(255,255,255,.28);padding-left:4px}
  html.mv4 .nv4 .cta{padding:0 12px}
}
@media (max-width:370px){
  .nv4 .in{gap:8px;padding-left:12px;padding-right:12px}
  .nv4 .brand img{height:30px !important}
  .nv4 .cta{padding:0 10px}
  .m-ld summary svg:first-child{display:none}
}
