:root {
  color-scheme: only light;
  --bg:#ffffff; --bg-2:#f6f8fc; --surface:#ffffff; --border:#e4e8f0;
  --text:#0d1320; --muted:#616c80; --accent:#2f5cff; --accent-2:#1e44d6; --green:#15924f;
  --radius:0.8rem;
  --font-display:'Bricolage Grotesque', ui-sans-serif, system-ui, sans-serif;
  --font-body:'Hanken Grotesk', ui-sans-serif, system-ui, -apple-system, sans-serif;
}
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; font-family:var(--font-body); background:var(--bg); color:var(--text); -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility; }
a { color:inherit; }
.container { max-width:78rem; margin-inline:auto; padding-inline:1.1rem; }

.nav { display:flex; align-items:center; justify-content:space-between; padding-block:0.75rem; }
.brand { font-family:var(--font-display); font-weight:800; letter-spacing:-0.03em; font-size:1.15rem; text-decoration:none; }
.brand b { color:var(--accent); }
.nav-tag { color:var(--muted); font-size:0.78rem; font-variant-numeric:tabular-nums; }

.hero { padding-block:clamp(0.9rem,2.6vw,1.9rem) clamp(0.6rem,2vw,1rem); }
.eyebrow { display:block; letter-spacing:0.18em; font-size:0.66rem; font-weight:700; color:var(--accent); text-transform:uppercase; margin-bottom:0.4rem; }
.hero h1 { font-family:var(--font-display); font-size:clamp(1.5rem,4.4vw,2.6rem); line-height:1.04; letter-spacing:-0.025em; font-weight:800; margin:0 0 0.5rem; }
.hero p { color:var(--muted); font-size:0.95rem; max-width:46rem; margin:0; }

