/* ===========================================================
   Stay in Ortigia — site styles
   Palette: #9c8965 (gold) · white · ivory · warm ink
   Type:    Cormorant Garamond (display) · Jost (UI/body)
   =========================================================== */

:root{
  --gold:#9c8965;
  --gold-deep:#7d6b4b;
  --gold-soft:#c9b896;
  --ivory:#f6f1e8;
  --ivory-2:#ece4d3;
  --ink:#2a2520;
  --ink-soft:#5a544c;
  --line:rgba(156,137,101,.25);
  --white:#ffffff;
  --shadow-sm:0 6px 24px -10px rgba(42,37,32,.18);
  --shadow-md:0 30px 80px -30px rgba(42,37,32,.35);
  --r-sm:14px;
  --r-md:22px;
  --r-lg:34px;
  --r-xl:56px;
  --maxw:1320px;
  --pad:clamp(20px, 4vw, 64px);
  --ease:cubic-bezier(.22,.61,.36,1);
}

*,*::before,*::after{box-sizing:border-box}
html,body{margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  font-family:"Jost", system-ui, sans-serif;
  font-weight:300;
  color:var(--ink);
  background:var(--white);
  line-height:1.55;
  font-size:16px;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer;padding:0}

/* ---------- typography ---------- */
.display{
  font-family:"Cormorant Garamond", "Cormorant", serif;
  font-weight:300;
  letter-spacing:-.01em;
  line-height:.98;
  white-space:pre-line;
}
h1.display{ font-size:clamp(48px, 8vw, 124px); }
h2.display{ font-size:clamp(40px, 5.6vw, 84px); }
h3.display{ font-size:clamp(28px, 3vw, 44px); }
.eyebrow{
  font-size:11px;
  letter-spacing:.32em;
  text-transform:uppercase;
  font-weight:400;
  color:var(--gold);
  display:inline-flex;
  align-items:center;
  gap:14px;
}
.eyebrow::before{
  content:"";
  width:34px;height:1px;background:var(--gold);
}
.lead{ font-size:clamp(16px,1.15vw,19px); color:var(--ink-soft); max-width:60ch; }

/* ---------- shell ---------- */
.shell{max-width:var(--maxw);margin:0 auto;padding-inline:var(--pad)}
section{position:relative}

/* ===========================================================
   Top info bar
   =========================================================== */
.topbar{
  background:var(--ink);
  color:rgba(255,255,255,.72);
  font-size:12px;
  letter-spacing:.12em;
  text-transform:uppercase;
  font-weight:300;
}
.topbar .shell{
  display:flex;align-items:center;justify-content:space-between;
  height:38px;gap:24px;
}
.topbar a{transition:color .3s}
.topbar a:hover{color:var(--gold-soft)}
.topbar .tinfo{display:flex;gap:28px;align-items:center}
.topbar .tinfo svg{width:13px;height:13px;opacity:.7;vertical-align:-2px;margin-right:8px}
.topbar .tlang{display:flex;gap:2px;align-items:center}
.topbar .tlang button{
  padding:4px 10px;letter-spacing:.18em;font-size:11px;
  color:rgba(255,255,255,.55);
  border-radius:999px;
  transition:.3s var(--ease);
}
.topbar .tlang button.is-active{ color:var(--gold-soft); background:rgba(255,255,255,.06); }
.topbar .tlang span{ color:rgba(255,255,255,.2); }

@media (max-width:720px){
  .topbar .tinfo{gap:14px}
  .topbar .tinfo .t-email{display:none}
}

/* ===========================================================
   Nav
   =========================================================== */
.nav{
  position:sticky; top:0; z-index:60;
  background:rgba(255,255,255,.86);
  backdrop-filter: blur(18px) saturate(1.1);
  -webkit-backdrop-filter: blur(18px) saturate(1.1);
  border-bottom:1px solid var(--line);
  transition:background .4s var(--ease), padding .4s var(--ease);
}
.nav .shell{
  display:flex;align-items:center;justify-content:space-between;
  height:104px;gap:32px;
}
.nav.is-condensed .shell{height:80px}
.nav-logo{display:flex;align-items:center;gap:14px}
.nav-logo img{height:76px;width:auto;transition:height .4s var(--ease)}
.nav.is-condensed .nav-logo img{height:58px}
.nav-menu{display:flex;gap:34px;align-items:center}
.nav-menu a,
.nav-menu .has-mega{
  font-size:13px; letter-spacing:.22em; text-transform:uppercase;
  font-weight:400; color:var(--ink-soft);
  padding:8px 0; position:relative;
  transition:color .3s;
}
.nav-menu a::after{
  content:""; position:absolute; left:0; right:0; bottom:0;
  height:1px; background:var(--gold); transform:scaleX(0);
  transform-origin:left; transition:transform .4s var(--ease);
}
.nav-menu a:hover{color:var(--gold-deep)}
.nav-menu a:hover::after{transform:scaleX(1)}
.nav-menu a.is-current{color:var(--gold-deep)}
.nav-menu a.is-current::after{transform:scaleX(1)}

/* ---------- Mega menu (Suites) ---------- */
.nav-item{position:relative}
.nav-item .has-mega{
  display:inline-flex; align-items:center; gap:8px; cursor:pointer;
}
.nav-item .has-mega svg{
  width:10px;height:10px;
  transition:transform .35s var(--ease);
}
.nav-item.is-open .has-mega svg{transform:rotate(180deg)}

.megamenu{
  position:fixed;
  left:0; right:0; top:122px; /* topbar 38 + nav 84 */
  background:rgba(255,255,255,.97);
  backdrop-filter:blur(20px) saturate(1.1);
  border-bottom:1px solid var(--line);
  box-shadow:0 30px 60px -30px rgba(42,37,32,.25);
  opacity:0; visibility:hidden;
  transform:translateY(-12px);
  transition:opacity .35s var(--ease), transform .45s var(--ease), visibility .35s;
  z-index:55;
}
.nav.is-condensed + .megamenu,
.megamenu.condensed{ top:106px; }
.megamenu.is-open{ opacity:1; visibility:visible; transform:translateY(0); }

.megamenu .shell{
  padding-block: clamp(36px, 5vw, 64px);
  display:grid;
  grid-template-columns: 0.7fr 2.5fr;
  gap:clamp(28px, 5vw, 80px);
  align-items:flex-start;
}
.megamenu-intro{
  border-right:1px solid var(--line);
  padding-right:clamp(20px, 3vw, 40px);
}
.megamenu-intro .eyebrow{margin-bottom:14px}
.megamenu-intro h3{
  font-family:"Cormorant Garamond",serif;
  font-weight:300; line-height:1; margin:0 0 16px;
  font-size:clamp(34px, 3vw, 48px);
  color:var(--ink); letter-spacing:-.01em;
}
.megamenu-intro p{
  color:var(--ink-soft); font-size:14px; line-height:1.6;
  max-width:28ch; margin:0 0 24px;
}
.megamenu-intro .megaall{
  display:inline-flex; align-items:center; gap:10px;
  font-size:11px; letter-spacing:.26em; text-transform:uppercase;
  color:var(--gold-deep); font-weight:500;
  padding-bottom:6px; border-bottom:1px solid var(--gold);
  transition:.3s var(--ease);
}
.megamenu-intro .megaall:hover{ gap:18px; color:var(--ink) }
.megamenu-intro .megaall svg{width:13px;height:13px}

