/* =============================================================================
   Stoli Refine — rifinitura globale — v4.7.0-stoli
   Caricato dopo light.css e responsive.css (lib/stoli-refine.php).
   Niente cambi di layout o di contenuti: colori dei testi piccoli portati ad AA
   (4,5:1), bottoni coerenti, focus da tastiera visibile, footer più leggibile.
   ============================================================================= */

:root {
    --stoli-ink: #1a1a1a;
    --stoli-gold: #998067;       /* oro del marchio: linee, fondi, testi grandi (3,7:1 su bianco) */
    --stoli-gold-text: #7a6247;  /* oro per testi piccoli e bottoni: 5,7:1 su bianco, bianco sopra 5,7:1 */
    --stoli-gold-dark: #5c4a35;  /* hover dei link: più contrasto, non meno */
    --stoli-cream: #f3f1ee;
    --stoli-text-soft: #5f5a54;  /* testi secondari: 6,3:1 su bianco, 5,6:1 su crema */
    --stoli-ease: cubic-bezier(.2, .7, .2, 1);
}

/* ---------- 1. Focus da tastiera (prima: outline: none senza alternativa) ---------- */

a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
summary:focus-visible,
[tabindex]:focus-visible {
    outline: 2px solid var(--stoli-gold-text) !important;
    outline-offset: 3px !important;
}

/* ---------- 2. Link nei contenuti: l'hover scurisce invece di schiarire ---------- */

body.theme-style-light #content a:not(.btn):not(.button):hover {
    color: var(--stoli-gold-dark);
}

/* ---------- 3. Bottoni ---------- */

/* Transizioni esplicite al posto di "all" (style.css), stesso ritmo ovunque. */
.btn,
.button,
input[type="submit"],
.vc_btn3 {
    transition: background-color .2s ease, border-color .2s ease, color .2s ease, box-shadow .2s ease, transform .2s ease;
}
.btn:active,
.button:active,
input[type="submit"]:active,
.vc_btn3:active {
    transform: translateY(1px);
}

/* Bottone pieno (nero): in hover l'oro scuro, così il bianco resta leggibile (prima 3,7:1). */
.button:hover,
.btn-primary:hover,
.button:focus-visible,
.btn-primary:focus-visible,
.woocommerce .button:hover,
.woocommerce button.button:hover,
.woocommerce a.button:hover,
.woocommerce .single_add_to_cart_button.button:hover {
    color: #fff;
    background-color: var(--stoli-gold-text);
    border-color: var(--stoli-gold-text);
}

/* Bottoni WPBakery (Info, Vedi tutti): stesso carattere degli altri bottoni del sito. */
body .vc_btn3.vc_btn3-style-outline-custom {
    font-family: "Cinzel", serif !important;
    font-weight: 700;
    letter-spacing: 2px;
}
/* Quelli oro: testo e bordo in oro scuro. WPBakery colora in JS (onmouseenter) e
   riscrive lo stile inline in rgb(), quindi si intercettano entrambe le forme. */
body .vc_btn3.vc_btn3-style-outline-custom[style*="#998067"],
body .vc_btn3.vc_btn3-style-outline-custom[style*="153, 128, 103"] {
    color: var(--stoli-gold-text) !important;
    border-color: var(--stoli-gold-text) !important;
}
body .vc_btn3.vc_btn3-style-outline-custom[style*="#998067"]:hover,
body .vc_btn3.vc_btn3-style-outline-custom[style*="153, 128, 103"]:hover,
body .vc_btn3.vc_btn3-style-outline-custom[style*="#998067"]:focus-visible,
body .vc_btn3.vc_btn3-style-outline-custom[style*="153, 128, 103"]:focus-visible {
    color: #fff !important;
    background-color: var(--stoli-gold-text) !important;
    border-color: var(--stoli-gold-text) !important;
}

/* Bottone a contorno scuro del tema (es. "Vedi tutti gli articoli"), gemello di "Vedi tutti". */
body .btn.stoli-btn-outline {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 48px;
    padding: 14px 30px;
    color: var(--stoli-ink);
    background: transparent;
    border: 2px solid var(--stoli-ink);
}
body .btn.stoli-btn-outline:hover,
body .btn.stoli-btn-outline:focus-visible {
    color: #fff;
    background: var(--stoli-ink);
    border-color: var(--stoli-ink);
}

