/* =============================================================================
   News page (views/noticias.njk): owned by the news page builder.
   Unlayered, so it wins over site.css: every rule is scoped under .page-noticias
   and uses the site.css tokens only (alpha variants are color-mix() of tokens).
   ============================================================================= */

/* --- shared pieces --------------------------------------------------------- */
.page-noticias .nw-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 14px;
}
.page-noticias .nw-meta__date {
  color: var(--fg-3);
  font-family: var(--font-mono);
  font-size: var(--fs-label-sm);
  font-weight: 500;
  line-height: 1.4;
  letter-spacing: var(--tracking-mono);
  font-variant-numeric: tabular-nums;
}

/* where: event · location, a quiet mono line */
.page-noticias .nw-where {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px 20px;
  color: var(--fg-3);
  font-family: var(--font-mono);
  font-size: var(--fs-label-sm);
  font-weight: 500;
  line-height: 1.5;
  letter-spacing: var(--tracking-mono);
}
.page-noticias .nw-where__item { display: inline-flex; align-items: flex-start; gap: 6px; min-inline-size: 0; }
.page-noticias .nw-where__item .icon { margin-block-start: .1em; color: var(--fg-3); }

/* copy-the-permalink pill (site.js [data-copy]): icon only on phones, icon + label from 640px */
.page-noticias .nw-copy {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-block-size: 32px;
  min-inline-size: 32px;
  margin-inline-start: auto;
  padding: 0 9px;
  border: 1px solid var(--line);
  border-radius: var(--r-pill);
  color: var(--fg-3);
  font-family: var(--font-mono);
  font-size: var(--fs-label-sm);
  font-weight: 500;
  line-height: 1;
  letter-spacing: var(--tracking-mono);
  white-space: nowrap;
  transition: color var(--dur-micro), border-color var(--dur-micro), background-color var(--dur-micro);
}
.page-noticias .nw-copy::before { content: ""; position: absolute; inset: -6px -6px; }  /* 44px target */
.page-noticias .nw-copy:hover { border-color: var(--line-2); background: var(--bg-3); color: var(--fg); }
.page-noticias .nw-copy.is-copied { border-color: color-mix(in srgb, var(--red-400) 55%, transparent); color: var(--red-200); }
.page-noticias .nw-copy.is-copied .icon--check { color: var(--red-300); }
/* site.css swaps .icon--copy for the check; this button shows a link icon instead */
.page-noticias .nw-copy.is-copied .icon--link { display: none; }
.page-noticias .nw-copy__label {
  position: absolute;
  inline-size: 1px;
  block-size: 1px;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
}
@media (min-width: 640px) {
  /* with its label it reads as an action on its own: the pill only shows on hover and focus */
  .page-noticias .nw-copy { padding: 0 12px 0 10px; border-color: transparent; }
  .page-noticias .nw-copy__label { position: static; inline-size: auto; block-size: auto; overflow: visible; clip-path: none; }
}
html.no-js .page-noticias .nw-copy { display: none; }

/* photo frame: fixed 16:9, a hairline drawn over the picture, slightly dimmed at rest */
.page-noticias .nw-media {
  position: relative;
  overflow: hidden;
  border-radius: var(--r-md);
  background: var(--bg-3);
}
.page-noticias .nw-media::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  box-shadow: inset 0 0 0 1px var(--line-2);
  pointer-events: none;
}
.page-noticias .nw-media img {
  inline-size: 100%;
  block-size: auto;
  aspect-ratio: 16 / 9;
  object-fit: cover;
}

/* empty states */
.page-noticias .nw-empty {
  display: flex;
  align-items: center;
  gap: 18px;
  max-inline-size: 640px;
  padding: clamp(20px, 3vw, 32px);
  border: 1px dashed var(--line-2);
  border-radius: var(--r-lg);
  color: var(--fg-2);
}

/* --- 01 featured story --------------------------------------------------- */
.page-noticias .nw-lead__eyebrow { margin-block-end: clamp(18px, 2.2vw, 26px); }

