/* ==========================================================================
   UCN DESIGN SYSTEM - GLOBAL CSS
   ========================================================================== */

:root {
  /* Default Theme (Magenta) — LIGHT */
  --bg: #FFFFFF;
  --fg: #111111;
  --accent: #E5007D;
  --fg-muted: #666666;
  --divider: rgba(0,0,0,.10);
  --card-bg: #F5F5F5;
  --section-alt: #F8F8F8;
  --input-bg: #EFEFEF;
  --accent-ghost: rgba(229,0,125,.08);
  --nav-bg: rgba(255,255,255,.97);
  --btn-fg: #ffffff;
  --fg-border: rgba(17,17,17,.22);
}

/* RESET E BASE */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body { 
  background: var(--bg); 
  color: var(--fg); 
  font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; 
  font-weight: 300; 
  overflow-x: hidden; 
}

/* EFFETTO GRANA (GRAIN) */
body::before { 
  content:''; 
  position:fixed; 
  inset:0; 
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.04'/%3E%3C/svg%3E"); 
  pointer-events:none; 
  z-index:100; 
  opacity:.2; 
}

/* ==========================================================================
   SISTEMA TIPOGRAFICO UNIFICATO
   ========================================================================== */

.ucn-h2 {
  font-size: clamp(44px, 5vw, 72px) !important;
  line-height: .92 !important;
  font-weight: 700 !important;
  letter-spacing: -.02em !important;
  color: var(--fg) !important;
  font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif !important;
  margin: 0 !important;
}

.ucn-h2 em { 
  font-style: normal !important; 
  font-weight: 300 !important; 
  color: var(--accent) !important; 
}

.ucn-desc {
  font-size: 16px !important;
  line-height: 1.75 !important;
  font-weight: 300 !important;
  color: var(--fg-muted) !important;
  font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif !important;
  margin: 0 !important;
}

.section-label { 
  font-size: 10px; 
  font-weight: 700; 
  letter-spacing: .3em; 
  text-transform: uppercase; 
  color: var(--accent); 
  display: flex; 
  align-items: center; 
  gap: 12px; 
  margin-bottom: 44px; 
}

.section-label::before { 
  content: ''; 
  width: 28px; 
  height: 1px; 
  background: var(--accent); 
}

/* ==========================================================================
   PULSANTI GLOBALI
   ========================================================================== */

.btn-primary { 
  background: var(--accent); 
  color: var(--btn-fg); 
  padding: 16px 36px; 
  font-size: 11px; 
  font-weight: 700; 
  letter-spacing: .2em; 
  text-transform: uppercase; 
  text-decoration: none; 
  display: inline-block; 
  transition: opacity .2s; 
  border: 2px solid var(--accent); 
}

.btn-primary:hover { opacity: .82; }

.btn-outline { 
  border: 2px solid var(--fg-border); 
  color: var(--fg); 
  padding: 16px 36px; 
  font-size: 11px; 
  font-weight: 600; 
  letter-spacing: .2em; 
  text-transform: uppercase; 
  text-decoration: none; 
  display: inline-block; 
  transition: border-color .2s, color .2s; 
}

.btn-outline:hover { 
  border-color: var(--accent); 
  color: var(--accent); 
}

/* ==========================================================================
   ANIMAZIONI
   ========================================================================== */

@keyframes fadeUp { 
  from { opacity: 0; transform: translateY(20px); }
  to { opacity: 1; transform: none; } 
}

@keyframes fadeIn { 
  from { opacity: 0; }
  to { opacity: 1; } 
}

.reveal { 
  opacity: 0; 
  transform: translateY(24px); 
  transition: opacity .6s ease, transform .6s ease; 
}

.reveal.visible { 
  opacity: 1; 
  transform: none; 
}

/* ==========================================================================
   SEZIONI SPECIFICHE (HERO, GRIGLIE, NEWSLETTER)
   ========================================================================== */

