/* Layout values are ratios and geometry; all visual roles use the shared theme. */
.home-section {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: var(--space-gap-lg);
  width: min(calc(100% - var(--space-gutter) * 2), 89rem);
  margin-inline: auto;
  padding-block: calc(var(--space-section-xl) * 1.25);
  scroll-margin-block-start: var(--space-section-lg);
}
.home-section--card { padding-block: calc(var(--space-section-lg) * .9375); }
.home-section__heading { display: flex; flex-direction: column; align-items: flex-start; gap: var(--space-gap-lg); padding-inline-end: 22%; }
.home-section__heading--full { padding-inline-end: 0; }
.home-title, .home-hero__title, .home-final__title { margin: 0; font-family: var(--font-heading-family); font-weight: var(--font-heading-weight); font-size: var(--font-h1-size); line-height: var(--font-heading-line-height); }
.home-title { max-width: 68.75rem; }
.home-lead { margin: 0; font-size: var(--font-h3-size); font-weight: var(--font-body-weight); line-height: var(--font-body-line-height); }
.home-note { margin: 0; font-size: var(--font-ui-lg-size); line-height: var(--font-body-line-height); color: var(--color-text-secondary); }
.locato-tag { display: inline-flex; align-items: center; width: fit-content; margin: 0; padding: var(--space-ui-md) calc(var(--space-ui-xl) + var(--space-ui-2xs)); border-radius: var(--radius-pill); background: var(--color-highlight); color: var(--color-highlight-text); font-size: var(--p-font-size-ui-sm); font-weight: var(--font-accent-weight); line-height: var(--font-heading-line-height); }
.locato-icon { display: block; width: 1em; height: 1em; flex: 0 0 auto; fill: currentColor; }
.locato-button { display: inline-flex; align-items: center; justify-content: center; gap: calc(var(--space-gap-md) * .7); width: fit-content; min-height: var(--size-control-lg); padding: calc(var(--space-pad-y-sm) * .75) calc(var(--space-pad-x-md) * .75); border: 1px solid var(--color-btn-border); border-radius: var(--radius-pill); background: var(--color-btn-bg); color: var(--color-btn-text); font-size: calc(var(--p-font-size-h4) * 1.1); font-weight: var(--font-accent-weight); line-height: var(--font-heading-line-height); text-decoration: none; transition: background var(--motion-hover-duration) var(--motion-hover-ease), color var(--motion-hover-duration) var(--motion-hover-ease); }
.locato-button:hover { background: var(--color-btn-bg-hover); border-color: var(--color-btn-border-hover); color: var(--color-btn-text-hover); }
.locato-button--secondary { background: var(--color-bg); color: var(--color-text-accent); }
.locato-button--secondary:hover { background: var(--color-bg-hover); color: var(--color-text-accent); border-color: var(--color-text-accent); }
.locato-button--wide { width: 100%; }
.locato-button__arrow { display: block; flex: 0 0 auto; transform: rotate(90deg) scaleY(-1); }
.locato-button__arrow--upright { transform: none; }
.locato-button:focus-visible, .home-phone:focus-visible, .home-faq__question:focus-visible, .home-carousel__arrow:focus-visible, .home-carousel__dot:focus-visible { outline: 2px solid var(--color-focus-ring); outline-offset: var(--space-ui-xs); }
.home-actions { display: flex; align-items: flex-start; flex-wrap: wrap; gap: var(--space-gap-sm); }
.home-actions--center { justify-content: center; }

/* Hero */
.home-hero { flex-direction: row; align-items: center; gap: calc(var(--space-gap-xl) * 1.45); padding-block-start: var(--space-section-lg); }
.home-hero__copy { display: flex; flex-direction: column; align-items: flex-start; flex: 1.24; gap: var(--space-ui-3xl); min-width: 0; }
.home-hero__title { font-size: var(--font-display-size); line-height: var(--font-heading-line-height); }
.home-hero__visual { display: flex; flex-direction: column; align-items: center; gap: var(--space-gap-md); flex: 1; min-width: 0; }
.home-cat { pointer-events: none; mix-blend-mode: multiply; }
.home-cat img { display: block; width: 100%; height: 100%; object-fit: contain; }
.home-cat--hero { width: min(100%, 18.75rem); aspect-ratio: 1; }
.home-cat--inline { width: 15rem; aspect-ratio: 1; }
.home-section { --corner-cat: 16.25rem; }
.home-cat--corner { position: absolute; inset-inline-end: 0; inset-block-start: calc(var(--space-section-xl) * .9375); width: var(--corner-cat); aspect-ratio: 1; }
/* The heading reserves the height of the corner cat, so the cat never covers the content below. */
.home-section:has(> .home-cat--corner) > .home-section__heading { min-height: calc(var(--corner-cat) - var(--space-section-xl) * .3125); }
.home-panel .home-cat--corner { inset-inline-end: var(--space-section-xl); inset-block-start: var(--space-section-lg); }

