/* /preturi/ · page-only styles (components: docs/site-v3/COMPONENTS.md §7, §11, §16, §17, §18).
   Signature: the calculator rises out of the hero band on a white stage. One slider across the tiers,
   the live Start and Growth prices beside it (Growth in flat violet, the plan that leads), then the
   cards on the same lavender ground. Every number comes from the two tables marked data-preturi
   (pages/preturi.js); without JS the sliders and live prices hide and the tables carry the prices.
    1. JS / no-JS switches          6. „Vezi toate pragurile” and the price tables
    2. Hero: the toggle on the band 7. Plan cards, the free plan band
    3. The calculator stage         8. Email credits, SMS credits (coral: the SMS channel)
    4. Sliders and their scales     9. Comparison table
    5. Live prices, Enterprise     10. FAQ */


/* 1. JS / no-JS switches --------------------------------------------------------------------------
   html.js comes from the inline boot script, so there is no flash. .pr-off = the script could not read
   a price row: it falls back to the no-JS layout. */
html:not(.js) .page-preturi .pr-js,
.page-preturi .pr-off .pr-js { display: none !important; }
html.js .page-preturi #continut:not(.pr-off) .pr-nojs { display: none; }
.page-preturi .pr-num { display: inline-block; }   /* so a changed price can settle (transform) */