/* Hero */
.hero { min-height:100vh; display:grid; grid-template-columns:1fr 1fr; position:relative; overflow:hidden; }
.hero-left { display:flex; flex-direction:column; justify-content:flex-end; padding:140px 64px 80px; position:relative; z-index:2; }
.hero-tag { font-size:11px; font-weight:600; letter-spacing:.32em; text-transform:uppercase; color:var(--accent); margin-bottom:28px; opacity:0; animation:fadeUp .7s ease .2s forwards; }
.hero-title { font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif !important; font-size:clamp(72px,9vw,128px) !important; line-height:.88 !important; font-weight:700 !important; letter-spacing:-.03em !important; margin-bottom:24px; opacity:0; animation:fadeUp .7s ease .35s forwards; }
.hero-title em { font-style:normal !important; font-weight:300 !important; color:var(--accent) !important; }
.hero-subtitle { font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif !important; font-size:clamp(22px,2.2vw,34px) !important; line-height:1.25 !important; font-weight:300 !important; color:var(--fg-muted) !important; margin-bottom:32px; opacity:0; animation:fadeUp .7s ease .45s forwards; }
.hero-subtitle strong { font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif !important; font-weight:700 !important; font-size:inherit !important; color:var(--fg) !important; }
.hero-sub { font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif !important; font-size:16px !important; line-height:1.8 !important; color:var(--fg-muted) !important; max-width:420px; margin-bottom:52px; opacity:0; animation:fadeUp .7s ease .55s forwards; }
.hero-sub { font-size:16px !important; line-height:1.8 !important; color:var(--fg-muted); max-width:420px; margin-bottom:52px; opacity:0; animation:fadeUp .7s ease .55s forwards; }
.hero-subtitle strong { font-weight:700 !important; font-size:inherit !important; color:var(--fg) !important; }
.hero-ctas { display:flex; gap:14px; flex-wrap:wrap; opacity:0; animation:fadeUp .7s ease .65s forwards; }
.hero-right { position:relative; overflow:hidden; }
.hero-right::before { content:''; position:absolute; inset:0; background:linear-gradient(135deg,var(--accent-ghost) 0%,transparent 55%); z-index:1; pointer-events:none; }
.hero-poster-grid { position:absolute; inset:0; display:grid; grid-template-columns:1fr 1fr; gap:3px; padding:3px; opacity:0; animation:fadeIn 1s ease .4s forwards; }
.hero-poster-item { overflow:hidden; position:relative; }
.hero-poster-item:first-child { grid-row:span 2; }
.hero-poster-item img { width:100%; height:100%; object-fit:cover; display:block; transition:transform .6s ease; }
.hero-poster-item:hover img { transform:scale(1.04); }
.hero-poster-overlay { position:absolute; bottom:0; left:0; right:0; padding:12px; background:linear-gradient(to top,rgba(0,0,0,.82) 0%,transparent 100%); z-index:2; }
.hero-poster-artist { font-size:10px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:#fff; }
.hero-poster-song { font-size:8px; letter-spacing:.12em; text-transform:uppercase; color:var(--accent); margin-top:2px; }

.mobile-banner { display:none; }
.mobile-banner img { width:100%; display:block; aspect-ratio:3/4; object-fit:cover; }

/* Prodotti & Griglie */
.sellers-header { display:flex; justify-content:space-between; align-items:flex-end; margin-bottom:44px; }
.sellers-link { font-size:11px; font-weight:500; letter-spacing:.15em; text-transform:uppercase; color:var(--fg-muted); text-decoration:none; border-bottom:1px solid var(--divider); padding-bottom:2px; transition:color .2s,border-color .2s; }
.sellers-link:hover { color:var(--accent); border-color:var(--accent); }
.products-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:2px; }
.product-card { position:relative; overflow:hidden; }
.product-card.featured { grid-column:span 2; }
.product-visual { aspect-ratio:3/4; position:relative; overflow:hidden; background:var(--card-bg); }
.product-card.featured .product-visual { aspect-ratio:3/4; }
.product-visual img { width:100%; height:100%; object-fit:cover; display:block; transition:transform .5s ease; }
.product-card:hover .product-visual img { transform:scale(1.04); }
.prod-badge { position:absolute; top:12px; left:12px; z-index:2; background:var(--accent); color:var(--btn-fg); font-size:8px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; padding:4px 8px; }
.prod-limited { position:absolute; top:12px; right:12px; z-index:2; border:1px solid rgba(255,255,255,.25); color:rgba(255,255,255,.5); font-size:8px; letter-spacing:.12em; text-transform:uppercase; padding:4px 8px; }
.product-overlay { position:absolute; inset:0; display:flex; align-items:center; justify-content:center; opacity:0; transition:opacity .3s ease; z-index:3; }
.product-card:hover .product-overlay { opacity:1; }
.overlay-btn-scopri { background:rgba(255,255,255,.14); color:#fff; padding:14px 0; width:185px; text-align:center; font-size:10px; font-weight:700; letter-spacing:.15em; text-transform:uppercase; text-decoration:none; border:1px solid rgba(255,255,255,.4); transition:background .2s; display:block; backdrop-filter:blur(4px); }
.overlay-btn-scopri:hover { background:rgba(255,255,255,.28); }
.product-info { padding:16px 0 22px; }
.prod-info-name { font-size:17px !important; font-weight:700; color:var(--fg); margin-bottom:5px; }
.prod-info-sub { font-size:11.5px !important; letter-spacing:.15em; text-transform:uppercase; color:var(--fg-muted); margin-bottom:14px; }
.prod-formats { display:flex; gap:5px; flex-wrap:wrap; margin-bottom:12px; }
.fmt-chip { padding:6px 12px !important; border:1px solid var(--divider); font-size:10px !important; font-weight:600; letter-spacing:.08em; text-transform:uppercase; color:var(--fg-muted); transition:all .15s; user-select:none; cursor:pointer;}
.fmt-chip.active { border-color:var(--accent); color:var(--accent); background:var(--accent-ghost); }
.fmt-chip:hover:not(.active) { border-color:var(--accent); color:var(--accent); }
.prod-info-price { font-size:20px !important; font-weight:700; color:var(--accent); }
.prod-shipping { font-size:10.5px !important; font-weight:500; letter-spacing:.12em; text-transform:uppercase; color:var(--fg-muted); margin-top:6px; }
.prod-shipping span { color:var(--accent); }
.sellers-footer { margin-top:44px; text-align:center; }

/* Sezioni Varie */
.gallery-section { padding:0 64px 88px; }
.gallery-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:2px; }
.gallery-card { position:relative; overflow:hidden; aspect-ratio:3/4; background:var(--card-bg); }
.gallery-card img { width:100%; height:100%; object-fit:cover; display:block; transition:transform .5s ease; }
.gallery-card:hover img { transform:scale(1.04); }
.gallery-overlay { position:absolute; inset:0; background:rgba(0,0,0,.55); display:flex; flex-direction:column; align-items:center; justify-content:flex-end; padding:20px; opacity:0; transition:opacity .3s ease; }
.gallery-card:hover .gallery-overlay { opacity:1; }
.gallery-name { font-size:12px; font-weight:700; color:#fff; text-align:center; letter-spacing:.05em; margin-bottom:8px; }
.gallery-btn { background:rgba(255,255,255,.15); color:#fff; padding:10px 20px; font-size:8px; font-weight:700; letter-spacing:.15em; text-transform:uppercase; text-decoration:none; border:1px solid rgba(255,255,255,.4); display:inline-block; transition:background .2s; }
.gallery-btn:hover { background:rgba(255,255,255,.28); }
.gallery-bottom { position:absolute; bottom:0; left:0; right:0; padding:12px; background:linear-gradient(to top,rgba(0,0,0,.75) 0%,transparent 100%); }
.gallery-artist { font-size:9px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:#fff; }
.gallery-song { font-size:8px; letter-spacing:.12em; text-transform:uppercase; color:var(--accent); margin-top:2px; }

.crea-section { padding:88px 64px; background:var(--section-alt); position:relative; overflow:hidden; }
.crea-section::before { content:''; position:absolute; top:0; right:0; width:50%; height:100%; background:radial-gradient(ellipse at top right,var(--accent-ghost) 0%,transparent 65%); pointer-events:none; }
.crea-layout { display:grid; grid-template-columns:1fr 1fr; gap:80px; align-items:center; }
.crea-title { font-size:clamp(40px,4.5vw,64px) !important; line-height:.94; font-weight:700; letter-spacing:-.02em; margin-bottom:22px; }
.crea-title em { font-style:normal !important; font-weight:300 !important; color:var(--accent) !important; }
.crea-desc { font-size:15px !important; line-height:1.8; color:var(--fg-muted); max-width:400px; margin-bottom:36px; }
.crea-steps { display:flex; flex-direction:column; gap:18px; margin-bottom:44px; }
.crea-step { display:flex; align-items:flex-start; gap:16px; }
.step-num { width:28px; height:28px; flex-shrink:0; border:1px solid var(--accent); display:flex; align-items:center; justify-content:center; font-size:10px; font-weight:700; color:var(--accent); }
.step-title { font-size:15px !important; font-weight:700 !important; color:var(--fg); margin-bottom:3px; }
.step-desc { font-size:14px !important; line-height:1.6; color:var(--fg-muted); }
.video-wrapper { position:relative; overflow:hidden; background:var(--card-bg); }
.video-wrapper video { width:100%; display:block; aspect-ratio:9/16; object-fit:cover; }
.video-caption { position:absolute; bottom:0; left:0; right:0; padding:22px 16px 16px; background:linear-gradient(to top,rgba(0,0,0,.88) 0%,transparent 100%); }
.video-caption-label { font-size:8px; font-weight:700; letter-spacing:.25em; text-transform:uppercase; color:var(--accent); margin-bottom:4px; }
.video-caption-text { font-size:12px; font-weight:300; color:rgba(255,255,255,.7); line-height:1.5; }

.processo-section { padding:80px 64px; border-top:1px solid var(--divider); }
.processo-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:2px; margin-top:44px; }
.processo-item { background:var(--card-bg); padding:40px 32px; position:relative; overflow:hidden; transition:filter .25s; }
.processo-item:hover { filter:brightness(1.06); }
.processo-num { position:absolute; top:10px; right:16px; font-size:88px; font-weight:900; color:var(--accent-ghost); line-height:1; }
.processo-tag { font-size:8px; font-weight:700; letter-spacing:.25em; text-transform:uppercase; color:var(--accent); margin-bottom:14px; display:block; }
.processo-title { font-size:22px !important; font-weight:700 !important; color:var(--fg) !important; margin-bottom:12px; position:relative; z-index:1; }
.processo-desc { font-size:14px !important; line-height:1.75; color:var(--fg-muted); position:relative; z-index:1; }

.reviews-section { padding:80px 64px; background:var(--section-alt); }
.reviews-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:2px; margin-top:44px; }
.review-card { background:var(--card-bg); padding:32px; }
.review-stars { color:var(--accent); font-size:11px; letter-spacing:5px; margin-bottom:16px; }
.review-text { font-size:15px !important; font-weight:300; line-height:1.75; color:var(--fg-muted); margin-bottom:18px; }
.review-author { font-size:10px !important; font-weight:600; letter-spacing:.15em; text-transform:uppercase; color:var(--fg-muted); }
.review-author span { color:var(--accent); }

.artisti-section { padding:80px 64px; }
.artisti-grid { display:grid; grid-template-columns:repeat(5,1fr); gap:2px; margin-top:44px; }
.artista-card { background:var(--card-bg); padding:28px 20px; text-decoration:none; display:block; position:relative; overflow:hidden; border-bottom:2px solid transparent; transition:border-color .2s,background .2s; }
.artista-card:hover { border-bottom-color:var(--accent); background:var(--accent-ghost); }
.artista-name { font-size:15px !important; font-weight:700; color:var(--fg); margin-bottom:4px; line-height:1.2; }
.artista-sub { font-size:10px !important; font-weight:500; letter-spacing:.18em; text-transform:uppercase; color:var(--fg-muted); }
.artista-arrow { position:absolute; bottom:16px; right:16px; font-size:16px; color:var(--accent); opacity:0; transition:opacity .2s,transform .2s; }
.artista-card:hover .artista-arrow { opacity:1; transform:translateX(4px); }

.chi-siamo-section { padding:0; position:relative; overflow:hidden; }
.chi-siamo-inner { display:grid; grid-template-columns:1fr 1fr; min-height:520px; }
.chi-siamo-img { position:relative; overflow:hidden; }
.chi-siamo-img img { width:100%; height:100%; object-fit:cover; display:block; }
.chi-siamo-content { background:var(--accent); padding:80px 64px; display:flex; flex-direction:column; justify-content:center; position:relative; overflow:hidden; }
.chi-siamo-content::after { content:'UCN'; position:absolute; right:-20px; bottom:-40px; font-size:200px; font-weight:900; color:rgba(0,0,0,.07); line-height:1; pointer-events:none; }
.chi-siamo-tag { font-size:9px; font-weight:700; letter-spacing:.3em; text-transform:uppercase; color:rgba(255,255,255,.6); margin-bottom:20px; display:block; }
.chi-siamo-title { font-size:clamp(36px,3.8vw,56px) !important; line-height:.96; font-weight:700; letter-spacing:-.02em; color:var(--btn-fg); margin-bottom:20px; }
.chi-siamo-title em { font-style:normal; font-weight:300; }
.chi-siamo-text { font-size:15px !important; line-height:1.75; color:rgba(255,255,255,.82); margin-bottom:32px; max-width:400px; }
.chi-siamo-firma { font-size:11px; font-weight:700; letter-spacing:.2em; text-transform:uppercase; color:rgba(255,255,255,.5); }

.newsletter-section { padding:88px 64px; position:relative; overflow:hidden; }
.newsletter-section::before { content:''; position:absolute; inset:0; background:radial-gradient(ellipse at center bottom,var(--accent-ghost) 0%,transparent 60%); pointer-events:none; }
.newsletter-inner { max-width:580px; margin:0 auto; text-align:center; position:relative; z-index:1; display:flex; flex-direction:column; align-items:center; gap:0; }
.newsletter-tag { font-size:10px !important; font-weight:700 !important; letter-spacing:.3em !important; text-transform:uppercase !important; color:var(--accent) !important; display:block !important; margin-bottom:20px !important; }
.newsletter-inner .ucn-h2 { text-align:center !important; margin-bottom:20px !important; }
.newsletter-inner .ucn-desc { text-align:center !important; margin-bottom:28px !important; }
.newsletter-badge { display:inline-flex; align-items:center; gap:10px; border:1px solid var(--accent); padding:7px 18px; margin-bottom:28px; }
.badge-text { font-size:10px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:var(--accent); }
.newsletter-form { display:flex; flex-direction:column; align-items:center; gap:10px; width:100%; }
.newsletter-row { display:flex; gap:0; width:100%; max-width:440px; }
.newsletter-input { flex:1; background:var(--input-bg); border:1px solid var(--divider); border-right:none; color:var(--fg); padding:13px 16px; font-family:'Helvetica Neue',Helvetica,Arial,sans-serif; font-size:13px; font-weight:300; outline:none; transition:border-color .2s; }
.newsletter-input::placeholder { color:var(--fg-muted); }
.newsletter-input:focus { border-color:var(--accent); }
.newsletter-submit { background:var(--accent); color:var(--btn-fg); border:none; padding:13px 22px; font-family:'Helvetica Neue',Helvetica,Arial,sans-serif; font-size:10px; font-weight:700; letter-spacing:.18em; text-transform:uppercase; transition:opacity .2s; white-space:nowrap; cursor:pointer;}
.newsletter-submit:hover { opacity:.85; }
.newsletter-submit:disabled { opacity:.5; }
.newsletter-msg { font-size:12px; color:var(--accent); font-weight:600; min-height:18px; }
.newsletter-privacy { font-size:10px; color:var(--fg-muted); line-height:1.5; }
.newsletter-privacy a { color:var(--accent); text-decoration:none; }

.footer-cta { padding:100px 64px; text-align:center; position:relative; overflow:hidden; }
.footer-cta::before { content:''; position:absolute; inset:0; background:radial-gradient(ellipse at center,var(--accent-ghost) 0%,transparent 65%); }
.footer-cta .ucn-h2 { position:relative; z-index:1; text-align:center !important; margin-bottom:18px !important; }
.footer-cta .ucn-desc { position:relative; z-index:1; text-align:center !important; margin-bottom:44px !important; }
.footer-cta-btns { display:flex; gap:12px; justify-content:center; position:relative; z-index:1; flex-wrap:wrap; }

/* ==========================================================================
   MEDIA QUERIES (MOBILE)
   ========================================================================== */

@media (max-width: 860px) {
  .hero { grid-template-columns:1fr; min-height:auto; }
  .hero-left { padding:80px 20px 36px; }
  .hero-title { font-size:clamp(52px,14vw,80px) !important; }
  .hero-subtitle { font-size:clamp(16px,4vw,22px) !important; }
  .hero-sub { font-size:15px !important; max-width:100%; }
  .hero-right { display:none; }
  .mobile-banner { display:block; }
  
  .top-sellers { padding:44px 0 28px; }
  .top-sellers .section-label { padding:0 20px; }
  .top-sellers .sellers-header { flex-direction:column; align-items:flex-start; gap:12px; margin-bottom:20px; padding:0 20px; }
  .top-sellers .sellers-footer { padding:0 20px; }
  .products-grid { grid-template-columns:1fr; gap:2px; }
  .product-card.mobile-banner-card { grid-column:span 1; }
  .product-card.mobile-banner-card .product-visual { aspect-ratio:3/4; }
  .product-card.mobile-square .product-visual { aspect-ratio:3/4; }
  .product-card.featured { grid-column:span 1; }
  .product-card.featured .product-visual { aspect-ratio:3/4; }
  .product-info { padding:12px 20px 16px; }
  .prod-info-name { font-size:15px !important; }
  .fmt-chip { font-size:8px !important; padding:4px 8px !important; }
  .sellers-footer { margin-top:24px; }
  
  .gallery-section { padding:0 20px 48px; }
  .gallery-grid { grid-template-columns:1fr 1fr; }
  
  .crea-section { padding:48px 20px; }
  .crea-layout { grid-template-columns:1fr; gap:36px; }
  .processo-section { padding:48px 20px; }
  .processo-grid { grid-template-columns:1fr; }
  .reviews-section { padding:48px 20px; }
  .reviews-grid { grid-template-columns:1fr; }
  .artisti-section { padding:48px 20px; }
  .artisti-grid { grid-template-columns:repeat(2,1fr); }
  
  .chi-siamo-inner { grid-template-columns:1fr; }
  .chi-siamo-img { height:auto; aspect-ratio:1/1; }
  .chi-siamo-img img { width:100%; height:100%; object-fit:cover; }
  .chi-siamo-content { padding:48px 20px; }
  
  .newsletter-section { padding:56px 20px; }
  .newsletter-row { flex-direction:column; }
  .newsletter-input { border-right:1px solid var(--divider); border-bottom:none; }
  .newsletter-submit { width:100%; }
  
  .footer-cta { padding:64px 20px; }
  .footer-cta-btns { flex-direction:column; align-items:center; }
}


/* ==========================================================================
   FORZATURA COLORI DINAMICI SU HEADER E ANNOUNCEMENT BAR (NATIVI HORIZON)
   ========================================================================== */

/* BARRA DEGLI ANNUNCI: Sfondo Accento, Testo in contrasto */
.header-announcements,
.announcement-bar,
.announcement-bar-slider,
#shopify-section-header-announcements > div {
  background-color: var(--accent) !important;
  color: var(--btn-fg) !important;
  border-bottom: none !important;
}