/* Chat: the client writes in lilac, the business answers in lime. */
.home-chat { display: flex; flex-direction: column; gap: var(--space-ui-lg); width: 100%; min-width: 0; border-radius: var(--radius-card-lg); }
.home-chat--light, .home-chat--dark { padding: var(--space-section-sm); }
.home-chat--light { background: var(--color-bg); }
.home-chat--dark { background: var(--color-bg-inverse); }
.home-chat__label { margin: 0; color: var(--color-text-muted); font-size: var(--font-ui-lg-size); font-weight: var(--font-accent-weight); }
.home-chat--dark .home-chat__label { color: var(--color-text-inverse); opacity: .6; }
.home-chat__row { display: flex; }
.home-chat__row--reply { justify-content: flex-end; }
.home-message { display: flex; flex-direction: column; gap: var(--space-ui-xs); max-width: 100%; width: 28.125rem; padding: var(--space-ui-xl) var(--space-ui-2xl); border-radius: var(--radius-card); background: var(--color-aux); color: var(--color-aux-text); }
.home-message--reply { background: var(--color-highlight); color: var(--color-highlight-text); }
.home-message--short { width: 14.0625rem; }
.home-chat--hero .home-message--reply { width: 25rem; }
.home-chat--hero .home-message--reply.home-message--short { width: 18.75rem; }
.home-message__text { margin: 0; font-size: var(--font-h4-size); line-height: var(--font-body-line-height); }
.home-message__time { align-self: flex-end; font-size: var(--font-ui-sm-size); opacity: .7; }
.home-chat__caption { margin: var(--space-ui-sm) 0 0; color: var(--color-text-inverse); font-size: var(--font-ui-lg-size); line-height: var(--font-body-line-height); opacity: .8; }

/* Panels, columns and icon items */
.home-panel { position: relative; display: flex; flex-direction: column; gap: var(--space-gap-lg); width: 100%; padding: calc(var(--space-section-lg) * 1.125) var(--space-section-xl); border-radius: var(--radius-card-lg); background: var(--color-bg-canvas); }
.home-panel .home-section__heading { padding-inline-end: 22%; }
.home-panel:has(> .home-cat--corner) .home-section__heading { min-height: calc(16.25rem - var(--space-gap-lg)); }
.home-columns { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-section-xl); align-items: start; }
.home-columns--problem { grid-template-columns: 1fr .95fr; }
.home-columns--solution { grid-template-columns: 1fr 1.1fr; }
.home-explanation { display: flex; flex-direction: column; gap: var(--space-gap-lg); min-width: 0; }
.home-problem__visual { display: flex; flex-direction: column; align-items: center; gap: var(--space-ui-md); min-width: 0; }
.home-items { display: flex; flex-direction: column; gap: var(--space-gap-md); min-width: 0; }
.home-item { display: flex; align-items: flex-start; gap: var(--space-ui-2xl); }
.home-item__chip { display: flex; align-items: center; justify-content: center; width: 3.5rem; height: 3.5rem; flex: 0 0 auto; border-radius: var(--radius-pill); font-size: 1.75rem; color: var(--color-text); }
.home-item__chip--aux { background: var(--color-aux-subtle); }
.home-item__chip--brand { background: var(--color-highlight); color: var(--color-highlight-text); }
.home-item__body { display: flex; flex-direction: column; gap: var(--space-ui-xs); min-width: 0; padding-block-start: var(--space-ui-xs); }
.home-item__title, .home-audience__title, .home-price__title, .home-steps__label { margin: 0; font-family: var(--font-body-family); font-size: var(--font-h3-size); font-weight: var(--font-h5-weight); line-height: var(--font-heading-line-height); }
.home-item__text { margin: 0; color: var(--color-text-secondary); font-size: var(--font-h4-size); line-height: var(--font-body-line-height); }
.home-callout { display: flex; align-items: center; gap: var(--space-ui-2xl); padding: var(--space-ui-3xl) var(--space-section-sm); border: 1px solid var(--color-aux-border); border-radius: var(--radius-card); background: var(--color-aux-subtle); }
.home-callout__icon { font-size: 2rem; color: var(--color-aux-strong); }
.home-callout__text { margin: 0; font-size: var(--font-h3-size); font-weight: var(--font-accent-weight); line-height: var(--font-body-line-height); }

