:root {
  --radius: .875rem;
  --background: #fff;
  --foreground: oklch(.18 .02 165);
  --brand: oklch(.62 .18 155);
  --brand-dark: oklch(.48 .15 155);
  --brand-soft: oklch(.96 .04 155);
  --brand-foreground: #fff;
  --surface: #f7faf9;
  --card: #fff;
  --muted: color-mix(in oklab, var(--foreground) 64%, white);
  --border: rgba(15, 23, 42, .1);
  --input: rgba(15, 23, 42, .16);
  --danger: #b91c1c;
  --shadow-soft: 0 4px 18px -10px rgba(0, 0, 0, .22);
  --shadow-strong: 0 28px 80px -28px color-mix(in oklab, var(--brand) 58%, transparent);
  --font-sans: Sora, Manrope, Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--background); color: var(--foreground); font-family: var(--font-sans); -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
h1, h2, h3, p { margin: 0; }
a { color: inherit; text-decoration: none; }
img { display: block; max-width: 100%; }
button, input, select { font: inherit; }
svg { width: 1em; height: 1em; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; flex: 0 0 auto; }
.svg-sprite { position: absolute; width: 0; height: 0; overflow: hidden; }
.page { min-height: 100vh; overflow: clip; }
.container { width: min(100% - 2rem, 72rem); margin: 0 auto; }
section { scroll-margin-top: 5rem; }

