/* ==========================================================================
   Prices & packages — /{lang}/prices/ (SITEMAP §2.4). Owner: strona-prices.
   Paper courtyard for every decision (cards, ledger, add-ons, FAQ); lacquer for
   the VIP plaque and the light planner (golden hour on lak).
   Colours only through surface variables / tokens (DESIGN-IMPL §1.2).
   ========================================================================== */

/* ---------- 1. intro: fabric strip under the header + nameplate + fact block ---------- */
main > .prices-intro:first-child {
  padding-top: calc(var(--header-h) + var(--banner-h, 0px));
}
.prices-intro__strip {
  height: clamp(4.5rem, 8.5vw, 7.5rem);
}
/* paper → paper: one topic after another, shorter breath than between surfaces */
.section.prices-intro {
  row-gap: clamp(1.75rem, 3vw, 2.75rem);
  padding-bottom: clamp(1.25rem, 2.5vw, 2rem);
}
.section.prices-packages {
  padding-top: clamp(1.25rem, 2.5vw, 2rem);
  row-gap: clamp(1.75rem, 3vw, 2.5rem);
}
.section.prices-packages,
.section.prices-covers,
.section.prices-addons,
.section.prices-faq {
  padding-bottom: calc(var(--section-pad) * 0.5);
}
.prices-intro__grid,
.prices-q,
.prices-covers__grid,
.prices-addons__grid,
.planner__head,
.prices-faq__grid {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  column-gap: var(--col-gap);
  row-gap: var(--s-6);
  align-items: end;
}
.prices-intro__grid > .nameplate {
  grid-column: 1 / span 6;
}
.prices-intro__facts {
  grid-column: 7 / -1;
  padding-bottom: 0.4rem;
}
.prices-intro__lead {
  font-size: 1.0625rem;
  line-height: 1.6;
  color: var(--text-2);
  max-width: 50ch;
}
.prices-intro__updated {
  display: flex;
  align-items: center;
  gap: 0.6em;
  margin-top: var(--s-4);
}
.prices-intro__updated::before {
  content: "";
  width: 0.5em;
  height: 0.5em;
  background-color: var(--gold-text);
  -webkit-mask: var(--svg-dia) center / contain no-repeat;
  mask: var(--svg-dia) center / contain no-repeat;
}

/* ---------- 2. packages ---------- */
.prices-q__h {
  grid-column: 1 / span 6;
  font-size: var(--fs-h3);
  line-height: var(--lh-h3);
  max-width: 26ch;
}
.prices-q__lead,
.prices-intro__lead {
  hyphens: manual;
}
.prices-q__lead {
  grid-column: 7 / -1;
  color: var(--text-2);
}
.prices-pick {
  display: grid;
  gap: var(--s-8);
  margin: 0;
}
.prices-pick .packages {
  padding-top: 1.5rem;
}
/* on this page the price is the headline of each card */
.prices-pick .price {
  margin-top: 0.6rem;
  font-size: clamp(2.6rem, 2rem + 1.9vw, 3.6rem);
}
.prices-pick .package__name {
  font-size: clamp(1.5rem, 1.3rem + 0.5vw, 1.8rem);
}
.prices-pick .package__note {
  min-height: 3em;
  max-width: 28ch;
}
.package__choose {
  justify-self: start;
  min-width: 9rem;
}
.package__choose-on {
  display: none;
}
.package.is-selected .package__choose-off,
.package:has(.package__input:checked) .package__choose-off {
  display: none;
}
.package.is-selected .package__choose-on,
.package:has(.package__input:checked) .package__choose-on {
  display: inline;
}
.prices-vip {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: var(--s-6) var(--s-12);
  --frame-pad: clamp(1.5rem, 3vw, 2.5rem);
  color: var(--text);
}
.prices-vip__text {
  display: grid;
  justify-items: start;
  gap: var(--s-3);
  max-width: 44rem;
}
.prices-vip__badge {
  background-color: var(--gold-400);
  color: var(--lacquer-900);
  letter-spacing: 0.08em;
}
.prices-vip__h {
  font-size: var(--fs-h4);
  line-height: var(--lh-h4);
  color: var(--heading);
}
.prices-vip__note {
  color: var(--text-2);
}
.prices-vip__side {
  display: grid;
  justify-items: end;
  gap: var(--s-4);
}
.prices-vip .price {
  font-size: clamp(2.6rem, 2rem + 1.9vw, 3.6rem);
  color: var(--gold-300);
}
.prices-pick__foot {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--s-6) var(--s-12);
  padding-top: var(--s-6);
  border-top: 1px solid var(--line);
}
.prices-pick__text {
  display: grid;
  gap: 0.35rem;
  max-width: 46rem;
}
.prices-pick__note {
  font-weight: 500;
}
.prices-pick__cta,
.prices-end__cta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--s-4);
}

