/* mm-v9-hero-lang: third overlay for Warehouse 4.8.2 (after mm-v9-brand.css and mm-v9-shop.css). Marker: mm-v9-hero-lang-20260916.
   Owner request (night of 15/16 Sept 2026): the ochre top bar with the flag and "Italiano" must go; the shop header
   must read like the main site (white field, quiet "IT / EN"). CSS only: the language links keep their href, hreflang
   and accessible names; #mobile-header is not touched (this bar is the only language switch on phones).
   Tokens come from mm-v9-brand.css (--mm-*). Prepared from proposal/shop-hero-lang-20260915/ANALISI.md §3.3. */

/* 1. the bar stops being cream and merges with the white header */
#header .header-nav {
  background: var(--mm-paper);
  border-bottom: 1px solid var(--mm-line);
  padding-top: .3rem; padding-bottom: .3rem;
}

/* 2. the selector containers become blocks: no accordion-like width */
#header .header-nav #language_selector,
#header .header-nav #language_selector .language-selector-wrapper,
#header .header-nav #language_selector .language-selector { display: block !important; }

/* 3. away with the flag and with the "Italiano ▾" label that opened the dropdown */
#header .header-nav #language_selector .lang-flag,
#header .header-nav #language_selector .expand-more { display: none !important; }

/* 4. the dropdown becomes an always-visible line of text, right-aligned */
#header .header-nav #language_selector .language-selector .dropdown-menu {
  display: block !important; position: static !important; float: none;
  min-width: 0; width: auto; max-height: none; overflow: visible; inset: auto;
  margin: 0; padding: 0; border: 0 !important; background: transparent !important;
  box-shadow: none; transform: none !important;
  opacity: 1 !important; visibility: visible !important; text-align: right;
}
#header .header-nav #language_selector .dropdown-menu ul {
  display: flex; flex-wrap: nowrap; align-items: center; justify-content: flex-end;
  min-width: max-content; gap: .45rem; margin: 0; padding: 0;
  list-style: none; white-space: nowrap;
}
#header .header-nav #language_selector .dropdown-menu li + li::before {
  content: "/"; color: var(--mm-muted); opacity: .5;
  margin-right: .45rem; font-size: .75rem; line-height: 1.4; vertical-align: middle;
}

/* 5. the two links: tracked small caps like the menu, current language full, the other softened */
#header .header-nav #language_selector .dropdown-menu .dropdown-item {
  display: inline-block; width: auto; padding: .45rem .3rem;
  border: 0 !important; background: none !important; color: var(--mm-ink) !important;
  font-family: var(--mm-sans); font-weight: 600; letter-spacing: .12em;
  text-transform: uppercase; opacity: .55;
  transition: opacity .25s ease, color .25s ease;
  font-size: 0; line-height: 0; white-space: nowrap; vertical-align: middle;
}
#header .header-nav #language_selector .dropdown-menu li.current .dropdown-item { opacity: 1; }
#header .header-nav #language_selector .dropdown-menu .dropdown-item:hover,
#header .header-nav #language_selector .dropdown-menu .dropdown-item:focus-visible {
  opacity: 1; color: var(--mm-accent) !important; background: none !important;
}

/* 6. "Italiano"/"English" are shown as "IT"/"EN" without touching the accessible name of the link */
#header .header-nav #language_selector .dropdown-menu .dropdown-item::before {
  display: inline-block; min-width: 1.6rem; text-align: center;
  font-size: .75rem; line-height: 1.4; letter-spacing: .12em; margin-right: -.12em;
}
#header .header-nav #language_selector .dropdown-menu a[hreflang="it"]::before { content: "IT"; }
#header .header-nav #language_selector .dropdown-menu a[hreflang="en"]::before { content: "EN"; }

/* 7. Home hero (one photograph, no slider): full-bleed block, gentle arrival like the main site. */
#content-wrapper .elementor-top-section:first-child .elementor-widget-image .elementor-image img {
  display: block; width: 100%; height: auto; }
@media (prefers-reduced-motion: no-preference) {
  @keyframes mm-hero-in { from { opacity: 0; transform: scale(1.015); } to { opacity: 1; transform: none; } }
  #content-wrapper .elementor-top-section:first-child .elementor-widget-image .elementor-image img {
    animation: mm-hero-in .9s ease both; transform-origin: 50% 60%; }
}