/* =====================================================================
   FUNDUQ OSPITALITÀ IBLEA — Design System
   Concept: Sette Venti, Sette Atmosfere
   Tipografia: Fraunces (display) + EB Garamond (body)
   Palette: terracotta sicula / mare ionio / sabbia crema / oro vento
   ===================================================================== */

/* ---------- Tokens ---------- */
:root {
  /* Palette — basata sui blu del logo Funduq (#00588D / #0085B3) */
  --c-blue-deep:   #00588D;   /* blu primario logo */
  --c-blue:        #0085B3;   /* azzurro logo */
  --c-blue-soft:   #4FA8CB;   /* azzurro chiaro */
  --c-blue-pale:   #CFE3EE;   /* azzurro pallido sfondo */

  --c-sand:        #f1ebd9;   /* sfondo base, sabbia mediterranea */
  --c-sand-soft:   #f8f3e4;
  --c-sand-deep:   #e6dcc0;
  --c-cream:       #fbf7eb;
  --c-paper:       #fefbf2;

  --c-ink:         #003659;   /* blu deep scurito — testi principali */
  --c-ink-soft:    #1d4d72;
  --c-ink-mute:    #5e7888;

  --c-terra:       #c46b45;   /* terracotta — CTA / accenti caldi (uso limitato) */
  --c-terra-deep:  #9c4a26;
  --c-terra-soft:  #dba287;

  --c-gold:        #b8924f;   /* oro vento — fili decorativi */
  --c-gold-soft:   #d4b87a;

  --c-olive:       #6e7e5c;
  --c-olive-soft:  #9aa888;

  --c-line:        #d6c9a6;
  --c-line-soft:   rgba(0, 54, 89, 0.14);

  /* Typography */
  --f-display: "Fraunces", "Cormorant Garamond", "Times New Roman", serif;
  --f-body:    "EB Garamond", "Garamond", "Times New Roman", serif;
  --f-mono:    "JetBrains Mono", ui-monospace, Menlo, Consolas, monospace;
  --f-sans:    "Manrope", -apple-system, "Segoe UI", sans-serif;

  /* Sizing */
  --container:  min(1320px, 92vw);
  --container-narrow: min(880px, 88vw);
  --container-wide:   min(1480px, 96vw);

  /* Easing */
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);

  /* Shadow soft */
  --shadow-soft: 0 30px 60px -30px rgba(27, 61, 82, 0.25);
  --shadow-deep: 0 60px 80px -40px rgba(27, 61, 82, 0.4);
}

/* ---------- Reset ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body {
  margin: 0;
  background: var(--c-sand);
  color: var(--c-ink);
  font-family: var(--f-body);
  font-size: 1.0625rem;
  line-height: 1.65;
  font-weight: 400;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}
img, picture, svg, video { display: block; max-width: 100%; height: auto; }
button { font: inherit; color: inherit; background: none; border: 0; padding: 0; cursor: pointer; }
a { color: inherit; text-decoration: none; transition: color .25s var(--ease-out); }
a:hover { color: var(--c-terra); }
ul, ol { margin: 0; padding: 0; list-style: none; }
hr { border: 0; height: 1px; background: var(--c-line); margin: 4rem 0; }

::selection { background: var(--c-ink); color: var(--c-sand); }

/* ---------- Typography ---------- */
h1, h2, h3, h4 {
  font-family: var(--f-display);
  font-weight: 360;
  font-style: normal;
  font-variation-settings: "opsz" 144, "SOFT" 50;
  letter-spacing: -0.015em;
  color: var(--c-ink);
  margin: 0;
  line-height: 1.06;
}

.display-xl {
  font-size: clamp(3.2rem, 9.5vw, 9rem);
  font-weight: 320;
  letter-spacing: -0.025em;
  font-variation-settings: "opsz" 144, "SOFT" 100;
}
.display-l {
  font-size: clamp(2.6rem, 6.5vw, 5.5rem);
  font-weight: 340;
  font-variation-settings: "opsz" 144, "SOFT" 60;
}
.display-m {
  font-size: clamp(2rem, 4.5vw, 3.6rem);
  font-weight: 380;
  font-variation-settings: "opsz" 100, "SOFT" 30;
}
.display-s {
  font-size: clamp(1.45rem, 2.3vw, 2rem);
  font-weight: 420;
  font-variation-settings: "opsz" 48, "SOFT" 20;
  letter-spacing: -0.005em;
}

.kicker {
  font-family: var(--f-sans);
  font-size: 0.72rem;
  letter-spacing: 0.32em;
  text-transform: uppercase;
  font-weight: 500;
  color: var(--c-blue);
  display: inline-flex;
  align-items: center;
  gap: 0.7rem;
}
.kicker::before {
  content: "";
  width: 28px;
  height: 1px;
  background: currentColor;
  opacity: .6;
}
.kicker.center::before { content: none; }

.numeral {
  font-family: var(--f-display);
  font-style: italic;
  font-weight: 300;
  font-size: 0.95rem;
  color: var(--c-gold);
  letter-spacing: 0.18em;
}

.lead {
  font-family: var(--f-display);
  font-size: clamp(1.25rem, 1.9vw, 1.65rem);
  line-height: 1.45;
  font-weight: 300;
  font-style: italic;
  font-variation-settings: "opsz" 24, "SOFT" 50;
  color: var(--c-ink-soft);
  max-width: 38ch;
}

p { margin: 0 0 1.1em; }
em, .italic {
  font-style: italic;
  font-feature-settings: "ss01";
}

/* ---------- Layout helpers ---------- */
.container { width: var(--container); margin-inline: auto; }
.container-narrow { width: var(--container-narrow); margin-inline: auto; }
.container-wide   { width: var(--container-wide);   margin-inline: auto; }
.section { padding: clamp(5rem, 11vw, 9rem) 0; position: relative; }
.section-tight { padding: clamp(3rem, 6vw, 5rem) 0; }
.text-center { text-align: center; }
.flex-center { display: flex; align-items: center; justify-content: center; }
.grid { display: grid; gap: 2rem; }
.hide-md { }
@media (max-width: 980px) { .hide-md { display: none !important; } }

/* ---------- Header ---------- */
.site-header {
  position: fixed;
  top: 0; left: 0; right: 0;
  z-index: 90;
  padding: 1.4rem 0;
  transition: background .4s var(--ease-out), padding .4s var(--ease-out), backdrop-filter .4s var(--ease-out);
}
.site-header.scrolled {
  background: rgba(239, 230, 210, 0.78);
  backdrop-filter: blur(14px) saturate(140%);
  -webkit-backdrop-filter: blur(14px) saturate(140%);
  padding: 0.85rem 0;
  border-bottom: 1px solid var(--c-line-soft);
}
.site-header .container {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 2rem;
}
.brand {
  display: inline-flex;
  align-items: center;
  gap: 0.85rem;
  font-family: var(--f-display);
  font-size: 1.55rem;
  font-weight: 380;
  letter-spacing: -0.005em;
  line-height: 1;
  color: var(--c-ink);
}
.brand-logo { display: block; height: 64px; width: auto; transition: height .35s var(--ease-out); }
.site-header.scrolled .brand-logo { height: 48px; }
.brand-logo-light { display: none; }
/* su hero scura mostro logo bianco */
body:not(.has-light-hero) .site-header:not(.scrolled) .brand-logo-dark { display: none; }
body:not(.has-light-hero) .site-header:not(.scrolled) .brand-logo-light { display: block; }
.brand small {
  display: block;
  font-family: var(--f-sans);
  font-size: 0.6rem;
  letter-spacing: 0.32em;
  text-transform: uppercase;
  color: var(--c-blue);
  font-weight: 500;
  margin-top: 4px;
}
.brand-text { display: flex; flex-direction: column; line-height: 1.05; }

.primary-nav {
  display: flex;
  justify-content: center;
  gap: 2.2rem;
}
.primary-nav a {
  font-family: var(--f-sans);
  font-size: 0.78rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  font-weight: 500;
  color: var(--c-ink);
  position: relative;
  padding: 0.4rem 0;
}
.primary-nav a::after {
  content: "";
  position: absolute;
  left: 0; right: 0;
  bottom: -2px;
  height: 1px;
  background: var(--c-terra);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform .35s var(--ease-out);
}
.primary-nav a:hover::after,
.primary-nav a.active::after { transform: scaleX(1); }

.header-cta {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
}

.menu-toggle {
  display: none;
  width: 44px; height: 44px;
  align-items: center; justify-content: center;
  border: 1px solid var(--c-ink);
  border-radius: 50%;
}
.menu-toggle span {
  width: 18px; height: 1px; background: var(--c-ink);
  position: relative;
  transition: .3s var(--ease-out);
}
.menu-toggle span::before,
.menu-toggle span::after {
  content: ""; position: absolute; left: 0;
  width: 18px; height: 1px; background: var(--c-ink);
  transition: .3s var(--ease-out);
}
.menu-toggle span::before { top: -6px; }
.menu-toggle span::after  { top:  6px; }
body.menu-open .menu-toggle span { background: transparent; }
body.menu-open .menu-toggle span::before { top: 0; transform: rotate(45deg); }
body.menu-open .menu-toggle span::after  { top: 0; transform: rotate(-45deg); }

/* ---------- Buttons ---------- */
.btn {
  display: inline-flex;
  align-items: center;
  gap: 0.65rem;
  padding: 1rem 1.6rem;
  font-family: var(--f-sans);
  font-size: 0.78rem;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  font-weight: 500;
  border-radius: 999px;
  transition: all .35s var(--ease-out);
  cursor: pointer;
  white-space: nowrap;
}
.btn-primary {
  background: var(--c-ink);
  color: var(--c-sand);
}
.btn-primary:hover {
  background: var(--c-terra-deep);
  color: var(--c-sand);
  transform: translateY(-2px);
}
.btn-outline {
  background: transparent;
  color: var(--c-ink);
  border: 1px solid var(--c-ink);
}
.btn-outline:hover {
  background: var(--c-ink);
  color: var(--c-sand);
}
.btn-ghost {
  color: var(--c-ink);
  padding: 0.4rem 0;
  position: relative;
}
.btn-ghost::after {
  content: "→";
  display: inline-block;
  margin-left: 0.4rem;
  transition: transform .3s var(--ease-out);
}
.btn-ghost:hover::after { transform: translateX(6px); }

.btn-arrow {
  display: inline-flex;
  align-items: center;
  gap: 0.7rem;
  font-family: var(--f-display);
  font-style: italic;
  font-weight: 320;
  font-size: 1.1rem;
  color: var(--c-ink);
  border-bottom: 1px solid var(--c-line);
  padding-bottom: 0.4rem;
  transition: all .35s var(--ease-out);
}
.btn-arrow:hover {
  color: var(--c-terra);
  border-color: var(--c-terra);
}
.btn-arrow svg { transition: transform .35s var(--ease-out); }
.btn-arrow:hover svg { transform: translateX(6px); }

/* ---------- Hero (video di sfondo) ---------- */
.hero {
  position: relative;
  min-height: 100vh;
  display: flex;
  align-items: flex-end;
  overflow: hidden;
  background: var(--c-ink);
  color: var(--c-cream);
  padding-top: 7rem;
}
.hero-video {
  position: absolute;
  inset: 0;
  overflow: hidden;
  z-index: 0;
  pointer-events: none;
}
.hero-video img.hero-poster {
  width: 100%; height: 100%; object-fit: cover;
  filter: saturate(0.95) brightness(0.85);
}
.hero-video iframe {
  position: absolute;
  top: 50%; left: 50%;
  /* mantieni 16:9 sempre cover */
  width: 100vw;
  height: 56.25vw;       /* 16:9 → h = w * 9/16 */
  min-height: 100vh;
  min-width: 177.78vh;   /* 16:9 → w = h * 16/9 */
  transform: translate(-50%, -50%);
  pointer-events: none;
  border: 0;
}
.hero-overlay {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(180deg, rgba(0, 54, 89, 0.55) 0%, rgba(0, 54, 89, 0.15) 30%, rgba(0, 54, 89, 0.75) 100%),
    radial-gradient(ellipse at 20% 80%, rgba(0, 88, 141, 0.35), transparent 60%);
  z-index: 1;
  pointer-events: none;
}

.hero-inner {
  position: relative;
  z-index: 2;
  width: var(--container-wide);
  margin-inline: auto;
  padding-bottom: clamp(3rem, 7vw, 6rem);
  display: grid;
  grid-template-columns: 1.4fr 1fr;
  align-items: end;
  gap: 3rem;
}
.hero-text { color: var(--c-cream); }
.hero-text .kicker {
  color: var(--c-blue-soft);
}
.hero-text .kicker::before { background: var(--c-blue-soft); opacity: 0.9; }