/* comparison table — fine print (ZH: the only place where „4小时” appears) */
.prices-table-wrap {
  display: grid;
  gap: var(--s-2);
}
.prices-table {
  width: 100%;
  font-size: var(--fs-small);
  line-height: var(--lh-small);
  color: var(--text-2);
  font-variant-numeric: lining-nums tabular-nums;
}
.prices-table caption {
  margin-bottom: var(--s-3);
  text-align: start;
  font-weight: 500;
  color: var(--text);
}
.prices-table :is(th, td) {
  padding: 0.6rem 1rem 0.6rem 0;
  text-align: start;
  border-bottom: 1px solid var(--line);
  vertical-align: baseline;
}
.prices-table thead th {
  font-weight: 500;
  color: var(--text-3);
  border-bottom-color: var(--field-line);
}
.prices-table tbody th {
  font-weight: 500;
  color: var(--text);
}

/* ---------- 3. what the price covers — ledger with dotted leaders ---------- */
.prices-covers__head {
  grid-column: 1 / span 5;
  align-self: start;
  display: grid;
  gap: var(--s-6);
}
.prices-covers__body {
  grid-column: 7 / -1;
  align-self: start;
}
.prices-covers__lead {
  color: var(--text-2);
  max-width: 40ch;
}
.ledger-key {
  display: flex;
  flex-wrap: wrap;
  gap: var(--s-2) var(--s-6);
  margin: 0;
  padding: 0;
  list-style: none;
  font-size: var(--fs-small);
  line-height: var(--lh-small);
  color: var(--text-2);
}
.ledger-key__item,
.ledger__status {
  display: inline-flex;
  align-items: center;
  gap: 0.55em;
}
.ledger-key__item::before,
.ledger__status::before {
  content: "";
  flex: none;
  width: 1rem;
  height: 1rem;
  background-color: var(--text-3);
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' d='M6.5 12h11'/%3E%3C/svg%3E")
    center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' d='M6.5 12h11'/%3E%3C/svg%3E")
    center / contain no-repeat;
}
.ledger__row.is-included .ledger__status::before,
.ledger-key__item.is-included::before {
  background-color: var(--gold-text);
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='m5 12.5 4.5 4.5L19 7.5'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='m5 12.5 4.5 4.5L19 7.5'/%3E%3C/svg%3E");
}
/* not included = a small cross */
.ledger__row.is-excluded .ledger__status::before,
.ledger-key__item.is-excluded::before {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' d='m7.5 7.5 9 9m0-9-9 9'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' d='m7.5 7.5 9 9m0-9-9 9'/%3E%3C/svg%3E");
}
.ledger {
  margin: 0;
  border-top: 2px solid var(--frame-outer);
}
.ledger__row {
  display: flex;
  align-items: baseline;
  gap: 0;
  padding: 0.95rem 0;
  border-bottom: 1px solid var(--line);
}
.ledger__item {
  display: flex;
  flex: 1 1 auto;
  align-items: baseline;
  min-width: 0;
  font-weight: 500;
  color: var(--text);
}
/* dotted leader between the line and its status, as on a price board */
.ledger__item::after,
.prices-board__item::after {
  content: "";
  flex: 1 1 2rem;
  min-width: 2rem;
  margin: 0 0.85rem;
  border-bottom: 1px dotted var(--field-line);
  transform: translateY(-0.28em);
}
.ledger__status {
  flex: none;
  margin: 0;
  font-size: var(--fs-small);
  line-height: var(--lh-small);
  color: var(--text-2);
  white-space: nowrap;
}
.ledger__row.is-included .ledger__status {
  color: var(--text);
  font-weight: 500;
}
.ledger__status a {
  color: var(--link);
}
.ledger__status a:hover {
  color: var(--link-hover);
}

