.n1 { background: var(--n1-bg); padding: var(--n1-pad); color: var(--n1-title-color); }
.n1-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; margin-bottom: clamp(28px, 4vw, 48px); }
.n1-head-center { flex-direction: column; align-items: center; text-align: center; }
.n1-head-right { flex-direction: row-reverse; text-align: right; }
.n1-kicker {
  display: inline-flex; align-items: center; gap: 10px; margin-bottom: 14px;
  font-family: var(--fx-font-accent); font-size: 12px; letter-spacing: .18em; text-transform: uppercase; color: var(--n1-accent);
}
.n1-kicker::before { content: ""; width: 26px; height: 2px; background: currentColor; }
.n1-title {
  font-family: var(--n1-title-font); font-size: clamp(30px, 5vw, var(--n1-title-size)); font-weight: var(--n1-title-weight);
  line-height: 1.02; letter-spacing: -.025em; color: var(--n1-title-color); max-width: 18ch;
}
.n1-all {
  display: inline-flex; align-items: center; gap: 8px; flex: none; padding-bottom: 6px;
  font-weight: 600; font-size: 15px; text-decoration: none; color: var(--n1-title-color);
  border-bottom: 2px solid var(--n1-accent); transition: gap .2s;
}
.n1-all:hover { gap: 14px; }
.n1-empty { color: var(--n1-text-color); padding: 40px 0; }

.n1-grid { display: grid; grid-template-columns: repeat(var(--n1-cols), minmax(0, 1fr)); gap: var(--n1-gap); }
.n1-item { min-width: 0; }
.n1-link { display: flex; flex-direction: column; height: 100%; text-decoration: none; color: inherit; }
.n1-media { aspect-ratio: var(--n1-ratio); border-radius: var(--n1-img-radius); overflow: hidden; background: var(--n1-card-bg); }
.n1-media img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s cubic-bezier(.2,.7,.2,1); }
.n1-zoom .n1-link:hover .n1-media img { transform: scale(1.045); }
.n1-placeholder { display: block; width: 100%; height: 100%; background: linear-gradient(135deg, var(--n1-card-bg), color-mix(in srgb, var(--n1-accent) 25%, var(--n1-card-bg))); }
.n1-body { padding-top: 18px; display: flex; flex-direction: column; gap: 10px; }
.n1-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; font-size: 12.5px; color: var(--n1-text-color); }
.n1-cat { font-family: var(--fx-font-accent); text-transform: uppercase; letter-spacing: .12em; font-size: 11px; color: var(--n1-accent); font-weight: 600; }
.n1-cat + time::before { content: "·"; margin-right: 10px; opacity: .6; }
.n1-item-title {
  font-family: var(--n1-item-font); font-size: var(--n1-item-size); line-height: 1.22; letter-spacing: -.01em;
  color: var(--n1-title-color); transition: color .2s;
}
.n1-link:hover .n1-item-title { color: var(--n1-accent); }
.n1-excerpt { font-family: var(--n1-text-font); font-size: var(--n1-text-size); line-height: var(--n1-lh); color: var(--n1-text-color); }

/* Article principal */
.n1-lead-wide .is-lead { grid-column: span 2; }
.n1-lead-wide .is-lead .n1-link { display: grid; grid-template-columns: 1.25fr 1fr; gap: 28px; align-items: end; }
.n1-lead-wide .is-lead .n1-media { aspect-ratio: 4 / 3.4; }
.n1-lead-tall .is-lead { grid-row: span 2; }
.n1-lead-tall .is-lead .n1-media { aspect-ratio: 4 / 4.6; }
.n1 .is-lead .n1-item-title { font-size: calc(var(--n1-item-size) * 1.55); line-height: 1.1; }
.n1 .is-lead .n1-body { padding-top: 0; }
.n1-lead-tall .is-lead .n1-body { padding-top: 22px; }

/* Styles de cartes */
.n1-style-card .n1-link { background: var(--n1-card-bg); border-radius: var(--n1-card-radius); padding: 12px 12px 22px; box-shadow: var(--n1-shadow); }
.n1-style-card .n1-body { padding-inline: 8px; }
.n1-style-outline .n1-link { border: 1px solid var(--n1-border); border-radius: var(--n1-card-radius); padding: 12px 12px 22px; box-shadow: var(--n1-shadow); }
.n1-style-outline .n1-body { padding-inline: 8px; }

@media (max-width: 980px) {
  .n1-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .n1-lead-wide .is-lead .n1-link { grid-template-columns: 1fr; }
  .n1-lead-tall .is-lead { grid-row: auto; grid-column: span 2; }
  .n1 .is-lead .n1-body { padding-top: 18px; }
}
@media (max-width: 620px) {
  .n1-head { flex-direction: column; align-items: flex-start; }
  .n1-head-center { align-items: center; }
  .n1-grid { grid-template-columns: 1fr; gap: 36px; }
  .n1 .is-lead { grid-column: auto; }
  .n1 .is-lead .n1-item-title { font-size: calc(var(--n1-item-size) * 1.25); }
}