/* Kit RDC sales page (/kit-rdc). Tokens, buttons, .walk, .split and .foot come from styles.css and pages.css.
   Idea: the Kit as a binder of real pages. Graphite is the problem, paper is the answer, turquoise is the offer. */

/* ---------- deadline strip ---------- */
.lp-strip {
  display: flex; align-items: baseline; gap: .6rem;
  padding: .6rem var(--gutter); background: oklch(0.2 0.01 205); color: var(--mist);
  font: 500 var(--step--1)/1.4 var(--f-body);
}
.lp-strip__dot { flex: none; width: .5rem; height: .5rem; border-radius: 50%; background: var(--tq); transform: translateY(-.05rem); }

/* ---------- hero ---------- */
/* phone: logo, h1, button, pages; with video: logo, h1, video, button */
.lp-hero {
  --vsl-ratio: 9 / 16; /* video proportion: change only here */
  display: grid; gap: 0 clamp(2.5rem, 6vw, 5rem); align-items: center;
  grid-template-areas: "logo" "h1" "act" "vsl";
  padding: clamp(.9rem, 3vh, 2.6rem) var(--gutter) clamp(3.5rem, 9vh, 6rem);
  background: radial-gradient(55% 45% at 72% 62%, oklch(0.74 0.115 188 / .16), transparent 72%), var(--graphite);
  color: var(--mist); overflow: hidden;
}
.lp-hero.has-vsl { grid-template-areas: "logo" "h1" "vsl" "act"; }
.lp-hero__copy { display: contents; }
.lp-hero__logo { grid-area: logo; width: clamp(84px, 60px + 4vw, 112px); height: auto; margin-bottom: clamp(.8rem, 2.6vh, 3.4rem); }
.lp-hero h1 { grid-area: h1;
  font: 700 clamp(1.75rem, .9rem + 4vw, 4.1rem)/1.04 var(--f-display);
  letter-spacing: -0.03em; text-wrap: balance; max-width: 17ch; color: var(--paper);
}
.lp-hero__act { grid-area: act; display: grid; justify-items: start; gap: .8rem; margin-top: 1.1rem; }
.lp-read {
  min-height: 44px; padding: 0; border: 0; background: none; cursor: pointer; color: var(--mist);
  font: 500 var(--step--1)/1.4 var(--f-body); text-decoration: underline oklch(0.74 0.115 188 / .7); text-underline-offset: .22em;
}
.lp-read:focus-visible, .vsl__play:focus-visible { outline: 3px solid var(--tq); outline-offset: 3px; }

