/*
  File role: VOGO eBS Portal — the price page of a notary office (onorarii/index.php, NOTAR-ASIST D-031), over
  services.css (topbar, footer bar) and services/office.css (the office's tokens --nb-*, the light grey page).
  Its own parts only: the ink band with the title, the sections, the price tables — on the phone each row a card.
  @file_version 1.0.0
*/

/* ── The band ─────────────────────────────────────────────────────────────── */
.pr-hero {
  color: #fff;
  background:
    radial-gradient(900px 420px at 85% -10%, rgba(15, 108, 189, 0.45), transparent 60%),
    linear-gradient(180deg, var(--nb-ink) 0%, var(--nb-ink-2) 100%);
}
.pr-hero__inner { max-width: var(--nb-max); margin: 0 auto; padding: 26px 24px 40px; }
.pr-back {
  display: inline-flex; gap: 8px; align-items: center; margin-bottom: 22px; padding: 7px 14px;
  border: 1px solid rgba(255, 255, 255, 0.22); border-radius: 5px; color: #fff; font-size: 0.88rem; font-weight: 600;
  text-decoration: none;
}
.pr-back:hover { background: rgba(255, 255, 255, 0.08); }
.pr-hero__kicker { margin: 0 0 6px; font-size: 0.82rem; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: var(--nb-sky); }
.pr-hero__title {
  margin: 0 0 12px; font-family: var(--portal-font-display, "Inter Tight", system-ui, sans-serif);
  font-size: clamp(1.8rem, 4vw, 2.6rem); font-weight: 800; letter-spacing: -0.015em; line-height: 1.1;
}
.pr-hero__lead { max-width: 760px; margin: 0; font-size: 1.02rem; line-height: 1.6; color: rgba(255, 255, 255, 0.86); }

/* ── The page and its sections ────────────────────────────────────────────── */
.pr-page { max-width: var(--nb-max); margin: 0 auto; padding: 28px 24px 48px; }
.pr-section { margin-bottom: 36px; padding: 24px 26px; border: 1px solid var(--nb-line); border-radius: 7px; background: #fff; }
.pr-h2 { margin: 0 0 8px; font-family: var(--portal-font-display, "Inter Tight", system-ui, sans-serif); font-size: 1.5rem; font-weight: 800; color: var(--nb-ink); }
.pr-h3 { margin: 22px 0 10px; font-size: 1.02rem; font-weight: 700; color: var(--nb-ink); }
.pr-note { max-width: 820px; margin: 0 0 6px; font-size: 0.95rem; line-height: 1.55; color: var(--nb-muted); }
.pr-muted { color: var(--nb-muted); }
.pr-source { display: block; margin-top: 3px; font-size: 0.78rem; font-weight: 400; line-height: 1.4; color: var(--nb-muted); }

/* ── The tables ───────────────────────────────────────────────────────────── */
.pr-table-wrap { border: 1px solid var(--nb-line); border-radius: 7px; overflow: hidden; }
.pr-table { width: 100%; border-collapse: collapse; font-size: 0.94rem; }
.pr-table th, .pr-table td { padding: 10px 14px; border-bottom: 1px solid #EEF2F6; text-align: left; vertical-align: top; }
.pr-table thead th { background: var(--nb-paper); font-size: 0.78rem; font-weight: 700; letter-spacing: 0.04em; text-transform: uppercase; color: var(--nb-muted); }
.pr-table tbody tr:last-child th, .pr-table tbody tr:last-child td { border-bottom: 0; }
.pr-table tbody th { font-weight: 600; color: var(--nb-text); }
.pr-table tbody th a { color: var(--nb-ink); text-decoration: none; }
.pr-table tbody th a:hover { color: var(--nb-blue); text-decoration: underline; }
.pr-table tbody tr:target { background: var(--nb-ice); }
.pr-table:not(.pr-table--legal) td:nth-child(2) { font-weight: 600; color: var(--nb-ink); white-space: nowrap; }
.pr-source-cell { font-size: 0.84rem; color: var(--nb-muted); }

/* ── Phone: every row a card, the column name before each value ───────────── */
@media (max-width: 700px) {
  .pr-hero__inner { padding: 18px 16px 30px; }
  .pr-page { padding: 18px 12px 36px; }
  .pr-section { padding: 18px 14px; }
  .pr-table thead { display: none; }
  .pr-table, .pr-table tbody, .pr-table tr, .pr-table th, .pr-table td { display: block; width: 100%; }
  .pr-table tr { padding: 10px 12px; border-bottom: 1px solid #EEF2F6; }
  .pr-table th, .pr-table td { padding: 2px 0; border: 0; }
  .pr-table td::before { content: attr(data-label) ": "; font-size: 0.78rem; font-weight: 600; color: var(--nb-muted); }
  .pr-table:not(.pr-table--legal) td:nth-child(2) { white-space: normal; }
}