.site-header { position: sticky; top: 0; z-index: 40; background: var(--brand); border-bottom: 1px solid rgba(255, 255, 255, .15); backdrop-filter: blur(12px); }
.header-inner { height: 4rem; display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.brand img { width: auto; height: 2.2rem; filter: brightness(0) invert(1); }
.nav { display: none; align-items: center; gap: 1.5rem; color: rgba(255, 255, 255, .9); font-size: .875rem; font-weight: 700; }
.nav a { transition: color .2s ease; }
.nav a:hover { color: #fff; }
.header-cta { display: none; align-items: center; gap: .5rem; border-radius: 999px; background: #fff; color: var(--brand-dark); padding: .72rem 1.2rem; font-size: .875rem; font-weight: 800; box-shadow: 0 0 20px -4px rgba(0,0,0,.25); transition: transform .2s ease, background .2s ease; }
.header-cta:hover { background: rgba(255,255,255,.92); transform: translateY(-1px); }
.header-cta svg { width: 1rem; height: 1rem; }

.hero { position: relative; overflow: hidden; background: #020403; color: #fff; }
.hero-glow { position: absolute; pointer-events: none; border-radius: 999px; opacity: .55; filter: blur(120px); background: radial-gradient(circle, color-mix(in oklab, var(--brand) 86%, white) 0%, transparent 70%); }
.hero-glow-a { width: 32rem; height: 32rem; left: -12rem; top: -12rem; }
.hero-glow-b { width: 28rem; height: 28rem; right: -7rem; bottom: -11rem; }
.hero-glow-c { width: 24rem; height: 24rem; left: 20%; bottom: -13rem; }
.hero-grid-bg { position: absolute; inset: 0; pointer-events: none; opacity: .06; background-image: linear-gradient(var(--brand) 1px, transparent 1px), linear-gradient(90deg, var(--brand) 1px, transparent 1px); background-size: 44px 44px; mask-image: radial-gradient(ellipse at 50% 40%, #000 38%, transparent 75%); }
.hero-grid { position: relative; display: grid; gap: 2.5rem; align-items: center; padding: 3.5rem 0 0; }
.hero-copy { min-width: 0; padding-bottom: 2rem; }
.hero-pill { display: inline-flex; align-items: center; gap: .5rem; width: fit-content; border: 1px solid color-mix(in oklab, var(--brand) 42%, transparent); border-radius: 999px; background: color-mix(in oklab, var(--brand) 14%, transparent); color: color-mix(in oklab, var(--brand) 74%, white); padding: .42rem .75rem; font-size: .7rem; line-height: 1; font-weight: 900; letter-spacing: .14em; text-transform: uppercase; box-shadow: 0 0 20px -6px color-mix(in oklab, var(--brand) 70%, transparent); }
.hero-pill span { width: .38rem; height: .38rem; border-radius: 50%; background: var(--brand); box-shadow: 0 0 10px 2px color-mix(in oklab, var(--brand) 70%, transparent); }
.hero h1 { margin-top: 1.25rem; max-width: 42rem; font-size: clamp(2.45rem, 6vw, 3.75rem); line-height: 1.02; letter-spacing: 0; font-weight: 900; }
.hero h1 span { color: var(--brand); text-shadow: 0 0 24px color-mix(in oklab, var(--brand) 45%, transparent); }
.hero-copy p { margin-top: 1.25rem; max-width: 36rem; color: rgba(255, 255, 255, .72); font-size: clamp(1rem, 2vw, 1.125rem); line-height: 1.65; }
.hero-copy strong { color: #fff; }
.hero-note { margin: 1.75rem 0 0; padding: 0; list-style: none; display: flex; flex-wrap: wrap; gap: .5rem; }
.hero-note li { display: inline-flex; align-items: center; gap: .55rem; border: 1px solid color-mix(in oklab, var(--brand) 32%, transparent); border-radius: 999px; background: rgba(255,255,255,.04); color: rgba(255,255,255,.9); padding: .5rem .8rem; font-size: .8rem; line-height: 1.25; font-weight: 700; }
.hero-note span { width: .38rem; height: .38rem; border-radius: 50%; background: var(--brand); box-shadow: 0 0 8px 1px var(--brand); }

.form-wrap { position: relative; min-width: 0; scroll-margin-top: 5rem; }
.form-anchor { position: absolute; top: 0; left: 0; width: 1px; height: 1px; scroll-margin-top: 5.25rem; pointer-events: none; }
.form-glow { position: absolute; inset: -1.5rem; pointer-events: none; border-radius: 2rem; background: radial-gradient(60% 60% at 50% 50%, color-mix(in oklab, var(--brand) 55%, transparent), transparent 70%); opacity: .8; filter: blur(24px); }
.lead-form { position: relative; min-width: 0; border: 1px solid color-mix(in oklab, var(--brand) 42%, white); border-radius: 1.45rem; background: #fff; color: var(--foreground); padding: 1.5rem; box-shadow: 0 0 0 1px color-mix(in oklab, var(--brand) 44%, transparent), 0 0 42px color-mix(in oklab, var(--brand) 48%, transparent), 0 26px 80px -20px color-mix(in oklab, var(--brand) 58%, transparent); }
.form-label { display: inline-flex; align-items: center; gap: .45rem; border-radius: 999px; background: var(--brand-soft); color: var(--brand-dark); padding: .36rem .78rem; font-size: .78rem; font-weight: 900; }
.form-label svg { width: .9rem; height: .9rem; }
.lead-form h2 { margin-top: .75rem; color: var(--foreground); font-size: clamp(1.45rem, 4.5vw, 1.75rem); line-height: 1.12; font-weight: 900; }
.lead-form p { margin-top: .5rem; color: color-mix(in oklab, var(--foreground) 62%, white); font-size: .93rem; line-height: 1.45; }
.form-fields { display: grid; gap: .78rem; margin-top: 1.3rem; }
.two-col { display: grid; gap: .78rem; }
.field { display: block; min-width: 0; }
.field > span:first-child { display: block; margin-bottom: .35rem; color: var(--foreground); font-size: .78rem; line-height: 1; font-weight: 900; }
input, select { width: 100%; min-width: 0; height: 2.9rem; border: 1px solid var(--input); border-radius: .55rem; background: #fff; color: var(--foreground); padding: 0 .8rem; font-size: .94rem; outline: none; transition: border-color .2s ease, box-shadow .2s ease, background-color .2s ease; }
input::placeholder { color: rgba(15, 23, 42, .62); }
select { appearance: auto; cursor: pointer; }
input:focus, select:focus { border-color: var(--brand); box-shadow: 0 0 0 3px color-mix(in oklab, var(--brand) 18%, transparent); }
.hint { display: block !important; margin-top: .38rem !important; color: color-mix(in oklab, var(--foreground) 60%, white) !important; font-size: .72rem !important; line-height: 1.2 !important; font-weight: 500 !important; }
.field.has-error input, .field.has-error select { border-color: var(--danger); background: color-mix(in oklab, var(--danger) 4%, white); }
.field-error { display: block; margin-top: .35rem; color: var(--danger); font-size: .72rem; line-height: 1.3; font-weight: 800; }
.submit { display: inline-flex; align-items: center; justify-content: center; gap: .55rem; min-height: 3rem; width: 100%; margin-top: .5rem; border: 0; border-radius: .7rem; background: var(--brand); color: #fff; padding: .75rem 1rem; font-size: 1rem; line-height: 1.2; font-weight: 900; cursor: pointer; box-shadow: 0 16px 36px -18px color-mix(in oklab, var(--brand) 80%, transparent); transition: background .2s ease, transform .2s ease, box-shadow .2s ease, opacity .2s ease; }
.submit:hover { background: var(--brand-dark); box-shadow: 0 18px 42px -18px color-mix(in oklab, var(--brand) 95%, transparent); }
.submit:active { transform: scale(.99); }
.submit:disabled { opacity: .68; cursor: wait; }
.submit svg { width: 1.08rem; height: 1.08rem; }

.marquee { position: relative; z-index: 1; overflow: hidden; border-block: 1px solid color-mix(in oklab, var(--brand) 52%, transparent); background: var(--brand); color: #fff; padding: 1rem 0; }
.marquee div { display: flex; width: max-content; gap: 2.5rem; white-space: nowrap; animation: marquee 35s linear infinite; }
.marquee span { display: inline-flex; gap: 2.5rem; font-size: .9rem; font-weight: 900; letter-spacing: .04em; text-transform: uppercase; }
@keyframes marquee { to { transform: translateX(-50%); } }

.problem { border-block: 1px solid rgba(0,0,0,.05); background: #fff; }
.problem-grid { display: grid; align-items: center; gap: 2.5rem; padding: 3.5rem 0; }
.problem-image { overflow: hidden; border-radius: 1rem; }
.problem-image img { width: 100%; height: 100%; object-fit: cover; }
.problem h2, .section-head h2, .faq-wrap h2 { font-size: clamp(1.9rem, 4vw, 2.5rem); line-height: 1.15; letter-spacing: 0; font-weight: 900; }
.problem p { margin-top: 1rem; color: var(--muted); font-size: clamp(1rem, 2vw, 1.125rem); line-height: 1.7; }

.section { background: #fff; padding: 4rem 0; }
.white-section { background: #fff; }
.section-head { max-width: 42rem; margin-bottom: 2.5rem; }
.section-head.center { margin-inline: auto; text-align: center; }
.section-head.align-left { margin-inline: 0; color: #fff; }
.section-head h2 span { color: var(--brand); }
.eyebrow { display: inline-flex; margin-bottom: .65rem; color: rgba(255,255,255,.75); font-size: .75rem; font-weight: 900; letter-spacing: .12em; text-transform: uppercase; }
.benefits-grid { display: grid; gap: 1rem; }
.card { border: 1px solid rgba(15,23,42,.06); border-radius: 1rem; background: #fff; padding: 1.5rem; transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease; }
.card:hover { transform: translateY(-.25rem); border-color: color-mix(in oklab, var(--brand) 30%, transparent); box-shadow: 0 22px 50px -28px color-mix(in oklab, var(--brand) 60%, transparent); }
.icon-box { display: grid; place-items: center; width: 2.75rem; height: 2.75rem; border-radius: .75rem; background: var(--brand-soft); color: var(--brand-dark); transition: background .2s ease, color .2s ease; }
.card:hover .icon-box { background: var(--brand); color: #fff; }
.icon-box svg { width: 1.25rem; height: 1.25rem; }
.card h3 { margin-top: 1rem; font-size: 1rem; line-height: 1.35; font-weight: 900; }
.card p, .why-grid p, .steps-grid p { margin-top: .45rem; color: var(--muted); font-size: .9rem; line-height: 1.6; }

.steps-section { background: var(--brand); color: #fff; padding: 4rem 0; }
.steps-grid { display: grid; gap: 1rem; margin: 0; padding: 0; list-style: none; }
.steps-grid li { border: 1px solid rgba(0,0,0,.05); border-radius: 1rem; background: #fff; color: var(--foreground); padding: 1.5rem; box-shadow: 0 10px 30px -20px rgba(0,0,0,.35); }
.steps-grid div { display: flex; align-items: center; gap: .75rem; margin-bottom: 1rem; }
.steps-grid span { display: grid; place-items: center; width: 2.25rem; height: 2.25rem; border-radius: .55rem; background: var(--brand); color: #fff; font-weight: 900; }
.steps-grid svg { color: var(--brand); width: 1.25rem; height: 1.25rem; }
.steps-grid h3 { font-size: 1rem; line-height: 1.4; font-weight: 900; }
.carousel-controls { display: none; justify-content: center; gap: .75rem; margin-top: 1rem; }
.carousel-control { display: grid; place-items: center; width: 2.75rem; height: 2.75rem; border: 1px solid rgba(255,255,255,.3); border-radius: 999px; background: #fff; color: var(--brand); box-shadow: var(--shadow-soft); cursor: pointer; transition: transform .2s ease, background-color .2s ease, color .2s ease, border-color .2s ease; }
.carousel-control:hover { transform: translateY(-1px); background: color-mix(in oklab, var(--brand) 8%, white); border-color: rgba(255,255,255,.55); }
.carousel-control svg { width: 1.25rem; height: 1.25rem; }

.why-grid { display: grid; gap: 2rem; }
.why-grid article { text-align: center; }
.why-grid article > div { display: grid; place-items: center; width: 4rem; height: 4rem; margin: 0 auto 1.2rem; border: 1px solid color-mix(in oklab, var(--brand) 20%, transparent); border-radius: 1rem; background: color-mix(in oklab, var(--brand) 10%, transparent); color: var(--brand); }
.why-grid svg { width: 2rem; height: 2rem; }
.why-grid h3 { font-size: 1rem; line-height: 1.35; font-weight: 900; }

.faq-section { border-top: 1px solid rgba(0,0,0,.05); background: color-mix(in oklab, var(--brand-soft) 40%, white); }
.faq-wrap { width: min(100% - 2rem, 48rem); margin: 0 auto; }
.faq-list { margin-top: 2rem; overflow: hidden; border: 1px solid rgba(15,23,42,.1); border-radius: 1rem; background: #fff; }
.faq-list details + details { border-top: 1px solid rgba(15,23,42,.1); }
.faq-list summary { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 1.1rem 1.25rem; cursor: pointer; list-style: none; font-weight: 900; }
.faq-list summary::-webkit-details-marker { display: none; }
.faq-list summary svg { width: 1.25rem; height: 1.25rem; color: var(--brand); transition: transform .2s ease; }
.faq-list details[open] summary svg { transform: rotate(180deg); }
.faq-list p { padding: 0 1.25rem 1.25rem; color: var(--muted); font-size: .92rem; line-height: 1.65; }

.final-cta { background: #fff; padding: 4rem 0; }
.final-card { position: relative; overflow: hidden; border-radius: 1.5rem; background: linear-gradient(135deg, var(--brand), var(--brand-dark)); color: #fff; padding: 2rem; box-shadow: 0 0 80px -10px color-mix(in oklab, var(--brand) 60%, transparent); }
.final-card::before, .final-card::after { content: ""; position: absolute; border-radius: 999px; background: rgba(255,255,255,.1); filter: blur(30px); pointer-events: none; }
.final-card::before { width: 16rem; height: 16rem; right: -4rem; top: -4rem; }
.final-card::after { width: 18rem; height: 18rem; right: 6rem; bottom: -6rem; }
.final-card > div, .final-card img { position: relative; z-index: 1; }
.final-card h2 { max-width: 34rem; font-size: clamp(2rem, 5vw, 3.2rem); line-height: 1.05; font-weight: 900; }
.final-card p { margin-top: 1rem; max-width: 36rem; color: rgba(255,255,255,.9); font-size: 1.05rem; line-height: 1.65; }
.final-button { display: inline-flex; align-items: center; gap: .55rem; margin-top: 1.75rem; border-radius: 999px; background: #fff; color: var(--brand-dark); padding: .95rem 1.5rem; font-weight: 900; box-shadow: var(--shadow-soft); }
.final-button svg { width: 1.2rem; height: 1.2rem; }
.final-card img { width: 100%; height: 16rem; margin-top: 2rem; object-fit: cover; border-radius: 1rem; box-shadow: 0 25px 60px -30px rgba(0,0,0,.55); }

.site-footer { border-top: 1px solid rgba(0,0,0,.05); background: #fff; padding-top: 3rem; }
.footer-grid { display: grid; gap: 2rem; padding-bottom: 2rem; }
.footer-logo { width: auto; height: 2.2rem; }
.site-footer p { margin-top: 1rem; color: var(--muted); font-size: .9rem; line-height: 1.6; }
.site-footer h3 { margin-bottom: .8rem; color: color-mix(in oklab, var(--foreground) 75%, white); font-size: .78rem; line-height: 1; letter-spacing: .08em; text-transform: uppercase; font-weight: 900; }
.site-footer ul { display: grid; gap: .65rem; margin: 0; padding: 0; list-style: none; color: var(--muted); font-size: .9rem; }
.site-footer li { display: flex; align-items: center; gap: .5rem; }
.site-footer li svg { width: 1rem; height: 1rem; color: var(--brand); }
.site-footer a { transition: color .2s ease; }
.site-footer a:hover { color: var(--brand-dark); }
.socials { display: flex; gap: .75rem; }
.socials a { display: grid; place-items: center; width: 2.5rem; height: 2.5rem; border: 1px solid rgba(15,23,42,.1); border-radius: 999px; color: var(--muted); transition: background .2s ease, color .2s ease, border-color .2s ease; }
.socials a:hover { background: var(--brand); border-color: var(--brand); color: #fff; }
.socials svg { width: 1rem; height: 1rem; }
.footer-bottom { border-top: 1px solid rgba(0,0,0,.05); }
.footer-bottom .container { display: flex; flex-direction: column; gap: .4rem; padding: 1.2rem 0; color: color-mix(in oklab, var(--foreground) 50%, white); font-size: .78rem; }
.footer-bottom p { margin: 0; }

.mobile-sticky { position: fixed; inset: auto .75rem .75rem; z-index: 50; display: inline-flex; align-items: center; justify-content: center; gap: .5rem; border-radius: 999px; background: var(--brand); color: #fff; padding: .92rem 1rem; font-size: .9rem; font-weight: 900; box-shadow: 0 18px 40px -18px color-mix(in oklab, var(--brand) 95%, transparent); transition: opacity .2s ease, transform .2s ease, visibility .2s ease; }
.mobile-sticky svg { width: 1rem; height: 1rem; }
body.form-in-view .mobile-sticky { opacity: 0; visibility: hidden; pointer-events: none; transform: translateY(1rem); }

.form-modal[hidden] { display: none; }
.form-modal { position: fixed; inset: 0; z-index: 100; display: grid; place-items: center; padding: 1rem; }
.form-modal__backdrop { position: absolute; inset: 0; border: 0; background: rgba(15, 23, 42, .45); backdrop-filter: blur(10px); }
.form-modal__dialog { position: relative; width: min(100%, 28rem); border: 1px solid rgba(15,23,42,.12); border-radius: 1.25rem; background: #fff; padding: 2rem; text-align: center; box-shadow: 0 24px 80px -28px rgba(15,23,42,.55); animation: modal-in .18s ease-out; }
.form-modal__close { position: absolute; top: .75rem; right: .75rem; display: grid; place-items: center; width: 2rem; height: 2rem; border: 0; border-radius: 999px; background: #eef2f7; color: var(--muted); font-size: 1.25rem; line-height: 1; cursor: pointer; }
.form-modal__icon { display: grid; place-items: center; width: 3.25rem; height: 3.25rem; margin: 0 auto 1rem; border-radius: 999px; background: color-mix(in oklab, var(--brand) 14%, white); color: var(--brand-dark); }
.form-modal__icon::before { content: ""; width: 1.1rem; height: .65rem; border-left: 3px solid currentColor; border-bottom: 3px solid currentColor; transform: translateY(-1px) rotate(-45deg); }
.form-modal.is-error .form-modal__icon { background: color-mix(in oklab, var(--danger) 12%, white); color: var(--danger); }
.form-modal.is-error .form-modal__icon::before { width: 1.35rem; height: 1.35rem; border: 0; background: linear-gradient(45deg, transparent 45%, currentColor 45%, currentColor 55%, transparent 55%), linear-gradient(-45deg, transparent 45%, currentColor 45%, currentColor 55%, transparent 55%); transform: none; }
.form-modal h2 { color: var(--foreground); font-size: 1.45rem; line-height: 1.2; font-weight: 900; }
.form-modal p { margin-top: .75rem; color: var(--muted); font-size: .95rem; line-height: 1.6; }
.form-modal__button { min-height: 2.75rem; width: 100%; margin-top: 1.5rem; border: 0; border-radius: 999px; background: var(--brand); color: #fff; font-weight: 900; cursor: pointer; }
@keyframes modal-in { from { opacity: 0; transform: translateY(.5rem) scale(.98); } to { opacity: 1; transform: translateY(0) scale(1); } }

@media (min-width: 640px) {
  .container { width: min(100% - 3rem, 72rem); }
  .lead-form { padding: 2rem; }
  .two-col { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .benefits-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .why-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .footer-bottom .container { flex-direction: row; justify-content: space-between; }
}

@media (min-width: 768px) {
  .nav { display: flex; }
  .header-cta { display: inline-flex; }
  .hero-grid { padding: 4.5rem 0 0; }
  .problem-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); padding: 5rem 0; }
  .problem-image { order: 0; }
  .section, .steps-section, .final-cta { padding: 5rem 0; }
  .steps-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .footer-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .mobile-sticky { display: none; }
}

@media (min-width: 1024px) {
  .hero-grid { grid-template-columns: minmax(0, .95fr) minmax(27rem, 1fr); gap: 3rem; padding: 6rem 0 0; }
  .hero-copy { padding-bottom: 5rem; }
  .hero-note li { font-size: 1rem; }
  .form-wrap { width: 100%; max-width: 36rem; justify-self: center; margin-bottom: 5rem; }
  .benefits-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .steps-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .why-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .final-card { display: grid; grid-template-columns: 1fr .85fr; gap: 2.5rem; align-items: center; padding: 4rem; }
  .final-card img { height: 24rem; margin-top: 0; }
  .footer-grid { grid-template-columns: 1.3fr 1fr 1fr 1fr; }
}

@media (max-width: 767px) {
  .brand img { height: 1.8rem; }
  .hero-grid { gap: 2rem; padding: 2rem 0 1.25rem; }
  .hero-copy { display: block; padding-bottom: 0; }
  .form-wrap { width: 100%; }
  .form-anchor { scroll-margin-top: 4.75rem; }
  .hero-note li { border-radius: .9rem; }
  .lead-form { border-radius: 1.2rem; padding: 1.25rem; }
  .final-button, .submit { width: 100%; }
  .site-footer { padding-bottom: 4.5rem; }
}

@media (max-width: 1023px) {
  .steps-grid { display: flex; gap: 1rem; margin: 0 -1rem; overflow-x: auto; padding: .25rem 1rem 1.25rem; scroll-padding: 1rem; scroll-snap-type: x mandatory; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
  .steps-grid::-webkit-scrollbar { display: none; }
  .steps-grid li { flex: 0 0 calc(100% - 2rem); scroll-snap-align: center; }
  .steps-controls { display: flex; }
}

@media (min-width: 640px) and (max-width: 1023px) {
  .steps-grid { margin-right: -1.5rem; margin-left: -1.5rem; padding-right: 1.5rem; padding-left: 1.5rem; scroll-padding: 1.5rem; }
  .steps-grid li { flex-basis: calc(100% - 3rem); }
}