.pd-story{margin:18px 0 6px;padding:16px 18px;border:1px solid rgba(212,170,90,.28);border-left:2px solid var(--gold);background:rgba(255,255,255,.025)}
.pd-story .pyr-lbl{margin:0 0 8px;color:var(--gold);letter-spacing:2px;text-transform:uppercase;font-size:10px}
.pd-story-text{margin:0;color:var(--cream);font-size:14px;line-height:1.7}

/* ══════════════════════════════════════════════════════════════
   PROFANO · Cosmesi Italia S.r.l.
   Palette: nero caldo + beige/crema + oro
   ══════════════════════════════════════════════════════════════ */
:root {
  /* Fondi caldi — NO bianco, beige/crema come sfondo chiaro */
  --bg:        #120c06;   /* nero caldo profondo */
  --bg2:       #1c1208;   /* nero caldo secondario */
  --bg3:       #251808;   /* marrone scuro card */
  --surf:      #2e1e0a;   /* superficie card */
  --surf2:     #3a260e;   /* superficie hover */

  /* Beige / crema — toni caldi */
  --beige:     #e8d5b0;   /* beige principale */
  --beige-lt:  #f2e6cc;   /* beige chiaro */
  --beige-dim: #d8bc90;   /* beige scuro — WCAG AA+ */
  --cream-dim: #c8a87a;   /* crema scura — WCAG AA 8.6:1 */

  /* Oro */
  --gold:      #d4aa5a;
  --gold-lt:   #eacb8a;
  --gold-dim:  #a07038;
  --gold-faint:rgba(196,154,74,.1);

  --border:    rgba(196,154,74,.14);
  --nav-h:     68px;
}

*,*::before,*::after { margin:0; padding:0; box-sizing:border-box }
html { scroll-behavior:smooth }
body {
  background: var(--bg);
  color: var(--beige);
  font-family: 'Jost', sans-serif;
  font-weight: 300;
  overflow-x: hidden;
}
::-webkit-scrollbar { width:2px }
::-webkit-scrollbar-track { background:var(--bg) }
::-webkit-scrollbar-thumb { background:var(--gold-dim) }
a { text-decoration:none }

/* ── PAGINE ── */
.page { display:none; min-height:100vh; padding-top:var(--nav-h); animation:fadeIn .4s ease }
.page.active { display:block }
@keyframes fadeIn { from{opacity:0;transform:translateY(6px)} to{opacity:1;transform:none} }
@keyframes float  { 0%,100%{transform:translateY(0)} 50%{transform:translateY(-18px)} }
@keyframes pulse  { 0%,100%{opacity:.4;transform:scale(1)} 50%{opacity:.8;transform:scale(1.06)} }
@keyframes shimmer{ 0%{background-position:200% center} 100%{background-position:-200% center} }

.reveal { opacity:0; transform:translateY(22px); transition:opacity .75s ease,transform .75s ease }
.reveal.vis { opacity:1; transform:none }

/* ── SEZIONE SEO STATICA ── */
.seo-static-section{background:var(--bg2);border-top:1px solid var(--border);padding:60px 24px}
.seo-inner{max-width:960px;margin:0 auto}
.seo-static-section h2{font-family:'Cormorant Garamond',serif;font-size:clamp(20px,3vw,28px);color:var(--beige);font-weight:400;margin-bottom:16px;margin-top:36px}
.seo-static-section h2:first-child{margin-top:0}
.seo-static-section h3{font-family:'Cormorant Garamond',serif;font-size:clamp(16px,2.5vw,20px);color:var(--gold-dim);font-weight:400;margin-top:28px;margin-bottom:12px}
.seo-static-section p{color:var(--cream-dim);font-size:14px;line-height:1.9;margin-bottom:16px;max-width:760px}
.seo-products-list{list-style:none;display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:12px;margin:16px 0 24px}
.seo-products-list li{color:var(--cream-dim);font-size:13px;line-height:1.7;padding:10px 14px;border:1px solid var(--border);border-radius:4px}
.seo-products-list li strong{color:var(--gold);display:block;margin-bottom:4px}
.seo-about{margin-top:40px;padding-top:32px;border-top:1px solid var(--border)}
.seo-static-section a{color:var(--gold-dim)}
.seo-static-section a:hover{color:var(--gold)}
.reveal.vis { opacity:1; transform:none }

/* ── TIPOGRAFIA ── */
.eyebrow {
  font-size:9px; letter-spacing:7px; text-transform:uppercase;
  color:var(--gold); display:block;
}
.heading {
  font-family:'Cormorant Garamond',serif;
  font-size:clamp(28px,4.5vw,52px);
  font-weight:400; color:#ffffff; line-height:1.12;
  text-shadow: 0 2px 12px rgba(0,0,0,0.7), 0 1px 3px rgba(0,0,0,0.9);
}
.body-txt { font-size:14px; color:var(--cream-dim); line-height:2; font-weight:400 }

/* ── BOTTONI ── */
.btn-gold {
  display:inline-flex; align-items:center; justify-content:center;
  padding:13px 34px; border:1px solid var(--gold);
  color:var(--beige); font-size:8.5px; letter-spacing:4px; text-transform:uppercase;
  background:transparent; cursor:pointer; font-family:'Jost',sans-serif;
  transition:all .35s; white-space:nowrap;
}
.btn-gold:hover { background:var(--gold); color:var(--bg) }
.btn-ghost {
  display:inline-flex; align-items:center; justify-content:center;
  padding:11px 26px; border:1px solid rgba(196,154,74,.28);
  color:var(--cream-dim); font-size:8.5px; letter-spacing:3px; text-transform:uppercase;
  background:transparent; cursor:pointer; font-family:'Jost',sans-serif; transition:all .3s;
}
.btn-ghost:hover { border-color:var(--gold); color:var(--beige) }

/* ═══════════════════════════════════════════════════════════
   NAVIGAZIONE
   ═══════════════════════════════════════════════════════════ */
.nav {
  position:fixed; top:0; left:0; right:0; z-index:600;
  height:var(--nav-h);
  display:flex; align-items:center; justify-content:space-between;
  padding:0 52px;
  background:rgba(18,12,6,.97);
  border-bottom:1px solid var(--border);
  backdrop-filter:blur(10px);
}
.logo {
  font-family:'Cormorant Garamond',serif;
  font-size:22px; letter-spacing:9px; text-transform:uppercase;
  color:var(--beige-lt); cursor:pointer; background:none; border:none;
  transition:color .3s; line-height:1;
}
.logo:hover { color:var(--gold-lt) }
.logo small {
  display:block; font-size:7px; letter-spacing:3px;
  color:var(--gold); font-family:'Jost',sans-serif; font-weight:300; margin-top:3px;
}
.nav-links { display:flex; gap:2px; list-style:none }
.nav-link {
  color:var(--beige-dim); font-size:8.5px; letter-spacing:3px; text-transform:uppercase;
  cursor:pointer; padding:8px 13px; border:none; background:none;
  font-family:'Jost',sans-serif; transition:color .25s;
}
.nav-link:hover,.nav-link.on { color:var(--beige) }
.nav-r { display:flex; align-items:center; gap:13px }
/* lang */
.lang-wrap { position:relative }
[dir=rtl] .lang-dd { right:auto; left:0 }
.lang-btn {
  background:none; border:1px solid rgba(196,154,74,.22);
  color:var(--gold); font-family:'Jost',sans-serif; font-size:8.5px;
  letter-spacing:2px; text-transform:uppercase; padding:5px 10px;
  cursor:pointer; transition:all .25s;
}
.lang-btn:hover { border-color:var(--gold); color:var(--beige) }
.lang-dd {
  position:absolute; top:calc(100% + 6px); right:0;
  background:rgba(20,13,6,.99); border:1px solid var(--border);
  min-width:148px; display:none; flex-direction:column; z-index:700;
  box-shadow:0 20px 50px rgba(0,0,0,.8);
}
.lang-dd.open { display:flex }
.lang-opt {
  padding:9px 13px; font-size:8.5px; letter-spacing:2px; text-transform:uppercase;
  color:var(--cream-dim); cursor:pointer; border:none; background:none;
  font-family:'Jost',sans-serif; text-align:left; width:100%;
  display:flex; align-items:center; gap:7px; transition:all .2s;
}
.lang-opt:hover { background:var(--surf); color:var(--beige) }
.lang-opt.on { color:var(--gold) }
/* cart */
.cart-btn {
  background:none; border:none; cursor:pointer;
  color:var(--cream-dim); font-size:18px; position:relative; padding:4px;
  transition:color .25s;
}
.cart-btn:hover { color:var(--beige) }
.cart-cnt {
  position:absolute; top:-5px; right:-7px; background:var(--gold);
  color:var(--bg); border-radius:50%; width:16px; height:16px;
  font-size:8px; font-weight:600; display:flex; align-items:center;
  justify-content:center; font-family:'Jost',sans-serif;
  opacity:0; transform:scale(0); transition:all .2s;
}
.cart-cnt.on { opacity:1; transform:scale(1) }
/* hamburger */
.ham {
  display:none; flex-direction:column; gap:5px;
  background:none; border:none; cursor:pointer; padding:5px;
}
.ham-ln { width:22px; height:1px; background:var(--cream-dim); transition:all .3s }
.mob-nav {
  position:fixed; top:var(--nav-h); left:0; right:0; bottom:0;
  background:rgba(18,12,6,.99); z-index:550; display:none;
  flex-direction:column; padding:28px; overflow-y:auto;
}
.mob-nav.open { display:flex }
.mob-link {
  padding:17px 0; font-size:10px; letter-spacing:3px; text-transform:uppercase;
  color:var(--cream-dim); cursor:pointer; border:none;
  border-bottom:1px solid var(--border); background:none;
  font-family:'Jost',sans-serif; text-align:left; width:100%; transition:color .2s;
}
.mob-link:hover { color:var(--beige) }

/* ═══════════════════════════════════════════════════════════
   HOME — HERO
   Fedele alla foto: sfondo scuro caldo, testo grande a sx,
   flacone a destra, bottone "Scopri la Collezione" con bordo
   ═══════════════════════════════════════════════════════════ */
