@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap');
/*MARGIN*/
.m-0{margin: 0;}
.m-10{margin: 10;}
.m-20{margin: 20;}
.m-30{margin: 30;}
.m-40{margin: 40;}
.m-50{margin: 50;}

.mt-10{margin-top: 10px;}
.mt-20{margin-top: 20px;}
.mt-30{margin-top: 30px;}
.mt-40{margin-top: 40px;}
.mt-50{margin-top: 50px;}
.mt-60{margin-top: 60px;}
.mt-70{margin-top: 70px;}
.mt-80{margin-top: 80px;}
.mt-90{margin-top: 90px;}
.mt-100{margin-top: 1000px;}

.mb-10{margin-bottom: 10px;}
.mb-20{margin-bottom: 20px;}
.mb-30{margin-bottom: 30px;}
.mb-40{margin-bottom: 40px;}
.mb-50{margin-bottom: 50px;}
.mb-60{margin-bottom: 60px;}
.mb-70{margin-bottom: 70px;}
.mb-80{margin-bottom: 80px;}
.mb-90{margin-bottom: 90px;}
.mb-100{margin-bottom: 100px;}
.mb-150{margin-bottom: 150px;}
.mb-180{margin-bottom: 180px;}

.mtb-10{margin: 10px 0;}
.mtb-20{margin: 20px 0;}
.mtb-30{margin: 30px 0;}
.mtb-40{margin: 40px 0;}
.mtb-50{margin: 50px 0;}
.mtb-60{margin: 60px 0;}
.mtb-70{margin: 70px 0;}
.mtb-80{margin: 80px 0;}
.mtb-90{margin: 90px 0;}
.mtb-100{margin: 100px 0;}
.mtb-110{margin:110px 0;}
.mtb-120{margin: 120px 0;}
.mtb-130{margin: 130px 0;}
.mtb-140{margin: 140px 0;}
.mtb-150{margin: 150px 0;}

.m-center{margin: 0 auto!important;}

/*PADDING*/
.p-0{padding: 0px!important;}
.p-10{padding: 10px;}
.p-20{padding: 20px;}
.p-30{padding: 30px;}
.p-40{padding: 40px;}
.p-50{padding: 50px;}
.p-60{padding: 60px;}

.pt-10{padding-top: 10px;}
.pt-20{padding-top: 20px;}
.pt-30{padding-top: 30px;}
.pt-40{padding-top: 40px;}
.pt-50{padding-top: 50px;}

.pt-220{padding-top: 220px;}

.pb-10{padding-bottom: 10px;}
.pb-20{padding-bottom: 20px;}
.pb-30{padding-bottom: 30px;}
.pb-40{padding-bottom: 40px;}
.pb-50{padding-bottom: 50px;}

.ptb-10{padding: 10px 0;}
.ptb-20{padding: 20px 0;}
.ptb-30{padding: 30px 0;}
.ptb-40{padding: 40px 0;}
.ptb-50{padding: 50px 0;}

.plr-10{padding: 0 10px;}
.plr-20{padding: 0 20px;}
.plr-30{padding: 0 30px;}
.plr-40{padding: 0 40px;}
.plr-50{padding: 0 50px;}
.plr-180{padding: 0 180px;}


/*DISPLAY*/
.display-inline{display: inline-block;}
.display-block{display: block;}
.trecol{width: 30%;margin: 0 5px;}
.duecol{column-count: 2;column-gap: 20px; }
.w-100{width: 100%;}
.w-70{width: 70%;}

/*ALIGN*/
.right{text-align: right;}
.center{text-align: center;}

/*SIZE*/
.size-20{font-size: 20px;line-height: 20px;}
.size-12{font-size: 12px;}
.size-13{font-size: 13px;}
.size-10{font-size: 10px;}
.size-8{font-size: 8px;}
.size-15{font-size: 15px;}
.size-25{font-size: 25px;}
.size-30{font-size: 30px;line-height: 33px;}
.size-40{font-size: 40px;}
.size-50{font-size: 50px;line-height: 43px;}
.size-90{font-size: 90px;}

