/* Teenused ja hinnad — „läbipaistev arvestus“: kassakviitung, jaotusribad, õmblusjoonega tingimused.
   Ainult tokenid, varjudeta. Liikumine ainult transform/opacity abil ja ainult .has-motion all
   (app.js lisab selle, kui kasutaja ei eelista vähendatud liikumist). */

/* ---------- Hero ---------- */
.pricing-hero {
  position: relative; overflow: hidden;
  padding-block: var(--space-7) var(--space-6);
  border-bottom: 1px solid var(--color-border);
  background: var(--color-bg);
}
.pricing-hero__grid { display: grid; gap: var(--space-7); grid-template-columns: minmax(0, 1fr); align-items: center; }
.pricing-hero__copy h1 { max-width: 12ch; margin-bottom: var(--space-4); font-size: clamp(2.75rem, 1.6rem + 4.4vw, 5.25rem); line-height: 0.96; }
.pricing-hero__copy .lead { max-width: 52ch; margin: 0; }
.pricing-hero__promises { display: grid; gap: var(--space-2); margin: var(--space-5) 0 0; padding: 0; list-style: none; }
.pricing-hero__promises li { display: flex; align-items: center; gap: var(--space-3); font-size: var(--fs-sm); color: var(--color-text-soft); }
.pricing-hero__promises .icon { flex: 0 0 auto; width: 32px; height: 32px; padding: 7px; border-radius: 50%; color: var(--color-primary-active); background: var(--color-primary-soft); }
@media (min-width: 960px) {
  .pricing-hero { padding-block: var(--space-8) var(--space-7); }
  .pricing-hero__grid { grid-template-columns: minmax(0, 6fr) minmax(0, 5fr); gap: var(--space-8); }
}

/* ---------- Kviitungi printer (aside.pricing-example) ---------- */
.pricing-example { display: grid; gap: var(--space-3); justify-items: center; max-width: 420px; width: 100%; justify-self: center; }
.receipt-picker { display: flex; flex-wrap: wrap; justify-content: center; gap: var(--space-1); padding: var(--space-1); border: 1px solid var(--color-border); border-radius: var(--radius-pill); background: var(--color-surface); }
.receipt-picker__btn {
  min-height: 36px; padding: 0 var(--space-3);
  font: inherit; font-size: var(--fs-xs); font-weight: var(--fw-medium); color: var(--color-text-soft);
  background: transparent; border: 0; border-radius: var(--radius-pill); cursor: pointer;
  transition: background-color var(--dur-fast) var(--ease), color var(--dur-fast) var(--ease);
}
.receipt-picker__btn:hover { color: var(--color-text); background: var(--color-bg-alt); }
.receipt-picker__btn[aria-pressed="true"] { color: var(--color-on-primary); background: var(--color-primary); }
.receipt-picker__btn:focus-visible { outline: 2px solid var(--color-focus); outline-offset: 2px; }

.receipt-printer { position: relative; width: 100%; padding-top: 10px; }
.receipt-printer__mouth { position: absolute; z-index: 2; top: 0; left: -3%; right: -3%; height: 18px; border-radius: var(--radius-pill); background: var(--color-text); }
.receipt-printer__mouth::after { content: ""; position: absolute; left: 6%; right: 6%; top: 7px; height: 4px; border-radius: var(--radius-pill); background: var(--color-text-soft); }
.receipt-printer__paper { position: relative; overflow: hidden; margin-inline: 4%; padding-top: 8px; }

