/* negozio.css — il foglio della scheda negozio, 06/09/2026.
   Prima queste 852 righe stavano in uno <style> DENTRO il corpo di negozio.php,
   dopo 530 righe di HTML: il browser disegnava testata, hero e coupon col solo
   style.css, poi arrivava questo blocco e rifaceva tutto il layout. E' il salto
   che si vedeva per qualche secondo aprendo una scheda. Adesso lo carica
   header.php nell'head, dopo style.css e footer.css, nello stesso ordine di
   cascata di prima. Si cambia il ?v= in negozio.php quando si tocca. */
.merchant-description-text {
    line-height: 1.7;
    margin-bottom: 1.5rem;
    font-size: 0.95rem;
    color: var(--text-light);
}

.merchant-description-text p {
    margin-bottom: 1.2rem;
    font-size: 0.95rem;
    color: var(--text-light);
    display: block;
}

.merchant-description-text strong {
    font-weight: 700;
    color: var(--text-main);
}

/* Modal Segui */
.modal-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.5);
    display: none;
    align-items: center;
    justify-content: center;
    z-index: 9999;
}

.modal-content {
    background: white;
    width: 90%;
    max-width: 450px;
    padding: 2.5rem;
    border-radius: 24px;
    position: relative;
    box-shadow: 0 20px 40px rgba(0,0,0,0.2);
    text-align: center;
}

.modal-close {
    position: absolute;
    top: 15px;
    right: 15px;
    background: none;
    border: none;
    font-size: 1.5rem;
    cursor: pointer;
    color: var(--text-light);
}

.merchant-logo-mini {
    width: 70px;
    height: 70px;
    background: white;
    border: 1px solid var(--border-color);
    border-radius: 16px;
    padding: 10px;
    margin: 0 auto 1.5rem;
    display: flex;
    align-items: center;
    justify-content: center;
}

.merchant-logo-mini img {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
}

.modal-header h3 {
    font-size: 1.3rem;
    font-weight: 800;
    margin-bottom: 1rem;
    color: var(--text-main);
}

.modal-body p {
    font-size: 0.95rem;
    color: var(--text-light);
    margin-bottom: 1.5rem;
    line-height: 1.6;
}

#subscriberEmail {
    width: 100%;
    padding: 12px 20px;
    border: 1px solid var(--border-color);
    border-radius: 12px;
    font-size: 1rem;
    margin-bottom: 1rem;
    outline: none;
}

#subscriberEmail:focus {
    border-color: #8A2BE2;
}

.btn-submit-follow {
    width: 100%;
    padding: 14px;
    background: #8A2BE2;
    color: white;
    border: none;
    border-radius: 12px;
    font-weight: 700;
    cursor: pointer;
    transition: 0.2s;
}

.btn-submit-follow:hover {
    background: var(--primary-hover);
}

.modal-footer-text {
    font-size: 0.75rem !important;
    margin-top: 1rem;
}

/* Merchant Hero & Header */
.merchant-hero {
    background: white;
    padding: 3rem 0;
    border-bottom: 1px solid var(--border-color);
    margin-bottom: 2rem;
}

.merchant-profile-header {
    display: flex;
    gap: 2.5rem;
    align-items: center;
}

.merchant-logo-large {
    width: 150px;
    height: 150px;
    background: white;
    border-radius: 24px;
    padding: 15px;
    border: 1px solid var(--border-color);
    box-shadow: var(--shadow-soft);
    display: flex;
    align-items: center;
    justify-content: center;
}

.merchant-logo-large img {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
}

.merchant-info-main {
    flex: 1;
    min-width: 0;
}

.merchant-info-main h1 {
    font-size: 2.2rem;
    font-weight: 800;
    margin: 0.5rem 0;
    word-wrap: break-word;
    overflow-wrap: break-word;
}

.merchant-stats {
    color: var(--text-light);
    margin-bottom: 1.5rem;
}

.badge-row {
    display: flex;
    gap: 10px;
    align-items: center;
}

.verified-check {
    color: #0E7A55;
    font-weight: 600;
    font-size: 0.85rem;
}

/* Social Actions */
.social-actions {
    display: flex;
    gap: 12px;
}

.btn-follow {
    background: #8A2BE2;
    color: white;
    border: none;
    padding: 10px 24px;
    border-radius: 100px;
    font-weight: 700;
    cursor: pointer;
    transition: all 0.2s;
}

