/* DANCING SCRIPT */
@font-face {
  font-display: swap; 
  font-family: 'Dancing Script';
  font-style: normal;
  font-weight: 400;
  src: url('../webfonts/dancing-script-v29-latin-regular.woff2') format('woff2');
}

/* LIBRE BASKERVILLE */
@font-face {
  font-display: swap; 
  font-family: 'Libre Baskerville';
  font-style: normal;
  font-weight: 400;
  src: url('../webfonts/libre-baskerville-v24-latin-regular.woff2') format('woff2');
}
@font-face {
  font-display: swap; 
  font-family: 'Libre Baskerville';
  font-style: italic;
  font-weight: 400;
  src: url('../webfonts/libre-baskerville-v24-latin-italic.woff2') format('woff2');
}
@font-face {
  font-display: swap; 
  font-family: 'Libre Baskerville';
  font-style: normal;
  font-weight: 700;
  src: url('../webfonts/libre-baskerville-v24-latin-700.woff2') format('woff2');
}

/* PLAYFAIR DISPLAY */
@font-face {
  font-display: swap; 
  font-family: 'Playfair Display';
  font-style: normal;
  font-weight: 400;
  src: url('../webfonts/playfair-display-v40-latin-regular.woff2') format('woff2');
}
@font-face {
  font-display: swap; 
  font-family: 'Playfair Display';
  font-style: italic;
  font-weight: 400;
  src: url('../webfonts/playfair-display-v40-latin-italic.woff2') format('woff2');
}
@font-face {
  font-display: swap; 
  font-family: 'Playfair Display';
  font-style: normal;
  font-weight: 700;
  src: url('../webfonts/playfair-display-v40-latin-700.woff2') format('woff2');
}
@font-face {
  font-display: swap; 
  font-family: 'Playfair Display';
  font-style: italic;
  font-weight: 700;
  src: url('../webfonts/playfair-display-v40-latin-700italic.woff2') format('woff2');
}

/* RALEWAY */
@font-face {
  font-display: swap; 
  font-family: 'Raleway';
  font-style: normal;
  font-weight: 300;
  src: url('../webfonts/raleway-v37-latin-300.woff2') format('woff2');
}
@font-face {
  font-display: swap; 
  font-family: 'Raleway';
  font-style: normal;
  font-weight: 400;
  src: url('../webfonts/raleway-v37-latin-regular.woff2') format('woff2');
}
@font-face {
  font-display: swap; 
  font-family: 'Raleway';
  font-style: normal;
  font-weight: 500;
  src: url('../webfonts/raleway-v37-latin-500.woff2') format('woff2');
}
@font-face {
  font-display: swap; 
  font-family: 'Raleway';
  font-style: normal;
  font-weight: 600;
  src: url('../webfonts/raleway-v37-latin-600.woff2') format('woff2');
}
:root {
    --crema:      #FDF6EE;
    --crema-deep: #F5EAD8;
    --rosa:       #D4A5A0;
    --rosa-soft:  #EDD5D0;
    --rosa-deep:  #B07870;
    --oro:        #C4973A;
    --oro-soft:   #E8D5A0;
    --pietra:     #5C4A48;
    --borgogna:   #7A3D3A;
    --testo:      #2C1F1E;
    --grigio:     #8A7A72;
    --bianco:     #FFFFFF;
}

* { margin: 0; padding: 0; box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
    background: var(--crema);
    color: var(--testo);
    font-family: 'Raleway', sans-serif;
    font-weight: 300;
    overflow-x: hidden;
}

/* ──────────────────────────────────────────────────────────────
   NAVIGAZIONE
   ────────────────────────────────────────────────────────────── */
nav {
    position: fixed; top: 0; left: 0; right: 0; z-index: 100;
    display: flex; justify-content: space-between; align-items: center;
    padding: 1.3rem 4rem;
    background: rgba(253,246,238,0.94);
    backdrop-filter: blur(14px);
    border-bottom: 1px solid rgba(196,151,58,0.2);
    transition: box-shadow 0.3s;
}
nav.scrolled { box-shadow: 0 2px 30px rgba(44,31,30,0.07); }
.nav-logo {
    font-family: 'Playfair Display', serif;
    font-size: 1rem; font-style: italic;
    color: var(--borgogna); text-decoration: none;
    letter-spacing: 0.02em;
}
.nav-links { display: flex; gap: 2.5rem; list-style: none; align-items: center; }
.nav-links a {
    font-size: 0.72rem; letter-spacing: 0.16em;
    text-transform: uppercase; color: var(--grigio);
    text-decoration: none; font-weight: 500;
    transition: color 0.3s;
}
.nav-links a:hover { color: var(--borgogna); }
.nav-prenota {
    background: var(--borgogna) !important;
    color: var(--crema) !important;
    padding: 0.55rem 1.4rem;
    border-radius: 2px;
}
.nav-prenota:hover { background: var(--rosa-deep) !important; }

/* ──────────────────────────────────────────────────────────────
   HERO REVISIONATA (V7)
   ────────────────────────────────────────────────────────────── */
#hero {
    position: relative; 
    height: 80vh; 
    width: 100%; 
    overflow: hidden; 
    display: flex; 
    align-items: stretch; 
    background-color: var(--bianco);
    margin-top: 0;
}
.hero-background {
    position: absolute; 
    top: 0; left: 0; 
    width: 100%; height: 100%; 
    background-image: url('../../images/torre4.jpg'); 
    background-size: cover; 
    background-position: center 30%; 
    filter: blur(3px) brightness(0.65); 
    z-index: 1;
}
.hero-left-velo {
    position: relative; 
    z-index: 2; 
    width: 50%; 
    height: 100%; 
    background: linear-gradient(to right, rgba(253, 246, 238, 1) 0%, rgba(253, 246, 238, 0.92) 70%, rgba(253, 246, 238, 0) 100%);
    display: flex; 
    flex-direction: column; 
    justify-content: center; 
    padding: 0 10% 0 5%;
    backdrop-filter: blur(3px);
}
.hero-logo-perno {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 10;
    width: 230px;
}
.hero-logo-perno img {
    width: 100%; 
    height: auto; 
    border-radius: 50%; 
    border: 6px solid var(--crema); 
    box-shadow: 0 10px 30px rgba(0,0,0,0.3);
}

/* ──────────────────────────────────────────────────────────────
   ISPIRAZIONE TORRE
   ────────────────────────────────────────────────────────────── */
#ispirazione-torre {
    padding: 0;
    display: grid;
    grid-template-columns: 50% 50%;
    min-height: 700px;
    background: var(--crema);
    overflow: hidden;
}
.ispirazione-img-wrap {
    position: relative;
    overflow: hidden;
}
.ispirazione-img-wrap img {
    width: 100%; height: 100%;
    object-fit: cover;
    display: block;
    filter: sepia(0.1) contrast(1.05);
    transition: transform 0.8s ease;
}
.ispirazione-img-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(to right, transparent 70%, var(--crema) 100%);
}
.ispirazione-badge {
    position: absolute;
    top: 3rem; left: 3rem;
    background: var(--borgogna);
    color: var(--crema);
    padding: 1.2rem 1.6rem;
    font-family: 'Playfair Display', serif;
    font-size: 1.8rem;
    font-weight: 700;
    z-index: 2;
    box-shadow: 10px 10px 0px var(--oro);
}
.ispirazione-text {
    padding: 6rem 5rem 6rem 4rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.ispirazione-blockquote {
    border-left: 3px solid var(--oro);
    padding-left: 1.5rem;
    margin: 1.5rem 0 2rem 0;
}
.ispirazione-blockquote p {
    font-family: 'Libre Baskerville', serif;
    font-size: 1.1rem;
    font-style: italic;
    color: var(--borgogna);
}

/* ──────────────────────────────────────────────────────────────
   ESPERIENZE (Layout Proporzionato)
   ────────────────────────────────────────────────────────────── */
#esperienze {
    padding: 8rem 0;
    background-color: var(--crema);
}
.esp-intro {
    max-width: 1300px;
    margin: 0 auto 5rem;
    padding: 0 2rem;
    display: grid;
    grid-template-columns: 1.2fr 1fr;
    gap: 6rem;
    align-items: end;
}
.esp-intro h2 {
    font-family: 'Playfair Display', serif;
    font-size: clamp(3rem, 5vw, 4.8rem);
    font-weight: 700;
    line-height: 1.1;
    color: var(--testo);
    margin: 0;
}
.esp-intro h2 em {
    font-style: italic;
    color: var(--borgogna);
}
.esp-intro p {
    font-size: 1.1rem;
    line-height: 1.8;
    color: var(--testo-light);
}
.esp-masonry {
    max-width: 1300px;
    margin: 0 auto;
    padding: 0 2rem;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 2.5rem;
}
.esp-item {
    background: #fff;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 10px 30px rgba(0,0,0,0.05);
    display: flex;
    flex-direction: column;
    height: 100%;
}
.esp-item-img-wrap {
    width: 100%;
    height: 300px;
    overflow: hidden;
}
.esp-item-img-wrap img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.esp-item-label {
    padding: 2.5rem;
    flex-grow: 1;
}
.esp-item-label h3 {
    font-family: 'Playfair Display', serif;
    font-size: 1.8rem;
    color: var(--testo);
    margin: 1rem 0;
}
.esp-item-label p {
    font-size: 0.95rem;
    line-height: 1.7;
    color: var(--testo-light);
}