/* Ühine kviitungi pind (hero + kalkulaatori tulemus) */
.receipt {
  --zig: 9px;
  position: relative;
  display: grid; gap: var(--space-3);
  padding: var(--space-5) var(--space-5) calc(var(--space-5) + var(--zig));
  background:
    repeating-linear-gradient(0deg, transparent 0 27px, var(--color-bg-alt) 27px 28px),
    var(--color-surface);
  border: 1px solid var(--color-border);
  border-bottom: 0;
  /* Sakiline alumine serv – mask ainult märksõnavärvidega (black/transparent). */
  mask: conic-gradient(from -45deg at bottom, transparent, black 1deg 89deg, transparent 90deg) 50% / calc(2 * var(--zig)) 100%;
}
.receipt > * { margin: 0; }
.receipt__brand { text-align: center; font-size: var(--fs-sm); font-weight: var(--fw-semibold); letter-spacing: var(--ls-brand); }
.receipt__title { padding-bottom: var(--space-3); border-bottom: 1px dashed var(--color-border-strong); text-align: center; font-family: var(--font-mono); font-size: var(--fs-xs); font-weight: var(--fw-regular); letter-spacing: 0.04em; text-transform: uppercase; color: var(--color-text-muted); }
.receipt__lines { display: grid; gap: var(--space-2); margin: 0; font-family: var(--font-mono); font-size: var(--fs-sm); }
.receipt__lines > div { display: flex; align-items: baseline; gap: var(--space-2); }
.receipt__lines > div::after { content: ""; order: 1; flex: 1 1 auto; min-width: var(--space-4); border-bottom: 1px dotted var(--color-border-strong); transform: translateY(-4px); }
.receipt__lines dt { order: 0; color: var(--color-text-soft); }
.receipt__lines dd { order: 2; margin: 0; white-space: nowrap; color: var(--color-text); }
.receipt__sub { display: block; font-size: var(--fs-xs); color: var(--color-text-muted); }
.receipt__total { display: flex; align-items: baseline; justify-content: space-between; gap: var(--space-3); padding-top: var(--space-3); border-top: 1px dashed var(--color-border-strong); }
.receipt__total > span { font-size: var(--fs-sm); color: var(--color-text-soft); }
.receipt__total strong { font-family: var(--font-editorial); font-synthesis: none; font-weight: 400; font-size: clamp(2.5rem, 2rem + 2vw, 3.5rem); line-height: 1; letter-spacing: -0.01em; color: var(--color-primary-active); }
.receipt__note { text-align: center; }
.receipt__barcode {
  justify-self: center; display: block; width: 70%; height: 34px;
  background: repeating-linear-gradient(90deg,
    var(--color-text) 0 2px, transparent 2px 4px, var(--color-text) 4px 5px, transparent 5px 8px,
    var(--color-text) 8px 11px, transparent 11px 12px, var(--color-text) 12px 13px, transparent 13px 16px);
  opacity: 0.75;
}
.pricing-example__load { justify-self: center; }

/* Printimine: paber libiseb printerist välja */
.has-motion .receipt.is-printing { animation: receipt-print 900ms cubic-bezier(0.2, 0.7, 0.2, 1) both; }
@keyframes receipt-print { from { transform: translateY(-100%); } }