.header-announcements *,
.announcement-bar *,
.announcement-bar__message,
.announcement-bar__link {
  color: var(--btn-fg) !important;
}

/* HEADER: Sfondo Navigazione, Testo Foreground */
/* Sovrascrive i gradienti e i background nativi di Horizon */
#header-component,
#header-component .header__row,
#header-component .header__underlay-closed,
#header-component .header__underlay-open {
  background: var(--nav-bg) !important;
  background-color: var(--nav-bg) !important;
}

/* Applica il bordo inferiore UCN */
#header-component .header__row--top:not(.divider--page-width),
#header-component .header__row--top.divider--page-width .header__columns {
  border-bottom: 1px solid var(--divider) !important;
}

/* Colora il testo, i link e le icone (carrello, lente, account) */
#header-component .header__column a,
#header-component .header__column span:not(.icon-flag):not(.visually-hidden),
#header-component .list-menu__item,
#header-component .header__icon,
#header-component .header-actions__action,
#header-component .currency-code,
#header-component svg {
  color: var(--fg) !important;
  fill: currentColor !important;
}

/* Colore Hover per link e icone */
#header-component .header__column a:hover,
#header-component .list-menu__item:hover,
#header-component .header__icon:hover,
#header-component .header-actions__action:hover,
#header-component .header-actions__action:hover svg {
  color: var(--accent) !important;
}

/* MENU A TENDINA E SELETTORE LINGUA (Sottomenu) */
#header-component .menu-list__submenu,
#header-component .localization-wrapper,
#header-component .dropdown-localization {
  background-color: var(--bg) !important;
  border: 1px solid var(--divider) !important;
  box-shadow: 0 10px 30px rgba(0,0,0,0.5) !important;
}

/* Forza i link dentro i menu a tendina */
#header-component .menu-list__submenu .list-menu__item,
#header-component .localization-wrapper * {
  color: var(--fg) !important;
}

#header-component .menu-list__submenu .list-menu__item:hover,
#header-component .localization-wrapper *:hover {
  color: var(--accent) !important;
  background-color: transparent !important;
}

/* ==========================================================================
   OVERRIDE DEFINITIVO FOOTER HORIZON (Basato sul suo codice nativo)
   ========================================================================== */

