/* ==========================================================================
   Home page: hero con presentazione di foto e scheda di ricerca, fascia di fiducia, partenze, temi, «perché Ithaka» con numeri, mappa, offerte, recensioni, fasce
   Le schede (.tcard .dcard .thcard .dep .pcard .rcard) e i componenti comuni (.dgrid .dchips .cta-card…) stanno in site.css.
   Regole iPhone: niente elementi fissi o sticky qui; la foto del hero scorre con la pagina dietro la testata a pillola.
   ========================================================================== */

/* ---------- hero ---------- */
.hero { position: relative; isolation: isolate; display: flex; flex-direction: column; justify-content: center; min-height: min(100svh, 900px); color: #fff; background: var(--navy-950); }
.hero__bg { position: absolute; inset: 0; z-index: -1; overflow: hidden; background: linear-gradient(135deg, var(--navy-900) 0%, var(--navy-700) 58%, var(--aegean-500) 135%); }
.hero__slides { position: absolute; inset: 0; }
.hero__slide { position: absolute; inset: 0; opacity: 0; transition: opacity 1.6s ease; }
.hero__slide.is-on { opacity: 1; }
.hero__slide img, .hero__slide .ph { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 68% 50%; }
.hero__slide.is-on img { animation: hero-zoom 14s ease-out both; }
@keyframes hero-zoom { from { transform: scale(1.09); } to { transform: scale(1); } }
/* senza foto (ancora da generare) ogni diapositiva è un tramonto diverso */
.hero__slide .ph { border-radius: 0; place-items: center end; padding-right: 9%; color: rgba(255, 255, 255, .14); }
.hero__slide .ph .i { width: min(36vw, 240px); height: min(36vw, 240px); stroke-width: .6; }
.hero__slide--1 .ph { background: linear-gradient(118deg, #0b2f55 0%, #145f9f 55%, #7dbbe2 120%); }
.hero__slide--2 .ph { background: linear-gradient(118deg, #2b1a35 0%, #8a3b55 55%, #f4b1bf 125%); }
.hero__slide--3 .ph { background: linear-gradient(118deg, #3a2012 0%, #b9651f 55%, #f2bd66 125%); }
.hero__slide--4 .ph { background: linear-gradient(118deg, #0d2238 0%, #2f6f86 55%, #e6ad76 125%); }
.hero__veil { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(7, 24, 43, .84) 0%, rgba(7, 24, 43, .56) 44%, rgba(7, 24, 43, .12) 82%), linear-gradient(180deg, rgba(7, 24, 43, .55) 0%, rgba(7, 24, 43, 0) 26%, rgba(7, 24, 43, 0) 62%, rgba(7, 24, 43, .6) 100%); }
@media (max-width: 899px) { .hero__veil { background: linear-gradient(180deg, rgba(7, 24, 43, .6) 0%, rgba(7, 24, 43, .52) 48%, rgba(7, 24, 43, .74) 100%); } }
.hero :focus-visible { outline-color: var(--sun); }

.hero__inner { display: grid; align-content: center; gap: clamp(18px, 2.6vw, 30px); padding-block: clamp(18px, 4vw, 52px) clamp(28px, 5vw, 60px); }
.hero__copy { display: grid; gap: 16px; max-width: 720px; }
.hero h1 { font-size: clamp(2.35rem, 1.2rem + 5.2vw, 5.1rem); line-height: 1.04; letter-spacing: -.02em; color: #fff; }
.hero h1 em { font-style: normal; color: var(--sun); }
.hero__lead { max-width: 58ch; font-size: clamp(1rem, .95rem + .45vw, 1.24rem); line-height: 1.55; color: rgba(255, 255, 255, .9); }

/* scheda di ricerca: campi a segmenti, su telefono uno sotto l'altro */
.search-card { position: relative; z-index: 20; display: grid; max-width: 1060px; padding: 8px; border-radius: var(--r-xl); background: var(--white); color: var(--ink); box-shadow: var(--shadow-lg); }
.sc-field { position: relative; display: grid; gap: 1px; min-width: 0; padding: 9px 14px 7px; border-radius: var(--r-lg); transition: background-color .2s; }
.sc-field + .sc-field { border-top: 1px solid var(--line-2); border-radius: 0; }
.sc-field:focus-within { background: var(--sea-50); }
.sc-field > label { font: 700 .7rem/1.2 var(--font-body); letter-spacing: .11em; text-transform: uppercase; color: var(--muted); }
.sc-control { display: flex; align-items: center; gap: 10px; min-width: 0; }
.sc-control .i { color: var(--aegean-500); }
.sc-select { flex: 1; min-width: 0; min-height: 44px; padding: 0 30px 0 0; border: 0; border-radius: 0; background-color: transparent; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%235b6e83' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 2px center; font: 650 16px/1.3 var(--font-body); color: var(--ink); text-overflow: ellipsis; cursor: pointer; -webkit-appearance: none; appearance: none; }
.sc-select:focus { outline: none; }
.sc-field:has(.sc-select:focus-visible) { outline: 3px solid var(--aegean-500); outline-offset: -3px; }
.sc-input { cursor: text; }
.sc-input::placeholder { color: var(--ink); opacity: 1; }
.sc-submit { margin: 8px 4px 4px; }
@media (min-width: 640px) {
  .search-card { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .sc-dest { grid-column: 1 / -1; }
  .sc-field + .sc-field { border-radius: 0; }
  .sc-dest + .sc-field + .sc-field { border-left: 1px solid var(--line-2); }
  .sc-submit { grid-column: 1 / -1; }
}
@media (min-width: 1000px) {
  .search-card { grid-template-columns: minmax(0, 1.7fr) minmax(0, 1.05fr) minmax(0, 1fr) auto; align-items: stretch; padding: 8px 8px 8px 12px; }
  .sc-dest { grid-column: auto; }
  .sc-field { padding: 11px 18px 9px; }
  .sc-field + .sc-field { border-top: 0; border-left: 1px solid var(--line-2); }
  .sc-dest + .sc-field + .sc-field { border-left: 1px solid var(--line-2); }
  .sc-submit { grid-column: auto; margin: 0; align-self: center; min-height: 64px; padding-inline: 34px; }
  .sc-dest .suggest { min-width: 420px; }
}
.sc-dest .suggest { top: calc(100% + 10px); }

.hero__quick { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 14px; color: rgba(255, 255, 255, .82); font-weight: 650; font-size: .92rem; }
.hero__quick ul { display: flex; flex-wrap: wrap; gap: 8px; }
.hero__tools { display: flex; align-items: center; justify-content: space-between; gap: 12px 20px; flex-wrap: wrap; margin-top: -4px; color: rgba(255, 255, 255, .8); font: 650 .84rem/1.3 var(--font-body); }
.hero__caption { display: inline-flex; align-items: center; gap: 8px; }
.hero__caption .i { color: var(--sun); }
.hero__dots { display: flex; margin-right: -12px; }
.hero__dot { position: relative; width: 44px; height: 44px; padding: 0; border: 0; background: none; cursor: pointer; }
.hero__dot::before { content: ''; position: absolute; left: 50%; top: 50%; width: 22px; height: 4px; margin: -2px 0 0 -11px; border-radius: 2px; background: rgba(255, 255, 255, .42); transition: width .3s var(--ease), margin .3s var(--ease), background-color .3s; }
.hero__dot.is-on::before { width: 34px; margin-left: -17px; background: var(--sun); }
@media (hover: hover) { .hero__dot:hover::before { background: rgba(255, 255, 255, .8); } .hero__dot.is-on:hover::before { background: var(--sun); } }
@media (prefers-reduced-motion: reduce) { .hero__slide { transition: none; } .hero__slide.is-on img { animation: none; } }

/* ---------- fascia di fiducia ---------- */
.trust { position: relative; z-index: 1; background: var(--white); border-bottom: 1px solid var(--line-2); }
.trust__list { display: grid; grid-template-columns: minmax(0, 1fr); padding-block: 6px; }
.trust__item { display: flex; align-items: flex-start; gap: 14px; padding: 16px 4px; }
.trust__item + .trust__item { border-top: 1px dashed var(--line); }
.trust__icon { display: grid; place-items: center; flex: none; width: 48px; height: 48px; border-radius: 16px; background: var(--sun-100); color: var(--sun-700); }
.trust__icon .i { width: 24px; height: 24px; }
.trust__item b { display: block; font: 700 1rem/1.3 var(--font-body); color: var(--ink); }
.trust__item p { margin-top: 2px; color: var(--muted); font-size: .88rem; line-height: 1.45; }
@media (min-width: 700px) { .trust__list { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 28px; } .trust__item:nth-child(2) { border-top: 0; } }
@media (min-width: 1100px) { .trust__list { grid-template-columns: repeat(4, minmax(0, 1fr)); column-gap: 24px; } .trust__item { padding-block: 24px; } .trust__item + .trust__item { border-top: 0; } }

/* ---------- destinazioni: i chip dei continenti stanno sopra la griglia ---------- */
.dchips { margin-bottom: 14px; }

/* ---------- prossime partenze: scorrimento orizzontale su telefono e tablet, due colonne da 1100 px ---------- */
.deps > .dep { flex: 0 0 min(88%, 440px); }
@media (min-width: 1100px) {
  .deps { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; overflow: visible; margin-inline: 0; padding: 0; }
  .deps > .dep { flex: none; }
}

/* ---------- temi di viaggio ---------- */
.thgrid { display: grid; gap: 12px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (min-width: 700px) { .thgrid { grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 14px; } }
.thgrid .thcard h3 { font-size: clamp(1.05rem, .75rem + 1vw, 1.55rem); overflow-wrap: anywhere; }
.thgrid .thcard p { display: none; }
.thgrid .thcard__body { padding: 14px; }
.thgrid .thcard__icon { left: 12px; top: 12px; width: 40px; height: 40px; border-radius: 12px; }
@media (min-width: 1100px) { .thgrid .thcard p { display: block; } .thgrid .thcard__body { padding: 20px; } .thgrid .thcard__icon { left: 18px; top: 18px; width: 46px; height: 46px; } }

/* ---------- perché Ithaka + numeri ---------- */
.why .feature h3 { color: #fff; }
.why .feature p { color: rgba(255, 255, 255, .74); }
.why .feature__icon { background: rgba(238, 164, 58, .16); color: var(--sun); }
.why__grid { margin-bottom: clamp(36px, 5vw, 64px); }
.stats { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1px; overflow: hidden; border-radius: var(--r-xl); background: rgba(255, 255, 255, .16); border: 1px solid rgba(255, 255, 255, .16); }
.stat { display: grid; gap: 6px; align-content: center; padding: 26px 16px; text-align: center; background: var(--navy-900); }
.stat dt { order: 2; color: rgba(255, 255, 255, .72); font: 600 .86rem/1.35 var(--font-body); }
.stat dd { order: 1; margin: 0; font: 500 clamp(2.2rem, 1.3rem + 3.2vw, 3.6rem)/1 var(--font-display); letter-spacing: -.02em; color: var(--sun); }
.stat__x { font-size: .55em; margin-left: 2px; }
@media (min-width: 900px) { .stats { grid-template-columns: repeat(4, minmax(0, 1fr)); } .stat { padding: 34px 20px; } }

/* ---------- mappa del mondo ---------- */
[data-world-map]:not(.map) { position: relative; overflow: hidden; height: var(--map-h, 420px); border-radius: var(--r-xl); border: 1px solid var(--line-2); background: linear-gradient(135deg, var(--sea-100), #cfe3f2); box-shadow: var(--shadow-md); }
.map-fallback { padding: 24px; color: var(--muted); font-weight: 600; }
.legend { display: flex; flex-wrap: wrap; gap: 8px 20px; margin-top: 18px; color: var(--ink-2); font-size: .88rem; font-weight: 650; }
.legend li { display: inline-flex; align-items: center; gap: 8px; }

/* ---------- offerte ---------- */
.ocard { position: relative; display: flex; flex-direction: column; overflow: clip; border-radius: var(--r-xl); background: var(--white); border: 1px solid var(--line-2); box-shadow: var(--shadow-sm); transition: transform .35s var(--ease), box-shadow .35s var(--ease); }
@media (hover: hover) { .ocard:hover { transform: translateY(-4px); box-shadow: var(--shadow-lg); } .ocard:hover .ocard__media img { transform: scale(1.05); } }
.ocard__media { position: relative; aspect-ratio: 16 / 10; overflow: hidden; background: var(--sea-100); }
.ocard__media img, .ocard__media .ph { width: 100%; height: 100%; object-fit: cover; transition: transform .8s var(--ease); }
.ocard__badges { position: absolute; z-index: 2; left: 14px; top: 14px; display: flex; flex-wrap: wrap; gap: 6px; }
.ocard__body { display: flex; flex-direction: column; gap: 8px; flex: 1; padding: 18px 20px 20px; }
.ocard__place { display: flex; align-items: center; gap: 6px; color: var(--aegean-600); font: 700 .78rem/1 var(--font-body); letter-spacing: .09em; text-transform: uppercase; }
.ocard__place .i { width: 1.1em; height: 1.1em; }
.ocard__title { font-size: 1.32rem; line-height: 1.2; }
.ocard__title a::after { content: ''; position: absolute; inset: 0; z-index: 1; }
.ocard__when { display: flex; align-items: center; gap: 8px; color: var(--muted); font-size: .9rem; font-weight: 600; }
.ocard__foot { display: flex; align-items: flex-end; justify-content: space-between; gap: 12px; margin-top: auto; padding-top: 14px; border-top: 1px dashed var(--line); }
.ocard__foot .seats { text-align: right; }

/* ---------- recensioni ---------- */
.rate-pill { display: inline-flex; align-items: center; gap: 14px; min-height: 56px; padding: 8px 20px 8px 18px; border-radius: 999px; background: var(--sun-50); border: 1px solid var(--sun-100); transition: background-color .2s; }
.rate-pill strong { font: 500 2.2rem/1 var(--font-display); color: var(--navy-900); }
.rate-pill > span { display: grid; gap: 2px; }
.rate-pill small { color: var(--muted); font-size: .8rem; font-weight: 600; }
.rate-pill .i { color: var(--sun-700); }
@media (hover: hover) { .rate-pill:hover { background: var(--sun-100); } }
.rgrid .rcard blockquote { display: -webkit-box; -webkit-line-clamp: 6; -webkit-box-orient: vertical; overflow: hidden; }
@media (max-width: 639px) { .rgrid > :nth-child(n + 4) { display: none; } }

/* ---------- fasce con foto: viaggio su misura e newsletter ---------- */
.band { position: relative; isolation: isolate; overflow: hidden; border-radius: var(--r-xl); background: var(--navy-900); color: #fff; }
.band__bg { position: absolute; inset: 0; z-index: -2; }
.band__bg img, .band__bg .ph { width: 100%; height: 100%; object-fit: cover; border-radius: 0; }
.band__bg .ph { place-items: center end; padding-right: 9%; background: linear-gradient(125deg, var(--navy-800), var(--aegean) 70%, var(--sun-600) 150%); color: rgba(255, 255, 255, .14); }
.band::after { content: ''; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, rgba(7, 24, 43, .92) 0%, rgba(7, 24, 43, .74) 55%, rgba(7, 24, 43, .38) 100%); }
@media (max-width: 719px) { .band::after { background: linear-gradient(180deg, rgba(7, 24, 43, .8), rgba(7, 24, 43, .9)); } }
.band :focus-visible { outline-color: var(--sun); }
.band__in { display: grid; gap: 16px; max-width: 660px; padding: clamp(28px, 5vw, 64px); }
.band .eyebrow { color: var(--sun); }
.band h2 { font-size: clamp(1.8rem, 1.1rem + 2.6vw, 3rem); color: #fff; }
.band p { color: rgba(255, 255, 255, .86); }
.band__points { display: flex; flex-wrap: wrap; gap: 8px 22px; font-weight: 650; font-size: .94rem; }
.band__points li { display: inline-flex; align-items: center; gap: 8px; }
.band__points .i { color: var(--sun); }
.band .row { margin-top: 6px; }
.news-form { display: grid; gap: 6px; max-width: 480px; margin-top: 6px; }
.band .news-msg { margin: 0; }