/* VCM Display: vetrina bar, interfaccia coordinata con Hub e Catalogo. */
:root{--ink:#243047;--muted:#727487;--orange:#f47727;--deep:#c45619;--stroke:#f0e1d7;--cream:#fff9f4;--peach:#fff0e3;--shadow:0 18px 42px rgba(75,41,25,.09);font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Inter,Roboto,Arial,sans-serif;color:var(--ink);background:var(--cream);-webkit-font-smoothing:antialiased}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;width:100%;overflow:hidden}
body{background:radial-gradient(ellipse at 80% 8%,#ffe1c4 0,transparent 37%),radial-gradient(ellipse at 6% 90%,#fff0e3 0,transparent 38%),linear-gradient(135deg,#fffaf6,#fff5ed 85%);touch-action:pan-y}
button,a{font:inherit;-webkit-tap-highlight-color:transparent}button{cursor:pointer}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible,.card:focus-visible{outline:3px solid #ffb078;outline-offset:3px}
#app{height:100dvh;display:flex;flex-direction:column;padding:clamp(12px,1.25vw,25px) clamp(14px,2.1vw,40px) 12px;gap:clamp(10px,1.1vh,16px);min-height:0;max-width:2200px;margin:auto}
.topbar{background:#ffffffeb;border:1px solid #f3e6dc;border-radius:23px;box-shadow:0 8px 32px #64371b0a;min-height:clamp(80px,9.6vh,105px);display:flex;align-items:center;gap:20px;padding:12px clamp(14px,1.65vw,28px);flex-shrink:0}
.brand{display:flex;align-items:center;gap:15px;min-width:0;flex:1 1 auto}
.brand img{width:clamp(52px,4.4vw,68px);height:clamp(52px,4.4vw,68px);object-fit:cover;border-radius:18px;box-shadow:0 7px 20px #65360f1a;flex-shrink:0}
.brand-text{min-width:0}.brand-eyebrow{display:flex;align-items:center;gap:8px;font-size:clamp(9px,.73vw,12px);letter-spacing:1.5px;color:var(--deep);font-weight:850;white-space:nowrap}.live-dot{width:8px;height:8px;flex-shrink:0;border-radius:50%;background:var(--orange);box-shadow:0 0 0 4px #ffd2b5}
.brand h1{font-size:clamp(20px,2.25vw,33px);font-weight:900;line-height:1.07;letter-spacing:-1px;margin:7px 0 4px;color:#22304a;white-space:nowrap}.brand h1 em{font-style:normal;color:var(--orange)}.brand p{color:#948377;font-size:clamp(10px,.95vw,13px);margin:0;font-weight:600;white-space:nowrap}
.headerButtons{display:flex;gap:10px;align-items:center;justify-content:center;flex:0 0 auto}.headerButtons .headerSiteBtn{border-radius:999px;padding:12px clamp(12px,1.2vw,21px);font-size:clamp(11px,.9vw,13px);font-weight:850;color:var(--deep);background:#fff6ef;border:1px solid #f6ddc9;white-space:nowrap;box-shadow:none;display:inline-flex;gap:8px;align-items:center}.headerButtons .headerSiteBtn:hover{background:#ffeadd}.headerButtons .primaryHeaderBtn{background:#f47727;color:#fff;border-color:#f47727;box-shadow:0 8px 19px #f4772736}.headerButtons .primaryHeaderBtn:hover{background:#d96523}
.status{flex:0 0 auto;min-width:84px;border-left:1px solid #efe3dc;padding-left:18px;color:#8a776f;font-size:clamp(10px,.85vw,13px);font-weight:800;text-align:right}.status::before{content:"";display:inline-block;width:7px;height:7px;background:#49ac78;border-radius:50%;margin-right:7px}.status.loading::before{background:var(--orange)}
.showcase-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:clamp(4px,.65vh,8px) 6px 1px;flex-shrink:0}.showcase-eyebrow{font-weight:850;color:var(--deep);letter-spacing:1.6px;font-size:clamp(9px,.72vw,11px)}.showcase-heading h2{font-size:clamp(23px,2.25vw,38px);line-height:1.08;letter-spacing:-1.35px;margin:6px 0 2px;font-weight:900;color:#23324d}.showcase-heading h2 em{font-style:normal;color:var(--orange)}.showcase-aside{background:#fff;border:1px solid #f1e3d9;border-radius:999px;color:#887266;font-weight:750;padding:9px 15px;font-size:clamp(10px,.82vw,13px);white-space:nowrap}.aside-spark{color:var(--orange);margin-right:7px}
#tabs{display:flex;align-items:center;gap:9px;min-height:clamp(44px,5.6vh,58px);flex-shrink:0;min-width:0}#tabs button{flex:1;min-width:0;border:1px solid #f3e0d0;background:#ffffffca;box-shadow:0 4px 15px #6c43210a;color:#b36133;font-size:clamp(11px,1vw,15px);font-weight:850;padding:clamp(10px,1.35vh,16px) 9px;border-radius:13px;letter-spacing:.05px;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;text-transform:none}#tabs button.active{color:#fff;background:linear-gradient(110deg,#ff8a42,#f47727);border-color:#f47727;box-shadow:0 9px 22px #f477272f}#tabs button:active{transform:translateY(1px)}
main{position:relative;flex:1;min-height:0;display:flex;align-items:stretch}
#grid{width:100%;height:100%;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:minmax(0,1fr);gap:clamp(10px,1.25vw,23px);padding:0 clamp(44px,3.1vw,57px) 2px}
.card{height:100%;min-height:0;position:relative;overflow:hidden;display:flex;flex-direction:column;border:1px solid #ecdcd0;border-radius:clamp(19px,1.55vw,28px);background:#fff;box-shadow:var(--shadow);cursor:pointer;transition:transform .17s ease,box-shadow .17s ease}.card:hover{transform:translateY(-3px);box-shadow:0 22px 46px #633a191d}.card:active{transform:scale(.992)}
.imageWrap{height:59%;flex:0 0 59%;min-height:0;position:relative;background:#fff0e4;overflow:hidden}.imageWrap:after{content:"";position:absolute;inset:40% 0 0;background:linear-gradient(to bottom,transparent,#25203725);pointer-events:none}.imageWrap img{height:100%;width:100%;object-fit:cover;object-position:center;display:block;user-select:none;-webkit-user-drag:none;transition:transform .7s cubic-bezier(.2,.7,.2,1)}.card:hover .imageWrap img{transform:scale(1.045)}
.badge{position:absolute;left:clamp(12px,1.1vw,20px);top:clamp(12px,1.1vw,20px);z-index:2;max-width:calc(100% - 30px);padding:8px 12px;border-radius:99px;background:#fff9;color:#ae5b27;font-size:clamp(9px,.74vw,12px);letter-spacing:.5px;text-transform:uppercase;font-weight:900;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;backdrop-filter:blur(8px)}
.info{flex:1;min-height:0;display:flex;flex-direction:column;align-items:stretch;padding:clamp(11px,1.2vw,22px) clamp(12px,1.35vw,25px) clamp(12px,1.2vw,22px);gap:clamp(5px,.8vh,11px);background:#fff}.info .info-eyebrow{color:#d06b2c;font-weight:850;font-size:clamp(9px,.76vw,11px);letter-spacing:1.2px;text-transform:uppercase}.title{font-size:clamp(16px,1.56vw,27px);line-height:1.15;font-weight:900;letter-spacing:-.6px;color:#22304a;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;overflow-wrap:anywhere}.meta{font-size:clamp(11px,.95vw,15px);color:#777788;font-weight:650;line-height:1.35;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;overflow-wrap:anywhere}.card-bottom{margin-top:auto;display:flex;justify-content:space-between;align-items:center;gap:5px}.price{display:inline-flex;align-items:center;align-self:flex-start;font-size:clamp(15px,1.35vw,23px);font-weight:900;color:#dd6c2b;letter-spacing:-.4px}.card-cta{color:#b35d2c;font-weight:850;font-size:clamp(10px,.88vw,13px);white-space:nowrap}.card-cta span{font-size:1.3em;margin-left:2px}
.arrow{position:absolute;top:50%;transform:translateY(-50%);z-index:5;width:clamp(34px,2.7vw,49px);height:clamp(55px,5.5vw,79px);border:1px solid #f0e2da;background:#fffdfb;color:var(--orange);border-radius:99px;font-size:clamp(37px,3.1vw,58px);font-weight:250;line-height:1;box-shadow:0 7px 22px #4b2b180f}.arrow:hover{background:#fff0e5}.arrow:active{transform:translateY(-50%) scale(.95)}.left{left:0}.right{right:0}
.empty,.loadingBox{grid-column:1/-1;justify-self:center;align-self:center;padding:35px;border:1px solid var(--stroke);background:#fff;border-radius:20px;font-size:19px;font-weight:750;color:#8c7a70}
.display-footer{height:30px;flex-shrink:0;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:0 6px;color:#977969;font-size:clamp(10px,.76vw,12px);font-weight:700}.display-footer #pageLabel{font-weight:850;color:#bd632e}.footer-activity{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:43%}.footer-policies{display:flex;align-items:center;gap:12px;white-space:nowrap}.footer-policies a,.footer-policies button{border:0;padding:0;background:transparent;font-size:inherit;color:#ab7a60;text-decoration:none;cursor:pointer}.footer-policies button{text-decoration:underline}
.modal{position:fixed;inset:0;display:none;align-items:center;justify-content:center;z-index:999;padding:clamp(8px,1.4vw,22px);background:#232c3b9e;backdrop-filter:blur(11px)}.modal.open{display:flex}.modalPanel{width:min(1280px,100%);height:min(790px,100%);display:flex;flex-direction:column;background:#fff;border-radius:26px;box-shadow:0 28px 80px #0b152a66;overflow:hidden;border:1px solid #f0e3d9}.modalTop{height:74px;flex:0 0 auto;display:flex;align-items:center;justify-content:space-between;padding:12px clamp(13px,1.5vw,26px);border-bottom:1px solid #f2e2d6;background:#fffaf5;gap:16px}.modalKicker{color:#bf622d;font-size:10px;letter-spacing:1.4px;font-weight:900}.modalTitle{font-size:clamp(15px,1.36vw,22px);font-weight:900;color:#26324a;max-width:700px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:4px}.modalActions{display:flex;align-items:center;gap:12px}.modalTimer{border-radius:99px;background:#fff0e2;color:#ca6126;padding:9px 14px;font-weight:850;font-size:12px;white-space:nowrap}.modalClose{border:0;border-radius:13px;width:46px;height:46px;background:#f47727;color:#fff;font-size:29px;font-weight:700}#offerFrame{flex:1;min-height:0;width:100%;border:0;background:white}.modalFoot{height:31px;flex:0 0 auto;border-top:1px solid #f2e3d8;background:#fffaf5;display:flex;align-items:center;justify-content:center;color:#957e6e;font-size:12px;font-weight:750}.ticketContent{display:none;flex:1;align-items:center;justify-content:center;flex-direction:column;padding:18px 24px;gap:11px;background:#fff9f5;overflow:hidden}.ticketContent.open{display:flex}.ticketStage{width:min(690px,65%);aspect-ratio:1.72/1;perspective:1500px;display:flex;align-items:center;justify-content:center}.ticketCard{width:100%;height:100%;position:relative;transform-style:preserve-3d;transition:transform 1s cubic-bezier(.2,.8,.2,1)}.ticketCard.flipped{transform:rotateY(180deg)}.ticketFace{position:absolute;inset:0;backface-visibility:hidden;border-radius:20px;overflow:hidden;background:#fff;box-shadow:0 12px 35px #3f32271e;display:flex;align-items:center;justify-content:center}.ticketFace img{width:100%;height:100%;object-fit:contain;display:block}.ticketBack{transform:rotateY(180deg)}.ticketHint{color:#6d707e;font-size:15px;font-weight:800;text-align:center}
body.modalActive #app{filter:saturate(.83)}
/* Banner compatto, il carosello prosegue anche senza consenso */
.vcm-cookie-panel{position:fixed;z-index:2000;left:50%;bottom:max(12px,env(safe-area-inset-bottom));transform:translateX(-50%);width:min(730px,calc(100% - 24px));display:flex;gap:14px;align-items:center;padding:17px 18px;background:#fff;border:1px solid #f1ddce;border-radius:20px;box-shadow:0 20px 60px #2a2b3a42;color:#29364b}.vcm-cookie-content{flex:1;min-width:0}.vcm-cookie-content strong{font-size:15px}.vcm-cookie-content p{margin:4px 0 0;color:#6c7180;font-size:12px;line-height:1.4}.vcm-cookie-content a{color:#bd622e;text-decoration:underline}.vcm-cookie-actions{display:flex;gap:9px}.vcm-cookie-actions button{border:1px solid #efdbc9;padding:11px 15px;font-weight:850;font-size:13px;border-radius:11px;min-width:82px}.vcm-cookie-no{background:#fff;color:#515968}.vcm-cookie-yes{background:#f47727;color:#fff;border-color:#f47727!important}
@media(max-width:1050px){.topbar{gap:12px}.headerButtons .headerSiteBtn{padding:10px 12px}.status{padding-left:10px}.brand p{display:none}.showcase-aside{display:none}.info{gap:4px}.card-cta{font-size:10px}}
@media(max-width:720px){#app{padding:10px 10px 8px;gap:8px}.topbar{padding:9px;border-radius:17px;flex-wrap:wrap}.brand{flex-basis:100%}.brand img{width:46px;height:46px;border-radius:13px}.brand h1{font-size:21px}.brand-eyebrow{font-size:9px}.headerButtons{flex:1;gap:6px}.headerButtons .headerSiteBtn{flex:1;justify-content:center;padding:9px 8px;font-size:11px}.status{display:none}.showcase-heading h2{font-size:23px}.showcase-eyebrow{font-size:9px}#tabs{gap:6px;overflow-x:auto;min-height:40px}#tabs button{flex:0 0 auto;max-width:50%;padding:9px 12px;font-size:11px}#grid{padding:0 34px;gap:8px;grid-template-columns:repeat(3,minmax(0,1fr))}.arrow{width:30px;height:58px;font-size:38px}.card{border-radius:15px}.imageWrap{flex-basis:49%;height:49%}.info{padding:9px;gap:4px}.title{font-size:13px;letter-spacing:-.2px}.meta{font-size:10px}.badge{padding:5px 7px;font-size:8px;top:7px;left:7px}.card-cta{display:none}.price{font-size:13px}.display-footer{font-size:10px}.footer-activity{display:none}.footer-policies{gap:7px}.modalTop{height:64px}.modalTitle{font-size:14px}.ticketStage{width:min(620px,85%)}}
@media(orientation:portrait){html,body{overflow:auto}#app{height:auto;min-height:100dvh}.showcase-heading{padding:10px 5px 0}main{min-height:66vh}#grid{display:grid;grid-template-columns:1fr;grid-template-rows:repeat(3,minmax(215px,1fr));padding:0 32px;gap:12px}.card{display:grid;grid-template-columns:43% 57%;min-height:195px}.imageWrap{height:100%;min-height:100%;flex:auto}.info{padding:clamp(11px,3vw,18px);justify-content:center}.card-cta{display:inline}.title{font-size:clamp(16px,4vw,23px)}.meta{font-size:12px}.price{font-size:clamp(13px,3.4vw,20px)}.arrow{height:65px;width:30px}.display-footer{flex-wrap:wrap;min-height:55px;height:auto;padding-bottom:4px}.modalPanel{height:min(760px,95dvh)}.ticketStage{width:95%}}
@media(max-height:680px) and (orientation:landscape){#app{gap:7px;padding-top:8px;padding-bottom:5px}.topbar{min-height:64px;padding:8px 14px}.brand img{height:45px;width:45px}.brand h1{font-size:22px;margin:4px 0}.showcase-heading h2{font-size:24px;margin:3px 0}.showcase-eyebrow{font-size:9px}#tabs{min-height:39px}#tabs button{padding:9px}.imageWrap{flex-basis:50%;height:50%}.display-footer{height:23px}.info{padding:10px 12px}.title{font-size:16px}.meta{font-size:11px}}
@media(max-width:560px){.vcm-cookie-panel{flex-direction:column;align-items:stretch;padding:14px}.vcm-cookie-actions{display:grid;grid-template-columns:1fr 1fr}.vcm-cookie-actions button{width:100%}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}



/* Cookie banner: non copre la vetrina dopo la scelta */
.vcm-cookie-panel[hidden]{display:none!important}
.vcm-cookie-close{font-size:22px!important;font-weight:500!important;border:0!important;background:#fff7f0!important;color:#9e735a!important;min-width:36px!important;width:36px!important;padding:7px!important;border-radius:10px!important}
@media(max-width:720px){.vcm-cookie-panel{bottom:8px}}

/* Solo il preventivo: popup tipo guida del sito, senza modificare offerte e biglietto. */
.modal.quoteMode{padding:clamp(6px,1.2vw,13px)}
.modal.quoteMode .modalPanel{width:min(920px,100%);height:min(680px,100%);max-height:calc(100dvh - 12px);border-radius:24px;background:#f6f7fa}
.modal.quoteMode .modalTop{height:54px;padding:7px 14px;background:#f8f9fc}
.modal.quoteMode .modalKicker{letter-spacing:1px;font-size:9px}
.modal.quoteMode .modalTitle{font-size:17px}
.modal.quoteMode .modalTimer{font-size:12px;padding:7px 12px}
.modal.quoteMode .modalClose{height:40px;width:40px;font-size:25px;border-radius:12px}
.modal.quoteMode .modalFoot{height:20px;font-size:10px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;padding:0 5px}
.modal.quoteMode #offerFrame{background:#f6f7fa}
@media(max-height:650px) and (min-width:580px){
 .modal.quoteMode .modalPanel{height:calc(100dvh - 10px)}
 .modal.quoteMode .modalTop{height:44px;padding:5px 12px}
 .modal.quoteMode .modalKicker{font-size:8px}
 .modal.quoteMode .modalTitle{font-size:14px}
 .modal.quoteMode .modalTimer{font-size:10px;padding:5px 9px}
 .modal.quoteMode .modalClose{height:33px;width:33px;font-size:22px}
 .modal.quoteMode .modalFoot{height:17px;font-size:9px}
}


/* 27 ottobre 2026 — Restyling vetrina da banco.
   Il titolo di sezione è ora nella testata: il menu sale e le fotografie
   occupano molto più spazio, senza alterare carousel, timer o popup. */
@media (orientation: landscape) {
  #app {
    padding: clamp(8px, 1.25vh, 15px) clamp(10px, 1.5vw, 32px) clamp(5px, .7vh, 9px);
    gap: clamp(6px, .9vh, 12px);
  }
  .topbar {
    min-height: clamp(64px, 9vh, 91px);
    padding: clamp(7px, 1.1vh, 12px) clamp(12px, 1.5vw, 24px);
    border-radius: clamp(15px, 1.7vw, 21px);
  }
  .brand img {
    width: clamp(44px, 5.8vh, 62px);
    height: clamp(44px, 5.8vh, 62px);
    border-radius: 14px;
  }
  .brand h1 { margin: 5px 0 0; }
  .brand-eyebrow { font-size: clamp(10px, .82vw, 13px); letter-spacing: 1.2px; }
  .brand p { display: none; }
  #tabs { min-height: clamp(38px, 5.4vh, 49px); gap: clamp(7px, .75vw, 12px); }
  #tabs button {
    padding: clamp(9px, 1.15vh, 13px) 8px;
    border-radius: 12px;
    font-size: clamp(12px, 1.02vw, 16px);
  }
  #grid {
    padding: 0 clamp(31px, 3.05vw, 49px) 1px;
    gap: clamp(9px, 1.15vw, 20px);
  }
  .arrow {
    width: clamp(29px, 2.65vw, 46px);
    height: clamp(49px, 5.2vw, 74px);
  }
  .card { border-radius: clamp(15px, 1.5vw, 25px); }
  /* L’immagine prende tutto lo spazio non necessario ai dati dell’offerta. */
  .imageWrap { height: auto; flex: 1 1 auto; }
  .info {
    flex: 0 0 clamp(120px, 22vh, 165px);
    padding: clamp(8px, 1.2vh, 14px) clamp(11px, 1.2vw, 21px);
    gap: clamp(3px, .55vh, 7px);
  }
  .info .info-eyebrow { font-size: clamp(9px, .73vw, 11px); }
  .title { font-size: clamp(16px, 1.52vw, 25px); line-height: 1.15; }
  .meta { font-size: clamp(11px, .98vw, 15px); }
  .price { font-size: clamp(17px, 1.53vw, 25px); }
  .display-footer { height: 22px; }
}
@media (orientation: landscape) and (max-height: 540px) {
  #app { gap: 5px; }
  .topbar { min-height: 58px; padding-top: 6px; padding-bottom: 6px; }
  .brand img { width: 43px; height: 43px; }
  .brand h1 { font-size: 21px; }
  #tabs { min-height: 36px; }
  #tabs button { padding: 8px 6px; }
  .imageWrap { height: auto; flex: 1 1 auto; }
  .info { flex-basis: 120px; padding: 7px 10px; gap: 3px; }
  .title { font-size: clamp(14px, 1.55vw, 19px); }
  .price { font-size: clamp(15px, 1.55vw, 21px); }
  .card-cta { font-size: 10px; }
  .display-footer { height: 18px; }
}
/* La versione verticale conserva la disposizione su tre righe, ma non
   presenta più il blocco promozionale intermedio. */
@media (orientation: portrait) {
  .brand-eyebrow { letter-spacing: .9px; }
}
/* Telefoni o mini-tablet in orizzontale: evitare la doppia riga di comandi. */
@media (orientation:landscape) and (max-width:720px) and (max-height:440px) {
  .topbar { flex-wrap:nowrap; gap:6px; min-height:49px; padding:5px 8px; }
  .brand { flex-basis:auto; flex:1 1 auto; min-width:0; gap:7px; }
  .brand img { width:34px; height:34px; border-radius:10px; }
  .brand-eyebrow { font-size:8px; letter-spacing:.35px; gap:4px; }
  .live-dot { width:6px; height:6px; box-shadow:0 0 0 2px #ffd2b5; }
  .brand h1 { font-size:17px; margin:3px 0 0; }
  .headerButtons { flex:0 1 auto; gap:4px; min-width:0; }
  .headerButtons .headerSiteBtn { flex:0 1 auto; font-size:9px; padding:7px 6px; gap:3px; }
  #tabs { min-height:31px; }
  #tabs button { padding:6px 3px; font-size:10px; }
  #grid { padding:0 28px 1px; gap:6px; }
  .arrow { width:25px; height:45px; font-size:30px; }
  .info { flex-basis:104px; padding:6px 8px; gap:2px; }
  .info .info-eyebrow { font-size:8px; letter-spacing:.4px; }
  .title { font-size:12px; line-height:1.12; }
  .meta { font-size:9px; }
  .price { font-size:14px; }
  .card-cta { display:none; }
  .badge { font-size:7px; top:7px; left:7px; padding:5px 7px; }
}
@media (orientation:landscape) and (max-width:720px) and (max-height:440px) {
  #tabs button { flex:1 1 0; max-width:none; }
}