/* ---------- 4. add-ons for Thai dress + shoots with their own price lists ---------- */
.prices-addons__head {
  grid-column: 1 / span 5;
  align-self: start;
  display: grid;
  gap: var(--s-6);
}
.prices-addons__body {
  grid-column: 7 / -1;
  align-self: start;
  display: grid;
  justify-items: start;
  gap: var(--s-4);
}
.prices-addons__lead {
  color: var(--text-2);
  max-width: 40ch;
}
.prices-board {
  width: 100%;
  margin: 0;
  border-top: 2px solid var(--frame-outer);
}
.prices-board__row {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  padding: 0.95rem 0;
  border-bottom: 1px solid var(--line);
}
.prices-board__item {
  display: flex;
  flex: 1 1 auto;
  align-items: baseline;
  min-width: 0;
  font-weight: 500;
  color: var(--text);
}
.prices-board__price {
  flex: none;
  margin: 0 0 0 auto;
  font-weight: 500;
  white-space: nowrap;
  font-variant-numeric: lining-nums tabular-nums;
}
.prices-board__detail {
  flex-basis: 100%;
  margin: 0.2rem 0 0;
  font-size: var(--fs-small);
  line-height: var(--lh-small);
  color: var(--text-2);
}
.prices-addons__more {
  color: var(--link);
}
.prices-offers {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--s-6) var(--col-gap);
}
.prices-offers__h {
  grid-column: 1 / -1;
  font-size: var(--fs-h4);
  line-height: var(--lh-h4);
}
.prices-offer {
  display: flex;
  flex-direction: column;
  gap: var(--s-3);
  --frame-pad: clamp(1.25rem, 2.2vw, 2rem);
}
.prices-offer__h {
  font-size: 1.375rem;
  line-height: var(--lh-h4);
}
.prices-offer__zh {
  display: inline-block;
  margin-left: 0.25em;
  font-size: 0.8em;
  color: var(--gold-text);
}
.prices-offer__list {
  margin: var(--s-2) 0 0;
  font-size: 0.9375rem;
  line-height: 1.45;
}
.prices-offer__list > div {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 0.15rem 1rem;
  padding: 0.6rem 0;
  border-bottom: 1px solid var(--line);
}
.prices-offer__list dt {
  color: var(--text-2);
}
.prices-offer__list dd {
  margin: 0 0 0 auto;
  font-weight: 500;
  font-variant-numeric: lining-nums tabular-nums;
}
.prices-offer__note {
  font-size: var(--fs-small);
  line-height: var(--lh-small);
  color: var(--text-3);
}
.prices-offer .btn--link {
  align-self: flex-start;
  margin-top: auto;
  color: var(--link);
}
/* ZH: the add-ons courtyard on red-and-gold silk at 15 % (SITEMAP 2.4, IMAGE-PLAN #6) */
:root:lang(zh) .prices-addons {
  background-image:
    linear-gradient(rgba(242, 230, 208, 0.85), rgba(242, 230, 208, 0.85)),
    url(/assets/img/ai/ai-silk-red-gold-1536.webp);
  background-image:
    linear-gradient(rgba(242, 230, 208, 0.85), rgba(242, 230, 208, 0.85)),
    image-set(
      url(/assets/img/ai/ai-silk-red-gold-1536.avif) type("image/avif"),
      url(/assets/img/ai/ai-silk-red-gold-1536.webp) type("image/webp")
    );
  background-size: cover;
  background-position: center;
}

/* ---------- divider paper → lacquer (tassels) ---------- */
.prices-divider {
  height: clamp(5rem, 10vw, 9rem);
}

/* ---------- 5. light planner (sala) ---------- */
.planner {
  font-variant-numeric: lining-nums tabular-nums;
}
.prices-faq .faq__q {
  font-variant-numeric: lining-nums;
}
.planner__head > .nameplate {
  grid-column: 1 / span 6;
}
.planner__lead {
  grid-column: 8 / -1;
  color: var(--text-2);
  padding-bottom: 0.3rem;
}
.planner__controls {
  display: flex;
  flex-wrap: wrap;
  align-items: end;
  justify-content: space-between;
  gap: var(--s-6);
}
.planner__months {
  display: grid;
  flex: 1 1 40rem;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  border: 1px solid var(--line);
  border-radius: var(--radius);
}
.planner__month {
  display: grid;
  justify-items: center;
  gap: 0.1rem;
  min-height: 3.6rem;
  padding: 0.55rem 0.15rem 0.5rem;
  border: 0;
  border-left: 1px solid var(--line);
  border-radius: 0;
  background: transparent;
  color: var(--text);
  line-height: 1.2;
  transition:
    background-color var(--d-fast) var(--ease-lacquer),
    color var(--d-fast) var(--ease-lacquer);
}
.planner__month:first-child {
  border-left: 0;
}
.planner__month-name {
  font-family: var(--ff-display);
  font-weight: var(--fw-display);
  font-size: 1.15rem;
}
.planner__month-set {
  display: inline-flex;
  align-items: center;
  gap: 0.3em;
  font-size: 0.8125rem;
  color: var(--text-3);
}
/* months whose evening light comes before closing: gold time + ◆ */
.planner__month.is-before .planner__month-set {
  color: var(--gold-text);
}
.planner__month.is-before .planner__month-set::before {
  content: "";
  width: 0.45em;
  height: 0.45em;
  background-color: currentColor;
  -webkit-mask: var(--svg-dia) center / contain no-repeat;
  mask: var(--svg-dia) center / contain no-repeat;
}
.planner__month:hover {
  background-color: rgba(219, 180, 99, 0.1);
}
.planner__month[aria-pressed="true"] {
  background-color: var(--gold-300);
  color: var(--lacquer-900);
}
.planner__month[aria-pressed="true"] .planner__month-set {
  color: var(--lacquer-800);
}
.planner__month:focus-visible {
  outline-offset: -3px;
  position: relative;
  z-index: 1;
}
/* without JS the strip is a year overview (sunset per month), not a control */
:root:not(.js) .planner__month {
  cursor: default;
  pointer-events: none;
}

