.vs-note {
    font-size: .78rem;
    color: #888;
    margin: 0;
    display: flex;
    align-items: flex-start;
    gap: .35rem;
    line-height: 1.5;
}

/* ===== BARRA RICERCA CONTESTUALE ===== */
.vs-search-bar {
    background: #f0f0f0;
    border-bottom: 1px solid #c5c6c7;
    padding: 0;
}

.vs-search-form {
    display: flex;
    align-items: center;
    gap: 0;
    flex-wrap: nowrap;
    height: 46px;
    margin: 8px 0;
}

.vs-search-label {
    display: flex;
    align-items: center;
    gap: .4rem;
    padding: 0 1rem;
    height: 100%;
    font-size: .875rem;
    font-weight: 700;
    color: #843d00;
    text-transform: uppercase;
    white-space: nowrap;
    flex-shrink: 0;
    background-image: url("data:image/svg+xml,%3Csvg version='1.1' id='Layer_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' width='39.366px' height='29.509px' viewBox='0 0 39.366 29.509' enable-background='new 0 0 39.366 29.509' xml:space='preserve'%3E%3Cg%3E%3Cg%3E%3Cpath fill='%23F0882B' d='M37.964,6.049c-0.148,0-0.301,0.021-0.453,0.064l-1.72,0.473l-1.786-4.352C33.498,1.002,32.002,0,30.669,0 H13.952c-1.332,0-2.828,1.002-3.335,2.234L8.834,6.58L7.133,6.113C6.981,6.07,6.83,6.049,6.683,6.049 c-0.812,0-1.404,0.621-1.404,1.477v1.016c0,0.041,0.004,0.08,0.007,0.123c-0.708,0.445-1.372,0.973-1.979,1.578 C1.175,12.375,0,15.209,0,18.222c0,3.016,1.175,5.85,3.306,7.982c2.133,2.131,4.967,3.305,7.98,3.305 c3.016,0,5.852-1.174,7.981-3.305c1.243-1.244,2.157-2.727,2.707-4.342h10.513v2.158c0,0.998,0.813,1.811,1.812,1.811h2.365 c1,0,1.812-0.812,1.812-1.811v-8.646c0-1.238-0.383-3.176-0.853-4.322l-0.289-0.701h0.22c0.998,0,1.811-0.812,1.811-1.811V7.525 C39.367,6.67,38.776,6.049,37.964,6.049z M12.833,2.785c0.305-0.736,1.203-1.34,2.002-1.34h14.952c0.798,0,1.698,0.604,2.001,1.34 l2.701,6.582c0.303,0.738-0.102,1.34-0.899,1.34H19.708c-0.143-0.158-0.289-0.312-0.44-0.465 c-2.132-2.133-4.966-3.307-7.981-3.307c-0.053,0-0.104,0.004-0.158,0.004L12.833,2.785z M11.286,26.132 c-2.11,0-4.097-0.822-5.592-2.316c-1.492-1.496-2.316-3.48-2.316-5.594c0-2.111,0.824-4.097,2.316-5.591 c1.495-1.494,3.481-2.316,5.592-2.316c2.113,0,4.1,0.822,5.594,2.316c1.493,1.494,2.315,3.48,2.315,5.591 c0,2.113-0.822,4.098-2.315,5.594C15.386,25.31,13.399,26.132,11.286,26.132z M34.991,17.693c0,0.398-0.326,0.725-0.725,0.725 h-5.134c-0.397,0-0.724-0.326-0.724-0.725V15.23c0-0.4,0.326-0.725,0.724-0.725h5.134c0.398,0,0.725,0.324,0.725,0.725V17.693z'/%3E%3Cg%3E%3Cpath fill='%23F0882B' d='M11.7,12.59c-0.073-0.16-0.236-0.266-0.412-0.266c-0.178,0-0.34,0.105-0.414,0.266 c-1.141,2.484-3.167,5.683-3.167,7.421c0,1.979,1.603,3.582,3.581,3.582c1.977,0,3.58-1.604,3.58-3.582 C14.868,18.273,12.842,15.074,11.7,12.59z M11.134,22.453c-1.323,0-2.398-1.076-2.398-2.4c0-0.264,0.214-0.479,0.479-0.479 c0.264,0,0.477,0.215,0.477,0.479c0,0.795,0.648,1.443,1.443,1.443c0.265,0,0.479,0.215,0.479,0.479S11.398,22.453,11.134,22.453 z'/%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: 0 center;
    padding-left: 50px;
}

.vs-search-fields {
    display: flex;
    align-items: center;
    flex: 1;
    height: 100%;
    gap: 0;
    overflow: hidden;
}

.vs-search-select,
.vs-search-input {
    display: block;
    width: 100%;
    height: calc(1.5em + .75rem + 2px);
    margin: 0 0.5rem;
    padding: .375rem .75rem;
    font-size: .875rem;
    font-weight: 400;
    line-height: 1.5;
    color: #495057;
    background-color: #fff;
    background-clip: padding-box;
    border: 1.5px solid #898989;
    border-radius: 0;
    transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;
}

.vs-input-wrapper {
    margin: 0 0.5rem;
    padding: 0;
    width: 100%;
}

.vs-input-wrapper .vs-search-select,
.vs-input-wrapper .vs-search-input {
    display: block;
    width: 100%;
    height: calc(1.5em + .75rem + 2px);
    margin: 0;
    padding: .375rem .75rem;
    font-size: .875rem;
    font-weight: 400;
    line-height: 1.5;
    color: #495057;
    background-color: #fff;
    background-clip: padding-box;
    border: 2px solid #843d00;
    border-radius: 0;
    transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;
}

.vs-search-select:focus,
.vs-search-input:focus {
    background-color: #fff;
    border-color: #843d00;
    box-shadow: none;
}

.vs-search-input {
    background-image: none;
    padding-right: .6rem;
    cursor: text;
}

.vs-search-input::placeholder {
    color: #bebebe;
}

.vs-search-btn {
    font-size: .875rem;
    min-width: 100px;
}

.vs-search-btn:hover {}

.vs-search-advanced {
    padding: 0 .85rem;
    height: 100%;
    display: flex;
    align-items: center;
    font-size: .75rem;
    color: #843d00;
    text-decoration: none;
    white-space: nowrap;
    flex-shrink: 0;
    border-left: 1px solid #c5c6c7;
    font-style: italic;
    transition: color .15s;
}

.vs-search-advanced:hover {
    color: #f1882d;
    text-decoration: none;
}

@media (max-width: 991px) {
    .vs-search-bar {
        display: none;
    }
}

.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.no-scrollbars {
    scrollbar-width: none !important;
    /* Firefox */
    -ms-overflow-style: none !important;
    /* Internet Explorer / Edge legacy */
}

.no-scrollbars::-webkit-scrollbar {
    display: none !important;
    /* Chrome, Safari, Edge Chromium */
}

.vs-sticky {
    position: sticky;
    top: 15px;
}

.vs-buybox {
    border: 1px solid #e3e3e3;
    padding: 1rem;
    text-align: left;
}

.vs-format-selector {
    display: flex;
    flex-direction: column;
    gap: .5rem;
    margin-bottom: 1rem;
}

.vs-format {
    display: flex;
    align-items: flex-start;
    gap: .6rem;
    border: 1px solid #e3e3e3;
    border-radius: 8px;
    padding: .6rem .7rem;
    cursor: pointer;
    margin: 0;
    text-decoration: none;
    color: inherit;
    transition: border-color .15s, background .15s;
}

.vs-format:hover {
    border-color: #bcbcbc;
    text-decoration: none;
    color: inherit;
}

.vs-format input {
    margin-top: .2rem;
}

.vs-format-body {
    flex: 1;
    display: flex;
    flex-direction: column;
}

.vs-format-title {
    font-weight: 700;
    color: #1a1a1a;
    font-size: .95rem;
}

.vs-format-desc {
    font-size: .78rem;
    color: #767676;
}

.vs-format-price {
    font-weight: 700;
    color: #1a1a1a;
    white-space: nowrap;
}

.vs-format-img {
    width: 60px;
    mix-blend-mode: darken;
    margin-right: 10px;
}

.vs-format--lead {
    border-color: #005ac8;
    background: #f5f9ff;
    box-shadow: 0 0 0 1px #005ac8 inset;
}

.vs-format--lead .vs-format-title {
    color: #005ac8;
}

.vs-badge {
    background: #005ac8;
    color: #fff;
    font-size: .62rem;
    font-weight: 700;
    text-transform: uppercase;
    padding: .1rem .4rem;
    border-radius: 4px;
    letter-spacing: .4px;
    vertical-align: middle;
    margin-left: .3rem;
}

.vs-trust {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
    margin-top: 1rem;
}

.vs-trust .item {
    flex: 1 1 30%;
    min-width: 100px;
    border: 1px solid #e3e3e3;
    padding: .5rem .6rem;
    font-size: .78rem;
    color: #555;
    display: flex;
    gap: .5rem;
    align-items: center;
}

.vs-trust .item b {
    display: block;
    color: #1a1a1a;
    font-size: .82rem;
}

.vs-trust .ic {
    font-size: 1.3rem;
    line-height: 1;
    color: #005ac8;
}

.vs-expert-hint {
    margin-top: .6rem;
    margin-bottom: 0;
    font-size: .78rem;
    color: #767676;
}

.vs-color-ok {
    background: #f1f8f3;
    border: 1px solid #cfe6d6;
    border-radius: 8px;
    padding: 1.1rem 1.25rem;
}

.vs-color-ok .head {
    display: flex;
    align-items: center;
    gap: .6rem;
}

.vs-color-ok .head .ic {
    font-size: 1.6rem;
    color: #2e9e4f;
}

.vs-color-ok .spots {
    display: flex;
    gap: 1rem;
    flex-wrap: wrap;
    margin-top: .75rem;
}

.vs-color-ok .spot {
    flex: 1 1 45%;
    min-width: 160px;
    background: #fff;
    border: 1px solid #cfe6d6;
    border-radius: 6px;
    padding: .6rem .75rem;
    font-size: .82rem;
}

.vs-color-ok .safety {
    background: #fff;
    border: 1px solid #cfe6d6;
    border-radius: 6px;
    padding: .7rem .85rem;
    margin-top: .75rem;
    font-size: .85rem;
}

.vs-why .col-card {
    border: 1px solid #e3e3e3;
    border-radius: 6px;
    padding: 1rem;
    height: 100%;
}

.vs-why .num {
    display: inline-flex;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background: #005ac8;
    color: #fff;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    margin-bottom: .5rem;
}

.vs-why h4 {
    font-size: 1rem;
    font-weight: 700;
    color: #1a1a1a;
}

.vs-when {
    font-size: .9rem;
    color: #555;
}

.vs-steps {
    margin: 0;
    padding: 0;
}

.vs-step {
    display: flex;
    gap: 1rem;
    padding: 0.75rem 0;
    border-bottom: 1px dashed #e3e3e3;
}

.vs-step:last-child {
    border-bottom: 0;
}

.vs-step .step-num {
    flex: 0 0 42px;
    height: 42px;
    border-radius: 50%;
    background-color: #faf4f4;
    color: #333;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.1rem;
}

.vs-step .vs-step-title {
    display: block;
    font-size: 1rem;
    font-weight: 700;
    margin: .1rem 0 .25rem;
    color: #1a1a1a;
}

.vs-step .vs-step-description {
    display: block;
    font-size: .88rem;
    color: #666;
    margin: 0;
}

.vs-accordion {
    margin: 0 0 15px;
}

.vs-accordion .vs-acc-item {
    border: 1px solid #e3e3e3;
    border-radius: 6px;
    margin-bottom: .5rem;
    overflow: hidden;
}

.vs-acc-trigger {
    width: 100%;
    text-align: left;
    background: #fff;
    border: 1px solid #e3e3e3;
    border-radius: 6px;
    padding: .7rem 1rem;
    font-weight: 600;
    color: #1a1a1a;
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.vs-acc-item .vs-acc-trigger {
    border: 0;
    border-radius: 0;
}

.vs-acc-trigger::after {
    content: "+";
    color: #005ac8;
    font-size: 1rem;
    font-weight: 700;
    margin-left: 1rem;
}

.vs-acc-trigger[aria-expanded="true"]::after {
    content: "\2013";
}

.vs-acc-panel {
    padding: .2rem 1rem .9rem;
    font-size: .88rem;
    color: #666;
}

.vs-compat {
    font-size: .88rem;
    color: #555;
    line-height: 1.9;
}

.text-item {
    color: #9a9a9a;
}

/* --- col-1: immagine protagonista + box colore persuasivo --- */
.vs-product-image {
    text-align: center;
}

.vs-prod-type {
    display: block;
    font-size: .8rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .5px;
    color: #767676;
    margin-bottom: .5rem;
}

.vs-main-img {
    max-width: 100%;
    height: auto;
}

.vs-color-chip {
    display: flex;
    gap: .1rem;
    align-items: center;
    text-align: center;
    flex-direction: row;
    border: 0 solid transparent;
    padding: 0;
    margin: .6rem auto 0 auto;
    background: #faf4f4;
    width: 220px;
    min-height: 60px;
    max-width: 100%;
    border-radius: 6px;
    overflow: hidden;

    box-shadow:
        0 2px 3px rgba(0, 0, 0, .20),
        0 6px 12px rgba(0, 0, 0, .12);

    font-family: ui-monospace, "SFMono-Regular", Menlo, Monaco,
                 Consolas, "Liberation Mono", "Courier New", monospace;
    font-weight: 500;
    letter-spacing: .015em;

    transform-origin: left bottom;
    transition:
        transform 200ms ease,
        box-shadow 200ms ease;
}

.vs-color-swatch {
    flex: 0 0 auto;
    width: 55px;
}

.vs-color-meta {
    display: flex;
    flex-direction: column;
    line-height: 1.3;
    margin: 0 auto 0 0;
    padding: 0 0.5rem;
}

.vs-color-name {
    font-weight: 600;
    font-size: .7rem;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    text-transform: uppercase;
}

.vs-color-codeline {
    font-size: .68rem;
}

.vs-generic-chip {
    display: flex;
    gap: .1rem;
    align-items: center;
    text-align: center;
    flex-direction: row;
    border: 0 solid transparent;
    padding: 0;
    margin: .6rem auto 0 auto;
    background: #faf4f4;
    width: 220px;
    min-height: 60px;
    max-width: 100%;
    border-radius: 6px;
    overflow: hidden;
    box-shadow: 0 2px 3px rgba(0, 0, 0, .20), 0 6px 12px rgba(0, 0, 0, .12);
    font-family: ui-monospace, "SFMono-Regular", Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
    font-weight: 500;
    letter-spacing: .015em;
    text-shadow: .25px .25px .4px rgba(0, 0, 0, .28);
}

.vs-generic-swatch {
    flex: 0 0 auto;
    width: 55px;
}

.vs-generic-meta {
    display: flex;
    flex-direction: column;
    line-height: 1.3;
    margin: 0 auto;
    padding: 0.5rem;
}

.vs-generic-name {
    color: #1a1a1a;
    font-size: .75rem;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    text-transform: uppercase;
}

.vs-generic-codeline {
    font-size: .72rem;
}

.vs-alternative-chip {
    display: flex;
    flex-direction: column;
}

.vs-alternative-swatch {
    width: auto;
    height: auto;
    max-width: 100%;
    min-width: 140px;
    margin: 5px auto !important;
}

.vs-alternative-name {
    margin: 5px auto;
    font-size: 0.75rem;
    font-weight: 700;
}

.vs-color-guarantee {
    font-size: .78rem;
    color: #2e7d3a;
    font-weight: 600;
    margin-top: .15rem;
}

/* --- col-2: specifiche gerarchizzate --- */
.list-group-title {
    font-weight: 600;
    margin: 1.25rem 0 0.25rem 0;
}

.vs-specs .list-group-item {
    border-color: #eee;
}

.vs-specs .vs-spec-key {
    font-size: .95rem;
}

.vs-specs .vs-spec-key strong {
    color: #1a1a1a;
}

.vs-specs .vs-spec-tech {
    font-size: .78rem;
    color: #767676;
}

.vs-specs .vs-spec-tech strong {
    color: #767676;
    font-weight: 600;
}

.vs-compat-link {
    margin-top: .5rem;
    font-size: .85rem;
}

/* --- col-3: prova sociale + sintesi --- */
.vs-social {
    border: 1px solid #e3e3e3;
    border-radius: 8px;
    padding: .75rem;
    margin-bottom: .85rem;
    background: #fff;
}

.vs-stars-row {
    display: flex;
    align-items: center;
    gap: .5rem;
}

.vs-stars .icon-star-solid,
.vs-stars .icon-star-half-solid {
    color: #f5a623;
    font-size: 0.75rem;
    line-height: 0
}

.vs-rating-num {
    font-size: 0.95rem;
    color: #1a1a1a;
    line-height: 1;
    font-size: 0.85rem !important;
    line-height: 1.1 !important;
}

.vs-review-count {
    font-size: .82rem;
    color: #666;
    margin-top: .15rem;
}

.vs-review-count strong {
    color: #1a1a1a;
}

.vs-synth {}

.vs-synth-head {
    display: flex;
    align-items: center;
    gap: .35rem;
    margin-bottom: 0;
}

.vs-synth-ic {
    font-size: 1rem;
}

.vs-synth-subtitle {
    font-size: .7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .3px;
    color: #111;
}

.vs-synth-single {
    font-size: .86rem;
    color: #444;
    font-style: italic;
    margin: 0;
}

.vs-synth-author {
    font-style: normal;
    color: #767676;
    font-size: .8rem;
}

.vs-synth-procon {
    display: flex;
    flex-direction: column;
    gap: .4rem;
}

.vs-pro,
.vs-con {
    font-size: .83rem;
    color: #555;
}

.vs-pro b {
    color: #2e7d3a;
    margin-right: .3rem;
}

.vs-con b {
    color: #b3402e;
    margin-right: .3rem;
}

.vs-synth-btn {
    background: 0;
    border: 0;
    color: #005ac8;
    font-weight: 600;
    font-size: .84rem;
    cursor: pointer;
    padding: 0;
    margin-top: .7rem;
}

.vs-synth-btn:hover {
    color: #005ac8;
    text-decoration: underline;
}

/* --- prezzo finale disambiguato --- */
.vs-price-final {
    margin-top: .25rem;
}

.vs-price-label {
    display: block;
    font-size: .78rem;
    color: #767676;
    text-transform: uppercase;
    letter-spacing: .3px;
    margin-bottom: .1rem;
}

/* --- popup recensioni --- */
.vs-rev-modal {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, .45);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1080;
}

.vs-rev-modal[hidden] {
    display: none;
}

.vs-rev-dialog {
    background: #fff;
    border-radius: 8px;
    width: 92%;
    max-width: 560px;
    max-height: 84vh;
    display: flex;
    flex-direction: column;
}

.vs-rev-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: .9rem 1.1rem;
    border-bottom: 1px solid #e3e3e3;
}

