:root {
    --bg: #f3f0ea;
    --surface: #fff;
    --text: #14120f;
    --muted: #5a554d;
    --accent: #0c5c52;
    --accent-hover: #08443c;
    --accent-soft: rgba(12, 92, 82, 0.12);
    --border: #e4dfd6;
    --danger: #b42318;
    --radius: 12px;
    --radius-lg: 18px;
    --font: "DM Sans", system-ui, sans-serif;
    --font-display: "Instrument Serif", Georgia, serif;
    --shadow-sm: 0 1px 2px rgba(20, 18, 15, 0.06);
    --shadow-md: 0 8px 24px rgba(20, 18, 15, 0.08);
}

* {
    box-sizing: border-box;
}

body {
    margin: 0;
    font-family: var(--font);
    background: var(--bg);
    color: var(--text);
    line-height: 1.5;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}

.container {
    width: min(1100px, 92vw);
    margin: 0 auto;
}

.site-header {
    background: rgba(255, 255, 255, 0.88);
    backdrop-filter: blur(10px);
    border-bottom: 1px solid var(--border);
    position: sticky;
    top: 0;
    z-index: 100;
}

.header-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1rem 0;
    gap: 1rem;
    flex-wrap: wrap;
}

.logo {
    font-weight: 700;
    font-size: 1.05rem;
    letter-spacing: -0.02em;
    color: var(--text);
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
}

.logo-mark {
    width: 2rem;
    height: 2rem;
    border-radius: 8px;
    background: linear-gradient(135deg, var(--accent) 0%, #1a7d6e 100%);
    box-shadow: 0 2px 8px rgba(12, 92, 82, 0.35);
}

.nav {
    display: flex;
    align-items: center;
    gap: 1.25rem;
    flex-wrap: wrap;
}

.nav a {
    color: var(--text);
    text-decoration: none;
    font-size: 0.95rem;
}

.nav a:hover {
    color: var(--accent);
}

.nav-user {
    font-size: 0.85rem;
    color: var(--muted);
}

/* Header compatto area admin: niente menu pubblico né hamburger */
.site-header--admin-shell .header-inner--admin-shell {
    flex-wrap: nowrap;
}
@media (max-width: 640px) {
    .site-header--admin-shell .header-inner--admin-shell {
        flex-wrap: wrap;
    }
}
.logo__suffix {
    font-size: 0.68rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    padding: 0.2rem 0.45rem;
    border-radius: 6px;
    background: var(--accent-soft);
    color: var(--accent-hover);
}
.header-admin-shell__actions {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    flex-wrap: wrap;
    margin-left: auto;
}
.header-admin-shell__user {
    max-width: 14rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.main-content {
    flex: 1;
    padding: 2rem 0 3rem;
}

.main-content--fluid {
    padding: 0 0 0;
    width: 100%;
}

.site-footer {
    background: #1c1a17;
    color: #c9c4bc;
    border-top: none;
    padding: 2.5rem 0 0;
    font-size: 0.9rem;
}

.site-footer a {
    color: #e8e4dc;
    text-decoration: none;
}

.site-footer a:hover {
    color: #fff;
}

.footer-grid {
    display: grid;
    gap: 2rem;
    padding-bottom: 2rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

@media (min-width: 640px) {
    .footer-grid.footer-grid--menus-1 {
        grid-template-columns: 2fr 1fr;
    }
    .footer-grid.footer-grid--menus-2 {
        grid-template-columns: 2fr 1fr 1fr;
    }
    .footer-grid.footer-grid--menus-3 {
        grid-template-columns: 2fr 1fr 1fr 1fr;
    }
    .footer-grid.footer-grid--menus-4 {
        grid-template-columns: 2fr 1fr 1fr 1fr 1fr;
    }
}

.footer-brand p {
    margin: 0.75rem 0 0;
    max-width: 22rem;
    line-height: 1.55;
    opacity: 0.9;
}

.footer-heading {
    display: block;
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #8a8580;
    margin-bottom: 0.75rem;
}

.footer-links {
    list-style: none;
    margin: 0;
    padding: 0;
}

.footer-links li {
    margin-bottom: 0.5rem;
}

.footer-bottom {
    padding: 1rem 0 1.75rem;
    font-size: 0.8rem;
    opacity: 0.75;
}

h1 {
    font-size: clamp(1.75rem, 4vw, 2.25rem);
    font-weight: 700;
    margin: 0 0 0.5rem;
}

.lead {
    color: var(--muted);
    font-size: 1.05rem;
    max-width: 36rem;
    margin: 0 0 2rem;
}

.grid {
    display: grid;
    gap: 1.25rem;
}

@media (min-width: 640px) {
    .grid-2 {
        grid-template-columns: repeat(2, 1fr);
    }
    .grid-3 {
        grid-template-columns: repeat(3, 1fr);
    }
}

.card {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: var(--radius);
    padding: 1.25rem;
    text-decoration: none;
    color: inherit;
    display: block;
    transition: border-color 0.15s, box-shadow 0.15s;
}

a.card:hover {
    border-color: var(--accent);
    box-shadow: 0 4px 14px rgba(13, 107, 92, 0.12);
}

.card h2 {
    margin: 0 0 0.35rem;
    font-size: 1.1rem;
}

.card .meta {
    font-size: 0.9rem;
    color: var(--muted);
}

.card .price {
    margin-top: 0.75rem;
    font-weight: 600;
    color: var(--accent);
}

.btn {
    display: inline-block;
    padding: 0.6rem 1.1rem;
    background: var(--accent);
    color: #fff !important;
    border: none;
    border-radius: var(--radius);
    font-size: 0.95rem;
    font-weight: 600;
    cursor: pointer;
    text-decoration: none;
    font-family: inherit;
}

.btn:hover {
    background: var(--accent-hover);
}

.btn-sm {
    padding: 0.45rem 0.85rem;
    font-size: 0.85rem;
}

.btn-secondary {
    background: var(--surface);
    color: var(--text) !important;
    border: 1px solid var(--border);
}

.btn-secondary:hover {
    border-color: var(--accent);
    color: var(--accent) !important;
    background: var(--surface);
}

.alert {
    padding: 0.85rem 1rem;
    border-radius: var(--radius);
    margin-bottom: 1.25rem;
}

.alert-error {
    background: #fde8e6;
    color: var(--danger);
    border: 1px solid #f5c4be;
}

.alert-success {
    background: #e6f5f2;
    color: #0d6b5c;
    border: 1px solid #b8e0d6;
}

form.stacked label {
    display: block;
    font-size: 0.9rem;
    font-weight: 600;
    margin-bottom: 0.35rem;
}

form.stacked input,
form.stacked select,
form.stacked textarea {
    width: 100%;
    max-width: 28rem;
    padding: 0.55rem 0.65rem;
    border: 1px solid var(--border);
    border-radius: 8px;
    font-size: 1rem;
    font-family: inherit;
    margin-bottom: 1rem;
}

form.stacked textarea {
    min-height: 120px;
    resize: vertical;
}

.field-hint {
    font-size: 0.8rem;
    color: var(--muted);
    margin: -0.5rem 0 1rem;
    max-width: 28rem;
}

.table-wrap {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior-x: contain;
    border: 1px solid var(--border);
    border-radius: var(--radius);
    background: var(--surface);
}
.table-wrap:focus-visible {
    outline: 2px solid var(--accent);
    outline-offset: 2px;
}

table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.9rem;
}

th, td {
    padding: 0.75rem 1rem;
    text-align: left;
    border-bottom: 1px solid var(--border);
}

th {
    background: var(--bg);
    font-weight: 600;
}

.badge {
    display: inline-block;
    padding: 0.2rem 0.5rem;
    border-radius: 6px;
    font-size: 0.75rem;
    font-weight: 600;
}

.badge-paid {
    background: #e6f5f2;
    color: #0d6b5c;
}

.badge-pending {
    background: #fff8e6;
    color: #8a6d1d;
}

.badge-cancel {
    background: #f5f5f5;
    color: var(--muted);
}

.hero-actions {
    display: flex;
    gap: 1rem;
    flex-wrap: wrap;
    margin-top: 1.5rem;
}

.space-detail dl {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 0.35rem 1.25rem;
    margin: 1rem 0;
}

.space-detail dt {
    color: var(--muted);
    font-weight: 500;
}

.space-detail dd {
    margin: 0;
}

.visually-hidden {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

/* Skip link + target principale (sticky header) */
.skip-link {
    position: absolute;
    left: 0.75rem;
    top: 0.75rem;
    z-index: 300;
    padding: 0.65rem 1.1rem;
    background: var(--surface);
    color: var(--accent);
    font-weight: 600;
    text-decoration: none;
    border-radius: 10px;
    box-shadow: var(--shadow-md);
    border: 1px solid var(--hairline);
    transform: translateY(-220%);
    transition: transform 0.2s var(--ease-out, ease), box-shadow 0.2s ease;
}
.skip-link:focus {
    transform: translateY(0);
    outline: none;
}
.skip-link:focus-visible {
    outline: 2px solid var(--accent);
    outline-offset: 3px;
}

#main-content {
    scroll-margin-top: calc(var(--header-h, 68px) + 0.75rem);
}

.auth-errors-list {
    margin: 0;
    padding-left: 1.25rem;
    text-align: left;
}
.auth-errors-list li {
    margin: 0.25rem 0;
}

.filter-bar {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem 1.25rem;
    align-items: flex-end;
    padding: 1.25rem;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
    margin-bottom: 1.75rem;
    box-shadow: var(--shadow-sm);
}

.filter-bar__field label {
    display: block;
    font-size: 0.8rem;
    font-weight: 600;
    margin-bottom: 0.35rem;
    color: var(--muted);
}

.filter-bar__field input,
.filter-bar__field select {
    min-width: 12rem;
    padding: 0.55rem 0.65rem;
    border: 1px solid var(--border);
    border-radius: 8px;
    font-family: inherit;
    font-size: 0.95rem;
}

.filter-bar__actions {
    display: flex;
    gap: 0.6rem;
    flex-wrap: wrap;
}

.page-home .site-header {
    border-bottom-color: transparent;
    background: rgba(243, 240, 234, 0.92);
}

.home-hero {
    position: relative;
    padding: 2.5rem 0 3.5rem;
    overflow: hidden;
}

.home-hero__bg {
    position: absolute;
    inset: 0;
    background:
        radial-gradient(ellipse 80% 60% at 70% 0%, rgba(12, 92, 82, 0.14), transparent 55%),
        radial-gradient(ellipse 50% 40% at 10% 100%, rgba(139, 119, 94, 0.12), transparent 50%),
        linear-gradient(180deg, #ebe6de 0%, var(--bg) 100%);
    pointer-events: none;
}

.home-hero__inner {
    position: relative;
    z-index: 1;
}

.home-hero__eyebrow {
    font-size: 0.8rem;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--accent);
    margin: 0 0 0.75rem;
}

.home-hero__title {
    font-family: var(--font-display);
    font-size: clamp(2.35rem, 6vw, 3.5rem);
    font-weight: 400;
    line-height: 1.08;
    letter-spacing: -0.02em;
    margin: 0 0 1rem;
    max-width: 14ch;
}

.home-hero__title em {
    font-style: italic;
    color: var(--accent);
}

.home-hero__sub {
    font-size: 1.08rem;
    color: var(--muted);
    max-width: 36rem;
    line-height: 1.6;
    margin: 0 0 1.75rem;
}

.home-search {
    display: flex;
    flex-wrap: wrap;
    gap: 0.6rem;
    max-width: 32rem;
    margin-bottom: 1.25rem;
}

.home-search__input {
    flex: 1 1 14rem;
    padding: 0.75rem 1rem;
    border: 1px solid var(--border);
    border-radius: var(--radius);
    font-size: 1rem;
    font-family: inherit;
    background: var(--surface);
    box-shadow: var(--shadow-sm);
}

.home-search__btn {
    padding-left: 1.35rem;
    padding-right: 1.35rem;
}

.home-hero__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
}

.btn-lg {
    padding: 0.75rem 1.35rem;
    font-size: 1rem;
}

.btn-ghost {
    background: transparent;
    color: var(--text) !important;
    border: 1px solid var(--border);
    box-shadow: none;
}

.btn-ghost:hover {
    background: var(--surface);
    border-color: var(--accent);
    color: var(--accent) !important;
}

.btn-ghost-light {
    background: transparent;
    color: #fff !important;
    border: 1px solid rgba(255, 255, 255, 0.45);
}

.btn-ghost-light:hover {
    background: rgba(255, 255, 255, 0.1);
    border-color: #fff;
}

.home-stats {
    padding: 0 0 2.5rem;
}

.home-stats__grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1rem;
    padding: 1.25rem 1.5rem;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-md);
}

@media (max-width: 560px) {
    .home-stats__grid {
        grid-template-columns: 1fr;
        text-align: center;
    }
}

.home-stat__value {
    display: block;
    font-size: clamp(1.75rem, 4vw, 2.25rem);
    font-weight: 700;
    letter-spacing: -0.03em;
    color: var(--accent);
    line-height: 1.1;
}

.home-stat__label {
    font-size: 0.85rem;
    color: var(--muted);
}

.home-strip {
    padding-bottom: 2rem;
}

.home-strip__label {
    display: block;
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--muted);
    margin-bottom: 0.75rem;
}

.home-pills {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.home-pill {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.4rem 0.85rem;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 999px;
    text-decoration: none;
    color: var(--text);
    font-size: 0.9rem;
    font-weight: 500;
    transition: border-color 0.15s, box-shadow 0.15s;
}

.home-pill:hover {
    border-color: var(--accent);
    box-shadow: var(--shadow-sm);
}

.home-pill__n {
    font-size: 0.72rem;
    font-weight: 700;
    color: var(--accent);
    background: var(--accent-soft);
    padding: 0.12rem 0.4rem;
    border-radius: 999px;
}

.home-pill--muted {
    color: var(--muted);
    background: transparent;
}

.home-section {
    padding: 2.75rem 0;
}

.home-section--alt {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.55) 0%, transparent 100%);
    border-top: 1px solid var(--border);
    border-bottom: 1px solid var(--border);
}

.section-head {
    margin-bottom: 1.75rem;
}

.section-head--center {
    text-align: center;
    max-width: 36rem;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 2rem;
}

.section-head__title {
    font-family: var(--font-display);
    font-size: clamp(1.75rem, 3.5vw, 2.25rem);
    font-weight: 400;
    margin: 0 0 0.35rem;
    letter-spacing: -0.02em;
}

.section-head__text {
    margin: 0;
    color: var(--muted);
    font-size: 1.02rem;
}

.home-cats {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(10.5rem, 1fr));
    gap: 1rem;
}

.home-cat-card {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    padding: 1.1rem;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: var(--radius);
    text-decoration: none;
    color: inherit;
    transition: transform 0.15s, box-shadow 0.15s, border-color 0.15s;
}

.home-cat-card:hover {
    border-color: var(--accent);
    box-shadow: var(--shadow-md);
    transform: translateY(-2px);
}

.home-cat-card__icon {
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 10px;
    margin-bottom: 0.25rem;
}

