/*
 * CARELO FV — Figma "FIX" implementation
 * Source frames: desktop 1366 × 669 (header 96 + FV 573), mobile 390 × 784
 * The layout intentionally uses live HTML text and individual assets, not a flattened FV image.
 */

:root {
  --carelo-deep-green: #01433a;
  --carelo-green: #008f7d;
  --carelo-header-rule: #b9dcd5;
  --carelo-orange: #f26a21;
}

.figma-site-header,
.figma-site-header * {
  box-sizing: border-box;
}

.figma-site-header {
  position: relative !important;
  z-index: 100 !important;
  width: 100% !important;
  height: 96px !important;
  min-height: 96px !important;
  background: #fff !important;
  border: 0 !important;
  box-shadow: inset 0 -2px 0 var(--carelo-header-rule) !important;
}

.figma-site-header__inner {
  position: relative !important;
  display: flex !important;
  align-items: stretch !important;
  width: min(100%, 1366px) !important;
  height: 96px !important;
  margin: 0 auto !important;
  padding: 0 !important;
  overflow: visible !important;
}

.figma-site-header .header-logo {
  position: absolute !important;
  top: 27px !important;
  left: 56px !important;
  display: block !important;
  width: 140px !important;
  height: 38px !important;
  min-height: 0 !important;
  margin: 0 !important;
}

.figma-site-header .header-logo img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
}

.figma-site-header__inner > nav {
  position: absolute !important;
  top: 0 !important;
  left: 565px !important;
  display: flex !important;
  align-items: center !important;
  gap: 7px !important;
  width: 408px !important;
  height: 94px !important;
  margin: 0 !important;
}

.figma-site-header__inner > nav a {
  display: grid !important;
  place-items: center !important;
  width: 118px !important;
  height: 94px !important;
  padding: 0 !important;
  color: #2d3534 !important;
  font-family: "Noto Sans JP", sans-serif !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  text-decoration: none !important;
  white-space: nowrap !important;
}

.figma-site-header .header-actions {
  position: absolute !important;
  top: 0 !important;
  right: 0 !important;
  display: grid !important;
  grid-template-columns: 190px 195px !important;
  width: 385px !important;
  height: 96px !important;
  margin: 0 !important;
  padding: 0 !important;
  border-left: 1px solid #d9e4e1 !important;
}

.figma-site-header .header-actions a {
  display: grid !important;
  place-items: center !important;
  width: 100% !important;
  height: 96px !important;
  margin: 0 !important;
  padding: 0 12px !important;
  border: 0 !important;
  border-radius: 0 !important;
  font-family: "Noto Sans JP", sans-serif !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  line-height: 1.45 !important;
  text-align: center !important;
  text-decoration: none !important;
  white-space: nowrap !important;
}

.figma-site-header .header-download {
  color: var(--carelo-green) !important;
  background: #fff !important;
}

.figma-site-header .header-contact {
  color: #fff !important;
  background: var(--carelo-orange) !important;
}

.figma-site-header .header-contact span {
  margin-left: 8px !important;
  font-size: 21px !important;
  line-height: 1 !important;
}

.figma-site-header .mobile-navigation {
  display: none !important;
}

.hero,
.hero * {
  box-sizing: border-box;
}

.hero {
  position: relative !important;
  width: 100% !important;
  height: min(41.947291vw, 573px) !important;
  min-height: 0 !important;
  max-height: 573px !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  background: #eef8f5 url("../assets/hero-fv-background.png") center / cover no-repeat !important;
}

.hero__stage {
  position: relative !important;
  width: min(100%, 1366px) !important;
  height: 100% !important;
  margin: 0 auto !important;
  padding: 0 !important;
  overflow: visible !important;
}

.hero__employee-zone,
.hero__message-zone,
.hero__product-zone,
.hero__mobile-wash,
.hero__actions {
  display: none !important;
}

.hero__person-top,
.hero__person-bottom,
.hero__benefits,
.hero__headline,
.hero__brand,
.hero__dashboard,
.hero__phone,
.hero__card,
.hero__authority {
  position: absolute !important;
  margin: 0 !important;
  transform: none !important;
}

.hero__person-top,
.hero__person-bottom {
  z-index: 2 !important;
  overflow: hidden !important;
  background: #d7e5e1 !important;
}