.page-noticias .nw-feature {
  --pad: clamp(20px, 3.6vw, 52px);
  position: relative;
  isolation: isolate;
  overflow: clip;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: clamp(28px, 3.6vw, 52px);
  padding: var(--pad);
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--fg) 2.2%, transparent), transparent 42%),
    var(--bg-2);
}
/* no panel (no highlight, image or list): the free side of the card carries the grid and a glow */
.page-noticias .nw-feature--solo {
  background:
    radial-gradient(ellipse 55% 95% at 100% 0%, color-mix(in srgb, var(--red-700) 30%, transparent), transparent 68%),
    linear-gradient(180deg, color-mix(in srgb, var(--fg) 2.2%, transparent), transparent 42%),
    var(--bg-2);
}
.page-noticias .nw-feature--solo::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background-image: var(--grid);
  background-size: 48px 48px;
  background-position: -1px -1px;
  -webkit-mask-image: linear-gradient(110deg, transparent 42%, #000 100%);
  mask-image: linear-gradient(110deg, transparent 42%, #000 100%);
  pointer-events: none;
}
/* deep link from the home page: the frame lights up once */
.page-noticias .nw-feature:target { border-color: color-mix(in srgb, var(--red-400) 45%, transparent); }
@media (prefers-reduced-motion: no-preference) {
  .page-noticias .nw-feature:target { animation: nw-ring 2.4s .2s var(--ease-out) backwards; }
}
@keyframes nw-ring {
  from { box-shadow: 0 0 0 1px color-mix(in srgb, var(--red-400) 70%, transparent), 0 0 48px -8px color-mix(in srgb, var(--red-400) 45%, transparent); }
  to { box-shadow: 0 0 0 1px transparent, 0 0 48px -8px transparent; }
}

.page-noticias .nw-feature__main {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: clamp(16px, 1.8vw, 22px);
  min-inline-size: 0;
}
.page-noticias .nw-feature__main > .nw-meta { align-self: stretch; }
/* phones: category and copy button share the first line, the date takes the second */
@media (max-width: 479.98px) {
  .page-noticias .nw-feature__main > .nw-meta .nw-meta__date { order: 3; flex-basis: 100%; }
}
.page-noticias .nw-feature__title {
  margin-block-start: clamp(4px, 1vw, 12px);
  font-size: clamp(2rem, 1.3rem + 2.5vw, 3.5rem);
  line-height: 1.04;
  letter-spacing: -.034em;
  max-inline-size: 17ch;
}
.page-noticias .nw-feature__summary {
  color: var(--fg-2);
  font-size: var(--fs-lead);
  line-height: 1.6;
  max-inline-size: 54ch;
}
.page-noticias :is(.nw-feature__summary, .nw-entry__summary) strong { color: var(--fg); font-weight: 500; }
.page-noticias :is(.nw-feature__summary, .nw-entry__summary) a {
  color: var(--red-300);
  text-decoration: underline;
  text-decoration-color: color-mix(in srgb, var(--red-300) 45%, transparent);
  transition: color var(--dur-micro), text-decoration-color var(--dur-micro);
}
.page-noticias :is(.nw-feature__summary, .nw-entry__summary) a:hover { color: var(--red-200); text-decoration-color: currentColor; }
.page-noticias .nw-feature__body { font-size: 1rem; }
/* event, location and the link close the text column, at its foot when the panel is taller */
.page-noticias .nw-feature__foot {
  display: grid;
  justify-items: start;
  gap: 20px;
  margin-block-start: auto;
  padding-block-start: clamp(4px, 1.2vw, 12px);
}

.page-noticias .nw-feature__aside { display: grid; align-content: start; gap: 16px; min-inline-size: 0; }

/* the highlight panel: a big number (or phrase) and, for list bodies, the list itself */
.page-noticias .nw-panel {
  position: relative;
  isolation: isolate;
  overflow: clip;
  padding: clamp(22px, 2.6vw, 34px);
  border: 1px solid var(--line);
  border-radius: var(--r-md);
  background:
    radial-gradient(ellipse 85% 65% at 0% 0%, color-mix(in srgb, var(--red-700) 30%, transparent), transparent 72%),
    var(--bg);
}
.page-noticias .nw-panel::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background-image: var(--grid);
  background-size: 32px 32px;
  background-position: -1px -1px;
  -webkit-mask-image: radial-gradient(ellipse 90% 75% at 100% 0%, #000 15%, transparent 72%);
  mask-image: radial-gradient(ellipse 90% 75% at 100% 0%, #000 15%, transparent 72%);
}
.page-noticias .nw-panel .stat { padding: 0; gap: 14px; }
.page-noticias .nw-panel .stat__value { line-height: .8; }
.page-noticias .nw-panel .stat__label { color: var(--fg-2); }
.page-noticias .nw-panel__text {
  color: var(--fg);
  font-family: var(--font-display);
  font-size: clamp(1.6rem, 1.2rem + 1.4vw, 2.25rem);
  font-weight: 600;
  line-height: 1.1;
  letter-spacing: -.03em;
  text-wrap: balance;
}

/* list bodies (the papers): numbered, ruled; *title* on its own line, the authors below */
.page-noticias .nw-papers { margin-block-start: clamp(22px, 2.6vw, 30px); }
.page-noticias .nw-papers :is(ul, ol) {
  padding: 0;
  list-style: none;
  counter-reset: nw-item;
  border-block-start: 1px solid var(--line-2);
}
.page-noticias .nw-papers li {
  position: relative;
  padding-block: 14px;
  padding-inline-start: 2.6rem;
  border-block-end: 1px solid var(--line);
  color: var(--fg-3);
  font-size: .875rem;
  line-height: 1.5;
  counter-increment: nw-item;
}
.page-noticias .nw-papers li:last-child { padding-block-end: 0; border-block-end: 0; }
.page-noticias .nw-papers li::before {
  content: counter(nw-item, decimal-leading-zero);
  position: absolute;
  inset-inline-start: 0;
  inset-block-start: 16px;
  color: var(--fg-3);
  font-family: var(--font-mono);
  font-size: var(--fs-label-sm);
  font-weight: 500;
  line-height: 1.4;
  letter-spacing: var(--tracking-mono);
  font-variant-numeric: tabular-nums;
  transition: color var(--dur-micro);
}
.page-noticias .nw-papers li:hover::before { color: var(--red-300); }
.page-noticias .nw-papers :is(em, strong) {
  display: block;
  margin-block-end: 2px;
  color: var(--fg);
  font-family: var(--font-display);
  font-size: .9875rem;
  font-style: normal;
  font-weight: 500;
  line-height: 1.38;
  letter-spacing: -.008em;
}
.page-noticias .nw-papers a { color: var(--red-300); text-decoration-color: color-mix(in srgb, var(--red-300) 45%, transparent); }
.page-noticias .nw-papers a:hover { color: var(--red-200); }

/* phones and tablets: the panel becomes the card's footer band, edge to edge */
@media (max-width: 959.98px) {
  .page-noticias .nw-feature__aside { margin: 0 calc(var(--pad) * -1) calc(var(--pad) * -1); gap: 0; }
  .page-noticias .nw-feature__media { border-radius: 0; }
  .page-noticias .nw-feature__media::after { box-shadow: inset 0 1px 0 var(--line); }
  .page-noticias .nw-panel { padding: var(--pad); border-width: 1px 0 0; border-radius: 0; }
}
@media (min-width: 640px) and (max-width: 959.98px) {
  .page-noticias .nw-panel:has(.stat + .nw-papers) {
    display: grid;
    grid-template-columns: minmax(0, 13rem) minmax(0, 1fr);
    gap: 40px;
    align-items: start;
  }
  .page-noticias .nw-panel:has(.stat + .nw-papers) .nw-papers { margin-block-start: 0; }
}
@media (min-width: 960px) {
  .page-noticias .nw-feature { grid-template-columns: minmax(0, 1.18fr) minmax(0, 1fr); }
  .page-noticias .nw-feature--solo { grid-template-columns: minmax(0, 1fr); }
}

/* --- 02 archive: a ruled timeline ------------------------------------------ */
.page-noticias .nw-timeline {
  --nw-date: clamp(7.5rem, 13vw, 12.5rem);
  --nw-gap: clamp(24px, 3.4vw, 48px);
  --nw-x: 0px;
  border-block-end: 1px solid var(--line);
}
@media (min-width: 768px) {
  .page-noticias .nw-timeline { --nw-x: calc(var(--nw-date) + var(--nw-gap)); }
}

.page-noticias .nw-entry {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 16px;
  padding-block: clamp(28px, 3.6vw, 48px);
}
/* top rule + registration tick where the text column starts; a new year rules the full width,
   later stories of the same year only rule the text column */
.page-noticias .nw-entry::before {
  content: "";
  position: absolute;
  inset-inline: 0;
  inset-block-start: -3px;
  block-size: 7px;
  background:
    linear-gradient(var(--line-2), var(--line-2)) var(--nw-x) 0 / 1px 100% no-repeat,
    linear-gradient(var(--line), var(--line)) var(--nw-rule, 0px) 3px / 100% 1px no-repeat;
  pointer-events: none;
}
.page-noticias .nw-entry:not(.is-year-start) { --nw-rule: var(--nw-x); }
/* with JS, each rule draws in from its start as the row is revealed (the tick stays put); only
   where :has() can tell the row was revealed, so the rules never stay undrawn */
@media (prefers-reduced-motion: no-preference) {
  @supports selector(:has(*)) {
    html.js .page-noticias .nw-entry::before {
      background-size: 1px 100%, 0% 1px;
      transition: background-size 1.4s var(--ease-out);
    }
    html.js .page-noticias .nw-entry:has(> .nw-entry__when.is-in)::before { background-size: 1px 100%, 100% 1px; }
  }
}
/* .row-hover (site.css) draws the red line along the rule on hover, focus and when the story is
   the deep-link target: from the text column on a row that only rules the text column, and on
   the rule itself (drawn at the top of the padding box, not over a border) */
.page-noticias .nw-entry.row-hover::after { inset-block-start: 0; }
.page-noticias .nw-entry:not(.is-year-start) { --row-rule-start: var(--nw-x); }
.page-noticias .nw-entry:is(:hover, :focus-within, :target)::before {
  background:
    linear-gradient(var(--red-400), var(--red-400)) var(--nw-x) 0 / 1px 100% no-repeat,
    linear-gradient(var(--line), var(--line)) var(--nw-rule, 0px) 3px / 100% 1px no-repeat;
}
@media (prefers-reduced-motion: no-preference) {
  .page-noticias .nw-entry:target { animation: nw-wash 2.6s .2s var(--ease-out) backwards; }
}
@keyframes nw-wash {
  from { background-color: color-mix(in srgb, var(--red-900) 45%, transparent); }
}

/* date column: the year once per year group (large, mono), then day and month */
.page-noticias .nw-date { display: block; }
.page-noticias .nw-date__vis { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 14px; }
/* .numeral (site.css): Kode Mono, tabular figures, bearing compensation; it turns red on row hover */
.page-noticias .nw-date__year {
  color: var(--fg);
  font-size: clamp(1.75rem, 1.4rem + 1.7vw, 3.25rem);
}
.page-noticias .nw-date__day {
  color: var(--fg-3);
  font-family: var(--font-mono);
  font-size: var(--fs-label-sm);
  font-weight: 500;
  line-height: 1.4;
  letter-spacing: var(--tracking-label);
  text-transform: uppercase;
}

.page-noticias .nw-entry__body { display: grid; align-content: start; justify-items: start; gap: 12px; min-inline-size: 0; }
.page-noticias .nw-entry__body > .nw-meta { justify-self: stretch; margin-block-end: 4px; }
.page-noticias .nw-entry__title {
  font-size: clamp(1.3rem, 1.05rem + .9vw, 1.75rem);
  line-height: 1.18;
  letter-spacing: -.022em;
  max-inline-size: 40ch;
}
.page-noticias .nw-entry__summary { color: var(--fg-2); font-size: 1rem; line-height: 1.65; max-inline-size: 62ch; }
.page-noticias .nw-entry__body > .nw-where { margin-block-start: 4px; }
.page-noticias .nw-entry__text { font-size: 1rem; }
.page-noticias .nw-entry__link { margin-block-start: -4px; }
/* the featured story in the chronology: its title links up to the card */
.page-noticias .nw-entry--featured .nw-entry__title { font-size: clamp(1.15rem, 1rem + .6vw, 1.4rem); }
.page-noticias .nw-entry__up {
  color: inherit;
  text-decoration: underline;
  text-decoration-color: transparent;
  text-decoration-thickness: 1px;
  text-underline-offset: .2em;
  transition: text-decoration-color var(--dur-micro);
}
.page-noticias .nw-entry__up .icon { color: var(--fg-3); vertical-align: -.12em; transition: color var(--dur-micro), translate var(--dur-ui) var(--ease-out); }
.page-noticias .nw-entry__up:is(:hover, :focus-visible) { text-decoration-color: var(--red-300); }
.page-noticias .nw-entry__up:is(:hover, :focus-visible) .icon { color: var(--red-300); translate: 0 -3px; }

.page-noticias .nw-entry__media { inline-size: 100%; }

@media (min-width: 768px) {
  .page-noticias .nw-entry { grid-template-columns: var(--nw-date) minmax(0, 1fr); column-gap: var(--nw-gap); }
  .page-noticias .nw-date__vis { flex-direction: column; align-items: flex-start; gap: 12px; }
  .page-noticias .nw-entry__media { grid-column: 2; max-inline-size: 330px; }
}
/* wide: the photo takes a third column (at most 330px: the files' own 660px at 2×) */
@media (min-width: 960px) {
  .page-noticias .nw-entry.has-media { grid-template-columns: var(--nw-date) minmax(0, 1fr) clamp(220px, 23vw, 330px); }
  .page-noticias .nw-entry__media { grid-column: 3; align-self: start; }
}

/* --- 03 awards: a compact honours index, year · trophy · title → ------------ */
/* only the featured story above (no archive): both sections share the page background */
.page-noticias .nw-lead + .nw-awards { border-block-start: 1px solid var(--line); }
.page-noticias .nw-honours { --ruled-min: 360px; }
/* each cell is one link (.card--interactive spotlight); a cell of a ruled grid never lifts */
.page-noticias .nw-honour {
  position: relative;
  isolation: isolate;
  display: grid;
  grid-template-columns: auto auto minmax(0, 1fr) auto;
  align-items: center;
  gap: clamp(14px, 1.8vw, 22px);
  padding: clamp(20px, 2.4vw, 30px);
}
.page-noticias .nw-honour.card--interactive:hover { transform: none; box-shadow: 0 0 0 1px var(--line); }
.page-noticias .nw-honour__year {
  color: var(--fg);
  font-size: clamp(1.75rem, 1.4rem + 1.2vw, 2.5rem);
  transition: color var(--dur-micro);
}
.page-noticias .nw-honour:is(:hover, :focus-within) .nw-honour__year { color: var(--red-300); }
.page-noticias .nw-honour__icon { inline-size: 40px; block-size: 40px; }
.page-noticias .nw-honour__title { font-size: clamp(1.0625rem, 1rem + .3vw, 1.2rem); line-height: 1.3; letter-spacing: -.015em; text-wrap: pretty; }
.page-noticias .nw-honour__link { color: inherit; text-decoration: none; }
.page-noticias .nw-honour__link::after { content: ""; position: absolute; inset: 0; z-index: 1; }
.page-noticias .nw-honour__link:focus-visible {
  outline: none;
  text-decoration: underline;
  text-decoration-color: var(--red-300);
  text-decoration-thickness: 2px;
  text-underline-offset: .22em;
}
.page-noticias .nw-honour:has(.nw-honour__link:focus-visible) { z-index: 1; outline: 2px solid var(--red-300); outline-offset: -2px; }
.page-noticias .nw-honour__go { display: inline-grid; color: var(--fg-3); transition: color var(--dur-micro), translate var(--dur-ui) var(--ease-out); }
.page-noticias .nw-honour:is(:hover, :focus-within) .nw-honour__go { color: var(--red-300); translate: 4px 0; }
/* narrow phones: the trophy gives its column to the title */
@media (max-width: 399.98px) {
  .page-noticias .nw-honour { grid-template-columns: auto minmax(0, 1fr) auto; }
  .page-noticias .nw-honour__icon { display: none; }
}

/* --- motion preferences, print -------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
  .page-noticias .nw-honour:is(:hover, :focus-within) .nw-honour__go,
  .page-noticias .nw-entry__up:is(:hover, :focus-visible) .icon { translate: none; }
}
@media print {
  .page-noticias .nw-copy,
  .page-noticias .nw-honour__go,
  .page-noticias .nw-panel::before { display: none !important; }
  .page-noticias .nw-feature, .page-noticias .nw-entry, .page-noticias .nw-honour { break-inside: avoid; }
}