.vs-rev-header h4 {
    margin: 0;
    font-size: 1.05rem;
}

.vs-rev-close {
    background: 0;
    border: 0;
    font-size: 1.5rem;
    line-height: 1;
    cursor: pointer;
    color: #767676;
}

.vs-rev-body {
    padding: 1rem 1.1rem;
    overflow: auto;
}

.vs-rev-item {
    border-bottom: 1px solid #eee;
    padding: .7rem 0;
}

.vs-rev-item:last-child {
    border-bottom: 0;
}

.vs-rev-stars .icon-star-solid {
    color: #f5a623;
    font-size: .9rem;
}

.vs-rev-meta {
    font-size: .78rem;
    color: #767676;
}

.vs-rev-more {
    display: block;
    width: 100%;
    margin-top: .8rem;
    padding: .5rem;
    border: 1px solid #005ac8;
    background: #fff;
    color: #005ac8;
    border-radius: 6px;
    font-weight: 600;
    cursor: pointer;
}


/* --- Lucide sizing --- */
.vs-lucide {
    width: 20px;
    height: 20px;
    stroke-width: 2;
    vertical-align: middle;
    color: #005ac8;
}

.vs-lucide-sm {
    width: 15px;
    height: 15px;
    stroke-width: 2;
    vertical-align: middle;
}

