/* ============================================================
   GEPI Expo 2026 — App styles (PWA mobile-first)
   ============================================================ */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%}
body{
  font-family:var(--gepi-font-body);
  font-size:var(--gepi-fs-body);
  color:var(--gepi-ink);
  background:var(--gepi-bg);
  line-height:1.5;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img{max-width:100%;display:block}
button{font:inherit;cursor:pointer;border:none;background:none;color:inherit}
a{color:inherit;text-decoration:none}
::selection{background:var(--gepi-red);color:#fff}

/* ---- App frame (centrato, app-like su desktop) ---- */
.app{
  max-width:var(--gepi-maxw);
  margin:0 auto;
  min-height:100dvh;
  background:var(--gepi-bg);
  position:relative;
  box-shadow:0 0 60px rgba(0,0,0,.10);
}

/* ---- Header ---- */
.appbar{
  position:sticky;top:0;z-index:40;
  height:calc(var(--gepi-header-h) + var(--gepi-safe-t));
  padding-top:var(--gepi-safe-t);
  display:flex;align-items:center;justify-content:space-between;
  padding-left:var(--gepi-s4);padding-right:var(--gepi-s4);
  background:rgba(251,246,238,.86);
  backdrop-filter:saturate(140%) blur(12px);
  border-bottom:1px solid var(--gepi-line);
}
.appbar.is-hero{background:transparent;border-color:transparent}
.appbar__logo{height:24px;width:auto}
.appbar__date{font-size:var(--gepi-fs-eyebrow);font-weight:var(--gepi-fw-sb);letter-spacing:.04em;color:var(--gepi-red);text-transform:uppercase}
.btn-install{
  display:none;align-items:center;gap:6px;
  font-size:var(--gepi-fs-cap);font-weight:var(--gepi-fw-sb);
  background:var(--gepi-ink);color:#fff;
  padding:7px 12px;border-radius:var(--gepi-r-pill);
}
.btn-install.show{display:inline-flex}

/* ---- Main scroll area ---- */
.main{
  padding-bottom:calc(var(--gepi-nav-h) + var(--gepi-safe-b) + var(--gepi-s6));
  min-height:100dvh;
}
.view{display:none;animation:fade .28s var(--gepi-ease)}
.view.active{display:block}
@keyframes fade{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}

.section{padding:var(--gepi-s6) var(--gepi-s4)}
.section--tight{padding-top:var(--gepi-s4)}
.eyebrow{font-size:var(--gepi-fs-eyebrow);font-weight:var(--gepi-fw-bold);letter-spacing:.12em;text-transform:uppercase;color:var(--gepi-red)}
.h2{font-family:var(--gepi-font-display);font-size:var(--gepi-fs-h2);font-weight:var(--gepi-fw-black);line-height:1.1;letter-spacing:-.01em}
.h3{font-family:var(--gepi-font-display);font-size:var(--gepi-fs-h3);font-weight:var(--gepi-fw-bold);line-height:1.15}
.lead{font-size:var(--gepi-fs-lead);color:var(--gepi-ink-soft)}
.muted{color:var(--gepi-muted);font-size:var(--gepi-fs-cap)}
.section__head{margin-bottom:var(--gepi-s4)}
.section__head .h2{margin-top:4px}

/* ---- Buttons ---- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  font-weight:var(--gepi-fw-bold);font-size:1rem;
  padding:14px 22px;border-radius:var(--gepi-r-pill);
  transition:transform .15s var(--gepi-ease),box-shadow .2s var(--gepi-ease),background .2s;
  white-space:nowrap;
}
.btn:active{transform:scale(.97)}
.btn--red{background:var(--gepi-red);color:#fff;box-shadow:var(--gepi-sh-red)}
.btn--red:active{background:var(--gepi-red-deep)}
.btn--ink{background:var(--gepi-ink);color:#fff}
.btn--ghost{background:rgba(255,255,255,.18);color:#fff;border:1.5px solid rgba(255,255,255,.55);backdrop-filter:blur(4px)}
.btn--block{display:flex;width:100%}
.btn--lg{padding:16px 26px;font-size:1.05rem}

/* ---- HERO ---- */
.hero{
  position:relative;
  padding:calc(var(--gepi-safe-t) + 64px) var(--gepi-s4) var(--gepi-s7);
  background:
    radial-gradient(120% 90% at 80% -10%, var(--gepi-gold-soft) 0%, var(--gepi-gold) 42%, var(--gepi-gold-deep) 100%);
  color:var(--gepi-ink);
  overflow:hidden;
}
.hero__logo{height:30px;width:auto;margin-bottom:var(--gepi-s6)}
.hero__eyebrow{
  display:inline-flex;gap:8px;align-items:center;
  font-size:var(--gepi-fs-cap);font-weight:var(--gepi-fw-bold);
  letter-spacing:.06em;text-transform:uppercase;
  background:var(--gepi-ink);color:var(--gepi-gold);
  padding:6px 12px;border-radius:var(--gepi-r-pill);margin-bottom:var(--gepi-s4);
}
.hero__title{
  font-family:var(--gepi-font-display);font-weight:var(--gepi-fw-black);
  font-size:var(--gepi-fs-display);line-height:.98;letter-spacing:-.02em;
  color:var(--gepi-red);text-transform:uppercase;
}
.hero__title em{font-style:normal;color:var(--gepi-ink);display:block}
.hero__sub{margin-top:var(--gepi-s4);font-size:var(--gepi-fs-lead);font-weight:var(--gepi-fw-med);max-width:26ch}
.hero__meta{margin-top:var(--gepi-s5);display:flex;flex-wrap:wrap;gap:10px}
.chip{
  display:inline-flex;align-items:center;gap:6px;
  background:rgba(28,31,37,.08);border:1px solid rgba(28,31,37,.12);
  padding:7px 13px;border-radius:var(--gepi-r-pill);
  font-size:var(--gepi-fs-cap);font-weight:var(--gepi-fw-sb);
}
.hero__cta{margin-top:var(--gepi-s6);display:flex;gap:10px;flex-wrap:wrap}
.hero__deco{position:absolute;right:-30px;bottom:-30px;width:180px;opacity:.9;pointer-events:none;transform:rotate(-8deg)}

/* ---- Countdown ---- */
.countdown{
  margin:0 var(--gepi-s4);transform:translateY(-24px);
  background:var(--gepi-ink);color:#fff;border-radius:var(--gepi-r-lg);
  padding:var(--gepi-s4) var(--gepi-s5);box-shadow:var(--gepi-sh-2);
  display:flex;align-items:center;justify-content:space-between;gap:var(--gepi-s3);
}
.countdown__label{font-size:var(--gepi-fs-eyebrow);text-transform:uppercase;letter-spacing:.1em;color:var(--gepi-gold);font-weight:var(--gepi-fw-bold)}
.countdown__units{display:flex;gap:var(--gepi-s4)}
.cu{text-align:center;min-width:42px}
.cu b{display:block;font-family:var(--gepi-font-display);font-size:1.7rem;font-weight:var(--gepi-fw-black);line-height:1}
.cu span{font-size:.62rem;text-transform:uppercase;letter-spacing:.08em;color:rgba(255,255,255,.7)}

/* ---- Zone grid ---- */
.zones{display:grid;grid-template-columns:1fr 1fr;gap:var(--gepi-s3)}
.zone-card{
  position:relative;border-radius:var(--gepi-r-md);overflow:hidden;
  aspect-ratio:1/1.15;box-shadow:var(--gepi-sh-1);
  display:flex;align-items:flex-end;color:#fff;
}
.zone-card.full{grid-column:1/-1;aspect-ratio:2.1/1}
.zone-card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0;transition:transform .4s var(--gepi-ease)}
.zone-card:active img{transform:scale(1.05)}
.zone-card::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 30%,rgba(20,12,4,.82) 100%);z-index:1}
.zone-card__txt{position:relative;z-index:2;padding:var(--gepi-s4)}
.zone-card__txt .k{font-size:var(--gepi-fs-eyebrow);text-transform:uppercase;letter-spacing:.08em;color:var(--gepi-gold);font-weight:var(--gepi-fw-bold)}
.zone-card__txt .n{font-family:var(--gepi-font-display);font-size:1.2rem;font-weight:var(--gepi-fw-black);line-height:1.05;margin-top:2px}