.hero-title {
  font-size: clamp(3.6rem, 11vw, 11rem);
  line-height: 0.9;
  letter-spacing: -0.04em;
  font-weight: 280;
  font-variation-settings: "opsz" 144, "SOFT" 100;
  color: var(--c-cream);
  margin-top: 1.4rem;
  text-shadow: 0 2px 30px rgba(0,0,0,0.25);
}
.hero-title .italic {
  font-style: italic;
  font-weight: 220;
  color: var(--c-blue-soft);
  display: block;
}
.hero-meta {
  margin-top: 2.5rem;
  display: flex;
  align-items: flex-end;
  gap: 2rem;
  flex-wrap: wrap;
}
.hero-meta .lead {
  margin: 0;
  max-width: 36ch;
  color: var(--c-sand-soft);
  font-style: italic;
}

.hero-side {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 1.5rem;
  text-align: right;
  color: var(--c-sand-soft);
}
.hero-side .side-tag {
  font-family: var(--f-sans);
  font-size: 0.68rem;
  letter-spacing: 0.34em;
  text-transform: uppercase;
  color: var(--c-blue-soft);
}
.hero-side .side-coord {
  font-family: var(--f-display);
  font-style: italic;
  font-size: 1.25rem;
  color: var(--c-sand);
  font-variation-settings: "opsz" 24, "SOFT" 30;
}

/* Hero button — variant per fondo scuro */
.btn-hero {
  background: var(--c-cream);
  color: var(--c-ink);
  border: 1px solid var(--c-cream);
}
.btn-hero:hover {
  background: var(--c-blue);
  color: var(--c-cream);
  border-color: var(--c-blue);
  transform: translateY(-2px);
}
.btn-arrow.on-dark { color: var(--c-cream); border-color: rgba(251,247,235,0.5); }
.btn-arrow.on-dark:hover { color: var(--c-blue-soft); border-color: var(--c-blue-soft); }

.hero-scroll {
  position: absolute;
  bottom: 1.6rem; left: 50%;
  transform: translateX(-50%);
  font-family: var(--f-sans);
  font-size: 0.65rem;
  letter-spacing: 0.4em;
  text-transform: uppercase;
  color: var(--c-cream);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.7rem;
  z-index: 3;
  opacity: 0.85;
}
.hero-scroll::after {
  content: "";
  width: 1px;
  height: 40px;
  background: var(--c-cream);
  animation: scroll-line 2.4s var(--ease-in-out) infinite;
}
@keyframes scroll-line {
  0%   { transform: scaleY(0.2); transform-origin: top; }
  50%  { transform: scaleY(1);   transform-origin: top; }
  50.1%{ transform: scaleY(1);   transform-origin: bottom; }
  100% { transform: scaleY(0);   transform-origin: bottom; }
}

/* Decorative top bar */
.hero-topline {
  position: absolute;
  top: 6.5rem; left: 0; right: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 4vw;
  font-family: var(--f-sans);
  font-size: 0.7rem;
  letter-spacing: 0.32em;
  text-transform: uppercase;
  color: var(--c-sand-soft);
  z-index: 2;
  opacity: 0.85;
}
.hero-topline span { display: flex; align-items: center; gap: 1rem; }
.hero-topline .dot { width: 5px; height: 5px; background: var(--c-blue-soft); border-radius: 50%; }

/* Header su sfondo scuro hero (prima dello scroll) */
.site-header:not(.scrolled) {
  color: var(--c-cream);
}
.site-header:not(.scrolled) .brand { color: var(--c-cream); }
.site-header:not(.scrolled) .brand small { color: var(--c-blue-soft); }
.site-header:not(.scrolled) .primary-nav a { color: var(--c-cream); }
.site-header:not(.scrolled) .primary-nav a::after { background: var(--c-blue-soft); }
.site-header:not(.scrolled) .btn-outline {
  color: var(--c-cream);
  border-color: var(--c-cream);
}
.site-header:not(.scrolled) .btn-outline:hover {
  background: var(--c-cream);
  color: var(--c-ink);
}
.site-header:not(.scrolled) .menu-toggle { border-color: var(--c-cream); }
.site-header:not(.scrolled) .menu-toggle span,
.site-header:not(.scrolled) .menu-toggle span::before,
.site-header:not(.scrolled) .menu-toggle span::after { background: var(--c-cream); }
/* Pagine interne: header sempre con colori scuri */
body.has-light-hero .site-header:not(.scrolled) { color: var(--c-ink); }
body.has-light-hero .site-header:not(.scrolled) .brand { color: var(--c-ink); }
body.has-light-hero .site-header:not(.scrolled) .brand small { color: var(--c-blue); }
body.has-light-hero .site-header:not(.scrolled) .primary-nav a { color: var(--c-ink); }
body.has-light-hero .site-header:not(.scrolled) .primary-nav a::after { background: var(--c-blue); }
body.has-light-hero .site-header:not(.scrolled) .btn-outline { color: var(--c-ink); border-color: var(--c-ink); }
body.has-light-hero .site-header:not(.scrolled) .btn-outline:hover { background: var(--c-ink); color: var(--c-sand); }
body.has-light-hero .site-header:not(.scrolled) .menu-toggle { border-color: var(--c-ink); }
body.has-light-hero .site-header:not(.scrolled) .menu-toggle span,
body.has-light-hero .site-header:not(.scrolled) .menu-toggle span::before,
body.has-light-hero .site-header:not(.scrolled) .menu-toggle span::after { background: var(--c-ink); }

/* ---------- Compass / Rosa dei venti ---------- */
.compass-wrap {
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  padding: 2rem;
}
.compass {
  width: clamp(280px, 38vw, 540px);
  height: clamp(280px, 38vw, 540px);
  animation: compass-spin 240s linear infinite;
}
@keyframes compass-spin {
  to { transform: rotate(360deg); }
}
.compass-frame {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  pointer-events: none;
}
.compass-frame::before,
.compass-frame::after {
  content: "";
  position: absolute;
  border: 1px solid var(--c-gold);
  border-radius: 50%;
  opacity: 0.5;
}
.compass-frame::before { inset: 8%; }
.compass-frame::after  { inset: -2%; opacity: 0.25; }

/* Wind cards layout — radial */
.winds-section {
  background: var(--c-sand);
  padding: clamp(6rem, 12vw, 11rem) 0;
  position: relative;
  overflow: hidden;
}
.winds-grid {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  gap: 1.5rem;
  margin-top: 5rem;
  align-items: stretch;
}
.winds-grid .compass-cell {
  grid-column: 4 / 10;
  grid-row: 2;
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: 360px;
}

/* ---------- Wind card ---------- */
.wind-card {
  position: relative;
  background: var(--c-paper);
  padding: 2rem 1.6rem 1.8rem;
  border-radius: 4px;
  display: flex;
  flex-direction: column;
  gap: 0.6rem;
  border: 1px solid transparent;
  transition: all .45s var(--ease-out);
  overflow: hidden;
  text-align: left;
}
.wind-card::after {
  content: "";
  position: absolute;
  inset: 0;
  background: var(--c-terra);
  opacity: 0;
  z-index: -1;
  transition: opacity .4s var(--ease-out);
}
.wind-card:hover {
  transform: translateY(-6px);
  box-shadow: var(--shadow-soft);
  border-color: var(--c-line);
}
.wind-card .wind-direction {
  position: absolute;
  top: 1.2rem; right: 1.4rem;
  font-family: var(--f-sans);
  font-size: 0.62rem;
  letter-spacing: 0.32em;
  text-transform: uppercase;
  color: var(--c-terra);
  font-weight: 600;
}
.wind-card .wind-name {
  font-family: var(--f-display);
  font-size: clamp(1.7rem, 2.4vw, 2.2rem);
  font-weight: 320;
  font-variation-settings: "opsz" 80, "SOFT" 50;
  letter-spacing: -0.015em;
  margin-top: 1rem;
}
.wind-card .wind-name .italic {
  display: block;
  font-style: italic;
  font-size: 0.7em;
  color: var(--c-terra);
  margin-top: 0.1em;
}
.wind-card .wind-meta {
  font-family: var(--f-sans);
  font-size: 0.7rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--c-ink-mute);
  margin-top: 0.4rem;
}
.wind-card .wind-tagline {
  font-family: var(--f-display);
  font-style: italic;
  font-size: 1rem;
  color: var(--c-ink-soft);
  line-height: 1.4;
  margin-top: 0.6rem;
  font-variation-settings: "opsz" 24, "SOFT" 40;
}
.wind-card .wind-link {
  font-family: var(--f-sans);
  font-size: 0.72rem;
  letter-spacing: 0.24em;
  text-transform: uppercase;
  color: var(--c-ink);
  font-weight: 500;
  margin-top: auto;
  padding-top: 1.4rem;
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  border-top: 1px solid var(--c-line);
  width: 100%;
}
.wind-card .wind-link::after {
  content: "→";
  margin-left: auto;
  transition: transform .35s var(--ease-out);
}
.wind-card:hover .wind-link::after { transform: translateX(6px); }

/* Wind card spatial position around compass (legacy) */
.wind-card.pos-n  { grid-column: 5 / 9;  grid-row: 1; }
.wind-card.pos-ne { grid-column: 9 / 13; grid-row: 1 / 3; }
.wind-card.pos-e  { grid-column: 10 / 13; grid-row: 2 / 4; align-self: center; }
.wind-card.pos-se { grid-column: 9 / 13; grid-row: 3 / 5; }
.wind-card.pos-s  { grid-column: 5 / 9;  grid-row: 4; }
.wind-card.pos-sw { grid-column: 1 / 5;  grid-row: 3 / 5; }
.wind-card.pos-w  { grid-column: 1 / 4;  grid-row: 2 / 4; align-self: center; }
.wind-card.pos-nw { grid-column: 1 / 5;  grid-row: 1 / 3; }

/* ---------- Winds Intro (compass + lead text) ---------- */
.winds-intro {
  display: grid;
  grid-template-columns: 1.4fr 1fr;
  gap: 4rem;
  align-items: center;
  padding: 3rem 0 4rem;
  border-bottom: 1px solid var(--c-line);
  margin-bottom: 4rem;
}
.winds-intro-text { max-width: 52ch; }
.winds-intro-text .lead {
  font-family: var(--f-display);
  font-style: italic;
  font-size: clamp(1.3rem, 1.9vw, 1.7rem);
  line-height: 1.5;
  color: var(--c-ink-soft);
  font-weight: 320;
  font-variation-settings: "opsz" 36, "SOFT" 50;
}
.winds-intro-compass {
  display: flex;
  justify-content: center;
  align-items: center;
}
.winds-intro-compass .compass {
  width: clamp(220px, 26vw, 360px);
  height: clamp(220px, 26vw, 360px);
}

/* ---------- Winds photo grid (home) — editorial mosaic ---------- */
.winds-photo-grid {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  grid-auto-rows: 16vw;
  gap: 1.4rem;
  grid-auto-flow: dense;
}
.wpc {
  position: relative;
  display: block;
  overflow: hidden;
  background: var(--c-ink);
  border-radius: 2px;
  transition: transform .55s var(--ease-out);
  grid-column: span 4;
  grid-row: span 2;
}
.wpc img {
  position: absolute;
  inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 1.4s var(--ease-out), filter .6s var(--ease-out);
  filter: saturate(0.92);
}
.wpc::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(180deg, rgba(0,54,89,0) 30%, rgba(0,54,89,0.9) 100%),
    linear-gradient(180deg, rgba(0,54,89,0.15) 0%, transparent 25%);
  z-index: 1;
  transition: background .5s var(--ease-out);
}
.wpc:hover { transform: translateY(-5px); }
.wpc:hover img { transform: scale(1.06); filter: saturate(1.05); }
.wpc:hover::after {
  background:
    linear-gradient(180deg, rgba(0,54,89,0.05) 30%, rgba(0,54,89,0.95) 100%),
    linear-gradient(180deg, rgba(0,54,89,0.2) 0%, transparent 25%);
}