/* Shop: le variabili oro del template diventano l'oro leggibile... */
body .stoli-shop {
    --ss-gold: #7a6247;
    --ss-text-soft: #5f5a54;
}
/* ...e le regole di light.css che fissano #998067 con !important. */
html body.theme-style-light #content .stoli-shop .stoli-shop__btn {
    color: var(--stoli-gold-text) !important;
    border-color: var(--stoli-gold-text) !important;
}
html body.theme-style-light #content .stoli-shop .stoli-shop__btn:hover {
    color: #fff !important;
    background: var(--stoli-gold-text) !important;
    border-color: var(--stoli-gold-text) !important;
}
/* "Aggiunto": prima bianco su #c9a96e (2,3:1). */
html body.theme-style-light #content .stoli-shop .stoli-shop__btn.is-added {
    color: #fff !important;
    background: var(--stoli-gold-dark) !important;
    border-color: var(--stoli-gold-dark) !important;
}
html body.theme-style-light #content .stoli-shop .stoli-shop__filters li.active .stoli-shop__filter-btn {
    background: var(--stoli-gold-text) !important;
}
@media (max-width: 700px) {
    html body.theme-style-light #content .stoli-shop .stoli-shop__filters li.active .stoli-shop__filter-btn {
        background: transparent !important;
        color: var(--stoli-gold-text) !important;
    }
}

/* Wine experience: il bottone del modale usa lo stesso carattere di "Prenota Ora". */
body .sx-modal .stoli-wx__btn {
    font-family: "Cinzel", serif !important;
}

/* Contatti: i selettori Satellite/Terreno sulla mappa erano a 8px. */
body .stoli-ct .cs-map .cs-toggle-btn {
    font-size: 10px;
    padding: 8px 13px;
}
body .stoli-ct .cs-map .cs-toggle-btn:hover {
    color: var(--stoli-gold-text);
    border-color: var(--stoli-gold-text);
}
body .stoli-ct .cs-map .cs-toggle-btn.cs-active {
    background: var(--stoli-gold-text);
    border-color: var(--stoli-gold-text);
}
@media (max-width: 767px) {
    body .stoli-ct .cs-map .cs-toggle-btn {
        font-size: 9.5px;
    }
}

/* ---------- 4. Testi piccoli in oro o grigio sotto 4,5:1 ---------- */

body .title-subtitle-box .toptitle,
body article.post.gg-vc-posts-grid-default time,
body article.post.gg-vc-posts-grid-default-no-img time,
body article.post.gg-vc-posts-grid-default-overlay time {
    color: var(--stoli-gold-text);
}
body.single-product .gg-breadcrumbs {
    color: rgba(255, 255, 255, .68);
}
body.woocommerce .product .product_meta .posted_in,
body.woocommerce .product .product_meta .tagged_as {
    color: var(--stoli-text-soft);
}

/* ---------- 5. Footer: stessi contenuti, più ordine ---------- */

/* Il fondo con i tappi resta, ma più calmo sotto il testo. */
body footer.site-footer {
    position: relative;
    background-color: var(--stoli-cream);
}
body footer.site-footer::before {
    content: "";
    position: absolute;
    inset: 0;
    background: rgba(246, 243, 238, .8);
    pointer-events: none;
}
body footer.site-footer > * {
    position: relative;
}
body footer.site-footer .footer-widgets {
    padding: 76px 0 26px;
}
body footer.site-footer .gg-widget {
    margin-bottom: 34px;
}

/* Titoli di colonna: maiuscoletto spaziato con filetto oro, come i titoli di sezione. */
body footer.site-footer .widget-title {
    margin: 0 0 22px;
    font-size: 14px;
    letter-spacing: 3px;
    text-transform: uppercase;
    color: var(--stoli-ink);
}
body footer.site-footer .widget-title::after {
    content: "";
    display: block;
    width: 28px;
    height: 1px;
    margin: 14px auto 0;
    background: var(--stoli-gold);
}

/* Menu */
body footer.site-footer .widget_nav_menu ul.menu li a {
    display: inline-block;
    padding: 6px 0;
    line-height: 1.6;
    color: #3d3a36;
    text-decoration: none;
    transition: color .2s ease;
}
body footer.site-footer .widget_nav_menu ul.menu li a:hover {
    color: var(--stoli-gold-text);
}

/* Indirizzo e dati azienda: interlinea da 2,2 a 1,8, corpo un filo più piccolo. */
body footer.site-footer .textwidget p,
body footer.site-footer .widget_block p {
    font-size: 16px;
    line-height: 1.8;
    color: #3d3a36;
}
body footer.site-footer .textwidget a {
    color: var(--stoli-gold-text);
    text-decoration: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: 4px;
    transition: color .2s ease;
}
body footer.site-footer .textwidget a:hover {
    color: var(--stoli-gold-dark);
}
body footer.site-footer #block-22 p {
    font-size: 14px;
    letter-spacing: .3px;
    color: var(--stoli-text-soft);
}

