/*!
 * Pretcurent Tariffs — frontend styles
 *
 * Extracted from page 1648 _cssCustom and packaged with the plugin so the
 * page only needs the [pcp-tariffs] shortcode (no inline CSS needed).
 *
 * Design tokens used: --color-primary #3B5BDB, --color-ink #0F172A,
 * --color-body #475569, Plus Jakarta Sans (headings) + DM Sans (body).
 */

.pcp-tariffs { display: block; }
.pcp-tariffs__data { display: none; }

/* ========== Anti-comparator eyebrow ========== */
/* Establishes the "data publisher, not comparator" frame BEFORE Maria scrolls
   into the price rows. Microcopy lifted from VOC research deliverable 04. */
.pcp-tariffs__eyebrow {
  margin: 0 0 1.6rem;
  padding: 1.2rem 1.6rem;
  background: #EFF4FF;
  border-left: 3px solid #3B5BDB;
  border-radius: 4px;
  font-family: 'DM Sans', sans-serif;
  font-size: 1.4rem; line-height: 1.5; color: #0F172A;
}
.pcp-tariffs__eyebrow strong { color: #3B5BDB; font-weight: 700; }

/* ========== Trust strip ========== */
/* Factual signals only — source + refresh cadence + dataset size. No claims
   that would require user approval (HARD RULE: no unilateral content). */
.pcp-tariffs__trust {
  list-style: none; padding: 0; margin: 0 0 2.4rem;
  display: flex; flex-wrap: wrap; gap: 0.4rem 0;
  font-family: 'DM Sans', sans-serif;
  font-size: 1.2rem; color: #64748B;
}
.pcp-tariffs__trust > li { display: contents; }
.pcp-tariffs__trust-item { display: inline-flex; align-items: center; }
.pcp-tariffs__trust-item:not(:last-child)::after {
  content: '·'; margin: 0 1rem; color: #94A3B8;
}
.pcp-tariffs__trust-item a { color: #3B5BDB; text-decoration: none; font-weight: 600; }
.pcp-tariffs__trust-item a:hover { text-decoration: underline; text-underline-offset: 2px; }

/* ========== Filter-bar reassurance (below filter chips, above grid) ========== */
.pc-pt-filters__meta {
  display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between;
  gap: 0.8rem 2rem;
  margin: 1.6rem 0 2rem;
}
.pc-pt-filters__reassurance {
  margin: 0;
  font-family: 'DM Sans', sans-serif;
  font-size: 1.25rem; line-height: 1.5; color: #475569;
}
.pc-pt-filters__reassurance strong { color: #0F172A; font-weight: 600; }

/* ========== L2 — Featured Cards (deprecated v0.1.14; CSS kept for opt-in via [pcp-tariffs view="cards"] which is no longer reachable from default render) ========== */
.pcp-tariffs__cards { display: block; margin-bottom: 6.4rem; }

.pc-cards__head {
  text-align: center;
  max-width: 80rem;
  margin: 0 auto 4.8rem;
}
.pc-cards__eyebrow {
  font-family: 'DM Sans', sans-serif;
  font-size: 1.2rem; font-weight: 700;
  text-transform: uppercase; letter-spacing: 0.16em;
  color: #3B5BDB; margin: 0 0 1.6rem;
}
.pc-cards__title {
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: clamp(2.6rem, 2.2rem + 1vw, 3.6rem);
  font-weight: 800; line-height: 1.18; color: #0F172A;
  margin: 0 0 1.6rem; letter-spacing: -0.015em;
}
.pc-cards__lede {
  font-family: 'DM Sans', sans-serif;
  font-size: 1.6rem; line-height: 1.6; color: #475569;
  margin: 0 auto; max-width: 68rem;
}
.pc-cards__lede a { color: #3B5BDB; font-weight: 600; text-decoration: none; }
.pc-cards__lede a:hover { text-decoration: underline; text-underline-offset: 2px; }

.pc-cards__list {
  list-style: none; padding: 0; margin: 0;
  display: flex; flex-direction: column; gap: 1.6rem;
}

.pc-card {
  position: relative;
  display: grid;
  grid-template-columns: 6.4rem 1fr auto;
  align-items: center;
  gap: 2.4rem 3.2rem;
  background: #FFFFFF;
  border: 1px solid #E2E8F0;
  border-radius: 16px;
  padding: 2.4rem 2.8rem;
  transition: border-color 0.2s ease, box-shadow 0.2s ease, transform 0.15s ease;
}
.pc-card:hover {
  border-color: #CDDBFA;
  box-shadow: 0 8px 24px rgba(15, 23, 42, 0.06);
  transform: translateY(-1px);
}

.pc-card__logo {
  width: 6.4rem; height: 6.4rem;
  background: #F8FAFC;
  border: 1px dashed #E2E8F0;
  border-radius: 12px;
  display: flex; align-items: center; justify-content: center;
  position: relative; overflow: hidden;
}
.pc-card__logo:empty::before {
  content: attr(data-supplier);
  font-family: 'DM Sans', sans-serif;
  font-size: 0.95rem; color: #94A3B8;
  text-transform: uppercase; letter-spacing: 0.04em; font-weight: 600;
  text-align: center; padding: 0 0.6rem; line-height: 1.2;
}
.pc-card__logo img { max-width: 100%; max-height: 4rem; object-fit: contain; }

.pc-card__info { display: grid; gap: 1.4rem; min-width: 0; }
.pc-card__head { display: grid; gap: 0.2rem; }
.pc-card__supplier {
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 2.2rem; font-weight: 700; color: #0F172A;
  margin: 0; letter-spacing: -0.01em; line-height: 1.2;
}
.pc-card__offer {
  display: flex; flex-wrap: wrap; align-items: baseline; gap: 0.4rem 1rem;
  font-family: 'DM Sans', sans-serif;
  font-size: 1.4rem; color: #64748B; margin: 0;
  min-width: 0;
}
.pc-card__offer-text { min-width: 0; }

.pc-card__specs {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, auto));
  gap: 0.4rem 2.4rem; margin: 0;
  align-items: baseline;
}
.pc-card__spec { display: flex; flex-direction: column; gap: 0.2rem; min-width: 0; }
.pc-card__spec dt {
  font-family: 'DM Sans', sans-serif;
  font-size: 1.05rem; color: #94A3B8;
  text-transform: uppercase; letter-spacing: 0.08em; font-weight: 600;
  white-space: nowrap;
}
.pc-card__spec dd {
  margin: 0; font-family: 'DM Sans', sans-serif;
  font-size: 1.4rem; font-weight: 600; color: #0F172A;
  font-variant-numeric: tabular-nums; white-space: nowrap;
}

.pc-card__price {
  display: flex; flex-direction: column; align-items: flex-end;
  gap: 0.4rem; text-align: right; min-width: 16rem;
  padding-left: 2.4rem; border-left: 1px solid #F1F5F9;
}
.pc-card__price-label {
  font-family: 'DM Sans', sans-serif;
  font-size: 1.05rem; color: #94A3B8;
  text-transform: uppercase; letter-spacing: 0.08em; font-weight: 600;
}
.pc-card__price-value {
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: clamp(3rem, 2.6rem + 1vw, 3.8rem);
  font-weight: 800; line-height: 1; color: #0F172A;
  font-variant-numeric: tabular-nums; letter-spacing: -0.025em; margin: 0;
}
.pc-card__price-value-unit {
  font-family: 'DM Sans', sans-serif;
  font-size: 1.3rem; font-weight: 500; color: #64748B;
  margin-left: 0.4rem; letter-spacing: 0;
}
.pc-card__price-annual {
  font-family: 'DM Sans', sans-serif;
  font-size: 1.2rem; color: #94A3B8; margin: 0;
  font-variant-numeric: tabular-nums;
}

.pc-cards__methodology {
  text-align: center; font-family: 'DM Sans', sans-serif;
  font-size: 1.3rem; color: #64748B;
  margin: 4rem auto 0; font-style: italic;
  max-width: 80rem; line-height: 1.6;
}
.pc-cards__methodology a {
  color: #3B5BDB; text-decoration: none;
  font-weight: 600; font-style: normal;
}
.pc-cards__methodology a:hover { text-decoration: underline; text-underline-offset: 2px; }

/* ========== L3 — Filter bar (outage-page style) ========== */
.pc-pt-filters {
  display: flex; align-items: center; justify-content: space-between;
  flex-wrap: wrap; gap: 1.6rem 2rem;
  padding: 1.6rem 2rem;
  background: #F8F9FC;
  border: 1px solid #CDDBFA;
  border-radius: 16px;
}
.pc-pt-filters__chips {
  display: inline-flex;
  background: #FFFFFF;
  border: 1px solid #E2E8F0;
  border-radius: 100px;
  padding: 0.4rem; gap: 0.2rem;
}
.pc-pt-filters__chip {
  font-family: 'DM Sans', sans-serif;
  font-size: 1.3rem; font-weight: 500; color: #475569;
  background: transparent; border: 0; border-radius: 100px;
  padding: 0.8rem 1.6rem; min-height: 36px;
  cursor: pointer; line-height: 1;
  transition: background 0.15s ease, color 0.15s ease;
}
.pc-pt-filters__chip:hover { background: #F1F4FA; color: #0F172A; }
.pc-pt-filters__chip.is-active {
  background: #3B5BDB; color: #FFFFFF; font-weight: 600;
}
.pc-pt-filters__chip:focus-visible {
  outline: 2px solid #3B5BDB; outline-offset: 2px;
}

.pc-pt-filters__field {
  display: flex; flex-direction: column; gap: 0.4rem; min-width: 22rem;
}
.pc-pt-filters__field-label {
  font-family: 'DM Sans', sans-serif;
  font-size: 1rem; font-weight: 700; color: #64748B;
  text-transform: uppercase; letter-spacing: 0.1em;
}
.pc-pt-filters__select {
  font-family: 'DM Sans', sans-serif;
  font-size: 1.4rem; font-weight: 500; color: #0F172A;
  background-color: #FFFFFF;
  border: 1px solid #E2E8F0;
  border-radius: 8px;
  padding: 0.8rem 3.6rem 0.8rem 1.2rem;
  min-height: 40px; width: 100%;
  cursor: pointer; appearance: none; -webkit-appearance: none;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='%2364748B'><path fill-rule='evenodd' d='M5.293 7.293a1 1 0 011.414 0L10 10.586l3.293-3.293a1 1 0 111.414 1.414l-4 4a1 1 0 01-1.414 0l-4-4a1 1 0 010-1.414z' clip-rule='evenodd'/></svg>");
  background-repeat: no-repeat;
  background-position: right 1.2rem center;
  background-size: 1.6rem;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
.pc-pt-filters__select:hover { border-color: #CDDBFA; }
.pc-pt-filters__select:focus {
  outline: none; border-color: #3B5BDB;
  box-shadow: 0 0 0 3px rgba(59, 91, 219, 0.15);
}

.pc-pt-filters__count {
  font-family: 'DM Sans', sans-serif;
  font-size: 1.3rem; color: #64748B;
  margin: 1.6rem 0.4rem 2.4rem;
  text-align: right;
  font-variant-numeric: tabular-nums;
}
.pc-pt-filters__count [data-filter-count] { font-weight: 700; color: #0F172A; }

/* ========== L3 — Compact row list (NN/g list-view pattern) ========== */
/* Cap the row list at 96rem so rows don't stretch across the full 120rem
   container — keeps the supplier↔price visual span comfortable for scanning. */
.pcp-tariffs__grid-section {
  max-width: 96rem;
  margin-left: auto;
  margin-right: auto;
}

.pc-mini-grid {
  list-style: none; padding: 0; margin: 0;
  display: flex; flex-direction: column; gap: 0.6rem;
}
.pc-mini {
  /* v0.1.19: 4 columns instead of 5 — monthly/annual cost block removed,
     Preț kWh promoted to the prominent right-hand value. Featured rows get
     a slim left "rail" via padding-top + absolute-positioned pill. */
  display: grid;
  grid-template-columns: 4rem minmax(0, 1.5fr) auto 12rem;
  align-items: center;
  column-gap: 2rem;
  background: #FFFFFF;
  border: 1px solid #E2E8F0;
  border-radius: 12px;
  padding: 1.2rem 1.8rem;
  transition: border-color 0.2s ease, box-shadow 0.2s ease, transform 0.15s ease;
  position: relative;
}
.pc-mini:hover {
  border-color: #CDDBFA;
  box-shadow: 0 4px 12px rgba(15, 23, 42, 0.05);
  transform: translateY(-1px);
}
.pc-mini[hidden] { display: none; }
.pc-mini__metrics { display: contents; }

/* ===== "Vezi toate ofertele →" royal-blue text link (v0.1.34) =====
   Previously a pill button (v0.1.0–v0.1.26) then a filled blue button
   (v0.1.26–v0.1.33). Demoted to a clean text link in royal blue with arrow,
   underlines on hover. Strips background/border/padding so it reads as
   editorial copy rather than a "buy now" sales button. */
.pcp-grid-expand {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  margin: 0;
  padding: 0;
  background: transparent;
  border: none;
  font-family: 'DM Sans', sans-serif;
  font-size: 1.5rem;
  font-weight: 600;
  color: var(--color-primary, #3B5BDB);
  text-decoration: none;
  cursor: pointer;
  transition: color 0.15s ease;
}
.pcp-grid-expand:hover,
.pcp-grid-expand:focus-visible {
  color: var(--color-primary, #3B5BDB);
  text-decoration: underline;
  text-decoration-thickness: 1.5px;
  text-underline-offset: 0.35rem;
}
.pcp-grid-expand:focus-visible { outline: 2px solid var(--color-primary, #3B5BDB); outline-offset: 4px; border-radius: 2px; }

.pc-mini__logo {
  grid-column: 1; grid-row: 1 / 3;
  width: 4rem; height: 4rem;
  background: #F8FAFC; border: 1px dashed #E2E8F0; border-radius: 8px;
  display: flex; align-items: center; justify-content: center;
  margin: 0; position: relative; overflow: hidden;
}
.pc-mini__logo:empty::before {
  content: attr(data-supplier);
  font-family: 'DM Sans', sans-serif;
  font-size: 0.8rem; color: #94A3B8;
  text-transform: uppercase; letter-spacing: 0.04em; font-weight: 600;
  padding: 0 0.4rem; text-align: center; line-height: 1.15;
  display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;
}
.pc-mini__logo img { max-width: 100%; max-height: 2.8rem; object-fit: contain; }

.pc-mini__supplier {
  grid-column: 2; grid-row: 1; align-self: end;
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 1.5rem; font-weight: 700; color: #0F172A;
  margin: 0; letter-spacing: -0.005em; line-height: 1.25;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.pc-mini__offer {
  grid-column: 2; grid-row: 2; align-self: start;
  display: flex; align-items: baseline; gap: 0.8rem;
  font-family: 'DM Sans', sans-serif;
  font-size: 1.2rem; color: #64748B;
  margin: 0; line-height: 1.3;
  min-width: 0;
}
.pc-mini__offer-text {
  min-width: 0;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}

/* Trust signal: small link to the official POSF PDF, used in both L2 cards
   and L3 mini rows. Muted by default; brand blue on hover. */
.pc-pdf-link {
  flex-shrink: 0;
  font-family: 'DM Sans', sans-serif;
  font-size: 0.95rem; font-weight: 500;
  color: #94A3B8;
  text-decoration: none;
  letter-spacing: 0.02em;
  white-space: nowrap;
  transition: color 0.15s ease;
}
.pc-pdf-link:hover, .pc-pdf-link:focus-visible {
  color: #3B5BDB; text-decoration: underline;
}
.pc-pdf-link:focus-visible { outline: 2px solid #3B5BDB; outline-offset: 2px; border-radius: 2px; }
.pc-mini__type {
  grid-column: 3; grid-row: 1 / 3; align-self: center; justify-self: start;
  display: inline-block;
  padding: 0.3rem 1rem;
  font-size: 1.05rem; font-weight: 500;
  font-family: 'DM Sans', sans-serif;
  background: #F1F5F9; color: #1E293B;
  border-radius: 100px; white-space: nowrap;
  margin: 0;
}
.pc-mini__type--indexed { background: #FFF7ED; color: #92400E; }

.pc-mini__metric {
  display: flex; flex-direction: column; gap: 0.15rem;
  align-self: center; text-align: right;
}
.pc-mini__metric:nth-child(1) { grid-column: 4; grid-row: 1 / 3; }
.pc-mini__metric:nth-child(2) { grid-column: 5; grid-row: 1 / 3; padding: 0; border: 0; }

.pc-mini__metric-label {
  font-family: 'DM Sans', sans-serif;
  font-size: 0.95rem; color: #94A3B8;
  text-transform: uppercase; letter-spacing: 0.06em; font-weight: 600;
  line-height: 1.2;
}
.pc-mini__metric-value {
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 1.4rem; font-weight: 700; color: #0F172A;
  font-variant-numeric: tabular-nums; line-height: 1.2;
}
.pc-mini__metric-value--big {
  font-size: 2rem; font-weight: 800;
  letter-spacing: -0.02em; margin: 0;
}
.pc-mini__metric--total { padding: 0; border: 0; }
.pc-mini__metric-annual {
  font-family: 'DM Sans', sans-serif;
  font-size: 1rem; color: #94A3B8;
  font-variant-numeric: tabular-nums; line-height: 1.2;
}

/* ========== Footnote ========== */
.pc-pt__footnote {
  display: block; font-size: 1.3rem; font-style: italic;
  color: #94A3B8; max-width: 820px;
  margin: 3.2rem auto 0;
  text-align: center; line-height: 1.6;
}
.pc-pt__footnote strong { color: #64748B; font-weight: 600; font-style: normal; }
.pc-pt__footnote a {
  color: #3B5BDB; text-decoration: underline;
  text-underline-offset: 2px; font-style: normal; font-weight: 600;
}
.pc-pt__footnote a:hover { color: #2840B8; }

/* ========== Responsive ========== */
@media (max-width: 1100px) {
  .pc-mini { grid-template-columns: 4rem minmax(0, 1fr) auto 8rem 10rem; column-gap: 1.6rem; }
}
@media (max-width: 991px) {
  .pc-card { grid-template-columns: 5rem 1fr; grid-template-rows: auto auto; gap: 1.4rem 1.6rem; }
  .pc-card__logo { width: 5rem; height: 5rem; }
  .pc-card__price {
    grid-column: 1 / -1; grid-row: 2;
    padding: 1.4rem 0 0; border-left: none;
    border-top: 1px solid #F1F5F9;
    align-items: stretch; text-align: left; min-width: 0;
    display: grid; grid-template-columns: 1fr auto; grid-template-rows: auto auto;
    align-items: baseline; column-gap: 1.6rem;
  }
  .pc-card__price-label { grid-column: 1; grid-row: 1; }
  .pc-card__price-value { grid-column: 2; grid-row: 1 / span 2; align-self: center; }
  .pc-card__price-annual { grid-column: 1; grid-row: 2; }
  .pc-card__specs { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem 2rem; }
}
@media (max-width: 880px) {
  .pc-mini {
    grid-template-columns: 3.6rem minmax(0, 1fr) auto;
    grid-template-rows: auto auto;
    column-gap: 1.4rem; row-gap: 0.6rem;
    padding: 1.2rem 1.4rem;
  }
  .pc-mini__logo { width: 3.6rem; height: 3.6rem; grid-row: 1 / 3; }
  .pc-mini__supplier { grid-column: 2; grid-row: 1; align-self: center; }
  .pc-mini__offer { display: none; }
  .pc-mini__type { grid-column: 3; grid-row: 1; align-self: center; }
  .pc-mini__metric:nth-child(1) { grid-column: 2; grid-row: 2; text-align: left; align-self: center; flex-direction: row; gap: 0.4rem; align-items: baseline; }
  .pc-mini__metric:nth-child(1) .pc-mini__metric-label::after { content: ':'; }
  .pc-mini__metric:nth-child(2) { grid-column: 3; grid-row: 2; }
}
@media (max-width: 767px) {
  .pc-pt-filters {
    flex-direction: column; align-items: stretch; gap: 1.4rem; padding: 1.4rem 1.6rem;
  }
  .pc-pt-filters__chips {
    width: 100%; overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scroll-snap-type: x mandatory; flex-wrap: nowrap;
  }
  .pc-pt-filters__chip { scroll-snap-align: start; flex-shrink: 0; }
  .pc-pt-filters__field { min-width: 0; width: 100%; }
  .pc-pt-filters__count { text-align: center; }
}
@media (max-width: 640px) {
  .pc-card { padding: 1.8rem 1.6rem; gap: 1.2rem 1.4rem; grid-template-columns: 4rem 1fr; }
  .pc-card__logo { width: 4rem; height: 4rem; }
  .pc-card__specs { grid-template-columns: 1fr; gap: 0.6rem; }
  .pc-card__spec { flex-direction: row; justify-content: space-between; align-items: baseline; }
  .pc-card__spec dt { font-size: 1.05rem; }
  .pc-card__supplier { font-size: 1.8rem; }
  .pc-cards__methodology { margin-top: 3.2rem; font-size: 1.25rem; }
  .pc-cards__head { margin-bottom: 3.2rem; }
}
@media (max-width: 540px) {
  .pc-mini {
    grid-template-columns: 3.2rem 1fr auto;
    grid-template-rows: auto auto;
    column-gap: 1rem; row-gap: 0.6rem;
    padding: 1.2rem 1.4rem;
  }
  .pc-mini__logo { width: 3.2rem; height: 3.2rem; grid-row: 1 / 3; }
  .pc-mini__supplier { grid-column: 2 / 4; grid-row: 1; font-size: 1.35rem; }
  .pc-mini__offer { display: none; }
  .pc-mini__type { grid-column: 2; grid-row: 2; justify-self: start; align-self: center; padding: 0.25rem 0.8rem; font-size: 1rem; }
  .pc-mini__metric:nth-child(1) { display: none; }
  .pc-mini__metric:nth-child(2) { grid-column: 3; grid-row: 2; }
  .pc-mini__metric-value--big { font-size: 1.6rem; }
}

/* =====================================================================
   v0.1.19 — Section header with inline county picker, simplified row
   (price-kWh-only), CTA row, discreet footer, featured-offer treatment
   ===================================================================== */

/* ----- Section title ("Top N oferte casnic pentru județul [picker]") ----- */
.pcp-tariffs__head {
  max-width: 96rem;
  margin: 0 auto 2.4rem;
  padding: 0;
}
.pcp-tariffs__rank-title {
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: clamp(1.8rem, 1.5rem + 0.6vw, 2.4rem);
  font-weight: 700;
  line-height: 1.3;
  color: #0F172A;
  margin: 0;
  letter-spacing: -0.01em;
  /* v0.1.42: switched from `display: inline-flex; flex-wrap: wrap` (which
     made "Top", "10", and "cele mai bune..." each become a separate flex
     item that wrapped to its own line on narrow viewports — produced a
     broken H3 layout on phones). Plain block lets text + span flow as
     normal inline content and wrap word-by-word. */
  display: block;
}
.pcp-tariffs__rank-title [data-filter-count] {
  font-weight: 800;
  color: #3B5BDB;
  font-variant-numeric: tabular-nums;
}

/* ---------------------------------------------------------------------------
   v0.1.25 — "Furnizorii comparați" — recognized-suppliers logo strip
   Standalone section rendered by [pcp-tariffs-suppliers], typically placed
   above the [pcp-tariffs] main table. 10 logos in a uniform 5×2 grid,
   collapses to 2×5 on mobile. Each cell is a calm white card with a soft
   border — no rankings, no per-logo CTA, all suppliers visually equal.
   --------------------------------------------------------------------------- */
/* v0.1.33: full structural parity with the reference section pattern
   inspected via Bricks Bridge + DOM on 2026-05-18.

   Reference: section #brxe-9f9423 "Solutions" on page 1648
     .section-white  → padding: 80px 0 (provided by parent Bricks section
                       on the homepage — DON'T duplicate here)
     .container      → max-width: 1200px, padding: 0 32px,
                       display: flex, flex-direction: column,
                       align-items: center, text-align: center,
                       gap: 20px (this is the missing piece from v0.1.32!)
     children:
       eyebrow .eyebrow         margin-bottom: 16px
       H2       .h2-section     margin-bottom: 20px, max-width: 800px
       subhead  .body-md        margin-bottom: 32px, max-width: 560px

   The 20px flex gap + per-element mb STACK, so rendered gaps are:
     H2 → subhead   = 20px mb + 20px gap = 40px
     subhead → grid = 32px mb + 20px gap = 52px

   The plugin's outer <section.pcp-suppliers-strip> becomes BOTH the
   .section-white shell AND the .container — but with padding: 0 vertically
   so the parent Bricks section's 80px doesn't double up. */
.pcp-suppliers-strip {
  max-width: 120rem;
  margin: 0 auto;
  padding: 0 3.2rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 2rem;
}
.pcp-suppliers-strip__title {
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: var(--text-h2-section, clamp(2.8rem, 2.4rem + 1.2vw, 4.2rem));
  font-weight: 800;
  line-height: 1.18;
  letter-spacing: -0.02em;
  color: var(--color-ink, #0F172A);
  margin: 0 0 2rem;
  max-width: 80rem;
  width: 100%;
}
.pcp-suppliers-strip__subtitle {
  font-family: 'DM Sans', sans-serif;
  font-size: var(--text-body-md, clamp(1.6rem, 1.55rem + 0.2vw, 1.8rem));
  font-weight: 400;
  line-height: 1.65;
  color: var(--color-dark-muted, #64748B);
  margin: 0 0 3.2rem;
  max-width: 56rem;
  width: 100%;
}
/* Defensive mobile override — mirrors the !important pattern Bricks uses
   on the reference H2 (#brxe-b77707) to defeat any theme cascade on small
   screens. */
@media (max-width: 767px) {
  .pcp-suppliers-strip {
    padding: 0 1.6rem;
    gap: 1.6rem;
  }
  .pcp-suppliers-strip__title {
    font-size: 2.8rem;
    line-height: 1.2;
    max-width: 100%;
  }
  .pcp-suppliers-strip__subtitle {
    max-width: 100%;
  }
}
.pcp-suppliers-strip__grid {
  list-style: none;
  margin: 0; padding: 0;
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 1.2rem;
  /* v0.1.33: grid is a flex child of .pcp-suppliers-strip; needs explicit
     full width so the 5-col layout spans the 1200px container. */
  width: 100%;
}
.pcp-suppliers-strip__item { margin: 0; }
.pcp-suppliers-strip__logo {
  background: #FFFFFF;
  border: 1px solid #E2E8F0;
  border-radius: 12px;
  padding: 1.6rem 1.4rem;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 8.4rem;
  /* v0.1.26: soft resting shadow lifts cards off the page bg (which is also
     white) without looking heavy. Stronger shadow on hover for affordance. */
  box-shadow: 0 1px 3px rgba(15, 23, 42, 0.04);
  transition: border-color 0.15s ease, box-shadow 0.2s ease, transform 0.15s ease;
}
.pcp-suppliers-strip__logo:hover {
  border-color: #CDDBFA;
  box-shadow: 0 4px 12px rgba(15, 23, 42, 0.08);
  transform: translateY(-1px);
}
/* v0.1.26: logo normalization — every logo lives inside a 32px-tall visual
   envelope so wide wordmarks (PPC, DIGI, ENGIE, ELECTRICA, OMV) don't
   overpower square icons (Hidroelectrica, TINMAR, NOVA). Brand colors kept
   intact — Maria needs the red Electrica / blue ENGIE / orange OMV visual
   anchors to recognise her current supplier at a glance. */
.pcp-suppliers-strip__logo img {
  max-width: 80%;
  max-height: 3.2rem;
  object-fit: contain;
  display: block;
}
.pcp-suppliers-strip__name-fallback {
  font-family: 'DM Sans', sans-serif;
  font-size: 1.1rem;
  font-weight: 600;
  color: #64748B;
  text-align: center;
  letter-spacing: 0.02em;
}

/* v0.1.30: small disclaimer line below the 2-row grid, right-aligned on
   desktop. Honest scope signal ("10 of 54") — muted, italic, low-weight so
   it doesn't compete with the H2 above or the comparator section below.
   v0.1.33: width:100% so right-align works inside the centered flex column. */
.pcp-suppliers-strip__disclaimer {
  font-family: 'DM Sans', sans-serif;
  font-size: 0.95rem;
  font-style: italic;
  color: #94A3B8;
  text-align: right;
  margin: 0;
  line-height: 1.4;
  letter-spacing: 0.01em;
  width: 100%;
}

@media (max-width: 991px) {
  .pcp-suppliers-strip__logo { height: 7.2rem; padding: 1.2rem; }
  .pcp-suppliers-strip__logo img { max-height: 3.6rem; }
}
@media (max-width: 640px) {
  .pcp-suppliers-strip__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.8rem;
  }
  .pcp-suppliers-strip__logo { height: 7.2rem; padding: 1rem 0.8rem; }
  .pcp-suppliers-strip__logo img { max-height: 3.6rem; }
  /* v0.1.30: centre the disclaimer on mobile (right-align reads as cramped
     against narrow viewports). */
  .pcp-suppliers-strip__disclaimer { text-align: center; font-size: 0.9rem; }
}

/* ---------------------------------------------------------------------------
   v0.1.24 — Heading + county picker on the same row.
   Picker reverts to the v0.1.10 styled <select>: bordered rectangle, chevron
   icon, native browser dropdown on click. The native dropdown is what
   provincial users (Maria persona) recognise from every other web form.
   --------------------------------------------------------------------------- */

.pcp-tariffs__head {
  max-width: 96rem;
  margin: 0 auto 2.4rem;
  display: flex;
  flex-direction: row;
  align-items: flex-end;
  justify-content: space-between;
  gap: 1.6rem 2.4rem;
  flex-wrap: wrap;
}
.pcp-tariffs__head .pcp-tariffs__rank-title {
  flex: 1 1 28rem;
  min-width: 0;
  margin: 0;
}

/* Picker container — label above the select, label group sits inline with title */
.pcp-tariffs__county-picker {
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
  flex: 0 0 auto;
  min-width: 22rem;
}
.pcp-tariffs__county-label {
  font-family: 'DM Sans', sans-serif;
  font-size: 1rem;
  font-weight: 700;
  color: #64748B;
  text-transform: uppercase;
  letter-spacing: 0.1em;
}

/* The select itself — same visual language as the v0.1.10 filter dropdown */
.pcp-tariffs__county-picker .pcp-tariffs__county-select {
  font-family: 'DM Sans', sans-serif;
  font-size: 1.4rem;
  font-weight: 500;
  color: #0F172A;
  background-color: #FFFFFF;
  border: 1px solid #E2E8F0;
  border-radius: 8px;
  padding: 0.8rem 3.6rem 0.8rem 1.2rem;
  min-height: 40px;
  width: 100%;
  cursor: pointer;
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='%2364748B'><path fill-rule='evenodd' d='M5.293 7.293a1 1 0 011.414 0L10 10.586l3.293-3.293a1 1 0 111.414 1.414l-4 4a1 1 0 01-1.414 0l-4-4a1 1 0 010-1.414z' clip-rule='evenodd'/></svg>");
  background-repeat: no-repeat;
  background-position: right 1.2rem center;
  background-size: 1.4rem 1.4rem;
  box-shadow: none;
}
.pcp-tariffs__county-picker .pcp-tariffs__county-select:hover {
  border-color: #CDDBFA;
}
.pcp-tariffs__county-picker .pcp-tariffs__county-select:focus {
  outline: none;
  border-color: #3B5BDB;
  box-shadow: 0 0 0 3px rgba(59, 91, 219, 0.15);
}
.pcp-tariffs__county-picker .pcp-tariffs__county-select option {
  color: #0F172A;
  background-color: #FFFFFF;
  font-weight: 400;
}

/* Mobile: stack heading + picker, picker fills width */
@media (max-width: 767px) {
  .pcp-tariffs__head {
    flex-direction: column;
    align-items: stretch;
    /* v0.1.44: kill space-between distribution that was inheriting from
       desktop and stretching the column to fill any extra height. */
    justify-content: flex-start;
  }
  .pcp-tariffs__head .pcp-tariffs__rank-title {
    /* v0.1.44: BUG FIX — desktop rule sets `flex: 1 1 28rem` which means
       flex-basis: 28rem (= 280px). On desktop column-direction this is
       a min-WIDTH. But mobile flips flex-direction to column, so
       flex-basis becomes a min-HEIGHT — the H3 stretched to 280px tall
       on phone, producing a huge empty gap between heading and picker. */
    flex: 0 0 auto;
    flex-basis: auto;
  }
  .pcp-tariffs__county-picker {
    min-width: 0;
    width: 100%;
  }
}

/* ----- Featured row + CORNER pill (v0.1.27, reverted from v0.1.26 inline) ----- */
/* v0.1.26 tried an inline pill next to the supplier name; with long supplier
   strings like "PPC Energie S.A." the tail "PPC Energie S.A. Oferta Pretcurent"
   read as one run-on chunk. Reverting to the corner-absolute pill anchored to
   the row's top-left — the editorial signal is separated cleanly from the
   supplier identity. White card kept (no soft tint), strong blue border. */
.pc-mini--featured {
  border: 2px solid #3B5BDB;
  padding-top: 1.6rem;
}
.pc-mini--featured:hover {
  border-color: #3B5BDB;
  box-shadow: 0 4px 12px rgba(59, 91, 219, 0.12);
}
.pc-mini__featured-pill {
  position: absolute;
  top: -0.95rem;
  left: 1.6rem;
  display: inline-flex;
  align-items: center;
  padding: 0.25rem 0.8rem;
  background: #3B5BDB;
  color: #FFFFFF;
  font-family: 'DM Sans', sans-serif;
  font-size: 0.975rem; /* v0.1.29: +2px from 0.85rem for legibility */
  font-weight: 600;
  letter-spacing: 0.02em;
  border-radius: 100px;
  line-height: 1.3;
  white-space: nowrap;
  z-index: 1;
}

/* ----- Price column (Preț kWh, prominent) ----- */
.pc-mini__price {
  grid-column: 4; grid-row: 1 / 3;
  align-self: center; justify-self: end;
  display: flex; flex-direction: column; align-items: flex-end;
  gap: 0.3rem;
  font-family: 'Plus Jakarta Sans', sans-serif;
}
/* v0.1.26: legibility bump for Maria-persona eyes. Sentence-case "Preț kWh"
   instead of tiny gray UPPERCASE — easier to read at a glance. */
.pc-mini__price-label {
  font-family: 'DM Sans', sans-serif;
  font-size: 1.15rem; font-weight: 600;
  color: #64748B;
  letter-spacing: 0;
  line-height: 1.1;
  text-transform: none;
}
.pc-mini__price-label::first-letter { text-transform: uppercase; }
.pc-mini__price-value {
  font-size: 2.8rem;
  font-weight: 800;
  color: #0F172A;
  font-variant-numeric: tabular-nums;
  line-height: 1;
  letter-spacing: -0.015em;
}
.pc-mini__price-unit {
  font-size: 1.3rem;
  font-weight: 600;
  color: #475569;
  margin-left: 0.2rem;
  letter-spacing: 0;
}

/* ----- Bottom-right disclaimer (v0.1.34 → v0.1.35 placement) -----
   v0.1.35: disclaimer is rendered BEFORE the CTA — it now sits directly
   below the last offer card, right-aligned, and the CTA link sits below
   the disclaimer. So the reading order is cards → source → "see all". */
.pc-pt__disclaimer {
  max-width: 96rem;
  margin: 1.2rem auto 0;
  padding: 0 0.4rem;
  font-family: 'DM Sans', sans-serif;
  font-size: 1.2rem;
  font-style: italic;
  color: #94A3B8;
  text-align: right;
  line-height: 1.5;
}

/* ----- "Cere ofertă personalizată →" CTA — matches #brxe-die9w2 (v0.1.40) -----
   Replicates the canonical Pretcurent primary button from the homepage hero
   (#brxe-die9w2, .btn-primary + custom CSS). Same:
     - font          : DM Sans 600 · var(--text-button) · letter-spacing 0.01em
     - color         : var(--color-white)
     - background    : var(--color-primary) #3B5BDB
     - hover bg      : #2840B8 (die9w2's exact override)
     - padding       : 0.7rem 2rem (tight pill from .btn-primary)
     - border-radius : 8px (NOT pill — die9w2 uses 8px square-ish corners)
     - display       : inline-flex with 0.8rem gap to arrow
   Centered horizontally below the disclaimer at the end of the comparator
   section. */
.pc-pt__personalized-cta {
  max-width: 96rem;
  margin: 3.6rem auto 0;
  display: flex;
  justify-content: center;
}
.pc-pt__personalized-cta-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.8rem;
  padding: 0.7rem 2rem;
  min-height: 48px; /* v0.1.41: matches theme-global rule on .btn-primary / a.brxe-text-link[href*="formular"] which die9w2 inherits; without this my button collapses to padding+line-height=42px */
  background: var(--color-primary, #3B5BDB);
  color: var(--color-white, #FFFFFF);
  font-family: 'DM Sans', sans-serif;
  font-size: var(--text-button, 1.5rem);
  font-weight: 600;
  letter-spacing: 0.01em;
  text-decoration: none;
  border: none;
  border-radius: 8px;
  cursor: pointer;
  width: fit-content;
  transition: all 0.15s ease;
}
.pc-pt__personalized-cta-btn:hover,
.pc-pt__personalized-cta-btn:focus {
  background: #2840B8;
  color: var(--color-white, #FFFFFF);
  text-decoration: none;
}
.pc-pt__personalized-cta-btn:focus-visible {
  outline: 2px solid var(--color-primary, #3B5BDB);
  outline-offset: 4px;
}
.pc-pt__personalized-cta-arrow {
  line-height: 1;
}
@media (max-width: 640px) {
  .pc-pt__personalized-cta { margin-top: 2.8rem; padding: 0 2rem; }
  .pc-pt__personalized-cta-btn { width: 100%; justify-content: center; }
}

/* ----- CTA row — single centred text link (v0.1.34, kept for back-compat) -----
   Not rendered as of v0.1.36 (render_cta_row() is not called). Styles kept
   so re-enabling the "Vezi toate ofertele →" link is a one-line PHP change. */
.pcp-tariffs__cta-row {
  max-width: 96rem;
  margin: 2.8rem auto 0;
  display: flex;
  justify-content: center;
  align-items: center;
}
.pc-pt__disclaimer a {
  color: inherit;
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 0.2rem;
}
.pc-pt__disclaimer a:hover { color: var(--color-dark-muted, #64748B); }

@media (max-width: 640px) {
  .pc-pt__disclaimer { text-align: center; font-size: 1.15rem; }
}

/* ----- Mobile tweaks for v0.1.19 additions ----- */
@media (max-width: 991px) {
  .pc-mini { grid-template-columns: 3.6rem minmax(0, 1.4fr) auto 10rem; column-gap: 1.4rem; }
  .pc-mini__price-value { font-size: 2.4rem; }
}
@media (max-width: 767px) {
  .pcp-tariffs__rank-title { font-size: 1.7rem; }
}
@media (max-width: 540px) {
  /* Re-target the mobile collapse of metrics to the new __price slot */
  .pc-mini__price {
    grid-column: 3; grid-row: 2;
    justify-self: end; align-self: center;
    flex-direction: row; align-items: baseline; gap: 0.4rem;
  }
  .pc-mini__price-label { display: none; }
  .pc-mini__price-value { font-size: 1.8rem; }
  .pc-mini__price-unit { font-size: 1.1rem; }
  .pc-mini__featured-pill { font-size: 0.875rem; padding: 0.2rem 0.65rem; top: -0.8rem; left: 1.2rem; } /* v0.1.29: +2px on mobile too */
  .pc-mini--featured { padding-top: 1.4rem; }
}

/* =====================================================================
   v0.1.42–v0.1.43 — mobile polish pass
   Targets the ~390px iPhone-class viewports flagged by the user. Fixes:
   - SUPPLIER STRIP H2 + subhead — sized down explicitly for phone so the
     long Romanian copy doesn't wrap to 4 stacked lines (v0.1.43 fix)
   - tighter section gutters (16px instead of 24-32px wasted whitespace)
   - rank-title centered + line-height tightened for the longer copy
   - county picker reads as a regular full-width form input
   - smaller card padding so 4-col grid doesn't crush content
   - supplier strip 2-col logo grid spacing tightened
   - section margin/padding compaction
   ===================================================================== */
@media (max-width: 540px) {
  /* SUPPLIER STRIP — the biggest mobile offender. Defaults to a clamp()
     that still resolves to ~28px on phone, which makes the long copy
     "Compară ofertele celor mai importanți furnizori de electricitate"
     wrap to 4 stacked lines and dominate the viewport before users even
     see the logos. Pinning to 2.2rem (22px) keeps it readable + compact. */
  .pcp-suppliers-strip {
    padding: 0 1.6rem;
    gap: 1.6rem;
  }
  .pcp-suppliers-strip__title {
    font-size: 2.2rem;
    line-height: 1.2;
    max-width: 100%;
  }
  .pcp-suppliers-strip__subtitle {
    font-size: 1.4rem;
    line-height: 1.5;
    max-width: 100%;
  }
  .pcp-suppliers-strip__disclaimer {
    text-align: center;
    font-size: 1.05rem;
  }

  /* Outer plugin block — phones need narrow horizontal gutters.
     v0.1.45: 3.2rem (32px) top margin gives the comparator breathing room
     below the supplier strip disclaimer "Prezentare a 10 din cei 54...". */
  .pcp-tariffs {
    padding: 0 0.4rem;
    margin-top: 3.2rem;
  }

  /* Heading + picker layout.
     v0.1.45: gap bumped 0.8rem → 2rem so the H3 "Top 10 cele mai bune..."
     no longer crashes into the "PREȚURI PENTRU" label on mobile. */
  .pcp-tariffs__head {
    margin: 0 auto 1.6rem;
    padding: 0;
    gap: 2rem;
  }
  .pcp-tariffs__rank-title {
    font-size: 1.8rem;
    line-height: 1.25;
    text-align: center;
  }
  .pcp-tariffs__county-picker {
    width: 100%;
  }
  .pcp-tariffs__county-label {
    text-align: center;
  }

  /* Mini cards — tighter padding so 4-col grid doesn't feel cramped */
  .pc-mini {
    padding: 1rem 1.2rem;
    border-radius: 10px;
    column-gap: 1rem;
    grid-template-columns: 3.2rem minmax(0, 1fr) auto auto;
  }
  .pc-mini__logo {
    width: 3.2rem; height: 3.2rem;
  }
  .pc-mini__supplier {
    font-size: 1.3rem;
    line-height: 1.25;
  }
  .pc-mini__offer-text {
    font-size: 1.15rem;
  }
  .pc-mini__type {
    font-size: 1.05rem;
    padding: 0.2rem 0.7rem;
  }

  /* Disclaimer — slightly larger so it's still readable on phone */
  .pc-pt__disclaimer {
    margin-top: 1.2rem;
    font-size: 1.1rem;
    padding: 0 0.4rem;
    text-align: center;
  }

  /* CTA button — full-width on phone for thumb-friendly tap */
  .pc-pt__personalized-cta { margin-top: 2.4rem; padding: 0 1.6rem; }
  .pc-pt__personalized-cta-btn {
    width: 100%;
    justify-content: center;
  }
}

/* Extra-narrow phones (<= 380px — older iPhones, Galaxy S phones) */
@media (max-width: 380px) {
  .pcp-tariffs__rank-title { font-size: 1.6rem; }
  .pcp-suppliers-strip__title { font-size: 2rem; }
  .pcp-suppliers-strip__subtitle { font-size: 1.35rem; }
  .pc-mini { padding: 0.8rem 1rem; column-gap: 0.8rem; }
}

/* =====================================================================
   v0.1.48 — /toate-ofertele-energie-electrica/ all-offers page
   ---------------------------------------------------------------------
   Pure information-republication surface. Dense data table, neutral
   filter bar, no commercial differentiation. Aligns with Pretcurent
   design DNA: --color-primary #3B5BDB, --color-ink #0F172A, Plus
   Jakarta Sans (headings) + DM Sans (body), --pc-blue-* accents.
   ===================================================================== */
.pcp-all-offers {
  max-width: 120rem;
  margin: 0 auto;
  padding: 0 1.6rem;
  font-family: 'DM Sans', sans-serif;
  color: var(--color-ink, #0F172A);
}

/* ----- Methodology block ----- */
.pcp-all-offers__methodology {
  background: var(--color-callout-info-bg, #F0F9FF);
  border-left: 3px solid var(--color-callout-info-border, #BAE6FD);
  border-radius: 8px;
  padding: 1.6rem 2rem;
  margin: 0 0 3.2rem;
  font-size: 1.45rem;
  line-height: 1.6;
  color: var(--color-ink, #0F172A);
}
.pcp-all-offers__methodology strong {
  color: var(--color-primary, #3B5BDB);
  font-weight: 700;
}
.pcp-all-offers__methodology a {
  color: var(--color-primary, #3B5BDB);
  text-decoration: underline;
  text-underline-offset: 2px;
}

/* ----- Filter bar ----- */
.pcp-all-offers__filters {
  display: flex;
  flex-wrap: wrap;
  gap: 1.2rem 1.6rem;
  align-items: flex-end;
  padding: 2rem 2.4rem;
  margin: 0 0 2rem;
  background: var(--pc-gray-50, #F8FAFC);
  border: 1px solid var(--pc-gray-200, #E2E8F0);
  border-radius: 12px;
}
.pcp-all-offers__filter {
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
  flex: 1 1 18rem;
  min-width: 0;
}
.pcp-all-offers__filter-label {
  font-family: 'DM Sans', sans-serif;
  font-size: 1.1rem;
  font-weight: 700;
  color: var(--color-dark-muted, #64748B);
  text-transform: uppercase;
  letter-spacing: 0.08em;
}
.pcp-all-offers__select {
  font-family: 'DM Sans', sans-serif;
  font-size: 1.4rem;
  font-weight: 500;
  color: var(--color-ink, #0F172A);
  background-color: #FFFFFF;
  border: 1px solid var(--pc-gray-200, #E2E8F0);
  border-radius: 8px;
  padding: 0.9rem 3.4rem 0.9rem 1.2rem;
  min-height: 44px;
  width: 100%;
  cursor: pointer;
  appearance: none;
  -webkit-appearance: none;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='%2364748B'><path fill-rule='evenodd' d='M5.293 7.293a1 1 0 011.414 0L10 10.586l3.293-3.293a1 1 0 111.414 1.414l-4 4a1 1 0 01-1.414 0l-4-4a1 1 0 010-1.414z' clip-rule='evenodd'/></svg>");
  background-repeat: no-repeat;
  background-position: right 1.2rem center;
  background-size: 1.4rem;
}
.pcp-all-offers__select:hover { border-color: var(--pc-blue-300, #CDDBFA); }
.pcp-all-offers__select:focus {
  outline: none;
  border-color: var(--color-primary, #3B5BDB);
  box-shadow: 0 0 0 3px rgba(59, 91, 219, 0.15);
}
.pcp-all-offers__filter-actions {
  display: flex;
  gap: 0.8rem;
  align-items: center;
  flex: 0 0 auto;
}
.pcp-all-offers__submit {
  background: var(--color-primary, #3B5BDB);
  color: #FFFFFF;
  font-family: 'DM Sans', sans-serif;
  font-size: var(--text-button, 1.5rem);
  font-weight: 600;
  letter-spacing: 0.01em;
  border: none;
  border-radius: 8px;
  padding: 1rem 2rem;
  min-height: 44px;
  cursor: pointer;
  transition: background 0.15s ease;
}
.pcp-all-offers__submit:hover { background: #2840B8; }
.pcp-all-offers__reset {
  color: var(--color-dark-muted, #64748B);
  font-size: 1.35rem;
  font-weight: 500;
  text-decoration: underline;
  text-underline-offset: 3px;
}
.pcp-all-offers__reset:hover { color: var(--color-ink, #0F172A); }

/* ===================================================================
   v0.1.52 — Personalized consumption control (slider + number input)
   ----------------------------------------------------------------
   Bound number + slider, live updates all card monthly/annual estimates.
   Mobile-first: full-width, large thumb for touch (44px hit area),
   accessible (proper labels, aria-valuenow updated via JS).
   =================================================================== */
.pcp-consum-control {
  margin: 2rem 0;
  padding: 2rem 1.6rem;
  background: var(--pc-gray-50, #F8FAFC);
  border: 1px solid var(--pc-gray-200, #E2E8F0);
  border-radius: 12px;
}
.pcp-consum-control__head {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  margin-bottom: 1.6rem;
}
.pcp-consum-control__label {
  font-family: 'DM Sans', sans-serif;
  font-size: 1.45rem;
  line-height: 1.4;
  color: var(--color-ink, #0F172A);
}
.pcp-consum-control__label strong { font-weight: 700; }
.pcp-consum-control__hint {
  display: block;
  font-weight: 400;
  color: var(--color-dark-muted, #64748B);
  font-size: 1.3rem;
  margin-top: 0.2rem;
}
.pcp-consum-control__value-wrap {
  display: inline-flex;
  align-items: center;
  gap: 0.6rem;
}
.pcp-consum-control__number {
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 2rem;
  font-weight: 700;
  color: var(--color-primary, #3B5BDB);
  background: #FFFFFF;
  border: 1px solid var(--pc-gray-200, #E2E8F0);
  border-radius: 8px;
  padding: 0.6rem 1rem;
  width: 9rem;
  text-align: center;
  -moz-appearance: textfield;
}
.pcp-consum-control__number::-webkit-outer-spin-button,
.pcp-consum-control__number::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
.pcp-consum-control__number:focus {
  outline: none;
  border-color: var(--color-primary, #3B5BDB);
  box-shadow: 0 0 0 3px rgba(59, 91, 219, 0.15);
}
.pcp-consum-control__unit {
  font-family: 'DM Sans', sans-serif;
  font-size: 1.4rem;
  font-weight: 600;
  color: var(--color-dark-muted, #64748B);
}

/* Range slider — cross-browser styled. Mobile-first 24px thumb (≥44px hit) */
.pcp-consum-control__slider {
  -webkit-appearance: none;
  appearance: none;
  width: 100%;
  height: 6px;
  background: var(--pc-gray-200, #E2E8F0);
  border-radius: 999px;
  outline: none;
  margin: 0;
  cursor: pointer;
  touch-action: pan-y;
}
.pcp-consum-control__slider::-webkit-slider-runnable-track {
  height: 6px;
  background: linear-gradient(to right, var(--color-primary, #3B5BDB) 0%, var(--color-primary, #3B5BDB) var(--pcp-fill, 16%), var(--pc-gray-200, #E2E8F0) var(--pcp-fill, 16%), var(--pc-gray-200, #E2E8F0) 100%);
  border-radius: 999px;
}
.pcp-consum-control__slider::-webkit-slider-thumb {
  -webkit-appearance: none;
  width: 28px;
  height: 28px;
  background: #FFFFFF;
  border: 3px solid var(--color-primary, #3B5BDB);
  border-radius: 50%;
  margin-top: -11px;
  cursor: grab;
  box-shadow: 0 2px 6px rgba(15, 23, 42, 0.15);
  transition: transform 0.1s ease, box-shadow 0.15s ease;
}
.pcp-consum-control__slider::-webkit-slider-thumb:hover { transform: scale(1.1); }
.pcp-consum-control__slider:active::-webkit-slider-thumb { cursor: grabbing; transform: scale(1.15); box-shadow: 0 4px 12px rgba(59, 91, 219, 0.3); }
.pcp-consum-control__slider::-moz-range-track {
  height: 6px;
  background: var(--pc-gray-200, #E2E8F0);
  border-radius: 999px;
}
.pcp-consum-control__slider::-moz-range-progress {
  height: 6px;
  background: var(--color-primary, #3B5BDB);
  border-radius: 999px;
}
.pcp-consum-control__slider::-moz-range-thumb {
  width: 28px;
  height: 28px;
  background: #FFFFFF;
  border: 3px solid var(--color-primary, #3B5BDB);
  border-radius: 50%;
  cursor: grab;
  box-shadow: 0 2px 6px rgba(15, 23, 42, 0.15);
}
.pcp-consum-control__slider:focus-visible { box-shadow: 0 0 0 3px rgba(59, 91, 219, 0.25); }
.pcp-consum-control__scale {
  display: flex;
  justify-content: space-between;
  margin-top: 0.8rem;
  font-family: 'DM Sans', sans-serif;
  font-size: 1.1rem;
  color: var(--color-dark-muted, #94A3B8);
}

@media (min-width: 641px) {
  .pcp-consum-control { padding: 2.4rem 2.4rem; }
  .pcp-consum-control__head {
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    gap: 2rem;
  }
  .pcp-consum-control__label { flex: 1 1 auto; font-size: 1.5rem; }
  .pcp-consum-control__value-wrap { flex: 0 0 auto; }
}

@media (prefers-reduced-motion: reduce) {
  .pcp-consum-control__slider::-webkit-slider-thumb { transition: none; }
  .pcp-consum-control__slider::-webkit-slider-thumb:hover,
  .pcp-consum-control__slider:active::-webkit-slider-thumb { transform: none; }
}

/* ===================================================================
   v0.1.52 — Prosumer callout (audience: Ion, 8% highest-LTV)
   ----------------------------------------------------------------
   Uses --color-callout-info-bg/border for friendly info treatment.
   SVG sun icon (currentColor) matches brand primary. Routes to /suna.
   =================================================================== */
.pcp-prosumer-callout {
  display: flex;
  gap: 1.4rem;
  align-items: flex-start;
  margin: 2rem 0;
  padding: 1.8rem 1.6rem;
  background: var(--color-callout-info-bg, #F0F9FF);
  border: 1px solid var(--color-callout-info-border, #BAE6FD);
  border-radius: 12px;
}
.pcp-prosumer-callout__icon {
  flex: 0 0 auto;
  width: 4.4rem;
  height: 4.4rem;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #FFFFFF;
  border-radius: 50%;
  color: #D97706;
  border: 1px solid var(--color-callout-info-border, #BAE6FD);
}
.pcp-prosumer-callout__body { flex: 1 1 auto; min-width: 0; }
.pcp-prosumer-callout__title {
  margin: 0 0 0.4rem;
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 1.5rem;
  font-weight: 700;
  color: var(--color-ink, #0F172A);
  line-height: 1.3;
}
.pcp-prosumer-callout__text {
  margin: 0;
  font-family: 'DM Sans', sans-serif;
  font-size: 1.35rem;
  line-height: 1.55;
  color: var(--color-ink, #0F172A);
}
.pcp-prosumer-callout__link {
  color: var(--color-primary, #3B5BDB);
  font-weight: 600;
  text-decoration: underline;
  text-underline-offset: 3px;
  white-space: nowrap;
}
.pcp-prosumer-callout__link:hover { color: #2840B8; }

@media (min-width: 641px) {
  .pcp-prosumer-callout { padding: 2rem 2.4rem; gap: 1.8rem; }
  .pcp-prosumer-callout__title { font-size: 1.6rem; }
  .pcp-prosumer-callout__text { font-size: 1.45rem; }
}

/* ===================================================================
   v0.1.52 — Hide "Aplică filtre" button when JS is enabled.
   ----------------------------------------------------------------
   With auto-apply on select change, the manual submit becomes redundant
   noise per Andreea's persona feedback. Falls back gracefully if JS off.
   =================================================================== */
.js-enabled .pcp-all-offers__submit { display: none; }
/* Without JS, the button stays for graceful degradation */

/* ----- Cards wrapper (v0.1.50) ----- */
.pcp-all-offers__cards-wrap { margin: 0 0 2rem; }
.pcp-all-offers__zone-note {
  margin: 0 0 2rem;
  font-family: 'DM Sans', sans-serif;
  font-size: 1.3rem;
  line-height: 1.55;
  color: var(--color-dark-muted, #64748B);
  text-align: center;
}
.pcp-all-offers__zone-note strong { color: var(--color-ink, #0F172A); font-weight: 700; }
.pcp-all-offers__zone-note a {
  color: var(--color-primary, #3B5BDB);
  text-decoration: underline;
  text-underline-offset: 2px;
}

/* ----- Vertical offer card grid (v0.1.50) -----
   Audience-driven design: 8 data points surfaced per card so Maria & Gheorghe
   (provincial couple, 56% of leads) get every signal they need WITHOUT having
   to open the PDF. Predictability (tip + termen), concrete cost (lei/lună and
   lei/an, not just kWh), trust (zonă, % regen, cod ofertă), verification (PDF).
   Grid: 3-col desktop / 2-col tablet / 1-col mobile. All cards identical. */
.pcp-offer-grid {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 2rem;
}
.pcp-offer-card {
  display: flex;
  flex-direction: column;
  gap: 1.6rem;
  background: #FFFFFF;
  border: 1px solid var(--pc-gray-200, #E2E8F0);
  border-radius: 16px;
  padding: 2.4rem 2.4rem 2rem;
  box-shadow: 0 1px 3px rgba(15, 23, 42, 0.04);
  transition: border-color 0.2s ease, box-shadow 0.2s ease, transform 0.15s ease;
  position: relative;
  overflow: hidden;
}
.pcp-offer-card:hover {
  border-color: var(--pc-blue-300, #CDDBFA);
  box-shadow: 0 6px 18px rgba(15, 23, 42, 0.08);
  transform: translateY(-2px);
}

/* Header: logo + supplier/offer name */
.pcp-offer-card__head {
  display: flex;
  align-items: center;
  gap: 1.4rem;
  padding-bottom: 1.4rem;
  border-bottom: 1px solid var(--pc-gray-150, #F1F5F9);
}
.pcp-offer-card__logo {
  flex: 0 0 6.4rem;
  width: 6.4rem;
  height: 6.4rem;
  background: #FFFFFF;
  border: 1px solid var(--pc-gray-200, #E2E8F0);
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0.6rem;
}
.pcp-offer-card__logo img {
  max-width: 100%;
  max-height: 4rem;
  object-fit: contain;
  display: block;
}
.pcp-offer-card__logo-fallback {
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 1.8rem;
  font-weight: 800;
  color: var(--color-primary, #3B5BDB);
  text-transform: uppercase;
  letter-spacing: 0.05em;
}
.pcp-offer-card__brand { min-width: 0; flex: 1; }
.pcp-offer-card__supplier {
  margin: 0 0 0.3rem;
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 1.55rem;
  font-weight: 700;
  line-height: 1.25;
  color: var(--color-ink, #0F172A);
  letter-spacing: -0.005em;
  /* Truncate very long supplier names cleanly */
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.pcp-offer-card__offer-name {
  margin: 0;
  font-family: 'DM Sans', sans-serif;
  font-size: 1.25rem;
  line-height: 1.4;
  color: var(--color-dark-muted, #64748B);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* Price block: headline kWh + concrete monthly/annual */
.pcp-offer-card__price {
  display: flex;
  flex-direction: column;
  gap: 1.2rem;
  padding-bottom: 1.4rem;
  border-bottom: 1px solid var(--pc-gray-150, #F1F5F9);
}
.pcp-offer-card__price-headline {
  display: flex;
  align-items: baseline;
  gap: 0.6rem;
}
.pcp-offer-card__price-num {
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 3.6rem;
  font-weight: 800;
  line-height: 1;
  color: var(--color-ink, #0F172A);
  letter-spacing: -0.02em;
  font-variant-numeric: tabular-nums;
}
.pcp-offer-card__price-unit {
  font-family: 'DM Sans', sans-serif;
  font-size: 1.5rem;
  font-weight: 600;
  color: var(--color-dark-muted, #64748B);
  letter-spacing: 0;
}
.pcp-offer-card__price-est {
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
  margin: 0;
  font-family: 'DM Sans', sans-serif;
}
.pcp-offer-card__price-est > div {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 1rem;
}
.pcp-offer-card__price-est dt {
  font-size: 1.25rem;
  color: var(--color-dark-muted, #64748B);
  font-weight: 500;
}
.pcp-offer-card__price-est dd {
  margin: 0;
  font-size: 1.4rem;
  color: var(--color-ink, #0F172A);
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}

/* Specs block — predictability + trust signals */
.pcp-offer-card__specs {
  display: flex;
  flex-direction: column;
  gap: 0.6rem;
  margin: 0;
  font-family: 'DM Sans', sans-serif;
}
.pcp-offer-card__specs > div {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 1.2rem;
  font-size: 1.25rem;
  line-height: 1.4;
}
.pcp-offer-card__specs dt {
  color: var(--color-dark-muted, #64748B);
  font-weight: 500;
}
.pcp-offer-card__specs dd {
  margin: 0;
  color: var(--color-ink, #0F172A);
  font-weight: 600;
  text-align: right;
  word-break: break-word;
}

/* Footer — PDF link only (verification, not commercial) */
.pcp-offer-card__foot {
  margin-top: auto;
  padding-top: 1.2rem;
  border-top: 1px solid var(--pc-gray-150, #F1F5F9);
}
.pcp-offer-card__pdf {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  font-family: 'DM Sans', sans-serif;
  font-size: 1.25rem;
  font-weight: 600;
  color: var(--color-primary, #3B5BDB);
  text-decoration: none;
  letter-spacing: 0.005em;
}
.pcp-offer-card__pdf:hover {
  text-decoration: underline;
  text-underline-offset: 3px;
}

/* Responsive: 2-col tablet, 1-col mobile */
@media (max-width: 991px) {
  .pcp-offer-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.6rem; }
}
@media (max-width: 640px) {
  .pcp-offer-grid { grid-template-columns: 1fr; gap: 1.2rem; }
  .pcp-offer-card { padding: 2rem 1.8rem 1.6rem; gap: 1.4rem; }
  .pcp-offer-card__logo { flex: 0 0 5.6rem; width: 5.6rem; height: 5.6rem; }
  .pcp-offer-card__price-num { font-size: 3.2rem; }
}

/* ----- Expand/collapse toggle (v0.1.51) — mobile-first -----
   Initial state: grid is collapsed, showing only the first 2 rows worth of
   cards at the user's current viewport. Cards beyond that are display:none
   (server-rendered for SEO + Google sees everything; just hidden visually).
   A "Vezi mai multe ↓" pill-button (die9w2-styled royal blue) below the
   grid expands to reveal all cards. Button flips to "Vezi mai puține ↑"
   for collapse-back. */

/* Mobile baseline: 1-column grid → 2 cards visible (rows × cols = 2 × 1) */
.pcp-offer-grid--collapsed > li:nth-child(n+3) { display: none; }

/* Tablet: 2-column grid → 4 cards visible (2 × 2) */
@media (min-width: 641px) {
  .pcp-offer-grid--collapsed > li:nth-child(n+3) { display: flex; }
  .pcp-offer-grid--collapsed > li:nth-child(n+5) { display: none; }
}

/* Desktop: 3-column grid → 6 cards visible (2 × 3) */
@media (min-width: 992px) {
  .pcp-offer-grid--collapsed > li:nth-child(n+5) { display: flex; }
  .pcp-offer-grid--collapsed > li:nth-child(n+7) { display: none; }
}

/* Toggle button container — centered, full-width touch target on mobile */
.pcp-offer-grid__toggle-wrap {
  display: flex;
  justify-content: center;
  margin: 2rem auto 0;
  padding: 0 1.2rem;
  max-width: 100%;
}

/* Toggle button — matches the homepage die9w2 .btn-primary pattern:
   0.7rem 2rem padding, 8px border-radius, brand blue, white text,
   hover #2840B8, min-height 48px (theme rule for primary buttons). */
.pcp-offer-grid__toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.8rem;
  width: 100%;
  max-width: 32rem;
  min-height: 48px;
  padding: 0.7rem 2rem;
  background: var(--color-primary, #3B5BDB);
  color: var(--color-white, #FFFFFF);
  font-family: 'DM Sans', sans-serif;
  font-size: var(--text-button, 1.5rem);
  font-weight: 600;
  letter-spacing: 0.01em;
  text-decoration: none;
  border: none;
  border-radius: 8px;
  cursor: pointer;
  transition: all 0.15s ease;
  -webkit-tap-highlight-color: transparent;
}
.pcp-offer-grid__toggle:hover,
.pcp-offer-grid__toggle:focus {
  background: #2840B8;
  color: var(--color-white, #FFFFFF);
  outline: none;
}
.pcp-offer-grid__toggle:focus-visible {
  outline: 2px solid var(--color-primary, #3B5BDB);
  outline-offset: 4px;
}
.pcp-offer-grid__toggle:active { transform: scale(0.98); }

/* Tablet+: button shrinks to fit-content (no longer full-width) */
@media (min-width: 641px) {
  .pcp-offer-grid__toggle { width: auto; min-width: 24rem; }
}

/* ----- Table (deprecated by v0.1.49 — kept for back-compat) ----- */
.pcp-all-offers__table-wrap {
  overflow-x: auto;
  border: 1px solid var(--pc-gray-200, #E2E8F0);
  border-radius: 12px;
  background: #FFFFFF;
  margin: 0 0 2rem;
}
.pcp-all-offers__table {
  width: 100%;
  border-collapse: collapse;
  font-size: 1.4rem;
  font-variant-numeric: tabular-nums;
}
.pcp-all-offers__table thead {
  background: var(--pc-gray-50, #F8FAFC);
  border-bottom: 1px solid var(--pc-gray-200, #E2E8F0);
}
.pcp-all-offers__table th {
  text-align: left;
  font-family: 'DM Sans', sans-serif;
  font-size: 1.15rem;
  font-weight: 700;
  color: var(--color-dark-muted, #64748B);
  text-transform: uppercase;
  letter-spacing: 0.06em;
  padding: 1.4rem 1.6rem;
  vertical-align: bottom;
  white-space: nowrap;
}
.pcp-all-offers__th--num,
.pcp-all-offers__th--pdf { text-align: right; }
.pcp-all-offers__table td {
  padding: 1.6rem;
  border-bottom: 1px solid var(--pc-gray-150, #F1F5F9);
  vertical-align: middle;
  line-height: 1.4;
}
.pcp-all-offers__table tbody tr:last-child td { border-bottom: none; }
.pcp-all-offers__table tbody tr:hover { background: var(--pc-gray-50, #F8FAFC); }
.pcp-all-offers__td--supplier { color: var(--color-ink, #0F172A); }
.pcp-all-offers__td--supplier strong { font-weight: 700; }
.pcp-all-offers__td--offer { color: var(--color-dark-muted, #64748B); }
.pcp-all-offers__td--zone,
.pcp-all-offers__td--type,
.pcp-all-offers__td--term { color: var(--color-dark-muted, #64748B); }
.pcp-all-offers__td--num { text-align: right; white-space: nowrap; }
.pcp-all-offers__num { font-weight: 700; color: var(--color-ink, #0F172A); font-size: 1.5rem; }
.pcp-all-offers__unit { color: var(--color-dark-muted, #64748B); font-size: 1.2rem; margin-left: 0.2rem; }
.pcp-all-offers__td--pdf { text-align: right; white-space: nowrap; }
.pcp-all-offers__td--pdf a {
  color: var(--color-primary, #3B5BDB);
  font-weight: 600;
  text-decoration: underline;
  text-underline-offset: 3px;
}
.pcp-all-offers__td--pdf a:hover { color: #2840B8; }
.pcp-all-offers__table-note {
  margin: 1.2rem 0 0;
  padding: 0 1.6rem;
  font-size: 1.15rem;
  color: var(--color-dark-muted, #94A3B8);
  font-style: italic;
}
.pcp-all-offers__table-note a {
  color: inherit;
  text-decoration: underline;
}
.pcp-all-offers__empty {
  padding: 4.8rem 2rem;
  text-align: center;
  font-size: 1.5rem;
  color: var(--color-dark-muted, #64748B);
  background: #FFFFFF;
  border: 1px solid var(--pc-gray-200, #E2E8F0);
  border-radius: 12px;
  margin: 0 0 2rem;
}

/* ----- Pagination ----- */
.pcp-all-offers__pagination {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  justify-content: center;
  align-items: center;
  margin: 2.4rem 0;
}
.pcp-all-offers__page-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 4rem;
  height: 4rem;
  padding: 0 1.2rem;
  font-family: 'DM Sans', sans-serif;
  font-size: 1.4rem;
  font-weight: 500;
  color: var(--color-ink, #0F172A);
  background: #FFFFFF;
  border: 1px solid var(--pc-gray-200, #E2E8F0);
  border-radius: 8px;
  text-decoration: none;
  transition: background 0.15s ease, border-color 0.15s ease;
}
.pcp-all-offers__page-link:hover { border-color: var(--pc-blue-300, #CDDBFA); background: var(--pc-blue-50, #EEF2FF); }
.pcp-all-offers__page-link--current {
  background: var(--color-primary, #3B5BDB);
  border-color: var(--color-primary, #3B5BDB);
  color: #FFFFFF;
  font-weight: 700;
}
.pcp-all-offers__page-link--prev,
.pcp-all-offers__page-link--next {
  font-weight: 600;
  padding: 0 1.6rem;
}
.pcp-all-offers__page-link--disabled {
  color: var(--pc-gray-300, #CBD5E1);
  cursor: not-allowed;
  background: var(--pc-gray-50, #F8FAFC);
}
.pcp-all-offers__page-gap {
  color: var(--color-dark-muted, #64748B);
  padding: 0 0.4rem;
}

/* ====================================================================
   v0.1.56 — Energy glossary, civic-card pattern (matches /pana-de-curent)
   --------------------------------------------------------------------
   Adapted from the outage cluster's DSO civic-card design language:
   - Paper off-white surface (#FAFAF7) — reference-material feel
   - 20px radius (vs feature-card 12px) — softer, more rounded
   - Outlined pill category tag (DSO region-tag pattern §9.7)
   - Multi-layer "paper lift" shadow on hover
   - Top-anchored category line, then term, then body — vertical rhythm
   matches the DSO row structure (region tag → name → sub).
   ==================================================================== */
.pcp-glossary-grid {
  list-style: none;
  margin: 0 auto;
  padding: 0;
  display: grid;
  grid-template-columns: 1fr;
  gap: 1.6rem;
  max-width: 96rem;
}
.pcp-glossary-card {
  background: #FAFAF7;                    /* paper off-white (civic-card token) */
  border: 1px solid #E5E9F0;
  border-radius: 20px;
  padding: 2.4rem 2rem;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  transition: background 0.2s ease, border-color 0.2s ease, box-shadow 0.25s ease, transform 0.2s ease;
  position: relative;
}
.pcp-glossary-card:hover {
  background: #FFFFFF;
  border-color: #CDDBFA;
  box-shadow:
    0 1px 0 rgba(15, 23, 42, 0.04),
    0 16px 32px -24px rgba(15, 23, 42, 0.18);
  transform: translateY(-1px);
}

/* Fact-pill — v0.1.57 filled brand-blue version (per user request).
   Contains concrete reference data (URL / format / law / count / formula)
   instead of abstract categories. White text on royal-blue background. */
.pcp-glossary-card__pill {
  display: inline-block;
  align-self: flex-start;
  font-family: 'DM Sans', sans-serif;
  font-size: 1.1rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  color: var(--color-white, #FFFFFF);
  background: var(--color-primary, #3B5BDB);
  padding: 0.45rem 1rem;
  border: none;
  border-radius: 999px;
  line-height: 1.2;
  margin-bottom: 0.6rem;
  white-space: nowrap;
}

/* Term name — Plus Jakarta Sans bold, primary visual anchor */
.pcp-glossary-card__term {
  margin: 0;
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 1.75rem;
  font-weight: 700;
  line-height: 1.25;
  color: var(--color-ink, #0F172A);
  letter-spacing: -0.015em;
}

/* Definition — DM Sans body, slate. Inline emphasis supported. */
.pcp-glossary-card__def {
  margin: 0;
  font-family: 'DM Sans', sans-serif;
  font-size: 1.4rem;
  line-height: 1.6;
  color: #475569;
}
.pcp-glossary-card__def strong {
  color: var(--color-ink, #0F172A);
  font-weight: 700;
}
.pcp-glossary-card__def em {
  font-style: italic;
  color: var(--color-ink, #0F172A);
}
.pcp-glossary-card__def code {
  font-family: ui-monospace, 'SF Mono', Menlo, Consolas, monospace;
  font-size: 0.92em;
  padding: 0.1rem 0.4rem;
  background: rgba(15, 23, 42, 0.05);
  border-radius: 4px;
  color: var(--color-ink, #0F172A);
}
.pcp-glossary-card__def a {
  color: var(--color-primary, #3B5BDB);
  text-decoration: underline;
  text-underline-offset: 2px;
}
.pcp-glossary-card__def a:hover { color: #2840B8; }

/* Tablet+: 2-column grid. 3-col cramps the long definitions; civic-card
   prefers width over density. */
@media (min-width: 641px) {
  .pcp-glossary-grid { grid-template-columns: repeat(2, 1fr); gap: 2rem; }
  .pcp-glossary-card { padding: 2.8rem 2.4rem; gap: 1.2rem; }
  .pcp-glossary-card__term { font-size: 1.9rem; }
  .pcp-glossary-card__def { font-size: 1.45rem; }
}

@media (prefers-reduced-motion: reduce) {
  .pcp-glossary-card { transition: none; }
  .pcp-glossary-card:hover { transform: none; }
}

/* ----- Footer disclosure (v0.1.54 — 3-chunk icon layout + related links) -----
   Same legal substance as the briefing's required disclosure paragraph,
   but split into 3 visual chunks (Sursă · Actualizare · Independență)
   plus a row of internal-link pills below. Mobile: stacks vertically;
   tablet/desktop: 3-column grid. */
.pcp-all-offers__disclosure {
  margin: 2.4rem 0 0;
  padding: 2rem;
  background: var(--pc-gray-50, #F8FAFC);
  border: 1px solid var(--pc-gray-200, #E2E8F0);
  border-radius: 12px;
  font-family: 'DM Sans', sans-serif;
  color: var(--color-dark-muted, #64748B);
}
.pcp-all-offers__disclosure-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1.6rem;
  margin-bottom: 1.6rem;
}
.pcp-all-offers__disclosure-item {
  display: flex;
  gap: 1rem;
  align-items: flex-start;
}
.pcp-all-offers__disclosure-icon {
  flex: 0 0 auto;
  width: 3.6rem;
  height: 3.6rem;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #FFFFFF;
  border: 1px solid var(--pc-gray-200, #E2E8F0);
  border-radius: 50%;
  color: var(--color-primary, #3B5BDB);
}
.pcp-all-offers__disclosure-text { flex: 1 1 auto; min-width: 0; }
.pcp-all-offers__disclosure-title {
  margin: 0 0 0.3rem;
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 1.3rem;
  font-weight: 700;
  color: var(--color-ink, #0F172A);
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.pcp-all-offers__disclosure p {
  margin: 0;
  font-size: 1.3rem;
  line-height: 1.55;
}
.pcp-all-offers__disclosure strong { color: var(--color-ink, #0F172A); font-weight: 600; }
.pcp-all-offers__disclosure a {
  color: var(--color-primary, #3B5BDB);
  text-decoration: underline;
  text-underline-offset: 2px;
}
.pcp-all-offers__disclosure a:hover { color: #2840B8; }

/* Related-links pills inside the disclosure */
.pcp-all-offers__related-links {
  margin: 0;
  padding-top: 1.6rem;
  border-top: 1px solid var(--pc-gray-200, #E2E8F0);
}
.pcp-all-offers__related-title {
  margin: 0 0 0.8rem;
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 1.2rem;
  font-weight: 700;
  color: var(--color-ink, #0F172A);
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.pcp-all-offers__related-links ul {
  display: flex;
  flex-wrap: wrap;
  gap: 0.6rem;
  list-style: none;
  margin: 0;
  padding: 0;
}
.pcp-all-offers__related-links li { margin: 0; }
.pcp-all-offers__related-links a {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0.6rem 1.2rem;
  background: #FFFFFF;
  border: 1px solid var(--pc-gray-200, #E2E8F0);
  border-radius: 999px;
  font-size: 1.25rem;
  font-weight: 500;
  color: var(--color-ink, #0F172A);
  text-decoration: none;
  transition: border-color 0.15s ease, background 0.15s ease;
  white-space: nowrap;
}
.pcp-all-offers__related-links a:hover,
.pcp-all-offers__related-links a:focus {
  border-color: var(--pc-blue-300, #CDDBFA);
  background: var(--pc-blue-50, #EEF2FF);
  color: var(--color-ink, #0F172A);
  text-decoration: none;
}

/* Tablet+: 3-col grid for the disclosure chunks */
@media (min-width: 768px) {
  .pcp-all-offers__disclosure { padding: 2.4rem; }
  .pcp-all-offers__disclosure-grid {
    grid-template-columns: repeat(3, 1fr);
    gap: 2rem;
  }
}
@media (min-width: 641px) {
  .pcp-all-offers__related-links a { font-size: 1.3rem; padding: 0.7rem 1.4rem; }
}

/* ----- Mobile / tablet ----- */
@media (max-width: 991px) {
  .pcp-all-offers__filters { padding: 1.6rem; }
  .pcp-all-offers__filter { flex: 1 1 14rem; }
}
@media (max-width: 640px) {
  .pcp-all-offers { padding: 0 1.2rem; }
  .pcp-all-offers__methodology { font-size: 1.3rem; padding: 1.2rem 1.4rem; }
  .pcp-all-offers__filters { padding: 1.4rem; gap: 1rem 1.2rem; }
  .pcp-all-offers__filter { flex: 1 1 100%; }
  .pcp-all-offers__filter-actions { flex: 1 1 100%; }
  .pcp-all-offers__submit { flex: 1 1 auto; }
  .pcp-all-offers__table { font-size: 1.3rem; }
  .pcp-all-offers__table th,
  .pcp-all-offers__table td { padding: 1.2rem 1rem; }
  .pcp-all-offers__num { font-size: 1.4rem; }
  .pcp-all-offers__disclosure { padding: 1.6rem 1.4rem; font-size: 1.2rem; }
  .pcp-all-offers__page-link { min-width: 3.6rem; height: 3.6rem; font-size: 1.3rem; }
}