/**
 * 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: #FFFFFF; /* Power4U: hero su fondo BIANCO */
    color: var(--rei-ink, #3C3C3B);
}
.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: 900;
    line-height: 1.12;
    letter-spacing: 0.01em;
    text-transform: uppercase;
    margin: 14px 0 18px;
    /* Titolo display GRADIENTE arancio→fucsia (testo ritagliato) */
    color: var(--rei-green-dark, #E60B70);
    background: var(--rei-gradient, linear-gradient(90deg, #EB541D 0%, #E60B70 100%));
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}
.rei-single__title {
    font-size: clamp( 1.8rem, 3.6vw, 2.8rem );
    font-weight: 900;
    line-height: 1.15;
    letter-spacing: 0.01em;
    text-transform: uppercase;
    margin: 14px 0 18px;
    color: var(--rei-green-dark, #E60B70);
    background: var(--rei-gradient, linear-gradient(90deg, #EB541D 0%, #E60B70 100%));
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}

.rei-page__lead,
.rei-single__lead,
.rei-archive__lead {
    font-size: 1.25rem;
    line-height: 1.55;
    color: #000000; /* sottotitolo NERO su fondo bianco */
    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, #EB541D);
    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, #EB541D);
}
.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, #E60B70);
}
.rei-page__content blockquote,
.rei-single__content blockquote {
    border-left: 4px solid var(--rei-green, #EB541D);
    padding: 14px 22px;
    margin: 1.8em 0;
    font-style: italic;
    font-size: 1.15rem;
    background: var(--rei-cream, #F7F6F7);
    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, #E60B70);
    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, #E60B70);
}

.rei-page__content code,
.rei-single__content code {
    background: var(--rei-cream-dark, #FDECF4);
    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: #000000;
    color: #FFFFFF;
    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, #E60B70);
    color: #FFFFFF;
}

.rei-single__meta {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    margin-top: 24px;
    font-size: 0.95rem;
    color: var(--rei-ink, #3C3C3B);
}
.rei-single__hero .rei-single__author,
.rei-single__hero .rei-single__sep {
    color: var(--rei-ink, #3C3C3B);
}
.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, #F7F6F7);
    border-radius: 999px;
    font-size: 0.85rem;
    color: var(--rei-ink, #3C3C3B);
    text-decoration: none;
}
.rei-single__tags a:hover {
    background: var(--rei-yellow, #EE9DC4);
}

/* === 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, #EB541D); /* 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, #EB541D); /* 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, #EB541D);
    box-shadow: 0 12px 28px rgba(235,84,29, 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, #EB541D);
    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, #EB541D);
    border-color: var(--rei-green, #EB541D);
    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, #EB541D); /* 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, #FDECF4);
}
.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, #E60B70);
    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, #EB541D);
    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, #EB541D);
    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: #E60B70;
    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, #EB541D); /* 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, #E60B70);
    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, #EB541D); /* 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, #EB541D); /* 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, #F7F6F7);
    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: #E60B70;
}
.rei-offerta-card--green .rei-offerta-card__price-amount {
    color: var(--rei-green-deep, #E60B70);
}
.rei-offerta-card__price-unit {
    font-size: 1rem;
    color: var(--rei-gray, #666);
    font-weight: 600;
}
.rei-offerta-card__durata {
    background: var(--rei-cream, #F7F6F7);
    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, #EB541D);
    font-weight: 700;
}
.rei-offerta-card--red .rei-offerta-card__vantaggi li::before {
    color: #E60B70;
}
.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, #FDECF4);
    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, #EB541D);
    border-color: var(--rei-green, #EB541D);
    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, #E60B70) !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, #EB541D);
    color: #fff;
    border-color: var(--rei-green, #EB541D);
}
.rei-pattern-hero__btn--primary .wp-block-button__link:hover {
    background: var(--rei-green-deep, #E60B70);
    border-color: var(--rei-green-deep, #E60B70);
    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, #E60B70) !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, #E60B70) !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, #E60B70) !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, #EB541D); /* 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, #EB541D), var(--rei-green-deep, #E60B70)) !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, #E60B70);
    border-color: #fff;
}
.rei-pattern-cta-banner__btn--white .wp-block-button__link:hover {
    background: var(--rei-cream, #F7F6F7);
    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, #EB541D); /* 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, #FDECF4);
}
.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, #E60B70) !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: #E60B70 !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, #E60B70) !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, #EB541D);
    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(235,84,29, 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, #EB541D) !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(235,84,29, 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, #EB541D); /* v2.2: contorno verde su tutti i riquadri */
}
.rei-pattern-testimonianze__stars {
    font-size: 1.2rem !important;
    color: #EE9DC4 !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;
    }
}

/* ==========================================================================
   POWER4U — FASCIA HERO COMUNE (.fe-page-hero)
   Hero su fondo BIANCO con titolo display GRADIENTE arancio→fucsia gigante,
   sottotitolo NERO, chip neri/fucsia (spec §7). I template REI mantengono i
   propri theme_mod di titolo/sottotitolo: qui si uniforma solo la veste.
   ========================================================================== */
.fe-page-hero {
    background: #FFFFFF !important;
    padding: 70px 0 !important;
    position: relative;
    z-index: 1;
    overflow: hidden;
    color: var(--rei-ink, #3C3C3B);
}
.fe-page-hero h1,
.fe-page-hero h1 span,
.fe-page-hero h1 strong {
    background: var(--rei-gradient, linear-gradient(90deg, #EB541D 0%, #E60B70 100%));
    -webkit-background-clip: text;
    background-clip: text;
    color: var(--rei-green-dark, #E60B70) !important;
    -webkit-text-fill-color: transparent;
}
.fe-page-hero h1 {
    text-transform: uppercase !important;
    font-weight: 900 !important;
    font-size: clamp(2rem, 4.6vw, 4rem) !important; /* display gigante */
    line-height: 1.08 !important;
    letter-spacing: 0.01em !important;
    margin: 0 0 18px !important;
}
/* 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 #EB541D 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: #000000 !important;
    border: 1px solid #000000 !important;
    color: #FFFFFF !important;
    -webkit-text-fill-color: #FFFFFF;
    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, #E60B70) !important;
    border-color: var(--rei-green-dark, #E60B70) !important;
    color: #fff !important;
    -webkit-text-fill-color: #fff;
}
/* Sottotitolo / intro / lead: NERO su fondo bianco, grassetti neri */
.fe-page-hero p,
.fe-page-hero [class*="__intro"],
.fe-page-hero [class*="__lead"],
.fe-page-hero [class*="__sub"] {
    color: #000000 !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: #000000 !important;
    font-weight: 800;
}
.fe-page-hero a {
    color: var(--rei-green-dark, #E60B70) !important;
    text-decoration: underline;
}
/* Bottoni/CTA dentro l'hero: GRADIENTE firma con testo bianco */
.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: var(--rei-gradient, linear-gradient(90deg, #EB541D 0%, #E60B70 100%)) !important;
    color: #FFFFFF !important;
    border-color: transparent !important;
    text-decoration: none !important;
}
/* Badge/step/icone tonde dentro l'hero: bordo fucsia su bianco */
.fe-page-hero [class*="__hero-icon"] {
    background: var(--rei-green-vlight, #FDECF4) !important;
    border: 2px solid var(--rei-green-dark, #E60B70);
    box-shadow: none !important;
}
/* Filtri (listing Blog/Comunicazioni) dentro l'hero bianco */
.fe-page-hero [class*="__filter"] {
    background: #FFFFFF !important;
    border: 1px solid #000000 !important;
    color: #000000 !important;
    text-decoration: none;
}
.fe-page-hero [class*="__filter"]:hover,
.fe-page-hero [class*="__filter"].is-active {
    background: var(--rei-green-dark, #E60B70) !important;
    border-color: var(--rei-green-dark, #E60B70) !important;
    color: #FFFFFF !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
   #FDECF4 → #FBD7E9, 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 #E60B70 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, #E60B70) !important;
    -webkit-text-fill-color: var(--rei-green-dark, #E60B70);
}
/* 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, #E60B70) !important;
    -webkit-text-fill-color: var(--rei-green-dark, #E60B70);
}
/* Link dentro le card chiare: verde #EB541D 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, #EB541D) !important;
    -webkit-text-fill-color: var(--rei-green, #EB541D);
    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 (#EB541D), verde scuro (#E60B70) o grigio
     scuro → testo SEMPRE bianco #FFFFFF (anche al hover);
   - bottoni SOLIDI con bg lime #EE9DC4 (o mint #EF63A7) → testo #E60B70;
   - 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-pagopower__btn,
.rei-pagopower__btn--primary,
.rei-pagopower__help-actions .rei-pagopower__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-pagopower__btn:hover, .rei-pagopower__btn:focus-visible,
.rei-pagopower__btn--primary:hover, .rei-pagopower__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 rosa chiaro #EE9DC4 / rosa #EF63A7 → testo NERO
       (spec Power4U: sul rosa chiaro il testo è sempre nero) --- */
.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: #000000 !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: #000000 !important;
}

/* --- 3) Box aiuto Pago.Power: tel = verde scuro, WhatsApp = verde brand,
       entrambi con testo bianco (ordine markup: 1° tel --primary, 2° wa) --- */
.rei-pagopower__help-actions .rei-pagopower__btn--primary {
    background: #E60B70 !important;
    color: #FFFFFF !important;
}
.rei-pagopower__help-actions .rei-pagopower__btn:not(.rei-pagopower__btn--primary) {
    background: #EB541D !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-pagopower__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-pagopower__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-pagopower__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(235,84,29,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 ............................. ::before col logo live (default qui sotto)
   - pagine statiche (body.rei-static-page--slug) . pattern a tema
   - single/archive post ......................... wm-magazine
   - fallback .................................... ::before col logo live (default qui sotto)
   ========================================================================== */
/* DEFAULT (home, fallback): FILIGRANA "LOGO VERO" — ::before con il logo live
   Power4U in tile 340px, opacity 0.04 + drift diagonale lento (stessa tecnica
   GNE). Le pagine tematiche (sotto) usano invece il proprio pattern SVG
   ricolorato rgba(230,11,112,0.04) come background del main e spengono il
   ::before. */
.rei-main {
    position: relative;
    background-repeat: repeat;
    background-size: 340px 340px;
    animation: rei-wm-drift 60s linear infinite;
}
.rei-main::before {
    content: "";
    position: absolute;
    inset: -340px 0 0 -340px;
    background-image: url('https://power4u.it/wp-content/uploads/2025/12/power-4-u-main-logo.png');
    background-repeat: repeat;
    background-size: 340px auto;
    opacity: 0.04;
    pointer-events: none;
    z-index: 0;
    animation: rei-wm-drift-logo 60s linear infinite;
}
/* Il contenuto del main resta sopra la filigrana */
.rei-main > * {
    position: relative;
    z-index: 1;
}
/* Le pagine con pattern tematico (body class) spengono il logo ::before */
body[class*="rei-static-page--"] .rei-main::before,
body.single .rei-main::before,
body.archive .rei-main::before,
body.blog .rei-main::before,
body.rei-magazine-single .rei-main::before {
    content: none;
}
@keyframes rei-wm-drift {
    from { background-position: 0 0; }
    to   { background-position: 340px 340px; } /* multiplo esatto del tile → loop seamless */
}
@keyframes rei-wm-drift-logo {
    from { transform: translate(0, 0); }
    to   { transform: translate(340px, 340px); }
}
@media (prefers-reduced-motion: reduce) {
    .rei-main,
    .rei-main::before { animation: none; }
}

/* --- Mappa body class → filigrana a tema (slug Power4U) --- */
/* Pagamenti: carte di credito, monete €, smartphone pay */
body.rei-static-page--pagamenti-digitali .rei-main,
body.rei-static-page--pago-power .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 luce/gas + contatori: contatore/gauge, lampadina e fiamma */
body.rei-static-page--autolettura-luce .rei-main,
body.rei-static-page--autolettura-gas .rei-main,
body.rei-static-page--contatori .rei-main {
    background-image: url('../images/watermarks/wm-contatore.svg');
}
/* Contatti + prenota consulenza: cornetta, busta, fumetto chat */
body.rei-static-page--contatti .rei-main,
body.rei-static-page--prenota-consulenza .rei-main {
    background-image: url('../images/watermarks/wm-contatti.svg');
}
/* Blog/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--blog .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--diritti-del-consumatore .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--ti-richiamiamo-privacy .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--agevolazione-eventi-metereologici .rei-main,
body.rei-static-page--alluvione-emilia-romagna .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--privato-luce .rei-main,
body.rei-static-page--offerte-luce-gas .rei-main,
body.rei-static-page--guida-alla-comprensione .rei-main,
body.rei-static-page--aliquote-e-imposte .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--chi-siamo .rei-main,
body.rei-static-page--candidatura .rei-main,
body.rei-static-page--attiva .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;
}

/* ==========================================================================
   v2.4 — OMBRE RINFORZATE SITE-WIDE (card/riquadri + bottoni solidi)
   Richiesta: più profondità su TUTTI i rettangoli e i pulsanti del sito.
   - Card bianche/riquadri .....  0 18px 40px rgba(0,0,0,0.16)
   - Bottoni solidi ............  0 8px 18px rgba(0,0,0,0.22) (hover più fonda)
   Selettori ESPLICITI (riuso dell'audit bottoni del blocco "testo bianco"
   qui sopra + audit card/box dei template di pagina). !important per battere
   le box-shadow dichiarate nei singoli page-*.css caricati dopo.
   NIENTE ombre su elementi di testo puro (titoli, paragrafi, link inline).
   ========================================================================== */

/* --- 1) Card / riquadri --- */
.rei-archive__card,
.rei-areacliente__card,
.rei-attiva__intro-card,
.rei-attiva__offer-card,
.rei-attiva__pay-card,
.rei-attiva__upload-card,
.rei-bonus__card,
.rei-bonus__come-card,
.rei-condotta__card,
.rei-contatti__form-card,
.rei-diritti__card,
.rei-lp__card,
.rei-pagamenti__form-card,
.rei-pagamenti__method-card,
.rei-page__child-card,
.rei-pagopower__card,
.rei-reclami__card,
.rei-single__related-card,
.rei-trasp__card,
.rei-vulnerabili__card,
.rei-vulnerabili__come-card,
.rei-acc__box,
.rei-ass__box,
.rei-attiva__box,
.rei-autolettura__box,
.rei-autolettura__panel,
.rei-bonus__box,
.rei-cand__box,
.rei-cmor__box,
.rei-con__box,
.rei-cookie__box,
.rei-diritti__box,
.rei-meteo__box,
.rei-note__box,
.rei-pi__box,
.rei-privacy__box,
.rei-reclami__box,
.rei-vulnerabili__box {
    box-shadow: 0 18px 40px rgba(0, 0, 0, 0.16) !important;
}

/* --- 2) Bottoni solidi (stesso elenco dell'override colore testo sopra:
       verdi/scuri + lime/mint) → ombra netta, hover più profonda --- */
.rei-btn--primary,
.rei-btn--secondary,
.rei-btn--green,
.rei-btn--ink,
.rei-btn--accent,
.rei-offer-card__cta,
.rei-service-card__cta,
.rei-areacliente__btn:not(.rei-areacliente__btn--ghost),
.rei-areacliente__cta-btn,
.rei-pagopower__btn,
.rei-pagopower__btn--primary,
.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-pattern-hero__btn--primary .wp-block-button__link,
.rei-pattern-cta-banner__btn--white .wp-block-button__link {
    box-shadow: 0 8px 18px rgba(0, 0, 0, 0.22) !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-btn--accent:hover, .rei-btn--accent:focus-visible,
.rei-offer-card__cta:hover, .rei-offer-card__cta: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-pagopower__btn:hover, .rei-pagopower__btn:focus-visible,
.rei-pagopower__btn--primary:hover,
.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__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-pattern-hero__btn--primary .wp-block-button__link:hover,
.rei-pattern-cta-banner__btn--white .wp-block-button__link:hover {
    box-shadow: 0 14px 28px rgba(0, 0, 0, 0.30) !important;
}

/* ==========================================================================
   v1.3.0 — pulsazione delicata su tutti i bottoni solidi + ombre card ancora
   più profonde. prefers-reduced-motion ferma le animazioni.
   ========================================================================== */
@keyframes fe-btn-pulse {
    0%, 100% { transform: scale(1); }
    50%      { transform: scale(1.035); }
}
a.rei-btn, .rei-btn,
.rei-offer-card__cta, .rei-offer-card__cta-black,
.rei-service-card__btn, .rei-services .rei-btn,
.rei-pagopower__btn, .rei-pagamenti__submit,
.rei-attiva__btn, .rei-form__submit,
button[type="submit"].rei-btn, input[type="submit"].rei-btn {
    animation: fe-btn-pulse 2.6s ease-in-out infinite;
    will-change: transform;
}
a.rei-btn:hover, .rei-btn:hover,
.rei-offer-card__cta:hover, .rei-service-card__btn:hover,
.rei-pagopower__btn:hover, .rei-pagamenti__submit:hover {
    animation-play-state: paused;
}
/* ombre card ancora più profonde (richiesta cliente) */
.rei-offer-card, .rei-service-card, .rei-magazine-card,
.rei-pagopower__card, .rei-ac__card, .rei-archive-card,
.rei-pi__block, .rei-page-card, .fe-card {
    box-shadow: 0 24px 55px rgba(0, 0, 0, 0.22) !important;
}
@media (prefers-reduced-motion: reduce) {
    a.rei-btn, .rei-btn, .rei-offer-card__cta, .rei-service-card__btn,
    .rei-pagopower__btn, .rei-pagamenti__submit, .rei-attiva__btn, .rei-form__submit {
        animation: none;
    }
}

/* ==========================================================================
   P4U MARQUEE — testo scorrevole orizzontale (componente riusabile, spec §6.7)
   Markup atteso:
   <div class="p4u-marquee" aria-hidden="true">
     <div class="p4u-marquee__track">
       <span class="p4u-marquee__item">TESTO •&nbsp;</span>
       <span class="p4u-marquee__item">TESTO •&nbsp;</span>  (contenuto DUPLICATO
       ... per il loop seamless: il track scorre di -50%)
     </div>
   </div>
   Varianti: .p4u-marquee--gradient (testo col gradiente firma),
             .p4u-marquee--dark (fascia nera, testo bianco).
   ========================================================================== */
.p4u-marquee {
    overflow: hidden;
    white-space: nowrap;
    padding: 18px 0;
    background: #FFFFFF;
}
.p4u-marquee__track {
    display: inline-flex;
    align-items: baseline;
    white-space: nowrap;
    will-change: transform;
    animation: p4u-marquee-scroll 33s linear infinite;
}
.p4u-marquee__item {
    display: inline-block;
    font-family: var(--rei-font-family, 'Inter', sans-serif);
    font-weight: 900;
    text-transform: uppercase;
    font-size: clamp(1.75rem, 4.5vw, 3.5rem);
    line-height: 1.1;
    letter-spacing: 0.01em;
    color: var(--rei-ink, #3C3C3B);
    padding-right: 0.6em;
}
/* Variante: testo col GRADIENTE firma arancio→fucsia */
.p4u-marquee--gradient .p4u-marquee__item {
    background: var(--rei-gradient, linear-gradient(90deg, #EB541D 0%, #E60B70 100%));
    -webkit-background-clip: text;
    background-clip: text;
    color: var(--rei-green-dark, #E60B70);
    -webkit-text-fill-color: transparent;
}
/* Variante: fascia nera con testo bianco */
.p4u-marquee--dark {
    background: #000000;
}
.p4u-marquee--dark .p4u-marquee__item {
    color: #FFFFFF;
}
@keyframes p4u-marquee-scroll {
    from { transform: translateX(0); }
    to   { transform: translateX(-50%); } /* contenuto duplicato → loop seamless */
}
/* Pausa al hover (leggibilità) e con prefers-reduced-motion */
.p4u-marquee:hover .p4u-marquee__track {
    animation-play-state: paused;
}
@media (prefers-reduced-motion: reduce) {
    .p4u-marquee__track {
        animation: none;
        transform: none;
    }
}