/* ============================================================
   Servicii, pachete, pagina unui pachet.
   Butoanele, câmpurile, cardurile și listele cu bifă vin din
   components.css — aici e doar așezarea în pagină.
   ============================================================ */

/* ─────────────────── /servicii — deschidere ─────────────────── */
.svc-hero {
  padding-block: clamp(2.5rem, 6vw, 5rem);
  background: linear-gradient(180deg, var(--stone-100), var(--bg));
  border-bottom: 1px solid var(--line-soft);
}
.svc-hero__inner {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 0.72fr);
  gap: var(--s-8);
  align-items: center;
}
.svc-hero__title { margin-top: var(--s-4); }
.svc-hero .lead { margin-top: var(--s-5); }
.svc-hero__actions { --gap: var(--s-3); margin-top: var(--s-6); }
.svc-hero__note { display: flex; align-items: center; gap: 0.5rem; margin-top: var(--s-5); }
.svc-hero__note .icon { color: var(--brass-600); }
.svc-hero__media { display: grid; place-items: center; }
.svc-hero__art { width: 100%; }

@media (max-width: 899px) {
  .svc-hero__inner { grid-template-columns: 1fr; gap: var(--s-6); }
  .svc-hero__media { max-width: 22rem; }
}

/* ─────────────────── Bara de sărituri ─────────────────── */
.svc-jump {
  position: sticky;
  top: 4.75rem;
  z-index: var(--z-sticky);
  background: rgba(250, 249, 246, 0.94);
  backdrop-filter: saturate(1.2) blur(10px);
  -webkit-backdrop-filter: saturate(1.2) blur(10px);
  border-bottom: 1px solid var(--line-soft);
}
.svc-jump__inner {
  display: flex;
  gap: var(--s-2);
  overflow-x: auto;
  scrollbar-width: none;
}
.svc-jump__inner::-webkit-scrollbar { display: none; }
.svc-jump__link {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  min-height: 3rem;
  padding: 0.5rem 0.9rem;
  white-space: nowrap;
  font-size: var(--t-sm);
  color: var(--ink-600);
  border-bottom: 2px solid transparent;
  transition: color var(--d-fast) var(--ease), border-color var(--d-fast) var(--ease);
}
.svc-jump__link:hover { color: var(--ink-900); border-bottom-color: var(--brass-500); }
.svc-jump__num {
  font-family: var(--font-display);
  font-size: var(--t-xs);
  letter-spacing: var(--track-wide);
  color: var(--brass-700);
}

/* ─────────────────── Momentele ─────────────────── */
.moment { border-bottom: 1px solid var(--line-soft); }
.moment:nth-of-type(even) { background: var(--surface); }
.moment__head { max-width: var(--maxw-text); }
.moment__title { margin-top: var(--s-4); }
.moment__head .lead { margin-top: var(--s-4); }

.moment__body {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 0.5fr);
  gap: var(--s-8);
  align-items: start;
  margin-top: var(--s-7);
}
.moment__media { position: sticky; top: 9.5rem; display: grid; place-items: center; }
.moment__art { width: 100%; }

.svc-list { display: grid; gap: var(--s-5); }
.svc {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: var(--s-4);
  padding: var(--s-5);
  background: var(--bg);
  border: 1px solid var(--line-soft);
  border-radius: var(--r-md);
}
.moment:nth-of-type(even) .svc { background: var(--stone-50); }
.svc__icon {
  display: grid;
  place-items: center;
  width: 3rem;
  height: 3rem;
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  background: var(--surface);
  color: var(--brass-700);
}
.svc__title { font-size: var(--t-md); margin-bottom: var(--s-2); }
.svc__text p { max-width: var(--maxw-text); color: var(--text-soft); }
.svc__price {
  margin-top: var(--s-3);
  padding-top: var(--s-3);
  border-top: 1px dashed var(--line);
  font-size: var(--t-sm);
  font-weight: 500;
  color: var(--ink-700);
}

@media (max-width: 1023px) {
  .moment__body { grid-template-columns: 1fr; }
  .moment__media { position: static; max-width: 20rem; margin-inline: auto; }
}
@media (max-width: 479px) {
  .svc { grid-template-columns: 1fr; }
  .svc__icon { width: 2.6rem; height: 2.6rem; }
}

