/* ==========================================================
   AIRAFFITTI — Design System (Nero . Beige . Bianco)
   Applicato come classi CSS sui widget nativi Elementor.
   Non contiene markup: solo stile per componenti gia costruiti
   in Elementor (Container, Button, Heading, Icon Box, ecc.)
   ========================================================== */
:root {
  --nero: #14181D;
  --nero-soft: #5C636C;
  --beige: #C9B18A;
  --beige-scuro: #A88F65;
  --beige-chiaro: #EDE5D5;
  --bianco: #FDFCF9;
  --bianco-puro: #FFFFFF;
  --linea: #E4DECF;
  --font: "Montserrat", "Helvetica Neue", Arial, sans-serif;
  --r-sm: 8px; --r-md: 14px; --r-lg: 24px; --r-pill: 999px;
  --sh-soft: 0 1px 2px rgba(20,24,29,.05), 0 14px 34px -16px rgba(20,24,29,.14);
  --sh-float: 0 2px 8px rgba(20,24,29,.07), 0 28px 56px -20px rgba(20,24,29,.22);
}

body { font-family: var(--font); color: var(--nero); background: var(--bianco); }
h1, h2, h3, h4 { font-family: var(--font) !important; line-height: 1.12; letter-spacing: -0.02em; }
h1 { font-size: clamp(2.3rem, 5.4vw, 4.1rem) !important; font-weight: 800 !important; }
h2 { font-size: clamp(1.7rem, 3.4vw, 2.7rem) !important; font-weight: 800 !important; }
h3 { font-size: 1.12rem !important; font-weight: 700 !important; }
h1 em, .aa-accent { font-style: normal; color: var(--beige-scuro); }
a { color: var(--beige-scuro); }
a:hover { color: var(--nero); }