.wpc .wpc-body {
  position: absolute;
  bottom: 0; left: 0; right: 0;
  padding: 1.8rem 2rem;
  color: var(--c-cream);
  z-index: 2;
}
.wpc .wpc-tag {
  font-family: var(--f-sans);
  font-size: 0.6rem;
  letter-spacing: 0.34em;
  text-transform: uppercase;
  font-weight: 500;
  color: var(--c-blue-soft);
  display: inline-flex;
  align-items: center;
  gap: 0.6rem;
  margin-bottom: 0.8rem;
}
.wpc .wpc-badge {
  background: var(--c-terra);
  color: var(--c-cream);
  padding: 0.25rem 0.6rem;
  border-radius: 99px;
  font-size: 0.55rem;
  letter-spacing: 0.22em;
  font-weight: 600;
}
.wpc h3 {
  font-family: var(--f-display);
  font-size: clamp(1.7rem, 2.4vw, 2.4rem);
  font-weight: 320;
  color: var(--c-cream);
  letter-spacing: -0.01em;
  line-height: 1.02;
  font-variation-settings: "opsz" 96, "SOFT" 60;
  margin: 0 0 0.5rem;
}
.wpc h3 .italic {
  display: block;
  font-style: italic;
  font-size: 0.6em;
  color: var(--c-sand-soft);
  margin-top: 0.2em;
  font-weight: 280;
}
.wpc .wpc-meta {
  font-family: var(--f-display);
  font-style: italic;
  font-size: 0.95rem;
  color: var(--c-sand);
  opacity: 0.85;
  letter-spacing: 0.02em;
}

/* Tall card (Tramontana) — vertical accent */
.wpc-tall { grid-column: span 4; grid-row: span 3; }
/* Wide cards */
.wpc-wide { grid-column: span 8; grid-row: span 2; }
/* Feature card (Ponente con giardino) — large hero */
.wpc-feature { grid-column: span 8; grid-row: span 3; }

@media (max-width: 980px) {
  .winds-intro { grid-template-columns: 1fr; gap: 2rem; }
  .winds-intro-compass { order: -1; }
  .winds-photo-grid {
    grid-template-columns: 1fr;
    grid-auto-rows: 70vw;
    gap: 1rem;
  }
  .wpc,
  .wpc-tall,
  .wpc-wide,
  .wpc-feature {
    grid-column: span 1;
    grid-row: span 1;
  }
  .wpc h3 { font-size: 1.8rem; }
}

/* Simpler grid version (i-sette-venti.html) */
.winds-list {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 1.5rem;
  margin-top: 4rem;
}

/* ---------- Winds editorial table (i-sette-venti) ---------- */
.winds-table {
  border-top: 1px solid var(--c-line);
}
.winds-table-row {
  display: grid;
  grid-template-columns: 56px 2.3fr 1.1fr 1fr 0.6fr 0.6fr 40px;
  gap: 1.5rem;
  align-items: center;
  padding: 1.8rem 0;
  border-bottom: 1px solid var(--c-line);
  font-family: var(--f-body);
  color: var(--c-ink);
  transition: background .35s var(--ease-out), padding .35s var(--ease-out);
  position: relative;
}
.winds-table-row:not(.winds-table-head):hover {
  background: linear-gradient(90deg, var(--c-sand) 0%, transparent 100%);
  padding-left: 1.2rem;
}
.winds-table-row:not(.winds-table-head):hover .arrow { transform: translateX(8px); color: var(--c-blue); }
.winds-table-head {
  font-family: var(--f-sans);
  font-size: 0.62rem;
  letter-spacing: 0.34em;
  text-transform: uppercase;
  color: var(--c-ink-mute);
  font-weight: 500;
  padding: 1.2rem 0;
}
.winds-table-row .num {
  font-family: var(--f-display);
  font-style: italic;
  font-size: 1.4rem;
  color: var(--c-blue);
  font-weight: 320;
  letter-spacing: 0.1em;
}
.winds-table-row .name {
  font-family: var(--f-display);
  font-size: 1.5rem;
  font-weight: 380;
  color: var(--c-ink);
  letter-spacing: -0.005em;
  font-variation-settings: "opsz" 48, "SOFT" 30;
}
.winds-table-row .name .italic {
  font-style: italic;
  color: var(--c-blue);
  font-weight: 320;
  font-size: 0.88em;
  margin-left: 0.4rem;
}
.winds-table-row .badge {
  display: inline-block;
  margin-left: 0.8rem;
  font-family: var(--f-sans);
  font-size: 0.6rem;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  background: var(--c-blue);
  color: var(--c-cream);
  padding: 0.3rem 0.7rem;
  border-radius: 99px;
  vertical-align: middle;
  font-weight: 500;
}
.winds-table-row.featured { background: linear-gradient(90deg, rgba(0,133,179,0.05), transparent); }
.winds-table-row .arrow {
  font-family: var(--f-display);
  font-size: 1.4rem;
  color: var(--c-ink-mute);
  transition: transform .35s var(--ease-out), color .35s var(--ease-out);
  text-align: right;
}

/* ---------- Winds mosaic ---------- */
.winds-mosaic {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  grid-auto-rows: 22vw;
  gap: 1rem;
  margin-top: 4rem;
}
.wind-mosaic-card {
  position: relative;
  overflow: hidden;
  grid-column: span 4;
  display: block;
  background: var(--c-ink);
}
.wind-mosaic-card.big { grid-column: span 8; grid-row: span 2; }
.wind-mosaic-card.wide { grid-column: span 8; }
.wind-mosaic-card img {
  width: 100%; height: 100%; object-fit: cover;
  transition: transform 1.2s var(--ease-out), filter .6s var(--ease-out);
  filter: saturate(0.95);
}
.wind-mosaic-card::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(0,54,89,0) 40%, rgba(0,54,89,0.85) 100%);
}
.wind-mosaic-card:hover img { transform: scale(1.06); filter: saturate(1.05); }
.wind-mosaic-card .wmc-body {
  position: absolute;
  bottom: 0;
  padding: 1.6rem 1.8rem;
  color: var(--c-cream);
  z-index: 2;
}
.wind-mosaic-card .wmc-meta {
  font-family: var(--f-sans);
  font-size: 0.62rem;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: var(--c-blue-soft);
  margin-bottom: 0.6rem;
  display: block;
}
.wind-mosaic-card h3 {
  font-family: var(--f-display);
  font-size: clamp(1.5rem, 2.2vw, 2.1rem);
  font-weight: 320;
  color: var(--c-cream);
  letter-spacing: -0.01em;
  font-variation-settings: "opsz" 96, "SOFT" 60;
  line-height: 1.05;
}
.wind-mosaic-card h3 .italic {
  display: block;
  font-style: italic;
  font-size: 0.65em;
  color: var(--c-sand-soft);
  margin-top: 0.2em;
}

/* ---------- Editorial split (Story / Chi siamo) ---------- */
.editorial {
  display: grid;
  grid-template-columns: 1.1fr 1fr;
  gap: clamp(2rem, 5vw, 5rem);
  align-items: center;
}
.editorial.reverse { grid-template-columns: 1fr 1.1fr; }
.editorial.reverse .editorial-image { order: -1; }

.editorial-text {
  max-width: 48ch;
}
.editorial-text h2 {
  margin: 1rem 0 1.5rem;
}
.editorial-image {
  position: relative;
  aspect-ratio: 4 / 5;
  overflow: hidden;
}
.editorial-image img {
  width: 100%; height: 100%; object-fit: cover;
}
/* Varianti per foto orizzontali (es. ingresso brandizzato) */
.editorial-image--wide   { aspect-ratio: 5 / 4; }
.editorial-image--landscape { aspect-ratio: 3 / 2; }
.editorial-image--pos-right img { object-position: right center; }
.editorial-image--pos-left  img { object-position: left center; }
.editorial-image--pos-top   img { object-position: center top; }
.editorial-image--pos-bottom img { object-position: center bottom; }
.editorial-image .frame-label {
  position: absolute;
  bottom: -28px; left: 24px;
  font-family: var(--f-display);
  font-style: italic;
  font-size: 0.95rem;
  color: var(--c-ink-mute);
  background: var(--c-sand);
  padding: 0.4rem 0.8rem;
}

/* ---------- Feature strip (mare/dettagli) ---------- */
.feature-strip {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0;
  margin-top: 4rem;
  border-top: 1px solid var(--c-line);
  border-bottom: 1px solid var(--c-line);
}
.feature-strip .feature {
  padding: 2.5rem 1.5rem;
  text-align: center;
  border-right: 1px solid var(--c-line);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.8rem;
}
.feature-strip .feature:last-child { border-right: 0; }
.feature .feature-num {
  font-family: var(--f-display);
  font-style: italic;
  font-size: 2.2rem;
  color: var(--c-terra);
  font-weight: 320;
}
.feature .feature-label {
  font-family: var(--f-sans);
  font-size: 0.7rem;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  color: var(--c-ink);
}

/* ---------- Image strip / Gallery ---------- */
.gallery {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  gap: 1.2rem;
}
.gallery .g-item { position: relative; overflow: hidden; cursor: zoom-in; }
.gallery .g-item img {
  width: 100%; height: 100%; object-fit: cover;
  transition: transform 1.2s var(--ease-out), filter .6s var(--ease-out);
}
.gallery .g-item:hover img { transform: scale(1.04); }

/* Editorial gallery layout */
.gallery-editorial .g-item:nth-child(1) { grid-column: span 8; aspect-ratio: 16/10; }
.gallery-editorial .g-item:nth-child(2) { grid-column: span 4; aspect-ratio: 4/5; }
.gallery-editorial .g-item:nth-child(3) { grid-column: span 4; aspect-ratio: 4/5; }
.gallery-editorial .g-item:nth-child(4) { grid-column: span 4; aspect-ratio: 4/5; }
.gallery-editorial .g-item:nth-child(5) { grid-column: span 4; aspect-ratio: 4/5; }

/* Apartment gallery layout (legacy) */
.gallery-apt .g-item { grid-column: span 4; aspect-ratio: 4/3; }
.gallery-apt .g-item:nth-child(6n+1) { grid-column: span 8; aspect-ratio: 16/10; }
.gallery-apt .g-item:nth-child(6n+4) { grid-column: span 8; aspect-ratio: 16/9; }

/* ---------- Gallery PREMIUM (apartment scheda) ---------- */
.gallery-premium {
  grid-template-columns: repeat(12, 1fr);
  grid-auto-rows: 9.5vw;
  gap: 1.4rem;
  grid-auto-flow: dense;
  position: relative;
}
.gallery-premium .g-item {
  position: relative;
  overflow: hidden;
  background: var(--c-sand-deep);
  grid-column: span 4;
  grid-row: span 3;
  border-radius: 2px;
  cursor: zoom-in;
  transition: transform .55s var(--ease-out);
}
.gallery-premium .g-item img {
  width: 100%; height: 100%; object-fit: cover;
  transition: transform 1.4s var(--ease-out), filter .6s var(--ease-out);
  filter: saturate(0.94);
}
.gallery-premium .g-item::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, transparent 60%, rgba(0,54,89,0.35) 100%);
  opacity: 0;
  transition: opacity .5s var(--ease-out);
  pointer-events: none;
}
.gallery-premium .g-item:hover { transform: translateY(-4px); }
.gallery-premium .g-item:hover img { transform: scale(1.06); filter: saturate(1.08); }
.gallery-premium .g-item:hover::after { opacity: 1; }

/* numero romano flottante sulla foto chiave */
.gallery-premium .g-roman {
  position: absolute;
  top: 1.4rem; left: 1.4rem;
  font-family: var(--f-display);
  font-style: italic;
  font-size: 2.4rem;
  font-weight: 320;
  color: var(--c-cream);
  z-index: 3;
  text-shadow: 0 2px 20px rgba(0,0,0,0.4);
  font-variation-settings: "opsz" 96, "SOFT" 80;
}

/* Pattern editoriale — ciclo di 9 foto per ritmo asimmetrico ricco */
.gallery-premium .g-item:nth-child(9n+1) { grid-column: span 7; grid-row: span 5; }
.gallery-premium .g-item:nth-child(9n+2) { grid-column: span 5; grid-row: span 5; }
.gallery-premium .g-item:nth-child(9n+3) { grid-column: span 4; grid-row: span 3; }
.gallery-premium .g-item:nth-child(9n+4) { grid-column: span 4; grid-row: span 3; }
.gallery-premium .g-item:nth-child(9n+5) { grid-column: span 4; grid-row: span 3; }
.gallery-premium .g-item:nth-child(9n+6) { grid-column: span 8; grid-row: span 4; }
.gallery-premium .g-item:nth-child(9n+7) { grid-column: span 4; grid-row: span 4; }
.gallery-premium .g-item:nth-child(9n+8) { grid-column: span 5; grid-row: span 3; }
.gallery-premium .g-item:nth-child(9n+0) { grid-column: span 7; grid-row: span 3; }

/* Caption sotto la foto in evidenza (opzionale via data-attr) */
.gallery-premium .g-item[data-pos="1"]::before {
  content: "Vista d'insieme";
  position: absolute;
  bottom: 1.4rem; left: 1.4rem;
  font-family: var(--f-sans);
  font-size: 0.62rem;
  letter-spacing: 0.32em;
  text-transform: uppercase;
  color: var(--c-cream);
  background: rgba(0,54,89,0.6);
  padding: 0.5rem 0.9rem;
  border-radius: 999px;
  z-index: 3;
  backdrop-filter: blur(8px);
  opacity: 0;
  transform: translateY(8px);
  transition: opacity .5s var(--ease-out), transform .5s var(--ease-out);
}
.gallery-premium .g-item[data-pos="1"]:hover::before { opacity: 1; transform: none; }