/* Examples and brand: text on the left, the phone carousel on the right.
   The carousel runs to the edge of the page. */
.home-showcase { flex-direction: row; align-items: flex-start; gap: calc(var(--space-section-xl) * .9); }
.home-showcase__copy { display: flex; flex-direction: column; gap: var(--space-gap-xl); flex: 0 0 37.5rem; min-width: 0; }
.home-brand { display: flex; align-items: flex-end; gap: var(--space-ui-md); overflow: hidden; padding-inline-start: var(--space-section-sm); border-radius: var(--radius-card-lg); background: var(--color-aux-subtle); }
.home-brand__copy { display: flex; flex-direction: column; gap: var(--space-ui-xl); flex: 1; min-width: 0; padding-block: var(--space-section-sm); }
.home-brand__title { margin: 0; font-family: var(--font-heading-family); font-size: var(--font-h2-size); font-weight: var(--font-heading-weight); line-height: var(--font-heading-line-height); }
.home-brand__text { margin: 0; font-size: var(--font-h3-size); line-height: var(--font-body-line-height); }
.home-cat--brand { width: 13.125rem; aspect-ratio: 1; flex: 0 0 auto; margin-block-end: var(--space-ui-md); }
.home-carousel {
  --phone-zoom: .8718; /* a 340 px screen shows a 390 px page */
  --phone-shift: 17.3rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--space-gap-lg);
  flex: 1;
  min-width: 0;
  margin-inline-end: calc(-1 * max(var(--space-gutter), (100vw - 89rem) / 2));
}
/* The left side phone may reach into the gap; main clips the page edge on the right. */
.home-carousel__stage { position: relative; width: 100%; height: calc(24.375rem * 2.06 * var(--phone-zoom) + 5.5rem); touch-action: pan-y; }
.home-phone {
  position: absolute;
  inset-inline-start: 50%;
  inset-block-start: 50%;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--space-ui-md);
  padding: var(--space-ui-lg) var(--space-ui-md);
  border: 3px solid var(--color-text);
  border-radius: 3rem;
  background: var(--color-bg);
  color: inherit;
  text-decoration: none;
  transform: translate(-50%, -50%) translateX(var(--phone-x, 0)) scale(var(--phone-scale, 1));
  opacity: var(--phone-opacity, 1);
  z-index: var(--phone-layer, 1);
  transition: transform var(--motion-move-duration) var(--motion-move-ease), opacity var(--motion-move-duration) var(--motion-move-ease);
}
.home-phone[data-position="center"] { --phone-layer: 3; box-shadow: 0 1.5rem 3rem -.75rem rgb(from var(--color-text) r g b / .14); }
.home-phone[data-position="left"] { --phone-x: calc(var(--phone-shift) * -1); --phone-scale: .8; --phone-opacity: .5; --phone-layer: 2; }
.home-phone[data-position="right"] { --phone-x: var(--phone-shift); --phone-scale: .8; --phone-opacity: .5; --phone-layer: 2; }
.home-phone[data-position="hidden"] { --phone-scale: .6; --phone-opacity: 0; --phone-layer: 0; pointer-events: none; visibility: hidden; }
.home-phone__address { padding: var(--space-ui-2xs) var(--space-ui-lg); border-radius: var(--radius-pill); background: var(--color-bg-canvas); color: var(--color-text-muted); font-size: var(--p-font-size-ui-xs); }
.home-phone__screen { position: relative; display: block; overflow: hidden; width: calc(24.375rem * var(--phone-zoom)); height: calc(24.375rem * 2.06 * var(--phone-zoom)); border-radius: 2.125rem; background: var(--color-bg); }
/* The frame renders the example at a real phone width (390 px) and is scaled down to the screen. */
.home-phone__frame { display: block; width: 24.375rem; height: calc(24.375rem * 2.06); border: 0; transform: scale(var(--phone-zoom)); transform-origin: 0 0; pointer-events: none; }
.home-carousel__controls { display: flex; flex-direction: column; align-items: center; gap: var(--space-ui-3xl); }
.home-carousel__nav { display: flex; align-items: center; gap: var(--space-section-sm); }
.home-carousel__arrow { display: flex; align-items: center; justify-content: center; width: 3.5rem; height: 3.5rem; padding: 0; border: 1px solid var(--color-btn-border); border-radius: var(--radius-pill); background: var(--color-bg); color: var(--color-text); font-size: 1.5rem; cursor: pointer; transition: background var(--motion-hover-duration) var(--motion-hover-ease); }
.home-carousel__arrow:hover { background: var(--color-bg-hover); }
.home-carousel__arrow-icon--back { transform: rotate(180deg); }
.home-carousel__current { display: flex; flex-direction: column; align-items: center; gap: var(--space-ui-lg); min-width: 12.75rem; }
.home-carousel__label { margin: 0; font-size: var(--font-h4-size); font-weight: var(--font-accent-weight); }
.home-carousel__dots { display: flex; align-items: center; gap: var(--space-ui-md); }
.home-carousel__dot { width: .5rem; height: .5rem; padding: 0; border: 0; border-radius: var(--radius-pill); background: var(--color-border-subtle); cursor: pointer; transition: width var(--motion-move-duration) var(--motion-move-ease), background var(--motion-move-duration) var(--motion-move-ease); }
.home-carousel__dot[aria-current="true"] { width: 1.5rem; background: var(--color-btn-bg); }

