/* =============================================================================
   EURONUMMUS — Design system layer
   Apple "museum-gallery" style, gold accent. Loaded AFTER theme.css so these
   overrides win. Pure CSS custom properties = no build step, perf-first.
   Token source of truth: ~/Downloads/DESIGN-euronummus.md
   ========================================================================== */

/* -----------------------------------------------------------------------------
   1. DESIGN TOKENS
   -------------------------------------------------------------------------- */
:root {
  /* Brand / accent */
  --eu-primary:          #c4a95b;
  --eu-primary-focus:    #d3b875;
  --eu-primary-on-dark:  #e0c582;
  --eu-primary-rgb:      196, 169, 91;

  /* Ink & text */
  --eu-ink:              #1d1d1f;
  --eu-body:             #1d1d1f;
  --eu-body-on-dark:     #ffffff;
  --eu-body-muted:       #cccccc;
  --eu-ink-80:           #333333;
  --eu-ink-48:           #7a7a7a;

  /* Lines */
  --eu-divider-soft:     #f0f0f0;
  --eu-hairline:         #e0e0e0;

  /* Surfaces */
  --eu-canvas:           #ffffff;
  --eu-parchment:        #fff;
  --eu-pearl:            #fafafc;
  --eu-tile-1:           #272729;
  --eu-tile-2:           #2a2a2c;
  --eu-tile-3:           #252527;
  --eu-black:            #000000;
  --eu-chip:             rgba(210, 210, 215, 0.64);

  /* Typography — Apple stack: real SF Pro on Apple, Inter fallback elsewhere */
  --eu-font-display: -apple-system, BlinkMacSystemFont, "SF Pro Display", system-ui, "Inter", sans-serif;
  --eu-font-text:    -apple-system, BlinkMacSystemFont, "SF Pro Text", system-ui, "Inter", sans-serif;

  /* Type scale (rem @16px base) */
  --eu-fs-hero:    3.5rem;     /* 56 */
  --eu-fs-dlg:     2.5rem;     /* 40 */
  --eu-fs-dmd:     2.125rem;   /* 34 */
  --eu-fs-lead:    1.75rem;    /* 28 */
  --eu-fs-lead-airy:1.5rem;    /* 24 */
  --eu-fs-tagline: 1.3125rem;  /* 21 */
  --eu-fs-body:    1.0625rem;  /* 17 — Apple reading pace, not 16 */
  --eu-fs-caption: 0.875rem;   /* 14 */
  --eu-fs-fine:    0.75rem;    /* 12 */

  /* Spacing (8px base) */
  --eu-space-xxs:  4px;
  --eu-space-xs:   8px;
  --eu-space-sm:   12px;
  --eu-space-md:   17px;
  --eu-space-lg:   24px;
  --eu-space-xl:   32px;
  --eu-space-xxl:  48px;
  --eu-section:    56px;

  /* Radii */
  --eu-r-xs:   5px;
  --eu-r-sm:   8px;
  --eu-r-md:   11px;
  --eu-r-lg:   18px;
  --eu-r-pill: 9999px;

  /* The one signature shadow — product imagery only */
  --eu-shadow-product: 3px 5px 30px 0 rgba(0, 0, 0, 0.22);
}

/* -----------------------------------------------------------------------------
   2. BOOTSTRAP REMAP — rebrand the framework by overriding its --bs-* vars
   -------------------------------------------------------------------------- */
:root,
[data-bs-theme="light"] {
  /* Accent: blue -> gold */
  --bs-primary:               var(--eu-primary);
  --bs-primary-rgb:           var(--eu-primary-rgb);
  --bs-primary-text-emphasis: #6e5a1f;
  --bs-primary-bg-subtle:     #f6efdc;
  --bs-primary-border-subtle: #e6d5a3;

  /* Links */
  --bs-link-color:            var(--eu-primary);
  --bs-link-color-rgb:        var(--eu-primary-rgb);
  --bs-link-hover-color:      #a98f44;
  --bs-link-hover-color-rgb:  169, 143, 68;

  /* Body voice */
  --bs-body-color:        var(--eu-body);
  --bs-body-color-rgb:    29, 29, 31;
  --bs-body-bg:           var(--eu-canvas);
  --bs-body-font-family:  var(--eu-font-text);
  --bs-body-font-size:    var(--eu-fs-body);
  --bs-body-line-height:  1.47;
  --bs-emphasis-color:    var(--eu-ink);
  --bs-heading-color:     var(--eu-ink);

  /* Radius scale aligned to Apple grammar */
  --bs-border-radius:        var(--eu-r-md);
  --bs-border-radius-sm:     var(--eu-r-sm);
  --bs-border-radius-lg:     var(--eu-r-lg);
  --bs-border-radius-xl:     var(--eu-r-lg);
  --bs-border-radius-pill:   var(--eu-r-pill);
  --bs-border-color:         var(--eu-hairline);
}

/* -----------------------------------------------------------------------------
   3. BASE TYPOGRAPHY — "Apple tight" headlines, 17px editorial body
   -------------------------------------------------------------------------- */
body {
  font-family: var(--eu-font-text);
  color: var(--eu-body);
  letter-spacing: -0.374px;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
  font-family: var(--eu-font-display);
  color: var(--eu-ink);
  font-weight: 600;
  line-height: 1.1;
  letter-spacing: -0.022em;
}

h1, .h1 { font-size: clamp(2.125rem, 5vw, var(--eu-fs-hero)); line-height: 1.07; letter-spacing: -0.005em; }
h2, .h2 { font-size: clamp(1.75rem, 4vw, var(--eu-fs-dlg)); }
h3, .h3 { font-size: var(--eu-fs-dmd); }

.eu-lead   { font-family: var(--eu-font-display); font-size: var(--eu-fs-lead); font-weight: 400; line-height: 1.14; letter-spacing: 0.196px; }
.eu-tagline{ font-family: var(--eu-font-display); font-size: var(--eu-fs-tagline); font-weight: 600; line-height: 1.19; }
.eu-eyebrow{ font-size: var(--eu-fs-caption); font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; color: var(--eu-ink-48); }

/* -----------------------------------------------------------------------------
   4. BUTTONS — gold pill primary, ghost pill secondary, dark utility
   -------------------------------------------------------------------------- */
.btn {
  --bs-btn-font-family: var(--eu-font-text);
  --bs-btn-border-radius: var(--eu-r-pill);
  font-weight: 400;
  letter-spacing: -0.01em;
  transition: transform 0.12s ease, background-color 0.15s ease, color 0.15s ease;
}
.btn:active { transform: scale(0.96); }      /* system-wide micro-interaction */

.btn-primary {
  --bs-btn-color: #fff;
  --bs-btn-bg: var(--eu-primary);
  --bs-btn-focus-shadow-rgb: 196, 169, 91; /* anello focus oro, non il blu di Bootstrap */
  --bs-btn-border-color: var(--eu-primary);
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: var(--eu-primary-focus);
  --bs-btn-hover-border-color: var(--eu-primary-focus);
  --bs-btn-active-bg: var(--eu-primary-focus);
  --bs-btn-active-border-color: var(--eu-primary-focus);
  /* Disabled: grigio neutro, non il blu di default del theme base */
  --bs-btn-disabled-color: var(--eu-ink-48);
  --bs-btn-disabled-bg: var(--eu-hairline);
  --bs-btn-disabled-border-color: var(--eu-hairline);
  --bs-btn-padding-x: 22px;
  --bs-btn-padding-y: 11px;
}

/* Ghost pill — the second CTA when two appear together */
.btn-outline-primary,
.eu-btn-ghost {
  --bs-btn-color: var(--eu-primary);
  --bs-btn-border-color: var(--eu-primary);
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: var(--eu-primary);
  --bs-btn-hover-border-color: var(--eu-primary);
  /* :active/press — oro più scuro invece del blu di default Bootstrap */
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: #a8904a;
  --bs-btn-active-border-color: #a8904a;
  --bs-btn-focus-shadow-rgb: 196, 169, 91;
  --bs-btn-border-radius: var(--eu-r-pill);
}

/* Dark utility rect — nav actions */
.eu-btn-dark {
  --bs-btn-color: #fff;
  --bs-btn-bg: var(--eu-ink);
  --bs-btn-border-color: var(--eu-ink);
  --bs-btn-border-radius: var(--eu-r-sm);
  --bs-btn-padding-x: 15px;
  --bs-btn-padding-y: 8px;
  font-size: var(--eu-fs-caption);
}

/* -----------------------------------------------------------------------------
   5. HEADER / NAV — slim, quiet, edge-to-edge
   -------------------------------------------------------------------------- */
.header-top,
#header .header-nav {
  background: var(--eu-canvas);
  border-bottom: 1px solid var(--eu-divider-soft);
}
#header .header-nav a,
.main-menu a {
  color: var(--eu-ink);
  letter-spacing: -0.01em;
}
#header .header-nav a:hover,
.main-menu a:hover { color: var(--eu-primary); }

/* -----------------------------------------------------------------------------
   6. FOOTER — parchment, dense but breathing
   -------------------------------------------------------------------------- */
.footer-container,
#footer {
  background: var(--eu-parchment);
  color: var(--eu-ink-80);
}
#footer h3, #footer .h3,
.footer-container .h3 {
  font-size: var(--eu-fs-caption);
  font-weight: 600;
  letter-spacing: -0.224px;
  text-transform: none;
}
#footer a { color: var(--eu-ink-80); }
#footer a:hover { color: var(--eu-primary); }

/* -----------------------------------------------------------------------------
   7. SECTION / TILE SYSTEM — full-bleed alternating canvases.
   Color change IS the divider; no borders, no shadows on chrome.
   -------------------------------------------------------------------------- */