/* Riconoscimenti: allineati su una riga, leggero sollevamento al passaggio. */
/* Più bollini: righe da quattro (4+3 con sette), così restano tutti a 56–61px invece di
   stringersi su una riga (v4.9.1-stoli; con sei erano due righe da tre). */
body footer.site-footer #block-20 .wp-block-group {
    flex-wrap: wrap !important;
    max-width: 300px;
    margin: 0 auto;
    gap: 14px;
    align-items: center;
}
body footer.site-footer #block-20 figure {
    flex: 0 0 auto;
    margin: 0;
}
body footer.site-footer #block-20 img {
    transition: transform .3s var(--stoli-ease);
}
@media (hover: hover) and (pointer: fine) {
    body footer.site-footer #block-20 figure:hover img {
        transform: translateY(-3px);
    }
}

/* WhatsApp: oro leggibile (prima 2,5:1), area di tocco di 44px. */
body footer.site-footer #block-24 a {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 44px;
    padding: 0 22px;
    color: var(--stoli-gold-text) !important;
    border-color: var(--stoli-gold-text) !important;
    transition: background-color .2s ease, color .2s ease, border-color .2s ease;
}
body footer.site-footer #block-24 a:hover {
    color: #fff !important;
    background-color: var(--stoli-gold-text) !important;
}

/* Barra finale */
body footer.site-footer .footer-extras-container {
    border-top: 1px solid rgba(61, 58, 54, .12);
}
body footer.site-footer .footer-extras,
body footer.site-footer .footer-copyright,
body footer.site-footer .footer-message {
    color: var(--stoli-text-soft);
}
/* Social (v4.10.0-stoli, lib/stoli-social.php): marchi ufficiali in SVG, tutti nello stesso
   cerchio da 44px e alla stessa distanza (prima: padding-right 25px tranne l'ultimo). */
body footer.site-footer .footer-extras .footer-social ul {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    margin: 0;
    padding: 0;
}
body footer.site-footer .footer-extras .footer-social ul li {
    display: block;
    margin: 0;
    padding: 0;
}
body footer.site-footer .footer-extras .footer-social ul li a,
body footer.site-footer .footer-extras .footer-social ul li:last-child a {
    float: none;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    padding: 0;
    font-size: 18px;
    line-height: 1;
    color: #3d3a36;
    border: 1px solid rgba(61, 58, 54, .22);
    border-radius: 50%;
    transition: color .2s ease, background-color .2s ease, border-color .2s ease, transform .2s ease;
}
body footer.site-footer .footer-extras .footer-social ul li a svg {
    display: block;
    width: 18px;
    height: 18px;
}
/* Hover e focus: colore del social, icona bianca. !important perché light.css forza l'oro
   sui link della barra finale (l'icona spariva sul fondo oro). Contrasti del bianco:
   Facebook #0866FF 4,8:1; LinkedIn #0A66C2 5,6:1; Instagram solo la parte scura del suo
   gradiente (magenta → viola → blu, sempre ≥ 4:1), senza il giallo-arancio sotto 3:1. */
body footer.site-footer .footer-extras .footer-social ul li a:hover,
body footer.site-footer .footer-extras .footer-social ul li a:focus-visible {
    color: #fff !important;
    background-color: var(--stoli-gold-text);
    border-color: var(--stoli-gold-text);
}
body footer.site-footer .footer-extras .footer-social ul li a.stoli-social--facebook:hover,
body footer.site-footer .footer-extras .footer-social ul li a.stoli-social--facebook:focus-visible {
    background: #0866ff;
    border-color: #0866ff;
}
body footer.site-footer .footer-extras .footer-social ul li a.stoli-social--instagram:hover,
body footer.site-footer .footer-extras .footer-social ul li a.stoli-social--instagram:focus-visible {
    background: linear-gradient(45deg, #e1306c 0%, #c13584 40%, #833ab4 75%, #5851db 100%);
    border-color: #c13584;
}
body footer.site-footer .footer-extras .footer-social ul li a.stoli-social--linkedin:hover,
body footer.site-footer .footer-extras .footer-social ul li a.stoli-social--linkedin:focus-visible {
    background: #0a66c2;
    border-color: #0a66c2;
}
@media (hover: hover) and (pointer: fine) {
    body footer.site-footer .footer-extras .footer-social ul li a:hover {
        transform: translateY(-2px);
    }
}

@media (max-width: 767px) {
    body footer.site-footer .footer-widgets {
        padding-top: 56px;
    }
}

/* ---------- 6. Movimento ridotto ---------- */
@media (prefers-reduced-motion: reduce) {
    .btn:active,
    .button:active,
    input[type="submit"]:active,
    .vc_btn3:active,
    body footer.site-footer #block-20 figure:hover img,
    body footer.site-footer .footer-extras .footer-social ul li a:hover {
        transform: none;
    }
}