/* Inter e Lora sono variabili sull'asse wght: un file copre tutta la gamma.
   Il range dichiarato deve restare quello dell'asse (fvar), altrimenti il
   browser sintetizza il grassetto invece di interpolare. */
@font-face{font-family:'Inter';font-weight:100 900;src:url(fonts/inter.woff2) format('woff2')}
@font-face{font-family:'Lora';font-weight:400 700;src:url(fonts/lora.woff2) format('woff2')}
/* fonts:start — generato da `python scripts/fetch_fonts.py`, non modificare a mano */
@font-face{font-family:'Bricolage Grotesque';font-style:normal;font-weight:800;font-display:swap;src:url(fonts/bricolage-800.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:'IBM Plex Sans';font-style:normal;font-weight:400 700;font-display:swap;src:url(fonts/plex-sans-cyrillic.woff2) format('woff2');unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116}
@font-face{font-family:'IBM Plex Sans';font-style:normal;font-weight:400 700;font-display:swap;src:url(fonts/plex-sans-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-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'IBM Plex Sans';font-style:normal;font-weight:400 700;font-display:swap;src:url(fonts/plex-sans-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:'IBM Plex Mono';font-style:normal;font-weight:500;font-display:swap;src:url(fonts/plex-mono-500-cyrillic.woff2) format('woff2');unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116}
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:500;font-display:swap;src:url(fonts/plex-mono-500-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-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:500;font-display:swap;src:url(fonts/plex-mono-500-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:'IBM Plex Mono';font-style:normal;font-weight:600;font-display:swap;src:url(fonts/plex-mono-600-cyrillic.woff2) format('woff2');unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116}
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:600;font-display:swap;src:url(fonts/plex-mono-600-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-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:600;font-display:swap;src:url(fonts/plex-mono-600-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}
/* fonts:end */
:root{
  --green-deep:#0e5c41; --green-mid:#127453; --green-tint:#e6f7f0;
  --gold:#b8860b; --bg:#f4f6f5; --surface:#fff; --text:#10241c;
  --text-mid:#3a5247; --text-light:#7d908a; --border:#e2e9e5;
}

/* ── Colori per sezione ──────────────────────────────────────────────────────
   --sec      identità (riempimenti grandi: bolle, media card, gradienti)
   --sec-txt  testo su bianco e sfondi con testo bianco: verificati >= 4.5 di
              contrasto (l'emerald puro dà 1.81 col bianco: illeggibile)
   --sec-deep stato attivo/premuto · --sec-tint fondo tenue
   I componenti condivisi (.btn-filtri, .cs-opt, .rc-sector, .rc-cta) leggono
   queste variabili, così ogni sezione si colora da sé. */
:root{--sec:var(--green-mid);--sec-txt:var(--green-mid);--sec-deep:var(--green-deep);--sec-tint:var(--green-tint)}
#tab-ricerca,#tab-esplora,#cerca-top,#filter-sheet{--sec:#16DB93;--sec-txt:#0D875B;--sec-deep:#0B6D49;--sec-tint:#E7FBF3}
#tab-concorsi,#cfilter-sheet{--sec:#89043D;--sec-txt:#89043D;--sec-deep:#5E022A;--sec-tint:#FBEAF1}
#tab-cpi,#pfilter-sheet,#cpi-how{--sec:#3083DC;--sec-txt:#2C78CA;--sec-deep:#1E5FA8;--sec-tint:#EAF2FC}
*{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent}
/* testo e immagini non selezionabili (campi di testo esclusi) */
html,body,#app,#app *{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-touch-callout:none}
#app input,#app textarea,#app [contenteditable]{-webkit-user-select:text;-moz-user-select:text;-ms-user-select:text;user-select:text}
img{-webkit-user-drag:none;-khtml-user-drag:none;user-drag:none}
html,body{height:100%}
body{font-family:'Inter','Segoe UI','Noto Sans Bengali','Noto Sans Sinhala','Noto Sans',sans-serif;background:#222;color:var(--text);overflow:hidden}
#app{position:relative;max-width:480px;height:100dvh;margin:0 auto;background:var(--bg);
  overflow:hidden;box-shadow:0 0 40px rgba(0,0,0,.4)}

.panel{position:absolute;inset:0 0 calc(66px + env(safe-area-inset-bottom)) 0;overflow-y:auto;-webkit-overflow-scrolling:touch;display:none}
.panel.active{display:block}
.panel.slide-r{animation:pSlideR .26s ease}
.panel.slide-l{animation:pSlideL .26s ease}
@keyframes pSlideR{from{transform:translateX(28px);opacity:.45}to{transform:translateX(0);opacity:1}}
@keyframes pSlideL{from{transform:translateX(-28px);opacity:.45}to{transform:translateX(0);opacity:1}}
.panel::-webkit-scrollbar{width:0}

/* Tab bar */
#tabbar{position:absolute;left:14px;right:14px;bottom:calc(8px + env(safe-area-inset-bottom));height:62px;
  border-radius:26px;display:flex;background:rgba(255,255,255,.97);
  backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border:1px solid var(--border);
  box-shadow:0 8px 26px rgba(14,92,65,.18);z-index:50;overflow:hidden}
.tab{flex:1;border:none;background:none;display:flex;flex-direction:column;align-items:center;
  justify-content:center;gap:4px;color:var(--text-light);font-size:.6rem;font-weight:600;cursor:pointer;padding-top:8px;white-space:nowrap}
.sind-wrap{padding:14px 18px 24px}
.tab .ic{width:52px;height:30px;display:flex;align-items:center;justify-content:center;border-radius:999px;
  transition:background .22s ease,transform .14s ease}
.tab svg{width:24px;height:24px;stroke:currentColor;fill:none;stroke-width:1.9;
  stroke-linecap:round;stroke-linejoin:round;transition:stroke .2s,fill .2s}
.tab:active .ic{transform:scale(.84)}
.tab.active{color:var(--green-deep);font-weight:700}
.tab.active .ic{background:var(--green-tint)}
.tab.active svg{stroke:var(--green-mid);fill:rgba(18,116,83,.14)}
/* icona-logo (sezione Sindacato) */
.tab .ic-logo img{width:23px;height:23px;border-radius:50%;object-fit:contain;display:block;
  filter:grayscale(.4) opacity(.55);transition:filter .22s,box-shadow .22s}
.tab.active .ic-logo{background:transparent}
.tab.active .ic-logo img{filter:none;box-shadow:0 0 0 2px var(--green-tint)}

/* HOME */
.sind-logo{width:170px;height:170px;border-radius:50%;background:#fff;border:2px solid var(--green-tint);
  object-fit:contain;padding:14px;display:block;margin:6px auto 10px;box-shadow:0 6px 22px rgba(0,0,0,.1)}
.sind-brand{text-align:center;color:var(--text-mid);font-weight:600;line-height:1.3;margin-bottom:18px}
.sind-brand b{display:block;color:var(--green-deep);font-size:1.1rem;font-family:'Lora',serif}
.sind-credit{margin:20px auto 4px;padding:9px 16px;max-width:320px;text-align:center;
  background:var(--green-tint);border-radius:12px;border:1px solid var(--border)}
.sind-credit .sc-role{white-space:nowrap}
.sind-credit .sc-label{display:block;font-size:.58rem;letter-spacing:.07em;text-transform:uppercase;color:var(--text-light);margin-bottom:2px}
.sind-credit b{display:block;color:var(--green-deep);font-size:.86rem;font-family:'Lora',serif}
.sind-credit .sc-role{display:block;font-size:.68rem;color:var(--text-mid);line-height:1.3;margin-top:2px}
.iab-banner{position:absolute;top:0;left:0;right:0;z-index:1700;display:flex;align-items:center;gap:9px;
  padding:10px 12px;background:linear-gradient(135deg,#16a34a,#0e5c41);color:#fff;
  box-shadow:0 4px 16px rgba(0,0,0,.2)}
.iab-banner .iab-txt{flex:1;font-size:.8rem;font-weight:600;line-height:1.28}
.iab-banner .iab-open{flex-shrink:0;background:#fff;color:var(--green-deep);border:none;border-radius:9px;
  padding:8px 13px;font-weight:800;font-size:.8rem;cursor:pointer;font-family:inherit}
.iab-banner .iab-x{flex-shrink:0;background:transparent;border:none;color:#fff;font-size:1.05rem;cursor:pointer;line-height:1;padding:2px 4px}
.home-stats{display:flex;gap:10px;margin:22px 0}
.stat{flex:1;background:var(--surface);border:1px solid var(--border);border-radius:16px;padding:14px;text-align:center}
.stat b{display:block;font-size:1.6rem;font-weight:800;color:var(--green-mid)}
.stat span{font-size:.72rem;color:var(--text-light);font-weight:600}
.soc{width:46px;height:46px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  color:#fff;text-decoration:none;transition:transform .12s}
.soc:active{transform:scale(.86)}
.soc svg{width:24px;height:24px;fill:#fff}
.soc.fb{background:#1877f2}.soc.ig{background:radial-gradient(circle at 30% 110%,#fdf497,#fd5949,#d6249f,#285AEB)}
.soc.wa{background:#25d366}
.soc.email{background:#0078d4}
.soc.web{background:linear-gradient(135deg,#16a34a,#0e5c41)}
.home-legal{text-align:center;color:var(--text-light);font-size:.72rem;margin-top:20px;line-height:1.5}

/* Highlights a bolle (storie in evidenza) */
.highlights{display:flex;gap:14px;overflow-x:auto;padding:20px 2px 8px;scrollbar-width:none}
.reco-title{text-align:center;font-size:.82rem;font-weight:700;color:var(--green-deep);letter-spacing:.01em}
.highlights::-webkit-scrollbar{height:0}
.hl{flex:0 0 auto;border:none;background:none;display:flex;flex-direction:column;align-items:center;gap:7px;cursor:pointer}
.hl-ic{width:66px;height:66px;border-radius:50%;padding:3px;display:flex;
  background:linear-gradient(135deg,#16a34a 0%,#ffd24a 100%);transition:transform .14s}
.hl-ic>span{flex:1;border-radius:50%;background:#fff;display:flex;align-items:center;justify-content:center;font-size:1.7rem}
.hl-ic svg{width:30px;height:30px;stroke:var(--green-deep);fill:none;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.hl:active .hl-ic{transform:scale(.9)}
.hl-lbl{font-size:.72rem;font-weight:600;color:var(--text-mid);white-space:nowrap;max-width:74px;overflow:hidden;text-overflow:ellipsis}

/* Sezione Servizi (sportello CISL) */
.sec-intro{color:var(--text-mid);font-size:.92rem;margin:0 2px 14px;line-height:1.5}

/* Overlay collezione (feed tematico full-screen aperto da una bolla) */
/* touch-action:none — i gesti qui li governa il player (trascina-per-chiudere,
   tap sx/dx, swipe avanti/indietro). Senza, sul telefono il browser può prendersi
   il pan verticale e annullare i pointer event a metà gesto. Niente scorre qui
   dentro (#coll-feed e .slide sono overflow:hidden), quindi non si perde nulla. */
#collection{position:absolute;inset:0;z-index:1250;background:#000;display:none;touch-action:none}
#collection.open{display:block;animation:cdIn .22s ease}
#story-bars{position:absolute;top:0;left:0;right:0;z-index:94;display:flex;gap:4px;padding:10px 12px 0}
.pbar{flex:1;height:3px;border-radius:3px;background:rgba(255,255,255,.35);overflow:hidden}
.pfill{height:100%;width:0;background:#fff;border-radius:3px}
.pfill.done{width:100%}
@keyframes storyfill{from{width:0}to{width:100%}}
.coll-head{position:absolute;top:18px;left:0;right:0;z-index:93;display:flex;align-items:center;gap:12px;
  padding:14px 18px 28px;background:linear-gradient(180deg,rgba(0,0,0,.6),transparent);pointer-events:none}
.coll-head button{pointer-events:auto;width:40px;height:40px;border-radius:50%;background:rgba(0,0,0,.45);
  backdrop-filter:blur(6px);color:#fff;border:none;font-size:1.1rem;cursor:pointer;flex-shrink:0}
.coll-head button:active{transform:scale(.85)}
/* titolo della storia nascosto alla vista: resta nel DOM (openStory continua a
   valorizzarlo) come contesto per gli screen reader. Per rimostrarlo, ripristinare
   la regola: color:#fff;font-weight:700;font-size:1.05rem;text-shadow:0 1px 4px rgba(0,0,0,.6) */
.coll-head span{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;
  clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}
#coll-feed{height:100%;overflow:hidden}
#coll-feed .slide{height:100%}

/* ESPLORA feed */
#tab-esplora{overflow:hidden;inset:0 0 calc(66px + env(safe-area-inset-bottom)) 0}
.feed{height:100%;overflow-y:scroll;scroll-snap-type:y mandatory;-webkit-overflow-scrolling:touch}
.feed::-webkit-scrollbar{width:0}
.slide{height:100%;scroll-snap-align:start;position:relative;display:flex;flex-direction:column;
  justify-content:flex-end;padding:24px 92px 24px 24px;color:#fff;overflow:hidden}
.slide .bg{position:absolute;inset:0;z-index:0}
.slide .bg img{width:100%;height:100%;object-fit:cover;opacity:.5}
.slide .bg::after{content:'';position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(8,40,28,.35) 0%,rgba(8,40,28,.92) 78%)}
.slide-body{position:relative;z-index:1}
.slide .eyebrow{font-size:.78rem;font-weight:700;letter-spacing:.5px;text-transform:uppercase;color:#bfe9d6}
.slide h2{font-family:'Lora',serif;font-size:1.9rem;line-height:1.12;margin:8px 0 12px}
.slide .row{display:flex;align-items:center;gap:8px;font-size:1rem;font-weight:600;margin-bottom:6px;color:#eafff5}
.slide .sal{display:inline-block;background:linear-gradient(135deg,#16a34a,#127453);font-weight:800;
  padding:8px 16px;border-radius:999px;margin-top:6px}
.extra{display:none;margin-top:14px;background:rgba(0,0,0,.28);border-radius:14px;padding:6px 16px;
  max-height:240px;overflow-y:auto}
.extra.open{display:block}
.extra .er{display:flex;justify-content:space-between;gap:14px;padding:9px 0;border-bottom:1px solid rgba(255,255,255,.12);font-size:.9rem}
.extra .er:last-child{border-bottom:none}
.extra .er b{color:#bfe9d6;font-weight:600;flex-shrink:0}
.extra .er span{text-align:right;color:#fff}
.btn-altro{display:inline-block;background:rgba(255,255,255,.16);color:#fff;border:none;border-radius:8px;padding:5px 11px;
  font-weight:700;margin-top:12px;cursor:pointer;font-size:.74rem;font-family:inherit;transition:transform .12s}
.btn-altro:active{transform:scale(.96)}
.slide-actions{margin:18px -92px 0 -24px;display:flex;justify-content:center}   /* CTA compatto e centrato */
.btn-apply{display:block;text-align:center;background:#fff;color:var(--green-deep);border:none;border-radius:12px;
  padding:15px;font-weight:800;font-size:1rem;text-decoration:none;transition:transform .12s}
.btn-apply:active{transform:scale(.97)}
.slide-actions .btn-apply{display:inline-block;width:auto;border-radius:999px;padding:13px 44px}
.badges{position:absolute;top:20px;left:20px;z-index:2;display:flex;flex-direction:column;gap:6px;align-items:flex-start}
.badge{font-size:.72rem;font-weight:700;color:#fff;padding:4px 11px;border-radius:999px;box-shadow:0 2px 8px rgba(0,0,0,.25)}
.badge.n{background:linear-gradient(135deg,#16a34a,#127453)}
.badge.s{background:linear-gradient(135deg,#f59e0b,#c05a00)}
.badge.p{background:linear-gradient(135deg,#2563eb,#1e40af)}
#coll-feed .badges{top:74px}   /* sotto barre + titolo storia */
#cd-body .badges{top:58px}     /* sotto notch / tasto chiudi */

/* Rail azioni stile IG (cuore/condividi/salva) */
.rail{position:absolute;right:12px;bottom:120px;z-index:6;display:flex;flex-direction:column;gap:20px;align-items:center}
.ritem{display:flex;flex-direction:column;align-items:center;gap:4px}
.rbtn{width:54px;height:54px;border-radius:50%;border:none;cursor:pointer;display:flex;align-items:center;
  justify-content:center;background:rgba(255,255,255,.18);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);
  transition:transform .12s ease}
.rbtn svg{width:28px;height:28px;stroke:#fff;fill:none;stroke-width:2}
.rbtn:active{transform:scale(.8)}
.ritem span{font-size:.62rem;font-weight:700;color:#fff;text-shadow:0 1px 3px rgba(0,0,0,.6)}
.rbtn.like.on svg{fill:#ff3b5c;stroke:#ff3b5c}
.rbtn.save.on svg{fill:#ffd24a;stroke:#ffd24a}
.pop{animation:pop .35s ease}
@keyframes pop{0%{transform:scale(1)}40%{transform:scale(1.32)}100%{transform:scale(1)}}
.save-burst{position:absolute;top:50%;left:50%;z-index:8;font-size:5.2rem;pointer-events:none;
  filter:drop-shadow(0 4px 14px rgba(0,0,0,.45));animation:saveburst .75s ease forwards}
@keyframes saveburst{0%{transform:translate(-50%,-50%) scale(0);opacity:0}
  25%{transform:translate(-50%,-50%) scale(1.15);opacity:1}
  70%{transform:translate(-50%,-50%) scale(1);opacity:1}
  100%{transform:translate(-50%,-50%) scale(1.4);opacity:0}}

/* Slide PILLOLA */
.slide.pillola{justify-content:center;align-items:stretch;text-align:left;color:#5b4a17;
  background:linear-gradient(160deg,#fffdf0 0%,#f3e9c8 100%);padding:30px 88px 30px 28px}
.slide.pillola .bg{display:none}
.slide.pillola .slide-body{width:100%;max-width:560px;margin:auto}
.pill-head{display:flex;align-items:center;gap:13px;margin-bottom:16px}
.plogo{width:62px;height:62px;flex:none;border-radius:50%;background:#fff;padding:7px;object-fit:contain;
  border:2px solid #d4af37}
.peyebrow{font-size:.72rem;font-weight:800;text-transform:uppercase;letter-spacing:.08em;color:#8a6915}
.ptitolo{font-family:'Lora',serif;font-size:1.65rem;line-height:1.12;margin:4px 0 0;color:#2f290f}
.ptesto{font-size:1.02rem;line-height:1.46;margin:0 0 15px;color:#463b19;font-weight:600}
.pcheck{display:flex;flex-direction:column;gap:4px;padding:12px 14px;border-radius:14px;
  background:rgba(255,255,255,.72);border:1px solid rgba(160,125,30,.24);color:#3d3210}
.pcheck b{font-size:.7rem;text-transform:uppercase;letter-spacing:.08em;color:var(--green-mid)}
.pcheck span{font-size:.9rem;line-height:1.38;font-weight:650}
.pmeta{display:flex;flex-wrap:wrap;justify-content:space-between;gap:5px 12px;margin-top:11px;
  font-size:.7rem;line-height:1.3;color:#75611f;font-weight:700}
.pill-actions{display:flex;flex-direction:column;gap:8px;margin-top:15px}
.pill-action,.pill-source{display:flex;align-items:center;justify-content:center;min-height:43px;padding:10px 14px;
  border-radius:12px;text-decoration:none;font-size:.86rem;font-weight:850;text-align:center}
.pill-action{background:var(--green-mid);color:#fff;box-shadow:0 5px 14px rgba(18,116,83,.22)}
.pill-source{background:rgba(255,255,255,.58);color:var(--green-deep);border:1px solid rgba(18,116,83,.25)}
.pill-action:active,.pill-source:active{transform:scale(.98)}
.slide.pillola .rbtn{background:rgba(0,0,0,.07)}
.slide.pillola .rbtn svg{stroke:#5b4a17}
.slide.pillola .ritem span{color:#5b4a17;text-shadow:none}

/* Slide SERVIZIO (storia brandizzata sindacato) */
.slide.servizio{justify-content:center;background:linear-gradient(165deg,#0f7050 0%,#08402d 100%);
  color:#fff;text-align:left;padding:70px 40px}
.slide.servizio .bg{display:none}
.svc-ic{font-size:3.4rem;margin-bottom:8px}
.svc-nome{font-family:'Lora',serif;font-size:2.1rem;font-weight:700;line-height:1.1}
.svc-blurb{font-size:1.04rem;color:#cdeede;margin:10px 0 24px;line-height:1.45}
.svc-list{list-style:none;display:flex;flex-direction:column;gap:13px}
.svc-list li{position:relative;padding-left:36px;font-size:1.04rem;line-height:1.35;color:#eafff5}
.svc-list li::before{content:'✓';position:absolute;left:0;top:1px;width:25px;height:25px;border-radius:50%;
  background:#ffd24a;color:#0e5c41;font-weight:800;font-size:.8rem;display:flex;align-items:center;justify-content:center}
.svc-hint{font-size:.95rem;color:#bfe9d6;margin-top:18px;font-weight:600}
/* Slide VOCE (una per servizio offerto) */
.slide.voce{justify-content:center;background:linear-gradient(165deg,#0f7050 0%,#08402d 100%);color:#fff;text-align:left;padding:70px 40px}
.slide.voce .bg{display:none}
.voce-eyebrow{display:flex;align-items:center;gap:9px;font-size:.92rem;font-weight:700;color:#ffd24a;text-transform:uppercase;letter-spacing:.5px}
.voce-eyebrow .vic{font-size:1.5rem}
.voce-testo{font-family:'Lora',serif;font-size:2rem;font-weight:700;line-height:1.26;margin-top:20px}
.voce-check{margin-top:22px;display:inline-flex;align-items:center;gap:8px;color:#cdeede;font-size:.98rem;font-weight:600}

/* header tab */
.tab-head{position:sticky;top:0;z-index:10;background:var(--surface);border-bottom:1px solid var(--border);
  padding:16px 18px 12px}
.tab-head h1{font-family:'Lora',serif;font-size:1.4rem;color:var(--green-deep)}
.search{display:flex;align-items:center;gap:8px;background:var(--bg);border:1px solid var(--border);
  border-radius:12px;padding:10px 14px;margin-top:12px}
.search input{border:none;background:none;outline:none;width:100%;font-size:16px;color:var(--text)}
.search svg{width:18px;height:18px;stroke:var(--text-light);fill:none;stroke-width:2;flex-shrink:0}
.search-row{display:flex;gap:8px;align-items:stretch;margin-top:12px}
.search-row .search{flex:1;margin-top:0}
.btn-filtri{flex-shrink:0;border:none;background:var(--sec-txt);color:#fff;border-radius:999px;padding:0 18px;
  font-weight:700;font-size:.9rem;cursor:pointer;white-space:nowrap;transition:transform .12s,background .15s;
  box-shadow:0 2px 8px rgba(11,107,73,.28)}
.btn-filtri svg,.map-filtri svg{width:18px;height:18px;flex-shrink:0}
.btn-filtri:active{transform:scale(.95)}
.btn-filtri.on{background:var(--sec-deep)}
.cs-save{margin:10px 18px 4px;border:1.5px solid var(--green-mid);background:var(--surface);color:var(--green-mid);
  border-radius:12px;padding:13px;font-weight:700;font-size:.92rem;cursor:pointer;font-family:inherit}
.cs-save:active{transform:scale(.98)}
/* istruzioni "Aggiungi a Home" (stesso impianto di #save-dialog) */
#howto{position:absolute;inset:0;z-index:1650;display:none}
#howto.open{display:flex;align-items:center;justify-content:center}
.ht-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.45)}
.ht-card{position:relative;width:88%;max-width:360px;max-height:82%;overflow-y:auto;background:var(--surface);
  border-radius:18px;padding:20px;box-shadow:0 12px 40px rgba(0,0,0,.3);animation:cdIn .2s ease}
.ht-head{display:flex;align-items:flex-start;gap:10px;margin-bottom:12px}
.ht-title{flex:1;font-family:'Lora',serif;font-weight:700;font-size:1.14rem;line-height:1.3;color:var(--green-deep)}
.ht-x{flex:none;border:none;background:var(--bg);color:var(--text-mid);width:30px;height:30px;border-radius:50%;
  font-size:.9rem;line-height:1;cursor:pointer}
.ht-intro{font-size:.88rem;color:var(--text-mid);line-height:1.45;margin-bottom:14px}
.ht-steps{list-style:none;counter-reset:ht;display:flex;flex-direction:column;gap:12px}
.ht-steps li{counter-increment:ht;position:relative;padding-left:34px;font-size:.92rem;line-height:1.45;color:var(--text)}
.ht-steps li::before{content:counter(ht);position:absolute;left:0;top:-1px;width:24px;height:24px;border-radius:50%;
  background:var(--green-tint);color:var(--green-deep);font-weight:700;font-size:.78rem;display:flex;
  align-items:center;justify-content:center}
/* "Copia il link": ripiego sempre disponibile se il menu dell'app non collabora */
.ht-copy{display:none;width:100%;margin-top:16px;padding:11px 12px;border:1px solid var(--green-mid);
  border-radius:12px;background:var(--green-tint);color:var(--green-deep);font-family:inherit;
  font-size:.88rem;font-weight:600;cursor:pointer}
.ht-copy.on{display:block}
.ht-copy.done{background:var(--green-mid);border-color:var(--green-mid);color:#fff}
.ht-note{margin-top:14px;padding-top:12px;border-top:1px solid var(--border);font-size:.78rem;color:var(--text-light)}
/* Indirizzo mostrato quando gli appunti sono negati: un tocco lo seleziona tutto.
   Prefisso #app per battere la regola "#app *{user-select:none}" di riga 37, e
   touch-callout ripristinato perché su iOS è il menu «Copia» del tocco lungo. */
#app .ht-url{user-select:all;-webkit-user-select:all;-webkit-touch-callout:default;
  word-break:break-all;font-family:ui-monospace,'SFMono-Regular',Menlo,monospace;color:var(--text-mid)}
/* icone dei passi: allineate al testo, prendono il colore della riga */
.ht-ic{width:1.15em;height:1.15em;vertical-align:-.22em;margin:0 .1em;fill:currentColor;color:var(--green-deep)}
/* dialog salva ricerca (nome precompilato) */
#save-dialog{position:absolute;inset:0;z-index:1600;display:none}
#save-dialog.open{display:flex;align-items:center;justify-content:center}
.sd-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.45)}
.sd-card{position:relative;width:84%;max-width:340px;background:var(--surface);border-radius:18px;padding:22px;
  box-shadow:0 12px 40px rgba(0,0,0,.3);animation:cdIn .2s ease}
.sd-title{font-family:'Lora',serif;font-weight:700;font-size:1.25rem;color:var(--green-deep);margin-bottom:14px}
#sd-name{width:100%;border:1.5px solid var(--border);border-radius:12px;padding:12px 14px;font-size:16px;font-family:inherit;color:var(--text);outline:none}
#sd-name:focus{border-color:var(--green-mid)}
.sd-actions{display:flex;gap:10px;margin-top:18px}
.sd-actions button{flex:1;border:none;border-radius:12px;padding:13px;font-weight:700;font-size:.95rem;cursor:pointer;font-family:inherit}
#sd-cancel{background:var(--bg);color:var(--text-mid)}
#sd-ok{background:var(--green-mid);color:#fff}

/* PREFERITI */
.msg{display:flex;align-items:center;gap:14px;padding:14px 18px;border-bottom:1px solid var(--border);
  cursor:pointer;background:var(--surface);transition:background .15s}
.msg:active{background:var(--green-tint)}
.msg .avatar{width:54px;height:54px;border-radius:50%;flex-shrink:0;overflow:hidden;background:var(--green-tint);
  display:flex;align-items:center;justify-content:center}
.msg .avatar img{width:100%;height:100%;object-fit:cover}
.msg .mtext{flex:1;min-width:0}
.msg .mt{font-weight:700;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.msg .ms{font-size:.84rem;color:var(--text-light);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:2px}
.msg .msal{font-size:.8rem;font-weight:700;color:var(--green-mid);margin-top:3px}
.empty{text-align:center;color:var(--text-light);padding:60px 30px;line-height:1.6}
.empty .ico{font-size:3rem}

/* RICERCA */
.ss-title{padding:16px 18px 0;font-weight:700;color:var(--green-deep);font-size:.98rem}
.ss-row{padding:12px 14px 6px}
.ss{position:relative;flex:0 0 auto}
.ss-del{position:absolute;top:-2px;right:6px;z-index:2;width:22px;height:22px;border-radius:50%;border:none;
  background:rgba(0,0,0,.55);color:#fff;font-size:.66rem;cursor:pointer;display:flex;align-items:center;justify-content:center}
.ss-ic{background:linear-gradient(135deg,#2563eb,#16a34a)!important}
.ss .hl-lbl{white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;
  line-height:1.18;max-width:84px;text-align:center}
.results-meta{padding:10px 18px 4px;color:var(--text-light);font-size:.8rem;font-weight:600}
.rcard{position:relative;display:flex;gap:0;background:var(--surface);border:1px solid var(--border);border-radius:16px;
  overflow:hidden;min-height:176px;margin:0 14px 12px;cursor:pointer;transition:transform .1s,box-shadow .15s;
  box-shadow:0 1px 3px rgba(16,35,27,.07)}
.rcard:active{transform:scale(.99)}
.rc-media{width:122px;flex-shrink:0;background:var(--green-tint)}
.rc-media img{width:100%;height:100%;object-fit:cover;display:block}
.rc-main{flex:1;min-width:0;display:flex;flex-direction:column;justify-content:space-between;padding:12px 13px}
.rc-sector{display:block;font-size:.64rem;font-weight:800;text-transform:uppercase;letter-spacing:.04em;color:var(--sec-txt);margin-bottom:3px;padding-right:34px}
.rc-title{font-size:1rem;font-weight:800;color:var(--green-deep);line-height:1.22;margin:0;padding-right:34px;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.rc-loc{font-size:.82rem;color:var(--text-light);margin-top:5px}
.rc-meta{font-size:.8rem;color:var(--text-mid);margin-top:3px;
  display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden}
.rc-badges{display:flex;gap:5px;flex-wrap:wrap;margin-top:7px}
.rb{font-size:.65rem;font-weight:800;padding:3px 8px;border-radius:999px;white-space:nowrap}
.rb.n{background:#dcfce7;color:#15803d}.rb.s{background:#ffedd5;color:#c05a00}.rb.p{background:#dbeafe;color:#1e40af}
.rc-bottom{display:flex;justify-content:flex-end;align-items:flex-end;margin-top:8px;gap:8px}
.rc-sal{font-size:1.04rem;font-weight:800;color:var(--green-deep)}
.rc-cta{font-size:.84rem;font-weight:800;color:var(--sec-txt)}

/* Overlay dettaglio card (apertura da Ricerca) */
#card-detail{position:absolute;inset:0;z-index:1300;background:#000;display:none}
#card-detail.open{display:block;animation:cdIn .22s ease}
@keyframes cdIn{from{opacity:0;transform:scale(.98)}to{opacity:1;transform:scale(1)}}
#cd-body{height:100%;overflow-y:scroll;scroll-snap-type:y mandatory;-webkit-overflow-scrolling:touch}
#cd-body::-webkit-scrollbar{width:0}
#cd-body .slide{height:100%;scroll-snap-align:start}
#cd-close{position:absolute;top:16px;right:16px;z-index:90;width:44px;height:44px;border-radius:50%;
  background:rgba(0,0,0,.5);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);color:#fff;border:none;
  font-size:1.2rem;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:transform .12s}
#cd-close:active{transform:scale(.85)}

/* toast */
#toast{position:absolute;bottom:84px;left:50%;transform:translateX(-50%) translateY(10px);background:#10241c;
  color:#fff;padding:11px 20px;border-radius:999px;font-size:.86rem;font-weight:600;opacity:0;pointer-events:none;
  transition:opacity .25s,transform .25s;z-index:1500;white-space:nowrap}
#toast.on{opacity:.96;transform:translateX(-50%) translateY(0)}

/* ESPLORA — mappa */
#tab-esplora{overflow:hidden}
#map{position:absolute;inset:0;background:#e8eef0}
.pin{position:relative;background:linear-gradient(160deg,#16DB93,#0B6D49);color:#fff;border:2px solid #fff;border-radius:50%;
  display:flex;align-items:center;justify-content:center;font-weight:800;font-size:.78rem;
  box-shadow:0 3px 8px rgba(6,74,51,.45)}
.pin::after{content:"";position:absolute;left:50%;bottom:-7px;transform:translateX(-50%);width:0;height:0;
  border-left:6px solid transparent;border-right:6px solid transparent;border-top:9px solid #0B6B49;
  filter:drop-shadow(0 2px 1px rgba(6,74,51,.3))}
.pin.cluster{background:linear-gradient(160deg,#0D875B,#05311f);border:3px solid #fff;font-size:.92rem;
  box-shadow:0 0 0 4px rgba(47,211,127,.28),0 4px 13px rgba(6,74,51,.5)}
.pin.cluster::after{display:none}
#esplora-filters{position:absolute;top:12px;left:12px;right:12px;z-index:1100;display:flex;gap:8px;pointer-events:none}
#esplora-filters select{pointer-events:auto;flex:1;min-width:0;border:none;background:rgba(255,255,255,.97);border-radius:999px;
  padding:11px 14px;font-size:.82rem;font-weight:600;color:var(--text-mid);font-family:inherit;box-shadow:0 2px 10px rgba(0,0,0,.2)}
.esplora-hint{position:absolute;bottom:16px;left:50%;transform:translateX(-50%);z-index:1100;background:rgba(255,255,255,.95);
  border:1px solid var(--border);border-radius:999px;padding:8px 16px;font-size:.82rem;font-weight:600;color:var(--green-deep);
  box-shadow:0 2px 10px rgba(0,0,0,.14);pointer-events:none}
.cs-grab{width:42px;height:5px;border-radius:3px;background:var(--border-strong,#cfd8d3);margin:8px auto 2px}
/* sheet elenco comune */
#comune-sheet{position:absolute;inset:0;z-index:1200;display:none}
#comune-sheet.open{display:block}
.cs-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.4)}
.cs-panel{position:absolute;left:0;right:0;bottom:0;max-height:80%;display:flex;flex-direction:column;
  background:var(--bg);border-radius:20px 20px 0 0;animation:csUp .26s ease;overflow:hidden}
@keyframes csUp{from{transform:translateY(100%)}to{transform:translateY(0)}}
.cs-head{display:flex;align-items:center;justify-content:space-between;padding:16px 18px;background:var(--surface);border-bottom:1px solid var(--border)}
.cs-head b{font-family:'Lora',serif;font-size:1.25rem;color:var(--green-deep)}
.cs-head small{color:var(--text-light);font-weight:600}
.cs-close{width:34px;height:34px;border-radius:50%;border:none;background:var(--bg);font-size:1rem;cursor:pointer;flex-shrink:0}
.cs-list{overflow-y:auto;padding:12px 0 18px}

/* ===== bottone filtri (Esplora + Ricerca) ===== */
.map-filtri{position:absolute;top:12px;right:12px;z-index:1100;display:inline-flex;align-items:center;gap:6px;
  border:none;background:rgba(255,255,255,.97);border-radius:999px;padding:11px 16px;font-size:.86rem;font-weight:800;
  color:var(--green-deep);font-family:inherit;box-shadow:0 2px 10px rgba(0,0,0,.2);cursor:pointer}
.map-filtri:active{transform:scale(.96)}
.map-filtri.on{background:var(--green-mid);color:#fff}
.btn-filtri{display:inline-flex;align-items:center;gap:6px}
/* ===== barra superiore condivisa Cerca (ricerca testuale + toggle Lista/Mappa) ===== */
#cerca-top{position:absolute;top:0;left:0;right:0;z-index:20;display:none;
  background:var(--surface);border-bottom:1px solid var(--border);padding:14px 18px 12px}
#cerca-top.on{display:block}
#cerca-top .search-row{margin-top:0}
#cerca-switch,#conc-switch{display:flex;width:fit-content;gap:2px;margin:10px auto 0;
  background:var(--bg);border:1px solid var(--border);border-radius:999px;padding:3px}
.cs-opt{display:inline-flex;align-items:center;gap:6px;border:none;background:transparent;
  color:var(--green-deep);font-family:inherit;font-weight:800;font-size:.84rem;
  padding:8px 16px;border-radius:999px;cursor:pointer}
.cs-opt svg{width:15px;height:15px}
.cs-opt.active{background:var(--sec-txt);color:#fff}
.cs-opt:active{transform:scale(.97)}
/* le due viste di Cerca iniziano SOTTO la barra condivisa (--ctop misurato via JS) */
#tab-ricerca{top:var(--ctop,116px)}
#tab-esplora{top:var(--ctop,116px);bottom:calc(66px + env(safe-area-inset-bottom))}
/* ===== bottom-sheet filtri (stile Booking) — condiviso da Cerca e Concorsi ===== */
/* ⚠ ogni nuovo bottom-sheet va aggiunto a ENTRAMBE le righe: senza `display:none`
   finisce nel flusso normale e resta visibile su tutte le sezioni. */
#filter-sheet,#cfilter-sheet,#pfilter-sheet{position:absolute;inset:0;z-index:1500;display:none}
#filter-sheet.open,#cfilter-sheet.open,#pfilter-sheet.open{display:block}
/* ===== card Concorsi (coerente con .rcard) ===== */
/* Pillola nelle liste: si distingue dalle card annuncio (fondo tenue, bordo
   tratteggiato) perché non è un'offerta di lavoro ma un'informazione. */
.pcard{display:flex;gap:12px;align-items:flex-start;margin:0 14px 12px;padding:14px 15px;
  background:var(--green-tint);border:1px dashed rgba(18,116,83,.35);border-radius:16px}
.pc-ic{flex:none;font-size:1.3rem;line-height:1.1}
.pc-main{flex:1;min-width:0}
.pc-eyebrow{font-size:.62rem;font-weight:800;text-transform:uppercase;letter-spacing:.05em;
  color:var(--green-mid);margin-bottom:4px}
.pc-title{font-family:'Lora',serif;font-size:1rem;line-height:1.25;color:var(--text);margin:0 0 5px}
.pc-testo{font-size:.84rem;line-height:1.42;color:var(--text-mid);font-weight:560;margin:0}
.pc-check{display:flex;gap:7px;align-items:flex-start;margin-top:9px;padding:8px 9px;border-radius:10px;
  background:rgba(255,255,255,.75);font-size:.76rem;line-height:1.35;color:var(--text)}
.pc-check b{color:var(--green-mid)}
.pc-meta{font-size:.66rem;color:var(--text-light);margin-top:7px}
.pc-actions{display:flex;flex-wrap:wrap;align-items:center;gap:7px;margin-top:9px}
.pc-source,.pc-action{display:inline-flex;align-items:center;justify-content:center;min-height:32px;
  border-radius:9px;font-size:.72rem;font-weight:850;text-decoration:none;padding:6px 9px}
.pc-source{color:var(--green-deep);background:#fff;border:1px solid rgba(18,116,83,.2)}
.pc-action{color:#fff;background:var(--green-mid);box-shadow:0 2px 7px rgba(18,116,83,.18)}
.pc-source:active,.pc-action:active{opacity:.7}
.rc-media-conc{width:122px;flex-shrink:0;background:var(--sec-tint) center/cover no-repeat}
.rc-ente{font-size:.82rem;font-weight:700;color:var(--text-mid);margin-top:5px;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.rb.d7{background:#fee2e2;color:#b91c1c}
.rb.d30{background:#ffedd5;color:#c05a00}
.rb.ok{background:#dcfce7;color:#15803d}
.rb.posti{background:var(--green-tint);color:var(--green-deep)}
.rb.loc{background:#dcfce7;color:#15803d}
.rb.naz{background:#e0e7ff;color:#3730a3}
.cc-save{position:absolute;top:9px;right:9px;z-index:2;width:34px;height:34px;border:none;border-radius:50%;
  background:rgba(255,255,255,.92);color:var(--green-deep);display:flex;align-items:center;justify-content:center;
  cursor:pointer;box-shadow:0 1px 5px rgba(0,0,0,.14)}
.cc-save svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:2}
/* Condividi: stesso stile del segnalibro, IMPILATO SOTTO di esso (non affiancato).
   9px + 34px di altezza + 8px di aria = top 51px. */
.cc-share{position:absolute;top:51px;right:9px;z-index:2;width:34px;height:34px;border:none;border-radius:50%;
  background:rgba(255,255,255,.92);color:var(--sec-txt,var(--green-deep));display:flex;align-items:center;
  justify-content:center;cursor:pointer;box-shadow:0 1px 5px rgba(0,0,0,.14)}
.cc-share svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.cc-share:active{transform:scale(.88)}
.cc-save.on{background:var(--green-mid);color:#fff}
.cc-save.on svg{fill:currentColor}
.fs-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.45)}
.fs-panel{position:absolute;left:0;right:0;bottom:0;top:34px;display:flex;flex-direction:column;
  background:var(--surface);border-radius:18px 18px 0 0;animation:csUp .26s ease;overflow:hidden}
@keyframes fsRight{from{transform:translateX(100%)}to{transform:translateX(0)}}
.fs-head{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:14px 16px;border-bottom:1px solid var(--border)}
.fs-head .fs-title{font-weight:800;font-size:1.05rem;color:var(--text)}
.fs-x{width:34px;height:34px;border-radius:50%;border:none;background:var(--bg);font-size:1rem;cursor:pointer;flex-shrink:0}
.fs-reset{border:none;background:none;color:var(--green-mid);font-weight:700;font-size:.92rem;cursor:pointer;font-family:inherit;flex-shrink:0}
.fs-body{flex:1;overflow-y:auto;padding:0 0 12px;-webkit-overflow-scrolling:touch}
.fs-sec{padding:16px 18px;border-bottom:8px solid var(--bg)}
.fs-sec h3{font-size:1rem;font-weight:800;color:var(--text);margin:0 0 6px}
.fs-chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}
.fs-chip{border:1px solid var(--border);background:var(--surface);color:var(--text);
  border-radius:999px;padding:8px 14px;font-size:.85rem;font-weight:600;cursor:pointer;transition:.15s}
.fs-chip.on{background:var(--green-mid);border-color:var(--green-mid);color:#fff}
.fs-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:11px 0;cursor:pointer}
.fs-row+.fs-row{border-top:1px solid var(--border)}
.fs-rl{font-size:.95rem;color:var(--text)}
.fs-cnt{color:var(--text-light);font-style:normal;font-weight:600;font-size:.85rem}
.fs-cb input{appearance:none;-webkit-appearance:none;width:24px;height:24px;flex-shrink:0;
  border:2px solid var(--border);border-radius:7px;background:var(--surface);position:relative;
  pointer-events:none;transition:background .12s,border-color .12s;margin:0}
.fs-cb input:checked{background:var(--green-mid);border-color:var(--green-mid)}
.fs-cb input:checked::after{content:"";position:absolute;left:7px;top:3px;width:6px;height:11px;
  border:solid #fff;border-width:0 2.5px 2.5px 0;transform:rotate(45deg)}
.fs-zero{opacity:.4}
.fs-budget .fs-range-lbl{font-size:1.05rem;font-weight:800;color:var(--text);margin:2px 0 14px}
.fs-hist{display:flex;align-items:flex-end;gap:2px;height:64px;margin:0 2px 4px}
.fs-bar{flex:1;background:var(--border);border-radius:2px 2px 0 0;transition:background .1s}
.fs-bar.on{background:var(--green-mid)}
.fs-dual{position:relative;height:34px;margin:0 9px}
.fs-track{position:absolute;left:0;right:0;top:15px;height:4px;border-radius:2px;background:var(--border)}
.fs-track-fill{position:absolute;top:0;bottom:0;background:var(--green-mid);border-radius:2px}
.fs-dual input{position:absolute;left:0;width:100%;top:6px;height:22px;margin:0;background:none;pointer-events:none;-webkit-appearance:none;appearance:none}
.fs-dual input::-webkit-slider-thumb{-webkit-appearance:none;pointer-events:auto;width:22px;height:22px;border-radius:50%;
  background:#fff;border:2px solid var(--green-mid);box-shadow:0 1px 4px rgba(0,0,0,.35);cursor:pointer}
.fs-dual input::-moz-range-thumb{pointer-events:auto;width:22px;height:22px;border-radius:50%;background:#fff;border:2px solid var(--green-mid);cursor:pointer}
.fs-note{font-size:.78rem;color:var(--text-light);margin:12px 0 0}
.fs-save{display:block;width:calc(100% - 36px);margin:16px 18px 6px;border:1.5px solid var(--green-mid);background:var(--surface);
  color:var(--green-mid);border-radius:12px;padding:13px;font-weight:700;font-size:.92rem;cursor:pointer;font-family:inherit}
.fs-foot{display:flex;align-items:center;gap:12px;padding:12px 16px;border-top:1px solid var(--border);background:var(--surface)}
.fs-count{flex:1;font-weight:700;color:var(--text);font-size:.9rem}
.fs-apply{border:none;background:var(--green-mid);color:#fff;border-radius:12px;padding:14px 22px;font-weight:800;font-size:.98rem;cursor:pointer;font-family:inherit;flex-shrink:0}
.fs-apply:active{transform:scale(.97)}
.fs-save-foot{border:1.5px solid var(--green-mid);background:var(--surface);color:var(--green-deep);
  border-radius:12px;padding:13px 16px;font-weight:800;font-size:.9rem;cursor:pointer;font-family:inherit;
  white-space:nowrap;flex-shrink:0;margin-right:auto}
.fs-save-foot:active{transform:scale(.97)}

/* ===================== HOME RESTYLE (radar) ===================== */
.rl-home,#tab-sindacato{--font-d:"Bricolage Grotesque",system-ui,sans-serif;--font-b:"IBM Plex Sans",system-ui,sans-serif;--font-m:"IBM Plex Mono",ui-monospace,monospace;
  --pine:#0B6B49;--pine-deep:#064A33;--pine-tint:#E7F2EC;--signal:#2FD37F;--rosso:#CE2B37;
  --ink:#10231B;--ink2:#28392F;--muted:#5C6A62;--paper:#fff;--line:#E3E7DF;--cream:#F4F6F2;
  --rl-shadow:0 1px 2px rgba(16,35,27,.06),0 8px 24px rgba(16,35,27,.06)}
.rl-home{font-family:var(--font-b);background:var(--cream);color:var(--ink);min-height:100%;padding-bottom:18px;-webkit-font-smoothing:antialiased}
.rl-home *{box-sizing:border-box}
/* topbar */
.rl-home .lang{position:relative;display:flex;flex:none;flex-direction:column;align-items:flex-end}
.rl-home .lang-btn{display:flex;align-items:center;gap:7px;background:var(--paper);border:1px solid var(--line);
  padding:7px 9px;border-radius:999px;cursor:pointer;font-family:var(--font-b);font-size:13px;font-weight:600;color:var(--ink2);box-shadow:0 1px 2px rgba(16,35,27,.06)}
.rl-home .lang-btn .globe{width:15px;height:15px;display:block;stroke:currentColor;fill:none;stroke-width:2}
.rl-home .lang-btn .caret{width:11px;height:11px;stroke:currentColor;fill:none;stroke-width:2.5;transition:transform .2s ease}
.rl-home .lang-flag,.rl-home .lang-menu .fl{display:inline-block;width:22px;height:16px;border:1px solid rgba(16,35,27,.16);border-radius:2px;box-shadow:0 1px 1px rgba(16,35,27,.12)}
.rl-home .flag-it{background:linear-gradient(90deg,#009246 0 33.33%,#fff 33.33% 66.66%,#ce2b37 66.66%)}
.rl-home .flag-en{background:#012169 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 60 30'%3E%3Crect width='60' height='30' fill='%23012169'/%3E%3Cpath d='M0 0L60 30M60 0L0 30' stroke='white' stroke-width='6'/%3E%3Cpath d='M0 0L60 30M60 0L0 30' stroke='%23c8102e' stroke-width='3'/%3E%3Cpath d='M30 0V30M0 15H60' stroke='white' stroke-width='10'/%3E%3Cpath d='M30 0V30M0 15H60' stroke='%23c8102e' stroke-width='6'/%3E%3C/svg%3E") center/cover no-repeat}
.rl-home .flag-fr{background:linear-gradient(90deg,#002654 0 33.33%,#fff 33.33% 66.66%,#ed2939 66.66%)}
.rl-home .flag-es{background:linear-gradient(#aa151b 0 25%,#f1bf00 25% 75%,#aa151b 75%)}
.rl-home .flag-uk{background:linear-gradient(#0057b7 0 50%,#ffd700 50%)}
.rl-home .flag-ro{background:linear-gradient(90deg,#002b7f 0 33.33%,#fcd116 33.33% 66.66%,#ce1126 66.66%)}
.rl-home .flag-bn{background:radial-gradient(circle at 44% 50%,#f42a41 0 31%,transparent 32%),#006a4e}
.rl-home .flag-si{border-color:#f8b700;background:linear-gradient(90deg,#00534e 0 18%,#ef7c00 18% 36%,#8d153a 36%)}
.rl-home .lang.open .lang-btn .caret{transform:rotate(180deg)}
/* colonna singola: una bandiera per riga, stretta e allineata al bordo destro
   della hero, così non passa mai sopra al logo centrato (.radar, 210px) */
.rl-home .lang-menu{position:absolute;top:calc(100% + 8px);right:0;display:none;grid-template-columns:26px;gap:2px;background:var(--paper);border:1px solid var(--line);
  border-radius:12px;box-shadow:var(--rl-shadow);padding:4px;z-index:40}
.rl-home .lang.open .lang-menu{display:grid}
.rl-home .lang-menu button{display:flex;align-items:center;justify-content:center;width:26px;height:26px;background:none;border:0;padding:0;
  border-radius:9px;cursor:pointer;font-family:var(--font-b);color:var(--ink2)}
.rl-home .lang-menu button:active{background:#EEF1EB}
.rl-home .lang-menu button[aria-current="true"]{color:var(--pine);font-weight:600}
/* stories */
.stories-wrap{padding:10px 0 2px}
.stories-eyebrow{font-family:var(--font-m);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);padding:0 20px 11px}
.stories{display:flex;gap:14px;overflow-x:auto;padding:8px 20px 4px;scrollbar-width:none}
.stories::-webkit-scrollbar{display:none}
.story{flex:none;background:none;border:0;padding:0;cursor:pointer;width:66px;display:flex;flex-direction:column;align-items:center;gap:7px}
.ring{position:relative;width:64px;height:64px;border-radius:50%;padding:2.5px;display:flex;transition:transform .12s ease;
  background:linear-gradient(45deg,#feda75 5%,#fa7e1e 25%,#d62976 50%,#962fbf 75%,#4f5bd5 95%)}
.ring-c{background:linear-gradient(45deg,#89043D 5%,#D6437E 50%,#5E022A 95%)}
.b-conc{background:linear-gradient(145deg,#A81052,#5E022A)}
/* Centri per l'Impiego: tinta istituzionale distinta da annunci e concorsi */
.ring-cpi{background:linear-gradient(45deg,#1E5FA8 5%,#6FB0F5 50%,#3083DC 95%)}
.b-cpi{background:linear-gradient(145deg,#3083DC,#1E5FA8)}

/* ── Offerte Centri per l'Impiego (5ª sezione) ── */
/* Layout e card identici alle altre sezioni (.tab-head, .results-meta, .rcard):
   cambia solo la tinta, blu istituzionale invece del verde RadarLavoro. */
.cpi-note{margin:10px 14px 0;padding:10px 13px;background:var(--sec-tint);border:1px solid #CFE1F8;
  border-radius:12px;font-size:.76rem;line-height:1.45;color:#1E5FA8}
.rc-sector.cpi{color:var(--sec-txt)}
#cpi-list .rc-cta{color:var(--sec-txt)}
#cpi-list .rb.gg{background:#fef3c7;color:#92400e}
#cpi-list .rb.posti{background:var(--green-tint);color:var(--green-deep)}
#cpi-list{padding-top:2px}
/* il tasto Filtri di questa sezione segue la tinta blu quando è attivo */
#pfiltri-toggle.on{background:var(--sec-deep);color:#fff}

/* accesso al Sindacato dalla Home (sostituisce la voce in tabbar) */
.rl-home .sind-entry{display:flex;align-items:center;gap:12px;width:calc(100% - 28px);margin:14px auto 0;
  padding:13px 15px;background:var(--paper);border:1px solid var(--line);border-radius:14px;
  cursor:pointer;box-shadow:var(--rl-shadow);text-align:left;font-family:var(--font-b)}
.rl-home .sind-entry:active{transform:scale(.99)}
.rl-home .sind-entry img{width:40px;height:40px;border-radius:50%;object-fit:contain;background:#fff;
  padding:4px;border:1px solid var(--line);flex-shrink:0}
.rl-home .se-txt{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.rl-home .se-txt b{font-size:.95rem;color:var(--ink);font-weight:700}
.rl-home .se-txt small{font-size:.76rem;color:var(--muted);line-height:1.3}
.rl-home .se-arrow{width:18px;height:18px;flex-shrink:0;stroke:var(--muted);fill:none;stroke-width:2.2;
  stroke-linecap:round;stroke-linejoin:round}
/* ritorno alla Home dalla sezione Sindacato */
.sind-back{display:inline-flex;align-items:center;gap:5px;margin-bottom:12px;padding:7px 13px 7px 9px;
  border:1px solid var(--border);border-radius:999px;background:var(--surface);color:var(--text-mid);
  font-family:inherit;font-size:.8rem;font-weight:600;cursor:pointer}
.sind-back:active{transform:scale(.96)}
.sind-back svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
#cpi-how{position:absolute;inset:0;z-index:1700;display:none}
#cpi-how.open{display:flex;align-items:center;justify-content:center}
.cpih-link{display:block;margin-top:14px;padding:11px;border-radius:12px;background:#2C78CA;color:#fff;
  text-align:center;text-decoration:none;font-weight:700;font-size:.85rem}
/* recapiti dello sportello competente, sotto il primo passo */
.cpih-sede{margin-top:7px;padding:9px 11px;background:#EAF2FC;border-radius:10px;
  font-size:.8rem;line-height:1.5;color:#1E5FA8}
.cpih-sede a{color:#2C78CA;font-weight:600;text-decoration:none}
.b-conc-exp{background:linear-gradient(145deg,#f0ad4e,#c9741a)}
.sto-badge{position:absolute;top:-3px;right:-3px;min-width:20px;height:20px;padding:0 5px;border-radius:10px;
  background:var(--rosso);color:#fff;font-family:var(--font-m);font-weight:700;font-size:11px;line-height:20px;
  text-align:center;border:2px solid var(--cream);box-shadow:0 1px 3px rgba(0,0,0,.22)}
.sto-badge:empty{display:none}
.bubble{flex:1;border-radius:50%;border:2.5px solid var(--cream);display:flex;align-items:center;justify-content:center;color:#fff}
.bubble svg{width:25px;height:25px;stroke:currentColor;fill:none;stroke-width:2}
.b-new{background:linear-gradient(145deg,#2dd4a7,#0b8a5b)}.b-exp{background:linear-gradient(145deg,#fb7185,#e11d48)}
.b-pay{background:linear-gradient(145deg,#fcd34d,#f59e0b)}
.b-prot{background:linear-gradient(145deg,#c084fc,#7c3aed)}
.b-svc{background:linear-gradient(145deg,#2dd4a7,#0b6b49);font-size:26px}
.story-label{font-size:11px;line-height:1.2;color:var(--ink2);text-align:center;font-weight:500;max-width:66px;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;white-space:normal}
.story:active .ring{transform:scale(.95)}
/* stats */
.rl-home .home-stats{display:flex;gap:10px;margin:16px 14px 0}
.rl-home .stat{flex:1;background:var(--paper);border:1px solid var(--line);border-radius:12px;padding:14px 8px 12px;text-align:center;box-shadow:var(--rl-shadow)}
.rl-home .stat b{font-family:var(--font-m);font-weight:600;font-size:24px;display:block;color:var(--ink);letter-spacing:-.01em}
.rl-home .stat.hot b{color:var(--rosso)}
.rl-home .stat span{display:block;font-size:11px;color:var(--muted);margin-top:4px}
.rl-home .stat.conc b{color:var(--pine)}
/* install */
.rl-home .install{display:flex;align-items:center;justify-content:center;gap:9px;width:calc(100% - 28px);margin:14px auto 0;
  background:var(--pine);color:#fff;border:0;border-radius:14px;padding:15px;font-family:var(--font-b);font-weight:600;font-size:15px;
  cursor:pointer;box-shadow:0 10px 22px rgba(11,107,73,.22)}
.rl-home .install:active{background:var(--pine-deep);transform:scale(.99)}
.rl-home .install svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:2}
/* hero */
.rl-home .hero{margin:18px 14px 0;border-radius:24px;padding:24px 22px 22px;color:#EAF6EF;position:relative;overflow:hidden;
  background:radial-gradient(120% 90% at 50% 0%,#0d3b29 0%,#082417 55%,#04150e 100%);box-shadow:0 16px 40px rgba(6,74,51,.28)}
.rl-home .hero::after{content:"";position:absolute;inset:0;opacity:.5;pointer-events:none;
  background:linear-gradient(rgba(47,211,127,.05) 1px,transparent 1px) 0 0/100% 26px,linear-gradient(90deg,rgba(47,211,127,.05) 1px,transparent 1px) 0 0/26px 100%;
  -webkit-mask:radial-gradient(120% 80% at 50% 0%,#000,transparent 75%);mask:radial-gradient(120% 80% at 50% 0%,#000,transparent 75%)}
.hero-top{position:relative;z-index:2;display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
.live{display:inline-flex;align-items:center;gap:7px;font-family:var(--font-m);font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:#9ff0c4;
  background:rgba(47,211,127,.1);border:1px solid rgba(47,211,127,.25);padding:5px 10px;border-radius:999px}
.live i{width:7px;height:7px;border-radius:50%;background:var(--signal);animation:rlpulse 2s infinite}
.radar{position:relative;width:210px;margin:16px auto 4px;z-index:2}
.maplogo{width:100%;height:auto;display:block;border-radius:22px;background:#fff;
  box-shadow:0 0 0 1px rgba(47,211,127,.2),0 10px 28px rgba(47,211,127,.22)}
.wordmark{font-family:var(--font-d);font-weight:800;text-align:center;position:relative;z-index:2;line-height:.92;letter-spacing:.5px;margin:6px 0 0}
.wordmark .l1{display:block;font-size:34px;color:#fff}
.wordmark .l2{display:block;font-size:34px;color:var(--rosso)}
.wordmark .l3{display:block;font-family:var(--font-m);font-weight:600;font-size:11px;letter-spacing:.42em;color:#8fd9b0;margin-top:8px;padding-left:.42em}
.rl-home .lede{position:relative;z-index:2;text-align:center;color:#c7e6d6;font-size:14.5px;margin:14px auto 0;max-width:330px}
/* footer */
.rl-home .social,#tab-sindacato .social{display:flex;gap:12px;flex-wrap:wrap}
.rl-home .social a,#tab-sindacato .social a{width:44px;height:44px;border-radius:12px;background:var(--paper);border:1px solid var(--line);
  display:flex;align-items:center;justify-content:center;color:var(--ink2);box-shadow:var(--rl-shadow);text-decoration:none}
.rl-home .social a:active,#tab-sindacato .social a:active{color:var(--pine);border-color:var(--pine)}
.rl-home .social a svg,#tab-sindacato .social a svg{width:20px;height:20px;fill:currentColor}
/* social compatti nella topbar Home */
.rl-topbar .social-top{gap:8px;flex-wrap:nowrap}
.rl-topbar .social-top a{width:36px;height:36px;border-radius:10px}
.rl-topbar .social-top a svg{width:17px;height:17px}
/* Sindacato: social in alto centrati + bolle "storie" centrate */
#tab-sindacato .social-top{justify-content:center;margin:2px 0 8px}
#tab-sindacato .stories{justify-content:center}
.rl-foot{margin:26px 20px 6px;padding-top:18px;border-top:1px solid var(--line);font-size:11.5px;color:var(--muted);line-height:1.6;text-align:center}
@keyframes rlpulse{0%{box-shadow:0 0 0 0 rgba(47,211,127,.55)}70%{box-shadow:0 0 0 8px rgba(47,211,127,0)}100%{box-shadow:0 0 0 0 rgba(47,211,127,0)}}
@media (prefers-reduced-motion:reduce){.live i{animation:none}}

/* ===================== DESKTOP / SCHERMI LARGHI ===================== */
@media (min-width:900px){
  body{background:#dde6e0}
  #app{max-width:1080px;height:100dvh;box-shadow:0 0 0 1px rgba(16,35,27,.06),0 24px 70px rgba(16,35,27,.16)}
  /* barra di navigazione a sinistra (verticale) */
  #tabbar{left:0;right:auto;top:0;bottom:0;width:98px;height:100dvh;flex-direction:column;justify-content:flex-start;
    gap:4px;padding:24px 8px;border:none;border-right:1px solid var(--border);border-radius:0;
    background:rgba(255,255,255,.98);box-shadow:none}
  .tab{flex:0 0 auto;padding:12px 4px;border-radius:14px;font-size:.62rem}
  .tab .ic{width:48px;height:30px}
  /* area contenuti a destra della sidebar */
  .panel{inset:0 0 0 98px}
  #tab-esplora{inset:0 0 0 98px}
  /* barra Cerca e viste: a destra della sidebar, viste sotto la barra */
  #cerca-top{left:98px}
  #tab-ricerca{top:var(--ctop,116px)}
  #tab-esplora{top:var(--ctop,116px);bottom:0}
  /* Home e Sindacato: colonna centrata e leggibile */
  .rl-home{max-width:660px;margin:0 auto}
  #tab-sindacato .sind-wrap{max-width:660px;margin:0 auto}
  /* Ricerca / Preferiti: risultati a griglia */
  #r-list,#fav-list,#c-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:12px;padding:10px 18px 28px;align-content:start}
  #r-list .rcard,#fav-list .rcard,#c-list .rcard{margin:0}
  #tab-ricerca .tab-head,#tab-concorsi .tab-head,#tab-preferiti .tab-head,.results-meta,#saved-searches{max-width:820px;margin-left:auto;margin-right:auto}
  /* storie e feed risultati: colonna verticale centrata su sfondo scuro */
  #collection,#card-detail{background:#0a0f0d}
  #coll-feed,#cd-body{max-width:460px;margin:0 auto}
  #story-bars,.coll-head{max-width:460px;left:50%;right:auto;transform:translateX(-50%)}
  /* sheet comune: pannello centrato invece che a tutta larghezza */
  .cs-panel{max-width:520px;left:50%;right:auto;transform:translateX(-50%);border-radius:20px 20px 0 0}
  /* su desktop il pannello filtri entra da destra (drawer), non dal basso */
  .fs-panel{left:auto;right:0;top:0;bottom:0;width:440px;max-width:92%;transform:none;border-radius:0;animation:fsRight .28s ease}
}
