/* sito.css - il sito web della struttura (sito.php). Stile "lux" di mdaweb: titoli serif leggeri,
   occhielli maiuscoli spaziati, alternanza chiaro/scuro, colore della struttura come accento.
   --brand e le sue tinte arrivano da tema.php. Prefisso sw-. Gli stati nascosti delle animazioni
   valgono solo sotto html.sw-js:not(.sw-reduced): senza JavaScript la pagina e' completa e ferma. */

:root {
  --sw-ink: #14161b;
  --sw-ink-2: #1d2027;
  --sw-paper: #f6f2ea;
  --sw-white: #fffdf9;
  --sw-text: #2b2b30;
  --sw-muted: #5f5d66;
  --sw-line: #e4ddd0;
  --sw-serif: 'Cormorant Garamond', Georgia, 'Times New Roman', serif;
  --sw-gutter: clamp(16px, 4vw, 48px);
  --sw-max: 1240px;
  --sw-r: 4px;
  --sw-ease: cubic-bezier(.22, .61, .36, 1);
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
body.sw { margin: 0; background: var(--sw-paper); color: var(--sw-text); font-family: var(--font); font-size: 16px; line-height: 1.65;
  -webkit-font-smoothing: antialiased; overflow-x: hidden; }
.sw img { max-width: 100%; display: block; }
:where(.sw) a { color: inherit; }   /* :where = specificita' zero: non deve battere il colore dei bottoni */
.sw [hidden] { display: none !important; }
.sw :focus-visible { outline: 2px solid var(--brand-text, var(--brand)); outline-offset: 3px; }
.sw-scuro :focus-visible, .sw-hero :focus-visible, .sw-testata :focus-visible, .sw-foot :focus-visible { outline-color: #fff; }
.sw-vh { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.sw-salta { position: absolute; left: 12px; top: -60px; z-index: 100; padding: 10px 16px; background: #fff; color: var(--sw-ink); border-radius: var(--sw-r); text-decoration: none; font-weight: 600; }
.sw-salta:focus { top: 12px; }
main:focus { outline: none; }

/* -- Tipografia --------------------------------------------------------------------------- */
.sw-occhiello { display: inline-flex; align-items: center; gap: 12px; margin: 0 0 14px; font-size: 11px; font-weight: 600; letter-spacing: .26em;
  text-transform: uppercase; color: var(--brand-text, var(--brand)); }
.sw-occhiello::before { content: ""; width: 28px; height: 1px; background: currentColor; }
.sw-scuro .sw-occhiello, .sw-hero .sw-occhiello, .sw-testata .sw-occhiello, .sw-foot .sw-occhiello { color: var(--brand-soft, #e9e2d3); }
.sw-titolo { margin: 0; font-family: var(--sw-serif); font-weight: 300; font-size: clamp(34px, 5vw, 60px); line-height: 1.06; letter-spacing: -.01em; color: var(--sw-ink); }
.sw-titolo a { text-decoration: none; }
.sw-titolo a:hover { text-decoration: none; color: var(--brand-text, var(--brand)); }
.sw-titolo-m { font-size: clamp(30px, 3.4vw, 44px); }
.sw-titolo-s { font-size: 30px; margin-top: 36px; margin-bottom: 14px; }
.sw-scuro .sw-titolo, .sw-testata .sw-titolo { color: #fff; }
.sw-prosa { color: var(--sw-text); font-size: 17px; }
.sw-prosa p { margin: 0 0 1em; }
.sw-sez-intro { margin: 14px 0 0; color: var(--sw-muted); max-width: 560px; }
.sw-scuro .sw-sez-intro { color: rgba(255,255,255,.72); }
.sw-nota { margin: 6px 0 0; color: var(--sw-muted); font-size: 13px; line-height: 1.5; }
.sw-centro { text-align: center; margin: 44px 0 0; }

/* -- Bottoni: pillola, riempimento che sale dal basso (il testo non cambia mai) ---------------- */
.sw-btn { position: relative; display: inline-flex; align-items: center; justify-content: center; gap: 9px; min-height: 48px; padding: 0 26px;
  border-radius: 999px; border: 1px solid transparent; font: 600 13px/1 var(--font); letter-spacing: .12em; text-transform: uppercase;
  text-decoration: none; cursor: pointer; overflow: hidden; isolation: isolate; transition: color .35s var(--sw-ease), border-color .35s var(--sw-ease); }
.sw-btn::after { content: ""; position: absolute; inset: 0; z-index: -1; transform: translateY(101%); transition: transform .45s var(--sw-ease); }
.sw-btn:hover { text-decoration: none; }
.sw-btn:hover::after { transform: translateY(0); }
.sw-btn-brand { background: var(--brand); color: var(--brand-ink, #fff); }
.sw-btn-brand::after { background: var(--brand-dark, #000); }
.sw-btn-brand:hover { color: #fff; }
.sw-btn-linea { background: transparent; color: var(--sw-ink); border-color: var(--sw-ink); }
.sw-btn-linea::after { background: var(--sw-ink); }
.sw-btn-linea:hover { color: #fff; }
.sw-scuro .sw-btn-linea { color: #fff; border-color: rgba(255,255,255,.7); }
.sw-scuro .sw-btn-linea::after { background: #fff; }
.sw-scuro .sw-btn-linea:hover { color: var(--sw-ink); }
.sw-link { display: inline-flex; align-items: center; gap: 8px; margin-top: auto; padding-top: 6px; font-size: 12px; font-weight: 600; letter-spacing: .16em;
  text-transform: uppercase; text-decoration: none; color: var(--brand-text, var(--brand)); }
.sw-link .fa { transition: transform .3s var(--sw-ease); }
.sw-link:hover { text-decoration: none; }
.sw-link:hover .fa { transform: translateX(5px); }

/* -- Testata del sito ---------------------------------------------------------------------- */
.sw-hdr { position: fixed; inset: 0 0 auto; z-index: 50; color: #fff; transition: background .35s, color .35s, box-shadow .35s; }
.sw-hdr-in { max-width: var(--sw-max); margin: 0 auto; padding: 14px var(--sw-gutter); display: flex; align-items: center; gap: 24px; min-height: 76px; }
/* Niente backdrop-filter: farebbe della testata il contenitore del menu fixed del telefono, tagliandolo a 64px. */
.sw-hdr.is-pieno { background: rgba(255,253,249,.98); color: var(--sw-ink); box-shadow: 0 1px 0 var(--sw-line); }
.sw-logo { display: flex; align-items: center; text-decoration: none; margin-right: auto; min-width: 0; }
/* Altezza fissa e niente restringimento: un SVG senza dimensioni, in una testata flessibile, collassava a 0. */
.sw-logo img { flex: none; height: 48px; width: auto; max-width: 190px; object-fit: contain; object-position: left center; }
.sw-hdr:not(.is-pieno) .sw-logo img { filter: drop-shadow(0 1px 6px rgba(0,0,0,.35)); }
.sw-logo span { font-family: var(--sw-serif); font-size: 26px; font-weight: 400; line-height: 1.1; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sw-nav { display: flex; align-items: center; gap: 26px; }
.sw-nav ul { display: flex; gap: 26px; margin: 0; padding: 0; list-style: none; }
.sw-nav ul a { position: relative; font-size: 12px; font-weight: 600; letter-spacing: .18em; text-transform: uppercase; text-decoration: none; padding: 6px 0; }
.sw-nav ul a::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 1px; background: currentColor; transform: scaleX(0); transform-origin: right; transition: transform .35s var(--sw-ease); }
.sw-nav ul a:hover { text-decoration: none; }
.sw-nav ul a:hover::after, .sw-nav ul a[aria-current]::after { transform: scaleX(1); transform-origin: left; }
.sw-lingue { display: flex; gap: 2px; }
.sw-lingue a { font-size: 11px; font-weight: 600; letter-spacing: .08em; text-decoration: none; padding: 5px 6px; opacity: .65; border-radius: 3px; }
.sw-lingue a:hover { opacity: 1; text-decoration: none; }
.sw-lingue a[aria-current] { opacity: 1; box-shadow: inset 0 -1px 0 currentColor; }
.sw-hdr-cta { min-height: 42px; padding: 0 20px; font-size: 12px; }
.sw-burger { display: block; flex: none; width: 44px; height: 44px; border: 0; background: none; color: inherit; cursor: pointer; padding: 0; }
.sw-burger-l, .sw-burger-l::before, .sw-burger-l::after { display: block; width: 24px; height: 1.5px; background: currentColor; margin: 0 auto; transition: transform .3s, opacity .3s; }
.sw-burger-l { position: relative; }
.sw-burger-l::before, .sw-burger-l::after { content: ""; position: absolute; left: 0; }
.sw-burger-l::before { top: -7px; } .sw-burger-l::after { top: 7px; }
.sw-burger[aria-expanded="true"] .sw-burger-l { background: transparent; }
.sw-burger[aria-expanded="true"] .sw-burger-l::before { transform: translateY(7px) rotate(45deg); }
.sw-burger[aria-expanded="true"] .sw-burger-l::after { transform: translateY(-7px) rotate(-45deg); }

@media (max-width: 960px) {
  .sw-hdr-in { gap: 10px; min-height: 64px; padding-top: 10px; padding-bottom: 10px; }
  .sw-hdr-cta { min-height: 38px; padding: 0 14px; font-size: 11px; letter-spacing: .08em; }
  .sw-nav { display: none; }     /* sul telefono tutte le voci stanno nel menu a tutto schermo */
  .sw-logo img { height: 40px; max-width: 140px; }
  .sw-logo span { font-size: 21px; }
}
@media (max-width: 380px) { .sw-hdr-cta { display: none; } }

/* -- Hero della home ------------------------------------------------------------------------- */
.sw-hero { position: relative; min-height: 100vh; min-height: 100svh; display: flex; flex-direction: column; justify-content: flex-end; color: #fff; background: var(--sw-ink); overflow: hidden; }
.sw-hero-img, .sw-testata-img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.sw-hero::after, .sw-testata::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(10,12,16,.45) 0%, rgba(10,12,16,.12) 35%, rgba(10,12,16,.55) 75%, rgba(10,12,16,.75) 100%); }
.sw-hero-in { position: relative; z-index: 1; width: 100%; max-width: var(--sw-max); margin: 0 auto; padding: 140px var(--sw-gutter) 36px; }
.sw-hero-titolo { margin: 0; font-family: var(--sw-serif); font-weight: 300; font-size: clamp(46px, 9vw, 120px); line-height: .98; letter-spacing: -.02em; max-width: 14ch; text-wrap: balance; }
.sw-stelle { margin: 14px 0 0; color: #f3c969; font-size: 14px; letter-spacing: 4px; }
.sw-foot .sw-stelle { margin: 0 0 0 6px; font-size: 11px; letter-spacing: 2px; }
.sw-hero-box { position: relative; z-index: 1; width: 100%; max-width: var(--sw-max); margin: 0 auto; padding: 0 var(--sw-gutter) 40px; }
html.sw-js:not(.sw-reduced) .sw-hero-img { animation: sw-zoom 2.4s var(--sw-ease) both; }
html.sw-js:not(.sw-reduced) .sw-hero-in > * { animation: sw-sale 1.1s var(--sw-ease) both; }
html.sw-js:not(.sw-reduced) .sw-hero-in > *:nth-child(2) { animation-delay: .12s; }
html.sw-js:not(.sw-reduced) .sw-hero-in > *:nth-child(3) { animation-delay: .24s; }
html.sw-js:not(.sw-reduced) .sw-hero-box { animation: sw-sale 1.1s .35s var(--sw-ease) both; }
@keyframes sw-zoom { from { transform: scale(1.08); } to { transform: none; } }
@keyframes sw-sale { from { opacity: 0; transform: translateY(26px); } to { opacity: 1; transform: none; } }

/* -- Box di ricerca ---------------------------------------------------------------------- */
.sw-box { background: var(--sw-white); color: var(--sw-ink); border-radius: var(--sw-r); padding: 20px 22px 22px; box-shadow: 0 24px 60px rgba(0,0,0,.28); }
.sw-box-titolo { margin: 0 0 12px; font-family: var(--sw-serif); font-size: 24px; font-weight: 400; line-height: 1.2; }
.sw-box-campi { display: grid; grid-template-columns: 1.3fr 1.3fr .8fr .8fr .8fr auto; gap: 12px; align-items: end; }
.sw-campo { display: flex; flex-direction: column; gap: 5px; min-width: 0; }
.sw-campo label { font-size: 10.5px; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; color: var(--sw-muted); }
.sw-campo input, .sw-campo select { width: 100%; height: 48px; padding: 0 12px; border: 1px solid var(--sw-line); border-radius: var(--sw-r); background: #fff;
  font: 500 16px var(--font); color: var(--sw-ink); appearance: none; -webkit-appearance: none; }
.sw-campo select { background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M1 1l4 4 4-4' fill='none' stroke='%235f5d66' stroke-width='1.5'/%3E%3C/svg%3E") no-repeat right 12px center; padding-right: 30px; }
.sw-campo input:focus, .sw-campo select:focus { border-color: var(--brand); outline: 2px solid var(--brand-line, var(--brand)); outline-offset: 0; }
.sw-box-btn { height: 48px; white-space: nowrap; }
.sw-box-col .sw-box-campi { grid-template-columns: 1fr 1fr; }
.sw-box-col .sw-box-btn { grid-column: 1 / -1; }
.sw-box-col { box-shadow: none; padding: 0; background: transparent; }
/* Sulla foto della home il box e' trasparente, a vetro: scritte bianche, campi a filo chiaro.
   La sfumatura scura in basso della hero (.sw-hero::after) tiene leggibile il bianco. */
.sw-hero .sw-box { background: rgba(255,255,255,.10); color: #fff; border: 1px solid rgba(255,255,255,.28); box-shadow: 0 24px 60px rgba(0,0,0,.18);
  -webkit-backdrop-filter: blur(14px) saturate(1.15); backdrop-filter: blur(14px) saturate(1.15); }
.sw-hero .sw-campo label { color: rgba(255,255,255,.88); }
.sw-hero .sw-campo input, .sw-hero .sw-campo select { background-color: rgba(255,255,255,.08); border-color: rgba(255,255,255,.45); color: #fff; color-scheme: dark; }
.sw-hero .sw-campo select { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M1 1l4 4 4-4' fill='none' stroke='%23ffffff' stroke-width='1.5'/%3E%3C/svg%3E"); }
.sw-hero .sw-campo option { color: var(--sw-ink); background: #fff; }
.sw-hero .sw-campo input:focus, .sw-hero .sw-campo select:focus { border-color: #fff; outline-color: rgba(255,255,255,.55); }
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) { .sw-hero .sw-box { background: rgba(20,22,27,.55); } }

/* Popup dell'eta' dei bambini: si apre VERSO L'ALTO, perche' la hero ha overflow hidden e sotto
   il box verrebbe tagliato. Sempre chiaro, anche sopra il box a vetro (.sw .sw-eta batte .sw-hero). */
.sw-box { position: relative; }
.sw-eta { position: absolute; right: 0; bottom: calc(100% + 10px); z-index: 20; width: min(100%, 440px); padding: 18px 18px 16px;
  background: var(--sw-white); color: var(--sw-ink); border-radius: var(--sw-r); box-shadow: 0 22px 60px rgba(0,0,0,.32); }
.sw-eta::after { content: ""; position: absolute; right: 40px; bottom: -7px; width: 14px; height: 14px; background: var(--sw-white); transform: rotate(45deg); }
.sw-eta-titolo { margin: 0 0 12px; font-family: var(--sw-serif); font-size: 21px; line-height: 1.2; }
.sw-eta-campi { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.sw .sw-eta .sw-campo label { color: var(--sw-muted); }
.sw .sw-eta .sw-campo select { background-color: #fff; border-color: var(--sw-line); color: var(--sw-ink); color-scheme: light;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M1 1l4 4 4-4' fill='none' stroke='%235f5d66' stroke-width='1.5'/%3E%3C/svg%3E"); }
.sw .sw-eta .sw-campo select:focus { border-color: var(--brand); outline: 2px solid var(--brand-line, var(--brand)); }
.sw .sw-eta .sw-campo select.is-errore { border-color: #b42318; outline: 2px solid #fecdca; }
.sw-eta-errore { margin: 10px 0 0; color: #b42318; font-size: 13px; font-weight: 600; }
.sw-eta-ok { margin-top: 14px; width: 100%; min-height: 44px; }
.sw-eta-apri { display: inline-flex; align-items: center; gap: 6px; margin: 10px 0 0; padding: 0; border: 0; background: none; color: inherit; font: 600 12px var(--font);
  letter-spacing: .08em; text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
@media (max-width: 560px) { .sw-eta { left: 0; width: auto; } .sw-eta-campi { grid-template-columns: repeat(2, minmax(0, 1fr)); } .sw-eta::after { right: 50%; } }
@media (max-width: 1060px) { .sw-box-campi { grid-template-columns: 1fr 1fr 1fr; } .sw-box-btn { grid-column: 1 / -1; } }
@media (max-width: 560px) {
  .sw-box { padding: 16px; }
  .sw-box-campi { grid-template-columns: 1fr 1fr; gap: 10px; }
  .sw-hero-box { padding-bottom: 20px; }
  .sw-hero-in { padding-bottom: 22px; }
}

/* -- Sezioni ----------------------------------------------------------------------------- */
.sw-sez { padding: clamp(72px, 10vw, 140px) max(var(--sw-gutter), calc((100% - var(--sw-max)) / 2)); }
.sw-chiaro { background: var(--sw-paper); }
.sw-bianco { background: var(--sw-white); }
.sw-scuro { background: var(--sw-ink); color: rgba(255,255,255,.86); }
.sw-sez-testa { max-width: 760px; margin-bottom: clamp(36px, 5vw, 60px); }

.sw-pres { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); gap: clamp(36px, 6vw, 96px); align-items: center; }
.sw-pres .sw-titolo { margin-bottom: 26px; }
.sw-pres-foto { margin: 0; aspect-ratio: 4 / 5; overflow: hidden; border-radius: 999px 999px var(--sw-r) var(--sw-r); }
.sw-pres-foto img { width: 100%; height: 100%; object-fit: cover; }
@media (max-width: 860px) { .sw-pres { grid-template-columns: 1fr; } .sw-pres-foto { max-width: 460px; aspect-ratio: 1; } }

.sw-servizi { display: grid; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); gap: 0; margin: 0; padding: 0; list-style: none; border-top: 1px solid rgba(255,255,255,.14); }
.sw-servizi li { display: flex; align-items: center; gap: 16px; padding: 22px 6px; border-bottom: 1px solid rgba(255,255,255,.14); font-size: 15px; color: #fff; }
.sw-servizi .fa { width: 26px; font-size: 20px; text-align: center; color: var(--brand-soft, #e9e2d3); }

.sw-griglia { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 330px), 1fr)); gap: clamp(20px, 3vw, 36px); }
.sw-griglia-2 { grid-template-columns: repeat(auto-fill, minmax(min(100%, 460px), 1fr)); }
.sw-card { display: flex; flex-direction: column; background: var(--sw-white); border-radius: var(--sw-r); overflow: hidden; }
.sw-bianco .sw-card { background: var(--sw-paper); }
.sw-card-img { position: relative; display: block; aspect-ratio: 4 / 3; overflow: hidden; background: var(--sw-line); }
.sw-card-img img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.1s var(--sw-ease); }
.sw-card:hover .sw-card-img img { transform: scale(1.05); }
.sw-card-body { display: flex; flex-direction: column; gap: 12px; padding: 24px 24px 26px; flex: 1; }
.sw-card-body .sw-occhiello { margin: 0; }
.sw-card-titolo { margin: 0; font-family: var(--sw-serif); font-weight: 400; font-size: 30px; line-height: 1.12; color: var(--sw-ink); }
.sw-card-titolo a { text-decoration: none; }
.sw-card-titolo a:hover { color: var(--brand-text, var(--brand)); text-decoration: none; }
.sw-card-testo { color: var(--sw-muted); font-size: 15px; }
.sw-card-testo p { margin: 0 0 .7em; }
.sw-card-off .sw-btn { margin-top: auto; align-self: flex-start; }
.sw-badge { position: absolute; left: 16px; top: 16px; padding: 8px 14px; border-radius: 999px; background: var(--brand); color: var(--brand-ink, #fff); font-size: 14px; font-weight: 700; }
.sw-cam-meta { display: flex; flex-wrap: wrap; gap: 6px 18px; margin: 0; font-size: 14px; color: var(--sw-muted); }
.sw-cam-meta .fa { color: var(--brand-text, var(--brand)); margin-right: 2px; }
.sw-prezzo { color: var(--sw-ink); font-weight: 600; }
.sw-incl { padding: 14px 16px; border-left: 2px solid var(--brand); background: var(--sw-paper); font-size: 14.5px; }
.sw-incl b { display: block; font-size: 11px; letter-spacing: .18em; text-transform: uppercase; margin-bottom: 4px; }
.sw-incl p { margin: 0 0 .5em; }
.sw-voci { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0; list-style: none; }
.sw-voci li { display: inline-flex; align-items: center; gap: 7px; padding: 6px 12px; border: 1px solid var(--sw-line); border-radius: 999px; font-size: 13px; color: var(--sw-text); }
.sw-voci .fa { color: var(--brand-text, var(--brand)); }

/* -- Camere: righe alternate ----------------------------------------------------------- */
.sw-righe { display: flex; flex-direction: column; gap: clamp(56px, 8vw, 110px); }
.sw-riga { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); gap: clamp(28px, 5vw, 72px); align-items: center; }
.sw-riga-inv .sw-riga-img { order: 2; }
.sw-riga-img { display: block; aspect-ratio: 4 / 3; overflow: hidden; border-radius: var(--sw-r); background: var(--sw-line); }
.sw-riga-img img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.1s var(--sw-ease); }
.sw-riga-img:hover img { transform: scale(1.04); }
.sw-riga-body { display: flex; flex-direction: column; gap: 18px; }
.sw-riga-body .sw-prosa { color: var(--sw-muted); font-size: 16px; }
.sw-riga-body .sw-prosa p:last-child { margin-bottom: 0; }
.sw-azioni { display: flex; flex-wrap: wrap; gap: 12px; margin: 6px 0 0; }
@media (max-width: 820px) { .sw-riga { grid-template-columns: 1fr; } .sw-riga-inv .sw-riga-img { order: 0; } }

/* -- Pagina della camera --------------------------------------------------------------- */
.sw-camera { display: grid; grid-template-columns: minmax(0, 1fr) 360px; gap: clamp(32px, 5vw, 72px); align-items: start; }
.sw-camera-main { display: flex; flex-direction: column; gap: 22px; min-width: 0; }
.sw-camera-main .sw-titolo-s { margin-bottom: 0; }
.sw-camera-gal { display: grid; grid-template-columns: repeat(4, 1fr); grid-auto-rows: 1fr; gap: 8px; }
.sw-camera-gal .sw-foto { aspect-ratio: 4 / 3; }
.sw-camera-gal .sw-foto-grande { grid-column: span 4; aspect-ratio: 16 / 9; }
.sw-camera-side { position: sticky; top: 96px; }
.sw-camera-card { background: var(--sw-white); border-radius: var(--sw-r); padding: 26px; box-shadow: 0 18px 50px rgba(20,22,27,.08); }
.sw-camera-prezzo { margin: 0; font-family: var(--sw-serif); font-size: 32px; line-height: 1.15; color: var(--sw-ink); }
.sw-camera-card .sw-nota { margin-bottom: 20px; }
@media (max-width: 900px) { .sw-camera { grid-template-columns: 1fr; } .sw-camera-side { position: static; } }

/* -- Foto che si aprono nel visore ---------------------------------------------------- */
.sw-foto { position: relative; display: block; width: 100%; padding: 0; border: 0; background: var(--sw-line); cursor: zoom-in; overflow: hidden; border-radius: var(--sw-r); }
.sw-foto img { width: 100%; height: 100%; object-fit: cover; transition: transform 1s var(--sw-ease), opacity .3s; }
.sw-foto:hover img { transform: scale(1.04); }
.sw-foto-piu { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; padding: 8px; text-align: center; background: rgba(20,22,27,.55);
  color: #fff; font-size: 12px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; }
/* Blocchi da 5 foto: una grande (2x2) e quattro piccole = due righe piene, senza buchi.
   La grande sta a sinistra nel primo blocco e a destra nel secondo; dense riempie i posti liberi. */
.sw-mosaico { display: grid; grid-template-columns: repeat(4, 1fr); grid-auto-rows: clamp(140px, 18vw, 240px); grid-auto-flow: dense; gap: 10px; }
.sw-mosaico .sw-foto:nth-child(10n+1) { grid-column: 1 / span 2; grid-row: span 2; }
.sw-mosaico .sw-foto:nth-child(10n+6) { grid-column: 3 / span 2; grid-row: span 2; }
@media (max-width: 700px) {
  .sw-mosaico { grid-template-columns: repeat(2, 1fr); grid-auto-rows: 150px; }
  .sw-mosaico .sw-foto:nth-child(10n+6) { grid-column: 1 / span 2; }
}

.sw-lb { position: fixed; inset: 0; z-index: 200; display: flex; align-items: center; justify-content: center; background: rgba(10,12,16,.94); }
.sw-lb-fig { margin: 0; display: flex; flex-direction: column; align-items: center; gap: 12px; }
.sw-lb-fig img { max-width: 88vw; max-height: 80vh; width: auto; height: auto; object-fit: contain; }
.sw-lb-fig figcaption { color: rgba(255,255,255,.8); font-size: 14px; text-align: center; max-width: 80vw; }
.sw-lb button { position: absolute; display: flex; align-items: center; justify-content: center; width: 52px; height: 52px; border: 1px solid rgba(255,255,255,.35); border-radius: 50%;
  background: rgba(0,0,0,.25); color: #fff; font-size: 26px; cursor: pointer; }
.sw-lb button:hover { background: rgba(255,255,255,.15); }
.sw-lb-chiudi { top: 18px; right: 18px; font-size: 20px !important; }
.sw-lb-prec { left: 18px; top: 50%; transform: translateY(-50%); }
.sw-lb-succ { right: 18px; top: 50%; transform: translateY(-50%); }
@media (max-width: 600px) { .sw-lb-prec, .sw-lb-succ { top: auto; bottom: 22px; transform: none; } .sw-lb-fig img { max-width: 100vw; } }

/* -- Testata delle pagine interne ------------------------------------------------------ */
.sw-testata { position: relative; min-height: 62vh; display: flex; align-items: flex-end; color: #fff; background: var(--sw-ink); overflow: hidden; }
.sw-testata-in { position: relative; z-index: 1; width: 100%; max-width: var(--sw-max); margin: 0 auto; padding: 150px var(--sw-gutter) 56px; }
.sw-testata .sw-titolo { font-size: clamp(42px, 7vw, 92px); max-width: 16ch; text-wrap: balance; }
.sw-testata-intro { margin: 18px 0 0; max-width: 560px; color: rgba(255,255,255,.85); font-size: 17px; }

/* -- Dove siamo ------------------------------------------------------------------------ */
.sw-dove { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(32px, 6vw, 96px); align-items: end; }
.sw-dove-ind { margin: 22px 0 26px; font-size: 18px; }
.sw-dove-dati { margin: 0; display: grid; gap: 0; border-top: 1px solid var(--sw-line); }
.sw-dove-dati div { display: flex; gap: 20px; padding: 16px 0; border-bottom: 1px solid var(--sw-line); }
.sw-dove-dati dt { min-width: 110px; font-size: 11px; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; color: var(--sw-muted); padding-top: 3px; }
.sw-dove-dati dt .fa { font-size: 16px; color: var(--brand-text, var(--brand)); }
.sw-dove-dati dd { margin: 0; overflow-wrap: anywhere; }
.sw-dove-dati a { text-decoration: none; }
.sw-dove-dati a:hover { text-decoration: underline; }
@media (max-width: 780px) { .sw-dove { grid-template-columns: 1fr; } }

.sw-vuoto { max-width: 900px; margin: 0 auto; text-align: center; }
.sw-vuoto > p { font-family: var(--sw-serif); font-size: 28px; margin: 0 0 28px; }
.sw-vuoto .sw-box { text-align: left; box-shadow: 0 18px 50px rgba(20,22,27,.08); }

/* -- Footer ---------------------------------------------------------------------------- */
.sw-foot { background: var(--sw-ink); color: rgba(255,255,255,.75); font-size: 14.5px; }
.sw-foot a { color: #fff; text-decoration: none; }
.sw-foot a:hover { text-decoration: underline; }
.sw-foot-in { max-width: var(--sw-max); margin: 0 auto; padding: clamp(64px, 8vw, 100px) var(--sw-gutter) 40px; display: grid; grid-template-columns: 1.4fr 1fr .8fr; gap: 44px; }
.sw-foot-titolo { margin: 0 0 16px; font-family: var(--sw-serif); font-size: clamp(32px, 4vw, 46px); font-weight: 300; line-height: 1.05; color: #fff; }
.sw-foot-ind, .sw-foot-diretta { margin: 0 0 8px; }
.sw-foot-diretta .fa, .sw-foot-ind .fa { color: var(--brand-soft, #e9e2d3); margin-right: 4px; }
.sw-foot .wr-foot-info { display: flex; flex-direction: column; gap: 8px; }
.sw-foot .wr-foot-info > .wr-foot-sep { display: none; }
.sw-foot .wr-foot-fisc { font-size: 13px; color: rgba(255,255,255,.6); }
.sw-foot .wr-foot-fisc .wr-foot-sep { margin: 0 6px; }
.sw-foot .wr-foot-info .fa { width: 18px; color: var(--brand-soft, #e9e2d3); }
.sw-social { display: flex; gap: 10px; margin-top: 18px; }
.sw-social a { display: flex; align-items: center; justify-content: center; width: 42px; height: 42px; border: 1px solid rgba(255,255,255,.3); border-radius: 50%; font-size: 17px; }
.sw-social a:hover { background: #fff; color: var(--sw-ink); text-decoration: none; }
.sw-foot-nav { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 8px; }
.sw-foot-basso { max-width: var(--sw-max); margin: 0 auto; padding: 24px var(--sw-gutter) 40px; border-top: 1px solid rgba(255,255,255,.12);
  display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 14px; font-size: 13px; }
.sw-foot-basso p { margin: 0; }
.sw-foot .wr-foot-legal { display: flex; flex-wrap: wrap; gap: 6px 16px; }
.sw-foot .wr-legal-btn { color: rgba(255,255,255,.75); font-size: 13px; }
.sw-foot .wr-legal-btn .fa { display: none; }
@media (max-width: 820px) { .sw-foot-in { grid-template-columns: 1fr; gap: 32px; } .sw-foot-basso { padding-bottom: 100px; } }

/* -- Bottone WhatsApp: tondo, icona centrata, colore dei bottoni della struttura ------------ */
.sw-wa { position: fixed; right: max(18px, env(safe-area-inset-right)); bottom: max(18px, env(safe-area-inset-bottom)); z-index: 60;
  display: flex; align-items: center; justify-content: center; width: 60px; height: 60px; padding: 0; border-radius: 50%;
  background: var(--brand); color: var(--brand-ink, #fff) !important; text-decoration: none; box-shadow: 0 10px 30px rgba(0,0,0,.25);
  transition: transform .3s var(--sw-ease), background .3s; }
.sw-wa .fa { display: block; width: 30px; font-size: 32px; line-height: 1; text-align: center; margin: 0; }
.sw-wa-testo { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.sw-wa:hover, .sw-wa:focus-visible { background: var(--brand-dark, var(--brand)); color: #fff !important; text-decoration: none; transform: translateY(-2px); }

/* -- Comparsa allo scroll (solo con JavaScript e senza "riduci movimento") ---------------- */
html.sw-js:not(.sw-reduced) [data-sw-rev] { opacity: 0; transform: translateY(34px); transition: opacity 1s var(--sw-ease), transform 1s var(--sw-ease); }
html.sw-js:not(.sw-reduced) [data-sw-rev].is-visto { opacity: 1; transform: none; }
html.sw-js:not(.sw-reduced) .sw-servizi [data-sw-rev] { transform: translateY(14px); }

/* -- Menu a tutto schermo (hamburger): tutte le pagine e le camere per tipologia ----------- */
.sw-hdr.is-aperto { background: var(--sw-ink); color: #fff; box-shadow: none; }
.sw-menu { position: fixed; inset: 0; z-index: 45; overflow-y: auto; background: var(--sw-ink); color: #fff; }
.sw-menu-in { max-width: var(--sw-max); min-height: 100%; margin: 0 auto; padding: 120px var(--sw-gutter) 48px; display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); gap: 32px clamp(40px, 7vw, 120px); align-content: start; }
.sw-menu a { color: #fff; text-decoration: none; }
.sw-menu-pag { margin: 0; padding: 0; list-style: none; }
.sw-menu-pag a { display: inline-block; padding: 4px 0; font-family: var(--sw-serif); font-weight: 300; font-size: clamp(40px, 5.5vw, 72px); line-height: 1.1;
  transition: color .3s, transform .4s var(--sw-ease); }
.sw-menu-pag a:hover, .sw-menu-pag a:focus-visible { color: var(--brand-soft, #e9e2d3); transform: translateX(10px); text-decoration: none; }
.sw-menu-pag a[aria-current] { font-style: italic; }
.sw-menu-cam .sw-occhiello { color: var(--brand-soft, #e9e2d3); }
.sw-menu-cam ul { margin: 0; padding: 0; list-style: none; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 240px), 1fr)); gap: 4px 28px; }
.sw-menu-cam li a { display: flex; align-items: center; gap: 14px; padding: 10px 0; border-bottom: 1px solid rgba(255,255,255,.12); }
.sw-menu-cam img { flex: none; width: 56px; height: 42px; object-fit: cover; border-radius: 3px; background: rgba(255,255,255,.1); }
.sw-menu-cam span { font-family: var(--sw-serif); font-size: 22px; line-height: 1.15; }
.sw-menu-cam small { display: block; font-family: var(--font); font-size: 12px; color: rgba(255,255,255,.6); margin-top: 2px; }
.sw-menu-cam li a:hover span, .sw-menu-cam li a:focus-visible span { color: var(--brand-soft, #e9e2d3); }
.sw-menu-tutte { display: inline-flex; margin-top: 16px; font-size: 12px; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; }
.sw-menu-piede { grid-column: 1 / -1; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 18px; padding-top: 26px;
  border-top: 1px solid rgba(255,255,255,.14); font-size: 14px; color: rgba(255,255,255,.75); }
.sw-menu-piede .sw-lingue a { font-size: 13px; padding: 8px 10px; }
.sw-menu-contatti { display: flex; flex-wrap: wrap; gap: 8px 22px; }
html.sw-js:not(.sw-reduced) .sw-menu:not([hidden]) .sw-menu-in > * { animation: sw-sale .7s var(--sw-ease) both; }
html.sw-js:not(.sw-reduced) .sw-menu:not([hidden]) .sw-menu-in > *:nth-child(2) { animation-delay: .08s; }
@media (max-width: 860px) { .sw-menu-in { grid-template-columns: 1fr; padding-top: 96px; } }

/* -- Camere che scorrono in orizzontale (piu' di 3) --------------------------------------- */
.sw-scorri-testa { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; }
.sw-scorri-testa .sw-sez-testa { margin-bottom: clamp(36px, 5vw, 60px); }
.sw-scorri-frecce { display: flex; gap: 10px; margin-bottom: clamp(36px, 5vw, 60px); flex: none; }
.sw-scorri-frecce button { display: flex; align-items: center; justify-content: center; width: 52px; height: 52px; border: 1px solid var(--sw-ink); border-radius: 50%;
  background: transparent; color: var(--sw-ink); font-size: 22px; cursor: pointer; transition: background .3s, color .3s, opacity .3s; }
.sw-scorri-frecce button:hover:not(:disabled) { background: var(--sw-ink); color: #fff; }
.sw-scorri-frecce button:disabled { opacity: .25; cursor: default; }
/* La pista esce fino al bordo destro dello schermo (--sw-sborda) e le card sono larghe un po'
   meno di un terzo: a destra si vede sempre uno spicchio della camera successiva. */
.sw-scorri-pista { --g: clamp(20px, 3vw, 36px); --sw-sborda: calc((100vw - 100%) / 2);
  display: grid; grid-auto-flow: column; grid-auto-columns: calc((100% - 3 * var(--g)) / 3.25); gap: var(--g);
  margin-right: calc(-1 * var(--sw-sborda)); padding-right: var(--sw-sborda);
  overflow-x: auto; scroll-snap-type: x mandatory; overscroll-behavior-x: contain; scrollbar-width: none; padding-bottom: 6px; }
.sw-scorri-pista::-webkit-scrollbar { display: none; }
.sw-scorri-pista > * { scroll-snap-align: start; }
@media (max-width: 1060px) { .sw-scorri-pista { grid-auto-columns: calc((100% - 2 * var(--g)) / 2.25); } }
@media (max-width: 640px) { .sw-scorri-pista { grid-auto-columns: 84%; } .sw-scorri-frecce button { width: 44px; height: 44px; } }

/* -- Popup dei testi legali (Privacy, Cookie, Condizioni, Accessibilita') del footer ------ */
.sw-doc { position: fixed; inset: 0; z-index: 210; display: flex; align-items: center; justify-content: center; padding: 24px; background: rgba(10,12,16,.72); }
.sw-doc-box { display: flex; flex-direction: column; width: min(860px, 100%); height: min(86vh, 900px); background: var(--sw-white); border-radius: var(--sw-r); overflow: hidden;
  box-shadow: 0 30px 80px rgba(0,0,0,.4); }
.sw-doc-testa { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 14px 18px 14px 24px; border-bottom: 1px solid var(--sw-line); }
.sw-doc-titolo { margin: 0; font-family: var(--sw-serif); font-size: 26px; line-height: 1.2; color: var(--sw-ink); }
.sw-doc-chiudi { display: flex; align-items: center; justify-content: center; width: 44px; height: 44px; flex: none; border: 1px solid var(--sw-line); border-radius: 50%;
  background: transparent; color: var(--sw-ink); font-size: 18px; cursor: pointer; }
.sw-doc-chiudi:hover { background: var(--sw-ink); color: #fff; }
.sw-doc iframe { flex: 1; width: 100%; border: 0; background: #fff; }
@media (max-width: 600px) { .sw-doc { padding: 0; } .sw-doc-box { height: 100%; border-radius: 0; } .sw-doc-titolo { font-size: 22px; } }

/* -- Domande frequenti (stile Booking: domande fisse, risposte dai dati) ------------------ */
.sw-faq { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: clamp(32px, 6vw, 96px); align-items: start; }
.sw-faq-testa { position: sticky; top: 110px; }
.sw-faq-elenco { border-top: 1px solid var(--sw-line); }
.sw-faq-voce { border-bottom: 1px solid var(--sw-line); }
.sw-faq-voce summary { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 20px 2px; cursor: pointer; list-style: none;
  font-family: var(--sw-serif); font-size: 22px; line-height: 1.3; color: var(--sw-ink); }
.sw-faq-voce summary::-webkit-details-marker { display: none; }
.sw-faq-voce summary .fa { flex: none; font-size: 14px; color: var(--brand-text, var(--brand)); transition: transform .3s var(--sw-ease); }
.sw-faq-voce[open] summary .fa { transform: rotate(45deg); }
.sw-faq-voce summary:hover { color: var(--brand-text, var(--brand)); }
.sw-faq-risp { padding: 0 2px 22px; color: var(--sw-muted); }
.sw-faq-risp p { margin: 0 0 10px; }
@media (max-width: 860px) { .sw-faq { grid-template-columns: 1fr; } .sw-faq-testa { position: static; } .sw-faq-voce summary { font-size: 19px; } }

/* -- Pagina Servizi: categorie come su Booking -------------------------------------------- */
.sw-cat-griglia { columns: 3 300px; column-gap: clamp(24px, 4vw, 56px); }
.sw-cat { break-inside: avoid; margin: 0 0 clamp(28px, 4vw, 44px); padding: 24px 24px 20px; background: var(--sw-white); border-radius: var(--sw-r); }
.sw-cat-titolo { display: flex; align-items: center; gap: 12px; margin: 0 0 14px; font-family: var(--sw-serif); font-weight: 400; font-size: 26px; line-height: 1.2; color: var(--sw-ink); }
.sw-cat-titolo .fa { width: 26px; font-size: 19px; text-align: center; color: var(--brand-text, var(--brand)); }
.sw-cat ul { margin: 0; padding: 0; list-style: none; }
.sw-cat li { display: flex; align-items: baseline; gap: 10px; padding: 6px 0; font-size: 15px; }
.sw-cat li .fa { flex: none; font-size: 12px; color: #1a7f45; }