/* Mobile: griglia semplice ma curata */
@media (max-width: 980px) {
  .gallery-premium {
    grid-template-columns: repeat(6, 1fr);
    grid-auto-rows: 30vw;
    gap: 0.8rem;
  }
  .gallery-premium .g-item,
  .gallery-premium .g-item:nth-child(9n+1),
  .gallery-premium .g-item:nth-child(9n+2),
  .gallery-premium .g-item:nth-child(9n+3),
  .gallery-premium .g-item:nth-child(9n+4),
  .gallery-premium .g-item:nth-child(9n+5),
  .gallery-premium .g-item:nth-child(9n+6),
  .gallery-premium .g-item:nth-child(9n+7),
  .gallery-premium .g-item:nth-child(9n+8),
  .gallery-premium .g-item:nth-child(9n+0) {
    grid-column: span 3;
    grid-row: span 2;
  }
  .gallery-premium .g-item:nth-child(7n+1) {
    grid-column: span 6;
    grid-row: span 3;
  }
  .gallery-premium .g-roman { font-size: 1.6rem; top: 1rem; left: 1rem; }
}

/* ---------- Specs (apartment) ---------- */
.specs {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 1px;
  background: var(--c-line);
  border: 1px solid var(--c-line);
  margin-top: 3rem;
}
.spec {
  padding: 1.8rem 1.4rem;
  background: var(--c-cream);
  display: flex;
  flex-direction: column;
  gap: 0.6rem;
  align-items: flex-start;
}
.spec .spec-icon {
  width: 28px;
  height: 28px;
  color: var(--c-terra);
}
.spec .spec-label {
  font-family: var(--f-sans);
  font-size: 0.65rem;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  color: var(--c-ink-mute);
}
.spec .spec-value {
  font-family: var(--f-display);
  font-size: 1.35rem;
  font-weight: 360;
  font-variation-settings: "opsz" 48, "SOFT" 30;
  color: var(--c-ink);
  line-height: 1.1;
}

/* ---------- Amenities list ---------- */
.amenities {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 0.4rem 2rem;
  margin-top: 2rem;
}
.amenities li {
  padding: 0.85rem 0;
  border-bottom: 1px solid var(--c-line-soft);
  display: flex;
  align-items: center;
  gap: 0.8rem;
  font-family: var(--f-body);
  font-size: 1.05rem;
  color: var(--c-ink);
}
.amenities li::before {
  content: "+";
  font-family: var(--f-display);
  font-style: italic;
  color: var(--c-terra);
  font-size: 1.4rem;
  line-height: 1;
}

/* ---------- Quote block ---------- */
.quote {
  text-align: center;
  max-width: 880px;
  margin-inline: auto;
  position: relative;
  padding: 2rem 1rem;
}
.quote::before {
  content: "“";
  position: absolute;
  top: -3rem; left: 50%;
  transform: translateX(-50%);
  font-family: var(--f-display);
  font-style: italic;
  font-size: 9rem;
  color: var(--c-gold-soft);
  line-height: 1;
  opacity: 0.5;
}
.quote p {
  font-family: var(--f-display);
  font-style: italic;
  font-weight: 320;
  font-size: clamp(1.5rem, 3vw, 2.4rem);
  line-height: 1.4;
  color: var(--c-ink);
  font-variation-settings: "opsz" 48, "SOFT" 80;
}
.quote .quote-attr {
  font-family: var(--f-sans);
  font-size: 0.7rem;
  letter-spacing: 0.32em;
  text-transform: uppercase;
  color: var(--c-terra-deep);
  margin-top: 1.5rem;
  font-style: normal;
  font-weight: 500;
}

/* ---------- Timeline (Chi siamo) ---------- */
.timeline {
  position: relative;
  margin-top: 4rem;
  padding-left: 2.4rem;
}
.timeline::before {
  content: "";
  position: absolute;
  left: 0.65rem;
  top: 0; bottom: 0;
  width: 1px;
  background: var(--c-line);
}
.timeline-item {
  position: relative;
  padding-bottom: 3rem;
}
.timeline-item::before {
  content: "";
  position: absolute;
  left: -2rem;
  top: 0.4rem;
  width: 11px; height: 11px;
  border-radius: 50%;
  background: var(--c-terra);
  box-shadow: 0 0 0 4px var(--c-sand);
}
.timeline-item .year {
  font-family: var(--f-display);
  font-style: italic;
  font-weight: 320;
  font-size: 2rem;
  color: var(--c-terra);
  line-height: 1;
}
.timeline-item h3 {
  margin: 0.5rem 0 0.5rem;
  font-size: 1.4rem;
  font-weight: 420;
}
.timeline-item p { color: var(--c-ink-soft); max-width: 56ch; }

/* ---------- Apartment hero ---------- */
.apt-hero {
  padding-top: 9rem;
  padding-bottom: 4rem;
  background: var(--c-sand);
}
.apt-hero .container { display: grid; grid-template-columns: 1.05fr 1fr; gap: 4rem; align-items: end; }
.apt-hero-text { padding-bottom: 1rem; }
.apt-hero .apt-meta {
  font-family: var(--f-sans);
  font-size: 0.7rem;
  letter-spacing: 0.34em;
  text-transform: uppercase;
  color: var(--c-blue);
  display: flex;
  align-items: center;
  gap: 0.8rem;
}
.apt-hero .apt-meta .compass-mini { width: 42px; height: 42px; color: var(--c-blue); }
.apt-hero h1 {
  font-size: clamp(4rem, 11vw, 9.5rem);
  font-weight: 280;
  letter-spacing: -0.04em;
  font-variation-settings: "opsz" 144, "SOFT" 100;
  line-height: 0.92;
  margin-top: 1.4rem;
}
.apt-hero h1 .italic {
  font-style: italic; color: var(--c-blue);
  font-weight: 240;
  display: block;
}
.apt-hero .apt-tagline {
  font-family: var(--f-display);
  font-style: italic;
  font-size: clamp(1.2rem, 1.8vw, 1.5rem);
  color: var(--c-ink-soft);
  margin-top: 2rem;
  max-width: 44ch;
  font-variation-settings: "opsz" 24, "SOFT" 50;
}
.apt-hero-actions {
  margin-top: 2.5rem;
  display: flex;
  align-items: center;
  gap: 1.8rem;
  flex-wrap: wrap;
}
.apt-cta { background: var(--c-blue-deep); color: var(--c-cream); }
.apt-cta:hover { background: var(--c-blue); color: var(--c-cream); }

.apt-hero-image {
  aspect-ratio: 4/5;
  overflow: hidden;
  position: relative;
}
.apt-hero-image img { width: 100%; height: 100%; object-fit: cover; }
.apt-hero-image .img-tag {
  position: absolute;
  top: 1.5rem; left: 1.5rem;
  font-family: var(--f-sans);
  font-size: 0.62rem;
  letter-spacing: 0.32em;
  text-transform: uppercase;
  color: var(--c-cream);
  background: rgba(0,54,89,0.55);
  padding: 0.5rem 0.9rem;
  backdrop-filter: blur(8px);
  border-radius: 99px;
}
.apt-hero-image .apt-badge {
  position: absolute;
  bottom: 1.5rem; left: 1.5rem;
  font-family: var(--f-sans);
  font-size: 0.65rem;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  color: var(--c-cream);
  background: var(--c-terra);
  padding: 0.6rem 1.1rem;
  border-radius: 99px;
  font-weight: 500;
}

/* ---------- Section header ---------- */
.section-head {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: end;
  gap: 2rem;
  padding-bottom: 3rem;
  border-bottom: 1px solid var(--c-line);
  margin-bottom: 4rem;
}
.section-head .section-num {
  font-family: var(--f-display);
  font-style: italic;
  font-size: 1.1rem;
  color: var(--c-gold);
  letter-spacing: 0.2em;
}
.section-head h2 { margin: 0; flex: 1; }
.section-head .section-link {
  font-family: var(--f-sans);
  font-size: 0.72rem;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  color: var(--c-ink);
}

/* ---------- Wind navigation (apartment page) ---------- */
.wind-nav {
  background: var(--c-ink);
  color: var(--c-sand);
  padding: 5rem 0;
}
.wind-nav .container {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 4rem;
  align-items: center;
}
.wind-nav h2 { color: var(--c-sand); font-size: clamp(2rem, 4vw, 3.4rem); font-weight: 320; }
.wind-nav a { color: var(--c-sand-soft); }
.wind-nav a:hover { color: var(--c-terra-soft); }
.wind-nav .prev-next {
  display: flex; flex-direction: column; gap: 1.5rem;
}
.wind-nav .prev-next a {
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
  border-bottom: 1px solid rgba(239,230,210,0.18);
  padding-bottom: 1.5rem;
}
.wind-nav .prev-next .pn-label {
  font-family: var(--f-sans);
  font-size: 0.65rem;
  letter-spacing: 0.32em;
  text-transform: uppercase;
  color: var(--c-terra-soft);
}
.wind-nav .prev-next .pn-name {
  font-family: var(--f-display);
  font-style: italic;
  font-size: 2rem;
  font-weight: 320;
}

/* ---------- Garden section ---------- */
.garden-section {
  background: linear-gradient(180deg, var(--c-sand) 0%, var(--c-sand-deep) 100%);
  position: relative;
  overflow: hidden;
}
.garden-section::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image: radial-gradient(circle at 20% 30%, rgba(184, 146, 79, 0.07), transparent 40%),
                    radial-gradient(circle at 80% 70%, rgba(110, 126, 92, 0.08), transparent 40%);
  pointer-events: none;
}

/* ---------- Map / Location ---------- */
.location {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 4rem;
  align-items: center;
}
.location-map {
  aspect-ratio: 1/1;
  border-radius: 50%;
  overflow: hidden;
  border: 1px solid var(--c-line);
  position: relative;
}
.location-map iframe { width: 100%; height: 100%; border: 0; filter: sepia(0.2) saturate(0.85) hue-rotate(-10deg); }
.location-pin {
  position: absolute;
  top: 50%; left: 50%;
  transform: translate(-50%, -50%);
  width: 50px; height: 50px;
  pointer-events: none;
  color: var(--c-terra);
}

.map-wide {
  width: 100%;
  aspect-ratio: 21/9;
  overflow: hidden;
  border: 1px solid var(--c-line);
  border-radius: 4px;
  background: var(--c-blue-pale);
}
.map-wide iframe {
  width: 100%; height: 100%; border: 0;
  filter: saturate(0.7) hue-rotate(-8deg);
}
@media (max-width: 980px) {
  .map-wide { aspect-ratio: 4/5; }
}

/* ---------- Contact form ---------- */
.contact-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 5rem;
  align-items: start;
}
.contact-info dl {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 1.2rem 2rem;
  margin: 2rem 0;
}
.contact-info dt {
  font-family: var(--f-sans);
  font-size: 0.7rem;
  letter-spacing: 0.32em;
  text-transform: uppercase;
  color: var(--c-blue);
  font-weight: 500;
  padding-top: 0.2rem;
}
.contact-info dd {
  margin: 0;
  font-family: var(--f-display);
  font-size: 1.3rem;
  font-weight: 360;
  color: var(--c-ink);
  font-variation-settings: "opsz" 48, "SOFT" 20;
}
.contact-info dd a { display: inline-block; }

.form {
  display: grid;
  gap: 1.4rem;
  background: var(--c-paper);
  padding: 2.5rem;
  border: 1px solid var(--c-line);
}
.form-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1.4rem;
}
.field { display: flex; flex-direction: column; gap: 0.4rem; }
.field label {
  font-family: var(--f-sans);
  font-size: 0.65rem;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  color: var(--c-ink-mute);
  font-weight: 500;
}
.field input,
.field select,
.field textarea {
  font-family: var(--f-body);
  font-size: 1.05rem;
  color: var(--c-ink);
  background: transparent;
  border: 0;
  border-bottom: 1px solid var(--c-line);
  padding: 0.7rem 0;
  outline: none;
  transition: border-color .3s var(--ease-out);
}
.field input:focus,
.field select:focus,
.field textarea:focus { border-color: var(--c-terra); }
.field textarea { min-height: 100px; resize: vertical; }
.form button[type="submit"] {
  justify-self: start;
  margin-top: 0.5rem;
}