/* 1. Sfondo del Footer (Target su .section-background e .section nativi) */
[id^="shopify-section-"][id*="footer"],
[id^="shopify-section-"][id*="footer"] .section-background,
[id^="shopify-section-"][id*="footer"] .section {
  background-color: var(--bg) !important;
  background: var(--bg) !important;
  background-image: none !important;
}

/* Rimuoviamo il bordo di default se presente e forziamo la nostra linea */
[id^="shopify-section-"][id*="footer"] {
  border-top: 1px solid var(--divider) !important;
}

/* 2. Neutralizzazione delle variabili dello Schema Colore di Horizon */
[id^="shopify-section-"][id*="footer"] [class*="color-"] {
  --color-background: var(--bg) !important;
  --color-foreground: var(--fg) !important;
  --color-heading: var(--fg) !important;
  --color-text: var(--fg) !important;
  --color-border: var(--divider) !important;
}

/* 3. Colore Testi Assoluto */
[id^="shopify-section-"][id*="footer"] *,
[id^="shopify-section-"][id*="footer"] h1,
[id^="shopify-section-"][id*="footer"] h2,
[id^="shopify-section-"][id*="footer"] h3,
[id^="shopify-section-"][id*="footer"] p,
[id^="shopify-section-"][id*="footer"] a,
[id^="shopify-section-"][id*="footer"] span,
[id^="shopify-section-"][id*="footer"] div {
  color: var(--fg) !important;
  -webkit-text-fill-color: var(--fg) !important; /* Forza iOS/Safari */
  opacity: 1 !important;
}

/* Footer principale: sfondo colore accento su tutta la sezione (non solo il pannello newsletter) */
/* .section-background è il layer posteriore, .section è il contenitore visibile sopra con il proprio sfondo dallo schema colore: vanno coperti entrambi */
#shopify-section-sections--28804110319941__footer_m9NzUG .section-background,
#shopify-section-sections--28804110319941__footer_m9NzUG .section {
  background-color: #E5007D !important;
}

/* Testo bianco su tutte le colonne del footer principale, escluso il form email che ha già il proprio schema chiaro */
#shopify-section-sections--28804110319941__footer_m9NzUG :is(h1, h2, h3, h4, p, span, a):not(form, form *) {
  color: #FFFFFF !important;
  -webkit-text-fill-color: #FFFFFF !important;
}

#shopify-section-sections--28804110319941__footer_m9NzUG a:not(form a):hover {
  color: #FFFFFF !important;
  opacity: 0.75 !important;
}

/* Bottone "Iscriviti" della newsletter: rettangolare, stessa altezza del campo email, testo colore accento invece che invisibile su nero */
#shopify-section-sections--28804110319941__footer_m9NzUG .email-signup__button {
  border-radius: 0 !important;
  background-color: #000000 !important;
  color: #FFFFFF !important;
  -webkit-text-fill-color: #FFFFFF !important;
  height: 48px !important;
  min-height: 48px !important;
  align-self: stretch !important;
}

/* Sfondo a piena larghezza, ma il contenuto deve mantenere un margine dai bordi reali dello schermo */
#shopify-section-sections--28804110319941__footer_m9NzUG .footer-content {
  padding-inline: clamp(20px, 5vw, 80px) !important;
  box-sizing: border-box !important;
}

/* Testi Muted (es. Copyright o descrizioni piccole) */
[id^="shopify-section-"][id*="footer"] small,
[id^="shopify-section-"][id*="footer"] .copyright__content {
  color: var(--fg-muted) !important;
  -webkit-text-fill-color: var(--fg-muted) !important;
}

/* 4. Icone SVG (Social, Frecce) — esclude le icone di pagamento, che devono restare a colori originali */
[id^="shopify-section-"][id*="footer"] svg:not(.payment-icons *),
[id^="shopify-section-"][id*="footer"] svg path:not(.payment-icons *) {
  fill: var(--fg) !important;
  color: var(--fg) !important;
}

/* 5. Effetto Hover */
[id^="shopify-section-"][id*="footer"] a:hover,
[id^="shopify-section-"][id*="footer"] a:hover *,
[id^="shopify-section-"][id*="footer"] a:hover svg,
[id^="shopify-section-"][id*="footer"] button:hover svg {
  color: var(--accent) !important;
  -webkit-text-fill-color: var(--accent) !important;
  fill: var(--accent) !important;
  transition: all 0.2s ease;
}

/* 6. Form Newsletter del Footer */
[id^="shopify-section-"][id*="footer"] input {
  background-color: var(--input-bg) !important;
  background: var(--input-bg) !important;
  color: var(--fg) !important;
  -webkit-text-fill-color: var(--fg) !important;
  border: 1px solid var(--divider) !important;
  box-shadow: none !important;
}

[id^="shopify-section-"][id*="footer"] input::placeholder {
  color: var(--fg-muted) !important;
  -webkit-text-fill-color: var(--fg-muted) !important;
  opacity: 1 !important;
}

[id^="shopify-section-"][id*="footer"] input:focus {
  border-color: var(--accent) !important;
  outline: none !important;
}

/* Tasto invio newsletter */
[id^="shopify-section-"][id*="footer"] button[type="submit"] {
  background-color: transparent !important;
  border: none !important;
}

/* ==========================================================================
   FIX ALLINEAMENTO ORIZZONTALE - TOP SELLERS
   ========================================================================== */

/* 1. Forza la distanza laterale di 64px su Desktop (uguale alle altre sezioni) */
.top-sellers {
  padding-left: 64px !important;
  padding-right: 64px !important;
}