.btn-follow:hover {
    background: var(--primary-hover);
    transform: scale(1.05);
}

.btn-follow.active {
    background: #F2F0EC;
    color: var(--text-main);
    border: 1px solid var(--border-color);
}

.btn-share-alt {
    background: #F2F0EC;
    color: var(--text-main);
    border: 1px solid var(--border-color);
    padding: 10px 20px;
    border-radius: 100px;
    font-weight: 600;
    cursor: pointer;
}

/* Store Layout */
.store-layout {
    display: grid;
    grid-template-columns: 1fr 320px;
    gap: 2.5rem;
    margin-bottom: 4rem;
}

.section-title {
    margin-bottom: 1.5rem;
    font-size: 1.4rem;
}

/* Horizontal Coupon Card */
.coupon-card-horizontal {
    background: white;
    border-radius: 20px;
    padding: 1.5rem;
    margin-bottom: 1rem;
    display: flex;
    gap: 1.5rem;
    align-items: center;
    border: 1px solid var(--border-color);
    transition: var(--transition);
}

.coupon-card-horizontal:hover {
    box-shadow: var(--shadow-hover);
    border-color: #8A2BE2;
}

.coupon-type {
    display: flex;
    flex-direction: column;
    align-items: center;
    min-width: 80px;
    padding-right: 1.5rem;
    border-right: 2px dashed var(--border-color);
}

.type-icon {
    width: 45px;
    height: 45px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.2rem;
    margin-bottom: 5px;
}