/* ---------- Footer ---------- */
.site-footer {
  background: var(--c-ink);
  color: var(--c-sand-soft);
  padding: 6rem 0 2.5rem;
  position: relative;
}
.footer-grid {
  display: grid;
  grid-template-columns: 1.4fr 1fr 1fr 1fr;
  gap: 3rem;
  padding-bottom: 4rem;
  border-bottom: 1px solid rgba(239,230,210,0.12);
}
.footer-brand .brand {
  color: var(--c-cream);
  font-size: 1.7rem;
  margin-bottom: 1.5rem;
  display: inline-block;
}
.footer-brand .brand small { color: var(--c-blue-soft); }
.footer-logo { display: block; height: 60px; width: auto; max-width: 240px; }
.footer-brand p {
  font-family: var(--f-display);
  font-style: italic;
  font-size: 1.05rem;
  color: var(--c-sand);
  font-variation-settings: "opsz" 24, "SOFT" 40;
  max-width: 36ch;
}
.footer-col h4 {
  font-family: var(--f-sans);
  font-size: 0.7rem;
  letter-spacing: 0.32em;
  text-transform: uppercase;
  color: var(--c-terra-soft);
  font-weight: 500;
  margin-bottom: 1.5rem;
}
.footer-col ul li { margin-bottom: 0.7rem; }
.footer-col ul a {
  font-family: var(--f-display);
  font-size: 1.1rem;
  color: var(--c-sand-soft);
}
.footer-col ul a:hover { color: var(--c-terra-soft); }

.footer-bottom {
  padding-top: 2.5rem;
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 1.5rem;
  font-family: var(--f-sans);
  font-size: 0.7rem;
  letter-spacing: 0.18em;
  color: var(--c-sand-deep);
  opacity: 0.8;
}
.footer-bottom .cir-list {
  display: flex; gap: 1rem; flex-wrap: wrap; max-width: 70%;
}
.footer-bottom .cir-list span { font-family: var(--f-mono); font-size: 0.65rem; }

/* =====================================================================
   RECENSIONI — carosello Booking (home)
   ===================================================================== */
.reviews-section {
  background: var(--c-cream);
  overflow: hidden;
}
.reviews-head {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: end;
  gap: 3rem;
  padding-bottom: 3rem;
  border-bottom: 1px solid var(--c-line);
  margin-bottom: 3rem;
}
.reviews-score {
  display: flex;
  align-items: center;
  gap: 1.1rem;
}
.reviews-score-badge {
  font-family: var(--f-display);
  font-size: 2.6rem;
  font-weight: 380;
  font-variation-settings: "opsz" 96, "SOFT" 40;
  color: var(--c-cream);
  background: var(--c-blue-deep);
  width: 84px;
  height: 84px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50% 50% 50% 6px;
  line-height: 1;
}
.reviews-score-text {
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
}
.reviews-score-text strong {
  font-family: var(--f-display);
  font-size: 1.3rem;
  font-weight: 420;
  color: var(--c-ink);
}
.reviews-score-text span {
  font-family: var(--f-sans);
  font-size: 0.7rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--c-ink-mute);
}
.reviews-score-text .reviews-source {
  color: var(--c-blue);
  font-weight: 500;
}
.reviews-nav {
  display: flex;
  gap: 0.6rem;
}
.reviews-arrow {
  width: 52px;
  height: 52px;
  border-radius: 50%;
  border: 1px solid var(--c-ink);
  color: var(--c-ink);
  font-size: 1.1rem;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all .3s var(--ease-out);
  cursor: pointer;
}
.reviews-arrow:hover {
  background: var(--c-ink);
  color: var(--c-sand);
}
.reviews-arrow:disabled {
  opacity: 0.3;
  cursor: default;
}
.reviews-arrow:disabled:hover {
  background: transparent;
  color: var(--c-ink);
}

.reviews-track {
  display: flex;
  gap: 1.4rem;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scroll-behavior: smooth;
  padding-bottom: 1rem;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}
.reviews-track::-webkit-scrollbar { display: none; }
.reviews-track:focus-visible {
  outline: 2px solid var(--c-blue);
  outline-offset: 4px;
}

.review-card {
  flex: 0 0 clamp(280px, 31%, 420px);
  scroll-snap-align: start;
  background: var(--c-paper);
  border: 1px solid var(--c-line);
  border-radius: 4px;
  padding: 2.2rem 2rem 1.8rem;
  display: flex;
  flex-direction: column;
  gap: 1.2rem;
  position: relative;
  transition: transform .45s var(--ease-out), box-shadow .45s var(--ease-out), border-color .45s var(--ease-out);
}
.review-card:hover {
  transform: translateY(-5px);
  box-shadow: var(--shadow-soft);
  border-color: var(--c-blue-soft);
}
.review-rating {
  position: absolute;
  top: 1.6rem; right: 1.6rem;
  font-family: var(--f-sans);
  font-size: 0.78rem;
  font-weight: 600;
  color: var(--c-cream);
  background: var(--c-blue-deep);
  padding: 0.35rem 0.7rem;
  border-radius: 8px 8px 8px 2px;
  letter-spacing: 0.04em;
}
.review-card blockquote {
  margin: 0;
  font-family: var(--f-display);
  font-style: italic;
  font-size: 1.15rem;
  line-height: 1.5;
  font-weight: 320;
  font-variation-settings: "opsz" 36, "SOFT" 60;
  color: var(--c-ink);
  flex: 1;
  padding-right: 2.5rem;
}
.review-card footer {
  display: flex;
  align-items: baseline;
  gap: 0.7rem;
  padding-top: 1rem;
  border-top: 1px solid var(--c-line-soft);
}
.review-card footer strong {
  font-family: var(--f-display);
  font-size: 1.05rem;
  font-weight: 460;
  color: var(--c-ink);
}
.review-card footer span {
  font-family: var(--f-sans);
  font-size: 0.65rem;
  letter-spacing: 0.24em;
  text-transform: uppercase;
  color: var(--c-ink-mute);
}

.reviews-footer {
  margin-top: 2.5rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 1.5rem;
}
.reviews-rank {
  font-family: var(--f-sans);
  font-size: 0.7rem;
  letter-spacing: 0.26em;
  text-transform: uppercase;
  color: var(--c-ink-mute);
  display: inline-flex;
  align-items: center;
  gap: 0.7rem;
}
.reviews-rank::before {
  content: "";
  width: 8px; height: 8px;
  border-radius: 50%;
  background: var(--c-gold);
}

@media (max-width: 980px) {
  .reviews-head {
    grid-template-columns: 1fr;
    gap: 1.6rem;
    align-items: start;
  }
  .reviews-score { order: 2; }
  .reviews-nav { order: 3; }
  .reviews-score-badge { width: 68px; height: 68px; font-size: 2rem; }
  .review-card { flex-basis: clamp(260px, 82%, 340px); }
  .reviews-footer { flex-direction: column; align-items: flex-start; }
}

/* =====================================================================
   TIPS — Diario di bordo (blog editoriale)
   ===================================================================== */

/* ---------- Tip filters (archive) ---------- */
.tip-filters {
  display: flex;
  gap: 0.5rem;
  flex-wrap: wrap;
  padding-bottom: 2rem;
  border-bottom: 1px solid var(--c-line);
}
.tip-filter {
  font-family: var(--f-sans);
  font-size: 0.7rem;
  letter-spacing: 0.24em;
  text-transform: uppercase;
  font-weight: 500;
  color: var(--c-ink-mute);
  padding: 0.7rem 1.3rem;
  border-radius: 999px;
  border: 1px solid var(--c-line);
  background: transparent;
  cursor: pointer;
  transition: all .3s var(--ease-out);
}
.tip-filter:hover { color: var(--c-ink); border-color: var(--c-ink); }
.tip-filter.active {
  background: var(--c-ink);
  border-color: var(--c-ink);
  color: var(--c-sand);
}

/* ---------- Featured article (archive) ---------- */
.tip-featured {
  display: grid;
  grid-template-columns: 1.3fr 1fr;
  gap: 0;
  background: var(--c-cream);
  overflow: hidden;
  border: 1px solid var(--c-line);
  border-radius: 4px;
  transition: transform .55s var(--ease-out), box-shadow .55s var(--ease-out);
  color: var(--c-ink);
  align-items: stretch;
  min-height: 460px;
}
.tip-featured:hover {
  transform: translateY(-4px);
  box-shadow: var(--shadow-soft);
  color: var(--c-ink);
}
.tip-featured-cover {
  position: relative;
  overflow: hidden;
  min-height: 100%;
}
.tip-featured-cover img {
  position: absolute;
  inset: 0;
  width: 100%; height: 100%; object-fit: cover;
  transition: transform 1.4s var(--ease-out);
}
.tip-featured:hover .tip-featured-cover img { transform: scale(1.06); }
.tip-featured-badge {
  position: absolute;
  top: 1.5rem; left: 1.5rem;
  font-family: var(--f-sans);
  font-size: 0.6rem;
  letter-spacing: 0.32em;
  text-transform: uppercase;
  font-weight: 600;
  color: var(--c-cream);
  background: var(--c-terra);
  padding: 0.5rem 1rem;
  border-radius: 999px;
}
.tip-featured-body {
  padding: clamp(2rem, 4vw, 4rem);
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.tip-featured-body h2 { line-height: 1; }
.tip-featured-body .lead { margin: 2rem 0 0; max-width: 38ch; }
.tip-featured-byline {
  margin-top: 2rem;
  display: flex;
  gap: 0.6rem;
  align-items: center;
  font-family: var(--f-sans);
  font-size: 0.72rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--c-ink-mute);
}
.tip-featured-byline .dot { opacity: 0.5; }
.tip-featured-byline strong { color: var(--c-ink); font-weight: 600; }

/* ---------- Tip cards grid (archive + related) ---------- */
.tip-cards-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
  gap: 2rem;
  margin-top: 2rem;
}
.tip-card {
  display: flex;
  flex-direction: column;
  background: var(--c-cream);
  border: 1px solid var(--c-line);
  overflow: hidden;
  border-radius: 2px;
  transition: transform .45s var(--ease-out), box-shadow .45s var(--ease-out), border-color .45s var(--ease-out);
  color: var(--c-ink);
  position: relative;
}
.tip-card:hover {
  transform: translateY(-6px);
  box-shadow: var(--shadow-soft);
  border-color: var(--c-blue-soft);
  color: var(--c-ink);
}
.tip-card-cover {
  position: relative;
  aspect-ratio: 16/10;
  overflow: hidden;
  background: var(--c-sand-deep);
}
.tip-card-cover img {
  width: 100%; height: 100%; object-fit: cover;
  transition: transform 1.4s var(--ease-out), filter .6s var(--ease-out);
  filter: saturate(0.94);
}
.tip-card:hover .tip-card-cover img {
  transform: scale(1.06);
  filter: saturate(1.05);
}
.tip-card-body {
  padding: 1.8rem 1.8rem 2rem;
  display: flex;
  flex-direction: column;
  gap: 0.7rem;
  flex: 1;
}
.tip-card-body h3 {
  font-family: var(--f-display);
  font-size: 1.4rem;
  font-weight: 380;
  font-variation-settings: "opsz" 64, "SOFT" 30;
  letter-spacing: -0.005em;
  line-height: 1.18;
  color: var(--c-ink);
  margin: 0;
}
.tip-card-body p {
  font-family: var(--f-body);
  font-size: 1rem;
  line-height: 1.55;
  color: var(--c-ink-soft);
  margin: 0;
  flex: 1;
}
.tip-card-meta {
  margin-top: 0.8rem;
  padding-top: 1rem;
  border-top: 1px solid var(--c-line-soft);
  display: flex;
  justify-content: space-between;
  font-family: var(--f-sans);
  font-size: 0.66rem;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--c-ink-mute);
}

/* Filtri: stati hidden */
.tip-card.is-hidden,
.tip-featured.is-hidden { display: none; }

.tip-empty {
  margin-top: 3rem;
  text-align: center;
  font-family: var(--f-display);
  font-style: italic;
  font-size: 1.2rem;
  color: var(--c-ink-mute);
}

/* ---------- Newsletter form ---------- */
.newsletter-form {
  max-width: 480px;
  margin: 2rem auto 0;
}
.newsletter-row {
  display: flex;
  gap: 0.6rem;
}
.newsletter-form input[type="email"] {
  flex: 1;
  font-family: var(--f-body);
  font-size: 1.05rem;
  padding: 1rem 1.4rem;
  border: 1px solid var(--c-line);
  border-radius: 999px;
  background: var(--c-paper);
  color: var(--c-ink);
  outline: none;
  transition: border-color .3s var(--ease-out);
}
.newsletter-form input[type="email"]:focus { border-color: var(--c-blue); }
.newsletter-form .btn { white-space: nowrap; }
@media (max-width: 540px) {
  .newsletter-row { flex-direction: column; }
  .newsletter-form .btn { justify-content: center; }
}