/* ──────────────────────────────────────────────────────────────
   NOTTE E RELAX
   ────────────────────────────────────────────────────────────── */
#notte {
    position: relative; 
    height: 600px; 
    overflow: hidden;
    display: flex; 
    align-items: center;
    justify-content: center;
}
#notte img { 
    position: absolute;
    top: 0; left: 0;
    width: 100%; height: 100%; 
    object-fit: cover; 
    object-position: center; 
    z-index: 0;
}
#notte::after {
    content: '';
    position: absolute; 
    inset: 0;
    background: linear-gradient(to bottom, rgba(44,31,30,0.3) 0%, rgba(44,31,30,0.7) 100%);
    z-index: 1;
}
.notte-text {
    position: relative; 
    z-index: 2; 
    width: 90%;
    max-width: 800px; 
    text-align: center;
}
.notte-text blockquote {
    font-family: 'Playfair Display', serif;
    font-size: clamp(1.4rem, 4vw, 2.6rem); 
    font-style: italic; 
    font-weight: 400;
    color: var(--crema); 
    line-height: 1.3;
    margin-bottom: 1.5rem;
}
.notte-text cite {
    font-size: 0.65rem; 
    font-weight: 600;
    letter-spacing: 0.3em; 
    text-transform: uppercase;
    color: #FFFFFF; 
    font-style: normal;
    display: block; 
}
.relax-section {
    padding: 10rem 0;
    background-color: var(--crema);
    overflow: hidden;
}
.relax-container {
    max-width: 1300px;
    margin: 0 auto;
    padding: 0 2rem;
    display: grid;
    grid-template-columns: 1fr 1.2fr;
    gap: 8rem;
    align-items: center;
}
.relax-text h2 {
    font-family: 'Playfair Display', serif;
    font-size: clamp(3rem, 5vw, 4.5rem);
    line-height: 1.1;
    margin-bottom: 2rem;
    color: var(--testo);
}
.relax-text h2 em {
    color: var(--borgogna);
    font-style: italic;
}
.relax-text p {
    font-size: 1.1rem;
    line-height: 1.8;
    color: var(--testo-light);
    margin-bottom: 1.5rem;
}
.relax-features {
    display: flex;
    flex-wrap: wrap;
    justify-content: center; 
    gap: 1.2rem;
    margin-top: 3.5rem;
    max-width: 600px;
    margin-left: auto;
    margin-right: auto;
}
.tag-relax {
    padding: 0.7rem 1.4rem;
    background: #fdf6ee;
    border: 1px solid var(--oro-soft);
    border-radius: 50px;
    font-size: 0.88rem;
    color: var(--testo-light);
    white-space: nowrap; 
    transition: all 0.3s ease;
}
.tag-relax:hover {
    background: var(--oro-soft);
    color: var(--testo);
    transform: translateY(-2px);
}
.relax-gallery {
    position: relative;
    height: 600px;
}
.img-big {
    width: 80%;
    height: 450px;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 20px 40px rgba(0,0,0,0.1);
}
.img-small-top {
    position: absolute;
    top: 10%; right: 0;
    width: 45%; height: 300px;
    border: 8px solid #fff;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 15px 35px rgba(0,0,0,0.15);
    z-index: 2;
}
.img-small-bottom {
    position: absolute;
    bottom: 0; left: 20%;
    width: 40%; height: 250px;
    border: 8px solid #fff;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 15px 35px rgba(0,0,0,0.15);
    z-index: 3;
}
.relax-gallery img {
    width: 100%; height: 100%;
    object-fit: cover;
}

/* ==========================================================================
   COMPONENTE UNIVERSALE: CTA PRENOTAZIONE PREMIUM
   ========================================================================== */
.global-cta-prenota {
    position: relative;
    padding: 120px 0;
    background-color: var(--borgogna); 
    overflow: hidden;
}

/* Il timbro in filigrana */
.global-cta-prenota .timbro-watermark {
    position: absolute;
    left: 3%;
    top: 50%;
    transform: translateY(-50%) rotate(-12deg);
    opacity: 0.12;
    pointer-events: none;
    z-index: 1;
}

.global-cta-prenota .timbro-watermark img {
    width: 300px;
    filter: grayscale(1) contrast(1.2);
    mix-blend-mode: screen;
}

/* Contenitore e Griglia a due colonne */
.global-cta-prenota-container {
    position: relative;
    z-index: 2;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 40px;
}

.global-cta-grid {
    display: grid;
    grid-template-columns: 1fr 0.8fr;
    gap: 60px;
    align-items: center;
    margin-left: 100px; /* Spazio per il timbro a sinistra */
}

/* Colonna di sinistra: Testo e Bottone */
.global-cta-info {
    padding-left: 40px;
    text-align: left;
}

.global-cta-info .tag-soggiorni {
    color: var(--oro-soft); 
    text-transform: uppercase;
    letter-spacing: 3px;
    font-size: 0.8rem;
    font-weight: 600;
    display: block;
    margin-bottom: 10px;
}

.global-cta-info h2 {
    font-family: 'Playfair Display', serif;
    font-size: 3.2rem;
    color: var(--crema); 
    margin: 15px 0;
    line-height: 1.1;
}

.global-cta-info p {
    color: #EDD5D0; 
    font-size: 1.1rem;
    line-height: 1.8;
    margin-bottom: 35px;
}

.global-cta-info .btn-filled {
    background-color: var(--oro); 
    color: var(--borgogna); 
    padding: 18px 40px;
    text-decoration: none;
    font-weight: 700;
    letter-spacing: 1px;
    display: inline-block;
    border-radius: 2px;
    border: none;
    transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
}

.global-cta-info .btn-filled:hover {
    background-color: var(--crema);
    color: var(--borgogna);
    transform: translateY(-3px);
    box-shadow: 0 6px 20px rgba(0,0,0,0.25);
}

/* Colonna di destra: Box con effetto vetro */
.global-cta-box {
    background: rgba(255,255,255,0.04);
    padding: 50px;
    border-radius: 2px;
    border: 1px solid rgba(232, 213, 160, 0.15);
    backdrop-filter: blur(10px);
    text-align: left;
}

.global-cta-box h4 {
    font-family: 'Playfair Display', serif;
    color: var(--oro-soft); 
    margin-bottom: 25px;
    font-size: 1.5rem;
}

.global-cta-box p {
    color: #EDD5D0;
    font-size: 1rem;
    line-height: 1.7;
    margin: 0;
}

/* Adattamento per Smartphone */
@media (max-width: 900px) {
    .global-cta-grid {
        grid-template-columns: 1fr;
        margin-left: 0;
        gap: 40px;
    }
    .global-cta-info {
        padding-left: 0;
        text-align: center;
    }
}

/* ──────────────────────────────────────────────────────────────
   FOOTER
   ────────────────────────────────────────────────────────────── */
.main-footer {
    background-color: #1a1816; 
    color: rgba(255,255,255,0.8);
    padding: 5rem 0 0;
    font-size: 0.9rem;
}
.footer-container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 2rem;
    display: grid;
    grid-template-columns: 1.5fr 1fr 1fr;
    gap: 4rem;
}
.footer-logo-text {
    font-family: 'Playfair Display', serif !important; 
    font-size: 1.2rem;
    font-weight: 300;
    color: #fff;
    letter-spacing: 1px;
    line-height: 1.2;
}
.footer-logo-text em {
    font-family: 'Playfair Display', serif !important;
    font-style: italic !important;
    color: var(--oro); 
    font-weight: 200; 
}
.footer-links {
    list-style: none;
    padding: 0;
}
.footer-links li {
    margin-bottom: 0.8rem;
}
.footer-links a {
    color: inherit;
    text-decoration: none;
    transition: color 0.3s;
}
.footer-links a:hover {
    color: var(--oro);
}
.footer-social {
    display: flex;
    gap: 1.5rem;
    margin-bottom: 2rem;
    font-size: 1.5rem;
}
.footer-social a {
    color: var(--oro);
    transition: transform 0.3s;
}
.footer-social a:hover {
    transform: translateY(-3px);
}
.legal-links {
    display: flex;
    gap: 1.5rem;
    border-top: 1px solid rgba(255,255,255,0.1);
    padding-top: 1.5rem;
}
.footer-bottom {
    margin-top: 4rem;
    padding: 2rem 0;
    border-top: 1px solid rgba(255,255,255,0.05);
    background: #151311;
    text-align: center;
}
.footer-bottom .footer-container {
    display: flex;
    justify-content: space-between;
    align-items: center;
    grid-template-columns: none; 
}
.tekfriend-credit a {
    color: var(--oro);
    text-decoration: none;
    font-weight: 700;
}
.tekfriend-credit span {
    font-style: italic;
    opacity: 0.8;
}