/* ---- Cards / list ---- */
.card{background:var(--gepi-paper);border:1px solid var(--gepi-line);border-radius:var(--gepi-r-md);padding:var(--gepi-s5);box-shadow:var(--gepi-sh-1)}
.card + .card{margin-top:var(--gepi-s3)}
.info-row{display:flex;gap:var(--gepi-s4);padding:var(--gepi-s4) 0;border-bottom:1px solid var(--gepi-line)}
.info-row:last-child{border-bottom:none}
.info-row .ic{font-size:1.4rem;flex:0 0 28px;text-align:center}
.info-row .k{font-size:var(--gepi-fs-cap);color:var(--gepi-muted);font-weight:var(--gepi-fw-sb);text-transform:uppercase;letter-spacing:.04em}
.info-row .v{font-weight:var(--gepi-fw-sb);margin-top:1px}

/* ---- Zone detail (view Zone) ---- */
.zone-hero{position:relative;height:200px;border-radius:var(--gepi-r-lg);overflow:hidden;color:#fff;display:flex;align-items:flex-end;margin-bottom:var(--gepi-s4)}
.zone-hero img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.zone-hero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.1),rgba(20,12,4,.8))}
.zone-hero__txt{position:relative;z-index:2;padding:var(--gepi-s5)}
.zone-block{margin-bottom:var(--gepi-s6)}
.zone-block .desc{color:var(--gepi-ink-soft);margin-top:var(--gepi-s2)}
.taglist{display:flex;flex-wrap:wrap;gap:8px;margin-top:var(--gepi-s3)}
.tag{background:var(--gepi-cream);border:1px solid var(--gepi-line);padding:6px 11px;border-radius:var(--gepi-r-pill);font-size:var(--gepi-fs-cap);font-weight:var(--gepi-fw-med)}