.hero__person-top {
  top: 9.075044% !important;
  left: 5.051245% !important;
  width: 15.885798% !important;
  height: 38.045375% !important;
  border-radius: 8px !important;
}

.hero__person-bottom {
  top: 53.228621% !important;
  left: -1.464129% !important;
  width: 28.989751% !important;
  height: 42.408377% !important;
  border-radius: 14px !important;
}

.hero__person-top img,
.hero__person-bottom img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
}

.hero__person-top img {
  object-position: 58% 50% !important;
}

.hero__person-bottom img {
  object-position: 50% 50% !important;
}

.hero__benefits {
  top: 5.061082% !important;
  left: 34.040996% !important;
  z-index: 4 !important;
  display: grid !important;
  gap: 10px !important;
  width: 31.918009% !important;
  height: auto !important;
}

.hero__benefit {
  display: flex !important;
  align-items: center !important;
  width: 100% !important;
  height: min(4.392387vw, 60px) !important;
  margin: 0 !important;
  padding: 0 min(1.317716vw, 18px) !important;
  border: 1px solid rgba(0, 143, 125, .22) !important;
  border-radius: 8px !important;
  background: rgba(255, 255, 255, .95) !important;
  box-shadow: 0 3px 12px rgba(1, 67, 58, .06) !important;
  color: #2b3432 !important;
  font-family: "Noto Sans JP", sans-serif !important;
  font-size: min(1.464129vw, 20px) !important;
  font-weight: 700 !important;
  line-height: 1.4 !important;
  white-space: nowrap !important;
}

.hero__benefit img {
  flex: 0 0 auto !important;
  width: min(2.781845vw, 38px) !important;
  height: min(3.733529vw, 51px) !important;
  margin: 0 min(1.024890vw, 14px) 0 0 !important;
  object-fit: contain !important;
}

.hero__headline {
  top: 30.017452% !important;
  left: 29.648609% !important;
  z-index: 4 !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  width: 40.716691% !important;
  height: 27.923211% !important;
  color: var(--carelo-deep-green) !important;
  font-family: "Noto Sans JP", sans-serif !important;
  font-size: min(3.647511vw, 49.825px) !important;
  font-weight: 900 !important;
  letter-spacing: 0 !important;
  line-height: 1.46 !important;
  text-align: center !important;
  white-space: nowrap !important;
}

.hero__headline span {
  display: block !important;
  width: fit-content !important;
  padding: 0 0 2px !important;
  border-bottom: min(.292826vw, 4px) solid var(--carelo-deep-green) !important;
}

.hero__brand {
  top: 63.525305% !important;
  left: 40.922401% !important;
  z-index: 4 !important;
  display: block !important;
  width: 18.155198% !important;
  height: 10.081850% !important;
  overflow: hidden !important;
}

.hero__authority {
  top: 78.534031% !important;
  left: 37.994144% !important;
  z-index: 4 !important;
  display: block !important;
  width: 24.084919% !important;
  height: 10.645724% !important;
  overflow: visible !important;
}

.hero__authority > img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: fill !important;
}

.hero__dashboard {
  top: 13.438045% !important;
  left: 68.960469% !important;
  z-index: 3 !important;
  display: block !important;
  width: 28.464275% !important;
  height: 42.509773% !important;
  object-fit: contain !important;
}

.hero__card {
  top: 58.638743% !important;
  left: 70.644217% !important;
  z-index: 5 !important;
  display: block !important;
  width: 16.129722% !important;
  height: 28.411518% !important;
  object-fit: contain !important;
}

.hero__phone {
  top: 43.979058% !important;
  left: 87.994144% !important;
  z-index: 4 !important;
  display: block !important;
  width: 9.297218% !important;
  height: 46.247818% !important;
  object-fit: contain !important;
}

@media (min-width: 768px) and (max-width: 1365px) {
  .figma-site-header {
    height: 7.027818vw !important;
    min-height: 0 !important;
  }

  .figma-site-header__inner {
    height: 7.027818vw !important;
  }

  .figma-site-header .header-logo {
    top: 1.976574vw !important;
    left: 4.099561vw !important;
    width: 10.248902vw !important;
    height: 2.781845vw !important;
  }

  .figma-site-header__inner > nav {
    left: 41.361640vw !important;
    width: 29.868228vw !important;
    height: 6.881406vw !important;
    gap: .512445vw !important;
  }

  .figma-site-header__inner > nav a {
    width: 8.638360vw !important;
    height: 6.881406vw !important;
    font-size: max(10px, 1.024890vw) !important;
  }

  .figma-site-header .header-actions {
    grid-template-columns: 13.909224vw 14.275256vw !important;
    width: 28.184480vw !important;
    height: 7.027818vw !important;
  }

  .figma-site-header .header-actions a {
    height: 7.027818vw !important;
    font-size: max(10px, 1.098097vw) !important;
  }
}