.megamenu-grid{
  display:grid; grid-template-columns:repeat(4,1fr); gap:18px;
}
.megacard{
  display:block; position:relative;
  border-radius:var(--r-md); overflow:hidden;
  aspect-ratio: 3/4;
  background:#000;
  transition:transform .5s var(--ease);
}
.megacard img{
  width:100%;height:100%;object-fit:cover;
  transition:transform .9s var(--ease), filter .5s var(--ease);
  filter:brightness(.78) saturate(1.05);
}
.megacard:hover{transform:translateY(-4px)}
.megacard:hover img{transform:scale(1.08); filter:brightness(.6)}
.megacard::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(20,18,15,0) 30%, rgba(20,18,15,.85) 100%);
}
.megacard .meta{
  position:absolute; left:18px; right:18px; bottom:16px; z-index:2;
  color:#fff;
}
.megacard .meta .num{
  font-size:10px; letter-spacing:.32em; text-transform:uppercase;
  color:var(--gold-soft); margin-bottom:6px; display:block;
}
.megacard .meta h4{
  font-family:"Cormorant Garamond",serif; font-weight:400;
  font-size:24px; line-height:1.05; margin:0;
}
.megacard .meta .tag{
  font-size:11px; letter-spacing:.18em; text-transform:uppercase;
  color:rgba(255,255,255,.7); margin-top:4px; display:block;
}
.megacard .meta .arrow{
  position:absolute; right:0; bottom:0;
  width:32px;height:32px;border-radius:50%;
  background:rgba(255,255,255,.15);
  backdrop-filter:blur(6px);
  display:flex;align-items:center;justify-content:center;
  transition:.4s var(--ease);
}
.megacard:hover .meta .arrow{ background:var(--gold); transform:translateX(4px) }
.megacard .meta .arrow svg{ width:12px;height:12px;color:#fff }

@media (max-width:980px){
  .megamenu{ display:none; }
  /* Mobile inline expansion */
  .nav.is-open .nav-menu .megamenu-mobile{
    display:flex; flex-direction:column; gap:14px; padding-left:18px;
    border-left:2px solid var(--gold-soft); margin-top:8px;
  }
  .megamenu-mobile a{
    font-size:18px !important; color:var(--ink-soft) !important;
    letter-spacing:0 !important; padding:4px 0 !important;
  }
}
@media (min-width:981px){
  .megamenu-mobile{display:none}
}

/* ===========================================================
   Page hero (subpages, smaller than homepage hero)
   =========================================================== */
.page-hero{
  position:relative;
  min-height:62vh; padding:140px 0 80px;
  display:flex; align-items:flex-end;
  overflow:hidden; color:#fff; background:var(--ink);
}
.page-hero .bg{
  position:absolute; inset:0;
  background-size:cover; background-position:center;
  transform:scale(1.06);
  animation: ph-zoom 24s linear infinite alternate;
}
@keyframes ph-zoom{
  from{transform:scale(1.04) translate(-1%, 0)}
  to{transform:scale(1.12) translate(1%, -1%)}
}
.page-hero::after{
  content:""; position:absolute; inset:0;
  background:
    linear-gradient(180deg, rgba(20,18,15,.35) 0%, rgba(20,18,15,0) 30%, rgba(20,18,15,.65) 100%),
    linear-gradient(90deg, rgba(20,18,15,.4) 0%, rgba(20,18,15,0) 50%);
}
.page-hero .shell{position:relative;z-index:2;width:100%}
.page-hero .eyebrow{color:var(--gold-soft)}
.page-hero .eyebrow::before{background:var(--gold-soft)}
.page-hero h1{color:#fff;margin:18px 0 16px;max-width:18ch}
.page-hero .pcrumb{
  font-size:11px; letter-spacing:.28em; text-transform:uppercase;
  color:rgba(255,255,255,.65); display:flex; gap:10px; align-items:center; flex-wrap:wrap;
}
.page-hero .pcrumb a{transition:color .3s}
.page-hero .pcrumb a:hover{color:var(--gold-soft)}
.page-hero .pcrumb span{opacity:.4}

/* ===========================================================
   Page content blocks
   =========================================================== */
.section.tight{ padding-block: clamp(60px,8vw,110px) }
.section.tight:has(+ .section-map){
  padding-block: clamp(28px, 3.5vw, 56px) clamp(20px, 2.5vw, 36px);
}
.section.tight:has(+ .section-map) .section-head{
  margin-bottom:0; align-items:baseline;
}
.section.tight:has(+ .section-map) .section-head h2.display{
  font-size:clamp(28px, 3vw, 44px); line-height:1.1; margin:0;
}
.section.tight:has(+ .section-map) .section-head .lead{
  font-size:14px; margin:0;
}

/* Two-column split (image + text) */
.split{
  display:grid; gap:clamp(32px, 5vw, 80px);
  grid-template-columns: 1fr 1fr; align-items:center;
}
.split.flip > :first-child{order:2}
.split.flip > :last-child{order:1}
.split .stack > * + *{margin-top:18px}
.split .stack h2{ margin:18px 0 12px }
.split .stack p{ color:var(--ink-soft); font-size:17px; max-width:48ch }
.split-media{
  position:relative; aspect-ratio: 5/6;
  border-radius:var(--r-lg); overflow:hidden;
  box-shadow:var(--shadow-md);
}
.split-media img{ width:100%; height:100%; object-fit:cover; transition:transform 1.4s var(--ease) }
.split-media:hover img{transform:scale(1.05)}
@media (max-width:880px){
  .split{grid-template-columns:1fr}
  .split.flip > :first-child{order:0}
  .split.flip > :last-child{order:0}
}

/* Feature list with bullets */
.feature-list{
  list-style:none; padding:0; margin:24px 0 0;
  display:grid; grid-template-columns:1fr 1fr; gap:12px 28px;
}
.feature-list li{
  display:flex; gap:14px; align-items:flex-start;
  font-size:15px; color:var(--ink-soft);
}
.feature-list li::before{
  content:""; flex:none;
  width:6px; height:6px; border-radius:50%; background:var(--gold);
  margin-top:9px;
}
@media (max-width:560px){ .feature-list{grid-template-columns:1fr} }

/* Suite header bar (number, title, facts) */
.suite-head{
  display:grid; grid-template-columns: 1.5fr 1fr; gap:48px;
  align-items:end; margin-bottom:48px;
}
.suite-head .num{
  font-family:"Cormorant Garamond",serif;
  color:var(--gold); font-size:14px; letter-spacing:.32em;
  text-transform:uppercase;
  display:inline-flex; gap:14px; align-items:center;
}
.suite-head .num::before{content:"";width:34px;height:1px;background:var(--gold)}
.suite-head h1{ margin:14px 0 6px }
.suite-head .tag{
  font-size:13px; letter-spacing:.22em; text-transform:uppercase;
  color:var(--gold-deep);
}
.suite-head-facts{
  display:flex; gap:32px; justify-content:flex-end;
}
.suite-head-facts div .k{
  font-family:"Cormorant Garamond",serif; font-size:40px;
  color:var(--ink); display:block; line-height:1;
}
.suite-head-facts div .v{
  font-size:10px; letter-spacing:.24em; text-transform:uppercase;
  color:var(--ink-soft); margin-top:6px; display:block;
}
@media (max-width:760px){
  .suite-head{grid-template-columns:1fr; gap:24px}
  .suite-head-facts{justify-content:flex-start; flex-wrap:wrap; gap:24px}
}

/* Big suite gallery (full grid) */
.gallery-grid{
  display:grid;
  grid-template-columns:repeat(12,1fr);
  gap:14px;
}
.gallery-grid figure{
  margin:0; border-radius:var(--r-md); overflow:hidden;
  background:#000;
}
.gallery-grid figure img{
  width:100%; height:100%; object-fit:cover;
  transition:transform 1s var(--ease), filter .4s var(--ease);
}
.gallery-grid figure:hover img{ transform:scale(1.04) }
.gallery-grid .g-a{ grid-column: span 8; aspect-ratio:16/10 }
.gallery-grid .g-b{ grid-column: span 4; aspect-ratio:4/5 }
.gallery-grid .g-c{ grid-column: span 4; aspect-ratio:4/5 }
.gallery-grid .g-d{ grid-column: span 4; aspect-ratio:4/5 }
.gallery-grid .g-e{ grid-column: span 4; aspect-ratio:4/5 }
.gallery-grid .g-f{ grid-column: span 8; aspect-ratio:16/10 }
.gallery-grid .g-g{ grid-column: span 6; aspect-ratio:3/2 }
.gallery-grid .g-h{ grid-column: span 6; aspect-ratio:3/2 }
@media (max-width:880px){
  .gallery-grid{grid-template-columns:repeat(2,1fr)}
  .gallery-grid figure{grid-column:span 1 !important; aspect-ratio:4/5 !important}
}

/* ===========================================================
   Booking widget: calendar + form (suite pages)
   =========================================================== */
.booking-grid{
  display:grid; grid-template-columns: 1.2fr 1fr;
  gap:clamp(32px, 4vw, 64px); align-items:flex-start;
}
@media (max-width:980px){ .booking-grid{grid-template-columns:1fr} }

.calendar{
  background:#fff; border-radius:var(--r-lg);
  padding:clamp(24px, 3vw, 36px);
  border:1px solid var(--line);
  box-shadow: 0 30px 60px -40px rgba(42,37,32,.25);
}
.calendar-head{
  display:flex; justify-content:space-between; align-items:center;
  margin-bottom:24px; gap:14px;
}
.calendar-head .cal-title{
  font-family:"Cormorant Garamond",serif;
  font-size:24px; color:var(--ink); font-weight:400;
}
.calendar-head .cal-nav-wrap{display:flex; gap:8px}
.cal-nav{
  width:36px;height:36px;border-radius:50%;
  background:var(--ivory); color:var(--ink);
  display:flex;align-items:center;justify-content:center;
  cursor:pointer; transition:.3s var(--ease);
  border:1px solid transparent;
}
.cal-nav:hover{ background:var(--gold); color:#fff }
.cal-nav:disabled{ opacity:.35; cursor:not-allowed; background:var(--ivory); color:var(--ink-soft) }
.cal-nav svg{width:14px;height:14px}

.cal-months{
  display:grid; grid-template-columns:1fr 1fr; gap:clamp(16px,2vw,32px);
}
@media (max-width:640px){ .cal-months{grid-template-columns:1fr} }

.cal-month-name{
  text-align:center; font-family:"Cormorant Garamond",serif;
  font-size:20px; color:var(--ink); margin:0 0 12px;
  letter-spacing:.04em;
}
.cal-month-name em{ color:var(--gold-deep); font-style:normal; margin-left:6px; font-weight:500 }

.cal-weekdays{
  display:grid; grid-template-columns:repeat(7,1fr); gap:4px;
  margin-bottom:8px;
}
.cal-weekdays span{
  text-align:center; font-size:10px; letter-spacing:.18em;
  text-transform:uppercase; color:var(--ink-soft);
  padding:6px 0;
}
.cal-days{
  display:grid; grid-template-columns:repeat(7,1fr); gap:4px;
}
.cal-day{
  aspect-ratio:1; min-height:34px;
  display:flex; align-items:center; justify-content:center;
  border-radius:10px; font-size:13px;
  cursor:pointer; transition:.2s var(--ease);
  color:var(--ink); position:relative;
  font-variant-numeric:tabular-nums;
}
.cal-day.muted{
  color:transparent; cursor:default; pointer-events:none;
}
.cal-day.past{ color:var(--line); cursor:not-allowed; pointer-events:none; }
.cal-day.available:hover{ background:var(--ivory) }
.cal-day.booked{
  background:repeating-linear-gradient(135deg,
    rgba(156,137,101,.18) 0 5px, transparent 5px 10px);
  color:var(--ink-soft); cursor:not-allowed; pointer-events:none;
  text-decoration:line-through; text-decoration-color:rgba(156,137,101,.4);
}
.cal-day.today{
  font-weight:500;
}
.cal-day.today::after{
  content:""; position:absolute; bottom:5px; left:50%; transform:translateX(-50%);
  width:4px; height:4px; border-radius:50%; background:var(--gold);
}
.cal-day.in-range{ background:rgba(156,137,101,.18); border-radius:0 }
.cal-day.start, .cal-day.end{
  background:var(--gold); color:#fff; font-weight:500;
}
.cal-day.start{ border-radius:10px 0 0 10px }
.cal-day.end{ border-radius:0 10px 10px 0 }
.cal-day.start.end{ border-radius:10px }
.cal-day.start:not(.end) + .cal-day.in-range,
.cal-day.in-range + .cal-day.in-range{ border-radius:0 }

.cal-legend{
  margin-top:24px; padding-top:20px;
  border-top:1px solid var(--line);
  display:flex; gap:22px; flex-wrap:wrap;
  font-size:12px; color:var(--ink-soft); letter-spacing:.04em;
}
.cal-legend span{display:flex;align-items:center;gap:8px}
.cal-legend i{
  width:14px;height:14px;border-radius:5px;display:inline-block;
}
.cal-legend i.lg-available{ background:var(--ivory); border:1px solid var(--line) }
.cal-legend i.lg-booked{
  background:repeating-linear-gradient(135deg,
    rgba(156,137,101,.35) 0 4px, transparent 4px 8px);
  border:1px solid var(--line);
}
.cal-legend i.lg-selected{ background:var(--gold) }

.cal-summary{
  margin-top:18px;
  font-size:13px; color:var(--ink-soft);
  padding:14px 18px; background:var(--ivory);
  border-radius:var(--r-sm); text-align:center;
}
.cal-summary b{ color:var(--ink); font-weight:500 }
.cal-summary .nights{
  display:inline-block; margin-left:10px;
  padding:3px 12px; background:var(--gold); color:#fff;
  border-radius:999px; font-size:11px;
  letter-spacing:.16em; text-transform:uppercase;
}

/* Booking form refinements (quick-book) */
.quick-book .lbl{ font-size:11px }
.quick-book .qb-text{ grid-column:1/-1; margin:0 0 8px; font-size:14px; line-height:1.6; color:var(--ink-soft, #555) }
.quick-book button[type=submit]{ grid-column:1/-1 }
.quick-book input[readonly]{
  background:var(--ivory);
  cursor:pointer; color:var(--ink);
}
.quick-book input[readonly]:focus{ background:#fff }
.quick-book .hint{
  font-size:12px; color:var(--ink-soft); margin-top:-8px;
  display:flex; gap:6px; align-items:center;
}
.quick-book .hint svg{width:13px;height:13px;color:var(--gold-deep)}

/* Map section on suite pages */
.section-map{
  position:relative; height:480px; background:var(--ivory);
  overflow:hidden;
}
.section-map iframe,
.section-map .map-canvas{
  width:100%; height:100%; border:0;
}
.section-map iframe{ filter:grayscale(.4) contrast(1.02) saturate(.9); }
.section-map .map-canvas{ position:absolute; inset:0; z-index:1; background:var(--ivory) }
.section-map .leaflet-tile-pane{ filter:saturate(.55) contrast(.95) brightness(1.02) sepia(.08); }
.section-map .sio-pin{ background:none !important; border:0 !important; filter:drop-shadow(0 6px 12px rgba(42,37,32,.35)); }
.section-map .leaflet-popup-content-wrapper{
  border-radius:var(--r-md); background:#fff; color:var(--ink);
  box-shadow:0 20px 50px -20px rgba(42,37,32,.35);
}
.section-map .leaflet-popup-content{
  font:13px/1.5 'Jost',system-ui,sans-serif; margin:12px 14px; color:var(--ink);
}
.section-map .leaflet-popup-content strong{ color:var(--gold-deep); letter-spacing:.04em; }
.section-map .leaflet-popup-tip{ background:#fff; }
.section-map .leaflet-control-zoom a{
  background:#fff; color:var(--ink); border-color:var(--line);
}
.section-map .leaflet-control-zoom a:hover{ background:var(--ivory); color:var(--gold-deep); }
.section-map .leaflet-control-attribution{
  background:rgba(255,255,255,.78); font-size:10px; color:var(--ink-soft);
}
.section-map .leaflet-control-attribution a{ color:var(--gold-deep); }
.section-map .map-overlay{
  position:absolute; left:24px; bottom:24px;
  background:#fff; padding:22px 24px; border-radius:var(--r-md);
  box-shadow:0 20px 50px -20px rgba(42,37,32,.35);
  max-width:300px; z-index:2;
}
.section-map .map-overlay .eyebrow{ margin-bottom:8px }
.section-map .map-overlay h4{
  font-family:"Cormorant Garamond",serif; font-weight:400;
  font-size:22px; margin:0 0 4px; color:var(--ink);
}
.section-map .map-overlay p{
  margin:0 0 12px; font-size:13px; color:var(--ink-soft);
}
.section-map .map-overlay a{
  font-size:11px; letter-spacing:.24em; text-transform:uppercase;
  color:var(--gold-deep); padding-bottom:4px;
  border-bottom:1px solid var(--gold);
}
@media (max-width:560px){
  .section-map{height:380px}
  .section-map .map-overlay{left:12px; right:12px; max-width:none; bottom:12px; padding:16px 18px}
}

/* Suite nav (prev/next other suites) */
.suite-nav{
  display:grid; grid-template-columns:repeat(3,1fr); gap:14px;
  margin-top:80px;
}
.suite-nav a{
  position:relative; display:block;
  border-radius:var(--r-md); overflow:hidden;
  aspect-ratio: 16/9;
}
.suite-nav a img{
  width:100%;height:100%;object-fit:cover;
  transition:transform .9s var(--ease), filter .5s var(--ease);
  filter:brightness(.7);
}
.suite-nav a:hover img{ transform:scale(1.06); filter:brightness(.5) }
.suite-nav a::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(20,18,15,0) 40%, rgba(20,18,15,.7) 100%);
}
.suite-nav .info{
  position:absolute; left:24px; right:24px; bottom:22px; z-index:2;
  color:#fff;
  display:flex; align-items:center; justify-content:space-between; gap:14px;
}
.suite-nav .info .dir{
  font-size:10px; letter-spacing:.34em; text-transform:uppercase;
  color:var(--gold-soft); margin-bottom:6px; display:block;
}
.suite-nav .info h4{
  font-family:"Cormorant Garamond",serif; font-weight:400;
  font-size:26px; margin:0;
}
.suite-nav .info .arrow{
  width:42px;height:42px;border-radius:50%;
  background:rgba(255,255,255,.18); backdrop-filter:blur(6px);
  display:flex;align-items:center;justify-content:center;
  transition:.35s var(--ease);
}
.suite-nav a:hover .info .arrow{ background:var(--gold); transform:translateX(4px) }
.suite-nav svg{width:14px;height:14px;color:#fff}
@media (max-width:640px){ .suite-nav{grid-template-columns:1fr} }

/* Suites overview — index page cards */
.suites-index{
  display:grid; grid-template-columns:repeat(2,1fr); gap:clamp(20px,3vw,40px);
}
.suite-tile{
  display:block; position:relative;
  aspect-ratio: 4/5;
  border-radius:var(--r-lg); overflow:hidden;
  background:#000;
}
.suite-tile img{
  width:100%;height:100%;object-fit:cover;
  transition:transform 1.1s var(--ease), filter .5s var(--ease);
  filter:brightness(.78);
}
.suite-tile:hover img{ transform:scale(1.05); filter:brightness(.55) }
.suite-tile::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(20,18,15,0) 30%, rgba(20,18,15,.85) 100%);
}
.suite-tile .info{
  position:absolute; left:32px; right:32px; bottom:28px; z-index:2;
  color:#fff;
}
.suite-tile .info .num{
  font-size:11px; letter-spacing:.32em; text-transform:uppercase;
  color:var(--gold-soft); display:block; margin-bottom:8px;
}
.suite-tile .info h3{
  font-family:"Cormorant Garamond",serif; font-weight:300;
  font-size:clamp(32px, 3vw, 48px); margin:0; line-height:1;
}
.suite-tile .info .tag{
  font-size:12px; letter-spacing:.22em; text-transform:uppercase;
  color:rgba(255,255,255,.75); margin-top:8px; display:block;
}
.suite-tile .info .cta{
  margin-top:22px;
  display:inline-flex; gap:10px; align-items:center;
  font-size:11px; letter-spacing:.28em; text-transform:uppercase;
  color:#fff; padding:10px 0; border-bottom:1px solid rgba(255,255,255,.5);
  transition:.3s var(--ease);
}
.suite-tile:hover .info .cta{ gap:20px; border-color:var(--gold-soft) }
.suite-tile .info .cta svg{width:12px;height:12px}
@media (max-width:780px){ .suites-index{grid-template-columns:1fr} }

.btn-book{
  background:var(--gold); color:#fff;
  padding:14px 26px; border-radius:999px;
  font-size:12px; letter-spacing:.24em; text-transform:uppercase;
  font-weight:500;
  transition:.35s var(--ease);
  box-shadow:0 12px 28px -14px rgba(156,137,101,.7);
}
.btn-book:hover{background:var(--gold-deep); transform:translateY(-2px); box-shadow:0 18px 36px -14px rgba(156,137,101,.8)}

/* When mobile menu open, drop .nav backdrop-filter so position:fixed children
   are sized against the viewport (not the .nav containing block). */
.nav.is-open{
  background:transparent;
  backdrop-filter:none; -webkit-backdrop-filter:none;
  border-bottom-color:transparent;
}

/* Hamburger button — clean 2-line morph to X */
.nav-burger{
  display:none; width:44px; height:44px;
  align-items:center; justify-content:center;
  background:transparent; border:0; cursor:pointer;
  z-index:1100; position:relative;
}
.nav-burger span,
.nav-burger span::before,
.nav-burger span::after{
  content:""; display:block; width:24px; height:1.6px;
  background:var(--ink); border-radius:2px;
  position:relative; transition:transform .4s var(--ease), background .25s var(--ease), top .3s var(--ease) .15s;
}
.nav-burger span{background:transparent}
.nav-burger span::before{ position:absolute; top:-5px; left:0; right:0; }
.nav-burger span::after{  position:absolute; top: 5px; left:0; right:0; }
.nav.is-open .nav-burger span::before,
.nav.is-open .nav-burger span::after{ background:#fff; top:0; transition:top .3s var(--ease), transform .4s var(--ease) .15s, background .25s var(--ease); }
.nav.is-open .nav-burger span::before{ transform:rotate(45deg); }
.nav.is-open .nav-burger span::after{  transform:rotate(-45deg); }

/* Mobile-only extras inside fullscreen menu (hidden on desktop) */
.nav-mobile-extras{ display:none; }
.btn-book--full{ display:none; }

/* Backdrop behind fullscreen menu (hidden on desktop) */
.nav-backdrop{
  position:fixed; inset:0; background:rgba(20,18,15,0);
  pointer-events:none; transition:background .45s var(--ease);
  z-index:990;
}

@media (max-width:980px){
  /* Show burger, hide desktop CTA */
  .nav-burger{display:flex}
  .btn-book--desk{display:none}

  /* Lock condensed visual on mobile for compact header */
  .nav .shell{ height:74px; }
  .nav.is-condensed .shell{ height:64px; }
  .nav-logo img{ height:48px; }
  .nav.is-condensed .nav-logo img{ height:42px; }

  /* Fullscreen menu overlay */
  .nav-menu{
    position:fixed; inset:0;
    background:linear-gradient(180deg, rgba(20,18,15,.985) 0%, rgba(35,30,25,.985) 100%);
    -webkit-backdrop-filter:blur(24px); backdrop-filter:blur(24px);
    flex-direction:column; gap:6px;
    padding:96px 28px 36px;
    align-items:flex-start; justify-content:flex-start;
    overflow-y:auto; -webkit-overflow-scrolling:touch;
    opacity:0; pointer-events:none;
    transform:translateY(-12px);
    transition:opacity .45s var(--ease), transform .45s var(--ease);
    z-index:1000;
  }
  .nav.is-open .nav-menu{
    opacity:1; pointer-events:auto; transform:translateY(0);
  }
  .nav.is-open .nav-backdrop{ background:rgba(20,18,15,.4); }

  /* Top links — large display type, cascade fade-up */
  .nav-menu > a,
  .nav-menu .nav-item > .has-mega{
    font-family:"Cormorant Garamond", serif;
    font-weight:400; font-size:34px; letter-spacing:.005em;
    color:#fff; text-transform:none;
    padding:14px 0; width:100%;
    border-bottom:1px solid rgba(255,255,255,.08);
    opacity:0; transform:translateX(-12px);
    transition:opacity .45s var(--ease), transform .45s var(--ease), color .25s var(--ease);
  }
  .nav-menu .nav-item{ width:100%; }
  .nav-menu .nav-item > .has-mega{ display:flex; align-items:center; gap:10px; cursor:pointer; }
  .nav-menu .nav-item > .has-mega svg{ width:16px; height:16px; color:var(--gold-soft); transition:transform .3s var(--ease); }
  .nav-menu .nav-item.is-expanded > .has-mega svg{ transform:rotate(180deg); }
  .nav-menu > a:hover,
  .nav-menu > a.is-current,
  .nav-menu .nav-item > .has-mega:hover{ color:var(--gold-soft); }
  .nav-menu > a::after{ display:none; }

  .nav.is-open .nav-menu > a,
  .nav.is-open .nav-menu .nav-item > .has-mega,
  .nav.is-open .nav-menu .nav-mobile-extras{
    opacity:1; transform:translateX(0);
  }
  /* Cascade delays */
  .nav.is-open .nav-menu > *:nth-child(1){ transition-delay:.10s }
  .nav.is-open .nav-menu > *:nth-child(2){ transition-delay:.16s }
  .nav.is-open .nav-menu > *:nth-child(3){ transition-delay:.22s }
  .nav.is-open .nav-menu > *:nth-child(4){ transition-delay:.28s }
  .nav.is-open .nav-menu > *:nth-child(5){ transition-delay:.34s }
  .nav.is-open .nav-menu > *:nth-child(6){ transition-delay:.40s }

  /* Mobile suites sublist */
  .nav-menu .megamenu-mobile{
    display:none; padding:6px 0 14px 14px;
    border-bottom:1px solid rgba(255,255,255,.08);
  }
  .nav-menu .nav-item.is-expanded .megamenu-mobile{ display:flex; flex-direction:column; gap:2px; }
  .nav-menu .megamenu-mobile a{
    font-family:'Jost', sans-serif; font-size:14px; letter-spacing:.18em;
    text-transform:uppercase; color:rgba(255,255,255,.7);
    padding:10px 0; border:0;
  }
  .nav-menu .megamenu-mobile a:hover{ color:var(--gold-soft); }

  /* Extras: CTA + contacts + lang + social */
  .nav-mobile-extras{
    display:flex; flex-direction:column; gap:20px;
    width:100%; margin-top:auto; padding-top:32px;
    opacity:0; transform:translateX(-12px);
    transition:opacity .5s var(--ease), transform .5s var(--ease);
  }
  .btn-book--full{
    display:block; text-align:center; width:100%;
    background:var(--gold); color:#fff;
    padding:18px 24px; border-radius:999px;
    font-size:12px; letter-spacing:.32em; text-transform:uppercase;
    font-weight:500; transition:.3s var(--ease);
  }
  .btn-book--full:hover{ background:var(--gold-deep); }
  .nav-mobile-contact{ display:flex; flex-direction:column; gap:12px; }
  .nav-mobile-contact a{
    display:flex; align-items:center; gap:12px;
    color:rgba(255,255,255,.85); font-size:14px;
    padding:6px 0; border:0;
  }
  .nav-mobile-contact a svg{ width:16px; height:16px; color:var(--gold-soft); flex-shrink:0; }
  .nav-mobile-lang{
    display:flex; gap:8px; padding-top:8px;
    border-top:1px solid rgba(255,255,255,.08);
  }
  .nav-mobile-lang button{
    flex:1; padding:12px 18px; border-radius:999px;
    background:rgba(255,255,255,.06); color:rgba(255,255,255,.8);
    font-size:11px; letter-spacing:.28em; text-transform:uppercase;
    border:1px solid rgba(255,255,255,.1); transition:.25s var(--ease);
  }
  .nav-mobile-lang button.is-active,
  .nav-mobile-lang button:hover{ background:var(--gold); color:#fff; border-color:var(--gold); }
  .nav-mobile-social{
    display:flex; gap:14px; padding-top:8px;
  }
  .nav-mobile-social a{
    width:44px; height:44px; border-radius:50%;
    background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.1);
    display:flex; align-items:center; justify-content:center;
    color:rgba(255,255,255,.7); transition:.25s var(--ease); padding:0;
  }
  .nav-mobile-social a:hover{ background:var(--gold); color:#fff; border-color:var(--gold); }
  .nav-mobile-social a svg{ width:18px; height:18px; }

  /* Hide desktop megamenu on mobile */
  .megamenu{ display:none !important; }
}

/* Landscape mobile / small tablet portrait: compact menu */
@media (max-width:980px) and (max-height:520px){
  .nav-menu{ padding-top:72px; gap:2px; }
  .nav-menu > a,
  .nav-menu .nav-item > .has-mega{ font-size:24px; padding:10px 0; }
  .nav-mobile-extras{ padding-top:18px; gap:14px; }
  .btn-book--full{ padding:14px 22px; }
}

/* ===========================================================
   Hero
   =========================================================== */
.hero{
  height:100vh; min-height:640px;
  position:relative; overflow:hidden;
  background:var(--ink);
  color:#fff;
}
.hero-slider{position:absolute;inset:0}
.hero-slider .slide{
  position:absolute; inset:0; overflow:hidden;
  opacity:0; visibility:hidden; z-index:0;
  transition:opacity 1.4s cubic-bezier(.65,.05,.36,1), visibility 0s linear 1.4s;
}
/* before JS: first photo visible, so no blank hero */
.hero-slider:not(.is-ready) .slide:first-child,
.hero-slider .slide.is-active{
  opacity:1; visibility:visible; z-index:1;
  transition:opacity 1.4s cubic-bezier(.65,.05,.36,1), visibility 0s;
}
.hero-slider .slide-img{
  position:absolute; inset:-6%;
  background-size:cover; background-position:center;
  /* slow ken-burns; runs while the slide is current */
  transform:scale(1.05); transition:transform 8s linear;
}
.hero-slider .slide.is-active .slide-img{
  transform:scale(1.18) translate(-1%, 1%);
}
@media (prefers-reduced-motion: reduce){
  .hero-slider .slide{ transition-duration:.01s }
  .hero-slider .slide-img, .hero-slider .slide.is-active .slide-img{ transform:none; transition:none }
}
.hero-slider .slide::after{
  content:""; position:absolute; inset:0;
  background:
    linear-gradient(180deg, rgba(20,18,15,.25) 0%, rgba(20,18,15,0) 35%, rgba(20,18,15,.6) 100%),
    linear-gradient(90deg, rgba(20,18,15,.55) 0%, rgba(20,18,15,0) 55%);
}

.hero-inner{
  position:relative; z-index:2;
  height:100%;
  display:flex; flex-direction:column; justify-content:flex-end;
  padding-bottom:clamp(70px, 12vh, 140px);
}
.hero-inner .eyebrow{color:var(--gold-soft)}
.hero-inner .eyebrow::before{background:var(--gold-soft)}
.hero h1{color:#fff;margin:18px 0 22px}
.hero-sub{
  max-width:540px; color:rgba(255,255,255,.85);
  font-size:clamp(15px, 1.2vw, 19px); font-weight:300;
}
.hero-actions{margin-top:38px;display:flex;gap:18px;align-items:center;flex-wrap:wrap}

.btn-ghost{
  display:inline-flex; align-items:center; gap:14px;
  color:#fff; padding:16px 28px;
  border:1px solid rgba(255,255,255,.4);
  border-radius:999px; font-size:12px; letter-spacing:.24em;
  text-transform:uppercase;
  transition:.4s var(--ease);
}
.btn-ghost:hover{background:#fff;color:var(--ink);border-color:#fff}
.btn-ghost svg{width:14px;height:14px;transition:transform .4s var(--ease)}
.btn-ghost:hover svg{transform:translateX(4px)}

/* dots — hero */
.hero .hero-dots{
  position:absolute; right:var(--pad); top:50%;
  transform:translateY(-50%);
  display:flex !important; flex-direction:column; gap:14px;
  padding:0; margin:0; list-style:none; z-index:3;
}
.hero .hero-dots li{width:auto;height:auto;margin:0}
.hero .hero-dots li button{
  width:8px;height:8px;border-radius:50%;
  background:rgba(255,255,255,.3); transition:.4s;
  font-size:0; padding:0; border:0;
}
.hero .hero-dots li.is-active button{background:var(--gold-soft);width:8px;height:32px;border-radius:999px}

/* scroll cue */
.hero-scroll{
  position:absolute; bottom:74px; left:50%; transform:translateX(-50%);
  font-size:10px; letter-spacing:.4em; text-transform:uppercase;
  color:rgba(255,255,255,.6); z-index:3;
  display:flex; flex-direction:column; align-items:center; gap:12px;
}
.hero-scroll::after{
  content:""; width:1px; height:48px; background:rgba(255,255,255,.4);
  animation:scrollCue 2.4s var(--ease) infinite;
  transform-origin:top;
}
@keyframes scrollCue{
  0%{transform:scaleY(0);opacity:0}
  30%{opacity:1}
  100%{transform:scaleY(1);opacity:0}
}

/* hero meta strip */
.hero-meta{
  position:absolute; left:var(--pad); bottom:74px; z-index:3;
  display:flex; gap:36px; color:rgba(255,255,255,.7);
  font-size:11px; letter-spacing:.28em; text-transform:uppercase;
}
.hero-meta b{color:#fff;font-weight:400}
@media (max-width:720px){
  .hero-meta{display:none}
  .hero-scroll{display:none}
  .hero .hero-dots{ right:18px }
}

/* ===========================================================
   Section base + ornamental glyph
   =========================================================== */
section.section{ padding:clamp(80px, 11vw, 160px) 0; }
.section-head{
  display:flex; align-items:flex-end; justify-content:space-between;
  gap:48px; margin-bottom:64px; flex-wrap:wrap;
}
.section-head .lead{ max-width:38ch }

.ornament{
  display:block;
  width:54px;height:54px;
  color:var(--gold);
  opacity:.85;
}

/* ===========================================================
   Intro
   =========================================================== */
.intro{ background:var(--ivory); }
.intro-grid{
  display:grid; gap:clamp(40px, 6vw, 96px);
  grid-template-columns: 1.05fr 1fr;
  align-items:center;
}
.intro-text h2{margin:18px 0 28px}
.intro-text p{ color:var(--ink-soft); font-size:17px; max-width:52ch; margin:0 0 18px }

.intro-stats{
  margin-top:48px;
  display:grid; grid-template-columns:repeat(3,1fr); gap:18px;
  padding-top:36px; border-top:1px solid var(--line);
}
.intro-stats div .k{
  font-family:"Cormorant Garamond",serif;
  font-size:clamp(38px, 4vw, 56px); color:var(--gold-deep);
  line-height:1; display:block;
}
.intro-stats div .v{
  font-size:11px; letter-spacing:.2em; text-transform:uppercase;
  color:var(--ink-soft); margin-top:8px; display:block;
}

.intro-media{
  position:relative; aspect-ratio: 4/5;
  border-radius:var(--r-lg); overflow:hidden;
  box-shadow:var(--shadow-md);
}
.intro-media img{ width:100%; height:100%; object-fit:cover; transition:transform 1.4s var(--ease) }
.intro-media:hover img{transform:scale(1.04)}
.intro-media-2{
  position:absolute; right:-8%; bottom:-10%;
  width:55%; aspect-ratio:1;
  border-radius:var(--r-md); overflow:hidden;
  box-shadow:var(--shadow-md);
  border:6px solid var(--ivory);
}
.intro-media-2 img{width:100%;height:100%;object-fit:cover}

@media (max-width:880px){
  .intro-grid{grid-template-columns:1fr}
  .intro-media-2{right:-4%; width:48%}
}

/* ===========================================================
   Suites
   =========================================================== */
.suites{ background:var(--white); }
.suites .section-head h2{margin-top:14px}

.suite-row{
  display:grid; grid-template-columns: 1.15fr 1fr;
  gap:clamp(40px, 6vw, 90px); align-items:center;
  padding-block: clamp(50px, 7vw, 100px);
  border-top:1px solid var(--line);
}
.suite-row:first-of-type{border-top:0}
.suite-row.flip{ grid-template-columns: 1fr 1.15fr }
.suite-row.flip .suite-media{ order:2 }
.suite-row.flip .suite-text{ order:1 }

.suite-text .num{
  font-family:"Cormorant Garamond",serif;
  color:var(--gold);
  font-size:14px;letter-spacing:.32em;
  display:inline-flex;gap:14px;align-items:center;
  text-transform:uppercase;
}
.suite-text .num::before{content:"";width:34px;height:1px;background:var(--gold)}
.suite-text h3{ margin:14px 0 8px }
.suite-text .tag{
  font-size:13px; letter-spacing:.22em; text-transform:uppercase;
  color:var(--gold-deep); font-weight:400; margin-bottom:24px;
}
.suite-text p{ color:var(--ink-soft); font-size:17px; max-width:48ch; }

.suite-facts{
  display:flex; gap:32px; margin:36px 0;
  padding-block:22px; border-top:1px solid var(--line); border-bottom:1px solid var(--line);
}
.suite-facts div .k{
  font-family:"Cormorant Garamond",serif;
  font-size:32px; color:var(--ink); line-height:1; display:block;
}
.suite-facts div .v{
  font-size:10px; letter-spacing:.24em; text-transform:uppercase;
  color:var(--ink-soft); margin-top:6px; display:block;
}

.suite-cta{
  display:inline-flex; align-items:center; gap:12px;
  color:var(--gold-deep); font-size:12px;
  letter-spacing:.28em; text-transform:uppercase; font-weight:500;
  padding-bottom:8px; border-bottom:1px solid var(--gold);
  transition:.3s var(--ease);
}
.suite-cta:hover{ gap:22px; color:var(--ink) }
.suite-cta svg{width:14px;height:14px}

/* suite slider */
.suite-media{
  position:relative;
  border-radius:var(--r-lg); overflow:hidden;
  aspect-ratio: 4/3.2;
  box-shadow: 0 40px 80px -40px rgba(42,37,32,.35);
}
.suite-slider, .suite-slider .slick-list, .suite-slider .slick-track{ height:100% }
.suite-slider .slide{ height:100%; position:relative }
.suite-slider .slide img{
  width:100%; height:100%; object-fit:cover;
  transition:transform 6s var(--ease);
}
.suite-slider .slick-current .slide img{ transform:scale(1.06) }

/* suite slider — arrows */
.suite-media .arrow{
  position:absolute; top:50%; transform:translateY(-50%);
  width:46px; height:46px; border-radius:50%;
  background:rgba(255,255,255,.86);
  backdrop-filter:blur(8px);
  display:flex; align-items:center; justify-content:center;
  color:var(--ink); cursor:pointer;
  z-index:4; transition:.3s var(--ease);
  border:0;
}
.suite-media .arrow:hover{ background:#fff; transform:translateY(-50%) scale(1.08) }
.suite-media .arrow.prev{ left:18px }
.suite-media .arrow.next{ right:18px }
.suite-media .arrow svg{ width:14px;height:14px }

.suite-media .counter{
  position:absolute; left:24px; bottom:22px; z-index:4;
  font-family:"Cormorant Garamond",serif;
  color:#fff; font-size:18px; letter-spacing:.1em;
  background:rgba(20,18,15,.45);
  backdrop-filter:blur(10px);
  padding:6px 16px; border-radius:999px;
}
.suite-media .label{
  position:absolute; right:24px; bottom:22px; z-index:4;
  font-size:10px; letter-spacing:.34em; text-transform:uppercase;
  color:#fff;
}

@media (max-width:900px){
  .suite-row,
  .suite-row.flip{ grid-template-columns:1fr }
  .suite-row.flip .suite-media{ order:0 }
  .suite-row.flip .suite-text{ order:0 }
  .suite-facts{gap:18px}
  .suite-facts div .k{font-size:24px}
}

/* ===========================================================
   Ortigia — parallax
   =========================================================== */
.ortigia{
  background:var(--ink); color:#fff;
  overflow:hidden;
  position:relative;
}
.ortigia .parallax{
  position:absolute; inset:-15% 0 -15% 0;
  background-image:url("../img/esterni/ext-2.jpg");
  background-size:cover; background-position:center;
  opacity:.45; will-change:transform;
}
.ortigia::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(20,18,15,.3) 0%, rgba(20,18,15,.7) 100%);
}
.ortigia .shell{ position:relative; z-index:2 }
.ortigia .eyebrow{ color:var(--gold-soft) }
.ortigia .eyebrow::before{ background:var(--gold-soft) }
.ortigia h2{ color:#fff; margin:18px 0 28px; max-width:14ch }
.ortigia-body{ color:rgba(255,255,255,.78); max-width:54ch; font-size:18px }
.ortigia-points{
  margin-top:64px; display:grid;
  grid-template-columns:repeat(4,1fr); gap:18px;
  padding-top:38px; border-top:1px solid rgba(255,255,255,.18);
}
.ortigia-points div{ position:relative }
.ortigia-points .k{
  font-family:"Cormorant Garamond",serif; font-size:64px; color:var(--gold-soft);
  line-height:1; display:flex; align-items:baseline; gap:6px;
}
.ortigia-points .k::after{
  content:"min"; font-family:"Jost",sans-serif; font-size:11px;
  letter-spacing:.24em; text-transform:uppercase; color:rgba(255,255,255,.5);
  font-weight:300;
}
.ortigia-points .v{
  font-size:13px; letter-spacing:.2em; text-transform:uppercase;
  color:rgba(255,255,255,.85); margin-top:8px; display:block;
}
@media (max-width:760px){
  .ortigia-points{grid-template-columns:repeat(2,1fr)}
  .ortigia-points .k{font-size:48px}
}

/* ===========================================================
   Experiences
   =========================================================== */
.experiences{ background:var(--ivory); }
.exp-grid{
  display:grid; grid-template-columns:repeat(4,1fr);
  gap:clamp(18px, 2vw, 32px); margin-top:48px;
}
.exp-card{
  background:#fff; border-radius:var(--r-md);
  padding:36px 28px 32px;
  border:1px solid var(--line);
  transition:.4s var(--ease);
  display:flex; flex-direction:column; gap:14px;
  min-height:260px;
}
.exp-card:hover{ transform:translateY(-6px); box-shadow:var(--shadow-md); border-color:var(--gold-soft); }
.exp-card .ico{
  width:54px;height:54px;border-radius:50%;
  background:var(--ivory-2);
  display:flex;align-items:center;justify-content:center;
  color:var(--gold-deep); margin-bottom:8px;
  transition:.4s var(--ease);
}
.exp-card:hover .ico{ background:var(--gold); color:#fff }
.exp-card .ico svg{width:24px;height:24px}
.exp-card h4{
  font-family:"Cormorant Garamond",serif; font-weight:400;
  font-size:26px; margin:0; color:var(--ink);
}
.exp-card p{ margin:0; color:var(--ink-soft); font-size:15px; line-height:1.6 }
@media (max-width:980px){ .exp-grid{grid-template-columns:repeat(2,1fr)} }
@media (max-width:520px){ .exp-grid{grid-template-columns:1fr} }

/* ===========================================================
   Contact
   =========================================================== */
.contact{ background:#fff; }
.contact-grid{
  display:grid; grid-template-columns: 1fr 1.2fr;
  gap:clamp(48px, 8vw, 110px); align-items:center;
}
.contact-text h2{ margin:14px 0 22px }
.contact-text h2.display{ font-size:clamp(30px, 3.4vw, 54px); line-height:1.1 }
.contact-text p{ color:var(--ink-soft); font-size:17px; max-width:42ch }
.contact-cards{
  margin-top:42px; display:flex; flex-direction:column; gap:18px;
}
.contact-card{
  display:flex; gap:18px; align-items:center;
  padding:22px 24px; border:1px solid var(--line);
  border-radius:var(--r-md); transition:.3s var(--ease);
}
.contact-card:hover{ background:var(--ivory); border-color:var(--gold-soft) }
.contact-card .ico{
  width:42px;height:42px;border-radius:50%;
  background:var(--ivory); color:var(--gold-deep);
  display:flex;align-items:center;justify-content:center;
}
.contact-card .ico svg{width:18px;height:18px}
.contact-card .k{font-size:11px;letter-spacing:.24em;text-transform:uppercase;color:var(--ink-soft)}
.contact-card .v{font-family:"Cormorant Garamond",serif;font-size:22px;color:var(--ink);margin-top:2px}

/* form */
form.book{
  background:var(--ivory); border-radius:var(--r-lg);
  padding:clamp(28px, 4vw, 48px); display:grid;
  grid-template-columns:1fr 1fr; gap:18px;
}
form.book label{ display:flex; flex-direction:column; gap:8px; }
form.book .full{ grid-column:1/-1 }
form.book span.lbl{
  font-size:11px; letter-spacing:.24em; text-transform:uppercase;
  color:var(--ink-soft);
}
form.book input,
form.book select,
form.book textarea{
  background:#fff; border:1px solid var(--line);
  padding:14px 16px; border-radius:var(--r-sm);
  font:inherit; color:var(--ink);
  transition:.25s var(--ease);
}
form.book textarea{min-height:120px;resize:vertical;font-family:inherit}
form.book input:focus,
form.book select:focus,
form.book textarea:focus{
  outline:0; border-color:var(--gold); background:#fff;
  box-shadow:0 0 0 4px rgba(156,137,101,.12);
}
form.book .captcha-wrap{
  grid-column:1/-1;
  display:flex; justify-content:flex-start;
  margin-top:6px;
}
form.book .captcha-wrap .g-recaptcha{ transform-origin:0 0; }
@media (max-width:380px){
  form.book .captcha-wrap .g-recaptcha{ transform:scale(.88); }
}
form.book button[type="submit"]{
  grid-column:1/-1;
  background:var(--ink); color:#fff;
  padding:18px 28px; border-radius:999px;
  font-size:12px; letter-spacing:.28em; text-transform:uppercase;
  font-weight:500; transition:.35s var(--ease);
  margin-top:8px;
}
form.book button[type="submit"]:hover{ background:var(--gold); transform:translateY(-2px) }

/* Flatpickr alt-input override — keep visual parity with .book inputs */
form.book input.flatpickr-alt-input,
form.book input.form-control.input{
  background:#fff; border:1px solid var(--line);
  padding:14px 16px; border-radius:var(--r-sm);
  font:inherit; color:var(--ink); width:100%;
  transition:.25s var(--ease); cursor:pointer;
}
form.book input.flatpickr-alt-input:focus,
form.book input.form-control.input:focus{
  outline:0; border-color:var(--gold);
  box-shadow:0 0 0 4px rgba(156,137,101,.12);
}
.flatpickr-calendar.animate{ font-family:'Jost', system-ui, sans-serif; }
.flatpickr-calendar .flatpickr-day.selected,
.flatpickr-calendar .flatpickr-day.startRange,
.flatpickr-calendar .flatpickr-day.endRange{
  background:var(--gold); border-color:var(--gold);
}
.flatpickr-calendar .flatpickr-day.today{ border-color:var(--gold) }

@media (max-width:880px){
  .contact-grid{grid-template-columns:1fr}
  form.book{grid-template-columns:1fr}
}

/* ===========================================================
   Footer
   =========================================================== */
.footer{
  background:var(--ink); color:rgba(255,255,255,.65);
  padding:clamp(64px, 8vw, 120px) 0 0;
}
.footer-grid{
  display:grid; grid-template-columns: 1.3fr 1fr 1fr 1fr 1fr;
  gap:40px; padding-bottom:64px;
}
.footer-brand .logo-wrap{
  display:inline-block;
  background:#fff;
  padding:14px 22px;
  border-radius:18px;
  transition:.3s var(--ease);
}
.footer-brand .logo-wrap:hover{ transform:translateY(-2px) }
.footer-brand .logo-wrap img{
  filter:none;
  height:46px; width:auto; display:block;
}
.footer-brand p{ margin-top:22px; font-size:14px; max-width:34ch; line-height:1.6 }
.footer h5{
  font-size:11px; letter-spacing:.28em; text-transform:uppercase;
  color:#fff; margin:0 0 22px; font-weight:500;
}
.footer ul{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:12px}
.footer ul a,
.footer ul button{
  font-size:14px; color:rgba(255,255,255,.65);
  transition:color .3s; text-align:left;
}
.footer ul a:hover,
.footer ul button:hover{color:var(--gold-soft)}

.socials{display:flex;gap:12px;margin-top:6px}
.socials a{
  width:42px;height:42px;border-radius:50%;
  background:rgba(255,255,255,.06);
  display:flex;align-items:center;justify-content:center;
  color:#fff; transition:.3s var(--ease);
  border:1px solid rgba(255,255,255,.1);
}
.socials a:hover{ background:var(--gold); color:#fff; border-color:var(--gold); transform:translateY(-2px) }
.socials a svg{width:18px;height:18px}

.footer-bottom{
  border-top:1px solid rgba(255,255,255,.1);
  padding:26px 0; font-size:12px;
  display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:14px;
}
.footer-bottom .footer-mark{font-family:"Cormorant Garamond",serif;color:var(--gold-soft);font-size:18px}
.footer-credit{
  font-size:11px; letter-spacing:.18em; text-transform:uppercase;
  color:rgba(255,255,255,.4); transition:color .3s;
}
.footer-credit a{
  color:var(--gold-soft); border-bottom:1px solid rgba(201,184,150,.3);
  padding-bottom:2px; margin-left:6px; transition:.3s var(--ease);
}
.footer-credit a:hover{ color:#fff; border-bottom-color:#fff }

@media (max-width:1080px){
  .footer-grid{grid-template-columns: 1.4fr 1fr 1fr 1fr; gap:36px}
  .footer-grid > div:nth-child(5){ grid-column: 2 / 5 }
  .footer-grid > div:nth-child(5) ul{ flex-direction:row; flex-wrap:wrap; gap:16px 22px }
}
@media (max-width:880px){
  .footer-grid{grid-template-columns:1fr 1fr; gap:36px}
  .footer-grid > div:nth-child(5){ grid-column: 1 / 3 }
}
@media (max-width:520px){
  .footer-grid{grid-template-columns:1fr}
  .footer-grid > div:nth-child(5){ grid-column: 1 / 2 }
  .footer-grid > div:nth-child(5) ul{ flex-direction:column }
  .footer-bottom{flex-direction:column;align-items:flex-start;gap:18px}
}

/* ===========================================================
   Cookie banner
   =========================================================== */
.cookie-banner{
  position:fixed; left:20px; right:auto; bottom:20px;
  width:min(360px, calc(100vw - 40px));
  z-index:1000;
  background:var(--ink); color:#fff;
  border-radius:var(--r-md);
  padding:16px 18px;
  display:flex; flex-direction:column; gap:12px;
  box-shadow:0 30px 80px -20px rgba(0,0,0,.5);
  border:1px solid rgba(255,255,255,.08);
  transform:translateY(140%); transition:transform .55s var(--ease);
}
.cookie-banner.is-open{transform:translateY(0)}
.cookie-banner p{margin:0;font-size:12.5px;color:rgba(255,255,255,.75);line-height:1.5}
.cookie-banner .actions{display:flex;gap:8px;flex-wrap:wrap;width:100%}
.cookie-banner button{
  font-size:10px; letter-spacing:.2em; text-transform:uppercase;
  padding:9px 14px; border-radius:999px; font-weight:500;
  transition:.3s var(--ease);
}
.cookie-banner .accept{ background:var(--gold); color:#fff }
.cookie-banner .accept:hover{ background:var(--gold-deep) }
.cookie-banner .refuse{ background:transparent; color:rgba(255,255,255,.75); border:1px solid rgba(255,255,255,.25) }
.cookie-banner .refuse:hover{ color:#fff; border-color:#fff }
.cookie-banner .more{ background:transparent; color:var(--gold-soft); text-decoration:underline; text-underline-offset:4px }

@media (max-width:640px){
  .cookie-banner{left:12px; right:12px; width:auto; padding:14px}
  .cookie-banner .actions button{flex:1}
}

/* ===========================================================
   SweetAlert2 — custom skin
   =========================================================== */
.sio-modal-popup{
  border-radius:var(--r-lg) !important;
  padding:48px 44px !important;
  font-family:"Jost",sans-serif !important;
  max-width:640px !important;
  box-shadow:0 60px 120px -40px rgba(42,37,32,.5) !important;
}
.sio-modal-title{
  font-family:"Cormorant Garamond",serif !important;
  font-weight:400 !important;
  font-size:42px !important;
  color:var(--ink) !important;
  letter-spacing:-.01em !important;
  text-align:left !important;
  margin:0 0 8px !important;
  padding:0 !important;
}
.sio-modal-html{
  color:var(--ink-soft) !important;
  font-size:15px !important;
  line-height:1.7 !important;
  text-align:left !important;
  margin:0 !important;
  max-height:60vh; overflow:auto;
}
.sio-modal-html h4{
  font-family:"Cormorant Garamond",serif;
  font-weight:500; font-size:22px;
  color:var(--ink); margin:24px 0 6px;
  letter-spacing:-.005em;
}
.sio-modal-html p{margin:0 0 12px}
.sio-modal-html em{color:var(--gold-deep);font-style:normal;font-weight:500}
.sio-modal-confirm{
  background:var(--gold) !important;
  border-radius:999px !important;
  padding:14px 32px !important;
  font-size:12px !important;
  letter-spacing:.24em !important;
  text-transform:uppercase !important;
  font-weight:500 !important;
  box-shadow:0 12px 28px -14px rgba(156,137,101,.7) !important;
  transition:.3s var(--ease) !important;
}
.sio-modal-confirm:hover{ background:var(--gold-deep) !important }
.sio-modal-actions{ justify-content:flex-end !important; margin-top:24px !important }
.swal2-backdrop-show{background:rgba(20,18,15,.55) !important; backdrop-filter:blur(6px)}

/* ===========================================================
   AI Archimede — floating concierge
   =========================================================== */
.archimede-fab{
  position:fixed; right:24px; bottom:24px;
  z-index:900;
  width:64px; height:64px; border-radius:50%;
  background:linear-gradient(135deg, var(--gold) 0%, var(--gold-deep) 100%);
  color:#fff;
  display:flex; align-items:center; justify-content:center;
  box-shadow: 0 18px 40px -12px rgba(156,137,101,.7), 0 0 0 0 rgba(156,137,101,.5);
  cursor:pointer;
  transition:.4s var(--ease);
  animation: archi-pulse 2.6s var(--ease) infinite;
}
.archimede-fab:hover{
  transform:scale(1.08) rotate(-6deg);
  box-shadow: 0 24px 48px -14px rgba(156,137,101,.85);
}
.archimede-fab svg{ width:34px; height:34px; }
.archimede-fab .label{
  position:absolute; right:74px; top:50%; transform:translateY(-50%);
  background:var(--ink); color:#fff;
  padding:10px 16px; border-radius:999px;
  font-size:11px; letter-spacing:.24em; text-transform:uppercase;
  white-space:nowrap;
  box-shadow:0 12px 30px -10px rgba(42,37,32,.5);
  opacity:0; pointer-events:none;
  transition:.35s var(--ease);
  transform:translate(8px,-50%);
}
.archimede-fab:hover .label,
.archimede-fab.show-label .label{
  opacity:1; transform:translate(0,-50%);
}
.archimede-fab .label::after{
  content:""; position:absolute; right:-6px; top:50%; transform:translateY(-50%) rotate(45deg);
  width:10px; height:10px; background:var(--ink);
}
.archimede-fab .dot{
  position:absolute; top:6px; right:6px;
  width:14px;height:14px;border-radius:50%;
  background:#5ec97a; border:2.5px solid #fff;
}
@keyframes archi-pulse{
  0%   { box-shadow: 0 18px 40px -12px rgba(156,137,101,.7), 0 0 0 0 rgba(156,137,101,.5); }
  70%  { box-shadow: 0 18px 40px -12px rgba(156,137,101,.7), 0 0 0 18px rgba(156,137,101,0); }
  100% { box-shadow: 0 18px 40px -12px rgba(156,137,101,.7), 0 0 0 0 rgba(156,137,101,0); }
}
@media (max-width:560px){
  .archimede-fab{ width:56px;height:56px;right:18px;bottom:18px }
  .archimede-fab svg{width:28px;height:28px}
}

/* Archimede chat modal */
.archi-popup{ padding:36px 32px !important; }
.archi-html{ max-height:70vh !important; overflow:auto; }
.archi-chat{ display:flex; flex-direction:column; gap:18px; }
.archi-intro{ display:flex; gap:16px; align-items:flex-start }
.archi-avatar{
  flex:none;
  width:54px;height:54px;border-radius:50%;
  background:linear-gradient(135deg, var(--gold) 0%, var(--gold-deep) 100%);
  color:#fff; display:flex; align-items:center; justify-content:center;
  box-shadow:0 10px 24px -8px rgba(156,137,101,.6);
}
.archi-avatar svg{ width:32px; height:32px; }
.archi-intro p{
  font-size:15px; line-height:1.6; color:var(--ink); margin:6px 0 0;
  background:var(--ivory); padding:14px 16px; border-radius:18px 18px 18px 4px;
}
.archi-intro p b{ color:var(--gold-deep); font-weight:500 }

.archi-suggest{ display:flex; gap:8px; flex-wrap:wrap }
.archi-chip{
  background:#fff; border:1px solid var(--line);
  padding:9px 14px; border-radius:999px;
  font-size:13px; color:var(--ink-soft);
  transition:.25s var(--ease);
}
.archi-chip:hover{ border-color:var(--gold); color:var(--gold-deep); background:var(--ivory) }

.archi-form{
  display:flex; gap:8px; align-items:center;
  background:var(--ivory); padding:6px 6px 6px 18px; border-radius:999px;
  border:1px solid var(--line);
}
.archi-form input{
  flex:1; border:0; background:transparent; font:inherit;
  padding:12px 0; color:var(--ink); outline:0;
}
.archi-form button{
  width:42px;height:42px;border-radius:50%;
  background:var(--gold); color:#fff;
  display:flex;align-items:center;justify-content:center;
  transition:.3s var(--ease); border:0; cursor:pointer;
}
.archi-form button:hover{ background:var(--gold-deep); transform:translateX(2px) }
.archi-form button svg{width:16px;height:16px}
.archi-note{ font-size:12px; color:var(--ink-soft); text-align:center; margin-top:4px }
.archi-note em{ color:var(--gold-deep); font-style:normal; font-weight:500 }

.archi-thread{ display:flex; flex-direction:column; gap:8px }
.archi-msg{
  font-size:14px; line-height:1.6; padding:12px 16px;
  border-radius:18px; max-width:85%;
}
.archi-msg.user{
  align-self:flex-end; background:var(--gold); color:#fff;
  border-radius:18px 18px 4px 18px;
}
.archi-msg.bot{
  align-self:flex-start; background:var(--ivory); color:var(--ink);
  border-radius:18px 18px 18px 4px;
}
.archi-msg i{ color:var(--gold-deep); font-style:normal; font-weight:500 }
.archi-msg.typing{ display:flex; gap:5px; padding:18px 18px }
.archi-msg.typing span{
  width:7px;height:7px;border-radius:50%; background:var(--gold-deep);
  animation: typingDot 1.2s var(--ease) infinite;
}
.archi-msg.typing span:nth-child(2){ animation-delay:.15s }
.archi-msg.typing span:nth-child(3){ animation-delay:.3s }
@keyframes typingDot{
  0%,60%,100%{ transform:translateY(0); opacity:.4 }
  30%{ transform:translateY(-4px); opacity:1 }
}

/* ===========================================================
   Reveal on scroll
   =========================================================== */
.reveal{ opacity:0; transform:translateY(28px); transition:opacity 1s var(--ease), transform 1s var(--ease) }
.reveal.in{ opacity:1; transform:none }
.reveal.d1{transition-delay:.1s}
.reveal.d2{transition-delay:.2s}
.reveal.d3{transition-delay:.3s}
.reveal.d4{transition-delay:.4s}

/* ===========================================================
   Lock body when nav menu open
   =========================================================== */
body.nav-locked{overflow:hidden}

/* ===========================================================
   Responsive harmonization — mobile & tablet
   Breakpoints:
     <=480 mobile portrait
     481-767 mobile landscape / small tablet portrait
     768-991 tablet portrait
     992-1199 tablet landscape / small desktop
   =========================================================== */

/* Tablet landscape & smaller desktop (992-1199) */
@media (max-width: 1199px){
  :root{ --pad: clamp(20px, 4vw, 36px); }
  .megamenu-grid{ grid-template-columns:repeat(2,1fr); }
}

/* Tablet portrait (max 991) */
@media (max-width: 991px){
  section.section{ padding:clamp(56px, 9vw, 110px) 0; }
  .section.tight{ padding-block: clamp(40px,6vw,80px); }
  .hero{ min-height:560px; }
  .hero .display{ font-size:clamp(40px, 7vw, 80px); }
  .intro-grid{ grid-template-columns:1fr; gap:36px; }
  .intro-media{ max-width:560px; }
  .suite-row,
  .suite-row.flip{ grid-template-columns:1fr; gap:24px; }
  .suite-row.flip > :first-child{order:1}
  .suite-row.flip > :last-child{order:2}
  .suite-media{ aspect-ratio:4/3; }
  .contact-grid{ grid-template-columns:1fr; gap:36px; }
  .footer-grid{ grid-template-columns:1fr 1fr; gap:36px; }
  .suite-nav{ grid-template-columns:repeat(2,1fr); margin-top:48px; }
  .ortigia-points{ grid-template-columns:repeat(2,1fr); gap:24px; }
}

/* Mobile portrait (max 600) */
@media (max-width: 600px){
  section.section{ padding:clamp(44px, 11vw, 80px) 0; }
  .section.tight{ padding-block: clamp(32px,7vw,60px); }
  .hero{ height:auto; min-height:88vh; min-height:88dvh; }
  .hero-inner{ padding-bottom:80px; }
  .hero .display{ font-size:clamp(36px, 11vw, 64px); line-height:1.05; }
  .hero-sub{ font-size:15px; }
  .hero-meta{ display:none; }
  .hero-actions{ flex-direction:column; align-items:stretch; gap:12px; }
  .hero-actions .btn-ghost,
  .hero-actions .btn-book{ text-align:center; justify-content:center; width:100%; }
  .display{ letter-spacing:-.005em; }
  h1.display{ font-size:clamp(40px, 11vw, 64px); }
  h2.display{ font-size:clamp(30px, 8vw, 48px); line-height:1.1; }
  h3.display{ font-size:clamp(24px, 6vw, 36px); }
  .intro-stats{ flex-direction:column; gap:18px; align-items:flex-start; }
  .section-head{ flex-direction:column; align-items:flex-start; gap:18px; margin-bottom:36px; }
  .suite-text{ padding:0; }
  .suite-text .display{ font-size:clamp(28px,7vw,40px); }
  .suite-facts{ flex-wrap:wrap; gap:18px 28px; }
  .suite-nav{ grid-template-columns:1fr; margin-top:36px; }
  .suite-nav a{ aspect-ratio:16/10; }
  .suites-index{ grid-template-columns:1fr; }
  .exp-grid{ grid-template-columns:1fr; }
  .ortigia-points{ grid-template-columns:1fr 1fr; gap:18px; }
  .footer-grid{ grid-template-columns:1fr; gap:28px; }
  .contact-cards{ gap:10px; }
  .contact-card{ padding:14px 16px; }
  .section-map{ height:340px; }
  .map-overlay{ left:12px !important; right:12px !important; bottom:12px !important; max-width:none !important; }
}

/* Mobile landscape (low-height) */
@media (max-height: 520px) and (orientation: landscape){
  .hero{ height:auto; min-height:100vh; }
  .hero-inner{ padding:90px 0 40px; }
  .hero .display{ font-size:clamp(28px, 5.5vw, 48px); }
  .hero-meta{ bottom:14px; }
  .hero-scroll{ display:none; }
}

/* Tablet landscape orientation tweaks */
@media (min-width: 768px) and (max-width: 1199px) and (orientation: landscape){
  .hero{ min-height:600px; }
  .megamenu-grid{ grid-template-columns:repeat(4,1fr); }
}

/* ===========================================================
   Gallery — masonry + filters + lightbox
   =========================================================== */
.gallery-filters{
  display:flex; flex-wrap:wrap; gap:8px; margin-left:auto;
}
.gallery-filters .gf-btn{
  font-size:11px; letter-spacing:.22em; text-transform:uppercase;
  padding:10px 18px; border-radius:999px;
  background:transparent; color:var(--ink-soft);
  border:1px solid var(--line); cursor:pointer;
  transition:.25s var(--ease);
}
.gallery-filters .gf-btn:hover{ color:var(--ink); border-color:var(--gold-soft); }
.gallery-filters .gf-btn.is-active{
  background:var(--ink); color:#fff; border-color:var(--ink);
}

.gallery-masonry{
  width:100%;
  /* Isotope sets positions absolutely; provide base height for initial layout */
  min-height:200px;
}
.gallery-masonry .g-item{
  display:block; position:relative; overflow:hidden;
  border-radius:var(--r-md);
  width:calc(33.333% - 8px);
  margin-bottom:12px;
  background:var(--ivory);
  cursor:zoom-in;
}
.gallery-masonry .g-item img{
  display:block; width:100%; height:auto;
  transition:transform .9s var(--ease), filter .5s var(--ease);
}
.gallery-masonry .g-item:hover img{ transform:scale(1.04); filter:brightness(.86); }
.gallery-masonry .g-item::after{
  content:""; position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(180deg, rgba(20,18,15,0) 60%, rgba(20,18,15,.18) 100%);
  opacity:0; transition:opacity .35s var(--ease);
}
.gallery-masonry .g-item:hover::after{ opacity:1; }

@media (max-width:880px){
  .gallery-filters{ margin-left:0; }
  .gallery-masonry .g-item{ width:calc(50% - 6px); }
}
@media (max-width:520px){
  .gallery-masonry .g-item{ width:100%; margin-bottom:10px; }
}

/* Load more button */
.gallery-loadmore-wrap{
  display:flex; justify-content:center; margin-top:32px;
}
.gallery-loadmore{
  font-size:11px; letter-spacing:.28em; text-transform:uppercase;
  padding:16px 32px; border-radius:999px;
  background:transparent; color:var(--ink);
  border:1px solid var(--ink); cursor:pointer;
  transition:.3s var(--ease); font-weight:500;
  display:inline-flex; align-items:center; gap:10px;
}
.gallery-loadmore:hover{ background:var(--ink); color:#fff; transform:translateY(-2px); }
.gallery-loadmore::after{
  content:""; width:14px; height:14px; border-radius:50%;
  border:1.5px solid currentColor; border-top-color:transparent;
  opacity:0; transition:opacity .2s var(--ease);
}
.gallery-loadmore.is-loading{ pointer-events:none; opacity:.7; }
.gallery-loadmore.is-loading::after{ opacity:1; animation:siospin .7s linear infinite; }
@keyframes siospin{ to{transform:rotate(360deg)} }

/* GLightbox brand polish */
.glightbox-clean .gslide-description{ background:rgba(20,18,15,.92); }
.glightbox-clean .gslide-title{
  font-family:'Cormorant Garamond', serif; color:var(--gold-soft);
  font-weight:400; letter-spacing:.04em;
}
.glightbox-button-prev,
.glightbox-button-next,
.glightbox-close{ filter:none; }

/* Suite-nav 3-col gracefully */
@media (max-width: 880px){
  .suite-nav{ grid-template-columns:repeat(2,1fr); }
}
@media (max-width: 600px){
  .suite-nav{ grid-template-columns:1fr; }
}

/* Topbar hidden on smaller screens */
@media (max-width: 720px){
  .topbar{ display:none; }
}

/* ===== Booking bar (home) ===== */
.bookbar-wrap{
  position:relative; z-index:5; margin-top:-84px;
}
/* On home, hide the hero's decorative meta/scroll so the bar can float fully
   over the hero image without colliding. */
body[data-page="home"] .hero-meta,
body[data-page="home"] .hero-scroll{ display:none; }
/* Frosted glass — transparent & outlined, floating over the hero image.
   Dark tint + light text stays readable over both bright and dark hero slides. */
.bookbar{
  background:rgba(18,15,12,.34);
  backdrop-filter:blur(16px) saturate(1.2);
  -webkit-backdrop-filter:blur(16px) saturate(1.2);
  border:1px solid rgba(255,255,255,.45);
  box-shadow:0 30px 70px -34px rgba(0,0,0,.55);
  border-radius:3px; padding:22px 26px;
  display:flex; align-items:flex-end; gap:26px;
  flex-wrap:wrap;
  transition:border-color .3s var(--ease);
}
.bookbar:focus-within{ border-color:rgba(255,255,255,.72); }
.bookbar .bb-eyebrow{ display:flex; flex-direction:column; gap:5px; min-width:168px; }
.bookbar .bb-eyebrow .eyebrow{ font-size:11px; letter-spacing:.24em; color:var(--gold-soft); text-transform:uppercase; }
.bookbar .bb-eyebrow .eyebrow::before{ background:var(--gold-soft); }
.bookbar .bb-eyebrow .bb-title{ font-family:'Cormorant Garamond',serif; font-size:23px; color:#fff; line-height:1.1; }
.bookbar .bb-fields{
  display:flex; align-items:flex-end; gap:20px; flex:1 1 auto; flex-wrap:wrap;
}
.bookbar .bb-field{
  display:flex; flex-direction:column; gap:7px; min-width:150px; flex:1 1 150px;
}
.bookbar .bb-field.bb-guests{ min-width:86px; flex:0 0 86px; }
.bookbar .bb-field.bb-daterange{ flex:2 1 260px; min-width:230px; }
.bookbar .bb-field .lbl{
  font-size:10px; letter-spacing:.22em; text-transform:uppercase; color:rgba(255,255,255,.72);
}
.bookbar .bb-field input{
  border:none; border-bottom:1px solid rgba(255,255,255,.35);
  padding:9px 2px; font-family:inherit; font-size:15px;
  background:transparent; color:#fff; outline:none;
  transition:border-color .2s var(--ease);
}
.bookbar .bb-field input::placeholder{ color:rgba(255,255,255,.6); opacity:1; }
.bookbar .bb-field input:focus{ border-bottom-color:var(--gold-soft); }
/* CTA: white outline that fills on hover. */
.bookbar .bb-cta{
  border:1px solid rgba(255,255,255,.7); background:transparent; color:#fff;
  padding:13px 28px; font-family:inherit; font-size:12px;
  letter-spacing:.22em; text-transform:uppercase; cursor:pointer;
  border-radius:2px; transition:background .25s var(--ease), color .25s var(--ease);
  align-self:stretch;
}
.bookbar .bb-cta:hover{ background:#fff; color:var(--ink); }

/* On non-home pages the bar sits over the light page background (the suite
   page-hero is short), so the dark-glass light-text treatment is unreadable.
   Switch to a clean light card with dark text there; home keeps the glass. */
body:not([data-page="home"]) .bookbar{
  background:#fff;
  backdrop-filter:none; -webkit-backdrop-filter:none;
  border:1px solid rgba(20,18,15,.10);
  box-shadow:var(--shadow-md);
}
body:not([data-page="home"]) .bookbar:focus-within{ border-color:var(--line); }
body:not([data-page="home"]) .bookbar .bb-eyebrow .eyebrow{ color:var(--gold-deep); }
body:not([data-page="home"]) .bookbar .bb-eyebrow .eyebrow::before{ background:var(--gold-deep); }
body:not([data-page="home"]) .bookbar .bb-eyebrow .bb-title{ color:var(--ink); }
body:not([data-page="home"]) .bookbar .bb-field .lbl{ color:var(--ink-soft); }
body:not([data-page="home"]) .bookbar .bb-field input{ color:var(--ink); border-bottom-color:rgba(20,18,15,.18); }
body:not([data-page="home"]) .bookbar .bb-field input::placeholder{ color:var(--ink-soft); }
body:not([data-page="home"]) .bookbar .bb-cta{ border-color:var(--ink); color:var(--ink); }
body:not([data-page="home"]) .bookbar .bb-cta:hover{ background:var(--ink); color:#fff; }

/* ---- Inline live availability results ---- */
.bookbar-results{
  margin-top:16px;
  background:var(--white);
  border:1px solid rgba(20,18,15,.10);
  box-shadow:var(--shadow-sm);
  border-radius:3px; padding:18px 22px;
  animation:bbrIn .4s var(--ease);
}
.bookbar-results[hidden]{ display:none; }
@keyframes bbrIn{ from{ opacity:0; transform:translateY(-6px); } to{ opacity:1; transform:none; } }
.bbr-summary{ font-size:11px; letter-spacing:.16em; text-transform:uppercase; color:var(--ink-soft); margin-bottom:14px; }
.bbr-suites{ display:flex; flex-wrap:wrap; gap:10px; }
.bbr-suite{
  display:inline-flex; align-items:center; gap:11px; text-decoration:none;
  padding:11px 18px; border:1px solid rgba(20,18,15,.12); border-radius:2px;
  transition:border-color .2s var(--ease), background .2s var(--ease);
}
.bbr-suite:hover{ border-color:rgba(156,137,101,.55); background:rgba(156,137,101,.06); }
.bbr-dot{ width:7px; height:7px; border-radius:50%; background:#4a7c4e; flex:0 0 7px; }
.bbr-suite-name{ font-family:'Cormorant Garamond',serif; font-size:18px; color:var(--ink); }
.bbr-suite-cta{ font-size:10px; letter-spacing:.16em; text-transform:uppercase; color:var(--gold-deep); }
.bbr-none{ display:flex; align-items:baseline; gap:16px; flex-wrap:wrap; }
.bbr-none-title{ font-family:'Cormorant Garamond',serif; font-size:20px; color:var(--ink); }
.bbr-write{ font-size:11px; letter-spacing:.14em; text-transform:uppercase; color:var(--gold-deep); text-decoration:none; border-bottom:1px solid currentColor; padding-bottom:2px; }
/* First-availability suggestion (shown when the chosen dates are full). */
.bbr-firstavail{
  display:flex; align-items:center; gap:16px; flex-wrap:wrap;
  margin-top:14px; padding:14px 18px;
  background:rgba(156,137,101,.08); border:1px solid rgba(156,137,101,.32);
  border-radius:3px; text-decoration:none;
  transition:background .2s var(--ease);
}
.bbr-firstavail:hover{ background:rgba(156,137,101,.15); }
.bbr-fa-label{ font-size:10px; letter-spacing:.18em; text-transform:uppercase; color:var(--gold-deep); font-weight:500; }
.bbr-fa-body{ display:flex; flex-direction:column; gap:2px; flex:1 1 auto; }
.bbr-fa-name{ font-family:'Cormorant Garamond',serif; font-size:19px; color:var(--ink); }
.bbr-fa-dates{ font-size:12px; letter-spacing:.03em; color:var(--ink-soft); }
.bbr-fa-cta{ font-size:11px; letter-spacing:.16em; text-transform:uppercase; color:var(--gold-deep); font-weight:500; white-space:nowrap; }

/* The Place upsell — image + prominent CTA. */
.bbr-theplace{
  display:flex; align-items:stretch; margin-top:16px; overflow:hidden;
  border:1px solid rgba(20,18,15,.12); border-radius:4px;
  background:var(--ivory); text-decoration:none;
  transition:box-shadow .25s var(--ease), transform .25s var(--ease);
}
.bbr-theplace:hover{ box-shadow:var(--shadow-sm); transform:translateY(-1px); }
.bbr-tp-media{
  flex:0 0 132px; align-self:stretch; min-height:120px;
  background-size:cover; background-position:center;
}
.bbr-tp-body{
  display:flex; flex-direction:column; align-items:flex-start; gap:8px;
  padding:18px 22px; flex:1 1 auto;
}
.bbr-tp-eyebrow{ font-size:10px; letter-spacing:.2em; text-transform:uppercase; color:var(--gold-deep); }
.bbr-tp-badge{ font-size:10px; letter-spacing:.14em; text-transform:uppercase; color:#4a7c4e; }
.bbr-tp-text{ font-family:'Cormorant Garamond',serif; font-size:21px; line-height:1.15; color:var(--ink); }
.bbr-tp-cta{
  margin-top:2px; display:inline-flex; align-items:center; gap:8px;
  background:var(--ink); color:#fff; padding:11px 22px; border-radius:2px;
  font-size:11px; letter-spacing:.2em; text-transform:uppercase;
  transition:background .25s var(--ease);
}
.bbr-theplace:hover .bbr-tp-cta{ background:var(--gold-deep); }

/* Flatpickr calendar — align to the site palette (gold/ink) instead of the
   default blue. High specificity (.flatpickr-calendar prefix) so these win over
   the CDN stylesheet, which loads after site.css. */
.flatpickr-calendar .flatpickr-day.selected,
.flatpickr-calendar .flatpickr-day.startRange,
.flatpickr-calendar .flatpickr-day.endRange,
.flatpickr-calendar .flatpickr-day.selected:hover,
.flatpickr-calendar .flatpickr-day.startRange:hover,
.flatpickr-calendar .flatpickr-day.endRange:hover,
.flatpickr-calendar .flatpickr-day.selected:focus,
.flatpickr-calendar .flatpickr-day.startRange:focus,
.flatpickr-calendar .flatpickr-day.endRange:focus{
  background:var(--gold-deep); border-color:var(--gold-deep); color:#fff;
}
.flatpickr-calendar .flatpickr-day.inRange{
  background:rgba(156,137,101,.15); border-color:rgba(156,137,101,.15);
  box-shadow:-5px 0 0 rgba(156,137,101,.15), 5px 0 0 rgba(156,137,101,.15);
}
.flatpickr-calendar .flatpickr-day:hover,
.flatpickr-calendar .flatpickr-day.prevMonthDay:hover,
.flatpickr-calendar .flatpickr-day.nextMonthDay:hover{
  background:var(--ivory-2); border-color:var(--ivory-2); color:var(--ink);
}
.flatpickr-calendar .flatpickr-day.today{ border-color:var(--gold); }
.flatpickr-calendar .flatpickr-day.today:hover{ background:var(--gold); border-color:var(--gold); color:#fff; }
.flatpickr-calendar .flatpickr-weekday{ color:var(--gold-deep); font-weight:500; }
.flatpickr-calendar .flatpickr-current-month,
.flatpickr-calendar .flatpickr-monthDropdown-months,
.flatpickr-calendar .numInputWrapper{ color:var(--ink); }
.flatpickr-calendar .flatpickr-months .flatpickr-prev-month:hover svg,
.flatpickr-calendar .flatpickr-months .flatpickr-next-month:hover svg{ fill:var(--gold-deep); }

@media (max-width:760px){
  .bookbar-wrap{ margin-top:-40px; }
  .bookbar{ padding:18px; gap:16px; }
  .bookbar .bb-eyebrow{ min-width:auto; }
  .bookbar .bb-fields{ gap:14px; }
  .bookbar .bb-field, .bookbar .bb-field.bb-guests{ min-width:calc(50% - 7px); flex:1 1 calc(50% - 7px); }
  .bookbar .bb-cta{ flex:1 1 100%; padding:14px; }
  .bookbar .bb-field.bb-daterange{ flex:1 1 100%; min-width:100%; }
  .bookbar-results{ padding:16px; }
  .bbr-theplace{ flex-direction:column; }
  .bbr-tp-media{ flex-basis:150px; width:100%; }
}

/* ===== Booking modal ===== */
.sio-bm-popup{
  border-radius:6px !important;
  overflow:hidden !important;
  background:#fff !important;
}
.sio-bm{ text-align:left; font-family:inherit; }
.sio-bm-head{
  padding:32px 40px 8px; border-bottom:1px solid rgba(20,18,15,.06);
}
.sio-bm-head .eyebrow{
  font-size:11px; letter-spacing:.22em; text-transform:uppercase; color:var(--gold-deep);
}
.sio-bm-head h3{
  font-family:'Cormorant Garamond',serif; font-size:32px;
  color:var(--ink); margin:6px 0 8px; font-weight:400;
}
.sio-bm-head p{ color:var(--ink-soft); font-size:14px; line-height:1.5; margin:0 0 24px; }

.sio-bm-form{
  display:grid; grid-template-columns:1fr 1fr 100px auto; gap:16px;
  align-items:end; padding:24px 40px 32px;
}
.sio-bm-form[hidden], .sio-bm-results[hidden], .sio-bm-err[hidden]{ display:none !important; }
.sio-bm-form label{ display:flex; flex-direction:column; gap:6px; }
.sio-bm-form .lbl{
  font-size:10px; letter-spacing:.22em; text-transform:uppercase; color:var(--ink-soft);
}
.sio-bm-form input{
  border:none; border-bottom:1px solid rgba(20,18,15,.16);
  padding:8px 2px; font-family:inherit; font-size:15px;
  background:transparent; color:var(--ink); outline:none;
}
.sio-bm-form input:focus{ border-bottom-color:var(--gold-deep); }
.sio-bm-cta{
  border:none; background:var(--ink); color:#fff;
  padding:14px 22px; font-family:inherit; font-size:12px;
  letter-spacing:.22em; text-transform:uppercase; cursor:pointer; border-radius:2px;
  transition:background .25s var(--ease);
}
.sio-bm-cta:hover{ background:var(--gold-deep); }
.sio-bm-err{
  grid-column:1/-1; color:#a5432c; font-size:13px; padding-top:4px;
}

.sio-bm-results{ padding:24px 40px 32px; }
.sio-bm-summary{
  font-size:13px; color:var(--ink-soft);
  padding:14px 18px; background:var(--ivory);
  border-radius:4px; margin-bottom:24px;
  letter-spacing:.02em;
}
.sio-bm-suites{
  display:grid; grid-template-columns:repeat(auto-fill,minmax(220px,1fr));
  gap:16px;
}
.sio-bm-suite{
  border:1px solid rgba(20,18,15,.08); border-radius:4px;
  overflow:hidden; text-decoration:none; color:inherit;
  display:flex; flex-direction:column;
  transition:transform .25s var(--ease), box-shadow .25s var(--ease), border-color .25s var(--ease);
}
.sio-bm-suite:hover{
  transform:translateY(-2px);
  box-shadow:0 18px 40px -18px rgba(20,18,15,.22);
  border-color:var(--gold-soft);
}
.sio-bm-suite .sm-img{
  aspect-ratio:16/10; background-size:cover; background-position:center;
}
.sio-bm-suite .sm-info{ padding:14px 16px; display:flex; flex-direction:column; gap:6px; }
.sio-bm-suite h5{
  font-family:'Cormorant Garamond',serif; font-size:20px; color:var(--ink);
  margin:0; font-weight:400;
}
.sio-bm-suite .sm-tag{
  font-size:10px; letter-spacing:.22em; text-transform:uppercase; color:var(--gold-deep);
}
.sio-bm-suite .sm-cta{
  display:inline-flex; align-items:center; gap:6px; margin-top:8px;
  font-size:11px; letter-spacing:.22em; text-transform:uppercase; color:var(--ink);
}
.sio-bm-suite .sm-cta svg{ width:14px; height:14px; }

.sio-bm-none{
  padding:32px; text-align:center; background:var(--ivory); border-radius:4px;
}
.sio-bm-none h4{
  font-family:'Cormorant Garamond',serif; font-size:24px;
  color:var(--ink); margin:0 0 8px; font-weight:400;
}
.sio-bm-none p{ color:var(--ink-soft); font-size:14px; margin:0 0 20px; }
.sio-bm-write{
  display:inline-block; padding:12px 22px; background:var(--ink); color:#fff;
  font-size:11px; letter-spacing:.22em; text-transform:uppercase;
  text-decoration:none; border-radius:2px;
  transition:background .25s var(--ease);
}
.sio-bm-write:hover{ background:var(--gold-deep); }

.sio-bm-theplace{
  margin-top:28px; display:grid; grid-template-columns:1.2fr 1fr; gap:0;
  border:1px solid var(--gold-soft); border-radius:4px; overflow:hidden;
  background:linear-gradient(180deg, #fbf8f2 0%, #f2eadb 100%);
}
.sio-bm-theplace .tp-body{ padding:24px 26px; display:flex; flex-direction:column; justify-content:center; gap:8px; }
.sio-bm-theplace .tp-body .eyebrow{
  font-size:10px; letter-spacing:.22em; text-transform:uppercase; color:var(--gold-deep);
}
.sio-bm-theplace .tp-badge{
  align-self:flex-start; margin-top:4px;
  font-size:10px; letter-spacing:.14em; text-transform:uppercase;
  color:#3c6e47; background:rgba(60,110,71,.1);
  padding:4px 10px; border-radius:999px;
}
.sio-bm-theplace .tp-badge[hidden]{ display:none; }
.sio-bm-theplace .tp-body h4{
  font-family:'Cormorant Garamond',serif; font-size:24px; color:var(--ink);
  margin:0; font-weight:400; line-height:1.15;
}
.sio-bm-theplace .tp-body p{ font-size:14px; color:var(--ink-soft); margin:4px 0 12px; }
.sio-bm-theplace .tp-cta{
  display:inline-flex; align-items:center; gap:8px;
  font-size:11px; letter-spacing:.22em; text-transform:uppercase;
  color:var(--gold-deep); text-decoration:none; align-self:flex-start;
  padding-bottom:2px; border-bottom:1px solid var(--gold-deep);
  transition:gap .25s var(--ease);
}
.sio-bm-theplace .tp-cta:hover{ gap:14px; }
.sio-bm-theplace .tp-cta svg{ width:14px; height:14px; }
.sio-bm-theplace .tp-media{
  background-size:cover; background-position:center; min-height:170px;
}

.sio-bm-change{
  margin-top:20px; border:none; background:none; padding:0;
  font-family:inherit; font-size:11px; letter-spacing:.22em; text-transform:uppercase;
  color:var(--ink-soft); cursor:pointer;
  border-bottom:1px solid rgba(20,18,15,.2);
  padding-bottom:2px;
}
.sio-bm-change:hover{ color:var(--ink); border-bottom-color:var(--ink); }

@media (max-width:640px){
  .sio-bm-head, .sio-bm-form, .sio-bm-results{ padding-left:22px; padding-right:22px; }
  .sio-bm-head h3{ font-size:26px; }
  .sio-bm-form{ grid-template-columns:1fr 1fr; }
  .sio-bm-cta{ grid-column:1/-1; }
  .sio-bm-theplace{ grid-template-columns:1fr; }
  .sio-bm-theplace .tp-media{ order:-1; min-height:140px; }
}

/* ===========================================================
   Client revision 2026-11-10
   =========================================================== */

/* Hero "Scopri le suite": readable on any slide (white glass pill). */
.hero-actions .btn-ghost{
  background:rgba(255,255,255,.88); color:var(--ink);
  border-color:rgba(255,255,255,.95);
  -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px);
  box-shadow:0 14px 34px -14px rgba(0,0,0,.45);
  font-weight:500;
}
.hero-actions .btn-ghost:hover{ background:#fff; color:var(--gold-deep); }

/* Calendar: arrival day of another guest = valid check-out (same-day turnover). */
.cal-day.booked.co-ok{ pointer-events:auto; cursor:pointer; }
.cal-day.booked.co-pick{
  text-decoration:none; color:var(--ink);
  background:linear-gradient(135deg, rgba(156,137,101,.28) 50%, transparent 50%);
  box-shadow:inset 0 0 0 1px var(--gold);
}
.cal-day.booked.co-pick:hover{ background:var(--ivory); }

/* Map: Talete parking pin. */
.section-map .sio-pin-p{ background:none !important; border:0 !important; }
.section-map .sio-pin-p span{
  display:grid; place-items:center; width:30px; height:30px; border-radius:8px;
  background:#2f5d8a; color:#fff; font:600 15px/1 'Jost',system-ui,sans-serif;
  box-shadow:0 6px 14px rgba(42,37,32,.35); border:2px solid #fff;
}
.section-map .leaflet-popup-content a{ color:var(--gold-deep); font-size:12px; letter-spacing:.06em; }

/* Map on phones: card BELOW the map instead of covering half of it. */
@media (max-width:560px){
  .section-map{ height:auto !important; background:var(--ivory); }
  .section-map .map-canvas{ position:relative !important; inset:auto; height:330px; }
  .section-map .map-overlay{
    position:relative !important; left:auto !important; right:auto !important; bottom:auto !important;
    margin:-28px 14px 0; max-width:none !important;
  }
}

/* Talete parking block (suite pages). */
.talete{ padding-block:clamp(36px,5vw,64px) !important; }
.talete-inner{
  display:flex; gap:clamp(18px,3vw,34px); align-items:flex-start;
  background:#fff; border:1px solid var(--line); border-radius:var(--r-md);
  padding:clamp(22px,3.4vw,40px); max-width:920px;
  width:calc(100% - 2 * var(--pad)); margin-inline:auto; box-sizing:border-box;
}
.talete-badge{
  flex:0 0 auto; width:56px; height:56px; border-radius:14px;
  display:grid; place-items:center; background:#2f5d8a; color:#fff;
  font:600 26px/1 'Jost',system-ui,sans-serif;
}
.talete-text{ display:flex; flex-direction:column; gap:10px; max-width:62ch; }
.talete-text h3.display{ font-size:clamp(24px,2.6vw,34px); line-height:1.15; margin:0; text-wrap:balance; }
.talete-text p{ margin:0; color:var(--ink-soft); font-size:15px; line-height:1.65; }
.talete-prices{ font-size:13.5px !important; color:var(--ink) !important; }
.talete-cta{
  align-self:flex-start; margin-top:6px; font-size:11px; letter-spacing:.22em; text-transform:uppercase;
  color:var(--gold-deep); text-decoration:none; border-bottom:1px solid var(--gold); padding-bottom:4px;
}
@media (max-width:560px){ .talete-inner{ flex-direction:column; } }

/* "Two houses" proposal for big groups (booking bar + modal). */
.combo{ display:flex; flex-direction:column; gap:10px; }
.combo-eyebrow{ font-size:10px; letter-spacing:.18em; text-transform:uppercase; color:var(--gold-deep); font-weight:500; }
.combo-title{ font-family:'Cormorant Garamond',serif; font-size:22px; color:var(--ink); line-height:1.15; }
.combo-list{ display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:10px; }
.combo-item{
  display:flex; align-items:center; gap:12px; text-decoration:none;
  padding:10px 14px 10px 10px; border:1px solid rgba(20,18,15,.12); border-radius:4px; background:#fff;
  transition:border-color .2s var(--ease), background .2s var(--ease);
}
.combo-item:hover{ border-color:rgba(156,137,101,.55); background:rgba(156,137,101,.06); }
.combo-img{ width:54px; height:54px; border-radius:3px; background-size:cover; background-position:center; flex:0 0 54px; }
.combo-body{ display:flex; flex-direction:column; gap:2px; flex:1 1 auto; min-width:0; }
.combo-name{ font-family:'Cormorant Garamond',serif; font-size:18px; color:var(--ink); }
.combo-pax{ font-size:12px; color:var(--ink-soft); }
.combo-cta{ font-size:10px; letter-spacing:.16em; text-transform:uppercase; color:var(--gold-deep); white-space:nowrap; }
.combo-note{ margin:2px 0 0; font-size:13px; color:var(--ink-soft); }
.combo-note a{ color:var(--gold-deep); }

/* Ortigia places: photo credits line. */
.places-credits{ margin-top:28px; font-size:11px; line-height:1.6; color:var(--ink-soft); opacity:.8; }
.places-credits a{ color:inherit; }
/* Talete: EasyPark app links (client request 2026-11-11). */
.talete-app{ display:flex; flex-wrap:wrap; align-items:center; gap:10px 14px; margin-top:4px; }
.talete-app img{ width:44px; height:44px; border-radius:11px; flex:0 0 44px; box-shadow:0 4px 12px -4px rgba(42,37,32,.3); }
.talete-app span{ font-size:13px; color:var(--ink); font-weight:500; }
.talete-app a{
  font-size:11px; letter-spacing:.12em; text-transform:uppercase; text-decoration:none;
  color:var(--ink); border:1px solid var(--line); border-radius:999px; padding:9px 14px;
  transition:border-color .2s var(--ease), background .2s var(--ease);
}
.talete-app a:hover{ border-color:var(--gold); background:var(--ivory); }

/* ===========================================================
   Mobile menu v2 — circular reveal, staggered type, suite cards
   (client request 2026-11-11)
   =========================================================== */
@media (max-width:980px){
  /* Burger: round button, short bottom line that grows into the X */
  .nav-burger{
    width:46px; height:46px; border-radius:50%;
    border:1px solid var(--line); -webkit-tap-highlight-color:transparent;
    transition:background .35s var(--ease), border-color .35s var(--ease), transform .2s var(--ease);
  }
  .nav-burger:active{ transform:scale(.9); }
  .nav-burger span,
  .nav-burger span::before,
  .nav-burger span::after{ width:22px; }
  .nav-burger span::before,
  .nav-burger span::after{
    transition:transform .45s cubic-bezier(.2,.8,.2,1), top .3s var(--ease) .12s, width .3s var(--ease), background .25s var(--ease);
  }
  .nav-burger span::after{ left:auto; right:0; width:13px; }
  .nav.is-open .nav-burger{ border-color:rgba(255,255,255,.28); background:rgba(255,255,255,.07); }
  .nav.is-open .nav-burger span::after{ width:22px; }
  .nav.is-open .nav-logo{ opacity:0; pointer-events:none; }
  .nav-logo{ transition:opacity .3s var(--ease); }

  /* Overlay: opens as a circle growing out of the burger */
  .nav .nav-menu{
    background:
      radial-gradient(90% 55% at 100% 0%, rgba(156,137,101,.34) 0%, rgba(156,137,101,0) 62%),
      radial-gradient(70% 40% at 0% 100%, rgba(156,137,101,.16) 0%, rgba(156,137,101,0) 70%),
      linear-gradient(180deg, #171411 0%, #241e18 100%);
    -webkit-backdrop-filter:none; backdrop-filter:none;
    padding:104px 28px calc(28px + env(safe-area-inset-bottom));
    gap:0; opacity:1; transform:none; visibility:hidden;
    clip-path:circle(0px at calc(100% - var(--pad) - 23px) 37px);
    transition:clip-path .7s cubic-bezier(.76,0,.24,1), visibility 0s linear .7s;
  }
  .nav.is-open .nav-menu{
    visibility:visible;
    clip-path:circle(150vmax at calc(100% - var(--pad) - 23px) 37px);
    transition:clip-path .8s cubic-bezier(.76,0,.24,1), visibility 0s;
  }

  /* Big serif links rising in one after the other */
  .nav .nav-menu > a,
  .nav .nav-menu .nav-item > .has-mega{
    font-size:clamp(34px, 10.5vw, 46px); line-height:1.08; padding:11px 0;
    border-bottom:0; color:#fff;
    opacity:0; transform:translateY(38px);
    transition:opacity .35s var(--ease), transform .35s var(--ease), color .25s var(--ease);
    -webkit-tap-highlight-color:transparent;
  }
  .nav.is-open .nav-menu > a,
  .nav.is-open .nav-menu .nav-item > .has-mega{
    opacity:1; transform:none;
    transition:opacity .7s var(--ease), transform .8s cubic-bezier(.2,.8,.2,1), color .25s var(--ease);
  }
  .nav.is-open .nav-menu > a:active,
  .nav.is-open .nav-menu .nav-item > .has-mega:active{ transform:translateX(10px); transition-duration:.15s; transition-delay:0s !important; color:var(--gold-soft); }
  .nav .nav-menu > a.is-current,
  .nav .nav-menu .nav-item > .has-mega.is-current{ color:var(--gold-soft); font-style:italic; }
  .nav .nav-menu > a.is-current::before{
    content:""; display:inline-block; width:22px; height:1px; background:var(--gold-soft);
    vertical-align:middle; margin-right:12px;
  }
  .nav.is-open .nav-menu > *:nth-child(1){ transition-delay:.22s }
  .nav.is-open .nav-menu > *:nth-child(2){ transition-delay:.29s }
  .nav.is-open .nav-menu > *:nth-child(3){ transition-delay:.36s }
  .nav.is-open .nav-menu > *:nth-child(4){ transition-delay:.43s }
  .nav.is-open .nav-menu > *:nth-child(5){ transition-delay:.50s }
  .nav.is-open .nav-menu > *:nth-child(6){ transition-delay:.60s }
  .nav.is-open .nav-menu .nav-item > .has-mega{ transition-delay:.29s; }
  .nav .nav-menu .nav-item > .has-mega svg{ width:20px; height:20px; transition:transform .5s cubic-bezier(.2,.8,.2,1); }

  /* Le Suite: animated accordion with photo cards */
  .nav .nav-menu .megamenu-mobile,
  .nav.is-open .nav-menu .megamenu-mobile{
    display:grid !important; grid-template-rows:0fr; gap:0;
    padding:0 !important; margin:0 !important; border:0 !important;
    transition:grid-template-rows .55s cubic-bezier(.2,.8,.2,1);
  }
  .nav .nav-menu .nav-item.is-expanded .megamenu-mobile{ grid-template-rows:1fr; }
  .mm-inner{ overflow:hidden; min-height:0; }
  .mm-row{
    display:flex; gap:12px; overflow-x:auto; scroll-snap-type:x mandatory;
    padding:12px 28px 6px 0; margin-right:-28px; scrollbar-width:none; -webkit-overflow-scrolling:touch;
  }
  .mm-row::-webkit-scrollbar{ display:none; }
  .nav .nav-menu .megamenu-mobile a.mm-card{
    flex:0 0 44%; max-width:190px; scroll-snap-align:start; display:flex; flex-direction:column;
    padding:0 !important; text-transform:none; letter-spacing:0 !important;
    opacity:0; transform:translateY(16px) scale(.96);
    transition:opacity .5s var(--ease), transform .6s cubic-bezier(.2,.8,.2,1);
  }
  .nav-item.is-expanded .mm-card{ opacity:1 !important; transform:none !important; }
  .nav-item.is-expanded .mm-card:nth-child(1){ transition-delay:.10s }
  .nav-item.is-expanded .mm-card:nth-child(2){ transition-delay:.17s }
  .nav-item.is-expanded .mm-card:nth-child(3){ transition-delay:.24s }
  .nav-item.is-expanded .mm-card:nth-child(4){ transition-delay:.31s }
  .mm-card img{ width:100%; aspect-ratio:4/3; object-fit:cover; border-radius:14px; display:block; transition:transform .3s var(--ease); }
  .mm-card:active img{ transform:scale(.96); }
  .mm-card .mm-name{ font-family:"Cormorant Garamond",serif; font-size:20px !important; color:#fff !important; margin-top:9px; line-height:1.1; }
  .mm-card .mm-tag{ font-size:10px; letter-spacing:.2em; text-transform:uppercase; color:var(--gold-soft); margin-top:4px; }
  .nav .nav-menu .megamenu-mobile a.mm-all{
    display:inline-flex; align-items:center; gap:10px; margin:14px 0 12px;
    font-size:11px !important; letter-spacing:.24em !important; text-transform:uppercase;
    color:var(--gold-soft) !important; padding:0 !important;
  }
  .mm-all svg{ width:14px; height:14px; }

  /* Extras block */
  .nav .nav-mobile-extras{ gap:18px; padding-top:28px; transform:translateY(24px); transition:opacity .35s var(--ease), transform .35s var(--ease); }
  .nav.is-open .nav-menu .nav-mobile-extras{ transform:none; transition:opacity .7s var(--ease) .6s, transform .8s cubic-bezier(.2,.8,.2,1) .6s; }
  .btn-book--full{ position:relative; overflow:hidden; transition:transform .2s var(--ease), background .3s var(--ease); }
  .btn-book--full:active{ transform:scale(.97); }
  .btn-book--full::after{
    content:""; position:absolute; top:0; bottom:0; left:-60%; width:45%;
    background:linear-gradient(100deg, transparent, rgba(255,255,255,.35), transparent); transform:skewX(-18deg);
  }
  .nav.is-open .btn-book--full::after{ animation:mmSheen 1.1s var(--ease) 1.1s 1 both; }
  .nav-mobile-social a, .nav-mobile-lang button{ -webkit-tap-highlight-color:transparent; }
  .nav-mobile-social a:active, .nav-mobile-lang button:active{ transform:scale(.92); }
}
@keyframes mmSheen{ from{ left:-60%; } to{ left:130%; } }
@media (max-width:980px) and (prefers-reduced-motion:reduce){
  .nav .nav-menu, .nav.is-open .nav-menu{ transition:opacity .2s linear, visibility 0s; clip-path:none; opacity:0; }
  .nav.is-open .nav-menu{ opacity:1; }
  .nav .nav-menu > a, .nav .nav-menu .nav-item > .has-mega, .nav .nav-mobile-extras, .mm-card{ transform:none !important; transition:opacity .2s linear !important; }
  .nav.is-open .btn-book--full::after{ animation:none; }
}
/* Hide the Archimede button while the fullscreen menu is open (it covered the social icons). */
body.nav-locked .archimede-fab, body.nav-locked .archimede-wrap{ opacity:0 !important; pointer-events:none !important; transition:opacity .25s var(--ease); }

/* ===========================================================
   Responsive pass — 2026-11-12
   =========================================================== */
/* Grid/flex children may shrink below their content (kills 5px side-scroll) */
.contact-grid > *, .intro-grid > *, .suite-row > *, .booking-grid > *, .footer-grid > *{ min-width:0; }
html, body{ overflow-x:clip; }
img, video, iframe{ max-width:100%; }

@media (max-width: 991px){
  /* Hero: text anchored to the bottom, clear of the fixed header */
  .hero{ display:flex; flex-direction:column; height:100vh; height:100svh; min-height:600px; }
  .hero-inner{ flex:1 1 auto; height:auto; width:100%; padding-top:120px; }
  /* photos are bright: darker veil so the white title always reads */
  .hero-slider .slide::after{
    background:linear-gradient(180deg, rgba(20,18,15,.50) 0%, rgba(20,18,15,.12) 30%, rgba(20,18,15,.50) 62%, rgba(20,18,15,.86) 100%);
  }
  .hero-slider .slide-img{ inset:-3%; }
}
@media (max-width: 600px){
  .hero{ height:100vh; height:100svh; min-height:620px; }
  .hero-inner{ padding-bottom:128px; }
  body:not([data-page="home"]) .hero-inner{ padding-bottom:64px; }
  .hero-sub{ max-width:34ch; }
  .hero-actions{ margin-top:26px; }
  /* dots: small horizontal row under the header, away from the CTA */
  .hero .hero-dots{
    top:96px; right:20px; transform:none;
    flex-direction:row; gap:8px;
  }
  .hero .hero-dots li button{ width:6px; height:6px; }
  .hero .hero-dots li.is-active button{ width:22px; height:6px; }
}
@media (max-width: 991px){
  .page-hero::after{
    background:linear-gradient(180deg, rgba(20,18,15,.45) 0%, rgba(20,18,15,.10) 28%, rgba(20,18,15,.55) 62%, rgba(20,18,15,.88) 100%);
  }
}
@media (max-width: 600px){
  .hero-slider .slide::after{
    background:linear-gradient(180deg, rgba(20,18,15,.50) 0%, rgba(20,18,15,.10) 26%, rgba(20,18,15,.62) 58%, rgba(20,18,15,.90) 100%);
  }
  .page-hero{ min-height:56vh; min-height:56svh; padding:120px 0 96px; }
  /* chat button: icon only on phones (the label covered content and CTAs) */
  .archimede-fab .label{ display:none; }
  .suite-facts{ display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:20px 14px; }
  form.book{ padding:22px 18px; }
  form.book label, form.book input, form.book select, form.book textarea{ min-width:0; max-width:100%; }
  .g-recaptcha{ transform:scale(.86); transform-origin:left top; }
}
@media (max-width: 380px){
  .g-recaptcha{ transform:scale(.74); }
  .nav-inner, .shell{ --pad:16px; }
}
@media (max-width: 600px){
  .suite-head-facts{ display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:22px 12px; }
  .suite-head-facts .v{ letter-spacing:.14em; }
}
@media (max-width: 880px){
  /* home booking bar straddles photo and white page: solid dark so labels always read */
  body[data-page="home"] .bookbar{
    background:rgba(30,26,22,.94);
    border-color:rgba(255,255,255,.16);
    border-radius:14px; padding:22px 20px; gap:18px;
  }
  .bookbar{ border-radius:14px; }
  .bookbar .bb-fields{ gap:16px; }
  .bookbar .bb-field, .bookbar .bb-field.bb-daterange, .bookbar .bb-field.bb-guests{ flex:1 1 100%; min-width:0; }
  .bookbar .bb-cta{ width:100%; padding:16px 20px; }
}

/* ===== Archimede chat v2 — 2026-11-12 ===== */
.archi-msg{ white-space:pre-line; overflow-wrap:anywhere; }
.archi-thread{ scroll-margin-top:8px; }
.archi-suggest.is-used{ display:none; }
.archi-links{ display:flex; flex-wrap:wrap; gap:8px; align-self:flex-start; max-width:100%; margin:2px 0 6px; }
.archi-link{
  display:inline-flex; align-items:center; min-height:40px;
  padding:9px 16px; border-radius:999px;
  border:1px solid var(--gold); color:var(--gold-deep); background:#fff;
  font-size:13px; line-height:1.2; text-decoration:none;
  transition:background .25s var(--ease), color .25s var(--ease), transform .25s var(--ease);
}
.archi-link::after{ content:"→"; margin-left:8px; transition:transform .25s var(--ease); }
.archi-link:hover{ background:var(--ivory); }
.archi-link:hover::after{ transform:translateX(3px); }
.archi-link.primary{ background:var(--gold); color:#fff; }
.archi-link.primary:hover{ background:var(--gold-deep); }
.archi-link:active{ transform:scale(.97); }
.archi-form{ position:sticky; bottom:0; background:#fff; z-index:2; }
@media (max-width: 600px){
  .archi-popup{ padding:26px 16px 16px !important; width:calc(100vw - 16px) !important; margin:0 !important; }
  .archi-html{ max-height:72vh !important; max-height:72dvh !important; margin:0 !important; padding:0 2px !important; }
  .archi-intro{ gap:12px; }
  .archi-intro p{ font-size:14px; }
  .archi-msg{ max-width:92%; }
  .archi-form input{ font-size:16px; }   /* no iOS zoom on focus */
  .archi-chip{ min-height:40px; }
}

/* ===========================================================
   Mobile audit pass — 2026-11-12
   =========================================================== */
.hero-slider .slide:first-child .slide-img{ background-image:url('../img/esterni/ext-2.jpg'); }
@media (max-width: 700px){
  /* first hero photo: light file on phones (the others are set by JS) */
  .hero-slider .slide:first-child .slide-img{ background-image:url('../img/esterni/ext-2-m.jpg'); }
}
@media (max-width: 991px){
  /* the header is sticky and in the flow: without subtracting it the hero ran
     ~75px past the fold and its button ended under the chat button */
  .hero{ height:calc(100vh - 74px); height:calc(100svh - 74px); }
}
@media (max-width: 600px){
  .hero{ height:calc(100vh - 74px); height:calc(100svh - 74px); min-height:560px; }
  body[data-page="home"] .hero-inner{ padding-bottom:132px; }

  /* tap targets ≥ 40px, text ≥ 11px, inputs 16px (no iOS zoom) */
  .hero .hero-dots{ gap:0; right:10px; top:86px; }
  .hero .hero-dots li{ padding:0 5px; }
  .hero .hero-dots li button{ position:relative; }
  .hero .hero-dots li button::after{ content:""; position:absolute; inset:-19px -6px; }
  .suite-cta{ min-height:44px; align-items:center; }
  .talete-cta, .booking-location a, .map-overlay a{ display:inline-flex; align-items:center; min-height:44px; }
  .bookbar .bb-field .lbl, .suite-head-facts .v, .suite-facts div .v, .book-form .lbl, form.book span.lbl{ font-size:11px; }
  .bookbar .bb-field input, form.book input, form.book select, form.book textarea{ font-size:16px; }
  .cookie-banner .accept, .cookie-banner .refuse, .cookie-banner .more{ font-size:11px; min-height:44px; }

  /* ---------- Footer (phones) ---------- */
  .footer{ padding-top:44px; }
  .footer-grid{
    grid-template-columns:1fr 1fr; gap:30px 20px; padding-bottom:34px;
  }
  .footer-brand{
    grid-column:1 / -1; text-align:center;
    display:flex; flex-direction:column; align-items:center;
    padding-bottom:28px; border-bottom:1px solid rgba(255,255,255,.1);
  }
  .footer-brand .logo-wrap{ padding:12px 20px; border-radius:16px; }
  .footer-brand .logo-wrap img{ height:42px; }
  .footer-brand p{ margin-top:16px; max-width:30ch; font-size:13.5px; }
  .footer-brand .socials{ margin-top:16px; gap:14px; }
  .footer-brand .socials a{ width:46px; height:46px; }
  .footer h5{ margin-bottom:10px; letter-spacing:.24em; color:var(--gold-soft); }
  .footer ul{ gap:0; }
  .footer ul a, .footer ul button{ display:flex; align-items:center; min-height:40px; width:100%; font-size:14.5px; }
  /* "Seguici" repeats the round icons above: drop it, let "Legale" sit beside "Naviga" */
  .footer-grid > div:nth-child(5){ display:none; }
  .footer-grid > div:nth-child(4){ grid-column:1 / -1; }
  .footer-grid > div:nth-child(4) ul{ flex-direction:row; flex-wrap:wrap; gap:0 22px; }
  .footer-grid > div:nth-child(4) ul button{ width:auto; }
  .footer-bottom{
    flex-direction:column; align-items:center; text-align:center; gap:8px;
    padding:22px 0 calc(92px + env(safe-area-inset-bottom));   /* room for the chat button */
  }
  .footer-bottom .footer-mark{ font-size:19px; }
  .footer-credit{ margin-top:4px; }
  .footer-credit a{ display:inline-block; padding:8px 0 2px; }
}

/* ===========================================================
   Home first screen: header + hero + booking bar fit the viewport
   (--hero-top and --bb-h are measured by initHeroFit in site.js)
   =========================================================== */
body[data-page="home"] .hero{
  height:calc(100vh - var(--hero-top, 170px)); height:calc(100svh - var(--hero-top, 170px));
  min-height:500px;
}
body[data-page="home"] .bookbar-wrap{ margin-top:calc(-1 * (var(--bb-h, 142px) + 28px)); margin-bottom:28px; }
body[data-page="home"] .hero-inner{ padding-top:24px; padding-bottom:calc(var(--bb-h, 142px) + 60px); }
body[data-page="home"] .hero h1.display{ font-size:clamp(38px, min(8vw, 12.5vh), 124px); margin:14px 0 16px; }
body[data-page="home"] .hero-actions{ margin-top:clamp(18px, 3.4vh, 38px); }
@media (max-height: 720px){
  body[data-page="home"] .hero-sub{ font-size:15px; }
}
@media (max-width: 880px){
  /* compact bar on phones/tablets: dates + guests on one row, button below */
  body[data-page="home"] .bookbar{ padding:16px 16px 16px; gap:12px; }
  body[data-page="home"] .bookbar .bb-eyebrow{ display:none; }
  body[data-page="home"] .bookbar .bb-fields{ gap:12px 14px; }
  body[data-page="home"] .bookbar .bb-field.bb-daterange{ flex:1 1 0; min-width:0; }
  body[data-page="home"] .bookbar .bb-field.bb-guests{ flex:0 0 74px; min-width:0; }
  body[data-page="home"] .bookbar .bb-cta{ padding:14px 20px; }
  body[data-page="home"] .bookbar-wrap{ margin-top:calc(-1 * (var(--bb-h, 160px) + 16px)); margin-bottom:16px; }
  body[data-page="home"] .hero-inner{ padding-bottom:calc(var(--bb-h, 160px) + 40px); }
  body[data-page="home"] .hero{ min-height:520px; }
}
@media (max-width: 600px){
  body[data-page="home"] .hero h1.display{ font-size:clamp(34px, min(11vw, 7.4vh), 64px); margin:12px 0 12px; }
  body[data-page="home"] .hero-actions{ margin-top:18px; }
  body[data-page="home"] .hero-actions .btn-ghost{ padding-top:14px; padding-bottom:14px; }
}
@media (max-width: 600px) and (max-height: 700px){
  body[data-page="home"] .hero-sub{ display:none; }
}
body[data-page="home"] .hero{ min-height:430px; }
@media (min-width: 881px) and (max-height: 700px){
  body[data-page="home"] .hero-sub{ display:none; }
  body[data-page="home"] .hero h1.display{ font-size:clamp(34px, min(6vw, 10.5vh), 80px); margin:10px 0 0; }
  body[data-page="home"] .hero-inner{ padding-top:16px; padding-bottom:calc(var(--bb-h, 142px) + 48px); }
  body[data-page="home"] .hero-actions{ margin-top:18px; }
}
@media (max-width: 600px){
  /* the search button stops short of the chat button sitting in the corner */
  body[data-page="home"] .bookbar .bb-cta{ width:calc(100% - 66px); flex:0 0 auto; }
}
body[data-page="home"].is-top .archimede-fab .label{ opacity:0 !important; }
@media (min-width: 601px) and (max-width: 1640px){
  /* bar ends before the round chat button in the corner */
  body[data-page="home"] .bookbar-wrap .shell{ padding-right:104px; }
}

/* ===== Photos: phone variants + calmer titles — 2026-11-12 ===== */
.page-hero .bg{ background-image:var(--bg); }
@media (max-width: 700px){
  .page-hero .bg{ background-image:var(--bg-m, var(--bg)); }
}
/* hero / page titles were oversized */
h1.display{ font-size:clamp(38px, 5.2vw, 78px); }
body[data-page="home"] .hero h1.display{ font-size:clamp(36px, min(5vw, 9vh), 76px); }
.page-hero h1{ font-size:clamp(34px, 4.6vw, 68px); }
@media (max-width: 600px){
  h1.display{ font-size:clamp(32px, 9vw, 46px); }
  body[data-page="home"] .hero h1.display{ font-size:clamp(30px, min(9vw, 6.4vh), 46px); }
  .page-hero h1{ font-size:clamp(30px, 8.4vw, 42px); }
}
@media (min-width: 881px) and (max-height: 700px){
  body[data-page="home"] .hero h1.display{ font-size:clamp(32px, min(4.6vw, 8.6vh), 60px); }
}
.footer ul a.footer-place{ color:var(--gold-soft); }
.footer ul a.footer-place:hover{ color:#fff; }
@media (max-width: 700px){
  .ortigia .parallax{ background-image:url("../img/esterni/ext-2-m.jpg"); }
}

/* Sticky header shrinks on scroll: give back the lost height as margin so the
   page length never changes (that change made scrolling jump back and forth). */
.nav.is-condensed{ margin-bottom:24px; }
@media (max-width:980px){ .nav.is-condensed{ margin-bottom:10px; } }