/*STYLE*/
.upp{text-transform: uppercase;}
.bold{font-weight: 700}
.radius-10{border-radius: 10px}
.text-shad{text-shadow: 1px 1px 3px #333;}

/*WEIGTH*/
.weight-200{font-weight: 200;}
.weight-300{font-weight: 300;}
.weight-700{font-weight: 700;}

/*HEIGHT*/
.height-20{height: 20px;}
.height-200{height: 200px;}
.height-300{height: 300px;}
.height-400{height: 400px;}
.height-500{height: 500px;}
.height-600{height: 600px;}
.height-700{height: 700px;}

.line-height-70{line-height: 70px;}

/*COLOR*/

.color-white{color: #fff;}
.colr-blu{color: #1E70B7;}
.bckblu{background: #1E70B7;}
.bckblack{background: #000;}
.bcklightgrey{background: #F3F3F3;}
.bckyellow{background: #FFC100;}
.bck-green{background: #00796B;}
.color-princ{color: #ff4618}



    :root{
      --brand:#333;          /* grigio scuro */
      --brand-600:#165488;
      --accent:#F7A300;         /* arancione caldo */
      --ink:#2b2b2b;
      --muted:#6b7280;
      --bg:#ffffff;
      --bg-soft:#f6f7f9;
      --surface:#ffffff;
      --ring:#1f6cb0;
      --radius:14px;
      --shadow:0 0px 10px rgba(0,0,0,.08);
      --maxw:1200px;
	  --bs-offcanvas-height:100%;
		 --stickyTop: 84px;
		--gap:18px;
		--stickyTop: calc(68px + env(safe-area-inset-top, 0px));
    }

    /* Reset ragionato */
    *,*::before,*::after{box-sizing:border-box}
    html,body{height:100%}
    body{
      margin:0;
      
      color:var(--ink);
      background:var(--bg);
      -webkit-font-smoothing:antialiased;
      text-rendering:optimizeLegibility; font-family: "Montserrat", sans-serif;
    }
    img{max-width:100%; display:block}
    a{color:var(--brand); text-decoration:none}
    a:hover{text-decoration:none}

    /* Accessibilità: focus chiaro e consistente */
    :focus-visible{
      outline:3px solid var(--ring);
      outline-offset:2px;
      border-radius:8px;
    }
.offcanvas.offcanvas-bottom {height: 100%!important}
    /* ========== Topbar / Nav ========== */
.topbar{background:#2e2e2e;color:#fff;font-size:.875rem;}
.topbar .container{display:flex; align-items:center; justify-content:space-between;padding-block:8px;gap:12px;}
.nav{background:#3a3a3a;color:#fff;}
.nav .container{display:flex; align-items:center; justify-content:space-between;padding-block:10px;gap:16px;}
.brand{ align-items:center; gap:10px; font-weight:700; letter-spacing:.2px;color: #fff;text-transform: uppercase;font-size: 20px;}
.brand span{color: var(--accent);}
.menu{display:flex; gap:18px; flex-wrap:wrap;text-transform: uppercase;}
.menu a{color:#fff; opacity:.9; font-weight:400;}
.menu a:hover{opacity:1}

.breadcrumb{padding-top: 20px}
.breadcrumb li{margin-right: 10px;text-transform: uppercase;}
.breadcrumb li a{color: #fff;}
 li.active {color: #fff;font-weight: 700}

/* ========== Hero ========== */
.hero{position:relative; min-height:45svh; display:grid; place-items:center;color:#fff; text-align:center; isolation:isolate;background:linear-gradient(to bottom,rgba(0,0,0,.25),rgba(0,0,0,.45)),url("/theme25/images/estate2025.jpg") center/cover no-repeat;}
.hero h1{font-size: clamp(1.6rem, 1.2rem + 2.5vw, 2.6rem);line-height:1.15; margin:0 0 10px; text-transform:uppercase; letter-spacing:.5px;}
.hero p.lead{margin:0 0 18px; font-size:15px; opacity:.95}


.hero-interna{position:relative; min-height:15svh; display: flex;align-items: flex-end;justify-content: flex-start;color: #fff;text-align: left; isolation:isolate;background:linear-gradient(to bottom,rgba(0,0,0,.25),rgba(0,0,0,.45)),url("/theme25/images/job7.jpg") center/cover no-repeat;}
.hero-interna h1{font-size: 30px; margin:0 0 10px; text-transform:uppercase; letter-spacing:.5px;font-weight: 700}
.hero-interna h1 span{color: var(--accent)}

.hero-interna-viaggio{position:relative; height:300px;color: #fff;text-align: left; isolation:isolate;background:linear-gradient(to bottom,rgba(0,0,0,.25),rgba(0,0,0,.45)),url("/theme25/images/job5.jpg") center/cover no-repeat;}
.hero-interna-viaggio h1{font-size: 30px; margin:0 0 10px; text-transform:uppercase; letter-spacing:.5px;font-weight: 700}



.btn{display: block; appearance:none; border:0; border-radius:999px;padding:14px 22px; font-weight:800; letter-spacing:.4px; cursor:pointer;background:#3f3f3f; color:#fff; box-shadow:var(--shadow); transition:transform .15s ease, background .2s ease;}
.btn--primary{ background:var(--brand) }
.btn--primary:hover{ background:var(--brand-600); transform:translateY(-1px) }
.btn--dark{ background:#3f3f3f }
.btn--dark:hover{ background:var(--accent); transform:translateY(-1px) }
.btn-cta{font-size: 25px;text-transform: uppercase;}

/* ========== Intro testo ========== */
.intro{ padding-block:48px }
.intro h2{ text-align: center;font-weight: 400;font-size: 25px}
.intro p{ margin:0 auto; max-width:800px; text-align:center;font-size: 18px;line-height: 33px;margin-bottom: 15px; }
.intro strong{ font-weight:800 }

/* ========== Sezione: Proposte viaggio (carousel semplice) ========== */
.section-title{text-align:center; font-weight:400; letter-spacing:.5px; font-size: 30px;margin:8px 0 18px;}
.carousel{position:relative; overflow:hidden; padding-inline:12px;}
.cards{display:grid;
  grid-auto-flow: column;
  gap: var(--gap);
  scroll-snap-type: x mandatory;
  overflow-x: auto;
  padding-bottom: 6px;
  /* larghezza di ogni card: (100% - 2 gap) / 3 */
  grid-auto-columns: calc((100% - 2*var(--gap)) / 3);}



.card{background:var(--surface); border-radius:var(--radius);  overflow:hidden;display:grid; grid-template-rows:auto 1fr; scroll-snap-align:start;margin-bottom: 20px;}
.card figure{ margin:0; aspect-ratio:4/3; overflow:hidden;position: relative }
.card figure img{ width:100%; height:100%; object-fit:cover; transition:transform .35s ease }
.card:hover figure img{ transform:scale(1.05) }
.badge{position: absolute;background: #fff;color: #111;padding: 10px 10px;font-weight: 600;font-size: 15px;top: 20px;text-transform: uppercase;text-align: center;}
.ribbon{background:#2f2f2f; color:#fff;padding:.55rem .75rem;display:flex; align-items:center; justify-content:space-between; gap:.75rem;}
.title{text-transform:uppercase;letter-spacing:0;font-weight:400;font-size:12px;white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.rating{display:flex; align-items:center; gap:.35rem; flex:0 0 auto;}
.rating svg{width:22px; height:22px; flex:0 0 22px;fill:#ffc107;}
.card-body{ padding:14px 10px 0px; display:grid; gap:1px }
.card p{display: block;margin: 0 0 5px;}
.card h2{ margin:0;font-size: 20px;font-weight: 700;text-transform: uppercase;}
.card h3{ margin:0;font-size: 15px;font-weight: 400;text-transform: uppercase;}
.price{ width: 50%;background: #111;font-weight: 700;font-size: 30px;color: var(--accent);padding: 15px 15px 10px;text-align: right;line-height: 12px;}
.price span{ font-weight:400; font-size:12px; color:#fff }
.meta{ margin:15px 0; color:var(--muted); font-size:13px }
.partenza{margin: 15px 0 5px;font-size:13px}
.cta-row{ display:flex; align-items:center; justify-content:space-between; gap:10px;  }
.btn--ghost{ flex:1 1 0;width: 50%;   background: #e4e4e4;color: #333;padding: 10px 16px;border-radius: 0;font-weight: 700;text-transform: uppercase;text-align: center;line-height: 21px;min-height: 60px;}
.btn--ghost:hover{ background:var(--brand); color:#fff }

.btn--ghost.evidenza{  background: var(--accent)!important;}

.content-viaggio{}
.content-viaggio p:last-child{margin-bottom: 0;}
.content-viaggio h3{font-weight: 800;margin-bottom: 20px;}
.content-viaggio h4{font-weight: 700;text-transform: uppercase;font-size: 18px;}
.content-viaggio img{height: 100%;width: 100%;object-fit: cover;}
.periodi h2{text-transform: uppercase;text-align: center;margin: 20px 0}
.month-header{background: #111;color: #fff;text-transform: uppercase;font-weight: 400;letter-spacing: .02em;font-size: 18px;padding: 10px;}
.month-group{border-left: 5px solid #111;margin-bottom: 30px}
/* riga periodo */
.period-row{display: grid;grid-template-columns: 1fr 320px 220px;align-items: center;gap: 18px;background: #F2F2F2;padding: 10px;margin-bottom: 20px;}
.period-row:last-child{margin-bottom: 0px;}

/* colonna sinistra (date) */
.col-date .range{font-size: 18px;font-weight: 700;text-transform: uppercase;line-height: 1.05;}
.col-date .range .year{font-weight: 400;margin-left: 8px;}
.col-date .nights{margin-top: 6px;font-size: 12px;font-weight: 400;text-transform: uppercase;}

/* prezzo */
.col-price{display:flex;align-items:center;gap: 14px;}
.col-price .amount{font-size: 18px;font-weight: 700;}
.col-price .currency{margin-right: 4px;}
.col-price .per{font-size: 12px;font-weight: 600;color:#3f3f3f;}

/* CTA */
.col-cta{ display:flex; justify-content: center; }
.btn-choose{width: 100%;background:#eaeaea;border: 0;color:#111;font-weight: 400;text-transform: uppercase;padding: 16px 10px;cursor:pointer;}
.btn-choose:hover{ filter: brightness(0.95); }
.btn-choose--accent{ background: var(--accent); }

/* riga selezionata */
.period-row.is-selected{background: var(--accent);}
.period-row.is-selected .col-price .per{ color:#111 }

.mesi{position: absolute;top: 20px;right: 0;text-align: right;display: block;}
.mesi ul{ margin:0;padding: 0;text-align: center;width: 100%;display: block;text-transform: uppercase;}
.mesi li{list-style: none;background: #ffcc00;padding: 8px 10px;font-size: 12px;margin-bottom: 5px;}

.arrow{position: absolute;top: 40%;translate: 0 -50%; width: 50px;height: 50px;border-radius: 50%;display: grid;place-items: center;background: #fff;color: #111;border: 1px solid #e5e7eb;cursor: pointer;z-index: 99999;font-size: 36px;line-height: 0;padding: 18px;}
.arrow:disabled{opacity:.4; cursor:not-allowed}
.arrow--prev{ left:6px } .arrow--next{ right:6px }

.callout{ text-align:center; padding-block:24px 34px }
.callout .btn{ padding:16px 26px }

.voce-quota{margin: 10px 0;display: flex;}
.quota h3{font-weight: 700;text-transform:uppercase;font-size: 20px;;margin: 20px 0}
.voce-quota img{width: 15px;height: 20px;margin-right: 15px}
.voce-quota span{font-size: 13px}

.features{ padding-block:16px 34px }

.features-grid{
  display: grid;
  gap: 14px;
  grid-template-columns: repeat(4, 1fr);
}

.features-grid-three{
  display: grid;
  gap: 14px;
  grid-template-columns: repeat(3, 1fr);
}

.bck-y{background: #F7A300}
.bck-g{background: #3c761f}
.bck-b{background: #307192}

.text-w{color: #fff!important;}
.catalogoviaggi {}
.catalogoviaggi .intro {text-align: center;font-size: 25px;margin-bottom: 40px;}
.catalogoviaggi .container{max-width: 1440px;}

.feature{ border-radius:var(--radius); padding:18px; border: 1px solid #000;text-align: center}
.feature h4{ margin:.2rem 0 .5rem; font-size:25px;line-height: 30px;font-weight: 400 }
.feature h4 strong{ font-weight: 700 }
.feature p{ margin:0; color:var(--muted) }

/* ========== Steps + CTA ========== */
.steps{ text-align:center; padding-block:18px 8px }
.steps ol{ list-style:decimal; text-align:left; max-width:720px; margin:12px auto; padding-left:1.2rem; color:var(--muted) }

/* ========== Photo strip ========== */
.strip{ display:grid; grid-template-columns:1fr 1fr; gap:8px; margin-block:28px }
.strip img{ width:100%; height:160px; object-fit:cover; border-radius:12px }


/* Colonna filtri (desktop) */
.filters{ position: sticky; top: 16px; }
.filters-header{font-weight: 700; text-transform: uppercase; font-size: .95rem;margin-bottom: .5rem; display:flex; align-items:center;}
.filter-group{border-top: 1px solid #e5e7eb; padding: .35rem 0;}
.filter-group:first-of-type{ border-top: 0; }

/* summary con + / − */
.filter-group > summary{list-style: none; cursor: pointer;display:flex; align-items:center; justify-content: space-between;font-weight: 700; text-transform: uppercase; color:#111; padding: .4rem 0;}
.filter-group > summary::-webkit-details-marker{ display:none; }
.filter-group > summary::after{content: "+"; font-weight: 900; font-size: 20px; line-height: 1;width: 28px; height: 28px; border-radius: 6px; display:grid; place-items:center;background:#f2f2f2; color:#000;}
.filter-group[open] > summary::after{ content: "−"; }

/* elenco voci */
.filter-list{ list-style:none; margin: .4rem 0 .6rem; padding: 0; display:grid; gap: .35rem; }
.filter-list li label{display:flex; align-items:center; justify-content: space-between; gap: .5rem;font-size: .85rem; cursor:pointer;text-transform: uppercase;}
.filter-list .count{ color:#9aa1ad; font-size:.85rem; min-width: 1.5rem; text-align:right }

/* Mesi come chip */
.months-grid{display:grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin: .6rem 0 .8rem;}
.chip-input{ position:absolute; opacity:0; pointer-events:none }
.chip{display:block; text-align:center; padding:.45rem .2rem;background:#ffcc00; color:#111; font-weight:800; font-size:.85rem;border-radius:6px; box-shadow: 0 2px 0 #c79f00; cursor:pointer;user-select:none;}
.chip-input:checked + .chip{outline:2px solid #111; outline-offset:1px; box-shadow:none;}

/* Prezzo */
.price-box .form-range{ --bs-form-range-thumb-bg:#111; }



/* Offcanvas mobile */
.filters-offcanvas{ height: 85dvh; }                  /* altezza comoda */
.filters-offcanvas .offcanvas-body{ overflow:auto; padding-bottom: 100px; }

/* Gruppi (riuso delle regole dei filtri desktop) */
.filters-mobile .filter-group{ border-top:1px solid #e5e7eb; padding:.35rem 0; }
.filters-mobile .filter-group:first-of-type{ border-top:0; }
.filters-mobile .filter-group > summary{
  list-style:none; cursor:pointer; display:flex; align-items:center; justify-content:space-between;
  font-weight:700; text-transform:uppercase; color:#111; padding:.5rem 0;
}
.filters-mobile .filter-group > summary::-webkit-details-marker{ display:none; }
.filters-mobile .filter-group > summary::after{
  content:"+"; font-weight:900; font-size:20px; line-height:1;
  width:28px;height:28px;border-radius:6px;display:grid;place-items:center;background:#f2f2f2;color:#000;
}
.filters-mobile .filter-group[open] > summary::after{ content:"−"; }

.filters-mobile .filter-list{ list-style:none; margin:.4rem 0 .6rem; padding:0; display:grid; gap:.35rem; }
.filters-mobile .filter-list li label{ display:flex; align-items:center; justify-content:space-between; gap:.5rem; }
.filters-mobile .filter-list .count{ color:#9aa1ad; font-size:.85rem; min-width:1.5rem; text-align:right; }

/* chip mesi */
.filters-mobile .months-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:8px; margin:.6rem 0 .8rem; }
.filters-mobile .chip-input{ position:absolute; opacity:0; pointer-events:none; }
.filters-mobile .chip{
  display:block; text-align:center; padding:.55rem 0; background:#ffcc00; color:#111; font-weight:800;
  border-radius:8px; box-shadow:0 2px 0 #c79f00; user-select:none; cursor:pointer;
}
.filters-mobile .chip-input:checked + .chip{ outline:2px solid #111; outline-offset:1px; box-shadow:none; }

/* Footer sticky dell’offcanvas */
.filters-oc-actions{
  position:sticky; bottom:0; background:#fff; border-top:1px solid #e5e7eb;
  padding:12px; z-index:1;
}

section.container, .row, .col-lg-4 { overflow: visible; }
/* stelle */
.rating{ display:inline-flex; gap:.35rem; vertical-align:middle }
.rating svg{ width:20px; height:20px; fill:#ffc107 }

/* riga “badge / pdf / icona”  */
.hero-tools{ margin-top:.75rem }
.hero-tools .badge-tour{display:inline-block; background:var(--accent); color:#111; font-weight:800;text-transform:uppercase; padding:.65rem 1rem; border-radius:.25rem;}
.hero-tools .pdf-link{ font-weight:700 }
.hero-tools .viaggio-sconto{ max-height:80px; width:auto;margin-left: 0px!important; }

.badge-locandina{display:inline-block; background:#111; color:#fff; font-weight:400;text-transform:uppercase; padding:.65rem 1rem; border-radius:.25rem;width: 100%}

/* === ASIDE sticky che “sovrasta” l’hero === */
.sticky-over-hero{
  position: sticky;
  top: var(--stickyTop, 84px);          /* dove si “ancora” quando scrolli */
  margin-top: -280px;             /* tira su la card sopra l’hero (regola tu il valore) */
  z-index: 5;                     /* davanti all’hero */
  background:#fff;
  border-radius:.5rem;
  max-height: calc(100dvh - var(--stickyTop) - 12px);
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
}


.colonna-viaggio{
  align-self: flex-start;                      /* sicurezza con flex parent */
  background:#fff;
  color:#1f1f1f;
  border-radius:.5rem;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;}
.colonna-viaggio .partenza { padding: 15px;margin: 0 }
.colonna-viaggio .partenza p{ margin:0; line-height:1.3 }
.colonna-viaggio .partenza .upp{ text-transform:uppercase; }
.colonna-viaggio .partenza .bold{ font-weight:800 }

.colonna-viaggio .price{margin:0px 0 8px;background:var(--accent); color:#000; padding: 14px 14px 10px; text-align:center;font-weight:900; font-size: 32px; line-height: 1;width: 100%}
.colonna-viaggio .price span{ color:#000; font-weight:600; font-size:15px }

.colonna-viaggio .meta { padding: 15px;margin: 0  }
.colonna-viaggio .meta p{ margin:0 0 6px; color:#333 }
.colonna-viaggio .meta i{ color:#111; margin-right:8px }

/* icone servizi */
.servizi-escusivi {background: #e4e4e4;padding: 15px ;margin: 0 }
.servizi-escusivi ul{ list-style:none; margin:0px; padding:0; text-align: center;}
.servizi-escusivi li{width: 40px;height:40px;display: inline-block;place-items: center;color: #111;font-size: 20px;}

/* punti di forza */
.punti-forza {  }
.punti-forza ul{ list-style:none; padding:0; margin:10px 0 8px; display:grid; gap:6px }
.punti-forza li{ background:#f7f7f7; border-radius:.35rem; padding:10px 12px }
.punti-forza li span{ display:block; font-weight:800 }
.punti-forza li p{ margin:0; color:#666; font-size:.92rem }



/* CTA */


/* box consiglio */
.box-consiglio{position: relative;margin-top:50px;background:#e4e4e4; padding:40px 15px 20px; color:#333;text-align: center;}
.box-consiglio h3{text-transform: uppercase;font-size: 15px;font-weight: 700;margin: 20px 0;}
.ico-consiglio-job{width:60px; height:60px;font-size: 30px; border-radius:50%; background:var(--accent); color:#fff;display:grid; place-items:center; font-weight:700;position: absolute;left: 50%;  top: 0;transform: translate(-50%, -50%);border: 5px solid #fff;}



/* ========== Footer ========== */
footer{
background:#2f3135; color:#e5e7eb; padding-block:34px 22px; margin-top:24px;
}
.foot-top{
display:grid; gap:24px; grid-template-columns:1fr; align-items:start;
}

.foot-logo{ display:flex; align-items:center; gap:12px; font-weight:900 }
.foot-col h5{ margin:.2rem 0 .6rem; font-size:1rem; letter-spacing:.3px }
.foot-col p,.foot-col li{ color:#cbd5e1; margin:0 }
.foot-col ul{ list-style:none; padding:0; margin:0; display:grid; gap:8px }
.subfoot{ border-top:1px solid #3e4146; margin-top:22px; padding-top:14px; color:#b6bcc8; font-size:.9rem; display:flex; justify-content:space-between; gap:10px; flex-wrap:wrap }

.mob{display: none;}
/* Tablet <= 992px: 2 card */
@media (max-width: 991.98px){
  .cards{grid-auto-columns: calc((100% - var(--gap)) / 2);}
	.filters{ display:none; }
.features-grid{
    grid-template-columns: repeat(2, 1fr);
  }
.card{background:var(--surface); border-radius:var(--radius);  overflow:hidden;display:grid; grid-template-rows:auto 1fr; scroll-snap-align:start;margin-bottom: 20px;}
.card figure{ margin:0; aspect-ratio:4/3; overflow:hidden;position: relative }
.card figure img{ width:100%; height:100%; object-fit:cover; transition:transform .35s ease }
.card:hover figure img{ transform:scale(1.05) }
.badge{position: absolute;background: #fff;color: #111;padding: 10px 10px;font-weight: 600;font-size: 15px;top: 20px;text-transform: uppercase;text-align: center;}
.ribbon{background:#2f2f2f; color:#fff;padding:.55rem .75rem;display:flex; align-items:center; justify-content:space-between; gap:.75rem;}
.title{text-transform:uppercase;letter-spacing:.06em;font-weight:400;font-size:15px;white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.rating{display:flex; align-items:center; gap:.35rem; flex:0 0 auto;}
.rating svg{width:22px; height:22px; flex:0 0 22px;fill:#ffc107;}
.card-body{ padding:14px 10px 0px; display:grid; gap:1px }
.card p{display: block;margin: 0 0 5px;}
.card h2{ margin:0;font-size: 20px;font-weight: 700;text-transform: uppercase;}
.card h3{ margin:0;font-size: 15px;font-weight: 400;text-transform: uppercase;}
.price{ width: 50%;background: #111;font-weight: 700;font-size: 30px;color: var(--accent);padding: 15px 15px 10px;text-align: right;line-height: 12px;}

.price span{ font-weight:400; font-size:12px; color:#fff }
.meta{ margin:15px 0; color:var(--muted); font-size:13px }
.partenza{margin: 15px 0 5px;font-size:13px}
.cta-row{ display:flex; align-items:center; justify-content:space-between; gap:10px;  }
.btn--ghost{ width: 50%;   background: #e4e4e4;color: #333;padding: 10px 16px;border-radius: 0;font-weight: 400;text-transform: uppercase;text-align: center;line-height: 21px;}
.btn--ghost:hover{ background:var(--brand); color:#fff }
	 
.mesi{position: absolute;top: 20px;right: 0;text-align: right;display: block;}
.mesi ul{ margin:0;padding: 0;text-align: center;width: 100%;display: block;text-transform: uppercase;}
.mesi li{list-style: none;background: #ffcc00;padding: 8px 10px;font-size: 12px;margin-bottom: 5px;}
	.colonna-viaggio{
    position: static;
    max-height: none;
    overflow: visible;
  }
	.sticky-over-hero{
    position: static;
    margin-top: 0;
    max-height: none;
    overflow: visible;
  }
	
}

/* Mobile <= 576px: 1 card */
@media (max-width: 575.98px){
  .cards{grid-auto-columns: 100%;}
	.features-grid{
    grid-template-columns: 1fr;
  }
	.features-grid-three{
    grid-template-columns: 1fr;
  }
	.no-pad-r-mobile{padding-right: 0}
.no-pad-l-mobile{padding-left: 0}
.card-mobile{background:var(--surface); border-radius:0;  overflow:hidden;display:grid; grid-template-rows:auto 1fr; scroll-snap-align:start;margin-bottom: 20px;}
.card-mobile figure { width:100%; height:100%; object-fit:cover; }
.card-mobile figure img{ width:100%; height:100%; object-fit:cover; transition:transform .35s ease }
.card-mobile:hover figure img{ transform:scale(1.05) }
.badge-mobile{position: relative;background: #fff;color: #000;padding:11px 5px;font-weight: 600;font-size: 10px;top: 0px;text-transform: uppercase;text-align: center;border-radius: 0;width: 100%;display: block;}
.ribbon-mobile{background:#2f2f2f; color:#fff;padding:.55rem .75rem;display:flex; align-items:center; justify-content:space-between; gap:.75rem;}
.title-mobile{text-transform:uppercase;letter-spacing:.06em;font-weight:400;font-size:11px;white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.rating-mobile{display:flex; align-items:center; gap:.35rem; flex:0 0 auto;}
.rating-mobile svg{width:15px; height:15px; flex:0 0 15px;fill:#ffc107;}
.card-body-mobile{ padding:14px 10px 0px; display:grid; gap:1px }
.card-mobile p{display: block;margin: 0 0 5px;}
.card-mobile h2{ margin:0;font-size: 13px;font-weight: 700;text-transform: uppercase;}
.card-mobile h3{ margin:0;font-size: 10px;font-weight: 400;text-transform: uppercase;}
.price-mobile{ width: 100%;background: #FFF;font-weight: 400;font-size: 18px;color: #333;padding: 0px;text-align: left;line-height: 12px;}
.price-mobile span{ font-weight:400; font-size:11px; color:#000 }
.meta-mobile{ margin:15px 0; color:var(--muted); font-size:11px }
.partenza-mobile{margin: 15px 0 5px;font-size:11px}
.cta-row-mobile{ display:flex; align-items:center; justify-content:space-between; gap:10px;  }
.btn--ghost-mobile{ width: 100%;   background: #e4e4e4;color: #333;padding: 10px 16px;border-radius: 0;font-weight: 400;text-transform: uppercase;text-align: center;line-height: 21px;font-size: 12px}
.btn--ghost-mobile:hover{ background:var(--brand); color:#fff }

.mesi-mobile{position: relative;top: 0px;right: 0;text-align: right;display: block;}
.mesi-mobile ul{ margin:0;padding: 0;text-align: center;width: 100%;display: block;text-transform: uppercase;}
.mesi-mobile li{list-style: none;background: #ffcc00;padding: 5px;font-size: 10px;margin-bottom: 5px;}

	.mob{display: block;}
}
.none{display:none;}
.preventivo {
    font-size: 30px;
    line-height: 80px;
    color: #fff;
    font-weight: 400;
    text-transform: uppercase;
}
.titolo-quota {
    font-size: 25px;
    font-weight: 300;
    line-height: 40px;
    text-transform: uppercase;
}
.bt-yellow {
    background-color: #FFC101;}
/* Motion safe */
@media (prefers-reduced-motion:reduce){
.card:hover figure img{ transform:none }
.cards{ scroll-behavior:auto }
.btn{ transition:none }
}
.periodi {
    border-top: 5px solid var(--accent);
    border-bottom: 5px solid var(--accent);
    padding: 30px 0;
    background: var(--accent);
}