.footer-sheet {
  --fs-bg: var(--fs-light-bg, #fff);
  --fs-wrapper-bg: var(--fs-light-wrapper_bg, #fff);
  --fs-h1: var(--fs-light-h1, #8d5094);
  --fs-h2: var(--fs-light-h2, #8d5094);
  --fs-h3: var(--fs-light-h3, #3264cc);
  --fs-h4: var(--fs-light-h4, #3264cc);
  --fs-text: var(--fs-light-text, #252525);
  --fs-strong: var(--fs-light-strong, #111);
  --fs-link: var(--fs-light-link, #3264cc);
  --fs-hover: var(--fs-light-hover, #8d5094);
  --fs-ul: var(--fs-light-ul, #252525);
  position: relative;
  z-index: 50;
  width: 100vw;
  max-width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  box-sizing: border-box;
  overflow: visible;
  isolation: isolate;
  margin-top: var(--fs-margin-top, 0);
  margin-bottom: var(--fs-margin-bottom, 0);
  padding-top: var(--fs-padding-top, 80px);
  padding-bottom: var(--fs-padding-bottom, 80px);
  background: transparent;
  color: var(--fs-text);
  font-family: "agenda", sans-serif;
  font-weight: 400;
}
.footer-sheet--mode-dark,
html[data-theme="dark"] .footer-sheet--mode-auto,
body[data-theme="dark"] .footer-sheet--mode-auto,
html.dark .footer-sheet--mode-auto,
body.dark .footer-sheet--mode-auto,
body.dark-mode .footer-sheet--mode-auto,
body.is-dark .footer-sheet--mode-auto,
.theme-dark .footer-sheet--mode-auto,
.perlanova-dark .footer-sheet--mode-auto {
  --fs-bg: var(--fs-dark-bg, #050505);
  --fs-wrapper-bg: var(--fs-dark-wrapper_bg, #050505);
  --fs-h1: var(--fs-dark-h1, #fff);
  --fs-h2: var(--fs-dark-h2, #fff);
  --fs-h3: var(--fs-dark-h3, #d8a1db);
  --fs-h4: var(--fs-dark-h4, #9eb8ff);
  --fs-text: var(--fs-dark-text, #f5f5f5);
  --fs-strong: var(--fs-dark-strong, #fff);
  --fs-link: var(--fs-dark-link, #9eb8ff);
  --fs-hover: var(--fs-dark-hover, #d8a1db);
  --fs-ul: var(--fs-dark-ul, #f5f5f5);
}
@media (prefers-color-scheme: dark) {
  .footer-sheet--mode-auto {
    --fs-bg: var(--fs-dark-bg, #050505);
    --fs-wrapper-bg: var(--fs-dark-wrapper_bg, #050505);
    --fs-h1: var(--fs-dark-h1, #fff);
    --fs-h2: var(--fs-dark-h2, #fff);
    --fs-h3: var(--fs-dark-h3, #d8a1db);
    --fs-h4: var(--fs-dark-h4, #9eb8ff);
    --fs-text: var(--fs-dark-text, #f5f5f5);
    --fs-strong: var(--fs-dark-strong, #fff);
    --fs-link: var(--fs-dark-link, #9eb8ff);
    --fs-hover: var(--fs-dark-hover, #d8a1db);
    --fs-ul: var(--fs-dark-ul, #f5f5f5);
  }
}
.footer-sheet--mode-green,
html[data-theme="green"] .footer-sheet--mode-auto,
body[data-theme="green"] .footer-sheet--mode-auto,
html.green .footer-sheet--mode-auto,
body.green .footer-sheet--mode-auto,
body.green-mode .footer-sheet--mode-auto,
body.is-green .footer-sheet--mode-auto,
.theme-green .footer-sheet--mode-auto,
.perlanova-green .footer-sheet--mode-auto {
  --fs-bg: var(--fs-green-bg, #4c6e28);
  --fs-wrapper-bg: var(--fs-green-wrapper_bg, #4c6e28);
  --fs-h1: var(--fs-green-h1, #fff);
  --fs-h2: var(--fs-green-h2, #fff);
  --fs-h3: var(--fs-green-h3, #d7efc9);
  --fs-h4: var(--fs-green-h4, #d7efc9);
  --fs-text: var(--fs-green-text, #fff);
  --fs-strong: var(--fs-green-strong, #fff);
  --fs-link: var(--fs-green-link, #fff);
  --fs-hover: var(--fs-green-hover, #d7efc9);
  --fs-ul: var(--fs-green-ul, #fff);
}
.footer-sheet::before {
  content: "";
  position: absolute;
  top: var(--fs-bg-top, 0);
  right: 0;
  bottom: var(--fs-bg-bottom, 0);
  left: 0;
  background: var(--fs-bg);
  pointer-events: none;
  z-index: 0;
  clip-path: var(--fs-bg-clip, inset(0));
}
.footer-sheet::after {
  display: none;
}
.footer-sheet__inner {
  position: relative;
  z-index: 2;
  width: min(calc(100% - 40px), var(--fs-wrapper, 1200px));
  margin: 0 auto;
  box-sizing: border-box;
  padding-left: clamp(20px, 3vw, 42px);
  padding-right: clamp(20px, 3vw, 42px);
  background: transparent;
  color: var(--fs-text);
  min-height: 240px;
}
.footer-sheet__inner::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  background: var(--fs-wrapper-bg);
  opacity: var(--fs-wrapper-opacity, 1);
  pointer-events: none;
}
.footer-sheet__logo {
  position: relative;
  left: var(--fs-logo-x, 0);
  top: var(--fs-logo-y, 0);
  width: var(--fs-logo-width, 330px);
  margin: 0 auto clamp(28px, 4vw, 54px);
  transform: rotate(var(--fs-logo-rotation, 0deg));
  transform-origin: center;
  z-index: 2;
}
.footer-sheet__logo img {
  display: block;
  width: 100%;
  height: auto;
}
.footer-sheet__content {
  position: relative;
  z-index: 3;
}
.footer-sheet__columns {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(24px, 4vw, 70px);
}
.footer-sheet__column,
.footer-sheet__bottom {
  font-size: clamp(15px, 1vw, 18px);
  line-height: 1.6;
}
.footer-sheet__bottom {
  margin-top: clamp(28px, 5vw, 60px);
}
.footer-sheet__image {
  position: absolute;
  right: 0;
  bottom: 0;
  width: min(40vw, 420px);
  z-index: 1;
  pointer-events: none;
}
.footer-sheet__image img {
  display: block;
  width: 100%;
  height: auto;
}
.footer-sheet h1,
.footer-sheet h2,
.footer-sheet h3,
.footer-sheet h4 {
  font-family: "agenda", sans-serif;
  font-weight: 400;
  line-height: 1.15;
  letter-spacing: 0;
}
.footer-sheet h1 { color: var(--fs-h1); font-size: clamp(34px, 4vw, 64px); }
.footer-sheet h2 { color: var(--fs-h2); font-size: clamp(28px, 3vw, 50px); }
.footer-sheet h3 { color: var(--fs-h3); font-size: clamp(22px, 2vw, 34px); }
.footer-sheet h4 { color: var(--fs-h4); font-size: clamp(19px, 1.5vw, 26px); }
.footer-sheet strong,
.footer-sheet b {
  color: var(--fs-strong);
  font-weight: 700;
}
.footer-sheet a {
  color: var(--fs-link);
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
}
.footer-sheet a:hover {
  color: var(--fs-hover);
}
.footer-sheet ul,
.footer-sheet ol {
  color: var(--fs-ul);
}
.footer-sheet__column > :first-child,
.footer-sheet__bottom > :first-child { margin-top: 0; }
.footer-sheet__column > :last-child,
.footer-sheet__bottom > :last-child { margin-bottom: 0; }
@media (max-width: 900px) {
  .footer-sheet__columns {
    grid-template-columns: 1fr;
  }
  .footer-sheet__logo {
    transform: rotate(var(--fs-logo-rotation, 0deg));
    width: min(80vw, var(--fs-logo-width, 330px));
  }
  .footer-sheet__image {
    position: absolute;
    right: 0;
    bottom: 0;
    width: min(70vw, 320px);
    margin: 0;
    z-index: 1;
  }
}
@media (max-width: 760px) {
  .footer-sheet {
    padding-top: max(42px, calc(var(--fs-padding-top, 80px) * .65));
    padding-bottom: max(42px, calc(var(--fs-padding-bottom, 80px) * .65));
  }
  .footer-sheet__inner {
    width: min(calc(100% - 28px), var(--fs-wrapper, 1200px));
  }
}