.vs-lucide-lg {
    width: 26px;
    height: 26px;
    stroke-width: 2;
    vertical-align: middle;
    color: #2e9e4f;
}

/* --- col-3 compatta (stile CND) --- */
.vs-social {
    padding: 0;
    margin: 0;
    border: 0;
}

.vs-stars-row {
    display: flex;
    align-items: center;
    gap: .4rem;
}

.vs-rating-num {
    font-size: 0.95rem;
    color: #1a1a1a;
    line-height: 0;
}

.vs-review-count {
    font-size: .75rem;
    color: #666;
    margin: 0;
}

.vs-review-count strong {
    color: #1a1a1a;
}

.vs-synth {}

.vs-synth-head {
    display: flex;
    align-items: center;
    gap: .35rem;
    margin-bottom: 0;
}

.vs-synth-title {
    font-size: .9rem;
    font-weight: 700;
    color: #843d00;
}

.vs-pro,
.vs-con {
    list-style: none;
    padding-left: 0;
    margin: 0 0 0;
}

.vs-pro li,
.vs-con li {
    font-size: .83rem;
    color: #555;
    padding-left: 0;
    position: relative;
    line-height: 1.4;
}

.vs-pro li svg {
    color: #2e7d3a;
}

.vs-con li svg {
    color: #b3402e;
}

.vs-synth-btn {
    background: 0;
    border: 0;
    color: #005ac8;
    font-weight: 600;
    font-size: .84rem;
    cursor: pointer;
    padding: 0;
    display: inline-flex;
    align-items: center;
    gap: .3rem;
}

.vs-synth-btn:hover {
    text-decoration: underline;
}

/* formati: box bassi, separati */
.vs-format-selector {
    display: flex;
    flex-direction: column;
    gap: .45rem;
    margin: .5rem 0 0 0;
    padding: 0;
}

ul.vs-format-selector li {
    list-style: none;
}

.vs-format {
    position: relative;
    display: flex;
    align-items: center;
    gap: .55rem;
    border: 1px solid #e3e3e3;
    border-radius: 8px;
    padding: .5rem .65rem;
    cursor: pointer;
    margin: 0;
    text-decoration: none;
    color: inherit;
}

.vs-format:hover {
    border-color: #bcbcbc;
    text-decoration: none;
    color: inherit;
}

.vs-format input {
    margin: 0;
}

.vs-format-body {
    flex: 1;
    display: flex;
    flex-direction: column;
}

.vs-format-title {
    font-weight: 700;
    color: #1a1a1a;
    font-size: .9rem;
}

.vs-format-desc {
    font-size: .76rem;
    color: #767676;
}

.vs-format-price {
    font-weight: 700;
    color: #1a1a1a;
    white-space: nowrap;
    font-size: .95rem;
}

.vs-format--lead {
    border-color: #005ac8;
    background: #f5f9ff;
    box-shadow: 0 0 0 1px #005ac8 inset;
}

.vs-format--lead .vs-format-title {
    color: #005ac8;
}

.vs-badge {
    background: #005ac8;
    color: #fff;
    font-size: .6rem;
    font-weight: 700;
    text-transform: uppercase;
    padding: .1rem .35rem;
    border-radius: 4px;
    letter-spacing: .4px;
    margin-left: .25rem;
}

.vs-format .vs-badge {
    position: absolute;
    top: 6px;
    right: 6px;
}

/* blocco acquisto finale compatto */
.vs-buy-final {
    border-top: 1px solid #e3e3e3;
    padding-top: .6rem;
}

.vs-buy-row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: .5rem;
    margin-bottom: .5rem;
    flex-direction: column;
}

.vs-buy-row .price {
    margin: 0 0 10px 0;
    font-size: 1.7rem;
    font-weight: 700;
    color: #1a1a1a;
    line-height: 1;
}

.vs-buy-row .price small {
    display: block;
    font-size: .65rem;
    font-weight: 400;
    color: #767676;
}

.vs-buy-meta {
    text-align: left;
    font-size: .76rem;
    color: #767676;
    line-height: 1.4;
}

.price-without-vat {
    display: block;
    margin-bottom: 8px !important;
}

.price-valid-until {
    text-align: left;
    font-size: .76rem;
    color: #767676;
    line-height: 1.4;
}

.vs-buy-meta .availability {
    padding: 0 0 0.45rem 0;
    line-height: 1.1;
}

.vs-buy-meta .availability .good {
    color: #237a3b; 
}

.vs-buy-meta .availability .average {
    color: #9a6500; 
}

.vs-buy-meta .availability .poor {
    color: #b3261e; 
}

.vs-buy-meta .availability .notes {
    display: block;
    margin: 0.15rem 0 0 0;
    font-size: .76rem;
}

.vs-cta {}

.vs-cta:hover {}

.vs-trust {
    display: flex;
    gap: .4rem;
    margin-top: .7rem;
}

.vs-trust .item {
    flex: 1;
    border: 1px solid #e3e3e3;
    padding: .4rem .3rem;
    font-size: .7rem;
    color: #666;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: .2rem;
    text-align: center;
}

.vs-trust .item b {
    display: block;
    color: #1a1a1a;
}

.vs-expert-hint {
    margin-top: .5rem;
    margin-bottom: 0;
    font-size: .76rem;
    color: #767676;
}

.vs-color-chip img.vs-color-swatch {
    max-width: 100%;
    width: 60px;
    margin: 0 auto 0 0;
    height: 60px;
}

.main-header .secondary-header {
    font-size: 1.2rem;
}


.color-inherit {
    color: inherit !important;
}

.vs-spec-tech {
    padding: 6px 12px;
    background: #f6f6f6;
    color: #666;
    font-size: 0.75rem;
    margin: 15px 0;
}

.vs-paypal-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: .5rem;
    width: 100%;
    padding: .7rem 1rem;
    background: #ffc439;
    color: #003087;
    border: 1px solid #e6ad २b;
    border-radius: 6px;
    font-family: Helvetica, Arial, sans-serif;
    font-size: 1rem;
    font-weight: 600;
    text-decoration: none;
    line-height: 1;
    cursor: pointer;
    transition: background .15s;
}

.vs-paypal-btn:hover {
    background: #f0b72e;
    color: #003087;
    text-decoration: none;
}

.vs-paypal-ico {
    flex: 0 0 auto;
    color: #003087;
}

.vs-paypal-btn b {
    font-weight: 700;
}

.vs-paypal-btn .vs-pp-pal {
    color: #0070ba;
}

.vs-expert-hint {
    margin-top: .5rem;
    margin-bottom: 0;
    font-size: .76rem;
    color: #111;
    font-weight: 700;
}

.vs-fbt-wrapper {
    border-top: 1px solid #d8d8d8;
    margin: 1.25rem 0 0 0;
    padding: 1.95rem 0 0 0;
}

.vs-fbt-wrapper .h3 {
    margin-bottom: 0;
}

.vs-fbt-sub {
    color: #767676;
    font-size: .9rem;
    margin-top: 0.5rem;
    margin-bottom: 1.25rem;
}

.vs-fbt-wrap {
    display: flex;
    flex-wrap: wrap;
    gap: 1.5rem;
    align-items: flex-start;
    justify-content: space-between;
}

.vs-fbt-items {
    display: flex;
    align-items: flex-start;
    gap: .75rem;
    flex: 1 1 60%;
    flex-wrap: wrap;
}

.vs-fbt-item {
    position: relative;
    width: 150px;
}

.vs-fbt-check {
    position: absolute;
    top: .4rem;
    left: .4rem;
    width: 18px;
    height: 18px;
    accent-color: #005ac8;
    cursor: pointer;
    z-index: 2;
}

.vs-fbt-item img {
    width: 100%;
    height: 150px;
    object-fit: contain;
    border: 1px solid #e3e3e3;
    background: #fafafa;
    padding: .5rem;
}

.vs-fbt-item.vs-off img {
    opacity: .4;
}

.vs-fbt-info {
    display: flex;
    flex-direction: column;
    margin-top: .4rem;
}

.vs-fbt-this {
    font-weight: 700;
    color: #1a1a1a;
    font-size: .82rem;
}

.vs-fbt-name {
    font-size: .85rem;
    color: #005ac8;
    text-decoration: none;
    line-height: 1.3;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

a.vs-fbt-name:hover {
    text-decoration: underline;
}

.vs-fbt-price {
    font-weight: 700;
    color: #1a1a1a;
    font-size: .95rem;
    margin-top: .2rem;
}

.vs-fbt-plus {
    display: flex;
    align-items: center;
    align-self: center;
    color: #767676;
}

.vs-fbt-plus svg {
    width: 22px;
    height: 22px;
}

.vs-fbt-summary {
    flex: 0 0 30%;
    display: flex;
    flex-direction: column;
    gap: .6rem;
    border: 1px solid #e3e3e3;
    padding: 1rem;
    align-self: flex-start;
}

.vs-fbt-total-label {
    font-size: .9rem;
    color: #555;
}

.vs-fbt-total {
    font-size: 1.6rem;
    font-weight: 700;
    color: #1a1a1a;
    line-height: 1;
}

.vs-fbt-cta {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #0b66d8;
    color: #fff;
    border: 0;
    border-radius: 6px;
    padding: .5rem 1rem;
    font-weight: 700;
    font-size: .85rem;
    cursor: pointer;
}

.vs-fbt-cta:hover {
    filter: brightness(1.08);
}

.vs-fbt-cta.is-loading {
    pointer-events: none;
    cursor: wait;
    color: transparent !important;
}

.vs-fbt-cta.is-loading::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 18px;
    height: 18px;

    margin-top: -9px;
    margin-left: -9px;

    border: 2px solid #fff;
    border-right-color: transparent;
    border-radius: 50%;

    animation: btn-loading-spin .7s linear infinite;
}