/* --- NUOVO MENU ORIZZONTALE FOOTER --- */
.footer-nav-menu {
    display: block;
    clear: both;
    border-top: 1px solid rgba(255,255,255,0.1);
    border-bottom: 1px solid rgba(255,255,255,0.1);
    padding: 1.5rem 0;
    margin: 2rem 0;
    text-align: center;
    background-color: #1a1816;
    position: relative;
    z-index: 10;
}
.footer-menu-list {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 2rem;
    list-style: none;
    margin: 0;
    padding: 0;
}

.footer-menu-list a {
    color: #fff;
    text-transform: uppercase;
    font-size: 0.8rem;
    letter-spacing: 2px;
    text-decoration: none;
    transition: color 0.3s;
}

.footer-menu-list a:hover {
    color: var(--oro);
}

/* ──────────────────────────────────────────────────────────────
   ANIMAZIONI E TIMELINE
   ────────────────────────────────────────────────────────────── */
.reveal, .reveal-delay-1, .reveal-delay-2, .reveal-left, .reveal-right { opacity: 1; transform: none; }
@keyframes fadeUp { from{opacity:0;transform:translateY(22px)} to{opacity:1;transform:translateY(0)} }
.hero-tag      { animation:fadeUp 0.8s ease forwards 0.3s; opacity:0; }
.hero-title    { animation:fadeUp 0.8s ease forwards 0.5s; opacity:0; }
.hero-subtitle { animation:fadeUp 0.8s ease forwards 0.7s; opacity:0; }
.hero-btns     { animation:fadeUp 0.8s ease forwards 0.9s; opacity:0; }

.side-timeline {
    position: fixed;
    left: 2rem;
    top: 50%;
    transform: translateY(-50%);
    z-index: 90;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2.5rem;
}
.timeline-line {
    position: absolute;
    top: 0; bottom: 0; left: 50%;
    width: 1px;
    background: rgba(196, 151, 58, 0.2);
    z-index: -1;
}
.timeline-step {
    position: relative;
    width: 10px; height: 10px;
    background: var(--crema-deep);
    border: 1px solid var(--oro);
    border-radius: 50%;
    transition: all 0.4s ease;
}
.timeline-step::before {
    content: attr(data-sec);
    position: absolute;
    left: 20px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 0.65rem;
    font-family: 'Playfair Display', serif;
    color: var(--oro);
    opacity: 0.4;
    transition: all 0.4s ease;
}
.timeline-step.active {
    background: var(--borgogna);
    border-color: var(--borgogna);
    transform: scale(1.3);
}
.timeline-step.active::before {
    opacity: 1;
    font-weight: 700;
    transform: translateY(-50%) scale(1.2);
}

/* ──────────────────────────────────────────────────────────────
   SEZIONI INTERNE E B2B (Moduli Condivisi)
   ────────────────────────────────────────────────────────────── */
.hero-interna {
    height: 60vh;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    background-size: cover;
    background-position: center;
    overflow: hidden;
}
.hero-interna::before {
    content: '';
    position: absolute;
    inset: 0;
    background: rgba(253, 246, 238, 0.75); 
    z-index: 1;
}
.hero-interna .container {
    position: relative;
    z-index: 2;
}
.hero-interna .playfair-title {
    color: var(--borgogna);
    font-size: 3.5rem;
    margin-bottom: 10px;
}
.hero-interna .raleway-subtitle {
    color: var(--pietra);
    font-size: 1.2rem;
    max-width: 700px;
    margin: 0 auto;
}

/* Layout a righe / Prodotti base */
.exp-section { padding: 80px 0; }
.exp-row {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 40px;
    margin-bottom: 80px;
}
.exp-row.reverse { flex-direction: row-reverse; }
.exp-img-placeholder {
    flex: 1;
    min-width: 300px;
    height: 450px;
    background-color: #eee;
    border: 1px dashed var(--oro);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--borgogna);
}
.exp-text { flex: 1; min-width: 300px; }
.exp-tag {
    color: var(--oro);
    text-transform: uppercase;
    letter-spacing: 2px;
    font-weight: 600;
    font-size: 0.8rem;
    margin-bottom: 10px;
    display: block;
}

/* Galleria Cucina */
.gallery-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 30px;
    margin-top: 40px;
}
.gallery-item {
    text-align: center;
    background: var(--bianco);
    padding: 20px;
    border-radius: 4px;
    transition: transform 0.3s;
}
.gallery-item:hover { transform: translateY(-5px); }
.gallery-item .img-placeholder {
    height: 250px;
    background-color: #eee;
    border: 1px dashed var(--oro);
    margin-bottom: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--borgogna);
}

/* Modali Legali */
.modal-legal {
    display: none;
    position: fixed;
    z-index: 9999;
    inset: 0;
    background-color: rgba(0,0,0,0.8);
    backdrop-filter: blur(5px);
}
.modal-content-legal {
    background-color: var(--crema);
    margin: 5% auto;
    padding: 40px;
    border: 1px solid var(--oro);
    width: 80%;
    max-width: 900px;
    max-height: 80vh;
    overflow-y: auto;
    position: relative;
    border-radius: 4px;
}
.close-modal {
    position: absolute;
    right: 20px; top: 15px;
    color: var(--borgogna);
    font-size: 30px; font-weight: bold; cursor: pointer;
}

/* Antologia Viaggio */
.antologia-viaggio { 
    position: relative; 
    padding: 120px 0; 
    background-color: var(--crema);
}
.antologia-line {
    position: absolute;
    left: 50%; top: 0; bottom: 0;
    width: 2px;
    background: rgba(196, 151, 58, 0.3);
    transform: translateX(-50%);
    z-index: 1;
}
.antologia-step {
    position: relative;
    margin-bottom: 150px; 
    z-index: 2;
    display: flex;
    justify-content: center;
}
.arabic-number {
    position: absolute;
    left: 50%;
    top: -40px;
    transform: translateX(-50%);
    background: var(--crema);
    color: var(--borgogna);
    font-family: 'Playfair Display', serif;
    font-size: 2.2rem;
    font-weight: 700;
    width: 80px; height: 80px;
    display: flex; align-items: center; justify-content: center;
    border: 2px solid var(--oro);
    border-radius: 50%;
    z-index: 5;
    box-shadow: 0 0 0 12px var(--crema);
}
.antologia-card {
    background: var(--bianco);
    width: 95%; max-width: 1200px;
    display: grid;
    grid-template-columns: 1fr 1.1fr; 
    align-items: center;
    padding: 80px;
    border-radius: 4px;
    box-shadow: 0 30px 60px rgba(44,31,30,0.08);
    gap: 80px;
    border: 1px solid rgba(196, 151, 58, 0.1);
}
.antologia-step.reverse .antologia-card { direction: rtl; }
.antologia-step.reverse .antologia-text { direction: ltr; }
.antologia-text h2 {
    font-size: 3.8rem; 
    margin-bottom: 25px;
    line-height: 1.1;
    color: var(--borgogna);
}
.antologia-text h2 em {
    font-family: 'Dancing Script', cursive; 
    font-weight: 400;
    color: var(--oro);
}
.product-focus {
    font-weight: 700; color: var(--pietra);
    margin-bottom: 15px; font-size: 1rem;
    text-transform: uppercase; letter-spacing: 2px;
    display: block;
}
.citazione-prodotto {
    font-family: 'Libre Baskerville', serif;
    font-style: italic; font-size: 1.35rem; 
    line-height: 1.7; color: var(--testo);
    border-left: 3px solid var(--oro);
    padding-left: 30px; margin-top: 25px; max-width: 550px;
}
.polaroid {
    background: #fff;
    padding: 20px 20px 60px 20px;
    box-shadow: 0 20px 45px rgba(0,0,0,0.15);
    border: 1px solid #f0f0f0;
    transition: all 0.5s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    max-width: 380px; 
}
.polaroid img {
    width: 100%; height: 350px; object-fit: cover;
}
.handwritten {
    font-family: 'Dancing Script', cursive;
    font-size: 1.6rem; text-align: center;
    margin-top: 20px; color: var(--grigio);
}
.polaroid-stack {
    position: relative; height: 450px; width: 100%;
    display: flex; align-items: center; justify-content: center;
}
.p-1 { transform: rotate(-5deg) translateX(30px); z-index: 1; }
.p-2 { transform: rotate(6deg) translateX(-30px); z-index: 2; }
.p-solo { transform: rotate(-3deg); margin: 0 auto; }
.antologia-card:hover .polaroid { transform: rotate(0deg) scale(1.08); z-index: 10; }

/* Piatti Slider Orizzontale */
.piatti-slider-container {
    display: flex; flex-direction: row; justify-content: center; 
    gap: 60px; padding: 60px 0; flex-wrap: nowrap; overflow-x: auto; 
}
.piatto-item {
    flex: 0 0 auto; width: 300px; text-align: center;
}
.piatto-circle {
    width: 280px; height: 280px;
    border-radius: 50%; overflow: hidden; 
    border: 10px solid var(--bianco);
    box-shadow: 0 20px 40px rgba(0,0,0,0.1);
    margin: 0 auto 25px auto; transition: transform 0.4s ease;
}
.piatto-circle img {
    width: 100%; height: 100%; object-fit: cover; object-position: center; 
}
.piatto-item:hover .piatto-circle {
    transform: scale(1.05) translateY(-10px);
    border-color: var(--oro-soft);
}
.piatto-item h4 {
    font-size: 1.6rem; color: var(--borgogna);
    font-family: 'Playfair Display', serif;
}