/* 2. Hero: the billing toggle on the band ------------------------------------------------------- */
.page-preturi .pr-hero__bar { margin-top: clamp(26px, 2.4vw, 38px); }
.page-preturi .toggle__btn { min-height: 44px; padding: 0 20px; }
.page-preturi .pr-billing { background: var(--paper); box-shadow: 0 1px 2px rgb(20 13 51 / .18), 0 16px 34px -14px rgb(20 13 51 / .6); }
.page-preturi .pr-gift {
  display: inline-block; margin-left: 8px; padding: 3px 9px;
  border-radius: 999px; background: var(--violet-tint); color: var(--violet-700);
  font-size: .8125rem; font-weight: 680; line-height: 1.25; vertical-align: 1px;
  transition: background-color .25s var(--ease), color .25s var(--ease);
}
.page-preturi .toggle__btn[aria-pressed="true"] .pr-gift { background: rgb(20 13 51 / .26); color: #fff; }
/* The toggle is a white pill on the band: its buttons keep the violet ring (not the band's white one) */
.page-preturi .pr-hero .toggle__btn:focus-visible { outline-color: var(--violet); outline-offset: 2px; }
@media (max-width: 389.98px) {
  .page-preturi .pr-hero .phero__title { font-size: 2.125rem; }
  .page-preturi .toggle__btn { padding: 0 14px; }
}


/* 3. The calculator stage: a white card rising out of the band --------------------------------- */
.page-preturi .pr-calc {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: clamp(26px, 2.6vw, 36px);
  padding: clamp(22px, 3vw, 44px);
  border-radius: var(--r-stage);
  background: #fff;
  box-shadow: var(--sh-frame);
}
@media (min-width: 900px) {
  .page-preturi .pr-calc { grid-template-columns: minmax(0, 1fr) minmax(0, 1.08fr); column-gap: clamp(36px, 4.4vw, 80px); }
  .page-preturi .pr-all { grid-column: 1 / -1; }
}
.page-preturi .pr-calc__pick { min-width: 0; align-self: start; }   /* top-aligned: the slider never moves while it is dragged */
.page-preturi .pr-calc__q {
  font-size: clamp(1.5rem, 1.15rem + 1vw, 2.125rem);
  font-weight: 760; font-stretch: var(--wd-h2); letter-spacing: -.022em; line-height: 1.12;
}
.page-preturi .pr-calc__q label { cursor: pointer; }
.page-preturi .pr-calc__nojs { margin-top: 12px; color: var(--slate); }

/* The chosen value: „până la” / 10.000 / de contacte. The row never wraps (that would move the slider
   under the thumb): the number is sized to its column, so „200.000 de contacte” fits from 320px up. */
.page-preturi .pr-value { margin-top: clamp(14px, 1.4vw, 22px); container-type: inline-size; }
.page-preturi .pr-value__pre { display: block; min-height: 1.45em; font-size: .9375rem; font-weight: 620; line-height: 1.45; color: var(--slate); }
.page-preturi .pr-value__row { display: flex; flex-wrap: nowrap; align-items: baseline; gap: 0 10px; white-space: nowrap; }
.page-preturi .pr-value__num {
  font-size: clamp(3rem, 2.1rem + 2.8vw, 4.75rem);
  font-size: min(clamp(3rem, 2.1rem + 2.8vw, 4.75rem), calc((100cqi - 8rem) / 3.45));
  font-weight: 800; font-stretch: var(--wd-num); font-variant-numeric: lining-nums tabular-nums;
  letter-spacing: -.02em; line-height: 1; color: var(--ink);
}
.page-preturi .pr-value__unit { font-size: clamp(1.125rem, 1rem + .45vw, 1.4375rem); font-weight: 650; font-stretch: var(--wd-ui); color: var(--ink-2); }


/* 4. Sliders and their scales ------------------------------------------------------------------- */
.page-preturi .pr-range-box { --thumb: 30px; --rng: var(--violet); --rng-ring: var(--violet); margin-top: clamp(16px, 1.6vw, 24px); }
.page-preturi .pr-range {
  -webkit-appearance: none; appearance: none;
  display: block; width: 100%; height: 44px; margin: 0; padding: 0;
  background: transparent; cursor: pointer;
}
.page-preturi .pr-range:focus-visible { outline: 0; }
.page-preturi .pr-range::-webkit-slider-runnable-track {
  height: 10px; border-radius: 999px;
  background:
    linear-gradient(var(--rng), var(--rng)) 0 0 / calc(var(--thumb) / 2 + (100% - var(--thumb)) * var(--p, 0)) 100% no-repeat,
    var(--violet-200);
}
.page-preturi .pr-range::-webkit-slider-thumb {
  -webkit-appearance: none; appearance: none;
  width: var(--thumb); height: var(--thumb); margin-top: calc((10px - var(--thumb)) / 2);
  border: 0; border-radius: 50%; background: #fff;
  box-shadow: inset 0 0 0 3px var(--rng-ring), 0 2px 4px rgb(42 27 110 / .2), 0 10px 20px -8px rgb(42 27 110 / .5);
  transition: transform .2s var(--ease), box-shadow .2s var(--ease);
}
.page-preturi .pr-range:active::-webkit-slider-thumb { transform: scale(1.12); }
.page-preturi .pr-range:focus-visible::-webkit-slider-thumb { box-shadow: inset 0 0 0 3px var(--rng-ring), 0 0 0 3px #fff, 0 0 0 5.5px var(--violet), 0 10px 20px -8px rgb(42 27 110 / .5); }
.page-preturi .pr-range::-moz-range-track { height: 10px; border: 0; border-radius: 999px; background: var(--violet-200); }
.page-preturi .pr-range::-moz-range-progress { height: 10px; border-radius: 999px; background: var(--rng); }
.page-preturi .pr-range::-moz-range-thumb {
  width: var(--thumb); height: var(--thumb); border: 0; border-radius: 50%; background: #fff;
  box-shadow: inset 0 0 0 3px var(--rng-ring), 0 2px 4px rgb(42 27 110 / .2), 0 10px 20px -8px rgb(42 27 110 / .5);
}
.page-preturi .pr-range:focus-visible::-moz-range-thumb { box-shadow: inset 0 0 0 3px var(--rng-ring), 0 0 0 3px #fff, 0 0 0 5.5px var(--violet); }

/* Labels under the track, at the thumb's centre for their step (pages/preturi.js builds them) */
.page-preturi .pr-scale { position: relative; height: 22px; margin-top: 2px; font-size: .8125rem; font-weight: 600; line-height: 22px; color: var(--slate); font-variant-numeric: tabular-nums; }
.page-preturi .pr-scale__mark {
  position: absolute; top: 0;
  left: calc(var(--thumb) / 2 + (100% - var(--thumb)) * var(--at, 0));
  transform: translateX(-50%);
  white-space: nowrap;
  transition: color .2s var(--ease);
}
.page-preturi .pr-scale__mark--first { transform: translateX(calc(var(--thumb) / -2)); }
.page-preturi .pr-scale__mark--last { transform: translateX(calc(-100% + var(--thumb) / 2)); }
.page-preturi .pr-scale__mark.is-on { color: var(--violet-700); font-weight: 720; }
@media (max-width: 559.98px) { .page-preturi .pr-scale__mark--minor { display: none; } }


/* 5. Live prices (Start and Growth tiles), the emails included, the Enterprise state ------------ */
.page-preturi .pr-calc__out { min-width: 0; align-self: start; }
.page-preturi .pr-swap { display: grid; }
.page-preturi .pr-swap__item { grid-area: 1 / 1; min-width: 0; transition: opacity var(--t-swap) ease, visibility 0s linear var(--t-swap); }
.page-preturi .pr-swap__item:not(.is-on) { opacity: 0; visibility: hidden; }
.page-preturi .pr-swap__item.is-on { opacity: 1; visibility: visible; transition: opacity var(--t-swap) ease; }

.page-preturi .pr-tiles { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
/* Nothing in a tile changes size with the value: the amount scales to the tile (27cqi fits „11.740 €”),
   „pe lună / pe an” sits under it and the last line keeps two lines where it could wrap. */
.page-preturi .pr-tile { min-width: 0; padding: clamp(14px, 1.8vw, 24px); border-radius: var(--r-lg); background: var(--violet-50); container-type: inline-size; }
.page-preturi .pr-tile--lead { background: var(--violet); color: #fff; box-shadow: 0 1px 2px rgb(42 27 110 / .2), 0 22px 40px -22px rgb(75 54 220 / .95); }
.page-preturi .pr-tile__name { font-size: 1.0625rem; font-weight: 700; font-stretch: var(--wd-h3); line-height: 1.3; }
.page-preturi .pr-tile__price { display: flex; flex-direction: column; align-items: flex-start; gap: 6px; margin-top: clamp(10px, 1.2vw, 16px); }
.page-preturi .pr-tile__amount {
  font-size: min(clamp(2rem, 1.5rem + 1.6vw, 3.25rem), 27cqi);
  font-weight: 800; font-stretch: var(--wd-num); font-variant-numeric: lining-nums tabular-nums;
  letter-spacing: -.02em; line-height: 1; white-space: nowrap;
}
.page-preturi .pr-tile__per { font-size: .9375rem; font-weight: 620; line-height: 1.3; color: var(--slate); }
.page-preturi .pr-tile__line { min-height: 1.5em; margin-top: 10px; font-size: .9375rem; line-height: 1.5; color: var(--slate); }
@container (max-width: 210px) {
  .page-preturi .pr-tile__line { min-height: 3em; font-size: .875rem; }
}
.page-preturi .pr-tile--lead :is(.pr-tile__per, .pr-tile__line) { color: #fff; }
.page-preturi .pr-badge {
  display: inline-flex; align-items: center; min-height: 24px; padding: 2px 10px;
  border-radius: 999px; background: #fff; color: var(--violet-700);
  font-size: .75rem; font-weight: 700; font-stretch: var(--wd-ui); letter-spacing: .01em; line-height: 1.2;
}
.page-preturi .pr-emails { display: flex; align-items: flex-start; gap: 12px; margin-top: 18px; font-size: .9375rem; line-height: 1.45; color: var(--ink-2); }
.page-preturi .pr-emails .ico { margin-top: 2px; }
.page-preturi .pr-emails__main { display: block; color: var(--ink); }
.page-preturi .pr-emails strong { font-weight: 720; }
.page-preturi .pr-emails__sub { display: block; font-size: .875rem; color: var(--slate); }
/* „sau gratuit, cu 5.000 de emailuri pe lună”: only on the first tier; its line is always kept */
.page-preturi .pr-free-line { min-height: 1.6em; margin-top: 12px; padding-left: 48px; font-size: .9375rem; line-height: 1.6; }
.page-preturi .pr-free-line .link { display: none; padding-block: 5px; }   /* a 26px hit area, only when it applies */
.page-preturi .pr-is-free .pr-free-line .link { display: inline; }
@media (max-width: 559.98px) { .page-preturi .pr-free-line { min-height: 3.2em; } }   /* two lines on phones */

.page-preturi .pr-ent {
  display: flex; flex-direction: column; justify-content: center; align-items: flex-start;
  padding: clamp(18px, 2vw, 28px); border-radius: var(--r-lg);
  background: var(--violet); color: #fff;
  box-shadow: 0 1px 2px rgb(42 27 110 / .2), 0 22px 40px -22px rgb(75 54 220 / .95);
}
.page-preturi .pr-ent__kicker { font-size: .875rem; font-weight: 650; line-height: 1.3; }
.page-preturi .pr-ent__title { margin-top: 4px; font-size: clamp(1.75rem, 1.35rem + 1.1vw, 2.5rem); font-weight: 780; font-stretch: var(--wd-display); letter-spacing: -.026em; line-height: 1.1; }
.page-preturi .pr-ent__text { max-width: 26em; margin-top: 6px; font-size: .9375rem; line-height: 1.5; }
.page-preturi .pr-ent .btn { margin-top: 14px; }
.page-preturi .pr-ent .btn:focus-visible { box-shadow: 0 0 0 3px var(--violet), 0 0 0 5.5px #fff; }

@media (max-width: 559.98px) {
  .page-preturi .pr-tiles { gap: 10px; }
  .page-preturi .pr-tile__per { font-size: .875rem; }
}


/* 6. „Vezi toate pragurile” and the price tables ----------------------------------------------- */
.page-preturi .pr-all { border-radius: var(--r-lg); background: var(--violet-50); }
.page-preturi .pr-all__sum {
  display: flex; align-items: center; justify-content: space-between; gap: 16px;
  min-height: 56px; padding: 10px 14px 10px 22px; border-radius: var(--r-lg);
  list-style: none; cursor: pointer;
  font-size: 1rem; font-weight: 650; font-stretch: var(--wd-ui); color: var(--ink);
  transition: color .2s var(--ease);
}
.page-preturi .pr-all__sum::-webkit-details-marker { display: none; }
.page-preturi .pr-all__sum::after {
  content: ""; flex: none; width: 34px; height: 34px; border-radius: 50%;
  background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4 6l4 4 4-4' fill='none' stroke='%234930D6' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 15px no-repeat;
  box-shadow: 0 1px 2px rgb(42 27 110 / .12);
  transition: transform .3s var(--ease);
}
.page-preturi .pr-all[open] > .pr-all__sum::after { transform: rotate(180deg); }
.page-preturi .pr-all__sum:hover { color: var(--violet-700); }
.page-preturi .pr-all__sum:focus-visible { border-radius: var(--r-lg); outline-offset: 2px; }
.page-preturi .pr-all__body { padding: 0 clamp(8px, 1.6vw, 18px) clamp(10px, 1.6vw, 18px); }

.page-preturi .pr-table {
  width: 100%; border-collapse: separate; border-spacing: 0;
  font-size: .9375rem; line-height: 1.4; font-variant-numeric: lining-nums tabular-nums;
}
.page-preturi .pr-table caption { caption-side: top; padding: 2px 6px 12px; text-align: left; font-size: .9375rem; color: var(--slate); }
.page-preturi .pr-table :is(th, td) { padding: 10px 16px; text-align: right; white-space: nowrap; }
.page-preturi .pr-table thead th { padding-block: 12px; font-size: .875rem; font-weight: 680; font-stretch: var(--wd-ui); color: var(--slate); }
.page-preturi .pr-table :is(thead th:first-child, tbody th) { text-align: left; }
.page-preturi .pr-table tbody th { font-weight: 640; }
.page-preturi .pr-table tbody tr > * { border-top: 1px solid var(--line); }
.page-preturi .pr-table tbody tr[data-peste] td { white-space: normal; }
.page-preturi .pr-table tbody tr.is-current > * { border-top-color: transparent; }
.page-preturi .pr-table tbody tr.is-current + tr > * { border-top-color: transparent; }
.page-preturi .pr-table tbody tr > :first-child { border-radius: 12px 0 0 12px; }
.page-preturi .pr-table tbody tr > :last-child { border-radius: 0 12px 12px 0; }
.page-preturi .pr-table--tiers { border-radius: var(--r-md); background: #fff; box-shadow: inset 0 0 0 1px var(--line); }
.page-preturi .pr-table--tiers caption { padding-top: 6px; }
.page-preturi .pr-table--tiers tbody tr.is-current > * { background: var(--violet-tint); color: var(--violet-700); font-weight: 700; }
.page-preturi .pr-table--tiers tbody tr.is-current .link { color: var(--violet-700); }


/* 7. Plan cards: Start, Growth (flat violet, it leads), Enterprise ------------------------------ */
@media (min-width: 1100px) {
  .page-preturi .pr-plans__head { flex-wrap: nowrap; }
  .page-preturi .pr-plans__head .section-head__text { flex: 1 1 auto; min-width: 0; }
  .page-preturi .pr-plans__aside { flex: none; }
}
.page-preturi .pr-plans__head .lede { min-height: 1.5em; }
.page-preturi .pr-plans__aside .toggle { background: #fff; box-shadow: inset 0 0 0 1px var(--line), var(--sh-1); }

.page-preturi .pr-plans__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; align-items: stretch; }
.page-preturi .pr-plan { padding: clamp(24px, 2.4vw, 34px); }
.page-preturi .pr-plan__ico { margin-bottom: 18px; }
.page-preturi .pr-plan__icons { display: flex; gap: 6px; margin-bottom: 18px; }
.page-preturi .pr-plan__icons .ico { width: 48px; height: 48px; border-radius: 14px; }
.page-preturi .pr-plan__icons .ico svg { width: 22px; height: 22px; }
.page-preturi .pr-plan .plan__name { font-size: clamp(1.375rem, 1.2rem + .5vw, 1.625rem); }
.page-preturi .pr-plan__title { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; }
.page-preturi .pr-plan__price { margin-top: var(--s5); }
.page-preturi .pr-plan .plan__price { margin-top: 0; }
.page-preturi .pr-plan .plan__amount { font-size: clamp(2.5rem, 2rem + 1.5vw, 3.375rem); white-space: nowrap; }
.page-preturi .pr-plan .plan__amount--text { font-size: clamp(1.75rem, 1.5rem + 1vw, 2.25rem); white-space: normal; }
.page-preturi .pr-plan .plan__per { font-weight: 600; }
.page-preturi .pr-plan .plan__note { min-height: 3em; margin-top: 10px; font-size: .9375rem; line-height: 1.5; }
.page-preturi .pr-plan .plan__note.pr-nojs { min-height: 0; margin-top: var(--s5); }

.page-preturi .pr-list { display: grid; gap: 11px; margin-top: var(--s5); padding-top: var(--s5); border-top: 1px solid var(--line); }
.page-preturi .pr-list > li { position: relative; padding-left: 32px; font-size: .9375rem; line-height: 1.45; }
.page-preturi .pr-list > li::before {
  content: ""; position: absolute; left: 0; top: 0;
  width: 21px; height: 21px; border-radius: 50%;
  background: var(--violet-100) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14'%3E%3Cpath d='M3.4 7.3l2.3 2.3 4.9-5' fill='none' stroke='%234930D6' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 12px no-repeat;
}
.page-preturi .pr-list__lead { margin-top: var(--s5); padding-top: var(--s5); border-top: 1px solid var(--line); font-weight: 680; font-stretch: var(--wd-ui); }
.page-preturi .pr-list__lead + .pr-list { margin-top: 14px; padding-top: 0; border-top: 0; }
.page-preturi .pr-plan__fine { margin-top: 18px; font-size: .875rem; line-height: 1.5; }
.page-preturi .pr-plan .plan__cta { padding-top: var(--s6); }

/* Growth leads: flat brand violet, white type, a little taller than its neighbours */
.page-preturi .pr-plan--lead { background: var(--violet); color: #fff; box-shadow: 0 1px 2px rgb(42 27 110 / .2), 0 44px 80px -40px rgb(75 54 220 / .9); }
.page-preturi .pr-plan--lead :is(.plan__meta, .plan__per, .plan__note, .pr-plan__fine, .pr-list__lead) { color: #fff; }
.page-preturi .pr-plan--lead :is(.pr-list, .pr-list__lead) { border-top-color: rgb(255 255 255 / .3); }
.page-preturi .pr-plan--lead .pr-list__lead + .pr-list { border-top: 0; }
.page-preturi .pr-plan--lead .pr-list > li::before {
  background-color: rgb(255 255 255 / .2);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14'%3E%3Cpath d='M3.4 7.3l2.3 2.3 4.9-5' fill='none' stroke='%23FFFFFF' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}
.page-preturi .pr-plan--lead .link { color: #fff; text-decoration-color: rgb(255 255 255 / .5); }
.page-preturi .pr-plan--lead :focus-visible { outline-color: #fff; }
.page-preturi .pr-plan--lead .btn:focus-visible { box-shadow: 0 0 0 3px var(--violet), 0 0 0 5.5px #fff; }
.page-preturi .pr-plan--lead ::selection { background: #fff; color: var(--night); }
@media (min-width: 1100px) {
  .page-preturi .pr-plans__grid { padding-block: 16px; }
  .page-preturi .pr-plan--lead { margin-block: -16px; padding-block: calc(clamp(24px, 2.4vw, 34px) + 16px); }
}
.page-preturi .pr-plans__note { margin-top: clamp(28px, 2.4vw, 40px); }

/* The free plan: a slim white band under the cards (name · what it includes · its button) */
.page-preturi .pr-free {
  display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 16px clamp(24px, 3vw, 48px);
  margin-top: clamp(28px, 2.6vw, 44px); padding: clamp(18px, 1.8vw, 24px) clamp(20px, 2.4vw, 34px);
  border-radius: var(--r-xl); background: #fff; box-shadow: inset 0 0 0 1px var(--line), var(--sh-1);
}
.page-preturi .pr-free__name { display: flex; align-items: center; gap: 14px; }
.page-preturi .pr-free__name .plan__name { font-size: clamp(1.375rem, 1.2rem + .5vw, 1.625rem); }
.page-preturi .pr-free__text { max-width: 46em; color: var(--ink-2); line-height: 1.5; }
@media (max-width: 899.98px) {
  .page-preturi .pr-free { grid-template-columns: minmax(0, 1fr); justify-items: start; }
}
@media (max-width: 519.98px) {
  .page-preturi .pr-free__cta { width: 100%; }
}

/* Tablets: Start and Growth side by side, Enterprise across the row with its list in two columns */
@media (min-width: 760px) and (max-width: 1099.98px) {
  .page-preturi .pr-plans__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .page-preturi .pr-plan:last-child { grid-column: 1 / -1; }
  .page-preturi .pr-plan:last-child .pr-list { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 32px; }
  .page-preturi .pr-plan:last-child .plan__cta { max-width: 340px; }
}
@media (max-width: 759.98px) {
  .page-preturi .pr-plans__grid { grid-template-columns: minmax(0, 1fr); gap: 16px; }
  .page-preturi .pr-plans__aside { margin-top: -4px; }
  .page-preturi .pr-plan .plan__note { min-height: 1.5em; }
}


/* 8. Credits: the pack picker (left) and the pack table (right) --------------------------------- */
.page-preturi .pr-credits__grid { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: clamp(28px, 4vw, 64px); align-items: start; }
.page-preturi .pr-pack { padding: clamp(24px, 2.8vw, 40px); border-radius: var(--r-xl); box-shadow: inset 0 0 0 1px var(--line), var(--sh-2); }
.page-preturi .pr-pack__q { font-size: var(--fs-h3); font-weight: 680; }
.page-preturi .pr-pack__q label { cursor: pointer; }
.page-preturi .pr-value--pack { margin-top: 14px; }
.page-preturi .pr-value--pack .pr-value__num {
  font-size: clamp(2.5rem, 1.9rem + 1.9vw, 3.75rem);
  font-size: min(clamp(2.5rem, 1.9rem + 1.9vw, 3.75rem), calc((100cqi - 7.5rem) / 4.3));
}
/* Price over its rate, each on a line of fixed height: nothing moves between packs */
.page-preturi .pr-pack__result { --pp: clamp(2.25rem, 1.8rem + 1.5vw, 3.125rem); display: flex; flex-direction: column; align-items: flex-start; gap: 8px; margin-top: 22px; padding-top: 22px; border-top: 1px solid var(--line); }
.page-preturi .pr-pack__price {
  font-size: var(--pp); line-height: var(--pp);
  font-weight: 800; font-stretch: var(--wd-num); font-variant-numeric: lining-nums tabular-nums;
  letter-spacing: -.02em; white-space: nowrap; color: var(--violet-700);
}
.page-preturi .pr-pack__rate { font-weight: 620; line-height: 1.5; color: var(--slate); }
.page-preturi .pr-pack .pr-nojs { margin-top: 10px; color: var(--slate); }
.page-preturi .pr-pack__cta { margin-top: 26px; }
.page-preturi .pr-pack__note { margin-top: 14px; }

.page-preturi .pr-packs { padding: 6px clamp(6px, 1.4vw, 16px); border-radius: var(--r-xl); background: var(--violet-50); }
.page-preturi .pr-table--packs tbody tr > * { transition: background-color .25s var(--ease), color .25s var(--ease); }
.page-preturi .pr-table--packs tbody tr.is-current > * { background: var(--violet); color: #fff; }
.page-preturi .pr-table--packs thead th:first-child { padding-left: 16px; }
.page-preturi .pr-table__sub { display: block; margin-top: 2px; font-size: .8125rem; font-weight: 500; white-space: normal; color: var(--slate); }

/* SMS: the same picker and table, in the SMS channel's coral (coral fills, coral-ink text: AA) */
.page-preturi .pr-pack--sms .pr-range-box { --rng: var(--coral); --rng-ring: var(--coral-ink); }
.page-preturi .pr-pack--sms .pr-scale__mark.is-on { color: var(--coral-ink); }
.page-preturi .pr-pack--sms .pr-pack__price { color: var(--coral-ink); }
.page-preturi .pr-pack__bonus { min-height: 1.5em; font-size: .9375rem; font-weight: 620; line-height: 1.5; color: var(--slate); }
.page-preturi .pr-has-bonus .pr-pack__bonus { font-weight: 720; color: var(--coral-ink); }
.page-preturi .pr-sms__side { display: grid; gap: var(--s4); }
.page-preturi .pr-packs--sms { background: var(--coral-tint); }
.page-preturi .pr-table--sms tbody tr > * { border-top-color: rgb(184 67 31 / .14); transition: background-color .25s var(--ease), color .25s var(--ease); }
.page-preturi .pr-table--sms tbody tr.is-current > * { background: #fff; color: var(--coral-ink); font-weight: 700; }
.page-preturi .pr-table--sms tbody tr.is-current .pr-table__sub { color: var(--coral-ink); }
.page-preturi .pr-sms__note { max-width: 40em; }
@media (max-width: 899.98px) {
  .page-preturi .pr-credits__grid { grid-template-columns: minmax(0, 1fr); }
}
/* Desktop: the email-credit picker stays in view beside its long pack table */
@media (min-width: 900px) {
  .page-preturi .pr-credits .pr-pack { position: sticky; top: calc(var(--header-h) + 24px); }
}
@media (max-width: 519.98px) {
  .page-preturi .pr-pack__cta .btn { width: 100%; }
  .page-preturi .pr-table :is(th, td) { padding-inline: 10px; }
}


/* 9. Comparison: a real table; below 760px each row becomes a block under sticky plan names ----- */
.page-preturi .pr-cmp__box { padding: 4px clamp(14px, 2.4vw, 36px) clamp(14px, 1.6vw, 22px); border-radius: var(--r-xl); background: #fff; box-shadow: var(--sh-2); }
.page-preturi .pr-cmp__table { width: 100%; border-collapse: collapse; font-size: .9375rem; line-height: 1.45; }
.page-preturi .pr-cmp__table thead :is(th, td) {
  position: sticky; top: var(--header-h); z-index: 1;
  padding: 20px 12px 16px; background: #fff;
  box-shadow: 0 1px 0 var(--line);
}
.page-preturi .pr-cmp__table thead th { font-size: 1.0625rem; font-weight: 720; font-stretch: var(--wd-h3); text-align: center; }
.page-preturi .pr-cmp__table thead th:nth-child(3) { color: var(--violet-700); }
.page-preturi .pr-cmp__table tbody th[scope="row"] { width: 44%; padding: 14px 16px 14px 0; text-align: left; font-weight: 560; }
.page-preturi .pr-cmp__table tbody td { padding: 14px 12px; text-align: center; color: var(--ink-2); }
.page-preturi .pr-cmp__table tbody td:nth-child(3) { background: var(--violet-50); }
.page-preturi .pr-cmp__table tbody tr:not(.pr-cmp__group) + tr:not(.pr-cmp__group) > * { border-top: 1px solid var(--line); }
.page-preturi .pr-cmp__group th {
  padding: 28px 0 10px; text-align: left;
  font-size: .875rem; font-weight: 720; font-stretch: var(--wd-ui); color: var(--violet-700);
}
.page-preturi .pr-cmp__table tbody:first-of-type .pr-cmp__group th { padding-top: 22px; }
.page-preturi .pr-yes, .page-preturi .pr-no {
  display: inline-block; width: 26px; height: 26px; border-radius: 50%;
  font-size: 0; line-height: 0; color: transparent; vertical-align: middle;
}
.page-preturi .pr-yes { background: var(--violet-100) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14'%3E%3Cpath d='M3.4 7.3l2.3 2.3 4.9-5' fill='none' stroke='%234930D6' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 14px no-repeat; }
.page-preturi .pr-no { background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14'%3E%3Cpath d='M4 7h6' fill='none' stroke='%23847E9C' stroke-width='1.7' stroke-linecap='round'/%3E%3C/svg%3E") center / 14px no-repeat; }

@media (max-width: 759.98px) {
  .page-preturi .pr-cmp__box { padding: 0 16px 10px; }
  .page-preturi .pr-cmp__table,
  .page-preturi .pr-cmp__table :is(caption, thead, tbody, tr, th, td) { display: block; }
  .page-preturi .pr-cmp__table caption { display: none; }
  .page-preturi .pr-cmp__table thead tr {
    display: grid; grid-template-columns: repeat(3, minmax(0, 1fr));
    position: sticky; top: var(--header-h); z-index: 1;
    margin-inline: -16px; padding-inline: 16px;
    border-radius: var(--r-xl) var(--r-xl) 0 0;
    background: #fff; box-shadow: 0 1px 0 var(--line);
  }
  .page-preturi .pr-cmp__table thead :is(th, td) { position: static; padding: 18px 4px 14px; box-shadow: none; font-size: .9375rem; }
  .page-preturi .pr-cmp__corner { display: none !important; }
  .page-preturi .pr-cmp__table tbody tr { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .page-preturi .pr-cmp__table tbody th[scope="row"] { grid-column: 1 / -1; width: auto; padding: 14px 0 4px; }
  .page-preturi .pr-cmp__table tbody td { padding: 6px 4px 14px; font-size: .875rem; }
  .page-preturi .pr-cmp__table tbody td:nth-child(3) { background: none; }
  .page-preturi .pr-cmp__table tbody tr:not(.pr-cmp__group) + tr:not(.pr-cmp__group) > * { border-top: 0; }
  .page-preturi .pr-cmp__table tbody tr:not(.pr-cmp__group) + tr:not(.pr-cmp__group) { border-top: 1px solid var(--line); }
  .page-preturi .pr-cmp__group th { grid-column: 1 / -1; padding: 22px 0 4px; }
}


/* 10. FAQ: title and an illustrative photo on the left, the questions on the right -------------- */
.page-preturi .pr-faq__grid {
  display: grid;
  grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
  grid-template-areas: "title list" "photo list";
  grid-template-rows: auto 1fr;
  gap: var(--s6) clamp(40px, 5vw, 88px);
  align-items: start;
}
.page-preturi .pr-faq__title { grid-area: title; }
.page-preturi .pr-faq__list { grid-area: list; }
.page-preturi .pr-faq__photo { grid-area: photo; margin: 0; max-width: 488px; }
.page-preturi .pr-faq__photo .note { margin-top: var(--s3); }
.page-preturi .pr-faq .faq__item { box-shadow: inset 0 0 0 1px var(--line), var(--sh-1); }
.page-preturi .pr-faq .faq__item[open] { box-shadow: inset 0 0 0 1.5px var(--violet-200), var(--sh-2); }
@media (max-width: 899.98px) {
  .page-preturi .pr-faq__grid { grid-template-columns: minmax(0, 1fr); grid-template-areas: "title" "list" "photo"; grid-template-rows: none; }
  .page-preturi .pr-faq__photo { max-width: 520px; margin-top: var(--s4); }
}