@media (max-width: 767px) {
  .figma-site-header {
    height: 64px !important;
    min-height: 64px !important;
    box-shadow: inset 0 -1px 0 var(--carelo-header-rule) !important;
  }

  .figma-site-header__inner {
    width: 100% !important;
    max-width: none !important;
    height: 64px !important;
  }

  .figma-site-header .header-logo {
    top: 19px !important;
    left: 16px !important;
    width: 116px !important;
    height: 27px !important;
    min-height: 0 !important;
    overflow: hidden !important;
  }

  .figma-site-header .header-logo img {
    position: absolute !important;
    top: -45.6% !important;
    left: -32.5% !important;
    width: 163% !important;
    max-width: none !important;
    height: 191% !important;
    object-fit: fill !important;
  }

  .figma-site-header__inner > nav,
  .figma-site-header .header-actions {
    display: none !important;
  }

  .figma-site-header .mobile-navigation {
    position: absolute !important;
    top: 0 !important;
    right: 12px !important;
    z-index: 110 !important;
    display: block !important;
    width: 40px !important;
    height: 64px !important;
    margin: 0 !important;
  }

  .figma-site-header .mobile-navigation > summary {
    display: grid !important;
    place-items: center !important;
    width: 40px !important;
    height: 64px !important;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
    cursor: pointer !important;
  }

  .figma-site-header .mobile-navigation > summary::-webkit-details-marker {
    display: none !important;
  }

  .figma-site-header .mobile-navigation__icon {
    position: relative !important;
    display: block !important;
    width: 26px !important;
    height: 18px !important;
  }

  .figma-site-header .mobile-navigation__icon i {
    position: absolute !important;
    left: 0 !important;
    display: block !important;
    width: 26px !important;
    height: 2px !important;
    margin: 0 !important;
    border: 0 !important;
    background: var(--carelo-deep-green) !important;
  }

  .figma-site-header .mobile-navigation__icon i:nth-child(1) { top: 0 !important; }
  .figma-site-header .mobile-navigation__icon i:nth-child(2) { top: 8px !important; }
  .figma-site-header .mobile-navigation__icon i:nth-child(3) { top: 16px !important; }

  .figma-site-header .mobile-navigation__panel {
    position: fixed !important;
    top: 64px !important;
    right: 0 !important;
    left: 0 !important;
    z-index: 105 !important;
    display: grid !important;
    width: 100% !important;
    height: auto !important;
    padding: 12px 20px 18px !important;
    border-bottom: 1px solid var(--carelo-header-rule) !important;
    background: rgba(255, 255, 255, .98) !important;
    box-shadow: 0 10px 24px rgba(1, 67, 58, .12) !important;
  }

  .figma-site-header .mobile-navigation__panel a {
    display: flex !important;
    align-items: center !important;
    min-height: 44px !important;
    color: var(--carelo-deep-green) !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    text-decoration: none !important;
  }

  .figma-site-header .mobile-navigation__panel .mobile-navigation__contact {
    justify-content: center !important;
    margin-top: 8px !important;
    border-radius: 6px !important;
    color: #fff !important;
    background: var(--carelo-orange) !important;
  }

  .hero {
    width: 100% !important;
    height: min(184.615385vw, 720px) !important;
    max-height: 720px !important;
    overflow: hidden !important;
    background: #fff !important;
  }

  .hero__stage {
    width: min(100%, 390px) !important;
    height: 100% !important;
    margin: 0 auto !important;
  }

  .hero__person-top {
    top: 1.388889% !important;
    left: -4.871795% !important;
    width: 29.230769% !important;
    height: 15.833333% !important;
    border-radius: 6px !important;
  }

  .hero__person-bottom {
    top: -1.527778% !important;
    left: 62.564103% !important;
    width: 42.820513% !important;
    height: 15.277778% !important;
    border-radius: 6px !important;
  }

  .hero__person-top img {
    object-position: 55% 50% !important;
  }

  .hero__person-bottom img {
    object-position: 50% 50% !important;
  }

  .hero__benefits {
    top: 8.055556% !important;
    left: 14.615385% !important;
    gap: min(1.794872vw, 7px) !important;
    width: 73.333333% !important;
  }

  .hero__benefit {
    height: min(10.512821vw, 41px) !important;
    padding: 0 min(2.307692vw, 9px) !important;
    border-radius: min(1.410256vw, 5.5px) !important;
    font-size: min(3.505128vw, 13.67px) !important;
    line-height: 1.3 !important;
  }

  .hero__benefit img {
    width: min(5.897436vw, 23px) !important;
    height: min(7.948718vw, 31px) !important;
    margin-right: min(2.051282vw, 8px) !important;
  }

  .hero__headline,
  .hero h1 {
    top: 20.416667% !important;
    right: auto !important;
    bottom: auto !important;
    left: 4.871795% !important;
    width: 90.398205% !important;
    height: 14.166667% !important;
    font-size: min(8.098205vw, 31.583px) !important;
    line-height: 1.45 !important;
    transform: none !important;
  }

  .hero__headline span {
    padding-bottom: 1px !important;
    border-bottom-width: min(1.025641vw, 4px) !important;
  }

  .hero__brand {
    top: 37.361111% !important;
    left: 13.589744% !important;
    width: 72.564103% !important;
    height: 9.155833% !important;
  }

  .hero__authority {
    top: 48.423750% !important;
    left: 17.303077% !important;
    width: 64.751282% !important;
    height: 6.503056% !important;
  }

  .hero__dashboard {
    top: 62.638889% !important;
    left: 3.589744% !important;
    width: 67.692308% !important;
    height: 22.970139% !important;
  }

  .hero__phone {
    top: 59.166667% !important;
    left: 67.974872% !important;
    width: 28.380974% !important;
    height: 32.241806% !important;
  }

  .hero__card {
    top: 78.333333% !important;
    left: 42.564103% !important;
    width: 36.153846% !important;
    height: 14.469722% !important;
  }
}

