/*
 * sf-list.css — paginile de listă SEO/GEO: /centre/, /mitropolii/<slug>/, /eparhii/<slug>/, /judete/<slug>/.
 * Se încarcă după sf-theme.css (tokens, butoane, carduri, eyebrow, divider). Fără JS.
 * Componente: sf-list · sf-crumbs · sf-hero · sf-intro · sf-actions · sf-chips/sf-chip · sf-jump · sf-group · sf-sub
 *             · sf-centres · sf-layout · sf-eplist · sf-official · sf-types · sf-listing · sf-county · sf-loc · sf-list-404
 */

.sf-list { padding-top: var(--sf-space-4); padding-bottom: var(--sf-space-7); }

/* ---------- Breadcrumb ---------- */
.sf-crumbs { margin-bottom: var(--sf-space-3); }
.sf-crumbs__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0 6px;
  font-family: var(--sf-font-ui);
  font-weight: 700;
  font-size: 12px;
  line-height: 1.3;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--sf-muted);
}
.sf-crumbs__item { display: inline-flex; align-items: center; gap: 6px; min-height: 32px; }
.sf-crumbs__item a {
  display: inline-flex;
  align-items: center;
  min-height: 32px;
  color: var(--sf-navy);
  text-decoration: none;
  border-radius: var(--sf-radius-sm);
}
.sf-crumbs__item a:hover { text-decoration: underline; text-underline-offset: 4px; }
.sf-crumbs__item [aria-current] { color: var(--sf-muted); }
.sf-crumbs__sep { width: 14px; height: 14px; color: var(--sf-gold-2); }

/* ---------- Titlu + introducere ---------- */
.sf-hero { margin-bottom: var(--sf-space-6); }
.sf-hero .sf-eyebrow { margin-bottom: var(--sf-space-2); }
.sf-hero .sf-eyebrow a { color: var(--sf-gold-text); text-decoration-color: rgba(133, 100, 63, .45); }
.sf-hero .sf-eyebrow a:hover { color: var(--sf-navy); text-decoration-color: currentColor; }
.sf-hero__title {
  margin: 0 0 var(--sf-space-3);
  font-size: 44px;
  line-height: 1.12;
  max-width: 26ch;
  overflow-wrap: break-word;
  text-wrap: balance;
}
.sf-hero .sf-divider { margin: 0 0 var(--sf-space-5); }

.sf-intro {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--sf-space-5);
  margin-bottom: var(--sf-space-7);
}
.sf-intro > * { min-width: 0; }
@media (min-width: 992px) {
  .sf-intro { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: var(--sf-space-7); align-items: start; }
}
.sf-intro__text { color: var(--sf-text-body); }
.sf-intro__text p:last-child { margin-bottom: 0; }
.sf-intro__lead { font-size: 21px; line-height: 1.5; }
.sf-intro__text strong { font-weight: 600; color: var(--sf-navy); }

/* ---------- Butoane ---------- */
.sf-actions { display: flex; flex-wrap: wrap; gap: var(--sf-space-3); margin-top: var(--sf-space-5); }
.sf-actions--center { justify-content: center; }
/* .sf-prose a {color: navy} ar suprascrie textul butonului primar */
.sf-prose .sf-btn { text-decoration: none; }
.sf-prose .sf-btn--primary, .sf-prose .sf-btn--primary:hover, .sf-prose .sf-btn--primary:focus { color: var(--sf-cream-2); }
.sf-actions--stack { margin-top: 0; }
.sf-actions--stack .sf-btn { flex: 1 1 180px; }