/* ---------- TIP SINGLE — Article ---------- */
.tip-article { background: var(--c-sand); }

.tip-hero {
  padding: 10rem 0 3rem;
  background: var(--c-sand);
}
.tip-hero .container { max-width: 920px; margin-inline: auto; text-align: center; }
.tip-hero-meta {
  display: inline-flex;
  align-items: center;
  gap: 0.7rem;
  font-family: var(--f-sans);
  font-size: 0.7rem;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  color: var(--c-ink-mute);
  margin-bottom: 1.5rem;
}
.tip-hero-meta .dot { opacity: 0.5; }
.tip-hero-meta .tip-back { color: var(--c-blue); font-weight: 500; }
.tip-hero-meta .tip-back:hover { color: var(--c-blue-deep); }
.tip-hero-meta .tip-category { color: var(--c-ink); font-weight: 500; }
.tip-title {
  font-family: var(--f-display);
  font-size: clamp(2.6rem, 6vw, 5.2rem);
  font-weight: 320;
  font-variation-settings: "opsz" 144, "SOFT" 80;
  letter-spacing: -0.025em;
  line-height: 1.02;
  color: var(--c-ink);
  margin: 1rem 0 0;
}
.tip-lead {
  font-family: var(--f-display);
  font-style: italic;
  font-size: clamp(1.3rem, 1.9vw, 1.6rem);
  line-height: 1.45;
  color: var(--c-ink-soft);
  font-variation-settings: "opsz" 36, "SOFT" 60;
  margin: 2rem auto 0;
  max-width: 36ch;
}
.tip-byline {
  margin-top: 2.2rem;
  display: inline-flex;
  align-items: center;
  gap: 0.6rem;
  font-family: var(--f-sans);
  font-size: 0.72rem;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--c-ink-mute);
}
.tip-byline .dot { opacity: 0.5; }
.tip-byline strong { color: var(--c-ink); font-weight: 600; }

.tip-cover {
  width: 100%;
  aspect-ratio: 21/9;
  overflow: hidden;
  background: var(--c-sand-deep);
  margin-bottom: 4rem;
}
.tip-cover img {
  width: 100%; height: 100%; object-fit: cover;
}

.tip-body {
  max-width: 720px;
  margin-inline: auto;
  padding-bottom: 4rem;
}
.tip-body p {
  font-family: var(--f-body);
  font-size: 1.2rem;
  line-height: 1.75;
  color: var(--c-ink);
  margin: 0 0 1.6em;
}
.tip-body p:first-of-type::first-letter {
  font-family: var(--f-display);
  font-style: italic;
  font-size: 4.5rem;
  font-weight: 360;
  font-variation-settings: "opsz" 144, "SOFT" 100;
  float: left;
  line-height: 0.85;
  margin: 0.15em 0.15em 0 0;
  color: var(--c-blue);
}
.tip-body h2 {
  font-family: var(--f-display);
  font-size: clamp(1.6rem, 2.8vw, 2.2rem);
  font-weight: 400;
  font-variation-settings: "opsz" 96, "SOFT" 30;
  letter-spacing: -0.01em;
  color: var(--c-ink);
  margin: 3.2rem 0 1.2rem;
  position: relative;
  padding-top: 1rem;
}
.tip-body h2::before {
  content: "";
  position: absolute;
  top: 0; left: 0;
  width: 48px;
  height: 1px;
  background: var(--c-blue);
}
.tip-body h3 {
  font-family: var(--f-display);
  font-size: 1.4rem;
  font-weight: 420;
  color: var(--c-ink);
  margin: 2.4rem 0 1rem;
}
.tip-body .tip-quote {
  margin: 3rem 0;
  padding: 0 0 0 2rem;
  border-left: 2px solid var(--c-blue);
}
.tip-body .tip-quote p {
  font-family: var(--f-display);
  font-style: italic;
  font-size: clamp(1.4rem, 2.2vw, 1.8rem);
  line-height: 1.4;
  color: var(--c-ink);
  font-variation-settings: "opsz" 48, "SOFT" 70;
  margin: 0;
}
.tip-body .tip-quote cite {
  display: block;
  margin-top: 1rem;
  font-family: var(--f-sans);
  font-style: normal;
  font-size: 0.7rem;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  color: var(--c-blue);
  font-weight: 500;
}
.tip-body .tip-figure {
  margin: 3rem -2rem;
}
.tip-body .tip-figure img { width: 100%; height: auto; }
.tip-body .tip-figure figcaption {
  margin-top: 0.8rem;
  text-align: center;
  font-family: var(--f-display);
  font-style: italic;
  font-size: 0.95rem;
  color: var(--c-ink-mute);
}

/* tip footer (share) */
.tip-footer { max-width: 720px; margin-inline: auto; padding-bottom: 4rem; }
.tip-share {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 1.5rem;
  padding-top: 1rem;
}
.tip-share-links {
  display: flex;
  gap: 1.4rem;
}
.tip-share-links a {
  font-family: var(--f-sans);
  font-size: 0.7rem;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  font-weight: 500;
  color: var(--c-ink);
  border-bottom: 1px solid transparent;
  padding-bottom: 2px;
  transition: all .3s var(--ease-out);
}
.tip-share-links a:hover { color: var(--c-blue); border-color: var(--c-blue); }

/* ---------- Tips home preview section ---------- */
.tips-home-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 2rem;
  margin-top: 4rem;
}
@media (max-width: 980px) {
  .tip-featured { grid-template-columns: 1fr; }
  .tip-featured-cover { aspect-ratio: 16/10; }
  .tip-cover { aspect-ratio: 16/10; margin-bottom: 2rem; }
  .tip-body { padding-inline: 1rem; }
  .tip-body .tip-figure { margin: 2rem 0; }
  .tips-home-grid { grid-template-columns: 1fr; }
}

/* ---------- Lightbox ---------- */
.lightbox {
  position: fixed;
  inset: 0;
  background: rgba(27, 61, 82, 0.94);
  z-index: 200;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 4rem;
  cursor: zoom-out;
}
.lightbox.open { display: flex; }
.lightbox img {
  max-width: 90vw;
  max-height: 85vh;
  object-fit: contain;
  border: 1px solid rgba(239,230,210,0.2);
}
.lightbox-close {
  position: absolute;
  top: 2rem; right: 2rem;
  color: var(--c-cream);
  font-family: var(--f-sans);
  font-size: 0.8rem;
  letter-spacing: 0.32em;
  text-transform: uppercase;
  cursor: pointer;
}
.lightbox-counter {
  position: absolute;
  bottom: 2rem; left: 50%;
  transform: translateX(-50%);
  color: var(--c-cream);
  font-family: var(--f-display);
  font-style: italic;
  font-size: 1.1rem;
}
.lightbox-prev, .lightbox-next {
  position: absolute;
  top: 50%; transform: translateY(-50%);
  width: 56px; height: 56px;
  border-radius: 50%;
  border: 1px solid rgba(239,230,210,0.3);
  color: var(--c-cream);
  background: transparent;
  display: flex; align-items: center; justify-content: center;
  cursor: pointer;
  transition: all .25s var(--ease-out);
}
.lightbox-prev { left: 2rem; }
.lightbox-next { right: 2rem; }
.lightbox-prev:hover, .lightbox-next:hover {
  background: rgba(239,230,210,0.1);
  border-color: var(--c-terra-soft);
}

/* ---------- Scroll Reveal ---------- */
.reveal {
  opacity: 0;
  transform: translateY(24px);
  transition: opacity .9s var(--ease-out), transform .9s var(--ease-out);
}
.reveal.is-visible {
  opacity: 1;
  transform: none;
}
.reveal-delay-1 { transition-delay: .12s; }
.reveal-delay-2 { transition-delay: .24s; }
.reveal-delay-3 { transition-delay: .36s; }
.reveal-delay-4 { transition-delay: .48s; }

/* ---------- Decorative SVG ornaments ---------- */
.ornament-divider {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1.6rem;
  margin: 3rem auto;
  color: var(--c-gold);
}
.ornament-divider::before,
.ornament-divider::after {
  content: "";
  width: 80px; height: 1px;
  background: var(--c-line);
}
.ornament-divider svg { width: 36px; height: 36px; }

/* ---------- Mobile menu ---------- */
.mobile-menu {
  position: fixed;
  inset: 0;
  background: var(--c-sand);
  background-image:
    radial-gradient(ellipse at 30% 20%, rgba(0, 133, 179, 0.06), transparent 50%),
    radial-gradient(ellipse at 80% 80%, rgba(196, 107, 69, 0.05), transparent 50%);
  z-index: 85;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  gap: 0.4rem;
  padding: 7rem 2.4rem 3rem;
  opacity: 0;
  pointer-events: none;
  transform: translateY(-10px);
  transition: opacity .4s var(--ease-out), transform .4s var(--ease-out);
  overflow-y: auto;
}
body.menu-open .mobile-menu {
  opacity: 1;
  pointer-events: auto;
  transform: none;
}
.mobile-menu::before {
  content: "— Naviga";
  font-family: var(--f-sans);
  font-size: 0.7rem;
  letter-spacing: 0.32em;
  text-transform: uppercase;
  font-weight: 500;
  color: var(--c-blue);
  margin-bottom: 1.6rem;
}
.mobile-menu a {
  font-family: var(--f-display);
  font-style: italic;
  font-size: clamp(1.8rem, 8vw, 2.6rem);
  font-weight: 320;
  font-variation-settings: "opsz" 96, "SOFT" 60;
  color: var(--c-ink);
  line-height: 1.1;
  padding: 0.35rem 0;
  border-bottom: 1px solid transparent;
  transition: color .3s var(--ease-out), border-color .3s var(--ease-out), padding-left .3s var(--ease-out);
}
.mobile-menu a:hover {
  color: var(--c-blue);
  padding-left: 0.6rem;
}
.mobile-menu .mobile-cta {
  margin-top: 2rem;
  font-family: var(--f-sans);
  font-style: normal;
  font-size: 0.78rem;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  font-weight: 500;
  display: flex;
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  align-self: auto;
  align-items: center;
  justify-content: center;
  color: var(--c-sand);
  background: var(--c-ink);
  padding: 1rem 1.6rem;
  border-bottom: 0;
  border-radius: 999px;
}
.mobile-menu .mobile-cta:hover {
  color: var(--c-sand);
  background: var(--c-blue-deep);
  padding: 1rem 1.6rem;          /* annulla scroll-left dell'hover generico */
  border-bottom: 0;
  transform: none;
}

