/* ==========================================================================
   LP Premium — signature heroes, section variants and the decor system.
   Everything is token-driven; archetypes switch decor with <html data-decor="grain glow …">.
   Layout safety rules: badges/tags live INSIDE their card's padding, grid children get min-width:0,
   display text never breaks inside a word (fitWords shrinks it instead) — nothing is ever clipped by its box.
   ========================================================================== */

/* ---------- safety ---------- */
.lp-wrap > *, [class*="lp-hero"] .lp-wrap > *, .lp-bento > *, .lp-plans > *, .lp-benefits > * { min-width: 0; }
.lp-h1, .lp-h2, .lp-h3, .lp-date, .lp-plan__price { overflow-wrap: normal; hyphens: manual; }
.lp-plan { padding-top: clamp(28px, 3.4vw, 40px); }
.lp-plan__tag { position: static; align-self: flex-start; margin: 0 0 -6px; } /* tag sits inside the card, never on its border */
.lp-h1 em, .lp-h2 em, .lp-h1 i { font-style: italic; }
.lp-h1 mark, .lp-h2 mark, .lp-final mark { background: none; color: var(--accent); }
[data-decor~="highlight"] .lp-h1 mark, [data-decor~="highlight"] .lp-h2 mark { color: var(--ink); background: linear-gradient(transparent 58%, color-mix(in srgb, var(--accent) 70%, transparent) 58% 92%, transparent 92%); padding-inline: .06em; }
.lp-outline { color: transparent; -webkit-text-stroke: 1.5px currentColor; }

/* ---------- decor system ---------- */
html:not([data-decor~="grain"]) .ae-grain { display: none; }
[data-decor~="grid"] body { background-image: linear-gradient(var(--line) 1px, transparent 1px), linear-gradient(90deg, var(--line) 1px, transparent 1px); background-size: 72px 72px; background-position: center top; }
[data-decor~="dots"] body { background-image: radial-gradient(color-mix(in srgb, var(--ink) 16%, transparent) 1px, transparent 1.4px); background-size: 22px 22px; }
[data-decor~="glow"] .lp-hero::before { content: ""; position: absolute; z-index: -1; inset: -20% 10% auto; height: 80%; background: radial-gradient(50% 50% at 50% 50%, color-mix(in srgb, var(--accent) 38%, transparent), transparent 70%); filter: blur(30px); pointer-events: none; }
[data-decor~="glass"] .lp-benefit, [data-decor~="glass"] .lp-plan, [data-decor~="glass"] .lp-quote, [data-decor~="glass"] .lp-formcard, [data-decor~="glass"] .lp-tile { background: color-mix(in srgb, var(--surface) 55%, transparent); backdrop-filter: blur(18px) saturate(1.3); -webkit-backdrop-filter: blur(18px) saturate(1.3); }
[data-decor~="outline"] .lp-benefit, [data-decor~="outline"] .lp-plan, [data-decor~="outline"] .lp-quote, [data-decor~="outline"] .lp-tile { background: transparent; border: 1.5px solid var(--ink); }
[data-decor~="hard-shadow"] .lp-benefit, [data-decor~="hard-shadow"] .lp-plan, [data-decor~="hard-shadow"] .lp-quote, [data-decor~="hard-shadow"] .lp-formcard, [data-decor~="hard-shadow"] .lp-tile, [data-decor~="hard-shadow"] .lp-btn { border: 2px solid var(--ink); box-shadow: 6px 6px 0 var(--ink); }
[data-decor~="hard-shadow"] .lp-btn:hover { transform: translate(-2px, -2px); box-shadow: 8px 8px 0 var(--ink); }
[data-decor~="sharp"] { --radius: 0px !important; --radius-lg: 0px !important; }
[data-decor~="pill"] .lp-benefit, [data-decor~="pill"] .lp-tile, [data-decor~="pill"] .lp-plan { border-radius: 36px; }
[data-decor~="beam"] .lp-plan.is-featured, [data-decor~="beam"] .lp-formcard, [data-decor~="beam"] .lp-tile--hero { position: relative; isolation: isolate; }
[data-decor~="beam"] .lp-plan.is-featured::after, [data-decor~="beam"] .lp-formcard::after, [data-decor~="beam"] .lp-tile--hero::after { content: ""; position: absolute; inset: -1.5px; z-index: -1; border-radius: inherit; padding: 1.5px; background: conic-gradient(from var(--beam, 0deg), transparent 0 70%, var(--accent) 80%, var(--accent-2) 88%, transparent 96%); -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite: xor; mask-composite: exclude; animation: lp-beam 5s linear infinite; }
@property --beam { syntax: "<angle>"; inherits: false; initial-value: 0deg; }
@keyframes lp-beam { to { --beam: 360deg; } }
[data-decor~="cursor-glow"] body::after { content: ""; position: fixed; z-index: 0; left: 0; top: 0; width: 520px; height: 520px; margin: -260px 0 0 -260px; border-radius: 50%; pointer-events: none; background: radial-gradient(closest-side, color-mix(in srgb, var(--accent) 16%, transparent), transparent); transform: translate(var(--cx, -999px), var(--cy, -999px)); }
[data-decor~="noise-bands"] .lp-sec--tint { background: linear-gradient(180deg, var(--surface), color-mix(in srgb, var(--surface) 70%, var(--accent) 6%)); }
[data-decor~="rule-lines"] .lp-sec + .lp-sec { border-top: 1px solid var(--line); }
[data-decor~="big-numbers"] .lp-step::before { font-size: var(--step-6); opacity: .9; }
[data-decor~="caps-kicker"] .lp-kicker { padding: 6px 12px; border-radius: 999px; background: color-mix(in srgb, var(--accent) 14%, transparent); }

