/* RufioExpress — sito pubblico. Strada «A · Verde» (ispirata a Wise, da Awesome Design): fondo salvia,
   un solo accento lime per le azioni, verde bosco per i fondi scuri, titoli Manrope 800 grandi e stretti,
   angoli morbidi (riquadri 28px, pulsanti a pillola). Dettagli in DESIGN.md. */

@font-face { font-family: "Manrope"; font-weight: 400 800; font-display: swap; src: url(../fonts/manrope-latin.woff2) format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Manrope"; font-weight: 400 800; font-display: swap; src: url(../fonts/manrope-latin-ext.woff2) format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF; }

:root {
  --sage: #f1f5ec;       /* fondo della pagina: verde chiarissimo */
  --white: #ffffff;      /* riquadri sul salvia */
  --ink: #0e0f0c;        /* testo e titoli */
  --body: #454745;       /* testo secondario */
  --line: #d8e1cf;       /* bordi dei campi e righe */
  --lime: #9fe870;       /* l'unico colore delle azioni */
  --lime-hover: #cdffad;
  --lime-pale: #e2f6d5;  /* scelta attiva */
  --forest: #163300;     /* fondi scuri, testo sul lime */
  --forest-line: #2f5214;
  --on-forest: #e2f6d5;
  --peach: #ffc091;      /* il riquadro dell'assicurazione */
  --danger: #a7000d;

  --font: "Manrope", system-ui, -apple-system, "Segoe UI", sans-serif;
  --m: clamp(16px, 4vw, 40px);           /* margine laterale */
  --max: 1200px;
  --gap: clamp(64px, 9vw, 120px);        /* tra le sezioni */
  --r-card: 28px; --r-in: 16px;
  --ease: cubic-bezier(.16, 1, .3, 1);

  --step-small: 0.9375rem;                                 /* 15 */
  --step-body: 1.125rem;                                   /* 18 */
  --step-lead: clamp(1.1875rem, 1.05rem + .5vw, 1.375rem); /* 19–22 */
  --step-card: clamp(1.375rem, 1.2rem + .6vw, 1.75rem);    /* 22–28 */
  --step-head: clamp(2.1rem, 1.3rem + 2.8vw, 3.75rem);     /* 34–60 */
  --step-hero: clamp(2.9rem, 1.2rem + 5.6vw, 6.25rem);     /* 46–100 */
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
body { margin: 0; background: var(--sage); color: var(--ink); font: 500 var(--step-body)/1.55 var(--font); overflow-x: hidden; }
h1, h2, h3, p, ul, ol, figure { margin: 0; }
h1, h2, h3 { font-weight: 800; letter-spacing: -0.03em; line-height: 1; text-wrap: balance; }
h2 { font-size: var(--step-head); }
h3 { font-size: var(--step-card); letter-spacing: -0.02em; }
p { text-wrap: pretty; }
img { display: block; max-width: 100%; height: auto; }
a { color: var(--forest); text-underline-offset: 3px; }
:focus-visible { outline: 3px solid var(--forest); outline-offset: 3px; border-radius: 6px; }
::selection { background: var(--lime); color: var(--forest); }
.visually-hidden { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.skip { position: absolute; left: var(--m); top: -80px; z-index: 50; background: var(--lime); color: var(--forest); padding: 12px 18px; border-radius: 999px; font-weight: 700; }
.skip:focus { top: 12px; }

/* ---------- Pulsanti ---------- */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 48px; padding: 12px 24px; border: 2px solid transparent; border-radius: 999px; background: var(--lime); color: var(--forest); font: 700 1rem/1.2 var(--font); text-decoration: none; cursor: pointer; transition: background-color .2s var(--ease), transform .2s var(--ease); }
.btn:hover { background: var(--lime-hover); color: var(--forest); transform: translateY(-2px); }
.btn:active { transform: translateY(0); }
.btn-small { min-height: 44px; padding: 10px 20px; font-size: var(--step-small); }
.btn-big { min-height: 60px; padding: 16px 30px; font-size: 1.125rem; font-weight: 800; }
.btn-ghost { background: var(--white); }
.btn-ghost:hover { background: var(--lime-pale); }
.btn-line { background: transparent; border-color: var(--lime); color: var(--lime); }
.btn-line:hover { background: var(--lime); color: var(--forest); }
.linkish { background: none; border: 0; padding: 0; font: inherit; color: inherit; text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }

/* ---------- Consenso cookie: striscia in cima, nel flusso ---------- */
.consent { display: grid; gap: 12px; padding: 14px var(--m); background: var(--white); font-size: var(--step-small); line-height: 1.45; }
.consent[hidden] { display: none; }
.consent p { max-width: 70ch; }
.consent-actions { display: flex; flex-wrap: wrap; gap: 10px; }
.consent .btn-ghost { border-color: var(--line); }
@media (min-width: 900px) { .consent { grid-template-columns: 1fr auto; align-items: center; gap: 24px; } }

/* ---------- Testata ---------- */
.bar { position: relative; z-index: 10; display: flex; align-items: center; justify-content: space-between; gap: 24px; max-width: calc(var(--max) + 2 * var(--m)); margin: 0 auto; padding: 18px var(--m); }
.wordmark { display: inline-flex; align-items: center; gap: 10px; color: var(--ink); text-decoration: none; font-weight: 800; font-size: 1.5rem; letter-spacing: -0.04em; }
.wordmark img { width: 36px; height: 36px; border-radius: 10px; }
.wordmark b { font-weight: 800; color: #2e8a3a; }
.bar-links { display: none; gap: 4px; }
.bar-links a { padding: 10px 14px; border-radius: 999px; color: var(--ink); text-decoration: none; font-weight: 600; font-size: 1rem; transition: background-color .2s var(--ease); }
.bar-links a:hover { background: var(--white); }
.bar-end { display: flex; align-items: center; gap: 10px; }
.langs { display: flex; flex-wrap: wrap; gap: 2px; padding: 0; list-style: none; font-size: var(--step-small); font-weight: 600; }
.langs a, .langs span { display: inline-flex; min-width: 40px; min-height: 40px; align-items: center; justify-content: center; border-radius: 999px; color: var(--body); text-decoration: none; }
.langs a:hover { background: var(--white); color: var(--ink); }
.langs [aria-current] { color: var(--ink); background: var(--white); }
.langs-bar { display: none; }
.bar-menu { position: relative; }
.bar-menu summary { display: flex; align-items: center; justify-content: center; width: 48px; height: 48px; border-radius: 999px; background: var(--white); cursor: pointer; list-style: none; }
.bar-menu summary::-webkit-details-marker { display: none; }
.bar-menu nav { position: absolute; right: 0; top: calc(100% + 8px); display: grid; gap: 4px; width: min(86vw, 320px); padding: 12px; border-radius: 24px; background: var(--white); box-shadow: 0 18px 48px rgb(14 15 12 / .16); }
.bar-menu nav a:not(.btn) { padding: 12px 14px; border-radius: 14px; color: var(--ink); text-decoration: none; font-weight: 700; font-size: 1.125rem; }
.bar-menu nav a:not(.btn):hover { background: var(--sage); }
.bar-menu nav .btn { margin-top: 6px; }
.bar-menu .langs { margin-top: 8px; }
.bar-end > .btn { display: none; }
@media (min-width: 560px) { .bar-end > .btn { display: inline-flex; } }
@media (min-width: 1000px) {
  .bar-links, .langs-bar { display: flex; }
  .bar-menu { display: none; }
}

/* ---------- Sezioni: larghezza comune ---------- */
.hero, .how, .insure, .track-band, .masthead, .posts, .prices-calc, .support-field { max-width: calc(var(--max) + 2 * var(--m)); margin-left: auto; margin-right: auto; padding-left: var(--m); padding-right: var(--m); }
main > section + section { margin-top: var(--gap); }

/* ---------- Apertura: titolo a sinistra, calcolatore a destra ---------- */
.hero { display: grid; gap: 40px; align-items: center; padding-top: clamp(16px, 4vw, 48px); padding-bottom: var(--gap); }
.hero-text { display: grid; gap: 24px; justify-items: start; }
.hero-title { font-size: var(--step-hero); line-height: .92; letter-spacing: -0.04em; }
.hero-lead { font-size: var(--step-lead); color: var(--body); max-width: 34ch; }
.hero-from { display: inline-flex; padding: 8px 16px; border-radius: 999px; background: var(--forest); color: var(--lime); font-weight: 700; font-size: 1rem; }
.chips { display: flex; flex-wrap: wrap; gap: 8px; padding: 0; list-style: none; }
@media (max-width: 599px) { .chips { display: none; } }
.chips li { padding: 9px 16px; border-radius: 999px; background: var(--white); font-weight: 600; font-size: var(--step-small); }
.hero-calc { position: relative; padding-top: 96px; }
.hero-rufio { position: absolute; z-index: 0; right: 4px; top: -6px; width: 190px; }
.hero-calc .calc-section { position: relative; z-index: 1; }
/* Il punto di forza: fino a 30 kg allo stesso prezzo, come un bollino attaccato al calcolatore */
.hero-sticker { position: absolute; z-index: 2; left: 0; top: -24px; display: grid; place-items: center; align-content: center; width: 124px; height: 124px; border-radius: 999px; background: var(--forest); color: var(--lime); text-align: center; transform: rotate(-12deg); line-height: 1; }
.hero-sticker b { font-weight: 800; font-size: 2.125rem; letter-spacing: -0.04em; }
.hero-sticker span { max-width: 9ch; margin-top: 4px; font-weight: 700; font-size: .8125rem; color: var(--on-forest); }
@media (min-width: 960px) { .hero-sticker { left: -44px; top: -36px; width: 150px; height: 150px; } .hero-sticker b { font-size: 2.625rem; } .hero-sticker span { font-size: .9375rem; } }
@media (min-width: 960px) {
  .hero { grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: 56px; }
  .hero-calc { padding-top: 120px; }
  .hero-rufio { width: 250px; top: -24px; }
}

/* ---------- Calcolatore ---------- */
.calc { display: grid; gap: 18px; padding: clamp(20px, 3vw, 28px); border-radius: var(--r-card); background: var(--white); }
.calc-off { padding: 28px; border-radius: var(--r-card); background: var(--white); }
.calc-route { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.calc-route label > span, .calc legend { display: block; margin-bottom: 6px; font-weight: 600; font-size: var(--step-small); color: var(--body); }
.calc select { width: 100%; min-height: 56px; padding: 12px 40px 12px 14px; border: 2px solid var(--line); border-radius: var(--r-in); background: var(--white) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='9' viewBox='0 0 14 9'%3E%3Cpath d='M1 1l6 6 6-6' stroke='%230e0f0c' stroke-width='2.2' fill='none'/%3E%3C/svg%3E") no-repeat right 14px center; color: var(--ink); font: 700 1.125rem/1.2 var(--font); appearance: none; cursor: pointer; transition: border-color .2s var(--ease); }
.calc select:hover { border-color: #b9c7ae; }
.calc select:focus-visible { border-color: var(--forest); outline: none; }
.calc-result { display: flex; align-items: flex-end; justify-content: space-between; gap: 12px; padding: 18px 20px; border-radius: 20px; background: var(--sage); }
.calc-price { font-weight: 800; font-size: clamp(2.5rem, 2rem + 1.6vw, 3.25rem); line-height: 1; letter-spacing: -0.04em; font-variant-numeric: tabular-nums; }
.calc-price small { font-size: 1rem; font-weight: 700; letter-spacing: 0; color: var(--body); }
.calc-price [data-price] { display: inline-block; }
.calc-price .is-flip { animation: flip .4s var(--ease); }
.calc-days { max-width: 16ch; text-align: right; font-weight: 700; font-size: var(--step-small); color: var(--forest); }
.calc .btn-big { width: 100%; }
.calc-notes { display: grid; gap: 4px; padding: 0; list-style: none; font-size: .875rem; color: var(--body); }
@keyframes flip { from { opacity: .2; transform: translateY(-10px); } }

/* ---------- Pacchetti: titolo a sinistra, un pacchetto per riga a destra ---------- */
.packs { padding: var(--gap) 0; background: var(--white); }
.packs-in { display: grid; gap: 40px; max-width: calc(var(--max) + 2 * var(--m)); margin: 0 auto; padding: 0 var(--m); }
.packs-head { display: grid; gap: 14px; align-content: start; }
.packs-head h2 { max-width: 14ch; }
.packs-head p { max-width: 46ch; font-size: var(--step-lead); color: var(--body); }
.packs-grid { display: grid; gap: 12px; }
.pack { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 12px 24px; padding: 28px; border-radius: var(--r-card); }
.pack > div { display: grid; gap: 8px; }
.pack p { font-size: 1rem; max-width: 34ch; }
.pack .pack-price { font-weight: 800; font-size: clamp(2.25rem, 1.8rem + 1.6vw, 3.25rem); line-height: 1; letter-spacing: -0.04em; white-space: nowrap; }
.pack-0 { background: var(--lime); color: var(--forest); }
.pack-1 { background: var(--sage); }
.pack-1 p:not(.pack-price) { color: var(--body); }
.pack-2 { background: var(--forest); color: var(--white); }
.pack-2 h3 { color: var(--lime); }
.pack-2 p:not(.pack-price) { color: var(--on-forest); }
.pack-3 { background: var(--ink); color: var(--white); }
.pack-countries { font-weight: 700; font-size: 1.125rem !important; max-width: 22ch !important; }
.pack .pack-price small { font-size: 1rem; font-weight: 700; letter-spacing: 0; }
.packs-limits { font-size: 1rem !important; color: var(--ink) !important; padding: 14px 18px; border-radius: 16px; background: var(--sage); }
.packs-limits a { font-weight: 700; white-space: nowrap; }
@media (min-width: 900px) { .packs-in { grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: 56px; } }
main > section + .packs { margin-top: 0; }

/* ---------- Assicurazione ---------- */
.insure-in { display: grid; gap: 24px; align-items: center; padding: clamp(28px, 5vw, 64px); border-radius: 36px; background: var(--peach); }
.insure-text { display: grid; gap: 16px; }
.insure-text h2 { max-width: 14ch; }
.insure-text p { max-width: 52ch; font-size: var(--step-lead); color: #2a1d10; }
.insure-text p + p { font-size: 1rem; }
.insure-rufio { width: min(70%, 320px); justify-self: center; }
@media (min-width: 860px) { .insure-in { grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); } }

/* ---------- Tre passi ---------- */
.how-head { display: grid; gap: 14px; margin-bottom: 40px; }
.how-head p { max-width: 56ch; font-size: var(--step-lead); color: var(--body); }
.how-steps { display: grid; gap: 28px; padding: 0; list-style: none; }
.how-steps li { display: grid; gap: 10px; align-content: start; }
.how-n { display: flex; align-items: center; justify-content: center; width: 56px; height: 56px; border-radius: 999px; background: var(--lime); color: var(--forest); font-weight: 800; font-size: 1.5rem; }
.how-steps strong { font-size: var(--step-card); letter-spacing: -0.02em; }
.how-steps li > span:last-child { max-width: 34ch; color: var(--body); }
@media (min-width: 760px) { .how-steps { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 32px; } }

/* ---------- Cosa compri ---------- */
.services { padding: var(--gap) 0; background: var(--white); }
.services > h2, .services-grid { max-width: calc(var(--max) + 2 * var(--m)); margin: 0 auto; padding: 0 var(--m); }
.services > h2 { margin-bottom: 40px; }
.services-grid { display: grid; gap: 20px; }
.service { display: grid; gap: 12px; align-content: start; padding: 14px 14px 28px; border-radius: var(--r-card); background: var(--sage); }
.service-art { overflow: hidden; border-radius: 20px; margin-bottom: 10px; }
.service-art img { width: 100%; transition: transform .6s var(--ease); }
.service:hover .service-art img { transform: scale(1.04); }
.service h3, .service p { padding: 0 12px; }
.service p { font-size: 1rem; color: var(--body); }
@media (min-width: 860px) { .services-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
main > .services + section { margin-top: var(--gap); }

/* ---------- Traccia e stati ---------- */
.track-band-in { display: grid; gap: 32px; padding: clamp(24px, 4vw, 48px); border-radius: var(--r-card); background: var(--white); }
.track { display: grid; gap: 14px; align-content: start; }
.track-title { font-size: var(--step-head); max-width: 12ch; }
.track-row { display: grid; gap: 8px; }
.track-row label { font-weight: 600; font-size: var(--step-small); color: var(--body); }
.track-row > div, .track-row { min-width: 0; }
.track-row input { width: 100%; min-height: 60px; padding: 12px 22px; border: 2px solid var(--sage); border-radius: 999px; background: var(--sage); color: var(--ink); font: 700 1.25rem/1 var(--font); letter-spacing: .04em; text-transform: uppercase; }
.track-row input::placeholder { color: #7a7d78; }
.track-row input:focus-visible { outline: none; border-color: var(--forest); background: var(--white); }
.track-row button { min-height: 56px; border: 0; border-radius: 999px; background: var(--ink); color: var(--white); font: 700 1.0625rem/1 var(--font); cursor: pointer; transition: background-color .2s var(--ease); }
.track-row button:hover { background: var(--forest); }
.track-help { font-size: var(--step-small); color: var(--body); }
.track-help.is-error { color: var(--danger); font-weight: 600; }
.track-account { margin: 6px 0 0; font-size: var(--step-small); }
.track-account a { font-weight: 700; }
.board-wrap { overflow-x: auto; }
.board { width: 100%; border-collapse: collapse; font-size: 1rem; }
.board th, .board td { padding: 12px 10px; text-align: left; vertical-align: top; border-bottom: 1px solid var(--sage); }
.board thead th { font-size: .8125rem; font-weight: 700; color: var(--body); }
.board tbody th { font-weight: 800; white-space: nowrap; }
.board td { color: var(--body); }
.board-group th { padding-top: 20px; font-size: .8125rem; color: var(--forest); }
.board-group th::before { content: ""; display: inline-block; width: 10px; height: 10px; margin-right: 8px; border-radius: 999px; background: var(--lime); }
.board-break th, .board-break td { border-bottom: 0; color: var(--body); }
@media (max-width: 599px) {
  .board thead { display: none; }
  .board tr { display: grid; gap: 4px; padding: 12px 0; border-bottom: 1px solid var(--sage); }
  .board th, .board td { padding: 0; border: 0; white-space: normal; }
  .board-group th { padding-top: 12px; }
}
@media (min-width: 900px) {
  .track-band-in { grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); gap: 56px; }
  .track-row { grid-template-columns: 1fr auto; align-items: end; }
  .track-row label { grid-column: 1 / -1; }
  .track-row button { padding: 0 28px; }
}

/* ---------- Paesi che scorrono ---------- */
.countries-band { overflow: hidden; padding: 22px 0; background: var(--lime); }
.countries-track { display: flex; width: max-content; animation: ticker 70s linear infinite; }
.countries-track > div { display: flex; align-items: center; }
.countries-track span { white-space: nowrap; color: var(--forest); font-weight: 800; font-size: clamp(1.75rem, 1.2rem + 2vw, 3rem); letter-spacing: -0.03em; }
.countries-track i { flex: none; width: 12px; height: 12px; margin: 0 24px; border-radius: 999px; background: var(--forest); }
.countries-note { max-width: calc(var(--max) + 2 * var(--m)); margin: 16px auto 0; padding: 0 var(--m); font-size: 1rem; color: var(--body); }
@keyframes ticker { to { transform: translateX(-50%); } }

/* ---------- Domande ---------- */
.faq { max-width: calc(var(--max) + 2 * var(--m)); margin-left: auto; margin-right: auto; padding: 0 var(--m); }
.faq h2 { margin-bottom: 32px; max-width: 16ch; }
.cards { display: grid; gap: 10px; }
.card { border-radius: 20px; background: var(--white); transition: background-color .2s var(--ease); }
.card summary { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 4px 16px; padding: 20px 24px; cursor: pointer; list-style: none; }
.card summary::-webkit-details-marker { display: none; }
.card summary::after { content: ""; grid-row: 1 / span 2; grid-column: 2; width: 40px; height: 40px; border-radius: 999px; background: var(--sage) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3E%3Cpath d='M8 2v12M2 8h12' stroke='%23163300' stroke-width='2.4' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat center; transition: transform .3s var(--ease), background-color .2s var(--ease); }
.card[open] summary::after { transform: rotate(45deg); background-color: var(--lime); }
.card-tab { font-size: .8125rem; font-weight: 700; color: #2e7a35; }
.card-q { font-weight: 800; font-size: clamp(1.125rem, 1rem + .4vw, 1.375rem); letter-spacing: -0.02em; line-height: 1.25; }
.card p { max-width: 68ch; padding: 0 24px 24px; color: var(--body); }
@media (min-width: 960px) { .faq { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: 48px; align-items: start; } }

/* ---------- Pagine interne ---------- */
.masthead { display: grid; gap: 28px; align-items: center; padding-top: clamp(16px, 4vw, 48px); }
.masthead-text { display: grid; gap: 18px; justify-items: start; }
.masthead-title { font-size: clamp(2.6rem, 1.4rem + 4.6vw, 5.25rem); line-height: .94; letter-spacing: -0.04em; max-width: 14ch; }
.masthead-title-long { font-size: clamp(2rem, 1.2rem + 3.2vw, 3.75rem); max-width: 24ch; }
.masthead-lead { max-width: 52ch; font-size: var(--step-lead); color: var(--body); }
.masthead-date { font-size: var(--step-small); font-weight: 600; color: var(--body); }
.masthead-figure { overflow: hidden; border-radius: var(--r-card); }
.masthead-figure img { width: 100%; }
@media (min-width: 900px) { .masthead-art { grid-template-columns: minmax(0, 1fr) minmax(0, .9fr); gap: 56px; } }
.masthead-single .masthead-title-long { max-width: none; }
@media (min-width: 900px) { .masthead-single .masthead-title-long { grid-column: 1 / -1; } }

.prose { max-width: calc(820px + 2 * var(--m)); margin-left: auto; margin-right: auto; padding: 0 var(--m); }
.prose > * + * { margin-top: 1em; }
article.prose { padding: clamp(24px, 5vw, 56px); border-radius: var(--r-card); background: var(--white); max-width: 880px; }
@media (max-width: 919px) { article.prose { margin-left: var(--m); margin-right: var(--m); } }
.prose h2 { margin-top: 1.6em; font-size: clamp(1.6rem, 1.2rem + 1.4vw, 2.25rem); }
.prose h3 { margin-top: 1.4em; }
.prose ul, .prose ol { padding-left: 1.3em; }
.prose li + li { margin-top: .4em; }
.prose a { font-weight: 700; }
.prose-wide { max-width: calc(var(--max) + 2 * var(--m)); }
.prose-wide h2 { margin-top: 0; font-size: var(--step-head); }
.prose-wide > h2 + * { margin-top: 24px; }
.prose-wide > * + h2 { margin-top: 64px; }
.packages { display: grid; gap: 10px; padding: 0 !important; list-style: none; }
.packages li { display: grid; gap: 4px; margin: 0 !important; padding: 18px 22px; border-radius: 20px; background: var(--white); }
.packages li span { font-size: 1rem; color: var(--body); }
@media (min-width: 760px) { .packages { grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); } }
.fares-group { border-radius: 20px; background: var(--white); }
.fares-group + .fares-group { margin-top: 10px; }
.fares-group summary { padding: 18px 22px; font-weight: 800; font-size: 1.25rem; letter-spacing: -0.02em; cursor: pointer; }
.fares-group summary span { font-weight: 600; color: var(--body); font-size: 1rem; }
.table-wrap { overflow-x: auto; padding: 0 22px 18px; }
.fares { width: 100%; border-collapse: collapse; font-size: 1rem; }
.fares th, .fares td { padding: 12px 10px; text-align: left; border-bottom: 1px solid var(--sage); white-space: nowrap; }
.fares thead th { font-size: .8125rem; color: var(--body); }
.fares tbody tr:last-child > * { border-bottom: 0; }
.fares .num { text-align: right; font-variant-numeric: tabular-nums; }
.fares td.num { font-weight: 700; }

.contact { display: grid; gap: 16px; }
.contact-big { display: grid; gap: 8px; padding: clamp(24px, 4vw, 40px); border-radius: var(--r-card); background: var(--white); color: var(--ink); text-decoration: none; transition: transform .2s var(--ease), background-color .2s var(--ease); }
.contact-big:first-child { background: var(--lime); color: var(--forest); }
.contact-big:hover { transform: translateY(-3px); }
.contact-name { font-weight: 700; font-size: var(--step-small); }
.contact-value { font-weight: 800; font-size: clamp(1.4rem, 1rem + 1.6vw, 2.25rem); letter-spacing: -0.03em; line-height: 1.1; overflow-wrap: anywhere; }
.contact-none { padding: 24px; border-radius: var(--r-card); background: var(--white); }
@media (min-width: 860px) { .contact { grid-template-columns: 1fr 1fr; } }

.posts-grid { display: grid; gap: 16px; }
.post-card { position: relative; display: grid; gap: 12px; align-content: start; padding: 28px; border-radius: var(--r-card); background: var(--white); transition: transform .2s var(--ease); }
.post-card:hover { transform: translateY(-3px); }
.post-card h2 { font-size: clamp(1.25rem, 1.05rem + .7vw, 1.625rem); letter-spacing: -0.02em; line-height: 1.15; }
.post-card h2 a { color: var(--ink); text-decoration: none; }
.post-card h2 a::after { content: ""; position: absolute; inset: 0; border-radius: inherit; }
.post-card p { font-size: 1rem; color: var(--body); }
.post-more { margin-top: 6px; font-weight: 700; color: var(--forest); }
.post-empty { padding: 28px; border-radius: var(--r-card); background: var(--white); }
@media (min-width: 900px) { .posts-grid { grid-template-columns: 1fr 1fr; } }
.nav-links { display: flex; gap: 8px; margin-top: 24px; }
.nav-links a, .nav-links span { padding: 10px 16px; border-radius: 999px; background: var(--white); text-decoration: none; font-weight: 700; }
.post-cover { max-width: 880px; margin: 32px auto 0; padding: 0 var(--m); }
.post-cover img { border-radius: var(--r-card); }
main.page > .prose { margin-top: 48px; }


/* ---------- Chiusura ---------- */
.foot { margin-top: var(--gap); padding: clamp(56px, 7vw, 88px) 0 40px; background: var(--forest); color: var(--on-forest); }
.foot-in { display: grid; gap: 40px; max-width: calc(var(--max) + 2 * var(--m)); margin: 0 auto; padding: 0 var(--m); }
.foot-top { display: grid; gap: 24px; }
.foot-line { max-width: 14ch; font-weight: 800; font-size: var(--step-head); line-height: 1; letter-spacing: -0.035em; color: var(--lime); }
.foot-actions { display: flex; flex-wrap: wrap; gap: 10px; }
.foot-links { display: flex; flex-wrap: wrap; gap: 4px 24px; font-weight: 700; }
.foot-links a, .foot a:not(.btn) { color: var(--on-forest); }
.foot-links a { text-decoration: none; padding: 6px 0; }
.foot-links a:hover { color: var(--lime); }
.foot-legal { display: grid; gap: 12px; padding-top: 16px; font-size: var(--step-small); }
.foot-legal-links { display: flex; flex-wrap: wrap; gap: 6px 20px; }
.foot .langs a, .foot .langs span { color: var(--on-forest); }
.foot .langs a:hover, .foot .langs [aria-current] { background: var(--forest-line); color: var(--white); }
.foot :focus-visible { outline-color: var(--lime); }
@media (min-width: 900px) { .foot-top { grid-template-columns: 1fr auto; align-items: end; } }
main > :last-child { margin-bottom: 0; }

/* ---------- Movimento: le parti di ogni sezione entrano una dopo l'altra ---------- */
.js .reveal { opacity: 0; transform: translateY(24px); transition: opacity .7s var(--ease), transform .7s var(--ease); transition-delay: calc(var(--d, 0) * 80ms); }
.js .reveal.is-in { opacity: 1; transform: none; }
@keyframes rise { from { opacity: 0; transform: translateY(28px); } }
@keyframes bob { 50% { transform: translateY(-8px) rotate(-2deg); } }
.hero-title, .hero-lead, .hero-from, .chips, .hero-calc { animation: rise .8s var(--ease) backwards; }
@keyframes stick { from { opacity: 0; transform: rotate(-30deg) scale(.6); } }
.hero-sticker { animation: stick .6s var(--ease) .5s backwards; }
.hero-lead { animation-delay: .08s; } .hero-from { animation-delay: .14s; } .chips { animation-delay: .2s; } .hero-calc { animation-delay: .16s; }
.hero-rufio { animation: bob 4s ease-in-out 1s infinite; }
.btn, .card, .service, .post-card { will-change: auto; }
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; }
  .js .reveal { opacity: 1; transform: none; }
}

/* Pagine per paese: elenco delle destinazioni (home, Tariffe, pagine per paese) */
.dest-links { margin-top: 40px; }
.dest-list { list-style: none; margin: 16px 0 0; padding: 0; display: grid; gap: 8px; grid-template-columns: repeat(auto-fill, minmax(min(100%, 240px), 1fr)); }
.dest-list a { display: block; padding: 12px 16px; border-radius: 16px; background: var(--white); color: var(--ink); font-weight: 700; text-decoration: none; }
.dest-list a:hover, .dest-list a:focus-visible { background: var(--lime-pale, #e2f6d5); }
.page-dest .fares th a { color: inherit; }

/* Lingue nella barra in alto: menu a tendina (12 lingue) */
.langs-drop { position: relative; font-size: var(--step-small); font-weight: 600; }
.langs-drop summary { list-style: none; display: inline-flex; align-items: center; gap: 6px; min-height: 40px; padding: 0 14px; border-radius: 999px; background: var(--white); color: var(--ink); cursor: pointer; }
.langs-drop summary::-webkit-details-marker { display: none; }
.langs-drop summary::after { content: ""; width: 7px; height: 7px; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: translateY(-2px) rotate(45deg); }
.langs-drop[open] summary::after { transform: translateY(2px) rotate(-135deg); }
.langs-drop ul { position: absolute; right: 0; top: calc(100% + 8px); z-index: 30; display: grid; grid-template-columns: repeat(2, minmax(150px, 1fr)); gap: 2px; margin: 0; padding: 8px; list-style: none; border-radius: 20px; background: var(--white); border: 1px solid var(--sage); }
.langs-drop a, .langs-drop span { display: flex; gap: 10px; align-items: center; min-height: 40px; padding: 0 12px; border-radius: 12px; color: var(--body); text-decoration: none; white-space: nowrap; }
.langs-drop b { min-width: 24px; color: var(--ink); }
.langs-drop a:hover, .langs-drop a:focus-visible { background: var(--sage); color: var(--ink); }
.langs-drop [aria-current] { background: var(--lime-pale); color: var(--ink); }
.langs-drop .globe { flex: none; }
/* Nel menu del telefono la tendina si apre sotto, dentro il menu */
.langs-drop.langs-menu { margin-top: 8px; }
.langs-drop.langs-menu ul { position: static; margin-top: 8px; grid-template-columns: repeat(2, minmax(0, 1fr)); }