/* Quando il menu è aperto: header sopra hero scura → logo scuro / toggle scuro */
body.menu-open .site-header {
  background: transparent;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
/* Menu aperto: il pannello e' chiaro, quindi serve il logo scuro anche sopra
   la hero scura. Il secondo selettore alza la specificita' quanto basta a
   battere `body:not(.has-light-hero) .site-header:not(.scrolled) ...`. */
body.menu-open .site-header .brand-logo-dark,
body.menu-open:not(.has-light-hero) .site-header:not(.scrolled) .brand-logo-dark { display: block; }
body.menu-open .site-header .brand-logo-light,
body.menu-open:not(.has-light-hero) .site-header:not(.scrolled) .brand-logo-light { display: none; }
body.menu-open .site-header .brand,
body.menu-open:not(.has-light-hero) .site-header:not(.scrolled) .brand { color: var(--c-ink); }
body.menu-open .site-header .menu-toggle { border-color: var(--c-ink); }
body.menu-open .site-header .menu-toggle span,
body.menu-open .site-header .menu-toggle span::before,
body.menu-open .site-header .menu-toggle span::after { background: var(--c-ink); }

/* ---------- Responsive ---------- */
@media (max-width: 980px) {
  :root {
    --container: 92vw;
    --container-narrow: 90vw;
    --container-wide: 96vw;
  }
  .primary-nav, .header-cta { display: none; }
  /* restano solo logo e hamburger: la colonna elastica passa al logo,
     così il toggle si allinea a filo destro del container */
  .site-header .container { grid-template-columns: 1fr auto; gap: 1rem; }
  .menu-toggle { display: inline-flex; justify-self: end; }
  .site-header { padding: 1rem 0; }
  .site-header.scrolled { padding: 0.6rem 0; }
  .brand-logo { height: 56px; }
  body:not(.has-light-hero) .site-header:not(.scrolled) .brand-logo-light { height: 56px; }
  .site-header.scrolled .brand-logo { height: 44px; }
  .section { padding: clamp(3.5rem, 8vw, 6rem) 0; }
  .section-tight { padding: clamp(2rem, 5vw, 3.5rem) 0; }

  .hero-grid { grid-template-columns: 1fr; padding-bottom: 2rem; gap: 3rem; }
  .hero-visual { height: 60vh; border-radius: 200px 200px 0 0; }
  .hero-topline { display: none; }
  .hero-inner { grid-template-columns: 1fr; gap: 2rem; }
  .hero-side { align-items: flex-start; text-align: left; }
  .hero-side .side-tag { font-size: 0.62rem; }
  .hero-side .side-coord { font-size: 1.1rem; }

  .winds-grid { display: flex; flex-direction: column; }
  .winds-grid .compass-cell { order: -1; min-height: 280px; }
  .wind-card.pos-n, .wind-card.pos-ne, .wind-card.pos-e, .wind-card.pos-se,
  .wind-card.pos-s, .wind-card.pos-sw, .wind-card.pos-w, .wind-card.pos-nw {
    grid-column: auto; grid-row: auto;
  }

  .editorial, .editorial.reverse { grid-template-columns: 1fr; gap: 2.5rem; }
  .editorial.reverse .editorial-image { order: 0; }
  .editorial-image--landscape,
  .editorial-image--wide { aspect-ratio: 16/10; }

  .apt-hero { padding-top: 7rem; padding-bottom: 2rem; }
  .apt-hero .container { grid-template-columns: 1fr; gap: 2.5rem; }
  .apt-hero h1 { font-size: clamp(3rem, 12vw, 5rem); margin-top: 1rem; }
  .apt-hero-actions { gap: 1.2rem; }

  .feature-strip { grid-template-columns: 1fr; margin-top: 2.5rem; }
  .feature-strip .feature { border-right: 0; border-bottom: 1px solid var(--c-line); padding: 1.6rem 1rem; }
  .feature-strip .feature:last-child { border-bottom: 0; }

  .gallery-editorial .g-item,
  .gallery-apt .g-item { grid-column: span 12 !important; }

  .winds-table-row {
    grid-template-columns: 40px 1fr 60px;
    gap: 0.8rem;
    padding: 1.4rem 0;
  }
  .winds-table-row > *:nth-child(n+4):nth-child(-n+6) { display: none; }
  .winds-table-head { display: none; }
  .winds-table-row .name { font-size: 1.2rem; }
  .winds-table-row .name .italic { display: block; margin-left: 0; font-size: 0.95em; }
  .winds-table-row .badge { display: block; margin: 0.3rem 0 0; }
  .winds-mosaic { grid-auto-rows: 50vw; }
  .wind-mosaic-card,
  .wind-mosaic-card.big,
  .wind-mosaic-card.wide { grid-column: span 12; grid-row: auto; }

  .footer-grid { grid-template-columns: 1fr; gap: 2.5rem; padding-bottom: 3rem; }
  .footer-col { padding-top: 1.5rem; border-top: 1px solid rgba(239,230,210,0.12); }
  .footer-col:first-of-type { border-top: 0; padding-top: 0; }
  .footer-logo { height: 52px; }

  .location, .contact-grid, .wind-nav .container { grid-template-columns: 1fr; gap: 3rem; }
  .section-head { grid-template-columns: 1fr; gap: 1rem; }
  .section-head .section-link { padding-top: 1rem; }
  .form-row { grid-template-columns: 1fr; }
  .footer-bottom { flex-direction: column; align-items: flex-start; gap: 1rem; }
  .footer-bottom .cir-list { max-width: 100%; gap: 0.5rem; }
  .lightbox { padding: 1.5rem; }
  .lightbox-prev, .lightbox-next { width: 44px; height: 44px; }

  /* Tip featured: stack su mobile */
  .tip-featured { grid-template-columns: 1fr; min-height: 0; }
  .tip-featured-cover { aspect-ratio: 16/10; min-height: 0; }
  .tip-featured-cover img { position: absolute; }
  .tip-featured-body { padding: 2rem 1.6rem; }
  .tip-featured-body h2 { font-size: clamp(1.8rem, 6vw, 2.4rem); }

  /* Tip single article */
  .tip-hero { padding: 8rem 0 2.5rem; }
  .tip-title { font-size: clamp(2rem, 8vw, 3rem); }
  .tip-lead { font-size: 1.15rem; max-width: 100%; }
  .tip-byline { flex-wrap: wrap; justify-content: center; }
  .tip-body { padding-inline: 1.4rem; }
  .tip-body p { font-size: 1.08rem; line-height: 1.7; }
  .tip-body p:first-of-type::first-letter { font-size: 3.6rem; }
  .tip-body h2 { font-size: 1.4rem; margin-top: 2.4rem; }
  .tip-body .tip-quote { margin: 2rem 0; padding-left: 1.2rem; }
  .tip-body .tip-quote p { font-size: 1.25rem; }
  .tip-share { flex-direction: column; align-items: flex-start; }

  .tip-filters { gap: 0.4rem; }
  .tip-filter { padding: 0.55rem 1rem; font-size: 0.62rem; letter-spacing: 0.2em; }

  /* Hero overlay più intenso (testo più leggibile su piccolo) */
  .hero-overlay {
    background:
      linear-gradient(180deg, rgba(0,54,89,0.6) 0%, rgba(0,54,89,0.25) 30%, rgba(0,54,89,0.85) 100%);
  }
}

@media (max-width: 540px) {
  :root {
    --container: 90vw;
    --container-narrow: 88vw;
    --container-wide: 94vw;
  }
  .brand-text small { display: none; }
  .brand-logo { height: 48px; }
  body:not(.has-light-hero) .site-header:not(.scrolled) .brand-logo-light { height: 48px; }
  .site-header.scrolled .brand-logo { height: 38px; }
  .menu-toggle { width: 40px; height: 40px; }

  .hero { padding-top: 5.5rem; }
  .hero-title { font-size: clamp(3rem, 14vw, 5rem); }
  .hero-meta .lead { font-size: 1.1rem; }

  .specs { grid-template-columns: 1fr 1fr; }
  .gallery { gap: 0.6rem; }
  .form { padding: 1.4rem; }

  .footer-logo { height: 44px; }
  .cir-list span { font-size: 0.6rem; }
  .winds-intro-text .lead { font-size: 1.15rem; }
  .winds-intro-compass .compass { width: 220px; height: 220px; }

  .display-xl { font-size: clamp(2.6rem, 13vw, 4.4rem); }
  .display-l  { font-size: clamp(2.2rem, 9vw, 3.6rem); }

  .mobile-menu { padding: 7rem 1.6rem 2.5rem; }
  .mobile-menu::before { font-size: 0.62rem; margin-bottom: 1.2rem; }
  .mobile-menu a { font-size: clamp(1.6rem, 7vw, 2.1rem); }
  .mobile-menu .mobile-cta { font-size: 0.7rem; padding: 0.9rem 1.4rem; }

  .tip-hero-meta { flex-wrap: wrap; justify-content: center; row-gap: 0.4rem; }
  .tip-cover { aspect-ratio: 4/3; margin-bottom: 1.5rem; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; }
  .compass { animation: none; }
  .reveal { opacity: 1; transform: none; }
}

/* =====================================================================
   LEGAL PAGES (privacy / cookie)
   ===================================================================== */
.legal-page { padding-top: 9rem; }
.legal-content {
  max-width: 780px;
  margin-inline: auto;
}
.legal-content h2 {
  font-family: var(--f-display);
  font-size: clamp(1.5rem, 2.6vw, 2rem);
  font-weight: 400;
  font-variation-settings: "opsz" 96, "SOFT" 30;
  color: var(--c-ink);
  margin: 3rem 0 1rem;
  padding-top: 1rem;
  position: relative;
}
.legal-content h2::before {
  content: "";
  position: absolute;
  top: 0; left: 0;
  width: 44px; height: 1px;
  background: var(--c-blue);
}
.legal-content h3 {
  font-family: var(--f-display);
  font-size: 1.25rem;
  font-weight: 460;
  color: var(--c-ink);
  margin: 2rem 0 .8rem;
}
.legal-content p,
.legal-content li {
  font-family: var(--f-body);
  font-size: 1.08rem;
  line-height: 1.75;
  color: var(--c-ink-soft);
}
.legal-content ul {
  list-style: none;
  margin: 1rem 0 1.5rem;
  padding: 0;
}
.legal-content ul li {
  padding: .5rem 0 .5rem 1.6rem;
  position: relative;
  border-bottom: 1px solid var(--c-line-soft);
}
.legal-content ul li::before {
  content: "+";
  position: absolute;
  left: 0;
  font-family: var(--f-display);
  font-style: italic;
  color: var(--c-blue);
  font-size: 1.2rem;
  line-height: 1.4;
}
.legal-content a { color: var(--c-blue); text-decoration: underline; text-underline-offset: 3px; }
.legal-content a:hover { color: var(--c-terra); }
.legal-content table {
  width: 100%;
  border-collapse: collapse;
  margin: 1.5rem 0;
  font-size: .95rem;
}
.legal-content table th,
.legal-content table td {
  text-align: left;
  padding: .8rem 1rem;
  border: 1px solid var(--c-line);
  vertical-align: top;
}
.legal-content table th {
  background: var(--c-cream);
  font-family: var(--f-sans);
  font-size: .68rem;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--c-ink);
  font-weight: 600;
}
.legal-content table td { color: var(--c-ink-soft); font-family: var(--f-body); }
.legal-updated {
  font-family: var(--f-sans);
  font-size: .72rem;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--c-ink-mute);
  margin-top: 3rem;
  padding-top: 1.5rem;
  border-top: 1px solid var(--c-line);
}

/* =====================================================================
   COOKIE BANNER
   ===================================================================== */
.cookie-banner {
  position: fixed;
  left: 1.2rem; right: 1.2rem; bottom: 1.2rem;
  z-index: 150;
  max-width: 560px;
  margin-inline: auto;
  background: var(--c-ink);
  color: var(--c-sand-soft);
  border-radius: 8px;
  padding: 1.6rem 1.8rem;
  box-shadow: var(--shadow-deep);
  transform: translateY(140%);
  opacity: 0;
  transition: transform .5s var(--ease-out), opacity .5s var(--ease-out);
}
.cookie-banner.is-visible { transform: none; opacity: 1; }
.cookie-banner p {
  font-family: var(--f-body);
  font-size: .98rem;
  line-height: 1.6;
  color: var(--c-sand-soft);
  margin: 0 0 1.2rem;
}
.cookie-banner p a { color: var(--c-blue-soft); text-decoration: underline; text-underline-offset: 3px; }
.cookie-banner .cookie-actions { display: flex; gap: .7rem; flex-wrap: wrap; }
.cookie-banner .btn {
  padding: .8rem 1.3rem;
  font-size: .72rem;
}
.cookie-btn-accept { background: var(--c-cream); color: var(--c-ink); }
.cookie-btn-accept:hover { background: var(--c-blue); color: var(--c-cream); }
.cookie-btn-reject {
  background: transparent;
  color: var(--c-sand-soft);
  border: 1px solid rgba(241,235,217,.4);
}
.cookie-btn-reject:hover { border-color: var(--c-sand); color: var(--c-cream); }

@media (max-width: 540px) {
  .cookie-banner { left: .8rem; right: .8rem; bottom: .8rem; padding: 1.3rem 1.4rem; }
  .cookie-banner .cookie-actions { flex-direction: column; }
  .cookie-banner .btn { justify-content: center; width: 100%; }
}

/* Footer legal links */
.footer-legal {
  display: flex;
  gap: 1.4rem;
  flex-wrap: wrap;
}
.footer-legal a {
  font-family: var(--f-sans);
  font-size: .7rem;
  letter-spacing: .14em;
  color: var(--c-sand-deep);
}
.footer-legal a:hover { color: var(--c-blue-soft); }

/* =====================================================================
   FORM — consenso privacy + messaggi
   ===================================================================== */
.field-consent {
  display: flex;
  align-items: flex-start;
  gap: .7rem;
  margin: .4rem 0 .2rem;
}
.field-consent input[type="checkbox"] {
  width: 20px;
  height: 20px;
  min-width: 20px;
  margin-top: .15rem;
  accent-color: var(--c-blue);
  cursor: pointer;
}
.field-consent label {
  font-family: var(--f-body);
  font-size: .95rem;
  line-height: 1.5;
  color: var(--c-ink-soft);
  text-transform: none;
  letter-spacing: 0;
}
.field-consent label a { color: var(--c-blue); text-decoration: underline; text-underline-offset: 2px; }
.field-consent label a:hover { color: var(--c-terra); }

.form-note {
  font-family: var(--f-sans);
  font-size: .82rem;
  letter-spacing: .02em;
  margin: .4rem 0 0;
  min-height: 1.2em;
  color: var(--c-ink-mute);
}
.form-note.is-ok { color: var(--c-olive); font-weight: 600; }
.form-note.is-error { color: var(--c-terra-deep); font-weight: 600; }

