/* destinazioni.css - pagina /destinazioni/
   Da caricare DOPO pagine-base.css e pagine-istituzionali.css (hero .page-hero, .info-bar, nav.bc, .shop-*, .cta-final).
   Sostituisce il vecchio blocco <style> inline della pagina (catalog-hero, area-card con icona, dest-chip, tema-card). */

/* ---------- toolbar ricerca + filtri ---------- */
.dest-toolbar{position:sticky;top:var(--vg-header-h,7.5rem);z-index:20;background:rgba(249,249,255,.94);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid rgba(20,27,43,.06)}
@media(max-width:767px){.dest-toolbar{top:var(--vg-header-h-mobile,4.5rem)}}
.dest-toolbar .wrap{display:flex;flex-wrap:wrap;align-items:center;gap:.625rem 1rem;padding-top:.75rem;padding-bottom:.75rem}
.dest-search{position:relative;display:flex;align-items:center;flex:1 1 14rem;max-width:22rem}
.dest-search > .material-symbols-outlined{position:absolute;left:.95rem;color:var(--muted);font-size:1.25rem;pointer-events:none}
.dest-search input{width:100%;min-height:46px;padding:.65rem 2.75rem .65rem 2.75rem;background:#fff;border:1px solid rgba(20,27,43,.12);border-radius:9999px;font:500 .9375rem var(--font-body);color:var(--ink)}
.dest-search input:focus{outline:3px solid rgba(237,39,140,.3);border-color:var(--pink)}
.search-clear{position:absolute;right:.35rem;display:none;align-items:center;justify-content:center;width:40px;height:40px;border:0;border-radius:50%;background:transparent;color:var(--muted);cursor:pointer}
.dest-search.has-value .search-clear{display:inline-flex}
.dest-counter{margin-left:auto}
/* filtri: sempre una sola riga, scorrevole se non ci sta (toolbar sticky bassa) */
.pill-filter{order:3;flex:1 1 100%;display:flex;gap:.5rem;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch;margin:0 -1.25rem;padding:0 1.25rem .125rem;scroll-padding:0 1.25rem}
.pill-filter::-webkit-scrollbar{display:none}
@media(min-width:1280px){.pill-filter{margin:0;padding:0 0 .125rem}}
.pill-filter .pill{flex:0 0 auto;display:inline-flex;align-items:center;gap:.375rem;min-height:44px;padding:.45rem .95rem;white-space:nowrap;background:#fff;border:1px solid rgba(20,27,43,.12);border-radius:9999px;font:600 .875rem var(--font-display);color:var(--ink);cursor:pointer;transition:background .2s ease,border-color .2s ease,color .2s ease}
.pill-filter .pill .material-symbols-outlined{font-size:1.1rem;color:var(--pink-dark)}
.pill-filter .pill:hover{border-color:rgba(237,39,140,.45)}
.pill-filter .pill[aria-pressed="true"]{background:var(--pink-btn,#DB1F7C);border-color:var(--pink-btn,#DB1F7C);color:#fff}
.pill-filter .pill[aria-pressed="true"] .material-symbols-outlined{color:#fff}
.dest-counter{font:600 .875rem var(--font-display);color:var(--muted);white-space:nowrap}
.dest-counter strong{color:var(--ink)}

/* ---------- griglia aree geografiche con foto ---------- */
.area-grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,1fr);gap:.75rem}
@media(min-width:768px){.area-grid{grid-template-columns:repeat(3,1fr);gap:1.25rem}}
.area-card{position:relative;display:block;aspect-ratio:4/5;border-radius:1.25rem;overflow:hidden;background:#0f1822;color:#fff;box-shadow:0 10px 28px rgba(17,24,39,.12);isolation:isolate;transition:transform .3s ease,box-shadow .3s ease}
@media(min-width:480px) and (max-width:767px){.area-card{aspect-ratio:4/3}}
@media(min-width:768px){.area-card{aspect-ratio:16/10}}
.area-card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;transition:transform .6s cubic-bezier(.2,.7,.2,1)}
.area-card::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(15,24,34,0) 30%,rgba(15,24,34,.35) 58%,rgba(15,24,34,.86) 100%)}
.area-card-body{position:absolute;left:0;right:0;bottom:0;padding:1rem 1rem 1.05rem}
@media(min-width:768px){.area-card-body{padding:1.35rem 1.5rem 1.4rem}}
.area-card-count{display:block;font:700 .625rem var(--font-display);letter-spacing:.16em;text-transform:uppercase;color:rgba(255,255,255,.82);margin-bottom:.3rem}
@media(min-width:768px){.area-card-count{font-size:.6875rem}}
.area-card-name{display:block;font:800 1.0625rem/1.15 var(--font-display);letter-spacing:-.01em;text-shadow:0 1px 12px rgba(0,0,0,.35)}
@media(min-width:768px){.area-card-name{font-size:1.4rem}}
.area-card-go{position:absolute;top:.75rem;right:.75rem;display:inline-flex;align-items:center;justify-content:center;width:2.25rem;height:2.25rem;border-radius:50%;background:var(--pink-btn,#DB1F7C);color:#fff;box-shadow:0 6px 18px rgba(219,31,124,.4);transition:opacity .25s ease,transform .25s ease}
.area-card-go .material-symbols-outlined{font-size:1.15rem}
@media(hover:hover) and (min-width:768px){
  .area-card-go{opacity:0;transform:translateY(-4px)}
  .area-card:hover .area-card-go,.area-card:focus-visible .area-card-go{opacity:1;transform:none}
}
.area-card:hover{transform:translateY(-4px);box-shadow:0 18px 40px rgba(17,24,39,.2)}
.area-card:hover img{transform:scale(1.06)}
.area-card:focus-visible{outline:3px solid var(--pink);outline-offset:3px}

/* ---------- blocchi per area ---------- */
.area-block{padding:2.75rem 0;scroll-margin-top:calc(var(--vg-header-h,7.5rem) + 6rem)}
.area-block + .area-block{border-top:1px solid rgba(20,27,43,.07)}
@media(min-width:768px){.area-block{padding:3.5rem 0}}
.area-block.is-hidden{display:none}
.area-head{display:grid;grid-template-columns:1fr;gap:1rem;margin-bottom:1.5rem}
@media(min-width:960px){.area-head{grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:2rem}}
.area-kicker{display:inline-flex;align-items:center;gap:.4rem;font:700 .75rem var(--font-display);letter-spacing:.16em;text-transform:uppercase;color:var(--pink-dark);margin-bottom:.4rem}
.area-kicker .material-symbols-outlined{font-size:1.05rem}
.area-h2{font:800 clamp(1.5rem,3.2vw,2rem)/1.15 var(--font-display);letter-spacing:-.012em;color:var(--ink);text-wrap:balance}
.area-intro{margin-top:.6rem;max-width:46rem;font-size:.9688rem;line-height:1.65;color:var(--muted);text-wrap:pretty}
.area-quote{display:inline-flex;align-items:center;gap:.35rem;min-height:44px;font:700 .9rem var(--font-display);color:var(--pink-dark);white-space:nowrap}
.area-quote:hover{color:var(--pink)}

/* ---------- elenco destinazioni: solo nomi (compatto anche con 80+ mete) ---------- */
.dest-list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.5rem}
@media(min-width:640px){.dest-list{grid-template-columns:repeat(auto-fill,minmax(13rem,1fr));gap:.625rem}}
.dest-list > li{min-width:0}
.dest-list > li[hidden]{display:none}
.dest-chip{position:relative;height:100%;display:flex;align-items:center;gap:.75rem;min-height:60px;padding:.55rem .6rem .55rem .55rem;background:#fff;border:1px solid rgba(20,27,43,.07);border-radius:1rem;box-shadow:0 1px 2px rgba(17,24,39,.04),0 6px 16px rgba(17,24,39,.04);color:var(--ink);transition:border-color .2s ease,box-shadow .2s ease,transform .2s ease}
.dest-chip .material-symbols-outlined{overflow:hidden}
.dest-chip-ico{flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;width:2.5rem;height:2.5rem;border-radius:.75rem;background:linear-gradient(135deg,#fde9f0 0%,#fbd3e4 100%);color:var(--pink-dark);transition:background .2s ease,color .2s ease}
.dest-chip-ico .material-symbols-outlined{font-size:1.2rem;width:1.2rem}
.dest-chip-txt{flex:1;min-width:0;display:flex;flex-direction:column;gap:.1rem}
.dest-chip-name{font:800 .9688rem/1.2 var(--font-display);letter-spacing:-.005em;overflow-wrap:anywhere}
.dest-chip-cta{font:600 .75rem/1.2 var(--font-body);color:var(--muted);transition:color .2s ease}
.dest-chip-go{flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;width:2rem;height:2rem;border-radius:50%;background:#f3f4f8;color:var(--ink);transition:background .2s ease,color .2s ease,transform .2s ease}
.dest-chip-go .material-symbols-outlined{font-size:1rem;width:1rem}
.dest-chip:hover{border-color:rgba(237,39,140,.35);box-shadow:0 12px 28px rgba(219,31,124,.12);transform:translateY(-2px)}
.dest-chip:hover .dest-chip-ico{background:var(--pink-btn,#DB1F7C);color:#fff}
.dest-chip:hover .dest-chip-cta{color:var(--pink-dark)}
.dest-chip:hover .dest-chip-go{background:var(--pink-btn,#DB1F7C);color:#fff;transform:translateX(2px)}
.dest-chip:focus-visible{outline:3px solid rgba(237,39,140,.5);outline-offset:2px}
@media(max-width:420px){.dest-chip{gap:.55rem;padding:.5rem}.dest-chip-ico{width:2.125rem;height:2.125rem}.dest-chip-go{display:none}}

/* nessun risultato ricerca */
.dest-empty{display:none;text-align:center;padding:3rem 1rem}
.dest-empty.is-visible{display:block}
.dest-empty .h2{font-size:1.375rem}

/* ---------- FAQ ---------- */
.dest-faq{max-width:52rem;margin:0 auto;display:flex;flex-direction:column;gap:.75rem}
.dest-faq details{background:#fff;border:1px solid var(--card-border);border-radius:1rem;box-shadow:var(--shadow)}
.dest-faq summary{display:flex;align-items:center;justify-content:space-between;gap:1rem;min-height:56px;padding:1rem 1.25rem;font:700 1rem/1.35 var(--font-display);color:var(--ink);cursor:pointer;list-style:none}
.dest-faq summary::-webkit-details-marker{display:none}
.dest-faq summary .material-symbols-outlined{color:var(--pink-dark);transition:transform .2s ease}
.dest-faq details[open] summary .material-symbols-outlined{transform:rotate(45deg)}
.dest-faq details p{padding:0 1.25rem 1.15rem;font-size:.9375rem;line-height:1.65;color:#26303f}

/* ---------- recensioni (markup invariato dalla versione precedente) ---------- */
.rev-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:1rem}
@media(min-width:640px){.rev-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(min-width:1024px){.rev-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:1.25rem}}
.rev-card{display:flex;flex-direction:column;gap:.75rem;background:#fff;border:1px solid var(--card-border);border-radius:1.125rem;padding:1.375rem;box-shadow:var(--shadow);transition:transform .25s ease,box-shadow .25s ease}
.rev-card:hover{transform:translateY(-3px);box-shadow:var(--shadow-hover)}
.rev-stars{display:flex;gap:.125rem;color:#f5a623}
.rev-stars .material-symbols-outlined{font-size:1.125rem}
.rev-text{font-size:.9rem;line-height:1.6;color:var(--ink);flex:1;display:-webkit-box;-webkit-line-clamp:6;-webkit-box-orient:vertical;overflow:hidden}
.rev-author{display:flex;align-items:center;gap:.75rem}
.rev-avatar{display:inline-flex;align-items:center;justify-content:center;width:2.5rem;height:2.5rem;border-radius:9999px;background:#fde9f0;color:var(--pink-dark);font-family:var(--font-display);font-weight:800;font-size:.875rem;flex-shrink:0}
.rev-name{font-family:var(--font-display);font-weight:700;font-size:.875rem;color:var(--ink)}
.rev-trip{font-size:.75rem;color:var(--muted)}

@media(prefers-reduced-motion:reduce){.area-card,.area-card img,.dest-chip,.dest-chip-go{transition:none}.area-card:hover img,.dest-chip:hover,.dest-chip:hover .dest-chip-go{transform:none}}