@media (max-width: 389px) {
  .figma-site-header,
  .figma-site-header__inner {
    height: 16.410256vw !important;
    min-height: 0 !important;
  }

  .figma-site-header .header-logo {
    top: 4.871795vw !important;
    left: 4.102564vw !important;
    width: 29.743590vw !important;
    height: 6.923077vw !important;
  }

  .figma-site-header .mobile-navigation {
    right: 3.076923vw !important;
    width: 10.256410vw !important;
    height: 16.410256vw !important;
  }

  .figma-site-header .mobile-navigation > summary {
    width: 10.256410vw !important;
    height: 16.410256vw !important;
  }

  .figma-site-header .mobile-navigation__icon,
  .figma-site-header .mobile-navigation__icon i {
    width: 6.666667vw !important;
  }

  .figma-site-header .mobile-navigation__panel {
    top: 16.410256vw !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .figma-site-header *,
  .hero * {
    scroll-behavior: auto !important;
    transition-duration: .01ms !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
  }
}

/* Specificity shield for legacy FV rules in final-fixes.css. */
#top.hero {
  height: min(41.947291vw, 573px) !important;
  max-height: 573px !important;
  background: #eef8f5 url("../assets/hero-fv-background.png") center / cover no-repeat !important;
}

#top.hero .hero__stage {
  width: min(100%, 1366px) !important;
  max-width: none !important;
  height: 100% !important;
  overflow: visible !important;
  background: transparent !important;
}

#top.hero::before,
#top.hero::after,
#top.hero .hero__stage::before,
#top.hero .hero__stage::after {
  display: none !important;
  content: none !important;
}

#top.hero .hero__employee-zone,
#top.hero .hero__message-zone,
#top.hero .hero__product-zone,
#top.hero .hero__mobile-wash,
#top.hero .hero__actions {
  display: none !important;
}

#top.hero .hero__person-top {
  top: 9.075044% !important;
  left: 5.051245% !important;
  display: block !important;
  width: 15.885798% !important;
  height: 38.045375% !important;
  border-radius: 8px !important;
  box-shadow: none !important;
}