@keyframes btn-loading-spin {
    to {
        transform: rotate(360deg);
    }
}

.vs-fbt-cta svg {
    width: 18px;
    height: 18px;
}

@media(max-width:767px) {
    .vs-fbt-summary {
        flex: 1 1 100%;
    }
}


.btn-add-to-cart {
    width: 100%;
    padding: 0.5rem 1rem;
    border-radius: 6px;
    text-transform: initial !important;
}

.vs-buy-counter {
    font-size: 0.75rem;
}

/* ===== ASSISTENZA CLIENTI ===== */
.vs-callus {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    align-items: center;
    gap: .25rem;
    margin: 1.25rem 0;
}

.vs-callus-label {
    font-size: .65rem;
    color: #666;
    margin: 0;
}

.vs-callus-img-link {
    line-height: 0;
}

.vs-callus-img-link:hover {
    opacity: .85;
}

.vs-callus-img-link img {
    margin: 0 0 5px 0 !important;
    max-width: 120px !important;
}

.vs-callus-wa {
    display: inline-flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .15rem;
    font-size: .76rem;
    color: #188038;
    font-weight: 600;
    text-decoration: none;
}

.vs-callus-wa:hover {
    text-decoration: underline;
}

.vs-callus-wa-ico {
    width: 14px;
    height: 14px;
    stroke-width: 2;
    margin-left: 3px;
}

/* ===== RATING POPOVER AMAZON-STYLE ===== */
.vs-rating-trigger {
    cursor: pointer;
    user-select: none;
    position: relative;
}

.vs-rating-trigger:hover .vs-review-count .count {
    text-decoration: underline;
    color: #005ac8;
}

.vs-chevron-ico {
    width: 12px;
    height: 12px;
    stroke-width: 2.5;
    vertical-align: middle;
    color: #666;
    transition: transform .2s;
}

.vs-rating-trigger[aria-expanded="true"] .vs-chevron-ico {
    transform: rotate(180deg);
}

.vs-rating-popover {
    position: absolute;
    top: calc(100% + 8px);
    left: 0;
    z-index: 900;
    background: #fff;
    border: 1px solid #d5d9d9;
    border-radius: 8px;
    box-shadow: 0 4px 16px rgba(0, 0, 0, .18);
    padding: .85rem 1rem;
    width: 300px;
    font-size: .84rem;
    color: #111;
}

.vs-rating-popover[hidden] {
    display: none;
}

/* freccia triangolare sopra il popover */
.vs-rating-popover::before {
    content: '';
    position: absolute;
    top: -7px;
    left: 18px;
    width: 12px;
    height: 12px;
    background: #fff;
    border-left: 1px solid #d5d9d9;
    border-top: 1px solid #d5d9d9;
    transform: rotate(45deg);
}

/* header: voto grande + stelle */
.vs-rp-header {
    display: flex;
    align-items: center;
    gap: .45rem;
    margin-bottom: .75rem;
    padding-bottom: .65rem;
    border-bottom: 1px solid #eee;
}

.vs-rp-score {
    font-size: 1.5rem;
    font-weight: 700;
    line-height: 1;
}

.vs-rp-stars .icon-star-solid,
.vs-rp-stars .icon-star-half-solid {
    color: #f5a623;
    font-size: .9rem;
}

.vs-rp-total {
    font-size: .76rem;
    color: #666;
    margin-left: .1rem;
}

/* barre distribuzione */
.vs-rp-bars {
    display: flex;
    flex-direction: column;
    gap: .3rem;
}

.vs-rp-row {
    display: flex;
    align-items: center;
    gap: .5rem;
}

.vs-rp-label {
    font-size: .78rem;
    color: #333;
    white-space: nowrap;
    width: 48px;
}

.vs-rp-bar-wrap {
    flex: 1;
    background: #e8e8e8;
    border-radius: 3px;
    height: 10px;
    overflow: hidden;
}

.vs-rp-bar {
    height: 100%;
    background: #f5a623;
    border-radius: 3px;
    transition: width .4s ease;
}

.vs-rp-pct {
    font-size: .76rem;
    color: #555;
    width: 28px;
    text-align: right;
}

/* CTA link in fondo */
.vs-rp-cta {
    display: block;
    margin-top: .75rem;
    padding-top: .6rem;
    border-top: 1px solid #eee;
    font-size: .82rem;
    color: #005ac8;
    text-decoration: none;
    font-weight: 600;
}

.vs-rp-cta:hover {
    color: #005ac8;
    text-decoration: underline;
}


/* ===== STICKY BAR ===== */
.vs-sticky-bar {
    position: fixed;
    left: 0;
    right: 0;
    z-index: 1040;
    background: #fff;
    border-top: 1px solid #d5d9d9;
    box-shadow: 0 3px 12px rgba(0, 0, 0, .10);
    transform: translateY(-100%);
    transition: transform .18s cubic-bezier(.4, 0, .2, 1);
}

.vs-sticky-bar {
    top: -5000px
}

.vs-sticky-bar.vs-sticky-visible {
    top: 0;
    transform: translateY(0);
}

.vs-sticky-inner {
    max-width: 1336px;
    margin: 0 auto;
    padding: .55rem 1rem;
    display: flex;
    align-items: center;
    gap: .75rem;
}

.vs-sticky-product {
    display: flex;
    align-items: center;
    gap: .6rem;
    flex: 1;
    min-width: 0;
}

.vs-sticky-thumb {
    height: 70px;
    width: auto;
    border-radius: 4px;
    object-fit: cover;
    flex-shrink: 0;
}

.vs-sticky-swatch {
    width: 40px;
    height: 40px;
    border-radius: 3px;
    object-fit: fill;
}