/* CTA B2B Potenziata */
.b2b-cta-section {
    background-color: var(--borgogna);
    color: var(--crema);
    padding: 70px 0;
    position: relative;
    overflow: hidden;
}
.b2b-cta-section::after {
    content: 'B2B'; position: absolute;
    right: -50px; bottom: -20px;
    font-size: 15rem; font-family: 'Playfair Display', serif;
    font-weight: 900; color: rgba(196, 151, 58, 0.05); z-index: 1;
}
.b2b-cta-section .container {
    max-width: 1000px; margin: 0 auto;
}
.b2b-grid {
    display: grid; grid-template-columns: 1.2fr 0.8fr;
    gap: 80px; align-items: center; position: relative; z-index: 2;
}
.b2b-info h2 { font-size: 3.5rem; color: var(--oro); margin-bottom: 25px; }
.b2b-info p { font-size: 1.2rem; line-height: 1.7; margin-bottom: 40px; opacity: 0.9; }
.b2b-services {
    list-style: none; display: grid; grid-template-columns: 1fr 1fr; gap: 20px;
}
.b2b-services li {
    font-size: 0.9rem; text-transform: uppercase; letter-spacing: 1px;
    display: flex; align-items: center; gap: 10px; color: var(--oro-soft);
}
.b2b-services li::before { content: '✦'; font-size: 0.7rem; }
.btn-b2b {
    background: var(--oro); color: var(--borgogna);
    padding: 1.2rem 2.5rem; font-weight: 700; text-decoration: none;
    display: inline-block; transition: all 0.3s; border: 1px solid var(--oro);
}
.btn-b2b:hover { background: transparent; color: var(--oro); transform: translateY(-5px); }

/* Classi Utility */
.text-center { text-align: center; }
.playfair-title { font-family: 'Playfair Display', serif; font-size: 2.5rem; margin-bottom: 1rem; }
.section-padding { padding: 80px 0; }

/* ──────────────────────────────────────────────────────────────
   MEDIA QUERIES GLOBALI E OTTIMIZZATE
   ────────────────────────────────────────────────────────────── */

/* --- TABLET ORIZZONTALI / LAPTOP --- */
@media (max-width: 1100px) {
    .side-timeline { display: none; }
}

/* --- TABLET VERTICALI --- */
@media (max-width: 992px) {
    .esp-masonry { grid-template-columns: 1fr; gap: 2rem; }
    .esp-item-img-wrap { height: 250px; }
    .b2b-grid { grid-template-columns: 1fr; gap: 40px; text-align: center; }
    .b2b-services { justify-content: center; }
}

/* --- DISPOSITIVI MOBILI GRANDI --- */
@media (max-width: 900px) {
    /* Navigazione */
    nav { padding: 1rem 1.5rem; }
    .nav-links { display: none; }
    
    /* Hero */
    #hero {
        flex-direction: column !important;
        height: auto !important;
        min-height: 100vh !important;
        padding-top: 72px;
    }
    .hero-left-velo {
        width: 100% !important;
        padding: 120px 20px 60px !important;
        background: linear-gradient(to bottom, rgba(253, 246, 238, 1) 60%, rgba(253, 246, 238, 0) 100%) !important;
        text-align: center !important;
    }
    .hero-logo-perno {
        position: relative !important;
        top: 0 !important; left: 50% !important;
        transform: translate(-50%, 40px) !important;
        width: 180px !important; margin-bottom: -40px !important;
    }
    .hero-right { height: 60vw; min-height: 300px; }
    .hero-btns { justify-content: center; }
    .hero-card {
        position: relative; bottom: 0; left: 0; width: 100%;
        margin: 0; box-shadow: none; border-top: 1px solid var(--rosa-soft);
        text-align: center; padding: 2rem 1.5rem;
    }
    
    /* Striscia & Vari */
    .striscia { padding: 0.6rem 0; min-height: 12px; justify-content: center; }
    .striscia-item { display: none !important; }
    #storia { grid-template-columns: 1fr; }
    .storia-img-wrap { height: 60vw; }
    .storia-img-overlay { background: linear-gradient(to bottom, transparent 60%, var(--crema) 100%); }
    
    /* Torre (Corretto l'errore di nidificazione) */
    #torre { display: flex; justify-content: flex-end; align-items: center; padding: 2rem; }
    .torre-content {
        margin-left: 0; /* Punto e virgola riparato */
        margin-right: 0;
        width: 90%;
        background: rgba(253, 246, 238, 0.85);
        padding: 2rem 1.5rem;
        backdrop-filter: blur(5px);
    }
    
    /* Griglie Varie */
    .esp-intro, .relax-inner, .prenota-inner { grid-template-columns: 1fr; gap: 3rem; }
    .esp-masonry { grid-template-columns: 1fr; grid-template-rows: auto; }
    .esp-item:first-child { grid-row: auto; }
    .esp-item:first-child img, .esp-item:not(:first-child) img { height: 280px; }
    .relax-imgs { height: 320px; }
    #esperienze, #relax, #prenota { padding: 5rem 1.5rem; }
    .footer-top { grid-template-columns: 1fr; }
    .notte-text blockquote { font-size: 1.4rem; }
    
    /* Antologia B2B e Prodotti */
    .antologia-step {
        display: flex !important; flex-direction: column !important;
        gap: 30px !important; margin-bottom: 60px !important;
    }
    .antologia-card {
        grid-template-columns: 1fr !important;
        padding: 30px 20px !important; width: 100% !important;
    }
    .antologia-visual, .polaroid-stack {
        height: auto !important; min-height: 350px !important;
        width: 100% !important; display: flex !important;
        justify-content: center !important; align-items: center !important;
    }
    .polaroid {
        position: relative !important; left: 0 !important; right: 0 !important;
        transform: none !important; width: 90% !important;
        max-width: 320px !important; margin: 0 auto !important;
    }
    .polaroid img { height: 250px !important; width: 100% !important; object-fit: cover !important; }
    .cta-grid-responsive { grid-template-columns: 1fr !important; margin-left: 0 !important; gap: 40px !important; }
    .cta-info { padding-left: 0 !important; text-align: center !important; }
}

/* --- MOBILE E SMARTPHONE PICCOLI --- */
@media (max-width: 768px) {
    .footer-container { grid-template-columns: 1fr; gap: 3rem; }
    .footer-bottom .footer-container { flex-direction: column; gap: 1rem; }
    .legal-links { justify-content: center; }
    
    /* Regole aggiunte per far incolonnare il menu orizzontale */
    .footer-menu-list { gap: 15px; }
    .footer-menu-list li { width: 100%; text-align: center; }
}
/* ──────────────────────────────────────────────────────────────
   PATCH W3C, ACCESSIBILITÀ (A11y) E PERFORMANCE
   ────────────────────────────────────────────────────────────── */

/* 1. Visibilità dello stato (Eurisitica 1): Focus visibile per chi naviga da tastiera */
a:focus-visible, 
button:focus-visible, 
input:focus-visible, 
textarea:focus-visible {
    outline: 2px dashed var(--borgogna);
    outline-offset: 4px;
    border-radius: 2px;
}

/* 2. Rispetto delle preferenze utente (A11y): Disabilita le animazioni per chi soffre di disturbi vestibolari */
@media (prefers-reduced-motion: reduce) {
    *, ::before, ::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
}

/* 3. Prevenzione Layout Shift (Core Web Vitals): Immagini fluide di default e stile fallback */
img {
    max-width: 100%;
    height: auto;
    font-style: italic; /* Mostra in corsivo l'alt text se l'immagine non si carica */
    background-repeat: no-repeat;
    background-size: cover;
}

/* 4. Prevenzione Errori (Euristica 5): Feedback visivo sui form validi/invalidi (preparazione per contatti.php) */
input:user-invalid, 
textarea:user-invalid {
    border-color: var(--rosa-deep);
    background-color: rgba(176, 120, 112, 0.05);
}
/* ──────────────────────────────────────────────────────────────
   MODALI LEGALI (Privacy & Cookie)
   ────────────────────────────────────────────────────────────── */
.modal-legal {
    display: none;
    position: fixed;
    z-index: 9999;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0,0,0,0.8);
    backdrop-filter: blur(5px);
}

.modal-content-legal {
    background-color: var(--crema);
    margin: 5% auto;
    padding: 40px;
    border: 1px solid var(--oro);
    width: 80%;
    max-width: 900px;
    max-height: 80vh;
    overflow-y: auto;
    position: relative;
    border-radius: 4px;
}

.close-modal {
    position: absolute;
    right: 20px;
    top: 15px;
    color: var(--borgogna);
    font-size: 30px;
    font-weight: bold;
    cursor: pointer;
    transition: color 0.3s; /* Aggiunta transizione morbida nativa */
}

.close-modal:hover { 
    color: var(--oro); 
}
/* ──────────────────────────────────────────────────────────────
   RESET W3C PER FOOTER SEMANTICO
   ────────────────────────────────────────────────────────────── */