.eu-tile {
  padding-block: var(--eu-section);
  padding-inline: var(--eu-space-lg);
}
.eu-tile--light     { background: var(--eu-canvas);    color: var(--eu-ink); }
.eu-tile--parchment { background: var(--eu-parchment);  color: var(--eu-ink); }
/* Sezione "Oro e argento": leggermente grigia anche in light (in dark lo è già via --eu-parchment) */
.eu-cats { background: #f4f4f6; }
html[data-eu-theme="dark"] .eu-cats { background: var(--eu-parchment); }
/* Home: nessun gap extra tra le sezioni (ognuna gestisce il proprio padding) */
.page-content--home { gap: 0; }
/* Notifiche/alert: SEMPRE oro — outline oro, fondo oro leggerissimo, testo oro (buon contrasto),
   qualunque sia lo stato (successo/errore/info: niente più verde/rosso/grigio). */
.alert, .alert-success, .alert-danger, .alert-warning, .alert-info,
.alert-primary, .alert-secondary, .alert-light, .alert-dark {
  --bs-alert-bg: #faf6ea;
  --bs-alert-color: #6e5a1f;
  --bs-alert-border-color: var(--eu-primary);
  --bs-alert-link-color: #6e5a1f;
}
.alert .btn-close, .alert .close, .alert .material-icons { color: var(--eu-primary); }
.eu-tile--dark      { background: var(--eu-tile-1);     color: var(--eu-body-on-dark); }
.eu-tile--dark-2    { background: var(--eu-tile-2);     color: var(--eu-body-on-dark); }
.eu-tile--black     { background: var(--eu-black);      color: var(--eu-body-on-dark); }

.eu-tile--dark  h1, .eu-tile--dark  h2, .eu-tile--dark  h3,
.eu-tile--black h1, .eu-tile--black h2, .eu-tile--black h3,
.eu-tile--dark-2 h1, .eu-tile--dark-2 h2, .eu-tile--dark-2 h3 { color: var(--eu-body-on-dark); }

/* On dark tiles, inline links switch to the lighter gold so they don't vanish */
.eu-tile--dark a, .eu-tile--black a, .eu-tile--dark-2 a { color: var(--eu-primary-on-dark); }

.eu-tile__inner { max-width: 1440px; margin-inline: auto; }
.eu-tile--narrow .eu-tile__inner { max-width: 980px; }

/* The single drop-shadow in the system — product renders resting on a surface */
.eu-product-shadow { box-shadow: var(--eu-shadow-product); }

/* -----------------------------------------------------------------------------
   8. PRODUCT CARDS — quiet, hairline, no chrome shadow
   -------------------------------------------------------------------------- */
.product-miniature .card,
.eu-card {
  border: 1px solid var(--eu-hairline);
  border-radius: var(--eu-r-lg);
  box-shadow: none;
  background: var(--eu-canvas);
}
.product-miniature .product-title a { color: var(--eu-ink); font-weight: 600; }
.product-miniature .price { color: var(--eu-ink); font-weight: 600; }

/* Focus ring — keyboard accessibility, brand-tinted */
:focus-visible {
  outline: 2px solid var(--eu-primary-focus);
  outline-offset: 2px;
}

/* =============================================================================
   HOMEPAGE COMPONENTS
   ========================================================================== */

/* =============================================================================
   GLOBAL HEADER — announcement + nav + ticker
   ========================================================================== */

/* Announcement bar */
.eu-announce { background: var(--eu-parchment); border-bottom: 1px solid var(--eu-divider-soft); }
.eu-announce__inner {
  max-width: 1440px; margin-inline: auto; text-align: center;
  padding: 9px var(--eu-space-lg); font-size: var(--eu-fs-caption); color: var(--eu-ink-80);
}
.eu-announce a { color: var(--eu-primary); font-weight: 600; }

/* Main nav — only the nav bar sticks; announce + ticker scroll away.
   #header (PS wrapper) is dropped to display:contents so the nav's sticky
   containing block becomes <body> (tall) instead of the short header box. */
#header { display: contents; }
.eu-nav { background: var(--eu-canvas); border-bottom: 1px solid var(--eu-divider-soft); position: sticky; top: 0; z-index: 1030; }
.eu-nav--static { position: static; }
.eu-nav__inner {
  max-width: 1440px; margin-inline: auto;
  display: flex; align-items: center; gap: var(--eu-space-lg);
  padding: var(--eu-space-md) var(--eu-space-lg);
}
.eu-nav__logo { flex-shrink: 0; display: flex; align-items: center; }
.eu-nav__logo h1 { line-height: 0; }
.eu-logo-link { display: inline-flex; align-items: center; }
.eu-logo { height: 22px; width: auto; color: var(--eu-ink); fill: currentColor; display: block; }
.eu-logo--img { height: 43px; max-width: 280px; object-fit: contain; }
@media (max-width: 991px) { .eu-logo { height: 19px; } .eu-logo--img { height: 46px; } }
.eu-nav__links { display: flex; align-items: center; gap: var(--eu-space-lg); margin-inline: auto; }
.eu-nav__links a { color: var(--eu-ink); font-size: 13.5px; letter-spacing: -0.01em; white-space: nowrap; }
.eu-nav__links a:hover { color: var(--eu-primary); }
.eu-nav__link--promo { color: var(--eu-primary) !important; font-weight: 600; }
/* Pill nav — 4 stili selezionabili: oro pieno / oro outline / nero outline / nero pieno */
.eu-nav__pill { border: 1px solid var(--eu-ink); color: var(--eu-ink); background: transparent; border-radius: var(--eu-r-pill); padding: 7px 16px; font-size: 14px; transition: background .2s ease, color .2s ease, border-color .2s ease; }
.eu-nav__pill:hover { background: var(--eu-ink); color: var(--eu-canvas) !important; }
/* Doppia classe per battere `.eu-nav__links a { color }` (specificità 0,1,1) */
.eu-nav__pill.eu-nav__pill--gold { border-color: var(--eu-primary); background: var(--eu-primary); color: #fff; }
.eu-nav__pill.eu-nav__pill--gold:hover { background: color-mix(in srgb, var(--eu-primary) 86%, #000); color: #fff !important; }
.eu-nav__pill.eu-nav__pill--gold-outline { border-color: var(--eu-primary); color: var(--eu-primary); background: transparent; }
.eu-nav__pill.eu-nav__pill--gold-outline:hover { background: var(--eu-primary); color: #fff !important; }
.eu-nav__pill.eu-nav__pill--dark-outline { border-color: var(--eu-ink); color: var(--eu-ink); background: transparent; }
.eu-nav__pill.eu-nav__pill--dark-outline:hover { background: var(--eu-ink); color: var(--eu-canvas) !important; }
.eu-nav__pill.eu-nav__pill--dark { border-color: var(--eu-ink); background: var(--eu-ink); color: var(--eu-canvas); }
.eu-nav__pill.eu-nav__pill--dark:hover { background: color-mix(in srgb, var(--eu-ink) 82%, var(--eu-canvas)); color: var(--eu-canvas) !important; }

/* Desktop dropdown / mega menu */
.eu-nav__links { align-items: stretch; }
.eu-nav__item { position: relative; display: flex; align-items: center; }
.eu-nav__item--mega { position: static; }
.eu-nav__link { display: inline-flex; align-items: center; gap: 3px; }
.eu-nav__caret { font-size: 12px; opacity: 0.55; transform: rotate(90deg); transition: transform 0.2s ease; }
.eu-nav__item:hover .eu-nav__caret { transform: rotate(-90deg); }
.eu-mega {
  position: absolute; top: 100%; left: 0; min-width: 250px;
  background: var(--eu-canvas); border: 1px solid var(--eu-hairline); border-radius: 0 0 var(--eu-r-md) var(--eu-r-md);
  padding: var(--eu-space-sm); box-shadow: 0 16px 40px rgba(0,0,0,0.08);
  opacity: 0; visibility: hidden; transform: translateY(6px); transition: opacity 0.18s ease, transform 0.18s ease, visibility 0.18s;
  z-index: 1029;
}
.eu-mega::before { content: ""; position: absolute; left: 0; right: 0; top: -14px; height: 14px; } /* hover bridge */
.eu-nav__item:hover > .eu-mega,
.eu-nav__item:focus-within > .eu-mega { opacity: 1; visibility: visible; transform: translateY(0); }
.eu-mega__inner { display: flex; flex-direction: column; gap: 1px; }
.eu-mega__link { font-size: 14px; color: var(--eu-ink-80); padding: 8px 12px; border-radius: var(--eu-r-sm); white-space: nowrap; }
.eu-mega__link:hover { background: var(--eu-parchment); color: var(--eu-primary); }
/* Wide mega (Monete Oro): full nav width, 4 columns */
.eu-mega--wide { left: 0; right: 0; min-width: 0; padding: var(--eu-space-lg) 0; border-radius: 0 0 var(--eu-r-lg) var(--eu-r-lg); }
.eu-mega--wide .eu-mega__inner { max-width: 1440px; margin-inline: auto; padding-inline: var(--eu-space-lg); display: flex; flex-direction: row; gap: var(--eu-space-xl); align-items: flex-start; }
/* I link in colonne che si auto-adattano al numero di voci */
.eu-mega--wide .eu-mega__links { flex: 1 1 auto; display: grid; grid-template-columns: repeat(4, 1fr); gap: 1px var(--eu-space-lg); }
/* Colonna immagine: prodotto della categoria, che ruota */
.eu-mega__links { display: contents; } /* nei mega non-wide i link restano in colonna */
.eu-mega__media { flex: 0 0 240px; display: block; text-decoration: none; border-radius: var(--eu-r-md); overflow: hidden; background: var(--eu-parchment); }
.eu-mega__media img { display: block; width: 100%; aspect-ratio: 1; object-fit: cover; }
@media (max-width: 1100px) { .eu-mega__media { display: none; } }

.eu-nav__utils { display: flex; align-items: center; gap: var(--eu-space-md); flex-shrink: 0; }
/* Badge WhatsApp: nero quando offline, verde (testo + icona + outline) quando online */
.eu-online { display: inline-flex; align-items: center; gap: 7px; font-size: 13px; color: var(--eu-ink); border: 1px solid currentColor; border-radius: var(--eu-r-pill); padding: 5px 12px; white-space: nowrap; text-decoration: none; transition: color .3s ease; }
.eu-online.is-online { color: #1a9e5f; }
.eu-online__icon { display: inline-flex; flex: none; width: 15px; height: 15px; }
.eu-util-btn { position: relative; display: inline-flex; align-items: center; justify-content: center; background: none; border: 0; color: var(--eu-ink); cursor: pointer; padding: 4px; line-height: 1; }
.eu-util-btn .material-icons { font-size: 22px; }
.eu-util-btn:hover { color: var(--eu-primary); }
.eu-badge { position: absolute; top: -3px; right: -5px; background: var(--eu-primary); color: #fff; font-size: 10px; font-weight: 600; min-width: 16px; height: 16px; padding: 0 4px; border-radius: var(--eu-r-pill); display: grid; place-items: center; }

/* ---- Header layout B: ricerca centrale + menu su riga separata ------------- */
.eu-nav__top { gap: var(--eu-space-lg); }
.eu-searchbar { flex: 1; max-width: 520px; margin-inline: auto; display: flex; align-items: center; gap: 10px; cursor: text;
  border: 1px solid var(--eu-hairline); border-radius: var(--eu-r-pill); padding: 11px 20px; background: var(--eu-canvas);
  color: var(--eu-ink-48); font-size: var(--eu-fs-caption); }
.eu-searchbar:hover { border-color: var(--eu-ink); }
.eu-searchbar .eu-i { font-size: 18px; flex: none; }
.eu-nav__menurow { position: relative; border-top: 1px solid var(--eu-divider-soft); }
.eu-nav__menurow .eu-nav__links { display: flex; max-width: 1440px; margin-inline: auto; padding: var(--eu-space-xs) var(--eu-space-lg); justify-content: center; }
.eu-nav--search .eu-online { gap: 8px; }
@media (max-width: 991px) {
  .eu-nav__menurow { display: none; } /* su mobile la nav va nella sidebar */
  .eu-searchbar { display: none; }    /* su mobile si usa l'icona di ricerca */
  .eu-nav--search .eu-online { display: none; }
}

.eu-search-panel { border-bottom: 1px solid var(--eu-divider-soft); padding: var(--eu-space-md) 0; background: var(--eu-canvas); }
.eu-search-panel[hidden] { display: none; }

/* Dots */
.eu-dot { width: 8px; height: 8px; border-radius: 50%; display: inline-block; }
.eu-dot--gold { background: var(--eu-primary); }
.eu-dot--silver { background: #bfc3c9; }
.eu-dot--online { background: #1a9e5f; box-shadow: 0 0 0 3px rgba(26,158,95,0.15); }

/* Ticker row — light, sits under the nav, global */
.eu-ticker { background: var(--eu-canvas); border-bottom: 1px solid var(--eu-divider-soft); }
.eu-ticker__inner {
  max-width: 1440px; margin-inline: auto;
  display: flex; align-items: center; gap: var(--eu-space-md);
  padding: 9px var(--eu-space-lg); font-size: var(--eu-fs-caption);
}
.eu-ticker__quote { display: inline-flex; align-items: center; gap: 8px; white-space: nowrap; }
.eu-ticker__label { color: var(--eu-ink-48); text-transform: uppercase; letter-spacing: 0.05em; font-size: 12px; }
.eu-ticker__val { font-weight: 600; color: var(--eu-ink); font-variant-numeric: tabular-nums; }
.eu-ticker__delta { font-size: 13px; font-weight: 500; }
.eu-ticker__delta--up { color: #1a9e5f; }
.eu-ticker__delta--down { color: #d23b3b; }
.eu-ticker__sep { width: 1px; height: 18px; background: var(--eu-hairline); }
.eu-ticker__time { margin-left: auto; color: var(--eu-ink-48); white-space: nowrap; }
.eu-ticker__time b { color: var(--eu-ink); font-variant-numeric: tabular-nums; }

/* Marquee (announce + ticker): laid out normally on desktop; clone hidden.
   On mobile the group loops horizontally (text can be long). */
.eu-marquee__group { display: flex; align-items: center; }
.eu-announce__inner .eu-marquee__group { justify-content: center; gap: 6px; }
.eu-ticker__inner .eu-marquee__group { gap: var(--eu-space-md); width: 100%; }
.eu-marquee__clone { display: none; }
@keyframes eu-loop { to { transform: translateX(-100%); } }

/* Il campo WYSIWYG avvolge il testo in <p>: reso inline così resta in linea con il bottone */
.eu-announce__inner p { display: inline; margin: 0; }

/* Topbar annuncio: effetto marquee attivabile da BO — scorre a tutte le larghezze */
.eu-announce--marquee .eu-announce__inner { display: flex; align-items: center; overflow: hidden; flex-wrap: nowrap; white-space: nowrap; justify-content: flex-start; text-align: left; max-width: none; }
.eu-announce--marquee .eu-announce__inner .eu-marquee__group {
  flex: 0 0 auto; width: auto; min-width: 100%;
  justify-content: flex-start; padding-right: var(--eu-space-xxl);
  animation: eu-loop 30s linear infinite;
}
.eu-announce--marquee .eu-marquee__clone { display: flex; }
.eu-announce--marquee:hover .eu-marquee__group { animation-play-state: paused; }
@media (prefers-reduced-motion: reduce) { .eu-announce--marquee .eu-marquee__group { animation: none; } }

/* Breadcrumb — align its inner container with the header/ticker (1440 + lg padding)
   instead of Bootstrap's narrower, less-padded .container */
.breadcrumb__wrapper .container { max-width: 1440px; width: 100%; padding-inline: var(--eu-space-lg); margin-inline: auto; }

/* Header responsive — desktop nav hidden, mobile uses the push sidebar */
@media (max-width: 991px) {
  .eu-nav__links { display: none; }
  .eu-nav__logo { margin-inline: 0; margin-right: auto; } /* logo left-justified */
  .eu-online { display: none; }
  /* Looping marquee for the announcement bar + price ticker */
  .eu-announce__inner, .eu-ticker__inner {
    overflow: hidden; flex-wrap: nowrap; white-space: nowrap; justify-content: flex-start;
  }
  [data-marquee] { display: flex; }
  [data-marquee] .eu-marquee__group {
    flex: 0 0 auto; width: auto !important; min-width: 100%;
    justify-content: flex-start; padding-right: var(--eu-space-xxl);
    animation: eu-loop 22s linear infinite;
  }
  .eu-announce__inner[data-marquee] .eu-marquee__group { animation-duration: 28s; }
  [data-marquee] .eu-ticker__time { margin-left: 0; }
  [data-marquee] .eu-marquee__clone { display: flex; }
}

/* Mobile push sidebar */
.eu-sidebar {
  position: fixed; top: 0; left: 0; bottom: 0; width: min(320px, 82vw); z-index: 2100;
  background: var(--eu-canvas); border-right: 1px solid var(--eu-hairline);
  display: flex; flex-direction: column; overflow-y: auto;
  transform: translateX(-100%); transition: transform 0.3s ease;
}
html.eu-sb-open .eu-sidebar { transform: translateX(0); }
.eu-sidebar__head { display: flex; align-items: center; justify-content: space-between; padding: var(--eu-space-md) var(--eu-space-lg); border-bottom: 1px solid var(--eu-divider-soft); }
.eu-sidebar__head .eu-logo { height: 24px; color: var(--eu-ink); }
.eu-sidebar__nav { padding: var(--eu-space-xs) 0 var(--eu-space-xl); }
.eu-sidebar__link {
  display: flex; align-items: center; justify-content: space-between; gap: var(--eu-space-sm); width: 100%;
  padding: 13px var(--eu-space-lg); font-size: 15px; color: var(--eu-ink); background: none; border: 0; text-align: left; cursor: pointer;
}
.eu-sidebar__link--promo { color: var(--eu-primary); font-weight: 600; }
.eu-sidebar__link--pill { margin: var(--eu-space-sm) var(--eu-space-lg) 0; width: auto; border: 1px solid var(--eu-ink); border-radius: var(--eu-r-pill); justify-content: center; }
.eu-sidebar__caret { font-size: 16px; color: var(--eu-ink-48); transition: transform 0.25s ease; flex: none; }
.eu-sidebar__item.is-open .eu-sidebar__caret { transform: rotate(90deg); }
.eu-sidebar__sub { max-height: 0; overflow: hidden; transition: max-height 0.32s ease; background: var(--eu-parchment); }
.eu-sidebar__item.is-open .eu-sidebar__sub { max-height: 720px; }
.eu-sidebar__sub a { display: block; padding: 10px var(--eu-space-lg) 10px calc(var(--eu-space-lg) + 12px); font-size: 14px; color: var(--eu-ink-80); }
.eu-sidebar__sub a:hover { color: var(--eu-primary); }
.eu-sidebar__backdrop { position: fixed; inset: 0; z-index: 2090; background: rgba(0,0,0,0.3); }
.eu-sidebar__backdrop[hidden] { display: none; }

/* Push the page content when the sidebar is open */
.eu-announce, .eu-nav, .eu-ticker, #wrapper, #footer { transition: transform 0.3s ease; }
html.eu-sb-open { overflow-x: hidden; }
html.eu-sb-open .eu-announce,
html.eu-sb-open .eu-nav,
html.eu-sb-open .eu-ticker,
html.eu-sb-open #wrapper,
html.eu-sb-open #footer { transform: translateX(min(320px, 82vw)); }

/* 10. HERO -------------------------------------------------------------------- */
.eu-hero { text-align: center; padding-block: clamp(48px, 8vw, 96px) 0; }
.eu-hero h1 { margin: 0 auto var(--eu-space-lg); max-width: 16ch; }
.eu-hero__sub {
  max-width: 56ch; margin: 0 auto var(--eu-space-xl);
  font-size: var(--eu-fs-body); line-height: 1.5; color: var(--eu-ink-80);
}
.eu-hero__cta { display: flex; gap: var(--eu-space-md); justify-content: center; align-items: center; flex-wrap: wrap; }
.eu-hero__media {
  width: 100%; aspect-ratio: 21 / 8; background: var(--eu-tile-1) center/cover no-repeat;
  display: grid; place-items: center; color: var(--eu-body-muted);
}

/* 11. SECTION HEADER — centered, with eyebrow mark --------------------------- */
.eu-sechead { text-align: center; margin-bottom: var(--eu-space-xxl); }
.eu-sechead__mark { width: 100px; height: 100px; margin: 0 auto var(--eu-space-md); }
.eu-sechead__mark img { width: 100%; height: 100%; object-fit: contain; display: block; }
html[data-eu-theme="dark"] .eu-sechead__mark img { filter: brightness(0) invert(1); }
.eu-sechead h2 { margin: 0; }
.eu-sechead p { margin: var(--eu-space-sm) auto 0; max-width: 60ch; color: var(--eu-ink-80); }

/* 12. METAL CARDS — 2×2 grid; switchable layout (photo bottom | photo left) -- */
.eu-metal-grid {
  display: grid; gap: var(--eu-space-lg);
  grid-template-columns: repeat(2, 1fr); max-width: 1040px; margin-inline: auto;
}
/* 6 cards: 3-up for the showcase (bottom) layout, 2-up for the compact (left) one */
.eu-home[data-eu-cards="bottom"] .eu-metal-grid { grid-template-columns: repeat(3, 1fr); max-width: 1280px; }
.eu-home[data-eu-cards="left"] .eu-metal-grid { grid-template-columns: repeat(2, 1fr); max-width: 1040px; }
.eu-metal-card {
  position: relative; overflow: hidden;
  background: var(--eu-canvas); border: 1px solid var(--eu-hairline);
  border-radius: var(--eu-r-lg);
  transition: border-color 0.2s ease, background 0.2s ease, transform 0.15s ease, box-shadow 0.2s ease;
}
.eu-metal-card:hover { border-color: var(--eu-ink); background: var(--eu-ink); transform: translateY(-2px); box-shadow: 0 16px 40px rgba(0,0,0,.18); }
.eu-metal-card__eyebrow, .eu-metal-card__title, .eu-metal-card__desc { transition: color 0.2s ease; }
.eu-metal-card:hover .eu-metal-card__title { color: #fff; }
.eu-metal-card:hover .eu-metal-card__desc { color: rgba(255,255,255,0.72); }
.eu-metal-card__eyebrow { font-size: 11px; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; color: var(--eu-primary); }
.eu-metal-card__title { font-family: var(--eu-font-display); font-size: 1.6rem; line-height: 1.12; font-weight: 600; color: var(--eu-ink); margin: 8px 0 var(--eu-space-sm); letter-spacing: -0.02em; }
.eu-metal-card__desc { font-size: var(--eu-fs-caption); color: var(--eu-ink-48); line-height: 1.45; margin: 0 0 var(--eu-space-md); }
.eu-metal-card__price { font-size: var(--eu-fs-caption); color: var(--eu-ink-80); }
.eu-metal-card__price b { font-size: var(--eu-fs-body); color: var(--eu-ink); }
.eu-metal-card__media {
  background: var(--eu-parchment); border-radius: 50%;
  display: grid; place-items: center; text-align: center;
  font-size: 11px; color: var(--eu-ink-48); line-height: 1.2;
  filter: drop-shadow(var(--eu-shadow-product));
}
/* Foto già ritagliata: ancorata a fondo card, full-bleed, sotto il testo */
.eu-metal-card__photo { position: absolute; left: 0; right: 0; bottom: 0; width: 75%; margin: 0 auto; height: auto; display: block; }

/* ============================================================ AREA BANCHE + MARQUEE */
.eu-banks__intro { text-align: center; max-width: 720px; margin: 0 auto var(--eu-space-xxl); }
.eu-banks__eyebrow { font-size: 11px; font-weight: 600; letter-spacing: 0.1em; text-transform: uppercase; color: var(--eu-primary); }
.eu-banks__title { font-family: var(--eu-font-display); font-size: clamp(24px, 3.2vw, 36px); line-height: 1.15; font-weight: 600; letter-spacing: -0.02em; margin: var(--eu-space-sm) 0 var(--eu-space-md); }
.eu-banks__text { font-size: var(--eu-fs-body); line-height: 1.6; color: var(--eu-ink-80); margin: 0 auto var(--eu-space-lg); max-width: 60ch; }
.eu-banks__contacts { display: flex; flex-wrap: wrap; gap: var(--eu-space-md) var(--eu-space-xl); justify-content: center; margin-bottom: var(--eu-space-lg); }
.eu-banks__contact { display: inline-flex; align-items: center; gap: 8px; color: var(--eu-ink); text-decoration: none; font-size: var(--eu-fs-caption); }
.eu-banks__contact svg { color: var(--eu-primary); flex: none; }
.eu-banks__contact:hover { color: var(--eu-primary); }
.eu-banks__contact b { font-weight: 700; }
.eu-marquee { position: relative; overflow: hidden; width: 100vw; max-width: 100vw; margin-left: calc(50% - 50vw); margin-top: var(--eu-space-md);
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent);
          mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent); }
.eu-marquee__track { display: flex; width: max-content; align-items: center; animation: eu-marquee-scroll 60s linear infinite; }
.eu-marquee:hover .eu-marquee__track { animation-play-state: paused; }
.eu-marquee__item { flex: none; display: grid; place-items: center; margin-right: clamp(44px, 6vw, 100px); }
.eu-marquee__item img { height: clamp(56px, 6.5vw, 88px); width: auto; max-width: 220px; object-fit: contain; display: block;
  filter: grayscale(1); opacity: 0.62; transition: filter .2s ease, opacity .2s ease; }
.eu-marquee__item img:hover { filter: none; opacity: 1; }
@keyframes eu-marquee-scroll { from { transform: translateX(0); } to { transform: translateX(-50%); } }
@media (prefers-reduced-motion: reduce) { .eu-marquee__track { animation: none; flex-wrap: wrap; justify-content: center; row-gap: var(--eu-space-lg); } }

/* Card articolo blog (carosello "Dal blog" in home) */
.eu-artcard { display: flex; flex-direction: column; background: var(--eu-canvas); border: 1px solid var(--eu-hairline);
  border-radius: var(--eu-r-lg); overflow: hidden; text-decoration: none; transition: border-color .15s ease, transform .15s ease, box-shadow .15s ease; }
.eu-artcard:hover { border-color: var(--eu-primary); transform: translateY(-2px); box-shadow: 0 12px 32px rgba(0,0,0,.06); }
.eu-artcard__media { display: block; aspect-ratio: 16 / 10; background: var(--eu-parchment); overflow: hidden; }
.eu-artcard__media img { width: 100%; height: 100%; object-fit: cover; display: block; }
.eu-artcard__body { display: flex; flex-direction: column; gap: 6px; padding: var(--eu-space-lg); }
.eu-artcard__cat { font-size: 11px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--eu-primary); }
.eu-artcard__title { font-family: var(--eu-font-display); font-size: var(--eu-fs-tagline); line-height: 1.2; font-weight: 600; color: var(--eu-ink); margin: 0;
  display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }

/* Perché Euronummus — value cards (bianche con outline, icone sottili) */
.eu-why__grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: var(--eu-space-lg); }
.eu-whyc { display: flex; flex-direction: column; gap: var(--eu-space-sm); padding: var(--eu-space-xl); background: var(--eu-canvas);
  border: 1px solid var(--eu-hairline); border-radius: var(--eu-r-lg); transition: border-color .15s ease, box-shadow .15s ease; }
.eu-whyc:hover { border-color: var(--eu-primary); box-shadow: 0 12px 32px rgba(0,0,0,.05); }
.eu-whyc__icon { display: block; width: 30px; height: 30px; color: var(--eu-primary); }
.eu-whyc__icon svg { width: 100%; height: 100%; display: block; }
.eu-whyc__title { font-family: var(--eu-font-display); font-size: var(--eu-fs-tagline); line-height: 1.2; font-weight: 600; color: var(--eu-ink); margin: var(--eu-space-xs) 0 0; }
.eu-whyc__desc { font-size: var(--eu-fs-caption); color: var(--eu-ink-48); line-height: 1.5; margin: 0; }
@media (max-width: 1080px) { .eu-why__grid { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 640px) { .eu-why__grid { grid-template-columns: 1fr 1fr; } }

/* Default — photo at bottom, text centered (the showcase layout) */
.eu-home[data-eu-cards="bottom"] .eu-metal-card,
.eu-metal-card {
  display: flex; flex-direction: column; align-items: center; text-align: center;
  padding: var(--eu-space-xl) var(--eu-space-xl) 0; min-height: 470px;
}
.eu-metal-card__body { width: 100%; position: relative; z-index: 1; }
.eu-metal-card__desc { max-width: 34ch; margin-inline: auto var(--eu-space-md); }
.eu-home[data-eu-cards="bottom"] .eu-metal-card__media,
.eu-metal-card__media {
  width: 64%; aspect-ratio: 1; margin-top: var(--eu-space-lg);
  margin-bottom: calc(-1 * var(--eu-space-xxl)); /* anchor & clip at the bottom edge */
}

/* Variant — photo on the left, text right-aligned-left, compact rows */
.eu-home[data-eu-cards="left"] .eu-metal-card {
  flex-direction: row; align-items: center; text-align: left;
  padding: var(--eu-space-xl); min-height: 0; gap: var(--eu-space-lg);
}
.eu-home[data-eu-cards="left"] .eu-metal-card__media {
  order: -1; flex: none; width: 38%; max-width: 150px; aspect-ratio: 1;
  margin: 0;
}
.eu-home[data-eu-cards="left"] .eu-metal-card__body { width: auto; }
.eu-home[data-eu-cards="left"] .eu-metal-card__desc { max-width: none; margin-inline: 0 0; }
.eu-home[data-eu-cards="left"] .eu-metal-card__title { font-size: var(--eu-fs-tagline); }

/* Search suggestion coin reuse */
.eu-coin {
  width: 84px; height: 84px; border-radius: 50%;
  background: var(--eu-parchment); border: 1px solid var(--eu-hairline);
  display: grid; place-items: center; font-size: 11px; color: var(--eu-ink-48);
  box-shadow: var(--eu-shadow-product);
}

/* 13. PRODUCT RAIL + FILTER CHIPS -------------------------------------------- */
.eu-rail-head { display: flex; align-items: flex-end; justify-content: space-between; gap: var(--eu-space-lg); margin-bottom: var(--eu-space-xl); flex-wrap: wrap; }
/* Prodotti in Vetrina: griglia 5 colonne (render server-side, .eu-pcard) */
.eu-vetrina__grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: var(--eu-space-lg); }
@media (max-width: 1200px) { .eu-vetrina__grid { grid-template-columns: repeat(4, 1fr); } }
@media (max-width: 900px)  { .eu-vetrina__grid { grid-template-columns: repeat(3, 1fr); gap: var(--eu-space-md); } }
@media (max-width: 600px)  { .eu-vetrina__grid { grid-template-columns: repeat(2, 1fr); gap: var(--eu-space-md); } }
.eu-chips { display: flex; gap: var(--eu-space-xs); flex-wrap: wrap; }
.eu-chip {
  border: 1px solid var(--eu-hairline); background: var(--eu-canvas); color: var(--eu-ink-80);
  border-radius: var(--eu-r-pill); padding: 8px 16px; font-size: var(--eu-fs-caption);
  cursor: pointer; transition: all 0.15s ease;
}
.eu-chip:hover { border-color: var(--eu-ink); }
.eu-chip[aria-pressed="true"], .eu-chip.is-active { background: var(--eu-ink); color: #fff; border-color: var(--eu-ink); }
.eu-rail {
  display: grid; grid-auto-flow: column; grid-auto-columns: minmax(220px, 1fr);
  gap: var(--eu-space-lg); overflow-x: auto; scroll-snap-type: x mandatory;
  padding-bottom: var(--eu-space-sm); scrollbar-width: thin;
}
.eu-rail > * { scroll-snap-align: start; }
.eu-prod {
  background: var(--eu-canvas); border: 1px solid var(--eu-hairline); border-radius: var(--eu-r-lg);
  padding: var(--eu-space-lg); display: flex; flex-direction: column; gap: var(--eu-space-xs);
}
.eu-prod__img { aspect-ratio: 1; border-radius: var(--eu-r-sm); background: var(--eu-parchment); display: grid; place-items: center; color: var(--eu-ink-48); font-size: var(--eu-fs-fine); margin-bottom: var(--eu-space-xs); }
.eu-prod__name { font-size: var(--eu-fs-caption); font-weight: 600; color: var(--eu-ink); }
.eu-prod__price { font-size: var(--eu-fs-body); font-weight: 600; color: var(--eu-ink); }
.eu-prod__stars { color: var(--eu-primary); font-size: 12px; letter-spacing: 2px; }

/* 14. INVESTMENT DARK CARDS — editorial tiles -------------------------------- */
.eu-dark-rail { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--eu-space-md); }
.eu-dark-card {
  background: var(--eu-tile-1); color: var(--eu-body-on-dark);
  border-radius: var(--eu-r-lg); padding: var(--eu-space-xl);
  min-height: 240px; display: flex; flex-direction: column; justify-content: space-between;
}
.eu-dark-card--2 { background: var(--eu-tile-2); }
.eu-dark-card--3 { background: var(--eu-tile-3); }
.eu-dark-card__title { font-family: var(--eu-font-display); font-size: var(--eu-fs-tagline); font-weight: 600; line-height: 1.15; }
.eu-dark-card__desc { font-size: var(--eu-fs-caption); color: var(--eu-body-muted); line-height: 1.45; margin-top: var(--eu-space-sm); }
.eu-dark-card__mark { width: 40px; height: 40px; border-radius: 50%; background: rgba(255,255,255,0.06); display: grid; place-items: center; color: var(--eu-primary-on-dark); font-size: 13px; }

/* 15. TRUST BLOCKS ----------------------------------------------------------- */
.eu-two { display: grid; grid-template-columns: 1fr 1fr; gap: var(--eu-space-md); }
.eu-panel { border-radius: var(--eu-r-lg); padding: var(--eu-space-xxl); }
.eu-panel--dark { background: var(--eu-tile-1); color: var(--eu-body-on-dark); }
.eu-panel--light { background: var(--eu-canvas); border: 1px solid var(--eu-hairline); }
.eu-panel--parchment { background: var(--eu-parchment); }
.eu-panel__eyebrow { font-size: 11px; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; color: var(--eu-primary); margin-bottom: var(--eu-space-md); }
.eu-panel h3 { font-size: var(--eu-fs-dmd); line-height: 1.15; letter-spacing: -0.022em; margin: 0 0 var(--eu-space-md); }
.eu-panel--dark h3 { color: var(--eu-body-on-dark); }
.eu-panel p { font-size: var(--eu-fs-caption); line-height: 1.5; color: var(--eu-ink-80); }
.eu-panel--dark p { color: var(--eu-body-muted); }

/* Card consulenza: foto a sinistra, contenuto a destra (boxed unica) */
.eu-consult { display: grid; grid-template-columns: 1fr 1fr; align-items: stretch;
  border: 1px solid var(--eu-hairline); border-radius: var(--eu-r-lg); overflow: hidden; background: var(--eu-canvas); }
.eu-consult__media { margin: 0; }
.eu-consult__media img { display: block; width: 100%; height: 100%; min-height: 340px; object-fit: cover; }
.eu-consult__body { padding: var(--eu-space-xxl); display: flex; flex-direction: column; justify-content: center; }
.eu-consult__body h3 { font-size: var(--eu-fs-dmd); line-height: 1.15; letter-spacing: -0.022em; margin: 0 0 var(--eu-space-md); }
.eu-consult__body p { font-size: var(--eu-fs-caption); line-height: 1.5; color: var(--eu-ink-80); margin: 0; }
@media (max-width: 760px) {
  .eu-consult { grid-template-columns: 1fr; }
  .eu-consult__media img { min-height: 220px; }
  .eu-consult__body { padding: var(--eu-space-xl); }
}
.eu-chart { width: 100%; height: 120px; margin-top: var(--eu-space-lg); }

/* 16. PRICE SIMULATOR -------------------------------------------------------- */
.eu-sim { display: grid; grid-template-columns: 1fr 1fr; gap: var(--eu-space-xxl); align-items: center; }
.eu-sim__card { background: var(--eu-parchment); border: 1px solid var(--eu-hairline); border-radius: var(--eu-r-lg); padding: var(--eu-space-xl); }
.eu-sim__row { display: flex; justify-content: space-between; align-items: center; padding: var(--eu-space-sm) 0; border-bottom: 1px solid var(--eu-divider-soft); font-size: var(--eu-fs-caption); }
.eu-sim__row:last-of-type { border-bottom: 0; }
.eu-sim__label { color: var(--eu-ink-80); }
.eu-sim__val { font-weight: 600; color: var(--eu-ink); font-variant-numeric: tabular-nums; }
.eu-sim__total { display: flex; justify-content: space-between; align-items: baseline; margin: var(--eu-space-md) 0; }
.eu-sim__total b { font-family: var(--eu-font-display); font-size: var(--eu-fs-dlg); font-weight: 600; color: var(--eu-ink); font-variant-numeric: tabular-nums; }
/* Pianificatore investimento — tab taglio + risparmio in evidenza */
.eu-planner__seg { display: flex; flex-wrap: wrap; gap: 2px; width: 100%; margin-bottom: var(--eu-space-lg);
  background: var(--eu-canvas); border: 1px solid var(--eu-hairline); border-radius: var(--eu-r-pill); padding: 3px; }
.eu-planner__tab { position: relative; flex: 1 1 0; min-width: 48px; border: 0; background: transparent; border-radius: var(--eu-r-pill);
  padding: 8px 6px; font-size: var(--eu-fs-caption); font-weight: 600; color: var(--eu-ink-80); cursor: pointer;
  font-variant-numeric: tabular-nums; transition: background .15s ease, color .15s ease; white-space: nowrap; }
.eu-planner__tab.is-active { background: var(--eu-ink); color: #fff; }
.eu-planner__tab:disabled { opacity: 0.35; cursor: default; }
/* Tooltip risparmio su hover del tab (freccia verde + %) */
.eu-planner__tip { position: absolute; bottom: calc(100% + 8px); left: 50%; transform: translateX(-50%) translateY(4px);
  display: inline-flex; align-items: center; gap: 3px; white-space: nowrap; background: var(--eu-ink); color: #fff;
  font-size: 11px; font-weight: 700; padding: 4px 8px; border-radius: var(--eu-r-sm); font-variant-numeric: tabular-nums;
  opacity: 0; pointer-events: none; transition: opacity .15s ease, transform .15s ease; z-index: 5; }
.eu-planner__tip::after { content: ''; position: absolute; top: 100%; left: 50%; transform: translateX(-50%);
  border: 5px solid transparent; border-top-color: var(--eu-ink); }
.eu-planner__tab:hover .eu-planner__tip,
.eu-planner__tab:focus-visible .eu-planner__tip { opacity: 1; transform: translateX(-50%) translateY(0); }
.eu-planner__tip-arrow { width: 12px; height: 12px; flex: none; color: #34c759; }
.eu-planner__badge { position: absolute; top: -6px; right: -4px; min-width: 18px; height: 18px; padding: 0 5px;
  display: inline-flex; align-items: center; justify-content: center; background: var(--eu-primary); color: #fff;
  font-size: 11px; font-weight: 700; border-radius: 999px; line-height: 1; font-variant-numeric: tabular-nums; }
.eu-planner__badge[hidden] { display: none; }
.eu-planner__lock { display: flex; align-items: center; gap: 6px; margin-top: var(--eu-space-sm); font-size: var(--eu-fs-fine); color: var(--eu-ink-48); }
.eu-planner__lock .eu-i { color: var(--eu-ink); flex: none; font-size: 15px; }
.eu-planner__msg { margin-top: var(--eu-space-sm); font-size: var(--eu-fs-caption); color: var(--eu-primary); font-weight: 600; text-align: center; }
.eu-planner__msg[hidden] { display: none; }
.eu-seg { display: inline-flex; background: var(--eu-canvas); border: 1px solid var(--eu-hairline); border-radius: var(--eu-r-pill); padding: 3px; }
.eu-seg button { border: 0; background: transparent; border-radius: var(--eu-r-pill); padding: 7px 16px; font-size: var(--eu-fs-caption); color: var(--eu-ink-80); cursor: pointer; }
.eu-seg button.is-active { background: var(--eu-ink); color: #fff; }
.eu-stepper { display: inline-flex; align-items: center; gap: var(--eu-space-md); }
.eu-stepper button { width: 32px; height: 32px; border-radius: 50%; border: 1px solid var(--eu-hairline); background: var(--eu-canvas); font-size: 18px; line-height: 1; cursor: pointer; color: var(--eu-ink); }
.eu-stepper output { min-width: 2ch; text-align: center; font-weight: 600; font-variant-numeric: tabular-nums; }

/* 17. PROMO SLOT ------------------------------------------------------------- */
.eu-promo { background: var(--eu-tile-1); color: var(--eu-body-on-dark); border-radius: var(--eu-r-lg); min-height: 280px; display: grid; place-items: center; text-align: center; }
.eu-promo__ph { color: var(--eu-ink-48); font-size: var(--eu-fs-caption); }

/* 18. HOME RESPONSIVE -------------------------------------------------------- */
@media (max-width: 833px) {
  .eu-dark-rail { grid-template-columns: repeat(2, 1fr); }
  .eu-two, .eu-sim { grid-template-columns: 1fr; gap: var(--eu-space-lg); }
  .eu-tile { padding-block: var(--eu-space-xxl); }
  .eu-home[data-eu-cards="bottom"] .eu-metal-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 560px) {
  .eu-metal-grid,
  .eu-home[data-eu-cards="bottom"] .eu-metal-grid,
  .eu-home[data-eu-cards="left"] .eu-metal-grid { grid-template-columns: 1fr; }
  .eu-metal-card__photo { width: 65%; }
  .eu-dark-rail { grid-template-columns: 1fr; }
  .eu-ticker__inner { gap: var(--eu-space-sm); overflow-x: auto; }
  .eu-panel { padding: var(--eu-space-xl); }
}

/* =============================================================================
   CATEGORY / LISTING — full-width (no left rail), SEO header, horizontal toolbar,
   product grid with bespoke cards.
   ========================================================================== */
/* Suppress the left category-tree rail; filters go horizontal. Align the
   columns container to the site width (1440 + lg padding), like the header. */
.page-category .columns-container { max-width: 1440px; width: 100%; padding-inline: var(--eu-space-lg); margin-inline: auto; }
/* Hide the left rail entirely — facets are hosted in the horizontal bar (JS
   moves #search-filters out of here into #eu-filterbar before it's hidden). */
.page-category #left-column { display: none; }
.page-category #center-column { flex: 0 0 100%; max-width: 100%; width: 100%; }

/* SEO header */
b, strong { font-weight: 700; }
/* Header categoria — editoriale "targa da galleria", allineato a sinistra. */
.eu-cat-head { position: relative; padding: var(--eu-space-xxl) 0 var(--eu-space-xl); }
.eu-cat-head__inner { position: relative; z-index: 1; max-width: 100%; }
.eu-cat-head__eyebrow { margin: 0 0 var(--eu-space-sm); color: var(--eu-primary); text-transform: uppercase; letter-spacing: 0.2em; font-size: 0.76rem; font-weight: 700; }
.eu-cat-head__title { font-family: var(--eu-font-display); font-size: clamp(2.2rem, 4vw, 3.6rem); line-height: 1.05; letter-spacing: -0.02em; color: var(--eu-ink); margin: 0; }
.eu-cat-head__rule { display: block; width: 64px; height: 1px; margin: var(--eu-space-md) 0; background: var(--eu-ink); }
/* Sottocategorie: una sola riga con scroll orizzontale, card foto + nome centrato */
.eu-cat-head__subswrap { margin-top: var(--eu-space-xl); }
.eu-cat-head__subnav { display: flex; justify-content: flex-end; gap: 6px; margin-bottom: var(--eu-space-sm); }
.eu-cat-head__subnav[hidden] { display: none; }
.eu-subnav__btn { width: 32px; height: 32px; border: 1px solid var(--eu-hairline); border-radius: 50%; background: var(--eu-canvas); color: var(--eu-ink); display: grid; place-items: center; cursor: pointer; transition: border-color 0.15s ease, color 0.15s ease, opacity 0.15s ease; }
.eu-subnav__btn:hover { border-color: var(--eu-primary); color: var(--eu-primary); }
.eu-subnav__btn:disabled { opacity: 0.3; cursor: default; }
.eu-subnav__btn .eu-i { font-size: 16px; }
.eu-cat-head__subs { display: flex; gap: var(--eu-space-md); overflow-x: auto;
  padding-bottom: var(--eu-space-xs); scroll-snap-type: x proximity; -webkit-overflow-scrolling: touch; }
.eu-cat-head__subs::-webkit-scrollbar { height: 0; }
.eu-subcat { flex: 0 0 140px; display: block; text-decoration: none; scroll-snap-align: start; }
.eu-subcat__media { display: block; aspect-ratio: 1; border-radius: var(--eu-r-md); overflow: hidden; background: var(--eu-parchment); }
.eu-subcat__media img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform 0.4s ease; }
.eu-subcat:hover .eu-subcat__media img { transform: scale(1.04); }
.eu-subcat__name { display: block; margin-top: var(--eu-space-sm); text-align: center; color: var(--eu-ink); font-size: var(--eu-fs-caption); line-height: 1.25; }
.eu-subcat:hover .eu-subcat__name { color: var(--eu-primary); }
@media (max-width: 767px) {
  .eu-cat-head { padding: var(--eu-space-xl) 0 var(--eu-space-lg); }
}

/* SEO copy block (bottom of listing) */
.eu-cat-seo { margin-top: var(--eu-space-xxl); padding-top: var(--eu-space-xl); border-top: 1px solid var(--eu-divider-soft); max-width: 80ch; }
.eu-cat-seo__rich { color: var(--eu-ink-80); font-size: var(--eu-fs-body); line-height: 1.65; }
.eu-cat-seo__rich h2 { font-family: var(--eu-font-display); font-size: 1.5rem; line-height: 1.2; letter-spacing: -0.01em; color: var(--eu-ink); margin: var(--eu-space-xl) 0 var(--eu-space-sm); }
.eu-cat-seo__rich h3 { font-size: 1.15rem; font-weight: 600; color: var(--eu-ink); margin: var(--eu-space-lg) 0 var(--eu-space-xs); }
.eu-cat-seo__rich h2:first-child, .eu-cat-seo__rich h3:first-child { margin-top: 0; }
.eu-cat-seo__rich p { margin: 0 0 var(--eu-space-md); }
.eu-cat-seo__rich strong, .eu-cat-seo__rich b { color: var(--eu-ink); }
.eu-cat-seo__rich a { color: var(--eu-primary); }
.eu-cat-seo__rich ul, .eu-cat-seo__rich ol { margin: 0 0 var(--eu-space-md); padding-left: 1.25em; }
.eu-cat-seo__rich li { margin-bottom: 4px; }

/* Toolbar — sticks just under the sticky header (offset via --eu-nav-h from JS).
   Collapse its wrapper so the sticky range spans the whole #products section
   (otherwise sticky is trapped in the toolbar-height wrapper and never sticks). */
.page-category #js-product-list-top { display: contents; }
.eu-toolbar { position: sticky; top: var(--eu-nav-h, 64px); z-index: 19; background: var(--eu-canvas);
  display: flex; align-items: center; justify-content: space-between; gap: var(--eu-space-md);
  padding-block: var(--eu-space-md); margin-bottom: var(--eu-space-xl); border-bottom: 1px solid var(--eu-divider-soft); }
.eu-toolbar__count { font-size: var(--eu-fs-caption); color: var(--eu-ink-48); }
.eu-toolbar__right { display: flex; align-items: center; gap: var(--eu-space-md); }
.eu-toolbar__filter { display: inline-flex; align-items: center; gap: 7px; background: none; cursor: pointer;
  border: 1px solid var(--eu-hairline); border-radius: var(--eu-r-pill); padding: 7px 14px; font-size: 13px; color: var(--eu-ink); }
.eu-toolbar__filter:hover { border-color: var(--eu-ink); }
.eu-toolbar__filter .eu-i { font-size: 16px; }

/* Sort dropdown (Bootstrap) restyled to a pill */
.products__sort-label { font-size: var(--eu-fs-caption); color: var(--eu-ink-48); }
.products__sort-dropdown { position: relative; }
.products__sort-dropdown-button.btn { border: 1px solid var(--eu-hairline); border-radius: var(--eu-r-pill);
  background: var(--eu-canvas); color: var(--eu-ink); padding: 7px 14px; font-size: 13px; }
.products__sort-dropdown-button.btn:hover { border-color: var(--eu-ink); }
.products__sort-dropdown .dropdown-menu { border: 1px solid var(--eu-hairline); border-radius: var(--eu-r-md);
  box-shadow: 0 16px 40px rgba(0,0,0,0.08); padding: 6px; min-width: 220px; }
.products__sort-dropdown .dropdown-item { font-size: 13px; padding: 8px 12px; border-radius: var(--eu-r-sm); color: var(--eu-ink-80); }
.products__sort-dropdown .dropdown-item:hover { background: var(--eu-parchment); color: var(--eu-primary); }
.products__sort-dropdown .dropdown-item.current { color: var(--eu-primary); font-weight: 600; }

/* Product grid */
.products { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--eu-space-lg); }
/* Switch 3/4/5 colonne (frontend) — solo desktop; sotto ai 992px valgono le
   regole responsive (3/2 colonne) */
@media (min-width: 992px) {
  body[data-eu-cols="3"] .products { grid-template-columns: repeat(3, 1fr); }
  body[data-eu-cols="4"] .products { grid-template-columns: repeat(4, 1fr); }
  body[data-eu-cols="5"] .products { grid-template-columns: repeat(5, 1fr); }
}
.eu-cols { display: inline-flex; gap: 4px; }
.eu-cols__btn { width: 32px; height: 28px; display: inline-flex; align-items: center; justify-content: center; border: 0; background: transparent; border-radius: var(--eu-r-sm); color: var(--eu-ink-48); cursor: pointer; transition: background .15s ease, color .15s ease; }
.eu-cols__btn .eu-i { font-size: 18px; stroke-width: 1.5; }
.eu-cols__btn:hover { color: var(--eu-ink); }
.eu-cols__btn.is-active { background: var(--eu-divider-soft); color: var(--eu-ink); }
@media (max-width: 991px) { .eu-cols { display: none; } }

/* Product card */
.eu-pcard { position: relative; display: flex; flex-direction: column; overflow: hidden;
  background: var(--eu-canvas); border: 1px solid var(--eu-hairline); border-radius: var(--eu-r-lg);
  transition: border-color 0.15s ease, transform 0.15s ease, box-shadow 0.15s ease; }
.eu-pcard:hover { border-color: var(--eu-primary); transform: translateY(-2px); box-shadow: 0 12px 32px rgba(0,0,0,0.06); }
.eu-pcard__media { position: relative; aspect-ratio: 1; background: var(--eu-canvas); border-bottom: 1px solid var(--eu-divider-soft); }
.eu-pcard__image-link { display: grid; place-items: center; width: 100%; height: 100%; }
.eu-pcard__img { width: 100%; height: 100%; object-fit: contain; padding: var(--eu-space-lg); }
/* Seconda foto in hover (crossfade) */
.eu-pcard__img--alt { position: absolute; inset: 0; opacity: 0; transition: opacity 0.35s ease; }
.eu-pcard:hover .eu-pcard__img--alt { opacity: 1; }
.eu-pcard__ph { color: var(--eu-ink-48); font-size: var(--eu-fs-fine); text-align: center; line-height: 1.2; }
.eu-pcard__body { display: flex; flex-direction: column; gap: 4px; padding: var(--eu-space-lg); flex: 1; }
.eu-pcard__name { font-size: var(--eu-fs-caption); font-weight: 400; color: var(--eu-ink); line-height: 1.35; text-align: center; }
.eu-pcard__name:hover { color: var(--eu-primary); }
.eu-pcard__price { font-size: var(--eu-fs-body); font-weight: 600; color: var(--eu-ink); margin-top: 2px; text-align: center; }
.eu-pcard__regular { font-size: var(--eu-fs-caption); font-weight: 400; color: var(--eu-ink-48); text-decoration: line-through; margin-left: 6px; }
.eu-pcard__actions { margin-top: auto; padding-top: var(--eu-space-md); }
.eu-pcard__btn { width: 100%; }
.eu-pcard__qty { display: none; } /* listing buys 1; stepper kept for PS ajax only */

/* Product flags (badges) over the image */
.eu-pcard .product-flags { position: absolute; top: var(--eu-space-sm); left: var(--eu-space-sm); z-index: 2;
  display: flex; flex-wrap: wrap; gap: 6px; margin: 0; padding: 0; list-style: none; }
.eu-pcard .product-flags .badge { font-size: 10px; font-weight: 600; letter-spacing: 0.04em; text-transform: uppercase;
  padding: 4px 9px; border-radius: var(--eu-r-pill); background: var(--eu-ink); color: #fff; line-height: 1.3; }
.eu-pcard .product-flags .badge.new, .eu-pcard .product-flags .badge.online-only { background: var(--eu-primary); }
.eu-pcard .product-flags .badge.discount, .eu-pcard .product-flags .badge.on-sale { background: #c0392b; }
.eu-pcard .product-flags .badge.out_of_stock, .eu-pcard .product-flags .badge.pack { background: var(--eu-ink-48); }

/* Pagination — hidden: the listing uses infinite scroll (eu-infinite). The DOM
   stays so the script can read the page count. */
.products__pagination { display: none; }
.eu-infinite { display: flex; justify-content: center; padding: var(--eu-space-xl) 0; }
.eu-infinite[hidden] { display: none; }
.eu-infinite__spinner { width: 26px; height: 26px; border: 2px solid var(--eu-hairline); border-top-color: var(--eu-primary); border-radius: 50%; animation: eu-spin 0.7s linear infinite; }
@keyframes eu-spin { to { transform: rotate(360deg); } }
.products__pagination--legacy { display: flex; justify-content: center; margin-top: var(--eu-space-xxl); }
.products__pagination .pagination { display: flex; gap: 4px; list-style: none; margin: 0; padding: 0; }
.products__pagination .page-list { display: flex; gap: 4px; list-style: none; margin: 0; padding: 0; }
.products__pagination a, .products__pagination span { display: grid; place-items: center; min-width: 38px; height: 38px;
  padding: 0 10px; border: 1px solid var(--eu-hairline); border-radius: var(--eu-r-sm); font-size: 13px; color: var(--eu-ink-80); }
.products__pagination a:hover { border-color: var(--eu-ink); color: var(--eu-ink); }
.products__pagination .current span, .products__pagination .current a { background: var(--eu-ink); color: #fff; border-color: var(--eu-ink); }
.products__pagination .disabled span { opacity: 0.4; }

/* Collapsible category description (under the title) */
.eu-cat-desc { position: relative; margin-top: var(--eu-space-md); max-width: 80ch; }
.eu-cat-desc__content { position: relative; overflow: hidden; color: var(--eu-ink-80); font-size: var(--eu-fs-body); line-height: 1.65; transition: max-height 0.35s ease; }
.eu-cat-desc__content h2 { font-family: var(--eu-font-display); font-size: 1.4rem; line-height: 1.2; letter-spacing: -0.01em; color: var(--eu-ink); margin: var(--eu-space-lg) 0 var(--eu-space-sm); }
.eu-cat-desc__content h2:first-child { margin-top: 0; }
.eu-cat-desc__content h3 { font-size: 1.1rem; font-weight: 600; color: var(--eu-ink); margin: var(--eu-space-md) 0 var(--eu-space-xs); }
.eu-cat-desc__content p { margin: 0 0 var(--eu-space-md); }
.eu-cat-desc__content strong, .eu-cat-desc__content b { color: var(--eu-ink); }
.eu-cat-desc__content a { color: var(--eu-primary); }
.eu-cat-desc__content ul, .eu-cat-desc__content ol { margin: 0 0 var(--eu-space-md); padding-left: 1.25em; }
.eu-cat-desc__content li { margin-bottom: 4px; }
.eu-cat-desc__toggle { display: inline-flex; align-items: center; justify-content: center; background: none; border: 0; cursor: pointer; padding: 6px 4px; margin-top: 2px; color: var(--eu-ink-48); }
.eu-cat-desc__toggle:hover { color: var(--eu-primary); }
.eu-cat-desc__caret { font-size: 22px; transform: rotate(90deg); transition: transform 0.3s ease; } /* points down */
.eu-cat-desc.is-open .eu-cat-desc__caret { transform: rotate(-90deg); } /* points up */
/* Descrizione + foto quadrata sticky (immagine categoria caricata da BO) */
.eu-cat-descrow--img { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--eu-space-xxl); align-items: start; margin-top: var(--eu-space-md); }
.eu-cat-head__main { min-width: 0; }
.eu-cat-descrow--img .eu-cat-head__rule { margin-bottom: var(--eu-space-lg); }
.eu-cat-descrow--img .eu-cat-desc { margin-top: 0; max-width: none; }
.eu-cat-figure { position: sticky; top: calc(var(--eu-nav-h, 64px) + var(--eu-space-lg)); margin: 0; }
.eu-cat-figure img { width: 100%; height: auto; border-radius: var(--eu-r-lg); display: block; border: 0; }
@media (max-width: 860px) {
  .eu-cat-descrow--img { grid-template-columns: 1fr; gap: var(--eu-space-lg); }
  .eu-cat-figure { position: static; order: -1; max-width: 100vw; width: 100vw; margin-left: calc(50% - 50vw); }
  .eu-cat-figure img { width: 100%; }
  .eu-cat-figure img { border-radius: 0; }
}

/* Faceted "Filtri" drawer (offcanvas) */
#offcanvas-faceted.offcanvas { background: var(--eu-canvas); width: min(380px, 90vw); border: 0; }
#offcanvas-faceted .offcanvas-header { padding: var(--eu-space-lg); border-bottom: 1px solid var(--eu-divider-soft); }
#offcanvas-faceted .offcanvas-title { font-family: var(--eu-font-display); font-size: 1.15rem; font-weight: 600; color: var(--eu-ink); }
#offcanvas-faceted .offcanvas-body { padding: var(--eu-space-sm) var(--eu-space-lg) var(--eu-space-lg); }

/* Facets (Bootstrap accordion markup from ps_facetedsearch) */
.search-filters .left-block__title { font-size: var(--eu-fs-caption); font-weight: 600; text-transform: uppercase; letter-spacing: 0.06em; color: var(--eu-ink-48); margin: 0 0 var(--eu-space-sm); }
.search-filters .accordion-item { border: 0; border-bottom: 1px solid var(--eu-divider-soft); background: transparent; }
.search-filters .accordion-button { padding: var(--eu-space-md) 0; font-size: 15px; font-weight: 600; color: var(--eu-ink); background: transparent; box-shadow: none; }
.search-filters .accordion-button:not(.collapsed) { color: var(--eu-ink); background: transparent; box-shadow: none; }
.search-filters .accordion-button:focus { box-shadow: none; border-color: transparent; }
.search-filters .accordion-body { padding: 0 0 var(--eu-space-md); margin: 0; list-style: none; }
.search-filters__item { padding: 5px 0; }
.search-filters .form-check { display: flex; align-items: center; gap: 10px; padding-left: 0; margin: 0; }
.search-filters .form-check-input { margin: 0; float: none; border-color: var(--eu-hairline); cursor: pointer; }
.search-filters .form-check-input:checked { background-color: var(--eu-primary); border-color: var(--eu-primary); }
.search-filters .form-check-input:focus { box-shadow: 0 0 0 3px rgba(196,169,91,0.18); border-color: var(--eu-primary); }
.search-filters__link { color: var(--eu-ink-80); font-size: 14px; }
.search-filters__link:hover { color: var(--eu-primary); }
.search-filters .facet-label.active .search-filters__link { color: var(--eu-primary); font-weight: 600; }
.search-filters .magnitude { color: var(--eu-ink-48); font-size: 12px; }
.js-search-filters-clear-all { background: none; border: 0; color: var(--eu-primary); font-size: 13px; padding: 0; margin-top: var(--eu-space-md); cursor: pointer; display: inline-flex; align-items: center; gap: 4px; }
.js-search-filters-clear-all:hover { text-decoration: underline; }
/* Price/weight slider (jQuery UI), styled defensively for when it appears */
.search-filters .ui-slider { background: var(--eu-hairline); height: 3px; border: 0; border-radius: 2px; margin: var(--eu-space-md) 4px; }
.search-filters .ui-slider .ui-slider-range { background: var(--eu-primary); }
.search-filters .ui-slider .ui-slider-handle { width: 16px; height: 16px; top: -7px; background: var(--eu-ink); border: 0; border-radius: 50%; cursor: pointer; }

/* Desktop horizontal filter bar — facets become pill dropdowns above the grid.
   (Mobile keeps the native "Filtri" drawer; the bar is hidden there.) */
.eu-filterbar { margin: 0 0 var(--eu-space-lg); }
.eu-filterbar[hidden] { display: none; }
.eu-filterbar .search-filters { display: flex; flex-direction: row; align-items: center; flex-wrap: wrap; gap: var(--eu-space-md); }
.eu-filterbar .left-block__title { margin: 0; font-size: var(--eu-fs-fine); font-weight: 600; text-transform: uppercase; letter-spacing: 0.06em; color: var(--eu-ink-48); }
.eu-filterbar .accordion { display: flex; flex-wrap: wrap; gap: var(--eu-space-sm); }
.eu-filterbar .accordion-item { position: relative; border: 0; background: transparent; }
.eu-filterbar .accordion-button { width: auto; border: 1px solid var(--eu-hairline); border-radius: var(--eu-r-pill); padding: 8px 16px; font-size: 13px; font-weight: 500; gap: 8px; }
.eu-filterbar .accordion-button:not(.collapsed) { border-color: var(--eu-ink); color: var(--eu-ink); }
.eu-filterbar .accordion-button::after { width: 0.9rem; height: 0.9rem; background-size: 0.9rem; margin-left: 2px; }
.eu-filterbar .accordion-collapse { position: absolute; top: 100%; left: 0; z-index: 30; min-width: 240px; margin-top: 6px;
  background: var(--eu-canvas); border: 1px solid var(--eu-hairline); border-radius: var(--eu-r-md); box-shadow: 0 16px 40px rgba(0,0,0,0.08); }
.eu-filterbar .accordion-body { padding: var(--eu-space-sm) var(--eu-space-md); max-height: 320px; overflow-y: auto; }
/* The bar replaces the (unreliable) offcanvas drawer on every viewport */
.eu-toolbar__filter { display: none; }
@media (max-width: 991px) { .eu-filterbar .accordion-collapse { max-width: calc(100vw - 2 * var(--eu-space-lg)); } }

/* Active filter chips (above the grid) — ps_facetedsearch markup */
.active-filters { margin-bottom: var(--eu-space-lg); }
.active-filters.hide, #js-active-search-filters.hide { display: none; }
.active-filters__list { display: flex; flex-wrap: wrap; align-items: center; gap: var(--eu-space-sm); list-style: none; margin: 0; padding: 0; }
.active-filters__item { margin: 0; }
.active-filters__title { font-size: var(--eu-fs-caption); color: var(--eu-ink-48); }
.active-filters__link.btn { display: inline-flex; align-items: center; gap: 6px; background: var(--eu-parchment); border: 1px solid var(--eu-hairline); border-radius: var(--eu-r-pill); padding: 5px 12px; font-size: 13px; color: var(--eu-ink); }
.active-filters__link.btn:hover { border-color: var(--eu-ink); color: var(--eu-ink); }
.active-filters__link .material-icons { font-size: 15px; color: var(--eu-ink-48); }
.active-filters__link:hover .material-icons { color: var(--eu-primary); }

@media (max-width: 991px) { .products { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 680px) {
  .products { grid-template-columns: repeat(2, 1fr); gap: var(--eu-space-md); }
  .eu-toolbar { flex-wrap: wrap; }
}

/* =============================================================================
   SVG ICONS — Lucide-style, currentColor, scale via font-size
   ========================================================================== */
.eu-i { width: 1em; height: 1em; display: inline-block; vertical-align: -0.125em;
  fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; flex: none; }
.eu-util-btn .eu-i { font-size: 19px; }

/* =============================================================================
   DARK MODE — flip the token values; components built on tokens follow.
   Triggered by html[data-eu-theme="dark"] (set by no-flash script + toggle).
   ========================================================================== */
html[data-eu-theme="dark"] {
  --eu-canvas:      #0b0b0c;
  --eu-parchment:   #151517;
  --eu-pearl:       #1c1c1e;
  --eu-ink:         #f5f5f7;
  --eu-body:        #f5f5f7;
  --eu-ink-80:      #c9c9ce;
  --eu-ink-48:      #8a8a90;
  --eu-divider-soft:#1d1d1f;
  --eu-hairline:    #2c2c2e;
  --eu-tile-1:      #1b1b1e;
  --eu-tile-2:      #212125;
  --eu-tile-3:      #161618;
}
/* Inverse-surface components: keep readable when --eu-ink flips light */
html[data-eu-theme="dark"] .eu-chip.is-active,
html[data-eu-theme="dark"] .eu-chip[aria-pressed="true"],
html[data-eu-theme="dark"] .eu-seg button.is-active,
html[data-eu-theme="dark"] .eu-btn-dark,
html[data-eu-theme="dark"] .eu-nav__pill:hover { color: var(--eu-canvas); }
html[data-eu-theme="dark"] .product-miniature .card { background: var(--eu-pearl); }

/* =============================================================================
   CAROUSEL — Apple-style horizontal track with round arrow controls
   ========================================================================== */
.eu-related { margin-top: var(--eu-space-xl); }
.eu-carousel { display: flex; flex-direction: column; gap: var(--eu-space-md); }
.eu-carousel__track {
  order: 0;
  display: grid; grid-auto-flow: column; grid-auto-columns: 248px;
  gap: var(--eu-space-lg); overflow-x: auto; scroll-snap-type: x mandatory;
  scroll-behavior: smooth; padding-bottom: var(--eu-space-xs);
  scrollbar-width: none;
}
.eu-carousel__track::-webkit-scrollbar { display: none; }
.eu-carousel__track > * { scroll-snap-align: start; }
.eu-carousel--dark .eu-carousel__track { grid-auto-columns: 300px; }
.eu-home-empty { width: 100%; padding: var(--eu-space-xxl) 0; text-align: center; color: var(--eu-ink-48); font-size: var(--eu-fs-body); }
.eu-home-empty[hidden] { display: none; }

/* Boxed-start + full-bleed both sides: the first card aligns to the boxed
   container, but the track spans the whole viewport so scrolled cards stay
   visible to the left/right edges (no clipping at the boxed boundary). */
.eu-carousel--bleed .eu-carousel__track {
  --eu-bleed: calc(var(--eu-space-lg) + max((100vw - 1488px) / 2, 0px));
  margin-left: calc(-1 * var(--eu-bleed));
  margin-right: calc(-1 * var(--eu-bleed));
  padding-left: var(--eu-bleed);
  padding-right: var(--eu-space-lg);
  scroll-padding-left: var(--eu-bleed);
}

/* Arrow group (prev + next side by side) */
.eu-carousel__nav { display: flex; gap: var(--eu-space-xs); }
.eu-carousel__arrow {
  width: 44px; height: 44px; border-radius: 50%;
  background: var(--eu-canvas); border: 1px solid var(--eu-hairline); color: var(--eu-ink);
  display: grid; place-items: center; cursor: pointer;
  transition: transform 0.12s ease, opacity 0.15s ease, border-color 0.15s ease;
}
.eu-carousel__arrow .eu-i { font-size: 20px; }
.eu-carousel__arrow:hover { border-color: var(--eu-primary); transform: scale(1.06); }
.eu-carousel__arrow:active { transform: scale(0.94); }
.eu-carousel__arrow[disabled] { opacity: 0.3; pointer-events: none; }

/* Arrow position — driven by data-eu-arrows on .eu-home (default: bottom-right) */
.eu-home .eu-carousel__nav { order: 1; justify-content: flex-end; }                       /* bottom-right (default) */
.eu-home[data-eu-arrows="bottom-left"] .eu-carousel__nav { order: 1; justify-content: flex-start; }
.eu-home[data-eu-arrows="top"] .eu-carousel__nav { order: -1; justify-content: flex-end; }
@media (max-width: 991px) { .eu-carousel__nav { display: none; } }

/* =============================================================================
   SEARCH OVERLAY
   ========================================================================== */
.eu-overlay { position: fixed; inset: 0; z-index: 2000; }
.eu-overlay[hidden] { display: none; }
.eu-overlay__backdrop { position: absolute; inset: 0; background: rgba(0,0,0,0.4); animation: eu-fade 0.2s ease; }
.eu-overlay__panel { position: relative; background: var(--eu-canvas); border-bottom: 1px solid var(--eu-hairline);
  box-shadow: 0 20px 60px rgba(0,0,0,0.25); animation: eu-slide-down 0.25s ease; }
.eu-overlay__inner { max-width: 1100px; margin-inline: auto; padding: var(--eu-space-xl) var(--eu-space-lg) var(--eu-space-xxl); }
.eu-search-row { display: flex; align-items: center; gap: var(--eu-space-md); border-bottom: 1px solid var(--eu-hairline); padding-bottom: var(--eu-space-md); }
.eu-search-row__icon { font-size: 26px; color: var(--eu-ink-48); flex: none; }
.eu-search-row [data-search-close] { flex: none; }
.eu-search-row__field { flex: 1; min-width: 0; }
/* ps_searchbar widget: force full width + visible (its wrapper is col-auto + d-none on mobile) */
.eu-search-row__field #_desktop_ps_searchbar,
.eu-search-row__field #_mobile_ps_searchbar {
  display: flex !important; width: 100%; max-width: 100%; padding: 0; margin: 0;
}
/* On mobile the widget renders inside a Bootstrap offcanvas (#searchCanvas) that is
   visibility:hidden + position:fixed + translated off-screen until its own toggle fires.
   We host the searchbar in our own overlay, so neutralise the offcanvas entirely. */
.eu-search-row__field #searchCanvas {
  visibility: visible !important; opacity: 1 !important;
  position: static !important; transform: none !important; transition: none !important;
  inset: auto !important; width: 100% !important; max-width: 100% !important; height: auto !important;
  display: block !important; background: transparent !important; border: 0 !important; box-shadow: none !important;
}
/* The searchbar lives inside .offcanvas-header (with a Bootstrap close button we
   don't need — our overlay has its own X). Show the header, drop its chrome. */
.eu-search-row__field #searchCanvas .offcanvas-header { display: flex !important; width: 100%; padding: 0 !important; }
.eu-search-row__field #searchCanvas .offcanvas-header > .btn-link,
.eu-search-row__field #searchCanvas [data-bs-dismiss="offcanvas"] { display: none !important; }
.eu-search-row__field #searchCanvas .offcanvas-body { display: block !important; padding: 0 !important; overflow: visible !important; }
.eu-search-row__field #searchCanvas,
.eu-search-row__field #_mobile_ps_searchbar,
.eu-search-row__field .ps-searchbar,
.eu-search-row__field .ps-searchbar__form,
.eu-search-row__field .ps-searchbar__input { visibility: visible !important; }
.eu-search-row__field .ps-searchbar { min-width: 100%; width: 100%; }
.eu-search-row__field .ps-searchbar__form { width: 100%; display: flex; align-items: center; margin: 0; }
.eu-search-row__field .ps-searchbar__input {
  flex: 1; width: 100%; border: 0 !important; background: transparent !important; outline: none;
  box-shadow: none !important; border-radius: 0 !important;
  font-family: var(--eu-font-display); font-size: clamp(1.25rem, 3vw, 1.75rem); font-weight: 400;
  color: var(--eu-ink); padding: 0 !important; height: auto; letter-spacing: -0.01em;
}
.eu-search-row__field .ps-searchbar__input::placeholder { color: var(--eu-ink-48); }
.eu-search-row__field .ps-searchbar__magnifier,
.eu-search-row__field button[type="submit"],
.eu-search-row__field .material-icons { display: none; }
/* Ajax results IN FLOW (between input and "Più cercati"), not an overlay.
   euronummus.js moves the dropdown out of the field to just under the row, so
   results no longer grow the row (the magnifier/close icons stay put). */
.eu-search-row__field .ps-searchbar,
.eu-search-row__field .ps-searchbar__form { position: static; }
#eu-search .ps-searchbar__dropdown {
  position: static !important; inset: auto !important; width: 100%; transform: none !important;
  margin-top: var(--eu-space-lg); background: transparent; border: 0; box-shadow: none;
  max-height: 46vh; overflow-y: auto;
}
#eu-search .ps-searchbar__results { padding: 0; }

/* More air before the suggestions */
.eu-search-suggest { margin-top: var(--eu-space-xxl); }
/* Nascondi la lista nativa di ps_searchbar (Hummingbird) e l'autocomplete jQuery:
   usiamo solo la nostra griglia di risultati. */
.ps-searchbar__dropdown, .js-search-dropdown, .searchbar-autocomplete, .ui-autocomplete { display: none !important; }
.eu-search-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: var(--eu-space-md); }
.eu-search-card { background: var(--eu-pearl); border: 1px solid var(--eu-hairline); border-radius: var(--eu-r-lg);
  padding: var(--eu-space-lg); display: flex; flex-direction: column; gap: 4px; }
.eu-search-card:hover { border-color: var(--eu-primary); transform: translateY(-2px); box-shadow: 0 12px 32px rgba(0,0,0,.06); }
.eu-search-card { transition: border-color .2s ease, transform .2s ease, box-shadow .2s ease; }
.eu-search-card__img { width: 100%; aspect-ratio: 1 / 1; object-fit: contain; background: var(--eu-canvas);
  border-radius: var(--eu-r-sm); margin-bottom: var(--eu-space-xs); }
.eu-search-card__eb { font-size: 11px; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; color: var(--eu-primary); }
.eu-search-card__n { font-size: var(--eu-fs-caption); font-weight: 600; color: var(--eu-ink); line-height: 1.3;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.eu-search-card__p { font-size: var(--eu-fs-body); font-weight: 600; color: var(--eu-ink); margin-top: auto; }
.eu-coin--sm { width: 48px; height: 48px; font-size: 11px; margin-bottom: var(--eu-space-xs); }
.eu-search-empty { grid-column: 1 / -1; color: var(--eu-ink-48); font-size: var(--eu-fs-body); margin: var(--eu-space-sm) 0; }
@media (max-width: 1080px) { .eu-search-grid { grid-template-columns: repeat(4, 1fr); } }
@media (max-width: 820px) { .eu-search-grid { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 560px) { .eu-search-grid { grid-template-columns: repeat(2, 1fr); } }

/* =============================================================================
   CART DRAWER
   ========================================================================== */
.eu-drawer { position: fixed; inset: 0; z-index: 2000; }
.eu-drawer[hidden] { display: none; }
.eu-drawer__panel {
  position: absolute; top: 0; right: 0; bottom: 0; width: min(420px, 100%);
  background: var(--eu-canvas); display: flex; flex-direction: column; overflow: hidden;
  box-shadow: -20px 0 60px rgba(0,0,0,0.25); animation: eu-slide-left 0.28s ease;
}
/* solo gli items scrollano; testa, spedizione, lock e totali restano fissi */
.eu-drawer__head, .eu-drawer__ship, .eu-drawer__lock, .eu-drawer__totals { flex: none; }
.eu-drawer__head { display: flex; align-items: center; justify-content: space-between;
  padding: var(--eu-space-lg); border-bottom: 1px solid var(--eu-divider-soft); background: var(--eu-canvas); z-index: 2; }
.eu-drawer__title { font-family: var(--eu-font-display); font-size: var(--eu-fs-tagline); font-weight: 600; margin: 0; display: flex; align-items: center; gap: var(--eu-space-sm); }
.eu-badge--lg { position: static; min-width: 24px; height: 24px; font-size: 13px; background: var(--eu-primary); }
.eu-drawer__ship { background: var(--eu-parchment); padding: var(--eu-space-md) var(--eu-space-lg); }
.eu-drawer__ship p { font-size: var(--eu-fs-caption); color: var(--eu-ink-80); margin: 0 0 var(--eu-space-xs); display: flex; align-items: center; gap: 8px; }
.eu-drawer__ship .eu-i { color: var(--eu-primary); font-size: 18px; }
.eu-progress { height: 6px; border-radius: var(--eu-r-pill); background: var(--eu-hairline); overflow: hidden; }
.eu-progress span { display: block; height: 100%; background: var(--eu-primary); border-radius: inherit; }
.eu-drawer__items { flex: 1 1 auto; min-height: 0; overflow-y: auto; padding: 0 var(--eu-space-lg); }
.eu-citem { display: grid; grid-template-columns: 72px 1fr; gap: var(--eu-space-md); padding: var(--eu-space-lg) 0; border-bottom: 1px solid var(--eu-divider-soft); }
.eu-citem__aside { display: flex; flex-direction: column; align-items: center; }
.eu-citem__img { width: 72px; height: 72px; border-radius: var(--eu-r-md); background: var(--eu-parchment); border: 1px solid var(--eu-hairline); display: grid; place-items: center; overflow: hidden; }
.eu-citem__img img { width: 100%; height: 100%; object-fit: contain; }
.eu-citem__name { font-size: var(--eu-fs-caption); font-weight: 600; color: var(--eu-ink); }
.eu-citem__meta { font-size: 12px; color: var(--eu-ink-48); margin-top: 2px; }
.eu-citem__row { display: flex; align-items: center; justify-content: space-between; margin-top: var(--eu-space-xs); }
.eu-citem__price { font-weight: 600; color: var(--eu-ink); font-variant-numeric: tabular-nums; }
.eu-citem__remove { font-size: 12px; color: var(--eu-ink-48); display: inline-block; margin-top: 6px; }
.eu-citem__remove:hover { color: #d23b3b; }
.eu-citem__name { text-decoration: none; }
.eu-citem__name:hover { text-decoration: underline; }
.eu-citem__lock { display: flex; align-items: center; gap: 5px; margin-top: 5px; font-size: 11px; line-height: 1.3; color: var(--eu-ink-48); }
.eu-citem__lock .eu-i { font-size: 12px; color: var(--eu-primary); flex: none; }
.eu-citem__lock b { color: var(--eu-ink); font-variant-numeric: tabular-nums; }
.eu-price-lock-badge { display: inline-flex; align-items: center; gap: 4px; font-size: 12px; font-weight: 600; color: var(--eu-gold, #b8860b); background: #fdf8ec; border: 1px solid #e8d98a; border-radius: 4px; padding: 2px 8px; white-space: nowrap; }
.eu-stepper--sm { gap: var(--eu-space-xs); }
.eu-stepper--sm a { width: 26px; height: 26px; border: 1px solid var(--eu-hairline); border-radius: 50%; display: grid; place-items: center; color: var(--eu-ink); }
.eu-stepper--sm .eu-i { font-size: 14px; }
.eu-stepper--sm output { min-width: 1.5ch; text-align: center; font-weight: 600; }
.eu-drawer__lock { display: flex; gap: var(--eu-space-sm); align-items: flex-start; background: var(--eu-parchment); margin: var(--eu-space-md) var(--eu-space-lg) 0; padding: var(--eu-space-md); border-radius: var(--eu-r-md); font-size: var(--eu-fs-caption); }
.eu-drawer__lock .eu-i { color: var(--eu-primary); font-size: 18px; margin-top: 2px; }
.eu-drawer__lock b span { color: var(--eu-primary); }
.eu-drawer__totals { padding: var(--eu-space-lg); }
.eu-drawer__totals .eu-promo { display: flex; gap: var(--eu-space-xs); margin: var(--eu-space-md) 0;
  background: none; min-height: 0; border-radius: 0; padding: 0; place-items: stretch; text-align: left; }
.eu-drawer__totals .eu-promo input { flex: 1; border: 1px solid var(--eu-hairline); border-radius: var(--eu-r-md); background: var(--eu-parchment); padding: 10px 14px; font-size: var(--eu-fs-caption); color: var(--eu-ink); }
.eu-btn-dark { background: var(--eu-ink); color: var(--eu-canvas); border: 0; border-radius: var(--eu-r-md); padding: 10px 18px; font-size: var(--eu-fs-caption); font-weight: 600; cursor: pointer; }
.eu-drawer__totals .btn-primary { margin-top: var(--eu-space-sm); display: inline-flex; align-items: center; justify-content: center; gap: 8px; }
.eu-drawer__cartlink { display: block; text-align: center; margin-top: var(--eu-space-sm); font-size: var(--eu-fs-caption); font-weight: 600; color: var(--eu-ink-80); text-decoration: underline; }
.eu-drawer__cartlink:hover { color: var(--eu-primary); }
/* Pagina carrello: prezzo in pillola, a destra, sulla riga di "Rimuovi" */
.product-line__actions { align-items: center; gap: var(--eu-space-md); }
.product-line__price { margin-left: auto; font-weight: 600; font-variant-numeric: tabular-nums;
  background: var(--eu-parchment); border: 1px solid var(--eu-hairline); border-radius: var(--eu-r-pill); padding: 6px 14px; white-space: nowrap; }
.eu-drawer__empty { text-align: center; padding: var(--eu-space-xxl) var(--eu-space-lg); display: flex; flex-direction: column; align-items: center; gap: var(--eu-space-md); }
.eu-drawer__empty p { color: var(--eu-ink-80); margin: 0; }
.eu-drawer__trust { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--eu-space-xs); padding: var(--eu-space-lg); border-top: 1px solid var(--eu-divider-soft); margin-top: auto; text-align: center; }
.eu-drawer__trust span { display: flex; flex-direction: column; align-items: center; gap: 6px; font-size: 11px; color: var(--eu-ink-48); }
.eu-drawer__trust .eu-i { font-size: 20px; color: var(--eu-primary); }

/* =============================================================================
   PAYMENT CHIPS
   ========================================================================== */
.eu-pay { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.eu-pay--center { justify-content: center; padding: 0 var(--eu-space-lg) var(--eu-space-lg); }
.eu-pay__chip { height: 26px; min-width: 40px; padding: 0 8px; border-radius: 5px; background: var(--eu-canvas);
  border: 1px solid var(--eu-hairline); display: inline-flex; align-items: center; justify-content: center;
  font-size: 11px; font-weight: 800; letter-spacing: -0.02em; color: var(--eu-ink); }
.eu-pay__chip--visa { color: #1a1f71; }
.eu-pay__chip--amex { color: #2e77bb; }
.eu-pay__chip--apple { color: var(--eu-ink); font-weight: 600; }
.eu-pay__chip--apple::before { content: ""; }
.eu-pay__chip--gpay { color: #5f6368; }
.eu-pay__chip--nexi { color: #fff; background: #1b5fa8; border-color: #1b5fa8; }
.eu-pay__chip--mc { gap: 0; }
.eu-pay__chip--mc i { width: 13px; height: 13px; border-radius: 50%; display: inline-block; }
.eu-pay__chip--mc i:first-child { background: #eb001b; }
.eu-pay__chip--mc i:last-child { background: #f79e1b; margin-left: -5px; mix-blend-mode: multiply; }
html[data-eu-theme="dark"] .eu-pay__chip--apple { color: #fff; }

/* =============================================================================
   FOOTER
   ========================================================================== */
/* One flat footer: wrapper carries the single bg; newsletter + footer blend in */
#footer, .eu-footer { background: var(--eu-canvas); }
.eu-footer { border-top: 0; }
#footer .footer__before,
#footer .ps-emailsubscription,
#footer .ps-emailsubscription.bg-body-tertiary { background-color: transparent !important; background-image: none !important; }
.eu-footer__inner { max-width: 1440px; margin-inline: auto; padding: var(--eu-section) var(--eu-space-lg) var(--eu-space-xxl); }
.eu-footer__cols { display: grid; grid-template-columns: 1.6fr repeat(4, 1fr); gap: var(--eu-space-xl); }
.eu-footer__logo { display: inline-flex; align-items: center; }
.eu-footer__logo .eu-logo { height: 26px; width: auto; color: var(--eu-ink); fill: currentColor; }
.eu-footer__logo .eu-logo--img { height: 43px; max-width: 280px; object-fit: contain; }
.eu-footer__brand p { margin-top: var(--eu-space-md); font-size: var(--eu-fs-caption); color: var(--eu-ink-48); line-height: 1.6; max-width: 32ch; }
.eu-greennum { display: block; width: 210px; max-width: 100%; height: auto; margin-top: var(--eu-space-lg); color: #36a635; }
.eu-footer__social { display: flex; gap: var(--eu-space-sm); margin-top: var(--eu-space-lg); }
.eu-footer__social a { width: 36px; height: 36px; border-radius: 50%; display: grid; place-items: center;
  border: 1px solid var(--eu-hairline); color: var(--eu-ink-80); transition: color .2s ease, border-color .2s ease; }
.eu-footer__social a:hover { color: var(--eu-primary); border-color: var(--eu-primary); }
.eu-footer__social .eu-i { font-size: 17px; }
.eu-footer__col { display: flex; flex-direction: column; }
.eu-footer__col h3 { font-size: var(--eu-fs-caption); font-weight: 600; color: var(--eu-ink); margin: 0 0 var(--eu-space-md); }
.eu-footer__col-body { display: flex; flex-direction: column; }
.eu-footer__col a { font-size: var(--eu-fs-caption); color: var(--eu-ink-80); padding: 7px 0; }
.eu-footer__col a:hover { color: var(--eu-primary); }
.eu-footer__legal { display: flex; align-items: center; justify-content: space-between; gap: var(--eu-space-lg); flex-wrap: wrap;
  margin-top: var(--eu-space-xxl); padding-top: var(--eu-space-lg); border-top: 1px solid var(--eu-divider-soft); }
.eu-footer__copy { font-size: var(--eu-fs-fine); color: var(--eu-ink-48); margin: 0; }
.eu-footer__legal-links { display: flex; gap: var(--eu-space-lg); margin-inline: auto; }
.eu-footer__legal-links a { font-size: var(--eu-fs-fine); color: var(--eu-ink-80); }
.eu-footer__legal-links a:hover { color: var(--eu-primary); }
@media (max-width: 991px) {
  .eu-footer__cols { grid-template-columns: 1fr 1fr; gap: var(--eu-space-lg); }
  .eu-footer__brand { grid-column: 1 / -1; }
  .eu-footer__legal { flex-direction: column; align-items: flex-start; }
  .eu-footer__legal-links { margin-inline: 0; flex-wrap: wrap; }
}
@media (max-width: 560px) {
  .eu-footer__cols { grid-template-columns: 1fr; }
  .eu-drawer__panel { width: 100%; }
}
/* Footer: da mobile le colonne (non il blocco logo) diventano accordion */
@media (max-width: 767px) {
  .eu-footer__cols { grid-template-columns: 1fr; gap: 0; }
  .eu-footer__brand { margin-bottom: var(--eu-space-lg); }
  .eu-footer__col { border-top: 1px solid var(--eu-divider-soft); }
  .eu-footer__col h3 { display: flex; align-items: center; justify-content: space-between; cursor: pointer; margin: 0; padding: var(--eu-space-md) 0; user-select: none; }
  .eu-footer__col h3::after { content: ""; width: 9px; height: 9px; border-right: 2px solid var(--eu-ink-48); border-bottom: 2px solid var(--eu-ink-48); transform: translateY(-2px) rotate(45deg); transition: transform 0.3s ease; }
  .eu-footer__col.is-open h3::after { transform: translateY(2px) rotate(-135deg); }
  .eu-footer__col-body { display: none; padding-bottom: var(--eu-space-md); }
  .eu-footer__col.is-open .eu-footer__col-body { display: flex; }
}

/* Small-phone header — keep the nav row within the viewport (no h-scroll) */
@media (max-width: 480px) {
  .eu-nav__inner { gap: var(--eu-space-xs); padding: var(--eu-space-sm) var(--eu-space-md); }
  .eu-nav__utils { gap: 2px; }
  .eu-util-btn { padding: 3px; }
  .eu-util-btn .eu-i { font-size: 18px; }
  .eu-logo { height: 16px; }
  .eu-logo--img { height: 38px; }
  .eu-ticker__inner { gap: var(--eu-space-md); font-size: var(--eu-fs-fine); }
  .eu-announce__inner { font-size: var(--eu-fs-fine); }
}

/* Animations */
@keyframes eu-fade { from { opacity: 0; } to { opacity: 1; } }
@keyframes eu-slide-down { from { transform: translateY(-12px); opacity: 0; } to { transform: translateY(0); opacity: 1; } }
@keyframes eu-slide-left { from { transform: translateX(20px); } to { transform: translateX(0); } }

/* =============================================================================
   PRODUCT PAGE
   ========================================================================== */
/* Gallery cover — rest the product on a surface with the single system shadow */
.product__images img,
.product-cover img,
.js-qv-product-cover img { border-radius: var(--eu-r-lg); }
.product__images .product-cover,
.product__images .js-images-container { border-radius: var(--eu-r-lg); overflow: hidden; }
.eu-img-note { margin: var(--eu-space-md) 0 0; text-align: center; font-size: var(--eu-fs-fine); color: var(--eu-ink-48); }

/* Flags / badges */
.product-flags { display: flex; gap: var(--eu-space-xs); flex-wrap: wrap; }
.product-flags .badge {
  border-radius: var(--eu-r-pill); font-size: 11px; font-weight: 600;
  letter-spacing: 0.05em; text-transform: uppercase; padding: 6px 14px; line-height: 1;
}
.product-flags .badge.new { background: var(--eu-primary); color: #fff; }
.product-flags .badge.discount,
.product-flags .badge.on-sale { background: var(--eu-ink); color: var(--eu-canvas); }
.product-flags .badge.out_of_stock { background: var(--eu-canvas); color: var(--eu-ink-80); border: 1px solid var(--eu-hairline); }

/* Prices */
.product__prices { margin-block: var(--eu-space-md); }
.product__prices .current-price,
.product__prices .current-price-value,
.product__prices .price {
  font-family: var(--eu-font-display); font-size: var(--eu-fs-dlg); font-weight: 600;
  color: var(--eu-ink); letter-spacing: -0.02em;
}
.product__prices .regular-price { color: var(--eu-ink-48); text-decoration: line-through; font-size: var(--eu-fs-body); }
.product__prices .tax-shipping-delivery-label,
.product__prices small { color: var(--eu-ink-48); font-size: var(--eu-fs-caption); }

/* Availability badge -> small pill, black text + border */
.product__availability-status {
  display: inline-flex; align-items: center; gap: 6px;
  border: 0 solid #121212; padding: 4px 0;
  font-size: 13px; color: #121212 !important;
}
.product__availability-status .product__availability-icon { font-size: 15px; color: #121212 !important; }
.product__availability-status span { color: #121212 !important; }

/* Add to cart — force the brand gold (beats Hummingbird's blue) */
.product__add-to-cart-button,
.product__add-to-cart-button.btn-primary {
  --bs-btn-bg: var(--eu-primary); --bs-btn-hover-bg: var(--eu-primary-focus);
  --bs-btn-active-bg: var(--eu-primary-focus); --bs-btn-border-color: var(--eu-primary);
  --bs-btn-hover-border-color: var(--eu-primary-focus);
  background-color: var(--eu-primary) !important; border-color: var(--eu-primary) !important;
  color: #fff !important; border-radius: var(--eu-r-pill);
}
.product__add-to-cart-button:hover { background-color: var(--eu-primary-focus) !important; }
.product__add-to-cart-button:disabled,
.product__add-to-cart-button[disabled] { background-color: var(--eu-hairline) !important; border-color: var(--eu-hairline) !important; color: var(--eu-ink-48) !important; }

/* Quantity stepper — soft-rounded, hairline */
.product-quantity .input-group,
.product__actions-qty-add .input-group { gap: 5px; }
.product-quantity .btn-square-icon,
.product__actions-qty-add .input-group .btn {
  border-radius: 30% !important; border: 1px solid var(--eu-hairline); background: var(--eu-canvas); color: var(--eu-ink);
}
.product-quantity .input-group input,
.product__actions-qty-add input { border: 1px solid var(--eu-hairline); border-radius: var(--eu-r-md); text-align: center; font-weight: 600; }

/* Description / data sheet */
.product__description-short, .product-description { font-size: var(--eu-fs-body); line-height: 1.6; color: var(--eu-ink-80); }
/* Il cliente inserisce i testi in MAIUSCOLO: li forziamo in minuscolo, con la
   prima lettera di ogni paragrafo maiuscola per restare leggibili. */
.product__description-short p { text-transform: lowercase; }
.product__description-short p::first-letter { text-transform: uppercase; }
.product-information .h3, .product__description .h3 { font-family: var(--eu-font-display); }

/* Reassurance block (product) */
.blockreassurance--product { border-top: 1px solid var(--eu-divider-soft); padding-top: var(--eu-space-lg); }
.blockreassurance--product .block-title { font-weight: 600; color: var(--eu-ink); font-size: var(--eu-fs-caption); }
.blockreassurance--product .block-icon svg [fill],
.blockreassurance--product .block-icon svg path { fill: var(--eu-primary); }

/* Product layout — 2/5 gallery (sticky) · 3/5 info (airy) */
.product__container {
  display: grid; grid-template-columns: 2fr 3fr; gap: var(--eu-space-xxl); align-items: start;
}
/* Sticky sotto l'header reale (--eu-nav-h da JS): vale sia per l'header A (1 riga)
   sia per l'header B (logo + menu su riga separata, più alto). */
.product__left { position: sticky; top: calc(var(--eu-nav-h, 88px) + 20px); }
.product__right { padding: 10%; }
@media (max-width: 991px) {
  .product__container { grid-template-columns: 1fr; gap: var(--eu-space-xl); }
  .product__left { position: static; }
  .product__right { padding: 20px; }
}

/* Gallery — thumbnails position (admin: bottom | left) */
.product__images[data-gallery-thumbs="left"] {
  display: flex; flex-direction: row-reverse; align-items: flex-start; gap: var(--eu-space-md);
}
.product__images[data-gallery-thumbs="left"] .product__carousel { flex: 1; min-width: 0; }
.product__images[data-gallery-thumbs="left"] .product__thumbnails { flex: none; width: 88px; }
.product__images[data-gallery-thumbs="left"] .product__thumbnails-list { flex-direction: column; gap: var(--eu-space-xs); }

/* Gallery layout — stacked (all images one under another).
   Bootstrap dà ai .carousel-item float:left + margin-right:-100% per sovrapporli:
   va annullato, altrimenti restano impilati e si vede solo l'ultima. */
.product__images[data-gallery="stacked"] .carousel-inner { display: block; }
.product__images[data-gallery="stacked"] .carousel-item { display: block !important; float: none; margin-right: 0; margin-bottom: var(--eu-space-md); }
.product__images[data-gallery="stacked"] .product__thumbnails,
.product__images[data-gallery="stacked"] .carousel-control-prev,
.product__images[data-gallery="stacked"] .carousel-control-next { display: none !important; }

/* Gallery layout — featured (first big, the rest in a 2-col grid) */
.product__images[data-gallery="featured"] .carousel-inner { display: grid; grid-template-columns: 1fr 1fr; gap: var(--eu-space-md); }
.product__images[data-gallery="featured"] .carousel-item { display: block !important; float: none; margin-right: 0; }
.product__images[data-gallery="featured"] .carousel-item:first-child { grid-column: 1 / -1; }
.product__images[data-gallery="featured"] .product__thumbnails,
.product__images[data-gallery="featured"] .carousel-control-prev,
.product__images[data-gallery="featured"] .carousel-control-next { display: none !important; }

/* Mobile: galleria = slider orizzontale, una foto per volta (swipe nativo scroll-snap).
   Sovrascrive featured/stacked così non si impilano più. */
@media (max-width: 767px) {
  .product__images .carousel-inner {
    display: flex !important; grid-template-columns: none !important; gap: 0 !important;
    overflow-x: auto; scroll-snap-type: x mandatory; scroll-behavior: smooth;
    -webkit-overflow-scrolling: touch; scrollbar-width: none;
  }
  .product__images .carousel-inner::-webkit-scrollbar { display: none; }
  .product__images .carousel-item {
    display: block !important; float: none !important; margin: 0 !important;
    flex: 0 0 100% !important; width: 100% !important; max-width: 100%;
    scroll-snap-align: center; grid-column: auto !important;
  }
  .product__images .carousel-item img { width: 100%; }
}

/* Minimal lightbox — full photo, clean white round controls, no shadows */
.product-images-modal.modal { opacity: 1 !important; z-index: 1060; }   /* was stuck at opacity:0 */
.product-images-modal .modal-dialog { max-width: 100%; margin: 0; min-height: 100vh; }
.product-images-modal .modal-content { background: transparent; border: 0; box-shadow: none; }
.product-images-modal .modal-header { position: fixed; top: var(--eu-space-lg); right: var(--eu-space-lg); z-index: 5; border: 0; padding: 0; }
.product-images-modal .btn-close {
  width: 44px; height: 44px; border-radius: 50%; opacity: 1; margin: 0; box-shadow: none;
  background-color: var(--eu-parchment); border: 1px solid var(--eu-hairline);
}
.product-images-modal .btn-close:hover { border-color: var(--eu-primary); }
.product-images-modal .modal-body { padding: 0; }
.product-images-modal .carousel,
.product-images-modal .carousel-inner,
.product-images-modal .carousel-item { height: 100vh; }
.product-images-modal .carousel-item { align-items: center; justify-content: center; }
.product-images-modal .carousel-item.active,
.product-images-modal .carousel-item-next,
.product-images-modal .carousel-item-prev { display: flex; }
.product-images-modal .carousel-item img { width: auto; height: auto; max-width: 94vw; max-height: 94vh; margin: 0; border-radius: 0; }

/* Arrows like the carousel arrows: round, white, hairline, no shadow/black */
.product-images-modal .carousel-control-prev,
.product-images-modal .carousel-control-next {
  width: 48px; height: 48px; top: 50%; bottom: auto; transform: translateY(-50%);
  border-radius: 50% !important; background: var(--eu-parchment) !important;
  border: 1px solid var(--eu-hairline) !important; opacity: 1 !important; box-shadow: none !important;
}
.product-images-modal .carousel-control-prev:hover,
.product-images-modal .carousel-control-next:hover { border-color: var(--eu-primary) !important; }
.product-images-modal .carousel-control-prev { left: var(--eu-space-lg); }
.product-images-modal .carousel-control-next { right: var(--eu-space-lg); }
.product-images-modal .carousel-control-prev-icon,
.product-images-modal .carousel-control-next-icon {
  width: 22px; height: 22px; filter: none; background-color: transparent !important; border: 0 !important;
  box-shadow: none !important; background-size: 20px 20px; background-position: center; background-repeat: no-repeat;
}
.product-images-modal .carousel-control-prev-icon {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231d1d1f' stroke-width='2.25' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='15 18 9 12 15 6'/%3E%3C/svg%3E") !important;
}
.product-images-modal .carousel-control-next-icon {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231d1d1f' stroke-width='2.25' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='9 18 15 12 9 6'/%3E%3C/svg%3E") !important;
}

.modal-backdrop.show { background: var(--eu-canvas); opacity: 1; }

/* Floating zoom lens — follows the cursor over the cover, click opens the lightbox */
@media (hover: hover) {
  .product__carousel { cursor: zoom-in; }
  .product__carousel .product__zoom { display: none; } /* replaced by the lens */
}
.eu-zoom-lens {
  position: absolute; z-index: 4; width: 46px; height: 46px; border-radius: 50%;
  background: var(--eu-chip); color: var(--eu-ink); display: grid; place-items: center;
  transform: translate(-50%, -50%); pointer-events: none; opacity: 0;
  transition: opacity 0.15s ease; box-shadow: 0 2px 12px rgba(0, 0, 0, 0.18);
  backdrop-filter: blur(3px);
}
.product__carousel.eu-zoom-on .eu-zoom-lens { opacity: 1; }
.eu-zoom-lens .eu-i { font-size: 22px; }

/* Sticky add-to-cart bar — appears when the main add-to-cart scrolls out of view */
.eu-buybar {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 1040;
  background: var(--eu-canvas); border-top: 1px solid var(--eu-hairline);
  box-shadow: 0 -6px 24px rgba(0, 0, 0, 0.08);
  transform: translateY(100%); transition: transform 0.3s ease;
}
.eu-buybar.is-visible { transform: translateY(0); }
.eu-buybar__inner { max-width: 1440px; margin-inline: auto; display: flex; align-items: center; gap: var(--eu-space-md); padding: 10px var(--eu-space-lg); }
.eu-buybar__img { width: 44px; height: 44px; flex: none; border-radius: var(--eu-r-sm); object-fit: contain; background: var(--eu-parchment); border: 1px solid var(--eu-hairline); }
.eu-buybar__info { display: flex; flex-direction: column; line-height: 1.25; min-width: 0; }
.eu-buybar__btn { margin-left: auto; }
.eu-buybar__name { font-weight: 600; color: var(--eu-ink); font-size: var(--eu-fs-caption); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.eu-buybar__price { font-family: var(--eu-font-display); font-size: var(--eu-fs-tagline); font-weight: 600; color: var(--eu-ink); }
.eu-buybar__btn { display: inline-flex; align-items: center; gap: 8px; flex: none; border-radius: var(--eu-r-pill); }
.eu-buybar__btn:disabled, .eu-buybar__btn[disabled] { background: var(--eu-hairline) !important; border-color: var(--eu-hairline) !important; color: var(--eu-ink-48) !important; }
@media (max-width: 560px) { .eu-buybar__btn span { display: none; } .eu-buybar__inner { padding: 10px var(--eu-space-md); } }

/* Personalizza il prodotto — accessories (static; module-managed later) */
.eu-acc { margin-block: var(--eu-space-xl); }
.eu-acc__title { font-family: var(--eu-font-display); font-size: var(--eu-fs-dmd); font-weight: 600; letter-spacing: -0.02em; color: var(--eu-ink); margin: 0; }
.eu-acc__sub { color: var(--eu-ink-48); font-size: var(--eu-fs-caption); margin: var(--eu-space-xs) 0 var(--eu-space-md); }
.eu-acc__list { list-style: none; padding: 0; margin: 0; }

/* Clean list row (no card box). Controls (Aggiungi + expand arrow) float
   absolute top-right so they don't add a row/empty space. */
.eu-acc__item {
  position: relative;
  padding: var(--eu-space-lg) var(--eu-space-sm);
  padding-right: 168px; /* reserve room for the floating controls */
  cursor: pointer; /* whole row toggles the accordion */
  border-bottom: 1px solid var(--eu-divider-soft);
  border-radius: var(--eu-r-md);
  transition: background 0.2s ease;
}
.eu-acc__item:last-child { border-bottom: 0; }
.eu-acc__item.is-selected { background: rgba(var(--eu-primary-rgb), 0.06); }

.eu-acc__row { display: flex; gap: var(--eu-space-md); align-items: flex-start; }
.eu-acc__thumb {
  width: 64px; height: 64px; flex: none; border-radius: var(--eu-r-md); background: var(--eu-tile-1);
  transition: width 0.3s ease, height 0.3s ease, opacity 0.2s ease, margin 0.3s ease;
}
.eu-acc__thumb img { width: 64px; height: auto; border-radius: inherit; display: block; }
.eu-acc__item.is-open .eu-acc__thumb { width: 0; height: 0; opacity: 0; margin-right: calc(-1 * var(--eu-space-md)); }

.eu-acc__body { flex: 1; min-width: 0; }
.eu-acc__name { font-size: var(--eu-fs-body); font-weight: 600; color: var(--eu-ink); display: flex; align-items: center; gap: var(--eu-space-xs); flex-wrap: wrap; }
.eu-acc__price { font-size: 11px; font-weight: 600; letter-spacing: 0.05em; text-transform: uppercase; border-radius: var(--eu-r-pill); padding: 4px 12px; border: 1px solid var(--eu-hairline); color: var(--eu-ink-80); }
.eu-acc__price--free { background: var(--eu-primary); color: #fff; border-color: var(--eu-primary); }
.eu-acc__desc { font-size: var(--eu-fs-caption); color: var(--eu-ink-48); margin: 8px 0 0; line-height: 1.55; }

/* Open: detail block below — big photo left, long text right (animated) */
.eu-acc__detail {
  display: grid; grid-template-columns: 132px 1fr; gap: var(--eu-space-md); align-items: center;
  max-height: 0; opacity: 0; overflow: hidden;
  transition: max-height 0.32s ease, opacity 0.25s ease, margin-top 0.25s ease;
}
.eu-acc__detail-img { border-radius: var(--eu-r-md); background: var(--eu-tile-1); overflow: hidden; }
.eu-acc__detail-img img { width: 100%; height: auto; border-radius: inherit; display: block; }
.eu-acc__detail p { font-size: var(--eu-fs-caption); color: var(--eu-ink-48); line-height: 1.55; margin: 0; }
/* Open: the detail sits below the floating controls, so it can ignore the
   168px right reservation and run full width (only the normal side padding). */
.eu-acc__item.is-open .eu-acc__detail {
  max-height: 320px; opacity: 1; margin-top: var(--eu-space-md);
  margin-right: calc(var(--eu-space-sm) - 168px);
}

/* Floating controls (top-right): Aggiungi + expand arrow (rightmost) */
.eu-acc__controls { position: absolute; top: var(--eu-space-lg); right: var(--eu-space-sm); display: flex; align-items: center; gap: var(--eu-space-xs); }
.eu-acc__toggle {
  display: inline-flex; align-items: center; gap: 6px;
  border: 1px solid var(--eu-ink); background: var(--eu-canvas); color: var(--eu-ink);
  border-radius: var(--eu-r-pill); padding: 7px 16px; font-size: var(--eu-fs-caption); font-weight: 500; cursor: pointer;
  white-space: nowrap; transition: background 0.15s, border-color 0.15s, color 0.15s;
}
.eu-acc__toggle:hover { border-color: var(--eu-primary); }
.eu-acc__toggle .eu-i { font-size: 16px; }
.eu-acc__item.is-selected .eu-acc__toggle { background: var(--eu-primary); border-color: var(--eu-primary); color: #fff; }
.eu-acc__expand {
  position: relative;
  width: 34px; height: 34px; flex: none; border: 0; background: none; color: var(--eu-ink-48); cursor: pointer;
  display: grid; place-items: center;
}
.eu-acc__expand:hover { color: var(--eu-primary); }
/* Tooltip "Più dettagli" — follows the cursor (positioned by euronummus.js) */
.eu-acc-tip {
  position: fixed; z-index: 2000; pointer-events: none; white-space: nowrap;
  font-size: 11px; color: #fff; background: #121212;
  border: 0; border-radius: 50px; padding: 3px 6px;
  opacity: 0; transform: translate(14px, 12px); transition: opacity 0.12s ease;
}
.eu-acc-tip.is-on { opacity: 1; }
/* Il tooltip "Più dettagli" segue il cursore: inutile su touch/mobile */
@media (hover: none), (max-width: 767px) { .eu-acc-tip { display: none !important; } }

/* Toast notifica (es. "Aggiunto al carrello") */
.eu-toast {
  position: fixed; left: 50%; bottom: 28px; transform: translate(-50%, 20px);
  display: inline-flex; align-items: center; gap: 10px; z-index: 3000;
  background: var(--eu-ink); color: #fff; padding: 12px 20px; border-radius: var(--eu-r-pill);
  box-shadow: 0 12px 40px rgba(0,0,0,0.28); font-size: 14px; font-weight: 500;
  opacity: 0; pointer-events: none; transition: opacity 0.3s ease, transform 0.3s ease;
}
.eu-toast.is-on { opacity: 1; transform: translate(-50%, 0); }
.eu-toast .eu-i { font-size: 18px; color: var(--eu-primary); }

/* "Rivendi questo prodotto" — barra + bottone + modale form */
.eu-resell-bar { display: flex; justify-content: flex-end; margin: 0 0 var(--eu-space-md); }
.eu-resell-btn { display: inline-flex; align-items: center; gap: 8px; border: 1px solid var(--eu-ink); background: transparent; color: var(--eu-ink); border-radius: var(--eu-r-pill); padding: 8px 16px; font-size: var(--eu-fs-caption); font-weight: 600; cursor: pointer; transition: background 0.15s ease, color 0.15s ease; }
.eu-resell-btn:hover { background: var(--eu-ink); color: var(--eu-canvas); }
.eu-resell-btn .eu-i { font-size: 16px; }
.eu-rmodal { position: fixed; inset: 0; z-index: 3200; display: grid; place-items: center; padding: var(--eu-space-lg); }
.eu-rmodal[hidden] { display: none; }
.eu-rmodal__backdrop { position: absolute; inset: 0; background: rgba(0,0,0,0.45); opacity: 0; transition: opacity 0.3s ease; }
.eu-rmodal.is-on .eu-rmodal__backdrop { opacity: 1; }
.eu-rmodal__dialog { position: relative; background: var(--eu-canvas); border-radius: var(--eu-r-lg); width: min(520px, 100%); max-height: 90vh; overflow-y: auto;
  padding: var(--eu-space-xl); box-shadow: 0 30px 80px rgba(0,0,0,0.28); opacity: 0; transform: translateY(14px) scale(0.98); transition: opacity 0.3s ease, transform 0.3s ease; }
.eu-rmodal.is-on .eu-rmodal__dialog { opacity: 1; transform: none; }
.eu-rmodal__close { position: absolute; top: 14px; right: 14px; background: none; border: 0; color: var(--eu-ink-48); cursor: pointer; padding: 4px; line-height: 0; }
.eu-rmodal__close:hover { color: var(--eu-ink); }
.eu-rmodal__close .eu-i { font-size: 22px; }
.eu-rmodal__title { font-family: var(--eu-font-display); font-size: clamp(1.2rem, 2.2vw, 1.5rem); margin: 0 0 var(--eu-space-sm); padding-right: 28px; }
.eu-rmodal__intro { color: var(--eu-ink-80); font-size: var(--eu-fs-caption); line-height: 1.55; margin: 0 0 var(--eu-space-lg); }
.eu-rmodal__intro a { color: var(--eu-primary); font-weight: 600; }
.eu-rmodal__form { display: flex; flex-direction: column; gap: var(--eu-space-sm); }
.eu-rmodal__form input, .eu-rmodal__form textarea { border: 1px solid var(--eu-hairline); border-radius: var(--eu-r-md); background: var(--eu-canvas); padding: 11px 14px; font-size: var(--eu-fs-caption); color: var(--eu-ink); font-family: inherit; }
.eu-rmodal__form input:focus, .eu-rmodal__form textarea:focus { border-color: var(--eu-primary); outline: none; }
.eu-rmodal__send { margin-top: var(--eu-space-xs); }
.eu-rmodal__feedback { margin: var(--eu-space-xs) 0 0; font-size: var(--eu-fs-caption); }
.eu-rmodal__feedback.is-ok { color: #1a9e5f; }
.eu-rmodal__feedback.is-err { color: #d23b3b; }
.eu-rmodal__campaign { display: block; text-align: center; margin-top: var(--eu-space-lg); padding-top: var(--eu-space-md); border-top: 1px solid var(--eu-divider-soft); color: var(--eu-primary); font-weight: 600; font-size: var(--eu-fs-caption); }
.eu-rmodal__campaign:hover { text-decoration: underline; }

/* Modale "Prodotto aggiunto al carrello" (centrale) */
.eu-cartmodal { position: fixed; inset: 0; z-index: 3200; display: grid; place-items: center; padding: var(--eu-space-lg); }
.eu-cartmodal[hidden] { display: none; }
.eu-cartmodal__backdrop { position: absolute; inset: 0; background: rgba(0,0,0,0.45); opacity: 0; transition: opacity 0.3s ease; }
.eu-cartmodal.is-on .eu-cartmodal__backdrop { opacity: 1; }
.eu-cartmodal__dialog { position: relative; background: var(--eu-canvas); border-radius: var(--eu-r-lg); width: min(880px, 100%); max-height: 90vh; overflow-y: auto;
  box-shadow: 0 30px 80px rgba(0,0,0,0.28); opacity: 0; transform: translateY(14px) scale(0.98); transition: opacity 0.3s ease, transform 0.3s ease; }
.eu-cartmodal.is-on .eu-cartmodal__dialog { opacity: 1; transform: none; }
.eu-cartmodal__close { position: absolute; top: 16px; right: 16px; background: none; border: 0; color: var(--eu-ink-48); cursor: pointer; padding: 4px; line-height: 0; }
.eu-cartmodal__close .eu-i { font-size: 22px; }
.eu-cartmodal__close:hover { color: var(--eu-ink); }
.eu-cartmodal__head { display: flex; align-items: center; gap: 12px; padding: var(--eu-space-lg) var(--eu-space-xl); border-bottom: 1px solid var(--eu-divider-soft); }
.eu-cartmodal__check { font-size: 24px; color: var(--eu-ink); }
.eu-cartmodal__title { font-family: var(--eu-font-display); font-size: clamp(1.3rem, 2.4vw, 1.7rem); margin: 0; }
.eu-cartmodal__body { display: grid; grid-template-columns: 1fr 1fr; gap: var(--eu-space-xl); padding: var(--eu-space-xl); }
.eu-cartmodal__product { display: flex; gap: var(--eu-space-md); align-items: center; }
.eu-cartmodal__thumb { flex: 0 0 96px; }
.eu-cartmodal__thumb img { width: 96px; height: 96px; object-fit: contain; display: block; }
.eu-cartmodal__pname { font-weight: 600; margin: 0 0 6px; line-height: 1.3; }
.eu-cartmodal__pqty { color: var(--eu-ink-80); margin: 0; }
.eu-cartmodal__count { color: var(--eu-ink-80); margin: 0 0 8px; }
.eu-cartmodal__total { margin: 0 0 var(--eu-space-md); font-size: 1.05rem; }
.eu-cartmodal__checkout, .eu-cartmodal__cart { width: 100%; margin-bottom: 10px; }
.eu-cartmodal__continue { width: 100%; padding: 12px; border: 0; background: var(--eu-divider-soft); border-radius: var(--eu-r-pill); color: var(--eu-ink); font-weight: 600; cursor: pointer; transition: background 0.15s ease; }
.eu-cartmodal__continue:hover { background: var(--eu-hairline); }
.eu-cartmodal__cross { padding: 0 var(--eu-space-xl) var(--eu-space-xl); border-top: 1px solid var(--eu-divider-soft); padding-top: var(--eu-space-lg); }
.eu-cartmodal__cross-title { font-family: var(--eu-font-display); font-size: 1.1rem; margin: 0 0 var(--eu-space-md); }
.eu-cartmodal__cross-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--eu-space-md); }
.eu-cm-rec { display: flex; flex-direction: column; gap: 4px; padding: var(--eu-space-sm); border: 1px solid var(--eu-hairline); border-radius: var(--eu-r-md); text-decoration: none; transition: border-color .15s ease; }
.eu-cm-rec:hover { border-color: var(--eu-primary); }
.eu-cm-rec__media { display: block; aspect-ratio: 1; background: var(--eu-parchment); border-radius: var(--eu-r-sm); overflow: hidden; }
.eu-cm-rec__media img { width: 100%; height: 100%; object-fit: contain; display: block; }
.eu-cm-rec__name { font-size: var(--eu-fs-caption); font-weight: 600; color: var(--eu-ink); line-height: 1.25;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.eu-cm-rec__price { font-size: var(--eu-fs-caption); font-weight: 600; color: var(--eu-primary); }
@media (max-width: 767px) {
  .eu-cartmodal__body { grid-template-columns: 1fr; gap: var(--eu-space-lg); }
  .eu-cartmodal__cross-grid { grid-template-columns: repeat(2, 1fr); }
}

/* Recensioni (productcomments): nascoste finché non c'è almeno una recensione
   (mostrate da euronummus.js). Evita il flash della sezione vuota. */
.product-comments-wrapper { display: none; }

/* =============================================================================
   CHECKOUT — distraction-free (stile Shopify): solo logo, niente topbar/ticker/
   nav/footer pieno, così l'utente resta concentrato sul completamento ordine.
   ========================================================================== */
body.page-order .eu-announce,
body.page-order .eu-ticker { display: none; }
body.page-order .eu-nav { position: static; border-bottom: 1px solid var(--eu-divider-soft); }
body.page-order .eu-nav__links,
body.page-order .eu-nav__burger,
body.page-order .eu-nav__utils { display: none; }
body.page-order .eu-nav__inner { justify-content: center; padding-block: var(--eu-space-md); }
body.page-order .eu-nav__logo { margin-inline: auto; }
/* Footer ridotto alla sola riga legale + pagamenti */
body.page-order .eu-footer__cols { display: none; }
body.page-order .eu-footer__inner { padding-block: var(--eu-space-xl); }
body.page-order .eu-footer__legal { margin-top: 0; padding-top: 0; border-top: 0; }

/* Blocco rassicurazioni nativo (sostituisce il modulo) — icone minimali */
.eu-reassurance { list-style: none; margin: var(--eu-space-lg) 0 0; padding: 0; display: flex; flex-direction: column; gap: var(--eu-space-md); }
.eu-reassurance__item { display: flex; align-items: center; gap: var(--eu-space-md); }
.eu-reassurance__icon { font-size: 18px; color: var(--eu-primary); flex: none; }
.eu-reassurance__text { display: flex; flex-direction: column; line-height: 1.3; }
.eu-reassurance__title { font-size: var(--eu-fs-caption); font-weight: 600; color: var(--eu-ink); }
.eu-reassurance__sub { font-size: var(--eu-fs-fine); color: var(--eu-ink-48); }

/* =============================================================================
   FORM CLIENTE / CHECKOUT / REGISTRAZIONE — stile Euronummus, più puliti.
   ========================================================================== */
.js-customer-form, .js-address-form { max-width: 580px; }
.js-customer-form .mb-3, .js-address-form .mb-3,
.page-order .mb-3, .page-authentication .mb-3 { margin-bottom: var(--eu-space-lg); }
.js-customer-form .form-label, .js-address-form .form-label,
.page-order .form-label, .page-authentication .form-label {
  font-size: var(--eu-fs-caption); font-weight: 600; color: var(--eu-ink); margin-bottom: 6px;
}
.js-customer-form .form-label.required::after, .js-address-form .form-label.required::after,
.page-order .form-label.required::after { content: " *"; color: var(--eu-primary); }
.js-customer-form .form-control, .js-address-form .form-control, .js-customer-form .form-select,
.js-address-form .form-select, .page-order .form-control, .page-order .form-select,
.page-authentication .form-control {
  border: 1px solid var(--eu-hairline); border-radius: var(--eu-r-md); background: var(--eu-canvas);
  color: var(--eu-ink); padding: 12px 14px; font-size: var(--eu-fs-body); height: auto; box-shadow: none;
}
.js-customer-form .form-control:focus, .js-address-form .form-control:focus,
.page-order .form-control:focus, .page-authentication .form-control:focus,
.js-customer-form .form-select:focus, .page-order .form-select:focus {
  border-color: var(--eu-primary); box-shadow: 0 0 0 3px rgba(var(--eu-primary-rgb), 0.15); outline: none;
}
.js-customer-form .form-text, .js-address-form .form-text, .page-order .form-text,
.js-customer-form .form-control-comment, .page-authentication .form-text {
  font-size: var(--eu-fs-fine); color: var(--eu-ink-48); margin-top: 4px;
}
.js-customer-form .input-group, .page-order .input-group { border: 0; }
.js-customer-form .input-group .form-control { border-right: 0; border-top-right-radius: 0; border-bottom-right-radius: 0; }
.js-customer-form .input-group .input-group-text, .js-customer-form .input-group button {
  border: 1px solid var(--eu-hairline); border-left: 0; border-radius: 0 var(--eu-r-md) var(--eu-r-md) 0; background: var(--eu-canvas); color: var(--eu-ink-48);
}
/* Checkbox / radio (newsletter, GDPR, social title) */
.js-customer-form .form-check, .js-address-form .form-check, .page-order .form-check, .page-authentication .form-check {
  padding-left: 0; display: flex; align-items: flex-start; gap: 10px; margin-bottom: var(--eu-space-sm); min-height: 0;
}
.js-customer-form .form-check-input, .js-address-form .form-check-input,
.page-order .form-check-input, .page-authentication .form-check-input {
  margin: 2px 0 0; float: none; flex: none; border-color: var(--eu-hairline); cursor: pointer;
}
.js-customer-form .form-check-input:checked, .page-order .form-check-input:checked,
.page-authentication .form-check-input:checked { background-color: var(--eu-primary); border-color: var(--eu-primary); }
.js-customer-form .form-check-input:focus, .page-order .form-check-input:focus { box-shadow: 0 0 0 3px rgba(var(--eu-primary-rgb), 0.18); border-color: var(--eu-primary); }
.js-customer-form .form-check-label, .js-address-form .form-check-label,
.page-order .form-check-label, .page-authentication .form-check-label { font-size: var(--eu-fs-caption); color: var(--eu-ink-80); line-height: 1.45; }
/* Bottone submit a tutta larghezza, oro */
.js-customer-form .form-control-submit, .js-address-form [type="submit"] { width: 100%; margin-top: var(--eu-space-sm); }
.js-customer-form .buttons-wrapper { margin-top: var(--eu-space-lg); }
.eu-acc__expand .eu-i { font-size: 20px; transform: rotate(90deg); transition: transform 0.28s ease; }
.eu-acc__item.is-open .eu-acc__expand .eu-i { transform: rotate(-90deg); }

@media (max-width: 560px) {
  /* Da mobile i controlli (Aggiungi + freccia) vanno in flusso, sotto il testo,
     allineati a destra — niente più posizionamento assoluto in alto. */
  .eu-acc__item { padding-right: var(--eu-space-sm); padding-top: var(--eu-space-lg); }
  .eu-acc__controls { position: static; justify-content: flex-end; margin-top: var(--eu-space-md); }
  .eu-acc__detail { grid-template-columns: 96px 1fr; }
  .eu-acc__item.is-open .eu-acc__detail { margin-right: 0; }
}

/* ============================================================ QUOTAZIONE ORO
   Pagina CMS bespoke "Quotazione oro oggi": hero live, calcolatore, tabella,
   grafico, contenuti SEO, FAQ. Tutto scoped sotto .eu-quote.
   ------------------------------------------------------------------------- */
.eu-quote { max-width: 1180px; margin: 0 auto; padding: var(--eu-space-xl) var(--eu-space-lg) var(--eu-section); color: var(--eu-ink); }
.eu-quote section { margin-top: var(--eu-section); }
.eu-quote__h2 { font-family: var(--eu-font-display); font-size: var(--eu-fs-dmd); font-weight: 600; letter-spacing: -0.01em; margin: 0 0 var(--eu-space-xs); }
.eu-quote__sub { color: var(--eu-ink-48); font-size: var(--eu-fs-body); margin: 0 0 var(--eu-space-lg); max-width: 64ch; }
.eu-quote__eyebrow { text-transform: uppercase; letter-spacing: 0.14em; font-size: var(--eu-fs-fine); font-weight: 600; color: var(--eu-primary); margin: 0 0 var(--eu-space-sm); }

/* botton --------------------------------------------------------------- */
.eu-quote .eu-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 14px 26px;
  border-radius: var(--eu-r-pill); font-size: var(--eu-fs-caption); font-weight: 600; letter-spacing: 0.01em;
  text-decoration: none; border: 1px solid transparent; transition: transform .2s ease, background .2s ease, color .2s ease; }
.eu-quote .eu-btn:hover { transform: translateY(-2px); }
.eu-quote .eu-btn--gold { background: var(--eu-primary); color: #fff; }
.eu-quote .eu-btn--gold:hover { background: var(--eu-primary-focus); }
.eu-quote .eu-btn--ghost { background: transparent; color: var(--eu-ink); border-color: var(--eu-ink); }
.eu-quote .eu-btn--ghost:hover { background: var(--eu-ink); color: #fff; }
.eu-quote .eu-btn--ghost-light { background: transparent; color: #fff; border-color: rgba(255,255,255,.5); }
.eu-quote .eu-btn--ghost-light:hover { background: #fff; color: var(--eu-ink); }

/* hero ----------------------------------------------------------------- */
.eu-quote__hero { display: grid; grid-template-columns: 1.15fr .85fr; gap: var(--eu-space-xxl); align-items: center;
  margin-top: var(--eu-space-md); }
.eu-quote__title { font-family: var(--eu-font-display); font-size: var(--eu-fs-hero); font-weight: 600; line-height: 1.04;
  letter-spacing: -0.02em; margin: 0 0 var(--eu-space-md); }
.eu-quote__lede { font-size: var(--eu-fs-lead-airy); line-height: 1.45; color: var(--eu-ink-80); margin: 0 0 var(--eu-space-lg); }
.eu-quote__cta { display: flex; flex-wrap: wrap; gap: var(--eu-space-sm); }
.eu-quote__chart { margin-top: var(--eu-space-xl); }

.eu-quote__card { background: linear-gradient(160deg, #1d1d1f 0%, #2a2a2c 100%); color: #fff; border-radius: var(--eu-r-lg);
  padding: var(--eu-space-xl); box-shadow: var(--eu-shadow-product); }
.eu-quote__card-row { display: flex; align-items: center; justify-content: space-between; }
.eu-quote__metal { font-size: var(--eu-fs-caption); letter-spacing: 0.06em; text-transform: uppercase; color: var(--eu-body-muted); }
.eu-quote__delta { font-size: var(--eu-fs-caption); font-weight: 600; padding: 4px 10px; border-radius: var(--eu-r-pill); }
.eu-quote__delta.is-up { color: #34c759; background: rgba(52,199,89,.12); }
.eu-quote__delta.is-down { color: #ff453a; background: rgba(255,69,58,.12); }
.eu-quote__price { display: flex; align-items: baseline; gap: 8px; margin: var(--eu-space-sm) 0 var(--eu-space-md); }
.eu-quote__price-val { font-family: var(--eu-font-display); font-size: 3.75rem; font-weight: 600; line-height: 1; letter-spacing: -0.02em;
  font-variant-numeric: tabular-nums; }
.eu-quote__price-unit { font-size: var(--eu-fs-lead); color: var(--eu-primary-on-dark); font-weight: 500; }
.eu-quote__card-sub { display: flex; align-items: center; justify-content: space-between; padding-top: var(--eu-space-md);
  border-top: 1px solid rgba(255,255,255,.12); font-size: var(--eu-fs-caption); color: var(--eu-body-muted); }
.eu-quote__silver i { font-style: normal; margin-left: 6px; }
.eu-quote__silver .is-up { color: #34c759; } .eu-quote__silver .is-down { color: #ff453a; }
.eu-quote__updated { margin: var(--eu-space-md) 0 0; font-size: var(--eu-fs-fine); color: #8a8a8e; }

/* value cards ---------------------------------------------------------- */
.eu-quote__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--eu-space-md); }
.eu-vcard { display: flex; flex-direction: column; gap: 6px; padding: var(--eu-space-lg); border: 1px solid var(--eu-hairline);
  border-radius: var(--eu-r-md); text-decoration: none; color: var(--eu-ink); background: var(--eu-canvas);
  transition: border-color .2s ease, transform .2s ease, box-shadow .2s ease; }
.eu-vcard:hover { border-color: var(--eu-primary); transform: translateY(-2px); box-shadow: 0 12px 32px rgba(0,0,0,.06); }
.eu-vcard__label { font-size: var(--eu-fs-caption); color: var(--eu-ink-48); }
.eu-vcard__val { font-family: var(--eu-font-display); font-size: var(--eu-fs-lead); font-weight: 600; font-variant-numeric: tabular-nums; }
.eu-vcard__note { font-size: var(--eu-fs-fine); color: var(--eu-ink-48); }

/* Grafico oro custom (dati BullionVault, SVG server-side) */
.eu-goldchart { margin: 0; border: 1px solid var(--eu-hairline); border-radius: var(--eu-r-lg); padding: var(--eu-space-lg); background: var(--eu-canvas); }
.eu-goldchart__head { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; flex-wrap: wrap; margin-bottom: var(--eu-space-md); }
.eu-goldchart__price { font-family: var(--eu-font-display); font-size: var(--eu-fs-lead); font-weight: 600; color: var(--eu-ink); font-variant-numeric: tabular-nums; }
.eu-goldchart__price small { font-size: 0.5em; color: var(--eu-ink-48); font-weight: 500; }
.eu-goldchart__range { font-size: var(--eu-fs-caption); color: var(--eu-ink-48); }
.eu-goldchart__svg { width: 100%; height: 260px; display: block; }
.eu-goldchart__line { stroke: var(--eu-primary); stroke-width: 2; fill: none; vector-effect: non-scaling-stroke; stroke-linejoin: round; stroke-linecap: round; }
.eu-goldchart__fill { fill: var(--eu-primary); opacity: 0.08; }
.eu-goldchart__foot { display: flex; justify-content: space-between; margin-top: var(--eu-space-sm); font-size: var(--eu-fs-fine); color: var(--eu-ink-48); }
/* delta di periodo (colore per trend) */
.eu-goldchart__delta { font-size: var(--eu-fs-caption); font-weight: 600; margin-left: 8px; font-variant-numeric: tabular-nums; white-space: nowrap; }
.eu-goldchart.is-up .eu-goldchart__delta { color: #2f7d5b; }
.eu-goldchart.is-down .eu-goldchart__delta { color: #c0392b; }
/* selettore periodo */
.eu-goldchart__ranges { display: inline-flex; gap: 4px; }
.eu-goldchart__rbtn { border: 1px solid var(--eu-hairline); background: none; color: var(--eu-ink-80); cursor: pointer;
  font: 500 12px/1 var(--eu-font-text); padding: 7px 13px; border-radius: var(--eu-r-pill); transition: all .15s ease; }
.eu-goldchart__rbtn:hover { border-color: var(--eu-ink); }
.eu-goldchart__rbtn.is-active { background: var(--eu-primary); border-color: var(--eu-primary); color: #fff; }
/* area di plotting (contiene svg + marker + guida + tooltip) */
.eu-goldchart__plot { position: relative; }
.eu-goldchart__markers { position: absolute; inset: 0; pointer-events: none; }
.eu-goldchart__mk { position: absolute; transform: translate(-50%, -50%); }
.eu-goldchart__dot { display: block; width: 9px; height: 9px; border-radius: 50%; background: var(--eu-primary);
  box-shadow: 0 0 0 3px var(--eu-canvas), 0 0 0 4px var(--eu-primary); }
.eu-goldchart__lab { position: absolute; left: 50%; transform: translateX(-50%); white-space: nowrap;
  font: 600 11.5px/1 var(--eu-font-text); font-variant-numeric: tabular-nums; color: var(--eu-ink);
  background: var(--eu-canvas); border: 1px solid var(--eu-hairline); border-radius: 6px; padding: 3px 6px; }
.eu-goldchart__mk.is-max .eu-goldchart__lab { bottom: calc(100% + 7px); }
.eu-goldchart__mk.is-min .eu-goldchart__lab { top: calc(100% + 7px); }
.eu-goldchart__mk.is-last .eu-goldchart__dot { box-shadow: 0 0 0 3px var(--eu-canvas), 0 0 0 4px var(--eu-ink); }
.eu-goldchart__mk.is-last .eu-goldchart__lab { bottom: calc(100% + 7px); left: auto; right: 0; transform: none; color: #fff; background: var(--eu-ink); border-color: var(--eu-ink); }
/* guida verticale + tooltip all'hover */
.eu-goldchart__guide { position: absolute; top: 0; bottom: 0; width: 1px; background: var(--eu-ink); opacity: .28; pointer-events: none; }
.eu-goldchart__tip { position: absolute; top: 6px; z-index: 3; pointer-events: none; background: var(--eu-ink); color: #fff;
  border-radius: 8px; padding: 6px 9px; font-size: 12px; line-height: 1.3; box-shadow: 0 6px 20px rgba(0,0,0,.18); text-align: center; }
.eu-goldchart__tip b { display: block; font-variant-numeric: tabular-nums; }
.eu-goldchart__tip span { display: block; font-size: 10.5px; opacity: .7; margin-top: 1px; }
@media (max-width: 560px) { .eu-goldchart__head { gap: 10px; } .eu-goldchart__ranges { width: 100%; } .eu-goldchart__rbtn { flex: 1; } }

/* calcolatore ---------------------------------------------------------- */
.eu-quote__calc-inner { background: var(--eu-pearl); border: 1px solid var(--eu-hairline); border-radius: var(--eu-r-lg);
  padding: var(--eu-space-xxl); }
.eu-calc { display: grid; grid-template-columns: 1fr 1fr auto; gap: var(--eu-space-lg); align-items: end; }
.eu-calc__field { display: flex; flex-direction: column; gap: 8px; }
.eu-calc__field label { font-size: var(--eu-fs-caption); font-weight: 600; color: var(--eu-ink-80); }
.eu-calc__ig { display: flex; align-items: center; background: var(--eu-canvas); border: 1px solid var(--eu-hairline);
  border-radius: var(--eu-r-sm); overflow: hidden; }
.eu-calc__ig input { border: 0; padding: 13px 14px; font-size: var(--eu-fs-body); width: 100%; background: transparent; color: var(--eu-ink); }
.eu-calc__ig input:focus { outline: none; }
.eu-calc__unit { padding: 0 14px; font-size: var(--eu-fs-caption); color: var(--eu-ink-48); white-space: nowrap; }
.eu-calc__field select { padding: 13px 14px; font-size: var(--eu-fs-body); border: 1px solid var(--eu-hairline);
  border-radius: var(--eu-r-sm); background: var(--eu-canvas); color: var(--eu-ink); }
.eu-calc__field input:focus, .eu-calc__field select:focus, .eu-calc__ig:focus-within { border-color: var(--eu-primary); }
.eu-calc__result { display: flex; flex-direction: column; gap: 6px; padding: 10px var(--eu-space-lg); background: var(--eu-ink);
  color: #fff; border-radius: var(--eu-r-md); min-width: 200px; }
.eu-calc__result-label { font-size: var(--eu-fs-fine); color: var(--eu-body-muted); text-transform: uppercase; letter-spacing: 0.06em; }
.eu-calc__result-val { font-family: var(--eu-font-display); font-size: var(--eu-fs-dmd); font-weight: 600; line-height: 1.1;
  color: var(--eu-primary-on-dark); font-variant-numeric: tabular-nums; }
.eu-quote__fineprint { margin: var(--eu-space-lg) 0 0; font-size: var(--eu-fs-fine); color: var(--eu-ink-48); line-height: 1.5; }
.eu-quote__fineprint a { color: var(--eu-ink-80); }

/* tabella per titolo --------------------------------------------------- */
.eu-quote__table { width: 100%; border-collapse: collapse; font-size: var(--eu-fs-body); }
.eu-quote__table thead th { text-align: left; font-size: var(--eu-fs-caption); font-weight: 600; color: var(--eu-ink-48);
  text-transform: uppercase; letter-spacing: 0.04em; padding: 0 var(--eu-space-md) var(--eu-space-sm); }
.eu-quote__table tbody th, .eu-quote__table tbody td { padding: var(--eu-space-md); border-top: 1px solid var(--eu-hairline);
  text-align: left; font-weight: 400; }
.eu-quote__table tbody th { font-weight: 500; }
.eu-quote__table tbody td:last-child { font-weight: 600; font-variant-numeric: tabular-nums; text-align: right; }
.eu-quote__table thead th:last-child { text-align: right; }

/* grafico -------------------------------------------------------------- */
.eu-quote__chart-frame { position: relative; height: 540px; border: 1px solid var(--eu-hairline); border-radius: var(--eu-r-lg);
  overflow: hidden; background: var(--eu-pearl); display: flex; align-items: center; justify-content: center; }
.eu-quote__chart-iframe { width: 100%; height: 100%; border: 0; display: block; }
.eu-quote__chart-load { background: var(--eu-ink); color: #fff; border: 0; padding: 13px 24px; border-radius: var(--eu-r-pill);
  font-size: var(--eu-fs-caption); font-weight: 600; cursor: pointer; display: inline-flex; gap: 8px; align-items: center; }
.eu-quote__chart-load span { color: var(--eu-primary-on-dark); }

/* contenuti SEO -------------------------------------------------------- */
.eu-quote__rte { display: grid; grid-template-columns: 1.6fr .9fr; gap: var(--eu-space-xxl); align-items: start; }
.eu-quote__rte-col p { font-size: var(--eu-fs-body); line-height: 1.6; color: var(--eu-ink-80); margin: 0 0 var(--eu-space-md); }
.eu-quote__rte-col h3 { font-family: var(--eu-font-display); font-size: var(--eu-fs-tagline); font-weight: 600;
  margin: var(--eu-space-xl) 0 var(--eu-space-xs); }
.eu-quote__panel { background: var(--eu-pearl); border: 1px solid var(--eu-hairline); border-radius: var(--eu-r-lg); padding: var(--eu-space-xl);
  position: sticky; top: calc(var(--eu-nav-h, 64px) + 20px); }
.eu-quote__panel h3 { font-family: var(--eu-font-display); font-size: var(--eu-fs-tagline); font-weight: 600; margin: 0 0 var(--eu-space-sm); }
.eu-quote__panel p { font-size: var(--eu-fs-caption); color: var(--eu-ink-80); line-height: 1.5; margin: 0 0 var(--eu-space-md); }
.eu-quote__links { list-style: none; margin: 0 0 var(--eu-space-md); padding: 0; }
.eu-quote__links li { border-top: 1px solid var(--eu-hairline); }
.eu-quote__links a { display: block; padding: 11px 0; color: var(--eu-ink); text-decoration: none; font-size: var(--eu-fs-caption);
  font-weight: 500; transition: color .15s ease, padding .15s ease; }
.eu-quote__links a:hover { color: var(--eu-primary); padding-left: 6px; }
.eu-quote__panel-phone { font-size: var(--eu-fs-caption); color: var(--eu-ink-48); }
.eu-quote__panel-phone strong { color: var(--eu-primary); font-size: var(--eu-fs-body); }

/* FAQ ------------------------------------------------------------------ */
.eu-faq { max-width: 820px; }
.eu-faq__item { border-bottom: 1px solid var(--eu-hairline); }
.eu-faq__item summary { list-style: none; cursor: pointer; padding: var(--eu-space-lg) var(--eu-space-xl) var(--eu-space-lg) 0;
  font-size: var(--eu-fs-tagline); font-weight: 500; position: relative; }
.eu-faq__item summary::-webkit-details-marker { display: none; }
.eu-faq__item summary::after { content: "+"; position: absolute; right: 0; top: 50%; transform: translateY(-50%);
  font-size: 1.6rem; font-weight: 300; color: var(--eu-primary); transition: transform .2s ease; }
.eu-faq__item[open] summary::after { content: "−"; }
.eu-faq__a { padding: 0 0 var(--eu-space-lg); }
.eu-faq__a p { margin: 0; font-size: var(--eu-fs-body); line-height: 1.6; color: var(--eu-ink-80); }
.eu-faq__a a { color: var(--eu-primary); }

/* CTA band ------------------------------------------------------------- */
.eu-quote__band { background: linear-gradient(160deg, #1d1d1f 0%, #2a2a2c 100%); border-radius: var(--eu-r-lg); padding: var(--eu-space-xxl);
  text-align: center; }
.eu-quote__band h2 { font-family: var(--eu-font-display); font-size: var(--eu-fs-dlg); font-weight: 600; color: #fff;
  margin: 0 0 var(--eu-space-lg); letter-spacing: -0.01em; }
.eu-quote__band .eu-quote__cta { justify-content: center; }

/* responsive ----------------------------------------------------------- */
@media (max-width: 980px) {
  .eu-quote__hero { grid-template-columns: 1fr; gap: var(--eu-space-xl); }
  .eu-quote__rte { grid-template-columns: 1fr; }
  .eu-quote__panel { position: static; }
  .eu-quote__grid { grid-template-columns: repeat(2, 1fr); }
  .eu-calc { grid-template-columns: 1fr 1fr; }
  .eu-calc__result { grid-column: 1 / -1; flex-direction: row; align-items: center; justify-content: space-between; }
}
@media (max-width: 560px) {
  .eu-quote { padding: var(--eu-space-lg) var(--eu-space-md) var(--eu-section); }
  .eu-quote section { margin-top: var(--eu-space-xxl); }
  .eu-quote__title { font-size: var(--eu-fs-dlg); }
  .eu-quote__grid { grid-template-columns: 1fr 1fr; }
  .eu-calc { grid-template-columns: 1fr; }
  .eu-quote__calc-inner, .eu-quote__band { padding: var(--eu-space-xl); }
  .eu-quote__chart-frame { height: 420px; }
}

/* ========================================================= PREZZI ACQUISTO
   Pagina CMS bespoke "Prezzi di acquisto" (buyback) — quotazioni di ritiro
   lette dalla landing campaign. Scoped sotto .eu-buyback. Riusa .eu-faq.
   ------------------------------------------------------------------------- */
.eu-buyback { max-width: 1180px; margin: 0 auto; padding: var(--eu-space-xl) var(--eu-space-lg) var(--eu-section); color: var(--eu-ink); }
.eu-buyback section { margin-top: var(--eu-section); }
.eu-buyback__eyebrow { text-transform: uppercase; letter-spacing: 0.14em; font-size: var(--eu-fs-fine); font-weight: 600; color: var(--eu-primary); margin: 0 0 var(--eu-space-sm); }
.eu-buyback__h2 { font-family: var(--eu-font-display); font-size: var(--eu-fs-dmd); font-weight: 600; letter-spacing: -0.01em; margin: 0 0 var(--eu-space-lg); }

/* botton (condivisi con la pagina quotazioni) ------------------------- */
.eu-buyback .eu-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 14px 26px;
  border-radius: var(--eu-r-pill); font-size: var(--eu-fs-caption); font-weight: 600; letter-spacing: 0.01em;
  text-decoration: none; border: 1px solid transparent; transition: transform .2s ease, background .2s ease, color .2s ease; }
.eu-buyback .eu-btn:hover { transform: translateY(-2px); }
.eu-buyback .eu-btn--gold { background: var(--eu-primary); color: #fff; }
.eu-buyback .eu-btn--gold:hover { background: var(--eu-primary-focus); }
.eu-buyback .eu-btn--ghost { background: transparent; color: var(--eu-ink); border-color: var(--eu-ink); }
.eu-buyback .eu-btn--ghost:hover { background: var(--eu-ink); color: #fff; }

/* hero ----------------------------------------------------------------- */
.eu-buyback__hero { text-align: center; max-width: 760px; margin: var(--eu-space-md) auto 0; }
.eu-buyback__title { font-family: var(--eu-font-display); font-size: var(--eu-fs-hero); font-weight: 600; line-height: 1.05;
  letter-spacing: -0.02em; margin: 0 0 var(--eu-space-md); }
.eu-buyback__lede { font-size: var(--eu-fs-lead-airy); line-height: 1.45; color: var(--eu-ink-80); margin: 0 0 var(--eu-space-lg); }
.eu-buyback__cta { display: flex; flex-wrap: wrap; gap: var(--eu-space-sm); justify-content: center; }
.eu-buyback__cta--center { justify-content: center; margin-top: var(--eu-space-xl); }
.eu-buyback__updated { margin: var(--eu-space-lg) 0 0; font-size: var(--eu-fs-caption); color: var(--eu-ink-48); }

/* gruppi + card prezzo ------------------------------------------------- */
.eu-buyback__group { margin-top: var(--eu-space-xxl); }
.eu-buyback__grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(196px, 1fr)); gap: var(--eu-space-md); }
.eu-bcard { display: flex; flex-direction: column; gap: 6px; padding: var(--eu-space-lg); background: var(--eu-pearl);
  border: 1px solid var(--eu-hairline); border-radius: var(--eu-r-md); position: relative; overflow: hidden;
  transition: border-color .2s ease, transform .2s ease, box-shadow .2s ease; }
.eu-bcard::before { content: ""; position: absolute; inset: 0 0 auto 0; height: 3px; background: var(--eu-primary); opacity: .85; }
.eu-bcard:hover { border-color: var(--eu-primary); transform: translateY(-2px); box-shadow: 0 12px 32px rgba(0,0,0,.06); }
.eu-bcard__label { font-size: var(--eu-fs-caption); font-weight: 600; letter-spacing: 0.02em; text-transform: uppercase;
  color: var(--eu-ink-80); margin: 4px 0 0; line-height: 1.3; min-height: 2.6em; }
.eu-bcard__price { display: flex; align-items: baseline; gap: 6px; flex-wrap: wrap; }
.eu-bcard__val { font-family: var(--eu-font-display); font-size: var(--eu-fs-lead); font-weight: 600; color: var(--eu-ink);
  font-variant-numeric: tabular-nums; }
.eu-bcard__unit { font-size: var(--eu-fs-caption); font-weight: 600; color: var(--eu-primary); }
.eu-bcard__desc { font-size: var(--eu-fs-fine); color: var(--eu-ink-48); margin: 2px 0 0; line-height: 1.4; }
.eu-buyback__empty { font-size: var(--eu-fs-body); color: var(--eu-ink-80); }
.eu-buyback__empty a { color: var(--eu-primary); }

/* trust band ----------------------------------------------------------- */
.eu-buyback__trust { background: var(--eu-pearl); border: 1px solid var(--eu-hairline); border-radius: var(--eu-r-lg);
  padding: var(--eu-space-xl) var(--eu-space-xxl); text-align: center; }
.eu-buyback__trust p { margin: 0; font-size: var(--eu-fs-caption); line-height: 1.6; color: var(--eu-ink-80); letter-spacing: 0.01em; }
.eu-buyback__trust strong { color: var(--eu-ink); }

/* come funziona / steps ------------------------------------------------ */
.eu-buyback__steps { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--eu-space-xl); }
.eu-step { padding: var(--eu-space-lg) 0; }
.eu-step__n { display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: var(--eu-r-pill);
  background: var(--eu-ink); color: var(--eu-primary-on-dark); font-family: var(--eu-font-display); font-weight: 600; margin-bottom: var(--eu-space-sm); }
.eu-step h3 { font-family: var(--eu-font-display); font-size: var(--eu-fs-tagline); font-weight: 600; margin: 0 0 6px; }
.eu-step p { font-size: var(--eu-fs-caption); line-height: 1.55; color: var(--eu-ink-80); margin: 0; }

/* responsive ----------------------------------------------------------- */
@media (max-width: 860px) {
  .eu-buyback__steps { grid-template-columns: 1fr; gap: var(--eu-space-md); }
  .eu-buyback__grid { grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); }
}
@media (max-width: 560px) {
  .eu-buyback { padding: var(--eu-space-lg) var(--eu-space-md) var(--eu-section); }
  .eu-buyback section { margin-top: var(--eu-space-xxl); }
  .eu-buyback__title { font-size: var(--eu-fs-dlg); }
  .eu-buyback__grid { grid-template-columns: 1fr 1fr; }
  .eu-bcard__label { min-height: 0; }
  .eu-buyback__trust { padding: var(--eu-space-lg); }
}

/* prezzi acquisto — blocco risposta GEO + perché vendere ----------------- */
.eu-buyback__answer { max-width: 880px; margin-left: auto; margin-right: auto; text-align: center; }
.eu-buyback__answer p { font-size: var(--eu-fs-body); line-height: 1.65; color: var(--eu-ink-80); margin: 0;
  padding: var(--eu-space-lg) var(--eu-space-xl); background: var(--eu-pearl); border: 1px solid var(--eu-hairline);
  border-radius: var(--eu-r-lg); }
.eu-buyback__answer strong { color: var(--eu-ink); }
.eu-buyback__why-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--eu-space-xl); }
.eu-why h3 { font-family: var(--eu-font-display); font-size: var(--eu-fs-tagline); font-weight: 600; margin: 0 0 6px;
  padding-top: var(--eu-space-sm); border-top: 2px solid var(--eu-primary); display: inline-block; }
.eu-why p { font-size: var(--eu-fs-caption); line-height: 1.55; color: var(--eu-ink-80); margin: 0; }
.eu-why a { color: var(--eu-primary); }
@media (max-width: 860px) {
  .eu-buyback__why-grid { grid-template-columns: 1fr 1fr; gap: var(--eu-space-lg); }
}
@media (max-width: 560px) {
  .eu-buyback__why-grid { grid-template-columns: 1fr; }
  .eu-buyback__answer p { padding: var(--eu-space-lg); }
}

/* ============================================================= OROxORO PERMUTA
   Pagina CMS bespoke "Servizio di permuta". Riusa .eu-step e .eu-faq globali.
   ------------------------------------------------------------------------- */
.eu-permuta { max-width: 1100px; margin: 0 auto; padding: var(--eu-space-xl) var(--eu-space-lg) var(--eu-section); color: var(--eu-ink); }
.eu-permuta section { margin-top: clamp(64px, 6vw, 88px); }
.eu-permuta__eyebrow { text-transform: uppercase; letter-spacing: 0.14em; font-size: var(--eu-fs-fine); font-weight: 600; color: var(--eu-primary); margin: 0 0 var(--eu-space-sm); }
.eu-permuta__h2 { font-family: var(--eu-font-display); font-size: var(--eu-fs-dmd); font-weight: 600; letter-spacing: -0.01em; margin: 0 0 var(--eu-space-lg); }

.eu-permuta .eu-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 14px 26px;
  border-radius: var(--eu-r-pill); font-size: var(--eu-fs-caption); font-weight: 600; letter-spacing: 0.01em;
  text-decoration: none; border: 1px solid transparent; transition: transform .2s ease, background .2s ease, color .2s ease; }
.eu-permuta .eu-btn:hover { transform: translateY(-2px); }
.eu-permuta .eu-btn--gold { background: var(--eu-primary); color: #fff; }
.eu-permuta .eu-btn--gold:hover { background: var(--eu-primary-focus); }
.eu-permuta .eu-btn--ghost { background: transparent; color: var(--eu-ink); border-color: var(--eu-ink); }
.eu-permuta .eu-btn--ghost:hover { background: var(--eu-ink); color: #fff; }

/* cover fullscreen (full-bleed sotto l'hero) --------------------------- */
.eu-permuta__cover { width: 100vw; margin-left: calc(50% - 50vw);
  margin-top: var(--eu-space-xxl); margin-bottom: var(--eu-space-xxl); }
.eu-permuta__cover img { display: block; width: 100%; height: clamp(360px, 78vh, 760px); object-fit: cover; }

/* hero ----------------------------------------------------------------- */
.eu-permuta__hero { text-align: center; max-width: 760px; margin: var(--eu-space-md) auto 0; }
.eu-permuta__title { font-family: var(--eu-font-display); font-size: var(--eu-fs-hero); font-weight: 600; line-height: 1.05;
  letter-spacing: -0.02em; margin: 0 0 var(--eu-space-md); }
.eu-permuta__lede { font-size: var(--eu-fs-lead-airy); line-height: 1.45; color: var(--eu-ink-80); margin: 0 0 var(--eu-space-lg); }
.eu-permuta__cta, .eu-permuta__links { display: flex; flex-wrap: wrap; gap: var(--eu-space-sm); justify-content: center; }

/* spot card ------------------------------------------------------------ */
.eu-permuta__spot { text-align: center; }
.eu-permuta__spot-card { display: inline-flex; flex-direction: column; gap: 6px; align-items: center;
  background: linear-gradient(160deg, #1d1d1f 0%, #2a2a2c 100%); color: #fff; border-radius: var(--eu-r-lg);
  padding: var(--eu-space-xl) var(--eu-space-xxl); box-shadow: var(--eu-shadow-product); }
.eu-permuta__spot-label { font-size: var(--eu-fs-caption); color: var(--eu-body-muted); letter-spacing: 0.02em; }
.eu-permuta__spot-val { font-family: var(--eu-font-display); font-size: 2.75rem; font-weight: 600; line-height: 1;
  color: var(--eu-primary-on-dark); font-variant-numeric: tabular-nums; }
.eu-permuta__spot-val em { font-style: normal; font-size: var(--eu-fs-lead); color: #fff; font-weight: 500; }
.eu-permuta__spot-upd { font-size: var(--eu-fs-fine); color: var(--eu-body-muted); }
.eu-permuta__spot-note { max-width: 620px; margin: var(--eu-space-lg) auto 0; font-size: var(--eu-fs-fine);
  color: var(--eu-ink-48); line-height: 1.5; }
/* due box affiancati: permuta (spot, nero) + vendita (ritiro, grigio) */
.eu-permuta__spot-cards { display: flex; flex-wrap: wrap; justify-content: center; align-items: stretch; gap: var(--eu-space-lg); }
.eu-permuta__spot-cards .eu-permuta__spot-card { flex: 1 1 300px; max-width: 420px; }
.eu-permuta__spot-card--sell { background: #f6f6f7; border: 1px solid #e3e3e6; box-shadow: none; color: var(--eu-ink); }
.eu-permuta__spot-card--sell .eu-permuta__spot-label { color: var(--eu-ink); }
.eu-permuta__spot-card--sell .eu-permuta__spot-upd { color: var(--eu-ink); }
.eu-permuta__spot-card--sell .eu-permuta__spot-val { color: var(--eu-primary); }
.eu-permuta__spot-card--sell .eu-permuta__spot-val em { color: var(--eu-ink); }

/* intro ---------------------------------------------------------------- */
.eu-permuta__intro { max-width: 760px; margin-left: auto; margin-right: auto; text-align: center; }
.eu-permuta__intro p { font-size: var(--eu-fs-body); line-height: 1.65; color: var(--eu-ink-80); margin: 0 0 var(--eu-space-lg); }

/* steps (riusa .eu-step) ----------------------------------------------- */
.eu-permuta__steps { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--eu-space-xl); }
.eu-permuta__faq .eu-faq { margin: 0 auto; }

/* responsive ----------------------------------------------------------- */
@media (max-width: 860px) {
  .eu-permuta__steps { grid-template-columns: 1fr; gap: var(--eu-space-md); }
}
@media (max-width: 560px) {
  .eu-permuta { padding: var(--eu-space-lg) var(--eu-space-md) var(--eu-section); }
  .eu-permuta section { margin-top: var(--eu-space-xxl); }
  .eu-permuta__cover { margin-top: var(--eu-space-xl); margin-bottom: var(--eu-space-xl); }
  .eu-permuta__cover img { height: clamp(300px, 60vh, 460px); }
  .eu-permuta__title { font-size: var(--eu-fs-dlg); }
  .eu-permuta__spot-card { padding: var(--eu-space-xl); }
  .eu-permuta__spot-val { font-size: 2.25rem; }
}

/* ========================================================= DIPARTIMENTO OROLOGI
   Pagina CMS bespoke "Valutazione orologi". Riusa .eu-step e .eu-faq globali.
   ------------------------------------------------------------------------- */
.eu-orologi { color: var(--eu-ink); }
.eu-orologi > section { max-width: 1100px; margin: var(--eu-section) auto 0; padding: 0 var(--eu-space-lg); }
.eu-orologi__eyebrow { text-transform: uppercase; letter-spacing: 0.14em; font-size: var(--eu-fs-fine); font-weight: 600; color: var(--eu-primary-on-dark); margin: 0 0 var(--eu-space-sm); }
.eu-orologi__h2 { font-family: var(--eu-font-display); font-size: var(--eu-fs-dmd); font-weight: 600; letter-spacing: -0.01em; margin: 0 0 var(--eu-space-xs); }
.eu-orologi__sub { color: var(--eu-ink-48); font-size: var(--eu-fs-body); margin: 0 0 var(--eu-space-lg); max-width: 64ch; }

.eu-orologi .eu-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 14px 26px;
  border-radius: var(--eu-r-pill); font-size: var(--eu-fs-caption); font-weight: 600; text-decoration: none;
  border: 1px solid transparent; transition: transform .2s ease, background .2s ease, color .2s ease; }
.eu-orologi .eu-btn:hover { transform: translateY(-2px); }
.eu-orologi .eu-btn--gold { background: var(--eu-primary); color: #fff; }
.eu-orologi .eu-btn--gold:hover { background: var(--eu-primary-focus); }
.eu-orologi .eu-btn--ghost { background: transparent; color: var(--eu-ink); border-color: var(--eu-ink); }
.eu-orologi .eu-btn--ghost:hover { background: var(--eu-ink); color: #fff; }
.eu-orologi .eu-btn--ghost-light { background: transparent; color: #fff; border-color: rgba(255,255,255,.5); }
.eu-orologi .eu-btn--ghost-light:hover { background: #fff; color: var(--eu-ink); }

/* hero dark full-bleed -------------------------------------------------- */
.eu-orologi__hero { max-width: none; width: 100vw; margin: 0 0 0 calc(50% - 50vw); padding: 0;
  background: radial-gradient(120% 140% at 70% 10%, #2a2a2c 0%, #161617 60%, #0e0e0f 100%); }
.eu-orologi__hero-in { max-width: 880px; margin: 0 auto; padding: clamp(64px, 12vh, 140px) var(--eu-space-lg); text-align: center; color: #fff; }
.eu-orologi__title { font-family: var(--eu-font-display); font-size: var(--eu-fs-hero); font-weight: 600; line-height: 1.06;
  letter-spacing: -0.02em; margin: 0 0 var(--eu-space-md); color: #fff; }
.eu-orologi__lede { font-size: var(--eu-fs-lead-airy); line-height: 1.45; color: var(--eu-body-muted); margin: 0 auto var(--eu-space-lg); max-width: 60ch; }
.eu-orologi__lede strong { color: #fff; }
.eu-orologi__cta { display: flex; flex-wrap: wrap; gap: var(--eu-space-sm); justify-content: center; }
.eu-orologi__cta--center { justify-content: center; margin-top: var(--eu-space-xl); }

/* cosa analizziamo ----------------------------------------------------- */
.eu-orologi__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--eu-space-md); }
.eu-ocard { padding: var(--eu-space-lg); border: 1px solid var(--eu-hairline); border-radius: var(--eu-r-md); background: var(--eu-canvas);
  transition: border-color .2s ease, transform .2s ease, box-shadow .2s ease; }
.eu-ocard:hover { border-color: var(--eu-primary); transform: translateY(-2px); box-shadow: 0 12px 32px rgba(0,0,0,.06); }
.eu-ocard__icon { display: inline-flex; align-items: center; justify-content: center; width: 46px; height: 46px;
  border-radius: var(--eu-r-md); background: rgba(var(--eu-primary-rgb), 0.10); margin-bottom: var(--eu-space-sm); }
.eu-ocard__icon svg { width: 24px; height: 24px; stroke: var(--eu-primary); fill: none; }
.eu-ocard:hover .eu-ocard__icon { background: rgba(var(--eu-primary-rgb), 0.16); }
.eu-ocard h3 { font-family: var(--eu-font-display); font-size: var(--eu-fs-tagline); font-weight: 600; margin: 0; }
.eu-ocard p { font-size: var(--eu-fs-caption); line-height: 1.5; color: var(--eu-ink-80); margin: 0; }

/* marchi --------------------------------------------------------------- */
.eu-orologi__brandlist { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: var(--eu-space-sm); }
.eu-orologi__brandlist li { font-family: var(--eu-font-display); font-size: var(--eu-fs-caption); font-weight: 500; letter-spacing: 0.02em;
  color: var(--eu-ink-80); padding: 9px 16px; border: 1px solid var(--eu-hairline); border-radius: var(--eu-r-pill); background: var(--eu-pearl); }

/* steps ---------------------------------------------------------------- */
.eu-orologi__steps { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--eu-space-xl); }

/* responsive ----------------------------------------------------------- */
@media (max-width: 860px) {
  .eu-orologi__grid { grid-template-columns: 1fr 1fr; }
  .eu-orologi__steps { grid-template-columns: 1fr; gap: var(--eu-space-md); }
}
@media (max-width: 560px) {
  .eu-orologi > section { margin-top: var(--eu-space-xxl); padding: 0 var(--eu-space-md); }
  .eu-orologi__title { font-size: var(--eu-fs-dlg); }
  .eu-orologi__grid { grid-template-columns: 1fr; }
}

/* ============================================================ PASSKEY / WEBAUTHN */
.eu-passkey-alt { margin-top: var(--eu-space-lg); }
.eu-passkey-alt__sep { display: flex; align-items: center; gap: var(--eu-space-md); color: var(--eu-ink-48);
  font-size: var(--eu-fs-caption); margin-bottom: var(--eu-space-md); }
.eu-passkey-alt__sep::before, .eu-passkey-alt__sep::after { content: ""; flex: 1; height: 1px; background: var(--eu-hairline); }
.eu-passkey-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; }
.eu-passkey-btn__i { width: 20px; height: 20px; flex: none; }
.eu-passkey-btn.is-busy { opacity: .6; pointer-events: none; }
/* Sul login/registrazione il bottone è a tutta larghezza del box */
.eu-passkey-alt .eu-passkey-btn { width: 100%; }
.eu-passkey-status, .eu-passkeys__status { display: block; margin-top: var(--eu-space-sm); font-size: var(--eu-fs-caption); color: var(--eu-ink-48); text-align: center; }
.eu-passkey-status.is-error, .eu-passkeys__status.is-error { color: #c0392b; }
.eu-passkey-note { margin-top: var(--eu-space-sm); font-size: var(--eu-fs-fine); color: var(--eu-ink-48); }
.eu-passkeys { margin-top: var(--eu-space-xl); padding: var(--eu-space-xl); border: 1px solid var(--eu-hairline);
  border-radius: var(--eu-r-lg); background: var(--eu-pearl); max-width: 560px; }
.eu-passkeys__title { font-family: var(--eu-font-display); font-size: var(--eu-fs-tagline); font-weight: 600; margin: 0 0 4px; }
.eu-passkeys__lead { font-size: var(--eu-fs-caption); color: var(--eu-ink-48); margin: 0 0 var(--eu-space-md); }
.eu-passkeys__list { list-style: none; margin: 0 0 var(--eu-space-md); padding: 0; }
.eu-passkeys__item { display: flex; align-items: center; justify-content: space-between; gap: var(--eu-space-md);
  padding: var(--eu-space-sm) 0; border-top: 1px solid var(--eu-hairline); }
.eu-passkeys__name { font-size: var(--eu-fs-caption); color: var(--eu-ink); }
.eu-passkeys__name small { color: var(--eu-ink-48); }
.eu-passkeys__empty { font-size: var(--eu-fs-caption); color: var(--eu-ink-48); margin: 0 0 var(--eu-space-md); }

/* ============================================================ DIAMANTI — FILTRI
   Pannello "grading scale": ogni caratteristica è una scala segmentata.
   ------------------------------------------------------------------------- */
.eu-dfilters { display: grid; gap: var(--eu-space-lg); margin-bottom: var(--eu-space-xxl);
  padding: var(--eu-space-xl); background: var(--eu-pearl);
  border: 1px solid var(--eu-hairline); border-radius: var(--eu-r-lg); }
.eu-dfilters__head { display: flex; align-items: baseline; justify-content: space-between; gap: var(--eu-space-md);
  padding-bottom: var(--eu-space-md); border-bottom: 1px solid var(--eu-hairline); }
.eu-dfilters__eyebrow { font-family: var(--eu-font-display); font-size: var(--eu-fs-caption); font-weight: 600; color: var(--eu-ink); letter-spacing: -0.01em; }
.eu-dfilters__hint { font-size: var(--eu-fs-fine); color: var(--eu-ink-48); letter-spacing: 0.02em; }
.eu-dfilter { display: grid; grid-template-columns: 108px 1fr; align-items: center; gap: var(--eu-space-lg); margin: 0; }
.eu-dfilter__title { font-family: var(--eu-font-display); font-size: 11px; font-weight: 600;
  text-transform: uppercase; letter-spacing: 0.1em; color: var(--eu-ink-48); margin: 0; }
.eu-dfilter__list { list-style: none; margin: 0; padding: 0; display: inline-flex; flex-wrap: wrap;
  width: fit-content; max-width: 100%; border: 1px solid var(--eu-hairline); border-radius: var(--eu-r-pill);
  background: var(--eu-canvas); overflow: hidden; }
.eu-dfilter__list li { display: flex; }
.eu-dfilter__list li + li { border-left: 1px solid var(--eu-hairline); }
.eu-dfilter__opt { display: inline-flex; align-items: center; justify-content: center; min-width: 44px; padding: 9px 15px;
  font-size: var(--eu-fs-caption); font-weight: 600; font-variant-numeric: tabular-nums; color: var(--eu-ink-80);
  text-decoration: none; transition: color .15s ease, background .15s ease; }
.eu-dfilter__opt:hover { color: #fff; background: var(--eu-primary); }
/* Facet dinamici di ps_facetedsearch (produzione): stesso layout a righe */
.eu-dfilters .facet { display: grid; grid-template-columns: 108px 1fr; align-items: center; gap: var(--eu-space-lg); margin: 0; }
.eu-dfilters .facet-title, .eu-dfilters .block-title { font-family: var(--eu-font-display); font-size: 11px;
  text-transform: uppercase; letter-spacing: 0.1em; color: var(--eu-ink-48); font-weight: 600; margin: 0; }
.eu-dfilters .facet ul { list-style: none; padding: 0; margin: 0; display: flex; flex-wrap: wrap; gap: 8px; }
@media (max-width: 860px) {
  .eu-dfilter, .eu-dfilters .facet { grid-template-columns: 1fr; gap: var(--eu-space-xs); }
  .eu-dfilters__head { flex-direction: column; gap: 2px; }
}

/* ============================================================================
   RIFINITURE CARRELLO / CHECKOUT
   ========================================================================== */
/* Carrello: stacco a destra tra colonna prodotti e riepilogo (item Dany) */
.cart-grid__content { padding-right: var(--eu-space-lg); }
@media (max-width: 991px) {
  .cart-grid__content { padding-right: 0; }          /* mobile: colonne impilate */
  .cart-grid { row-gap: var(--eu-space-lg); }
}

/* Checkout: la searchbar dell'header deve occupare tutta la larghezza */
.page-order .eu-searchbar { max-width: 100%; }

/* Checkout: gli step completati (1-2-3-4) in ORO, non verde */
.checkout-steps__step--success .checkout-steps__number { background: var(--eu-primary); }
.checkout-steps__step--success .checkout-steps__btn { color: var(--eu-primary); }
.checkout-steps__step--success::before,
.checkout-steps__step--success::after { background: var(--eu-primary); }

/* Pagina carrello — rifiniture (breadcrumb rimosso via cart.tpl) */
@media (min-width: 768px) {
  .cart-grid__aside { padding: 30px; border: 1px solid #EAEAEA; border-radius: 20px; }
}
.cart-grid__aside-wrapper h2 { font-size: 24px; }
body#cart .page-title-section { font-size: clamp(2.125rem, 3.5vw, var(--eu-fs-hero)); }
/* Carrello: stacco in alto (il breadcrumb rimosso non c'è più) */
body#cart .wrapper { padding-top: var(--eu-space-xl); }

/* Perché Euronummus: rimuove la linea sopra il titolo (collisione con .eu-why h3)
   + fix overflow su mobile (grid-item che si restringono + parole lunghe che vanno a capo) */
.eu-why .eu-whyc__title { border-top: 0; padding-top: 0; }
@media (max-width: 640px) {
  .eu-why__grid { gap: var(--eu-space-sm); }
  .eu-whyc { padding: var(--eu-space-lg); min-width: 0; }
  .eu-whyc__title, .eu-whyc__desc { overflow-wrap: anywhere; }
}

/* =====================================================================
   CHI SIAMO (pagina CMS bespoke)
   ===================================================================== */
.eu-about { max-width: 1100px; margin: 0 auto; padding: var(--eu-space-xl) var(--eu-space-lg) var(--eu-section); color: var(--eu-ink); }
.eu-about section { margin-top: clamp(64px, 6vw, 96px); }
.eu-about__h2 { font-family: var(--eu-font-display); font-size: var(--eu-fs-dmd); font-weight: 600; letter-spacing: -0.01em; margin: 0 0 var(--eu-space-lg); }
.eu-about p { font-size: var(--eu-fs-body); line-height: 1.65; color: var(--eu-ink-80); margin: 0 0 var(--eu-space-md); }
.eu-about .eu-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 14px 26px;
  border-radius: var(--eu-r-pill); font-size: var(--eu-fs-caption); font-weight: 600; text-decoration: none;
  border: 1px solid transparent; transition: transform .2s ease, background .2s ease, color .2s ease; }
.eu-about .eu-btn:hover { transform: translateY(-2px); }
.eu-about .eu-btn--gold { background: var(--eu-primary); color: #fff; }
.eu-about .eu-btn--gold:hover { background: var(--eu-primary-focus); }
.eu-about .eu-btn--ghost { background: transparent; color: var(--eu-ink); border-color: var(--eu-ink); }
.eu-about .eu-btn--ghost:hover { background: var(--eu-ink); color: #fff; }
.eu-about .eu-btn--ghost-light { background: transparent; color: #fff; border-color: rgba(255,255,255,.5); }
.eu-about .eu-btn--ghost-light:hover { background: #fff; color: var(--eu-ink); }
.eu-about__cta { display: flex; flex-wrap: wrap; gap: var(--eu-space-sm); justify-content: center; }

/* hero */
.eu-about__hero { text-align: center; max-width: 780px; margin: var(--eu-space-md) auto 0; }
.eu-about__eyebrow { text-transform: uppercase; letter-spacing: 0.14em; font-size: var(--eu-fs-fine); font-weight: 600; color: var(--eu-primary); margin: 0 0 var(--eu-space-sm); }
.eu-about__title { font-family: var(--eu-font-display); font-size: var(--eu-fs-hero); font-weight: 600; line-height: 1.05;
  letter-spacing: -0.02em; margin: 0 0 var(--eu-space-md); }
.eu-about__lede { font-size: var(--eu-fs-lead-airy); line-height: 1.45; color: var(--eu-ink-80); margin: 0 0 var(--eu-space-lg); }

/* video (facade: immagine + play, iframe caricato al click) */
.eu-about__video { position: relative; border-radius: var(--eu-r-lg); overflow: hidden; background: #000;
  aspect-ratio: 16 / 9; box-shadow: var(--eu-shadow-product); }
.eu-about__video iframe, .eu-about__video img { width: 100%; height: 100%; display: block; border: 0; object-fit: cover; }
.eu-about__video-btn { all: unset; display: block; cursor: pointer; width: 100%; height: 100%; position: relative; }
.eu-about__video-btn img { transition: transform .4s ease, opacity .3s ease; }
.eu-about__video-btn:hover img { transform: scale(1.03); opacity: .85; }
.eu-about__play { position: absolute; inset: 0; margin: auto; width: 78px; height: 78px; display: grid; place-items: center;
  background: var(--eu-primary); color: #fff; border-radius: 50%; box-shadow: 0 10px 30px rgba(0,0,0,.35);
  transition: transform .2s ease, background .2s ease; }
.eu-about__play svg { width: 34px; height: 34px; margin-left: 4px; }
.eu-about__video-btn:hover .eu-about__play { transform: scale(1.08); background: var(--eu-primary-focus); }
.eu-about__video-btn:focus-visible .eu-about__play { outline: 3px solid #fff; outline-offset: 3px; }

/* storia */
.eu-about__story { max-width: 780px; margin-inline: auto; }

/* valori */
.eu-about__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--eu-space-lg); }
.eu-acard { padding: var(--eu-space-xl); border: 1px solid var(--eu-hairline); border-radius: var(--eu-r-md);
  background: var(--eu-canvas); transition: border-color .2s ease, transform .2s ease, box-shadow .2s ease; }
.eu-acard:hover { border-color: var(--eu-primary); transform: translateY(-2px); box-shadow: 0 12px 32px rgba(0,0,0,.06); }
.eu-acard__icon { display: inline-flex; align-items: center; justify-content: center; width: 46px; height: 46px;
  border-radius: var(--eu-r-md); background: rgba(var(--eu-primary-rgb), 0.10); margin-bottom: var(--eu-space-md); }
.eu-acard__icon svg { width: 24px; height: 24px; stroke: var(--eu-primary); }
.eu-acard h3 { font-family: var(--eu-font-display); font-size: var(--eu-fs-tagline); font-weight: 600; margin: 0 0 var(--eu-space-sm); }
.eu-acard p { font-size: var(--eu-fs-caption); line-height: 1.55; color: var(--eu-ink-80); margin: 0; }

/* autorizzazioni */
.eu-about__auth { background: var(--eu-parchment); border-radius: var(--eu-r-lg); padding: var(--eu-space-xxl); }
.eu-about__auth-in { display: grid; grid-template-columns: 1fr 1fr; gap: var(--eu-space-xxl); align-items: start; }
.eu-about__auth-lede { font-size: var(--eu-fs-caption); line-height: 1.6; }
.eu-about__members { list-style: none; padding: 0; margin: var(--eu-space-md) 0 0; }
.eu-about__members li { position: relative; padding-left: 20px; font-size: var(--eu-fs-caption); color: var(--eu-ink-80); line-height: 2; }
.eu-about__members li::before { content: ""; position: absolute; left: 0; top: 13px; width: 8px; height: 8px;
  border-radius: 50%; background: var(--eu-primary); }
.eu-about__creds { list-style: none; padding: 0; margin: 0; }
.eu-about__creds li { display: flex; justify-content: space-between; align-items: baseline; gap: var(--eu-space-md);
  padding: 12px 0; border-bottom: 1px solid var(--eu-divider-soft); }
.eu-about__creds li:last-child { border-bottom: 0; }
.eu-about__creds span { font-size: var(--eu-fs-caption); color: var(--eu-ink-48); }
.eu-about__creds b { font-size: var(--eu-fs-caption); font-weight: 600; color: var(--eu-ink); text-align: right; font-variant-numeric: tabular-nums; }

/* dove siamo */
.eu-about__where-grid { display: grid; grid-template-columns: 1fr 1fr; gap: var(--eu-space-lg); }
.eu-about__where-card { padding: var(--eu-space-xl); border: 1px solid var(--eu-hairline); border-radius: var(--eu-r-md); background: var(--eu-canvas); }
.eu-about__where-card--note { background: var(--eu-parchment); border-color: transparent; }
.eu-about__where-label { font-size: 11px; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase;
  color: var(--eu-primary); margin: 0 0 var(--eu-space-sm); }
.eu-about__where-card address { font-style: normal; font-size: var(--eu-fs-body); line-height: 1.7; color: var(--eu-ink-80); }
.eu-about__where-card address strong { color: var(--eu-ink); }
.eu-about__where-card .eu-about__cta { justify-content: flex-start; }

/* banda finale */
.eu-about__band { background: linear-gradient(160deg, #1d1d1f 0%, #2a2a2c 100%); color: #fff;
  border-radius: var(--eu-r-lg); padding: var(--eu-space-xxl); text-align: center; }
.eu-about__band h2 { font-family: var(--eu-font-display); font-size: var(--eu-fs-dmd); font-weight: 600; margin: 0 0 var(--eu-space-sm); color: #fff; }
.eu-about__band p { color: var(--eu-body-muted); max-width: 60ch; margin: 0 auto var(--eu-space-lg); }

/* responsive */
@media (max-width: 900px) {
  .eu-about__grid { grid-template-columns: 1fr; }
  .eu-about__auth-in, .eu-about__where-grid { grid-template-columns: 1fr; gap: var(--eu-space-xl); }
}
@media (max-width: 560px) {
  .eu-about { padding: var(--eu-space-lg) var(--eu-space-md) var(--eu-section); }
  .eu-about__title { font-size: var(--eu-fs-dlg); }
  .eu-about__auth, .eu-about__band { padding: var(--eu-space-xl); }
  .eu-about__play { width: 60px; height: 60px; }
  .eu-about__play svg { width: 26px; height: 26px; }
}