.vs-sticky-info {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.vs-sticky-name {
    font-size: 1rem;
    font-weight: 700;
    color: #1a1a1a;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.vs-sticky-dim {
    font-size: .85rem;
    color: #767676;
}

.vs-sticky-price {
    padding: 0 20px;
    display: flex;
    flex-direction: column;
    font-size: 1.15rem;
    font-weight: 700;
    color: #1a1a1a;
    white-space: nowrap;
    flex-shrink: 0;
    line-height: 1.1;
}

.vs-sticky-price small {
    display: block;
    font-size: .65rem;
    font-weight: 400;
    color: #767676;
}

.vs-sticky-actions {
    display: flex;
    align-items: center;
    gap: .5rem;
    flex-shrink: 0;
}

.vs-sticky-paypal {
    display: flex;
    align-items: center;
    gap: .3rem;
    background: #ffc439;
    color: #003087;
    border-radius: 6px;
    padding: .45rem .75rem;
    font-size: .82rem;
    font-weight: 700;
    text-decoration: none;
    white-space: nowrap;
}

.vs-sticky-paypal .vs-pp-pal {
    color: #009cde;
}

.vs-sticky-paypal:hover {
    filter: brightness(1.06);
    color: #003087;
    text-decoration: none;
}

.vs-sticky-cta {
    background: #106100;
    color: #fff;
    border-radius: 6px;
    padding: .45rem .9rem;
    font-size: .75rem;
    font-weight: 700;
    text-decoration: none;
    white-space: nowrap;
}

.vs-sticky-cta:hover {
    filter: brightness(1.08);
    color: #fff;
    text-decoration: none;
}

/* mobile: nascondi nome prodotto, comprimi */
@media (max-width: 575px) {
    .vs-sticky-product {
        display: none;
    }

    .vs-sticky-inner {
        justify-content: space-between;
    }
}

.horizontal-break {
    margin: 1.95rem 0;
    border-top: 1px solid #d8d8d8;
}

/* ===== 3 TAB ===== */
.vs-tabs-section {
    margin: 0 0 15px;
}

.vs-tabs-nav {
    display: flex;
    border-bottom: 1px solid #e0e0e0;
    gap: 0;
}

.vs-tab-btn {
    background: none;
    border: none;
    border-bottom: 3px solid transparent;
    margin-bottom: -2px;
    padding: .65rem 1.1rem;
    font-size: .88rem;
    font-weight: 600;
    color: #666;
    cursor: pointer;
    transition: color .18s, border-color .18s;
    white-space: nowrap;
}

.vs-tab-btn:hover {
    color: #1a1a1a;
}

.vs-tab-btn.vs-tab-active {
    color: #d40050;
    border-bottom-color: #d40050;
}

.vs-tab-panels {
    padding: 1.25rem 0 .5rem;
}

.vs-tab-panel {
    animation: vsTabFadeIn .2s ease;
}

.vs-tab-panel[hidden] {
    display: none;
}

.vs-tab-panel h3 {
    font-size: 1rem;
    font-weight: 700;
    margin-bottom: .65rem;
    color: #1a1a1a;
}

.vs-tab-panel p {
    font-size: .88rem;
    color: #444;
    line-height: 1.65;
    margin-bottom: .75rem;
}

@keyframes vsTabFadeIn {
    from {
        opacity: 0;
        transform: translateY(4px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* mobile: scroll orizzontale se non ci stanno */
@media (max-width: 480px) {
    .vs-tabs-nav {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }
}

/* ===== INFO ===== */

.vs-info p, .vs-info ul, .vs-info ol {
    margin: 0.5rem 0;
}

.vs-info p, .vs-info ul, .vs-info ol, .vs-info ul li, .vs-info ol li {
    font-size: 0.9rem;
    line-height: 1.25;
}

.vs-info ul li, .vs-info ol li {
    margin: 0.75rem 0;
}

/* ===== TABELLA CONFRONTO FORMATI ===== */
.vs-cmp-wrap {
    margin: 10px 0 20px 0;
}

.vs-cmp-outer {
    position: relative;
}

.vs-cmp-scroll {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scroll-behavior: smooth;
    scrollbar-width: thin;
    scrollbar-color: #ddd transparent;
}

.vs-cmp-scroll::-webkit-scrollbar {
    height: 4px;
}

.vs-cmp-scroll::-webkit-scrollbar-thumb {
    background: #ddd;
    border-radius: 2px;
}

/* frecce */
.vs-cmp-arrow {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 10;
    width: 40px;
    height: 72px;
    background: rgba(255, 255, 255, .96);
    border: 1px solid #d5d9d9;
    box-shadow: 0 2px 8px rgba(0, 0, 0, .12);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: #333;
    padding: 0;
    border-radius: 0;
    transition: box-shadow .15s, background .15s;
}

.vs-cmp-arrow[hidden] {
    display: none;
}

.vs-cmp-arrow:hover {
    background: #f7f7f7;
    box-shadow: 0px 0px 15px 2px rgb(0 0 0 / 5%);
}

.vs-cmp-arrow-left {
    left: -8px;
}

.vs-cmp-arrow-right {
    right: -8px;
}

/* tabella */
.vs-cmp-table {
    border-collapse: collapse;
    table-layout: fixed;
}

/* colonna etichetta sticky */
.vs-cmp-table tbody th,
.vs-cmp-th-label {
    width: 167px;
    min-width: 167px;
    padding: .85rem 1rem;
    border: none;
    border-right: 4px solid #fff;
    border-bottom: 4px solid #fff;
    vertical-align: middle;
    font-size: .82rem;
    font-weight: 700;
    text-align: center;
    color: #1a1a1a;
    white-space: nowrap;
    background: #fff;
    position: sticky;
    left: 0;
    z-index: 2;
}

@media (max-width: 767px) {
    .vs-cmp-table tbody th, .vs-cmp-th-label {
        display: none;
    }
}

.vs-cmp-th-label {
    background: #fff !important;
    border-bottom: 4px solid #fff;
}

/* colonne dati */
.vs-cmp-table td {
    width: 280px;
    min-width: 280px;
    padding: .85rem 1rem;
    border: none;
    border-right: 4px solid #fff;
    border-bottom: 4px solid #fff;
    vertical-align: middle;
    font-size: .82rem;
    color: #444;
    text-align: left;
    line-height: 1.45;
    padding: 1.5rem;
    background: #f8f8f8;
}

/* intestazioni colonne */
.vs-cmp-table thead th {
    padding: 1.1rem .85rem .9rem;
    background: #fff;
    text-align: center;
    border: none;
    border-right: 4px solid #fff;
    border-bottom: 4px solid #fff;
    vertical-align: top;
}

/* ultima riga: nessun bordo bottom */
.vs-cmp-table tbody tr:last-child td,
.vs-cmp-table tbody tr:last-child th {
    border-bottom: none;
}

/* colonna evidenziata (prodotto corrente) */
.vs-cmp-highlight {
    background: #f5f9ff !important;
    position: relative;
}

thead .vs-cmp-highlight {
    border-top: 3px solid #005ac8 !important;
    padding-top: calc(1.1rem - 3px);
}

/* header colonne */
.vs-cmp-col-head {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: .5rem;
    text-align: center;
}

.vs-cmp-img {
    width: 140px;
    height: 140px;
    padding: 15px;
    object-fit: contain;
    mix-blend-mode: darken;
}

.vs-cmp-col-name {
    font-size: .95rem;
    font-weight: 700;
    color: #005ac8;
    text-decoration: none;
    line-height: 1.3;
    display: block;
    padding: 0 20px;
}

.vs-cmp-col-name:hover {
    text-decoration: underline;
    color: #003e8f;
}

.vs-cmp-col-sub {
    font-size: .72rem;
    color: #767676;
    font-weight: 400;
}

/* badge difficoltà */
.vs-cmp-badge {
    display: inline-block;
    font-size: .73rem;
    font-weight: 700;
    padding: .2rem .55rem;
    border-radius: 0;
    letter-spacing: .2px;
}

.vs-cmp-easy {
    background: #e8f5e9;
    color: #2e7d32;
}

.vs-cmp-medium {
    background: #fff3e0;
    color: #e65100;
}

.vs-cmp-hard {
    background: #fce4ec;
    color: #c62828;
}

/* riga prezzo */
.vs-cmp-table tr:nth-last-child(2) td,
.vs-cmp-table tr:nth-last-child(2) th {
    font-size: .88rem;
    color: #1a1a1a;
}

/* CTA */
.vs-cmp-cta {
    display: inline-block;
    padding: .38rem .9rem;
    border: 1.5px solid #1a1a1a;
    border-radius: 4px;
    font-size: .78rem;
    font-weight: 700;
    color: #1a1a1a;
    text-decoration: none;
    white-space: nowrap;
    transition: background .15s, color .15s;
}

.vs-cmp-cta:hover {
    background: #1a1a1a;
    color: #fff;
    text-decoration: none;
}

.vs-cmp-cta-primary {
    background: #e8000d;
    border-color: #e8000d;
    color: #fff !important;
}

.vs-cmp-cta-primary:hover {
    background: #c50009;
    border-color: #c50009;
    color: #fff !important;
}

/* ===== PRO / CONTRO ===== */
.vs-procon {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
    margin: 20px 0 0 0;
}

@media (max-width: 575px) {
    .vs-procon {
        grid-template-columns: 1fr;
    }
}

.vs-procon-col {
    padding: .9rem 1rem 1rem;
    border: 3px solid transparent;
}

.vs-procon-pro {
    border-color: #1a7a4a;
}

.vs-procon-con {
    border-color: #b83c1e;
}

.vs-procon-head {
    display: flex;
    align-items: center;
    gap: .4rem;
    font-size: .88rem;
    font-weight: 700;
    margin-bottom: .75rem;
    padding-bottom: .55rem;
    border-bottom: 1px solid rgba(0, 0, 0, .07);
}

.vs-procon-pro .vs-procon-head {
    color: #1a7a4a;
}

.vs-procon-con .vs-procon-head {
    color: #b83c1e;
}

.vs-procon-ico {
    width: 16px;
    height: 16px;
    flex-shrink: 0;
    stroke-width: 2;
}

.vs-procon-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: .55rem;
}

.vs-procon-list li {
    display: flex;
    flex-direction: column;
    gap: .1rem;
    padding-left: 1.1rem;
    position: relative;
    font-size: .82rem;
    line-height: 1.45;
}

.vs-procon-list li::before {
    content: '';
    position: absolute;
    left: 0;
    top: .45em;
    width: 5px;
    height: 5px;
    border-radius: 50%;
}

.vs-procon-pro .vs-procon-list li::before {
    background: #1a7a4a;
}

.vs-procon-con .vs-procon-list li::before {
    background: #b83c1e;
}

.vs-procon-list li strong {
    color: #1a1a1a;
    font-weight: 600;
    font-size: .82rem;
}

.vs-procon-list li span {
    color: #666;
    font-size: .78rem;
}

/* ===== SEZIONE CREATOR + VIDEO ===== */
.vs-creator-row {
    align-items: center;
    margin: 2.5rem 0;
    padding: 1.75rem 1rem 1.75rem 1.5rem;
    background: #fff;
    border-top: 1px solid #e0e0e0;
    border-bottom: 1px solid #e0e0e0;
    border-left: 4px solid #e8000d;
    border-right: 1px solid #e0e0e0;
    border-radius: 0;
}

.vs-creator-left {
    display: flex;
    flex-direction: column;
    gap: .4rem;
    padding-right: 2rem;
}

.vs-creator-label {
    display: flex;
    align-items: center;
    gap: .4rem;
    font-size: .71rem;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: #e8000d;
}

.vs-creator-play-ico {
    width: 13px;
    height: 13px;
    stroke-width: 2.2;
    flex-shrink: 0;
}

.vs-creator-title {
    font-size: 1.15rem;
    font-weight: 800;
    line-height: 1.3;
    color: #1a1a1a;
    margin: 0;
}

.vs-creator-body {
    font-size: .83rem;
    line-height: 1.7;
    color: #555;
    margin: 0;
}

.vs-creator-meta {
    display: flex;
    align-items: center;
    gap: .65rem;
    margin: 10px 0;
    padding: .6rem .8rem;
    background: #fff;
    border: 1px solid #ddd;
    border-radius: 8px;
    text-decoration: none !important;
    color: inherit;
    transition: border-color .15s;
}

.vs-creator-meta:hover {
    border-color: #e8000d;
    text-decoration: none !important;
    color: inherit;
}

.vs-creator-meta:hover .vs-creator-name {

}

.vs-creator-meta:hover .vs-creator-link-ico {
    color: #e8000d;
}

.vs-creator-avatar {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    object-fit: cover;
    flex-shrink: 0;
    border: 2px solid #eee;
}

.vs-creator-meta-text {
    flex: 1;
    min-width: 0;
}

.vs-creator-name {
    display: block;
    font-size: .8rem;
    font-weight: 700;
    color: #1a1a1a;
    transition: color .15s;
}

.vs-creator-subs {
    display: block;
    font-size: .71rem;
    color: #767676;
}

.vs-creator-link-ico {
    width: 14px;
    height: 14px;
    stroke-width: 2;
    color: #bbb;
    flex-shrink: 0;
    transition: color .15s;
}

.vs-creator-right {
    padding-left: 1rem;
}

/* player */
.vs-creator-video-wrap {
    position: relative;
    width: 100%;
    padding-bottom: 56.25%;
    height: 0;
    overflow: hidden;
    background: #111;
    box-shadow: 0 4px 20px rgba(0, 0, 0, .13);
    cursor: pointer;
}

.vs-creator-thumb {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: opacity .2s;
}

.vs-creator-video-wrap:hover .vs-creator-thumb {
    opacity: .82;
}

.vs-creator-play-btn {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: none;
    border: none;
    padding: 0;
    cursor: pointer;
    transition: transform .15s;
    z-index: 2;
    line-height: 0;
}

.vs-creator-video-wrap:hover .vs-creator-play-btn {
    transform: translate(-50%, -50%) scale(1.1);
}

.vs-creator-video-meta {
    padding: .4rem 0 0;
    min-height: 1.3rem;
}

/* stato attivo */
.vs-creator-video-wrap.vs-yt-active .vs-creator-thumb,
.vs-creator-video-wrap.vs-yt-active .vs-creator-play-btn {
    display: none;
}

.vs-creator-iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: 0;
    display: none;
}

.vs-creator-video-wrap.vs-yt-active .vs-creator-iframe {
    display: block;
}

@media (max-width: 767px) {
    .vs-creator-row {
        padding: 1.25rem 1rem 1.25rem 1.1rem;
    }

    .vs-creator-left {
        padding-right: 1rem;
        margin-bottom: 1.25rem;
    }

    .vs-creator-title {
        font-size: 1rem;
    }
}

/* ===== KIT COMPONENTS ===== */
.vs-kit-components {
    margin: 1.5rem 0 0 0;
    border-top: 1px solid #d8d8d8;
    padding-top: 1.95rem;
}

.vs-kit-items {
    display: flex;
    align-items: stretch;
    gap: 0;
    margin: 0 0 1rem;
    overflow: hidden;
    overflow-x: scroll;
    scroll-behavior: smooth;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
}


.vs-kit-items::-webkit-scrollbar {
    display: none;
}

.vs-kit-item {
    flex: 1;
    display: flex;
    align-items: flex-start;
    gap: 1rem;
    padding: 1rem 1.25rem 1rem 1rem;
    border: 1px solid #e3e3e3;
    border-radius: 8px;
    text-decoration: none;
    color: inherit;
    transition: border-color .15s, background .15s;
    position: relative;
}

.vs-kit-item:hover {
    border-color: #005ac8;
    background: #f5f9ff;
    text-decoration: none;
    color: inherit;
}

.vs-kit-item:hover .vs-kit-name {
    color: #005ac8;
}

.vs-kit-img-wrap {
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: .4rem;
}

.vs-kit-img {
    width: 90px;
    height: 90px;
    object-fit: contain;
    mix-blend-mode: darken;
    background: #fafafa;
}

.vs-kit-swatch {
    width: 36px;
    height: 18px;
    object-fit: cover;
    border: 1px solid #ddd;
}

.vs-kit-body {
    flex: 1;
    display: flex;
    align-items: flex-start;
    gap: .75rem;
    min-width: 0;
}

.vs-kit-num {
    flex-shrink: 0;
    width: 24px;
    height: 24px;
    background: #1a1a1a;
    color: #fff;
    font-size: .75rem;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: .1rem;
}

.vs-kit-content {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: .3rem;
}

.vs-kit-name {
    font-size: .9rem;
    font-weight: 700;
    color: #1a1a1a;
    line-height: 1.3;
    transition: color .15s;
}

.vs-kit-sub {
    font-size: .78rem;
    color: #767676;
    line-height: 1.4;
}

.vs-kit-specs {
    list-style: none;
    padding: 0;
    margin: .35rem 0 0;
    display: flex;
    flex-direction: column;
    gap: .15rem;
}

.vs-kit-specs li {
    font-size: .76rem;
    color: #555;
    display: flex;
    gap: .4rem;
}

.vs-kit-spec-label {
    color: #767676;
    min-width: 110px;
    flex-shrink: 0;
}

.vs-kit-specs li strong {
    color: #1a1a1a;
}

.vs-kit-arrow {
    position: absolute;
    bottom: 1rem;
    right: .75rem;
    color: #ccc;
    transition: color .15s;
}

.vs-kit-arrow svg {
    width: 14px;
    height: 14px;
}

.vs-kit-item:hover .vs-kit-arrow {
    color: #005ac8;
}

.vs-kit-separator {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 .75rem;
    flex-shrink: 0;
}

.vs-kit-plus-ico {
    width: 20px;
    height: 20px;
    color: #bbb;
    stroke-width: 2;
}

.vs-kit-note {
    font-size: .78rem;
    color: #767676;
    margin: 0;
    display: flex;
    align-items: flex-start;
    gap: .35rem;
    line-height: 1.5;
}

.vs-kit-note svg {
    flex-shrink: 0;
    margin-top: .1rem;
}

/* ===== DOWNLOADS ===== */
.vs-downloads {

}

.vs-downloads-items {
    display: grid;
    grid-template-columns: repeat(3, minmax(240px, 1fr));
    gap: 1rem;
    margin: .5rem 0;
    padding: 0;
    list-style: none;
}

@media (max-width: 991px) {
    .vs-downloads-items {
        grid-template-columns: repeat(2, minmax(240px, 1fr));
    }
}

@media (max-width: 575px) {
    .vs-downloads-items {
        grid-template-columns: repeat(1, minmax(240px, 1fr));
    }
}

.vs-downloads-item {
    flex: 1;
    min-width: 240px;
    display: flex;
    align-items: center;
    gap: .65rem;
    margin: 0;
    padding: .9rem 1rem;
    border: 1px solid #e3e3e3;
    text-decoration: none;
    color: inherit;
    transition: border-color .15s, background .15s;
    border-radius: 8px;
    list-style: none;
}

.vs-downloads-item:hover {
    border-color: #005ac8;
    background: #f5f9ff;
    text-decoration: none;
    color: inherit;
}

.vs-downloads-item .vs-downloads-wrapper {
    flex: 1;
    width: 100%;
    display: flex;
    align-items: center;
    gap: .65rem;
}

.vs-downloads-item .vs-downloads-wrapper:hover {
    text-decoration: none;
}

.vs-downloads-ico {
    width: 22px;
    height: 22px;
    stroke-width: 1.8;
    color: #005ac8;
    flex-shrink: 0;
}

.vs-downloads-body {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: .1rem;
}

.vs-downloads-name {
    font-size: .88rem;
    font-weight: 700;
    color: #1a1a1a;
    transition: color .15s;
}

.vs-downloads-item:hover .vs-downloads-name {
    color: #005ac8;
}

.vs-downloads-sub {
    font-size: .74rem;
    color: #767676;
}

.vs-downloads-badge {
    font-size: .65rem;
    font-weight: 700;
    letter-spacing: .05em;
    color: #e8000d;
    border: 1px solid #e8000d;
    padding: .1rem .35rem;
    flex-shrink: 0;
}

.vs-downloads-arrow {
    width: 16px;
    height: 16px;
    stroke-width: 2;
    color: #bbb;
    flex-shrink: 0;
    transition: color .15s;
}

.vs-downloads-item:hover .vs-downloads-arrow {
    color: #005ac8;
}

/* ===== COMPATIBILITÀ ===== */
.vs-compat-group {}

.vs-compat-block {
    padding-bottom: 1.75rem;
    margin-bottom: 1.75rem;
}

.vs-compat-block:last-child {
    border-bottom: none;
    margin-bottom: 0;
}

/* chip modelli */
.vs-compat-models {
    list-style: none;
    padding: 0;
    margin: 1rem 0 0;
    display: flex;
    flex-wrap: wrap;
    gap: .4rem;
}

.vs-compat-models li a {
    display: inline-block;
    padding: .4rem .6rem;
    border: 1px solid #d5d9d9;
    font-size: .78rem;
    font-weight: 600;
    line-height: 1;
    color: #005ac8;
    border-radius: 3px;
    text-decoration: none;
    transition: border-color .15s, background .15s;
}

.vs-compat-models li a:hover {
    border-color: #005ac8;
    background: #f5f9ff;
    text-decoration: none;
}

.vs-compat-current {
    display: inline-flex;
    align-items: center;
    gap: .3rem;
    padding: .4rem .6rem;
    border: 1px solid #e8000d;
    border-radius: 3px;
    font-size: .78rem;
    font-weight: 700;
    line-height: 1;
    color: #e8000d;
}

.vs-compat-current-label {
    font-size: .64rem;
    font-weight: 400;
    opacity: .75;
}

/* filtro colori */
.vs-colorlist-filter-wrap {
    display: flex;
    align-items: center;
    gap: .75rem;
    margin: 1rem 0 .75rem;
}

.vs-colorlist-filter {
    flex: 1;
    max-width: 320px;
    height: 32px;
    padding: 0 .65rem;
    border: 1px solid #d5d5d5;
    font-size: .8rem;
    font-family: Roboto, sans-serif;
    color: #333;
    border-radius: 0;
    outline: none;
    transition: border-color .15s;
}

.vs-colorlist-filter:focus {
    border-color: #843d00;
}

.vs-colorlist-filter::placeholder {
    color: #bbb;
}

.vs-colorlist-count {
    font-size: .74rem;
    color: #767676;
    white-space: nowrap;
}

/* sezione gruppo */
.vs-colorlist-group {
    margin-bottom: 1rem;
}

.vs-colorlist-group-title {
    font-size: .7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .07em;
    color: #767676;
    margin-bottom: .6rem;
    padding-bottom: .4rem;
    border-bottom: 1px solid #efefef;
}

/* griglia colori */
.vs-colorlist-grid {
    list-style: none;
    padding: 0;
    margin: 0;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0;
}

.vs-colorlist-item {
    border-left: 1px solid transparent;
}

.vs-colorlist-item a,
.vs-colorlist-item--current {
    display: flex;
    align-items: center;
    gap: .55rem;
    padding: .4rem .5rem;
    border-bottom: 1px solid #f2f2f2;
    border-radius: 3px;
    text-decoration: none;
    color: inherit;
    transition: background .12s;
}

.vs-colorlist-item a:hover {
    background: #f5f9ff;
    text-decoration: none;
    color: inherit;
}

.vs-colorlist-item a:hover .vs-colorlist-name {
    color: #005ac8;
}

.vs-colorlist-item img {
    flex-shrink: 0;
    border: 1px solid #e0e0e0;
    display: block;
    width: 70px;
    height: 35px;
    object-fit: fill;
}

.vs-colorlist-name {
    flex: 1;
    font-size: .76rem;
    color: #1a1a1a;
    line-height: 1.3;
    min-width: 0;
}

.vs-colorlist-code {
    font-size: .71rem;
    font-weight: 700;
    color: #767676;
    white-space: nowrap;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    gap: .25rem;
}

/* colore corrente */
.vs-colorlist-item--current {
    border: 1px solid #e8000d;
}

.vs-colorlist-item--current .vs-colorlist-name {
    font-weight: 700;
    color: #e8000d;
}

.vs-colorlist-item--current .vs-colorlist-code {
    color: #e8000d;
}

/* item nascosto dal filtro */
.vs-colorlist-item[hidden] {
    display: none;
}

/* messaggio vuoto */
.vs-colorlist-empty {
    font-size: .82rem;
    color: #767676;
    padding: .5rem 0;
    font-style: italic;
}

.vs-colorlist-empty[hidden] {
    display: none;
}

/* link tutti i colori */
.vs-compat-all-link {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    font-size: .8rem;
    font-weight: 600;
    color: #005ac8;
    text-decoration: none;
}

.vs-compat-all-link:hover {
    color: #005ac8;
    text-decoration: underline;
}

@media (max-width: 991px) {
    .vs-colorlist-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 575px) {
    .vs-colorlist-grid {
        grid-template-columns: 1fr;
    }
}

/* ===== CAROUSEL PRODOTTI CORRELATI ===== */
.vs-related {
    margin: 0 0 1.5rem;
}

.vs-related-btn:disabled {
    opacity: .35;
    cursor: default;
}

.vs-related-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 1rem;
}

.vs-related-nav {
    display: flex;
    gap: .35rem;
}

.vs-related-btn {
    width: 32px;
    height: 32px;
    background: #fff;
    border: 1px solid #d5d9d9;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: #333;
    padding: 0;
    transition: background .15s, border-color .15s;
    border-radius: 0;
}

.vs-related-btn[hidden] {
    display: none;
}

.vs-related-btn:hover {
    background: #f7f7f7;
    border-color: #767676;
}

/* scroll track */
.vs-related-scroll {
    display: flex;
    gap: 1rem;
    overflow-x: auto;
    scroll-behavior: smooth;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    padding-bottom: .25rem;
}

.vs-related-scroll::-webkit-scrollbar {
    display: none;
}

/* card */
.vs-related-item {
    flex: 0 0 calc(23% - .75rem);
    max-width: 210px;
    scroll-snap-align: start;
}

.vs-related-item .product-thumb {
    border: 1px solid #e3e3e3;
    padding: .75rem;
    height: 100%;
    transition: border-color .15s;
}

.vs-related-item .product-thumb img {
    display: block;
    margin: 0 auto .75rem;
    max-height: 160px;
    width: auto;
    object-fit: contain;
}

.vs-related-item .name {
    font-size: .82rem;
    font-weight: 700;
    line-height: 1.35;
    margin-bottom: .4rem;
    min-height: 0 !important;
    /* sovrascrive lo style inline del vecchio codice */
}

.vs-related-item .name a {
    color: #005ac8;
    text-decoration: none;
}

.vs-related-item .name a:hover {
    text-decoration: underline;
}

.vs-related-item .excerpt {
    font-size: .76rem;
    color: #767676;
    line-height: 1.4;
    margin-bottom: .6rem;
    min-height: 0 !important;
}

.vs-related-item .price {
    font-size: 1rem;
    font-weight: 700;
    color: #1a1a1a;
    display: block;
}

.vs-related-item .price small {
    display: block;
    font-size: .65rem;
    font-weight: 400;
    color: #767676;
}

@media (max-width: 991px) {
    .vs-related-item {
        flex: 0 0 calc(33.333% - .67rem);
    }
}

@media (max-width: 767px) {
    .vs-related-item {
        flex: 0 0 calc(50% - .5rem);
    }
}

@media (max-width: 480px) {
    .vs-related-item {
        flex: 0 0 85%;
    }
}

.vs-related-outer {
    position: relative;
}

.vs-related-btn {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 10;
    width: 40px;
    height: 72px;
    background: rgba(255, 255, 255, .96);
    border: 1px solid #d5d9d9;
    box-shadow: 0 2px 8px rgba(0, 0, 0, .12);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: #333;
    padding: 0;
    border-radius: 0;
    transition: box-shadow .15s, background .15s;
}

.vs-related-btn--prev {
    left: -8px;
}

.vs-related-btn--next {
    right: -8px;
}

.vs-related-btn:hover:not(:disabled) {
    background: #fff;
    box-shadow: 0 4px 14px rgba(0, 0, 0, .18);
}

.vs-related-btn:disabled {
    opacity: .3;
    cursor: default;
    pointer-events: none;
}

/* ===== RECENSIONI STILE AMAZON ===== */
.vs-reviews-section {
    margin: 0 0 2rem;
}

/* pannello sinistro */
.vs-revs-summary {
    position: sticky;
    top: 112px;
    padding-right: 1.5rem;
}

.vs-revs-main-title {
    font-size: 1.1rem;
    font-weight: 700;
    color: #1a1a1a;
    margin-bottom: .6rem;
}

.vs-revs-score-row {
    display: flex;
    align-items: center;
    gap: .5rem;
    margin-bottom: .25rem;
}

.vs-revs-score-row .vs-revs-stars .icon-star-solid,
.vs-revs-score-row .vs-revs-stars .icon-star-half-solid {
    color: #f5a623;
    font-size: 1.1rem;
}

.vs-revs-score {
    font-size: 1.25rem;
    font-weight: 700;
    color: #1a1a1a;
}

.vs-revs-total {
    font-size: .82rem;
    color: #666;
    margin-bottom: .9rem;
}

/* barre distribuzione */
.vs-revs-bars {
    display: flex;
    flex-direction: column;
    gap: .35rem;
    margin-bottom: 1rem;
}

.vs-revs-bar-row {
    display: flex;
    align-items: center;
    gap: .5rem;
    font-size: .78rem;
}

.vs-revs-bar-label {
    width: 48px;
    color: #333;
    white-space: nowrap;
    font-weight: 500;
    cursor: default;
}

.vs-revs-bar-track {
    flex: 1;
    height: 10px;
    background: #e8e8e8;
    overflow: hidden;
}

.vs-revs-bar-fill {
    height: 100%;
    background: #f5a623;
}

.vs-revs-bar-pct {
    width: 32px;
    text-align: right;
    color: #555;
}

.vs-revs-note {
    font-size: .74rem;
    color: #767676;
    line-height: 1.5;
    border-top: 1px solid #eee;
    padding-top: .75rem;
    margin-top: .25rem;
}

.vs-revs-verified-inline {
    color: #2e7d3a;
    font-weight: 600;
}

/* lista recensioni */
.vs-revs-list-title {
    font-size: .95rem;
    font-weight: 700;
    color: #1a1a1a;
    margin-bottom: .9rem;
    padding-bottom: .6rem;
    border-bottom: 1px solid #e8e8e8;
}

.vs-revs-item {
    position: relative;
    padding: 1rem 0;
    border-bottom: 1px solid #eee;
}

.vs-revs-item:last-child {
    border-bottom: none;
}

/* recensioni nascoste */
.vs-revs-item--hidden {
    display: none;
}

.vs-revs-list--expanded .vs-revs-item--hidden {
    display: block;
}

/* utente */
.vs-revs-user-row {
    display: flex;
    align-items: center;
    gap: .55rem;
    margin-bottom: .45rem;
}

.vs-revs-avatar {
    width: 34px;
    height: 34px;
    border-radius: 50%;
    color: #fff;
    font-size: .82rem;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.vs-revs-username {
    font-size: .84rem;
    font-weight: 700;
    color: #1a1a1a;
}

/* stelle + titolo */
.vs-revs-stars-row {
    display: flex;
    align-items: center;
    gap: .55rem;
    flex-wrap: wrap;
    margin-bottom: .3rem;
}

.vs-revs-stars .icon-star-solid {
    color: #f5a623;
    font-size: .82rem;
}

.vs-revs-title {
    font-size: .88rem;
    font-weight: 700;
    color: #1a1a1a;
}

/* meta: data · formato · verificato */
.vs-revs-meta-row {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: .3rem;
    margin-bottom: .55rem;
    font-size: .76rem;
    color: #767676;
}

.vs-revs-sep {

}

.vs-revs-format {
    color: #767676;
}


.vs-revs-many-badge {
    position: absolute;
    right: 0;
    background: #eee;
    color: #333;
    font-size: .62rem;
    font-weight: 700;
    text-transform: uppercase;
    padding: .1rem .4rem;
    border-radius: 4px;
    letter-spacing: .4px;
    vertical-align: middle;
    margin-left: .3rem;
}

.vs-revs-many-inline {
    color: #767676;
    font-weight: 700;
}

.vs-revs-verified {
    color: #2e7d3a;
    font-weight: 600;
}

/* testo recensione */
.vs-revs-body {
    font-size: .84rem;
    color: #333;
    line-height: 1.65;
    margin-bottom: .5rem;
}

/* utilità */
.vs-revs-helpful {
    font-size: .74rem;
    color: #767676;
    min-height: 1em;
}

/* bottone leggi altre */
.vs-revs-more-btn {
    display: flex;
    align-items: center;
    gap: .4rem;
    margin-top: .75rem;
    padding: .5rem 1rem;
    background: #fff;
    border: 1px solid #e3e3e3;
    color: #1a1a1a;
    font-size: .82rem;
    font-weight: 700;
    font-family: Roboto, sans-serif;
    cursor: pointer;
    border-radius: 8px;
    transition: border-color .15s, background .15s;
    width: 100%;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
}

.vs-revs-more-btn:hover {
    border-color: #005ac8;
    background: #f5f9ff;
}

.vs-revs-more-btn[hidden] {
    display: none;
}

.vs-revs-more-btn {
    position: relative;
}

.vs-revs-more-btn > * {
    transition: opacity 0.2s ease;
}

.vs-revs-more-btn.is-loading {
    cursor: wait;
    pointer-events: none;
}

.vs-revs-more-btn.is-loading > * {
    opacity: 0.55;
}

.vs-revs-more-btn.is-loading::after {
    position: absolute;
    content: "";
    display: inline-block;
    width: 1em;
    height: 1em;
    margin-left: 0.65em;

    border: 2px solid currentColor;
    border-right-color: transparent;
    border-radius: 50%;

    vertical-align: -0.15em;

    animation: vs-revs-spin 0.65s linear infinite;
}

@keyframes vs-revs-spin {
    to {
        transform: rotate(360deg);
    }
}

@media (prefers-reduced-motion: reduce) {
    .vs-revs-more-btn.is-loading::after {
        animation-duration: 1.5s;
    }
}

.vs-revs-more-ico {
    width: 15px;
    height: 15px;
    stroke-width: 2.5;
    transition: transform .2s;
}

@media (max-width: 767px) {
    .vs-revs-summary {
        position: static;
        padding-right: 0;
        margin-bottom: 1.5rem;
        padding-bottom: .5rem;
        border-bottom: 1px solid #e8e8e8;
    }
}

.vs-revs-text {
    margin: 0;
    padding: 0;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    overflow: hidden;
}

.vs-revs-text.is-measuring {
    display: block;
    -webkit-line-clamp: unset;
    overflow: visible;
}

.vs-revs-body.is-expanded .vs-revs-text {
    display: block;
    -webkit-line-clamp: unset;
    overflow: visible;
}

.vs-revs-more {
    display: inline;

    margin: 0;
    padding: 0;
    border: 0;

    background: none;

    color: #8a3a00;
    font-size: inherit;

    text-decoration: none;
    cursor: pointer;
}

.vs-revs-more:hover {
    text-decoration: underline;
}

.vs-revs-body.is-expanded .vs-revs-more {
    display: none;
}

.vs-revs-more[hidden] {
    display: none;
}

/* ===== REVIEW ACTIONS ===== */

.vs-review-actions {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: .4rem 1rem;

    padding-top: .15rem;
}

.vs-review-action {
    display: inline-flex;
    align-items: center;
    gap: .35rem;

    color: #767676;
    font-size: .75rem;
    font-weight: 600;
    line-height: 1.3;

    text-decoration: none;

    transition: color .15s;
}

.vs-review-action:hover {
    color: #005ac8;
    text-decoration: none;
}

.vs-review-action svg {
    width: 15px;
    height: 15px;
    stroke-width: 1.8;
}


/* voto */

.vs-review-vote {
    display: inline-flex;
    align-items: center;
    gap: .35rem;

    margin-left: auto;
}

.vs-review-vote-label {
    margin-right: .15rem;

    color: #767676;
    font-size: .72rem;
}

.vs-review-vote-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    width: 28px;
    height: 28px;
    padding: 0;

    border: 1px solid #dddddd;
    border-radius: 6px;

    background: #fff;
    color: #767676;

    cursor: pointer;

    transition:
        color .15s,
        border-color .15s,
        background .15s;
}

.vs-review-vote-btn svg {
    width: 14px;
    height: 14px;
    stroke-width: 1.8;
}

.vs-review-vote-btn:hover {
    color: #005ac8;
    border-color: #005ac8;
    background: #f5f9ff;
}


/* stato selezionato */

.vs-review-vote-btn.is-active {
    color: #005ac8;
    border-color: #005ac8;
    background: #f5f9ff;
}

.vs-review-vote-btn[data-review-vote="down"].is-active {
    color: #a33a3a;
    border-color: #a33a3a;
    background: #fff6f6;
}


@media (max-width: 575px) {

    .vs-review-vote {
        width: 100%;
        margin-left: 0;
        margin-top: .25rem;
    }

}

/* ===== BROWSE CATEGORIA ===== */
.vs-browse {
    margin: 0 0 1.5rem;
}

.vs-browse-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: .9rem;
}