.type-icon.code { background: #F4E9FD; color: #8A2BE2; }
.type-icon.deal { background: #E4FBF1; color: #0E7A55; }
.type-icon.notify { background: #E4FBF1; color: #8A2BE2; }

.type-text {
    font-size: 0.65rem;
    font-weight: 800;
    letter-spacing: 1px;
    color: var(--text-light);
}

.coupon-details { flex: 1; }
.coupon-details h3 { font-size: 1.1rem; margin-bottom: 5px; }
.coupon-details p { font-size: 0.9rem; color: var(--text-light); margin-bottom: 10px; }

.coupon-meta { display: flex; gap: 15px; font-size: 0.75rem; font-weight: 600; }
.coupon-meta .expiry { color: #95989F; }
.coupon-meta .verified { color: #0E7A55; }

.btn-store-action {
    background: #8A2BE2;
    color: white;
    text-decoration: none;
    padding: 14px 28px;
    border-radius: 50px;
    font-weight: 700;
    font-size: 0.9rem;
    white-space: nowrap;
    border: none;
    box-shadow: 0 4px 15px rgba(0, 97, 255, 0.2);
    transition: all 0.3s ease;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.btn-store-action:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 25px rgba(0, 97, 255, 0.35);
    background: linear-gradient(135deg, #5F00A3, #2BE29B);
    color: white;
}

.btn-store-action:active {
    transform: translateY(0);
}

/* Sidebar */
.sidebar-card {
    background: white;
    border-radius: 20px;
    padding: 1.5rem;
    border: 1px solid var(--border-color);
    margin-bottom: 1.5rem;
}

.sidebar-card h3 { font-size: 1rem; margin-bottom: 1rem; }
.sidebar-card p { font-size: 0.85rem; color: var(--text-light); line-height: 1.6; }

.sidebar-divider { height: 1px; background: var(--border-color); margin: 1.2rem 0; }

.store-tags { display: flex; flex-wrap: wrap; gap: 8px; }
.tag { font-size: 0.75rem; color: #8A2BE2; background: #F4E9FD; padding: 4px 10px; border-radius: 4px; font-weight: 600; }

.activity-feed ul { list-style: none; }
.activity-feed li { font-size: 0.8rem; padding: 10px 0; border-bottom: 1px solid #F7F6F4; display: flex; gap: 10px; align-items: center; color: var(--text-light); }
.activity-feed li i { color: #8A2BE2; }

@media (max-width: 992px) {
    .store-layout { grid-template-columns: 1fr; }
    .merchant-profile-header { flex-direction: column; text-align: center; }
}

@media (max-width: 600px) {
    .coupon-card-horizontal { flex-direction: column; text-align: center; }
    .coupon-type { border-right: none; border-bottom: 2px dashed var(--border-color); padding: 0 0 1rem 0; margin-bottom: 1rem; width: 100%; }
}
/* Responsive Media Queries */
@media (max-width: 992px) {
    .merchant-profile-header {
        flex-direction: column;
        text-align: center;
        gap: 1.5rem;
    }
    .merchant-logo-large {
        width: 120px;
        height: 120px;
    }
    .merchant-info-main h1 {
        font-size: 1.8rem;
    }
    .social-actions {
        justify-content: center;
    }
    .store-layout {
        grid-template-columns: 1fr;
    }
    .store-sidebar {
        order: 2;
    }
    .store-content {
        order: 1;
    }
}

@media (max-width: 600px) {
    .merchant-hero {
        padding: 2rem 0;
    }
    .merchant-logo-large {
        width: 100px;
        height: 100px;
    }
    .merchant-info-main h1 {
        font-size: 1.5rem;
    }
    .merchant-stats {
        font-size: 0.85rem;
    }
    .social-actions button {
        padding: 8px 15px;
        font-size: 0.85rem;
    }
    .coupon-card-horizontal {
        flex-direction: column;
        align-items: center;
        text-align: center;
        gap: 1rem;
        padding: 1.5rem;
    }
    .coupon-type {
        width: 100%;
        border-right: none;
        border-bottom: 1px dashed var(--border-color);
        padding-bottom: 1rem;
    }
    .coupon-details {
        padding: 0;
    }
    .coupon-action {
        width: 100%;
        border-left: none;
        border-top: 1px dashed var(--border-color);
        padding-top: 1rem;
    }
    .btn-store-action {
        width: 100%;
    }
    .code-box-inline {
        width: 100%;
        justify-content: center;
        flex-direction: column;
        gap: 10px;
    }
    .btn-copy-small {
        width: 100%;
    }
}
.trustpilot-widget-mini {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 1.5rem;
    background: #F7F6F4;
    padding: 10px 15px;
    border-radius: 12px;
    border: 1px solid var(--border-color);
    width: fit-content;
    flex-wrap: wrap;
}

@media (max-width: 600px) {
    .trustpilot-widget-mini {
        gap: 8px;
        justify-content: center;
        width: 100%;
        padding: 12px;
    }
    .tp-reviews {
        font-size: 0.75rem;
        display: block;
        width: 100%;
        text-align: center;
        margin-top: -5px;
        color: var(--text-light);
    }
    .tp-stars {
        font-size: 0.8rem;
    }
}

.trustpilot-widget-mini.pending {
    color: var(--text-light);
    font-size: 0.85rem;
    background: #F2F0EC;
}

.newsletter-box {
    background: #8A2BE2 !important;
    color: white !important;
    padding: 2rem !important;
}

.newsletter-box h3 { color: white !important; margin-bottom: 10px !important; }
.newsletter-box p { font-size: 0.9rem !important; opacity: 0.9; margin-bottom: 1.5rem !important; }

.sidebar-form input {
    width: 100%;
    padding: 12px 15px;
    border-radius: 10px;
    border: none;
    margin-bottom: 10px;
    outline: none;
}

.sidebar-form .btn-submit-follow {
    background: white;
    color: #8A2BE2;
}

.tiny-text {
    font-size: 0.75rem !important;
    margin-top: 15px !important;
    opacity: 0.8;
}

.tp-stars {
    color: #0E7A55;
    font-size: 0.9rem;
    display: flex;
    gap: 2px;
}

.tp-score {
    font-size: 0.95rem;
    color: var(--text-main);
}

.tp-reviews {
    font-size: 0.8rem;
    color: var(--text-light);
}

@media (max-width: 992px) {
    .trustpilot-widget-mini {
        margin: 0 auto 1.5rem;
    }
}

/* ==========================================================================
   IL TAGLIANDO — 04/09/2026
   Su un sito di codici sconto la percentuale e' il prodotto, e qui stava
   dentro il titolo in corpo 15, uguale a tutto il resto: la matrice mostrava
   la stessa forbice su undici righe di fila. Adesso porta il numero.

   I colori sono quelli di weareblog.it, presi uno per uno dal suo style.css e
   non riavvicinati a occhio: viola #8A2BE2 (scuro #5F00A3) e azzurro #2BE29B.
   Stessa cosa per i caratteri, Sora e Figtree. La decisione e' di Tobia, il
   04/09/2026, dopo che quattro palette inventate qui erano state scartate:
   «fai weareblog versione coupon». Non si cambiano piu' senza dirlo.

   Queste regole stanno in FONDO di proposito: vincono per ordine di cascata,
   senza !important e senza toccare niente di quello che c'e' sopra. Per
   tornare indietro si cancella da qui alla chiusura del blocco.

   E qui NON si scrive il tag di chiusura dello stile, nemmeno dentro un
   commento: il parser HTML chiude il blocco alla prima occorrenza di quella
   stringa, commento o non commento, e tutto il CSS che segue finisce fuori,
   nel corpo della pagina, come testo. Successo il 04/09/2026 al primo
   caricamento: il markup era giusto, le regole c'erano, e non se ne applicava
   nessuna.
   ========================================================================== */
.coupons-list {
    --cw-viola: #8A2BE2;
    --cw-viola-forte: #5F00A3;
    --cw-verde: #2BE29B;
    --cw-verde-velo: #E4FBF1;
    --cw-segno: #06322A;
    --cw-filo: #EAE8E4;
    /* Aggiunti il 05/09/2026. --cw-filo-2 e' il filo delle tessere: quello
       chiaro resta per i separatori DENTRO una tessera. --cw-alza e' l'ombra
       di weareblog, due strati: un pelo di contatto piu' una campana larga e
       bassa, che e' cio' che fa leggere una card come un oggetto staccato. */
    --cw-filo-2: #DEDBD5;
    --cw-alza: 0 1px 2px rgba(21,22,26,.04), 0 10px 28px -12px rgba(21,22,26,.14);
    --cw-velo: #F4E9FD;
}

/* LA RIGA FITTA — scelta il 04/09/2026 per la scheda negozio, dove un negozio
   ha anche undici offerte quasi identiche in fila. Sulla home sta la card con
   la matrice; qui no: la matrice costava 112px di larghezza e ~130px di altezza
   per riga, e su undici righe voleva dire due schermate di scorrimento per
   leggere quello che ora sta in una. La cifra resta la prima cosa che si legge,
   ma in tipografia viola invece che dentro un blocco colorato. */
.coupons-list { display: flex; flex-direction: column; gap: 12px; }
.coupons-list .coupon-card-horizontal {
    display: grid;
    grid-template-columns: 78px minmax(0, 1fr) auto;
    align-items: center;
    gap: 16px;
    padding: 12px 16px;
    border-radius: 12px;
    border: 1px solid var(--cw-filo-2);
    box-shadow: var(--cw-alza);
    overflow: visible;
}
.coupons-list .coupon-card-horizontal:hover {
    border-color: var(--cw-viola);
    transform: none;
    box-shadow: 0 6px 20px -12px rgba(20,16,40,.35);
}
/* Niente fori e niente cucitura: su una riga alta 56px il tagliando non si
   legge come tale, diventa solo rumore. */
.coupons-list .coupon-card-horizontal::before,
.coupons-list .coupon-card-horizontal::after { display: none; }

.coupons-list .coupon-type {
    width: 78px;
    min-width: 78px;
    flex: none;
    padding: 0;
    margin: 0;
    gap: 1px;
    justify-content: center;
    text-align: center;
    background: none;
    border: 0;
    border-radius: 0;
}
.coupons-list .cw-cifra {
    font-family: "Sora", system-ui, sans-serif;
    font-size: 1.45rem;
    font-weight: 800;
    line-height: 1.05;
    letter-spacing: -.04em;
    color: var(--cw-viola);
    font-variant-numeric: tabular-nums;
}
.coupons-list .cw-cifra--parole {
    font-size: .76rem;
    font-weight: 700;
    line-height: 1.2;
    letter-spacing: -.01em;
    hyphens: none;
    color: var(--cw-verde-scuro);
}
.coupons-list .coupon-type .type-text {
    color: var(--cw-ink-3, #95989F);
    opacity: 1;
    font-size: .55rem;
    letter-spacing: .1em;
}
.coupons-list .cw-matrice--offerta .cw-cifra,
.coupons-list .cw-matrice--offerta .type-text { color: var(--cw-verde-scuro); }

.coupons-list .coupon-details { padding: 0; min-width: 0; }
.coupons-list .coupon-details h3 {
    font-family: "Sora", system-ui, sans-serif;
    font-size: .95rem;
    font-weight: 700;
    line-height: 1.3;
    letter-spacing: -.02em;
    margin: 0 0 2px;
    color: var(--cw-ink);
}
.coupons-list .coupon-details p {
    font-size: .78rem;
    color: var(--cw-ink-3, #95989F);
    margin: 0 0 4px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.coupons-list .code-box-inline { display: none; }
.coupons-list .coupon-meta { gap: 12px; font-size: .72rem; flex-wrap: wrap; }
.coupons-list .coupon-meta .published { display: none; }
.coupons-list .coupon-meta .verified { color: var(--cw-verde-scuro) !important; font-weight: 700; }
.coupons-list .coupon-action  { padding: 0; display: flex; align-items: center; }
/* La scadenza era rossa con lo stile scritto nel markup, quindi serve
   l'!important per scavalcarlo: su undici righe erano undici allarmi, e il
   rosso non vuol dire piu' niente quando c'e' sempre. Chi scade davvero fra
   poche ore lo dice la pastiglia ambra, che il template mette da sola. */
.coupons-list .coupon-meta .expiry { color: var(--cw-ink-3, #95989F) !important; font-weight: 500 !important; }
.coupons-list .coupon-meta .expiry.countdown-red { color: #8A4A00 !important; background: #FFF3DF; padding: 2px 9px; border-radius: 100px; font-weight: 700 !important; }
.coupons-list .btn-store-action {
    background: var(--cw-viola);
    color: #FFFFFF;
    box-shadow: none;
    border-radius: 100px;
    padding: 9px 20px;
    font-size: .8rem;
    font-weight: 800;
    letter-spacing: .02em;
    white-space: nowrap;
}
.coupons-list .btn-store-action:hover {
    background: var(--cw-viola-forte);
    box-shadow: none;
    transform: none;
}

/* Sul telefono la riga diventa due: cifra e titolo sopra, il chip del codice
   sotto a tutta larghezza. Il chip a destra su 360px lascerebbe al titolo una
   colonna di sessanta pixel. */
@media (max-width: 700px) {
    .coupons-list .coupon-card-horizontal { grid-template-columns: 62px minmax(0, 1fr); gap: 12px; }
    .coupons-list .coupon-type { width: 62px; min-width: 62px; }
    .coupons-list .cw-cifra { font-size: 1.25rem; }
    .coupons-list .coupon-action { grid-column: 1 / -1; justify-content: flex-start; }
    .coupons-list .coupon-details p { white-space: normal; }
}

/* ---- La testata della scheda, stessi due colori ----------------------------
   Qui il dato che mancava era il piu' importante: quanto si risparmia. C'erano
   la categoria, il bollino di partner e le stelle di Trustpilot — tutte cose
   che dicono «di chi ti puoi fidare», nessuna che dica «quanto». */
/* ---- La colonna di fianco ----
   Sticky: segue la lettura invece di restare in cima e lasciare mezza pagina
   vuota su una scheda con undici offerte. Due cose la fanno funzionare, e
   senza una delle due sticky non scatta e non lo dice nessuno:
   `align-self: start` sulla griglia (altrimenti la colonna si stira a tutta
   altezza e non le resta spazio in cui scorrere), e il fatto che il foglio usi
   `overflow: clip` e non `hidden` — hidden creerebbe un contenitore di
   scorrimento e la annullerebbe.
   Il `top` e' 84px: 67 di testata, che qui e' sticky anche lei, piu' aria. */
.store-layout { align-items: start; }
.store-sidebar {
    position: sticky;
    top: 84px;
    align-self: start;
}
/* Niente max-height e niente overflow-y: con quelli la colonna si portava
   dietro una propria barra di scorrimento — una riga che saliva e scendeva
   dentro la sidebar — e il risultato non era una colonna incollata ma una
   colonna che scorre dentro se stessa. Le due scatole sono corte: sticky
   nudo basta. */
@media (max-width: 992px) {
    .store-sidebar { position: static; }
}
/* Le scatole della colonna: niente bordo. Il contorno + l'ombra facevano due
   segnali per dire la stessa cosa, ed e' quello che invecchia una pagina piu' di
   ogni altra cosa. Restano il bianco su fondo caldo e un'ombra a due livelli —
   una corta che stacca, una lunga e larghissima che da' profondita'. */
.store-sidebar .sidebar-card {
    border: 0;
    border-radius: 18px;
    box-shadow: 0 1px 2px rgba(20,16,40,.04), 0 12px 32px -16px rgba(20,16,40,.22);
    padding: 20px;
}
.cw-numeri dl div { border-bottom: 1px solid var(--cw-filo); }
.store-sidebar .sidebar-card h3 {
    font-family: "Sora", system-ui, sans-serif;
    font-size: 1rem;
    letter-spacing: -.02em;
    color: var(--cw-ink);
}
.cw-numeri dl { display: flex; flex-direction: column; margin: 0 0 16px; font-size: .88rem; }
.cw-numeri dl div {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    padding: 9px 0;
    border-bottom: 1px solid var(--cw-filo);
}
.cw-numeri dl div:last-child { border-bottom: 0; }
.cw-numeri dt { color: var(--cw-ink-3, #95989F); }
.cw-numeri dd {
    margin: 0;
    font-weight: 700;
    color: var(--cw-ink);
    text-align: right;
    font-variant-numeric: tabular-nums;
}
.cw-vai-negozio {
    display: block;
    text-align: center;
    background: var(--cw-viola);
    color: #FFFFFF;
    text-decoration: none;
    font-weight: 800;
    font-size: .88rem;
    padding: 12px 18px;
    border-radius: 100px;
}
.cw-vai-negozio:hover { background: var(--cw-viola-forte); color: #fff; }
.store-sidebar .store-tags .tag {
    background: var(--cw-velo);
    color: var(--cw-viola);
    border: 0;
    border-radius: 100px;
    font-weight: 700;
    font-size: .74rem;
}

/* La testata della scheda, seconda passata (04/09/2026). Prima si prendeva
   circa 300px per dire il nome del negozio: logo da 150px dentro un riquadro,
   H1, una riga di numeri (di cui uno inventato), le stelle in un box grigio e
   due bottoni. Adesso sta in 200, il logo e' 88 e la riga sotto il titolo porta
   solo fatti verificabili. */
.merchant-hero {
    padding: 1.9rem 0 1.7rem;
    margin-bottom: 1.4rem;
    background: radial-gradient(70% 130% at 18% -40%, var(--cw-velo) 0%, rgba(244,233,253,0) 60%), #fff;
}
.merchant-profile-header { gap: 1.6rem; align-items: center; }
.merchant-logo-large {
    width: 88px;
    height: 88px;
    padding: 10px;
    border-radius: 16px;
    border-color: var(--cw-filo);
    box-shadow: 0 1px 3px rgba(20,16,40,.04);
}
.merchant-hero h1 {
    font-family: "Sora", system-ui, sans-serif;
    font-size: clamp(1.5rem, 3vw, 2.05rem);
    letter-spacing: -.045em;
    line-height: 1.1;
    color: var(--cw-ink);
}
.merchant-hero .merchant-stats {
    font-size: .9rem;
    color: var(--cw-ink-2, #5C5F68);
    margin: 9px 0 0;
}
.merchant-hero .merchant-stats strong { color: var(--cw-ink); font-weight: 700; }
.merchant-hero .social-actions { margin-top: 14px; gap: 9px; }
.merchant-hero .btn-follow, .merchant-hero .btn-share {
    border-radius: 100px;
    font-size: .86rem;
    padding: 10px 20px;
}
.badge-row {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}
/* La pastiglia dello sconto migliore: ciano pieno, come la matrice dei
   tagliandi. E' l'unico posto della testata che ha il diritto di gridare. */
.badge-row .cw-top {
    background: #2BE29B;
    color: #06322A;
    font-weight: 900;
    font-size: .82rem;
    letter-spacing: -.01em;
    padding: 5px 13px;
    border-radius: 100px;
}
.badge-row .verified-check {
    color: #0E7A55;
    background: #E4FBF1;
    font-size: .78rem;
    font-weight: 700;
    padding: 5px 12px;
    border-radius: 100px;
}
.merchant-hero .btn-follow {
    background: #8A2BE2;
    box-shadow: none;
}
.merchant-hero .btn-follow:hover {
    background: #5F00A3;
    box-shadow: none;
}
/* Le recensioni sono una prova, non un annuncio: restano, in corpo minore e
   senza riquadro grigio che le faccia sembrare un banner. */
.merchant-hero .trustpilot-widget-mini {
    background: transparent;
    border: 0;
    padding: 0;
    margin-bottom: 1.1rem;
    gap: 8px;
    font-size: .88rem;
}