/* ========== Base reset & variables ========== */
:root{
  --bg: #F6EFEA;
  --surface: #EEE3DC;
  --surface-2: #E8D9D1;
  --text: #241A16;
  --muted: #5E4D47;
  --border: #D8C6BE;
  --primary: #B85E3D;
  --primary-600: #9E4B2F;
  --ring: rgba(184,94,61,.24);

  /* Mustard dropdown & services */
  --mustard-bg: #F7F0D9;
  --mustard-bg-2: #F1E7C3;
  --mustard-border: #E6D59A;
  --mustard-accent: #C89A1B;

  --maxw: 72rem;
  --radius: 14px;
  --radius-sm: 10px;
  --gap: 1.25rem;
  --shadow-1: 0 1px 2px rgba(0,0,0,.04), 0 6px 24px rgba(36,26,22,.06);
  --shadow-2: 0 2px 6px rgba(0,0,0,.06), 0 10px 30px rgba(36,26,22,.08);

  --font: system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans","Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";
  --leading: 1.6;
}

*{ box-sizing:border-box; }
html,body{ height:100%; }
html{ scroll-behavior:smooth; }
body{
  margin:0;
  font-family: var(--font);
  color: var(--text);
  background: var(--bg);
  line-height: var(--leading);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

img{ max-width:100%; height:auto; display:block; }
a{ color: var(--primary); text-decoration:none; }
a:hover{ text-decoration:underline; }

.small{ font-size:.925rem; }
.muted{ color: var(--muted); }

/* ========== Layout ========== */
.container{ max-width: var(--maxw); margin-inline:auto; padding-inline: clamp(1rem,2.4vw,2rem); }
.section{ padding-block: clamp(2.5rem,5vw,4rem); }
.section.alt{ background: var(--surface); }
.section-head{ margin-bottom: clamp(1rem,2.5vw,1.5rem); }
.lead{ color: var(--muted); font-size: clamp(1rem,1vw + .8rem,1.25rem); }

/* ========== Header ========== */
.site-header{
  position:sticky; top:0; z-index:50;
  background: rgba(246,239,234,.88);
  backdrop-filter: saturate(180%) blur(8px);
  border-bottom:1px solid var(--border);
}
.header-inner{ display:flex; align-items:center; justify-content:space-between; min-height:64px; gap:1rem; }
.logo{ font-weight:700; letter-spacing:.2px; color: var(--text); }
.logo:hover{ text-decoration:none; }

.nav .nav-menu{
  list-style:none; display:flex; align-items:center;
  gap: clamp(.75rem, 2.6vw, 1.25rem);
  margin:0; padding:0;
}

/* ========== Dropdown Navigation (Menu) ========== */
.nav-drop details{ position:relative; }
.nav-drop-toggle{
  cursor:pointer;
  display:inline-flex;
  align-items:center;
  gap:.45rem;
  padding:.55rem .95rem;
  border-radius:999px;
  font-weight:600;
  font-size:.95rem;
  background: var(--mustard-bg);
  border:1px solid var(--mustard-border);
  color: var(--text);
  line-height:1;
  box-shadow: var(--shadow-1);
  transition: background .18s ease, box-shadow .18s ease;
}
.nav-drop-toggle:hover{
  background: var(--mustard-bg-2);
  text-decoration:none;
  box-shadow: var(--shadow-2);
}
.nav-drop-toggle::-webkit-details-marker{ display:none; }
.nav-drop .chev{ transition:transform .18s ease; }
.nav-drop details[open] .chev{ transform:rotate(-180deg); }

.nav-drop-panel{
  position:absolute;
  right:0; top:calc(100% + 10px);
  min-width:220px;
  background: var(--mustard-bg);
  border:1px solid var(--mustard-border);
  border-radius:16px;
  padding:.5rem .55rem;
  display:grid;
  gap:.35rem;
  box-shadow:0 8px 28px rgba(36,26,22,.12), 0 2px 8px rgba(36,26,22,.06);
  animation:fadePop .18s ease;
  z-index:70;
}
@keyframes fadePop{
  from{ opacity:0; transform:translateY(-4px); }
  to{ opacity:1; transform:translateY(0); }
}

.nav-drop-item{
  display:block;
  padding:.55rem .7rem;
  border-radius:10px;
  font-size:.92rem;
  color: var(--text);
  background:transparent;
  border:1px solid transparent;
  text-decoration:none;
  transition: background .15s ease, border-color .15s ease;
}
.nav-drop-item:hover{
  background: color-mix(in srgb, var(--mustard-bg) 85%, white 15%);
  border-color: color-mix(in srgb, var(--mustard-border) 80%, var(--mustard-accent) 20%);
  text-decoration:none;
}
.nav-drop-item:focus{
  outline:none;
  box-shadow:0 0 0 4px rgba(200,154,27,.25);
}

/* Mobile: widen dropdown */
@media (max-width:640px){
  .nav-drop-panel{ min-width: 260px; }
}

/* ========== Buttons ========== */
.btn{
  display:inline-flex; align-items:center; justify-content:center;
  gap:.5rem; height:42px; padding-inline:1rem;
  border-radius:999px; border:1px solid transparent;
  font-weight:600; white-space:nowrap;
  transition:all .18s ease; box-shadow: var(--shadow-1);
}
.btn:hover{ transform:translateY(-1px); box-shadow: var(--shadow-2); }
.btn:active{ transform:translateY(0); }
.btn-primary{ background: var(--primary); color:#fff; }
.btn-primary:hover{ background: var(--primary-600); }
.btn-outline{ background:#fff; color: var(--text); border-color: var(--border); }
.btn-outline:hover{ background: var(--surface-2); }
.btn-secondary{ background:#fff; color: var(--primary); border:1.5px solid var(--primary); }
.btn-secondary:hover{ background: rgba(184,94,61,.09); }

/* ========== Skip link ========== */
.skip-link{
  position:absolute; left:-999px; top:-999px;
}
.skip-link:focus{
  left:8px; top:8px; z-index:999;
  background: var(--primary); color:#fff;
  padding:.5rem .75rem; border-radius:8px;
  outline:none;
}

/* ========== Hero ========== */
.hero{
  background:
    radial-gradient(1000px 400px at 10% -10%, rgba(184,94,61,.14), transparent 60%),
    radial-gradient(800px 300px at 130% 10%, rgba(184,94,61,.10), transparent 60%),
    linear-gradient(180deg,#F6EFEA,#F6EFEA);
  border-bottom:1px solid var(--border);
}
.hero-inner{
  display:grid;
  grid-template-columns:1.1fr 0.9fr;
  gap: clamp(1rem,4vw,2rem);
  align-items:center;
  padding-block: clamp(2rem,6vw,3.5rem);
}
.hero-text h1{
  font-size: clamp(1.9rem, 2.8vw + 1rem, 3rem);
  line-height:1.1;
  margin:0 0 .75rem;
}
.hero-text h1 br{ display:block; }
.accent{
  background-image: linear-gradient(90deg,#B85E3D,#A44E30,#8F4026);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}
.hero-text p{
  margin:0 0 1.25rem;
  color: var(--muted);
  font-size: clamp(1rem,.5vw + .9rem,1.125rem);
}
.cta{ display:flex; flex-wrap:wrap; gap:.75rem; }

.hero-media img{
  border-radius: var(--radius);
  box-shadow: var(--shadow-2);
  width:100%;
  aspect-ratio:4/3;
  object-fit:cover;
}

/* Logo + titolo */
.hero-title{
  display:flex;
  align-items:center;
  gap:1rem;
  margin:0 0 .85rem;
}
.hero-title h1{ margin:0; min-width:0; }
.logo-box{
  width:92px; height:92px; flex:0 0 92px;
  border:2.4px solid var(--primary);
  border-radius:16px;
  display:flex; align-items:center; justify-content:center;
  background:linear-gradient(135deg, rgba(184,94,61,.14), rgba(184,94,61,.06));
  box-shadow:inset 0 1px 2px rgba(0,0,0,.05), 0 2px 6px rgba(0,0,0,.04);
  overflow:hidden;
}
.logo-box img{
  width:100%; height:100%;
  object-fit:contain;
  padding:10px;
}
@media (max-width:520px){
  .logo-box{ width:72px; height:72px; border-radius:14px; }
  .logo-box img{ padding:8px; }
}

/* Badges */
.badges{
  margin:.75rem 0 0;
  padding:0;
  list-style:none;
  display:flex;
  flex-wrap:wrap;
  gap:.5rem .6rem;
}
.badges li{
  padding:.25rem .6rem;
  border-radius:999px;
  background: var(--surface-2);
  color: var(--text);
  border:1px solid var(--border);
  font-size:.95rem;
}
/* Variante hero senza riquadro logo */
.hero-title--clean{
  display:flex;
  align-items:center;
  gap:1.2rem;
}
.hero-logo{
  width:140px;
  height:140px;
  object-fit:contain;
  display:block;
  border-radius:20px; /* opzionale */
}
@media (max-width:640px){
  .hero-logo{
    width:118px;
    height:118px;
  }
  .hero-title--clean h1{
    font-size:clamp(2.05rem, 7vw + .6rem, 2.65rem);
    line-height:1.12;
    margin:0;
  }
}
/* ========== Cards & lists ========== */
.cards{
  display:grid;
  gap: clamp(1rem,2.5vw,1.25rem);
  grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
}
.card{
  background:#fff;
  border:1px solid var(--border);
  border-radius: var(--radius);
  padding: clamp(1rem,2.2vw,1.25rem);
  box-shadow: var(--shadow-1);
}
.card img{
  width:100%; aspect-ratio:4/3;
  object-fit:cover;
  border-radius: var(--radius-sm);
  margin-bottom:.75rem;
}
.card h3{
  margin:0 0 .5rem;
  font-size: clamp(1.125rem,.6vw + 1rem,1.35rem);
  display:flex;
  align-items:center;
  gap:.5rem;
  justify-content:space-between;
  flex-wrap:wrap;
}
.price{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:.18rem .62rem;
  border:2px solid var(--primary);
  border-radius:999px;
  color: var(--primary);
  background: rgba(184,94,61,.12);
  font-weight:700;
  font-size:.92em;
  line-height:1;
  box-shadow:0 0 0 2px #fff inset, 0 0 0 2px rgba(184,94,61,.10);
}
.features{
  list-style:none;
  margin:.25rem 0 0;
  padding:0;
  display:flex;
  flex-direction:column;
  gap:.4rem;
}
.features li{
  position:relative;
  padding-left:1.15rem;
}
.features li::before{
  content:"•";
  position:absolute;
  left:0; top:0;
  color: var(--primary);
  font-weight:700;
}

/* ========== Services ========== */
.services{
  display:grid;
  grid-template-columns: repeat(auto-fit,minmax(220px,1fr));
  gap:.6rem;
}
.service{
  background: var(--mustard-bg);
  border:1px solid var(--mustard-border);
  border-radius:999px;
  padding:.48rem .85rem;
  display:inline-flex;
  align-items:center;
  gap:.55rem;
  color: var(--text);
  box-shadow:0 1px 0 rgba(0,0,0,.02);
}
.service .ico{
  width:1.15rem;
  text-align:center;
  color: var(--mustard-accent);
}
.service:hover{
  background: color-mix(in srgb, var(--mustard-bg) 92%, white 8%);
  border-color: color-mix(in srgb, var(--mustard-border) 86%, var(--mustard-accent) 14%);
}

/* ========== Gallery ========== */
.gallery{
  display:grid;
  grid-template-columns: repeat(auto-fit,minmax(180px,1fr));
  gap:.5rem;
}
.gallery img{
  border-radius: var(--radius-sm);
  object-fit:cover;
  width:100%;
  aspect-ratio:4/3;
}

/* ========== Contact ========== */
.contact-grid{
  display:grid;
  gap:1rem 1.25rem;
  grid-template-columns:1fr;
}
@media (min-width:880px){
  .contact-grid{ grid-template-columns:1fr 1fr; }
}
.contact-list{
  list-style:none;
  padding:0;
  margin:0 0 .75rem;
}
.contact-list li{ margin:.25rem 0; }
.form input,
.form textarea{
  width:100%;
  margin-top:.35rem;
  padding:.6rem .7rem;
  border-radius:10px;
  border:1px solid var(--border);
  outline:none;
  background:#fff;
  color: var(--text);
}
.form input:focus,
.form textarea:focus{
  box-shadow:0 0 0 4px var(--ring);
}
.form .checkbox{
  display:flex;
  align-items:center;
  gap:.5rem;
}
.form-note{ font-size:.75rem; color: var(--muted); margin-top:.5rem; }

/* ========== FAQ (se servisse in altre pagine) ========== */
.faq{ display:grid; gap:.75rem; }
.faq-item{
  background:#fff;
  border:1px solid var(--border);
  border-radius: var(--radius-sm);
  overflow:clip;
  box-shadow: var(--shadow-1);
}
.faq-item summary{
  cursor:pointer;
  list-style:none;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:.75rem;
  padding:.9rem 1rem;
  font-weight:600;
}
.faq-item summary:hover{ background: var(--surface-2); }
.faq-item summary::-webkit-details-marker{ display:none; }
.faq-item summary span{
  position:relative;
  padding-right:1.25rem;
}
.faq-item summary span::after{
  content:"▾";
  position:absolute;
  right:0;
  color: var(--muted);
  transition:transform .18s ease;
}
.faq-item[open] summary span::after{ transform:rotate(-180deg); }
.faq-content{
  padding:.5rem 1rem 1rem;
  color: var(--muted);
  border-top:1px solid var(--border);
}

/* ========== Footer ========== */
.site-footer{
  border-top:1px solid var(--border);
  background:#fff;
}
.footer-inner{
  display:flex;
  flex-wrap:wrap;
  gap:.75rem 1rem;
  align-items:center;
  justify-content:space-between;
  padding-block:1rem;
}
.footer-nav{
  display:flex;
  gap:.75rem 1rem;
  flex-wrap:wrap;
}
.footer-nav a{
  color: var(--muted);
}
.footer-nav a:hover{
  color: var(--text);
  text-decoration:none;
}

/* ========== Typography ========== */
h1,h2,h3{ line-height:1.2; }
h2{
  font-size: clamp(1.35rem,1.1vw + 1.1rem,1.75rem);
  margin:0 0 .35rem;
}
p{ margin:.5rem 0; }

/* ========== Mappa Dove siamo ========== */
.location-grid{
  display:grid;
  gap:40px;
  grid-template-columns:minmax(0,1fr) minmax(0,460px);
  align-items:start;
}
.location-text p{ margin:0 0 14px; }
.map-wrapper{
  position:relative;
  width:100%;
  aspect-ratio:4/3;
  border:1px solid var(--border);
  border-radius:12px;
  overflow:hidden;
  box-shadow:var(--shadow-2);
  background:#f1f5f9;
}
.map-wrapper iframe{
  width:100%;
  height:100%;
  border:0;
}
.map-overlay{
  position:absolute;
  inset:0;
  background:transparent;
  cursor:pointer;
}
@media (max-width:900px){
  .location-grid{ grid-template-columns:1fr; }
  .location-map{ max-width:560px; }
}

/* ========== Responsive tweaks ========== */
@media (max-width:880px){
  .nav .nav-menu{
    gap:.6rem;
    flex-wrap:wrap;
    justify-content:flex-end;
  }
  .btn{ height:40px; }
  .hero-inner{ grid-template-columns:1fr; }
  .card h3{ gap:.35rem; }
  .hero-title{ gap:.85rem; }
}

/* Optional small height logo adjustments when very narrow */
@media (max-width:400px){
  .hero-text h1{ font-size: clamp(1.9rem, 9vw, 2.4rem); }
  .logo-box{ width:64px; height:64px; }
  .logo-box img{ padding:6px; }
}

/* Accessibility focus visible for links in panel */
.nav-drop-item:focus-visible{
  outline:none;
  box-shadow:0 0 0 4px rgba(200,154,27,.25);
}
/* === Aggiunte per pagina Biciclette: BIO + PREZZI === */
.bio{
  display:grid;
  grid-template-columns: 110px 1fr;
  gap:14px;
  align-items:start;
  background:#fff;
  border:1px solid var(--border);
  border-radius: var(--radius-sm);
  padding:14px;
  box-shadow: var(--shadow-1);
}
.bio-img{
  width:110px; height:110px; object-fit:cover;
  border-radius:12px;
  border:1px solid var(--border);
}
@media (max-width:560px){
  .bio{ grid-template-columns: 84px 1fr; }
  .bio-img{ width:84px; height:84px; }
}

.price-box{
  background: var(--mustard-bg);
  border:1px solid var(--mustard-border);
  border-radius: var(--radius);
  padding: clamp(0.9rem, 1.5vw, 1.2rem);
  box-shadow: var(--shadow-2);
}
.price-grid{
  display:grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: clamp(.6rem, 2vw, 1rem);
}
@media (max-width:720px){
  .price-grid{ grid-template-columns:1fr; }
}
.price-col h3{
  margin:.1rem 0 .35rem;
  font-size: clamp(1.05rem, .4vw + 1rem, 1.2rem);
}
.price-col p, .price-col ul{ margin:0; }
.price-col ul{ padding-left:1.1rem; }
.price-box .tag{
  display:inline-block;
  margin-left:.35rem;
  padding:.06rem .45rem;
  border-radius:999px;
  background: color-mix(in srgb, var(--mustard-accent) 18%, #fff 82%);
  color:#5a4707;
  border:1px solid color-mix(in srgb, var(--mustard-accent) 40%, #d6c375 60%);
  font-size:.8rem;
  vertical-align:baseline;
}
.price-box .small{ margin-top:.65rem; display:block; }

/* Dissolvenza ai bordi della foto hero (left/right) */
.hero-media img{
  /* Manteniamo i tuoi stili già esistenti: */
  border-radius: var(--radius);
  box-shadow: var(--shadow-2);
  width:100%;
  aspect-ratio:4/3;
  object-fit:cover;

  /* Aggiunta: maschera per la dissolvenza laterale */
  -webkit-mask-image: linear-gradient(to right, transparent 0%, #000 18%, #000 100%);
          mask-image: linear-gradient(to right, transparent 0%, #000 18%, #000 100%);
  -webkit-mask-size: 100% 100%;
          mask-size: 100% 100%;
}

@keyframes heroFadeIn {
  from { opacity: 0; }
  to   { opacity: 1; }
}
.hero-media img{
  animation: heroFadeIn .10s ease-out both;
}
/* === Kit colazione page === */
.kit-box{
  background: var(--mustard-bg);
  border:1px solid var(--mustard-border);
  border-radius: var(--radius);
  padding: clamp(1rem,2.2vw,1.4rem);
  box-shadow: var(--shadow-2);
  display:flex;
  flex-direction:column;
  gap:1.2rem;
}
.kit-list{
  display:grid;
  gap:1rem;
}
.kit-item{
  display:grid;
  grid-template-columns: 96px 1fr;
  gap:14px;
  align-items:start;
  background:#fff;
  border:1px solid var(--border);
  border-radius: var(--radius-sm);
  padding:12px 14px;
  box-shadow: var(--shadow-1);
}
.kit-item img{
  width:96px;
  height:96px;
  object-fit:cover;
  border-radius:12px;
  border:1px solid var(--border);
}
.kit-info h3{
  margin:0 0 .35rem;
  font-size:1.05rem;
  display:flex;
  flex-wrap:wrap;
  gap:.5rem;
  align-items:center;
}
.kit-price{
  background: rgba(200,154,27,.18);
  color:#5a4707;
  font-weight:600;
  padding:.15rem .55rem;
  border-radius:999px;
  font-size:.75rem;
  border:1px solid color-mix(in srgb, var(--mustard-border) 80%, var(--mustard-accent) 20%);
}
@media (max-width:560px){
  .kit-item{ grid-template-columns:72px 1fr; padding:10px 12px; }
  .kit-item img{ width:72px; height:72px; }
  .kit-info h3{ font-size:1rem; }
}
.availability-head{
  display:flex; flex-wrap:wrap; gap:.8rem 1rem; align-items:end; margin-bottom:1rem;
}
.apt-select, .guest-select{ display:flex; flex-direction:column; gap:.35rem; }
.apt-select select, .guest-select input{
  height:40px; padding:.4rem .6rem;
  border:1px solid var(--border); border-radius:10px; background:#fff; color:var(--text);
}
.legend{ display:flex; gap:.5rem; margin-left:auto; flex-wrap:wrap; }
.lg{ display:inline-flex; align-items:center; gap:.35rem; font-size:.9rem; color:var(--muted); }
.lg::before{ content:""; width:14px; height:14px; border-radius:4px; border:1px solid var(--border); display:inline-block; }
.lg-free::before{ background:#d1f2d1; border-color:#8bc68b; }
.lg-busy::before{ background:#f7d6d6; border-color:#e4b2b2; }
.lg-sel::before{ background:#c9e7ff; border-color:#84b3de; }

.calendar-wrap{ display:grid; gap:1rem; }
.month-block h2{ margin:.25rem 0; font-size:1.1rem; color:var(--muted); }
.month-grid{ display:grid; grid-template-columns:repeat(7,1fr); gap:.35rem; }
.day{
  background:#fff; border:1px solid var(--border); border-radius:10px;
  min-height:42px; padding:.45rem; font-weight:600; color:var(--text);
  box-shadow: var(--shadow-1);
}
.day:hover{ transform:translateY(-1px); box-shadow: var(--shadow-2); cursor:pointer; }
.day.busy{ background:#f7d6d6; border-color:#e4b2b2; color:#8a5a5a; cursor:not-allowed; box-shadow:none; transform:none; }
.day.sel-start, .day.sel-range{ background:#d1f2d1; border-color:#8bc68b; color:#175c17; }
.day.empty{ visibility:hidden; }

.selection-box{
  margin-top:1rem;
  background: var(--mustard-bg);
  border:1px solid var(--mustard-border);
  border-radius: var(--radius);
  padding: clamp(.8rem, 2vw, 1rem);
  box-shadow: var(--shadow-2);
}
.selection-box .btn{ margin-top:.35rem; }

@media (max-width:720px){
  .availability-head{ align-items:stretch; }
  .legend{ width:100%; margin-left:0; }
}
/* Navigazione mese */
.cal-nav{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:.6rem;
  margin:.6rem 0 .3rem;
}
.nav-btn{
  width:40px; height:40px;
  border:1px solid var(--border);
  border-radius:10px;
  background:#fff; color:var(--text);
  font-size:1.2rem; line-height:1;
  box-shadow: var(--shadow-1);
}
.nav-btn:hover{ box-shadow: var(--shadow-2); transform:translateY(-1px); }
.month-label{
  min-width: 11ch;
  text-align:center;
  font-weight:700;
  text-transform:capitalize;
}

/* Intestazione giorni settimana */
.weekdays{
  display:grid;
  grid-template-columns: repeat(7, 1fr);
  gap:.35rem;
  color:var(--muted);
  font-weight:600;
  font-size:.85rem;
  margin-bottom:.25rem;
}
.weekdays > div{
  text-align:center;
}

/* La griglia del mese riusa .month-grid e .day già presenti */
/* Navigazione mese (frecce) */
.cal-nav{
  display:flex; align-items:center; justify-content:center;
  gap:.6rem; margin:.6rem 0 .3rem;
}
.nav-btn{
  width:40px; height:40px;
  border:1px solid var(--border); border-radius:10px;
  background:#fff; color:var(--text); font-size:1.2rem; line-height:1;
  box-shadow: var(--shadow-1);
}
.nav-btn:hover{ box-shadow: var(--shadow-2); transform:translateY(-1px); }
.month-label{ min-width:11ch; text-align:center; font-weight:700; text-transform:capitalize; }

/* Intestazione giorni settimana */
.weekdays{
  display:grid; grid-template-columns:repeat(7,1fr);
  gap:.35rem; color:var(--muted); font-weight:600; font-size:.85rem; margin-bottom:.25rem;
}
.weekdays > div{ text-align:center; }

/* Se non le avevi già, queste sono le basi del calendario */
.month-grid{ display:grid; grid-template-columns:repeat(7,1fr); gap:.35rem; }
.day{
  background:#fff; border:1px solid var(--border); border-radius:10px;
  min-height:42px; padding:.45rem; font-weight:600; color:var(--text);
  box-shadow: var(--shadow-1);
}
.day:hover{ transform:translateY(-1px); box-shadow: var(--shadow-2); cursor:pointer; }
.day.busy{
  background:#f7d6d6; border-color:#e4b2b2; color:#8a5a5a;
  cursor:not-allowed; box-shadow:none; transform:none;
}
.day.sel-start, .day.sel-range{ background:#d1f2d1; border-color:#8bc68b; color:#175c17; }
.day.empty{ visibility:hidden; }

/* Availability: header minimale (nasconde le voci in alto a destra e il bottone "Prenota ora") */
.page-availability .site-header .nav,
.page-availability .site-header .nav-menu,
.page-availability .site-header .nav .btn {
  display: none !important;
}
.page-availability .site-header .header-inner{
  justify-content:flex-start;
}
/* ===== Spaziatura compatta per la pagina disponibilità ===== */

/* Riduce l'altezza dell'header SOLO sulla pagina availability */
.page-availability .site-header{
  padding-block: 6px;            /* prima probabilmente 20–32px */
  border-bottom:1px solid var(--border);
  background: var(--bg, #f7f2ee);
}
.page-availability .site-header .header-inner{
  min-height: 50px;               /* evita header troppo alto su mobile */
  padding: 0 20px;
}

/* Riduce il padding-top della sezione principale */
.page-availability .section.availability{
  padding-top: 14px;              /* se .section di base usa 48/60px, lo sovrascrive */
}

/* Compatta il titolo */
.page-availability .section.availability h1{
  margin: 4px 0 18px;             /* prima poteva avere ~32px top */
  line-height: 1.15;
  font-size: clamp(1.55rem, 5.2vw, 2.05rem);
}

/* Allinea il blocco dei controlli un po' più vicino al titolo */
.page-availability .availability-head{
  margin-top: 0;
  padding-top: 0;
}

/* Se vuoi ancora meno spazio tra legenda e calendario */
.page-availability .legend{
  margin-top: 2px;
}

/* Riduce leggermente il gap verticale tra intestazione giorni e griglia */
.page-availability .weekdays{
  margin-bottom: .15rem;
}

/* Regola globale per compensare eventuali padding generici su .section */
.page-availability main .section:first-of-type{
  padding-top: 14px;
}

/* Mobile very small (iPhone SE) ulteriore compressione */
@media (max-width:360px){
  .page-availability .site-header .header-inner{ min-height:46px; }
  .page-availability .section.availability h1{ font-size:1.45rem; margin:2px 0 14px; }
}
/* ===== Availability: compattazione extra su mobile ===== */

/* Base (desktop/tablet già compattato) */
.page-availability .site-header{
  padding-block: 6px;
}

/* Mobile: riduci ulteriormente header + spazi prima del titolo */
@media (max-width: 640px){
  .page-availability .site-header{
    padding-block: 2px !important;
  }
  .page-availability .site-header .header-inner{
    min-height: 44px;            /* header più basso su mobile */
    padding: 0 14px;
  }
  .page-availability .section.availability{
    padding-top: 8px !important; /* meno spazio sopra al titolo */
  }
  .page-availability .section.availability h1{
    margin: 2px 0 12px;          /* compatta il titolo */
    font-size: 1.5rem;           /* titolo un po' più piccolo */
    line-height: 1.15;
  }
  .page-availability .availability-head{
    gap: 8px 10px;
    margin-bottom: 6px;
  }
  .page-availability .cal-nav{
    margin: .35rem 0 .2rem;      /* compatta barra mese */
  }
  .page-availability .weekdays{
    font-size: .85rem;
    margin-bottom: .15rem;
  }
}

/* Schermi molto piccoli: opzione ultra‑compatta (nasconde l’header) */
@media (max-width: 420px){
  .page-availability .site-header{ display: none; }
  .page-availability main .section.availability{ padding-top: 8px !important; }
  /* Compensa eventuale tacca iPhone */
  @supports (padding: max(0px)){
    .page-availability main .section.availability{
      padding-top: max(8px, env(safe-area-inset-top));
    }
  }
}
/* Giorni passati in grigio (non cliccabili) – solo pagina availability */
.page-availability .availability .day.past{
  background: #ece9e6;
  border-color: #dfd9d2;
  color: #a39890;
  cursor: not-allowed;
  box-shadow: none;
  transform: none;
}
/* Giorni passati: quadratini grigi ben visibili (solo pagina disponibilità) */
.page-availability .availability .day.past{
  background: #E8E6E3;      /* grigio pieno per lo sfondo */
  border-color: #D6D0C9;    /* bordo grigio chiaro */
  color: #8E857D;           /* testo grigio medio */
  cursor: not-allowed;
  box-shadow: none;
  transform: none;
}
.page-availability .availability .day.past:hover{
  background: #E8E6E3;
  box-shadow: none;
}

/* Se vuoi un contrasto ancora più alto, usa questa variante (decommenta e commenta il blocco sopra)
.page-availability .availability .day.past{
  background: #DDD9D4;
  border-color: #CAC2B9;
  color: #7C736B;
}
*/
/* === Legenda: nuovo quadratino "Check‑out" azzurro === */
.availability .lg-end::before{
  background:#cfe4ff;
  border-color:#9bc0eb;
}

/* Check‑out (giorno finale) in azzurro ben visibile */
.page-availability .availability .day.sel-end{
  background:#DAEEFF;
  border-color:#6FB3E9;
  color:#0E4F7F;
}

/* Giorni passati: quadratini grigi */
.page-availability .availability .day.past{
  background:#E8E6E3;
  border-color:#D6D0C9;
  color:#8E857D;
  cursor:not-allowed;
  box-shadow:none;
  transform:none;
}
.page-availability .availability .day.past:hover{
  background:#E8E6E3;
  box-shadow:none;
}

/* (già esistenti) selezione in verde: .sel-start e .sel-range */
.image-carousel {
  position: relative;
  overflow: hidden;
  border-radius: 12px;
}

.carousel-container {
  position: relative;
  width: 100%;
}

.carousel-image {
  width: 100%;
  display: block;
}

.carousel-image.hidden {
  display: none;
}

.carousel-btn {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  background: rgba(255, 255, 255, 0.9);
  border: none;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  cursor: pointer;
  font-size: 18px;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 10;
}

.carousel-prev {
  left: 10px;
}

.carousel-next {
  right: 10px;
}

.carousel-btn:hover {
  background: rgba(255, 255, 255, 1);
}
/* === Pagina visita castello === */
.page-castello .castello-grid{
  display:grid;
  gap:24px;
}
@media (min-width:880px){
  .page-castello .castello-grid{
    grid-template-columns: 1.05fr 0.95fr;
    align-items:start;
  }
}
.page-castello .castello-media img{
  width:100%;
  display:block;
  border-radius:18px;
  object-fit:cover;
  max-height:520px;
  box-shadow: 0 8px 24px rgba(0,0,0,.08);
}
.page-castello .castello-box{
  background: var(--mustard-bg,#fbf1d7);
  border:1px solid var(--mustard-border,#e8d7a9);
  border-radius:18px;
  padding: clamp(1rem, 3vw, 1.4rem) clamp(1rem, 3vw, 1.6rem);
  box-shadow: 0 4px 18px rgba(0,0,0,.08);
}
.page-castello .castello-title{
  margin:0 0 .6rem;
  font-size: clamp(1.55rem,5vw,2.1rem);
  line-height:1.15;
}
.page-castello .castello-punti{
  list-style:none;
  padding:0;
  margin:.85rem 0 1.1rem;
  display:grid;
  gap:.4rem;
}
.page-castello .castello-punti li{
  position:relative;
  padding-left:20px;
  font-size:.95rem;
}
.page-castello .castello-punti li::before{
  content:"•";
  position:absolute;
  left:4px;
  top:0;
  color:#b5763f;
  font-weight:700;
}
.page-castello .tariffe h2{
  margin:.2rem 0 .4rem;
  font-size:1.15rem;
  font-weight:800;
  letter-spacing:.02em;
}
.page-castello .tariffe p{ margin:.15rem 0; font-size:1rem; font-weight:600; }
.page-castello .prenota{
  margin: .9rem 0 .7rem;
  font-size:.95rem;
}
.page-castello .castello-cta{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:.4rem;
}
.page-castello .btn-sm{
  padding:8px 14px;
  font-size:.85rem;
  font-weight:700;
  border-radius:999px;
}
.page-castello .btn-primary{
  background:#a65a36;
  color:#fff;
  text-decoration:none;
}
.page-castello .btn-secondary{
  background:#fff;
  color:#2b241f;
  border:1px solid var(--border,#e5ddd3);
  text-decoration:none;
}
@media (max-width:520px){
  .page-castello .castello-box{
    padding: 1rem 1.1rem 1.15rem;
  }
  .page-castello .castello-title{
    font-size:1.6rem;
  }
  .page-castello .castello-cta{ gap:8px; }
}
/* ... (tue regole esistenti sopra) ... */

/* Sezione codici appartamento */
.apt-info {
  margin-top: 1.25rem;
  padding: 1rem 1.1rem;
  border: 1px solid #d1d5db;
  background: #f9fafb;
  border-radius: 8px;
  font-size: 0.95rem;
  line-height: 1.4;
}

.apt-info p {
  margin: 0 0 0.35rem;
}

.apt-info p:last-child {
  margin-bottom: 0;
}

/* ============================================================
   MIGLIORAMENTI — logo a destra del titolo + polish responsive
   ============================================================ */

/* Titolo a sinistra, logo a destra, allineati e bilanciati */
.hero-title--clean{
  justify-content: space-between;
  gap: 1.2rem;
}
.hero-title--clean h1{
  flex: 1 1 auto;
  min-width: 0;
  text-wrap: balance;
}
.hero-title--clean .hero-logo{
  flex: 0 0 auto;
  order: 2; /* garantisce il logo a destra anche se cambia l'ordine nel markup */
}
/* Su mobile: logo un po' più piccolo ma sempre a destra */
@media (max-width: 640px){
  .hero-title--clean{ gap: .9rem; }
  .hero-title--clean .hero-logo{ width: 96px; height: 96px; }
}
@media (max-width: 400px){
  .hero-title--clean{ gap: .7rem; }
  .hero-title--clean .hero-logo{ width: 78px; height: 78px; }
}

/* Tap target comodi (≥44px) su mobile per un tocco professionale */
.btn{ min-height: 44px; }
@media (max-width: 880px){ .btn{ height: 44px; } }
.nav-drop-toggle{ min-height: 44px; }

/* Le ancore non finiscono sotto l'header sticky quando si salta a una sezione */
main section[id]{ scroll-margin-top: 84px; }

/* Accessibilità helper */
.visually-hidden {
  position:absolute;
  width:1px;
  height:1px;
  padding:0;
  margin:-1px;
  overflow:hidden;
  clip:rect(0 0 0 0);
  white-space:nowrap;
  border:0;
}

/* ... (eventuali altre regole sotto) ... */