@media (max-width: 767px) {
    .vs-browse-header {
        flex-direction: column;
    }
}

.vs-browse-label {
    display: flex;
    align-items: center;
    gap: .4rem;
    font-size: .78rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .06em;
    color: #58585a;
}

.vs-browse-label-ico {
    width: 14px;
    height: 14px;
    stroke-width: 2;
    color: #843d00;
}

.vs-browse-all {
    display: flex;
    align-items: center;
    gap: .25rem;
    font-size: .78rem;
    font-weight: 600;
    color: #005ac8;
    text-decoration: none;
}

.vs-browse-all:hover {
    color: #005ac8;
    text-decoration: underline;
}

.vs-browse-all-ico {
    width: 13px;
    height: 13px;
    stroke-width: 2.5;
}

/* contenitore con frecce */
.vs-browse-outer {
    position: relative;
}

/* frecce */
.vs-browse-btn {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 10;
    width: 36px;
    height: 36px;
    border-radius: 7px !important;
    background: rgba(255, 255, 255, .96);
    border: 2px solid #888c8c;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: #333;
    padding: 0;
    border-radius: 0;
    transition: box-shadow .15s, background .15s;
}

.vs-browse-btn--prev {
    left: -8px;
}

.vs-browse-btn--next {
    right: -8px;
}