/* ─────────────────── Incinerarea ─────────────────── */
.inc { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); --gap: var(--s-8); align-items: start; }
.inc__title { margin-top: var(--s-4); }
.inc .lead { margin-top: var(--s-4); }
.inc__note { margin-top: var(--s-5); background: var(--surface); }
.inc__steps {
  padding: var(--s-6);
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--r-md);
}
.inc__sub { font-size: var(--t-md); margin-bottom: var(--s-5); }
.inc__after { margin-top: var(--s-5); }

.steps { display: grid; gap: var(--s-4); counter-reset: pas; }
.steps__item {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: var(--s-4);
  align-items: start;
  font-size: var(--t-sm);
  color: var(--text-soft);
}
.steps__num {
  display: grid;
  place-items: center;
  width: 1.75rem;
  height: 1.75rem;
  border: 1px solid var(--brass-300);
  border-radius: 50%;
  background: var(--brass-100);
  font-family: var(--font-display);
  font-size: var(--t-sm);
  color: var(--brass-700);
}
@media (max-width: 899px) { .inc { grid-template-columns: 1fr; } }

/* ─────────────────── Rituri ─────────────────── */
.rites { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.rite__icon {
  display: inline-grid;
  place-items: center;
  width: 3rem;
  height: 3rem;
  margin-bottom: var(--s-4);
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  color: var(--brass-700);
}
.rite__title { font-size: var(--t-md); margin-bottom: var(--s-3); }
.rites__note { margin-top: var(--s-6); }
@media (max-width: 899px) { .rites { grid-template-columns: 1fr; } }

/* ─────────────────── Pachete în rezumat ─────────────────── */
.mini-packs { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.mini-pack {
  display: grid;
  align-content: start;
  gap: 0.4rem;
  padding: var(--s-5);
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--r-md);
  transition: border-color var(--d-base) var(--ease), box-shadow var(--d-base) var(--ease);
}
.mini-pack:hover { border-color: var(--ink-200); box-shadow: var(--shadow-card); }
.mini-pack__name { font-family: var(--font-display); font-size: var(--t-lg); }
.mini-pack__flag { justify-self: start; }
.mini-pack__price { font-family: var(--font-display); font-size: var(--t-xl); color: var(--ink-900); }
.mini-pack__more { justify-self: start; margin-top: var(--s-3); }
.mini-packs__cta { margin-top: var(--s-6); }
@media (max-width: 899px) { .mini-packs { grid-template-columns: 1fr; } }

/* ─────────────────── Chemarea la telefon ─────────────────── */
.svc-call__text { margin-top: var(--s-4); color: var(--ink-200); }
.svc-call__actions { --gap: var(--s-3); justify-content: center; margin-top: var(--s-6); }
/* Pe banda închisă butonul secundar rămâne gol: `--btn-bg` trebuie readus la
   transparent, altfel moștenește albul pus acum pe `.btn--ghost`. */
.svc-call__ghost { --btn-bg: transparent; --btn-fg: #fff; --btn-border: rgba(255, 255, 255, 0.34); }
.svc-call__ghost:hover { background: rgba(255, 255, 255, 0.08); border-color: #fff; color: #fff; }
.svc-call__note { margin-top: var(--s-5); color: var(--ink-300); }

/* ─────────────────── /pachete ─────────────────── */
.pk-crumbs { padding-top: var(--s-5); }
.pk-intro .lead { margin-top: var(--s-4); }
.pk-intro h1 { margin-top: var(--s-4); }
.pk-sent { margin-top: var(--s-5); }

.pk-cards { grid-template-columns: repeat(3, minmax(0, 1fr)); align-items: stretch; }
.pk-card {
  display: flex;
  flex-direction: column;
  gap: var(--s-3);
  padding: var(--s-6);
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--r-md);
}
.pk-card--popular { border-color: var(--brass-400); box-shadow: var(--shadow-card); }
.pk-card__flag { margin: 0; }
.pk-card__name { font-size: var(--t-xl); }
.pk-card__tagline { color: var(--text-soft); font-size: var(--t-sm); margin: 0; }
.pk-card__price { display: grid; gap: 0.2rem; margin: var(--s-3) 0 0; }
/* Rămâne sub --t-2xl: la 1024 px cele trei carduri stau strâns, iar „13.900 lei"
   nu are voie să iasă din card. */
.pk-card__price strong {
  font-family: var(--font-display);
  font-weight: 500;
  font-size: var(--t-xl);
  line-height: 1;
  color: var(--ink-900);
}
.pk-card__vat { font-size: var(--t-xs); letter-spacing: 0.04em; text-transform: uppercase; color: var(--brass-700); }
.pk-card__deposit { margin: 0; }
.pk-card__actions { display: grid; gap: var(--s-2); margin-top: auto; padding-top: var(--s-4); }
.pk-card__count { margin: 0; }
@media (max-width: 1023px) { .pk-cards { grid-template-columns: 1fr; } }

/* Tabelul de comparație */
.cmp-wrap { overflow-x: auto; border: 1px solid var(--line); border-radius: var(--r-md); background: var(--surface); }
.cmp { min-width: 44rem; font-size: var(--t-sm); }
.cmp th, .cmp td { padding: var(--s-4); text-align: left; vertical-align: top; border-bottom: 1px solid var(--line-soft); }
.cmp thead th {
  position: sticky;
  top: 4.75rem;
  background: var(--surface);
  border-bottom: 1px solid var(--line);
}
.cmp__corner { width: 26%; font-size: var(--t-xs); letter-spacing: var(--track-wide); text-transform: uppercase; color: var(--text-mute); font-weight: 600; }
.cmp__pack { width: 24.6%; }
.cmp__pack a { font-family: var(--font-display); font-size: var(--t-md); color: var(--ink-900); }
.cmp__pack a:hover { color: var(--brass-700); }
.cmp__pack.is-popular { box-shadow: inset 0 2px 0 0 var(--brass-500); }
.cmp__price { display: block; margin-top: 0.2rem; font-size: var(--t-sm); color: var(--text-soft); }
.cmp tbody th { font-weight: 500; color: var(--ink-700); }
.cmp td { display: table-cell; color: var(--text-soft); }
.cmp td .icon { display: inline-block; margin-right: 0.4rem; vertical-align: -0.15em; }
.cmp__yes .icon { color: var(--sage-500); }
.cmp__no { color: var(--text-mute); }
.cmp__no .icon { color: var(--ink-300); }
.cmp tbody tr:nth-child(odd) th, .cmp tbody tr:nth-child(odd) td { background: var(--stone-50); }
.cmp tfoot th, .cmp tfoot td { border-bottom: 0; border-top: 1px solid var(--line); }
.cmp__total { font-family: var(--font-display); font-size: var(--t-md); color: var(--ink-900); }

.cmp-stack { display: none; gap: var(--s-5); }
.cmp-stack__pack {
  padding: var(--s-5);
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--r-md);
}
.cmp-stack__name { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: var(--s-3); }
.cmp-stack__price { font-size: var(--t-lg); }
.cmp-stack__list { margin: var(--s-4) 0; }
.cmp-stack__row { padding: var(--s-3) 0; border-top: 1px solid var(--line-soft); }
.cmp-stack__row dt { font-size: var(--t-sm); color: var(--ink-700); }
.cmp-stack__row dd { margin: 0.2rem 0 0; font-size: var(--t-sm); color: var(--text-soft); }
.cmp-stack__row dd .icon { display: inline-block; margin-right: 0.35rem; vertical-align: -0.15em; color: var(--sage-500); }
.cmp-stack__row.is-off dd { color: var(--text-mute); }
.cmp-stack__row.is-off dd .icon { color: var(--ink-300); }

@media (max-width: 899px) {
  .cmp-wrap { display: none; }
  .cmp-stack { display: grid; }
}

/* Ce nu include niciun pachet */
.excl { grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr); --gap: var(--s-8); align-items: start; }
.excl h2 { margin-top: var(--s-4); }
.excl .lead { margin-top: var(--s-4); }
.excl__list {
  padding: var(--s-6);
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--r-md);
}
@media (max-width: 899px) { .excl { grid-template-columns: 1fr; } }

