/* ============================================================
   ACERINA AMADOR — Press section
   Editorial index of press mentions. Rows, not cards.
   Namespace: pr-
   ============================================================ */

/* ---- Header: title left, lead trailing (asymmetric) ---- */
.pr-head { margin-bottom: clamp(var(--space-lg), 5vw, var(--space-2xl)); }
.pr-title { margin: 0; }
.pr-lead { margin-top: var(--space-md); max-width: 40ch; color: var(--bone-dim); }

/* ---- List: strong top rule, soft internal rules ---- */
.pr-list { border-top: 1px solid var(--hairline); }

.pr-row {
  border-bottom: 1px solid var(--hairline-soft);
  transition: border-color var(--dur-ui) var(--ease-out-quint);
}
.pr-row:hover,
.pr-row:focus-within { border-bottom-color: var(--vermelho-deep); }

/* ---- Row link (whole row is the target) ---- */
.pr-link {
  display: grid;
  grid-template-columns: 1fr auto;
  grid-template-areas:
    "outlet   year"
    "headline headline"
    "read     read";
  align-items: baseline;
  column-gap: var(--space-md);
  row-gap: var(--space-sm);
  padding-block: clamp(var(--space-md), 4.5vw, var(--space-lg));
  color: inherit;
}

/* ---- Outlet: the tall condensed anchor ---- */
.pr-outlet {
  grid-area: outlet;
  min-width: 0;
  position: relative;
  font-family: var(--font-display);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: var(--track-display);
  line-height: 0.95;
  font-size: clamp(1.55rem, 6vw, 2.5rem);
  color: var(--bone);
  transition: color var(--dur-ui) var(--ease-out-quint),
              transform var(--dur-ui) var(--ease-out-quint);
}
/* Signature red square — revealed on hover in the vacated left space */
.pr-outlet::before {
  content: "";
  position: absolute;
  left: -0.62em;
  top: 50%;
  width: 0.34em;
  height: 0.34em;
  background: var(--vermelho);
  transform: translateY(-50%) scale(0);
  transition: transform var(--dur-ui) var(--ease-out-quint);
}

/* ---- Headline ---- */
.pr-headline {
  grid-area: headline;
  min-width: 0;
  max-width: 52ch;
  font-family: var(--font-text);
  font-size: var(--fs-body);
  font-weight: 400;
  line-height: 1.45;
  color: var(--bone-dim);
  transition: color var(--dur-ui) var(--ease-out-quint);
}

/* ---- Year: small condensed numeral, meta ---- */
.pr-year {
  grid-area: year;
  justify-self: end;
  font-family: var(--font-display);
  font-weight: 600;
  font-size: 1.15rem;
  letter-spacing: 0.01em;
  font-variant-numeric: tabular-nums;
  color: var(--muted);
  transition: color var(--dur-ui) var(--ease-out-quint);
}

/* ---- Read affordance ---- */
.pr-read {
  grid-area: read;
  justify-self: start;
  display: inline-flex;
  align-items: center;
  gap: 0.5em;
  font-family: var(--font-text);
  font-weight: 600;
  font-size: var(--fs-sm);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--bone-dim);
  transition: color var(--dur-ui) var(--ease-out-quint);
}
.pr-read-label { position: relative; }
.pr-read-label::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -3px;
  width: 100%;
  height: 1.5px;
  background: var(--vermelho-bright);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform var(--dur-slow) var(--ease-out-expo);
}
.pr-arrow {
  width: 0.9em;
  height: 0.9em;
  overflow: visible;
  transition: transform var(--dur-ui) var(--ease-out-quint);
}

/* ---- Shared hover / keyboard-focus choreography ---- */
.pr-link:hover .pr-outlet,
.pr-link:focus-visible .pr-outlet {
  color: var(--vermelho-bright);
  transform: translateX(0.62em);
}
.pr-link:hover .pr-outlet::before,
.pr-link:focus-visible .pr-outlet::before { transform: translateY(-50%) scale(1); }
.pr-link:hover .pr-headline,
.pr-link:focus-visible .pr-headline { color: var(--bone); }
.pr-link:hover .pr-year,
.pr-link:focus-visible .pr-year { color: var(--bone-dim); }
.pr-link:hover .pr-read,
.pr-link:focus-visible .pr-read { color: var(--vermelho-bright); }
.pr-link:hover .pr-read-label::after,
.pr-link:focus-visible .pr-read-label::after { transform: scaleX(1); }
.pr-link:hover .pr-arrow,
.pr-link:focus-visible .pr-arrow { transform: translate(2px, -2px); }

/* ---- Wide: single editorial line ---- */
@media (min-width: 720px) {
  .pr-head {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: end;
    gap: var(--space-xl);
  }
  .pr-lead {
    margin-top: 0;
    max-width: 32ch;
    text-align: right;
    padding-bottom: 0.35em;
  }

  .pr-link {
    grid-template-columns: minmax(7rem, 0.85fr) minmax(0, 1.7fr) auto auto;
    grid-template-areas: "outlet headline year read";
    column-gap: clamp(var(--space-lg), 4vw, var(--space-2xl));
    row-gap: 0;
    padding-block: clamp(var(--space-md), 2.2vw, var(--space-lg));
  }
  /* Single-line rows sit in a narrow outlet column: cap the display size so an
     unwrappable name (BLOGOFEROZ, PERIODISMO) never spills into the headline. */
  .pr-outlet { font-size: clamp(1.6rem, 2.4vw, 2.4rem); }
  .pr-headline { max-width: none; }
  .pr-year { justify-self: start; }
  .pr-read { justify-self: end; }
}