/* 2. Forza la distanza laterale di 20px su Mobile e pulisce i vecchi margini interni sfalsati */
@media (max-width: 860px) {
  .top-sellers {
    padding-left: 20px !important;
    padding-right: 20px !important;
  }
  
  .top-sellers .section-label,
  .top-sellers .sellers-header,
  .top-sellers .sellers-footer {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
}


/* ==========================================================================
   UCN CART DRAWER — Override completo del drawer nativo Horizon
   ========================================================================== */

/* ── Pannello principale ── */
.cart-drawer__dialog {
  background-color: var(--bg) !important;
  border-left: 1px solid var(--divider) !important;
  box-shadow: -8px 0 40px rgba(0,0,0,.08) !important;
}

/* Neutralizza color-scheme Horizon dentro il drawer */
.cart-drawer__dialog [class*="color-"] {
  --color-background: var(--bg) !important;
  --color-foreground: var(--fg) !important;
  --color-border: var(--divider) !important;
  background-color: var(--bg) !important;
}
.cart-drawer__content { background-color: var(--bg) !important; }

/* ── Header ── */
.cart-drawer__header {
  padding: 20px 24px 16px !important;
  background: var(--bg) !important;
}
.cart-drawer__heading,
.cart-drawer__heading.h4 {
  font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif !important;
  font-size: 13px !important; font-weight: 700 !important;
  letter-spacing: .22em !important; text-transform: uppercase !important;
  color: var(--fg) !important;
}
.cart-drawer__heading .badge,
.cart-drawer__heading [class*="badge"] {
  background: var(--accent) !important; color: var(--btn-fg) !important;
  border-radius: 0 !important; font-size: 9px !important;
  font-weight: 700 !important; padding: 2px 7px !important;
}

/* ── Bottone chiudi ── */
.cart-drawer__close-button,
.cart-drawer__close-button svg { color: var(--fg-muted) !important; fill: var(--fg-muted) !important; }
.cart-drawer__close-button:hover,
.cart-drawer__close-button:hover svg { color: var(--accent) !important; fill: var(--accent) !important; }

/* ── Item rows ── */
.cart-drawer .cart-items__table-row {
  padding: 20px 24px !important; border-bottom: 1px solid var(--divider) !important;
  margin-bottom: 0 !important; transition: background .2s !important;
}
.cart-drawer .cart-items__table-row:hover { background: var(--section-alt) !important; }
.cart-drawer .cart-items__image-wrapper { background: var(--card-bg) !important; border-radius: 0 !important; border: none !important; }
.cart-drawer .cart-primary-typography {
  font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif !important;
  font-size: 13px !important; font-weight: 700 !important; color: var(--fg) !important;
}
.cart-drawer .cart-secondary-typography {
  font-size: 10px !important; font-weight: 600 !important;
  letter-spacing: .12em !important; text-transform: uppercase !important;
  color: var(--fg-muted) !important;
}
.cart-drawer [class*="price"] {
  font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif !important;
  font-size: 14px !important; font-weight: 700 !important; color: var(--fg) !important;
}

/* ── Quantity selector ── */
.cart-drawer quantity-selector-component button {
  border-radius: 0 !important; background: transparent !important;
  border-color: var(--divider) !important; color: var(--fg) !important;
}
.cart-drawer quantity-selector-component button:hover {
  background: var(--accent-ghost) !important; color: var(--accent) !important;
}
.cart-drawer quantity-selector-component input {
  font-weight: 700 !important; color: var(--fg) !important;
  border-color: var(--divider) !important; border-radius: 0 !important;
  background: transparent !important;
}

/* ── Summary / Totali ── */
.cart-drawer__summary,
.cart-drawer .cart-totals {
  background: var(--bg) !important;
  border-top: 1px solid var(--divider) !important;
  padding: 20px 24px !important;
}
.cart-drawer .cart-totals__item { padding: 8px 0 !important; border-bottom: 1px solid var(--divider) !important; }
.cart-drawer .cart-totals__item:last-of-type { border-bottom: none !important; }
.cart-drawer .cart-totals__total-label,
.cart-drawer .cart-totals__original-label {
  font-size: 9px !important; font-weight: 700 !important;
  letter-spacing: .2em !important; text-transform: uppercase !important;
  color: var(--fg-muted) !important;
}
.cart-drawer .cart-totals__total-value {
  font-size: 20px !important; font-weight: 900 !important;
  letter-spacing: -.02em !important; color: var(--accent) !important;
}
.cart-drawer .cart-totals__original-value {
  font-size: 14px !important; font-weight: 700 !important; color: var(--fg) !important;
}
.cart-drawer .cart-totals__tax-note {
  font-size: 10px !important; color: var(--fg-muted) !important;
  font-weight: 300 !important; line-height: 1.6 !important;
}

/* ── Codice sconto ── */
.cart-drawer .cart-discount__label,
.cart-drawer .cart-note__label {
  font-size: 9px !important; font-weight: 700 !important;
  letter-spacing: .18em !important; text-transform: uppercase !important;
  color: var(--fg-muted) !important;
}
.cart-drawer .cart-discount__input,
.cart-drawer .cart-note__instructions {
  background: var(--input-bg) !important; border: 1px solid var(--divider) !important;
  border-radius: 0 !important; color: var(--fg) !important;
  font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif !important;
}
.cart-drawer .cart-discount__input:focus { border-color: var(--accent) !important; outline: none !important; }

/* ── Bottone CHECKOUT ── */
.cart-drawer .cart__checkout-button {
  background: var(--accent) !important; color: var(--btn-fg) !important;
  border: none !important; border-radius: 0 !important;
  font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif !important;
  font-size: 11px !important; font-weight: 700 !important;
  letter-spacing: .22em !important; text-transform: uppercase !important;
  padding: 18px 24px !important; width: 100% !important;
  transition: opacity .2s !important;
}
.cart-drawer .cart__checkout-button:hover { opacity: .85 !important; }

/* ── Checkout dinamico (Shop Pay, PayPal, Apple Pay) ── */
.cart-drawer .shopify-payment-button__button { border-radius: 0 !important; }
.cart-drawer .shopify-payment-button__more-options {
  font-size: 9px !important; font-weight: 700 !important;
  letter-spacing: .15em !important; text-transform: uppercase !important;
  color: var(--fg-muted) !important;
}

/* ==========================================================================
   UCN CART DRAWER — Empty state
   ========================================================================== */

/* Layout contenitore vuoto */
.cart-drawer--empty .cart-drawer__content {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 48px 32px !important;
  text-align: center !important;
  gap: 20px !important;
}

/* Titolo "IL TUO CARRELLO È VUOTO" */
.cart-drawer__heading--empty {
  font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif !important;
  font-size: clamp(28px, 5vw, 40px) !important;
  font-weight: 900 !important;
  letter-spacing: -.02em !important;
  line-height: .96 !important;
  text-transform: none !important;
  color: var(--fg) !important;
  margin-bottom: 0 !important;
}

/* Riga accent decorativa prima del titolo */
.cart-drawer--empty .cart-drawer__header {
  padding: 14px 24px !important;
}

/* Paragrafo login */
.cart-drawer--empty .cart-drawer__items p {
  font-size: 13px !important;
  font-weight: 300 !important;
  color: var(--fg-muted) !important;
  line-height: 1.7 !important;
  max-width: 260px !important;
  margin: 0 auto !important;
}

/* Link "Accedi" dentro il paragrafo */
.cart-drawer--empty .cart-drawer__items p a {
  color: var(--accent) !important;
  font-weight: 600 !important;
  text-decoration: none !important;
  border-bottom: 1px solid var(--accent) !important;
}

/* Bottone "Continua la shopping" */
.cart-items__empty-button {
  display: inline-block !important;
  background: var(--accent) !important;
  color: var(--btn-fg) !important;
  border: none !important;
  border-radius: 0 !important;
  font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif !important;
  font-size: 10px !important;
  font-weight: 700 !important;
  letter-spacing: .22em !important;
  text-transform: uppercase !important;
  padding: 16px 32px !important;
  text-decoration: none !important;
  transition: opacity .2s !important;
  margin-top: 8px !important;
}
.cart-items__empty-button:hover {
  opacity: .85 !important;
  background: var(--accent) !important;
  color: var(--btn-fg) !important;
}

/* Forza testo bianco sul bottone checkout drawer */
.cart-drawer .cart__checkout-button,
.cart-drawer .cart__checkout-button *,
.cart-drawer .cart__checkout-button .button-text,
.cart-drawer .cart__checkout-button span {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

/* CUSTOM CODE START */
.ucn-nav-root {
  position: relative;
  z-index: 200;
  width: 100%;
  background: var(--nav-bg);
  border-bottom: 1px solid var(--nav-border);
  font-family: var(--nav-font);
}

.ucn-nav-root--sticky {
  position: sticky;
  top: 0;
}

.ucn-nav-bar {
  display: flex;
  align-items: center;
  height: var(--nav-h);
  padding: 0 48px;
  position: relative;
}

.ucn-nav-logo {
  flex-shrink: 0;
  text-decoration: none;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--nav-fg);
  line-height: 1;
  margin-right: 48px;
}

.ucn-nav-logo em {
  font-style: normal;
  font-weight: 300;
  color: var(--nav-fg-muted);
}

.ucn-nav-logo-img {
  height: var(--ucn-logo-h-desktop, 22px);
  width: auto;
  display: block;
}

.ucn-nav-links {
  display: flex;
  align-items: center;
  gap: 0;
  list-style: none;
  flex: 1;
}

.ucn-nav-item {
  position: relative;
}

.ucn-nav-link {
  display: flex;
  align-items: center;
  gap: 5px;
  height: var(--nav-h);
  padding: 0 18px;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .18em;
  text-transform: uppercase;
  text-decoration: none;
  color: var(--nav-fg-muted);
  white-space: nowrap;
  transition: color .18s;
  position: relative;
  border: none;
  background: none;
  cursor: pointer;
  font-family: var(--nav-font);
}

.ucn-nav-link::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 18px;
  right: 18px;
  height: 2px;
  background: var(--nav-accent);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform .25s ease;
}

.ucn-nav-item:hover > .ucn-nav-link,
.ucn-nav-item.open > .ucn-nav-link {
  color: var(--nav-fg);
}

.ucn-nav-item:hover > .ucn-nav-link::after,
.ucn-nav-item.open > .ucn-nav-link::after {
  transform: scaleX(1);
}

.ucn-nav-chevron {
  width: 8px;
  height: 8px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: transform .2s;
  opacity: .45;
}

.ucn-nav-chevron svg {
  display: block;
}

.ucn-nav-item:hover .ucn-nav-chevron {
  transform: rotate(180deg);
  opacity: .9;
}

.ucn-nav-link.cta {
  color: var(--nav-accent);
  letter-spacing: .16em;
}

.ucn-nav-link.cta::after {
  background: var(--nav-accent);
}

.ucn-nav-hamburger {
  display: none;
  margin-left: auto;
  width: 40px;
  height: 40px;
  background: none;
  border: none;
  cursor: pointer;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 5px;
  padding: 0;
}

.ucn-nav-lang-mobile {
  display: flex;
  align-items: center;
  position: relative;
}

.ucn-nav-lang-mobile .dropdown-localization {
  position: static;
}

.ucn-nav-lang-flag {
  font-size: 17px;
  line-height: 1;
}

.ucn-nav-lang-mobile-panel {
  position: absolute;
  top: calc(100% + 10px);
  right: 0;
  width: min(240px, calc(100vw - 24px));
  z-index: 350;
  padding: 12px;
  border: 1px solid var(--nav-border);
  border-radius: 18px;
  box-shadow: 0 12px 40px rgba(0,0,0,.09);
  background: var(--drop-bg);
}