/* ---------- shared hero bits ---------- */
.lp-hero__title-wrap { display: grid; gap: 18px; }
.lp-chip { display: inline-flex; align-items: center; gap: 8px; padding: 10px 14px; border-radius: 14px; background: var(--surface); color: var(--ink); border: 1px solid var(--line); box-shadow: 0 18px 40px -18px color-mix(in srgb, var(--ink) 45%, transparent); font-size: var(--step--1); white-space: nowrap; }
.lp-chip b { color: var(--accent); }

/* hero-bento */
.lp-hero--bento .lp-wrap { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr); gap: clamp(28px, 4vw, 64px); align-items: center; }
.lp-bento { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); grid-auto-rows: minmax(110px, auto); gap: 12px; }
.lp-tile { border-radius: var(--radius-lg, 22px); background: var(--surface); border: 1px solid var(--line); padding: 18px; overflow: hidden; display: grid; align-content: space-between; gap: 10px; position: relative; }
.lp-tile--hero { grid-column: span 2; grid-row: span 2; padding: 0; }
.lp-tile--hero img { width: 100%; height: 100%; object-fit: cover; }
.lp-tile--wide { grid-column: span 2; }
.lp-tile--accent { background: var(--accent); color: var(--on-accent); border-color: transparent; }
.lp-tile__num { font-family: var(--font-display); font-size: var(--step-3); line-height: 1; font-weight: var(--display-weight); }
.lp-tile small { font-size: var(--step--1); opacity: .8; }
@media (max-width: 900px) { .lp-hero--bento .lp-wrap { grid-template-columns: 1fr; } }
@media (max-width: 520px) { .lp-bento { grid-template-columns: repeat(2, minmax(0, 1fr)); } .lp-tile--hero { grid-column: span 2; aspect-ratio: 4/3; } }

/* hero-kinetic */
.lp-hero--kinetic { min-height: min(100svh, 940px); display: grid; align-items: end; padding-bottom: 0; }
.lp-hero--kinetic .lp-wrap { display: grid; gap: 22px; padding-bottom: clamp(28px, 4vw, 56px); }
.lp-kinetic { font-family: var(--font-display); font-weight: var(--display-weight); text-transform: var(--display-case); letter-spacing: var(--display-tracking); line-height: .86; font-size: clamp(3rem, 1rem + 9.6vw, 12rem); }
.lp-kinetic .ae-rotator { color: var(--accent); }
.lp-hero--kinetic .lp-hero__foot { display: flex; flex-wrap: wrap; gap: 24px; justify-content: space-between; align-items: end; }
.lp-hero__band { border-block: 1px solid var(--line); padding: 14px 0; font-family: var(--font-mono); font-size: var(--step--1); text-transform: uppercase; letter-spacing: .1em; }
@media (max-width: 600px) { .lp-kinetic { font-size: 13vw; } .lp-kinetic .ae-rotator { font-size: .82em; } }