#top.hero .hero__person-bottom {
  top: 53.228621% !important;
  left: -1.464129% !important;
  display: block !important;
  width: 28.989751% !important;
  height: 42.408377% !important;
  border-radius: 14px !important;
  box-shadow: none !important;
}

#top.hero .hero__person-top img,
#top.hero .hero__person-bottom img {
  position: static !important;
  width: 100% !important;
  max-width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  transform: none !important;
}

#top.hero .hero__person-top img { object-position: 58% 50% !important; }
#top.hero .hero__person-bottom img { object-position: 50% 50% !important; }

#top.hero .hero__benefits {
  inset: auto !important;
  top: 5.061082% !important;
  left: 34.040996% !important;
  display: grid !important;
  gap: 10px !important;
  width: 31.918009% !important;
  height: auto !important;
}

#top.hero .hero__benefit,
#top.hero .hero__benefit:first-child,
#top.hero .hero__benefit:nth-child(2) {
  position: relative !important;
  inset: auto !important;
  display: flex !important;
  width: 100% !important;
  height: min(4.392387vw, 60px) !important;
  padding: 0 min(1.317716vw, 18px) !important;
  border-radius: 8px !important;
  color: #2b3432 !important;
  font-family: "Noto Sans JP", sans-serif !important;
  font-size: min(1.464129vw, 20px) !important;
  line-height: 1.4 !important;
}

#top.hero .hero__benefit img {
  position: static !important;
  flex: 0 0 auto !important;
  width: min(2.781845vw, 38px) !important;
  max-width: min(2.781845vw, 38px) !important;
  height: min(3.733529vw, 51px) !important;
  margin: 0 min(1.024890vw, 14px) 0 0 !important;
  object-fit: contain !important;
}

#top.hero .hero__headline {
  inset: auto !important;
  top: 30.017452% !important;
  left: 29.648609% !important;
  display: flex !important;
  width: 40.716691% !important;
  max-width: none !important;
  height: 27.923211% !important;
  font-size: min(3.647511vw, 49.825px) !important;
  font-weight: 900 !important;
  line-height: 1.46 !important;
  text-align: center !important;
}

#top.hero .hero__headline span,
#top.hero .hero__headline span:first-child,
#top.hero .hero__headline span:nth-child(2) {
  display: block !important;
  width: fit-content !important;
  margin: 0 !important;
  padding: 0 0 2px !important;
  border-bottom: min(.292826vw, 4px) solid var(--carelo-deep-green) !important;
  text-align: center !important;
}

#top.hero .hero__brand {
  inset: auto !important;
  top: 63.525305% !important;
  left: 40.922401% !important;
  width: 18.155198% !important;
  max-width: none !important;
  height: 10.081850% !important;
  overflow: hidden !important;
}

#top.hero .hero__brand > img {
  position: absolute !important;
  inset: 0 !important;
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
}

#top.hero .hero__authority {
  inset: auto !important;
  top: 78.534031% !important;
  left: 37.994144% !important;
  width: 24.084919% !important;
  height: 10.645724% !important;
}

#top.hero .hero__authority > img {
  position: static !important;
  width: 100% !important;
  max-width: 100% !important;
  height: 100% !important;
  object-fit: fill !important;
}

#top.hero .hero__dashboard {
  inset: auto !important;
  top: 13.438045% !important;
  left: 68.960469% !important;
  width: 28.464275% !important;
  max-width: none !important;
  height: 42.509773% !important;
}

#top.hero img.hero__card {
  inset: auto !important;
  top: 58.638743% !important;
  left: 70.644217% !important;
  width: 16.129722% !important;
  max-width: none !important;
  height: 28.411518% !important;
  object-fit: contain !important;
  box-shadow: none !important;
  transform: none !important;
}

#top.hero .hero__phone {
  inset: auto !important;
  top: 43.979058% !important;
  left: 87.994144% !important;
  width: 9.297218% !important;
  max-width: none !important;
  height: 46.247818% !important;
  transform: none !important;
}

