/*
==================================================
🌟 Preview Fascione
Descrizione: replica mock stile PF (hero | center | side)
Data: 23/09/2025
==================================================
*/
.pf-fascione{
  width:100%; max-width:1200px; margin:0 auto;
  display:grid; grid-template-columns:235px minmax(0,1fr) 235px; gap:24px; align-items:start;
  border:2px solid #facc15; border-radius:18px; padding:14px; background:#fff;
}

/* Colonna sinistra (hero) */
.pf-hero{ position:relative; border-radius:14px; overflow:hidden; }
.pf-hero img{ width:235px; height:340px; object-fit:cover; display:block; border-radius:12px; background:#eee; }
.pf-badge{ position:absolute; top:12px; left:12px; background:#ffe16a; color:#111; font-weight:700; font-size:.82rem; padding:7px 14px; border-radius:999px; }

/* Colonna centrale */
.pf-center{ min-width:0; padding-right:16px; }
.pf-title{ margin:0 0 4px; font-size:clamp(1.5rem,1.8vw,2.2rem); font-weight:600; line-height:1.15; }

/* Pillole + corona sopra primaria */
.pf-chips{ display:flex; flex-wrap:wrap; gap:10px; margin:10px 0 10px; position:relative; }
.pf-chip{ display:inline-flex; align-items:center; padding:8px 14px; background:#f3f4f6; color:#111; border-radius:999px; font-weight:600; font-size:.9rem; }
.pf-shop{ background:#111; color:#fff; white-space:nowrap; }
.pf-more{ background:#e5e7eb; }
.pf-chipwrap{ position:relative; display:inline-block; line-height:1; }
.pf-crown{ position:absolute; top:-1.3em; left:50%; transform:translateX(-50%); }

/* Teaser + intro */
.pf-teaser{ color:#666; font-style:italic; margin:.3rem 0 .8rem; }
.pf-intro{ font-size:1.05rem; line-height:1.55; color:#111; margin-bottom:14px; }
.pf-link{ color:#0a66c2; text-decoration:underline; margin-left:6px; }

/* Marchi — 6 slot fissi */
.pf-brands{
  display:grid; grid-template-columns:repeat(6,116px); gap:6px;
  align-items:center; justify-content:start; padding-right:16px; margin:0;
}
.pf-brand{
  width:116px; height:78px;
  margin:0; padding:0; border:0; background:transparent; box-shadow:none;
  display:flex; align-items:center; justify-content:center;
}
.pf-brand img{ max-height:64px; max-width:104px; width:auto; height:auto; object-fit:contain; display:block; }
.pf-brand.pf-more-tile{
  border:0; background:#f3f4f6; color:#333; font-weight:700;
  width:116px; height:78px; border-radius:10px;
  display:flex; align-items:center; justify-content:center; line-height:1;
}

/* Colonna destra (side-card 235x340) */
.pf-side{ width:235px; }
.pf-sidecard{ position:relative; border:1px solid #e6e6e6; border-radius:16px; overflow:hidden; background:#fff; }
.pf-sidecard img{ width:235px; height:340px; object-fit:cover; display:block; border-radius:12px; }
.pf-sidepill{
  position:absolute; left:12px; right:12px; bottom:16px; background:rgba(255,255,255,.98); color:#111;
  font-weight:800; font-size:1.05rem; line-height:1.25; text-align:center; padding:10px 12px; border-radius:12px; box-shadow:0 2px 8px rgba(0,0,0,.08);
}
/* ===== Fascione Preview — allineamento pubblico (240×340) ===== */
.adv-preview--fascione{ --pf-col-w:240px; --pf-img-h:340px; }

.adv-preview--fascione .pf-fascione{
  grid-template-columns: var(--pf-col-w) minmax(0,1fr) var(--pf-col-w);
  gap:22px; padding:16px; border-width:2px;
  box-shadow:0 0 0 2px rgba(250,204,21,.18);
}

.adv-preview--fascione .pf-hero img,
.adv-preview--fascione .pf-sidecard img{
  width: var(--pf-col-w);
  height: var(--pf-img-h);
  object-fit: cover;
  border-radius: 12px;
}

/* Titoli / testo */
.adv-preview--fascione .pf-title{
  font-weight:700; font-size:clamp(1.6rem,1.9vw,2.4rem); margin:0 0 6px;
}
.adv-preview--fascione .pf-teaser{ margin:.3rem 0 .6rem; color:#666; font-style:italic; }
.adv-preview--fascione .pf-intro{ margin:8px 0 16px; font-size:1.05rem; line-height:1.55; color:#111; }

/* Pillole */
.adv-preview--fascione .pf-chips{ gap:10px; margin:8px 0 10px; }
.adv-preview--fascione .pf-chip{ padding:8px 14px; font-weight:600; font-size:.95rem; }
.adv-preview--fascione .pf-chipwrap .pf-crown{ top:-1.35em; }

/* Side pill */
.adv-preview--fascione .pf-sidepill{
  position:absolute; left:12px; right:12px; bottom:16px;
  background:rgba(255,255,255,.98); color:#111; font-weight:800;
  font-size:1.05rem; line-height:1.25; text-align:center;
  padding:10px 12px; border-radius:12px; box-shadow:0 2px 8px rgba(0,0,0,.08);
}

/* ===== Fascione Preview — marchi 90×90 senza cornice ===== */
.adv-preview--fascione .pf-brands{
  display:grid;
  grid-template-columns:repeat(6,90px);
  gap:10px;
  padding-right:8px;
  margin-top:8px;
}

.adv-preview--fascione .pf-brand{
  width:90px;
  height:90px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:transparent;     /* niente cornice, niente sfondo */
  border:none;                /* ← rimuove la cornice */
  border-radius:10px;         /* solo per armonia col tile +N */
  text-align:center;
}

.adv-preview--fascione .pf-brand img{
  max-width:80px;
  max-height:60px;
  object-fit:contain;
}

.adv-preview--fascione .pf-brand .name{
  font-size:.8rem;
  line-height:1.1;
  color:#444;
  padding:0 6px;
}

/* Tile +N mantiene la tessera grigio chiaro */
.adv-preview--fascione .pf-brand.pf-more-tile{
  background:#f3f4f6;
  color:#333;
  font-weight:700;
}

/* === Fascione Preview – rifiniture finali === */

/* 1) Marchi: 90x90, gap 10, senza bordo */
.adv-preview--fascione .pf-brands{
  display:grid !important;
  grid-template-columns:repeat(6, 90px) !important;
  gap:10px !important;
  padding-right:8px !important;
  margin-top:8px !important;
}
.adv-preview--fascione .pf-brand{
  width:90px !important;
  height:90px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  background:transparent !important;
  border:none !important;
  border-radius:10px !important;
  text-align:center !important;
}
.adv-preview--fascione .pf-brand img{
  max-width:80px !important;
  max-height:60px !important;
  object-fit:contain !important;
}
.adv-preview--fascione .pf-brand .name{
  font-size:.8rem !important;
  line-height:1.1 !important;
  color:#444 !important;
  padding:0 6px !important;
}
/* Tile +N resta “tessera” grigio chiaro */
.adv-preview--fascione .pf-brand.pf-more-tile{
  background:#f3f4f6 !important;
  color:#333 !important;
  font-weight:700 !important;
}

/* 2) Pill: più leggere e un filo più compatte (per farne entrare di più) */
.adv-preview--fascione .pf-chip{
  font-weight:500 !important;        /* prima 600 */
  padding:7px 12px !important;       /* prima 8/14 */
  font-size:.92rem !important;       /* - leggerissima */
}
.adv-preview--fascione .pf-chips{
  gap:7px !important;                /* prima 10px → -3px per allineare la riga */
}

/* 3) Coroncina: leggermente più bassa per non toccare il titolo */
.adv-preview--fascione .pf-chipwrap .pf-crown{
  top:-1.1em !important;             /* prima ~ -1.35em */
}
/* === Fascione Preview — Rifinitura finale === */

/* Marchi belli grandi e compatti */
.adv-preview--fascione .pf-brands{
  display:grid !important;
  grid-template-columns:repeat(6, 90px) !important;
  gap:10px !important;                 /* gap reale 10px */
  margin-top:20px !important;          /* più stacco dal testo */
  justify-content:start !important;
}

.adv-preview--fascione .pf-brand{
  width:90px !important;
  height:90px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  background:transparent !important;
  border:none !important;
}

.adv-preview--fascione .pf-brand img{
  max-width:90px !important;
  max-height:90px !important;
  object-fit:contain !important;
}

/* Tile +N coerente */
.adv-preview--fascione .pf-brand.pf-more-tile{
  background:#f3f4f6 !important;
  font-weight:700 !important;
  font-size:.9rem !important;
  border-radius:10px !important;
}

/* Pillole più leggere e abbassate */
.adv-preview--fascione .pf-chips{
  margin-top:20px !important;          /* stacco dal titolo */
  gap:8px !important;                  /* pillole più compatte */
}
.adv-preview--fascione .pf-chip{
  font-weight:500 !important;
  font-size:.92rem !important;
  padding:7px 12px !important;
}
.adv-preview--fascione .pf-chipwrap .pf-crown{
  top:-1em !important;                 /* abbassata la corona */
}
/* ===== Fascione Preview — correzioni pill + corona ===== */

/* Tutte le pill devono avere stessa altezza */
.adv-preview--fascione .pf-chip {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 32px;            /* uniforma altezza */
  padding: 6px 14px;           /* più compatto rispetto a prima */
  font-size: 0.88rem;          /* leggermente ridotto */
  font-weight: 500;            /* meno pesante */
  border-radius: 999px;
  background: #f3f4f6;
  color: #111;
  line-height: 1.2;
}

/* La pill shop resta più marcata */
.adv-preview--fascione .pf-chip.pf-shop {
  background: #111;
  color: #fff;
  font-weight: 600;
}

/* Corona più bassa e centrata */
.adv-preview--fascione .pf-chipwrap {
  position: relative;
  display: inline-block;
}
.adv-preview--fascione .pf-chipwrap .pf-crown {
  position: absolute;
  top: -1.1em;    /* abbassa rispetto al titolo */
  left: 50%;
  transform: translateX(-50%);
}