/* ---------- sales video ---------- */
.vsl { grid-area: vsl; display: grid; justify-items: center; margin-top: clamp(1.4rem, 4vh, 2.5rem); }
.has-vsl .vsl { margin-top: 1.1rem; }
.vsl__frame {
  position: relative; aspect-ratio: var(--vsl-ratio); overflow: hidden; border-radius: 14px;
  /* keeps the buy button above the cookie notice on phones */
  width: min(100%, 15rem); /* browsers without svh */
  width: min(100%, max(11rem, (100svh - 30.5rem) * (var(--vsl-ratio))));
  background: oklch(0.17 0.01 205);
  box-shadow: 0 0 0 1px oklch(0.74 0.115 188 / .25), 0 40px 70px -34px oklch(0.1 0.01 205 / .9);
}
.vsl__video, .vsl__poster { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.vsl__play { position: absolute; inset: 0; display: grid; place-items: center; padding: 0; border: 0; background: none; cursor: pointer; }
.vsl__play[hidden] { display: none; }
.vsl__play:focus-visible { outline-offset: -6px; }
.vsl__play::after { content: ""; position: absolute; inset: 0; background: linear-gradient(transparent 50%, oklch(0.15 0.01 205 / .55)); }
.vsl__icon {
  position: relative; z-index: 1; display: grid; place-items: center; width: 4.4rem; aspect-ratio: 1; border-radius: 50%;
  background: var(--tq); color: var(--tq-ink); box-shadow: 0 0 0 .5rem oklch(0.74 0.115 188 / .24);
  transition: box-shadow .4s var(--ease-out), transform .4s var(--ease-out);
}
.vsl__icon svg { width: 1.8rem; height: 1.8rem; margin-left: .2rem; }
.vsl__play:hover .vsl__icon { transform: scale(1.05); box-shadow: 0 0 0 .8rem oklch(0.74 0.115 188 / .3); }

/* ---------- 50% lock: top, blurred peek, footer ---------- */
.vsl-gate { display: none; }
.vsl-locked .vsl-gate, .vsl-gate.is-open { display: flex; justify-content: center; }
.vsl-locked .vsl-gate { position: relative; z-index: 2; height: 0; }
.vsl-gate__line { display: inline-flex; align-items: center; gap: .6rem; font: 600 var(--step--1)/1.35 var(--f-display); }
.vsl-locked .vsl-gate__line {
  position: absolute; top: clamp(2.2rem, 7vh, 4rem); max-width: calc(100% - 2 * var(--gutter)); padding: .75rem 1.2rem;
  border-radius: 999px; background: var(--graphite); color: var(--paper);
  box-shadow: 0 0 0 1px oklch(0.74 0.115 188 / .3), 0 20px 40px -18px oklch(0.15 0.01 205 / .7);
}
.vsl-gate svg { flex: none; width: 1.1rem; height: 1.1rem; color: var(--tq); }
.vsl-gate__arrow, .vsl-gate.is-open .vsl-gate__lock { display: none; }
.vsl-gate.is-open .vsl-gate__arrow { display: block; }
/* open: right under the trust line */
.vsl-gate.is-open { position: relative; margin-top: calc(1rem - clamp(3.5rem, 9vh, 6rem)); padding: 0 var(--gutter) clamp(2.2rem, 6vh, 3.2rem); color: var(--mist); }
@media (prefers-reduced-motion: no-preference) { .vsl-gate.is-open .vsl-gate__line { animation: gate-in .7s var(--ease-out) both; } }
@keyframes gate-in { from { opacity: 0; transform: translateY(-8px); } }
/* sharp paper, blurred words, fading out */
.vsl-locked .vsl-gate + section {
  max-height: 17rem; overflow: hidden; pointer-events: none; user-select: none;
  -webkit-mask-image: linear-gradient(#000 25%, transparent); mask-image: linear-gradient(#000 25%, transparent);
}
.vsl-locked .vsl-gate + section > * { filter: blur(5px); opacity: .75; }
.vsl-locked .vsl-gate + section ~ section { display: none; }
.lp-trust { font-size: var(--step--1); color: var(--mist-soft); }

/* fanned stack of real pages (no video yet); the front page (LCP) never starts transparent */
.stack { position: relative; width: min(100%, 25rem); aspect-ratio: 1 / 1.12; }
.stack__page {
  position: absolute; width: 60%; height: auto; border-radius: 3px; background: var(--paper);
  box-shadow: 0 2px 6px oklch(0.12 0.01 205 / .35), 0 34px 60px -26px oklch(0.12 0.01 205 / .85);
}
.stack__page--a { left: 0; top: 9%; transform: rotate(-9deg); filter: brightness(.8); }
.stack__page--b { right: 0; top: 1%; transform: rotate(7deg); filter: brightness(.9); }
.stack__front { position: absolute; left: 19%; top: 13%; width: 62%; transform: rotate(-1.5deg); }
.stack__front .stack__page { position: relative; width: 100%; }
/* the 15 folder dividers peeking out of the binder (00 to 14) */
.stack__tabs { position: absolute; top: 7%; bottom: 34%; right: -10px; display: grid; gap: 3px; width: 10px; }
.stack__tabs i { border-radius: 0 3px 3px 0; background: var(--tq); }
.stack__tabs i:nth-child(3n+2) { background: var(--tq-deep); }
.stack__tabs i:nth-child(3n) { background: var(--paper-2); }

@media (prefers-reduced-motion: no-preference) {
  .stack__page--a { animation: fan-a 1.1s var(--ease-out) .2s both; }
  .stack__page--b { animation: fan-b 1.1s var(--ease-out) .3s both; }
  .stack__front { animation: settle .9s var(--ease-out) both; }
  @keyframes fan-a { from { transform: translate(22%, 4%) rotate(-1deg); } }
  @keyframes fan-b { from { transform: translate(-22%, 10%) rotate(-1deg); } }
  @keyframes settle { from { transform: translateY(16px) rotate(0deg); } }
}

/* ---------- sections ---------- */
.lp-sec { padding: clamp(3.5rem, 10vh, 7rem) var(--gutter); }
.lp-sec--paper { background-color: var(--paper-2); }
.lp-sec--grid {
  background-image:
    linear-gradient(oklch(0.52 0.09 190 / .07) 1px, transparent 1px),
    linear-gradient(90deg, oklch(0.52 0.09 190 / .07) 1px, transparent 1px);
  background-size: 72px 72px; background-position: -1px -1px;
}
.lp-sec > .h2, .lp-sec__head { margin-bottom: clamp(1.8rem, 4vw, 2.8rem); }
.lp-sec__head { max-width: 46rem; }
.lp-intro { grid-column: 1 / -1; max-width: 44ch; margin: 0 0 clamp(2.4rem, 6vw, 4rem); color: var(--ink); }
.lp-sec__sub { margin-top: 1rem; color: var(--ink-soft); max-width: 56ch; }
.lp-sec[data-theme="light"] :is(.btn, a, summary):focus-visible { outline: 3px solid var(--tq-deep); outline-offset: 2px; }

/* what the norm asks: statement + the article it comes from */
.facts { list-style: none; margin: 0; padding: 0; border-bottom: 1.5px solid oklch(0.24 0.012 205 / .16); }
.facts li { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: .5rem 1.4rem; align-items: start; padding: 1.15rem 0; border-top: 1.5px solid oklch(0.24 0.012 205 / .16); }
.facts p { max-width: 54ch; }
.cite {
  justify-self: start; padding: .2rem .6rem; border: 1px solid oklch(0.52 0.09 190 / .4); border-radius: 999px;
  font: 600 var(--step--1)/1.3 var(--f-display); color: var(--tq-deep); white-space: nowrap;
}

/* cost of waiting: dark, factual */
.lp-cost { background: var(--graphite); color: var(--mist); }
.lp-cost .h2 { color: var(--paper); max-width: 18ch; }
.cost { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 17rem), 1fr)); gap: 0 clamp(1.5rem, 4vw, 3rem); margin: 0; }
.cost > div { padding: 1.2rem 0 1.4rem; border-top: 1.5px solid oklch(0.95 0.008 185 / .2); }
.cost dt { font: 600 var(--step-1)/1.2 var(--f-display); color: var(--tq); margin-bottom: .55rem; }
.cost dd { margin: 0; color: var(--mist-soft); line-height: 1.65; }