/* ===== Bottoni premium (classe CSS applicata al widget Button nativo) ===== */
.aa-btn {
  position: relative; display: inline-flex; align-items: center; gap: .6rem; justify-content: center;
  font: 700 .92rem/1 var(--font) !important; padding: 1.1em 2.1em; border-radius: var(--r-pill);
  border: 1.5px solid transparent; transition: color .2s ease, border-color .2s ease, background-color .2s ease, transform .2s ease, box-shadow .2s ease;
}
.aa-btn svg, .aa-btn i { transition: transform .2s ease; }
.aa-btn:hover svg, .aa-btn:hover i { transform: translateX(4px); }
.aa-btn--nero { background: var(--nero) !important; color: #fff !important; }
.aa-btn--nero:hover { transform: translateY(-2px); box-shadow: 0 10px 24px -8px rgba(20,24,29,.4); color: #fff !important; }
.aa-btn--beige { background: var(--beige) !important; color: var(--nero) !important; }
.aa-btn--beige:hover { background: var(--beige-scuro) !important; color: #fff !important; transform: translateY(-2px); box-shadow: 0 10px 24px -8px rgba(168,143,101,.5); }
.aa-btn--ghost { background: transparent !important; color: var(--nero) !important; border-color: var(--linea) !important; }
.aa-btn--ghost:hover { border-color: var(--nero) !important; }
.aa-btn--ghost-w { background: transparent !important; color: #fff !important; border-color: rgba(255,255,255,.3) !important; }
.aa-btn--ghost-w:hover { border-color: #fff !important; }

/* ===== Kicker / eyebrow ===== */
.aa-kicker { display: inline-flex; align-items: center; gap: .6rem; font-size: .72rem; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; color: var(--beige-scuro); }
.aa-kicker::before { content: ""; width: 28px; height: 2px; background: var(--beige); display: inline-block; }

/* ===== Header sticky ===== */
.aa-header { position: sticky; top: 0; z-index: 80; background: rgba(253,252,249,.82); backdrop-filter: blur(16px); border-bottom: 1px solid var(--linea); }
.aa-header .elementor-nav-menu a { font-size: .86rem; font-weight: 600; color: var(--nero-soft); }
.aa-header .elementor-nav-menu a:hover { color: var(--nero); }

/* ===== Hero — card flottanti ===== */
.aa-hero-visual { position: relative; }
.aa-hero-visual img { border-radius: 150px 150px var(--r-lg) var(--r-lg); box-shadow: var(--sh-soft); }
.aa-fl {
  position: absolute; background: rgba(255,255,255,.82); backdrop-filter: blur(10px);
  border-radius: var(--r-md); box-shadow: var(--sh-float); padding: .9rem 1.15rem;
  border: 1px solid rgba(255,255,255,.7); z-index: 2;
}
.aa-fl--rev { top: 5%; left: -8%; max-width: 215px; }
.aa-fl--min { bottom: 30%; left: -9%; }
.aa-fl--occ { top: 24%; right: -6%; }
.aa-fl--fee { bottom: 8%; right: -5%; }
.aa-fl--badge { bottom: -4%; left: 12%; }
@media (max-width: 1024px) { .aa-fl { position: static; width: 100%; margin-top: .6rem; } }

/* ===== Bento servizi ===== */
.aa-bento-card { transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease !important; }
.aa-bento-card:hover { transform: translateY(-5px); box-shadow: var(--sh-soft); border-color: var(--beige) !important; }
.aa-bento-card--dark { background: var(--nero) !important; border-color: var(--nero) !important; }
.aa-bento-card--dark * { color: rgba(255,255,255,.85) !important; }
.aa-bento-card--dark h3 { color: #fff !important; }

/* ===== Timeline "come lavoriamo" ===== */
.aa-timeline-num {
  width: 4.1rem; height: 4.1rem; border-radius: 50%; background: var(--bianco);
  border: 2px solid var(--beige); color: var(--nero);
  display: flex; align-items: center; justify-content: center; font-size: 1.25rem; font-weight: 800;
}
.aa-timeline-item { position: relative; }
.aa-timeline-item::before {
  content: ""; position: absolute; left: 2.05rem; top: 4.5rem; bottom: -2.5rem;
  width: 2px; background: linear-gradient(var(--beige), var(--linea));
}
.aa-timeline-item:last-child::before { display: none; }

/* ===== Sezione costo / commissioni (sfondo scuro) ===== */
.aa-dark-section { background: var(--nero) !important; color: rgba(255,255,255,.72); }
.aa-dark-section h2, .aa-dark-section h3 { color: #fff !important; }
.aa-dark-section .aa-kicker { color: var(--beige); }
.aa-cost-num { font-size: clamp(4rem, 10vw, 8rem); font-weight: 800; line-height: .9; color: var(--beige) !important; letter-spacing: -.04em; }

/* ===== Prima / Dopo ===== */
.aa-before-card { background: var(--bianco-puro); border: 1px solid var(--linea); border-radius: var(--r-lg); }
.aa-after-card { background: var(--nero) !important; border-color: var(--nero) !important; box-shadow: var(--sh-float); }
.aa-after-card * { color: rgba(255,255,255,.85) !important; }
.aa-after-card h3 { color: var(--beige) !important; }
.aa-arrow-badge {
  width: 54px; height: 54px; border-radius: 50%; background: var(--nero); color: var(--beige) !important;
  display: flex; align-items: center; justify-content: center; margin-inline: auto; font-size: 1.3rem; font-weight: 800;
}

/* ===== Recensioni ===== */
.aa-review-card { background: var(--bianco-puro); border: 1px solid var(--linea); border-radius: var(--r-lg); transition: transform .25s ease, box-shadow .25s ease; }
.aa-review-card:hover { transform: translateY(-4px); box-shadow: var(--sh-soft); }
.aa-review-card--feat { background: var(--beige-chiaro) !important; border-color: var(--beige) !important; }
.aa-review-avatar {
  width: 40px; height: 40px; border-radius: 50%; background: var(--nero); color: var(--beige) !important;
  display: flex; align-items: center; justify-content: center; font-size: .8rem; font-weight: 800;
}
.aa-stars { color: var(--beige-scuro); letter-spacing: 3px; }

/* ===== Callout ===== */
.aa-callout { background: var(--beige-chiaro) !important; border: 1px solid var(--beige) !important; border-radius: var(--r-lg); }

/* ===== Zone servite ===== */
.aa-zone-card { position: relative; border-radius: var(--r-lg); overflow: hidden; box-shadow: var(--sh-soft); }
.aa-zone-card img { transition: transform .8s ease; }
.aa-zone-card:hover img { transform: scale(1.05); }
.aa-zone-label {
  position: absolute; left: 1rem; right: 1rem; bottom: 1rem;
  background: rgba(253,252,249,.9); backdrop-filter: blur(8px);
  border-radius: var(--r-md); padding: .8rem 1rem;
}

/* ===== Alloggi (card stile Airbnb) ===== */
.aa-stay-card { background: var(--bianco-puro); border: 1px solid var(--linea); border-radius: var(--r-lg); overflow: hidden; transition: transform .25s ease, box-shadow .25s ease; }
.aa-stay-card:hover { transform: translateY(-5px); box-shadow: var(--sh-soft); }
.aa-stay-card img { border-radius: var(--r-lg) var(--r-lg) 0 0; }
.aa-stay-badge { display: inline-flex; align-items: center; font-size: .68rem; font-weight: 700; background: var(--beige-chiaro); color: var(--nero); border-radius: var(--r-pill); padding: .3em .9em; }

/* ===== Blog cards ===== */
.aa-post-card { background: var(--bianco-puro); border: 1px solid var(--linea); border-radius: var(--r-lg); transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease; }
.aa-post-card:hover { transform: translateY(-4px); box-shadow: var(--sh-soft); border-color: var(--beige) !important; }

/* ===== CTA finale ===== */
.aa-final-card { border: 1px solid rgba(255,255,255,.14); border-radius: var(--r-lg); background: rgba(255,255,255,.03) !important; }

/* ===== Footer ===== */
.aa-footer { background: var(--bianco-puro) !important; border-top: 1px solid var(--linea); }
.aa-footer h4 { font-size: .72rem; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; color: var(--nero); }
.aa-footer a { color: var(--nero-soft); }
.aa-footer a:hover { color: var(--nero); text-decoration: underline; }

/* ===== FAQ (Accordion nativo) ===== */
.aa-faq .elementor-accordion-item { border: 1px solid var(--linea); border-radius: var(--r-md); margin-bottom: .7rem; }
.aa-faq .elementor-tab-title { font-weight: 700 !important; }

/* ===== Comparazione (Table nativo) ===== */
.aa-compare-table { border: 1px solid var(--linea); border-radius: var(--r-lg); overflow: hidden; box-shadow: var(--sh-soft); }

/* ===== Sticky CTA mobile ===== */
.aa-sticky-cta { position: fixed; bottom: 0; left: 0; right: 0; z-index: 70; background: rgba(253,252,249,.92); backdrop-filter: blur(14px); border-top: 1px solid var(--linea); padding: .7rem 1rem; }
@media (min-width: 769px) { .aa-sticky-cta { display: none !important; } }

/* ===== Dettaglio alloggio: box prenotazione ===== */
.aa-booking-box { background: var(--bianco-puro); border: 1px solid var(--linea); border-radius: var(--r-lg); box-shadow: var(--sh-soft); }

/* ===== Box articolo blog ===== */
.aa-article-box { border-radius: var(--r-md); padding: 1.4rem 1.6rem; margin-block: 1.5rem; }
.aa-article-box--tip { background: var(--beige-chiaro); border-left: 4px solid var(--beige-scuro); }
.aa-article-box--warning { background: #FBEDE7; border-left: 4px solid #B3552F; }
.aa-article-box--remember { background: var(--bianco-puro); border: 1px solid var(--linea); border-left: 4px solid var(--nero); }