/* Pagine geo (regione, città): layout illustrato — prova 2026-10-13.
   Caricato DOPO lo <style> inline delle pagine: qui solo override e aggiunte.
   I testi (H1, sezioni, card) restano quelli generati dal server per la SEO. */

:root {
  --geo-ink: #1B2A1E;
  --geo-muted: #5B6458;
  --geo-green: #007A38;
  --geo-green-soft: #EAF6EF;
  --geo-green-line: #CBE9D7;
  --geo-orange: #C2410C;
  --geo-orange-soft: #FFF3EA;
  --geo-orange-line: #F6D3BC;
  --geo-line: #E7E5DF;
  --geo-blue: #275D8C;
  --geo-blue-soft: #EEF4FA;
  --geo-blue-line: #CFDFEE;
}

body { background: #fff; }
.seo-page { max-width: 1040px; padding-top: 0; }

/* ── Testata illustrata ── */
.geo-hero {
  position: relative; overflow: hidden; margin: 0 -1rem 1.6rem; padding: 1.1rem 1rem 1.4rem;
  background: #fff; border-bottom: 1px solid var(--geo-line);
}
.geo-hero > :not(.geo-art) { position: relative; z-index: 1; }
/* Illustrazione della regione (server/geo-art.js): su mobile in cima alla testata (ritagliata
   sulla metà destra della scena), su desktop a destra dietro al testo */
.geo-art { position: relative; display: block; width: 230%; max-width: none; height: auto; margin: -1.1rem 0 .6rem -130%; z-index: 0; pointer-events: none; }
@media (min-width: 760px) {
  .geo-hero { padding: 1.3rem 1rem 2.6rem; min-height: 300px; }
  .geo-art { position: absolute; right: 0; bottom: 0; margin: 0; width: min(1150px, 112%); }
  .geo-hero .region-intro, .geo-hero h1, .geo-hero .quick-links, .geo-hero .province-section { max-width: 560px; }
}
.geo-hero .province-section { margin: 1.1rem 0 0; }
.geo-hero .province-section h2 { font-size: .8rem; text-transform: uppercase; letter-spacing: .08em; color: var(--geo-muted); margin: 0 0 .5rem; }
.geo-hero .province-grid { grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); }
.geo-hero .province-card { background: rgba(255,255,255,.92); backdrop-filter: blur(2px); padding: .55rem .7rem; font-size: .88rem; }
.prov-editorial { position: relative; border: 0; border-radius: 14px; padding: 1.1rem 1.2rem 1.1rem 3.4rem; background: #FAFAF7; color: #3A4437; }
.prov-editorial::before { content: '“'; position: absolute; left: 1rem; top: .2rem; font: 800 3rem/1 Georgia, serif; color: var(--geo-orange); opacity: .5; }
.other-provinces h2 { font-size: 1.1rem; font-weight: 800; color: var(--geo-ink); }
.geo-hero .breadcrumb ol { margin-bottom: 1rem; font-size: .8rem; flex-wrap: wrap; }
.geo-hero .breadcrumb a { color: var(--geo-muted); text-decoration: none; }
.geo-hero .breadcrumb a:hover { color: var(--geo-green); text-decoration: underline; }
.geo-hero h1 { font-size: clamp(1.7rem, 4.6vw, 2.6rem); font-weight: 800; line-height: 1.1; letter-spacing: -.02em; color: var(--geo-ink); margin: 0 0 .9rem; max-width: 15em; }
.geo-hero h1 span { color: var(--geo-orange); }
.geo-hero .region-intro { max-width: 34em; font-size: 1rem; color: var(--geo-muted); margin: 0; }
.geo-hero .region-intro strong { color: var(--geo-ink); }

/* Pillole rapide (Questo weekend / mesi): l'emoji del server sparisce, al suo posto un'icona */
.quick-links { gap: .5rem; margin: 0 0 1rem; }
.quick-link-pill {
  display: inline-flex; align-items: center; gap: .45rem; padding: .5rem .95rem .5rem .8rem;
  border-radius: 999px; border: 1.5px solid var(--geo-line); background: #fff;
  font-size: .86rem; font-weight: 700; color: var(--geo-ink); box-shadow: 0 1px 4px rgba(0,0,0,.05);
  font-size-adjust: none;
}
.quick-link-pill::before {
  content: ''; width: 16px; height: 16px; flex: 0 0 auto;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23007A38' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='18' height='16' rx='3'/%3E%3Cpath d='M3 10h18M8 3v4M16 3v4'/%3E%3C/svg%3E") center/contain no-repeat;
}
.quick-link-pill:hover { border-color: var(--geo-green); background: var(--geo-green-soft); }
.quick-link-pill.active { background: var(--geo-green); border-color: var(--geo-green); color: #fff; }
.quick-link-pill.active::before { filter: brightness(0) invert(1); }

/* ── Province: card con segnaposto ── */
.province-section { margin: 0 0 2rem; }
.province-section h2, .events-section-h2 { font-size: 1.25rem; font-weight: 800; color: var(--geo-ink); letter-spacing: -.01em; }
.province-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: .6rem; }
.province-card {
  display: flex; justify-content: space-between; border-radius: 12px; padding: .7rem .8rem .7rem .75rem;
  border: 1px solid var(--geo-line); font-weight: 700; color: var(--geo-ink); box-shadow: 0 1px 4px rgba(0,0,0,.04);
}
.province-card::before {
  content: ''; width: 18px; height: 18px; flex: 0 0 auto; margin-right: .1rem;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 22s7-6.2 7-12a7 7 0 0 0-14 0c0 5.8 7 12 7 12z' fill='%23C2410C'/%3E%3Ccircle cx='12' cy='10' r='2.6' fill='%23fff'/%3E%3C/svg%3E") center/contain no-repeat;
}
.province-card:hover { background: var(--geo-green-soft); color: var(--geo-green); border-color: var(--geo-green-line); }
.province-cnt { margin-left: auto; background: var(--geo-green-soft); color: var(--geo-green); }
.province-card:hover .province-cnt { background: #fff; color: var(--geo-green); }

/* ── Box editoriale ── */
.region-editorial, .city-editorial {
  position: relative; border: 0; border-radius: 14px; padding: 1.1rem 1.2rem 1.1rem 3.4rem;
  background: #FAFAF7; color: #3A4437;
}
.region-editorial::before, .city-editorial::before {
  content: '“'; position: absolute; left: 1rem; top: .2rem; font: 800 3rem/1 Georgia, serif; color: var(--geo-orange); opacity: .5;
}
.region-editorial:empty { display: none; }

/* ── Sezioni eventi: testata a "nastro" con icona illustrata ── */
.section-we, .section-others { border-radius: 18px; padding: 1.1rem 1.1rem .4rem; margin: 0 0 2rem; }
.section-we { background: linear-gradient(180deg, var(--geo-green-soft), #fff 70%); border: 1px solid var(--geo-green-line); }
.section-others { background: linear-gradient(180deg, var(--geo-orange-soft), #fff 70%); border: 1px solid var(--geo-orange-line); }
.events-section-h2 { display: flex; align-items: center; gap: .7rem; border: 0 !important; padding: 0; margin: 0 0 1rem; }
.events-section-h2::before { content: ''; width: 46px; height: 46px; flex: 0 0 auto; border-radius: 12px; background-color: #fff; box-shadow: 0 2px 8px rgba(0,0,0,.08); background-position: center; background-repeat: no-repeat; background-size: 34px 34px; }
/* weekend: calendario col sole */
.section-we .events-section-h2 { color: var(--geo-green) !important; }
.section-we .events-section-h2::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40'%3E%3Crect x='4' y='9' width='26' height='25' rx='4' fill='%23fff' stroke='%23007A38' stroke-width='2.4'/%3E%3Cpath d='M4 16h26' stroke='%23007A38' stroke-width='2.4'/%3E%3Cpath d='M11 6v6M23 6v6' stroke='%23007A38' stroke-width='2.4' stroke-linecap='round'/%3E%3Crect x='10' y='21' width='5' height='5' rx='1' fill='%23007A38'/%3E%3Crect x='19' y='21' width='5' height='5' rx='1' fill='%23007A38'/%3E%3Ccircle cx='31' cy='29' r='6.5' fill='%23F8C952'/%3E%3Cg stroke='%23F2A93B' stroke-width='1.8' stroke-linecap='round'%3E%3Cpath d='M31 19.5v-2M31 40v-2M21.5 29h-2M42.5 29h-2M24.3 22.3l-1.4-1.4M39 37l-1.3-1.3M37.7 22.3l1.4-1.4'/%3E%3C/g%3E%3C/svg%3E");
}
/* prossimamente: calendario con freccia avanti */
.section-others .events-section-h2 { color: var(--geo-orange) !important; }
.section-others .events-section-h2::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40'%3E%3Crect x='4' y='9' width='26' height='25' rx='4' fill='%23fff' stroke='%23C2410C' stroke-width='2.4'/%3E%3Cpath d='M4 16h26' stroke='%23C2410C' stroke-width='2.4'/%3E%3Cpath d='M11 6v6M23 6v6' stroke='%23C2410C' stroke-width='2.4' stroke-linecap='round'/%3E%3Ccircle cx='30' cy='29' r='8' fill='%23C2410C'/%3E%3Cpath d='M26.5 29h7M30.5 25.8l3.2 3.2-3.2 3.2' stroke='%23fff' stroke-width='2.2' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

/* ── Agenda IAT: altri appuntamenti del territorio (AGENDA_DINTORNI_PLAN.md) ──
   Solo testo, più sobria delle sezioni sagre: deve restare chiaro che non sono sagre. */
.section-agenda { border-radius: 18px; padding: 1.1rem 1.1rem .6rem; margin: 0 0 2rem; background: linear-gradient(180deg, var(--geo-blue-soft), #fff 70%); border: 1px solid var(--geo-blue-line); }
.section-agenda .events-section-h2 { color: var(--geo-blue) !important; margin-bottom: .5rem; }
.section-agenda .events-section-h2::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40'%3E%3Crect x='7' y='5' width='22' height='29' rx='3' fill='%23fff' stroke='%23275D8C' stroke-width='2.4'/%3E%3Cpath d='M12 13h12M12 19h12M12 25h7' stroke='%23275D8C' stroke-width='2.2' stroke-linecap='round'/%3E%3Ccircle cx='30' cy='29' r='7' fill='%23F8C952'/%3E%3Cpath d='M30 25.5v3.8l2.4 1.6' stroke='%23275D8C' stroke-width='2' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
}
.agenda-intro { margin: 0 0 1rem; font-size: .88rem; color: var(--geo-muted); max-width: 46em; }
.agenda-list { list-style: none; padding: 0; margin: 0 0 1rem; display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: .75rem; }
.agenda-item { background: #fff; border: 1px solid var(--geo-line); border-radius: 12px; padding: .8rem .9rem; display: flex; flex-direction: column; gap: .25rem; min-width: 0; }
.agenda-when { font-size: .75rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--geo-blue); }
.agenda-title { font-size: .98rem; font-weight: 700; line-height: 1.25; margin: 0; color: var(--geo-ink); overflow-wrap: anywhere; }
.agenda-title a { color: inherit; text-decoration: none; }
.agenda-title a:hover { text-decoration: underline; }
.agenda-where { font-size: .82rem; color: var(--geo-muted); }
.agenda-excerpt { font-size: .85rem; line-height: 1.45; color: var(--geo-ink); margin: .2rem 0 .1rem; overflow-wrap: anywhere; }
.agenda-src { margin-top: auto; font-size: .78rem; color: var(--geo-blue); text-decoration: none; }
.agenda-src:hover { text-decoration: underline; }
.agenda-more { font-size: .85rem; color: var(--geo-muted); margin: 0 0 .5rem; }
.agenda-more a { color: var(--geo-blue); }

/* ── Card evento ── */
.events-grid { grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: .9rem; }
.event-card { border-radius: 14px; border-color: var(--geo-line); box-shadow: 0 2px 10px rgba(0,0,0,.05); }
.event-card:hover { box-shadow: 0 8px 22px rgba(0,0,0,.1); }
.event-card-placeholder { background: linear-gradient(135deg, #F3F7EF, #FBF3EA); }
.event-card-title { color: var(--geo-ink); font-weight: 700; }
.event-card-meta { display: flex; gap: .3rem; align-items: flex-start; }
.event-card-meta::before {
  content: ''; width: 12px; height: 12px; flex: 0 0 auto; margin-top: .15rem;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 22s7-6.2 7-12a7 7 0 0 0-14 0c0 5.8 7 12 7 12z' fill='%23C2410C'/%3E%3C/svg%3E") center/contain no-repeat;
}
.reg-event-empty { list-style: none; }

/* ── Bottoni ── */
.cta-section { gap: .7rem; margin: 0 0 2rem; }
.cta-btn { display: inline-flex; align-items: center; gap: .5rem; border-radius: 999px; padding: .7rem 1.3rem; font-size: .92rem; }
.cta-btn-primary { background: var(--geo-green); box-shadow: 0 4px 14px rgba(0,122,56,.25); }
.cta-btn-primary::before {
  content: ''; width: 18px; height: 18px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2.2' stroke-linejoin='round'%3E%3Cpath d='M1 6v16l7-4 8 4 7-4V2l-7 4-8-4-7 4z'/%3E%3Cpath d='M8 2v16M16 6v16'/%3E%3C/svg%3E") center/contain no-repeat;
}
.cta-btn-secondary { border: 1.5px solid var(--geo-line); color: var(--geo-ink); background: #fff; }
.cta-btn-secondary:hover { border-color: var(--geo-green); color: var(--geo-green); opacity: 1; }

/* ── Testo SEO in fondo ── */
.seo-text { border-top: 1px solid var(--geo-line); padding-top: .5rem; color: var(--geo-muted); }
.seo-text h2 { color: var(--geo-ink); }

/* ── Pagine mese e weekend nazionale (sagra-mese.html, sagra-weekend-hub.html) ── */
.geo-hero .hub-intro { max-width: 34em; font-size: 1rem; color: var(--geo-muted); margin: 0 0 .8rem; }
@media (min-width: 760px) { .geo-hero .hub-intro, .geo-hero .month-nav, .geo-hero .region-nav { max-width: 560px; } }
.month-nav, .region-nav { gap: .45rem; margin: .4rem 0 .8rem; }
.month-pill, .region-pill {
  display: inline-flex; align-items: center; gap: .4rem; padding: .45rem .9rem .45rem .75rem; border-radius: 999px;
  border: 1.5px solid var(--geo-line); background: rgba(255,255,255,.94); font-weight: 700; font-size: .84rem; color: var(--geo-ink);
}
.month-pill::before {
  content: ''; width: 14px; height: 14px; flex: 0 0 auto;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23007A38' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='18' height='16' rx='3'/%3E%3Cpath d='M3 10h18M8 3v4M16 3v4'/%3E%3C/svg%3E") center/contain no-repeat;
}
.region-pill::before {
  content: ''; width: 13px; height: 13px; flex: 0 0 auto;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 22s7-6.2 7-12a7 7 0 0 0-14 0c0 5.8 7 12 7 12z' fill='%23C2410C'/%3E%3Ccircle cx='12' cy='10' r='2.6' fill='%23fff'/%3E%3C/svg%3E") center/contain no-repeat;
}
.month-pill:hover:not(.active), .region-pill:hover:not(.active) { border-color: var(--geo-green); background: var(--geo-green-soft); }
.month-pill.active { background: var(--geo-green); border-color: var(--geo-green); color: #fff; }
.month-pill.active::before { filter: brightness(0) invert(1); }
.region-pill.active { background: var(--geo-orange-soft); border-color: var(--geo-orange-line); color: var(--geo-orange); }
.section-title.events-section-h2 { margin-top: 0; }
/* Elenco eventi testuale → card a griglia con segnaposto */
.events-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: .7rem; }
.reg-event-item { border-radius: 12px; border-color: var(--geo-line); background: #fff; box-shadow: 0 2px 8px rgba(0,0,0,.04); padding: .8rem .9rem .8rem 2.3rem; position: relative; }
.reg-event-item::before {
  content: ''; position: absolute; left: .8rem; top: .95rem; width: 16px; height: 16px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 22s7-6.2 7-12a7 7 0 0 0-14 0c0 5.8 7 12 7 12z' fill='%23C2410C'/%3E%3Ccircle cx='12' cy='10' r='2.6' fill='%23fff'/%3E%3C/svg%3E") center/contain no-repeat;
}
.reg-event-item:hover { box-shadow: 0 6px 18px rgba(0,0,0,.09); }
.reg-event-item a { color: var(--geo-ink); font-weight: 700; font-size: .95rem; }
.reg-event-item a:hover { color: var(--geo-green); }
/* Regioni del weekend nazionale */
.geo-hero .region-grid { margin: 0; grid-template-columns: repeat(auto-fill, minmax(165px, 1fr)); gap: .5rem; }
.region-card { border-radius: 12px; border-color: var(--geo-line); background: rgba(255,255,255,.94); padding: .55rem .75rem; }
.region-card:hover { border-color: var(--geo-green-line); background: var(--geo-green-soft); }
.region-card-name { font-size: .88rem; font-weight: 700; color: var(--geo-ink); }
.region-card-cnt { background: var(--geo-green); }

/* Mobile (prova 2026-10-13): scena più piccola, subito sotto il titolo come su desktop.
   La testata diventa una colonna flex e gli elementi vengono riordinati senza toccare l'HTML. */
@media (max-width: 759px) {
  .geo-hero { display: flex; flex-direction: column; }
  .geo-hero > * { order: 3; }
  .geo-hero > .breadcrumb, .geo-hero > h1 { order: 1; }
  .geo-hero > .geo-art { order: 2; width: 150%; margin: -.3rem 0 .5rem -50%; }
}

/* Telefono (2026-10-17): in testata resta solo «Salva questa zona», niente pillole dei mesi;
   province e città a pillola piccola col numero di eventi, così si scorre meno */
@media (max-width: 767px) {
  .geo-hero .quick-links { display: none; }
  .province-grid, .geo-hero .province-grid { display: flex; flex-wrap: wrap; gap: .4rem; }
  .province-card, .geo-hero .province-card { display: inline-flex; align-items: center; gap: .35rem; padding: .3rem .4rem .3rem .65rem; border-radius: 999px; font-size: .82rem; }
  .province-card::before { display: none; }
  .province-cnt { margin-left: .1rem; padding: 0 .45rem; border-radius: 99px; font-size: .72rem; line-height: 1.5; }
}
.province-card-empty { opacity: .55; }

/* 2026-10-18: nelle pagine regione, provincia e città niente pillole Weekend/mesi anche da computer:
   c'è già la sezione «Questo weekend» sotto la testata. Restano nell'HTML come link interni alle pagine mese */
.quick-links-zona { display: none !important; }