/* ---------- Paketikaardid ---------- */
.pricing__packages { padding-top: var(--space-7); }
.pricing__cards {
  display: grid; gap: var(--space-4); align-items: stretch;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 250px), 1fr));
}
@media (min-width: 1100px) {
  .pricing__cards { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .pricing-card .price-card__name { min-height: calc(2em * var(--lh-snug)); }
}
.pricing-card { isolation: isolate; gap: var(--space-3); padding: var(--space-6) var(--space-5) var(--space-5); transition: border-color var(--dur-fast) var(--ease), transform var(--dur) var(--ease); }
.pricing-card > :not(.price-card__ribbon):not(.pricing-card__glow) { position: relative; z-index: 1; }
/* Pärast sisseilmumist: hover reageerib kohe (ilma ilmumise viivituseta). */
.has-motion .pricing-card.is-visible { transition: opacity 650ms var(--ease), transform var(--dur) var(--ease), border-color var(--dur-fast) var(--ease); }
/* Valguslaik hiire järgi */
.pricing-card::before {
  content: ""; position: absolute; inset: 0; z-index: 0; border-radius: inherit; pointer-events: none;
  background: radial-gradient(260px circle at var(--mx, 50%) var(--my, 0%), var(--color-primary-soft), transparent 70%);
  opacity: 0; transition: opacity var(--dur) var(--ease);
}
@media (hover: hover) {
  .pricing-card:hover { border-color: var(--color-primary); }
  .pricing-card:hover::before { opacity: 1; }
  .has-motion .pricing-card:hover { transform: translateY(-4px); }
}
.pricing-card .price-card__name { font-size: var(--fs-lg); line-height: var(--lh-snug); }
.pricing-card__keep { display: grid; gap: 2px; margin: 0; }
.pricing-card__keep-label { font-size: var(--fs-xs); font-weight: var(--fw-medium); letter-spacing: var(--ls-caps); text-transform: uppercase; color: var(--color-text-muted); }
.pricing-card .price-card__amount { font-size: clamp(3rem, 2.2rem + 2.4vw, 4.25rem); color: var(--color-primary-active); }
.pricing-card__split { display: flex; gap: 2px; height: 8px; }
.pricing-card__split > span { flex: var(--w) 1 0; border-radius: var(--radius-pill); transform-origin: left; }
.pricing-card__you { background: var(--color-primary); }
.pricing-card__fee { background: var(--color-border-strong); }
.has-motion .pricing-card .pricing-card__split > span { transform: scaleX(0); transition: transform 900ms var(--ease) calc(var(--i, 0) * 90ms + 250ms); }
.has-motion .pricing-card.is-visible .pricing-card__split > span { transform: none; }
.has-motion .pricing-card .pricing-card__fee { transition-delay: calc(var(--i, 0) * 90ms + 500ms); }
.pricing-card .price-card__unit { margin: 0; font-size: var(--fs-sm); color: var(--color-text-soft); }
.pricing-card .price-card__unit strong { font-weight: var(--fw-semibold); color: var(--color-text); }
.pricing-card__extra { display: block; color: var(--color-text-muted); }
.pricing-card .sample-tag { align-self: flex-start; }
.pricing-card .price-card__desc { font-size: var(--fs-sm); padding-top: var(--space-3); border-top: 1px solid var(--color-border); }
.pricing-card .price-card__list { align-content: start; }
.pricing-card .price-card__ribbon { z-index: 2; }

/* Soovitatud pakett: aeglaselt tiirlev Salvei ääris (pöörlev kiht, mask jätab nähtavaks ainult serva) */
.price-card--featured { border-color: transparent; }
.pricing-card__glow {
  position: absolute; inset: -1px; z-index: 0; border-radius: inherit; pointer-events: none; overflow: hidden;
  padding: 1.5px;
  mask: linear-gradient(black 0 0) content-box exclude, linear-gradient(black 0 0);
  -webkit-mask: linear-gradient(black 0 0) content-box, linear-gradient(black 0 0);
  -webkit-mask-composite: xor;
}
.pricing-card__glow::before {
  content: ""; position: absolute; inset: -50%;
  background: conic-gradient(var(--color-primary), var(--color-gold) 18%, var(--color-primary-soft-2) 36%, var(--color-primary) 55%, var(--color-gold) 75%, var(--color-primary));
}
@media (prefers-reduced-motion: no-preference) {
  .pricing-card__glow::before { animation: price-glow 7s linear infinite; }
}
@keyframes price-glow { to { transform: rotate(1turn); } }

.pricing__cta { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2) var(--space-4); margin: var(--space-6) 0 0; }

