:root {
    --page: #f6efe4;
    --paper: #fffaf3;
    --white: #ffffff;
    --ink: #33241a;
    --muted: #8a7566;
    --soft: #f3e2cd;
    --line: #ead8c3;
    --orange: #f28a2e;
    --orange-dark: #d96f18;
    --red: #d83a21;
    --green: #4d8b57;
    --shadow: 0 24px 70px rgba(70, 38, 16, .13);
    --radius-xl: 34px;
    --radius-lg: 24px;
    --radius-md: 16px;
}

* {
    box-sizing: border-box;
}

body {
    margin: 0;
    background:
        radial-gradient(circle at top left, rgba(242, 138, 46, .14), transparent 32%),
        radial-gradient(circle at top right, rgba(216, 58, 33, .10), transparent 30%),
        var(--page);
    color: var(--ink);
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

a {
    color: inherit;
    text-decoration: none;
}

button,
input,
select {
    font: inherit;
}

.page-shell {
    width: min(1240px, calc(100% - 28px));
    margin: 18px auto;
    background: var(--paper);
    border: 1px solid rgba(234, 216, 195, .85);
    border-radius: 38px;
    box-shadow: var(--shadow);
    overflow: hidden;
}

.site-header {
    min-height: 82px;
    padding: 18px 28px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 22px;
    background: rgba(255, 250, 243, .92);
    border-bottom: 1px solid var(--line);
}

.brand {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-shrink: 0;
}

.brand-mark {
    width: 46px;
    height: 46px;
    border-radius: 17px;
    display: grid;
    place-items: center;
    background: linear-gradient(135deg, var(--orange), var(--red));
    color: #fff;
    font-weight: 900;
    letter-spacing: -.08em;
    box-shadow: 0 12px 25px rgba(216, 58, 33, .24);
}

.brand-mark.small {
    width: 36px;
    height: 36px;
    border-radius: 13px;
    font-size: .85rem;
}

.brand-name,
.footer-brand strong {
    font-size: 1.45rem;
    font-weight: 900;
    letter-spacing: -.06em;
}

.brand-name span,
.footer-brand span {
    color: var(--orange);
}

.main-nav {
    display: flex;
    gap: 22px;
    color: #7b6657;
    font-weight: 700;
    font-size: .95rem;
}

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

.header-actions {
    display: flex;
    gap: 10px;
}

.icon-button {
    width: 42px;
    height: 42px;
    border-radius: 999px;
    border: 1px solid var(--line);
    background: #fff;
    display: grid;
    place-items: center;
    color: var(--ink);
    font-weight: 900;
}

.hero {
    padding: 48px 38px 34px;
}

.hero-content {
    min-height: 540px;
    border-radius: 34px;
    background:
        radial-gradient(circle at 78% 20%, rgba(255, 194, 97, .55), transparent 23%),
        linear-gradient(135deg, #fff2df 0%, #ffe7ca 55%, #fff9ef 100%);
    display: grid;
    grid-template-columns: 1.05fr .95fr;
    gap: 26px;
    padding: 54px;
    position: relative;
    overflow: hidden;
}

.hero-copy {
    position: relative;
    z-index: 2;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.hero h1 {
    font-size: clamp(3.1rem, 6.8vw, 6.7rem);
    line-height: .91;
    letter-spacing: -.085em;
    margin: 0;
    max-width: 720px;
}

.hero h1 span {
    color: var(--orange-dark);
}

.hero p {
    margin: 24px 0 0;
    color: #6f5848;
    font-size: 1.14rem;
    line-height: 1.75;
    max-width: 650px;
}

.search-panel {
    margin-top: 30px;
    background: #fff;
    border: 1px solid rgba(234, 216, 195, .9);
    border-radius: 24px;
    padding: 10px;
    display: grid;
    grid-template-columns: 1.4fr .8fr .8fr auto;
    gap: 8px;
    box-shadow: 0 16px 40px rgba(70, 38, 16, .12);
}

.search-field {
    height: 56px;
    border-radius: 18px;
    background: #fff8ef;
    border: 1px solid #f0dfcc;
    display: flex;
    align-items: center;
    gap: 9px;
    padding: 0 14px;
    color: var(--muted);
}

.search-field input,
.search-field select {
    width: 100%;
    border: 0;
    outline: 0;
    background: transparent;
    color: var(--ink);
    min-width: 0;
}

.search-panel button,
.newsletter-panel button {
    border: 0;
    border-radius: 18px;
    background: linear-gradient(135deg, var(--orange), var(--red));
    color: #fff;
    font-weight: 900;
    padding: 0 25px;
    cursor: pointer;
    box-shadow: 0 10px 22px rgba(216, 58, 33, .22);
}

.quick-links {
    margin-top: 22px;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
}

.quick-links a {
    background: rgba(255, 255, 255, .75);
    border: 1px solid rgba(234, 216, 195, .85);
    border-radius: 18px;
    padding: 13px;
    display: flex;
    align-items: center;
    gap: 10px;
}

.quick-links strong {
    width: 34px;
    height: 34px;
    border-radius: 12px;
    background: #fff0df;
    display: grid;
    place-items: center;
    color: var(--orange-dark);
}

.quick-links span {
    display: flex;
    flex-direction: column;
    font-weight: 900;
    font-size: .88rem;
}

.quick-links small {
    color: var(--muted);
    font-weight: 700;
    margin-top: 2px;
}

.hero-illustration {
    position: relative;
    min-height: 450px;
    border-radius: 30px;
    overflow: hidden;
    background:
        linear-gradient(180deg, #fdd99c 0%, #f7b968 42%, #b65a35 100%);
    box-shadow: inset 0 0 0 1px rgba(255,255,255,.35);
}

.sun {
    position: absolute;
    width: 132px;
    height: 132px;
    border-radius: 50%;
    right: 56px;
    top: 46px;
    background: #fff4b5;
    box-shadow: 0 0 60px rgba(255, 235, 150, .85);
}

.hills {
    position: absolute;
    left: -5%;
    right: -5%;
    bottom: 74px;
    height: 210px;
    background:
        radial-gradient(ellipse at 25% 100%, #6e8b52 0 44%, transparent 45%),
        radial-gradient(ellipse at 70% 100%, #557243 0 48%, transparent 49%);
}

.village {
    position: absolute;
    left: 10%;
    right: 10%;
    bottom: 48px;
    height: 190px;
}

.church {
    position: absolute;
    left: 50%;
    bottom: 25px;
    width: 86px;
    height: 150px;
    transform: translateX(-50%);
    background: #fff0d8;
    border-radius: 16px 16px 8px 8px;
    box-shadow: 0 15px 0 #d87d42;
}

.church:before {
    content: "";
    position: absolute;
    left: 22px;
    top: -44px;
    border-left: 21px solid transparent;
    border-right: 21px solid transparent;
    border-bottom: 48px solid #b63c2c;
}

.church:after {
    content: "";
    position: absolute;
    left: 31px;
    top: 54px;
    width: 24px;
    height: 46px;
    border-radius: 999px 999px 0 0;
    background: #6f3f2b;
}

.stands:before,
.stands:after {
    content: "";
    position: absolute;
    bottom: 18px;
    width: 150px;
    height: 82px;
    border-radius: 18px 18px 8px 8px;
    background: #fff7e9;
    box-shadow: 0 -22px 0 #d8462c inset;
}

.stands:before {
    left: 10px;
}

.stands:after {
    right: 10px;
}

.lights {
    position: absolute;
    left: 0;
    right: 0;
    top: 34px;
    height: 22px;
    border-top: 3px solid rgba(80, 39, 24, .45);
}

.lights:after {
    content: "● ● ● ● ● ● ●";
    position: absolute;
    left: 32px;
    right: 32px;
    top: -11px;
    color: #fff08b;
    letter-spacing: 19px;
    font-size: 17px;
    text-shadow: 0 0 9px rgba(255,255,180,.9);
}

.people-card {
    position: absolute;
    left: 26px;
    bottom: 24px;
    background: rgba(255,255,255,.88);
    border: 1px solid rgba(255,255,255,.7);
    border-radius: 20px;
    padding: 15px 18px;
    box-shadow: 0 16px 35px rgba(60, 30, 14, .18);
}

.people-card strong {
    display: block;
    font-size: 1.05rem;
}

.people-card span {
    display: block;
    color: var(--muted);
    font-weight: 700;
    margin-top: 2px;
}

.featured-section,
.newsletter-panel,
.benefits {
    padding: 36px 38px;
}

.section-title-row {
    display: flex;
    justify-content: space-between;
    align-items: end;
    gap: 20px;
    margin-bottom: 22px;
}

.section-title-row h2,
.newsletter-panel h2 {
    font-size: clamp(2rem, 3.8vw, 3.4rem);
    margin: 0;
    letter-spacing: -.07em;
}

.section-title-row a {
    color: var(--orange-dark);
    font-weight: 900;
}

.featured-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 22px;
}

.featured-card {
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 28px;
    overflow: hidden;
    box-shadow: 0 14px 35px rgba(70, 38, 16, .10);
}

.card-image {
    height: 210px;
    position: relative;
    display: block;
    background: #efc27f;
    overflow: hidden;
}

.food-pattern {
    position: absolute;
    inset: 0;
    display: grid;
    place-items: center;
    background:
        radial-gradient(circle at 25% 25%, rgba(255,255,255,.45), transparent 18%),
        radial-gradient(circle at 75% 30%, rgba(216,58,33,.25), transparent 20%),
        linear-gradient(135deg, #f6d39b, #d36e36);
}

.food-pattern span {
    font-size: 5rem;
    filter: drop-shadow(0 14px 20px rgba(60,30,14,.25));
}

.status-badge,
.rating-badge {
    position: absolute;
    top: 14px;
    border-radius: 999px;
    padding: 8px 11px;
    font-weight: 900;
    font-size: .78rem;
}

.status-badge {
    left: 14px;
    background: #ffefe1;
    color: var(--orange-dark);
}

.rating-badge {
    right: 14px;
    background: #fff;
    color: #ad6820;
}

.card-body {
    padding: 20px;
}

.card-body h3 {
    margin: 0 0 13px;
    font-size: 1.35rem;
    letter-spacing: -.045em;
}

.meta-line {
    margin: 8px 0;
    color: var(--muted);
    font-weight: 700;
    font-size: .94rem;
}

.newsletter-panel {
    margin: 36px 38px;
    border-radius: 34px;
    background: linear-gradient(135deg, #e55e2c, #d23b22);
    color: #fff;
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 28px;
    align-items: center;
}

.newsletter-panel p {
    margin: 10px 0 0;
    color: rgba(255,255,255,.82);
    line-height: 1.6;
}

.newsletter-panel form {
    display: flex;
    gap: 10px;
    background: rgba(255,255,255,.15);
    padding: 10px;
    border-radius: 20px;
}

.newsletter-panel input {
    width: min(320px, 45vw);
    border: 0;
    outline: 0;
    border-radius: 14px;
    padding: 14px 16px;
}

.newsletter-panel button {
    background: #ffb24a;
    color: #4a2617;
    box-shadow: none;
}

.benefits {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
    padding-bottom: 54px;
}

.benefit {
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 24px;
    padding: 22px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.benefit span {
    font-size: 2rem;
}

.benefit strong {
    font-size: 1.05rem;
}

.benefit small {
    color: var(--muted);
    font-weight: 700;
}

.empty-state {
    grid-column: 1 / -1;
    background: #fff;
    border: 1px dashed var(--line);
    border-radius: 24px;
    padding: 28px;
    color: var(--muted);
}

.site-footer {
    padding: 34px 38px;
    background: #352318;
    color: rgba(255,255,255,.76);
}

.footer-brand {
    display: flex;
    align-items: center;
    gap: 12px;
    color: #fff;
    margin-bottom: 26px;
}

.footer-grid {
    display: grid;
    grid-template-columns: 1.4fr repeat(4, 1fr);
    gap: 24px;
    border-top: 1px solid rgba(255,255,255,.12);
    padding-top: 24px;
}

.footer-grid h4 {
    margin: 0 0 12px;
    color: #fff;
}

.footer-grid a {
    display: block;
    margin: 9px 0;
    color: rgba(255,255,255,.68);
}

.footer-grid p {
    margin: 0;
    line-height: 1.65;
}

.copyright {
    margin: 28px 0 0;
    padding-top: 22px;
    border-top: 1px solid rgba(255,255,255,.12);
    color: rgba(255,255,255,.52);
}

/* Detail page compatibility */
.detail-hero,
.section {
    padding: 48px 38px;
}

.detail-grid {
    display: grid;
    grid-template-columns: 1fr 360px;
    gap: 26px;
}

.info-panel,
.event-card,
.edition-card {
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 28px;
    padding: 24px;
}

.detail-actions,
.event-actions,
.edition-links {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 22px;
}

.btn-primary,
.btn-secondary {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 15px;
    padding: 12px 16px;
    font-weight: 900;
}

.btn-primary {
    background: linear-gradient(135deg, var(--orange), var(--red));
    color: #fff;
}

.btn-secondary {
    background: #fff1df;
    color: var(--orange-dark);
    border: 1px solid #f1cfad;
}

.place,
.description {
    color: var(--muted);
    line-height: 1.65;
}

.editions-list {
    display: grid;
    gap: 16px;
}

@media (max-width: 1050px) {
    .main-nav {
        display: none;
    }

    .hero-content {
        grid-template-columns: 1fr;
    }

    .hero-illustration {
        min-height: 360px;
    }

    .search-panel,
    .newsletter-panel,
    .footer-grid,
    .benefits {
        grid-template-columns: 1fr;
    }

    .quick-links,
    .featured-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .detail-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 650px) {
    .page-shell {
        width: 100%;
        margin: 0;
        border-radius: 0;
        border: 0;
    }

    .site-header {
        padding: 16px;
    }

    .hero,
    .featured-section,
    .newsletter-panel,
    .benefits,
    .detail-hero,
    .section {
        padding-left: 18px;
        padding-right: 18px;
    }

    .hero-content {
        padding: 28px 20px;
        min-height: unset;
    }

    .hero h1 {
        font-size: 3.1rem;
    }

    .search-panel,
    .quick-links,
    .featured-grid {
        grid-template-columns: 1fr;
    }

    .newsletter-panel {
        margin-left: 18px;
        margin-right: 18px;
    }

    .newsletter-panel form {
        flex-direction: column;
    }

    .newsletter-panel input {
        width: 100%;
    }

    .brand-name {
        font-size: 1.2rem;
    }
}

/* Ritocchi homepage SagraRadar */
.hero-content {
    min-height: 500px;
    padding: 44px 48px;
}

.hero h1 {
    font-size: clamp(2.8rem, 5.4vw, 5.2rem);
    line-height: .95;
    max-width: 620px;
}

.search-panel {
    grid-template-columns: minmax(260px, 1.4fr) minmax(130px, .65fr) minmax(145px, .7fr) auto;
}

.search-field {
    overflow: hidden;
}

.search-field input,
.search-field select {
    text-overflow: ellipsis;
}

.quick-links a {
    min-height: 82px;
}

.hero-illustration {
    min-height: 430px;
}

@media (max-width: 1050px) {
    .hero h1 {
        font-size: clamp(2.7rem, 8vw, 4.4rem);
    }

    .search-panel {
        grid-template-columns: 1fr;
    }
}

/* Pagina Eventi */
.events-page {
    padding: 48px 38px 64px;
}

.events-head {
    border-radius: 34px;
    background:
        radial-gradient(circle at 80% 20%, rgba(242, 138, 46, .22), transparent 24%),
        linear-gradient(135deg, #fff4e4, #fffaf3);
    border: 1px solid var(--line);
    padding: 42px;
    display: grid;
    grid-template-columns: 1fr minmax(320px, 470px);
    gap: 28px;
    align-items: end;
}

.page-kicker {
    margin: 0 0 10px;
    color: var(--orange-dark);
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: .12em;
    font-size: .78rem;
}

.events-head h1 {
    margin: 0;
    font-size: clamp(2.4rem, 5vw, 4.7rem);
    letter-spacing: -.075em;
    line-height: .94;
}

.events-head p {
    margin: 18px 0 0;
    color: var(--muted);
    max-width: 660px;
    line-height: 1.7;
    font-weight: 650;
}

.events-search {
    display: flex;
    gap: 10px;
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 24px;
    padding: 10px;
    box-shadow: 0 15px 34px rgba(70, 38, 16, .10);
}

.events-search .search-field {
    flex: 1;
}

.events-search button {
    border: 0;
    border-radius: 18px;
    padding: 0 22px;
    background: linear-gradient(135deg, var(--orange), var(--red));
    color: #fff;
    font-weight: 900;
    cursor: pointer;
}

.events-layout {
    margin-top: 28px;
    display: grid;
    grid-template-columns: 280px 1fr;
    gap: 24px;
    align-items: start;
}

.filters-panel {
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 28px;
    padding: 24px;
    position: sticky;
    top: 18px;
    box-shadow: 0 12px 30px rgba(70, 38, 16, .08);
}

.filters-panel h2 {
    margin: 0 0 18px;
    letter-spacing: -.045em;
}

.filter-group {
    display: grid;
    gap: 8px;
    margin-bottom: 18px;
}

.filter-group label {
    color: var(--muted);
    font-weight: 900;
    font-size: .84rem;
}

.filter-group select {
    height: 48px;
    border-radius: 16px;
    border: 1px solid var(--line);
    background: #fff8ef;
    padding: 0 12px;
    outline: 0;
    color: var(--ink);
    font-weight: 700;
}

.events-results {
    min-width: 0;
}

.results-top {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 18px;
    gap: 16px;
}

.results-top h2 {
    margin: 0;
    font-size: 2rem;
    letter-spacing: -.06em;
}

.results-top span {
    color: var(--muted);
    font-weight: 900;
}

.event-list {
    display: grid;
    gap: 18px;
}

.event-row {
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 28px;
    padding: 14px;
    display: grid;
    grid-template-columns: 230px 1fr;
    gap: 20px;
    box-shadow: 0 12px 32px rgba(70, 38, 16, .08);
}

.event-row-image {
    border-radius: 22px;
    min-height: 190px;
    background:
        radial-gradient(circle at 30% 25%, rgba(255,255,255,.45), transparent 20%),
        linear-gradient(135deg, #f4c27c, #d76832);
    display: grid;
    place-items: center;
    overflow: hidden;
}

.event-row-image span {
    font-size: 4.5rem;
    filter: drop-shadow(0 14px 20px rgba(60,30,14,.25));
}

.event-row-body {
    padding: 8px 8px 8px 0;
}

.event-row-meta {
    display: flex;
    justify-content: space-between;
    gap: 14px;
    align-items: center;
    margin-bottom: 10px;
}

.event-row h3 {
    margin: 0;
    font-size: 1.65rem;
    letter-spacing: -.055em;
}

.event-row-description {
    color: var(--muted);
    line-height: 1.65;
    margin: 12px 0 0;
}

.event-row-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 18px;
}

@media (max-width: 980px) {
    .events-head,
    .events-layout {
        grid-template-columns: 1fr;
    }

    .filters-panel {
        position: static;
    }

    .event-row {
        grid-template-columns: 1fr;
    }

    .event-row-body {
        padding: 4px;
    }
}

@media (max-width: 650px) {
    .events-page {
        padding: 28px 18px 44px;
    }

    .events-head {
        padding: 26px 20px;
    }

    .events-search {
        flex-direction: column;
    }

    .events-search button {
        min-height: 52px;
    }

    .event-row-meta {
        align-items: flex-start;
        flex-direction: column;
    }
}

/* Layout più ampio su desktop */
.page-shell {
    width: min(1480px, calc(100% - 48px));
}

@media (min-width: 1500px) {
    .page-shell {
        width: min(1540px, calc(100% - 64px));
    }

    .hero-content {
        grid-template-columns: 1.12fr .88fr;
    }
}

@media (max-width: 900px) {
    .page-shell {
        width: 100%;
    }
}

/* Pagina dettaglio sagra */
.sagra-detail-page {
    padding: 34px 38px 64px;
}

.back-link {
    margin-bottom: 18px;
}

.back-link a {
    color: var(--orange-dark);
    font-weight: 900;
}

.sagra-hero-card {
    position: relative;
    border-radius: 34px;
    overflow: hidden;
    background: #fff;
    border: 1px solid var(--line);
    box-shadow: 0 18px 46px rgba(70, 38, 16, .12);
}

.sagra-hero-image {
    height: 390px;
    background: linear-gradient(135deg, #f4c27c, #d76832);
}

.sagra-hero-placeholder {
    height: 100%;
    display: grid;
    place-items: center;
    background:
        radial-gradient(circle at 25% 25%, rgba(255,255,255,.42), transparent 18%),
        radial-gradient(circle at 70% 35%, rgba(255,255,255,.22), transparent 16%),
        linear-gradient(135deg, #f9d79d, #dc6a35);
}

.sagra-hero-placeholder span {
    font-size: 8rem;
    filter: drop-shadow(0 18px 30px rgba(60,30,14,.30));
}

.sagra-floating-info {
    margin: -88px 28px 28px;
    position: relative;
    z-index: 2;
    background: rgba(255,255,255,.96);
    border: 1px solid rgba(234,216,195,.92);
    border-radius: 30px;
    padding: 28px;
    box-shadow: 0 18px 44px rgba(70, 38, 16, .16);
}

.title-row {
    display: flex;
    justify-content: space-between;
    gap: 18px;
    align-items: flex-start;
}

.title-row h1 {
    margin: 0;
    font-size: clamp(2.3rem, 5vw, 4.6rem);
    line-height: .95;
    letter-spacing: -.075em;
}

.rating-box {
    min-width: 86px;
    height: 58px;
    border-radius: 18px;
    background: #fff6df;
    border: 1px solid #f0d8ab;
    color: #a86b11;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    font-weight: 900;
}

.rating-box span {
    color: #f4a11f;
}

.detail-meta {
    color: var(--muted);
    font-weight: 750;
    margin: 14px 0 0;
}

.green-pill {
    display: inline-flex;
    margin-left: 10px;
    padding: 6px 10px;
    border-radius: 999px;
    background: #e9f7e8;
    color: #357b42;
    font-weight: 900;
    font-size: .8rem;
}

.quick-stats {
    margin-top: 22px;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
}

.quick-stats div {
    background: #fff8ef;
    border: 1px solid var(--line);
    border-radius: 18px;
    padding: 14px;
}

.quick-stats strong {
    display: block;
    font-size: 1rem;
}

.quick-stats small {
    display: block;
    margin-top: 4px;
    color: var(--muted);
    font-weight: 750;
}

.detail-main-actions {
    margin-top: 22px;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.detail-tabs {
    margin-top: 24px;
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 22px;
    padding: 8px;
    display: flex;
    gap: 6px;
    overflow-x: auto;
    box-shadow: 0 10px 28px rgba(70, 38, 16, .08);
}

.detail-tabs a {
    white-space: nowrap;
    padding: 12px 16px;
    border-radius: 16px;
    color: var(--muted);
    font-weight: 900;
}

.detail-tabs a.active,
.detail-tabs a:hover {
    background: #fff0df;
    color: var(--orange-dark);
}

.detail-content-grid {
    margin-top: 24px;
    display: grid;
    grid-template-columns: 1fr 360px;
    gap: 24px;
    align-items: start;
}

.detail-main-column,
.detail-side-column {
    display: grid;
    gap: 18px;
}

.content-block,
.side-card {
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 28px;
    padding: 26px;
    box-shadow: 0 12px 32px rgba(70, 38, 16, .08);
}

.content-block h2,
.side-card h2 {
    margin: 0 0 16px;
    font-size: 1.7rem;
    letter-spacing: -.055em;
}

.content-block p,
.side-card p {
    color: var(--muted);
    line-height: 1.72;
}

.tag-row {
    margin-top: 18px;
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
}

.tag-row span {
    background: #fff0df;
    color: var(--orange-dark);
    border: 1px solid #f1cfad;
    border-radius: 999px;
    padding: 8px 12px;
    font-weight: 900;
    font-size: .84rem;
}

.info-table {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}

.info-table > div {
    background: #fff8ef;
    border: 1px solid var(--line);
    border-radius: 20px;
    padding: 16px;
}

.info-table span {
    font-size: 1.5rem;
}

.info-table strong {
    display: block;
    margin-top: 8px;
}

.info-table p {
    margin: 6px 0 0;
}

.text-panel {
    margin-top: 18px;
    background: #fff8ef;
    border: 1px solid var(--line);
    border-radius: 22px;
    padding: 18px;
}

.text-panel h3 {
    margin: 0 0 8px;
    letter-spacing: -.04em;
}

.mini-map {
    height: 190px;
    border-radius: 22px;
    background:
        linear-gradient(90deg, rgba(255,255,255,.35) 1px, transparent 1px),
        linear-gradient(0deg, rgba(255,255,255,.35) 1px, transparent 1px),
        linear-gradient(135deg, #f2c47e, #d66834);
    background-size: 28px 28px, 28px 28px, auto;
    display: grid;
    place-items: center;
    text-align: center;
    color: #fff;
    margin-bottom: 16px;
    overflow: hidden;
}

.mini-map span {
    font-size: 3rem;
    display: block;
    filter: drop-shadow(0 10px 20px rgba(60,30,14,.3));
}

.mini-map strong {
    display: block;
    margin-top: 8px;
    text-shadow: 0 2px 8px rgba(60,30,14,.28);
}

.organizer-box {
    display: flex;
    gap: 12px;
    align-items: center;
}

.organizer-avatar {
    width: 52px;
    height: 52px;
    border-radius: 18px;
    background: #fff0df;
    display: grid;
    place-items: center;
    font-size: 1.5rem;
}

.organizer-box small {
    display: block;
    color: var(--muted);
    margin-top: 3px;
    font-weight: 750;
}

.contact-list {
    margin-top: 16px;
    border-top: 1px solid var(--line);
    padding-top: 12px;
}

.share-row {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.share-row a {
    background: #fff0df;
    color: var(--orange-dark);
    border: 1px solid #f1cfad;
    border-radius: 999px;
    padding: 9px 12px;
    font-weight: 900;
    font-size: .86rem;
}

.warning-card {
    background: #fff8ef;
}

@media (max-width: 980px) {
    .detail-content-grid {
        grid-template-columns: 1fr;
    }

    .sagra-hero-image {
        height: 320px;
    }

    .quick-stats {
        grid-template-columns: 1fr;
    }

    .info-table {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 650px) {
    .sagra-detail-page {
        padding: 24px 18px 44px;
    }

    .sagra-floating-info {
        margin: -56px 14px 18px;
        padding: 20px;
    }

    .title-row {
        flex-direction: column;
    }

    .sagra-hero-image {
        height: 260px;
    }

    .sagra-hero-placeholder span {
        font-size: 5rem;
    }
}

.real-map {
    padding: 0;
    background: #fff;
}

.real-map iframe {
    width: 100%;
    height: 100%;
    border: 0;
    display: block;
    border-radius: 22px;
}

.edition-subtitle {
    margin: 10px 0 0;
    color: var(--orange-dark);
    font-weight: 900;
    font-size: 1.05rem;
}

.reviews-intro {
    margin-top: 0;
}

.reviews-list {
    display: grid;
    gap: 14px;
    margin-top: 18px;
}

.review-card {
    background: #fff8ef;
    border: 1px solid var(--line);
    border-radius: 22px;
    padding: 18px;
}

.review-head {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    align-items: flex-start;
    margin-bottom: 10px;
}

.review-head strong {
    display: block;
    font-size: 1.05rem;
}

.review-head small {
    display: block;
    margin-top: 4px;
    color: var(--muted);
    font-weight: 800;
}

.review-rating {
    flex-shrink: 0;
    border-radius: 999px;
    padding: 7px 11px;
    background: #fff;
    border: 1px solid #f0d8ab;
    color: #a86b11;
    font-weight: 900;
}

/* Form pubblici */
.form-page,
.thanks-page {
    padding: 48px 38px 64px;
}

.form-hero {
    border-radius: 34px;
    background:
        radial-gradient(circle at 80% 20%, rgba(242, 138, 46, .22), transparent 24%),
        linear-gradient(135deg, #fff4e4, #fffaf3);
    border: 1px solid var(--line);
    padding: 42px;
    margin-bottom: 24px;
}

.form-hero h1,
.thanks-card h1 {
    margin: 0;
    font-size: clamp(2.6rem, 5vw, 4.8rem);
    letter-spacing: -.075em;
    line-height: .94;
}

.form-hero p,
.thanks-card p {
    margin: 18px 0 0;
    color: var(--muted);
    max-width: 760px;
    line-height: 1.7;
    font-weight: 650;
}

.public-form {
    display: grid;
    gap: 20px;
}

.form-section {
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 28px;
    padding: 26px;
    box-shadow: 0 12px 32px rgba(70, 38, 16, .08);
}

.form-section h2 {
    margin: 0 0 20px;
    font-size: 1.8rem;
    letter-spacing: -.055em;
}

.form-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
}

.form-field {
    display: grid;
    gap: 8px;
}

.form-field.full {
    grid-column: 1 / -1;
}

.form-field label {
    color: var(--muted);
    font-weight: 900;
    font-size: .88rem;
}

.form-control {
    width: 100%;
    min-height: 50px;
    border-radius: 16px;
    border: 1px solid var(--line);
    background: #fff8ef;
    padding: 12px 14px;
    outline: 0;
    color: var(--ink);
    font-weight: 700;
}

textarea.form-control {
    resize: vertical;
    line-height: 1.5;
}

.form-control:focus {
    border-color: rgba(242, 138, 46, .75);
    box-shadow: 0 0 0 4px rgba(242, 138, 46, .12);
}

.errorlist {
    margin: 0;
    padding-left: 18px;
    color: var(--red);
    font-weight: 800;
}

.form-actions {
    background: #fff8ef;
    border: 1px solid var(--line);
    border-radius: 28px;
    padding: 24px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
}

.form-actions button {
    border: 0;
    border-radius: 18px;
    background: linear-gradient(135deg, var(--orange), var(--red));
    color: #fff;
    font-weight: 900;
    padding: 15px 22px;
    cursor: pointer;
}

.form-actions p {
    margin: 0;
    color: var(--muted);
    font-weight: 700;
    line-height: 1.5;
}

.thanks-page {
    min-height: 560px;
    display: grid;
    place-items: center;
}

.thanks-card {
    width: min(720px, 100%);
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 34px;
    padding: 42px;
    box-shadow: 0 18px 46px rgba(70, 38, 16, .12);
    text-align: center;
}

.thanks-icon {
    width: 76px;
    height: 76px;
    margin: 0 auto 18px;
    border-radius: 26px;
    display: grid;
    place-items: center;
    background: #e9f7e8;
    color: #357b42;
    font-size: 2.4rem;
    font-weight: 900;
}

.thanks-actions {
    margin-top: 26px;
    display: flex;
    justify-content: center;
    gap: 12px;
    flex-wrap: wrap;
}

@media (max-width: 760px) {
    .form-page,
    .thanks-page {
        padding: 28px 18px 44px;
    }

    .form-hero,
    .form-section,
    .form-actions,
    .thanks-card {
        padding: 22px;
    }

    .form-grid {
        grid-template-columns: 1fr;
    }

    .form-actions {
        align-items: stretch;
        flex-direction: column;
    }

    .form-actions button {
        width: 100%;
    }
}

/* Account: login, registrazione, dashboard */
.auth-page,
.dashboard-page {
    padding: 48px 38px 64px;
}

.auth-card {
    display: grid;
    grid-template-columns: 1fr 440px;
    gap: 28px;
    align-items: stretch;
}

.auth-copy {
    border-radius: 34px;
    background:
        radial-gradient(circle at 80% 20%, rgba(242, 138, 46, .22), transparent 24%),
        linear-gradient(135deg, #fff4e4, #fffaf3);
    border: 1px solid var(--line);
    padding: 42px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.auth-copy h1 {
    margin: 0;
    font-size: clamp(2.8rem, 5vw, 5rem);
    letter-spacing: -.08em;
    line-height: .93;
}

.auth-copy p {
    margin: 18px 0 0;
    color: var(--muted);
    line-height: 1.72;
    font-weight: 650;
    max-width: 700px;
}

.auth-form {
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 34px;
    padding: 30px;
    box-shadow: 0 18px 46px rgba(70, 38, 16, .10);
    display: grid;
    gap: 16px;
}

.auth-form button {
    border: 0;
    border-radius: 18px;
    background: linear-gradient(135deg, var(--orange), var(--red));
    color: #fff;
    font-weight: 900;
    padding: 15px 22px;
    cursor: pointer;
    margin-top: 4px;
}

.check-row {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    color: var(--muted);
    font-weight: 800;
    line-height: 1.4;
}

.checkbox-input {
    margin-top: 4px;
}

.auth-switch {
    margin: 4px 0 0;
    color: var(--muted);
    font-weight: 750;
    text-align: center;
}

.auth-switch a {
    color: var(--orange-dark);
    font-weight: 900;
}

.form-errors {
    background: #fff0ef;
    color: var(--red);
    border: 1px solid #f1b9b0;
    border-radius: 16px;
    padding: 12px 14px;
    font-weight: 800;
}

.dashboard-hero {
    border-radius: 34px;
    background:
        radial-gradient(circle at 80% 20%, rgba(242, 138, 46, .22), transparent 24%),
        linear-gradient(135deg, #fff4e4, #fffaf3);
    border: 1px solid var(--line);
    padding: 42px;
    display: grid;
    grid-template-columns: 1fr 320px;
    gap: 28px;
    align-items: center;
}

.dashboard-hero h1 {
    margin: 0;
    font-size: clamp(2.5rem, 5vw, 4.8rem);
    letter-spacing: -.075em;
    line-height: .94;
}

.dashboard-hero p {
    margin: 18px 0 0;
    color: var(--muted);
    max-width: 760px;
    line-height: 1.7;
    font-weight: 650;
}

.dashboard-user-card {
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 28px;
    padding: 24px;
    text-align: center;
    box-shadow: 0 12px 30px rgba(70, 38, 16, .08);
}

.dashboard-avatar {
    width: 76px;
    height: 76px;
    margin: 0 auto 14px;
    border-radius: 26px;
    display: grid;
    place-items: center;
    background: linear-gradient(135deg, var(--orange), var(--red));
    color: #fff;
    font-size: 2rem;
    font-weight: 900;
}

.dashboard-user-card strong,
.dashboard-user-card small {
    display: block;
}

.dashboard-user-card small {
    margin-top: 5px;
    color: var(--muted);
    font-weight: 750;
}

.dashboard-grid {
    margin-top: 24px;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
}

.dashboard-tile {
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 28px;
    padding: 24px;
    display: grid;
    gap: 8px;
    box-shadow: 0 12px 32px rgba(70, 38, 16, .08);
}

.dashboard-tile:hover {
    transform: translateY(-2px);
    box-shadow: 0 18px 42px rgba(70, 38, 16, .12);
}

.dashboard-tile span {
    font-size: 2rem;
}

.dashboard-tile strong {
    font-size: 1.1rem;
}

.dashboard-tile small {
    color: var(--muted);
    font-weight: 700;
    line-height: 1.5;
}

@media (max-width: 980px) {
    .auth-card,
    .dashboard-hero {
        grid-template-columns: 1fr;
    }

    .dashboard-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 650px) {
    .auth-page,
    .dashboard-page {
        padding: 28px 18px 44px;
    }

    .auth-copy,
    .auth-form,
    .dashboard-hero {
        padding: 22px;
    }

    .dashboard-grid {
        grid-template-columns: 1fr;
    }
}

.block-title-row {
    display: flex;
    justify-content: space-between;
    gap: 18px;
    align-items: flex-start;
    margin-bottom: 18px;
}

.block-title-row h2 {
    margin-bottom: 6px;
}

.review-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 14px 0;
}

.review-tags span {
    background: #fff;
    color: var(--orange-dark);
    border: 1px solid #f1cfad;
    border-radius: 999px;
    padding: 7px 10px;
    font-weight: 900;
    font-size: .82rem;
}

.review-photos {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
    margin-top: 14px;
}

.review-photos img,
.photo-gallery img {
    width: 100%;
    height: 140px;
    object-fit: cover;
    border-radius: 16px;
    border: 1px solid var(--line);
    display: block;
}

.photo-gallery {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
}

@media (max-width: 700px) {
    .block-title-row {
        flex-direction: column;
    }

    .review-photos,
    .photo-gallery {
        grid-template-columns: 1fr;
    }

    .review-photos img,
    .photo-gallery img {
        height: 220px;
    }
}

.user-badge {
    min-height: 42px;
    padding: 0 14px;
    border-radius: 999px;
    background: #fff8ef;
    border: 1px solid var(--line);
    color: var(--muted);
    font-weight: 900;
    display: inline-flex;
    align-items: center;
    white-space: nowrap;
}

@media (max-width: 760px) {
    .user-badge {
        width: 100%;
        justify-content: center;
    }

    .header-actions {
        width: 100%;
        flex-wrap: wrap;
    }

    .header-link {
        flex: 1;
    }
}

.header-actions {
    display: flex;
    align-items: center;
    gap: 10px;
}

.header-actions .header-link,
.header-actions .user-badge {
    min-height: 42px;
    padding: 0 15px;
    border-radius: 999px;
    border: 1px solid var(--line);
    background: #fff8ef;
    color: var(--muted);
    font-weight: 900;
    font-size: 0.95rem;
    font-family: inherit;
    line-height: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    white-space: nowrap;
}

.header-actions .header-link.primary {
    background: linear-gradient(135deg, var(--orange), var(--red));
    border-color: transparent;
    color: #fff;
}

.dashboard-stats {
    margin-top: 24px;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 16px;
}

.dashboard-stats div {
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 24px;
    padding: 22px;
    box-shadow: 0 12px 32px rgba(70, 38, 16, .08);
}

.dashboard-stats strong {
    display: block;
    font-size: 2rem;
    letter-spacing: -.06em;
}

.dashboard-stats span {
    display: block;
    margin-top: 4px;
    color: var(--muted);
    font-weight: 800;
}

.dashboard-sections {
    margin-top: 24px;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
}

.dashboard-panel {
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 28px;
    padding: 24px;
    box-shadow: 0 12px 32px rgba(70, 38, 16, .08);
}

.panel-title-row {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    align-items: center;
    margin-bottom: 18px;
}

.panel-title-row h2 {
    margin: 0;
    font-size: 1.55rem;
    letter-spacing: -.055em;
}

.panel-title-row a {
    color: var(--orange-dark);
    font-weight: 900;
    white-space: nowrap;
}

.dashboard-list {
    display: grid;
    gap: 12px;
}

.dashboard-list-item {
    background: #fff8ef;
    border: 1px solid var(--line);
    border-radius: 18px;
    padding: 14px;
    display: flex;
    justify-content: space-between;
    gap: 14px;
    align-items: center;
}

.dashboard-list-item strong,
.dashboard-list-item small {
    display: block;
}

.dashboard-list-item small {
    margin-top: 4px;
    color: var(--muted);
    font-weight: 750;
    line-height: 1.45;
}

.mini-action {
    flex-shrink: 0;
    border-radius: 999px;
    padding: 9px 12px;
    background: #fff;
    border: 1px solid #f1cfad;
    color: var(--orange-dark);
    font-weight: 900;
}

.dashboard-empty {
    background: #fff8ef;
    border: 1px dashed var(--line);
    border-radius: 20px;
    padding: 18px;
    color: var(--muted);
    font-weight: 750;
}

.dashboard-empty p {
    margin: 0 0 14px;
}

@media (max-width: 980px) {
    .dashboard-stats,
    .dashboard-sections {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 650px) {
    .dashboard-stats,
    .dashboard-sections {
        grid-template-columns: 1fr;
    }

    .dashboard-list-item,
    .panel-title-row {
        align-items: flex-start;
        flex-direction: column;
    }
}

/* Dashboard layout ibrido */
.dashboard-welcome {
    border-radius: 34px;
    background:
        radial-gradient(circle at 82% 18%, rgba(242, 138, 46, .22), transparent 24%),
        linear-gradient(135deg, #fff4e4, #fffaf3);
    border: 1px solid var(--line);
    padding: 42px;
    display: grid;
    grid-template-columns: 1fr 320px;
    gap: 28px;
    align-items: center;
}

.dashboard-welcome h1 {
    margin: 0;
    font-size: clamp(2.4rem, 4.8vw, 4.6rem);
    letter-spacing: -.075em;
    line-height: .94;
}

.dashboard-welcome p {
    margin: 18px 0 0;
    color: var(--muted);
    max-width: 760px;
    line-height: 1.7;
    font-weight: 650;
}

.dashboard-user-card.compact {
    min-height: 170px;
}

.dashboard-summary-bar {
    margin-top: 18px;
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 28px;
    padding: 18px;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
    box-shadow: 0 12px 32px rgba(70, 38, 16, .08);
}

.dashboard-summary-bar div {
    background: #fff8ef;
    border: 1px solid var(--line);
    border-radius: 20px;
    padding: 18px;
}

.dashboard-summary-bar strong {
    display: block;
    font-size: 2rem;
    letter-spacing: -.06em;
    color: var(--ink);
}

.dashboard-summary-bar span {
    display: block;
    margin-top: 4px;
    color: var(--muted);
    font-weight: 850;
}

.dashboard-actions-grid {
    margin-top: 24px;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
}

@media (max-width: 980px) {
    .dashboard-welcome {
        grid-template-columns: 1fr;
    }

    .dashboard-summary-bar,
    .dashboard-actions-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 650px) {
    .dashboard-welcome {
        padding: 22px;
    }

    .dashboard-summary-bar,
    .dashboard-actions-grid {
        grid-template-columns: 1fr;
    }
}

/* Badge e reputazione */
.badge-overview-grid {
    display: grid;
    grid-template-columns: 360px 1fr;
    gap: 22px;
    margin-top: 24px;
}

.badge-main-card,
.badge-next-card {
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 30px;
    padding: 28px;
    box-shadow: 0 14px 36px rgba(70, 38, 16, .10);
}

.badge-main-card {
    text-align: center;
    color: var(--ink);
}

.badge-medal {
    width: 112px;
    height: 112px;
    margin: 0 auto 16px;
    border-radius: 999px;
    display: grid;
    place-items: center;
    font-size: 3.8rem;
    background: #fff8ef;
    border: 5px solid rgba(255,255,255,.75);
    box-shadow: inset 0 0 0 1px rgba(70,38,16,.08), 0 16px 34px rgba(70,38,16,.14);
}

.badge-main-card p,
.badge-next-card p {
    color: var(--muted);
    font-weight: 850;
}

.badge-main-card h2 {
    margin: 6px 0 8px;
    font-size: 2.1rem;
    letter-spacing: -.06em;
}

.badge-main-card > strong {
    display: inline-flex;
    border-radius: 999px;
    background: rgba(255,255,255,.72);
    border: 1px solid rgba(255,255,255,.7);
    padding: 10px 14px;
    font-size: 1rem;
}

.next-badge-line {
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 16px 0;
}

.next-badge-line span {
    width: 56px;
    height: 56px;
    border-radius: 20px;
    display: grid;
    place-items: center;
    background: #fff8ef;
    border: 1px solid var(--line);
    font-size: 2rem;
}

.next-badge-line strong {
    font-size: 1.6rem;
    letter-spacing: -.045em;
}

.badge-missing {
    margin: 0 0 16px;
}

.progress-bar {
    height: 18px;
    border-radius: 999px;
    background: #f1dfca;
    overflow: hidden;
    border: 1px solid var(--line);
}

.progress-bar div {
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, var(--orange), #f4b63f, var(--red));
}

.progress-label {
    display: flex;
    justify-content: space-between;
    margin-top: 9px;
    color: var(--muted);
    font-weight: 850;
    font-size: .9rem;
}

.badge-path-panel,
.points-panel {
    margin-top: 22px;
}

.badge-path-list {
    display: grid;
    gap: 12px;
}

.badge-path-item {
    display: grid;
    grid-template-columns: 58px 1fr auto;
    gap: 14px;
    align-items: center;
    border: 1px solid var(--line);
    border-radius: 22px;
    padding: 14px;
    background: #fff8ef;
}

.badge-path-icon {
    width: 52px;
    height: 52px;
    border-radius: 18px;
    display: grid;
    place-items: center;
    background: #fff;
    font-size: 1.8rem;
    box-shadow: inset 0 0 0 1px rgba(70,38,16,.06);
}

.badge-path-item strong,
.badge-path-item small {
    display: block;
}

.badge-path-item small {
    margin-top: 4px;
    color: var(--muted);
    font-weight: 800;
}

.badge-status {
    border-radius: 999px;
    padding: 8px 12px;
    font-weight: 900;
    font-size: .86rem;
    background: #fff;
    color: var(--muted);
    white-space: nowrap;
}

.badge-path-item.unlocked .badge-status {
    color: #357b42;
}

.badge-path-item.current {
    border-color: rgba(242,138,46,.55);
    box-shadow: 0 12px 28px rgba(242,138,46,.12);
}

.badge-path-item.current .badge-status {
    color: var(--orange-dark);
}

.badge-path-item.locked {
    opacity: .68;
}

.points-table {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.points-table div {
    background: #fff8ef;
    border: 1px solid var(--line);
    border-radius: 18px;
    padding: 14px;
    display: flex;
    justify-content: space-between;
    gap: 16px;
    align-items: center;
}

.points-table span {
    color: var(--muted);
    font-weight: 850;
}

.points-table strong {
    color: var(--orange-dark);
    font-size: 1.2rem;
}

.badge-note {
    margin: 18px 0 0;
    color: var(--muted);
    line-height: 1.65;
    font-weight: 750;
}

/* Colori badge */
.badge-new {
    background: linear-gradient(135deg, #f2f2f2, #ffffff);
}

.badge-assaggiatore {
    background: linear-gradient(135deg, #fff2d8, #ffd9a6);
}

.badge-forchetta {
    background: linear-gradient(135deg, #ffe0bd, #f28a2e);
}

.badge-cercatore {
    background: linear-gradient(135deg, #ffbd8c, #d83a21);
    color: #fff;
}

.badge-esperto {
    background: linear-gradient(135deg, #dff3df, #4d8b57);
    color: #fff;
}

.badge-guida {
    background: linear-gradient(135deg, #d9eff0, #22646b);
    color: #fff;
}

.badge-maestro {
    background: linear-gradient(135deg, #fff2a8, #f0b232, #b97912);
    color: #3e2608;
}

/* Pillola badge in navbar */
.navbar-badge {
    min-height: 42px;
    padding: 0 14px;
    border-radius: 999px;
    border: 1px solid var(--line);
    background: #fff8ef;
    color: var(--ink);
    font-weight: 900;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    white-space: nowrap;
}

.navbar-badge:hover {
    color: var(--orange-dark);
}

@media (max-width: 900px) {
    .badge-overview-grid {
        grid-template-columns: 1fr;
    }

    .points-table {
        grid-template-columns: 1fr;
    }

    .badge-path-item {
        grid-template-columns: 52px 1fr;
    }

    .badge-status {
        grid-column: 1 / -1;
        width: fit-content;
    }
}

@media (max-width: 650px) {
    .navbar-badge .badge-name {
        display: none;
    }
}

.review-actions {
    margin-top: 16px;
    padding-top: 14px;
    border-top: 1px solid var(--line);
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.useful-count {
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 999px;
    padding: 8px 12px;
    color: var(--muted);
    font-weight: 900;
    font-size: .86rem;
}

.useful-button {
    background: #fff0df;
    border: 1px solid #f1cfad;
    color: var(--orange-dark);
    border-radius: 999px;
    padding: 8px 12px;
    font-weight: 900;
    font-size: .86rem;
}

.useful-disabled {
    background: #f4eee6;
    border: 1px solid var(--line);
    color: var(--muted);
    border-radius: 999px;
    padding: 8px 12px;
    font-weight: 900;
    font-size: .86rem;
}

/* Badge e reputazione */
.badge-summary-bar {
    margin-top: 24px;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 16px;
}

.badge-summary-bar div {
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 24px;
    padding: 22px;
    box-shadow: 0 12px 32px rgba(70, 38, 16, .08);
}

.badge-summary-bar strong {
    display: block;
    font-size: 2.1rem;
    letter-spacing: -.06em;
}

.badge-summary-bar span {
    display: block;
    margin-top: 4px;
    color: var(--muted);
    font-weight: 850;
}

.badge-panel-main {
    grid-column: span 1;
}

.current-badge-card {
    background: #fff8ef;
    border: 1px solid var(--line);
    border-radius: 24px;
    padding: 22px;
    display: flex;
    align-items: center;
    gap: 18px;
}

.badge-icon-large {
    width: 78px;
    height: 78px;
    border-radius: 26px;
    display: grid;
    place-items: center;
    background: linear-gradient(135deg, var(--orange), var(--red));
    color: #fff;
    font-size: 2.2rem;
    box-shadow: 0 14px 28px rgba(216, 58, 33, .18);
    flex-shrink: 0;
}

.current-badge-card h3 {
    margin: 0;
    font-size: 2rem;
    letter-spacing: -.06em;
}

.current-badge-card p {
    color: var(--muted);
    line-height: 1.6;
}

.progress-block {
    margin-top: 20px;
}

.progress-top {
    display: flex;
    justify-content: space-between;
    color: var(--muted);
    font-weight: 900;
    margin-bottom: 8px;
}

.progress-bar {
    height: 16px;
    border-radius: 999px;
    background: #f2e3d2;
    overflow: hidden;
    border: 1px solid var(--line);
}

.progress-bar div {
    height: 100%;
    border-radius: 999px;
    background: linear-gradient(135deg, var(--orange), var(--red));
}

.badge-rules {
    margin-top: 22px;
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 22px;
    padding: 18px;
}

.badge-rules h3 {
    margin: 0 0 12px;
}

.badge-rules ul {
    margin: 0;
    padding-left: 20px;
    color: var(--muted);
    font-weight: 750;
    line-height: 1.7;
}

.badge-list {
    display: grid;
    gap: 12px;
}

.badge-list-item {
    background: #fff8ef;
    border: 1px solid var(--line);
    border-radius: 20px;
    padding: 16px;
    display: flex;
    gap: 12px;
    align-items: center;
}

.badge-list-item > span {
    width: 46px;
    height: 46px;
    border-radius: 16px;
    background: #fff0df;
    display: grid;
    place-items: center;
    font-size: 1.5rem;
    flex-shrink: 0;
}

.badge-list-item strong,
.badge-list-item small {
    display: block;
}

.badge-list-item small {
    margin-top: 4px;
    color: var(--muted);
    font-weight: 750;
    line-height: 1.45;
}

@media (max-width: 980px) {
    .badge-summary-bar {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 650px) {
    .badge-summary-bar {
        grid-template-columns: 1fr;
    }

    .current-badge-card {
        align-items: flex-start;
        flex-direction: column;
    }
}

.points-system {
    background: #fff;
}

.points-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.points-row {
    background: #fff8ef;
    border: 1px solid var(--line);
    border-radius: 18px;
    padding: 15px 16px;
    display: flex;
    justify-content: space-between;
    gap: 16px;
    align-items: center;
}

.points-row span {
    color: var(--muted);
    font-weight: 900;
}

.points-row strong {
    color: var(--orange-dark);
    font-weight: 950;
    text-align: right;
}

.points-explanation {
    margin: 18px 0 0;
    color: var(--muted);
    font-weight: 750;
    line-height: 1.7;
}

@media (max-width: 760px) {
    .points-grid {
        grid-template-columns: 1fr;
    }

    .points-row {
        align-items: flex-start;
        flex-direction: column;
    }

    .points-row strong {
        text-align: left;
    }
}

/* Layout compatto "Come guadagni punti" */
.compact-points-system {
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 28px;
    padding: 24px;
    box-shadow: 0 12px 32px rgba(70, 38, 16, .08);
}

.compact-points-system h3 {
    margin: 0 0 18px;
    font-size: 1.55rem;
    letter-spacing: -.055em;
}

.compact-points-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.compact-points-grid .points-row {
    background: #fff8ef;
    border: 1px solid var(--line);
    border-radius: 18px;
    padding: 14px 16px;
    min-height: 56px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 14px;
}

.compact-points-grid .points-row span {
    color: var(--muted);
    font-weight: 900;
    line-height: 1.35;
}

.compact-points-grid .points-row strong {
    color: var(--orange-dark);
    font-weight: 950;
    text-align: right;
    white-space: normal;
    line-height: 1.25;
}

.compact-points-system .points-explanation {
    margin: 20px 0 0;
    color: var(--muted);
    font-weight: 850;
    line-height: 1.75;
}

@media (max-width: 760px) {
    .compact-points-grid {
        grid-template-columns: 1fr;
    }

    .compact-points-grid .points-row {
        align-items: flex-start;
        flex-direction: column;
    }

    .compact-points-grid .points-row strong {
        text-align: left;
    }
}

/* Badge dashboard definitiva */
.badge-dashboard-page {
    display: grid;
    gap: 24px;
}

.badge-page-hero {
    background:
        radial-gradient(circle at 85% 20%, rgba(242, 138, 46, .18), transparent 25%),
        linear-gradient(135deg, #fff4e4, #fffaf3);
    border: 1px solid var(--line);
    border-radius: 34px;
    padding: 42px;
}

.badge-page-hero h1 {
    margin: 0;
    font-size: clamp(3rem, 6vw, 5.6rem);
    line-height: .92;
    letter-spacing: -.08em;
}

.badge-page-hero p {
    max-width: 820px;
    color: var(--muted);
    font-weight: 800;
    line-height: 1.7;
}

.badge-top-grid {
    display: grid;
    grid-template-columns: 360px 1fr;
    gap: 24px;
}

.badge-current-card,
.badge-next-card,
.badge-path-panel,
.badge-points-wide,
.badge-assigned-wide {
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 28px;
    padding: 26px;
    box-shadow: 0 12px 32px rgba(70, 38, 16, .08);
}

.badge-current-card {
    text-align: center;
    display: grid;
    place-items: center;
}

.badge-big-icon {
    width: 112px;
    height: 112px;
    border-radius: 50%;
    background: #fff8ef;
    border: 8px solid #fff;
    display: grid;
    place-items: center;
    font-size: 3.1rem;
    box-shadow: 0 16px 38px rgba(70, 38, 16, .12);
}

.badge-current-card p {
    margin: 16px 0 0;
    color: var(--muted);
    font-weight: 900;
}

.badge-current-card h2 {
    margin: 18px 0 8px;
    font-size: 2.2rem;
    letter-spacing: -.06em;
}

.badge-current-card strong {
    background: #fff8ef;
    border-radius: 999px;
    padding: 10px 16px;
}

.next-badge-title {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-top: 18px;
}

.next-badge-title span {
    width: 56px;
    height: 56px;
    border-radius: 18px;
    display: grid;
    place-items: center;
    background: #fff8ef;
    border: 1px solid var(--line);
    font-size: 1.8rem;
}

.next-badge-title h2 {
    margin: 0;
    font-size: 1.9rem;
    letter-spacing: -.055em;
}

.badge-next-card > p:not(.page-kicker) {
    color: var(--muted);
    font-weight: 900;
    margin-top: 22px;
}

.badge-path-panel h2,
.badge-points-wide h2 {
    margin: 0 0 20px;
    font-size: 1.7rem;
    letter-spacing: -.055em;
}

.badge-path-list {
    display: grid;
    gap: 12px;
}

.badge-path-item {
    min-height: 80px;
    border-radius: 22px;
    border: 1px solid var(--line);
    padding: 14px 16px;
    display: grid;
    grid-template-columns: 56px 1fr auto;
    gap: 16px;
    align-items: center;
    background: #fff8ef;
}

.badge-path-item > span {
    width: 46px;
    height: 46px;
    border-radius: 16px;
    background: #fff;
    display: grid;
    place-items: center;
    font-size: 1.55rem;
}

.badge-path-item strong,
.badge-path-item small {
    display: block;
}

.badge-path-item small {
    margin-top: 4px;
    color: var(--muted);
    font-weight: 800;
}

.badge-path-item em {
    font-style: normal;
    background: #fff;
    border-radius: 999px;
    padding: 8px 13px;
    font-weight: 950;
    color: var(--muted);
}

.badge-path-item.unlocked em {
    color: #167a32;
}

.badge-path-item.current {
    background: linear-gradient(135deg, #fff2dc, #ffd39b);
    border-color: #ff9d43;
}

.badge-path-item.current em {
    color: var(--orange-dark);
}

.badge-path-item.level-2 {
    background: linear-gradient(135deg, #ffe5c4, #ffb16d);
}

.badge-path-item.level-3 {
    background: linear-gradient(135deg, #ffd9c7, #ec7b67);
    color: #fff;
}

.badge-path-item.level-4 {
    background: linear-gradient(135deg, #d8f0da, #78aa82);
    color: #fff;
}

.badge-path-item.level-5 {
    background: linear-gradient(135deg, #d7eef1, #6b9ca3);
    color: #fff;
}

.badge-path-item.level-6 {
    background: linear-gradient(135deg, #ffeaa5, #d6a950);
}

.points-wide-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
}

.points-wide-row {
    background: #fff8ef;
    border: 1px solid var(--line);
    border-radius: 18px;
    min-height: 66px;
    padding: 14px 16px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
}

.points-wide-row span {
    color: var(--muted);
    font-weight: 900;
    line-height: 1.35;
}

.points-wide-row strong {
    color: var(--orange-dark);
    font-weight: 950;
    text-align: right;
    line-height: 1.25;
}

.points-wide-explanation {
    margin: 20px 0 0;
    max-width: 1180px;
    color: var(--muted);
    font-weight: 850;
    line-height: 1.75;
}

@media (max-width: 1200px) {
    .points-wide-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 980px) {
    .badge-top-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 650px) {
    .points-wide-grid {
        grid-template-columns: 1fr;
    }

    .badge-path-item {
        grid-template-columns: 46px 1fr;
    }

    .badge-path-item em {
        grid-column: 1 / -1;
        justify-self: start;
    }

    .points-wide-row {
        align-items: flex-start;
        flex-direction: column;
    }

    .points-wide-row strong {
        text-align: left;
    }
}

/* Correzioni finali pagina badge */
.badge-dashboard-page {
    display: grid;
    gap: 24px;
}

.badge-page-hero {
    background:
        radial-gradient(circle at 85% 20%, rgba(242, 138, 46, .18), transparent 25%),
        linear-gradient(135deg, #fff4e4, #fffaf3);
    border: 1px solid var(--line);
    border-radius: 34px;
    padding: 42px;
}

.badge-page-hero h1 {
    margin: 0;
    font-size: clamp(3rem, 6vw, 5.6rem);
    line-height: .92;
    letter-spacing: -.08em;
}

.badge-page-hero p {
    max-width: 820px;
    color: var(--muted);
    font-weight: 800;
    line-height: 1.7;
}

.badge-top-grid {
    display: grid;
    grid-template-columns: 360px 1fr;
    gap: 24px;
    align-items: stretch;
}

.badge-current-card,
.badge-next-card,
.badge-path-panel,
.badge-points-wide,
.badge-assigned-wide {
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 28px;
    padding: 26px;
    box-shadow: 0 12px 32px rgba(70, 38, 16, .08);
}

.badge-level-current {
    background: linear-gradient(135deg, #ffffff, #fff8ef);
}

.badge-level-next {
    background:
        radial-gradient(circle at 90% 20%, rgba(255, 180, 86, .22), transparent 24%),
        linear-gradient(135deg, #ffffff, #fff4dc);
}

.badge-current-card {
    text-align: center;
    display: grid;
    place-items: center;
    min-height: 300px;
}

.badge-big-icon {
    width: 112px;
    height: 112px;
    border-radius: 50%;
    background: #fff8ef;
    border: 8px solid #fff;
    display: grid;
    place-items: center;
    font-size: 3.1rem;
    box-shadow: 0 16px 38px rgba(70, 38, 16, .12);
}

.badge-current-card p {
    margin: 16px 0 0;
    color: var(--muted);
    font-weight: 900;
}

.badge-current-card h2 {
    margin: 18px 0 8px;
    font-size: 2.2rem;
    letter-spacing: -.06em;
}

.badge-current-card strong {
    background: #fff;
    border: 1px solid rgba(242, 210, 174, .75);
    border-radius: 999px;
    padding: 10px 16px;
}

.badge-next-card {
    min-height: 300px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.next-badge-title {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-top: 18px;
}

.next-badge-title span {
    width: 56px;
    height: 56px;
    border-radius: 18px;
    display: grid;
    place-items: center;
    background: #fff8ef;
    border: 1px solid var(--line);
    font-size: 1.8rem;
}

.next-badge-title h2 {
    margin: 0;
    font-size: 1.9rem;
    letter-spacing: -.055em;
}

.badge-next-card > p:not(.page-kicker) {
    color: var(--muted);
    font-weight: 900;
    margin-top: 22px;
}

.badge-progress-orange {
    background: #f2e3d2;
}

.badge-progress-orange div {
    background: linear-gradient(135deg, #ffb55f, #e64a2a);
}

.badge-path-panel h2,
.badge-points-wide h2 {
    margin: 0 0 20px;
    font-size: 1.7rem;
    letter-spacing: -.055em;
}

.badge-path-list {
    display: grid;
    gap: 12px;
}

.badge-path-item {
    min-height: 80px;
    border-radius: 22px;
    border: 1px solid var(--line);
    padding: 14px 16px;
    display: grid;
    grid-template-columns: 56px 1fr auto;
    gap: 16px;
    align-items: center;
    background: #fff8ef;
}

.badge-path-item > span {
    width: 46px;
    height: 46px;
    border-radius: 16px;
    background: #fff;
    display: grid;
    place-items: center;
    font-size: 1.55rem;
}

.badge-path-item strong,
.badge-path-item small {
    display: block;
}

.badge-path-item small {
    margin-top: 4px;
    color: var(--muted);
    font-weight: 800;
}

.badge-path-item em {
    font-style: normal;
    background: #fff;
    border-radius: 999px;
    padding: 8px 13px;
    font-weight: 950;
    color: var(--muted);
}

.badge-path-item.unlocked {
    background: linear-gradient(135deg, #ffffff, #f7f7f7);
}

.badge-path-item.unlocked em {
    color: #167a32;
}

.badge-path-item.current {
    background: linear-gradient(135deg, #fff2dc, #ffd39b);
    border-color: #ff9d43;
}

.badge-path-item.current em {
    color: var(--orange-dark);
}

.badge-path-item.level-2 {
    background: linear-gradient(135deg, #ffe5c4, #ffb16d);
}

.badge-path-item.level-3 {
    background: linear-gradient(135deg, #ffd9c7, #ec7b67);
    color: #fff;
}

.badge-path-item.level-4 {
    background: linear-gradient(135deg, #d8f0da, #78aa82);
    color: #fff;
}

.badge-path-item.level-5 {
    background: linear-gradient(135deg, #d7eef1, #6b9ca3);
    color: #fff;
}

.badge-path-item.level-6 {
    background: linear-gradient(135deg, #ffeaa5, #d6a950);
}

.badge-points-wide {
    background:
        radial-gradient(circle at 92% 12%, rgba(255, 180, 86, .16), transparent 22%),
        #fff;
}

.points-wide-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
}

.points-wide-row {
    background: #fff8ef;
    border: 1px solid var(--line);
    border-radius: 18px;
    min-height: 66px;
    padding: 14px 16px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
}

.points-wide-row span {
    color: var(--muted);
    font-weight: 900;
    line-height: 1.35;
}

.points-wide-row strong {
    color: var(--orange-dark);
    font-weight: 950;
    text-align: right;
    line-height: 1.25;
}

.points-wide-explanation-box {
    margin: 22px 0 0;
    padding: 18px 20px;
    border-radius: 20px;
    border: 1px solid var(--line);
    background: #fff8ef;
    color: var(--muted);
    font-weight: 850;
    line-height: 1.75;
    max-width: 1180px;
}

.badge-assigned-wide {
    background: linear-gradient(135deg, #ffffff, #fff8ef);
}

.badge-assigned-wide .dashboard-empty {
    display: grid;
    gap: 6px;
}

.badge-assigned-wide .dashboard-empty p {
    margin: 0;
}

.badge-list-item small {
    color: var(--muted);
    font-weight: 850;
}

@media (max-width: 1200px) {
    .points-wide-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 980px) {
    .badge-top-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 650px) {
    .points-wide-grid {
        grid-template-columns: 1fr;
    }

    .badge-path-item {
        grid-template-columns: 46px 1fr;
    }

    .badge-path-item em {
        grid-column: 1 / -1;
        justify-self: start;
    }

    .points-wide-row {
        align-items: flex-start;
        flex-direction: column;
    }

    .points-wide-row strong {
        text-align: left;
    }
}

/* Fix box prossimo badge e testo spiegazione punti */
.next-badge-missing {
    margin: 22px 0 16px;
    color: var(--muted);
    font-weight: 900;
    line-height: 1.6;
}

.next-badge-missing strong {
    color: var(--ink);
}

.badge-next-card .progress-block {
    width: 100%;
    margin-top: 12px;
}

.badge-next-card .progress-top {
    width: 100%;
}

.points-wide-explanation-box {
    box-sizing: border-box;
    width: 100%;
    max-width: none;
    margin: 22px 0 0;
    padding: 20px 24px;
    border-radius: 20px;
    border: 1px solid var(--line);
    background: #fff8ef;
    color: var(--muted);
    font-weight: 850;
    line-height: 1.75;
}

.badge-points-wide {
    overflow: hidden;
}

.badge-points-wide h2,
.badge-points-wide .points-wide-grid,
.badge-points-wide .points-wide-explanation-box {
    margin-left: 0;
    margin-right: 0;
}

/* Fix preciso box prossimo badge */
.badge-next-card {
    min-height: 270px;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    padding: 30px 34px;
}

.badge-next-card .page-kicker {
    margin: 0 0 18px;
    letter-spacing: .18em;
}

.next-badge-title {
    display: flex;
    align-items: center;
    gap: 14px;
    margin: 0;
}

.next-badge-title span {
    width: 56px;
    height: 56px;
    border-radius: 18px;
    display: grid;
    place-items: center;
    background: #fff8ef;
    border: 1px solid var(--line);
    font-size: 1.8rem;
    flex-shrink: 0;
}

.next-badge-title h2 {
    margin: 0;
    font-size: 1.9rem;
    letter-spacing: -.055em;
    line-height: 1;
}

.next-badge-missing {
    margin: 28px 0 16px;
    color: var(--muted);
    font-weight: 950;
    line-height: 1.4;
}

.next-badge-progress {
    margin-top: 0;
    width: 100%;
}

.next-badge-progress .progress-bar {
    height: 17px;
    border-radius: 999px;
    background: #f2e3d2;
    border: 1px solid var(--line);
    overflow: hidden;
}

.next-badge-progress .progress-bar div {
    height: 100%;
    border-radius: 999px;
    background: linear-gradient(135deg, #ffb55f, #e64a2a);
}

.next-badge-progress .progress-top {
    margin-top: 12px;
    display: flex;
    justify-content: space-between;
    color: var(--muted);
    font-weight: 950;
}

/* FIX DEFINITIVO prossimo badge */
.badge-next-card.badge-level-next {
    min-height: 270px !important;
    padding: 30px 34px !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-start !important;
}

.badge-next-card.badge-level-next .page-kicker {
    margin: 0 0 18px !important;
    letter-spacing: .18em !important;
    text-transform: uppercase !important;
}

.badge-next-card .next-badge-title {
    display: flex !important;
    align-items: center !important;
    gap: 14px !important;
    margin: 0 !important;
}

.badge-next-card .next-badge-title span {
    width: 56px !important;
    height: 56px !important;
    border-radius: 18px !important;
    display: grid !important;
    place-items: center !important;
    background: #fff8ef !important;
    border: 1px solid var(--line) !important;
    font-size: 1.8rem !important;
    flex-shrink: 0 !important;
}

.badge-next-card .next-badge-title h2 {
    margin: 0 !important;
    font-size: 1.9rem !important;
    letter-spacing: -.055em !important;
    line-height: 1 !important;
}

.badge-next-card .next-badge-missing {
    margin: 28px 0 16px !important;
    color: var(--muted) !important;
    font-weight: 950 !important;
    line-height: 1.4 !important;
}

.next-badge-progress {
    width: 100% !important;
    margin-top: 0 !important;
}

.next-progress-bar {
    height: 17px !important;
    border-radius: 999px !important;
    background: #f2e3d2 !important;
    border: 1px solid var(--line) !important;
    overflow: hidden !important;
}

.next-progress-bar div {
    height: 100% !important;
    border-radius: 999px !important;
    background: linear-gradient(135deg, #ffb55f, #e64a2a) !important;
}

.next-progress-labels {
    margin-top: 12px !important;
    display: flex !important;
    justify-content: space-between !important;
    color: var(--muted) !important;
    font-weight: 950 !important;
}

/* RESET DEFINITIVO pagina badge: layout verticale */
.badge-page-reset {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 24px !important;
}

.badge-page-reset > * {
    width: 100% !important;
    max-width: none !important;
}

.badge-page-reset .badge-top-grid {
    display: grid !important;
    grid-template-columns: 360px 1fr !important;
    gap: 24px !important;
    align-items: stretch !important;
}

.badge-page-reset .badge-path-panel,
.badge-page-reset .badge-points-wide,
.badge-page-reset .badge-assigned-wide {
    grid-column: 1 / -1 !important;
    width: 100% !important;
}

.badge-page-reset .badge-current-card,
.badge-page-reset .badge-next-card,
.badge-page-reset .badge-path-panel,
.badge-page-reset .badge-points-wide,
.badge-page-reset .badge-assigned-wide {
    background: #fff !important;
    border: 1px solid var(--line) !important;
    border-radius: 28px !important;
    padding: 26px !important;
    box-shadow: 0 12px 32px rgba(70, 38, 16, .08) !important;
}

.badge-page-reset .badge-page-hero {
    background:
        radial-gradient(circle at 85% 20%, rgba(242, 138, 46, .18), transparent 25%),
        linear-gradient(135deg, #fff4e4, #fffaf3) !important;
    border: 1px solid var(--line) !important;
    border-radius: 34px !important;
    padding: 42px !important;
}

.badge-page-reset .badge-page-hero h1 {
    margin: 0 !important;
    font-size: clamp(3rem, 6vw, 5.6rem) !important;
    line-height: .92 !important;
    letter-spacing: -.08em !important;
}

.badge-page-reset .badge-current-card {
    min-height: 300px !important;
    text-align: center !important;
    display: grid !important;
    place-items: center !important;
    background: linear-gradient(135deg, #fff, #fff8ef) !important;
}

.badge-page-reset .badge-big-icon {
    width: 112px !important;
    height: 112px !important;
    border-radius: 50% !important;
    background: #fff8ef !important;
    border: 8px solid #fff !important;
    display: grid !important;
    place-items: center !important;
    font-size: 3.1rem !important;
    box-shadow: 0 16px 38px rgba(70, 38, 16, .12) !important;
}

.badge-page-reset .badge-current-card p {
    margin: 16px 0 0 !important;
    color: var(--muted) !important;
    font-weight: 900 !important;
}

.badge-page-reset .badge-current-card h2 {
    margin: 18px 0 8px !important;
    font-size: 2.2rem !important;
    letter-spacing: -.06em !important;
}

.badge-page-reset .badge-current-card strong {
    background: #fff !important;
    border: 1px solid rgba(242, 210, 174, .75) !important;
    border-radius: 999px !important;
    padding: 10px 16px !important;
}

.badge-page-reset .badge-next-card {
    min-height: 300px !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    background:
        radial-gradient(circle at 90% 20%, rgba(255, 180, 86, .18), transparent 24%),
        linear-gradient(135deg, #fff, #fff4dc) !important;
}

.badge-page-reset .next-badge-title {
    display: flex !important;
    align-items: center !important;
    gap: 14px !important;
    margin: 16px 0 0 !important;
}

.badge-page-reset .next-badge-title span {
    width: 56px !important;
    height: 56px !important;
    border-radius: 18px !important;
    display: grid !important;
    place-items: center !important;
    background: #fff8ef !important;
    border: 1px solid var(--line) !important;
    font-size: 1.8rem !important;
}

.badge-page-reset .next-badge-title h2 {
    margin: 0 !important;
    font-size: 1.9rem !important;
    letter-spacing: -.055em !important;
}

.badge-page-reset .next-badge-missing {
    margin: 28px 0 16px !important;
    color: var(--muted) !important;
    font-weight: 950 !important;
}

.badge-page-reset .next-progress-bar {
    height: 17px !important;
    border-radius: 999px !important;
    background: #f2e3d2 !important;
    border: 1px solid var(--line) !important;
    overflow: hidden !important;
}

.badge-page-reset .next-progress-bar div {
    height: 100% !important;
    border-radius: 999px !important;
    background: linear-gradient(135deg, #ffb55f, #e64a2a) !important;
}

.badge-page-reset .next-progress-labels {
    margin-top: 12px !important;
    display: flex !important;
    justify-content: space-between !important;
    color: var(--muted) !important;
    font-weight: 950 !important;
}

.badge-page-reset .badge-path-list {
    display: grid !important;
    gap: 12px !important;
}

.badge-page-reset .badge-path-item {
    min-height: 80px !important;
    border-radius: 22px !important;
    border: 1px solid var(--line) !important;
    padding: 14px 16px !important;
    display: grid !important;
    grid-template-columns: 56px 1fr auto !important;
    gap: 16px !important;
    align-items: center !important;
}

.badge-page-reset .points-wide-grid {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 12px !important;
}

.badge-page-reset .points-wide-row {
    background: #fff8ef !important;
    border: 1px solid var(--line) !important;
    border-radius: 18px !important;
    min-height: 66px !important;
    padding: 14px 16px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 14px !important;
}

.badge-page-reset .points-wide-row span {
    color: var(--muted) !important;
    font-weight: 900 !important;
    line-height: 1.35 !important;
}

.badge-page-reset .points-wide-row strong {
    color: var(--orange-dark) !important;
    font-weight: 950 !important;
    text-align: right !important;
}

.badge-page-reset .points-wide-explanation-box {
    box-sizing: border-box !important;
    width: 100% !important;
    margin: 22px 0 0 !important;
    padding: 20px 24px !important;
    border-radius: 20px !important;
    border: 1px solid var(--line) !important;
    background: #fff8ef !important;
    color: var(--muted) !important;
    font-weight: 850 !important;
    line-height: 1.75 !important;
}

@media (max-width: 1200px) {
    .badge-page-reset .points-wide-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 980px) {
    .badge-page-reset .badge-top-grid {
        grid-template-columns: 1fr !important;
    }
}

@media (max-width: 650px) {
    .badge-page-reset .points-wide-grid {
        grid-template-columns: 1fr !important;
    }

    .badge-page-reset .badge-path-item {
        grid-template-columns: 46px 1fr !important;
    }

    .badge-page-reset .badge-path-item em {
        grid-column: 1 / -1 !important;
        justify-self: start !important;
    }
}

/* Ripristino stile vecchia pagina badge */
.badge-page-reset .badge-main-card,
.badge-page-reset .badge-next-card {
    background: #fff !important;
    border: 1px solid var(--line) !important;
    border-radius: 30px !important;
    padding: 28px !important;
    box-shadow: 0 14px 36px rgba(70, 38, 16, .10) !important;
}

.badge-page-reset .badge-main-card {
    text-align: center !important;
    color: var(--ink) !important;
    min-height: 300px !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
}

.badge-page-reset .badge-medal {
    width: 112px !important;
    height: 112px !important;
    margin: 0 auto 16px !important;
    border-radius: 999px !important;
    display: grid !important;
    place-items: center !important;
    font-size: 3.8rem !important;
    background: #fff8ef !important;
    border: 5px solid rgba(255,255,255,.75) !important;
    box-shadow: inset 0 0 0 1px rgba(70,38,16,.08), 0 16px 34px rgba(70,38,16,.14) !important;
}

.badge-page-reset .badge-main-card p {
    margin: 0 0 18px !important;
    color: var(--muted) !important;
    font-weight: 900 !important;
}

.badge-page-reset .badge-main-card h2 {
    margin: 0 0 14px !important;
    font-size: 2.2rem !important;
    letter-spacing: -.06em !important;
}

.badge-page-reset .badge-main-card strong {
    align-self: center !important;
    background: #fff8ef !important;
    border-radius: 999px !important;
    padding: 10px 16px !important;
    font-weight: 950 !important;
}

/* Prossimo badge come vecchia pagina */
.badge-page-reset .badge-next-card {
    min-height: 300px !important;
    display: block !important;
}

.badge-page-reset .badge-next-card .page-kicker {
    margin: 0 0 18px !important;
    letter-spacing: .18em !important;
    text-transform: uppercase !important;
}

.badge-page-reset .badge-next-card .next-badge-title {
    display: flex !important;
    align-items: center !important;
    gap: 14px !important;
    margin: 0 0 24px !important;
}

.badge-page-reset .badge-next-card .next-badge-title span {
    width: 56px !important;
    height: 56px !important;
    border-radius: 18px !important;
    display: grid !important;
    place-items: center !important;
    background: #fff8ef !important;
    border: 1px solid var(--line) !important;
    font-size: 1.8rem !important;
    flex-shrink: 0 !important;
}

.badge-page-reset .badge-next-card .next-badge-title h2 {
    margin: 0 !important;
    font-size: 1.9rem !important;
    letter-spacing: -.055em !important;
    line-height: 1 !important;
}

.badge-page-reset .badge-next-card .next-badge-missing {
    margin: 0 0 18px !important;
    color: var(--muted) !important;
    font-weight: 950 !important;
}

.badge-page-reset .next-badge-progress {
    width: 100% !important;
}

.badge-page-reset .next-progress-bar {
    width: 100% !important;
    height: 17px !important;
    border-radius: 999px !important;
    background: #f2e3d2 !important;
    border: 1px solid var(--line) !important;
    overflow: hidden !important;
}

.badge-page-reset .next-progress-bar div {
    height: 100% !important;
    border-radius: 999px !important;
    background: linear-gradient(135deg, #ffb55f, #e64a2a) !important;
}

.badge-page-reset .next-progress-labels {
    margin-top: 12px !important;
    display: flex !important;
    justify-content: space-between !important;
    color: var(--muted) !important;
    font-weight: 950 !important;
}

/* FIX FINALE box Prossimo badge */
.badge-page-reset .badge-next-card {
    min-height: 300px !important;
    padding: 30px 34px !important;
    display: block !important;
    background: #fff !important;
    border: 1px solid var(--line) !important;
    border-radius: 30px !important;
    box-shadow: 0 14px 36px rgba(70, 38, 16, .10) !important;
}

.badge-page-reset .badge-next-card .page-kicker {
    margin: 0 0 22px !important;
    color: var(--muted) !important;
    font-weight: 950 !important;
    letter-spacing: .18em !important;
    text-transform: uppercase !important;
}

.badge-page-reset .fixed-next-title {
    display: flex !important;
    align-items: center !important;
    gap: 14px !important;
    margin: 0 0 28px !important;
}

.badge-page-reset .fixed-next-title .next-badge-icon {
    width: 56px !important;
    height: 56px !important;
    border-radius: 18px !important;
    display: grid !important;
    place-items: center !important;
    background: #fff8ef !important;
    border: 1px solid var(--line) !important;
    font-size: 1.8rem !important;
    flex-shrink: 0 !important;
}

.badge-page-reset .fixed-next-title h2 {
    margin: 0 !important;
    font-size: 1.95rem !important;
    line-height: 1 !important;
    letter-spacing: -.055em !important;
    color: var(--ink) !important;
}

.badge-page-reset .fixed-missing {
    margin: 0 0 18px !important;
    color: var(--muted) !important;
    font-weight: 950 !important;
    line-height: 1.4 !important;
}

.badge-page-reset .fixed-missing strong {
    color: var(--ink) !important;
    font-weight: 950 !important;
}

.badge-page-reset .fixed-progress {
    width: 100% !important;
    margin-top: 0 !important;
}

.badge-page-reset .fixed-progress .next-progress-bar {
    width: 100% !important;
    height: 17px !important;
    border-radius: 999px !important;
    background: #f2e3d2 !important;
    border: 1px solid var(--line) !important;
    overflow: hidden !important;
}

.badge-page-reset .fixed-progress .next-progress-bar div {
    height: 100% !important;
    border-radius: 999px !important;
    background: linear-gradient(135deg, #ffb55f, #e64a2a) !important;
}

.badge-page-reset .fixed-progress .next-progress-labels {
    margin-top: 12px !important;
    display: flex !important;
    justify-content: space-between !important;
    color: var(--muted) !important;
    font-weight: 950 !important;
}

/* PAGINA BADGE CLEAN - classi isolate */
.badge-clean-page {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 24px !important;
}

.badge-clean-hero,
.badge-clean-current,
.badge-clean-next,
.badge-clean-path,
.badge-clean-points,
.badge-clean-assigned {
    border: 1px solid var(--line) !important;
    border-radius: 30px !important;
    box-shadow: 0 14px 36px rgba(70, 38, 16, .10) !important;
}

.badge-clean-hero {
    background:
        radial-gradient(circle at 85% 20%, rgba(242, 138, 46, .18), transparent 25%),
        linear-gradient(135deg, #fff4e4, #fffaf3) !important;
    padding: 42px !important;
}

.badge-clean-hero h1 {
    margin: 0 !important;
    font-size: clamp(3rem, 6vw, 5.6rem) !important;
    line-height: .92 !important;
    letter-spacing: -.08em !important;
}

.badge-clean-hero p {
    max-width: 820px !important;
    color: var(--muted) !important;
    font-weight: 800 !important;
    line-height: 1.7 !important;
}

.badge-clean-top {
    display: grid !important;
    grid-template-columns: 360px 1fr !important;
    gap: 24px !important;
}

.badge-clean-current,
.badge-clean-next,
.badge-clean-path,
.badge-clean-points,
.badge-clean-assigned {
    background: #fff !important;
    padding: 28px !important;
}

.badge-clean-current {
    min-height: 300px !important;
    text-align: center !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    align-items: center !important;
}

.badge-clean-medal {
    width: 112px !important;
    height: 112px !important;
    margin: 0 auto 16px !important;
    border-radius: 999px !important;
    display: grid !important;
    place-items: center !important;
    font-size: 3.8rem !important;
    background: #fff8ef !important;
    border: 5px solid rgba(255,255,255,.75) !important;
    box-shadow: inset 0 0 0 1px rgba(70,38,16,.08), 0 16px 34px rgba(70,38,16,.14) !important;
}

.badge-clean-current p {
    margin: 0 0 18px !important;
    color: var(--muted) !important;
    font-weight: 900 !important;
}

.badge-clean-current h2 {
    margin: 0 0 14px !important;
    font-size: 2.2rem !important;
    letter-spacing: -.06em !important;
}

.badge-clean-current strong {
    background: #fff8ef !important;
    border-radius: 999px !important;
    padding: 10px 16px !important;
    font-weight: 950 !important;
}

.badge-clean-next {
    min-height: 300px !important;
    display: block !important;
}

.badge-clean-next .page-kicker {
    margin: 0 0 20px !important;
    letter-spacing: .18em !important;
    text-transform: uppercase !important;
}

.badge-clean-next-title {
    display: flex !important;
    align-items: center !important;
    gap: 14px !important;
    margin-bottom: 28px !important;
}

.badge-clean-next-title span {
    width: 56px !important;
    height: 56px !important;
    border-radius: 18px !important;
    display: grid !important;
    place-items: center !important;
    background: #fff8ef !important;
    border: 1px solid var(--line) !important;
    font-size: 1.8rem !important;
}

.badge-clean-next-title h2 {
    margin: 0 !important;
    font-size: 1.95rem !important;
    letter-spacing: -.055em !important;
    line-height: 1 !important;
}

.badge-clean-missing {
    margin: 0 0 18px !important;
    color: var(--muted) !important;
    font-weight: 950 !important;
}

.badge-clean-missing strong {
    color: var(--ink) !important;
}

.badge-clean-bar {
    height: 17px !important;
    border-radius: 999px !important;
    background: #f2e3d2 !important;
    border: 1px solid var(--line) !important;
    overflow: hidden !important;
}

.badge-clean-bar div {
    height: 100% !important;
    border-radius: 999px !important;
    background: linear-gradient(135deg, #ffb55f, #e64a2a) !important;
}

.badge-clean-labels {
    margin-top: 12px !important;
    display: flex !important;
    justify-content: space-between !important;
    color: var(--muted) !important;
    font-weight: 950 !important;
}

.badge-clean-path h2,
.badge-clean-points h2 {
    margin: 0 0 20px !important;
    font-size: 1.7rem !important;
    letter-spacing: -.055em !important;
}

.badge-clean-path-list {
    display: grid !important;
    gap: 12px !important;
}

.badge-clean-path-item {
    min-height: 80px !important;
    border-radius: 22px !important;
    border: 1px solid var(--line) !important;
    padding: 14px 16px !important;
    display: grid !important;
    grid-template-columns: 56px 1fr auto !important;
    gap: 16px !important;
    align-items: center !important;
    background: #fff8ef !important;
}

.badge-clean-path-item > span {
    width: 46px !important;
    height: 46px !important;
    border-radius: 16px !important;
    background: #fff !important;
    display: grid !important;
    place-items: center !important;
    font-size: 1.55rem !important;
}

.badge-clean-path-item strong,
.badge-clean-path-item small {
    display: block !important;
}

.badge-clean-path-item small {
    margin-top: 4px !important;
    color: var(--muted) !important;
    font-weight: 800 !important;
}

.badge-clean-path-item em {
    font-style: normal !important;
    background: #fff !important;
    border-radius: 999px !important;
    padding: 8px 13px !important;
    font-weight: 950 !important;
    color: var(--muted) !important;
}

.badge-clean-path-item.unlocked em {
    color: #167a32 !important;
}

.badge-clean-path-item.current {
    background: linear-gradient(135deg, #fff2dc, #ffd39b) !important;
    border-color: #ff9d43 !important;
}

.badge-clean-path-item.current em {
    color: var(--orange-dark) !important;
}

.badge-clean-path-item.level-3 {
    background: linear-gradient(135deg, #ffe5c4, #ffb16d) !important;
}

.badge-clean-path-item.level-4 {
    background: linear-gradient(135deg, #ffd9c7, #ec7b67) !important;
    color: #fff !important;
}

.badge-clean-path-item.level-5 {
    background: linear-gradient(135deg, #d8f0da, #78aa82) !important;
    color: #fff !important;
}

.badge-clean-path-item.level-6 {
    background: linear-gradient(135deg, #d7eef1, #6b9ca3) !important;
    color: #fff !important;
}

.badge-clean-path-item.level-7 {
    background: linear-gradient(135deg, #ffeaa5, #d6a950) !important;
}

.badge-clean-points-grid {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 12px !important;
}

.badge-clean-points-grid div {
    min-height: 66px !important;
    border-radius: 18px !important;
    border: 1px solid var(--line) !important;
    background: #fff8ef !important;
    padding: 14px 16px !important;
    display: flex !important;
    justify-content: space-between !important;
    gap: 14px !important;
    align-items: center !important;
}

.badge-clean-points-grid span {
    color: var(--muted) !important;
    font-weight: 900 !important;
    line-height: 1.35 !important;
}

.badge-clean-points-grid strong {
    color: var(--orange-dark) !important;
    font-weight: 950 !important;
    text-align: right !important;
}

.badge-clean-explanation {
    margin: 22px 0 0 !important;
    padding: 20px 24px !important;
    border-radius: 20px !important;
    border: 1px solid var(--line) !important;
    background: #fff8ef !important;
    color: var(--muted) !important;
    font-weight: 850 !important;
    line-height: 1.75 !important;
}

@media (max-width: 1200px) {
    .badge-clean-points-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 980px) {
    .badge-clean-top {
        grid-template-columns: 1fr !important;
    }
}

@media (max-width: 650px) {
    .badge-clean-points-grid {
        grid-template-columns: 1fr !important;
    }

    .badge-clean-path-item {
        grid-template-columns: 46px 1fr !important;
    }

    .badge-clean-path-item em {
        grid-column: 1 / -1 !important;
        justify-self: start !important;
    }
}

/* SR BADGE PAGE - CSS isolato definitivo */
.sr-badge-page {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 24px !important;
}

.sr-badge-hero,
.sr-badge-current,
.sr-badge-next,
.sr-badge-path,
.sr-badge-points,
.sr-badge-assigned {
    border: 1px solid var(--line) !important;
    border-radius: 30px !important;
    box-shadow: 0 14px 36px rgba(70, 38, 16, .10) !important;
}

.sr-badge-hero {
    padding: 42px !important;
    background: radial-gradient(circle at 85% 20%, rgba(242, 138, 46, .18), transparent 25%), linear-gradient(135deg, #fff4e4, #fffaf3) !important;
}

.sr-badge-hero h1 {
    margin: 0 !important;
    font-size: clamp(3rem, 6vw, 5.6rem) !important;
    line-height: .92 !important;
    letter-spacing: -.08em !important;
}

.sr-badge-hero p {
    max-width: 820px !important;
    color: var(--muted) !important;
    font-weight: 800 !important;
    line-height: 1.7 !important;
}

.sr-badge-top {
    display: grid !important;
    grid-template-columns: 360px 1fr !important;
    gap: 24px !important;
}

.sr-badge-current,
.sr-badge-next,
.sr-badge-path,
.sr-badge-points,
.sr-badge-assigned {
    background: #fff !important;
    padding: 28px !important;
}

.sr-badge-current {
    min-height: 300px !important;
    text-align: center !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
}

.sr-badge-medal {
    width: 112px !important;
    height: 112px !important;
    margin: 0 auto 16px !important;
    border-radius: 999px !important;
    display: grid !important;
    place-items: center !important;
    font-size: 3.8rem !important;
    background: #fff8ef !important;
    border: 5px solid rgba(255,255,255,.75) !important;
    box-shadow: inset 0 0 0 1px rgba(70,38,16,.08), 0 16px 34px rgba(70,38,16,.14) !important;
}

.sr-badge-current p {
    margin: 0 0 18px !important;
    color: var(--muted) !important;
    font-weight: 900 !important;
}

.sr-badge-current h2 {
    margin: 0 0 14px !important;
    font-size: 2.2rem !important;
    letter-spacing: -.06em !important;
}

.sr-badge-current strong {
    background: #fff8ef !important;
    border-radius: 999px !important;
    padding: 10px 16px !important;
    font-weight: 950 !important;
}

.sr-badge-next {
    min-height: 300px !important;
    display: block !important;
}

.sr-badge-next .page-kicker {
    margin: 0 0 20px !important;
    letter-spacing: .18em !important;
    text-transform: uppercase !important;
}

.sr-badge-next-title {
    display: flex !important;
    align-items: center !important;
    gap: 14px !important;
    margin-bottom: 28px !important;
}

.sr-badge-next-title span {
    width: 56px !important;
    height: 56px !important;
    border-radius: 18px !important;
    display: grid !important;
    place-items: center !important;
    background: #fff8ef !important;
    border: 1px solid var(--line) !important;
    font-size: 1.8rem !important;
}

.sr-badge-next-title h2 {
    margin: 0 !important;
    font-size: 1.95rem !important;
    letter-spacing: -.055em !important;
    line-height: 1 !important;
}

.sr-badge-missing {
    margin: 0 0 18px !important;
    color: var(--muted) !important;
    font-weight: 950 !important;
}

.sr-badge-missing strong {
    color: var(--ink) !important;
}

.sr-badge-bar {
    height: 17px !important;
    border-radius: 999px !important;
    background: #f2e3d2 !important;
    border: 1px solid var(--line) !important;
    overflow: hidden !important;
}

.sr-badge-bar div {
    height: 100% !important;
    border-radius: 999px !important;
    background: linear-gradient(135deg, #ffb55f, #e64a2a) !important;
}

.sr-badge-labels {
    margin-top: 12px !important;
    display: flex !important;
    justify-content: space-between !important;
    color: var(--muted) !important;
    font-weight: 950 !important;
}

.sr-badge-path h2,
.sr-badge-points h2 {
    margin: 0 0 20px !important;
    font-size: 1.7rem !important;
    letter-spacing: -.055em !important;
}

.sr-badge-path-list {
    display: grid !important;
    gap: 12px !important;
}

.sr-badge-path-item {
    min-height: 80px !important;
    border-radius: 22px !important;
    border: 1px solid var(--line) !important;
    padding: 14px 16px !important;
    display: grid !important;
    grid-template-columns: 56px 1fr auto !important;
    gap: 16px !important;
    align-items: center !important;
    background: #fff8ef !important;
}

.sr-badge-path-item > span {
    width: 46px !important;
    height: 46px !important;
    border-radius: 16px !important;
    background: #fff !important;
    display: grid !important;
    place-items: center !important;
    font-size: 1.55rem !important;
}

.sr-badge-path-item strong,
.sr-badge-path-item small {
    display: block !important;
}

.sr-badge-path-item small {
    margin-top: 4px !important;
    color: var(--muted) !important;
    font-weight: 800 !important;
}

.sr-badge-path-item em {
    font-style: normal !important;
    background: #fff !important;
    border-radius: 999px !important;
    padding: 8px 13px !important;
    font-weight: 950 !important;
    color: var(--muted) !important;
}

.sr-badge-path-item.unlocked em {
    color: #167a32 !important;
}

.sr-badge-path-item.current {
    background: linear-gradient(135deg, #fff2dc, #ffd39b) !important;
    border-color: #ff9d43 !important;
}

.sr-badge-path-item.current em {
    color: var(--orange-dark) !important;
}

.sr-badge-path-item.level-3 {
    background: linear-gradient(135deg, #ffe5c4, #ffb16d) !important;
}

.sr-badge-path-item.level-4 {
    background: linear-gradient(135deg, #ffd9c7, #ec7b67) !important;
    color: #fff !important;
}

.sr-badge-path-item.level-5 {
    background: linear-gradient(135deg, #d8f0da, #78aa82) !important;
    color: #fff !important;
}

.sr-badge-path-item.level-6 {
    background: linear-gradient(135deg, #d7eef1, #6b9ca3) !important;
    color: #fff !important;
}

.sr-badge-path-item.level-7 {
    background: linear-gradient(135deg, #ffeaa5, #d6a950) !important;
}

.sr-badge-points-grid {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 12px !important;
}

.sr-badge-points-grid div {
    min-height: 66px !important;
    border-radius: 18px !important;
    border: 1px solid var(--line) !important;
    background: #fff8ef !important;
    padding: 14px 16px !important;
    display: flex !important;
    justify-content: space-between !important;
    gap: 14px !important;
    align-items: center !important;
}

.sr-badge-points-grid span {
    color: var(--muted) !important;
    font-weight: 900 !important;
    line-height: 1.35 !important;
}

.sr-badge-points-grid strong {
    color: var(--orange-dark) !important;
    font-weight: 950 !important;
    text-align: right !important;
}

.sr-badge-explain {
    margin: 22px 0 0 !important;
    padding: 20px 24px !important;
    border-radius: 20px !important;
    border: 1px solid var(--line) !important;
    background: #fff8ef !important;
    color: var(--muted) !important;
    font-weight: 850 !important;
    line-height: 1.75 !important;
}

@media (max-width: 1200px) {
    .sr-badge-points-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 980px) {
    .sr-badge-top {
        grid-template-columns: 1fr !important;
    }
}

@media (max-width: 650px) {
    .sr-badge-points-grid {
        grid-template-columns: 1fr !important;
    }

    .sr-badge-path-item {
        grid-template-columns: 46px 1fr !important;
    }

    .sr-badge-path-item em {
        grid-column: 1 / -1 !important;
        justify-self: start !important;
    }
}

/* BADGE FINAL - pagina stabile */
.badge-final-page {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 24px !important;
}

.badge-final-hero,
.badge-final-current,
.badge-final-next,
.badge-final-path,
.badge-final-points,
.badge-final-assigned {
    background: #fff !important;
    border: 1px solid var(--line) !important;
    border-radius: 30px !important;
    box-shadow: 0 14px 36px rgba(70, 38, 16, .10) !important;
}

.badge-final-hero {
    padding: 42px !important;
    background:
        radial-gradient(circle at 85% 20%, rgba(242, 138, 46, .18), transparent 25%),
        linear-gradient(135deg, #fff4e4, #fffaf3) !important;
}

.badge-final-hero h1 {
    margin: 0 !important;
    font-size: clamp(3rem, 6vw, 5.6rem) !important;
    line-height: .92 !important;
    letter-spacing: -.08em !important;
}

.badge-final-hero p {
    max-width: 850px !important;
    color: var(--muted) !important;
    font-weight: 800 !important;
    line-height: 1.7 !important;
}

.badge-final-top {
    display: grid !important;
    grid-template-columns: 360px 1fr !important;
    gap: 24px !important;
}

.badge-final-current,
.badge-final-next,
.badge-final-path,
.badge-final-points,
.badge-final-assigned {
    padding: 28px !important;
}

.badge-final-current {
    min-height: 300px !important;
    text-align: center !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    align-items: center !important;
}

.badge-final-medal {
    width: 112px !important;
    height: 112px !important;
    margin: 0 auto 16px !important;
    border-radius: 999px !important;
    display: grid !important;
    place-items: center !important;
    font-size: 3.8rem !important;
    background: #fff8ef !important;
    border: 5px solid rgba(255,255,255,.75) !important;
    box-shadow: inset 0 0 0 1px rgba(70,38,16,.08), 0 16px 34px rgba(70,38,16,.14) !important;
}

.badge-final-current p {
    margin: 0 0 18px !important;
    color: var(--muted) !important;
    font-weight: 900 !important;
}

.badge-final-current h2 {
    margin: 0 0 14px !important;
    font-size: 2.2rem !important;
    letter-spacing: -.06em !important;
}

.badge-final-current strong {
    background: #fff8ef !important;
    border-radius: 999px !important;
    padding: 10px 16px !important;
    font-weight: 950 !important;
}

.badge-final-next {
    min-height: 300px !important;
    display: block !important;
}

.badge-final-next .page-kicker {
    margin: 0 0 20px !important;
    letter-spacing: .18em !important;
    text-transform: uppercase !important;
}

.badge-final-next-title {
    display: flex !important;
    align-items: center !important;
    gap: 14px !important;
    margin: 0 0 28px !important;
}

.badge-final-next-title span {
    width: 56px !important;
    height: 56px !important;
    border-radius: 18px !important;
    display: grid !important;
    place-items: center !important;
    background: #fff8ef !important;
    border: 1px solid var(--line) !important;
    font-size: 1.8rem !important;
}

.badge-final-next-title h2 {
    margin: 0 !important;
    font-size: 1.95rem !important;
    letter-spacing: -.055em !important;
    line-height: 1 !important;
}

.badge-final-missing {
    margin: 0 0 18px !important;
    color: var(--muted) !important;
    font-weight: 950 !important;
}

.badge-final-missing strong {
    color: var(--ink) !important;
}

.badge-final-bar {
    height: 17px !important;
    border-radius: 999px !important;
    background: #f2e3d2 !important;
    border: 1px solid var(--line) !important;
    overflow: hidden !important;
}

.badge-final-bar div {
    height: 100% !important;
    border-radius: 999px !important;
    background: linear-gradient(135deg, #ffb55f, #e64a2a) !important;
}

.badge-final-labels {
    margin-top: 12px !important;
    display: flex !important;
    justify-content: space-between !important;
    color: var(--muted) !important;
    font-weight: 950 !important;
}

.badge-final-path h2,
.badge-final-points h2 {
    margin: 0 0 20px !important;
    font-size: 1.7rem !important;
    letter-spacing: -.055em !important;
}

.badge-final-path-list {
    display: grid !important;
    gap: 12px !important;
}

.badge-final-path-item {
    min-height: 80px !important;
    border-radius: 22px !important;
    border: 1px solid var(--line) !important;
    padding: 14px 16px !important;
    display: grid !important;
    grid-template-columns: 56px 1fr auto !important;
    gap: 16px !important;
    align-items: center !important;
    background: #fff8ef !important;
}

.badge-final-path-item > span {
    width: 46px !important;
    height: 46px !important;
    border-radius: 16px !important;
    background: #fff !important;
    display: grid !important;
    place-items: center !important;
    font-size: 1.55rem !important;
}

.badge-final-path-item strong,
.badge-final-path-item small {
    display: block !important;
}

.badge-final-path-item small {
    margin-top: 4px !important;
    color: var(--muted) !important;
    font-weight: 800 !important;
}

.badge-final-path-item em {
    font-style: normal !important;
    background: #fff !important;
    border-radius: 999px !important;
    padding: 8px 13px !important;
    font-weight: 950 !important;
    color: var(--muted) !important;
}

.badge-final-path-item.unlocked em {
    color: #167a32 !important;
}

.badge-final-path-item.current {
    background: linear-gradient(135deg, #fff2dc, #ffd39b) !important;
    border-color: #ff9d43 !important;
}

.badge-final-path-item.current em {
    color: var(--orange-dark) !important;
}

.badge-final-path-item.level-2 {
    background: linear-gradient(135deg, #ffe5c4, #ffb16d) !important;
}

.badge-final-path-item.level-3 {
    background: linear-gradient(135deg, #ffd9c7, #ec7b67) !important;
    color: #fff !important;
}

.badge-final-path-item.level-4 {
    background: linear-gradient(135deg, #d8f0da, #78aa82) !important;
    color: #fff !important;
}

.badge-final-path-item.level-5 {
    background: linear-gradient(135deg, #d7eef1, #6b9ca3) !important;
    color: #fff !important;
}

.badge-final-path-item.level-6 {
    background: linear-gradient(135deg, #ffeaa5, #d6a950) !important;
}

.badge-final-points-grid {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 12px !important;
}

.badge-final-points-grid div {
    min-height: 66px !important;
    border-radius: 18px !important;
    border: 1px solid var(--line) !important;
    background: #fff8ef !important;
    padding: 14px 16px !important;
    display: flex !important;
    justify-content: space-between !important;
    gap: 14px !important;
    align-items: center !important;
}

.badge-final-points-grid span {
    color: var(--muted) !important;
    font-weight: 900 !important;
    line-height: 1.35 !important;
}

.badge-final-points-grid strong {
    color: var(--orange-dark) !important;
    font-weight: 950 !important;
    text-align: right !important;
}

.badge-final-explain {
    margin: 22px 0 0 !important;
    padding: 20px 24px !important;
    border-radius: 20px !important;
    border: 1px solid var(--line) !important;
    background: #fff8ef !important;
    color: var(--muted) !important;
    font-weight: 850 !important;
    line-height: 1.75 !important;
}

@media (max-width: 1200px) {
    .badge-final-points-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 980px) {
    .badge-final-top {
        grid-template-columns: 1fr !important;
    }
}

@media (max-width: 650px) {
    .badge-final-points-grid {
        grid-template-columns: 1fr !important;
    }

    .badge-final-path-item {
        grid-template-columns: 46px 1fr !important;
    }

    .badge-final-path-item em {
        grid-column: 1 / -1 !important;
        justify-self: start !important;
    }
}

/* Dashboard recensioni */
.full-panel {
    margin-top: 24px;
}

.review-dashboard-list {
    display: grid;
    gap: 16px;
}

.review-dashboard-card {
    background: #fff8ef;
    border: 1px solid var(--line);
    border-radius: 24px;
    padding: 18px;
    display: grid;
    grid-template-columns: 1fr 220px;
    gap: 18px;
    align-items: start;
}

.review-dashboard-head {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    align-items: flex-start;
}

.review-dashboard-head strong,
.review-dashboard-head small {
    display: block;
}

.review-dashboard-head small {
    margin-top: 4px;
    color: var(--muted);
    font-weight: 800;
    line-height: 1.45;
}

.review-dashboard-card h3 {
    margin: 14px 0 0;
    font-size: 1.25rem;
    letter-spacing: -.04em;
}

.review-dashboard-card p {
    color: var(--muted);
    line-height: 1.7;
    font-weight: 750;
}

.dashboard-card-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 14px;
}

.review-dashboard-photos {
    display: grid;
    grid-template-columns: 1fr;
    gap: 8px;
}

.review-dashboard-photos img {
    width: 100%;
    height: 94px;
    object-fit: cover;
    border-radius: 16px;
    border: 1px solid var(--line);
    display: block;
}

@media (max-width: 850px) {
    .review-dashboard-card {
        grid-template-columns: 1fr;
    }

    .review-dashboard-photos {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 600px) {
    .review-dashboard-head {
        flex-direction: column;
    }

    .review-dashboard-photos {
        grid-template-columns: 1fr;
    }

    .review-dashboard-photos img {
        height: 180px;
    }
}

.profile-data-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
}

.profile-data-card {
    background: #fff8ef;
    border: 1px solid var(--line);
    border-radius: 20px;
    padding: 18px;
}

.profile-data-card span,
.profile-data-card strong {
    display: block;
}

.profile-data-card span {
    color: var(--muted);
    font-weight: 900;
    margin-bottom: 6px;
}

.profile-data-card strong {
    color: var(--ink);
    font-weight: 950;
    word-break: break-word;
}

@media (max-width: 980px) {
    .profile-data-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 600px) {
    .profile-data-grid {
        grid-template-columns: 1fr;
    }
}