.planner__start {
  display: grid;
  gap: 0.35rem;
}
.planner__start-label {
  font-size: var(--fs-small);
  line-height: var(--lh-small);
  color: var(--text-2);
}
.planner__select {
  min-width: 8.5rem;
  min-height: 3rem;
  padding: 0.5rem 2.6rem 0.5rem 0.9rem;
  border: 1px solid var(--gold-500);
  border-radius: var(--radius);
  background-color: var(--lacquer-950);
  color: var(--text);
  font-family: var(--ff-display);
  font-size: 1.25rem;
  font-variant-numeric: lining-nums tabular-nums;
  -webkit-appearance: none;
  appearance: none;
}
.planner__select-wrap {
  position: relative;
  display: inline-block;
}
.planner__select-wrap::after {
  content: "";
  position: absolute;
  right: 0.75rem;
  top: 50%;
  width: 1.1rem;
  height: 1.1rem;
  transform: translateY(-50%);
  pointer-events: none;
  background-color: var(--gold-400);
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round' d='m7 10 5 5 5-5'/%3E%3C/svg%3E")
    center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round' d='m7 10 5 5 5-5'/%3E%3C/svg%3E")
    center / contain no-repeat;
}
:root:not(.js) .planner__start {
  display: none;
}

/* the axis: 09:00 → 19:30. Positions = custom properties --x / --r (percent of the axis):
   coordinate classes .plx-N / .plr-N below (server-rendered month), exact values from prices.js */