address.footer-col {
    font-style: normal;
}
/* ==========================================================================
   ARCHITETTURA PREDITTIVA: HERO MULTIMEDIALE (Flessibilità Video/Gallery)
   ========================================================================== */

/* 1. Il Contenitore Principale (Preserva le geometrie inline approvate) */
.hero-full-velo {
    position: relative;
    height: 80vh;
    width: 100%;
    overflow: hidden;
    display: flex;
    align-items: stretch;
    background-color: #000; /* Fondo nero di sicurezza per il caricamento dei media */
    margin-top: 0;
}

/* 2. CLASSE ASTRATTA UNIVERSALE: Valida per Immagini, Video o Slide di una Gallery */
.hero-media-cover {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center 30%;
    filter: blur(3px) brightness(0.65);
    z-index: 1;
    transition: opacity 0.5s ease; /* Pronta per eventuali transizioni della galleria */
}

/* 3. Il Velo Asimmetrico Sinistro (Assorbe il 65% e la sfumatura esatta approvata) */
.hero-left-velo-clean {
    position: relative;
    z-index: 2;
    width: 65%; /* Ripristinato il valore esatto approvato dal cliente */
    height: 100%;
    background: linear-gradient(to right, rgba(253, 246, 238, 1) 0%, rgba(253, 246, 238, 0.92) 70%, rgba(253, 246, 238, 0) 100%);
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 0 10% 0 5%;
    backdrop-filter: blur(3px);
    box-sizing: border-box;
}

/* 4. Elementi Tipografici Interni alla Hero (Pulizia dello stile inline) */
.hero-left-velo-clean .label-oro {
    font-size: 0.9rem;
    letter-spacing: 0.4em;
    color: var(--oro);
    font-weight: 600;
}

.hero-left-velo-clean .playfair-title {
    font-size: clamp(2.5rem, 5vw, 4rem);
    line-height: 1.1;
    margin-top: 15px;
}

.hero-left-velo-clean .playfair-title .title-block {
    color: var(--borgogna);
    display: block;
}

.hero-left-velo-clean .playfair-title em {
    color: var(--oro);
    font-style: italic;
    font-weight: 700;
}

.hero-left-velo-clean .hero-paragraph {
    font-family: 'Raleway', sans-serif;
    font-size: 1.15rem;
    color: var(--pietra);
    margin-top: 25px;
    max-width: 480px;
    line-height: 1.6;
    font-weight: 400;
}

/* 5. Il Perno del Logo Centrale (Invariato ma pulito) */
.hero-logo-perno-clean {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 10;
    width: 230px;
}

.hero-logo-perno-clean img {
    width: 100%;
    height: auto;
    border-radius: 50%;
    border: 6px solid var(--crema);
    box-shadow: 0 10px 30px rgba(0,0,0,0.3);
}

/* ==========================================================================
   ESTRAZIONE CHIRURGICA STILI INLINE - INDEX.PHP
   ========================================================================== */

/* ── 1. COMPONENTE HERO ── */

#hero.hero-full-velo {
    position: relative;
    height: 80vh;
    width: 100%;
    overflow: hidden;
    display: flex;
    align-items: stretch;
    background-color: #000;
    margin-top: 0;
}

#hero .hero-background {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: url('../../images/torre4.jpg');
    background-size: cover;
    background-position: center 30%;
    filter: blur(3px) brightness(0.65);
    z-index: 1;
}

#hero .hero-left-velo {
    position: relative;
    z-index: 2;
    width: 65%;
    height: 100%;
    background: linear-gradient(to right, rgba(253, 246, 238, 1) 0%, rgba(253, 246, 238, 0.92) 70%, rgba(253, 246, 238, 0) 100%);
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 0 10% 0 5%;
    backdrop-filter: blur(3px);
    box-sizing: border-box;
}

#hero .hero-left-velo .label-oro {
    font-size: 0.9rem;
    letter-spacing: 0.4em;
    color: var(--oro);
    font-weight: 600;
}

#hero .hero-left-velo .playfair-title {
    font-size: clamp(2.5rem, 5vw, 4rem);
    line-height: 1.1;
    margin-top: 15px;
}

#hero .hero-left-velo .playfair-title span {
    color: var(--borgogna);
    display: block;
}

#hero .hero-left-velo .playfair-title em {
    color: var(--oro);
    font-style: italic;
    font-weight: 700;
}

#hero .hero-left-velo p {
    font-family: 'Raleway', sans-serif;
    font-size: 1.15rem;
    color: var(--pietra);
    margin-top: 25px;
    max-width: 480px;
    line-height: 1.6;
    font-weight: 400;
}

#hero .hero-logo-perno {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 10;
    width: 230px;
}

#hero .hero-logo-perno img {
    width: 100%;
    height: auto;
    border-radius: 50%;
    border: 6px solid var(--crema);
    box-shadow: 0 10px 30px rgba(0,0,0,0.3);
}


/* ── 2. ECCEZIONI E DETTAGLI ANTOLOGIA ── */

/* Gestione del testo descrittivo nei vari step */
.antologia-text p {
    margin-top: 20px;
}

/* Eccezione di spaziatura specifica per l'ultimo blocco botanico (Step 4) */
.antologia-step.step-botanico-reset {
    margin-bottom: 0 !important;
    padding-bottom: 100px;
}

/* Distanziatore per i link di approfondimento (Step 7, 8, 9) */
.antologia-text .link-wrapper {
    margin-top: 30px;
}

/* Stile per i link con l'effetto bordo inferiore dorato (Step 7, 8, 9) */
.antologia-text .link-scopri {
    text-decoration: none;
    color: var(--oro);
    font-family: 'Montserrat', sans-serif;
    font-size: 0.8rem;
    font-weight: 700;
    letter-spacing: 2px;
    text-transform: uppercase;
    border-bottom: 1px solid var(--oro);
    padding-bottom: 5px;
}

/* Variazione cromatica per lo sfondo della polaroid dei prodotti (Step 9) */
.antologia-visual .polaroid.bg-crema-card {
    background: var(--crema);
}

/* Controllo del colore del testo scritto a mano (Step 9) */
.antologia-visual .polaroid .handwritten.dark-text {
    color: #2c2c2c;
}


/* ── 3. COMPONENTE SEZIONE PRENOTA (CTA FINALE) ── */



/* ==========================================================================
   BURGER MENU RESPONSIVE NATIVO (W3C & UX)
   ========================================================================== */

/* 1. Stile di base del pulsante (Nascosto su Desktop) */

.mobile-toggle {
    display: none;
    flex-direction: column;
    justify-content: space-between;
    width: 30px;
    height: 21px;
    background: transparent;
    border: none;
    cursor: pointer;
    z-index: 110;
    position: relative;
    padding: 0;
    
    /* --- NUOVO RESET OBBLIGATORIO PER SMARTPHONE (iOS/Android) --- */
    -webkit-appearance: none;
    appearance: none;
    border-radius: 0;
    outline: none;
    -webkit-tap-highlight-color: transparent; /* Rimuove l'alone circolare al tocco */
}

.mobile-toggle span {
    width: 100%;
    height: 2px;
    background-color: var(--borgogna);
    transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
    transform-origin: left center;
}

/* 2. Trasformazione dei trattini in una "X" (Stato Aperto) */
.mobile-toggle.open span:nth-child(1) {
    transform: rotate(45deg) translateY(-2px);
    background-color: var(--borgogna);
}

.mobile-toggle.open span:nth-child(2) {
    width: 0%;
    opacity: 0;
}

.mobile-toggle.open span:nth-child(3) {
    transform: rotate(-45deg) translateY(2px);
    background-color: var(--borgogna);
}

/* 3. Comportamento sotto i 900px */
@media (max-width: 900px) {
    .mobile-toggle {
        display: flex; /* Mostra il burger su mobile */
    }

    /* Trasformiamo la lista dei link in un overlay a schermo intero */
    nav .nav-links {
        display: flex !important; /* Sovrascrive il display:none originale */
        flex-direction: column;
        justify-content: center;
        align-items: center;
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100vh;
        background: rgba(253, 246, 238, 0.98); /* var(--crema) quasi opaco */
        backdrop-filter: blur(10px);
        gap: 2.5rem;
        z-index: 105;
        
        /* Animazione di entrata fluida */
        opacity: 0;
        pointer-events: none;
        transform: translateY(-20px);
        transition: all 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
    }

    /* Stato aperto del menu mobile */
    nav .nav-links.open {
        opacity: 1;
        pointer-events: auto;
        transform: translateY(0);
    }

    /* Adattamento grafico dei link per il touch su mobile */
    nav .nav-links a {
        font-size: 1.2rem;
        font-weight: 600;
        letter-spacing: 0.15em;
        color: var(--testo);
    }
}
/* ==========================================================================
   FIX SOVRAPPOSIZIONE NUMERI ANTOLOGIA (MOBILE)
   ========================================================================== */