.vs-browse-btn:hover:not(:disabled) {
    background: #ececec;
}

.vs-browse-btn:disabled {
    opacity: .3;
    cursor: default;
}

/* scroll track */
.vs-browse-scroll {
    display: flex;
    gap: .75rem;
    overflow-x: auto;
    scroll-behavior: smooth;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    padding: .25rem .05rem .5rem;
}

.vs-browse-scroll::-webkit-scrollbar {
    display: none;
}

/* tile */
.vs-browse-tile {
    flex: 0 0 140px;
    scroll-snap-align: start;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: .55rem;
    text-decoration: none;
    color: inherit;
    padding: .75rem .5rem .65rem;
    border: 1px solid #e3e3e3;
    border-radius: 8px;
    background: #fff;
    transition: border-color .15s, box-shadow .15s;
}

.vs-browse-tile:hover {
    border: 1px solid #bcbcbc;
    text-decoration: none;
    color: inherit;
}

.vs-browse-img-wrap {
    width: 90px;
    height: 90px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.vs-browse-img-wrap img {
    width: 90px;
    height: 90px;
    object-fit: contain;
    mix-blend-mode: darken;
}

.vs-browse-name {
    font-size: .73rem;
    font-weight: 600;
    color: #1a1a1a;
    text-align: center;
    line-height: 1.35;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.vs-browse-tile:hover .vs-browse-name {
}

@media (max-width: 575px) {
    .vs-browse-tile {
        flex: 0 0 120px;
    }

    .vs-browse-img-wrap,
    .vs-browse-img-wrap img {
        width: 76px;
        height: 76px;
    }
}

/* ===== ACCORDION INFO (variante sobria) ===== */
.vs-accordion--info .vs-acc-item {
    margin: 1rem 0 0;
    border: 1px solid #d0daea;
    border-left: 3px solid #1a4f8a;
    border-radius: 8px;
    margin-bottom: 0;
}

.vs-accordion--info .vs-acc-trigger {
    background: #f7f9fc;
    color: #1a2d4a;
    font-size: .8rem;
    font-weight: 600;
    gap: .5rem;
    border: 0;
    border-radius: 0;
    padding: .7rem 1rem;
}

.vs-accordion--info .vs-acc-trigger::after {
    color: #1a4f8a;
}

.vs-acc-trigger-ico {
    width: 15px;
    height: 15px;
    stroke-width: 1.8;
    color: #1a4f8a;
    flex-shrink: 0;
}

.vs-accordion--info .vs-acc-panel {
    padding: 0 1rem 1rem;
    background: #f7f9fc;
    border-top: 1px solid #d0daea;
}

/* blocco codici UFI */
.vs-ufi-codes-block {
    padding: .85rem 0 .75rem;
    border-bottom: 1px solid #d0daea;
    margin-bottom: .85rem;
}

.vs-ufi-codes-header {
    display: flex;
    flex-direction: column;
    gap: .1rem;
    margin-bottom: .65rem;
}

.vs-ufi-codes-title {
    font-size: .78rem;
    font-weight: 700;
    color: #1a2d4a;
}

.vs-ufi-codes-reg {
    font-size: .68rem;
    color: #6a7d99;
    letter-spacing: .02em;
}

.vs-ufi-codes-grid {
    margin: 0;
    padding: 0;
    display: table;
    align-items: center;
    border-collapse: separate;
    border-spacing: 1rem .4rem;
}

.vs-ufi-code-item {
    display: table-row;
    align-items: center;
}

.vs-ufi-code-label {
    display: table-cell;
    font-size: .73rem;
    font-weight: 600;
    color: #6a7d99;
    white-space: nowrap;
}

.vs-ufi-code-value {
    display: table-cell;
    font-size: .78rem;
    font-weight: 700;
    color: #1a2d4a;
    letter-spacing: .09em;
    background: #e8edf5;
    padding: .15rem .5rem;
    border: 1px solid #c8d4e8;
    user-select: all;
    cursor: text;
}

/* testo spiegazione */
.vs-ufi-explanation .p {
    font-size: .78rem;
    color: #4a5568;
    line-height: 1.65;
    margin-bottom: .6rem;
}

.vs-ufi-explanation .p:last-child {
    margin-bottom: 0;
}

.vs-ufi-explanation strong {
    color: #1a2d4a;
}

.vs-legacy-modal .modal-footer {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  justify-content: flex-start;

  width: auto;
  margin: 2rem 1rem 0 1rem;
  padding: 0.5rem 0 1rem;
  gap: 0.5rem 0;

  border-top: 1px solid #dee2e6;
}

.vs-legacy-modal .modal-footer > .btn {
  width: 100%;
  margin: 0;
}

.vs-legacy-modal .modal-footer > .btn + .btn {
  margin-top: 0.5rem;
  margin-left: 0;
}

@media (min-width: 576px) {
  .vs-legacy-modal .modal-footer {
    flex-direction: row;
    align-items: center;
    justify-content: flex-end;
  }

  .vs-legacy-modal .modal-footer > .btn {
    width: auto;
  }

  .vs-legacy-modal .modal-footer > .btn + .btn {
    margin-top: 0;
    margin-left: 0.5rem;
  }
}

.vs-legacy-modal .modal-footer > :not(:first-child) {
  margin-left: 0;
}

.vs-legacy-modal .modal-footer > :not(:last-child) {
  margin-right: 0;
}