.planner__axis {
  position: relative;
  margin-top: var(--s-4);
}
.pl-pos {
  position: absolute;
  left: calc(var(--x, 0) * 1%);
}
.pl-range {
  right: calc((100 - var(--r, 100)) * 1%);
}
@media (prefers-reduced-motion: no-preference) {
  .planner.is-ready .pl-pos {
    transition:
      left var(--d-menu) var(--ease-lacquer),
      right var(--d-menu) var(--ease-lacquer),
      opacity var(--d-menu) var(--ease-lacquer);
  }
}
.planner__sky {
  position: relative;
  height: 2.6rem;
}
.planner__sunlabel {
  bottom: 0.45rem;
  display: inline-flex;
  align-items: center;
  gap: 0.45em;
  padding-right: 0.7rem;
  transform: translateX(-100%);
  font-size: var(--fs-small);
  line-height: 1;
  color: var(--gold-300);
  white-space: nowrap;
}
.planner__sunlabel .icon {
  width: 1.1rem;
  height: 1.1rem;
}
.planner__sunlabel b {
  font-family: var(--font-display);
  font-size: 1.25rem;
  font-weight: 500;
}
.planner__track {
  position: relative;
  height: 4.75rem;
  border-radius: var(--radius);
  background-color: rgba(248, 240, 226, 0.03);
  box-shadow: inset 0 0 0 1px rgba(219, 180, 99, 0.22);
  /* hour ticks: exact, 10.5 h → one tick every 100 / 10.5 % */
  background-image: repeating-linear-gradient(
    to right,
    rgba(219, 180, 99, 0.28) 0 1px,
    transparent 1px calc(100% / 10.5)
  );
  background-size: 100% 0.5rem;
  background-position: 0 100%;
  background-repeat: no-repeat;
}
.planner__track > * {
  top: 0;
  bottom: 0;
}
.planner__open {
  background-color: rgba(248, 240, 226, 0.07);
}
.planner__after {
  z-index: 4;
  background-image: repeating-linear-gradient(
    -45deg,
    rgba(27, 9, 6, 0.55) 0 4px,
    rgba(27, 9, 6, 0) 4px 9px
  );
  border-left: 1px dashed rgba(248, 240, 226, 0.55);
}
/* evening light: glow of the last ~45 minutes before sunset */
.planner__glow {
  z-index: 3;
  top: -55%;
  bottom: -55%;
  background: radial-gradient(
    closest-side,
    rgba(234, 203, 134, 0.75),
    rgba(200, 69, 44, 0.32) 55%,
    rgba(200, 69, 44, 0) 100%
  );
  mix-blend-mode: screen;
  opacity: 0.55;
  pointer-events: none;
}
.planner.is-covered .planner__glow {
  opacity: 1;
}
/* your hours: a bar of gold leaf */
.planner__band {
  z-index: 2;
  top: 1.35rem;
  bottom: 1.35rem;
  display: flex;
  align-items: center;
  min-width: 0;
  overflow: hidden;
  border-radius: var(--radius);
  background-image: linear-gradient(
    100deg,
    var(--gold-500) 0%,
    var(--gold-400) 38%,
    var(--gold-300) 62%,
    var(--gold-400) 100%
  );
  box-shadow: var(--shadow-gold);
  color: var(--lacquer-900);
}
.planner.is-covered .planner__band {
  box-shadow:
    var(--shadow-gold-strong),
    0 0 0 1px var(--gold-300);
}
.planner__band-label {
  padding: 0 0.8rem;
  font-size: 0.8125rem;
  font-weight: 500;
  line-height: 1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: clip;
}
.planner__sun {
  z-index: 5;
  top: -2.6rem;
  bottom: -0.25rem;
  width: 0;
  border-left: 1px solid var(--gold-300);
}
.planner__sun::after {
  content: "";
  position: absolute;
  left: -0.4rem;
  top: calc(2.6rem + 2.375rem - 0.4rem);
  width: 0.8rem;
  height: 0.8rem;
  border-radius: 50%;
  background-color: var(--gold-300);
  box-shadow:
    0 0 0 3px rgba(42, 16, 11, 0.6),
    0 0 18px 6px rgba(234, 203, 134, 0.55);
}
.planner__hours {
  position: relative;
  height: 1.9rem;
  margin: 0;
  padding: 0;
  list-style: none;
}
.planner__hours li {
  top: 0.4rem;
  transform: translateX(-50%);
  font-family: var(--font-display);
  font-size: 1rem;
  line-height: 1;
  color: var(--text-3);
  font-variant-numeric: lining-nums tabular-nums;
}
.planner__hours li:first-child {
  transform: none;
}

.planner__legend {
  display: flex;
  flex-wrap: wrap;
  gap: var(--s-2) var(--s-6);
  margin: 0;
  padding: 0;
  list-style: none;
  font-size: var(--fs-small);
  line-height: var(--lh-small);
  color: var(--text-2);
}
.planner__key {
  display: inline-flex;
  align-items: center;
  gap: 0.55em;
}
.planner__key::before {
  content: "";
  flex: none;
  width: 1.4rem;
  height: 0.6rem;
  border-radius: var(--radius);
}
.planner__key--yours::before {
  background-image: linear-gradient(100deg, var(--gold-500), var(--gold-300));
}
.planner__key--open::before {
  background-color: rgba(248, 240, 226, 0.1);
  box-shadow: inset 0 0 0 1px rgba(219, 180, 99, 0.3);
}
.planner__key--light::before {
  height: 0.9rem;
  border-radius: 50%;
  background: radial-gradient(
    closest-side,
    rgba(234, 203, 134, 0.9),
    rgba(200, 69, 44, 0.35) 60%,
    rgba(200, 69, 44, 0)
  );
}
.planner__key--before::before {
  width: 0.55rem;
  height: 0.55rem;
  border-radius: 0;
  background-color: var(--gold-text);
  -webkit-mask: var(--svg-dia) center / contain no-repeat;
  mask: var(--svg-dia) center / contain no-repeat;
}

.planner__out {
  display: grid;
  gap: var(--s-3);
  max-width: 52rem;
  padding-left: var(--s-6);
  border-left: 2px solid var(--gold-500);
}
.planner__msg {
  font-family: var(--ff-display);
  font-weight: var(--fw-display);
  letter-spacing: var(--ls-display);
  font-size: clamp(1.45rem, 1.15rem + 1vw, 2rem);
  line-height: 1.3;
  color: var(--heading);
  max-width: none;
}
.planner__detail {
  color: var(--text-2);
}
.planner__note {
  max-width: 62ch;
}