@media (max-width: 900px) {
    /* 1. Aumentiamo lo spazio interno in alto alla card per spingere giù il testo */
    .antologia-card {
        padding: 60px 20px 30px 20px !important; /* Top 60px, Destra 20px, Bottom 30px, Sinistra 20px */
    }

    /* 2. Scaliamo leggermente il numero per renderlo più elegante su smartphone */
    .arabic-number {
        width: 60px !important;
        height: 60px !important;
        top: -30px !important; /* Lo facciamo sporgere un po' meno */
        font-size: 1.6rem !important;
        box-shadow: 0 0 0 8px var(--crema) !important; /* Riduciamo l'anello color crema */
    }
}
/* ==========================================================================
   STILI x PRODOTTI.PHP
   ========================================================================== */

/* ── 1. MODIFICATORE HERO INTERNA (Specifico per la pagina Prodotti) ── */

/* Classe modificatrice per applicare il velo scuro approvato invece di quello crema */
.hero-interna.hero-dark-overlay::before {
    background: rgba(0, 0, 0, 0.3);
}

/* Centralizzazione della tipografia imponente e colore chiaro per il titolo della Hero prodotti */
.hero-interna .playfair-title.hero-large-title {
    font-size: 3.5rem;
    color: var(--crema); /* Nuovo colore chiaro del brand per contrasto contro fondo scuro */
    position: relative;
    z-index: 2; /* Forza il posizionamento sopra il velo scuro */
}

/* Assicura la corretta gerarchia e colore chiaro del sottotitolo sopra l'overlay */
.hero-interna .raleway-subtitle {
    color: var(--crema); /* Nuovo colore chiaro del brand per contrasto contro fondo scuro */
    position: relative;
    z-index: 2;
}


/* ── 2. UTILITY E DETTAGLI B2B ── */

/* Helper class per gestire il colore oro soft dell'etichetta senza sporcare l'HTML */
.b2b-cta-section .tag-oro-soft {
    color: var(--oro-soft);
}
/* ==========================================================================
   ESTRAZIONE CHIRURGICA STILI INLINE - STORIA.PHP (DEFINITIVO RITORNO ORIGINI)
   ========================================================================== */

/* ── 1. SEZIONE IDENTITÀ (SEZIONE BIANCA) ── */
.storia-identity-section {
    background-color: var(--bianco);
}

.storia-identity-container {
    max-width: 800px;
    margin: 0 auto;
}

/* Il logo riportato alla base: ridimensionato a misura aurea ed elegante */
.storia-logo-brand {
    max-width: 160px; /* Calibrato per non essere né gigante né invisibile */
    margin-bottom: 25px;
    height: auto;
    display: inline-block;
}

.storia-identity-section h2 {
    color: var(--borgogna);
}

.storia-identity-section p {
    font-size: 1.1rem;
    line-height: 1.8;
    color: var(--testo);
}


/* ── 2. SEZIONE TIMELINE / STORIA (SEZIONE CREMA) ── */
.storia-timeline-section {
    background-color: var(--crema);
}

.storia-timeline-section .exp-text {
    padding: 0 20px;
}

.storia-timeline-section .exp-text h2 {
    color: var(--borgogna);
    font-size: 2.2rem;
}

.storia-timeline-section .exp-text p {
    font-size: 1.1rem;
    line-height: 1.6;
    color: var(--testo);
}

/* Stile temporaneo elegante per i segnaposto delle foto */
.storia-timeline-section .exp-img-placeholder {
    background-color: rgba(122, 61, 58, 0.05);
    border: 1px dashed var(--borgogna);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 40px;
    text-align: center;
    min-height: 250px;
    color: var(--borgogna);
    font-family: 'Raleway', sans-serif;
    font-size: 0.9rem;
    letter-spacing: 1px;
}

/* ==========================================================================
   PAGINA: LA FAMIGLIA (Ex Storia)
   ========================================================================== */

.famiglia-section { 
    padding: 100px 0; 
    background-color: var(--crema); 
}

.famiglia-section.bg-bianco { 
    background-color: var(--bianco); 
}

/* Intro testuale centrale */
.famiglia-intro { 
    max-width: 800px; 
    margin: 0 auto 80px; 
    text-align: center; 
    padding: 0 40px; 
}

.famiglia-intro h2 { 
    font-family: 'Playfair Display', serif; 
    font-size: 2.8rem; 
    color: var(--borgogna); 
    margin-bottom: 25px; 
    line-height: 1.2;
}

.famiglia-intro h2 em {
    color: var(--oro); 
    font-style: italic;
}

.famiglia-intro p { 
    font-size: 1.15rem; 
    line-height: 1.8; 
    color: var(--testo); 
}

/* Griglia per Foto e Testo alternati */
.famiglia-grid { 
    display: grid; 
    grid-template-columns: 1fr 1fr; 
    gap: 80px; 
    align-items: center; 
    max-width: 1200px; 
    margin: 0 auto; 
    padding: 0 40px; 
}

.famiglia-grid.reverse { 
    direction: rtl; 
}

.famiglia-grid.reverse > * { 
    direction: ltr; 
}

.famiglia-text h2 { 
    font-family: 'Playfair Display', serif; 
    font-size: 3.2rem; 
    color: var(--borgogna); 
    margin-bottom: 20px; 
    line-height: 1.1; 
}

.famiglia-text h2 em { 
    color: var(--oro); 
    font-style: italic; 
}

.famiglia-text p { 
    font-size: 1.1rem; 
    line-height: 1.8; 
    color: var(--testo); 
    margin-bottom: 20px; 
}

/* Adattamento Mobile */
@media (max-width: 900px) {
    .famiglia-grid { 
        grid-template-columns: 1fr; 
        gap: 50px; 
    }
    .famiglia-grid.reverse { 
        direction: ltr; 
    }
    .famiglia-intro {
        padding: 0 20px;
        margin-bottom: 50px;
    }
    .famiglia-intro h2 {
        font-size: 2.2rem;
    }
}
/* ==========================================================================
   QUICK STATS BAR - VERSIONE COMPATTA SU UNA RIGA
   ========================================================================== */
.quick-stats-bar {
    background-color: var(--crema);
    border-bottom: 1px solid var(--oro-soft);
    padding: 2.5rem 1rem;
}

.stats-container {
    display: flex;
    justify-content: space-between;
    flex-wrap: nowrap; /* Obbliga tutti gli elementi su una sola riga */
    max-width: 1250px;
    margin: 0 auto;
    gap: 10px; /* Spazio ridotto per far entrare tutto */
    overflow-x: auto; /* Su schermi molto piccoli si potrà scorrere col dito orizzontalmente */
    padding-bottom: 5px; /* Spazio per la scrollbar invisibile su mobile */
}

/* Nasconde la scrollbar estetica su Webkit (Chrome/Safari) */
.stats-container::-webkit-scrollbar {
    display: none;
}

.stat-item {
    text-align: center;
    flex: 1 1 0; /* Permette alle icone di restringersi equamente */
    min-width: 85px; /* Evita che si schiaccino fino a diventare illeggibili */
}

.stat-icon {
    font-size: 1.4rem; /* Dimensione icona ridotta */
    display: block;
    margin-bottom: 0.6rem;
}

.stat-text {
    font-family: 'Raleway', sans-serif;
    color: var(--testo);
    font-weight: 600;
    font-size: 0.75rem; /* Dimensione testo ridotta per far stare 11 icone */
    line-height: 1.2;
}

/* ==========================================================================
   PAGINA CAMERE: LAYOUT MOODBOARD (ALBUM FOTOGRAFICO)
   ========================================================================== */

.room-module-editorial {
    padding: 6rem 0;
    background-color: var(--crema); 
}

.room-module-editorial:nth-child(even) {
    background-color: var(--bianco);
}

.room-editorial-row {
    display: flex;
    align-items: center;
    gap: 4rem;
    max-width: 1250px;
    margin: 0 auto;
    padding: 0 1.5rem;
}

.room-editorial-row.reverse {
    flex-direction: row-reverse;
}

/* --- COLONNA TESTO --- */
.room-text-col {
    flex: 1 1 450px;
}

.over-title {
    text-transform: uppercase;
    letter-spacing: 2px;
    font-size: 0.85rem;
    color: var(--grigio);
    font-family: 'Raleway', sans-serif;
    margin-bottom: 0.5rem;
    display: block;
}

.editorial-title {
    font-size: 3.5rem;
    color: var(--borgogna);
    margin-bottom: 0.5rem;
    font-family: 'Playfair Display', serif;
}

.editorial-blockquote {
    border-left: 3px solid var(--oro);
    padding-left: 1.5rem;
    margin: 2rem 0;
    font-style: italic;
    font-family: 'Libre Baskerville', serif;
    font-size: 1.25rem;
    color: var(--testo);
    line-height: 1.6;
}

.short-desc {
    color: var(--testo);
    line-height: 1.8;
    margin-bottom: 1.5rem;
    font-size: 1.05rem;
    font-family: 'Raleway', sans-serif;
}

/* --- COLONNA IMMAGINI (MOODBOARD) --- */
.room-image-col {
    flex: 1 1 550px;
    display: flex;
    justify-content: center;
}

.moodboard-wrapper {
    display: flex;
    align-items: center;
    position: relative;
}