/* hero-mosaic (floating photos around the headline) */
.lp-hero--mosaic { min-height: min(100svh, 960px); display: grid; place-items: center; text-align: center; }
.lp-hero--mosaic .lp-wrap { display: grid; gap: 22px; justify-items: center; max-width: 900px; position: relative; z-index: 2; }
.lp-mosaic { position: absolute; inset: 0; z-index: 0; pointer-events: none; }
.lp-mosaic figure { position: absolute; margin: 0; border-radius: var(--radius); overflow: hidden; box-shadow: 0 30px 60px -30px rgba(0,0,0,.5); }
.lp-mosaic img { width: 100%; height: 100%; object-fit: cover; }
.lp-mosaic figure:nth-child(1) { left: 3%; top: 10%; width: 15vw; aspect-ratio: 4/5; }
.lp-mosaic figure:nth-child(2) { left: 9%; bottom: 8%; width: 12vw; aspect-ratio: 1; filter: blur(1.5px); opacity: .85; }
.lp-mosaic figure:nth-child(3) { right: 4%; top: 7%; width: 13vw; aspect-ratio: 1; }
.lp-mosaic figure:nth-child(4) { right: 8%; bottom: 10%; width: 16vw; aspect-ratio: 4/3; }
.lp-mosaic figure:nth-child(5) { left: 24%; top: 3%; width: 8vw; aspect-ratio: 1; filter: blur(3px); opacity: .6; }
.lp-mosaic figure:nth-child(6) { right: 26%; bottom: 3%; width: 9vw; aspect-ratio: 4/5; filter: blur(2px); opacity: .7; }
@media (max-width: 760px) { .lp-mosaic figure { opacity: .35 !important; } .lp-mosaic figure:nth-child(n+5) { display: none; } .lp-mosaic figure { width: 28vw !important; } }

/* hero-phone */
.lp-hero--phone .lp-wrap { display: grid; justify-items: center; text-align: center; gap: 20px; }
.lp-phone { position: relative; width: min(330px, 78vw); margin-top: 28px; }
.lp-phone__frame { border-radius: 46px; border: 10px solid var(--ink); background: var(--ink); overflow: hidden; aspect-ratio: 9 / 19.5; box-shadow: 0 60px 120px -50px color-mix(in srgb, var(--accent) 70%, transparent); }
.lp-phone__frame img { width: 100%; height: 100%; object-fit: cover; }
.lp-phone .lp-chip { position: absolute; }
.lp-phone .lp-chip:nth-of-type(1) { left: -46%; top: 18%; }
.lp-phone .lp-chip:nth-of-type(2) { right: -50%; top: 42%; }
.lp-phone .lp-chip:nth-of-type(3) { left: -40%; top: 70%; }
@media (max-width: 760px) { .lp-phone .lp-chip:nth-of-type(1) { left: -10%; } .lp-phone .lp-chip:nth-of-type(2) { right: -10%; } .lp-phone .lp-chip:nth-of-type(3) { left: -6%; } .lp-phone .lp-chip { font-size: 12px; padding: 8px 10px; max-width: 70vw; white-space: normal; } }
.lp-float { animation: lp-float 6s ease-in-out infinite; }
.lp-float:nth-of-type(2) { animation-delay: -2s; } .lp-float:nth-of-type(3) { animation-delay: -4s; }
@keyframes lp-float { 50% { transform: translateY(-12px); } }