/* Plata și ajutorul de deces */
.pay { grid-template-columns: repeat(2, minmax(0, 1fr)); --gap: var(--s-6); }
.pay__col {
  padding: var(--s-6);
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--r-md);
}
.pay__col--help { background: var(--brass-100); border-color: var(--brass-300); }
.pay__icon {
  display: inline-grid;
  place-items: center;
  width: 3rem;
  height: 3rem;
  margin-bottom: var(--s-4);
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  color: var(--brass-700);
}
.pay__col--help .pay__icon { border-color: var(--brass-300); background: var(--surface); }
.pay__title { font-size: var(--t-lg); margin-bottom: var(--s-4); }
.pay__amount {
  font-family: var(--font-display);
  font-size: var(--t-xl);
  color: var(--ink-900);
  margin-bottom: var(--s-3);
}
.pay__ticks { margin-top: var(--s-5); }
@media (max-width: 899px) { .pay { grid-template-columns: 1fr; } }

/* ─────────────────── /pachete/:slug ─────────────────── */
.pkg-head__inner {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 22rem;
  gap: var(--s-8);
  align-items: start;
}
.pkg-head__name { margin-top: var(--s-4); }
.pkg-head .lead { margin-top: var(--s-4); }
.pkg-head__flag { margin-top: var(--s-5); }