/* ---------- Tingimused: õmblusjoonega silditud jada ---------- */
.pricing-terms .section__head { max-width: 640px; }
.terms { position: relative; display: grid; gap: var(--space-4); margin: 0; padding: 0; list-style: none; grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr)); }
.terms__item {
  position: relative; display: grid; gap: var(--space-2); align-content: start;
  padding: var(--space-5) var(--space-4) var(--space-4);
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  outline: 1px dashed var(--color-border-strong); outline-offset: -7px;
}
.terms__item > p, .terms__item > dl { margin: 0; color: var(--color-text-muted); font-size: var(--fs-sm); }
.terms__item > p.small { margin-top: var(--space-1); }
.terms__num { position: absolute; top: var(--space-3); right: var(--space-4); font-family: var(--font-editorial); font-size: var(--fs-2xl); line-height: 1; color: var(--color-border-strong); }
.terms__icon { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; background: var(--color-primary-soft); color: var(--color-primary-active); }
.terms__icon .icon { width: 20px; height: 20px; }
.terms__title { margin: var(--space-1) 0 0; font-size: var(--fs-md); font-weight: var(--fw-semibold); letter-spacing: 0; line-height: var(--lh-snug); }
.terms__mins { display: grid; gap: var(--space-2); margin: var(--space-1) 0 0; }
.terms__mins > div { display: grid; gap: 2px; }
.terms__mins dt { font-size: var(--fs-xs); color: var(--color-text-muted); }
.terms__mins dd { display: flex; align-items: center; gap: var(--space-2); margin: 0; font-weight: var(--fw-medium); color: var(--color-text); }
.terms__dots { display: flex; flex-wrap: nowrap; gap: 3px; }
.terms__dots i { flex: 0 0 auto; width: 5px; height: 5px; border-radius: 50%; background: var(--color-primary); }
@media (min-width: 1100px) {
  .terms { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  /* Õmblusniit seob sildid ühte ritta ja „õmmeldakse“ kerimisel */
  .terms::before { content: ""; position: absolute; z-index: 0; left: 4%; right: 4%; top: 45px; border-top: 2px dashed var(--color-primary-soft-2); transform-origin: left; }
  .has-motion .terms::before { transform: scaleX(0); transition: transform 1400ms var(--ease) 200ms; }
  .has-motion .terms.is-visible::before { transform: none; }
}
@media (max-width: 599px) {
  .terms { padding-left: var(--space-5); }
  .terms::before { content: ""; position: absolute; left: 8px; top: var(--space-4); bottom: var(--space-4); border-left: 2px dashed var(--color-primary-soft-2); }
}

/* ---------- Kalkulaator ---------- */
.pricing-calc { scroll-margin-top: var(--header-h); outline: none; }
.calc { display: grid; gap: var(--space-5); align-content: start; }
.calc .fieldset .field__label { display: block; margin-bottom: var(--space-2); }
.calc__packages { grid-template-columns: repeat(auto-fit, minmax(min(100%, 170px), 1fr)); gap: var(--space-2); }
.calc__packages .choice-card__body { display: grid; gap: 2px; padding: var(--space-3) var(--space-3) var(--space-3) calc(var(--space-3) + 26px); border-radius: var(--radius-md); }
.calc__packages .choice-card__body::before { top: calc(var(--space-3) + 3px); left: var(--space-3); }
.calc__packages .choice-card__title { font-size: var(--fs-sm); }
.calc__packages .choice-card__desc { font-size: var(--fs-xs); }
.calc__packages input:checked + .choice-card__body { background: var(--color-primary-soft); }

.calc-stepper { display: grid; grid-template-columns: 44px minmax(0, 1fr) 44px; gap: var(--space-1); align-items: stretch; }
.calc-stepper .input { text-align: center; font-variant-numeric: tabular-nums; }
.calc-step {
  min-height: var(--control-h); font: inherit; font-size: var(--fs-lg); line-height: 1; color: var(--color-text);
  background: var(--color-surface); border: 1px solid var(--color-border-strong); border-radius: 50%; cursor: pointer;
  transition: background-color var(--dur-fast) var(--ease), border-color var(--dur-fast) var(--ease), transform var(--dur-fast) var(--ease);
}
.calc-step:hover { background: var(--color-primary-soft); border-color: var(--color-primary); }
.calc-step:active { transform: scale(0.92); }
.calc-step:focus-visible { outline: 2px solid var(--color-focus); outline-offset: 2px; }

.calc__range-label { display: flex; justify-content: space-between; align-items: baseline; gap: var(--space-3); }
.calc__range-out { font-family: var(--font-editorial); font-synthesis: none; font-size: var(--fs-2xl); font-weight: 400; line-height: 1; color: var(--color-primary-active); }
.calc__range { -webkit-appearance: none; appearance: none; width: 100%; height: 28px; margin-block: var(--space-1); background: transparent; cursor: pointer; }
.calc__range::-webkit-slider-runnable-track { height: 6px; border-radius: var(--radius-pill); background: linear-gradient(to right, var(--color-primary) var(--fill, 50%), var(--color-primary-soft-2) var(--fill, 50%)); }
.calc__range::-moz-range-track { height: 6px; border-radius: var(--radius-pill); background: var(--color-primary-soft-2); }
.calc__range::-moz-range-progress { height: 6px; border-radius: var(--radius-pill); background: var(--color-primary); }
.calc__range::-webkit-slider-thumb { -webkit-appearance: none; width: 24px; height: 24px; margin-top: -9px; border-radius: 50%; background: var(--color-surface); border: 2px solid var(--color-primary); transition: transform var(--dur-fast) var(--ease); }
.calc__range::-moz-range-thumb { width: 20px; height: 20px; border-radius: 50%; background: var(--color-surface); border: 2px solid var(--color-primary); }
.calc__range:active::-webkit-slider-thumb { transform: scale(1.15); }

/* Tulemus = kviitung */
.receipt--result { align-content: start; padding-inline: var(--space-5); }
.calc__result-head .card__title { margin: 0; }
.calc__rows { gap: var(--space-2); }
.calc__rows .summary__row { justify-content: flex-start; font-size: var(--fs-sm); }
.receipt--result .summary__row--total { margin-top: var(--space-1); }
.receipt--result .summary__row--total::after { display: none; }
.receipt--result .summary__row--total dt { align-self: center; flex: 1 1 auto; font-family: var(--font-sans); }
.receipt--result .summary__row--total dd { font-family: var(--font-editorial); font-synthesis: none; font-weight: 400; font-size: clamp(2.5rem, 2rem + 2vw, 3.25rem); line-height: 1; color: var(--color-primary-active); }
.calc__note, .calc__disclaimer { margin: 0; }
@media (min-width: 900px) {
  .calc__split { grid-template-columns: minmax(0, 1fr) 400px; }
  .calc__result { position: sticky; top: calc(var(--header-h) + var(--space-4)); }
}

/* Jaotusriba: sulle · komisjon · järeletulemine (2 px vahe, ümarad otsad, legend tekstiga) */
.calc-split { display: grid; gap: var(--space-2); }
.calc-split__bar { display: flex; gap: 2px; height: 12px; }
.calc-split__seg { flex: var(--w) 1 0; min-width: 4px; border-radius: 4px; transform-origin: left; }
.calc-split__seg--you, .calc-split__key--you { background: var(--color-primary); }
.calc-split__seg--fee, .calc-split__key--fee { background: var(--color-border-strong); }
.calc-split__seg--pickup, .calc-split__key--pickup { background: var(--c-clay-500); }
.has-motion .calc-split__seg { animation: split-grow 600ms var(--ease) both; }
.has-motion .calc-split__seg + .calc-split__seg { animation-delay: 120ms; }
@keyframes split-grow { from { transform: scaleX(0.2); opacity: 0; } }
.calc-split__legend { display: flex; flex-wrap: wrap; gap: var(--space-1) var(--space-4); margin: 0; padding: 0; list-style: none; font-size: var(--fs-xs); color: var(--color-text-soft); }
.calc-split__legend li { display: inline-flex; align-items: center; gap: var(--space-1); }
.calc-split__legend .num { color: var(--color-text); font-weight: var(--fw-medium); }
.calc-split__key { width: 10px; height: 10px; border-radius: 3px; }

/* ---------- Lõpu tegevuskutse ---------- */
.pricing-final { padding-block: var(--space-7); border-top: 1px solid var(--color-border); background: radial-gradient(60% 120% at 50% 100%, var(--color-primary-soft), transparent 70%); }
.pricing-final__inner { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-5); }
.pricing-final__title { margin: 0; max-width: 18ch; font-family: var(--font-editorial); font-synthesis: none; font-weight: 400; font-size: var(--fs-display-2); line-height: 1.05; letter-spacing: -0.01em; }
.pricing-final__title em { font-style: italic; color: var(--color-primary-active); }