.ucn-nav-lang-links {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.ucn-nav-lang-links a {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 9px 10px;
  border-radius: 8px;
  font-family: var(--nav-font);
  font-size: 13px;
  color: var(--nav-fg);
  text-decoration: none;
  transition: background .15s;
}

.ucn-nav-lang-links a:hover {
  background: var(--drop-alt);
}

.ucn-nav-lang-links a.active {
  font-weight: 700;
  background: var(--drop-alt);
}

.ucn-nav-hamburger span {
  display: block;
  width: 24px;
  height: 2px;
  background: var(--nav-fg);
  border-radius: 1px;
  transition: transform .25s ease, opacity .2s;
}

.ucn-nav-hamburger.open span:nth-child(1) {
  transform: translateY(6.5px) rotate(45deg);
}

.ucn-nav-hamburger.open span:nth-child(2) {
  opacity: 0;
  transform: scaleX(0);
}

.ucn-nav-hamburger.open span:nth-child(3) {
  transform: translateY(-6.5px) rotate(-45deg);
}

.ucn-drop-simple {
  position: absolute;
  top: calc(var(--nav-h) - 1px);
  left: 0;
  min-width: 220px;
  background: var(--drop-bg);
  border: 1px solid var(--nav-border);
  border-top: 2px solid var(--nav-accent);
  box-shadow: 0 12px 40px rgba(0,0,0,.09);
  opacity: 0;
  pointer-events: none;
  transform: translateY(6px);
  transition: opacity .22s ease, transform .22s ease;
  z-index: 10;
}

.ucn-nav-item:hover .ucn-drop-simple {
  opacity: 1;
  pointer-events: auto;
  transform: none;
}

.ucn-drop-simple ul {
  list-style: none;
  padding: 8px 0;
}

.ucn-drop-simple li a {
  display: block;
  padding: 10px 22px;
  font-size: 9.5px;
  font-weight: 700;
  letter-spacing: .16em;
  text-transform: uppercase;
  text-decoration: none;
  color: var(--nav-fg-muted);
  transition: color .15s, padding-left .15s;
  white-space: nowrap;
}

.ucn-drop-simple li a:hover {
  color: var(--nav-accent);
  padding-left: 28px;
}

.ucn-mega {
  position: fixed;
  top: var(--nav-h);
  left: 0;
  right: 0;
  background: var(--drop-bg);
  border-top: 2px solid var(--nav-accent);
  border-bottom: 1px solid var(--nav-border);
  box-shadow: 0 16px 56px rgba(0,0,0,.1);
  opacity: 0;
  pointer-events: none;
  transform: translateY(-8px);
  transition: opacity .28s ease, transform .28s ease;
  z-index: 300;
  will-change: opacity, transform;
}

.ucn-nav-item:hover .ucn-mega,
.ucn-mega:hover {
  opacity: 1;
  pointer-events: auto;
  transform: none;
}

.ucn-mega-inner {
  display: grid;
  grid-template-columns: 260px 1fr 240px;
  min-height: 280px;
  max-height: calc(100vh - var(--nav-h) - 40px);
  overflow: hidden;
}

.ucn-mega-aside {
  padding: 40px 36px;
  background: var(--drop-alt);
  border-right: 1px solid var(--nav-border);
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  flex-shrink: 0;
}

.ucn-mega-aside-label {
  font-size: 9px;
  font-weight: 700;
  letter-spacing: .28em;
  text-transform: uppercase;
  color: var(--nav-accent);
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 20px;
}

.ucn-mega-aside-label::before {
  content: '';
  width: 22px;
  height: 1px;
  background: var(--nav-accent);
}

.ucn-mega-aside-title {
  font-size: clamp(26px, 2.5vw, 36px);
  font-weight: 900;
  letter-spacing: -.03em;
  line-height: .94;
  color: var(--nav-fg);
}

.ucn-mega-aside-title em {
  font-style: normal;
  font-weight: 300;
  color: var(--nav-accent);
}

.ucn-mega-aside-desc {
  font-size: 12px;
  font-weight: 300;
  line-height: 1.7;
  color: var(--nav-fg-muted);
  margin-top: 16px;
}

.ucn-mega-aside-count {
  font-size: 9px;
  font-weight: 700;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: var(--nav-fg-muted);
  margin-top: auto;
  padding-top: 24px;
}

.ucn-mega-links {
  padding: 32px 40px;
  overflow-y: auto;
}

.ucn-mega-grid {
  display: grid;
  grid-template-columns: repeat(var(--mega-cols), 1fr);
  gap: 0;
}

.ucn-mega-grid-link {
  display: flex;
  align-items: center;
  padding: 10px 16px 10px 0;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
  text-decoration: none;
  color: var(--nav-fg-muted);
  border-bottom: 1px solid var(--nav-border);
  transition: color .15s, padding-left .15s;
  position: relative;
}

.ucn-mega-grid-link::before {
  content: '';
  width: 0;
  height: 1.5px;
  background: var(--nav-accent);
  margin-right: 0;
  transition: width .18s ease, margin-right .18s ease;
  flex-shrink: 0;
}

.ucn-mega-grid-link:hover {
  color: var(--nav-fg);
  padding-left: 8px;
}

.ucn-mega-grid-link:hover::before {
  width: 16px;
  margin-right: 8px;
}

.ucn-mega-cta-link {
  grid-column: 1 / -1;
  margin-top: 16px;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .2em;
  text-transform: uppercase;
  text-decoration: none;
  color: var(--nav-fg);
  border-bottom: 2px solid var(--nav-fg);
  padding-bottom: 2px;
  transition: color .2s, border-color .2s;
  width: fit-content;
}

.ucn-mega-cta-link:hover {
  color: var(--nav-accent);
  border-color: var(--nav-accent);
}

.ucn-mega-visual {
  background: var(--drop-alt);
  border-left: 1px solid var(--nav-border);
  display: flex;
  flex-direction: column;
  overflow: hidden;
  flex-shrink: 0;
}

.ucn-mega-visual-img {
  flex: 1;
  overflow: hidden;
  position: relative;
  min-height: 160px;
}

.ucn-mega-visual-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform .5s ease;
}

.ucn-mega-visual:hover .ucn-mega-visual-img img {
  transform: scale(1.04);
}

.ucn-mega-visual-body {
  padding: 16px 20px;
  border-top: 1px solid var(--nav-border);
}

.ucn-mega-visual-label {
  font-size: 8px;
  font-weight: 700;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--nav-accent);
  margin-bottom: 6px;
}

.ucn-mega-visual-title {
  font-size: 13px;
  font-weight: 700;
  letter-spacing: -.01em;
  color: var(--nav-fg);
  line-height: 1.25;
  margin-bottom: 10px;
}

.ucn-mega-visual-link {
  font-size: 9px;
  font-weight: 700;
  letter-spacing: .18em;
  text-transform: uppercase;
  text-decoration: none;
  color: var(--nav-fg-muted);
  transition: color .2s;
}

.ucn-mega-visual-link:hover {
  color: var(--nav-accent);
}

.ucn-nav-actions {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 0;
  margin-left: auto;
  flex-shrink: 0;
  height: var(--nav-h);
}

.ucn-nav-icon-link,
.ucn-nav-cart-drawer .header-actions__action,
.ucn-nav-cart-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  flex-shrink: 0;
  color: var(--nav-fg-muted);
  text-decoration: none;
  background: none;
  border: none;
  cursor: pointer;
  padding: 0;
  font-family: var(--nav-font);
  position: relative;
  transition: color .18s;
}

.ucn-nav-icon-link:hover,
.ucn-nav-cart-drawer .header-actions__action:hover,
.ucn-nav-cart-link:hover {
  color: var(--nav-fg);
}

.ucn-nav-icon-link svg,
.ucn-nav-cart-drawer .header-actions__action svg,
.ucn-nav-cart-link svg {
  display: block;
  pointer-events: none;
}

.ucn-nav-cart-drawer,
.ucn-nav-cart-link {
  display: inline-flex;
  align-items: center;
  height: 40px;
  flex-shrink: 0;
}

.ucn-nav-cart-drawer {
  --cart-drawer-padding: var(--padding-xl) var(--padding-xl);
  --cart-drawer-padding-desktop: var(--padding-xl) var(--padding-2xl);
}

@media screen and (min-width: 750px) {
  .ucn-nav-cart-drawer {
    margin-inline-end: calc(var(--gap-xs) * -1);
  }
}

.ucn-nav-cart-drawer .cart-drawer__dialog {
  position: fixed;
  inset: 0 0 0 auto;
  overflow: hidden;
  border-radius: 0;
  width: 100%;
  height: 100%;
  margin: 0 0 0 auto;
  padding: 0;
  border-left: var(--style-border-drawer);
  box-shadow: var(--shadow-drawer);
  background-color: var(--color-background);
}

@media screen and (min-width: 750px) {
  .ucn-nav-cart-drawer .cart-drawer__dialog {
    width: var(--sidebar-width);
    max-width: 95vw;
  }
}