/* How it works */
.home-steps { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: var(--space-section-sm); margin: 0; padding: 0; list-style: none; }
.home-steps__item { position: relative; display: flex; flex-direction: column; gap: var(--space-ui-xl); min-width: 0; }
.home-steps__arrow { position: absolute; inset-block-start: 2.25rem; inset-inline-end: calc(var(--space-section-sm) * -.5 - .75rem); font-size: 1.5rem; }
.home-steps__icon { display: flex; align-items: center; justify-content: center; width: 6rem; height: 6rem; border-radius: var(--radius-card); background: var(--color-highlight); color: var(--color-highlight-text); font-size: 2.5rem; }
.home-steps__text { margin: 0; font-size: var(--font-h4-size); line-height: var(--font-body-line-height); }

/* Audience */
.home-types { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: var(--space-ui-2xl); margin: 0; padding: 0; list-style: none; }
.home-types__item { display: flex; flex-direction: column; align-items: center; gap: var(--space-ui-xl); padding: var(--space-section-sm) var(--space-ui-2xl) var(--space-ui-3xl); border-radius: var(--radius-card); background: var(--color-bg-canvas); text-align: center; }
.home-types__item .home-item__chip { width: 4rem; height: 4rem; font-size: 2rem; }
.home-types__label { font-size: var(--font-h4-size); font-weight: var(--font-accent-weight); line-height: var(--font-heading-line-height); }
.home-audience { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-gap-lg); }
.home-audience__card { padding: var(--space-section-md); border-radius: var(--radius-card-lg); background: var(--color-bg-canvas); }
.home-audience__card--positive { background: var(--color-highlight); }
.home-audience__card--aux { background: var(--color-aux-subtle); }
.home-audience__list { display: flex; flex-direction: column; gap: var(--space-ui-xl); margin: var(--space-ui-xl) 0 0; padding-inline-start: var(--space-ui-2xl); font-size: var(--font-h4-size); line-height: var(--font-body-line-height); }