/* checkbox anche nel newsletter inline */
.newsletter-consent {
  display: flex;
  align-items: center;
  gap: .6rem;
  justify-content: center;
  margin-top: 1rem;
  font-size: .85rem;
  color: var(--c-ink-mute);
}
.newsletter-consent a { color: var(--c-blue); text-decoration: underline; }

/* =====================================================================
   FUNDUQ × ELEMENTOR — full-bleed & reset wrapper
   Rende le sezioni Elementor che contengono widget Funduq a piena
   larghezza, così i widget (che portano il proprio <section> con sfondo)
   si vedono edge-to-edge come nella bozza statica.
   ===================================================================== */
/* Container Elementor delle sezioni con widget Funduq: piena larghezza */
.elementor-section:has([class*="elementor-widget-funduq_"]) > .elementor-container {
  max-width: 100% !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}
.elementor-section:has([class*="elementor-widget-funduq_"]) {
  padding: 0 !important;
}
/* Colonna e wrap: nessun padding, nessun gap tra widget Funduq */
.elementor-column:has([class*="elementor-widget-funduq_"]) > .elementor-widget-wrap,
.elementor-column:has([class*="elementor-widget-funduq_"]) > .elementor-element-populated {
  padding: 0 !important;
}
div[class*="elementor-widget-funduq_"] { margin: 0 !important; }
div[class*="elementor-widget-funduq_"] > .elementor-widget-container { margin: 0 !important; padding: 0 !important; }

/* Fallback per browser senza :has() — azzera comunque i wrapper dei widget */
.elementor-widget-funduq_hero_video > .elementor-widget-container,
.elementor-widget-funduq_winds_photo_grid > .elementor-widget-container,
.elementor-widget-funduq_reviews > .elementor-widget-container,
.elementor-widget-funduq_section_cta > .elementor-widget-container,
.elementor-widget-funduq_page_hero > .elementor-widget-container,
.elementor-widget-funduq_editorial_split > .elementor-widget-container,
.elementor-widget-funduq_tips_grid > .elementor-widget-container,
.elementor-widget-funduq_gallery_editorial > .elementor-widget-container,
.elementor-widget-funduq_intro_funnuco > .elementor-widget-container,
.elementor-widget-funduq_quote > .elementor-widget-container,
.elementor-widget-funduq_feature_strip > .elementor-widget-container,
.elementor-widget-funduq_timeline > .elementor-widget-container,
.elementor-widget-funduq_winds_mosaic > .elementor-widget-container,
.elementor-widget-funduq_wind_table > .elementor-widget-container,
.elementor-widget-funduq_tip_featured > .elementor-widget-container,
.elementor-widget-funduq_newsletter > .elementor-widget-container,
.elementor-widget-funduq_contact_info > .elementor-widget-container,
.elementor-widget-funduq_contact_form > .elementor-widget-container,
.elementor-widget-funduq_map_wide > .elementor-widget-container,
.elementor-widget-funduq_legal_cir > .elementor-widget-container { margin: 0; padding: 0; }

/* =====================================================================
   MENU WordPress — wp_nav_menu (ul/li) allineato a .primary-nav
   ===================================================================== */
.primary-nav ul.funduq-menu {
  display: flex;
  align-items: center;
  gap: 2.2rem;
  list-style: none;
  margin: 0;
  padding: 0;
}
.primary-nav ul.funduq-menu li { list-style: none; margin: 0; padding: 0; }
.primary-nav ul.funduq-menu li a {
  font-family: var(--f-sans);
  font-size: 0.78rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  font-weight: 500;
  color: var(--c-ink);
  position: relative;
  padding: 0.4rem 0;
  display: inline-block;
}
.primary-nav ul.funduq-menu li a::after {
  content: "";
  position: absolute;
  left: 0; right: 0; bottom: -2px;
  height: 1px;
  background: var(--c-terra);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform .35s var(--ease-out);
}
.primary-nav ul.funduq-menu li a:hover::after,
.primary-nav ul.funduq-menu li.current-menu-item > a::after,
.primary-nav ul.funduq-menu li.current_page_item > a::after { transform: scaleX(1); }
.primary-nav ul.funduq-menu li.current-menu-item > a { color: var(--c-blue); }

/* header su hero scura: link menu chiari */
.site-header:not(.scrolled) .primary-nav ul.funduq-menu li a { color: var(--c-cream); }
.site-header:not(.scrolled) .primary-nav ul.funduq-menu li a::after { background: var(--c-blue-soft); }
body.has-light-hero .site-header:not(.scrolled) .primary-nav ul.funduq-menu li a { color: var(--c-ink); }

/* CTA secondaria appartamento (Prenota su Booking) su sfondo scuro */
.apt-cta2.on-dark {
  background: transparent;
  color: var(--c-cream);
  border: 1px solid rgba(251,247,235,.5);
}
.apt-cta2.on-dark:hover {
  background: var(--c-cream);
  color: var(--c-ink);
  border-color: var(--c-cream);
}
/* CTA secondaria nell'hero (sfondo chiaro) — usa lo stile Booking blu */
.apt-hero-actions .apt-cta2 {
  background: #003b95;   /* blu Booking */
  color: #fff;
  border: 1px solid #003b95;
}
.apt-hero-actions .apt-cta2:hover { background: #00224f; border-color: #00224f; color: #fff; }

/* =====================================================================
   FIX Elementor img{height:auto} — ripristina le immagini "cover"
   che devono riempire il proprio contenitore (Elementor forza height:auto)
   ===================================================================== */
.wpc img,
.wind-mosaic-card img,
.gallery .g-item img,
.gallery-premium .g-item img,
.tip-card-cover img,
.tip-featured-cover img,
.editorial-image img,
.apt-hero-image img,
.hero-visual img,
.hero-video img.hero-poster,
.location-map img,
.map-wide img {
  height: 100% !important;
}

/* Contatti: info + form affiancati anche nella stessa colonna Elementor.
   Elementor rende .elementor-widget-wrap come flex-column: riga, senza wrap. */
/* Centra e limita il container della sezione contatti (info + form) */
.elementor-section:has(.elementor-widget-funduq_contact_info):has(.elementor-widget-funduq_contact_form) {
  display: block !important;
}
.elementor-section:has(.elementor-widget-funduq_contact_info):has(.elementor-widget-funduq_contact_form) > .elementor-container {
  max-width: min(1320px, 92vw) !important;
  width: 100% !important;
  margin-inline: auto !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}
.elementor-widget-wrap:has(> .elementor-widget-funduq_contact_info):has(> .elementor-widget-funduq_contact_form) {
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: flex-start;
}
.elementor-widget-wrap:has(> .elementor-widget-funduq_contact_info):has(> .elementor-widget-funduq_contact_form) > .elementor-widget-funduq_contact_info,
.elementor-widget-wrap:has(> .elementor-widget-funduq_contact_info):has(> .elementor-widget-funduq_contact_form) > .elementor-widget-funduq_contact_form {
  flex: 1 1 0 !important;
  min-width: 0 !important;
  width: auto !important;
  max-width: none !important;
}
@media (max-width: 980px) {
  .elementor-widget-wrap:has(> .elementor-widget-funduq_contact_info):has(> .elementor-widget-funduq_contact_form) {
    flex-direction: column !important;
    flex-wrap: wrap !important;
  }
}

/* =====================================================================
   COOKIE — pannello preferenze (categorie)
   ===================================================================== */
.cookie-banner { max-width: 640px; }
.cookie-actions { display: flex; gap: .6rem; flex-wrap: wrap; }
.cookie-btn-prefs {
  background: transparent;
  color: var(--c-sand-soft);
  border: 1px solid rgba(241,235,217,.4);
}
.cookie-btn-prefs:hover { border-color: var(--c-sand); color: var(--c-cream); }

.cookie-panel {
  margin-top: 1.2rem;
  padding-top: 1.2rem;
  border-top: 1px solid rgba(241,235,217,.18);
}
.cookie-panel h3 {
  font-family: var(--f-display);
  font-size: 1.15rem;
  color: var(--c-cream);
  margin: 0 0 1rem;
  font-weight: 420;
}
.cookie-cat { margin-bottom: 1rem; }
.cookie-cat-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
}
.cookie-cat-head label {
  display: flex;
  align-items: center;
  gap: .6rem;
  font-family: var(--f-sans);
  font-size: .85rem;
  font-weight: 600;
  color: var(--c-cream);
  cursor: pointer;
}
.cookie-cat-head input[type="checkbox"] {
  width: 18px; height: 18px;
  accent-color: var(--c-blue-soft);
  cursor: pointer;
}
.cookie-cat-head input:disabled { cursor: default; opacity: .7; }
.cookie-always {
  font-family: var(--f-sans);
  font-size: .65rem;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--c-blue-soft);
}
.cookie-cat p {
  font-family: var(--f-body);
  font-size: .9rem;
  line-height: 1.5;
  color: var(--c-sand-deep);
  margin: .35rem 0 0;
}
.cookie-panel .cookie-actions { margin-top: 1.2rem; }

/* ===== WordPress overrides ===== */
#funduq-main { display: block; }
.elementor-section.elementor-section-boxed > .elementor-container { max-width: none; }
.footer-cir { text-align: right; margin-top: .8rem; }
.footer-cir span { font-family: var(--f-mono); font-size: .62rem; color: var(--c-sand-deep); opacity: .7; }
@media (max-width: 980px) { .footer-cir { text-align: left; } }

/* ---------- Icone social (header · menu mobile · footer) ---------- */
.header-social {
  display: inline-flex;
  align-items: center;
  gap: 0.1rem;
  position: relative;
  margin-left: 0.85rem;
  padding-left: 0.9rem;
}
.header-social::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 1px;
  height: 22px;
  background: var(--c-line);
}
.header-social a {
  width: 36px;
  height: 36px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid transparent;
  border-radius: 50%;
  color: var(--c-ink);
  transition: color 0.3s var(--ease-out), border-color 0.3s var(--ease-out), transform 0.3s var(--ease-out);
}
.header-social a:hover {
  color: var(--c-blue);
  border-color: var(--c-blue);
  transform: translateY(-2px);
}
.header-social svg { display: block; width: 17px; height: 17px; }

/* Header sopra hero scura */
.site-header:not(.scrolled) .header-social::before { background: rgba(251, 247, 235, 0.38); }
.site-header:not(.scrolled) .header-social a { color: var(--c-cream); }
.site-header:not(.scrolled) .header-social a:hover { color: var(--c-blue-soft); border-color: var(--c-blue-soft); }

/* Header sopra hero chiara (pagine interne) */
body.has-light-hero .site-header:not(.scrolled) .header-social::before { background: var(--c-line); }
body.has-light-hero .site-header:not(.scrolled) .header-social a { color: var(--c-ink); }
body.has-light-hero .site-header:not(.scrolled) .header-social a:hover { color: var(--c-blue); border-color: var(--c-blue); }

/* Sotto i 1180px l'header si affolla: le icone restano nel menu mobile e nel footer */
@media (max-width: 1180px) {
  .header-social { display: none; }
}

/* Menu mobile — le regole di .mobile-menu a vanno neutralizzate */
.mobile-menu .mobile-social {
  display: flex;
  gap: 0.6rem;
  margin-top: 2.2rem;
  padding-top: 1.9rem;
  border-top: 1px solid var(--c-line);
}
.mobile-menu .mobile-social a {
  width: 48px;
  height: 48px;
  padding: 0;
  font-size: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--c-line);
  border-radius: 50%;
  color: var(--c-ink);
  transition: background 0.3s var(--ease-out), color 0.3s var(--ease-out), border-color 0.3s var(--ease-out);
}
.mobile-menu .mobile-social a:hover {
  padding-left: 0;
  background: var(--c-ink);
  border-color: var(--c-ink);
  color: var(--c-sand);
}
.mobile-menu .mobile-social svg { width: 20px; height: 20px; }

/* Footer (fondo scuro) */
.footer-social {
  display: flex;
  gap: 0.55rem;
  margin-top: 1.7rem;
}
.footer-social a {
  width: 38px;
  height: 38px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(251, 247, 235, 0.22);
  border-radius: 50%;
  color: var(--c-sand-soft);
  transition: background 0.3s var(--ease-out), color 0.3s var(--ease-out), border-color 0.3s var(--ease-out), transform 0.3s var(--ease-out);
}
.footer-social a:hover {
  background: var(--c-blue);
  border-color: var(--c-blue);
  color: var(--c-cream);
  transform: translateY(-2px);
}
.footer-social svg { display: block; width: 18px; height: 18px; }