/* ============ Bottoni ============ */
.ksm-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    padding: 12px 22px;
    border: 1px solid transparent;
    border-radius: var(--ksm-radius);
    font-family: inherit;
    font-weight: 600;
    font-size: .94rem;
    line-height: 1.2;
    cursor: pointer;
    white-space: nowrap;
    transition: background .2s var(--ksm-ease), color .2s var(--ksm-ease),
                border-color .2s var(--ksm-ease), box-shadow .2s var(--ksm-ease),
                transform .2s var(--ksm-ease);
}

.ksm-btn:active { transform: translateY(1px); }

.ksm-btn .ksm-icon:last-child { transition: transform .2s var(--ksm-ease); }
.ksm-btn:hover .ksm-icon:last-child { transform: translateX(3px); }

.ksm-btn--primary {
    background: var(--ksm-accent);
    color: #fff;
    box-shadow: 0 6px 16px rgba(111, 168, 79, .3);
}

.ksm-btn--primary:hover {
    background: var(--ksm-accent-dark);
    color: #fff;
    box-shadow: 0 10px 22px rgba(111, 168, 79, .36);
}

.ksm-btn--dark {
    background: var(--ksm-dark);
    color: #fff;
}

.ksm-btn--dark:hover { background: var(--ksm-dark-deep); color: #fff; }

.ksm-btn--ghost {
    background: #fff;
    border-color: var(--ksm-line);
    color: var(--ksm-ink);
}

.ksm-btn--ghost:hover {
    border-color: var(--ksm-accent);
    color: var(--ksm-accent-dark);
    box-shadow: var(--ksm-shadow-xs);
}

.ksm-btn--on-dark {
    background: rgba(255, 255, 255, .06);
    border-color: rgba(255, 255, 255, .5);
    color: #fff;
    backdrop-filter: blur(6px);
}

.ksm-btn--on-dark:hover {
    background: rgba(255, 255, 255, .16);
    border-color: #fff;
    color: #fff;
}

.ksm-btn--block { width: 100%; }
.ksm-btn--sm { padding: 8px 15px; font-size: .85rem; }

.ksm-btn:disabled,
.ksm-btn[disabled] {
    opacity: .5;
    cursor: not-allowed;
    box-shadow: none;
}

/* ============ Schede ============ */
.ksm-card {
    position: relative;
    display: flex;
    flex-direction: column;
    background: var(--ksm-surface);
    border: 1px solid var(--ksm-line);
    border-radius: var(--ksm-radius-lg);
    box-shadow: var(--ksm-shadow-xs);
    overflow: hidden;
    transition: transform .28s var(--ksm-ease), box-shadow .28s var(--ksm-ease),
                border-color .28s var(--ksm-ease);
}

.ksm-card:hover {
    transform: translateY(-4px);
    border-color: #D8E3DC;
    box-shadow: var(--ksm-shadow-md);
}

.ksm-card__body { padding: 20px; }

.ksm-card__title {
    font-size: 1.02rem;
    font-weight: 700;
    margin: 0 0 4px;
    color: var(--ksm-ink);
    line-height: 1.3;
}

.ksm-card__title a { color: inherit; }
.ksm-card__title a:hover { color: var(--ksm-accent-dark); }

/* ============ Scheda azienda ============ */
.ksm-company__cover {
    position: relative;
    aspect-ratio: 16 / 9;
    background: linear-gradient(135deg, #DCE6E4 0%, #EFF4F2 55%, #E7EEEA 100%) center/cover no-repeat;
}

.ksm-company__cover::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(22, 35, 43, 0) 45%, rgba(22, 35, 43, .18) 100%);
}

.ksm-card:hover .ksm-company__cover { filter: saturate(1.06); }

.ksm-company__logo {
    position: absolute;
    left: 18px;
    bottom: -28px;
    z-index: 1;
    width: 64px;
    height: 64px;
    border-radius: var(--ksm-radius);
    border: 3px solid #fff;
    background: #fff center/cover no-repeat;
    box-shadow: var(--ksm-shadow);
}

.ksm-company__logo--empty {
    display: grid;
    place-items: center;
    background: var(--ksm-accent-soft);
    color: var(--ksm-accent-dark);
    font-family: var(--ksm-font-display);
    font-weight: 800;
    font-size: 1.55rem;
    line-height: 1;
}

.ksm-company__body {
    padding: 40px 20px 18px;
    display: flex;
    flex-direction: column;
    flex: 1;
}

.ksm-company__head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}

.ksm-company__city {
    display: flex;
    align-items: center;
    gap: 6px;
    margin: 2px 0 0;
    font-size: .86rem;
    color: var(--ksm-muted);
}

.ksm-company__city .ksm-icon { color: var(--ksm-accent); }

.ksm-company__foot {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    margin-top: auto;
    padding-top: 12px;
}