/* ---------- 6. closing call link ---------- */
.prices-end__call a {
  color: var(--link);
}

/* ---------- 8. FAQ ---------- */
.prices-faq__grid {
  align-items: start;
}
.prices-faq__head {
  grid-column: 1 / span 4;
  display: grid;
  justify-items: start;
  gap: var(--s-6);
  position: sticky;
  top: calc(var(--header-h) + 2rem);
}
.prices-faq__grid > .faq {
  grid-column: 5 / -1;
}

/* ---------- 9. closing plaque ---------- */
.prices-end__plaque {
  justify-self: center;
  display: grid;
  justify-items: center;
  gap: var(--s-6);
  width: min(100%, 50rem);
  --frame-pad: clamp(1.75rem, 4vw, 3.5rem);
  text-align: center;
}
.prices-end__lead {
  max-width: 40ch;
  color: var(--text-2);
}
.prices-end__cta {
  justify-content: center;
}

/* ---------- responsive ---------- */
@media (max-width: 64rem) {
  .prices-intro__grid > .nameplate,
  .prices-intro__facts,
  .prices-q__h,
  .prices-q__lead,
  .planner__head > .nameplate,
  .planner__lead {
    grid-column: 1 / -1;
  }
  .prices-covers__head,
  .prices-covers__body,
  .prices-addons__head,
  .prices-addons__body {
    grid-column: 1 / -1;
  }
  .prices-faq__head {
    position: static;
    grid-column: 1 / -1;
  }
  .prices-faq__grid > .faq {
    grid-column: 1 / -1;
  }
}
@media (max-width: 48rem) {
  /* compact cards: name + time on the left, price on the right */
  .prices-pick .package {
    grid-template-columns: minmax(0, 1fr) auto;
    column-gap: 1rem;
    row-gap: 0.4rem;
  }
  .prices-pick .package > :is(.package__name, .package__time) {
    grid-column: 1;
  }
  .prices-pick .package > .price {
    grid-column: 2;
    grid-row: 1 / span 2;
    align-self: center;
    margin-top: 0;
    font-size: 2.6rem;
  }
  .prices-pick .package > :is(.package__note, .package__choose) {
    grid-column: 1 / -1;
  }
  .prices-pick .package__note {
    min-height: 0;
    max-width: none;
  }
  .prices-pick .package__choose {
    justify-self: stretch;
    margin-top: 0.5rem;
  }
  .prices-pick__foot {
    align-items: stretch;
  }
  .prices-pick__cta,
  .prices-end__cta {
    flex-direction: column;
    align-items: stretch;
    width: 100%;
  }
  .prices-pick__cta > .btn,
  .prices-end__cta > .btn {
    justify-content: center;
  }
  /* table stays a table: compact fine print */
  .prices-table {
    font-size: 0.8125rem;
  }
  .prices-table :is(th, td) {
    padding: 0.55rem 0.6rem 0.55rem 0;
  }
  .prices-table :is(th, td):last-child {
    padding-right: 0;
  }
  /* VIP plaque: text, then price + link */
  .prices-vip {
    grid-template-columns: minmax(0, 1fr);
  }
  .prices-vip__side {
    justify-items: start;
  }
  .prices-vip .price {
    font-size: 2.6rem;
  }
  .prices-offers {
    grid-template-columns: minmax(0, 1fr);
  }
  .ledger__row {
    flex-wrap: wrap;
    row-gap: 0.25rem;
  }
  .ledger__item {
    flex-basis: 100%;
  }
  .ledger__item::after {
    display: none;
  }
  .prices-board__item::after {
    min-width: 1rem;
    margin: 0 0.6rem;
  }
  .planner__months {
    flex-basis: 100%;
    grid-template-columns: repeat(6, minmax(0, 1fr));
  }
  .planner__month:nth-child(7) {
    border-left: 0;
  }
  .planner__month:nth-child(n + 7) {
    border-top: 1px solid var(--line);
  }
  .planner__start {
    grid-template-columns: auto auto;
    align-items: center;
    gap: var(--s-4);
  }
  .planner__hours li:nth-child(even) {
    display: none;
  }
  .planner__track {
    height: 4.25rem;
  }
  .planner__band {
    top: 1.15rem;
    bottom: 1.15rem;
  }
  .planner__sun::after {
    top: calc(2.6rem + 2.125rem - 0.4rem);
  }
  .planner__band-label {
    font-size: 0.75rem;
    padding: 0 0.55rem;
  }
  .planner__out {
    padding-left: var(--s-4);
  }
}

