﻿/* Viaggiscoop redesign — destinazioni (continente + paese) */
/* hero paese */
.hero{background:linear-gradient(135deg,var(--navy) 0%,var(--blue) 55%,var(--blue2) 100%);padding:56px 0 72px;position:relative;overflow:hidden;min-height:auto}
.hero::before{content:"";position:absolute;inset:0;background:radial-gradient(60% 120% at 82% 12%,rgba(77,184,255,.16),transparent 60%)}
.hero .hero-foto{position:absolute;inset:0;z-index:0;background-size:cover;background-position:center}
.hero .hero-foto::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(8,18,38,.90) 0%,rgba(8,18,38,.58) 46%,rgba(8,18,38,.92) 100%)}
.hero .in{position:relative;z-index:1;max-width:var(--w);margin:0 auto;padding:0 24px}
.crumbs{font-size:12.5px;color:#9FB4D4;margin-bottom:20px;display:flex;gap:7px;flex-wrap:wrap;align-items:center}
.crumbs a:hover{color:#fff}
.hero .kicker{display:inline-flex;align-items:center;gap:10px;font-size:12px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--cyan);margin-bottom:14px}
.hero h1{font-family:var(--serif);font-weight:600;font-size:clamp(40px,5.5vw,68px);color:#fff;letter-spacing:-.02em;line-height:1.03}
.hero .lead{color:#C7D6EC;font-size:16px;margin-top:14px;max-width:64ch;line-height:1.6}
.hero .stats{display:flex;gap:28px;margin-top:28px;flex-wrap:wrap;background:none;border-top:none}
.hero .stats .st b{font-family:var(--serif);font-weight:600;font-size:30px;color:#fff;display:block}
.hero .stats .st span{font-size:12.5px;color:#8BA3C7}

/* sezioni */
section.block{padding:56px 0}
.sec-head{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin-bottom:24px;flex-wrap:wrap}
.sec-head h2{font-family:var(--serif);font-weight:600;font-size:clamp(24px,3vw,34px);letter-spacing:-.02em}
.sec-head .sub{color:var(--muted);font-size:14px;margin-top:7px}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.card{background:var(--card);border-radius:16px;overflow:hidden;border:1px solid var(--line);display:flex;flex-direction:column;transition:.2s;box-shadow:0 1px 2px rgba(8,18,38,.04)}
.card:hover{transform:translateY(-4px);box-shadow:0 22px 44px -28px rgba(8,18,38,.45);border-color:#C9D6E8}
.card .ph{position:relative;aspect-ratio:16/10;overflow:hidden;background:var(--navy2)}
.card .ph img{width:100%;height:100%;object-fit:cover;transition:transform .5s ease}
.card:hover .ph img{transform:scale(1.05)}
.card .ph .year{position:absolute;right:12px;top:12px;background:rgba(8,18,38,.7);color:#fff;font-size:11px;font-weight:600;padding:3px 10px;border-radius:99px}
.card .bd{padding:16px 18px 18px;display:flex;flex-direction:column;gap:7px;flex:1}
.card .country{font-size:11px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--blue2)}
.card h3{font-family:var(--serif);font-weight:600;font-size:19px;line-height:1.24}
.card h3 a:hover{color:var(--elec)}
.card .foot{margin-top:auto;padding-top:11px;border-top:1px solid var(--line);display:flex;justify-content:space-between;font-size:12.5px;color:var(--muted)}
.card .foot b{font-weight:600;color:var(--ink)}
/* mete */
.mete{display:flex;flex-wrap:wrap;gap:10px}
.mete a{display:inline-flex;align-items:center;gap:9px;background:var(--card);border:1px solid var(--line);border-radius:99px;padding:10px 16px;font-size:14px;font-weight:500;color:var(--ink);transition:.15s}
.mete a:hover{border-color:var(--blue2);transform:translateY(-1px)}
.mete a b{font-weight:700;color:var(--blue2)}

footer.site{background:#060E1E;color:#8BA3C7;padding:44px 0 26px;font-size:13px}
footer.site .in{max-width:var(--w);margin:0 auto;padding:0 24px;display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap}

@media(max-width:1100px){ nav.main{display:none} .acc > button > span:not(.caret){display:none} }
@media(max-width:1000px){ .grid{grid-template-columns:1fr 1fr} }
@media(max-width:680px){ .grid{grid-template-columns:1fr} }
/* paesi */
.paesi{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.paese{display:flex;gap:12px;align-items:center;background:var(--card);border:1px solid var(--line);border-radius:12px;padding:12px 14px;transition:.15s;min-width:0}
.paese:hover{border-color:var(--blue2);transform:translateY(-1px)}
.paese .f{font-size:24px;flex:none;line-height:1}
.paese .tt{font-size:14.5px;font-weight:600;color:var(--ink);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.paese .mt{font-size:12px;color:var(--muted);margin-top:2px;flex:none}
@media(max-width:680px){ .paesi{grid-template-columns:1fr} }