/* ---- Placeholder (sezioni in arrivo) ---- */
.placeholder{text-align:center;padding:var(--gepi-s9) var(--gepi-s5);color:var(--gepi-ink-soft)}
.placeholder .big{font-size:2.6rem;margin-bottom:var(--gepi-s3)}

/* ---- Bottom nav ---- */
.tabbar{
  position:fixed;left:50%;transform:translateX(-50%);bottom:0;
  width:100%;max-width:var(--gepi-maxw);z-index:50;
  height:calc(var(--gepi-nav-h) + var(--gepi-safe-b));
  padding-bottom:var(--gepi-safe-b);
  background:rgba(255,255,255,.92);backdrop-filter:saturate(150%) blur(14px);
  border-top:1px solid var(--gepi-line);
  display:flex;justify-content:space-around;align-items:stretch;
}
.tab{
  flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;
  color:var(--gepi-muted);font-size:.62rem;font-weight:var(--gepi-fw-sb);
  letter-spacing:.02em;transition:color .2s;
}
.tab svg{width:23px;height:23px;stroke-width:2;transition:transform .2s var(--gepi-ease)}
.tab.active{color:var(--gepi-red)}
.tab.active svg{transform:translateY(-1px)}
.tab--cta{color:#fff}
.tab--cta .ico{display:grid;place-items:center;width:46px;height:46px;border-radius:50%;background:var(--gepi-red);box-shadow:var(--gepi-sh-red);margin-top:-18px}
.tab--cta .ico svg{width:24px;height:24px;color:#fff}
.tab--cta.active{color:var(--gepi-red)}

/* ---- Social row ---- */
.social{display:flex;gap:var(--gepi-s3);justify-content:center;margin-top:var(--gepi-s4)}
.social a{width:44px;height:44px;border-radius:50%;background:var(--gepi-ink);color:#fff;display:grid;place-items:center;font-weight:var(--gepi-fw-bold)}

.foot{padding:var(--gepi-s7) var(--gepi-s4);text-align:center;color:var(--gepi-muted);font-size:var(--gepi-fs-cap)}
.foot img{height:20px;margin:0 auto var(--gepi-s3);opacity:.5}

/* ---- Form ---- */
#regForm .k{display:block;margin:var(--gepi-s3) 0 6px}
.fld{
  width:100%;font:inherit;color:var(--gepi-ink);
  background:var(--gepi-cream);border:1.5px solid var(--gepi-line-strong);
  border-radius:var(--gepi-r-sm);padding:13px 14px;
}
.fld:focus{outline:none;border-color:var(--gepi-red);background:#fff}

/* divider */
.sep{height:1px;background:var(--gepi-line);margin:var(--gepi-s6) var(--gepi-s4)}

/* ============================================================
   v2 polish — icone, lockup, gerarchia
   ============================================================ */

/* Icone a linea */
.ic{width:18px;height:18px;flex:0 0 auto;display:inline-block;vertical-align:middle;stroke:currentColor;color:inherit}
.btn .ic{width:18px;height:18px}

/* Brand lockup tipografico (sostituisce il logo bitmap nella UI) */
.brand{display:inline-flex;align-items:center;gap:7px}
.brand__g{font-family:var(--gepi-font-display);font-weight:800;font-size:1.18rem;letter-spacing:-.02em;color:var(--gepi-ink)}
.brand__x{font-family:var(--gepi-font-display);font-weight:800;font-size:.6rem;letter-spacing:.1em;color:#fff;background:var(--gepi-red);padding:3px 6px 2px;border-radius:6px}

/* Hero ripulito */
.hero{isolation:isolate}
.hero > *{position:relative;z-index:1}
.hero::before{content:"";position:absolute;inset:0;z-index:0;background:radial-gradient(70% 55% at 50% 118%,rgba(190,12,27,.20),transparent 70%);pointer-events:none}
.hero__kicker{font-family:var(--gepi-font-display);font-weight:700;font-size:.72rem;letter-spacing:.22em;color:var(--gepi-red);margin-bottom:6px}
.hero__eyebrow{display:inline-block;font-size:.7rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--gepi-ink);opacity:.62;margin-bottom:var(--gepi-s4)}
.hero__title{margin-top:2px}

/* Bottoni secondari (outline) — riducono il peso visivo */
.btn--line{background:transparent;color:var(--gepi-ink);border:1.6px solid var(--gepi-line-strong)}
.btn--line:active{background:var(--gepi-cream)}
.btn--line-light{background:transparent;color:var(--gepi-ink);border:1.6px solid rgba(28,31,37,.5)}
.btn--line-light:active{background:rgba(255,255,255,.25)}

/* Chip: icona allineata */
.chip{font-weight:var(--gepi-fw-sb)}
.chip .ic{width:15px;height:15px;color:var(--gepi-ink);opacity:.7}

/* Info row con icona in pastiglia */
.info-ic{flex:0 0 42px;width:42px;height:42px;border-radius:13px;background:var(--gepi-cream);color:var(--gepi-red);display:grid;place-items:center}
.info-ic .ic{width:21px;height:21px}

/* Tab bar icone */
.tic{width:23px;height:23px;stroke:currentColor;transition:transform .2s var(--gepi-ease)}
.tab.active .tic{transform:translateY(-1px)}

/* Social icone */
.social a .ic{width:20px;height:20px;color:#fff}

/* Filtri / tag attivo */
.tag--on{background:var(--gepi-ink);color:#fff;border-color:var(--gepi-ink)}

/* Zone detail kicker */
.zone-hero__k{font-size:var(--gepi-fs-eyebrow);font-weight:var(--gepi-fw-bold);letter-spacing:.1em;text-transform:uppercase;color:var(--gepi-gold)}

/* Stato vuoto / successo */
.empty{text-align:center;padding:var(--gepi-s8) var(--gepi-s4)}
.empty__ic{width:66px;height:66px;border-radius:20px;background:var(--gepi-cream);color:var(--gepi-red);display:inline-grid;place-items:center;margin-bottom:var(--gepi-s4)}
.empty__ic .ic{width:30px;height:30px}
.empty__ic--ok{background:#E8F5E9;color:var(--gepi-success)}
.empty .h3{margin-bottom:6px}

/* Planimetria schematica (al posto del collage fuorviante) */
.planimetria{display:block;padding:0;overflow:hidden}
.planimetria__map{position:relative;height:172px;background:linear-gradient(135deg,var(--gepi-cream),#fff);display:flex;gap:16px;align-items:center;justify-content:center;border-bottom:1px solid var(--gepi-line)}
.planimetria__hall{width:33%;height:64%;border:2px dashed var(--gepi-gold-deep);border-radius:14px;display:grid;place-items:center;font-family:var(--gepi-font-display);font-weight:800;font-size:1.7rem;color:var(--gepi-gold-deep);background:rgba(248,184,43,.09)}
.planimetria__tag{position:absolute;bottom:10px;right:12px;font-size:.7rem;font-weight:700;color:var(--gepi-ink-soft);background:#fff;padding:4px 10px;border-radius:var(--gepi-r-pill);border:1px solid var(--gepi-line)}
.planimetria__cta{padding:14px var(--gepi-s5);display:flex;align-items:center;gap:9px;font-weight:var(--gepi-fw-bold);color:var(--gepi-red)}
.planimetria__cta .ic{color:var(--gepi-red)}

/* Logo ufficiale (ripristinato) */
.brand__logo{height:28px;width:auto;display:block}
.hero__logo{height:38px;width:auto;margin-bottom:var(--gepi-s5);filter:drop-shadow(0 1px 3px rgba(0,0,0,.14))}
.foot__logo{display:block;height:26px;width:auto;margin:0 auto var(--gepi-s3);opacity:.85}