.controls { margin-top:0.95rem; display:flex; flex-direction:column; gap:0.55rem; }
.search input { width:100%; max-width:42rem; padding:0.7rem 0.95rem; border-radius:var(--radius); border:1px solid var(--border); background:var(--surface); color:var(--text); font:500 0.95rem var(--font-body); box-shadow:0 1px 2px rgba(13,19,32,.04); }
.search input::placeholder { color:var(--muted); }
.search input:focus { outline:2px solid var(--accent); outline-offset:1px; border-color:var(--accent); }
.filters { display:flex; flex-wrap:wrap; align-items:center; gap:0.5rem; }
.selects { display:flex; gap:0.5rem; flex:1 1 18rem; min-width:0; }
.sel { position:relative; flex:1 1 0; min-width:0; }
.sel select { width:100%; appearance:none; -webkit-appearance:none; padding:0.62rem 1.9rem 0.62rem 0.8rem; border:1px solid var(--border); border-radius:var(--radius); background:var(--surface); color:var(--text); font:600 0.85rem var(--font-body); cursor:pointer; text-overflow:ellipsis; }
.sel::after { content:"▾"; position:absolute; right:0.7rem; top:50%; transform:translateY(-50%); color:var(--muted); pointer-events:none; font-size:0.72rem; }
.sel select:focus { outline:2px solid var(--accent); outline-offset:1px; border-color:var(--accent); }
.density { display:inline-flex; border:1px solid var(--border); border-radius:999px; overflow:hidden; flex-shrink:0; }
.dchip { padding:0.38rem 0.8rem; border:0; background:var(--surface); color:var(--muted); font:600 0.74rem var(--font-body); cursor:pointer; }
.dchip[aria-pressed="true"] { background:var(--accent); color:#fff; }

.count { color:var(--muted); font-size:0.8rem; margin:0.9rem 0 0.2rem; font-variant-numeric:tabular-nums; }

/* month divider (the "intercalaire") */
.month { margin-top:0.4rem; }
.mhead { position:sticky; top:0; z-index:5; display:flex; align-items:center; gap:0.8rem; padding:0.7rem 0 0.55rem; margin-bottom:0.55rem; background:linear-gradient(var(--bg) 70%, transparent); }
.mhead h2 { font-family:var(--font-display); font-size:1.05rem; font-weight:800; letter-spacing:-0.015em; margin:0; white-space:nowrap; }
.mhead::after { content:""; flex:1; height:1px; background:var(--border); }
.mcount { font-size:0.74rem; color:var(--muted); white-space:nowrap; font-variant-numeric:tabular-nums; }

/* grid of cards */
.grid { display:grid; grid-template-columns:1fr; gap:0.75rem; padding-bottom:1.6rem; }
@media (min-width:600px){ .grid { grid-template-columns:repeat(2,1fr); } }
@media (min-width:920px){ .grid { grid-template-columns:repeat(3,1fr); } }
@media (min-width:1240px){ .grid { grid-template-columns:repeat(4,1fr); } }

/* ===== COMFORTABLE card: industry → name → date → place ===== */
.card { display:flex; flex-direction:column; padding:0.85rem 0.95rem; border:1px solid var(--border); border-left:3px solid var(--vc,var(--accent)); border-radius:var(--radius); background:var(--surface); text-decoration:none; box-shadow:0 1px 2px rgba(13,19,32,.05); transition:transform .15s, box-shadow .15s, border-color .15s; }
.card:hover { transform:translateY(-2px); border-color:var(--vc,var(--accent)); box-shadow:0 10px 26px color-mix(in srgb, var(--vc,var(--accent)) 16%, transparent); }
.card.past { opacity:.5; }
.crow { display:flex; align-items:center; justify-content:space-between; gap:0.5rem; }
.vert { font:700 0.62rem/1 var(--font-body); letter-spacing:0.07em; text-transform:uppercase; color:var(--vc,var(--accent)); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.when { font:600 0.68rem/1 var(--font-body); color:var(--muted); white-space:nowrap; flex-shrink:0; }
.when.w-live { color:var(--green); }
.cdays { display:none; }
.name { margin:0.4rem 0 0; font:700 1.08rem/1.16 var(--font-display); letter-spacing:-0.012em; color:var(--text); overflow-wrap:anywhere; }
.local { display:block; font:400 0.8rem/1.2 var(--font-body); color:var(--muted); margin-top:0.12rem; }
.drange { display:block; font:600 0.86rem/1.3 var(--font-body); color:var(--text); margin-top:0.5rem; font-variant-numeric:tabular-nums; }
.drange::before { content:"🗓"; margin-right:0.35rem; font-size:0.82rem; filter:saturate(0); opacity:.7; }
.where { display:block; font:500 0.83rem/1.3 var(--font-body); color:var(--muted); margin-top:0.18rem; }

/* ===== COMPACT density: dense one-line-per-event list (spreadsheet-like) ===== */
html[data-density="compact"] .hero { padding-block:0.5rem 0.4rem; }
html[data-density="compact"] .hero p { display:none; }
html[data-density="compact"] .hero h1 { font-size:clamp(1.3rem,3.8vw,1.9rem); margin-bottom:0.35rem; }
html[data-density="compact"] .controls { margin-top:0.6rem; gap:0.45rem; }
html[data-density="compact"] .mhead { font-size:0.9rem; padding:0.5rem 0 0.4rem; margin-bottom:0.3rem; }
html[data-density="compact"] .mhead h2 { font-size:0.92rem; }
html[data-density="compact"] .grid { display:block; gap:0; border:1px solid var(--border); border-radius:var(--radius); overflow:hidden; padding-bottom:0; }
html[data-density="compact"] .card {
  display:grid; grid-template-columns:3.1rem minmax(0,1fr) minmax(0,auto) auto;
  align-items:center; column-gap:0.8rem;
  padding:0.42rem 0.75rem; border:0; border-left:3px solid var(--vc,var(--accent));
  border-bottom:1px solid var(--border); border-radius:0; box-shadow:none;
}
html[data-density="compact"] .grid .card:last-child { border-bottom:0; }
html[data-density="compact"] .card:hover { transform:none; box-shadow:none; background:color-mix(in srgb, var(--vc,var(--accent)) 6%, white); }
html[data-density="compact"] .crow { display:contents; }
html[data-density="compact"] .cdays { display:block; grid-column:1; font:700 0.9rem/1 var(--font-display); color:var(--vc,var(--accent)); text-align:right; font-variant-numeric:tabular-nums; white-space:nowrap; }
html[data-density="compact"] .name { grid-column:2; margin:0; font-size:0.9rem; line-height:1.25; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
html[data-density="compact"] .where { grid-column:3; margin:0; font-size:0.78rem; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:13rem; }
html[data-density="compact"] .when { grid-column:4; justify-self:end; font-size:0.7rem; white-space:nowrap; }
html[data-density="compact"] .where::before { content:none; }
html[data-density="compact"] .vert,
html[data-density="compact"] .local,
html[data-density="compact"] .drange { display:none; }
@media (max-width:560px){
  html[data-density="compact"] .card { grid-template-columns:2.7rem minmax(0,1fr) minmax(0,auto); column-gap:0.5rem; }
  html[data-density="compact"] .when { display:none; }
  html[data-density="compact"] .where { grid-column:3; max-width:8.5rem; }
}

/* detail page */
.detail { padding-block:1.6rem 3rem; max-width:48rem; }
.detail h1 { font-family:var(--font-display); font-size:clamp(1.7rem,5vw,2.7rem); letter-spacing:-0.03em; font-weight:800; margin:0.4rem 0; }
.detail .row { display:flex; flex-wrap:wrap; gap:1.2rem; margin:1.1rem 0; color:var(--muted); }
.detail .row b { color:var(--text); display:block; font-size:1.02rem; }
.btn { display:inline-block; margin-top:1.2rem; padding:0.8rem 1.25rem; border-radius:var(--radius); background:var(--accent); color:#fff; font-weight:700; text-decoration:none; }
.back { color:var(--muted); text-decoration:none; font-size:0.82rem; }
.empty { color:var(--muted); padding:2.5rem 0; text-align:center; }
footer { border-top:1px solid var(--border); color:var(--muted); font-size:0.78rem; padding-block:1.3rem; margin-top:1rem; }