/* ---------- Chip-uri (mitropolii, județe) ---------- */
.sf-chips {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: var(--sf-space-2);
}
.sf-chips > li { min-width: 0; max-width: 100%; }
.sf-chip {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  max-width: 100%;
  min-height: 44px;
  padding: 6px 7px 6px 16px;
  border: 1px solid var(--sf-line);
  border-radius: 22px; /* = pill la o linie; dreptunghi rotunjit când numele trece pe 2 rânduri */
  background: var(--sf-surface);
  color: var(--sf-navy);
  font-family: var(--sf-font-ui);
  font-weight: 600;
  font-size: 14px;
  line-height: 1.25;
  text-decoration: none;
  transition: background-color var(--sf-dur) var(--sf-ease), border-color var(--sf-dur) var(--sf-ease);
}
.sf-chip:hover, .sf-chip:focus { background: var(--sf-navy-50); border-color: var(--sf-navy); color: var(--sf-navy); text-decoration: none; }
.sf-chip__name { min-width: 0; overflow-wrap: anywhere; }
.sf-chip__n {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  min-width: 34px;
  height: 28px;
  padding: 0 9px;
  border-radius: var(--sf-radius-pill);
  background: var(--sf-navy-50);
  color: var(--sf-navy);
  font-weight: 700;
  font-size: 13px;
  font-variant-numeric: tabular-nums;
  transition: background-color var(--sf-dur) var(--sf-ease), color var(--sf-dur) var(--sf-ease);
}
.sf-chip:hover .sf-chip__n, .sf-chip:focus .sf-chip__n { background: var(--sf-navy); color: var(--sf-cream-2); }
.sf-chip--alt { border-color: var(--sf-gold); }
.sf-chip.is-current { background: var(--sf-navy); border-color: var(--sf-navy); color: var(--sf-cream-2); }
.sf-chip.is-current .sf-chip__n { background: var(--sf-cream-2); color: var(--sf-navy); }

/* grilă ordonată pentru listele lungi (județe, 404) */
.sf-group--counties .sf-chips,
.sf-list-404__more .sf-chips {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
}
.sf-list-404__more .sf-chips { grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); }
.sf-group--counties .sf-chip,
.sf-list-404__more .sf-chip { display: flex; justify-content: space-between; width: 100%; }

/* ---------- Cuprins (mitropolii) ---------- */
.sf-jump {
  margin: 0 0 var(--sf-space-7);
  padding: var(--sf-space-5);
  border: 1px solid var(--sf-border);
  border-radius: var(--sf-radius-lg);
  background: var(--sf-cream-2);
  scroll-margin-top: var(--sf-space-4);
}
.sf-jump__title {
  margin: 0 0 var(--sf-space-3);
  font-family: var(--sf-font-ui);
  font-weight: 700;
  font-size: 12px;
  line-height: 1.3;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--sf-muted);
}

/* ---------- Grup (mitropolie) ---------- */
.sf-group { margin-top: var(--sf-space-7); scroll-margin-top: var(--sf-space-4); }
.sf-group__head {
  position: relative;
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: var(--sf-space-2) var(--sf-space-5);
  margin-bottom: var(--sf-space-5);
  padding-bottom: var(--sf-space-3);
  border-bottom: 1px solid var(--sf-line);
}
.sf-group__head::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -1px;
  width: 48px;
  height: 2px;
  background: var(--sf-gold);
}
.sf-group__title { margin: 0; font-size: 32px; line-height: 1.15; overflow-wrap: break-word; min-width: 0; }
.sf-group__title a { color: var(--sf-navy); text-decoration: none; }
.sf-group__title a:hover { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 5px; }
.sf-group__meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0 var(--sf-space-4);
  margin: 0;
  font-family: var(--sf-font-ui);
  font-weight: 700;
  font-size: 12px;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--sf-muted);
}
.sf-group__top {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  min-height: 44px;
  color: var(--sf-navy);
  text-decoration: none;
}
.sf-group__top:hover { text-decoration: underline; text-underline-offset: 4px; }
.sf-group__top .sf-icon { width: 14px; height: 14px; }

/* ---------- Eparhie (în /centre/) ---------- */
.sf-sub {
  margin-top: var(--sf-space-5);
  padding: var(--sf-space-5);
  border-radius: var(--sf-radius-lg);
  background: var(--sf-surface);
  box-shadow: var(--sf-shadow-1);
}
.sf-group__head + .sf-sub { margin-top: 0; }
.sf-sub__title {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 2px var(--sf-space-3);
  margin: 0 0 var(--sf-space-3);
  font-size: 23px;
  line-height: 1.25;
}
.sf-sub__title a { color: var(--sf-navy); text-decoration: none; overflow-wrap: break-word; }
.sf-sub__title a:hover { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 4px; }
.sf-sub__n, .sf-county__n, .sf-loc__n, .sf-eplist__n {
  font-family: var(--sf-font-ui);
  font-weight: 700;
  font-size: 12px;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--sf-gold-text);
  white-space: nowrap;
}