/* Price */
.home-pricing { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-gap-lg); }
.home-price { display: flex; flex-direction: column; gap: var(--space-ui-xl); min-width: 0; padding: var(--space-ui-3xl); border: 1px solid var(--color-border-subtle); border-radius: var(--radius-card); background: var(--color-bg); }
.home-price--trial { border-color: var(--color-highlight); background: var(--color-highlight); }
.home-price__amount { display: flex; align-items: baseline; flex-wrap: wrap; gap: var(--space-ui-md); margin: 0; font-family: var(--font-heading-family); font-size: calc(var(--font-display-size) * 1.17); font-weight: var(--font-heading-weight); line-height: var(--font-heading-line-height); }
.home-price__period { font-family: var(--font-body-family); font-size: var(--font-ui-size); font-weight: var(--font-body-weight); color: var(--color-text-secondary); }
.home-price__features { display: flex; flex-direction: column; gap: var(--space-ui-xl); margin: 0; padding: 0; list-style: none; }
.home-price__feature { display: flex; align-items: flex-start; gap: var(--space-ui-lg); font-size: var(--font-ui-size); line-height: var(--font-body-line-height); }
.home-price__marker { flex: 0 0 auto; margin-block-start: var(--space-ui-xs); }
.home-conditions { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--space-ui-2xl); margin: 0; padding: 0; list-style: none; }
.home-condition { display: flex; flex-direction: column; gap: var(--space-ui-lg); padding: var(--space-ui-2xl); border: 1px solid var(--color-aux-border); border-radius: var(--radius-card); background: var(--color-aux-subtle); font-size: var(--font-ui-size); line-height: var(--font-body-line-height); }
.home-condition__icon { font-size: 1.75rem; color: var(--color-aux-strong); }

/* Questions: two columns, the first question open. */
.home-faq__columns { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-ui-2xl); align-items: start; }
.home-faq__list { display: flex; flex-direction: column; gap: var(--space-gap-sm); min-width: 0; }
.home-faq__item { padding: var(--space-ui-2xl) var(--space-ui-3xl); border: 1px solid var(--color-border-subtle); border-radius: var(--radius-card); background: var(--color-bg); }
.home-faq__question { display: flex; align-items: center; justify-content: space-between; gap: var(--space-ui-xl); cursor: pointer; list-style: none; font-size: var(--font-h3-size); font-weight: var(--font-accent-weight); line-height: var(--font-body-line-height); }
.home-faq__question::-webkit-details-marker { display: none; }
.home-faq__toggle { font-size: 1.5rem; transition: transform var(--motion-hover-duration) var(--motion-hover-ease); }
.home-faq__item[open] .home-faq__toggle { transform: rotate(180deg); }
.home-faq__answer { margin: var(--space-ui-lg) 0 0; color: var(--color-text-secondary); font-size: var(--font-h4-size); line-height: var(--font-body-line-height); }

/* Final call: a lime card inside the page margins. */
.home-final__card { position: relative; display: flex; flex-direction: column; align-items: center; gap: var(--space-gap-lg); padding: calc(var(--space-section-xl) * 1.2) var(--space-section-xl); border-radius: var(--radius-card-lg); background: var(--color-highlight); text-align: center; }
.home-final__title { max-width: 56.25rem; font-size: var(--font-display-size); }
.home-final .home-lead { max-width: 46.875rem; }
.home-cat--final { position: absolute; inset-inline-end: var(--space-section-md); inset-block-end: var(--space-section-sm); width: 15rem; aspect-ratio: 1; border-radius: var(--radius-pill); overflow: hidden; mix-blend-mode: normal; }