/* ---------- coordinate system of the light planner (0–100 % of the axis) ---------- */
.plx-0 {
  --x: 0;
}
.plx-1 {
  --x: 1;
}
.plx-2 {
  --x: 2;
}
.plx-3 {
  --x: 3;
}
.plx-4 {
  --x: 4;
}
.plx-5 {
  --x: 5;
}
.plx-6 {
  --x: 6;
}
.plx-7 {
  --x: 7;
}
.plx-8 {
  --x: 8;
}
.plx-9 {
  --x: 9;
}
.plx-10 {
  --x: 10;
}
.plx-11 {
  --x: 11;
}
.plx-12 {
  --x: 12;
}
.plx-13 {
  --x: 13;
}
.plx-14 {
  --x: 14;
}
.plx-15 {
  --x: 15;
}
.plx-16 {
  --x: 16;
}
.plx-17 {
  --x: 17;
}
.plx-18 {
  --x: 18;
}
.plx-19 {
  --x: 19;
}
.plx-20 {
  --x: 20;
}
.plx-21 {
  --x: 21;
}
.plx-22 {
  --x: 22;
}
.plx-23 {
  --x: 23;
}
.plx-24 {
  --x: 24;
}
.plx-25 {
  --x: 25;
}
.plx-26 {
  --x: 26;
}
.plx-27 {
  --x: 27;
}
.plx-28 {
  --x: 28;
}
.plx-29 {
  --x: 29;
}
.plx-30 {
  --x: 30;
}
.plx-31 {
  --x: 31;
}
.plx-32 {
  --x: 32;
}
.plx-33 {
  --x: 33;
}
.plx-34 {
  --x: 34;
}
.plx-35 {
  --x: 35;
}
.plx-36 {
  --x: 36;
}
.plx-37 {
  --x: 37;
}
.plx-38 {
  --x: 38;
}
.plx-39 {
  --x: 39;
}
.plx-40 {
  --x: 40;
}
.plx-41 {
  --x: 41;
}
.plx-42 {
  --x: 42;
}
.plx-43 {
  --x: 43;
}
.plx-44 {
  --x: 44;
}
.plx-45 {
  --x: 45;
}
.plx-46 {
  --x: 46;
}
.plx-47 {
  --x: 47;
}
.plx-48 {
  --x: 48;
}
.plx-49 {
  --x: 49;
}
.plx-50 {
  --x: 50;
}
.plx-51 {
  --x: 51;
}
.plx-52 {
  --x: 52;
}
.plx-53 {
  --x: 53;
}
.plx-54 {
  --x: 54;
}
.plx-55 {
  --x: 55;
}
.plx-56 {
  --x: 56;
}
.plx-57 {
  --x: 57;
}
.plx-58 {
  --x: 58;
}
.plx-59 {
  --x: 59;
}
.plx-60 {
  --x: 60;
}
.plx-61 {
  --x: 61;
}
.plx-62 {
  --x: 62;
}
.plx-63 {
  --x: 63;
}
.plx-64 {
  --x: 64;
}
.plx-65 {
  --x: 65;
}
.plx-66 {
  --x: 66;
}
.plx-67 {
  --x: 67;
}
.plx-68 {
  --x: 68;
}
.plx-69 {
  --x: 69;
}
.plx-70 {
  --x: 70;
}
.plx-71 {
  --x: 71;
}
.plx-72 {
  --x: 72;
}
.plx-73 {
  --x: 73;
}
.plx-74 {
  --x: 74;
}
.plx-75 {
  --x: 75;
}
.plx-76 {
  --x: 76;
}
.plx-77 {
  --x: 77;
}
.plx-78 {
  --x: 78;
}
.plx-79 {
  --x: 79;
}
.plx-80 {
  --x: 80;
}
.plx-81 {
  --x: 81;
}
.plx-82 {
  --x: 82;
}
.plx-83 {
  --x: 83;
}
.plx-84 {
  --x: 84;
}
.plx-85 {
  --x: 85;
}
.plx-86 {
  --x: 86;
}
.plx-87 {
  --x: 87;
}
.plx-88 {
  --x: 88;
}
.plx-89 {
  --x: 89;
}
.plx-90 {
  --x: 90;
}
.plx-91 {
  --x: 91;
}
.plx-92 {
  --x: 92;
}
.plx-93 {
  --x: 93;
}
.plx-94 {
  --x: 94;
}
.plx-95 {
  --x: 95;
}
.plx-96 {
  --x: 96;
}
.plx-97 {
  --x: 97;
}
.plx-98 {
  --x: 98;
}
.plx-99 {
  --x: 99;
}
.plx-100 {
  --x: 100;
}
.plr-0 {
  --r: 0;
}
.plr-1 {
  --r: 1;
}
.plr-2 {
  --r: 2;
}
.plr-3 {
  --r: 3;
}
.plr-4 {
  --r: 4;
}
.plr-5 {
  --r: 5;
}
.plr-6 {
  --r: 6;
}
.plr-7 {
  --r: 7;
}
.plr-8 {
  --r: 8;
}
.plr-9 {
  --r: 9;
}
.plr-10 {
  --r: 10;
}
.plr-11 {
  --r: 11;
}
.plr-12 {
  --r: 12;
}
.plr-13 {
  --r: 13;
}
.plr-14 {
  --r: 14;
}
.plr-15 {
  --r: 15;
}
.plr-16 {
  --r: 16;
}
.plr-17 {
  --r: 17;
}
.plr-18 {
  --r: 18;
}
.plr-19 {
  --r: 19;
}
.plr-20 {
  --r: 20;
}
.plr-21 {
  --r: 21;
}
.plr-22 {
  --r: 22;
}
.plr-23 {
  --r: 23;
}
.plr-24 {
  --r: 24;
}
.plr-25 {
  --r: 25;
}
.plr-26 {
  --r: 26;
}
.plr-27 {
  --r: 27;
}
.plr-28 {
  --r: 28;
}
.plr-29 {
  --r: 29;
}
.plr-30 {
  --r: 30;
}
.plr-31 {
  --r: 31;
}
.plr-32 {
  --r: 32;
}
.plr-33 {
  --r: 33;
}
.plr-34 {
  --r: 34;
}
.plr-35 {
  --r: 35;
}
.plr-36 {
  --r: 36;
}
.plr-37 {
  --r: 37;
}
.plr-38 {
  --r: 38;
}
.plr-39 {
  --r: 39;
}
.plr-40 {
  --r: 40;
}
.plr-41 {
  --r: 41;
}
.plr-42 {
  --r: 42;
}
.plr-43 {
  --r: 43;
}
.plr-44 {
  --r: 44;
}
.plr-45 {
  --r: 45;
}
.plr-46 {
  --r: 46;
}
.plr-47 {
  --r: 47;
}
.plr-48 {
  --r: 48;
}
.plr-49 {
  --r: 49;
}
.plr-50 {
  --r: 50;
}
.plr-51 {
  --r: 51;
}
.plr-52 {
  --r: 52;
}
.plr-53 {
  --r: 53;
}
.plr-54 {
  --r: 54;
}
.plr-55 {
  --r: 55;
}
.plr-56 {
  --r: 56;
}
.plr-57 {
  --r: 57;
}
.plr-58 {
  --r: 58;
}
.plr-59 {
  --r: 59;
}
.plr-60 {
  --r: 60;
}
.plr-61 {
  --r: 61;
}
.plr-62 {
  --r: 62;
}
.plr-63 {
  --r: 63;
}
.plr-64 {
  --r: 64;
}
.plr-65 {
  --r: 65;
}
.plr-66 {
  --r: 66;
}
.plr-67 {
  --r: 67;
}
.plr-68 {
  --r: 68;
}
.plr-69 {
  --r: 69;
}
.plr-70 {
  --r: 70;
}
.plr-71 {
  --r: 71;
}
.plr-72 {
  --r: 72;
}
.plr-73 {
  --r: 73;
}
.plr-74 {
  --r: 74;
}
.plr-75 {
  --r: 75;
}
.plr-76 {
  --r: 76;
}
.plr-77 {
  --r: 77;
}
.plr-78 {
  --r: 78;
}
.plr-79 {
  --r: 79;
}
.plr-80 {
  --r: 80;
}
.plr-81 {
  --r: 81;
}
.plr-82 {
  --r: 82;
}
.plr-83 {
  --r: 83;
}
.plr-84 {
  --r: 84;
}
.plr-85 {
  --r: 85;
}
.plr-86 {
  --r: 86;
}
.plr-87 {
  --r: 87;
}
.plr-88 {
  --r: 88;
}
.plr-89 {
  --r: 89;
}
.plr-90 {
  --r: 90;
}
.plr-91 {
  --r: 91;
}
.plr-92 {
  --r: 92;
}
.plr-93 {
  --r: 93;
}
.plr-94 {
  --r: 94;
}
.plr-95 {
  --r: 95;
}
.plr-96 {
  --r: 96;
}
.plr-97 {
  --r: 97;
}
.plr-98 {
  --r: 98;
}
.plr-99 {
  --r: 99;
}
.plr-100 {
  --r: 100;
}