/* ---------- Lista de centre ---------- */
.sf-centres { list-style: none; margin: 0; padding: 0; }
.sf-centres__item {
  padding: 7px 0;
  break-inside: avoid;
  -webkit-column-break-inside: avoid;
}
.sf-centres__link {
  font-family: var(--sf-font-serif);
  font-size: 18px;
  line-height: 1.35;
  font-weight: 500;
  color: var(--sf-navy);
  text-decoration: none;
  overflow-wrap: anywhere;
}
.sf-centres__link:hover, .sf-centres__link:focus { color: var(--sf-navy-700); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; }
.sf-centres__link:visited { color: var(--sf-wine); }
.sf-centres__meta {
  display: block;
  margin-top: 1px;
  font-family: var(--sf-font-ui);
  font-weight: 500;
  font-size: 13px;
  line-height: 1.4;
  color: var(--sf-muted);
  overflow-wrap: anywhere;
}
@media (min-width: 992px) {
  .sf-centres--cols { columns: 2; column-gap: var(--sf-space-7); }
}

/* ---------- Pagini teritoriu / județ: grilă ---------- */
.sf-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--sf-space-5);
  align-items: start;
}
.sf-layout > * { min-width: 0; }
.sf-layout__aside { display: flex; flex-direction: column; gap: var(--sf-space-5); }
@media (min-width: 992px) {
  .sf-layout {
    grid-template-columns: minmax(0, 8fr) minmax(0, 4fr);
    grid-template-areas: "main aside";
    gap: var(--sf-space-7);
  }
  .sf-layout__main { grid-area: main; }
  .sf-layout__aside { grid-area: aside; }
}

/* eparhiile unei mitropolii */
.sf-eplist {
  list-style: none;
  margin: var(--sf-space-4) 0 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap: var(--sf-space-3);
}
.sf-eplist > li {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
  padding: var(--sf-space-3) var(--sf-space-4);
  border: 1px solid var(--sf-border);
  border-left: 3px solid var(--sf-gold);
  border-radius: var(--sf-radius-md);
  background: var(--sf-surface);
  transition: border-color var(--sf-dur) var(--sf-ease), box-shadow var(--sf-dur) var(--sf-ease);
}
.sf-eplist > li:hover { border-color: var(--sf-navy); border-left-color: var(--sf-gold); box-shadow: var(--sf-shadow-1); }
.sf-eplist__link {
  font-family: var(--sf-font-serif);
  font-size: 19px;
  font-weight: 500;
  line-height: 1.3;
  color: var(--sf-navy);
  text-decoration: none;
  overflow-wrap: break-word;
}
/* tot cardul e țintă de click */
.sf-eplist__link::after { content: ""; position: absolute; inset: 0; border-radius: var(--sf-radius-md); }
.sf-eplist__link:hover { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; }
.sf-eplist__link:focus-visible { box-shadow: none; }
.sf-eplist__link:focus-visible::after { box-shadow: var(--sf-focus-ring); }

/* carduri laterale */
.sf-panel-card .sf-card__title { margin-top: 0; }
.sf-official__desc {
  margin-bottom: var(--sf-space-4);
  font-size: 17px;
  line-height: 1.55;
  color: var(--sf-text-body);
  overflow-wrap: anywhere;
}
.sf-official__desc a { color: var(--sf-navy); }
.sf-official__site { white-space: normal; }

.sf-types { list-style: none; margin: 0; padding: 0; }
.sf-types > li {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: var(--sf-space-3);
  padding: 10px 0;
  border-top: 1px solid rgba(34, 53, 128, .14);
}
.sf-types > li:first-child { border-top: 0; padding-top: 0; }
.sf-types__name { font-size: 18px; line-height: 1.35; color: var(--sf-text-body); min-width: 0; }
.sf-types__n {
  flex-shrink: 0;
  font-family: var(--sf-font-ui);
  font-weight: 700;
  font-size: 15px;
  color: var(--sf-navy);
  font-variant-numeric: tabular-nums;
}
.sf-note {
  margin: var(--sf-space-3) 0 0;
  font-family: var(--sf-font-ui);
  font-size: 13px;
  line-height: 1.45;
  color: var(--sf-muted);
}