.home-cat-card__icon--parrucchiere {
    background: linear-gradient(135deg, #6b5344, #a67c52);
}

.home-cat-card__icon--centro_estetico {
    background: linear-gradient(135deg, #8b5a7c, #c080a8);
}

.home-cat-card__icon--spa {
    background: linear-gradient(135deg, #3d5a6c, #5c8fa8);
}

.home-cat-card__icon--salone {
    background: linear-gradient(135deg, #4a4a48, #7a7874);
}

.home-cat-card__icon--negozio {
    background: linear-gradient(135deg, #5c4d7a, #8b7cb5);
}

.home-cat-card__icon--altro {
    background: linear-gradient(135deg, var(--accent), #2a9d8f);
}

.home-cat-card__name {
    font-weight: 700;
    font-size: 1rem;
}

.home-cat-card__n {
    font-size: 0.82rem;
    color: var(--muted);
}

.card--space {
    padding: 0;
    overflow: hidden;
    border-radius: var(--radius-lg);
    display: flex;
    flex-direction: column;
    min-height: 280px;
    color: var(--text);
    text-decoration: none;
}

.card--space:hover {
    color: var(--text);
}

.card--space .card__body {
    padding: 1.15rem 1.25rem 1.35rem;
    flex: 1 1 auto;
}

.card--space .card__title,
.card--space .card__meta,
.card--space .card__price {
    color: inherit;
}

.card--space .card__meta,
.card--space .card__price-unit {
    color: var(--muted);
}

.card--space .card__price {
    color: var(--accent);
}

.card__visual {
    height: 7.5rem;
    position: relative;
    background: linear-gradient(135deg, #5c5348, #8a7f72);
}

.card__visual--parrucchiere {
    background: linear-gradient(135deg, #5c4033, #8b6914);
}

.card__visual--centro_estetico {
    background: linear-gradient(135deg, #6b3d5c, #9b5f85);
}

.card__visual--spa {
    background: linear-gradient(135deg, #2c4a5c, #4a7a8c);
}

.card__visual--salone {
    background: linear-gradient(135deg, #3d3d3b, #6b6965);
}

.card__visual--negozio {
    background: linear-gradient(135deg, #453d5e, #6c5b8a);
}

.card__visual--altro {
    background: linear-gradient(135deg, #0c5c52, #3a8f85);
}

.card__visual--photo {
    background-size: cover;
    background-position: center;
}

.card__badge {
    position: absolute;
    top: 0.65rem;
    left: 0.65rem;
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: #fff;
    background: rgba(0, 0, 0, 0.35);
    backdrop-filter: blur(6px);
    padding: 0.25rem 0.5rem;
    border-radius: 6px;
}

.card__title {
    font-size: 1.05rem;
    font-weight: 700;
    margin: 0 0 0.4rem;
    line-height: 1.3;
}

.card__meta {
    margin: 0;
    font-size: 0.88rem;
    color: var(--muted);
}

.card__dot {
    margin: 0 0.2rem;
}

.card__host {
    display: inline;
}

.card__price {
    margin-top: 0.85rem;
    font-size: 1.1rem;
    font-weight: 700;
    color: var(--accent);
}

.card__price-unit {
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--muted);
}

.home-cards {
    margin-top: 0.25rem;
}

.home-more {
    margin: 1.75rem 0 0;
    text-align: center;
}

.link-arrow {
    font-weight: 600;
    color: var(--accent);
    text-decoration: none;
}

.link-arrow:hover {
    text-decoration: underline;
}

.home-empty {
    text-align: center;
    padding: 2.5rem 1.5rem;
    background: var(--surface);
    border: 1px dashed var(--border);
    border-radius: var(--radius-lg);
    max-width: 32rem;
    margin: 0 auto;
}

.home-empty p {
    color: var(--muted);
    margin: 0 0 1.25rem;
}

.home-steps {
    gap: 1.5rem;
}

.step-card {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
    padding: 1.5rem 1.6rem;
    box-shadow: var(--shadow-sm);
}

.step-card__num {
    display: inline-block;
    font-size: 0.75rem;
    font-weight: 800;
    color: var(--accent);
    letter-spacing: 0.06em;
    margin-bottom: 0.5rem;
}

.step-card__title {
    margin: 0 0 0.5rem;
    font-size: 1.15rem;
}

.step-card p {
    margin: 0 0 0.75rem;
    color: var(--muted);
    font-size: 0.95rem;
}

.step-card__list {
    margin: 0;
    padding-left: 1.1rem;
    color: var(--text);
    font-size: 0.9rem;
}

.step-card__list li {
    margin-bottom: 0.35rem;
}

.home-cta {
    padding: 3rem 0 3.5rem;
}

.home-cta__inner {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 1.75rem;
    padding: 2rem 1.75rem;
    background: linear-gradient(135deg, var(--accent) 0%, #0a4d45 55%, #1a3d38 100%);
    border-radius: var(--radius-lg);
    color: #e8f5f3;
    box-shadow: 0 12px 40px rgba(12, 92, 82, 0.35);
}

.home-cta__title {
    font-family: var(--font-display);
    font-size: clamp(1.6rem, 3vw, 2rem);
    font-weight: 400;
    margin: 0 0 0.35rem;
    color: #fff;
}

.home-cta__text {
    margin: 0;
    max-width: 32rem;
    opacity: 0.92;
    line-height: 1.55;
}

.home-cta__btns {
    display: flex;
    flex-wrap: wrap;
    gap: 0.65rem;
}

.home-cta .btn-lg:not(.btn-ghost-light) {
    background: #fff;
    color: var(--accent) !important;
}

.home-cta .btn-lg:not(.btn-ghost-light):hover {
    background: #f0faf8;
}

.btn-block {
    display: block;
    width: 100%;
    text-align: center;
    box-sizing: border-box;
}

.home-map-section {
    padding-bottom: 1rem;
}

.home-map {
    height: min(420px, 55vh);
    min-height: 320px;
    width: 100%;
    border-radius: var(--radius-lg);
    overflow: hidden;
    border: 1px solid var(--border);
    box-shadow: var(--shadow-md);
    z-index: 0;
    background: #dfe8ec;
}

.home-map--empty .leaflet-container {
    opacity: 0.92;
}

.home-map-empty {
    text-align: center;
    color: var(--muted);
    font-size: 0.95rem;
    margin: 1rem 0 0;
}

.leaflet-container {
    font-family: var(--font);
}

/* Geolocalizzazione utente (Leaflet, map-geolocate.js) */
.map-geo-locate.leaflet-control {
    margin-top: 8px !important;
    margin-right: 8px !important;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2);
    border-radius: 4px;
    background: #fff;
    border: 2px solid rgba(0, 0, 0, 0.12);
}
.map-geo-locate__btn {
    display: block;
    width: 100%;
    margin: 0;
    padding: 6px 10px;
    border: none;
    border-radius: 2px;
    background: #fff;
    font-family: var(--font);
    font-size: 0.72rem;
    font-weight: 700;
    line-height: 1.2;
    color: var(--text);
    cursor: pointer;
    text-align: center;
    white-space: normal;
    max-width: 9.5rem;
}
.map-geo-locate__btn:hover {
    background: var(--surface-2, #f3f4f6);
    color: var(--accent);
}
.map-geo-locate__btn:focus-visible {
    outline: 2px solid var(--accent);
    outline-offset: 1px;
}
.map-geo-locate__btn:disabled {
    opacity: 0.65;
    cursor: wait;
}

.map-editor-block {
    max-width: 36rem;
    margin-bottom: 1rem;
}

.map-editor-block__label {
    display: block;
    font-size: 0.9rem;
    font-weight: 600;
    margin-bottom: 0.35rem;
}

.editor-map {
    height: 280px;
    width: 100%;
    max-width: 36rem;
    border-radius: var(--radius);
    border: 1px solid var(--border);
    margin-bottom: 0.75rem;
}

.map-editor-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-bottom: 1rem;
}

.space-detail--hero {
    padding-bottom: 2rem;
}

.space-hero {
    position: relative;
    min-height: 14rem;
    margin-bottom: 2rem;
    display: flex;
    align-items: flex-end;
    border-radius: 0 0 var(--radius-lg) var(--radius-lg);
    overflow: hidden;
}

.space-hero--photo {
    background-size: cover;
    background-position: center;
}

.space-hero__overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, transparent 0%, rgba(20, 18, 15, 0.75) 100%);
}

.space-hero__content {
    position: relative;
    z-index: 1;
    padding: 2rem 0 2.25rem;
    width: 100%;
}

.space-hero--gradient .space-hero__content {
    padding-top: 2.5rem;
}

.space-hero__badge {
    display: inline-block;
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #fff;
    background: rgba(0, 0, 0, 0.35);
    backdrop-filter: blur(6px);
    padding: 0.3rem 0.55rem;
    border-radius: 6px;
    margin-bottom: 0.5rem;
}

.space-hero__title {
    font-family: var(--font-display);
    font-size: clamp(1.85rem, 4vw, 2.5rem);
    font-weight: 400;
    color: #fff;
    margin: 0 0 0.35rem;
    line-height: 1.1;
    max-width: 20ch;
}

.space-hero__meta {
    margin: 0;
    color: rgba(255, 255, 255, 0.88);
    font-size: 1rem;
}

.space-hero--parrucchiere {
    background: linear-gradient(135deg, #5c4033 0%, #8b6914 100%);
}

.space-hero--centro_estetico {
    background: linear-gradient(135deg, #6b3d5c 0%, #9b5f85 100%);
}

.space-hero--spa {
    background: linear-gradient(135deg, #2c4a5c 0%, #4a7a8c 100%);
}

.space-hero--salone {
    background: linear-gradient(135deg, #3d3d3b 0%, #6b6965 100%);
}

.space-hero--negozio {
    background: linear-gradient(135deg, #453d5e 0%, #6c5b8a 100%);
}

.space-hero--altro {
    background: linear-gradient(135deg, #0c5c52 0%, #3a8f85 100%);
}

.space-detail__grid {
    display: grid;
    gap: 2rem;
}

@media (min-width: 900px) {
    .space-detail__grid {
        grid-template-columns: 1fr 320px;
        align-items: start;
    }
}

.space-facts {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 0.4rem 1.25rem;
    margin: 0 0 1.5rem;
}

.space-facts dt {
    margin: 0;
    color: var(--muted);
    font-weight: 500;
}

.space-facts dd {
    margin: 0;
}

.space-prose {
    margin-bottom: 1.5rem;
}

.space-aside-block {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: var(--radius);
    padding: 1rem;
    margin-bottom: 1rem;
    box-shadow: var(--shadow-sm);
}

.space-aside-block__title {
    font-size: 0.9rem;
    margin: 0 0 0.65rem;
}

.space-mini-map {
    height: 220px;
    width: 100%;
    border-radius: 8px;
    overflow: hidden;
}

.space-aside-block--cta .btn-block {
    margin-top: 0;
}

.space-back {
    margin: 2rem 0 0;
}

.space-trust {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin: 0 0 1.5rem;
}

.trust-badge {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--text);
    background: var(--surface);
    border: 1px solid var(--border);
    padding: 0.35rem 0.65rem;
    border-radius: 999px;
}

.trust-badge__ic {
    color: var(--accent);
    font-weight: 800;
}

.trust-badge--map {
    border-color: rgba(12, 92, 82, 0.35);
    background: var(--accent-soft);
    color: var(--accent);
}

.space-gallery {
    margin: -0.5rem 0 1.5rem;
}

.space-gallery__track {
    display: flex;
    gap: 0.5rem;
    overflow-x: auto;
    padding: 0.25rem 0 0.5rem;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
}

.space-gallery__thumb {
    flex: 0 0 auto;
    scroll-snap-align: start;
    padding: 0;
    border: 2px solid var(--border);
    border-radius: 10px;
    overflow: hidden;
    cursor: pointer;
    background: var(--bg);
    transition: border-color 0.15s;
}

.space-gallery__thumb:hover,
.space-gallery__thumb:focus-visible {
    border-color: var(--accent);
    outline: none;
}

.space-gallery__thumb img {
    display: block;
    width: 140px;
    height: 94px;
    object-fit: cover;
}

.contract-block {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: var(--radius);
    padding: 1.15rem 1.25rem;
    margin-bottom: 1.5rem;
    box-shadow: var(--shadow-sm);
}

.contract-block--incl {
    border-left: 4px solid var(--accent);
}

.contract-block--fees {
    border-left: 4px solid #8a6d1d;
    background: linear-gradient(180deg, #fffef8 0%, var(--surface) 100%);
}

.contract-block__title {
    font-size: 1.05rem;
    margin: 0 0 0.65rem;
}

.contract-block__body {
    margin: 0;
}

.contract-block__note {
    margin: 0.85rem 0 0;
    font-size: 0.82rem;
    color: var(--muted);
}

.aside-hint {
    font-size: 0.85rem;
    color: var(--muted);
    margin: 0.65rem 0 0;
}

.space-aside-block--cta .btn-block + .btn-block {
    margin-top: 0.6rem;
}

.card__chips {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
    margin: 0 0 0.4rem;
}

.chip {
    font-size: 0.72rem;
    font-weight: 600;
    padding: 0.2rem 0.45rem;
    border-radius: 6px;
    background: var(--accent-soft);
    color: var(--accent);
}

.chip--muted {
    background: var(--bg);
    color: var(--muted);
    font-weight: 500;
    border: 1px solid var(--border);
}

.filter-bar--extended {
    display: block;
}

.filter-bar__grid {
    display: grid;
    gap: 0.85rem 1rem;
    grid-template-columns: repeat(auto-fill, minmax(11rem, 1fr));
    margin-bottom: 1rem;
}

.filter-bar__field--grow {
    grid-column: 1 / -1;
}

@media (min-width: 720px) {
    .filter-bar__field--grow {
        grid-column: span 2;
    }
}

.catalog-layout {
    display: grid;
    gap: 1.5rem;
    margin-top: 0.5rem;
}

@media (min-width: 960px) {
    .catalog-layout {
        grid-template-columns: minmax(280px, 38%) 1fr;
        align-items: start;
    }
}

.catalog-map-wrap {
    position: sticky;
    top: 5.5rem;
}

.catalog-map-caption {
    font-size: 0.85rem;
    color: var(--muted);
    margin: 0 0 0.5rem;
}

.catalog-map {
    height: min(420px, 52vh);
    min-height: 280px;
    border-radius: var(--radius-lg);
    border: 1px solid var(--border);
    overflow: hidden;
    background: #dfe8ec;
}

.catalog-map--empty {
    opacity: 0.92;
}

.catalog-count {
    font-size: 0.9rem;
    font-weight: 600;
    color: var(--muted);
    margin: 0 0 0.85rem;
}

@media (max-width: 959px) {
    .catalog-map-wrap {
        position: relative;
        top: auto;
    }

    .catalog-map {
        height: 260px;
    }
}

.empty-state {
    text-align: center;
    padding: 2.5rem 1.25rem;
    background: var(--surface);
    border: 1px dashed var(--border);
    border-radius: var(--radius-lg);
    max-width: 32rem;
    margin: 1.5rem auto 0;
}

.empty-state__title {
    font-size: 1.2rem;
    margin: 0 0 0.5rem;
}

.empty-state__text {
    color: var(--muted);
    margin: 0 0 1.25rem;
    line-height: 1.55;
}

.empty-state__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.65rem;
    justify-content: center;
}

.page-auth .main-content {
    max-width: 28rem;
    margin-left: auto;
    margin-right: auto;
    padding-top: 1rem;
    padding-bottom: 3rem;
}

.page-auth.page-auth .main-content > h1 {
    font-family: var(--font-display);
    font-weight: 400;
    font-size: 1.85rem;
}

.cf-intro {
    margin-bottom: 1.25rem;
}

.cf-intro-text {
    margin: 0 0 0.85rem;
    color: var(--muted);
    line-height: 1.6;
}

.cf-intro-text--last {
    margin-bottom: 0;
}

.cf-grid {
    display: grid;
    gap: 1.25rem;
    margin-bottom: 2.5rem;
}

@media (min-width: 768px) {
    .cf-grid {
        grid-template-columns: 1fr 1fr;
    }
}

.cf-card {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
    padding: 1.35rem 1.5rem;
    box-shadow: var(--shadow-sm);
}

.cf-card h2 {
    font-size: 1.1rem;
    margin: 0 0 0.75rem;
}

.cf-steps {
    margin: 0;
    padding-left: 1.2rem;
    color: var(--muted);
    line-height: 1.6;
}

.cf-steps li {
    margin-bottom: 0.5rem;
}

.cf-faq {
    max-width: 40rem;
    margin-bottom: 2rem;
}

.cf-faq h2 {
    font-family: var(--font-display);
    font-weight: 400;
    font-size: 1.5rem;
    margin: 0 0 1rem;
}

.faq-list dt {
    font-weight: 700;
    margin: 1rem 0 0.35rem;
    color: var(--text);
}

.faq-list dd {
    margin: 0;
    color: var(--muted);
    line-height: 1.55;
}

.cf-cta {
    display: flex;
    flex-wrap: wrap;
    gap: 0.65rem;
    margin: 2rem 0 1rem;
}

.page-auth form.stacked input,
.page-auth form.stacked select,
.page-auth form.stacked textarea {
    max-width: 100%;
}

/* Thread conversazioni richieste */
.thread {
    display: flex;
    flex-direction: column;
    gap: 0.85rem;
    margin: 1.25rem 0 1.5rem;
    max-width: 42rem;
}

.thread-msg {
    border-radius: var(--radius-lg);
    padding: 0.85rem 1rem;
    border: 1px solid var(--border);
    background: var(--surface);
}

.thread-msg--pro {
    margin-right: auto;
    max-width: 92%;
    border-left: 3px solid var(--accent, #2563eb);
}

.thread-msg--host {
    margin-left: auto;
    max-width: 92%;
    border-right: 3px solid var(--muted);
}

.thread-msg__meta {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem 1rem;
    font-size: 0.85rem;
    color: var(--muted);
    margin-bottom: 0.35rem;
}

.thread-msg__body {
    line-height: 1.55;
    color: var(--text);
}

.thread-reply,
.thread-close {
    max-width: 42rem;
    margin-top: 1rem;
}

.thread-close {
    margin-top: 0.75rem;
}

.space-inquiry-box {
    margin-top: 1rem;
    padding-top: 1rem;
    border-top: 1px solid var(--border);
}

.space-inquiry-box__title {
    font-size: 1rem;
    margin: 0 0 0.35rem;
}

.space-inquiry-box textarea {
    width: 100%;
    min-height: 5rem;
    margin-bottom: 0.5rem;
}

.space-unavail-list {
    margin: 0.5rem 0 0;
    padding-left: 1.2rem;
    color: var(--text);
    line-height: 1.55;
}

.dash-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem 0.75rem;
    margin-bottom: 1rem;
}

.admin-stats {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    margin: 1.25rem 0 1.5rem;
}

.admin-stat-card {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
    padding: 1rem 1.25rem;
    min-width: 7rem;
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    font-size: 0.9rem;
    color: var(--muted);
}

.admin-stat-card__n {
    font-size: 1.75rem;
    font-weight: 700;
    color: var(--text);
    font-variant-numeric: tabular-nums;
}

ul.admin-menu {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem 1rem;
}

ul.admin-menu a {
    font-weight: 600;
}

.link-btn {
    background: none;
    border: none;
    padding: 0;
    color: var(--accent, #2563eb);
    text-decoration: underline;
    cursor: pointer;
    font: inherit;
}

.link-btn:hover {
    opacity: 0.85;
}

.link-btn--danger {
    color: var(--danger);
}

/* ——— Admin: layout moderno ——— */
body.page-admin {
    background: linear-gradient(180deg, #e8e3da 0%, var(--bg) 22%, var(--bg) 100%);
}

.admin-dashboard {
    padding-bottom: 2.5rem;
}

.admin-dashboard__hero {
    position: relative;
    padding: 0.25rem 0 1.5rem;
    margin-bottom: 0.25rem;
}

.admin-dashboard__hero::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 3rem;
    height: 4px;
    border-radius: 4px;
    background: linear-gradient(90deg, var(--accent), #2a9d8f);
}

.admin-dashboard__eyebrow {
    margin: 0.75rem 0 0.35rem;
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.12em;
    color: var(--muted);
}

.admin-dashboard__title {
    font-family: var(--font-display);
    font-size: clamp(1.85rem, 4vw, 2.35rem);
    font-weight: 400;
    margin: 0 0 0.5rem;
    line-height: 1.15;
    letter-spacing: -0.02em;
}

.admin-dashboard__lead {
    margin: 0;
    max-width: 36rem;
    color: var(--muted);
    font-size: 1.02rem;
    line-height: 1.55;
}

.admin-nav-wrap {
    margin: 0 0 2rem;
}

.admin-nav {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
    padding: 0.5rem;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-sm);
}

.admin-nav__item {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 0.85rem;
    border-radius: 10px;
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--muted);
    text-decoration: none;
    border: 1px solid transparent;
    transition: color 0.15s ease, background 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
}

.admin-nav__item:hover {
    color: var(--accent);
    background: var(--accent-soft);
}

.admin-nav__item.is-active {
    color: var(--accent-hover);
    background: rgba(12, 92, 82, 0.14);
    border-color: rgba(12, 92, 82, 0.22);
    box-shadow: 0 1px 0 rgba(255, 255, 255, 0.6) inset;
}

.admin-nav__svg {
    flex-shrink: 0;
    opacity: 0.88;
}

.admin-nav__item.is-active .admin-nav__svg {
    opacity: 1;
    color: var(--accent);
}

.admin-nav__label {
    white-space: nowrap;
}

@media (max-width: 640px) {
    .admin-nav {
        flex-wrap: nowrap;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: thin;
        mask-image: linear-gradient(to right, #000 92%, transparent);
    }

    .admin-nav__item {
        flex-shrink: 0;
    }
}

.admin-page-head {
    margin-bottom: 1.25rem;
}

.admin-back {
    display: inline-block;
    margin-bottom: 0.75rem;
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--muted);
    text-decoration: none;
}

.admin-back:hover {
    color: var(--accent);
}

.admin-page-title {
    font-family: var(--font-display);
    font-size: clamp(1.5rem, 3.5vw, 1.85rem);
    font-weight: 400;
    margin: 0 0 0.75rem;
    letter-spacing: -0.02em;
}

.admin-dashboard__section {
    margin-bottom: 2.25rem;
}

.admin-dashboard__h2 {
    font-size: 0.78rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--muted);
    margin: 0 0 0.85rem;
}

.admin-metric-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(158px, 1fr));
    gap: 0.85rem;
}

.admin-metric {
    position: relative;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
    padding: 1rem 1.1rem;
    box-shadow: var(--shadow-sm);
    transition: transform 0.18s ease, box-shadow 0.18s ease;
}

.admin-metric:hover {
    transform: translateY(-2px);
    box-shadow: var(--shadow-md);
}

.admin-metric--pulse {
    border-color: rgba(180, 35, 24, 0.28);
    background: linear-gradient(145deg, rgba(255, 255, 255, 0.95) 0%, rgba(180, 35, 24, 0.05) 100%);
}

.admin-metric--pulse::after {
    content: "";
    position: absolute;
    inset: -1px;
    border-radius: inherit;
    pointer-events: none;
    animation: admin-metric-glow 2.4s ease-in-out infinite;
}

@keyframes admin-metric-glow {
    0%,
    100% {
        box-shadow: 0 0 0 0 rgba(12, 92, 82, 0);
    }
    50% {
        box-shadow: 0 0 0 3px rgba(12, 92, 82, 0.12);
    }
}

.admin-metric__top {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.5rem;
    margin-bottom: 0.35rem;
}

.admin-metric__ico {
    color: var(--accent);
    opacity: 0.9;
}

.admin-metric__value {
    font-size: 1.65rem;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    line-height: 1;
    color: var(--text);
}

.admin-metric__label {
    margin: 0;
    font-size: 0.82rem;
    font-weight: 600;
    color: var(--muted);
    line-height: 1.35;
}

.admin-metric__cta {
    display: inline-block;
    margin-top: 0.65rem;
    font-size: 0.78rem;
    font-weight: 700;
    color: var(--accent);
    text-decoration: none;
}

.admin-metric__cta:hover {
    text-decoration: underline;
}

.admin-metric__hint {
    margin: 0.5rem 0 0;
    font-size: 0.75rem;
    color: var(--muted);
}

.admin-quick-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
    gap: 0.85rem;
}

.admin-quick-card {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    padding: 1.15rem 1.2rem 1.35rem;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
    text-decoration: none;
    color: inherit;
    box-shadow: var(--shadow-sm);
    transition: border-color 0.18s ease, box-shadow 0.18s ease, transform 0.18s ease;
}

.admin-quick-card:hover {
    border-color: rgba(12, 92, 82, 0.35);
    box-shadow: var(--shadow-md);
    transform: translateY(-2px);
}

.admin-quick-card__title {
    font-weight: 700;
    font-size: 1rem;
    color: var(--text);
}

.admin-quick-card__desc {
    font-size: 0.86rem;
    color: var(--muted);
    line-height: 1.45;
}

.admin-quick-card__arrow {
    position: absolute;
    right: 1rem;
    bottom: 1rem;
    font-size: 1.1rem;
    font-weight: 600;
    color: var(--accent);
    opacity: 0.65;
    transition: transform 0.18s ease, opacity 0.18s ease;
}

.admin-quick-card:hover .admin-quick-card__arrow {
    opacity: 1;
    transform: translateX(3px);
}

.admin-tip {
    margin-top: 0.5rem;
    padding: 1rem 1.15rem;
    background: rgba(12, 92, 82, 0.06);
    border: 1px solid rgba(12, 92, 82, 0.15);
    border-radius: var(--radius-lg);
}

.admin-tip__title {
    display: block;
    font-size: 0.8rem;
    margin-bottom: 0.35rem;
}

.admin-tip__text {
    margin: 0 0 0.5rem;
    font-size: 0.85rem;
    color: var(--muted);
}

.admin-tip__code {
    display: block;
    padding: 0.5rem 0.65rem;
    background: var(--surface);
    border-radius: 8px;
    font-size: 0.78rem;
    overflow-x: auto;
    border: 1px solid var(--border);
}

.admin-stat-card--alert {
    border-color: rgba(180, 35, 24, 0.35);
    background: rgba(180, 35, 24, 0.06);
}

.admin-stat-card__link {
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--accent);
    margin-top: 0.35rem;
}

.admin-inline-form {
    display: block;
    margin: 0;
}

.admin-user-actions__stack {
    display: flex;
    flex-direction: column;
    gap: 0.45rem;
    min-width: 10.5rem;
    max-width: 17rem;
}

.badge {
    display: inline-block;
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    padding: 0.2rem 0.45rem;
    border-radius: 6px;
}

.badge-success {
    background: rgba(12, 92, 82, 0.15);
    color: var(--accent-hover);
}

.badge-warn {
    background: rgba(180, 120, 20, 0.18);
    color: #7a5200;
}

.table-row-muted td {
    color: var(--muted);
}

.alert-soft {
    background: rgba(12, 92, 82, 0.08);
    border: 1px solid rgba(12, 92, 82, 0.2);
    color: var(--text);
    padding: 0.85rem 1rem;
    border-radius: var(--radius);
    margin-bottom: 1rem;
}

.map-editor-block--locked .editor-map[hidden] {
    display: none !important;
}

.input-readonly {
    opacity: 0.75;
    cursor: not-allowed;
    background: var(--bg);
}

.host-verified-badge {
    display: inline-block;
    margin-left: 0.4rem;
    padding: 0.15rem 0.45rem;
    font-size: 0.65rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    vertical-align: middle;
    border-radius: 6px;
    background: rgba(12, 92, 82, 0.18);
    color: var(--accent-hover);
}

.host-plan-banner {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    padding: 1rem 1.15rem;
    margin-bottom: 1.25rem;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-sm);
}

.host-plan-banner--pro {
    border-color: rgba(12, 92, 82, 0.28);
    background: linear-gradient(135deg, rgba(12, 92, 82, 0.08) 0%, var(--surface) 55%);
}

.host-plan-banner__text {
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
    font-size: 0.92rem;
}

.host-plan-banner__meta {
    color: var(--muted);
    font-size: 0.86rem;
    font-weight: 500;
}

.host-plan-banner__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.plan-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 1rem;
    margin-top: 1.25rem;
}

.plan-card {
    padding: 1.25rem 1.35rem;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-sm);
}

.plan-card--muted {
    opacity: 0.92;
}

.plan-card--featured {
    border-color: rgba(12, 92, 82, 0.35);
    box-shadow: var(--shadow-md);
}

.plan-card__title {
    font-family: var(--font-display);
    font-size: 1.35rem;
    margin: 0 0 0.35rem;
    font-weight: 400;
}

.plan-card__price {
    font-size: 1.1rem;
    font-weight: 700;
    margin: 0 0 0.75rem;
    color: var(--accent);
}

.plan-card__note {
    font-size: 0.78rem;
    font-weight: 500;
    color: var(--muted);
}

.plan-card__strike {
    text-decoration: line-through;
    font-weight: 600;
    color: var(--muted);
    margin-right: 0.35rem;
    font-size: 0.95em;
}

.plan-card__list {
    margin: 0 0 1rem;
    padding-left: 1.1rem;
    color: var(--text);
    line-height: 1.55;
    font-size: 0.9rem;
}

.plan-card__status {
    margin: 0;
    font-size: 0.88rem;
    color: var(--muted);
}

.plan-trial-form {
    margin-top: 0.5rem;
}

/* Registrazione: piani struttura */
.register-plan-hint {
    max-width: 40rem;
    margin-bottom: 1.25rem;
}

.register-plan-box {
    margin-bottom: 1.5rem;
    padding: 1.35rem 1.4rem 1.5rem;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-sm);
}

.register-plan-box--pro-note {
    border-color: rgba(12, 92, 82, 0.22);
    background: rgba(12, 92, 82, 0.06);
}

.register-plan-box__title {
    font-size: 1rem;
    font-weight: 700;
    margin: 0 0 0.5rem;
}

.register-plan-box__intro {
    margin: 0 0 1.15rem;
    font-size: 0.94rem;
    line-height: 1.65;
    color: var(--text);
}

.register-plan-columns {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
    gap: 1.1rem;
    margin-bottom: 1.1rem;
}

.register-plan-col {
    padding: 1rem 1.1rem 1.05rem;
    border-radius: var(--radius);
    border: 1px solid var(--border);
    background: var(--bg);
}

.register-plan-col--pro {
    border-color: rgba(12, 92, 82, 0.3);
    background: rgba(12, 92, 82, 0.05);
}

.register-plan-col__h {
    font-size: 0.95rem;
    font-weight: 700;
    margin: 0 0 0.25rem;
}

.register-plan-col__price {
    font-size: 0.88rem;
    font-weight: 700;
    color: var(--accent);
    margin: 0 0 0.6rem;
}

.register-plan-col__strike {
    text-decoration: line-through;
    font-weight: 600;
    color: var(--muted);
    margin-right: 0.35rem;
    font-size: 0.9em;
}

.register-plan-col__hint {
    font-weight: 500;
    color: var(--muted);
}

.register-plan-col__list {
    margin: 0;
    padding-left: 1.15rem;
    font-size: 0.88rem;
    line-height: 1.62;
    color: var(--text);
}

.register-plan-trial {
    margin: 0;
    padding: 0.85rem 1rem;
    font-size: 0.88rem;
    line-height: 1.58;
    background: rgba(12, 92, 82, 0.1);
    border-radius: var(--radius);
    border: 1px solid rgba(12, 92, 82, 0.18);
}

.admin-settings-section {
    margin-top: 0.5rem;
    max-width: 42rem;
}

.admin-settings-section__title {
    font-size: 1.05rem;
    margin: 0 0 0.5rem;
}

.admin-settings-form {
    margin-top: 1rem;
}

.admin-code-inline {
    display: inline-block;
    margin-top: 0.25rem;
    padding: 0.2rem 0.45rem;
    font-size: 0.78rem;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 6px;
    word-break: break-all;
}

.stripe-sync-bar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.75rem 1rem;
    margin: 1rem 0 1.25rem;
    padding: 0.85rem 1rem;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
}

.admin-detail-section {
    margin: 2rem 0;
    max-width: 52rem;
}

.admin-detail-section__title {
    font-size: 1rem;
    font-weight: 700;
    margin: 0 0 0.75rem;
    padding-bottom: 0.35rem;
    border-bottom: 1px solid var(--border);
}

.admin-detail-dl {
    display: grid;
    grid-template-columns: minmax(8rem, 11rem) 1fr;
    gap: 0.35rem 1rem;
    margin: 0;
    font-size: 0.9rem;
}

.admin-detail-dl dt {
    margin: 0;
    color: var(--muted);
    font-weight: 600;
}

.admin-detail-dl dd {
    margin: 0;
    word-break: break-word;
}

.admin-detail-dl--compact {
    font-size: 0.86rem;
}

.admin-detail-text {
    max-width: 100%;
    line-height: 1.5;
}

.admin-detail-pre {
    margin: 0;
    padding: 0.5rem 0.65rem;
    background: var(--bg);
    border: 1px solid var(--border);
    border-radius: 8px;
    font-size: 0.78rem;
    white-space: pre-wrap;
    word-break: break-all;
    max-height: 12rem;
    overflow: auto;
}

.admin-space-card {
    margin-bottom: 1.5rem;
    padding: 1.1rem 1.2rem;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-sm);
}

.admin-space-card__title {
    font-size: 1rem;
    margin: 0 0 0.35rem;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem;
}

.admin-space-card__badge {
    font-size: 0.65rem;
    font-weight: 700;
    text-transform: uppercase;
    padding: 0.15rem 0.4rem;
    border-radius: 6px;
    background: var(--accent-soft);
    color: var(--accent-hover);
}

.admin-space-card__links {
    margin: 0 0 0.75rem;
    font-size: 0.88rem;
}

/* ─────────────────────────────────────────────────────────────
   Home search — input con icona, :focus-within ring, stati chiari
   Aggiornato per il refactor di index.php (vedi assets/js/home-map.js)
   ───────────────────────────────────────────────────────────── */
/* ============================================================
   HOME 2.0  —  restyle completo (scoped sotto .page-home)
   Tokens aggiuntivi specifici della home.
   ============================================================ */

.page-home {
    --home-radius: 20px;
    --home-radius-sm: 14px;
    --home-hairline: #e7e2d9;
}

/* disattiva lo sfondo hero e le regole legacy di .home-hero */
.page-home .home-hero { display: none; }
.page-home .home-stats { display: none; }
.page-home .home-strip { display: none; }

/* micro-motion globale */
.page-home .btn {
    transition: background-color .15s ease, color .15s ease,
                border-color .15s ease, box-shadow .15s ease,
                transform .12s ease;
}
.page-home .btn:active { transform: translateY(1px); }
.page-home .btn:focus-visible { outline: none; box-shadow: 0 0 0 3px var(--accent-soft); }

/* --- Bottoni nuove varianti ------------------------------------------ */
.btn-primary {
    background: var(--accent);
    color: #fff !important;
    border: 1px solid var(--accent);
}
.btn-primary:hover { background: var(--accent-hover); border-color: var(--accent-hover); }

.btn-ghost {
    background: transparent;
    color: var(--text) !important;
    border: 1px solid var(--border);
    box-shadow: none;
}
.btn-ghost:hover { border-color: var(--accent); color: var(--accent) !important; background: var(--surface); }

.btn-link {
    background: transparent;
    color: var(--accent) !important;
    border: none;
    padding-left: 0;
    padding-right: 0;
    box-shadow: none;
    display: inline-flex;
    align-items: center;
    gap: .3rem;
}
.btn-link:hover { color: var(--accent-hover) !important; }
.btn-link:hover .btn__ico { transform: translateX(3px); }

.btn-light {
    background: #fff;
    color: var(--accent) !important;
    border: 1px solid #fff;
}
.btn-light:hover { background: #f0faf8; }

.btn-outline-light {
    background: transparent;
    color: #fff !important;
    border: 1px solid rgba(255,255,255,.5);
}
.btn-outline-light:hover { background: rgba(255,255,255,.1); border-color: #fff; }

.btn__ico {
    width: 1rem;
    height: 1rem;
    transition: transform .15s ease;
}
.btn-primary:hover .btn__ico { transform: translateX(3px); }

/* --- HERO ------------------------------------------------------------- */
.hero {
    position: relative;
    padding: 2.25rem 0 3.5rem;
    overflow: hidden;
}
.hero__bg {
    position: absolute;
    inset: 0;
    background:
        radial-gradient(ellipse 60% 50% at 85% 10%, rgba(12,92,82,.15), transparent 60%),
        radial-gradient(ellipse 40% 35% at 5% 95%, rgba(139,119,94,.12), transparent 55%),
        linear-gradient(180deg, #ece7de 0%, var(--bg) 70%);
    pointer-events: none;
}
.hero__bg::after {
    content: "";
    position: absolute;
    inset: auto 0 0 0;
    height: 1px;
    background: var(--home-hairline);
}

.hero__grid {
    position: relative;
    display: grid;
    grid-template-columns: 1fr;
    gap: 2.5rem;
    align-items: center;
}
@media (min-width: 960px) {
    .hero__grid {
        grid-template-columns: minmax(0, 1fr) minmax(0, 440px);
        gap: 3.5rem;
    }
}

.hero__eyebrow {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    margin: 0 0 1rem;
    padding: .35rem .75rem .35rem .6rem;
    background: rgba(255,255,255,.6);
    border: 1px solid var(--home-hairline);
    border-radius: 999px;
    font-size: .78rem;
    font-weight: 600;
    color: var(--text);
    letter-spacing: .01em;
}
.hero__eyebrow-dot {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--accent);
    box-shadow: 0 0 0 3px rgba(12,92,82,.18);
}

.hero__title {
    font-family: var(--font-display);
    font-size: clamp(2.4rem, 5vw, 3.75rem);
    font-weight: 400;
    line-height: 1.05;
    letter-spacing: -.025em;
    margin: 0 0 1.1rem;
}
.hero__title em { font-style: italic; color: var(--accent); }

.hero__sub {
    font-size: 1.1rem;
    color: var(--muted);
    max-width: 34rem;
    line-height: 1.6;
    margin: 0 0 1.75rem;
}

/* --- Search bar premium --------------------------------------------- */
.hero-search {
    display: flex;
    flex-wrap: wrap;
    gap: .6rem;
    padding: .5rem;
    background: var(--surface);
    border: 1px solid var(--home-hairline);
    border-radius: 999px;
    box-shadow: 0 12px 30px -15px rgba(20,18,15,.18);
    max-width: 34rem;
    margin-bottom: 1.25rem;
    transition: border-color .15s ease, box-shadow .15s ease;
}
.hero-search:focus-within {
    border-color: var(--accent);
    box-shadow: 0 0 0 4px var(--accent-soft), 0 12px 30px -15px rgba(20,18,15,.18);
}
.hero-search__field {
    flex: 1 1 14rem;
    position: relative;
    display: inline-flex;
    align-items: center;
}
.hero-search__icon {
    position: absolute;
    left: 1.1rem;
    width: 1.1rem;
    height: 1.1rem;
    color: var(--muted);
    pointer-events: none;
}
.hero-search:focus-within .hero-search__icon { color: var(--accent); }
.hero-search__input {
    width: 100%;
    padding: .85rem 1rem .85rem 2.85rem;
    border: none;
    background: transparent;
    font-size: 1rem;
    font-family: inherit;
    color: var(--text);
}
.hero-search__input:focus { outline: none; }
.hero-search__input::placeholder { color: var(--muted); opacity: .85; }
.hero-search__btn {
    border-radius: 999px;
    padding: .85rem 1.35rem;
    display: inline-flex;
    align-items: center;
    gap: .4rem;
}

.hero__actions {
    display: flex;
    flex-wrap: wrap;
    gap: .6rem 1.25rem;
    align-items: center;
    margin-bottom: 1.75rem;
}

.hero__trust {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 1.25rem;
    color: var(--muted);
    font-size: .88rem;
}
.hero__trust li {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
}
.hero__trust svg {
    width: 1rem;
    height: 1rem;
    color: var(--accent);
}

/* --- Hero visual (card preview + stats) ----------------------------- */
.hero__visual {
    display: grid;
    gap: 1rem;
}

.hero-preview {
    position: relative;
    aspect-ratio: 4 / 3;
    border-radius: var(--home-radius);
    overflow: hidden;
    background-size: cover;
    background-position: center;
    background-color: #5c5348;
    box-shadow: 0 28px 60px -25px rgba(20,18,15,.35),
                0 2px 0 rgba(255,255,255,.4) inset;
}
a.hero-preview--link {
    display: block;
    text-decoration: none;
    color: inherit;
    outline-offset: 3px;
}
a.hero-preview--link:focus-visible {
    box-shadow: 0 0 0 3px var(--accent-soft), 0 28px 60px -25px rgba(20,18,15,.35);
}
.hero-preview__spotlight-pill {
    position: absolute;
    top: 1rem;
    right: 1rem;
    z-index: 2;
    padding: 0.28rem 0.55rem;
    border-radius: 999px;
    font-size: 0.68rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    background: linear-gradient(135deg, #c9a227, #e8d48b);
    color: #2a2210;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
}
.hero-preview--parrucchiere    { background-color: #5c4033; }
.hero-preview--centro_estetico { background-color: #6b3d5c; }
.hero-preview--spa             { background-color: #2c4a5c; }
.hero-preview--salone          { background-color: #3d3d3b; }
.hero-preview--negozio         { background-color: #453d5e; }
.hero-preview--altro           { background-color: #0c5c52; }

.hero-preview__gradient {
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, transparent 30%, rgba(0,0,0,.55) 100%);
}
.hero-preview__badge {
    position: absolute;
    top: 1rem;
    left: 1rem;
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    padding: .4rem .65rem .4rem .55rem;
    background: rgba(255,255,255,.94);
    color: var(--text);
    border-radius: 999px;
    font-size: .78rem;
    font-weight: 600;
    backdrop-filter: blur(8px);
}
.hero-preview__badge-ico {
    width: .95rem;
    height: .95rem;
    color: var(--accent);
}
.hero-preview__meta {
    position: absolute;
    left: 1rem;
    right: 1rem;
    bottom: 1rem;
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: .75rem;
    color: #fff;
}
.hero-preview__city {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    font-size: .95rem;
    font-weight: 500;
}
.hero-preview__city svg { width: 1rem; height: 1rem; opacity: .9; }
.hero-preview__price {
    font-size: 1.25rem;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    letter-spacing: -.01em;
}
.hero-preview__price-unit {
    font-size: .75rem;
    font-weight: 500;
    opacity: .85;
}
.hero-preview--placeholder {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1rem 1.15rem;
    background: linear-gradient(135deg, rgba(12,92,82,.12), rgba(12,92,82,.05));
    color: var(--muted);
    font-size: .88rem;
    line-height: 1.45;
    border: 1px dashed var(--border);
    box-shadow: none;
}
.hero-preview--placeholder.hero-preview--placeholder-has-bg {
    position: relative;
    border: none;
    color: rgba(255, 255, 255, 0.92);
    background-color: #5c5348;
    box-shadow: 0 28px 60px -25px rgba(20, 18, 15, 0.35),
        0 2px 0 rgba(255, 255, 255, 0.4) inset;
}
.hero-preview--placeholder.hero-preview--placeholder-has-bg .hero-preview__gradient {
    z-index: 0;
}
.hero-preview--placeholder.hero-preview--placeholder-has-bg .hero-preview-placeholder__inner {
    position: relative;
    z-index: 1;
}
.hero-preview--placeholder.hero-preview--placeholder-has-bg .hero-preview-placeholder__title {
    color: #fff;
}
.hero-preview--placeholder.hero-preview--placeholder-has-bg .hero-preview-placeholder__tip,
.hero-preview--placeholder.hero-preview--placeholder-has-bg .hero-preview-placeholder__hint {
    color: rgba(255, 255, 255, 0.88);
}
.hero-preview--placeholder.hero-preview--placeholder-has-bg .hero-preview-placeholder__tip strong {
    color: #fff;
    font-weight: 600;
}
.hero-preview--placeholder.hero-preview--placeholder-has-bg .hero-preview-placeholder__hint a {
    color: #fff;
    font-weight: 600;
    text-decoration: underline;
    text-underline-offset: 0.12em;
}
.hero-preview--placeholder.hero-preview--placeholder-has-bg .btn-primary {
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.25);
}
.hero-preview-placeholder__inner {
    max-width: 18rem;
    text-align: center;
}
.hero-preview-placeholder__title {
    margin: 0 0 0.5rem;
    font-size: 1rem;
    font-weight: 700;
    letter-spacing: -0.02em;
    color: var(--text);
}
.hero-preview-placeholder__tip {
    margin: 0 0 0.65rem;
    color: var(--muted);
}
.hero-preview-placeholder__tip strong {
    color: var(--text-2);
    font-weight: 600;
}
.hero-preview-placeholder__cta {
    margin-top: 0.15rem;
}
.hero-preview-placeholder__hint {
    margin: 0;
    font-size: 0.82rem;
    color: var(--muted);
}
.hero-preview-placeholder__hint a {
    font-weight: 600;
    color: var(--accent-hover);
}

.hero-stats {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0;
    padding: 1.1rem 1.25rem;
    background: var(--surface);
    border: 1px solid var(--home-hairline);
    border-radius: var(--home-radius-sm);
    box-shadow: 0 2px 0 rgba(255,255,255,.6) inset;
}
.hero-stat {
    display: flex;
    flex-direction: column;
    gap: .15rem;
    padding: 0 .75rem;
    border-left: 1px solid var(--home-hairline);
}
.hero-stat:first-child { border-left: none; padding-left: 0; }
.hero-stat__n {
    font-size: 1.5rem;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    letter-spacing: -.02em;
    color: var(--text);
    line-height: 1.1;
}
.hero-stat__lbl {
    font-size: .78rem;
    color: var(--muted);
}

/* --- Strip ricerche frequenti --------------------------------------- */
.strip {
    padding: 1.5rem 0;
    border-bottom: 1px solid var(--home-hairline);
}
.strip__inner {
    display: flex;
    align-items: center;
    gap: 1.25rem;
    flex-wrap: wrap;
}
.strip__label {
    font-size: .72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .09em;
    color: var(--muted);
}
.strip__pills {
    display: flex;
    flex-wrap: wrap;
    gap: .4rem;
    flex: 1 1 auto;
}
.pill {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    padding: .4rem .85rem;
    background: var(--surface);
    border: 1px solid var(--home-hairline);
    border-radius: 999px;
    text-decoration: none;
    color: var(--text);
    font-size: .88rem;
    font-weight: 500;
    transition: border-color .15s, box-shadow .15s, transform .15s;
}
.pill:hover {
    border-color: var(--accent);
    box-shadow: var(--shadow-sm);
    transform: translateY(-1px);
}
.pill__n {
    font-size: .72rem;
    font-weight: 700;
    color: var(--accent);
    background: var(--accent-soft);
    padding: .1rem .4rem;
    border-radius: 999px;
    font-variant-numeric: tabular-nums;
}
.pill--ghost {
    background: transparent;
    color: var(--muted);
    border-style: dashed;
}
.pill--ghost .btn__ico { width: .9rem; height: .9rem; }
.pill--ghost:hover { color: var(--accent); }

/* --- Sections --------------------------------------------------------- */
.page-home .section {
    padding: 3rem 0;
    border-bottom: 1px solid var(--home-hairline);
}
.page-home .section--alt {
    background: linear-gradient(180deg, rgba(255,255,255,.5) 0%, transparent 60%);
}
.page-home .section:last-of-type { border-bottom: none; }

.page-home .section-head {
    margin-bottom: 2rem;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: flex-end;
    gap: 1rem;
}
.page-home .section-head--center {
    text-align: center;
    max-width: 40rem;
    margin: 0 auto 2.25rem;
    justify-content: center;
}
.page-home .section-head--row { align-items: center; }

.section-head__eyebrow {
    margin: 0 0 .4rem;
    font-size: .72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .09em;
    color: var(--accent);
}
.page-home .section-head__title {
    font-family: var(--font-display);
    font-size: clamp(1.9rem, 3.2vw, 2.5rem);
    font-weight: 400;
    margin: 0 0 .4rem;
    letter-spacing: -.02em;
    line-height: 1.15;
}
.page-home .section-head__text {
    margin: 0;
    color: var(--muted);
    font-size: 1.02rem;
    max-width: 38rem;
}

/* --- Categorie card ------------------------------------------------- */
.cat-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(14rem, 1fr));
    gap: .85rem;
}
.cat-card {
    position: relative;
    display: grid;
    grid-template-columns: auto 1fr auto;
    grid-template-rows: auto auto;
    grid-template-areas:
        "ico name arrow"
        "ico n    arrow";
    gap: .15rem .9rem;
    padding: 1.15rem 1.25rem;
    background: var(--surface);
    border: 1px solid var(--home-hairline);
    border-radius: var(--home-radius-sm);
    text-decoration: none;
    color: inherit;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.cat-card:hover {
    border-color: var(--accent);
    box-shadow: 0 12px 30px -18px rgba(12,92,82,.4);
    transform: translateY(-2px);
}
.cat-card__ico-wrap {
    grid-area: ico;
    width: 2.6rem;
    height: 2.6rem;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--accent-soft);
    color: var(--accent);
    align-self: center;
}
.cat-card__ico { width: 1.3rem; height: 1.3rem; }
.cat-card__name {
    grid-area: name;
    font-weight: 700;
    font-size: 1rem;
    color: var(--text);
    align-self: end;
}
.cat-card__n {
    grid-area: n;
    font-size: .82rem;
    color: var(--muted);
    align-self: start;
}
.cat-card__arrow {
    grid-area: arrow;
    align-self: center;
    color: var(--muted);
    opacity: .6;
    transition: transform .18s ease, color .18s ease, opacity .18s ease;
}
.cat-card__arrow svg { width: 1rem; height: 1rem; }
.cat-card:hover .cat-card__arrow {
    color: var(--accent);
    opacity: 1;
    transform: translateX(4px);
}

/* --- Space cards (In evidenza) --------------------------------------- */
.space-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(17rem, 1fr));
    gap: 1.25rem;
}
.space-card {
    position: relative;
    display: flex;
    flex-direction: column;
    background: var(--surface);
    border: 1px solid var(--home-hairline);
    border-radius: var(--home-radius);
    overflow: hidden;
    text-decoration: none;
    color: inherit;
    transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.space-card:hover {
    transform: translateY(-3px);
    border-color: var(--accent);
    box-shadow: 0 20px 40px -20px rgba(20,18,15,.25);
    color: inherit;
}
.sc__visual {
    position: relative;
    aspect-ratio: 16 / 10;
    background-size: cover;
    background-position: center;
    background-color: #5c5348;
}
.sc__visual--parrucchiere    { background-color: #5c4033; background-image: linear-gradient(135deg,#5c4033,#8b6914); }
.sc__visual--centro_estetico { background-color: #6b3d5c; background-image: linear-gradient(135deg,#6b3d5c,#9b5f85); }
.sc__visual--spa             { background-color: #2c4a5c; background-image: linear-gradient(135deg,#2c4a5c,#4a7a8c); }
.sc__visual--salone          { background-color: #3d3d3b; background-image: linear-gradient(135deg,#3d3d3b,#6b6965); }
.sc__visual--negozio         { background-color: #453d5e; background-image: linear-gradient(135deg,#453d5e,#6c5b8a); }
.sc__visual--altro           { background-color: #0c5c52; background-image: linear-gradient(135deg,#0c5c52,#3a8f85); }
/* Nota: quando c'è una foto, il template imposta inline
   style="background-image:url(...)". Lo stile inline vince sempre sui
   gradient delle variant classes → niente override necessario qui. */

.sc__badge {
    position: absolute;
    top: .8rem;
    left: .8rem;
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    padding: .3rem .55rem .3rem .45rem;
    background: rgba(255,255,255,.95);
    color: var(--text);
    border-radius: 999px;
    font-size: .72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .03em;
    backdrop-filter: blur(8px);
}
.sc__badge-ico {
    width: .85rem;
    height: .85rem;
    color: var(--accent);
}
.sc__price {
    position: absolute;
    top: .8rem;
    right: .8rem;
    padding: .35rem .65rem;
    background: rgba(20,18,15,.82);
    color: #fff;
    border-radius: 999px;
    font-size: .95rem;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    letter-spacing: -.01em;
    backdrop-filter: blur(8px);
}
.sc__price-unit {
    font-size: .7rem;
    font-weight: 500;
    opacity: .85;
}
.sc__verified {
    position: absolute;
    bottom: .75rem;
    left: .8rem;
    z-index: 1;
    display: inline-flex;
    align-items: center;
    gap: .3rem;
    padding: .28rem .5rem .28rem .4rem;
    background: rgba(255, 255, 255, .96);
    color: var(--accent-hover);
    border: 1px solid rgba(12, 92, 82, .22);
    border-radius: 999px;
    font-size: .65rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .04em;
    backdrop-filter: blur(8px);
    box-shadow: 0 2px 10px rgba(20, 18, 15, .08);
}
.sc__verified-ico {
    width: .72rem;
    height: .72rem;
    flex-shrink: 0;
    color: var(--accent);
}
.sc__body {
    padding: 1.1rem 1.15rem 1.25rem;
    display: flex;
    flex-direction: column;
    gap: .55rem;
    flex: 1 1 auto;
}
.sc__title {
    margin: 0;
    font-size: 1.05rem;
    font-weight: 700;
    line-height: 1.3;
    letter-spacing: -.01em;
}
.sc__chips {
    margin: 0;
    display: flex;
    flex-wrap: wrap;
    gap: .3rem;
}
.sc__meta {
    margin: auto 0 0;
    display: flex;
    flex-wrap: wrap;
    gap: .65rem 1rem;
    color: var(--muted);
    font-size: .85rem;
}
.sc__meta-item {
    display: inline-flex;
    align-items: center;
    gap: .3rem;
}
.sc__meta-item svg {
    width: .9rem;
    height: .9rem;
    color: var(--muted);
    opacity: .85;
}

/* Empty state in evidenza */
.empty-card {
    text-align: center;
    padding: 2.75rem 1.5rem;
    background: var(--surface);
    border: 1px dashed var(--home-hairline);
    border-radius: var(--home-radius);
    max-width: 34rem;
    margin: 0 auto;
}
.empty-card p { color: var(--muted); margin: 0 0 1.25rem; }

/* --- Elenco professionisti (pubblico) -------------------------------- */
.pro-directory-count {
    margin: 0 0 1rem;
    font-size: .85rem;
    color: var(--muted);
    font-weight: 600;
}
.pro-directory-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1rem;
}
@media (min-width: 640px) {
    .pro-directory-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (min-width: 1024px) {
    .pro-directory-grid { grid-template-columns: repeat(3, 1fr); }
}
.pro-directory-grid--home {
    margin-top: 0.25rem;
}
@media (min-width: 1024px) {
    .pro-directory-grid--home { grid-template-columns: repeat(4, 1fr); }
}
.pro-card {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    padding: 1.2rem 1.25rem 1.15rem;
    background: var(--surface);
    border: 1px solid var(--home-hairline);
    border-radius: var(--home-radius);
    box-shadow: 0 2px 0 rgba(255, 255, 255, 0.55) inset;
    min-height: 100%;
}
.pro-card__head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.5rem;
}
.pro-card__title {
    margin: 0;
    font-size: 1.02rem;
    font-weight: 700;
    line-height: 1.3;
    letter-spacing: -0.01em;
}
.pro-card__badge {
    flex-shrink: 0;
    padding: 0.2rem 0.45rem;
    border-radius: 6px;
    font-size: 0.65rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    background: linear-gradient(135deg, #c9a227, #e8d48b);
    color: #2a2210;
}
.pro-card__meta {
    margin: 0;
    display: flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.88rem;
    color: var(--muted);
}
.pro-card__ico {
    width: 0.9rem;
    height: 0.9rem;
    flex-shrink: 0;
    opacity: 0.9;
}
.pro-card__piva {
    margin: 0;
    font-size: 0.8rem;
    color: var(--muted);
    font-variant-numeric: tabular-nums;
}
.pro-card__cta {
    margin-top: auto;
    align-self: flex-start;
}

.pro-detail-wrap {
    max-width: 38rem;
}
.pro-detail-back {
    margin: 0 0 1rem;
}
.pro-detail-back__a {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.9rem;
    font-weight: 600;
    color: var(--accent-hover);
    text-decoration: none;
}
.pro-detail-back__a:hover {
    text-decoration: underline;
}
.pro-detail-back__ico {
    width: 1rem;
    height: 1rem;
}
.pro-detail-card {
    padding: 1.5rem 1.6rem 1.6rem;
}
.pro-detail-card__head {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.65rem;
    margin-bottom: 1rem;
}
.pro-detail-card__title {
    margin: 0;
    font-family: var(--font-display);
    font-size: clamp(1.5rem, 3vw, 2rem);
    font-weight: 400;
    line-height: 1.15;
}
.pro-detail-card__row {
    margin: 0 0 0.65rem;
    font-size: 1rem;
    display: flex;
    align-items: center;
    gap: 0.4rem;
}
.pro-detail-card__row--muted {
    color: var(--muted);
    font-size: 0.92rem;
}
.pro-detail-card__hint {
    margin: 1.25rem 0 0;
    padding-top: 1rem;
    border-top: 1px solid var(--hairline);
    font-size: 0.9rem;
    color: var(--muted);
}
.pro-detail-card__hint a {
    font-weight: 600;
    color: var(--accent-hover);
}

.pro-card__avatar {
    width: 3.5rem;
    height: 3.5rem;
    border-radius: 12px;
    overflow: hidden;
    flex-shrink: 0;
    background: var(--border);
    margin-bottom: 0.15rem;
}
.pro-card__avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
.pro-card__headline {
    margin: 0;
    font-size: 0.86rem;
    line-height: 1.4;
    color: var(--muted);
}

.pro-detail-wrap--wide {
    max-width: 52rem;
}
.pro-detail-public {
    padding: 0;
    overflow: hidden;
}
.pro-detail-public__hero {
    display: grid;
    gap: 1.25rem;
    padding: 1.5rem 1.6rem 1.25rem;
    border-bottom: 1px solid var(--hairline);
}
@media (min-width: 640px) {
    .pro-detail-public__hero {
        grid-template-columns: 10rem 1fr;
        align-items: start;
    }
}
.pro-detail-public__photo {
    width: 100%;
    max-width: 10rem;
    aspect-ratio: 1;
    border-radius: var(--radius-lg);
    overflow: hidden;
    background: var(--border);
}
.pro-detail-public__photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
.pro-detail-public__photo--placeholder {
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, var(--accent-soft), var(--border));
    font-size: 2.5rem;
    font-weight: 800;
    color: var(--accent);
}
.pro-detail-public__intro {
    min-width: 0;
}
.pro-detail-public__head {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.35rem;
}
.pro-detail-public__title {
    margin: 0;
    font-family: var(--font-display);
    font-size: clamp(1.55rem, 3vw, 2rem);
    font-weight: 400;
    line-height: 1.15;
}
.pro-detail-public__headline {
    margin: 0 0 0.5rem;
    font-size: 1.05rem;
    font-weight: 600;
    color: var(--text);
}
.pro-detail-public__meta {
    margin: 0 0 0.35rem;
    font-size: 0.95rem;
    display: flex;
    align-items: center;
    gap: 0.35rem;
}
.pro-detail-public__meta--muted {
    color: var(--muted);
    font-size: 0.88rem;
}
.pro-detail-public__block {
    padding: 1.35rem 1.6rem;
    border-bottom: 1px solid var(--hairline);
}
.pro-detail-public__block:last-of-type {
    border-bottom: none;
}
.pro-detail-public__h {
    margin: 0 0 0.65rem;
    font-size: 0.8rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--muted);
}
.pro-detail-public__bio {
    font-size: 1rem;
    line-height: 1.6;
    color: var(--text);
}
.pro-detail-public__grid-2 {
    display: grid;
    gap: 1.25rem;
}
@media (min-width: 560px) {
    .pro-detail-public__grid-2 {
        grid-template-columns: 1fr 1fr;
    }
}
.pro-detail-pills {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
}
.pro-detail-pills__i {
    margin: 0;
    padding: 0.35rem 0.75rem;
    border-radius: 999px;
    font-size: 0.85rem;
    background: var(--accent-soft);
    color: var(--accent-hover);
    font-weight: 600;
}
.pro-detail-certs {
    margin: 0;
    padding: 0 0 0 1.1rem;
    line-height: 1.55;
}
.pro-detail-certs__sub {
    display: block;
    font-size: 0.88rem;
    color: var(--muted);
    font-weight: 500;
}
.pro-detail-contacts {
    list-style: none;
    padding: 0;
}
.pro-detail-contacts li {
    margin-bottom: 0.35rem;
}
.pro-detail-contacts a {
    font-weight: 600;
    color: var(--accent-hover);
}
.pro-detail-portfolio {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 0.5rem;
}
@media (min-width: 640px) {
    .pro-detail-portfolio {
        grid-template-columns: repeat(3, 1fr);
    }
}
.pro-detail-portfolio__a {
    display: block;
    border-radius: 10px;
    overflow: hidden;
    border: 1px solid var(--hairline);
    aspect-ratio: 4/3;
    background: var(--border);
}
.pro-detail-portfolio__a img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
.pro-detail-public .pro-detail-card__hint--last {
    margin-bottom: 0;
    padding-bottom: 1.5rem;
}

/* Wizard profilo professionista (pro/dashboard) */
.pro-wizard-section {
    margin-bottom: 2rem;
}
.pro-wizard-head {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
    margin-bottom: 1.25rem;
}
@media (min-width: 720px) {
    .pro-wizard-head {
        flex-direction: row;
        align-items: flex-start;
        justify-content: space-between;
    }
}
.pro-wizard-score {
    display: flex;
    gap: 1rem;
    align-items: center;
    flex: 1;
    min-width: 0;
}
.pro-wizard-score__ring {
    --p: 0;
    position: relative;
    width: 4.5rem;
    height: 4.5rem;
    border-radius: 50%;
    background: conic-gradient(var(--accent) calc(var(--p) * 1%), var(--border) 0);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}
.pro-wizard-score__ring::after {
    content: "";
    position: absolute;
    width: 72%;
    height: 72%;
    border-radius: 50%;
    background: var(--surface);
}
.pro-wizard-score__val {
    position: relative;
    z-index: 1;
    font-size: 0.95rem;
    font-weight: 800;
    color: var(--accent);
}
.pro-wizard-score__text {
    min-width: 0;
}
.pro-wizard-score__text strong {
    display: block;
    font-size: 1.05rem;
    margin-bottom: 0.25rem;
}
.pro-wizard-score__sub {
    display: block;
    font-size: 0.82rem;
    color: var(--muted);
    line-height: 1.45;
    margin-top: 0.2rem;
}
.pro-wizard-steps {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
    align-items: center;
}
.pro-wizard-steps__i a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    border-radius: 8px;
    font-size: 0.85rem;
    font-weight: 700;
    text-decoration: none;
    border: 1px solid var(--hairline);
    color: var(--muted);
    background: var(--surface);
}
.pro-wizard-steps__i.is-done a {
    background: var(--accent-soft);
    border-color: var(--accent);
    color: var(--accent-hover);
}
.pro-wizard-steps__i.is-current a {
    background: var(--accent);
    border-color: var(--accent);
    color: #fff;
}
.pro-wizard-errors {
    margin-bottom: 1rem;
}
.pro-wizard-card__title {
    margin: 0 0 0.35rem;
    font-size: 1.2rem;
}
.pro-wizard-card__lead {
    margin: 0 0 1.25rem;
    color: var(--muted);
    font-size: 0.95rem;
    line-height: 1.5;
}
.pro-wizard-form .field {
    margin-bottom: 1rem;
}
.pro-wizard-form__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    align-items: center;
    margin-top: 1.25rem;
    padding-top: 1rem;
    border-top: 1px solid var(--hairline);
}
.field-grid-2 {
    display: grid;
    gap: 1rem;
}
@media (min-width: 560px) {
    .field-grid-2 {
        grid-template-columns: 1fr 1fr;
    }
}
.pro-spec-grid {
    display: grid;
    gap: 0.5rem;
}
@media (min-width: 640px) {
    .pro-spec-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}
.pro-spec-item {
    display: flex;
    gap: 0.5rem;
    align-items: flex-start;
    padding: 0.55rem 0.65rem;
    border: 1px solid var(--hairline);
    border-radius: 10px;
    cursor: pointer;
    font-size: 0.9rem;
    line-height: 1.35;
}
.pro-spec-item input {
    margin-top: 0.2rem;
}
.pro-cert-table-wrap {
    overflow-x: auto;
    margin-bottom: 0.5rem;
}
.pro-cert-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.88rem;
}
.pro-cert-table th,
.pro-cert-table td {
    border: 1px solid var(--hairline);
    padding: 0.35rem;
    vertical-align: middle;
}
.pro-cert-table th {
    text-align: left;
    background: rgba(0, 0, 0, 0.03);
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}
.pro-wizard-hint {
    margin: 0 0 0.5rem;
}
.pro-photo-preview {
    margin-bottom: 1rem;
}
.pro-photo-preview img {
    width: 12.5rem;
    height: 12.5rem;
    object-fit: cover;
    border-radius: var(--radius-lg);
    border: 1px solid var(--hairline);
}
.pro-checkbox {
    display: flex;
    align-items: center;
    gap: 0.45rem;
    font-size: 0.9rem;
    margin-bottom: 0.75rem;
}
.pro-portfolio-edit-grid {
    list-style: none;
    margin: 0 0 1rem;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 0.65rem;
}
@media (min-width: 640px) {
    .pro-portfolio-edit-grid {
        grid-template-columns: repeat(4, 1fr);
    }
}
.pro-portfolio-edit-item {
    position: relative;
    border-radius: 10px;
    overflow: hidden;
    border: 1px solid var(--hairline);
    aspect-ratio: 1;
    background: var(--border);
}
.pro-portfolio-edit-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
.pro-checkbox--overlay {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    margin: 0;
    padding: 0.35rem 0.45rem;
    background: linear-gradient(transparent, rgba(0, 0, 0, 0.65));
    color: #fff;
    font-size: 0.78rem;
}
.pro-checkbox--overlay input {
    accent-color: var(--accent);
}
.pro-wizard-breakdown {
    margin-top: 1.25rem;
    padding: 0 0 0.5rem;
    border-top: 1px dashed var(--hairline);
    font-size: 0.88rem;
}
.pro-wizard-breakdown summary {
    cursor: pointer;
    font-weight: 600;
    padding: 0.75rem 0 0.25rem;
    color: var(--muted);
}
.pro-wizard-breakdown__list {
    margin: 0.5rem 0 0;
    padding: 0 0 0 1.1rem;
    color: var(--muted);
}
.pro-wizard-breakdown__list li.is-done {
    color: var(--text);
}
.pro-wizard-ok {
    color: var(--accent);
    font-weight: 800;
    margin-left: 0.25rem;
}

/* Onboarding struttura (host/onboarding) */
.page-host-onboarding .main-content--fluid {
    padding-left: max(1rem, env(safe-area-inset-left, 0px));
    padding-right: max(1rem, env(safe-area-inset-right, 0px));
}
.host-onboarding-wrap {
    max-width: 38rem;
    margin: 0 auto;
    padding: 0.5rem 0 2.5rem;
}
.host-onboarding-head {
    margin-bottom: 1.25rem;
}
.host-onboarding-eyebrow {
    margin: 0 0 0.35rem;
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--muted);
}
.host-onboarding-title {
    margin: 0 0 0.5rem;
    font-family: var(--font-display);
    font-size: clamp(1.35rem, 3vw, 1.65rem);
    font-weight: 400;
    line-height: 1.2;
    color: var(--text);
}
.host-onboarding-lead {
    margin: 0;
    font-size: 0.95rem;
    line-height: 1.55;
    color: var(--muted);
}
.host-onboarding-steps {
    list-style: none;
    margin: 0 0 1rem;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
    align-items: center;
}
.host-onboarding-steps__i a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    border-radius: 8px;
    font-size: 0.85rem;
    font-weight: 700;
    text-decoration: none;
    border: 1px solid var(--hairline);
    color: var(--muted);
    background: var(--surface);
}
.host-onboarding-steps__i.is-done a {
    background: var(--accent-soft);
    border-color: var(--accent);
    color: var(--accent-hover);
}
.host-onboarding-steps__i.is-current a {
    background: var(--accent);
    border-color: var(--accent);
    color: #fff;
}
.host-onboarding-card {
    padding: 1.35rem 1.4rem 1.5rem;
}
.host-onboarding-card__h {
    margin: 0 0 1.1rem;
    font-size: 1.1rem;
    font-weight: 700;
}
.host-onboarding-form .field {
    margin-bottom: 1rem;
}
.host-ob-grid {
    display: grid;
    gap: 1rem;
}
@media (min-width: 520px) {
    .host-ob-grid {
        grid-template-columns: 1fr 1fr;
    }
}
.host-onboarding-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    align-items: center;
    margin-top: 0.25rem;
    padding-top: 1rem;
    border-top: 1px solid var(--hairline);
}
.host-onboarding-skip {
    margin-top: 1rem;
    padding-top: 1rem;
    border-top: 1px dashed var(--hairline);
    text-align: center;
}

.host-onboarding-toolbar {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    justify-content: flex-end;
    align-items: center;
    margin-bottom: 1rem;
}

/* Dashboard host — accessi rapidi */
.host-dash-quick {
    margin-bottom: 1.35rem;
}
.host-dash-quick__label {
    margin: 0 0 0.65rem;
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.07em;
    color: var(--muted);
}
.host-dash-quick__grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
    gap: 0.65rem;
}
@media (min-width: 640px) {
    .host-dash-quick__grid {
        grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
    }
}
.host-dash-quick__tile {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.25rem;
    text-align: left;
    text-decoration: none;
    padding: 0.85rem 1rem;
    border-radius: 12px;
    line-height: 1.35;
    min-height: 4.25rem;
    transition: transform 0.12s ease, box-shadow 0.12s ease;
}
.host-dash-quick__tile:hover {
    transform: translateY(-1px);
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.06);
}
.host-dash-quick__tile--main {
    grid-column: 1 / -1;
    color: #fff;
}
.host-dash-quick__tile--main .host-dash-quick__d {
    opacity: 0.92;
}
@media (min-width: 520px) {
    .host-dash-quick__tile--main {
        grid-column: span 2;
    }
}
.host-dash-quick__ico {
    width: 1.35rem;
    height: 1.35rem;
    opacity: 0.95;
    margin-bottom: 0.15rem;
}
.host-dash-quick__t {
    font-weight: 700;
    font-size: 0.95rem;
    color: inherit;
}
.host-dash-quick__d {
    font-size: 0.78rem;
    font-weight: 500;
    opacity: 0.85;
    color: inherit;
}
.host-dash-hint {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 1.25rem;
    padding: 1rem 1.15rem;
}
.host-dash-hint__body {
    flex: 1 1 16rem;
    font-size: 0.92rem;
    line-height: 1.45;
}
.host-dash-hint__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    align-items: center;
}
.host-dash-hint__dismiss {
    margin: 0;
}

/* Profilo host */
.page-host-profile .host-profile-status {
    padding: 0.85rem 1.1rem;
    border-radius: 10px;
    border: 1px solid var(--hairline);
    margin-bottom: 1.25rem;
    font-size: 0.92rem;
    line-height: 1.45;
    background: rgba(0, 0, 0, 0.02);
}
.page-host-profile .host-profile-status--ok {
    border-color: rgba(14, 107, 92, 0.28);
    background: var(--accent-soft);
}
.host-profile-card {
    margin-bottom: 1.5rem;
}
.host-profile-card__h {
    margin: 0 0 0.35rem;
    font-size: 1.15rem;
    font-weight: 700;
    display: flex;
    align-items: center;
    gap: 0.45rem;
}
.host-profile-card__h .ico {
    width: 1.25rem;
    height: 1.25rem;
    opacity: 0.9;
}
.host-profile-card__intro {
    margin: 0 0 1.1rem;
    font-size: 0.9rem;
    color: var(--muted);
    line-height: 1.45;
}
.host-profile-actions {
    margin-top: 0.5rem;
    padding-top: 1rem;
    border-top: 1px solid var(--hairline);
}

/* Selettore tema scheda annuncio (host/profile) */
.host-theme-grid {
    display: grid;
    gap: 0.75rem;
    grid-template-columns: 1fr;
}
@media (min-width: 560px) {
    .host-theme-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}
.host-theme-option {
    cursor: pointer;
    margin: 0;
}
.host-theme-option input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}
.host-theme-option__tile {
    display: flex;
    flex-direction: column;
    gap: 0.65rem;
    height: 100%;
    padding: 0.85rem 0.95rem;
    border-radius: 12px;
    border: 2px solid var(--hairline);
    background: var(--surface);
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
.host-theme-option:hover .host-theme-option__tile {
    border-color: rgba(12, 92, 82, 0.35);
}
.host-theme-option:has(input:checked) .host-theme-option__tile,
.host-theme-option--checked .host-theme-option__tile {
    border-color: var(--accent);
    box-shadow: 0 0 0 1px var(--accent-soft);
}
.host-theme-option__swatch {
    display: block;
    height: 3.25rem;
    border-radius: 8px;
    border: 1px solid rgba(0, 0, 0, 0.06);
}
.host-theme-option__tile--default .host-theme-option__swatch {
    background: linear-gradient(135deg, #0c5c52 0%, #3a8f85 55%, #f3f0ea 55%);
}
.host-theme-option__tile--warm .host-theme-option__swatch {
    background: linear-gradient(135deg, #a0523d 0%, #d4a574 50%, #faf6f1 100%);
}
.host-theme-option__tile--minimal .host-theme-option__swatch {
    background: linear-gradient(180deg, #111827 0%, #111827 42%, #ffffff 42%, #e5e7eb 100%);
}
.host-theme-option__title {
    display: block;
    font-size: 0.92rem;
    margin-bottom: 0.25rem;
}
.host-theme-option__desc {
    display: block;
    font-size: 0.78rem;
    font-weight: 500;
    line-height: 1.4;
    color: var(--muted);
}
.host-theme-form .host-profile-actions {
    margin-top: 1rem;
}

/* --- Come funziona --------------------------------------------------- */
.how-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1.25rem;
}
@media (min-width: 768px) {
    .how-grid { grid-template-columns: repeat(2, 1fr); }
}
.how-card {
    background: var(--surface);
    border: 1px solid var(--home-hairline);
    border-radius: var(--home-radius);
    padding: 1.75rem 1.85rem;
    box-shadow: 0 2px 0 rgba(255,255,255,.55) inset;
    position: relative;
}
.how-card::before {
    content: "";
    position: absolute;
    top: 0;
    left: 1.85rem;
    width: 2.5rem;
    height: 3px;
    background: var(--accent);
    border-radius: 0 0 3px 3px;
}
.how-card__num {
    display: inline-block;
    font-size: .78rem;
    font-weight: 800;
    color: var(--accent);
    letter-spacing: .08em;
    margin-bottom: .5rem;
}
.how-card__title {
    margin: 0 0 .65rem;
    font-size: 1.25rem;
    font-weight: 700;
    letter-spacing: -.01em;
}
.how-card__text {
    margin: 0 0 1rem;
    color: var(--muted);
    font-size: .95rem;
    line-height: 1.6;
}
.how-card__list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: .45rem;
    font-size: .92rem;
}
.how-card__list li {
    display: flex;
    align-items: center;
    gap: .55rem;
}
.how-card__list svg {
    width: 1rem;
    height: 1rem;
    color: var(--accent);
    flex-shrink: 0;
}

/* --- CTA finale ------------------------------------------------------ */
.cta {
    padding: 2.5rem 0 3.5rem;
}
.cta__inner {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 1.75rem;
    padding: 2.25rem 2rem;
    background: linear-gradient(135deg, var(--accent) 0%, #0a4d45 60%, #1a3d38 100%);
    border-radius: var(--home-radius);
    color: #e8f5f3;
    box-shadow: 0 30px 60px -30px rgba(12,92,82,.55);
    position: relative;
    overflow: hidden;
}
.cta__inner::before {
    content: "";
    position: absolute;
    top: -30%;
    right: -10%;
    width: 50%;
    height: 160%;
    background: radial-gradient(ellipse at center, rgba(255,255,255,.12), transparent 60%);
    pointer-events: none;
}
.cta__text { position: relative; }
.cta__title {
    font-family: var(--font-display);
    font-size: clamp(1.7rem, 3vw, 2.1rem);
    font-weight: 400;
    margin: 0 0 .45rem;
    color: #fff;
    letter-spacing: -.01em;
}
.cta__lead {
    margin: 0;
    max-width: 32rem;
    opacity: .92;
    line-height: 1.55;
}
.cta__btns {
    position: relative;
    display: flex;
    flex-wrap: wrap;
    gap: .65rem;
}

/* --- Mappa home: tuning ---------------------------------------------- */
.page-home .home-map {
    height: min(440px, 58vh);
    border-radius: var(--home-radius);
}

/* --- Accessibilità / motion ------------------------------------------ */
.page-home .pill:focus-visible,
.page-home .cat-card:focus-visible,
.page-home .space-card:focus-visible {
    outline: none;
    box-shadow: 0 0 0 3px var(--accent-soft);
    border-color: var(--accent);
}

@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: .001ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .001ms !important;
    }
}

/* --- Responsive tweaks home (hero + sezioni) --------------------------- */
@media (max-width: 899px) {
    .page-home .hero,
    .hero {
        overflow-x: clip;
        padding: 1.35rem 0 2.25rem;
    }
    .hero .container {
        max-width: 100%;
        box-sizing: border-box;
    }
    .hero__content {
        min-width: 0;
        max-width: 100%;
    }
    .hero__title {
        font-size: clamp(1.65rem, 6.5vw, 2.35rem);
        word-break: break-word;
        overflow-wrap: anywhere;
    }
    .hero__sub {
        max-width: none;
        font-size: 0.98rem;
        margin-bottom: 1.35rem;
    }
    .hero__eyebrow {
        max-width: 100%;
        flex-wrap: wrap;
        font-size: 0.72rem;
    }
    .hero-search {
        max-width: none;
        width: 100%;
        flex-direction: column;
        align-items: stretch;
        border-radius: 16px;
        padding: 0.65rem;
        margin-bottom: 1rem;
        box-sizing: border-box;
    }
    .hero-search__field {
        flex: 1 1 auto;
        min-width: 0;
        width: 100%;
    }
    .hero-search__input {
        width: 100%;
        min-width: 0;
        font-size: 16px;
        box-sizing: border-box;
    }
    .hero-search__btn {
        width: 100%;
        justify-content: center;
        border-radius: 12px;
    }
    .hero__actions {
        flex-direction: column;
        align-items: stretch;
        gap: 0.55rem;
        margin-bottom: 1.35rem;
    }
    .hero__actions .btn,
    .hero__actions .btn-link {
        width: 100%;
        justify-content: center;
        text-align: center;
        box-sizing: border-box;
        padding: 0.75rem 1rem;
    }
    .hero__actions .btn-link {
        border: 1px solid var(--hairline);
        border-radius: 999px;
        background: var(--surface);
    }
    .hero__visual {
        min-width: 0;
        max-width: 100%;
    }
    .hero__trust {
        gap: 0.65rem 1rem;
        font-size: 0.82rem;
    }
    .hero-preview { aspect-ratio: 3 / 2; }
    .hero-stats { padding: .9rem 1rem; }
    .hero-stat { padding: 0 .5rem; }
    .hero-stat__n { font-size: 1.25rem; }
    .page-home .section { padding: 2.25rem 0; }
    .cta__inner { padding: 1.75rem 1.4rem; }
}

/* ============================================================
   SPACE DETAIL (space.php)  —  restyle completo, scoped .page-space
   ============================================================ */

.page-space {
    --sp-radius: 20px;
    --sp-radius-sm: 14px;
    --sp-hairline: #e7e2d9;
}

/* disattiva le vecchie regole hero del template precedente */
.page-space .space-hero,
.page-space .space-trust,
.page-space .space-gallery,
.page-space .space-detail__grid,
.page-space .space-detail,
.page-space .space-back { display: none; }

.page-space .main-content { padding-bottom: 5rem; }

/* --- Breadcrumb ---------------------------------------------------- */
.sp-crumb {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .5rem;
    padding: 1.25rem 0 .5rem;
    font-size: .88rem;
    color: var(--muted);
}
.sp-crumb__link {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    color: var(--muted);
    text-decoration: none;
    font-weight: 600;
    transition: color .15s ease;
}
.sp-crumb__link:hover { color: var(--accent); }
.sp-crumb__ico { width: 1rem; height: 1rem; }
.sp-crumb__sep { color: var(--border); }
.sp-crumb__cat { color: var(--text); font-weight: 500; }
.sp-crumb__city { color: var(--muted); }

/* --- Titolo ------------------------------------------------------- */
.sp-head {
    padding: .25rem 0 1.25rem;
}
.sp-head__top {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .6rem;
    margin-bottom: .85rem;
}
.sp-cat-badge {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    padding: .4rem .75rem .4rem .55rem;
    background: var(--accent-soft);
    color: var(--accent-hover);
    border-radius: 999px;
    font-size: .8rem;
    font-weight: 700;
    letter-spacing: .01em;
}
.sp-cat-badge__ico { width: 1rem; height: 1rem; color: var(--accent); }
.sp-verified {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    padding: .4rem .7rem .4rem .55rem;
    background: rgba(12,92,82,.12);
    color: var(--accent-hover);
    border: 1px solid rgba(12,92,82,.2);
    border-radius: 999px;
    font-size: .75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .04em;
}
.sp-verified__ico { width: .9rem; height: .9rem; }
.sp-title {
    font-family: var(--font-display);
    font-size: clamp(1.85rem, 3.8vw, 2.75rem);
    font-weight: 400;
    line-height: 1.1;
    letter-spacing: -.02em;
    margin: 0 0 .65rem;
}
.sp-subtitle {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .4rem .75rem;
    margin: 0;
    color: var(--muted);
    font-size: 1rem;
}
.sp-subtitle__item {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
}
.sp-subtitle__item svg {
    width: 1rem;
    height: 1rem;
    color: var(--accent);
    flex-shrink: 0;
}
.sp-subtitle__dot { color: var(--border); }

/* --- Galleria: layout main + 2x2 laterale -------------------------- */
.sp-gallery {
    display: grid;
    gap: .5rem;
    margin-bottom: 2rem;
}
.sp-grid > .sp-gallery {
    margin-bottom: 0;
}
@media (min-width: 820px) {
    .sp-gallery {
        grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr);
        grid-auto-rows: 1fr;
    }
}
.sp-gallery__main {
    position: relative;
    aspect-ratio: 16 / 10;
    background-size: cover;
    background-position: center;
    background-color: #5c5348;
    border: none;
    border-radius: var(--sp-radius);
    overflow: hidden;
    cursor: pointer;
    padding: 0;
    transition: transform .2s ease;
}
.sp-gallery__main:hover { transform: scale(1.01); }
.sp-gallery__main:focus-visible {
    outline: none;
    box-shadow: 0 0 0 3px var(--accent-soft);
}
.sp-gallery__count {
    position: absolute;
    bottom: 1rem;
    right: 1rem;
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    padding: .5rem .8rem .5rem .65rem;
    background: rgba(255,255,255,.95);
    color: var(--text);
    border-radius: 999px;
    font-size: .82rem;
    font-weight: 600;
    backdrop-filter: blur(8px);
    box-shadow: 0 2px 10px rgba(0,0,0,.2);
}
.sp-gallery__count-ico { width: 1rem; height: 1rem; color: var(--accent); }

.sp-gallery__side {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: repeat(2, 1fr);
    gap: .5rem;
}
@media (max-width: 819px) {
    .sp-gallery__side {
        grid-template-rows: auto;
        grid-auto-flow: column;
        grid-auto-columns: 40%;
        overflow-x: auto;
        scroll-snap-type: x mandatory;
        padding-bottom: .5rem;
    }
    .sp-gallery__thumb { scroll-snap-align: start; }
}
.sp-gallery__thumb {
    position: relative;
    aspect-ratio: 4 / 3;
    background-size: cover;
    background-position: center;
    background-color: #5c5348;
    border: none;
    border-radius: var(--sp-radius-sm);
    overflow: hidden;
    cursor: pointer;
    padding: 0;
    transition: transform .2s ease, box-shadow .2s ease;
}
.sp-gallery__thumb:hover {
    transform: scale(1.02);
    box-shadow: 0 10px 20px rgba(0,0,0,.12);
}
.sp-gallery__thumb:focus-visible {
    outline: none;
    box-shadow: 0 0 0 3px var(--accent-soft);
}
.sp-gallery__more {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(20,18,15,.6);
    color: #fff;
    font-size: 1.35rem;
    font-weight: 700;
    letter-spacing: -.02em;
    backdrop-filter: blur(2px);
}

/* placeholder (nessuna foto) */
.sp-gallery--empty .sp-gallery__main {
    cursor: default;
    aspect-ratio: 21 / 9;
    display: flex;
    align-items: center;
    justify-content: center;
}
.sp-gallery__main--placeholder {
    background-color: #5c5348;
    color: rgba(255,255,255,.55);
}
.sp-gallery__main--parrucchiere    { background: linear-gradient(135deg, #5c4033, #8b6914); }
.sp-gallery__main--centro_estetico { background: linear-gradient(135deg, #6b3d5c, #9b5f85); }
.sp-gallery__main--spa             { background: linear-gradient(135deg, #2c4a5c, #4a7a8c); }
.sp-gallery__main--salone          { background: linear-gradient(135deg, #3d3d3b, #6b6965); }
.sp-gallery__main--negozio         { background: linear-gradient(135deg, #453d5e, #6c5b8a); }
.sp-gallery__main--altro           { background: linear-gradient(135deg, #0c5c52, #3a8f85); }
.sp-gallery__placeholder-ico { width: 5rem; height: 5rem; }

/* --- Content grid -------------------------------------------------
   Desktop: prima riga = galleria | sidebar (stessa altezza d’ingresso),
   seconda riga = contenuto lungo | sidebar (aside span su entrambe le righe). */
.sp-grid {
    display: grid;
    gap: 2.5rem;
    align-items: start;
    grid-template-columns: 1fr;
    grid-template-areas:
        "gallery"
        "main"
        "aside";
}
.sp-grid > .sp-gallery { grid-area: gallery; }
.sp-grid > .sp-main { grid-area: main; }
.sp-grid > .sp-aside { grid-area: aside; }
@media (min-width: 960px) {
    .sp-grid {
        grid-template-columns: minmax(0, 1fr) 360px;
        grid-template-areas:
            "gallery aside"
            "main aside";
    }
}

/* --- Meta chips --------------------------------------------------- */
.sp-meta {
    list-style: none;
    padding: 0;
    margin: 0 0 2rem;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(11rem, 1fr));
    gap: .6rem;
}
.sp-meta__item {
    display: flex;
    align-items: center;
    gap: .75rem;
    padding: .75rem .85rem;
    background: var(--surface);
    border: 1px solid var(--sp-hairline);
    border-radius: var(--sp-radius-sm);
}
.sp-meta__ico {
    width: 1.25rem;
    height: 1.25rem;
    color: var(--accent);
    flex-shrink: 0;
}
.sp-meta__item > div {
    display: flex;
    flex-direction: column;
    line-height: 1.2;
    min-width: 0;
}
.sp-meta__label {
    font-size: .72rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .05em;
    color: var(--muted);
}
.sp-meta__value {
    font-size: .92rem;
    font-weight: 600;
    color: var(--text);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* --- Sezioni testuali -------------------------------------------- */
.sp-section {
    margin-bottom: 2rem;
    padding-bottom: 2rem;
    border-bottom: 1px solid var(--sp-hairline);
}
.sp-section:last-child {
    border-bottom: none;
    margin-bottom: 0;
    padding-bottom: 0;
}
.sp-section__title {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    font-family: var(--font-display);
    font-size: 1.45rem;
    font-weight: 400;
    letter-spacing: -.01em;
    margin: 0 0 .85rem;
}
.sp-section__ico {
    width: 1.25rem;
    height: 1.25rem;
    color: var(--accent);
}
.sp-section--accent {
    border-left: 3px solid var(--accent);
    padding: 1.25rem 1.35rem;
    background: linear-gradient(180deg, rgba(12,92,82,.05), transparent 70%);
    border-radius: 0 var(--sp-radius-sm) var(--sp-radius-sm) 0;
}
.sp-section--warn {
    border-left: 3px solid #c9a227;
    padding: 1.25rem 1.35rem;
    background: linear-gradient(180deg, rgba(201,162,39,.06), transparent 70%);
    border-radius: 0 var(--sp-radius-sm) var(--sp-radius-sm) 0;
}
.sp-section--accent,
.sp-section--warn {
    border-bottom-style: solid;
    border-bottom-width: 1px;
}

.sp-prose {
    line-height: 1.65;
    color: var(--text);
}
.sp-prose:last-child { margin-bottom: 0; }
.sp-section__note {
    margin: .85rem 0 0;
    font-size: .85rem;
    color: var(--muted);
}

/* Periodi non prenotabili */
.sp-unav {
    list-style: none;
    margin: .75rem 0 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: .55rem;
}
.sp-unav__item {
    display: flex;
    align-items: center;
    gap: .65rem;
    padding: .6rem .85rem;
    background: var(--surface);
    border: 1px solid var(--sp-hairline);
    border-radius: 10px;
    font-size: .92rem;
    font-variant-numeric: tabular-nums;
}
.sp-unav__ico {
    width: 1.1rem;
    height: 1.1rem;
    color: var(--muted);
    flex-shrink: 0;
}
.sp-unav__note { color: var(--muted); margin-left: .25rem; }

/* Pacchetti continuativi */
.sp-packages {
    display: grid;
    gap: 0.75rem;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    margin-top: 0.9rem;
}
.sp-package {
    border: 1px solid var(--sp-hairline);
    border-radius: 12px;
    padding: 0.9rem;
    background: var(--surface);
}
.sp-package__name {
    margin: 0;
    font-weight: 700;
    color: var(--text);
}
.sp-package__meta {
    margin: 0.25rem 0 0;
    color: var(--muted);
    font-size: 0.9rem;
}
.sp-package__price {
    margin: 0.5rem 0 0.7rem;
    font-weight: 700;
    color: var(--accent);
}

/* Calendario disponibilita */
.sp-cal {
    display: grid;
    gap: 0.9rem;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    margin-top: 0.8rem;
}
.sp-cal__month {
    border: 1px solid var(--sp-hairline);
    border-radius: 12px;
    background: var(--surface);
    padding: 0.75rem;
}
.sp-cal__title {
    margin: 0 0 0.55rem;
    font-size: 0.95rem;
    font-weight: 700;
}
.sp-cal__grid {
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    gap: 0.3rem;
}
.sp-cal__day {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 1.9rem;
    border-radius: 8px;
    font-size: 0.82rem;
    font-variant-numeric: tabular-nums;
    border: 1px solid transparent;
}
.sp-cal__day.is-free {
    background: color-mix(in srgb, var(--accent) 12%, white);
    color: var(--accent);
    border-color: color-mix(in srgb, var(--accent) 24%, white);
}
.sp-cal__day.is-busy {
    background: color-mix(in srgb, var(--danger) 10%, white);
    color: var(--danger);
    border-color: color-mix(in srgb, var(--danger) 22%, white);
}
.sp-cal__day.is-today {
    box-shadow: inset 0 0 0 2px var(--text);
}
.sp-cal-legend__dot {
    display: inline-block;
    width: 0.6rem;
    height: 0.6rem;
    border-radius: 50%;
    vertical-align: middle;
    margin: 0 0.2rem 0 0.35rem;
}
.sp-cal-legend__dot.is-free { background: var(--accent); }
.sp-cal-legend__dot.is-busy { background: var(--danger); }
.sp-cal__more {
    margin-top: 0.65rem;
}
.sp-cal__more summary {
    cursor: pointer;
    font-size: 0.9rem;
    font-weight: 600;
    color: var(--accent);
    user-select: none;
}
.sp-cal__more summary:hover {
    text-decoration: underline;
}
.sp-cal__more[open] summary {
    margin-bottom: 0.5rem;
}

/* --- Sidebar sticky ---------------------------------------------- */
.sp-aside__inner {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}
@media (min-width: 960px) {
    .sp-aside__inner {
        position: sticky;
        top: 5.5rem;
    }
}

/* CTA card */
.sp-cta {
    padding: 1.5rem 1.5rem 1.35rem;
    background: var(--surface);
    border: 1px solid var(--sp-hairline);
    border-radius: var(--sp-radius);
    box-shadow: 0 20px 40px -25px rgba(20,18,15,.25);
}
.sp-cta__price {
    display: flex;
    align-items: baseline;
    gap: .35rem;
    margin-bottom: .35rem;
}
.sp-cta__price-value {
    font-family: var(--font-display);
    font-size: 2rem;
    font-weight: 400;
    letter-spacing: -.02em;
    color: var(--text);
    font-variant-numeric: tabular-nums;
}
.sp-cta__price-unit {
    font-size: .95rem;
    color: var(--muted);
    font-weight: 500;
}
.sp-cta__note {
    margin: 0 0 1.1rem;
    font-size: .82rem;
    color: var(--muted);
    line-height: 1.5;
}
.sp-cta__hint {
    margin: .85rem 0 0;
    font-size: .85rem;
    color: var(--muted);
    line-height: 1.5;
}
.sp-cta__hint a { color: var(--accent); font-weight: 600; }
.sp-cta__hint--warn {
    padding: .65rem .75rem;
    background: rgba(201,162,39,.1);
    border: 1px solid rgba(201,162,39,.25);
    border-radius: 10px;
    color: #6d5700;
}

/* btn-block helper se non già definito abbastanza robusto */
.page-space .btn-block {
    display: inline-flex;
    width: 100%;
    justify-content: center;
    align-items: center;
    gap: .4rem;
    text-align: center;
}
.page-space .btn + .btn-block { margin-top: .6rem; }

/* Inquiry inline */
.sp-inquiry {
    padding: 1.25rem 1.35rem;
    background: var(--surface);
    border: 1px solid var(--sp-hairline);
    border-radius: var(--sp-radius);
}
.sp-inquiry__title {
    display: inline-flex;
    align-items: center;
    gap: .45rem;
    font-size: 1rem;
    margin: 0 0 .35rem;
}
.sp-inquiry__ico { width: 1.1rem; height: 1.1rem; color: var(--accent); }
.sp-inquiry__hint {
    margin: 0 0 .85rem;
    font-size: .85rem;
    color: var(--muted);
    line-height: 1.5;
}
.sp-inquiry__form textarea {
    width: 100%;
    min-height: 6rem;
    padding: .65rem .75rem;
    border: 1px solid var(--sp-hairline);
    border-radius: 10px;
    font-family: inherit;
    font-size: .95rem;
    line-height: 1.5;
    resize: vertical;
    margin-bottom: .75rem;
    background: var(--bg);
    transition: border-color .15s ease, box-shadow .15s ease;
}
.sp-inquiry__form textarea:focus {
    outline: none;
    border-color: var(--accent);
    box-shadow: 0 0 0 3px var(--accent-soft);
    background: var(--surface);
}

/* Mappa card */
.sp-map-box {
    background: var(--surface);
    border: 1px solid var(--sp-hairline);
    border-radius: var(--sp-radius);
    overflow: hidden;
}
.sp-map-box__head {
    display: flex;
    align-items: center;
    gap: .45rem;
    padding: 1rem 1.2rem .25rem;
}
.sp-map-box__ico { width: 1.1rem; height: 1.1rem; color: var(--accent); }
.sp-map-box__title {
    margin: 0;
    font-size: 1rem;
    font-weight: 700;
}
.sp-map {
    height: 220px;
    width: 100%;
    margin-top: .65rem;
    background: #dfe8ec;
}
.sp-map-box__addr {
    margin: 0;
    padding: .85rem 1.2rem 1rem;
    font-size: .85rem;
    color: var(--muted);
    line-height: 1.4;
}

.sp-aside__help {
    margin: .25rem 0 0;
    font-size: .9rem;
    text-align: center;
}
.sp-aside__help-link {
    display: inline-flex;
    align-items: center;
    gap: .3rem;
    color: var(--accent);
    font-weight: 600;
    text-decoration: none;
}
.sp-aside__help-link:hover .btn__ico { transform: translateX(3px); }

/* --- Floating CTA mobile ----------------------------------------- */
.sp-mobile-bar {
    display: none;
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 50;
    padding: .75rem 1rem;
    background: rgba(255,255,255,.96);
    backdrop-filter: blur(10px);
    border-top: 1px solid var(--sp-hairline);
    box-shadow: 0 -8px 30px -10px rgba(20,18,15,.18);
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}
.sp-mobile-bar__price {
    display: flex;
    flex-direction: column;
    line-height: 1.1;
}
.sp-mobile-bar__n {
    font-family: var(--font-display);
    font-size: 1.35rem;
    font-weight: 400;
    letter-spacing: -.02em;
    font-variant-numeric: tabular-nums;
}
.sp-mobile-bar__u { font-size: .78rem; color: var(--muted); }
@media (max-width: 959px) {
    .sp-mobile-bar { display: flex; }
    .page-space .main-content { padding-bottom: 6rem; }
}

/* --- Lightbox galleria ------------------------------------------- */
body.no-scroll { overflow: hidden; }

.lb {
    position: fixed;
    inset: 0;
    z-index: 1000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1.5rem;
    background: rgba(20,18,15,.92);
    backdrop-filter: blur(6px);
    animation: lbFade .18s ease-out;
}
.lb[hidden] { display: none; }

@keyframes lbFade {
    from { opacity: 0; }
    to   { opacity: 1; }
}

.lb__figure {
    position: relative;
    margin: 0;
    max-width: 90vw;
    max-height: 85vh;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: .75rem;
}
.lb__img {
    max-width: 90vw;
    max-height: 80vh;
    object-fit: contain;
    border-radius: 12px;
    box-shadow: 0 30px 80px rgba(0,0,0,.55);
    background: #1a1a1a;
}
.lb__counter {
    font-size: .85rem;
    color: rgba(255,255,255,.72);
    font-variant-numeric: tabular-nums;
    letter-spacing: .02em;
}

.lb__close,
.lb__prev,
.lb__next {
    position: absolute;
    background: rgba(255,255,255,.12);
    color: #fff;
    border: 1px solid rgba(255,255,255,.22);
    border-radius: 999px;
    width: 3rem;
    height: 3rem;
    padding: 0;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background .15s ease, transform .15s ease;
}
.lb__close:hover,
.lb__prev:hover,
.lb__next:hover {
    background: rgba(255,255,255,.25);
    transform: scale(1.05);
}
.lb__close:focus-visible,
.lb__prev:focus-visible,
.lb__next:focus-visible {
    outline: none;
    box-shadow: 0 0 0 3px rgba(255,255,255,.4);
}
.lb__close svg,
.lb__prev svg,
.lb__next svg { width: 1.35rem; height: 1.35rem; }
.lb__close { top: 1.25rem; right: 1.25rem; }
.lb__prev  { top: 50%; left: 1.25rem;  transform: translateY(-50%); }
.lb__next  { top: 50%; right: 1.25rem; transform: translateY(-50%); }
.lb__prev:hover { transform: translateY(-50%) scale(1.05); }
.lb__next:hover { transform: translateY(-50%) scale(1.05); }

@media (max-width: 640px) {
    .lb__close { top: .75rem; right: .75rem; width: 2.5rem; height: 2.5rem; }
    .lb__prev { left: .5rem; width: 2.5rem; height: 2.5rem; }
    .lb__next { right: .5rem; width: 2.5rem; height: 2.5rem; }
}

/* --- 404 scheda annuncio ----------------------------------------- */
.page-404 {
    text-align: center;
    padding: 4rem 1.5rem;
    max-width: 32rem;
    margin: 0 auto;
}
.page-404 h1 {
    font-family: var(--font-display);
    font-weight: 400;
    margin: 0 0 .75rem;
}
.page-404 p {
    color: var(--muted);
    margin: 0 0 1.5rem;
}
.page-404 .btn {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
}

/* ======================================================================== */
/*  CATALOGO (spaces.php)                                                   */
/* ======================================================================== */

.page-catalog .main-content { padding-bottom: 0; }

/* --- Hero compatto ------------------------------------------------------- */
.cat-hero {
    background: linear-gradient(180deg, #f6f6f4 0%, #ffffff 100%);
    border-bottom: 1px solid var(--border);
    padding: 2.25rem 0 1.25rem;
}
.cat-hero__inner { max-width: 64rem; }
.cat-hero__eyebrow {
    margin: 0 0 .35rem;
    font-size: .78rem;
    text-transform: uppercase;
    letter-spacing: .14em;
    color: var(--muted);
    font-weight: 600;
}
.cat-hero__title {
    font-family: var(--font-display);
    font-weight: 400;
    font-size: clamp(1.85rem, 2.8vw, 2.6rem);
    line-height: 1.15;
    margin: 0 0 .4rem;
    letter-spacing: -.01em;
}
.cat-hero__sub {
    margin: 0;
    color: var(--muted);
    font-size: 1rem;
    max-width: 42rem;
}

/* --- Filter bar ---------------------------------------------------------- */
.cat-filters {
    position: sticky;
    top: var(--header-h, 64px);
    z-index: 30;
    background: #ffffffcc;
    backdrop-filter: saturate(140%) blur(10px);
    -webkit-backdrop-filter: saturate(140%) blur(10px);
    border-bottom: 1px solid var(--border);
    padding: 1rem 0 .75rem;
}
.cat-form { display: flex; flex-direction: column; gap: .85rem; }
.cat-form__row {
    display: flex;
    gap: .75rem;
    align-items: stretch;
}
.cat-form__row--top {
    flex-wrap: wrap;
}

/* Search input grande */
.cat-search {
    flex: 1 1 28rem;
    position: relative;
    display: flex;
    align-items: center;
    gap: .55rem;
    background: #fff;
    border: 1px solid var(--border);
    border-radius: 999px;
    padding: .55rem 1.1rem;
    transition: border-color .15s, box-shadow .15s;
    min-width: 18rem;
}
.cat-search:focus-within {
    border-color: var(--primary, #0f4c3a);
    box-shadow: 0 0 0 3px rgba(15, 76, 58, .12);
}
.cat-search__ico {
    width: 1.15rem;
    height: 1.15rem;
    color: var(--muted);
    flex-shrink: 0;
}
.cat-search__input {
    flex: 1;
    border: 0;
    background: transparent;
    padding: .35rem 0;
    font-size: 1rem;
    outline: none;
    min-width: 0;
}

.cat-form__row-actions {
    display: flex;
    gap: .5rem;
    flex-shrink: 0;
}
.cat-form__apply {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    padding-inline: 1.25rem;
    border-radius: 999px;
}
.cat-form__apply .btn__ico { width: 1rem; height: 1rem; }
.cat-form__more {
    border-radius: 999px;
    padding-inline: 1.1rem;
}

/* Category chip row */
.cat-cats {
    display: flex;
    gap: .5rem;
    overflow-x: auto;
    padding-bottom: .25rem;
    margin-left: -.25rem;
    padding-left: .25rem;
    scrollbar-width: thin;
}
.cat-cats::-webkit-scrollbar { height: 6px; }
.cat-cats::-webkit-scrollbar-thumb { background: var(--border); border-radius: 99px; }

.cat-cat {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    padding: .45rem .9rem;
    border: 1px solid var(--border);
    border-radius: 999px;
    background: #fff;
    color: var(--text);
    font-size: .9rem;
    font-weight: 500;
    cursor: pointer;
    white-space: nowrap;
    transition: background .15s, border-color .15s, color .15s, transform .08s;
    user-select: none;
}
.cat-cat:hover {
    border-color: #c8c6c0;
    background: #fafaf7;
}
.cat-cat:active { transform: translateY(1px); }
.cat-cat.is-active {
    background: var(--primary, #0f4c3a);
    color: #fff;
    border-color: var(--primary, #0f4c3a);
}
.cat-cat__input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
    width: 0; height: 0;
}
.cat-cat__ico { width: 1rem; height: 1rem; }
.cat-cat:focus-within {
    outline: 2px solid rgba(15, 76, 58, .35);
    outline-offset: 2px;
}

/* Pannello filtri avanzati */
.cat-advanced {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(11rem, 1fr));
    gap: .75rem;
    padding: .75rem;
    background: #fafaf7;
    border: 1px solid var(--border);
    border-radius: 14px;
}
.cat-field { display: flex; flex-direction: column; gap: .3rem; }
.cat-field label {
    font-size: .78rem;
    color: var(--muted);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.cat-field input,
.cat-field select {
    background: #fff;
    border: 1px solid var(--border);
    border-radius: 10px;
    padding: .5rem .65rem;
    font: inherit;
    width: 100%;
}
.cat-field input:focus,
.cat-field select:focus {
    outline: none;
    border-color: var(--primary, #0f4c3a);
    box-shadow: 0 0 0 3px rgba(15, 76, 58, .12);
}

@media (max-width: 720px) {
    .cat-form__row--top { gap: .5rem; }
    .cat-form__apply span { display: none; }
    .cat-form__more { display: inline-flex !important; }
}
@media (min-width: 961px) {
    .cat-form__more { display: none; }
    .cat-advanced { display: grid !important; }
    [hidden].cat-advanced { display: grid !important; }
}

/* --- Summary + active chips --------------------------------------------- */
.cat-summary {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1.25rem 0 .25rem;
    flex-wrap: wrap;
}
.cat-summary__count {
    font-size: 1rem;
    color: var(--muted);
}
.cat-summary__n {
    color: var(--text);
    font-size: 1.25rem;
    font-weight: 600;
    margin-right: .25rem;
}
.cat-summary__filtered { color: var(--muted); }

.cat-active {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    gap: .4rem;
}
.cat-active__chip {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    background: #eef1ed;
    color: var(--text);
    padding: .3rem .3rem .3rem .7rem;
    border-radius: 999px;
    font-size: .85rem;
    text-decoration: none;
    border: 1px solid transparent;
    transition: background .15s, border-color .15s;
}
.cat-active__chip:hover {
    background: #e2e7e0;
    border-color: #c9d1c6;
}
.cat-active__ico {
    width: .95rem;
    height: .95rem;
    background: rgba(0,0,0,.08);
    border-radius: 999px;
    padding: .15rem;
    box-sizing: content-box;
    color: #2c2c2c;
}
.cat-active__clear {
    padding: .3rem .75rem;
    border-radius: 999px;
    font-size: .85rem;
    color: var(--primary, #0f4c3a);
    text-decoration: underline;
    text-underline-offset: 3px;
}
.cat-active__clear:hover { text-decoration: none; }

/* --- Empty state -------------------------------------------------------- */
.cat-empty {
    text-align: center;
    max-width: 32rem;
    margin: 3rem auto;
    padding: 2rem 1.5rem;
    background: #fafaf7;
    border: 1px dashed var(--border);
    border-radius: 16px;
}
.cat-empty__ico {
    display: inline-flex;
    width: 3.25rem;
    height: 3.25rem;
    border-radius: 999px;
    background: #fff;
    align-items: center;
    justify-content: center;
    color: var(--muted);
    margin-bottom: 1rem;
    border: 1px solid var(--border);
}
.cat-empty__ico svg { width: 1.5rem; height: 1.5rem; }
.cat-empty__title {
    font-family: var(--font-display);
    font-weight: 400;
    font-size: 1.5rem;
    margin: 0 0 .5rem;
}
.cat-empty__text { color: var(--muted); margin: 0 0 1.5rem; }
.cat-empty__actions {
    display: flex;
    justify-content: center;
    gap: .75rem;
    flex-wrap: wrap;
}

/* --- Layout risultati: mappa + griglia --------------------------------- */
.cat-layout {
    display: grid;
    grid-template-columns: 22rem 1fr;
    gap: 1.5rem;
    margin-top: .75rem;
    margin-bottom: 3rem;
    align-items: start;
}
@media (max-width: 1100px) { .cat-layout { grid-template-columns: 20rem 1fr; } }
@media (max-width: 960px)  { .cat-layout { grid-template-columns: 1fr; } }

.cat-map-wrap { position: sticky; top: calc(var(--header-h, 64px) + 8.5rem); }
@media (max-width: 960px) {
    .cat-map-wrap { position: static; }
}

.cat-map-card {
    background: #fff;
    border: 1px solid var(--border);
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 1px 2px rgba(15,23,42,.04);
}
.cat-map-card__head {
    display: flex;
    align-items: center;
    gap: .5rem;
    padding: .85rem 1rem;
    border-bottom: 1px solid var(--border);
}
.cat-map-card__ico { width: 1.1rem; height: 1.1rem; color: var(--primary, #0f4c3a); }
.cat-map-card__title {
    margin: 0;
    font-size: 1rem;
    font-weight: 600;
}
.catalog-map {
    height: 22rem;
    background: #eef1ed;
}
@media (max-width: 960px) { .catalog-map { height: 16rem; } }
.catalog-map--empty { display: flex; align-items: center; justify-content: center; color: var(--muted); }

.cat-map-card__caption {
    margin: 0;
    padding: .6rem 1rem;
    font-size: .8rem;
    color: var(--muted);
    border-top: 1px solid var(--border);
    background: #fafaf7;
}
.cat-map-card__caption-tip {
    display: block;
    margin-top: 0.35rem;
    font-size: 0.76rem;
    line-height: 1.35;
    opacity: 0.95;
}

/* --- Grid risultati: usa .space-card della home (già definita) --------- */
.cat-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(17rem, 1fr));
    gap: 1.25rem;
}
@media (min-width: 1400px) {
    .cat-grid { grid-template-columns: repeat(auto-fill, minmax(18rem, 1fr)); }
}

/* Micro-tuning delle card nel catalogo (più compatte) */
.page-catalog .space-card .sc__title {
    font-size: 1.05rem;
    line-height: 1.3;
}
.page-catalog .space-card .sc__visual {
    aspect-ratio: 4 / 3;
}

/* --- Reduced motion ----------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
    .cat-cat,
    .cat-search,
    .cat-active__chip,
    .space-card,
    .space-card .sc__visual { transition: none !important; }
}

/* ════════════════════════════════════════════════════════════════════════
   ═══  MODERN RESTYLE 2026  ═══════════════════════════════════════════════
   Layer additivo: tokens evoluti, micro-motion, polish componenti.
   Tutte le regole sotto vincono per cascade: nessuna riga sopra è stata tolta.
   ════════════════════════════════════════════════════════════════════════ */

/* ─── 1. Design tokens v2 ────────────────────────────────────────────── */

:root {
    /* Palette: warm beauty/wellness premium */
    --bg:               #faf7f1;
    --bg-2:             #f3eee4;
    --surface:          #ffffff;
    --surface-2:        #f7f3eb;
    --surface-elev:     #ffffff;
    --text:             #14110c;
    --text-2:           #4a4339;
    --muted:            #7a7166;
    --hairline:         #ebe5d8;
    --border:           #e3ddcf;
    --border-strong:    #cfc7b6;

    /* Brand */
    --accent:           #0e6b5c;
    --accent-2:         #12907c;
    --accent-hover:     #08443c;
    --accent-soft:      rgba(14, 107, 92, 0.10);
    --accent-glow:      rgba(14, 107, 92, 0.22);

    /* Secondari per warmth/markers */
    --coral:            #d97757;
    --coral-soft:       rgba(217, 119, 87, 0.12);
    --gold:             #c9a227;
    --gold-soft:        rgba(201, 162, 39, 0.14);

    /* Stati */
    --danger:           #b42318;
    --success:          #0d6b5c;
    --warning:          #c9a227;

    /* Elevazioni */
    --shadow-xs:        0 1px 2px rgba(20, 18, 15, 0.05);
    --shadow-sm:        0 1px 3px rgba(20, 18, 15, 0.06), 0 1px 2px rgba(20, 18, 15, 0.04);
    --shadow-md:        0 8px 24px -8px rgba(20, 18, 15, 0.12), 0 2px 6px rgba(20, 18, 15, 0.05);
    --shadow-lg:        0 24px 48px -16px rgba(20, 18, 15, 0.18), 0 4px 12px rgba(20, 18, 15, 0.06);
    --shadow-glow:      0 12px 40px -12px var(--accent-glow);

    /* Motion */
    --ease-out:         cubic-bezier(0.22, 1, 0.36, 1);
    --ease-in-out:      cubic-bezier(0.65, 0, 0.35, 1);
    --t-fast:           120ms;
    --t-base:           220ms;
    --t-slow:           420ms;

    /* Misc */
    --header-h:         68px;
    color-scheme: light;
}

/* Smussa lo switch: NON applicare la transizione a height/transform per evitare scatti. */
html { transition: background-color var(--t-base) var(--ease-out); }
body {
    background: var(--bg);
    color: var(--text);
    transition: background-color var(--t-base) var(--ease-out),
                color var(--t-base) var(--ease-out);
}

/* Pannello struttura (host/*): palette su body — vedi includes/header.php */
body.host-panel-theme--warm {
    --bg: #faf4ee;
    --bg-2: #f3e8de;
    --surface: #fffdfb;
    --surface-2: #faf0e8;
    --surface-elev: #fffdfb;
    --text: #2a1810;
    --text-2: #5c4034;
    --muted: #7a5e52;
    --hairline: #e8d6ca;
    --border: #e0cfc2;
    --border-strong: #c9a896;
    --accent: #a0523d;
    --accent-2: #c67b5c;
    --accent-hover: #7d3d2e;
    --accent-soft: rgba(160, 82, 61, 0.12);
    --accent-glow: rgba(160, 82, 61, 0.28);
    --success: #0d6b5c;
    --coral: #c67b5c;
    --coral-soft: rgba(198, 123, 92, 0.14);
}
body.host-panel-theme--minimal {
    --bg: #f9fafb;
    --bg-2: #f3f4f6;
    --surface: #ffffff;
    --surface-2: #f3f4f6;
    --surface-elev: #ffffff;
    --text: #111827;
    --text-2: #374151;
    --muted: #6b7280;
    --hairline: #e5e7eb;
    --border: #e5e7eb;
    --border-strong: #d1d5db;
    --accent: #111827;
    --accent-2: #374151;
    --accent-hover: #000000;
    --accent-soft: rgba(17, 24, 39, 0.09);
    --accent-glow: rgba(17, 24, 39, 0.18);
    --success: #0d6b5c;
}

/* Selezione testo on-brand */
::selection { background: var(--accent-soft); color: var(--text); }

/* Scrollbar discreta */
@media (pointer: fine) {
    * { scrollbar-width: thin; scrollbar-color: var(--border-strong) transparent; }
    *::-webkit-scrollbar { width: 10px; height: 10px; }
    *::-webkit-scrollbar-thumb { background: var(--border-strong); border-radius: 999px; border: 2px solid transparent; background-clip: padding-box; }
    *::-webkit-scrollbar-thumb:hover { background: var(--muted); background-clip: padding-box; border: 2px solid transparent; }
}

/* ─── 2. Header glass + scroll state ─────────────────────────────────── */

.site-header {
    background: color-mix(in srgb, var(--surface) 78%, transparent);
    border-bottom: 1px solid transparent;
    backdrop-filter: saturate(180%) blur(14px);
    -webkit-backdrop-filter: saturate(180%) blur(14px);
    transition: background-color var(--t-base) var(--ease-out),
                border-color var(--t-base) var(--ease-out),
                box-shadow var(--t-base) var(--ease-out);
}
.site-header.is-scrolled {
    background: color-mix(in srgb, var(--surface) 92%, transparent);
    border-bottom-color: var(--hairline);
    box-shadow: var(--shadow-sm);
}
.header-inner {
    min-height: var(--header-h);
    padding: 0.85rem 0;
}

/* Logo: mantieni il quadratino ma con interno SVG iniettato dal template */
.logo {
    color: var(--text);
    font-weight: 700;
    letter-spacing: -0.01em;
    transition: color var(--t-fast) var(--ease-out);
}
.logo:hover:not(.logo--brand) { color: var(--accent); }
.logo.logo--brand {
    gap: 0.5rem;
}
.logo__img {
    display: block;
    height: 2.5rem;
    width: auto;
    max-width: min(200px, 52vw);
    object-fit: contain;
    flex-shrink: 0;
}
.site-header--admin-shell .logo__img {
    height: 2.35rem;
    max-width: min(185px, 48vw);
}
.logo.logo--brand:hover .logo__img {
    opacity: 0.9;
}
.logo-mark {
    width: 2.1rem;
    height: 2.1rem;
    border-radius: 9px;
    background: linear-gradient(135deg, var(--accent) 0%, var(--accent-2) 100%);
    box-shadow: 0 4px 12px -4px var(--accent-glow);
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    overflow: hidden;
}
.logo-mark::before {
    content: "";
    position: absolute;
    inset: 0;
    background:
        radial-gradient(circle at 30% 25%, rgba(255,255,255,.45), transparent 55%),
        radial-gradient(circle at 75% 80%, rgba(0,0,0,.18), transparent 60%);
    pointer-events: none;
}
.logo-mark__svg {
    position: relative;
    width: 1.2rem;
    height: 1.2rem;
    stroke: #fff;
    stroke-width: 1.6;
    fill: none;
    filter: drop-shadow(0 1px 1px rgba(0,0,0,0.18));
}

/* Navigazione */
.nav { gap: 0.35rem 0.85rem; }
.nav > a {
    color: var(--text-2);
    font-weight: 500;
    padding: 0.55rem 0.85rem;
    border-radius: 10px;
    transition: color var(--t-fast) var(--ease-out),
                background-color var(--t-fast) var(--ease-out);
}
.nav > a:hover {
    color: var(--accent);
    background: var(--accent-soft);
}
.nav > a.btn { padding: 0.5rem 1rem; }
.nav-user {
    color: var(--muted);
    font-size: 0.85rem;
    padding: 0 0.4rem;
    border-left: 1px solid var(--hairline);
    margin-left: 0.4rem;
}

/* Mobile nav toggle (hamburger) */
.nav-toggle {
    display: none;
    width: 2.4rem;
    height: 2.4rem;
    border-radius: 10px;
    border: 1px solid var(--hairline);
    background: var(--surface);
    color: var(--text);
    cursor: pointer;
    padding: 0;
    align-items: center;
    justify-content: center;
    transition: border-color var(--t-fast) var(--ease-out),
                color var(--t-fast) var(--ease-out);
}
.nav-toggle:hover { border-color: var(--accent); color: var(--accent); }
.nav-toggle svg { width: 1.2rem; height: 1.2rem; }

/* ≤899px: menu hamburger + overlay full-viewport.
   Nota: backdrop-filter sull’header crea un containing block in Safari → il .nav fixed
   restava “dentro” l’header e i link uscivano in orizzontale; su mobile disattiviamo il blur. */
@media (max-width: 899px) {
    .site-header {
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
        background: rgba(255, 255, 255, 0.97);
    }
    .nav-toggle { display: inline-flex; }
    .header-inner {
        flex-wrap: nowrap;
        gap: 0.65rem;
    }
    .logo {
        min-width: 0;
    }
    .nav {
        position: fixed;
        left: 0;
        right: 0;
        top: var(--header-h, 68px);
        bottom: 0;
        width: 100%;
        max-width: 100vw;
        box-sizing: border-box;
        flex-direction: column;
        align-items: stretch;
        gap: 0.25rem;
        padding: 1.5rem 1.25rem max(2rem, env(safe-area-inset-bottom, 0px));
        background: var(--surface);
        border-top: 1px solid var(--hairline);
        transform: translateY(-110%);
        transition: transform var(--t-base) var(--ease-out);
        z-index: 90;
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
    }
    .nav.is-open { transform: translateY(0); }
    .nav > a {
        padding: 0.85rem 1rem;
        border-radius: 12px;
        font-size: 1rem;
    }
    .nav > a.btn { margin-top: 0.5rem; text-align: center; padding: 0.85rem 1rem; }
    .nav-user {
        border-left: none;
        margin: 0.5rem 0 0;
        padding-top: 0.75rem;
        border-top: 1px solid var(--hairline);
    }
    body.nav-open { overflow: hidden; }
}

/* ─── 3. Buttons polish ──────────────────────────────────────────────── */

.btn {
    transition: background-color var(--t-fast) var(--ease-out),
                color var(--t-fast) var(--ease-out),
                border-color var(--t-fast) var(--ease-out),
                box-shadow var(--t-fast) var(--ease-out),
                transform var(--t-fast) var(--ease-out);
    will-change: transform;
}
.btn:hover { transform: translateY(-1px); }
.btn:active { transform: translateY(0); }
.btn:focus-visible {
    outline: none;
    box-shadow: 0 0 0 3px var(--accent-soft);
}
/* Solo pulsanti “pieni”: non sovrascrivere link/ghost/secondary/light (evita testo accent su sfondo accent). */
.btn:not(.btn-secondary):not(.btn-ghost):not(.btn-link):not(.btn-light):not(.btn-outline-light):not(.btn-admin-danger),
.btn-primary {
    background: var(--accent);
    border-color: var(--accent);
    box-shadow: 0 6px 16px -8px var(--accent-glow);
    color: #fff !important;
}
.btn:not(.btn-secondary):not(.btn-ghost):not(.btn-link):not(.btn-light):not(.btn-outline-light):not(.btn-admin-danger):hover,
.btn-primary:hover {
    background: var(--accent-2);
    border-color: var(--accent-2);
    box-shadow: 0 10px 22px -8px var(--accent-glow);
    color: #fff !important;
}
.btn-secondary {
    background: var(--surface);
    border-color: var(--border);
    color: var(--text) !important;
    box-shadow: none;
}
.btn-secondary:hover {
    background: var(--surface);
    border-color: var(--accent);
    color: var(--accent) !important;
}
.btn-ghost {
    background: transparent;
    border-color: var(--border);
    box-shadow: none;
    color: var(--text) !important;
}
.btn-ghost:hover { background: var(--surface); border-color: var(--accent); color: var(--accent) !important; }

/* Azioni distruttive in tabelle admin (dopo .btn per vincere la cascata) */
.btn.btn-admin-danger {
    background: var(--surface);
    color: var(--danger);
    border-color: color-mix(in srgb, var(--danger) 38%, var(--hairline));
    box-shadow: var(--shadow-xs);
}
.btn.btn-admin-danger:hover {
    background: color-mix(in srgb, var(--danger) 8%, var(--surface));
    border-color: color-mix(in srgb, var(--danger) 55%, var(--hairline));
    color: var(--danger);
    box-shadow: var(--shadow-xs);
}

/* Light/Outline-light usate dentro CTA scura */
.btn-light { background: #fff; color: var(--accent) !important; border-color: #fff; }
.btn-light:hover { background: #f0faf8; }
.btn-outline-light { background: transparent; color: #fff !important; border-color: rgba(255,255,255,.55); }
.btn-outline-light:hover { background: rgba(255,255,255,.12); border-color: #fff; }

/* ─── 4. Cards e superfici ───────────────────────────────────────────── */

.card,
.cf-card,
.step-card,
.empty-state,
.home-empty,
.host-plan-banner,
.plan-card,
.register-plan-box,
.admin-stat-card,
.admin-metric,
.admin-quick-card,
.admin-space-card,
.contract-block,
.space-aside-block,
.stripe-sync-bar {
    background: var(--surface);
    border-color: var(--hairline);
    transition: background-color var(--t-base) var(--ease-out),
                border-color var(--t-base) var(--ease-out),
                box-shadow var(--t-base) var(--ease-out),
                transform var(--t-base) var(--ease-out);
}

a.card:hover,
.admin-quick-card:hover,
.cat-card:hover,
.space-card:hover {
    box-shadow: var(--shadow-md);
}

/* Tabelle moderne */
.table-wrap {
    background: var(--surface);
    border-color: var(--hairline);
    box-shadow: var(--shadow-xs);
}
table { color: var(--text); }
th { background: var(--surface-2); color: var(--text-2); font-weight: 600; }
th, td { border-bottom-color: var(--hairline); }
tbody tr { transition: background-color var(--t-fast) var(--ease-out); }
tbody tr:hover { background: var(--surface-2); }

/* Badges */
.badge-paid,
.badge-success { background: var(--accent-soft); color: var(--accent); }
.badge-pending,
.badge-warn { background: var(--gold-soft); color: #8a6d1d; }
.badge-cancel { background: var(--surface-2); color: var(--muted); }

/* Alerts */
.alert-error { background: rgba(180,35,24,0.08); color: var(--danger); border-color: rgba(180,35,24,0.22); }
.alert-success { background: var(--accent-soft); color: var(--accent); border-color: rgba(14,107,92,0.22); }
.alert-soft { background: var(--accent-soft); border-color: rgba(14,107,92,0.22); color: var(--text); }

/* Form fields */
form.stacked input,
form.stacked select,
form.stacked textarea,
.cat-field input,
.cat-field select,
.filter-bar__field input,
.filter-bar__field select,
.admin-tip__code,
.admin-code-inline,
.admin-detail-pre {
    background: var(--surface);
    border-color: var(--border);
    color: var(--text);
    transition: border-color var(--t-fast) var(--ease-out),
                box-shadow var(--t-fast) var(--ease-out),
                background-color var(--t-fast) var(--ease-out);
}
form.stacked input:focus,
form.stacked select:focus,
form.stacked textarea:focus,
.cat-field input:focus,
.cat-field select:focus,
.filter-bar__field input:focus,
.filter-bar__field select:focus {
    outline: none;
    border-color: var(--accent);
    box-shadow: 0 0 0 3px var(--accent-soft);
}
form.stacked label { color: var(--text-2); }

/* Filter bar */
.filter-bar {
    background: var(--surface);
    border-color: var(--hairline);
    box-shadow: var(--shadow-xs);
}

/* Footer */
.site-footer {
    background: linear-gradient(180deg, #1c1a17 0%, #14130f 100%);
    color: #c9c4bc;
    margin-top: 3rem;
}

/* ─── 5. Hero ridisegnata: profondità + decorazioni ─────────────────── */

.hero {
    padding: clamp(2.5rem, 5vw, 4.5rem) 0 clamp(3rem, 6vw, 5rem);
    isolation: isolate;
}
.hero__bg {
    background:
        /* Pattern a dot grid sottile */
        radial-gradient(circle at 1px 1px, rgba(14, 107, 92, 0.12) 1px, transparent 0) 0 0 / 22px 22px,
        /* Blob morbidi in alto a destra */
        radial-gradient(ellipse 55% 45% at 88% 8%, rgba(14, 107, 92, 0.18), transparent 65%),
        /* Blob caldo coral in basso a sinistra */
        radial-gradient(ellipse 45% 35% at 5% 92%, rgba(217, 119, 87, 0.14), transparent 60%),
        /* Base gradient */
        linear-gradient(180deg, var(--bg-2) 0%, var(--bg) 65%);
}

/* Eyebrow rifinita */
.hero__eyebrow {
    background: color-mix(in srgb, var(--surface) 65%, transparent);
    border: 1px solid var(--hairline);
    backdrop-filter: blur(8px);
    transition: border-color var(--t-base) var(--ease-out);
}
.hero__eyebrow-dot {
    box-shadow: 0 0 0 3px var(--accent-soft);
    animation: pulse-dot 2.4s var(--ease-in-out) infinite;
}
@keyframes pulse-dot {
    0%, 100% { box-shadow: 0 0 0 3px var(--accent-soft); }
    50%      { box-shadow: 0 0 0 6px var(--accent-soft); }
}

/* Search bar premium */
.hero-search {
    background: var(--surface);
    border-color: var(--hairline);
    box-shadow: var(--shadow-md);
}

/* Trust list con badge piccolo */
.hero__trust li {
    padding: 0.35rem 0;
    color: var(--text-2);
}
.hero__trust svg {
    background: var(--accent-soft);
    border-radius: 999px;
    padding: 0.25rem;
    width: 1.5rem;
    height: 1.5rem;
    box-sizing: content-box;
    box-sizing: border-box;
}

/* Preview con accent ring */
.hero-preview {
    border: 1px solid var(--hairline);
    box-shadow: var(--shadow-lg);
    transition: transform var(--t-slow) var(--ease-out), box-shadow var(--t-slow) var(--ease-out);
}
.hero-preview:hover { transform: translateY(-4px) rotate(-0.4deg); box-shadow: var(--shadow-lg), 0 30px 60px -20px var(--accent-glow); }
a.hero-preview--link { cursor: pointer; }

/* Hero stats: glass + numeri animati al primo paint */
.hero-stats {
    background: color-mix(in srgb, var(--surface) 75%, transparent);
    backdrop-filter: blur(10px);
    border-color: var(--hairline);
    box-shadow: var(--shadow-md);
}
.hero-stat__n {
    background: linear-gradient(135deg, var(--accent) 0%, var(--accent-2) 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
}

/* ─── 6. Strip + Pills ───────────────────────────────────────────────── */

.strip { background: var(--surface-2); border-color: var(--hairline); }
.pill { background: var(--surface); border-color: var(--hairline); color: var(--text); }
.pill:hover { border-color: var(--accent); }

/* ─── 7. Section + heading ───────────────────────────────────────────── */

.page-home .section { border-color: var(--hairline); }
.page-home .section--alt {
    background: linear-gradient(180deg, var(--surface-2) 0%, transparent 100%);
}

/* ─── 8. Category cards moderne ──────────────────────────────────────── */

.cat-card {
    background: var(--surface);
    border-color: var(--hairline);
    transition: transform var(--t-base) var(--ease-out),
                box-shadow var(--t-base) var(--ease-out),
                border-color var(--t-base) var(--ease-out),
                background-color var(--t-base) var(--ease-out);
}
.cat-card::before {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    padding: 1px;
    background: linear-gradient(135deg, transparent, var(--accent) 200%);
    -webkit-mask:
        linear-gradient(#000 0 0) content-box,
        linear-gradient(#000 0 0);
    -webkit-mask-composite: xor;
            mask-composite: exclude;
    opacity: 0;
    transition: opacity var(--t-base) var(--ease-out);
    pointer-events: none;
}
.cat-card:hover::before { opacity: 1; }
.cat-card__ico-wrap {
    background: linear-gradient(135deg, var(--accent-soft) 0%, transparent 100%);
    border: 1px solid var(--hairline);
    color: var(--accent);
    transition: background var(--t-base) var(--ease-out),
                border-color var(--t-base) var(--ease-out),
                color var(--t-base) var(--ease-out);
}
.cat-card:hover .cat-card__ico-wrap {
    background: linear-gradient(135deg, var(--accent) 0%, var(--accent-2) 100%);
    color: #fff;
    border-color: var(--accent);
}

/* ─── 9. Space cards moderne (home + catalogo) ──────────────────────── */

.space-card {
    background: var(--surface);
    border-color: var(--hairline);
}
.space-card:hover {
    box-shadow: var(--shadow-lg);
    border-color: var(--hairline);
}
.sc__visual { transition: transform var(--t-slow) var(--ease-out); }
.space-card:hover .sc__visual { transform: scale(1.04); }
.sc__visual::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, transparent 50%, rgba(0,0,0,0.18) 100%);
    pointer-events: none;
}

/* ─── 10. How-it-works cards ─────────────────────────────────────────── */

.how-card {
    background: var(--surface);
    border-color: var(--hairline);
    transition: transform var(--t-base) var(--ease-out),
                box-shadow var(--t-base) var(--ease-out);
}
.how-card:hover {
    transform: translateY(-3px);
    box-shadow: var(--shadow-md);
}
.how-card::before { background: linear-gradient(90deg, var(--accent), var(--accent-2)); }

/* ─── 11. CTA finale: bordo luminoso ─────────────────────────────────── */

.cta__inner {
    background:
        radial-gradient(ellipse 60% 80% at 80% 0%, rgba(255,255,255,0.18), transparent 60%),
        linear-gradient(135deg, var(--accent) 0%, #0a4d45 60%, #143834 100%);
}
.cta__inner::after {
    content: "";
    position: absolute;
    inset: -1px;
    border-radius: inherit;
    pointer-events: none;
    background: linear-gradient(135deg, rgba(255,255,255,0.25), transparent 30%, transparent 70%, rgba(255,255,255,0.10));
    -webkit-mask:
        linear-gradient(#000 0 0) content-box,
        linear-gradient(#000 0 0);
    -webkit-mask-composite: xor;
            mask-composite: exclude;
    padding: 1px;
}

/* ─── 12. Catalogo: hero + filtri ────────────────────────────────────── */

.cat-hero {
    background: linear-gradient(180deg, var(--surface-2) 0%, var(--bg) 100%);
    border-bottom-color: var(--hairline);
    position: relative;
    overflow: hidden;
}
.cat-hero::before {
    content: "";
    position: absolute;
    inset: 0;
    background:
        radial-gradient(circle at 1px 1px, var(--accent-soft) 1px, transparent 0) 0 0 / 24px 24px,
        radial-gradient(ellipse 50% 50% at 90% 0%, var(--accent-soft), transparent 60%);
    opacity: 0.6;
    pointer-events: none;
}
.cat-hero__inner { position: relative; }

.cat-filters {
    background: color-mix(in srgb, var(--surface) 88%, transparent);
    backdrop-filter: saturate(160%) blur(12px);
    -webkit-backdrop-filter: saturate(160%) blur(12px);
    border-bottom-color: var(--hairline);
}
.cat-search { background: var(--surface); border-color: var(--border); }
.cat-search__input { color: var(--text); }
.cat-search__input::placeholder { color: var(--muted); }

.cat-cat { background: var(--surface); border-color: var(--border); color: var(--text); }
.cat-cat:hover { background: var(--surface-2); border-color: var(--border-strong); }
.cat-cat.is-active {
    background: var(--accent);
    color: #fff;
    border-color: var(--accent);
    box-shadow: 0 6px 16px -8px var(--accent-glow);
}

.cat-advanced { background: var(--surface-2); border-color: var(--hairline); }
.cat-active__chip { background: var(--surface-2); border-color: var(--hairline); color: var(--text); }
.cat-active__chip:hover { background: var(--accent-soft); border-color: var(--accent); color: var(--accent); }
.cat-empty { background: var(--surface); border-color: var(--hairline); }
.cat-empty__ico { background: var(--surface-elev); border-color: var(--hairline); color: var(--muted); }
.cat-map-card { background: var(--surface); border-color: var(--hairline); }
.cat-map-card__head { border-bottom-color: var(--hairline); }
.cat-map-card__caption { background: var(--surface-2); border-top-color: var(--hairline); }

/* ─── 13. Space detail ──────────────────────────────────────────────── */

.sp-meta__item,
.sp-cta,
.sp-inquiry,
.sp-map-box,
.sp-unav__item {
    background: var(--surface);
    border-color: var(--hairline);
}
.sp-mobile-bar {
    background: color-mix(in srgb, var(--surface) 92%, transparent);
    border-top-color: var(--hairline);
}
.sp-cat-badge { background: var(--accent-soft); color: var(--accent); }
.sp-verified { background: var(--accent-soft); border-color: rgba(14,107,92,.25); color: var(--accent); }
.sp-section--accent { background: linear-gradient(180deg, var(--accent-soft), transparent 80%); }
.sp-section--warn { background: linear-gradient(180deg, var(--gold-soft), transparent 80%); }
.sp-inquiry__form textarea { background: var(--surface-2); border-color: var(--border); color: var(--text); }
.sp-inquiry__form textarea:focus { background: var(--surface); border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-soft); }

/* ─── 14. Auth pages refresh ─────────────────────────────────────────── */

.page-auth .main-content {
    max-width: 26rem;
}
.page-auth.page-auth .main-content > h1 {
    font-size: clamp(1.85rem, 3vw, 2.25rem);
    margin-bottom: 1.5rem;
}
.page-auth form.stacked {
    background: var(--surface);
    border: 1px solid var(--hairline);
    border-radius: 18px;
    padding: 1.75rem 1.5rem 1.5rem;
    box-shadow: var(--shadow-md);
}
.page-auth form.stacked input {
    max-width: 100%;
}
.page-auth form.stacked button[type="submit"],
.page-auth form.stacked .btn {
    width: 100%;
    padding: 0.85rem 1rem;
    font-size: 1rem;
    margin-top: 0.5rem;
}

/* ─── 15. Come funziona — refresh ────────────────────────────────────── */

.cf-card {
    background: var(--surface);
    border-color: var(--hairline);
    transition: transform var(--t-base) var(--ease-out),
                box-shadow var(--t-base) var(--ease-out);
}
.cf-card:hover {
    transform: translateY(-3px);
    box-shadow: var(--shadow-md);
}
.cf-card h2 {
    color: var(--text);
    display: flex;
    align-items: center;
    gap: 0.5rem;
}
.cf-card h2::before {
    content: "";
    display: inline-block;
    width: 6px;
    height: 24px;
    border-radius: 3px;
    background: linear-gradient(180deg, var(--accent), var(--accent-2));
}
.cf-faq h2 {
    font-size: clamp(1.5rem, 3vw, 2rem);
}
.faq-list dt { color: var(--text); }
.faq-list dd { color: var(--text-2); }

/* ─── 16. Page-host & Page-pro: layout moderno ───────────────────────── */

body.page-host,
body.page-pro {
    background: linear-gradient(180deg, var(--surface-2) 0%, var(--bg) 28%);
}

.page-host .main-content,
.page-pro .main-content {
    max-width: min(1100px, 94vw);
}

.dash-section {
    margin: 1.75rem 0 1.25rem;
}
.dash-section__title {
    font-family: var(--font-display);
    font-weight: 400;
    font-size: 1.4rem;
    letter-spacing: -0.01em;
    margin: 0 0 0.75rem;
    display: flex;
    align-items: center;
    gap: 0.55rem;
}
.dash-section__title svg { color: var(--accent); width: 1.2rem; height: 1.2rem; }

.dash-section__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 0.85rem;
    flex-wrap: wrap;
}

/* Wrapper card per blocchi nelle dashboard */
.dash-card {
    background: var(--surface);
    border: 1px solid var(--hairline);
    border-radius: 18px;
    padding: 1.25rem 1.35rem;
    box-shadow: var(--shadow-sm);
}

.host-plan-banner {
    border-radius: 18px;
    padding: 1.1rem 1.3rem;
    box-shadow: var(--shadow-sm);
}
.host-plan-banner--pro {
    background: linear-gradient(135deg, var(--accent-soft) 0%, var(--surface) 60%);
    border-color: rgba(14,107,92,0.28);
    position: relative;
    overflow: hidden;
}
.host-plan-banner--pro::after {
    content: "PRO";
    position: absolute;
    top: -10px;
    right: -10px;
    width: 64px;
    height: 64px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--accent), var(--accent-2));
    color: #fff;
    font-size: 0.78rem;
    font-weight: 800;
    letter-spacing: 0.04em;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 6px 16px -6px var(--accent-glow);
    transform: rotate(8deg);
}

/* Tabelle dashboard: bordo arrotondato + sticky header */
.page-host .table-wrap,
.page-pro .table-wrap,
.page-admin .table-wrap {
    border-radius: 16px;
    box-shadow: var(--shadow-sm);
}

/* Punteggio affidabilità professionista (semaforo soft, solo area host) */
.page-host .reliability-score {
    display: inline-block;
    margin: 0 0 0.15rem;
    padding: 0.2rem 0.5rem;
    border-radius: 8px;
    font-weight: 700;
    font-size: 0.95rem;
    font-variant-numeric: tabular-nums;
    line-height: 1.25;
    border: 1px solid transparent;
}
.page-host .reliability-score--pending {
    background: color-mix(in srgb, var(--muted) 12%, var(--surface));
    color: var(--muted);
    border-color: var(--hairline);
}
.page-host .reliability-score--high {
    background: color-mix(in srgb, var(--accent) 18%, var(--surface));
    color: var(--accent-hover);
    border-color: color-mix(in srgb, var(--accent) 35%, var(--hairline));
}
.page-host .reliability-score--good {
    background: color-mix(in srgb, var(--accent) 10%, var(--surface));
    color: var(--text);
    border-color: color-mix(in srgb, var(--accent) 22%, var(--hairline));
}
.page-host .reliability-score--warn {
    background: color-mix(in srgb, #c9a227 14%, var(--surface));
    color: #6d5700;
    border-color: color-mix(in srgb, #c9a227 35%, var(--hairline));
}
.page-host .reliability-score--low {
    background: color-mix(in srgb, var(--danger) 12%, var(--surface));
    color: var(--danger);
    border-color: color-mix(in srgb, var(--danger) 28%, var(--hairline));
}

/* ─── 17. Page-admin: refresh ────────────────────────────────────────── */

body.page-admin {
    background: linear-gradient(180deg, var(--surface-2) 0%, var(--bg) 22%);
}
.admin-nav {
    background: color-mix(in srgb, var(--surface) 85%, transparent);
    backdrop-filter: blur(10px);
    border-color: var(--hairline);
    box-shadow: var(--shadow-xs);
}
.admin-nav__item { color: var(--text-2); }
.admin-nav__item:hover { background: var(--accent-soft); color: var(--accent); }
.admin-nav__item.is-active {
    background: linear-gradient(135deg, var(--accent), var(--accent-2));
    color: #fff;
    border-color: transparent;
    box-shadow: 0 6px 16px -8px var(--accent-glow);
}
.admin-nav__item.is-active .admin-nav__svg { color: #fff; opacity: 1; }

.admin-metric {
    background: var(--surface);
    border-color: var(--hairline);
}
.admin-metric--pulse {
    background: linear-gradient(145deg, var(--surface) 0%, rgba(180, 35, 24, 0.07) 100%);
    border-color: rgba(180,35,24,0.30);
}
.admin-metric__value { color: var(--text); }
.admin-metric__label { color: var(--text-2); }
.admin-metric__ico { color: var(--accent); }

.admin-quick-card {
    background: var(--surface);
    border-color: var(--hairline);
}
.admin-quick-card__title { color: var(--text); }
.admin-quick-card__desc  { color: var(--text-2); }

.admin-tip {
    background: linear-gradient(135deg, var(--accent-soft) 0%, transparent 100%);
    border-color: rgba(14,107,92,0.22);
}
.admin-tip__code {
    background: var(--surface);
    border-color: var(--hairline);
    color: var(--text);
}

/* ─── 18. Scroll reveal animations ──────────────────────────────────── */

[data-reveal] {
    opacity: 0;
    transform: translateY(18px);
    transition: opacity var(--t-slow) var(--ease-out),
                transform var(--t-slow) var(--ease-out);
    will-change: opacity, transform;
}
[data-reveal="left"]  { transform: translateX(-22px); }
[data-reveal="right"] { transform: translateX(22px); }
[data-reveal="zoom"]  { transform: scale(0.96); }
[data-reveal].is-revealed {
    opacity: 1;
    transform: translate(0,0) scale(1);
}

/* Stagger group: applica delay incrementale ai figli con [data-reveal] */
[data-reveal-stagger] > [data-reveal]:nth-child(1)  { transition-delay: 0ms; }
[data-reveal-stagger] > [data-reveal]:nth-child(2)  { transition-delay: 60ms; }
[data-reveal-stagger] > [data-reveal]:nth-child(3)  { transition-delay: 120ms; }
[data-reveal-stagger] > [data-reveal]:nth-child(4)  { transition-delay: 180ms; }
[data-reveal-stagger] > [data-reveal]:nth-child(5)  { transition-delay: 240ms; }
[data-reveal-stagger] > [data-reveal]:nth-child(6)  { transition-delay: 300ms; }
[data-reveal-stagger] > [data-reveal]:nth-child(7)  { transition-delay: 360ms; }
[data-reveal-stagger] > [data-reveal]:nth-child(8)  { transition-delay: 420ms; }
[data-reveal-stagger] > [data-reveal]:nth-child(n+9) { transition-delay: 480ms; }

@media (prefers-reduced-motion: reduce) {
    [data-reveal] { opacity: 1 !important; transform: none !important; transition: none !important; }
    .hero__eyebrow-dot { animation: none !important; }
}

/* ─── 19. Utility: container con padding orizzontale forzato ────────── */

.container { width: min(1140px, 92vw); }

/* ─── 20. Headline più larghe per le pagine pubbliche ──────────────── */

.page-home .hero__title,
.page-space .sp-title,
.cat-hero__title {
    text-wrap: balance;
}

/* ─── 21. Microtipografia & link arrow ──────────────────────────────── */

.link-arrow {
    color: var(--accent);
    font-weight: 600;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    transition: gap var(--t-fast) var(--ease-out);
}
.link-arrow:hover { gap: 0.5rem; text-decoration: none; color: var(--accent-2); }

/* ─── 22. Galleria thumbnails / lightbox bordi ──────────────────────── */

.space-gallery__thumb,
.sp-gallery__thumb {
    border-color: var(--hairline);
}
.space-gallery__thumb:hover,
.space-gallery__thumb:focus-visible,
.sp-gallery__thumb:focus-visible {
    border-color: var(--accent);
}

/* ─── 23. Body legacy `.lead` ──────────────────────────────────────── */

.lead { color: var(--text-2); }
.field-hint { color: var(--muted); }

/* ─── 24. Logo wordmark size on small screens ──────────────────────── */

@media (max-width: 420px) {
    .logo span:not(.logo-mark) {
        font-size: 0.95rem;
    }
}

/* ─── 25. Disable hover-lift transform su pointer coarse ──────────── */

@media (hover: none) {
    .btn:hover,
    .cat-card:hover,
    .space-card:hover,
    .how-card:hover,
    .cf-card:hover,
    .admin-quick-card:hover,
    .admin-metric:hover {
        transform: none !important;
    }
}

/* ════════════════════════════════════════════════════════════════════════
   SPACE-EDIT  —  Editor annuncio host (host/space-edit.php)
   Layout sezionato + sticky preview + visual pickers + sticky save bar.
   Scoped in `.page-space-edit` per non interferire con altre pagine.
   ════════════════════════════════════════════════════════════════════════ */

/* Safety net: ogni SVG di default è inline-block 1em, allineato al testo.
   Le regole specifiche (.btn__ico, .se-card__ico svg, ecc.) continuano a vincere. */
svg.ico,
.btn svg.ico,
button svg.ico {
    width: 1em;
    height: 1em;
    flex-shrink: 0;
    vertical-align: -0.125em;
    display: inline-block;
}

body.page-space-edit {
    background: linear-gradient(180deg, var(--surface-2) 0%, var(--bg) 28%);
    --se-radius: 18px;
    --se-radius-sm: 12px;
}

.page-space-edit .main-content {
    max-width: min(1200px, 94vw);
    padding-bottom: 7rem;
}

/* ── Hero della pagina editor ──────────────────────────────────────── */
.se-head {
    margin: 0.5rem 0 1.75rem;
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    justify-content: space-between;
    gap: 1.25rem;
}
.se-head__inner { position: relative; padding-top: 0.85rem; }
.se-head__inner::before {
    content: "";
    position: absolute;
    left: 0; top: 0;
    width: 3rem; height: 4px;
    border-radius: 4px;
    background: linear-gradient(90deg, var(--accent), var(--accent-2));
}
.se-head__eyebrow {
    margin: 0 0 0.4rem;
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.12em;
    color: var(--muted);
}
.se-head__title {
    font-family: var(--font-display);
    font-weight: 400;
    font-size: clamp(1.85rem, 4vw, 2.35rem);
    margin: 0 0 0.4rem;
    letter-spacing: -0.02em;
    line-height: 1.1;
}
.se-head__lead {
    margin: 0;
    color: var(--text-2);
    max-width: 36rem;
    font-size: 1rem;
    line-height: 1.55;
}
.se-head__meta {
    margin: 0.5rem 0 0;
    color: var(--muted);
    font-size: 0.92rem;
}
.se-head__back {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.92rem;
    font-weight: 600;
    color: var(--muted);
    text-decoration: none;
    margin-bottom: 0.75rem;
    transition: color var(--t-fast) var(--ease-out);
}
.se-head__back:hover { color: var(--accent); }
.se-head__back svg { width: 1rem; height: 1rem; }

/* ── Layout principale ─────────────────────────────────────────────── */
.se-layout {
    display: grid;
    gap: 1.75rem;
    align-items: start;
}
@media (min-width: 1000px) {
    .se-layout { grid-template-columns: minmax(0, 1fr) 360px; }
}

/* ── Card sezione ──────────────────────────────────────────────────── */
.se-card {
    background: var(--surface);
    border: 1px solid var(--hairline);
    border-radius: var(--se-radius);
    padding: 1.4rem 1.5rem 1.5rem;
    box-shadow: var(--shadow-xs);
    margin-bottom: 1.25rem;
    transition: box-shadow var(--t-base) var(--ease-out);
}
.se-card:focus-within { box-shadow: var(--shadow-md); }
.se-card__head {
    display: flex;
    gap: 0.85rem;
    align-items: flex-start;
    padding-bottom: 1rem;
    margin-bottom: 1.25rem;
    border-bottom: 1px solid var(--hairline);
}
.se-card__ico {
    flex-shrink: 0;
    width: 2.6rem; height: 2.6rem;
    border-radius: 12px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, var(--accent-soft), transparent);
    color: var(--accent);
    border: 1px solid var(--hairline);
}
.se-card__ico svg { width: 1.3rem; height: 1.3rem; }
.se-card__title {
    margin: 0 0 0.2rem;
    font-size: 1.1rem;
    font-weight: 700;
    color: var(--text);
    letter-spacing: -0.01em;
}
.se-card__desc {
    margin: 0;
    font-size: 0.9rem;
    color: var(--text-2);
    line-height: 1.5;
}
.se-card__num {
    margin-left: auto;
    font-size: 0.72rem;
    font-weight: 700;
    color: var(--muted);
    background: var(--surface-2);
    border: 1px solid var(--hairline);
    border-radius: 999px;
    padding: 0.2rem 0.6rem;
    letter-spacing: 0.06em;
}

/* ── Field grid ────────────────────────────────────────────────────── */
.se-grid {
    display: grid;
    gap: 1.1rem;
    grid-template-columns: 1fr;
}
@media (min-width: 600px) {
    .se-grid--2 { grid-template-columns: 1fr 1fr; }
    .se-field--full { grid-column: 1 / -1; }
}

.se-field { display: flex; flex-direction: column; gap: 0.4rem; }
.se-field__label {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 0.5rem;
    font-weight: 600;
    font-size: 0.9rem;
    color: var(--text);
    margin: 0;
}
.se-field__label--req::after {
    content: "·";
    color: var(--accent);
    font-weight: 800;
    margin-left: 0.25rem;
}
.se-field__hint {
    font-size: 0.82rem;
    color: var(--muted);
    margin: 0;
    line-height: 1.45;
}
.se-field__counter {
    font-size: 0.78rem;
    color: var(--muted);
    font-variant-numeric: tabular-nums;
}
.se-field__counter.is-over { color: var(--danger); font-weight: 700; }

/* Input/select/textarea moderni */
.page-space-edit .se-input,
.page-space-edit .se-textarea,
.page-space-edit .se-select {
    width: 100%;
    max-width: none;
    margin: 0;
    padding: 0.7rem 0.85rem;
    background: var(--surface);
    color: var(--text);
    border: 1px solid var(--border);
    border-radius: 10px;
    font: inherit;
    font-size: 0.95rem;
    transition: border-color var(--t-fast) var(--ease-out),
                box-shadow var(--t-fast) var(--ease-out),
                background-color var(--t-fast) var(--ease-out);
}
.page-space-edit .se-input:focus,
.page-space-edit .se-textarea:focus,
.page-space-edit .se-select:focus {
    outline: none;
    border-color: var(--accent);
    box-shadow: 0 0 0 3px var(--accent-soft);
}
.page-space-edit .se-textarea { min-height: 110px; line-height: 1.55; resize: vertical; }
.page-space-edit .se-textarea--lg { min-height: 180px; }

/* Input con prefix/suffix (per €, m²) */
.se-input-affix {
    position: relative;
    display: flex;
    align-items: center;
}
.se-input-affix__sym {
    position: absolute;
    left: 0.95rem;
    color: var(--muted);
    font-weight: 600;
    pointer-events: none;
    font-size: 0.95rem;
}
.se-input-affix__sym--right {
    left: auto;
    right: 0.95rem;
}
.se-input-affix .se-input { padding-left: 2rem; }
.se-input-affix--right .se-input { padding-left: 0.85rem; padding-right: 2.4rem; }

/* Errore inline */
.se-input.is-error { border-color: var(--danger); box-shadow: 0 0 0 3px rgba(180,35,24,0.12); }

/* ── Visual picker (categoria, station type) ───────────────────────── */
.se-pickers {
    display: grid;
    gap: 0.65rem;
    grid-template-columns: repeat(auto-fill, minmax(155px, 1fr));
}
.se-picker {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.55rem;
    padding: 0.95rem 1rem;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 14px;
    cursor: pointer;
    user-select: none;
    transition: border-color var(--t-fast) var(--ease-out),
                background-color var(--t-fast) var(--ease-out),
                box-shadow var(--t-fast) var(--ease-out),
                transform var(--t-fast) var(--ease-out);
}
.se-picker:hover {
    border-color: var(--border-strong);
    background: var(--surface-2);
}
.se-picker__input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
    width: 0; height: 0;
}
.se-picker__ico {
    width: 2rem;
    height: 2rem;
    border-radius: 9px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--surface-2);
    color: var(--text-2);
    transition: background-color var(--t-fast) var(--ease-out),
                color var(--t-fast) var(--ease-out);
}
.se-picker__ico svg { width: 1.15rem; height: 1.15rem; }
.se-picker__label {
    font-weight: 600;
    font-size: 0.92rem;
    color: var(--text);
    line-height: 1.25;
}
.se-picker__check {
    position: absolute;
    top: 0.65rem;
    right: 0.65rem;
    width: 1.15rem;
    height: 1.15rem;
    border-radius: 50%;
    background: var(--surface-2);
    border: 1px solid var(--border);
    display: flex;
    align-items: center;
    justify-content: center;
    color: transparent;
    transition: all var(--t-fast) var(--ease-out);
}
.se-picker__check svg { width: 0.8rem; height: 0.8rem; }

.se-picker.is-active {
    border-color: var(--accent);
    background: linear-gradient(135deg, var(--accent-soft) 0%, var(--surface) 70%);
    box-shadow: 0 6px 18px -10px var(--accent-glow);
}
.se-picker.is-active .se-picker__ico {
    background: linear-gradient(135deg, var(--accent), var(--accent-2));
    color: #fff;
}
.se-picker.is-active .se-picker__check {
    background: var(--accent);
    border-color: var(--accent);
    color: #fff;
}
.se-picker:focus-within {
    box-shadow: 0 0 0 3px var(--accent-soft);
    outline: none;
}

/* ── Cover thumb ───────────────────────────────────────────────────── */
.se-cover {
    display: grid;
    gap: 1rem;
    grid-template-columns: 180px 1fr;
    align-items: start;
}
@media (max-width: 600px) {
    .se-cover { grid-template-columns: 1fr; }
}
.se-cover__thumb {
    aspect-ratio: 4 / 3;
    border-radius: var(--se-radius-sm);
    border: 1px dashed var(--border);
    background: var(--surface-2);
    overflow: hidden;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--muted);
}
.se-cover__thumb img {
    display: none;
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.se-cover__thumb.is-loaded { border-style: solid; }
.se-cover__empty {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.85rem;
    text-align: center;
    padding: 0.5rem;
}
.se-cover__empty svg { width: 1.6rem; height: 1.6rem; opacity: 0.65; }
.se-cover__thumb.is-broken {
    border-color: var(--danger);
    border-style: solid;
    color: var(--danger);
}

/* ── Galleria thumbs ───────────────────────────────────────────────── */
.se-gallery__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    margin-bottom: 0.5rem;
}
.se-gallery__count {
    font-size: 0.82rem;
    color: var(--muted);
    font-variant-numeric: tabular-nums;
    background: var(--surface-2);
    border: 1px solid var(--hairline);
    padding: 0.25rem 0.6rem;
    border-radius: 999px;
}
.se-gallery__add {
    display: flex;
    gap: 0.5rem;
    align-items: stretch;
}
.se-gallery__add .se-input { flex: 1; }
.se-gallery__add-btn {
    flex-shrink: 0;
    padding-inline: 1.1rem;
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
}
.se-gallery__add-btn svg { width: 1rem; height: 1rem; }
.se-gallery__add-btn:disabled { opacity: 0.55; cursor: not-allowed; }

.se-thumbs {
    list-style: none;
    margin: 0.85rem 0 0;
    padding: 0;
    display: grid;
    gap: 0.65rem;
    grid-template-columns: repeat(auto-fill, minmax(115px, 1fr));
}
.se-thumb {
    position: relative;
    aspect-ratio: 4 / 3;
    border-radius: var(--se-radius-sm);
    overflow: hidden;
    background: var(--surface-2);
    border: 1px solid var(--hairline);
}
.se-thumb__img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
.se-thumb--broken {
    border-color: var(--danger);
}
.se-thumb--broken::before {
    content: "URL non valida";
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(180,35,24,0.08);
    color: var(--danger);
    font-size: 0.78rem;
    font-weight: 600;
    text-align: center;
    padding: 0.5rem;
}
.se-thumb__actions {
    position: absolute;
    top: 0.4rem;
    right: 0.4rem;
    display: flex;
    gap: 0.3rem;
    opacity: 0;
    transition: opacity var(--t-fast) var(--ease-out);
}
.se-thumb:hover .se-thumb__actions,
.se-thumb:focus-within .se-thumb__actions { opacity: 1; }
.se-thumb__btn {
    width: 1.85rem;
    height: 1.85rem;
    border-radius: 999px;
    border: 0;
    cursor: pointer;
    background: rgba(20, 18, 15, 0.78);
    color: #fff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: background var(--t-fast) var(--ease-out),
                transform var(--t-fast) var(--ease-out);
}
.se-thumb__btn:hover { background: rgba(20,18,15,0.92); transform: scale(1.06); }
.se-thumb__btn:focus-visible {
    outline: none;
    box-shadow: 0 0 0 3px rgba(255,255,255,0.45);
}
.se-thumb__btn--del:hover { background: var(--danger); }

/* ── Mappa ─────────────────────────────────────────────────────────── */
.se-map-block { margin-top: 0.5rem; }
.se-map-block__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
    margin-bottom: 0.75rem;
}
.se-map-status {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.8rem;
    font-weight: 700;
    color: var(--muted);
    background: var(--surface-2);
    border: 1px solid var(--hairline);
    padding: 0.3rem 0.7rem;
    border-radius: 999px;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}
.se-map-status::before {
    content: "";
    display: inline-block;
    width: 0.55rem; height: 0.55rem;
    border-radius: 50%;
    background: var(--muted);
}
.se-map-status.is-set {
    color: var(--accent);
    background: var(--accent-soft);
    border-color: rgba(14,107,92,0.22);
}
.se-map-status.is-set::before { background: var(--accent); box-shadow: 0 0 0 3px var(--accent-soft); }

.se-map {
    height: 320px;
    width: 100%;
    border-radius: var(--se-radius-sm);
    border: 1px solid var(--hairline);
    overflow: hidden;
    background: #dfe8ec;
}
.se-map[hidden] { display: none; }

.se-map-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-top: 0.85rem;
}
.se-map-actions .btn {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
}
.se-map-actions .btn svg { width: 1rem; height: 1rem; }
.se-map-actions .btn.is-loading {
    opacity: 0.65;
    cursor: progress;
}
.se-map-actions .btn.is-loading::after {
    content: "";
    width: 14px; height: 14px;
    border: 2px solid currentColor;
    border-top-color: transparent;
    border-radius: 50%;
    animation: se-spin 0.7s linear infinite;
}
@keyframes se-spin { to { transform: rotate(360deg); } }

.se-coord-grid {
    margin-top: 0.85rem;
    display: grid;
    gap: 0.6rem;
    grid-template-columns: 1fr 1fr;
}
@media (max-width: 480px) { .se-coord-grid { grid-template-columns: 1fr; } }

/* Lock visivo per Pro feature */
.se-locked {
    background: linear-gradient(135deg, var(--surface-2), var(--surface));
    border: 1px dashed var(--border-strong);
    border-radius: var(--se-radius-sm);
    padding: 1.5rem 1.5rem;
    text-align: center;
    color: var(--text-2);
}
.se-locked__crown {
    width: 2.4rem; height: 2.4rem;
    margin: 0 auto 0.6rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--gold) 0%, #e0b94a 100%);
    color: #fff;
    box-shadow: 0 4px 12px -4px rgba(201,162,39,0.45);
}
.se-locked__crown svg { width: 1.25rem; height: 1.25rem; }
.se-locked__title {
    font-size: 1rem;
    font-weight: 700;
    color: var(--text);
    margin: 0 0 0.35rem;
}
.se-locked__text {
    margin: 0 0 0.85rem;
    font-size: 0.9rem;
    color: var(--text-2);
    line-height: 1.5;
}

/* ── Modern toggle switch ──────────────────────────────────────────── */
.se-switch {
    display: flex;
    align-items: center;
    gap: 0.85rem;
    padding: 1rem 1.1rem;
    background: var(--surface-2);
    border: 1px solid var(--hairline);
    border-radius: var(--se-radius-sm);
    cursor: pointer;
    user-select: none;
    transition: border-color var(--t-fast) var(--ease-out),
                background-color var(--t-fast) var(--ease-out);
}
.se-switch:hover { border-color: var(--border-strong); }
.se-switch__input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
    width: 0; height: 0;
}
.se-switch__visual {
    flex-shrink: 0;
    position: relative;
    width: 2.85rem;
    height: 1.65rem;
    border-radius: 999px;
    background: var(--border-strong);
    transition: background-color var(--t-base) var(--ease-out);
}
.se-switch__visual::after {
    content: "";
    position: absolute;
    top: 3px;
    left: 3px;
    width: calc(1.65rem - 6px);
    height: calc(1.65rem - 6px);
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 1px 3px rgba(0,0,0,0.18);
    transition: transform var(--t-base) var(--ease-out);
}
.se-switch__input:checked ~ .se-switch__visual {
    background: linear-gradient(135deg, var(--accent), var(--accent-2));
}
.se-switch__input:checked ~ .se-switch__visual::after {
    transform: translateX(calc(2.85rem - 1.65rem));
}
.se-switch__label {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
}
.se-switch__title {
    font-weight: 700;
    color: var(--text);
    font-size: 0.95rem;
}
.se-switch__hint {
    font-size: 0.82rem;
    color: var(--text-2);
    line-height: 1.45;
}
.se-switch__input:focus-visible ~ .se-switch__visual {
    box-shadow: 0 0 0 3px var(--accent-soft);
}

/* ── Sidebar preview ───────────────────────────────────────────────── */
.se-aside { position: relative; }
@media (min-width: 1000px) {
    .se-aside__inner {
        position: sticky;
        top: calc(var(--header-h) + 1rem);
        display: flex;
        flex-direction: column;
        gap: 1rem;
    }
}

.se-pv {
    background: var(--surface);
    border: 1px solid var(--hairline);
    border-radius: var(--se-radius);
    overflow: hidden;
    box-shadow: var(--shadow-md);
}
.se-pv__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.7rem 1rem;
    border-bottom: 1px solid var(--hairline);
    background: var(--surface-2);
}
.se-pv__head-title {
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--muted);
}
.se-pv__head-pulse {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.78rem;
    color: var(--accent);
    font-weight: 600;
}
.se-pv__head-pulse::before {
    content: "";
    width: 7px; height: 7px;
    border-radius: 50%;
    background: var(--accent);
    box-shadow: 0 0 0 3px var(--accent-soft);
    animation: pulse-dot 2.4s var(--ease-in-out) infinite;
}

.se-pv__visual {
    aspect-ratio: 16 / 10;
    position: relative;
    background-color: #5c5348;
    overflow: hidden;
}
.se-pv__visual--parrucchiere    { background-color: #5c4033; background-image: linear-gradient(135deg,#5c4033,#8b6914); }
.se-pv__visual--centro_estetico { background-color: #6b3d5c; background-image: linear-gradient(135deg,#6b3d5c,#9b5f85); }
.se-pv__visual--spa             { background-color: #2c4a5c; background-image: linear-gradient(135deg,#2c4a5c,#4a7a8c); }
.se-pv__visual--salone          { background-color: #3d3d3b; background-image: linear-gradient(135deg,#3d3d3b,#6b6965); }
.se-pv__visual--negozio         { background-color: #453d5e; background-image: linear-gradient(135deg,#453d5e,#6c5b8a); }
.se-pv__visual--altro           { background-color: #0c5c52; background-image: linear-gradient(135deg,#0c5c52,#3a8f85); }

.se-pv__img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.se-pv__placeholder {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    color: rgba(255,255,255,0.7);
    font-size: 0.9rem;
}
.se-pv__placeholder svg { width: 2.5rem; height: 2.5rem; opacity: 0.6; }
.se-pv__badge {
    position: absolute;
    top: 0.7rem;
    left: 0.7rem;
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.35rem 0.65rem 0.35rem 0.5rem;
    background: rgba(255,255,255,0.94);
    color: var(--text);
    border-radius: 999px;
    font-size: 0.74rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    backdrop-filter: blur(6px);
}
.se-pv__price {
    position: absolute;
    top: 0.7rem;
    right: 0.7rem;
    padding: 0.35rem 0.7rem;
    background: rgba(20,18,15,0.86);
    color: #fff;
    border-radius: 999px;
    font-size: 0.92rem;
    font-weight: 700;
    backdrop-filter: blur(6px);
    font-variant-numeric: tabular-nums;
}
.se-pv__price-unit {
    font-size: 0.7rem;
    font-weight: 500;
    opacity: 0.85;
}
.se-pv__body {
    padding: 1rem 1.15rem 1.15rem;
}
.se-pv__title {
    margin: 0 0 0.4rem;
    font-size: 1rem;
    font-weight: 700;
    line-height: 1.3;
    color: var(--text);
    word-wrap: break-word;
}
.se-pv__meta {
    margin: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem 0.85rem;
    font-size: 0.85rem;
    color: var(--text-2);
}
.se-pv__meta-item {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
}
.se-pv__meta-item svg { width: 0.85rem; height: 0.85rem; color: var(--muted); }
.se-pv__chip {
    display: inline-block;
    margin-top: 0.65rem;
    font-size: 0.72rem;
    font-weight: 700;
    color: var(--accent);
    background: var(--accent-soft);
    padding: 0.22rem 0.55rem;
    border-radius: 6px;
}

/* ── Tips card sotto la preview ────────────────────────────────────── */
.se-tips {
    background: linear-gradient(135deg, var(--accent-soft) 0%, var(--surface) 70%);
    border: 1px solid rgba(14,107,92,0.22);
    border-radius: var(--se-radius);
    padding: 1.1rem 1.2rem;
}
.se-tips__title {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.85rem;
    font-weight: 700;
    color: var(--accent);
    margin: 0 0 0.6rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
}
.se-tips__title svg { width: 1rem; height: 1rem; }
.se-tips__list {
    margin: 0;
    padding-left: 0;
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
    font-size: 0.86rem;
    color: var(--text-2);
    line-height: 1.5;
}
.se-tips__list li {
    display: flex;
    gap: 0.45rem;
    align-items: flex-start;
}
.se-tips__list li::before {
    content: "✓";
    color: var(--accent);
    font-weight: 700;
    flex-shrink: 0;
}

/* ── Sticky save bar ───────────────────────────────────────────────── */
.se-savebar {
    position: fixed;
    left: 50%;
    bottom: 1rem;
    transform: translateX(-50%);
    z-index: 60;
    width: min(720px, calc(100vw - 2rem));
    background: var(--surface);
    border: 1px solid var(--hairline);
    border-radius: 999px;
    padding: 0.5rem 0.5rem 0.5rem 1.4rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    box-shadow: var(--shadow-lg);
    backdrop-filter: saturate(160%) blur(12px);
    transition: box-shadow var(--t-base) var(--ease-out),
                transform var(--t-base) var(--ease-out);
}
.se-savebar__hint {
    font-size: 0.88rem;
    color: var(--text-2);
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    min-width: 0;
    flex: 1;
}
.se-savebar__hint svg { width: 1rem; height: 1rem; color: var(--muted); flex-shrink: 0; }
.se-savebar__actions {
    display: flex;
    gap: 0.5rem;
    flex-shrink: 0;
}
.se-savebar .btn {
    border-radius: 999px;
    padding: 0.6rem 1.2rem;
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
}
.se-savebar.is-dirty {
    box-shadow: 0 16px 40px -10px var(--accent-glow), var(--shadow-lg);
}
.se-savebar.is-dirty .se-savebar__hint { color: var(--accent); }
.se-savebar.is-dirty .se-savebar__hint svg { color: var(--accent); }
.se-savebar.is-dirty .se-savebar__primary {
    animation: se-savebar-pulse 1.8s var(--ease-in-out) infinite;
}
@keyframes se-savebar-pulse {
    0%, 100% { box-shadow: 0 6px 16px -8px var(--accent-glow); }
    50%      { box-shadow: 0 12px 26px -6px var(--accent-glow); }
}

@media (max-width: 720px) {
    .se-savebar {
        bottom: 0;
        width: 100%;
        border-radius: 16px 16px 0 0;
        padding: 0.7rem 1rem;
    }
    .se-savebar__hint span { display: none; }
}

/* ── Plan banner moderno (Free) ────────────────────────────────────── */
.se-plan-alert {
    display: flex;
    gap: 0.85rem;
    align-items: flex-start;
    padding: 1rem 1.15rem;
    background: linear-gradient(135deg, var(--gold-soft) 0%, var(--surface) 70%);
    border: 1px solid rgba(201,162,39,0.3);
    border-radius: var(--se-radius);
    margin-bottom: 1.5rem;
}
.se-plan-alert__ico {
    flex-shrink: 0;
    width: 2.3rem; height: 2.3rem;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--gold), #e0b94a);
    color: #fff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
.se-plan-alert__ico svg { width: 1.15rem; height: 1.15rem; }
.se-plan-alert__body { flex: 1; }
.se-plan-alert__title {
    font-weight: 700;
    color: var(--text);
    margin: 0 0 0.2rem;
    font-size: 0.95rem;
}
.se-plan-alert__text {
    margin: 0;
    color: var(--text-2);
    font-size: 0.88rem;
    line-height: 1.5;
}
.se-plan-alert__text a {
    font-weight: 600;
    color: var(--accent);
    text-decoration: underline;
    text-underline-offset: 2px;
}

/* ── Header card stat (top form) ───────────────────────────────────── */
.se-progress {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
    margin: 0 0 0.85rem;
}
.se-progress__step {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.3rem 0.7rem;
    border-radius: 999px;
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--muted);
    background: var(--surface-2);
    border: 1px solid var(--hairline);
}
.se-progress__step.is-active {
    color: var(--accent);
    background: var(--accent-soft);
    border-color: rgba(14,107,92,0.28);
}
.se-progress__step.is-active::before {
    content: "";
    display: inline-block;
    width: 0.5rem; height: 0.5rem;
    border-radius: 50%;
    background: var(--accent);
}

/* =====================================================================
   PANNELLI MODERNI PER DASHBOARD & ADMIN
   Estensioni del sistema .se-* per riusarlo su host/dashboard.php
   e tutte le pagine admin.
   ===================================================================== */

/* Larghezza interna più generosa anche su queste pagine */
.page-host .main-content,
.page-pro .main-content {
    max-width: min(1240px, 94vw);
    padding-bottom: 5rem;
}

/* Admin: il <main> ha anche .container (~1140px) — qui sovrascriviamo per tabelle larghe senza scroll orizzontale. */
body.page-admin .main-content.container {
    width: 100%;
    max-width: min(1920px, calc(100vw - 2rem));
    margin-left: auto;
    margin-right: auto;
    padding-left: max(1rem, env(safe-area-inset-left, 0px));
    padding-right: max(1rem, env(safe-area-inset-right, 0px));
    padding-bottom: 5rem;
    box-sizing: border-box;
}

@media (min-width: 900px) {
    /* Evita che il bordo arrotondato della card tagli la tabella se le colonne richiedono più spazio. */
    body.page-admin .se-card--flush {
        overflow: visible;
    }
    body.page-admin .table-wrap {
        overflow-x: visible;
    }
    body.page-admin .table-wrap table {
        width: 100%;
        font-size: 0.86rem;
    }
    body.page-admin .table-wrap th,
    body.page-admin .table-wrap td {
        padding: 0.55rem 0.65rem;
        vertical-align: top;
    }
}

/* ——— Admin / host / pro: mobile ≤899px (layout, tabelle, touch) ——— */
@media (max-width: 899px) {
    body.page-admin .main-content.container,
    body.page-host .main-content,
    body.page-pro .main-content {
        padding-left: max(0.75rem, env(safe-area-inset-left, 0px));
        padding-right: max(0.75rem, env(safe-area-inset-right, 0px));
    }

    body.page-admin .se-head,
    body.page-host .se-head,
    body.page-pro .se-head {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.6rem;
        margin-bottom: 1rem;
    }
    body.page-admin .se-head__title,
    body.page-host .se-head__title,
    body.page-pro .se-head__title {
        font-size: clamp(1.28rem, 5.2vw, 1.72rem);
        line-height: 1.15;
    }
    body.page-admin .se-head__lead,
    body.page-host .se-head__lead,
    body.page-pro .se-head__lead {
        max-width: none;
        font-size: 0.9rem;
        line-height: 1.5;
    }

    /* Nav admin a tutta larghezza, voci più alte al dito */
    body.page-admin .admin-nav-wrap {
        margin-left: calc(-1 * max(0.75rem, env(safe-area-inset-left, 0px)));
        margin-right: calc(-1 * max(0.75rem, env(safe-area-inset-right, 0px)));
    }
    body.page-admin .admin-nav {
        border-radius: 0;
        border-left: none;
        border-right: none;
        padding: 0.4rem 0.45rem;
        gap: 0.35rem;
    }
    body.page-admin .admin-nav__item {
        min-height: 2.75rem;
        padding: 0.5rem 0.7rem;
        font-size: 0.82rem;
    }
    body.page-admin .admin-nav__label {
        white-space: nowrap;
    }

    body.page-admin .se-toolbar,
    body.page-host .se-toolbar,
    body.page-pro .se-toolbar {
        flex-direction: column;
        align-items: stretch;
        gap: 0.65rem;
        margin-bottom: 0.85rem;
    }
    body.page-admin .se-toolbar__right,
    body.page-host .se-toolbar__right,
    body.page-pro .se-toolbar__right {
        margin-left: 0;
    }

    body.page-admin .se-stats,
    body.page-host .se-stats,
    body.page-pro .se-stats {
        grid-template-columns: 1fr;
        gap: 0.7rem;
    }
    body.page-admin .se-stat,
    body.page-host .se-stat,
    body.page-pro .se-stat {
        padding: 0.9rem 1rem;
    }
    body.page-admin .se-stat__value {
        font-size: 1.4rem;
    }

    body.page-admin .admin-quick-grid {
        grid-template-columns: 1fr;
        gap: 0.75rem;
    }
    body.page-admin .admin-quick-card {
        padding: 1rem 1.05rem 1.15rem;
        min-height: 2.75rem;
    }

    body.page-admin .se-card:not(.se-card--flush),
    body.page-host .se-card:not(.se-card--flush),
    body.page-pro .se-card:not(.se-card--flush) {
        padding: 1.1rem 1rem 1.2rem;
        margin-bottom: 1rem;
    }
    body.page-admin .se-card--flush > .se-card__head {
        padding: 0.85rem 0.9rem;
        flex-wrap: wrap;
        gap: 0.5rem;
    }
    body.page-admin .se-card__num {
        font-size: 0.8rem;
    }

    /* Tabella: scroll orizzontale solo nel box, niente overflow sulla pagina */
    body.page-admin .se-card--flush {
        overflow: hidden;
        border-radius: var(--se-radius-sm, 12px);
    }
    body.page-admin .se-card--flush .table-wrap {
        overflow-x: auto;
        overflow-y: visible;
        -webkit-overflow-scrolling: touch;
        overscroll-behavior-x: contain;
        touch-action: pan-x pan-y;
        scrollbar-width: thin;
    }
    body.page-admin .table-wrap table {
        min-width: 680px;
        width: max-content;
        max-width: none;
    }
    body.page-admin .se-card--flush table th:first-child,
    body.page-admin .se-card--flush table td:first-child {
        padding-left: 0.75rem;
    }
    body.page-admin .se-card--flush table th:last-child,
    body.page-admin .se-card--flush table td:last-child {
        padding-right: 0.75rem;
    }
    body.page-admin .table-wrap th,
    body.page-admin .table-wrap td {
        font-size: 0.76rem;
        padding: 0.45rem 0.38rem;
        vertical-align: top;
    }
    body.page-admin .table-wrap td:nth-child(2),
    body.page-admin .table-wrap td:nth-child(4) {
        white-space: normal;
        word-break: break-word;
        max-width: 10.5rem;
    }

    body.page-admin .table-wrap .btn,
    body.page-admin .table-wrap .btn-sm {
        min-height: 2.65rem;
        padding: 0.45rem 0.55rem;
        font-size: 0.78rem;
        line-height: 1.2;
        white-space: normal;
    }

    .admin-user-actions__stack {
        min-width: 7.25rem;
        max-width: 10.5rem;
        gap: 0.4rem;
    }

    body.page-admin .se-tip {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.5rem;
        padding: 1rem 0.95rem;
    }
    body.page-admin .se-tip__code {
        font-size: 0.68rem;
        word-break: break-all;
        max-width: 100%;
    }

    body.page-host .table-wrap,
    body.page-pro .table-wrap {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        overscroll-behavior-x: contain;
        scrollbar-width: thin;
    }
    body.page-host .table-wrap table,
    body.page-pro .table-wrap table {
        font-size: 0.8rem;
    }
}

/* ── Header pagina con back link integrato ─────────────────────────── */
.se-head--admin {
    align-items: flex-start;
    margin-bottom: 1.4rem;
}
.se-head__top {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-wrap: wrap;
    margin-bottom: 0.4rem;
}
.se-head__back--inline {
    margin: 0;
    padding: 0.35rem 0.75rem 0.35rem 0.55rem;
    border-radius: 999px;
    background: var(--surface);
    border: 1px solid var(--hairline);
    box-shadow: var(--shadow-xs);
}
.se-head__back--inline:hover {
    border-color: var(--accent);
    color: var(--accent);
    background: var(--accent-soft);
}
.se-head__actions {
    display: inline-flex;
    flex-wrap: wrap;
    gap: 0.55rem;
    align-items: center;
}

/* ── Card "flush" per ospitare tabelle a tutta larghezza ──────────── */
.se-card--flush {
    padding: 0;
    overflow: hidden;
}
.se-card--flush > .se-card__head {
    padding: 1.25rem 1.5rem;
    margin-bottom: 0;
    border-bottom: 1px solid var(--hairline);
}
.se-card--flush > .se-card__body {
    padding: 1.25rem 1.5rem;
}
.se-card--flush .table-wrap {
    border: 0;
    border-radius: 0;
    box-shadow: none;
    background: transparent;
}
.se-card--flush table {
    border-radius: 0;
    overflow: visible;
    margin: 0;
}
.se-card--flush thead th {
    background: var(--surface-2);
    border-top: 0;
}
.se-card--flush table th:first-child,
.se-card--flush table td:first-child {
    padding-left: 1.5rem;
}
.se-card--flush table th:last-child,
.se-card--flush table td:last-child {
    padding-right: 1.5rem;
}
.se-card--flush table tr:last-child td {
    border-bottom: 0;
}

/* ── Toolbar pulsanti / filtri sopra le tabelle ───────────────────── */
.se-toolbar {
    display: flex;
    flex-wrap: wrap;
    gap: 0.6rem;
    align-items: center;
    justify-content: flex-start;
    margin: 0 0 1.1rem;
}
.se-toolbar__left,
.se-toolbar__right {
    display: inline-flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    align-items: center;
}
.se-toolbar__right { margin-left: auto; }
.se-toolbar .btn { line-height: 1.2; }

/* ── Pillbar (segmented control con link) ─────────────────────────── */
.se-pillbar {
    display: inline-flex;
    flex-wrap: wrap;
    gap: 0.35rem;
    padding: 0.3rem;
    background: var(--surface);
    border: 1px solid var(--hairline);
    border-radius: 999px;
    box-shadow: var(--shadow-xs);
}
.se-pill {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.45rem 0.95rem;
    border-radius: 999px;
    font-size: 0.88rem;
    font-weight: 600;
    color: var(--text-2);
    text-decoration: none;
    transition: background-color var(--t-fast) var(--ease-out),
                color var(--t-fast) var(--ease-out);
    border: 1px solid transparent;
}
.se-pill:hover { color: var(--accent); background: var(--accent-soft); }
.se-pill.is-active {
    background: linear-gradient(135deg, var(--accent), var(--accent-2));
    color: #fff;
    border-color: transparent;
    box-shadow: 0 6px 18px -8px rgba(14,107,92,0.55);
}
.se-pill.is-active:hover { color: #fff; }

/* ── Stat tile compatte (per dashboard) ───────────────────────────── */
.se-stats {
    display: grid;
    gap: 0.9rem;
    grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
    margin: 0 0 1.6rem;
}
.se-stat {
    background: var(--surface);
    border: 1px solid var(--hairline);
    border-radius: var(--se-radius);
    padding: 1rem 1.1rem;
    box-shadow: var(--shadow-xs);
    display: flex;
    align-items: center;
    gap: 0.85rem;
    transition: transform var(--t-base) var(--ease-out),
                box-shadow var(--t-base) var(--ease-out),
                border-color var(--t-base) var(--ease-out);
}
.se-stat:hover {
    transform: translateY(-2px);
    box-shadow: var(--shadow-md);
    border-color: rgba(14,107,92,0.18);
}
.se-stat__ico {
    flex-shrink: 0;
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 12px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, var(--accent-soft), transparent);
    color: var(--accent);
    border: 1px solid var(--hairline);
}
.se-stat__ico svg { width: 1.2rem; height: 1.2rem; }
.se-stat__body { display: flex; flex-direction: column; min-width: 0; }
.se-stat__value {
    font-family: var(--font-display);
    font-size: 1.65rem;
    font-weight: 500;
    line-height: 1;
    color: var(--text);
    letter-spacing: -0.02em;
}
.se-stat__label {
    font-size: 0.78rem;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--muted);
    margin-top: 0.3rem;
    font-weight: 600;
}
.se-stat--accent .se-stat__ico {
    background: linear-gradient(135deg, var(--accent), var(--accent-2));
    color: #fff;
    border-color: transparent;
}
.se-stat--coral .se-stat__ico {
    background: linear-gradient(135deg, #f3b9a4, #d97757);
    color: #fff;
    border-color: transparent;
}
.se-stat--gold .se-stat__ico {
    background: var(--gold-soft);
    color: #8a6d1d;
    border-color: rgba(212,175,55,0.3);
}

/* ── Empty state ───────────────────────────────────────────────────── */
.se-empty {
    text-align: center;
    padding: 2.4rem 1.5rem;
    border: 1px dashed var(--hairline);
    border-radius: var(--se-radius);
    background: var(--surface-2);
    color: var(--text-2);
}
.se-empty__ico {
    width: 3rem; height: 3rem;
    margin: 0 auto 0.75rem;
    border-radius: 50%;
    background: var(--surface);
    border: 1px solid var(--hairline);
    color: var(--accent);
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
.se-empty__ico svg { width: 1.4rem; height: 1.4rem; }
.se-empty__title {
    font-weight: 600;
    color: var(--text);
    margin: 0 0 0.4rem;
    font-size: 1rem;
}
.se-empty__text { margin: 0 auto 0.75rem; max-width: 32rem; line-height: 1.5; font-size: 0.92rem; }
.se-empty__cta { display: inline-flex; gap: 0.35rem; align-items: center; }

/* ── Definition list moderna ──────────────────────────────────────── */
.se-dl {
    display: grid;
    grid-template-columns: minmax(180px, 220px) 1fr;
    gap: 0.4rem 1.2rem;
    font-size: 0.92rem;
}
@media (max-width: 600px) {
    .se-dl { grid-template-columns: 1fr; }
    .se-dl dt { padding-bottom: 0; }
    .se-dl dd { padding-bottom: 0.6rem; border-bottom: 1px solid var(--hairline); }
}
.se-dl dt {
    color: var(--muted);
    font-weight: 600;
    padding-top: 0.6rem;
    border-top: 1px solid var(--hairline);
}
.se-dl dd {
    margin: 0;
    padding-top: 0.6rem;
    color: var(--text);
    border-top: 1px solid var(--hairline);
    word-break: break-word;
}
.se-dl > dt:first-of-type,
.se-dl > dd:first-of-type {
    border-top: 0;
    padding-top: 0;
}
.se-dl pre {
    margin: 0;
    padding: 0.6rem 0.8rem;
    background: var(--surface-2);
    border: 1px solid var(--hairline);
    border-radius: 8px;
    font-size: 0.82rem;
    white-space: pre-wrap;
    word-break: break-word;
}
.se-dl code {
    background: var(--surface-2);
    padding: 0.1rem 0.4rem;
    border-radius: 6px;
    border: 1px solid var(--hairline);
    font-size: 0.85em;
}

/* ── Sub-card per gli annunci dentro host-detail ──────────────────── */
.se-subcard {
    background: var(--surface);
    border: 1px solid var(--hairline);
    border-radius: 14px;
    padding: 1.1rem 1.25rem;
    margin-bottom: 1rem;
    box-shadow: var(--shadow-xs);
    transition: box-shadow var(--t-base) var(--ease-out);
}
.se-subcard:hover { box-shadow: var(--shadow-md); }
.se-subcard__head {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.6rem;
    margin-bottom: 0.6rem;
    padding-bottom: 0.55rem;
    border-bottom: 1px dashed var(--hairline);
}
.se-subcard__title {
    margin: 0;
    font-size: 1rem;
    font-weight: 700;
    color: var(--text);
    letter-spacing: -0.01em;
    flex: 1;
    min-width: 0;
    overflow-wrap: anywhere;
}
.se-subcard__badge {
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    padding: 0.18rem 0.55rem;
    border-radius: 999px;
    background: var(--surface-2);
    color: var(--muted);
    border: 1px solid var(--hairline);
}
.se-subcard__badge--on { background: var(--accent-soft); color: var(--accent); border-color: rgba(14,107,92,0.22); }
.se-subcard__links {
    margin: 0 0 0.6rem;
    font-size: 0.88rem;
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem 0.85rem;
    align-items: center;
}

/* ── Banner piano host modernizzato ───────────────────────────────── */
.se-plan-bar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 1rem;
    background: var(--surface);
    border: 1px solid var(--hairline);
    border-radius: var(--se-radius);
    padding: 0.95rem 1.2rem;
    margin: 0 0 1.4rem;
    box-shadow: var(--shadow-xs);
    position: relative;
    overflow: hidden;
}
.se-plan-bar::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, var(--accent-soft), transparent 55%);
    opacity: 0.6;
    pointer-events: none;
}
.se-plan-bar > * { position: relative; z-index: 1; }
.se-plan-bar__ico {
    width: 2.3rem;
    height: 2.3rem;
    border-radius: 11px;
    background: var(--surface-2);
    border: 1px solid var(--hairline);
    color: var(--accent);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}
.se-plan-bar__ico svg { width: 1.15rem; height: 1.15rem; }
.se-plan-bar__body { display: flex; flex-direction: column; gap: 0.15rem; min-width: 0; }
.se-plan-bar__title {
    font-weight: 700;
    font-size: 0.98rem;
    color: var(--text);
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    align-items: center;
}
.se-plan-bar__pill {
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    padding: 0.18rem 0.55rem;
    border-radius: 999px;
    background: var(--gold-soft);
    color: #8a6d1d;
    border: 1px solid rgba(212,175,55,0.3);
}
.se-plan-bar__pill--pro {
    background: linear-gradient(135deg, var(--accent), var(--accent-2));
    color: #fff;
    border-color: transparent;
}
.se-plan-bar__meta {
    color: var(--text-2);
    font-size: 0.88rem;
    line-height: 1.45;
}
.se-plan-bar__actions {
    display: inline-flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-left: auto;
}

/* ── Tip box modernizzato (Admin > Suggerimento tecnico) ──────────── */
.se-tip {
    margin: 1.5rem 0 0;
    padding: 1.1rem 1.25rem;
    border-radius: var(--se-radius);
    background: var(--surface);
    border: 1px solid var(--hairline);
    border-left: 3px solid var(--accent);
    box-shadow: var(--shadow-xs);
    display: flex;
    gap: 0.85rem;
    align-items: flex-start;
}
.se-tip__ico {
    flex-shrink: 0;
    width: 2rem;
    height: 2rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    background: var(--accent-soft);
    color: var(--accent);
}
.se-tip__title {
    display: block;
    font-weight: 700;
    color: var(--text);
    margin-bottom: 0.25rem;
}
.se-tip__text { margin: 0 0 0.5rem; color: var(--text-2); font-size: 0.92rem; }
.se-tip code,
.se-tip__code {
    display: block;
    background: var(--surface-2);
    border: 1px solid var(--hairline);
    border-radius: 8px;
    padding: 0.55rem 0.75rem;
    font-size: 0.85rem;
    color: var(--text);
    overflow-x: auto;
    white-space: pre-wrap;
    word-break: break-all;
}

/* ── Riga "muted" tabelle: piccola decorazione ────────────────────── */
.table-row-muted td {
    color: var(--muted);
    background: linear-gradient(90deg, transparent, rgba(212,175,55,0.06), transparent);
}

/* ── Sticky sub-actions a dx in toolbar ───────────────────────────── */
@media (max-width: 700px) {
    .se-toolbar__right { margin-left: 0; }
}

/* Inline form actions su tabelle admin utenti */
.admin-inline-form + .admin-inline-form {
    margin-top: 0;
}

/* =====================================================================
   AUTH — login, registrazione, recupero password (look “team umano”)
   ===================================================================== */

.page-auth .main-content {
    max-width: 26rem;
    margin-left: auto;
    margin-right: auto;
    padding-top: 1.25rem;
    padding-bottom: 3.5rem;
}

.page-auth--register .main-content {
    max-width: min(1040px, 94vw);
}

/* Account in attesa: header se-head + pulsanti */
.page-auth--pending .main-content {
    max-width: min(34rem, 94vw);
}

.auth-register {
    display: grid;
    gap: 1.5rem;
    align-items: start;
}
@media (min-width: 960px) {
    .auth-register {
        grid-template-columns: minmax(0, 1fr) minmax(300px, 460px);
        gap: 2.25rem;
        align-items: start;
    }
}

/* Registrazione / editor annuncio: margini sicuri su mobile (notch, scroll lungo) */
@media (max-width: 640px) {
    .page-auth--register .main-content {
        max-width: 100%;
        padding-left: max(1rem, env(safe-area-inset-left, 0px));
        padding-right: max(1rem, env(safe-area-inset-right, 0px));
    }
    .page-auth--register .auth-card--wide {
        padding: 1.25rem 1rem 1.5rem;
    }
    .page-space-edit .main-content {
        max-width: 100%;
        padding-left: max(0.75rem, env(safe-area-inset-left, 0px));
        padding-right: max(0.75rem, env(safe-area-inset-right, 0px));
    }
}

.auth-register__aside-hint {
    font-size: 0.85rem;
    color: var(--muted);
    margin: 0 0 0.75rem;
    line-height: 1.45;
}

.auth-card {
    background: var(--surface);
    border: 1px solid var(--hairline);
    border-radius: 18px;
    padding: 1.75rem 1.5rem 1.5rem;
    box-shadow: var(--shadow-md);
}
.auth-card--wide { padding-bottom: 1.75rem; }

.auth-card__head {
    margin-bottom: 1.35rem;
    padding-bottom: 1.1rem;
    border-bottom: 1px solid var(--hairline);
    position: relative;
}
.auth-card__head::before {
    content: "";
    position: absolute;
    left: 0;
    bottom: -1px;
    width: 3rem;
    height: 3px;
    border-radius: 3px;
    background: linear-gradient(90deg, var(--accent), var(--accent-2));
}

.auth-card__eyebrow {
    margin: 0 0 0.45rem;
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.12em;
    color: var(--muted);
}

.auth-card__title {
    font-family: var(--font-display);
    font-weight: 400;
    font-size: clamp(1.75rem, 3.5vw, 2.15rem);
    margin: 0 0 0.45rem;
    letter-spacing: -0.02em;
    line-height: 1.12;
    color: var(--text);
}

.auth-card__lead {
    margin: 0;
    color: var(--text-2);
    font-size: 0.95rem;
    line-height: 1.55;
    max-width: 36rem;
}

.auth-alert {
    padding: 0.75rem 1rem;
    border-radius: 12px;
    font-size: 0.92rem;
    font-weight: 500;
    margin-bottom: 1rem;
    border: 1px solid var(--hairline);
}
.auth-alert--success {
    background: var(--accent-soft);
    color: var(--accent);
    border-color: rgba(14, 107, 92, 0.22);
}
.auth-alert--error {
    background: rgba(180, 35, 24, 0.08);
    color: var(--danger);
    border-color: rgba(180, 35, 24, 0.22);
}

.auth-form {
    display: flex;
    flex-direction: column;
    gap: 1.1rem;
}

.field { display: flex; flex-direction: column; gap: 0.35rem; }
.field__label {
    font-size: 0.88rem;
    font-weight: 600;
    color: var(--text);
}
.field__label-row {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    justify-content: space-between;
    gap: 0.5rem;
}
.field__aux {
    font-size: 0.82rem;
    font-weight: 600;
    color: var(--accent);
    text-decoration: none;
}
.field__aux:hover { text-decoration: underline; }
.field__control {
    display: flex;
    align-items: stretch;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 12px;
    transition: border-color var(--t-fast) var(--ease-out), box-shadow var(--t-fast) var(--ease-out);
}
.field__control--plain { background: var(--surface); }
.field__control:focus-within {
    border-color: var(--accent);
    box-shadow: 0 0 0 3px var(--accent-soft);
}
.field__ico {
    display: inline-flex;
    align-items: center;
    padding-left: 0.85rem;
    color: var(--muted);
    flex-shrink: 0;
}
.field__ico svg { width: 1.1rem; height: 1.1rem; }
.field__input {
    flex: 1;
    min-width: 0;
    border: 0;
    background: transparent;
    padding: 0.8rem 0.85rem 0.8rem 0.5rem;
    font: inherit;
    font-size: 0.95rem;
    color: var(--text);
    border-radius: 12px;
}
.field__control--plain .field__input { padding-left: 0.85rem; }
.field__input:focus { outline: none; }
.field__hint {
    margin: 0;
    font-size: 0.82rem;
    color: var(--muted);
    line-height: 1.4;
}
.field__toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 0.75rem;
    border: 0;
    background: transparent;
    color: var(--muted);
    cursor: pointer;
    border-radius: 0 12px 12px 0;
    transition: color var(--t-fast) var(--ease-out), background var(--t-fast) var(--ease-out);
}
.field__toggle:hover { color: var(--accent); background: var(--accent-soft); }
.field__toggle svg { width: 1.15rem; height: 1.15rem; }

.btn--primary {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.45rem;
    width: 100%;
    padding: 0.88rem 1.15rem;
    margin-top: 0.25rem;
    border: 0;
    border-radius: 12px;
    font: inherit;
    font-weight: 600;
    font-size: 1rem;
    line-height: 1.15;
    cursor: pointer;
    color: #fff;
    background: linear-gradient(135deg, var(--accent), #15826f);
    box-shadow: 0 8px 26px -12px color-mix(in srgb, var(--accent) 65%, transparent);
    transition: transform var(--t-fast) var(--ease-out), box-shadow var(--t-fast) var(--ease-out), opacity var(--t-fast) var(--ease-out);
}
.btn--primary:hover:not(:disabled) {
    transform: translateY(-1px);
    box-shadow: 0 12px 32px -12px color-mix(in srgb, var(--accent) 75%, transparent);
}
.btn--primary:active:not(:disabled) { transform: translateY(0); }
.btn--primary:focus-visible {
    outline: 3px solid color-mix(in srgb, var(--accent) 38%, transparent);
    outline-offset: 3px;
}
.btn--primary:disabled { opacity: 0.65; cursor: not-allowed; }
.btn__spinner {
    position: absolute;
    width: 1.15rem;
    height: 1.15rem;
    border-radius: 50%;
    border: 2px solid rgba(255,255,255,0.35);
    border-top-color: #fff;
    opacity: 0;
    pointer-events: none;
    animation: auth-spin 0.75s linear infinite;
}
.btn--primary[aria-busy="true"] .btn__label { visibility: hidden; }
.btn--primary[aria-busy="true"] .btn__spinner { opacity: 1; }
@keyframes auth-spin { to { transform: rotate(360deg); } }

.auth-form__submit { margin-top: 0.35rem; }

.auth-card__foot {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.35rem 0.65rem;
    margin-top: 1.35rem;
    padding-top: 1.1rem;
    border-top: 1px solid var(--hairline);
    font-size: 0.92rem;
    color: var(--text-2);
}
.auth-card__foot a {
    font-weight: 600;
    color: var(--accent);
    text-decoration: none;
}
.auth-card__foot a:hover { text-decoration: underline; }
.auth-card__foot--solo {
    border-top: 0;
    margin-top: 0;
    padding-top: 0;
}

.auth-card__foot--stack {
    flex-direction: column;
    align-items: flex-start;
    gap: 0.45rem;
}
.auth-card__foot-sep {
    display: none;
    color: var(--muted);
    font-weight: 400;
}
@media (min-width: 520px) {
    .auth-card__foot--stack {
        flex-direction: row;
        flex-wrap: wrap;
        align-items: center;
        gap: 0.35rem 0.65rem;
    }
    .auth-card__foot--stack .auth-card__foot-sep {
        display: inline;
    }
}

.page-admin-login .auth-trust {
    max-width: 28rem;
}

.auth-trust {
    text-align: center;
    font-size: 0.82rem;
    color: var(--muted);
    line-height: 1.5;
    max-width: 26rem;
    margin: 1.5rem auto 0;
}

.auth-tip {
    display: flex;
    gap: 0.75rem;
    align-items: flex-start;
    padding: 0.9rem 1rem;
    margin-bottom: 1rem;
    background: var(--surface-2);
    border: 1px solid var(--hairline);
    border-radius: 12px;
    border-left: 3px solid var(--accent);
}
.auth-tip__ico {
    flex-shrink: 0;
    color: var(--accent);
    display: inline-flex;
}
.auth-tip__ico svg { width: 1.2rem; height: 1.2rem; }
.auth-tip__text {
    margin: 0;
    font-size: 0.88rem;
    color: var(--text-2);
    line-height: 1.5;
}
.auth-tip__text code {
    font-size: 0.82em;
    padding: 0.1rem 0.35rem;
    background: var(--surface);
    border-radius: 6px;
    border: 1px solid var(--hairline);
}

.register-role {
    border: 0;
    margin: 0;
    padding: 0;
}
.register-role__legend {
    font-size: 0.88rem;
    font-weight: 600;
    color: var(--text);
    margin-bottom: 0.55rem;
    padding: 0;
}
.register-role__grid {
    display: grid;
    gap: 0.65rem;
    grid-template-columns: 1fr;
}
@media (min-width: 520px) {
    .register-role__grid { grid-template-columns: 1fr 1fr; }
}

.register-role-card {
    display: block;
    cursor: pointer;
    margin: 0;
}
.register-role-card input {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}
.register-role-card__body {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    height: 100%;
    padding: 1rem 1rem 1.05rem;
    border: 2px solid var(--hairline);
    border-radius: 14px;
    background: var(--surface);
    transition: border-color var(--t-fast) var(--ease-out), box-shadow var(--t-fast) var(--ease-out), transform var(--t-fast) var(--ease-out);
}
.register-role-card:hover .register-role-card__body {
    border-color: color-mix(in srgb, var(--accent) 35%, var(--hairline));
}
.register-role-card:has(:checked) .register-role-card__body {
    border-color: var(--accent);
    box-shadow: 0 0 0 3px var(--accent-soft);
}
.register-role-card:focus-within .register-role-card__body {
    outline: 2px solid var(--accent);
    outline-offset: 2px;
}
.register-role-card__ico {
    color: var(--accent);
    display: inline-flex;
    margin-bottom: 0.15rem;
}
.register-role-card__ico svg { width: 1.35rem; height: 1.35rem; }
.register-role-card__title {
    font-weight: 700;
    font-size: 1rem;
    color: var(--text);
}
.register-role-card__desc {
    font-size: 0.82rem;
    color: var(--text-2);
    line-height: 1.45;
}

.piva-block { margin-top: 0.15rem; }

.auth-details {
    border: 1px dashed var(--hairline);
    border-radius: 12px;
    padding: 0.5rem 0.85rem 0.85rem;
    background: var(--surface-2);
}
.auth-details__summary {
    font-weight: 600;
    font-size: 0.88rem;
    color: var(--text);
    cursor: pointer;
    padding: 0.35rem 0;
}
.auth-details .field { margin-top: 0.65rem; }

.auth-checkbox {
    display: flex;
    gap: 0.55rem;
    align-items: flex-start;
    font-size: 0.88rem;
    line-height: 1.45;
    color: var(--text-2);
    cursor: pointer;
}
.auth-checkbox input {
    margin-top: 0.2rem;
    flex-shrink: 0;
    accent-color: var(--accent);
}
.auth-checkbox a { color: var(--accent); font-weight: 600; }

/* display:flex su .auth-checkbox vinceva sulla presentazione UA di [hidden] */
.auth-checkbox[hidden] {
    display: none !important;
}

.register-plan-box__intro--tight { margin-bottom: 0; }

/* Utility leggere per eliminare inline style residui */
.u-maxw-28 { max-width: 28rem; }
.u-maxw-32 { max-width: 32rem; }
.u-maxw-100 { max-width: 100%; }
.u-m-0 { margin: 0; }
.u-mt-075 { margin-top: 0.75rem; }
.u-mt-1 { margin-top: 1rem; }
.u-mt-15 { margin-top: 1.5rem; }
.u-mt-2 { margin-top: 2rem; }
.u-inline { display: inline; }
.u-row-inline {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.85rem;
}
.u-muted-small {
    font-size: 0.85rem;
    color: var(--muted);
}
.u-text-2 { color: var(--text-2); }
.u-accent-link-mini {
    font-size: 0.82rem;
    font-weight: 600;
    color: var(--accent);
    text-decoration: none;
    margin-top: 0.4rem;
}
.u-accent-link-mini:hover { text-decoration: underline; }
.u-price-strong {
    font-size: 1.25rem;
    font-weight: 700;
    color: var(--accent);
}
.se-badge-pro {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.4rem 0.75rem;
    font-size: 0.78rem;
}
.se-badge-pro svg {
    width: 0.95rem;
    height: 0.95rem;
}
.se-field--spaced-top,
.se-map-block--spaced { margin-top: 1.25rem; }
.se-label--tight { margin: 0; }
.se-map-hint--tight { margin: 0 0 0.75rem; }
.se-save-anchor { height: 4rem; }
.se-tip--compact {
    margin-top: 0;
    margin-bottom: 1.4rem;
}
.se-tip__text--compact {
    margin-top: 0.5rem;
    margin-bottom: 0;
}

/* Registro: piani nel pannello laterale — più respiro */
.auth-register__aside .register-plan-box {
    margin-top: 0;
}
.auth-register__aside .register-plan-columns {
    grid-template-columns: 1fr;
    gap: 1.15rem;
}
@media (min-width: 560px) {
    .auth-register__aside .register-plan-columns {
        grid-template-columns: 1fr 1fr;
    }
}

/* Vecchia sezione auth “stacked”: non usata da login/register nuovi, ma non rompe altre pagine */
.page-auth form.stacked {
    background: var(--surface);
    border: 1px solid var(--hairline);
    border-radius: 18px;
    padding: 1.75rem 1.5rem 1.5rem;
    box-shadow: var(--shadow-md);
}

/* ============================================================
   Mobile globale — respiro, notch, tabelle, touch (tutto il portale)
   ============================================================ */
@media (max-width: 720px) {
    html {
        overflow-x: hidden;
    }

    .container {
        width: 100%;
        max-width: 1100px;
        margin-left: auto;
        margin-right: auto;
        padding-left: max(1rem, env(safe-area-inset-left, 0px));
        padding-right: max(1rem, env(safe-area-inset-right, 0px));
        box-sizing: border-box;
    }

    .site-header {
        padding-top: env(safe-area-inset-top, 0px);
    }

    .main-content {
        padding-top: 1.35rem;
        padding-bottom: max(2.25rem, env(safe-area-inset-bottom, 0px));
    }

    .main-content--fluid {
        padding-left: max(0.75rem, env(safe-area-inset-left, 0px));
        padding-right: max(0.75rem, env(safe-area-inset-right, 0px));
        padding-bottom: max(0.5rem, env(safe-area-inset-bottom, 0px));
    }

    .site-footer .footer-grid,
    .site-footer .footer-bottom {
        padding-left: max(1rem, env(safe-area-inset-left, 0px));
        padding-right: max(1rem, env(safe-area-inset-right, 0px));
    }

    .site-footer {
        padding-bottom: max(0.5rem, env(safe-area-inset-bottom, 0px));
    }

    /* iOS: evita zoom su focus se font < 16px */
    input,
    select,
    textarea {
        font-size: 16px;
    }

    .btn {
        min-height: 2.75rem;
        padding-top: 0.55rem;
        padding-bottom: 0.55rem;
    }

    .table-wrap table {
        font-size: 0.82rem;
    }

    .table-wrap th,
    .table-wrap td {
        padding: 0.55rem 0.65rem;
    }

    /* Toolbar admin/host: pill bar orizzontale scrollabile */
    .se-toolbar {
        margin-left: 0;
        margin-right: 0;
    }

    .se-pillbar {
        max-width: 100%;
        flex-wrap: nowrap;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        overscroll-behavior-x: contain;
        scrollbar-width: none;
    }

    .se-pillbar::-webkit-scrollbar {
        display: none;
    }

    .se-pill {
        flex-shrink: 0;
    }

    /* Editor annuncio: card e griglia più compatte */
    .page-space-edit .se-card {
        padding: 1.1rem 1rem 1.2rem;
    }

    .page-space-edit .se-head {
        margin-top: 0.25rem;
        margin-bottom: 1.1rem;
    }

    .page-space-edit .se-grid {
        gap: 1rem;
    }

    /* Scheda spazio: barra CTA sopra home indicator iPhone */
    .sp-mobile-bar {
        padding-left: max(1rem, env(safe-area-inset-left, 0px));
        padding-right: max(1rem, env(safe-area-inset-right, 0px));
        padding-bottom: max(0.75rem, env(safe-area-inset-bottom, 0px));
    }

    /* Save bar editor: safe area bottom */
    .se-savebar {
        padding-left: max(1rem, env(safe-area-inset-left, 0px));
        padding-right: max(1rem, env(safe-area-inset-right, 0px));
        padding-bottom: max(0.75rem, env(safe-area-inset-bottom, 0px));
    }

    /* Menu mobile: respiro in basso con notch */
    .nav {
        padding-bottom: max(1.5rem, env(safe-area-inset-bottom, 0px));
    }

    .page-host .main-content,
    .page-pro .main-content,
    .page-admin .main-content {
        max-width: 100%;
    }
}

/* --- Popup programmabili (sito pubblico) -------------------------------- */
.site-popup[hidden] {
    display: none !important;
}

.site-popup:not([hidden]) {
    position: fixed;
    inset: 0;
    z-index: 10050;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1.25rem;
    box-sizing: border-box;
}

.site-popup:not([hidden]):not(.site-popup--open) .site-popup__backdrop,
.site-popup:not([hidden]):not(.site-popup--open) .site-popup__panel {
    pointer-events: none;
}

.site-popup--open .site-popup__backdrop,
.site-popup--open .site-popup__panel {
    pointer-events: auto;
}

.site-popup__backdrop {
    position: absolute;
    inset: 0;
    background: rgba(15, 14, 12, 0.52);
    backdrop-filter: blur(6px);
    opacity: 0;
    transition: opacity 0.38s cubic-bezier(0.22, 1, 0.36, 1);
}

.site-popup--open .site-popup__backdrop {
    opacity: 1;
}

.site-popup__panel {
    --site-popup-accent: color-mix(in srgb, var(--primary, #0e6b5c) 55%, transparent);
    position: relative;
    z-index: 1;
    width: 100%;
    max-width: 27rem;
    max-height: min(85vh, 34rem);
    overflow: auto;
    padding: 1.5rem 1.55rem 1.35rem;
    border-radius: 1.25rem;
    background:
        linear-gradient(165deg, color-mix(in srgb, var(--surface) 96%, var(--site-popup-accent)) 0%, var(--surface) 48%),
        var(--surface);
    color: var(--text);
    border: 1px solid color-mix(in srgb, var(--border) 85%, var(--site-popup-accent));
    box-shadow:
        0 0 0 1px rgba(255, 255, 255, 0.06) inset,
        0 32px 80px -28px rgba(0, 0, 0, 0.55),
        0 12px 40px -20px rgba(0, 0, 0, 0.28);
    opacity: 0;
    transform: scale(0.94) translateY(14px);
    transition:
        opacity 0.4s cubic-bezier(0.22, 1, 0.36, 1),
        transform 0.42s cubic-bezier(0.22, 1, 0.36, 1);
}

.site-popup__panel::before {
    content: '';
    position: absolute;
    left: 1.25rem;
    right: 1.25rem;
    top: 0;
    height: 3px;
    border-radius: 0 0 3px 3px;
    background: linear-gradient(90deg, transparent, var(--site-popup-accent), transparent);
    opacity: 0.9;
    pointer-events: none;
}

.site-popup--open .site-popup__panel {
    opacity: 1;
    transform: scale(1) translateY(0);
}

@media (prefers-reduced-motion: reduce) {
    .site-popup__backdrop,
    .site-popup__panel {
        transition-duration: 0.01ms !important;
    }
}

.site-popup__close {
    position: absolute;
    top: 0.65rem;
    right: 0.65rem;
    width: 2.25rem;
    height: 2.25rem;
    border: none;
    border-radius: var(--radius);
    background: rgba(0, 0, 0, 0.06);
    color: var(--text-2);
    font-size: 1.35rem;
    line-height: 1;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
}

.site-popup__close:hover {
    background: rgba(0, 0, 0, 0.1);
    color: var(--text);
}

.site-popup__title {
    margin: 0 2rem 0.75rem 0;
    font-size: 1.15rem;
    font-weight: 700;
    letter-spacing: -0.02em;
    line-height: 1.25;
    padding-right: 0.25rem;
}

.site-popup__body {
    margin: 0;
    font-size: 0.94rem;
    line-height: 1.6;
    color: var(--text-2);
}

.site-popup__body--rich h3,
.site-popup__body--rich h4 {
    margin: 0.85em 0 0.4em;
    font-size: 1.02rem;
    font-weight: 700;
    letter-spacing: -0.02em;
    color: var(--text);
    line-height: 1.3;
}

.site-popup__body--rich h4 {
    font-size: 0.98rem;
}

.site-popup__body--rich p {
    margin: 0 0 0.65em;
}

.site-popup__body--rich p:last-child {
    margin-bottom: 0;
}

.site-popup__body--rich ul,
.site-popup__body--rich ol {
    margin: 0.5em 0 0.65em;
    padding-left: 1.35em;
}

.site-popup__body--rich li {
    margin: 0.25em 0;
}

.site-popup__body--rich blockquote {
    margin: 0.65em 0;
    padding: 0.55rem 0.85rem;
    border-left: 3px solid var(--site-popup-accent, color-mix(in srgb, var(--primary, #0e6b5c) 45%, transparent));
    background: color-mix(in srgb, var(--surface) 88%, var(--text) 4%);
    border-radius: 0 var(--radius-sm, 6px) var(--radius-sm, 6px) 0;
    font-style: italic;
}

.site-popup__body--rich a {
    color: var(--primary, #0e6b5c);
    text-decoration: underline;
    text-underline-offset: 0.15em;
}

.site-popup__body--rich a:hover {
    text-decoration-thickness: 2px;
}

.site-popup__body br {
    display: block;
    content: '';
    margin-top: 0.35rem;
}

.site-popup__actions {
    margin: 1.1rem 0 0;
}

/* Editor corpo popup (admin) */
.admin-popup-editor {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    max-width: 44rem;
}

.admin-popup-editor__bar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.35rem;
    padding: 0.45rem 0.5rem;
    border-radius: var(--radius, 8px);
    background: color-mix(in srgb, var(--surface-2, #f4f4f2) 92%, var(--text) 3%);
    border: 1px solid var(--border);
}

.admin-popup-editor__btn {
    min-width: 2rem;
    padding: 0.28rem 0.5rem;
    font-size: 0.8rem;
}

.admin-popup-editor__sep {
    width: 1px;
    height: 1.25rem;
    background: var(--border);
    margin: 0 0.15rem;
}

.admin-popup-editor__textarea {
    font-family: ui-monospace, 'Cascadia Code', 'Segoe UI Mono', monospace;
    font-size: 0.85rem;
    line-height: 1.45;
}