.ucn-nav-cart-drawer .cart-drawer__dialog:modal {
  max-height: 100dvh;
  overflow-y: hidden;
}

.ucn-nav-cart-drawer .cart-drawer__inner {
  height: 100%;
  overflow: hidden;
}

.ucn-nav-cart-drawer .cart-drawer__content {
  height: calc(100% - var(--header-height));
  display: flex;
  flex-direction: column;
  padding: 0;
  background-color: var(--color-background);
  flex-grow: 1;
  overflow-y: auto;
}

.ucn-nav-cart-drawer .cart-drawer__header {
  background-color: var(--color-background);
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  padding: var(--cart-drawer-padding);
  border-bottom: var(--style-border-width) solid transparent;
  position: sticky;
  top: 0;
  z-index: 1;
}

@media screen and (min-width: 750px) {
  .ucn-nav-cart-drawer .cart-drawer__header {
    padding-inline: var(--cart-drawer-padding-desktop);
  }
}

.ucn-nav-cart-drawer .cart-drawer__close-button {
  margin-right: calc(var(--padding-sm) * -1);
  top: var(--margin-sm);
}

@media screen and (max-width: 749px) {
  .ucn-nav-cart-drawer .cart-drawer__close-button {
    top: var(--margin-2xs);
  }
}

.ucn-nav-cart-drawer .cart-drawer__heading {
  display: flex;
  align-items: center;
  gap: var(--gap-xs);
  margin-bottom: 0;
}

.ucn-nav-cart-drawer .cart-drawer__items {
  display: flex;
  flex-direction: column;
  padding-inline: var(--cart-drawer-padding);
  overflow-y: auto;
}

@media screen and (min-width: 750px) {
  .ucn-nav-cart-drawer .cart-drawer__items {
    padding-inline: var(--cart-drawer-padding-desktop);
  }
}

.ucn-nav-cart-drawer .cart-drawer__summary {
  --cart-drawer-summary-padding: var(--padding-lg);
  position: sticky;
  bottom: 0;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--gap-xl);
  padding: var(--cart-drawer-summary-padding);
  margin-top: auto;
  background-color: var(--color-background);
  mask-image: linear-gradient(to bottom, transparent, black var(--cart-drawer-summary-padding));
}

@media screen and (min-width: 750px) {
  .ucn-nav-cart-drawer .cart-drawer__summary {
    --cart-drawer-summary-padding: var(--padding-2xl);
  }
}

.ucn-nav-cart-drawer .cart-drawer__dialog[cart-summary-sticky='false'] .cart-drawer__summary {
  position: static;
  mask-image: none;
}

.ucn-nav-cart-drawer .cart-drawer__dialog[cart-summary-sticky='false'] .cart-drawer__items {
  overflow: unset;
}

.ucn-nav-cart-drawer.cart-drawer--empty .cart-drawer__inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  height: 100dvh;
  margin-top: 0;
}

.ucn-nav-cart-drawer.cart-drawer--empty .cart-drawer__content {
  text-align: center;
  min-height: auto;
  justify-content: center;
}

.ucn-nav-cart-drawer.cart-drawer--empty .cart-drawer__header {
  justify-content: right;
  border-bottom: none;
  padding-bottom: 0;
}

.ucn-nav-cart-drawer cart-icon,
.ucn-nav-cart-link cart-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.ucn-nav-cart-drawer .header-actions__cart-icon,
.ucn-nav-cart-link .header-actions__cart-icon {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: inherit;
}

.ucn-nav-cart-drawer .header-actions__cart-icon .cart-bubble,
.ucn-nav-cart-link .header-actions__cart-icon .cart-bubble {
  position: absolute;
  top: -3px;
  right: -11px;
  min-width: 15px;
  width: auto;
  height: 15px;
  padding-inline: 3px;
  color: #fff;
}

.ucn-nav-cart-drawer .header-actions__cart-icon .cart-bubble__background,
.ucn-nav-cart-link .header-actions__cart-icon .cart-bubble__background {
  background: var(--nav-accent);
}

.ucn-nav-cart-drawer .header-actions__cart-icon .cart-bubble__text,
.ucn-nav-cart-link .header-actions__cart-icon .cart-bubble__text {
  font-size: 8px;
  font-weight: 700;
}

.ucn-nav-localization {
  position: relative;
  display: inline-flex;
  align-items: center;
  height: 40px;
  flex-shrink: 0;
}

.ucn-nav-localization .dropdown-localization {
  position: static;
}

.ucn-nav-localization-button {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  height: 40px;
  padding: 0 8px;
  border: none;
  background: transparent;
  color: var(--nav-fg-muted);
  font-family: var(--nav-font);
  font-size: 9px;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
  cursor: pointer;
  transition: color .18s;
}

.ucn-nav-localization-button:hover,
.ucn-nav-localization-button[aria-expanded='true'] {
  color: var(--nav-fg);
}

.ucn-nav-localization-button .icon-caret {
  width: 8px;
  height: 8px;
  opacity: .55;
}

.ucn-nav-localization-panel {
  position: absolute;
  top: calc(100% + 10px);
  right: 0;
  width: min(340px, calc(100vw - 32px));
  z-index: 350;
  padding: 12px;
  border: 1px solid var(--nav-border);
  border-radius: 18px;
  box-shadow: 0 12px 40px rgba(0,0,0,.09);
  background: var(--drop-bg);
}

.ucn-nav-localization-panel,
.ucn-nav-localization-panel localization-form-component,
.ucn-nav-localization-panel .localization-form,
.ucn-nav-localization-panel .localization-form__list-item,
.ucn-nav-localization-panel .localization-form__select,
.ucn-nav-localization-panel .localization-form__currency,
.ucn-nav-localization-panel .country,
.ucn-nav-localization-panel .language-selector {
  color: var(--nav-fg);
  font-family: var(--nav-font);
}

.ucn-nav-localization-panel localization-form-component {
  display: block;
  width: 100%;
}

.ucn-nav-localization-panel .localization-form {
  display: flex;
  flex-direction: column;
  width: 100%;
  height: min(560px, calc(100vh - 140px));
  min-height: 0;
}

.ucn-nav-localization-panel .country-filter {
  padding-bottom: 12px;
}

.ucn-nav-localization-panel .country-selector-form__wrapper {
  display: flex;
  flex-direction: column;
  flex: 1;
  min-height: 0;
}

.ucn-nav-localization-panel .localization-form__list {
  flex: 1;
  min-height: 0;
  overflow-y: auto;
  padding-right: 2px;
  scrollbar-width: none;
  -ms-overflow-style: none;
}

.ucn-nav-localization-panel .localization-form__list::-webkit-scrollbar {
  display: none;
}

.ucn-nav-localization-panel .localization-form__list-item {
  border-radius: 12px;
}

.ucn-nav-localization-panel .localization-form__currency {
  opacity: 0;
  transition: opacity .18s ease;
}

.ucn-nav-localization-panel .localization-form__list-item[aria-current='true'] .localization-form__currency,
.ucn-nav-localization-panel .localization-form__list-item:hover .localization-form__currency,
.ucn-nav-localization-panel .localization-form__list-item:focus-within .localization-form__currency {
  opacity: 1;
}

.ucn-nav-localization-panel .language-selector {
  display: grid;
  grid-template-columns: auto 1fr auto auto;
  align-items: center;
  gap: 12px;
  flex-shrink: 0;
  margin-top: 12px;
  padding: 16px 2px 0;
  border-top: 1px solid var(--nav-border);
  background: var(--drop-bg);
}

.ucn-nav-localization-panel .language-selector__label {
  display: block;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--nav-fg-muted);
}

.ucn-nav-localization-panel .localization-form__select {
  appearance: none;
  justify-self: end;
  border: none;
  background: transparent;
  padding: 0;
  color: currentColor;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
  cursor: pointer;
}

.ucn-nav-localization-panel .localization-form__select:focus {
  outline: none;
}

.ucn-nav-localization-panel .language-selector .icon-caret {
  width: 8px;
  height: 8px;
  opacity: .55;
  pointer-events: none;
}

.ucn-account-btn shopify-account {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  color: inherit;
}

.ucn-account-icon-slot {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.ucn-account-btn .account-button__fallback {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background-color: var(--nav-accent);
}

.ucn-nav-overlay {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 500;
  background: var(--nav-bg);
  flex-direction: column;
  overflow: hidden;
}

.ucn-nav-overlay.open {
  display: flex;
}

.ucn-nav-overlay-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 20px;
  height: 56px;
  flex-shrink: 0;
  border-bottom: 1px solid var(--nav-border);
}

.ucn-nav-overlay-logo {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--nav-fg);
  text-decoration: none;
}