@media (max-width: 767px) {
  header.figma-site-header > .figma-site-header__inner {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
  }

  #top.hero {
    width: 100% !important;
    height: min(184.615385vw, 840px) !important;
    max-height: 840px !important;
    aspect-ratio: auto !important;
    background: #fff !important;
  }

  #top.hero .hero__stage {
    width: min(100%, 455px) !important;
    height: 100% !important;
    aspect-ratio: auto !important;
    background: #fff !important;
  }

  #top.hero .hero__person-top {
    top: 1.388889% !important;
    left: 3% !important;
    width: 29.230769% !important;
    height: 15.833333% !important;
    border-radius: 6px !important;
  }

  #top.hero .hero__person-bottom {
    top: -1.527778% !important;
    right: 3% !important;
    left: auto !important;
    width: 42.820513% !important;
    height: 15.277778% !important;
    border-radius: 6px !important;
  }

  #top.hero .hero__person-top img { object-position: 55% 50% !important; }
  #top.hero .hero__person-bottom img { object-position: 50% 50% !important; }

  #top.hero .hero__benefits {
    top: 8.055556% !important;
    left: 14.615385% !important;
    gap: min(1.794872vw, 7px) !important;
    width: 73.333333% !important;
  }

  #top.hero .hero__benefit,
  #top.hero .hero__benefit:first-child,
  #top.hero .hero__benefit:nth-child(2) {
    height: min(10.512821vw, 41px) !important;
    padding: 0 min(2.307692vw, 9px) !important;
    border-radius: min(1.410256vw, 5.5px) !important;
    font-size: min(3.505128vw, 13.67px) !important;
    line-height: 1.3 !important;
  }

  #top.hero .hero__benefit img {
    width: min(5.897436vw, 23px) !important;
    max-width: min(5.897436vw, 23px) !important;
    height: min(7.948718vw, 31px) !important;
    margin-right: min(2.051282vw, 8px) !important;
  }

  #top.hero .hero__headline {
    top: 20.416667% !important;
    left: 4.871795% !important;
    width: 90.398205% !important;
    height: 14.166667% !important;
    font-size: min(8.098205vw, 31.583px) !important;
    line-height: 1.45 !important;
  }

  #top.hero .hero__headline span,
  #top.hero .hero__headline span:first-child,
  #top.hero .hero__headline span:nth-child(2) {
    margin: 0 !important;
    padding: 0 0 1px !important;
    border-bottom-width: min(1.025641vw, 4px) !important;
  }

  #top.hero .hero__brand {
    top: 37.361111% !important;
    left: 13.589744% !important;
    width: 72.564103% !important;
    height: 9.155833% !important;
  }

  #top.hero .hero__authority {
    top: 48.423750% !important;
    left: 17.303077% !important;
    width: 64.751282% !important;
    height: 6.503056% !important;
  }

  #top.hero .hero__dashboard {
    top: 62.638889% !important;
    left: 3.589744% !important;
    display: block !important;
    width: 67.692308% !important;
    height: 22.970139% !important;
  }

  #top.hero .hero__phone {
    top: 59.166667% !important;
    left: 67.974872% !important;
    width: 28.380974% !important;
    height: 32.241806% !important;
  }

  #top.hero img.hero__card {
    top: 78.333333% !important;
    left: 42.564103% !important;
    width: 36.153846% !important;
    height: 14.469722% !important;
  }
}

/* 2026-10-02: rebuild the CARELO lockup from higher-resolution official artwork. */
.carelo-logo-lockup {
  position: relative !important;
  display: block !important;
  width: 100% !important;
  height: auto !important;
  aspect-ratio: 384 / 81 !important;
  overflow: hidden !important;
  background: transparent !important;
}

.header-logo .carelo-logo-lockup {
  width: 128px !important;
  flex: 0 0 128px !important;
}

.header-logo .carelo-logo-lockup__mark,
#top.hero .hero__brand .carelo-logo-lockup__mark {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 21.09375% !important;
  height: 100% !important;
  max-width: none !important;
  aspect-ratio: auto !important;
  object-fit: contain !important;
}

.header-logo .carelo-logo-lockup__wordmark,
#top.hero .hero__brand .carelo-logo-lockup__wordmark {
  position: absolute !important;
  top: 27.160494% !important;
  left: 28.125% !important;
  width: 71.875% !important;
  height: 50.617284% !important;
  max-width: none !important;
  aspect-ratio: auto !important;
  object-fit: contain !important;
}

#top.hero .hero__brand {
  height: auto !important;
  aspect-ratio: 384 / 81 !important;
  overflow: visible !important;
}

@media (max-width: 767px) {
  .header-logo .carelo-logo-lockup {
    width: 104px !important;
    flex-basis: 104px !important;
  }
}