/* binder scene: the dark half of the folder list, its colour = the frames' border (measured), so no visible box.
   PC: list left, binder sticky right. Phone: binder sticky on top, list passing under it.
   Box ratio and focus crop only the empty dark margin of each frame set (same numbers in kit-fichario.js) */
.lp-scene {
  --scene-edge: oklch(0.183 0.01 234); --scene-ratio: 11 / 10; --scene-pos: 39.2% 50%; --stage-h: calc(100svh - 3rem);
  display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr); grid-template-rows: auto 1fr; column-gap: clamp(2rem, 5vw, 5rem);
  background: var(--scene-edge); color: var(--mist);
}
.lp-scene > :not(.lp-scene__stage) { grid-column: 1; }
.lp-scene .binder { margin-bottom: 30svh; } /* the open binder stays whole beside folder 14 */
.lp-scene__stage {
  grid-area: 1 / 2 / 3; align-self: start; position: sticky; top: 0; height: 100vh; height: 100svh;
  display: grid; place-items: center; background: var(--scene-edge);
}
@media (max-width: 767px) { .lp-scene { --scene-edge: oklch(0.201 0.01 234); --scene-ratio: 6 / 5; --scene-pos: 50% 14%; --stage-h: 40svh; display: block; }
  .lp-scene .binder { margin-bottom: 0; }
  .lp-scene__stage { z-index: 1; height: auto; margin: 0 calc(-1 * var(--gutter)) 1rem; }
  .lp-scene__stage::after { content: ""; position: absolute; inset: 100% 0 auto; height: 1.6rem; background: linear-gradient(var(--scene-edge), transparent); pointer-events: none; }
}
@media (max-width: 767px) and (max-height: 500px) { .lp-scene__stage { position: relative; } }
.lp-scene picture { display: contents; }
.lp-scene source { display: none; } /* else an empty grid row */
.lp-scene__still, .lp-scene__canvas {
  grid-area: 1 / 1; display: block; width: min(100%, var(--stage-h) * (var(--scene-ratio))); height: auto;
  aspect-ratio: var(--scene-ratio); object-fit: cover; object-position: var(--scene-pos);
  --fade-y: linear-gradient(transparent, #000 10%, #000 90%, transparent); --fade-x: linear-gradient(90deg, transparent, #000 10%, #000 90%, transparent);
  -webkit-mask-image: var(--fade-y), var(--fade-x); -webkit-mask-composite: source-in; mask-image: var(--fade-y), var(--fade-x); mask-composite: intersect;
}
/* live: box follows the loaded set, even if the screen turns */
.lp-scene[data-set="d"] { --scene-edge: oklch(0.183 0.01 234); --scene-ratio: 11 / 10; }
.lp-scene[data-set="m"] { --scene-edge: oklch(0.201 0.01 234); --scene-ratio: 6 / 5; }
/* never the open still before the closed frame 1 */
.lp-scene.is-live .lp-scene__still, .lp-scene.is-live:not(.has-frame) .lp-scene__canvas { opacity: 0; }
.lp-scene.no-frames .lp-scene__still { opacity: 1; }
.lp-scene__canvas { transition: opacity .4s var(--ease-out); }
.lp-scene .h2 { color: var(--paper); }
.lp-scene .lp-sec__sub { color: var(--mist-soft); }
/* the folder at the centre of the screen keeps its tab lit */
.binder__tab { transition: opacity .4s var(--ease-out); }
.binder:has(.is-on) li:not(.is-on) .binder__tab { opacity: .75; } /* number at 5.1:1, AA */
.lp-more > .peek { margin-top: 0; }

/* the binder index: one row per real folder of the zip */
[data-count] { display: inline-block; min-width: 2ch; text-align: right; font-variant-numeric: tabular-nums; }
.binder { list-style: none; margin: 0; padding: 0; }
.binder li { display: grid; grid-template-columns: 3.4rem minmax(0, 1fr); gap: 1rem; padding: 1rem 0 1.2rem; border-top: 1.5px solid oklch(0.95 0.008 185 / .14); }
.binder__tab {
  display: grid; place-items: center; height: 2.3rem; padding-top: .15rem;
  background: var(--tq); color: var(--tq-ink); font: 700 var(--step-0)/1 var(--f-display);
  clip-path: polygon(0 100%, 14% 0, 86% 0, 100% 100%);
}
.binder li:first-child .binder__tab { background: var(--paper); color: var(--ink); }
.binder h3 { font: 600 var(--step-1)/1.2 var(--f-display); letter-spacing: -0.015em; color: var(--paper); }
.binder small { display: block; margin-top: .2rem; font: 500 var(--step--1)/1.2 var(--f-body); color: var(--tq); }
.binder p { margin-top: .3rem; color: var(--mist-soft); max-width: 52ch; }

/* real pages, lower part blurred in the file itself */
.peek { margin-top: clamp(3rem, 7vw, 5rem); }
.peek__title { font: 600 var(--step-1)/1.2 var(--f-display); }
.peek__note { margin-top: .3rem; color: var(--ink-soft); font-size: var(--step--1); }
.peek__row {
  list-style: none; display: grid; grid-auto-flow: column; grid-auto-columns: min(66vw, 16rem); gap: 1rem;
  margin: 1.2rem calc(-1 * var(--gutter)) 0; padding: .4rem var(--gutter) 1.4rem;
  overflow-x: auto; scroll-snap-type: x mandatory; scroll-padding-inline: var(--gutter); overscroll-behavior-x: contain;
}
.peek__row li { display: grid; gap: .6rem; scroll-snap-align: start; }
.peek__row img {
  width: 100%; aspect-ratio: 4 / 5; object-fit: cover; object-position: top; border-radius: 4px; background: var(--paper);
  box-shadow: 0 1px 0 oklch(0.24 0.012 205 / .08), 0 22px 40px -26px oklch(0.24 0.012 205 / .55);
}
.peek__row span { font-size: var(--step--1); color: var(--ink-soft); }

.extras { list-style: none; margin: clamp(2.4rem, 5vw, 3.4rem) 0 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 17rem), 1fr)); gap: 1rem; }
.extras li { padding: 1.2rem 1.3rem 1.4rem; border-radius: 8px; background: var(--paper-2); }
.extras .extras__bonus { background: oklch(0.74 0.115 188 / .16); }
.extras h3 { font: 600 var(--step-0)/1.3 var(--f-display); }
.extras p { margin-top: .4rem; color: var(--ink-soft); font-size: var(--step--1); }
.lp-cta { margin-top: 2.2rem; }