.hero {
  min-height:calc(100vh - var(--nav-h));
  display:grid; grid-template-columns:1fr 1fr;
  align-items:center;
  padding:80px 64px 60px;
  background:
    radial-gradient(ellipse at 70% 40%, rgba(196,154,74,.06) 0%, transparent 50%),
    linear-gradient(160deg, #1c1208 0%, #120c06 60%);
  position:relative; overflow:hidden;
}
/* texture grain */
.hero::after {
  content:''; position:absolute; inset:0; pointer-events:none;
  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");
  opacity:.6;
}
.hero-txt { position:relative; z-index:2 }
.hero-h1 {
  font-family:'Cormorant Garamond',serif;
  font-size:clamp(54px,8vw,94px);
  font-weight:400; line-height:1.04; color:#ffffff;
  margin-bottom:22px; letter-spacing:-.5px;
  text-shadow: 0 2px 24px rgba(0,0,0,0.85), 0 1px 6px rgba(0,0,0,0.95);
}
.hero-sub {
  font-size:15px; line-height:1.85; color:var(--cream-dim); font-weight:400;
  max-width:340px; margin-bottom:40px;
}
.hero-vis {
  display:flex; justify-content:center; align-items:center;
  position:relative; z-index:2;
}
.hero-glow {
  position:absolute; width:450px; height:450px; border-radius:50%;
  background:radial-gradient(circle, rgba(196,154,74,.09) 0%, transparent 70%);
  animation:pulse 5s ease-in-out infinite;
}
.hero-bottle {
  position:relative; z-index:2;
  animation:float 7s ease-in-out infinite;
}
.hero-bottle img {
  max-height:580px; max-width:100%; object-fit:contain;
  filter:drop-shadow(0 60px 100px rgba(0,0,0,.9)) drop-shadow(0 20px 50px rgba(196,154,74,.12));
}
.hero-bottle-ph {
  width:280px; height:400px;
  background:linear-gradient(160deg,rgba(196,154,74,.06),rgba(196,154,74,.02));
  border:1px solid rgba(196,154,74,.14);
  display:flex; align-items:center; justify-content:center;
  font-family:'Cormorant Garamond',serif; font-size:84px;
  color:rgba(196,154,74,.1);
}

/* ═══════════════════════════════════════════════════════════
   HOME — COLLEZIONE (sezione centrale)
   Heading centrato "COLLEZIONE" + griglia 4 card
   ═══════════════════════════════════════════════════════════ */
.home-coll {
  padding:72px 52px 80px;
  background:var(--bg);
}
.home-coll-hd {
  text-align:center;
  margin-bottom:48px;
}
.home-coll-hd .eyebrow {
  font-size:10px; letter-spacing:10px; margin-bottom:0;
}

/* ═══════════════════════════════════════════════════════════
   CARD PRODOTTO
   Immagine + Nome + Descrizione + Bottone "Acquista Ora"
   ═══════════════════════════════════════════════════════════ */
.cards-grid {
  display:grid; grid-template-columns:repeat(4,1fr);
  gap:24px;
}
.pc {
  background:transparent; cursor:pointer;
  display:flex; flex-direction:column;
  transition:transform .3s;
}
.pc:hover { transform:translateY(-4px) }
.pc-img {
  aspect-ratio:3/4; overflow:hidden;
  border:1px solid rgba(196,154,74,.1);
  position:relative;
  background:radial-gradient(ellipse at 50% 70%, rgba(196,154,74,.05), var(--bg2) 70%);
  display:flex; align-items:center; justify-content:center;
  margin-bottom:16px;
}
.pc-img img {
  width:100%; height:100%; object-fit:cover;
  transition:transform .7s ease; position:absolute; inset:0;
}
.pc:hover .pc-img img { transform:scale(1.05) }
.pc-ph {
  font-family:'Cormorant Garamond',serif; font-size:50px;
  color:rgba(196,154,74,.1); z-index:1; text-transform:uppercase;
}
.pc-name {
  font-family:'Cormorant Garamond',serif;
  font-size:22px; font-weight:300;
  color:var(--beige-lt); margin-bottom:7px;
  text-align:center; line-height:1.2;
}
.pc-notes {
  font-size:11px; color:var(--cream-dim); line-height:1.7;
  text-align:center; margin-bottom:14px;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
}
.pc-buy {
  padding:10px 16px; border:1px solid rgba(196,154,74,.35);
  background:none; color:var(--beige-dim);
  font-family:'Jost',sans-serif; font-size:7.5px; letter-spacing:3.5px;
  text-transform:uppercase; cursor:pointer; transition:all .25s; width:100%;
}
.pc-buy:hover { border-color:var(--gold); color:var(--beige); background:rgba(196,154,74,.07) }
.pc-buy-disabled { border-color:rgba(255,255,255,.1) !important; color:#555 !important; cursor:not-allowed !important; background:rgba(255,255,255,.03) !important; }
.pc-buy-disabled:hover { border-color:rgba(255,255,255,.1) !important; color:#555 !important; background:rgba(255,255,255,.03) !important; transform:none !important; }
.stock-badge { position:absolute; top:10px; right:10px; font-size:8px; letter-spacing:2px; text-transform:uppercase; padding:4px 9px; z-index:2; pointer-events:none; font-weight:600; }
.stock-soldout  { background:#c04040; color:#fff; }
.stock-unavail  { background:#333; color:#999; border:1px solid #555; }

/* ═══════════════════════════════════════════════════════════
   HOME — ESPERIENZA SENSORIALE
   Split: immagine sinistra + testo destra
   ═══════════════════════════════════════════════════════════ */
.exp-sec {
  display:grid; grid-template-columns:1fr 1fr;
  min-height:480px;
  background:var(--bg2);
  border-top:1px solid var(--border);
}
.exp-img {
  position:relative; overflow:hidden; min-height:480px;
  /* v420: stesso colore della sezione, così l'eventuale spazio attorno al video è uniforme */
  background:var(--bg2);
  display:flex; align-items:center; justify-content:center;
}
.exp-img img {
  width:100%; height:100%; object-fit:cover; object-position:center 30%;
  filter:brightness(.85);
}
/* v420: il video non viene mai deformato né tagliato (contain); il riquadro si adatta
   alla sua altezza naturale, lo spazio residuo ha il colore della sezione, senza bordi */
.exp-img video {
  display:block; width:100%; height:auto; max-height:640px;
  object-fit:contain; object-position:center; background:var(--bg2);
  filter:brightness(.92);
}
.exp-img:has(video) { min-height:0; }
.exp-img-ph {
  width:100%; height:100%; min-height:480px;
  background:linear-gradient(135deg,rgba(196,154,74,.08),rgba(26,16,8,.95));
  display:flex; align-items:center; justify-content:center;
  font-size:60px; color:rgba(196,154,74,.15);
}
.exp-txt {
  padding:80px 70px;
  display:flex; flex-direction:column; justify-content:center;
  background:linear-gradient(135deg, rgba(196,154,74,.04), transparent);
}
.exp-txt .eyebrow { margin-bottom:18px }
.exp-h {
  font-family:'Cormorant Garamond',serif;
  font-size:clamp(22px,3vw,36px); font-weight:300;
  color:#ffffff; line-height:1.5; margin-bottom:30px;
  font-style:italic;
}

/* ═══════════════════════════════════════════════════════════
   STRIP INFO (3 colonne)
   ═══════════════════════════════════════════════════════════ */
.home-strip {
  display:grid; grid-template-columns:repeat(3,1fr);
  border-top:1px solid var(--border);
  border-bottom:1px solid var(--border);
  background:var(--bg2);
}
.strip-it {
  padding:38px 44px; border-right:1px solid var(--border);
  position:relative; overflow:hidden;
}
.strip-it:last-child { border-right:none }
.strip-n {
  font-family:'Cormorant Garamond',serif; font-size:60px;
  color:rgba(196,154,74,.05); position:absolute; top:8px; right:14px; line-height:1;
}
.strip-t {
  font-size:8.5px; letter-spacing:4px; text-transform:uppercase;
  color:var(--gold); margin-bottom:7px;
}
.strip-b { font-size:13px; color:var(--cream-dim); line-height:1.9; font-weight:400 }

/* ═══════════════════════════════════════════════════════════
   COLLECTION PAGE
   ═══════════════════════════════════════════════════════════ */
.page-hd {
  padding:52px 52px 32px;
  border-bottom:1px solid var(--border);
}
.coll-bar {
  padding:20px 52px; background:var(--bg2);
  border-bottom:1px solid var(--border);
  display:flex; align-items:center; gap:9px; flex-wrap:wrap;
}
.flbl {
  font-size:8px; letter-spacing:2.5px; text-transform:uppercase;
  color:var(--cream-dim); flex-shrink:0;
}
.f-btn {
  padding:6px 13px; border:1px solid var(--border);
  background:none; color:var(--cream-dim);
  font-family:'Jost',sans-serif; font-size:8px; letter-spacing:2px;
  text-transform:uppercase; cursor:pointer; transition:all .25s;
}
.f-btn:hover { border-color:rgba(196,154,74,.4); color:var(--beige) }
.f-btn.on { border-color:var(--gold); color:var(--gold); background:var(--gold-faint) }
.srch {
  background:var(--bg); border:1px solid var(--border);
  color:var(--beige); padding:7px 12px; font-family:'Jost',sans-serif;
  font-size:12px; outline:none; transition:border-color .25s;
  width:190px; margin-left:auto;
}
.srch:focus { border-color:var(--gold) }
.srch::placeholder { color:var(--cream-dim); opacity:.5 }
.prod-grid {
  display:grid; grid-template-columns:repeat(4,1fr);
  gap:1px; background:var(--border);
  border:1px solid var(--border); margin:28px 52px;
}
/* card versione compatta per la pagina collezione */
.prod-grid .pc {
  background:var(--bg2); padding:0; border:none; transform:none;
  transition:background .3s;
}
.prod-grid .pc:hover { background:var(--surf); transform:none }
.prod-grid .pc-img { margin-bottom:0; border:none; border-bottom:1px solid var(--border) }
.prod-grid .pc-name { text-align:left; padding:0 }
.prod-grid .pc-notes { text-align:left }
.prod-grid .pc-buy { border-top:1px solid rgba(196,154,74,.1) }
.prod-grid .pc-info { padding:15px 18px 18px }
.pc-info { display:flex; flex-direction:column; gap:4px }
.pc-fam { font-size:7.5px; letter-spacing:3px; text-transform:uppercase; color:var(--gold) }
.pc-price { font-family:'Cormorant Garamond',serif; font-size:17px; color:var(--gold-lt) }

/* ═══════════════════════════════════════════════════════════
   PRODUCT DETAIL
   ═══════════════════════════════════════════════════════════ */
.pd-wrap { display:grid; grid-template-columns:1fr 1fr; min-height:calc(100vh - var(--nav-h)) }
.pd-gal { background:var(--bg2); display:flex; flex-direction:column }
.pd-main {
  flex:1; min-height:440px; position:relative;
  background:radial-gradient(ellipse at 50% 50%, rgba(196,154,74,.07), transparent 65%);
  display:flex; align-items:center; justify-content:center; overflow:hidden;
}
/* Loading state per immagini prodotto */
.pd-main img[src=""], .pd-main img:not([src]) { opacity:0; }
.pd-thumb img[src=""], .pd-thumb img:not([src]) { opacity:0; }
.pd-main-img {
  width:100%; height:100%; object-fit:contain; padding:32px;
  position:absolute; inset:0; transition:opacity .3s;
}
.pd-main-ph {
  font-family:'Cormorant Garamond',serif; font-size:88px;
  color:rgba(196,154,74,.07); text-transform:uppercase; letter-spacing:6px;
}
.gal-prev,.gal-next {
  position:absolute; top:50%; transform:translateY(-50%);
  background:rgba(18,12,6,.7); border:1px solid var(--border);
  color:var(--cream-dim); cursor:pointer; padding:10px 14px; font-size:15px;
  transition:all .25s; z-index:5;
}
.gal-prev{left:10px} .gal-next{right:10px}
.gal-prev:hover,.gal-next:hover { background:var(--gold); color:var(--bg); border-color:var(--gold) }
.gal-c {
  position:absolute; bottom:10px; right:10px;
  background:rgba(18,12,6,.7); border:1px solid var(--border);
  color:var(--cream-dim); font-size:8px; letter-spacing:2px;
  padding:3px 8px; font-family:'Jost',sans-serif; text-transform:uppercase;
}
.pd-thumbs {
  display:flex; gap:6px; padding:12px 13px;
  border-top:1px solid var(--border); overflow-x:auto;
}
.pd-thumbs::-webkit-scrollbar { height:2px }
.pd-thumb {
  width:64px; height:64px; flex-shrink:0; cursor:pointer;
  border:1px solid var(--border); overflow:hidden; background:var(--bg);
  transition:border-color .2s;
}
.pd-thumb img { width:100%; height:100%; object-fit:cover }
.pd-thumb.on,.pd-thumb:hover { border-color:var(--gold) }
.pd-thumb-ph {
  width:100%; height:100%; display:flex; align-items:center;
  justify-content:center; font-size:18px; color:rgba(196,154,74,.2);
}
/* info */
.pd-info {
  padding:44px 42px; overflow-y:auto;
  max-height:calc(100vh - var(--nav-h)); display:flex; flex-direction:column;
}
.pd-back {
  display:flex; align-items:center; gap:6px; font-size:8px;
  letter-spacing:2.5px; text-transform:uppercase; color:var(--cream-dim);
  cursor:pointer; background:none; border:none; font-family:'Jost',sans-serif;
  margin-bottom:22px; transition:color .2s;
}
.pd-back:hover { color:var(--gold) }
.pd-fam { font-size:8.5px; letter-spacing:4px; text-transform:uppercase; color:var(--gold); margin-bottom:7px }
.pd-name { font-family:'Cormorant Garamond',serif; font-size:clamp(38px,5vw,58px); font-weight:300; color:var(--beige-lt); line-height:1; margin-bottom:5px }
.pd-sub { font-size:8.5px; letter-spacing:3px; text-transform:uppercase; color:var(--cream-dim); margin-bottom:18px }
.pd-desc { font-family:'Cormorant Garamond',serif; font-size:15.5px; font-style:italic; color:var(--cream-dim); line-height:2; border-left:2px solid rgba(196,154,74,.22); padding-left:14px; margin-bottom:22px }
.pyr-lbl { font-size:8px; letter-spacing:4px; text-transform:uppercase; color:var(--gold); margin-bottom:9px }
.pyr { border:1px solid var(--border); margin-bottom:20px }
.pyr-row { display:grid; grid-template-columns:58px 1fr; border-bottom:1px solid var(--border) }
.pyr-row:last-child { border-bottom:none }
.pyr-side { padding:11px; border-right:1px solid var(--border); display:flex; flex-direction:column; align-items:center; justify-content:center; gap:2px; background:rgba(196,154,74,.03) }
.pyr-ico { font-size:13px }
.pyr-sl { font-size:6px; letter-spacing:2px; text-transform:uppercase; color:var(--gold); text-align:center }
.pyr-body { padding:11px 14px }
.pyr-tier { font-size:7px; letter-spacing:1.5px; text-transform:uppercase; color:var(--cream-dim); margin-bottom:2px }
.pyr-val { font-size:12px; color:var(--beige); line-height:1.6 }
.pd-format { display:inline-block; border:1px solid rgba(196,154,74,.32); color:var(--gold-lt); font-size:9px; letter-spacing:3px; text-transform:uppercase; padding:7px 16px; margin-bottom:14px; background:var(--gold-faint) }
.pd-price-row { display:flex; align-items:center; justify-content:space-between; margin-bottom:14px }
.pd-price { font-family:'Cormorant Garamond',serif; font-size:48px; color:var(--beige-lt); line-height:1 }
.pd-avail { display:flex; align-items:center; gap:5px; font-size:8px; letter-spacing:2px; text-transform:uppercase; color:#6a9060 }
.pd-avail::before { content:''; width:6px; height:6px; background:#6a9060; border-radius:50% }
.pd-actions { display:flex; gap:9px; margin-top:4px }
.btn-buy { flex:1; padding:13px; background:var(--gold); color:var(--bg); border:none; font-family:'Jost',sans-serif; font-size:9px; letter-spacing:4px; text-transform:uppercase; cursor:pointer; transition:all .3s; font-weight:500 }
.btn-buy:hover { background:var(--gold-lt); transform:translateY(-1px) }
.btn-wish { padding:13px 14px; border:1px solid rgba(196,154,74,.22); background:none; color:var(--cream-dim); cursor:pointer; font-size:17px; transition:all .25s }
.btn-wish:hover { border-color:var(--gold); color:var(--gold) }

/* ═══════════════════════════════════════════════════════════
   IL PROGETTO
   ═══════════════════════════════════════════════════════════ */
.prog-split { display:grid; grid-template-columns:1fr 1fr; border-bottom:1px solid var(--border) }
.prog-side-txt { padding:64px 52px; display:flex; flex-direction:column; justify-content:center }
.prog-side-vis { background:radial-gradient(ellipse at 40% 55%,rgba(196,154,74,.1),transparent),var(--bg2); display:flex; align-items:center; justify-content:center }
.prog-sigil { width:190px; height:190px; border:1px solid rgba(196,154,74,.18); border-radius:50%; display:flex; align-items:center; justify-content:center; font-family:'Cormorant Garamond',serif; font-size:88px; color:rgba(196,154,74,.1); animation:float 7s ease-in-out infinite }
.prog-body { font-size:13px; color:var(--cream-dim); line-height:2.1; margin-bottom:13px }
.prog-vals { display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--border); border-top:1px solid var(--border); border-bottom:1px solid var(--border) }
.prog-val { background:var(--bg2); padding:32px 24px }
.prog-val-icon { font-size:24px; margin-bottom:11px }
.prog-val-t { font-family:'Cormorant Garamond',serif; font-size:17px; color:#ffffff; font-weight:300; margin-bottom:8px }
.prog-val-b { font-size:12px; color:var(--cream-dim); line-height:1.9; font-weight:400 }
.prog-quote-sec { padding:64px 52px; background:var(--bg2); border-bottom:1px solid var(--border); text-align:center }
.prog-quote { font-family:'Cormorant Garamond',serif; font-size:clamp(15px,2vw,20px); font-style:italic; color:var(--beige-lt); line-height:2; max-width:720px; margin:0 auto 18px; display:block; font-weight:400 }
.prog-fonte { font-size:8px; letter-spacing:2px; text-transform:uppercase; color:var(--gold-dim) }
.prog-anice { display:grid; grid-template-columns:1fr 1fr; border-bottom:1px solid var(--border) }
.prog-anice-vis { background:var(--bg2); display:flex; align-items:center; justify-content:center; font-size:70px; padding:60px; animation:float 7s ease-in-out infinite 1s }
.prog-anice-txt { padding:60px 52px; display:flex; flex-direction:column; justify-content:center }
.prog-cta { padding:72px 52px; text-align:center; background:radial-gradient(ellipse at 50% 50%,rgba(196,154,74,.04),transparent) }

/* ═══════════════════════════════════════════════════════════
   FORM / CONTATTI / CHI SIAMO
   ═══════════════════════════════════════════════════════════ */
.form-grid { display:grid; grid-template-columns:1fr 1fr; gap:52px; padding:54px 52px }
.fg-ttl { font-family:'Cormorant Garamond',serif; font-size:24px; font-weight:300; color:var(--beige-lt); margin-bottom:5px }
.fg-sub { font-size:12px; color:var(--cream-dim); line-height:1.9; margin-bottom:20px }
.fg { display:flex; flex-direction:column; gap:4px; margin-bottom:12px }
.fg-lbl { font-size:7.5px; letter-spacing:2.5px; text-transform:uppercase; color:var(--cream-dim) }
.fg-in,.fg-sel,.fg-ta { background:var(--bg2); border:1px solid var(--border); color:var(--beige); padding:10px 12px; font-family:'Jost',sans-serif; font-size:13px; outline:none; transition:border-color .25s; width:100% }
.fg-in:focus,.fg-sel:focus,.fg-ta:focus { border-color:var(--gold) }
.fg-in::placeholder,.fg-ta::placeholder { color:var(--cream-dim); opacity:.4 }
.fg-sel { cursor:pointer }.fg-sel option { background:var(--surf) }
.fg-ta { resize:vertical; min-height:116px }
.priv-row { display:flex; align-items:flex-start; gap:8px; margin:12px 0; font-size:11px; color:var(--cream-dim); line-height:1.7; cursor:pointer }
.priv-cb { width:14px; height:14px; border:1px solid rgba(196,154,74,.3); background:var(--bg2); cursor:pointer; flex-shrink:0; margin-top:2px; appearance:none; transition:all .2s }
.priv-cb:checked { background:var(--gold); border-color:var(--gold) }
.btn-send { width:100%; padding:12px; background:var(--gold); color:var(--bg); border:none; font-family:'Jost',sans-serif; font-size:9px; letter-spacing:4px; text-transform:uppercase; cursor:pointer; transition:background .3s; font-weight:500 }
.btn-send:hover { background:var(--gold-lt) }
.form-ok { background:rgba(66,96,64,.1); border:1px solid rgba(66,96,64,.3); padding:11px 14px; text-align:center; color:#6a9060; font-size:9px; letter-spacing:1.5px; text-transform:uppercase; display:none; margin-top:9px }
.form-ok.show { display:block }
.info-box { background:var(--bg2); border:1px solid var(--border); padding:28px 24px }
.info-ttl { font-family:'Cormorant Garamond',serif; font-size:19px; font-weight:300; color:var(--beige-lt); margin-bottom:16px }
.info-row { display:grid; grid-template-columns:72px 1fr; border-bottom:1px solid rgba(196,154,74,.07); padding:11px 0 }
.info-row:last-child { border-bottom:none }
.info-k { font-size:7px; letter-spacing:2px; text-transform:uppercase; color:var(--gold); display:flex; align-items:center }
.info-v { font-size:12px; color:var(--cream-dim); line-height:1.7 }
.info-v a { color:var(--gold) }.info-v a:hover { color:var(--gold-lt) }
.ct-split { display:grid; grid-template-columns:1fr 1fr; gap:1px; background:var(--border); border:1px solid var(--border); margin:32px 52px }
.ct-side { padding:44px 40px }
.ct-side:first-child { background:var(--bg2) }
.ct-side:last-child { background:var(--surf) }
.fact-row { display:grid; grid-template-columns:74px 1fr; border-bottom:1px solid rgba(196,154,74,.07); padding:12px 0 }
.fact-row:last-child { border-bottom:none }
.fact-k { font-size:7px; letter-spacing:2px; text-transform:uppercase; color:var(--gold); display:flex; align-items:center }
.fact-v { font-size:12.5px; color:var(--cream-dim); line-height:1.6 }
.fact-v a { color:var(--gold) }.fact-v a:hover { color:var(--gold-lt) }
.about-hero { display:grid; grid-template-columns:1fr 1fr; min-height:50vh; border-bottom:1px solid var(--border) }
.about-num { background:radial-gradient(ellipse at 40% 55%,rgba(196,154,74,.1),transparent),var(--bg2); display:flex; align-items:center; justify-content:center; padding:60px }
.about-yrs { font-family:'Cormorant Garamond',serif; font-size:clamp(80px,12vw,148px); font-weight:300; color:rgba(196,154,74,.1); text-align:center; line-height:1 }
.about-yrs span { display:block; font-size:9px; letter-spacing:6px; text-transform:uppercase; color:var(--gold); font-family:'Jost',sans-serif; margin-top:7px }
.about-txt { padding:60px 52px; display:flex; flex-direction:column; justify-content:center }
.about-vals { display:grid; grid-template-columns:1fr 1fr; gap:1px; background:var(--border); border:1px solid var(--border); margin:32px 52px }
.about-val { background:var(--bg2); padding:30px 26px }
.about-val-n { font-family:'Cormorant Garamond',serif; font-size:42px; color:rgba(196,154,74,.07); line-height:1; margin-bottom:6px }
.about-val-t { font-size:8.5px; letter-spacing:3px; text-transform:uppercase; color:var(--gold); margin-bottom:8px }
.about-val-b { font-size:12px; color:var(--cream-dim); line-height:1.9 }

/* ═══════════════════════════════════════════════════════════
   FOOTER
   ═══════════════════════════════════════════════════════════ */
.site-ft {
  padding:36px 52px; background:var(--bg2);
  border-top:1px solid var(--border);
  display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:16px;
}
.ft-copy { font-size:8px; color:var(--beige-dim) }
.ft-logo { font-family:'Cormorant Garamond',serif; font-size:17px; letter-spacing:7px; text-align:center; color:var(--beige); text-transform:uppercase; cursor:pointer }
.ft-logo:hover { color:var(--gold-lt) }
.ft-links { display:flex; gap:18px; justify-content:flex-end; list-style:none }
.ft-links li { cursor:pointer; color:var(--cream-dim); font-size:8px; letter-spacing:2px; text-transform:uppercase; transition:color .2s }
.ft-links li:hover { color:var(--gold) }

/* Social footer */
.ft-social {
  display:flex; align-items:center; gap:14px; justify-content:flex-end;
  flex-wrap:wrap;
}
.ft-social-link {
  display:flex; align-items:center; gap:6px;
  color:var(--cream-dim); text-decoration:none;
  font-size:8px; letter-spacing:2px; text-transform:uppercase;
  font-family:'Jost',sans-serif; transition:color .25s; cursor:pointer;
  background:none; border:none; padding:0;
}
.ft-social-link:hover { color:var(--gold); }
.ft-social-link:hover .ft-social-ic { border-color:var(--gold); color:var(--gold); }
.ft-social-ic {
  width:28px; height:28px; border:1px solid rgba(196,154,74,.22);
  display:flex; align-items:center; justify-content:center;
  font-size:13px; transition:border-color .25s, color .25s;
}
.ft-social-sep {
  width:1px; height:14px; background:rgba(196,154,74,.15); margin:0 4px;
}
/* Full footer with social row */
.site-ft-full {
  padding:36px 52px 28px; background:var(--bg2); border-top:1px solid var(--border);
}
.ft-top-row {
  display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:16px;
  padding-bottom:20px; border-bottom:1px solid rgba(196,154,74,.08);
  margin-bottom:16px;
}
.ft-bottom-row {
  display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:12px;
}
.ft-nav-links { display:flex; gap:20px; list-style:none; flex-wrap:wrap; }
.ft-nav-links li { cursor:pointer; color:var(--beige-dim); font-size:8px; letter-spacing:2px; text-transform:uppercase; transition:color .2s; }
.ft-nav-links li:hover { color:var(--gold); }

/* ═══════════════════════════════════════════════════════════
   CART DRAWER
   ═══════════════════════════════════════════════════════════ */
.cart-ov { position:fixed; inset:0; background:rgba(0,0,0,.65); z-index:800; opacity:0; pointer-events:none; transition:opacity .3s; backdrop-filter:blur(4px) }
.cart-ov.open { opacity:1; pointer-events:all }
.cart-dr { position:fixed; top:0; right:0; bottom:0; width:380px; max-width:94vw; background:var(--surf); z-index:900; display:flex; flex-direction:column; transform:translateX(100%); transition:transform .4s cubic-bezier(.25,.46,.45,.94); border-left:1px solid var(--border) }
.cart-dr.open { transform:none }
.cart-hd { padding:19px 21px 14px; border-bottom:1px solid var(--border); display:flex; align-items:center; justify-content:space-between }
.cart-ttl { font-family:'Cormorant Garamond',serif; font-size:19px; color:#ffffff; letter-spacing:2px }
.cart-x { background:none; border:none; color:var(--cream-dim); cursor:pointer; font-size:16px; padding:4px; transition:color .2s }
.cart-x:hover { color:var(--beige) }
.cart-body { flex:1; overflow-y:auto; padding:13px 19px }
.cart-empty-wrap { text-align:center; padding:50px 20px }
.cart-empty-ic { font-size:28px; margin-bottom:9px; opacity:.3 }
.cart-empty-tx { font-size:11px; letter-spacing:1px; color:var(--cream-dim) }
.ci { display:grid; grid-template-columns:58px 1fr auto; gap:10px; align-items:center; padding:10px 0; border-bottom:1px solid rgba(196,154,74,.07) }
.ci-img { width:58px; height:72px; background:var(--bg2); border:1px solid var(--border); overflow:hidden; display:flex; align-items:center; justify-content:center }
.ci-img img { width:100%; height:100%; object-fit:cover }
.ci-img-ph { font-family:'Cormorant Garamond',serif; font-size:20px; color:rgba(196,154,74,.2) }
.ci-name { font-family:'Cormorant Garamond',serif; font-size:14px; color:var(--beige-lt); margin-bottom:2px }
.ci-det { font-size:7.5px; color:var(--cream-dim); letter-spacing:1.5px; text-transform:uppercase; margin-bottom:5px }
.ci-qty { display:flex; align-items:center; gap:6px }
.qty-b { background:none; border:1px solid rgba(196,154,74,.2); color:var(--beige); width:20px; height:20px; cursor:pointer; font-size:12px; display:flex; align-items:center; justify-content:center; transition:border-color .2s }
.qty-b:hover { border-color:var(--gold) }
.qty-v { font-size:11px; color:var(--beige); min-width:13px; text-align:center }
.ci-pr { font-family:'Cormorant Garamond',serif; font-size:14px; color:var(--gold-lt); white-space:nowrap }
.ci-rm { display:block; font-size:7px; letter-spacing:1px; color:var(--cream-dim); cursor:pointer; background:none; border:none; text-transform:uppercase; font-family:'Jost',sans-serif; padding:0; margin-top:2px; transition:color .2s }
.ci-rm:hover { color:#b03030 }
.cart-ft { padding:13px 19px 20px; border-top:1px solid var(--border) }
.cart-sub-row { display:flex; justify-content:space-between; align-items:center; margin-bottom:11px }
.cart-sub-l { font-size:8px; letter-spacing:2.5px; text-transform:uppercase; color:var(--cream-dim) }
.cart-sub-v { font-family:'Cormorant Garamond',serif; font-size:22px; color:var(--beige-lt) }
.btn-co { width:100%; padding:12px; background:var(--gold); color:var(--bg); border:none; font-family:'Jost',sans-serif; font-size:9px; letter-spacing:4px; text-transform:uppercase; cursor:pointer; transition:background .3s; font-weight:500 }
.btn-co:hover { background:var(--gold-lt) }
.cart-note { text-align:center; font-size:8px; color:var(--cream-dim); margin-top:7px }

/* ═══════════════════════════════════════════════════════════
   CHECKOUT
   ═══════════════════════════════════════════════════════════ */
.co-ov { position:fixed; inset:0; background:rgba(0,0,0,.82); z-index:1000; display:flex; align-items:center; justify-content:center; opacity:0; pointer-events:none; transition:opacity .3s; backdrop-filter:blur(6px); padding:16px }
.co-ov.open { opacity:1; pointer-events:all }
.co-modal { background:var(--surf); width:100%; max-width:530px; max-height:90vh; overflow-y:auto; border:1px solid var(--border); box-shadow:0 40px 120px rgba(0,0,0,.95); transform:translateY(16px); transition:transform .4s }
.co-ov.open .co-modal { transform:none }
.co-hd { padding:19px 24px 0; display:flex; align-items:center; justify-content:space-between }
.co-logo { font-family:'Cormorant Garamond',serif; font-size:14px; letter-spacing:5px; text-transform:uppercase; color:var(--beige-lt) }
.co-x { background:none; border:none; color:var(--cream-dim); cursor:pointer; font-size:16px; padding:4px; transition:color .2s }
.co-x:hover { color:var(--beige) }
.co-steps { display:flex; padding:15px 24px 0 }
.co-step { flex:1; display:flex; flex-direction:column; align-items:center; gap:3px; position:relative }
.co-step:not(:last-child)::after { content:''; position:absolute; top:10px; left:calc(50% + 11px); right:calc(-50% + 11px); height:1px; background:var(--border) }
.step-c { width:21px; height:21px; border-radius:50%; border:1px solid rgba(196,154,74,.25); display:flex; align-items:center; justify-content:center; font-size:8px; color:var(--cream-dim); transition:all .3s }
.co-step.active .step-c { border-color:var(--gold); background:var(--gold); color:var(--bg); font-weight:600 }
.co-step.done .step-c { border-color:#426040; background:#426040; color:#fff }
.step-lbl { font-size:7px; letter-spacing:2px; text-transform:uppercase; color:var(--cream-dim) }
.co-step.active .step-lbl { color:var(--gold) }
.co-body { padding:18px 24px 24px }
.co-ttl { font-family:'Cormorant Garamond',serif; font-size:19px; color:#ffffff; margin-bottom:13px }
.f2r { display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-bottom:10px }
.f2r.full { grid-template-columns:1fr }
.f2g { display:flex; flex-direction:column; gap:3px }
.f2l { font-size:7px; letter-spacing:2px; text-transform:uppercase; color:var(--cream-dim) }
.f2i,.f2s { background:var(--bg2); border:1px solid var(--border); color:var(--beige); padding:8px 10px; font-family:'Jost',sans-serif; font-size:13px; outline:none; transition:border-color .25s }
.f2i:focus,.f2s:focus { border-color:var(--gold) }
.f2i::placeholder { color:var(--cream-dim); opacity:.5 }
.f2s { cursor:pointer }.f2s option { background:var(--surf) }
.ord-sum { background:var(--bg2); border:1px solid var(--border); padding:12px; margin-bottom:13px }
.ord-sum-t { font-size:7px; letter-spacing:3px; text-transform:uppercase; color:var(--gold); margin-bottom:8px }
.ord-item-row { display:flex; justify-content:space-between; padding:4px 0; border-bottom:1px solid rgba(196,154,74,.07); font-size:11px; color:var(--cream-dim) }
.ord-item-row:last-child { border-bottom:none }
.ord-tot-row { display:flex; justify-content:space-between; padding-top:8px; margin-top:3px; border-top:1px solid var(--border) }
.ord-tot-l { font-size:8px; letter-spacing:2px; text-transform:uppercase; color:var(--cream-dim) }
.ord-tot-v { font-family:'Cormorant Garamond',serif; font-size:20px; color:var(--beige-lt) }
.co-nav { display:flex; justify-content:space-between; margin-top:14px; gap:9px }
.co-trust { display:flex; justify-content:center; gap:16px; margin-top:10px; flex-wrap:wrap }
.co-trust-item { display:flex; align-items:center; gap:4px; font-size:10px; color:var(--cream-dim); letter-spacing:.5px }
.co-trust-item svg { width:14px; height:14px; opacity:.7 }
.conf-wrap { text-align:center; padding:32px 12px }
.conf-ic { font-size:40px; margin-bottom:12px }
.conf-ttl { font-family:'Cormorant Garamond',serif; font-size:28px; color:var(--beige-lt); margin-bottom:8px }
.conf-msg { font-size:12px; color:var(--cream-dim); line-height:1.9; max-width:320px; margin:0 auto 16px }
.conf-num { font-size:8.5px; letter-spacing:3px; text-transform:uppercase; color:var(--gold); margin-bottom:18px }

/* ── TOAST ── */
.toast { position:fixed; bottom:20px; left:50%; transform:translateX(-50%) translateY(12px); background:var(--surf2); border:1px solid rgba(196,154,74,.28); color:var(--beige); padding:8px 20px; font-size:9px; letter-spacing:2px; text-transform:uppercase; z-index:2000; opacity:0; transition:all .3s; white-space:nowrap; font-family:'Jost',sans-serif; pointer-events:none }
.toast.show { opacity:1; transform:translateX(-50%) translateY(0) }

/* ═══════════════════════════════════════════════════════════
   RESPONSIVE
   ═══════════════════════════════════════════════════════════ */
@media(max-width:1100px) {
  .cards-grid { grid-template-columns:repeat(3,1fr) }
  .prod-grid { grid-template-columns:repeat(3,1fr) }
}
@media(max-width:900px) {
  .nav { padding:0 20px } .nav-links { display:none } .ham { display:flex }
  .hero { grid-template-columns:1fr; padding:50px 24px; text-align:center }
  .hero-vis { display:none }
  .home-strip { grid-template-columns:1fr }
  .strip-it { border-right:none; border-bottom:1px solid var(--border) }
  .home-coll { padding:44px 24px }
  .cards-grid { grid-template-columns:repeat(2,1fr); gap:16px }
  .exp-sec { grid-template-columns:1fr }
  .exp-img { min-height:260px }
  .exp-img:has(video) { min-height:0 }
  .exp-img video { max-height:70vh }
  .exp-txt { padding:46px 28px }
  .prod-grid { grid-template-columns:repeat(2,1fr); margin:16px 22px }
  .coll-bar { padding:14px 22px }
  .pd-wrap { grid-template-columns:1fr }
  .pd-info { padding:24px 22px; max-height:none }
  .page-hd { padding:34px 22px 22px }
  .form-grid { grid-template-columns:1fr; padding:34px 22px; gap:28px }
  .ct-split { grid-template-columns:1fr; margin:18px 22px } .ct-side { padding:28px 22px }
  .prog-split,.prog-anice,.about-hero { grid-template-columns:1fr }
  .prog-side-vis,.prog-anice-vis,.about-num { display:none }
  .prog-side-txt,.prog-anice-txt,.about-txt { padding:38px 22px }
  .prog-vals { grid-template-columns:1fr 1fr }
  .prog-quote-sec,.prog-cta { padding:40px 22px }
  .about-vals { grid-template-columns:1fr; margin:18px 22px }
  .site-ft { grid-template-columns:1fr; text-align:center; gap:10px; padding:22px }
  .ft-links { justify-content:center }
  .site-ft-full { padding:28px 22px 20px; }
  .ft-top-row { grid-template-columns:1fr; text-align:center; gap:14px; }
  .ft-social { justify-content:center; }
  .ft-bottom-row { flex-direction:column; align-items:center; gap:10px; text-align:center; }
  .ft-nav-links { justify-content:center; gap:14px; }
}
@media(max-width:600px) {
  .cards-grid { grid-template-columns:1fr }
  .prod-grid { grid-template-columns:1fr }
  .prog-vals { grid-template-columns:1fr }
  .f2r { grid-template-columns:1fr }
}

/* ══════════════════════════════════════════════════
   1. HERO VIDEO LOOP
   ══════════════════════════════════════════════════ */
.hero-video-wrap {
  position:absolute; inset:0; overflow:hidden; z-index:0; pointer-events:none;
}
.hero-video-wrap img,
.hero-video-wrap video {
  width:100%; height:100%; object-fit:cover;
}
.hero-video-wrap img {
  display:block;
  opacity:1; /* v417: lo sfondo si vede; l'oscuramento lo regola l'overlay (Admin → Hero & Aspetto) */
  transform:scale(1.015);
  animation:heroPosterDrift 18s ease-in-out infinite alternate;
}
.hero-video-wrap video {
  position:absolute; inset:0; z-index:1;
  opacity:.75; filter:sepia(.15) brightness(.85); /* v417: prima quasi nero (.48 e brightness .62) */
  transition:opacity .7s ease;
}
/* Il poster è il fotogramma del video originale; il video resta visibile anche prima del JS. */
.hero-video-wrap.video-ready video { opacity:.75; }
.hero-video-wrap.video-ready img { opacity:.25; }
@keyframes heroPosterDrift {
  from { transform:scale(1.015) translate3d(0,0,0); }
  to { transform:scale(1.045) translate3d(-.5%, -1%, 0); }
}
@media (max-width:900px) {
  .hero-video-wrap video { display:block; }
  .hero-video-wrap img { animation-duration:24s; }
}
@media (prefers-reduced-motion: reduce) {
  .hero-video-wrap img { animation:none; transform:none; }
  .hero-video-wrap video { display:none; }
}
.hero-video-wrap::after {
  content:''; position:absolute; inset:0;
  background:linear-gradient(90deg, rgba(18,12,6,.72) 0%, rgba(18,12,6,.30) 55%, rgba(18,12,6,.12) 100%); /* v417: leggibile a sinistra, foto visibile a destra */
}
.hero { position:relative; }
.hero-txt,.hero-vis { position:relative; z-index:2; }

/* ══════════════════════════════════════════════════
   2. VISTA 360°
   ══════════════════════════════════════════════════ */
.view360-wrap {
  position:relative; width:100%; aspect-ratio:1/1;
  display:flex; align-items:center; justify-content:center;
  cursor:grab; overflow:hidden; user-select:none;
  background:radial-gradient(ellipse at 50% 60%, rgba(196,154,74,.07), var(--bg2) 70%);
}
.view360-wrap:active { cursor:grabbing; }
.view360-img {
  width:80%; height:80%; object-fit:contain;
  transition:none; pointer-events:none;
  filter:drop-shadow(0 20px 40px rgba(0,0,0,.8)) drop-shadow(0 0 40px rgba(196,154,74,.1));
}
.view360-hint {
  position:absolute; bottom:14px; left:50%; transform:translateX(-50%);
  display:flex; align-items:center; gap:7px;
  font-size:8px; letter-spacing:2px; text-transform:uppercase; color:var(--cream-dim);
  background:rgba(18,12,6,.7); border:1px solid var(--border); padding:6px 14px;
  pointer-events:none; transition:opacity .3s;
}
.view360-hint svg { width:14px; height:14px; opacity:.6; }
.view360-degree {
  position:absolute; top:14px; right:14px;
  font-size:9px; letter-spacing:2px; color:var(--gold); font-family:'Cormorant Garamond',serif;
}
.view360-dots {
  position:absolute; bottom:42px; left:50%; transform:translateX(-50%);
  display:flex; gap:5px;
}
.v360-dot {
  width:4px; height:4px; border-radius:50%; background:var(--gold-dim); transition:all .2s;
}
.v360-dot.on { background:var(--gold); transform:scale(1.4); }

/* ══════════════════════════════════════════════════
   3. STICKY BUY BAR
   ══════════════════════════════════════════════════ */
.sticky-bar {
  position:fixed; bottom:0; left:0; right:0; z-index:500;
  background:rgba(18,12,6,.97); border-top:1px solid var(--border);
  backdrop-filter:blur(12px);
  display:flex; align-items:center; justify-content:space-between;
  padding:12px 28px; gap:16px;
  transform:translateY(100%); transition:transform .4s cubic-bezier(.25,.46,.45,.94);
  box-shadow:0 -10px 40px rgba(0,0,0,.5);
}
.sticky-bar.show { transform:translateY(0); }
.sticky-bar-name {
  font-family:'Cormorant Garamond',serif; font-size:18px; color:#ffffff; line-height:1;
}
.sticky-bar-sub { font-size:8px; letter-spacing:2px; text-transform:uppercase; color:var(--gold); margin-top:3px; }
.sticky-bar-price {
  font-family:'Cormorant Garamond',serif; font-size:26px; color:var(--beige-lt); white-space:nowrap;
}
.sticky-bar-btn {
  padding:11px 28px; background:var(--gold); color:var(--bg); border:none;
  font-family:'Jost',sans-serif; font-size:8.5px; letter-spacing:3.5px;
  text-transform:uppercase; cursor:pointer; transition:background .25s; font-weight:500; white-space:nowrap;
}
.sticky-bar-btn:hover { background:var(--gold-lt); }

/* ══════════════════════════════════════════════════
   4. SOCIAL PROOF TOAST
   ══════════════════════════════════════════════════ */
.sp-popup {
  position:fixed; bottom:28px; left:28px; z-index:1800;
  background:var(--surf); border:1px solid rgba(196,154,74,.2);
  padding:13px 16px; display:flex; align-items:center; gap:12px;
  max-width:280px; box-shadow:0 10px 40px rgba(0,0,0,.6);
  transform:translateX(-120%); transition:transform .5s cubic-bezier(.25,.46,.45,.94);
  pointer-events:none;
}
.sp-popup.show { transform:translateX(0); }
.sp-avatar {
  width:40px; height:40px; border-radius:50%; background:var(--bg);
  border:1px solid rgba(196,154,74,.2);
  display:flex; align-items:center; justify-content:center;
  font-size:22px; flex-shrink:0; line-height:1;
}
.sp-text { font-size:11px; color:var(--beige); line-height:1.5; }
.sp-text strong { color:var(--gold-lt); }
.sp-time { font-size:8px; color:var(--cream-dim); margin-top:3px; letter-spacing:1px; }

/* ══════════════════════════════════════════════════
   5. WISHLIST
   ══════════════════════════════════════════════════ */
.wish-btn {
  position:relative;
}
.wish-btn.active { color:var(--gold) !important; border-color:var(--gold) !important; }
.wish-btn.active::after { content:'♥'; position:absolute; inset:0; display:flex; align-items:center; justify-content:center; font-size:17px; }
.wish-nav-btn {
  background:none; border:none; cursor:pointer;
  color:var(--cream-dim); font-size:17px; padding:4px;
  transition:color .25s; position:relative;
}
.wish-nav-btn:hover { color:var(--gold); }
.wish-cnt {
  position:absolute; top:-5px; right:-7px; background:var(--gold);
  color:var(--bg); border-radius:50%; width:15px; height:15px;
  font-size:7.5px; font-weight:600; display:flex; align-items:center;
  justify-content:center; font-family:'Jost',sans-serif;
  opacity:0; transform:scale(0); transition:all .2s;
}
.wish-cnt.on { opacity:1; transform:scale(1); }
.wish-ov { position:fixed; inset:0; background:rgba(0,0,0,.65); z-index:800; opacity:0; pointer-events:none; transition:opacity .3s; backdrop-filter:blur(4px); }
.wish-ov.open { opacity:1; pointer-events:all; }
.wish-dr { position:fixed; top:0; right:0; bottom:0; width:380px; max-width:94vw; background:var(--surf); z-index:900; display:flex; flex-direction:column; transform:translateX(100%); transition:transform .4s cubic-bezier(.25,.46,.45,.94); border-left:1px solid var(--border); }
.wish-dr.open { transform:none; }
.wish-hd { padding:19px 21px 14px; border-bottom:1px solid var(--border); display:flex; align-items:center; justify-content:space-between; }
.wish-ttl { font-family:'Cormorant Garamond',serif; font-size:18px; color:#ffffff; letter-spacing:2px; }
.wish-x { background:none; border:none; color:var(--cream-dim); cursor:pointer; font-size:15px; padding:4px; transition:color .2s; }
.wish-x:hover { color:var(--beige); }
.wish-body { flex:1; overflow-y:auto; padding:13px 19px; }
.wish-item { display:grid; grid-template-columns:58px 1fr auto; gap:10px; align-items:center; padding:10px 0; border-bottom:1px solid rgba(196,154,74,.07); }
.wish-item-img { width:58px; height:72px; background:var(--bg2); border:1px solid var(--border); overflow:hidden; display:flex; align-items:center; justify-content:center; }
.wish-item-img img { width:100%; height:100%; object-fit:cover; }
.wish-item-name { font-family:'Cormorant Garamond',serif; font-size:14px; color:var(--beige-lt); margin-bottom:3px; }
.wish-item-price { font-size:13px; color:var(--gold-lt); font-family:'Cormorant Garamond',serif; margin-bottom:6px; }
.wish-item-add { font-size:7.5px; letter-spacing:1.5px; text-transform:uppercase; color:var(--gold); cursor:pointer; background:none; border:1px solid rgba(196,154,74,.3); padding:5px 10px; font-family:'Jost',sans-serif; transition:all .2s; }
.wish-item-add:hover { background:var(--gold); color:var(--bg); }
.wish-rm { background:none; border:none; color:var(--cream-dim); cursor:pointer; font-size:14px; padding:4px; transition:color .2s; }
.wish-rm:hover { color:#b03030; }
.wish-empty { text-align:center; padding:50px 20px; }
.wish-empty-ic { font-size:36px; opacity:.25; margin-bottom:12px; }
.wish-empty-tx { font-size:12px; color:var(--cream-dim); letter-spacing:1px; }

/* ══════════════════════════════════════════════════
   6. MAPPA DELLE NOTE (radar chart)
   ══════════════════════════════════════════════════ */
.notes-map-sec {
  padding:64px 52px; background:var(--bg2); border-top:1px solid var(--border);
}
.notes-map-inner {
  display:grid; grid-template-columns:1fr 1fr; gap:56px; align-items:center;
  max-width:1100px; margin:0 auto;
}
.notes-map-canvas-wrap {
  position:relative; display:flex; align-items:center; justify-content:center;
}
canvas#notesRadar {
  max-width:360px; width:100%;
}
.notes-map-legend {
  display:flex; flex-direction:column; gap:18px;
}
.nml-group { }
.nml-label {
  font-size:7.5px; letter-spacing:3px; text-transform:uppercase;
  color:var(--gold); margin-bottom:8px;
}
.nml-pills {
  display:flex; flex-wrap:wrap; gap:7px;
}
.nml-pill {
  padding:5px 12px; border:1px solid var(--border); background:var(--bg);
  font-size:10.5px; color:var(--cream-dim); letter-spacing:.5px;
  cursor:pointer; transition:all .2s;
}
.nml-pill:hover,.nml-pill.on { border-color:var(--gold); color:var(--gold); background:rgba(196,154,74,.07); }
@media(max-width:900px){
  .notes-map-inner { grid-template-columns:1fr; }
  .notes-map-sec { padding:44px 22px; }
  canvas#notesRadar { max-width:280px; }
}

/* ══════════════════════════════════════════════════
   7. JOURNAL / BLOG
   ══════════════════════════════════════════════════ */
.journal-grid {
  display:grid; grid-template-columns:repeat(4,1fr); gap:1px;
  background:var(--border); margin:28px 52px; border:1px solid var(--border);
}
.jcard {
  background:var(--bg2); cursor:pointer; transition:background .3s;
  display:flex; flex-direction:column;
}
.jcard:hover { background:var(--surf); }
.jcard-img {
  aspect-ratio:16/9; overflow:hidden; position:relative;
  background:radial-gradient(ellipse at 50% 50%, rgba(196,154,74,.06), var(--bg) 80%);
  display:flex; align-items:center; justify-content:center;
}
.jcard-img img { width:100%; height:100%; object-fit:cover; transition:transform .6s; }
.jcard:hover .jcard-img img { transform:scale(1.04); }
.jcard-img-ph { font-size:38px; color:rgba(196,154,74,.12); }
.jcard-tag {
  position:absolute; top:12px; left:12px;
  background:var(--gold); color:var(--bg); font-size:7px; letter-spacing:2.5px;
  text-transform:uppercase; padding:4px 9px; font-family:'Jost',sans-serif;
}
.jcard-body { padding:20px 22px 26px; flex:1; display:flex; flex-direction:column; gap:7px; }
.jcard-date { font-size:7.5px; letter-spacing:2px; text-transform:uppercase; color:var(--gold); }
.jcard-title { font-family:'Cormorant Garamond',serif; font-size:21px; color:#ffffff; line-height:1.25; font-weight:400; letter-spacing:0.1px }
.jcard-excerpt { font-size:13px; color:var(--cream-dim); line-height:1.85; flex:1; font-weight:400 }
.jcard-read { font-size:8px; letter-spacing:2.5px; text-transform:uppercase; color:var(--gold); margin-top:12px; display:flex; align-items:center; gap:6px; }
.jcard-read::after { content:'→'; transition:transform .2s; }
.jcard:hover .jcard-read::after { transform:translateX(4px); }
/* Article reader */
.article-back { display:flex; align-items:center; gap:6px; font-size:8px; letter-spacing:2.5px; text-transform:uppercase; color:var(--cream-dim); cursor:pointer; background:none; border:none; font-family:'Jost',sans-serif; margin-bottom:22px; transition:color .2s; padding:0; }
.article-back:hover { color:var(--gold); }
.article-hero-img { width:100%; max-height:380px; object-fit:cover; object-position:center 30%; margin-bottom:36px; }
.article-title { font-family:'Cormorant Garamond',serif; font-size:clamp(30px,4vw,54px); font-weight:600; color:#f8ead0; line-height:1.1; margin-bottom:12px; letter-spacing:-0.3px; text-shadow:0 2px 16px rgba(0,0,0,.6) }
.article-meta { display:flex; align-items:center; gap:20px; margin-bottom:28px; flex-wrap:wrap; }
.article-tag { background:var(--gold); color:var(--bg); font-size:7px; letter-spacing:2px; text-transform:uppercase; padding:4px 10px; }
.article-date { font-size:8.5px; letter-spacing:2px; text-transform:uppercase; color:var(--cream-dim); }
.article-read-time { font-size:8.5px; color:var(--gold); letter-spacing:1.5px; }
.article-body { font-size:15.5px; color:#d4b07a; line-height:2.15; max-width:740px; font-weight:400 }
.article-body p { margin-bottom:18px; }
.article-body h3 { font-family:'Cormorant Garamond',serif; font-size:27px; color:#f8ead0; font-weight:500; margin:36px 0 14px; letter-spacing:0.2px; text-shadow:0 1px 8px rgba(0,0,0,.4) }
.article-body blockquote { border-left:3px solid var(--gold); padding:14px 22px; font-style:italic; color:#e0c88a; margin:28px 0; background:rgba(196,154,74,.06); font-size:16px; line-height:2; }
@media(max-width:900px){
  .journal-grid { grid-template-columns:1fr 1fr; margin:16px 22px; }
}
@media(max-width:600px){
  .journal-grid { grid-template-columns:1fr; margin:14px 14px; }
  .jcard-title { font-size:20px; }
  .jcard-body { padding:16px 18px 20px; }
}

/* ══════════════════════════════════════════════════
   8. RECENSIONI CON STELLE
   ══════════════════════════════════════════════════ */
.reviews-sec {
  padding:64px 52px; border-top:1px solid var(--border);
}
.reviews-header {
  display:flex; align-items:flex-end; justify-content:space-between; margin-bottom:36px; flex-wrap:wrap; gap:16px;
}
.reviews-score {
  display:flex; align-items:center; gap:22px;
}
.reviews-score-big {
  font-family:'Cormorant Garamond',serif; font-size:64px; color:var(--beige-lt); line-height:1;
}
.reviews-score-sub { }
.reviews-stars-row {
  display:flex; gap:4px; margin-bottom:4px;
}
.star { color:var(--gold); font-size:18px; }
.star.empty { color:var(--gold-dim); }
.star.half { position:relative; }
.reviews-count { font-size:9px; letter-spacing:2px; text-transform:uppercase; color:var(--cream-dim); }
.reviews-grid {
  display:grid; grid-template-columns:repeat(3,1fr); gap:1px;
  background:var(--border); border:1px solid var(--border); margin-bottom:32px;
}
.review-card {
  background:var(--bg2); padding:24px 22px;
}
.rc-head { display:flex; align-items:center; justify-content:space-between; margin-bottom:14px; }
.rc-name { font-family:'Cormorant Garamond',serif; font-size:17px; color:#ffffff; }
.rc-date { font-size:8px; letter-spacing:1.5px; color:var(--cream-dim); text-transform:uppercase; }
.rc-stars { display:flex; gap:3px; margin-bottom:10px; }
.rc-star { color:var(--gold); font-size:13px; }
.rc-star.empty { color:var(--gold-dim); }
.rc-text { font-size:12.5px; color:var(--cream-dim); line-height:1.85; font-style:italic; }
.rc-verified { display:inline-flex; align-items:center; gap:5px; font-size:7.5px; letter-spacing:1.5px; text-transform:uppercase; color:#6a9060; margin-top:10px; }
/* Write review form */
.review-form-wrap {
  background:var(--bg2); border:1px solid var(--border); padding:28px 24px;
}
.rf-title { font-family:'Cormorant Garamond',serif; font-size:22px; color:var(--beige-lt); margin-bottom:5px; font-weight:300; }
.rf-sub { font-size:12px; color:var(--cream-dim); margin-bottom:18px; line-height:1.7; }
.rf-stars { display:flex; gap:8px; margin-bottom:18px; cursor:pointer; }
.rf-star { font-size:28px; color:var(--gold-dim); transition:color .15s; cursor:pointer; }
.rf-star.on { color:var(--gold); }
.rf-row { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-bottom:12px; }
.rf-g { display:flex; flex-direction:column; gap:4px; }
.rf-lbl { font-size:7.5px; letter-spacing:2.5px; text-transform:uppercase; color:var(--cream-dim); }
.rf-in,.rf-ta { background:var(--bg); border:1px solid var(--border); color:var(--beige); padding:9px 11px; font-family:'Jost',sans-serif; font-size:12.5px; outline:none; transition:border-color .25s; width:100%; }
.rf-in:focus,.rf-ta:focus { border-color:var(--gold); }
.rf-in::placeholder,.rf-ta::placeholder { color:var(--cream-dim); opacity:.4; }
.rf-ta { resize:vertical; min-height:90px; margin-bottom:12px; }
.rf-submit { padding:11px 28px; background:var(--gold); color:var(--bg); border:none; font-family:'Jost',sans-serif; font-size:9px; letter-spacing:3.5px; text-transform:uppercase; cursor:pointer; font-weight:500; transition:background .3s; }
.rf-submit:hover { background:var(--gold-lt); }
.rf-ok { background:rgba(66,96,64,.1); border:1px solid rgba(66,96,64,.3); padding:10px 14px; color:#6a9060; font-size:9px; letter-spacing:1.5px; text-transform:uppercase; display:none; margin-top:10px; text-align:center; }
.rf-ok.show { display:block; }
@media(max-width:900px){
  .reviews-grid { grid-template-columns:1fr; }
  .reviews-sec { padding:44px 22px; }
}

/* ══════════════════════════════════════════════════════
   FAMIGLIE OLFATTIVE — grid, cards, modal
   ══════════════════════════════════════════════════════ */
.fam-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 2px;
  padding: 2px;
  background: var(--border);
}
.fam-card {
  background: var(--bg2);
  cursor: pointer;
  overflow: hidden;
  position: relative;
  transition: background .25s;
  display: flex;
  flex-direction: column;
}
.fam-card:hover { background: var(--surf); }
.fam-card-img {
  width: 100%;
  aspect-ratio: 4/3;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 64px;
  transition: transform .5s;
  flex-shrink: 0;
}
.fam-card:hover .fam-card-img { transform: scale(1.06); }
.fam-card-img-wrap { overflow: hidden; flex-shrink: 0; }
.fam-card-body {
  padding: 24px 22px 20px;
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.fam-card-eye {
  font-size: 8px;
  letter-spacing: 4px;
  text-transform: uppercase;
  color: var(--gold);
}
.fam-card-name {
  font-family: 'Cormorant Garamond', serif;
  font-size: clamp(20px, 2.5vw, 26px);
  font-weight: 400;
  color: #ffffff;
  line-height: 1.2;
  margin: 0;
}
.fam-card-desc {
  font-size: 12px;
  color: var(--cream-dim);
  line-height: 1.7;
  margin: 0;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.fam-card-notes { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 4px; }
.fam-note-tag {
  font-size: 8px;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  color: var(--gold);
  border: 1px solid rgba(196,154,74,.3);
  padding: 3px 8px;
  border-radius: 2px;
}
.fam-card-cta {
  margin-top: auto;
  padding-top: 14px;
  font-size: 8px;
  letter-spacing: 3px;
  text-transform: uppercase;
  color: var(--cream-dim);
  display: flex;
  align-items: center;
  gap: 6px;
}
.fam-card-cta::after {
  content: '→';
  color: var(--gold);
  font-size: 12px;
  transition: transform .2s;
}
.fam-card:hover .fam-card-cta::after { transform: translateX(4px); }
/* MODAL */
.fam-modal-overlay {
  position: fixed; inset: 0;
  background: rgba(0,0,0,.75);
  z-index: 900;
  opacity: 0; pointer-events: none;
  transition: opacity .3s;
}
.fam-modal-overlay.open { opacity: 1; pointer-events: all; }
.fam-modal {
  position: fixed;
  top: 50%; left: 50%;
  transform: translate(-50%, -60%);
  width: min(700px, 94vw);
  max-height: 88vh;
  background: var(--bg2);
  border: 1px solid var(--border);
  z-index: 901;
  overflow-y: auto;
  opacity: 0; pointer-events: none;
  transition: opacity .3s, transform .3s;
}
.fam-modal.open {
  opacity: 1; pointer-events: all;
  transform: translate(-50%, -50%);
}
.fam-modal-close {
  position: sticky; top: 0;
  float: right;
  margin: 14px 14px 0 0;
  background: var(--surf);
  border: 1px solid var(--border);
  color: var(--beige);
  width: 32px; height: 32px;
  font-size: 13px;
  cursor: pointer;
  z-index: 10;
}
.fam-modal-inner { padding: 0 0 36px; }
.fam-modal-body { padding: 28px 32px 0; }
.fam-modal-eye {
  font-size: 8px; letter-spacing: 4px;
  text-transform: uppercase; color: var(--gold);
  display: block; margin-bottom: 8px;
}
.fam-modal-title {
  font-family: 'Cormorant Garamond', serif;
  font-size: clamp(26px, 4vw, 40px);
  font-weight: 400;
  color: #ffffff;
  margin: 0 0 20px;
  line-height: 1.2;
}
.fam-modal-desc {
  font-size: 13px; color: var(--cream-dim);
  line-height: 1.85; margin-bottom: 24px;
}
.fam-modal-section { margin-bottom: 22px; }
.fam-modal-section-ttl {
  font-size: 8px; letter-spacing: 3px;
  text-transform: uppercase; color: var(--gold-dim);
  margin-bottom: 10px; display: block;
}
.fam-modal-tags { display: flex; flex-wrap: wrap; gap: 6px; }
.fam-modal-tag {
  font-size: 9px; letter-spacing: 1.5px;
  text-transform: uppercase; color: var(--beige);
  border: 1px solid var(--border);
  padding: 5px 12px; background: var(--surf);
}
.fam-modal-examples { font-size: 12px; color: var(--cream-dim); line-height: 1.8; }
.fam-modal-sensation {
  background: var(--surf);
  border-left: 2px solid var(--gold);
  padding: 14px 18px;
  font-size: 13px; font-style: italic;
  color: var(--beige-lt); line-height: 1.7;
}
.fam-modal-profano {
  margin: 24px 32px 0;
  background: linear-gradient(135deg, var(--surf), var(--bg3));
  border: 1px solid rgba(196,154,74,.3);
  padding: 18px 22px;
  display: flex; align-items: center; gap: 16px;
}
.fam-modal-profano-ico { font-size: 24px; flex-shrink: 0; }
.fam-modal-profano-txt { font-size: 11px; color: var(--cream-dim); line-height: 1.6; }
/* Apple Pay button */
.apple-pay-btn {
  width: 100%;
  background: #000;
  color: #fff;
  border: none;
  padding: 14px;
  font-size: 15px;
  letter-spacing: 0.5px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  margin-bottom: 10px;
  border-radius: 6px;
  font-family: -apple-system, BlinkMacSystemFont, sans-serif;
  transition: opacity .2s;
}
.apple-pay-btn:hover { opacity: .88; }
.apple-pay-btn svg { height: 20px; width: auto; }
.co-divider {
  display: flex; align-items: center; gap: 10px;
  margin-bottom: 10px; color: var(--cream-dim); font-size: 10px; letter-spacing: 2px;
}
.co-divider::before,.co-divider::after {
  content:''; flex:1; height:1px; background:var(--border);
}

/* ── PAYMENT METHOD SELECTOR ── */
.pay-methods { display:flex; flex-direction:column; gap:10px; margin-bottom:20px; }
.pay-method {
  border:1px solid var(--border);
  background:var(--bg3);
  padding:0;
  cursor:pointer;
  transition:border-color .2s, background .2s;
  overflow:hidden;
}
.pay-method.active { border-color:var(--gold); background:var(--surf); }
.pay-method-hd {
  display:flex; align-items:center; gap:14px;
  padding:14px 18px;
}
.pay-method-radio {
  width:16px; height:16px; border-radius:50%;
  border:2px solid var(--gold-dim); flex-shrink:0;
  display:flex; align-items:center; justify-content:center;
  transition:border-color .2s;
}
.pay-method.active .pay-method-radio { border-color:var(--gold); }
.pay-method.active .pay-method-radio::after {
  content:''; width:8px; height:8px; border-radius:50%;
  background:var(--gold); display:block;
}
.pay-method-icon { font-size:18px; flex-shrink:0; }
.pay-method-lbl {
  font-size:12px; letter-spacing:1.5px; text-transform:uppercase;
  color:var(--beige); flex:1;
}
.pay-method-badge {
  font-size:8px; letter-spacing:1px; text-transform:uppercase;
  background:var(--gold-faint); border:1px solid rgba(196,154,74,.25);
  color:var(--gold); padding:3px 8px;
}
.pay-method-body {
  display:none; padding:0 18px 16px 48px;
  border-top:1px solid var(--border);
}
.pay-method.active .pay-method-body { display:block; }
.bonifico-box {
  background:var(--bg2); border:1px solid var(--border);
  padding:14px 16px; margin-top:12px;
  font-size:11px; line-height:2; color:var(--cream-dim);
}
.bonifico-box strong { color:var(--beige); display:block; margin-bottom:4px; font-size:10px; letter-spacing:2px; text-transform:uppercase; }
.bonifico-row { display:flex; gap:8px; align-items:baseline; }
.bonifico-key { color:var(--gold-dim); font-size:9px; letter-spacing:1px; text-transform:uppercase; min-width:80px; }
.bonifico-val { color:var(--beige); font-size:12px; font-family:'Cormorant Garamond',serif; }
.paypal-info { margin-top:12px; font-size:11px; color:var(--cream-dim); line-height:1.7; }
.paypal-logo { font-size:20px; font-weight:700; color:#003087; letter-spacing:-1px; }
.paypal-logo span { color:#009cde; }
.apple-pay-inline {
  display:flex; align-items:center; gap:8px;
  margin-top:12px; font-size:11px; color:var(--cream-dim); line-height:1.7;
}
.apple-pay-logo-sm {
  background:#000; border-radius:4px; padding:4px 10px;
  font-size:13px; font-family:-apple-system,BlinkMacSystemFont,sans-serif;
  color:#fff; letter-spacing:0.3px; white-space:nowrap;
}

/* ══ SISTEMA ANIMAZIONI — reveal + stagger + hero ══════════ */

/* ── 1. Base reveal: fade + slide dal basso ── */
.reveal {
  opacity: 0;
  transform: translateY(28px);
  transition: opacity .8s cubic-bezier(.22,1,.36,1),
              transform .8s cubic-bezier(.22,1,.36,1);
}
.reveal.vis {
  opacity: 1;
  transform: translateY(0);
}

/* ── 2. Stagger per gruppi di card (journal, collection) ── */
.stagger-card {
  opacity: 0;
  transform: translateY(24px);
  transition: opacity .6s cubic-bezier(.22,1,.36,1),
              transform .6s cubic-bezier(.22,1,.36,1);
}
.stagger-card.vis { opacity: 1 !important; transform: none !important; }

/* ── 3. Hero title: animazione CSS pura, nessun JS ── */
@keyframes heroIn {
  from { opacity:0; transform:translateY(32px); }
  to   { opacity:1; transform:translateY(0); }
}
.hero-txt {
  animation: heroIn 1s cubic-bezier(.22,1,.36,1) .15s both;
}

/* ── 4. Heading e eyebrow: animati via .vis (aggiunto da JS) ── */
.heading-anim,
.eyebrow-anim {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity .7s cubic-bezier(.22,1,.36,1),
              transform .7s cubic-bezier(.22,1,.36,1);
}
.heading-anim.vis,
.eyebrow-anim.vis {
  opacity: 1;
  transform: none;
}

/* ── 5. Line-reveal: singole righe con delay progressivo ── */
.line-reveal {
  opacity: 0;
  transform: translateY(16px);
  transition: opacity .6s ease, transform .6s ease;
}
.line-reveal.vis { opacity: 1; transform: none; }

/* ── 6. keyframes utilities ── */
@keyframes fadeIn   { from{opacity:0} to{opacity:1} }
@keyframes float    { 0%,100%{transform:translateY(0)} 50%{transform:translateY(-8px)} }
@keyframes pulse    { 0%,100%{opacity:1} 50%{opacity:.55} }
@keyframes shimmer  { 0%{background-position:-200% 0} 100%{background-position:200% 0} }
@keyframes slideUpFade { from{opacity:0;transform:translateY(20px)} to{opacity:1;transform:none} }

/* ══ SFONDO NERO ESPLICITO — TUTTE LE PAGINE ══ */
.page,
#page-home,
#page-collection,
#page-product,
#page-famiglie,
#page-progetto,
#page-consult,
#page-about,
#page-contacts,
#page-journal {
  background: var(--bg);
  color: var(--beige);
}
.pd-wrap,
.pd-info,
.pd-gal {
  background: var(--bg);
}
.page-hd {
  background: var(--bg);
}
.wheel-wrap,
.wheel-svg-wrap,
#fam-wheel-wrap {
  background: var(--bg);
}
#journal-article {
  background: var(--bg);
}

/* ══ ARTICOLI — h2 mancante ══ */
.article-body h2 {
  font-family:'Cormorant Garamond',serif;
  font-size: clamp(22px, 3vw, 32px);
  font-weight: 400;
  color: var(--beige-lt);
  margin: 38px 0 14px;
  letter-spacing: 0.3px;
  line-height: 1.2;
}
.article-body h1 {
  font-family:'Cormorant Garamond',serif;
  font-size: clamp(26px, 4vw, 40px);
  font-weight: 400;
  color: var(--beige-lt);
  margin: 0 0 18px;
}
.article-body p { color: var(--beige); }
.article-body strong { color: var(--beige-lt); font-weight: 500; }
.article-body em { color: var(--cream-dim); }

/* ══ ANIMAZIONE HEADING / EYEBROW al cambio pagina ══ */
.heading:not(.no-anim):not(.vis) {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity .65s cubic-bezier(.22,1,.36,1),
              transform .65s cubic-bezier(.22,1,.36,1);
}
.heading.vis {
  opacity: 1 !important;
  transform: none !important;
  transition: opacity .65s cubic-bezier(.22,1,.36,1),
              transform .65s cubic-bezier(.22,1,.36,1);
}
.eyebrow:not(.no-anim):not(.vis) {
  opacity: 0;
  transform: translateY(14px);
  transition: opacity .5s cubic-bezier(.22,1,.36,1) .1s,
              transform .5s cubic-bezier(.22,1,.36,1) .1s;
}
.eyebrow.vis {
  opacity: 1 !important;
  transform: none !important;
}
/* Aggiungi heading e eyebrow all'observer tramite reobserveReveal */

/* ══════════════════════════════════════════════════════════════
   FRAGRANCE WHEEL — SEZIONE EDUCATIVA
══════════════════════════════════════════════════════════════ */

.wheel-edu-section {
  padding: 0 0 60px;
}

/* Intro */
.wheel-edu-intro {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 48px;
  align-items: start;
  margin: 48px 0 56px;
  padding: 40px;
  background: var(--surf);
  border: 1px solid var(--border);
  border-radius: 2px;
}
@media(max-width: 768px) {
  .wheel-edu-intro { grid-template-columns: 1fr; gap: 28px; padding: 24px; }
}
.wheel-edu-title {
  font-family: 'Cormorant Garamond', serif;
  font-size: clamp(24px, 3.5vw, 38px);
  font-weight: 300;
  color: var(--beige-lt);
  letter-spacing: 0.5px;
  margin-bottom: 20px;
  line-height: 1.2;
}
.wheel-edu-body {
  font-size: 13px;
  color: var(--cream-dim);
  line-height: 1.85;
  margin-bottom: 14px;
}
.wheel-edu-body strong { color: var(--beige-lt); }
.wheel-edu-body em { color: var(--gold); font-style: normal; }

/* Schema macro-famiglie */
.wheel-edu-macro { display: flex; flex-direction: column; gap: 12px; }
.macro-block {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 14px 18px;
  border-radius: 2px;
  border-left: 3px solid;
}
.macro-block strong { display: block; font-size: 11px; letter-spacing: 2.5px; color: var(--beige-lt); margin-bottom: 3px; }
.macro-block span { font-size: 11px; color: var(--cream-dim); }
.macro-fresh    { background: #f5c84210; border-color: #f5c842; }
.macro-floral   { background: #e87cbf10; border-color: #e87cbf; }
.macro-oriental { background: #8b3a8b10; border-color: #8b3a8b; }
.macro-woody    { background: #7a5c2e10; border-color: #7a5c2e; }
.macro-ico { font-size: 22px; flex-shrink: 0; }

/* Accordi */
.wheel-accordi-section {
  margin: 60px 0;
  padding: 40px;
  background: var(--surf);
  border: 1px solid var(--border);
  border-radius: 2px;
}
.accordi-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  gap: 14px;
}
.accordo-card {
  background: var(--bg);
  border: 1px solid var(--border);
  border-radius: 2px;
  padding: 16px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  transition: border-color .2s;
}
.accordo-card:hover { border-color: var(--gold); }
.accordo-icon {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
}
.accordo-card strong {
  font-size: 11px;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  color: var(--beige-lt);
}
.accordo-card span {
  font-size: 11px;
  color: var(--cream-dim);
  line-height: 1.65;
}

/* Ruota interattiva */
.wheel-interactive-section {
  margin: 60px 0 0;
}
.wheel-layout {
  display: grid;
  grid-template-columns: 560px 1fr;
  gap: 32px;
  align-items: start;
}
@media(max-width: 900px) {
  .wheel-layout { grid-template-columns: 1fr; }
}
.wheel-svg-wrap { position: relative; }
.wheel-macro-labels {
  position: absolute;
  top: 0; left: 0; right: 0; bottom: 0;
  pointer-events: none;
}
.wml {
  position: absolute;
  font-size: 9px;
  letter-spacing: 3px;
  text-transform: uppercase;
  color: var(--cream-dim);
  font-family: sans-serif;
}
.wml-fresh    { top: -18px; left: 50%; transform: translateX(-50%); }
.wml-floral   { right: -56px; top: 50%; transform: translateY(-50%) rotate(90deg); }
.wml-oriental { bottom: -18px; left: 50%; transform: translateX(-50%); }
.wml-woody    { left: -56px; top: 50%; transform: translateY(-50%) rotate(-90deg); }

/* Panel info ruota */
.wheel-info-panel {
  background: var(--surf);
  border: 1px solid var(--border);
  border-radius: 2px;
  padding: 28px;
  min-height: 320px;
  display: flex;
  align-items: flex-start;
}
.wheel-info-placeholder {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  height: 100%;
  min-height: 260px;
  text-align: center;
}
.wheel-info-content { width: 100%; }
.wheel-info-hd {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 16px;
  padding-bottom: 14px;
  border-bottom: 1px solid var(--border);
}
.wheel-info-emoji { font-size: 32px; flex-shrink: 0; }
.wheel-info-eye {
  font-size: 9px;
  letter-spacing: 2.5px;
  text-transform: uppercase;
  color: var(--cream-dim);
  margin-bottom: 4px;
}
.wheel-info-name {
  font-family: 'Cormorant Garamond', serif;
  font-size: clamp(20px, 2.5vw, 28px);
  font-weight: 300;
  color: var(--beige-lt);
  line-height: 1.2;
}
.wheel-info-desc {
  font-size: 12px;
  color: var(--cream-dim);
  line-height: 1.8;
  margin-bottom: 18px;
}
.wheel-info-section { margin-bottom: 14px; }
.wheel-info-label {
  font-size: 8px;
  letter-spacing: 2.5px;
  text-transform: uppercase;
  color: var(--gold);
  margin-bottom: 8px;
}
.wheel-note-pills { display: flex; flex-wrap: wrap; gap: 6px; }
.wheel-note-pill {
  padding: 4px 10px;
  border-radius: 20px;
  border: 1px solid var(--border);
  font-size: 10px;
  color: var(--cream-dim);
  background: var(--bg);
}
.accord-pill {
  background: var(--surf);
  color: var(--beige);
  border-color: var(--gold-dim, #c49a4a55);
}
.wheel-cta {
  display: inline-block;
  margin-top: 16px;
  padding: 10px 20px;
  background: transparent;
  border: 1px solid var(--gold);
  color: var(--gold);
  font-size: 10px;
  letter-spacing: 2px;
  text-transform: uppercase;
  cursor: pointer;
  font-family: inherit;
  transition: background .2s, color .2s;
}
.wheel-cta:hover { background: var(--gold); color: var(--bg); }

/* Slice hover */
.wheel-slice { transition: opacity .15s, filter .15s; }
.wheel-slice:hover { opacity: 1 !important; filter: brightness(1.4) !important; }

/* Griglia famiglie estesa */
.fam-section { padding: 0 0 60px; }

.fam-card-notes {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  margin-top: 12px;
}
.fam-card-note {
  padding: 3px 9px;
  border-radius: 16px;
  border: 1px solid var(--border);
  font-size: 9px;
  letter-spacing: 0.5px;
  background: transparent;
}

/* ── wheel-center (cerchio centrale ruota interattiva) ── */
.wheel-center { pointer-events: none; }
.wheel-center-emoji {
  font-size: 20px;
  dominant-baseline: middle;
  text-anchor: middle;
}
.wheel-center-name {
  font-size: 6px;
  fill: var(--gold);
  letter-spacing: 1.5px;
  text-anchor: middle;
  dominant-baseline: middle;
  text-transform: uppercase;
  font-family: sans-serif;
}

/* ── accordi-grid mobile ── */
@media(max-width: 600px) {
  .accordi-grid { grid-template-columns: 1fr 1fr; gap: 10px; }
  .accordo-card { padding: 12px; }
  .wheel-edu-intro { padding: 18px; }
  .wheel-accordi-section { padding: 24px 18px; }
}
@media(max-width: 420px) {
  .accordi-grid { grid-template-columns: 1fr; }
}

/* ══ BUG-FIX: classi mancanti ══ */

/* fam-modal-hd — header del modal famiglia */
.fam-modal-hd { margin-bottom: 24px; }

/* ft-famiglie — link footer "Famiglie Olfattive" */
.ft-famiglie { cursor: pointer; transition: color .2s; }
.ft-famiglie:hover { color: var(--gold); }

/* wheel-edu-intro-text — colonna testo del grid intro */
.wheel-edu-intro-text { display: flex; flex-direction: column; }

/* wheel-edu-schema — colonna schema del grid intro */
.wheel-edu-schema { display: flex; flex-direction: column; justify-content: center; }

/* ══ Apple Pay compat notes ══ */
.ap-note {
  font-size: 11px;
  color: var(--cream-dim);
  line-height: 1.65;
  margin-top: 8px;
}
.ap-check {
  font-size: 11px;
  display: block;
  margin-top: 6px;
  line-height: 1.6;
}
.ap-ok      { color: #5a9a5a; }
.ap-warn    { color: var(--cream-dim); }
.ap-checking{ color: var(--cream-dim); font-style: italic; }

/* Apple Pay real button */
.apple-pay-btn-real {
  display: block;
  width: 100%;
  margin-top: 14px;
  padding: 14px;
  background: #000;
  color: #fff;
  border: none;
  border-radius: 8px;
  font-size: 18px;
  font-family: -apple-system, sans-serif;
  cursor: pointer;
  letter-spacing: 0.5px;
  -webkit-font-smoothing: antialiased;
}
.apple-pay-btn-real:hover { background: #1a1a1a; }

/* ══ BUG-FIX: CSS classi famiglie mancanti ══ */

/* Wrapper SVG ruota + pannello info */
.fam-wheel-wrap {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 32px;
  align-items: start;
  margin: 40px 0;
}
@media(max-width:800px){
  .fam-wheel-wrap { grid-template-columns: 1fr; }
}

/* Sezione accordi educativi */
.wheel-edu-accordi { margin-top: 48px; }

/* Pill accordo nella ruota interattiva */
.wheel-accord-pill {
  display: inline-block;
  padding: 4px 12px;
  border-radius: 20px;
  font-size: 10px;
  letter-spacing: 1px;
  text-transform: uppercase;
  background: rgba(232,192,96,0.12);
  border: 1px solid rgba(232,192,96,0.25);
  color: var(--gold);
  margin: 3px 2px;
}

/* CTA button dentro la ruota info */
.wheel-cta-btn, .wheel-cta {
  display: block;
  margin-top: 16px;
  padding: 10px 20px;
  background: transparent;
  border: 1px solid var(--gold);
  color: var(--gold);
  font-family: var(--font-main);
  font-size: 10px;
  letter-spacing: 2.5px;
  text-transform: uppercase;
  cursor: pointer;
  transition: all .25s;
  width: 100%;
}
.wheel-cta-btn:hover, .wheel-cta:hover {
  background: rgba(232,192,96,0.1);
}

/* Header card famiglie */
.fam-card-hd {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 12px;
}

/* Pills note nel card famiglia */
.fam-note-pill {
  display: inline-block;
  padding: 3px 10px;
  border-radius: 20px;
  font-size: 9.5px;
  letter-spacing: 0.8px;
  border: 1px solid;
  margin: 2px;
  opacity: 0.85;
}

/* Pills accordo nel card famiglia */
.fam-accord-pill {
  display: inline-block;
  padding: 3px 10px;
  border-radius: 20px;
  font-size: 9px;
  letter-spacing: 0.8px;
  border: 1px solid rgba(232,192,96,0.3);
  color: var(--gold);
  margin: 2px;
  background: rgba(232,192,96,0.05);
}

/* Modal famiglia — sezioni interne */
.fam-modal-notes, .fam-modal-accordi {
  margin: 16px 0;
}
.fam-modal-notes .fam-note-pill { font-size: 10px; }

/* Modal CTA */
.fam-modal-cta {
  display: block;
  width: 100%;
  margin-top: 20px;
  padding: 12px;
  background: transparent;
  border: 1px solid var(--gold);
  color: var(--gold);
  font-family: var(--font-main);
  font-size: 10px;
  letter-spacing: 2.5px;
  text-transform: uppercase;
  cursor: pointer;
  transition: all .25s;
}
.fam-modal-cta:hover { background: rgba(232,192,96,0.1); }

/* ══ AUTH — Checkout login/register/choice ══ */
.auth-choice-grid {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 12px;
  margin: 20px 0;
}
@media(max-width:600px){ .auth-choice-grid { grid-template-columns: 1fr; } }

.auth-choice-btn {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  padding: 20px 12px;
  background: rgba(255,255,255,0.03);
  border: 1px solid var(--border);
  color: var(--cream);
  cursor: pointer;
  transition: all .25s;
  font-family: var(--font-main);
  border-radius: 2px;
}
.auth-choice-btn:hover {
  background: rgba(232,192,96,0.07);
  border-color: rgba(232,192,96,0.4);
}
.auth-choice-btn.auth-choice-primary {
  border-color: var(--gold);
  background: rgba(232,192,96,0.05);
}
.auth-choice-ico { font-size: 28px; }
.auth-choice-btn strong { font-size: 12px; letter-spacing: 1.5px; text-transform: uppercase; color: var(--gold); }
.auth-choice-btn small  { font-size: 10px; color: var(--cream-dim); text-align: center; line-height: 1.4; }

.link-btn {
  background: none; border: none; color: var(--gold);
  cursor: pointer; font-size: inherit; font-family: inherit;
  text-decoration: underline; padding: 0;
}
.link-btn:hover { opacity: .75; }

/* User badge nella navbar */
.nav-user-badge {
  display: flex; align-items: center; gap: 8px;
  font-size: 11px; letter-spacing: 1.5px; color: var(--gold);
  cursor: pointer; background: none; border: none;
  font-family: var(--font-main); transition: opacity .2s;
}
.nav-user-badge:hover { opacity: .75; }
.nav-user-dot {
  width: 8px; height: 8px; border-radius: 50%;
  background: var(--gold); display: inline-block;
}

/* Account panel */
.account-header { display:flex; align-items:center; gap:16px; padding:16px 0; border-bottom:1px solid var(--border); margin-bottom:16px; }
.account-avatar { width:44px; height:44px; border-radius:50%; background:var(--gold); color:var(--bg); display:flex; align-items:center; justify-content:center; font-size:20px; font-weight:700; flex-shrink:0; }
.account-name { font-size:14px; font-weight:600; color:var(--cream); }
.account-email { font-size:11px; color:var(--cream-dim); margin-top:2px; }
.account-orders { display:flex; flex-direction:column; gap:8px; }
.account-order { display:flex; justify-content:space-between; align-items:center; padding:8px 12px; background:rgba(255,255,255,0.03); border:1px solid var(--border); font-size:11px; }
.account-order-id { color:var(--gold); font-family:monospace; }
.account-order-date { color:var(--cream-dim); }
.account-order-total { color:var(--cream); font-weight:600; }

/* Bottone rimuovi (cestino) nel carrello quando qty=1 */
.qty-del {
  color: #c06060 !important;
  border-color: rgba(192,96,96,0.4) !important;
  font-size: 14px !important;
}
.qty-del:hover {
  background: rgba(192,96,96,0.12) !important;
  border-color: rgba(192,96,96,0.7) !important;
}

/* Etichetta sezione nel form registrazione */
.reg-section-label {
  font-size: 9px;
  letter-spacing: 3px;
  text-transform: uppercase;
  color: var(--gold);
  margin: 18px 0 8px;
  padding-bottom: 6px;
  border-bottom: 1px solid var(--border);
  width: 100%;
}
.auth-err{display:block;color:#c45;font-size:11px;letter-spacing:.5px;margin-top:6px;min-height:16px;}

/* ══ OFFERTA A TEMPO ══════════════════════════════════════════════════ */
.offer-banner {
  background: linear-gradient(90deg, #1a1000 0%, #2a1800 50%, #1a1000 100%);
  border-top: 1px solid var(--gold); border-bottom: 1px solid var(--gold);
  padding: 10px 24px; display: flex; align-items: center;
  justify-content: center; gap: 20px; flex-wrap: wrap;
  position: relative; z-index: 50; display: none;
}
.offer-banner.visible { display: flex; }
.offer-banner-label { font-size: 9px; letter-spacing: 3px; text-transform: uppercase; color: var(--gold); }
.offer-banner-prod { font-size: 14px; color: var(--cream); }
.offer-banner-price { display: flex; align-items: center; gap: 10px; }
.offer-banner-orig { font-size: 12px; color: var(--cream-dim); text-decoration: line-through; }
.offer-banner-sale { font-size: 18px; color: var(--gold); font-weight: bold; }
.offer-banner-countdown { font-family: 'Courier New', monospace; font-size: 13px; color: var(--cream); background: #0d0906; padding: 4px 10px; border: 1px solid var(--border); letter-spacing: 2px; }
.offer-banner-qty { font-size: 10px; letter-spacing: 2px; color: var(--red); text-transform: uppercase; }
.offer-badge { position: absolute; top: 10px; left: 10px; background: var(--red); color: #fff; font-size: 9px; letter-spacing: 2px; text-transform: uppercase; padding: 3px 8px; z-index: 2; pointer-events: none; }
.offer-price-orig { text-decoration: line-through; color: var(--cream-dim); font-size: 12px; }
.offer-price-sale { color: var(--gold); font-size: 20px; font-weight: bold; }

/* ── Conversion Layer animation ── */
@keyframes slideUp {
  from { transform: translateY(16px); opacity: 0; }
  to   { transform: translateY(0);    opacity: 1; }
}


/* ── PROFUMA QUIZ MODAL ────────────────────────────────────── */
#profuma-ov{position:fixed;inset:0;background:rgba(0,0,0,.75);z-index:9100;opacity:0;pointer-events:none;transition:opacity .3s}
#profuma-ov.open{opacity:1;pointer-events:all}
#profuma-modal{position:fixed;bottom:0;left:50%;transform:translateX(-50%) translateY(100%);width:min(540px,100%);background:var(--bg2);border:1px solid var(--border);border-radius:16px 16px 0 0;z-index:9101;padding:32px 28px;transition:transform .4s cubic-bezier(.16,1,.3,1);max-height:90vh;overflow-y:auto}
#profuma-ov.open #profuma-modal{transform:translateX(-50%) translateY(0)}
.pq-title{font-family:'Cormorant Garamond',serif;font-size:22px;color:var(--beige);margin-bottom:6px;font-weight:400}
.pq-sub{font-size:12px;color:var(--cream-dim);letter-spacing:.5px;margin-bottom:24px}
.pq-step{display:none}.pq-step.active{display:block}
.pq-q{font-size:14px;color:var(--cream);margin-bottom:16px;line-height:1.7;letter-spacing:.3px}
.pq-opts{display:flex;flex-direction:column;gap:10px}
.pq-opt{background:var(--bg);border:1px solid var(--border);border-radius:8px;padding:14px 16px;cursor:pointer;font-size:13px;color:var(--cream-dim);text-align:left;transition:border-color .2s,color .2s;display:flex;align-items:center;gap:10px}
.pq-opt:hover,.pq-opt.sel{border-color:var(--gold);color:var(--beige)}
.pq-opt.sel{background:rgba(196,154,74,.08)}
.pq-nav{display:flex;justify-content:space-between;margin-top:20px;gap:10px}
.pq-progress{height:2px;background:var(--border);border-radius:2px;margin-bottom:24px}
.pq-progress-fill{height:100%;background:var(--gold);border-radius:2px;transition:width .4s}
.pq-result{text-align:center;padding:10px 0}
.pq-result-name{font-family:'Cormorant Garamond',serif;font-size:28px;color:var(--gold);margin:12px 0 6px}
.pq-result-notes{font-size:12px;color:var(--cream-dim);margin-bottom:20px;letter-spacing:.5px}
.pq-x{position:absolute;top:16px;right:18px;background:none;border:none;color:var(--cream-dim);font-size:20px;cursor:pointer;padding:4px}

/* ── LEAD MAGNET MODAL ─────────────────────────────────────────── */
#lead-ov{position:fixed;inset:0;background:rgba(0,0,0,.8);z-index:9200;opacity:0;pointer-events:none;transition:opacity .35s;display:flex;align-items:center;justify-content:center}
#lead-ov.open{opacity:1;pointer-events:all}
#lead-modal{background:var(--bg2);border:1px solid var(--gold,#c8a96e);border-radius:14px;padding:36px 32px;max-width:420px;width:90%;text-align:center;position:relative}
#lead-modal h3{font-family:'Cormorant Garamond',serif;font-size:24px;color:var(--gold,#c8a96e);font-weight:400;margin-bottom:8px}
#lead-modal p{font-size:13px;color:var(--cream-dim);line-height:1.8;margin-bottom:20px}
#lead-modal ul{text-align:left;margin:0 0 20px 16px;font-size:12px;color:var(--cream-dim);line-height:2}
.lead-email-row{display:flex;gap:8px;margin-bottom:8px}
.lead-email-row input{flex:1;padding:11px 14px;background:var(--bg);border:1px solid var(--border);border-radius:6px;color:var(--cream);font-size:13px;outline:none}
.lead-email-row button{background:var(--gold,#c8a96e);border:none;border-radius:6px;color:#0d0804;padding:11px 18px;cursor:pointer;font-size:12px;white-space:nowrap;font-weight:500}
.lead-skip{font-size:10px;color:var(--cream-dim);cursor:pointer;opacity:.6;margin-top:8px;display:block;letter-spacing:.5px}
.lead-skip:hover{opacity:1}
.lead-x{position:absolute;top:12px;right:14px;background:none;border:none;color:var(--cream-dim);cursor:pointer;font-size:18px}

/* ── BADGE FAMIGLIA OLFATTIVA SULLE CARD ──────────────────────── */
.pc-family-badge{display:inline-block;padding:3px 8px;border-radius:20px;font-size:9px;
  letter-spacing:1.5px;text-transform:uppercase;margin-bottom:8px;font-weight:500}
.pc-family-badge.gourmand{background:rgba(188,124,50,.18);color:#c87d32;border:1px solid rgba(200,125,50,.3)}
.pc-family-badge.aquatic{background:rgba(59,130,180,.15);color:#5b9ec9;border:1px solid rgba(59,130,180,.25)}
.pc-family-badge.woody{background:rgba(100,75,40,.2);color:#8b6941;border:1px solid rgba(120,85,40,.3)}
.pc-family-badge.oriental{background:rgba(150,90,150,.15);color:#a066a0;border:1px solid rgba(150,90,150,.25)}
.pc-family-badge.floral{background:rgba(200,100,130,.15);color:#c0647d;border:1px solid rgba(200,100,130,.25)}
.pc-family-badge.fresh{background:rgba(60,150,130,.15);color:#3d9e8c;border:1px solid rgba(60,150,130,.25)}

/* ── BUNDLE / KIT SECTION ─────────────────────────────────────── */
.bundles-section{padding:60px 24px;background:var(--bg2);border-top:1px solid var(--border)}
.bundles-title{text-align:center;font-family:'Cormorant Garamond',serif;font-size:clamp(22px,3vw,32px);
  color:var(--beige);font-weight:400;margin-bottom:8px}
.bundles-sub{text-align:center;font-size:12px;color:var(--cream-dim);letter-spacing:1px;margin-bottom:40px}
.bundles-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:20px;max-width:900px;margin:0 auto}
.bundle-card{background:var(--bg);border:1px solid var(--border);border-radius:12px;padding:24px;
  display:flex;flex-direction:column;gap:12px;transition:border-color .25s}
.bundle-card:hover{border-color:var(--gold)}
.bundle-name{font-family:'Cormorant Garamond',serif;font-size:20px;color:var(--beige);font-weight:400}
.bundle-tagline{font-size:12px;color:var(--cream-dim);letter-spacing:.5px;line-height:1.7}
.bundle-price-row{display:flex;align-items:baseline;gap:10px;margin-top:4px}
.bundle-price{font-size:22px;color:var(--gold)}
.bundle-orig{font-size:14px;color:var(--cream-dim);text-decoration:line-through}
.bundle-save{font-size:11px;background:rgba(66,96,64,.25);color:#86efac;padding:3px 8px;border-radius:20px;border:1px solid rgba(66,96,64,.4)}
.bundle-desc{font-size:12px;color:var(--cream-dim);line-height:1.8}
.bundle-cta{margin-top:auto;background:none;border:1px solid var(--gold);color:var(--gold);
  padding:10px 20px;border-radius:6px;cursor:pointer;font-size:11px;letter-spacing:2px;
  text-transform:uppercase;transition:background .2s,color .2s}
.bundle-cta:hover{background:var(--gold);color:var(--bg)}

/* ── BANNER SPEDIZIONE GRATUITA ───────────────────────────────── */
.shipping-strip{background:linear-gradient(90deg,rgba(196,154,74,.12),rgba(196,154,74,.08));
  border-top:1px solid rgba(196,154,74,.2);border-bottom:1px solid rgba(196,154,74,.2);
  padding:9px 24px;text-align:center;font-size:11px;color:var(--cream-dim);
  letter-spacing:1.5px;text-transform:uppercase}
.shipping-strip strong{color:var(--gold)}

/* ── INTENSITÀ PRODOTTO ──────────────────────────────────────────── */
.pd-intensity{display:flex;align-items:center;gap:6px;margin:4px 0 10px}
.pd-intensity-dots{display:flex;gap:3px}
.pd-int-dot{width:8px;height:8px;border-radius:50%;background:rgba(196,154,74,.2);
  border:1px solid rgba(196,154,74,.3)}
.pd-int-dot.on{background:var(--gold);border-color:var(--gold)}
.pd-intensity-lbl{font-size:10px;color:var(--cream-dim);letter-spacing:1px;text-transform:uppercase}

/* ── BADGE CARD PRODOTTO ─────────────────────────────────────────── */
.pc-top-badge{position:absolute;top:10px;left:10px;z-index:2;
  font-size:9px;letter-spacing:1.5px;text-transform:uppercase;
  padding:3px 8px;border-radius:3px;font-weight:600}
.pc-top-badge.bestseller{background:rgba(196,154,74,.9);color:#0d0804}
.pc-top-badge.nuovo{background:rgba(59,130,246,.85);color:#fff}
.pc-top-badge.limited{background:rgba(220,38,38,.85);color:#fff}

/* ── STICKY MOBILE BAR (scheda prodotto) ───────────────────────── */
#pd-sticky{position:fixed;bottom:0;left:0;right:0;z-index:8800;
  background:var(--bg2);border-top:1px solid var(--border);
  padding:12px 20px;display:none;align-items:center;justify-content:space-between;gap:12px;
  box-shadow:0 -4px 20px rgba(0,0,0,.4)}
#pd-sticky.show{display:flex}
.pd-sticky-name{font-family:'Cormorant Garamond',serif;font-size:16px;color:var(--beige);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:160px}
.pd-sticky-price{font-size:15px;color:var(--gold);flex-shrink:0}
.pd-sticky-btn{background:var(--gold);color:#0d0804;border:none;border-radius:6px;
  padding:10px 20px;font-size:11px;letter-spacing:2px;text-transform:uppercase;
  cursor:pointer;white-space:nowrap;flex-shrink:0}
@media(min-width:768px){#pd-sticky{display:none!important}}

/* PRODUCT DETAIL — EDITORIAL LUXURY REDESIGN v2 */
/* Inspired by high-end niche perfumery: product first, copy second, purchase always visible. */
.pd-wrap {
  grid-template-columns: minmax(0, 1.08fr) minmax(440px, .92fr);
  align-items: start;
  min-height: calc(100vh - var(--nav-h));
  background: #120b09;
}
.pd-gal {
  position: sticky;
  top: var(--nav-h);
  height: calc(100vh - var(--nav-h));
  min-height: 660px;
  padding: 22px 22px 24px;
  background:
    radial-gradient(circle at 50% 42%, rgba(196,154,74,.13), transparent 37%),
    linear-gradient(145deg, #21130f 0%, #130b09 63%, #0b0706 100%);
  border-right: 1px solid rgba(196,154,74,.16);
}
.pd-main {
  min-height: 0;
  height: calc(100% - 88px);
  border: 1px solid rgba(196,154,74,.22);
  background:
    linear-gradient(135deg, rgba(255,255,255,.035), transparent 35%),
    radial-gradient(ellipse at 50% 52%, rgba(196,154,74,.12), transparent 60%);
  box-shadow: inset 0 0 80px rgba(0,0,0,.22);
}
.pd-main-img { padding: 7% 9%; transition: transform .55s ease, opacity .3s; }
.pd-main:hover .pd-main-img { transform: scale(1.025); }
.pd-thumbs {
  padding: 14px 0 0;
  border-top: 0;
  gap: 10px;
  justify-content: center;
}
.pd-thumb { width: 74px; height: 74px; border-color: rgba(196,154,74,.2); background: #1a0f0c; }
.pd-thumb.on, .pd-thumb:hover { border-color: var(--gold); box-shadow: 0 0 0 2px rgba(196,154,74,.13); }
.pd-info {
  max-height: none;
  overflow: visible;
  padding: clamp(42px, 6vw, 86px) clamp(34px, 6vw, 92px) 80px;
  background: #120b09;
}
.pd-back { margin-bottom: 52px; padding: 0; color: rgba(245,235,216,.58); }
.pd-back:hover { color: var(--gold-lt); }
.pd-fam { margin-bottom: 13px; color: var(--gold); letter-spacing: 5px; }
.pd-name {
  max-width: 560px;
  margin-bottom: 13px;
  color: #f5ead8;
  font-size: clamp(48px, 5.5vw, 76px);
  letter-spacing: -.6px;
  line-height: .92;
}
.pd-rating { margin: 0 0 14px !important; padding-bottom: 18px; border-bottom: 1px solid rgba(196,154,74,.16); }
.pd-rating span:last-of-type { color: rgba(245,235,216,.58) !important; }
.pd-intensity { margin: 16px 0 22px; }
.pd-sub { margin-bottom: 24px; color: rgba(245,235,216,.65); letter-spacing: 2.5px; }
.pd-desc {
  max-width: 660px;
  margin-bottom: 28px;
  padding: 0 0 0 20px;
  border-left: 1px solid var(--gold);
  color: rgba(245,235,216,.78);
  font-size: 18px;
  line-height: 1.72;
}
.pd-story {
  max-width: 660px;
  margin: 0 0 32px;
  padding: 25px 26px 24px;
  border: 1px solid rgba(196,154,74,.22);
  border-left: 2px solid var(--gold);
  background: rgba(255,255,255,.035);
}
.pd-story .pyr-lbl { margin-bottom: 12px; font-size: 9px; letter-spacing: 3px; }
.pd-story-text { color: #f0e1cc; font-size: 15px; line-height: 1.85; }
.pd-info > .pyr-lbl { margin-top: 4px; margin-bottom: 13px; }
.pyr {
  max-width: 660px;
  margin-bottom: 34px;
  border: 0;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}
.pyr-row { display: block; min-height: 142px; border: 1px solid rgba(196,154,74,.22); background: rgba(255,255,255,.025); }
.pyr-side { min-height: 52px; padding: 11px 12px 8px; flex-direction: row; justify-content: flex-start; gap: 9px; border-right: 0; border-bottom: 1px solid rgba(196,154,74,.16); background: rgba(196,154,74,.06); }
.pyr-ico { font-size: 15px; }
.pyr-sl { font-size: 7px; letter-spacing: 2.3px; }
.pyr-body { padding: 13px 14px 15px; }
.pyr-tier { font-size: 7px; letter-spacing: 1.5px; }
.pyr-val { color: rgba(245,235,216,.82); font-size: 12px; line-height: 1.65; }
.pd-format {
  margin: 2px 0 20px;
  padding: 10px 14px;
  border-color: rgba(196,154,74,.3);
  background: rgba(196,154,74,.08);
  color: #ead2a2;
}
.pd-price-row {
  max-width: 660px;
  align-items: flex-end;
  margin: 0 0 18px;
  padding-top: 22px;
  border-top: 1px solid rgba(196,154,74,.16);
}
.pd-price { color: #f5ead8; font-size: 52px; }
.pd-avail { padding-bottom: 8px; }
.pd-actions { max-width: 660px; gap: 12px; margin-top: 0; }
.btn-buy { min-height: 54px; font-size: 10px; letter-spacing: 3px; background: var(--gold); }
.btn-buy:hover { background: #ead09a; }
.btn-wish { min-width: 54px; min-height: 54px; }
#pd-cross-sell { max-width: 660px; }

@media (max-width: 1100px) {
  .pd-wrap { grid-template-columns: minmax(0, 1fr) minmax(390px, .9fr); }
  .pd-gal { padding: 16px; }
  .pd-info { padding-left: 36px; padding-right: 36px; }
  .pd-name { font-size: clamp(44px, 6vw, 64px); }
}
@media (max-width: 820px) {
  .pd-wrap { display: block; }
  .pd-gal { position: relative; top: auto; height: auto; min-height: 0; padding: 14px 14px 18px; border-right: 0; border-bottom: 1px solid rgba(196,154,74,.18); }
  .pd-main { height: min(78vw, 620px); min-height: 360px; }
  .pd-main-img { padding: 8% 12%; }
  .pd-info { padding: 38px 22px 96px; }
  .pd-back { margin-bottom: 34px; }
  .pd-name { font-size: clamp(48px, 14vw, 72px); }
  .pd-desc { font-size: 17px; }
  .pyr { grid-template-columns: 1fr; gap: 7px; }
  .pyr-row { min-height: 0; display:grid; grid-template-columns: 92px 1fr; }
  .pyr-side { min-height: 0; border-right: 1px solid rgba(196,154,74,.16); border-bottom: 0; flex-direction: column; justify-content: center; gap: 4px; }
  .pyr-body { padding: 15px 16px; }
}
@media (max-width: 480px) {
  .pd-main { height: 94vw; min-height: 300px; }
  .pd-thumb { width: 60px; height: 60px; }
  .pd-info { padding-left: 18px; padding-right: 18px; }
  .pd-story { padding: 20px 18px; }
  .pd-story-text { font-size: 14px; }
  .pd-price { font-size: 44px; }
}


/* PRODUCT DETAIL — TABLET BALANCE FIX */
@media (max-width: 1050px) {
  .pd-wrap { display: block; }
  .pd-gal { position: relative; top: auto; height: auto; min-height: 0; padding: 16px 18px 20px; border-right: 0; border-bottom: 1px solid rgba(196,154,74,.18); }
  .pd-main { height: min(68vw, 650px); min-height: 440px; }
  .pd-info { padding: 46px 48px 86px; }
  .pd-desc, .pd-story, .pyr, .pd-price-row, .pd-actions, #pd-cross-sell { max-width: none; }
}


/* PRODUCT DETAIL — FLEX WIDTH FIX */
.pd-info { align-items: stretch; }
.pd-info > .pd-back,
.pd-info > .pd-fam,
.pd-info > .pd-name,
.pd-info > .pd-rating,
.pd-info > .pd-intensity,
.pd-info > .pd-sub,
.pd-info > .pd-desc,
.pd-info > .pd-story,
.pd-info > .pyr-lbl,
.pd-info > .pyr,
.pd-info > .pd-format,
.pd-info > .pd-price-row,
.pd-info > .pd-actions,
.pd-info > #pd-cross-sell { width: 100%; box-sizing: border-box; }
.pd-info > .pd-back { width: max-content; }

/* v310 mobile: evita un vuoto artificiale sotto la ruota e mantiene il pannello compatto */
@media (max-width:900px){
  .wheel-interactive-section{margin-top:28px}
  .wheel-layout{gap:16px}
  .wheel-info-panel{min-height:0;padding:20px}
  .wheel-info-placeholder{min-height:150px}
}
/* ═══════════════════════════════════════════════════════════════
   v305 — correzioni di layout, leggibilità e accessibilità
   ═══════════════════════════════════════════════════════════════ */
/* overflow orizzontale su telefono: la griglia non può più allargarsi oltre lo schermo */
@media (max-width:768px){
  .exp-sec{grid-template-columns:minmax(0,1fr)}
  .exp-txt,.exp-img{min-width:0}
  .btn-gold,.btn-ghost{white-space:normal;text-align:center;line-height:1.6;max-width:100%}
  .sticky-bar{padding:10px 16px;gap:10px}
  .sticky-bar>div:first-child{min-width:0;flex:1}
  .sticky-bar-sub{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .sticky-bar-btn{white-space:nowrap;flex-shrink:0;padding-left:14px;padding-right:14px}
}
/* selettore lingua su una riga */
.lang-btn{white-space:nowrap}
/* dimensioni minime leggibili (WCAG / Lighthouse: testi < 12px penalizzati) */
.btn-gold,.btn-ghost,.sticky-bar-btn{font-size:10.5px;letter-spacing:3px}
.lang-btn,.lang-opt{font-size:11px}
.cart-cnt,.wish-cnt{font-size:10px;min-width:16px;height:16px;line-height:16px}
.sticky-bar-sub,.eyebrow{font-size:10px}
/* area di tocco minima 44px sui comandi principali */
.ham,.cart-btn,.wish-btn,.lang-btn,.cart-x,.wish-x,.co-x{min-width:44px;min-height:44px}
/* movimento ridotto: chi lo chiede vede subito tutto, senza animazioni */
@media (prefers-reduced-motion:reduce){
  .reveal{opacity:1;transform:none;transition:none}
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
}
/* senza JavaScript il contenuto resta visibile */
html.no-js .reveal{opacity:1;transform:none}
/* la barra fissa non usa più il blur (costoso su telefoni economici, invisibile su fondo opaco al 97%) */
.nav{backdrop-filter:none;-webkit-backdrop-filter:none}
/* tastiera: focus visibile in oro */
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--gold);outline-offset:3px}
/* barra di navigazione: l'hamburger era tagliato a destra su schermi da 390px */
@media (max-width:480px){
  .nav{padding:0 14px}
  .nav-r{gap:6px}
  .lang-btn{padding:8px 8px;min-width:0;letter-spacing:1px}
  .logo{font-size:20px;letter-spacing:6px}
}


/* v311 UX polish: mobile whitespace, concise product copy, INCI disclosure */
.pc-tagline { margin: 6px 0 0; color: var(--cream-dim); font-size: 12px; line-height: 1.45; }
.pd-inci { margin: 22px 0 8px; border-top: 1px solid rgba(196,154,74,.22); border-bottom: 1px solid rgba(196,154,74,.22); padding: 14px 0; }
.pd-inci summary { cursor: pointer; color: var(--gold-lt); letter-spacing: 3px; text-transform: uppercase; font-size: 11px; }
.pd-inci p { margin: 16px 0 0; color: var(--cream-dim); line-height: 1.9; font-size: 13px; }
@media (max-width: 600px) {
  .home-coll { padding-top: 28px; padding-bottom: 34px; }
  .home-coll-hd { margin-bottom: 24px; }
  .page-hd { padding-top: 24px; padding-bottom: 16px; }
  .fam-section { padding-bottom: 26px; }
  .wheel-interactive-section { margin-top: 14px !important; }
  .pd-info { padding-bottom: 28px !important; }
  .pd-story { margin-bottom: 18px !important; }
}


/* v312 editorial interaction: multi-product cross-sell carousel */
.cross-sell { margin-top:24px; }
.cross-sell-head { display:flex; align-items:center; justify-content:space-between; margin-bottom:10px; }
.cross-sell-head p { margin:0; font-size:10px; color:var(--cream-dim); letter-spacing:2px; text-transform:uppercase; }
.cross-sell-controls { display:flex; gap:6px; }
.cross-sell-controls button { width:32px; height:32px; border:1px solid var(--border); color:var(--gold); background:transparent; cursor:pointer; font-size:22px; line-height:1; }
.cross-sell-track { display:flex; gap:12px; overflow-x:auto; padding:2px 2px 12px; scroll-snap-type:x mandatory; scrollbar-width:thin; }
.cross-sell-card { flex:0 0 min(310px,82vw); min-height:112px; display:flex; gap:12px; align-items:center; padding:10px; border:1px solid var(--border); border-radius:8px; cursor:pointer; scroll-snap-align:start; transition:border-color .25s, transform .25s, background .25s; }
.cross-sell-card:hover,.cross-sell-card:focus-visible { border-color:var(--gold); background:rgba(196,154,74,.06); transform:translateY(-2px); outline:none; }
.cross-sell-card img,.cross-sell-ph { width:76px; height:92px; flex:0 0 76px; object-fit:cover; border-radius:6px; background:var(--bg2); display:grid; place-items:center; color:var(--gold); }
.cross-sell-copy { min-width:0; }
.cross-sell-copy h3 { margin:0 0 5px; color:var(--beige); font:500 19px 'Cormorant Garamond',serif; }
.cross-sell-copy p { margin:0 0 6px; color:var(--cream-dim); font-size:10px; line-height:1.45; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }
.cross-sell-copy strong { color:var(--gold); font-size:13px; font-weight:400; }
.article-tech-panel { margin:38px 0 10px; padding:24px; border:1px solid rgba(196,154,74,.3); border-left:3px solid var(--gold); background:rgba(196,154,74,.045); }
.article-tech-panel h2 { margin:8px 0 12px; color:var(--beige); font:500 clamp(24px,3vw,34px) 'Cormorant Garamond',serif; }
.article-tech-panel p:not(.eyebrow) { color:var(--cream-dim); line-height:1.8; }
.article-tech-tags { display:flex; flex-wrap:wrap; gap:7px; margin-top:16px; }
.article-tech-tags span { border:1px solid rgba(196,154,74,.3); color:var(--gold-lt); padding:5px 8px; font-size:9px; letter-spacing:1px; text-transform:uppercase; }
@media (prefers-reduced-motion:reduce) { .cross-sell-card { transition:none; } }


/* v339 — home leggera: collezione completa in nastro orizzontale */
.cards-grid {
  display:flex;
  gap:18px;
  overflow-x:auto;
  overscroll-behavior-x:contain;
  scroll-snap-type:x proximity;
  padding:2px 2px 18px;
  scrollbar-width:thin;
}
.cards-grid .pc {
  flex:0 0 clamp(168px,22vw,238px);
  scroll-snap-align:start;
}
.cards-grid .pc-img { aspect-ratio:3/4; }
.cards-grid .pc-img img { object-fit:contain; padding:8px; }
.cards-grid .pc-name { font-size:19px; }
.cards-grid .pc-notes { font-size:10px; }
.prod-grid .pc-img img { object-fit:contain; padding:8px; }
.cross-sell-card img { object-fit:contain; padding:5px; }
@media(max-width:900px){
  .hero-video-wrap video { display:block; opacity:.54; }
  .hero-video-wrap.video-ready video { opacity:.62; }
  .cards-grid .pc { flex-basis:168px; }
}
@media(max-width:600px){
  .cards-grid { gap:12px; padding-left:0; padding-right:18px; }
}
/* v365: il video del flacone occupa il riquadro destro solo quando è pronto. */
/* v415: il riquadro ha una misura propria (min 300x460, max 580 di altezza) anche senza foto,
   così il video non collassa a zero quando l'immagine manca o non si carica. */
.hero-bottle{position:relative;overflow:hidden;min-width:300px;min-height:460px;max-height:580px;display:flex;align-items:center;justify-content:center}
.hero-bottle-video{min-height:460px}
.hero-bottle-video{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;opacity:0;transition:opacity .35s ease;z-index:2;background:transparent}
.hero-bottle-video.video-ready{opacity:1}
.hero-bottle-image{position:relative;z-index:1;transition:opacity .35s ease}
.hero-bottle-video.video-ready + .hero-bottle-image{opacity:0}

/* v446: blocco "In breve" degli articoli del Journal (anche dentro la SPA) */
.article-body .in-breve { margin:0 0 34px; padding:18px 22px; border:1px solid rgba(212,170,90,.28); border-left:3px solid var(--gold); background:rgba(212,170,90,.05); font-family:'Jost',sans-serif; font-size:14px; line-height:1.65; }
.article-body .in-breve h2 { margin:0 0 10px; font-family:'Jost',sans-serif; font-size:9px; letter-spacing:3px; text-transform:uppercase; color:var(--gold); }
.article-body .in-breve ul { margin:0; padding-left:18px; }
.article-body .in-breve li { margin:5px 0; }