/* ---------- Mobiil ---------- */
@media (max-width: 599px) {
  .pricing-hero { padding-block: var(--space-5) var(--space-6); }
  .receipt-picker__btn { padding-inline: var(--space-2); }
  .receipt { padding-inline: var(--space-4); }
  .pricing__packages { padding-top: var(--space-6); }
  .pricing-card { padding: var(--space-5) var(--space-4) var(--space-4); }
  .calc-stepper { grid-template-columns: 44px minmax(0, 1fr) 44px; }
  .pricing-final__inner .btn { width: 100%; }
}

/* ---------- Valge ateljee: viimistlus ---------- */
.receipt-picker, .terms__item, .calc-step { box-shadow: var(--shadow-card); }
.pricing .price-card__ribbon { background: var(--color-primary); color: var(--color-on-primary); box-shadow: none; }
.receipt-printer__paper { filter: var(--filter-drop-md); }

/* Lõpp: hele paneel, sama keel nagu avalehe lõpus. */
.pricing-final { padding-block: var(--space-section); border-top: 0; background: var(--color-bg); }
.pricing-final .container > .pricing-final__inner, .pricing-final__inner {
  padding: clamp(var(--space-5), 4vw, var(--space-8)); border-radius: var(--radius-xl); background: var(--color-bg-alt);
}
.pricing-final__title { color: var(--color-text); font-size: clamp(2.25rem, 1.4rem + 3vw, 4rem); }
.pricing-final__title em { color: var(--color-primary); }