.ucn-nav-overlay-logo em {
  font-style: normal;
  font-weight: 300;
  color: var(--nav-fg-muted);
}

.ucn-nav-overlay-close {
  width: 36px;
  height: 36px;
  background: none;
  border: none;
  cursor: pointer;
  font-size: 20px;
  color: var(--nav-fg-muted);
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--nav-font);
  transition: color .2s;
}

.ucn-nav-overlay-close:hover {
  color: var(--nav-accent);
}

.ucn-nav-overlay-body {
  flex: 1;
  overflow-y: auto;
  padding: 12px 0 24px;
}

.ucn-mob-link {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px 24px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .2em;
  text-transform: uppercase;
  text-decoration: none;
  color: var(--nav-fg);
  border-bottom: 1px solid var(--nav-border);
  background: none;
  border-right: none;
  border-left: none;
  border-top: none;
  width: 100%;
  text-align: left;
  cursor: pointer;
  font-family: var(--nav-font);
  transition: color .15s, background .15s;
}

.ucn-mob-link:hover {
  color: var(--nav-accent);
}

.ucn-mob-link.cta {
  color: var(--nav-accent);
}

.ucn-mob-toggle {
  width: 24px;
  height: 24px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  transition: transform .22s ease;
  opacity: .5;
}

.ucn-mob-item.open .ucn-mob-toggle {
  transform: rotate(180deg);
  opacity: 1;
}

.ucn-mob-sub {
  display: none;
  background: var(--drop-alt);
  border-bottom: 1px solid var(--nav-border);
  padding: 8px 0;
}

.ucn-mob-item.open .ucn-mob-sub {
  display: block;
}

.ucn-mob-sub-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  padding: 0 20px;
  gap: 0;
}

.ucn-mob-sub-link {
  display: block;
  padding: 11px 6px;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
  text-decoration: none;
  color: var(--nav-fg-muted);
  border-bottom: 1px solid var(--nav-border);
  transition: color .15s;
}

.ucn-mob-sub-link:hover {
  color: var(--nav-accent);
}

.ucn-mob-sub-cta {
  display: block;
  padding: 14px 26px;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .18em;
  text-transform: uppercase;
  text-decoration: none;
  color: var(--nav-fg);
  transition: color .15s;
}

.ucn-mob-sub-cta:hover {
  color: var(--nav-accent);
}

.ucn-nav-overlay-main {
  display: flex;
  flex-direction: column;
  flex: 1;
  overflow: hidden;
}

.ucn-nav-overlay-main[hidden] {
  display: none;
}

.ucn-nav-overlay-loc-trigger-wrap {
  flex-shrink: 0;
  padding: 16px 24px;
  border-top: 1px solid var(--nav-border);
}

.ucn-nav-loc-trigger {
  display: flex;
  align-items: center;
  gap: 6px;
  background: none;
  border: none;
  cursor: pointer;
  font-family: var(--nav-font);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--nav-fg-muted);
  padding: 0;
  transition: color .15s;
}

.ucn-nav-loc-trigger:hover {
  color: var(--nav-fg);
}

.ucn-nav-loc-trigger-arrow {
  font-size: 18px;
  line-height: 1;
  font-weight: 300;
}

.ucn-nav-overlay-loc-panel {
  display: flex;
  flex-direction: column;
  flex: 1;
  overflow: hidden;
}

.ucn-nav-overlay-loc-panel[hidden] {
  display: none;
}

.ucn-nav-overlay-loc-panel-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 20px;
  height: 52px;
  flex-shrink: 0;
  border-bottom: 1px solid var(--nav-border);
}

.ucn-nav-loc-panel-title {
  font-family: var(--nav-font);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--nav-fg);
}

.ucn-nav-loc-back {
  width: 36px;
  height: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: none;
  border: none;
  cursor: pointer;
  color: var(--nav-fg-muted);
  padding: 0;
  transition: color .15s;
}

.ucn-nav-loc-back:hover {
  color: var(--nav-fg);
}

.ucn-nav-overlay-loc-panel-body {
  flex: 1;
  overflow-y: auto;
}

.ucn-nav-overlay-loc-panel-body localization-form-component {
  display: block;
  width: 100%;
}

.ucn-nav-overlay-loc-panel-body .localization-form {
  display: flex;
  flex-direction: column;
}

.ucn-nav-overlay-loc-panel-body .country-selector-form__wrapper {
  max-height: none;
  overflow-y: visible;
  padding: 0 20px;
}

.ucn-nav-overlay-loc-panel-body .country-filter {
  padding-inline: 20px;
}

.ucn-nav-overlay-loc-panel-body .language-selector {
  padding: 16px 20px;
  border-top: 1px solid var(--nav-border);
}

.ucn-nav-overlay-loc-panel-body .localization-form__select {
  font-family: var(--nav-font);
  color: var(--nav-fg);
  background: transparent;
  max-width: none;
}

.ucn-nav-overlay-localization .localization-wrapper,
.ucn-nav-overlay-localization localization-form-component,
.ucn-nav-overlay-localization .localization-form,
.ucn-nav-overlay-localization .localization-form__list-item,
.ucn-nav-overlay-localization .localization-form__select,
.ucn-nav-overlay-localization .localization-form__currency,
.ucn-nav-overlay-localization .country,
.ucn-nav-overlay-localization .language-selector {
  color: var(--nav-fg);
  font-family: var(--nav-font);
}

.ucn-nav-overlay-localization .language-selector__label {
  display: block;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--nav-fg-muted);
}

.ucn-nav-overlay-localization .localization-form__select {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
}

.ucn-nav-overlay-footer {
  flex-shrink: 0;
  padding: 20px 24px;
  border-top: 1px solid var(--nav-border);
}

.ucn-mob-cta-btn {
  display: block;
  width: 100%;
  padding: 16px 24px;
  background: var(--nav-accent);
  color: #fff;
  font-family: var(--nav-font);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .2em;
  text-transform: uppercase;
  text-decoration: none;
  text-align: center;
  transition: opacity .2s;
}

.ucn-mob-cta-btn:hover {
  opacity: .85;
}

.ucn-nav-spacer {
  display: none;
}

@media (max-width: 1200px) {
  .ucn-nav-bar {
    padding: 0 28px;
  }

  .ucn-nav-link {
    padding: 0 12px;
    font-size: 9px;
    letter-spacing: .14em;
  }

  .ucn-mega-inner {
    grid-template-columns: 220px 1fr;
  }

  .ucn-mega-visual {
    display: none;
  }
}

@media (max-width: 900px) {
  .ucn-nav-bar {
    padding: 0 14px;
    position: relative;
  }

  .ucn-nav-links {
    display: none;
  }

  .ucn-nav-hamburger {
    display: flex;
    flex-shrink: 0;
    position: relative;
    z-index: 2;
    order: 1;
  }

  .ucn-nav-hamburger span {
    height: 2px;
  }

  .ucn-nav-actions {
    display: flex;
    flex-direction: row;
    align-items: center;
    flex: 1;
    margin-left: 0;
    position: relative;
    z-index: 2;
    order: 2;
    gap: 6px;
  }

  .ucn-search-btn {
    order: 1;
  }

  .ucn-account-btn {
    display: none;
  }

  .ucn-nav-lang-mobile {
    display: flex;
    align-items: center;
    order: 2;
    margin-left: auto;
  }

  .ucn-cart-btn,
  .ucn-nav-cart-drawer,
  .ucn-nav-cart-link {
    order: 3;
  }

  .ucn-nav-logo {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    margin: 0;
    z-index: 3;
    order: 0;
    pointer-events: auto;
    font-size: 9px;
  }

  .ucn-nav-logo-img {
    height: var(--ucn-logo-h-mobile, 18px);
  }

  .ucn-nav-localization {
    display: none;
  }

  .ucn-nav-icon-link,
  .ucn-nav-cart-drawer .header-actions__action,
  .ucn-nav-cart-link {
    width: 34px;
    height: 34px;
  }

  .ucn-nav-cart-drawer .header-actions__cart-icon .cart-bubble,
  .ucn-nav-cart-link .header-actions__cart-icon .cart-bubble {
    top: -1px;
    right: -9px;
  }
}

/* Ripristina centramento dialog tolto dal reset * { margin: 0 } */
.search-modal__content {
  margin-inline: auto;
}

@media screen and (min-width: 750px) {
  .search-modal__content {
    margin-block-start: calc(var(--nav-h, 60px) + var(--header-height, 60px) + 6px) !important;
  }
}
/* CUSTOM CODE END */

/* Pallino del carrello non tagliato su mobile: .button-unstyled di Horizon ha overflow:hidden (Dr.Robert, 27/09) */
.ucn-cart-btn{overflow:visible}