/**
 * REI Theme — Stili template interni
 *
 * Stilizza i template:
 *  - page.php (.rei-page)
 *  - single.php (.rei-single)
 *  - archive.php, archive-offerta.php, archive-magazine.php (.rei-archive)
 *
 * Tutti i template condividono lo stesso pattern di hero + body, coerente
 * con la home, usando le CSS vars del design system REI.
 *
 * @since 0.17.0
 */

/* ==========================================================================
   1. HERO COMUNE (page + single + archive)
   ========================================================================== */
.rei-page__hero,
.rei-single__hero,
.rei-archive__hero {
    text-align: center;
    padding: 70px 0;
    background: linear-gradient(110deg, var(--rei-green-light, #29D8A1) 0%, var(--rei-green, #20A47B) 70%);
    color: #fff;
}
.rei-page__hero-inner,
.rei-single__hero-inner,
.rei-archive__hero-inner {
    max-width: 820px;
    margin: 0 auto;
    position: relative;
    z-index: 2;
}

.rei-page__title,
.rei-archive__title {
    font-size: clamp( 2rem, 4.3vw, 3.4375rem );
    font-weight: 800;
    line-height: 1.12;
    letter-spacing: 0.01em;
    text-transform: uppercase;
    margin: 14px 0 18px;
    color: #fff;
}
.rei-single__title {
    font-size: clamp( 1.8rem, 3.6vw, 2.8rem );
    font-weight: 800;
    line-height: 1.15;
    letter-spacing: 0.01em;
    text-transform: uppercase;
    margin: 14px 0 18px;
    color: #fff;
}

.rei-page__lead,
.rei-single__lead,
.rei-archive__lead {
    font-size: 1.25rem;
    line-height: 1.55;
    color: #fff;
    margin: 0 0 20px;
    font-weight: 600;
}

/* ==========================================================================
   2. CONTENT BODY (page + single)
   ========================================================================== */
.rei-page__body,
.rei-single__body {
    padding-top: 50px;
    padding-bottom: 70px;
}
.rei-page__container,
.rei-single__container {
    max-width: 780px;
    margin: 0 auto;
}

.rei-page__thumb,
.rei-single__feature {
    margin: -100px 0 36px;
    border-radius: var(--rei-radius-2xl, 28px);
    overflow: hidden;
    box-shadow: var(--rei-shadow-xl, 0 30px 60px rgba(0,0,0,0.12));
    position: relative;
    z-index: 3;
}
.rei-page__thumb img,
.rei-single__feature img,
.rei-single__feature-img {
    width: 100%;
    height: auto;
    display: block;
}
.rei-single__feature .rei-container {
    max-width: 1080px;
}

/* === Typography del content === */
.rei-page__content,
.rei-single__content {
    font-size: 1.0625rem;
    line-height: 1.7;
    color: var(--rei-gray-text, #2c2c2c);
}
.rei-page__content > *,
.rei-single__content > * {
    margin: 0 0 1.4em;
}
.rei-page__content h2,
.rei-single__content h2 {
    font-size: 1.875rem;
    font-weight: 800;
    margin: 2em 0 0.6em;
    letter-spacing: -0.02em;
    color: var(--rei-green, #20A47B);
    text-transform: uppercase;
}
.rei-page__content h3,
.rei-single__content h3 {
    font-size: 1.375rem;
    font-weight: 700;
    margin: 1.8em 0 0.5em;
    color: var(--rei-green, #20A47B);
}
.rei-page__content h4,
.rei-single__content h4 {
    font-size: 1.125rem;
    font-weight: 700;
    margin: 1.6em 0 0.4em;
    color: var(--rei-green-dark, #157155);
}
.rei-page__content blockquote,
.rei-single__content blockquote {
    border-left: 4px solid var(--rei-green, #20A47B);
    padding: 14px 22px;
    margin: 1.8em 0;
    font-style: italic;
    font-size: 1.15rem;
    background: var(--rei-cream, #F4F8F6);
    border-radius: 0 12px 12px 0;
}
.rei-page__content blockquote p:last-child,
.rei-single__content blockquote p:last-child {
    margin-bottom: 0;
}
.rei-page__content ul,
.rei-page__content ol,
.rei-single__content ul,
.rei-single__content ol {
    padding-left: 1.4em;
}
.rei-page__content ul li,
.rei-page__content ol li,
.rei-single__content ul li,
.rei-single__content ol li {
    margin-bottom: 0.4em;
}
.rei-page__content img,
.rei-single__content img {
    border-radius: var(--rei-radius-lg, 16px);
    box-shadow: var(--rei-shadow-md, 0 8px 20px rgba(0,0,0,0.08));
    margin: 1.6em 0;
}
.rei-page__content a,
.rei-single__content a {
    color: var(--rei-green-deep, #157155);
    text-decoration: underline;
    text-decoration-thickness: 2px;
    text-underline-offset: 3px;
    transition: var(--rei-transition);
}
.rei-page__content a:hover,
.rei-single__content a:hover {
    color: var(--rei-green-dark, #157155);
}

.rei-page__content code,
.rei-single__content code {
    background: var(--rei-cream-dark, #E4F6F0);
    padding: 2px 8px;
    border-radius: 4px;
    font-size: 0.92em;
}
.rei-page__content pre,
.rei-single__content pre {
    background: var(--rei-ink, #3C3C3B);
    color: #eee;
    padding: 18px 22px;
    border-radius: 14px;
    overflow-x: auto;
    margin: 1.6em 0;
}
.rei-page__content pre code,
.rei-single__content pre code {
    background: transparent;
    color: inherit;
    padding: 0;
}

/* ==========================================================================
   3. SINGLE — meta, byline, tag, related
   ========================================================================== */
.rei-single__cat {
    display: inline-block;
    padding: 6px 14px;
    background: #fff;
    color: var(--rei-green, #20A47B);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.08em;
    border-radius: 999px;
    text-decoration: none;
    text-transform: uppercase;
}
.rei-single__cat:hover {
    background: var(--rei-green-dark, #157155);
    color: #fff;
}

.rei-single__meta {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    margin-top: 24px;
    font-size: 0.95rem;
    color: #fff;
}
.rei-single__hero .rei-single__author,
.rei-single__hero .rei-single__sep {
    color: #fff;
}
.rei-single__avatar img {
    border-radius: 50%;
    width: 40px;
    height: 40px;
    display: block;
}
.rei-single__byline {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}
.rei-single__author {
    font-weight: 600;
    color: var(--rei-ink, #3C3C3B);
}
.rei-single__sep {
    color: #bbb;
}

.rei-single__tags {
    margin-top: 36px;
    padding-top: 24px;
    border-top: 1px solid #D8E5DE;
    font-size: 0.95rem;
}
.rei-single__tags strong {
    margin-right: 10px;
}
.rei-single__tags a {
    display: inline-block;
    margin-right: 6px;
    padding: 4px 10px;
    background: var(--rei-cream, #F4F8F6);
    border-radius: 999px;
    font-size: 0.85rem;
    color: var(--rei-ink, #3C3C3B);
    text-decoration: none;
}
.rei-single__tags a:hover {
    background: var(--rei-yellow, #D1E000);
}

/* === Related articles === */
.rei-single__related {
    padding-top: 60px;
    padding-bottom: 60px;
}
.rei-single__related-title {
    text-align: center;
    font-size: 2rem;
    font-weight: 800;
    margin: 0 0 32px;
    letter-spacing: -0.02em;
}
.rei-single__related-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
}
.rei-single__related-card {
    display: flex;
    flex-direction: column;
    background: #fff;
    border: 2px solid var(--rei-green, #20A47B); /* v2.2: contorno verde su tutti i riquadri */
    border-radius: var(--rei-radius-lg, 16px);
    overflow: hidden;
    box-shadow: var(--rei-shadow-sm, 0 2px 8px rgba(0,0,0,0.06));
    text-decoration: none;
    color: inherit;
    transition: var(--rei-transition);
}
.rei-single__related-card:hover {
    transform: translateY(-4px);
    box-shadow: var(--rei-shadow-lg, 0 20px 40px rgba(0,0,0,0.12));
}
.rei-single__related-thumb img {
    width: 100%;
    aspect-ratio: 16 / 9;
    object-fit: cover;
}
.rei-single__related-body {
    padding: 18px 20px 22px;
}
.rei-single__related-body h3 {
    font-size: 1.0625rem;
    font-weight: 700;
    line-height: 1.3;
    margin: 0 0 10px;
    color: var(--rei-ink);
}
.rei-single__related-body time {
    font-size: 0.85rem;
    color: var(--rei-gray, #777);
}

/* ==========================================================================
   4. PAGE — children grid
   ========================================================================== */
.rei-page__children {
    margin-top: 60px;
    padding-top: 50px;
    border-top: 1px solid #D8E5DE;
}
.rei-page__children-title {
    font-size: 1.75rem;
    font-weight: 800;
    margin: 0 0 28px;
    text-align: center;
}
.rei-page__children-grid {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 18px;
}
.rei-page__child-card {
    display: block;
    padding: 24px 28px;
    background: #fff;
    border-radius: var(--rei-radius-lg, 16px);
    text-decoration: none;
    color: inherit;
    box-shadow: var(--rei-shadow-sm);
    border: 2px solid var(--rei-green, #20A47B); /* v2.2: contorno verde su tutti i riquadri */
    transition: var(--rei-transition);
    position: relative;
}
.rei-page__child-card:hover {
    transform: translateY(-3px);
    border-color: var(--rei-green, #20A47B);
    box-shadow: 0 12px 28px rgba(32,164,123, 0.18);
}
.rei-page__child-card h3 {
    font-size: 1.125rem;
    font-weight: 700;
    margin: 0 0 8px;
    color: var(--rei-ink);
}
.rei-page__child-card p {
    margin: 0;
    color: var(--rei-gray, #666);
    font-size: 0.95rem;
    line-height: 1.5;
}
.rei-page__child-arrow {
    position: absolute;
    top: 24px;
    right: 24px;
    color: var(--rei-green, #20A47B);
    font-size: 1.3rem;
    transition: transform 0.2s;
}
.rei-page__child-card:hover .rei-page__child-arrow {
    transform: translateX(4px);
}

/* ==========================================================================
   5. ARCHIVE — griglia generica
   ========================================================================== */
.rei-archive__body {
    padding-top: 50px;
    padding-bottom: 70px;
}

.rei-archive__filters {
    margin-top: 28px;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 8px;
}
.rei-archive__filter {
    padding: 8px 18px;
    background: #fff;
    border: 1px solid #CBDED5;
    border-radius: 999px;
    text-decoration: none;
    color: var(--rei-ink, #3C3C3B);
    font-size: 0.9rem;
    font-weight: 600;
    transition: var(--rei-transition);
}
.rei-archive__filter:hover,
.rei-archive__filter.is-active {
    background: var(--rei-green, #20A47B);
    border-color: var(--rei-green, #20A47B);
    color: #fff;
}

.rei-archive__grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 28px;
    margin-bottom: 50px;
}

.rei-archive__card {
    background: #fff;
    border: 2px solid var(--rei-green, #20A47B); /* v2.2: contorno verde su tutti i riquadri */
    border-radius: var(--rei-radius-lg, 16px);
    overflow: hidden;
    box-shadow: var(--rei-shadow-sm);
    transition: var(--rei-transition);
}
.rei-archive__card:hover {
    transform: translateY(-4px);
    box-shadow: var(--rei-shadow-lg, 0 20px 40px rgba(0,0,0,0.12));
}
.rei-archive__card-link {
    display: flex;
    flex-direction: column;
    text-decoration: none;
    color: inherit;
    height: 100%;
}
.rei-archive__card-thumb {
    aspect-ratio: 16 / 10;
    overflow: hidden;
    background: var(--rei-cream-dark, #E4F6F0);
}
.rei-archive__card-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.4s;
}
.rei-archive__card:hover .rei-archive__card-thumb img {
    transform: scale(1.05);
}
.rei-archive__card-thumb--placeholder {
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 3rem;
}
.rei-archive__card-body {
    padding: 20px 22px 24px;
    flex: 1;
    display: flex;
    flex-direction: column;
}
.rei-archive__card-cat {
    display: inline-block;
    font-size: 0.7rem;
    font-weight: 700;
    color: var(--rei-green-deep, #157155);
    letter-spacing: 0.08em;
    margin-bottom: 8px;
}
.rei-archive__card-title {
    font-size: 1.125rem;
    font-weight: 700;
    line-height: 1.3;
    margin: 0 0 10px;
    color: var(--rei-ink);
}
.rei-archive__card-excerpt {
    color: var(--rei-gray, #666);
    font-size: 0.95rem;
    line-height: 1.5;
    margin: 0 0 14px;
    flex: 1;
}
.rei-archive__card-meta {
    font-size: 0.85rem;
    color: var(--rei-gray, #777);
}

/* ==========================================================================
   6. (DEPRECATO) ARCHIVE MAGAZINE — variante card --mag
   Dalla v1.24.3 l'archivio Magazine usa il template archive-magazine.php
   con CSS dedicato in assets/css/archive-magazine.css (classi .rei-mag-card).
   Il blocco qui sotto è mantenuto per retro-compatibilità nel caso di
   override di terze parti.
   ========================================================================== */

.rei-archive__card--mag {
    background: #fff;
    text-align: center;
}
.rei-archive__card--mag .rei-archive__card-thumb {
    aspect-ratio: 16 / 10;
}
.rei-archive__card--mag .rei-archive__card-body {
    padding: 22px 24px 26px;
    text-align: center;
    align-items: center;
}
.rei-archive__card--mag .rei-archive__card-title {
    font-size: 1.05rem;
    font-weight: 800;
    color: var(--rei-green-deep, #20A47B);
    text-transform: uppercase;
    letter-spacing: 0.02em;
    line-height: 1.25;
    margin: 0 0 10px;
}
.rei-archive__card--mag .rei-archive__card-meta {
    font-size: 0.9rem;
    color: var(--rei-gray, #555);
    margin-bottom: 14px;
    text-align: center;
}
.rei-archive__card--mag .rei-archive__card-excerpt {
    color: var(--rei-gray, #555);
    font-size: 0.95rem;
    line-height: 1.55;
    margin: 0 0 18px;
    flex: 1;
}
.rei-archive__card--mag .rei-archive__card-cta {
    display: inline-block;
    color: var(--rei-green-deep, #20A47B);
    font-weight: 800;
    font-size: 1rem;
    letter-spacing: 0.02em;
    transition: color 0.2s ease;
    margin-top: auto;
}
.rei-archive__card--mag:hover .rei-archive__card-cta {
    color: #157155;
    text-decoration: underline;
}

/* ==========================================================================
   6b. (DEPRECATO) ARCHIVE MAGAZINE — featured article
   Mantenuto per retro-compatibilità (non più usato in archive-magazine.php
   dalla v1.24.1: vedi card --mag sopra).
   ========================================================================== */
.rei-magazine-featured {
    background: #fff;
    border: 2px solid var(--rei-green, #20A47B); /* v2.2: contorno verde su tutti i riquadri */
    border-radius: var(--rei-radius-2xl, 28px);
    overflow: hidden;
    box-shadow: var(--rei-shadow-xl);
    margin-bottom: 50px;
}
.rei-magazine-featured__link {
    display: grid;
    grid-template-columns: 1.2fr 1fr;
    text-decoration: none;
    color: inherit;
}
.rei-magazine-featured__thumb {
    aspect-ratio: 4 / 3;
    overflow: hidden;
    background: var(--rei-cream-dark);
}
.rei-magazine-featured__thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.5s;
}
.rei-magazine-featured:hover .rei-magazine-featured__thumb img {
    transform: scale(1.04);
}
.rei-magazine-featured__body {
    padding: 36px 40px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.rei-magazine-featured__cat {
    display: inline-block;
    font-size: 0.75rem;
    font-weight: 700;
    color: var(--rei-green-deep, #157155);
    letter-spacing: 0.1em;
    margin-bottom: 14px;
    text-transform: uppercase;
}
.rei-magazine-featured__title {
    font-size: clamp( 1.5rem, 2.4vw, 2rem );
    font-weight: 800;
    line-height: 1.15;
    margin: 0 0 14px;
    color: var(--rei-ink);
    letter-spacing: -0.02em;
}
.rei-magazine-featured__excerpt {
    color: var(--rei-gray, #555);
    font-size: 1rem;
    line-height: 1.55;
    margin: 0 0 18px;
}
.rei-magazine-featured__meta {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 0.85rem;
    color: var(--rei-gray, #777);
}

/* ==========================================================================
   7. ARCHIVE OFFERTE — card prezzo
   ========================================================================== */
.rei-archive__grid--offerte {
    grid-template-columns: repeat(2, 1fr);
}
.rei-offerta-card {
    background: #fff;
    border-radius: var(--rei-radius-2xl, 28px);
    padding: 32px 34px;
    box-shadow: var(--rei-shadow-md);
    display: flex;
    flex-direction: column;
    border: 2px solid var(--rei-green, #20A47B); /* v2.2: contorno verde su tutti i riquadri */
    transition: var(--rei-transition);
}
.rei-offerta-card:hover {
    transform: translateY(-4px);
    box-shadow: var(--rei-shadow-xl);
}
.rei-offerta-card--green,
.rei-offerta-card--red {
    border-color: var(--rei-green, #20A47B); /* v2.2: contorno verde pieno */
}
.rei-offerta-card__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 16px;
}
.rei-offerta-card__tipologia {
    font-size: 0.8rem;
    padding: 4px 12px;
    background: var(--rei-cream, #F4F8F6);
    border-radius: 999px;
    color: var(--rei-ink);
    font-weight: 600;
}
.rei-offerta-card__title {
    font-size: 1.5rem;
    font-weight: 800;
    margin: 0 0 18px;
    line-height: 1.15;
    letter-spacing: -0.02em;
}
.rei-offerta-card__title a {
    color: var(--rei-ink);
    text-decoration: none;
}
.rei-offerta-card__title a:hover {
    color: var(--rei-green-deep);
}
.rei-offerta-card__price {
    display: flex;
    align-items: baseline;
    gap: 8px;
    margin-bottom: 14px;
}
.rei-offerta-card__price-amount {
    font-size: 2.5rem;
    font-weight: 900;
    color: var(--rei-ink);
    letter-spacing: -0.03em;
    line-height: 1;
}
.rei-offerta-card--red .rei-offerta-card__price-amount {
    color: #157155;
}
.rei-offerta-card--green .rei-offerta-card__price-amount {
    color: var(--rei-green-deep, #157155);
}
.rei-offerta-card__price-unit {
    font-size: 1rem;
    color: var(--rei-gray, #666);
    font-weight: 600;
}
.rei-offerta-card__durata {
    background: var(--rei-cream, #F4F8F6);
    padding: 10px 14px;
    border-radius: 10px;
    margin: 0 0 18px;
    font-size: 0.95rem;
}
.rei-offerta-card__durata strong {
    display: block;
    font-size: 0.8rem;
    color: var(--rei-gray, #555);
    margin-bottom: 2px;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}
.rei-offerta-card__vantaggi {
    list-style: none;
    padding: 0;
    margin: 0 0 22px;
    flex: 1;
}
.rei-offerta-card__vantaggi li {
    padding: 4px 0 4px 26px;
    position: relative;
    font-size: 0.95rem;
    color: var(--rei-ink);
}
.rei-offerta-card__vantaggi li::before {
    content: "✓";
    position: absolute;
    left: 0;
    top: 4px;
    color: var(--rei-green, #20A47B);
    font-weight: 700;
}
.rei-offerta-card--red .rei-offerta-card__vantaggi li::before {
    color: #157155;
}
.rei-offerta-card__cta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
}
.rei-offerta-card__arera {
    font-size: 0.75rem;
    color: var(--rei-gray, #888);
}
.rei-offerta-card__arera code {
    background: var(--rei-cream-dark, #E4F6F0);
    padding: 1px 8px;
    border-radius: 4px;
    font-family: monospace;
}

/* ==========================================================================
   8. PAGINAZIONE
   ========================================================================== */
.rei-archive__pagination .nav-links,
.rei-archive__pagination {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    margin-top: 40px;
    flex-wrap: wrap;
}
.rei-archive__pagination .page-numbers {
    padding: 10px 16px;
    border: 1px solid #CBDED5;
    border-radius: 8px;
    background: #fff;
    color: var(--rei-ink);
    font-weight: 600;
    text-decoration: none;
    transition: var(--rei-transition);
    min-width: 44px;
    text-align: center;
}
.rei-archive__pagination .page-numbers:hover,
.rei-archive__pagination .page-numbers.current {
    background: var(--rei-green, #20A47B);
    border-color: var(--rei-green, #20A47B);
    color: #fff;
}

/* ==========================================================================
   9. EMPTY STATE
   ========================================================================== */
.rei-archive__empty {
    text-align: center;
    padding: 80px 20px;
    color: var(--rei-gray, #777);
}
.rei-archive__empty h2 {
    font-size: 1.5rem;
    margin: 0 0 10px;
    color: var(--rei-ink);
}
.rei-archive__empty p {
    margin: 0;
    font-size: 1.05rem;
}

/* ==========================================================================
   10. RESPONSIVE
   ========================================================================== */
@media (max-width: 960px) {
    .rei-archive__grid,
    .rei-single__related-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    .rei-archive__grid--offerte {
        grid-template-columns: 1fr;
    }
    .rei-magazine-featured__link {
        grid-template-columns: 1fr;
    }
    .rei-magazine-featured__thumb {
        aspect-ratio: 16 / 9;
    }
}

@media (max-width: 768px) {
    .rei-page__hero,
    .rei-single__hero,
    .rei-archive__hero {
        padding: 50px 0 36px;
    }
    .rei-page__body,
    .rei-single__body,
    .rei-archive__body {
        padding-top: 30px;
        padding-bottom: 40px;
    }
    .rei-archive__grid,
    .rei-single__related-grid {
        grid-template-columns: 1fr;
        gap: 20px;
    }
    .rei-page__children-grid {
        grid-template-columns: 1fr;
    }
    .rei-page__thumb,
    .rei-single__feature {
        margin-top: -50px;
        border-radius: var(--rei-radius-lg, 16px);
    }
    .rei-offerta-card {
        padding: 24px 22px;
    }
    .rei-offerta-card__price-amount {
        font-size: 2rem;
    }
    .rei-magazine-featured__body {
        padding: 24px 22px 28px;
    }
    .rei-page__content,
    .rei-single__content {
        font-size: 1rem;
    }
    .rei-page__content h2,
    .rei-single__content h2 {
        font-size: 1.5rem;
    }
    .rei-page__content h3,
    .rei-single__content h3 {
        font-size: 1.2rem;
    }
}

/* ==========================================================================
   11. BLOCK PATTERN — Hero pagina interna (minimal editabile)
   v0.17.3: Stile minimal con tutti i blocchi editabili (no più span/pillole HTML).
   Tipografia coerente con la home ma senza decorazioni che richiedano markup
   custom non editabile dall'utente.
   ========================================================================== */
.rei-pattern-hero {
    padding: 60px 0 50px;
    position: relative;
    overflow: hidden;
}
.rei-pattern-hero .wp-block-columns,
.rei-pattern-hero__columns {
    align-items: center;
    gap: 50px;
}
/* Eyebrow: verde, uppercase, letter-spacing largo, piccolo */
.rei-pattern-hero__eyebrow {
    font-size: 13px !important;
    font-weight: 700 !important;
    letter-spacing: 0.1em !important;
    text-transform: uppercase !important;
    color: var(--rei-green-deep, #157155) !important;
    margin: 0 0 16px !important;
    line-height: 1.3 !important;
}
/* Titolo: grande, bold, leading stretto */
.rei-pattern-hero__title {
    font-size: clamp( 2.5rem, 5vw, 4.5rem ) !important;
    font-weight: 900 !important;
    line-height: 1.05 !important;
    letter-spacing: -0.025em !important;
    margin: 0 0 22px !important;
    color: var(--rei-ink, #3C3C3B) !important;
}
/* Sottotitolo */
.rei-pattern-hero__sub {
    font-size: 1.25rem !important;
    line-height: 1.5 !important;
    color: var(--rei-ink-soft, #4a4a4a) !important;
    margin: 0 0 28px !important;
}
/* Bottoni CTA */
.rei-pattern-hero__cta {
    margin-bottom: 22px !important;
    gap: 14px !important;
}
.rei-pattern-hero__cta .wp-block-button .wp-block-button__link {
    padding: 16px 28px;
    font-weight: 700;
    font-size: 1.05rem;
    border-radius: 999px;
    border: 2px solid transparent;
    transition: var(--rei-transition);
}
/* Bottone primario verde pieno */
.rei-pattern-hero__btn--primary .wp-block-button__link {
    background: var(--rei-green, #20A47B);
    color: #fff;
    border-color: var(--rei-green, #20A47B);
}
.rei-pattern-hero__btn--primary .wp-block-button__link:hover {
    background: var(--rei-green-deep, #157155);
    border-color: var(--rei-green-deep, #157155);
    transform: translateY(-2px);
}
/* Bottone secondario outline scuro */
.rei-pattern-hero__btn--secondary .wp-block-button__link {
    background: transparent;
    color: var(--rei-ink, #3C3C3B);
    border-color: var(--rei-ink, #3C3C3B);
}
.rei-pattern-hero__btn--secondary .wp-block-button__link:hover {
    background: var(--rei-ink, #3C3C3B);
    color: #fff;
    transform: translateY(-2px);
}
/* Trust line */
.rei-pattern-hero__trust {
    font-size: 0.95rem !important;
    color: var(--rei-green-deep, #157155) !important;
    margin: 0 !important;
}
/* Foto */
.rei-pattern-hero__photo img {
    border-radius: var(--rei-radius-2xl, 28px);
    box-shadow: var(--rei-shadow-xl, 0 30px 60px rgba(0,0,0,0.12));
    width: 100%;
    height: auto;
    display: block;
}

@media (max-width: 768px) {
    .rei-pattern-hero {
        padding: 40px 0 36px;
    }
    .rei-pattern-hero .wp-block-columns,
    .rei-pattern-hero__columns {
        gap: 28px;
    }
    .rei-pattern-hero__title {
        font-size: clamp( 2rem, 6vw, 2.8rem ) !important;
    }
    .rei-pattern-hero__sub {
        font-size: 1.05rem !important;
    }
    .rei-pattern-hero__cta {
        flex-direction: column;
    }
    .rei-pattern-hero__cta .wp-block-button {
        width: 100%;
    }
    .rei-pattern-hero__cta .wp-block-button .wp-block-button__link {
        width: 100%;
        text-align: center;
    }
}


/* ==========================================================================
   v0.18.0 — PATTERN COMUNI
   Stili condivisi tra più pattern (eyebrow, section title)
   ========================================================================== */
.rei-pattern-eyebrow {
    font-size: 13px !important;
    font-weight: 700 !important;
    letter-spacing: 0.1em !important;
    text-transform: uppercase !important;
    color: var(--rei-green-deep, #157155) !important;
    margin: 0 0 14px !important;
    line-height: 1.3 !important;
}
.rei-pattern-section-title {
    font-size: clamp( 2rem, 4vw, 3rem ) !important;
    font-weight: 900 !important;
    line-height: 1.1 !important;
    letter-spacing: -0.025em !important;
    margin: 0 0 40px !important;
    color: var(--rei-ink, #3C3C3B) !important;
}

/* ==========================================================================
   v0.18.0 — PATTERN 5: Mini Hero
   ========================================================================== */
.rei-pattern-minihero {
    padding: 70px 0 60px;
    text-align: center;
}
.rei-pattern-minihero__eyebrow {
    font-size: 13px !important;
    font-weight: 700 !important;
    letter-spacing: 0.1em !important;
    text-transform: uppercase !important;
    color: var(--rei-green-deep, #157155) !important;
    margin: 0 0 16px !important;
}
.rei-pattern-minihero__title {
    font-size: clamp( 2.5rem, 5vw, 4rem ) !important;
    font-weight: 900 !important;
    line-height: 1.05 !important;
    letter-spacing: -0.025em !important;
    margin: 0 0 20px !important;
    color: var(--rei-ink, #3C3C3B) !important;
}
.rei-pattern-minihero__sub {
    font-size: 1.2rem !important;
    line-height: 1.55 !important;
    color: var(--rei-ink-soft, #4a4a4a) !important;
    margin: 0 auto 28px !important;
    max-width: 620px;
}
.rei-pattern-minihero__cta {
    justify-content: center !important;
    gap: 14px !important;
}

/* ==========================================================================
   v0.18.0 — PATTERN 6: Servizi grid
   ========================================================================== */
.rei-pattern-servizi {
    padding: 70px 0;
    text-align: center;
}
.rei-pattern-servizi__grid {
    margin-top: 20px;
    gap: 24px !important;
}
.rei-pattern-servizi__card {
    background: #fff;
    border-radius: var(--rei-radius-lg, 16px);
    padding: 32px 22px !important;
    box-shadow: var(--rei-shadow-md, 0 8px 20px rgba(0,0,0,0.06));
    text-align: center;
    transition: var(--rei-transition);
    border: 2px solid var(--rei-green, #20A47B); /* v2.2: contorno verde su tutti i riquadri */
}
.rei-pattern-servizi__card:hover {
    transform: translateY(-4px);
    box-shadow: var(--rei-shadow-xl, 0 20px 40px rgba(0,0,0,0.12));
}
.rei-pattern-servizi__icon {
    font-size: 2.5rem !important;
    margin: 0 0 14px !important;
    line-height: 1 !important;
}
.rei-pattern-servizi__title {
    font-size: 1.2rem !important;
    font-weight: 800 !important;
    margin: 0 0 10px !important;
    color: var(--rei-ink, #3C3C3B) !important;
    letter-spacing: -0.01em !important;
}
.rei-pattern-servizi__desc {
    font-size: 0.95rem !important;
    line-height: 1.5 !important;
    color: var(--rei-gray, #6c6c6c) !important;
    margin: 0 !important;
}

/* ==========================================================================
   v0.18.0 — PATTERN 7: CTA banner finale
   ========================================================================== */
.rei-pattern-cta-banner {
    background: linear-gradient(135deg, var(--rei-green, #20A47B), var(--rei-green-deep, #157155)) !important;
    padding: 70px 24px;
    text-align: center;
    color: #fff;
}
.rei-pattern-cta-banner__title {
    font-size: clamp( 2.25rem, 4.5vw, 3.5rem ) !important;
    font-weight: 900 !important;
    line-height: 1.1 !important;
    letter-spacing: -0.025em !important;
    color: #fff !important;
    margin: 0 auto 18px !important;
    max-width: 720px;
}
.rei-pattern-cta-banner__sub {
    font-size: 1.15rem !important;
    line-height: 1.55 !important;
    color: rgba(255,255,255,0.92) !important;
    margin: 0 auto 32px !important;
    max-width: 580px;
}
.rei-pattern-cta-banner__cta {
    justify-content: center !important;
    gap: 14px !important;
}
.rei-pattern-cta-banner__btn .wp-block-button__link {
    padding: 16px 32px;
    font-weight: 700;
    font-size: 1.05rem;
    border-radius: 999px;
    border: 2px solid transparent;
    transition: var(--rei-transition);
}
.rei-pattern-cta-banner__btn--white .wp-block-button__link {
    background: #fff;
    color: var(--rei-green-deep, #157155);
    border-color: #fff;
}
.rei-pattern-cta-banner__btn--white .wp-block-button__link:hover {
    background: var(--rei-cream, #F4F8F6);
    transform: translateY(-2px);
}
.rei-pattern-cta-banner__btn--ghost .wp-block-button__link {
    background: transparent;
    color: #fff;
    border-color: rgba(255,255,255,0.6);
}
.rei-pattern-cta-banner__btn--ghost .wp-block-button__link:hover {
    background: rgba(255,255,255,0.1);
    border-color: #fff;
    transform: translateY(-2px);
}

/* ==========================================================================
   v0.18.0 — PATTERN 8: Magazine 3 articoli
   ========================================================================== */
.rei-pattern-magazine {
    padding: 70px 0;
    text-align: center;
}
.rei-pattern-magazine__grid {
    margin-top: 20px;
    gap: 24px !important;
}
.rei-pattern-magazine__card {
    background: #fff !important;
    border: 2px solid var(--rei-green, #20A47B); /* v2.2: contorno verde su tutti i riquadri */
    border-radius: var(--rei-radius-lg, 16px) !important;
    overflow: hidden;
    padding: 0 !important;
    box-shadow: var(--rei-shadow-md);
    text-align: left;
    transition: var(--rei-transition);
}
.rei-pattern-magazine__card:hover {
    transform: translateY(-4px);
    box-shadow: var(--rei-shadow-xl);
}
.rei-pattern-magazine__thumb {
    margin: 0 !important;
    aspect-ratio: 16 / 10;
    overflow: hidden;
    background: var(--rei-cream-dark, #E4F6F0);
}
.rei-pattern-magazine__thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.rei-pattern-magazine__cat {
    font-size: 11px !important;
    font-weight: 700 !important;
    letter-spacing: 0.1em !important;
    color: var(--rei-green-deep, #157155) !important;
    margin: 18px 22px 8px !important;
    text-transform: uppercase !important;
}
.rei-pattern-magazine__title {
    font-size: 1.15rem !important;
    font-weight: 800 !important;
    line-height: 1.3 !important;
    margin: 0 22px 8px !important;
    color: var(--rei-ink, #3C3C3B) !important;
    letter-spacing: -0.01em !important;
}
.rei-pattern-magazine__excerpt {
    font-size: 0.95rem !important;
    line-height: 1.5 !important;
    color: var(--rei-gray, #6c6c6c) !important;
    margin: 0 22px 22px !important;
}

/* ==========================================================================
   v0.18.0 — PATTERN 9: Sezione Offerta
   ========================================================================== */
.rei-pattern-offerta {
    padding: 70px 0;
}
.rei-pattern-offerta__columns {
    align-items: center;
    gap: 50px !important;
}
.rei-pattern-offerta__eyebrow {
    font-size: 13px !important;
    font-weight: 700 !important;
    letter-spacing: 0.1em !important;
    text-transform: uppercase !important;
    color: #157155 !important; /* rosso per offerte gas, cambiabile */
    margin: 0 0 14px !important;
}
.rei-pattern-offerta__title {
    font-size: clamp( 2rem, 4vw, 3rem ) !important;
    font-weight: 900 !important;
    line-height: 1.1 !important;
    letter-spacing: -0.025em !important;
    margin: 0 0 16px !important;
    color: var(--rei-ink, #3C3C3B) !important;
}
.rei-pattern-offerta__sub {
    font-size: 1.15rem !important;
    line-height: 1.55 !important;
    color: var(--rei-ink-soft, #4a4a4a) !important;
    margin: 0 0 24px !important;
}
.rei-pattern-offerta__prezzi {
    margin-bottom: 28px !important;
    gap: 14px !important;
}
.rei-pattern-offerta__prezzo {
    background: #fff !important;
    border-radius: 14px;
    padding: 18px 20px !important;
    border: 1px solid #DCE8E2;
}
.rei-pattern-offerta__prezzo-label {
    font-size: 0.78rem !important;
    text-transform: uppercase !important;
    letter-spacing: 0.06em !important;
    color: var(--rei-gray, #777) !important;
    margin: 0 0 6px !important;
    font-weight: 600 !important;
}
.rei-pattern-offerta__prezzo-amount {
    font-size: 1.6rem !important;
    font-weight: 900 !important;
    color: var(--rei-ink, #3C3C3B) !important;
    margin: 0 !important;
    letter-spacing: -0.02em !important;
}
.rei-pattern-offerta__cta {
    gap: 14px !important;
}
.rei-pattern-offerta__photo img {
    border-radius: var(--rei-radius-2xl, 28px);
    box-shadow: var(--rei-shadow-xl);
    width: 100%;
    height: auto;
}

/* ==========================================================================
   v0.18.0 — PATTERN 10: Sezione Chiamate (testo+lista+foto)
   ========================================================================== */
.rei-pattern-chiamate {
    padding: 70px 0;
}
.rei-pattern-chiamate__eyebrow {
    font-size: 13px !important;
    font-weight: 700 !important;
    letter-spacing: 0.1em !important;
    text-transform: uppercase !important;
    color: var(--rei-green-deep, #157155) !important;
    margin: 0 0 14px !important;
}
.rei-pattern-chiamate__title {
    font-size: clamp( 2rem, 4vw, 3rem ) !important;
    font-weight: 900 !important;
    line-height: 1.1 !important;
    letter-spacing: -0.025em !important;
    margin: 0 0 16px !important;
    color: var(--rei-ink, #3C3C3B) !important;
}
.rei-pattern-chiamate__sub {
    font-size: 1.15rem !important;
    line-height: 1.55 !important;
    color: var(--rei-ink-soft, #4a4a4a) !important;
    margin: 0 0 24px !important;
}
.rei-pattern-chiamate__list {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
}
.rei-pattern-chiamate__list li {
    position: relative;
    padding: 8px 0 8px 32px !important;
    font-size: 1rem !important;
    color: var(--rei-ink, #3C3C3B) !important;
    line-height: 1.5;
}
.rei-pattern-chiamate__list li::before {
    content: "✓";
    position: absolute;
    left: 0;
    top: 6px;
    width: 22px;
    height: 22px;
    background: var(--rei-green, #20A47B);
    color: #fff;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 13px;
}
.rei-pattern-chiamate__photo img {
    border-radius: var(--rei-radius-2xl, 28px);
    box-shadow: var(--rei-shadow-xl);
    width: 100%;
    height: auto;
}

/* ==========================================================================
   v0.18.0 — PATTERN 11: Sezione App (dark)
   ========================================================================== */
.rei-pattern-app {
    background: var(--rei-ink, #3C3C3B) !important;
    color: #fff !important;
    padding: 70px 0;
}
.rei-pattern-app__phone img {
    width: 100%;
    height: auto;
    max-width: 360px;
    margin: 0 auto;
    display: block;
    filter: drop-shadow(0 30px 60px rgba(32,164,123, 0.25));
}
.rei-pattern-app__eyebrow {
    font-size: 13px !important;
    font-weight: 700 !important;
    letter-spacing: 0.1em !important;
    text-transform: uppercase !important;
    color: var(--rei-green, #20A47B) !important;
    margin: 0 0 14px !important;
}
.rei-pattern-app__title {
    font-size: clamp( 2.25rem, 4.5vw, 3.5rem ) !important;
    font-weight: 900 !important;
    line-height: 1.05 !important;
    letter-spacing: -0.025em !important;
    color: #fff !important;
    margin: 0 0 18px !important;
}
.rei-pattern-app__sub {
    font-size: 1.15rem !important;
    line-height: 1.55 !important;
    color: rgba(255,255,255,0.85) !important;
    margin: 0 0 28px !important;
}
.rei-pattern-app__stores {
    gap: 14px !important;
}
.rei-pattern-app__store .wp-block-button__link {
    padding: 14px 26px;
    font-weight: 700;
    font-size: 1rem;
    border-radius: 14px;
    border: 1px solid transparent;
    background: #fff;
    color: var(--rei-ink, #3C3C3B);
    transition: var(--rei-transition);
}
.rei-pattern-app__store .wp-block-button__link:hover {
    transform: translateY(-2px);
    box-shadow: 0 10px 20px rgba(32,164,123, 0.3);
}

/* ==========================================================================
   v0.18.0 — PATTERN 12: Testimonianze
   ========================================================================== */
.rei-pattern-testimonianze {
    padding: 70px 0;
    text-align: center;
}
.rei-pattern-testimonianze__grid {
    margin-top: 20px;
    gap: 24px !important;
}
.rei-pattern-testimonianze__card {
    background: #fff !important;
    border-radius: var(--rei-radius-lg, 16px) !important;
    padding: 28px 26px !important;
    text-align: left;
    box-shadow: var(--rei-shadow-md);
    border: 2px solid var(--rei-green, #20A47B); /* v2.2: contorno verde su tutti i riquadri */
}
.rei-pattern-testimonianze__stars {
    font-size: 1.2rem !important;
    color: #D1E000 !important;
    letter-spacing: 0.15em !important;
    margin: 0 0 14px !important;
    line-height: 1 !important;
}
.rei-pattern-testimonianze__quote {
    font-size: 1.05rem !important;
    line-height: 1.55 !important;
    color: var(--rei-ink, #3C3C3B) !important;
    margin: 0 0 20px !important;
    font-style: italic;
}
.rei-pattern-testimonianze__author {
    font-size: 0.92rem !important;
    line-height: 1.4 !important;
    color: var(--rei-gray, #6c6c6c) !important;
    margin: 0 !important;
}
.rei-pattern-testimonianze__author strong {
    color: var(--rei-ink, #3C3C3B);
    font-weight: 700;
}

/* ==========================================================================
   v0.18.0 — RESPONSIVE per tutti i pattern nuovi
   ========================================================================== */
@media (max-width: 768px) {
    .rei-pattern-minihero,
    .rei-pattern-servizi,
    .rei-pattern-magazine,
    .rei-pattern-offerta,
    .rei-pattern-chiamate,
    .rei-pattern-app,
    .rei-pattern-testimonianze {
        padding: 44px 0;
    }
    .rei-pattern-cta-banner {
        padding: 50px 20px;
    }
    .rei-pattern-section-title {
        font-size: clamp( 1.6rem, 6vw, 2.2rem ) !important;
        margin-bottom: 28px !important;
    }
    .rei-pattern-minihero__title,
    .rei-pattern-offerta__title,
    .rei-pattern-chiamate__title,
    .rei-pattern-app__title,
    .rei-pattern-cta-banner__title {
        font-size: clamp( 1.75rem, 6vw, 2.4rem ) !important;
    }
    .rei-pattern-minihero__cta,
    .rei-pattern-cta-banner__cta,
    .rei-pattern-offerta__cta,
    .rei-pattern-app__stores {
        flex-direction: column;
    }
    .rei-pattern-minihero__cta .wp-block-button,
    .rei-pattern-cta-banner__cta .wp-block-button,
    .rei-pattern-offerta__cta .wp-block-button,
    .rei-pattern-app__stores .wp-block-button {
        width: 100%;
    }
    .rei-pattern-minihero__cta .wp-block-button__link,
    .rei-pattern-cta-banner__cta .wp-block-button__link,
    .rei-pattern-offerta__cta .wp-block-button__link,
    .rei-pattern-app__stores .wp-block-button__link {
        width: 100%;
        text-align: center;
    }
}

/* ==========================================================================
   FACILE.ENERGY — FASCIA HERO COMUNE (.fe-page-hero)
   Banda gradiente #29D8A1 → #20A47B applicata agli hero di TUTTE le pagine
   statiche (spec §6). I template REI mantengono i propri theme_mod di
   titolo/sottotitolo: qui si uniforma solo la veste grafica.
   ========================================================================== */
.fe-page-hero {
    background: linear-gradient(110deg, var(--rei-green-light, #29D8A1) 0%, var(--rei-green, #20A47B) 70%) !important;
    padding: 70px 0 !important;
    position: relative;
    z-index: 1;
    overflow: hidden;
    color: #fff;
}
.fe-page-hero h1,
.fe-page-hero h1 span,
.fe-page-hero h1 strong {
    color: #fff !important;
    -webkit-text-fill-color: #fff;
}
.fe-page-hero h1 {
    text-transform: uppercase !important;
    font-weight: 800 !important;
    font-size: clamp(1.9rem, 4.3vw, 3.4375rem) !important; /* ~55px desktop */
    line-height: 1.12 !important;
    letter-spacing: 0.01em !important;
    margin: 0 0 18px !important;
    text-shadow: 0 2px 12px rgba(0, 0, 0, 0.12);
}
/* Neutralizza le "sottolineature evidenziatore" REI dentro la banda */
.fe-page-hero .rei-underline,
.fe-page-hero .rei-underline.is-visible,
.fe-page-hero .rei-underline--yellow,
.fe-page-hero .rei-underline--green,
.fe-page-hero .rei-underline--red {
    background: transparent !important;
    background-image: none !important;
}
/* Eyebrow / chip / categoria: ovale BIANCO pieno con testo VERDE.
   Fix v1.2.6 — "parole nell'ovale": il chip sopra il titolo (es.
   .rei-single__cat negli articoli) restava con testo BIANCO su ovale
   BIANCO perché ".fe-page-hero a { color:#fff !important }" batteva il
   colore verde del link-pillola. Qui si forza il verde #20A47B su
   TUTTE le varianti (eyebrow, chip, cat/category), con specificità e
   posizione in cascata superiori alla regola sui link. */
.fe-page-hero [class*="__eyebrow"],
.fe-page-hero [class*="__chip"],
.fe-page-hero [class*="__cat"],
.fe-page-hero [class*="__category"],
.fe-page-hero .rei-eyebrow,
.fe-page-hero .rei-single__cat {
    display: inline-block;
    background: #fff !important;
    border: 1px solid #fff !important;
    color: var(--rei-green, #20A47B) !important;
    -webkit-text-fill-color: var(--rei-green, #20A47B);
    text-transform: uppercase !important;
    letter-spacing: 0.08em !important;
    font-weight: 700 !important;
    border-radius: 999px;
    text-decoration: none !important;
}
/* Il generico .rei-eyebrow non ha padding proprio: da pillola ne serve uno */
.fe-page-hero .rei-eyebrow { padding: 6px 16px; }
/* Chip-link (es. categoria articolo): hover invertito, verde scuro + bianco */
.fe-page-hero a[class*="__eyebrow"]:hover,
.fe-page-hero a[class*="__chip"]:hover,
.fe-page-hero a[class*="__cat"]:hover,
.fe-page-hero a[class*="__category"]:hover,
.fe-page-hero a.rei-single__cat:hover {
    background: var(--rei-green-dark, #157155) !important;
    border-color: var(--rei-green-dark, #157155) !important;
    color: #fff !important;
    -webkit-text-fill-color: #fff;
}
/* Sottotitolo / intro / lead: bianco ~26px con grassetti bianchi */
.fe-page-hero p,
.fe-page-hero [class*="__intro"],
.fe-page-hero [class*="__lead"],
.fe-page-hero [class*="__sub"] {
    color: #fff !important;
}
.fe-page-hero [class*="__intro"],
.fe-page-hero [class*="__lead"] {
    font-size: clamp(1.05rem, 1.8vw, 1.375rem) !important;
    line-height: 1.55 !important;
    font-weight: 500;
}
.fe-page-hero [class*="__intro"] strong,
.fe-page-hero [class*="__lead"] strong,
.fe-page-hero [class*="__intro"] em,
.fe-page-hero [class*="__lead"] em {
    color: #fff !important;
    font-weight: 800;
}
.fe-page-hero a {
    color: #fff !important;
    text-decoration: underline;
}
/* Bottoni/CTA dentro la banda: bianchi con testo verde scuro */
.fe-page-hero a[class*="btn"],
.fe-page-hero a[class*="cta"],
.fe-page-hero button[class*="btn"],
.fe-page-hero button[class*="cta"] {
    background: #fff !important;
    color: var(--rei-green-dark, #157155) !important;
    border-color: #fff !important;
    text-decoration: none !important;
}
/* Badge/step/icone tonde dentro l'hero: bordo bianco */
.fe-page-hero [class*="__hero-icon"] {
    background: rgba(255, 255, 255, 0.18) !important;
    border: 2px solid rgba(255, 255, 255, 0.65);
    box-shadow: none !important;
}
/* Filtri (listing Magazine/Comunicazioni) dentro la banda */
.fe-page-hero [class*="__filter"] {
    background: rgba(255, 255, 255, 0.12) !important;
    border: 1px solid rgba(255, 255, 255, 0.45) !important;
    color: #fff !important;
    text-decoration: none;
}
.fe-page-hero [class*="__filter"]:hover,
.fe-page-hero [class*="__filter"].is-active {
    background: #fff !important;
    color: var(--rei-green-dark, #157155) !important;
}
@media (max-width: 768px) {
    .fe-page-hero {
        padding: 48px 0 !important;
    }
}

/* ==========================================================================
   FIX "BOX CHIARI CON TESTO BIANCO" DENTRO LA FASCIA HERO
   Le card intro (.rei-*__intro) hanno sfondo CHIARO (gradiente mint
   #E4F6F0 → #D2F0E6, o bianco per .rei-acc__intro) ma stanno DENTRO
   .fe-page-hero, dove ".fe-page-hero p / [class*='__intro'] / a
   { color:#fff !important }" forzava il testo BIANCO → quasi invisibile
   su fondo chiaro (es. /attiva/: "Carica la tua bolletta o inserisci i
   dati."). Qui si forza il VERDE SCURO #157155 con specificità (0,2,1)
   superiore alle regole generiche (0,1,1)/(0,2,0) e posizione in cascata
   successiva. I box scuri/verdi pieni e i bottoni NON sono toccati.
   (.rei-cand__intro ha già il proprio fix in page-candidatura.css.)
   ========================================================================== */
.fe-page-hero .rei-attiva__intro,
.fe-page-hero .rei-pi__intro,
.fe-page-hero .rei-cmor__intro,
.fe-page-hero .rei-meteo__intro,
.fe-page-hero .rei-ass__intro,
.fe-page-hero .rei-con__intro,
.fe-page-hero .rei-acc__intro,
.fe-page-hero .rei-attiva__intro p,
.fe-page-hero .rei-pi__intro p,
.fe-page-hero .rei-cmor__intro p,
.fe-page-hero .rei-meteo__intro p,
.fe-page-hero .rei-ass__intro p,
.fe-page-hero .rei-con__intro p,
.fe-page-hero .rei-acc__intro p,
.fe-page-hero .rei-attiva__intro li,
.fe-page-hero .rei-pi__intro li,
.fe-page-hero .rei-cmor__intro li,
.fe-page-hero .rei-meteo__intro li,
.fe-page-hero .rei-ass__intro li,
.fe-page-hero .rei-con__intro li,
.fe-page-hero .rei-acc__intro li,
.fe-page-hero .rei-attiva__intro em,
.fe-page-hero .rei-pi__intro em,
.fe-page-hero .rei-cmor__intro em,
.fe-page-hero .rei-meteo__intro em,
.fe-page-hero .rei-ass__intro em,
.fe-page-hero .rei-con__intro em,
.fe-page-hero .rei-acc__intro em {
    color: var(--rei-green-dark, #157155) !important;
    -webkit-text-fill-color: var(--rei-green-dark, #157155);
}
/* Grassetti dentro le card chiare: verde scuro, peso invariato */
.fe-page-hero .rei-attiva__intro strong,
.fe-page-hero .rei-pi__intro strong,
.fe-page-hero .rei-cmor__intro strong,
.fe-page-hero .rei-meteo__intro strong,
.fe-page-hero .rei-ass__intro strong,
.fe-page-hero .rei-con__intro strong,
.fe-page-hero .rei-acc__intro strong,
.fe-page-hero .rei-attiva__intro b,
.fe-page-hero .rei-pi__intro b,
.fe-page-hero .rei-cmor__intro b,
.fe-page-hero .rei-meteo__intro b,
.fe-page-hero .rei-ass__intro b,
.fe-page-hero .rei-con__intro b,
.fe-page-hero .rei-acc__intro b {
    color: var(--rei-green-dark, #157155) !important;
    -webkit-text-fill-color: var(--rei-green-dark, #157155);
}
/* Link dentro le card chiare: verde #20A47B sottolineato (non i bottoni) */
.fe-page-hero .rei-attiva__intro a:not([class*="btn"]):not([class*="cta"]),
.fe-page-hero .rei-pi__intro a:not([class*="btn"]):not([class*="cta"]),
.fe-page-hero .rei-cmor__intro a:not([class*="btn"]):not([class*="cta"]),
.fe-page-hero .rei-meteo__intro a:not([class*="btn"]):not([class*="cta"]),
.fe-page-hero .rei-ass__intro a:not([class*="btn"]):not([class*="cta"]),
.fe-page-hero .rei-con__intro a:not([class*="btn"]):not([class*="cta"]),
.fe-page-hero .rei-acc__intro a:not([class*="btn"]):not([class*="cta"]) {
    color: var(--rei-green, #20A47B) !important;
    -webkit-text-fill-color: var(--rei-green, #20A47B);
    text-decoration: underline;
}

/* ==========================================================================
   OVERRIDE GLOBALE BOTTONI FRONT-END — fix "testo invisibile" + effetto lente
   Audit di tutte le classi bottone del tema. Regole:
   - bottoni SOLIDI con bg verde (#20A47B), verde scuro (#157155) o grigio
     scuro → testo SEMPRE bianco #FFFFFF (anche al hover);
   - bottoni SOLIDI con bg lime #D1E000 (o mint #29D8A1) → testo #157155;
   - TUTTI i bottoni: transition + hover "effetto lente" scale(1.05).
   Selettori espliciti (nessun selettore universale). !important sul colore
   per battere eventuali regole di pagina più tardive nella cascata.
   ========================================================================== */

/* --- 1) Bottoni solidi verde/verde scuro/grigio scuro → testo bianco --- */
.rei-btn--primary,
.rei-btn--secondary,
.rei-btn--green,
.rei-btn--ink,
.rei-service-card__cta,
.rei-areacliente__btn:not(.rei-areacliente__btn--ghost),
.rei-areacliente__cta-btn,
.rei-pagofacile__btn,
.rei-pagofacile__btn--primary,
.rei-pagofacile__help-actions .rei-pagofacile__btn,
.rei-pagamenti__cta-btn,
.rei-pagamenti__method-btn,
.rei-autolettura__submit,
.rei-seg__submit,
.rei-cmor__submit,
.rei-cand__submit,
.rei-efficienza__submit,
.rei-meteo__submit,
.rei-search-page__submit,
.rei-cb-submit,
.rei-truffe__btn,
.rei-condotta__btn,
.rei-reclami__modulo-btn,
.rei-diritti__box-btn,
.rei-trasp__cta-button,
.rei-lp__btn--primary {
    color: #FFFFFF !important;
}
.rei-btn--primary:hover, .rei-btn--primary:focus-visible,
.rei-btn--secondary:hover, .rei-btn--secondary:focus-visible,
.rei-btn--green:hover, .rei-btn--green:focus-visible,
.rei-btn--ink:hover, .rei-btn--ink:focus-visible,
.rei-service-card__cta:hover, .rei-service-card__cta:focus-visible,
.rei-areacliente__btn:not(.rei-areacliente__btn--ghost):hover,
.rei-areacliente__cta-btn:hover, .rei-areacliente__cta-btn:focus-visible,
.rei-pagofacile__btn:hover, .rei-pagofacile__btn:focus-visible,
.rei-pagofacile__btn--primary:hover, .rei-pagofacile__btn--primary:focus-visible,
.rei-pagamenti__cta-btn:hover, .rei-pagamenti__cta-btn:focus-visible,
.rei-pagamenti__method-btn:hover, .rei-pagamenti__method-btn:focus-visible,
.rei-autolettura__submit:hover, .rei-autolettura__submit:focus-visible,
.rei-seg__submit:hover,
.rei-cmor__submit:hover,
.rei-cand__submit:hover,
.rei-efficienza__submit:hover,
.rei-meteo__submit:hover,
.rei-search-page__submit:hover,
.rei-cb-submit:hover,
.rei-truffe__btn:hover,
.rei-condotta__btn:hover,
.rei-reclami__modulo-btn:hover,
.rei-diritti__box-btn:hover,
.rei-trasp__cta-button:hover,
.rei-lp__btn--primary:hover {
    color: #FFFFFF !important;
}

/* --- 2) Bottoni solidi lime #D1E000 / mint #29D8A1 → testo verde scuro --- */
.rei-btn--accent,
.rei-offer-card__cta,
.rei-btn.rei-offer-card__cta,
.rei-hero__promo-card,
.rei-lp__cta,
.rei-lp__btn--green {
    color: #157155 !important;
}
.rei-btn--accent:hover, .rei-btn--accent:focus-visible,
.rei-offer-card__cta:hover, .rei-offer-card__cta:focus-visible,
.rei-hero__promo-card:hover,
.rei-lp__cta:hover,
.rei-lp__btn--green:hover {
    color: #157155 !important;
}

/* --- 3) Box aiuto Pago.Facile: tel = verde scuro, WhatsApp = verde brand,
       entrambi con testo bianco (ordine markup: 1° tel --primary, 2° wa) --- */
.rei-pagofacile__help-actions .rei-pagofacile__btn--primary {
    background: #157155 !important;
    color: #FFFFFF !important;
}
.rei-pagofacile__help-actions .rei-pagofacile__btn:not(.rei-pagofacile__btn--primary) {
    background: #20A47B !important;
    color: #FFFFFF !important;
}

/* --- 4) Effetto lente: transition + hover scale(1.05) su TUTTI i bottoni --- */
.rei-btn,
.rei-btn--primary,
.rei-btn--secondary,
.rei-btn--green,
.rei-btn--ink,
.rei-btn--accent,
.rei-btn--outline,
.rei-btn--outline-green,
.rei-offer-card__cta,
.rei-service-card__cta,
.rei-areacliente__btn,
.rei-areacliente__cta-btn,
.rei-pagofacile__btn,
.rei-pagamenti__cta-btn,
.rei-pagamenti__method-btn,
.rei-autolettura__submit,
.rei-autolettura__banner-btn,
.rei-autolettura__switch-btn,
.rei-seg__submit,
.rei-cmor__submit,
.rei-cand__submit,
.rei-contatti__submit,
.rei-consulente__submit,
.rei-efficienza__submit,
.rei-meteo__submit,
.rei-search-page__submit,
.rei-cb-submit,
.rei-truffe__btn,
.rei-condotta__btn,
.rei-reclami__modulo-btn,
.rei-diritti__box-btn,
.rei-trasp__cta-button,
.rei-lp__cta,
.rei-lp__btn--primary,
.rei-lp__btn--green,
.rei-lp__band-cta,
.rei-attiva__link--btn,
.rei-hero__promo-card,
.rei-pattern-hero__btn--primary .wp-block-button__link,
.rei-pattern-hero__btn--secondary .wp-block-button__link,
.rei-pattern-cta-banner__btn--white .wp-block-button__link,
.rei-pattern-cta-banner__btn--ghost .wp-block-button__link {
    transition: transform 0.25s ease, background-color 0.25s ease,
                box-shadow 0.25s ease, color 0.25s ease;
    will-change: transform;
}
.rei-btn:hover, .rei-btn:focus-visible,
.rei-btn--primary:hover,
.rei-btn--secondary:hover,
.rei-btn--green:hover,
.rei-btn--ink:hover,
.rei-btn--accent:hover,
.rei-btn--outline:hover,
.rei-btn--outline-green:hover,
.rei-offer-card__cta:hover,
.rei-service-card__cta:hover,
.rei-areacliente__btn:hover,
.rei-areacliente__cta-btn:hover,
.rei-pagofacile__btn:hover,
.rei-pagamenti__cta-btn:hover,
.rei-pagamenti__method-btn:hover,
.rei-autolettura__submit:hover,
.rei-autolettura__banner-btn:hover,
.rei-autolettura__switch-btn:hover,
.rei-seg__submit:hover,
.rei-cmor__submit:hover,
.rei-cand__submit:hover,
.rei-contatti__submit:hover,
.rei-consulente__submit:hover,
.rei-efficienza__submit:hover,
.rei-meteo__submit:hover,
.rei-search-page__submit:hover,
.rei-cb-submit:hover,
.rei-truffe__btn:hover,
.rei-condotta__btn:hover,
.rei-reclami__modulo-btn:hover,
.rei-diritti__box-btn:hover,
.rei-trasp__cta-button:hover,
.rei-lp__cta:hover,
.rei-lp__btn--primary:hover,
.rei-lp__btn--green:hover,
.rei-lp__band-cta:hover,
.rei-attiva__link--btn:hover,
.rei-hero__promo-card:hover,
.rei-pattern-hero__btn--primary .wp-block-button__link:hover,
.rei-pattern-hero__btn--secondary .wp-block-button__link:hover,
.rei-pattern-cta-banner__btn--white .wp-block-button__link:hover,
.rei-pattern-cta-banner__btn--ghost .wp-block-button__link:hover {
    transform: scale(1.05) !important;
}
@media (prefers-reduced-motion: reduce) {
    .rei-btn:hover, .rei-btn--primary:hover, .rei-btn--secondary:hover,
    .rei-btn--green:hover, .rei-btn--ink:hover, .rei-btn--accent:hover,
    .rei-btn--outline:hover, .rei-btn--outline-green:hover,
    .rei-offer-card__cta:hover, .rei-service-card__cta:hover,
    .rei-areacliente__btn:hover, .rei-areacliente__cta-btn:hover,
    .rei-pagofacile__btn:hover, .rei-pagamenti__cta-btn:hover,
    .rei-pagamenti__method-btn:hover, .rei-autolettura__submit:hover,
    .rei-autolettura__banner-btn:hover, .rei-autolettura__switch-btn:hover,
    .rei-seg__submit:hover, .rei-cmor__submit:hover, .rei-cand__submit:hover,
    .rei-contatti__submit:hover, .rei-consulente__submit:hover,
    .rei-efficienza__submit:hover, .rei-meteo__submit:hover,
    .rei-search-page__submit:hover, .rei-cb-submit:hover,
    .rei-truffe__btn:hover, .rei-condotta__btn:hover,
    .rei-reclami__modulo-btn:hover, .rei-diritti__box-btn:hover,
    .rei-trasp__cta-button:hover, .rei-lp__cta:hover,
    .rei-lp__btn--primary:hover, .rei-lp__btn--green:hover,
    .rei-lp__band-cta:hover, .rei-attiva__link--btn:hover,
    .rei-hero__promo-card:hover {
        transform: none !important;
    }
}

/* ==========================================================================
   v2.2 — FILIGRANE PERSONALIZZATE PER TEMA DI PAGINA
   Il pattern (tile 340x340, line-art rgba(32,164,123,0.05)) è applicato al
   CONTENITORE PRINCIPALE (#site-main / .rei-main) con drift diagonale lento;
   le fasce/pagine con fondo bianco pieno sono rese transparent (vedi sotto)
   così la filigrana traspare ovunque, mentre le CARD bianche restano bianche
   (elementi in rilievo). La scelta del pattern avviene via body class:
   - home/front-page ............................. wm-logo (in home.css)
   - pagine statiche (body.rei-static-page--slug) . pattern a tema
   - single/archive post ......................... wm-magazine
   - fallback .................................... wm-logo
   ========================================================================== */
.rei-main {
    background-image: url('../images/watermarks/wm-logo.svg');
    background-repeat: repeat;
    background-size: 340px 340px;
    animation: rei-wm-drift 60s linear infinite;
}
@keyframes rei-wm-drift {
    from { background-position: 0 0; }
    to   { background-position: 340px 340px; } /* multiplo esatto del tile → loop seamless */
}
@media (prefers-reduced-motion: reduce) {
    .rei-main { animation: none; }
}

/* --- Mappa body class → filigrana a tema --- */
/* Pagamenti: carte di credito, monete €, smartphone pay */
body.rei-static-page--pagamenti-digitali .rei-main,
body.rei-static-page--pago-facile .rei-main {
    background-image: url('../images/watermarks/wm-pagamenti.svg');
}
/* Moduli: documenti/fogli PDF, penna */
body.rei-static-page--moduli .rei-main {
    background-image: url('../images/watermarks/wm-moduli.svg');
}
/* Autolettura: contatore/gauge, lampadina e fiamma */
body.rei-static-page--autolettura .rei-main {
    background-image: url('../images/watermarks/wm-contatore.svg');
}
/* Contatti: cornetta, busta, fumetto chat */
body.rei-static-page--contatti .rei-main,
body.rei-static-page--consulente-dedicato .rei-main {
    background-image: url('../images/watermarks/wm-contatti.svg');
}
/* Magazine/Comunicazioni + articoli (single) e archivi post */
body.single .rei-main,
body.archive .rei-main,
body.blog .rei-main,
body.rei-magazine-single .rei-main,
body.rei-static-page--magazine .rei-main,
body.rei-static-page--comunicazioni .rei-main {
    background-image: url('../images/watermarks/wm-magazine.svg');
}
/* Tutela del cliente: bilancia, scudo con spunta */
body.rei-static-page--reclami .rei-main,
body.rei-static-page--conciliazione-e-risoluzione-delle-controversie .rei-main,
body.rei-static-page--tutela-e-diritti-del-cliente .rei-main,
body.rei-static-page--codice-di-condotta-commerciale .rei-main,
body.rei-static-page--obiettivo-trasparenza .rei-main,
body.rei-static-page--mancato-pagamento-e-indennizzi-automatici .rei-main,
body.rei-static-page--rimborsi-cmor .rei-main {
    background-image: url('../images/watermarks/wm-tutela.svg');
}
/* Sicurezza/legale: scudo, campanello d'allarme, lucchetto */
body.rei-static-page--truffe-telefoniche .rei-main,
body.rei-static-page--segnalazioni-sospette .rei-main,
body.rei-static-page--privacy-policy .rei-main,
body.rei-static-page--cookie-policy .rei-main,
body.rei-static-page--note-legali .rei-main,
body.rei-static-page--dichiarazione-di-accessibilita .rei-main {
    background-image: url('../images/watermarks/wm-sicurezza.svg');
}
/* Supporto/solidarietà: mano con cuore, persone */
body.rei-static-page--bonus-sociali .rei-main,
body.rei-static-page--vulnerabili-luce-gas .rei-main,
body.rei-static-page--agevolazioni-eventi-metereologici .rei-main,
body.rei-static-page--accertamenti-e-assicurazione-gas .rei-main {
    background-image: url('../images/watermarks/wm-supporto.svg');
}
/* Energia: foglia, lampadina, saetta */
body.rei-static-page--efficienza-energetica .rei-main,
body.rei-static-page--composizione-del-mix-energetico .rei-main,
body.rei-static-page--offerta-placet .rei-main,
body.rei-static-page--qualita .rei-main,
body.rei-static-page--guida-alla-comprensione .rei-main,
body.rei-static-page--aliquote-e-imposte .rei-main,
body.rei-static-page--emergenza-alluvione .rei-main,
body.rei-static-page--manuale-utente .rei-main {
    background-image: url('../images/watermarks/wm-energia.svg');
}
/* Persone/lavoro: valigetta, stretta di mano, utente */
body.rei-static-page--lavora-con-noi .rei-main,
body.rei-static-page--reseller .rei-main,
body.rei-static-page--area-cliente .rei-main,
body.rei-static-page--nasce-la-community-di-facile-energy .rei-main,
body.rei-static-page--attiva .rei-main,
body.rei-static-page--offerte-luce-gas .rei-main,
body.rei-static-page--ti-richiamiamo-privacy .rei-main {
    background-image: url('../images/watermarks/wm-persone.svg');
}

/* I corpi bianchi pieni dei template interni diventano transparent: la
   filigrana del main traspare. Le card bianche al loro interno restano
   bianche (in rilievo). */
.rei-page__body.rei-section--offwhite,
.rei-page__body,
.rei-single__body,
.rei-archive__body {
    background: transparent;
}

/* ==========================================================================
   COMPLIANZ — NASCONDI LA CARD/TAB FLOTTANTE "GESTISCI CONSENSO"
   Il tab flottante in basso (desktop E mobile) è renderizzato da
   class-banner-loader.php come <div id="cmplz-manage-consent"> contenente
   <button class="cmplz-btn cmplz-manage-consent manage-consent-{id}">.
   Le regole coprono anche il blocco shortcode .cmplz-manage-consent-container
   (e la variante nojavascript) come richiesto. Il banner cookie iniziale
   (#cmplz-cookiebanner-container / .cmplz-cookiebanner) NON è toccato e
   resta visibile.
   ========================================================================== */
#cmplz-manage-consent,
#cmplz-manage-consent .cmplz-manage-consent,
.cmplz-manage-consent,
button.cmplz-manage-consent,
.cmplz-manage-consent-container,
#cmplz-manage-consent-container,
#cmplz-manage-consent-container-nojavascript {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
    animation: none !important;
}