/* what you get: a packing slip with quantities, no money values */
.slip {
  max-width: 42rem; padding: clamp(1.5rem, 4vw, 2.8rem); border-radius: 6px;
  background: oklch(0.99 0.004 185); box-shadow: 0 1px 0 oklch(0.24 0.012 205 / .06), 0 30px 60px -40px oklch(0.24 0.012 205 / .5);
}
.slip .h2 { margin-bottom: 1.2rem; }
.slip__list { list-style: none; margin: 0; padding: 0; }
.slip__list li { display: flex; align-items: baseline; gap: 1rem; padding: .8rem 0; border-bottom: 1px dashed oklch(0.24 0.012 205 / .25); }
.slip__list span { flex: 1; }
.slip__list b { font: 700 var(--step-1)/1 var(--f-display); white-space: nowrap; font-variant-numeric: tabular-nums; }
.slip__total { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: .4rem 1rem; margin-top: 1.4rem; font: 600 var(--step-1)/1.2 var(--f-display); }
/* small: the offer is the price peak */
.slip__total strong { font-size: var(--step-1); line-height: 1; }

/* the offer: the only turquoise drench of the page */
.lp-offer { padding: clamp(3.5rem, 10vh, 7rem) var(--gutter); background: var(--tq); color: var(--tq-ink); }
.offer { display: grid; justify-items: start; max-width: 40rem; }
.offer__name { font: 700 var(--step-2)/1.08 var(--f-display); letter-spacing: -0.025em; max-width: 18ch; }
.offer__for { margin-top: .7rem; max-width: 44ch; }
.offer__row { display: flex; align-items: center; gap: clamp(1rem, 4vw, 2rem); margin-top: 1.4rem; }
.offer__price { font: 700 clamp(4.4rem, 3rem + 7vw, 8rem)/.9 var(--f-display); letter-spacing: -0.045em; }
.offer__cur { font-size: .34em; letter-spacing: 0; vertical-align: .95em; margin-right: .12em; }
.seal {
  display: grid; place-content: center; width: 5.6rem; aspect-ratio: 1; border-radius: 50%; text-align: center;
  background: var(--tq-ink); color: var(--paper); transform: rotate(-8deg);
}
.seal b { font: 700 var(--step-2)/1 var(--f-display); color: var(--tq); }
.seal span { font: 600 .72rem/1.15 var(--f-body); max-width: 7ch; }
.offer__terms { margin-top: 1rem; max-width: 40ch; font-size: var(--step--1); }
.offer__btn { margin-top: 1.6rem; min-width: min(100%, 17rem); }
.lp-offer .lp-trust { margin-top: .9rem; color: var(--tq-ink); }
.lp-offer .btn:focus-visible { outline: 3px solid var(--tq-ink); outline-offset: 3px; }

