/*
  Homepage breakpoint overrides for the current home experience.
  This file keeps the production homepage-specific responsive tuning
  separate from the shared base styles.
*/

:root {
  --bp-lab-mobile-lg: 480px;
  --bp-lab-tablet: 768px;
  --bp-lab-desktop: 980px;
  --bp-lab-wide: 1440px;
}

/*
  Put page-specific experiments here.
  The base layer below intentionally does nothing yet.
*/

body.home-breakpoints-page {
  min-width: 320px;
}

body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-visual--cargo,
body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-visual--express,
body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-visual--moving,
body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-visual--loaders {
  background: transparent;
  border: none;
  box-shadow: none;
  border-radius: 0;
  overflow: visible;
}

body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-visual--cargo img,
body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-visual--express img,
body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-visual--moving img,
body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-visual--loaders img {
  display: block !important;
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center;
}

body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-visual--cargo::before,
body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-visual--cargo::after,
body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-visual--express::before,
body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-visual--express::after,
body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-visual--moving::before,
body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-visual--moving::after,
body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-visual--loaders::before,
body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-visual--loaders::after {
  display: none !important;
}

@media (max-width: 767px) {
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card.bp-lab-tags-beside-visual .home-services-preview-tags {
    width: calc(100% - var(--bp-lab-tags-visual-reserve, 0px));
    max-width: calc(100% - var(--bp-lab-tags-visual-reserve, 0px));
  }

  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card.bp-lab-tags-below-visual .home-services-preview-tags {
    width: auto;
    max-width: none;
    margin-top: calc(18px + var(--bp-lab-tags-below-offset, 0px));
  }
}

@media (min-width: 480px) {
  body.home-breakpoints-page {
    /* large mobile experiments */
  }
}

@media (max-width: 979px) {
  body.home-breakpoints-page #mapModal .map-panel {
    position: relative;
  }

  body.home-breakpoints-page #mapModal .map-panel-header {
    display: none !important;
  }

  body.home-breakpoints-page #mapModal .map-back-pill {
    display: none !important;
  }

  body.home-breakpoints-page #mapModal .panel-bottom {
    position: sticky;
    z-index: 11;
    overflow: visible;
  }

  body.home-breakpoints-page #mapModal .map-toggle-btn {
    position: absolute;
    top: -58px;
    right: 0;
    width: 50px;
    height: 50px;
    margin: 0;
    border-radius: 16px;
    border-color: rgba(219, 225, 234, 0.98);
    background: rgba(255, 255, 255, 0.98);
    box-shadow: 0 14px 30px rgba(15, 23, 42, 0.12);
  }

  body.home-breakpoints-page #mapModal .map-toggle-btn .material-icons-round {
    font-size: 22px;
  }

  body.home-breakpoints-page #mapModal .route-inputs {
    padding-bottom: 74px;
  }

  body.home-breakpoints-page #mapModal .map-panel.autocomplete-suggestions-open .map-panel-header {
    display: none;
  }

  body.home-breakpoints-page #mapModal .map-panel.autocomplete-suggestions-open .map-toggle-btn {
    display: none;
  }
}

@media (max-width: 767px) {
  body.home-breakpoints-page.home-page #quickOrderWidget .time-card {
    grid-template-columns: minmax(0, 1fr) 78px;
    gap: 6px;
    align-items: stretch;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .vert-controls {
    display: flex;
    flex-direction: row-reverse;
    align-items: stretch;
    align-self: stretch;
    justify-self: end;
    width: 78px;
    min-width: 78px;
    height: auto;
    min-height: 100%;
    gap: 3px;
    padding: 3px;
    border-radius: 13px;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .vert-controls button {
    flex: 1 1 0;
    width: auto;
    height: auto;
    min-height: 44px;
    border-radius: 10px;
  }

  body.home-breakpoints-page.home-page .home-services-divider {
    margin-top: 18px;
  }

  body.home-breakpoints-page.home-page .home-services-divider-shell {
    gap: 8px;
  }

  body.home-breakpoints-page.home-page .home-services-divider-shell::before,
  body.home-breakpoints-page.home-page .home-services-divider-shell::after {
    flex: 1 1 24px;
    opacity: 0.55;
  }

  body.home-breakpoints-page.home-page .home-services-divider-shell h2 {
    padding: 0 4px;
    font-size: 18px;
    font-weight: 800;
    line-height: 1.06;
    letter-spacing: -0.03em;
  }

  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-areas:
      "title visual"
      "copy visual"
      "tags tags";
    align-items: start;
    column-gap: 12px;
    row-gap: 10px;
    height: auto;
    min-height: 168px;
    padding: 18px 16px 16px;
    border-radius: 24px;
  }

  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--cargo,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--express,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--moving,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--loaders {
    min-height: 168px;
    padding-right: 16px;
  }

  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card h3 {
    grid-area: title;
    margin: 0;
    max-width: 9.5ch;
    font-size: 22px;
    line-height: 1;
    letter-spacing: -0.042em;
    white-space: normal;
    text-wrap: balance;
  }

  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card p,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--express p {
    grid-area: copy;
    margin: 0;
    max-width: 21ch;
    font-size: 13.6px;
    line-height: 1.36;
    letter-spacing: -0.016em;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }

  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-tags,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--cargo .home-services-preview-tags,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--express .home-services-preview-tags,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--moving .home-services-preview-tags,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--loaders .home-services-preview-tags {
    grid-area: tags;
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    width: 100%;
    margin-top: 2px;
  }

  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-tags span,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--cargo .home-services-preview-tags span,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--express .home-services-preview-tags span,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--moving .home-services-preview-tags span,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--loaders .home-services-preview-tags span {
    width: auto;
    min-width: 0;
    min-height: 28px;
    padding: 0 10px;
    justify-content: center;
    font-size: 11.4px;
    line-height: 1;
    letter-spacing: -0.012em;
    white-space: nowrap;
  }

  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-visual {
    position: relative;
    top: auto;
    right: auto;
    bottom: auto;
    grid-area: visual;
    place-self: start end;
    width: 84px;
    height: 84px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 4px;
    border-radius: 18px;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.78) 0%, rgba(245, 247, 251, 0.98) 100%);
    border: 1px dashed rgba(148, 163, 184, 0.38);
    box-shadow:
      inset 0 1px 0 rgba(255, 255, 255, 0.82),
      0 10px 20px rgba(15, 23, 42, 0.04);
    overflow: hidden;
    opacity: 1;
  }

  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-visual img {
    display: none;
  }

  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-visual::before,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-visual::after {
    display: block;
  }

  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-visual--cargo {
    width: 84px;
    height: 84px;
    margin-right: 0;
  }

  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-visual--cargo img,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-visual--express img,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-visual--moving img,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-visual--loaders img {
    display: block !important;
    width: 100%;
    height: 100%;
    object-fit: contain;
    object-position: center;
  }

  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-visual--cargo::before,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-visual--cargo::after,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-visual--express::before,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-visual--express::after,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-visual--moving::before,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-visual--moving::after,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-visual--loaders::before,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-visual--loaders::after {
    display: none !important;
  }
}

@media (max-width: 479px) {
  body.home-breakpoints-page.home-page .popular-services-shell h2.popular-services-title {
    max-width: none;
    font-size: 26px;
    line-height: 1.02;
    letter-spacing: -0.045em;
    text-wrap: initial;
    white-space: normal;
    text-align: center;
  }

  body.home-breakpoints-page.home-page .popular-services-title-line {
    display: block;
  }

  html[lang="de"] body.home-breakpoints-page.home-page .popular-services-shell h2.popular-services-title {
    font-size: clamp(20px, 6.2vw, 23px);
    letter-spacing: -0.04em;
    white-space: nowrap;
    text-wrap: nowrap;
    text-align: center;
  }

  html[lang="de"] body.home-breakpoints-page.home-page .popular-services-title-line {
    display: inline;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .time-card {
    grid-template-columns: minmax(0, 1fr) 72px;
    gap: 6px;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .vert-controls {
    width: 72px;
    min-width: 72px;
    gap: 3px;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .vert-controls button {
    width: auto;
    min-height: 46px;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .address-col input {
    font-size: clamp(15px, 3.9vw, 16px);
    line-height: 1.14;
    letter-spacing: -0.024em;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .address-col input::placeholder {
    font-size: inherit;
    line-height: inherit;
  }

  body.home-breakpoints-page.home-page .delivery-time-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 0.92fr);
    gap: 10px;
  }

  body.home-breakpoints-page.home-page .radio-card {
    min-height: 72px;
    padding: 12px 14px;
    gap: 8px;
  }

  body.home-breakpoints-page.home-page .calendar-wrap {
    display: grid;
    grid-template-columns: 20px minmax(0, 1fr);
    align-items: center;
    column-gap: 8px;
    min-width: 0;
    width: 100%;
  }

  body.home-breakpoints-page.home-page .calendar-wrap .material-icons-round {
    font-size: 18px !important;
  }

  body.home-breakpoints-page.home-page .calendar-wrap span:last-child {
    min-width: 0;
    font-size: 12.8px;
    line-height: 1.18;
    letter-spacing: -0.018em;
    white-space: normal;
    word-break: normal;
    overflow-wrap: anywhere;
  }

  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card {
    --bp-lab-tags-visual-reserve: 138px;
    display: block;
    position: relative;
    min-height: 198px;
    padding: 16px 14px 15px;
  }

  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--cargo,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--express,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--moving,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--loaders {
    min-height: 198px;
    padding-right: 14px;
  }

  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--cargo {
    --bp-lab-tags-visual-reserve: 144px;
  }

  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card h3 {
    max-width: 8.8ch;
    font-size: 20px;
    line-height: 0.9;
    letter-spacing: -0.04em;
  }

  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card p,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--express p {
    margin-top: 10px;
    max-width: calc(100% - 138px);
    color: #5f6d82;
    font-size: 12.4px;
    font-weight: 500;
    line-height: 1.42;
    letter-spacing: -0.012em;
    display: block;
    text-align: left;
    text-indent: 0;
    text-wrap: initial;
    -webkit-line-clamp: unset;
    -webkit-box-orient: initial;
    overflow: visible;
  }

  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-tags span,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--cargo .home-services-preview-tags span,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--express .home-services-preview-tags span,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--moving .home-services-preview-tags span,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--loaders .home-services-preview-tags span {
    width: auto;
    max-width: 100%;
    flex: 0 0 auto;
    min-height: 26px;
    padding: 0 9px;
    font-size: 10.6px;
  }

  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-tags,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--cargo .home-services-preview-tags,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--express .home-services-preview-tags,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--moving .home-services-preview-tags,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--loaders .home-services-preview-tags {
    max-width: none;
    margin-top: 18px;
  }

  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--express .home-services-preview-tags {
    max-width: none;
  }

  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-visual {
    position: absolute;
    top: 16px;
    right: 14px;
    bottom: auto;
    grid-area: auto;
    place-self: auto;
    width: 124px;
    height: 124px;
    border-radius: 24px;
    opacity: 1;
  }

  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-visual::before {
    font-size: 44px;
  }

  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-visual::after {
    font-size: 12px;
    letter-spacing: -0.01em;
  }

  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-visual--cargo {
    width: 124px;
    height: 124px;
    margin-right: 0;
  }
}

@media (max-width: 389px) {
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card {
    --bp-lab-tags-visual-reserve: 140px;
  }

  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--cargo {
    --bp-lab-tags-visual-reserve: 146px;
  }

  /*
    On the narrowest small-mobile widths, let the service tags wrap inside
    the free text column instead of forcing a fixed 3-column grid into the image.
  */
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-tags,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--cargo .home-services-preview-tags,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--express .home-services-preview-tags,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--moving .home-services-preview-tags,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--loaders .home-services-preview-tags {
    display: flex;
    flex-wrap: wrap;
    grid-template-columns: none;
    width: auto;
    max-width: none;
    gap: 6px;
    align-items: flex-start;
  }

  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-tags span,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--cargo .home-services-preview-tags span,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--express .home-services-preview-tags span,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--moving .home-services-preview-tags span,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--loaders .home-services-preview-tags span {
    width: auto;
    max-width: 100%;
    flex: 0 0 auto;
    padding-inline: 10px;
  }
}

@media (min-width: 480px) and (max-width: 767px) {
  body.home-breakpoints-page.home-page .popular-services-shell h2.popular-services-title {
    max-width: none;
    font-size: 28px;
    line-height: 1.02;
    letter-spacing: -0.045em;
    text-wrap: initial;
    white-space: normal;
    text-align: center;
  }

  body.home-breakpoints-page.home-page .popular-services-title-line {
    display: block;
  }

  html[lang="de"] body.home-breakpoints-page.home-page .popular-services-shell h2.popular-services-title {
    font-size: 29px;
    line-height: 0.98;
    letter-spacing: -0.052em;
    white-space: nowrap;
    text-wrap: nowrap;
    text-align: center;
  }

  html[lang="de"] body.home-breakpoints-page.home-page .popular-services-title-line {
    display: inline;
  }

  body.home-breakpoints-page.home-page .home-services-divider-shell {
    gap: 10px;
  }

  body.home-breakpoints-page.home-page .home-services-divider-shell::before,
  body.home-breakpoints-page.home-page .home-services-divider-shell::after {
    flex-basis: 32px;
  }

  body.home-breakpoints-page.home-page .home-services-divider-shell h2 {
    font-size: 21px;
    line-height: 0.98;
    letter-spacing: -0.044em;
  }

  body.home-breakpoints-page.home-page .flexlast-shared-header .header__inner {
    padding-inline: 10px !important;
  }

  body.home-breakpoints-page.home-page .flexlast-shared-header .main-nav {
    gap: 10px !important;
  }

  body.home-breakpoints-page.home-page .flexlast-shared-header .logo {
    margin-left: 10px !important;
    font-size: 26px !important;
    letter-spacing: -0.05em !important;
  }

  body.home-breakpoints-page.home-page .flexlast-shared-header .header-mobile-phone .header-phone-number {
    font-size: 13.8px !important;
    letter-spacing: -0.04em !important;
  }

  body.home-breakpoints-page.home-page .flexlast-shared-header .header-action-button:not(.header-context-button) {
    min-width: 42px !important;
    width: 42px !important;
    height: 42px !important;
    border-radius: 14px !important;
    padding: 0 !important;
  }

  body.home-breakpoints-page.home-page .flexlast-shared-header .header-action-button .material-icons-round {
    font-size: 22px !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .widget-top {
    padding: 16px;
    padding-bottom: 34px;
    gap: 12px;
    border-radius: 28px;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .widget-bottom {
    padding: 18px;
    gap: 14px;
    margin-top: -18px;
    border-radius: 28px;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .card {
    border-radius: 18px;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .address-card {
    align-items: center;
    gap: 8px;
    min-height: 66px;
    padding: 9px 12px;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .address-col .label {
    font-size: 10.6px;
    line-height: 1.06;
    letter-spacing: 0.065em;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .address-col input {
    font-size: 16.8px;
    line-height: 1.18;
    letter-spacing: -0.028em;
    padding: 1px 0;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .address-col input::placeholder {
    font-size: inherit;
    line-height: inherit;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .address-col:nth-of-type(2) {
    padding-left: 4px;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .multi-stop-display {
    gap: 5px;
    padding: 7px 10px;
    border-radius: 20px;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .multi-stop-pill {
    font-size: 14px;
    padding: 3px 10px;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .multi-stop-final {
    font-size: 14px;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .multi-stop-address {
    font-size: 15px;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .icon-btn {
    width: 40px;
    height: 40px;
    border-radius: 13px;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .swap-btn .material-icons-round,
  body.home-breakpoints-page.home-page #quickOrderWidget .add-address-btn .material-icons-round {
    font-size: 20px !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .truck-card {
    grid-template-columns: 82px minmax(0, 1fr) 18px;
    align-items: center;
    min-height: 88px;
    padding: 16px 14px 16px 20px;
    gap: 10px;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .truck-img {
    width: 82px;
    height: 54px;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .truck-info {
    /* 16px: Die Truck-Bilder skalieren per transform (bis 1.5x) über ihre
       82px-Spalte hinaus – ohne Reserve klebt der Text am Fahrzeug. */
    margin-left: 16px;
    gap: 4px;
    min-width: 0;
    overflow: visible;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .truck-field-label {
    font-size: 10.8px;
    line-height: 1;
    letter-spacing: 0.08em;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .truck-main-line {
    gap: 6px;
    font-size: 18px;
    line-height: 1.18;
    letter-spacing: -0.04em;
    overflow: visible;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .truck-main-separator {
    font-size: 0.74em;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .truck-main-name {
    font-weight: 690;
    min-width: 0;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .arrow-icon {
    font-size: 22px;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .loaders-card {
    grid-template-columns: 67px minmax(0, 1fr);
    gap: 10px 12px;
    min-height: 122px;
    padding: 14px 14px 12px;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .loader-img {
    width: 58px;
    height: 46px;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .loader-img--main {
    width: 67px;
    height: 53px;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .loader-text {
    gap: 4px;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget #loadersTextLine1 {
    font-size: 15.8px;
    line-height: 1.12;
    letter-spacing: -0.028em;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget #loadersTextLine2 {
    font-size: 13.8px;
    line-height: 1.28;
    letter-spacing: -0.014em;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .counter-box {
    grid-template-columns: 44px minmax(0, 1fr) 44px;
    margin-top: 4px;
    padding: 5px;
    gap: 5px;
    border-radius: 16px;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .counter-box button,
  body.home-breakpoints-page.home-page #quickOrderWidget .counter-btn {
    width: 44px;
    height: 44px;
    border-radius: 13px;
    font-size: 24px;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .counter-texts > span {
    font-size: 11.2px;
    line-height: 1.08;
    letter-spacing: 0.03em;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .counter-texts strong,
  body.home-breakpoints-page.home-page #quickOrderWidget #loaderCountVal {
    font-size: 17px;
    line-height: 1;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .info-icon {
    font-size: 15px;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .tooltip-box {
    width: min(244px, calc(100vw - 48px));
    padding: 13px 14px;
    border-radius: 16px;
    font-size: 12.5px;
    line-height: 1.46;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .service-comment-row {
    min-height: 62px;
    padding: 12px 16px;
    gap: 12px;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .service-comment-icon {
    width: 36px;
    height: 36px;
    border-radius: 11px;
    font-size: 20px;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .service-comment-label {
    font-size: 11.4px;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .service-comment-value {
    font-size: 15px;
    line-height: 1.32;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .service-comment-arrow {
    font-size: 22px;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .two-col-row {
    gap: 10px;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .options-card,
  body.home-breakpoints-page.home-page #quickOrderWidget .time-card {
    min-height: 90px;
    padding: 14px;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .options-card {
    gap: 14px;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .options-card > span:first-child::after {
    font-size: 17.2px;
    line-height: 1.02;
    letter-spacing: -0.03em;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .options-control-shell {
    width: 46px;
    min-width: 46px;
    height: 46px;
    padding: 4px;
    border-radius: 14px;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .options-icon {
    width: 38px;
    height: 38px;
    border-radius: 11px;
    font-size: 20px;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .options-summary-value {
    font-size: 14.4px;
    line-height: 1.08;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .time-card {
    grid-template-columns: minmax(0, 1fr) 88px;
    gap: 10px;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .time-info {
    overflow: visible;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .time-card .label {
    display: block;
    margin-bottom: 4px;
    font-size: clamp(7.2px, 1.92vw, 9px);
    line-height: 1.02;
    letter-spacing: 0.01em;
    font-weight: 800;
    color: var(--home-text-subtle);
    text-transform: uppercase;
    max-width: none;
    white-space: nowrap;
    overflow: visible;
    text-overflow: clip;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .time-card .label::after {
    content: none !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .time-info #rentalTimeText {
    font-size: clamp(16px, 3.45vw, 22.8px);
    line-height: 1;
    letter-spacing: -0.03em;
    white-space: nowrap;
    overflow: visible;
    text-overflow: clip;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .vert-controls {
    width: 88px;
    min-width: 88px;
    gap: 4px;
    padding: 4px;
    border-radius: 15px;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .vert-controls button {
    min-height: 48px;
    border-radius: 11px;
    font-size: 19px;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .rental-time-hint {
    gap: 9px;
    padding: 12px 15px;
    font-size: 13.6px;
    line-height: 1.42;
    border-radius: 16px;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .rental-time-hint-icon {
    font-size: 19px;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .phone-group {
    min-height: 72px;
    padding: 11px 12px 11px 16px;
    border-radius: 22px;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .phone-wrapper {
    gap: 12px;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .phone-input-main {
    gap: 6px;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .phone-input-main input {
    font-size: 17.2px;
    line-height: 1.02;
    letter-spacing: -0.028em;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .phone-input-main .floating-label,
  body.home-breakpoints-page.home-page #quickOrderWidget .phone-input-main input:focus ~ .floating-label,
  body.home-breakpoints-page.home-page #quickOrderWidget .phone-input-main input:not(:placeholder-shown) ~ .floating-label {
    font-size: 11.5px;
    letter-spacing: 0.02em;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .user-icon {
    width: 46px;
    height: 46px;
    border-radius: 15px;
    font-size: 24px;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .delivery-time-row {
    gap: 10px;
    margin-top: 0;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .radio-card {
    min-height: 82px;
    padding: 15px 16px;
    gap: 14px;
    border-radius: 20px;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .radio-top {
    width: 28px;
    min-width: 28px;
    height: 28px;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .radio-card .checkmark {
    width: 28px;
    height: 28px;
    font-size: 25px;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .radio-card .empty {
    width: 22px;
    height: 22px;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .radio-text,
  body.home-breakpoints-page.home-page #quickOrderWidget .calendar-wrap {
    font-size: 15.8px;
    line-height: 1.32;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .calendar-wrap {
    gap: 10px;
    min-width: 0;
    width: 100%;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .calendar-wrap span:last-child {
    min-width: 0;
    max-width: 9.8ch;
    font-size: 14.2px;
    line-height: 1.2;
    letter-spacing: -0.018em;
    white-space: normal;
    overflow: visible;
    text-overflow: unset;
    text-wrap: balance;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .calendar-wrap .material-icons-round {
    width: 34px;
    height: 34px;
    border-radius: 10px;
    font-size: 19px !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .checkout-row {
    grid-template-columns: 60px minmax(0, 1fr) 60px;
    gap: 10px;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .checkout-row .side-btn,
  body.home-breakpoints-page.home-page #quickOrderWidget .checkout-btn {
    height: 64px;
    border-radius: 18px;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .checkout-row .side-btn {
    width: 60px;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .side-btn .material-icons-round {
    font-size: 24px;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .checkout-btn {
    gap: 3px;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .checkout-label {
    font-size: 17.6px;
    line-height: 1.04;
    letter-spacing: -0.026em;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .total-price {
    font-size: 30px;
    line-height: 0.96;
    letter-spacing: -0.052em;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .wallet-badge {
    top: -6px;
    right: -6px;
    min-width: 24px;
    height: 24px;
    padding: 0 7px;
    font-size: 9.5px;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .agreements {
    gap: 12px;
    margin-top: 2px;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .checkbox-label {
    font-size: 13px;
    line-height: 1.52;
    letter-spacing: -0.01em;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .custom-checkbox {
    min-width: 19px;
    height: 19px;
    margin-right: 13px;
    border-radius: 6px;
  }

  body.home-breakpoints-page.home-page .home-features,
  body.home-breakpoints-page.home-page .home-savings {
    padding-left: 14px;
    padding-right: 14px;
    margin-top: 20px;
  }

  body.home-breakpoints-page.home-page .home-features-grid {
    gap: 14px;
  }

  body.home-breakpoints-page.home-page .home-feature-card {
    grid-template-columns: 74px minmax(0, 1fr);
    gap: 14px;
    min-height: 116px;
    padding: 20px 20px 18px;
    border-radius: 26px;
  }

  body.home-breakpoints-page.home-page .home-feature-icon {
    width: 74px;
    height: 74px;
  }

  body.home-breakpoints-page.home-page .home-feature-copy {
    padding-left: 12px;
    gap: 7px;
  }

  body.home-breakpoints-page.home-page .home-feature-card h3 {
    width: 100%;
    max-width: none;
    font-size: 19.2px;
    line-height: 1.08;
    letter-spacing: -0.03em;
  }

  body.home-breakpoints-page.home-page .home-feature-card p {
    width: 100%;
    max-width: none;
    font-size: 15.2px;
    line-height: 1.42;
    letter-spacing: -0.014em;
  }

  body.home-breakpoints-page.home-page .home-feature-icon-plain img.home-feature-icon-radar {
    width: 90px;
    height: 90px;
  }

  body.home-breakpoints-page.home-page .home-feature-icon-plain img.home-feature-icon-instant {
    width: 98px;
    height: 98px;
  }

  body.home-breakpoints-page.home-page .home-quick-actions {
    margin-top: 18px;
    padding-left: 14px;
    padding-right: 14px;
  }

  body.home-breakpoints-page.home-page .home-quick-actions-grid {
    gap: 14px;
  }

  body.home-breakpoints-page.home-page .home-action-card {
    min-height: 228px;
    padding: 28px 26px 24px;
    border-radius: 30px;
    gap: 18px;
  }

  body.home-breakpoints-page.home-page .home-action-card-top {
    gap: 16px;
  }

  body.home-breakpoints-page.home-page .home-action-card-arrow {
    width: 56px;
    height: 56px;
    font-size: 27px;
  }

  body.home-breakpoints-page.home-page .home-action-card-top h2 {
    font-size: 32px;
    line-height: 0.94;
    letter-spacing: -0.056em;
  }

  body.home-breakpoints-page.home-page .home-action-card-note {
    font-size: 16.2px;
    line-height: 1.42;
    letter-spacing: -0.014em;
  }

  body.home-breakpoints-page.home-page .home-faq {
    margin-top: 22px;
    padding-left: 14px;
    padding-right: 14px;
  }

  body.home-breakpoints-page.home-page .home-faq-shell {
    padding: 28px 22px 22px;
    border-radius: 30px;
  }

  body.home-breakpoints-page.home-page .home-faq-layout {
    gap: 18px;
  }

  body.home-breakpoints-page.home-page .home-faq-sidebar h2 {
    font-size: 32px;
    line-height: 0.96;
    letter-spacing: -0.055em;
  }

  body.home-breakpoints-page.home-page .home-faq-tabs {
    gap: 8px;
    margin-top: 22px;
  }

  body.home-breakpoints-page.home-page .home-faq-tab {
    width: 100%;
    min-height: 42px;
    padding: 0 14px;
    font-size: 14.5px;
    line-height: 1.08;
    letter-spacing: -0.014em;
    justify-content: center;
  }

  body.home-breakpoints-page.home-page .home-faq-item {
    border-radius: 24px;
  }

  body.home-breakpoints-page.home-page .home-faq-question {
    min-height: 68px;
    padding: 20px 22px;
    gap: 18px;
  }

  body.home-breakpoints-page.home-page .home-faq-question span:first-child {
    font-size: 16.3px;
    line-height: 1.24;
    letter-spacing: -0.02em;
  }

  body.home-breakpoints-page.home-page .home-faq-icon {
    font-size: 22px;
  }

  body.home-breakpoints-page.home-page .home-faq-answer p {
    font-size: 14.3px;
    line-height: 1.5;
    letter-spacing: -0.01em;
  }

  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card {
    --bp-lab-tags-visual-reserve: 150px;
    display: block;
    position: relative;
    min-height: 226px;
    padding: 20px 20px 18px;
    border-radius: 28px;
  }

  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--cargo,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--express,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--moving,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--loaders {
    min-height: 226px;
    padding-right: 20px;
  }

  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--cargo {
    --bp-lab-tags-visual-reserve: 164px;
  }

  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card h3 {
    max-width: 10.6ch;
    font-size: 24.5px;
    line-height: 0.94;
    letter-spacing: -0.046em;
  }

  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card p,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--express p {
    margin-top: 12px;
    max-width: calc(100% - 164px);
    color: #5f6d82;
    font-size: 15.2px;
    font-weight: 500;
    line-height: 1.46;
    letter-spacing: -0.014em;
    display: block;
    text-align: left;
    text-indent: 0;
    text-wrap: initial;
    -webkit-line-clamp: unset;
    -webkit-box-orient: initial;
    overflow: visible;
  }

  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-tags,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--cargo .home-services-preview-tags,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--express .home-services-preview-tags,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--moving .home-services-preview-tags,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--loaders .home-services-preview-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
    max-width: none;
    margin-top: 20px;
  }

  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-tags span,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--cargo .home-services-preview-tags span,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--express .home-services-preview-tags span,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--moving .home-services-preview-tags span,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--loaders .home-services-preview-tags span {
    width: auto;
    max-width: 100%;
    flex: 0 0 auto;
    min-height: 30px;
    padding: 0 12px;
    font-size: 12.3px;
    letter-spacing: -0.014em;
  }

  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--express .home-services-preview-tags {
    max-width: none;
  }

  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-visual {
    position: absolute;
    top: 16px;
    right: 16px;
    bottom: auto;
    grid-area: auto;
    place-self: auto;
    width: 148px;
    height: 148px;
    border-radius: 24px;
    opacity: 1;
  }

  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-visual--cargo {
    top: 14px;
    right: 10px;
    margin-right: 0;
  }

  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-visual--loaders {
    top: 14px;
    right: 14px;
    width: 150px;
    height: 150px;
  }

  body.home-breakpoints-page.home-page .popular-services,
  body.home-breakpoints-page.home-page .home-service-links {
    padding-left: 14px;
    padding-right: 14px;
    margin-top: 18px;
  }

  body.home-breakpoints-page.home-page .popular-services-shell {
    padding: 24px 18px 20px;
    border-radius: 26px;
  }

  body.home-breakpoints-page.home-page .popular-services-shell h2 {
    font-size: 31px;
    line-height: 0.98;
    letter-spacing: -0.054em;
  }

  body.home-breakpoints-page.home-page .popular-services-tags {
    margin-top: 16px;
  }

  body.home-breakpoints-page.home-page .popular-service-tag {
    min-height: 38px;
    padding: 9px 15px;
    font-size: 14px;
    line-height: 1.08;
    letter-spacing: -0.018em;
  }
}

@media (min-width: 768px) and (max-width: 979px) {
  body.home-breakpoints-page {
    /* tablet experiments */
  }

  html body.home-breakpoints-page.home-page .hero-left {
    width: min(100%, 490px) !important;
    max-width: 490px !important;
    margin-inline: auto !important;
  }

  body.home-breakpoints-page.home-page .hero-spotlight {
    width: min(100%, 490px);
    max-width: 490px;
    margin-inline: auto;
  }

  body.home-breakpoints-page.home-page .hero-spotlight-support-visual,
  body.home-breakpoints-page.home-page--de .hero-spotlight-support-visual--carousel,
  body.home-breakpoints-page.home-page--de .hero-gallery--de-spotlight {
    width: 100%;
    max-width: none;
  }

  body.home-breakpoints-page.home-page .flexlast-shared-header {
    padding: 8px 0 10px !important;
    background: #fff !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    border-bottom: none !important;
  }

  body.home-breakpoints-page.home-page .flexlast-shared-header .header__inner {
    padding-inline: 3% !important;
  }

  body.home-breakpoints-page.home-page .flexlast-shared-header .top-bar {
    display: flex !important;
    margin-bottom: 8px !important;
    padding-bottom: 8px !important;
  }

  body.home-breakpoints-page.home-page .flexlast-shared-header .header-top-meta {
    display: flex !important;
    gap: 20px !important;
    min-width: 0 !important;
  }

  body.home-breakpoints-page.home-page .flexlast-shared-header .header-audience-switch {
    display: inline-flex !important;
    gap: 6px !important;
    margin-left: 10px !important;
  }

  body.home-breakpoints-page.home-page .flexlast-shared-header .header-audience-button {
    height: 34px !important;
    padding: 0 12px !important;
    border-radius: 14px !important;
    font-size: 13px !important;
  }

  body.home-breakpoints-page.home-page .flexlast-shared-header .header-contact-cluster {
    display: inline-flex !important;
    gap: 8px !important;
  }

  body.home-breakpoints-page.home-page .flexlast-shared-header .main-nav {
    display: flex !important;
    grid-template-columns: none !important;
    min-height: 38px !important;
    gap: 12px !important;
    justify-content: space-between !important;
    width: 100% !important;
  }

  body.home-breakpoints-page.home-page .flexlast-shared-header .logo {
    grid-column: auto !important;
    margin: 0 !important;
    max-width: none !important;
    font-size: 23px !important;
    letter-spacing: -0.04em !important;
  }

  body.home-breakpoints-page.home-page .flexlast-shared-header .nav-links {
    display: flex !important;
    flex: 1 1 auto !important;
    justify-content: center !important;
    gap: 12px !important;
    padding: 0 4px !important;
    font-size: 11.5px !important;
    line-height: 1.1 !important;
  }

  body.home-breakpoints-page.home-page .header-nav-dropdown-panel {
    top: calc(100% + 16px);
    width: min(520px, calc(100vw - 48px));
    padding: 0;
    border-radius: 0;
  }

  body.home-breakpoints-page.home-page .header-nav-dropdown-head {
    gap: 18px;
    margin-bottom: 16px;
  }

  body.home-breakpoints-page.home-page .header-nav-dropdown-lead {
    max-width: 380px;
    font-size: 14px;
    line-height: 1.45;
  }

  body.home-breakpoints-page.home-page .header-service-links {
    grid-template-columns: repeat(var(--header-dropdown-columns, 2), minmax(0, 1fr));
    column-gap: clamp(28px, 4vw, 48px);
    row-gap: clamp(14px, 1.8vw, 20px);
  }

  body.home-breakpoints-page.home-page .header-service-link {
    min-height: 0;
    padding: 0;
    border-radius: 0;
  }

  body.home-breakpoints-page.home-page .header-service-link-title {
    font-size: inherit;
    line-height: 1.25;
  }

  body.home-breakpoints-page.home-page .header-service-link-text {
    margin-top: 16px;
    font-size: 13px;
    line-height: 1.42;
  }

  body.home-breakpoints-page.home-page .flexlast-shared-header .nav-actions {
    display: flex !important;
    grid-column: auto !important;
    justify-self: auto !important;
    gap: 6px !important;
    position: static !important;
    margin-left: 0 !important;
  }

  body.home-breakpoints-page.home-page .flexlast-shared-header .nav-actions > .header-mobile-locale {
    display: none !important;
  }

  body.home-breakpoints-page.home-page .flexlast-shared-header .nav-actions > button[data-header-account],
  body.home-breakpoints-page.home-page .flexlast-shared-header .nav-actions > button[data-header-orders],
  body.home-breakpoints-page.home-page .flexlast-shared-header .header-menu {
    display: inline-flex !important;
  }

  body.home-breakpoints-page.home-page .flexlast-shared-header .header-menu-desktop-only {
    display: flex !important;
  }

  body.home-breakpoints-page.home-page .flexlast-shared-header .header-menu-mobile-only {
    display: none !important;
  }

  body.home-breakpoints-page.home-page .flexlast-shared-header .header-mobile-phone .header-phone-number {
    font-size: 13px !important;
    letter-spacing: 0 !important;
  }

  body.home-breakpoints-page.home-page .flexlast-shared-header .header-mobile-phone {
    display: none !important;
  }

  body.home-breakpoints-page.home-page .flexlast-shared-header .header-phone-note {
    display: block !important;
    font-size: 9px !important;
  }

  body.home-breakpoints-page.home-page .flexlast-shared-header .header-call-button {
    display: inline-flex !important;
    width: 32px !important;
    height: 32px !important;
    border-radius: 50% !important;
  }

  body.home-breakpoints-page.home-page .flexlast-shared-header .header-top-theme {
    display: none !important;
  }

  body.home-breakpoints-page.home-page .flexlast-shared-header .header-action-button:not(.header-locale-pill):not(.header-context-button) {
    min-width: 42px !important;
    width: 42px !important;
    height: 42px !important;
    min-height: 42px !important;
    border-radius: 14px !important;
    padding: 0 !important;
  }

  body.home-breakpoints-page.home-page .flexlast-shared-header .header-locale-pill {
    min-width: 72px !important;
    width: auto !important;
    height: 36px !important;
    min-height: 36px !important;
    padding: 0 8px !important;
    border-radius: 13px !important;
    gap: 6px !important;
  }

  body.home-breakpoints-page.home-page .flexlast-shared-header .header-action-button .material-icons-round:not(.header-locale-trigger-caret) {
    font-size: 19px !important;
  }

  body.home-breakpoints-page.home-page .hero-right {
    margin-top: 0;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget {
    width: min(100%, 736px);
    margin-inline: auto;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .widget-top {
    padding: 14px;
    padding-bottom: 28px;
    gap: 10px;
    border-radius: 28px;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .widget-bottom {
    padding: 16px;
    gap: 12px;
    margin-top: -14px;
    border-radius: 28px;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .card {
    border-radius: 16px;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .address-card {
    grid-template-columns: minmax(0, 1fr) 38px minmax(0, 1fr) 38px;
    min-height: 66px;
    padding: 8px 10px;
    gap: 7px;
    align-items: center;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .address-col .label {
    font-size: 10.4px;
    line-height: 1.06;
    letter-spacing: 0.06em;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .address-col input {
    font-size: 15.6px;
    line-height: 1.16;
    letter-spacing: -0.024em;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .address-card .swap-btn,
  body.home-breakpoints-page.home-page #quickOrderWidget .address-card .add-address-btn,
  body.home-breakpoints-page.home-page #quickOrderWidget .icon-btn {
    width: 38px;
    height: 38px;
    border-radius: 12px;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .swap-btn .material-icons-round,
  body.home-breakpoints-page.home-page #quickOrderWidget .add-address-btn .material-icons-round {
    font-size: 19px !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .truck-card {
    grid-template-columns: 84px minmax(0, 1fr) 20px;
    min-height: 82px;
    padding: 13px 14px 13px 24px;
    gap: 8px 16px;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .truck-img {
    width: 84px;
    height: 54px;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .truck-info {
    /* 14px Abstand zum Fahrzeugbild – die Bilder ragen per transform-Scale
       über ihre Grid-Spalte hinaus. */
    margin-left: 14px;
    gap: 3px;
    min-width: 0;
    overflow: visible !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .truck-field-label {
    font-size: 10.6px;
    line-height: 1;
    letter-spacing: 0.08em;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .truck-main-line {
    gap: 7px;
    font-size: 17.6px;
    line-height: 1.16;
    letter-spacing: -0.034em;
    overflow: visible !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .truck-main-name {
    min-width: 0;
    overflow: visible !important;
    text-overflow: clip !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .arrow-icon {
    font-size: 20px;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .loaders-card {
    grid-template-columns: 62px minmax(0, 1fr);
    gap: 9px 10px;
    min-height: 112px;
    padding: 12px 14px 11px;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .loader-img {
    width: 54px;
    height: 43px;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .loader-img--main {
    width: 62px;
    height: 49px;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget #loadersTextLine1 {
    font-size: 15.4px;
    line-height: 1.1;
    letter-spacing: -0.028em;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget #loadersTextLine2 {
    font-size: 13.2px;
    line-height: 1.24;
    letter-spacing: -0.012em;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .counter-box {
    grid-template-columns: 42px minmax(0, 1fr) 42px;
    margin-top: 2px;
    padding: 4px;
    gap: 4px;
    border-radius: 14px;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .counter-box button,
  body.home-breakpoints-page.home-page #quickOrderWidget .counter-btn {
    width: 42px;
    height: 42px;
    border-radius: 12px;
    font-size: 21px;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .counter-texts > span {
    font-size: 10.6px;
    line-height: 1.08;
    letter-spacing: 0.03em;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .counter-texts strong,
  body.home-breakpoints-page.home-page #quickOrderWidget #loaderCountVal {
    font-size: 16.6px;
    line-height: 1;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .service-comment-row {
    min-height: 58px;
    padding: 11px 14px;
    gap: 10px;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .service-comment-icon {
    width: 34px;
    height: 34px;
    border-radius: 10px;
    font-size: 18px;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .service-comment-label {
    font-size: 10.8px;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .service-comment-value {
    font-size: 14.2px;
    line-height: 1.32;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .service-comment-arrow {
    font-size: 20px;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .two-col-row {
    gap: 10px;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .options-card,
  body.home-breakpoints-page.home-page #quickOrderWidget .time-card {
    min-height: 84px;
    padding: 13px;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .options-card > span:first-child::after {
    content: none !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .options-card > span:first-child {
    display: flex;
    align-items: center;
    min-width: 0;
    max-width: none;
    font-size: 17.8px !important;
    line-height: 1.02;
    letter-spacing: -0.032em;
    font-weight: 900;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .options-control-shell {
    width: 42px;
    min-width: 42px;
    height: 42px;
    padding: 3px;
    border-radius: 13px;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .options-icon {
    width: 36px;
    height: 36px;
    border-radius: 10px;
    font-size: 18px;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .options-summary-value {
    font-size: 14.2px;
    line-height: 1.06;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .time-card {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 10px;
    align-items: center;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .time-card .label {
    display: block;
    margin-bottom: 4px;
    font-size: clamp(8.6px, 1.98vw, 10.2px);
    line-height: 1.03;
    letter-spacing: 0.015em;
    font-weight: 800;
    color: var(--home-text-subtle);
    text-transform: uppercase;
    max-width: none;
    white-space: nowrap;
    overflow: visible;
    text-overflow: clip;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .time-card .label::after {
    content: none !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .time-info {
    overflow: visible;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .time-info #rentalTimeText {
    font-size: clamp(17px, 1.7vw, 22px);
    line-height: 1;
    letter-spacing: -0.034em;
    white-space: nowrap;
    overflow: visible;
    text-overflow: clip;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .vert-controls {
    justify-self: end;
    align-self: center;
    display: flex;
    flex-direction: row-reverse;
    align-items: center;
    width: max-content;
    min-width: 0;
    height: auto;
    min-height: auto;
    gap: 3px;
    padding: 3px;
    border-radius: 12px;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .vert-controls button {
    width: 38px;
    height: 38px;
    min-height: 38px;
    flex: 0 0 auto;
    border-radius: 10px;
    font-size: 17px;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .phone-group {
    min-height: 68px;
    padding: 10px 12px 10px 14px;
    border-radius: 20px;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .phone-wrapper {
    gap: 10px;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .phone-input-main {
    gap: 6px;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .phone-input-main input {
    font-size: 16.2px;
    line-height: 1.04;
    letter-spacing: -0.028em;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .phone-input-main .floating-label,
  body.home-breakpoints-page.home-page #quickOrderWidget .phone-input-main input:focus ~ .floating-label,
  body.home-breakpoints-page.home-page #quickOrderWidget .phone-input-main input:not(:placeholder-shown) ~ .floating-label {
    font-size: 10.8px;
    letter-spacing: 0.02em;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .user-icon {
    width: 42px;
    height: 42px;
    border-radius: 14px;
    font-size: 21px;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .delivery-time-row {
    gap: 10px;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .radio-card {
    min-height: 76px;
    padding: 13px 14px;
    gap: 10px;
    border-radius: 18px;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .radio-top {
    width: 24px;
    min-width: 24px;
    height: 24px;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .radio-card .checkmark {
    width: 24px;
    height: 24px;
    font-size: 21px;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .radio-card .empty {
    width: 19px;
    height: 19px;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .radio-text {
    max-width: 10.2ch;
    font-size: 14.6px;
    line-height: 1.24;
    letter-spacing: -0.016em;
    text-wrap: balance;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .calendar-wrap {
    display: grid;
    grid-template-columns: 30px minmax(0, 1fr);
    column-gap: 8px;
    align-items: center;
    min-width: 0;
    width: 100%;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .calendar-wrap span:last-child {
    min-width: 0;
    max-width: 10.8ch;
    font-size: 13.8px;
    line-height: 1.22;
    letter-spacing: -0.016em;
    white-space: normal;
    overflow: visible;
    text-overflow: unset;
    text-wrap: balance;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .calendar-wrap .material-icons-round {
    width: 30px;
    height: 30px;
    border-radius: 10px;
    font-size: 17px !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .checkout-row {
    grid-template-columns: 58px minmax(0, 1fr) 58px;
    gap: 10px;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .checkout-row .side-btn,
  body.home-breakpoints-page.home-page #quickOrderWidget .checkout-btn {
    height: 64px;
    border-radius: 18px;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .checkout-row .side-btn {
    width: 58px;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .side-btn .material-icons-round {
    font-size: 22px;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .checkout-label {
    font-size: 17px;
    line-height: 1.02;
    letter-spacing: -0.028em;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .total-price {
    font-size: 28px;
    line-height: 0.94;
    letter-spacing: -0.054em;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .wallet-badge {
    top: -6px;
    right: -6px;
    min-width: 23px;
    height: 23px;
    padding: 0 6px;
    font-size: 8.8px;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .agreements {
    gap: 10px;
    margin-top: 0;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .checkbox-label {
    font-size: 12.4px;
    line-height: 1.42;
    letter-spacing: -0.01em;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .custom-checkbox {
    min-width: 18px;
    height: 18px;
    margin-right: 11px;
    border-radius: 6px;
  }

  body.home-breakpoints-page.home-page .home-features,
  body.home-breakpoints-page.home-page .home-savings,
  body.home-breakpoints-page.home-page .home-services-preview,
  body.home-breakpoints-page.home-page .home-quick-actions,
  body.home-breakpoints-page.home-page .flex-stories,
  body.home-breakpoints-page.home-page .home-business-teaser,
  body.home-breakpoints-page.home-page .home-faq,
  body.home-breakpoints-page.home-page .home-service-links,
  body.home-breakpoints-page.home-page .popular-services {
    padding-left: 16px;
    padding-right: 16px;
  }

  body.home-breakpoints-page.home-page .home-features {
    margin-top: 18px;
  }

  body.home-breakpoints-page.home-page .home-features-grid {
    gap: 14px;
  }

  body.home-breakpoints-page.home-page .home-feature-card {
    grid-template-columns: 72px minmax(0, 1fr);
    gap: 14px;
    min-height: 114px;
    padding: 18px 18px 16px;
    border-radius: 24px;
  }

  body.home-breakpoints-page.home-page .home-feature-icon {
    width: 72px;
    height: 72px;
  }

  body.home-breakpoints-page.home-page .home-feature-copy {
    padding-left: 10px;
    gap: 6px;
  }

  body.home-breakpoints-page.home-page .home-feature-card h3 {
    font-size: 19px;
    line-height: 1.08;
    letter-spacing: -0.03em;
  }

  body.home-breakpoints-page.home-page .home-feature-card p {
    font-size: 14.4px;
    line-height: 1.42;
    letter-spacing: -0.014em;
  }

  body.home-breakpoints-page.home-page .home-feature-icon-plain img.home-feature-icon-radar {
    width: 88px;
    height: 88px;
  }

  body.home-breakpoints-page.home-page .home-feature-icon-plain img.home-feature-icon-instant {
    width: 94px;
    height: 94px;
  }

  body.home-breakpoints-page.home-page .home-services-divider {
    margin-top: 18px;
  }

  body.home-breakpoints-page.home-page .home-services-divider-shell {
    gap: 12px;
  }

  body.home-breakpoints-page.home-page .home-services-divider-shell::before,
  body.home-breakpoints-page.home-page .home-services-divider-shell::after {
    flex-basis: 40px;
  }

  body.home-breakpoints-page.home-page .home-services-divider-shell h2 {
    font-size: 25px;
    line-height: 1;
    letter-spacing: -0.046em;
  }

  body.home-breakpoints-page.home-page .home-services-preview-grid {
    gap: 16px;
  }

  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card {
    --bp-lab-tags-visual-reserve: 186px;
    --bp-lab-card-copy-reserve: 212px;
    display: block;
    position: relative;
    min-height: 226px;
    padding: 20px 20px 18px;
    border-radius: 28px;
  }

  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--cargo,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--express,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--moving,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--loaders {
    min-height: 226px;
    padding-right: 20px;
  }

  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--cargo {
    --bp-lab-tags-visual-reserve: 208px;
    --bp-lab-card-copy-reserve: 232px;
  }

  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card h3 {
    max-width: 12ch;
    font-size: 25px;
    line-height: 0.94;
    letter-spacing: -0.052em;
  }

  body.home-breakpoints-page.home-page--ru #homeServicesGrid .home-services-preview-card--express h3 {
    max-width: none;
    font-size: 26px;
    line-height: 0.99;
    letter-spacing: -0.045em;
    white-space: nowrap;
    overflow-wrap: normal;
    word-break: normal;
    hyphens: manual;
  }

  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card p,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--express p {
    margin-top: 12px;
    max-width: calc(100% - var(--bp-lab-card-copy-reserve, 238px));
    color: #5f6d82;
    font-size: 15.2px;
    font-weight: 500;
    line-height: 1.44;
    letter-spacing: -0.016em;
    display: block;
    text-align: left;
    text-indent: 0;
    text-wrap: initial;
    -webkit-line-clamp: unset;
    -webkit-box-orient: initial;
    overflow: visible;
  }

  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-tags,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--cargo .home-services-preview-tags,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--express .home-services-preview-tags,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--moving .home-services-preview-tags,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--loaders .home-services-preview-tags {
    width: 100%;
    max-width: none;
    margin-top: 20px;
  }

  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-tags span,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--cargo .home-services-preview-tags span,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--express .home-services-preview-tags span,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--moving .home-services-preview-tags span,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--loaders .home-services-preview-tags span {
    min-height: 31px;
    padding: 0 12px;
    font-size: 12.4px;
    letter-spacing: -0.014em;
  }

  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-visual {
    position: absolute;
    top: 16px;
    right: 16px;
    bottom: auto;
    grid-area: auto;
    place-self: auto;
    width: 152px;
    height: 152px;
    border-radius: 24px;
    opacity: 1;
  }

  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-visual--cargo {
    top: 14px;
    right: 8px;
    margin-right: 0;
  }

  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-visual--loaders {
    top: 15px;
    right: 15px;
    width: 156px;
    height: 156px;
  }

  body.home-breakpoints-page.home-page .home-quick-actions {
    margin-top: 18px;
  }

  body.home-breakpoints-page.home-page .home-quick-actions-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
  }

  body.home-breakpoints-page.home-page .home-action-card {
    min-height: 206px;
    padding: 22px 20px 18px;
    border-radius: 26px;
    gap: 14px;
  }

  body.home-breakpoints-page.home-page .home-action-card-top {
    gap: 14px;
  }

  body.home-breakpoints-page.home-page .home-action-card-arrow {
    width: 50px;
    height: 50px;
    font-size: 23px;
  }

  body.home-breakpoints-page.home-page .home-action-card-top h2 {
    font-size: 28px;
    line-height: 0.96;
    letter-spacing: -0.058em;
  }

  body.home-breakpoints-page.home-page .home-action-card-note {
    font-size: 14.8px;
    line-height: 1.44;
    letter-spacing: -0.014em;
  }

  body.home-breakpoints-page.home-page .home-faq {
    margin-top: 20px;
  }

  body.home-breakpoints-page.home-page .home-faq-shell {
    padding: 24px 20px 20px;
    border-radius: 26px;
    text-align: left;
  }

  body.home-breakpoints-page.home-page .home-faq-layout {
    grid-template-columns: minmax(228px, 0.76fr) minmax(0, 1fr);
    gap: 18px;
    align-items: start;
  }

  body.home-breakpoints-page.home-page .home-faq-sidebar h2 {
    font-size: 31px;
    line-height: 0.98;
    letter-spacing: -0.056em;
  }

  body.home-breakpoints-page.home-page .home-faq-tabs {
    margin-top: 18px;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
  }

  body.home-breakpoints-page.home-page .home-faq-tab {
    width: 100%;
    min-height: 42px;
    padding: 0 14px;
    font-size: 14.5px;
    line-height: 1.08;
    letter-spacing: -0.014em;
    justify-content: center;
  }

  body.home-breakpoints-page.home-page .home-faq-item {
    border-radius: 22px;
  }

  body.home-breakpoints-page.home-page .home-faq-question {
    min-height: 62px;
    padding: 17px 18px;
    gap: 14px;
  }

  body.home-breakpoints-page.home-page .home-faq-question span:first-child {
    font-size: 16px;
    line-height: 1.28;
    letter-spacing: -0.02em;
  }

  body.home-breakpoints-page.home-page .home-faq-icon {
    font-size: 20px;
  }

  body.home-breakpoints-page.home-page .home-faq-answer p {
    font-size: 14.2px;
    line-height: 1.52;
    letter-spacing: -0.01em;
  }

  body.home-breakpoints-page.home-page .popular-services,
  body.home-breakpoints-page.home-page .home-service-links {
    margin-top: 18px;
  }

  body.home-breakpoints-page.home-page .popular-services-shell {
    padding: 22px 18px 18px;
    border-radius: 24px;
  }

  body.home-breakpoints-page.home-page .popular-services-shell h2 {
    font-size: 31px;
    line-height: 0.98;
    letter-spacing: -0.056em;
  }

  body.home-breakpoints-page.home-page .popular-services-shell h2.popular-services-title {
    max-width: none;
    white-space: nowrap;
  }

  body.home-breakpoints-page.home-page .popular-services-title-line {
    display: inline;
  }

  body.home-breakpoints-page.home-page .popular-services-tags {
    margin-top: 15px;
  }

  body.home-breakpoints-page.home-page .popular-service-tag {
    min-height: 36px;
    padding: 8px 14px;
    font-size: 13px;
    line-height: 1.08;
    letter-spacing: -0.018em;
  }
}

@media (min-width: 980px) {
  body.home-breakpoints-page {
    /* desktop experiments */
  }
}

@media (min-width: 980px) and (max-width: 1139px) {
  body.home-breakpoints-page.home-page .hero {
    gap: clamp(22px, 2.6vw, 34px);
  }

  body.home-breakpoints-page.home-page--de .hero-spotlight-copy h1 {
    max-width: 12.8ch;
    font-size: clamp(48px, 5vw, 56px);
    line-height: 0.92;
    letter-spacing: -0.056em;
  }

  body.home-breakpoints-page.home-page--de .hero-spotlight-heading-topline {
    display: inline-flex;
    flex-direction: row;
    align-items: baseline;
    gap: 0.16em;
    width: max-content;
    max-width: 100%;
    font-size: 0.94em;
    letter-spacing: inherit;
    white-space: nowrap;
  }

  body.home-breakpoints-page.home-page--de .hero-spotlight-rotating-word,
  body.home-breakpoints-page.home-page--de .hero-spotlight-heading-rest {
    font-size: inherit;
    letter-spacing: inherit;
  }

  body.home-breakpoints-page.home-page--de .hero-spotlight-accent {
    font-size: clamp(24px, 2.8vw, 30px);
    line-height: 1.04;
    letter-spacing: -0.038em;
  }

  body.home-breakpoints-page.home-page .home-services-divider {
    margin-top: 20px;
  }

  body.home-breakpoints-page.home-page .home-services-divider-shell {
    gap: 12px;
  }

  body.home-breakpoints-page.home-page .home-services-divider-shell::before,
  body.home-breakpoints-page.home-page .home-services-divider-shell::after {
    flex-basis: 44px;
  }

  body.home-breakpoints-page.home-page .home-services-divider-shell h2 {
    font-size: 26px;
    line-height: 1;
    letter-spacing: -0.046em;
  }

  body.home-breakpoints-page.home-page .home-services-preview-grid {
    gap: 16px;
  }

  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card {
    --bp-lab-tags-visual-reserve: 188px;
    --bp-lab-card-copy-reserve: 206px;
    display: block;
    position: relative;
    height: auto;
    min-height: 254px;
    padding: 20px 20px 18px;
    border-radius: 28px;
  }

  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--cargo,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--express,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--moving,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--loaders {
    min-height: 254px;
    padding-right: 20px;
  }

  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--cargo {
    --bp-lab-tags-visual-reserve: 198px;
    --bp-lab-card-copy-reserve: 214px;
    min-height: 282px;
  }

  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--loaders {
    --bp-lab-tags-visual-reserve: 172px;
  }

  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card h3 {
    max-width: 10.8ch;
    font-size: 26px;
    line-height: 0.94;
    letter-spacing: -0.05em;
  }

  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card p,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--express p {
    margin-top: 12px;
    max-width: calc(100% - var(--bp-lab-card-copy-reserve, 206px));
    color: #5f6d82;
    font-size: 15.2px;
    font-weight: 500;
    line-height: 1.42;
    letter-spacing: -0.015em;
    display: block;
    text-align: left;
    text-indent: 0;
    text-wrap: initial;
    -webkit-line-clamp: unset;
    -webkit-box-orient: initial;
    overflow: visible;
  }

  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-tags,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--cargo .home-services-preview-tags,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--express .home-services-preview-tags,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--moving .home-services-preview-tags,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--loaders .home-services-preview-tags {
    width: 100%;
    max-width: none;
    margin-top: 20px;
  }

  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--cargo .home-services-preview-tags {
    margin-top: 16px;
  }

  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--loaders .home-services-preview-tags {
    margin-top: 16px;
  }

  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-tags span,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--cargo .home-services-preview-tags span,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--express .home-services-preview-tags span,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--moving .home-services-preview-tags span,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--loaders .home-services-preview-tags span {
    min-height: 32px;
    padding: 0 12px;
    font-size: 12.8px;
    letter-spacing: -0.014em;
  }

  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--loaders .home-services-preview-tags span {
    min-height: 30px;
    padding: 0 11px;
    font-size: 12.2px;
  }

  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-visual {
    position: absolute;
    top: 16px;
    right: 16px;
    bottom: auto;
    grid-area: auto;
    place-self: auto;
    width: 158px;
    height: 158px;
    border-radius: 24px;
    opacity: 1;
  }

  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-visual--cargo {
    top: 14px;
    right: 8px;
    margin-right: 0;
  }

  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-visual--loaders {
    top: 15px;
    right: 15px;
    width: 162px;
    height: 162px;
  }
}

@media (min-width: 1440px) {
  body.home-breakpoints-page {
    /* wide desktop experiments */
  }
}

@media (max-width: 1139px) {
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-tags,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--cargo .home-services-preview-tags,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--express .home-services-preview-tags,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--moving .home-services-preview-tags,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--loaders .home-services-preview-tags {
    display: block;
    width: 100%;
    max-width: none;
    font-size: 0;
    line-height: 0;
  }

  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-tags::before,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--cargo .home-services-preview-tags::before,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--express .home-services-preview-tags::before,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--moving .home-services-preview-tags::before,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--loaders .home-services-preview-tags::before {
    content: "";
    float: right;
    width: var(--bp-lab-tags-visual-reserve, 0px);
    height: var(--bp-lab-tags-shape-height, 0px);
    pointer-events: none;
  }

  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-tags::after,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--cargo .home-services-preview-tags::after,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--express .home-services-preview-tags::after,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--moving .home-services-preview-tags::after,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--loaders .home-services-preview-tags::after {
    content: "";
    display: block;
    clear: both;
  }

  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-tags span,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--cargo .home-services-preview-tags span,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--express .home-services-preview-tags span,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--moving .home-services-preview-tags span,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--loaders .home-services-preview-tags span {
    display: inline-flex;
    float: none;
    vertical-align: top;
    margin: 0 clamp(8px, 0.9vw, 10px) clamp(8px, 0.9vw, 10px) 0;
    line-height: 1;
  }
}

@media (max-width: 767px) {
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-visual--cargo,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-visual--express,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-visual--moving,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-visual--loaders {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    border-radius: 0 !important;
    overflow: visible !important;
  }

  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-visual--cargo::before,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-visual--cargo::after,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-visual--express::before,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-visual--express::after,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-visual--moving::before,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-visual--moving::after,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-visual--loaders::before,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-visual--loaders::after {
    display: none !important;
  }

  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-visual--cargo img,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-visual--express img,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-visual--moving img,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-visual--loaders img {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
    object-position: center !important;
  }
}

/* Homepage task cards: image-led refresh matching the May 7 visual reference. */
body.home-breakpoints-page.home-page--de .home-services-divider,
body.home-breakpoints-page.home-page--de .home-services-preview {
  max-width: 1300px;
}

body.home-breakpoints-page.home-page--de .home-services-divider {
  margin-top: 26px;
  padding: 0 5%;
}

body.home-breakpoints-page.home-page--de .home-services-preview {
  margin-top: 18px;
  padding: 0 5%;
}

body.home-breakpoints-page.home-page--de .home-services-divider-shell {
  gap: 20px;
}

body.home-breakpoints-page.home-page--de .home-services-divider-shell::before,
body.home-breakpoints-page.home-page--de .home-services-divider-shell::after {
  flex-basis: 250px;
  background: linear-gradient(90deg, rgba(15, 23, 42, 0) 0%, rgba(15, 23, 42, 0.12) 100%);
}

body.home-breakpoints-page.home-page--de .home-services-divider-shell::after {
  background: linear-gradient(90deg, rgba(15, 23, 42, 0.12) 0%, rgba(15, 23, 42, 0) 100%);
}

body.home-breakpoints-page.home-page--de .home-services-divider-shell h2 {
  font-size: 37px;
  font-weight: 900;
  line-height: 0.95;
  letter-spacing: -0.045em;
}

body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-grid {
  gap: 16px;
}

body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card,
body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--cargo,
body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--express,
body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--moving,
body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--loaders {
  display: block;
  position: relative;
  min-height: 256px;
  padding: 31px 260px 24px 32px;
  overflow: hidden;
  border-radius: 36px;
  border: 1px solid rgba(17, 24, 39, 0.08);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.78),
    0 18px 42px rgba(15, 23, 42, 0.035);
  isolation: isolate;
}

body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card::before,
body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card::after {
  content: "";
  position: absolute;
  z-index: -1;
  pointer-events: none;
}

body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card::before {
  right: 16px;
  top: 26px;
  width: 270px;
  height: 106px;
  opacity: 0.52;
  background:
    radial-gradient(34px 18px at 22% 32%, rgba(255, 255, 255, 0.9) 0 58%, transparent 60%),
    radial-gradient(26px 14px at 32% 34%, rgba(255, 255, 255, 0.88) 0 58%, transparent 60%),
    linear-gradient(to top, rgba(148, 163, 184, 0.13) 0 44%, transparent 44%);
  clip-path: polygon(0 100%, 0 74%, 5% 74%, 5% 60%, 11% 60%, 11% 78%, 18% 78%, 18% 48%, 25% 48%, 25% 72%, 34% 72%, 34% 56%, 42% 56%, 42% 80%, 50% 80%, 50% 36%, 58% 36%, 58% 68%, 66% 68%, 66% 52%, 74% 52%, 74% 76%, 82% 76%, 82% 58%, 90% 58%, 90% 82%, 100% 82%, 100% 100%);
}

body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card::after {
  right: -34px;
  bottom: -48px;
  width: 330px;
  height: 166px;
  border-radius: 999px 0 0 0;
  opacity: 0.54;
  transform: rotate(-9deg);
}

body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--cargo {
  background:
    radial-gradient(circle at 72% 36%, rgba(255, 255, 255, 0.82) 0 28%, rgba(255, 255, 255, 0) 58%),
    linear-gradient(115deg, #fbfffd 0%, #f1fff7 47%, #e6f9ee 100%);
  border-color: #cfeedd;
}

body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--cargo::after {
  background: linear-gradient(120deg, rgba(255, 255, 255, 0.82), rgba(198, 244, 216, 0.52));
}

body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--express {
  background:
    radial-gradient(circle at 76% 37%, rgba(255, 255, 255, 0.78) 0 30%, rgba(255, 255, 255, 0) 58%),
    linear-gradient(115deg, #fffdfb 0%, #fff6ee 50%, #ffead9 100%);
  border-color: #f2d3b7;
}

body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--express::after {
  background:
    linear-gradient(100deg, rgba(255, 255, 255, 0.88), rgba(255, 222, 188, 0.7)),
    repeating-linear-gradient(90deg, transparent 0 48px, rgba(255, 255, 255, 0.76) 48px 68px);
}

body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--moving {
  background:
    radial-gradient(circle at 72% 37%, rgba(255, 255, 255, 0.5) 0 28%, rgba(255, 255, 255, 0) 60%),
    linear-gradient(115deg, #fbf6ff 0%, #f7efff 48%, #efe3ff 100%);
  border-color: #ded1f8;
}

body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--moving::after {
  background: linear-gradient(120deg, rgba(250, 245, 255, 0.72), rgba(220, 198, 255, 0.55));
}

body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--loaders {
  background:
    radial-gradient(circle at 74% 38%, rgba(255, 255, 255, 0.48) 0 30%, rgba(255, 255, 255, 0) 60%),
    linear-gradient(115deg, #f4fbff 0%, #ebf7ff 52%, #dff1ff 100%);
  border-color: #cfe3f4;
}

body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--loaders::after {
  background: linear-gradient(120deg, rgba(244, 251, 255, 0.74), rgba(196, 229, 255, 0.58));
}

body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card:hover,
body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card:focus-visible {
  transform: translateY(-3px);
  border-color: rgba(16, 185, 129, 0.3);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.82),
    0 22px 48px rgba(15, 23, 42, 0.075);
}

body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card h3 {
  position: relative;
  z-index: 2;
  max-width: 12ch;
  margin: 0;
  color: #101827;
  font-size: 29px;
  font-weight: 900;
  line-height: 0.93;
  letter-spacing: -0.055em;
  text-wrap: balance;
}

body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--express h3,
body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--moving h3,
body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--loaders h3 {
  max-width: none;
}

body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card p,
body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--express p {
  position: relative;
  z-index: 2;
  max-width: 31ch;
  margin-top: 16px;
  color: #4f5f76;
  font-size: 14px;
  font-weight: 650;
  line-height: 1.44;
  letter-spacing: -0.012em;
}

body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-tags,
body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--cargo .home-services-preview-tags,
body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--express .home-services-preview-tags,
body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--moving .home-services-preview-tags,
body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--loaders .home-services-preview-tags {
  position: relative;
  z-index: 3;
  display: flex;
  flex-wrap: wrap;
  gap: 9px;
  width: 100%;
  max-width: 315px;
  margin-top: 21px;
  font-size: initial;
  line-height: normal;
}

body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--express .home-services-preview-tags {
  max-width: 250px;
  margin-top: 21px;
}

body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-tags::before,
body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-tags::after {
  display: none;
}

body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-tags span,
body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--cargo .home-services-preview-tags span,
body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--express .home-services-preview-tags span,
body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--moving .home-services-preview-tags span,
body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--loaders .home-services-preview-tags span {
  display: inline-flex;
  float: none;
  align-items: center;
  justify-content: center;
  width: auto;
  min-height: 30px;
  margin: 0;
  padding: 0 13px;
  border: 0;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 800;
  line-height: 1;
  letter-spacing: -0.01em;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.55);
}

body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--cargo .home-services-preview-tags span {
  background: #d8f6e4;
  color: #245a40;
}

body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--express .home-services-preview-tags span {
  background: #ffe8d6;
  color: #76503b;
}

body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--moving .home-services-preview-tags span {
  background: #eadcff;
  color: #63409c;
}

body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--loaders .home-services-preview-tags span {
  background: #d8ecff;
  color: #255f97;
}

body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-visual,
body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-visual--cargo,
body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-visual--express,
body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-visual--moving,
body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-visual--loaders {
  position: absolute;
  z-index: 1;
  top: auto;
  right: 17px;
  bottom: 11px;
  width: 286px;
  height: 214px;
  margin: 0;
  display: block;
  overflow: visible;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  opacity: 1;
}

body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-visual--cargo {
  right: 12px;
  bottom: 7px;
  width: 302px;
  height: 220px;
}

body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-visual--express {
  right: 1px;
  bottom: 6px;
  width: 314px;
  height: 220px;
}

body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-visual--moving {
  right: 9px;
  bottom: 10px;
  width: 314px;
  height: 210px;
}

body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-visual--loaders {
  right: 12px;
  bottom: 8px;
  width: 308px;
  height: 214px;
}

body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-visual::before,
body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-visual::after {
  display: none !important;
}

body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-visual img,
body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-visual--cargo img,
body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-visual--express img,
body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-visual--moving img,
body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-visual--loaders img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  max-width: none;
  object-fit: contain !important;
  object-position: center !important;
  filter: drop-shadow(0 18px 24px rgba(15, 23, 42, 0.08));
}

body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-visual--moving img,
body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-visual--loaders img {
  object-fit: cover !important;
  object-position: center !important;
  transform: scale(1.08);
  filter: none;
  mix-blend-mode: multiply;
  -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 14%, #000 100%);
  mask-image: linear-gradient(90deg, transparent 0%, #000 14%, #000 100%);
}

body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-visual--loaders img {
  object-position: 50% 56% !important;
  transform: scale(1.12);
}

@media (max-width: 1139px) {
  body.home-breakpoints-page.home-page--de .home-services-divider,
  body.home-breakpoints-page.home-page--de .home-services-preview {
    max-width: 1300px;
  }

  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--cargo,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--express,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--moving,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--loaders {
    min-height: 236px;
    padding: 24px 244px 24px 24px;
  }

  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card h3 {
    font-size: 25px;
  }

  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card p,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--express p {
    max-width: 27ch;
    font-size: 13.4px;
  }

  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-visual,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-visual--cargo,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-visual--express,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-visual--moving,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-visual--loaders {
    right: 8px;
    bottom: 10px;
    width: 236px;
    height: 190px;
  }
}

@media (max-width: 767px) {
  body.home-breakpoints-page.home-page--de .home-services-divider,
  body.home-breakpoints-page.home-page--de .home-services-preview {
    max-width: 1300px;
    padding: 0 12px;
  }

  body.home-breakpoints-page.home-page--de .home-services-divider {
    margin-top: 22px;
  }

  body.home-breakpoints-page.home-page--de .home-services-divider-shell h2 {
    font-size: 24px;
    letter-spacing: -0.035em;
  }

  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-grid {
    grid-template-columns: 1fr;
    gap: 14px;
  }

  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--cargo,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--express,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--moving,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--loaders {
    min-height: 218px;
    padding: 20px 154px 18px 18px;
    border-radius: 30px;
  }

  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card h3 {
    max-width: 12ch;
    font-size: 23px;
    line-height: 0.97;
  }

  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card p,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--express p {
    max-width: none;
    margin-top: 12px;
    font-size: 13px;
    line-height: 1.38;
  }

  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-tags,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--cargo .home-services-preview-tags,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--express .home-services-preview-tags,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--moving .home-services-preview-tags,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--loaders .home-services-preview-tags {
    gap: 7px;
    margin-top: 16px;
  }

  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-tags span,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--cargo .home-services-preview-tags span,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--express .home-services-preview-tags span,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--moving .home-services-preview-tags span,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--loaders .home-services-preview-tags span {
    min-height: 28px;
    padding: 0 10px;
    font-size: 11.5px;
  }

  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-visual,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-visual--cargo,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-visual--express,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-visual--moving,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-visual--loaders {
    top: auto;
    right: -8px;
    bottom: 18px;
    width: 168px;
    height: 138px;
  }

  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card::before {
    right: 0;
    top: 26px;
    width: 190px;
    opacity: 0.32;
  }
}

@media (max-width: 479px) {
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--cargo,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--express,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--moving,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-card--loaders {
    min-height: 224px;
    padding-right: 128px;
  }

  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-visual,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-visual--cargo,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-visual--express,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-visual--moving,
  body.home-breakpoints-page.home-page--de #homeServicesGrid .home-services-preview-visual--loaders {
    right: -32px;
    bottom: 24px;
    width: 158px;
    height: 126px;
    opacity: 0.92;
  }
}

/* Hero carousel: keep promo artwork fully visible while resizing. */
body.home-breakpoints-page.home-page--de .hero-spotlight-support-visual--carousel {
  width: min(100%, clamp(420px, 47vw, 620px));
  max-width: 620px;
}

body.home-breakpoints-page.home-page--de .hero-gallery--de-spotlight {
  width: 100%;
  max-width: 620px;
  height: auto;
  min-height: 0;
  aspect-ratio: 4 / 3;
  transition: width 220ms ease, max-width 220ms ease, border-radius 220ms ease;
}

body.home-breakpoints-page.home-page--de .hero-gallery--de-spotlight .hero-gallery-viewport,
body.home-breakpoints-page.home-page--de .hero-spotlight-gallery-card {
  height: 100%;
}

body.home-breakpoints-page.home-page--de .hero-spotlight--map-mode {
  position: relative;
}

/* Full-bleed map background mode (Podorojnik-style) */
body.home-breakpoints-page.home-page .hero.hero--map-bg {
  position: relative !important;
  display: block !important;
  width: 100vw !important;
  max-width: 100vw !important;
  margin-left: calc(50% - 50vw) !important;
  margin-right: calc(50% - 50vw) !important;
  min-height: 800px !important;
  padding: 0 !important;
  border-radius: 0 !important;
  overflow: hidden !important;
}

body.home-breakpoints-page.home-page .hero.hero--map-bg .hero-left {
  position: absolute !important;
  inset: 0 !important;
  width: auto !important;
  max-width: none !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  display: block !important;
  z-index: 0 !important;
}

body.home-breakpoints-page.home-page .hero.hero--map-bg .hero-spotlight {
  position: relative !important;
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  display: block !important;
  gap: 0 !important;
  transform: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

body.home-breakpoints-page.home-page--de .hero.hero--map-bg .hero-spotlight-support-visual--map {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  max-width: none !important;
  aspect-ratio: auto !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

body.home-breakpoints-page.home-page--de .hero.hero--map-bg .hero-spotlight-copy.hero-spotlight-copy--overlay {
  top: clamp(20px, 2.5vw, 36px) !important;
  left: 5% !important;
}

body.home-breakpoints-page.home-page .hero.hero--map-bg .hero-right {
  position: relative !important;
  z-index: 2 !important;
  margin-left: auto !important;
  margin-right: 5% !important;
  margin-top: clamp(20px, 2.5vw, 36px) !important;
  margin-bottom: clamp(20px, 2.5vw, 36px) !important;
  width: clamp(380px, 32vw, 462px) !important;
  max-width: 462px !important;
}

@media (max-width: 980px) {
  body.home-breakpoints-page.home-page .hero.hero--map-bg {
    display: block !important;
    min-height: 0 !important;
    padding: 0 5% !important;
    overflow: visible !important;
  }
  body.home-breakpoints-page.home-page .hero.hero--map-bg .hero-left {
    position: relative !important;
    inset: auto !important;
  }
  body.home-breakpoints-page.home-page--de .hero.hero--map-bg .hero-spotlight-support-visual--map {
    display: none !important;
  }
  body.home-breakpoints-page.home-page .hero.hero--map-bg .hero-right {
    width: 100% !important;
    max-width: none !important;
    margin: 16px 0 0 !important;
  }
  body.home-breakpoints-page.home-page--de .hero.hero--map-bg .hero-spotlight-copy.hero-spotlight-copy--overlay {
    position: static !important;
    max-width: none !important;
    padding: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
    border-radius: 0 !important;
    width: auto !important;
  }
  body.home-breakpoints-page.home-page--de .hero.hero--map-bg .hero-spotlight-copy.hero-spotlight-copy--overlay h1 {
    font-size: clamp(28px, 6vw, 40px) !important;
    white-space: normal !important;
  }
  body.home-breakpoints-page.home-page--de .hero.hero--map-bg .hero-spotlight-copy.hero-spotlight-copy--overlay .hero-spotlight-heading-rest {
    font-size: clamp(14px, 3.6vw, 18px) !important;
    margin-top: 6px !important;
  }
}

body.home-breakpoints-page.home-page--de .hero-spotlight-support-visual--map {
  position: relative;
  width: 100%;
  aspect-ratio: 4 / 3;
  min-height: 460px;
  border-radius: 28px;
  overflow: hidden;
  background: #e9eef4;
  box-shadow: 0 18px 48px rgba(15, 23, 42, 0.1);
}

body.home-breakpoints-page.home-page--de .hero-map-iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
  display: block;
}

body.home-breakpoints-page.home-page--de .hero-spotlight-copy.hero-spotlight-copy--overlay {
  position: absolute !important;
  top: 16px !important;
  left: 16px !important;
  z-index: 3 !important;
  width: -moz-max-content !important;
  width: max-content !important;
  max-width: calc(100% - 32px) !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 10px 16px !important;
  border-radius: 14px !important;
  background: rgba(255, 255, 255, 0.96) !important;
  box-shadow: 0 8px 22px rgba(15, 23, 42, 0.12) !important;
  -webkit-backdrop-filter: blur(10px) !important;
  backdrop-filter: blur(10px) !important;
  text-align: left !important;
}

body.home-breakpoints-page.home-page--de .hero-spotlight-copy.hero-spotlight-copy--overlay h1 {
  margin: 0 !important;
  padding: 0 !important;
  font-size: 13px !important;
  font-weight: 800 !important;
  color: #0f1a25 !important;
  line-height: 1.2 !important;
  letter-spacing: 0 !important;
  white-space: nowrap !important;
  max-width: none !important;
}

body.home-breakpoints-page.home-page--de .hero-spotlight-copy.hero-spotlight-copy--overlay .hero-spotlight-heading-topline {
  display: block !important;
  font-size: inherit !important;
}

body.home-breakpoints-page.home-page--de .hero-spotlight-copy.hero-spotlight-copy--overlay .hero-spotlight-heading-rest {
  display: block !important;
  margin-top: 2px !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  color: #15b865 !important;
}

@media (max-width: 767px) {
  body.home-breakpoints-page.home-page--de .hero-spotlight-support-visual--map {
    display: none !important;
  }

  body.home-breakpoints-page.home-page--de .hero-spotlight-copy--overlay {
    position: static !important;
    max-width: none !important;
    padding: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
    border-radius: 0 !important;
  }

  body.home-breakpoints-page.home-page--de .hero-spotlight-copy--overlay h1 {
    font-size: clamp(28px, 7vw, 36px) !important;
    font-weight: 900 !important;
  }

  body.home-breakpoints-page.home-page--de .hero-spotlight-copy--overlay .hero-spotlight-heading-rest {
    margin-top: 8px !important;
    font-size: clamp(14px, 4vw, 17px) !important;
  }
}

body.home-breakpoints-page.home-page--de .hero-gallery--de-spotlight .hero-gallery-viewport {
  overflow: hidden;
  background: transparent;
  isolation: isolate;
  transform: translateZ(0);
}

body.home-breakpoints-page.home-page--de .hero-gallery--de-spotlight .hero-gallery-track {
  background: transparent;
  backface-visibility: hidden;
  transform-style: flat;
}

body.home-breakpoints-page.home-page--de .hero-gallery--de-spotlight .hero-gallery-slide {
  flex: 0 0 100%;
  min-width: 100%;
  overflow: hidden;
  background: transparent;
}

body.home-breakpoints-page.home-page--de .hero-spotlight-gallery-card {
  grid-template-rows: minmax(0, 1fr) auto;
}

body.home-breakpoints-page.home-page--de .hero-spotlight-gallery-card:not(.hero-spotlight-gallery-card--image-only) {
  align-content: stretch;
}

body.home-breakpoints-page.home-page--de .hero-spotlight-gallery-media {
  min-height: 0;
  display: grid;
  place-items: center;
}

body.home-breakpoints-page.home-page--de .hero-spotlight-gallery-image--placeholder {
  object-fit: contain;
}

body.home-breakpoints-page.home-page--de .hero-spotlight-gallery-image {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100% !important;
  max-width: 100%;
  max-height: 100%;
  object-position: center;
}

body.home-breakpoints-page.home-page--de .hero-spotlight-gallery-card--image-only .hero-spotlight-gallery-media {
  min-height: 0;
}

body.home-breakpoints-page.home-page--de .hero-spotlight-gallery-copy {
  position: relative;
  z-index: 1;
  background: inherit;
  border-top: 1px solid rgba(255, 255, 255, 0.16);
}

body.home-breakpoints-page.home-page--de .hero-spotlight-gallery-copy::before {
  display: none;
}

body.home-breakpoints-page.home-page--de .hero-spotlight-gallery-card--cyan.hero-spotlight-gallery-card--image-only {
  background: #eef1f5;
}

body.home-breakpoints-page.home-page--de .hero-spotlight-gallery-card--mint.hero-spotlight-gallery-card--image-only {
  background: #eef1f5;
}

body.home-breakpoints-page.home-page--de .hero-spotlight-gallery-card {
  grid-template-rows: 1fr;
  background: #eef1f5;
}

body.home-breakpoints-page.home-page--de .hero-spotlight-gallery-card.hero-spotlight-gallery-card--placeholder {
  background: #eef1f5;
}

body.home-breakpoints-page.home-page--de .hero-gallery--de-spotlight .hero-gallery-slide.has-test-image,
body.home-breakpoints-page.home-page--de .hero-spotlight-gallery-card.has-test-image,
body.home-breakpoints-page.home-page--de .hero-spotlight-gallery-card.hero-spotlight-gallery-card--placeholder.has-test-image {
  background: transparent;
}

body.home-breakpoints-page.home-page--de .hero-spotlight-gallery-media {
  min-height: 100%;
  background: #eef1f5;
}

body.home-breakpoints-page.home-page--de .hero-spotlight-gallery-media::before {
  display: none;
}

body.home-breakpoints-page.home-page--de .hero-spotlight-gallery-image,
body.home-breakpoints-page.home-page--de .hero-spotlight-gallery-copy {
  display: none !important;
}

body.home-breakpoints-page.home-page--de .hero-spotlight-gallery-media.has-test-image {
  background: transparent;
}

body.home-breakpoints-page.home-page--de .hero-gallery-test-image {
  position: absolute;
  inset: 0;
  z-index: 1;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center;
  pointer-events: none;
}

body.home-breakpoints-page.home-page--de .hero-gallery-upload-input {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
  pointer-events: none;
}

body.home-breakpoints-page.home-page--de .hero-gallery-upload-button {
  position: absolute;
  top: 12px;
  right: 12px;
  z-index: 3;
  width: 42px;
  height: 42px;
  border: 1px solid rgba(203, 213, 225, 0.92);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.94);
  color: #111827;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  box-shadow: 0 8px 20px rgba(15, 23, 42, 0.08);
  transition: transform 0.18s ease, box-shadow 0.18s ease, background-color 0.18s ease;
}

body.home-breakpoints-page.home-page--de .hero-gallery-upload-button:hover,
body.home-breakpoints-page.home-page--de .hero-gallery-upload-button:focus-visible {
  background: #ffffff;
  box-shadow: 0 10px 24px rgba(15, 23, 42, 0.14);
  transform: translateY(-1px);
}

body.home-breakpoints-page.home-page--de .hero-gallery-upload-button .material-icons-round {
  font-size: 21px;
}

@media (max-width: 767px) {
  body.home-breakpoints-page.home-page--de .hero-gallery-upload-button {
    top: 10px;
    right: 10px;
    width: 38px;
    height: 38px;
  }

  body.home-breakpoints-page.home-page--de .hero-gallery-upload-button .material-icons-round {
    font-size: 20px;
  }
}

@media (min-width: 980px) {
  body.home-breakpoints-page.home-page .hero {
    display: grid;
    grid-template-columns: minmax(0, 1fr) clamp(440px, 36vw, 490px);
    gap: clamp(24px, 3.8vw, 52px);
  }

  body.home-breakpoints-page.home-page .hero-left,
  body.home-breakpoints-page.home-page .hero-right {
    min-width: 0;
  }

  body.home-breakpoints-page.home-page .hero-right {
    width: auto;
  }
}

@media (min-width: 768px) and (max-width: 979px) {
  body.home-breakpoints-page.home-page--de .hero-spotlight-support-visual--carousel,
  body.home-breakpoints-page.home-page--de .hero-gallery--de-spotlight {
    width: min(100%, 680px);
    max-width: 680px;
  }

  body.home-breakpoints-page.home-page--de .hero-gallery--de-spotlight {
    aspect-ratio: auto;
  }
}

@media (max-width: 767px) {
  body.home-breakpoints-page.home-page .hero-left {
    padding-inline: 12px;
  }

  body.home-breakpoints-page.home-page--de .hero-spotlight-support-visual--carousel,
  body.home-breakpoints-page.home-page--de .hero-gallery--de-spotlight {
    width: 100%;
    max-width: none;
  }

  body.home-breakpoints-page.home-page--de .hero-gallery--de-spotlight {
    aspect-ratio: auto;
  }
}

@media (max-width: 979px) {
  body.home-breakpoints-page.home-page--de .hero-gallery--de-spotlight {
    display: flex;
    flex-direction: column;
    gap: 12px;
    height: auto;
    min-height: 0;
  }

  body.home-breakpoints-page.home-page--de .hero-gallery--de-spotlight .hero-gallery-viewport {
    flex: 0 0 auto;
    width: 100%;
    height: auto;
    aspect-ratio: 4 / 3;
  }

  body.home-breakpoints-page.home-page--de .hero-gallery--de-spotlight .hero-gallery-footer--de {
    position: static;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0;
    padding: 0;
  }

  body.home-breakpoints-page.home-page--de .hero-gallery--de-spotlight .hero-gallery-controls--de-below {
    width: auto;
    justify-content: center;
    gap: 0;
    padding: 0;
  }

  body.home-breakpoints-page.home-page--de .hero-gallery--de-spotlight .hero-gallery-status--de {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    gap: 11px;
    min-width: 0;
    padding: 8px 12px;
    border: 1px solid rgba(219, 226, 235, 0.9);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.94);
    box-shadow: 0 10px 24px rgba(15, 23, 42, 0.08);
  }

  body.home-breakpoints-page.home-page--de .hero-gallery--de-spotlight .hero-gallery-counter--de {
    gap: 4px;
    font-size: 12px;
    letter-spacing: 0.055em;
  }

  body.home-breakpoints-page.home-page--de .hero-gallery--de-spotlight .hero-gallery-dots--pill {
    width: 116px;
    gap: 6px;
  }

  body.home-breakpoints-page.home-page--de .hero-gallery--de-spotlight .hero-gallery-dot,
  body.home-breakpoints-page.home-page--de .hero-gallery--de-spotlight .hero-gallery-dot.is-active {
    width: 100%;
    height: 5px;
  }

  body.home-breakpoints-page.home-page--de .hero-gallery--de-spotlight .hero-gallery-navs--de-below {
    display: none;
  }
}

@media (min-width: 768px) and (max-width: 979px) {
  body.home-breakpoints-page.home-page--de .hero-gallery--de-spotlight {
    gap: 14px;
  }

  body.home-breakpoints-page.home-page--de .hero-gallery--de-spotlight .hero-gallery-status--de {
    gap: 13px;
    padding: 9px 14px;
  }

  body.home-breakpoints-page.home-page--de .hero-gallery--de-spotlight .hero-gallery-dots--pill {
    width: 148px;
  }
}

@media (max-width: 979px) {
  body.home-breakpoints-page.home-page .hero-spotlight {
    align-items: flex-start;
  }

  body.home-breakpoints-page.home-page .hero-spotlight-copy {
    align-items: flex-start;
    text-align: left;
  }

  body.home-breakpoints-page.home-page .hero-spotlight-heading-mobile-legacy {
    display: none !important;
  }

  body.home-breakpoints-page.home-page .hero-spotlight-copy h1 > .hero-spotlight-heading-topline {
    display: inline-flex;
    flex-direction: row;
    align-items: baseline;
    justify-content: flex-start;
    gap: 0.16em;
    width: max-content;
    max-width: 100%;
    margin-inline: 0;
    line-height: 0.96;
    white-space: nowrap;
  }

  body.home-breakpoints-page.home-page .hero-spotlight-copy h1 > .hero-spotlight-heading-rest {
    display: block;
    width: max-content;
    max-width: 100%;
    margin-inline: 0;
    line-height: 0.96;
    white-space: nowrap;
  }

  body.home-breakpoints-page.home-page .hero-spotlight-copy h1 {
    width: 100%;
    max-width: min(100%, 13.8ch);
    gap: 0.02em;
    margin-inline: 0;
    font-size: clamp(42px, 9vw, 64px);
    line-height: 0.92;
    letter-spacing: -0.056em;
    text-align: left;
    text-wrap: balance;
  }

  body.home-breakpoints-page.home-page .hero-spotlight-heading-topline,
  body.home-breakpoints-page.home-page .hero-spotlight-heading-rest {
    font-size: 0.9em;
    letter-spacing: inherit;
  }

  body.home-breakpoints-page.home-page .hero-spotlight-rotating-word {
    display: inline-block;
    width: auto;
    min-width: 0;
    max-width: none;
    height: auto;
    overflow: visible;
    -webkit-clip-path: none;
    clip-path: none;
    font-size: 1em;
    font-weight: inherit;
    letter-spacing: inherit;
    line-height: inherit;
    text-align: inherit;
    vertical-align: baseline;
  }

  body.home-breakpoints-page.home-page .hero-spotlight-rotating-word-item {
    position: absolute;
    inset: 0 auto auto 0;
    grid-area: auto;
    line-height: inherit;
  }

  body.home-breakpoints-page.home-page .hero-spotlight-accent {
    width: 100%;
    margin-inline: 0;
    font-size: clamp(23px, 4.9vw, 34px);
    line-height: 1.04;
    letter-spacing: -0.034em;
    text-align: left;
  }
}

@media (max-width: 767px) {
  body.home-breakpoints-page.home-page .hero-spotlight-copy h1 {
    max-width: min(100%, 12.4ch);
    font-size: clamp(43px, 12.4vw, 56px);
  }

  body.home-breakpoints-page.home-page .hero-spotlight-heading-topline,
  body.home-breakpoints-page.home-page .hero-spotlight-heading-rest {
    font-size: 0.82em;
  }

  body.home-breakpoints-page.home-page .hero-spotlight-accent {
    font-size: clamp(23px, 6.2vw, 28px);
  }
}

@media (max-width: 399px) {
  body.home-breakpoints-page.home-page .hero-spotlight-copy h1 {
    font-size: clamp(39px, 11.4vw, 43px);
  }

  body.home-breakpoints-page.home-page .hero-spotlight-heading-topline,
  body.home-breakpoints-page.home-page .hero-spotlight-heading-rest {
    font-size: 0.8em;
  }
}

@media (max-width: 767px) {
  body.home-breakpoints-page.home-page .home-features-heading {
    margin-bottom: 12px;
  }

  body.home-breakpoints-page.home-page .home-features-heading h2 {
    font-size: 31px;
    line-height: 1;
    letter-spacing: -0.045em;
  }

  body.home-breakpoints-page.home-page .home-features-heading p {
    margin-top: 6px;
    font-size: 14px;
  }

  body.home-breakpoints-page.home-page .home-feature-card {
    grid-template-columns: 76px minmax(0, 1fr);
    min-height: 116px;
    padding: 15px 16px 15px 12px;
    border-radius: 20px;
  }

  body.home-breakpoints-page.home-page .home-feature-icon {
    width: 76px;
    height: 76px;
  }

  body.home-breakpoints-page.home-page .home-feature-copy {
    padding: 0 30px 0 0;
  }

  body.home-breakpoints-page.home-page .home-feature-card h3 {
    font-size: 18px;
    line-height: 1.1;
  }

  body.home-breakpoints-page.home-page .home-feature-card p {
    font-size: 13.2px;
    line-height: 1.38;
  }
}

@media (max-width: 479px) {
  body.home-breakpoints-page.home-page .home-feature-card {
    grid-template-columns: 66px minmax(0, 1fr);
    min-height: 104px;
    padding: 13px 13px 13px 11px;
    gap: 11px;
    border-radius: 18px;
  }

  body.home-breakpoints-page.home-page .home-feature-icon {
    width: 66px;
    height: 66px;
  }

  body.home-breakpoints-page.home-page .home-feature-copy {
    gap: 5px;
    padding-right: 24px;
  }

  body.home-breakpoints-page.home-page .home-feature-card h3 {
    font-size: 16px;
  }

  body.home-breakpoints-page.home-page .home-feature-card p {
    font-size: 12px;
    line-height: 1.34;
  }
}

/* Home benefits compact visual refresh */
body.home-breakpoints-page.home-page .home-features--visual {
  max-width: 1300px;
  margin-top: clamp(24px, 3.4vw, 40px);
}

body.home-breakpoints-page.home-page .home-features--visual .home-features-heading {
  display: block;
  margin-bottom: 18px;
  text-align: center;
}

body.home-breakpoints-page.home-page .home-features--visual .home-features-heading h2 {
  max-width: 560px;
  margin-left: auto;
  margin-right: auto;
}

body.home-breakpoints-page.home-page .home-features--visual .home-features-heading p {
  max-width: 320px;
  margin-top: 8px;
  padding-bottom: 0;
  text-align: left;
}

body.home-breakpoints-page.home-page .home-features--visual .home-features-grid {
  gap: 14px;
  align-items: stretch;
}

body.home-breakpoints-page.home-page .home-features--visual .home-feature-card {
  min-height: 176px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 14px;
  padding: 20px 20px 22px;
  border-radius: 20px;
  background: #ffffff;
  border-color: #e5eaf1;
  box-shadow: 0 8px 22px rgba(15, 23, 42, 0.025);
}

body.home-breakpoints-page.home-page .home-features--visual .home-feature-card::before {
  display: none;
}

body.home-breakpoints-page.home-page .home-features--visual .home-feature-card::after {
  display: none;
}

body.home-breakpoints-page.home-page .home-features--visual .home-feature-card:hover {
  transform: translateY(-3px);
  border-color: #d8e0ea;
  box-shadow: 0 16px 30px rgba(15, 23, 42, 0.065);
}

body.home-breakpoints-page.home-page .home-features--visual .home-feature-icon {
  width: 82px;
  height: 82px;
  align-self: flex-start;
  justify-self: auto;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 18px;
  background: color-mix(in srgb, var(--feature-accent) 7%, #ffffff);
  overflow: visible;
}

body.home-breakpoints-page.home-page .home-features--visual .home-feature-icon img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  transform: scale(1.16);
  filter: drop-shadow(0 10px 12px rgba(15, 23, 42, 0.1));
}

body.home-breakpoints-page.home-page .home-features--visual .home-feature-card--green .home-feature-icon img {
  transform: scale(1.22);
}

body.home-breakpoints-page.home-page .home-features--visual .home-feature-card--orange .home-feature-icon img {
  transform: scale(1.08);
}

body.home-breakpoints-page.home-page .home-features--visual .home-feature-card--blue .home-feature-icon img {
  transform: scale(1.22);
}

body.home-breakpoints-page.home-page .home-features--visual .home-feature-card--purple .home-feature-icon img {
  transform: scale(1.22);
}

body.home-breakpoints-page.home-page .home-features--visual .home-feature-card:hover .home-feature-icon {
  transform: none;
}

body.home-breakpoints-page.home-page .home-features--visual .home-feature-card:hover .home-feature-icon img {
  filter: drop-shadow(0 12px 14px rgba(15, 23, 42, 0.12));
}

body.home-breakpoints-page.home-page .home-features--visual .home-feature-copy {
  min-width: 0;
  min-height: 0;
  width: 100%;
  padding: 0;
  gap: 7px;
  justify-content: center;
  align-items: flex-start;
  text-align: left;
}

body.home-breakpoints-page.home-page .home-features--visual .home-feature-card h3 {
  font-size: clamp(18px, 1.22vw, 21px);
  line-height: 1.08;
  letter-spacing: -0.03em;
}

body.home-breakpoints-page.home-page .home-features--visual .home-feature-card p {
  font-size: 13.6px;
  line-height: 1.38;
}

@media (max-width: 1100px) {
  body.home-breakpoints-page.home-page .home-features--visual .home-features-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  body.home-breakpoints-page.home-page .home-features--visual .home-feature-card {
    min-height: 138px;
  }

  body.home-breakpoints-page.home-page .home-features--visual .home-feature-icon {
    width: 80px;
    height: 80px;
  }
}

@media (max-width: 767px) {
  body.home-breakpoints-page.home-page .home-features--visual {
    margin-top: 20px;
  }

  body.home-breakpoints-page.home-page .home-features--visual .home-features-heading {
    display: block;
    margin-bottom: 16px;
  }

  body.home-breakpoints-page.home-page .home-features--visual .home-features-heading p {
    max-width: none;
    margin-top: 6px;
    padding-bottom: 0;
    text-align: left;
  }

  body.home-breakpoints-page.home-page .home-features--visual .home-features-grid {
    grid-template-columns: 1fr;
    gap: 10px;
  }

  body.home-breakpoints-page.home-page .home-features--visual .home-feature-card {
    display: grid;
    grid-template-columns: 78px minmax(0, 1fr);
    min-height: 104px;
    gap: 14px;
    padding: 13px 16px 13px 13px;
    border-radius: 18px;
    align-items: center;
  }

  body.home-breakpoints-page.home-page .home-features--visual .home-feature-card::before {
    display: none;
  }

  body.home-breakpoints-page.home-page .home-features--visual .home-feature-icon {
    width: 72px;
    height: 72px;
    min-height: 0;
    border-radius: 14px;
    align-self: center;
  }

  body.home-breakpoints-page.home-page .home-features--visual .home-feature-icon img,
  body.home-breakpoints-page.home-page .home-features--visual .home-feature-card--green .home-feature-icon img,
  body.home-breakpoints-page.home-page .home-features--visual .home-feature-card--orange .home-feature-icon img,
  body.home-breakpoints-page.home-page .home-features--visual .home-feature-card--blue .home-feature-icon img,
  body.home-breakpoints-page.home-page .home-features--visual .home-feature-card--purple .home-feature-icon img {
    transform: scale(1.18);
  }

  body.home-breakpoints-page.home-page .home-features--visual .home-feature-card--orange .home-feature-icon img {
    transform: scale(1.06);
  }

  body.home-breakpoints-page.home-page .home-features--visual .home-feature-copy {
    padding: 0 12px 0 0;
    justify-content: center;
    align-items: flex-start;
    text-align: left;
    gap: 5px;
  }

  body.home-breakpoints-page.home-page .home-features--visual .home-feature-card h3 {
    font-size: 17px;
  }

  body.home-breakpoints-page.home-page .home-features--visual .home-feature-card p {
    font-size: 12.8px;
    line-height: 1.34;
  }
}

@media (max-width: 479px) {
  body.home-breakpoints-page.home-page .home-features--visual .home-feature-card {
    grid-template-columns: 70px minmax(0, 1fr);
    min-height: 98px;
    gap: 12px;
    padding: 12px 13px 12px 12px;
    border-radius: 17px;
  }

  body.home-breakpoints-page.home-page .home-features--visual .home-feature-icon {
    width: 66px;
    height: 66px;
    min-height: 0;
    border-radius: 13px;
  }

  body.home-breakpoints-page.home-page .home-features--visual .home-feature-icon img,
  body.home-breakpoints-page.home-page .home-features--visual .home-feature-card--green .home-feature-icon img,
  body.home-breakpoints-page.home-page .home-features--visual .home-feature-card--blue .home-feature-icon img,
  body.home-breakpoints-page.home-page .home-features--visual .home-feature-card--purple .home-feature-icon img {
    transform: scale(1.2);
  }

  body.home-breakpoints-page.home-page .home-features--visual .home-feature-card--orange .home-feature-icon img {
    transform: scale(1.08);
  }

  body.home-breakpoints-page.home-page .home-features--visual .home-feature-copy {
    padding-right: 2px;
    gap: 5px;
  }

  body.home-breakpoints-page.home-page .home-features--visual .home-feature-card h3 {
    font-size: 16.2px;
  }

  body.home-breakpoints-page.home-page .home-features--visual .home-feature-card p {
    font-size: 12px;
    line-height: 1.32;
  }
}

/* Keep the two mobile quick-action cards visually separated across all mobile widths. */
@media (max-width: 767px) {
  body.home-breakpoints-page.home-page .home-quick-actions {
    padding-left: 18px !important;
    padding-right: 18px !important;
  }

  body.home-breakpoints-page.home-page .home-quick-actions-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: clamp(14px, 3.6vw, 18px) !important;
  }

  body.home-breakpoints-page.home-page .home-action-card {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    min-height: 0 !important;
    box-sizing: border-box;
    aspect-ratio: 1.26;
    padding: clamp(16px, 3.6vw, 18px) clamp(15px, 3.4vw, 18px) 12px !important;
    border: 1px solid rgba(226, 232, 240, 0.52) !important;
    border-radius: 18px !important;
    box-shadow: 0 14px 26px rgba(15, 23, 42, 0.045) !important;
    overflow: hidden;
  }

  body.home-breakpoints-page.home-page .home-action-card-top {
    min-width: 0;
    width: fit-content !important;
    max-width: calc(100% - 2px) !important;
    gap: 3px !important;
  }

  body.home-breakpoints-page.home-page .home-action-card-top h2 {
    max-width: 9.7ch !important;
    font-size: clamp(19px, 4.8vw, 22px) !important;
    line-height: 1.05 !important;
    letter-spacing: -0.02em !important;
  }

  body.home-breakpoints-page.home-page .home-action-card-arrow {
    align-self: flex-end !important;
    flex: 0 0 auto !important;
    width: auto !important;
    height: auto !important;
    margin: 0 0 3px !important;
    border-radius: 0 !important;
    background: transparent !important;
    color: #111111 !important;
    font-size: 19px !important;
    line-height: 1 !important;
  }

  body.home-breakpoints-page.home-page .home-action-card-track .home-action-card-media {
    right: 12px !important;
    bottom: 15px !important;
    width: clamp(92px, 21vw, 102px) !important;
    height: clamp(66px, 15.5vw, 73px) !important;
  }

  body.home-breakpoints-page.home-page .home-action-card-order .home-action-card-media {
    right: 12px !important;
    bottom: 17px !important;
    width: clamp(90px, 20vw, 100px) !important;
    height: clamp(65px, 15vw, 72px) !important;
  }
}

@media (min-width: 480px) and (max-width: 767px) {
  body.home-breakpoints-page.home-page .home-quick-actions {
    padding-left: 14px !important;
    padding-right: 14px !important;
  }
}

@media (max-width: 479px) {
  body.home-breakpoints-page.home-page .home-business-teaser {
    padding-left: 18px !important;
    padding-right: 18px !important;
  }
}

@media (max-width: 374px) {
  body.home-breakpoints-page.home-page .home-quick-actions {
    padding-left: 14px !important;
    padding-right: 14px !important;
  }

  body.home-breakpoints-page.home-page .home-quick-actions-grid {
    gap: 10px !important;
  }

  body.home-breakpoints-page.home-page .home-action-card {
    padding: 15px 14px 10px !important;
    border-radius: 18px !important;
  }

  body.home-breakpoints-page.home-page .home-action-card-top h2 {
    font-size: 18px !important;
  }

  body.home-breakpoints-page.home-page .home-action-card-media {
    height: 66px !important;
  }

  body.home-breakpoints-page.home-page .home-action-card-track .home-action-card-media {
    width: 94px !important;
  }

  body.home-breakpoints-page.home-page .home-action-card-order .home-action-card-media {
    width: 92px !important;
  }

  body.home-breakpoints-page.home-page .home-business-teaser {
    padding-left: 14px !important;
    padding-right: 14px !important;
  }
}

/* Mobile content width: align every content section with "Beliebte Dienstleistungen"; keep the order panel untouched. */
@media (max-width: 767px) {
  body.home-breakpoints-page.home-page {
    --home-mobile-content-inset: 18px;
  }

  body.home-breakpoints-page.home-page .hero-left {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  body.home-breakpoints-page.home-page .home-service-catalog,
  body.home-breakpoints-page.home-page .home-features,
  body.home-breakpoints-page.home-page .home-features--visual,
  body.home-breakpoints-page.home-page .home-savings,
  body.home-breakpoints-page.home-page .home-quick-actions,
  body.home-breakpoints-page.home-page .flex-stories,
  body.home-breakpoints-page.home-page .home-business-teaser,
  body.home-breakpoints-page.home-page .home-faq,
  body.home-breakpoints-page.home-page .home-mail-panel,
  body.home-breakpoints-page.home-page .popular-services,
  body.home-breakpoints-page.home-page .home-service-links,
  body.home-breakpoints-page.home-page .home-services-showcase,
  body.home-breakpoints-page.home-page .delivery-categories {
    padding-left: var(--home-mobile-content-inset) !important;
    padding-right: var(--home-mobile-content-inset) !important;
  }
}

/* Tablet quick-order loaders card: keep the mobile row layout without the extra vertical air. */
@media (min-width: 768px) and (max-width: 1024px) {
  body.home-breakpoints-page.home-page #quickOrderWidget .loaders-card {
    display: grid !important;
    grid-template-columns: 56px minmax(0, 1fr) 150px !important;
    align-items: center !important;
    min-height: 84px !important;
    padding: 10px !important;
    gap: 8px 12px !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .loader-img,
  body.home-breakpoints-page.home-page #quickOrderWidget .loader-img--main {
    grid-column: 1 !important;
    grid-row: 1 !important;
    width: 54px !important;
    height: 43px !important;
    align-self: center !important;
    justify-self: center !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .loader-text {
    grid-column: 2 !important;
    grid-row: 1 !important;
    min-width: 0 !important;
    width: auto !important;
    gap: 3px !important;
    align-self: center !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget #loadersTextLine1 {
    font-size: 15px !important;
    line-height: 1.08 !important;
    letter-spacing: -0.02em !important;
    white-space: nowrap !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget #loadersTextLine2 {
    max-width: none !important;
    font-size: 12.8px !important;
    line-height: 1.16 !important;
    letter-spacing: -0.012em !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .counter-box {
    grid-column: 3 !important;
    grid-row: 1 !important;
    display: grid !important;
    grid-template-columns: 38px minmax(38px, 1fr) 38px !important;
    align-items: center !important;
    width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 4px !important;
    gap: 3px !important;
    border-radius: 17px !important;
    align-self: center !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .counter-box button,
  body.home-breakpoints-page.home-page #quickOrderWidget .counter-btn {
    width: 38px !important;
    height: 40px !important;
    border-radius: 13px !important;
    font-size: 21px !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .counter-texts > span {
    font-size: 10px !important;
    line-height: 1 !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .counter-texts strong,
  body.home-breakpoints-page.home-page #quickOrderWidget #loaderCountVal {
    font-size: 16px !important;
    line-height: 1 !important;
  }
}

/* Narrow desktop quick-order loaders card: keep the 1440-style row while giving the copy more room. */
@media (min-width: 901px) and (max-width: 1100px) {
  body.home-breakpoints-page.home-page #quickOrderWidget .loaders-card {
    display: grid !important;
    grid-template-columns: 54px minmax(0, 1fr) 128px !important;
    min-height: 78px !important;
    padding: 8px 10px !important;
    gap: 8px !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .loader-img,
  body.home-breakpoints-page.home-page #quickOrderWidget .loader-img--main {
    grid-column: 1 !important;
    grid-row: 1 !important;
    width: 54px !important;
    height: 43px !important;
    align-self: center !important;
    justify-self: center !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .loader-text {
    grid-column: 2 !important;
    grid-row: 1 !important;
    min-width: 0 !important;
    width: auto !important;
    align-self: center !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget #loadersTextLine1 {
    font-size: 15px !important;
    line-height: 1.08 !important;
    white-space: nowrap !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget #loadersTextLine2 {
    max-width: none !important;
    font-size: 12.8px !important;
    line-height: 1.16 !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .counter-box {
    grid-column: 3 !important;
    grid-row: 1 !important;
    display: grid !important;
    grid-template-columns: 34px minmax(34px, 1fr) 34px !important;
    align-items: center !important;
    width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 4px !important;
    gap: 3px !important;
    border-radius: 17px !important;
    align-self: center !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .counter-box button,
  body.home-breakpoints-page.home-page #quickOrderWidget .counter-btn {
    width: 34px !important;
    height: 40px !important;
    border-radius: 13px !important;
    font-size: 21px !important;
  }
}

/* Narrow large-desktop quick-order loaders card: avoid the awkward text squeeze before the panel reaches its full width. */
@media (min-width: 1101px) and (max-width: 1359px) {
  body.home-breakpoints-page.home-page #quickOrderWidget .loaders-card {
    display: grid !important;
    grid-template-columns: 56px minmax(0, 1fr) 136px !important;
    align-items: center !important;
    min-height: 84px !important;
    padding: 10px !important;
    gap: 8px 10px !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .loader-img,
  body.home-breakpoints-page.home-page #quickOrderWidget .loader-img--main {
    grid-column: 1 !important;
    grid-row: 1 !important;
    width: 54px !important;
    height: 43px !important;
    align-self: center !important;
    justify-self: center !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .loader-text {
    grid-column: 2 !important;
    grid-row: 1 !important;
    min-width: 0 !important;
    width: auto !important;
    gap: 3px !important;
    align-self: center !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget #loadersTextLine1 {
    font-size: 15px !important;
    line-height: 1.08 !important;
    letter-spacing: -0.02em !important;
    white-space: nowrap !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget #loadersTextLine2 {
    max-width: none !important;
    font-size: 12.8px !important;
    line-height: 1.16 !important;
    letter-spacing: -0.012em !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .counter-box {
    grid-column: 3 !important;
    grid-row: 1 !important;
    display: grid !important;
    grid-template-columns: 36px minmax(34px, 1fr) 36px !important;
    align-items: center !important;
    width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 4px !important;
    gap: 3px !important;
    border-radius: 17px !important;
    align-self: center !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .counter-box button,
  body.home-breakpoints-page.home-page #quickOrderWidget .counter-btn {
    width: 36px !important;
    height: 40px !important;
    border-radius: 13px !important;
    font-size: 21px !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .counter-texts > span {
    font-size: 10px !important;
    line-height: 1 !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .counter-texts strong,
  body.home-breakpoints-page.home-page #quickOrderWidget #loaderCountVal {
    font-size: 16px !important;
    line-height: 1 !important;
  }
}

/* Narrow desktop business teaser: keep the two CTAs polished inside the tighter copy column. */
@media (min-width: 901px) and (max-width: 1100px) {
  body.home-breakpoints-page.home-page .home-business-teaser-actions {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    width: 100% !important;
    max-width: 392px !important;
    gap: 10px !important;
    margin-top: 18px !important;
  }

  body.home-breakpoints-page.home-page .home-business-teaser-button {
    min-width: 0 !important;
    min-height: 50px !important;
    padding: 0 15px 0 22px !important;
    gap: 12px !important;
    border-radius: 999px !important;
    font-size: 15px !important;
    font-weight: 800 !important;
    line-height: 0.98 !important;
  }

  body.home-breakpoints-page.home-page .home-business-teaser-button > span:first-child {
    max-width: 8.5ch !important;
    text-wrap: balance !important;
  }

  body.home-breakpoints-page.home-page .home-business-teaser-button .material-icons-round {
    flex: 0 0 auto !important;
    margin-left: auto !important;
    font-size: 21px !important;
  }
}

/* Tablet business teaser: keep the split card intact and stop CTAs from running into the image. */
@media (min-width: 768px) and (max-width: 900px) {
  body.home-breakpoints-page.home-page .home-business-teaser {
    padding-left: 16px !important;
    padding-right: 16px !important;
  }

  body.home-breakpoints-page.home-page .home-business-teaser-shell {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
    min-height: 300px !important;
    border-radius: 24px !important;
    overflow: hidden !important;
  }

  body.home-breakpoints-page.home-page .home-business-teaser-copy {
    min-width: 0 !important;
    padding: 28px 22px 26px 30px !important;
    justify-content: center !important;
  }

  body.home-breakpoints-page.home-page .home-business-teaser h2 {
    max-width: 12ch !important;
    font-size: clamp(30px, 4.45vw, 36px) !important;
    line-height: 1.02 !important;
  }

  body.home-breakpoints-page.home-page .home-business-teaser p {
    max-width: 31ch !important;
    margin-top: 14px !important;
    font-size: 15px !important;
    line-height: 1.28 !important;
  }

  body.home-breakpoints-page.home-page .home-business-teaser-actions {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    width: 100% !important;
    max-width: 100% !important;
    gap: 8px !important;
    margin-top: 18px !important;
    overflow: hidden !important;
  }

  body.home-breakpoints-page.home-page .home-business-teaser-button {
    min-width: 0 !important;
    min-height: 48px !important;
    padding: 0 12px 0 16px !important;
    gap: 8px !important;
    border-radius: 999px !important;
    font-size: 14px !important;
    font-weight: 800 !important;
    line-height: 0.98 !important;
  }

  body.home-breakpoints-page.home-page .home-business-teaser-button > span:first-child {
    max-width: 8ch !important;
    text-wrap: balance !important;
  }

  body.home-breakpoints-page.home-page .home-business-teaser-button .material-icons-round {
    flex: 0 0 auto !important;
    margin-left: auto !important;
    font-size: 20px !important;
  }

  body.home-breakpoints-page.home-page .home-business-teaser-media {
    min-height: 300px !important;
    border-radius: 0 !important;
  }
}

/* Compact business teaser: lead with the three portraits, then copy and stacked actions. */
@media (max-width: 860px) {
  body.home-breakpoints-page.home-page .home-business-teaser-shell {
    display: flex !important;
    flex-direction: column !important;
    min-height: 0 !important;
    padding: 0 !important;
  }

  body.home-breakpoints-page.home-page .home-business-teaser-copy {
    order: 2 !important;
    padding: 0 20px 20px !important;
  }

  body.home-breakpoints-page.home-page .home-business-teaser-media {
    order: 1 !important;
    width: min(100%, 500px) !important;
    margin: 0 auto !important;
    min-height: 0 !important;
    height: auto !important;
    aspect-ratio: var(--placeholder-image-aspect, 1672 / 941) !important;
  }

  body.home-breakpoints-page.home-page .home-business-teaser-image,
  body.home-breakpoints-page.home-page .home-business-teaser-media .hero-placeholder-upload-image {
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
    object-position: center !important;
    transform: translateX(-2.1%) !important;
  }
}

/* Mobile quick-order loaders card: keep image, copy and controls in one polished row. */
@media (max-width: 767px) {
  body.home-breakpoints-page.home-page #quickOrderWidget .loader-image-drop-controls,
  body.home-breakpoints-page.home-page #quickOrderWidget .loader-image-drop-hint {
    display: none !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .loaders-card[data-loader-image-drop]::after {
    opacity: 0 !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .loaders-card {
    display: grid !important;
    grid-template-columns: 46px minmax(0, 1fr) clamp(122px, 30vw, 132px) !important;
    align-items: center !important;
    min-height: 84px !important;
    padding: 9px 8px !important;
    gap: 6px !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .loader-img,
  body.home-breakpoints-page.home-page #quickOrderWidget .loader-img--main {
    grid-column: 1 !important;
    grid-row: 1 !important;
    width: 46px !important;
    height: 38px !important;
    align-self: center !important;
    justify-self: center !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .loader-text {
    grid-column: 2 !important;
    grid-row: 1 !important;
    min-width: 0 !important;
    width: auto !important;
    gap: 3px !important;
    align-self: center !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget #loadersTextLine1 {
    font-size: 14.8px !important;
    line-height: 1.08 !important;
    letter-spacing: -0.02em !important;
    white-space: nowrap !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget #loadersTextLine2 {
    max-width: none !important;
    font-size: 12.2px !important;
    line-height: 1.18 !important;
    letter-spacing: -0.012em !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .counter-box {
    grid-column: 3 !important;
    grid-row: 1 !important;
    display: grid !important;
    grid-template-columns: 38px minmax(30px, 1fr) 38px !important;
    align-items: center !important;
    width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 4px !important;
    gap: 3px !important;
    min-height: 48px !important;
    border: 0 !important;
    border-radius: 16px !important;
    background: var(--home-bg-control, #f4f5f7) !important;
    box-shadow: none !important;
    align-self: center !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .counter-box button,
  body.home-breakpoints-page.home-page #quickOrderWidget .counter-btn {
    width: 38px !important;
    height: 40px !important;
    border: 0 !important;
    border-radius: 13px !important;
    font-size: 18px !important;
    font-weight: 500 !important;
    line-height: 1 !important;
    background: #ffffff !important;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.06) !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .counter-texts > span {
    font-size: 10px !important;
    line-height: 1 !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .counter-texts strong,
  body.home-breakpoints-page.home-page #quickOrderWidget #loaderCountVal {
    font-size: 16px !important;
    line-height: 1 !important;
  }
}

@media (max-width: 374px) {
  body.home-breakpoints-page.home-page #quickOrderWidget .loaders-card {
    grid-template-columns: 44px minmax(0, 1fr) 112px !important;
    min-height: 80px !important;
    padding: 8px !important;
    gap: 6px !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .loader-img,
  body.home-breakpoints-page.home-page #quickOrderWidget .loader-img--main {
    width: 44px !important;
    height: 36px !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget #loadersTextLine1 {
    font-size: 13.8px !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget #loadersTextLine2 {
    max-width: none !important;
    font-size: 11.7px !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .counter-box {
    grid-template-columns: 32px minmax(32px, 1fr) 32px !important;
    border-radius: 16px !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .counter-box button,
  body.home-breakpoints-page.home-page #quickOrderWidget .counter-btn {
    width: 32px !important;
    height: 38px !important;
    border-radius: 12px !important;
  }
}

/* Mobile quick-order option/time cards: compact height after the inline loaders row. */
@media (max-width: 767px) {
  body.home-breakpoints-page.home-page #quickOrderWidget .two-col-row {
    gap: 10px !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .options-card,
  body.home-breakpoints-page.home-page #quickOrderWidget .time-card {
    flex: 1 1 0 !important;
    min-width: 0 !important;
    min-height: 72px !important;
    padding: 10px 12px !important;
    border-radius: 18px !important;
    align-items: center !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .options-card {
    grid-template-columns: minmax(0, 1fr) 38px !important;
    gap: 8px !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .options-card > span:first-child {
    font-size: 0 !important;
    line-height: 1 !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .options-card > span:first-child::after {
    content: var(--home-mobile-options-label) !important;
    display: block !important;
    font-size: 16px !important;
    line-height: 1 !important;
    letter-spacing: -0.02em !important;
    font-weight: 900 !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .options-control-shell {
    width: 38px !important;
    min-width: 38px !important;
    height: 38px !important;
    padding: 3px !important;
    border-radius: 12px !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .options-icon {
    width: 32px !important;
    height: 32px !important;
    border-radius: 10px !important;
    font-size: 18px !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .time-card {
    grid-template-columns: minmax(0, 1fr) auto !important;
    gap: 8px !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .time-info {
    min-height: 0 !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .time-card .label {
    margin-bottom: 3px !important;
    font-size: 0 !important;
    line-height: 1 !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .time-card .label::after {
    content: var(--home-mobile-time-label) !important;
    display: block !important;
    font-size: 9.2px !important;
    line-height: 1 !important;
    letter-spacing: 0.025em !important;
    font-weight: 800 !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .time-info #rentalTimeText {
    font-size: 19px !important;
    line-height: 1 !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .vert-controls {
    height: 46px !important;
    padding: 3px !important;
    gap: 3px !important;
    border-radius: 15px !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .vert-controls button {
    width: 34px !important;
    height: 40px !important;
    min-height: 40px !important;
    border-radius: 12px !important;
    font-size: 18px !important;
  }
}

@media (max-width: 374px) {
  body.home-breakpoints-page.home-page #quickOrderWidget .options-card,
  body.home-breakpoints-page.home-page #quickOrderWidget .time-card {
    min-height: 68px !important;
    padding: 9px 10px !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .options-card > span:first-child {
    font-size: 0 !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .options-card > span:first-child::after {
    font-size: 14.8px !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .time-info #rentalTimeText {
    font-size: 17px !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .vert-controls button {
    width: 32px !important;
    height: 38px !important;
    min-height: 38px !important;
  }
}

/* Tutu-style benefits cards with story overlay. */
body.home-breakpoints-page.home-page .home-features--stories {
  max-width: 1300px !important;
  margin: clamp(54px, 5.6vw, 76px) auto 0 !important;
  padding: 0 5% !important;
}

body.home-breakpoints-page.home-page .home-features--stories .home-features-heading {
  display: block !important;
  margin: 0 0 30px !important;
  text-align: left !important;
}

body.home-breakpoints-page.home-page .home-features--stories .home-features-heading h2 {
  max-width: none !important;
  margin: 0 !important;
  color: #171b2b !important;
  font-size: clamp(38px, 2.8vw, 44px) !important;
  font-weight: 900 !important;
  line-height: 1.02 !important;
  letter-spacing: -0.035em !important;
  text-transform: none !important;
}

body.home-breakpoints-page.home-page .home-features--stories .home-features-grid {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 24px !important;
  align-items: stretch !important;
}

body.home-breakpoints-page.home-page .home-features--stories .home-feature-card {
  appearance: none;
  position: relative;
  min-height: 250px !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  justify-content: flex-start !important;
  padding: 26px 26px 24px !important;
  border: 0 !important;
  border-radius: 18px !important;
  background: #eef8f1 !important;
  color: #171b2b;
  cursor: pointer;
  overflow: hidden;
  box-shadow: none !important;
  text-align: left;
  -webkit-tap-highlight-color: transparent;
  transition: background-color 0.18s ease !important;
}

body.home-breakpoints-page.home-page .home-features--stories .home-feature-card:hover,
body.home-breakpoints-page.home-page .home-features--stories .home-feature-card:focus-visible {
  transform: none !important;
  background: #e6f2ea !important;
  box-shadow: none !important;
}

body.home-breakpoints-page.home-page .home-features--stories .home-feature-card::before,
body.home-breakpoints-page.home-page .home-features--stories .home-feature-card::after {
  display: none !important;
  content: none !important;
}

body.home-breakpoints-page.home-page .home-features--stories .home-feature-copy {
  position: relative;
  z-index: 2;
  display: block !important;
  width: auto !important;
  max-width: 27ch;
  padding: 0 !important;
}

body.home-breakpoints-page.home-page .home-features--stories .home-feature-title {
  display: block;
  color: #171b2b;
  font-size: clamp(22px, 1.35vw, 25px);
  font-weight: 900;
  line-height: 1.08;
  letter-spacing: -0.028em;
}

body.home-breakpoints-page.home-page .home-features--stories .home-feature-text {
  display: block;
  margin-top: 7px;
  color: #586079;
  font-size: clamp(15px, 0.98vw, 18px);
  font-weight: 650;
  line-height: 1.33;
  letter-spacing: -0.02em;
}

body.home-breakpoints-page.home-page .home-features--stories .home-feature-story-icon {
  position: absolute;
  right: 25px;
  bottom: 25px;
  z-index: 1;
  width: 78px !important;
  height: 78px !important;
  display: block;
  object-fit: contain;
  opacity: 1;
  transform: none;
}

body.home-breakpoints-page.home-page .home-features--stories .home-feature-card[data-home-feature-image-drop-ready="true"] .home-feature-story-icon {
  cursor: grab !important;
  user-select: none !important;
  -webkit-user-drag: none !important;
  transform: translate3d(var(--home-feature-image-x, 0px), var(--home-feature-image-y, 0px), 0) scale(var(--home-feature-image-scale, 1)) !important;
  transform-origin: center !important;
  transition: transform 0.16s ease, filter 0.16s ease !important;
  will-change: transform !important;
}

body.home-breakpoints-page.home-page .home-features--stories .home-feature-card.is-home-feature-image-moving .home-feature-story-icon {
  cursor: grabbing !important;
  filter: drop-shadow(0 12px 18px rgba(15, 23, 42, 0.16)) !important;
}

body.home-breakpoints-page.home-page .home-feature-image-input {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

body.home-breakpoints-page.home-page .home-feature-image-drop-hint {
  position: absolute !important;
  z-index: 5 !important;
  right: 18px !important;
  bottom: 112px !important;
  display: inline-flex !important;
  align-items: center !important;
  min-height: 30px !important;
  padding: 0 11px !important;
  border: 1px solid rgba(0, 184, 64, 0.28) !important;
  border-radius: 999px !important;
  background: rgba(255, 255, 255, 0.96) !important;
  color: #087c3a !important;
  font-size: 12px !important;
  font-weight: 820 !important;
  line-height: 1 !important;
  opacity: 0 !important;
  pointer-events: none !important;
  box-shadow: 0 10px 22px rgba(15, 23, 42, 0.12) !important;
  transform: translateY(5px) !important;
  transition: opacity 0.18s ease, transform 0.18s ease !important;
}

body.home-breakpoints-page.home-page .home-features--stories .home-feature-card.is-home-feature-image-over .home-feature-image-drop-hint,
body.home-breakpoints-page.home-page.is-home-feature-image-dragging .home-features--stories .home-feature-card[data-home-feature-image-drop-ready="true"] .home-feature-image-drop-hint {
  opacity: 1 !important;
  transform: translateY(0) !important;
}

body.home-breakpoints-page.home-page .home-feature-image-controls,
body.home-breakpoints-page.home-page .home-feature-image-export-controls {
  display: none !important;
}

body.home-breakpoints-page.home-page .home-features--stories .home-feature-card[data-home-feature-image-drop-ready="true"] .home-feature-image-controls {
  position: absolute !important;
  z-index: 6 !important;
  right: auto !important;
  bottom: 12px !important;
  left: 12px !important;
  display: flex !important;
  max-width: calc(100% - 24px) !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 5px !important;
  padding: 5px !important;
  border: 1px solid rgba(203, 213, 225, 0.9) !important;
  border-radius: 999px !important;
  background: rgba(255, 255, 255, 0.96) !important;
  box-shadow: 0 14px 30px rgba(15, 23, 42, 0.13) !important;
  opacity: 0 !important;
  pointer-events: none !important;
  transform: translateY(-5px) !important;
  transition: opacity 0.18s ease, transform 0.18s ease !important;
}

body.home-breakpoints-page.home-page .home-features--stories .home-feature-card:hover .home-feature-image-controls,
body.home-breakpoints-page.home-page .home-features--stories .home-feature-card:focus-within .home-feature-image-controls,
body.home-breakpoints-page.home-page .home-features--stories .home-feature-card.is-home-feature-image-moving .home-feature-image-controls {
  opacity: 1 !important;
  pointer-events: auto !important;
  transform: translateY(0) !important;
}

body.home-breakpoints-page.home-page .home-feature-image-controls button,
body.home-breakpoints-page.home-page .home-feature-image-export-controls button {
  width: 31px !important;
  min-width: 31px !important;
  height: 31px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: #f3f5f8 !important;
  color: #111827 !important;
  font: inherit !important;
  font-size: 13px !important;
  font-weight: 850 !important;
  line-height: 1 !important;
  box-shadow: none !important;
}

body.home-breakpoints-page.home-page .home-feature-image-controls button:hover,
body.home-breakpoints-page.home-page .home-feature-image-controls button:focus-visible,
body.home-breakpoints-page.home-page .home-feature-image-export-controls button:hover,
body.home-breakpoints-page.home-page .home-feature-image-export-controls button:focus-visible {
  background: #eafcf0 !important;
  color: #087c3a !important;
  outline: none !important;
}

body.home-breakpoints-page.home-page .home-feature-image-controls button.home-feature-image-control-secondary,
body.home-breakpoints-page.home-page .home-feature-image-export-controls button {
  width: auto !important;
  min-width: 44px !important;
  padding: 0 10px !important;
}

body.home-breakpoints-page.home-page .home-features--stories .home-feature-image-export-controls {
  display: flex !important;
  justify-content: flex-end !important;
  margin-top: 12px !important;
  opacity: 0 !important;
  pointer-events: none !important;
  transition: opacity 0.18s ease !important;
}

body.home-breakpoints-page.home-page .home-features--stories:hover .home-feature-image-export-controls,
body.home-breakpoints-page.home-page .home-features--stories:focus-within .home-feature-image-export-controls {
  opacity: 1 !important;
  pointer-events: auto !important;
}

@media (max-width: 767px) {
  body.home-breakpoints-page.home-page .home-features--stories .home-feature-card[data-home-feature-image-drop-ready="true"] .home-feature-image-controls {
    bottom: 8px !important;
    left: 8px !important;
    max-width: calc(100% - 16px) !important;
    gap: 3px !important;
    padding: 4px !important;
  }

  body.home-breakpoints-page.home-page .home-feature-image-controls button,
  body.home-breakpoints-page.home-page .home-feature-image-export-controls button {
    width: 28px !important;
    min-width: 28px !important;
    height: 28px !important;
    font-size: 11px !important;
  }

  body.home-breakpoints-page.home-page .home-feature-image-controls button.home-feature-image-control-secondary {
    min-width: 36px !important;
    padding: 0 7px !important;
  }
}

body.home-breakpoints-page.home-page .home-features--stories .home-feature-card--green {
  --feature-accent: #7767ff;
}

body.home-breakpoints-page.home-page .home-features--stories .home-feature-card--orange {
  --feature-accent: #ff7d2d;
}

body.home-breakpoints-page.home-page .home-features--stories .home-feature-card--blue {
  --feature-accent: #7767ff;
}

body.home-breakpoints-page.home-page .home-features--stories .home-feature-card--purple {
  --feature-accent: #ff7d2d;
}

html.home-feature-story-scroll-locked,
html.home-feature-story-scroll-locked body,
body.home-feature-story-open {
  overflow: hidden !important;
  overscroll-behavior: none !important;
}

body.home-feature-story-scroll-locked {
  position: fixed !important;
  top: var(--home-feature-story-scroll-top, 0) !important;
  left: 0 !important;
  right: 0 !important;
  width: 100% !important;
}

.home-feature-story[hidden] {
  display: none !important;
}

.home-feature-story {
  --feature-story-duration: 7200ms;
  position: fixed;
  inset: 0;
  z-index: 20000;
  display: grid;
  place-items: center;
  padding: 28px;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.22s ease;
  user-select: none;
  -webkit-user-select: none;
  -webkit-touch-callout: none;
}

.home-feature-story.is-open {
  opacity: 1;
  pointer-events: auto;
}

.home-feature-story-backdrop {
  position: absolute;
  inset: 0;
  border: 0;
  background: rgba(11, 14, 24, 0.58);
  backdrop-filter: blur(16px);
  cursor: default;
}

.home-feature-story-dialog {
  position: relative;
  width: min(430px, calc(100vw - 42px));
  height: min(760px, calc(100svh - 56px));
  min-height: 560px;
  border-radius: 10px;
  background: #eaf2ff;
  overflow: hidden;
  box-shadow: 0 28px 90px rgba(0, 0, 0, 0.38);
  transform: translateY(12px) scale(0.985);
  transition: transform 0.24s ease;
}

.home-feature-story-dialog::before {
  content: "";
  position: absolute;
  inset: 0 0 auto;
  z-index: 5;
  height: 118px;
  pointer-events: none;
  background: linear-gradient(180deg, rgba(9, 12, 22, 0.34) 0%, rgba(9, 12, 22, 0.18) 45%, rgba(9, 12, 22, 0) 100%);
}

.home-feature-story.is-open .home-feature-story-dialog {
  transform: none;
}

.home-feature-story-bars {
  position: absolute;
  top: 10px;
  left: 10px;
  right: 10px;
  z-index: 6;
  display: flex !important;
  flex-wrap: nowrap !important;
  gap: 4px;
}

.home-feature-story-bars span {
  flex: 1 1 0;
  min-width: 0;
  height: 3px;
  border-radius: 999px;
  background: rgba(15, 23, 42, 0.28);
  box-shadow:
    0 0 0 1px rgba(15, 23, 42, 0.16),
    0 1px 5px rgba(15, 23, 42, 0.2);
  overflow: hidden;
}

.home-feature-story-bars i {
  display: block;
  width: 0;
  height: 100%;
  border-radius: inherit;
  background: #ffffff;
  box-shadow: 0 0 0 1px rgba(15, 23, 42, 0.08);
}

.home-feature-story-bars span.is-complete i {
  width: 100%;
}

.home-feature-story-bars span.is-active i {
  animation: flexlastFeatureStoryFill var(--feature-story-duration) linear forwards;
}

.home-feature-story.is-paused .home-feature-story-bars span.is-active i {
  animation-play-state: paused;
}

@keyframes flexlastFeatureStoryFill {
  from {
    width: 0;
  }
  to {
    width: 100%;
  }
}

.home-feature-story-control,
.home-feature-story-arrow {
  appearance: none;
  border: 0;
  color: #ffffff;
  background: transparent;
  cursor: pointer;
}

.home-feature-story-control {
  position: absolute;
  top: 24px;
  z-index: 7;
  width: 34px;
  height: 34px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  background: rgba(15, 23, 42, 0.28);
  box-shadow: 0 8px 22px rgba(15, 23, 42, 0.16);
  backdrop-filter: blur(8px);
  text-shadow: 0 2px 10px rgba(0, 0, 0, 0.34);
}

.home-feature-story-close {
  right: 18px;
}

.home-feature-story-pause {
  right: 58px;
}

.home-feature-story-control .material-icons-round {
  font-size: 24px;
}

.home-feature-story-arrow {
  position: fixed;
  top: 50%;
  z-index: 7;
  width: 52px;
  height: 52px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  color: rgba(255, 255, 255, 0.66);
  transform: translateY(-50%);
}

.home-feature-story-arrow--prev {
  left: calc(50% - 350px);
}

.home-feature-story-arrow--next {
  right: calc(50% - 350px);
}

.home-feature-story-arrow .material-icons-round {
  font-size: 34px;
}

.home-feature-story-slide {
  position: absolute;
  inset: 0;
  display: grid;
  grid-template-rows: minmax(0, 1fr) auto;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.22s ease;
}

.home-feature-story-slide.is-active {
  opacity: 1;
  pointer-events: auto;
}

.home-feature-story-media {
  min-height: 0;
  overflow: hidden;
  border-bottom-left-radius: 50% 8%;
  border-bottom-right-radius: 50% 8%;
}

.home-feature-story-media img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  object-position: center;
}

.home-feature-story-copy {
  padding: 26px 58px 52px;
  background: #eaf2ff;
}

.home-feature-story-copy h3 {
  margin: 0;
  color: #171b2b;
  font-size: clamp(26px, 2vw, 34px);
  font-weight: 900;
  line-height: 1.05;
  letter-spacing: -0.035em;
}

.home-feature-story-copy p {
  margin: 12px 0 0;
  color: #171b2b;
  font-size: 16px;
  font-weight: 650;
  line-height: 1.35;
  letter-spacing: -0.015em;
}

@media (min-width: 1024px) {
  body.home-breakpoints-page.home-page .home-savings-shell {
    grid-template-columns: minmax(360px, 0.52fr) minmax(0, 1fr) !important;
    column-gap: clamp(42px, 3.2vw, 56px) !important;
  }
}

/* Tablet savings: reuse the compact mobile carousel instead of the split copy/list layout. */
@media (min-width: 768px) and (max-width: 1023px) {
  body.home-breakpoints-page.home-page .home-savings {
    margin-top: 34px !important;
    padding: 0 18px !important;
  }

  body.home-breakpoints-page.home-page .home-savings-shell {
    position: relative !important;
    display: block !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    overflow: visible !important;
  }

  body.home-breakpoints-page.home-page .home-savings-copy {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    margin: -1px !important;
    padding: 0 !important;
    overflow: hidden !important;
    clip: rect(0 0 0 0) !important;
    clip-path: inset(50%) !important;
    white-space: nowrap !important;
  }

  body.home-breakpoints-page.home-page .home-savings-mobile-heading {
    display: block !important;
    margin: 0 0 14px !important;
    padding-left: 0 !important;
    color: #111827 !important;
    font-size: 22px !important;
    font-weight: 900 !important;
    line-height: 1.08 !important;
    letter-spacing: 0 !important;
  }

  body.home-breakpoints-page.home-page .home-savings-viewport {
    position: static !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    border-radius: 18px !important;
  }

  body.home-breakpoints-page.home-page .home-savings-list {
    --home-savings-track-x: 0px;
    display: flex !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    gap: 12px !important;
    justify-content: flex-start !important;
    overflow: visible !important;
    overflow-x: visible !important;
    overflow-y: visible !important;
    overscroll-behavior: auto !important;
    scroll-padding-inline: 0 !important;
    scroll-snap-type: none !important;
    -webkit-overflow-scrolling: auto !important;
    scrollbar-width: none !important;
    cursor: grab !important;
    touch-action: pan-y pinch-zoom !important;
    user-select: none !important;
    will-change: transform !important;
    transform: translate3d(var(--home-savings-track-x), 0, 0) !important;
    transition: transform 0.3s ease-out !important;
  }

  body.home-breakpoints-page.home-page .home-savings-list.is-dragging,
  body.home-breakpoints-page.home-page .home-savings-list.is-jump-reset {
    transition: none !important;
  }

  body.home-breakpoints-page.home-page .home-savings-list.is-dragging {
    cursor: grabbing !important;
  }

  body.home-breakpoints-page.home-page .home-savings-list.is-dragging .home-savings-card,
  body.home-breakpoints-page.home-page .home-savings-card[data-savings-clone="true"] {
    pointer-events: none !important;
  }

  body.home-breakpoints-page.home-page .home-savings-card {
    flex: 0 0 100% !important;
    display: grid !important;
    grid-template-columns: minmax(0, 52.5%) minmax(148px, 47.5%) !important;
    grid-template-rows: minmax(0, 1fr) auto !important;
    grid-template-areas:
      "copy media"
      "value media" !important;
    align-items: stretch !important;
    gap: 0 !important;
    height: 132px !important;
    min-height: 132px !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 18px !important;
    background: #f3f4f8 !important;
    box-shadow: none !important;
    scroll-snap-align: center !important;
    overflow: hidden !important;
    user-select: none !important;
    -webkit-user-drag: none !important;
  }

  body.home-breakpoints-page.home-page .home-savings-card:hover,
  body.home-breakpoints-page.home-page .home-savings-card:focus-visible {
    transform: none !important;
    box-shadow: none !important;
  }

  body.home-breakpoints-page.home-page .home-savings-card-copy {
    grid-area: copy !important;
    display: grid !important;
    align-content: start !important;
    gap: 4px !important;
    padding: 16px 8px 0 17px !important;
  }

  body.home-breakpoints-page.home-page .home-savings-card-title {
    color: #161b2b !important;
    font-size: 15px !important;
    font-weight: 900 !important;
    line-height: 1.14 !important;
    letter-spacing: 0 !important;
  }

  body.home-breakpoints-page.home-page .home-savings-card-text {
    max-width: 18ch !important;
    color: #626b82 !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    line-height: 1.34 !important;
    letter-spacing: 0 !important;
  }

  body.home-breakpoints-page.home-page .home-savings-card--cashback .home-savings-card-text {
    max-width: none !important;
    white-space: nowrap !important;
  }

  body.home-breakpoints-page.home-page .home-savings-card-media {
    grid-area: media !important;
    align-self: stretch !important;
    width: 100% !important;
    height: 100% !important;
    aspect-ratio: auto !important;
    border-radius: 18px !important;
    background: #e9edf3 !important;
    overflow: hidden !important;
  }

  body.home-breakpoints-page.home-page .home-savings-card-media img {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center !important;
    transform: scale(1.02) !important;
    user-select: none !important;
    -webkit-user-drag: none !important;
  }

  body.home-breakpoints-page.home-page .home-savings-card-value {
    grid-area: value !important;
    align-self: end !important;
    justify-self: start !important;
    min-height: 35px !important;
    margin: 0 0 14px 17px !important;
    padding: 0 14px !important;
    border: 0 !important;
    border-radius: 8px !important;
    background: #087c3a !important;
    color: #ffffff !important;
    font-size: 0 !important;
    font-weight: 900 !important;
    line-height: 1 !important;
    letter-spacing: 0 !important;
    box-shadow: none !important;
  }

  body.home-breakpoints-page.home-page .home-savings-card-value::before {
    content: attr(data-mobile-label) !important;
    font-size: 14px !important;
  }

  body.home-breakpoints-page.home-page .home-savings-card-value::after {
    content: none !important;
  }

  body.home-breakpoints-page.home-page .home-savings-nav {
    position: absolute !important;
    top: 50% !important;
    z-index: 8 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 32px !important;
    height: 32px !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 50% !important;
    background: #ffffff !important;
    color: #161b2b !important;
    cursor: pointer !important;
    box-shadow: 0 8px 22px rgba(15, 23, 42, 0.11) !important;
    transform: translateY(-50%) !important;
    touch-action: manipulation !important;
  }

  body.home-breakpoints-page.home-page .home-savings-nav--prev {
    left: -16px !important;
  }

  body.home-breakpoints-page.home-page .home-savings-nav--next {
    right: -16px !important;
  }

  @media (min-width: 768px) {
    body.home-breakpoints-page.home-page .home-savings-card {
      grid-template-columns: minmax(0, 1fr) minmax(260px, 320px) !important;
      height: clamp(148px, 18vw, 176px) !important;
      min-height: clamp(148px, 18vw, 176px) !important;
    }

    body.home-breakpoints-page.home-page .home-savings-card-media {
      justify-self: end !important;
      max-width: 320px !important;
    }

    body.home-breakpoints-page.home-page .home-savings-card-media img {
      object-fit: cover !important;
      object-position: center top !important;
      transform: none !important;
    }

    body.home-breakpoints-page.home-page .home-savings-nav--prev {
      left: -16px !important;
    }

    body.home-breakpoints-page.home-page .home-savings-nav--next {
      right: -16px !important;
    }

    body.home-breakpoints-page.home-page .home-savings-nav {
      width: 44px !important;
      height: 44px !important;
      background: rgba(255, 255, 255, 0.98) !important;
      border: 1px solid rgba(226, 232, 240, 0.9) !important;
      box-shadow: 0 14px 34px rgba(15, 23, 42, 0.13) !important;
    }

    body.home-breakpoints-page.home-page .home-savings-nav .material-icons-round {
      font-size: 30px !important;
      font-weight: 900 !important;
    }
  }

  body.home-breakpoints-page.home-page .home-savings-nav .material-icons-round {
    font-size: 23px !important;
    line-height: 1 !important;
  }

  body.home-breakpoints-page.home-page .home-savings-mobile-dots {
    display: none !important;
  }
}

/* Tablet savings visual pass: use the same white rounded panel language as the business teaser. */
@media (min-width: 768px) and (max-width: 1023px) {
  body.home-breakpoints-page.home-page .home-savings-viewport {
    border-radius: 24px !important;
  }

  body.home-breakpoints-page.home-page .home-savings-card,
  body.home-breakpoints-page.home-page .home-savings-card:hover,
  body.home-breakpoints-page.home-page .home-savings-card:focus-visible {
    border: 1px solid #e5e7eb !important;
    border-radius: 24px !important;
    background: #ffffff !important;
    box-shadow: 0 18px 42px rgba(15, 23, 42, 0.05) !important;
    transform: none !important;
  }

  body.home-breakpoints-page.home-page .home-savings-card-media {
    border-radius: 22px !important;
    background: transparent !important;
  }

  body.home-breakpoints-page.home-page .home-savings-nav {
    top: calc(100% - clamp(74px, 9vw, 88px)) !important;
    border: 1px solid rgba(226, 232, 240, 0.9) !important;
    transform: translateY(-50%) !important;
  }
}

@media (max-width: 900px) {
  body.home-breakpoints-page.home-page .home-features--stories .home-features-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  body.home-breakpoints-page.home-page .home-features--stories .home-feature-card {
    min-height: clamp(334px, 56vw, 504px) !important;
  }

  .home-feature-story-arrow--prev {
    left: 18px;
  }

  .home-feature-story-arrow--next {
    right: 18px;
  }
}

@media (min-width: 768px) and (max-width: 900px) {
  body.home-breakpoints-page.home-page .home-features--stories {
    margin-top: 44px !important;
    padding: 0 18px !important;
  }

  body.home-breakpoints-page.home-page .home-features--stories .home-features-heading {
    margin-bottom: 20px !important;
  }

  body.home-breakpoints-page.home-page .home-features--stories .home-features-heading h2 {
    font-size: clamp(28px, 4.2vw, 34px) !important;
    line-height: 1.05 !important;
  }

  body.home-breakpoints-page.home-page .home-features--stories .home-features-grid {
    gap: 10px !important;
  }

  body.home-breakpoints-page.home-page .home-features--stories .home-feature-card {
    min-height: clamp(232px, 31vw, 252px) !important;
    padding: 18px 16px 16px !important;
    border-radius: 15px !important;
  }

  body.home-breakpoints-page.home-page .home-features--stories .home-feature-title {
    font-size: clamp(17px, 2.4vw, 20px) !important;
    line-height: 1.1 !important;
  }

  body.home-breakpoints-page.home-page .home-features--stories .home-feature-text {
    max-width: 25ch !important;
    font-size: clamp(13px, 1.85vw, 15px) !important;
    line-height: 1.34 !important;
  }

  body.home-breakpoints-page.home-page .home-features--stories .home-feature-story-icon {
    right: 18px !important;
    bottom: 18px !important;
    width: clamp(62px, 9.5vw, 74px) !important;
    height: clamp(62px, 9.5vw, 74px) !important;
  }
}

@media (max-width: 767px) {
  body.home-breakpoints-page.home-page .home-features--stories {
    margin-top: 46px !important;
    padding: 0 18px !important;
  }

  body.home-breakpoints-page.home-page .home-features--stories .home-features-heading {
    margin-bottom: 20px !important;
  }

  body.home-breakpoints-page.home-page .home-features--stories .home-features-heading h2 {
    font-size: clamp(25px, 6vw, 30px) !important;
    line-height: 1.05 !important;
  }

  body.home-breakpoints-page.home-page .home-features--stories .home-features-grid {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 9px 8px !important;
    margin: 0;
    padding: 0;
    overflow: visible;
  }

  body.home-breakpoints-page.home-page .home-features--stories .home-feature-card {
    min-height: clamp(232px, 54vw, 252px) !important;
    padding: 18px 14px 16px !important;
    border-radius: 15px !important;
  }

  body.home-breakpoints-page.home-page .home-features--stories .home-feature-title {
    font-size: clamp(15.5px, 3.55vw, 17.5px);
    line-height: 1.1;
  }

  body.home-breakpoints-page.home-page .home-features--stories .home-feature-text {
    max-width: none;
    font-size: clamp(12.5px, 3vw, 13.8px);
    line-height: 1.35;
  }

  body.home-breakpoints-page.home-page .home-features--stories .home-feature-story-icon {
    right: 18px;
    bottom: 18px;
    width: clamp(62px, 15.5vw, 74px) !important;
    height: clamp(62px, 15.5vw, 74px) !important;
  }

  .home-feature-story {
    padding: 14px;
  }

  .home-feature-story-dialog {
    width: min(430px, calc(100vw - 28px));
    height: min(720px, calc(100svh - 28px));
    min-height: 0;
    border-radius: 12px;
  }

  .home-feature-story-copy {
    padding: 24px 34px 42px;
  }

  .home-feature-story-copy h3 {
    font-size: 30px;
  }

  .home-feature-story-copy p {
    font-size: 16px;
  }

  .home-feature-story-arrow {
    position: absolute;
    top: 50%;
    z-index: 7;
    width: 44px;
    height: 44px;
    display: inline-flex;
    color: #ffffff;
    background: rgba(15, 23, 42, 0.26);
    box-shadow: 0 10px 28px rgba(15, 23, 42, 0.18);
    backdrop-filter: blur(8px);
  }

  .home-feature-story-arrow--prev {
    left: 14px;
  }

  .home-feature-story-arrow--next {
    right: 14px;
  }

  .home-feature-story-arrow .material-icons-round {
    font-size: 30px;
  }
}

@media (max-width: 374px) {
  body.home-breakpoints-page.home-page .home-features--stories {
    padding: 0 16px !important;
  }

  body.home-breakpoints-page.home-page .home-features--stories .home-feature-card {
    min-height: 218px !important;
    padding: 16px 13px 15px !important;
  }

  body.home-breakpoints-page.home-page .home-features--stories .home-feature-title {
    font-size: 15px;
  }

  body.home-breakpoints-page.home-page .home-features--stories .home-feature-text {
    font-size: 12px;
  }

  body.home-breakpoints-page.home-page .home-features--stories .home-feature-story-icon {
    right: 15px;
    bottom: 15px;
    width: 58px !important;
    height: 58px !important;
  }

  .home-feature-story-copy {
    padding: 22px 26px 34px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .home-feature-story,
  .home-feature-story-dialog,
  .home-feature-story-slide,
  body.home-breakpoints-page.home-page .home-features--stories .home-feature-card {
    transition: none !important;
  }

  .home-feature-story-bars span.is-active i {
    animation: none !important;
    width: 100%;
  }
}

/* Lower information section. */
body.home-breakpoints-page.home-page .home-info-panels {
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: 1300px !important;
  margin: clamp(24px, 2.2vw, 34px) auto 0 !important;
  padding: 0 5% !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

body.home-breakpoints-page.home-page .home-info-panels-shell {
  box-sizing: border-box !important;
  width: 100% !important;
  padding: clamp(28px, 2.2vw, 38px) clamp(30px, 3vw, 44px) clamp(30px, 2.5vw, 42px) !important;
  border: 1px solid #dfe6ee !important;
  border-radius: 28px !important;
  background: #fff !important;
  box-shadow: 0 24px 58px rgba(15, 23, 42, 0.055) !important;
}

body.home-breakpoints-page.home-page .home-info-panels h2 {
  max-width: none !important;
  margin: 0 0 26px !important;
  color: #171b2b !important;
  font-size: clamp(32px, 2.25vw, 44px) !important;
  font-weight: 900 !important;
  line-height: 1.04 !important;
  letter-spacing: -0.035em !important;
  text-align: left !important;
  text-wrap: balance;
}

body.home-breakpoints-page.home-page .home-info-panels-grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: clamp(30px, 3.2vw, 50px) !important;
}

body.home-breakpoints-page.home-page .home-info-panel {
  position: relative !important;
  min-height: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: flex-start !important;
  padding: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: #171b2b !important;
  overflow: visible !important;
}

body.home-breakpoints-page.home-page .home-info-panel:last-child {
  border-bottom: 0 !important;
  padding-bottom: 0 !important;
}

body.home-breakpoints-page.home-page .home-info-panel-icon {
  width: clamp(126px, 8.8vw, 154px) !important;
  height: clamp(88px, 6.3vw, 108px) !important;
  display: block !important;
  object-fit: contain !important;
  transform: translate3d(var(--home-info-image-x, 0px), var(--home-info-image-y, 0px), 0) scale(var(--home-info-image-scale, 0.92)) !important;
  transform-origin: center !important;
  transition: transform 0.16s ease, filter 0.16s ease !important;
  will-change: transform !important;
}

body.home-breakpoints-page.home-page .home-info-panel[data-home-info-panel-image-drop-ready="true"] .home-info-panel-icon {
  cursor: grab !important;
  user-select: none !important;
  -webkit-user-drag: none !important;
}

body.home-breakpoints-page.home-page .home-info-panel.is-home-info-image-moving .home-info-panel-icon {
  cursor: grabbing !important;
  filter: drop-shadow(0 12px 18px rgba(15, 23, 42, 0.16)) !important;
}

body.home-breakpoints-page.home-page .home-info-image-input {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

body.home-breakpoints-page.home-page .home-info-image-drop-hint {
  position: absolute !important;
  z-index: 5 !important;
  top: 42px !important;
  left: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  min-height: 30px !important;
  padding: 0 11px !important;
  border: 1px solid rgba(0, 184, 64, 0.28) !important;
  border-radius: 999px !important;
  background: rgba(255, 255, 255, 0.96) !important;
  color: #087c3a !important;
  font-size: 12px !important;
  font-weight: 820 !important;
  line-height: 1 !important;
  opacity: 0 !important;
  pointer-events: none !important;
  box-shadow: 0 10px 22px rgba(15, 23, 42, 0.12) !important;
  transform: translateY(5px) !important;
  transition: opacity 0.18s ease, transform 0.18s ease !important;
}

body.home-breakpoints-page.home-page .home-info-panel.is-home-info-image-over .home-info-image-drop-hint,
body.home-breakpoints-page.home-page.is-home-info-image-dragging .home-info-panel[data-home-info-panel-image-drop-ready="true"] .home-info-image-drop-hint {
  opacity: 1 !important;
  transform: translateY(0) !important;
}

body.home-breakpoints-page.home-page .home-info-image-controls,
body.home-breakpoints-page.home-page .home-info-image-export-controls {
  display: none !important;
}

body.home-breakpoints-page.home-page .home-info-panel[data-home-info-panel-image-drop-ready="true"] .home-info-image-controls {
  position: absolute !important;
  z-index: 6 !important;
  top: -8px !important;
  right: 0 !important;
  display: flex !important;
  align-items: center !important;
  gap: 5px !important;
  padding: 5px !important;
  border: 1px solid rgba(203, 213, 225, 0.9) !important;
  border-radius: 999px !important;
  background: rgba(255, 255, 255, 0.96) !important;
  box-shadow: 0 14px 30px rgba(15, 23, 42, 0.13) !important;
  opacity: 0 !important;
  pointer-events: none !important;
  transform: translateY(-5px) !important;
  transition: opacity 0.18s ease, transform 0.18s ease !important;
}

body.home-breakpoints-page.home-page .home-info-panel:hover .home-info-image-controls,
body.home-breakpoints-page.home-page .home-info-panel:focus-within .home-info-image-controls,
body.home-breakpoints-page.home-page .home-info-panel.is-home-info-image-moving .home-info-image-controls {
  opacity: 1 !important;
  pointer-events: auto !important;
  transform: translateY(0) !important;
}

body.home-breakpoints-page.home-page .home-info-image-controls button,
body.home-breakpoints-page.home-page .home-info-image-export-controls button {
  width: 31px !important;
  min-width: 31px !important;
  height: 31px !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: #f3f5f8 !important;
  color: #111827 !important;
  font-size: 13px !important;
  font-weight: 850 !important;
  line-height: 1 !important;
  box-shadow: none !important;
}

body.home-breakpoints-page.home-page .home-info-image-controls button:hover,
body.home-breakpoints-page.home-page .home-info-image-controls button:focus-visible,
body.home-breakpoints-page.home-page .home-info-image-export-controls button:hover,
body.home-breakpoints-page.home-page .home-info-image-export-controls button:focus-visible {
  background: #eafcf0 !important;
  color: #087c3a !important;
  outline: none !important;
}

body.home-breakpoints-page.home-page .home-info-image-controls button.home-info-image-control-secondary,
body.home-breakpoints-page.home-page .home-info-image-export-controls button {
  width: auto !important;
  min-width: 44px !important;
  padding: 0 10px !important;
}

body.home-breakpoints-page.home-page .home-info-panels .home-info-image-export-controls {
  display: flex !important;
  justify-content: flex-end !important;
  margin-top: 12px !important;
  opacity: 0 !important;
  pointer-events: none !important;
  transition: opacity 0.18s ease !important;
}

body.home-breakpoints-page.home-page .home-info-panels:hover .home-info-image-export-controls,
body.home-breakpoints-page.home-page .home-info-panels:focus-within .home-info-image-export-controls {
  opacity: 1 !important;
  pointer-events: auto !important;
}

body.home-breakpoints-page.home-page .home-info-panel p {
  margin: 10px 0 0 !important;
  color: #171b2b !important;
  font-size: clamp(17px, 1.08vw, 21px) !important;
  font-weight: 620 !important;
  line-height: 1.22 !important;
  letter-spacing: -0.02em !important;
}

@media (max-width: 900px) {
  body.home-breakpoints-page.home-page .home-info-panels {
    margin-top: 30px !important;
    width: 100% !important;
    max-width: 1300px !important;
    padding: 0 16px !important;
  }

  body.home-breakpoints-page.home-page .home-info-panels-shell {
    padding: 26px 24px 28px !important;
    border-radius: 28px !important;
  }

  body.home-breakpoints-page.home-page .home-info-panels h2 {
    margin-bottom: 24px !important;
    font-size: clamp(32px, 5.1vw, 44px) !important;
  }

  body.home-breakpoints-page.home-page .home-info-panels-grid {
    grid-template-columns: 1fr !important;
    gap: 18px !important;
  }

  body.home-breakpoints-page.home-page .home-info-panel {
    min-height: 0 !important;
    padding: 0 0 18px !important;
    border-bottom: 1px solid rgba(23, 27, 43, 0.09) !important;
    border-radius: 0 !important;
  }

  body.home-breakpoints-page.home-page .home-info-panel-icon {
    width: 128px !important;
    height: 92px !important;
  }

  body.home-breakpoints-page.home-page .home-info-panel p {
    margin-top: 10px !important;
    font-size: 20px !important;
  }
}

@media (max-width: 767px) {
  body.home-breakpoints-page.home-page .home-info-panels {
    margin-top: 24px !important;
    width: 100% !important;
    padding: 0 18px !important;
  }

  body.home-breakpoints-page.home-page .home-info-panels-shell {
    padding: 24px 22px 26px !important;
    border-radius: 24px !important;
  }

  body.home-breakpoints-page.home-page .home-info-panels h2 {
    margin-bottom: 20px !important;
    font-size: clamp(28px, 7.2vw, 34px) !important;
    line-height: 1.08 !important;
    letter-spacing: -0.04em !important;
  }

  body.home-breakpoints-page.home-page .home-info-panels-grid {
    gap: 16px !important;
  }

  body.home-breakpoints-page.home-page .home-info-panel {
    min-height: 0 !important;
    padding: 0 0 16px !important;
    border-bottom: 1px solid rgba(23, 27, 43, 0.08) !important;
    border-radius: 0 !important;
  }

  body.home-breakpoints-page.home-page .home-info-panel-icon {
    width: 120px !important;
    height: 88px !important;
  }

  body.home-breakpoints-page.home-page .home-info-panel p {
    margin-top: 10px !important;
    font-size: clamp(18px, 4.35vw, 20px) !important;
    line-height: 1.28 !important;
    letter-spacing: -0.03em !important;
  }
}

@media (max-width: 374px) {
  body.home-breakpoints-page.home-page .home-info-panels {
    width: 100% !important;
    padding-left: 18px !important;
    padding-right: 18px !important;
  }

  body.home-breakpoints-page.home-page .home-info-panels-shell {
    padding-left: 20px !important;
    padding-right: 20px !important;
  }

  body.home-breakpoints-page.home-page .home-info-panel {
    padding-bottom: 15px !important;
  }

  body.home-breakpoints-page.home-page .home-info-panel p {
    font-size: 17px !important;
  }
}

/* Shared homepage panel frame: keep FAQ and information panels in the same visual system. */
body.home-breakpoints-page.home-page .home-faq-shell,
body.home-breakpoints-page.home-page .home-info-panels-shell {
  border: 1px solid #dfe6ee !important;
  border-radius: 28px !important;
  background: #ffffff !important;
  box-shadow: 0 24px 58px rgba(15, 23, 42, 0.055) !important;
}

@media (max-width: 900px) {
  body.home-breakpoints-page.home-page .home-faq-shell,
  body.home-breakpoints-page.home-page .home-info-panels-shell {
    border-radius: 24px !important;
  }
}

@media (max-width: 767px) {
  body.home-breakpoints-page.home-page .home-faq-shell,
  body.home-breakpoints-page.home-page .home-info-panels-shell {
    border-radius: 22px !important;
  }
}

/* Final homepage rhythm pass: keep the panels breathing consistently. */
body.home-breakpoints-page.home-page {
  --home-gap-intro: 52px;
  --home-gap-panel: 46px;
  --home-gap-close: 34px;
  --home-gap-related: 20px;
  --home-gap-footer: 50px;
}

body.home-breakpoints-page.home-page .home-service-catalog {
  position: relative !important;
  margin-top: var(--home-gap-intro) !important;
}

body.home-breakpoints-page.home-page .home-service-image-export-controls {
  position: absolute !important;
  top: 50% !important;
  right: 6px !important;
  margin-top: 0 !important;
  transform: translateY(-50%) !important;
  z-index: 5 !important;
}

body.home-breakpoints-page.home-page .home-service-catalog + .home-features,
body.home-breakpoints-page.home-page .home-features + .home-savings,
body.home-breakpoints-page.home-page .home-quick-actions + .home-business-teaser,
body.home-breakpoints-page.home-page .home-business-teaser + .home-faq,
body.home-breakpoints-page.home-page .home-faq + .home-info-panels {
  margin-top: var(--home-gap-panel) !important;
}

body.home-breakpoints-page.home-page .home-savings + .home-quick-actions,
body.home-breakpoints-page.home-page .home-info-panels + .popular-services--transport {
  margin-top: var(--home-gap-related) !important;
}

body.home-breakpoints-page.home-page .popular-services--transport + .site-footer,
body.home-breakpoints-page.home-page .popular-services + .site-footer {
  margin-top: var(--home-gap-footer) !important;
}

body.home-breakpoints-page.home-page .home-service-catalog-head,
body.home-breakpoints-page.home-page .home-features--stories .home-features-heading {
  margin-bottom: 22px !important;
}

body.home-breakpoints-page.home-page .home-info-panels h2,
body.home-breakpoints-page.home-page .popular-services--transport .popular-services-title {
  margin-bottom: 24px !important;
}

@media (min-width: 1024px) {
  body.home-breakpoints-page.home-page {
    --home-gap-intro: 58px;
    --home-gap-panel: 52px;
    --home-gap-close: 38px;
    --home-gap-related: 20px;
    --home-gap-footer: 54px;
  }

  body.home-breakpoints-page.home-page .home-features + .home-savings {
    margin-top: 48px !important;
  }

  body.home-breakpoints-page.home-page .home-savings + .home-quick-actions {
    margin-top: 36px !important;
  }
}

@media (min-width: 768px) and (max-width: 1023px) {
  body.home-breakpoints-page.home-page {
    --home-gap-intro: 40px;
    --home-gap-panel: 34px;
    --home-gap-close: 26px;
    --home-gap-related: 20px;
    --home-gap-footer: 40px;
  }

  body.home-breakpoints-page.home-page .home-features + .home-savings {
    margin-top: 28px !important;
  }

  body.home-breakpoints-page.home-page .home-savings + .home-quick-actions {
    margin-top: 24px !important;
  }

  body.home-breakpoints-page.home-page .home-service-catalog-head,
  body.home-breakpoints-page.home-page .home-features--stories .home-features-heading {
    margin-bottom: 18px !important;
  }

  body.home-breakpoints-page.home-page .home-info-panels h2,
  body.home-breakpoints-page.home-page .popular-services--transport .popular-services-title {
    margin-bottom: 18px !important;
  }
}

@media (max-width: 767px) {
  body.home-breakpoints-page.home-page {
    --home-gap-intro: 30px;
    --home-gap-panel: 28px;
    --home-gap-close: 24px;
    --home-gap-related: 18px;
    --home-gap-footer: 32px;
  }

  body.home-breakpoints-page.home-page .home-service-catalog {
    margin-top: var(--home-gap-intro) !important;
  }

  body.home-breakpoints-page.home-page .home-service-catalog + .home-features {
    margin-top: 26px !important;
  }

  body.home-breakpoints-page.home-page .home-features + .home-savings {
    margin-top: 22px !important;
  }

  body.home-breakpoints-page.home-page .home-savings + .home-quick-actions {
    margin-top: 24px !important;
  }

  body.home-breakpoints-page.home-page .home-quick-actions + .home-business-teaser,
  body.home-breakpoints-page.home-page .home-business-teaser + .home-faq,
  body.home-breakpoints-page.home-page .home-faq + .home-info-panels {
    margin-top: 30px !important;
  }

  body.home-breakpoints-page.home-page .home-service-catalog-head,
  body.home-breakpoints-page.home-page .home-features--stories .home-features-heading {
    margin-bottom: 16px !important;
  }

  body.home-breakpoints-page.home-page .home-info-panels h2,
  body.home-breakpoints-page.home-page .popular-services--transport .popular-services-title {
    margin-bottom: 16px !important;
  }
}

@media (max-width: 374px) {
  body.home-breakpoints-page.home-page {
    --home-gap-intro: 24px;
    --home-gap-panel: 24px;
    --home-gap-close: 20px;
    --home-gap-related: 14px;
    --home-gap-footer: 28px;
  }
}

/* Above-the-fold calm pass: keep booking immediate, but reduce first-screen noise. */
body.home-breakpoints-page.home-page .flexlast-shared-header {
  box-shadow: 0 1px 0 rgba(226, 232, 240, 0.72);
}

body.home-breakpoints-page.home-page .flexlast-shared-header::after,
body.home-breakpoints-page.home-page .flexlast-shared-header .top-bar::after {
  border-bottom-color: rgba(226, 232, 240, 0.7) !important;
}

body.home-breakpoints-page.home-page #quickOrderWidget .widget-top {
  border: 1px solid rgba(15, 23, 42, 0.08) !important;
  box-shadow: 0 -4px 20px rgba(0, 0, 0, 0.02), 0 16px 40px rgba(15, 23, 42, 0.09) !important;
}

body.home-breakpoints-page.home-page #quickOrderWidget .widget-bottom {
  border: 1px solid rgba(15, 23, 42, 0.08) !important;
  box-shadow: 0 -4px 20px rgba(0, 0, 0, 0.03), 0 18px 44px rgba(15, 23, 42, 0.1) !important;
}

body.home-breakpoints-page.home-page #quickOrderWidget .card,
body.home-breakpoints-page.home-page #quickOrderWidget .phone-group,
body.home-breakpoints-page.home-page #quickOrderWidget .radio-card {
  border-color: rgba(226, 232, 240, 0.86) !important;
}

@media (min-width: 980px) {
  :root {
    --flexlast-header-height: 118px;
  }

  body.home-breakpoints-page.home-page {
    padding-top: 96px !important;
  }

  body.home-breakpoints-page.home-page .flexlast-shared-header {
    padding: 8px 0 9px !important;
  }

  body.home-breakpoints-page.home-page .flexlast-shared-header .top-bar {
    margin-bottom: 9px !important;
    padding-bottom: 8px !important;
    color: #667085 !important;
  }

  body.home-breakpoints-page.home-page .flexlast-shared-header .header-audience-button {
    height: 32px !important;
    padding: 0 16px !important;
    border-radius: 14px !important;
    font-size: 13px !important;
  }

  body.home-breakpoints-page.home-page .flexlast-shared-header .header-phone-cta {
    font-size: 10px !important;
    color: #277947 !important;
  }

  body.home-breakpoints-page.home-page .flexlast-shared-header .header-phone-number {
    font-size: 12.5px !important;
    letter-spacing: 0 !important;
  }

  body.home-breakpoints-page.home-page .flexlast-shared-header .header-call-button {
    width: 34px !important;
    height: 34px !important;
    background: #63b956 !important;
  }

  body.home-breakpoints-page.home-page .flexlast-shared-header .main-nav {
    min-height: 42px !important;
  }

  body.home-breakpoints-page.home-page .flexlast-shared-header .nav-links {
    gap: clamp(18px, 2vw, 32px) !important;
    padding-left: clamp(14px, 2.4vw, 34px) !important;
    padding-right: clamp(8px, 1.5vw, 20px) !important;
  }

  body.home-breakpoints-page.home-page .flexlast-shared-header .header-action-button:not(.header-context-button) {
    width: 40px !important;
    min-width: 40px !important;
    height: 40px !important;
    min-height: 40px !important;
    border-radius: 14px !important;
    border-color: rgba(226, 232, 240, 0.84) !important;
    box-shadow: none !important;
  }

  body.home-breakpoints-page.home-page .hero {
    grid-template-columns: minmax(0, 1fr) clamp(424px, 34vw, 462px) !important;
    gap: clamp(44px, 5.4vw, 76px) !important;
    padding-top: clamp(42px, 4.5vw, 58px) !important;
    padding-bottom: 28px !important;
  }

  body.home-breakpoints-page.home-page .hero-spotlight {
    gap: 22px !important;
    transform: translateX(3px) translateY(-42px) !important;
  }

  body.home-breakpoints-page.home-page--de .hero-spotlight-copy h1 {
    max-width: 11.4ch !important;
    font-size: clamp(52px, 5vw, 70px) !important;
    line-height: 0.95 !important;
    letter-spacing: -0.052em !important;
  }

  body.home-breakpoints-page.home-page--de .hero-spotlight-accent {
    margin-top: 2px !important;
    font-size: clamp(24px, 2.2vw, 30px) !important;
    line-height: 1.08 !important;
  }

  body.home-breakpoints-page.home-page--de .hero-spotlight-support-visual--carousel,
  body.home-breakpoints-page.home-page--de .hero-gallery--de-spotlight {
    width: min(100%, 610px) !important;
  }

  body.home-breakpoints-page.home-page .hero-right {
    max-width: 462px !important;
    margin-top: -10px !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .widget-top {
    gap: 9px !important;
    padding: 14px 16px 36px !important;
    border-radius: 26px !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .widget-bottom {
    gap: 12px !important;
    margin-top: -20px !important;
    padding: 17px !important;
    border-radius: 26px !important;
  }
}

@media (min-width: 980px) and (max-width: 1139px) {
  body.home-breakpoints-page.home-page .flexlast-shared-header .nav-links {
    gap: clamp(12px, 1.45vw, 18px) !important;
    font-size: 13px !important;
  }

  body.home-breakpoints-page.home-page .hero {
    grid-template-columns: minmax(0, 1fr) clamp(410px, 39vw, 440px) !important;
    gap: clamp(32px, 3.5vw, 46px) !important;
  }

  body.home-breakpoints-page.home-page--de .hero-spotlight-copy h1 {
    font-size: clamp(46px, 4.6vw, 54px) !important;
  }
}

@media (max-width: 767px) {
  body.home-breakpoints-page.home-page {
    padding-top: 64px !important;
  }

  body.home-breakpoints-page.home-page .flexlast-shared-header {
    padding: 9px 0 !important;
  }

  body.home-breakpoints-page.home-page .flexlast-shared-header .main-nav {
    min-height: 42px !important;
  }

  body.home-breakpoints-page.home-page .flexlast-shared-header .logo {
    font-size: 25px !important;
  }

  body.home-breakpoints-page.home-page .flexlast-shared-header .header-mobile-phone {
    opacity: 0.9 !important;
  }

  body.home-breakpoints-page.home-page .flexlast-shared-header .header-mobile-phone .header-phone-note,
  body.home-breakpoints-page.home-page .flexlast-shared-header .header-mobile-phone .header-phone-number {
    font-size: 12.8px !important;
    letter-spacing: -0.018em !important;
  }

  body.home-breakpoints-page.home-page .flexlast-shared-header .header-mobile-phone .header-phone-note,
  body.home-breakpoints-page.home-page .flexlast-shared-header .header-phone-note {
    display: none !important;
  }

  html body.home-breakpoints-page.home-page .flexlast-shared-header.flexlast-shared-header .header-mobile-phone.header-mobile-phone .header-phone-note.header-phone-note {
    display: none !important;
  }

  body.home-breakpoints-page.home-page .flexlast-shared-header .header-action-button:not(.header-context-button) {
    width: 40px !important;
    min-width: 40px !important;
    height: 40px !important;
    min-height: 40px !important;
    border-radius: 14px !important;
    box-shadow: none !important;
  }

  body.home-breakpoints-page.home-page .hero {
    padding: 16px 18px 22px !important;
  }

  body.home-breakpoints-page.home-page .hero-right {
    width: 100% !important;
    max-width: none !important;
    margin-top: -14px !important;
    padding-top: 2px !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .widget-top {
    gap: 10px !important;
    padding: 14px 14px 30px !important;
    border-radius: 24px !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .widget-bottom {
    gap: 12px !important;
    margin-top: -16px !important;
    padding: 16px !important;
    border-radius: 24px !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .checkout-btn,
  body.home-breakpoints-page.home-page #quickOrderWidget .side-btn {
    height: 60px !important;
    border-radius: 16px !important;
  }
}

@media (max-width: 430px) {
  body.home-breakpoints-page.home-page .hero {
    padding-inline: 8px !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .widget-top {
    gap: 10px !important;
    padding: 14px 14px 30px !important;
    border-radius: 26px !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .widget-bottom {
    gap: 12px !important;
    padding: 16px 14px !important;
    border-radius: 26px !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .card {
    border-radius: 18px !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .address-card {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 38px minmax(0, 1.04fr) 38px !important;
    align-items: center !important;
    min-height: 68px !important;
    padding: 9px 9px 9px 12px !important;
    gap: 6px !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .address-col {
    min-width: 0 !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .address-col .label {
    font-size: 10.5px !important;
    letter-spacing: 0.065em !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .address-col input {
    min-width: 0 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    font-size: 15.8px !important;
    line-height: 1.12 !important;
    letter-spacing: -0.026em !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .address-card .swap-btn,
  body.home-breakpoints-page.home-page #quickOrderWidget .address-card .add-address-btn {
    width: 38px !important;
    min-width: 38px !important;
    height: 42px !important;
    border-radius: 14px !important;
    color: #475467 !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.74) !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .address-card .swap-btn {
    background: #f4f5f7 !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .address-card .add-address-btn {
    background: #f8f9fb !important;
    color: #4b5563 !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .address-card .swap-btn .material-icons-round,
  body.home-breakpoints-page.home-page #quickOrderWidget .address-card .add-address-btn .material-icons-round {
    font-size: 20px !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .truck-card {
    grid-template-columns: 74px minmax(0, 1fr) 16px !important;
    /* 12px Luft zwischen Fahrzeugbild und Text. */
    gap: 12px !important;
    min-height: 84px !important;
    padding: 13px 9px 13px 11px !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .truck-img {
    width: 74px !important;
    height: 46px !important;
    transform: none !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .truck-info {
    margin-left: 0 !important;
    min-width: 0 !important;
    overflow: visible !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .truck-field-label {
    font-size: 10.2px !important;
    letter-spacing: 0.075em !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .truck-main-line {
    max-width: 100% !important;
    gap: 4px !important;
    font-size: clamp(13.9px, 3.76vw, 14.2px) !important;
    line-height: 1.22 !important;
    letter-spacing: -0.04em !important;
    white-space: nowrap !important;
    overflow: visible !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .truck-main-separator {
    font-size: 0.58em !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .truck-main-name {
    min-width: 0 !important;
    overflow: visible !important;
    text-overflow: clip !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .arrow-icon {
    font-size: 18px !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .loaders-card {
    grid-template-columns: 50px minmax(0, 1fr) 112px !important;
    min-height: 88px !important;
    padding: 10px 8px !important;
    gap: 6px !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .loader-img,
  body.home-breakpoints-page.home-page #quickOrderWidget .loader-img--main {
    width: 50px !important;
    height: 42px !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget #loadersTextLine1 {
    font-size: 15.9px !important;
    line-height: 1.08 !important;
    letter-spacing: -0.024em !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget #loadersTextLine2 {
    font-size: 12.4px !important;
    line-height: 1.18 !important;
    letter-spacing: -0.014em !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .counter-box {
    grid-template-columns: 34px minmax(32px, 1fr) 34px !important;
    gap: 3px !important;
    padding: 4px !important;
    border-radius: 16px !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .counter-box button,
  body.home-breakpoints-page.home-page #quickOrderWidget .counter-btn {
    width: 34px !important;
    height: 40px !important;
    border-radius: 12px !important;
    font-size: 20px !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .counter-texts > span {
    font-size: 9.8px !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .counter-texts strong,
  body.home-breakpoints-page.home-page #quickOrderWidget #loaderCountVal {
    font-size: 17px !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .two-col-row {
    gap: 10px !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .options-card,
  body.home-breakpoints-page.home-page #quickOrderWidget .time-card {
    min-height: 74px !important;
    padding: 11px 12px !important;
    border-radius: 18px !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .options-card > span:first-child {
    font-size: 0 !important;
    line-height: 1 !important;
    letter-spacing: -0.036em !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .options-card > span:first-child::after {
    content: var(--home-mobile-options-label) !important;
    display: block !important;
    font-size: 17.2px !important;
    line-height: 1.04 !important;
    letter-spacing: -0.036em !important;
    font-weight: 900 !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .options-control-shell {
    border-radius: 14px !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .options-icon {
    width: 38px !important;
    height: 38px !important;
    border-radius: 13px !important;
    font-size: 20px !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .time-card .label {
    font-size: 0 !important;
    line-height: 1 !important;
    letter-spacing: 0.055em !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .time-card .label::after {
    content: var(--home-mobile-time-label) !important;
    display: block !important;
    font-size: 8.9px !important;
    line-height: 1 !important;
    letter-spacing: 0.055em !important;
    font-weight: 800 !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .time-card {
    gap: 6px !important;
    padding: 11px 10px !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .time-info #rentalTimeText {
    font-size: 20.2px !important;
    line-height: 1 !important;
    letter-spacing: -0.04em !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .vert-controls {
    width: 68px !important;
    height: 48px !important;
    border-radius: 16px !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .vert-controls button {
    width: 30px !important;
    height: 38px !important;
    border-radius: 13px !important;
    font-size: 20px !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .radio-card {
    min-height: 74px !important;
    padding: 13px 14px !important;
    gap: 10px !important;
    border-radius: 18px !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget #dateTrigger {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    padding: 11px 8px 11px 34px !important;
    gap: 6px !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget #dateTrigger .radio-top {
    position: absolute !important;
    left: 9px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    width: 22px !important;
    min-width: 22px !important;
    height: 22px !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .radio-top {
    width: 28px !important;
    min-width: 28px !important;
    height: 28px !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .radio-text {
    font-size: 13.7px !important;
    line-height: 1.2 !important;
    letter-spacing: -0.026em !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .calendar-wrap {
    display: grid !important;
    grid-template-columns: 26px minmax(0, 1fr) !important;
    align-items: center !important;
    gap: 6px !important;
    min-width: 0 !important;
    width: 100% !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .calendar-wrap span:last-child {
    max-width: none !important;
    min-width: 0 !important;
    font-size: 12.2px !important;
    line-height: 1.18 !important;
    letter-spacing: -0.012em !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .calendar-wrap .material-icons-round {
    width: 26px !important;
    height: 26px !important;
    border-radius: 9px !important;
    font-size: 17px !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .checkout-row {
    grid-template-columns: 58px minmax(0, 1fr) 58px !important;
    gap: 7px !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .checkout-btn,
  body.home-breakpoints-page.home-page #quickOrderWidget .side-btn {
    height: 62px !important;
    border-radius: 18px !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .checkout-row .side-btn {
    width: 58px !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .checkout-label {
    font-size: 17.2px !important;
    line-height: 1 !important;
    letter-spacing: -0.024em !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .total-price {
    font-size: 30px !important;
    line-height: 0.96 !important;
    letter-spacing: -0.05em !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .side-btn .material-icons-round {
    font-size: 23px !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .checkout-assurance {
    margin-top: 2px !important;
    gap: 5px 8px !important;
    font-size: 11.2px !important;
    line-height: 1.18 !important;
    letter-spacing: -0.018em !important;
  }
}

/* Profil-Dashboard: auf sehr schmalen Geräten bleiben die Feldnamen lesbar. */
@media (max-width: 350px) {
  body.profile-dashboard-page.home-breakpoints-page.home-page #quickOrderWidget .address-card {
    grid-template-columns: minmax(0, 1fr) 38px !important;
    grid-template-areas:
      "pickup swap"
      "destination add" !important;
    min-height: 116px !important;
    row-gap: 8px !important;
  }

  body.profile-dashboard-page.home-breakpoints-page.home-page #quickOrderWidget .address-col:first-of-type {
    grid-area: pickup;
  }

  body.profile-dashboard-page.home-breakpoints-page.home-page #quickOrderWidget .address-card .swap-btn {
    grid-area: swap;
  }

  body.profile-dashboard-page.home-breakpoints-page.home-page #quickOrderWidget .address-col:nth-of-type(2) {
    grid-area: destination;
  }

  body.profile-dashboard-page.home-breakpoints-page.home-page #quickOrderWidget .address-card .add-address-btn {
    grid-area: add;
  }

  body.profile-dashboard-page.home-breakpoints-page.home-page #quickOrderWidget .two-col-row {
    display: grid !important;
    grid-template-columns: 1fr !important;
  }

  body.profile-dashboard-page.home-breakpoints-page.home-page #quickOrderWidget .options-card,
  body.profile-dashboard-page.home-breakpoints-page.home-page #quickOrderWidget .time-card {
    width: 100% !important;
  }
}

/* Keep the mobile address step visually connected to the page: it is the
   address half of the desktop map dialog, not a separate full-screen page. */
@media (max-width: 979px) {
  body.home-breakpoints-page #addressDetailsModal,
  body.home-breakpoints-page #mapModal.mobile-address-mode:not(.mobile-map-picker) {
    box-sizing: border-box;
    padding: max(10px, env(safe-area-inset-top)) 12px max(10px, env(safe-area-inset-bottom));
    background: rgba(15, 23, 42, 0.36);
    -webkit-backdrop-filter: blur(2px);
    backdrop-filter: blur(2px);
  }

  body.home-breakpoints-page #addressDetailsModal {
    overflow: hidden;
  }

  body.home-breakpoints-page #addressDetailsModal .address-details-shell,
  body.home-breakpoints-page #mapModal.mobile-address-mode:not(.mobile-map-picker) .map-modal-content {
    width: min(100%, 560px);
    max-width: 560px;
    height: min(100%, 920px);
    max-height: 920px;
    overflow: hidden;
    border-radius: 28px;
    background: transparent;
    box-shadow: 0 24px 64px rgba(15, 23, 42, 0.24);
  }

  body.home-breakpoints-page #addressDetailsModal .address-details-shell {
    height: 100%;
    min-height: 0;
    max-height: 920px;
  }

  body.home-breakpoints-page #addressDetailsModal .address-details-panel,
  body.home-breakpoints-page #mapModal.mobile-address-mode:not(.mobile-map-picker) .map-panel {
    border-radius: 28px;
  }

  body.home-breakpoints-page #addressDetailsModal .address-details-panel {
    display: flex;
    height: 100%;
    min-height: 0;
    max-height: 100%;
    overflow: hidden;
  }

  body.home-breakpoints-page #addressDetailsModal .address-details-scroll {
    flex: 1 1 auto;
    min-height: 0;
    padding-bottom: 14px;
    overflow-y: auto;
  }

  body.home-breakpoints-page #addressDetailsModal .address-details-bottom {
    position: relative;
    z-index: 2;
    flex: 0 0 auto;
    background: #ffffff;
  }

  body.home-breakpoints-page #mapModal.mobile-address-mode:not(.mobile-map-picker) .panel-bottom > .add-stop-btn {
    gap: 8px;
    padding-inline: 10px;
    font-size: clamp(13px, 3.7vw, 15px);
  }

  body.home-breakpoints-page #mapModal.mobile-address-mode:not(.mobile-map-picker) .panel-bottom > .add-stop-btn .material-icons-round {
    font-size: 20px;
  }

  body.home-breakpoints-page #mapModal.mobile-address-mode:not(.mobile-map-picker) .add-mistplatz-btn .mistplatz-btn-label {
    display: block;
    flex: 0 1 auto;
    min-width: 0;
    max-width: calc(100% - 28px);
    overflow: visible;
    line-height: 1.25;
    text-align: center;
    white-space: nowrap;
    overflow-wrap: normal;
  }

  body.home-breakpoints-page #mapModal.mobile-address-mode:not(.mobile-map-picker) .add-mistplatz-btn:is(.is-active, .is-waiting) .mistplatz-btn-label {
    display: -webkit-box;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    white-space: normal;
  }

  body.home-breakpoints-page #mapModal.mobile-address-mode:not(.mobile-map-picker) .add-mistplatz-btn .mistplatz-btn-icon {
    flex: 0 0 auto;
  }
}

@media (max-width: 420px) {
  body.home-breakpoints-page #mapModal.mobile-address-mode:not(.mobile-map-picker) .add-mistplatz-btn .mistplatz-btn-label {
    max-width: 100%;
  }

  body.home-breakpoints-page #mapModal.mobile-address-mode:not(.mobile-map-picker) .add-mistplatz-btn .mistplatz-btn-icon {
    display: none;
  }
}

/* Keep the intermediate-stop badge inside the destination field at every
   widget width. The destination column can become very narrow on desktop. */
body.home-breakpoints-page.home-page #quickOrderWidget .multi-stop-display {
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  overflow: hidden;
}

body.home-breakpoints-page.home-page #quickOrderWidget .multi-stop-top {
  width: 100%;
  min-width: 0;
  overflow: hidden;
}

body.home-breakpoints-page.home-page #quickOrderWidget .multi-stop-pill {
  display: block;
  width: max-content;
  max-width: 100%;
  min-width: 0;
  box-sizing: border-box;
  padding: 3px 6px;
  font-size: clamp(10.5px, 0.78vw, 12.5px);
  letter-spacing: -0.01em;
  overflow: hidden;
  text-align: center;
  text-overflow: ellipsis;
}

body.home-breakpoints-page.home-page #quickOrderWidget .multi-stop-address {
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
}

/* Desktop address details are a nested layer of the route editor. Match the
   route dialog's shell and right column exactly instead of extending the
   details panel from the dialog top all the way to the viewport bottom. */
@media (min-width: 980px) {
  html body.home-page.home-breakpoints-page #addressDetailsModal.modal-overlay {
    --map-modal-top-gap: clamp(44px, 6vh, 72px);
    box-sizing: border-box;
    align-items: center !important;
    justify-content: center !important;
    padding: var(--map-modal-top-gap) 0 !important;
    background: rgba(15, 23, 42, 0.22) !important;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
  }

  html body.home-page.home-breakpoints-page #addressDetailsModal .address-details-shell {
    width: min(88vw, 1160px) !important;
    max-width: 1160px !important;
    height: min(820px, calc(100dvh - (var(--map-modal-top-gap) * 2))) !important;
    max-height: min(820px, calc(100dvh - (var(--map-modal-top-gap) * 2))) !important;
    gap: 8px !important;
    animation: none !important;
  }

  html body.home-page.home-breakpoints-page #addressDetailsModal .address-details-panel {
    flex: 0 0 clamp(440px, 33vw, 500px) !important;
    width: clamp(440px, 33vw, 500px) !important;
    height: 100% !important;
    min-height: 0 !important;
    max-height: 100% !important;
    padding: 24px 28px !important;
    border-radius: 20px !important;
    overflow: hidden !important;
    animation: address-details-panel-in 0.28s cubic-bezier(0.22, 1, 0.36, 1) both;
  }
}

@media (min-width: 1200px) and (min-height: 840px) {
  html body.home-page.home-breakpoints-page #addressDetailsModal.modal-overlay {
    --map-modal-wide-gap: clamp(92px, 9vh, 132px);
    padding: var(--map-modal-wide-gap) clamp(32px, 4vw, 88px) !important;
  }

  html body.home-page.home-breakpoints-page #addressDetailsModal .address-details-shell {
    width: min(76vw, 1080px) !important;
    max-width: 1080px !important;
    height: min(calc(100dvh - (var(--map-modal-wide-gap) * 2)), 980px) !important;
    max-height: min(calc(100dvh - (var(--map-modal-wide-gap) * 2)), 980px) !important;
  }

  html body.home-page.home-breakpoints-page #addressDetailsModal .address-details-panel {
    flex-basis: clamp(400px, 28vw, 460px) !important;
    width: clamp(400px, 28vw, 460px) !important;
  }
}

@keyframes address-details-panel-in {
  from {
    opacity: 0.58;
    transform: translateX(24px) scale(0.992);
  }
  to {
    opacity: 1;
    transform: translateX(0) scale(1);
  }
}

@media (prefers-reduced-motion: reduce) {
  html body.home-page.home-breakpoints-page #addressDetailsModal .address-details-panel {
    animation: none !important;
  }
}

html[lang="de"] body.home-page {
  --home-mobile-options-label: "Extras";
}

@media (max-width: 350px) {
  body.home-breakpoints-page #addressDetailsModal,
  body.home-breakpoints-page #mapModal.mobile-address-mode:not(.mobile-map-picker) {
    padding-right: 8px;
    padding-left: 8px;
  }

  body.home-breakpoints-page #addressDetailsModal .address-details-shell,
  body.home-breakpoints-page #addressDetailsModal .address-details-panel,
  body.home-breakpoints-page #mapModal.mobile-address-mode:not(.mobile-map-picker) .map-modal-content,
  body.home-breakpoints-page #mapModal.mobile-address-mode:not(.mobile-map-picker) .map-panel {
    border-radius: 24px;
  }

  body.home-breakpoints-page #mapModal.mobile-address-mode:not(.mobile-map-picker) .map-panel {
    padding-right: 10px;
    padding-left: 10px;
  }

  body.home-breakpoints-page #mapModal.mobile-address-mode:not(.mobile-map-picker) .route-input-group {
    padding-right: 8px;
    padding-left: 8px;
  }

  body.home-breakpoints-page #mapModal.mobile-address-mode:not(.mobile-map-picker) .step-num-wrap {
    width: 42px;
  }

  body.home-breakpoints-page #mapModal.mobile-address-mode:not(.mobile-map-picker) .input-wrap input {
    padding-right: 20px;
    font-size: 16px;
  }

  body.home-breakpoints-page #mapModal.mobile-address-mode:not(.mobile-map-picker) .delete-btn {
    width: 40px;
    height: 40px;
    flex-basis: 40px;
    margin-left: 4px;
  }

  body.home-breakpoints-page #mapModal.mobile-address-mode:not(.mobile-map-picker) .panel-bottom > .add-stop-btn {
    padding-inline: 6px;
    font-size: 12px;
  }

  body.home-breakpoints-page #mapModal.mobile-address-mode:not(.mobile-map-picker) .add-mistplatz-btn .mistplatz-btn-icon {
    display: none;
  }
}

/* Vehicle picker: use a neutral overlay and separate its fixed controls. */
@media (min-width: 561px) {
  body.home-page:not(.order-focus-page) #truckModal.modal-overlay {
    background: rgba(15, 23, 42, 0.5);
  }
}

/* Keep the vehicle picker as a dialog on phones instead of turning it into a
   separate full-screen view. The list still scrolls inside the rounded panel. */
@media (max-width: 560px) {
  html body.home-page.home-breakpoints-page:not(.order-focus-page) #truckModal.modal-overlay {
    align-items: center;
    justify-content: center;
    padding:
      max(12px, env(safe-area-inset-top, 0px))
      max(10px, env(safe-area-inset-right, 0px))
      max(12px, env(safe-area-inset-bottom, 0px))
      max(10px, env(safe-area-inset-left, 0px));
    background: rgba(15, 23, 42, 0.5);
  }

  html body.home-page.home-breakpoints-page:not(.order-focus-page) #truckModal.modal-overlay .truck-modal-content {
    position: relative;
    inset: auto;
    width: 100%;
    max-width: 490px;
    height: 100%;
    max-height: 900px;
    margin: auto;
    border: 1px solid rgba(226, 232, 240, 0.95);
    border-radius: 24px;
    box-shadow: 0 24px 60px rgba(15, 23, 42, 0.22);
  }
}

/* Align Extras with the booking panel's bottom edge, within the viewport. */
html body.home-page.home-breakpoints-page:not(.order-focus-page) #optionsModal.modal-overlay {
  --extras-top-gap: max(12px, env(safe-area-inset-top, 0px));
  --extras-bottom-gap: max(12px, env(safe-area-inset-bottom, 0px), var(--options-panel-bottom-gap, 12px));
  --extras-available-height: calc(100dvh - var(--extras-top-gap) - var(--extras-bottom-gap));
  align-items: flex-end;
  justify-content: flex-start;
  padding: var(--extras-top-gap) 0 var(--extras-bottom-gap) var(--options-panel-left, max(18px, calc(50vw + 180px)));
  background: rgba(15, 23, 42, 0.5);
}

html body.home-page.home-breakpoints-page:not(.order-focus-page) #optionsModal.modal-overlay .options-modal-content {
  position: relative;
  inset: auto;
  height: auto;
  min-height: 0;
  max-height: var(--extras-available-height);
  margin: 0;
  border-radius: 28px;
  animation: none;
}

html body.home-page.home-breakpoints-page:not(.order-focus-page) #optionsModal .options-body {
  flex: 1 1 auto;
  min-height: 0;
}

html body.home-page.home-breakpoints-page:not(.order-focus-page) #optionsModal .options-title,
html body.home-page.home-breakpoints-page:not(.order-focus-page) #optionsModal .options-footer {
  flex-shrink: 0;
}

html body.home-page.home-breakpoints-page:not(.order-focus-page) #optionsModal .options-footer {
  border-radius: 0;
  padding-bottom: max(22px, env(safe-area-inset-bottom, 0px));
}

@media (max-width: 560px) {
  html body.home-page.home-breakpoints-page:not(.order-focus-page) #optionsModal.modal-overlay {
    justify-content: center;
    padding:
      var(--extras-top-gap)
      max(10px, env(safe-area-inset-right, 0px))
      var(--extras-bottom-gap)
      max(10px, env(safe-area-inset-left, 0px));
  }

  html body.home-page.home-breakpoints-page:not(.order-focus-page) #optionsModal.modal-overlay .options-modal-content {
    width: 100%;
    max-width: 490px;
    border: 1px solid rgba(226, 232, 240, 0.95);
    border-radius: 24px;
    box-shadow: 0 24px 60px rgba(15, 23, 42, 0.22);
  }
}

/* Lugg-style vehicle card fill from the supplied reference (#fafafa). */
body.home-page:not(.order-focus-page) #truckModal .truck-row {
  background: #fafafa;
}

body.home-page:not(.order-focus-page) #truckModal .truck-row:hover {
  background: #fafafa;
}

body.home-page:not(.order-focus-page) #truckModal .truck-row.selected,
body.home-page:not(.order-focus-page) #truckModal .truck-row.selected:hover {
  background: #fafafa;
}

body.home-page #truckModal .truck-filter-tabs {
  min-height: 62px;
  padding: 10px 16px;
  border-bottom: 1px solid rgba(226, 232, 240, 0.95);
}

body.home-page:not(.order-focus-page) #truckModal .truck-modal-footer {
  border-top: 1px solid rgba(226, 232, 240, 0.95);
}

/* Keep the wide desktop vehicle picker anchored to the booking panel.
   The compact desktop rule in home.css is declared later than the original
   wide-screen rule, so its relative positioning must be undone here. */
@media (min-width: 1600px) and (min-height: 900px) {
  html body.home-page.home-breakpoints-page:not(.order-focus-page) #truckModal.modal-overlay .truck-modal-content {
    position: fixed !important;
    inset: auto !important;
    top: var(--truck-panel-top, 132px) !important;
    left: var(--truck-panel-left, max(18px, calc(50vw + 180px))) !important;
    height: min(calc(100dvh - var(--truck-panel-top, 132px) - 92px), 980px) !important;
    max-height: min(calc(100dvh - var(--truck-panel-top, 132px) - 92px), 980px) !important;
    margin: 0 !important;
  }
}

body.home-breakpoints-page.home-page #quickOrderWidget .address-card .swap-btn,
body.home-breakpoints-page.home-page #quickOrderWidget .address-card .add-address-btn {
  border: 1px solid rgba(226, 232, 240, 0.62) !important;
  background: rgba(246, 247, 249, 0.74) !important;
  color: #4b5563 !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.72) !important;
}

body.home-breakpoints-page.home-page #quickOrderWidget .address-card .add-address-btn {
  border-color: #dfe5ec !important;
  background: #fafbfc !important;
  color: #475569 !important;
  box-shadow: none !important;
}

@media (min-width: 768px) {
  body.home-breakpoints-page.home-page #quickOrderWidget .address-card .swap-btn {
    margin-right: 8px !important;
  }
}

body.home-breakpoints-page.home-page #quickOrderWidget .address-card .swap-btn:hover,
body.home-breakpoints-page.home-page #quickOrderWidget .address-card .swap-btn:focus-visible,
body.home-breakpoints-page.home-page #quickOrderWidget .address-card .add-address-btn:hover,
body.home-breakpoints-page.home-page #quickOrderWidget .address-card .add-address-btn:focus-visible {
  border-color: rgba(203, 213, 225, 0.9) !important;
  background: rgba(241, 245, 249, 0.94) !important;
  color: #111827 !important;
  box-shadow: 0 6px 14px rgba(15, 23, 42, 0.06), inset 0 1px 0 rgba(255, 255, 255, 0.82) !important;
}

body.home-breakpoints-page.home-page #quickOrderWidget .truck-info,
body.home-breakpoints-page.home-page #quickOrderWidget .truck-main-line {
  overflow: visible !important;
}

body.home-breakpoints-page.home-page #quickOrderWidget .truck-main-line {
  line-height: 1.18 !important;
}

body.home-breakpoints-page.home-page #quickOrderWidget .truck-main-name {
  min-width: 0 !important;
  line-height: inherit !important;
  padding-bottom: 2px !important;
  margin-bottom: -2px !important;
}

@media (max-width: 374px) {
  body.home-breakpoints-page.home-page .flexlast-shared-header .header-mobile-phone {
    display: none !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .truck-card {
    grid-template-columns: 54px minmax(0, 1fr) 16px !important;
    /* 8px Luft zwischen Fahrzeugbild und Text. */
    gap: 8px !important;
    padding: 12px 8px !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .truck-img {
    width: 54px !important;
    height: 38px !important;
    transform: none !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .truck-main-line {
    gap: 3px !important;
    font-size: clamp(11.6px, 3.55vw, 12.8px) !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .delivery-time-row {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 8px !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .radio-card {
    width: 100% !important;
    min-height: 64px !important;
    padding: 12px 14px !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget #dateTrigger {
    padding: 11px 12px 11px 42px !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget #dateTrigger .radio-top {
    left: 13px !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .loaders-card {
    grid-template-columns: 42px minmax(0, 1fr) !important;
    min-height: 122px !important;
    padding: 10px !important;
    gap: 8px 10px !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .loader-img,
  body.home-breakpoints-page.home-page #quickOrderWidget .loader-img--main {
    grid-column: 1 !important;
    grid-row: 1 !important;
    width: 42px !important;
    height: 36px !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .loader-text {
    grid-column: 2 !important;
    grid-row: 1 !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget #loadersTextLine1 {
    font-size: 14.4px !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget #loadersTextLine2 {
    max-width: none !important;
    font-size: 12.2px !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .counter-box {
    grid-column: 1 / -1 !important;
    grid-row: 2 !important;
    grid-template-columns: 38px minmax(0, 1fr) 38px !important;
    width: 100% !important;
    margin-top: 0 !important;
    border-radius: 16px !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .counter-box button,
  body.home-breakpoints-page.home-page #quickOrderWidget .counter-btn {
    width: 38px !important;
    height: 38px !important;
    border-radius: 12px !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .widget-top {
    padding: 12px 12px 28px !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .widget-bottom {
    padding: 14px !important;
  }
}

/* The 338 px lab viewport still has enough room for both delivery-time choices.
   Keep the stacked fallback only for viewports narrower than that. */
@media (min-width: 338px) and (max-width: 374px) {
  body.home-breakpoints-page.home-page #quickOrderWidget .delivery-time-row {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 8px !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .radio-card {
    min-width: 0 !important;
    padding: 10px 8px !important;
    gap: 6px !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .radio-top {
    width: 22px !important;
    min-width: 22px !important;
    height: 22px !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .radio-text {
    font-size: 11.2px !important;
    line-height: 1.18 !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget #dateTrigger {
    padding: 9px 5px 9px 32px !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget #dateTrigger .radio-top {
    left: 7px !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .calendar-wrap {
    grid-template-columns: 20px minmax(0, 1fr) !important;
    gap: 4px !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .calendar-wrap .material-icons-round {
    width: 20px !important;
    height: 20px !important;
    font-size: 15px !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .calendar-wrap span:last-child {
    font-size: 11.2px !important;
    line-height: 1.16 !important;
    letter-spacing: -0.02em !important;
    overflow-wrap: normal !important;
  }
}

/* Homepage story strip: compact informational cards directly after the booking panel. */
body.home-breakpoints-page.home-page .hero + .home-features--stories,
body.home-breakpoints-page.home-page .home-features--stories {
  box-sizing: border-box !important;
  width: auto !important;
  max-width: 1300px !important;
  margin: clamp(32px, 3.2vw, 48px) auto 0 !important;
  padding: 0 5% !important;
}

body.home-breakpoints-page.home-page .home-features--stories .home-features-heading {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  margin: -1px !important;
  padding: 0 !important;
  border: 0 !important;
  overflow: hidden !important;
  clip: rect(0 0 0 0) !important;
  clip-path: inset(50%) !important;
  white-space: nowrap !important;
}

body.home-breakpoints-page.home-page .home-features--stories .home-features-grid {
  display: grid !important;
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  gap: clamp(12px, 1.35vw, 18px) !important;
  align-items: stretch !important;
  width: calc(100% * 5 / 6) !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
}

body.home-breakpoints-page.home-page .home-features--stories {
  position: relative !important;
}

body.home-breakpoints-page.home-page .home-feature-strip-nav {
  display: none !important;
}

body.home-breakpoints-page.home-page .home-features--stories .home-feature-card {
  --feature-card-bg: #78d33a;
  --feature-card-fg: #06130b;
  --feature-card-muted: rgba(6, 19, 11, 0.72);
  --feature-card-placeholder: rgba(255, 255, 255, 0.32);
  position: relative !important;
  min-height: 0 !important;
  aspect-ratio: 1 / 1 !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: flex-start !important;
  align-items: flex-start !important;
  padding: clamp(16px, 1.45vw, 22px) !important;
  border: 0 !important;
  border-radius: 18px !important;
  background: var(--feature-card-bg) !important;
  color: var(--feature-card-fg) !important;
  box-shadow: none !important;
  overflow: hidden !important;
  text-align: left !important;
  scroll-snap-align: start !important;
  transition: transform 0.18s ease, filter 0.18s ease !important;
}

body.home-breakpoints-page.home-page .home-features--stories .home-feature-card:hover,
body.home-breakpoints-page.home-page .home-features--stories .home-feature-card:focus-visible {
  transform: translateY(-2px) !important;
  background: var(--feature-card-bg) !important;
  filter: brightness(0.985) !important;
  box-shadow: none !important;
}

body.home-breakpoints-page.home-page .home-features--stories .home-feature-card:focus-visible {
  outline: 3px solid rgba(8, 124, 58, 0.2) !important;
  outline-offset: 3px !important;
}

body.home-breakpoints-page.home-page .home-features--stories .home-feature-card--rose {
  --feature-card-bg: #ef4a8d;
  --feature-card-fg: #ffffff;
  --feature-card-muted: rgba(255, 255, 255, 0.82);
  --feature-card-placeholder: rgba(255, 255, 255, 0.3);
}

body.home-breakpoints-page.home-page .home-features--stories .home-feature-card--lime {
  --feature-card-bg: #8bd83e;
}

body.home-breakpoints-page.home-page .home-features--stories .home-feature-card--blue {
  --feature-card-bg: #dceaf7;
}

body.home-breakpoints-page.home-page .home-features--stories .home-feature-card--orange {
  --feature-card-bg: #ffe1bf;
}

body.home-breakpoints-page.home-page .home-features--stories .home-feature-card--purple {
  --feature-card-bg: #e7ddff;
}

body.home-breakpoints-page.home-page .home-features--stories .home-feature-card--yellow {
  --feature-card-bg: #ffd84d;
}

body.home-breakpoints-page.home-page .home-features--stories .home-feature-card--image-tile {
  padding: 0 !important;
  background: var(--feature-card-bg) !important;
}

body.home-breakpoints-page.home-page .home-features--stories .home-feature-card--image-tile .home-feature-copy {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
  clip: rect(0 0 0 0) !important;
  white-space: nowrap !important;
}

body.home-breakpoints-page.home-page .home-features--stories .home-feature-copy {
  position: relative !important;
  z-index: 2 !important;
  display: block !important;
  width: 100% !important;
  max-width: 12.2ch !important;
  padding: 0 !important;
}

body.home-breakpoints-page.home-page .home-features--stories .home-feature-title {
  color: inherit !important;
  font-size: clamp(17px, 1.45vw, 25px) !important;
  font-weight: 950 !important;
  line-height: 1.05 !important;
  letter-spacing: 0 !important;
}

body.home-breakpoints-page.home-page .home-features--stories .home-feature-text {
  display: block !important;
  margin-top: 8px !important;
  color: var(--feature-card-muted) !important;
  font-size: clamp(12px, 0.86vw, 15px) !important;
  font-weight: 800 !important;
  line-height: 1.28 !important;
  letter-spacing: 0 !important;
}

body.home-breakpoints-page.home-page .home-features--stories .home-feature-story-icon {
  position: absolute !important;
  right: 14px !important;
  bottom: 14px !important;
  z-index: 1 !important;
  width: min(58%, 112px) !important;
  height: min(40%, 78px) !important;
  display: block !important;
  border-radius: 16px !important;
  object-fit: cover !important;
}

body.home-breakpoints-page.home-page .home-features--stories .home-feature-story-icon--placeholder {
  border: 2px dashed rgba(6, 19, 11, 0.18) !important;
  background:
    linear-gradient(135deg, var(--feature-card-placeholder), rgba(255, 255, 255, 0.08)),
    repeating-linear-gradient(135deg, rgba(255, 255, 255, 0.22) 0 10px, rgba(255, 255, 255, 0) 10px 20px) !important;
}

body.home-breakpoints-page.home-page .home-features--stories .home-feature-card--image-tile .home-feature-story-icon--full-tile {
  inset: 0 !important;
  z-index: 1 !important;
  width: 100% !important;
  height: 100% !important;
  border: 0 !important;
  border-radius: inherit !important;
  background: transparent !important;
  object-fit: cover !important;
  object-position: center !important;
}

body.home-breakpoints-page.home-page .home-features--stories .home-feature-card--rose .home-feature-story-icon--placeholder {
  border-color: rgba(255, 255, 255, 0.38) !important;
}

body.home-breakpoints-page.home-page .home-features--stories .home-feature-card.has-custom-home-feature-image .home-feature-story-icon--placeholder {
  border: 0 !important;
  background: transparent !important;
}

body.home-breakpoints-page.home-page .home-features--stories .home-feature-card--custom-image-tile {
  padding: 0 !important;
}

body.home-breakpoints-page.home-page .home-features--stories .home-feature-card--custom-image-tile .home-feature-copy {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
  clip: rect(0 0 0 0) !important;
  white-space: nowrap !important;
}

body.home-breakpoints-page.home-page .home-features--stories .home-feature-card--custom-image-tile .home-feature-story-icon,
body.home-breakpoints-page.home-page .home-features--stories .home-feature-card--custom-image-tile .home-feature-story-icon--placeholder {
  inset: 0 !important;
  z-index: 1 !important;
  width: 100% !important;
  height: 100% !important;
  border: 0 !important;
  border-radius: inherit !important;
  background: transparent !important;
  object-fit: cover !important;
  object-position: center !important;
}

body.home-breakpoints-page.home-page .home-features--stories .home-feature-card--custom-image-tile.is-home-feature-image-over::after,
body.home-breakpoints-page.home-page.is-home-feature-image-dragging .home-features--stories .home-feature-card[data-home-feature-image-drop-ready="true"]::after {
  content: "" !important;
  position: absolute !important;
  inset: 6px !important;
  z-index: 4 !important;
  display: block !important;
  border: 2px dashed rgba(255, 255, 255, 0.88) !important;
  border-radius: 14px !important;
  background: rgba(8, 124, 58, 0.08) !important;
  pointer-events: none !important;
}

body.home-breakpoints-page.home-page:not(.is-home-feature-upload-enabled) .home-features--stories .home-feature-card[data-home-feature-image-drop-ready="true"] .home-feature-image-controls,
body.home-breakpoints-page.home-page:not(.is-home-feature-upload-enabled) .home-features--stories .home-feature-card[data-home-feature-image-drop-ready="true"]:hover .home-feature-image-controls,
body.home-breakpoints-page.home-page:not(.is-home-feature-upload-enabled) .home-features--stories .home-feature-card[data-home-feature-image-drop-ready="true"]:focus-within .home-feature-image-controls,
body.home-breakpoints-page.home-page:not(.is-home-feature-upload-enabled) .home-features--stories .home-feature-card[data-home-feature-image-drop-ready="true"].is-home-feature-image-moving .home-feature-image-controls,
body.home-breakpoints-page.home-page:not(.is-home-feature-upload-enabled) .home-features--stories .home-feature-image-export-controls,
body.home-breakpoints-page.home-page:not(.is-home-feature-upload-enabled) .home-features--stories:hover .home-feature-image-export-controls,
body.home-breakpoints-page.home-page:not(.is-home-feature-upload-enabled) .home-features--stories:focus-within .home-feature-image-export-controls {
  display: none !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

body.home-breakpoints-page.home-page .home-features--stories + .home-service-catalog {
  margin-top: clamp(42px, 3.8vw, 58px) !important;
}

.home-feature-story-dialog {
  width: min(430px, calc(100vw - 42px)) !important;
  height: min(760px, calc(100svh - 56px)) !important;
  border-radius: 22px !important;
  background: #78d33a !important;
}

.home-feature-story-bars {
  display: flex !important;
  flex-wrap: nowrap !important;
  grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
}

.home-feature-story-bars[hidden] {
  display: none !important;
}

.home-feature-story-bars--warum {
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
}

.home-feature-story-bars--tragehilfe {
  grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
}

.home-feature-story-bars--rabatte,
.home-feature-story-bars--umzug,
.home-feature-story-bars--entruempelung {
  grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
}

.home-feature-story-bars--preise,
.home-feature-story-bars--easteregg {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}

.home-feature-story-bars--prohibited {
  grid-template-columns: minmax(0, 1fr) !important;
  top: 10px !important;
  left: 10px !important;
  right: 10px !important;
  gap: 0 !important;
}

.home-feature-story[data-active-story-group="prohibited"] .home-feature-story-arrow {
  display: none !important;
}

.home-feature-story[data-active-story-group="tragehilfe"] .home-feature-story-dialog {
  background: #fff8d0 !important;
}

.home-feature-story[data-active-story-group="tragehilfe"] .home-feature-story-dialog::before {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.34) 0%, rgba(255, 255, 255, 0) 100%) !important;
}

.home-feature-story[data-active-story-group="tragehilfe"] .home-feature-story-control {
  color: #1a1610 !important;
  background: rgba(255, 255, 255, 0.62) !important;
  box-shadow: 0 10px 22px rgba(200, 170, 50, 0.14) !important;
  text-shadow: none !important;
}

.home-feature-story[data-active-story-group="rabatte"] .home-feature-story-dialog {
  background: #fff1de !important;
}

.home-feature-story[data-active-story-group="rabatte"] .home-feature-story-dialog::before {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.34) 0%, rgba(255, 255, 255, 0) 100%) !important;
}

.home-feature-story[data-active-story-group="rabatte"] .home-feature-story-control {
  color: #1a1410 !important;
  background: rgba(255, 255, 255, 0.62) !important;
  box-shadow: 0 10px 22px rgba(210, 120, 50, 0.14) !important;
  text-shadow: none !important;
}

.home-feature-story[data-active-story-group="umzug"] .home-feature-story-dialog {
  background: #ecf5da !important;
}

.home-feature-story[data-active-story-group="umzug"] .home-feature-story-dialog::before {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.34) 0%, rgba(255, 255, 255, 0) 100%) !important;
}

.home-feature-story[data-active-story-group="umzug"] .home-feature-story-control {
  color: #131a10 !important;
  background: rgba(255, 255, 255, 0.62) !important;
  box-shadow: 0 10px 22px rgba(80, 130, 40, 0.14) !important;
  text-shadow: none !important;
}

.home-feature-story[data-active-story-group="warum"] .home-feature-story-dialog {
  background: #e9f7ef !important;
}

.home-feature-story[data-active-story-group="warum"] .home-feature-story-dialog::before {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.34) 0%, rgba(255, 255, 255, 0) 100%) !important;
}

.home-feature-story[data-active-story-group="warum"] .home-feature-story-control {
  color: #101a14 !important;
  background: rgba(255, 255, 255, 0.62) !important;
  box-shadow: 0 10px 22px rgba(46, 182, 79, 0.14) !important;
  text-shadow: none !important;
}

.home-feature-story[data-active-story-group="easteregg"] .home-feature-story-dialog {
  background: #f4e8ff !important;
}

.home-feature-story[data-active-story-group="easteregg"] .home-feature-story-dialog::before {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.36) 0%, rgba(255, 255, 255, 0) 100%) !important;
}

.home-feature-story[data-active-story-group="easteregg"] .home-feature-story-control {
  color: #201228 !important;
  background: rgba(255, 255, 255, 0.64) !important;
  box-shadow: 0 10px 22px rgba(124, 58, 237, 0.14) !important;
  text-shadow: none !important;
}

.home-feature-story[data-active-story-group="entruempelung"] .home-feature-story-dialog {
  background: #ffe6f0 !important;
}

.home-feature-story[data-active-story-group="entruempelung"] .home-feature-story-dialog::before {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.34) 0%, rgba(255, 255, 255, 0) 100%) !important;
}

.home-feature-story[data-active-story-group="entruempelung"] .home-feature-story-control {
  color: #1a1014 !important;
  background: rgba(255, 255, 255, 0.62) !important;
  box-shadow: 0 10px 22px rgba(220, 80, 130, 0.14) !important;
  text-shadow: none !important;
}

.home-feature-story[data-active-story-group="preise"] .home-feature-story-dialog {
  background: #dceaf7 !important;
}

.home-feature-story[data-active-story-group="preise"] .home-feature-story-dialog::before {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.34) 0%, rgba(255, 255, 255, 0) 100%) !important;
}

.home-feature-story[data-active-story-group="preise"] .home-feature-story-control {
  color: #0f1a25 !important;
  background: rgba(255, 255, 255, 0.62) !important;
  box-shadow: 0 10px 22px rgba(70, 130, 200, 0.14) !important;
  text-shadow: none !important;
}

.home-feature-story[data-active-story-group="prohibited"] .home-feature-story-dialog {
  background: #ffe6e6 !important;
}

.home-feature-story[data-active-story-group="prohibited"] .home-feature-story-dialog::before {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.34) 0%, rgba(255, 255, 255, 0) 100%) !important;
}

.home-feature-story[data-active-story-group="prohibited"] .home-feature-story-control {
  color: #9b1c1c !important;
  background: rgba(255, 255, 255, 0.62) !important;
  box-shadow: 0 10px 22px rgba(220, 50, 50, 0.14) !important;
  text-shadow: none !important;
}

.home-feature-story-slide.home-feature-story-slide--tragehilfe {
  --feature-story-bg: #fff8d0;
  --feature-story-fg: #1a1610;
  display: block !important;
  background: radial-gradient(ellipse 92% 70% at 50% 64%, #fffce4 0%, #fff8d0 55%, #f4e89e 100%) !important;
  color: var(--feature-story-fg) !important;
}

.home-feature-story-slide.home-feature-story-slide--tragehilfe:not(.is-active) {
  transition: none !important;
}

.home-feature-story-slide.home-feature-story-slide--tragehilfe.is-active {
  transition: none !important;
}

.home-feature-story-slide--tragehilfe::after {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 1 !important;
  pointer-events: none !important;
  background: linear-gradient(180deg, rgba(255, 248, 208, 0.24) 0%, rgba(255, 248, 208, 0) 42%) !important;
}

.home-feature-story-slide.home-feature-story-slide--rabatte {
  --feature-story-bg: #fff1de;
  --feature-story-fg: #1a1410;
  display: block !important;
  background: radial-gradient(ellipse 92% 70% at 50% 64%, #fff8ec 0%, #fff1de 55%, #ffe2c2 100%) !important;
  color: var(--feature-story-fg) !important;
}

.home-feature-story-slide.home-feature-story-slide--rabatte:not(.is-active),
.home-feature-story-slide.home-feature-story-slide--rabatte.is-active {
  transition: none !important;
}

.home-feature-story-slide--rabatte::after {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 1 !important;
  pointer-events: none !important;
  background: linear-gradient(180deg, rgba(255, 241, 222, 0.24) 0%, rgba(255, 241, 222, 0) 42%) !important;
}

.home-feature-story-slide.home-feature-story-slide--umzug {
  --feature-story-bg: #ecf5da;
  --feature-story-fg: #131a10;
  display: block !important;
  background: radial-gradient(ellipse 92% 70% at 50% 64%, #f6fbe8 0%, #ecf5da 55%, #dbe9c0 100%) !important;
  color: var(--feature-story-fg) !important;
}

.home-feature-story-slide.home-feature-story-slide--umzug:not(.is-active),
.home-feature-story-slide.home-feature-story-slide--umzug.is-active {
  transition: none !important;
}

.home-feature-story-slide--umzug::after {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 1 !important;
  pointer-events: none !important;
  background: linear-gradient(180deg, rgba(236, 245, 218, 0.24) 0%, rgba(236, 245, 218, 0) 42%) !important;
}

.home-feature-story-slide.home-feature-story-slide--warum {
  --feature-story-bg: #e9f7ef;
  --feature-story-fg: #101a14;
  display: block !important;
  background: radial-gradient(ellipse 92% 70% at 50% 64%, #f6fff9 0%, #e9f7ef 55%, #ccebd7 100%) !important;
  color: var(--feature-story-fg) !important;
}

.home-feature-story-slide.home-feature-story-slide--warum:not(.is-active),
.home-feature-story-slide.home-feature-story-slide--warum.is-active {
  transition: none !important;
}

.home-feature-story-slide--warum::after {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 1 !important;
  pointer-events: none !important;
  background: linear-gradient(180deg, rgba(233, 247, 239, 0.24) 0%, rgba(233, 247, 239, 0) 42%) !important;
}

.home-feature-story-slide.home-feature-story-slide--easteregg {
  --feature-story-bg: #f4e8ff;
  --feature-story-fg: #201228;
  display: block !important;
  background:
    radial-gradient(circle at 78% 20%, rgba(255, 203, 112, 0.32) 0 8%, transparent 24%),
    radial-gradient(circle at 18% 70%, rgba(59, 130, 246, 0.16) 0 10%, transparent 28%),
    radial-gradient(ellipse 92% 70% at 50% 66%, #fff7ed 0%, #f4e8ff 58%, #e9d5ff 100%) !important;
  color: var(--feature-story-fg) !important;
}

.home-feature-story-slide.home-feature-story-slide--easteregg:not(.is-active),
.home-feature-story-slide.home-feature-story-slide--easteregg.is-active {
  transition: none !important;
}

.home-feature-story-slide--easteregg::after {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 1 !important;
  pointer-events: none !important;
  background: linear-gradient(180deg, rgba(244, 232, 255, 0.2) 0%, rgba(244, 232, 255, 0) 44%) !important;
}

.home-feature-story-easter-placeholder {
  position: absolute !important;
  left: 50% !important;
  top: 68% !important;
  z-index: 1 !important;
  width: 176px !important;
  height: 176px !important;
  display: grid !important;
  place-items: center !important;
  border: 2px dashed rgba(124, 58, 237, 0.28) !important;
  border-radius: 34px !important;
  background: rgba(255, 255, 255, 0.52) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.75), 0 18px 38px rgba(88, 28, 135, 0.08) !important;
  transform: translate(-50%, -50%) rotate(-2deg) !important;
  pointer-events: none !important;
}

.home-feature-story-easter-placeholder .material-icons-round {
  color: #7c3aed !important;
  font-size: 70px !important;
}

.home-feature-story-slide.home-feature-story-slide--entruempelung {
  --feature-story-bg: #ffe6f0;
  --feature-story-fg: #1a1014;
  display: block !important;
  background: radial-gradient(ellipse 92% 70% at 50% 64%, #fff0f6 0%, #ffe6f0 55%, #ffc8de 100%) !important;
  color: var(--feature-story-fg) !important;
}

.home-feature-story-slide.home-feature-story-slide--entruempelung:not(.is-active),
.home-feature-story-slide.home-feature-story-slide--entruempelung.is-active {
  transition: none !important;
}

.home-feature-story-slide--entruempelung::after {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 1 !important;
  pointer-events: none !important;
  background: linear-gradient(180deg, rgba(255, 230, 240, 0.24) 0%, rgba(255, 230, 240, 0) 42%) !important;
}

.home-feature-story-slide.home-feature-story-slide--preise {
  --feature-story-bg: #dceaf7;
  --feature-story-fg: #0f1a25;
  display: block !important;
  background: radial-gradient(ellipse 92% 70% at 50% 64%, #ebf3fa 0%, #dceaf7 55%, #b8d2eb 100%) !important;
  color: var(--feature-story-fg) !important;
}

.home-feature-story-slide.home-feature-story-slide--preise:not(.is-active),
.home-feature-story-slide.home-feature-story-slide--preise.is-active {
  transition: none !important;
}

.home-feature-story-slide--preise::after {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 1 !important;
  pointer-events: none !important;
  background: linear-gradient(180deg, rgba(220, 234, 247, 0.24) 0%, rgba(220, 234, 247, 0) 42%) !important;
}

.home-feature-story-slide.home-feature-story-slide--prohibited {
  --feature-story-bg: #ffe6e6;
  --feature-story-fg: #9b1c1c;
  display: block !important;
  background: radial-gradient(ellipse 92% 70% at 50% 64%, #fff5f5 0%, #ffe6e6 55%, #ffc8c8 100%) !important;
  color: var(--feature-story-fg) !important;
}

.home-feature-story-slide.home-feature-story-slide--prohibited:not(.is-active),
.home-feature-story-slide.home-feature-story-slide--prohibited.is-active {
  transition: none !important;
}

.home-feature-story-slide--prohibited::after {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 1 !important;
  pointer-events: none !important;
  background:
    linear-gradient(180deg, rgba(255, 244, 244, 0.6) 0%, rgba(255, 244, 244, 0.18) 38%, rgba(255, 244, 244, 0) 58%),
    linear-gradient(0deg, rgba(120, 0, 0, 0.12) 0%, rgba(120, 0, 0, 0) 26%) !important;
}

.home-feature-story-element {
  position: absolute !important;
  z-index: 1 !important;
  display: block !important;
  object-fit: contain !important;
  pointer-events: none !important;
}

.home-feature-story-fixed-image {
  position: absolute !important;
  left: var(--story-fixed-left, 50%) !important;
  top: var(--story-fixed-top, 62%) !important;
  z-index: var(--story-fixed-z, 1) !important;
  width: var(--story-fixed-width, 40%) !important;
  max-width: none !important;
  height: auto !important;
  display: block !important;
  border-radius: 24px !important;
  object-fit: contain !important;
  pointer-events: none !important;
  user-select: none !important;
  -webkit-user-drag: none !important;
  transform: translate(-50%, -50%) scale(var(--story-fixed-scale, 1)) !important;
  transform-origin: center !important;
}

/* Multiple statically positioned images on a single story slide.
   Mirrors .home-feature-story-fixed-image positioning but is not picked up
   by the (session-only) image editor, so several images can be hardcoded. */
.home-feature-story-multi-image {
  position: absolute !important;
  left: var(--mi-left, 50%) !important;
  top: var(--mi-top, 50%) !important;
  z-index: var(--mi-z, 1) !important;
  width: var(--mi-width, 40%) !important;
  max-width: none !important;
  height: auto !important;
  display: block !important;
  object-fit: contain !important;
  pointer-events: none !important;
  user-select: none !important;
  -webkit-user-drag: none !important;
  transform: translate(-50%, -50%) scale(var(--mi-scale, 1)) !important;
  transform-origin: center !important;
}

.home-feature-story-slide--prohibited-full .home-feature-story-prohibited-bg {
  inset: 0 !important;
  left: 0 !important;
  top: -9px !important;
  z-index: 0 !important;
  width: 100% !important;
  height: 100% !important;
  border-radius: 0 !important;
  object-fit: cover !important;
  object-position: center !important;
  transform: none !important;
}

.home-feature-story-fixed-image.is-story-fixed-cover {
  inset: 0 !important;
  left: 0 !important;
  top: 0 !important;
  z-index: var(--story-fixed-z, 0) !important;
  width: 100% !important;
  height: 100% !important;
  border-radius: 0 !important;
  object-fit: cover !important;
  object-position: center !important;
  transform: none !important;
}

body.is-home-story-image-editor-enabled .home-feature-story-slide.is-active .home-feature-story-fixed-image {
  cursor: grab !important;
  pointer-events: auto !important;
  touch-action: none !important;
}

body.is-home-story-image-editor-enabled .home-feature-story-slide.is-active .home-feature-story-fixed-image.is-moving {
  cursor: grabbing !important;
  filter: drop-shadow(0 18px 32px rgba(15, 23, 42, 0.18)) !important;
}

.home-feature-story-fixed-image[hidden],
.home-feature-story-slide.has-removed-story-fixed-image .home-feature-story-fixed-image {
  display: none !important;
}

.home-feature-story-slide--tragehilfe .home-feature-story-copy,
.home-feature-story-slide--rabatte .home-feature-story-copy,
.home-feature-story-slide--umzug .home-feature-story-copy,
.home-feature-story-slide--warum .home-feature-story-copy,
.home-feature-story-slide--easteregg .home-feature-story-copy,
.home-feature-story-slide--entruempelung .home-feature-story-copy,
.home-feature-story-slide--prohibited .home-feature-story-copy,
.home-feature-story-slide--preise .home-feature-story-copy {
  z-index: 3 !important;
}

.home-feature-story-image-input {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

.home-feature-story-image-controls {
  position: fixed !important;
  left: auto !important;
  right: clamp(18px, 5vw, 72px) !important;
  top: 50% !important;
  bottom: auto !important;
  z-index: 20020 !important;
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  align-items: stretch !important;
  justify-content: stretch !important;
  width: 142px !important;
  gap: 8px !important;
  padding: 10px !important;
  border: 1px solid rgba(203, 213, 225, 0.78) !important;
  border-radius: 20px !important;
  background: rgba(255, 255, 255, 0.94) !important;
  box-shadow: 0 16px 38px rgba(15, 23, 42, 0.18) !important;
  opacity: 0 !important;
  pointer-events: none !important;
  transform: translate(10px, -50%) !important;
  transition: opacity 0.18s ease, transform 0.18s ease !important;
  backdrop-filter: blur(12px) !important;
}

.home-feature-story.is-open .home-feature-story-image-controls,
.home-feature-story.is-open .home-feature-story-image-controls:focus-within,
.home-feature-story.is-open .home-feature-story-slide.is-story-image-drag-over ~ .home-feature-story-image-controls {
  opacity: 1 !important;
  pointer-events: auto !important;
  transform: translate(0, -50%) !important;
}

.home-feature-story-image-controls button {
  appearance: none !important;
  min-width: 0 !important;
  height: 32px !important;
  padding: 0 9px !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: #f3f5f8 !important;
  color: #111827 !important;
  font: inherit !important;
  font-size: 12px !important;
  font-weight: 850 !important;
  line-height: 1 !important;
  letter-spacing: 0 !important;
  box-shadow: none !important;
  cursor: pointer !important;
  pointer-events: auto !important;
}

.home-feature-story-image-controls button:first-child,
.home-feature-story-image-controls button:nth-last-child(2),
.home-feature-story-image-controls button:last-child {
  grid-column: 1 / -1 !important;
}

@media (max-width: 980px) {
  .home-feature-story-image-controls {
    left: 50% !important;
    right: auto !important;
    top: auto !important;
    bottom: 14px !important;
    width: min(430px, calc(100vw - 28px)) !important;
    grid-template-columns: repeat(7, minmax(0, auto)) !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;
    padding: 7px !important;
    border-radius: 999px !important;
    transform: translate(-50%, 8px) !important;
  }

  .home-feature-story.is-open .home-feature-story-image-controls,
  .home-feature-story.is-open .home-feature-story-image-controls:focus-within {
    transform: translate(-50%, 0) !important;
  }

  .home-feature-story-image-controls button {
    min-width: 34px !important;
    padding: 0 10px !important;
  }

  .home-feature-story-image-controls button:first-child,
  .home-feature-story-image-controls button:nth-last-child(2),
  .home-feature-story-image-controls button:last-child {
    grid-column: auto !important;
  }
}

.home-feature-story-image-controls button:hover,
.home-feature-story-image-controls button:focus-visible {
  background: #eafcf0 !important;
  color: #087c3a !important;
  outline: none !important;
}

.home-feature-story-image-layer {
  position: absolute !important;
  inset: 0 !important;
  z-index: 3 !important;
  pointer-events: none !important;
}

.home-feature-story-upload-item {
  position: absolute !important;
  left: var(--story-image-left, 50%) !important;
  top: var(--story-image-top, 62%) !important;
  width: var(--story-image-width, 160px) !important;
  max-width: none !important;
  display: block !important;
  border-radius: 18px !important;
  cursor: grab !important;
  pointer-events: auto !important;
  transform: translate(-50%, -50%) scale(var(--story-image-scale, 1)) !important;
  transform-origin: center !important;
  transition: filter 0.16s ease, box-shadow 0.16s ease !important;
  user-select: none !important;
  -webkit-user-drag: none !important;
}

.home-feature-story-upload-item img {
  width: 100% !important;
  height: auto !important;
  display: block !important;
  border-radius: inherit !important;
  pointer-events: none !important;
  user-select: none !important;
  -webkit-user-drag: none !important;
}

.home-feature-story-upload-item.is-selected,
.home-feature-story-upload-item.is-moving {
  cursor: grabbing !important;
  box-shadow: 0 0 0 3px rgba(8, 124, 58, 0.48), 0 18px 40px rgba(15, 23, 42, 0.2) !important;
  filter: drop-shadow(0 16px 28px rgba(15, 23, 42, 0.22)) !important;
}

.home-feature-story-slide.is-story-image-drag-over::before {
  content: "Bilder hier ablegen" !important;
  position: absolute !important;
  left: 50% !important;
  bottom: 88px !important;
  z-index: 10 !important;
  display: inline-flex !important;
  align-items: center !important;
  min-height: 36px !important;
  padding: 0 14px !important;
  border-radius: 999px !important;
  background: rgba(255, 255, 255, 0.96) !important;
  color: #087c3a !important;
  font-size: 13px !important;
  font-weight: 850 !important;
  box-shadow: 0 14px 34px rgba(15, 23, 42, 0.16) !important;
  transform: translateX(-50%) !important;
  pointer-events: none !important;
}

.home-feature-story-ack {
  appearance: none !important;
  position: absolute !important;
  left: 34px !important;
  right: 34px !important;
  bottom: 28px !important;
  z-index: 4 !important;
  min-height: 56px !important;
  padding: 0 24px !important;
  border: 0 !important;
  border-radius: 18px !important;
  background: #1f1f1d !important;
  color: #ffffff !important;
  font: inherit !important;
  font-size: 18px !important;
  font-weight: 850 !important;
  letter-spacing: 0 !important;
  cursor: pointer !important;
  box-shadow: 0 18px 36px rgba(20, 24, 18, 0.18) !important;
}

.home-feature-story-ack:focus-visible {
  outline: 3px solid rgba(31, 31, 29, 0.26) !important;
  outline-offset: 4px !important;
}

.home-feature-story-slide {
  --feature-story-bg: #78d33a;
  --feature-story-fg: #06130b;
  display: grid !important;
  grid-template-rows: auto minmax(0, 1fr) !important;
  background: var(--feature-story-bg) !important;
  color: var(--feature-story-fg) !important;
}

.home-feature-story-slide--rose {
  --feature-story-bg: #ef4a8d;
  --feature-story-fg: #ffffff;
}

.home-feature-story-slide--lime {
  --feature-story-bg: #8bd83e;
}

.home-feature-story-slide--blue {
  --feature-story-bg: #dceaf7;
}

.home-feature-story-slide--orange {
  --feature-story-bg: #ffe1bf;
}

.home-feature-story-slide--purple {
  --feature-story-bg: #e7ddff;
}

.home-feature-story-copy {
  position: relative !important;
  z-index: 2 !important;
  padding: 92px 34px 14px !important;
  background: transparent !important;
}

.home-feature-story-copy h3,
.home-feature-story-copy p {
  color: inherit !important;
  letter-spacing: 0 !important;
}

.home-feature-story-copy h3 {
  max-width: 9ch !important;
  font-size: clamp(36px, 3.1vw, 48px) !important;
  line-height: 1 !important;
}

.home-feature-story-copy p {
  max-width: 24ch !important;
  margin-top: 20px !important;
  font-size: 20px !important;
  line-height: 1.35 !important;
}

.home-feature-story-slide--tragehilfe .home-feature-story-copy,
.home-feature-story-slide--rabatte .home-feature-story-copy,
.home-feature-story-slide--umzug .home-feature-story-copy,
.home-feature-story-slide--warum .home-feature-story-copy,
.home-feature-story-slide--easteregg .home-feature-story-copy,
.home-feature-story-slide--entruempelung .home-feature-story-copy,
.home-feature-story-slide--preise .home-feature-story-copy {
  padding: 84px 34px 14px !important;
}

.home-feature-story-slide--tragehilfe .home-feature-story-copy h3,
.home-feature-story-slide--rabatte .home-feature-story-copy h3,
.home-feature-story-slide--umzug .home-feature-story-copy h3,
.home-feature-story-slide--warum .home-feature-story-copy h3,
.home-feature-story-slide--easteregg .home-feature-story-copy h3,
.home-feature-story-slide--entruempelung .home-feature-story-copy h3,
.home-feature-story-slide--preise .home-feature-story-copy h3 {
  max-width: min(100%, 12.8ch) !important;
  font-size: clamp(34px, 2.64vw, 42px) !important;
  line-height: 1.02 !important;
  overflow-wrap: normal !important;
  text-wrap: balance !important;
  word-break: normal !important;
}

.home-feature-story-slide--tragehilfe .home-feature-story-copy h3 span,
.home-feature-story-slide--rabatte .home-feature-story-copy h3 span,
.home-feature-story-slide--umzug .home-feature-story-copy h3 span,
.home-feature-story-slide--warum .home-feature-story-copy h3 span,
.home-feature-story-slide--easteregg .home-feature-story-copy h3 span,
.home-feature-story-slide--entruempelung .home-feature-story-copy h3 span,
.home-feature-story-slide--prohibited .home-feature-story-copy h3 span,
.home-feature-story-slide--preise .home-feature-story-copy h3 span {
  display: block !important;
  max-width: 100% !important;
  white-space: normal !important;
}

.home-feature-story-slide--singleline-title .home-feature-story-copy h3 {
  max-width: min(100%, 13.8ch) !important;
  font-size: clamp(33px, 2.55vw, 40px) !important;
  white-space: normal !important;
}

.home-feature-story-slide--singleline-title .home-feature-story-copy h3 span {
  display: inline !important;
}

.home-feature-story-slide--singleline-title .home-feature-story-copy h3 span + span::before {
  content: " " !important;
}

.home-feature-story-slide--tragehilfe-fit-title .home-feature-story-copy h3,
.home-feature-story-slide--rabatte-fit-title .home-feature-story-copy h3,
.home-feature-story-slide--umzug-fit-title .home-feature-story-copy h3,
.home-feature-story-slide--warum-fit-title .home-feature-story-copy h3,
.home-feature-story-slide--easteregg-fit-title .home-feature-story-copy h3,
.home-feature-story-slide--entruempelung-fit-title .home-feature-story-copy h3,
.home-feature-story-slide--prohibited-fit-title .home-feature-story-copy h3,
.home-feature-story-slide--preise-fit-title .home-feature-story-copy h3 {
  max-width: min(100%, 13.8ch) !important;
  font-size: clamp(32px, 2.48vw, 39px) !important;
}

.home-feature-story-slide--tragehilfe-fit-title .home-feature-story-copy h3 span,
.home-feature-story-slide--rabatte-fit-title .home-feature-story-copy h3 span,
.home-feature-story-slide--umzug-fit-title .home-feature-story-copy h3 span,
.home-feature-story-slide--warum-fit-title .home-feature-story-copy h3 span,
.home-feature-story-slide--easteregg-fit-title .home-feature-story-copy h3 span,
.home-feature-story-slide--entruempelung-fit-title .home-feature-story-copy h3 span,
.home-feature-story-slide--prohibited-fit-title .home-feature-story-copy h3 span,
.home-feature-story-slide--preise-fit-title .home-feature-story-copy h3 span {
  text-wrap: balance !important;
  white-space: normal !important;
}

.home-feature-story-slide--easteregg .home-feature-story-copy h3 {
  max-width: min(100%, 12.4ch) !important;
}

.home-feature-story-slide--easteregg-fit-title .home-feature-story-copy h3,
.home-feature-story-slide--easteregg-final .home-feature-story-copy h3 {
  max-width: min(100%, 12.8ch) !important;
}

.home-feature-story-slide--easteregg-final .home-feature-story-copy h3 span:last-child {
  font-size: 0.95em !important;
  letter-spacing: 0.01em !important;
}

.home-feature-story-slide--tragehilfe .home-feature-story-copy p,
.home-feature-story-slide--rabatte .home-feature-story-copy p,
.home-feature-story-slide--umzug .home-feature-story-copy p,
.home-feature-story-slide--easteregg .home-feature-story-copy p,
.home-feature-story-slide--entruempelung .home-feature-story-copy p,
.home-feature-story-slide--preise .home-feature-story-copy p {
  max-width: 31ch !important;
  margin-top: 18px !important;
  font-size: clamp(17px, 1.42vw, 19px) !important;
  line-height: 1.32 !important;
  text-wrap: pretty !important;
}

.home-feature-story-slide--tragehilfe-team .home-feature-story-copy {
  padding-top: 76px !important;
}

.home-feature-story-slide--tragehilfe-team .home-feature-story-copy h3 {
  max-width: min(100%, 17ch) !important;
  font-size: clamp(31px, 2.05vw, 34px) !important;
  line-height: 1.05 !important;
  text-wrap: balance !important;
}

.home-feature-story-slide--tragehilfe-team .home-feature-story-copy p {
  max-width: 32ch !important;
  margin-top: 16px !important;
  font-size: clamp(16px, 1.22vw, 18px) !important;
  line-height: 1.32 !important;
}

.home-feature-story-slide--umzug .home-feature-story-copy p strong,
.home-feature-story-slide--entruempelung .home-feature-story-copy p strong,
.home-feature-story-slide--preise .home-feature-story-copy p strong {
  font-weight: 900 !important;
  color: inherit !important;
}

.home-feature-story-slide--prohibited-full {
  background: #ffcfd0 !important;
}

.home-feature-story-slide--prohibited-full .home-feature-story-copy {
  box-sizing: border-box !important;
  width: 100% !important;
  padding: 86px 34px 0 !important;
  color: #961b1b !important;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.42) !important;
}

.home-feature-story-slide--prohibited-full .home-feature-story-copy h3 {
  max-width: min(100%, 13.6ch) !important;
  margin: 0 !important;
  font-size: clamp(36px, 2.7vw, 43px) !important;
  font-weight: 900 !important;
  line-height: 0.98 !important;
  letter-spacing: 0 !important;
  text-wrap: balance !important;
}

.home-feature-story-slide--prohibited-full .home-feature-story-copy p {
  max-width: 28ch !important;
  margin-top: 16px !important;
  color: #8b1a1a !important;
  font-size: clamp(15.4px, 1.18vw, 16.8px) !important;
  font-weight: 760 !important;
  line-height: 1.28 !important;
  letter-spacing: 0 !important;
  text-wrap: pretty !important;
}

.home-feature-story-slide--prohibited-full .home-feature-story-copy p strong {
  display: block !important;
  margin-bottom: 5px !important;
  color: #781313 !important;
  font-weight: 900 !important;
}

.home-feature-story-slide--prohibited-full .home-feature-story-ack {
  background: #191817 !important;
  box-shadow: 0 18px 36px rgba(88, 0, 0, 0.22) !important;
}

.home-feature-story-slide--preise-text-only {
  display: flex !important;
  align-items: center !important;
}

.home-feature-story-slide--preise-text-only .home-feature-story-copy {
  width: 100% !important;
  box-sizing: border-box !important;
  padding: 86px 34px 112px !important;
}

.home-feature-story-slide--preise-text-only .home-feature-story-copy h3 {
  max-width: none !important;
  font-size: clamp(34px, 2.38vw, 38px) !important;
  line-height: 1.04 !important;
  text-wrap: normal !important;
  overflow-wrap: normal !important;
}

.home-feature-story-slide--preise-text-only .home-feature-story-copy p {
  max-width: 35ch !important;
  font-size: clamp(17px, 1.34vw, 18.5px) !important;
  line-height: 1.34 !important;
  text-wrap: normal !important;
}

.home-feature-story-slide--preise-text-only.home-feature-story-slide--preise-final .home-feature-story-copy h3 {
  font-size: clamp(32px, 2.24vw, 36px) !important;
}

.home-feature-story-slide--preise-with-image {
  display: block !important;
}

.home-feature-story-slide--preise-with-image .home-feature-story-copy {
  padding-top: 84px !important;
  padding-bottom: 0 !important;
}

.home-feature-story-slide--preise-down-with-image .home-feature-story-copy {
  position: absolute !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 94px !important;
  z-index: 3 !important;
  padding: 0 42px !important;
}

.home-feature-story-slide--preise-down-with-image .home-feature-story-copy h3 {
  max-width: 100% !important;
  font-size: clamp(34px, 2.34vw, 38px) !important;
  line-height: 1.02 !important;
  letter-spacing: 0 !important;
}

.home-feature-story-slide--preise-down-with-image .home-feature-story-copy p {
  max-width: 31ch !important;
  margin-top: 18px !important;
  font-size: clamp(16.8px, 1.2vw, 18px) !important;
  font-weight: 730 !important;
  line-height: 1.34 !important;
  text-wrap: pretty !important;
}

.home-feature-story-price-fair-image {
  border-radius: 0 !important;
}

.home-feature-story-price-why-image {
  border-radius: 0 !important;
}

.home-feature-story-price-down-image {
  border-radius: 0 !important;
  filter: drop-shadow(0 18px 26px rgba(37, 99, 235, 0.18)) !important;
}

.home-feature-story-slide--preise-with-image::after {
  z-index: 1 !important;
}

.home-feature-story-cta-stack {
  position: absolute !important;
  left: 34px !important;
  right: 34px !important;
  bottom: 28px !important;
  z-index: 4 !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
}

.home-feature-story-cta-stack .home-feature-story-ack {
  position: static !important;
  left: auto !important;
  right: auto !important;
  bottom: auto !important;
  box-shadow: 0 12px 28px rgba(20, 24, 18, 0.16) !important;
}

.home-feature-story-ack--secondary {
  min-height: 44px !important;
  font-size: 15px !important;
  background: rgba(255, 255, 255, 0.82) !important;
  color: #1f1f1d !important;
  box-shadow: 0 6px 16px rgba(20, 24, 18, 0.08) !important;
}

.home-feature-story-ack--secondary:hover,
.home-feature-story-ack--secondary:focus-visible {
  background: #ffffff !important;
  outline: none !important;
}

.home-feature-story-ack--primary {
  background: #15b865 !important;
  color: #ffffff !important;
}

.home-feature-story-ack--primary:hover,
.home-feature-story-ack--primary:focus-visible {
  background: #0fa056 !important;
  outline: none !important;
}

.home-feature-story-media {
  min-height: 28px !important;
  margin: 10px 28px 30px !important;
  border-radius: 24px !important;
  border-bottom-left-radius: 24px !important;
  border-bottom-right-radius: 24px !important;
}

.home-feature-story-media--placeholder {
  display: grid !important;
  place-items: center !important;
  border: 2px dashed rgba(6, 19, 11, 0.2) !important;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.25), rgba(255, 255, 255, 0.08)),
    repeating-linear-gradient(135deg, rgba(255, 255, 255, 0.18) 0 12px, rgba(255, 255, 255, 0) 12px 24px) !important;
}

.home-feature-story-slide--rose .home-feature-story-media--placeholder {
  border-color: rgba(255, 255, 255, 0.42) !important;
}

.home-feature-story-media--placeholder span {
  display: block !important;
  width: min(72%, 260px) !important;
  height: min(58%, 240px) !important;
  border-radius: 22px !important;
  border: 2px solid rgba(255, 255, 255, 0.34) !important;
  background: rgba(255, 255, 255, 0.16) !important;
}

@media (max-width: 1180px) {
  body.home-breakpoints-page.home-page .hero + .home-features--stories,
  body.home-breakpoints-page.home-page .home-features--stories {
    padding-inline: 5% !important;
  }

  body.home-breakpoints-page.home-page .home-features--stories .home-features-grid {
    display: flex !important;
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    scroll-snap-type: x proximity !important;
    scroll-padding-inline: 0 !important;
    margin-inline: 0 !important;
    padding: 8px 0 4px !important;
    scrollbar-width: none !important;
    -webkit-overflow-scrolling: touch !important;
  }

  body.home-breakpoints-page.home-page .home-features--stories .home-features-grid::-webkit-scrollbar {
    display: none !important;
  }

  body.home-breakpoints-page.home-page .home-features--stories .home-feature-card {
    flex: 0 0 clamp(168px, 20vw, 208px) !important;
  }
}

@media (max-width: 767px) {
  body.home-breakpoints-page.home-page .hero + .home-features--stories,
  body.home-breakpoints-page.home-page .home-features--stories {
    margin-top: 28px !important;
    padding-left: calc(18px + var(--home-mobile-heading-inset, 8px)) !important;
    padding-right: 18px !important;
  }

  body.home-breakpoints-page.home-page .home-features--stories .home-features-grid {
    margin-inline: 0 !important;
    padding: 8px 0 4px !important;
    gap: 12px !important;
    scroll-snap-type: x mandatory !important;
  }

  body.home-breakpoints-page.home-page .home-feature-strip-nav {
    position: absolute !important;
    top: 50% !important;
    z-index: 8 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 36px !important;
    height: 36px !important;
    padding: 0 !important;
    border: 1px solid rgba(219, 228, 238, 0.96) !important;
    border-radius: 50% !important;
    background: #ffffff !important;
    color: #161b2b !important;
    cursor: pointer !important;
    box-shadow: 0 12px 28px rgba(15, 23, 42, 0.14) !important;
    opacity: 1 !important;
    transform: translateY(-50%) scale(1) !important;
    transition: opacity 0.18s ease, transform 0.18s ease !important;
    touch-action: manipulation !important;
  }

  body.home-breakpoints-page.home-page .home-feature-strip-nav--prev {
    left: 8px !important;
  }

  body.home-breakpoints-page.home-page .home-feature-strip-nav--next {
    right: 8px !important;
  }

  body.home-breakpoints-page.home-page .home-feature-strip-nav .material-icons-round {
    font-size: 25px !important;
    line-height: 1 !important;
  }

  body.home-breakpoints-page.home-page .home-feature-strip-nav.is-story-strip-nav-hidden {
    opacity: 0 !important;
    pointer-events: none !important;
    transform: translateY(-50%) scale(0.86) !important;
  }

  body.home-breakpoints-page.home-page .home-features--stories .home-feature-card {
    flex-basis: clamp(148px, 42vw, 172px) !important;
    border-radius: 16px !important;
    padding: 15px !important;
  }

  body.home-breakpoints-page.home-page .home-features--stories .home-feature-title {
    font-size: 18px !important;
  }

  body.home-breakpoints-page.home-page .home-features--stories .home-feature-text {
    font-size: 12px !important;
  }

  body.home-breakpoints-page.home-page .home-features--stories .home-feature-story-icon {
    right: 12px !important;
    bottom: 12px !important;
    width: min(60%, 94px) !important;
    height: min(38%, 62px) !important;
    border-radius: 14px !important;
  }

  body.home-breakpoints-page.home-page .home-features--stories + .home-service-catalog {
    margin-top: 34px !important;
  }

  .home-feature-story-dialog {
    width: min(430px, calc(100vw - 28px)) !important;
    height: min(720px, calc(100svh - 28px)) !important;
    border-radius: 18px !important;
  }

  .home-feature-story-copy {
    padding: 82px 28px 12px !important;
  }

  .home-feature-story-copy h3 {
    font-size: 38px !important;
  }

  .home-feature-story-copy p {
    max-width: 23ch !important;
    margin-top: 16px !important;
    font-size: 18px !important;
  }

  .home-feature-story-media {
    margin: 8px 22px 24px !important;
    border-radius: 20px !important;
  }

  .home-feature-story-slide--tragehilfe .home-feature-story-copy,
  .home-feature-story-slide--rabatte .home-feature-story-copy,
  .home-feature-story-slide--umzug .home-feature-story-copy,
  .home-feature-story-slide--warum .home-feature-story-copy,
  .home-feature-story-slide--easteregg .home-feature-story-copy,
  .home-feature-story-slide--entruempelung .home-feature-story-copy,
  .home-feature-story-slide--preise .home-feature-story-copy {
    padding: 80px 28px 0 !important;
  }

  .home-feature-story-slide--tragehilfe-team .home-feature-story-copy {
    padding-top: 76px !important;
  }

  .home-feature-story-slide--tragehilfe-team .home-feature-story-copy h3 {
    max-width: min(100%, 17ch) !important;
    font-size: clamp(29px, 7.2vw, 32px) !important;
    line-height: 1.05 !important;
  }

  .home-feature-story-slide--tragehilfe-team .home-feature-story-copy p {
    max-width: 31ch !important;
    margin-top: 14px !important;
    font-size: 15.8px !important;
    line-height: 1.32 !important;
  }

  .home-feature-story-slide--tragehilfe .home-feature-story-copy h3,
  .home-feature-story-slide--rabatte .home-feature-story-copy h3,
  .home-feature-story-slide--umzug .home-feature-story-copy h3,
  .home-feature-story-slide--warum .home-feature-story-copy h3,
  .home-feature-story-slide--easteregg .home-feature-story-copy h3,
  .home-feature-story-slide--entruempelung .home-feature-story-copy h3,
  .home-feature-story-slide--preise .home-feature-story-copy h3 {
    max-width: min(100%, 12.8ch) !important;
    font-size: clamp(34px, 9.2vw, 37px) !important;
    line-height: 1.03 !important;
  }

  .home-feature-story-slide--tragehilfe .home-feature-story-copy p,
  .home-feature-story-slide--rabatte .home-feature-story-copy p,
  .home-feature-story-slide--umzug .home-feature-story-copy p,
  .home-feature-story-slide--warum .home-feature-story-copy p,
  .home-feature-story-slide--easteregg .home-feature-story-copy p,
  .home-feature-story-slide--entruempelung .home-feature-story-copy p,
  .home-feature-story-slide--preise .home-feature-story-copy p {
    max-width: 30ch !important;
    margin-top: 16px !important;
    font-size: 16px !important;
    line-height: 1.3 !important;
  }

  .home-feature-story-slide--tragehilfe-final .home-feature-story-copy h3,
  .home-feature-story-slide--rabatte-final .home-feature-story-copy h3,
  .home-feature-story-slide--umzug-final .home-feature-story-copy h3,
  .home-feature-story-slide--warum-final .home-feature-story-copy h3,
  .home-feature-story-slide--easteregg-final .home-feature-story-copy h3,
  .home-feature-story-slide--entruempelung-final .home-feature-story-copy h3,
  .home-feature-story-slide--preise-final .home-feature-story-copy h3 {
    max-width: min(100%, 13.4ch) !important;
    font-size: clamp(34px, 9vw, 37px) !important;
  }

  .home-feature-story-slide--tragehilfe-fit-title .home-feature-story-copy h3,
  .home-feature-story-slide--rabatte-fit-title .home-feature-story-copy h3,
  .home-feature-story-slide--umzug-fit-title .home-feature-story-copy h3,
  .home-feature-story-slide--warum-fit-title .home-feature-story-copy h3,
  .home-feature-story-slide--easteregg-fit-title .home-feature-story-copy h3,
  .home-feature-story-slide--entruempelung-fit-title .home-feature-story-copy h3,
  .home-feature-story-slide--preise-fit-title .home-feature-story-copy h3 {
    max-width: min(100%, 13.8ch) !important;
    font-size: clamp(31px, 8.2vw, 34px) !important;
  }

  .home-feature-story-slide--singleline-title .home-feature-story-copy h3 {
    max-width: min(100%, 13.8ch) !important;
    font-size: clamp(31px, 8vw, 33px) !important;
    white-space: normal !important;
  }

  .home-feature-story-slide--tragehilfe-final .home-feature-story-copy p,
  .home-feature-story-slide--rabatte-final .home-feature-story-copy p,
  .home-feature-story-slide--umzug-final .home-feature-story-copy p,
  .home-feature-story-slide--warum-final .home-feature-story-copy p,
  .home-feature-story-slide--easteregg-final .home-feature-story-copy p,
  .home-feature-story-slide--entruempelung-final .home-feature-story-copy p,
  .home-feature-story-slide--preise-final .home-feature-story-copy p {
    max-width: 30ch !important;
  }

  .home-feature-story-slide--preise-text-only .home-feature-story-copy {
    width: 100% !important;
    box-sizing: border-box !important;
    padding: 82px 28px 104px !important;
  }

  .home-feature-story-slide--preise-text-only .home-feature-story-copy h3 {
    max-width: none !important;
    font-size: clamp(32px, 8vw, 36px) !important;
    line-height: 1.04 !important;
    text-wrap: normal !important;
    overflow-wrap: normal !important;
  }

  .home-feature-story-slide--preise-text-only .home-feature-story-copy p {
    max-width: 34ch !important;
    font-size: 16.5px !important;
    line-height: 1.34 !important;
    text-wrap: normal !important;
  }

  .home-feature-story-slide--preise-text-only.home-feature-story-slide--preise-final .home-feature-story-copy h3 {
    font-size: clamp(30px, 7.5vw, 34px) !important;
  }

  .home-feature-story-slide--preise-with-image .home-feature-story-copy {
    padding-top: 80px !important;
    padding-bottom: 0 !important;
  }

  .home-feature-story-slide--preise-down-with-image .home-feature-story-copy {
    bottom: 126px !important;
    padding: 0 34px !important;
  }

  .home-feature-story-slide--preise-down-with-image .home-feature-story-copy h3 {
    font-size: clamp(32px, 8.2vw, 36px) !important;
    line-height: 1.02 !important;
  }

  .home-feature-story-slide--preise-down-with-image .home-feature-story-copy p {
    max-width: 29ch !important;
    margin-top: 16px !important;
    font-size: 16px !important;
    line-height: 1.34 !important;
  }

  .home-feature-story-slide--preise-down-with-image .home-feature-story-price-down-image {
    --story-fixed-top: 34% !important;
    --story-fixed-width: 78% !important;
  }

  .home-feature-story-price-fair-image {
    border-radius: 0 !important;
  }

  .home-feature-story-price-why-image {
    border-radius: 0 !important;
  }

  .home-feature-story-price-down-image {
    border-radius: 0 !important;
  }

  .home-feature-story-cta-stack {
    left: 28px !important;
    right: 28px !important;
    bottom: 24px !important;
  }

  .home-feature-story-ack--secondary {
    min-height: 42px !important;
    font-size: 14px !important;
  }

  .home-feature-story-ack {
    left: 28px !important;
    right: 28px !important;
    bottom: 24px !important;
    min-height: 54px !important;
  }
}

/* Restore the visible Vorteile panel below the service catalog. */
body.home-breakpoints-page.home-page .home-service-catalog + .home-features--benefits {
  box-sizing: border-box !important;
  width: auto !important;
  max-width: 1300px !important;
  margin: clamp(54px, 5.6vw, 76px) auto 0 !important;
  padding: 0 5% !important;
}

body.home-breakpoints-page.home-page .home-service-catalog + .home-features--benefits .home-features-heading {
  position: static !important;
  display: block !important;
  width: auto !important;
  height: auto !important;
  margin: 0 0 30px !important;
  padding: 9px 0 !important;
  border: 0 !important;
  overflow: visible !important;
  clip: auto !important;
  clip-path: none !important;
  white-space: normal !important;
  text-align: left !important;
}

body.home-breakpoints-page.home-page .home-service-catalog + .home-features--benefits .home-features-heading h2 {
  max-width: none !important;
  margin: 0 !important;
  color: #171b2b !important;
  font-size: clamp(38px, 2.8vw, 44px) !important;
  font-weight: 900 !important;
  line-height: 1.02 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}

body.home-breakpoints-page.home-page .home-service-catalog + .home-features--benefits .home-features-grid {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 24px !important;
  align-items: stretch !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
}

body.home-breakpoints-page.home-page .home-service-catalog + .home-features--benefits .home-feature-card {
  appearance: none !important;
  position: relative !important;
  min-height: 250px !important;
  aspect-ratio: auto !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  justify-content: flex-start !important;
  padding: 26px 26px 24px !important;
  border: 0 !important;
  border-radius: 18px !important;
  background: #eef8f1 !important;
  color: #171b2b !important;
  cursor: pointer !important;
  overflow: hidden !important;
  box-shadow: none !important;
  text-align: left !important;
  transition: background-color 0.18s ease !important;
}

body.home-breakpoints-page.home-page .home-service-catalog + .home-features--benefits .home-feature-card:hover,
body.home-breakpoints-page.home-page .home-service-catalog + .home-features--benefits .home-feature-card:focus-visible {
  transform: none !important;
  background: #e6f2ea !important;
  filter: none !important;
  box-shadow: none !important;
}

body.home-breakpoints-page.home-page .home-service-catalog + .home-features--benefits .home-feature-card::before,
body.home-breakpoints-page.home-page .home-service-catalog + .home-features--benefits .home-feature-card::after {
  display: none !important;
  content: none !important;
}

body.home-breakpoints-page.home-page .home-service-catalog + .home-features--benefits .home-feature-copy {
  position: relative !important;
  z-index: 2 !important;
  display: block !important;
  width: auto !important;
  max-width: 27ch !important;
  padding: 0 !important;
}

body.home-breakpoints-page.home-page .home-service-catalog + .home-features--benefits .home-feature-title {
  display: block !important;
  color: #171b2b !important;
  font-size: clamp(22px, 1.35vw, 25px) !important;
  font-weight: 900 !important;
  line-height: 1.08 !important;
  letter-spacing: 0 !important;
}

body.home-breakpoints-page.home-page .home-service-catalog + .home-features--benefits .home-feature-text {
  display: block !important;
  margin-top: 7px !important;
  color: #586079 !important;
  font-size: clamp(15px, 0.98vw, 18px) !important;
  font-weight: 650 !important;
  line-height: 1.33 !important;
  letter-spacing: 0 !important;
}

body.home-breakpoints-page.home-page .home-service-catalog + .home-features--benefits .home-feature-story-icon {
  position: absolute !important;
  right: 25px !important;
  bottom: 25px !important;
  z-index: 1 !important;
  width: 78px !important;
  height: 78px !important;
  display: block !important;
  border: 0 !important;
  border-radius: 0 !important;
  object-fit: contain !important;
  opacity: 1 !important;
  transform: none !important;
}

body.home-breakpoints-page.home-page .home-service-catalog + .home-features--benefits .home-feature-story-icon--fixed-price {
  right: 18px !important;
  bottom: 18px !important;
  width: 100px !important;
  height: 100px !important;
}

body.home-breakpoints-page.home-page .home-service-catalog + .home-features--benefits + .home-feature-story + .home-savings {
  margin-top: clamp(74px, 7vw, 108px) !important;
}

@media (min-width: 768px) and (max-width: 1023px) {
  body.home-breakpoints-page.home-page .home-service-catalog + .home-features--benefits .home-features-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 20px !important;
  }

  body.home-breakpoints-page.home-page .home-service-catalog + .home-features--benefits .home-feature-card {
    min-height: 220px !important;
    padding: 26px 26px 24px !important;
  }
}

@media (max-width: 767px) {
  body.home-breakpoints-page.home-page .home-service-catalog + .home-features--benefits {
    margin-top: 42px !important;
    padding: 0 18px !important;
  }

  body.home-breakpoints-page.home-page .home-service-catalog + .home-features--benefits .home-features-heading {
    margin-bottom: 20px !important;
  }

  body.home-breakpoints-page.home-page .home-service-catalog + .home-features--benefits .home-features-heading h2 {
    font-size: clamp(31px, 9vw, 38px) !important;
    line-height: 1.04 !important;
  }

  body.home-breakpoints-page.home-page .home-service-catalog + .home-features--benefits .home-features-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 12px !important;
  }

  body.home-breakpoints-page.home-page .home-service-catalog + .home-features--benefits .home-feature-card {
    min-height: 188px !important;
    padding: 18px 15px 16px !important;
    border-radius: 16px !important;
  }

  body.home-breakpoints-page.home-page .home-service-catalog + .home-features--benefits .home-feature-title {
    font-size: 19px !important;
    line-height: 1.06 !important;
  }

  body.home-breakpoints-page.home-page .home-service-catalog + .home-features--benefits .home-feature-text {
    max-width: 16ch !important;
    font-size: 13.2px !important;
    line-height: 1.34 !important;
  }

  body.home-breakpoints-page.home-page .home-service-catalog + .home-features--benefits .home-feature-story-icon {
    right: 12px !important;
    bottom: 12px !important;
    width: 56px !important;
    height: 56px !important;
  }

  body.home-breakpoints-page.home-page .home-service-catalog + .home-features--benefits .home-feature-story-icon--fixed-price {
    right: 7px !important;
    bottom: 7px !important;
    width: 72px !important;
    height: 72px !important;
  }
}

/* Homepage panel spacing refinement: final pass after the late section overrides above. */
body.home-breakpoints-page.home-page {
  --home-panel-gap-after-hero: clamp(36px, 3vw, 44px);
  --home-panel-gap-story-to-services: clamp(44px, 3.9vw, 50px);
  --home-panel-gap-services-to-benefits: clamp(50px, 4.5vw, 58px);
  --home-panel-gap-benefits-to-savings: clamp(48px, 4.4vw, 56px);
  --home-panel-gap-related: 34px;
  --home-panel-gap-lower: 48px;
  --home-panel-gap-info-to-tags: 34px;
  --home-panel-gap-footer: 46px;
}

body.home-breakpoints-page.home-page .hero + .home-features--stories,
body.home-breakpoints-page.home-page .home-features--stories {
  margin-top: var(--home-panel-gap-after-hero) !important;
}

body.home-breakpoints-page.home-page .home-features--stories + .home-service-catalog,
body.home-breakpoints-page.home-page .home-features--stories + .home-feature-story + .home-service-catalog {
  margin-top: var(--home-panel-gap-story-to-services) !important;
}

body.home-breakpoints-page.home-page .home-service-catalog + .home-features--benefits {
  margin-top: var(--home-panel-gap-services-to-benefits) !important;
}

body.home-breakpoints-page.home-page .home-service-catalog + .home-features--benefits + .home-feature-story + .home-savings {
  margin-top: var(--home-panel-gap-benefits-to-savings) !important;
}

body.home-breakpoints-page.home-page .home-savings + .home-quick-actions {
  margin-top: var(--home-panel-gap-related) !important;
}

body.home-breakpoints-page.home-page .home-quick-actions + .home-business-teaser,
body.home-breakpoints-page.home-page .home-business-teaser + .home-faq,
body.home-breakpoints-page.home-page .home-faq + .home-info-panels {
  margin-top: var(--home-panel-gap-lower) !important;
}

body.home-breakpoints-page.home-page .home-info-panels + .popular-services--transport {
  margin-top: var(--home-panel-gap-info-to-tags) !important;
}

body.home-breakpoints-page.home-page .popular-services--transport + .site-footer,
body.home-breakpoints-page.home-page .popular-services + .site-footer {
  margin-top: var(--home-panel-gap-footer) !important;
}

@media (min-width: 768px) and (max-width: 1023px) {
  body.home-breakpoints-page.home-page {
    --home-panel-gap-after-hero: 34px;
    --home-panel-gap-story-to-services: 38px;
    --home-panel-gap-services-to-benefits: 40px;
    --home-panel-gap-benefits-to-savings: 36px;
    --home-panel-gap-related: 26px;
    --home-panel-gap-lower: 36px;
    --home-panel-gap-info-to-tags: 28px;
    --home-panel-gap-footer: 36px;
  }

  body.home-breakpoints-page.home-page .hero + .home-features--stories,
  body.home-breakpoints-page.home-page .home-features--stories,
  body.home-breakpoints-page.home-page .home-service-catalog,
  body.home-breakpoints-page.home-page .home-service-catalog + .home-features--benefits,
  body.home-breakpoints-page.home-page .home-savings,
  body.home-breakpoints-page.home-page .home-quick-actions,
  body.home-breakpoints-page.home-page .home-business-teaser,
  body.home-breakpoints-page.home-page .home-faq,
  body.home-breakpoints-page.home-page .home-mail-panel,
  body.home-breakpoints-page.home-page .home-info-panels,
  body.home-breakpoints-page.home-page .home-service-links,
  body.home-breakpoints-page.home-page .popular-services--transport {
    padding-left: 16px !important;
    padding-right: 16px !important;
  }
}

@media (max-width: 767px) {
  body.home-breakpoints-page.home-page {
    --home-panel-gap-after-hero: 26px;
    --home-panel-gap-story-to-services: 30px;
    --home-panel-gap-services-to-benefits: 36px;
    --home-panel-gap-benefits-to-savings: 34px;
    --home-panel-gap-related: 22px;
    --home-panel-gap-lower: 28px;
    --home-panel-gap-info-to-tags: 24px;
    --home-panel-gap-footer: 30px;
  }
}

@media (max-width: 374px) {
  body.home-breakpoints-page.home-page {
    --home-panel-gap-after-hero: 24px;
    --home-panel-gap-story-to-services: 28px;
    --home-panel-gap-services-to-benefits: 32px;
    --home-panel-gap-benefits-to-savings: 30px;
    --home-panel-gap-related: 20px;
    --home-panel-gap-lower: 26px;
    --home-panel-gap-info-to-tags: 22px;
    --home-panel-gap-footer: 28px;
  }
}

/* Align story tiles to the same left edge as the Beliebte Dienstleistungen cards. */
@media (max-width: 767px) {
  body.home-breakpoints-page.home-page .hero + .home-features--stories,
  body.home-breakpoints-page.home-page .home-features--stories {
    padding-left: var(--home-mobile-content-inset, 18px) !important;
    padding-right: var(--home-mobile-content-inset, 18px) !important;
  }
}

@media (min-width: 768px) and (max-width: 1023px) {
  body.home-breakpoints-page.home-page .hero + .home-features--stories,
  body.home-breakpoints-page.home-page .home-features--stories {
    padding-left: 16px !important;
    padding-right: 16px !important;
  }
}

/* ============ Address Details: quiet text action inside the address row ============ */

.address-details-trigger.address-details-trigger--inline {
  position: absolute !important;
  top: -9px !important;
  right: 0 !important;
  z-index: 2 !important;
  width: auto !important;
  height: auto !important;
  min-width: 0 !important;
  min-height: 28px !important;
  margin: 0 !important;
  padding: 9px 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: #687385 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  cursor: pointer !important;
  box-shadow: none !important;
  font-size: 10px !important;
  font-weight: 800 !important;
  line-height: 1 !important;
  letter-spacing: 0 !important;
  white-space: nowrap !important;
  text-align: right !important;
  transition: color 0.16s ease !important;
}

.address-details-trigger.address-details-trigger--inline:hover,
.address-details-trigger.address-details-trigger--inline:focus-visible {
  background: transparent !important;
  color: #16803d !important;
  text-decoration: underline !important;
  text-underline-offset: 2px !important;
  transform: none !important;
  outline: none !important;
}

.address-details-trigger.address-details-trigger--inline.is-filled {
  background: transparent !important;
  color: #087c3a !important;
}

.address-details-trigger.address-details-trigger--inline.is-filled:hover,
.address-details-trigger.address-details-trigger--inline.is-filled:focus-visible {
  background: transparent !important;
  color: #056a30 !important;
}

#mapModal .route-input-group:has(.address-details-trigger--inline) > .input-wrap label {
  pointer-events: none;
}

/* The current address row keeps its action buttons outside the text wrapper.
   Do not retain the old inset that was reserved for an internal clear button. */
#mapModal .route-input-group:has(.address-details-trigger--inline)
  > .input-wrap:not(:has(> .clear-btn)) input,
#mapModal .route-input-group:has(.address-details-trigger--inline)
  > .input-wrap:not(:has(> .clear-btn)) .secondary-address-line {
  padding-right: 4px !important;
}

/* Hide the old full-row layout if any stale markup appears */
.address-details-trigger:not(.address-details-trigger--inline) .address-details-copy,
.address-details-trigger:not(.address-details-trigger--inline) .address-details-arrow,
.address-details-trigger:not(.address-details-trigger--inline) .address-details-icon {
  /* leave alone — original layout still applies for old style */
}

/* ============ Mistplatz-Auto: Inline Button (address modal) ============ */

/* A restrained progress cue for address lookup. It lives beside the route
   label, so the field does not resize and slow searches never feel stalled. */
#mapModal .route-search-indicator {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  color: #87909d;
  font-size: 9px;
  font-weight: 720;
  line-height: 1;
  letter-spacing: 0;
  text-transform: none;
  white-space: nowrap;
  opacity: 0.78;
  animation: route-search-indicator-reveal 0.12s 0.08s both;
}

#mapModal .route-search-indicator[hidden] {
  display: none;
}

#mapModal .route-search-indicator-dot {
  width: 5px;
  height: 5px;
  flex: 0 0 5px;
  border-radius: 999px;
  background: currentColor;
  animation: route-search-indicator-pulse 1s ease-in-out infinite;
}

@keyframes route-search-indicator-reveal {
  from { opacity: 0; }
  to { opacity: 0.78; }
}

@keyframes route-search-indicator-pulse {
  0%, 100% { opacity: 0.35; transform: scale(0.82); }
  48% { opacity: 0.95; transform: scale(1); }
}

@media (prefers-reduced-motion: reduce) {
  #mapModal .route-search-indicator,
  #mapModal .route-search-indicator-dot {
    animation: none;
  }
}

/* Keep the secondary route action with the route it changes. The compact,
   dashed row continues the address-card rhythm without competing with the
   primary confirmation button in the footer. */
#mapModal .route-list-scroll {
  display: contents;
}

/* Autocomplete remains scrollable, but its native overlay scrollbar can
   outlive the suggestion layer for a few frames after an address is chosen.
   Hide that browser-owned indicator so it cannot flash over the restored
   address panel while preserving wheel, trackpad and touch scrolling. */
#mapModal .suggestions-list {
  -ms-overflow-style: none;
  scrollbar-width: none;
}

#mapModal .suggestions-list::-webkit-scrollbar {
  display: none;
  width: 0;
  height: 0;
}

#mapModal .route-list-actions {
  flex: 0 0 auto;
  padding: 0 2px 6px;
}

#mapModal .route-list-actions:has(#addStopBtn[style*="display: none"]),
#mapModal .map-panel.autocomplete-focus-mode .route-list-actions,
#mapModal .map-panel.autocomplete-suggestions-open .route-list-actions,
#mapModal.mobile-map-picker .route-list-actions {
  display: none;
}

#mapModal .route-list-add-stop {
  min-height: 52px;
  justify-content: flex-start;
  gap: 12px;
  padding: 6px 12px;
  border: 1px dashed #cbd5df;
  border-radius: 16px;
  background: #fbfcfd;
  color: #475467;
  text-align: left;
}

#mapModal .route-list-add-stop:hover,
#mapModal .route-list-add-stop:focus-visible {
  border-color: rgba(24, 185, 79, 0.58);
  background: #f6fcf7;
  color: #166534;
  box-shadow: inset 0 0 0 1px rgba(24, 185, 79, 0.08);
}

#mapModal .route-list-add-stop-icon {
  display: inline-flex;
  width: 38px;
  height: 38px;
  flex: 0 0 38px;
  align-items: center;
  justify-content: center;
  border-radius: 12px;
  background: #eef9f1;
  color: #18a94a;
  font-size: 21px;
  transition: background-color 0.18s ease, color 0.18s ease;
}

#mapModal .route-list-add-stop:hover .route-list-add-stop-icon,
#mapModal .route-list-add-stop:focus-visible .route-list-add-stop-icon {
  background: #ddf5e4;
  color: #0f8f3d;
}

#mapModal .route-list-add-stop-label {
  min-width: 0;
  font-size: 14px;
  font-weight: 780;
  line-height: 1.2;
  letter-spacing: -0.01em;
}

#mapModal .add-mistplatz-btn {
  margin-bottom: 0;
  border-color: rgba(21, 184, 101, 0.22) !important;
  background: rgba(21, 184, 101, 0.06) !important;
  color: #0a5a32 !important;
}

#mapModal .panel-bottom:has(.add-mistplatz-btn) {
  position: static !important;
  bottom: auto !important;
  margin-top: auto !important;
  box-shadow: none;
}

#mapModal .panel-bottom:has(.add-mistplatz-btn) > .add-mistplatz-btn {
  grid-column: 1 / -1;
}

#mapModal .add-mistplatz-btn:hover,
#mapModal .add-mistplatz-btn:focus-visible {
  background: rgba(21, 184, 101, 0.12) !important;
  border-color: rgba(21, 184, 101, 0.4) !important;
  color: #074d2a !important;
}

#mapModal .add-mistplatz-btn.is-active {
  background: #15b865 !important;
  border-color: #15b865 !important;
  color: #ffffff !important;
}

#mapModal .add-mistplatz-btn.is-active:hover,
#mapModal .add-mistplatz-btn.is-active:focus-visible {
  background: #0fa056 !important;
  border-color: #0fa056 !important;
}

#mapModal .add-mistplatz-btn.is-waiting {
  background: rgba(21, 184, 101, 0.18) !important;
  border-color: rgba(21, 184, 101, 0.45) !important;
  color: #074d2a !important;
  animation: mistplatzPulse 2.2s ease-in-out infinite;
}

@keyframes mistplatzPulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(21, 184, 101, 0); }
  50%      { box-shadow: 0 0 0 6px rgba(21, 184, 101, 0.14); }
}

#mapModal .add-mistplatz-btn .mistplatz-btn-icon {
  font-size: 22px;
}

#mapModal .panel-bottom:has(.add-mistplatz-btn) > .add-mistplatz-btn img.mistplatz-btn-icon {
  display: block;
  width: 22px !important;
  min-width: 22px !important;
  max-width: 22px !important;
  height: 22px !important;
  flex: 0 0 22px !important;
  object-fit: contain;
}

/* ============ Mistplatz-Auto: Conflict Modal + Toast ============ */

.disposal-schedule-notice {
  display: grid;
  grid-template-columns: 22px minmax(0, 1fr);
  align-items: start;
  gap: 10px;
  margin-top: 12px;
  padding: 12px 14px;
  border: 1px solid rgba(21, 184, 101, 0.22);
  border-radius: 14px;
  background: rgba(21, 184, 101, 0.07);
  color: #334155;
  font-size: 12px;
  font-weight: 650;
  line-height: 1.42;
}

.disposal-schedule-notice[hidden] {
  display: none !important;
}

.disposal-schedule-notice .material-icons-round {
  color: #087c3a;
  font-size: 20px;
  line-height: 1.15;
}

.calendar-day-btn.is-facility-closed {
  opacity: 0.2;
  text-decoration: line-through;
  text-decoration-thickness: 1px;
}

.calendar-day-btn.is-facility-closed.active {
  background: transparent;
  color: inherit;
}

.time-num.is-unavailable,
.time-num:disabled {
  color: #cbd1da;
  opacity: 0.24;
  cursor: not-allowed;
}

.time-num.is-unavailable.active,
.time-num:disabled.active {
  color: #cbd1da;
  font-size: 16px;
  font-weight: 600;
}

#dateModal .date-picker-value-btn:disabled,
#dateModal .date-confirm-btn:disabled {
  opacity: 0.45;
  cursor: not-allowed;
  box-shadow: none !important;
}

#mistplatzConflictModal[hidden] {
  display: none !important;
}

#mistplatzConflictModal.active {
  opacity: 1;
  pointer-events: auto;
}

.mistplatz-conflict-content {
  max-width: 460px;
}

.mistplatz-conflict-content .options-title {
  margin-bottom: 4px;
}

.mistplatz-conflict-summary {
  margin: 0 0 16px;
  color: #1a1d18;
  font-size: 16px;
  font-weight: 600;
  line-height: 1.4;
}

.mistplatz-conflict-suggestion {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 14px 16px;
  margin-bottom: 18px;
  border-radius: 14px;
  background: rgba(21, 184, 101, 0.08);
  border: 1px solid rgba(21, 184, 101, 0.22);
}

.mistplatz-conflict-label {
  color: #087c3a;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.mistplatz-conflict-slot {
  color: #0a1410;
  font-size: 17px;
  font-weight: 800;
}

.mistplatz-conflict-actions {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.mistplatz-conflict-btn {
  appearance: none;
  width: 100%;
  min-height: 48px;
  padding: 0 18px;
  border: 1px solid transparent;
  border-radius: 14px;
  background: #f3f5f8;
  color: #111827;
  font: inherit;
  font-size: 15px;
  font-weight: 800;
  cursor: pointer;
  box-shadow: none !important;
  transition: background 0.16s ease, border-color 0.16s ease, color 0.16s ease;
}

.mistplatz-conflict-btn:hover {
  background: #e7ebf2;
}

.mistplatz-conflict-btn:focus-visible {
  outline: 2px solid #087c3a;
  outline-offset: 2px;
}

.mistplatz-conflict-btn--primary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  background: #15b865;
  color: #ffffff;
  min-height: 52px;
  font-size: 16px;
  box-shadow: none !important;
}

.mistplatz-conflict-btn--primary:hover {
  background: #0fa056;
}

.mistplatz-conflict-btn--primary:focus-visible {
  outline-color: #0a6a36;
}

.mistplatz-conflict-btn--primary .material-icons-round {
  font-size: 20px;
}

.mistplatz-conflict-btn--choice {
  display: grid;
  grid-template-columns: 24px minmax(0, 1fr) 20px;
  align-items: center;
  gap: 12px;
  min-height: 58px;
  padding: 9px 14px;
  border-color: #e3e7ed;
  background: #ffffff;
  text-align: left;
}

.mistplatz-conflict-btn--choice:hover {
  border-color: #cbd2dc;
  background: #f7f8fa;
}

.mistplatz-conflict-btn-icon {
  color: #087c3a;
  font-size: 22px;
}

.mistplatz-conflict-btn-copy {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: 2px;
}

.mistplatz-conflict-btn-copy strong {
  font-size: 15px;
  font-weight: 800;
  line-height: 1.25;
}

.mistplatz-conflict-btn-copy small {
  color: #6b7280;
  font-size: 12px;
  font-weight: 600;
  line-height: 1.25;
}

.mistplatz-conflict-btn-arrow {
  color: #8a929f;
  font-size: 20px;
}

.mistplatz-conflict-btn--ghost {
  background: transparent;
  color: #6b7280;
  font-weight: 700;
}

.mistplatz-conflict-btn--ghost:hover,
.mistplatz-conflict-btn--ghost:focus-visible {
  background: rgba(0, 0, 0, 0.05);
  color: #1f2937;
}

.mistplatz-auto-toast {
  position: fixed;
  left: 50%;
  top: 32px;
  z-index: 30000;
  max-width: min(560px, calc(100vw - 32px));
  padding: 14px 22px;
  border-radius: 999px;
  background: rgba(15, 23, 42, 0.94);
  color: #ffffff;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.4;
  text-align: center;
  box-shadow: 0 18px 40px rgba(15, 23, 42, 0.32);
  transform: translateX(-50%) translateY(-20px);
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.22s ease, transform 0.22s ease;
  backdrop-filter: blur(8px);
}

.mistplatz-auto-toast.is-visible {
  opacity: 1;
  transform: translateX(-50%) translateY(0);
}

@media (max-width: 600px) {
  .mistplatz-auto-toast {
    left: 16px;
    right: 16px;
    top: 16px;
    max-width: none;
    transform: translateY(-20px);
  }
  .mistplatz-auto-toast.is-visible {
    transform: translateY(0);
  }
}

/* === Social Proof Stats — replaces FlexLast Vorteile cards === */
body.home-page .home-stats {
  max-width: 1300px;
  margin: clamp(36px, 4vw, 60px) auto 0;
  padding: 0 5%;
}

body.home-page .home-stats-eyebrow {
  display: block;
  margin: 0 0 28px;
  color: #6b7280;
  font-size: clamp(12px, 0.95vw, 14px);
  font-weight: 700;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  text-align: center;
}

body.home-page .home-stats-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: clamp(20px, 3vw, 48px);
  align-items: start;
  text-align: center;
}

body.home-page .home-stat {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  padding: clamp(14px, 1.6vw, 22px) 0;
}

body.home-page .home-stat + .home-stat::before {
  content: '';
  position: absolute;
  top: 24%;
  bottom: 24%;
  left: calc(clamp(20px, 3vw, 48px) / -2);
  width: 1px;
  background: #e5e7eb;
}

body.home-page .home-stat-value {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: #111827;
  font-size: clamp(20px, 2vw, 26px);
  font-weight: 900;
  line-height: 1.1;
  letter-spacing: -0.025em;
  text-wrap: balance;
}

body.home-page .home-stat-value--rating .home-stat-star {
  color: #facc15;
  font-size: 0.9em;
  margin-right: 4px;
}

body.home-page .home-stat-label {
  color: #6b7280;
  font-size: clamp(13px, 1vw, 15px);
  font-weight: 600;
  line-height: 1.35;
}

@media (max-width: 767px) {
  body.home-page .home-stats {
    padding: 0 18px;
  }
  body.home-page .home-stats-eyebrow {
    margin-bottom: 20px;
  }
  body.home-page .home-stats-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px 20px;
  }
  body.home-page .home-stat + .home-stat::before {
    display: none;
  }
  body.home-page .home-stat-value {
    font-size: clamp(28px, 8.6vw, 38px);
  }
}

/* Spacing: when home-stats is followed by other sections (experimental page) */
body.home-page .home-stats + .home-business-teaser,
body.home-page .home-stats + .home-faq,
body.home-page .home-stats + .home-info-panels {
  margin-top: clamp(48px, 5vw, 72px) !important;
}

body.home-page .home-features--stories + .home-stats,
body.home-page .home-service-catalog + .home-stats {
  margin-top: clamp(48px, 5vw, 72px) !important;
}

body.home-page .home-business-teaser-media .hero-gallery-upload-controls {
  position: absolute;
  top: auto;
  right: 16px;
  bottom: 16px;
  z-index: 4;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  width: auto;
  height: auto;
  padding: 6px;
  border: 1px solid rgba(226, 232, 240, 0.86);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.9);
  box-shadow: 0 14px 30px rgba(15, 23, 42, 0.16);
  backdrop-filter: blur(14px);
  opacity: 0;
  pointer-events: none;
  transform: translateY(4px);
  transition: opacity 0.18s ease, transform 0.18s ease;
}

body.home-page .home-business-teaser-media:hover .hero-gallery-upload-controls,
body.home-page .home-business-teaser-media:focus-within .hero-gallery-upload-controls,
body.home-page .home-business-teaser-media.is-drag-over .hero-gallery-upload-controls {
  opacity: 1;
  pointer-events: auto;
  transform: translateY(0);
}

body.home-page .home-business-teaser-media .hero-gallery-upload-button,
body.home-page .home-business-teaser-media .hero-gallery-nav {
  position: static;
  top: auto;
  right: auto;
  z-index: auto;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  padding: 0;
  border: 0;
  border-radius: 999px;
  background: #111827;
  color: #ffffff;
  cursor: pointer;
  transition: transform 0.18s ease, background-color 0.18s ease, box-shadow 0.18s ease;
}

body.home-page .home-business-teaser-media .hero-gallery-nav {
  background: #f4f6f8;
  color: #111827;
}

body.home-page .home-business-teaser-media .hero-gallery-nav[hidden],
body.home-page .home-business-teaser-media .hero-gallery-counter[hidden],
body.home-page .home-business-teaser-media .hero-gallery-scale-controls[hidden] {
  display: none !important;
}

body.home-page .home-business-teaser-media.has-test-image {
  background: transparent;
}

body.home-page .home-business-teaser-media.has-test-image .hero-placeholder-upload-image {
  background: transparent;
  transform: scale(var(--hero-gallery-image-scale, 1));
  transform-origin: center;
}

body.home-page .home-business-teaser-media .hero-gallery-scale-controls {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  height: 40px;
  padding: 0 5px;
  border-radius: 999px;
  background: #f4f6f8;
}

body.home-page .home-business-teaser-media .hero-gallery-scale-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  padding: 0;
  border: 0;
  border-radius: 999px;
  background: #ffffff;
  color: #111827;
  cursor: pointer;
  transition: transform 0.18s ease, background-color 0.18s ease, opacity 0.18s ease;
}

body.home-page .home-business-teaser-media .hero-gallery-scale-button:disabled {
  cursor: default;
  opacity: 0.42;
}

body.home-page .home-business-teaser-media .hero-gallery-scale-button:not(:disabled):hover,
body.home-page .home-business-teaser-media .hero-gallery-scale-button:focus-visible {
  background: #e9eef4;
  transform: translateY(-1px);
}

body.home-page .home-business-teaser-media .hero-gallery-scale-value {
  min-width: 42px;
  color: #111827;
  font-size: 12px;
  font-weight: 850;
  line-height: 1;
  text-align: center;
  font-variant-numeric: tabular-nums;
}

body.home-page .home-business-teaser-media .hero-gallery-counter {
  min-width: 42px;
  color: #111827;
  font-size: 13px;
  font-weight: 800;
  line-height: 1;
  text-align: center;
}

body.home-page .home-business-teaser-media .hero-gallery-upload-button:hover,
body.home-page .home-business-teaser-media .hero-gallery-upload-button:focus-visible,
body.home-page .home-business-teaser-media .hero-gallery-nav:hover,
body.home-page .home-business-teaser-media .hero-gallery-nav:focus-visible {
  background: #ffffff;
  color: #111827;
  box-shadow: 0 10px 24px rgba(15, 23, 42, 0.14);
  transform: translateY(-1px);
}

body.home-page .home-business-teaser-media .hero-gallery-upload-button .material-icons-round,
body.home-page .home-business-teaser-media .hero-gallery-nav .material-icons-round,
body.home-page .home-business-teaser-media .hero-gallery-scale-button .material-icons-round {
  font-size: 21px;
}

@media (max-width: 760px) {
  body.home-page .home-business-teaser-media .hero-gallery-upload-controls {
    right: 12px;
    bottom: 12px;
    gap: 5px;
    padding: 5px;
  }

  body.home-page .home-business-teaser-media .hero-gallery-upload-button,
  body.home-page .home-business-teaser-media .hero-gallery-nav {
    width: 38px;
    height: 38px;
  }

  body.home-page .home-business-teaser-media .hero-gallery-scale-controls {
    height: 38px;
  }

  body.home-page .home-business-teaser-media .hero-gallery-scale-button {
    width: 28px;
    height: 28px;
  }
}

/* Keep the shared header identical on the start page and service pages. */
body.home-breakpoints-page.home-page .flexlast-shared-header {
  box-shadow: none !important;
}

@media (min-width: 1101px) {
  body.home-breakpoints-page.home-page {
    padding-top: 108px !important;
  }

  body.home-breakpoints-page.home-page .flexlast-shared-header {
    padding: 8px 0 10px !important;
  }

  body.home-breakpoints-page.home-page .flexlast-shared-header .top-bar {
    margin-bottom: 8px !important;
    padding-bottom: 8px !important;
    color: #666 !important;
  }

  body.home-breakpoints-page.home-page .flexlast-shared-header .header-audience-button {
    height: 38px !important;
    padding: 0 18px !important;
    border-radius: 16px !important;
    font-size: 16px !important;
  }

  body.home-breakpoints-page.home-page .flexlast-shared-header .header-contact-cluster {
    gap: 10px !important;
  }

  body.home-breakpoints-page.home-page .flexlast-shared-header .header-phone-cta {
    font-size: 11px !important;
    color: #0f8a3d !important;
  }

  body.home-breakpoints-page.home-page .flexlast-shared-header .header-phone-number {
    font-size: 13px !important;
    letter-spacing: 0.01em !important;
  }

  body.home-breakpoints-page.home-page .flexlast-shared-header .header-call-button {
    width: 36px !important;
    height: 36px !important;
    background: #5abc46 !important;
  }

  body.home-breakpoints-page.home-page .flexlast-shared-header .main-nav {
    min-height: 40px !important;
  }

  body.home-breakpoints-page.home-page .flexlast-shared-header .nav-links {
    gap: 28px !important;
    padding: 0 !important;
  }

  body.home-breakpoints-page.home-page .flexlast-shared-header .header-action-button:not(.header-context-button) {
    width: 42px !important;
    min-width: 42px !important;
    height: 42px !important;
    min-height: auto !important;
  }
}

@media (max-width: 767px) {
  body.home-breakpoints-page.home-page {
    padding-top: 64px !important;
  }

  body.home-breakpoints-page.home-page .flexlast-shared-header {
    padding: 9px 0 !important;
  }
}

@media (max-width: 979px) {
  body.home-breakpoints-page.home-page .hero {
    --home-mobile-hero-column: min(100%, 490px);
    align-items: center !important;
    flex-direction: column !important;
    gap: clamp(10px, 1.6vw, 14px) !important;
  }

  body.home-breakpoints-page.home-page .hero-left {
    order: 1 !important;
    width: var(--home-mobile-hero-column) !important;
    max-width: 490px !important;
    margin-inline: auto !important;
  }

  body.home-breakpoints-page.home-page .hero-right {
    order: 2 !important;
    width: var(--home-mobile-hero-column) !important;
    max-width: 490px !important;
    margin: clamp(8px, 1.8vw, 14px) auto 0 !important;
  }

  body.home-breakpoints-page.home-page .hero-spotlight,
  body.home-breakpoints-page.home-page .hero-spotlight-copy,
  body.home-breakpoints-page.home-page .hero-image-placeholder,
  body.home-breakpoints-page.home-page .hero-live-map {
    width: 100% !important;
    max-width: 100% !important;
  }

  body.home-breakpoints-page.home-page .hero-spotlight {
    margin-inline: 0 !important;
  }

  body.home-breakpoints-page.home-page .hero-image-placeholder {
    margin-top: clamp(14px, 3.4vw, 20px) !important;
  }

}

@media (max-width: 767px) {
  body.home-breakpoints-page.home-page .hero {
    padding-bottom: 16px !important;
  }
}

/* === Einheitliche Bestellpanel-Typografie (Mobil + Tablet, ≤979px) =======
   Ersetzt den Per-Breakpoint-Wildwuchs durch ein Raster:
   1) Micro-Labels (EINGEBEN/FAHRZEUGTYP/MIETDAUER/HINWEIS/Hilfe): 10.5px
   2) Kartenwerte (Fahrzeug, Mietdauer, Optionen): 16.5px / 800
   3) Eingaben & Hilfe-Titel: 15.5px / 750-800
   4) Sekundärtexte: 12.5-14.5px / 600
   Steht bewusst am Dateiende und gewinnt damit gegen die Band-Regeln oben. */
@media (max-width: 979px) {
  body.home-breakpoints-page.home-page #quickOrderWidget .address-col .label,
  body.home-breakpoints-page.home-page #quickOrderWidget .truck-field-label,
  body.home-breakpoints-page.home-page #quickOrderWidget .service-comment-label,
  body.home-breakpoints-page.home-page #quickOrderWidget .counter-texts span {
    font-size: 10.5px !important;
    font-weight: 750 !important;
    line-height: 1.05 !important;
    letter-spacing: 0.07em !important;
    color: #667085 !important;
  }

  /* "MIETDAUER" hat nur ~65px Spaltenbreite neben dem Stepper –
     minimal kleiner und enger gesperrt als die übrigen Labels. */
  body.home-breakpoints-page.home-page #quickOrderWidget .time-card .time-info .label::after {
    font-size: 10px !important;
    font-weight: 750 !important;
    letter-spacing: 0.045em !important;
    color: #667085 !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .truck-main-line {
    font-size: clamp(14.5px, 4.4vw, 16.5px) !important;
    font-weight: 800 !important;
    line-height: 1.2 !important;
    letter-spacing: -0.03em !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .truck-main-name {
    font-weight: 800 !important;
    letter-spacing: inherit !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .time-card .time-info span:last-child,
  body.home-breakpoints-page.home-page #quickOrderWidget .time-info #rentalTimeText {
    font-size: 16.5px !important;
    font-weight: 800 !important;
    line-height: 1.15 !important;
    letter-spacing: -0.03em !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .options-card > span:not(.options-control-shell)::after {
    font-size: 16.5px !important;
    font-weight: 800 !important;
    letter-spacing: -0.03em !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .address-col input {
    font-size: clamp(15px, 4vw, 15.5px) !important;
    font-weight: 750 !important;
    letter-spacing: -0.026em !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .loader-text span:first-child,
  body.home-breakpoints-page.home-page #quickOrderWidget #loadersTextLine1 {
    font-size: 15.5px !important;
    font-weight: 800 !important;
    letter-spacing: -0.026em !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .counter-texts strong {
    font-size: 17px !important;
    font-weight: 800 !important;
    letter-spacing: -0.02em !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .loader-text span:last-child,
  body.home-breakpoints-page.home-page #quickOrderWidget #loadersTextLine2 {
    font-size: 12.5px !important;
    font-weight: 600 !important;
    line-height: 1.38 !important;
    letter-spacing: -0.012em !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .service-comment-value {
    font-size: 14.5px !important;
    font-weight: 600 !important;
    letter-spacing: -0.018em !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .rental-time-hint-text {
    font-size: 13px !important;
    font-weight: 600 !important;
    line-height: 1.42 !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .radio-text {
    font-size: 14.5px !important;
    font-weight: 700 !important;
    line-height: 1.3 !important;
    letter-spacing: -0.022em !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .calendar-wrap span:last-child {
    font-size: 13.5px !important;
    font-weight: 750 !important;
    line-height: 1.24 !important;
    letter-spacing: -0.022em !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .checkout-label {
    font-size: 17px !important;
    font-weight: 750 !important;
    letter-spacing: -0.025em !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .total-price {
    font-size: clamp(26px, 7.4vw, 30px) !important;
    font-weight: 900 !important;
    line-height: 0.98 !important;
    letter-spacing: -0.05em !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .wallet-badge {
    font-size: 10px !important;
    font-weight: 800 !important;
    letter-spacing: 0.06em !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .checkout-assurance > span {
    font-size: 11.5px !important;
    font-weight: 750 !important;
    letter-spacing: -0.012em !important;
  }
}

@media (max-width: 374px) {
  body.home-breakpoints-page.home-page #quickOrderWidget .time-card .time-info .label::after {
    font-size: 9.5px !important;
    letter-spacing: 0.03em !important;
  }
}

/* Phone/tablet homepage order: booking panel before the proof hero. */
@media (max-width: 979px) {
  body.home-breakpoints-page.home-page .hero {
    --home-mobile-hero-column: min(100%, 490px);
    align-items: center !important;
    flex-direction: column !important;
    gap: clamp(18px, 5.4vw, 24px) !important;
    padding-top: 16px !important;
    padding-bottom: 32px !important;
  }

  body.home-breakpoints-page.home-page .hero-right,
  body.home-breakpoints-page.home-page #quickOrderWidget {
    order: 1 !important;
    width: var(--home-mobile-hero-column, min(100%, 490px)) !important;
    max-width: 490px !important;
    margin: 0 auto !important;
  }

  body.home-breakpoints-page.home-page .hero-left {
    order: 2 !important;
    width: var(--home-mobile-hero-column, min(100%, 490px)) !important;
    max-width: 490px !important;
    padding-top: 0 !important;
    margin: 0 auto !important;
  }

  body.home-breakpoints-page.home-page .hero-spotlight {
    margin-top: 0 !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget::before {
    content: none !important;
    display: none !important;
  }
}

/* Keep booking +/- controls stationary on hover. */
body.home-breakpoints-page.home-page #quickOrderWidget .counter-box button:hover:not(:disabled),
body.home-breakpoints-page.home-page #quickOrderWidget .counter-btn:hover:not(:disabled),
body.home-breakpoints-page.home-page #quickOrderWidget .vert-controls button:hover:not(:disabled) {
  transform: none !important;
}

body.home-breakpoints-page.home-page #quickOrderWidget .counter-box button:active:not(:disabled),
body.home-breakpoints-page.home-page #quickOrderWidget .counter-btn:active:not(:disabled),
body.home-breakpoints-page.home-page #quickOrderWidget .vert-controls button:active:not(:disabled) {
  transform: scale(0.96) !important;
}

/* Phone/tablet hero copy is secondary after the booking panel. */
@media (max-width: 979px) {
  html body.home-page.home-page--de.home-breakpoints-page .hero-spotlight .hero-spotlight-copy h1 {
    max-width: 100% !important;
    font-size: clamp(30px, 7.65vw, 36px) !important;
    line-height: 1.09 !important;
    letter-spacing: -0.021em !important;
    margin-bottom: 7px !important;
  }

  html body.home-page.home-page--de.home-breakpoints-page .hero-spotlight .hero-spotlight-copy .hero-spotlight-accent {
    max-width: 29ch !important;
    font-size: clamp(15.5px, 4vw, 17.5px) !important;
    line-height: 1.35 !important;
    letter-spacing: -0.014em !important;
  }

  body.home-breakpoints-page.home-page .hero-image-placeholder {
    margin-top: 14px !important;
  }

  body.home-breakpoints-page.home-page .hero-spotlight-copy {
    align-items: center !important;
    text-align: center !important;
  }

  html body.home-page.home-page--de.home-breakpoints-page .hero-spotlight .hero-spotlight-copy h1,
  html body.home-page.home-page--de.home-breakpoints-page .hero-spotlight .hero-spotlight-copy .hero-spotlight-accent {
    margin-left: auto !important;
    margin-right: auto !important;
    text-align: center !important;
  }
}

@media (min-width: 980px) and (max-width: 1139px) {
  body.home-breakpoints-page.home-page .flexlast-shared-header .header-top-meta {
    gap: 20px !important;
  }

  body.home-breakpoints-page.home-page .flexlast-shared-header .header-audience-switch {
    margin-left: 10px !important;
  }
}

/* Shared booking-panel polish across pages that use the homepage panel CSS. */
body.home-breakpoints-page.home-page #quickOrderWidget .truck-main-separator {
  width: 6px !important;
  height: 6px !important;
  min-width: 6px !important;
  margin: 0 2px !important;
  border-radius: 999px !important;
  background: #54ad3c !important;
  color: transparent !important;
  font-size: 0 !important;
  line-height: 1 !important;
  opacity: 1 !important;
  transform: translateY(1px) !important;
}

body.home-breakpoints-page.home-page #quickOrderWidget .options-control-shell {
  box-shadow: none !important;
}

body.home-breakpoints-page.home-page #quickOrderWidget .options-icon {
  line-height: 1 !important;
  opacity: 1 !important;
}

body.home-breakpoints-page.home-page.company-dark-page #quickOrderWidget .truck-main-line,
body.home-breakpoints-page.home-page.company-dark-page #quickOrderWidget .arrow-icon,
body.home-breakpoints-page.home-page.company-dark-page #quickOrderWidget .calendar-wrap,
body.home-breakpoints-page.home-page.company-dark-page #quickOrderWidget .counter-texts strong,
body.home-breakpoints-page.home-page.company-dark-page #quickOrderWidget #loaderCountVal {
  color: var(--company-text, #f7f7f7) !important;
}

body.home-breakpoints-page.home-page.company-dark-page #quickOrderWidget .counter-texts > span,
body.home-breakpoints-page.home-page.company-dark-page #quickOrderWidget .counter-texts .info-icon {
  color: var(--company-text-soft, #d7d7d7) !important;
}

@media (max-width: 350px) {
  body.profile-dashboard-page.home-breakpoints-page.home-page #quickOrderWidget .options-card > span:first-child,
  body.profile-dashboard-page.home-breakpoints-page.home-page #quickOrderWidget .options-card > span:first-child::after {
    width: auto !important;
    max-width: none !important;
    overflow: visible !important;
    text-overflow: clip !important;
    white-space: normal !important;
  }

  body.profile-dashboard-page.home-breakpoints-page.home-page #quickOrderWidget .time-info,
  body.profile-dashboard-page.home-breakpoints-page.home-page #quickOrderWidget .time-info #rentalTimeText,
  body.profile-dashboard-page.home-breakpoints-page.home-page #quickOrderWidget .time-card .label::after {
    width: auto !important;
    max-width: none !important;
    overflow: visible !important;
    text-overflow: clip !important;
    white-space: nowrap !important;
  }
}

/* Keep the address-swap action visually light at every viewport while
   preserving its full touch target. */
body.home-page.home-breakpoints-page #quickOrderWidget .address-card .swap-btn,
body.home-page.home-breakpoints-page #quickOrderWidget .address-card .swap-btn:hover,
body.home-page.home-breakpoints-page #quickOrderWidget .address-card .swap-btn:focus-visible {
  border-color: transparent !important;
  background: transparent !important;
  box-shadow: none !important;
}

/* Vehicle picker: allow the descender in “Tragehilfe” to render fully. */
body.home-page:not(.order-focus-page) #truckModal .truck-row--loaders-only .truck-name {
  overflow: visible !important;
}

/* Route editor: visually connect the heading to the address cards and align
   its copy with the cards' inner content at every breakpoint. */
body.home-page.home-breakpoints-page #mapModal:not(.mobile-map-picker) .map-panel-titlebar {
  margin: 4px 0 10px !important;
}

body.home-page.home-breakpoints-page #mapModal:not(.mobile-map-picker) .map-panel-titlebar > div:first-child {
  margin-left: 18px !important;
}

body.home-page.home-breakpoints-page #mapModal .map-panel-status {
  border-color: #dbe1e8;
  background: #f4f6f8;
  color: #475569;
}

body.home-page.home-breakpoints-page #mapModal .map-interaction-lock {
  display: none;
}

/* Soften the one-time reflow when an already open route editor crosses the
   desktop/tablet/phone boundaries. The JS class is removed after the layout
   and Google Maps viewport have both been recalculated. */
body.home-page.home-breakpoints-page #mapModal.route-viewport-switching .map-modal-content {
  animation: route-editor-viewport-resync 0.36s ease both !important;
}

@keyframes route-editor-viewport-resync {
  from { opacity: 0.82; }
  to { opacity: 1; }
}

@media (prefers-reduced-motion: reduce) {
  body.home-page.home-breakpoints-page #mapModal.route-viewport-switching .map-modal-content {
    animation: none !important;
  }
}

/* Mobile route editor: map overview with an address bottom sheet. Tapping an
   address expands the editor; resolving the final required address brings the
   route map back automatically. */
@media (max-width: 979px) {
  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode:not(.mobile-map-picker) {
    align-items: stretch !important;
    justify-content: stretch !important;
    padding: 0 !important;
    background: #eef2f4 !important;
    backdrop-filter: none !important;
  }

  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode:not(.mobile-map-picker) .map-modal-content {
    position: relative !important;
    display: flex !important;
    flex-direction: column !important;
    width: 100vw !important;
    max-width: none !important;
    height: 100dvh !important;
    max-height: 100dvh !important;
    gap: 0 !important;
    overflow: hidden !important;
    border-radius: 0 !important;
    background: #eef2f4 !important;
    box-shadow: none !important;
  }

  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode:not(.mobile-map-picker) .map-container {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    min-height: 42dvh !important;
    max-height: none !important;
    flex: 1 1 52dvh !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
  }

  /* The map above an expanded phone/tablet address sheet is preview-only.
     A dedicated transparent shield prevents accidental address replacement;
     explicit .mobile-map-picker mode remains fully interactive. */
  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode:not(.mobile-map-picker) .map-interaction-lock {
    position: absolute !important;
    z-index: 2 !important;
    inset: 0 !important;
    display: block !important;
    pointer-events: auto !important;
    touch-action: none !important;
    background: transparent !important;
  }

  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode:not(.mobile-map-picker) .map-panel {
    position: relative !important;
    z-index: 3 !important;
    width: 100% !important;
    height: min(52dvh, 500px) !important;
    min-height: min(52dvh, 500px) !important;
    flex: 0 0 min(52dvh, 500px) !important;
    gap: 8px !important;
    margin-top: -22px !important;
    padding: 18px 14px max(12px, env(safe-area-inset-bottom)) !important;
    overflow: hidden !important;
    border-radius: 28px 28px 0 0 !important;
    background: #ffffff !important;
    box-shadow: 0 -16px 42px rgba(15, 23, 42, 0.14) !important;
    transition: height 0.52s cubic-bezier(0.22, 1, 0.36, 1), min-height 0.52s cubic-bezier(0.22, 1, 0.36, 1), flex-basis 0.52s cubic-bezier(0.22, 1, 0.36, 1), margin 0.52s cubic-bezier(0.22, 1, 0.36, 1), padding 0.52s cubic-bezier(0.22, 1, 0.36, 1), border-radius 0.52s ease, box-shadow 0.42s ease !important;
  }

  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode:not(.mobile-map-picker) .map-panel::before {
    content: "";
    display: block;
    flex: 0 0 auto;
    width: 44px;
    height: 5px;
    margin: -7px auto 1px;
    border-radius: 999px;
    background: #e8eaee;
  }

  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode:not(.mobile-map-picker) .map-panel-titlebar {
    flex: 0 0 auto !important;
    margin: 0 4px 2px !important;
  }

  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode:not(.mobile-map-picker) .map-panel-titlebar > div:first-child {
    margin-left: 8px !important;
  }

  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode:not(.mobile-map-picker) .route-inputs {
    flex: 0 1 auto !important;
    min-height: 0 !important;
    padding: 1px 2px 4px !important;
    overflow-x: visible !important;
    overflow-y: auto !important;
  }

  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode:not(.mobile-map-picker) .route-input-block {
    margin-bottom: 8px !important;
  }

  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode:not(.mobile-map-picker) .route-input-group {
    min-height: 66px !important;
    padding-top: 7px !important;
    padding-bottom: 7px !important;
    border-radius: 20px !important;
  }

  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode:not(.mobile-map-picker) .step-num {
    height: 48px !important;
    border-radius: 14px !important;
  }

  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode:not(.mobile-map-picker) .panel-bottom {
    position: relative !important;
    flex: 0 0 auto !important;
    margin-top: 0 !important;
    padding: 4px 0 0 !important;
    background: #ffffff !important;
    box-shadow: none !important;
  }

  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode:not(.mobile-map-picker) .map-toggle-btn,
  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode:not(.mobile-map-picker) .gm-bundled-control,
  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode:not(.mobile-map-picker) .gm-bundled-control-on-bottom,
  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode:not(.mobile-map-picker) .gm-fullscreen-control {
    display: none !important;
  }

  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode.mobile-address-editing:not(.mobile-map-picker) .map-container {
    display: none !important;
  }

  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode.mobile-address-editing:not(.mobile-map-picker) .map-panel {
    height: 100dvh !important;
    min-height: 100dvh !important;
    flex-basis: 100dvh !important;
    margin-top: 0 !important;
    padding-top: max(18px, env(safe-area-inset-top)) !important;
    border-radius: 0 !important;
    box-shadow: none !important;
  }

  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode.mobile-address-editing:not(.mobile-map-picker) .map-panel::before {
    display: none !important;
  }

  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode.mobile-address-editing:not(.mobile-map-picker) .route-inputs {
    padding-bottom: 74px !important;
  }

  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode.mobile-address-editing:not(.mobile-map-picker) .panel-bottom {
    padding-bottom: env(safe-area-inset-bottom) !important;
  }
}

@media (max-width: 420px), (max-height: 720px) {
  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode:not(.mobile-map-picker):not(.mobile-address-editing) .map-panel {
    height: min(56dvh, 430px) !important;
    min-height: min(56dvh, 430px) !important;
    flex-basis: min(56dvh, 430px) !important;
  }

  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode:not(.mobile-map-picker):not(.mobile-address-editing) .map-panel-titlebar {
    display: none !important;
  }
}

.map-tablet-brand {
  display: none;
}

.map-panel-drag-handle {
  display: none;
}

/* Phone map state: use the same centered brand mark as tablet, scaled down
   so it leaves room for the map and native safe areas. */
@media (max-width: 699px) {
  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode:not(.mobile-map-picker) .map-modal-content {
    position: relative !important;
    display: block !important;
    height: 100% !important;
    min-height: 100% !important;
    max-height: 100% !important;
  }

  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode:not(.mobile-map-picker) .map-container {
    position: absolute !important;
    inset: 0 !important;
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    min-height: 100% !important;
    max-height: none !important;
  }

  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode:not(.mobile-map-picker) .map-panel {
    position: absolute !important;
    top: calc(100dvh - min(52dvh, 500px)) !important;
    right: 0 !important;
    bottom: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    flex: none !important;
    margin: 0 !important;
    transition: top 0.56s cubic-bezier(0.22, 1, 0.36, 1), padding 0.52s cubic-bezier(0.22, 1, 0.36, 1), border-radius 0.52s ease, box-shadow 0.42s ease !important;
    will-change: top;
  }

  /* Keep the secondary route action attached to the address list on phones.
     The footer itself still consumes the remaining space via margin-top:auto,
     so disposal and confirmation actions stay against the panel's bottom. */
  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode:not(.mobile-map-picker) .route-inputs {
    flex: 0 1 auto !important;
  }

  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode:not(.mobile-map-picker) .route-list-actions {
    width: 100% !important;
    flex: 0 0 auto !important;
    margin: 0 !important;
  }

  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode:not(.mobile-map-picker) .panel-bottom {
    margin-top: auto !important;
  }

  /* Android Chrome commonly reports a zero safe-area inset even though its
     system navigation bar sits directly below the visual viewport. Preserve
     the same real footer buffer in the overview and in the transient expanded
     state after an address is resolved, so snapping the sheet never changes
     the visible bottom clearance. */
  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode:not(.mobile-address-editing):not(.mobile-map-picker) .panel-bottom,
  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode.mobile-address-editing:not(.mobile-map-picker) .panel-bottom {
    padding-bottom: max(12px, env(safe-area-inset-bottom, 0px)) !important;
  }

  html body.home-page.home-breakpoints-page #mapModal .route-input-group input[type="search"] {
    -webkit-appearance: none !important;
    appearance: none !important;
  }

  html body.home-page.home-breakpoints-page #mapModal .route-input-group input[type="search"]::-webkit-search-cancel-button,
  html body.home-page.home-breakpoints-page #mapModal .route-input-group input[type="search"]::-webkit-search-decoration {
    display: none !important;
    -webkit-appearance: none !important;
  }

  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode:not(.mobile-map-picker) .map-tablet-brand {
    position: absolute !important;
    z-index: 24 !important;
    top: max(12px, env(safe-area-inset-top)) !important;
    left: 50% !important;
    display: inline-flex !important;
    align-items: baseline !important;
    justify-content: center !important;
    color: #111827 !important;
    font-family: var(--home-font-sans, "Manrope", "Avenir Next", "Helvetica Neue", Arial, sans-serif) !important;
    font-size: 22px !important;
    font-weight: 900 !important;
    line-height: 1 !important;
    letter-spacing: -0.055em !important;
    padding: 6px 11px 7px !important;
    border: 1px solid rgba(226, 232, 240, 0.88) !important;
    border-radius: 999px !important;
    background: rgba(255, 255, 255, 0.94) !important;
    box-shadow: 0 7px 20px rgba(15, 23, 42, 0.13), 0 1px 3px rgba(15, 23, 42, 0.08) !important;
    backdrop-filter: blur(10px) !important;
    -webkit-backdrop-filter: blur(10px) !important;
    pointer-events: none !important;
    transform: translateX(-50%) !important;
  }

  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode:not(.mobile-map-picker) .map-tablet-brand strong {
    color: #0a9f3f !important;
    font: inherit !important;
  }

  /* Focused phone editor: keep the map and brand visible, then raise the
     rounded address sheet only as far as the space directly below the logo. */
  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode.mobile-address-editing:not(.mobile-map-picker) .map-modal-content {
    position: relative !important;
    display: block !important;
  }

  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode.mobile-address-editing:not(.mobile-map-picker) .map-container {
    position: absolute !important;
    inset: 0 !important;
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    min-height: 100% !important;
    max-height: none !important;
  }

  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode.mobile-address-editing:not(.mobile-map-picker) .map-panel {
    position: absolute !important;
    top: max(72px, calc(env(safe-area-inset-top) + 68px)) !important;
    right: 0 !important;
    bottom: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    flex: none !important;
    margin: 0 !important;
    padding: 18px 14px max(12px, env(safe-area-inset-bottom)) !important;
    overflow: hidden !important;
    border-radius: 28px 28px 0 0 !important;
    background: #ffffff !important;
    box-shadow: 0 -16px 42px rgba(15, 23, 42, 0.14) !important;
  }

  /* The disposal flow needs the same usable canvas as the focused address
     editor. Raise its rounded sheet to just below the centered logo while
     keeping the map visible behind it; the wizard body scrolls independently
     and its footer therefore stays clear of Android's bottom navigation. */
  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode:not(.mobile-address-editing):not(.mobile-map-picker) .map-panel.disposal-wizard-host {
    top: max(72px, calc(env(safe-area-inset-top) + 68px)) !important;
    right: 0 !important;
    bottom: 0 !important;
    left: 0 !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: hidden !important;
    border-radius: 28px 28px 0 0 !important;
  }

  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode.mobile-address-editing:not(.mobile-map-picker) .map-panel::before {
    display: block !important;
    margin: -7px auto 5px !important;
  }

  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode.mobile-address-editing:not(.mobile-map-picker) .map-panel-titlebar {
    display: flex !important;
    margin: 0 4px 8px !important;
    animation: mobile-address-focus-content-in 0.46s 0.05s cubic-bezier(0.22, 1, 0.36, 1) both;
  }
}

@media (max-width: 420px), (max-width: 699px) and (max-height: 720px) {
  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode:not(.mobile-map-picker):not(.mobile-address-editing) .map-panel {
    top: calc(100dvh - min(56dvh, 430px)) !important;
    bottom: 0 !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    flex-basis: auto !important;
  }
}

@keyframes mobile-address-focus-content-in {
  from {
    opacity: 0;
    transform: translateY(12px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* Tablet route editor: keep the map as a full-viewport canvas and dock a
   narrower, centered address sheet to the bottom, matching the Lugg layout. */
@media (min-width: 700px) and (max-width: 979px) {
  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode:not(.mobile-map-picker) .map-modal-content {
    display: block !important;
  }

  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode:not(.mobile-map-picker) .map-tablet-brand {
    position: absolute !important;
    z-index: 24 !important;
    top: max(14px, env(safe-area-inset-top)) !important;
    left: 50% !important;
    display: inline-flex !important;
    align-items: baseline !important;
    justify-content: center !important;
    color: #111827 !important;
    font-family: var(--home-font-sans, "Manrope", "Avenir Next", "Helvetica Neue", Arial, sans-serif) !important;
    font-size: 27px !important;
    font-weight: 900 !important;
    line-height: 1 !important;
    letter-spacing: -0.055em !important;
    padding: 7px 13px 8px !important;
    border: 1px solid rgba(226, 232, 240, 0.88) !important;
    border-radius: 999px !important;
    background: rgba(255, 255, 255, 0.94) !important;
    box-shadow: 0 8px 24px rgba(15, 23, 42, 0.13), 0 1px 3px rgba(15, 23, 42, 0.08) !important;
    backdrop-filter: blur(10px) !important;
    -webkit-backdrop-filter: blur(10px) !important;
    pointer-events: none !important;
    transform: translateX(-50%) !important;
  }

  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode:not(.mobile-map-picker) .map-tablet-brand strong {
    color: #0a9f3f !important;
    font: inherit !important;
  }

  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode:not(.mobile-map-picker) .map-container,
  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode.mobile-address-editing:not(.mobile-map-picker) .map-container {
    position: absolute !important;
    inset: 0 !important;
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    min-height: 100% !important;
    max-height: none !important;
    border-radius: 0 !important;
    opacity: 1 !important;
    transform: scale(1) !important;
    transition: opacity 0.4s ease, transform 0.56s cubic-bezier(0.22, 1, 0.36, 1) !important;
  }

  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode:not(.mobile-map-picker) .map-panel,
  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode.mobile-address-editing:not(.mobile-map-picker) .map-panel {
    --tablet-address-sheet-height: min(100dvh, clamp(380px, 46dvh, 540px));
    position: absolute !important;
    top: calc(100dvh - var(--tablet-address-sheet-height)) !important;
    right: auto !important;
    bottom: auto !important;
    left: 50% !important;
    width: min(76vw, 680px) !important;
    height: var(--tablet-address-sheet-height) !important;
    min-height: var(--tablet-address-sheet-height) !important;
    max-height: var(--tablet-address-sheet-height) !important;
    flex: none !important;
    margin: 0 !important;
    padding: 24px 20px max(18px, env(safe-area-inset-bottom)) !important;
    overflow: hidden !important;
    border-radius: 28px 28px 0 0 !important;
    box-shadow: 0 -14px 38px rgba(15, 23, 42, 0.13) !important;
    transform: translateX(-50%) !important;
    transition: top 0.56s cubic-bezier(0.22, 1, 0.36, 1), left 0.56s cubic-bezier(0.22, 1, 0.36, 1), width 0.56s cubic-bezier(0.22, 1, 0.36, 1), height 0.56s cubic-bezier(0.22, 1, 0.36, 1), min-height 0.56s cubic-bezier(0.22, 1, 0.36, 1), max-height 0.56s cubic-bezier(0.22, 1, 0.36, 1), padding 0.56s cubic-bezier(0.22, 1, 0.36, 1), border-radius 0.5s ease, box-shadow 0.42s ease, transform 0.56s cubic-bezier(0.22, 1, 0.36, 1) !important;
    will-change: top, left, width, height, transform, border-radius;
  }

  /* Keep the disposal wizard expanded on tablets as well: its rounded sheet
     reaches from just below the centered logo to the bottom of the viewport.
     The shell keeps the action footer fixed and scrolls only the step body. */
  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode:not(.mobile-address-editing):not(.mobile-map-picker) .map-panel.disposal-wizard-host {
    top: max(78px, calc(env(safe-area-inset-top) + 74px)) !important;
    bottom: 0 !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    border-radius: 28px 28px 0 0 !important;
  }

  /* Anchor the regular tablet sheet to the actual modal edge. Calculating
     its bottom from 100dvh can leave a thin map strip on Android browsers
     whose visual and dynamic viewports differ by a few pixels. */
  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode:not(.mobile-address-editing):not(.mobile-map-picker) .map-panel:not(.disposal-wizard-host) {
    top: auto !important;
    bottom: -1px !important;
  }

  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode:not(.mobile-map-picker) .map-panel::before,
  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode.mobile-address-editing:not(.mobile-map-picker) .map-panel::before {
    display: block !important;
    margin-top: -14px !important;
    margin-bottom: 3px !important;
  }

  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode:not(.mobile-map-picker) .map-panel-titlebar {
    display: none !important;
  }

  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode:not(.mobile-map-picker) .route-inputs,
  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode.mobile-address-editing:not(.mobile-map-picker) .route-inputs {
    padding: 2px 0 8px !important;
  }

  /* Match the add-stop row to the 620px tablet address column. */
  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode:not(.mobile-map-picker) .route-list-actions {
    width: 100% !important;
    margin-right: auto !important;
    margin-left: auto !important;
    padding-right: 0 !important;
    padding-left: 0 !important;
  }

  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode.mobile-address-editing:not(.mobile-map-picker) .route-list-actions {
    width: min(100%, 620px) !important;
  }

  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode:not(.mobile-map-picker) .route-list-add-stop {
    width: 100% !important;
  }

  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode:not(.mobile-map-picker) .route-input-group {
    min-height: 70px !important;
    padding: 9px 12px !important;
    border-radius: 20px !important;
  }

  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode.mobile-address-editing:not(.mobile-map-picker) .panel-bottom {
    position: sticky !important;
    inset: auto 0 0 !important;
    z-index: 12 !important;
    display: grid !important;
    width: min(100%, 620px) !important;
    flex: 0 0 auto !important;
    margin: auto auto 0 !important;
    padding: 8px 0 max(0px, env(safe-area-inset-bottom)) !important;
    gap: 10px !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  /* Once an address is focused, expand the same tablet sheet upward while
     keeping the map and centered brand visible behind it. Anchoring the sheet
     to the bottom lets the height transition read as one continuous lift. */
  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode.mobile-address-editing:not(.mobile-map-picker) .map-container {
    display: block !important;
    opacity: 1 !important;
    transform: scale(1) !important;
    pointer-events: none !important;
  }

  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode.mobile-address-editing:not(.mobile-map-picker) .map-panel {
    --tablet-address-sheet-expanded-top: max(78px, calc(env(safe-area-inset-top) + 74px));
    top: auto !important;
    right: auto !important;
    bottom: -1px !important;
    left: 50% !important;
    width: min(76vw, 680px) !important;
    height: calc(100dvh - var(--tablet-address-sheet-expanded-top) + 1px) !important;
    min-height: calc(100dvh - var(--tablet-address-sheet-expanded-top) + 1px) !important;
    max-height: calc(100dvh - var(--tablet-address-sheet-expanded-top) + 1px) !important;
    padding: 24px 20px max(18px, env(safe-area-inset-bottom)) !important;
    overflow: hidden !important;
    border-radius: 28px 28px 0 0 !important;
    box-shadow: 0 -14px 38px rgba(15, 23, 42, 0.13) !important;
    transform: translateX(-50%) !important;
  }

  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode.mobile-address-editing:not(.mobile-map-picker) .map-panel::before {
    display: block !important;
    margin-top: -14px !important;
    margin-bottom: 3px !important;
  }

  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode.mobile-address-editing:not(.mobile-map-picker) .map-panel-titlebar {
    display: flex !important;
    width: min(100%, 620px) !important;
    margin: 0 auto 18px !important;
    animation: mobile-address-focus-content-in 0.48s 0.08s cubic-bezier(0.22, 1, 0.36, 1) both;
  }

  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode.mobile-address-editing:not(.mobile-map-picker) .route-inputs {
    width: min(100%, 620px) !important;
    flex: 0 0 auto !important;
    margin: 0 auto !important;
    padding: 0 !important;
    overflow: visible !important;
  }

  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode.mobile-address-editing:not(.mobile-map-picker) .route-inputs.autocomplete-focus-mode .route-input-block.pinned-top {
    display: flex !important;
    width: 100% !important;
    flex: 0 0 auto !important;
    flex-direction: column !important;
    align-items: stretch !important;
    min-height: 0 !important;
    max-height: none !important;
    margin-bottom: 8px !important;
    opacity: 1 !important;
    transform: none !important;
    pointer-events: auto !important;
    overflow: visible !important;
    animation: mobile-address-focus-content-in 0.5s 0.1s cubic-bezier(0.22, 1, 0.36, 1) both;
  }

  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode.mobile-address-editing:not(.mobile-map-picker) .route-inputs.autocomplete-focus-mode .route-input-block:not(.pinned-top) {
    display: flex !important;
    max-height: 0 !important;
    margin-bottom: 0 !important;
    overflow: hidden !important;
    opacity: 0 !important;
    transform: translateY(18px) scale(0.985) !important;
    visibility: hidden !important;
    pointer-events: none !important;
    transition: transform 0.5s cubic-bezier(0.22, 1, 0.36, 1), opacity 0.34s ease, max-height 0.5s cubic-bezier(0.22, 1, 0.36, 1), margin-bottom 0.5s ease, visibility 0s linear 0.5s !important;
  }

  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode.mobile-address-editing:not(.mobile-map-picker) .route-inputs.autocomplete-focus-mode .route-input-block[data-stop-index="0"] {
    order: 0 !important;
  }

  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode.mobile-address-editing:not(.mobile-map-picker) .route-inputs.autocomplete-focus-mode .route-input-block[data-stop-index="1"] {
    order: 1 !important;
  }

  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode.mobile-address-editing:not(.mobile-map-picker) .route-inputs.autocomplete-focus-mode .route-input-block.pinned-top .suggestions-list {
    flex: 0 1 auto !important;
    max-height: calc(100dvh - 310px) !important;
  }

  /* Keep autocomplete results inside the space above the action footer.
     The footer remains available, while only the result list scrolls; this
     prevents the final suggestion from disappearing underneath the buttons. */
  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode.mobile-address-editing:not(.mobile-map-picker) .map-panel.autocomplete-focus-mode {
    overflow: hidden !important;
  }

  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode.mobile-address-editing:not(.mobile-map-picker) .route-inputs.autocomplete-focus-mode {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    overflow: hidden !important;
  }

  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode.mobile-address-editing:not(.mobile-map-picker) .route-inputs.autocomplete-focus-mode .route-input-block.pinned-top {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    overflow: hidden !important;
  }

  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode.mobile-address-editing:not(.mobile-map-picker) .route-inputs.autocomplete-focus-mode .route-input-block.pinned-top .suggestions-list {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    max-height: none !important;
    padding-bottom: 12px !important;
    overflow-y: auto !important;
    scroll-padding-bottom: 12px;
  }

  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode.mobile-address-editing:not(.mobile-map-picker) .map-panel.autocomplete-focus-mode .panel-bottom {
    position: relative !important;
    inset: auto !important;
  }

  /* With a valid pickup and destination, collapse the tablet sheet around
     the route summary so the finished route remains the primary view. */
  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode.mobile-route-complete:not(.mobile-address-editing):not(.mobile-map-picker) .map-panel {
    --tablet-address-sheet-height: min(100dvh, clamp(380px, 46dvh, 460px));
  }

  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode.mobile-route-complete:not(.mobile-address-editing):not(.mobile-map-picker) .route-inputs {
    flex: 0 1 auto !important;
    padding-bottom: 0 !important;
  }

  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode.mobile-route-complete:not(.mobile-address-editing):not(.mobile-map-picker) .panel-bottom {
    margin-top: auto !important;
    padding-top: 8px !important;
    gap: 10px !important;
  }
}

/* Touch route sheet: the visible grabber is an actual control rather than a
   decorative pseudo-element. It can be dragged between the map-summary and
   expanded positions, or tapped to toggle between them. */
@media (max-width: 979px) {
  /* Scroll the addresses and their add action as one unit. This keeps the
     action immediately after the final address even when the collapsed sheet
     cannot show the entire route, instead of pinning it above the footer. */
  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode:not(.mobile-map-picker) .route-list-scroll {
    display: flex;
    flex: 0 1 auto;
    flex-direction: column;
    min-height: 0;
    overflow-x: visible;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
  }

  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode:not(.mobile-map-picker) .route-list-scroll > .route-inputs {
    flex: 0 0 auto !important;
    padding-bottom: 0 !important;
    overflow: visible !important;
  }

  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode:not(.mobile-map-picker) .route-list-scroll > .route-inputs > .route-input-block:last-child {
    margin-bottom: 3px !important;
  }

  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode:not(.mobile-map-picker) .map-panel:is(.autocomplete-focus-mode, .autocomplete-suggestions-open) .route-list-scroll {
    display: contents;
  }

  /* Autocomplete owns the available sheet height on phones and tablets. Hide
     the complete action footer while suggestions are visible instead of
     allowing the result list to push those controls below the viewport. */
  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode.mobile-address-editing:not(.mobile-map-picker) .map-panel.autocomplete-suggestions-open .panel-bottom {
    display: none !important;
  }

  html body.home-page.home-breakpoints-page #mapModal.mobile-address-focus-preparing .map-panel {
    transition: none !important;
  }

  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode:not(.mobile-map-picker):not(.mobile-address-editing) .map-panel:not(.disposal-wizard-host)::before {
    display: none !important;
  }

  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode:not(.mobile-map-picker) .map-panel:not(.disposal-wizard-host) > .map-panel-drag-handle {
    display: flex !important;
    width: 88px !important;
    height: 22px !important;
    min-height: 22px !important;
    flex: 0 0 22px !important;
    align-items: center !important;
    justify-content: center !important;
    margin: -12px auto 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 999px !important;
    background: transparent !important;
    box-shadow: none !important;
    cursor: ns-resize !important;
    touch-action: none !important;
    -webkit-tap-highlight-color: transparent !important;
  }

  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode:not(.mobile-map-picker) .map-panel:not(.disposal-wizard-host) > .map-panel-drag-handle > span {
    display: block !important;
    width: 44px !important;
    height: 5px !important;
    border-radius: 999px !important;
    background: #e3e6eb !important;
    transition: width 0.22s ease, background-color 0.22s ease, transform 0.22s ease !important;
  }

  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode.mobile-sheet-dragging .map-panel-drag-handle > span {
    width: 52px !important;
    background: #cbd1d9 !important;
    transform: scaleY(1.08) !important;
  }

  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode.mobile-sheet-expanded:not(.mobile-map-picker):not(.mobile-address-editing) .map-panel:not(.disposal-wizard-host),
  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode.mobile-sheet-dragging:not(.mobile-map-picker):not(.mobile-address-editing) .map-panel:not(.disposal-wizard-host) {
    top: var(--mobile-route-sheet-top, max(72px, calc(env(safe-area-inset-top) + 68px))) !important;
    bottom: 0 !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    flex-basis: auto !important;
  }

  /* In the expanded mobile sheet the route list should keep its content
     height, so the add-stop action stays directly below the final address.
     Longer routes can still shrink and scroll inside the available space. */
  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode.mobile-sheet-expanded:not(.mobile-map-picker):not(.mobile-address-editing) .route-inputs {
    flex: 0 1 auto !important;
  }

  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode.mobile-sheet-expanded:not(.mobile-map-picker):not(.mobile-address-editing) .panel-bottom {
    margin-top: auto !important;
  }

  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode.mobile-sheet-dragging:not(.mobile-map-picker):not(.mobile-address-editing) .map-panel:not(.disposal-wizard-host) {
    transition: none !important;
    user-select: none !important;
    -webkit-user-select: none !important;
  }

  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode.mobile-address-editing.mobile-sheet-dragging:not(.mobile-map-picker) .map-panel:not(.disposal-wizard-host) {
    top: var(--mobile-route-sheet-top) !important;
    bottom: 0 !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    transition: none !important;
    user-select: none !important;
    -webkit-user-select: none !important;
  }

  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode.mobile-address-editing:not(.mobile-map-picker) .map-panel:not(.disposal-wizard-host)::before {
    display: none !important;
  }
}

/* Mobile/tablet route-panel parity.
   Keep the same two-part composition as the desktop dialog: the route title,
   addresses and add-stop action form one bounded scroll region, while the
   disposal and confirmation actions remain a separate footer. Previously the
   content-sized route region could end underneath the footer in the collapsed
   sheet, clipping the add-stop row and producing a scrollbar through it. */
@media (max-width: 979px) {
  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode:not(.mobile-address-editing):not(.mobile-map-picker) .map-panel:not(.disposal-wizard-host) {
    display: flex !important;
    flex-direction: column !important;
  }

  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode:not(.mobile-address-editing):not(.mobile-map-picker) .map-panel:not(.disposal-wizard-host) > .map-panel-titlebar {
    display: flex !important;
    flex: 0 0 auto !important;
  }

  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode:not(.mobile-address-editing):not(.mobile-map-picker) .route-list-scroll {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    overflow-x: visible !important;
    overflow-y: auto !important;
  }

  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode:not(.mobile-address-editing):not(.mobile-map-picker) .route-list-scroll > .route-inputs {
    flex: 0 0 auto !important;
    padding-bottom: 0 !important;
  }

  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode:not(.mobile-map-picker) .route-list-scroll > .route-inputs > .route-input-block:last-child {
    margin-bottom: 0 !important;
  }

  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode:not(.mobile-map-picker) .route-list-actions {
    margin-top: 20px !important;
    margin-bottom: 0 !important;
    padding-bottom: 8px !important;
  }

  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode:not(.mobile-address-editing):not(.mobile-map-picker) .panel-bottom {
    position: relative !important;
    inset: auto !important;
    flex: 0 0 auto !important;
    margin-top: 0 !important;
    padding-top: 14px !important;
    gap: 12px !important;
    background: #ffffff !important;
  }
}

@media (max-width: 979px) {
  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode:not(.mobile-map-picker) .route-list-actions:not(:has(#addStopBtn)) {
    display: none !important;
  }

  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode:not(.mobile-map-picker) .panel-bottom:has(.add-mistplatz-btn) {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    column-gap: 12px !important;
    row-gap: 12px !important;
  }

  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode:not(.mobile-map-picker) .panel-bottom:has(.add-mistplatz-btn) > .modal-actions {
    margin-top: 0 !important;
  }

  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode:not(.mobile-map-picker) .panel-bottom > .add-mistplatz-btn {
    grid-column: 1 !important;
    min-width: 0 !important;
  }

  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode:not(.mobile-map-picker) .panel-bottom > #addStopBtn {
    grid-column: 2 !important;
    min-width: 0 !important;
    min-height: 58px !important;
    justify-content: center !important;
    gap: 8px !important;
    padding: 8px 10px !important;
    text-align: center !important;
  }

  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode:not(.mobile-map-picker) .panel-bottom > #addStopBtn .route-list-add-stop-icon {
    order: 2 !important;
    width: 30px !important;
    min-width: 30px !important;
    max-width: 30px !important;
    height: 30px !important;
    flex: 0 0 30px !important;
    border-radius: 9px !important;
    font-size: 19px !important;
  }

  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode:not(.mobile-map-picker) .panel-bottom > #addStopBtn .route-list-add-stop-label {
    order: 1 !important;
    flex: 0 1 auto !important;
    font-size: 12.5px !important;
    line-height: 1.2 !important;
    white-space: normal !important;
  }

  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode:not(.mobile-map-picker) .panel-bottom > #addStopBtn:hover,
  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode:not(.mobile-map-picker) .panel-bottom > #addStopBtn:focus,
  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode:not(.mobile-map-picker) .panel-bottom > #addStopBtn:focus-visible,
  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode:not(.mobile-map-picker) .panel-bottom > #addStopBtn:active {
    border-color: #cbd5df !important;
    background: #fbfcfd !important;
    color: #475467 !important;
    box-shadow: none !important;
    outline: none !important;
  }

  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode:not(.mobile-map-picker) .panel-bottom > #addStopBtn:hover .route-list-add-stop-icon,
  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode:not(.mobile-map-picker) .panel-bottom > #addStopBtn:focus .route-list-add-stop-icon,
  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode:not(.mobile-map-picker) .panel-bottom > #addStopBtn:focus-visible .route-list-add-stop-icon,
  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode:not(.mobile-map-picker) .panel-bottom > #addStopBtn:active .route-list-add-stop-icon {
    background: #eef9f1 !important;
    color: #18a94a !important;
  }

}

@media (max-width: 699px) {
  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode:not(.mobile-address-editing):not(.mobile-map-picker) .map-panel:not(.disposal-wizard-host) {
    --mobile-route-sheet-height: min(100dvh, clamp(440px, 56dvh, 500px));
    top: calc(100dvh - var(--mobile-route-sheet-height)) !important;
    bottom: 0 !important;
  }

  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode:not(.mobile-address-editing):not(.mobile-map-picker) .map-panel:not(.disposal-wizard-host) > .map-panel-titlebar {
    margin: 0 4px 2px !important;
  }
}

@media (max-width: 420px) {
  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode:not(.mobile-map-picker) .panel-bottom > .add-mistplatz-btn {
    gap: 6px !important;
    padding-inline: 6px !important;
    font-size: 12px !important;
  }

  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode:not(.mobile-map-picker) .panel-bottom > .add-mistplatz-btn .mistplatz-btn-label {
    display: block !important;
    width: auto !important;
    flex: 0 1 auto !important;
    min-width: 0 !important;
    max-width: calc(100% - 24px) !important;
    overflow: hidden !important;
    white-space: nowrap !important;
  }

  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode:not(.mobile-map-picker) .panel-bottom > .add-mistplatz-btn img.mistplatz-btn-icon {
    display: block !important;
    width: 18px !important;
    min-width: 18px !important;
    max-width: 18px !important;
    height: 18px !important;
    flex: 0 0 18px !important;
    object-fit: contain !important;
  }
}

@media (min-width: 700px) and (max-width: 979px) {
  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode:not(.mobile-address-editing):not(.mobile-map-picker) .map-panel:not(.disposal-wizard-host) {
    --tablet-address-sheet-height: min(100dvh, clamp(440px, 49dvh, 560px));
    height: var(--tablet-address-sheet-height) !important;
    min-height: var(--tablet-address-sheet-height) !important;
    max-height: var(--tablet-address-sheet-height) !important;
  }

  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode:not(.mobile-address-editing):not(.mobile-map-picker) .map-panel:not(.disposal-wizard-host) > .map-panel-titlebar {
    width: 100% !important;
    margin: 0 0 10px !important;
  }
}

/* Keep the clear control easy to tap without letting its black visual dominate
   the address row. The button retains a 36px hit area; only the visible circle
   and close glyph are reduced. */
#mapModal .route-clear-btn,
#mapModal .route-clear-btn:hover {
  width: 36px !important;
  height: 36px !important;
  flex: 0 0 36px !important;
  margin-left: 6px !important;
  margin-right: 2px !important;
  padding: 0 !important;
  background: transparent !important;
}

#mapModal .route-clear-btn .material-icons-round {
  width: 18px !important;
  min-width: 18px !important;
  max-width: 18px !important;
  height: 18px !important;
  flex: 0 0 18px !important;
  border-radius: 50% !important;
  background: #000000 !important;
  color: #ffffff !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  line-height: 18px !important;
  transition: background-color 0.18s ease, transform 0.18s ease !important;
}

#mapModal .route-clear-btn:hover .material-icons-round,
#mapModal .route-clear-btn:focus-visible .material-icons-round {
  background: #242424 !important;
}

#mapModal .route-clear-btn:active .material-icons-round {
  transform: scale(0.92) !important;
}

/* A route with an intermediate stop can safely lose any one of its rows.
   Keep the whole-stop delete affordance visible on every card, including
   touch devices where a hover-only control would otherwise be unreachable. */
#mapModal .route-inputs:not(.has-removable-stops) .delete-btn,
#mapModal .delete-btn[hidden] {
  display: none !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

#mapModal .route-inputs.has-removable-stops .delete-btn:not([hidden]) {
  display: inline-flex !important;
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
  transform: scale(1) !important;
  transition-delay: 0s !important;
}

@property --route-mistplatz-border-angle {
  syntax: "<angle>";
  inherits: false;
  initial-value: -40deg;
}

/* Keep the automatically appended recycling centre visually distinct from
   the customer's numbered stops. The narrow highlight continuously travels
   around the card without covering its content. */
html body.home-page.home-breakpoints-page #mapModal .route-input-block--mistplatz .route-input-group {
  position: relative;
  isolation: isolate;
}

html body.home-page.home-breakpoints-page #mapModal .route-input-block--mistplatz .route-input-group::after {
  position: absolute;
  z-index: 1;
  inset: -2px;
  padding: 2px;
  border-radius: inherit;
  background: conic-gradient(
    from var(--route-mistplatz-border-angle),
    transparent 0 72%,
    rgba(24, 185, 108, 0.18) 76%,
    #18b96c 84%,
    #43d5b0 88%,
    rgba(24, 185, 108, 0.18) 94%,
    transparent 100%
  );
  content: "";
  pointer-events: none;
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
  mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  mask-composite: exclude;
  animation: route-mistplatz-border-run 3.2s linear infinite;
}

html body.home-page.home-breakpoints-page #mapModal .route-input-block--mistplatz .route-input-group > * {
  position: relative;
  z-index: 2;
}

html body.home-page.home-breakpoints-page #mapModal .route-input-block--mistplatz .step-num {
  background: #e9f8f0 !important;
  color: #118b50 !important;
}

html body.home-page.home-breakpoints-page #mapModal .route-input-block--mistplatz .step-num .material-icons-round {
  font-size: 24px;
  line-height: 1;
}

@keyframes route-mistplatz-border-run {
  to {
    --route-mistplatz-border-angle: 320deg;
  }
}

@media (prefers-reduced-motion: reduce) {
  html body.home-page.home-breakpoints-page #mapModal .route-input-block--mistplatz .route-input-group::after {
    background: rgba(24, 185, 108, 0.55);
    animation: none !important;
  }

  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode:not(.mobile-map-picker) .map-container,
  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode:not(.mobile-map-picker) .map-panel,
  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode:not(.mobile-map-picker) .map-panel-titlebar,
  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode:not(.mobile-map-picker) .route-input-block {
    animation: none !important;
    transition-duration: 0.01ms !important;
  }
}

/* Story viewer controls: clean, high-contrast treatment inspired by the
   supplied sports-story reference. The story card dimensions stay unchanged. */
body.home-page .home-feature-story-bars {
  top: 10px !important;
  left: 12px !important;
  right: 12px !important;
  gap: 5px !important;
}

body.home-page .home-feature-story-bars span {
  height: 3px !important;
  border-radius: 999px !important;
  background: rgba(15, 23, 42, 0.24) !important;
  box-shadow: 0 1px 3px rgba(15, 23, 42, 0.13) !important;
}

body.home-page .home-feature-story-bars i {
  background: #ffffff !important;
  box-shadow: 0 1px 3px rgba(15, 23, 42, 0.18) !important;
}

body.home-page .home-feature-story[data-active-story-group] .home-feature-story-control {
  top: 23px !important;
  width: 38px !important;
  height: 38px !important;
  color: #122033 !important;
  background: transparent !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  text-shadow: none !important;
  transition: background-color 0.18s ease, transform 0.18s ease !important;
}

body.home-page .home-feature-story-close {
  right: 8px !important;
}

body.home-page .home-feature-story-pause {
  right: 50px !important;
}

body.home-page .home-feature-story-control:hover {
  background: rgba(255, 255, 255, 0.3) !important;
}

body.home-page .home-feature-story-control:active {
  transform: scale(0.92) !important;
}

body.home-page .home-feature-story-control .material-icons-round {
  font-size: 30px !important;
  line-height: 1 !important;
}

body.home-page .home-feature-story-arrow {
  width: 58px !important;
  height: 58px !important;
  color: #0a0f18 !important;
  background: #ffffff !important;
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.22) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  transition: transform 0.18s ease, box-shadow 0.18s ease !important;
}

body.home-page .home-feature-story-arrow:hover {
  transform: translateY(-50%) !important;
  box-shadow: 0 14px 34px rgba(0, 0, 0, 0.28) !important;
}

body.home-page .home-feature-story-arrow:active {
  transform: translateY(-50%) scale(0.94) !important;
}

body.home-page .home-feature-story-arrow--prev {
  left: calc(50% - 292px) !important;
}

body.home-page .home-feature-story-arrow--next {
  right: calc(50% - 292px) !important;
}

body.home-page .home-feature-story-arrow .material-icons-round {
  font-size: 38px !important;
  line-height: 1 !important;
}

body.home-page .home-feature-story-skip {
  appearance: none;
  position: fixed;
  top: 50%;
  z-index: 7;
  width: 44px;
  height: 52px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  border: 0;
  color: rgba(255, 255, 255, 0.92);
  background: transparent;
  cursor: pointer;
  filter: drop-shadow(0 2px 8px rgba(0, 0, 0, 0.3));
  transform: translateY(-50%);
  transition: color 0.18s ease, transform 0.18s ease;
}

body.home-page .home-feature-story-skip:hover {
  color: #ffffff;
  transform: translateY(-50%);
}

body.home-page .home-feature-story-skip:active {
  transform: translateY(-50%) scale(0.92);
}

body.home-page .home-feature-story-skip--prev {
  left: calc(50% - 366px);
}

body.home-page .home-feature-story-skip--next {
  right: calc(50% - 366px);
}

body.home-page .home-feature-story-skip .material-icons-round {
  font-size: 32px;
  line-height: 1;
}

@media (max-width: 760px) {
  body.home-page .home-feature-story-skip {
    width: 40px;
    height: 48px;
  }

  body.home-page .home-feature-story-skip--prev {
    left: 8px;
  }

  body.home-page .home-feature-story-skip--next {
    right: 8px;
  }

  body.home-page .home-feature-story-skip .material-icons-round {
    font-size: 30px;
  }
}

@media (max-width: 620px) {
  body.home-page .home-feature-story-arrow {
    width: 50px !important;
    height: 50px !important;
  }

  body.home-page .home-feature-story-arrow--prev {
    left: 22px !important;
  }

  body.home-page .home-feature-story-arrow--next {
    right: 22px !important;
  }

  body.home-page .home-feature-story-arrow .material-icons-round {
    font-size: 34px !important;
  }

  body.home-page .home-feature-story-skip {
    display: none;
  }
}

/* Delivery time choices: semantic SVGs carry the meaning; the check only marks selection. */
body.home-breakpoints-page.home-page #quickOrderWidget .delivery-time-row .radio-card {
  position: relative !important;
  display: grid !important;
  grid-template-columns: 40px minmax(0, 1fr) !important;
  align-items: center !important;
  column-gap: 11px !important;
  padding: 10px 34px 10px 12px !important;
}

body.home-breakpoints-page.home-page #quickOrderWidget .delivery-time-icon-shell {
  display: inline-flex;
  width: 40px;
  height: 40px;
  align-items: center;
  justify-content: center;
  border: 0;
  background: transparent;
}

body.home-breakpoints-page.home-page #quickOrderWidget .radio-card.active .delivery-time-icon-shell {
  border: 0;
  background: transparent;
  box-shadow: none;
}

body.home-breakpoints-page.home-page #quickOrderWidget .delivery-time-row .radio-card.active {
  background: #fff !important;
}

body.home-breakpoints-page.home-page #quickOrderWidget .delivery-time-icon {
  display: block;
  width: 25px;
  height: 25px;
  filter: brightness(0) saturate(100%);
  opacity: 0.68;
  transition: filter 0.18s ease, opacity 0.18s ease;
}

body.home-breakpoints-page.home-page #quickOrderWidget .radio-card.active .delivery-time-icon {
  filter: none;
  opacity: 1;
}

body.home-breakpoints-page.home-page #quickOrderWidget .delivery-time-row .radio-top {
  position: absolute !important;
  top: 9px !important;
  right: 9px !important;
  left: auto !important;
  width: 18px !important;
  min-width: 18px !important;
  height: 18px !important;
  transform: none !important;
}

body.home-breakpoints-page.home-page #quickOrderWidget .delivery-time-row .radio-card .checkmark {
  width: 18px !important;
  height: 18px !important;
  font-size: 18px !important;
  line-height: 18px !important;
}

body.home-breakpoints-page.home-page #quickOrderWidget .delivery-time-row .radio-card .empty {
  display: none !important;
}

body.home-breakpoints-page.home-page #quickOrderWidget .delivery-time-row .radio-text,
body.home-breakpoints-page.home-page #quickOrderWidget .delivery-time-row .calendar-wrap {
  min-width: 0;
  margin: 0 !important;
}

body.home-breakpoints-page.home-page #quickOrderWidget .delivery-time-row .calendar-wrap {
  display: block !important;
}

body.home-breakpoints-page.home-page #quickOrderWidget .delivery-time-row #dateTriggerText {
  display: block;
  line-height: 1.12;
}

@media (min-width: 980px) {
  body.home-breakpoints-page.home-page #quickOrderWidget .delivery-time-row .radio-card {
    min-height: 88px !important;
  }
}

@media (min-width: 421px) and (max-width: 979px) {
  body.home-breakpoints-page.home-page #quickOrderWidget .delivery-time-row .radio-card {
    min-height: 84px !important;
  }
}

@media (min-width: 540px) {
  body.home-breakpoints-page.home-page #quickOrderWidget .delivery-time-row .radio-card {
    grid-template-columns: 30px minmax(0, 1fr) !important;
    column-gap: 8px !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .delivery-time-icon-shell {
    width: 30px;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .delivery-time-row .radio-text {
    white-space: nowrap;
    font-size: 13.5px !important;
    line-height: 1.2 !important;
  }
}

@media (max-width: 420px) {
  body.home-breakpoints-page.home-page #quickOrderWidget .delivery-time-row .radio-card {
    grid-template-columns: 26px minmax(0, 1fr) !important;
    column-gap: 6px !important;
    min-height: 74px !important;
    padding: 9px 24px 9px 8px !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .delivery-time-icon-shell {
    width: 26px;
    height: 36px;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .delivery-time-icon {
    width: 22px;
    height: 22px;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .delivery-time-row .radio-top {
    top: 7px !important;
    right: 7px !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .delivery-time-row #dateTrigger {
    padding: 9px 24px 9px 8px !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .delivery-time-row #dateTrigger .radio-top {
    top: 7px !important;
    right: 7px !important;
    left: auto !important;
    width: 18px !important;
    min-width: 18px !important;
    height: 18px !important;
    transform: none !important;
  }

  body.home-breakpoints-page.home-page #quickOrderWidget .delivery-time-row .radio-text,
  body.home-breakpoints-page.home-page #quickOrderWidget .delivery-time-row #dateTriggerText {
    font-size: 13.5px !important;
    line-height: 1.22 !important;
  }
}

/* Shared compact measure for phone and tablet content cards. */
@media (max-width: 860px) {
  body.home-breakpoints-page.home-page {
    --home-compact-tablet-section-width: 460px;
    --home-compact-tablet-panel-width: calc(var(--home-compact-tablet-section-width) - 32px);
  }
}

/* Compact tablet homepage: keep every panel below the booking widget on the
   same centered measure as "Beliebte Dienstleistungen". */
@media (min-width: 768px) and (max-width: 860px) {
  /* Match the mobile map block: title, panel measure, and vertical rhythm. */
  body.home-breakpoints-page.home-page .hero .hero-image-placeholder {
    align-self: center !important;
    flex-direction: column !important;
    width: 100% !important;
    max-width: var(--home-compact-tablet-panel-width) !important;
    margin: 18px auto 0 !important;
    gap: 14px !important;
  }

  body.home-breakpoints-page.home-page .hero-live-map-title {
    display: block !important;
    margin: 0 2px !important;
    color: #111827 !important;
    font-size: 24px !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
    letter-spacing: -0.035em !important;
    text-align: left !important;
  }

  body.home-breakpoints-page.home-page .hero .hero-image-placeholder .hero-live-map {
    width: 100% !important;
    height: 224px !important;
    min-height: 224px !important;
    aspect-ratio: auto !important;
    border-radius: 20px !important;
  }

  html body.home-breakpoints-page.home-page .hero ~ .flex-services {
    margin-top: 8px !important;
    padding-top: 18px !important;
  }

  body.home-breakpoints-page.home-page .flex-services,
  body.home-breakpoints-page.home-page .home-business-teaser,
  body.home-breakpoints-page.home-page .home-faq,
  body.home-breakpoints-page.home-page .uber-info {
    width: 100% !important;
    max-width: var(--home-compact-tablet-section-width) !important;
    margin-right: auto !important;
    margin-left: auto !important;
    padding-right: 16px !important;
    padding-left: 16px !important;
  }

  body.home-breakpoints-page.home-page .uber-marq {
    width: 100% !important;
    max-width: var(--home-compact-tablet-panel-width) !important;
    margin-right: auto !important;
    margin-left: auto !important;
  }

  body.home-breakpoints-page.home-page .home-business-teaser-shell {
    display: flex !important;
    flex-direction: column !important;
    min-height: 0 !important;
    padding: 0 !important;
  }

  body.home-breakpoints-page.home-page .home-business-teaser-copy {
    order: 2 !important;
    padding: 0 20px 20px !important;
  }

  body.home-breakpoints-page.home-page .home-business-teaser h2,
  body.home-breakpoints-page.home-page .home-business-teaser p {
    max-width: none !important;
  }

  body.home-breakpoints-page.home-page .home-business-teaser-media {
    order: 1 !important;
    width: 100% !important;
    min-height: 0 !important;
    height: auto !important;
    margin: 0 auto !important;
    aspect-ratio: var(--placeholder-image-aspect, 1672 / 941) !important;
  }

  body.home-breakpoints-page.home-page .home-business-teaser-image,
  body.home-breakpoints-page.home-page .home-business-teaser-media .hero-placeholder-upload-image {
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
    object-position: center !important;
    transform: translateX(-2.1%) !important;
  }

  body.home-breakpoints-page.home-page .home-faq-layout {
    grid-template-columns: 1fr !important;
    gap: 16px !important;
  }

  body.home-breakpoints-page.home-page .home-faq-tabs {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 6px !important;
    align-items: stretch !important;
  }

  body.home-breakpoints-page.home-page .home-faq-tab {
    width: 100% !important;
    justify-content: center !important;
  }

  body.home-breakpoints-page.home-page .uber-info-grid {
    grid-template-columns: 1fr !important;
    gap: 20px !important;
  }
}

/* Keep the closing homepage sections consistent across the 768px header breakpoint. */
@media (max-width: 860px) {
  body.home-breakpoints-page.home-page .home-business-teaser,
  body.home-breakpoints-page.home-page .home-faq,
  body.home-breakpoints-page.home-page .uber-info {
    width: 100% !important;
    max-width: var(--home-compact-tablet-section-width) !important;
    margin-inline: auto !important;
    padding-inline: 16px !important;
  }

  body.home-breakpoints-page.home-page .home-business-teaser h2,
  body.home-breakpoints-page.home-page .home-faq-sidebar h2,
  body.home-breakpoints-page.home-page .home-offers-heading,
  body.home-breakpoints-page.home-page .uber-info-heading {
    max-width: none !important;
    font-size: 26px !important;
    font-weight: 850 !important;
    line-height: 1.08 !important;
    letter-spacing: -0.025em !important;
    text-align: left !important;
  }

  body.home-breakpoints-page.home-page .home-offers {
    --home-offers-gutter: 0px;
    max-width: none;
    /* Align the first card with the FAQ; let the strip reach the page edge. */
    padding-left: max(16px, calc((100% - var(--home-compact-tablet-section-width)) / 2 + 16px));
    padding-right: 0;
  }

  body.home-breakpoints-page.home-page .home-offers-header {
    width: min(calc(100% - 16px), var(--home-compact-tablet-panel-width));
    /* Match the FAQ shell's 20px padding plus its 1px border. */
    padding-inline: 21px;
  }

  body.home-breakpoints-page.home-page .home-offers-terms {
    max-width: min(calc(100% - 44px), calc(var(--home-compact-tablet-panel-width) - 28px));
    margin-inline: 14px;
  }

  body.home-breakpoints-page.home-page .home-offers-heading {
    transform: none;
    text-align: center !important;
  }

  body.home-breakpoints-page.home-page .uber-info-grid {
    grid-template-columns: 1fr !important;
    gap: 20px !important;
  }

  body.home-breakpoints-page.home-page .home-business-teaser p {
    max-width: none !important;
    margin-top: 12px !important;
    font-size: 14px !important;
    line-height: 1.42 !important;
  }

  body.home-breakpoints-page.home-page .home-business-teaser-actions {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    width: 100% !important;
    max-width: none !important;
    gap: 12px !important;
    margin-top: 18px !important;
  }

  body.home-breakpoints-page.home-page .home-business-teaser-button {
    display: grid !important;
    grid-template-columns: 20px minmax(0, 1fr) 20px !important;
    width: 100% !important;
    min-width: 0 !important;
    min-height: 50px !important;
    padding: 10px 16px !important;
    gap: 8px !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
  }

  body.home-breakpoints-page.home-page .home-business-teaser-button > span:first-child {
    grid-column: 2;
    max-width: none !important;
    text-align: center;
    text-wrap: wrap !important;
  }

  body.home-breakpoints-page.home-page .home-business-teaser-button .material-icons-round {
    flex: 0 0 auto !important;
    margin-left: auto !important;
    font-size: 20px !important;
  }

  body.home-breakpoints-page.home-page .home-faq-shell,
  body.home-breakpoints-page.home-page .uber-info-shell {
    padding: 24px 20px 20px !important;
    text-align: left !important;
  }

  body.home-breakpoints-page.home-page .home-faq-layout {
    grid-template-columns: 1fr !important;
    gap: 16px !important;
  }

  body.home-breakpoints-page.home-page .home-faq-tabs {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 8px !important;
    margin-top: 22px !important;
  }

  body.home-breakpoints-page.home-page .home-faq-question {
    min-height: 64px !important;
    padding: 17px 18px !important;
    gap: 14px !important;
  }

  body.home-breakpoints-page.home-page .home-faq-question span:first-child {
    font-size: 16px !important;
    line-height: 1.28 !important;
    letter-spacing: -0.02em !important;
  }
}

/* Route editor controls: keep the numbered stop inside the address card,
   place the reorder handle at the card's right edge, and keep removal as a
   separate action outside the card. This mirrors the familiar ride-planner
   layout while preserving keyboard reordering and generous touch targets. */
#mapModal .route-input-row {
  display: flex;
  align-items: stretch;
  gap: 8px;
  width: 100%;
  min-width: 0;
}

#mapModal .route-input-row > .route-input-group {
  flex: 1 1 auto;
  min-width: 0;
}

#mapModal .route-input-group > .step-num-wrap {
  width: 48px;
  min-height: 46px;
  flex: 0 0 48px;
  cursor: default;
  touch-action: auto;
}

#mapModal .route-input-group > .step-num-wrap:hover .step-num,
#mapModal .route-input-group > .step-num-wrap:active .step-num {
  transform: none;
}

/* The stop number is now a static route marker; reordering has its own
   dedicated handle at the card's right edge. Neutralize the legacy hover
   swap that used to hide the number and reveal a drag glyph in this slot. */
#mapModal .route-input-block--sortable .step-num-wrap--static .step-num-value,
#mapModal .route-input-block--sortable .step-num-wrap--static:hover .step-num-value,
#mapModal .route-input-block--sortable .step-num-wrap--static:active .step-num-value {
  opacity: 1 !important;
  transform: none !important;
}

#mapModal .route-inputs:not(.route-sorting):not(.autocomplete-focus-mode) .route-input-block.route-input-block--sortable .route-input-group > .step-num-wrap.step-num-wrap--static:hover .step-num,
#mapModal .route-inputs:not(.route-sorting):not(.autocomplete-focus-mode) .route-input-block.route-input-block--sortable .route-input-group > .step-num-wrap.step-num-wrap--static:active .step-num {
  background: #f4f4f5 !important;
  color: #374151 !important;
  box-shadow: none !important;
}

#mapModal .route-input-block--sortable .step-num-wrap--static .step-drag-handle-icon {
  display: none !important;
}

/* Route clear/details controls are separate flex items in the current shared
   row. Reclaim the legacy internal icon gutter on every viewport so both
   placeholders and real addresses keep their full readable measure. */
#mapModal .route-input-group > .input-wrap input,
#mapModal .route-input-group > .input-wrap .secondary-address-line {
  padding-right: 4px;
}

/* Keep a selected address to one calm overview line. Inputs normally clip
   their value at the control edge; explicitly opt into the same ellipsis
   treatment already used by the secondary address line. While editing, the
   native input viewport remains free to scroll with the caret. */
#mapModal .route-input-group > .input-wrap input:not(:focus) {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

/* When a row has a dedicated reorder handle, align the details action with
   that control instead of ending it at the text column. Its right edge now
   sits directly above the handle while the remaining inset protects the stop
   label from the part of the action that still reaches into the text area. */
#mapModal .route-input-block--sortable .route-input-group .address-details-trigger--inline {
  right: -50px !important;
}

#mapModal .route-input-block--sortable .route-input-group:has(.address-details-trigger--inline):not(.active):not(.suggestions-open) > .input-wrap label {
  padding-right: 58px;
}

#mapModal .route-sort-handle {
  width: 44px;
  height: 44px;
  flex: 0 0 44px;
  align-self: center;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin: 0 0 0 6px;
  padding: 0;
  border: 0;
  border-radius: 12px;
  background: transparent;
  color: #111111;
  cursor: grab;
  touch-action: none;
  -webkit-tap-highlight-color: transparent;
  transition: background-color 0.16s ease, transform 0.16s ease, color 0.16s ease;
}

#mapModal .route-sort-handle-lines,
#mapModal .route-sort-handle-lines::before,
#mapModal .route-sort-handle-lines::after {
  display: block;
}

#mapModal .route-sort-handle-lines {
  position: relative;
  width: 18px;
  height: 15px;
}

#mapModal .route-sort-handle-lines::before,
#mapModal .route-sort-handle-lines::after {
  position: absolute;
  left: 0;
  width: 18px;
  height: 3px;
  border-radius: 2px;
  background: currentColor;
  content: "";
}

#mapModal .route-sort-handle-lines::before {
  top: 3px;
}

#mapModal .route-sort-handle-lines::after {
  bottom: 3px;
}

#mapModal .route-sort-handle:hover,
#mapModal .route-sort-handle:focus-visible,
#mapModal .route-sort-handle--holding,
#mapModal .route-sort-handle--dragging {
  background: transparent;
}

#mapModal .route-sort-handle:focus-visible {
  outline: 3px solid rgba(24, 185, 79, 0.3);
  outline-offset: 2px;
}

#mapModal .route-sort-handle:active,
#mapModal .route-sort-handle--holding,
#mapModal .route-sort-handle--dragging {
  cursor: grabbing;
  transform: none;
}

#mapModal .route-sort-handle:disabled,
#mapModal .route-inputs.autocomplete-focus-mode .route-sort-handle {
  display: none;
}

#mapModal .route-input-row > .delete-btn {
  width: 44px;
  height: 44px;
  flex: 0 0 44px;
  align-self: center;
  margin: 0;
  border-radius: 12px;
  background: transparent;
  color: #111111;
}

#mapModal .route-input-row > .delete-btn:hover,
#mapModal .route-input-row > .delete-btn:focus-visible {
  background: #f0f1f2;
  color: #111111;
}

#mapModal .route-input-row > .delete-btn:focus-visible {
  outline: 3px solid rgba(17, 17, 17, 0.18);
  outline-offset: 2px;
}

#mapModal .route-input-row > .delete-btn .material-icons-round {
  font-size: 26px;
  font-weight: 500;
}

#mapModal .route-inputs.route-sorting .route-input-row > .delete-btn {
  opacity: 0;
  pointer-events: none;
}

/* Sortable writes a new transform for every pointer move. The base 280 ms
   transition also affected its fallback clone and made the active card lag
   behind the finger. Keep only the neighbouring-card settle animation. */
#mapModal .route-inputs.route-sorting .route-input-block {
  transition: transform 140ms cubic-bezier(0.22, 1, 0.36, 1) !important;
}

#mapModal .route-inputs.route-sorting .route-input-block.route-drag-fallback,
#mapModal .route-inputs.route-sorting .route-input-block.route-drag-dragging {
  transition: none !important;
  will-change: transform;
  backface-visibility: hidden;
}

/* Keep the destination slot legible while Sortable moves a card. The former
   fully transparent ghost looked like the address had disappeared on touch
   devices, especially on the narrow Galaxy Fold viewport. */
#mapModal .route-inputs.route-sorting .route-input-block.route-drag-ghost {
  opacity: 0.56 !important;
}

#mapModal .route-inputs.route-sorting .route-input-block.route-drag-ghost .route-input-group {
  border-color: #c7cdd4 !important;
  background: #f5f6f7 !important;
  box-shadow: none !important;
}

#mapModal .route-inputs.route-sorting .route-input-block.route-drag-ghost .step-num {
  background: #e8eaed !important;
  color: #374151 !important;
}

/* The moving preview represents the card itself; showing a second external
   delete action beside it creates a misleading duplicate on narrow screens. */
#mapModal .route-inputs .route-input-block.route-drag-fallback .route-input-row > .delete-btn {
  visibility: hidden !important;
}

/* In the single-address focus view, removal is intentionally unavailable:
   the external trash action belongs to the route overview. Let the active
   card consume the released column across phone and tablet layouts. */
@media (max-width: 979px) {
  #mapModal .route-inputs.autocomplete-focus-mode .route-input-block.pinned-top .route-input-row {
    gap: 0;
  }

  #mapModal .route-inputs.autocomplete-focus-mode .route-input-block.pinned-top .route-input-row > .route-input-group {
    width: 100%;
    flex: 1 1 100%;
  }

  #mapModal .route-inputs.autocomplete-focus-mode .route-input-block.pinned-top .route-input-row > .delete-btn {
    display: none !important;
  }
}

@media (max-width: 560px) {
  #mapModal .route-input-row {
    gap: 4px;
  }

  #mapModal .route-input-group > .step-num-wrap {
    width: 48px;
    flex-basis: 48px;
  }

  #mapModal .route-sort-handle,
  #mapModal .route-input-row > .delete-btn {
    width: 40px;
    height: 40px;
    flex-basis: 40px;
  }

  #mapModal .route-sort-handle {
    margin-left: 2px;
  }

  #mapModal .route-input-block--sortable .route-input-group .address-details-trigger--inline {
    right: -42px !important;
  }

}

@media (max-width: 350px) {
  /* The full details label and the stop label cannot coexist in the narrow
     Fold column without colliding. Keep the action and its full aria-label,
     but use the concise visible wording at this breakpoint. */
  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode:not(.mobile-map-picker) .address-details-trigger--inline {
    font-size: 0 !important;
  }

  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode:not(.mobile-map-picker) .address-details-trigger--inline::after {
    content: "Details";
    font-size: 9px;
    line-height: 1;
  }

  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode:not(.mobile-map-picker) .route-input-group:has(.address-details-trigger--inline):not(.active):not(.suggestions-open) > .input-wrap label {
    box-sizing: border-box;
    width: 100%;
    min-width: 0;
    padding-right: 0 !important;
    overflow: hidden;
    white-space: nowrap;
  }

  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode:not(.mobile-map-picker) .route-input-group > .step-num-wrap {
    width: 48px;
    flex-basis: 48px;
  }

  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode:not(.mobile-map-picker) .route-input-group > .input-wrap input {
    padding-right: 0;
  }

  html body.home-page.home-breakpoints-page #mapModal.mobile-address-mode:not(.mobile-map-picker) .route-input-row > .delete-btn {
    margin-left: 0;
  }
}

@media (prefers-reduced-motion: reduce) {
  #mapModal .route-sort-handle,
  #mapModal .route-input-row > .delete-btn {
    transition-duration: 0.01ms !important;
  }
}