/* v172 — fixed desktop hero standard with strict 40/60 content/media split.
   Applies only to pages already marked with .site-hero-unified.
   Exceptions (services overview, news, about, contacts) are not marked and remain unchanged. */
@media (min-width: 768px) {
  .site-hero-unified:not(.site-hero-unified--text) {
    --hero-height: 680px;
    --hero-copy-zone: 40%;
    --hero-media-zone: 60%;
    --hero-media-render-width: 1180px;
    --hero-fade-width: 180px;
    --hero-copy-left: max(28px, calc((100vw - var(--container)) / 2));
    --hero-copy-top: 104px;
    position: relative !important;
    isolation: isolate !important;
    display: block !important;
    width: 100% !important;
    max-width: none !important;
    height: var(--hero-height) !important;
    min-height: var(--hero-height) !important;
    max-height: var(--hero-height) !important;
    margin: 0 0 24px !important;
    padding: 0 !important;
    overflow: hidden !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    background: #fff !important;
  }

  .site-hero-unified:not(.site-hero-unified--text) > .container,
  .site-hero-unified:not(.site-hero-unified--text) .agzs-hero-inner,
  .site-hero-unified:not(.site-hero-unified--text) .gbo-hero-grid,
  .site-hero-unified:not(.site-hero-unified--text) .infra-hero__grid,
  .site-hero-unified:not(.site-hero-unified--text) .cylinders-hero__grid,
  .site-hero-unified:not(.site-hero-unified--text) .carwash-hero-inner,
  .site-hero-unified:not(.site-hero-unified--text) .business-hero-panel,
  .site-hero-unified:not(.site-hero-unified--text) .gasholder-hero__card {
    position: static !important;
    display: block !important;
    width: 100% !important;
    max-width: none !important;
    height: 100% !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    background: transparent !important;
  }

  /* The image keeps exactly the same desktop geometry while the browser is resized. */
  .site-hero-unified:not(.site-hero-unified--text) .site-hero-unified__media {
    position: absolute !important;
    z-index: 0 !important;
    top: 0 !important;
    right: 0 !important;
    bottom: auto !important;
    left: var(--hero-copy-zone) !important;
    width: var(--hero-media-zone) !important;
    min-width: 0 !important;
    max-width: none !important;
    height: var(--hero-height) !important;
    min-height: var(--hero-height) !important;
    max-height: var(--hero-height) !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    -webkit-mask-image: linear-gradient(90deg,
      transparent 0,
      rgba(0,0,0,.18) 45px,
      rgba(0,0,0,.55) 95px,
      rgba(0,0,0,.86) 145px,
      #000 var(--hero-fade-width),
      #000 100%);
    mask-image: linear-gradient(90deg,
      transparent 0,
      rgba(0,0,0,.18) 45px,
      rgba(0,0,0,.55) 95px,
      rgba(0,0,0,.86) 145px,
      #000 var(--hero-fade-width),
      #000 100%);
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-size: 100% 100%;
    mask-size: 100% 100%;
  }

  .site-hero-unified:not(.site-hero-unified--text) .site-hero-unified__media picture {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
  }

  .site-hero-unified:not(.site-hero-unified--text) .site-hero-unified__media img {
    display: block !important;
    position: absolute !important;
    top: 0 !important;
    right: 0 !important;
    width: var(--hero-media-render-width) !important;
    min-width: var(--hero-media-render-width) !important;
    max-width: var(--hero-media-render-width) !important;
    height: var(--hero-height) !important;
    min-height: var(--hero-height) !important;
    max-height: var(--hero-height) !important;
    object-fit: cover !important;
    object-position: center !important;
    transform: none !important;
  }

  /* Remove older full-section fades. Only the fixed media-edge fade remains. */
  .site-hero-unified:not(.site-hero-unified--text)::after {
    content: none !important;
    display: none !important;
  }

  .site-hero-unified.carwash-hero .carwash-hero-media::before,
  .site-hero-unified.vacancies-hero .vacancies-hero__media::before,
  .site-hero-unified.business-hero .business-hero-bg::after,
  .site-hero-unified.gasholder-hero .gasholder-hero__card::before {
    content: none !important;
    display: none !important;
    background: none !important;
  }

  .site-hero-unified:not(.site-hero-unified--text) .site-hero-unified__content,
  .site-hero-unified.hero .hero-content,
  .site-hero-unified.infra-hero .infra-hero__copy,
  .site-hero-unified.gbo-hero .gbo-hero-content,
  .site-hero-unified.cylinders-hero .cylinders-hero__copy,
  .site-hero-unified.vacancies-hero .vacancies-hero__content,
  .site-hero-unified.carwash-hero .carwash-hero-content,
  .site-hero-unified.business-hero .business-hero-content,
  .site-hero-unified.gasholder-hero .gasholder-hero__content,
  .site-hero-unified.agzs-hero .agzs-hero-content {
    position: relative !important;
    z-index: 2 !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-start !important;
    align-items: flex-start !important;
    box-sizing: border-box !important;
    width: var(--hero-copy-zone) !important;
    max-width: var(--hero-copy-zone) !important;
    height: auto !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: var(--hero-copy-top) 32px 40px var(--hero-copy-left) !important;
    transform: none !important;
    background: transparent !important;
  }

  /* One typography system for every unified hero. */
  .site-hero-unified:not(.site-hero-unified--text) .site-hero-unified__content h1,
  .site-hero-unified:not(.site-hero-unified--text) .site-hero-unified__content h1 span,
  .site-hero-unified:not(.site-hero-unified--text) .site-hero-unified__content h1 em {
    font-family: inherit !important;
    font-size: 52px !important;
    line-height: 1.08 !important;
    font-weight: 700 !important;
    letter-spacing: -1.5px !important;
  }

  .site-hero-unified:not(.site-hero-unified--text) .site-hero-unified__content h1 {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 0 30px !important;
  }

  .site-hero-unified:not(.site-hero-unified--text) .site-hero-unified__content > p {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 0 30px !important;
    font-family: inherit !important;
    font-size: 18px !important;
    line-height: 1.55 !important;
    font-weight: 400 !important;
    letter-spacing: 0 !important;
  }

  .site-hero-unified .agzs-hero-points,
  .site-hero-unified .business-hero-stats,
  .site-hero-unified .vacancies-hero__facts,
  .site-hero-unified .carwash-stats,
  .site-hero-unified .gbo-hero-features,
  .site-hero-unified .gasholder-quick {
    width: 100% !important;
    max-width: 100% !important;
  }
}

/* Mobile remains a separate composition. Existing page-specific mobile rules stay in force. */
@media (max-width: 767px) {
  .site-hero-unified.hero .hero-image picture {
    display: block;
    width: 100%;
    height: 100%;
  }
}

/* v173 — keep information-rich hero content inside the fixed 680px desktop frame.
   Supporting facts/features are anchored to the lower safe area instead of extending
   the document flow below the clipped hero container. Typography and the 40/60 split
   remain identical to v172. */
@media (min-width: 768px) {
  .site-hero-unified.agzs-hero,
  .site-hero-unified.gbo-hero,
  .site-hero-unified.carwash-hero,
  .site-hero-unified.business-hero,
  .site-hero-unified.gasholder-hero {
    --hero-copy-top: 72px;
  }

  .site-hero-unified.agzs-hero .site-hero-unified__content,
  .site-hero-unified.gbo-hero .site-hero-unified__content,
  .site-hero-unified.carwash-hero .site-hero-unified__content,
  .site-hero-unified.business-hero .site-hero-unified__content,
  .site-hero-unified.gasholder-hero .site-hero-unified__content {
    height: 100% !important;
    max-height: var(--hero-height) !important;
    padding-bottom: 150px !important;
  }

  /* Keep the primary copy/actions in the upper part of the hero. */
  .site-hero-unified.agzs-hero .agzs-hero-actions,
  .site-hero-unified.gbo-hero .gbo-actions,
  .site-hero-unified.carwash-hero .carwash-actions,
  .site-hero-unified.business-hero .business-hero-actions {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
  }

  /* Supporting information is pinned to the bottom safe zone, so it remains visible
     and cannot push the copy outside the fixed-height hero. */
  .site-hero-unified.agzs-hero .agzs-hero-points,
  .site-hero-unified.gbo-hero .gbo-hero-features,
  .site-hero-unified.carwash-hero .carwash-stats,
  .site-hero-unified.business-hero .business-hero-stats,
  .site-hero-unified.gasholder-hero .gasholder-quick {
    position: absolute !important;
    z-index: 3 !important;
    left: var(--hero-copy-left) !important;
    right: 32px !important;
    bottom: 30px !important;
    width: auto !important;
    max-width: none !important;
    margin: 0 !important;
    transform: none !important;
  }

  .site-hero-unified.gbo-hero .gbo-hero-features {
    gap: 12px !important;
  }

  .site-hero-unified.gbo-hero .gbo-hero-features div {
    gap: 8px !important;
    font-size: 12px !important;
    line-height: 1.25 !important;
  }

  .site-hero-unified.gbo-hero .gbo-hero-features span {
    width: 38px !important;
    height: 38px !important;
    flex-basis: 38px !important;
  }

  .site-hero-unified.gbo-hero .gbo-hero-features span img {
    width: 24px !important;
    height: 24px !important;
  }

  .site-hero-unified.carwash-hero .carwash-stats,
  .site-hero-unified.business-hero .business-hero-stats {
    gap: 10px !important;
  }

  .site-hero-unified.gasholder-hero .gasholder-quick {
    box-sizing: border-box !important;
    padding-top: 14px !important;
    padding-bottom: 14px !important;
  }
}

/* v174 — visual correction pass after live review.
   Keeps the approved fixed 40/60 desktop split while improving content fit,
   bottom fade, and spacing on information-rich heroes. */
@media (min-width: 768px) {
  .site-hero-unified:not(.site-hero-unified--text) {
    /* Give the hero a small breathing space below breadcrumbs/header without
       changing its fixed desktop geometry. */
    margin-top: 14px !important;
  }

  /* Sharper white finish at the bottom of the hero image. Copy remains above it. */
  .site-hero-unified:not(.site-hero-unified--text)::before {
    content: '' !important;
    display: block !important;
    position: absolute !important;
    z-index: 1 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    height: 118px !important;
    pointer-events: none !important;
    background: linear-gradient(
      180deg,
      rgba(255,255,255,0) 0%,
      rgba(255,255,255,.08) 28%,
      rgba(255,255,255,.34) 58%,
      rgba(255,255,255,.82) 86%,
      #fff 100%
    ) !important;
  }

  /* Slightly calmer shared typography so long page titles fit the 40% copy zone
     without colliding with the action/supporting blocks. */
  .site-hero-unified:not(.site-hero-unified--text) .site-hero-unified__content h1,
  .site-hero-unified:not(.site-hero-unified--text) .site-hero-unified__content h1 span,
  .site-hero-unified:not(.site-hero-unified--text) .site-hero-unified__content h1 em {
    font-size: 48px !important;
    line-height: 1.11 !important;
    letter-spacing: -1.1px !important;
  }

  .site-hero-unified:not(.site-hero-unified--text) .site-hero-unified__content h1 {
    margin-bottom: 26px !important;
  }

  .site-hero-unified:not(.site-hero-unified--text) .site-hero-unified__content > p {
    margin-bottom: 24px !important;
    line-height: 1.58 !important;
  }

  /* Bring the secondary information back into the visible safe area. */
  .site-hero-unified.agzs-hero .agzs-hero-points {
    bottom: 54px !important;
    row-gap: 10px !important;
  }

  .site-hero-unified.gbo-hero .gbo-hero-features {
    bottom: 42px !important;
  }

  .site-hero-unified.carwash-hero .carwash-stats,
  .site-hero-unified.business-hero .business-hero-stats {
    bottom: 42px !important;
  }

  /* Gasholders has the densest hero. Keep the CTA and quick links clearly
     separated instead of letting the lower card collide with the button. */
  .site-hero-unified.gasholder-hero .gasholder-hero__content {
    padding-top: 60px !important;
    padding-bottom: 188px !important;
  }

  .site-hero-unified.gasholder-hero .gasholder-hero__content h1,
  .site-hero-unified.gasholder-hero .gasholder-hero__content h1 span {
    font-size: 46px !important;
    line-height: 1.09 !important;
  }

  .site-hero-unified.gasholder-hero .gasholder-hero__content h1 {
    margin-bottom: 20px !important;
  }

  .site-hero-unified.gasholder-hero .gasholder-hero__content > p {
    margin-bottom: 20px !important;
  }

  .site-hero-unified.gasholder-hero .gasholder-quick {
    bottom: 24px !important;
    padding: 13px 18px !important;
  }

  .site-hero-unified.gasholder-hero .gasholder-quick strong {
    margin-bottom: 10px !important;
  }

  .site-hero-unified.gasholder-hero .gasholder-quick div {
    gap: 10px !important;
  }

  .site-hero-unified.gasholder-hero .gasholder-quick a {
    gap: 4px !important;
    font-size: 13px !important;
    line-height: 1.28 !important;
  }

  .site-hero-unified.gasholder-hero .gasholder-quick span {
    font-size: 22px !important;
  }

  /* Carwash title is intentionally uppercase, so give it more line breathing
     and a slightly smaller size than short hero titles. */
  .site-hero-unified.carwash-hero .carwash-hero-content h1,
  .site-hero-unified.carwash-hero .carwash-hero-content h1 span {
    font-size: 45px !important;
    line-height: 1.14 !important;
    letter-spacing: -.8px !important;
  }

  .site-hero-unified.carwash-hero .carwash-hero-content h1 {
    margin-bottom: 24px !important;
  }

  .site-hero-unified.carwash-hero .carwash-hero-content > p {
    margin-bottom: 22px !important;
  }

  .site-hero-unified.carwash-hero .carwash-stats {
    gap: 12px !important;
  }

  .site-hero-unified.carwash-hero .carwash-stat {
    column-gap: 9px !important;
  }

  .site-hero-unified.carwash-hero .carwash-stat span {
    width: 48px !important;
    height: 48px !important;
  }

  .site-hero-unified.carwash-hero .carwash-stat b {
    font-size: 13px !important;
    line-height: 1.25 !important;
  }

  .site-hero-unified.carwash-hero .carwash-stat small {
    font-size: 11px !important;
    line-height: 1.25 !important;
  }
}

@media (min-width: 768px) {
  /* v174: supporting hero content is part of the 40% copy zone too. */
  .site-hero-unified.agzs-hero .agzs-hero-points,
  .site-hero-unified.gbo-hero .gbo-hero-features,
  .site-hero-unified.carwash-hero .carwash-stats,
  .site-hero-unified.business-hero .business-hero-stats,
  .site-hero-unified.gasholder-hero .gasholder-quick {
    right: auto !important;
    width: calc(var(--hero-copy-zone) - var(--hero-copy-left) - 28px) !important;
    max-width: calc(var(--hero-copy-zone) - var(--hero-copy-left) - 28px) !important;
    box-sizing: border-box !important;
  }

  .site-hero-unified.agzs-hero .agzs-hero-points {
    gap: 8px 16px !important;
    font-size: 13px !important;
    line-height: 1.3 !important;
  }

  .site-hero-unified.carwash-hero .carwash-stats {
    grid-template-columns: repeat(3,minmax(0,1fr)) !important;
  }
}

/* v175 — corrective layout pass for information-rich unified heroes.
   Keep the 40/60 split from v172, but keep supporting facts inside the copy column
   instead of pinning them across the full hero width. */
@media (min-width: 768px) {
  .site-hero-unified:not(.site-hero-unified--text) {
    margin-top: 18px !important;
  }

  .site-hero-unified:not(.site-hero-unified--text)::before {
    content: "";
    position: absolute;
    z-index: 1;
    left: 40%;
    right: 0;
    bottom: 0;
    height: 105px;
    pointer-events: none;
    background: linear-gradient(180deg, rgba(255,255,255,0) 0%, rgba(255,255,255,.58) 56%, #fff 100%);
  }

  .site-hero-unified.agzs-hero .site-hero-unified__content,
  .site-hero-unified.gbo-hero .site-hero-unified__content,
  .site-hero-unified.carwash-hero .site-hero-unified__content,
  .site-hero-unified.business-hero .site-hero-unified__content,
  .site-hero-unified.gasholder-hero .site-hero-unified__content {
    height: 100% !important;
    max-height: 100% !important;
    padding-top: 58px !important;
    padding-bottom: 34px !important;
    overflow: hidden !important;
  }

  .site-hero-unified.agzs-hero .agzs-hero-points,
  .site-hero-unified.gbo-hero .gbo-hero-features,
  .site-hero-unified.carwash-hero .carwash-stats,
  .site-hero-unified.business-hero .business-hero-stats,
  .site-hero-unified.gasholder-hero .gasholder-quick {
    position: static !important;
    inset: auto !important;
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    transform: none !important;
  }

  .site-hero-unified.agzs-hero .agzs-hero-points {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 10px 14px !important;
    margin-top: 24px !important;
    font-size: 13px !important;
    line-height: 1.3 !important;
  }
  .site-hero-unified.agzs-hero .agzs-hero-points li {
    min-width: 0 !important;
    padding-left: 20px !important;
  }

  .site-hero-unified.gasholder-hero .gasholder-quick {
    box-sizing: border-box !important;
    margin-top: 24px !important;
    padding: 16px 18px !important;
    border-radius: 14px !important;
  }
  .site-hero-unified.gasholder-hero .gasholder-quick strong {
    margin-bottom: 12px !important;
    font-size: 16px !important;
    line-height: 1.25 !important;
  }
  .site-hero-unified.gasholder-hero .gasholder-quick > div {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 12px !important;
  }
  .site-hero-unified.gasholder-hero .gasholder-quick a {
    min-width: 0 !important;
    font-size: 12px !important;
    line-height: 1.28 !important;
  }
  .site-hero-unified.gasholder-hero .gasholder-line-icon {
    width: 38px !important;
    height: 38px !important;
  }

  .site-hero-unified.carwash-hero .site-hero-unified__content h1 {
    font-size: 42px !important;
    line-height: 1.05 !important;
    letter-spacing: -1px !important;
    margin-bottom: 22px !important;
  }
  .site-hero-unified.carwash-hero .site-hero-unified__content > p {
    margin-bottom: 22px !important;
  }
  .site-hero-unified.carwash-hero .carwash-actions {
    gap: 12px !important;
  }
  .site-hero-unified.carwash-hero .carwash-stats {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 10px !important;
    margin-top: 22px !important;
  }
  .site-hero-unified.carwash-hero .carwash-stat {
    display: grid !important;
    grid-template-columns: 42px minmax(0, 1fr) !important;
    gap: 2px 8px !important;
    padding: 0 !important;
  }
  .site-hero-unified.carwash-hero .carwash-stat span {
    width: 42px !important;
    height: 42px !important;
  }
  .site-hero-unified.carwash-hero .carwash-stat span img {
    width: 27px !important;
    height: 27px !important;
    object-fit: contain !important;
  }
  .site-hero-unified.carwash-hero .carwash-stat b {
    font-size: 11px !important;
    line-height: 1.2 !important;
    overflow-wrap: anywhere !important;
  }
  .site-hero-unified.carwash-hero .carwash-stat small {
    font-size: 10px !important;
    line-height: 1.2 !important;
  }

  .site-hero-unified.business-hero .business-hero-stats {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 12px 16px !important;
    margin-top: 22px !important;
  }
  .site-hero-unified.business-hero .business-hero-stat {
    display: grid !important;
    grid-template-columns: 40px minmax(0, 1fr) !important;
    gap: 10px !important;
    align-items: center !important;
  }
  .site-hero-unified.business-hero .business-hero-stat img {
    width: 40px !important;
    height: 40px !important;
  }
  .site-hero-unified.business-hero .business-hero-stat p {
    min-width: 0 !important;
    font-size: 12px !important;
    line-height: 1.22 !important;
    overflow-wrap: normal !important;
    word-break: normal !important;
  }

  .site-hero-unified.gbo-hero .gbo-hero-features {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 10px !important;
    margin-top: 22px !important;
  }
  .site-hero-unified.gbo-hero .gbo-hero-features div {
    display: grid !important;
    grid-template-columns: 36px minmax(0, 1fr) !important;
    gap: 7px !important;
    align-items: center !important;
    min-width: 0 !important;
    font-size: 10px !important;
    line-height: 1.2 !important;
  }
  .site-hero-unified.gbo-hero .gbo-hero-features span {
    width: 36px !important;
    height: 36px !important;
    flex-basis: 36px !important;
  }
  .site-hero-unified.gbo-hero .gbo-hero-features span img {
    width: 23px !important;
    height: 23px !important;
  }
}

/* v176 — business hero CTA fit correction.
   Both action buttons must stay completely inside the approved 40% copy zone. */
@media (min-width: 768px) {
  .site-hero-unified.business-hero .business-hero-actions {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    width: 100% !important;
    max-width: 100% !important;
    gap: 14px !important;
    margin-top: 0 !important;
    box-sizing: border-box !important;
  }

  .site-hero-unified.business-hero .business-hero-button,
  .site-hero-unified.business-hero .business-hero-button-primary,
  .site-hero-unified.business-hero .business-hero-button-secondary {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    padding-left: 18px !important;
    padding-right: 16px !important;
  }

  .site-hero-unified.business-hero .business-hero-button-label {
    min-width: 0 !important;
    font-size: 14px !important;
    line-height: 1.3 !important;
  }

  .site-hero-unified.business-hero .business-hero-button-secondary img {
    width: 42px !important;
    height: 42px !important;
    flex: 0 0 42px !important;
  }
}

/* v194 — viewport-height-aware unified hero.
   Windows display scaling changes the effective CSS viewport, so desktop heroes
   must fit both wide/tall and wide/short browser windows without a fixed 680px void. */
@media (min-width: 768px) {
  .site-hero-unified:not(.site-hero-unified--text) {
    --hero-height: clamp(580px, 68vh, 620px);
  }
}

@media (min-width: 768px) and (max-height: 760px) {
  .site-hero-unified:not(.site-hero-unified--text) {
    --hero-height: 560px;
  }
  .site-hero-unified.agzs-hero,
  .site-hero-unified.gbo-hero,
  .site-hero-unified.carwash-hero,
  .site-hero-unified.business-hero,
  .site-hero-unified.gasholder-hero {
    --hero-copy-top: 48px;
  }
  .site-hero-unified.agzs-hero .agzs-hero-points,
  .site-hero-unified.gbo-hero .gbo-hero-features,
  .site-hero-unified.carwash-hero .carwash-stats,
  .site-hero-unified.business-hero .business-hero-stats,
  .site-hero-unified.gasholder-hero .gasholder-quick {
    bottom: 20px !important;
  }
}

/* v196 — first-screen unified hero.
   Desktop visitors should see the header/breadcrumbs plus the hero as one complete
   first screen. The hero therefore fills exactly the remaining viewport height,
   instead of using a fixed pixel height or pulling the following section upward. */
@media (min-width: 1101px) {
  /* Internal pages: 72px sticky header + ~37px breadcrumb row. */
  body > .site-header + .page-context-nav + main > .site-hero-unified:not(.site-hero-unified--text) {
    --hero-height: calc(100dvh - 109px);
    height: var(--hero-height) !important;
    min-height: var(--hero-height) !important;
    max-height: none !important;
    margin-bottom: 0 !important;
  }

  /* Home page has no breadcrumb row. */
  body > .site-header + main > .site-hero-unified:not(.site-hero-unified--text) {
    --hero-height: calc(100dvh - 72px);
    height: var(--hero-height) !important;
    min-height: var(--hero-height) !important;
    max-height: none !important;
    margin-bottom: 0 !important;
  }

  body > .site-header ~ main > .site-hero-unified:not(.site-hero-unified--text) .site-hero-unified__media,
  body > .site-header ~ main > .site-hero-unified:not(.site-hero-unified--text) .site-hero-unified__media img {
    height: 100% !important;
    min-height: 100% !important;
    max-height: none !important;
  }
}

@supports not (height: 100dvh) {
  @media (min-width: 1101px) {
    body > .site-header + .page-context-nav + main > .site-hero-unified:not(.site-hero-unified--text) {
      --hero-height: calc(100vh - 109px);
    }
    body > .site-header + main > .site-hero-unified:not(.site-hero-unified--text) {
      --hero-height: calc(100vh - 72px);
    }
  }
}

/* v197 — large desktop first-screen hero content scaling.
   On wide desktop viewports the first-screen hero remains full-height, while its
   copy, controls and supporting elements grow together and sit closer to the left edge. */
@media (min-width: 1440px) and (min-height: 760px) {
  .site-hero-unified:not(.site-hero-unified--text) {
    --hero-copy-left: clamp(52px, 6vw, 96px);
    --hero-copy-top: clamp(62px, 7vh, 84px);
  }

  .site-hero-unified:not(.site-hero-unified--text) .site-hero-unified__content h1,
  .site-hero-unified:not(.site-hero-unified--text) .site-hero-unified__content h1 span,
  .site-hero-unified:not(.site-hero-unified--text) .site-hero-unified__content h1 em {
    font-size: clamp(56px, 3.65vw, 64px) !important;
    line-height: 1.06 !important;
    letter-spacing: -1.8px !important;
  }

  .site-hero-unified:not(.site-hero-unified--text) .site-hero-unified__content h1 {
    margin-bottom: 32px !important;
  }

  .site-hero-unified:not(.site-hero-unified--text) .site-hero-unified__content > p {
    font-size: clamp(19px, 1.25vw, 21px) !important;
    line-height: 1.5 !important;
    margin-bottom: 32px !important;
  }

  .site-hero-unified.agzs-hero .agzs-hero-actions,
  .site-hero-unified.gbo-hero .gbo-actions,
  .site-hero-unified.carwash-hero .carwash-actions,
  .site-hero-unified.business-hero .business-hero-actions,
  .site-hero-unified.gasholder-hero .gasholder-hero__actions {
    transform: scale(1.08) !important;
    transform-origin: left top !important;
  }

  .site-hero-unified .agzs-hero-points,
  .site-hero-unified .business-hero-stats,
  .site-hero-unified .vacancies-hero__facts,
  .site-hero-unified .carwash-stats,
  .site-hero-unified .gbo-hero-features,
  .site-hero-unified .gasholder-quick {
    font-size: 1.06em !important;
  }
}

/* v198 — large desktop proportional hero refinement.
   For wide/high desktop viewports, reduce side inset, give the copy more top breathing room,
   and scale hero typography, controls, icons and supporting information by roughly 25%.
   The first-screen geometry and 40/60 copy/media split remain unchanged. */
@media (min-width: 1720px) and (min-height: 760px) {
  .site-hero-unified:not(.site-hero-unified--text) {
    --hero-copy-left: clamp(28px, 3.2vw, 56px);
    --hero-copy-top: clamp(92px, 9.5vh, 124px);
  }

  .site-hero-unified:not(.site-hero-unified--text) .site-hero-unified__content h1,
  .site-hero-unified:not(.site-hero-unified--text) .site-hero-unified__content h1 span,
  .site-hero-unified:not(.site-hero-unified--text) .site-hero-unified__content h1 em {
    font-size: clamp(66px, 4vw, 76px) !important;
    line-height: 1.04 !important;
    letter-spacing: -2px !important;
  }

  .site-hero-unified:not(.site-hero-unified--text) .site-hero-unified__content h1 {
    margin-bottom: 38px !important;
  }

  .site-hero-unified:not(.site-hero-unified--text) .site-hero-unified__content > p {
    font-size: clamp(23px, 1.45vw, 26px) !important;
    line-height: 1.48 !important;
    margin-bottom: 38px !important;
  }

  /* Primary CTA groups scale together with the typography. */
  .site-hero-unified.agzs-hero .agzs-hero-actions,
  .site-hero-unified.gbo-hero .gbo-actions,
  .site-hero-unified.carwash-hero .carwash-actions,
  .site-hero-unified.business-hero .business-hero-actions,
  .site-hero-unified.gasholder-hero .gasholder-hero__actions,
  .site-hero-unified.hero .hero-actions,
  .site-hero-unified.vacancies-hero .vacancies-hero__actions {
    transform: scale(1.25) !important;
    transform-origin: left top !important;
    margin-bottom: 18px !important;
  }

  /* Supporting information gets a real layout scale-up rather than only larger text. */
  .site-hero-unified.agzs-hero .agzs-hero-points {
    gap: 14px 20px !important;
    margin-top: 30px !important;
    font-size: 16px !important;
    line-height: 1.32 !important;
  }
  .site-hero-unified.agzs-hero .agzs-hero-points li {
    padding-left: 26px !important;
  }

  .site-hero-unified.gasholder-hero .gasholder-quick {
    margin-top: 30px !important;
    padding: 20px 22px !important;
    border-radius: 16px !important;
  }
  .site-hero-unified.gasholder-hero .gasholder-quick strong {
    margin-bottom: 15px !important;
    font-size: 20px !important;
  }
  .site-hero-unified.gasholder-hero .gasholder-quick > div {
    gap: 16px !important;
  }
  .site-hero-unified.gasholder-hero .gasholder-quick a {
    font-size: 15px !important;
    line-height: 1.3 !important;
  }
  .site-hero-unified.gasholder-hero .gasholder-line-icon {
    width: 48px !important;
    height: 48px !important;
  }

  .site-hero-unified.carwash-hero .site-hero-unified__content h1 {
    font-size: clamp(58px, 3.6vw, 68px) !important;
    line-height: 1.04 !important;
    margin-bottom: 28px !important;
  }
  .site-hero-unified.carwash-hero .carwash-stats {
    gap: 14px !important;
    margin-top: 28px !important;
  }
  .site-hero-unified.carwash-hero .carwash-stat {
    grid-template-columns: 52px minmax(0, 1fr) !important;
    gap: 4px 10px !important;
  }
  .site-hero-unified.carwash-hero .carwash-stat span {
    width: 52px !important;
    height: 52px !important;
  }
  .site-hero-unified.carwash-hero .carwash-stat span img {
    width: 34px !important;
    height: 34px !important;
  }
  .site-hero-unified.carwash-hero .carwash-stat b {
    font-size: 14px !important;
  }
  .site-hero-unified.carwash-hero .carwash-stat small {
    font-size: 12px !important;
  }

  .site-hero-unified.business-hero .business-hero-stats {
    gap: 16px 20px !important;
    margin-top: 28px !important;
  }
  .site-hero-unified.business-hero .business-hero-stat {
    grid-template-columns: 50px minmax(0, 1fr) !important;
    gap: 12px !important;
  }
  .site-hero-unified.business-hero .business-hero-stat img {
    width: 50px !important;
    height: 50px !important;
  }
  .site-hero-unified.business-hero .business-hero-stat p {
    font-size: 15px !important;
    line-height: 1.24 !important;
  }

  .site-hero-unified.gbo-hero .gbo-hero-features {
    gap: 14px !important;
    margin-top: 28px !important;
  }
  .site-hero-unified.gbo-hero .gbo-hero-features div {
    grid-template-columns: 45px minmax(0, 1fr) !important;
    gap: 9px !important;
    font-size: 12.5px !important;
    line-height: 1.22 !important;
  }
  .site-hero-unified.gbo-hero .gbo-hero-features span {
    width: 45px !important;
    height: 45px !important;
    flex-basis: 45px !important;
  }
  .site-hero-unified.gbo-hero .gbo-hero-features span img {
    width: 29px !important;
    height: 29px !important;
  }

  .site-hero-unified .vacancies-hero__facts {
    font-size: 1.25em !important;
    gap: 18px !important;
  }
  .site-hero-unified .vacancies-hero__facts img {
    width: 46px !important;
    height: 46px !important;
  }
}


/* v199 — effective-viewport normalization for Windows 100% / 125% scaling.
   The browser exposes scaled CSS pixels, not the OS scale setting itself.
   Keep the 1440–1719px band on the moderate v197 scale and reserve the 25% v198
   treatment for genuinely wide CSS viewports (1720px+). */
@media (min-width: 1440px) and (max-width: 1719px) and (min-height: 760px) {
  .site-hero-unified:not(.site-hero-unified--text) {
    --hero-copy-left: clamp(52px, 6vw, 92px);
    --hero-copy-top: clamp(62px, 7vh, 84px);
  }

  .site-hero-unified:not(.site-hero-unified--text) .site-hero-unified__content h1,
  .site-hero-unified:not(.site-hero-unified--text) .site-hero-unified__content h1 span,
  .site-hero-unified:not(.site-hero-unified--text) .site-hero-unified__content h1 em {
    font-size: clamp(54px, 3.55vw, 60px) !important;
    line-height: 1.06 !important;
    letter-spacing: -1.7px !important;
  }

  .site-hero-unified:not(.site-hero-unified--text) .site-hero-unified__content h1 {
    margin-bottom: 30px !important;
  }

  .site-hero-unified:not(.site-hero-unified--text) .site-hero-unified__content > p {
    font-size: clamp(18px, 1.2vw, 20px) !important;
    line-height: 1.5 !important;
    margin-bottom: 30px !important;
  }

  .site-hero-unified.agzs-hero .agzs-hero-actions,
  .site-hero-unified.gbo-hero .gbo-actions,
  .site-hero-unified.carwash-hero .carwash-actions,
  .site-hero-unified.business-hero .business-hero-actions,
  .site-hero-unified.gasholder-hero .gasholder-hero__actions,
  .site-hero-unified.hero .hero-actions,
  .site-hero-unified.vacancies-hero .vacancies-hero__actions {
    transform: scale(1.08) !important;
    transform-origin: left top !important;
  }
}

/* v201 — desktop hero safe-zone correction.
   Supporting controls/facts are positioned inside the 40% copy column, not from the
   viewport a second time. This prevents the right drift seen at Windows 100/125%.
   CTA groups use real layout dimensions (no transform scaling), so they participate
   in width calculations and cannot cross the 40% copy/media boundary. */
@media (min-width: 1101px) {
  .site-hero-unified:not(.site-hero-unified--text) .site-hero-unified__content {
    overflow: visible !important;
    padding-right: clamp(18px, 2vw, 34px) !important;
  }

  .site-hero-unified.agzs-hero .agzs-hero-actions,
  .site-hero-unified.gbo-hero .gbo-actions,
  .site-hero-unified.carwash-hero .carwash-actions,
  .site-hero-unified.business-hero .business-hero-actions,
  .site-hero-unified.gasholder-hero .gasholder-hero__actions,
  .site-hero-unified.hero .hero-actions,
  .site-hero-unified.vacancies-hero .vacancies-hero__actions {
    width: 100% !important;
    max-width: 100% !important;
    transform: none !important;
    box-sizing: border-box !important;
  }

  .site-hero-unified.agzs-hero .agzs-hero-points,
  .site-hero-unified.gbo-hero .gbo-hero-features,
  .site-hero-unified.carwash-hero .carwash-stats,
  .site-hero-unified.business-hero .business-hero-stats,
  .site-hero-unified.gasholder-hero .gasholder-quick {
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }

  /* Gasholder mini-panel: keep it fully visible in the lower safe zone. */
  .site-hero-unified.gasholder-hero .site-hero-unified__content {
    padding-bottom: 168px !important;
  }
  .site-hero-unified.gasholder-hero .gasholder-quick {
    bottom: 22px !important;
    padding: 14px 16px !important;
  }
  .site-hero-unified.gasholder-hero .gasholder-quick strong {
    margin-bottom: 10px !important;
  }
  .site-hero-unified.gasholder-hero .gasholder-quick > div {
    gap: 12px !important;
  }

  /* AGZS / GBO: actions stay in the copy column instead of entering the photo. */
  .site-hero-unified.agzs-hero .agzs-hero-actions,
  .site-hero-unified.gbo-hero .gbo-actions {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 14px !important;
  }
  .site-hero-unified.agzs-hero .agzs-hero-actions > *,
  .site-hero-unified.gbo-hero .gbo-actions > * {
    min-width: 0 !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }

  /* Carwash: compact the lower information row and reserve its own safe area. */
  .site-hero-unified.carwash-hero .site-hero-unified__content {
    padding-bottom: 118px !important;
  }
  .site-hero-unified.carwash-hero .carwash-stats {
    bottom: 18px !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 8px !important;
  }
  .site-hero-unified.carwash-hero .carwash-stat {
    min-width: 0 !important;
  }

  /* Vacancies did not use the lower-safe-zone rule: reserve space explicitly so
     the facts never collide with the CTA or fall below the first-screen hero. */
  .site-hero-unified.vacancies-hero .site-hero-unified__content {
    height: 100% !important;
    max-height: var(--hero-height) !important;
    padding-bottom: 122px !important;
  }
  .site-hero-unified.vacancies-hero .vacancies-hero__facts {
    position: absolute !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 22px !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 8px !important;
    font-size: 1em !important;
    box-sizing: border-box !important;
  }
  .site-hero-unified.vacancies-hero .vacancies-hero__facts span {
    min-width: 0 !important;
  }
}

/* Effective 125% desktop / shorter viewport: compact only vertical spacing.
   Horizontal 40/60 geometry remains identical. */
@media (min-width: 1101px) and (max-height: 760px) {
  .site-hero-unified:not(.site-hero-unified--text) {
    --hero-copy-top: 34px !important;
  }
  .site-hero-unified:not(.site-hero-unified--text) .site-hero-unified__content h1 {
    margin-bottom: 18px !important;
  }
  .site-hero-unified:not(.site-hero-unified--text) .site-hero-unified__content > p {
    margin-bottom: 18px !important;
  }
  .site-hero-unified.gasholder-hero .gasholder-quick { bottom: 14px !important; }
  .site-hero-unified.carwash-hero .carwash-stats { bottom: 12px !important; }
  .site-hero-unified.vacancies-hero .vacancies-hero__facts { bottom: 14px !important; }
}

/* Wide 100% desktop: preserve proportional typography without transform-based CTA growth. */
@media (min-width: 1720px) and (min-height: 760px) {
  .site-hero-unified.agzs-hero .agzs-hero-actions,
  .site-hero-unified.gbo-hero .gbo-actions,
  .site-hero-unified.carwash-hero .carwash-actions,
  .site-hero-unified.business-hero .business-hero-actions,
  .site-hero-unified.gasholder-hero .gasholder-hero__actions,
  .site-hero-unified.hero .hero-actions,
  .site-hero-unified.vacancies-hero .vacancies-hero__actions {
    transform: none !important;
  }
  .site-hero-unified.gasholder-hero .gasholder-quick {
    margin-top: 0 !important;
    bottom: 22px !important;
  }
  .site-hero-unified.carwash-hero .carwash-stats {
    margin-top: 0 !important;
    bottom: 18px !important;
  }
  .site-hero-unified.vacancies-hero .vacancies-hero__facts {
    font-size: 1em !important;
    gap: 8px !important;
  }
}

/* v202 — wide desktop (Windows 100% effective viewport) hero detail correction.
   Keeps v201 safe-zone geometry, but restores readable supporting information on
   GBO/vacancies and separates the gasholder CTA from its quick-link panel. */
@media (min-width: 1720px) and (min-height: 760px) {
  /* GBO: supporting icons/text are intentionally 10–15% larger on wide desktop. */
  .site-hero-unified.gbo-hero .gbo-hero-features {
    bottom: 30px !important;
    gap: 16px !important;
    font-size: 1em !important;
  }
  .site-hero-unified.gbo-hero .gbo-hero-features div {
    grid-template-columns: 52px minmax(0, 1fr) !important;
    gap: 10px !important;
    font-size: 14px !important;
    line-height: 1.24 !important;
  }
  .site-hero-unified.gbo-hero .gbo-hero-features span {
    width: 52px !important;
    height: 52px !important;
    flex-basis: 52px !important;
  }
  .site-hero-unified.gbo-hero .gbo-hero-features span img {
    width: 34px !important;
    height: 34px !important;
  }

  /* Vacancies: keep all four facts clearly inside the first-screen hero. */
  .site-hero-unified.vacancies-hero .site-hero-unified__content {
    padding-bottom: 168px !important;
  }
  .site-hero-unified.vacancies-hero .vacancies-hero__facts {
    bottom: 46px !important;
    gap: 14px !important;
    font-size: 1.16em !important;
    line-height: 1.22 !important;
  }
  .site-hero-unified.vacancies-hero .vacancies-hero__facts img {
    width: 50px !important;
    height: 50px !important;
  }
  .site-hero-unified.vacancies-hero .vacancies-hero__facts span {
    align-items: center !important;
  }

  /* Gasholders: lift the primary CTA away from the lower quick-link panel. */
  .site-hero-unified.gasholder-hero .site-hero-unified__content {
    padding-bottom: 188px !important;
  }
  .site-hero-unified.gasholder-hero .gasholder-hero__actions {
    position: relative !important;
    top: -14px !important;
    margin-bottom: 18px !important;
  }
  .site-hero-unified.gasholder-hero .gasholder-quick {
    bottom: 22px !important;
  }
}

/* v203 — wide desktop hero finishing pass (Windows 100% effective viewport).
   Scope is intentionally limited to genuinely wide/high desktop viewports so the
   125% Windows scaling layout from v199-v202 is left unchanged. */
@media (min-width: 1720px) and (min-height: 760px) {
  /* Vacancies: move the full copy stack upward and keep facts in a readable 2x2 grid
     inside the copy column instead of pinning them to the bottom edge of the hero. */
  .site-hero-unified.vacancies-hero {
    --hero-copy-top: 52px !important;
  }
  .site-hero-unified.vacancies-hero .site-hero-unified__content {
    padding-top: var(--hero-copy-top) !important;
    padding-bottom: 34px !important;
  }
  .site-hero-unified.vacancies-hero .site-hero-unified__content h1 {
    margin-bottom: 24px !important;
  }
  .site-hero-unified.vacancies-hero .site-hero-unified__content > p {
    margin-bottom: 24px !important;
  }
  .site-hero-unified.vacancies-hero .vacancies-hero__actions {
    margin-bottom: 0 !important;
  }
  .site-hero-unified.vacancies-hero .vacancies-hero__facts {
    position: static !important;
    inset: auto !important;
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 16px 22px !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 28px 0 0 !important;
    font-size: 1.14em !important;
    line-height: 1.22 !important;
  }
  .site-hero-unified.vacancies-hero .vacancies-hero__facts span {
    display: grid !important;
    grid-template-columns: 54px minmax(0, 1fr) !important;
    align-items: center !important;
    gap: 11px !important;
    min-width: 0 !important;
  }
  .site-hero-unified.vacancies-hero .vacancies-hero__facts img {
    width: 54px !important;
    height: 54px !important;
    object-fit: contain !important;
  }

  /* Gasholders: create a clear visual gap between the calculation CTA and quick panel. */
  .site-hero-unified.gasholder-hero .gasholder-button {
    display: inline-flex !important;
    position: relative !important;
    z-index: 2 !important;
    margin-bottom: 26px !important;
  }
  .site-hero-unified.gasholder-hero .gasholder-quick {
    margin-top: 0 !important;
  }

  /* Carwash: lift the whole copy stack, slightly reduce oversized headline/lead,
     and make the supporting stats larger and easier to read while staying in-frame. */
  .site-hero-unified.carwash-hero {
    --hero-copy-top: 46px !important;
  }
  .site-hero-unified.carwash-hero .site-hero-unified__content {
    padding-top: var(--hero-copy-top) !important;
    padding-bottom: 28px !important;
  }
  .site-hero-unified.carwash-hero .site-hero-unified__content h1,
  .site-hero-unified.carwash-hero .site-hero-unified__content h1 span {
    font-size: clamp(52px, 3.2vw, 60px) !important;
    line-height: 1.035 !important;
    letter-spacing: -1.5px !important;
  }
  .site-hero-unified.carwash-hero .site-hero-unified__content h1 {
    margin-bottom: 20px !important;
  }
  .site-hero-unified.carwash-hero .site-hero-unified__content > p {
    font-size: clamp(20px, 1.25vw, 22px) !important;
    line-height: 1.42 !important;
    margin-bottom: 22px !important;
  }
  .site-hero-unified.carwash-hero .carwash-actions {
    margin-bottom: 0 !important;
  }
  .site-hero-unified.carwash-hero .carwash-stats {
    position: static !important;
    inset: auto !important;
    margin-top: 26px !important;
    gap: 14px !important;
  }
  .site-hero-unified.carwash-hero .carwash-stat {
    grid-template-columns: 58px minmax(0, 1fr) !important;
    gap: 3px 10px !important;
    align-items: center !important;
  }
  .site-hero-unified.carwash-hero .carwash-stat span {
    width: 58px !important;
    height: 58px !important;
  }
  .site-hero-unified.carwash-hero .carwash-stat span img {
    width: 38px !important;
    height: 38px !important;
  }
  .site-hero-unified.carwash-hero .carwash-stat b {
    font-size: 15px !important;
    line-height: 1.16 !important;
  }
  .site-hero-unified.carwash-hero .carwash-stat small {
    font-size: 13px !important;
    line-height: 1.18 !important;
  }
}

/* v204 — Windows 125% effective-viewport hero correction.
   Target the intermediate 1440–1719px desktop band only. Keep the first-screen hero
   and 40/60 split, but compact the copy stack and use 2-column supporting grids so
   all controls stay visible inside the hero at 125% OS scaling. */
@media (min-width: 1440px) and (max-width: 1719px) and (min-height: 700px) {
  /* GBO: compact upper copy, then 2+1 features with ~10% larger icons/text. */
  .site-hero-unified.gbo-hero {
    --hero-copy-top: 38px !important;
  }
  .site-hero-unified.gbo-hero .site-hero-unified__content {
    padding-top: var(--hero-copy-top) !important;
    padding-bottom: 22px !important;
  }
  .site-hero-unified.gbo-hero .site-hero-unified__content h1,
  .site-hero-unified.gbo-hero .site-hero-unified__content h1 span {
    font-size: 50px !important;
    line-height: 1.04 !important;
  }
  .site-hero-unified.gbo-hero .site-hero-unified__content h1 {
    margin-bottom: 20px !important;
  }
  .site-hero-unified.gbo-hero .site-hero-unified__content > p {
    font-size: 17px !important;
    line-height: 1.42 !important;
    margin-bottom: 20px !important;
  }
  .site-hero-unified.gbo-hero .gbo-actions {
    transform: none !important;
    margin-bottom: 0 !important;
  }
  .site-hero-unified.gbo-hero .gbo-hero-features {
    position: static !important;
    inset: auto !important;
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 12px 16px !important;
    margin: 22px 0 0 !important;
    width: 100% !important;
    max-width: 100% !important;
  }
  .site-hero-unified.gbo-hero .gbo-hero-features div {
    grid-template-columns: 40px minmax(0, 1fr) !important;
    gap: 9px !important;
    font-size: 11px !important;
    line-height: 1.2 !important;
  }
  .site-hero-unified.gbo-hero .gbo-hero-features span {
    width: 40px !important;
    height: 40px !important;
    flex-basis: 40px !important;
  }
  .site-hero-unified.gbo-hero .gbo-hero-features span img {
    width: 26px !important;
    height: 26px !important;
  }

  /* Carwash: lift and compact copy, use 2+1 stat grid, enlarge stat icons/text. */
  .site-hero-unified.carwash-hero {
    --hero-copy-top: 28px !important;
  }
  .site-hero-unified.carwash-hero .site-hero-unified__content {
    padding-top: var(--hero-copy-top) !important;
    padding-bottom: 20px !important;
  }
  .site-hero-unified.carwash-hero .site-hero-unified__content h1,
  .site-hero-unified.carwash-hero .site-hero-unified__content h1 span {
    font-size: 39px !important;
    line-height: 1.02 !important;
    letter-spacing: -1px !important;
  }
  .site-hero-unified.carwash-hero .site-hero-unified__content h1 {
    margin-bottom: 16px !important;
  }
  .site-hero-unified.carwash-hero .site-hero-unified__content > p {
    font-size: 16px !important;
    line-height: 1.38 !important;
    margin-bottom: 16px !important;
  }
  .site-hero-unified.carwash-hero .carwash-actions {
    transform: none !important;
    margin-bottom: 0 !important;
    gap: 10px !important;
  }
  .site-hero-unified.carwash-hero .carwash-stats {
    position: static !important;
    inset: auto !important;
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 10px 14px !important;
    margin: 18px 0 0 !important;
    width: 100% !important;
    max-width: 100% !important;
  }
  .site-hero-unified.carwash-hero .carwash-stat {
    grid-template-columns: 46px minmax(0, 1fr) !important;
    gap: 3px 9px !important;
  }
  .site-hero-unified.carwash-hero .carwash-stat span {
    width: 46px !important;
    height: 46px !important;
  }
  .site-hero-unified.carwash-hero .carwash-stat span img {
    width: 31px !important;
    height: 31px !important;
  }
  .site-hero-unified.carwash-hero .carwash-stat b {
    font-size: 12px !important;
    line-height: 1.16 !important;
  }
  .site-hero-unified.carwash-hero .carwash-stat small {
    font-size: 11px !important;
    line-height: 1.18 !important;
  }

  /* Gasholders: reduce copy stack and keep quick panel fully visible with clear spacing. */
  .site-hero-unified.gasholder-hero {
    --hero-copy-top: 34px !important;
  }
  .site-hero-unified.gasholder-hero .site-hero-unified__content {
    padding-top: var(--hero-copy-top) !important;
    padding-bottom: 18px !important;
  }
  .site-hero-unified.gasholder-hero .gasholder-hero__content h1,
  .site-hero-unified.gasholder-hero .gasholder-hero__content h1 span {
    font-size: 46px !important;
    line-height: 1.035 !important;
  }
  .site-hero-unified.gasholder-hero .gasholder-hero__content h1 {
    margin-bottom: 18px !important;
  }
  .site-hero-unified.gasholder-hero .gasholder-hero__content > p {
    font-size: 16.5px !important;
    line-height: 1.4 !important;
    margin-bottom: 18px !important;
  }
  .site-hero-unified.gasholder-hero .gasholder-button {
    margin-bottom: 18px !important;
  }
  .site-hero-unified.gasholder-hero .gasholder-quick {
    position: static !important;
    inset: auto !important;
    margin: 0 !important;
    padding: 13px 15px !important;
    width: 100% !important;
    max-width: 100% !important;
  }
  .site-hero-unified.gasholder-hero .gasholder-quick strong {
    margin-bottom: 9px !important;
    font-size: 15px !important;
  }
  .site-hero-unified.gasholder-hero .gasholder-quick > div {
    gap: 10px !important;
  }
  .site-hero-unified.gasholder-hero .gasholder-quick a,
  .site-hero-unified.gasholder-hero .gasholder-quick button {
    font-size: 11px !important;
    line-height: 1.2 !important;
  }
  .site-hero-unified.gasholder-hero .gasholder-line-icon {
    width: 34px !important;
    height: 34px !important;
  }

  /* Vacancies: compact main copy, 2x2 facts, slightly larger fact icons/text. */
  .site-hero-unified.vacancies-hero {
    --hero-copy-top: 30px !important;
  }
  .site-hero-unified.vacancies-hero .site-hero-unified__content {
    padding-top: var(--hero-copy-top) !important;
    padding-bottom: 18px !important;
  }
  .site-hero-unified.vacancies-hero .site-hero-unified__content h1,
  .site-hero-unified.vacancies-hero .site-hero-unified__content h1 span {
    font-size: 47px !important;
    line-height: 1.04 !important;
  }
  .site-hero-unified.vacancies-hero .site-hero-unified__content h1 {
    margin-bottom: 18px !important;
  }
  .site-hero-unified.vacancies-hero .site-hero-unified__content > p {
    font-size: 16.5px !important;
    line-height: 1.4 !important;
    margin-bottom: 18px !important;
  }
  .site-hero-unified.vacancies-hero .vacancies-hero__actions {
    transform: none !important;
    margin-bottom: 0 !important;
  }
  .site-hero-unified.vacancies-hero .vacancies-hero__facts {
    position: static !important;
    inset: auto !important;
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 11px 16px !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 18px 0 0 !important;
    font-size: 1em !important;
    line-height: 1.18 !important;
  }
  .site-hero-unified.vacancies-hero .vacancies-hero__facts span {
    display: grid !important;
    grid-template-columns: 42px minmax(0, 1fr) !important;
    align-items: center !important;
    gap: 9px !important;
    min-width: 0 !important;
  }
  .site-hero-unified.vacancies-hero .vacancies-hero__facts img {
    width: 42px !important;
    height: 42px !important;
    object-fit: contain !important;
  }
}

/* v205 — compact 1905px-class wide desktop correction.
   Some 100% Windows/browser combinations expose a ~1900 CSS-px viewport. The generic
   1720+ scale is too large there, so gasholders/vacancies get a compact first-screen
   composition while true ultrawide layouts keep the existing wide treatment. */
@media (min-width: 1720px) and (max-width: 2099px) and (min-height: 760px) {
  .site-hero-unified.gasholder-hero {
    --hero-copy-top: 30px !important;
  }
  .site-hero-unified.gasholder-hero .site-hero-unified__content {
    padding-top: var(--hero-copy-top) !important;
    padding-bottom: 18px !important;
  }
  .site-hero-unified.gasholder-hero .gasholder-hero__content h1,
  .site-hero-unified.gasholder-hero .gasholder-hero__content h1 span {
    font-size: 52px !important;
    line-height: 1.035 !important;
    letter-spacing: -1.2px !important;
  }
  .site-hero-unified.gasholder-hero .gasholder-hero__content h1 {
    margin-bottom: 18px !important;
  }
  .site-hero-unified.gasholder-hero .gasholder-hero__content > p {
    font-size: 18px !important;
    line-height: 1.4 !important;
    margin-bottom: 18px !important;
  }
  .site-hero-unified.gasholder-hero .gasholder-hero__actions {
    position: static !important;
    inset: auto !important;
    margin: 0 0 22px !important;
    transform: none !important;
  }
  .site-hero-unified.gasholder-hero .gasholder-button {
    margin: 0 !important;
  }
  .site-hero-unified.gasholder-hero .gasholder-quick {
    position: static !important;
    inset: auto !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 14px 16px !important;
  }
  .site-hero-unified.gasholder-hero .gasholder-quick strong {
    margin-bottom: 10px !important;
    font-size: 16px !important;
  }
  .site-hero-unified.gasholder-hero .gasholder-quick > div {
    gap: 12px !important;
  }
  .site-hero-unified.gasholder-hero .gasholder-quick a,
  .site-hero-unified.gasholder-hero .gasholder-quick button {
    font-size: 12px !important;
    line-height: 1.2 !important;
  }
  .site-hero-unified.gasholder-hero .gasholder-line-icon {
    width: 38px !important;
    height: 38px !important;
  }

  .site-hero-unified.vacancies-hero {
    --hero-copy-top: 26px !important;
  }
  .site-hero-unified.vacancies-hero .site-hero-unified__content {
    padding-top: var(--hero-copy-top) !important;
    padding-bottom: 18px !important;
  }
  .site-hero-unified.vacancies-hero .site-hero-unified__content h1,
  .site-hero-unified.vacancies-hero .site-hero-unified__content h1 span {
    font-size: 52px !important;
    line-height: 1.035 !important;
    letter-spacing: -1.2px !important;
  }
  .site-hero-unified.vacancies-hero .site-hero-unified__content h1 {
    margin-bottom: 16px !important;
  }
  .site-hero-unified.vacancies-hero .site-hero-unified__content > p {
    font-size: 17.5px !important;
    line-height: 1.38 !important;
    margin-bottom: 18px !important;
  }
  .site-hero-unified.vacancies-hero .vacancies-hero__actions {
    position: static !important;
    inset: auto !important;
    margin: 0 !important;
    transform: none !important;
  }
  .site-hero-unified.vacancies-hero .vacancies-hero__facts {
    position: static !important;
    inset: auto !important;
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 12px 18px !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 20px 0 0 !important;
    font-size: 1.04em !important;
    line-height: 1.18 !important;
  }
  .site-hero-unified.vacancies-hero .vacancies-hero__facts span {
    display: grid !important;
    grid-template-columns: 46px minmax(0, 1fr) !important;
    align-items: center !important;
    gap: 10px !important;
    min-width: 0 !important;
  }
  .site-hero-unified.vacancies-hero .vacancies-hero__facts img {
    width: 46px !important;
    height: 46px !important;
    object-fit: contain !important;
  }
}

/* v206 — restore breathing room in Vacancies and Gasholders hero copy stacks.
   Keep the compact first-screen fit from v204/v205, but avoid visually compressed
   title/lead/actions/supporting blocks. Scoped only to desktop effective viewports. */
@media (min-width: 1440px) and (max-width: 1719px) and (min-height: 700px) {
  .site-hero-unified.gasholder-hero .gasholder-hero__content h1 {
    margin-bottom: 22px !important;
  }
  .site-hero-unified.gasholder-hero .gasholder-hero__content > p {
    margin-bottom: 22px !important;
  }
  .site-hero-unified.gasholder-hero .gasholder-hero__actions {
    margin-bottom: 26px !important;
  }
  .site-hero-unified.vacancies-hero .site-hero-unified__content h1 {
    margin-bottom: 22px !important;
  }
  .site-hero-unified.vacancies-hero .site-hero-unified__content > p {
    margin-bottom: 22px !important;
  }
  .site-hero-unified.vacancies-hero .vacancies-hero__actions {
    margin-bottom: 0 !important;
  }
  .site-hero-unified.vacancies-hero .vacancies-hero__facts {
    margin-top: 24px !important;
    row-gap: 14px !important;
  }
}

@media (min-width: 1720px) and (max-width: 2099px) and (min-height: 760px) {
  .site-hero-unified.gasholder-hero .gasholder-hero__content h1 {
    margin-bottom: 24px !important;
  }
  .site-hero-unified.gasholder-hero .gasholder-hero__content > p {
    margin-bottom: 24px !important;
  }
  .site-hero-unified.gasholder-hero .gasholder-hero__actions {
    margin-bottom: 30px !important;
  }
  .site-hero-unified.vacancies-hero .site-hero-unified__content h1 {
    margin-bottom: 22px !important;
  }
  .site-hero-unified.vacancies-hero .site-hero-unified__content > p {
    margin-bottom: 22px !important;
  }
  .site-hero-unified.vacancies-hero .vacancies-hero__actions {
    margin-bottom: 0 !important;
  }
  .site-hero-unified.vacancies-hero .vacancies-hero__facts {
    margin-top: 26px !important;
    row-gap: 15px !important;
  }
}

/* v207 — stronger desktop breathing room requested after v206.
   Only Vacancies and Gasholders: visibly separate title, lead, actions and supporting blocks. */
@media (min-width: 1440px) and (max-width: 1719px) and (min-height: 700px) {
  .site-hero-unified.gasholder-hero .gasholder-hero__content h1 { margin-bottom: 30px !important; }
  .site-hero-unified.gasholder-hero .gasholder-hero__content > p { margin-bottom: 30px !important; }
  .site-hero-unified.gasholder-hero .gasholder-hero__actions { margin-bottom: 36px !important; }
  .site-hero-unified.vacancies-hero .site-hero-unified__content h1 { margin-bottom: 30px !important; }
  .site-hero-unified.vacancies-hero .site-hero-unified__content > p { margin-bottom: 30px !important; }
  .site-hero-unified.vacancies-hero .vacancies-hero__facts { margin-top: 34px !important; row-gap: 18px !important; }
}

@media (min-width: 1720px) and (max-width: 2099px) and (min-height: 760px) {
  .site-hero-unified.gasholder-hero .gasholder-hero__content h1 { margin-bottom: 34px !important; }
  .site-hero-unified.gasholder-hero .gasholder-hero__content > p { margin-bottom: 32px !important; }
  .site-hero-unified.gasholder-hero .gasholder-hero__actions { margin-bottom: 40px !important; }
  .site-hero-unified.vacancies-hero .site-hero-unified__content h1 { margin-bottom: 34px !important; }
  .site-hero-unified.vacancies-hero .site-hero-unified__content > p { margin-bottom: 32px !important; }
  .site-hero-unified.vacancies-hero .vacancies-hero__facts { margin-top: 38px !important; row-gap: 20px !important; }
}

/* v208 — desktop hero readability refinement for 1900px-class layouts.
   Gasholders/Vacancies: restore larger typography and more breathing room without
   pushing support blocks out of the first screen. Carwash: 2+1 stats grid with
   stronger supporting typography. */
@media (min-width: 1720px) and (max-width: 2099px) and (min-height: 760px) {
  .site-hero-unified.gasholder-hero {
    --hero-copy-top: 44px !important;
  }
  .site-hero-unified.gasholder-hero .site-hero-unified__content {
    padding-top: var(--hero-copy-top) !important;
    padding-bottom: 22px !important;
  }
  .site-hero-unified.gasholder-hero .gasholder-hero__content h1,
  .site-hero-unified.gasholder-hero .gasholder-hero__content h1 span {
    font-size: 58px !important;
    line-height: 1.045 !important;
    letter-spacing: -1.1px !important;
  }
  .site-hero-unified.gasholder-hero .gasholder-hero__content h1 {
    margin-bottom: 38px !important;
  }
  .site-hero-unified.gasholder-hero .gasholder-hero__content > p {
    font-size: 20px !important;
    line-height: 1.46 !important;
    margin-bottom: 34px !important;
  }
  .site-hero-unified.gasholder-hero .gasholder-hero__actions {
    margin-bottom: 34px !important;
  }
  .site-hero-unified.gasholder-hero .gasholder-quick {
    padding: 18px 18px !important;
  }
  .site-hero-unified.gasholder-hero .gasholder-quick strong {
    font-size: 18px !important;
    margin-bottom: 14px !important;
  }
  .site-hero-unified.gasholder-hero .gasholder-quick a,
  .site-hero-unified.gasholder-hero .gasholder-quick button {
    font-size: 13.5px !important;
    line-height: 1.28 !important;
  }
  .site-hero-unified.gasholder-hero .gasholder-line-icon {
    width: 42px !important;
    height: 42px !important;
  }

  .site-hero-unified.vacancies-hero {
    --hero-copy-top: 42px !important;
  }
  .site-hero-unified.vacancies-hero .site-hero-unified__content {
    padding-top: var(--hero-copy-top) !important;
    padding-bottom: 24px !important;
  }
  .site-hero-unified.vacancies-hero .site-hero-unified__content h1,
  .site-hero-unified.vacancies-hero .site-hero-unified__content h1 span {
    font-size: 58px !important;
    line-height: 1.045 !important;
    letter-spacing: -1.1px !important;
  }
  .site-hero-unified.vacancies-hero .site-hero-unified__content h1 {
    margin-bottom: 36px !important;
  }
  .site-hero-unified.vacancies-hero .site-hero-unified__content > p {
    font-size: 19px !important;
    line-height: 1.44 !important;
    margin-bottom: 32px !important;
  }
  .site-hero-unified.vacancies-hero .vacancies-hero__facts {
    margin-top: 34px !important;
    gap: 22px 24px !important;
    font-size: 1.1em !important;
    line-height: 1.24 !important;
  }
  .site-hero-unified.vacancies-hero .vacancies-hero__facts span {
    grid-template-columns: 50px minmax(0, 1fr) !important;
    gap: 12px !important;
  }
  .site-hero-unified.vacancies-hero .vacancies-hero__facts img {
    width: 50px !important;
    height: 50px !important;
  }

  .site-hero-unified.carwash-hero .carwash-stats {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 18px 20px !important;
    width: 100% !important;
    max-width: 100% !important;
  }
  .site-hero-unified.carwash-hero .carwash-stat {
    grid-template-columns: 60px minmax(0, 1fr) !important;
    column-gap: 12px !important;
    min-width: 0 !important;
  }
  .site-hero-unified.carwash-hero .carwash-stat:nth-child(3) {
    grid-column: 1 / 2 !important;
  }
  .site-hero-unified.carwash-hero .carwash-stat span {
    width: 60px !important;
    height: 60px !important;
  }
  .site-hero-unified.carwash-hero .carwash-stat span img {
    width: 40px !important;
    height: 40px !important;
  }
  .site-hero-unified.carwash-hero .carwash-stat b,
  .site-hero-unified.carwash-hero .carwash-stat small {
    font-weight: 700 !important;
  }
  .site-hero-unified.carwash-hero .carwash-stat b {
    font-size: 16px !important;
    line-height: 1.18 !important;
  }
  .site-hero-unified.carwash-hero .carwash-stat small {
    font-size: 14px !important;
    line-height: 1.2 !important;
  }
}

/* v209 — Gasholders 1905px-class hero split correction.
   Keep the actual 40/60 copy/media geometry and make the visual transition match it:
   the previous long 180px media mask made the white copy field read wider than 40%. */
@media (min-width: 1720px) and (max-width: 2099px) and (min-height: 760px) {
  .site-hero-unified.gasholder-hero {
    --hero-copy-zone: 40% !important;
    --hero-media-zone: 60% !important;
    --hero-media-render-width: 60vw !important;
    --hero-fade-width: 112px !important;
  }

  .site-hero-unified.gasholder-hero .site-hero-unified__media {
    left: 40% !important;
    width: 60% !important;
    -webkit-mask-image: linear-gradient(90deg,
      transparent 0,
      rgba(0,0,0,.30) 28px,
      rgba(0,0,0,.72) 62px,
      #000 112px,
      #000 100%) !important;
    mask-image: linear-gradient(90deg,
      transparent 0,
      rgba(0,0,0,.30) 28px,
      rgba(0,0,0,.72) 62px,
      #000 112px,
      #000 100%) !important;
  }

  .site-hero-unified.gasholder-hero .site-hero-unified__content {
    width: 40% !important;
    max-width: 40% !important;
  }
}

/* v210 — Gasholders 1905px-class final visual split + CTA/quick-panel separation.
   The source hero image already contains a wide baked-in white fade on its left side.
   Rendering only the nominal 60% slice therefore made the visible photo begin much later
   than the intended 40% boundary. Let the image canvas extend behind the copy while the
   actual visible photo begins around the 40% line. Keep copy itself strictly in 40%.
   Also restore an explicit gap between the standalone CTA and the quick panel. */
@media (min-width: 1720px) and (max-width: 2099px) and (min-height: 760px) {
  .site-hero-unified.gasholder-hero {
    --hero-copy-zone: 40% !important;
    --hero-media-zone: 96% !important;
    --hero-media-render-width: 96vw !important;
  }

  .site-hero-unified.gasholder-hero .site-hero-unified__content {
    width: 40% !important;
    max-width: 40% !important;
  }

  .site-hero-unified.gasholder-hero .site-hero-unified__media {
    left: 4% !important;
    width: 96% !important;
    -webkit-mask-image: none !important;
    mask-image: none !important;
  }

  .site-hero-unified.gasholder-hero .site-hero-unified__media img {
    width: 96vw !important;
    min-width: 96vw !important;
    max-width: 96vw !important;
    right: 0 !important;
    object-position: right center !important;
  }

  .site-hero-unified.gasholder-hero .gasholder-button {
    margin: 0 0 30px 0 !important;
  }

  .site-hero-unified.gasholder-hero .gasholder-quick {
    margin: 0 !important;
  }
}