/* lista centrelor: județ → localitate */
.sf-listing__title { margin: 0 0 var(--sf-space-4); font-size: 30px; }
.sf-listing__n { font-family: var(--sf-font-ui); font-size: 16px; font-weight: 700; color: var(--sf-gold-text); letter-spacing: .02em; }
.sf-county {
  margin-top: var(--sf-space-5);
  padding: var(--sf-space-5);
  border-radius: var(--sf-radius-lg);
  background: var(--sf-surface);
  box-shadow: var(--sf-shadow-1);
}
.sf-listing__title + .sf-county { margin-top: 0; }
.sf-county__title {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 2px var(--sf-space-3);
  margin: 0 0 var(--sf-space-2);
  font-size: 24px;
}
.sf-county__title a { color: var(--sf-navy); text-decoration: none; }
.sf-county__title a:hover { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 4px; }
.sf-loc { padding-top: var(--sf-space-4); margin-top: var(--sf-space-4); border-top: 1px solid rgba(34, 53, 128, .14); }
.sf-county__title + .sf-loc, .sf-county > .sf-loc:first-child { margin-top: var(--sf-space-3); padding-top: 0; border-top: 0; }
.sf-loc__title {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 2px var(--sf-space-3);
  margin: 0 0 var(--sf-space-1);
  font-family: var(--sf-font-ui);
  font-weight: 700;
  font-size: 13px;
  line-height: 1.35;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--sf-navy);
}
.sf-loc__n { font-size: 11px; }

/* ---------- 404 ---------- */
.sf-list-404 {
  max-width: 640px;
  margin: var(--sf-space-7) auto 0;
  padding: var(--sf-space-7) var(--sf-space-6);
  text-align: center;
}
.sf-list-404__icon { display: inline-flex; margin-bottom: var(--sf-space-3); color: var(--sf-gold-2); }
.sf-list-404__icon .sf-icon { width: 48px; height: 48px; }
.sf-list-404 h1 { margin: 0 0 var(--sf-space-3); }
.sf-list-404 .sf-lead { max-width: 46ch; margin: 0 auto var(--sf-space-5); }
.sf-list-404__more { max-width: 960px; margin: var(--sf-space-7) auto 0; }
.sf-list-404__more h2 { margin-bottom: var(--sf-space-4); }

/* ---------- Responsive ---------- */
@media (max-width: 991px) {
  .sf-hero__title { font-size: 36px; }
  .sf-group__title { font-size: 28px; }
}
@media (max-width: 767px) {
  .sf-list { padding-top: var(--sf-space-2); padding-bottom: var(--sf-space-6); }
  .sf-hero { margin-bottom: var(--sf-space-5); }
  .sf-hero__title { font-size: 29px; line-height: 1.15; }
  .sf-intro { margin-bottom: var(--sf-space-6); }
  .sf-intro__lead { font-size: 19px; }
  .sf-jump { padding: var(--sf-space-4); margin-bottom: var(--sf-space-6); }
  .sf-group { margin-top: var(--sf-space-6); }
  .sf-group__title { font-size: 25px; }
  .sf-sub, .sf-county { padding: var(--sf-space-4); }
  .sf-sub__title { font-size: 21px; }
  .sf-county__title { font-size: 22px; }
  .sf-listing__title { font-size: 26px; }
  .sf-centres__link { font-size: 17px; }
  .sf-chip { font-size: 13px; padding-left: 14px; }
  .sf-group--counties .sf-chips { grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); }
  .sf-list-404__more .sf-chips { grid-template-columns: minmax(0, 1fr); }
  .sf-actions .sf-btn { flex: 1 1 100%; }
  .sf-list-404 { margin-top: var(--sf-space-5); padding: var(--sf-space-6) var(--sf-space-4); }
}

@media (prefers-reduced-motion: reduce) {
  .sf-chip, .sf-chip__n, .sf-eplist > li { transition: none; }
}