.lp-guarantee__in { max-width: 44rem; }
.lp-guarantee__in .h2 { margin-bottom: 1.2rem; }
.lp-guarantee__in p + p { margin-top: .8rem; color: var(--ink-soft); }
.lp-guarantee__in p:first-of-type { font-size: var(--step-1); line-height: 1.45; }

.who { display: grid; gap: 1.4rem clamp(2rem, 6vw, 6rem); }
.who__text { display: grid; gap: 1rem; max-width: 60ch; color: var(--ink-soft); }

/* questions: native accordion, works without JS */
.faq { max-width: 52rem; border-bottom: 1.5px solid oklch(0.24 0.012 205 / .16); }
.faq details { border-top: 1.5px solid oklch(0.24 0.012 205 / .16); }
.faq summary {
  position: relative; display: block; min-height: 44px; padding: 1.1rem 2.6rem 1.1rem 0; cursor: pointer; list-style: none;
  font: 600 var(--step-0)/1.4 var(--f-display);
}
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after {
  content: "+"; position: absolute; right: .3rem; top: .85rem; font: 500 1.5rem/1 var(--f-body); color: var(--tq-deep);
  transition: transform .3s var(--ease-out);
}
.faq details[open] summary::after { transform: rotate(45deg); }
.faq details p { padding-bottom: 1.3rem; color: var(--ink-soft); max-width: 62ch; }