.ksm-company__more {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border-radius: var(--ksm-radius-sm);
    background: var(--ksm-accent-soft);
    color: var(--ksm-accent-dark);
    transition: background .2s var(--ksm-ease), color .2s var(--ksm-ease);
}

.ksm-company__more:hover {
    background: var(--ksm-accent);
    color: #fff;
}

/* ============ Biglietto azienda, negli elenchi ============ */
/* Alto quanto il suo contenuto: a pareggiare le schede di una stessa riga
   ci pensa la griglia, senza lasciare un vuoto in fondo al biglietto. */
.ksm-bizcard {
    min-width: 0;
    padding-bottom: 16px;
}

/* Angolo un filo piu' morbido delle altre schede e ombra a due strati:
   una riga stretta che appoggia il biglietto, un alone largo e leggero. */
.ksm-card.ksm-bizcard {
    border-radius: 20px;
    border-color: var(--ksm-line-soft);
    box-shadow: 0 1px 2px rgba(7, 54, 77, .05), 0 10px 26px rgba(7, 54, 77, .07);
}

.ksm-card.ksm-bizcard:hover {
    border-color: #D8E3DC;
    box-shadow: 0 2px 6px rgba(7, 54, 77, .06), 0 20px 44px rgba(7, 54, 77, .13);
}

/* Senza contatti non ci sono righe accanto a cui mettere l'icona del settore. */
.ksm-bizcard:not(:has(.ksm-bizcard__meta)) { padding-bottom: 46px; }

/* Con una riga sola l'icona arriva all'altezza del luogo: gli fa posto anche lui. */
.ksm-bizcard:has(.ksm-bizcard__meta li:only-child) .ksm-bizcard__place { padding-right: 42px; }

.ksm-bizcard__cover {
    flex: none;
    /* Nella directory il biglietto e' largo al massimo ~400px, accanto al
       menu: un banner 16:9 lo slancia senza diventare mezza scheda. Niente
       formato carta forzato: l'altezza in piu' finirebbe tutta nel banner.
       Il tetto vale per i biglietti a tutta larghezza sui telefoni. */
    aspect-ratio: 16 / 9;
    max-height: 210px;
    background: var(--ksm-line-soft) center / cover no-repeat;
    transition: filter .28s var(--ksm-ease);
}

.ksm-bizcard__cover--plain {
    background: var(--ksm-bands), var(--ksm-stripes), var(--ksm-gradient-brand);
}

.ksm-card:hover .ksm-bizcard__cover { filter: saturate(1.06); }

.ksm-bizcard__top {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 10px;
    margin-top: -24px;
    padding: 0 16px;
}

.ksm-bizcard__logo {
    flex: none;
    width: 56px;
    height: 56px;
    border-radius: 50%;
    border: 3px solid #fff;
    box-shadow: var(--ksm-shadow);
    background: #fff center / contain no-repeat;
}

.ksm-bizcard__logo--empty {
    display: grid;
    place-items: center;
    background: var(--ksm-accent-soft);
    color: var(--ksm-accent-dark);
    font-family: var(--ksm-font-display);
    font-weight: 800;
    font-size: 1.35rem;
    line-height: 1;
}

.ksm-bizcard__rating {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding-bottom: 2px;
    font-size: .8rem;
    color: var(--ksm-muted);
}

.ksm-bizcard__id {
    min-width: 0;
    padding: 8px 16px 0;
}