.pkg-price {
  padding: var(--s-6);
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--r-md);
  box-shadow: var(--shadow-soft);
}
.pkg-price__value {
  font-family: var(--font-display);
  font-size: var(--t-2xl);
  line-height: 1;
  color: var(--ink-900);
  margin-bottom: 0.35rem;
}
.pkg-price__note {
  font-size: var(--t-xs);
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--brass-700);
  margin-bottom: var(--s-4);
}
.pkg-price__deposit { margin-bottom: var(--s-5); }
.pkg-price .btn + .btn { margin-top: var(--s-2); }
.pkg-price__small { margin-top: var(--s-4); }
@media (max-width: 899px) { .pkg-head__inner { grid-template-columns: 1fr; } }

.pkg-lists { grid-template-columns: minmax(0, 1.15fr) minmax(0, 0.85fr); --gap: var(--s-6); align-items: start; }
.pkg-list {
  padding: var(--s-6);
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--r-md);
}
.pkg-list--off { background: var(--stone-100); }
.pkg-list__title {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  font-size: var(--t-md);
  margin-bottom: var(--s-5);
  padding-bottom: var(--s-4);
  border-bottom: 1px solid var(--line-soft);
}
.pkg-list__title .icon { color: var(--brass-600); }
.pkg-list--off .pkg-list__title .icon { color: var(--ink-400); }
.pkg-list__items .tick { font-size: var(--t-base); }
.pkg-list__why { margin-top: var(--s-5); }
@media (max-width: 899px) { .pkg-lists { grid-template-columns: 1fr; } }

.how { grid-template-columns: repeat(3, minmax(0, 1fr)); --gap: var(--s-6); }
.how__col {
  padding: var(--s-6);
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--r-md);
}
.how__icon {
  display: inline-grid;
  place-items: center;
  width: 3rem;
  height: 3rem;
  margin-bottom: var(--s-4);
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  color: var(--brass-700);
}
.how__title { font-size: var(--t-md); margin-bottom: var(--s-4); }
.how__amount { font-family: var(--font-display); font-size: var(--t-lg); color: var(--ink-900); margin-bottom: var(--s-3); }
@media (max-width: 1023px) { .how { grid-template-columns: 1fr; } }

/* ─────────────────── Formularul de ofertă ─────────────────── */
.of-call { margin-bottom: var(--s-6); }
.of {
  padding: var(--s-6);
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--r-md);
}
.of__row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 var(--s-5); }
.of__summary { margin-bottom: var(--s-5); }
.of__status:empty { display: none; }
.of__status { margin-bottom: var(--s-5); }
.of__gdpr { margin-top: var(--s-2); }
.of__foot {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--s-4);
  padding-top: var(--s-5);
  border-top: 1px solid var(--line-soft);
}
.of__foot .btn { min-width: 14rem; }
.of__foot span { max-width: 26ch; }

/* Capcana pentru roboți: scoasă din pagină, dar nu prin `display: none`. */
.of__trap {
  position: absolute;
  left: -9999px;
  width: 1px;
  height: 1px;
  overflow: hidden;
}

/* Confirmarea trimisă prin JavaScript */
.of__done { display: grid; gap: var(--s-4); justify-items: start; }
.of__done-code {
  font-family: var(--font-display);
  font-size: var(--t-lg);
  letter-spacing: 0.08em;
  color: var(--ink-900);
}

@media (max-width: 599px) {
  .of { padding: var(--s-5); }
  .of__row { grid-template-columns: 1fr; }
  .of__foot .btn { min-width: 0; width: 100%; }
}

/* ─────────────────── Fără mișcare ─────────────────── */
@media (prefers-reduced-motion: reduce) {
  .svc-jump { position: static; }
  .cmp thead th, .moment__media { position: static; }
}