/* Quando la riga è invertita, specchiamo anche l'incastro delle foto */
.room-editorial-row.reverse .moodboard-wrapper {
    flex-direction: row-reverse;
}

.polaroid-frame {
    background: #ffffff;
    padding: 12px 12px 50px 12px;
    box-shadow: 0 15px 35px rgba(0,0,0,0.08);
    border: 1px solid #EAEAEA;
    transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    position: relative;
    cursor: pointer;
}

.polaroid-frame:hover {
    transform: scale(1.03) translateY(-10px) !important;
    box-shadow: 0 25px 50px rgba(0,0,0,0.15);
    z-index: 10 !important;
}

.polaroid-frame img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

/* La foto grande */
.pic-main {
    width: 400px;
    height: 450px;
    transform: rotate(-1.5deg);
    z-index: 2;
}
.room-editorial-row.reverse .pic-main {
    transform: rotate(1.5deg);
}

/* Colonna foto piccole */
.side-pics-col {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.pic-side-top {
    width: 240px;
    height: 190px;
    transform: rotate(2.5deg);
    margin-left: -35px;
    z-index: 1;
}
.room-editorial-row.reverse .pic-side-top {
    transform: rotate(-2.5deg);
    margin-left: 0;
    margin-right: -35px; /* Incastro speculare */
}

.pic-side-bottom {
    width: 240px;
    height: 190px;
    transform: rotate(-2deg);
    margin-left: -15px;
    margin-top: -10px;
    z-index: 3;
}
.room-editorial-row.reverse .pic-side-bottom {
    transform: rotate(2deg);
    margin-left: 0;
    margin-right: -15px; /* Incastro speculare */
}

/* --- AREE COMUNI E PISCINA (Sfondo Chiaro) --- */
.relax-common-area {
    padding: 6rem 0;
    background-color: var(--bianco);
    color: var(--testo);
    text-align: center;
}

.relax-common-gallery {
    display: grid;
    grid-template-columns: 2fr 1fr;
    gap: 15px;
    max-width: 950px; /* Leggermente ristretto per un look più compatto */
    margin: 3rem auto 0;
    padding: 0 1.5rem;
}

.relax-common-gallery img {
    width: 100%;
    object-fit: cover; /* Ritaglia l'eccesso senza deformare */
    border-radius: 4px;
    box-shadow: 0 10px 25px rgba(0,0,0,0.08);
}

.relax-main-img { 
    grid-column: 1 / 2; 
    grid-row: 1 / 3; 
    height: 450px; /* ALTEZZA BLOCCATA INVECE DI MIN-HEIGHT */
}

.relax-side-img { 
    height: 217px; /* Esattamente (450px - 15px di gap) diviso 2 */
}

/* Responsive per schermi piccoli */
@media (max-width: 992px) {
    .relax-common-gallery { 
        grid-template-columns: 1fr; 
    }
    .relax-main-img { 
        grid-column: 1 / 2; 
        grid-row: auto; 
        height: 350px; 
    }
    .relax-side-img { 
        height: 250px; 
    }
}

/* Responsive Generico */
@media (max-width: 1024px) {
    .room-editorial-row, .room-editorial-row.reverse {
        flex-direction: column;
        gap: 3rem;
    }
    .moodboard-wrapper, .room-editorial-row.reverse .moodboard-wrapper {
        flex-direction: column;
    }
    .side-pics-col {
        flex-direction: row;
        margin-top: -30px;
    }
    .pic-main { width: 100%; max-width: 450px; height: 350px; margin: 0 auto;}
    .pic-side-top, .pic-side-bottom {
        width: 45%; height: 180px; margin: 0;
    }
    .pic-side-top { transform: rotate(-2deg); }
    .pic-side-bottom { transform: rotate(2deg); }
    
    .relax-common-gallery { grid-template-columns: 1fr; }
    .relax-main-img { grid-column: 1 / 2; grid-row: auto; min-height: 300px; }
}

/* ==========================================================================
   PAGINA CUCINA: HERO VIDEO E DETTAGLI (FIX DEFINITIVO)
   ========================================================================== */

.hero-video-section {
    position: relative;
    height: 60vh;
    width: 100vw;
    max-width: 100%;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    background-color: var(--testo);
    margin: 0;
    padding: 0;
}

.hero-video-bg {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    /* Prova questi valori: 40% è più basso di 30%, inquadrerà meglio le fiamme */
    object-position: center 40% !important; 
    z-index: 1;
}

.hero-video-overlay {
    position: absolute;
    inset: 0;
    background: rgba(44, 31, 30, 0.4);
    z-index: 2;
}

.hero-video-content {
    position: relative;
    z-index: 3;
    padding: 0 20px;
}

/* Correzione dimensioni testo Hero */
.hero-video-content h1.hero-large-title {
    font-size: 56px !important;
    line-height: 1.2;
    margin-bottom: 1rem;
}

.hero-video-content p.raleway-subtitle {
    font-size: 19.2px !important;
    line-height: 1.5;
}

/* 2. MEDIA NELLE POLAROID */
.polaroid-frame {
    box-sizing: border-box !important;
}

.polaroid-frame video,
.polaroid-frame img {
    width: 100% !important;
    height: 100% !important;
    max-width: 100% !important;
    object-fit: cover !important;
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
    box-sizing: border-box !important;
}

/* 3. BILANCIAMENTO MOODBOARD */
.side-pics-col.single-item {
    justify-content: center;
}
.side-pics-col.single-item .pic-side-top {
    width: 270px;
    height: 240px;
    transform: rotate(3deg) translateY(40px);
}

/* 4. GALLERIA FINALE (COMPATTA) */
.food-gallery-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 15px;
    max-width: 1000px;
    margin: 3rem auto 0;
    padding: 6rem 0 8rem 0;
}
.food-item {
    height: 250px;
    position: relative;
    overflow: hidden;
    border-radius: 4px;
    box-shadow: 0 10px 20px rgba(0,0,0,0.05);
}
.food-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
/* Gestione visibilità voce Home */
@media (min-width: 901px) {
    .mobile-only { display: none !important; }
}

@media (max-width: 900px) {
    .mobile-only { 
        display: block !important; 
        margin-bottom: 1rem; 
        border-bottom: 1px solid rgba(196,151,58,0.1); 
        padding-bottom: 1rem; 
    }
}
/* --- PAGINA RECENSIONI --- */
.recensioni-page { padding: 12rem 0 8rem; background-color: var(--crema); }
.page-intro { text-align: center; margin-bottom: 5rem; }
.recensioni-grid { 
    display: grid; 
    grid-template-columns: repeat(auto-fit, minmax(350px, 1fr)); 
    gap: 2.5rem; 
    max-width: 1200px; 
    margin: 0 auto; 
    padding: 0 2rem; 
}
.recensione-card { 
    background: #fff; 
    padding: 3rem; 
    border-radius: 2px; 
    box-shadow: 0 10px 30px rgba(0,0,0,0.05);
    display: flex; flex-direction: column;
}
.recensione-card .stars { color: var(--oro); margin-bottom: 1.5rem; font-size: 1.2rem; }
.recensione-card .testo { 
    font-family: 'Libre Baskerville', serif; 
    font-style: italic; 
    color: var(--testo); 
    line-height: 1.8; 
    margin-bottom: 2rem; 
    flex-grow: 1; 
}
.recensione-card .meta { border-top: 1px solid var(--rosa-soft); padding-top: 1.5rem; }
.recensione-card .nome { display: block; font-weight: 700; color: var(--borgogna); }
.recensione-card .fonte { font-size: 0.8rem; color: var(--grigio); text-transform: uppercase; letter-spacing: 1px; }

.source-logo { 
    width: 90px; 
    height: auto; 
    max-height: 30px; 
    object-fit: contain;
    filter: grayscale(1) opacity(0.7);
    transition: all 0.3s ease;
    margin-bottom: 1.5rem;
}

.recensione-card:hover .source-logo {
    filter: grayscale(0) opacity(1);
}

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

/* HERO pagina recensioni - Forzata per eliminare spazi */
.hero-page-recensioni {
    height: 60vh !important;
    background-size: cover !important;
    background-position: center !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    position: relative !important;
    margin-top: 0 !important;      /* Forza l'adesione all'header */
    margin-bottom: 4rem !important;
    padding-top: 0 !important;     /* Azzera eventuali padding interni */
}

.hero-overlay-recensioni {
    position: absolute !important;
    top: 0 !important; 
    left: 0 !important; 
    right: 0 !important; 
    bottom: 0 !important;
    background: rgba(0,0,0,0.3) !important;
}

.hero-content-recensioni {
    position: relative !important;
    color: #fff !important;
    text-align: center !important;
    z-index: 1 !important;
}
/* Forza l'adesione della hero all'header */
.recensioni-page {
    margin-top: -30px; /* Regola questo valore (es: -20px, -40px) finché non si attacca */
}

/* Stili specifici Hero Recensioni */
.hero-page-recensioni h1 {
    font-family: 'Playfair Display', serif;
    font-size: 56px !important;
    color: #fff;
    margin-bottom: 10px;
}

.hero-page-recensioni p {
    font-family: 'Raleway', sans-serif;
    font-size: 19.2px !important;
    color: #fff;
    letter-spacing: 1px;
}