.lp-final { display: grid; justify-items: start; gap: 1.4rem; padding: clamp(4rem, 12vh, 8rem) var(--gutter); background: var(--graphite); color: var(--mist); }
.lp-final__when { color: var(--tq); font-weight: 600; max-width: 52ch; }
.lp-final .h2 { font-size: var(--step-3); line-height: 1.02; max-width: 16ch; color: var(--paper); }

.foot:has(.lp-foot__company) { gap: 1rem; padding-bottom: 5rem; }
.lp-foot__company { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 13rem), 1fr)); gap: .3rem 1.6rem; width: 100%; margin: 0; }
.lp-foot__company dt { display: inline; font-weight: 600; }
.lp-foot__company dt::after { content: ": "; }
.lp-foot__company dd { display: inline; margin: 0; }
.lp-foot__legal { max-width: 64ch; }
/* inherited .foot__small (opacity .6) reads at 3.9:1 on graphite; .8 clears 4.5:1 */
.foot .foot__small { opacity: .8; }

/* on this page the cookie notice is shorter on phones, so the hero button stays above it */
@media (max-width: 760px) {
  .consent { inset: auto .5rem .5rem; gap: .5rem; padding: .65rem .85rem; font-size: .8rem; line-height: 1.4; }
}

/* ---------- mobile buy bar: between the hero and the offer only ---------- */
.buybar {
  position: fixed; inset: auto 0 0 0; z-index: 55;
  padding: .7rem var(--gutter) calc(.7rem + env(safe-area-inset-bottom));
  background: oklch(0.235 0.009 205 / .96); border-top: 1px solid oklch(0.95 0.008 185 / .12);
  transform: translateY(110%); transition: transform .45s var(--ease-out);
}
.buybar.is-shown { transform: none; }
.buybar__btn { width: 100%; gap: .5em; }
@media (min-width: 720px) { .buybar { display: none; } }

/* ---------- wider screens ---------- */
@media (min-width: 900px) {
  /* text on the left, video (or pages) on the right */
  .lp-hero, .lp-hero.has-vsl {
    grid-template-columns: minmax(0, 6fr) minmax(0, 5fr); grid-template-rows: 1fr auto auto auto 1fr;
    grid-template-areas: ". vsl" "logo vsl" "h1 vsl" "act vsl" ". vsl";
    min-height: min(52rem, calc(100svh - 2.6rem));
  }
  .lp-hero__logo { margin-bottom: clamp(2rem, 6vh, 3.4rem); }
  .lp-hero__act { margin-top: 2rem; }
  .vsl, .has-vsl .vsl { margin-top: 0; }
  .vsl__frame { width: min(100%, max(16rem, (100svh - 11rem) * (var(--vsl-ratio)))); }
  .stack { width: min(100%, 30rem); }
  .lp-sec--grid { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(2rem, 6vw, 6rem); align-items: start; }
  .peek__row { grid-auto-flow: row; grid-template-columns: repeat(4, minmax(0, 1fr)); margin-inline: 0; padding-inline: 0; overflow: visible; }
  .peek__row li:nth-child(odd) img { transform: rotate(-1deg); }
  .peek__row li:nth-child(even) img { transform: rotate(1deg); }
  .who { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); }
  .slip { margin-inline: auto; }
  .lp-offer { display: grid; justify-items: center; }
  .offer { justify-items: center; text-align: center; max-width: 44rem; }
}
@media (max-width: 899px) { .vsl-gate.is-open { justify-content: flex-start; } }
@media (max-width: 559px) {
  .facts li { grid-template-columns: minmax(0, 1fr); }
  .offer__btn, .lp-hero__act .btn, .lp-final .btn, .lp-cta { width: 100%; }
}

@media (prefers-reduced-motion: reduce) {
  .buybar, .faq summary::after, .vsl__icon { transition: none; }
}