/* hero-terminal / hero-chat (split copy + live demo panel) */
.lp-hero--demo .lp-wrap { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr); gap: clamp(28px, 5vw, 72px); align-items: center; }
.lp-hero--demo .lp-hero__copy { display: grid; gap: 20px; justify-items: start; }
@media (max-width: 900px) { .lp-hero--demo .lp-wrap { grid-template-columns: 1fr; } }
.lp-term { border-radius: 16px; background: #0b0d10; color: #d6e2ee; font-family: var(--font-mono); font-size: 14px; line-height: 1.7; box-shadow: 0 40px 100px -40px rgba(0,0,0,.7), 0 0 0 1px rgba(255,255,255,.08); overflow: hidden; }
.lp-term__bar { display: flex; gap: 6px; padding: 12px 14px; background: rgba(255,255,255,.04); }
.lp-term__bar i { width: 11px; height: 11px; border-radius: 50%; background: #ff5f57; } .lp-term__bar i:nth-child(2) { background: #febc2e; } .lp-term__bar i:nth-child(3) { background: #28c840; }
.lp-term pre { margin: 0; padding: 18px 20px 22px; min-height: 260px; white-space: pre-wrap; overflow-wrap: anywhere; }
.lp-term .ok { color: #7ee787; } .lp-term .dim { color: #7d8590; } .lp-term .acc { color: var(--accent); }
.lp-term .caret { display: inline-block; width: .6em; height: 1.1em; background: currentColor; vertical-align: -2px; animation: lp-blink 1s steps(2) infinite; }
@keyframes lp-blink { 50% { opacity: 0; } }
.lp-chat { border-radius: var(--radius-lg, 24px); background: var(--surface); border: 1px solid var(--line); padding: 18px; display: grid; gap: 12px; min-height: 340px; align-content: start; box-shadow: 0 40px 100px -50px color-mix(in srgb, var(--ink) 60%, transparent); }
.lp-msg { max-width: 82%; padding: 12px 16px; border-radius: 18px; font-size: var(--step--1); line-height: 1.5; opacity: 0; transform: translateY(10px); transition: opacity .5s var(--ease-out), transform .5s var(--ease-out); }
.lp-msg.is-on { opacity: 1; transform: none; }
.lp-msg--user { justify-self: end; background: var(--accent); color: var(--on-accent); border-bottom-right-radius: 6px; }
.lp-msg--bot { background: color-mix(in srgb, var(--ink) 7%, var(--bg)); border-bottom-left-radius: 6px; }
.lp-typing { display: inline-flex; gap: 4px; } .lp-typing i { width: 6px; height: 6px; border-radius: 50%; background: var(--muted); animation: lp-dots 1s infinite; } .lp-typing i:nth-child(2) { animation-delay: .15s; } .lp-typing i:nth-child(3) { animation-delay: .3s; }
@keyframes lp-dots { 50% { opacity: .2; transform: translateY(-3px); } }

/* hero-scrollzoom (pinned; media grows to full screen) */
.lp-hero--zoom { padding: 0; }
.lp-zoom { height: 220vh; position: relative; }
.lp-zoom__pin { position: sticky; top: 0; height: 100svh; display: grid; place-items: center; overflow: hidden; }
.lp-zoom__media { position: absolute; inset: 0; margin: 0; }
.lp-zoom__media img, .lp-zoom__media video { width: 100%; height: 100%; object-fit: cover; }
.lp-zoom__copy { position: relative; z-index: 2; text-align: center; display: grid; gap: 18px; justify-items: center; color: #fff; --ink: #fff; padding-inline: var(--gutter); text-shadow: 0 2px 30px rgba(0,0,0,.35); }
.lp-zoom__copy .lp-sub { color: rgba(255,255,255,.9); margin-inline: auto; }

/* hero-spotlight */
.lp-hero--spot { min-height: min(100svh, 920px); display: grid; place-items: center; text-align: center; background: #050505; color: #fff; --ink: #fff; --muted: rgba(255,255,255,.7); }
.lp-hero--spot .lp-spot__img { position: absolute; inset: 0; z-index: -1; background-size: cover; background-position: center; -webkit-mask-image: radial-gradient(circle 260px at var(--x, 50%) var(--y, 45%), #000 30%, transparent 75%); mask-image: radial-gradient(circle 260px at var(--x, 50%) var(--y, 45%), #000 30%, transparent 75%); opacity: .9; }
@media (hover: none) { .lp-hero--spot .lp-spot__img { -webkit-mask-image: linear-gradient(transparent, #000 40%, #000 60%, transparent); mask-image: linear-gradient(transparent, #000 40%, #000 60%, transparent); opacity: .55; } }
.lp-hero--spot .lp-wrap { display: grid; gap: 22px; justify-items: center; }

/* hero-poster (brutal / fun) */
.lp-hero--poster { min-height: min(100svh, 900px); display: grid; align-items: center; }
.lp-hero--poster .lp-wrap { display: grid; gap: 22px; position: relative; }
.lp-poster { font-family: var(--font-display); font-weight: var(--display-weight); text-transform: var(--display-case); line-height: .84; letter-spacing: var(--display-tracking); font-size: clamp(3.2rem, 1rem + 10vw, 13rem); }
.lp-poster span { display: block; }
.lp-poster span:nth-child(2) { color: var(--accent); padding-left: 8vw; }
.lp-poster span:nth-child(3) { color: transparent; -webkit-text-stroke: 2px var(--ink); }
.lp-sticker { position: absolute; display: grid; place-items: center; text-align: center; width: clamp(96px, 12vw, 150px); aspect-ratio: 1; border-radius: 50%; background: var(--accent-2); color: var(--ink); font-family: var(--font-display); font-weight: 700; font-size: clamp(12px, 1.3vw, 16px); line-height: 1.05; padding: 12px; transform: rotate(-12deg); box-shadow: 4px 4px 0 var(--ink); z-index: 2; }
.lp-sticker--spin { animation: ae-spin 14s linear infinite; }
@keyframes ae-spin { to { transform: rotate(348deg); } }
.lp-poster__img { position: absolute; right: 0; top: 50%; translate: 0 -50%; width: min(34vw, 460px); aspect-ratio: 4/5; border-radius: var(--radius-lg, 24px); overflow: hidden; z-index: -1; rotate: 4deg; }
.lp-poster__img img { width: 100%; height: 100%; object-fit: cover; }
@media (max-width: 760px) { .lp-poster__img { position: relative; translate: none; width: 70%; margin: 20px auto 0; right: auto; top: auto; } .lp-poster span:nth-child(2) { padding-left: 0; } }

/* hero-editorial (magazine cover) */
.lp-hero--editorial .lp-wrap { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(24px, 4vw, 64px); align-items: end; }
.lp-masthead { grid-column: 1 / -1; display: flex; justify-content: space-between; gap: 16px; border-bottom: 2px solid var(--ink); padding-bottom: 12px; font-family: var(--font-mono); font-size: var(--step--1); text-transform: uppercase; letter-spacing: .08em; flex-wrap: wrap; }
.lp-hero--editorial .lp-hero__copy { display: grid; gap: 20px; }
.lp-hero--editorial figure { margin: 0; }
.lp-hero--editorial figure img { width: 100%; aspect-ratio: 4/5; object-fit: cover; border-radius: var(--radius); }
.lp-hero--editorial figcaption { font-family: var(--font-mono); font-size: 12px; color: var(--muted); margin-top: 8px; }
@media (max-width: 860px) { .lp-hero--editorial .lp-wrap { grid-template-columns: 1fr; } }

/* hero-orbit */
.lp-hero--orbit .lp-wrap { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(24px, 4vw, 64px); align-items: center; }
.lp-hero--orbit .lp-hero__copy { display: grid; gap: 20px; justify-items: start; }
.lp-orbit { position: relative; aspect-ratio: 1; width: min(100%, 520px); justify-self: center; display: grid; place-items: center; }
.lp-orbit__ring { position: absolute; inset: 0; border-radius: 50%; border: 1px dashed var(--line); animation: ae-spin-ring 40s linear infinite; }
.lp-orbit__ring--2 { inset: 18%; animation-duration: 28s; animation-direction: reverse; }
.lp-orbit__core { width: 34%; aspect-ratio: 1; border-radius: 28%; display: grid; place-items: center; background: var(--accent); color: var(--on-accent); font-family: var(--font-display); font-weight: 800; font-size: clamp(1.2rem, 2.4vw, 2rem); box-shadow: 0 30px 80px -20px color-mix(in srgb, var(--accent) 80%, transparent); text-align: center; padding: 10px; overflow-wrap: normal; }
.lp-orbit__item { position: absolute; left: 50%; top: 50%; width: 0; height: 0; }
.lp-orbit__item span { position: absolute; transform: translate(-50%, -50%); }
@keyframes ae-spin-ring { to { transform: rotate(360deg); } }
@media (max-width: 860px) { .lp-hero--orbit .lp-wrap { grid-template-columns: 1fr; } .lp-orbit { width: min(100%, 360px); } }

/* hero-ticket */
.lp-hero--ticket .lp-wrap { display: grid; justify-items: center; gap: 24px; text-align: center; }
.lp-ticket { display: grid; grid-template-columns: minmax(0, 1fr) auto; width: min(100%, 900px); border-radius: 26px; background: var(--surface); color: var(--ink); text-align: left; position: relative; box-shadow: 0 50px 120px -60px color-mix(in srgb, var(--accent) 80%, transparent); }
.lp-ticket__main { padding: clamp(22px, 4vw, 44px); display: grid; gap: 14px; min-width: 0; }
.lp-ticket__stub { padding: clamp(22px, 3vw, 36px); border-left: 2px dashed var(--line); display: grid; gap: 10px; align-content: center; justify-items: center; min-width: 170px; }
.lp-ticket::before, .lp-ticket::after { content: ""; position: absolute; right: calc(170px - 14px); width: 28px; height: 28px; border-radius: 50%; background: var(--bg); }
.lp-ticket::before { top: -14px; } .lp-ticket::after { bottom: -14px; }
@media (max-width: 700px) { .lp-ticket { grid-template-columns: 1fr; } .lp-ticket__stub { border-left: 0; border-top: 2px dashed var(--line); } .lp-ticket::before, .lp-ticket::after { display: none; } }

/* hero-gradient-type */
.lp-hero--gtype { min-height: min(96svh, 900px); display: grid; place-items: center; text-align: center; }
.lp-hero--gtype .lp-wrap { display: grid; gap: 24px; justify-items: center; }
.lp-gtype { font-family: var(--font-display); font-weight: var(--display-weight); text-transform: var(--display-case); letter-spacing: var(--display-tracking); line-height: .9; font-size: clamp(3rem, 1rem + 9vw, 11.5rem); background: linear-gradient(100deg, var(--ink) 10%, var(--accent) 45%, var(--accent-2) 70%, var(--ink) 95%); background-size: 220% 100%; -webkit-background-clip: text; background-clip: text; color: transparent; animation: lp-gshift 9s ease-in-out infinite alternate; }
@keyframes lp-gshift { to { background-position: 100% 0; } }

/* hero-stack (fanned cards) */
.lp-hero--stack .lp-wrap { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(28px, 5vw, 80px); align-items: center; }
.lp-hero--stack .lp-hero__copy { display: grid; gap: 20px; justify-items: start; }
.lp-fan { position: relative; aspect-ratio: 1; width: min(100%, 520px); justify-self: center; }
.lp-fan figure { position: absolute; inset: 12% 22%; margin: 0; border-radius: var(--radius-lg, 22px); overflow: hidden; box-shadow: 0 30px 70px -30px rgba(0,0,0,.55); transition: transform .9s var(--ease-out); background: var(--surface); }
.lp-fan figure img { width: 100%; height: 100%; object-fit: cover; }
.lp-fan figure:nth-child(1) { transform: rotate(-10deg) translateX(-18%); }
.lp-fan figure:nth-child(2) { transform: rotate(8deg) translateX(18%); }
.lp-fan figure:nth-child(3) { transform: translateY(-4%); z-index: 2; }
.lp-fan:hover figure:nth-child(1) { transform: rotate(-16deg) translateX(-32%); }
.lp-fan:hover figure:nth-child(2) { transform: rotate(14deg) translateX(32%); }
@media (max-width: 860px) { .lp-hero--stack .lp-wrap { grid-template-columns: 1fr; } }

/* ---------- section variants ---------- */
.lp-bentoS { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 14px; grid-auto-rows: minmax(190px, auto); }
.lp-bentoS > * { grid-column: span 2; }
.lp-bentoS > :nth-child(1) { grid-column: span 4; grid-row: span 2; }
.lp-bentoS > :nth-child(4) { grid-column: span 3; } .lp-bentoS > :nth-child(5) { grid-column: span 3; }
.lp-bentoS .lp-tile img { width: 100%; height: 100%; object-fit: cover; position: absolute; inset: 0; z-index: 0; opacity: .9; }
.lp-bentoS .lp-tile > div { position: relative; z-index: 1; display: grid; gap: 8px; }
.lp-bentoS .lp-tile--img { color: #fff; } .lp-bentoS .lp-tile--img::after { content: ""; position: absolute; inset: 0; background: linear-gradient(transparent 35%, rgba(0,0,0,.7)); z-index: 0; }
@media (max-width: 860px) { .lp-bentoS { grid-template-columns: 1fr 1fr; } .lp-bentoS > *, .lp-bentoS > :nth-child(n) { grid-column: span 2; grid-row: auto; } }
.lp-biglist { list-style: none; margin: 0; padding: 0; counter-reset: b; border-top: 1px solid var(--line); }
.lp-biglist li { display: grid; grid-template-columns: minmax(70px, .3fr) minmax(0, 1fr) minmax(0, 1.2fr); gap: 20px; padding: clamp(20px, 3vw, 36px) 0; border-bottom: 1px solid var(--line); align-items: baseline; }
.lp-biglist li::before { counter-increment: b; content: "0" counter(b); font-family: var(--font-mono); color: var(--accent); }
.lp-biglist h3 { font-family: var(--font-display); font-size: var(--step-3); line-height: 1; font-weight: var(--display-weight); overflow-wrap: normal; }
.lp-biglist p { margin: 0; color: var(--muted); }
@media (max-width: 760px) { .lp-biglist li { grid-template-columns: 1fr; gap: 8px; } }
.lp-story { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: clamp(28px, 5vw, 90px); }
.lp-story__media { position: sticky; top: 12vh; height: 76vh; border-radius: var(--radius-lg, 24px); overflow: hidden; background: var(--surface); }
.lp-story__media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0; transform: scale(1.06); transition: opacity .7s var(--ease-out), transform 1.2s var(--ease-out); }
.lp-story__media img.is-active { opacity: 1; transform: none; }
.lp-story__steps { display: grid; }
.lp-story__step { min-height: 72vh; display: grid; align-content: center; gap: 14px; opacity: .3; transition: opacity .5s; }
.lp-story__step.is-active { opacity: 1; }
.lp-story__step img { display: none; border-radius: var(--radius); }
@media (max-width: 860px) { .lp-story { grid-template-columns: 1fr; } .lp-story__media { display: none; } .lp-story__step { min-height: 0; padding-block: 28px; opacity: 1; } .lp-story__step img { display: block; width: 100%; } }
.lp-tabsS [role=tablist], .lp-tabsS .lp-tabsS__list { display: flex; gap: 8px; flex-wrap: wrap; justify-content: center; margin-bottom: 28px; }
.lp-tabsS [data-tab] { padding: .7em 1.2em; border-radius: 999px; box-shadow: inset 0 0 0 1px var(--line); font-size: var(--step--1); }
.lp-tabsS [data-tab].is-active { background: var(--ink); color: var(--bg); }
.lp-tabsS [data-panel] { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.3fr); gap: clamp(24px, 4vw, 64px); align-items: center; }
.lp-tabsS [data-panel] img { width: 100%; border-radius: var(--radius-lg, 22px); aspect-ratio: 4/3; object-fit: cover; }
@media (max-width: 860px) { .lp-tabsS [data-panel] { grid-template-columns: 1fr; } }
.lp-qmarquee { display: grid; gap: 16px; }
.lp-qmarquee .lp-quote { width: min(380px, 80vw); margin: 0; flex-shrink: 0; white-space: normal; }
.lp-timeline { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 200px), 1fr)); gap: 24px; position: relative; list-style: none; padding: 0; margin: 0; }
.lp-timeline::before { content: ""; position: absolute; left: 0; right: 0; top: 22px; height: 2px; background: linear-gradient(90deg, var(--accent), var(--accent-2)); }
.lp-timeline li { position: relative; padding-top: 58px; display: grid; gap: 8px; }
.lp-timeline li::before { content: attr(data-n); position: absolute; top: 0; left: 0; width: 46px; height: 46px; border-radius: 50%; display: grid; place-items: center; background: var(--bg); border: 2px solid var(--accent); font-family: var(--font-mono); font-weight: 700; }
.lp-timeline p { margin: 0; color: var(--muted); }
@media (max-width: 700px) { .lp-timeline::before { left: 22px; right: auto; top: 0; bottom: 0; width: 2px; height: auto; } .lp-timeline li { padding: 0 0 0 64px; min-height: 46px; } }
.lp-faqsplit { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: clamp(28px, 5vw, 90px); align-items: start; }
.lp-faqsplit > :first-child { position: sticky; top: 14vh; display: grid; gap: 16px; }
@media (max-width: 860px) { .lp-faqsplit { grid-template-columns: 1fr; } .lp-faqsplit > :first-child { position: static; } }
.lp-giant { text-align: center; display: grid; gap: 26px; justify-items: center; overflow: clip; }
.lp-giant__type { font-family: var(--font-display); font-weight: var(--display-weight); text-transform: var(--display-case); letter-spacing: var(--display-tracking); line-height: .86; font-size: clamp(3rem, 1rem + 10vw, 12rem); }
.lp-hgal .ae-h-track > figure { flex: 0 0 min(70vw, 620px); height: min(68vh, 560px); margin: 0; border-radius: var(--radius-lg, 22px); overflow: hidden; }
.lp-hgal .ae-h-track img { width: 100%; height: 100%; object-fit: cover; }
.lp-hgal .ae-h-track > .lp-hgal__intro { flex: 0 0 min(80vw, 460px); display: grid; align-content: center; gap: 16px; }

/* readability veils for text over media */
.lp-zoom__media::after { content: ""; position: absolute; inset: 0; background: radial-gradient(70% 60% at 50% 50%, rgba(0,0,0,.45), rgba(0,0,0,.15) 70%), linear-gradient(180deg, rgba(0,0,0,.1), rgba(0,0,0,.45)); pointer-events: none; }
.lp-hero--spot::after { content: ""; position: absolute; inset: 0; z-index: -1; background: radial-gradient(60% 50% at 50% 50%, rgba(0,0,0,.35), transparent 70%); pointer-events: none; }

/* split heroes with a live panel: headline must leave the CTA above the fold */
.lp-hero--demo .lp-h1, .lp-hero--orbit .lp-h1, .lp-hero--stack .lp-h1, .lp-hero--bento .lp-h1 { font-size: clamp(2.3rem, 1.1rem + 3.4vw, 4.6rem); }
.lp-hero--demo, .lp-hero--orbit, .lp-hero--stack, .lp-hero--bento { padding-top: clamp(32px, 5vw, 72px); }
/* image tiles: copy sits at the bottom, over the dark gradient */
.lp-bentoS .lp-tile--img { align-content: end; min-height: 320px; }
.lp-bentoS .lp-tile--img > div { text-shadow: 0 1px 12px rgba(0,0,0,.35); }
/* price + period never collide: period wraps under the amount when space runs out */
.lp-plan__price { display: flex; flex-wrap: wrap; align-items: baseline; column-gap: 8px; row-gap: 2px; }
.lp-plan__price small { white-space: nowrap; }