.ksm-bizcard__name {
    margin: 0;
    font-size: 1.02rem;
    font-weight: 700;
    line-height: 1.25;
    color: var(--ksm-ink);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.ksm-bizcard__name a { color: inherit; }
.ksm-bizcard__name a:hover { color: var(--ksm-accent-dark); }

/* Tutto il biglietto porta alla scheda; email, telefono e sito restano cliccabili. */
.ksm-bizcard__name a::after {
    content: "";
    position: absolute;
    inset: 0;
}

.ksm-bizcard__meta a { position: relative; z-index: 1; }

.ksm-bizcard__place {
    margin: 3px 0 0;
    font-size: .86rem;
    color: var(--ksm-muted);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Doppia classe: `.ksm-meta`, definita piu' sotto, altrimenti vincerebbe. */
.ksm-bizcard .ksm-bizcard__meta {
    margin: 10px 0 0;
    padding: 0 16px;
    font-size: .875rem;
}

/* I contatti sono il contenuto del biglietto: respirano loro lo spazio
   che il banner non si prende piu'. */
.ksm-bizcard .ksm-bizcard__meta li { min-width: 0; gap: 8px; margin-bottom: 7px; line-height: 1.4; }
.ksm-bizcard .ksm-bizcard__meta li:last-child { margin-bottom: 0; }

/* L'icona del settore sta accanto alle ultime righe, non sotto: sono loro
   a farle posto, cosi' il biglietto non porta una fascia vuota in fondo. */
.ksm-bizcard .ksm-bizcard__meta li:last-child,
.ksm-bizcard .ksm-bizcard__meta li:nth-last-child(2) { padding-right: 42px; }
.ksm-bizcard .ksm-bizcard__meta .ksm-icon { flex: none; color: var(--ksm-accent); }

.ksm-bizcard .ksm-bizcard__meta li > span,
.ksm-bizcard .ksm-bizcard__meta li > a {
    min-width: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Il settore dell'azienda, in basso a destra. */
.ksm-bizcard__sector {
    position: absolute;
    right: 12px;
    bottom: 12px;
    display: grid;
    place-items: center;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: var(--ksm-accent-soft);
    color: var(--ksm-accent-dark);
    transition: background .2s var(--ksm-ease), color .2s var(--ksm-ease);
}

.ksm-card:hover .ksm-bizcard__sector {
    background: var(--ksm-accent);
    color: #fff;
}

.ksm-meta {
    list-style: none;
    margin: 14px 0 0;
    padding: 0;
    font-size: .86rem;
}

.ksm-meta li {
    display: flex;
    gap: 9px;
    align-items: center;
    margin-bottom: 7px;
    color: var(--ksm-body);
    min-width: 0;
}

.ksm-meta li > span,
.ksm-meta li > a {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.ksm-meta .ksm-icon { flex: none; color: var(--ksm-accent); }

/* ============ Valutazione ============ */
.ksm-rating {
    display: inline-flex;
    align-items: center;
    gap: 2px;
    flex: none;
    font-size: .78rem;
    color: var(--ksm-muted);
}

.ksm-rating__star { color: #DCE3E7; font-size: .95rem; line-height: 1; }
.ksm-rating__star--on { color: #F0B429; }
.ksm-rating__value { margin-left: 5px; font-weight: 600; }

/* ============ Scheda prodotto ============ */
.ksm-product {
    flex-direction: row;
    gap: 16px;
    align-items: center;
    padding: 16px;
}

.ksm-product__thumb {
    width: 92px;
    height: 82px;
    flex: 0 0 92px;
    border-radius: var(--ksm-radius);
    background: var(--ksm-canvas) center/cover no-repeat;
    border: 1px solid var(--ksm-line-soft);
}

.ksm-product__thumb--empty {
    display: grid;
    place-items: center;
    background: var(--ksm-line-soft);
    color: var(--ksm-muted);
}

.ksm-product__body { flex: 1; min-width: 0; }

.ksm-product__body .ksm-card__title {
    font-size: .97rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.ksm-product__company {
    margin: 0 0 8px;
    font-size: .82rem;
    color: var(--ksm-muted);
}

.ksm-product__price {
    font-family: var(--ksm-font-display);
    font-weight: 800;
    font-size: 1.08rem;
    color: var(--ksm-ink);
}

.ksm-product__prices {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 2px 8px;
}

.ksm-product__old {
    font-size: .84rem;
    color: var(--ksm-muted);
}

.ksm-product__tags {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 6px;
}

/* Sul telefono foto, testo e pulsante in riga non ci stanno: il pulsante va sotto, largo. */
@media (max-width: 560px) {
    .ksm-product { flex-wrap: wrap; }
    .ksm-product > form { flex: 1 0 100%; }
    .ksm-product > form .ksm-btn { width: 100%; justify-content: center; }
}

/* ============ Etichette ============ */
.ksm-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 11px;
    border-radius: var(--ksm-radius-pill);
    font-size: .74rem;
    font-weight: 600;
    letter-spacing: .01em;
    background: var(--ksm-accent-soft);
    color: var(--ksm-accent-dark);
}

.ksm-badge--muted {
    background: var(--ksm-line-soft);
    color: var(--ksm-body);
}

/* ============ Moduli ============ */
.ksm-field { margin-bottom: 18px; }

.ksm-label {
    display: block;
    font-size: .82rem;
    font-weight: 600;
    color: var(--ksm-dark);
    margin-bottom: 7px;
}

.ksm-input,
.ksm-select,
.ksm-textarea {
    width: 100%;
    padding: 12px 15px;
    border: 1px solid var(--ksm-line);
    border-radius: var(--ksm-radius);
    font: inherit;
    color: var(--ksm-ink);
    background: #fff;
    transition: border-color .18s var(--ksm-ease), box-shadow .18s var(--ksm-ease);
}

.ksm-input:focus,
.ksm-select:focus,
.ksm-textarea:focus {
    outline: none;
    border-color: var(--ksm-accent);
    box-shadow: var(--ksm-ring);
}

.ksm-error {
    display: block;
    margin-top: 6px;
    font-size: .8rem;
    color: var(--ksm-danger);
}

/* ============ Avvisi ============ */
.ksm-alert {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 13px 17px;
    border-radius: var(--ksm-radius);
    margin-bottom: 18px;
    font-size: .92rem;
    border: 1px solid transparent;
}

.ksm-alert--success {
    background: var(--ksm-accent-soft);
    border-color: #D3E7C6;
    color: var(--ksm-accent-dark);
}

.ksm-alert--error {
    background: #FDECEC;
    border-color: #F7CFD1;
    color: var(--ksm-danger);
}

.ksm-alert--info {
    background: #EDF3F7;
    border-color: #CFE0EA;
    color: var(--ksm-dark);
}

/* ============ Tabelle ============ */
.ksm-table {
    width: 100%;
    border-collapse: collapse;
    background: #fff;
    font-size: .92rem;
}

.ksm-table th,
.ksm-table td {
    padding: 13px 16px;
    text-align: left;
    border-bottom: 1px solid var(--ksm-line);
}

.ksm-table th {
    font-size: .76rem;
    text-transform: uppercase;
    letter-spacing: .06em;
    color: var(--ksm-muted);
    background: var(--ksm-line-soft);
}

.ksm-table tbody tr:last-child td { border-bottom: 0; }
.ksm-table tbody tr:hover { background: var(--ksm-line-soft); }

.ksm-table-wrap {
    overflow-x: auto;
    border: 1px solid var(--ksm-line);
    border-radius: var(--ksm-radius-lg);
    box-shadow: var(--ksm-shadow-xs);
}

/*
 * Sul telefono una tabella stretta alla larghezza dello schermo spezza email
 * e numeri lettera per lettera: meglio una larghezza minima e scorrere di lato
 * dentro il riquadro, che lo permette gia'.
 */
@media (max-width: 760px) {
    .ksm-table-wrap > .ksm-table { min-width: 620px; }
    .ksm-table-wrap > .ksm-table th,
    .ksm-table-wrap > .ksm-table td { padding: 11px 12px; }
    .ksm-table .ksm-input { min-width: 110px; }
}

/* ============ Banner pubblicitari ============ */
.ksm-banner {
    display: block;
    border-radius: var(--ksm-radius-lg);
    overflow: hidden;
    box-shadow: var(--ksm-shadow-xs);
    transition: transform .28s var(--ksm-ease), box-shadow .28s var(--ksm-ease);
}

.ksm-banner:hover {
    transform: translateY(-3px);
    box-shadow: var(--ksm-shadow-md);
}

/* Circuito banner ------------------------------------------------------- */

.ksm-ad {
    margin-block: 24px;
    text-align: center;
}

.ksm-ad a {
    display: inline-block;
    max-width: 100%;
}

.ksm-ad img {
    display: block;
    max-width: 100%;
    height: auto;
    border-radius: var(--ksm-radius);
}

.ksm-ad__label {
    display: block;
    margin-top: 4px;
    font-size: .7rem;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--ksm-muted);
}

.ksm-ad-popup {
    max-width: min(92vw, 560px);
    padding: 14px;
    border: 0;
    border-radius: 14px;
    box-shadow: 0 24px 60px rgba(7, 30, 45, .28);
}

.ksm-ad-popup::backdrop {
    background: rgba(7, 30, 45, .55);
}

.ksm-ad-popup img {
    display: block;
    max-width: 100%;
    height: auto;
    border-radius: 10px;
}

.ksm-ad-popup__close {
    position: absolute;
    top: 6px;
    right: 6px;
    margin: 0;
}

.ksm-ad-popup__close button {
    width: 34px;
    height: 34px;
    border: 0;
    border-radius: 50%;
    background: #fff;
    font-size: 1.4rem;
    line-height: 1;
    cursor: pointer;
    box-shadow: 0 2px 8px rgba(0, 0, 0, .2);
}

/* Testo formattato di descrizioni e pagine ------------------------------ */

.ksm-richtext { margin-top: 16px; }
.ksm-richtext > :first-child { margin-top: 0; }
.ksm-richtext > :last-child { margin-bottom: 0; }
.ksm-richtext a { text-decoration: underline; }

/* ============ Paginazione ============ */
.ksm-pagination {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 8px;
}

.ksm-pagination__pages {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 6px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.ksm-pagination__step,
.ksm-pagination__page {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    min-width: 40px;
    height: 40px;
    padding: 0 12px;
    border: 1px solid var(--ksm-line);
    border-radius: var(--ksm-radius-sm);
    background: var(--ksm-surface);
    color: var(--ksm-ink);
    font-size: .9rem;
    font-weight: 600;
    line-height: 1;
    transition: border-color .2s var(--ksm-ease), color .2s var(--ksm-ease), background .2s var(--ksm-ease);
}

a.ksm-pagination__step:hover,
a.ksm-pagination__page:hover {
    border-color: var(--ksm-accent);
    color: var(--ksm-accent-dark);
}

.ksm-pagination__page.is-current {
    border-color: var(--ksm-accent);
    background: var(--ksm-accent);
    color: #fff;
}

.ksm-pagination__step.is-disabled { color: var(--ksm-muted); opacity: .6; }

.ksm-pagination__gap {
    display: inline-flex;
    align-items: center;
    height: 40px;
    padding: 0 2px;
    color: var(--ksm-muted);
}

.ksm-pagination__back { transform: scaleX(-1); }

/* Sul telefono restano precedente e successiva: i numeri andrebbero a capo. */
@media (max-width: 560px) {
    .ksm-pagination__pages { display: none; }
}

/* ============ Directory aziende: caricamento continuo ============ */
.ksm-directory__container { max-width: none; }

/* Menu delle categorie a sinistra, ricerca e biglietti a destra. */
.ksm-directory {
    display: grid;
    grid-template-columns: 280px minmax(0, 1fr);
    gap: 28px;
    align-items: start;
}

.ksm-directory__main { min-width: 0; }

.ksm-dirnav {
    position: sticky;
    top: 24px;
    max-height: calc(100vh - 48px);
    overflow-y: auto;
    padding: 8px;
    background: var(--ksm-surface);
    border: 1px solid var(--ksm-line-soft);
    border-radius: 20px;
    box-shadow: 0 1px 2px rgba(7, 54, 77, .05), 0 10px 26px rgba(7, 54, 77, .07);
    overscroll-behavior: contain;
}

.ksm-dirnav__title {
    margin: 0;
    padding: 12px 12px 8px;
    font-size: .74rem;
    font-weight: 700;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: var(--ksm-muted);
}

.ksm-dirnav__list {
    list-style: none;
    margin: 0;
    padding: 0;
}

.ksm-dirnav__list--nested {
    margin: 2px 0 6px 12px;
    padding-left: 8px;
    border-left: 2px solid var(--ksm-line-soft);
}

.ksm-dirnav__item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 9px 12px;
    border-radius: var(--ksm-radius);
    font-size: .92rem;
    font-weight: 500;
    line-height: 1.3;
    color: var(--ksm-ink);
    cursor: pointer;
    list-style: none;
    transition: background .15s var(--ksm-ease), color .15s var(--ksm-ease);
}

.ksm-dirnav__item::-webkit-details-marker { display: none; }

.ksm-dirnav__item:hover { background: var(--ksm-canvas); color: var(--ksm-accent-dark); }

.ksm-dirnav__list--nested .ksm-dirnav__item {
    padding-block: 7px;
    font-size: .875rem;
    color: var(--ksm-body);
}

.ksm-dirnav__item.is-current,
.ksm-dirnav__list--nested .ksm-dirnav__item.is-current {
    background: var(--ksm-accent-soft);
    color: var(--ksm-accent-dark);
    font-weight: 600;
}

.ksm-dirnav__all { font-weight: 600; }

.ksm-dirnav__group > summary .ksm-icon {
    flex: none;
    color: var(--ksm-muted);
    transition: transform .2s var(--ksm-ease);
}

.ksm-dirnav__group[open] > summary .ksm-icon { transform: rotate(180deg); }

.ksm-dirnav__item:focus-visible { outline: none; box-shadow: var(--ksm-ring); }

/* Ricerca: la categoria si sceglie dal menu, la tendina serve solo senza. */
.ksm-directory__search {
    display: grid;
    grid-template-columns: minmax(0, 2fr) minmax(0, 1fr) auto;
    align-items: end;
    gap: 16px;
    margin-bottom: 24px;
    padding: 16px;
}

.ksm-directory__search .ksm-field { margin: 0; }
.ksm-directory__category { display: none; }

.ksm-directory__main > .ksm-ad:first-of-type { margin-top: 0; }

/* Quattro biglietti per riga accanto al menu: stretti e slanciati, non tozzi.
   Si scende a tre quando quattro starebbero sotto i ~250px l'uno. */
.ksm-directory__grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }

@media (max-width: 1439px) {
    .ksm-directory__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 860px) {
    .ksm-directory__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 991px) {
    .ksm-directory { grid-template-columns: minmax(0, 1fr); }
    .ksm-dirnav { display: none; }

    .ksm-directory__search { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
    .ksm-directory__query { grid-column: 1 / -1; }
    .ksm-directory__category { display: block; }
    .ksm-directory__search .ksm-btn { grid-column: 1 / -1; }
}

@media (max-width: 560px) {
    .ksm-directory__search { grid-template-columns: minmax(0, 1fr); }
    .ksm-directory__grid { grid-template-columns: minmax(0, 1fr); }
}

.ksm-directory__more {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
    min-height: 1px;
    margin-top: 28px;
}

/* Con il caricamento continuo attivo la paginazione non serve. */
.ksm-directory__more.is-live [data-directory-pager] { display: none; }

.ksm-directory__status,
.ksm-directory__retry { display: none; }

.ksm-directory__more.is-loading .ksm-directory__status {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    font-size: .9rem;
    color: var(--ksm-muted);
}

.ksm-directory__more.is-failed .ksm-directory__retry { display: inline-flex; }

.ksm-directory__spinner {
    width: 18px;
    height: 18px;
    border: 2px solid var(--ksm-line);
    border-top-color: var(--ksm-accent);
    border-radius: 50%;
    animation: ksm-spin .8s linear infinite;
}

@keyframes ksm-spin { to { transform: rotate(360deg); } }

@media (prefers-reduced-motion: reduce) {
    .ksm-directory__spinner { animation-duration: 2.4s; }
}

/* ============ Biglietto compatto: biglietto da visita e anagrafica ============ */
/* Senza pagina dedicata: niente banner ne' formato carta, la scheda e' alta
   quanto il suo contenuto e non porta da nessuna parte. */
.ksm-bizcard--compact {
    padding-top: 14px;
}

.ksm-bizcard--compact .ksm-bizcard__top {
    align-items: flex-start;
    margin-top: 0;
}

.ksm-bizcard--compact .ksm-bizcard__rating { padding: 2px 0 0; }

.ksm-bizcard--compact .ksm-bizcard__logo--empty {
    background: var(--ksm-line-soft);
    color: var(--ksm-ink);
}

/* Non e' un link: al passaggio del mouse non si solleva. */
.ksm-bizcard--compact:hover {
    transform: none;
    border-color: var(--ksm-line);
    box-shadow: var(--ksm-shadow-xs);
}

.ksm-card.ksm-bizcard--compact:hover .ksm-bizcard__sector {
    background: var(--ksm-accent-soft);
    color: var(--ksm-accent-dark);
}

/* ============ Accesso dentro l'acquisto ============ */
/* Il modulo che compare nel carrello e alla cassa quando si compra da ospiti. */
.ksm-inline-auth {
    padding: 24px;
    height: fit-content;
}

.ksm-inline-auth:hover {
    transform: none;
    border-color: var(--ksm-line);
    box-shadow: var(--ksm-shadow-xs);
}

.ksm-inline-auth__title {
    font-size: 1.25rem;
    margin: 0 0 6px;
}

.ksm-inline-auth__lead {
    margin: 0 0 18px;
    font-size: .92rem;
}

.ksm-inline-auth__tabs {
    display: flex;
    gap: 6px;
    padding: 4px;
    margin-bottom: 20px;
    background: var(--ksm-line-soft);
    border-radius: var(--ksm-radius);
}

.ksm-inline-auth__tab {
    flex: 1;
    padding: 9px 12px;
    border-radius: calc(var(--ksm-radius) - 3px);
    text-align: center;
    font-size: .88rem;
    font-weight: 600;
    color: var(--ksm-body);
    text-decoration: none;
    transition: background .18s var(--ksm-ease), color .18s var(--ksm-ease);
}

.ksm-inline-auth__tab:hover { color: var(--ksm-dark); }

.ksm-inline-auth__tab.is-active {
    background: var(--ksm-surface);
    color: var(--ksm-dark);
    box-shadow: var(--ksm-shadow-xs);
}

.ksm-inline-auth__row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
}

.ksm-inline-auth__remember {
    display: flex;
    gap: 8px;
    align-items: center;
    margin-bottom: 18px;
    font-size: .9rem;
}

.ksm-inline-auth__note {
    margin: 14px 0 0;
    text-align: center;
    font-size: .85rem;
}

@media (max-width: 560px) {
    .ksm-inline-auth__row { grid-template-columns: 1fr; gap: 0; }
}

/* Nel carrello il modulo sta sotto la tabella, stretto e centrato. */
.ksm-cart-auth {
    max-width: 520px;
    margin: 28px auto 0;
}

/* Carrelli per venditore: schede sopra la tabella, quella in corso evidenziata. */
.ksm-cart-vendors {
    margin: 0 0 24px;
    padding: 18px;
    border: 1px solid var(--ksm-line);
    border-radius: var(--ksm-radius-lg);
    background: var(--ksm-surface);
    box-shadow: var(--ksm-shadow-xs);
}
.ksm-cart-vendors__intro { margin: 0 0 14px; color: var(--ksm-body); }
.ksm-cart-vendors__intro strong { color: var(--ksm-ink); }
.ksm-cart-vendors__single { margin: -8px 0 18px; color: var(--ksm-body); }
.ksm-cart-vendors__list {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
    gap: 12px;
    margin: 0;
    padding: 0;
    list-style: none;
}
.ksm-cart-vendor {
    position: relative;
    display: flex;
    border: 2px solid var(--ksm-line);
    border-radius: var(--ksm-radius);
    background: var(--ksm-canvas);
    transition: border-color .15s var(--ksm-ease), box-shadow .15s var(--ksm-ease);
}
.ksm-cart-vendor form:first-child { flex: 1; min-width: 0; }
.ksm-cart-vendor__main {
    display: flex;
    flex-direction: column;
    gap: 2px;
    width: 100%;
    padding: 12px 40px 12px 14px;
    border: 0;
    background: none;
    color: inherit;
    font: inherit;
    text-align: left;
    cursor: pointer;
}
.ksm-cart-vendor.is-active .ksm-cart-vendor__main { cursor: default; }
.ksm-cart-vendor:not(.is-active):hover { border-color: var(--ksm-accent); box-shadow: var(--ksm-shadow); }
.ksm-cart-vendor__main:focus-visible { outline: none; box-shadow: var(--ksm-ring); border-radius: var(--ksm-radius); }
.ksm-cart-vendor__state { font-size: .78rem; font-weight: 600; color: var(--ksm-accent-dark); }
.ksm-cart-vendor__name { color: var(--ksm-ink); font-size: 1.02rem; overflow-wrap: anywhere; }
.ksm-cart-vendor__meta { font-size: .88rem; color: var(--ksm-muted); }
.ksm-cart-vendor.is-active { border-color: var(--ksm-accent); background: var(--ksm-accent-soft); }
.ksm-cart-vendor.is-active .ksm-cart-vendor__state { color: var(--ksm-accent-dark); text-transform: uppercase; letter-spacing: .04em; }
.ksm-cart-vendor__remove {
    position: absolute;
    top: 8px;
    right: 8px;
    width: 28px;
    height: 28px;
    border: 0;
    border-radius: var(--ksm-radius-pill);
    background: transparent;
    color: var(--ksm-muted);
    font-size: 1.25rem;
    line-height: 1;
    cursor: pointer;
}
.ksm-cart-vendor__remove:hover { background: #fdecec; color: var(--ksm-danger); }

/* ============ Piani ============ */
.ksm-plan {
    position: relative;
    display: flex;
    flex-direction: column;
    height: 100%;
    padding: 30px 26px 26px;
    background: var(--ksm-surface);
    border: 1px solid var(--ksm-line);
    border-radius: var(--ksm-radius-xl);
    box-shadow: var(--ksm-shadow);
    transition: transform .28s var(--ksm-ease), box-shadow .28s var(--ksm-ease), border-color .28s var(--ksm-ease);
}

.ksm-plan:hover { transform: translateY(-4px); box-shadow: var(--ksm-shadow-md); border-color: #D2E2D6; }

.ksm-plan--selected { border-color: var(--ksm-accent); box-shadow: var(--ksm-ring), var(--ksm-shadow-md); }

.ksm-plan__badge {
    position: absolute;
    top: -13px;
    left: 26px;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 5px 12px;
    border-radius: var(--ksm-radius-pill);
    background: var(--ksm-gradient-accent);
    color: #fff;
    font-size: .72rem;
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
    box-shadow: 0 6px 14px rgba(81, 165, 44, .35);
}

.ksm-plan__badge .ksm-icon { fill: currentColor; }

.ksm-plan__name {
    margin: 0;
    font-family: var(--ksm-font-display);
    font-size: 1.2rem;
    font-weight: 800;
    color: var(--ksm-dark);
}

.ksm-plan__desc {
    margin: 8px 0 0;
    min-height: 2.9em;
    color: var(--ksm-muted);
    font-size: .92rem;
    line-height: 1.45;
}

.ksm-plan__price {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin: 22px 0 0;
    padding-bottom: 22px;
    border-bottom: 1px solid var(--ksm-line-soft);
}

.ksm-plan__price strong {
    font-family: var(--ksm-font-display);
    font-size: 2.15rem;
    font-weight: 800;
    line-height: 1;
    letter-spacing: -.02em;
    color: var(--ksm-ink);
    white-space: nowrap;
}

.ksm-plan__price span { color: var(--ksm-muted); font-size: .9rem; font-weight: 500; white-space: nowrap; }

.ksm-plan__label {
    margin: 22px 0 12px;
    font-size: .72rem;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--ksm-muted);
}

.ksm-plan__features {
    display: grid;
    gap: 11px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.ksm-plan__features li {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    font-size: .94rem;
    line-height: 1.4;
    color: var(--ksm-body);
}

.ksm-plan__features .ksm-icon {
    flex: none;
    width: 20px;
    height: 20px;
    padding: 3px;
    border-radius: 50%;
    background: var(--ksm-accent-soft);
    color: var(--ksm-accent-dark);
    stroke-width: 2.4;
}

.ksm-plan__action { margin-top: auto; padding-top: 28px; }
.ksm-plan__action .ksm-btn .ksm-icon { margin-left: auto; }
.ksm-plan__action .ksm-btn { justify-content: space-between; padding-block: 14px; }

/* Il piano in evidenza: scheda scura */
.ksm-plan--featured {
    background: var(--ksm-gradient-brand);
    border-color: transparent;
    box-shadow: var(--ksm-shadow-lg);
}

.ksm-plan--featured:hover { border-color: transparent; box-shadow: 0 30px 70px rgba(7, 54, 77, .24); }
.ksm-plan--featured .ksm-plan__name,
.ksm-plan--featured .ksm-plan__price strong { color: #fff; }
.ksm-plan--featured .ksm-plan__desc,
.ksm-plan--featured .ksm-plan__price span,
.ksm-plan--featured .ksm-plan__label { color: rgba(255, 255, 255, .68); }
.ksm-plan--featured .ksm-plan__price { border-color: rgba(255, 255, 255, .14); }
.ksm-plan--featured .ksm-plan__features li { color: rgba(255, 255, 255, .92); }
.ksm-plan--featured .ksm-plan__features .ksm-icon { background: rgba(111, 191, 69, .22); color: var(--ksm-accent-light); }

/* ============ Pagina piani ============ */
.ksm-plans-hero {
    position: relative;
    padding: 72px 0 132px;
    background: var(--ksm-gradient-brand);
    color: #fff;
    text-align: center;
    overflow: hidden;
}

.ksm-plans-hero::before {
    content: "";
    position: absolute;
    inset: 0;
    background: radial-gradient(circle at 15% 20%, rgba(111, 191, 69, .22), transparent 42%),
                radial-gradient(circle at 88% 90%, rgba(255, 255, 255, .08), transparent 40%);
    pointer-events: none;
}

.ksm-plans-hero .ksm-container { position: relative; }

.ksm-plans-hero__eyebrow {
    display: inline-block;
    margin: 0 0 14px;
    padding: 6px 14px;
    border: 1px solid rgba(255, 255, 255, .22);
    border-radius: var(--ksm-radius-pill);
    font-size: .74rem;
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--ksm-accent-light);
}

.ksm-plans-hero h1 {
    max-width: 760px;
    margin: 0 auto;
    font-family: var(--ksm-font-display);
    font-size: clamp(1.9rem, 4vw, 2.9rem);
    font-weight: 800;
    line-height: 1.12;
    letter-spacing: -.02em;
    color: #fff;
}

.ksm-plans-hero__lead {
    max-width: 560px;
    margin: 16px auto 0;
    font-size: 1.08rem;
    color: rgba(255, 255, 255, .78);
}

.ksm-plans-hero__notes {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 10px 28px;
    margin: 28px 0 0;
    padding: 0;
    list-style: none;
    font-size: .9rem;
    color: rgba(255, 255, 255, .85);
}

.ksm-plans-hero__notes li { display: inline-flex; align-items: center; gap: 8px; }
.ksm-plans-hero__notes .ksm-icon { color: var(--ksm-accent-light); }

.ksm-plans { padding: 0 0 80px; }

.ksm-plans__grid {
    display: grid;
    grid-template-columns: repeat(var(--plans, 4), minmax(0, 1fr));
    gap: 22px;
    align-items: stretch;
    margin-top: -84px;
    position: relative;
}

.ksm-plans__empty {
    margin: -60px auto 0;
    max-width: 520px;
    padding: 28px;
    border-radius: var(--ksm-radius-lg);
    background: var(--ksm-surface);
    box-shadow: var(--ksm-shadow);
    text-align: center;
    color: var(--ksm-muted);
    position: relative;
}

.ksm-plans__steps {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 22px;
    margin: 64px 0 0;
    padding: 32px;
    list-style: none;
    border: 1px solid var(--ksm-line);
    border-radius: var(--ksm-radius-xl);
    background: var(--ksm-surface);
}

.ksm-plans__steps li { display: flex; gap: 16px; align-items: flex-start; }

.ksm-plans__steps li > span {
    flex: none;
    display: grid;
    place-items: center;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: var(--ksm-accent-soft);
    color: var(--ksm-accent-dark);
    font-family: var(--ksm-font-display);
    font-weight: 800;
}

.ksm-plans__steps strong { display: block; color: var(--ksm-dark); font-size: 1rem; }
.ksm-plans__steps p { margin: 4px 0 0; color: var(--ksm-muted); font-size: .9rem; line-height: 1.45; }

@media (max-width: 1100px) {
    .ksm-plans__grid { grid-template-columns: repeat(min(var(--plans, 4), 2), minmax(0, 1fr)); row-gap: 34px; }
}

@media (max-width: 680px) {
    .ksm-plans-hero { padding: 52px 0 108px; }
    .ksm-plans__grid { grid-template-columns: 1fr; }
    .ksm-plans__steps { grid-template-columns: 1fr; padding: 24px; }
    .ksm-plan { padding: 28px 22px 22px; }
}

/* Voci che il piano non comprende: X rossa e testo spento */
.ksm-plan__features li.is-missing { color: var(--ksm-muted); }
.ksm-plan__features li.is-missing .ksm-icon { background: #FDECEC; color: var(--ksm-danger); }
.ksm-plan__features li.is-missing > span { text-decoration: line-through; text-decoration-color: rgba(127, 145, 157, .45); }

.ksm-sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip-path: inset(50%);
    white-space: nowrap;
}