@media (max-width: 1200px) {
  .home-section__heading, .home-panel .home-section__heading { padding-inline-end: 25%; }
  .home-section__heading--full { padding-inline-end: 0; }
  .home-panel { padding: var(--space-section-lg); }
  .home-panel .home-cat--corner { inset-inline-end: var(--space-section-md); }
  .home-section { --corner-cat: 13rem; }
  .home-panel:has(> .home-cat--corner) .home-section__heading { min-height: calc(13rem - var(--space-gap-lg)); }
  .home-columns { gap: var(--space-gap-lg); }
  .home-price { padding: var(--space-ui-2xl); }
  .home-showcase__copy { flex-basis: 30rem; }
  .home-carousel { --phone-zoom: .7385; --phone-shift: 14.6rem; }
  .home-steps { grid-template-columns: repeat(3, minmax(0, 1fr)); row-gap: var(--space-section-sm); }
  .home-steps__arrow { display: none; }
  .home-types { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .home-conditions { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .home-cat--final { width: 11rem; }
  .home-final__title, .home-final .home-lead { max-width: 70%; }
}
@media (max-width: 900px) {
  .home-section { padding-block: var(--space-section-xl); }
  .home-hero { align-items: flex-start; gap: var(--space-gap-lg); }
  .home-hero__copy { flex: 1.15; }
  .home-hero__visual { padding-block-start: var(--space-section-lg); }
  .home-lead, .home-brand__text, .home-callout__text { font-size: var(--font-h4-size); }
  .locato-button { font-size: var(--p-font-size-ui-lg); }
  .home-columns--problem, .home-columns--solution { grid-template-columns: 1fr 1fr; }
  .home-chat--light, .home-chat--dark { padding: var(--space-ui-2xl); }
  .home-message { padding: var(--space-ui-lg) var(--space-ui-xl); }
  .home-message__text { font-size: var(--font-ui-lg-size); }
  .home-section { --corner-cat: 10rem; }
  .home-cat--inline { width: 11rem; }
  .home-panel:has(> .home-cat--corner) .home-section__heading { min-height: calc(10rem - var(--space-gap-lg)); }
  .home-showcase { flex-direction: column; gap: var(--space-gap-xl); }
  .home-showcase__copy { flex: initial; width: 100%; }
  .home-carousel { flex: initial; margin-inline: calc(var(--space-gutter) * -1); width: calc(100% + var(--space-gutter) * 2); }  .home-faq__columns { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
  .home-section { gap: var(--space-gap-xl); }
  .home-hero { flex-direction: column; }
  .home-hero__copy, .home-hero__visual { flex: initial; width: 100%; }
  .home-hero__visual { padding: 0; }
  .home-cat--hero { width: 15rem; }
  .home-chat--hero .home-message--reply, .home-chat--hero .home-message--reply.home-message--short { width: min(100%, 18.75rem); }
  .home-section__heading, .home-panel .home-section__heading { padding-inline-end: 0; gap: var(--space-gap-xl); }
  .home-section__heading .locato-tag { max-width: 70%; }
  .home-section { --corner-cat: 5rem; }
  .home-cat--corner { inset-block-start: var(--space-section-md); }
  .home-section:has(> .home-cat--corner) > .home-section__heading { min-height: 0; }
  .home-panel .home-cat--corner { inset-inline-end: var(--space-ui-xl); inset-block-start: var(--space-ui-xs); }
  .home-panel:has(> .home-cat--corner) .home-section__heading { min-height: 0; }
  .home-panel { padding: var(--space-ui-2xl); gap: var(--space-gap-xl); }
  .home-columns, .home-columns--problem, .home-columns--solution { grid-template-columns: 1fr; gap: var(--space-gap-xl); }
  .home-explanation { gap: var(--space-gap-xl); }
  .home-message { width: min(100%, 28.125rem); }
  .home-message--short { width: 70%; }
  .home-actions { width: 100%; flex-direction: column; align-items: stretch; }
  .home-actions .locato-button { width: 100%; }
  .home-item { gap: var(--space-ui-xl); }
  .home-item__chip { width: 2.75rem; height: 2.75rem; font-size: 1.375rem; }
  .home-callout { align-items: flex-start; padding: var(--space-ui-2xl); }
  .home-brand { flex-direction: column; align-items: stretch; padding-inline: var(--space-ui-2xl); }
  .home-brand__copy { padding-block: var(--space-ui-2xl) 0; }
  .home-cat--brand { align-self: flex-end; width: 9rem; }
  .home-carousel { --phone-zoom: .5949; --phone-shift: 10.5rem; }
  .home-carousel__nav { gap: var(--space-ui-xl); }
  .home-steps { grid-template-columns: 1fr; }
  .home-steps__item { flex-direction: row; flex-wrap: wrap; align-items: center; column-gap: var(--space-ui-xl); }
  .home-steps__icon { width: 3.5rem; height: 3.5rem; font-size: 1.5rem; }
  .home-steps__text { flex-basis: 100%; }
  .home-types { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .home-audience, .home-pricing, .home-conditions { grid-template-columns: 1fr; }
  .home-audience__card, .home-price, .home-faq__item { padding: var(--space-ui-2xl); }
  .home-price__amount { font-size: var(--font-display-size); }
  .home-faq__question { font-size: var(--font-h4-size); }
  .home-faq__answer { font-size: var(--font-ui-lg-size); }
  .home-final__card { padding: var(--space-section-md) var(--space-ui-2xl); }
  .home-final__title, .home-final .home-lead { max-width: none; }
  .home-cat--final { position: static; width: 10rem; }
}