/* --- INTEGRAZIONI SPECIFICHE PER LA PAGINA ESPERIENZE.PHP --- */

/* Sostituisce il vecchio exp-img-placeholder */
.exp-visual {
    flex: 1;
    min-width: 300px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.exp-visual img {
    width: 100%;
    height: 450px;
    object-fit: cover;
    border-radius: 4px;
    box-shadow: 0 15px 35px rgba(0,0,0,0.08);
}

/* Stile per il calendario agricolo */
.exp-list {
    list-style: none;
    padding: 0;
    margin: 20px 0;
    line-height: 1.8;
    font-family: 'Raleway', sans-serif;
    font-size: 1.05rem;
    color: var(--testo);
}

.exp-list li strong {
    color: var(--oro);
}

/* Stile per la piccola nota del meteo */
.exp-text .nota-bene {
    font-size: 0.85rem;
    font-style: italic;
    color: var(--grigio);
    margin-bottom: 25px;
    display: block;
}

/* ==========================================================================
   PAGINA CONTATTI E MODULISTICA
   ========================================================================== */

.contact-container {
    max-width: 900px;
    margin: 0 auto;
}

/* Pulsanti Rapidi */
.contact-quick-links {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
    margin-bottom: 50px;
}

.contact-btn {
    text-align: center;
    padding: 18px 20px;
    font-size: 1.1rem;
    border-radius: 2px;
    display: block;
    text-decoration: none;
}

.btn-outline-green {
    border: 2px solid #25D366;
    color: #25D366;
    background: transparent;
    font-weight: 700;
    transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
}

.btn-outline-green:hover {
    background: #25D366;
    color: var(--bianco);
    transform: translateY(-3px);
    box-shadow: 0 6px 20px rgba(37, 211, 102, 0.25);
}

/* Form Container */
.contact-form-wrapper {
    background: var(--bianco);
    padding: 50px;
    border-radius: 4px;
    box-shadow: 0 15px 40px rgba(44,31,30,0.06);
}

/* Layout Campi */
.form-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
    margin-bottom: 20px;
}

.form-group {
    margin-bottom: 25px;
}

.form-group label {
    display: block;
    margin-bottom: 8px;
    font-family: 'Raleway', sans-serif;
    color: var(--testo);
    font-weight: 600;
    font-size: 0.95rem;
}

.form-control {
    width: 100%;
    padding: 14px 15px;
    border: 1px solid rgba(138, 122, 114, 0.3); /* Grigio del brand alleggerito */
    border-radius: 2px;
    font-family: 'Raleway', sans-serif;
    font-size: 1rem;
    color: var(--testo);
    transition: border-color 0.3s, box-shadow 0.3s;
    background-color: #fafafa;
}

.form-control:focus {
    border-color: var(--borgogna);
    background-color: var(--bianco);
    box-shadow: 0 0 0 3px rgba(122, 61, 58, 0.1);
    outline: none;
}

/* Checkbox Privacy */
.checkbox-group {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    margin-bottom: 35px;
}

.checkbox-group input[type="checkbox"] {
    margin-top: 4px;
    transform: scale(1.1);
    accent-color: var(--borgogna);
}

.checkbox-group label {
    font-size: 0.85rem;
    color: var(--grigio);
    margin-bottom: 0;
    font-weight: 400;
    line-height: 1.5;
}

.checkbox-group label a {
    color: var(--borgogna);
    text-decoration: underline;
    font-weight: 600;
}

/* Bottone Submit */
.btn-submit {
    width: 100%;
    border: none;
    cursor: pointer;
    padding: 18px;
    font-size: 1.1rem;
    text-transform: uppercase;
}

/* Honeypot */
.honeypot-field {
    display: none;
    visibility: hidden;
}

/* Messaggi di Alert */
.alert-message {
    padding: 18px;
    margin-bottom: 30px;
    border-radius: 2px;
    font-family: 'Raleway', sans-serif;
    text-align: center;
    font-weight: 600;
}

.alert-success {
    background-color: rgba(37, 211, 102, 0.1);
    color: #1a8f42;
    border: 1px solid rgba(37, 211, 102, 0.3);
}

.alert-error {
    background-color: rgba(122, 61, 58, 0.1);
    color: var(--borgogna);
    border: 1px solid rgba(122, 61, 58, 0.3);
}

/* Responsive */
@media (max-width: 768px) {
    .contact-quick-links,
    .form-row {
        grid-template-columns: 1fr;
    }
    
    .contact-form-wrapper {
        padding: 30px 20px;
    }
    
    .contact-quick-links {
        gap: 15px;
        margin-bottom: 40px;
    }
}
/* ==========================================================================
   OPZIONI RAPIDE (CHIPS) PER IL FORM
   ========================================================================== */
.interest-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 10px;
}

.chip-label {
    cursor: pointer;
    user-select: none; /* Evita che il testo si selezioni se cliccano male */
}

/* Nascondiamo la vera checkbox */
.chip-label input[type="checkbox"] {
    display: none;
}

/* Stile della finta pillola */
.chip-label .chip-text {
    display: inline-block;
    padding: 10px 20px;
    border: 1px solid rgba(138, 122, 114, 0.4); /* Grigio chiaro */
    border-radius: 50px;
    font-family: 'Raleway', sans-serif;
    font-size: 0.9rem;
    font-weight: 500;
    color: var(--testo);
    background-color: transparent;
    transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
}

/* Effetto Hover (solo su schermi grandi) */
@media (hover: hover) {
    .chip-label:hover .chip-text {
        border-color: var(--borgogna);
        background-color: rgba(122, 61, 58, 0.05); /* Borgogna leggerissimo */
    }
}

/* Stato Cliccato (Selezionato) */
.chip-label input[type="checkbox"]:checked + .chip-text {
    background-color: var(--borgogna);
    color: var(--bianco);
    border-color: var(--borgogna);
    box-shadow: 0 4px 15px rgba(122, 61, 58, 0.2);
}
/* ==========================================================================
   BANNER PONTE B2C / B2B (Migliorato con Bottone)
   ========================================================================== */
.bridge-banner {
    background-color: rgba(196, 151, 58, 0.05); /* Fondo ancora più delicato */
    border: 1px solid rgba(196, 151, 58, 0.2);  /* Bordo continuo e sottile */
    padding: 30px 20px;
    text-align: center;
    border-radius: 4px;
    margin-bottom: 50px; /* Aumentato lo spazio per staccarlo nettamente dal form */
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 15px; /* Crea uno spazio perfetto tra il testo e il bottone */
}

.bridge-banner p {
    margin: 0;
    color: var(--testo);
    font-size: 1rem;
    font-family: 'Raleway', sans-serif;
}

/* Nuovo bottone vuoto con bordo Borgogna */
.btn-outline-brand-cont {
    display: inline-block;
    border: 1px solid var(--borgogna);
    color: var(--borgogna);
    padding: 12px 30px;
    text-decoration: none;
    font-weight: 600;
    font-family: 'Raleway', sans-serif;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    font-size: 0.85rem;
    border-radius: 2px;
    transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
}

.btn-outline-brand-cont:hover {
    background-color: var(--borgogna);
    color: var(--crema);
    transform: translateY(-2px);
    box-shadow: 0 5px 15px rgba(122, 61, 58, 0.2);
}
/* ==========================================================================
   RIGA 4 FOOTER: VALIDAZIONI
   ========================================================================== */
.footer-validations {
    background-color: #1a1a1a; /* O un colore leggermente più scuro/chiaro del tuo footer base */
    padding: 20px 0;
    border-top: 1px solid rgba(255, 255, 255, 0.05);
}

.validations-wrapper {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: 30px;
}

.validation-item a {
    display: flex;
    align-items: center;
    gap: 12px;
    text-decoration: none;
    color: var(--grigio); /* Adatta con la tua variabile di grigio chiaro */
    opacity: 0.6;
    transition: all 0.3s ease;
}

.validation-item a:hover {
    opacity: 1;
    color: var(--oro); /* O il colore di accento che preferisci */
}

/* Stile per i loghi immagine (W3C) */
.validation-item img {
    display: block;
    border: none;
    border-radius: 2px;
}

/* Stile per le icone FontAwesome (Google/Accessibilità) */
.validation-item.validation-icon i {
    font-size: 1.8rem;
}

/* Testo descrittivo accanto ai badge */
.val-text {
    font-family: 'Raleway', sans-serif;
    font-size: 0.75rem;
    line-height: 1.3;
    text-align: left;
    text-transform: uppercase;
    letter-spacing: 1px;
}

/* Responsive: su mobile mettiamo i badge su due colonne o in griglia */
@media (max-width: 768px) {
    .validations-wrapper {
        gap: 20px;
        flex-direction: column;
        align-items: flex-start;
        padding-left: 20px;
    }
}
/* FIX WCAG: Aumenta il contrasto dell'em dorato sui fondi chiari delle card */
.antologia-card .playfair-title em,
.global-cta-prenota-container .playfair-title em {
    color: #8c6a36; /* Oro più scuro (bronzo) per il superamento del contrasto */
}