@font-face {
  font-family: "Gastro Kultura";
  src: url(//www.tuggs.uk/assets/GastroKultura-93c876f316bcea45beda89a1729e695ec0f2b146c29d8b00f1734c95b82f8ca3.woff2) format("woff2"), url(//www.tuggs.uk/assets/GastroKultura-b65a417a2c1fac28ecc6086ef9454665a5fbb1ea5be87f39db37270ad83bacbf.woff) format("woff"), url(//www.tuggs.uk/assets/GastroKultura-04f7e404ca8644c3c768de0e6bc4b4780d1ffde2195bac555e3ccbf832363f8d.ttf) format("truetype");
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Fredoka";
  src: url(//www.tuggs.uk/assets/Fredoka-Regular-07ca9fde49b8d6ceed0d32875a72af1e77737cd9089eaa20be416b33f829f446.ttf) format("truetype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Fredoka";
  src: url(//www.tuggs.uk/assets/Fredoka-Medium-28c8b99a54653e858ad03b2c80453a0708c2018c631c9153f61265c54b81b66b.ttf) format("truetype");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Fredoka";
  src: url(//www.tuggs.uk/assets/Fredoka-SemiBold-1a524735bf232264dc6a4f821ed7e3433bf53a6b3cffce1a4ef669ac6269fa37.ttf) format("truetype");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Permanent Marker";
  src: url(//www.tuggs.uk/PermanentMarker-Regular.woff2) format("woff2"), url(//www.tuggs.uk/PermanentMarker-Regular.woff) format("woff"), url(//www.tuggs.uk/assets/PermanentMarker-Regular-c7dbbae60a31d1227160d43e583a4e076f608e93c4f45bd1c4655cad35f8818d.ttf) format("truetype");
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Providence Sans";
  src: url(//www.tuggs.uk/assets/ProvidenceSansRegular-51eb2b79f332c2136901bcd7c8b76104147b3934367e1c136ee84e12cf9d6c9d.ttf) format("truetype");
  font-weight: normal;
}
@font-face {
  font-family: "Providence Sans";
  src: url(//www.tuggs.uk/assets/ProvidenceSansBold-ff1cbc2c8c1d2934d07640f4a6562ae1f983a841d56b3de407fbc9e5418bf1e2.ttf) format("truetype");
  font-weight: bold;
}
@font-face {
  font-family: "Ostia Antica";
  src: url(//www.tuggs.uk/assets/OstiaAntica-Regular-7d9fadb18c25812034584dd5468ab3ac796dcef5ee12ed38c513348319b18df3.woff2) format("woff2"), url(//www.tuggs.uk/assets/OstiaAntica-Regular-77053d51d7074fd56eb4a162e6537c6b5a2cfa108971e4906b296aaaa4d6185b.woff) format("woff"), url(//www.tuggs.uk/assets/OstiaAntica-Regular-24d9f6000b9bdfa18393c653d0b56c8a5a602e216766402320fb79651d816930.ttf) format("truetype");
  font-weight: 900;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Ostia Antica";
  src: url(//www.tuggs.uk/assets/OstiaAntica-Light-25713026f471e505eed4842f33e1154fab31a8786f0f24c33caa7aaff0009baf.woff2) format("woff2"), url(//www.tuggs.uk/assets/OstiaAntica-Light-1143926f52d8287f39e744211dd6ef626b2578bb10716f4992c3f35230025ece.woff) format("woff"), url(//www.tuggs.uk/assets/OstiaAntica-Light-930b809878ad17a35cf6aad6264338114899831e84ff06aa9693c975f3e2b3d5.ttf) format("truetype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
.sr-only {
  position: absolute;
  left: -1000px;
  top: auto;
  width: 1px;
  height: 1px;
  overflow: hidden;
}

@media (prefers-reduced-motion: no-preference) {
  .fade-in {
    animation: fadeIn linear;
    animation-timeline: view();
    animation-range: entry;
  }
  @keyframes fadeIn {
    from {
      transform: translateY(0.5rem);
      scale: 0.9;
      opacity: 0.7;
    }
    to {
      transform: translateY(0);
      scale: 1;
      opacity: 1;
    }
  }
  .fade-in-no-scale {
    animation: fadeInNoScale linear;
    animation-timeline: view();
    animation-range: entry;
  }
  @keyframes fadeInNoScale {
    from {
      transform: translateY(0.5rem);
      opacity: 0.7;
    }
    to {
      transform: translateY(0);
      opacity: 1;
    }
  }
  .scroll-in {
    animation: scrollIn linear both;
    animation-timeline: view();
  }
  @keyframes scrollIn {
    from {
      transform: translateY(calc(100% + 3rem));
    }
    to {
      transform: translateY(0);
    }
  }
}
.fade-up {
  opacity: 0;
  transform: translateY(0.5rem);
  transition: opacity 0.3s ease, transform 0.3s ease;
  pointer-events: none;
  visibility: hidden;
}

.fade-up.visible {
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
  visibility: visible;
}

/* Box sizing rules */
*,
*::before,
*::after {
  box-sizing: border-box;
}

/* Remove default margin */
body,
h1,
h2,
h3,
h4,
h5,
h6,
p,
figure,
blockquote,
dl,
dd,
ul {
  margin: 0;
}

/* Remove list styles on ul, ol elements with a list role, which suggests default styling will be removed */
ul[role=list],
ol[role=list] {
  list-style: none;
}

ul, ol {
  padding: 0;
}

details summary {
  cursor: pointer;
}

details summary > * {
  display: inline;
}

/* Set core root defaults */
html:focus-within {
  scroll-behavior: smooth;
}

/* Set core body defaults */
body {
  min-height: 100vh;
  text-rendering: optimizespeed;
  line-height: 1.5;
  padding-top: env(safe-area-inset-top);
  padding-bottom: env(safe-area-inset-bottom);
}

/* A elements that don't have a class get default styles */
a:not([class]) {
  -webkit-text-decoration-skip: ink;
          text-decoration-skip-ink: auto;
}

a {
  text-decoration: none;
}

/* Make images easier to work with */
img,
picture {
  max-width: 100%;
  display: block;
  margin: auto;
}

/* Inherit fonts for inputs and buttons */
input,
button,
textarea,
select {
  font: inherit;
}

/* Remove all animations, transitions and smooth scroll for people that prefer not to see them */
@media (prefers-reduced-motion: reduce) {
  html:focus-within {
    scroll-behavior: auto;
  }
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}
:root {
  --navy: hsl(219deg 100% 14%);
}

.text-navy {
  color: var(--navy) !important;
}

.bg-navy {
  background-color: var(--navy) !important;
}

.bc-navy {
  border-color: var(--navy) !important;
}

:root {
  --primary: hsl(219deg 100% 14%);
}

.text-primary {
  color: var(--primary) !important;
}

.bg-primary {
  background-color: var(--primary) !important;
}

.bc-primary {
  border-color: var(--primary) !important;
}

:root {
  --navy-900: hsl(219deg 53% 13%);
  --primary-900: hsl(219deg 53% 13%);
}

.navy-900 {
  color: var(--navy-900) !important;
}

.bg-navy-900 {
  background-color: var(--navy-900) !important;
}

.bc-navy-900 {
  border-color: var(--navy-900) !important;
}

.primary-900 {
  color: var(--primary-900) !important;
}

.bg-primary-900 {
  background-color: var(--primary-900) !important;
}

.bc-primary-900 {
  border-color: var(--primary-900) !important;
}

:root {
  --navy-800: hsl(219deg 100% 14%);
  --primary-800: hsl(219deg 100% 14%);
}

.navy-800 {
  color: var(--navy-800) !important;
}

.bg-navy-800 {
  background-color: var(--navy-800) !important;
}

.bc-navy-800 {
  border-color: var(--navy-800) !important;
}

.primary-800 {
  color: var(--primary-800) !important;
}

.bg-primary-800 {
  background-color: var(--primary-800) !important;
}

.bc-primary-800 {
  border-color: var(--primary-800) !important;
}

:root {
  --navy-700: hsl(219deg 32% 25%);
  --primary-700: hsl(219deg 32% 25%);
}

.navy-700 {
  color: var(--navy-700) !important;
}

.bg-navy-700 {
  background-color: var(--navy-700) !important;
}

.bc-navy-700 {
  border-color: var(--navy-700) !important;
}

.primary-700 {
  color: var(--primary-700) !important;
}

.bg-primary-700 {
  background-color: var(--primary-700) !important;
}

.bc-primary-700 {
  border-color: var(--primary-700) !important;
}

:root {
  --navy-600: hsl(219deg 22% 34%);
  --primary-600: hsl(219deg 22% 34%);
}

.navy-600 {
  color: var(--navy-600) !important;
}

.bg-navy-600 {
  background-color: var(--navy-600) !important;
}

.bc-navy-600 {
  border-color: var(--navy-600) !important;
}

.primary-600 {
  color: var(--primary-600) !important;
}

.bg-primary-600 {
  background-color: var(--primary-600) !important;
}

.bc-primary-600 {
  border-color: var(--primary-600) !important;
}

:root {
  --navy-500: hsl(219deg 15% 42%);
  --primary-500: hsl(219deg 15% 42%);
}

.navy-500 {
  color: var(--navy-500) !important;
}

.bg-navy-500 {
  background-color: var(--navy-500) !important;
}

.bc-navy-500 {
  border-color: var(--navy-500) !important;
}

.primary-500 {
  color: var(--primary-500) !important;
}

.bg-primary-500 {
  background-color: var(--primary-500) !important;
}

.bc-primary-500 {
  border-color: var(--primary-500) !important;
}

:root {
  --navy-400: hsl(219deg 11% 58%);
  --primary-400: hsl(219deg 11% 58%);
}

.navy-400 {
  color: var(--navy-400) !important;
}

.bg-navy-400 {
  background-color: var(--navy-400) !important;
}

.bc-navy-400 {
  border-color: var(--navy-400) !important;
}

.primary-400 {
  color: var(--primary-400) !important;
}

.bg-primary-400 {
  background-color: var(--primary-400) !important;
}

.bc-primary-400 {
  border-color: var(--primary-400) !important;
}

:root {
  --navy-300: hsl(219deg 10% 75%);
  --primary-300: hsl(219deg 10% 75%);
}

.navy-300 {
  color: var(--navy-300) !important;
}

.bg-navy-300 {
  background-color: var(--navy-300) !important;
}

.bc-navy-300 {
  border-color: var(--navy-300) !important;
}

.primary-300 {
  color: var(--primary-300) !important;
}

.bg-primary-300 {
  background-color: var(--primary-300) !important;
}

.bc-primary-300 {
  border-color: var(--primary-300) !important;
}

:root {
  --navy-200: hsl(219deg 11% 83%);
  --primary-200: hsl(219deg 11% 83%);
}

.navy-200 {
  color: var(--navy-200) !important;
}

.bg-navy-200 {
  background-color: var(--navy-200) !important;
}

.bc-navy-200 {
  border-color: var(--navy-200) !important;
}

.primary-200 {
  color: var(--primary-200) !important;
}

.bg-primary-200 {
  background-color: var(--primary-200) !important;
}

.bc-primary-200 {
  border-color: var(--primary-200) !important;
}

:root {
  --navy-100: hsl(219deg 5% 89%);
  --primary-100: hsl(219deg 5% 89%);
}

.navy-100 {
  color: var(--navy-100) !important;
}

.bg-navy-100 {
  background-color: var(--navy-100) !important;
}

.bc-navy-100 {
  border-color: var(--navy-100) !important;
}

.primary-100 {
  color: var(--primary-100) !important;
}

.bg-primary-100 {
  background-color: var(--primary-100) !important;
}

.bc-primary-100 {
  border-color: var(--primary-100) !important;
}

:root {
  --navy-50: hsl(219deg 5% 95%);
  --primary-50: hsl(219deg 5% 95%);
}

.navy-50 {
  color: var(--navy-50) !important;
}

.bg-navy-50 {
  background-color: var(--navy-50) !important;
}

.bc-navy-50 {
  border-color: var(--navy-50) !important;
}

.primary-50 {
  color: var(--primary-50) !important;
}

.bg-primary-50 {
  background-color: var(--primary-50) !important;
}

.bc-primary-50 {
  border-color: var(--primary-50) !important;
}

:root {
  --tan: hsl(0deg 18% 86%);
}

.text-tan {
  color: var(--tan) !important;
}

.bg-tan {
  background-color: var(--tan) !important;
}

.bc-tan {
  border-color: var(--tan) !important;
}

:root {
  --secondary: hsl(0deg 18% 86%);
}

.text-secondary {
  color: var(--secondary) !important;
}

.bg-secondary {
  background-color: var(--secondary) !important;
}

.bc-secondary {
  border-color: var(--secondary) !important;
}

:root {
  --tan-900: hsl(0deg 9% 38%);
  --secondary-900: hsl(0deg 9% 38%);
}

.tan-900 {
  color: var(--tan-900) !important;
}

.bg-tan-900 {
  background-color: var(--tan-900) !important;
}

.bc-tan-900 {
  border-color: var(--tan-900) !important;
}

.secondary-900 {
  color: var(--secondary-900) !important;
}

.bg-secondary-900 {
  background-color: var(--secondary-900) !important;
}

.bc-secondary-900 {
  border-color: var(--secondary-900) !important;
}

:root {
  --tan-800: hsl(0deg 9% 48%);
  --secondary-800: hsl(0deg 9% 48%);
}

.tan-800 {
  color: var(--tan-800) !important;
}

.bg-tan-800 {
  background-color: var(--tan-800) !important;
}

.bc-tan-800 {
  border-color: var(--tan-800) !important;
}

.secondary-800 {
  color: var(--secondary-800) !important;
}

.bg-secondary-800 {
  background-color: var(--secondary-800) !important;
}

.bc-secondary-800 {
  border-color: var(--secondary-800) !important;
}

:root {
  --tan-700: hsl(0deg 12% 57%);
  --secondary-700: hsl(0deg 12% 57%);
}

.tan-700 {
  color: var(--tan-700) !important;
}

.bg-tan-700 {
  background-color: var(--tan-700) !important;
}

.bc-tan-700 {
  border-color: var(--tan-700) !important;
}

.secondary-700 {
  color: var(--secondary-700) !important;
}

.bg-secondary-700 {
  background-color: var(--secondary-700) !important;
}

.bc-secondary-700 {
  border-color: var(--secondary-700) !important;
}

:root {
  --tan-600: hsl(0deg 17% 66%);
  --secondary-600: hsl(0deg 17% 66%);
}

.tan-600 {
  color: var(--tan-600) !important;
}

.bg-tan-600 {
  background-color: var(--tan-600) !important;
}

.bc-tan-600 {
  border-color: var(--tan-600) !important;
}

.secondary-600 {
  color: var(--secondary-600) !important;
}

.bg-secondary-600 {
  background-color: var(--secondary-600) !important;
}

.bc-secondary-600 {
  border-color: var(--secondary-600) !important;
}

:root {
  --tan-500: hsl(0deg 18% 86%);
  --secondary-500: hsl(0deg 18% 86%);
}

.tan-500 {
  color: var(--tan-500) !important;
}

.bg-tan-500 {
  background-color: var(--tan-500) !important;
}

.bc-tan-500 {
  border-color: var(--tan-500) !important;
}

.secondary-500 {
  color: var(--secondary-500) !important;
}

.bg-secondary-500 {
  background-color: var(--secondary-500) !important;
}

.bc-secondary-500 {
  border-color: var(--secondary-500) !important;
}

:root {
  --tan-400: hsl(0deg 17% 91%);
  --secondary-400: hsl(0deg 17% 91%);
}

.tan-400 {
  color: var(--tan-400) !important;
}

.bg-tan-400 {
  background-color: var(--tan-400) !important;
}

.bc-tan-400 {
  border-color: var(--tan-400) !important;
}

.secondary-400 {
  color: var(--secondary-400) !important;
}

.bg-secondary-400 {
  background-color: var(--secondary-400) !important;
}

.bc-secondary-400 {
  border-color: var(--secondary-400) !important;
}

:root {
  --tan-300: hsl(0deg 17% 93%);
  --secondary-300: hsl(0deg 17% 93%);
}

.tan-300 {
  color: var(--tan-300) !important;
}

.bg-tan-300 {
  background-color: var(--tan-300) !important;
}

.bc-tan-300 {
  border-color: var(--tan-300) !important;
}

.secondary-300 {
  color: var(--secondary-300) !important;
}

.bg-secondary-300 {
  background-color: var(--secondary-300) !important;
}

.bc-secondary-300 {
  border-color: var(--secondary-300) !important;
}

:root {
  --tan-200: hsl(0deg 17% 95%);
  --secondary-200: hsl(0deg 17% 95%);
}

.tan-200 {
  color: var(--tan-200) !important;
}

.bg-tan-200 {
  background-color: var(--tan-200) !important;
}

.bc-tan-200 {
  border-color: var(--tan-200) !important;
}

.secondary-200 {
  color: var(--secondary-200) !important;
}

.bg-secondary-200 {
  background-color: var(--secondary-200) !important;
}

.bc-secondary-200 {
  border-color: var(--secondary-200) !important;
}

:root {
  --tan-100: hsl(0deg 16% 96%);
  --secondary-100: hsl(0deg 16% 96%);
}

.tan-100 {
  color: var(--tan-100) !important;
}

.bg-tan-100 {
  background-color: var(--tan-100) !important;
}

.bc-tan-100 {
  border-color: var(--tan-100) !important;
}

.secondary-100 {
  color: var(--secondary-100) !important;
}

.bg-secondary-100 {
  background-color: var(--secondary-100) !important;
}

.bc-secondary-100 {
  border-color: var(--secondary-100) !important;
}

:root {
  --tan-50: hsl(0deg 17% 98%);
  --secondary-50: hsl(0deg 17% 98%);
}

.tan-50 {
  color: var(--tan-50) !important;
}

.bg-tan-50 {
  background-color: var(--tan-50) !important;
}

.bc-tan-50 {
  border-color: var(--tan-50) !important;
}

.secondary-50 {
  color: var(--secondary-50) !important;
}

.bg-secondary-50 {
  background-color: var(--secondary-50) !important;
}

.bc-secondary-50 {
  border-color: var(--secondary-50) !important;
}

:root {
  --green: hsl(177deg 80% 45%);
}

.text-green {
  color: var(--green) !important;
}

.bg-green {
  background-color: var(--green) !important;
}

.bc-green {
  border-color: var(--green) !important;
}

:root {
  --success: hsl(177deg 80% 45%);
}

.text-success {
  color: var(--success) !important;
}

.bg-success {
  background-color: var(--success) !important;
}

.bc-success {
  border-color: var(--success) !important;
}

:root {
  --green-900: hsl(177deg 80% 21%);
  --success-900: hsl(177deg 80% 21%);
}

.green-900 {
  color: var(--green-900) !important;
}

.bg-green-900 {
  background-color: var(--green-900) !important;
}

.bc-green-900 {
  border-color: var(--green-900) !important;
}

.success-900 {
  color: var(--success-900) !important;
}

.bg-success-900 {
  background-color: var(--success-900) !important;
}

.bc-success-900 {
  border-color: var(--success-900) !important;
}

:root {
  --green-700: hsl(177deg 90% 26%);
  --success-700: hsl(177deg 90% 26%);
}

.green-700 {
  color: var(--green-700) !important;
}

.bg-green-700 {
  background-color: var(--green-700) !important;
}

.bc-green-700 {
  border-color: var(--green-700) !important;
}

.success-700 {
  color: var(--success-700) !important;
}

.bg-success-700 {
  background-color: var(--success-700) !important;
}

.bc-success-700 {
  border-color: var(--success-700) !important;
}

:root {
  --green-500: hsl(177deg 100% 31%);
  --success-500: hsl(177deg 100% 31%);
}

.green-500 {
  color: var(--green-500) !important;
}

.bg-green-500 {
  background-color: var(--green-500) !important;
}

.bc-green-500 {
  border-color: var(--green-500) !important;
}

.success-500 {
  color: var(--success-500) !important;
}

.bg-success-500 {
  background-color: var(--success-500) !important;
}

.bc-success-500 {
  border-color: var(--success-500) !important;
}

:root {
  --green-300: hsl(177deg 80% 45%);
  --success-300: hsl(177deg 80% 45%);
}

.green-300 {
  color: var(--green-300) !important;
}

.bg-green-300 {
  background-color: var(--green-300) !important;
}

.bc-green-300 {
  border-color: var(--green-300) !important;
}

.success-300 {
  color: var(--success-300) !important;
}

.bg-success-300 {
  background-color: var(--success-300) !important;
}

.bc-success-300 {
  border-color: var(--success-300) !important;
}

:root {
  --green-100: hsl(177deg 73% 70%);
  --success-100: hsl(177deg 73% 70%);
}

.green-100 {
  color: var(--green-100) !important;
}

.bg-green-100 {
  background-color: var(--green-100) !important;
}

.bc-green-100 {
  border-color: var(--green-100) !important;
}

.success-100 {
  color: var(--success-100) !important;
}

.bg-success-100 {
  background-color: var(--success-100) !important;
}

.bc-success-100 {
  border-color: var(--success-100) !important;
}

:root {
  --green-50: hsl(177deg 88% 87%);
  --success-50: hsl(177deg 88% 87%);
}

.green-50 {
  color: var(--green-50) !important;
}

.bg-green-50 {
  background-color: var(--green-50) !important;
}

.bc-green-50 {
  border-color: var(--green-50) !important;
}

.success-50 {
  color: var(--success-50) !important;
}

.bg-success-50 {
  background-color: var(--success-50) !important;
}

.bc-success-50 {
  border-color: var(--success-50) !important;
}

:root {
  --green-10: hsl(177deg 88% 95%);
  --success-10: hsl(177deg 88% 95%);
}

.green-10 {
  color: var(--green-10) !important;
}

.bg-green-10 {
  background-color: var(--green-10) !important;
}

.bc-green-10 {
  border-color: var(--green-10) !important;
}

.success-10 {
  color: var(--success-10) !important;
}

.bg-success-10 {
  background-color: var(--success-10) !important;
}

.bc-success-10 {
  border-color: var(--success-10) !important;
}

:root {
  --yellow: hsl(43deg 100% 60%);
}

.text-yellow {
  color: var(--yellow) !important;
}

.bg-yellow {
  background-color: var(--yellow) !important;
}

.bc-yellow {
  border-color: var(--yellow) !important;
}

:root {
  --warning: hsl(43deg 100% 60%);
}

.text-warning {
  color: var(--warning) !important;
}

.bg-warning {
  background-color: var(--warning) !important;
}

.bc-warning {
  border-color: var(--warning) !important;
}

:root {
  --yellow-900: hsl(43deg 80% 40%);
  --warning-900: hsl(43deg 80% 40%);
}

.yellow-900 {
  color: var(--yellow-900) !important;
}

.bg-yellow-900 {
  background-color: var(--yellow-900) !important;
}

.bc-yellow-900 {
  border-color: var(--yellow-900) !important;
}

.warning-900 {
  color: var(--warning-900) !important;
}

.bg-warning-900 {
  background-color: var(--warning-900) !important;
}

.bc-warning-900 {
  border-color: var(--warning-900) !important;
}

:root {
  --yellow-700: hsl(43deg 90% 50%);
  --warning-700: hsl(43deg 90% 50%);
}

.yellow-700 {
  color: var(--yellow-700) !important;
}

.bg-yellow-700 {
  background-color: var(--yellow-700) !important;
}

.bc-yellow-700 {
  border-color: var(--yellow-700) !important;
}

.warning-700 {
  color: var(--warning-700) !important;
}

.bg-warning-700 {
  background-color: var(--warning-700) !important;
}

.bc-warning-700 {
  border-color: var(--warning-700) !important;
}

:root {
  --yellow-500: hsl(43deg 100% 60%);
  --warning-500: hsl(43deg 100% 60%);
}

.yellow-500 {
  color: var(--yellow-500) !important;
}

.bg-yellow-500 {
  background-color: var(--yellow-500) !important;
}

.bc-yellow-500 {
  border-color: var(--yellow-500) !important;
}

.warning-500 {
  color: var(--warning-500) !important;
}

.bg-warning-500 {
  background-color: var(--warning-500) !important;
}

.bc-warning-500 {
  border-color: var(--warning-500) !important;
}

:root {
  --yellow-300: hsl(43deg 100% 70%);
  --warning-300: hsl(43deg 100% 70%);
}

.yellow-300 {
  color: var(--yellow-300) !important;
}

.bg-yellow-300 {
  background-color: var(--yellow-300) !important;
}

.bc-yellow-300 {
  border-color: var(--yellow-300) !important;
}

.warning-300 {
  color: var(--warning-300) !important;
}

.bg-warning-300 {
  background-color: var(--warning-300) !important;
}

.bc-warning-300 {
  border-color: var(--warning-300) !important;
}

:root {
  --yellow-100: hsl(43deg 100% 80%);
  --warning-100: hsl(43deg 100% 80%);
}

.yellow-100 {
  color: var(--yellow-100) !important;
}

.bg-yellow-100 {
  background-color: var(--yellow-100) !important;
}

.bc-yellow-100 {
  border-color: var(--yellow-100) !important;
}

.warning-100 {
  color: var(--warning-100) !important;
}

.bg-warning-100 {
  background-color: var(--warning-100) !important;
}

.bc-warning-100 {
  border-color: var(--warning-100) !important;
}

:root {
  --yellow-50: hsl(43deg 100% 90%);
  --warning-50: hsl(43deg 100% 90%);
}

.yellow-50 {
  color: var(--yellow-50) !important;
}

.bg-yellow-50 {
  background-color: var(--yellow-50) !important;
}

.bc-yellow-50 {
  border-color: var(--yellow-50) !important;
}

.warning-50 {
  color: var(--warning-50) !important;
}

.bg-warning-50 {
  background-color: var(--warning-50) !important;
}

.bc-warning-50 {
  border-color: var(--warning-50) !important;
}

:root {
  --yellow-10: hsl(43deg 100% 95%);
  --warning-10: hsl(43deg 100% 95%);
}

.yellow-10 {
  color: var(--yellow-10) !important;
}

.bg-yellow-10 {
  background-color: var(--yellow-10) !important;
}

.bc-yellow-10 {
  border-color: var(--yellow-10) !important;
}

.warning-10 {
  color: var(--warning-10) !important;
}

.bg-warning-10 {
  background-color: var(--warning-10) !important;
}

.bc-warning-10 {
  border-color: var(--warning-10) !important;
}

:root {
  --rose: hsl(351deg 100% 83%);
}

.text-rose {
  color: var(--rose) !important;
}

.bg-rose {
  background-color: var(--rose) !important;
}

.bc-rose {
  border-color: var(--rose) !important;
}

:root {
  --danger: hsl(351deg 100% 83%);
}

.text-danger {
  color: var(--danger) !important;
}

.bg-danger {
  background-color: var(--danger) !important;
}

.bc-danger {
  border-color: var(--danger) !important;
}

:root {
  --rose-900: hsl(351deg 60% 58%);
  --danger-900: hsl(351deg 60% 58%);
}

.rose-900 {
  color: var(--rose-900) !important;
}

.bg-rose-900 {
  background-color: var(--rose-900) !important;
}

.bc-rose-900 {
  border-color: var(--rose-900) !important;
}

.danger-900 {
  color: var(--danger-900) !important;
}

.bg-danger-900 {
  background-color: var(--danger-900) !important;
}

.bc-danger-900 {
  border-color: var(--danger-900) !important;
}

:root {
  --rose-700: hsl(351deg 80% 68%);
  --danger-700: hsl(351deg 80% 68%);
}

.rose-700 {
  color: var(--rose-700) !important;
}

.bg-rose-700 {
  background-color: var(--rose-700) !important;
}

.bc-rose-700 {
  border-color: var(--rose-700) !important;
}

.danger-700 {
  color: var(--danger-700) !important;
}

.bg-danger-700 {
  background-color: var(--danger-700) !important;
}

.bc-danger-700 {
  border-color: var(--danger-700) !important;
}

:root {
  --rose-500: hsl(351deg 100% 78%);
  --danger-500: hsl(351deg 100% 78%);
}

.rose-500 {
  color: var(--rose-500) !important;
}

.bg-rose-500 {
  background-color: var(--rose-500) !important;
}

.bc-rose-500 {
  border-color: var(--rose-500) !important;
}

.danger-500 {
  color: var(--danger-500) !important;
}

.bg-danger-500 {
  background-color: var(--danger-500) !important;
}

.bc-danger-500 {
  border-color: var(--danger-500) !important;
}

:root {
  --rose-300: hsl(351deg 100% 83%);
  --danger-300: hsl(351deg 100% 83%);
}

.rose-300 {
  color: var(--rose-300) !important;
}

.bg-rose-300 {
  background-color: var(--rose-300) !important;
}

.bc-rose-300 {
  border-color: var(--rose-300) !important;
}

.danger-300 {
  color: var(--danger-300) !important;
}

.bg-danger-300 {
  background-color: var(--danger-300) !important;
}

.bc-danger-300 {
  border-color: var(--danger-300) !important;
}

:root {
  --rose-100: hsl(351deg 100% 88%);
  --danger-100: hsl(351deg 100% 88%);
}

.rose-100 {
  color: var(--rose-100) !important;
}

.bg-rose-100 {
  background-color: var(--rose-100) !important;
}

.bc-rose-100 {
  border-color: var(--rose-100) !important;
}

.danger-100 {
  color: var(--danger-100) !important;
}

.bg-danger-100 {
  background-color: var(--danger-100) !important;
}

.bc-danger-100 {
  border-color: var(--danger-100) !important;
}

:root {
  --rose-50: hsl(351deg 100% 95%);
  --danger-50: hsl(351deg 100% 95%);
}

.rose-50 {
  color: var(--rose-50) !important;
}

.bg-rose-50 {
  background-color: var(--rose-50) !important;
}

.bc-rose-50 {
  border-color: var(--rose-50) !important;
}

.danger-50 {
  color: var(--danger-50) !important;
}

.bg-danger-50 {
  background-color: var(--danger-50) !important;
}

.bc-danger-50 {
  border-color: var(--danger-50) !important;
}

:root {
  --rose-10: hsl(351deg 100% 98%);
  --danger-10: hsl(351deg 100% 98%);
}

.rose-10 {
  color: var(--rose-10) !important;
}

.bg-rose-10 {
  background-color: var(--rose-10) !important;
}

.bc-rose-10 {
  border-color: var(--rose-10) !important;
}

.danger-10 {
  color: var(--danger-10) !important;
}

.bg-danger-10 {
  background-color: var(--danger-10) !important;
}

.bc-danger-10 {
  border-color: var(--danger-10) !important;
}

:root {
  --purple: hsl(261deg 76% 80%);
}

.text-purple {
  color: var(--purple) !important;
}

.bg-purple {
  background-color: var(--purple) !important;
}

.bc-purple {
  border-color: var(--purple) !important;
}

:root {
  --info: hsl(261deg 76% 80%);
}

.text-info {
  color: var(--info) !important;
}

.bg-info {
  background-color: var(--info) !important;
}

.bc-info {
  border-color: var(--info) !important;
}

:root {
  --purple-900: hsl(261deg 26% 35%);
  --info-900: hsl(261deg 26% 35%);
}

.purple-900 {
  color: var(--purple-900) !important;
}

.bg-purple-900 {
  background-color: var(--purple-900) !important;
}

.bc-purple-900 {
  border-color: var(--purple-900) !important;
}

.info-900 {
  color: var(--info-900) !important;
}

.bg-info-900 {
  background-color: var(--info-900) !important;
}

.bc-info-900 {
  border-color: var(--info-900) !important;
}

:root {
  --purple-700: hsl(261deg 36% 45%);
  --info-700: hsl(261deg 36% 45%);
}

.purple-700 {
  color: var(--purple-700) !important;
}

.bg-purple-700 {
  background-color: var(--purple-700) !important;
}

.bc-purple-700 {
  border-color: var(--purple-700) !important;
}

.info-700 {
  color: var(--info-700) !important;
}

.bg-info-700 {
  background-color: var(--info-700) !important;
}

.bc-info-700 {
  border-color: var(--info-700) !important;
}

:root {
  --purple-500: hsl(261deg 46% 55%);
  --info-500: hsl(261deg 46% 55%);
}

.purple-500 {
  color: var(--purple-500) !important;
}

.bg-purple-500 {
  background-color: var(--purple-500) !important;
}

.bc-purple-500 {
  border-color: var(--purple-500) !important;
}

.info-500 {
  color: var(--info-500) !important;
}

.bg-info-500 {
  background-color: var(--info-500) !important;
}

.bc-info-500 {
  border-color: var(--info-500) !important;
}

:root {
  --purple-300: hsl(261deg 66% 65%);
  --info-300: hsl(261deg 66% 65%);
}

.purple-300 {
  color: var(--purple-300) !important;
}

.bg-purple-300 {
  background-color: var(--purple-300) !important;
}

.bc-purple-300 {
  border-color: var(--purple-300) !important;
}

.info-300 {
  color: var(--info-300) !important;
}

.bg-info-300 {
  background-color: var(--info-300) !important;
}

.bc-info-300 {
  border-color: var(--info-300) !important;
}

:root {
  --purple-100: hsl(261deg 76% 80%);
  --info-100: hsl(261deg 76% 80%);
}

.purple-100 {
  color: var(--purple-100) !important;
}

.bg-purple-100 {
  background-color: var(--purple-100) !important;
}

.bc-purple-100 {
  border-color: var(--purple-100) !important;
}

.info-100 {
  color: var(--info-100) !important;
}

.bg-info-100 {
  background-color: var(--info-100) !important;
}

.bc-info-100 {
  border-color: var(--info-100) !important;
}

:root {
  --purple-50: hsl(261deg 100% 96%);
  --info-50: hsl(261deg 100% 96%);
}

.purple-50 {
  color: var(--purple-50) !important;
}

.bg-purple-50 {
  background-color: var(--purple-50) !important;
}

.bc-purple-50 {
  border-color: var(--purple-50) !important;
}

.info-50 {
  color: var(--info-50) !important;
}

.bg-info-50 {
  background-color: var(--info-50) !important;
}

.bc-info-50 {
  border-color: var(--info-50) !important;
}

:root {
  --purple-10: hsl(261deg 100% 98%);
  --info-10: hsl(261deg 100% 98%);
}

.purple-10 {
  color: var(--purple-10) !important;
}

.bg-purple-10 {
  background-color: var(--purple-10) !important;
}

.bc-purple-10 {
  border-color: var(--purple-10) !important;
}

.info-10 {
  color: var(--info-10) !important;
}

.bg-info-10 {
  background-color: var(--info-10) !important;
}

.bc-info-10 {
  border-color: var(--info-10) !important;
}

:root {
  --blue: hsl(209deg 86% 70%);
}

.text-blue {
  color: var(--blue) !important;
}

.bg-blue {
  background-color: var(--blue) !important;
}

.bc-blue {
  border-color: var(--blue) !important;
}

:root {
  --blue-900: hsl(209deg 46% 22%);
}

.blue-900 {
  color: var(--blue-900) !important;
}

.bg-blue-900 {
  background-color: var(--blue-900) !important;
}

.bc-blue-900 {
  border-color: var(--blue-900) !important;
}

:root {
  --blue-700: hsl(209deg 56% 32%);
}

.blue-700 {
  color: var(--blue-700) !important;
}

.bg-blue-700 {
  background-color: var(--blue-700) !important;
}

.bc-blue-700 {
  border-color: var(--blue-700) !important;
}

:root {
  --blue-500: hsl(209deg 66% 42%);
}

.blue-500 {
  color: var(--blue-500) !important;
}

.bg-blue-500 {
  background-color: var(--blue-500) !important;
}

.bc-blue-500 {
  border-color: var(--blue-500) !important;
}

:root {
  --blue-300: hsl(209deg 76% 52%);
}

.blue-300 {
  color: var(--blue-300) !important;
}

.bg-blue-300 {
  background-color: var(--blue-300) !important;
}

.bc-blue-300 {
  border-color: var(--blue-300) !important;
}

:root {
  --blue-100: hsl(209deg 86% 70%);
}

.blue-100 {
  color: var(--blue-100) !important;
}

.bg-blue-100 {
  background-color: var(--blue-100) !important;
}

.bc-blue-100 {
  border-color: var(--blue-100) !important;
}

:root {
  --blue-50: hsl(209deg 90% 80%);
}

.blue-50 {
  color: var(--blue-50) !important;
}

.bg-blue-50 {
  background-color: var(--blue-50) !important;
}

.bc-blue-50 {
  border-color: var(--blue-50) !important;
}

:root {
  --blue-10: hsl(209deg 94% 90%);
}

.blue-10 {
  color: var(--blue-10) !important;
}

.bg-blue-10 {
  background-color: var(--blue-10) !important;
}

.bc-blue-10 {
  border-color: var(--blue-10) !important;
}

:root {
  --orange: hsl(35deg 99% 50%);
}

.text-orange {
  color: var(--orange) !important;
}

.bg-orange {
  background-color: var(--orange) !important;
}

.bc-orange {
  border-color: var(--orange) !important;
}

:root {
  --orange-900: hsl(35deg 83% 36%);
}

.orange-900 {
  color: var(--orange-900) !important;
}

.bg-orange-900 {
  background-color: var(--orange-900) !important;
}

.bc-orange-900 {
  border-color: var(--orange-900) !important;
}

:root {
  --orange-700: hsl(35deg 88% 48%);
}

.orange-700 {
  color: var(--orange-700) !important;
}

.bg-orange-700 {
  background-color: var(--orange-700) !important;
}

.bc-orange-700 {
  border-color: var(--orange-700) !important;
}

:root {
  --orange-500: hsl(35deg 99% 50%);
}

.orange-500 {
  color: var(--orange-500) !important;
}

.bg-orange-500 {
  background-color: var(--orange-500) !important;
}

.bc-orange-500 {
  border-color: var(--orange-500) !important;
}

:root {
  --orange-300: hsl(35deg 93% 66%);
}

.orange-300 {
  color: var(--orange-300) !important;
}

.bg-orange-300 {
  background-color: var(--orange-300) !important;
}

.bc-orange-300 {
  border-color: var(--orange-300) !important;
}

:root {
  --orange-100: hsl(35deg 93% 76%);
}

.orange-100 {
  color: var(--orange-100) !important;
}

.bg-orange-100 {
  background-color: var(--orange-100) !important;
}

.bc-orange-100 {
  border-color: var(--orange-100) !important;
}

:root {
  --orange-50: hsl(35deg 93% 86%);
}

.orange-50 {
  color: var(--orange-50) !important;
}

.bg-orange-50 {
  background-color: var(--orange-50) !important;
}

.bc-orange-50 {
  border-color: var(--orange-50) !important;
}

:root {
  --orange-10: hsl(35deg 93% 95%);
}

.orange-10 {
  color: var(--orange-10) !important;
}

.bg-orange-10 {
  background-color: var(--orange-10) !important;
}

.bc-orange-10 {
  border-color: var(--orange-10) !important;
}

:root {
  --pink: hsl(320deg 90% 86%);
}

.text-pink {
  color: var(--pink) !important;
}

.bg-pink {
  background-color: var(--pink) !important;
}

.bc-pink {
  border-color: var(--pink) !important;
}

:root {
  --pink-900: hsl(320deg 40% 61%);
}

.pink-900 {
  color: var(--pink-900) !important;
}

.bg-pink-900 {
  background-color: var(--pink-900) !important;
}

.bc-pink-900 {
  border-color: var(--pink-900) !important;
}

:root {
  --pink-700: hsl(320deg 60% 71%);
}

.pink-700 {
  color: var(--pink-700) !important;
}

.bg-pink-700 {
  background-color: var(--pink-700) !important;
}

.bc-pink-700 {
  border-color: var(--pink-700) !important;
}

:root {
  --pink-500: hsl(320deg 80% 81%);
}

.pink-500 {
  color: var(--pink-500) !important;
}

.bg-pink-500 {
  background-color: var(--pink-500) !important;
}

.bc-pink-500 {
  border-color: var(--pink-500) !important;
}

:root {
  --pink-300: hsl(320deg 90% 86%);
}

.pink-300 {
  color: var(--pink-300) !important;
}

.bg-pink-300 {
  background-color: var(--pink-300) !important;
}

.bc-pink-300 {
  border-color: var(--pink-300) !important;
}

:root {
  --pink-100: hsl(320deg 100% 91%);
}

.pink-100 {
  color: var(--pink-100) !important;
}

.bg-pink-100 {
  background-color: var(--pink-100) !important;
}

.bc-pink-100 {
  border-color: var(--pink-100) !important;
}

:root {
  --pink-50: hsl(320deg 100% 95%);
}

.pink-50 {
  color: var(--pink-50) !important;
}

.bg-pink-50 {
  background-color: var(--pink-50) !important;
}

.bc-pink-50 {
  border-color: var(--pink-50) !important;
}

:root {
  --pink-10: hsl(320deg 100% 98%);
}

.pink-10 {
  color: var(--pink-10) !important;
}

.bg-pink-10 {
  background-color: var(--pink-10) !important;
}

.bc-pink-10 {
  border-color: var(--pink-10) !important;
}

:root {
  --black: #0000;
  --white: #FFFF;
}

.text-black {
  color: var(--black) !important;
}

.bg-black {
  background-color: var(--black) !important;
}

.text-white, .white {
  color: var(--white) !important;
}

.bg-white {
  background-color: var(--white) !important;
}

.bg-grey {
  background-color: rgba(221, 221, 221, 0.8666666667);
}

.bg-primary-800 *, .bg-primary-700 * {
  color: var(--white);
}

.bg-gradient-green {
  background: linear-gradient(90deg, var(--Green-700, #077E79) 0.4%, #0CE4DA 158.29%);
}

:root {
  --spacing-0: 0rem;
  --spacing-1: 0.25rem;
  --spacing-2: 0.5rem;
  --spacing-25: 0.75rem;
  --spacing-3: 1rem;
  --spacing-35: 1.25rem;
  --spacing-4: 1.5rem;
  --spacing-5: 2rem;
  --spacing-6: 2.5rem;
  --spacing-7: 3rem;
  --spacing-8: 4rem;
  --spacing-9: 8rem;
  --width-0: 0%;
  --width-15: 15%;
  --width-20: 20%;
  --width-25: 25%;
  --width-30: 30%;
  --width-33: 33.333%;
  --width-40: 40%;
  --width-45: 45%;
  --width-50: 50%;
  --width-60: 60%;
  --width-66: 66.666%;
  --width-70: 70%;
  --width-75: 75%;
  --width-80: 80%;
  --width-85: 85%;
  --width-90: 90%;
  --width-100: 100%;
  --width-fit: fit-content;
  --width-min: min-content;
  --width-max: max-content;
  --width-auto: auto;
}

.w-15 {
  width: var(--width-15) !important;
}

.max-w-15 {
  max-width: var(--width-15) !important;
}

.w-20 {
  width: var(--width-20) !important;
}

.max-w-20 {
  max-width: var(--width-20) !important;
}

.w-25 {
  width: var(--width-25) !important;
}

.max-w-25 {
  max-width: var(--width-25) !important;
}

.w-30 {
  width: var(--width-30) !important;
}

.max-w-30 {
  max-width: var(--width-30) !important;
}

.w-33 {
  width: var(--width-33) !important;
}

.max-w-33 {
  max-width: var(--width-33) !important;
}

.w-40 {
  width: var(--width-40) !important;
}

.max-w-40 {
  max-width: var(--width-40) !important;
}

.w-45 {
  width: var(--width-45) !important;
}

.max-w-45 {
  max-width: var(--width-45) !important;
}

.w-50 {
  width: var(--width-50) !important;
}

.max-w-50 {
  max-width: var(--width-50) !important;
}

.w-60 {
  width: var(--width-60) !important;
}

.max-w-60 {
  max-width: var(--width-60) !important;
}

.w-66 {
  width: var(--width-66) !important;
}

.max-w-66 {
  max-width: var(--width-66) !important;
}

.w-70 {
  width: var(--width-70) !important;
}

.max-w-70 {
  max-width: var(--width-70) !important;
}

.w-75 {
  width: var(--width-75) !important;
}

.max-w-75 {
  max-width: var(--width-75) !important;
}

.w-80 {
  width: var(--width-80) !important;
}

.max-w-80 {
  max-width: var(--width-80) !important;
}

.w-85 {
  width: var(--width-85) !important;
}

.max-w-85 {
  max-width: var(--width-85) !important;
}

.w-90 {
  width: var(--width-90) !important;
}

.max-w-90 {
  max-width: var(--width-90) !important;
}

.w-100 {
  width: var(--width-100) !important;
}

.max-w-100 {
  max-width: var(--width-100) !important;
}

.w-fit {
  width: var(--width-fit) !important;
}

.max-w-fit {
  max-width: var(--width-fit) !important;
}

.w-min {
  width: var(--width-min) !important;
}

.max-w-min {
  max-width: var(--width-min) !important;
}

.w-max {
  width: var(--width-max) !important;
}

.max-w-max {
  max-width: var(--width-max) !important;
}

.w-auto {
  width: var(--width-auto) !important;
}

.max-w-auto {
  max-width: var(--width-auto) !important;
}

.w-15-15 {
  width: var(--width-15) !important;
}
@media (min-width: 992px) {
  .w-15-15 {
    width: var(--width-15) !important;
  }
}

.w-15-20 {
  width: var(--width-15) !important;
}
@media (min-width: 992px) {
  .w-15-20 {
    width: var(--width-20) !important;
  }
}

.w-15-25 {
  width: var(--width-15) !important;
}
@media (min-width: 992px) {
  .w-15-25 {
    width: var(--width-25) !important;
  }
}

.w-15-30 {
  width: var(--width-15) !important;
}
@media (min-width: 992px) {
  .w-15-30 {
    width: var(--width-30) !important;
  }
}

.w-15-33 {
  width: var(--width-15) !important;
}
@media (min-width: 992px) {
  .w-15-33 {
    width: var(--width-33) !important;
  }
}

.w-15-40 {
  width: var(--width-15) !important;
}
@media (min-width: 992px) {
  .w-15-40 {
    width: var(--width-40) !important;
  }
}

.w-15-45 {
  width: var(--width-15) !important;
}
@media (min-width: 992px) {
  .w-15-45 {
    width: var(--width-45) !important;
  }
}

.w-15-50 {
  width: var(--width-15) !important;
}
@media (min-width: 992px) {
  .w-15-50 {
    width: var(--width-50) !important;
  }
}

.w-15-60 {
  width: var(--width-15) !important;
}
@media (min-width: 992px) {
  .w-15-60 {
    width: var(--width-60) !important;
  }
}

.w-15-66 {
  width: var(--width-15) !important;
}
@media (min-width: 992px) {
  .w-15-66 {
    width: var(--width-66) !important;
  }
}

.w-15-70 {
  width: var(--width-15) !important;
}
@media (min-width: 992px) {
  .w-15-70 {
    width: var(--width-70) !important;
  }
}

.w-15-75 {
  width: var(--width-15) !important;
}
@media (min-width: 992px) {
  .w-15-75 {
    width: var(--width-75) !important;
  }
}

.w-15-80 {
  width: var(--width-15) !important;
}
@media (min-width: 992px) {
  .w-15-80 {
    width: var(--width-80) !important;
  }
}

.w-15-85 {
  width: var(--width-15) !important;
}
@media (min-width: 992px) {
  .w-15-85 {
    width: var(--width-85) !important;
  }
}

.w-15-90 {
  width: var(--width-15) !important;
}
@media (min-width: 992px) {
  .w-15-90 {
    width: var(--width-90) !important;
  }
}

.w-15-100 {
  width: var(--width-15) !important;
}
@media (min-width: 992px) {
  .w-15-100 {
    width: var(--width-100) !important;
  }
}

.w-15-fit {
  width: var(--width-15) !important;
}
@media (min-width: 992px) {
  .w-15-fit {
    width: var(--width-fit) !important;
  }
}

.w-15-min {
  width: var(--width-15) !important;
}
@media (min-width: 992px) {
  .w-15-min {
    width: var(--width-min) !important;
  }
}

.w-15-max {
  width: var(--width-15) !important;
}
@media (min-width: 992px) {
  .w-15-max {
    width: var(--width-max) !important;
  }
}

.w-15-auto {
  width: var(--width-15) !important;
}
@media (min-width: 992px) {
  .w-15-auto {
    width: var(--width-auto) !important;
  }
}

.w-20-15 {
  width: var(--width-20) !important;
}
@media (min-width: 992px) {
  .w-20-15 {
    width: var(--width-15) !important;
  }
}

.w-20-20 {
  width: var(--width-20) !important;
}
@media (min-width: 992px) {
  .w-20-20 {
    width: var(--width-20) !important;
  }
}

.w-20-25 {
  width: var(--width-20) !important;
}
@media (min-width: 992px) {
  .w-20-25 {
    width: var(--width-25) !important;
  }
}

.w-20-30 {
  width: var(--width-20) !important;
}
@media (min-width: 992px) {
  .w-20-30 {
    width: var(--width-30) !important;
  }
}

.w-20-33 {
  width: var(--width-20) !important;
}
@media (min-width: 992px) {
  .w-20-33 {
    width: var(--width-33) !important;
  }
}

.w-20-40 {
  width: var(--width-20) !important;
}
@media (min-width: 992px) {
  .w-20-40 {
    width: var(--width-40) !important;
  }
}

.w-20-45 {
  width: var(--width-20) !important;
}
@media (min-width: 992px) {
  .w-20-45 {
    width: var(--width-45) !important;
  }
}

.w-20-50 {
  width: var(--width-20) !important;
}
@media (min-width: 992px) {
  .w-20-50 {
    width: var(--width-50) !important;
  }
}

.w-20-60 {
  width: var(--width-20) !important;
}
@media (min-width: 992px) {
  .w-20-60 {
    width: var(--width-60) !important;
  }
}

.w-20-66 {
  width: var(--width-20) !important;
}
@media (min-width: 992px) {
  .w-20-66 {
    width: var(--width-66) !important;
  }
}

.w-20-70 {
  width: var(--width-20) !important;
}
@media (min-width: 992px) {
  .w-20-70 {
    width: var(--width-70) !important;
  }
}

.w-20-75 {
  width: var(--width-20) !important;
}
@media (min-width: 992px) {
  .w-20-75 {
    width: var(--width-75) !important;
  }
}

.w-20-80 {
  width: var(--width-20) !important;
}
@media (min-width: 992px) {
  .w-20-80 {
    width: var(--width-80) !important;
  }
}

.w-20-85 {
  width: var(--width-20) !important;
}
@media (min-width: 992px) {
  .w-20-85 {
    width: var(--width-85) !important;
  }
}

.w-20-90 {
  width: var(--width-20) !important;
}
@media (min-width: 992px) {
  .w-20-90 {
    width: var(--width-90) !important;
  }
}

.w-20-100 {
  width: var(--width-20) !important;
}
@media (min-width: 992px) {
  .w-20-100 {
    width: var(--width-100) !important;
  }
}

.w-20-fit {
  width: var(--width-20) !important;
}
@media (min-width: 992px) {
  .w-20-fit {
    width: var(--width-fit) !important;
  }
}

.w-20-min {
  width: var(--width-20) !important;
}
@media (min-width: 992px) {
  .w-20-min {
    width: var(--width-min) !important;
  }
}

.w-20-max {
  width: var(--width-20) !important;
}
@media (min-width: 992px) {
  .w-20-max {
    width: var(--width-max) !important;
  }
}

.w-20-auto {
  width: var(--width-20) !important;
}
@media (min-width: 992px) {
  .w-20-auto {
    width: var(--width-auto) !important;
  }
}

.w-25-15 {
  width: var(--width-25) !important;
}
@media (min-width: 992px) {
  .w-25-15 {
    width: var(--width-15) !important;
  }
}

.w-25-20 {
  width: var(--width-25) !important;
}
@media (min-width: 992px) {
  .w-25-20 {
    width: var(--width-20) !important;
  }
}

.w-25-25 {
  width: var(--width-25) !important;
}
@media (min-width: 992px) {
  .w-25-25 {
    width: var(--width-25) !important;
  }
}

.w-25-30 {
  width: var(--width-25) !important;
}
@media (min-width: 992px) {
  .w-25-30 {
    width: var(--width-30) !important;
  }
}

.w-25-33 {
  width: var(--width-25) !important;
}
@media (min-width: 992px) {
  .w-25-33 {
    width: var(--width-33) !important;
  }
}

.w-25-40 {
  width: var(--width-25) !important;
}
@media (min-width: 992px) {
  .w-25-40 {
    width: var(--width-40) !important;
  }
}

.w-25-45 {
  width: var(--width-25) !important;
}
@media (min-width: 992px) {
  .w-25-45 {
    width: var(--width-45) !important;
  }
}

.w-25-50 {
  width: var(--width-25) !important;
}
@media (min-width: 992px) {
  .w-25-50 {
    width: var(--width-50) !important;
  }
}

.w-25-60 {
  width: var(--width-25) !important;
}
@media (min-width: 992px) {
  .w-25-60 {
    width: var(--width-60) !important;
  }
}

.w-25-66 {
  width: var(--width-25) !important;
}
@media (min-width: 992px) {
  .w-25-66 {
    width: var(--width-66) !important;
  }
}

.w-25-70 {
  width: var(--width-25) !important;
}
@media (min-width: 992px) {
  .w-25-70 {
    width: var(--width-70) !important;
  }
}

.w-25-75 {
  width: var(--width-25) !important;
}
@media (min-width: 992px) {
  .w-25-75 {
    width: var(--width-75) !important;
  }
}

.w-25-80 {
  width: var(--width-25) !important;
}
@media (min-width: 992px) {
  .w-25-80 {
    width: var(--width-80) !important;
  }
}

.w-25-85 {
  width: var(--width-25) !important;
}
@media (min-width: 992px) {
  .w-25-85 {
    width: var(--width-85) !important;
  }
}

.w-25-90 {
  width: var(--width-25) !important;
}
@media (min-width: 992px) {
  .w-25-90 {
    width: var(--width-90) !important;
  }
}

.w-25-100 {
  width: var(--width-25) !important;
}
@media (min-width: 992px) {
  .w-25-100 {
    width: var(--width-100) !important;
  }
}

.w-25-fit {
  width: var(--width-25) !important;
}
@media (min-width: 992px) {
  .w-25-fit {
    width: var(--width-fit) !important;
  }
}

.w-25-min {
  width: var(--width-25) !important;
}
@media (min-width: 992px) {
  .w-25-min {
    width: var(--width-min) !important;
  }
}

.w-25-max {
  width: var(--width-25) !important;
}
@media (min-width: 992px) {
  .w-25-max {
    width: var(--width-max) !important;
  }
}

.w-25-auto {
  width: var(--width-25) !important;
}
@media (min-width: 992px) {
  .w-25-auto {
    width: var(--width-auto) !important;
  }
}

.w-30-15 {
  width: var(--width-30) !important;
}
@media (min-width: 992px) {
  .w-30-15 {
    width: var(--width-15) !important;
  }
}

.w-30-20 {
  width: var(--width-30) !important;
}
@media (min-width: 992px) {
  .w-30-20 {
    width: var(--width-20) !important;
  }
}

.w-30-25 {
  width: var(--width-30) !important;
}
@media (min-width: 992px) {
  .w-30-25 {
    width: var(--width-25) !important;
  }
}

.w-30-30 {
  width: var(--width-30) !important;
}
@media (min-width: 992px) {
  .w-30-30 {
    width: var(--width-30) !important;
  }
}

.w-30-33 {
  width: var(--width-30) !important;
}
@media (min-width: 992px) {
  .w-30-33 {
    width: var(--width-33) !important;
  }
}

.w-30-40 {
  width: var(--width-30) !important;
}
@media (min-width: 992px) {
  .w-30-40 {
    width: var(--width-40) !important;
  }
}

.w-30-45 {
  width: var(--width-30) !important;
}
@media (min-width: 992px) {
  .w-30-45 {
    width: var(--width-45) !important;
  }
}

.w-30-50 {
  width: var(--width-30) !important;
}
@media (min-width: 992px) {
  .w-30-50 {
    width: var(--width-50) !important;
  }
}

.w-30-60 {
  width: var(--width-30) !important;
}
@media (min-width: 992px) {
  .w-30-60 {
    width: var(--width-60) !important;
  }
}

.w-30-66 {
  width: var(--width-30) !important;
}
@media (min-width: 992px) {
  .w-30-66 {
    width: var(--width-66) !important;
  }
}

.w-30-70 {
  width: var(--width-30) !important;
}
@media (min-width: 992px) {
  .w-30-70 {
    width: var(--width-70) !important;
  }
}

.w-30-75 {
  width: var(--width-30) !important;
}
@media (min-width: 992px) {
  .w-30-75 {
    width: var(--width-75) !important;
  }
}

.w-30-80 {
  width: var(--width-30) !important;
}
@media (min-width: 992px) {
  .w-30-80 {
    width: var(--width-80) !important;
  }
}

.w-30-85 {
  width: var(--width-30) !important;
}
@media (min-width: 992px) {
  .w-30-85 {
    width: var(--width-85) !important;
  }
}

.w-30-90 {
  width: var(--width-30) !important;
}
@media (min-width: 992px) {
  .w-30-90 {
    width: var(--width-90) !important;
  }
}

.w-30-100 {
  width: var(--width-30) !important;
}
@media (min-width: 992px) {
  .w-30-100 {
    width: var(--width-100) !important;
  }
}

.w-30-fit {
  width: var(--width-30) !important;
}
@media (min-width: 992px) {
  .w-30-fit {
    width: var(--width-fit) !important;
  }
}

.w-30-min {
  width: var(--width-30) !important;
}
@media (min-width: 992px) {
  .w-30-min {
    width: var(--width-min) !important;
  }
}

.w-30-max {
  width: var(--width-30) !important;
}
@media (min-width: 992px) {
  .w-30-max {
    width: var(--width-max) !important;
  }
}

.w-30-auto {
  width: var(--width-30) !important;
}
@media (min-width: 992px) {
  .w-30-auto {
    width: var(--width-auto) !important;
  }
}

.w-33-15 {
  width: var(--width-33) !important;
}
@media (min-width: 992px) {
  .w-33-15 {
    width: var(--width-15) !important;
  }
}

.w-33-20 {
  width: var(--width-33) !important;
}
@media (min-width: 992px) {
  .w-33-20 {
    width: var(--width-20) !important;
  }
}

.w-33-25 {
  width: var(--width-33) !important;
}
@media (min-width: 992px) {
  .w-33-25 {
    width: var(--width-25) !important;
  }
}

.w-33-30 {
  width: var(--width-33) !important;
}
@media (min-width: 992px) {
  .w-33-30 {
    width: var(--width-30) !important;
  }
}

.w-33-33 {
  width: var(--width-33) !important;
}
@media (min-width: 992px) {
  .w-33-33 {
    width: var(--width-33) !important;
  }
}

.w-33-40 {
  width: var(--width-33) !important;
}
@media (min-width: 992px) {
  .w-33-40 {
    width: var(--width-40) !important;
  }
}

.w-33-45 {
  width: var(--width-33) !important;
}
@media (min-width: 992px) {
  .w-33-45 {
    width: var(--width-45) !important;
  }
}

.w-33-50 {
  width: var(--width-33) !important;
}
@media (min-width: 992px) {
  .w-33-50 {
    width: var(--width-50) !important;
  }
}

.w-33-60 {
  width: var(--width-33) !important;
}
@media (min-width: 992px) {
  .w-33-60 {
    width: var(--width-60) !important;
  }
}

.w-33-66 {
  width: var(--width-33) !important;
}
@media (min-width: 992px) {
  .w-33-66 {
    width: var(--width-66) !important;
  }
}

.w-33-70 {
  width: var(--width-33) !important;
}
@media (min-width: 992px) {
  .w-33-70 {
    width: var(--width-70) !important;
  }
}

.w-33-75 {
  width: var(--width-33) !important;
}
@media (min-width: 992px) {
  .w-33-75 {
    width: var(--width-75) !important;
  }
}

.w-33-80 {
  width: var(--width-33) !important;
}
@media (min-width: 992px) {
  .w-33-80 {
    width: var(--width-80) !important;
  }
}

.w-33-85 {
  width: var(--width-33) !important;
}
@media (min-width: 992px) {
  .w-33-85 {
    width: var(--width-85) !important;
  }
}

.w-33-90 {
  width: var(--width-33) !important;
}
@media (min-width: 992px) {
  .w-33-90 {
    width: var(--width-90) !important;
  }
}

.w-33-100 {
  width: var(--width-33) !important;
}
@media (min-width: 992px) {
  .w-33-100 {
    width: var(--width-100) !important;
  }
}

.w-33-fit {
  width: var(--width-33) !important;
}
@media (min-width: 992px) {
  .w-33-fit {
    width: var(--width-fit) !important;
  }
}

.w-33-min {
  width: var(--width-33) !important;
}
@media (min-width: 992px) {
  .w-33-min {
    width: var(--width-min) !important;
  }
}

.w-33-max {
  width: var(--width-33) !important;
}
@media (min-width: 992px) {
  .w-33-max {
    width: var(--width-max) !important;
  }
}

.w-33-auto {
  width: var(--width-33) !important;
}
@media (min-width: 992px) {
  .w-33-auto {
    width: var(--width-auto) !important;
  }
}

.w-40-15 {
  width: var(--width-40) !important;
}
@media (min-width: 992px) {
  .w-40-15 {
    width: var(--width-15) !important;
  }
}

.w-40-20 {
  width: var(--width-40) !important;
}
@media (min-width: 992px) {
  .w-40-20 {
    width: var(--width-20) !important;
  }
}

.w-40-25 {
  width: var(--width-40) !important;
}
@media (min-width: 992px) {
  .w-40-25 {
    width: var(--width-25) !important;
  }
}

.w-40-30 {
  width: var(--width-40) !important;
}
@media (min-width: 992px) {
  .w-40-30 {
    width: var(--width-30) !important;
  }
}

.w-40-33 {
  width: var(--width-40) !important;
}
@media (min-width: 992px) {
  .w-40-33 {
    width: var(--width-33) !important;
  }
}

.w-40-40 {
  width: var(--width-40) !important;
}
@media (min-width: 992px) {
  .w-40-40 {
    width: var(--width-40) !important;
  }
}

.w-40-45 {
  width: var(--width-40) !important;
}
@media (min-width: 992px) {
  .w-40-45 {
    width: var(--width-45) !important;
  }
}

.w-40-50 {
  width: var(--width-40) !important;
}
@media (min-width: 992px) {
  .w-40-50 {
    width: var(--width-50) !important;
  }
}

.w-40-60 {
  width: var(--width-40) !important;
}
@media (min-width: 992px) {
  .w-40-60 {
    width: var(--width-60) !important;
  }
}

.w-40-66 {
  width: var(--width-40) !important;
}
@media (min-width: 992px) {
  .w-40-66 {
    width: var(--width-66) !important;
  }
}

.w-40-70 {
  width: var(--width-40) !important;
}
@media (min-width: 992px) {
  .w-40-70 {
    width: var(--width-70) !important;
  }
}

.w-40-75 {
  width: var(--width-40) !important;
}
@media (min-width: 992px) {
  .w-40-75 {
    width: var(--width-75) !important;
  }
}

.w-40-80 {
  width: var(--width-40) !important;
}
@media (min-width: 992px) {
  .w-40-80 {
    width: var(--width-80) !important;
  }
}

.w-40-85 {
  width: var(--width-40) !important;
}
@media (min-width: 992px) {
  .w-40-85 {
    width: var(--width-85) !important;
  }
}

.w-40-90 {
  width: var(--width-40) !important;
}
@media (min-width: 992px) {
  .w-40-90 {
    width: var(--width-90) !important;
  }
}

.w-40-100 {
  width: var(--width-40) !important;
}
@media (min-width: 992px) {
  .w-40-100 {
    width: var(--width-100) !important;
  }
}

.w-40-fit {
  width: var(--width-40) !important;
}
@media (min-width: 992px) {
  .w-40-fit {
    width: var(--width-fit) !important;
  }
}

.w-40-min {
  width: var(--width-40) !important;
}
@media (min-width: 992px) {
  .w-40-min {
    width: var(--width-min) !important;
  }
}

.w-40-max {
  width: var(--width-40) !important;
}
@media (min-width: 992px) {
  .w-40-max {
    width: var(--width-max) !important;
  }
}

.w-40-auto {
  width: var(--width-40) !important;
}
@media (min-width: 992px) {
  .w-40-auto {
    width: var(--width-auto) !important;
  }
}

.w-45-15 {
  width: var(--width-45) !important;
}
@media (min-width: 992px) {
  .w-45-15 {
    width: var(--width-15) !important;
  }
}

.w-45-20 {
  width: var(--width-45) !important;
}
@media (min-width: 992px) {
  .w-45-20 {
    width: var(--width-20) !important;
  }
}

.w-45-25 {
  width: var(--width-45) !important;
}
@media (min-width: 992px) {
  .w-45-25 {
    width: var(--width-25) !important;
  }
}

.w-45-30 {
  width: var(--width-45) !important;
}
@media (min-width: 992px) {
  .w-45-30 {
    width: var(--width-30) !important;
  }
}

.w-45-33 {
  width: var(--width-45) !important;
}
@media (min-width: 992px) {
  .w-45-33 {
    width: var(--width-33) !important;
  }
}

.w-45-40 {
  width: var(--width-45) !important;
}
@media (min-width: 992px) {
  .w-45-40 {
    width: var(--width-40) !important;
  }
}

.w-45-45 {
  width: var(--width-45) !important;
}
@media (min-width: 992px) {
  .w-45-45 {
    width: var(--width-45) !important;
  }
}

.w-45-50 {
  width: var(--width-45) !important;
}
@media (min-width: 992px) {
  .w-45-50 {
    width: var(--width-50) !important;
  }
}

.w-45-60 {
  width: var(--width-45) !important;
}
@media (min-width: 992px) {
  .w-45-60 {
    width: var(--width-60) !important;
  }
}

.w-45-66 {
  width: var(--width-45) !important;
}
@media (min-width: 992px) {
  .w-45-66 {
    width: var(--width-66) !important;
  }
}

.w-45-70 {
  width: var(--width-45) !important;
}
@media (min-width: 992px) {
  .w-45-70 {
    width: var(--width-70) !important;
  }
}

.w-45-75 {
  width: var(--width-45) !important;
}
@media (min-width: 992px) {
  .w-45-75 {
    width: var(--width-75) !important;
  }
}

.w-45-80 {
  width: var(--width-45) !important;
}
@media (min-width: 992px) {
  .w-45-80 {
    width: var(--width-80) !important;
  }
}

.w-45-85 {
  width: var(--width-45) !important;
}
@media (min-width: 992px) {
  .w-45-85 {
    width: var(--width-85) !important;
  }
}

.w-45-90 {
  width: var(--width-45) !important;
}
@media (min-width: 992px) {
  .w-45-90 {
    width: var(--width-90) !important;
  }
}

.w-45-100 {
  width: var(--width-45) !important;
}
@media (min-width: 992px) {
  .w-45-100 {
    width: var(--width-100) !important;
  }
}

.w-45-fit {
  width: var(--width-45) !important;
}
@media (min-width: 992px) {
  .w-45-fit {
    width: var(--width-fit) !important;
  }
}

.w-45-min {
  width: var(--width-45) !important;
}
@media (min-width: 992px) {
  .w-45-min {
    width: var(--width-min) !important;
  }
}

.w-45-max {
  width: var(--width-45) !important;
}
@media (min-width: 992px) {
  .w-45-max {
    width: var(--width-max) !important;
  }
}

.w-45-auto {
  width: var(--width-45) !important;
}
@media (min-width: 992px) {
  .w-45-auto {
    width: var(--width-auto) !important;
  }
}

.w-50-15 {
  width: var(--width-50) !important;
}
@media (min-width: 992px) {
  .w-50-15 {
    width: var(--width-15) !important;
  }
}

.w-50-20 {
  width: var(--width-50) !important;
}
@media (min-width: 992px) {
  .w-50-20 {
    width: var(--width-20) !important;
  }
}

.w-50-25 {
  width: var(--width-50) !important;
}
@media (min-width: 992px) {
  .w-50-25 {
    width: var(--width-25) !important;
  }
}

.w-50-30 {
  width: var(--width-50) !important;
}
@media (min-width: 992px) {
  .w-50-30 {
    width: var(--width-30) !important;
  }
}

.w-50-33 {
  width: var(--width-50) !important;
}
@media (min-width: 992px) {
  .w-50-33 {
    width: var(--width-33) !important;
  }
}

.w-50-40 {
  width: var(--width-50) !important;
}
@media (min-width: 992px) {
  .w-50-40 {
    width: var(--width-40) !important;
  }
}

.w-50-45 {
  width: var(--width-50) !important;
}
@media (min-width: 992px) {
  .w-50-45 {
    width: var(--width-45) !important;
  }
}

.w-50-50 {
  width: var(--width-50) !important;
}
@media (min-width: 992px) {
  .w-50-50 {
    width: var(--width-50) !important;
  }
}

.w-50-60 {
  width: var(--width-50) !important;
}
@media (min-width: 992px) {
  .w-50-60 {
    width: var(--width-60) !important;
  }
}

.w-50-66 {
  width: var(--width-50) !important;
}
@media (min-width: 992px) {
  .w-50-66 {
    width: var(--width-66) !important;
  }
}

.w-50-70 {
  width: var(--width-50) !important;
}
@media (min-width: 992px) {
  .w-50-70 {
    width: var(--width-70) !important;
  }
}

.w-50-75 {
  width: var(--width-50) !important;
}
@media (min-width: 992px) {
  .w-50-75 {
    width: var(--width-75) !important;
  }
}

.w-50-80 {
  width: var(--width-50) !important;
}
@media (min-width: 992px) {
  .w-50-80 {
    width: var(--width-80) !important;
  }
}

.w-50-85 {
  width: var(--width-50) !important;
}
@media (min-width: 992px) {
  .w-50-85 {
    width: var(--width-85) !important;
  }
}

.w-50-90 {
  width: var(--width-50) !important;
}
@media (min-width: 992px) {
  .w-50-90 {
    width: var(--width-90) !important;
  }
}

.w-50-100 {
  width: var(--width-50) !important;
}
@media (min-width: 992px) {
  .w-50-100 {
    width: var(--width-100) !important;
  }
}

.w-50-fit {
  width: var(--width-50) !important;
}
@media (min-width: 992px) {
  .w-50-fit {
    width: var(--width-fit) !important;
  }
}

.w-50-min {
  width: var(--width-50) !important;
}
@media (min-width: 992px) {
  .w-50-min {
    width: var(--width-min) !important;
  }
}

.w-50-max {
  width: var(--width-50) !important;
}
@media (min-width: 992px) {
  .w-50-max {
    width: var(--width-max) !important;
  }
}

.w-50-auto {
  width: var(--width-50) !important;
}
@media (min-width: 992px) {
  .w-50-auto {
    width: var(--width-auto) !important;
  }
}

.w-60-15 {
  width: var(--width-60) !important;
}
@media (min-width: 992px) {
  .w-60-15 {
    width: var(--width-15) !important;
  }
}

.w-60-20 {
  width: var(--width-60) !important;
}
@media (min-width: 992px) {
  .w-60-20 {
    width: var(--width-20) !important;
  }
}

.w-60-25 {
  width: var(--width-60) !important;
}
@media (min-width: 992px) {
  .w-60-25 {
    width: var(--width-25) !important;
  }
}

.w-60-30 {
  width: var(--width-60) !important;
}
@media (min-width: 992px) {
  .w-60-30 {
    width: var(--width-30) !important;
  }
}

.w-60-33 {
  width: var(--width-60) !important;
}
@media (min-width: 992px) {
  .w-60-33 {
    width: var(--width-33) !important;
  }
}

.w-60-40 {
  width: var(--width-60) !important;
}
@media (min-width: 992px) {
  .w-60-40 {
    width: var(--width-40) !important;
  }
}

.w-60-45 {
  width: var(--width-60) !important;
}
@media (min-width: 992px) {
  .w-60-45 {
    width: var(--width-45) !important;
  }
}

.w-60-50 {
  width: var(--width-60) !important;
}
@media (min-width: 992px) {
  .w-60-50 {
    width: var(--width-50) !important;
  }
}

.w-60-60 {
  width: var(--width-60) !important;
}
@media (min-width: 992px) {
  .w-60-60 {
    width: var(--width-60) !important;
  }
}

.w-60-66 {
  width: var(--width-60) !important;
}
@media (min-width: 992px) {
  .w-60-66 {
    width: var(--width-66) !important;
  }
}

.w-60-70 {
  width: var(--width-60) !important;
}
@media (min-width: 992px) {
  .w-60-70 {
    width: var(--width-70) !important;
  }
}

.w-60-75 {
  width: var(--width-60) !important;
}
@media (min-width: 992px) {
  .w-60-75 {
    width: var(--width-75) !important;
  }
}

.w-60-80 {
  width: var(--width-60) !important;
}
@media (min-width: 992px) {
  .w-60-80 {
    width: var(--width-80) !important;
  }
}

.w-60-85 {
  width: var(--width-60) !important;
}
@media (min-width: 992px) {
  .w-60-85 {
    width: var(--width-85) !important;
  }
}

.w-60-90 {
  width: var(--width-60) !important;
}
@media (min-width: 992px) {
  .w-60-90 {
    width: var(--width-90) !important;
  }
}

.w-60-100 {
  width: var(--width-60) !important;
}
@media (min-width: 992px) {
  .w-60-100 {
    width: var(--width-100) !important;
  }
}

.w-60-fit {
  width: var(--width-60) !important;
}
@media (min-width: 992px) {
  .w-60-fit {
    width: var(--width-fit) !important;
  }
}

.w-60-min {
  width: var(--width-60) !important;
}
@media (min-width: 992px) {
  .w-60-min {
    width: var(--width-min) !important;
  }
}

.w-60-max {
  width: var(--width-60) !important;
}
@media (min-width: 992px) {
  .w-60-max {
    width: var(--width-max) !important;
  }
}

.w-60-auto {
  width: var(--width-60) !important;
}
@media (min-width: 992px) {
  .w-60-auto {
    width: var(--width-auto) !important;
  }
}

.w-66-15 {
  width: var(--width-66) !important;
}
@media (min-width: 992px) {
  .w-66-15 {
    width: var(--width-15) !important;
  }
}

.w-66-20 {
  width: var(--width-66) !important;
}
@media (min-width: 992px) {
  .w-66-20 {
    width: var(--width-20) !important;
  }
}

.w-66-25 {
  width: var(--width-66) !important;
}
@media (min-width: 992px) {
  .w-66-25 {
    width: var(--width-25) !important;
  }
}

.w-66-30 {
  width: var(--width-66) !important;
}
@media (min-width: 992px) {
  .w-66-30 {
    width: var(--width-30) !important;
  }
}

.w-66-33 {
  width: var(--width-66) !important;
}
@media (min-width: 992px) {
  .w-66-33 {
    width: var(--width-33) !important;
  }
}

.w-66-40 {
  width: var(--width-66) !important;
}
@media (min-width: 992px) {
  .w-66-40 {
    width: var(--width-40) !important;
  }
}

.w-66-45 {
  width: var(--width-66) !important;
}
@media (min-width: 992px) {
  .w-66-45 {
    width: var(--width-45) !important;
  }
}

.w-66-50 {
  width: var(--width-66) !important;
}
@media (min-width: 992px) {
  .w-66-50 {
    width: var(--width-50) !important;
  }
}

.w-66-60 {
  width: var(--width-66) !important;
}
@media (min-width: 992px) {
  .w-66-60 {
    width: var(--width-60) !important;
  }
}

.w-66-66 {
  width: var(--width-66) !important;
}
@media (min-width: 992px) {
  .w-66-66 {
    width: var(--width-66) !important;
  }
}

.w-66-70 {
  width: var(--width-66) !important;
}
@media (min-width: 992px) {
  .w-66-70 {
    width: var(--width-70) !important;
  }
}

.w-66-75 {
  width: var(--width-66) !important;
}
@media (min-width: 992px) {
  .w-66-75 {
    width: var(--width-75) !important;
  }
}

.w-66-80 {
  width: var(--width-66) !important;
}
@media (min-width: 992px) {
  .w-66-80 {
    width: var(--width-80) !important;
  }
}

.w-66-85 {
  width: var(--width-66) !important;
}
@media (min-width: 992px) {
  .w-66-85 {
    width: var(--width-85) !important;
  }
}

.w-66-90 {
  width: var(--width-66) !important;
}
@media (min-width: 992px) {
  .w-66-90 {
    width: var(--width-90) !important;
  }
}

.w-66-100 {
  width: var(--width-66) !important;
}
@media (min-width: 992px) {
  .w-66-100 {
    width: var(--width-100) !important;
  }
}

.w-66-fit {
  width: var(--width-66) !important;
}
@media (min-width: 992px) {
  .w-66-fit {
    width: var(--width-fit) !important;
  }
}

.w-66-min {
  width: var(--width-66) !important;
}
@media (min-width: 992px) {
  .w-66-min {
    width: var(--width-min) !important;
  }
}

.w-66-max {
  width: var(--width-66) !important;
}
@media (min-width: 992px) {
  .w-66-max {
    width: var(--width-max) !important;
  }
}

.w-66-auto {
  width: var(--width-66) !important;
}
@media (min-width: 992px) {
  .w-66-auto {
    width: var(--width-auto) !important;
  }
}

.w-70-15 {
  width: var(--width-70) !important;
}
@media (min-width: 992px) {
  .w-70-15 {
    width: var(--width-15) !important;
  }
}

.w-70-20 {
  width: var(--width-70) !important;
}
@media (min-width: 992px) {
  .w-70-20 {
    width: var(--width-20) !important;
  }
}

.w-70-25 {
  width: var(--width-70) !important;
}
@media (min-width: 992px) {
  .w-70-25 {
    width: var(--width-25) !important;
  }
}

.w-70-30 {
  width: var(--width-70) !important;
}
@media (min-width: 992px) {
  .w-70-30 {
    width: var(--width-30) !important;
  }
}

.w-70-33 {
  width: var(--width-70) !important;
}
@media (min-width: 992px) {
  .w-70-33 {
    width: var(--width-33) !important;
  }
}

.w-70-40 {
  width: var(--width-70) !important;
}
@media (min-width: 992px) {
  .w-70-40 {
    width: var(--width-40) !important;
  }
}

.w-70-45 {
  width: var(--width-70) !important;
}
@media (min-width: 992px) {
  .w-70-45 {
    width: var(--width-45) !important;
  }
}

.w-70-50 {
  width: var(--width-70) !important;
}
@media (min-width: 992px) {
  .w-70-50 {
    width: var(--width-50) !important;
  }
}

.w-70-60 {
  width: var(--width-70) !important;
}
@media (min-width: 992px) {
  .w-70-60 {
    width: var(--width-60) !important;
  }
}

.w-70-66 {
  width: var(--width-70) !important;
}
@media (min-width: 992px) {
  .w-70-66 {
    width: var(--width-66) !important;
  }
}

.w-70-70 {
  width: var(--width-70) !important;
}
@media (min-width: 992px) {
  .w-70-70 {
    width: var(--width-70) !important;
  }
}

.w-70-75 {
  width: var(--width-70) !important;
}
@media (min-width: 992px) {
  .w-70-75 {
    width: var(--width-75) !important;
  }
}

.w-70-80 {
  width: var(--width-70) !important;
}
@media (min-width: 992px) {
  .w-70-80 {
    width: var(--width-80) !important;
  }
}

.w-70-85 {
  width: var(--width-70) !important;
}
@media (min-width: 992px) {
  .w-70-85 {
    width: var(--width-85) !important;
  }
}

.w-70-90 {
  width: var(--width-70) !important;
}
@media (min-width: 992px) {
  .w-70-90 {
    width: var(--width-90) !important;
  }
}

.w-70-100 {
  width: var(--width-70) !important;
}
@media (min-width: 992px) {
  .w-70-100 {
    width: var(--width-100) !important;
  }
}

.w-70-fit {
  width: var(--width-70) !important;
}
@media (min-width: 992px) {
  .w-70-fit {
    width: var(--width-fit) !important;
  }
}

.w-70-min {
  width: var(--width-70) !important;
}
@media (min-width: 992px) {
  .w-70-min {
    width: var(--width-min) !important;
  }
}

.w-70-max {
  width: var(--width-70) !important;
}
@media (min-width: 992px) {
  .w-70-max {
    width: var(--width-max) !important;
  }
}

.w-70-auto {
  width: var(--width-70) !important;
}
@media (min-width: 992px) {
  .w-70-auto {
    width: var(--width-auto) !important;
  }
}

.w-75-15 {
  width: var(--width-75) !important;
}
@media (min-width: 992px) {
  .w-75-15 {
    width: var(--width-15) !important;
  }
}

.w-75-20 {
  width: var(--width-75) !important;
}
@media (min-width: 992px) {
  .w-75-20 {
    width: var(--width-20) !important;
  }
}

.w-75-25 {
  width: var(--width-75) !important;
}
@media (min-width: 992px) {
  .w-75-25 {
    width: var(--width-25) !important;
  }
}

.w-75-30 {
  width: var(--width-75) !important;
}
@media (min-width: 992px) {
  .w-75-30 {
    width: var(--width-30) !important;
  }
}

.w-75-33 {
  width: var(--width-75) !important;
}
@media (min-width: 992px) {
  .w-75-33 {
    width: var(--width-33) !important;
  }
}

.w-75-40 {
  width: var(--width-75) !important;
}
@media (min-width: 992px) {
  .w-75-40 {
    width: var(--width-40) !important;
  }
}

.w-75-45 {
  width: var(--width-75) !important;
}
@media (min-width: 992px) {
  .w-75-45 {
    width: var(--width-45) !important;
  }
}

.w-75-50 {
  width: var(--width-75) !important;
}
@media (min-width: 992px) {
  .w-75-50 {
    width: var(--width-50) !important;
  }
}

.w-75-60 {
  width: var(--width-75) !important;
}
@media (min-width: 992px) {
  .w-75-60 {
    width: var(--width-60) !important;
  }
}

.w-75-66 {
  width: var(--width-75) !important;
}
@media (min-width: 992px) {
  .w-75-66 {
    width: var(--width-66) !important;
  }
}

.w-75-70 {
  width: var(--width-75) !important;
}
@media (min-width: 992px) {
  .w-75-70 {
    width: var(--width-70) !important;
  }
}

.w-75-75 {
  width: var(--width-75) !important;
}
@media (min-width: 992px) {
  .w-75-75 {
    width: var(--width-75) !important;
  }
}

.w-75-80 {
  width: var(--width-75) !important;
}
@media (min-width: 992px) {
  .w-75-80 {
    width: var(--width-80) !important;
  }
}

.w-75-85 {
  width: var(--width-75) !important;
}
@media (min-width: 992px) {
  .w-75-85 {
    width: var(--width-85) !important;
  }
}

.w-75-90 {
  width: var(--width-75) !important;
}
@media (min-width: 992px) {
  .w-75-90 {
    width: var(--width-90) !important;
  }
}

.w-75-100 {
  width: var(--width-75) !important;
}
@media (min-width: 992px) {
  .w-75-100 {
    width: var(--width-100) !important;
  }
}

.w-75-fit {
  width: var(--width-75) !important;
}
@media (min-width: 992px) {
  .w-75-fit {
    width: var(--width-fit) !important;
  }
}

.w-75-min {
  width: var(--width-75) !important;
}
@media (min-width: 992px) {
  .w-75-min {
    width: var(--width-min) !important;
  }
}

.w-75-max {
  width: var(--width-75) !important;
}
@media (min-width: 992px) {
  .w-75-max {
    width: var(--width-max) !important;
  }
}

.w-75-auto {
  width: var(--width-75) !important;
}
@media (min-width: 992px) {
  .w-75-auto {
    width: var(--width-auto) !important;
  }
}

.w-80-15 {
  width: var(--width-80) !important;
}
@media (min-width: 992px) {
  .w-80-15 {
    width: var(--width-15) !important;
  }
}

.w-80-20 {
  width: var(--width-80) !important;
}
@media (min-width: 992px) {
  .w-80-20 {
    width: var(--width-20) !important;
  }
}

.w-80-25 {
  width: var(--width-80) !important;
}
@media (min-width: 992px) {
  .w-80-25 {
    width: var(--width-25) !important;
  }
}

.w-80-30 {
  width: var(--width-80) !important;
}
@media (min-width: 992px) {
  .w-80-30 {
    width: var(--width-30) !important;
  }
}

.w-80-33 {
  width: var(--width-80) !important;
}
@media (min-width: 992px) {
  .w-80-33 {
    width: var(--width-33) !important;
  }
}

.w-80-40 {
  width: var(--width-80) !important;
}
@media (min-width: 992px) {
  .w-80-40 {
    width: var(--width-40) !important;
  }
}

.w-80-45 {
  width: var(--width-80) !important;
}
@media (min-width: 992px) {
  .w-80-45 {
    width: var(--width-45) !important;
  }
}

.w-80-50 {
  width: var(--width-80) !important;
}
@media (min-width: 992px) {
  .w-80-50 {
    width: var(--width-50) !important;
  }
}

.w-80-60 {
  width: var(--width-80) !important;
}
@media (min-width: 992px) {
  .w-80-60 {
    width: var(--width-60) !important;
  }
}

.w-80-66 {
  width: var(--width-80) !important;
}
@media (min-width: 992px) {
  .w-80-66 {
    width: var(--width-66) !important;
  }
}

.w-80-70 {
  width: var(--width-80) !important;
}
@media (min-width: 992px) {
  .w-80-70 {
    width: var(--width-70) !important;
  }
}

.w-80-75 {
  width: var(--width-80) !important;
}
@media (min-width: 992px) {
  .w-80-75 {
    width: var(--width-75) !important;
  }
}

.w-80-80 {
  width: var(--width-80) !important;
}
@media (min-width: 992px) {
  .w-80-80 {
    width: var(--width-80) !important;
  }
}

.w-80-85 {
  width: var(--width-80) !important;
}
@media (min-width: 992px) {
  .w-80-85 {
    width: var(--width-85) !important;
  }
}

.w-80-90 {
  width: var(--width-80) !important;
}
@media (min-width: 992px) {
  .w-80-90 {
    width: var(--width-90) !important;
  }
}

.w-80-100 {
  width: var(--width-80) !important;
}
@media (min-width: 992px) {
  .w-80-100 {
    width: var(--width-100) !important;
  }
}

.w-80-fit {
  width: var(--width-80) !important;
}
@media (min-width: 992px) {
  .w-80-fit {
    width: var(--width-fit) !important;
  }
}

.w-80-min {
  width: var(--width-80) !important;
}
@media (min-width: 992px) {
  .w-80-min {
    width: var(--width-min) !important;
  }
}

.w-80-max {
  width: var(--width-80) !important;
}
@media (min-width: 992px) {
  .w-80-max {
    width: var(--width-max) !important;
  }
}

.w-80-auto {
  width: var(--width-80) !important;
}
@media (min-width: 992px) {
  .w-80-auto {
    width: var(--width-auto) !important;
  }
}

.w-85-15 {
  width: var(--width-85) !important;
}
@media (min-width: 992px) {
  .w-85-15 {
    width: var(--width-15) !important;
  }
}

.w-85-20 {
  width: var(--width-85) !important;
}
@media (min-width: 992px) {
  .w-85-20 {
    width: var(--width-20) !important;
  }
}

.w-85-25 {
  width: var(--width-85) !important;
}
@media (min-width: 992px) {
  .w-85-25 {
    width: var(--width-25) !important;
  }
}

.w-85-30 {
  width: var(--width-85) !important;
}
@media (min-width: 992px) {
  .w-85-30 {
    width: var(--width-30) !important;
  }
}

.w-85-33 {
  width: var(--width-85) !important;
}
@media (min-width: 992px) {
  .w-85-33 {
    width: var(--width-33) !important;
  }
}

.w-85-40 {
  width: var(--width-85) !important;
}
@media (min-width: 992px) {
  .w-85-40 {
    width: var(--width-40) !important;
  }
}

.w-85-45 {
  width: var(--width-85) !important;
}
@media (min-width: 992px) {
  .w-85-45 {
    width: var(--width-45) !important;
  }
}

.w-85-50 {
  width: var(--width-85) !important;
}
@media (min-width: 992px) {
  .w-85-50 {
    width: var(--width-50) !important;
  }
}

.w-85-60 {
  width: var(--width-85) !important;
}
@media (min-width: 992px) {
  .w-85-60 {
    width: var(--width-60) !important;
  }
}

.w-85-66 {
  width: var(--width-85) !important;
}
@media (min-width: 992px) {
  .w-85-66 {
    width: var(--width-66) !important;
  }
}

.w-85-70 {
  width: var(--width-85) !important;
}
@media (min-width: 992px) {
  .w-85-70 {
    width: var(--width-70) !important;
  }
}

.w-85-75 {
  width: var(--width-85) !important;
}
@media (min-width: 992px) {
  .w-85-75 {
    width: var(--width-75) !important;
  }
}

.w-85-80 {
  width: var(--width-85) !important;
}
@media (min-width: 992px) {
  .w-85-80 {
    width: var(--width-80) !important;
  }
}

.w-85-85 {
  width: var(--width-85) !important;
}
@media (min-width: 992px) {
  .w-85-85 {
    width: var(--width-85) !important;
  }
}

.w-85-90 {
  width: var(--width-85) !important;
}
@media (min-width: 992px) {
  .w-85-90 {
    width: var(--width-90) !important;
  }
}

.w-85-100 {
  width: var(--width-85) !important;
}
@media (min-width: 992px) {
  .w-85-100 {
    width: var(--width-100) !important;
  }
}

.w-85-fit {
  width: var(--width-85) !important;
}
@media (min-width: 992px) {
  .w-85-fit {
    width: var(--width-fit) !important;
  }
}

.w-85-min {
  width: var(--width-85) !important;
}
@media (min-width: 992px) {
  .w-85-min {
    width: var(--width-min) !important;
  }
}

.w-85-max {
  width: var(--width-85) !important;
}
@media (min-width: 992px) {
  .w-85-max {
    width: var(--width-max) !important;
  }
}

.w-85-auto {
  width: var(--width-85) !important;
}
@media (min-width: 992px) {
  .w-85-auto {
    width: var(--width-auto) !important;
  }
}

.w-90-15 {
  width: var(--width-90) !important;
}
@media (min-width: 992px) {
  .w-90-15 {
    width: var(--width-15) !important;
  }
}

.w-90-20 {
  width: var(--width-90) !important;
}
@media (min-width: 992px) {
  .w-90-20 {
    width: var(--width-20) !important;
  }
}

.w-90-25 {
  width: var(--width-90) !important;
}
@media (min-width: 992px) {
  .w-90-25 {
    width: var(--width-25) !important;
  }
}

.w-90-30 {
  width: var(--width-90) !important;
}
@media (min-width: 992px) {
  .w-90-30 {
    width: var(--width-30) !important;
  }
}

.w-90-33 {
  width: var(--width-90) !important;
}
@media (min-width: 992px) {
  .w-90-33 {
    width: var(--width-33) !important;
  }
}

.w-90-40 {
  width: var(--width-90) !important;
}
@media (min-width: 992px) {
  .w-90-40 {
    width: var(--width-40) !important;
  }
}

.w-90-45 {
  width: var(--width-90) !important;
}
@media (min-width: 992px) {
  .w-90-45 {
    width: var(--width-45) !important;
  }
}

.w-90-50 {
  width: var(--width-90) !important;
}
@media (min-width: 992px) {
  .w-90-50 {
    width: var(--width-50) !important;
  }
}

.w-90-60 {
  width: var(--width-90) !important;
}
@media (min-width: 992px) {
  .w-90-60 {
    width: var(--width-60) !important;
  }
}

.w-90-66 {
  width: var(--width-90) !important;
}
@media (min-width: 992px) {
  .w-90-66 {
    width: var(--width-66) !important;
  }
}

.w-90-70 {
  width: var(--width-90) !important;
}
@media (min-width: 992px) {
  .w-90-70 {
    width: var(--width-70) !important;
  }
}

.w-90-75 {
  width: var(--width-90) !important;
}
@media (min-width: 992px) {
  .w-90-75 {
    width: var(--width-75) !important;
  }
}

.w-90-80 {
  width: var(--width-90) !important;
}
@media (min-width: 992px) {
  .w-90-80 {
    width: var(--width-80) !important;
  }
}

.w-90-85 {
  width: var(--width-90) !important;
}
@media (min-width: 992px) {
  .w-90-85 {
    width: var(--width-85) !important;
  }
}

.w-90-90 {
  width: var(--width-90) !important;
}
@media (min-width: 992px) {
  .w-90-90 {
    width: var(--width-90) !important;
  }
}

.w-90-100 {
  width: var(--width-90) !important;
}
@media (min-width: 992px) {
  .w-90-100 {
    width: var(--width-100) !important;
  }
}

.w-90-fit {
  width: var(--width-90) !important;
}
@media (min-width: 992px) {
  .w-90-fit {
    width: var(--width-fit) !important;
  }
}

.w-90-min {
  width: var(--width-90) !important;
}
@media (min-width: 992px) {
  .w-90-min {
    width: var(--width-min) !important;
  }
}

.w-90-max {
  width: var(--width-90) !important;
}
@media (min-width: 992px) {
  .w-90-max {
    width: var(--width-max) !important;
  }
}

.w-90-auto {
  width: var(--width-90) !important;
}
@media (min-width: 992px) {
  .w-90-auto {
    width: var(--width-auto) !important;
  }
}

.w-100-15 {
  width: var(--width-100) !important;
}
@media (min-width: 992px) {
  .w-100-15 {
    width: var(--width-15) !important;
  }
}

.w-100-20 {
  width: var(--width-100) !important;
}
@media (min-width: 992px) {
  .w-100-20 {
    width: var(--width-20) !important;
  }
}

.w-100-25 {
  width: var(--width-100) !important;
}
@media (min-width: 992px) {
  .w-100-25 {
    width: var(--width-25) !important;
  }
}

.w-100-30 {
  width: var(--width-100) !important;
}
@media (min-width: 992px) {
  .w-100-30 {
    width: var(--width-30) !important;
  }
}

.w-100-33 {
  width: var(--width-100) !important;
}
@media (min-width: 992px) {
  .w-100-33 {
    width: var(--width-33) !important;
  }
}

.w-100-40 {
  width: var(--width-100) !important;
}
@media (min-width: 992px) {
  .w-100-40 {
    width: var(--width-40) !important;
  }
}

.w-100-45 {
  width: var(--width-100) !important;
}
@media (min-width: 992px) {
  .w-100-45 {
    width: var(--width-45) !important;
  }
}

.w-100-50 {
  width: var(--width-100) !important;
}
@media (min-width: 992px) {
  .w-100-50 {
    width: var(--width-50) !important;
  }
}

.w-100-60 {
  width: var(--width-100) !important;
}
@media (min-width: 992px) {
  .w-100-60 {
    width: var(--width-60) !important;
  }
}

.w-100-66 {
  width: var(--width-100) !important;
}
@media (min-width: 992px) {
  .w-100-66 {
    width: var(--width-66) !important;
  }
}

.w-100-70 {
  width: var(--width-100) !important;
}
@media (min-width: 992px) {
  .w-100-70 {
    width: var(--width-70) !important;
  }
}

.w-100-75 {
  width: var(--width-100) !important;
}
@media (min-width: 992px) {
  .w-100-75 {
    width: var(--width-75) !important;
  }
}

.w-100-80 {
  width: var(--width-100) !important;
}
@media (min-width: 992px) {
  .w-100-80 {
    width: var(--width-80) !important;
  }
}

.w-100-85 {
  width: var(--width-100) !important;
}
@media (min-width: 992px) {
  .w-100-85 {
    width: var(--width-85) !important;
  }
}

.w-100-90 {
  width: var(--width-100) !important;
}
@media (min-width: 992px) {
  .w-100-90 {
    width: var(--width-90) !important;
  }
}

.w-100-100 {
  width: var(--width-100) !important;
}
@media (min-width: 992px) {
  .w-100-100 {
    width: var(--width-100) !important;
  }
}

.w-100-fit {
  width: var(--width-100) !important;
}
@media (min-width: 992px) {
  .w-100-fit {
    width: var(--width-fit) !important;
  }
}

.w-100-min {
  width: var(--width-100) !important;
}
@media (min-width: 992px) {
  .w-100-min {
    width: var(--width-min) !important;
  }
}

.w-100-max {
  width: var(--width-100) !important;
}
@media (min-width: 992px) {
  .w-100-max {
    width: var(--width-max) !important;
  }
}

.w-100-auto {
  width: var(--width-100) !important;
}
@media (min-width: 992px) {
  .w-100-auto {
    width: var(--width-auto) !important;
  }
}

.w-fit-15 {
  width: var(--width-fit) !important;
}
@media (min-width: 992px) {
  .w-fit-15 {
    width: var(--width-15) !important;
  }
}

.w-fit-20 {
  width: var(--width-fit) !important;
}
@media (min-width: 992px) {
  .w-fit-20 {
    width: var(--width-20) !important;
  }
}

.w-fit-25 {
  width: var(--width-fit) !important;
}
@media (min-width: 992px) {
  .w-fit-25 {
    width: var(--width-25) !important;
  }
}

.w-fit-30 {
  width: var(--width-fit) !important;
}
@media (min-width: 992px) {
  .w-fit-30 {
    width: var(--width-30) !important;
  }
}

.w-fit-33 {
  width: var(--width-fit) !important;
}
@media (min-width: 992px) {
  .w-fit-33 {
    width: var(--width-33) !important;
  }
}

.w-fit-40 {
  width: var(--width-fit) !important;
}
@media (min-width: 992px) {
  .w-fit-40 {
    width: var(--width-40) !important;
  }
}

.w-fit-45 {
  width: var(--width-fit) !important;
}
@media (min-width: 992px) {
  .w-fit-45 {
    width: var(--width-45) !important;
  }
}

.w-fit-50 {
  width: var(--width-fit) !important;
}
@media (min-width: 992px) {
  .w-fit-50 {
    width: var(--width-50) !important;
  }
}

.w-fit-60 {
  width: var(--width-fit) !important;
}
@media (min-width: 992px) {
  .w-fit-60 {
    width: var(--width-60) !important;
  }
}

.w-fit-66 {
  width: var(--width-fit) !important;
}
@media (min-width: 992px) {
  .w-fit-66 {
    width: var(--width-66) !important;
  }
}

.w-fit-70 {
  width: var(--width-fit) !important;
}
@media (min-width: 992px) {
  .w-fit-70 {
    width: var(--width-70) !important;
  }
}

.w-fit-75 {
  width: var(--width-fit) !important;
}
@media (min-width: 992px) {
  .w-fit-75 {
    width: var(--width-75) !important;
  }
}

.w-fit-80 {
  width: var(--width-fit) !important;
}
@media (min-width: 992px) {
  .w-fit-80 {
    width: var(--width-80) !important;
  }
}

.w-fit-85 {
  width: var(--width-fit) !important;
}
@media (min-width: 992px) {
  .w-fit-85 {
    width: var(--width-85) !important;
  }
}

.w-fit-90 {
  width: var(--width-fit) !important;
}
@media (min-width: 992px) {
  .w-fit-90 {
    width: var(--width-90) !important;
  }
}

.w-fit-100 {
  width: var(--width-fit) !important;
}
@media (min-width: 992px) {
  .w-fit-100 {
    width: var(--width-100) !important;
  }
}

.w-fit-fit {
  width: var(--width-fit) !important;
}
@media (min-width: 992px) {
  .w-fit-fit {
    width: var(--width-fit) !important;
  }
}

.w-fit-min {
  width: var(--width-fit) !important;
}
@media (min-width: 992px) {
  .w-fit-min {
    width: var(--width-min) !important;
  }
}

.w-fit-max {
  width: var(--width-fit) !important;
}
@media (min-width: 992px) {
  .w-fit-max {
    width: var(--width-max) !important;
  }
}

.w-fit-auto {
  width: var(--width-fit) !important;
}
@media (min-width: 992px) {
  .w-fit-auto {
    width: var(--width-auto) !important;
  }
}

.w-min-15 {
  width: var(--width-min) !important;
}
@media (min-width: 992px) {
  .w-min-15 {
    width: var(--width-15) !important;
  }
}

.w-min-20 {
  width: var(--width-min) !important;
}
@media (min-width: 992px) {
  .w-min-20 {
    width: var(--width-20) !important;
  }
}

.w-min-25 {
  width: var(--width-min) !important;
}
@media (min-width: 992px) {
  .w-min-25 {
    width: var(--width-25) !important;
  }
}

.w-min-30 {
  width: var(--width-min) !important;
}
@media (min-width: 992px) {
  .w-min-30 {
    width: var(--width-30) !important;
  }
}

.w-min-33 {
  width: var(--width-min) !important;
}
@media (min-width: 992px) {
  .w-min-33 {
    width: var(--width-33) !important;
  }
}

.w-min-40 {
  width: var(--width-min) !important;
}
@media (min-width: 992px) {
  .w-min-40 {
    width: var(--width-40) !important;
  }
}

.w-min-45 {
  width: var(--width-min) !important;
}
@media (min-width: 992px) {
  .w-min-45 {
    width: var(--width-45) !important;
  }
}

.w-min-50 {
  width: var(--width-min) !important;
}
@media (min-width: 992px) {
  .w-min-50 {
    width: var(--width-50) !important;
  }
}

.w-min-60 {
  width: var(--width-min) !important;
}
@media (min-width: 992px) {
  .w-min-60 {
    width: var(--width-60) !important;
  }
}

.w-min-66 {
  width: var(--width-min) !important;
}
@media (min-width: 992px) {
  .w-min-66 {
    width: var(--width-66) !important;
  }
}

.w-min-70 {
  width: var(--width-min) !important;
}
@media (min-width: 992px) {
  .w-min-70 {
    width: var(--width-70) !important;
  }
}

.w-min-75 {
  width: var(--width-min) !important;
}
@media (min-width: 992px) {
  .w-min-75 {
    width: var(--width-75) !important;
  }
}

.w-min-80 {
  width: var(--width-min) !important;
}
@media (min-width: 992px) {
  .w-min-80 {
    width: var(--width-80) !important;
  }
}

.w-min-85 {
  width: var(--width-min) !important;
}
@media (min-width: 992px) {
  .w-min-85 {
    width: var(--width-85) !important;
  }
}

.w-min-90 {
  width: var(--width-min) !important;
}
@media (min-width: 992px) {
  .w-min-90 {
    width: var(--width-90) !important;
  }
}

.w-min-100 {
  width: var(--width-min) !important;
}
@media (min-width: 992px) {
  .w-min-100 {
    width: var(--width-100) !important;
  }
}

.w-min-fit {
  width: var(--width-min) !important;
}
@media (min-width: 992px) {
  .w-min-fit {
    width: var(--width-fit) !important;
  }
}

.w-min-min {
  width: var(--width-min) !important;
}
@media (min-width: 992px) {
  .w-min-min {
    width: var(--width-min) !important;
  }
}

.w-min-max {
  width: var(--width-min) !important;
}
@media (min-width: 992px) {
  .w-min-max {
    width: var(--width-max) !important;
  }
}

.w-min-auto {
  width: var(--width-min) !important;
}
@media (min-width: 992px) {
  .w-min-auto {
    width: var(--width-auto) !important;
  }
}

.w-max-15 {
  width: var(--width-max) !important;
}
@media (min-width: 992px) {
  .w-max-15 {
    width: var(--width-15) !important;
  }
}

.w-max-20 {
  width: var(--width-max) !important;
}
@media (min-width: 992px) {
  .w-max-20 {
    width: var(--width-20) !important;
  }
}

.w-max-25 {
  width: var(--width-max) !important;
}
@media (min-width: 992px) {
  .w-max-25 {
    width: var(--width-25) !important;
  }
}

.w-max-30 {
  width: var(--width-max) !important;
}
@media (min-width: 992px) {
  .w-max-30 {
    width: var(--width-30) !important;
  }
}

.w-max-33 {
  width: var(--width-max) !important;
}
@media (min-width: 992px) {
  .w-max-33 {
    width: var(--width-33) !important;
  }
}

.w-max-40 {
  width: var(--width-max) !important;
}
@media (min-width: 992px) {
  .w-max-40 {
    width: var(--width-40) !important;
  }
}

.w-max-45 {
  width: var(--width-max) !important;
}
@media (min-width: 992px) {
  .w-max-45 {
    width: var(--width-45) !important;
  }
}

.w-max-50 {
  width: var(--width-max) !important;
}
@media (min-width: 992px) {
  .w-max-50 {
    width: var(--width-50) !important;
  }
}

.w-max-60 {
  width: var(--width-max) !important;
}
@media (min-width: 992px) {
  .w-max-60 {
    width: var(--width-60) !important;
  }
}

.w-max-66 {
  width: var(--width-max) !important;
}
@media (min-width: 992px) {
  .w-max-66 {
    width: var(--width-66) !important;
  }
}

.w-max-70 {
  width: var(--width-max) !important;
}
@media (min-width: 992px) {
  .w-max-70 {
    width: var(--width-70) !important;
  }
}

.w-max-75 {
  width: var(--width-max) !important;
}
@media (min-width: 992px) {
  .w-max-75 {
    width: var(--width-75) !important;
  }
}

.w-max-80 {
  width: var(--width-max) !important;
}
@media (min-width: 992px) {
  .w-max-80 {
    width: var(--width-80) !important;
  }
}

.w-max-85 {
  width: var(--width-max) !important;
}
@media (min-width: 992px) {
  .w-max-85 {
    width: var(--width-85) !important;
  }
}

.w-max-90 {
  width: var(--width-max) !important;
}
@media (min-width: 992px) {
  .w-max-90 {
    width: var(--width-90) !important;
  }
}

.w-max-100 {
  width: var(--width-max) !important;
}
@media (min-width: 992px) {
  .w-max-100 {
    width: var(--width-100) !important;
  }
}

.w-max-fit {
  width: var(--width-max) !important;
}
@media (min-width: 992px) {
  .w-max-fit {
    width: var(--width-fit) !important;
  }
}

.w-max-min {
  width: var(--width-max) !important;
}
@media (min-width: 992px) {
  .w-max-min {
    width: var(--width-min) !important;
  }
}

.w-max-max {
  width: var(--width-max) !important;
}
@media (min-width: 992px) {
  .w-max-max {
    width: var(--width-max) !important;
  }
}

.w-max-auto {
  width: var(--width-max) !important;
}
@media (min-width: 992px) {
  .w-max-auto {
    width: var(--width-auto) !important;
  }
}

.w-auto-15 {
  width: var(--width-auto) !important;
}
@media (min-width: 992px) {
  .w-auto-15 {
    width: var(--width-15) !important;
  }
}

.w-auto-20 {
  width: var(--width-auto) !important;
}
@media (min-width: 992px) {
  .w-auto-20 {
    width: var(--width-20) !important;
  }
}

.w-auto-25 {
  width: var(--width-auto) !important;
}
@media (min-width: 992px) {
  .w-auto-25 {
    width: var(--width-25) !important;
  }
}

.w-auto-30 {
  width: var(--width-auto) !important;
}
@media (min-width: 992px) {
  .w-auto-30 {
    width: var(--width-30) !important;
  }
}

.w-auto-33 {
  width: var(--width-auto) !important;
}
@media (min-width: 992px) {
  .w-auto-33 {
    width: var(--width-33) !important;
  }
}

.w-auto-40 {
  width: var(--width-auto) !important;
}
@media (min-width: 992px) {
  .w-auto-40 {
    width: var(--width-40) !important;
  }
}

.w-auto-45 {
  width: var(--width-auto) !important;
}
@media (min-width: 992px) {
  .w-auto-45 {
    width: var(--width-45) !important;
  }
}

.w-auto-50 {
  width: var(--width-auto) !important;
}
@media (min-width: 992px) {
  .w-auto-50 {
    width: var(--width-50) !important;
  }
}

.w-auto-60 {
  width: var(--width-auto) !important;
}
@media (min-width: 992px) {
  .w-auto-60 {
    width: var(--width-60) !important;
  }
}

.w-auto-66 {
  width: var(--width-auto) !important;
}
@media (min-width: 992px) {
  .w-auto-66 {
    width: var(--width-66) !important;
  }
}

.w-auto-70 {
  width: var(--width-auto) !important;
}
@media (min-width: 992px) {
  .w-auto-70 {
    width: var(--width-70) !important;
  }
}

.w-auto-75 {
  width: var(--width-auto) !important;
}
@media (min-width: 992px) {
  .w-auto-75 {
    width: var(--width-75) !important;
  }
}

.w-auto-80 {
  width: var(--width-auto) !important;
}
@media (min-width: 992px) {
  .w-auto-80 {
    width: var(--width-80) !important;
  }
}

.w-auto-85 {
  width: var(--width-auto) !important;
}
@media (min-width: 992px) {
  .w-auto-85 {
    width: var(--width-85) !important;
  }
}

.w-auto-90 {
  width: var(--width-auto) !important;
}
@media (min-width: 992px) {
  .w-auto-90 {
    width: var(--width-90) !important;
  }
}

.w-auto-100 {
  width: var(--width-auto) !important;
}
@media (min-width: 992px) {
  .w-auto-100 {
    width: var(--width-100) !important;
  }
}

.w-auto-fit {
  width: var(--width-auto) !important;
}
@media (min-width: 992px) {
  .w-auto-fit {
    width: var(--width-fit) !important;
  }
}

.w-auto-min {
  width: var(--width-auto) !important;
}
@media (min-width: 992px) {
  .w-auto-min {
    width: var(--width-min) !important;
  }
}

.w-auto-max {
  width: var(--width-auto) !important;
}
@media (min-width: 992px) {
  .w-auto-max {
    width: var(--width-max) !important;
  }
}

.w-auto-auto {
  width: var(--width-auto) !important;
}
@media (min-width: 992px) {
  .w-auto-auto {
    width: var(--width-auto) !important;
  }
}

.p-auto {
  padding: auto !important;
}

.pt-auto {
  padding-top: auto !important;
}

.pb-auto {
  padding-bottom: auto !important;
}

.pr-auto {
  padding-right: auto !important;
}

.pl-auto {
  padding-left: auto !important;
}

.p-block-auto {
  padding-block: auto !important;
}

.p-inline-auto {
  padding-inline: auto !important;
}

@media (min-width: 992px) {
  .lg-pt-auto {
    padding-top: auto !important;
  }
}

.sm-pb-auto {
  padding-bottom: auto !important;
}
@media (min-width: 992px) {
  .sm-pb-auto {
    padding-bottom: auto !important;
  }
}

.sm-pt-auto {
  padding-top: auto !important;
}
@media (min-width: 992px) {
  .sm-pt-auto {
    padding-top: auto !important;
  }
}

.m-auto {
  margin: auto !important;
}

.mb-auto {
  margin-bottom: auto !important;
}

.mt-auto {
  margin-top: auto !important;
}

.ml-auto {
  margin-left: auto !important;
}

.m-block-auto {
  margin-block: auto !important;
}

.m-inline-auto {
  margin-inline: auto !important;
}

.gap-auto {
  gap: auto;
}

.gap-sm-name {
  gap: auto;
}
@media (min-width: 992px) {
  .gap-sm-name {
    gap: var(--spacing-0);
  }
}

@media (min-width: 992px) {
  .gap-lg-name {
    gap: auto;
  }
}

.br-auto {
  border-radius: auto;
}

.br-right-auto {
  border-radius: 0 auto auto 0;
}

.br-left-auto {
  border-radius: auto 0 0 auto;
}

.br-top-auto {
  border-radius: auto auto 0 0;
}

.br-bottom-auto {
  border-radius: 0 0 auto auto;
}

@media (min-width: 992px) {
  .lg-br-right-auto {
    border-radius: 0 auto auto 0;
  }
}

@media (min-width: 992px) {
  .lg-br-left-auto {
    border-radius: auto 0 0 auto;
  }
}

@media (min-width: 992px) {
  .lg-br-top-auto {
    border-radius: auto auto 0 0;
  }
}

@media (min-width: 992px) {
  .lg-br-bottom-auto {
    border-radius: 0 0 auto auto;
  }
}

.p-0 {
  padding: var(--spacing-0) !important;
}

.pt-0 {
  padding-top: var(--spacing-0) !important;
}

.pb-0 {
  padding-bottom: var(--spacing-0) !important;
}

.pr-0 {
  padding-right: var(--spacing-0) !important;
}

.pl-0 {
  padding-left: var(--spacing-0) !important;
}

.p-block-0 {
  padding-block: var(--spacing-0) !important;
}

.p-inline-0 {
  padding-inline: var(--spacing-0) !important;
}

@media (min-width: 992px) {
  .lg-pt-0 {
    padding-top: var(--spacing-0) !important;
  }
}

.sm-pb-0 {
  padding-bottom: var(--spacing-0) !important;
}
@media (min-width: 992px) {
  .sm-pb-0 {
    padding-bottom: var(--spacing-0) !important;
  }
}

.sm-pt-0 {
  padding-top: var(--spacing-0) !important;
}
@media (min-width: 992px) {
  .sm-pt-0 {
    padding-top: var(--spacing-0) !important;
  }
}

.m-0 {
  margin: var(--spacing-0) !important;
}

.mb-0 {
  margin-bottom: var(--spacing-0) !important;
}

.mt-0 {
  margin-top: var(--spacing-0) !important;
}

.ml-0 {
  margin-left: var(--spacing-0) !important;
}

.m-block-0 {
  margin-block: var(--spacing-0) !important;
}

.m-inline-0 {
  margin-inline: var(--spacing-0) !important;
}

.gap-0 {
  gap: var(--spacing-0);
}

.gap-sm-name {
  gap: var(--spacing-0);
}
@media (min-width: 992px) {
  .gap-sm-name {
    gap: var(--spacing-0);
  }
}

@media (min-width: 992px) {
  .gap-lg-name {
    gap: var(--spacing-0);
  }
}

.br-0 {
  border-radius: var(--spacing-0);
}

.br-right-0 {
  border-radius: 0 var(--spacing-0) var(--spacing-0) 0;
}

.br-left-0 {
  border-radius: var(--spacing-0) 0 0 var(--spacing-0);
}

.br-top-0 {
  border-radius: var(--spacing-0) var(--spacing-0) 0 0;
}

.br-bottom-0 {
  border-radius: 0 0 var(--spacing-0) var(--spacing-0);
}

@media (min-width: 992px) {
  .lg-br-right-0 {
    border-radius: 0 var(--spacing-0) var(--spacing-0) 0;
  }
}

@media (min-width: 992px) {
  .lg-br-left-0 {
    border-radius: var(--spacing-0) 0 0 var(--spacing-0);
  }
}

@media (min-width: 992px) {
  .lg-br-top-0 {
    border-radius: var(--spacing-0) var(--spacing-0) 0 0;
  }
}

@media (min-width: 992px) {
  .lg-br-bottom-0 {
    border-radius: 0 0 var(--spacing-0) var(--spacing-0);
  }
}

.p-1 {
  padding: var(--spacing-1) !important;
}

.pt-1 {
  padding-top: var(--spacing-1) !important;
}

.pb-1 {
  padding-bottom: var(--spacing-1) !important;
}

.pr-1 {
  padding-right: var(--spacing-1) !important;
}

.pl-1 {
  padding-left: var(--spacing-1) !important;
}

.p-block-1 {
  padding-block: var(--spacing-1) !important;
}

.p-inline-1 {
  padding-inline: var(--spacing-1) !important;
}

@media (min-width: 992px) {
  .lg-pt-1 {
    padding-top: var(--spacing-1) !important;
  }
}

.sm-pb-1 {
  padding-bottom: var(--spacing-1) !important;
}
@media (min-width: 992px) {
  .sm-pb-1 {
    padding-bottom: var(--spacing-1) !important;
  }
}

.sm-pt-1 {
  padding-top: var(--spacing-1) !important;
}
@media (min-width: 992px) {
  .sm-pt-1 {
    padding-top: var(--spacing-1) !important;
  }
}

.m-1 {
  margin: var(--spacing-1) !important;
}

.mb-1 {
  margin-bottom: var(--spacing-1) !important;
}

.mt-1 {
  margin-top: var(--spacing-1) !important;
}

.ml-1 {
  margin-left: var(--spacing-1) !important;
}

.m-block-1 {
  margin-block: var(--spacing-1) !important;
}

.m-inline-1 {
  margin-inline: var(--spacing-1) !important;
}

.gap-1 {
  gap: var(--spacing-1);
}

.gap-sm-name {
  gap: var(--spacing-1);
}
@media (min-width: 992px) {
  .gap-sm-name {
    gap: var(--spacing-0);
  }
}

@media (min-width: 992px) {
  .gap-lg-name {
    gap: var(--spacing-1);
  }
}

.br-1 {
  border-radius: var(--spacing-1);
}

.br-right-1 {
  border-radius: 0 var(--spacing-1) var(--spacing-1) 0;
}

.br-left-1 {
  border-radius: var(--spacing-1) 0 0 var(--spacing-1);
}

.br-top-1 {
  border-radius: var(--spacing-1) var(--spacing-1) 0 0;
}

.br-bottom-1 {
  border-radius: 0 0 var(--spacing-1) var(--spacing-1);
}

@media (min-width: 992px) {
  .lg-br-right-1 {
    border-radius: 0 var(--spacing-1) var(--spacing-1) 0;
  }
}

@media (min-width: 992px) {
  .lg-br-left-1 {
    border-radius: var(--spacing-1) 0 0 var(--spacing-1);
  }
}

@media (min-width: 992px) {
  .lg-br-top-1 {
    border-radius: var(--spacing-1) var(--spacing-1) 0 0;
  }
}

@media (min-width: 992px) {
  .lg-br-bottom-1 {
    border-radius: 0 0 var(--spacing-1) var(--spacing-1);
  }
}

.p-2 {
  padding: var(--spacing-2) !important;
}

.pt-2 {
  padding-top: var(--spacing-2) !important;
}

.pb-2 {
  padding-bottom: var(--spacing-2) !important;
}

.pr-2 {
  padding-right: var(--spacing-2) !important;
}

.pl-2 {
  padding-left: var(--spacing-2) !important;
}

.p-block-2 {
  padding-block: var(--spacing-2) !important;
}

.p-inline-2 {
  padding-inline: var(--spacing-2) !important;
}

@media (min-width: 992px) {
  .lg-pt-2 {
    padding-top: var(--spacing-2) !important;
  }
}

.sm-pb-2 {
  padding-bottom: var(--spacing-2) !important;
}
@media (min-width: 992px) {
  .sm-pb-2 {
    padding-bottom: var(--spacing-2) !important;
  }
}

.sm-pt-2 {
  padding-top: var(--spacing-2) !important;
}
@media (min-width: 992px) {
  .sm-pt-2 {
    padding-top: var(--spacing-2) !important;
  }
}

.m-2 {
  margin: var(--spacing-2) !important;
}

.mb-2 {
  margin-bottom: var(--spacing-2) !important;
}

.mt-2 {
  margin-top: var(--spacing-2) !important;
}

.ml-2 {
  margin-left: var(--spacing-2) !important;
}

.m-block-2 {
  margin-block: var(--spacing-2) !important;
}

.m-inline-2 {
  margin-inline: var(--spacing-2) !important;
}

.gap-2 {
  gap: var(--spacing-2);
}

.gap-sm-name {
  gap: var(--spacing-2);
}
@media (min-width: 992px) {
  .gap-sm-name {
    gap: var(--spacing-0);
  }
}

@media (min-width: 992px) {
  .gap-lg-name {
    gap: var(--spacing-2);
  }
}

.br-2 {
  border-radius: var(--spacing-2);
}

.br-right-2 {
  border-radius: 0 var(--spacing-2) var(--spacing-2) 0;
}

.br-left-2 {
  border-radius: var(--spacing-2) 0 0 var(--spacing-2);
}

.br-top-2 {
  border-radius: var(--spacing-2) var(--spacing-2) 0 0;
}

.br-bottom-2 {
  border-radius: 0 0 var(--spacing-2) var(--spacing-2);
}

@media (min-width: 992px) {
  .lg-br-right-2 {
    border-radius: 0 var(--spacing-2) var(--spacing-2) 0;
  }
}

@media (min-width: 992px) {
  .lg-br-left-2 {
    border-radius: var(--spacing-2) 0 0 var(--spacing-2);
  }
}

@media (min-width: 992px) {
  .lg-br-top-2 {
    border-radius: var(--spacing-2) var(--spacing-2) 0 0;
  }
}

@media (min-width: 992px) {
  .lg-br-bottom-2 {
    border-radius: 0 0 var(--spacing-2) var(--spacing-2);
  }
}

.p-25 {
  padding: var(--spacing-25) !important;
}

.pt-25 {
  padding-top: var(--spacing-25) !important;
}

.pb-25 {
  padding-bottom: var(--spacing-25) !important;
}

.pr-25 {
  padding-right: var(--spacing-25) !important;
}

.pl-25 {
  padding-left: var(--spacing-25) !important;
}

.p-block-25 {
  padding-block: var(--spacing-25) !important;
}

.p-inline-25 {
  padding-inline: var(--spacing-25) !important;
}

@media (min-width: 992px) {
  .lg-pt-25 {
    padding-top: var(--spacing-25) !important;
  }
}

.sm-pb-25 {
  padding-bottom: var(--spacing-25) !important;
}
@media (min-width: 992px) {
  .sm-pb-25 {
    padding-bottom: var(--spacing-25) !important;
  }
}

.sm-pt-25 {
  padding-top: var(--spacing-25) !important;
}
@media (min-width: 992px) {
  .sm-pt-25 {
    padding-top: var(--spacing-25) !important;
  }
}

.m-25 {
  margin: var(--spacing-25) !important;
}

.mb-25 {
  margin-bottom: var(--spacing-25) !important;
}

.mt-25 {
  margin-top: var(--spacing-25) !important;
}

.ml-25 {
  margin-left: var(--spacing-25) !important;
}

.m-block-25 {
  margin-block: var(--spacing-25) !important;
}

.m-inline-25 {
  margin-inline: var(--spacing-25) !important;
}

.gap-25 {
  gap: var(--spacing-25);
}

.gap-sm-name {
  gap: var(--spacing-25);
}
@media (min-width: 992px) {
  .gap-sm-name {
    gap: var(--spacing-0);
  }
}

@media (min-width: 992px) {
  .gap-lg-name {
    gap: var(--spacing-25);
  }
}

.br-25 {
  border-radius: var(--spacing-25);
}

.br-right-25 {
  border-radius: 0 var(--spacing-25) var(--spacing-25) 0;
}

.br-left-25 {
  border-radius: var(--spacing-25) 0 0 var(--spacing-25);
}

.br-top-25 {
  border-radius: var(--spacing-25) var(--spacing-25) 0 0;
}

.br-bottom-25 {
  border-radius: 0 0 var(--spacing-25) var(--spacing-25);
}

@media (min-width: 992px) {
  .lg-br-right-25 {
    border-radius: 0 var(--spacing-25) var(--spacing-25) 0;
  }
}

@media (min-width: 992px) {
  .lg-br-left-25 {
    border-radius: var(--spacing-25) 0 0 var(--spacing-25);
  }
}

@media (min-width: 992px) {
  .lg-br-top-25 {
    border-radius: var(--spacing-25) var(--spacing-25) 0 0;
  }
}

@media (min-width: 992px) {
  .lg-br-bottom-25 {
    border-radius: 0 0 var(--spacing-25) var(--spacing-25);
  }
}

.p-3 {
  padding: var(--spacing-3) !important;
}

.pt-3 {
  padding-top: var(--spacing-3) !important;
}

.pb-3 {
  padding-bottom: var(--spacing-3) !important;
}

.pr-3 {
  padding-right: var(--spacing-3) !important;
}

.pl-3 {
  padding-left: var(--spacing-3) !important;
}

.p-block-3 {
  padding-block: var(--spacing-3) !important;
}

.p-inline-3 {
  padding-inline: var(--spacing-3) !important;
}

@media (min-width: 992px) {
  .lg-pt-3 {
    padding-top: var(--spacing-3) !important;
  }
}

.sm-pb-3 {
  padding-bottom: var(--spacing-3) !important;
}
@media (min-width: 992px) {
  .sm-pb-3 {
    padding-bottom: var(--spacing-3) !important;
  }
}

.sm-pt-3 {
  padding-top: var(--spacing-3) !important;
}
@media (min-width: 992px) {
  .sm-pt-3 {
    padding-top: var(--spacing-3) !important;
  }
}

.m-3 {
  margin: var(--spacing-3) !important;
}

.mb-3 {
  margin-bottom: var(--spacing-3) !important;
}

.mt-3 {
  margin-top: var(--spacing-3) !important;
}

.ml-3 {
  margin-left: var(--spacing-3) !important;
}

.m-block-3 {
  margin-block: var(--spacing-3) !important;
}

.m-inline-3 {
  margin-inline: var(--spacing-3) !important;
}

.gap-3 {
  gap: var(--spacing-3);
}

.gap-sm-name {
  gap: var(--spacing-3);
}
@media (min-width: 992px) {
  .gap-sm-name {
    gap: var(--spacing-0);
  }
}

@media (min-width: 992px) {
  .gap-lg-name {
    gap: var(--spacing-3);
  }
}

.br-3 {
  border-radius: var(--spacing-3);
}

.br-right-3 {
  border-radius: 0 var(--spacing-3) var(--spacing-3) 0;
}

.br-left-3 {
  border-radius: var(--spacing-3) 0 0 var(--spacing-3);
}

.br-top-3 {
  border-radius: var(--spacing-3) var(--spacing-3) 0 0;
}

.br-bottom-3 {
  border-radius: 0 0 var(--spacing-3) var(--spacing-3);
}

@media (min-width: 992px) {
  .lg-br-right-3 {
    border-radius: 0 var(--spacing-3) var(--spacing-3) 0;
  }
}

@media (min-width: 992px) {
  .lg-br-left-3 {
    border-radius: var(--spacing-3) 0 0 var(--spacing-3);
  }
}

@media (min-width: 992px) {
  .lg-br-top-3 {
    border-radius: var(--spacing-3) var(--spacing-3) 0 0;
  }
}

@media (min-width: 992px) {
  .lg-br-bottom-3 {
    border-radius: 0 0 var(--spacing-3) var(--spacing-3);
  }
}

.p-35 {
  padding: var(--spacing-35) !important;
}

.pt-35 {
  padding-top: var(--spacing-35) !important;
}

.pb-35 {
  padding-bottom: var(--spacing-35) !important;
}

.pr-35 {
  padding-right: var(--spacing-35) !important;
}

.pl-35 {
  padding-left: var(--spacing-35) !important;
}

.p-block-35 {
  padding-block: var(--spacing-35) !important;
}

.p-inline-35 {
  padding-inline: var(--spacing-35) !important;
}

@media (min-width: 992px) {
  .lg-pt-35 {
    padding-top: var(--spacing-35) !important;
  }
}

.sm-pb-35 {
  padding-bottom: var(--spacing-35) !important;
}
@media (min-width: 992px) {
  .sm-pb-35 {
    padding-bottom: var(--spacing-35) !important;
  }
}

.sm-pt-35 {
  padding-top: var(--spacing-35) !important;
}
@media (min-width: 992px) {
  .sm-pt-35 {
    padding-top: var(--spacing-35) !important;
  }
}

.m-35 {
  margin: var(--spacing-35) !important;
}

.mb-35 {
  margin-bottom: var(--spacing-35) !important;
}

.mt-35 {
  margin-top: var(--spacing-35) !important;
}

.ml-35 {
  margin-left: var(--spacing-35) !important;
}

.m-block-35 {
  margin-block: var(--spacing-35) !important;
}

.m-inline-35 {
  margin-inline: var(--spacing-35) !important;
}

.gap-35 {
  gap: var(--spacing-35);
}

.gap-sm-name {
  gap: var(--spacing-35);
}
@media (min-width: 992px) {
  .gap-sm-name {
    gap: var(--spacing-0);
  }
}

@media (min-width: 992px) {
  .gap-lg-name {
    gap: var(--spacing-35);
  }
}

.br-35 {
  border-radius: var(--spacing-35);
}

.br-right-35 {
  border-radius: 0 var(--spacing-35) var(--spacing-35) 0;
}

.br-left-35 {
  border-radius: var(--spacing-35) 0 0 var(--spacing-35);
}

.br-top-35 {
  border-radius: var(--spacing-35) var(--spacing-35) 0 0;
}

.br-bottom-35 {
  border-radius: 0 0 var(--spacing-35) var(--spacing-35);
}

@media (min-width: 992px) {
  .lg-br-right-35 {
    border-radius: 0 var(--spacing-35) var(--spacing-35) 0;
  }
}

@media (min-width: 992px) {
  .lg-br-left-35 {
    border-radius: var(--spacing-35) 0 0 var(--spacing-35);
  }
}

@media (min-width: 992px) {
  .lg-br-top-35 {
    border-radius: var(--spacing-35) var(--spacing-35) 0 0;
  }
}

@media (min-width: 992px) {
  .lg-br-bottom-35 {
    border-radius: 0 0 var(--spacing-35) var(--spacing-35);
  }
}

.p-4 {
  padding: var(--spacing-4) !important;
}

.pt-4 {
  padding-top: var(--spacing-4) !important;
}

.pb-4 {
  padding-bottom: var(--spacing-4) !important;
}

.pr-4 {
  padding-right: var(--spacing-4) !important;
}

.pl-4 {
  padding-left: var(--spacing-4) !important;
}

.p-block-4 {
  padding-block: var(--spacing-4) !important;
}

.p-inline-4 {
  padding-inline: var(--spacing-4) !important;
}

@media (min-width: 992px) {
  .lg-pt-4 {
    padding-top: var(--spacing-4) !important;
  }
}

.sm-pb-4 {
  padding-bottom: var(--spacing-4) !important;
}
@media (min-width: 992px) {
  .sm-pb-4 {
    padding-bottom: var(--spacing-4) !important;
  }
}

.sm-pt-4 {
  padding-top: var(--spacing-4) !important;
}
@media (min-width: 992px) {
  .sm-pt-4 {
    padding-top: var(--spacing-4) !important;
  }
}

.m-4 {
  margin: var(--spacing-4) !important;
}

.mb-4 {
  margin-bottom: var(--spacing-4) !important;
}

.mt-4 {
  margin-top: var(--spacing-4) !important;
}

.ml-4 {
  margin-left: var(--spacing-4) !important;
}

.m-block-4 {
  margin-block: var(--spacing-4) !important;
}

.m-inline-4 {
  margin-inline: var(--spacing-4) !important;
}

.gap-4 {
  gap: var(--spacing-4);
}

.gap-sm-name {
  gap: var(--spacing-4);
}
@media (min-width: 992px) {
  .gap-sm-name {
    gap: var(--spacing-0);
  }
}

@media (min-width: 992px) {
  .gap-lg-name {
    gap: var(--spacing-4);
  }
}

.br-4 {
  border-radius: var(--spacing-4);
}

.br-right-4 {
  border-radius: 0 var(--spacing-4) var(--spacing-4) 0;
}

.br-left-4 {
  border-radius: var(--spacing-4) 0 0 var(--spacing-4);
}

.br-top-4 {
  border-radius: var(--spacing-4) var(--spacing-4) 0 0;
}

.br-bottom-4 {
  border-radius: 0 0 var(--spacing-4) var(--spacing-4);
}

@media (min-width: 992px) {
  .lg-br-right-4 {
    border-radius: 0 var(--spacing-4) var(--spacing-4) 0;
  }
}

@media (min-width: 992px) {
  .lg-br-left-4 {
    border-radius: var(--spacing-4) 0 0 var(--spacing-4);
  }
}

@media (min-width: 992px) {
  .lg-br-top-4 {
    border-radius: var(--spacing-4) var(--spacing-4) 0 0;
  }
}

@media (min-width: 992px) {
  .lg-br-bottom-4 {
    border-radius: 0 0 var(--spacing-4) var(--spacing-4);
  }
}

.p-5 {
  padding: var(--spacing-5) !important;
}

.pt-5 {
  padding-top: var(--spacing-5) !important;
}

.pb-5 {
  padding-bottom: var(--spacing-5) !important;
}

.pr-5 {
  padding-right: var(--spacing-5) !important;
}

.pl-5 {
  padding-left: var(--spacing-5) !important;
}

.p-block-5 {
  padding-block: var(--spacing-5) !important;
}

.p-inline-5 {
  padding-inline: var(--spacing-5) !important;
}

@media (min-width: 992px) {
  .lg-pt-5 {
    padding-top: var(--spacing-5) !important;
  }
}

.sm-pb-5 {
  padding-bottom: var(--spacing-5) !important;
}
@media (min-width: 992px) {
  .sm-pb-5 {
    padding-bottom: var(--spacing-5) !important;
  }
}

.sm-pt-5 {
  padding-top: var(--spacing-5) !important;
}
@media (min-width: 992px) {
  .sm-pt-5 {
    padding-top: var(--spacing-5) !important;
  }
}

.m-5 {
  margin: var(--spacing-5) !important;
}

.mb-5 {
  margin-bottom: var(--spacing-5) !important;
}

.mt-5 {
  margin-top: var(--spacing-5) !important;
}

.ml-5 {
  margin-left: var(--spacing-5) !important;
}

.m-block-5 {
  margin-block: var(--spacing-5) !important;
}

.m-inline-5 {
  margin-inline: var(--spacing-5) !important;
}

.gap-5 {
  gap: var(--spacing-5);
}

.gap-sm-name {
  gap: var(--spacing-5);
}
@media (min-width: 992px) {
  .gap-sm-name {
    gap: var(--spacing-0);
  }
}

@media (min-width: 992px) {
  .gap-lg-name {
    gap: var(--spacing-5);
  }
}

.br-5 {
  border-radius: var(--spacing-5);
}

.br-right-5 {
  border-radius: 0 var(--spacing-5) var(--spacing-5) 0;
}

.br-left-5 {
  border-radius: var(--spacing-5) 0 0 var(--spacing-5);
}

.br-top-5 {
  border-radius: var(--spacing-5) var(--spacing-5) 0 0;
}

.br-bottom-5 {
  border-radius: 0 0 var(--spacing-5) var(--spacing-5);
}

@media (min-width: 992px) {
  .lg-br-right-5 {
    border-radius: 0 var(--spacing-5) var(--spacing-5) 0;
  }
}

@media (min-width: 992px) {
  .lg-br-left-5 {
    border-radius: var(--spacing-5) 0 0 var(--spacing-5);
  }
}

@media (min-width: 992px) {
  .lg-br-top-5 {
    border-radius: var(--spacing-5) var(--spacing-5) 0 0;
  }
}

@media (min-width: 992px) {
  .lg-br-bottom-5 {
    border-radius: 0 0 var(--spacing-5) var(--spacing-5);
  }
}

.p-6 {
  padding: var(--spacing-6) !important;
}

.pt-6 {
  padding-top: var(--spacing-6) !important;
}

.pb-6 {
  padding-bottom: var(--spacing-6) !important;
}

.pr-6 {
  padding-right: var(--spacing-6) !important;
}

.pl-6 {
  padding-left: var(--spacing-6) !important;
}

.p-block-6 {
  padding-block: var(--spacing-6) !important;
}

.p-inline-6 {
  padding-inline: var(--spacing-6) !important;
}

@media (min-width: 992px) {
  .lg-pt-6 {
    padding-top: var(--spacing-6) !important;
  }
}

.sm-pb-6 {
  padding-bottom: var(--spacing-6) !important;
}
@media (min-width: 992px) {
  .sm-pb-6 {
    padding-bottom: var(--spacing-6) !important;
  }
}

.sm-pt-6 {
  padding-top: var(--spacing-6) !important;
}
@media (min-width: 992px) {
  .sm-pt-6 {
    padding-top: var(--spacing-6) !important;
  }
}

.m-6 {
  margin: var(--spacing-6) !important;
}

.mb-6 {
  margin-bottom: var(--spacing-6) !important;
}

.mt-6 {
  margin-top: var(--spacing-6) !important;
}

.ml-6 {
  margin-left: var(--spacing-6) !important;
}

.m-block-6 {
  margin-block: var(--spacing-6) !important;
}

.m-inline-6 {
  margin-inline: var(--spacing-6) !important;
}

.gap-6 {
  gap: var(--spacing-6);
}

.gap-sm-name {
  gap: var(--spacing-6);
}
@media (min-width: 992px) {
  .gap-sm-name {
    gap: var(--spacing-0);
  }
}

@media (min-width: 992px) {
  .gap-lg-name {
    gap: var(--spacing-6);
  }
}

.br-6 {
  border-radius: var(--spacing-6);
}

.br-right-6 {
  border-radius: 0 var(--spacing-6) var(--spacing-6) 0;
}

.br-left-6 {
  border-radius: var(--spacing-6) 0 0 var(--spacing-6);
}

.br-top-6 {
  border-radius: var(--spacing-6) var(--spacing-6) 0 0;
}

.br-bottom-6 {
  border-radius: 0 0 var(--spacing-6) var(--spacing-6);
}

@media (min-width: 992px) {
  .lg-br-right-6 {
    border-radius: 0 var(--spacing-6) var(--spacing-6) 0;
  }
}

@media (min-width: 992px) {
  .lg-br-left-6 {
    border-radius: var(--spacing-6) 0 0 var(--spacing-6);
  }
}

@media (min-width: 992px) {
  .lg-br-top-6 {
    border-radius: var(--spacing-6) var(--spacing-6) 0 0;
  }
}

@media (min-width: 992px) {
  .lg-br-bottom-6 {
    border-radius: 0 0 var(--spacing-6) var(--spacing-6);
  }
}

.p-7 {
  padding: var(--spacing-7) !important;
}

.pt-7 {
  padding-top: var(--spacing-7) !important;
}

.pb-7 {
  padding-bottom: var(--spacing-7) !important;
}

.pr-7 {
  padding-right: var(--spacing-7) !important;
}

.pl-7 {
  padding-left: var(--spacing-7) !important;
}

.p-block-7 {
  padding-block: var(--spacing-7) !important;
}

.p-inline-7 {
  padding-inline: var(--spacing-7) !important;
}

@media (min-width: 992px) {
  .lg-pt-7 {
    padding-top: var(--spacing-7) !important;
  }
}

.sm-pb-7 {
  padding-bottom: var(--spacing-7) !important;
}
@media (min-width: 992px) {
  .sm-pb-7 {
    padding-bottom: var(--spacing-7) !important;
  }
}

.sm-pt-7 {
  padding-top: var(--spacing-7) !important;
}
@media (min-width: 992px) {
  .sm-pt-7 {
    padding-top: var(--spacing-7) !important;
  }
}

.m-7 {
  margin: var(--spacing-7) !important;
}

.mb-7 {
  margin-bottom: var(--spacing-7) !important;
}

.mt-7 {
  margin-top: var(--spacing-7) !important;
}

.ml-7 {
  margin-left: var(--spacing-7) !important;
}

.m-block-7 {
  margin-block: var(--spacing-7) !important;
}

.m-inline-7 {
  margin-inline: var(--spacing-7) !important;
}

.gap-7 {
  gap: var(--spacing-7);
}

.gap-sm-name {
  gap: var(--spacing-7);
}
@media (min-width: 992px) {
  .gap-sm-name {
    gap: var(--spacing-0);
  }
}

@media (min-width: 992px) {
  .gap-lg-name {
    gap: var(--spacing-7);
  }
}

.br-7 {
  border-radius: var(--spacing-7);
}

.br-right-7 {
  border-radius: 0 var(--spacing-7) var(--spacing-7) 0;
}

.br-left-7 {
  border-radius: var(--spacing-7) 0 0 var(--spacing-7);
}

.br-top-7 {
  border-radius: var(--spacing-7) var(--spacing-7) 0 0;
}

.br-bottom-7 {
  border-radius: 0 0 var(--spacing-7) var(--spacing-7);
}

@media (min-width: 992px) {
  .lg-br-right-7 {
    border-radius: 0 var(--spacing-7) var(--spacing-7) 0;
  }
}

@media (min-width: 992px) {
  .lg-br-left-7 {
    border-radius: var(--spacing-7) 0 0 var(--spacing-7);
  }
}

@media (min-width: 992px) {
  .lg-br-top-7 {
    border-radius: var(--spacing-7) var(--spacing-7) 0 0;
  }
}

@media (min-width: 992px) {
  .lg-br-bottom-7 {
    border-radius: 0 0 var(--spacing-7) var(--spacing-7);
  }
}

.p-8 {
  padding: var(--spacing-8) !important;
}

.pt-8 {
  padding-top: var(--spacing-8) !important;
}

.pb-8 {
  padding-bottom: var(--spacing-8) !important;
}

.pr-8 {
  padding-right: var(--spacing-8) !important;
}

.pl-8 {
  padding-left: var(--spacing-8) !important;
}

.p-block-8 {
  padding-block: var(--spacing-8) !important;
}

.p-inline-8 {
  padding-inline: var(--spacing-8) !important;
}

@media (min-width: 992px) {
  .lg-pt-8 {
    padding-top: var(--spacing-8) !important;
  }
}

.sm-pb-8 {
  padding-bottom: var(--spacing-8) !important;
}
@media (min-width: 992px) {
  .sm-pb-8 {
    padding-bottom: var(--spacing-8) !important;
  }
}

.sm-pt-8 {
  padding-top: var(--spacing-8) !important;
}
@media (min-width: 992px) {
  .sm-pt-8 {
    padding-top: var(--spacing-8) !important;
  }
}

.m-8 {
  margin: var(--spacing-8) !important;
}

.mb-8 {
  margin-bottom: var(--spacing-8) !important;
}

.mt-8 {
  margin-top: var(--spacing-8) !important;
}

.ml-8 {
  margin-left: var(--spacing-8) !important;
}

.m-block-8 {
  margin-block: var(--spacing-8) !important;
}

.m-inline-8 {
  margin-inline: var(--spacing-8) !important;
}

.gap-8 {
  gap: var(--spacing-8);
}

.gap-sm-name {
  gap: var(--spacing-8);
}
@media (min-width: 992px) {
  .gap-sm-name {
    gap: var(--spacing-0);
  }
}

@media (min-width: 992px) {
  .gap-lg-name {
    gap: var(--spacing-8);
  }
}

.br-8 {
  border-radius: var(--spacing-8);
}

.br-right-8 {
  border-radius: 0 var(--spacing-8) var(--spacing-8) 0;
}

.br-left-8 {
  border-radius: var(--spacing-8) 0 0 var(--spacing-8);
}

.br-top-8 {
  border-radius: var(--spacing-8) var(--spacing-8) 0 0;
}

.br-bottom-8 {
  border-radius: 0 0 var(--spacing-8) var(--spacing-8);
}

@media (min-width: 992px) {
  .lg-br-right-8 {
    border-radius: 0 var(--spacing-8) var(--spacing-8) 0;
  }
}

@media (min-width: 992px) {
  .lg-br-left-8 {
    border-radius: var(--spacing-8) 0 0 var(--spacing-8);
  }
}

@media (min-width: 992px) {
  .lg-br-top-8 {
    border-radius: var(--spacing-8) var(--spacing-8) 0 0;
  }
}

@media (min-width: 992px) {
  .lg-br-bottom-8 {
    border-radius: 0 0 var(--spacing-8) var(--spacing-8);
  }
}

.p-9 {
  padding: var(--spacing-9) !important;
}

.pt-9 {
  padding-top: var(--spacing-9) !important;
}

.pb-9 {
  padding-bottom: var(--spacing-9) !important;
}

.pr-9 {
  padding-right: var(--spacing-9) !important;
}

.pl-9 {
  padding-left: var(--spacing-9) !important;
}

.p-block-9 {
  padding-block: var(--spacing-9) !important;
}

.p-inline-9 {
  padding-inline: var(--spacing-9) !important;
}

@media (min-width: 992px) {
  .lg-pt-9 {
    padding-top: var(--spacing-9) !important;
  }
}

.sm-pb-9 {
  padding-bottom: var(--spacing-9) !important;
}
@media (min-width: 992px) {
  .sm-pb-9 {
    padding-bottom: var(--spacing-9) !important;
  }
}

.sm-pt-9 {
  padding-top: var(--spacing-9) !important;
}
@media (min-width: 992px) {
  .sm-pt-9 {
    padding-top: var(--spacing-9) !important;
  }
}

.m-9 {
  margin: var(--spacing-9) !important;
}

.mb-9 {
  margin-bottom: var(--spacing-9) !important;
}

.mt-9 {
  margin-top: var(--spacing-9) !important;
}

.ml-9 {
  margin-left: var(--spacing-9) !important;
}

.m-block-9 {
  margin-block: var(--spacing-9) !important;
}

.m-inline-9 {
  margin-inline: var(--spacing-9) !important;
}

.gap-9 {
  gap: var(--spacing-9);
}

.gap-sm-name {
  gap: var(--spacing-9);
}
@media (min-width: 992px) {
  .gap-sm-name {
    gap: var(--spacing-0);
  }
}

@media (min-width: 992px) {
  .gap-lg-name {
    gap: var(--spacing-9);
  }
}

.br-9 {
  border-radius: var(--spacing-9);
}

.br-right-9 {
  border-radius: 0 var(--spacing-9) var(--spacing-9) 0;
}

.br-left-9 {
  border-radius: var(--spacing-9) 0 0 var(--spacing-9);
}

.br-top-9 {
  border-radius: var(--spacing-9) var(--spacing-9) 0 0;
}

.br-bottom-9 {
  border-radius: 0 0 var(--spacing-9) var(--spacing-9);
}

@media (min-width: 992px) {
  .lg-br-right-9 {
    border-radius: 0 var(--spacing-9) var(--spacing-9) 0;
  }
}

@media (min-width: 992px) {
  .lg-br-left-9 {
    border-radius: var(--spacing-9) 0 0 var(--spacing-9);
  }
}

@media (min-width: 992px) {
  .lg-br-top-9 {
    border-radius: var(--spacing-9) var(--spacing-9) 0 0;
  }
}

@media (min-width: 992px) {
  .lg-br-bottom-9 {
    border-radius: 0 0 var(--spacing-9) var(--spacing-9);
  }
}

.p-auto-auto {
  padding: auto;
}
@media (min-width: 992px) {
  .p-auto-auto {
    padding: auto;
  }
}

.pt-auto-auto {
  padding-top: auto;
}
@media (min-width: 992px) {
  .pt-auto-auto {
    padding-top: auto;
  }
}

.pb-auto-auto {
  padding-bottom: auto;
}
@media (min-width: 992px) {
  .pb-auto-auto {
    padding-bottom: auto;
  }
}

.p-inline-auto-auto {
  padding-inline: auto;
}
@media (min-width: 992px) {
  .p-inline-auto-auto {
    padding-inline: auto;
  }
}

.m-auto-auto {
  margin: auto;
}
@media (min-width: 992px) {
  .m-auto-auto {
    margin: auto;
  }
}

.mt-auto-auto {
  margin-top: auto !important;
}
@media (min-width: 992px) {
  .mt-auto-auto {
    margin-top: auto !important;
  }
}

.mb-auto-auto {
  margin-bottom: auto !important;
}
@media (min-width: 992px) {
  .mb-auto-auto {
    margin-bottom: auto !important;
  }
}

.ml-auto-auto {
  margin-left: auto !important;
}
@media (min-width: 992px) {
  .ml-auto-auto {
    margin-left: auto !important;
  }
}

.gap-auto-auto {
  gap: auto;
}
@media (min-width: 992px) {
  .gap-auto-auto {
    gap: auto;
  }
}

.p-auto-0 {
  padding: auto;
}
@media (min-width: 992px) {
  .p-auto-0 {
    padding: var(--spacing-0);
  }
}

.pt-auto-0 {
  padding-top: auto;
}
@media (min-width: 992px) {
  .pt-auto-0 {
    padding-top: var(--spacing-0);
  }
}

.pb-auto-0 {
  padding-bottom: auto;
}
@media (min-width: 992px) {
  .pb-auto-0 {
    padding-bottom: var(--spacing-0);
  }
}

.p-inline-auto-0 {
  padding-inline: auto;
}
@media (min-width: 992px) {
  .p-inline-auto-0 {
    padding-inline: var(--spacing-0);
  }
}

.m-auto-0 {
  margin: auto;
}
@media (min-width: 992px) {
  .m-auto-0 {
    margin: var(--spacing-0);
  }
}

.mt-auto-0 {
  margin-top: auto !important;
}
@media (min-width: 992px) {
  .mt-auto-0 {
    margin-top: var(--spacing-0) !important;
  }
}

.mb-auto-0 {
  margin-bottom: auto !important;
}
@media (min-width: 992px) {
  .mb-auto-0 {
    margin-bottom: var(--spacing-0) !important;
  }
}

.ml-auto-0 {
  margin-left: auto !important;
}
@media (min-width: 992px) {
  .ml-auto-0 {
    margin-left: var(--spacing-0) !important;
  }
}

.gap-auto-0 {
  gap: auto;
}
@media (min-width: 992px) {
  .gap-auto-0 {
    gap: var(--spacing-0);
  }
}

.p-auto-1 {
  padding: auto;
}
@media (min-width: 992px) {
  .p-auto-1 {
    padding: var(--spacing-1);
  }
}

.pt-auto-1 {
  padding-top: auto;
}
@media (min-width: 992px) {
  .pt-auto-1 {
    padding-top: var(--spacing-1);
  }
}

.pb-auto-1 {
  padding-bottom: auto;
}
@media (min-width: 992px) {
  .pb-auto-1 {
    padding-bottom: var(--spacing-1);
  }
}

.p-inline-auto-1 {
  padding-inline: auto;
}
@media (min-width: 992px) {
  .p-inline-auto-1 {
    padding-inline: var(--spacing-1);
  }
}

.m-auto-1 {
  margin: auto;
}
@media (min-width: 992px) {
  .m-auto-1 {
    margin: var(--spacing-1);
  }
}

.mt-auto-1 {
  margin-top: auto !important;
}
@media (min-width: 992px) {
  .mt-auto-1 {
    margin-top: var(--spacing-1) !important;
  }
}

.mb-auto-1 {
  margin-bottom: auto !important;
}
@media (min-width: 992px) {
  .mb-auto-1 {
    margin-bottom: var(--spacing-1) !important;
  }
}

.ml-auto-1 {
  margin-left: auto !important;
}
@media (min-width: 992px) {
  .ml-auto-1 {
    margin-left: var(--spacing-1) !important;
  }
}

.gap-auto-1 {
  gap: auto;
}
@media (min-width: 992px) {
  .gap-auto-1 {
    gap: var(--spacing-1);
  }
}

.p-auto-2 {
  padding: auto;
}
@media (min-width: 992px) {
  .p-auto-2 {
    padding: var(--spacing-2);
  }
}

.pt-auto-2 {
  padding-top: auto;
}
@media (min-width: 992px) {
  .pt-auto-2 {
    padding-top: var(--spacing-2);
  }
}

.pb-auto-2 {
  padding-bottom: auto;
}
@media (min-width: 992px) {
  .pb-auto-2 {
    padding-bottom: var(--spacing-2);
  }
}

.p-inline-auto-2 {
  padding-inline: auto;
}
@media (min-width: 992px) {
  .p-inline-auto-2 {
    padding-inline: var(--spacing-2);
  }
}

.m-auto-2 {
  margin: auto;
}
@media (min-width: 992px) {
  .m-auto-2 {
    margin: var(--spacing-2);
  }
}

.mt-auto-2 {
  margin-top: auto !important;
}
@media (min-width: 992px) {
  .mt-auto-2 {
    margin-top: var(--spacing-2) !important;
  }
}

.mb-auto-2 {
  margin-bottom: auto !important;
}
@media (min-width: 992px) {
  .mb-auto-2 {
    margin-bottom: var(--spacing-2) !important;
  }
}

.ml-auto-2 {
  margin-left: auto !important;
}
@media (min-width: 992px) {
  .ml-auto-2 {
    margin-left: var(--spacing-2) !important;
  }
}

.gap-auto-2 {
  gap: auto;
}
@media (min-width: 992px) {
  .gap-auto-2 {
    gap: var(--spacing-2);
  }
}

.p-auto-25 {
  padding: auto;
}
@media (min-width: 992px) {
  .p-auto-25 {
    padding: var(--spacing-25);
  }
}

.pt-auto-25 {
  padding-top: auto;
}
@media (min-width: 992px) {
  .pt-auto-25 {
    padding-top: var(--spacing-25);
  }
}

.pb-auto-25 {
  padding-bottom: auto;
}
@media (min-width: 992px) {
  .pb-auto-25 {
    padding-bottom: var(--spacing-25);
  }
}

.p-inline-auto-25 {
  padding-inline: auto;
}
@media (min-width: 992px) {
  .p-inline-auto-25 {
    padding-inline: var(--spacing-25);
  }
}

.m-auto-25 {
  margin: auto;
}
@media (min-width: 992px) {
  .m-auto-25 {
    margin: var(--spacing-25);
  }
}

.mt-auto-25 {
  margin-top: auto !important;
}
@media (min-width: 992px) {
  .mt-auto-25 {
    margin-top: var(--spacing-25) !important;
  }
}

.mb-auto-25 {
  margin-bottom: auto !important;
}
@media (min-width: 992px) {
  .mb-auto-25 {
    margin-bottom: var(--spacing-25) !important;
  }
}

.ml-auto-25 {
  margin-left: auto !important;
}
@media (min-width: 992px) {
  .ml-auto-25 {
    margin-left: var(--spacing-25) !important;
  }
}

.gap-auto-25 {
  gap: auto;
}
@media (min-width: 992px) {
  .gap-auto-25 {
    gap: var(--spacing-25);
  }
}

.p-auto-3 {
  padding: auto;
}
@media (min-width: 992px) {
  .p-auto-3 {
    padding: var(--spacing-3);
  }
}

.pt-auto-3 {
  padding-top: auto;
}
@media (min-width: 992px) {
  .pt-auto-3 {
    padding-top: var(--spacing-3);
  }
}

.pb-auto-3 {
  padding-bottom: auto;
}
@media (min-width: 992px) {
  .pb-auto-3 {
    padding-bottom: var(--spacing-3);
  }
}

.p-inline-auto-3 {
  padding-inline: auto;
}
@media (min-width: 992px) {
  .p-inline-auto-3 {
    padding-inline: var(--spacing-3);
  }
}

.m-auto-3 {
  margin: auto;
}
@media (min-width: 992px) {
  .m-auto-3 {
    margin: var(--spacing-3);
  }
}

.mt-auto-3 {
  margin-top: auto !important;
}
@media (min-width: 992px) {
  .mt-auto-3 {
    margin-top: var(--spacing-3) !important;
  }
}

.mb-auto-3 {
  margin-bottom: auto !important;
}
@media (min-width: 992px) {
  .mb-auto-3 {
    margin-bottom: var(--spacing-3) !important;
  }
}

.ml-auto-3 {
  margin-left: auto !important;
}
@media (min-width: 992px) {
  .ml-auto-3 {
    margin-left: var(--spacing-3) !important;
  }
}

.gap-auto-3 {
  gap: auto;
}
@media (min-width: 992px) {
  .gap-auto-3 {
    gap: var(--spacing-3);
  }
}

.p-auto-35 {
  padding: auto;
}
@media (min-width: 992px) {
  .p-auto-35 {
    padding: var(--spacing-35);
  }
}

.pt-auto-35 {
  padding-top: auto;
}
@media (min-width: 992px) {
  .pt-auto-35 {
    padding-top: var(--spacing-35);
  }
}

.pb-auto-35 {
  padding-bottom: auto;
}
@media (min-width: 992px) {
  .pb-auto-35 {
    padding-bottom: var(--spacing-35);
  }
}

.p-inline-auto-35 {
  padding-inline: auto;
}
@media (min-width: 992px) {
  .p-inline-auto-35 {
    padding-inline: var(--spacing-35);
  }
}

.m-auto-35 {
  margin: auto;
}
@media (min-width: 992px) {
  .m-auto-35 {
    margin: var(--spacing-35);
  }
}

.mt-auto-35 {
  margin-top: auto !important;
}
@media (min-width: 992px) {
  .mt-auto-35 {
    margin-top: var(--spacing-35) !important;
  }
}

.mb-auto-35 {
  margin-bottom: auto !important;
}
@media (min-width: 992px) {
  .mb-auto-35 {
    margin-bottom: var(--spacing-35) !important;
  }
}

.ml-auto-35 {
  margin-left: auto !important;
}
@media (min-width: 992px) {
  .ml-auto-35 {
    margin-left: var(--spacing-35) !important;
  }
}

.gap-auto-35 {
  gap: auto;
}
@media (min-width: 992px) {
  .gap-auto-35 {
    gap: var(--spacing-35);
  }
}

.p-auto-4 {
  padding: auto;
}
@media (min-width: 992px) {
  .p-auto-4 {
    padding: var(--spacing-4);
  }
}

.pt-auto-4 {
  padding-top: auto;
}
@media (min-width: 992px) {
  .pt-auto-4 {
    padding-top: var(--spacing-4);
  }
}

.pb-auto-4 {
  padding-bottom: auto;
}
@media (min-width: 992px) {
  .pb-auto-4 {
    padding-bottom: var(--spacing-4);
  }
}

.p-inline-auto-4 {
  padding-inline: auto;
}
@media (min-width: 992px) {
  .p-inline-auto-4 {
    padding-inline: var(--spacing-4);
  }
}

.m-auto-4 {
  margin: auto;
}
@media (min-width: 992px) {
  .m-auto-4 {
    margin: var(--spacing-4);
  }
}

.mt-auto-4 {
  margin-top: auto !important;
}
@media (min-width: 992px) {
  .mt-auto-4 {
    margin-top: var(--spacing-4) !important;
  }
}

.mb-auto-4 {
  margin-bottom: auto !important;
}
@media (min-width: 992px) {
  .mb-auto-4 {
    margin-bottom: var(--spacing-4) !important;
  }
}

.ml-auto-4 {
  margin-left: auto !important;
}
@media (min-width: 992px) {
  .ml-auto-4 {
    margin-left: var(--spacing-4) !important;
  }
}

.gap-auto-4 {
  gap: auto;
}
@media (min-width: 992px) {
  .gap-auto-4 {
    gap: var(--spacing-4);
  }
}

.p-auto-5 {
  padding: auto;
}
@media (min-width: 992px) {
  .p-auto-5 {
    padding: var(--spacing-5);
  }
}

.pt-auto-5 {
  padding-top: auto;
}
@media (min-width: 992px) {
  .pt-auto-5 {
    padding-top: var(--spacing-5);
  }
}

.pb-auto-5 {
  padding-bottom: auto;
}
@media (min-width: 992px) {
  .pb-auto-5 {
    padding-bottom: var(--spacing-5);
  }
}

.p-inline-auto-5 {
  padding-inline: auto;
}
@media (min-width: 992px) {
  .p-inline-auto-5 {
    padding-inline: var(--spacing-5);
  }
}

.m-auto-5 {
  margin: auto;
}
@media (min-width: 992px) {
  .m-auto-5 {
    margin: var(--spacing-5);
  }
}

.mt-auto-5 {
  margin-top: auto !important;
}
@media (min-width: 992px) {
  .mt-auto-5 {
    margin-top: var(--spacing-5) !important;
  }
}

.mb-auto-5 {
  margin-bottom: auto !important;
}
@media (min-width: 992px) {
  .mb-auto-5 {
    margin-bottom: var(--spacing-5) !important;
  }
}

.ml-auto-5 {
  margin-left: auto !important;
}
@media (min-width: 992px) {
  .ml-auto-5 {
    margin-left: var(--spacing-5) !important;
  }
}

.gap-auto-5 {
  gap: auto;
}
@media (min-width: 992px) {
  .gap-auto-5 {
    gap: var(--spacing-5);
  }
}

.p-auto-6 {
  padding: auto;
}
@media (min-width: 992px) {
  .p-auto-6 {
    padding: var(--spacing-6);
  }
}

.pt-auto-6 {
  padding-top: auto;
}
@media (min-width: 992px) {
  .pt-auto-6 {
    padding-top: var(--spacing-6);
  }
}

.pb-auto-6 {
  padding-bottom: auto;
}
@media (min-width: 992px) {
  .pb-auto-6 {
    padding-bottom: var(--spacing-6);
  }
}

.p-inline-auto-6 {
  padding-inline: auto;
}
@media (min-width: 992px) {
  .p-inline-auto-6 {
    padding-inline: var(--spacing-6);
  }
}

.m-auto-6 {
  margin: auto;
}
@media (min-width: 992px) {
  .m-auto-6 {
    margin: var(--spacing-6);
  }
}

.mt-auto-6 {
  margin-top: auto !important;
}
@media (min-width: 992px) {
  .mt-auto-6 {
    margin-top: var(--spacing-6) !important;
  }
}

.mb-auto-6 {
  margin-bottom: auto !important;
}
@media (min-width: 992px) {
  .mb-auto-6 {
    margin-bottom: var(--spacing-6) !important;
  }
}

.ml-auto-6 {
  margin-left: auto !important;
}
@media (min-width: 992px) {
  .ml-auto-6 {
    margin-left: var(--spacing-6) !important;
  }
}

.gap-auto-6 {
  gap: auto;
}
@media (min-width: 992px) {
  .gap-auto-6 {
    gap: var(--spacing-6);
  }
}

.p-auto-7 {
  padding: auto;
}
@media (min-width: 992px) {
  .p-auto-7 {
    padding: var(--spacing-7);
  }
}

.pt-auto-7 {
  padding-top: auto;
}
@media (min-width: 992px) {
  .pt-auto-7 {
    padding-top: var(--spacing-7);
  }
}

.pb-auto-7 {
  padding-bottom: auto;
}
@media (min-width: 992px) {
  .pb-auto-7 {
    padding-bottom: var(--spacing-7);
  }
}

.p-inline-auto-7 {
  padding-inline: auto;
}
@media (min-width: 992px) {
  .p-inline-auto-7 {
    padding-inline: var(--spacing-7);
  }
}

.m-auto-7 {
  margin: auto;
}
@media (min-width: 992px) {
  .m-auto-7 {
    margin: var(--spacing-7);
  }
}

.mt-auto-7 {
  margin-top: auto !important;
}
@media (min-width: 992px) {
  .mt-auto-7 {
    margin-top: var(--spacing-7) !important;
  }
}

.mb-auto-7 {
  margin-bottom: auto !important;
}
@media (min-width: 992px) {
  .mb-auto-7 {
    margin-bottom: var(--spacing-7) !important;
  }
}

.ml-auto-7 {
  margin-left: auto !important;
}
@media (min-width: 992px) {
  .ml-auto-7 {
    margin-left: var(--spacing-7) !important;
  }
}

.gap-auto-7 {
  gap: auto;
}
@media (min-width: 992px) {
  .gap-auto-7 {
    gap: var(--spacing-7);
  }
}

.p-auto-8 {
  padding: auto;
}
@media (min-width: 992px) {
  .p-auto-8 {
    padding: var(--spacing-8);
  }
}

.pt-auto-8 {
  padding-top: auto;
}
@media (min-width: 992px) {
  .pt-auto-8 {
    padding-top: var(--spacing-8);
  }
}

.pb-auto-8 {
  padding-bottom: auto;
}
@media (min-width: 992px) {
  .pb-auto-8 {
    padding-bottom: var(--spacing-8);
  }
}

.p-inline-auto-8 {
  padding-inline: auto;
}
@media (min-width: 992px) {
  .p-inline-auto-8 {
    padding-inline: var(--spacing-8);
  }
}

.m-auto-8 {
  margin: auto;
}
@media (min-width: 992px) {
  .m-auto-8 {
    margin: var(--spacing-8);
  }
}

.mt-auto-8 {
  margin-top: auto !important;
}
@media (min-width: 992px) {
  .mt-auto-8 {
    margin-top: var(--spacing-8) !important;
  }
}

.mb-auto-8 {
  margin-bottom: auto !important;
}
@media (min-width: 992px) {
  .mb-auto-8 {
    margin-bottom: var(--spacing-8) !important;
  }
}

.ml-auto-8 {
  margin-left: auto !important;
}
@media (min-width: 992px) {
  .ml-auto-8 {
    margin-left: var(--spacing-8) !important;
  }
}

.gap-auto-8 {
  gap: auto;
}
@media (min-width: 992px) {
  .gap-auto-8 {
    gap: var(--spacing-8);
  }
}

.p-auto-9 {
  padding: auto;
}
@media (min-width: 992px) {
  .p-auto-9 {
    padding: var(--spacing-9);
  }
}

.pt-auto-9 {
  padding-top: auto;
}
@media (min-width: 992px) {
  .pt-auto-9 {
    padding-top: var(--spacing-9);
  }
}

.pb-auto-9 {
  padding-bottom: auto;
}
@media (min-width: 992px) {
  .pb-auto-9 {
    padding-bottom: var(--spacing-9);
  }
}

.p-inline-auto-9 {
  padding-inline: auto;
}
@media (min-width: 992px) {
  .p-inline-auto-9 {
    padding-inline: var(--spacing-9);
  }
}

.m-auto-9 {
  margin: auto;
}
@media (min-width: 992px) {
  .m-auto-9 {
    margin: var(--spacing-9);
  }
}

.mt-auto-9 {
  margin-top: auto !important;
}
@media (min-width: 992px) {
  .mt-auto-9 {
    margin-top: var(--spacing-9) !important;
  }
}

.mb-auto-9 {
  margin-bottom: auto !important;
}
@media (min-width: 992px) {
  .mb-auto-9 {
    margin-bottom: var(--spacing-9) !important;
  }
}

.ml-auto-9 {
  margin-left: auto !important;
}
@media (min-width: 992px) {
  .ml-auto-9 {
    margin-left: var(--spacing-9) !important;
  }
}

.gap-auto-9 {
  gap: auto;
}
@media (min-width: 992px) {
  .gap-auto-9 {
    gap: var(--spacing-9);
  }
}

.p-0-auto {
  padding: var(--spacing-0);
}
@media (min-width: 992px) {
  .p-0-auto {
    padding: auto;
  }
}

.pt-0-auto {
  padding-top: var(--spacing-0);
}
@media (min-width: 992px) {
  .pt-0-auto {
    padding-top: auto;
  }
}

.pb-0-auto {
  padding-bottom: var(--spacing-0);
}
@media (min-width: 992px) {
  .pb-0-auto {
    padding-bottom: auto;
  }
}

.p-inline-0-auto {
  padding-inline: var(--spacing-0);
}
@media (min-width: 992px) {
  .p-inline-0-auto {
    padding-inline: auto;
  }
}

.m-0-auto {
  margin: var(--spacing-0);
}
@media (min-width: 992px) {
  .m-0-auto {
    margin: auto;
  }
}

.mt-0-auto {
  margin-top: var(--spacing-0) !important;
}
@media (min-width: 992px) {
  .mt-0-auto {
    margin-top: auto !important;
  }
}

.mb-0-auto {
  margin-bottom: var(--spacing-0) !important;
}
@media (min-width: 992px) {
  .mb-0-auto {
    margin-bottom: auto !important;
  }
}

.ml-0-auto {
  margin-left: var(--spacing-0) !important;
}
@media (min-width: 992px) {
  .ml-0-auto {
    margin-left: auto !important;
  }
}

.gap-0-auto {
  gap: var(--spacing-0);
}
@media (min-width: 992px) {
  .gap-0-auto {
    gap: auto;
  }
}

.p-0-0 {
  padding: var(--spacing-0);
}
@media (min-width: 992px) {
  .p-0-0 {
    padding: var(--spacing-0);
  }
}

.pt-0-0 {
  padding-top: var(--spacing-0);
}
@media (min-width: 992px) {
  .pt-0-0 {
    padding-top: var(--spacing-0);
  }
}

.pb-0-0 {
  padding-bottom: var(--spacing-0);
}
@media (min-width: 992px) {
  .pb-0-0 {
    padding-bottom: var(--spacing-0);
  }
}

.p-inline-0-0 {
  padding-inline: var(--spacing-0);
}
@media (min-width: 992px) {
  .p-inline-0-0 {
    padding-inline: var(--spacing-0);
  }
}

.m-0-0 {
  margin: var(--spacing-0);
}
@media (min-width: 992px) {
  .m-0-0 {
    margin: var(--spacing-0);
  }
}

.mt-0-0 {
  margin-top: var(--spacing-0) !important;
}
@media (min-width: 992px) {
  .mt-0-0 {
    margin-top: var(--spacing-0) !important;
  }
}

.mb-0-0 {
  margin-bottom: var(--spacing-0) !important;
}
@media (min-width: 992px) {
  .mb-0-0 {
    margin-bottom: var(--spacing-0) !important;
  }
}

.ml-0-0 {
  margin-left: var(--spacing-0) !important;
}
@media (min-width: 992px) {
  .ml-0-0 {
    margin-left: var(--spacing-0) !important;
  }
}

.gap-0-0 {
  gap: var(--spacing-0);
}
@media (min-width: 992px) {
  .gap-0-0 {
    gap: var(--spacing-0);
  }
}

.p-0-1 {
  padding: var(--spacing-0);
}
@media (min-width: 992px) {
  .p-0-1 {
    padding: var(--spacing-1);
  }
}

.pt-0-1 {
  padding-top: var(--spacing-0);
}
@media (min-width: 992px) {
  .pt-0-1 {
    padding-top: var(--spacing-1);
  }
}

.pb-0-1 {
  padding-bottom: var(--spacing-0);
}
@media (min-width: 992px) {
  .pb-0-1 {
    padding-bottom: var(--spacing-1);
  }
}

.p-inline-0-1 {
  padding-inline: var(--spacing-0);
}
@media (min-width: 992px) {
  .p-inline-0-1 {
    padding-inline: var(--spacing-1);
  }
}

.m-0-1 {
  margin: var(--spacing-0);
}
@media (min-width: 992px) {
  .m-0-1 {
    margin: var(--spacing-1);
  }
}

.mt-0-1 {
  margin-top: var(--spacing-0) !important;
}
@media (min-width: 992px) {
  .mt-0-1 {
    margin-top: var(--spacing-1) !important;
  }
}

.mb-0-1 {
  margin-bottom: var(--spacing-0) !important;
}
@media (min-width: 992px) {
  .mb-0-1 {
    margin-bottom: var(--spacing-1) !important;
  }
}

.ml-0-1 {
  margin-left: var(--spacing-0) !important;
}
@media (min-width: 992px) {
  .ml-0-1 {
    margin-left: var(--spacing-1) !important;
  }
}

.gap-0-1 {
  gap: var(--spacing-0);
}
@media (min-width: 992px) {
  .gap-0-1 {
    gap: var(--spacing-1);
  }
}

.p-0-2 {
  padding: var(--spacing-0);
}
@media (min-width: 992px) {
  .p-0-2 {
    padding: var(--spacing-2);
  }
}

.pt-0-2 {
  padding-top: var(--spacing-0);
}
@media (min-width: 992px) {
  .pt-0-2 {
    padding-top: var(--spacing-2);
  }
}

.pb-0-2 {
  padding-bottom: var(--spacing-0);
}
@media (min-width: 992px) {
  .pb-0-2 {
    padding-bottom: var(--spacing-2);
  }
}

.p-inline-0-2 {
  padding-inline: var(--spacing-0);
}
@media (min-width: 992px) {
  .p-inline-0-2 {
    padding-inline: var(--spacing-2);
  }
}

.m-0-2 {
  margin: var(--spacing-0);
}
@media (min-width: 992px) {
  .m-0-2 {
    margin: var(--spacing-2);
  }
}

.mt-0-2 {
  margin-top: var(--spacing-0) !important;
}
@media (min-width: 992px) {
  .mt-0-2 {
    margin-top: var(--spacing-2) !important;
  }
}

.mb-0-2 {
  margin-bottom: var(--spacing-0) !important;
}
@media (min-width: 992px) {
  .mb-0-2 {
    margin-bottom: var(--spacing-2) !important;
  }
}

.ml-0-2 {
  margin-left: var(--spacing-0) !important;
}
@media (min-width: 992px) {
  .ml-0-2 {
    margin-left: var(--spacing-2) !important;
  }
}

.gap-0-2 {
  gap: var(--spacing-0);
}
@media (min-width: 992px) {
  .gap-0-2 {
    gap: var(--spacing-2);
  }
}

.p-0-25 {
  padding: var(--spacing-0);
}
@media (min-width: 992px) {
  .p-0-25 {
    padding: var(--spacing-25);
  }
}

.pt-0-25 {
  padding-top: var(--spacing-0);
}
@media (min-width: 992px) {
  .pt-0-25 {
    padding-top: var(--spacing-25);
  }
}

.pb-0-25 {
  padding-bottom: var(--spacing-0);
}
@media (min-width: 992px) {
  .pb-0-25 {
    padding-bottom: var(--spacing-25);
  }
}

.p-inline-0-25 {
  padding-inline: var(--spacing-0);
}
@media (min-width: 992px) {
  .p-inline-0-25 {
    padding-inline: var(--spacing-25);
  }
}

.m-0-25 {
  margin: var(--spacing-0);
}
@media (min-width: 992px) {
  .m-0-25 {
    margin: var(--spacing-25);
  }
}

.mt-0-25 {
  margin-top: var(--spacing-0) !important;
}
@media (min-width: 992px) {
  .mt-0-25 {
    margin-top: var(--spacing-25) !important;
  }
}

.mb-0-25 {
  margin-bottom: var(--spacing-0) !important;
}
@media (min-width: 992px) {
  .mb-0-25 {
    margin-bottom: var(--spacing-25) !important;
  }
}

.ml-0-25 {
  margin-left: var(--spacing-0) !important;
}
@media (min-width: 992px) {
  .ml-0-25 {
    margin-left: var(--spacing-25) !important;
  }
}

.gap-0-25 {
  gap: var(--spacing-0);
}
@media (min-width: 992px) {
  .gap-0-25 {
    gap: var(--spacing-25);
  }
}

.p-0-3 {
  padding: var(--spacing-0);
}
@media (min-width: 992px) {
  .p-0-3 {
    padding: var(--spacing-3);
  }
}

.pt-0-3 {
  padding-top: var(--spacing-0);
}
@media (min-width: 992px) {
  .pt-0-3 {
    padding-top: var(--spacing-3);
  }
}

.pb-0-3 {
  padding-bottom: var(--spacing-0);
}
@media (min-width: 992px) {
  .pb-0-3 {
    padding-bottom: var(--spacing-3);
  }
}

.p-inline-0-3 {
  padding-inline: var(--spacing-0);
}
@media (min-width: 992px) {
  .p-inline-0-3 {
    padding-inline: var(--spacing-3);
  }
}

.m-0-3 {
  margin: var(--spacing-0);
}
@media (min-width: 992px) {
  .m-0-3 {
    margin: var(--spacing-3);
  }
}

.mt-0-3 {
  margin-top: var(--spacing-0) !important;
}
@media (min-width: 992px) {
  .mt-0-3 {
    margin-top: var(--spacing-3) !important;
  }
}

.mb-0-3 {
  margin-bottom: var(--spacing-0) !important;
}
@media (min-width: 992px) {
  .mb-0-3 {
    margin-bottom: var(--spacing-3) !important;
  }
}

.ml-0-3 {
  margin-left: var(--spacing-0) !important;
}
@media (min-width: 992px) {
  .ml-0-3 {
    margin-left: var(--spacing-3) !important;
  }
}

.gap-0-3 {
  gap: var(--spacing-0);
}
@media (min-width: 992px) {
  .gap-0-3 {
    gap: var(--spacing-3);
  }
}

.p-0-35 {
  padding: var(--spacing-0);
}
@media (min-width: 992px) {
  .p-0-35 {
    padding: var(--spacing-35);
  }
}

.pt-0-35 {
  padding-top: var(--spacing-0);
}
@media (min-width: 992px) {
  .pt-0-35 {
    padding-top: var(--spacing-35);
  }
}

.pb-0-35 {
  padding-bottom: var(--spacing-0);
}
@media (min-width: 992px) {
  .pb-0-35 {
    padding-bottom: var(--spacing-35);
  }
}

.p-inline-0-35 {
  padding-inline: var(--spacing-0);
}
@media (min-width: 992px) {
  .p-inline-0-35 {
    padding-inline: var(--spacing-35);
  }
}

.m-0-35 {
  margin: var(--spacing-0);
}
@media (min-width: 992px) {
  .m-0-35 {
    margin: var(--spacing-35);
  }
}

.mt-0-35 {
  margin-top: var(--spacing-0) !important;
}
@media (min-width: 992px) {
  .mt-0-35 {
    margin-top: var(--spacing-35) !important;
  }
}

.mb-0-35 {
  margin-bottom: var(--spacing-0) !important;
}
@media (min-width: 992px) {
  .mb-0-35 {
    margin-bottom: var(--spacing-35) !important;
  }
}

.ml-0-35 {
  margin-left: var(--spacing-0) !important;
}
@media (min-width: 992px) {
  .ml-0-35 {
    margin-left: var(--spacing-35) !important;
  }
}

.gap-0-35 {
  gap: var(--spacing-0);
}
@media (min-width: 992px) {
  .gap-0-35 {
    gap: var(--spacing-35);
  }
}

.p-0-4 {
  padding: var(--spacing-0);
}
@media (min-width: 992px) {
  .p-0-4 {
    padding: var(--spacing-4);
  }
}

.pt-0-4 {
  padding-top: var(--spacing-0);
}
@media (min-width: 992px) {
  .pt-0-4 {
    padding-top: var(--spacing-4);
  }
}

.pb-0-4 {
  padding-bottom: var(--spacing-0);
}
@media (min-width: 992px) {
  .pb-0-4 {
    padding-bottom: var(--spacing-4);
  }
}

.p-inline-0-4 {
  padding-inline: var(--spacing-0);
}
@media (min-width: 992px) {
  .p-inline-0-4 {
    padding-inline: var(--spacing-4);
  }
}

.m-0-4 {
  margin: var(--spacing-0);
}
@media (min-width: 992px) {
  .m-0-4 {
    margin: var(--spacing-4);
  }
}

.mt-0-4 {
  margin-top: var(--spacing-0) !important;
}
@media (min-width: 992px) {
  .mt-0-4 {
    margin-top: var(--spacing-4) !important;
  }
}

.mb-0-4 {
  margin-bottom: var(--spacing-0) !important;
}
@media (min-width: 992px) {
  .mb-0-4 {
    margin-bottom: var(--spacing-4) !important;
  }
}

.ml-0-4 {
  margin-left: var(--spacing-0) !important;
}
@media (min-width: 992px) {
  .ml-0-4 {
    margin-left: var(--spacing-4) !important;
  }
}

.gap-0-4 {
  gap: var(--spacing-0);
}
@media (min-width: 992px) {
  .gap-0-4 {
    gap: var(--spacing-4);
  }
}

.p-0-5 {
  padding: var(--spacing-0);
}
@media (min-width: 992px) {
  .p-0-5 {
    padding: var(--spacing-5);
  }
}

.pt-0-5 {
  padding-top: var(--spacing-0);
}
@media (min-width: 992px) {
  .pt-0-5 {
    padding-top: var(--spacing-5);
  }
}

.pb-0-5 {
  padding-bottom: var(--spacing-0);
}
@media (min-width: 992px) {
  .pb-0-5 {
    padding-bottom: var(--spacing-5);
  }
}

.p-inline-0-5 {
  padding-inline: var(--spacing-0);
}
@media (min-width: 992px) {
  .p-inline-0-5 {
    padding-inline: var(--spacing-5);
  }
}

.m-0-5 {
  margin: var(--spacing-0);
}
@media (min-width: 992px) {
  .m-0-5 {
    margin: var(--spacing-5);
  }
}

.mt-0-5 {
  margin-top: var(--spacing-0) !important;
}
@media (min-width: 992px) {
  .mt-0-5 {
    margin-top: var(--spacing-5) !important;
  }
}

.mb-0-5 {
  margin-bottom: var(--spacing-0) !important;
}
@media (min-width: 992px) {
  .mb-0-5 {
    margin-bottom: var(--spacing-5) !important;
  }
}

.ml-0-5 {
  margin-left: var(--spacing-0) !important;
}
@media (min-width: 992px) {
  .ml-0-5 {
    margin-left: var(--spacing-5) !important;
  }
}

.gap-0-5 {
  gap: var(--spacing-0);
}
@media (min-width: 992px) {
  .gap-0-5 {
    gap: var(--spacing-5);
  }
}

.p-0-6 {
  padding: var(--spacing-0);
}
@media (min-width: 992px) {
  .p-0-6 {
    padding: var(--spacing-6);
  }
}

.pt-0-6 {
  padding-top: var(--spacing-0);
}
@media (min-width: 992px) {
  .pt-0-6 {
    padding-top: var(--spacing-6);
  }
}

.pb-0-6 {
  padding-bottom: var(--spacing-0);
}
@media (min-width: 992px) {
  .pb-0-6 {
    padding-bottom: var(--spacing-6);
  }
}

.p-inline-0-6 {
  padding-inline: var(--spacing-0);
}
@media (min-width: 992px) {
  .p-inline-0-6 {
    padding-inline: var(--spacing-6);
  }
}

.m-0-6 {
  margin: var(--spacing-0);
}
@media (min-width: 992px) {
  .m-0-6 {
    margin: var(--spacing-6);
  }
}

.mt-0-6 {
  margin-top: var(--spacing-0) !important;
}
@media (min-width: 992px) {
  .mt-0-6 {
    margin-top: var(--spacing-6) !important;
  }
}

.mb-0-6 {
  margin-bottom: var(--spacing-0) !important;
}
@media (min-width: 992px) {
  .mb-0-6 {
    margin-bottom: var(--spacing-6) !important;
  }
}

.ml-0-6 {
  margin-left: var(--spacing-0) !important;
}
@media (min-width: 992px) {
  .ml-0-6 {
    margin-left: var(--spacing-6) !important;
  }
}

.gap-0-6 {
  gap: var(--spacing-0);
}
@media (min-width: 992px) {
  .gap-0-6 {
    gap: var(--spacing-6);
  }
}

.p-0-7 {
  padding: var(--spacing-0);
}
@media (min-width: 992px) {
  .p-0-7 {
    padding: var(--spacing-7);
  }
}

.pt-0-7 {
  padding-top: var(--spacing-0);
}
@media (min-width: 992px) {
  .pt-0-7 {
    padding-top: var(--spacing-7);
  }
}

.pb-0-7 {
  padding-bottom: var(--spacing-0);
}
@media (min-width: 992px) {
  .pb-0-7 {
    padding-bottom: var(--spacing-7);
  }
}

.p-inline-0-7 {
  padding-inline: var(--spacing-0);
}
@media (min-width: 992px) {
  .p-inline-0-7 {
    padding-inline: var(--spacing-7);
  }
}

.m-0-7 {
  margin: var(--spacing-0);
}
@media (min-width: 992px) {
  .m-0-7 {
    margin: var(--spacing-7);
  }
}

.mt-0-7 {
  margin-top: var(--spacing-0) !important;
}
@media (min-width: 992px) {
  .mt-0-7 {
    margin-top: var(--spacing-7) !important;
  }
}

.mb-0-7 {
  margin-bottom: var(--spacing-0) !important;
}
@media (min-width: 992px) {
  .mb-0-7 {
    margin-bottom: var(--spacing-7) !important;
  }
}

.ml-0-7 {
  margin-left: var(--spacing-0) !important;
}
@media (min-width: 992px) {
  .ml-0-7 {
    margin-left: var(--spacing-7) !important;
  }
}

.gap-0-7 {
  gap: var(--spacing-0);
}
@media (min-width: 992px) {
  .gap-0-7 {
    gap: var(--spacing-7);
  }
}

.p-0-8 {
  padding: var(--spacing-0);
}
@media (min-width: 992px) {
  .p-0-8 {
    padding: var(--spacing-8);
  }
}

.pt-0-8 {
  padding-top: var(--spacing-0);
}
@media (min-width: 992px) {
  .pt-0-8 {
    padding-top: var(--spacing-8);
  }
}

.pb-0-8 {
  padding-bottom: var(--spacing-0);
}
@media (min-width: 992px) {
  .pb-0-8 {
    padding-bottom: var(--spacing-8);
  }
}

.p-inline-0-8 {
  padding-inline: var(--spacing-0);
}
@media (min-width: 992px) {
  .p-inline-0-8 {
    padding-inline: var(--spacing-8);
  }
}

.m-0-8 {
  margin: var(--spacing-0);
}
@media (min-width: 992px) {
  .m-0-8 {
    margin: var(--spacing-8);
  }
}

.mt-0-8 {
  margin-top: var(--spacing-0) !important;
}
@media (min-width: 992px) {
  .mt-0-8 {
    margin-top: var(--spacing-8) !important;
  }
}

.mb-0-8 {
  margin-bottom: var(--spacing-0) !important;
}
@media (min-width: 992px) {
  .mb-0-8 {
    margin-bottom: var(--spacing-8) !important;
  }
}

.ml-0-8 {
  margin-left: var(--spacing-0) !important;
}
@media (min-width: 992px) {
  .ml-0-8 {
    margin-left: var(--spacing-8) !important;
  }
}

.gap-0-8 {
  gap: var(--spacing-0);
}
@media (min-width: 992px) {
  .gap-0-8 {
    gap: var(--spacing-8);
  }
}

.p-0-9 {
  padding: var(--spacing-0);
}
@media (min-width: 992px) {
  .p-0-9 {
    padding: var(--spacing-9);
  }
}

.pt-0-9 {
  padding-top: var(--spacing-0);
}
@media (min-width: 992px) {
  .pt-0-9 {
    padding-top: var(--spacing-9);
  }
}

.pb-0-9 {
  padding-bottom: var(--spacing-0);
}
@media (min-width: 992px) {
  .pb-0-9 {
    padding-bottom: var(--spacing-9);
  }
}

.p-inline-0-9 {
  padding-inline: var(--spacing-0);
}
@media (min-width: 992px) {
  .p-inline-0-9 {
    padding-inline: var(--spacing-9);
  }
}

.m-0-9 {
  margin: var(--spacing-0);
}
@media (min-width: 992px) {
  .m-0-9 {
    margin: var(--spacing-9);
  }
}

.mt-0-9 {
  margin-top: var(--spacing-0) !important;
}
@media (min-width: 992px) {
  .mt-0-9 {
    margin-top: var(--spacing-9) !important;
  }
}

.mb-0-9 {
  margin-bottom: var(--spacing-0) !important;
}
@media (min-width: 992px) {
  .mb-0-9 {
    margin-bottom: var(--spacing-9) !important;
  }
}

.ml-0-9 {
  margin-left: var(--spacing-0) !important;
}
@media (min-width: 992px) {
  .ml-0-9 {
    margin-left: var(--spacing-9) !important;
  }
}

.gap-0-9 {
  gap: var(--spacing-0);
}
@media (min-width: 992px) {
  .gap-0-9 {
    gap: var(--spacing-9);
  }
}

.p-1-auto {
  padding: var(--spacing-1);
}
@media (min-width: 992px) {
  .p-1-auto {
    padding: auto;
  }
}

.pt-1-auto {
  padding-top: var(--spacing-1);
}
@media (min-width: 992px) {
  .pt-1-auto {
    padding-top: auto;
  }
}

.pb-1-auto {
  padding-bottom: var(--spacing-1);
}
@media (min-width: 992px) {
  .pb-1-auto {
    padding-bottom: auto;
  }
}

.p-inline-1-auto {
  padding-inline: var(--spacing-1);
}
@media (min-width: 992px) {
  .p-inline-1-auto {
    padding-inline: auto;
  }
}

.m-1-auto {
  margin: var(--spacing-1);
}
@media (min-width: 992px) {
  .m-1-auto {
    margin: auto;
  }
}

.mt-1-auto {
  margin-top: var(--spacing-1) !important;
}
@media (min-width: 992px) {
  .mt-1-auto {
    margin-top: auto !important;
  }
}

.mb-1-auto {
  margin-bottom: var(--spacing-1) !important;
}
@media (min-width: 992px) {
  .mb-1-auto {
    margin-bottom: auto !important;
  }
}

.ml-1-auto {
  margin-left: var(--spacing-1) !important;
}
@media (min-width: 992px) {
  .ml-1-auto {
    margin-left: auto !important;
  }
}

.gap-1-auto {
  gap: var(--spacing-1);
}
@media (min-width: 992px) {
  .gap-1-auto {
    gap: auto;
  }
}

.p-1-0 {
  padding: var(--spacing-1);
}
@media (min-width: 992px) {
  .p-1-0 {
    padding: var(--spacing-0);
  }
}

.pt-1-0 {
  padding-top: var(--spacing-1);
}
@media (min-width: 992px) {
  .pt-1-0 {
    padding-top: var(--spacing-0);
  }
}

.pb-1-0 {
  padding-bottom: var(--spacing-1);
}
@media (min-width: 992px) {
  .pb-1-0 {
    padding-bottom: var(--spacing-0);
  }
}

.p-inline-1-0 {
  padding-inline: var(--spacing-1);
}
@media (min-width: 992px) {
  .p-inline-1-0 {
    padding-inline: var(--spacing-0);
  }
}

.m-1-0 {
  margin: var(--spacing-1);
}
@media (min-width: 992px) {
  .m-1-0 {
    margin: var(--spacing-0);
  }
}

.mt-1-0 {
  margin-top: var(--spacing-1) !important;
}
@media (min-width: 992px) {
  .mt-1-0 {
    margin-top: var(--spacing-0) !important;
  }
}

.mb-1-0 {
  margin-bottom: var(--spacing-1) !important;
}
@media (min-width: 992px) {
  .mb-1-0 {
    margin-bottom: var(--spacing-0) !important;
  }
}

.ml-1-0 {
  margin-left: var(--spacing-1) !important;
}
@media (min-width: 992px) {
  .ml-1-0 {
    margin-left: var(--spacing-0) !important;
  }
}

.gap-1-0 {
  gap: var(--spacing-1);
}
@media (min-width: 992px) {
  .gap-1-0 {
    gap: var(--spacing-0);
  }
}

.p-1-1 {
  padding: var(--spacing-1);
}
@media (min-width: 992px) {
  .p-1-1 {
    padding: var(--spacing-1);
  }
}

.pt-1-1 {
  padding-top: var(--spacing-1);
}
@media (min-width: 992px) {
  .pt-1-1 {
    padding-top: var(--spacing-1);
  }
}

.pb-1-1 {
  padding-bottom: var(--spacing-1);
}
@media (min-width: 992px) {
  .pb-1-1 {
    padding-bottom: var(--spacing-1);
  }
}

.p-inline-1-1 {
  padding-inline: var(--spacing-1);
}
@media (min-width: 992px) {
  .p-inline-1-1 {
    padding-inline: var(--spacing-1);
  }
}

.m-1-1 {
  margin: var(--spacing-1);
}
@media (min-width: 992px) {
  .m-1-1 {
    margin: var(--spacing-1);
  }
}

.mt-1-1 {
  margin-top: var(--spacing-1) !important;
}
@media (min-width: 992px) {
  .mt-1-1 {
    margin-top: var(--spacing-1) !important;
  }
}

.mb-1-1 {
  margin-bottom: var(--spacing-1) !important;
}
@media (min-width: 992px) {
  .mb-1-1 {
    margin-bottom: var(--spacing-1) !important;
  }
}

.ml-1-1 {
  margin-left: var(--spacing-1) !important;
}
@media (min-width: 992px) {
  .ml-1-1 {
    margin-left: var(--spacing-1) !important;
  }
}

.gap-1-1 {
  gap: var(--spacing-1);
}
@media (min-width: 992px) {
  .gap-1-1 {
    gap: var(--spacing-1);
  }
}

.p-1-2 {
  padding: var(--spacing-1);
}
@media (min-width: 992px) {
  .p-1-2 {
    padding: var(--spacing-2);
  }
}

.pt-1-2 {
  padding-top: var(--spacing-1);
}
@media (min-width: 992px) {
  .pt-1-2 {
    padding-top: var(--spacing-2);
  }
}

.pb-1-2 {
  padding-bottom: var(--spacing-1);
}
@media (min-width: 992px) {
  .pb-1-2 {
    padding-bottom: var(--spacing-2);
  }
}

.p-inline-1-2 {
  padding-inline: var(--spacing-1);
}
@media (min-width: 992px) {
  .p-inline-1-2 {
    padding-inline: var(--spacing-2);
  }
}

.m-1-2 {
  margin: var(--spacing-1);
}
@media (min-width: 992px) {
  .m-1-2 {
    margin: var(--spacing-2);
  }
}

.mt-1-2 {
  margin-top: var(--spacing-1) !important;
}
@media (min-width: 992px) {
  .mt-1-2 {
    margin-top: var(--spacing-2) !important;
  }
}

.mb-1-2 {
  margin-bottom: var(--spacing-1) !important;
}
@media (min-width: 992px) {
  .mb-1-2 {
    margin-bottom: var(--spacing-2) !important;
  }
}

.ml-1-2 {
  margin-left: var(--spacing-1) !important;
}
@media (min-width: 992px) {
  .ml-1-2 {
    margin-left: var(--spacing-2) !important;
  }
}

.gap-1-2 {
  gap: var(--spacing-1);
}
@media (min-width: 992px) {
  .gap-1-2 {
    gap: var(--spacing-2);
  }
}

.p-1-25 {
  padding: var(--spacing-1);
}
@media (min-width: 992px) {
  .p-1-25 {
    padding: var(--spacing-25);
  }
}

.pt-1-25 {
  padding-top: var(--spacing-1);
}
@media (min-width: 992px) {
  .pt-1-25 {
    padding-top: var(--spacing-25);
  }
}

.pb-1-25 {
  padding-bottom: var(--spacing-1);
}
@media (min-width: 992px) {
  .pb-1-25 {
    padding-bottom: var(--spacing-25);
  }
}

.p-inline-1-25 {
  padding-inline: var(--spacing-1);
}
@media (min-width: 992px) {
  .p-inline-1-25 {
    padding-inline: var(--spacing-25);
  }
}

.m-1-25 {
  margin: var(--spacing-1);
}
@media (min-width: 992px) {
  .m-1-25 {
    margin: var(--spacing-25);
  }
}

.mt-1-25 {
  margin-top: var(--spacing-1) !important;
}
@media (min-width: 992px) {
  .mt-1-25 {
    margin-top: var(--spacing-25) !important;
  }
}

.mb-1-25 {
  margin-bottom: var(--spacing-1) !important;
}
@media (min-width: 992px) {
  .mb-1-25 {
    margin-bottom: var(--spacing-25) !important;
  }
}

.ml-1-25 {
  margin-left: var(--spacing-1) !important;
}
@media (min-width: 992px) {
  .ml-1-25 {
    margin-left: var(--spacing-25) !important;
  }
}

.gap-1-25 {
  gap: var(--spacing-1);
}
@media (min-width: 992px) {
  .gap-1-25 {
    gap: var(--spacing-25);
  }
}

.p-1-3 {
  padding: var(--spacing-1);
}
@media (min-width: 992px) {
  .p-1-3 {
    padding: var(--spacing-3);
  }
}

.pt-1-3 {
  padding-top: var(--spacing-1);
}
@media (min-width: 992px) {
  .pt-1-3 {
    padding-top: var(--spacing-3);
  }
}

.pb-1-3 {
  padding-bottom: var(--spacing-1);
}
@media (min-width: 992px) {
  .pb-1-3 {
    padding-bottom: var(--spacing-3);
  }
}

.p-inline-1-3 {
  padding-inline: var(--spacing-1);
}
@media (min-width: 992px) {
  .p-inline-1-3 {
    padding-inline: var(--spacing-3);
  }
}

.m-1-3 {
  margin: var(--spacing-1);
}
@media (min-width: 992px) {
  .m-1-3 {
    margin: var(--spacing-3);
  }
}

.mt-1-3 {
  margin-top: var(--spacing-1) !important;
}
@media (min-width: 992px) {
  .mt-1-3 {
    margin-top: var(--spacing-3) !important;
  }
}

.mb-1-3 {
  margin-bottom: var(--spacing-1) !important;
}
@media (min-width: 992px) {
  .mb-1-3 {
    margin-bottom: var(--spacing-3) !important;
  }
}

.ml-1-3 {
  margin-left: var(--spacing-1) !important;
}
@media (min-width: 992px) {
  .ml-1-3 {
    margin-left: var(--spacing-3) !important;
  }
}

.gap-1-3 {
  gap: var(--spacing-1);
}
@media (min-width: 992px) {
  .gap-1-3 {
    gap: var(--spacing-3);
  }
}

.p-1-35 {
  padding: var(--spacing-1);
}
@media (min-width: 992px) {
  .p-1-35 {
    padding: var(--spacing-35);
  }
}

.pt-1-35 {
  padding-top: var(--spacing-1);
}
@media (min-width: 992px) {
  .pt-1-35 {
    padding-top: var(--spacing-35);
  }
}

.pb-1-35 {
  padding-bottom: var(--spacing-1);
}
@media (min-width: 992px) {
  .pb-1-35 {
    padding-bottom: var(--spacing-35);
  }
}

.p-inline-1-35 {
  padding-inline: var(--spacing-1);
}
@media (min-width: 992px) {
  .p-inline-1-35 {
    padding-inline: var(--spacing-35);
  }
}

.m-1-35 {
  margin: var(--spacing-1);
}
@media (min-width: 992px) {
  .m-1-35 {
    margin: var(--spacing-35);
  }
}

.mt-1-35 {
  margin-top: var(--spacing-1) !important;
}
@media (min-width: 992px) {
  .mt-1-35 {
    margin-top: var(--spacing-35) !important;
  }
}

.mb-1-35 {
  margin-bottom: var(--spacing-1) !important;
}
@media (min-width: 992px) {
  .mb-1-35 {
    margin-bottom: var(--spacing-35) !important;
  }
}

.ml-1-35 {
  margin-left: var(--spacing-1) !important;
}
@media (min-width: 992px) {
  .ml-1-35 {
    margin-left: var(--spacing-35) !important;
  }
}

.gap-1-35 {
  gap: var(--spacing-1);
}
@media (min-width: 992px) {
  .gap-1-35 {
    gap: var(--spacing-35);
  }
}

.p-1-4 {
  padding: var(--spacing-1);
}
@media (min-width: 992px) {
  .p-1-4 {
    padding: var(--spacing-4);
  }
}

.pt-1-4 {
  padding-top: var(--spacing-1);
}
@media (min-width: 992px) {
  .pt-1-4 {
    padding-top: var(--spacing-4);
  }
}

.pb-1-4 {
  padding-bottom: var(--spacing-1);
}
@media (min-width: 992px) {
  .pb-1-4 {
    padding-bottom: var(--spacing-4);
  }
}

.p-inline-1-4 {
  padding-inline: var(--spacing-1);
}
@media (min-width: 992px) {
  .p-inline-1-4 {
    padding-inline: var(--spacing-4);
  }
}

.m-1-4 {
  margin: var(--spacing-1);
}
@media (min-width: 992px) {
  .m-1-4 {
    margin: var(--spacing-4);
  }
}

.mt-1-4 {
  margin-top: var(--spacing-1) !important;
}
@media (min-width: 992px) {
  .mt-1-4 {
    margin-top: var(--spacing-4) !important;
  }
}

.mb-1-4 {
  margin-bottom: var(--spacing-1) !important;
}
@media (min-width: 992px) {
  .mb-1-4 {
    margin-bottom: var(--spacing-4) !important;
  }
}

.ml-1-4 {
  margin-left: var(--spacing-1) !important;
}
@media (min-width: 992px) {
  .ml-1-4 {
    margin-left: var(--spacing-4) !important;
  }
}

.gap-1-4 {
  gap: var(--spacing-1);
}
@media (min-width: 992px) {
  .gap-1-4 {
    gap: var(--spacing-4);
  }
}

.p-1-5 {
  padding: var(--spacing-1);
}
@media (min-width: 992px) {
  .p-1-5 {
    padding: var(--spacing-5);
  }
}

.pt-1-5 {
  padding-top: var(--spacing-1);
}
@media (min-width: 992px) {
  .pt-1-5 {
    padding-top: var(--spacing-5);
  }
}

.pb-1-5 {
  padding-bottom: var(--spacing-1);
}
@media (min-width: 992px) {
  .pb-1-5 {
    padding-bottom: var(--spacing-5);
  }
}

.p-inline-1-5 {
  padding-inline: var(--spacing-1);
}
@media (min-width: 992px) {
  .p-inline-1-5 {
    padding-inline: var(--spacing-5);
  }
}

.m-1-5 {
  margin: var(--spacing-1);
}
@media (min-width: 992px) {
  .m-1-5 {
    margin: var(--spacing-5);
  }
}

.mt-1-5 {
  margin-top: var(--spacing-1) !important;
}
@media (min-width: 992px) {
  .mt-1-5 {
    margin-top: var(--spacing-5) !important;
  }
}

.mb-1-5 {
  margin-bottom: var(--spacing-1) !important;
}
@media (min-width: 992px) {
  .mb-1-5 {
    margin-bottom: var(--spacing-5) !important;
  }
}

.ml-1-5 {
  margin-left: var(--spacing-1) !important;
}
@media (min-width: 992px) {
  .ml-1-5 {
    margin-left: var(--spacing-5) !important;
  }
}

.gap-1-5 {
  gap: var(--spacing-1);
}
@media (min-width: 992px) {
  .gap-1-5 {
    gap: var(--spacing-5);
  }
}

.p-1-6 {
  padding: var(--spacing-1);
}
@media (min-width: 992px) {
  .p-1-6 {
    padding: var(--spacing-6);
  }
}

.pt-1-6 {
  padding-top: var(--spacing-1);
}
@media (min-width: 992px) {
  .pt-1-6 {
    padding-top: var(--spacing-6);
  }
}

.pb-1-6 {
  padding-bottom: var(--spacing-1);
}
@media (min-width: 992px) {
  .pb-1-6 {
    padding-bottom: var(--spacing-6);
  }
}

.p-inline-1-6 {
  padding-inline: var(--spacing-1);
}
@media (min-width: 992px) {
  .p-inline-1-6 {
    padding-inline: var(--spacing-6);
  }
}

.m-1-6 {
  margin: var(--spacing-1);
}
@media (min-width: 992px) {
  .m-1-6 {
    margin: var(--spacing-6);
  }
}

.mt-1-6 {
  margin-top: var(--spacing-1) !important;
}
@media (min-width: 992px) {
  .mt-1-6 {
    margin-top: var(--spacing-6) !important;
  }
}

.mb-1-6 {
  margin-bottom: var(--spacing-1) !important;
}
@media (min-width: 992px) {
  .mb-1-6 {
    margin-bottom: var(--spacing-6) !important;
  }
}

.ml-1-6 {
  margin-left: var(--spacing-1) !important;
}
@media (min-width: 992px) {
  .ml-1-6 {
    margin-left: var(--spacing-6) !important;
  }
}

.gap-1-6 {
  gap: var(--spacing-1);
}
@media (min-width: 992px) {
  .gap-1-6 {
    gap: var(--spacing-6);
  }
}

.p-1-7 {
  padding: var(--spacing-1);
}
@media (min-width: 992px) {
  .p-1-7 {
    padding: var(--spacing-7);
  }
}

.pt-1-7 {
  padding-top: var(--spacing-1);
}
@media (min-width: 992px) {
  .pt-1-7 {
    padding-top: var(--spacing-7);
  }
}

.pb-1-7 {
  padding-bottom: var(--spacing-1);
}
@media (min-width: 992px) {
  .pb-1-7 {
    padding-bottom: var(--spacing-7);
  }
}

.p-inline-1-7 {
  padding-inline: var(--spacing-1);
}
@media (min-width: 992px) {
  .p-inline-1-7 {
    padding-inline: var(--spacing-7);
  }
}

.m-1-7 {
  margin: var(--spacing-1);
}
@media (min-width: 992px) {
  .m-1-7 {
    margin: var(--spacing-7);
  }
}

.mt-1-7 {
  margin-top: var(--spacing-1) !important;
}
@media (min-width: 992px) {
  .mt-1-7 {
    margin-top: var(--spacing-7) !important;
  }
}

.mb-1-7 {
  margin-bottom: var(--spacing-1) !important;
}
@media (min-width: 992px) {
  .mb-1-7 {
    margin-bottom: var(--spacing-7) !important;
  }
}

.ml-1-7 {
  margin-left: var(--spacing-1) !important;
}
@media (min-width: 992px) {
  .ml-1-7 {
    margin-left: var(--spacing-7) !important;
  }
}

.gap-1-7 {
  gap: var(--spacing-1);
}
@media (min-width: 992px) {
  .gap-1-7 {
    gap: var(--spacing-7);
  }
}

.p-1-8 {
  padding: var(--spacing-1);
}
@media (min-width: 992px) {
  .p-1-8 {
    padding: var(--spacing-8);
  }
}

.pt-1-8 {
  padding-top: var(--spacing-1);
}
@media (min-width: 992px) {
  .pt-1-8 {
    padding-top: var(--spacing-8);
  }
}

.pb-1-8 {
  padding-bottom: var(--spacing-1);
}
@media (min-width: 992px) {
  .pb-1-8 {
    padding-bottom: var(--spacing-8);
  }
}

.p-inline-1-8 {
  padding-inline: var(--spacing-1);
}
@media (min-width: 992px) {
  .p-inline-1-8 {
    padding-inline: var(--spacing-8);
  }
}

.m-1-8 {
  margin: var(--spacing-1);
}
@media (min-width: 992px) {
  .m-1-8 {
    margin: var(--spacing-8);
  }
}

.mt-1-8 {
  margin-top: var(--spacing-1) !important;
}
@media (min-width: 992px) {
  .mt-1-8 {
    margin-top: var(--spacing-8) !important;
  }
}

.mb-1-8 {
  margin-bottom: var(--spacing-1) !important;
}
@media (min-width: 992px) {
  .mb-1-8 {
    margin-bottom: var(--spacing-8) !important;
  }
}

.ml-1-8 {
  margin-left: var(--spacing-1) !important;
}
@media (min-width: 992px) {
  .ml-1-8 {
    margin-left: var(--spacing-8) !important;
  }
}

.gap-1-8 {
  gap: var(--spacing-1);
}
@media (min-width: 992px) {
  .gap-1-8 {
    gap: var(--spacing-8);
  }
}

.p-1-9 {
  padding: var(--spacing-1);
}
@media (min-width: 992px) {
  .p-1-9 {
    padding: var(--spacing-9);
  }
}

.pt-1-9 {
  padding-top: var(--spacing-1);
}
@media (min-width: 992px) {
  .pt-1-9 {
    padding-top: var(--spacing-9);
  }
}

.pb-1-9 {
  padding-bottom: var(--spacing-1);
}
@media (min-width: 992px) {
  .pb-1-9 {
    padding-bottom: var(--spacing-9);
  }
}

.p-inline-1-9 {
  padding-inline: var(--spacing-1);
}
@media (min-width: 992px) {
  .p-inline-1-9 {
    padding-inline: var(--spacing-9);
  }
}

.m-1-9 {
  margin: var(--spacing-1);
}
@media (min-width: 992px) {
  .m-1-9 {
    margin: var(--spacing-9);
  }
}

.mt-1-9 {
  margin-top: var(--spacing-1) !important;
}
@media (min-width: 992px) {
  .mt-1-9 {
    margin-top: var(--spacing-9) !important;
  }
}

.mb-1-9 {
  margin-bottom: var(--spacing-1) !important;
}
@media (min-width: 992px) {
  .mb-1-9 {
    margin-bottom: var(--spacing-9) !important;
  }
}

.ml-1-9 {
  margin-left: var(--spacing-1) !important;
}
@media (min-width: 992px) {
  .ml-1-9 {
    margin-left: var(--spacing-9) !important;
  }
}

.gap-1-9 {
  gap: var(--spacing-1);
}
@media (min-width: 992px) {
  .gap-1-9 {
    gap: var(--spacing-9);
  }
}

.p-2-auto {
  padding: var(--spacing-2);
}
@media (min-width: 992px) {
  .p-2-auto {
    padding: auto;
  }
}

.pt-2-auto {
  padding-top: var(--spacing-2);
}
@media (min-width: 992px) {
  .pt-2-auto {
    padding-top: auto;
  }
}

.pb-2-auto {
  padding-bottom: var(--spacing-2);
}
@media (min-width: 992px) {
  .pb-2-auto {
    padding-bottom: auto;
  }
}

.p-inline-2-auto {
  padding-inline: var(--spacing-2);
}
@media (min-width: 992px) {
  .p-inline-2-auto {
    padding-inline: auto;
  }
}

.m-2-auto {
  margin: var(--spacing-2);
}
@media (min-width: 992px) {
  .m-2-auto {
    margin: auto;
  }
}

.mt-2-auto {
  margin-top: var(--spacing-2) !important;
}
@media (min-width: 992px) {
  .mt-2-auto {
    margin-top: auto !important;
  }
}

.mb-2-auto {
  margin-bottom: var(--spacing-2) !important;
}
@media (min-width: 992px) {
  .mb-2-auto {
    margin-bottom: auto !important;
  }
}

.ml-2-auto {
  margin-left: var(--spacing-2) !important;
}
@media (min-width: 992px) {
  .ml-2-auto {
    margin-left: auto !important;
  }
}

.gap-2-auto {
  gap: var(--spacing-2);
}
@media (min-width: 992px) {
  .gap-2-auto {
    gap: auto;
  }
}

.p-2-0 {
  padding: var(--spacing-2);
}
@media (min-width: 992px) {
  .p-2-0 {
    padding: var(--spacing-0);
  }
}

.pt-2-0 {
  padding-top: var(--spacing-2);
}
@media (min-width: 992px) {
  .pt-2-0 {
    padding-top: var(--spacing-0);
  }
}

.pb-2-0 {
  padding-bottom: var(--spacing-2);
}
@media (min-width: 992px) {
  .pb-2-0 {
    padding-bottom: var(--spacing-0);
  }
}

.p-inline-2-0 {
  padding-inline: var(--spacing-2);
}
@media (min-width: 992px) {
  .p-inline-2-0 {
    padding-inline: var(--spacing-0);
  }
}

.m-2-0 {
  margin: var(--spacing-2);
}
@media (min-width: 992px) {
  .m-2-0 {
    margin: var(--spacing-0);
  }
}

.mt-2-0 {
  margin-top: var(--spacing-2) !important;
}
@media (min-width: 992px) {
  .mt-2-0 {
    margin-top: var(--spacing-0) !important;
  }
}

.mb-2-0 {
  margin-bottom: var(--spacing-2) !important;
}
@media (min-width: 992px) {
  .mb-2-0 {
    margin-bottom: var(--spacing-0) !important;
  }
}

.ml-2-0 {
  margin-left: var(--spacing-2) !important;
}
@media (min-width: 992px) {
  .ml-2-0 {
    margin-left: var(--spacing-0) !important;
  }
}

.gap-2-0 {
  gap: var(--spacing-2);
}
@media (min-width: 992px) {
  .gap-2-0 {
    gap: var(--spacing-0);
  }
}

.p-2-1 {
  padding: var(--spacing-2);
}
@media (min-width: 992px) {
  .p-2-1 {
    padding: var(--spacing-1);
  }
}

.pt-2-1 {
  padding-top: var(--spacing-2);
}
@media (min-width: 992px) {
  .pt-2-1 {
    padding-top: var(--spacing-1);
  }
}

.pb-2-1 {
  padding-bottom: var(--spacing-2);
}
@media (min-width: 992px) {
  .pb-2-1 {
    padding-bottom: var(--spacing-1);
  }
}

.p-inline-2-1 {
  padding-inline: var(--spacing-2);
}
@media (min-width: 992px) {
  .p-inline-2-1 {
    padding-inline: var(--spacing-1);
  }
}

.m-2-1 {
  margin: var(--spacing-2);
}
@media (min-width: 992px) {
  .m-2-1 {
    margin: var(--spacing-1);
  }
}

.mt-2-1 {
  margin-top: var(--spacing-2) !important;
}
@media (min-width: 992px) {
  .mt-2-1 {
    margin-top: var(--spacing-1) !important;
  }
}

.mb-2-1 {
  margin-bottom: var(--spacing-2) !important;
}
@media (min-width: 992px) {
  .mb-2-1 {
    margin-bottom: var(--spacing-1) !important;
  }
}

.ml-2-1 {
  margin-left: var(--spacing-2) !important;
}
@media (min-width: 992px) {
  .ml-2-1 {
    margin-left: var(--spacing-1) !important;
  }
}

.gap-2-1 {
  gap: var(--spacing-2);
}
@media (min-width: 992px) {
  .gap-2-1 {
    gap: var(--spacing-1);
  }
}

.p-2-2 {
  padding: var(--spacing-2);
}
@media (min-width: 992px) {
  .p-2-2 {
    padding: var(--spacing-2);
  }
}

.pt-2-2 {
  padding-top: var(--spacing-2);
}
@media (min-width: 992px) {
  .pt-2-2 {
    padding-top: var(--spacing-2);
  }
}

.pb-2-2 {
  padding-bottom: var(--spacing-2);
}
@media (min-width: 992px) {
  .pb-2-2 {
    padding-bottom: var(--spacing-2);
  }
}

.p-inline-2-2 {
  padding-inline: var(--spacing-2);
}
@media (min-width: 992px) {
  .p-inline-2-2 {
    padding-inline: var(--spacing-2);
  }
}

.m-2-2 {
  margin: var(--spacing-2);
}
@media (min-width: 992px) {
  .m-2-2 {
    margin: var(--spacing-2);
  }
}

.mt-2-2 {
  margin-top: var(--spacing-2) !important;
}
@media (min-width: 992px) {
  .mt-2-2 {
    margin-top: var(--spacing-2) !important;
  }
}

.mb-2-2 {
  margin-bottom: var(--spacing-2) !important;
}
@media (min-width: 992px) {
  .mb-2-2 {
    margin-bottom: var(--spacing-2) !important;
  }
}

.ml-2-2 {
  margin-left: var(--spacing-2) !important;
}
@media (min-width: 992px) {
  .ml-2-2 {
    margin-left: var(--spacing-2) !important;
  }
}

.gap-2-2 {
  gap: var(--spacing-2);
}
@media (min-width: 992px) {
  .gap-2-2 {
    gap: var(--spacing-2);
  }
}

.p-2-25 {
  padding: var(--spacing-2);
}
@media (min-width: 992px) {
  .p-2-25 {
    padding: var(--spacing-25);
  }
}

.pt-2-25 {
  padding-top: var(--spacing-2);
}
@media (min-width: 992px) {
  .pt-2-25 {
    padding-top: var(--spacing-25);
  }
}

.pb-2-25 {
  padding-bottom: var(--spacing-2);
}
@media (min-width: 992px) {
  .pb-2-25 {
    padding-bottom: var(--spacing-25);
  }
}

.p-inline-2-25 {
  padding-inline: var(--spacing-2);
}
@media (min-width: 992px) {
  .p-inline-2-25 {
    padding-inline: var(--spacing-25);
  }
}

.m-2-25 {
  margin: var(--spacing-2);
}
@media (min-width: 992px) {
  .m-2-25 {
    margin: var(--spacing-25);
  }
}

.mt-2-25 {
  margin-top: var(--spacing-2) !important;
}
@media (min-width: 992px) {
  .mt-2-25 {
    margin-top: var(--spacing-25) !important;
  }
}

.mb-2-25 {
  margin-bottom: var(--spacing-2) !important;
}
@media (min-width: 992px) {
  .mb-2-25 {
    margin-bottom: var(--spacing-25) !important;
  }
}

.ml-2-25 {
  margin-left: var(--spacing-2) !important;
}
@media (min-width: 992px) {
  .ml-2-25 {
    margin-left: var(--spacing-25) !important;
  }
}

.gap-2-25 {
  gap: var(--spacing-2);
}
@media (min-width: 992px) {
  .gap-2-25 {
    gap: var(--spacing-25);
  }
}

.p-2-3 {
  padding: var(--spacing-2);
}
@media (min-width: 992px) {
  .p-2-3 {
    padding: var(--spacing-3);
  }
}

.pt-2-3 {
  padding-top: var(--spacing-2);
}
@media (min-width: 992px) {
  .pt-2-3 {
    padding-top: var(--spacing-3);
  }
}

.pb-2-3 {
  padding-bottom: var(--spacing-2);
}
@media (min-width: 992px) {
  .pb-2-3 {
    padding-bottom: var(--spacing-3);
  }
}

.p-inline-2-3 {
  padding-inline: var(--spacing-2);
}
@media (min-width: 992px) {
  .p-inline-2-3 {
    padding-inline: var(--spacing-3);
  }
}

.m-2-3 {
  margin: var(--spacing-2);
}
@media (min-width: 992px) {
  .m-2-3 {
    margin: var(--spacing-3);
  }
}

.mt-2-3 {
  margin-top: var(--spacing-2) !important;
}
@media (min-width: 992px) {
  .mt-2-3 {
    margin-top: var(--spacing-3) !important;
  }
}

.mb-2-3 {
  margin-bottom: var(--spacing-2) !important;
}
@media (min-width: 992px) {
  .mb-2-3 {
    margin-bottom: var(--spacing-3) !important;
  }
}

.ml-2-3 {
  margin-left: var(--spacing-2) !important;
}
@media (min-width: 992px) {
  .ml-2-3 {
    margin-left: var(--spacing-3) !important;
  }
}

.gap-2-3 {
  gap: var(--spacing-2);
}
@media (min-width: 992px) {
  .gap-2-3 {
    gap: var(--spacing-3);
  }
}

.p-2-35 {
  padding: var(--spacing-2);
}
@media (min-width: 992px) {
  .p-2-35 {
    padding: var(--spacing-35);
  }
}

.pt-2-35 {
  padding-top: var(--spacing-2);
}
@media (min-width: 992px) {
  .pt-2-35 {
    padding-top: var(--spacing-35);
  }
}

.pb-2-35 {
  padding-bottom: var(--spacing-2);
}
@media (min-width: 992px) {
  .pb-2-35 {
    padding-bottom: var(--spacing-35);
  }
}

.p-inline-2-35 {
  padding-inline: var(--spacing-2);
}
@media (min-width: 992px) {
  .p-inline-2-35 {
    padding-inline: var(--spacing-35);
  }
}

.m-2-35 {
  margin: var(--spacing-2);
}
@media (min-width: 992px) {
  .m-2-35 {
    margin: var(--spacing-35);
  }
}

.mt-2-35 {
  margin-top: var(--spacing-2) !important;
}
@media (min-width: 992px) {
  .mt-2-35 {
    margin-top: var(--spacing-35) !important;
  }
}

.mb-2-35 {
  margin-bottom: var(--spacing-2) !important;
}
@media (min-width: 992px) {
  .mb-2-35 {
    margin-bottom: var(--spacing-35) !important;
  }
}

.ml-2-35 {
  margin-left: var(--spacing-2) !important;
}
@media (min-width: 992px) {
  .ml-2-35 {
    margin-left: var(--spacing-35) !important;
  }
}

.gap-2-35 {
  gap: var(--spacing-2);
}
@media (min-width: 992px) {
  .gap-2-35 {
    gap: var(--spacing-35);
  }
}

.p-2-4 {
  padding: var(--spacing-2);
}
@media (min-width: 992px) {
  .p-2-4 {
    padding: var(--spacing-4);
  }
}

.pt-2-4 {
  padding-top: var(--spacing-2);
}
@media (min-width: 992px) {
  .pt-2-4 {
    padding-top: var(--spacing-4);
  }
}

.pb-2-4 {
  padding-bottom: var(--spacing-2);
}
@media (min-width: 992px) {
  .pb-2-4 {
    padding-bottom: var(--spacing-4);
  }
}

.p-inline-2-4 {
  padding-inline: var(--spacing-2);
}
@media (min-width: 992px) {
  .p-inline-2-4 {
    padding-inline: var(--spacing-4);
  }
}

.m-2-4 {
  margin: var(--spacing-2);
}
@media (min-width: 992px) {
  .m-2-4 {
    margin: var(--spacing-4);
  }
}

.mt-2-4 {
  margin-top: var(--spacing-2) !important;
}
@media (min-width: 992px) {
  .mt-2-4 {
    margin-top: var(--spacing-4) !important;
  }
}

.mb-2-4 {
  margin-bottom: var(--spacing-2) !important;
}
@media (min-width: 992px) {
  .mb-2-4 {
    margin-bottom: var(--spacing-4) !important;
  }
}

.ml-2-4 {
  margin-left: var(--spacing-2) !important;
}
@media (min-width: 992px) {
  .ml-2-4 {
    margin-left: var(--spacing-4) !important;
  }
}

.gap-2-4 {
  gap: var(--spacing-2);
}
@media (min-width: 992px) {
  .gap-2-4 {
    gap: var(--spacing-4);
  }
}

.p-2-5 {
  padding: var(--spacing-2);
}
@media (min-width: 992px) {
  .p-2-5 {
    padding: var(--spacing-5);
  }
}

.pt-2-5 {
  padding-top: var(--spacing-2);
}
@media (min-width: 992px) {
  .pt-2-5 {
    padding-top: var(--spacing-5);
  }
}

.pb-2-5 {
  padding-bottom: var(--spacing-2);
}
@media (min-width: 992px) {
  .pb-2-5 {
    padding-bottom: var(--spacing-5);
  }
}

.p-inline-2-5 {
  padding-inline: var(--spacing-2);
}
@media (min-width: 992px) {
  .p-inline-2-5 {
    padding-inline: var(--spacing-5);
  }
}

.m-2-5 {
  margin: var(--spacing-2);
}
@media (min-width: 992px) {
  .m-2-5 {
    margin: var(--spacing-5);
  }
}

.mt-2-5 {
  margin-top: var(--spacing-2) !important;
}
@media (min-width: 992px) {
  .mt-2-5 {
    margin-top: var(--spacing-5) !important;
  }
}

.mb-2-5 {
  margin-bottom: var(--spacing-2) !important;
}
@media (min-width: 992px) {
  .mb-2-5 {
    margin-bottom: var(--spacing-5) !important;
  }
}

.ml-2-5 {
  margin-left: var(--spacing-2) !important;
}
@media (min-width: 992px) {
  .ml-2-5 {
    margin-left: var(--spacing-5) !important;
  }
}

.gap-2-5 {
  gap: var(--spacing-2);
}
@media (min-width: 992px) {
  .gap-2-5 {
    gap: var(--spacing-5);
  }
}

.p-2-6 {
  padding: var(--spacing-2);
}
@media (min-width: 992px) {
  .p-2-6 {
    padding: var(--spacing-6);
  }
}

.pt-2-6 {
  padding-top: var(--spacing-2);
}
@media (min-width: 992px) {
  .pt-2-6 {
    padding-top: var(--spacing-6);
  }
}

.pb-2-6 {
  padding-bottom: var(--spacing-2);
}
@media (min-width: 992px) {
  .pb-2-6 {
    padding-bottom: var(--spacing-6);
  }
}

.p-inline-2-6 {
  padding-inline: var(--spacing-2);
}
@media (min-width: 992px) {
  .p-inline-2-6 {
    padding-inline: var(--spacing-6);
  }
}

.m-2-6 {
  margin: var(--spacing-2);
}
@media (min-width: 992px) {
  .m-2-6 {
    margin: var(--spacing-6);
  }
}

.mt-2-6 {
  margin-top: var(--spacing-2) !important;
}
@media (min-width: 992px) {
  .mt-2-6 {
    margin-top: var(--spacing-6) !important;
  }
}

.mb-2-6 {
  margin-bottom: var(--spacing-2) !important;
}
@media (min-width: 992px) {
  .mb-2-6 {
    margin-bottom: var(--spacing-6) !important;
  }
}

.ml-2-6 {
  margin-left: var(--spacing-2) !important;
}
@media (min-width: 992px) {
  .ml-2-6 {
    margin-left: var(--spacing-6) !important;
  }
}

.gap-2-6 {
  gap: var(--spacing-2);
}
@media (min-width: 992px) {
  .gap-2-6 {
    gap: var(--spacing-6);
  }
}

.p-2-7 {
  padding: var(--spacing-2);
}
@media (min-width: 992px) {
  .p-2-7 {
    padding: var(--spacing-7);
  }
}

.pt-2-7 {
  padding-top: var(--spacing-2);
}
@media (min-width: 992px) {
  .pt-2-7 {
    padding-top: var(--spacing-7);
  }
}

.pb-2-7 {
  padding-bottom: var(--spacing-2);
}
@media (min-width: 992px) {
  .pb-2-7 {
    padding-bottom: var(--spacing-7);
  }
}

.p-inline-2-7 {
  padding-inline: var(--spacing-2);
}
@media (min-width: 992px) {
  .p-inline-2-7 {
    padding-inline: var(--spacing-7);
  }
}

.m-2-7 {
  margin: var(--spacing-2);
}
@media (min-width: 992px) {
  .m-2-7 {
    margin: var(--spacing-7);
  }
}

.mt-2-7 {
  margin-top: var(--spacing-2) !important;
}
@media (min-width: 992px) {
  .mt-2-7 {
    margin-top: var(--spacing-7) !important;
  }
}

.mb-2-7 {
  margin-bottom: var(--spacing-2) !important;
}
@media (min-width: 992px) {
  .mb-2-7 {
    margin-bottom: var(--spacing-7) !important;
  }
}

.ml-2-7 {
  margin-left: var(--spacing-2) !important;
}
@media (min-width: 992px) {
  .ml-2-7 {
    margin-left: var(--spacing-7) !important;
  }
}

.gap-2-7 {
  gap: var(--spacing-2);
}
@media (min-width: 992px) {
  .gap-2-7 {
    gap: var(--spacing-7);
  }
}

.p-2-8 {
  padding: var(--spacing-2);
}
@media (min-width: 992px) {
  .p-2-8 {
    padding: var(--spacing-8);
  }
}

.pt-2-8 {
  padding-top: var(--spacing-2);
}
@media (min-width: 992px) {
  .pt-2-8 {
    padding-top: var(--spacing-8);
  }
}

.pb-2-8 {
  padding-bottom: var(--spacing-2);
}
@media (min-width: 992px) {
  .pb-2-8 {
    padding-bottom: var(--spacing-8);
  }
}

.p-inline-2-8 {
  padding-inline: var(--spacing-2);
}
@media (min-width: 992px) {
  .p-inline-2-8 {
    padding-inline: var(--spacing-8);
  }
}

.m-2-8 {
  margin: var(--spacing-2);
}
@media (min-width: 992px) {
  .m-2-8 {
    margin: var(--spacing-8);
  }
}

.mt-2-8 {
  margin-top: var(--spacing-2) !important;
}
@media (min-width: 992px) {
  .mt-2-8 {
    margin-top: var(--spacing-8) !important;
  }
}

.mb-2-8 {
  margin-bottom: var(--spacing-2) !important;
}
@media (min-width: 992px) {
  .mb-2-8 {
    margin-bottom: var(--spacing-8) !important;
  }
}

.ml-2-8 {
  margin-left: var(--spacing-2) !important;
}
@media (min-width: 992px) {
  .ml-2-8 {
    margin-left: var(--spacing-8) !important;
  }
}

.gap-2-8 {
  gap: var(--spacing-2);
}
@media (min-width: 992px) {
  .gap-2-8 {
    gap: var(--spacing-8);
  }
}

.p-2-9 {
  padding: var(--spacing-2);
}
@media (min-width: 992px) {
  .p-2-9 {
    padding: var(--spacing-9);
  }
}

.pt-2-9 {
  padding-top: var(--spacing-2);
}
@media (min-width: 992px) {
  .pt-2-9 {
    padding-top: var(--spacing-9);
  }
}

.pb-2-9 {
  padding-bottom: var(--spacing-2);
}
@media (min-width: 992px) {
  .pb-2-9 {
    padding-bottom: var(--spacing-9);
  }
}

.p-inline-2-9 {
  padding-inline: var(--spacing-2);
}
@media (min-width: 992px) {
  .p-inline-2-9 {
    padding-inline: var(--spacing-9);
  }
}

.m-2-9 {
  margin: var(--spacing-2);
}
@media (min-width: 992px) {
  .m-2-9 {
    margin: var(--spacing-9);
  }
}

.mt-2-9 {
  margin-top: var(--spacing-2) !important;
}
@media (min-width: 992px) {
  .mt-2-9 {
    margin-top: var(--spacing-9) !important;
  }
}

.mb-2-9 {
  margin-bottom: var(--spacing-2) !important;
}
@media (min-width: 992px) {
  .mb-2-9 {
    margin-bottom: var(--spacing-9) !important;
  }
}

.ml-2-9 {
  margin-left: var(--spacing-2) !important;
}
@media (min-width: 992px) {
  .ml-2-9 {
    margin-left: var(--spacing-9) !important;
  }
}

.gap-2-9 {
  gap: var(--spacing-2);
}
@media (min-width: 992px) {
  .gap-2-9 {
    gap: var(--spacing-9);
  }
}

.p-25-auto {
  padding: var(--spacing-25);
}
@media (min-width: 992px) {
  .p-25-auto {
    padding: auto;
  }
}

.pt-25-auto {
  padding-top: var(--spacing-25);
}
@media (min-width: 992px) {
  .pt-25-auto {
    padding-top: auto;
  }
}

.pb-25-auto {
  padding-bottom: var(--spacing-25);
}
@media (min-width: 992px) {
  .pb-25-auto {
    padding-bottom: auto;
  }
}

.p-inline-25-auto {
  padding-inline: var(--spacing-25);
}
@media (min-width: 992px) {
  .p-inline-25-auto {
    padding-inline: auto;
  }
}

.m-25-auto {
  margin: var(--spacing-25);
}
@media (min-width: 992px) {
  .m-25-auto {
    margin: auto;
  }
}

.mt-25-auto {
  margin-top: var(--spacing-25) !important;
}
@media (min-width: 992px) {
  .mt-25-auto {
    margin-top: auto !important;
  }
}

.mb-25-auto {
  margin-bottom: var(--spacing-25) !important;
}
@media (min-width: 992px) {
  .mb-25-auto {
    margin-bottom: auto !important;
  }
}

.ml-25-auto {
  margin-left: var(--spacing-25) !important;
}
@media (min-width: 992px) {
  .ml-25-auto {
    margin-left: auto !important;
  }
}

.gap-25-auto {
  gap: var(--spacing-25);
}
@media (min-width: 992px) {
  .gap-25-auto {
    gap: auto;
  }
}

.p-25-0 {
  padding: var(--spacing-25);
}
@media (min-width: 992px) {
  .p-25-0 {
    padding: var(--spacing-0);
  }
}

.pt-25-0 {
  padding-top: var(--spacing-25);
}
@media (min-width: 992px) {
  .pt-25-0 {
    padding-top: var(--spacing-0);
  }
}

.pb-25-0 {
  padding-bottom: var(--spacing-25);
}
@media (min-width: 992px) {
  .pb-25-0 {
    padding-bottom: var(--spacing-0);
  }
}

.p-inline-25-0 {
  padding-inline: var(--spacing-25);
}
@media (min-width: 992px) {
  .p-inline-25-0 {
    padding-inline: var(--spacing-0);
  }
}

.m-25-0 {
  margin: var(--spacing-25);
}
@media (min-width: 992px) {
  .m-25-0 {
    margin: var(--spacing-0);
  }
}

.mt-25-0 {
  margin-top: var(--spacing-25) !important;
}
@media (min-width: 992px) {
  .mt-25-0 {
    margin-top: var(--spacing-0) !important;
  }
}

.mb-25-0 {
  margin-bottom: var(--spacing-25) !important;
}
@media (min-width: 992px) {
  .mb-25-0 {
    margin-bottom: var(--spacing-0) !important;
  }
}

.ml-25-0 {
  margin-left: var(--spacing-25) !important;
}
@media (min-width: 992px) {
  .ml-25-0 {
    margin-left: var(--spacing-0) !important;
  }
}

.gap-25-0 {
  gap: var(--spacing-25);
}
@media (min-width: 992px) {
  .gap-25-0 {
    gap: var(--spacing-0);
  }
}

.p-25-1 {
  padding: var(--spacing-25);
}
@media (min-width: 992px) {
  .p-25-1 {
    padding: var(--spacing-1);
  }
}

.pt-25-1 {
  padding-top: var(--spacing-25);
}
@media (min-width: 992px) {
  .pt-25-1 {
    padding-top: var(--spacing-1);
  }
}

.pb-25-1 {
  padding-bottom: var(--spacing-25);
}
@media (min-width: 992px) {
  .pb-25-1 {
    padding-bottom: var(--spacing-1);
  }
}

.p-inline-25-1 {
  padding-inline: var(--spacing-25);
}
@media (min-width: 992px) {
  .p-inline-25-1 {
    padding-inline: var(--spacing-1);
  }
}

.m-25-1 {
  margin: var(--spacing-25);
}
@media (min-width: 992px) {
  .m-25-1 {
    margin: var(--spacing-1);
  }
}

.mt-25-1 {
  margin-top: var(--spacing-25) !important;
}
@media (min-width: 992px) {
  .mt-25-1 {
    margin-top: var(--spacing-1) !important;
  }
}

.mb-25-1 {
  margin-bottom: var(--spacing-25) !important;
}
@media (min-width: 992px) {
  .mb-25-1 {
    margin-bottom: var(--spacing-1) !important;
  }
}

.ml-25-1 {
  margin-left: var(--spacing-25) !important;
}
@media (min-width: 992px) {
  .ml-25-1 {
    margin-left: var(--spacing-1) !important;
  }
}

.gap-25-1 {
  gap: var(--spacing-25);
}
@media (min-width: 992px) {
  .gap-25-1 {
    gap: var(--spacing-1);
  }
}

.p-25-2 {
  padding: var(--spacing-25);
}
@media (min-width: 992px) {
  .p-25-2 {
    padding: var(--spacing-2);
  }
}

.pt-25-2 {
  padding-top: var(--spacing-25);
}
@media (min-width: 992px) {
  .pt-25-2 {
    padding-top: var(--spacing-2);
  }
}

.pb-25-2 {
  padding-bottom: var(--spacing-25);
}
@media (min-width: 992px) {
  .pb-25-2 {
    padding-bottom: var(--spacing-2);
  }
}

.p-inline-25-2 {
  padding-inline: var(--spacing-25);
}
@media (min-width: 992px) {
  .p-inline-25-2 {
    padding-inline: var(--spacing-2);
  }
}

.m-25-2 {
  margin: var(--spacing-25);
}
@media (min-width: 992px) {
  .m-25-2 {
    margin: var(--spacing-2);
  }
}

.mt-25-2 {
  margin-top: var(--spacing-25) !important;
}
@media (min-width: 992px) {
  .mt-25-2 {
    margin-top: var(--spacing-2) !important;
  }
}

.mb-25-2 {
  margin-bottom: var(--spacing-25) !important;
}
@media (min-width: 992px) {
  .mb-25-2 {
    margin-bottom: var(--spacing-2) !important;
  }
}

.ml-25-2 {
  margin-left: var(--spacing-25) !important;
}
@media (min-width: 992px) {
  .ml-25-2 {
    margin-left: var(--spacing-2) !important;
  }
}

.gap-25-2 {
  gap: var(--spacing-25);
}
@media (min-width: 992px) {
  .gap-25-2 {
    gap: var(--spacing-2);
  }
}

.p-25-25 {
  padding: var(--spacing-25);
}
@media (min-width: 992px) {
  .p-25-25 {
    padding: var(--spacing-25);
  }
}

.pt-25-25 {
  padding-top: var(--spacing-25);
}
@media (min-width: 992px) {
  .pt-25-25 {
    padding-top: var(--spacing-25);
  }
}

.pb-25-25 {
  padding-bottom: var(--spacing-25);
}
@media (min-width: 992px) {
  .pb-25-25 {
    padding-bottom: var(--spacing-25);
  }
}

.p-inline-25-25 {
  padding-inline: var(--spacing-25);
}
@media (min-width: 992px) {
  .p-inline-25-25 {
    padding-inline: var(--spacing-25);
  }
}

.m-25-25 {
  margin: var(--spacing-25);
}
@media (min-width: 992px) {
  .m-25-25 {
    margin: var(--spacing-25);
  }
}

.mt-25-25 {
  margin-top: var(--spacing-25) !important;
}
@media (min-width: 992px) {
  .mt-25-25 {
    margin-top: var(--spacing-25) !important;
  }
}

.mb-25-25 {
  margin-bottom: var(--spacing-25) !important;
}
@media (min-width: 992px) {
  .mb-25-25 {
    margin-bottom: var(--spacing-25) !important;
  }
}

.ml-25-25 {
  margin-left: var(--spacing-25) !important;
}
@media (min-width: 992px) {
  .ml-25-25 {
    margin-left: var(--spacing-25) !important;
  }
}

.gap-25-25 {
  gap: var(--spacing-25);
}
@media (min-width: 992px) {
  .gap-25-25 {
    gap: var(--spacing-25);
  }
}

.p-25-3 {
  padding: var(--spacing-25);
}
@media (min-width: 992px) {
  .p-25-3 {
    padding: var(--spacing-3);
  }
}

.pt-25-3 {
  padding-top: var(--spacing-25);
}
@media (min-width: 992px) {
  .pt-25-3 {
    padding-top: var(--spacing-3);
  }
}

.pb-25-3 {
  padding-bottom: var(--spacing-25);
}
@media (min-width: 992px) {
  .pb-25-3 {
    padding-bottom: var(--spacing-3);
  }
}

.p-inline-25-3 {
  padding-inline: var(--spacing-25);
}
@media (min-width: 992px) {
  .p-inline-25-3 {
    padding-inline: var(--spacing-3);
  }
}

.m-25-3 {
  margin: var(--spacing-25);
}
@media (min-width: 992px) {
  .m-25-3 {
    margin: var(--spacing-3);
  }
}

.mt-25-3 {
  margin-top: var(--spacing-25) !important;
}
@media (min-width: 992px) {
  .mt-25-3 {
    margin-top: var(--spacing-3) !important;
  }
}

.mb-25-3 {
  margin-bottom: var(--spacing-25) !important;
}
@media (min-width: 992px) {
  .mb-25-3 {
    margin-bottom: var(--spacing-3) !important;
  }
}

.ml-25-3 {
  margin-left: var(--spacing-25) !important;
}
@media (min-width: 992px) {
  .ml-25-3 {
    margin-left: var(--spacing-3) !important;
  }
}

.gap-25-3 {
  gap: var(--spacing-25);
}
@media (min-width: 992px) {
  .gap-25-3 {
    gap: var(--spacing-3);
  }
}

.p-25-35 {
  padding: var(--spacing-25);
}
@media (min-width: 992px) {
  .p-25-35 {
    padding: var(--spacing-35);
  }
}

.pt-25-35 {
  padding-top: var(--spacing-25);
}
@media (min-width: 992px) {
  .pt-25-35 {
    padding-top: var(--spacing-35);
  }
}

.pb-25-35 {
  padding-bottom: var(--spacing-25);
}
@media (min-width: 992px) {
  .pb-25-35 {
    padding-bottom: var(--spacing-35);
  }
}

.p-inline-25-35 {
  padding-inline: var(--spacing-25);
}
@media (min-width: 992px) {
  .p-inline-25-35 {
    padding-inline: var(--spacing-35);
  }
}

.m-25-35 {
  margin: var(--spacing-25);
}
@media (min-width: 992px) {
  .m-25-35 {
    margin: var(--spacing-35);
  }
}

.mt-25-35 {
  margin-top: var(--spacing-25) !important;
}
@media (min-width: 992px) {
  .mt-25-35 {
    margin-top: var(--spacing-35) !important;
  }
}

.mb-25-35 {
  margin-bottom: var(--spacing-25) !important;
}
@media (min-width: 992px) {
  .mb-25-35 {
    margin-bottom: var(--spacing-35) !important;
  }
}

.ml-25-35 {
  margin-left: var(--spacing-25) !important;
}
@media (min-width: 992px) {
  .ml-25-35 {
    margin-left: var(--spacing-35) !important;
  }
}

.gap-25-35 {
  gap: var(--spacing-25);
}
@media (min-width: 992px) {
  .gap-25-35 {
    gap: var(--spacing-35);
  }
}

.p-25-4 {
  padding: var(--spacing-25);
}
@media (min-width: 992px) {
  .p-25-4 {
    padding: var(--spacing-4);
  }
}

.pt-25-4 {
  padding-top: var(--spacing-25);
}
@media (min-width: 992px) {
  .pt-25-4 {
    padding-top: var(--spacing-4);
  }
}

.pb-25-4 {
  padding-bottom: var(--spacing-25);
}
@media (min-width: 992px) {
  .pb-25-4 {
    padding-bottom: var(--spacing-4);
  }
}

.p-inline-25-4 {
  padding-inline: var(--spacing-25);
}
@media (min-width: 992px) {
  .p-inline-25-4 {
    padding-inline: var(--spacing-4);
  }
}

.m-25-4 {
  margin: var(--spacing-25);
}
@media (min-width: 992px) {
  .m-25-4 {
    margin: var(--spacing-4);
  }
}

.mt-25-4 {
  margin-top: var(--spacing-25) !important;
}
@media (min-width: 992px) {
  .mt-25-4 {
    margin-top: var(--spacing-4) !important;
  }
}

.mb-25-4 {
  margin-bottom: var(--spacing-25) !important;
}
@media (min-width: 992px) {
  .mb-25-4 {
    margin-bottom: var(--spacing-4) !important;
  }
}

.ml-25-4 {
  margin-left: var(--spacing-25) !important;
}
@media (min-width: 992px) {
  .ml-25-4 {
    margin-left: var(--spacing-4) !important;
  }
}

.gap-25-4 {
  gap: var(--spacing-25);
}
@media (min-width: 992px) {
  .gap-25-4 {
    gap: var(--spacing-4);
  }
}

.p-25-5 {
  padding: var(--spacing-25);
}
@media (min-width: 992px) {
  .p-25-5 {
    padding: var(--spacing-5);
  }
}

.pt-25-5 {
  padding-top: var(--spacing-25);
}
@media (min-width: 992px) {
  .pt-25-5 {
    padding-top: var(--spacing-5);
  }
}

.pb-25-5 {
  padding-bottom: var(--spacing-25);
}
@media (min-width: 992px) {
  .pb-25-5 {
    padding-bottom: var(--spacing-5);
  }
}

.p-inline-25-5 {
  padding-inline: var(--spacing-25);
}
@media (min-width: 992px) {
  .p-inline-25-5 {
    padding-inline: var(--spacing-5);
  }
}

.m-25-5 {
  margin: var(--spacing-25);
}
@media (min-width: 992px) {
  .m-25-5 {
    margin: var(--spacing-5);
  }
}

.mt-25-5 {
  margin-top: var(--spacing-25) !important;
}
@media (min-width: 992px) {
  .mt-25-5 {
    margin-top: var(--spacing-5) !important;
  }
}

.mb-25-5 {
  margin-bottom: var(--spacing-25) !important;
}
@media (min-width: 992px) {
  .mb-25-5 {
    margin-bottom: var(--spacing-5) !important;
  }
}

.ml-25-5 {
  margin-left: var(--spacing-25) !important;
}
@media (min-width: 992px) {
  .ml-25-5 {
    margin-left: var(--spacing-5) !important;
  }
}

.gap-25-5 {
  gap: var(--spacing-25);
}
@media (min-width: 992px) {
  .gap-25-5 {
    gap: var(--spacing-5);
  }
}

.p-25-6 {
  padding: var(--spacing-25);
}
@media (min-width: 992px) {
  .p-25-6 {
    padding: var(--spacing-6);
  }
}

.pt-25-6 {
  padding-top: var(--spacing-25);
}
@media (min-width: 992px) {
  .pt-25-6 {
    padding-top: var(--spacing-6);
  }
}

.pb-25-6 {
  padding-bottom: var(--spacing-25);
}
@media (min-width: 992px) {
  .pb-25-6 {
    padding-bottom: var(--spacing-6);
  }
}

.p-inline-25-6 {
  padding-inline: var(--spacing-25);
}
@media (min-width: 992px) {
  .p-inline-25-6 {
    padding-inline: var(--spacing-6);
  }
}

.m-25-6 {
  margin: var(--spacing-25);
}
@media (min-width: 992px) {
  .m-25-6 {
    margin: var(--spacing-6);
  }
}

.mt-25-6 {
  margin-top: var(--spacing-25) !important;
}
@media (min-width: 992px) {
  .mt-25-6 {
    margin-top: var(--spacing-6) !important;
  }
}

.mb-25-6 {
  margin-bottom: var(--spacing-25) !important;
}
@media (min-width: 992px) {
  .mb-25-6 {
    margin-bottom: var(--spacing-6) !important;
  }
}

.ml-25-6 {
  margin-left: var(--spacing-25) !important;
}
@media (min-width: 992px) {
  .ml-25-6 {
    margin-left: var(--spacing-6) !important;
  }
}

.gap-25-6 {
  gap: var(--spacing-25);
}
@media (min-width: 992px) {
  .gap-25-6 {
    gap: var(--spacing-6);
  }
}

.p-25-7 {
  padding: var(--spacing-25);
}
@media (min-width: 992px) {
  .p-25-7 {
    padding: var(--spacing-7);
  }
}

.pt-25-7 {
  padding-top: var(--spacing-25);
}
@media (min-width: 992px) {
  .pt-25-7 {
    padding-top: var(--spacing-7);
  }
}

.pb-25-7 {
  padding-bottom: var(--spacing-25);
}
@media (min-width: 992px) {
  .pb-25-7 {
    padding-bottom: var(--spacing-7);
  }
}

.p-inline-25-7 {
  padding-inline: var(--spacing-25);
}
@media (min-width: 992px) {
  .p-inline-25-7 {
    padding-inline: var(--spacing-7);
  }
}

.m-25-7 {
  margin: var(--spacing-25);
}
@media (min-width: 992px) {
  .m-25-7 {
    margin: var(--spacing-7);
  }
}

.mt-25-7 {
  margin-top: var(--spacing-25) !important;
}
@media (min-width: 992px) {
  .mt-25-7 {
    margin-top: var(--spacing-7) !important;
  }
}

.mb-25-7 {
  margin-bottom: var(--spacing-25) !important;
}
@media (min-width: 992px) {
  .mb-25-7 {
    margin-bottom: var(--spacing-7) !important;
  }
}

.ml-25-7 {
  margin-left: var(--spacing-25) !important;
}
@media (min-width: 992px) {
  .ml-25-7 {
    margin-left: var(--spacing-7) !important;
  }
}

.gap-25-7 {
  gap: var(--spacing-25);
}
@media (min-width: 992px) {
  .gap-25-7 {
    gap: var(--spacing-7);
  }
}

.p-25-8 {
  padding: var(--spacing-25);
}
@media (min-width: 992px) {
  .p-25-8 {
    padding: var(--spacing-8);
  }
}

.pt-25-8 {
  padding-top: var(--spacing-25);
}
@media (min-width: 992px) {
  .pt-25-8 {
    padding-top: var(--spacing-8);
  }
}

.pb-25-8 {
  padding-bottom: var(--spacing-25);
}
@media (min-width: 992px) {
  .pb-25-8 {
    padding-bottom: var(--spacing-8);
  }
}

.p-inline-25-8 {
  padding-inline: var(--spacing-25);
}
@media (min-width: 992px) {
  .p-inline-25-8 {
    padding-inline: var(--spacing-8);
  }
}

.m-25-8 {
  margin: var(--spacing-25);
}
@media (min-width: 992px) {
  .m-25-8 {
    margin: var(--spacing-8);
  }
}

.mt-25-8 {
  margin-top: var(--spacing-25) !important;
}
@media (min-width: 992px) {
  .mt-25-8 {
    margin-top: var(--spacing-8) !important;
  }
}

.mb-25-8 {
  margin-bottom: var(--spacing-25) !important;
}
@media (min-width: 992px) {
  .mb-25-8 {
    margin-bottom: var(--spacing-8) !important;
  }
}

.ml-25-8 {
  margin-left: var(--spacing-25) !important;
}
@media (min-width: 992px) {
  .ml-25-8 {
    margin-left: var(--spacing-8) !important;
  }
}

.gap-25-8 {
  gap: var(--spacing-25);
}
@media (min-width: 992px) {
  .gap-25-8 {
    gap: var(--spacing-8);
  }
}

.p-25-9 {
  padding: var(--spacing-25);
}
@media (min-width: 992px) {
  .p-25-9 {
    padding: var(--spacing-9);
  }
}

.pt-25-9 {
  padding-top: var(--spacing-25);
}
@media (min-width: 992px) {
  .pt-25-9 {
    padding-top: var(--spacing-9);
  }
}

.pb-25-9 {
  padding-bottom: var(--spacing-25);
}
@media (min-width: 992px) {
  .pb-25-9 {
    padding-bottom: var(--spacing-9);
  }
}

.p-inline-25-9 {
  padding-inline: var(--spacing-25);
}
@media (min-width: 992px) {
  .p-inline-25-9 {
    padding-inline: var(--spacing-9);
  }
}

.m-25-9 {
  margin: var(--spacing-25);
}
@media (min-width: 992px) {
  .m-25-9 {
    margin: var(--spacing-9);
  }
}

.mt-25-9 {
  margin-top: var(--spacing-25) !important;
}
@media (min-width: 992px) {
  .mt-25-9 {
    margin-top: var(--spacing-9) !important;
  }
}

.mb-25-9 {
  margin-bottom: var(--spacing-25) !important;
}
@media (min-width: 992px) {
  .mb-25-9 {
    margin-bottom: var(--spacing-9) !important;
  }
}

.ml-25-9 {
  margin-left: var(--spacing-25) !important;
}
@media (min-width: 992px) {
  .ml-25-9 {
    margin-left: var(--spacing-9) !important;
  }
}

.gap-25-9 {
  gap: var(--spacing-25);
}
@media (min-width: 992px) {
  .gap-25-9 {
    gap: var(--spacing-9);
  }
}

.p-3-auto {
  padding: var(--spacing-3);
}
@media (min-width: 992px) {
  .p-3-auto {
    padding: auto;
  }
}

.pt-3-auto {
  padding-top: var(--spacing-3);
}
@media (min-width: 992px) {
  .pt-3-auto {
    padding-top: auto;
  }
}

.pb-3-auto {
  padding-bottom: var(--spacing-3);
}
@media (min-width: 992px) {
  .pb-3-auto {
    padding-bottom: auto;
  }
}

.p-inline-3-auto {
  padding-inline: var(--spacing-3);
}
@media (min-width: 992px) {
  .p-inline-3-auto {
    padding-inline: auto;
  }
}

.m-3-auto {
  margin: var(--spacing-3);
}
@media (min-width: 992px) {
  .m-3-auto {
    margin: auto;
  }
}

.mt-3-auto {
  margin-top: var(--spacing-3) !important;
}
@media (min-width: 992px) {
  .mt-3-auto {
    margin-top: auto !important;
  }
}

.mb-3-auto {
  margin-bottom: var(--spacing-3) !important;
}
@media (min-width: 992px) {
  .mb-3-auto {
    margin-bottom: auto !important;
  }
}

.ml-3-auto {
  margin-left: var(--spacing-3) !important;
}
@media (min-width: 992px) {
  .ml-3-auto {
    margin-left: auto !important;
  }
}

.gap-3-auto {
  gap: var(--spacing-3);
}
@media (min-width: 992px) {
  .gap-3-auto {
    gap: auto;
  }
}

.p-3-0 {
  padding: var(--spacing-3);
}
@media (min-width: 992px) {
  .p-3-0 {
    padding: var(--spacing-0);
  }
}

.pt-3-0 {
  padding-top: var(--spacing-3);
}
@media (min-width: 992px) {
  .pt-3-0 {
    padding-top: var(--spacing-0);
  }
}

.pb-3-0 {
  padding-bottom: var(--spacing-3);
}
@media (min-width: 992px) {
  .pb-3-0 {
    padding-bottom: var(--spacing-0);
  }
}

.p-inline-3-0 {
  padding-inline: var(--spacing-3);
}
@media (min-width: 992px) {
  .p-inline-3-0 {
    padding-inline: var(--spacing-0);
  }
}

.m-3-0 {
  margin: var(--spacing-3);
}
@media (min-width: 992px) {
  .m-3-0 {
    margin: var(--spacing-0);
  }
}

.mt-3-0 {
  margin-top: var(--spacing-3) !important;
}
@media (min-width: 992px) {
  .mt-3-0 {
    margin-top: var(--spacing-0) !important;
  }
}

.mb-3-0 {
  margin-bottom: var(--spacing-3) !important;
}
@media (min-width: 992px) {
  .mb-3-0 {
    margin-bottom: var(--spacing-0) !important;
  }
}

.ml-3-0 {
  margin-left: var(--spacing-3) !important;
}
@media (min-width: 992px) {
  .ml-3-0 {
    margin-left: var(--spacing-0) !important;
  }
}

.gap-3-0 {
  gap: var(--spacing-3);
}
@media (min-width: 992px) {
  .gap-3-0 {
    gap: var(--spacing-0);
  }
}

.p-3-1 {
  padding: var(--spacing-3);
}
@media (min-width: 992px) {
  .p-3-1 {
    padding: var(--spacing-1);
  }
}

.pt-3-1 {
  padding-top: var(--spacing-3);
}
@media (min-width: 992px) {
  .pt-3-1 {
    padding-top: var(--spacing-1);
  }
}

.pb-3-1 {
  padding-bottom: var(--spacing-3);
}
@media (min-width: 992px) {
  .pb-3-1 {
    padding-bottom: var(--spacing-1);
  }
}

.p-inline-3-1 {
  padding-inline: var(--spacing-3);
}
@media (min-width: 992px) {
  .p-inline-3-1 {
    padding-inline: var(--spacing-1);
  }
}

.m-3-1 {
  margin: var(--spacing-3);
}
@media (min-width: 992px) {
  .m-3-1 {
    margin: var(--spacing-1);
  }
}

.mt-3-1 {
  margin-top: var(--spacing-3) !important;
}
@media (min-width: 992px) {
  .mt-3-1 {
    margin-top: var(--spacing-1) !important;
  }
}

.mb-3-1 {
  margin-bottom: var(--spacing-3) !important;
}
@media (min-width: 992px) {
  .mb-3-1 {
    margin-bottom: var(--spacing-1) !important;
  }
}

.ml-3-1 {
  margin-left: var(--spacing-3) !important;
}
@media (min-width: 992px) {
  .ml-3-1 {
    margin-left: var(--spacing-1) !important;
  }
}

.gap-3-1 {
  gap: var(--spacing-3);
}
@media (min-width: 992px) {
  .gap-3-1 {
    gap: var(--spacing-1);
  }
}

.p-3-2 {
  padding: var(--spacing-3);
}
@media (min-width: 992px) {
  .p-3-2 {
    padding: var(--spacing-2);
  }
}

.pt-3-2 {
  padding-top: var(--spacing-3);
}
@media (min-width: 992px) {
  .pt-3-2 {
    padding-top: var(--spacing-2);
  }
}

.pb-3-2 {
  padding-bottom: var(--spacing-3);
}
@media (min-width: 992px) {
  .pb-3-2 {
    padding-bottom: var(--spacing-2);
  }
}

.p-inline-3-2 {
  padding-inline: var(--spacing-3);
}
@media (min-width: 992px) {
  .p-inline-3-2 {
    padding-inline: var(--spacing-2);
  }
}

.m-3-2 {
  margin: var(--spacing-3);
}
@media (min-width: 992px) {
  .m-3-2 {
    margin: var(--spacing-2);
  }
}

.mt-3-2 {
  margin-top: var(--spacing-3) !important;
}
@media (min-width: 992px) {
  .mt-3-2 {
    margin-top: var(--spacing-2) !important;
  }
}

.mb-3-2 {
  margin-bottom: var(--spacing-3) !important;
}
@media (min-width: 992px) {
  .mb-3-2 {
    margin-bottom: var(--spacing-2) !important;
  }
}

.ml-3-2 {
  margin-left: var(--spacing-3) !important;
}
@media (min-width: 992px) {
  .ml-3-2 {
    margin-left: var(--spacing-2) !important;
  }
}

.gap-3-2 {
  gap: var(--spacing-3);
}
@media (min-width: 992px) {
  .gap-3-2 {
    gap: var(--spacing-2);
  }
}

.p-3-25 {
  padding: var(--spacing-3);
}
@media (min-width: 992px) {
  .p-3-25 {
    padding: var(--spacing-25);
  }
}

.pt-3-25 {
  padding-top: var(--spacing-3);
}
@media (min-width: 992px) {
  .pt-3-25 {
    padding-top: var(--spacing-25);
  }
}

.pb-3-25 {
  padding-bottom: var(--spacing-3);
}
@media (min-width: 992px) {
  .pb-3-25 {
    padding-bottom: var(--spacing-25);
  }
}

.p-inline-3-25 {
  padding-inline: var(--spacing-3);
}
@media (min-width: 992px) {
  .p-inline-3-25 {
    padding-inline: var(--spacing-25);
  }
}

.m-3-25 {
  margin: var(--spacing-3);
}
@media (min-width: 992px) {
  .m-3-25 {
    margin: var(--spacing-25);
  }
}

.mt-3-25 {
  margin-top: var(--spacing-3) !important;
}
@media (min-width: 992px) {
  .mt-3-25 {
    margin-top: var(--spacing-25) !important;
  }
}

.mb-3-25 {
  margin-bottom: var(--spacing-3) !important;
}
@media (min-width: 992px) {
  .mb-3-25 {
    margin-bottom: var(--spacing-25) !important;
  }
}

.ml-3-25 {
  margin-left: var(--spacing-3) !important;
}
@media (min-width: 992px) {
  .ml-3-25 {
    margin-left: var(--spacing-25) !important;
  }
}

.gap-3-25 {
  gap: var(--spacing-3);
}
@media (min-width: 992px) {
  .gap-3-25 {
    gap: var(--spacing-25);
  }
}

.p-3-3 {
  padding: var(--spacing-3);
}
@media (min-width: 992px) {
  .p-3-3 {
    padding: var(--spacing-3);
  }
}

.pt-3-3 {
  padding-top: var(--spacing-3);
}
@media (min-width: 992px) {
  .pt-3-3 {
    padding-top: var(--spacing-3);
  }
}

.pb-3-3 {
  padding-bottom: var(--spacing-3);
}
@media (min-width: 992px) {
  .pb-3-3 {
    padding-bottom: var(--spacing-3);
  }
}

.p-inline-3-3 {
  padding-inline: var(--spacing-3);
}
@media (min-width: 992px) {
  .p-inline-3-3 {
    padding-inline: var(--spacing-3);
  }
}

.m-3-3 {
  margin: var(--spacing-3);
}
@media (min-width: 992px) {
  .m-3-3 {
    margin: var(--spacing-3);
  }
}

.mt-3-3 {
  margin-top: var(--spacing-3) !important;
}
@media (min-width: 992px) {
  .mt-3-3 {
    margin-top: var(--spacing-3) !important;
  }
}

.mb-3-3 {
  margin-bottom: var(--spacing-3) !important;
}
@media (min-width: 992px) {
  .mb-3-3 {
    margin-bottom: var(--spacing-3) !important;
  }
}

.ml-3-3 {
  margin-left: var(--spacing-3) !important;
}
@media (min-width: 992px) {
  .ml-3-3 {
    margin-left: var(--spacing-3) !important;
  }
}

.gap-3-3 {
  gap: var(--spacing-3);
}
@media (min-width: 992px) {
  .gap-3-3 {
    gap: var(--spacing-3);
  }
}

.p-3-35 {
  padding: var(--spacing-3);
}
@media (min-width: 992px) {
  .p-3-35 {
    padding: var(--spacing-35);
  }
}

.pt-3-35 {
  padding-top: var(--spacing-3);
}
@media (min-width: 992px) {
  .pt-3-35 {
    padding-top: var(--spacing-35);
  }
}

.pb-3-35 {
  padding-bottom: var(--spacing-3);
}
@media (min-width: 992px) {
  .pb-3-35 {
    padding-bottom: var(--spacing-35);
  }
}

.p-inline-3-35 {
  padding-inline: var(--spacing-3);
}
@media (min-width: 992px) {
  .p-inline-3-35 {
    padding-inline: var(--spacing-35);
  }
}

.m-3-35 {
  margin: var(--spacing-3);
}
@media (min-width: 992px) {
  .m-3-35 {
    margin: var(--spacing-35);
  }
}

.mt-3-35 {
  margin-top: var(--spacing-3) !important;
}
@media (min-width: 992px) {
  .mt-3-35 {
    margin-top: var(--spacing-35) !important;
  }
}

.mb-3-35 {
  margin-bottom: var(--spacing-3) !important;
}
@media (min-width: 992px) {
  .mb-3-35 {
    margin-bottom: var(--spacing-35) !important;
  }
}

.ml-3-35 {
  margin-left: var(--spacing-3) !important;
}
@media (min-width: 992px) {
  .ml-3-35 {
    margin-left: var(--spacing-35) !important;
  }
}

.gap-3-35 {
  gap: var(--spacing-3);
}
@media (min-width: 992px) {
  .gap-3-35 {
    gap: var(--spacing-35);
  }
}

.p-3-4 {
  padding: var(--spacing-3);
}
@media (min-width: 992px) {
  .p-3-4 {
    padding: var(--spacing-4);
  }
}

.pt-3-4 {
  padding-top: var(--spacing-3);
}
@media (min-width: 992px) {
  .pt-3-4 {
    padding-top: var(--spacing-4);
  }
}

.pb-3-4 {
  padding-bottom: var(--spacing-3);
}
@media (min-width: 992px) {
  .pb-3-4 {
    padding-bottom: var(--spacing-4);
  }
}

.p-inline-3-4 {
  padding-inline: var(--spacing-3);
}
@media (min-width: 992px) {
  .p-inline-3-4 {
    padding-inline: var(--spacing-4);
  }
}

.m-3-4 {
  margin: var(--spacing-3);
}
@media (min-width: 992px) {
  .m-3-4 {
    margin: var(--spacing-4);
  }
}

.mt-3-4 {
  margin-top: var(--spacing-3) !important;
}
@media (min-width: 992px) {
  .mt-3-4 {
    margin-top: var(--spacing-4) !important;
  }
}

.mb-3-4 {
  margin-bottom: var(--spacing-3) !important;
}
@media (min-width: 992px) {
  .mb-3-4 {
    margin-bottom: var(--spacing-4) !important;
  }
}

.ml-3-4 {
  margin-left: var(--spacing-3) !important;
}
@media (min-width: 992px) {
  .ml-3-4 {
    margin-left: var(--spacing-4) !important;
  }
}

.gap-3-4 {
  gap: var(--spacing-3);
}
@media (min-width: 992px) {
  .gap-3-4 {
    gap: var(--spacing-4);
  }
}

.p-3-5 {
  padding: var(--spacing-3);
}
@media (min-width: 992px) {
  .p-3-5 {
    padding: var(--spacing-5);
  }
}

.pt-3-5 {
  padding-top: var(--spacing-3);
}
@media (min-width: 992px) {
  .pt-3-5 {
    padding-top: var(--spacing-5);
  }
}

.pb-3-5 {
  padding-bottom: var(--spacing-3);
}
@media (min-width: 992px) {
  .pb-3-5 {
    padding-bottom: var(--spacing-5);
  }
}

.p-inline-3-5 {
  padding-inline: var(--spacing-3);
}
@media (min-width: 992px) {
  .p-inline-3-5 {
    padding-inline: var(--spacing-5);
  }
}

.m-3-5 {
  margin: var(--spacing-3);
}
@media (min-width: 992px) {
  .m-3-5 {
    margin: var(--spacing-5);
  }
}

.mt-3-5 {
  margin-top: var(--spacing-3) !important;
}
@media (min-width: 992px) {
  .mt-3-5 {
    margin-top: var(--spacing-5) !important;
  }
}

.mb-3-5 {
  margin-bottom: var(--spacing-3) !important;
}
@media (min-width: 992px) {
  .mb-3-5 {
    margin-bottom: var(--spacing-5) !important;
  }
}

.ml-3-5 {
  margin-left: var(--spacing-3) !important;
}
@media (min-width: 992px) {
  .ml-3-5 {
    margin-left: var(--spacing-5) !important;
  }
}

.gap-3-5 {
  gap: var(--spacing-3);
}
@media (min-width: 992px) {
  .gap-3-5 {
    gap: var(--spacing-5);
  }
}

.p-3-6 {
  padding: var(--spacing-3);
}
@media (min-width: 992px) {
  .p-3-6 {
    padding: var(--spacing-6);
  }
}

.pt-3-6 {
  padding-top: var(--spacing-3);
}
@media (min-width: 992px) {
  .pt-3-6 {
    padding-top: var(--spacing-6);
  }
}

.pb-3-6 {
  padding-bottom: var(--spacing-3);
}
@media (min-width: 992px) {
  .pb-3-6 {
    padding-bottom: var(--spacing-6);
  }
}

.p-inline-3-6 {
  padding-inline: var(--spacing-3);
}
@media (min-width: 992px) {
  .p-inline-3-6 {
    padding-inline: var(--spacing-6);
  }
}

.m-3-6 {
  margin: var(--spacing-3);
}
@media (min-width: 992px) {
  .m-3-6 {
    margin: var(--spacing-6);
  }
}

.mt-3-6 {
  margin-top: var(--spacing-3) !important;
}
@media (min-width: 992px) {
  .mt-3-6 {
    margin-top: var(--spacing-6) !important;
  }
}

.mb-3-6 {
  margin-bottom: var(--spacing-3) !important;
}
@media (min-width: 992px) {
  .mb-3-6 {
    margin-bottom: var(--spacing-6) !important;
  }
}

.ml-3-6 {
  margin-left: var(--spacing-3) !important;
}
@media (min-width: 992px) {
  .ml-3-6 {
    margin-left: var(--spacing-6) !important;
  }
}

.gap-3-6 {
  gap: var(--spacing-3);
}
@media (min-width: 992px) {
  .gap-3-6 {
    gap: var(--spacing-6);
  }
}

.p-3-7 {
  padding: var(--spacing-3);
}
@media (min-width: 992px) {
  .p-3-7 {
    padding: var(--spacing-7);
  }
}

.pt-3-7 {
  padding-top: var(--spacing-3);
}
@media (min-width: 992px) {
  .pt-3-7 {
    padding-top: var(--spacing-7);
  }
}

.pb-3-7 {
  padding-bottom: var(--spacing-3);
}
@media (min-width: 992px) {
  .pb-3-7 {
    padding-bottom: var(--spacing-7);
  }
}

.p-inline-3-7 {
  padding-inline: var(--spacing-3);
}
@media (min-width: 992px) {
  .p-inline-3-7 {
    padding-inline: var(--spacing-7);
  }
}

.m-3-7 {
  margin: var(--spacing-3);
}
@media (min-width: 992px) {
  .m-3-7 {
    margin: var(--spacing-7);
  }
}

.mt-3-7 {
  margin-top: var(--spacing-3) !important;
}
@media (min-width: 992px) {
  .mt-3-7 {
    margin-top: var(--spacing-7) !important;
  }
}

.mb-3-7 {
  margin-bottom: var(--spacing-3) !important;
}
@media (min-width: 992px) {
  .mb-3-7 {
    margin-bottom: var(--spacing-7) !important;
  }
}

.ml-3-7 {
  margin-left: var(--spacing-3) !important;
}
@media (min-width: 992px) {
  .ml-3-7 {
    margin-left: var(--spacing-7) !important;
  }
}

.gap-3-7 {
  gap: var(--spacing-3);
}
@media (min-width: 992px) {
  .gap-3-7 {
    gap: var(--spacing-7);
  }
}

.p-3-8 {
  padding: var(--spacing-3);
}
@media (min-width: 992px) {
  .p-3-8 {
    padding: var(--spacing-8);
  }
}

.pt-3-8 {
  padding-top: var(--spacing-3);
}
@media (min-width: 992px) {
  .pt-3-8 {
    padding-top: var(--spacing-8);
  }
}

.pb-3-8 {
  padding-bottom: var(--spacing-3);
}
@media (min-width: 992px) {
  .pb-3-8 {
    padding-bottom: var(--spacing-8);
  }
}

.p-inline-3-8 {
  padding-inline: var(--spacing-3);
}
@media (min-width: 992px) {
  .p-inline-3-8 {
    padding-inline: var(--spacing-8);
  }
}

.m-3-8 {
  margin: var(--spacing-3);
}
@media (min-width: 992px) {
  .m-3-8 {
    margin: var(--spacing-8);
  }
}

.mt-3-8 {
  margin-top: var(--spacing-3) !important;
}
@media (min-width: 992px) {
  .mt-3-8 {
    margin-top: var(--spacing-8) !important;
  }
}

.mb-3-8 {
  margin-bottom: var(--spacing-3) !important;
}
@media (min-width: 992px) {
  .mb-3-8 {
    margin-bottom: var(--spacing-8) !important;
  }
}

.ml-3-8 {
  margin-left: var(--spacing-3) !important;
}
@media (min-width: 992px) {
  .ml-3-8 {
    margin-left: var(--spacing-8) !important;
  }
}

.gap-3-8 {
  gap: var(--spacing-3);
}
@media (min-width: 992px) {
  .gap-3-8 {
    gap: var(--spacing-8);
  }
}

.p-3-9 {
  padding: var(--spacing-3);
}
@media (min-width: 992px) {
  .p-3-9 {
    padding: var(--spacing-9);
  }
}

.pt-3-9 {
  padding-top: var(--spacing-3);
}
@media (min-width: 992px) {
  .pt-3-9 {
    padding-top: var(--spacing-9);
  }
}

.pb-3-9 {
  padding-bottom: var(--spacing-3);
}
@media (min-width: 992px) {
  .pb-3-9 {
    padding-bottom: var(--spacing-9);
  }
}

.p-inline-3-9 {
  padding-inline: var(--spacing-3);
}
@media (min-width: 992px) {
  .p-inline-3-9 {
    padding-inline: var(--spacing-9);
  }
}

.m-3-9 {
  margin: var(--spacing-3);
}
@media (min-width: 992px) {
  .m-3-9 {
    margin: var(--spacing-9);
  }
}

.mt-3-9 {
  margin-top: var(--spacing-3) !important;
}
@media (min-width: 992px) {
  .mt-3-9 {
    margin-top: var(--spacing-9) !important;
  }
}

.mb-3-9 {
  margin-bottom: var(--spacing-3) !important;
}
@media (min-width: 992px) {
  .mb-3-9 {
    margin-bottom: var(--spacing-9) !important;
  }
}

.ml-3-9 {
  margin-left: var(--spacing-3) !important;
}
@media (min-width: 992px) {
  .ml-3-9 {
    margin-left: var(--spacing-9) !important;
  }
}

.gap-3-9 {
  gap: var(--spacing-3);
}
@media (min-width: 992px) {
  .gap-3-9 {
    gap: var(--spacing-9);
  }
}

.p-35-auto {
  padding: var(--spacing-35);
}
@media (min-width: 992px) {
  .p-35-auto {
    padding: auto;
  }
}

.pt-35-auto {
  padding-top: var(--spacing-35);
}
@media (min-width: 992px) {
  .pt-35-auto {
    padding-top: auto;
  }
}

.pb-35-auto {
  padding-bottom: var(--spacing-35);
}
@media (min-width: 992px) {
  .pb-35-auto {
    padding-bottom: auto;
  }
}

.p-inline-35-auto {
  padding-inline: var(--spacing-35);
}
@media (min-width: 992px) {
  .p-inline-35-auto {
    padding-inline: auto;
  }
}

.m-35-auto {
  margin: var(--spacing-35);
}
@media (min-width: 992px) {
  .m-35-auto {
    margin: auto;
  }
}

.mt-35-auto {
  margin-top: var(--spacing-35) !important;
}
@media (min-width: 992px) {
  .mt-35-auto {
    margin-top: auto !important;
  }
}

.mb-35-auto {
  margin-bottom: var(--spacing-35) !important;
}
@media (min-width: 992px) {
  .mb-35-auto {
    margin-bottom: auto !important;
  }
}

.ml-35-auto {
  margin-left: var(--spacing-35) !important;
}
@media (min-width: 992px) {
  .ml-35-auto {
    margin-left: auto !important;
  }
}

.gap-35-auto {
  gap: var(--spacing-35);
}
@media (min-width: 992px) {
  .gap-35-auto {
    gap: auto;
  }
}

.p-35-0 {
  padding: var(--spacing-35);
}
@media (min-width: 992px) {
  .p-35-0 {
    padding: var(--spacing-0);
  }
}

.pt-35-0 {
  padding-top: var(--spacing-35);
}
@media (min-width: 992px) {
  .pt-35-0 {
    padding-top: var(--spacing-0);
  }
}

.pb-35-0 {
  padding-bottom: var(--spacing-35);
}
@media (min-width: 992px) {
  .pb-35-0 {
    padding-bottom: var(--spacing-0);
  }
}

.p-inline-35-0 {
  padding-inline: var(--spacing-35);
}
@media (min-width: 992px) {
  .p-inline-35-0 {
    padding-inline: var(--spacing-0);
  }
}

.m-35-0 {
  margin: var(--spacing-35);
}
@media (min-width: 992px) {
  .m-35-0 {
    margin: var(--spacing-0);
  }
}

.mt-35-0 {
  margin-top: var(--spacing-35) !important;
}
@media (min-width: 992px) {
  .mt-35-0 {
    margin-top: var(--spacing-0) !important;
  }
}

.mb-35-0 {
  margin-bottom: var(--spacing-35) !important;
}
@media (min-width: 992px) {
  .mb-35-0 {
    margin-bottom: var(--spacing-0) !important;
  }
}

.ml-35-0 {
  margin-left: var(--spacing-35) !important;
}
@media (min-width: 992px) {
  .ml-35-0 {
    margin-left: var(--spacing-0) !important;
  }
}

.gap-35-0 {
  gap: var(--spacing-35);
}
@media (min-width: 992px) {
  .gap-35-0 {
    gap: var(--spacing-0);
  }
}

.p-35-1 {
  padding: var(--spacing-35);
}
@media (min-width: 992px) {
  .p-35-1 {
    padding: var(--spacing-1);
  }
}

.pt-35-1 {
  padding-top: var(--spacing-35);
}
@media (min-width: 992px) {
  .pt-35-1 {
    padding-top: var(--spacing-1);
  }
}

.pb-35-1 {
  padding-bottom: var(--spacing-35);
}
@media (min-width: 992px) {
  .pb-35-1 {
    padding-bottom: var(--spacing-1);
  }
}

.p-inline-35-1 {
  padding-inline: var(--spacing-35);
}
@media (min-width: 992px) {
  .p-inline-35-1 {
    padding-inline: var(--spacing-1);
  }
}

.m-35-1 {
  margin: var(--spacing-35);
}
@media (min-width: 992px) {
  .m-35-1 {
    margin: var(--spacing-1);
  }
}

.mt-35-1 {
  margin-top: var(--spacing-35) !important;
}
@media (min-width: 992px) {
  .mt-35-1 {
    margin-top: var(--spacing-1) !important;
  }
}

.mb-35-1 {
  margin-bottom: var(--spacing-35) !important;
}
@media (min-width: 992px) {
  .mb-35-1 {
    margin-bottom: var(--spacing-1) !important;
  }
}

.ml-35-1 {
  margin-left: var(--spacing-35) !important;
}
@media (min-width: 992px) {
  .ml-35-1 {
    margin-left: var(--spacing-1) !important;
  }
}

.gap-35-1 {
  gap: var(--spacing-35);
}
@media (min-width: 992px) {
  .gap-35-1 {
    gap: var(--spacing-1);
  }
}

.p-35-2 {
  padding: var(--spacing-35);
}
@media (min-width: 992px) {
  .p-35-2 {
    padding: var(--spacing-2);
  }
}

.pt-35-2 {
  padding-top: var(--spacing-35);
}
@media (min-width: 992px) {
  .pt-35-2 {
    padding-top: var(--spacing-2);
  }
}

.pb-35-2 {
  padding-bottom: var(--spacing-35);
}
@media (min-width: 992px) {
  .pb-35-2 {
    padding-bottom: var(--spacing-2);
  }
}

.p-inline-35-2 {
  padding-inline: var(--spacing-35);
}
@media (min-width: 992px) {
  .p-inline-35-2 {
    padding-inline: var(--spacing-2);
  }
}

.m-35-2 {
  margin: var(--spacing-35);
}
@media (min-width: 992px) {
  .m-35-2 {
    margin: var(--spacing-2);
  }
}

.mt-35-2 {
  margin-top: var(--spacing-35) !important;
}
@media (min-width: 992px) {
  .mt-35-2 {
    margin-top: var(--spacing-2) !important;
  }
}

.mb-35-2 {
  margin-bottom: var(--spacing-35) !important;
}
@media (min-width: 992px) {
  .mb-35-2 {
    margin-bottom: var(--spacing-2) !important;
  }
}

.ml-35-2 {
  margin-left: var(--spacing-35) !important;
}
@media (min-width: 992px) {
  .ml-35-2 {
    margin-left: var(--spacing-2) !important;
  }
}

.gap-35-2 {
  gap: var(--spacing-35);
}
@media (min-width: 992px) {
  .gap-35-2 {
    gap: var(--spacing-2);
  }
}

.p-35-25 {
  padding: var(--spacing-35);
}
@media (min-width: 992px) {
  .p-35-25 {
    padding: var(--spacing-25);
  }
}

.pt-35-25 {
  padding-top: var(--spacing-35);
}
@media (min-width: 992px) {
  .pt-35-25 {
    padding-top: var(--spacing-25);
  }
}

.pb-35-25 {
  padding-bottom: var(--spacing-35);
}
@media (min-width: 992px) {
  .pb-35-25 {
    padding-bottom: var(--spacing-25);
  }
}

.p-inline-35-25 {
  padding-inline: var(--spacing-35);
}
@media (min-width: 992px) {
  .p-inline-35-25 {
    padding-inline: var(--spacing-25);
  }
}

.m-35-25 {
  margin: var(--spacing-35);
}
@media (min-width: 992px) {
  .m-35-25 {
    margin: var(--spacing-25);
  }
}

.mt-35-25 {
  margin-top: var(--spacing-35) !important;
}
@media (min-width: 992px) {
  .mt-35-25 {
    margin-top: var(--spacing-25) !important;
  }
}

.mb-35-25 {
  margin-bottom: var(--spacing-35) !important;
}
@media (min-width: 992px) {
  .mb-35-25 {
    margin-bottom: var(--spacing-25) !important;
  }
}

.ml-35-25 {
  margin-left: var(--spacing-35) !important;
}
@media (min-width: 992px) {
  .ml-35-25 {
    margin-left: var(--spacing-25) !important;
  }
}

.gap-35-25 {
  gap: var(--spacing-35);
}
@media (min-width: 992px) {
  .gap-35-25 {
    gap: var(--spacing-25);
  }
}

.p-35-3 {
  padding: var(--spacing-35);
}
@media (min-width: 992px) {
  .p-35-3 {
    padding: var(--spacing-3);
  }
}

.pt-35-3 {
  padding-top: var(--spacing-35);
}
@media (min-width: 992px) {
  .pt-35-3 {
    padding-top: var(--spacing-3);
  }
}

.pb-35-3 {
  padding-bottom: var(--spacing-35);
}
@media (min-width: 992px) {
  .pb-35-3 {
    padding-bottom: var(--spacing-3);
  }
}

.p-inline-35-3 {
  padding-inline: var(--spacing-35);
}
@media (min-width: 992px) {
  .p-inline-35-3 {
    padding-inline: var(--spacing-3);
  }
}

.m-35-3 {
  margin: var(--spacing-35);
}
@media (min-width: 992px) {
  .m-35-3 {
    margin: var(--spacing-3);
  }
}

.mt-35-3 {
  margin-top: var(--spacing-35) !important;
}
@media (min-width: 992px) {
  .mt-35-3 {
    margin-top: var(--spacing-3) !important;
  }
}

.mb-35-3 {
  margin-bottom: var(--spacing-35) !important;
}
@media (min-width: 992px) {
  .mb-35-3 {
    margin-bottom: var(--spacing-3) !important;
  }
}

.ml-35-3 {
  margin-left: var(--spacing-35) !important;
}
@media (min-width: 992px) {
  .ml-35-3 {
    margin-left: var(--spacing-3) !important;
  }
}

.gap-35-3 {
  gap: var(--spacing-35);
}
@media (min-width: 992px) {
  .gap-35-3 {
    gap: var(--spacing-3);
  }
}

.p-35-35 {
  padding: var(--spacing-35);
}
@media (min-width: 992px) {
  .p-35-35 {
    padding: var(--spacing-35);
  }
}

.pt-35-35 {
  padding-top: var(--spacing-35);
}
@media (min-width: 992px) {
  .pt-35-35 {
    padding-top: var(--spacing-35);
  }
}

.pb-35-35 {
  padding-bottom: var(--spacing-35);
}
@media (min-width: 992px) {
  .pb-35-35 {
    padding-bottom: var(--spacing-35);
  }
}

.p-inline-35-35 {
  padding-inline: var(--spacing-35);
}
@media (min-width: 992px) {
  .p-inline-35-35 {
    padding-inline: var(--spacing-35);
  }
}

.m-35-35 {
  margin: var(--spacing-35);
}
@media (min-width: 992px) {
  .m-35-35 {
    margin: var(--spacing-35);
  }
}

.mt-35-35 {
  margin-top: var(--spacing-35) !important;
}
@media (min-width: 992px) {
  .mt-35-35 {
    margin-top: var(--spacing-35) !important;
  }
}

.mb-35-35 {
  margin-bottom: var(--spacing-35) !important;
}
@media (min-width: 992px) {
  .mb-35-35 {
    margin-bottom: var(--spacing-35) !important;
  }
}

.ml-35-35 {
  margin-left: var(--spacing-35) !important;
}
@media (min-width: 992px) {
  .ml-35-35 {
    margin-left: var(--spacing-35) !important;
  }
}

.gap-35-35 {
  gap: var(--spacing-35);
}
@media (min-width: 992px) {
  .gap-35-35 {
    gap: var(--spacing-35);
  }
}

.p-35-4 {
  padding: var(--spacing-35);
}
@media (min-width: 992px) {
  .p-35-4 {
    padding: var(--spacing-4);
  }
}

.pt-35-4 {
  padding-top: var(--spacing-35);
}
@media (min-width: 992px) {
  .pt-35-4 {
    padding-top: var(--spacing-4);
  }
}

.pb-35-4 {
  padding-bottom: var(--spacing-35);
}
@media (min-width: 992px) {
  .pb-35-4 {
    padding-bottom: var(--spacing-4);
  }
}

.p-inline-35-4 {
  padding-inline: var(--spacing-35);
}
@media (min-width: 992px) {
  .p-inline-35-4 {
    padding-inline: var(--spacing-4);
  }
}

.m-35-4 {
  margin: var(--spacing-35);
}
@media (min-width: 992px) {
  .m-35-4 {
    margin: var(--spacing-4);
  }
}

.mt-35-4 {
  margin-top: var(--spacing-35) !important;
}
@media (min-width: 992px) {
  .mt-35-4 {
    margin-top: var(--spacing-4) !important;
  }
}

.mb-35-4 {
  margin-bottom: var(--spacing-35) !important;
}
@media (min-width: 992px) {
  .mb-35-4 {
    margin-bottom: var(--spacing-4) !important;
  }
}

.ml-35-4 {
  margin-left: var(--spacing-35) !important;
}
@media (min-width: 992px) {
  .ml-35-4 {
    margin-left: var(--spacing-4) !important;
  }
}

.gap-35-4 {
  gap: var(--spacing-35);
}
@media (min-width: 992px) {
  .gap-35-4 {
    gap: var(--spacing-4);
  }
}

.p-35-5 {
  padding: var(--spacing-35);
}
@media (min-width: 992px) {
  .p-35-5 {
    padding: var(--spacing-5);
  }
}

.pt-35-5 {
  padding-top: var(--spacing-35);
}
@media (min-width: 992px) {
  .pt-35-5 {
    padding-top: var(--spacing-5);
  }
}

.pb-35-5 {
  padding-bottom: var(--spacing-35);
}
@media (min-width: 992px) {
  .pb-35-5 {
    padding-bottom: var(--spacing-5);
  }
}

.p-inline-35-5 {
  padding-inline: var(--spacing-35);
}
@media (min-width: 992px) {
  .p-inline-35-5 {
    padding-inline: var(--spacing-5);
  }
}

.m-35-5 {
  margin: var(--spacing-35);
}
@media (min-width: 992px) {
  .m-35-5 {
    margin: var(--spacing-5);
  }
}

.mt-35-5 {
  margin-top: var(--spacing-35) !important;
}
@media (min-width: 992px) {
  .mt-35-5 {
    margin-top: var(--spacing-5) !important;
  }
}

.mb-35-5 {
  margin-bottom: var(--spacing-35) !important;
}
@media (min-width: 992px) {
  .mb-35-5 {
    margin-bottom: var(--spacing-5) !important;
  }
}

.ml-35-5 {
  margin-left: var(--spacing-35) !important;
}
@media (min-width: 992px) {
  .ml-35-5 {
    margin-left: var(--spacing-5) !important;
  }
}

.gap-35-5 {
  gap: var(--spacing-35);
}
@media (min-width: 992px) {
  .gap-35-5 {
    gap: var(--spacing-5);
  }
}

.p-35-6 {
  padding: var(--spacing-35);
}
@media (min-width: 992px) {
  .p-35-6 {
    padding: var(--spacing-6);
  }
}

.pt-35-6 {
  padding-top: var(--spacing-35);
}
@media (min-width: 992px) {
  .pt-35-6 {
    padding-top: var(--spacing-6);
  }
}

.pb-35-6 {
  padding-bottom: var(--spacing-35);
}
@media (min-width: 992px) {
  .pb-35-6 {
    padding-bottom: var(--spacing-6);
  }
}

.p-inline-35-6 {
  padding-inline: var(--spacing-35);
}
@media (min-width: 992px) {
  .p-inline-35-6 {
    padding-inline: var(--spacing-6);
  }
}

.m-35-6 {
  margin: var(--spacing-35);
}
@media (min-width: 992px) {
  .m-35-6 {
    margin: var(--spacing-6);
  }
}

.mt-35-6 {
  margin-top: var(--spacing-35) !important;
}
@media (min-width: 992px) {
  .mt-35-6 {
    margin-top: var(--spacing-6) !important;
  }
}

.mb-35-6 {
  margin-bottom: var(--spacing-35) !important;
}
@media (min-width: 992px) {
  .mb-35-6 {
    margin-bottom: var(--spacing-6) !important;
  }
}

.ml-35-6 {
  margin-left: var(--spacing-35) !important;
}
@media (min-width: 992px) {
  .ml-35-6 {
    margin-left: var(--spacing-6) !important;
  }
}

.gap-35-6 {
  gap: var(--spacing-35);
}
@media (min-width: 992px) {
  .gap-35-6 {
    gap: var(--spacing-6);
  }
}

.p-35-7 {
  padding: var(--spacing-35);
}
@media (min-width: 992px) {
  .p-35-7 {
    padding: var(--spacing-7);
  }
}

.pt-35-7 {
  padding-top: var(--spacing-35);
}
@media (min-width: 992px) {
  .pt-35-7 {
    padding-top: var(--spacing-7);
  }
}

.pb-35-7 {
  padding-bottom: var(--spacing-35);
}
@media (min-width: 992px) {
  .pb-35-7 {
    padding-bottom: var(--spacing-7);
  }
}

.p-inline-35-7 {
  padding-inline: var(--spacing-35);
}
@media (min-width: 992px) {
  .p-inline-35-7 {
    padding-inline: var(--spacing-7);
  }
}

.m-35-7 {
  margin: var(--spacing-35);
}
@media (min-width: 992px) {
  .m-35-7 {
    margin: var(--spacing-7);
  }
}

.mt-35-7 {
  margin-top: var(--spacing-35) !important;
}
@media (min-width: 992px) {
  .mt-35-7 {
    margin-top: var(--spacing-7) !important;
  }
}

.mb-35-7 {
  margin-bottom: var(--spacing-35) !important;
}
@media (min-width: 992px) {
  .mb-35-7 {
    margin-bottom: var(--spacing-7) !important;
  }
}

.ml-35-7 {
  margin-left: var(--spacing-35) !important;
}
@media (min-width: 992px) {
  .ml-35-7 {
    margin-left: var(--spacing-7) !important;
  }
}

.gap-35-7 {
  gap: var(--spacing-35);
}
@media (min-width: 992px) {
  .gap-35-7 {
    gap: var(--spacing-7);
  }
}

.p-35-8 {
  padding: var(--spacing-35);
}
@media (min-width: 992px) {
  .p-35-8 {
    padding: var(--spacing-8);
  }
}

.pt-35-8 {
  padding-top: var(--spacing-35);
}
@media (min-width: 992px) {
  .pt-35-8 {
    padding-top: var(--spacing-8);
  }
}

.pb-35-8 {
  padding-bottom: var(--spacing-35);
}
@media (min-width: 992px) {
  .pb-35-8 {
    padding-bottom: var(--spacing-8);
  }
}

.p-inline-35-8 {
  padding-inline: var(--spacing-35);
}
@media (min-width: 992px) {
  .p-inline-35-8 {
    padding-inline: var(--spacing-8);
  }
}

.m-35-8 {
  margin: var(--spacing-35);
}
@media (min-width: 992px) {
  .m-35-8 {
    margin: var(--spacing-8);
  }
}

.mt-35-8 {
  margin-top: var(--spacing-35) !important;
}
@media (min-width: 992px) {
  .mt-35-8 {
    margin-top: var(--spacing-8) !important;
  }
}

.mb-35-8 {
  margin-bottom: var(--spacing-35) !important;
}
@media (min-width: 992px) {
  .mb-35-8 {
    margin-bottom: var(--spacing-8) !important;
  }
}

.ml-35-8 {
  margin-left: var(--spacing-35) !important;
}
@media (min-width: 992px) {
  .ml-35-8 {
    margin-left: var(--spacing-8) !important;
  }
}

.gap-35-8 {
  gap: var(--spacing-35);
}
@media (min-width: 992px) {
  .gap-35-8 {
    gap: var(--spacing-8);
  }
}

.p-35-9 {
  padding: var(--spacing-35);
}
@media (min-width: 992px) {
  .p-35-9 {
    padding: var(--spacing-9);
  }
}

.pt-35-9 {
  padding-top: var(--spacing-35);
}
@media (min-width: 992px) {
  .pt-35-9 {
    padding-top: var(--spacing-9);
  }
}

.pb-35-9 {
  padding-bottom: var(--spacing-35);
}
@media (min-width: 992px) {
  .pb-35-9 {
    padding-bottom: var(--spacing-9);
  }
}

.p-inline-35-9 {
  padding-inline: var(--spacing-35);
}
@media (min-width: 992px) {
  .p-inline-35-9 {
    padding-inline: var(--spacing-9);
  }
}

.m-35-9 {
  margin: var(--spacing-35);
}
@media (min-width: 992px) {
  .m-35-9 {
    margin: var(--spacing-9);
  }
}

.mt-35-9 {
  margin-top: var(--spacing-35) !important;
}
@media (min-width: 992px) {
  .mt-35-9 {
    margin-top: var(--spacing-9) !important;
  }
}

.mb-35-9 {
  margin-bottom: var(--spacing-35) !important;
}
@media (min-width: 992px) {
  .mb-35-9 {
    margin-bottom: var(--spacing-9) !important;
  }
}

.ml-35-9 {
  margin-left: var(--spacing-35) !important;
}
@media (min-width: 992px) {
  .ml-35-9 {
    margin-left: var(--spacing-9) !important;
  }
}

.gap-35-9 {
  gap: var(--spacing-35);
}
@media (min-width: 992px) {
  .gap-35-9 {
    gap: var(--spacing-9);
  }
}

.p-4-auto {
  padding: var(--spacing-4);
}
@media (min-width: 992px) {
  .p-4-auto {
    padding: auto;
  }
}

.pt-4-auto {
  padding-top: var(--spacing-4);
}
@media (min-width: 992px) {
  .pt-4-auto {
    padding-top: auto;
  }
}

.pb-4-auto {
  padding-bottom: var(--spacing-4);
}
@media (min-width: 992px) {
  .pb-4-auto {
    padding-bottom: auto;
  }
}

.p-inline-4-auto {
  padding-inline: var(--spacing-4);
}
@media (min-width: 992px) {
  .p-inline-4-auto {
    padding-inline: auto;
  }
}

.m-4-auto {
  margin: var(--spacing-4);
}
@media (min-width: 992px) {
  .m-4-auto {
    margin: auto;
  }
}

.mt-4-auto {
  margin-top: var(--spacing-4) !important;
}
@media (min-width: 992px) {
  .mt-4-auto {
    margin-top: auto !important;
  }
}

.mb-4-auto {
  margin-bottom: var(--spacing-4) !important;
}
@media (min-width: 992px) {
  .mb-4-auto {
    margin-bottom: auto !important;
  }
}

.ml-4-auto {
  margin-left: var(--spacing-4) !important;
}
@media (min-width: 992px) {
  .ml-4-auto {
    margin-left: auto !important;
  }
}

.gap-4-auto {
  gap: var(--spacing-4);
}
@media (min-width: 992px) {
  .gap-4-auto {
    gap: auto;
  }
}

.p-4-0 {
  padding: var(--spacing-4);
}
@media (min-width: 992px) {
  .p-4-0 {
    padding: var(--spacing-0);
  }
}

.pt-4-0 {
  padding-top: var(--spacing-4);
}
@media (min-width: 992px) {
  .pt-4-0 {
    padding-top: var(--spacing-0);
  }
}

.pb-4-0 {
  padding-bottom: var(--spacing-4);
}
@media (min-width: 992px) {
  .pb-4-0 {
    padding-bottom: var(--spacing-0);
  }
}

.p-inline-4-0 {
  padding-inline: var(--spacing-4);
}
@media (min-width: 992px) {
  .p-inline-4-0 {
    padding-inline: var(--spacing-0);
  }
}

.m-4-0 {
  margin: var(--spacing-4);
}
@media (min-width: 992px) {
  .m-4-0 {
    margin: var(--spacing-0);
  }
}

.mt-4-0 {
  margin-top: var(--spacing-4) !important;
}
@media (min-width: 992px) {
  .mt-4-0 {
    margin-top: var(--spacing-0) !important;
  }
}

.mb-4-0 {
  margin-bottom: var(--spacing-4) !important;
}
@media (min-width: 992px) {
  .mb-4-0 {
    margin-bottom: var(--spacing-0) !important;
  }
}

.ml-4-0 {
  margin-left: var(--spacing-4) !important;
}
@media (min-width: 992px) {
  .ml-4-0 {
    margin-left: var(--spacing-0) !important;
  }
}

.gap-4-0 {
  gap: var(--spacing-4);
}
@media (min-width: 992px) {
  .gap-4-0 {
    gap: var(--spacing-0);
  }
}

.p-4-1 {
  padding: var(--spacing-4);
}
@media (min-width: 992px) {
  .p-4-1 {
    padding: var(--spacing-1);
  }
}

.pt-4-1 {
  padding-top: var(--spacing-4);
}
@media (min-width: 992px) {
  .pt-4-1 {
    padding-top: var(--spacing-1);
  }
}

.pb-4-1 {
  padding-bottom: var(--spacing-4);
}
@media (min-width: 992px) {
  .pb-4-1 {
    padding-bottom: var(--spacing-1);
  }
}

.p-inline-4-1 {
  padding-inline: var(--spacing-4);
}
@media (min-width: 992px) {
  .p-inline-4-1 {
    padding-inline: var(--spacing-1);
  }
}

.m-4-1 {
  margin: var(--spacing-4);
}
@media (min-width: 992px) {
  .m-4-1 {
    margin: var(--spacing-1);
  }
}

.mt-4-1 {
  margin-top: var(--spacing-4) !important;
}
@media (min-width: 992px) {
  .mt-4-1 {
    margin-top: var(--spacing-1) !important;
  }
}

.mb-4-1 {
  margin-bottom: var(--spacing-4) !important;
}
@media (min-width: 992px) {
  .mb-4-1 {
    margin-bottom: var(--spacing-1) !important;
  }
}

.ml-4-1 {
  margin-left: var(--spacing-4) !important;
}
@media (min-width: 992px) {
  .ml-4-1 {
    margin-left: var(--spacing-1) !important;
  }
}

.gap-4-1 {
  gap: var(--spacing-4);
}
@media (min-width: 992px) {
  .gap-4-1 {
    gap: var(--spacing-1);
  }
}

.p-4-2 {
  padding: var(--spacing-4);
}
@media (min-width: 992px) {
  .p-4-2 {
    padding: var(--spacing-2);
  }
}

.pt-4-2 {
  padding-top: var(--spacing-4);
}
@media (min-width: 992px) {
  .pt-4-2 {
    padding-top: var(--spacing-2);
  }
}

.pb-4-2 {
  padding-bottom: var(--spacing-4);
}
@media (min-width: 992px) {
  .pb-4-2 {
    padding-bottom: var(--spacing-2);
  }
}

.p-inline-4-2 {
  padding-inline: var(--spacing-4);
}
@media (min-width: 992px) {
  .p-inline-4-2 {
    padding-inline: var(--spacing-2);
  }
}

.m-4-2 {
  margin: var(--spacing-4);
}
@media (min-width: 992px) {
  .m-4-2 {
    margin: var(--spacing-2);
  }
}

.mt-4-2 {
  margin-top: var(--spacing-4) !important;
}
@media (min-width: 992px) {
  .mt-4-2 {
    margin-top: var(--spacing-2) !important;
  }
}

.mb-4-2 {
  margin-bottom: var(--spacing-4) !important;
}
@media (min-width: 992px) {
  .mb-4-2 {
    margin-bottom: var(--spacing-2) !important;
  }
}

.ml-4-2 {
  margin-left: var(--spacing-4) !important;
}
@media (min-width: 992px) {
  .ml-4-2 {
    margin-left: var(--spacing-2) !important;
  }
}

.gap-4-2 {
  gap: var(--spacing-4);
}
@media (min-width: 992px) {
  .gap-4-2 {
    gap: var(--spacing-2);
  }
}

.p-4-25 {
  padding: var(--spacing-4);
}
@media (min-width: 992px) {
  .p-4-25 {
    padding: var(--spacing-25);
  }
}

.pt-4-25 {
  padding-top: var(--spacing-4);
}
@media (min-width: 992px) {
  .pt-4-25 {
    padding-top: var(--spacing-25);
  }
}

.pb-4-25 {
  padding-bottom: var(--spacing-4);
}
@media (min-width: 992px) {
  .pb-4-25 {
    padding-bottom: var(--spacing-25);
  }
}

.p-inline-4-25 {
  padding-inline: var(--spacing-4);
}
@media (min-width: 992px) {
  .p-inline-4-25 {
    padding-inline: var(--spacing-25);
  }
}

.m-4-25 {
  margin: var(--spacing-4);
}
@media (min-width: 992px) {
  .m-4-25 {
    margin: var(--spacing-25);
  }
}

.mt-4-25 {
  margin-top: var(--spacing-4) !important;
}
@media (min-width: 992px) {
  .mt-4-25 {
    margin-top: var(--spacing-25) !important;
  }
}

.mb-4-25 {
  margin-bottom: var(--spacing-4) !important;
}
@media (min-width: 992px) {
  .mb-4-25 {
    margin-bottom: var(--spacing-25) !important;
  }
}

.ml-4-25 {
  margin-left: var(--spacing-4) !important;
}
@media (min-width: 992px) {
  .ml-4-25 {
    margin-left: var(--spacing-25) !important;
  }
}

.gap-4-25 {
  gap: var(--spacing-4);
}
@media (min-width: 992px) {
  .gap-4-25 {
    gap: var(--spacing-25);
  }
}

.p-4-3 {
  padding: var(--spacing-4);
}
@media (min-width: 992px) {
  .p-4-3 {
    padding: var(--spacing-3);
  }
}

.pt-4-3 {
  padding-top: var(--spacing-4);
}
@media (min-width: 992px) {
  .pt-4-3 {
    padding-top: var(--spacing-3);
  }
}

.pb-4-3 {
  padding-bottom: var(--spacing-4);
}
@media (min-width: 992px) {
  .pb-4-3 {
    padding-bottom: var(--spacing-3);
  }
}

.p-inline-4-3 {
  padding-inline: var(--spacing-4);
}
@media (min-width: 992px) {
  .p-inline-4-3 {
    padding-inline: var(--spacing-3);
  }
}

.m-4-3 {
  margin: var(--spacing-4);
}
@media (min-width: 992px) {
  .m-4-3 {
    margin: var(--spacing-3);
  }
}

.mt-4-3 {
  margin-top: var(--spacing-4) !important;
}
@media (min-width: 992px) {
  .mt-4-3 {
    margin-top: var(--spacing-3) !important;
  }
}

.mb-4-3 {
  margin-bottom: var(--spacing-4) !important;
}
@media (min-width: 992px) {
  .mb-4-3 {
    margin-bottom: var(--spacing-3) !important;
  }
}

.ml-4-3 {
  margin-left: var(--spacing-4) !important;
}
@media (min-width: 992px) {
  .ml-4-3 {
    margin-left: var(--spacing-3) !important;
  }
}

.gap-4-3 {
  gap: var(--spacing-4);
}
@media (min-width: 992px) {
  .gap-4-3 {
    gap: var(--spacing-3);
  }
}

.p-4-35 {
  padding: var(--spacing-4);
}
@media (min-width: 992px) {
  .p-4-35 {
    padding: var(--spacing-35);
  }
}

.pt-4-35 {
  padding-top: var(--spacing-4);
}
@media (min-width: 992px) {
  .pt-4-35 {
    padding-top: var(--spacing-35);
  }
}

.pb-4-35 {
  padding-bottom: var(--spacing-4);
}
@media (min-width: 992px) {
  .pb-4-35 {
    padding-bottom: var(--spacing-35);
  }
}

.p-inline-4-35 {
  padding-inline: var(--spacing-4);
}
@media (min-width: 992px) {
  .p-inline-4-35 {
    padding-inline: var(--spacing-35);
  }
}

.m-4-35 {
  margin: var(--spacing-4);
}
@media (min-width: 992px) {
  .m-4-35 {
    margin: var(--spacing-35);
  }
}

.mt-4-35 {
  margin-top: var(--spacing-4) !important;
}
@media (min-width: 992px) {
  .mt-4-35 {
    margin-top: var(--spacing-35) !important;
  }
}

.mb-4-35 {
  margin-bottom: var(--spacing-4) !important;
}
@media (min-width: 992px) {
  .mb-4-35 {
    margin-bottom: var(--spacing-35) !important;
  }
}

.ml-4-35 {
  margin-left: var(--spacing-4) !important;
}
@media (min-width: 992px) {
  .ml-4-35 {
    margin-left: var(--spacing-35) !important;
  }
}

.gap-4-35 {
  gap: var(--spacing-4);
}
@media (min-width: 992px) {
  .gap-4-35 {
    gap: var(--spacing-35);
  }
}

.p-4-4 {
  padding: var(--spacing-4);
}
@media (min-width: 992px) {
  .p-4-4 {
    padding: var(--spacing-4);
  }
}

.pt-4-4 {
  padding-top: var(--spacing-4);
}
@media (min-width: 992px) {
  .pt-4-4 {
    padding-top: var(--spacing-4);
  }
}

.pb-4-4 {
  padding-bottom: var(--spacing-4);
}
@media (min-width: 992px) {
  .pb-4-4 {
    padding-bottom: var(--spacing-4);
  }
}

.p-inline-4-4 {
  padding-inline: var(--spacing-4);
}
@media (min-width: 992px) {
  .p-inline-4-4 {
    padding-inline: var(--spacing-4);
  }
}

.m-4-4 {
  margin: var(--spacing-4);
}
@media (min-width: 992px) {
  .m-4-4 {
    margin: var(--spacing-4);
  }
}

.mt-4-4 {
  margin-top: var(--spacing-4) !important;
}
@media (min-width: 992px) {
  .mt-4-4 {
    margin-top: var(--spacing-4) !important;
  }
}

.mb-4-4 {
  margin-bottom: var(--spacing-4) !important;
}
@media (min-width: 992px) {
  .mb-4-4 {
    margin-bottom: var(--spacing-4) !important;
  }
}

.ml-4-4 {
  margin-left: var(--spacing-4) !important;
}
@media (min-width: 992px) {
  .ml-4-4 {
    margin-left: var(--spacing-4) !important;
  }
}

.gap-4-4 {
  gap: var(--spacing-4);
}
@media (min-width: 992px) {
  .gap-4-4 {
    gap: var(--spacing-4);
  }
}

.p-4-5 {
  padding: var(--spacing-4);
}
@media (min-width: 992px) {
  .p-4-5 {
    padding: var(--spacing-5);
  }
}

.pt-4-5 {
  padding-top: var(--spacing-4);
}
@media (min-width: 992px) {
  .pt-4-5 {
    padding-top: var(--spacing-5);
  }
}

.pb-4-5 {
  padding-bottom: var(--spacing-4);
}
@media (min-width: 992px) {
  .pb-4-5 {
    padding-bottom: var(--spacing-5);
  }
}

.p-inline-4-5 {
  padding-inline: var(--spacing-4);
}
@media (min-width: 992px) {
  .p-inline-4-5 {
    padding-inline: var(--spacing-5);
  }
}

.m-4-5 {
  margin: var(--spacing-4);
}
@media (min-width: 992px) {
  .m-4-5 {
    margin: var(--spacing-5);
  }
}

.mt-4-5 {
  margin-top: var(--spacing-4) !important;
}
@media (min-width: 992px) {
  .mt-4-5 {
    margin-top: var(--spacing-5) !important;
  }
}

.mb-4-5 {
  margin-bottom: var(--spacing-4) !important;
}
@media (min-width: 992px) {
  .mb-4-5 {
    margin-bottom: var(--spacing-5) !important;
  }
}

.ml-4-5 {
  margin-left: var(--spacing-4) !important;
}
@media (min-width: 992px) {
  .ml-4-5 {
    margin-left: var(--spacing-5) !important;
  }
}

.gap-4-5 {
  gap: var(--spacing-4);
}
@media (min-width: 992px) {
  .gap-4-5 {
    gap: var(--spacing-5);
  }
}

.p-4-6 {
  padding: var(--spacing-4);
}
@media (min-width: 992px) {
  .p-4-6 {
    padding: var(--spacing-6);
  }
}

.pt-4-6 {
  padding-top: var(--spacing-4);
}
@media (min-width: 992px) {
  .pt-4-6 {
    padding-top: var(--spacing-6);
  }
}

.pb-4-6 {
  padding-bottom: var(--spacing-4);
}
@media (min-width: 992px) {
  .pb-4-6 {
    padding-bottom: var(--spacing-6);
  }
}

.p-inline-4-6 {
  padding-inline: var(--spacing-4);
}
@media (min-width: 992px) {
  .p-inline-4-6 {
    padding-inline: var(--spacing-6);
  }
}

.m-4-6 {
  margin: var(--spacing-4);
}
@media (min-width: 992px) {
  .m-4-6 {
    margin: var(--spacing-6);
  }
}

.mt-4-6 {
  margin-top: var(--spacing-4) !important;
}
@media (min-width: 992px) {
  .mt-4-6 {
    margin-top: var(--spacing-6) !important;
  }
}

.mb-4-6 {
  margin-bottom: var(--spacing-4) !important;
}
@media (min-width: 992px) {
  .mb-4-6 {
    margin-bottom: var(--spacing-6) !important;
  }
}

.ml-4-6 {
  margin-left: var(--spacing-4) !important;
}
@media (min-width: 992px) {
  .ml-4-6 {
    margin-left: var(--spacing-6) !important;
  }
}

.gap-4-6 {
  gap: var(--spacing-4);
}
@media (min-width: 992px) {
  .gap-4-6 {
    gap: var(--spacing-6);
  }
}

.p-4-7 {
  padding: var(--spacing-4);
}
@media (min-width: 992px) {
  .p-4-7 {
    padding: var(--spacing-7);
  }
}

.pt-4-7 {
  padding-top: var(--spacing-4);
}
@media (min-width: 992px) {
  .pt-4-7 {
    padding-top: var(--spacing-7);
  }
}

.pb-4-7 {
  padding-bottom: var(--spacing-4);
}
@media (min-width: 992px) {
  .pb-4-7 {
    padding-bottom: var(--spacing-7);
  }
}

.p-inline-4-7 {
  padding-inline: var(--spacing-4);
}
@media (min-width: 992px) {
  .p-inline-4-7 {
    padding-inline: var(--spacing-7);
  }
}

.m-4-7 {
  margin: var(--spacing-4);
}
@media (min-width: 992px) {
  .m-4-7 {
    margin: var(--spacing-7);
  }
}

.mt-4-7 {
  margin-top: var(--spacing-4) !important;
}
@media (min-width: 992px) {
  .mt-4-7 {
    margin-top: var(--spacing-7) !important;
  }
}

.mb-4-7 {
  margin-bottom: var(--spacing-4) !important;
}
@media (min-width: 992px) {
  .mb-4-7 {
    margin-bottom: var(--spacing-7) !important;
  }
}

.ml-4-7 {
  margin-left: var(--spacing-4) !important;
}
@media (min-width: 992px) {
  .ml-4-7 {
    margin-left: var(--spacing-7) !important;
  }
}

.gap-4-7 {
  gap: var(--spacing-4);
}
@media (min-width: 992px) {
  .gap-4-7 {
    gap: var(--spacing-7);
  }
}

.p-4-8 {
  padding: var(--spacing-4);
}
@media (min-width: 992px) {
  .p-4-8 {
    padding: var(--spacing-8);
  }
}

.pt-4-8 {
  padding-top: var(--spacing-4);
}
@media (min-width: 992px) {
  .pt-4-8 {
    padding-top: var(--spacing-8);
  }
}

.pb-4-8 {
  padding-bottom: var(--spacing-4);
}
@media (min-width: 992px) {
  .pb-4-8 {
    padding-bottom: var(--spacing-8);
  }
}

.p-inline-4-8 {
  padding-inline: var(--spacing-4);
}
@media (min-width: 992px) {
  .p-inline-4-8 {
    padding-inline: var(--spacing-8);
  }
}

.m-4-8 {
  margin: var(--spacing-4);
}
@media (min-width: 992px) {
  .m-4-8 {
    margin: var(--spacing-8);
  }
}

.mt-4-8 {
  margin-top: var(--spacing-4) !important;
}
@media (min-width: 992px) {
  .mt-4-8 {
    margin-top: var(--spacing-8) !important;
  }
}

.mb-4-8 {
  margin-bottom: var(--spacing-4) !important;
}
@media (min-width: 992px) {
  .mb-4-8 {
    margin-bottom: var(--spacing-8) !important;
  }
}

.ml-4-8 {
  margin-left: var(--spacing-4) !important;
}
@media (min-width: 992px) {
  .ml-4-8 {
    margin-left: var(--spacing-8) !important;
  }
}

.gap-4-8 {
  gap: var(--spacing-4);
}
@media (min-width: 992px) {
  .gap-4-8 {
    gap: var(--spacing-8);
  }
}

.p-4-9 {
  padding: var(--spacing-4);
}
@media (min-width: 992px) {
  .p-4-9 {
    padding: var(--spacing-9);
  }
}

.pt-4-9 {
  padding-top: var(--spacing-4);
}
@media (min-width: 992px) {
  .pt-4-9 {
    padding-top: var(--spacing-9);
  }
}

.pb-4-9 {
  padding-bottom: var(--spacing-4);
}
@media (min-width: 992px) {
  .pb-4-9 {
    padding-bottom: var(--spacing-9);
  }
}

.p-inline-4-9 {
  padding-inline: var(--spacing-4);
}
@media (min-width: 992px) {
  .p-inline-4-9 {
    padding-inline: var(--spacing-9);
  }
}

.m-4-9 {
  margin: var(--spacing-4);
}
@media (min-width: 992px) {
  .m-4-9 {
    margin: var(--spacing-9);
  }
}

.mt-4-9 {
  margin-top: var(--spacing-4) !important;
}
@media (min-width: 992px) {
  .mt-4-9 {
    margin-top: var(--spacing-9) !important;
  }
}

.mb-4-9 {
  margin-bottom: var(--spacing-4) !important;
}
@media (min-width: 992px) {
  .mb-4-9 {
    margin-bottom: var(--spacing-9) !important;
  }
}

.ml-4-9 {
  margin-left: var(--spacing-4) !important;
}
@media (min-width: 992px) {
  .ml-4-9 {
    margin-left: var(--spacing-9) !important;
  }
}

.gap-4-9 {
  gap: var(--spacing-4);
}
@media (min-width: 992px) {
  .gap-4-9 {
    gap: var(--spacing-9);
  }
}

.p-5-auto {
  padding: var(--spacing-5);
}
@media (min-width: 992px) {
  .p-5-auto {
    padding: auto;
  }
}

.pt-5-auto {
  padding-top: var(--spacing-5);
}
@media (min-width: 992px) {
  .pt-5-auto {
    padding-top: auto;
  }
}

.pb-5-auto {
  padding-bottom: var(--spacing-5);
}
@media (min-width: 992px) {
  .pb-5-auto {
    padding-bottom: auto;
  }
}

.p-inline-5-auto {
  padding-inline: var(--spacing-5);
}
@media (min-width: 992px) {
  .p-inline-5-auto {
    padding-inline: auto;
  }
}

.m-5-auto {
  margin: var(--spacing-5);
}
@media (min-width: 992px) {
  .m-5-auto {
    margin: auto;
  }
}

.mt-5-auto {
  margin-top: var(--spacing-5) !important;
}
@media (min-width: 992px) {
  .mt-5-auto {
    margin-top: auto !important;
  }
}

.mb-5-auto {
  margin-bottom: var(--spacing-5) !important;
}
@media (min-width: 992px) {
  .mb-5-auto {
    margin-bottom: auto !important;
  }
}

.ml-5-auto {
  margin-left: var(--spacing-5) !important;
}
@media (min-width: 992px) {
  .ml-5-auto {
    margin-left: auto !important;
  }
}

.gap-5-auto {
  gap: var(--spacing-5);
}
@media (min-width: 992px) {
  .gap-5-auto {
    gap: auto;
  }
}

.p-5-0 {
  padding: var(--spacing-5);
}
@media (min-width: 992px) {
  .p-5-0 {
    padding: var(--spacing-0);
  }
}

.pt-5-0 {
  padding-top: var(--spacing-5);
}
@media (min-width: 992px) {
  .pt-5-0 {
    padding-top: var(--spacing-0);
  }
}

.pb-5-0 {
  padding-bottom: var(--spacing-5);
}
@media (min-width: 992px) {
  .pb-5-0 {
    padding-bottom: var(--spacing-0);
  }
}

.p-inline-5-0 {
  padding-inline: var(--spacing-5);
}
@media (min-width: 992px) {
  .p-inline-5-0 {
    padding-inline: var(--spacing-0);
  }
}

.m-5-0 {
  margin: var(--spacing-5);
}
@media (min-width: 992px) {
  .m-5-0 {
    margin: var(--spacing-0);
  }
}

.mt-5-0 {
  margin-top: var(--spacing-5) !important;
}
@media (min-width: 992px) {
  .mt-5-0 {
    margin-top: var(--spacing-0) !important;
  }
}

.mb-5-0 {
  margin-bottom: var(--spacing-5) !important;
}
@media (min-width: 992px) {
  .mb-5-0 {
    margin-bottom: var(--spacing-0) !important;
  }
}

.ml-5-0 {
  margin-left: var(--spacing-5) !important;
}
@media (min-width: 992px) {
  .ml-5-0 {
    margin-left: var(--spacing-0) !important;
  }
}

.gap-5-0 {
  gap: var(--spacing-5);
}
@media (min-width: 992px) {
  .gap-5-0 {
    gap: var(--spacing-0);
  }
}

.p-5-1 {
  padding: var(--spacing-5);
}
@media (min-width: 992px) {
  .p-5-1 {
    padding: var(--spacing-1);
  }
}

.pt-5-1 {
  padding-top: var(--spacing-5);
}
@media (min-width: 992px) {
  .pt-5-1 {
    padding-top: var(--spacing-1);
  }
}

.pb-5-1 {
  padding-bottom: var(--spacing-5);
}
@media (min-width: 992px) {
  .pb-5-1 {
    padding-bottom: var(--spacing-1);
  }
}

.p-inline-5-1 {
  padding-inline: var(--spacing-5);
}
@media (min-width: 992px) {
  .p-inline-5-1 {
    padding-inline: var(--spacing-1);
  }
}

.m-5-1 {
  margin: var(--spacing-5);
}
@media (min-width: 992px) {
  .m-5-1 {
    margin: var(--spacing-1);
  }
}

.mt-5-1 {
  margin-top: var(--spacing-5) !important;
}
@media (min-width: 992px) {
  .mt-5-1 {
    margin-top: var(--spacing-1) !important;
  }
}

.mb-5-1 {
  margin-bottom: var(--spacing-5) !important;
}
@media (min-width: 992px) {
  .mb-5-1 {
    margin-bottom: var(--spacing-1) !important;
  }
}

.ml-5-1 {
  margin-left: var(--spacing-5) !important;
}
@media (min-width: 992px) {
  .ml-5-1 {
    margin-left: var(--spacing-1) !important;
  }
}

.gap-5-1 {
  gap: var(--spacing-5);
}
@media (min-width: 992px) {
  .gap-5-1 {
    gap: var(--spacing-1);
  }
}

.p-5-2 {
  padding: var(--spacing-5);
}
@media (min-width: 992px) {
  .p-5-2 {
    padding: var(--spacing-2);
  }
}

.pt-5-2 {
  padding-top: var(--spacing-5);
}
@media (min-width: 992px) {
  .pt-5-2 {
    padding-top: var(--spacing-2);
  }
}

.pb-5-2 {
  padding-bottom: var(--spacing-5);
}
@media (min-width: 992px) {
  .pb-5-2 {
    padding-bottom: var(--spacing-2);
  }
}

.p-inline-5-2 {
  padding-inline: var(--spacing-5);
}
@media (min-width: 992px) {
  .p-inline-5-2 {
    padding-inline: var(--spacing-2);
  }
}

.m-5-2 {
  margin: var(--spacing-5);
}
@media (min-width: 992px) {
  .m-5-2 {
    margin: var(--spacing-2);
  }
}

.mt-5-2 {
  margin-top: var(--spacing-5) !important;
}
@media (min-width: 992px) {
  .mt-5-2 {
    margin-top: var(--spacing-2) !important;
  }
}

.mb-5-2 {
  margin-bottom: var(--spacing-5) !important;
}
@media (min-width: 992px) {
  .mb-5-2 {
    margin-bottom: var(--spacing-2) !important;
  }
}

.ml-5-2 {
  margin-left: var(--spacing-5) !important;
}
@media (min-width: 992px) {
  .ml-5-2 {
    margin-left: var(--spacing-2) !important;
  }
}

.gap-5-2 {
  gap: var(--spacing-5);
}
@media (min-width: 992px) {
  .gap-5-2 {
    gap: var(--spacing-2);
  }
}

.p-5-25 {
  padding: var(--spacing-5);
}
@media (min-width: 992px) {
  .p-5-25 {
    padding: var(--spacing-25);
  }
}

.pt-5-25 {
  padding-top: var(--spacing-5);
}
@media (min-width: 992px) {
  .pt-5-25 {
    padding-top: var(--spacing-25);
  }
}

.pb-5-25 {
  padding-bottom: var(--spacing-5);
}
@media (min-width: 992px) {
  .pb-5-25 {
    padding-bottom: var(--spacing-25);
  }
}

.p-inline-5-25 {
  padding-inline: var(--spacing-5);
}
@media (min-width: 992px) {
  .p-inline-5-25 {
    padding-inline: var(--spacing-25);
  }
}

.m-5-25 {
  margin: var(--spacing-5);
}
@media (min-width: 992px) {
  .m-5-25 {
    margin: var(--spacing-25);
  }
}

.mt-5-25 {
  margin-top: var(--spacing-5) !important;
}
@media (min-width: 992px) {
  .mt-5-25 {
    margin-top: var(--spacing-25) !important;
  }
}

.mb-5-25 {
  margin-bottom: var(--spacing-5) !important;
}
@media (min-width: 992px) {
  .mb-5-25 {
    margin-bottom: var(--spacing-25) !important;
  }
}

.ml-5-25 {
  margin-left: var(--spacing-5) !important;
}
@media (min-width: 992px) {
  .ml-5-25 {
    margin-left: var(--spacing-25) !important;
  }
}

.gap-5-25 {
  gap: var(--spacing-5);
}
@media (min-width: 992px) {
  .gap-5-25 {
    gap: var(--spacing-25);
  }
}

.p-5-3 {
  padding: var(--spacing-5);
}
@media (min-width: 992px) {
  .p-5-3 {
    padding: var(--spacing-3);
  }
}

.pt-5-3 {
  padding-top: var(--spacing-5);
}
@media (min-width: 992px) {
  .pt-5-3 {
    padding-top: var(--spacing-3);
  }
}

.pb-5-3 {
  padding-bottom: var(--spacing-5);
}
@media (min-width: 992px) {
  .pb-5-3 {
    padding-bottom: var(--spacing-3);
  }
}

.p-inline-5-3 {
  padding-inline: var(--spacing-5);
}
@media (min-width: 992px) {
  .p-inline-5-3 {
    padding-inline: var(--spacing-3);
  }
}

.m-5-3 {
  margin: var(--spacing-5);
}
@media (min-width: 992px) {
  .m-5-3 {
    margin: var(--spacing-3);
  }
}

.mt-5-3 {
  margin-top: var(--spacing-5) !important;
}
@media (min-width: 992px) {
  .mt-5-3 {
    margin-top: var(--spacing-3) !important;
  }
}

.mb-5-3 {
  margin-bottom: var(--spacing-5) !important;
}
@media (min-width: 992px) {
  .mb-5-3 {
    margin-bottom: var(--spacing-3) !important;
  }
}

.ml-5-3 {
  margin-left: var(--spacing-5) !important;
}
@media (min-width: 992px) {
  .ml-5-3 {
    margin-left: var(--spacing-3) !important;
  }
}

.gap-5-3 {
  gap: var(--spacing-5);
}
@media (min-width: 992px) {
  .gap-5-3 {
    gap: var(--spacing-3);
  }
}

.p-5-35 {
  padding: var(--spacing-5);
}
@media (min-width: 992px) {
  .p-5-35 {
    padding: var(--spacing-35);
  }
}

.pt-5-35 {
  padding-top: var(--spacing-5);
}
@media (min-width: 992px) {
  .pt-5-35 {
    padding-top: var(--spacing-35);
  }
}

.pb-5-35 {
  padding-bottom: var(--spacing-5);
}
@media (min-width: 992px) {
  .pb-5-35 {
    padding-bottom: var(--spacing-35);
  }
}

.p-inline-5-35 {
  padding-inline: var(--spacing-5);
}
@media (min-width: 992px) {
  .p-inline-5-35 {
    padding-inline: var(--spacing-35);
  }
}

.m-5-35 {
  margin: var(--spacing-5);
}
@media (min-width: 992px) {
  .m-5-35 {
    margin: var(--spacing-35);
  }
}

.mt-5-35 {
  margin-top: var(--spacing-5) !important;
}
@media (min-width: 992px) {
  .mt-5-35 {
    margin-top: var(--spacing-35) !important;
  }
}

.mb-5-35 {
  margin-bottom: var(--spacing-5) !important;
}
@media (min-width: 992px) {
  .mb-5-35 {
    margin-bottom: var(--spacing-35) !important;
  }
}

.ml-5-35 {
  margin-left: var(--spacing-5) !important;
}
@media (min-width: 992px) {
  .ml-5-35 {
    margin-left: var(--spacing-35) !important;
  }
}

.gap-5-35 {
  gap: var(--spacing-5);
}
@media (min-width: 992px) {
  .gap-5-35 {
    gap: var(--spacing-35);
  }
}

.p-5-4 {
  padding: var(--spacing-5);
}
@media (min-width: 992px) {
  .p-5-4 {
    padding: var(--spacing-4);
  }
}

.pt-5-4 {
  padding-top: var(--spacing-5);
}
@media (min-width: 992px) {
  .pt-5-4 {
    padding-top: var(--spacing-4);
  }
}

.pb-5-4 {
  padding-bottom: var(--spacing-5);
}
@media (min-width: 992px) {
  .pb-5-4 {
    padding-bottom: var(--spacing-4);
  }
}

.p-inline-5-4 {
  padding-inline: var(--spacing-5);
}
@media (min-width: 992px) {
  .p-inline-5-4 {
    padding-inline: var(--spacing-4);
  }
}

.m-5-4 {
  margin: var(--spacing-5);
}
@media (min-width: 992px) {
  .m-5-4 {
    margin: var(--spacing-4);
  }
}

.mt-5-4 {
  margin-top: var(--spacing-5) !important;
}
@media (min-width: 992px) {
  .mt-5-4 {
    margin-top: var(--spacing-4) !important;
  }
}

.mb-5-4 {
  margin-bottom: var(--spacing-5) !important;
}
@media (min-width: 992px) {
  .mb-5-4 {
    margin-bottom: var(--spacing-4) !important;
  }
}

.ml-5-4 {
  margin-left: var(--spacing-5) !important;
}
@media (min-width: 992px) {
  .ml-5-4 {
    margin-left: var(--spacing-4) !important;
  }
}

.gap-5-4 {
  gap: var(--spacing-5);
}
@media (min-width: 992px) {
  .gap-5-4 {
    gap: var(--spacing-4);
  }
}

.p-5-5 {
  padding: var(--spacing-5);
}
@media (min-width: 992px) {
  .p-5-5 {
    padding: var(--spacing-5);
  }
}

.pt-5-5 {
  padding-top: var(--spacing-5);
}
@media (min-width: 992px) {
  .pt-5-5 {
    padding-top: var(--spacing-5);
  }
}

.pb-5-5 {
  padding-bottom: var(--spacing-5);
}
@media (min-width: 992px) {
  .pb-5-5 {
    padding-bottom: var(--spacing-5);
  }
}

.p-inline-5-5 {
  padding-inline: var(--spacing-5);
}
@media (min-width: 992px) {
  .p-inline-5-5 {
    padding-inline: var(--spacing-5);
  }
}

.m-5-5 {
  margin: var(--spacing-5);
}
@media (min-width: 992px) {
  .m-5-5 {
    margin: var(--spacing-5);
  }
}

.mt-5-5 {
  margin-top: var(--spacing-5) !important;
}
@media (min-width: 992px) {
  .mt-5-5 {
    margin-top: var(--spacing-5) !important;
  }
}

.mb-5-5 {
  margin-bottom: var(--spacing-5) !important;
}
@media (min-width: 992px) {
  .mb-5-5 {
    margin-bottom: var(--spacing-5) !important;
  }
}

.ml-5-5 {
  margin-left: var(--spacing-5) !important;
}
@media (min-width: 992px) {
  .ml-5-5 {
    margin-left: var(--spacing-5) !important;
  }
}

.gap-5-5 {
  gap: var(--spacing-5);
}
@media (min-width: 992px) {
  .gap-5-5 {
    gap: var(--spacing-5);
  }
}

.p-5-6 {
  padding: var(--spacing-5);
}
@media (min-width: 992px) {
  .p-5-6 {
    padding: var(--spacing-6);
  }
}

.pt-5-6 {
  padding-top: var(--spacing-5);
}
@media (min-width: 992px) {
  .pt-5-6 {
    padding-top: var(--spacing-6);
  }
}

.pb-5-6 {
  padding-bottom: var(--spacing-5);
}
@media (min-width: 992px) {
  .pb-5-6 {
    padding-bottom: var(--spacing-6);
  }
}

.p-inline-5-6 {
  padding-inline: var(--spacing-5);
}
@media (min-width: 992px) {
  .p-inline-5-6 {
    padding-inline: var(--spacing-6);
  }
}

.m-5-6 {
  margin: var(--spacing-5);
}
@media (min-width: 992px) {
  .m-5-6 {
    margin: var(--spacing-6);
  }
}

.mt-5-6 {
  margin-top: var(--spacing-5) !important;
}
@media (min-width: 992px) {
  .mt-5-6 {
    margin-top: var(--spacing-6) !important;
  }
}

.mb-5-6 {
  margin-bottom: var(--spacing-5) !important;
}
@media (min-width: 992px) {
  .mb-5-6 {
    margin-bottom: var(--spacing-6) !important;
  }
}

.ml-5-6 {
  margin-left: var(--spacing-5) !important;
}
@media (min-width: 992px) {
  .ml-5-6 {
    margin-left: var(--spacing-6) !important;
  }
}

.gap-5-6 {
  gap: var(--spacing-5);
}
@media (min-width: 992px) {
  .gap-5-6 {
    gap: var(--spacing-6);
  }
}

.p-5-7 {
  padding: var(--spacing-5);
}
@media (min-width: 992px) {
  .p-5-7 {
    padding: var(--spacing-7);
  }
}

.pt-5-7 {
  padding-top: var(--spacing-5);
}
@media (min-width: 992px) {
  .pt-5-7 {
    padding-top: var(--spacing-7);
  }
}

.pb-5-7 {
  padding-bottom: var(--spacing-5);
}
@media (min-width: 992px) {
  .pb-5-7 {
    padding-bottom: var(--spacing-7);
  }
}

.p-inline-5-7 {
  padding-inline: var(--spacing-5);
}
@media (min-width: 992px) {
  .p-inline-5-7 {
    padding-inline: var(--spacing-7);
  }
}

.m-5-7 {
  margin: var(--spacing-5);
}
@media (min-width: 992px) {
  .m-5-7 {
    margin: var(--spacing-7);
  }
}

.mt-5-7 {
  margin-top: var(--spacing-5) !important;
}
@media (min-width: 992px) {
  .mt-5-7 {
    margin-top: var(--spacing-7) !important;
  }
}

.mb-5-7 {
  margin-bottom: var(--spacing-5) !important;
}
@media (min-width: 992px) {
  .mb-5-7 {
    margin-bottom: var(--spacing-7) !important;
  }
}

.ml-5-7 {
  margin-left: var(--spacing-5) !important;
}
@media (min-width: 992px) {
  .ml-5-7 {
    margin-left: var(--spacing-7) !important;
  }
}

.gap-5-7 {
  gap: var(--spacing-5);
}
@media (min-width: 992px) {
  .gap-5-7 {
    gap: var(--spacing-7);
  }
}

.p-5-8 {
  padding: var(--spacing-5);
}
@media (min-width: 992px) {
  .p-5-8 {
    padding: var(--spacing-8);
  }
}

.pt-5-8 {
  padding-top: var(--spacing-5);
}
@media (min-width: 992px) {
  .pt-5-8 {
    padding-top: var(--spacing-8);
  }
}

.pb-5-8 {
  padding-bottom: var(--spacing-5);
}
@media (min-width: 992px) {
  .pb-5-8 {
    padding-bottom: var(--spacing-8);
  }
}

.p-inline-5-8 {
  padding-inline: var(--spacing-5);
}
@media (min-width: 992px) {
  .p-inline-5-8 {
    padding-inline: var(--spacing-8);
  }
}

.m-5-8 {
  margin: var(--spacing-5);
}
@media (min-width: 992px) {
  .m-5-8 {
    margin: var(--spacing-8);
  }
}

.mt-5-8 {
  margin-top: var(--spacing-5) !important;
}
@media (min-width: 992px) {
  .mt-5-8 {
    margin-top: var(--spacing-8) !important;
  }
}

.mb-5-8 {
  margin-bottom: var(--spacing-5) !important;
}
@media (min-width: 992px) {
  .mb-5-8 {
    margin-bottom: var(--spacing-8) !important;
  }
}

.ml-5-8 {
  margin-left: var(--spacing-5) !important;
}
@media (min-width: 992px) {
  .ml-5-8 {
    margin-left: var(--spacing-8) !important;
  }
}

.gap-5-8 {
  gap: var(--spacing-5);
}
@media (min-width: 992px) {
  .gap-5-8 {
    gap: var(--spacing-8);
  }
}

.p-5-9 {
  padding: var(--spacing-5);
}
@media (min-width: 992px) {
  .p-5-9 {
    padding: var(--spacing-9);
  }
}

.pt-5-9 {
  padding-top: var(--spacing-5);
}
@media (min-width: 992px) {
  .pt-5-9 {
    padding-top: var(--spacing-9);
  }
}

.pb-5-9 {
  padding-bottom: var(--spacing-5);
}
@media (min-width: 992px) {
  .pb-5-9 {
    padding-bottom: var(--spacing-9);
  }
}

.p-inline-5-9 {
  padding-inline: var(--spacing-5);
}
@media (min-width: 992px) {
  .p-inline-5-9 {
    padding-inline: var(--spacing-9);
  }
}

.m-5-9 {
  margin: var(--spacing-5);
}
@media (min-width: 992px) {
  .m-5-9 {
    margin: var(--spacing-9);
  }
}

.mt-5-9 {
  margin-top: var(--spacing-5) !important;
}
@media (min-width: 992px) {
  .mt-5-9 {
    margin-top: var(--spacing-9) !important;
  }
}

.mb-5-9 {
  margin-bottom: var(--spacing-5) !important;
}
@media (min-width: 992px) {
  .mb-5-9 {
    margin-bottom: var(--spacing-9) !important;
  }
}

.ml-5-9 {
  margin-left: var(--spacing-5) !important;
}
@media (min-width: 992px) {
  .ml-5-9 {
    margin-left: var(--spacing-9) !important;
  }
}

.gap-5-9 {
  gap: var(--spacing-5);
}
@media (min-width: 992px) {
  .gap-5-9 {
    gap: var(--spacing-9);
  }
}

.p-6-auto {
  padding: var(--spacing-6);
}
@media (min-width: 992px) {
  .p-6-auto {
    padding: auto;
  }
}

.pt-6-auto {
  padding-top: var(--spacing-6);
}
@media (min-width: 992px) {
  .pt-6-auto {
    padding-top: auto;
  }
}

.pb-6-auto {
  padding-bottom: var(--spacing-6);
}
@media (min-width: 992px) {
  .pb-6-auto {
    padding-bottom: auto;
  }
}

.p-inline-6-auto {
  padding-inline: var(--spacing-6);
}
@media (min-width: 992px) {
  .p-inline-6-auto {
    padding-inline: auto;
  }
}

.m-6-auto {
  margin: var(--spacing-6);
}
@media (min-width: 992px) {
  .m-6-auto {
    margin: auto;
  }
}

.mt-6-auto {
  margin-top: var(--spacing-6) !important;
}
@media (min-width: 992px) {
  .mt-6-auto {
    margin-top: auto !important;
  }
}

.mb-6-auto {
  margin-bottom: var(--spacing-6) !important;
}
@media (min-width: 992px) {
  .mb-6-auto {
    margin-bottom: auto !important;
  }
}

.ml-6-auto {
  margin-left: var(--spacing-6) !important;
}
@media (min-width: 992px) {
  .ml-6-auto {
    margin-left: auto !important;
  }
}

.gap-6-auto {
  gap: var(--spacing-6);
}
@media (min-width: 992px) {
  .gap-6-auto {
    gap: auto;
  }
}

.p-6-0 {
  padding: var(--spacing-6);
}
@media (min-width: 992px) {
  .p-6-0 {
    padding: var(--spacing-0);
  }
}

.pt-6-0 {
  padding-top: var(--spacing-6);
}
@media (min-width: 992px) {
  .pt-6-0 {
    padding-top: var(--spacing-0);
  }
}

.pb-6-0 {
  padding-bottom: var(--spacing-6);
}
@media (min-width: 992px) {
  .pb-6-0 {
    padding-bottom: var(--spacing-0);
  }
}

.p-inline-6-0 {
  padding-inline: var(--spacing-6);
}
@media (min-width: 992px) {
  .p-inline-6-0 {
    padding-inline: var(--spacing-0);
  }
}

.m-6-0 {
  margin: var(--spacing-6);
}
@media (min-width: 992px) {
  .m-6-0 {
    margin: var(--spacing-0);
  }
}

.mt-6-0 {
  margin-top: var(--spacing-6) !important;
}
@media (min-width: 992px) {
  .mt-6-0 {
    margin-top: var(--spacing-0) !important;
  }
}

.mb-6-0 {
  margin-bottom: var(--spacing-6) !important;
}
@media (min-width: 992px) {
  .mb-6-0 {
    margin-bottom: var(--spacing-0) !important;
  }
}

.ml-6-0 {
  margin-left: var(--spacing-6) !important;
}
@media (min-width: 992px) {
  .ml-6-0 {
    margin-left: var(--spacing-0) !important;
  }
}

.gap-6-0 {
  gap: var(--spacing-6);
}
@media (min-width: 992px) {
  .gap-6-0 {
    gap: var(--spacing-0);
  }
}

.p-6-1 {
  padding: var(--spacing-6);
}
@media (min-width: 992px) {
  .p-6-1 {
    padding: var(--spacing-1);
  }
}

.pt-6-1 {
  padding-top: var(--spacing-6);
}
@media (min-width: 992px) {
  .pt-6-1 {
    padding-top: var(--spacing-1);
  }
}

.pb-6-1 {
  padding-bottom: var(--spacing-6);
}
@media (min-width: 992px) {
  .pb-6-1 {
    padding-bottom: var(--spacing-1);
  }
}

.p-inline-6-1 {
  padding-inline: var(--spacing-6);
}
@media (min-width: 992px) {
  .p-inline-6-1 {
    padding-inline: var(--spacing-1);
  }
}

.m-6-1 {
  margin: var(--spacing-6);
}
@media (min-width: 992px) {
  .m-6-1 {
    margin: var(--spacing-1);
  }
}

.mt-6-1 {
  margin-top: var(--spacing-6) !important;
}
@media (min-width: 992px) {
  .mt-6-1 {
    margin-top: var(--spacing-1) !important;
  }
}

.mb-6-1 {
  margin-bottom: var(--spacing-6) !important;
}
@media (min-width: 992px) {
  .mb-6-1 {
    margin-bottom: var(--spacing-1) !important;
  }
}

.ml-6-1 {
  margin-left: var(--spacing-6) !important;
}
@media (min-width: 992px) {
  .ml-6-1 {
    margin-left: var(--spacing-1) !important;
  }
}

.gap-6-1 {
  gap: var(--spacing-6);
}
@media (min-width: 992px) {
  .gap-6-1 {
    gap: var(--spacing-1);
  }
}

.p-6-2 {
  padding: var(--spacing-6);
}
@media (min-width: 992px) {
  .p-6-2 {
    padding: var(--spacing-2);
  }
}

.pt-6-2 {
  padding-top: var(--spacing-6);
}
@media (min-width: 992px) {
  .pt-6-2 {
    padding-top: var(--spacing-2);
  }
}

.pb-6-2 {
  padding-bottom: var(--spacing-6);
}
@media (min-width: 992px) {
  .pb-6-2 {
    padding-bottom: var(--spacing-2);
  }
}

.p-inline-6-2 {
  padding-inline: var(--spacing-6);
}
@media (min-width: 992px) {
  .p-inline-6-2 {
    padding-inline: var(--spacing-2);
  }
}

.m-6-2 {
  margin: var(--spacing-6);
}
@media (min-width: 992px) {
  .m-6-2 {
    margin: var(--spacing-2);
  }
}

.mt-6-2 {
  margin-top: var(--spacing-6) !important;
}
@media (min-width: 992px) {
  .mt-6-2 {
    margin-top: var(--spacing-2) !important;
  }
}

.mb-6-2 {
  margin-bottom: var(--spacing-6) !important;
}
@media (min-width: 992px) {
  .mb-6-2 {
    margin-bottom: var(--spacing-2) !important;
  }
}

.ml-6-2 {
  margin-left: var(--spacing-6) !important;
}
@media (min-width: 992px) {
  .ml-6-2 {
    margin-left: var(--spacing-2) !important;
  }
}

.gap-6-2 {
  gap: var(--spacing-6);
}
@media (min-width: 992px) {
  .gap-6-2 {
    gap: var(--spacing-2);
  }
}

.p-6-25 {
  padding: var(--spacing-6);
}
@media (min-width: 992px) {
  .p-6-25 {
    padding: var(--spacing-25);
  }
}

.pt-6-25 {
  padding-top: var(--spacing-6);
}
@media (min-width: 992px) {
  .pt-6-25 {
    padding-top: var(--spacing-25);
  }
}

.pb-6-25 {
  padding-bottom: var(--spacing-6);
}
@media (min-width: 992px) {
  .pb-6-25 {
    padding-bottom: var(--spacing-25);
  }
}

.p-inline-6-25 {
  padding-inline: var(--spacing-6);
}
@media (min-width: 992px) {
  .p-inline-6-25 {
    padding-inline: var(--spacing-25);
  }
}

.m-6-25 {
  margin: var(--spacing-6);
}
@media (min-width: 992px) {
  .m-6-25 {
    margin: var(--spacing-25);
  }
}

.mt-6-25 {
  margin-top: var(--spacing-6) !important;
}
@media (min-width: 992px) {
  .mt-6-25 {
    margin-top: var(--spacing-25) !important;
  }
}

.mb-6-25 {
  margin-bottom: var(--spacing-6) !important;
}
@media (min-width: 992px) {
  .mb-6-25 {
    margin-bottom: var(--spacing-25) !important;
  }
}

.ml-6-25 {
  margin-left: var(--spacing-6) !important;
}
@media (min-width: 992px) {
  .ml-6-25 {
    margin-left: var(--spacing-25) !important;
  }
}

.gap-6-25 {
  gap: var(--spacing-6);
}
@media (min-width: 992px) {
  .gap-6-25 {
    gap: var(--spacing-25);
  }
}

.p-6-3 {
  padding: var(--spacing-6);
}
@media (min-width: 992px) {
  .p-6-3 {
    padding: var(--spacing-3);
  }
}

.pt-6-3 {
  padding-top: var(--spacing-6);
}
@media (min-width: 992px) {
  .pt-6-3 {
    padding-top: var(--spacing-3);
  }
}

.pb-6-3 {
  padding-bottom: var(--spacing-6);
}
@media (min-width: 992px) {
  .pb-6-3 {
    padding-bottom: var(--spacing-3);
  }
}

.p-inline-6-3 {
  padding-inline: var(--spacing-6);
}
@media (min-width: 992px) {
  .p-inline-6-3 {
    padding-inline: var(--spacing-3);
  }
}

.m-6-3 {
  margin: var(--spacing-6);
}
@media (min-width: 992px) {
  .m-6-3 {
    margin: var(--spacing-3);
  }
}

.mt-6-3 {
  margin-top: var(--spacing-6) !important;
}
@media (min-width: 992px) {
  .mt-6-3 {
    margin-top: var(--spacing-3) !important;
  }
}

.mb-6-3 {
  margin-bottom: var(--spacing-6) !important;
}
@media (min-width: 992px) {
  .mb-6-3 {
    margin-bottom: var(--spacing-3) !important;
  }
}

.ml-6-3 {
  margin-left: var(--spacing-6) !important;
}
@media (min-width: 992px) {
  .ml-6-3 {
    margin-left: var(--spacing-3) !important;
  }
}

.gap-6-3 {
  gap: var(--spacing-6);
}
@media (min-width: 992px) {
  .gap-6-3 {
    gap: var(--spacing-3);
  }
}

.p-6-35 {
  padding: var(--spacing-6);
}
@media (min-width: 992px) {
  .p-6-35 {
    padding: var(--spacing-35);
  }
}

.pt-6-35 {
  padding-top: var(--spacing-6);
}
@media (min-width: 992px) {
  .pt-6-35 {
    padding-top: var(--spacing-35);
  }
}

.pb-6-35 {
  padding-bottom: var(--spacing-6);
}
@media (min-width: 992px) {
  .pb-6-35 {
    padding-bottom: var(--spacing-35);
  }
}

.p-inline-6-35 {
  padding-inline: var(--spacing-6);
}
@media (min-width: 992px) {
  .p-inline-6-35 {
    padding-inline: var(--spacing-35);
  }
}

.m-6-35 {
  margin: var(--spacing-6);
}
@media (min-width: 992px) {
  .m-6-35 {
    margin: var(--spacing-35);
  }
}

.mt-6-35 {
  margin-top: var(--spacing-6) !important;
}
@media (min-width: 992px) {
  .mt-6-35 {
    margin-top: var(--spacing-35) !important;
  }
}

.mb-6-35 {
  margin-bottom: var(--spacing-6) !important;
}
@media (min-width: 992px) {
  .mb-6-35 {
    margin-bottom: var(--spacing-35) !important;
  }
}

.ml-6-35 {
  margin-left: var(--spacing-6) !important;
}
@media (min-width: 992px) {
  .ml-6-35 {
    margin-left: var(--spacing-35) !important;
  }
}

.gap-6-35 {
  gap: var(--spacing-6);
}
@media (min-width: 992px) {
  .gap-6-35 {
    gap: var(--spacing-35);
  }
}

.p-6-4 {
  padding: var(--spacing-6);
}
@media (min-width: 992px) {
  .p-6-4 {
    padding: var(--spacing-4);
  }
}

.pt-6-4 {
  padding-top: var(--spacing-6);
}
@media (min-width: 992px) {
  .pt-6-4 {
    padding-top: var(--spacing-4);
  }
}

.pb-6-4 {
  padding-bottom: var(--spacing-6);
}
@media (min-width: 992px) {
  .pb-6-4 {
    padding-bottom: var(--spacing-4);
  }
}

.p-inline-6-4 {
  padding-inline: var(--spacing-6);
}
@media (min-width: 992px) {
  .p-inline-6-4 {
    padding-inline: var(--spacing-4);
  }
}

.m-6-4 {
  margin: var(--spacing-6);
}
@media (min-width: 992px) {
  .m-6-4 {
    margin: var(--spacing-4);
  }
}

.mt-6-4 {
  margin-top: var(--spacing-6) !important;
}
@media (min-width: 992px) {
  .mt-6-4 {
    margin-top: var(--spacing-4) !important;
  }
}

.mb-6-4 {
  margin-bottom: var(--spacing-6) !important;
}
@media (min-width: 992px) {
  .mb-6-4 {
    margin-bottom: var(--spacing-4) !important;
  }
}

.ml-6-4 {
  margin-left: var(--spacing-6) !important;
}
@media (min-width: 992px) {
  .ml-6-4 {
    margin-left: var(--spacing-4) !important;
  }
}

.gap-6-4 {
  gap: var(--spacing-6);
}
@media (min-width: 992px) {
  .gap-6-4 {
    gap: var(--spacing-4);
  }
}

.p-6-5 {
  padding: var(--spacing-6);
}
@media (min-width: 992px) {
  .p-6-5 {
    padding: var(--spacing-5);
  }
}

.pt-6-5 {
  padding-top: var(--spacing-6);
}
@media (min-width: 992px) {
  .pt-6-5 {
    padding-top: var(--spacing-5);
  }
}

.pb-6-5 {
  padding-bottom: var(--spacing-6);
}
@media (min-width: 992px) {
  .pb-6-5 {
    padding-bottom: var(--spacing-5);
  }
}

.p-inline-6-5 {
  padding-inline: var(--spacing-6);
}
@media (min-width: 992px) {
  .p-inline-6-5 {
    padding-inline: var(--spacing-5);
  }
}

.m-6-5 {
  margin: var(--spacing-6);
}
@media (min-width: 992px) {
  .m-6-5 {
    margin: var(--spacing-5);
  }
}

.mt-6-5 {
  margin-top: var(--spacing-6) !important;
}
@media (min-width: 992px) {
  .mt-6-5 {
    margin-top: var(--spacing-5) !important;
  }
}

.mb-6-5 {
  margin-bottom: var(--spacing-6) !important;
}
@media (min-width: 992px) {
  .mb-6-5 {
    margin-bottom: var(--spacing-5) !important;
  }
}

.ml-6-5 {
  margin-left: var(--spacing-6) !important;
}
@media (min-width: 992px) {
  .ml-6-5 {
    margin-left: var(--spacing-5) !important;
  }
}

.gap-6-5 {
  gap: var(--spacing-6);
}
@media (min-width: 992px) {
  .gap-6-5 {
    gap: var(--spacing-5);
  }
}

.p-6-6 {
  padding: var(--spacing-6);
}
@media (min-width: 992px) {
  .p-6-6 {
    padding: var(--spacing-6);
  }
}

.pt-6-6 {
  padding-top: var(--spacing-6);
}
@media (min-width: 992px) {
  .pt-6-6 {
    padding-top: var(--spacing-6);
  }
}

.pb-6-6 {
  padding-bottom: var(--spacing-6);
}
@media (min-width: 992px) {
  .pb-6-6 {
    padding-bottom: var(--spacing-6);
  }
}

.p-inline-6-6 {
  padding-inline: var(--spacing-6);
}
@media (min-width: 992px) {
  .p-inline-6-6 {
    padding-inline: var(--spacing-6);
  }
}

.m-6-6 {
  margin: var(--spacing-6);
}
@media (min-width: 992px) {
  .m-6-6 {
    margin: var(--spacing-6);
  }
}

.mt-6-6 {
  margin-top: var(--spacing-6) !important;
}
@media (min-width: 992px) {
  .mt-6-6 {
    margin-top: var(--spacing-6) !important;
  }
}

.mb-6-6 {
  margin-bottom: var(--spacing-6) !important;
}
@media (min-width: 992px) {
  .mb-6-6 {
    margin-bottom: var(--spacing-6) !important;
  }
}

.ml-6-6 {
  margin-left: var(--spacing-6) !important;
}
@media (min-width: 992px) {
  .ml-6-6 {
    margin-left: var(--spacing-6) !important;
  }
}

.gap-6-6 {
  gap: var(--spacing-6);
}
@media (min-width: 992px) {
  .gap-6-6 {
    gap: var(--spacing-6);
  }
}

.p-6-7 {
  padding: var(--spacing-6);
}
@media (min-width: 992px) {
  .p-6-7 {
    padding: var(--spacing-7);
  }
}

.pt-6-7 {
  padding-top: var(--spacing-6);
}
@media (min-width: 992px) {
  .pt-6-7 {
    padding-top: var(--spacing-7);
  }
}

.pb-6-7 {
  padding-bottom: var(--spacing-6);
}
@media (min-width: 992px) {
  .pb-6-7 {
    padding-bottom: var(--spacing-7);
  }
}

.p-inline-6-7 {
  padding-inline: var(--spacing-6);
}
@media (min-width: 992px) {
  .p-inline-6-7 {
    padding-inline: var(--spacing-7);
  }
}

.m-6-7 {
  margin: var(--spacing-6);
}
@media (min-width: 992px) {
  .m-6-7 {
    margin: var(--spacing-7);
  }
}

.mt-6-7 {
  margin-top: var(--spacing-6) !important;
}
@media (min-width: 992px) {
  .mt-6-7 {
    margin-top: var(--spacing-7) !important;
  }
}

.mb-6-7 {
  margin-bottom: var(--spacing-6) !important;
}
@media (min-width: 992px) {
  .mb-6-7 {
    margin-bottom: var(--spacing-7) !important;
  }
}

.ml-6-7 {
  margin-left: var(--spacing-6) !important;
}
@media (min-width: 992px) {
  .ml-6-7 {
    margin-left: var(--spacing-7) !important;
  }
}

.gap-6-7 {
  gap: var(--spacing-6);
}
@media (min-width: 992px) {
  .gap-6-7 {
    gap: var(--spacing-7);
  }
}

.p-6-8 {
  padding: var(--spacing-6);
}
@media (min-width: 992px) {
  .p-6-8 {
    padding: var(--spacing-8);
  }
}

.pt-6-8 {
  padding-top: var(--spacing-6);
}
@media (min-width: 992px) {
  .pt-6-8 {
    padding-top: var(--spacing-8);
  }
}

.pb-6-8 {
  padding-bottom: var(--spacing-6);
}
@media (min-width: 992px) {
  .pb-6-8 {
    padding-bottom: var(--spacing-8);
  }
}

.p-inline-6-8 {
  padding-inline: var(--spacing-6);
}
@media (min-width: 992px) {
  .p-inline-6-8 {
    padding-inline: var(--spacing-8);
  }
}

.m-6-8 {
  margin: var(--spacing-6);
}
@media (min-width: 992px) {
  .m-6-8 {
    margin: var(--spacing-8);
  }
}

.mt-6-8 {
  margin-top: var(--spacing-6) !important;
}
@media (min-width: 992px) {
  .mt-6-8 {
    margin-top: var(--spacing-8) !important;
  }
}

.mb-6-8 {
  margin-bottom: var(--spacing-6) !important;
}
@media (min-width: 992px) {
  .mb-6-8 {
    margin-bottom: var(--spacing-8) !important;
  }
}

.ml-6-8 {
  margin-left: var(--spacing-6) !important;
}
@media (min-width: 992px) {
  .ml-6-8 {
    margin-left: var(--spacing-8) !important;
  }
}

.gap-6-8 {
  gap: var(--spacing-6);
}
@media (min-width: 992px) {
  .gap-6-8 {
    gap: var(--spacing-8);
  }
}

.p-6-9 {
  padding: var(--spacing-6);
}
@media (min-width: 992px) {
  .p-6-9 {
    padding: var(--spacing-9);
  }
}

.pt-6-9 {
  padding-top: var(--spacing-6);
}
@media (min-width: 992px) {
  .pt-6-9 {
    padding-top: var(--spacing-9);
  }
}

.pb-6-9 {
  padding-bottom: var(--spacing-6);
}
@media (min-width: 992px) {
  .pb-6-9 {
    padding-bottom: var(--spacing-9);
  }
}

.p-inline-6-9 {
  padding-inline: var(--spacing-6);
}
@media (min-width: 992px) {
  .p-inline-6-9 {
    padding-inline: var(--spacing-9);
  }
}

.m-6-9 {
  margin: var(--spacing-6);
}
@media (min-width: 992px) {
  .m-6-9 {
    margin: var(--spacing-9);
  }
}

.mt-6-9 {
  margin-top: var(--spacing-6) !important;
}
@media (min-width: 992px) {
  .mt-6-9 {
    margin-top: var(--spacing-9) !important;
  }
}

.mb-6-9 {
  margin-bottom: var(--spacing-6) !important;
}
@media (min-width: 992px) {
  .mb-6-9 {
    margin-bottom: var(--spacing-9) !important;
  }
}

.ml-6-9 {
  margin-left: var(--spacing-6) !important;
}
@media (min-width: 992px) {
  .ml-6-9 {
    margin-left: var(--spacing-9) !important;
  }
}

.gap-6-9 {
  gap: var(--spacing-6);
}
@media (min-width: 992px) {
  .gap-6-9 {
    gap: var(--spacing-9);
  }
}

.p-7-auto {
  padding: var(--spacing-7);
}
@media (min-width: 992px) {
  .p-7-auto {
    padding: auto;
  }
}

.pt-7-auto {
  padding-top: var(--spacing-7);
}
@media (min-width: 992px) {
  .pt-7-auto {
    padding-top: auto;
  }
}

.pb-7-auto {
  padding-bottom: var(--spacing-7);
}
@media (min-width: 992px) {
  .pb-7-auto {
    padding-bottom: auto;
  }
}

.p-inline-7-auto {
  padding-inline: var(--spacing-7);
}
@media (min-width: 992px) {
  .p-inline-7-auto {
    padding-inline: auto;
  }
}

.m-7-auto {
  margin: var(--spacing-7);
}
@media (min-width: 992px) {
  .m-7-auto {
    margin: auto;
  }
}

.mt-7-auto {
  margin-top: var(--spacing-7) !important;
}
@media (min-width: 992px) {
  .mt-7-auto {
    margin-top: auto !important;
  }
}

.mb-7-auto {
  margin-bottom: var(--spacing-7) !important;
}
@media (min-width: 992px) {
  .mb-7-auto {
    margin-bottom: auto !important;
  }
}

.ml-7-auto {
  margin-left: var(--spacing-7) !important;
}
@media (min-width: 992px) {
  .ml-7-auto {
    margin-left: auto !important;
  }
}

.gap-7-auto {
  gap: var(--spacing-7);
}
@media (min-width: 992px) {
  .gap-7-auto {
    gap: auto;
  }
}

.p-7-0 {
  padding: var(--spacing-7);
}
@media (min-width: 992px) {
  .p-7-0 {
    padding: var(--spacing-0);
  }
}

.pt-7-0 {
  padding-top: var(--spacing-7);
}
@media (min-width: 992px) {
  .pt-7-0 {
    padding-top: var(--spacing-0);
  }
}

.pb-7-0 {
  padding-bottom: var(--spacing-7);
}
@media (min-width: 992px) {
  .pb-7-0 {
    padding-bottom: var(--spacing-0);
  }
}

.p-inline-7-0 {
  padding-inline: var(--spacing-7);
}
@media (min-width: 992px) {
  .p-inline-7-0 {
    padding-inline: var(--spacing-0);
  }
}

.m-7-0 {
  margin: var(--spacing-7);
}
@media (min-width: 992px) {
  .m-7-0 {
    margin: var(--spacing-0);
  }
}

.mt-7-0 {
  margin-top: var(--spacing-7) !important;
}
@media (min-width: 992px) {
  .mt-7-0 {
    margin-top: var(--spacing-0) !important;
  }
}

.mb-7-0 {
  margin-bottom: var(--spacing-7) !important;
}
@media (min-width: 992px) {
  .mb-7-0 {
    margin-bottom: var(--spacing-0) !important;
  }
}

.ml-7-0 {
  margin-left: var(--spacing-7) !important;
}
@media (min-width: 992px) {
  .ml-7-0 {
    margin-left: var(--spacing-0) !important;
  }
}

.gap-7-0 {
  gap: var(--spacing-7);
}
@media (min-width: 992px) {
  .gap-7-0 {
    gap: var(--spacing-0);
  }
}

.p-7-1 {
  padding: var(--spacing-7);
}
@media (min-width: 992px) {
  .p-7-1 {
    padding: var(--spacing-1);
  }
}

.pt-7-1 {
  padding-top: var(--spacing-7);
}
@media (min-width: 992px) {
  .pt-7-1 {
    padding-top: var(--spacing-1);
  }
}

.pb-7-1 {
  padding-bottom: var(--spacing-7);
}
@media (min-width: 992px) {
  .pb-7-1 {
    padding-bottom: var(--spacing-1);
  }
}

.p-inline-7-1 {
  padding-inline: var(--spacing-7);
}
@media (min-width: 992px) {
  .p-inline-7-1 {
    padding-inline: var(--spacing-1);
  }
}

.m-7-1 {
  margin: var(--spacing-7);
}
@media (min-width: 992px) {
  .m-7-1 {
    margin: var(--spacing-1);
  }
}

.mt-7-1 {
  margin-top: var(--spacing-7) !important;
}
@media (min-width: 992px) {
  .mt-7-1 {
    margin-top: var(--spacing-1) !important;
  }
}

.mb-7-1 {
  margin-bottom: var(--spacing-7) !important;
}
@media (min-width: 992px) {
  .mb-7-1 {
    margin-bottom: var(--spacing-1) !important;
  }
}

.ml-7-1 {
  margin-left: var(--spacing-7) !important;
}
@media (min-width: 992px) {
  .ml-7-1 {
    margin-left: var(--spacing-1) !important;
  }
}

.gap-7-1 {
  gap: var(--spacing-7);
}
@media (min-width: 992px) {
  .gap-7-1 {
    gap: var(--spacing-1);
  }
}

.p-7-2 {
  padding: var(--spacing-7);
}
@media (min-width: 992px) {
  .p-7-2 {
    padding: var(--spacing-2);
  }
}

.pt-7-2 {
  padding-top: var(--spacing-7);
}
@media (min-width: 992px) {
  .pt-7-2 {
    padding-top: var(--spacing-2);
  }
}

.pb-7-2 {
  padding-bottom: var(--spacing-7);
}
@media (min-width: 992px) {
  .pb-7-2 {
    padding-bottom: var(--spacing-2);
  }
}

.p-inline-7-2 {
  padding-inline: var(--spacing-7);
}
@media (min-width: 992px) {
  .p-inline-7-2 {
    padding-inline: var(--spacing-2);
  }
}

.m-7-2 {
  margin: var(--spacing-7);
}
@media (min-width: 992px) {
  .m-7-2 {
    margin: var(--spacing-2);
  }
}

.mt-7-2 {
  margin-top: var(--spacing-7) !important;
}
@media (min-width: 992px) {
  .mt-7-2 {
    margin-top: var(--spacing-2) !important;
  }
}

.mb-7-2 {
  margin-bottom: var(--spacing-7) !important;
}
@media (min-width: 992px) {
  .mb-7-2 {
    margin-bottom: var(--spacing-2) !important;
  }
}

.ml-7-2 {
  margin-left: var(--spacing-7) !important;
}
@media (min-width: 992px) {
  .ml-7-2 {
    margin-left: var(--spacing-2) !important;
  }
}

.gap-7-2 {
  gap: var(--spacing-7);
}
@media (min-width: 992px) {
  .gap-7-2 {
    gap: var(--spacing-2);
  }
}

.p-7-25 {
  padding: var(--spacing-7);
}
@media (min-width: 992px) {
  .p-7-25 {
    padding: var(--spacing-25);
  }
}

.pt-7-25 {
  padding-top: var(--spacing-7);
}
@media (min-width: 992px) {
  .pt-7-25 {
    padding-top: var(--spacing-25);
  }
}

.pb-7-25 {
  padding-bottom: var(--spacing-7);
}
@media (min-width: 992px) {
  .pb-7-25 {
    padding-bottom: var(--spacing-25);
  }
}

.p-inline-7-25 {
  padding-inline: var(--spacing-7);
}
@media (min-width: 992px) {
  .p-inline-7-25 {
    padding-inline: var(--spacing-25);
  }
}

.m-7-25 {
  margin: var(--spacing-7);
}
@media (min-width: 992px) {
  .m-7-25 {
    margin: var(--spacing-25);
  }
}

.mt-7-25 {
  margin-top: var(--spacing-7) !important;
}
@media (min-width: 992px) {
  .mt-7-25 {
    margin-top: var(--spacing-25) !important;
  }
}

.mb-7-25 {
  margin-bottom: var(--spacing-7) !important;
}
@media (min-width: 992px) {
  .mb-7-25 {
    margin-bottom: var(--spacing-25) !important;
  }
}

.ml-7-25 {
  margin-left: var(--spacing-7) !important;
}
@media (min-width: 992px) {
  .ml-7-25 {
    margin-left: var(--spacing-25) !important;
  }
}

.gap-7-25 {
  gap: var(--spacing-7);
}
@media (min-width: 992px) {
  .gap-7-25 {
    gap: var(--spacing-25);
  }
}

.p-7-3 {
  padding: var(--spacing-7);
}
@media (min-width: 992px) {
  .p-7-3 {
    padding: var(--spacing-3);
  }
}

.pt-7-3 {
  padding-top: var(--spacing-7);
}
@media (min-width: 992px) {
  .pt-7-3 {
    padding-top: var(--spacing-3);
  }
}

.pb-7-3 {
  padding-bottom: var(--spacing-7);
}
@media (min-width: 992px) {
  .pb-7-3 {
    padding-bottom: var(--spacing-3);
  }
}

.p-inline-7-3 {
  padding-inline: var(--spacing-7);
}
@media (min-width: 992px) {
  .p-inline-7-3 {
    padding-inline: var(--spacing-3);
  }
}

.m-7-3 {
  margin: var(--spacing-7);
}
@media (min-width: 992px) {
  .m-7-3 {
    margin: var(--spacing-3);
  }
}

.mt-7-3 {
  margin-top: var(--spacing-7) !important;
}
@media (min-width: 992px) {
  .mt-7-3 {
    margin-top: var(--spacing-3) !important;
  }
}

.mb-7-3 {
  margin-bottom: var(--spacing-7) !important;
}
@media (min-width: 992px) {
  .mb-7-3 {
    margin-bottom: var(--spacing-3) !important;
  }
}

.ml-7-3 {
  margin-left: var(--spacing-7) !important;
}
@media (min-width: 992px) {
  .ml-7-3 {
    margin-left: var(--spacing-3) !important;
  }
}

.gap-7-3 {
  gap: var(--spacing-7);
}
@media (min-width: 992px) {
  .gap-7-3 {
    gap: var(--spacing-3);
  }
}

.p-7-35 {
  padding: var(--spacing-7);
}
@media (min-width: 992px) {
  .p-7-35 {
    padding: var(--spacing-35);
  }
}

.pt-7-35 {
  padding-top: var(--spacing-7);
}
@media (min-width: 992px) {
  .pt-7-35 {
    padding-top: var(--spacing-35);
  }
}

.pb-7-35 {
  padding-bottom: var(--spacing-7);
}
@media (min-width: 992px) {
  .pb-7-35 {
    padding-bottom: var(--spacing-35);
  }
}

.p-inline-7-35 {
  padding-inline: var(--spacing-7);
}
@media (min-width: 992px) {
  .p-inline-7-35 {
    padding-inline: var(--spacing-35);
  }
}

.m-7-35 {
  margin: var(--spacing-7);
}
@media (min-width: 992px) {
  .m-7-35 {
    margin: var(--spacing-35);
  }
}

.mt-7-35 {
  margin-top: var(--spacing-7) !important;
}
@media (min-width: 992px) {
  .mt-7-35 {
    margin-top: var(--spacing-35) !important;
  }
}

.mb-7-35 {
  margin-bottom: var(--spacing-7) !important;
}
@media (min-width: 992px) {
  .mb-7-35 {
    margin-bottom: var(--spacing-35) !important;
  }
}

.ml-7-35 {
  margin-left: var(--spacing-7) !important;
}
@media (min-width: 992px) {
  .ml-7-35 {
    margin-left: var(--spacing-35) !important;
  }
}

.gap-7-35 {
  gap: var(--spacing-7);
}
@media (min-width: 992px) {
  .gap-7-35 {
    gap: var(--spacing-35);
  }
}

.p-7-4 {
  padding: var(--spacing-7);
}
@media (min-width: 992px) {
  .p-7-4 {
    padding: var(--spacing-4);
  }
}

.pt-7-4 {
  padding-top: var(--spacing-7);
}
@media (min-width: 992px) {
  .pt-7-4 {
    padding-top: var(--spacing-4);
  }
}

.pb-7-4 {
  padding-bottom: var(--spacing-7);
}
@media (min-width: 992px) {
  .pb-7-4 {
    padding-bottom: var(--spacing-4);
  }
}

.p-inline-7-4 {
  padding-inline: var(--spacing-7);
}
@media (min-width: 992px) {
  .p-inline-7-4 {
    padding-inline: var(--spacing-4);
  }
}

.m-7-4 {
  margin: var(--spacing-7);
}
@media (min-width: 992px) {
  .m-7-4 {
    margin: var(--spacing-4);
  }
}

.mt-7-4 {
  margin-top: var(--spacing-7) !important;
}
@media (min-width: 992px) {
  .mt-7-4 {
    margin-top: var(--spacing-4) !important;
  }
}

.mb-7-4 {
  margin-bottom: var(--spacing-7) !important;
}
@media (min-width: 992px) {
  .mb-7-4 {
    margin-bottom: var(--spacing-4) !important;
  }
}

.ml-7-4 {
  margin-left: var(--spacing-7) !important;
}
@media (min-width: 992px) {
  .ml-7-4 {
    margin-left: var(--spacing-4) !important;
  }
}

.gap-7-4 {
  gap: var(--spacing-7);
}
@media (min-width: 992px) {
  .gap-7-4 {
    gap: var(--spacing-4);
  }
}

.p-7-5 {
  padding: var(--spacing-7);
}
@media (min-width: 992px) {
  .p-7-5 {
    padding: var(--spacing-5);
  }
}

.pt-7-5 {
  padding-top: var(--spacing-7);
}
@media (min-width: 992px) {
  .pt-7-5 {
    padding-top: var(--spacing-5);
  }
}

.pb-7-5 {
  padding-bottom: var(--spacing-7);
}
@media (min-width: 992px) {
  .pb-7-5 {
    padding-bottom: var(--spacing-5);
  }
}

.p-inline-7-5 {
  padding-inline: var(--spacing-7);
}
@media (min-width: 992px) {
  .p-inline-7-5 {
    padding-inline: var(--spacing-5);
  }
}

.m-7-5 {
  margin: var(--spacing-7);
}
@media (min-width: 992px) {
  .m-7-5 {
    margin: var(--spacing-5);
  }
}

.mt-7-5 {
  margin-top: var(--spacing-7) !important;
}
@media (min-width: 992px) {
  .mt-7-5 {
    margin-top: var(--spacing-5) !important;
  }
}

.mb-7-5 {
  margin-bottom: var(--spacing-7) !important;
}
@media (min-width: 992px) {
  .mb-7-5 {
    margin-bottom: var(--spacing-5) !important;
  }
}

.ml-7-5 {
  margin-left: var(--spacing-7) !important;
}
@media (min-width: 992px) {
  .ml-7-5 {
    margin-left: var(--spacing-5) !important;
  }
}

.gap-7-5 {
  gap: var(--spacing-7);
}
@media (min-width: 992px) {
  .gap-7-5 {
    gap: var(--spacing-5);
  }
}

.p-7-6 {
  padding: var(--spacing-7);
}
@media (min-width: 992px) {
  .p-7-6 {
    padding: var(--spacing-6);
  }
}

.pt-7-6 {
  padding-top: var(--spacing-7);
}
@media (min-width: 992px) {
  .pt-7-6 {
    padding-top: var(--spacing-6);
  }
}

.pb-7-6 {
  padding-bottom: var(--spacing-7);
}
@media (min-width: 992px) {
  .pb-7-6 {
    padding-bottom: var(--spacing-6);
  }
}

.p-inline-7-6 {
  padding-inline: var(--spacing-7);
}
@media (min-width: 992px) {
  .p-inline-7-6 {
    padding-inline: var(--spacing-6);
  }
}

.m-7-6 {
  margin: var(--spacing-7);
}
@media (min-width: 992px) {
  .m-7-6 {
    margin: var(--spacing-6);
  }
}

.mt-7-6 {
  margin-top: var(--spacing-7) !important;
}
@media (min-width: 992px) {
  .mt-7-6 {
    margin-top: var(--spacing-6) !important;
  }
}

.mb-7-6 {
  margin-bottom: var(--spacing-7) !important;
}
@media (min-width: 992px) {
  .mb-7-6 {
    margin-bottom: var(--spacing-6) !important;
  }
}

.ml-7-6 {
  margin-left: var(--spacing-7) !important;
}
@media (min-width: 992px) {
  .ml-7-6 {
    margin-left: var(--spacing-6) !important;
  }
}

.gap-7-6 {
  gap: var(--spacing-7);
}
@media (min-width: 992px) {
  .gap-7-6 {
    gap: var(--spacing-6);
  }
}

.p-7-7 {
  padding: var(--spacing-7);
}
@media (min-width: 992px) {
  .p-7-7 {
    padding: var(--spacing-7);
  }
}

.pt-7-7 {
  padding-top: var(--spacing-7);
}
@media (min-width: 992px) {
  .pt-7-7 {
    padding-top: var(--spacing-7);
  }
}

.pb-7-7 {
  padding-bottom: var(--spacing-7);
}
@media (min-width: 992px) {
  .pb-7-7 {
    padding-bottom: var(--spacing-7);
  }
}

.p-inline-7-7 {
  padding-inline: var(--spacing-7);
}
@media (min-width: 992px) {
  .p-inline-7-7 {
    padding-inline: var(--spacing-7);
  }
}

.m-7-7 {
  margin: var(--spacing-7);
}
@media (min-width: 992px) {
  .m-7-7 {
    margin: var(--spacing-7);
  }
}

.mt-7-7 {
  margin-top: var(--spacing-7) !important;
}
@media (min-width: 992px) {
  .mt-7-7 {
    margin-top: var(--spacing-7) !important;
  }
}

.mb-7-7 {
  margin-bottom: var(--spacing-7) !important;
}
@media (min-width: 992px) {
  .mb-7-7 {
    margin-bottom: var(--spacing-7) !important;
  }
}

.ml-7-7 {
  margin-left: var(--spacing-7) !important;
}
@media (min-width: 992px) {
  .ml-7-7 {
    margin-left: var(--spacing-7) !important;
  }
}

.gap-7-7 {
  gap: var(--spacing-7);
}
@media (min-width: 992px) {
  .gap-7-7 {
    gap: var(--spacing-7);
  }
}

.p-7-8 {
  padding: var(--spacing-7);
}
@media (min-width: 992px) {
  .p-7-8 {
    padding: var(--spacing-8);
  }
}

.pt-7-8 {
  padding-top: var(--spacing-7);
}
@media (min-width: 992px) {
  .pt-7-8 {
    padding-top: var(--spacing-8);
  }
}

.pb-7-8 {
  padding-bottom: var(--spacing-7);
}
@media (min-width: 992px) {
  .pb-7-8 {
    padding-bottom: var(--spacing-8);
  }
}

.p-inline-7-8 {
  padding-inline: var(--spacing-7);
}
@media (min-width: 992px) {
  .p-inline-7-8 {
    padding-inline: var(--spacing-8);
  }
}

.m-7-8 {
  margin: var(--spacing-7);
}
@media (min-width: 992px) {
  .m-7-8 {
    margin: var(--spacing-8);
  }
}

.mt-7-8 {
  margin-top: var(--spacing-7) !important;
}
@media (min-width: 992px) {
  .mt-7-8 {
    margin-top: var(--spacing-8) !important;
  }
}

.mb-7-8 {
  margin-bottom: var(--spacing-7) !important;
}
@media (min-width: 992px) {
  .mb-7-8 {
    margin-bottom: var(--spacing-8) !important;
  }
}

.ml-7-8 {
  margin-left: var(--spacing-7) !important;
}
@media (min-width: 992px) {
  .ml-7-8 {
    margin-left: var(--spacing-8) !important;
  }
}

.gap-7-8 {
  gap: var(--spacing-7);
}
@media (min-width: 992px) {
  .gap-7-8 {
    gap: var(--spacing-8);
  }
}

.p-7-9 {
  padding: var(--spacing-7);
}
@media (min-width: 992px) {
  .p-7-9 {
    padding: var(--spacing-9);
  }
}

.pt-7-9 {
  padding-top: var(--spacing-7);
}
@media (min-width: 992px) {
  .pt-7-9 {
    padding-top: var(--spacing-9);
  }
}

.pb-7-9 {
  padding-bottom: var(--spacing-7);
}
@media (min-width: 992px) {
  .pb-7-9 {
    padding-bottom: var(--spacing-9);
  }
}

.p-inline-7-9 {
  padding-inline: var(--spacing-7);
}
@media (min-width: 992px) {
  .p-inline-7-9 {
    padding-inline: var(--spacing-9);
  }
}

.m-7-9 {
  margin: var(--spacing-7);
}
@media (min-width: 992px) {
  .m-7-9 {
    margin: var(--spacing-9);
  }
}

.mt-7-9 {
  margin-top: var(--spacing-7) !important;
}
@media (min-width: 992px) {
  .mt-7-9 {
    margin-top: var(--spacing-9) !important;
  }
}

.mb-7-9 {
  margin-bottom: var(--spacing-7) !important;
}
@media (min-width: 992px) {
  .mb-7-9 {
    margin-bottom: var(--spacing-9) !important;
  }
}

.ml-7-9 {
  margin-left: var(--spacing-7) !important;
}
@media (min-width: 992px) {
  .ml-7-9 {
    margin-left: var(--spacing-9) !important;
  }
}

.gap-7-9 {
  gap: var(--spacing-7);
}
@media (min-width: 992px) {
  .gap-7-9 {
    gap: var(--spacing-9);
  }
}

.p-8-auto {
  padding: var(--spacing-8);
}
@media (min-width: 992px) {
  .p-8-auto {
    padding: auto;
  }
}

.pt-8-auto {
  padding-top: var(--spacing-8);
}
@media (min-width: 992px) {
  .pt-8-auto {
    padding-top: auto;
  }
}

.pb-8-auto {
  padding-bottom: var(--spacing-8);
}
@media (min-width: 992px) {
  .pb-8-auto {
    padding-bottom: auto;
  }
}

.p-inline-8-auto {
  padding-inline: var(--spacing-8);
}
@media (min-width: 992px) {
  .p-inline-8-auto {
    padding-inline: auto;
  }
}

.m-8-auto {
  margin: var(--spacing-8);
}
@media (min-width: 992px) {
  .m-8-auto {
    margin: auto;
  }
}

.mt-8-auto {
  margin-top: var(--spacing-8) !important;
}
@media (min-width: 992px) {
  .mt-8-auto {
    margin-top: auto !important;
  }
}

.mb-8-auto {
  margin-bottom: var(--spacing-8) !important;
}
@media (min-width: 992px) {
  .mb-8-auto {
    margin-bottom: auto !important;
  }
}

.ml-8-auto {
  margin-left: var(--spacing-8) !important;
}
@media (min-width: 992px) {
  .ml-8-auto {
    margin-left: auto !important;
  }
}

.gap-8-auto {
  gap: var(--spacing-8);
}
@media (min-width: 992px) {
  .gap-8-auto {
    gap: auto;
  }
}

.p-8-0 {
  padding: var(--spacing-8);
}
@media (min-width: 992px) {
  .p-8-0 {
    padding: var(--spacing-0);
  }
}

.pt-8-0 {
  padding-top: var(--spacing-8);
}
@media (min-width: 992px) {
  .pt-8-0 {
    padding-top: var(--spacing-0);
  }
}

.pb-8-0 {
  padding-bottom: var(--spacing-8);
}
@media (min-width: 992px) {
  .pb-8-0 {
    padding-bottom: var(--spacing-0);
  }
}

.p-inline-8-0 {
  padding-inline: var(--spacing-8);
}
@media (min-width: 992px) {
  .p-inline-8-0 {
    padding-inline: var(--spacing-0);
  }
}

.m-8-0 {
  margin: var(--spacing-8);
}
@media (min-width: 992px) {
  .m-8-0 {
    margin: var(--spacing-0);
  }
}

.mt-8-0 {
  margin-top: var(--spacing-8) !important;
}
@media (min-width: 992px) {
  .mt-8-0 {
    margin-top: var(--spacing-0) !important;
  }
}

.mb-8-0 {
  margin-bottom: var(--spacing-8) !important;
}
@media (min-width: 992px) {
  .mb-8-0 {
    margin-bottom: var(--spacing-0) !important;
  }
}

.ml-8-0 {
  margin-left: var(--spacing-8) !important;
}
@media (min-width: 992px) {
  .ml-8-0 {
    margin-left: var(--spacing-0) !important;
  }
}

.gap-8-0 {
  gap: var(--spacing-8);
}
@media (min-width: 992px) {
  .gap-8-0 {
    gap: var(--spacing-0);
  }
}

.p-8-1 {
  padding: var(--spacing-8);
}
@media (min-width: 992px) {
  .p-8-1 {
    padding: var(--spacing-1);
  }
}

.pt-8-1 {
  padding-top: var(--spacing-8);
}
@media (min-width: 992px) {
  .pt-8-1 {
    padding-top: var(--spacing-1);
  }
}

.pb-8-1 {
  padding-bottom: var(--spacing-8);
}
@media (min-width: 992px) {
  .pb-8-1 {
    padding-bottom: var(--spacing-1);
  }
}

.p-inline-8-1 {
  padding-inline: var(--spacing-8);
}
@media (min-width: 992px) {
  .p-inline-8-1 {
    padding-inline: var(--spacing-1);
  }
}

.m-8-1 {
  margin: var(--spacing-8);
}
@media (min-width: 992px) {
  .m-8-1 {
    margin: var(--spacing-1);
  }
}

.mt-8-1 {
  margin-top: var(--spacing-8) !important;
}
@media (min-width: 992px) {
  .mt-8-1 {
    margin-top: var(--spacing-1) !important;
  }
}

.mb-8-1 {
  margin-bottom: var(--spacing-8) !important;
}
@media (min-width: 992px) {
  .mb-8-1 {
    margin-bottom: var(--spacing-1) !important;
  }
}

.ml-8-1 {
  margin-left: var(--spacing-8) !important;
}
@media (min-width: 992px) {
  .ml-8-1 {
    margin-left: var(--spacing-1) !important;
  }
}

.gap-8-1 {
  gap: var(--spacing-8);
}
@media (min-width: 992px) {
  .gap-8-1 {
    gap: var(--spacing-1);
  }
}

.p-8-2 {
  padding: var(--spacing-8);
}
@media (min-width: 992px) {
  .p-8-2 {
    padding: var(--spacing-2);
  }
}

.pt-8-2 {
  padding-top: var(--spacing-8);
}
@media (min-width: 992px) {
  .pt-8-2 {
    padding-top: var(--spacing-2);
  }
}

.pb-8-2 {
  padding-bottom: var(--spacing-8);
}
@media (min-width: 992px) {
  .pb-8-2 {
    padding-bottom: var(--spacing-2);
  }
}

.p-inline-8-2 {
  padding-inline: var(--spacing-8);
}
@media (min-width: 992px) {
  .p-inline-8-2 {
    padding-inline: var(--spacing-2);
  }
}

.m-8-2 {
  margin: var(--spacing-8);
}
@media (min-width: 992px) {
  .m-8-2 {
    margin: var(--spacing-2);
  }
}

.mt-8-2 {
  margin-top: var(--spacing-8) !important;
}
@media (min-width: 992px) {
  .mt-8-2 {
    margin-top: var(--spacing-2) !important;
  }
}

.mb-8-2 {
  margin-bottom: var(--spacing-8) !important;
}
@media (min-width: 992px) {
  .mb-8-2 {
    margin-bottom: var(--spacing-2) !important;
  }
}

.ml-8-2 {
  margin-left: var(--spacing-8) !important;
}
@media (min-width: 992px) {
  .ml-8-2 {
    margin-left: var(--spacing-2) !important;
  }
}

.gap-8-2 {
  gap: var(--spacing-8);
}
@media (min-width: 992px) {
  .gap-8-2 {
    gap: var(--spacing-2);
  }
}

.p-8-25 {
  padding: var(--spacing-8);
}
@media (min-width: 992px) {
  .p-8-25 {
    padding: var(--spacing-25);
  }
}

.pt-8-25 {
  padding-top: var(--spacing-8);
}
@media (min-width: 992px) {
  .pt-8-25 {
    padding-top: var(--spacing-25);
  }
}

.pb-8-25 {
  padding-bottom: var(--spacing-8);
}
@media (min-width: 992px) {
  .pb-8-25 {
    padding-bottom: var(--spacing-25);
  }
}

.p-inline-8-25 {
  padding-inline: var(--spacing-8);
}
@media (min-width: 992px) {
  .p-inline-8-25 {
    padding-inline: var(--spacing-25);
  }
}

.m-8-25 {
  margin: var(--spacing-8);
}
@media (min-width: 992px) {
  .m-8-25 {
    margin: var(--spacing-25);
  }
}

.mt-8-25 {
  margin-top: var(--spacing-8) !important;
}
@media (min-width: 992px) {
  .mt-8-25 {
    margin-top: var(--spacing-25) !important;
  }
}

.mb-8-25 {
  margin-bottom: var(--spacing-8) !important;
}
@media (min-width: 992px) {
  .mb-8-25 {
    margin-bottom: var(--spacing-25) !important;
  }
}

.ml-8-25 {
  margin-left: var(--spacing-8) !important;
}
@media (min-width: 992px) {
  .ml-8-25 {
    margin-left: var(--spacing-25) !important;
  }
}

.gap-8-25 {
  gap: var(--spacing-8);
}
@media (min-width: 992px) {
  .gap-8-25 {
    gap: var(--spacing-25);
  }
}

.p-8-3 {
  padding: var(--spacing-8);
}
@media (min-width: 992px) {
  .p-8-3 {
    padding: var(--spacing-3);
  }
}

.pt-8-3 {
  padding-top: var(--spacing-8);
}
@media (min-width: 992px) {
  .pt-8-3 {
    padding-top: var(--spacing-3);
  }
}

.pb-8-3 {
  padding-bottom: var(--spacing-8);
}
@media (min-width: 992px) {
  .pb-8-3 {
    padding-bottom: var(--spacing-3);
  }
}

.p-inline-8-3 {
  padding-inline: var(--spacing-8);
}
@media (min-width: 992px) {
  .p-inline-8-3 {
    padding-inline: var(--spacing-3);
  }
}

.m-8-3 {
  margin: var(--spacing-8);
}
@media (min-width: 992px) {
  .m-8-3 {
    margin: var(--spacing-3);
  }
}

.mt-8-3 {
  margin-top: var(--spacing-8) !important;
}
@media (min-width: 992px) {
  .mt-8-3 {
    margin-top: var(--spacing-3) !important;
  }
}

.mb-8-3 {
  margin-bottom: var(--spacing-8) !important;
}
@media (min-width: 992px) {
  .mb-8-3 {
    margin-bottom: var(--spacing-3) !important;
  }
}

.ml-8-3 {
  margin-left: var(--spacing-8) !important;
}
@media (min-width: 992px) {
  .ml-8-3 {
    margin-left: var(--spacing-3) !important;
  }
}

.gap-8-3 {
  gap: var(--spacing-8);
}
@media (min-width: 992px) {
  .gap-8-3 {
    gap: var(--spacing-3);
  }
}

.p-8-35 {
  padding: var(--spacing-8);
}
@media (min-width: 992px) {
  .p-8-35 {
    padding: var(--spacing-35);
  }
}

.pt-8-35 {
  padding-top: var(--spacing-8);
}
@media (min-width: 992px) {
  .pt-8-35 {
    padding-top: var(--spacing-35);
  }
}

.pb-8-35 {
  padding-bottom: var(--spacing-8);
}
@media (min-width: 992px) {
  .pb-8-35 {
    padding-bottom: var(--spacing-35);
  }
}

.p-inline-8-35 {
  padding-inline: var(--spacing-8);
}
@media (min-width: 992px) {
  .p-inline-8-35 {
    padding-inline: var(--spacing-35);
  }
}

.m-8-35 {
  margin: var(--spacing-8);
}
@media (min-width: 992px) {
  .m-8-35 {
    margin: var(--spacing-35);
  }
}

.mt-8-35 {
  margin-top: var(--spacing-8) !important;
}
@media (min-width: 992px) {
  .mt-8-35 {
    margin-top: var(--spacing-35) !important;
  }
}

.mb-8-35 {
  margin-bottom: var(--spacing-8) !important;
}
@media (min-width: 992px) {
  .mb-8-35 {
    margin-bottom: var(--spacing-35) !important;
  }
}

.ml-8-35 {
  margin-left: var(--spacing-8) !important;
}
@media (min-width: 992px) {
  .ml-8-35 {
    margin-left: var(--spacing-35) !important;
  }
}

.gap-8-35 {
  gap: var(--spacing-8);
}
@media (min-width: 992px) {
  .gap-8-35 {
    gap: var(--spacing-35);
  }
}

.p-8-4 {
  padding: var(--spacing-8);
}
@media (min-width: 992px) {
  .p-8-4 {
    padding: var(--spacing-4);
  }
}

.pt-8-4 {
  padding-top: var(--spacing-8);
}
@media (min-width: 992px) {
  .pt-8-4 {
    padding-top: var(--spacing-4);
  }
}

.pb-8-4 {
  padding-bottom: var(--spacing-8);
}
@media (min-width: 992px) {
  .pb-8-4 {
    padding-bottom: var(--spacing-4);
  }
}

.p-inline-8-4 {
  padding-inline: var(--spacing-8);
}
@media (min-width: 992px) {
  .p-inline-8-4 {
    padding-inline: var(--spacing-4);
  }
}

.m-8-4 {
  margin: var(--spacing-8);
}
@media (min-width: 992px) {
  .m-8-4 {
    margin: var(--spacing-4);
  }
}

.mt-8-4 {
  margin-top: var(--spacing-8) !important;
}
@media (min-width: 992px) {
  .mt-8-4 {
    margin-top: var(--spacing-4) !important;
  }
}

.mb-8-4 {
  margin-bottom: var(--spacing-8) !important;
}
@media (min-width: 992px) {
  .mb-8-4 {
    margin-bottom: var(--spacing-4) !important;
  }
}

.ml-8-4 {
  margin-left: var(--spacing-8) !important;
}
@media (min-width: 992px) {
  .ml-8-4 {
    margin-left: var(--spacing-4) !important;
  }
}

.gap-8-4 {
  gap: var(--spacing-8);
}
@media (min-width: 992px) {
  .gap-8-4 {
    gap: var(--spacing-4);
  }
}

.p-8-5 {
  padding: var(--spacing-8);
}
@media (min-width: 992px) {
  .p-8-5 {
    padding: var(--spacing-5);
  }
}

.pt-8-5 {
  padding-top: var(--spacing-8);
}
@media (min-width: 992px) {
  .pt-8-5 {
    padding-top: var(--spacing-5);
  }
}

.pb-8-5 {
  padding-bottom: var(--spacing-8);
}
@media (min-width: 992px) {
  .pb-8-5 {
    padding-bottom: var(--spacing-5);
  }
}

.p-inline-8-5 {
  padding-inline: var(--spacing-8);
}
@media (min-width: 992px) {
  .p-inline-8-5 {
    padding-inline: var(--spacing-5);
  }
}

.m-8-5 {
  margin: var(--spacing-8);
}
@media (min-width: 992px) {
  .m-8-5 {
    margin: var(--spacing-5);
  }
}

.mt-8-5 {
  margin-top: var(--spacing-8) !important;
}
@media (min-width: 992px) {
  .mt-8-5 {
    margin-top: var(--spacing-5) !important;
  }
}

.mb-8-5 {
  margin-bottom: var(--spacing-8) !important;
}
@media (min-width: 992px) {
  .mb-8-5 {
    margin-bottom: var(--spacing-5) !important;
  }
}

.ml-8-5 {
  margin-left: var(--spacing-8) !important;
}
@media (min-width: 992px) {
  .ml-8-5 {
    margin-left: var(--spacing-5) !important;
  }
}

.gap-8-5 {
  gap: var(--spacing-8);
}
@media (min-width: 992px) {
  .gap-8-5 {
    gap: var(--spacing-5);
  }
}

.p-8-6 {
  padding: var(--spacing-8);
}
@media (min-width: 992px) {
  .p-8-6 {
    padding: var(--spacing-6);
  }
}

.pt-8-6 {
  padding-top: var(--spacing-8);
}
@media (min-width: 992px) {
  .pt-8-6 {
    padding-top: var(--spacing-6);
  }
}

.pb-8-6 {
  padding-bottom: var(--spacing-8);
}
@media (min-width: 992px) {
  .pb-8-6 {
    padding-bottom: var(--spacing-6);
  }
}

.p-inline-8-6 {
  padding-inline: var(--spacing-8);
}
@media (min-width: 992px) {
  .p-inline-8-6 {
    padding-inline: var(--spacing-6);
  }
}

.m-8-6 {
  margin: var(--spacing-8);
}
@media (min-width: 992px) {
  .m-8-6 {
    margin: var(--spacing-6);
  }
}

.mt-8-6 {
  margin-top: var(--spacing-8) !important;
}
@media (min-width: 992px) {
  .mt-8-6 {
    margin-top: var(--spacing-6) !important;
  }
}

.mb-8-6 {
  margin-bottom: var(--spacing-8) !important;
}
@media (min-width: 992px) {
  .mb-8-6 {
    margin-bottom: var(--spacing-6) !important;
  }
}

.ml-8-6 {
  margin-left: var(--spacing-8) !important;
}
@media (min-width: 992px) {
  .ml-8-6 {
    margin-left: var(--spacing-6) !important;
  }
}

.gap-8-6 {
  gap: var(--spacing-8);
}
@media (min-width: 992px) {
  .gap-8-6 {
    gap: var(--spacing-6);
  }
}

.p-8-7 {
  padding: var(--spacing-8);
}
@media (min-width: 992px) {
  .p-8-7 {
    padding: var(--spacing-7);
  }
}

.pt-8-7 {
  padding-top: var(--spacing-8);
}
@media (min-width: 992px) {
  .pt-8-7 {
    padding-top: var(--spacing-7);
  }
}

.pb-8-7 {
  padding-bottom: var(--spacing-8);
}
@media (min-width: 992px) {
  .pb-8-7 {
    padding-bottom: var(--spacing-7);
  }
}

.p-inline-8-7 {
  padding-inline: var(--spacing-8);
}
@media (min-width: 992px) {
  .p-inline-8-7 {
    padding-inline: var(--spacing-7);
  }
}

.m-8-7 {
  margin: var(--spacing-8);
}
@media (min-width: 992px) {
  .m-8-7 {
    margin: var(--spacing-7);
  }
}

.mt-8-7 {
  margin-top: var(--spacing-8) !important;
}
@media (min-width: 992px) {
  .mt-8-7 {
    margin-top: var(--spacing-7) !important;
  }
}

.mb-8-7 {
  margin-bottom: var(--spacing-8) !important;
}
@media (min-width: 992px) {
  .mb-8-7 {
    margin-bottom: var(--spacing-7) !important;
  }
}

.ml-8-7 {
  margin-left: var(--spacing-8) !important;
}
@media (min-width: 992px) {
  .ml-8-7 {
    margin-left: var(--spacing-7) !important;
  }
}

.gap-8-7 {
  gap: var(--spacing-8);
}
@media (min-width: 992px) {
  .gap-8-7 {
    gap: var(--spacing-7);
  }
}

.p-8-8 {
  padding: var(--spacing-8);
}
@media (min-width: 992px) {
  .p-8-8 {
    padding: var(--spacing-8);
  }
}

.pt-8-8 {
  padding-top: var(--spacing-8);
}
@media (min-width: 992px) {
  .pt-8-8 {
    padding-top: var(--spacing-8);
  }
}

.pb-8-8 {
  padding-bottom: var(--spacing-8);
}
@media (min-width: 992px) {
  .pb-8-8 {
    padding-bottom: var(--spacing-8);
  }
}

.p-inline-8-8 {
  padding-inline: var(--spacing-8);
}
@media (min-width: 992px) {
  .p-inline-8-8 {
    padding-inline: var(--spacing-8);
  }
}

.m-8-8 {
  margin: var(--spacing-8);
}
@media (min-width: 992px) {
  .m-8-8 {
    margin: var(--spacing-8);
  }
}

.mt-8-8 {
  margin-top: var(--spacing-8) !important;
}
@media (min-width: 992px) {
  .mt-8-8 {
    margin-top: var(--spacing-8) !important;
  }
}

.mb-8-8 {
  margin-bottom: var(--spacing-8) !important;
}
@media (min-width: 992px) {
  .mb-8-8 {
    margin-bottom: var(--spacing-8) !important;
  }
}

.ml-8-8 {
  margin-left: var(--spacing-8) !important;
}
@media (min-width: 992px) {
  .ml-8-8 {
    margin-left: var(--spacing-8) !important;
  }
}

.gap-8-8 {
  gap: var(--spacing-8);
}
@media (min-width: 992px) {
  .gap-8-8 {
    gap: var(--spacing-8);
  }
}

.p-8-9 {
  padding: var(--spacing-8);
}
@media (min-width: 992px) {
  .p-8-9 {
    padding: var(--spacing-9);
  }
}

.pt-8-9 {
  padding-top: var(--spacing-8);
}
@media (min-width: 992px) {
  .pt-8-9 {
    padding-top: var(--spacing-9);
  }
}

.pb-8-9 {
  padding-bottom: var(--spacing-8);
}
@media (min-width: 992px) {
  .pb-8-9 {
    padding-bottom: var(--spacing-9);
  }
}

.p-inline-8-9 {
  padding-inline: var(--spacing-8);
}
@media (min-width: 992px) {
  .p-inline-8-9 {
    padding-inline: var(--spacing-9);
  }
}

.m-8-9 {
  margin: var(--spacing-8);
}
@media (min-width: 992px) {
  .m-8-9 {
    margin: var(--spacing-9);
  }
}

.mt-8-9 {
  margin-top: var(--spacing-8) !important;
}
@media (min-width: 992px) {
  .mt-8-9 {
    margin-top: var(--spacing-9) !important;
  }
}

.mb-8-9 {
  margin-bottom: var(--spacing-8) !important;
}
@media (min-width: 992px) {
  .mb-8-9 {
    margin-bottom: var(--spacing-9) !important;
  }
}

.ml-8-9 {
  margin-left: var(--spacing-8) !important;
}
@media (min-width: 992px) {
  .ml-8-9 {
    margin-left: var(--spacing-9) !important;
  }
}

.gap-8-9 {
  gap: var(--spacing-8);
}
@media (min-width: 992px) {
  .gap-8-9 {
    gap: var(--spacing-9);
  }
}

.p-9-auto {
  padding: var(--spacing-9);
}
@media (min-width: 992px) {
  .p-9-auto {
    padding: auto;
  }
}

.pt-9-auto {
  padding-top: var(--spacing-9);
}
@media (min-width: 992px) {
  .pt-9-auto {
    padding-top: auto;
  }
}

.pb-9-auto {
  padding-bottom: var(--spacing-9);
}
@media (min-width: 992px) {
  .pb-9-auto {
    padding-bottom: auto;
  }
}

.p-inline-9-auto {
  padding-inline: var(--spacing-9);
}
@media (min-width: 992px) {
  .p-inline-9-auto {
    padding-inline: auto;
  }
}

.m-9-auto {
  margin: var(--spacing-9);
}
@media (min-width: 992px) {
  .m-9-auto {
    margin: auto;
  }
}

.mt-9-auto {
  margin-top: var(--spacing-9) !important;
}
@media (min-width: 992px) {
  .mt-9-auto {
    margin-top: auto !important;
  }
}

.mb-9-auto {
  margin-bottom: var(--spacing-9) !important;
}
@media (min-width: 992px) {
  .mb-9-auto {
    margin-bottom: auto !important;
  }
}

.ml-9-auto {
  margin-left: var(--spacing-9) !important;
}
@media (min-width: 992px) {
  .ml-9-auto {
    margin-left: auto !important;
  }
}

.gap-9-auto {
  gap: var(--spacing-9);
}
@media (min-width: 992px) {
  .gap-9-auto {
    gap: auto;
  }
}

.p-9-0 {
  padding: var(--spacing-9);
}
@media (min-width: 992px) {
  .p-9-0 {
    padding: var(--spacing-0);
  }
}

.pt-9-0 {
  padding-top: var(--spacing-9);
}
@media (min-width: 992px) {
  .pt-9-0 {
    padding-top: var(--spacing-0);
  }
}

.pb-9-0 {
  padding-bottom: var(--spacing-9);
}
@media (min-width: 992px) {
  .pb-9-0 {
    padding-bottom: var(--spacing-0);
  }
}

.p-inline-9-0 {
  padding-inline: var(--spacing-9);
}
@media (min-width: 992px) {
  .p-inline-9-0 {
    padding-inline: var(--spacing-0);
  }
}

.m-9-0 {
  margin: var(--spacing-9);
}
@media (min-width: 992px) {
  .m-9-0 {
    margin: var(--spacing-0);
  }
}

.mt-9-0 {
  margin-top: var(--spacing-9) !important;
}
@media (min-width: 992px) {
  .mt-9-0 {
    margin-top: var(--spacing-0) !important;
  }
}

.mb-9-0 {
  margin-bottom: var(--spacing-9) !important;
}
@media (min-width: 992px) {
  .mb-9-0 {
    margin-bottom: var(--spacing-0) !important;
  }
}

.ml-9-0 {
  margin-left: var(--spacing-9) !important;
}
@media (min-width: 992px) {
  .ml-9-0 {
    margin-left: var(--spacing-0) !important;
  }
}

.gap-9-0 {
  gap: var(--spacing-9);
}
@media (min-width: 992px) {
  .gap-9-0 {
    gap: var(--spacing-0);
  }
}

.p-9-1 {
  padding: var(--spacing-9);
}
@media (min-width: 992px) {
  .p-9-1 {
    padding: var(--spacing-1);
  }
}

.pt-9-1 {
  padding-top: var(--spacing-9);
}
@media (min-width: 992px) {
  .pt-9-1 {
    padding-top: var(--spacing-1);
  }
}

.pb-9-1 {
  padding-bottom: var(--spacing-9);
}
@media (min-width: 992px) {
  .pb-9-1 {
    padding-bottom: var(--spacing-1);
  }
}

.p-inline-9-1 {
  padding-inline: var(--spacing-9);
}
@media (min-width: 992px) {
  .p-inline-9-1 {
    padding-inline: var(--spacing-1);
  }
}

.m-9-1 {
  margin: var(--spacing-9);
}
@media (min-width: 992px) {
  .m-9-1 {
    margin: var(--spacing-1);
  }
}

.mt-9-1 {
  margin-top: var(--spacing-9) !important;
}
@media (min-width: 992px) {
  .mt-9-1 {
    margin-top: var(--spacing-1) !important;
  }
}

.mb-9-1 {
  margin-bottom: var(--spacing-9) !important;
}
@media (min-width: 992px) {
  .mb-9-1 {
    margin-bottom: var(--spacing-1) !important;
  }
}

.ml-9-1 {
  margin-left: var(--spacing-9) !important;
}
@media (min-width: 992px) {
  .ml-9-1 {
    margin-left: var(--spacing-1) !important;
  }
}

.gap-9-1 {
  gap: var(--spacing-9);
}
@media (min-width: 992px) {
  .gap-9-1 {
    gap: var(--spacing-1);
  }
}

.p-9-2 {
  padding: var(--spacing-9);
}
@media (min-width: 992px) {
  .p-9-2 {
    padding: var(--spacing-2);
  }
}

.pt-9-2 {
  padding-top: var(--spacing-9);
}
@media (min-width: 992px) {
  .pt-9-2 {
    padding-top: var(--spacing-2);
  }
}

.pb-9-2 {
  padding-bottom: var(--spacing-9);
}
@media (min-width: 992px) {
  .pb-9-2 {
    padding-bottom: var(--spacing-2);
  }
}

.p-inline-9-2 {
  padding-inline: var(--spacing-9);
}
@media (min-width: 992px) {
  .p-inline-9-2 {
    padding-inline: var(--spacing-2);
  }
}

.m-9-2 {
  margin: var(--spacing-9);
}
@media (min-width: 992px) {
  .m-9-2 {
    margin: var(--spacing-2);
  }
}

.mt-9-2 {
  margin-top: var(--spacing-9) !important;
}
@media (min-width: 992px) {
  .mt-9-2 {
    margin-top: var(--spacing-2) !important;
  }
}

.mb-9-2 {
  margin-bottom: var(--spacing-9) !important;
}
@media (min-width: 992px) {
  .mb-9-2 {
    margin-bottom: var(--spacing-2) !important;
  }
}

.ml-9-2 {
  margin-left: var(--spacing-9) !important;
}
@media (min-width: 992px) {
  .ml-9-2 {
    margin-left: var(--spacing-2) !important;
  }
}

.gap-9-2 {
  gap: var(--spacing-9);
}
@media (min-width: 992px) {
  .gap-9-2 {
    gap: var(--spacing-2);
  }
}

.p-9-25 {
  padding: var(--spacing-9);
}
@media (min-width: 992px) {
  .p-9-25 {
    padding: var(--spacing-25);
  }
}

.pt-9-25 {
  padding-top: var(--spacing-9);
}
@media (min-width: 992px) {
  .pt-9-25 {
    padding-top: var(--spacing-25);
  }
}

.pb-9-25 {
  padding-bottom: var(--spacing-9);
}
@media (min-width: 992px) {
  .pb-9-25 {
    padding-bottom: var(--spacing-25);
  }
}

.p-inline-9-25 {
  padding-inline: var(--spacing-9);
}
@media (min-width: 992px) {
  .p-inline-9-25 {
    padding-inline: var(--spacing-25);
  }
}

.m-9-25 {
  margin: var(--spacing-9);
}
@media (min-width: 992px) {
  .m-9-25 {
    margin: var(--spacing-25);
  }
}

.mt-9-25 {
  margin-top: var(--spacing-9) !important;
}
@media (min-width: 992px) {
  .mt-9-25 {
    margin-top: var(--spacing-25) !important;
  }
}

.mb-9-25 {
  margin-bottom: var(--spacing-9) !important;
}
@media (min-width: 992px) {
  .mb-9-25 {
    margin-bottom: var(--spacing-25) !important;
  }
}

.ml-9-25 {
  margin-left: var(--spacing-9) !important;
}
@media (min-width: 992px) {
  .ml-9-25 {
    margin-left: var(--spacing-25) !important;
  }
}

.gap-9-25 {
  gap: var(--spacing-9);
}
@media (min-width: 992px) {
  .gap-9-25 {
    gap: var(--spacing-25);
  }
}

.p-9-3 {
  padding: var(--spacing-9);
}
@media (min-width: 992px) {
  .p-9-3 {
    padding: var(--spacing-3);
  }
}

.pt-9-3 {
  padding-top: var(--spacing-9);
}
@media (min-width: 992px) {
  .pt-9-3 {
    padding-top: var(--spacing-3);
  }
}

.pb-9-3 {
  padding-bottom: var(--spacing-9);
}
@media (min-width: 992px) {
  .pb-9-3 {
    padding-bottom: var(--spacing-3);
  }
}

.p-inline-9-3 {
  padding-inline: var(--spacing-9);
}
@media (min-width: 992px) {
  .p-inline-9-3 {
    padding-inline: var(--spacing-3);
  }
}

.m-9-3 {
  margin: var(--spacing-9);
}
@media (min-width: 992px) {
  .m-9-3 {
    margin: var(--spacing-3);
  }
}

.mt-9-3 {
  margin-top: var(--spacing-9) !important;
}
@media (min-width: 992px) {
  .mt-9-3 {
    margin-top: var(--spacing-3) !important;
  }
}

.mb-9-3 {
  margin-bottom: var(--spacing-9) !important;
}
@media (min-width: 992px) {
  .mb-9-3 {
    margin-bottom: var(--spacing-3) !important;
  }
}

.ml-9-3 {
  margin-left: var(--spacing-9) !important;
}
@media (min-width: 992px) {
  .ml-9-3 {
    margin-left: var(--spacing-3) !important;
  }
}

.gap-9-3 {
  gap: var(--spacing-9);
}
@media (min-width: 992px) {
  .gap-9-3 {
    gap: var(--spacing-3);
  }
}

.p-9-35 {
  padding: var(--spacing-9);
}
@media (min-width: 992px) {
  .p-9-35 {
    padding: var(--spacing-35);
  }
}

.pt-9-35 {
  padding-top: var(--spacing-9);
}
@media (min-width: 992px) {
  .pt-9-35 {
    padding-top: var(--spacing-35);
  }
}

.pb-9-35 {
  padding-bottom: var(--spacing-9);
}
@media (min-width: 992px) {
  .pb-9-35 {
    padding-bottom: var(--spacing-35);
  }
}

.p-inline-9-35 {
  padding-inline: var(--spacing-9);
}
@media (min-width: 992px) {
  .p-inline-9-35 {
    padding-inline: var(--spacing-35);
  }
}

.m-9-35 {
  margin: var(--spacing-9);
}
@media (min-width: 992px) {
  .m-9-35 {
    margin: var(--spacing-35);
  }
}

.mt-9-35 {
  margin-top: var(--spacing-9) !important;
}
@media (min-width: 992px) {
  .mt-9-35 {
    margin-top: var(--spacing-35) !important;
  }
}

.mb-9-35 {
  margin-bottom: var(--spacing-9) !important;
}
@media (min-width: 992px) {
  .mb-9-35 {
    margin-bottom: var(--spacing-35) !important;
  }
}

.ml-9-35 {
  margin-left: var(--spacing-9) !important;
}
@media (min-width: 992px) {
  .ml-9-35 {
    margin-left: var(--spacing-35) !important;
  }
}

.gap-9-35 {
  gap: var(--spacing-9);
}
@media (min-width: 992px) {
  .gap-9-35 {
    gap: var(--spacing-35);
  }
}

.p-9-4 {
  padding: var(--spacing-9);
}
@media (min-width: 992px) {
  .p-9-4 {
    padding: var(--spacing-4);
  }
}

.pt-9-4 {
  padding-top: var(--spacing-9);
}
@media (min-width: 992px) {
  .pt-9-4 {
    padding-top: var(--spacing-4);
  }
}

.pb-9-4 {
  padding-bottom: var(--spacing-9);
}
@media (min-width: 992px) {
  .pb-9-4 {
    padding-bottom: var(--spacing-4);
  }
}

.p-inline-9-4 {
  padding-inline: var(--spacing-9);
}
@media (min-width: 992px) {
  .p-inline-9-4 {
    padding-inline: var(--spacing-4);
  }
}

.m-9-4 {
  margin: var(--spacing-9);
}
@media (min-width: 992px) {
  .m-9-4 {
    margin: var(--spacing-4);
  }
}

.mt-9-4 {
  margin-top: var(--spacing-9) !important;
}
@media (min-width: 992px) {
  .mt-9-4 {
    margin-top: var(--spacing-4) !important;
  }
}

.mb-9-4 {
  margin-bottom: var(--spacing-9) !important;
}
@media (min-width: 992px) {
  .mb-9-4 {
    margin-bottom: var(--spacing-4) !important;
  }
}

.ml-9-4 {
  margin-left: var(--spacing-9) !important;
}
@media (min-width: 992px) {
  .ml-9-4 {
    margin-left: var(--spacing-4) !important;
  }
}

.gap-9-4 {
  gap: var(--spacing-9);
}
@media (min-width: 992px) {
  .gap-9-4 {
    gap: var(--spacing-4);
  }
}

.p-9-5 {
  padding: var(--spacing-9);
}
@media (min-width: 992px) {
  .p-9-5 {
    padding: var(--spacing-5);
  }
}

.pt-9-5 {
  padding-top: var(--spacing-9);
}
@media (min-width: 992px) {
  .pt-9-5 {
    padding-top: var(--spacing-5);
  }
}

.pb-9-5 {
  padding-bottom: var(--spacing-9);
}
@media (min-width: 992px) {
  .pb-9-5 {
    padding-bottom: var(--spacing-5);
  }
}

.p-inline-9-5 {
  padding-inline: var(--spacing-9);
}
@media (min-width: 992px) {
  .p-inline-9-5 {
    padding-inline: var(--spacing-5);
  }
}

.m-9-5 {
  margin: var(--spacing-9);
}
@media (min-width: 992px) {
  .m-9-5 {
    margin: var(--spacing-5);
  }
}

.mt-9-5 {
  margin-top: var(--spacing-9) !important;
}
@media (min-width: 992px) {
  .mt-9-5 {
    margin-top: var(--spacing-5) !important;
  }
}

.mb-9-5 {
  margin-bottom: var(--spacing-9) !important;
}
@media (min-width: 992px) {
  .mb-9-5 {
    margin-bottom: var(--spacing-5) !important;
  }
}

.ml-9-5 {
  margin-left: var(--spacing-9) !important;
}
@media (min-width: 992px) {
  .ml-9-5 {
    margin-left: var(--spacing-5) !important;
  }
}

.gap-9-5 {
  gap: var(--spacing-9);
}
@media (min-width: 992px) {
  .gap-9-5 {
    gap: var(--spacing-5);
  }
}

.p-9-6 {
  padding: var(--spacing-9);
}
@media (min-width: 992px) {
  .p-9-6 {
    padding: var(--spacing-6);
  }
}

.pt-9-6 {
  padding-top: var(--spacing-9);
}
@media (min-width: 992px) {
  .pt-9-6 {
    padding-top: var(--spacing-6);
  }
}

.pb-9-6 {
  padding-bottom: var(--spacing-9);
}
@media (min-width: 992px) {
  .pb-9-6 {
    padding-bottom: var(--spacing-6);
  }
}

.p-inline-9-6 {
  padding-inline: var(--spacing-9);
}
@media (min-width: 992px) {
  .p-inline-9-6 {
    padding-inline: var(--spacing-6);
  }
}

.m-9-6 {
  margin: var(--spacing-9);
}
@media (min-width: 992px) {
  .m-9-6 {
    margin: var(--spacing-6);
  }
}

.mt-9-6 {
  margin-top: var(--spacing-9) !important;
}
@media (min-width: 992px) {
  .mt-9-6 {
    margin-top: var(--spacing-6) !important;
  }
}

.mb-9-6 {
  margin-bottom: var(--spacing-9) !important;
}
@media (min-width: 992px) {
  .mb-9-6 {
    margin-bottom: var(--spacing-6) !important;
  }
}

.ml-9-6 {
  margin-left: var(--spacing-9) !important;
}
@media (min-width: 992px) {
  .ml-9-6 {
    margin-left: var(--spacing-6) !important;
  }
}

.gap-9-6 {
  gap: var(--spacing-9);
}
@media (min-width: 992px) {
  .gap-9-6 {
    gap: var(--spacing-6);
  }
}

.p-9-7 {
  padding: var(--spacing-9);
}
@media (min-width: 992px) {
  .p-9-7 {
    padding: var(--spacing-7);
  }
}

.pt-9-7 {
  padding-top: var(--spacing-9);
}
@media (min-width: 992px) {
  .pt-9-7 {
    padding-top: var(--spacing-7);
  }
}

.pb-9-7 {
  padding-bottom: var(--spacing-9);
}
@media (min-width: 992px) {
  .pb-9-7 {
    padding-bottom: var(--spacing-7);
  }
}

.p-inline-9-7 {
  padding-inline: var(--spacing-9);
}
@media (min-width: 992px) {
  .p-inline-9-7 {
    padding-inline: var(--spacing-7);
  }
}

.m-9-7 {
  margin: var(--spacing-9);
}
@media (min-width: 992px) {
  .m-9-7 {
    margin: var(--spacing-7);
  }
}

.mt-9-7 {
  margin-top: var(--spacing-9) !important;
}
@media (min-width: 992px) {
  .mt-9-7 {
    margin-top: var(--spacing-7) !important;
  }
}

.mb-9-7 {
  margin-bottom: var(--spacing-9) !important;
}
@media (min-width: 992px) {
  .mb-9-7 {
    margin-bottom: var(--spacing-7) !important;
  }
}

.ml-9-7 {
  margin-left: var(--spacing-9) !important;
}
@media (min-width: 992px) {
  .ml-9-7 {
    margin-left: var(--spacing-7) !important;
  }
}

.gap-9-7 {
  gap: var(--spacing-9);
}
@media (min-width: 992px) {
  .gap-9-7 {
    gap: var(--spacing-7);
  }
}

.p-9-8 {
  padding: var(--spacing-9);
}
@media (min-width: 992px) {
  .p-9-8 {
    padding: var(--spacing-8);
  }
}

.pt-9-8 {
  padding-top: var(--spacing-9);
}
@media (min-width: 992px) {
  .pt-9-8 {
    padding-top: var(--spacing-8);
  }
}

.pb-9-8 {
  padding-bottom: var(--spacing-9);
}
@media (min-width: 992px) {
  .pb-9-8 {
    padding-bottom: var(--spacing-8);
  }
}

.p-inline-9-8 {
  padding-inline: var(--spacing-9);
}
@media (min-width: 992px) {
  .p-inline-9-8 {
    padding-inline: var(--spacing-8);
  }
}

.m-9-8 {
  margin: var(--spacing-9);
}
@media (min-width: 992px) {
  .m-9-8 {
    margin: var(--spacing-8);
  }
}

.mt-9-8 {
  margin-top: var(--spacing-9) !important;
}
@media (min-width: 992px) {
  .mt-9-8 {
    margin-top: var(--spacing-8) !important;
  }
}

.mb-9-8 {
  margin-bottom: var(--spacing-9) !important;
}
@media (min-width: 992px) {
  .mb-9-8 {
    margin-bottom: var(--spacing-8) !important;
  }
}

.ml-9-8 {
  margin-left: var(--spacing-9) !important;
}
@media (min-width: 992px) {
  .ml-9-8 {
    margin-left: var(--spacing-8) !important;
  }
}

.gap-9-8 {
  gap: var(--spacing-9);
}
@media (min-width: 992px) {
  .gap-9-8 {
    gap: var(--spacing-8);
  }
}

.p-9-9 {
  padding: var(--spacing-9);
}
@media (min-width: 992px) {
  .p-9-9 {
    padding: var(--spacing-9);
  }
}

.pt-9-9 {
  padding-top: var(--spacing-9);
}
@media (min-width: 992px) {
  .pt-9-9 {
    padding-top: var(--spacing-9);
  }
}

.pb-9-9 {
  padding-bottom: var(--spacing-9);
}
@media (min-width: 992px) {
  .pb-9-9 {
    padding-bottom: var(--spacing-9);
  }
}

.p-inline-9-9 {
  padding-inline: var(--spacing-9);
}
@media (min-width: 992px) {
  .p-inline-9-9 {
    padding-inline: var(--spacing-9);
  }
}

.m-9-9 {
  margin: var(--spacing-9);
}
@media (min-width: 992px) {
  .m-9-9 {
    margin: var(--spacing-9);
  }
}

.mt-9-9 {
  margin-top: var(--spacing-9) !important;
}
@media (min-width: 992px) {
  .mt-9-9 {
    margin-top: var(--spacing-9) !important;
  }
}

.mb-9-9 {
  margin-bottom: var(--spacing-9) !important;
}
@media (min-width: 992px) {
  .mb-9-9 {
    margin-bottom: var(--spacing-9) !important;
  }
}

.ml-9-9 {
  margin-left: var(--spacing-9) !important;
}
@media (min-width: 992px) {
  .ml-9-9 {
    margin-left: var(--spacing-9) !important;
  }
}

.gap-9-9 {
  gap: var(--spacing-9);
}
@media (min-width: 992px) {
  .gap-9-9 {
    gap: var(--spacing-9);
  }
}

:root {
  --shadow: 5px 5px 10px 0px rgba(20, 36, 66, 0.05);
  --light-shadow: 2px 2px 5px 0px rgba(20, 36, 66, 0.025);
}

.box-shadow {
  box-shadow: var(--shadow);
}

.light-shadow {
  box-shadow: var(--light-shadow);
}

.inset-shadow {
  box-shadow: inset 0px 2px 4px 0px rgba(20, 36, 66, 0.1);
}

.lg-inset-shadow {
  box-shadow: 0 3.2px 3.2px 0 rgba(0, 0, 0, 0.25) inset;
}

.border {
  border: 2px solid var(--primary-800);
  border-radius: var(--spacing-2);
  box-shadow: var(--shadow);
}

.border-1 {
  border-style: solid;
  border-width: 1px;
  border-radius: var(--spacing-2);
}
.border-1.grey {
  border-color: var(--primary-100);
}
.border-1.tan-100 {
  border-color: var(--tan-100);
}

.border-4 {
  border-style: solid;
  border-width: 1px;
  border-radius: var(--spacing-4);
}
.border-4.grey {
  border-color: var(--primary-100);
}

.border-green-3-300 {
  border-style: solid;
  border-width: 3px;
  border-radius: var(--spacing-2);
  border-color: var(--green-300);
}

.border-green-300 {
  border-style: solid;
  border-width: 2px;
  border-radius: var(--spacing-2);
  border-color: var(--green-300);
}

.border-green-1-300 {
  border-style: solid;
  border-width: 1px;
  border-radius: var(--spacing-2);
  border-color: var(--green-300);
}

.border-yellow-300 {
  border-style: solid;
  border-width: 2px;
  border-radius: var(--spacing-2);
  border-color: var(--yellow-300);
}

.border-purple-300 {
  border-style: solid;
  border-width: 2px;
  border-radius: var(--spacing-2);
  border-color: var(--purple-300);
}

.border-purple-1-300 {
  border-style: solid;
  border-width: 1px;
  border-radius: var(--spacing-2);
  border-color: var(--purple-100);
}

.border-pink-300 {
  border-style: solid;
  border-width: 2px;
  border-radius: var(--spacing-2);
  border-color: var(--pink-300);
}

.border-rose-1-300 {
  border-style: solid;
  border-width: 1px;
  border-radius: var(--spacing-2);
  border-color: var(--rose-100);
}

.border-rose-300 {
  border-style: solid;
  border-width: 2px;
  border-radius: var(--spacing-2);
  border-color: var(--rose-300);
}

.border-orange-300 {
  border-style: solid;
  border-width: 2px;
  border-radius: var(--spacing-2);
  border-color: var(--orange-300);
}

.border-thin {
  border: 2px solid var(--tan-600);
  box-shadow: var(--shadow);
}

.border-2-white {
  border-style: solid;
  border-width: 2px;
  border-color: var(--white);
}

.border-2-navy {
  border-style: solid;
  border-width: 2px;
  border-color: var(--navy);
}

.border-top-sm {
  border-top: 0.5px solid var(--navy-400);
}

.border-bottom-sm {
  border-bottom: 0.5px solid var(--navy-400);
}

.border-green-500 {
  border-color: var(--green);
}

.border-dashed {
  border-style: dashed;
}

.border-2 {
  border-width: 2px;
}

.border-tan-300 {
  border: 1px solid var(--tan-300);
}

.splattered-bg {
  background-image: url(//www.tuggs.uk/assets/graphic-elements/splattered-b4ff5d69b0f68ce473a6dfead092c4d38e5b7a5a2c3842e97b2b24871eb8c8c1.svg);
}

.bg-navy-spike {
  background-repeat: no-repeat;
  background-size: cover;
  background-position: top center;
  background-image: url(//www.tuggs.uk/assets/graphic-elements/spike-navy-700-87e65b96840c064a31af8e0470d1a694b013b7fc0dff01008290119256dfd1c7.svg);
}

:root {
  --display-font: "Fredoka", sans-serif;
  --secondary-font: "Permanent Marker", sans-serif;
  --accent-font: "Providence Sans", sans-serif;
  --body-font: "Ostia Antica", sans-serif;
}

.text-underline {
  text-decoration: underline;
}

.text-underline-dashed {
  -webkit-text-decoration: underline dashed;
          text-decoration: underline dashed;
}

.text-reset {
  text-transform: none;
  font-weight: normal;
}

.letter-spacing-reset {
  letter-spacing: normal;
}

body {
  background-color: var(--secondary-200);
  display: flex;
  flex-direction: column;
  justify-content: space-evenly;
  text-align: center;
  color: var(--primary-800);
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 1rem;
  line-height: 1.6;
}
@media (min-width: 992px) {
  body {
    font-size: 1.125rem;
    line-height: 1.6;
  }
}

main {
  flex: 1 0 auto;
}

footer {
  flex-shrink: 0;
}

.section {
  padding-inline: calc((100vw - 95%) / 2);
  padding-block: var(--spacing-5);
}
@media (min-width: 768px) {
  .section {
    padding-inline: calc((100vw - 90%) / 2);
    padding-block: var(--spacing-6);
  }
}
@media (min-width: 992px) {
  .section {
    padding-inline: calc((100vw - 80%) / 2);
    padding-block: var(--spacing-8);
  }
}

.section.sm {
  padding-inline: calc((100vw - 94%) / 2);
  padding-block: var(--spacing-3);
}
@media (min-width: 768px) {
  .section.sm {
    padding-inline: calc((100vw - 95%) / 2);
    padding-block: var(--spacing-4);
  }
}
@media (min-width: 992px) {
  .section.sm {
    padding-inline: calc((100vw - 90%) / 2);
    padding-block: var(--spacing-5);
  }
}

.section.lg {
  padding-inline: calc((100vw - 95%) / 2);
  padding-block: var(--spacing-5);
}
@media (min-width: 768px) {
  .section.lg {
    padding-inline: calc((100vw - 90%) / 2);
    padding-block: var(--spacing-6);
  }
}
@media (min-width: 992px) {
  .section.lg {
    padding-inline: calc((100vw - 80%) / 2);
    padding-block: var(--spacing-8);
  }
}

.spacer-xs {
  padding: var(--spacing-05);
}
@media (min-width: 992px) {
  .spacer-xs {
    padding: var(--spacing-1);
  }
}

.spacer-xxs {
  padding: var(--spacing-05);
}
@media (min-width: 992px) {
  .spacer-xxs {
    padding: var(--spacing-05);
  }
}

.spacer-sm {
  padding: var(--spacing-1);
}
@media (min-width: 992px) {
  .spacer-sm {
    padding: var(--spacing-2);
  }
}

.spacer-sm-xs {
  padding: var(--spacing-1);
}
@media (min-width: 992px) {
  .spacer-sm-xs {
    padding: var(--spacing-2);
  }
}
@media (min-width: 992px) {
  .spacer-sm-xs {
    padding: var(--spacing-05);
  }
}
@media (min-width: 992px) and (min-width: 992px) {
  .spacer-sm-xs {
    padding: var(--spacing-1);
  }
}

.spacer-sm-md {
  padding: var(--spacing-1);
}
@media (min-width: 992px) {
  .spacer-sm-md {
    padding: var(--spacing-2);
  }
}
@media (min-width: 992px) {
  .spacer-sm-md {
    padding: var(--spacing-2);
  }
}
@media (min-width: 992px) and (min-width: 992px) {
  .spacer-sm-md {
    padding: var(--spacing-3);
  }
}

.spacer-sm-lg {
  padding: var(--spacing-1);
}
@media (min-width: 992px) {
  .spacer-sm-lg {
    padding: var(--spacing-2);
  }
}
@media (min-width: 992px) {
  .spacer-sm-lg {
    padding: var(--spacing-3);
  }
}
@media (min-width: 992px) and (min-width: 992px) {
  .spacer-sm-lg {
    padding: var(--spacing-4);
  }
}

.spacer-md {
  padding: var(--spacing-2);
}
@media (min-width: 992px) {
  .spacer-md {
    padding: var(--spacing-3);
  }
}

.spacer-md-sm {
  padding: var(--spacing-2);
}
@media (min-width: 992px) {
  .spacer-md-sm {
    padding: var(--spacing-3);
  }
}
@media (min-width: 992px) {
  .spacer-md-sm {
    padding: var(--spacing-1);
  }
}
@media (min-width: 992px) and (min-width: 992px) {
  .spacer-md-sm {
    padding: var(--spacing-2);
  }
}

.spacer-md-lg {
  padding: var(--spacing-2);
}
@media (min-width: 992px) {
  .spacer-md-lg {
    padding: var(--spacing-3);
  }
}
@media (min-width: 992px) {
  .spacer-md-lg {
    padding: var(--spacing-3);
  }
}
@media (min-width: 992px) and (min-width: 992px) {
  .spacer-md-lg {
    padding: var(--spacing-4);
  }
}

.spacer-md-xl {
  padding: var(--spacing-2);
}
@media (min-width: 992px) {
  .spacer-md-xl {
    padding: var(--spacing-3);
  }
}
@media (min-width: 992px) {
  .spacer-md-xl {
    padding: var(--spacing-4);
  }
}
@media (min-width: 992px) and (min-width: 992px) {
  .spacer-md-xl {
    padding: var(--spacing-5);
  }
}

.spacer-lg {
  padding: var(--spacing-3);
}
@media (min-width: 992px) {
  .spacer-lg {
    padding: var(--spacing-4);
  }
}

.spacer-lg-md {
  padding: var(--spacing-3);
}
@media (min-width: 992px) {
  .spacer-lg-md {
    padding: var(--spacing-4);
  }
}
@media (min-width: 992px) {
  .spacer-lg-md {
    padding: var(--spacing-2);
  }
}
@media (min-width: 992px) and (min-width: 992px) {
  .spacer-lg-md {
    padding: var(--spacing-3);
  }
}

.spacer-xl {
  padding: var(--spacing-4);
}
@media (min-width: 992px) {
  .spacer-xl {
    padding: var(--spacing-5);
  }
}

.gap-sm {
  gap: var(--spacing-1);
}
@media (min-width: 992px) {
  .gap-sm {
    gap: var(--spacing-2);
  }
}

.gap-sm-md {
  gap: var(--spacing-1);
}
@media (min-width: 992px) {
  .gap-sm-md {
    gap: var(--spacing-2);
  }
}
@media (min-width: 992px) {
  .gap-sm-md {
    gap: var(--spacing-2);
  }
}
@media (min-width: 992px) and (min-width: 992px) {
  .gap-sm-md {
    gap: var(--spacing-3);
  }
}

.gap-sm-lg {
  gap: var(--spacing-1);
}
@media (min-width: 992px) {
  .gap-sm-lg {
    gap: var(--spacing-2);
  }
}
@media (min-width: 992px) {
  .gap-sm-lg {
    gap: var(--spacing-3);
  }
}
@media (min-width: 992px) and (min-width: 992px) {
  .gap-sm-lg {
    gap: var(--spacing-4);
  }
}

.gap-md {
  gap: var(--spacing-2);
}
@media (min-width: 992px) {
  .gap-md {
    gap: var(--spacing-3);
  }
}

.gap-lg {
  gap: var(--spacing-3);
}
@media (min-width: 992px) {
  .gap-lg {
    gap: var(--spacing-4);
  }
}

.gap-xl {
  gap: var(--spacing-4);
}
@media (min-width: 992px) {
  .gap-xl {
    gap: var(--spacing-5);
  }
}

.spacer-inline-sm {
  padding-inline: var(--spacing-1);
}
@media (min-width: 992px) {
  .spacer-inline-sm {
    padding-inline: var(--spacing-2);
  }
}

.spacer-block-sm {
  padding-block: var(--spacing-1);
}
@media (min-width: 992px) {
  .spacer-block-sm {
    padding-block: var(--spacing-2);
  }
}

.spacer-inline-md {
  padding-inline: var(--spacing-2);
}
@media (min-width: 992px) {
  .spacer-inline-md {
    padding-inline: var(--spacing-3);
  }
}

.spacer-block-md {
  padding-block: var(--spacing-2);
}
@media (min-width: 992px) {
  .spacer-block-md {
    padding-block: var(--spacing-3);
  }
}

.spacer-inline-lg {
  padding-inline: var(--spacing-3);
}
@media (min-width: 992px) {
  .spacer-inline-lg {
    padding-inline: var(--spacing-4);
  }
}

.spacer-block-lg {
  padding-block: var(--spacing-3);
}
@media (min-width: 992px) {
  .spacer-block-lg {
    padding-block: var(--spacing-4);
  }
}

.block {
  display: block !important;
}

.inline-block {
  display: inline-block !important;
  margin-top: 0 !important;
}

.flex {
  display: flex !important;
}

@media (min-width: 992px) {
  .lg-flex {
    display: flex !important;
  }
}

.column {
  flex-direction: column !important;
}

.sm-column {
  flex-direction: column !important;
}
@media (min-width: 992px) {
  .sm-column {
    flex-direction: row !important;
  }
}

.column-reverse {
  flex-direction: column-reverse !important;
}
@media (min-width: 992px) {
  .column-reverse {
    flex-direction: row !important;
  }
}

.flex-grow-1 {
  flex-grow: 1 !important;
}

.flex-grow-1_5 {
  flex-grow: 1.5 !important;
}

.flex-grow-2 {
  flex-grow: 2 !important;
}

.flex-basis-0 {
  flex-basis: 0 !important;
}

.sm-row {
  flex-direction: row !important;
}
@media (min-width: 992px) {
  .sm-row {
    flex-direction: column !important;
  }
}

.sm-align-center {
  align-items: center !important;
}
@media (min-width: 992px) {
  .sm-align-center {
    align-items: flex-start !important;
  }
}

.wrap {
  flex-wrap: wrap !important;
}

.sm-wrap {
  flex-wrap: wrap !important;
}
@media (min-width: 992px) {
  .sm-wrap {
    flex-wrap: nowrap !important;
  }
}

.justify-between {
  justify-content: space-between !important;
}

.justify-evenly {
  justify-content: space-evenly !important;
}

.justify-around {
  justify-content: space-around !important;
}

.justify-center {
  justify-content: center !important;
}

.justify-items-center {
  justify-items: center !important;
}

.justify-end {
  justify-content: flex-end !important;
}

.justify-start {
  justify-content: flex-start !important;
}

.align-center {
  align-items: center !important;
}

.align-center-start {
  align-items: center !important;
}
@media (min-width: 992px) {
  .align-center-start {
    align-items: flex-start !important;
  }
}

.align-start-center {
  align-items: flex-start !important;
}
@media (min-width: 992px) {
  .align-start-center {
    align-items: center !important;
  }
}

.align-start {
  align-items: flex-start !important;
}

.align-end {
  align-items: flex-end !important;
}

.align-baseline {
  align-items: baseline !important;
}

.align-stretch {
  align-items: stretch !important;
}

.align-self-end {
  align-self: flex-end !important;
}

.m-auto {
  margin: auto !important;
}

.d-none {
  display: none !important;
}

.relative {
  position: relative !important;
}

.sticky {
  position: sticky !important;
}

@media (min-width: 992px) {
  .static-sticky {
    position: sticky !important;
  }
}

.absolute {
  position: absolute !important;
}

.pointer-cursor {
  cursor: pointer !important;
}

.h-100 {
  height: 100% !important;
}

.m-auto-0 {
  margin: auto !important;
}
@media (min-width: 992px) {
  .m-auto-0 {
    margin: 0 !important;
  }
}

.text-center {
  text-align: center !important;
}

.text-left {
  text-align: left !important;
}

.text-right {
  text-align: right !important;
}

.text-center-left {
  text-align: center !important;
}
@media (min-width: 992px) {
  .text-center-left {
    text-align: left !important;
  }
}

@media (min-width: 992px) {
  .lg-d-none {
    display: none !important;
  }
}

.sm-d-none {
  display: none !important;
}
@media (min-width: 992px) {
  .sm-d-none {
    display: revert !important;
  }
}

.sm-d-none-lg-flex {
  display: none !important;
}
@media (min-width: 992px) {
  .sm-d-none-lg-flex {
    display: flex !important;
  }
}

.overflow-scroll {
  overflow-x: scroll !important;
}

.overflow-y-auto {
  overflow-y: auto !important;
}

.overflow-hidden {
  overflow: hidden !important;
}

.sm-overflow-hidden {
  overflow: hidden !important;
}
@media (min-width: 992px) {
  .sm-overflow-hidden {
    overflow: visible !important;
  }
}

.overflow-visible {
  overflow: visible !important;
}

.rotate-right-1 {
  transform: rotate(1deg) !important;
}

.rotate-left-1 {
  transform: rotate(-1deg) !important;
}

.bg-cover {
  background-size: cover;
}

.bg-cover-contain {
  background-size: cover;
}
@media (min-width: 992px) {
  .bg-cover-contain {
    background-size: contain;
  }
}

.no-shadow {
  box-shadow: none !important;
}

.h-fit {
  height: -moz-fit-content !important;
  height: fit-content !important;
}

.line-height-2 {
  line-height: 2 !important;
}

.list-style-none {
  list-style: none;
}

.text-indent-1 {
  padding-left: 1rem;
}

.pointer-events-none {
  pointer-events: none;
}

.top-0 {
  top: 0;
}

.top-1 {
  top: 1rem;
}

.bottom-0 {
  bottom: 0;
}

.left-0 {
  left: 0;
}

.right-0 {
  right: 0;
}

.scale-0-8 {
  scale: 0.8;
}

.cols-1 {
  grid-template-columns: repeat(1, 1fr) !important;
}

.cols-2 {
  grid-template-columns: repeat(2, 1fr) !important;
}

.cols-3 {
  grid-template-columns: repeat(3, 1fr) !important;
}

.cols-4 {
  grid-template-columns: repeat(4, 1fr) !important;
}

.cols-5 {
  grid-template-columns: repeat(5, 1fr) !important;
}

.cols-6 {
  grid-template-columns: repeat(6, 1fr) !important;
}

.cols-7 {
  grid-template-columns: repeat(7, 1fr) !important;
}

.cols-70-30 {
  grid-template-columns: 70fr 30fr !important;
}

.cols-60-40 {
  grid-template-columns: 60fr 40fr !important;
}

.cols-2-1 {
  grid-template-columns: 2fr 1fr !important;
}

.cols-3-1 {
  grid-template-columns: 3fr 1fr !important;
}

.cols-sidebar-right {
  grid-template-columns: 1fr 400px !important;
}

.cols-sidebar-left {
  grid-template-columns: 400px 1fr !important;
}

.cols-1-70-30 {
  grid-template-columns: 1fr !important;
}
@media (min-width: 992px) {
  .cols-1-70-30 {
    grid-template-columns: 70fr 30fr !important;
  }
}

.cols-1-60-40 {
  grid-template-columns: 1fr !important;
}
@media (min-width: 992px) {
  .cols-1-60-40 {
    grid-template-columns: 60fr 40fr !important;
  }
}

.cols-1-2-1 {
  grid-template-columns: 1fr !important;
}
@media (min-width: 992px) {
  .cols-1-2-1 {
    grid-template-columns: 2fr 1fr !important;
  }
}

.cols-1-3-1 {
  grid-template-columns: 1fr !important;
}
@media (min-width: 992px) {
  .cols-1-3-1 {
    grid-template-columns: 3fr 1fr !important;
  }
}

.cols-1-sidebar-right {
  grid-template-columns: 1fr !important;
}
@media (min-width: 992px) {
  .cols-1-sidebar-right {
    grid-template-columns: 1fr 400px !important;
  }
}

.cols-1-sidebar-left {
  grid-template-columns: 1fr !important;
}
@media (min-width: 992px) {
  .cols-1-sidebar-left {
    grid-template-columns: 400px 1fr !important;
  }
}

.cols-1-1 {
  grid-template-columns: repeat(1, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-1-1 {
    grid-template-columns: repeat(1, 1fr) !important;
  }
}

.cols-1-2 {
  grid-template-columns: repeat(1, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-1-2 {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

.cols-1-3 {
  grid-template-columns: repeat(1, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-1-3 {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}

.cols-1-4 {
  grid-template-columns: repeat(1, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-1-4 {
    grid-template-columns: repeat(4, 1fr) !important;
  }
}

.cols-1-5 {
  grid-template-columns: repeat(1, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-1-5 {
    grid-template-columns: repeat(5, 1fr) !important;
  }
}

.cols-1-6 {
  grid-template-columns: repeat(1, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-1-6 {
    grid-template-columns: repeat(6, 1fr) !important;
  }
}

.cols-1-7 {
  grid-template-columns: repeat(1, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-1-7 {
    grid-template-columns: repeat(7, 1fr) !important;
  }
}

.cols-2-1 {
  grid-template-columns: repeat(2, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-2-1 {
    grid-template-columns: repeat(1, 1fr) !important;
  }
}

.cols-2-2 {
  grid-template-columns: repeat(2, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-2-2 {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

.cols-2-3 {
  grid-template-columns: repeat(2, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-2-3 {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}

.cols-2-4 {
  grid-template-columns: repeat(2, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-2-4 {
    grid-template-columns: repeat(4, 1fr) !important;
  }
}

.cols-2-5 {
  grid-template-columns: repeat(2, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-2-5 {
    grid-template-columns: repeat(5, 1fr) !important;
  }
}

.cols-2-6 {
  grid-template-columns: repeat(2, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-2-6 {
    grid-template-columns: repeat(6, 1fr) !important;
  }
}

.cols-2-7 {
  grid-template-columns: repeat(2, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-2-7 {
    grid-template-columns: repeat(7, 1fr) !important;
  }
}

.cols-3-1 {
  grid-template-columns: repeat(3, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-3-1 {
    grid-template-columns: repeat(1, 1fr) !important;
  }
}

.cols-3-2 {
  grid-template-columns: repeat(3, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-3-2 {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

.cols-3-3 {
  grid-template-columns: repeat(3, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-3-3 {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}

.cols-3-4 {
  grid-template-columns: repeat(3, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-3-4 {
    grid-template-columns: repeat(4, 1fr) !important;
  }
}

.cols-3-5 {
  grid-template-columns: repeat(3, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-3-5 {
    grid-template-columns: repeat(5, 1fr) !important;
  }
}

.cols-3-6 {
  grid-template-columns: repeat(3, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-3-6 {
    grid-template-columns: repeat(6, 1fr) !important;
  }
}

.cols-3-7 {
  grid-template-columns: repeat(3, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-3-7 {
    grid-template-columns: repeat(7, 1fr) !important;
  }
}

.cols-4-1 {
  grid-template-columns: repeat(4, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-4-1 {
    grid-template-columns: repeat(1, 1fr) !important;
  }
}

.cols-4-2 {
  grid-template-columns: repeat(4, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-4-2 {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

.cols-4-3 {
  grid-template-columns: repeat(4, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-4-3 {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}

.cols-4-4 {
  grid-template-columns: repeat(4, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-4-4 {
    grid-template-columns: repeat(4, 1fr) !important;
  }
}

.cols-4-5 {
  grid-template-columns: repeat(4, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-4-5 {
    grid-template-columns: repeat(5, 1fr) !important;
  }
}

.cols-4-6 {
  grid-template-columns: repeat(4, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-4-6 {
    grid-template-columns: repeat(6, 1fr) !important;
  }
}

.cols-4-7 {
  grid-template-columns: repeat(4, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-4-7 {
    grid-template-columns: repeat(7, 1fr) !important;
  }
}

.cols-5-1 {
  grid-template-columns: repeat(5, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-5-1 {
    grid-template-columns: repeat(1, 1fr) !important;
  }
}

.cols-5-2 {
  grid-template-columns: repeat(5, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-5-2 {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

.cols-5-3 {
  grid-template-columns: repeat(5, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-5-3 {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}

.cols-5-4 {
  grid-template-columns: repeat(5, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-5-4 {
    grid-template-columns: repeat(4, 1fr) !important;
  }
}

.cols-5-5 {
  grid-template-columns: repeat(5, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-5-5 {
    grid-template-columns: repeat(5, 1fr) !important;
  }
}

.cols-5-6 {
  grid-template-columns: repeat(5, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-5-6 {
    grid-template-columns: repeat(6, 1fr) !important;
  }
}

.cols-5-7 {
  grid-template-columns: repeat(5, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-5-7 {
    grid-template-columns: repeat(7, 1fr) !important;
  }
}

.cols-6-1 {
  grid-template-columns: repeat(6, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-6-1 {
    grid-template-columns: repeat(1, 1fr) !important;
  }
}

.cols-6-2 {
  grid-template-columns: repeat(6, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-6-2 {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

.cols-6-3 {
  grid-template-columns: repeat(6, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-6-3 {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}

.cols-6-4 {
  grid-template-columns: repeat(6, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-6-4 {
    grid-template-columns: repeat(4, 1fr) !important;
  }
}

.cols-6-5 {
  grid-template-columns: repeat(6, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-6-5 {
    grid-template-columns: repeat(5, 1fr) !important;
  }
}

.cols-6-6 {
  grid-template-columns: repeat(6, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-6-6 {
    grid-template-columns: repeat(6, 1fr) !important;
  }
}

.cols-6-7 {
  grid-template-columns: repeat(6, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-6-7 {
    grid-template-columns: repeat(7, 1fr) !important;
  }
}

.cols-7-1 {
  grid-template-columns: repeat(7, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-7-1 {
    grid-template-columns: repeat(1, 1fr) !important;
  }
}

.cols-7-2 {
  grid-template-columns: repeat(7, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-7-2 {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

.cols-7-3 {
  grid-template-columns: repeat(7, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-7-3 {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}

.cols-7-4 {
  grid-template-columns: repeat(7, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-7-4 {
    grid-template-columns: repeat(4, 1fr) !important;
  }
}

.cols-7-5 {
  grid-template-columns: repeat(7, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-7-5 {
    grid-template-columns: repeat(5, 1fr) !important;
  }
}

.cols-7-6 {
  grid-template-columns: repeat(7, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-7-6 {
    grid-template-columns: repeat(6, 1fr) !important;
  }
}

.cols-7-7 {
  grid-template-columns: repeat(7, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-7-7 {
    grid-template-columns: repeat(7, 1fr) !important;
  }
}

.cols-1-1-1 {
  grid-template-columns: repeat(1, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-1-1-1 {
    grid-template-columns: repeat(1, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-1-1-1 {
    grid-template-columns: repeat(1, 1fr) !important;
  }
}

.cols-1-1-2 {
  grid-template-columns: repeat(1, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-1-1-2 {
    grid-template-columns: repeat(1, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-1-1-2 {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

.cols-1-1-3 {
  grid-template-columns: repeat(1, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-1-1-3 {
    grid-template-columns: repeat(1, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-1-1-3 {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}

.cols-1-1-4 {
  grid-template-columns: repeat(1, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-1-1-4 {
    grid-template-columns: repeat(1, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-1-1-4 {
    grid-template-columns: repeat(4, 1fr) !important;
  }
}

.cols-1-1-5 {
  grid-template-columns: repeat(1, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-1-1-5 {
    grid-template-columns: repeat(1, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-1-1-5 {
    grid-template-columns: repeat(5, 1fr) !important;
  }
}

.cols-1-1-6 {
  grid-template-columns: repeat(1, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-1-1-6 {
    grid-template-columns: repeat(1, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-1-1-6 {
    grid-template-columns: repeat(6, 1fr) !important;
  }
}

.cols-1-1-7 {
  grid-template-columns: repeat(1, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-1-1-7 {
    grid-template-columns: repeat(1, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-1-1-7 {
    grid-template-columns: repeat(7, 1fr) !important;
  }
}

.cols-1-2-1 {
  grid-template-columns: repeat(1, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-1-2-1 {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-1-2-1 {
    grid-template-columns: repeat(1, 1fr) !important;
  }
}

.cols-1-2-2 {
  grid-template-columns: repeat(1, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-1-2-2 {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-1-2-2 {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

.cols-1-2-3 {
  grid-template-columns: repeat(1, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-1-2-3 {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-1-2-3 {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}

.cols-1-2-4 {
  grid-template-columns: repeat(1, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-1-2-4 {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-1-2-4 {
    grid-template-columns: repeat(4, 1fr) !important;
  }
}

.cols-1-2-5 {
  grid-template-columns: repeat(1, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-1-2-5 {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-1-2-5 {
    grid-template-columns: repeat(5, 1fr) !important;
  }
}

.cols-1-2-6 {
  grid-template-columns: repeat(1, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-1-2-6 {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-1-2-6 {
    grid-template-columns: repeat(6, 1fr) !important;
  }
}

.cols-1-2-7 {
  grid-template-columns: repeat(1, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-1-2-7 {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-1-2-7 {
    grid-template-columns: repeat(7, 1fr) !important;
  }
}

.cols-1-3-1 {
  grid-template-columns: repeat(1, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-1-3-1 {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-1-3-1 {
    grid-template-columns: repeat(1, 1fr) !important;
  }
}

.cols-1-3-2 {
  grid-template-columns: repeat(1, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-1-3-2 {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-1-3-2 {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

.cols-1-3-3 {
  grid-template-columns: repeat(1, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-1-3-3 {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-1-3-3 {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}

.cols-1-3-4 {
  grid-template-columns: repeat(1, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-1-3-4 {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-1-3-4 {
    grid-template-columns: repeat(4, 1fr) !important;
  }
}

.cols-1-3-5 {
  grid-template-columns: repeat(1, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-1-3-5 {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-1-3-5 {
    grid-template-columns: repeat(5, 1fr) !important;
  }
}

.cols-1-3-6 {
  grid-template-columns: repeat(1, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-1-3-6 {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-1-3-6 {
    grid-template-columns: repeat(6, 1fr) !important;
  }
}

.cols-1-3-7 {
  grid-template-columns: repeat(1, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-1-3-7 {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-1-3-7 {
    grid-template-columns: repeat(7, 1fr) !important;
  }
}

.cols-1-4-1 {
  grid-template-columns: repeat(1, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-1-4-1 {
    grid-template-columns: repeat(4, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-1-4-1 {
    grid-template-columns: repeat(1, 1fr) !important;
  }
}

.cols-1-4-2 {
  grid-template-columns: repeat(1, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-1-4-2 {
    grid-template-columns: repeat(4, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-1-4-2 {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

.cols-1-4-3 {
  grid-template-columns: repeat(1, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-1-4-3 {
    grid-template-columns: repeat(4, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-1-4-3 {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}

.cols-1-4-4 {
  grid-template-columns: repeat(1, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-1-4-4 {
    grid-template-columns: repeat(4, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-1-4-4 {
    grid-template-columns: repeat(4, 1fr) !important;
  }
}

.cols-1-4-5 {
  grid-template-columns: repeat(1, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-1-4-5 {
    grid-template-columns: repeat(4, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-1-4-5 {
    grid-template-columns: repeat(5, 1fr) !important;
  }
}

.cols-1-4-6 {
  grid-template-columns: repeat(1, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-1-4-6 {
    grid-template-columns: repeat(4, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-1-4-6 {
    grid-template-columns: repeat(6, 1fr) !important;
  }
}

.cols-1-4-7 {
  grid-template-columns: repeat(1, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-1-4-7 {
    grid-template-columns: repeat(4, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-1-4-7 {
    grid-template-columns: repeat(7, 1fr) !important;
  }
}

.cols-1-5-1 {
  grid-template-columns: repeat(1, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-1-5-1 {
    grid-template-columns: repeat(5, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-1-5-1 {
    grid-template-columns: repeat(1, 1fr) !important;
  }
}

.cols-1-5-2 {
  grid-template-columns: repeat(1, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-1-5-2 {
    grid-template-columns: repeat(5, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-1-5-2 {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

.cols-1-5-3 {
  grid-template-columns: repeat(1, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-1-5-3 {
    grid-template-columns: repeat(5, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-1-5-3 {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}

.cols-1-5-4 {
  grid-template-columns: repeat(1, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-1-5-4 {
    grid-template-columns: repeat(5, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-1-5-4 {
    grid-template-columns: repeat(4, 1fr) !important;
  }
}

.cols-1-5-5 {
  grid-template-columns: repeat(1, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-1-5-5 {
    grid-template-columns: repeat(5, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-1-5-5 {
    grid-template-columns: repeat(5, 1fr) !important;
  }
}

.cols-1-5-6 {
  grid-template-columns: repeat(1, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-1-5-6 {
    grid-template-columns: repeat(5, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-1-5-6 {
    grid-template-columns: repeat(6, 1fr) !important;
  }
}

.cols-1-5-7 {
  grid-template-columns: repeat(1, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-1-5-7 {
    grid-template-columns: repeat(5, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-1-5-7 {
    grid-template-columns: repeat(7, 1fr) !important;
  }
}

.cols-1-6-1 {
  grid-template-columns: repeat(1, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-1-6-1 {
    grid-template-columns: repeat(6, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-1-6-1 {
    grid-template-columns: repeat(1, 1fr) !important;
  }
}

.cols-1-6-2 {
  grid-template-columns: repeat(1, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-1-6-2 {
    grid-template-columns: repeat(6, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-1-6-2 {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

.cols-1-6-3 {
  grid-template-columns: repeat(1, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-1-6-3 {
    grid-template-columns: repeat(6, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-1-6-3 {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}

.cols-1-6-4 {
  grid-template-columns: repeat(1, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-1-6-4 {
    grid-template-columns: repeat(6, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-1-6-4 {
    grid-template-columns: repeat(4, 1fr) !important;
  }
}

.cols-1-6-5 {
  grid-template-columns: repeat(1, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-1-6-5 {
    grid-template-columns: repeat(6, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-1-6-5 {
    grid-template-columns: repeat(5, 1fr) !important;
  }
}

.cols-1-6-6 {
  grid-template-columns: repeat(1, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-1-6-6 {
    grid-template-columns: repeat(6, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-1-6-6 {
    grid-template-columns: repeat(6, 1fr) !important;
  }
}

.cols-1-6-7 {
  grid-template-columns: repeat(1, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-1-6-7 {
    grid-template-columns: repeat(6, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-1-6-7 {
    grid-template-columns: repeat(7, 1fr) !important;
  }
}

.cols-1-7-1 {
  grid-template-columns: repeat(1, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-1-7-1 {
    grid-template-columns: repeat(7, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-1-7-1 {
    grid-template-columns: repeat(1, 1fr) !important;
  }
}

.cols-1-7-2 {
  grid-template-columns: repeat(1, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-1-7-2 {
    grid-template-columns: repeat(7, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-1-7-2 {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

.cols-1-7-3 {
  grid-template-columns: repeat(1, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-1-7-3 {
    grid-template-columns: repeat(7, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-1-7-3 {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}

.cols-1-7-4 {
  grid-template-columns: repeat(1, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-1-7-4 {
    grid-template-columns: repeat(7, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-1-7-4 {
    grid-template-columns: repeat(4, 1fr) !important;
  }
}

.cols-1-7-5 {
  grid-template-columns: repeat(1, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-1-7-5 {
    grid-template-columns: repeat(7, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-1-7-5 {
    grid-template-columns: repeat(5, 1fr) !important;
  }
}

.cols-1-7-6 {
  grid-template-columns: repeat(1, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-1-7-6 {
    grid-template-columns: repeat(7, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-1-7-6 {
    grid-template-columns: repeat(6, 1fr) !important;
  }
}

.cols-1-7-7 {
  grid-template-columns: repeat(1, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-1-7-7 {
    grid-template-columns: repeat(7, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-1-7-7 {
    grid-template-columns: repeat(7, 1fr) !important;
  }
}

.cols-2-1-1 {
  grid-template-columns: repeat(2, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-2-1-1 {
    grid-template-columns: repeat(1, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-2-1-1 {
    grid-template-columns: repeat(1, 1fr) !important;
  }
}

.cols-2-1-2 {
  grid-template-columns: repeat(2, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-2-1-2 {
    grid-template-columns: repeat(1, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-2-1-2 {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

.cols-2-1-3 {
  grid-template-columns: repeat(2, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-2-1-3 {
    grid-template-columns: repeat(1, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-2-1-3 {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}

.cols-2-1-4 {
  grid-template-columns: repeat(2, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-2-1-4 {
    grid-template-columns: repeat(1, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-2-1-4 {
    grid-template-columns: repeat(4, 1fr) !important;
  }
}

.cols-2-1-5 {
  grid-template-columns: repeat(2, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-2-1-5 {
    grid-template-columns: repeat(1, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-2-1-5 {
    grid-template-columns: repeat(5, 1fr) !important;
  }
}

.cols-2-1-6 {
  grid-template-columns: repeat(2, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-2-1-6 {
    grid-template-columns: repeat(1, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-2-1-6 {
    grid-template-columns: repeat(6, 1fr) !important;
  }
}

.cols-2-1-7 {
  grid-template-columns: repeat(2, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-2-1-7 {
    grid-template-columns: repeat(1, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-2-1-7 {
    grid-template-columns: repeat(7, 1fr) !important;
  }
}

.cols-2-2-1 {
  grid-template-columns: repeat(2, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-2-2-1 {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-2-2-1 {
    grid-template-columns: repeat(1, 1fr) !important;
  }
}

.cols-2-2-2 {
  grid-template-columns: repeat(2, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-2-2-2 {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-2-2-2 {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

.cols-2-2-3 {
  grid-template-columns: repeat(2, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-2-2-3 {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-2-2-3 {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}

.cols-2-2-4 {
  grid-template-columns: repeat(2, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-2-2-4 {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-2-2-4 {
    grid-template-columns: repeat(4, 1fr) !important;
  }
}

.cols-2-2-5 {
  grid-template-columns: repeat(2, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-2-2-5 {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-2-2-5 {
    grid-template-columns: repeat(5, 1fr) !important;
  }
}

.cols-2-2-6 {
  grid-template-columns: repeat(2, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-2-2-6 {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-2-2-6 {
    grid-template-columns: repeat(6, 1fr) !important;
  }
}

.cols-2-2-7 {
  grid-template-columns: repeat(2, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-2-2-7 {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-2-2-7 {
    grid-template-columns: repeat(7, 1fr) !important;
  }
}

.cols-2-3-1 {
  grid-template-columns: repeat(2, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-2-3-1 {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-2-3-1 {
    grid-template-columns: repeat(1, 1fr) !important;
  }
}

.cols-2-3-2 {
  grid-template-columns: repeat(2, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-2-3-2 {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-2-3-2 {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

.cols-2-3-3 {
  grid-template-columns: repeat(2, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-2-3-3 {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-2-3-3 {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}

.cols-2-3-4 {
  grid-template-columns: repeat(2, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-2-3-4 {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-2-3-4 {
    grid-template-columns: repeat(4, 1fr) !important;
  }
}

.cols-2-3-5 {
  grid-template-columns: repeat(2, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-2-3-5 {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-2-3-5 {
    grid-template-columns: repeat(5, 1fr) !important;
  }
}

.cols-2-3-6 {
  grid-template-columns: repeat(2, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-2-3-6 {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-2-3-6 {
    grid-template-columns: repeat(6, 1fr) !important;
  }
}

.cols-2-3-7 {
  grid-template-columns: repeat(2, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-2-3-7 {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-2-3-7 {
    grid-template-columns: repeat(7, 1fr) !important;
  }
}

.cols-2-4-1 {
  grid-template-columns: repeat(2, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-2-4-1 {
    grid-template-columns: repeat(4, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-2-4-1 {
    grid-template-columns: repeat(1, 1fr) !important;
  }
}

.cols-2-4-2 {
  grid-template-columns: repeat(2, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-2-4-2 {
    grid-template-columns: repeat(4, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-2-4-2 {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

.cols-2-4-3 {
  grid-template-columns: repeat(2, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-2-4-3 {
    grid-template-columns: repeat(4, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-2-4-3 {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}

.cols-2-4-4 {
  grid-template-columns: repeat(2, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-2-4-4 {
    grid-template-columns: repeat(4, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-2-4-4 {
    grid-template-columns: repeat(4, 1fr) !important;
  }
}

.cols-2-4-5 {
  grid-template-columns: repeat(2, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-2-4-5 {
    grid-template-columns: repeat(4, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-2-4-5 {
    grid-template-columns: repeat(5, 1fr) !important;
  }
}

.cols-2-4-6 {
  grid-template-columns: repeat(2, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-2-4-6 {
    grid-template-columns: repeat(4, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-2-4-6 {
    grid-template-columns: repeat(6, 1fr) !important;
  }
}

.cols-2-4-7 {
  grid-template-columns: repeat(2, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-2-4-7 {
    grid-template-columns: repeat(4, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-2-4-7 {
    grid-template-columns: repeat(7, 1fr) !important;
  }
}

.cols-2-5-1 {
  grid-template-columns: repeat(2, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-2-5-1 {
    grid-template-columns: repeat(5, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-2-5-1 {
    grid-template-columns: repeat(1, 1fr) !important;
  }
}

.cols-2-5-2 {
  grid-template-columns: repeat(2, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-2-5-2 {
    grid-template-columns: repeat(5, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-2-5-2 {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

.cols-2-5-3 {
  grid-template-columns: repeat(2, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-2-5-3 {
    grid-template-columns: repeat(5, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-2-5-3 {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}

.cols-2-5-4 {
  grid-template-columns: repeat(2, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-2-5-4 {
    grid-template-columns: repeat(5, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-2-5-4 {
    grid-template-columns: repeat(4, 1fr) !important;
  }
}

.cols-2-5-5 {
  grid-template-columns: repeat(2, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-2-5-5 {
    grid-template-columns: repeat(5, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-2-5-5 {
    grid-template-columns: repeat(5, 1fr) !important;
  }
}

.cols-2-5-6 {
  grid-template-columns: repeat(2, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-2-5-6 {
    grid-template-columns: repeat(5, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-2-5-6 {
    grid-template-columns: repeat(6, 1fr) !important;
  }
}

.cols-2-5-7 {
  grid-template-columns: repeat(2, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-2-5-7 {
    grid-template-columns: repeat(5, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-2-5-7 {
    grid-template-columns: repeat(7, 1fr) !important;
  }
}

.cols-2-6-1 {
  grid-template-columns: repeat(2, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-2-6-1 {
    grid-template-columns: repeat(6, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-2-6-1 {
    grid-template-columns: repeat(1, 1fr) !important;
  }
}

.cols-2-6-2 {
  grid-template-columns: repeat(2, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-2-6-2 {
    grid-template-columns: repeat(6, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-2-6-2 {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

.cols-2-6-3 {
  grid-template-columns: repeat(2, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-2-6-3 {
    grid-template-columns: repeat(6, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-2-6-3 {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}

.cols-2-6-4 {
  grid-template-columns: repeat(2, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-2-6-4 {
    grid-template-columns: repeat(6, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-2-6-4 {
    grid-template-columns: repeat(4, 1fr) !important;
  }
}

.cols-2-6-5 {
  grid-template-columns: repeat(2, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-2-6-5 {
    grid-template-columns: repeat(6, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-2-6-5 {
    grid-template-columns: repeat(5, 1fr) !important;
  }
}

.cols-2-6-6 {
  grid-template-columns: repeat(2, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-2-6-6 {
    grid-template-columns: repeat(6, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-2-6-6 {
    grid-template-columns: repeat(6, 1fr) !important;
  }
}

.cols-2-6-7 {
  grid-template-columns: repeat(2, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-2-6-7 {
    grid-template-columns: repeat(6, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-2-6-7 {
    grid-template-columns: repeat(7, 1fr) !important;
  }
}

.cols-2-7-1 {
  grid-template-columns: repeat(2, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-2-7-1 {
    grid-template-columns: repeat(7, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-2-7-1 {
    grid-template-columns: repeat(1, 1fr) !important;
  }
}

.cols-2-7-2 {
  grid-template-columns: repeat(2, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-2-7-2 {
    grid-template-columns: repeat(7, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-2-7-2 {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

.cols-2-7-3 {
  grid-template-columns: repeat(2, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-2-7-3 {
    grid-template-columns: repeat(7, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-2-7-3 {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}

.cols-2-7-4 {
  grid-template-columns: repeat(2, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-2-7-4 {
    grid-template-columns: repeat(7, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-2-7-4 {
    grid-template-columns: repeat(4, 1fr) !important;
  }
}

.cols-2-7-5 {
  grid-template-columns: repeat(2, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-2-7-5 {
    grid-template-columns: repeat(7, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-2-7-5 {
    grid-template-columns: repeat(5, 1fr) !important;
  }
}

.cols-2-7-6 {
  grid-template-columns: repeat(2, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-2-7-6 {
    grid-template-columns: repeat(7, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-2-7-6 {
    grid-template-columns: repeat(6, 1fr) !important;
  }
}

.cols-2-7-7 {
  grid-template-columns: repeat(2, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-2-7-7 {
    grid-template-columns: repeat(7, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-2-7-7 {
    grid-template-columns: repeat(7, 1fr) !important;
  }
}

.cols-3-1-1 {
  grid-template-columns: repeat(3, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-3-1-1 {
    grid-template-columns: repeat(1, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-3-1-1 {
    grid-template-columns: repeat(1, 1fr) !important;
  }
}

.cols-3-1-2 {
  grid-template-columns: repeat(3, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-3-1-2 {
    grid-template-columns: repeat(1, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-3-1-2 {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

.cols-3-1-3 {
  grid-template-columns: repeat(3, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-3-1-3 {
    grid-template-columns: repeat(1, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-3-1-3 {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}

.cols-3-1-4 {
  grid-template-columns: repeat(3, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-3-1-4 {
    grid-template-columns: repeat(1, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-3-1-4 {
    grid-template-columns: repeat(4, 1fr) !important;
  }
}

.cols-3-1-5 {
  grid-template-columns: repeat(3, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-3-1-5 {
    grid-template-columns: repeat(1, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-3-1-5 {
    grid-template-columns: repeat(5, 1fr) !important;
  }
}

.cols-3-1-6 {
  grid-template-columns: repeat(3, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-3-1-6 {
    grid-template-columns: repeat(1, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-3-1-6 {
    grid-template-columns: repeat(6, 1fr) !important;
  }
}

.cols-3-1-7 {
  grid-template-columns: repeat(3, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-3-1-7 {
    grid-template-columns: repeat(1, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-3-1-7 {
    grid-template-columns: repeat(7, 1fr) !important;
  }
}

.cols-3-2-1 {
  grid-template-columns: repeat(3, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-3-2-1 {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-3-2-1 {
    grid-template-columns: repeat(1, 1fr) !important;
  }
}

.cols-3-2-2 {
  grid-template-columns: repeat(3, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-3-2-2 {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-3-2-2 {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

.cols-3-2-3 {
  grid-template-columns: repeat(3, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-3-2-3 {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-3-2-3 {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}

.cols-3-2-4 {
  grid-template-columns: repeat(3, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-3-2-4 {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-3-2-4 {
    grid-template-columns: repeat(4, 1fr) !important;
  }
}

.cols-3-2-5 {
  grid-template-columns: repeat(3, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-3-2-5 {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-3-2-5 {
    grid-template-columns: repeat(5, 1fr) !important;
  }
}

.cols-3-2-6 {
  grid-template-columns: repeat(3, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-3-2-6 {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-3-2-6 {
    grid-template-columns: repeat(6, 1fr) !important;
  }
}

.cols-3-2-7 {
  grid-template-columns: repeat(3, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-3-2-7 {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-3-2-7 {
    grid-template-columns: repeat(7, 1fr) !important;
  }
}

.cols-3-3-1 {
  grid-template-columns: repeat(3, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-3-3-1 {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-3-3-1 {
    grid-template-columns: repeat(1, 1fr) !important;
  }
}

.cols-3-3-2 {
  grid-template-columns: repeat(3, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-3-3-2 {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-3-3-2 {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

.cols-3-3-3 {
  grid-template-columns: repeat(3, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-3-3-3 {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-3-3-3 {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}

.cols-3-3-4 {
  grid-template-columns: repeat(3, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-3-3-4 {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-3-3-4 {
    grid-template-columns: repeat(4, 1fr) !important;
  }
}

.cols-3-3-5 {
  grid-template-columns: repeat(3, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-3-3-5 {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-3-3-5 {
    grid-template-columns: repeat(5, 1fr) !important;
  }
}

.cols-3-3-6 {
  grid-template-columns: repeat(3, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-3-3-6 {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-3-3-6 {
    grid-template-columns: repeat(6, 1fr) !important;
  }
}

.cols-3-3-7 {
  grid-template-columns: repeat(3, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-3-3-7 {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-3-3-7 {
    grid-template-columns: repeat(7, 1fr) !important;
  }
}

.cols-3-4-1 {
  grid-template-columns: repeat(3, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-3-4-1 {
    grid-template-columns: repeat(4, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-3-4-1 {
    grid-template-columns: repeat(1, 1fr) !important;
  }
}

.cols-3-4-2 {
  grid-template-columns: repeat(3, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-3-4-2 {
    grid-template-columns: repeat(4, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-3-4-2 {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

.cols-3-4-3 {
  grid-template-columns: repeat(3, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-3-4-3 {
    grid-template-columns: repeat(4, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-3-4-3 {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}

.cols-3-4-4 {
  grid-template-columns: repeat(3, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-3-4-4 {
    grid-template-columns: repeat(4, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-3-4-4 {
    grid-template-columns: repeat(4, 1fr) !important;
  }
}

.cols-3-4-5 {
  grid-template-columns: repeat(3, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-3-4-5 {
    grid-template-columns: repeat(4, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-3-4-5 {
    grid-template-columns: repeat(5, 1fr) !important;
  }
}

.cols-3-4-6 {
  grid-template-columns: repeat(3, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-3-4-6 {
    grid-template-columns: repeat(4, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-3-4-6 {
    grid-template-columns: repeat(6, 1fr) !important;
  }
}

.cols-3-4-7 {
  grid-template-columns: repeat(3, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-3-4-7 {
    grid-template-columns: repeat(4, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-3-4-7 {
    grid-template-columns: repeat(7, 1fr) !important;
  }
}

.cols-3-5-1 {
  grid-template-columns: repeat(3, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-3-5-1 {
    grid-template-columns: repeat(5, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-3-5-1 {
    grid-template-columns: repeat(1, 1fr) !important;
  }
}

.cols-3-5-2 {
  grid-template-columns: repeat(3, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-3-5-2 {
    grid-template-columns: repeat(5, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-3-5-2 {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

.cols-3-5-3 {
  grid-template-columns: repeat(3, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-3-5-3 {
    grid-template-columns: repeat(5, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-3-5-3 {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}

.cols-3-5-4 {
  grid-template-columns: repeat(3, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-3-5-4 {
    grid-template-columns: repeat(5, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-3-5-4 {
    grid-template-columns: repeat(4, 1fr) !important;
  }
}

.cols-3-5-5 {
  grid-template-columns: repeat(3, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-3-5-5 {
    grid-template-columns: repeat(5, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-3-5-5 {
    grid-template-columns: repeat(5, 1fr) !important;
  }
}

.cols-3-5-6 {
  grid-template-columns: repeat(3, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-3-5-6 {
    grid-template-columns: repeat(5, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-3-5-6 {
    grid-template-columns: repeat(6, 1fr) !important;
  }
}

.cols-3-5-7 {
  grid-template-columns: repeat(3, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-3-5-7 {
    grid-template-columns: repeat(5, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-3-5-7 {
    grid-template-columns: repeat(7, 1fr) !important;
  }
}

.cols-3-6-1 {
  grid-template-columns: repeat(3, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-3-6-1 {
    grid-template-columns: repeat(6, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-3-6-1 {
    grid-template-columns: repeat(1, 1fr) !important;
  }
}

.cols-3-6-2 {
  grid-template-columns: repeat(3, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-3-6-2 {
    grid-template-columns: repeat(6, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-3-6-2 {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

.cols-3-6-3 {
  grid-template-columns: repeat(3, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-3-6-3 {
    grid-template-columns: repeat(6, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-3-6-3 {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}

.cols-3-6-4 {
  grid-template-columns: repeat(3, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-3-6-4 {
    grid-template-columns: repeat(6, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-3-6-4 {
    grid-template-columns: repeat(4, 1fr) !important;
  }
}

.cols-3-6-5 {
  grid-template-columns: repeat(3, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-3-6-5 {
    grid-template-columns: repeat(6, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-3-6-5 {
    grid-template-columns: repeat(5, 1fr) !important;
  }
}

.cols-3-6-6 {
  grid-template-columns: repeat(3, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-3-6-6 {
    grid-template-columns: repeat(6, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-3-6-6 {
    grid-template-columns: repeat(6, 1fr) !important;
  }
}

.cols-3-6-7 {
  grid-template-columns: repeat(3, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-3-6-7 {
    grid-template-columns: repeat(6, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-3-6-7 {
    grid-template-columns: repeat(7, 1fr) !important;
  }
}

.cols-3-7-1 {
  grid-template-columns: repeat(3, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-3-7-1 {
    grid-template-columns: repeat(7, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-3-7-1 {
    grid-template-columns: repeat(1, 1fr) !important;
  }
}

.cols-3-7-2 {
  grid-template-columns: repeat(3, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-3-7-2 {
    grid-template-columns: repeat(7, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-3-7-2 {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

.cols-3-7-3 {
  grid-template-columns: repeat(3, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-3-7-3 {
    grid-template-columns: repeat(7, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-3-7-3 {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}

.cols-3-7-4 {
  grid-template-columns: repeat(3, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-3-7-4 {
    grid-template-columns: repeat(7, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-3-7-4 {
    grid-template-columns: repeat(4, 1fr) !important;
  }
}

.cols-3-7-5 {
  grid-template-columns: repeat(3, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-3-7-5 {
    grid-template-columns: repeat(7, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-3-7-5 {
    grid-template-columns: repeat(5, 1fr) !important;
  }
}

.cols-3-7-6 {
  grid-template-columns: repeat(3, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-3-7-6 {
    grid-template-columns: repeat(7, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-3-7-6 {
    grid-template-columns: repeat(6, 1fr) !important;
  }
}

.cols-3-7-7 {
  grid-template-columns: repeat(3, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-3-7-7 {
    grid-template-columns: repeat(7, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-3-7-7 {
    grid-template-columns: repeat(7, 1fr) !important;
  }
}

.cols-4-1-1 {
  grid-template-columns: repeat(4, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-4-1-1 {
    grid-template-columns: repeat(1, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-4-1-1 {
    grid-template-columns: repeat(1, 1fr) !important;
  }
}

.cols-4-1-2 {
  grid-template-columns: repeat(4, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-4-1-2 {
    grid-template-columns: repeat(1, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-4-1-2 {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

.cols-4-1-3 {
  grid-template-columns: repeat(4, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-4-1-3 {
    grid-template-columns: repeat(1, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-4-1-3 {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}

.cols-4-1-4 {
  grid-template-columns: repeat(4, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-4-1-4 {
    grid-template-columns: repeat(1, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-4-1-4 {
    grid-template-columns: repeat(4, 1fr) !important;
  }
}

.cols-4-1-5 {
  grid-template-columns: repeat(4, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-4-1-5 {
    grid-template-columns: repeat(1, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-4-1-5 {
    grid-template-columns: repeat(5, 1fr) !important;
  }
}

.cols-4-1-6 {
  grid-template-columns: repeat(4, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-4-1-6 {
    grid-template-columns: repeat(1, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-4-1-6 {
    grid-template-columns: repeat(6, 1fr) !important;
  }
}

.cols-4-1-7 {
  grid-template-columns: repeat(4, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-4-1-7 {
    grid-template-columns: repeat(1, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-4-1-7 {
    grid-template-columns: repeat(7, 1fr) !important;
  }
}

.cols-4-2-1 {
  grid-template-columns: repeat(4, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-4-2-1 {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-4-2-1 {
    grid-template-columns: repeat(1, 1fr) !important;
  }
}

.cols-4-2-2 {
  grid-template-columns: repeat(4, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-4-2-2 {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-4-2-2 {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

.cols-4-2-3 {
  grid-template-columns: repeat(4, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-4-2-3 {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-4-2-3 {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}

.cols-4-2-4 {
  grid-template-columns: repeat(4, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-4-2-4 {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-4-2-4 {
    grid-template-columns: repeat(4, 1fr) !important;
  }
}

.cols-4-2-5 {
  grid-template-columns: repeat(4, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-4-2-5 {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-4-2-5 {
    grid-template-columns: repeat(5, 1fr) !important;
  }
}

.cols-4-2-6 {
  grid-template-columns: repeat(4, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-4-2-6 {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-4-2-6 {
    grid-template-columns: repeat(6, 1fr) !important;
  }
}

.cols-4-2-7 {
  grid-template-columns: repeat(4, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-4-2-7 {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-4-2-7 {
    grid-template-columns: repeat(7, 1fr) !important;
  }
}

.cols-4-3-1 {
  grid-template-columns: repeat(4, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-4-3-1 {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-4-3-1 {
    grid-template-columns: repeat(1, 1fr) !important;
  }
}

.cols-4-3-2 {
  grid-template-columns: repeat(4, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-4-3-2 {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-4-3-2 {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

.cols-4-3-3 {
  grid-template-columns: repeat(4, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-4-3-3 {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-4-3-3 {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}

.cols-4-3-4 {
  grid-template-columns: repeat(4, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-4-3-4 {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-4-3-4 {
    grid-template-columns: repeat(4, 1fr) !important;
  }
}

.cols-4-3-5 {
  grid-template-columns: repeat(4, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-4-3-5 {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-4-3-5 {
    grid-template-columns: repeat(5, 1fr) !important;
  }
}

.cols-4-3-6 {
  grid-template-columns: repeat(4, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-4-3-6 {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-4-3-6 {
    grid-template-columns: repeat(6, 1fr) !important;
  }
}

.cols-4-3-7 {
  grid-template-columns: repeat(4, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-4-3-7 {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-4-3-7 {
    grid-template-columns: repeat(7, 1fr) !important;
  }
}

.cols-4-4-1 {
  grid-template-columns: repeat(4, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-4-4-1 {
    grid-template-columns: repeat(4, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-4-4-1 {
    grid-template-columns: repeat(1, 1fr) !important;
  }
}

.cols-4-4-2 {
  grid-template-columns: repeat(4, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-4-4-2 {
    grid-template-columns: repeat(4, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-4-4-2 {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

.cols-4-4-3 {
  grid-template-columns: repeat(4, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-4-4-3 {
    grid-template-columns: repeat(4, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-4-4-3 {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}

.cols-4-4-4 {
  grid-template-columns: repeat(4, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-4-4-4 {
    grid-template-columns: repeat(4, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-4-4-4 {
    grid-template-columns: repeat(4, 1fr) !important;
  }
}

.cols-4-4-5 {
  grid-template-columns: repeat(4, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-4-4-5 {
    grid-template-columns: repeat(4, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-4-4-5 {
    grid-template-columns: repeat(5, 1fr) !important;
  }
}

.cols-4-4-6 {
  grid-template-columns: repeat(4, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-4-4-6 {
    grid-template-columns: repeat(4, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-4-4-6 {
    grid-template-columns: repeat(6, 1fr) !important;
  }
}

.cols-4-4-7 {
  grid-template-columns: repeat(4, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-4-4-7 {
    grid-template-columns: repeat(4, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-4-4-7 {
    grid-template-columns: repeat(7, 1fr) !important;
  }
}

.cols-4-5-1 {
  grid-template-columns: repeat(4, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-4-5-1 {
    grid-template-columns: repeat(5, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-4-5-1 {
    grid-template-columns: repeat(1, 1fr) !important;
  }
}

.cols-4-5-2 {
  grid-template-columns: repeat(4, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-4-5-2 {
    grid-template-columns: repeat(5, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-4-5-2 {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

.cols-4-5-3 {
  grid-template-columns: repeat(4, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-4-5-3 {
    grid-template-columns: repeat(5, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-4-5-3 {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}

.cols-4-5-4 {
  grid-template-columns: repeat(4, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-4-5-4 {
    grid-template-columns: repeat(5, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-4-5-4 {
    grid-template-columns: repeat(4, 1fr) !important;
  }
}

.cols-4-5-5 {
  grid-template-columns: repeat(4, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-4-5-5 {
    grid-template-columns: repeat(5, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-4-5-5 {
    grid-template-columns: repeat(5, 1fr) !important;
  }
}

.cols-4-5-6 {
  grid-template-columns: repeat(4, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-4-5-6 {
    grid-template-columns: repeat(5, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-4-5-6 {
    grid-template-columns: repeat(6, 1fr) !important;
  }
}

.cols-4-5-7 {
  grid-template-columns: repeat(4, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-4-5-7 {
    grid-template-columns: repeat(5, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-4-5-7 {
    grid-template-columns: repeat(7, 1fr) !important;
  }
}

.cols-4-6-1 {
  grid-template-columns: repeat(4, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-4-6-1 {
    grid-template-columns: repeat(6, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-4-6-1 {
    grid-template-columns: repeat(1, 1fr) !important;
  }
}

.cols-4-6-2 {
  grid-template-columns: repeat(4, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-4-6-2 {
    grid-template-columns: repeat(6, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-4-6-2 {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

.cols-4-6-3 {
  grid-template-columns: repeat(4, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-4-6-3 {
    grid-template-columns: repeat(6, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-4-6-3 {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}

.cols-4-6-4 {
  grid-template-columns: repeat(4, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-4-6-4 {
    grid-template-columns: repeat(6, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-4-6-4 {
    grid-template-columns: repeat(4, 1fr) !important;
  }
}

.cols-4-6-5 {
  grid-template-columns: repeat(4, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-4-6-5 {
    grid-template-columns: repeat(6, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-4-6-5 {
    grid-template-columns: repeat(5, 1fr) !important;
  }
}

.cols-4-6-6 {
  grid-template-columns: repeat(4, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-4-6-6 {
    grid-template-columns: repeat(6, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-4-6-6 {
    grid-template-columns: repeat(6, 1fr) !important;
  }
}

.cols-4-6-7 {
  grid-template-columns: repeat(4, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-4-6-7 {
    grid-template-columns: repeat(6, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-4-6-7 {
    grid-template-columns: repeat(7, 1fr) !important;
  }
}

.cols-4-7-1 {
  grid-template-columns: repeat(4, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-4-7-1 {
    grid-template-columns: repeat(7, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-4-7-1 {
    grid-template-columns: repeat(1, 1fr) !important;
  }
}

.cols-4-7-2 {
  grid-template-columns: repeat(4, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-4-7-2 {
    grid-template-columns: repeat(7, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-4-7-2 {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

.cols-4-7-3 {
  grid-template-columns: repeat(4, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-4-7-3 {
    grid-template-columns: repeat(7, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-4-7-3 {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}

.cols-4-7-4 {
  grid-template-columns: repeat(4, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-4-7-4 {
    grid-template-columns: repeat(7, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-4-7-4 {
    grid-template-columns: repeat(4, 1fr) !important;
  }
}

.cols-4-7-5 {
  grid-template-columns: repeat(4, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-4-7-5 {
    grid-template-columns: repeat(7, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-4-7-5 {
    grid-template-columns: repeat(5, 1fr) !important;
  }
}

.cols-4-7-6 {
  grid-template-columns: repeat(4, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-4-7-6 {
    grid-template-columns: repeat(7, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-4-7-6 {
    grid-template-columns: repeat(6, 1fr) !important;
  }
}

.cols-4-7-7 {
  grid-template-columns: repeat(4, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-4-7-7 {
    grid-template-columns: repeat(7, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-4-7-7 {
    grid-template-columns: repeat(7, 1fr) !important;
  }
}

.cols-5-1-1 {
  grid-template-columns: repeat(5, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-5-1-1 {
    grid-template-columns: repeat(1, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-5-1-1 {
    grid-template-columns: repeat(1, 1fr) !important;
  }
}

.cols-5-1-2 {
  grid-template-columns: repeat(5, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-5-1-2 {
    grid-template-columns: repeat(1, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-5-1-2 {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

.cols-5-1-3 {
  grid-template-columns: repeat(5, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-5-1-3 {
    grid-template-columns: repeat(1, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-5-1-3 {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}

.cols-5-1-4 {
  grid-template-columns: repeat(5, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-5-1-4 {
    grid-template-columns: repeat(1, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-5-1-4 {
    grid-template-columns: repeat(4, 1fr) !important;
  }
}

.cols-5-1-5 {
  grid-template-columns: repeat(5, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-5-1-5 {
    grid-template-columns: repeat(1, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-5-1-5 {
    grid-template-columns: repeat(5, 1fr) !important;
  }
}

.cols-5-1-6 {
  grid-template-columns: repeat(5, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-5-1-6 {
    grid-template-columns: repeat(1, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-5-1-6 {
    grid-template-columns: repeat(6, 1fr) !important;
  }
}

.cols-5-1-7 {
  grid-template-columns: repeat(5, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-5-1-7 {
    grid-template-columns: repeat(1, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-5-1-7 {
    grid-template-columns: repeat(7, 1fr) !important;
  }
}

.cols-5-2-1 {
  grid-template-columns: repeat(5, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-5-2-1 {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-5-2-1 {
    grid-template-columns: repeat(1, 1fr) !important;
  }
}

.cols-5-2-2 {
  grid-template-columns: repeat(5, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-5-2-2 {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-5-2-2 {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

.cols-5-2-3 {
  grid-template-columns: repeat(5, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-5-2-3 {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-5-2-3 {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}

.cols-5-2-4 {
  grid-template-columns: repeat(5, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-5-2-4 {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-5-2-4 {
    grid-template-columns: repeat(4, 1fr) !important;
  }
}

.cols-5-2-5 {
  grid-template-columns: repeat(5, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-5-2-5 {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-5-2-5 {
    grid-template-columns: repeat(5, 1fr) !important;
  }
}

.cols-5-2-6 {
  grid-template-columns: repeat(5, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-5-2-6 {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-5-2-6 {
    grid-template-columns: repeat(6, 1fr) !important;
  }
}

.cols-5-2-7 {
  grid-template-columns: repeat(5, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-5-2-7 {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-5-2-7 {
    grid-template-columns: repeat(7, 1fr) !important;
  }
}

.cols-5-3-1 {
  grid-template-columns: repeat(5, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-5-3-1 {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-5-3-1 {
    grid-template-columns: repeat(1, 1fr) !important;
  }
}

.cols-5-3-2 {
  grid-template-columns: repeat(5, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-5-3-2 {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-5-3-2 {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

.cols-5-3-3 {
  grid-template-columns: repeat(5, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-5-3-3 {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-5-3-3 {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}

.cols-5-3-4 {
  grid-template-columns: repeat(5, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-5-3-4 {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-5-3-4 {
    grid-template-columns: repeat(4, 1fr) !important;
  }
}

.cols-5-3-5 {
  grid-template-columns: repeat(5, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-5-3-5 {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-5-3-5 {
    grid-template-columns: repeat(5, 1fr) !important;
  }
}

.cols-5-3-6 {
  grid-template-columns: repeat(5, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-5-3-6 {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-5-3-6 {
    grid-template-columns: repeat(6, 1fr) !important;
  }
}

.cols-5-3-7 {
  grid-template-columns: repeat(5, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-5-3-7 {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-5-3-7 {
    grid-template-columns: repeat(7, 1fr) !important;
  }
}

.cols-5-4-1 {
  grid-template-columns: repeat(5, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-5-4-1 {
    grid-template-columns: repeat(4, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-5-4-1 {
    grid-template-columns: repeat(1, 1fr) !important;
  }
}

.cols-5-4-2 {
  grid-template-columns: repeat(5, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-5-4-2 {
    grid-template-columns: repeat(4, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-5-4-2 {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

.cols-5-4-3 {
  grid-template-columns: repeat(5, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-5-4-3 {
    grid-template-columns: repeat(4, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-5-4-3 {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}

.cols-5-4-4 {
  grid-template-columns: repeat(5, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-5-4-4 {
    grid-template-columns: repeat(4, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-5-4-4 {
    grid-template-columns: repeat(4, 1fr) !important;
  }
}

.cols-5-4-5 {
  grid-template-columns: repeat(5, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-5-4-5 {
    grid-template-columns: repeat(4, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-5-4-5 {
    grid-template-columns: repeat(5, 1fr) !important;
  }
}

.cols-5-4-6 {
  grid-template-columns: repeat(5, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-5-4-6 {
    grid-template-columns: repeat(4, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-5-4-6 {
    grid-template-columns: repeat(6, 1fr) !important;
  }
}

.cols-5-4-7 {
  grid-template-columns: repeat(5, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-5-4-7 {
    grid-template-columns: repeat(4, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-5-4-7 {
    grid-template-columns: repeat(7, 1fr) !important;
  }
}

.cols-5-5-1 {
  grid-template-columns: repeat(5, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-5-5-1 {
    grid-template-columns: repeat(5, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-5-5-1 {
    grid-template-columns: repeat(1, 1fr) !important;
  }
}

.cols-5-5-2 {
  grid-template-columns: repeat(5, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-5-5-2 {
    grid-template-columns: repeat(5, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-5-5-2 {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

.cols-5-5-3 {
  grid-template-columns: repeat(5, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-5-5-3 {
    grid-template-columns: repeat(5, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-5-5-3 {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}

.cols-5-5-4 {
  grid-template-columns: repeat(5, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-5-5-4 {
    grid-template-columns: repeat(5, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-5-5-4 {
    grid-template-columns: repeat(4, 1fr) !important;
  }
}

.cols-5-5-5 {
  grid-template-columns: repeat(5, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-5-5-5 {
    grid-template-columns: repeat(5, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-5-5-5 {
    grid-template-columns: repeat(5, 1fr) !important;
  }
}

.cols-5-5-6 {
  grid-template-columns: repeat(5, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-5-5-6 {
    grid-template-columns: repeat(5, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-5-5-6 {
    grid-template-columns: repeat(6, 1fr) !important;
  }
}

.cols-5-5-7 {
  grid-template-columns: repeat(5, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-5-5-7 {
    grid-template-columns: repeat(5, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-5-5-7 {
    grid-template-columns: repeat(7, 1fr) !important;
  }
}

.cols-5-6-1 {
  grid-template-columns: repeat(5, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-5-6-1 {
    grid-template-columns: repeat(6, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-5-6-1 {
    grid-template-columns: repeat(1, 1fr) !important;
  }
}

.cols-5-6-2 {
  grid-template-columns: repeat(5, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-5-6-2 {
    grid-template-columns: repeat(6, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-5-6-2 {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

.cols-5-6-3 {
  grid-template-columns: repeat(5, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-5-6-3 {
    grid-template-columns: repeat(6, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-5-6-3 {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}

.cols-5-6-4 {
  grid-template-columns: repeat(5, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-5-6-4 {
    grid-template-columns: repeat(6, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-5-6-4 {
    grid-template-columns: repeat(4, 1fr) !important;
  }
}

.cols-5-6-5 {
  grid-template-columns: repeat(5, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-5-6-5 {
    grid-template-columns: repeat(6, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-5-6-5 {
    grid-template-columns: repeat(5, 1fr) !important;
  }
}

.cols-5-6-6 {
  grid-template-columns: repeat(5, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-5-6-6 {
    grid-template-columns: repeat(6, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-5-6-6 {
    grid-template-columns: repeat(6, 1fr) !important;
  }
}

.cols-5-6-7 {
  grid-template-columns: repeat(5, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-5-6-7 {
    grid-template-columns: repeat(6, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-5-6-7 {
    grid-template-columns: repeat(7, 1fr) !important;
  }
}

.cols-5-7-1 {
  grid-template-columns: repeat(5, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-5-7-1 {
    grid-template-columns: repeat(7, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-5-7-1 {
    grid-template-columns: repeat(1, 1fr) !important;
  }
}

.cols-5-7-2 {
  grid-template-columns: repeat(5, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-5-7-2 {
    grid-template-columns: repeat(7, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-5-7-2 {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

.cols-5-7-3 {
  grid-template-columns: repeat(5, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-5-7-3 {
    grid-template-columns: repeat(7, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-5-7-3 {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}

.cols-5-7-4 {
  grid-template-columns: repeat(5, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-5-7-4 {
    grid-template-columns: repeat(7, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-5-7-4 {
    grid-template-columns: repeat(4, 1fr) !important;
  }
}

.cols-5-7-5 {
  grid-template-columns: repeat(5, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-5-7-5 {
    grid-template-columns: repeat(7, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-5-7-5 {
    grid-template-columns: repeat(5, 1fr) !important;
  }
}

.cols-5-7-6 {
  grid-template-columns: repeat(5, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-5-7-6 {
    grid-template-columns: repeat(7, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-5-7-6 {
    grid-template-columns: repeat(6, 1fr) !important;
  }
}

.cols-5-7-7 {
  grid-template-columns: repeat(5, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-5-7-7 {
    grid-template-columns: repeat(7, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-5-7-7 {
    grid-template-columns: repeat(7, 1fr) !important;
  }
}

.cols-6-1-1 {
  grid-template-columns: repeat(6, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-6-1-1 {
    grid-template-columns: repeat(1, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-6-1-1 {
    grid-template-columns: repeat(1, 1fr) !important;
  }
}

.cols-6-1-2 {
  grid-template-columns: repeat(6, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-6-1-2 {
    grid-template-columns: repeat(1, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-6-1-2 {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

.cols-6-1-3 {
  grid-template-columns: repeat(6, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-6-1-3 {
    grid-template-columns: repeat(1, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-6-1-3 {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}

.cols-6-1-4 {
  grid-template-columns: repeat(6, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-6-1-4 {
    grid-template-columns: repeat(1, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-6-1-4 {
    grid-template-columns: repeat(4, 1fr) !important;
  }
}

.cols-6-1-5 {
  grid-template-columns: repeat(6, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-6-1-5 {
    grid-template-columns: repeat(1, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-6-1-5 {
    grid-template-columns: repeat(5, 1fr) !important;
  }
}

.cols-6-1-6 {
  grid-template-columns: repeat(6, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-6-1-6 {
    grid-template-columns: repeat(1, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-6-1-6 {
    grid-template-columns: repeat(6, 1fr) !important;
  }
}

.cols-6-1-7 {
  grid-template-columns: repeat(6, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-6-1-7 {
    grid-template-columns: repeat(1, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-6-1-7 {
    grid-template-columns: repeat(7, 1fr) !important;
  }
}

.cols-6-2-1 {
  grid-template-columns: repeat(6, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-6-2-1 {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-6-2-1 {
    grid-template-columns: repeat(1, 1fr) !important;
  }
}

.cols-6-2-2 {
  grid-template-columns: repeat(6, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-6-2-2 {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-6-2-2 {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

.cols-6-2-3 {
  grid-template-columns: repeat(6, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-6-2-3 {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-6-2-3 {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}

.cols-6-2-4 {
  grid-template-columns: repeat(6, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-6-2-4 {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-6-2-4 {
    grid-template-columns: repeat(4, 1fr) !important;
  }
}

.cols-6-2-5 {
  grid-template-columns: repeat(6, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-6-2-5 {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-6-2-5 {
    grid-template-columns: repeat(5, 1fr) !important;
  }
}

.cols-6-2-6 {
  grid-template-columns: repeat(6, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-6-2-6 {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-6-2-6 {
    grid-template-columns: repeat(6, 1fr) !important;
  }
}

.cols-6-2-7 {
  grid-template-columns: repeat(6, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-6-2-7 {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-6-2-7 {
    grid-template-columns: repeat(7, 1fr) !important;
  }
}

.cols-6-3-1 {
  grid-template-columns: repeat(6, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-6-3-1 {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-6-3-1 {
    grid-template-columns: repeat(1, 1fr) !important;
  }
}

.cols-6-3-2 {
  grid-template-columns: repeat(6, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-6-3-2 {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-6-3-2 {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

.cols-6-3-3 {
  grid-template-columns: repeat(6, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-6-3-3 {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-6-3-3 {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}

.cols-6-3-4 {
  grid-template-columns: repeat(6, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-6-3-4 {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-6-3-4 {
    grid-template-columns: repeat(4, 1fr) !important;
  }
}

.cols-6-3-5 {
  grid-template-columns: repeat(6, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-6-3-5 {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-6-3-5 {
    grid-template-columns: repeat(5, 1fr) !important;
  }
}

.cols-6-3-6 {
  grid-template-columns: repeat(6, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-6-3-6 {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-6-3-6 {
    grid-template-columns: repeat(6, 1fr) !important;
  }
}

.cols-6-3-7 {
  grid-template-columns: repeat(6, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-6-3-7 {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-6-3-7 {
    grid-template-columns: repeat(7, 1fr) !important;
  }
}

.cols-6-4-1 {
  grid-template-columns: repeat(6, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-6-4-1 {
    grid-template-columns: repeat(4, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-6-4-1 {
    grid-template-columns: repeat(1, 1fr) !important;
  }
}

.cols-6-4-2 {
  grid-template-columns: repeat(6, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-6-4-2 {
    grid-template-columns: repeat(4, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-6-4-2 {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

.cols-6-4-3 {
  grid-template-columns: repeat(6, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-6-4-3 {
    grid-template-columns: repeat(4, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-6-4-3 {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}

.cols-6-4-4 {
  grid-template-columns: repeat(6, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-6-4-4 {
    grid-template-columns: repeat(4, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-6-4-4 {
    grid-template-columns: repeat(4, 1fr) !important;
  }
}

.cols-6-4-5 {
  grid-template-columns: repeat(6, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-6-4-5 {
    grid-template-columns: repeat(4, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-6-4-5 {
    grid-template-columns: repeat(5, 1fr) !important;
  }
}

.cols-6-4-6 {
  grid-template-columns: repeat(6, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-6-4-6 {
    grid-template-columns: repeat(4, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-6-4-6 {
    grid-template-columns: repeat(6, 1fr) !important;
  }
}

.cols-6-4-7 {
  grid-template-columns: repeat(6, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-6-4-7 {
    grid-template-columns: repeat(4, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-6-4-7 {
    grid-template-columns: repeat(7, 1fr) !important;
  }
}

.cols-6-5-1 {
  grid-template-columns: repeat(6, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-6-5-1 {
    grid-template-columns: repeat(5, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-6-5-1 {
    grid-template-columns: repeat(1, 1fr) !important;
  }
}

.cols-6-5-2 {
  grid-template-columns: repeat(6, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-6-5-2 {
    grid-template-columns: repeat(5, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-6-5-2 {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

.cols-6-5-3 {
  grid-template-columns: repeat(6, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-6-5-3 {
    grid-template-columns: repeat(5, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-6-5-3 {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}

.cols-6-5-4 {
  grid-template-columns: repeat(6, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-6-5-4 {
    grid-template-columns: repeat(5, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-6-5-4 {
    grid-template-columns: repeat(4, 1fr) !important;
  }
}

.cols-6-5-5 {
  grid-template-columns: repeat(6, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-6-5-5 {
    grid-template-columns: repeat(5, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-6-5-5 {
    grid-template-columns: repeat(5, 1fr) !important;
  }
}

.cols-6-5-6 {
  grid-template-columns: repeat(6, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-6-5-6 {
    grid-template-columns: repeat(5, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-6-5-6 {
    grid-template-columns: repeat(6, 1fr) !important;
  }
}

.cols-6-5-7 {
  grid-template-columns: repeat(6, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-6-5-7 {
    grid-template-columns: repeat(5, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-6-5-7 {
    grid-template-columns: repeat(7, 1fr) !important;
  }
}

.cols-6-6-1 {
  grid-template-columns: repeat(6, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-6-6-1 {
    grid-template-columns: repeat(6, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-6-6-1 {
    grid-template-columns: repeat(1, 1fr) !important;
  }
}

.cols-6-6-2 {
  grid-template-columns: repeat(6, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-6-6-2 {
    grid-template-columns: repeat(6, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-6-6-2 {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

.cols-6-6-3 {
  grid-template-columns: repeat(6, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-6-6-3 {
    grid-template-columns: repeat(6, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-6-6-3 {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}

.cols-6-6-4 {
  grid-template-columns: repeat(6, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-6-6-4 {
    grid-template-columns: repeat(6, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-6-6-4 {
    grid-template-columns: repeat(4, 1fr) !important;
  }
}

.cols-6-6-5 {
  grid-template-columns: repeat(6, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-6-6-5 {
    grid-template-columns: repeat(6, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-6-6-5 {
    grid-template-columns: repeat(5, 1fr) !important;
  }
}

.cols-6-6-6 {
  grid-template-columns: repeat(6, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-6-6-6 {
    grid-template-columns: repeat(6, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-6-6-6 {
    grid-template-columns: repeat(6, 1fr) !important;
  }
}

.cols-6-6-7 {
  grid-template-columns: repeat(6, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-6-6-7 {
    grid-template-columns: repeat(6, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-6-6-7 {
    grid-template-columns: repeat(7, 1fr) !important;
  }
}

.cols-6-7-1 {
  grid-template-columns: repeat(6, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-6-7-1 {
    grid-template-columns: repeat(7, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-6-7-1 {
    grid-template-columns: repeat(1, 1fr) !important;
  }
}

.cols-6-7-2 {
  grid-template-columns: repeat(6, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-6-7-2 {
    grid-template-columns: repeat(7, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-6-7-2 {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

.cols-6-7-3 {
  grid-template-columns: repeat(6, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-6-7-3 {
    grid-template-columns: repeat(7, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-6-7-3 {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}

.cols-6-7-4 {
  grid-template-columns: repeat(6, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-6-7-4 {
    grid-template-columns: repeat(7, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-6-7-4 {
    grid-template-columns: repeat(4, 1fr) !important;
  }
}

.cols-6-7-5 {
  grid-template-columns: repeat(6, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-6-7-5 {
    grid-template-columns: repeat(7, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-6-7-5 {
    grid-template-columns: repeat(5, 1fr) !important;
  }
}

.cols-6-7-6 {
  grid-template-columns: repeat(6, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-6-7-6 {
    grid-template-columns: repeat(7, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-6-7-6 {
    grid-template-columns: repeat(6, 1fr) !important;
  }
}

.cols-6-7-7 {
  grid-template-columns: repeat(6, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-6-7-7 {
    grid-template-columns: repeat(7, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-6-7-7 {
    grid-template-columns: repeat(7, 1fr) !important;
  }
}

.cols-7-1-1 {
  grid-template-columns: repeat(7, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-7-1-1 {
    grid-template-columns: repeat(1, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-7-1-1 {
    grid-template-columns: repeat(1, 1fr) !important;
  }
}

.cols-7-1-2 {
  grid-template-columns: repeat(7, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-7-1-2 {
    grid-template-columns: repeat(1, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-7-1-2 {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

.cols-7-1-3 {
  grid-template-columns: repeat(7, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-7-1-3 {
    grid-template-columns: repeat(1, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-7-1-3 {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}

.cols-7-1-4 {
  grid-template-columns: repeat(7, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-7-1-4 {
    grid-template-columns: repeat(1, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-7-1-4 {
    grid-template-columns: repeat(4, 1fr) !important;
  }
}

.cols-7-1-5 {
  grid-template-columns: repeat(7, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-7-1-5 {
    grid-template-columns: repeat(1, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-7-1-5 {
    grid-template-columns: repeat(5, 1fr) !important;
  }
}

.cols-7-1-6 {
  grid-template-columns: repeat(7, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-7-1-6 {
    grid-template-columns: repeat(1, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-7-1-6 {
    grid-template-columns: repeat(6, 1fr) !important;
  }
}

.cols-7-1-7 {
  grid-template-columns: repeat(7, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-7-1-7 {
    grid-template-columns: repeat(1, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-7-1-7 {
    grid-template-columns: repeat(7, 1fr) !important;
  }
}

.cols-7-2-1 {
  grid-template-columns: repeat(7, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-7-2-1 {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-7-2-1 {
    grid-template-columns: repeat(1, 1fr) !important;
  }
}

.cols-7-2-2 {
  grid-template-columns: repeat(7, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-7-2-2 {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-7-2-2 {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

.cols-7-2-3 {
  grid-template-columns: repeat(7, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-7-2-3 {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-7-2-3 {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}

.cols-7-2-4 {
  grid-template-columns: repeat(7, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-7-2-4 {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-7-2-4 {
    grid-template-columns: repeat(4, 1fr) !important;
  }
}

.cols-7-2-5 {
  grid-template-columns: repeat(7, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-7-2-5 {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-7-2-5 {
    grid-template-columns: repeat(5, 1fr) !important;
  }
}

.cols-7-2-6 {
  grid-template-columns: repeat(7, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-7-2-6 {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-7-2-6 {
    grid-template-columns: repeat(6, 1fr) !important;
  }
}

.cols-7-2-7 {
  grid-template-columns: repeat(7, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-7-2-7 {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-7-2-7 {
    grid-template-columns: repeat(7, 1fr) !important;
  }
}

.cols-7-3-1 {
  grid-template-columns: repeat(7, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-7-3-1 {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-7-3-1 {
    grid-template-columns: repeat(1, 1fr) !important;
  }
}

.cols-7-3-2 {
  grid-template-columns: repeat(7, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-7-3-2 {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-7-3-2 {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

.cols-7-3-3 {
  grid-template-columns: repeat(7, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-7-3-3 {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-7-3-3 {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}

.cols-7-3-4 {
  grid-template-columns: repeat(7, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-7-3-4 {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-7-3-4 {
    grid-template-columns: repeat(4, 1fr) !important;
  }
}

.cols-7-3-5 {
  grid-template-columns: repeat(7, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-7-3-5 {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-7-3-5 {
    grid-template-columns: repeat(5, 1fr) !important;
  }
}

.cols-7-3-6 {
  grid-template-columns: repeat(7, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-7-3-6 {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-7-3-6 {
    grid-template-columns: repeat(6, 1fr) !important;
  }
}

.cols-7-3-7 {
  grid-template-columns: repeat(7, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-7-3-7 {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-7-3-7 {
    grid-template-columns: repeat(7, 1fr) !important;
  }
}

.cols-7-4-1 {
  grid-template-columns: repeat(7, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-7-4-1 {
    grid-template-columns: repeat(4, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-7-4-1 {
    grid-template-columns: repeat(1, 1fr) !important;
  }
}

.cols-7-4-2 {
  grid-template-columns: repeat(7, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-7-4-2 {
    grid-template-columns: repeat(4, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-7-4-2 {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

.cols-7-4-3 {
  grid-template-columns: repeat(7, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-7-4-3 {
    grid-template-columns: repeat(4, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-7-4-3 {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}

.cols-7-4-4 {
  grid-template-columns: repeat(7, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-7-4-4 {
    grid-template-columns: repeat(4, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-7-4-4 {
    grid-template-columns: repeat(4, 1fr) !important;
  }
}

.cols-7-4-5 {
  grid-template-columns: repeat(7, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-7-4-5 {
    grid-template-columns: repeat(4, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-7-4-5 {
    grid-template-columns: repeat(5, 1fr) !important;
  }
}

.cols-7-4-6 {
  grid-template-columns: repeat(7, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-7-4-6 {
    grid-template-columns: repeat(4, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-7-4-6 {
    grid-template-columns: repeat(6, 1fr) !important;
  }
}

.cols-7-4-7 {
  grid-template-columns: repeat(7, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-7-4-7 {
    grid-template-columns: repeat(4, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-7-4-7 {
    grid-template-columns: repeat(7, 1fr) !important;
  }
}

.cols-7-5-1 {
  grid-template-columns: repeat(7, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-7-5-1 {
    grid-template-columns: repeat(5, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-7-5-1 {
    grid-template-columns: repeat(1, 1fr) !important;
  }
}

.cols-7-5-2 {
  grid-template-columns: repeat(7, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-7-5-2 {
    grid-template-columns: repeat(5, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-7-5-2 {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

.cols-7-5-3 {
  grid-template-columns: repeat(7, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-7-5-3 {
    grid-template-columns: repeat(5, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-7-5-3 {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}

.cols-7-5-4 {
  grid-template-columns: repeat(7, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-7-5-4 {
    grid-template-columns: repeat(5, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-7-5-4 {
    grid-template-columns: repeat(4, 1fr) !important;
  }
}

.cols-7-5-5 {
  grid-template-columns: repeat(7, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-7-5-5 {
    grid-template-columns: repeat(5, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-7-5-5 {
    grid-template-columns: repeat(5, 1fr) !important;
  }
}

.cols-7-5-6 {
  grid-template-columns: repeat(7, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-7-5-6 {
    grid-template-columns: repeat(5, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-7-5-6 {
    grid-template-columns: repeat(6, 1fr) !important;
  }
}

.cols-7-5-7 {
  grid-template-columns: repeat(7, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-7-5-7 {
    grid-template-columns: repeat(5, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-7-5-7 {
    grid-template-columns: repeat(7, 1fr) !important;
  }
}

.cols-7-6-1 {
  grid-template-columns: repeat(7, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-7-6-1 {
    grid-template-columns: repeat(6, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-7-6-1 {
    grid-template-columns: repeat(1, 1fr) !important;
  }
}

.cols-7-6-2 {
  grid-template-columns: repeat(7, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-7-6-2 {
    grid-template-columns: repeat(6, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-7-6-2 {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

.cols-7-6-3 {
  grid-template-columns: repeat(7, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-7-6-3 {
    grid-template-columns: repeat(6, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-7-6-3 {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}

.cols-7-6-4 {
  grid-template-columns: repeat(7, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-7-6-4 {
    grid-template-columns: repeat(6, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-7-6-4 {
    grid-template-columns: repeat(4, 1fr) !important;
  }
}

.cols-7-6-5 {
  grid-template-columns: repeat(7, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-7-6-5 {
    grid-template-columns: repeat(6, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-7-6-5 {
    grid-template-columns: repeat(5, 1fr) !important;
  }
}

.cols-7-6-6 {
  grid-template-columns: repeat(7, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-7-6-6 {
    grid-template-columns: repeat(6, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-7-6-6 {
    grid-template-columns: repeat(6, 1fr) !important;
  }
}

.cols-7-6-7 {
  grid-template-columns: repeat(7, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-7-6-7 {
    grid-template-columns: repeat(6, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-7-6-7 {
    grid-template-columns: repeat(7, 1fr) !important;
  }
}

.cols-7-7-1 {
  grid-template-columns: repeat(7, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-7-7-1 {
    grid-template-columns: repeat(7, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-7-7-1 {
    grid-template-columns: repeat(1, 1fr) !important;
  }
}

.cols-7-7-2 {
  grid-template-columns: repeat(7, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-7-7-2 {
    grid-template-columns: repeat(7, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-7-7-2 {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

.cols-7-7-3 {
  grid-template-columns: repeat(7, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-7-7-3 {
    grid-template-columns: repeat(7, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-7-7-3 {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}

.cols-7-7-4 {
  grid-template-columns: repeat(7, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-7-7-4 {
    grid-template-columns: repeat(7, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-7-7-4 {
    grid-template-columns: repeat(4, 1fr) !important;
  }
}

.cols-7-7-5 {
  grid-template-columns: repeat(7, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-7-7-5 {
    grid-template-columns: repeat(7, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-7-7-5 {
    grid-template-columns: repeat(5, 1fr) !important;
  }
}

.cols-7-7-6 {
  grid-template-columns: repeat(7, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-7-7-6 {
    grid-template-columns: repeat(7, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-7-7-6 {
    grid-template-columns: repeat(6, 1fr) !important;
  }
}

.cols-7-7-7 {
  grid-template-columns: repeat(7, 1fr) !important;
}
@media (min-width: 992px) {
  .cols-7-7-7 {
    grid-template-columns: repeat(7, 1fr) !important;
  }
}
@media (min-width: 1200px) {
  .cols-7-7-7 {
    grid-template-columns: repeat(7, 1fr) !important;
  }
}

.grid {
  display: grid;
}

.sm-grid {
  display: grid;
}
@media (min-width: 992px) {
  .sm-grid {
    display: unset;
  }
}

.sm-grid-lg-flex {
  display: grid;
}
@media (min-width: 992px) {
  .sm-grid-lg-flex {
    display: flex;
  }
}

.order-2 {
  order: 2;
}

.sm-order-first {
  order: -1;
}
@media (min-width: 992px) {
  .sm-order-first {
    order: 0;
  }
}

.col-span-all {
  grid-column: 1/-1;
}

input, textarea, select {
  width: 100%;
  padding: 0.5rem 1rem;
  display: block;
  color: var(--primary-800);
  font-weight: 300;
  background: var(--secondary-200);
  outline: none;
  font-family: var(--body-font);
  border: none;
  box-shadow: inset 0px 2px 4px 0px rgba(20, 36, 66, 0.1);
}
input::-moz-placeholder, textarea::-moz-placeholder, select::-moz-placeholder {
  color: var(--navy-300);
}
input::placeholder, textarea::placeholder, select::placeholder {
  color: var(--navy-300);
}
input:hover, input:focus, textarea:hover, textarea:focus, select:hover, select:focus {
  outline: 2px solid var(--secondary-500);
}
input.success, textarea.success, select.success {
  outline: none;
}
input.bg-white:hover, input.bg-white:focus, textarea.bg-white:hover, textarea.bg-white:focus, select.bg-white:hover, select.bg-white:focus {
  outline: 2px solid var(--secondary-500);
}

.input:has(.error) input, .input:has(.error) textarea {
  border: 2px solid var(--danger-900);
}

.error {
  color: var(--danger-900);
  text-transform: none;
  background-color: var(--danger-200);
  display: block;
  padding: var(--spacing-1) var(--spacing-2);
  border-radius: var(--spacing-1);
  margin-top: var(--spacing-2);
  font-size: var(--spacing-3);
}

.hint {
  font-size: var(--spacing-3);
  color: var(--navy-400);
  font-weight: 300;
  font-family: var(--body-font);
}

.input:has(.hidden) .error {
  display: none;
}

fieldset {
  border: none;
}

label {
  font-family: var(--header-font);
  display: block;
  font-family: var(--display-font);
  font-size: 1.25rem;
  line-height: 1.25;
  letter-spacing: -0.015rem;
}
@media (min-width: 992px) {
  label {
    font-size: 1.5rem;
    line-height: 1.22;
    letter-spacing: -0.02rem;
  }
}

.label-reset {
  letter-spacing: normal;
  text-transform: none;
  font-weight: normal;
  background: none !important;
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 1rem;
  line-height: 1.6;
}
@media (min-width: 992px) {
  .label-reset {
    font-size: 1.125rem;
    line-height: 1.6;
  }
}

input[type=range] {
  width: 100%;
  background: none;
  -moz-appearance: none;
       appearance: none;
  -webkit-appearance: none;
}
@media (min-width: 992px) {
  input[type=range] {
    margin-inline: auto;
    width: var(--width-66);
  }
}

input[type=range]::-webkit-slider-runnable-track {
  height: 0.5rem;
  background: var(--secondary-500);
  border-radius: 0.5rem;
}

input[type=range]::-webkit-slider-thumb {
  -webkit-appearance: none;
  height: 1rem;
  width: 1rem;
  background: var(--primary-800) !important;
  border-radius: 50%;
  margin-top: -0.25rem;
}

.radio_buttons input,
.checkbox input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
  width: 1px;
  height: 1px;
  margin: 0;
  border: 0;
  padding: 0;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  overflow: hidden;
}

.radio_buttons label:not(.radio-label-reset),
.checkbox label {
  border-radius: 0.25rem;
  padding: 0.25rem 1rem;
  max-width: -moz-fit-content;
  max-width: fit-content;
  text-transform: capitalize;
  letter-spacing: normal;
  color: var(--primary-800);
  font-weight: 300;
  background: var(--secondary-200);
  outline: none;
  font-family: var(--body-font);
  border: none;
  box-shadow: inset 0px 2px 4px 0px rgba(20, 36, 66, 0.1);
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 1rem;
  line-height: 1.6;
}
@media (min-width: 992px) {
  .radio_buttons label:not(.radio-label-reset),
  .checkbox label {
    font-size: 1.125rem;
    line-height: 1.6;
  }
}
.radio_buttons label:not(.radio-label-reset).lg-inset-shadow,
.checkbox label.lg-inset-shadow {
  box-shadow: 0 3.2px 3.2px 0 rgba(0, 0, 0, 0.25) inset;
}

.checkbox label::before {
  content: "o";
  padding-right: 0.5rem;
  font-size: 1rem;
}

.radio_buttons label:has(input:checked) {
  background: var(--primary-800);
  color: white;
}
.radio_buttons label:has(input:checked) * {
  color: white;
}

.age_radio_button:has(input:checked) label {
  background: var(--primary-800);
  color: white;
}
.age_radio_button:has(input:checked) label * {
  color: white;
}

.radio-input-reset label,
.radio-input-reset label:has(input:checked) {
  background: none;
  box-shadow: none;
}

.pet-age-radio-container .radio {
  max-width: 10rem;
}
.pet-age-radio-container .radio label:has(input:checked) {
  background: var(--primary);
}
@media (min-width: 992px) {
  .pet-age-radio-container .radio {
    max-width: 12rem;
  }
}

.checkbox label:has(input:checked) {
  background: var(--primary-800);
  color: white;
  position: relative;
}
.checkbox label:has(input:checked)::before {
  content: "✔";
  padding-right: 0.5rem;
  font-size: 1rem;
  color: white;
}
.checkbox label:has(input:checked) * {
  color: white;
}

input[type=checkbox] {
  width: auto;
}
input[type=checkbox]:hover, input[type=checkbox]:focus {
  outline: none;
}

.checkbox-reset label {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  cursor: pointer;
}
.checkbox-reset label::before {
  content: " ";
  background-color: var(--secondary-200);
  border: 0.05rem solid var(--primary-400);
  font-size: 0.75rem;
  color: var(--primary-500);
  display: inline-block;
  flex-shrink: 0;
  width: 1.1rem;
  aspect-ratio: 1/1;
}
.checkbox-reset label:has(input:checked)::before {
  content: "✔";
  text-align: center;
  padding-top: 0.1rem;
}

.nps-radio-buttons label {
  max-width: none !important;
  border-radius: var(--spacing-1) !important;
}

label[for=user_feedback_nps_10],
label[for=user_feedback_nps_9] {
  background: var(--green) !important;
}
label[for=user_feedback_nps_10]:hover,
label[for=user_feedback_nps_9]:hover {
  background: var(--green-700) !important;
}
label[for=user_feedback_nps_10]:has(input:checked),
label[for=user_feedback_nps_9]:has(input:checked) {
  background: white !important;
  border: 0.1rem solid var(--green) !important;
  color: var(--primary-800) !important;
}

label[for=user_feedback_nps_8],
label[for=user_feedback_nps_7] {
  background: var(--yellow) !important;
}
label[for=user_feedback_nps_8]:hover,
label[for=user_feedback_nps_7]:hover {
  background: var(--yellow-100) !important;
}
label[for=user_feedback_nps_8]:has(input:checked),
label[for=user_feedback_nps_7]:has(input:checked) {
  background: white !important;
  border: 0.1rem solid var(--yellow) !important;
  color: var(--primary-800) !important;
}

label[for=user_feedback_nps_6],
label[for=user_feedback_nps_5],
label[for=user_feedback_nps_4],
label[for=user_feedback_nps_3],
label[for=user_feedback_nps_2],
label[for=user_feedback_nps_1],
label[for=user_feedback_nps_0] {
  background: var(--rose) !important;
}
label[for=user_feedback_nps_6]:hover,
label[for=user_feedback_nps_5]:hover,
label[for=user_feedback_nps_4]:hover,
label[for=user_feedback_nps_3]:hover,
label[for=user_feedback_nps_2]:hover,
label[for=user_feedback_nps_1]:hover,
label[for=user_feedback_nps_0]:hover {
  background: var(--rose-900) !important;
}
label[for=user_feedback_nps_6]:has(input:checked),
label[for=user_feedback_nps_5]:has(input:checked),
label[for=user_feedback_nps_4]:has(input:checked),
label[for=user_feedback_nps_3]:has(input:checked),
label[for=user_feedback_nps_2]:has(input:checked),
label[for=user_feedback_nps_1]:has(input:checked),
label[for=user_feedback_nps_0]:has(input:checked) {
  background: white !important;
  border: 0.1rem solid var(--rose) !important;
  color: var(--primary-800) !important;
}

.custom-nps-error {
  display: block;
}

.ts-control, .ts-wrapper, .full .ts-control,
.ts-wrapper.single.input-active .ts-control {
  width: 100%;
  letter-spacing: normal;
  color: var(--primary-800);
  font-weight: 300;
  background: var(--secondary-200);
  outline: none;
  font-family: var(--body-font);
  border: none;
  box-shadow: inset 0px 2px 4px 0px rgba(20, 36, 66, 0.1);
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 1rem;
  line-height: 1.6;
}
@media (min-width: 992px) {
  .ts-control, .ts-wrapper, .full .ts-control,
  .ts-wrapper.single.input-active .ts-control {
    font-size: 1.125rem;
    line-height: 1.6;
  }
}

.ts-wrapper.plugin-remove_button:not(.rtl) .item .remove {
  border-left: none;
}

.ts-control input {
  letter-spacing: normal;
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 1rem;
  line-height: 1.6;
}
@media (min-width: 992px) {
  .ts-control input {
    font-size: 1.125rem;
    line-height: 1.6;
  }
}
.ts-control input:hover, .ts-control input:focus {
  outline: 2px solid var(--secondary-200);
}

.ts-dropdown {
  display: block;
  position: relative;
  top: 100%;
  left: 0;
  width: 100%;
  z-index: 10000;
  border-radius: 0;
  text-align: left;
  letter-spacing: normal;
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 1rem;
  line-height: 1.6;
}
@media (min-width: 992px) {
  .ts-dropdown {
    font-size: 1.125rem;
    line-height: 1.6;
  }
}

.ts-dropdown-content, .ts-dropdown-content .input-active {
  border-color: transparent;
  background-color: var(--secondary-100);
  color: var(--primary-900);
  -ms-overflow-style: none;
  scrollbar-width: none;
}
.ts-dropdown-content::-webkit-scrollbar, .ts-dropdown-content .input-active::-webkit-scrollbar {
  display: none;
}

.ts-dropdown .option :hover {
  background-color: var(--secondary-100);
}

.ts-dropdown [data-selectable] .highlight {
  background: var(--secondary-500);
}

.ts-dropdown {
  position: absolute;
}

.yellow-banner {
  max-width: 30ch;
  transform: rotate(-2deg);
  background-color: var(--warning);
  padding: 0.5rem 1rem;
  font-size: clamp(1.25rem, 2vw, 1.5rem);
  margin-top: 2rem;
}
@media (min-width: 992px) {
  .yellow-banner {
    max-width: 40ch;
    margin-top: 1rem;
  }
}

.green-banner {
  max-width: 30ch;
  transform: rotate(-2deg);
  background-color: var(--success);
  padding: 0.5rem 1rem;
  font-size: clamp(1.25rem, 2vw, 1.5rem);
}
@media (min-width: 992px) {
  .green-banner {
    max-width: 40ch;
    margin-top: 1rem;
  }
}

.speech-banner {
  max-width: 30ch;
  transform: rotate(-6deg);
  font-size: clamp(1.25rem, 2vw, 1.5rem);
  margin-bottom: 2rem;
  border: 5px solid var(--primary-800);
  border-radius: 45%;
}
@media (min-width: 992px) {
  .speech-banner {
    max-width: 40ch;
  }
}

.banner.stick-left {
  max-width: 30ch;
  transform: rotate(-2deg) translateY(-50%);
  text-align: left;
  top: 0;
  left: -0.5rem;
  z-index: 2;
  padding: 0.5rem 1rem;
  font-size: clamp(1.25rem, 2vw, 1.5rem);
  color: var(--primary);
}
.banner.stick-left.h4 {
  max-width: 50ch;
}
@media (min-width: 992px) {
  .banner.stick-left {
    max-width: 40ch;
  }
}
.banner.stick-left.sm {
  font-size: clamp(1rem, 2vw, 1rem);
}
.banner.stick-left.xs {
  font-size: clamp(0.85rem, 2vw, 0.85rem);
}

.extra-wonk {
  transform: rotate(-10deg) translateX(-5%) translateY(-50%) !important;
}

.medium-wonk {
  transform: rotate(-6deg) translateX(-10%) translateY(-50%) !important;
}

input[type=submit], button, .btn, .btn:visited {
  display: inline-block;
  background-color: var(--primary);
  color: var(--white);
  border-radius: var(--spacing-1);
  padding: var(--spacing-2) var(--spacing-3);
  box-shadow: var(--shadow-1);
  width: -moz-max-content;
  width: max-content;
  transition: all 0.3s;
  border: none;
  outline: none;
  cursor: pointer;
  font-size: 1.125rem;
  font-family: var(--body-font);
}
input[type=submit].p, button.p, .btn.p, .btn:visited.p {
  font-family: var(--body-font);
  text-transform: none;
  font-weight: normal;
  font-size: 1rem;
}
input[type=submit]:hover, button:hover, .btn:hover, .btn:visited:hover {
  background-color: var(--yellow);
  color: var(--primary-900) !important;
}
input[type=submit]:focus, button:focus, .btn:focus, .btn:visited:focus {
  box-shadow: var(--inset-shadow);
}
input[type=submit]:disabled, input[type=submit].disabled, button:disabled, button.disabled, .btn:disabled, .btn.disabled, .btn:visited:disabled, .btn:visited.disabled {
  background-color: var(--primary-100);
  color: var(--primary-300);
  box-shadow: none;
}
input[type=submit].outline, button.outline, .btn.outline, .btn:visited.outline {
  background-color: transparent;
  color: var(--primary-900);
  outline: 2px solid var(--primary);
  outline-offset: -2px;
}
input[type=submit].outline:hover, button.outline:hover, .btn.outline:hover, .btn:visited.outline:hover {
  background-color: var(--tan-500);
}
input[type=submit].outline:disabled, input[type=submit].outline.disabled, button.outline:disabled, button.outline.disabled, .btn.outline:disabled, .btn.outline.disabled, .btn:visited.outline:disabled, .btn:visited.outline.disabled {
  background-color: var(--primary-100);
  color: var(--primary-300);
  box-shadow: none;
}
input[type=submit].outline-white, button.outline-white, .btn.outline-white, .btn:visited.outline-white {
  background-color: transparent;
  color: white;
  outline: 2px solid white;
  outline-offset: -2px;
}
input[type=submit].outline-white:hover, button.outline-white:hover, .btn.outline-white:hover, .btn:visited.outline-white:hover {
  background-color: rgba(255, 255, 255, 0.1);
}
input[type=submit].secondary, button.secondary, .btn.secondary, .btn:visited.secondary {
  background-color: var(--secondary);
  color: var(--primary-900);
}
input[type=submit].secondary:hover, button.secondary:hover, .btn.secondary:hover, .btn:visited.secondary:hover {
  background-color: var(--yellow);
}
input[type=submit].secondary:disabled, input[type=submit].secondary.disabled, button.secondary:disabled, button.secondary.disabled, .btn.secondary:disabled, .btn.secondary.disabled, .btn:visited.secondary:disabled, .btn:visited.secondary.disabled {
  background-color: var(--primary-100);
  color: var(--primary-300);
  box-shadow: none;
}
input[type=submit].secondary-v2, button.secondary-v2, .btn.secondary-v2, .btn:visited.secondary-v2 {
  background-color: var(--secondary-200);
  color: var(--secondary-700);
  border: 1px solid var(--secondary-700);
  border-radius: var(--spacing-2);
}
input[type=submit].secondary-v2:hover, button.secondary-v2:hover, .btn.secondary-v2:hover, .btn:visited.secondary-v2:hover {
  background-color: var(--secondary-500);
  color: var(--navy);
}
input[type=submit].primary-light, button.primary-light, .btn.primary-light, .btn:visited.primary-light {
  background-color: var(--primary-600);
  color: var(--tan-200);
}
input[type=submit].primary-light:hover, button.primary-light:hover, .btn.primary-light:hover, .btn:visited.primary-light:hover {
  background-color: var(--yellow);
}
input[type=submit].primary-light:disabled, input[type=submit].primary-light.disabled, button.primary-light:disabled, button.primary-light.disabled, .btn.primary-light:disabled, .btn.primary-light.disabled, .btn:visited.primary-light:disabled, .btn:visited.primary-light.disabled {
  background-color: var(--primary-100);
  color: var(--primary-300);
  box-shadow: none;
}
input[type=submit].success, button.success, .btn.success, .btn:visited.success {
  background-color: var(--success);
  color: var(--primary-900);
}
input[type=submit].success:hover, button.success:hover, .btn.success:hover, .btn:visited.success:hover {
  background-color: var(--yellow);
}
input[type=submit].success:disabled, input[type=submit].success.disabled, button.success:disabled, button.success.disabled, .btn.success:disabled, .btn.success.disabled, .btn:visited.success:disabled, .btn:visited.success.disabled {
  background-color: var(--primary-100);
  color: var(--primary-300);
  box-shadow: none;
}
input[type=submit].warning, button.warning, .btn.warning, .btn:visited.warning {
  background-color: var(--warning);
  color: var(--primary-900);
}
input[type=submit].warning:hover, button.warning:hover, .btn.warning:hover, .btn:visited.warning:hover {
  background-color: var(--yellow-300);
}
input[type=submit].warning:disabled, input[type=submit].warning.disabled, button.warning:disabled, button.warning.disabled, .btn.warning:disabled, .btn.warning.disabled, .btn:visited.warning:disabled, .btn:visited.warning.disabled {
  background-color: var(--primary-100);
  color: var(--primary-300);
  box-shadow: none;
}
input[type=submit].danger, button.danger, .btn.danger, .btn:visited.danger {
  background-color: var(--danger-900);
  color: var(--white);
}
input[type=submit].danger:hover, button.danger:hover, .btn.danger:hover, .btn:visited.danger:hover {
  background-color: var(--yellow);
  color: var(--primary-900);
}
input[type=submit].sm, button.sm, .btn.sm, .btn:visited.sm {
  padding: var(--spacing-1) var(--spacing-2);
  font-size: 1rem;
}
@media (min-width: 992px) {
  input[type=submit].sm, button.sm, .btn.sm, .btn:visited.sm {
    padding: var(--spacing-1) var(--spacing-3);
  }
}
@media (min-width: 992px) {
  input[type=submit], button, .btn, .btn:visited {
    padding: var(--spacing-2) var(--spacing-4);
    font-size: 1.25rem;
  }
}
input[type=submit].lg, button.lg, .btn.lg, .btn:visited.lg {
  padding: var(--spacing-3) var(--spacing-4);
  border-radius: var(--spacing-2);
}
@media (min-width: 992px) {
  input[type=submit].lg, button.lg, .btn.lg, .btn:visited.lg {
    padding: var(--spacing-3) var(--spacing-4);
  }
}
input[type=submit].lg-md, button.lg-md, .btn.lg-md, .btn:visited.lg-md {
  padding: var(--spacing-2) var(--spacing-4);
}
@media (min-width: 992px) {
  input[type=submit].lg-md, button.lg-md, .btn.lg-md, .btn:visited.lg-md {
    padding: var(--spacing-2) var(--spacing-4);
  }
}
@media (min-width: 992px) {
  input[type=submit].md-lg, button.md-lg, .btn.md-lg, .btn:visited.md-lg {
    padding: var(--spacing-3) var(--spacing-4);
  }
}
input[type=submit].style-2, button.style-2, .btn.style-2, .btn:visited.style-2 {
  background-color: var(--secondary);
  color: var(--navy);
  width: 100%;
  text-transform: none;
  padding: var(--spacing-3) var(--spacing-2);
}
input[type=submit].style-2.blue, button.style-2.blue, .btn.style-2.blue, .btn:visited.style-2.blue {
  background-color: var(--blue);
}
input[type=submit].style-2.green, button.style-2.green, .btn.style-2.green, .btn:visited.style-2.green {
  background-color: var(--green-300);
}
input[type=submit].style-2:hover, button.style-2:hover, .btn.style-2:hover, .btn:visited.style-2:hover {
  scale: 1.05;
  background-color: var(--yellow);
}
input[type=submit].style-2:disabled, input[type=submit].style-2.disabled, button.style-2:disabled, button.style-2.disabled, .btn.style-2:disabled, .btn.style-2.disabled, .btn:visited.style-2:disabled, .btn:visited.style-2.disabled {
  background-color: var(--primary-100);
  color: var(--primary-300) !important;
}
input[type=submit].style-2:disabled:hover, input[type=submit].style-2.disabled:hover, button.style-2:disabled:hover, button.style-2.disabled:hover, .btn.style-2:disabled:hover, .btn.style-2.disabled:hover, .btn:visited.style-2:disabled:hover, .btn:visited.style-2.disabled:hover {
  scale: 1;
}
@media (min-width: 992px) {
  input[type=submit].style-2, button.style-2, .btn.style-2, .btn:visited.style-2 {
    padding: var(--spacing-4) var(--spacing-3);
  }
}

.btn-stepper {
  background-color: var(--primary);
  color: var(--white);
  text-align: center;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  line-height: 1.75 !important;
  cursor: pointer;
}
.btn-stepper:hover {
  background-color: var(--yellow);
  color: var(--primary-900);
}
@media (min-width: 992px) {
  .btn-stepper {
    width: 40px;
    height: 40px;
  }
}

.btn-pill {
  display: inline-block;
  background-color: var(--primary);
  color: var(--white);
  border-radius: var(--spacing-6);
  padding: 0.2rem var(--spacing-1);
  box-shadow: var(--shadow-1);
  transition: all 0.3s;
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.9375rem;
  line-height: 1.6;
}
@media (min-width: 992px) {
  .btn-pill {
    font-size: 1rem;
    line-height: 1.6;
  }
}
.btn-pill:hover {
  background-color: var(--yellow);
  color: var(--primary-900);
}
.btn-pill.danger {
  background-color: var(--danger-900);
  color: var(--white);
}
.btn-pill.danger:hover {
  background-color: var(--yellow);
  color: var(--primary-900);
}

.btn-spacing {
  padding: var(--spacing-1) var(--spacing-3);
}
@media (min-width: 992px) {
  .btn-spacing {
    padding: var(--spacing-2) var(--spacing-4);
  }
}

.btn-share {
  letter-spacing: normal;
  text-transform: none;
  font-weight: normal;
  display: flex;
  background-color: var(--primary-900);
  color: var(--white);
  align-items: center;
  gap: var(--spacing-1);
  border-radius: var(--spacing-4);
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 1rem;
  line-height: 1.6;
}
@media (min-width: 992px) {
  .btn-share {
    font-size: 1.125rem;
    line-height: 1.6;
  }
}
.btn-share:hover {
  background-color: var(--yellow);
}
.btn-share.sm {
  letter-spacing: normal;
  text-transform: none;
  font-weight: normal;
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.9375rem;
  line-height: 1.6;
}
@media (min-width: 992px) {
  .btn-share.sm {
    font-size: 1rem;
    line-height: 1.6;
  }
}

hr {
  border-style: solid;
}

.hr {
  background: url(//www.tuggs.uk/assets/graphic-elements/hr-3d73b4097f168bcb642ec42a565a539aabd232f8896fd5de8304b5bb2594f570.svg) repeat-x;
  background-size: contain;
  display: block;
  border: 0;
  height: 0.5rem;
}

.hr.white {
  background: url(//www.tuggs.uk/assets/graphic-elements/hr-white-34299d01d8fc7af948c88935edc89749bee920dd74511155043196789e90d5a6.svg) repeat-x;
}

.hr.navy-300 {
  background: url(//www.tuggs.uk/assets/graphic-elements/hr-navy-300-ee1726289a06c3439ffdb611352f72094470f22d5ee5b2c70b0b15d9cef06a0e.svg) repeat-x;
}

.hr.tan-400 {
  background: url(//www.tuggs.uk/assets/graphic-elements/hr-tan-400-6a00d523c49cd8ebfa289352ec964cba6250d527cbaaf0e19d93d4e51bda308b.svg) repeat-x;
}

.hr-light {
  border-color: var(--primary-100);
}

.material-symbols-outlined {
  font-variation-settings: "FILL" 0, "wght" 400, "GRAD" 0, "opsz" 20;
  font-size: inherit;
}

img.xs-icon {
  width: 50px;
}

img.xxs-icon {
  width: 30px;
}

.sm-icon {
  font-size: 0.75rem;
}

img.sm-icon {
  width: 100px;
}

.md-icon {
  font-size: 1.25rem;
}

img.md-icon {
  width: 150px;
}

.lg-icon {
  font-size: 1.75rem;
}

img.lg-icon {
  width: 200px;
}

.inline-icon {
  display: inline-block;
  width: 16px;
  height: 16px;
  vertical-align: middle;
  margin-right: 0.1rem;
  opacity: 0.8;
}

.video-control-icon {
  position: absolute;
  top: 0;
  right: 0;
  transform: translate(-50%, 50%);
  font-size: 2rem;
  background-color: var(--primary-800);
  padding: var(--spacing-1);
  border-radius: 50%;
}

img {
  display: block;
  -o-object-fit: cover;
     object-fit: cover;
  image-orientation: from-image;
}

.img-square {
  aspect-ratio: 1;
}

@media (min-width: 992px) {
  .lg-img-square {
    aspect-ratio: 1;
    width: 100%;
  }
}

.img-circle {
  aspect-ratio: 1;
  border-radius: 50%;
}

.img-rectangle {
  aspect-ratio: 2;
}

.img-hero {
  aspect-ratio: 1.5;
}

.avatar {
  aspect-ratio: 1;
  border-radius: 50%;
  width: 5rem;
  margin: 0;
}

.img-contain {
  -o-object-fit: contain;
     object-fit: contain;
}

.aspect-16-9 {
  aspect-ratio: 16/9;
}

.aspect-12-8 {
  aspect-ratio: 12/8;
}

.aspect-6-5 {
  aspect-ratio: 6/5;
}

.glass-pill {
  border: 1px solid currentColor;
  border-radius: var(--spacing-8);
  padding-block: var(--spacing-1);
  padding-inline: var(--spacing-3);
  width: -moz-fit-content;
  width: fit-content;
  font-size: 0.75rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  white-space: nowrap;
  background: linear-gradient(160deg, rgba(255, 255, 255, 0.18) 0%, rgba(255, 255, 255, 0.04) 50%, rgba(0, 0, 0, 0.08) 100%);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25), inset 0 -1px 0 rgba(0, 0, 0, 0.1);
}

.status-pill {
  width: -moz-fit-content;
  width: fit-content;
  border-radius: var(--spacing-8);
  padding-inline: var(--spacing-2);
  padding-block: 0.1rem;
}
@media (min-width: 992px) {
  .status-pill {
    padding-block: var(--spacing-1);
    padding-inline: var(--spacing-3);
  }
}
.status-pill.success {
  background-color: var(--success-50);
  border: 1px solid var(--success-900);
}
.status-pill.pending {
  background-color: var(--warning-50);
  border: 1px solid var(--warning-900);
}
.status-pill.inactive {
  background-color: var(--primary-50);
  border: 1px solid var(--primary-900);
}

.scrollbar-light {
  scrollbar-width: thin;
  scrollbar-color: rgba(255, 255, 255, 0.35) transparent;
}
.scrollbar-light::-webkit-scrollbar {
  width: 4px;
  height: 4px;
}
.scrollbar-light::-webkit-scrollbar-track {
  background: transparent;
}
.scrollbar-light::-webkit-scrollbar-thumb {
  border-radius: 999px;
}
.scrollbar-light::-webkit-scrollbar-thumb {
  background: rgba(255, 255, 255, 0.35);
}
.scrollbar-light::-webkit-scrollbar-thumb:hover {
  background: rgba(255, 255, 255, 0.6);
}

.scrollbar-dark {
  scrollbar-width: thin;
  scrollbar-color: rgba(0, 0, 0, 0.2) transparent;
}
.scrollbar-dark::-webkit-scrollbar {
  width: 4px;
  height: 4px;
}
.scrollbar-dark::-webkit-scrollbar-track {
  background: transparent;
}
.scrollbar-dark::-webkit-scrollbar-thumb {
  border-radius: 999px;
}
.scrollbar-dark::-webkit-scrollbar-thumb {
  background: rgba(0, 0, 0, 0.2);
}
.scrollbar-dark::-webkit-scrollbar-thumb:hover {
  background: rgba(0, 0, 0, 0.35);
}

progress[value] {
  color: var(--success); /* the progress color */
  background: white; /* the background color */
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  border: none;
  border-radius: 10rem;
}

progress[value]::-webkit-progress-bar {
  border-radius: 10rem;
  background: white;
}

progress[value]::-webkit-progress-value {
  border-radius: 10rem;
  background: var(--success);
}

progress[value]::-moz-progress-bar {
  border-radius: 10rem;
  background: var(--success);
}

progress[value].tan-200 {
  border: 4px solid var(--tan-200);
}

progress[value]::-webkit-progress-bar.tan-200 {
  border-radius: 10rem;
  background: white;
}

h1, .h1 {
  color: var(--primary);
  font-weight: 400 !important;
  font-family: var(--display-font);
  font-weight: 600;
  color: var(--primary-800);
  font-size: 2.75rem;
  line-height: 1.2;
}
@media (min-width: 992px) {
  h1, .h1 {
    font-size: 3.5rem;
    line-height: 1.15;
  }
}

h2, .h2 {
  color: var(--primary);
  font-weight: 300 !important;
  font-family: var(--display-font);
  font-size: 2rem;
  line-height: 1.18;
  letter-spacing: -0.05rem;
}
@media (min-width: 992px) {
  h2, .h2 {
    font-size: 2.5rem;
    line-height: 1.15;
    letter-spacing: -0.06rem;
  }
}

h3, .h3 {
  color: var(--primary-700);
  font-weight: 300;
  font-family: var(--display-font);
  font-size: 1.5rem;
  line-height: 1.2;
  letter-spacing: -0.03rem;
}
@media (min-width: 992px) {
  h3, .h3 {
    font-size: 2rem;
    line-height: 1.18;
    letter-spacing: -0.04rem;
  }
}

h4, .h4 {
  color: var(--primary-600);
  font-weight: 300;
  font-family: var(--display-font);
  font-size: 1.25rem;
  line-height: 1.25;
  letter-spacing: -0.015rem;
}
@media (min-width: 992px) {
  h4, .h4 {
    font-size: 1.5rem;
    line-height: 1.22;
    letter-spacing: -0.02rem;
  }
}

h5, .h5 {
  color: var(--primary-600);
  font-weight: 300;
  font-family: var(--display-font);
  font-size: 1rem;
  line-height: 1.3;
  letter-spacing: 0;
}
@media (min-width: 992px) {
  h5, .h5 {
    font-size: 1.25rem;
    line-height: 1.25;
    letter-spacing: -0.01rem;
  }
}

h6, .h6 {
  color: var(--primary-600);
  font-weight: 300;
  font-family: var(--display-font);
  font-size: 0.875rem;
  line-height: 1.35;
  letter-spacing: 0;
}
@media (min-width: 992px) {
  h6, .h6 {
    font-size: 1rem;
    line-height: 1.3;
    letter-spacing: 0;
  }
}

p, .p, li {
  letter-spacing: initial;
  font-weight: initial;
  color: var(--primary-700);
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 1rem;
  line-height: 1.6;
}
@media (min-width: 992px) {
  p, .p, li {
    font-size: 1.125rem;
    line-height: 1.6;
  }
}

.paragraph-2 {
  color: var(--primary);
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.9375rem;
  line-height: 1.6;
}
@media (min-width: 992px) {
  .paragraph-2 {
    font-size: 1rem;
    line-height: 1.6;
  }
}

.paragraph-3 {
  color: var(--primary);
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.875rem;
  line-height: 1.6;
}
@media (min-width: 992px) {
  .paragraph-3 {
    font-size: 0.9375rem;
    line-height: 1.6;
  }
}

.paragraph-4 {
  color: var(--primary);
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.625rem;
  line-height: 1.6;
}
@media (min-width: 992px) {
  .paragraph-4 {
    font-size: 0.75rem;
    line-height: 1.6;
  }
}

.paragraph-2-1 {
  color: var(--primary);
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.9375rem;
  line-height: 1.6;
}
@media (min-width: 992px) {
  .paragraph-2-1 {
    font-size: 1rem;
    line-height: 1.6;
  }
}
@media (min-width: 992px) {
  .paragraph-2-1 {
    font-family: var(--body-font);
    font-weight: 300;
    font-size: 1rem;
    line-height: 1.6;
  }
}
@media (min-width: 992px) and (min-width: 992px) {
  .paragraph-2-1 {
    font-size: 1.125rem;
    line-height: 1.6;
  }
}

.paragraph-3-1 {
  color: var(--primary);
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.875rem;
  line-height: 1.6;
}
@media (min-width: 992px) {
  .paragraph-3-1 {
    font-size: 0.9375rem;
    line-height: 1.6;
  }
}
@media (min-width: 992px) {
  .paragraph-3-1 {
    font-family: var(--body-font);
    font-weight: 300;
    font-size: 1rem;
    line-height: 1.6;
  }
}
@media (min-width: 992px) and (min-width: 992px) {
  .paragraph-3-1 {
    font-size: 1.125rem;
    line-height: 1.6;
  }
}

.paragraph-3-2 {
  color: var(--primary);
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.875rem;
  line-height: 1.6;
}
@media (min-width: 992px) {
  .paragraph-3-2 {
    font-size: 0.9375rem;
    line-height: 1.6;
  }
}
@media (min-width: 992px) {
  .paragraph-3-2 {
    font-family: var(--body-font);
    font-weight: 300;
    font-size: 0.9375rem;
    line-height: 1.6;
  }
}
@media (min-width: 992px) and (min-width: 992px) {
  .paragraph-3-2 {
    font-size: 1rem;
    line-height: 1.6;
  }
}

.accent {
  font-family: var(--accent-font);
  font-weight: bold;
}

.xl-text {
  font-size: 1.75rem;
  line-height: 1.25;
}
@media (min-width: 992px) {
  .xl-text {
    font-size: 2.5rem;
  }
}

.paragraph-xl {
  color: var(--primary);
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 1.125rem;
  line-height: 1.55;
}
@media (min-width: 992px) {
  .paragraph-xl {
    font-size: 1.25rem;
    line-height: 1.55;
  }
}
@media (min-width: 992px) {
  .paragraph-xl {
    font-family: var(--body-font);
    font-weight: 300;
    font-size: 1.25rem;
    line-height: 1.5;
  }
}
@media (min-width: 992px) and (min-width: 992px) {
  .paragraph-xl {
    font-size: 1.5rem;
    line-height: 1.5;
  }
}

.text-italic {
  font-style: italic;
}

a {
  color: var(--primary);
  font-family: var(--body-font);
}
a:visited {
  color: var(--primary-800);
}

b, strong {
  font-weight: 900;
}

.text-bold {
  font-weight: 900;
}

.text-upper {
  text-transform: uppercase;
}

.text-lower {
  text-transform: lowercase;
}

.text-no-transform {
  text-transform: none;
}

.graphic-underline {
  position: relative;
  display: inline-block;
  color: var(--primary-800) !important;
}
.graphic-underline::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  transform: translateY(50%);
  height: 12px;
  background: url(//www.tuggs.uk/graphic-elements/secondary-500-underline.svg) repeat-x bottom;
  background-size: auto 100%;
}
.graphic-underline.purple-300::after {
  background: url(//www.tuggs.uk/graphic-elements/purple-500-underline.svg) repeat-x bottom;
}
.graphic-underline.red-300::after {
  background: url(//www.tuggs.uk/graphic-elements/red-500-underline.svg) repeat-x bottom;
}
.graphic-underline.green-300::after {
  background: url(//www.tuggs.uk/assets/graphic-elements/green-500-underline-e2b439855721f9adcccf4a16c7bf1eac15eb6f44d1147fafd5c3f470685fc6dc.svg) repeat-x bottom;
}
.graphic-underline.yellow-300::after {
  background: url(//www.tuggs.uk/graphic-elements/yellow-500-underline.svg) repeat-x bottom;
}

.wrapper {
  width: 100%;
  display: flex;
  flex-direction: column;
}
.wrapper > * {
  width: 100%;
}
@media (min-width: 992px) {
  .wrapper > * {
    width: 50%;
  }
}
.wrapper.multi-column {
  flex-wrap: wrap;
  justify-content: space-around;
}
@media (min-width: 992px) {
  .wrapper.multi-column {
    flex-direction: row;
  }
  .wrapper.multi-column > * {
    width: auto;
  }
}
.wrapper.two-column {
  flex-direction: column;
}
.wrapper.two-column.column-reverse {
  flex-direction: column-reverse;
}
@media (min-width: 992px) {
  .wrapper.two-column.column-reverse {
    flex-direction: row;
  }
}
@media (min-width: 992px) {
  .wrapper.two-column {
    flex-direction: row;
    align-items: flex-start;
    text-align: left;
  }
}
@media (min-width: 992px) {
  .wrapper.even > :first-child, .wrapper.even > :last-child {
    flex: 1;
  }
}
@media (min-width: 992px) {
  .wrapper.constrained-left > :first-child {
    flex: 1;
  }
}
@media (min-width: 992px) {
  .wrapper.constrained-left > :last-child {
    flex: 2;
  }
}
@media (min-width: 992px) {
  .wrapper.constrained-right > :first-child {
    flex: 2.25;
  }
}
@media (min-width: 992px) {
  .wrapper.constrained-right > :last-child {
    flex: 0.75;
  }
}

.frame {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  background-color: white;
}
.frame.grey {
  border: 5px solid var(--primary-200);
}

.checkout--recipes-dialog .checkout--recipes-dialog-container {
  width: 100%;
}
@media (min-width: 992px) {
  .checkout--recipes-dialog .checkout--recipes-dialog-container {
    width: 75%;
  }
}
.checkout--recipes-dialog img {
  border-radius: 0.25rem;
  width: 100% !important;
}
@media (min-width: 768px) {
  .checkout--recipes-dialog img {
    width: 60% !important;
  }
}
@media (min-width: 992px) {
  .checkout--recipes-dialog img {
    width: 40% !important;
  }
}
.checkout--recipes-dialog p {
  text-align: center;
}
@media (min-width: 992px) {
  .checkout--recipes-dialog p {
    text-align: left;
  }
}
.checkout--recipes-dialog h2, .checkout--recipes-dialog h3, .checkout--recipes-dialog h4 {
  font-weight: bold !important;
}
.checkout--recipes-dialog details {
  width: 100%;
}
.checkout--recipes-dialog details p {
  padding: var(--spacing-2) !important;
}

.quiz-layout {
  background-color: var(--tan-100);
  min-height: 100dvh;
}
.quiz-layout .intercom-launcher,
.quiz-layout .intercom-lightweight-app-launcher,
.quiz-layout .intercom-lightweight-app,
.quiz-layout .intercom-namespace .intercom-launcher-frame,
.quiz-layout #intercom-container {
  display: none !important;
}

.quiz-header {
  background-color: var(--primary-800);
  padding: var(--spacing-3);
}
@media (min-width: 992px) {
  .quiz-header {
    padding: var(--spacing-4);
  }
}
.quiz-header:has(.quiz-progress) {
  padding-bottom: 0;
}
.quiz-header__row {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: var(--spacing-3);
  max-width: 64rem;
  margin-inline: auto;
}
.quiz-header__brand {
  display: inline-flex;
  align-items: center;
  justify-self: center;
  text-decoration: none;
}
.quiz-header__back, .quiz-header__back-placeholder {
  justify-self: start;
  min-height: var(--spacing-5);
  display: inline-flex;
  align-items: center;
}
.quiz-header__back {
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.875rem;
  line-height: 1.6;
  color: var(--primary-300);
  text-decoration: none;
  gap: var(--spacing-1);
  padding: var(--spacing-1) var(--spacing-2);
  border-radius: 999px;
  transition: color 0.15s ease, background-color 0.15s ease;
}
@media (min-width: 992px) {
  .quiz-header__back {
    font-size: 0.9375rem;
    line-height: 1.6;
  }
}
@media (hover: hover) {
  .quiz-header__back:hover {
    color: var(--white);
    background-color: var(--primary-700);
  }
}
.quiz-header__step, .quiz-header__step-placeholder {
  justify-self: end;
}
.quiz-header__wordmark {
  display: block;
  height: 32px;
  width: auto;
}
@media (min-width: 992px) {
  .quiz-header__wordmark {
    height: 40px;
  }
}
.quiz-header__step {
  margin: 0;
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.875rem;
  line-height: 1.6;
  color: var(--primary-300);
  white-space: nowrap;
}
@media (min-width: 992px) {
  .quiz-header__step {
    font-size: 0.9375rem;
    line-height: 1.6;
  }
}

.quiz-step {
  display: flex;
  flex-direction: column;
  padding: var(--spacing-5) var(--spacing-4) calc(var(--spacing-9) + env(safe-area-inset-bottom));
}
@media (min-width: 992px) {
  .quiz-step {
    padding: var(--spacing-7) var(--spacing-4) var(--spacing-7);
  }
}
.quiz-step__header {
  text-align: center;
  margin-block: var(--spacing-4) var(--spacing-6);
}
@media (min-width: 992px) {
  .quiz-step__header {
    margin-block: var(--spacing-5) var(--spacing-5);
  }
}
.quiz-step__title {
  font-family: var(--display-font);
  font-size: 2rem;
  line-height: 1.18;
  letter-spacing: -0.05rem;
  color: var(--primary-800);
  font-weight: 400;
  margin: 0 0 var(--spacing-2);
}
@media (min-width: 992px) {
  .quiz-step__title {
    font-size: 2.5rem;
    line-height: 1.15;
    letter-spacing: -0.06rem;
  }
}
.quiz-step__sub {
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 1rem;
  line-height: 1.6;
  color: var(--primary-500);
  margin: 0;
}
@media (min-width: 992px) {
  .quiz-step__sub {
    font-size: 1.125rem;
    line-height: 1.6;
  }
}
.quiz-step__form {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  max-width: 40rem;
  margin-inline: auto;
  padding-bottom: var(--spacing-5);
}
@media (min-width: 992px) {
  .quiz-step__form {
    padding-bottom: var(--spacing-7);
  }
}

.quiz-step:has(.quiz-step__form :focus) .quiz-step-footer {
  transform: translateY(120%);
  pointer-events: none;
}
@media (min-width: 992px) {
  .quiz-step:has(.quiz-step__form :focus) .quiz-step-footer {
    transform: none;
    pointer-events: auto;
  }
}

.quiz-step-footer {
  position: fixed;
  inset: auto 0 0 0;
  transition: transform 0.2s ease;
  z-index: 10;
  display: flex;
  justify-content: center;
  padding: var(--spacing-3) var(--spacing-4) calc(var(--spacing-5) + env(safe-area-inset-bottom));
  background-color: var(--tan-100);
}
@media (min-width: 992px) {
  .quiz-step-footer {
    position: static;
    padding: var(--spacing-7) var(--spacing-4) var(--spacing-5);
  }
}
.quiz-step-footer::before {
  content: "";
  position: absolute;
  inset: auto 0 100% 0;
  height: var(--spacing-4);
  background: linear-gradient(to top, var(--tan-100), transparent);
  pointer-events: none;
}
@media (min-width: 992px) {
  .quiz-step-footer::before {
    display: none;
  }
}
.quiz-step-footer__cta {
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.9375rem;
  line-height: 1.6;
  font-weight: 600;
  width: 100%;
  max-width: 28rem;
  min-height: 52px;
  padding: var(--spacing-25) var(--spacing-4);
  border: none;
  border-radius: 999px;
  background-color: var(--green-300);
  color: var(--primary-800);
  cursor: pointer;
  transition: background-color 0.2s ease, opacity 0.2s ease, transform 0.2s ease;
}
@media (min-width: 992px) {
  .quiz-step-footer__cta {
    font-size: 1rem;
    line-height: 1.6;
  }
}
@media (hover: hover) {
  .quiz-step-footer__cta:not(:disabled):hover {
    transform: translateY(-1px);
    box-shadow: var(--shadow);
  }
}
.quiz-step-footer__cta:disabled {
  background-color: var(--tan-200);
  color: var(--primary-300);
  cursor: not-allowed;
}

.quiz-progress {
  padding: var(--spacing-25) var(--spacing-4) var(--spacing-4);
}
@media (min-width: 992px) {
  .quiz-progress {
    padding: var(--spacing-25) var(--spacing-5) var(--spacing-4);
  }
}
.quiz-progress__pips {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  gap: var(--spacing-1);
  align-items: center;
  justify-content: center;
  max-width: 32rem;
  margin-inline: auto;
}
.quiz-progress__pip {
  height: 3px;
  flex: 1;
  max-width: 40px;
  border-radius: 999px;
  background-color: var(--primary-500);
  transition: background-color 0.3s ease, flex 0.3s ease;
}
.quiz-progress__pip--completed {
  background-color: var(--primary-300);
}
.quiz-progress__pip--current {
  background-color: var(--green-300);
  flex: 2;
  max-width: 56px;
}
.quiz-progress__pip span {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.quiz-layout--loading {
  background-color: var(--primary-800);
}

.quiz-step--loading {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 70vh;
}

.quiz-loading {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: var(--spacing-5);
  padding: var(--spacing-7) var(--spacing-3);
  text-align: center;
}
@media (min-width: 992px) {
  .quiz-loading {
    padding: var(--spacing-7) var(--spacing-4);
  }
}
.quiz-loading__title {
  font-family: var(--display-font);
  font-size: 2rem;
  line-height: 1.18;
  letter-spacing: -0.05rem;
  font-weight: 400;
  color: var(--white);
  max-width: 28rem;
  margin: 0;
}
@media (min-width: 992px) {
  .quiz-loading__title {
    font-size: 2.5rem;
    line-height: 1.15;
    letter-spacing: -0.06rem;
  }
}
.quiz-loading__dots {
  display: inline-flex;
  gap: var(--spacing-2);
}
.quiz-loading__dot {
  width: var(--spacing-25);
  height: var(--spacing-25);
  border-radius: 50%;
  background-color: var(--yellow-500);
  animation: quiz-loading-bounce 1.1s ease-in-out infinite;
}
.quiz-loading__dot:nth-child(2) {
  animation-delay: 0.18s;
}
.quiz-loading__dot:nth-child(3) {
  animation-delay: 0.36s;
}
.quiz-loading__sr {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

@keyframes quiz-loading-bounce {
  0%, 80%, 100% {
    transform: translateY(0);
    opacity: 0.4;
  }
  40% {
    transform: translateY(-0.4rem);
    opacity: 1;
  }
}
.quiz-loading-benefits {
  list-style: none;
  margin: 0;
  padding: 0;
  width: 100%;
  max-width: 30rem;
  display: flex;
  flex-direction: column;
}

.quiz-loading-benefit {
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: center;
  gap: var(--spacing-4);
  padding: var(--spacing-4) 0;
  text-align: left;
  border-top: 1px solid var(--primary-600);
  opacity: 0;
  transform: translateY(0.75rem);
  animation: quiz-loading-benefit-in 0.6s ease forwards;
  animation-delay: var(--quiz-loading-benefit-delay, 0s);
}
.quiz-loading-benefit:last-child {
  border-bottom: 1px solid var(--primary-600);
}
.quiz-loading-benefit__pip {
  font-family: var(--display-font);
  font-size: 2rem;
  line-height: 1.18;
  letter-spacing: -0.05rem;
  font-weight: 500;
  line-height: 1;
  letter-spacing: 0.05em;
}
@media (min-width: 992px) {
  .quiz-loading-benefit__pip {
    font-size: 2.5rem;
    line-height: 1.15;
    letter-spacing: -0.06rem;
  }
}
.quiz-loading-benefit__copy {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-1);
}
.quiz-loading-benefit__title {
  font-family: var(--display-font);
  font-size: 1.25rem;
  line-height: 1.25;
  letter-spacing: -0.015rem;
  font-weight: 400;
  color: var(--white);
  margin: 0;
}
@media (min-width: 992px) {
  .quiz-loading-benefit__title {
    font-size: 1.5rem;
    line-height: 1.22;
    letter-spacing: -0.02rem;
  }
}
.quiz-loading-benefit__body {
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.9375rem;
  line-height: 1.6;
  color: var(--navy-200);
  margin: 0;
}
@media (min-width: 992px) {
  .quiz-loading-benefit__body {
    font-size: 1rem;
    line-height: 1.6;
  }
}
.quiz-loading-benefit--green .quiz-loading-benefit__pip {
  color: var(--green-300);
}
.quiz-loading-benefit--yellow .quiz-loading-benefit__pip {
  color: var(--yellow-500);
}
.quiz-loading-benefit--pink .quiz-loading-benefit__pip {
  color: var(--pink-500);
}

@keyframes quiz-loading-benefit-in {
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
.quiz-results-pillars {
  margin-inline: calc(-1 * var(--spacing-3));
  background-color: var(--white);
  padding-block: var(--spacing-5);
}
@media (min-width: 992px) {
  .quiz-results-pillars {
    margin-inline: 0;
    width: 100%;
  }
}
@media (min-width: 992px) {
  .quiz-results-pillars {
    padding-block: var(--spacing-7);
  }
}
.quiz-results-pillars__inner {
  padding-inline: var(--spacing-4);
  padding-inline: var(--spacing-2);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--spacing-5);
}
@media (min-width: 992px) {
  .quiz-results-pillars__inner {
    padding-inline: 0;
    width: 82%;
    margin-inline: auto;
  }
}
@media (min-width: 992px) {
  .quiz-results-pillars__inner {
    padding-inline: 0;
    gap: var(--spacing-6);
  }
}
.quiz-results-pillars__header {
  text-align: center;
  max-width: 36rem;
}
.quiz-results-pillars__eyebrow {
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.875rem;
  line-height: 1.6;
  font-weight: 700;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--primary-800);
  margin: 0 0 var(--spacing-2);
}
@media (min-width: 992px) {
  .quiz-results-pillars__eyebrow {
    font-size: 0.9375rem;
    line-height: 1.6;
  }
}
.quiz-results-pillars__title {
  font-family: var(--display-font);
  font-size: 2rem;
  line-height: 1.18;
  letter-spacing: -0.05rem;
  font-weight: 400;
  color: var(--primary-800);
  margin: 0;
}
@media (min-width: 992px) {
  .quiz-results-pillars__title {
    font-size: 2.5rem;
    line-height: 1.15;
    letter-spacing: -0.06rem;
  }
}
.quiz-results-pillars__diagram {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-template-areas: "tl   tr" "bowl bowl" "bl   br";
  -moz-column-gap: 0;
       column-gap: 0;
  row-gap: var(--spacing-3);
  width: 100%;
  max-width: 28rem;
  align-items: stretch;
}
@media (min-width: 992px) {
  .quiz-results-pillars__diagram {
    grid-template-columns: 1fr minmax(20rem, 26rem) 1fr;
    grid-template-rows: 1fr 1fr;
    grid-template-areas: "tl bowl tr" "bl bowl br";
    -moz-column-gap: var(--spacing-5);
         column-gap: var(--spacing-5);
    row-gap: var(--spacing-6);
    max-width: 64rem;
    align-items: center;
  }
}
.quiz-results-pillars__bowl {
  grid-area: bowl;
  display: flex;
  justify-content: center;
  align-items: center;
  opacity: 0;
  transform: scale(0.9);
  transition: opacity 0.6s ease, transform 0.7s cubic-bezier(0.34, 1.56, 0.64, 1);
}
.quiz-results-pillars__bowl.is-visible {
  opacity: 1;
  transform: scale(1);
}
.quiz-results-pillars__bowl-image {
  display: block;
  width: 100%;
  max-width: 18rem;
  height: auto;
  margin-inline: auto;
}
@media (min-width: 992px) {
  .quiz-results-pillars__bowl-image {
    max-width: 100%;
  }
}
.quiz-results-pillars__callout {
  margin: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: var(--spacing-2);
  padding-inline: var(--spacing-3);
  opacity: 0;
  transition: opacity 0.6s ease, transform 0.6s ease;
}
.quiz-results-pillars__callout.is-visible {
  opacity: 1;
  transform: translate(0, 0);
}
.quiz-results-pillars__callout--tl {
  grid-area: tl;
  transform: translate(-12px, -12px);
}
.quiz-results-pillars__callout--tr {
  grid-area: tr;
  transform: translate(12px, -12px);
}
.quiz-results-pillars__callout--bl {
  grid-area: bl;
  transform: translate(-12px, 12px);
}
.quiz-results-pillars__callout--br {
  grid-area: br;
  transform: translate(12px, 12px);
}
.quiz-results-pillars__callout--tr, .quiz-results-pillars__callout--br {
  border-left: 1px solid var(--primary-100);
}
@media (min-width: 992px) {
  .quiz-results-pillars__callout--tr, .quiz-results-pillars__callout--br {
    border-left: 0;
  }
}
.quiz-results-pillars__callout-title {
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.875rem;
  line-height: 1.6;
  font-weight: 700;
  color: var(--primary-800);
  margin: 0;
}
@media (min-width: 992px) {
  .quiz-results-pillars__callout-title {
    font-size: 0.9375rem;
    line-height: 1.6;
  }
}
@media (min-width: 992px) {
  .quiz-results-pillars__callout-title {
    font-family: var(--display-font);
    font-size: 1rem;
    line-height: 1.3;
    letter-spacing: 0;
    font-weight: 500;
  }
}
@media (min-width: 992px) and (min-width: 992px) {
  .quiz-results-pillars__callout-title {
    font-size: 1.25rem;
    line-height: 1.25;
    letter-spacing: -0.01rem;
  }
}
.quiz-results-pillars__callout-body {
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.625rem;
  line-height: 1.6;
  color: var(--primary-500);
  margin: 0;
}
@media (min-width: 992px) {
  .quiz-results-pillars__callout-body {
    font-size: 0.75rem;
    line-height: 1.6;
  }
}
@media (min-width: 992px) {
  .quiz-results-pillars__callout-body {
    font-family: var(--body-font);
    font-weight: 300;
    font-size: 0.875rem;
    line-height: 1.6;
  }
}
@media (min-width: 992px) and (min-width: 992px) {
  .quiz-results-pillars__callout-body {
    font-size: 0.9375rem;
    line-height: 1.6;
  }
}
.quiz-results-pillars__arrow {
  color: var(--pink-500);
}
.quiz-results-pillars__arrow path {
  stroke-dasharray: 220;
  stroke-dashoffset: 220;
  transition: stroke-dashoffset 0.6s ease 0.2s;
}
.quiz-results-pillars__arrow--straight {
  display: block;
  width: 1.25rem;
  height: 2.75rem;
}
@media (min-width: 992px) {
  .quiz-results-pillars__arrow--straight {
    display: none;
  }
}
.quiz-results-pillars__arrow--curve {
  display: none;
}
@media (min-width: 992px) {
  .quiz-results-pillars__arrow--curve {
    display: block;
    width: 4.5rem;
    height: 3.5rem;
  }
}
.quiz-results-pillars__callout.is-visible .quiz-results-pillars__arrow path {
  stroke-dashoffset: 0;
}
.quiz-results-pillars__callout--bl, .quiz-results-pillars__callout--br {
  flex-direction: column-reverse;
}
.quiz-results-pillars__callout--tl .quiz-results-pillars__arrow--straight {
  transform: rotate(-10deg);
}
.quiz-results-pillars__callout--tr .quiz-results-pillars__arrow--straight {
  transform: rotate(10deg);
}
.quiz-results-pillars__callout--bl .quiz-results-pillars__arrow--straight {
  transform: rotate(-170deg);
}
.quiz-results-pillars__callout--br .quiz-results-pillars__arrow--straight {
  transform: rotate(170deg);
}
@media (min-width: 992px) {
  .quiz-results-pillars__callout--tl {
    align-items: flex-end;
    text-align: right;
    flex-direction: column;
  }
  .quiz-results-pillars__callout--tr {
    align-items: flex-start;
    text-align: left;
    flex-direction: column;
  }
  .quiz-results-pillars__callout--tr .quiz-results-pillars__arrow--curve {
    transform: scaleX(-1);
  }
  .quiz-results-pillars__callout--bl {
    align-items: flex-end;
    text-align: right;
  }
  .quiz-results-pillars__callout--bl .quiz-results-pillars__arrow--curve {
    transform: scaleY(-1);
  }
  .quiz-results-pillars__callout--br {
    align-items: flex-start;
    text-align: left;
  }
  .quiz-results-pillars__callout--br .quiz-results-pillars__arrow--curve {
    transform: scale(-1, -1);
  }
}

.quiz-results-reviews {
  margin-inline: calc(-1 * var(--spacing-3));
  background-color: var(--tan-200);
  padding-block: var(--spacing-7);
}
@media (min-width: 992px) {
  .quiz-results-reviews {
    margin-inline: 0;
    width: 100%;
  }
}
@media (min-width: 992px) {
  .quiz-results-reviews {
    padding-block: var(--spacing-8);
  }
}
.quiz-results-reviews__inner {
  padding-inline: var(--spacing-4);
}
@media (min-width: 992px) {
  .quiz-results-reviews__inner {
    padding-inline: 0;
    width: 82%;
    margin-inline: auto;
  }
}
.quiz-results-reviews__header {
  margin-bottom: var(--spacing-4);
  text-align: center;
}
@media (min-width: 992px) {
  .quiz-results-reviews__header {
    margin-bottom: var(--spacing-5);
  }
}
.quiz-results-reviews__eyebrow {
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.875rem;
  line-height: 1.6;
  font-weight: 700;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--primary-500);
  margin: 0 0 var(--spacing-2);
}
@media (min-width: 992px) {
  .quiz-results-reviews__eyebrow {
    font-size: 0.9375rem;
    line-height: 1.6;
  }
}
.quiz-results-reviews__title {
  font-family: var(--display-font);
  font-size: 1.5rem;
  line-height: 1.2;
  letter-spacing: -0.03rem;
  font-weight: 400;
  color: var(--primary-800);
  margin: 0;
}
@media (min-width: 992px) {
  .quiz-results-reviews__title {
    font-size: 2rem;
    line-height: 1.18;
    letter-spacing: -0.04rem;
  }
}
.quiz-results-reviews__rail {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  gap: var(--spacing-3);
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
  margin-inline: calc(-1 * var(--spacing-4));
  padding-left: var(--spacing-5);
  padding-right: var(--spacing-4);
  scroll-padding-left: var(--spacing-5);
  padding-block: var(--spacing-1);
}
.quiz-results-reviews__rail::-webkit-scrollbar {
  display: none;
}
@media (min-width: 992px) {
  .quiz-results-reviews__rail {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--spacing-4);
    overflow: visible;
    margin-inline: 0;
    padding-inline: 0;
  }
}

.quiz-results-review {
  flex: 0 0 88%;
  scroll-snap-align: start;
  background-color: var(--tan-50);
  border-radius: var(--spacing-3);
  padding: var(--spacing-4);
  display: flex;
  flex-direction: column;
  gap: var(--spacing-3);
  position: relative;
  overflow: hidden;
}
.quiz-results-review::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 4px;
  background-color: var(--accent, var(--warning-500));
  transition: height 0.35s cubic-bezier(0.4, 0, 0.2, 1);
  z-index: 0;
}
.quiz-results-review > * {
  position: relative;
  z-index: 1;
}
@media (hover: hover) {
  .quiz-results-review:hover::after {
    height: 100%;
  }
  .quiz-results-review:hover .quiz-results-review__stars {
    color: var(--primary-800);
  }
}
@media (hover: none) {
  .quiz-results-review::after {
    transition: height 0.6s cubic-bezier(0.4, 0, 0.2, 1) 0.6s;
  }
  .quiz-results-review.is-visible::after {
    height: 100%;
  }
  .quiz-results-review.is-visible .quiz-results-review__stars {
    color: var(--primary-800);
  }
}
@media (min-width: 992px) {
  .quiz-results-review {
    flex: 1 1 0;
    padding: var(--spacing-5);
  }
}
.quiz-results-review--yellow {
  --accent: var(--warning-500);
}
.quiz-results-review--pink {
  --accent: var(--pink-500);
}
.quiz-results-review--blue {
  --accent: var(--blue-300);
}
.quiz-results-review__stars {
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.9375rem;
  line-height: 1.6;
  letter-spacing: 0.1em;
  color: var(--accent, var(--warning-500));
  line-height: 1;
}
@media (min-width: 992px) {
  .quiz-results-review__stars {
    font-size: 1rem;
    line-height: 1.6;
  }
}
.quiz-results-review__headline {
  font-family: var(--display-font);
  font-size: 1rem;
  line-height: 1.3;
  letter-spacing: 0;
  font-weight: 400;
  color: var(--primary-800);
  margin: 0;
}
@media (min-width: 992px) {
  .quiz-results-review__headline {
    font-size: 1.25rem;
    line-height: 1.25;
    letter-spacing: -0.01rem;
  }
}
.quiz-results-review__quote {
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.875rem;
  line-height: 1.6;
  font-style: italic;
  color: var(--primary-700);
  margin: 0;
}
@media (min-width: 992px) {
  .quiz-results-review__quote {
    font-size: 0.9375rem;
    line-height: 1.6;
  }
}
.quiz-results-review__attribution {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-1);
  margin-top: auto;
}
.quiz-results-review__name {
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.875rem;
  line-height: 1.6;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  color: var(--primary-800);
}
@media (min-width: 992px) {
  .quiz-results-review__name {
    font-size: 0.9375rem;
    line-height: 1.6;
  }
}
.quiz-results-review__dog {
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.875rem;
  line-height: 1.6;
  color: var(--primary-500);
}
@media (min-width: 992px) {
  .quiz-results-review__dog {
    font-size: 0.9375rem;
    line-height: 1.6;
  }
}

.quiz-results-plan {
  margin-inline: calc(-1 * var(--spacing-3));
  background-color: var(--primary-800);
  padding-block: var(--spacing-7);
}
@media (min-width: 992px) {
  .quiz-results-plan {
    margin-inline: 0;
    width: 100%;
  }
}
@media (min-width: 992px) {
  .quiz-results-plan {
    padding-block: var(--spacing-8);
  }
}
.quiz-results-plan__inner {
  padding-inline: var(--spacing-4);
}
@media (min-width: 992px) {
  .quiz-results-plan__inner {
    padding-inline: 0;
    width: 82%;
    margin-inline: auto;
  }
}
@media (min-width: 992px) {
  .quiz-results-plan__inner {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr);
    gap: var(--spacing-7);
    align-items: center;
  }
}
.quiz-results-plan__intro {
  text-align: center;
}
@media (min-width: 992px) {
  .quiz-results-plan__intro {
    text-align: left;
  }
}
.quiz-results-plan__eyebrow {
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.875rem;
  line-height: 1.6;
  font-weight: 700;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--warning-500);
  margin: 0 0 var(--spacing-2);
}
@media (min-width: 992px) {
  .quiz-results-plan__eyebrow {
    font-size: 0.9375rem;
    line-height: 1.6;
  }
}
.quiz-results-plan__title {
  font-family: var(--display-font);
  font-size: 2rem;
  line-height: 1.18;
  letter-spacing: -0.05rem;
  font-weight: 300;
  color: var(--white);
  margin: 0 0 var(--spacing-3);
}
@media (min-width: 992px) {
  .quiz-results-plan__title {
    font-size: 2.5rem;
    line-height: 1.15;
    letter-spacing: -0.06rem;
  }
}
.quiz-results-plan__body {
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.9375rem;
  line-height: 1.6;
  color: var(--navy-200);
  margin: 0 0 var(--spacing-5);
}
@media (min-width: 992px) {
  .quiz-results-plan__body {
    font-size: 1rem;
    line-height: 1.6;
  }
}
@media (min-width: 992px) {
  .quiz-results-plan__body {
    margin: 0;
  }
}
.quiz-results-plan__pillars {
  list-style: none;
  margin: 0;
  padding: 0;
  text-align: left;
}
.quiz-results-plan__pillar {
  display: flex;
  gap: var(--spacing-4);
  align-items: baseline;
  padding-block: var(--spacing-3);
  border-top: 1px solid var(--primary-700);
}
.quiz-results-plan__pillar:last-child {
  border-bottom: 1px solid var(--primary-700);
}
@media (min-width: 992px) {
  .quiz-results-plan__pillar {
    gap: var(--spacing-5);
    padding-block: var(--spacing-4);
  }
}
.quiz-results-plan__pillar-number {
  font-family: var(--display-font);
  font-size: 1.5rem;
  line-height: 1.2;
  letter-spacing: -0.03rem;
  font-weight: 300;
  color: var(--warning-500);
  line-height: 1;
  flex-shrink: 0;
  letter-spacing: 0.05em;
}
@media (min-width: 992px) {
  .quiz-results-plan__pillar-number {
    font-size: 2rem;
    line-height: 1.18;
    letter-spacing: -0.04rem;
  }
}
.quiz-results-plan__pillar-text {
  flex: 1;
}
.quiz-results-plan__pillar-title {
  font-family: var(--display-font);
  font-size: 1rem;
  line-height: 1.3;
  letter-spacing: 0;
  font-weight: 400;
  color: var(--white);
  margin: 0 0 var(--spacing-1);
}
@media (min-width: 992px) {
  .quiz-results-plan__pillar-title {
    font-size: 1.25rem;
    line-height: 1.25;
    letter-spacing: -0.01rem;
  }
}
.quiz-results-plan__pillar-desc {
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.875rem;
  line-height: 1.6;
  color: var(--navy-200);
  margin: 0;
}
@media (min-width: 992px) {
  .quiz-results-plan__pillar-desc {
    font-size: 0.9375rem;
    line-height: 1.6;
  }
}
@media (prefers-reduced-motion: no-preference) {
  .quiz-results-plan__pillar {
    animation: quiz-plan-pillar-in linear both;
    animation-timeline: view();
    animation-range: entry 5% cover 30%;
  }
}
@keyframes quiz-plan-pillar-in {
  from {
    opacity: 0;
    transform: translateY(var(--spacing-3));
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.quiz-results-cooking {
  margin-inline: calc(-1 * var(--spacing-3));
  background-color: var(--pink-50);
  padding-block: var(--spacing-5);
}
@media (min-width: 992px) {
  .quiz-results-cooking {
    margin-inline: 0;
    width: 100%;
  }
}
@media (min-width: 992px) {
  .quiz-results-cooking {
    padding-block: var(--spacing-7);
  }
}
.quiz-results-cooking__inner {
  padding-inline: var(--spacing-4);
}
@media (min-width: 992px) {
  .quiz-results-cooking__inner {
    padding-inline: 0;
    width: 82%;
    margin-inline: auto;
  }
}
@media (min-width: 992px) {
  .quiz-results-cooking__inner {
    display: grid;
    grid-template-columns: 1fr 1fr;
    align-items: center;
    -moz-column-gap: var(--spacing-8);
         column-gap: var(--spacing-8);
  }
}
.quiz-results-cooking__copy {
  text-align: center;
}
@media (min-width: 992px) {
  .quiz-results-cooking__copy {
    text-align: left;
    order: 2;
  }
}
.quiz-results-cooking__eyebrow {
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.875rem;
  line-height: 1.6;
  font-weight: 700;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--primary-800);
  margin: 0 0 var(--spacing-2);
}
@media (min-width: 992px) {
  .quiz-results-cooking__eyebrow {
    font-size: 0.9375rem;
    line-height: 1.6;
  }
}
.quiz-results-cooking__temp {
  font-family: var(--display-font);
  font-weight: 600;
  color: var(--primary-800);
  font-size: 2.75rem;
  line-height: 1.2;
  font-weight: 300;
  color: var(--primary-800);
  margin: 0 0 var(--spacing-3);
  line-height: 1;
  font-size: 5rem;
}
@media (min-width: 992px) {
  .quiz-results-cooking__temp {
    font-size: 3.5rem;
    line-height: 1.15;
  }
}
@media (min-width: 992px) {
  .quiz-results-cooking__temp {
    font-size: 7rem;
  }
}
.quiz-results-cooking__title {
  font-family: var(--display-font);
  font-size: 2rem;
  line-height: 1.18;
  letter-spacing: -0.05rem;
  font-weight: 400;
  color: var(--primary-800);
  margin: 0 0 var(--spacing-3);
}
@media (min-width: 992px) {
  .quiz-results-cooking__title {
    font-size: 2.5rem;
    line-height: 1.15;
    letter-spacing: -0.06rem;
  }
}
.quiz-results-cooking__body {
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.9375rem;
  line-height: 1.6;
  color: var(--primary-700);
  margin: 0;
  max-width: 44rem;
}
@media (min-width: 992px) {
  .quiz-results-cooking__body {
    font-size: 1rem;
    line-height: 1.6;
  }
}
.quiz-results-cooking__scale {
  list-style: none;
  margin: var(--spacing-5) 0 0;
  padding: 0;
  max-width: 34rem;
  text-align: left;
}
@media (min-width: 992px) {
  .quiz-results-cooking__scale {
    margin: 0;
    max-width: none;
    order: 1;
  }
}
.quiz-results-cooking__scale-row {
  padding-block: var(--spacing-25);
}
.quiz-results-cooking__scale-row + .quiz-results-cooking__scale-row {
  border-top: 1px solid var(--pink-300);
}
.quiz-results-cooking__scale-label {
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.875rem;
  line-height: 1.6;
  display: block;
  color: var(--primary-700);
  margin-bottom: var(--spacing-2);
}
@media (min-width: 992px) {
  .quiz-results-cooking__scale-label {
    font-size: 0.9375rem;
    line-height: 1.6;
  }
}
.quiz-results-cooking__meter {
  display: flex;
  align-items: center;
  gap: var(--spacing-1);
}
.quiz-results-cooking__bulb {
  flex-shrink: 0;
  width: var(--spacing-4);
  height: var(--spacing-4);
  border-radius: 50%;
  background-color: var(--primary-800);
}
.quiz-results-cooking__stem {
  position: relative;
  flex: 1;
  height: var(--spacing-2);
  border-radius: var(--spacing-4);
  background-color: var(--pink-100);
}
.quiz-results-cooking__fill {
  position: absolute;
  inset-block: 0;
  left: 0;
  border-radius: var(--spacing-4);
  transform-origin: left center;
  background-color: var(--primary-800);
}
.quiz-results-cooking__tip {
  position: absolute;
  top: 50%;
  width: var(--spacing-3);
  height: var(--spacing-3);
  border-radius: 50%;
  border: 2px solid var(--pink-50);
  background-color: var(--primary-800);
  transform: translate(-50%, -50%);
}
.quiz-results-cooking__scale-temp {
  position: absolute;
  top: 50%;
  transform: translate(var(--spacing-3), -50%);
  white-space: nowrap;
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.875rem;
  line-height: 1.6;
  font-weight: 700;
  color: var(--primary-800);
}
@media (min-width: 992px) {
  .quiz-results-cooking__scale-temp {
    font-size: 0.9375rem;
    line-height: 1.6;
  }
}
@media (prefers-reduced-motion: no-preference) {
  .quiz-results-cooking__fill {
    animation: quiz-cooking-fill linear both;
    animation-timeline: view();
    animation-range: entry 10% cover 35%;
  }
}
@keyframes quiz-cooking-fill {
  from {
    transform: scaleX(0);
  }
  to {
    transform: scaleX(1);
  }
}
.quiz-results-cooking__scale-row--tuggs .quiz-results-cooking__scale-label {
  font-weight: 700;
  color: var(--primary-800);
}
.quiz-results-cooking__scale-row--tuggs .quiz-results-cooking__bulb,
.quiz-results-cooking__scale-row--tuggs .quiz-results-cooking__fill,
.quiz-results-cooking__scale-row--tuggs .quiz-results-cooking__tip {
  background-color: var(--green-300);
}

.quiz-results-vet {
  margin-inline: calc(-1 * var(--spacing-3));
  background-color: var(--tan-200);
  padding-block: var(--spacing-5);
}
@media (min-width: 992px) {
  .quiz-results-vet {
    margin-inline: 0;
    width: 100%;
  }
}
@media (min-width: 992px) {
  .quiz-results-vet {
    padding-block: var(--spacing-7);
  }
}
.quiz-results-vet__inner {
  padding-inline: var(--spacing-4);
}
@media (min-width: 992px) {
  .quiz-results-vet__inner {
    padding-inline: 0;
    width: 82%;
    margin-inline: auto;
  }
}
.quiz-results-vet__strip {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: var(--spacing-4);
}
@media (min-width: 992px) {
  .quiz-results-vet__strip {
    flex-direction: row;
    align-items: center;
    text-align: left;
    gap: var(--spacing-6);
    width: -moz-fit-content;
    width: fit-content;
    margin-inline: auto;
  }
}
.quiz-results-vet__avatar {
  flex-shrink: 0;
  width: var(--spacing-9);
  height: var(--spacing-9);
  border-radius: 50%;
  overflow: hidden;
  background-color: var(--tan-50);
}
.quiz-results-vet__img {
  display: block;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center top;
     object-position: center top;
}
.quiz-results-vet__copy {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--spacing-3);
}
@media (min-width: 992px) {
  .quiz-results-vet__copy {
    align-items: flex-start;
  }
}
.quiz-results-vet__eyebrow {
  margin: 0;
  display: inline-flex;
  align-items: center;
  gap: var(--spacing-1);
  color: var(--primary-800);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.18em;
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.875rem;
  line-height: 1.6;
}
@media (min-width: 992px) {
  .quiz-results-vet__eyebrow {
    font-size: 0.9375rem;
    line-height: 1.6;
  }
}
.quiz-results-vet__tick {
  flex-shrink: 0;
  width: var(--spacing-3);
  height: var(--spacing-3);
  color: var(--green-300);
}
.quiz-results-vet__quote {
  margin: 0;
  max-width: 42ch;
  color: var(--primary-800);
  font-style: italic;
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 1rem;
  line-height: 1.6;
}
@media (min-width: 992px) {
  .quiz-results-vet__quote {
    font-size: 1.125rem;
    line-height: 1.6;
  }
}
.quiz-results-vet__attribution {
  margin: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--spacing-3);
  color: var(--primary-800);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.875rem;
  line-height: 1.6;
}
@media (min-width: 992px) {
  .quiz-results-vet__attribution {
    font-size: 0.9375rem;
    line-height: 1.6;
  }
}
@media (min-width: 992px) {
  .quiz-results-vet__attribution {
    justify-content: flex-start;
  }
}
.quiz-results-vet__attribution-rule {
  display: inline-block;
  width: var(--spacing-3);
  height: 1px;
  background: var(--primary-800);
  flex-shrink: 0;
}

.quiz-step--results {
  padding: var(--spacing-5) var(--spacing-3) var(--spacing-9);
}
@media (min-width: 992px) {
  .quiz-step--results {
    padding: var(--spacing-7) 0 var(--spacing-9);
  }
}
@media (min-width: 992px) {
  .quiz-step--results > .quiz-results__form,
  .quiz-step--results > .quiz-results__sentinel {
    width: 82%;
    margin-inline: auto;
  }
}

.quiz-results-hero {
  padding-block: var(--spacing-5) var(--spacing-5);
  text-align: center;
  max-width: 60rem;
  margin-inline: auto;
}
@media (min-width: 992px) {
  .quiz-results-hero {
    padding-block: var(--spacing-6) var(--spacing-6);
  }
}
.quiz-results-hero__eyebrow {
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.875rem;
  line-height: 1.6;
  font-weight: 700;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--navy-200);
  margin: 0 0 var(--spacing-3);
}
@media (min-width: 992px) {
  .quiz-results-hero__eyebrow {
    font-size: 0.9375rem;
    line-height: 1.6;
  }
}
.quiz-results-hero__title {
  font-family: var(--display-font);
  font-size: 2rem;
  line-height: 1.18;
  letter-spacing: -0.05rem;
  font-weight: 400;
  color: var(--white);
  margin: 0 0 var(--spacing-5);
}
@media (min-width: 992px) {
  .quiz-results-hero__title {
    font-size: 2.5rem;
    line-height: 1.15;
    letter-spacing: -0.06rem;
  }
}
@media (min-width: 992px) {
  .quiz-results-hero__title {
    margin-bottom: var(--spacing-6);
  }
}

.quiz-results-nutrition {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-2);
}
@media (min-width: 992px) {
  .quiz-results-nutrition {
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
    gap: var(--spacing-3);
  }
}
.quiz-results-nutrition__row {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: var(--spacing-2);
  padding: var(--spacing-2) var(--spacing-3);
  background-color: var(--white);
  border-radius: 999px;
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.875rem;
  line-height: 1.6;
  color: var(--primary-800);
}
@media (min-width: 992px) {
  .quiz-results-nutrition__row {
    font-size: 0.9375rem;
    line-height: 1.6;
  }
}
.quiz-results-nutrition__name-pill {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  padding: var(--spacing-1) var(--spacing-25);
  border-radius: 999px;
  color: var(--primary-800);
  font-weight: 700;
}
.quiz-results-nutrition__name-pill--yellow {
  background-color: var(--yellow-500);
}
.quiz-results-nutrition__name-pill--pink {
  background-color: var(--pink-500);
}
.quiz-results-nutrition__name-pill--green {
  background-color: var(--green-300);
}
.quiz-results-nutrition__name-pill--blue {
  background-color: var(--blue-300);
}
.quiz-results-nutrition__name-pill--purple {
  background-color: var(--purple-300);
}
.quiz-results-nutrition__label {
  color: var(--primary-300);
}
.quiz-results-nutrition__sep {
  color: var(--primary-100);
}
.quiz-results-nutrition__stat {
  font-weight: 700;
}

.quiz-results-section {
  margin-bottom: var(--spacing-6);
}
.quiz-results-section__header {
  margin-bottom: var(--spacing-4);
  text-align: center;
}
.quiz-results-section__title {
  font-family: var(--display-font);
  font-size: 1.5rem;
  line-height: 1.2;
  letter-spacing: -0.03rem;
  font-weight: 400;
  color: var(--primary-800);
  margin: 0 0 var(--spacing-2);
}
@media (min-width: 992px) {
  .quiz-results-section__title {
    font-size: 2rem;
    line-height: 1.18;
    letter-spacing: -0.04rem;
  }
}
.quiz-results-section__sub {
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.9375rem;
  line-height: 1.6;
  color: var(--primary-700);
  margin: 0;
}
@media (min-width: 992px) {
  .quiz-results-section__sub {
    font-size: 1rem;
    line-height: 1.6;
  }
}

.recipe-grid {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
  justify-content: center;
  gap: var(--spacing-3);
}
.recipe-grid > * {
  flex: 1 1 100%;
}
@media (min-width: 992px) {
  .recipe-grid {
    flex-direction: row;
  }
  .recipe-grid > * {
    flex: 0 1 calc((100% - 4 * var(--spacing-3)) / 5);
    max-width: 19rem;
  }
}
.recipe-grid[hidden] {
  display: none;
}

.recipe-card {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-3);
  position: relative;
  height: 100%;
  padding: var(--spacing-3);
  background-color: var(--tan-100);
  border-radius: var(--spacing-3);
  cursor: pointer;
  transition: background-color 0.16s ease, box-shadow 0.16s ease, transform 0.12s ease;
  -webkit-tap-highlight-color: transparent;
}
@media (hover: hover) {
  .recipe-card:hover {
    transform: scale(1.02);
  }
  .recipe-card:hover:not(.is-selected) {
    background-color: var(--tan-50);
  }
}
.recipe-card:active {
  transform: scale(0.99);
}
.recipe-card.is-selected {
  background-color: var(--white);
  box-shadow: 0 var(--spacing-1) var(--spacing-3) 0 color-mix(in srgb, var(--primary-800) 7%, transparent);
}
.recipe-card.is-selected .recipe-card__check {
  background-color: var(--green-300);
  border-color: transparent;
  color: var(--primary-800);
}
.recipe-card.is-selected .recipe-card__check-icon--add {
  display: none;
}
.recipe-card.is-selected .recipe-card__check-icon--tick {
  display: block;
}
.recipe-card__input {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}
.recipe-card__media {
  position: relative;
  width: auto;
  margin: calc(-1 * var(--spacing-3)) calc(-1 * var(--spacing-3)) 0;
  aspect-ratio: 3/2;
  border-radius: var(--spacing-3) var(--spacing-3) 0 0;
  overflow: hidden;
  background-color: var(--tan-100);
}
@media (min-width: 992px) {
  .recipe-card__media {
    aspect-ratio: 5/4;
  }
}
.recipe-card__image {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  margin: 0;
  -o-object-fit: cover;
     object-fit: cover;
}
.recipe-card__image--hover {
  opacity: 0;
  transition: opacity 0.25s ease;
}
@media (hover: hover) {
  .recipe-card:hover .recipe-card__image--hover {
    opacity: 1;
  }
}
.recipe-card__body {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-2);
  flex: 1;
  text-align: left;
}
.recipe-card__title {
  font-family: var(--display-font);
  font-size: 1rem;
  line-height: 1.3;
  letter-spacing: 0;
  font-weight: 400;
  color: var(--primary-800);
  margin: 0;
}
@media (min-width: 992px) {
  .recipe-card__title {
    font-size: 1.25rem;
    line-height: 1.25;
    letter-spacing: -0.01rem;
  }
}
.recipe-card__warning {
  display: flex;
  align-items: flex-start;
  gap: var(--spacing-2);
  margin: 0;
  padding: var(--spacing-2);
  background-color: var(--rose-100);
  border-radius: var(--spacing-2);
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.625rem;
  line-height: 1.6;
  font-weight: 600;
  color: var(--rose-900);
}
@media (min-width: 992px) {
  .recipe-card__warning {
    font-size: 0.75rem;
    line-height: 1.6;
  }
}
.recipe-card__warning-icon {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.1rem;
  height: 1.1rem;
  border-radius: 50%;
  background-color: var(--rose-500);
  color: var(--white);
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.625rem;
  line-height: 1.6;
  font-weight: 700;
  line-height: 1;
}
@media (min-width: 992px) {
  .recipe-card__warning-icon {
    font-size: 0.75rem;
    line-height: 1.6;
  }
}
.recipe-card__description {
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.875rem;
  line-height: 1.6;
  color: var(--primary-500);
  margin: 0;
}
@media (min-width: 992px) {
  .recipe-card__description {
    font-size: 0.9375rem;
    line-height: 1.6;
  }
}
.recipe-card__details-link {
  align-self: stretch;
  margin-top: auto;
  background-color: var(--tan-50);
  border: none;
  border-radius: 999px;
  padding: var(--spacing-2) var(--spacing-3);
  text-align: center;
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.875rem;
  line-height: 1.6;
  color: var(--primary-800);
  text-decoration: none;
  cursor: pointer;
  transition: background-color 0.16s ease, color 0.16s ease;
}
@media (min-width: 992px) {
  .recipe-card__details-link {
    font-size: 0.9375rem;
    line-height: 1.6;
  }
}
@media (hover: hover) {
  .recipe-card__details-link:hover {
    background-color: var(--yellow-500);
    color: var(--primary-800);
  }
}
.recipe-card__check {
  position: absolute;
  top: var(--spacing-3);
  right: var(--spacing-3);
  width: var(--spacing-5);
  height: var(--spacing-5);
  border-radius: 50%;
  background-color: transparent;
  border: 1.5px solid var(--primary-300);
  color: var(--primary-500);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: background-color 0.16s ease, border-color 0.16s ease, color 0.16s ease;
  z-index: 1;
}
.recipe-card__check-icon {
  width: 1rem;
  height: 1rem;
  display: block;
}
.recipe-card__check-icon--tick {
  display: none;
}
.recipe-card--muted {
  background-color: var(--tan-50);
  opacity: 0.85;
}

.quiz-results-section--other {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-3);
}

.quiz-results-other__toggle {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--spacing-2);
  padding: var(--spacing-3) var(--spacing-4);
  background-color: var(--white);
  border: none;
  border-radius: var(--spacing-3);
  color: var(--primary-800);
  text-align: left;
  cursor: pointer;
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.9375rem;
  line-height: 1.6;
  font-weight: 700;
  transition: background-color 0.16s ease;
}
@media (min-width: 992px) {
  .quiz-results-other__toggle {
    font-size: 1rem;
    line-height: 1.6;
  }
}
@media (hover: hover) {
  .quiz-results-other__toggle:hover {
    background-color: var(--tan-50);
  }
}
.quiz-results-other__toggle .quiz-results-other__chevron {
  color: var(--primary-500);
  transition: transform 0.18s ease;
}
.quiz-results-other__toggle[aria-expanded=true] .quiz-results-other__chevron {
  transform: rotate(180deg);
}

.quiz-results__sentinel {
  height: 1px;
  width: 100%;
}

.recipe-modal {
  padding: 0;
  border: none;
  background: transparent;
  max-width: 100vw;
  max-height: 100dvh;
  width: 100%;
  height: 100%;
  margin: 0;
  inset: 0;
  overflow: hidden;
  color: var(--primary-800);
}
@media (min-width: 992px) {
  .recipe-modal {
    width: min(48rem, 100vw - var(--spacing-7));
    height: auto;
    max-height: min(86dvh, 50rem);
    margin: auto;
    border-radius: var(--spacing-3);
  }
}
.recipe-modal::backdrop {
  background-color: color-mix(in srgb, var(--primary-800) 55%, transparent);
}
.recipe-modal__panel {
  position: relative;
  background-color: var(--white);
  height: 100%;
  overflow-y: auto;
  padding: var(--spacing-5) var(--spacing-4) var(--spacing-7);
}
@media (min-width: 992px) {
  .recipe-modal__panel {
    padding: var(--spacing-6);
    border-radius: var(--spacing-3);
  }
}
.recipe-modal__close {
  position: absolute;
  top: var(--spacing-3);
  right: var(--spacing-3);
  width: var(--spacing-6);
  height: var(--spacing-6);
  flex-shrink: 0;
  padding: 0;
  margin: 0;
  line-height: 1;
  border-radius: 50%;
  background-color: var(--tan-100);
  border: 1px solid var(--tan-300);
  color: var(--primary-800);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  z-index: 1;
  transition: background-color 0.16s ease, border-color 0.16s ease;
}
@media (hover: hover) {
  .recipe-modal__close:hover {
    background-color: var(--tan-300);
    border-color: var(--primary-800);
  }
}
.recipe-modal__close svg {
  width: 1rem;
  height: 1rem;
  display: block;
}
.recipe-modal__header {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-4);
  margin-bottom: var(--spacing-5);
}
@media (min-width: 768px) {
  .recipe-modal__header {
    flex-direction: row;
    align-items: center;
    gap: var(--spacing-5);
  }
}
.recipe-modal__media {
  width: 100%;
  background-color: var(--tan-100);
  border-radius: var(--spacing-3);
  aspect-ratio: 5/4;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
}
@media (min-width: 768px) {
  .recipe-modal__media {
    width: 12rem;
    flex-shrink: 0;
  }
}
.recipe-modal__image {
  width: 100%;
  height: 100%;
  -o-object-fit: contain;
     object-fit: contain;
  margin: 0;
}
.recipe-modal__heading {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-2);
  text-align: left;
}
.recipe-modal__eyebrow {
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.875rem;
  line-height: 1.6;
  font-weight: 700;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--primary-500);
  margin: 0;
}
@media (min-width: 992px) {
  .recipe-modal__eyebrow {
    font-size: 0.9375rem;
    line-height: 1.6;
  }
}
.recipe-modal__title {
  font-family: var(--display-font);
  font-size: 1.5rem;
  line-height: 1.2;
  letter-spacing: -0.03rem;
  font-weight: 400;
  color: var(--primary-800);
  margin: 0;
}
@media (min-width: 992px) {
  .recipe-modal__title {
    font-size: 2rem;
    line-height: 1.18;
    letter-spacing: -0.04rem;
  }
}
.recipe-modal__desc {
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.9375rem;
  line-height: 1.6;
  color: var(--primary-700);
  margin: 0;
}
@media (min-width: 992px) {
  .recipe-modal__desc {
    font-size: 1rem;
    line-height: 1.6;
  }
}
.recipe-modal__section {
  margin-top: var(--spacing-5);
  text-align: left;
}
.recipe-modal__section + .recipe-modal__section {
  margin-top: var(--spacing-6);
}
.recipe-modal__section-title {
  font-family: var(--display-font);
  font-size: 1rem;
  line-height: 1.3;
  letter-spacing: 0;
  font-weight: 400;
  color: var(--primary-800);
  margin: 0 0 var(--spacing-3);
}
@media (min-width: 992px) {
  .recipe-modal__section-title {
    font-size: 1.25rem;
    line-height: 1.25;
    letter-spacing: -0.01rem;
  }
}
.recipe-modal__section--hero {
  background-color: var(--primary-800);
  padding: var(--spacing-5) var(--spacing-4);
  margin-inline: calc(var(--spacing-4) * -1);
}
@media (min-width: 992px) {
  .recipe-modal__section--hero {
    padding: var(--spacing-6);
    margin-inline: calc(var(--spacing-6) * -1);
  }
}
.recipe-modal__section--hero .recipe-modal__section-title {
  color: var(--white);
}
.recipe-modal__hero-rail {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  gap: var(--spacing-2);
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
}
.recipe-modal__hero-rail::-webkit-scrollbar {
  display: none;
}
.recipe-modal__hero-rail .ingredient-card::after, .recipe-modal__hero-rail .ingredient-card.is-visible::after, .recipe-modal__hero-rail .ingredient-card:hover::after {
  height: 4px;
}
@media (min-width: 992px) {
  .recipe-modal__hero-rail .ingredient-card {
    flex: 0 0 calc((100% - var(--spacing-2) * 2) / 2.5);
  }
}
.recipe-modal__hero-rail .ingredient-card__title {
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.9375rem;
  line-height: 1.6;
  font-weight: 700;
  color: var(--white);
  transition: color 0.16s ease;
}
@media (min-width: 992px) {
  .recipe-modal__hero-rail .ingredient-card__title {
    font-size: 1rem;
    line-height: 1.6;
  }
}
.recipe-modal__hero-rail .ingredient-card__body {
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.875rem;
  line-height: 1.6;
  color: var(--navy-200);
  transition: color 0.16s ease;
}
@media (min-width: 992px) {
  .recipe-modal__hero-rail .ingredient-card__body {
    font-size: 0.9375rem;
    line-height: 1.6;
  }
}
@media (hover: hover) {
  .recipe-modal__hero-rail .ingredient-card:hover {
    color: var(--card-accent);
  }
  .recipe-modal__hero-rail .ingredient-card:hover .ingredient-card__title,
  .recipe-modal__hero-rail .ingredient-card:hover .ingredient-card__body,
  .recipe-modal__hero-rail .ingredient-card:hover .ingredient-card__number {
    color: var(--card-accent);
  }
}
.recipe-modal__supporting-rail {
  list-style: none;
  margin: 0;
  padding: 0 0 var(--spacing-2);
  display: flex;
  gap: var(--spacing-2);
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
}
.recipe-modal__supporting-rail::-webkit-scrollbar {
  display: none;
}
.recipe-modal__supporting-rail .ingredient-card {
  background-color: var(--tan-200);
  color: var(--primary-800);
}
.recipe-modal__supporting-rail .ingredient-card::after, .recipe-modal__supporting-rail .ingredient-card.is-visible::after, .recipe-modal__supporting-rail .ingredient-card:hover::after {
  height: 4px;
}
.recipe-modal__supporting-rail .ingredient-card__number {
  color: var(--primary-300);
  transition: color 0.16s ease;
}
.recipe-modal__supporting-rail .ingredient-card__title {
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.9375rem;
  line-height: 1.6;
  font-weight: 700;
  color: var(--primary-800);
  transition: color 0.16s ease;
}
@media (min-width: 992px) {
  .recipe-modal__supporting-rail .ingredient-card__title {
    font-size: 1rem;
    line-height: 1.6;
  }
}
.recipe-modal__supporting-rail .ingredient-card__body {
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.875rem;
  line-height: 1.6;
  color: var(--primary-500);
  transition: color 0.16s ease;
}
@media (min-width: 992px) {
  .recipe-modal__supporting-rail .ingredient-card__body {
    font-size: 0.9375rem;
    line-height: 1.6;
  }
}
@media (min-width: 992px) {
  .recipe-modal__supporting-rail .ingredient-card {
    flex: 0 0 calc((100% - var(--spacing-2) * 2) / 2.5);
  }
}
.recipe-modal__section--breakdown {
  margin-top: var(--spacing-7);
}
.recipe-modal__section-eyebrow {
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.875rem;
  line-height: 1.6;
  font-weight: 700;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--primary-500);
  margin: 0 0 var(--spacing-2);
}
@media (min-width: 992px) {
  .recipe-modal__section-eyebrow {
    font-size: 0.9375rem;
    line-height: 1.6;
  }
}
.recipe-modal__section-sub {
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.875rem;
  line-height: 1.6;
  color: var(--primary-500);
  margin: 0 0 var(--spacing-4);
}
@media (min-width: 992px) {
  .recipe-modal__section-sub {
    font-size: 0.9375rem;
    line-height: 1.6;
  }
}
.recipe-modal__accordions {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-2);
}
.recipe-modal__additive {
  border-bottom: 1px solid var(--tan-300);
  padding-block: var(--spacing-1);
}

.quiz-results-footer {
  transform: translateY(100%);
  transition: transform 0.32s cubic-bezier(0.2, 0, 0, 1);
}
@media (min-width: 992px) {
  .quiz-results-footer {
    position: fixed;
    inset: auto 0 0 0;
    padding: var(--spacing-3) var(--spacing-4) calc(var(--spacing-5) + env(safe-area-inset-bottom));
  }
}
.quiz-results-footer.is-visible {
  transform: translateY(0);
}
.quiz-step--results:focus-within .quiz-results-footer.is-visible {
  transform: translateY(0);
  pointer-events: auto;
}
.quiz-results-footer__full {
  color: var(--primary-500);
  font-weight: 400;
  margin: 0 var(--spacing-1);
}
.quiz-results-footer__trial {
  font-weight: 700;
  margin-right: var(--spacing-1);
}

.madlib-card-wrapper {
  position: relative;
  width: 100%;
  margin-block: var(--spacing-4) var(--spacing-3);
}
.madlib-card-wrapper::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: var(--spacing-4);
  transform: translate(0, 0) rotate(0deg);
  transform-origin: center;
  transition: transform 0.7s cubic-bezier(0.2, 0.9, 0.3, 1.2);
  z-index: 0;
}
.madlib-card-wrapper.is-visible::before {
  transform: translate(10px, 12px) rotate(-1.5deg);
}
@media (min-width: 992px) {
  .madlib-card-wrapper.is-visible::before {
    transform: translate(14px, 16px) rotate(-1.5deg);
  }
}
.madlib-card-wrapper--yellow::before {
  background-color: var(--yellow-500);
}
.madlib-card-wrapper--green::before {
  background-color: var(--green-300);
}
.madlib-card-wrapper--orange::before {
  background-color: var(--orange-500);
}
.madlib-card-wrapper--pink::before {
  background-color: var(--pink-500);
}
.madlib-card-wrapper--blue::before {
  background-color: var(--blue-300);
}
.madlib-card-wrapper--purple::before {
  background-color: var(--purple-300);
}

.madlib-card {
  position: relative;
  z-index: 1;
  width: 100%;
  padding: var(--spacing-5) var(--spacing-4);
  background-color: var(--white);
  border-radius: var(--spacing-4);
  transform-origin: center;
  transition: transform 0.5s cubic-bezier(0.2, 0.9, 0.3, 1.2);
}
@media (min-width: 992px) {
  .madlib-card {
    padding: var(--spacing-7) var(--spacing-6);
  }
}
@media (hover: hover) {
  .madlib-card-wrapper.is-visible:hover .madlib-card {
    transform: translate(-3px, -5px) rotate(0.6deg);
  }
}
.madlib-card__sentence {
  font-family: var(--display-font);
  font-size: 1.5rem;
  line-height: 1.2;
  letter-spacing: -0.03rem;
  color: var(--primary-800);
  font-weight: 400;
  margin: 0;
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: var(--spacing-2);
  line-height: 1.5;
}
@media (min-width: 992px) {
  .madlib-card__sentence {
    font-size: 2rem;
    line-height: 1.18;
    letter-spacing: -0.04rem;
  }
}
.madlib-card__word {
  white-space: nowrap;
}
.madlib-card__word--reveal[hidden] {
  display: none;
}
.madlib-card__names {
  margin-top: var(--spacing-3);
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: var(--spacing-2);
  font-family: var(--display-font);
  font-size: 1.5rem;
  line-height: 1.2;
  letter-spacing: -0.03rem;
  color: var(--primary-800);
  font-weight: 400;
  line-height: 1.5;
}
@media (min-width: 992px) {
  .madlib-card__names {
    font-size: 2rem;
    line-height: 1.18;
    letter-spacing: -0.04rem;
  }
}
.madlib-card__name-slot {
  display: inline-flex;
  align-items: baseline;
  gap: 0;
}

.madlib-field {
  display: inline-flex;
  align-items: baseline;
  position: relative;
  padding-bottom: var(--spacing-1);
  border-bottom: 2px dotted var(--primary-100);
  transition: border-color 0.2s ease;
}
@media (hover: hover) {
  .madlib-field:hover {
    border-bottom-color: var(--green-300);
  }
}
.madlib-field--count {
  width: 2em;
}
.madlib-field--name {
  width: 6em;
}
.madlib-field--active {
  border-bottom-style: solid;
  border-bottom-color: var(--green-300);
}
.madlib-field--filled {
  border-bottom-color: var(--primary-300);
}
.madlib-field__input {
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 1.125rem;
  line-height: 1.55;
  color: var(--primary-800);
  font-style: italic;
  font-weight: 300;
  width: 100%;
  display: inline-block;
  border: none;
  background: transparent;
  box-shadow: none;
  outline: none;
  padding: 0;
  text-align: inherit;
  -webkit-appearance: none;
  -moz-appearance: none;
       appearance: none;
  border-radius: 0;
}
@media (min-width: 992px) {
  .madlib-field__input {
    font-size: 1.25rem;
    line-height: 1.55;
  }
}
.madlib-field__input:hover, .madlib-field__input:focus {
  outline: none;
  box-shadow: none;
}
.madlib-field__input::-moz-placeholder {
  color: var(--primary-300);
  font-style: italic;
  opacity: 1;
}
.madlib-field__input::placeholder {
  color: var(--primary-300);
  font-style: italic;
  opacity: 1;
}
.madlib-field__input--count {
  -moz-appearance: textfield;
  text-align: center;
}
.madlib-field__input--count::-webkit-outer-spin-button, .madlib-field__input--count::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
.madlib-field__input--name {
  field-sizing: content;
  min-width: 4em;
  max-width: 10em;
  text-align: center;
  overflow: visible;
}

@supports (field-sizing: content) {
  .madlib-field--name {
    width: auto;
  }
}
.quiz-step__cards {
  display: flex;
  flex-direction: column;
  width: 100%;
}
@media (min-width: 992px) {
  .quiz-step__cards {
    gap: var(--spacing-2);
  }
}

.dog-zone {
  transition: opacity 0.3s ease;
}
.dog-zone.is-complete .dog-zone__header {
  opacity: 0.5;
}
.dog-zone.is-complete .dog-zone__body {
  display: none;
}
.dog-zone.has-summary:not(.is-complete) .dog-zone__confirm {
  display: inline-flex;
}
.dog-zone__header {
  display: flex;
  align-items: center;
  gap: var(--spacing-25);
  margin-bottom: var(--spacing-3);
}
.dog-zone.is-active .dog-zone__name-pill {
  display: none;
}
.dog-zone__name-pill {
  display: inline-flex;
  align-items: center;
  padding: var(--spacing-1) var(--spacing-25);
  border-radius: 999px;
  color: var(--primary-800);
  font-family: var(--display-font);
  font-size: 1rem;
  line-height: 1.3;
  letter-spacing: 0;
  font-weight: 400;
}
@media (min-width: 992px) {
  .dog-zone__name-pill {
    font-size: 1.25rem;
    line-height: 1.25;
    letter-spacing: -0.01rem;
  }
}
.dog-zone__name-pill--yellow {
  background-color: var(--yellow-500);
}
.dog-zone__name-pill--pink {
  background-color: var(--pink-500);
}
.dog-zone__name-pill--green {
  background-color: var(--green-300);
}
.dog-zone__name-pill--blue {
  background-color: var(--blue-300);
}
.dog-zone__name-pill--purple {
  background-color: var(--purple-300);
}
.dog-zone__body {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-3);
  text-align: left;
}
.dog-zone__dropdown {
  align-self: flex-start;
  margin-top: calc(var(--spacing-1) * -1);
  background-color: var(--white);
  border: 1px solid var(--primary-100);
  border-radius: var(--spacing-2);
  box-shadow: var(--shadow);
  max-height: 12rem;
  overflow-y: auto;
  min-width: 12rem;
  z-index: 5;
}
.dog-zone__option {
  display: block;
  width: 100%;
  padding: var(--spacing-25) var(--spacing-3);
  text-align: left;
  background: none;
  border: none;
  border-bottom: 1px solid var(--primary-100);
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.9375rem;
  line-height: 1.6;
  color: var(--primary-800);
  cursor: pointer;
  transition: background-color 0.12s ease;
}
@media (min-width: 992px) {
  .dog-zone__option {
    font-size: 1rem;
    line-height: 1.6;
  }
}
.dog-zone__option:last-child {
  border-bottom: none;
}
.dog-zone__option:hover {
  background-color: var(--tan-100);
}
.dog-zone__pill-group {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: var(--spacing-1);
  margin: 0 var(--spacing-1);
}
.dog-zone__pill {
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.9375rem;
  line-height: 1.6;
  font-style: italic;
  font-weight: 300;
  color: var(--primary-500);
  padding: var(--spacing-1) var(--spacing-25);
  background: transparent;
  border: 1.5px dashed var(--primary-100);
  border-radius: 999px;
  cursor: pointer;
  transition: background-color 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}
@media (min-width: 992px) {
  .dog-zone__pill {
    font-size: 1rem;
    line-height: 1.6;
  }
}
@media (hover: hover) {
  .dog-zone__pill:hover:not(.is-selected) {
    border-color: var(--green-300);
    color: var(--primary-800);
  }
}
.dog-zone__pill.is-selected {
  background-color: var(--green-300);
  border-color: var(--green-300);
  border-style: solid;
  color: var(--primary-800);
  font-style: normal;
  font-weight: 500;
}
.dog-zone__toggle-row {
  display: flex;
  align-items: center;
  gap: var(--spacing-2);
}
.dog-zone__toggle {
  flex-shrink: 0;
  width: 36px;
  height: 20px;
  padding: 0;
  border: none;
  border-radius: 999px;
  background-color: var(--primary-100);
  position: relative;
  cursor: pointer;
  transition: background-color 0.22s ease;
}
.dog-zone__toggle.is-on {
  background-color: var(--green-300);
}
.dog-zone__toggle-knob {
  position: absolute;
  top: 2px;
  left: 2px;
  width: 16px;
  height: 16px;
  border-radius: 999px;
  background-color: var(--white);
  transition: transform 0.22s ease;
}
.dog-zone__toggle.is-on .dog-zone__toggle-knob {
  transform: translateX(16px);
}
.dog-zone__toggle-label {
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.875rem;
  line-height: 1.6;
  color: var(--primary-500);
}
@media (min-width: 992px) {
  .dog-zone__toggle-label {
    font-size: 0.9375rem;
    line-height: 1.6;
  }
}
.dog-zone__callout {
  margin: 0;
  padding: var(--spacing-25) var(--spacing-3);
  border-radius: var(--spacing-2);
  background-color: var(--tan-100);
  text-align: left;
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.875rem;
  line-height: 1.6;
  color: var(--primary-700);
}
@media (min-width: 992px) {
  .dog-zone__callout {
    font-size: 0.9375rem;
    line-height: 1.6;
  }
}
.dog-zone__callout strong {
  color: var(--primary-800);
  font-weight: 600;
}
.dog-zone__confirm {
  display: none;
  align-self: flex-start;
  align-items: center;
  gap: var(--spacing-1);
  min-height: 44px;
  padding: var(--spacing-2) var(--spacing-4);
  border: none;
  border-radius: 999px;
  background-color: var(--green-300);
  color: var(--primary-800);
  cursor: pointer;
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.9375rem;
  line-height: 1.6;
  font-weight: 600;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}
@media (min-width: 992px) {
  .dog-zone__confirm {
    font-size: 1rem;
    line-height: 1.6;
  }
}
.dog-zone__confirm::after {
  content: "→";
  font-weight: 400;
  transition: transform 0.2s ease;
}
@media (hover: hover) {
  .dog-zone__confirm:hover {
    transform: translateY(-1px);
    box-shadow: var(--shadow);
  }
  .dog-zone__confirm:hover::after {
    transform: translateX(2px);
  }
}
.dog-zone__summary {
  display: none;
  align-items: center;
  justify-content: space-between;
  gap: var(--spacing-3);
  margin-top: var(--spacing-2);
  text-align: left;
}
.dog-zone.is-complete .dog-zone__summary {
  display: flex;
}
.dog-zone__summary-text {
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.9375rem;
  line-height: 1.6;
  color: var(--primary-700);
  font-style: italic;
}
@media (min-width: 992px) {
  .dog-zone__summary-text {
    font-size: 1rem;
    line-height: 1.6;
  }
}
.dog-zone__edit {
  padding: 0;
  background: none;
  border: none;
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.875rem;
  line-height: 1.6;
  font-weight: 600;
  color: var(--primary-500);
  cursor: pointer;
  text-decoration: underline;
}
@media (min-width: 992px) {
  .dog-zone__edit {
    font-size: 0.9375rem;
    line-height: 1.6;
  }
}
.dog-zone__edit:hover {
  color: var(--primary-800);
}

.madlib-field--age {
  width: 2.5em;
}

.madlib-field__input--age {
  text-align: center;
  -moz-appearance: textfield;
}
.madlib-field__input--age::-webkit-outer-spin-button, .madlib-field__input--age::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

.dog-zone__callout--age {
  margin: 0;
}

.dog-zone__callout--reassurance {
  margin: 0;
}
.dog-zone__callout--reassurance strong {
  font-weight: 600;
}

.health-conditions {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-1);
}
.health-conditions[hidden] {
  display: none;
}

.health-condition {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--spacing-2);
  padding: var(--spacing-2) var(--spacing-3);
  background-color: var(--tan-100);
  border: 1.5px solid transparent;
  border-radius: var(--spacing-2);
  cursor: pointer;
  transition: background-color 0.16s ease, border-color 0.16s ease, transform 0.12s ease;
  -webkit-tap-highlight-color: transparent;
}
@media (hover: hover) {
  .health-condition:hover:not(.is-selected) {
    border-color: var(--green-300);
  }
}
.health-condition:active {
  transform: scale(0.99);
}
.health-condition.is-selected {
  background-color: var(--green-300);
  border-color: var(--primary-800);
}
.health-condition__input {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}
.health-condition__label {
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.9375rem;
  line-height: 1.6;
  color: var(--primary-800);
}
@media (min-width: 992px) {
  .health-condition__label {
    font-size: 1rem;
    line-height: 1.6;
  }
}
.health-condition__check {
  flex-shrink: 0;
  width: 22px;
  height: 22px;
  border-radius: 999px;
  background-color: var(--white);
  border: 1.5px solid var(--primary-100);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: background-color 0.16s ease, border-color 0.16s ease;
}
.health-condition__check .material-symbols-outlined {
  font-size: 14px !important;
  color: var(--white);
}
.health-condition.is-selected .health-condition__check {
  background-color: var(--primary-800);
  border-color: var(--primary-800);
}

.dog-zone__callout--warning {
  margin: 0;
  background-color: var(--rose-50);
  color: var(--rose-900);
}
.dog-zone__callout--warning strong {
  color: var(--rose-900);
  font-weight: 400;
}

.selectable-options {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-2);
}

.selectable-option {
  display: flex;
  align-items: center;
  gap: var(--spacing-3);
  width: 100%;
  padding: var(--spacing-3);
  background-color: var(--tan-100);
  border: 1.5px solid transparent;
  border-radius: var(--spacing-3);
  cursor: pointer;
  text-align: left;
  transition: background-color 0.18s ease, border-color 0.18s ease, transform 0.12s ease;
}
@media (hover: hover) {
  .selectable-option:hover:not(.is-selected) {
    border-color: var(--green-300);
  }
}
.selectable-option:active {
  transform: scale(0.99);
}
.selectable-option.is-selected {
  background-color: var(--green-300);
  border-color: var(--primary-800);
}
.selectable-option__icon {
  flex-shrink: 0;
  font-size: 28px !important;
  color: var(--primary-800);
  line-height: 1;
}
.selectable-option__image {
  flex-shrink: 0;
  width: 48px;
  height: 48px;
  margin: 0;
  -o-object-fit: contain;
     object-fit: contain;
}
.selectable-option__text {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: var(--spacing-05, 2px);
}
.selectable-option__title {
  font-family: var(--display-font);
  font-size: 1rem;
  line-height: 1.3;
  letter-spacing: 0;
  font-weight: 400;
  color: var(--primary-800);
}
@media (min-width: 992px) {
  .selectable-option__title {
    font-size: 1.25rem;
    line-height: 1.25;
    letter-spacing: -0.01rem;
  }
}
.selectable-option__desc {
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.875rem;
  line-height: 1.6;
  color: var(--primary-500);
}
@media (min-width: 992px) {
  .selectable-option__desc {
    font-size: 0.9375rem;
    line-height: 1.6;
  }
}
.selectable-option.is-selected .selectable-option__desc {
  color: var(--primary-700);
}
.selectable-option__check {
  flex-shrink: 0;
  width: 24px;
  height: 24px;
  border-radius: 999px;
  background-color: var(--white);
  border: 1.5px solid var(--primary-100);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: background-color 0.18s ease, border-color 0.18s ease;
}
.selectable-option__check .material-symbols-outlined {
  font-size: 16px !important;
  color: var(--white);
  transition: color 0.18s ease;
}
.selectable-option.is-selected .selectable-option__check {
  background-color: var(--primary-800);
  border-color: var(--primary-800);
}
.selectable-option.is-selected .selectable-option__check .material-symbols-outlined {
  color: var(--white);
}

.allergy-chips {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--spacing-2);
}
@media (min-width: 992px) {
  .allergy-chips {
    grid-template-columns: 1fr 1fr;
  }
}

.allergy-chip {
  display: flex;
  align-items: center;
  gap: var(--spacing-2);
  padding: var(--spacing-2) var(--spacing-25);
  background-color: var(--tan-100);
  border: 1.5px solid transparent;
  border-radius: var(--spacing-2);
  cursor: pointer;
  transition: background-color 0.16s ease, border-color 0.16s ease, transform 0.12s ease;
  -webkit-tap-highlight-color: transparent;
}
@media (hover: hover) {
  .allergy-chip:hover:not(.is-selected) {
    border-color: var(--green-300);
  }
}
.allergy-chip:active {
  transform: scale(0.98);
}
.allergy-chip.is-selected {
  background-color: var(--green-300);
  border-color: var(--primary-800);
}
.allergy-chip__input {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}
.allergy-chip__image {
  flex-shrink: 0;
  width: 32px;
  height: 32px;
  margin: 0;
  -o-object-fit: contain;
     object-fit: contain;
}
.allergy-chip__label {
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.875rem;
  line-height: 1.6;
  font-weight: 500;
  color: var(--primary-800);
}
@media (min-width: 992px) {
  .allergy-chip__label {
    font-size: 0.9375rem;
    line-height: 1.6;
  }
}

.dog-zone__slider-wrap {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-1);
}

.dog-zone__slider {
  --fill: 0%;
  -moz-appearance: none;
       appearance: none;
  -webkit-appearance: none;
  width: 100% !important;
  margin-inline: 0 !important;
  padding: 0 !important;
  box-shadow: none !important;
  display: block;
  height: 6px;
  border-radius: 999px;
  background: linear-gradient(to right, var(--primary-800) 0%, var(--primary-800) var(--fill), var(--primary-100) var(--fill), var(--primary-100) 100%);
  cursor: pointer;
  outline: none;
}
.dog-zone__slider:hover, .dog-zone__slider:focus {
  outline: none !important;
  box-shadow: none !important;
}
.dog-zone__slider::-webkit-slider-runnable-track {
  background: transparent;
  height: 6px;
  border-radius: 999px;
}
.dog-zone__slider::-moz-range-track {
  background: transparent;
  height: 6px;
  border-radius: 999px;
}
.dog-zone__slider::-webkit-slider-thumb {
  -webkit-appearance: none;
  width: 22px;
  height: 22px;
  margin-top: -8px;
  border-radius: 999px;
  background: var(--green-300) !important;
  border: 2px solid var(--primary-800);
  cursor: grab;
  box-shadow: var(--shadow);
  position: relative;
  z-index: 2;
}
.dog-zone__slider::-moz-range-thumb {
  width: 22px;
  height: 22px;
  border-radius: 999px;
  background: var(--green-300);
  border: 2px solid var(--primary-800);
  cursor: grab;
  box-shadow: var(--shadow);
  position: relative;
  z-index: 2;
}
.dog-zone__slider:active::-webkit-slider-thumb {
  cursor: grabbing;
}
.dog-zone__slider:active::-moz-range-thumb {
  cursor: grabbing;
}

.dog-zone__slider-scale {
  display: flex;
  justify-content: space-between;
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.875rem;
  line-height: 1.6;
  color: var(--primary-500);
}
@media (min-width: 992px) {
  .dog-zone__slider-scale {
    font-size: 0.9375rem;
    line-height: 1.6;
  }
}

.dog-zone__confirm--always {
  display: inline-flex;
  align-self: flex-start;
}
.dog-zone__confirm--always[hidden] {
  display: none;
}

.madlib-field--weight {
  width: 3em;
}

.madlib-field__input--weight {
  text-align: center;
  -moz-appearance: textfield;
}
.madlib-field__input--weight::-webkit-outer-spin-button, .madlib-field__input--weight::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

.your-details-card {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-4);
}
.your-details-card__row {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-4);
}
@media (min-width: 992px) {
  .your-details-card__row {
    flex-direction: row;
    gap: var(--spacing-3);
  }
}
.your-details-card__row > .your-details-card__field {
  flex: 1;
  min-width: 0;
}
.your-details-card__field {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-1);
}
.your-details-card__label {
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.875rem;
  line-height: 1.6;
  font-weight: 600;
  color: var(--primary-800);
  margin: 0;
  text-align: left;
  align-self: flex-start;
}
@media (min-width: 992px) {
  .your-details-card__label {
    font-size: 0.9375rem;
    line-height: 1.6;
  }
}
.your-details-card__optional {
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.875rem;
  line-height: 1.6;
  font-weight: 400;
  color: var(--primary-500);
  margin-left: var(--spacing-1);
  font-style: italic;
}
@media (min-width: 992px) {
  .your-details-card__optional {
    font-size: 0.9375rem;
    line-height: 1.6;
  }
}
.your-details-card__input {
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 1rem;
  line-height: 1.6;
  font-weight: 400;
  color: var(--primary-800);
  padding: var(--spacing-2) var(--spacing-25) !important;
  background-color: var(--tan-100) !important;
  border: 1.5px solid transparent !important;
  border-radius: var(--spacing-2) !important;
  width: 100%;
  box-shadow: none !important;
  transition: border-color 0.15s ease, background-color 0.15s ease;
}
@media (min-width: 992px) {
  .your-details-card__input {
    font-size: 1.125rem;
    line-height: 1.6;
  }
}
.your-details-card__input::-moz-placeholder {
  color: var(--primary-300);
}
.your-details-card__input::placeholder {
  color: var(--primary-300);
}
.your-details-card__input:focus, .your-details-card__input:hover {
  outline: none !important;
  border-color: var(--green-300) !important;
  background-color: var(--white) !important;
  box-shadow: none !important;
}
.your-details-card__input--postcode {
  text-transform: uppercase;
}
.your-details-card__error {
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.875rem;
  line-height: 1.6;
  color: var(--rose-700);
  margin: 0;
}
@media (min-width: 992px) {
  .your-details-card__error {
    font-size: 0.9375rem;
    line-height: 1.6;
  }
}
.your-details-card__divider {
  border: none;
  border-top: 1px solid var(--primary-100);
  margin: var(--spacing-2) 0;
}
.your-details-card__consent {
  display: flex;
  align-items: center;
  gap: var(--spacing-2);
  cursor: pointer;
}
.your-details-card__consent-input {
  flex-shrink: 0;
  width: 20px;
  height: 20px;
  margin: 0;
  accent-color: var(--primary-800);
  cursor: pointer;
  box-shadow: none !important;
}
.your-details-card__consent-label {
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.875rem;
  line-height: 1.6;
  color: var(--primary-700);
  text-align: left;
}
@media (min-width: 992px) {
  .your-details-card__consent-label {
    font-size: 0.9375rem;
    line-height: 1.6;
  }
}
.your-details-card__phone-consents {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-2);
}
.your-details-card__phone-consents[hidden] {
  display: none;
}

.madlib-field--breed {
  width: 10em;
}
@supports (field-sizing: content) {
  .madlib-field--breed {
    width: auto;
  }
}

.madlib-field__input--breed {
  field-sizing: content;
  min-width: 6em;
  max-width: 14em;
  text-align: left;
}

.quiz-step--allergies .dog-zone.is-active .dog-zone__name-pill {
  display: inline-flex;
}

details summary {
  list-style: none;
  -webkit-appearance: none;
}

details summary::-webkit-details-marker {
  display: none;
}

details summary::marker {
  content: "";
}

summary.no-after::-webkit-details-marker {
  display: none;
}

.accordion {
  background: var(--secondary-300);
  border-radius: 1rem;
  text-align: left;
  width: 100%;
}
.accordion summary {
  background: var(--secondary-500);
  border-radius: 0.5rem;
}
.accordion summary {
  padding: var(--spacing-1);
}
@media (min-width: 992px) {
  .accordion summary {
    padding: var(--spacing-2);
  }
}
.accordion .accordion-content {
  padding: var(--spacing-1);
}
@media (min-width: 992px) {
  .accordion .accordion-content {
    padding: var(--spacing-2);
  }
}

.accordion-version-two {
  background: white;
}
.accordion-version-two .summary {
  display: flex;
  justify-content: space-between;
  position: relative;
  cursor: pointer;
}
.accordion-version-two .summary {
  padding: var(--spacing-2);
}
@media (min-width: 992px) {
  .accordion-version-two .summary {
    padding: var(--spacing-3);
  }
}
.accordion-version-two .summary::after {
  content: url(//www.tuggs.uk/assets/icons/crosshair-0e5fd25ea043384871ca42af57d29fb14415cccdb06f72155e400ac7468fea61.svg);
  width: 1.5rem;
  height: 1.5rem;
  position: absolute;
  right: 1rem;
  transform: translateX(-50%);
  transition: transform 0.3s ease, content 0.3s ease;
}
.accordion-version-two[open] .summary::after {
  content: url(//www.tuggs.uk/assets/icons/minimise-53ab82f47a5bcb143c6fad0c26b1528af7bc7e13aa37965465fdca3bcf6f1483.svg);
  transform: translateX(-50%) rotate(180deg);
}
.accordion-version-two .accordion-content {
  text-align: left;
}
.accordion-version-two .accordion-content {
  padding: var(--spacing-2);
}
@media (min-width: 992px) {
  .accordion-version-two .accordion-content {
    padding: var(--spacing-3);
  }
}

.selector-form-accordion summary {
  display: flex;
  justify-content: space-between;
  position: relative;
  cursor: pointer;
}
.selector-form-accordion summary::after {
  content: url(//www.tuggs.uk/assets/icons/arrow-white-05f95f48e5b310519e156586372033944e11105b70fbffef824844e98e30bb21.svg);
  width: 1.5rem;
  height: 1.5rem;
  position: absolute;
  scale: 0.8;
  right: 0.5rem;
  transform: rotate(-0.25turn);
  transition: transform 0.3s ease, content 0.3s ease;
}
.selector-form-accordion[open] summary::after {
  transform: rotate(0turn);
}
.selector-form-accordion .accordion-content {
  text-align: left;
}

.details-admin {
  background: var(--info-200);
}
.details-admin summary {
  background: var(--info-500);
}

.section.section-border {
  position: relative;
}
.section.section-border.top {
  padding-top: calc(var(--spacing-3) + 1.5rem);
}
@media (min-width: 992px) {
  .section.section-border.top {
    padding-top: calc(var(--spacing-3) + 3rem);
  }
}
.section.section-border > .section-border-top, .section.section-border > .section-border-bottom {
  width: 100%;
  height: 1.5rem;
  position: absolute;
}
@media (min-width: 992px) {
  .section.section-border > .section-border-top, .section.section-border > .section-border-bottom {
    height: 3rem;
  }
}
.section.section-border > .section-border-top svg, .section.section-border > .section-border-bottom svg {
  height: 110%;
  width: 100%;
}
.section.section-border > .section-border-top {
  top: 0;
  left: 0;
  transform: rotate(180deg);
}
.section.section-border > .section-border-bottom {
  bottom: 0;
  left: 0;
}
.section.section-border > .section-border-bottom.hero {
  transform: rotate(180deg) translateY(-90%);
}

.calendar-tile {
  position: relative;
  width: 3rem;
  background-color: var(--secondary-200);
  border-radius: 0.5rem;
}
.calendar-tile p {
  font-size: 3rem;
  text-align: center;
  vertical-align: middle;
  padding-top: 2.5rem;
}
@media (min-width: 768px) {
  .calendar-tile {
    width: 5rem;
  }
  .calendar-tile p {
    font-size: 5rem;
  }
}

.calendar-hanger {
  width: 50%;
  height: 5%;
  background-color: var(--success);
  position: absolute;
  top: 10%;
  left: 25%;
}

.calendar-tile.dashboard {
  width: 5rem;
}
.calendar-tile.dashboard p {
  font-size: 2.5rem;
}
.calendar-tile.dashboard p, .calendar-tile.dashboard h5 {
  text-align: center;
  padding-top: 0;
}
.calendar-tile.dashboard .padding-top {
  padding-top: 2.5rem;
}
@media (min-width: 992px) {
  .calendar-tile.dashboard {
    width: 8rem;
  }
}

.upcoming-orders {
  max-width: 14rem;
}
@media (min-width: 480px) {
  .upcoming-orders {
    max-width: 20rem;
  }
}
@media (min-width: 768px) {
  .upcoming-orders {
    max-width: revert;
  }
}

.upcoming-orders > .active {
  border: 0.25rem solid var(--success-600);
}
.upcoming-orders > .active i {
  position: absolute;
  top: 0;
  right: 0;
}

.cookies {
  background-color: white;
  border: 0.15rem solid var(--secondary-500);
  border-radius: 0.5rem;
  box-shadow: var(--shadow);
  padding: 20px;
  position: fixed;
  bottom: 1.25rem;
  left: 1.25rem;
  width: 400px;
  z-index: 10002;
}

.button-wrapper {
  display: flex;
  justify-content: center;
  gap: 1rem;
}
.button-wrapper .pill {
  color: white;
  background-color: var(--primary-800);
  font-size: 1rem;
  padding: 0.5rem 1rem;
  border-radius: 0.25rem;
}
.button-wrapper .pill.secondary {
  color: var(--primary-800);
  background-color: var(--secondary-500);
}

.dashboard-core-nav {
  display: none;
}
.dashboard-core-nav {
  padding: var(--spacing-3);
}
@media (min-width: 992px) {
  .dashboard-core-nav {
    padding: var(--spacing-4);
  }
}
.dashboard-core-nav {
  gap: var(--spacing-3);
}
@media (min-width: 992px) {
  .dashboard-core-nav {
    gap: var(--spacing-4);
  }
}
@media (min-width: 992px) {
  .dashboard-core-nav {
    display: flex !important;
    flex-direction: column !important;
  }
}

.dashboard-nav-home {
  background: var(--secondary-200);
  border-radius: 0.25rem;
  text-align: left;
}
.dashboard-nav-home.inactive {
  background: var(--success);
}
.dashboard-nav-home .bottom-content {
  padding: var(--spacing-2);
}

.dashboard-column {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-4);
}

.top-navigation {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0.25em 0.5em;
  border-radius: 0.25rem 0.25rem 0rem 0rem;
}
.top-navigation h4 {
  color: var(--primary-800);
}
.top-navigation img {
  transform: rotate(270deg);
  margin: 0;
}
.top-navigation.bg-primary *, .top-navigation.bg-primary-600 *, .top-navigation.bg-primary-700 *, .top-navigation.bg-primary-800 * {
  color: white;
}

.flash-container {
  position: absolute;
  top: 0.25rem;
  right: 0;
  left: 0;
  z-index: 2147483005;
}

.flash {
  padding: 0.5rem 0.5rem;
  margin: 1rem auto;
  border-radius: 0.5rem;
  max-width: 600px;
  font-size: 1rem;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  position: relative;
  animation: fadeIn 0.3s ease-out;
  width: 90vw;
}
@media (min-width: 992px) {
  .flash {
    width: 40vw;
  }
}
.flash button {
  width: 25px;
  height: 25px;
}
.flash.success {
  background-color: var(--success-50);
  color: var(--success-700);
  border: 1px solid var(--success-300);
}
.flash.info {
  background-color: var(--info-50);
  color: var(--info-900);
  border: 1px solid var(--info-300);
}
.flash.warning {
  background-color: var(--warning-50);
  color: var(--warning-900);
  border: 1px solid var(--warning-300);
}
@media (min-width: 992px) {
  .flash {
    font-size: 1rem;
  }
}
@keyframes fadeIn {
  from {
    opacity: 0;
    transform: translateY(-10px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.frame-with-header {
  padding: 1rem;
  padding-top: 2rem;
}
.frame-with-header.grey-border {
  border: 3px solid var(--primary-200);
}
.frame-with-header.grey-border .stick-left {
  background-color: white;
  border: 3px solid var(--primary-200);
}
.frame-with-header.green-border {
  border: 3px solid var(--success-500);
}
@media (min-width: 992px) {
  .frame-with-header {
    padding: 2rem;
  }
}

.frame-with-header:has(> .break-padding-lg) {
  padding-top: 8rem;
}
@media (min-width: 992px) {
  .frame-with-header:has(> .break-padding-lg) {
    padding-top: 6rem;
  }
}

.full-screen-modal {
  margin: 0;
  margin-top: 0 !important;
  padding-inline: 0;
  background-color: var(--secondary-200);
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100svh;
  overflow-y: scroll;
  z-index: 10000;
}
.full-screen-modal .close-button {
  position: absolute;
  top: 1rem;
  right: 1rem;
  z-index: 101;
}
.full-screen-modal .close-button .icon.close {
  width: 2.5rem;
}

.labelled-attribute {
  border-radius: var(--spacing-2);
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.labelled-attribute.bg-secondary {
  background-color: var(--secondary-200);
}
.labelled-attribute.max-30 {
  max-width: 30rem;
  margin-inline: auto;
}

.labelled-attribute-left {
  display: flex;
  align-items: center;
  text-align: left;
}

.labelled-attribute-right {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: right;
}

.custom-list {
  list-style: none;
}
.custom-list li {
  position: relative;
  margin-left: var(--spacing-5);
  text-align: left;
}
.custom-list li:before {
  left: 0;
  position: absolute;
}

.green-tick-list li:before {
  content: "";
  transform: translate(-2rem, 0.5rem);
  background-image: url(//www.tuggs.uk/assets/icons/tick-de04482fb8be46058d6d8df5e109b42bf55cc7188f7f6729899e704b1bceab37.svg);
  background-size: contain;
  background-color: var(--success);
  width: 1.75rem;
  height: 1.75rem;
  border-radius: 50%;
}
.green-tick-list li:before {
  padding: var(--spacing-1);
}
@media (min-width: 992px) {
  .green-tick-list li:before {
    padding: var(--spacing-2);
  }
}

.pink-tick-list li:before {
  content: "";
  transform: translate(-2rem, 0);
  background-image: url(//www.tuggs.uk/assets/graphic-elements/blue-tick-pink-background-0490fb63d821394d6794ab83ba29e8ce5384f93805d856aaec6dd3ae8b34f74b.svg);
  background-size: contain;
  background-repeat: no-repeat;
  width: 1.5rem;
  height: 1.5rem;
}
@media (min-width: 992px) {
  .pink-tick-list li:before {
    transform: translate(-2.5rem, 0.15rem);
    width: 2rem;
    height: 2rem;
  }
}

.yellow-splatter-list {
  counter-reset: custom-counter;
}
.yellow-splatter-list li {
  counter-increment: custom-counter;
}
.yellow-splatter-list li:before {
  content: "";
  transform: translate(-2.5rem, 0);
  background-image: url(//www.tuggs.uk/assets/graphic-elements/yellow-paint-splatter-3f76cd4307bbb8b3112ea9cf8b95b839b7ff0fb3f75aac62764fb97391e1df3f.svg);
  background-size: contain;
  background-repeat: no-repeat;
  width: 2.5rem;
  height: 2.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--display-font);
  font-size: 1.5rem;
}
@media (min-width: 992px) {
  .yellow-splatter-list li:before {
    transform: translate(-3rem, 0);
    width: 3rem;
    height: 3rem;
    font-size: 2rem;
  }
}

.feature-strip-section {
  width: 100%;
  padding: var(--spacing-5) var(--spacing-3);
}
@media (min-width: 992px) {
  .feature-strip-section {
    padding: var(--spacing-5) calc(9vw + var(--spacing-3));
  }
}
.feature-strip-section--white {
  background-color: var(--white);
  color: var(--primary-800);
}
.feature-strip-section--tan {
  background-color: var(--tan-100);
  color: var(--primary-800);
  border-top: 1px solid var(--tan-300);
  border-bottom: 1px solid var(--tan-300);
  padding-block: var(--spacing-6);
}
.feature-strip-section--tan .feature-strip {
  align-items: center;
  justify-content: center;
  gap: var(--spacing-5);
}
@media (min-width: 992px) {
  .feature-strip-section--tan .feature-strip {
    gap: var(--spacing-7);
  }
}
.feature-strip-section--tan .feature-strip__item {
  align-items: center;
}
.feature-strip-section--tan .feature-strip__icon-wrap {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.feature-strip-section--tan .feature-strip__icon {
  width: 80px;
  height: 80px;
  -o-object-fit: contain;
     object-fit: contain;
  display: block;
}
.feature-strip-section--tan .feature-strip__label {
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 1rem;
  line-height: 1.6;
  font-weight: 400;
  text-transform: uppercase;
  letter-spacing: 0.12em;
}
@media (min-width: 992px) {
  .feature-strip-section--tan .feature-strip__label {
    font-size: 1.125rem;
    line-height: 1.6;
  }
}
.feature-strip-section--navy {
  background-color: var(--primary-800);
  color: var(--white);
}

.feature-strip {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--spacing-4);
  overflow-x: auto;
  scrollbar-width: none;
}
.feature-strip::-webkit-scrollbar {
  display: none;
}
@media (min-width: 992px) {
  .feature-strip {
    gap: var(--spacing-5);
    overflow-x: visible;
  }
}
.feature-strip__item {
  display: flex;
  align-items: center;
  gap: var(--spacing-25);
  flex: 0 0 auto;
}
.feature-strip__icon {
  width: 52px;
  height: 52px;
  flex-shrink: 0;
}
.feature-strip__label {
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.9375rem;
  line-height: 1.6;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  white-space: nowrap;
}
@media (min-width: 992px) {
  .feature-strip__label {
    font-size: 1rem;
    line-height: 1.6;
  }
}

.mini-card {
  display: flex;
  max-width: 30rem;
  gap: var(--spacing-1);
  border-radius: 0.5rem;
  align-items: center;
  text-align: left;
  overflow-x: hidden;
}
.mini-card.border {
  border-radius: 0rem;
}
.mini-card.even > div {
  width: 50%;
}
.mini-card.extras-index {
  max-width: 60rem;
  height: -moz-fit-content;
  height: fit-content;
  overflow-x: visible;
}
.mini-card.extras-index .quantity-stepper {
  margin-inline: var(--spacing-3);
  margin-top: var(--spacing-3);
}
.mini-card.extras-index a, .mini-card.extras-index .btn {
  padding: var(--spacing-1) var(--spacing-2);
}
.mini-card.extras-index .extras-content {
  width: 100%;
}
.mini-card.extras-index > :first-child {
  width: 15rem;
  height: 20rem;
}
@media (min-width: 992px) {
  .mini-card.extras-index > :first-child {
    width: 30%;
  }
}
.mini-card img {
  margin: 0;
}
.mini-card.secondary {
  background: var(--secondary-200);
}
.mini-card.text-heavy h3 {
  padding-bottom: 0;
}
.mini-card.text-heavy p {
  padding-top: 0;
}

.notifier {
  text-align: left;
  border-radius: var(--spacing-2);
}
.notifier .heading-content {
  display: flex;
  align-items: center;
}
.notifier .heading-content {
  padding: var(--spacing-1);
}
@media (min-width: 992px) {
  .notifier .heading-content {
    padding: var(--spacing-2);
  }
}
.notifier .heading-content {
  gap: var(--spacing-1);
}
@media (min-width: 992px) {
  .notifier .heading-content {
    gap: var(--spacing-2);
  }
}
.notifier.success {
  background-color: var(--success-50);
  border: 1px solid var(--success-100);
}
.notifier.success.sm {
  background-color: var(--tan-50);
  border: 1px solid var(--success-700);
}
.notifier.info {
  background-color: var(--info-50);
  border: 1px solid var(--info-100);
  color: var(--info-900);
}
.notifier.danger {
  background-color: var(--danger-50);
  border: 1px solid var(--danger-300);
  color: var(--danger-900);
}
.notifier.tan {
  border: 2px solid var(--tan-500);
}

.product-card a, .details-product-card a {
  font-weight: bolder;
}
.product-card a:hover, .details-product-card a:hover {
  color: var(--primary-600);
}
.product-card.hover-effect:hover, .details-product-card.hover-effect:hover {
  transform: rotate(1deg);
}

.quantity-stepper {
  display: flex;
  justify-content: space-evenly;
  align-items: center;
  max-width: -moz-fit-content;
  max-width: fit-content;
}
.quantity-stepper .btn {
  margin-top: 0;
}
.quantity-stepper .stepper-content > * {
  margin: 0;
}
.quantity-stepper .stepper-content input {
  max-width: 4rem;
}

.recipe-marketing-card {
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.recipe-marketing-card .top-content {
  position: relative;
}
.recipe-marketing-card .banner {
  position: absolute;
  top: 0.5rem;
  left: 0;
  width: -moz-fit-content;
  width: fit-content;
}
.recipe-marketing-card .pill {
  position: absolute;
  bottom: var(--spacing-25);
  left: 0;
  right: 0;
  margin: auto;
  width: -moz-fit-content;
  width: fit-content;
}
.recipe-marketing-card .bottom-nav {
  margin-top: auto;
}

.recipe-marketing-card.greyed-out {
  opacity: 0.7;
}

.section-heading__inner {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-5);
  padding: var(--spacing-5) var(--spacing-4);
  text-align: left;
}
@media (min-width: 992px) {
  .section-heading__inner {
    padding: var(--spacing-7) var(--spacing-8);
    gap: var(--spacing-6);
    max-width: 82%;
    margin-inline: auto;
  }
}
.section-heading__header {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-3);
}
.section-heading__eyebrow {
  color: var(--primary-800);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.18em;
  margin: 0;
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.875rem;
  line-height: 1.6;
}
@media (min-width: 992px) {
  .section-heading__eyebrow {
    font-size: 0.9375rem;
    line-height: 1.6;
  }
}
.section-heading__title {
  color: var(--primary-800);
  font-weight: 400;
  margin: 0;
  font-family: var(--display-font);
  font-size: 2rem;
  line-height: 1.18;
  letter-spacing: -0.05rem;
}
@media (min-width: 992px) {
  .section-heading__title {
    font-size: 2.5rem;
    line-height: 1.15;
    letter-spacing: -0.06rem;
  }
}
.section-heading__title strong {
  font-weight: 800;
}
.section-heading__title em {
  font-style: italic;
  font-weight: 800;
}

.selectable-card {
  position: relative;
  width: -moz-fit-content;
  width: fit-content;
}
.selectable-card input {
  transform: scale(0);
}
.selectable-card label {
  cursor: pointer;
}
.selectable-card label::before {
  content: "";
}
.selectable-card .recipe-marketing-card {
  border: none;
  background-color: white;
}
.selectable-card label.label-mid-left::before {
  position: absolute;
  width: 18px;
  height: 18px;
  border: 1px solid var(--tan);
  border-radius: 50%;
  top: 50%;
  left: 5%;
}
@media (min-width: 992px) {
  .selectable-card label.label-mid-left::before {
    scale: 1.5;
  }
}

.selectable-card:has(input[type=radio]:checked ~ label), .selectable-card:has(input[type=checkbox]:checked ~ label) {
  scale: 1.025;
}
.selectable-card:has(input[type=radio]:checked ~ label) .border, .selectable-card:has(input[type=checkbox]:checked ~ label) .border {
  border: 2px solid var(--success);
}
.selectable-card:has(input[type=radio]:checked ~ label) .recipe-marketing-card, .selectable-card:has(input[type=checkbox]:checked ~ label) .recipe-marketing-card {
  border: var(--success-900) 2px solid;
  background-color: var(--success-10);
}
.selectable-card:has(input[type=radio]:checked ~ label) .card-content, .selectable-card:has(input[type=checkbox]:checked ~ label) .card-content {
  border: 2px solid var(--success);
  background-color: var(--success-10) !important;
}
.selectable-card:has(input[type=radio]:checked ~ label) label.label-top-right::before, .selectable-card:has(input[type=checkbox]:checked ~ label) label.label-top-right::before {
  content: url(//www.tuggs.uk/assets/icons/tick-with-green-bg-cb953beaa44ed4e996b02c2047c19cca95ffc974c959e5d889f8d644afaec51b.svg);
  position: absolute;
  color: var(--primary-600);
  font-size: 1rem;
  top: 2rem;
  right: 1rem;
  z-index: 100;
}
@media (min-width: 992px) {
  .selectable-card:has(input[type=radio]:checked ~ label) label.label-top-right::before, .selectable-card:has(input[type=checkbox]:checked ~ label) label.label-top-right::before {
    scale: 1.3;
  }
}
.selectable-card:has(input[type=radio]:checked ~ label) label.label-mid-left::before, .selectable-card:has(input[type=checkbox]:checked ~ label) label.label-mid-left::before {
  content: url(//www.tuggs.uk/assets/icons/tick-with-green-bg-cb953beaa44ed4e996b02c2047c19cca95ffc974c959e5d889f8d644afaec51b.svg);
  position: absolute;
  border: none;
  color: var(--primary-600);
  font-size: 1rem;
  top: 50%;
  left: 5%;
}
@media (min-width: 992px) {
  .selectable-card:has(input[type=radio]:checked ~ label) label.label-mid-left::before, .selectable-card:has(input[type=checkbox]:checked ~ label) label.label-mid-left::before {
    scale: 1.5;
  }
}

.selectable-card.unsuitable:has(input[type=checkbox]:checked ~ label) label::before {
  z-index: 1;
  color: white;
}

.tape-banner-section {
  background-color: #fff;
  padding-top: var(--spacing-5);
  overflow: hidden;
}
@media (min-width: 992px) {
  .tape-banner-section {
    padding-top: var(--spacing-7);
  }
}
.tape-banner-section--bottom {
  padding-top: 0;
  padding-bottom: var(--spacing-5);
}
@media (min-width: 992px) {
  .tape-banner-section--bottom {
    padding-top: 0;
    padding-bottom: var(--spacing-7);
  }
}
.tape-banner-section--flush-top {
  padding-top: 0;
}
@media (min-width: 992px) {
  .tape-banner-section--flush-top {
    padding-top: 0;
  }
}

.tape-banner {
  position: relative;
  background-color: var(--primary-800);
  overflow: hidden;
  padding-block: var(--spacing-2);
  margin-inline: calc(var(--spacing-4) * -1);
}
@media (min-width: 992px) {
  .tape-banner {
    padding-block: var(--spacing-25);
  }
}
.tape-banner--yellow {
  background-color: var(--yellow-500);
}
.tape-banner--yellow .tape-banner__phrase,
.tape-banner--yellow .tape-banner__separator {
  color: var(--primary-800);
}
.tape-banner--pink {
  background-color: var(--pink-500);
}
.tape-banner--pink .tape-banner__phrase,
.tape-banner--pink .tape-banner__separator {
  color: var(--primary-800);
}
.tape-banner--purple {
  background-color: var(--purple-500);
}
.tape-banner--purple .tape-banner__phrase,
.tape-banner--purple .tape-banner__separator {
  color: var(--white);
}
.tape-banner--orange {
  background-color: var(--orange-500);
}
.tape-banner--orange .tape-banner__phrase,
.tape-banner--orange .tape-banner__separator {
  color: var(--primary-800);
}
.tape-banner--green {
  background-color: var(--green-300);
}
.tape-banner--green .tape-banner__phrase,
.tape-banner--green .tape-banner__separator {
  color: var(--primary-800);
}
.tape-banner--link {
  display: block;
  text-decoration: none;
  cursor: pointer;
  color: inherit;
}

.tape-banner__track {
  display: flex;
  align-items: center;
  gap: var(--spacing-4);
  width: -moz-max-content;
  width: max-content;
  white-space: nowrap;
  will-change: transform;
}
@media (min-width: 992px) {
  .tape-banner__track {
    gap: var(--spacing-5);
  }
}

.tape-banner__phrase,
.tape-banner__separator {
  color: #fff;
  font-weight: 400;
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.9375rem;
  line-height: 1.6;
}
@media (min-width: 992px) {
  .tape-banner__phrase,
  .tape-banner__separator {
    font-size: 1rem;
    line-height: 1.6;
  }
}

.tape-banner__phrase {
  text-transform: uppercase;
  letter-spacing: 0.18em;
}
.tape-banner__phrase strong {
  font-weight: 800;
}

.tooltip {
  height: -moz-fit-content;
  height: fit-content;
  cursor: pointer;
}
.tooltip img {
  width: 24px;
}
.tooltip:hover .tooltip-text {
  opacity: 1;
}
.tooltip .tooltip-text {
  letter-spacing: normal;
  text-transform: none;
  font-weight: normal;
  background-color: var(--secondary-200);
  border: 1px solid var(--secondary-500);
  text-align: center;
  border-radius: var(--spacing-2);
  padding: var(--spacing-3);
  box-shadow: var(--shadow);
  height: -moz-fit-content;
  height: fit-content;
  max-width: 8rem;
  position: fixed;
  z-index: 1000;
  opacity: 1;
  transition: opacity 5s;
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.9375rem;
  line-height: 1.6;
}
@media (min-width: 992px) {
  .tooltip .tooltip-text {
    font-size: 1rem;
    line-height: 1.6;
  }
}
@media (min-width: 992px) {
  .tooltip .tooltip-text {
    max-width: 15rem;
  }
}
.tooltip .tooltip-text.d-none {
  opacity: 0;
}

.dialog dialog {
  background-color: transparent;
  border: none;
  width: 90%;
  padding: 0;
}
.dialog dialog {
  padding: var(--spacing-3);
}
@media (min-width: 992px) {
  .dialog dialog {
    padding: var(--spacing-4);
  }
}
.dialog dialog > .frame {
  margin-top: 0;
}
@media (min-width: 992px) {
  .dialog dialog {
    width: 75%;
  }
}
.dialog.shop dialog {
  padding: 0;
}
@media (min-width: 992px) {
  .dialog.announcement-dialog dialog {
    width: 700px;
  }
}
.dialog dialog::backdrop {
  background-color: rgba(0, 0, 0, 0.5);
}
.dialog .no-border {
  border: none;
}
.dialog .yellow.image {
  padding: 0;
  background-color: var(--white);
}
.dialog .yellow.image .top-container {
  width: 100%;
  background-color: var(--warning-300);
}
.dialog .yellow.image img {
  width: 50%;
  transform: translateY(25%) rotate(1deg);
  border: 2px solid var(--primary-800);
  border-radius: var(--spacing-2);
  box-shadow: var(--shadow);
}
@media (min-width: 992px) {
  .dialog .yellow.image img {
    width: 25%;
  }
}
.dialog .yellow.image .content-container {
  margin-top: 4rem;
  padding: var(--spacing-2);
}
@media (min-width: 992px) {
  .dialog .yellow.image .content-container {
    padding: var(--spacing-3);
  }
}
@media (min-width: 768px) {
  .dialog .yellow.image .content-container {
    margin-top: 6rem;
  }
}
.dialog .red.image {
  padding: 0;
  background-color: var(--white);
}
.dialog .red.image .top-container {
  width: 100%;
  background-color: var(--red-300);
}
.dialog .green.image {
  padding: 0;
  background-color: var(--white);
}
.dialog .green.image .top-container {
  width: 100%;
  background-color: var(--green-300);
}
.dialog .purple.image {
  padding: 0;
  background-color: var(--white);
}
.dialog .purple.image .top-container {
  width: 100%;
  background-color: var(--purple-300);
}
.dialog .yellow {
  background-color: var(--warning-300);
}
.dialog .red {
  background-color: var(--danger-300);
}
.dialog .green {
  background-color: var(--success-300);
}
.dialog .purple {
  background-color: var(--info-300);
}
.dialog .tan {
  background-color: var(--secondary-200);
}
.dialog .background {
  background-size: cover;
  background-position: center;
}
.dialog .zzz {
  background-image: url(//www.tuggs.uk/assets/graphic-elements/zzz-white-53161e765c64217d7456f34f3d6af6202909d5ae209641ce213e7617f0de5774.svg);
}
.dialog .loop {
  background-image: url(//www.tuggs.uk/assets/graphic-elements/loop-white-0eee55e3434b29219fe59c710a6bcd1c7119c07188df8749ad82040cb11c9686.svg);
}
.dialog .image .image-container .yellow {
  background-color: var(--warning-300);
}

.dialog-button {
  text-transform: none;
  text-align: left;
  text-decoration: underline;
  font-weight: revert;
  background: none;
  border: none;
  padding: 0;
  cursor: pointer;
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 1rem;
  line-height: 1.6;
}
@media (min-width: 992px) {
  .dialog-button {
    font-size: 1.125rem;
    line-height: 1.6;
  }
}
.dialog-button:focus {
  outline: none;
  background: none;
}
.dialog-button:hover {
  background: none;
}
.dialog-button.close {
  position: absolute;
  top: 1.5rem;
  right: 1.5rem;
  text-decoration: none;
  background-color: var(--tan);
}
.dialog-button.close:hover {
  background-color: var(--yellow);
}
@media (min-width: 992px) {
  .dialog-button.close {
    top: 2rem;
    right: 2rem;
  }
}
.dialog-button.close img {
  width: 1.5rem !important;
}

.carousel {
  overflow-y: overlay;
}

.scrollbar-hidden::-webkit-scrollbar {
  display: none; /* Hide scrollbar */
}

.carousel-container > * {
  scroll-snap-align: center;
  flex: none;
}

.visible-1 > * {
  width: 100%;
  height: 20rem;
}

.visible-3 > * {
  width: 50%;
}
@media (min-width: 992px) {
  .visible-3 > * {
    width: 30%;
  }
}

.visible-5 > * {
  width: 80%;
}
@media (min-width: 992px) {
  .visible-5 > * {
    width: 22%;
  }
}

.visible-7 > * {
  width: 50%;
}
@media (min-width: 992px) {
  .visible-7 > * {
    width: 16.6667%;
  }
}

.image-carousel {
  overflow-y: clip;
}

.sm-carousel {
  display: grid;
  grid-auto-flow: column;
  overflow-x: auto;
  overflow-y: hidden;
  scroll-snap-type: x mandatory;
}
.sm-carousel a, .sm-carousel div {
  scroll-snap-align: start;
}
.sm-carousel::-webkit-scrollbar {
  display: none;
}
@media (min-width: 992px) {
  .sm-carousel {
    overflow-x: initial;
    grid-template-columns: auto;
  }
}
.sm-carousel.md-col-3 {
  grid-auto-columns: 60vw;
}
@media (min-width: 768px) {
  .sm-carousel.md-col-3 {
    grid-template-columns: repeat(3, 1fr);
    overflow-x: initial;
  }
}
.sm-carousel.lg-col-3 {
  grid-auto-columns: 60vw;
}
@media (min-width: 992px) {
  .sm-carousel.lg-col-3 {
    grid-template-columns: repeat(3, 1fr);
    overflow-x: initial;
  }
}
.sm-carousel.lg-col-4 {
  grid-auto-columns: 60vw;
}
@media (min-width: 992px) {
  .sm-carousel.lg-col-4 {
    grid-template-columns: repeat(4, 1fr);
    overflow-x: initial;
  }
}
.sm-carousel.lg-col-5 {
  grid-auto-columns: 60vw;
}
@media (min-width: 992px) {
  .sm-carousel.lg-col-5 {
    grid-template-columns: repeat(5, 1fr);
    overflow-x: initial;
  }
}
.sm-carousel.press-carousel {
  grid-auto-columns: minmax(7rem, auto);
}

.carousel-container {
  overflow: hidden;
}

.carousel-grid-2-5 {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: 37%;
  gap: 1rem;
  overflow-x: auto;
  overflow-y: hidden;
  scroll-snap-type: x mandatory;
  padding-bottom: 0.5rem;
}
@media (min-width: 992px) {
  .carousel-grid-2-5 {
    grid-auto-columns: 20%;
  }
}

.carousel-grid-2-5 > div {
  scroll-snap-align: start;
}

.carousel-grid-1-5 {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: 57%;
  gap: 1rem;
  overflow-x: auto;
  overflow-y: hidden;
  scroll-snap-type: x mandatory;
  padding-bottom: 0.5rem;
}
@media (min-width: 992px) {
  .carousel-grid-1-5 {
    grid-auto-columns: 20%;
  }
}

.carousel-grid-1-5 > div {
  scroll-snap-align: start;
}

.carousel-grid-1-4 {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: 74%;
  gap: 1rem;
  overflow-x: auto;
  overflow-y: hidden;
  scroll-snap-type: x mandatory;
  padding-bottom: 0.5rem;
}
@media (min-width: 992px) {
  .carousel-grid-1-4 {
    grid-auto-columns: 26%;
  }
}

.carousel-grid-1-4 > div,
.carousel-grid-1-4 > a {
  scroll-snap-align: start;
}

.carousel-grid-2-3 {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: 54%;
  gap: 1rem;
  overflow-x: auto;
  overflow-y: hidden;
  scroll-snap-type: x mandatory;
  padding-bottom: 0.5rem;
}
@media (min-width: 992px) {
  .carousel-grid-2-3 {
    grid-auto-columns: 36%;
  }
}

.carousel-grid-1-3 > div {
  scroll-snap-align: start;
}

.carousel-grid-3-4 {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: 32%;
  gap: 1rem;
  overflow-x: auto;
  overflow-y: hidden;
  scroll-snap-type: x mandatory;
  padding-bottom: 0.5rem;
}
@media (min-width: 992px) {
  .carousel-grid-3-4 {
    grid-auto-columns: 26%;
  }
}

.carousel-grid-1-4 > div,
.carousel-grid-1-4 > a {
  scroll-snap-align: start;
}

.footer {
  background: var(--primary-800);
  background-image: url(//www.tuggs.uk/assets/graphic-elements/spike-navy-700-87e65b96840c064a31af8e0470d1a694b013b7fc0dff01008290119256dfd1c7.svg);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: top center;
  text-align: center;
}
.footer ul {
  padding: 0;
}
.footer li {
  padding-block: var(--spacing-2);
}
@media (min-width: 992px) {
  .footer {
    text-align: left;
  }
}
.footer .mobile-margin {
  margin-top: var(--spacing-6);
}
@media (min-width: 992px) {
  .footer .mobile-margin {
    margin-top: 0;
  }
}
.footer *, .footer a:visited {
  color: white;
  list-style: none;
}
.footer .top-content, .footer .bottom-content {
  width: 100%;
}
.footer .bottom-content {
  align-items: center;
}
.footer .bottom-content img {
  margin-inline: var(--spacing-2);
}
.footer .bottom-content .wordmark {
  width: 25%;
}
@media (min-width: 992px) {
  .footer .bottom-content .wordmark {
    width: 10%;
  }
}

.checkout-footer, .edit-details-footer {
  padding-top: 0;
  background-color: var(--tan-200);
  position: fixed;
  z-index: 10;
  left: 0;
  bottom: 0;
  width: 100%;
  background-image: unset;
}
.checkout-footer, .edit-details-footer {
  padding: var(--spacing-2);
}
@media (min-width: 992px) {
  .checkout-footer, .edit-details-footer {
    padding: var(--spacing-3);
  }
}
.checkout-footer *, .checkout-footer a:visited, .edit-details-footer *, .edit-details-footer a:visited {
  color: unset;
}
.checkout-footer .button-group, .edit-details-footer .button-group {
  display: flex;
  align-items: center;
  justify-content: space-evenly;
}
.checkout-footer a, .edit-details-footer a {
  display: block;
}
.checkout-footer input[type=submit], .edit-details-footer input[type=submit] {
  margin-top: 0 !important;
}

.edit-details-footer {
  padding-top: 0;
  padding-bottom: 4rem;
  transform: translateY(1rem);
}
@media (min-width: 992px) {
  .edit-details-footer {
    padding-bottom: 1rem;
  }
}
.edit-details-footer a {
  margin-top: 0 !important;
}

.sticky-footer {
  position: fixed;
  z-index: 9999;
  left: 0;
  bottom: 0;
  width: 100%;
  box-shadow: 0 0.4rem 2rem rgba(0, 0, 0, 0.1);
  padding-bottom: env(safe-area-inset-bottom);
}
.sticky-footer.form {
  touch-action: manipulation;
}

.social-proof-footer__inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--spacing-2);
  padding-block: var(--spacing-3);
}
@media (min-width: 992px) {
  .social-proof-footer__inner {
    flex-direction: row;
    justify-content: center;
    gap: var(--spacing-5);
    padding-block: var(--spacing-5);
  }
}

.social-proof-footer__title {
  margin: 0;
  color: var(--white);
  text-align: center;
  font-family: var(--display-font);
  font-size: 1rem;
  line-height: 1.3;
  letter-spacing: 0;
}
@media (min-width: 992px) {
  .social-proof-footer__title {
    font-size: 1.25rem;
    line-height: 1.25;
    letter-spacing: -0.01rem;
  }
}

.sticky-footer-checkout {
  position: sticky;
  z-index: 9999;
  left: 0;
  bottom: 0;
  width: 100%;
  padding-bottom: env(safe-area-inset-bottom);
}
.sticky-footer-checkout.form {
  touch-action: manipulation;
}
@media (min-width: 992px) {
  .sticky-footer-checkout {
    position: fixed;
  }
}

.auto-footer-checkout {
  width: 100%;
  padding-bottom: env(safe-area-inset-bottom);
}
.auto-footer-checkout.form {
  touch-action: manipulation;
}
@media (min-width: 992px) {
  .auto-footer-checkout {
    position: fixed;
    z-index: 9999;
    left: 0;
    bottom: 0;
    width: 100%;
    padding-bottom: env(safe-area-inset-bottom);
  }
}

.sticky-footer hr,
.sticky-footer::before,
.sticky-footer::after {
  pointer-events: none;
}

.hero-image {
  aspect-ratio: 960/700;
  width: 100%;
  height: auto;
  -o-object-fit: cover;
     object-fit: cover;
}

.taster-box-hero {
  background-blend-mode: soft-light;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: top center;
}
.taster-box-hero .absolute {
  position: absolute;
  transform: translate(-10%, -10%) rotate(-1deg);
}
@media (min-width: 992px) {
  .taster-box-hero .absolute {
    transform: translate(-25%, -25%) rotate(1deg);
  }
}

.bg-pink.background {
  background-image: url(//www.tuggs.uk/assets/graphic-elements/spike-rose-300-7512783eee8622fdb46a1f92b1161391b910a549c8227e18ba83472d4b55a2e0.svg);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: top center;
}

.bg-blue.background {
  background-image: url(//www.tuggs.uk/assets/graphic-elements/spike-green-300-3db0dd3de04c4d953093504e27e38fad1b8976afeaf24c7e024fd85a267150d0.svg);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: top center;
}

.recipe-hero-1.bg-yellow.background {
  background-image: url(//www.tuggs.uk/assets/graphic-elements/grid-green-500-d881eef75ba7fe55902bee5ae2041672bdccef301248434457ce2a5abac6f586.svg);
  background-repeat: no-repeat;
  background-size: 2000%;
  background-position: center center;
}
@media (min-width: 992px) {
  .recipe-hero-1.bg-yellow.background {
    background-size: 150%;
    background-position: -75% bottom;
  }
}
.recipe-hero-1.bg-orange.background {
  background-image: url(//www.tuggs.uk/assets/graphic-elements/grid-yellow-300-02ebfa861029551edbf2152a0688d25fdbb93528eeb872c2e6f10315eb4832eb.svg);
  background-repeat: no-repeat;
  background-size: 2000%;
  background-position: center center;
}
@media (min-width: 992px) {
  .recipe-hero-1.bg-orange.background {
    background-size: 150%;
    background-position: -75% bottom;
  }
}
.recipe-hero-1.bg-pink.background {
  background-image: url(//www.tuggs.uk/assets/graphic-elements/grid-rose-500-6163d2ee45a9f2afeb13617b297f68d2f7205d9247297c15df50161139065fbb.svg);
  background-repeat: no-repeat;
  background-size: 2000%;
  background-position: center center;
}
@media (min-width: 992px) {
  .recipe-hero-1.bg-pink.background {
    background-size: 150%;
    background-position: -75% bottom;
  }
}
.recipe-hero-1.bg-purple.background {
  background-image: url(//www.tuggs.uk/assets/graphic-elements/grid-purple-500-5cbfd0b5eb3fe79972a5a4ac260aa6cb3e4bb3edf94f7fc651b780a0de58b445.svg);
  background-repeat: no-repeat;
  background-size: 2000%;
  background-position: center center;
}
@media (min-width: 992px) {
  .recipe-hero-1.bg-purple.background {
    background-size: 150%;
    background-position: -75% bottom;
  }
}
.recipe-hero-1.bg-green.background {
  background-image: url(//www.tuggs.uk/assets/graphic-elements/grid-yellow-300-02ebfa861029551edbf2152a0688d25fdbb93528eeb872c2e6f10315eb4832eb.svg);
  background-repeat: no-repeat;
  background-size: 2000%;
  background-position: center center;
}
@media (min-width: 992px) {
  .recipe-hero-1.bg-green.background {
    background-size: 150%;
    background-position: -75% bottom;
  }
}

.bg-extra-hero.tuggs-for-tummies {
  background-color: var(--orange);
  background-image: url(//www.tuggs.uk/assets/graphic-elements/zzz-yellow-300-7cbb14a263cd341e1c1889e89adda9cacce339c875e14d17f18673dcd2289d43.svg);
  background-repeat: no-repeat;
  background-size: 100%;
  background-position: bottom center;
}
@media (min-width: 992px) {
  .bg-extra-hero.tuggs-for-tummies {
    background-size: 50%;
    background-position: top right;
  }
}
.bg-extra-hero.tuggs-for-chilling {
  background-color: var(--pink);
  background-image: url(//www.tuggs.uk/assets/graphic-elements/zzz-green-300-0d29f5bc209e27e911520a8e290c69463971a22d058ba5dd67afab371a8f09a6.svg);
  background-repeat: no-repeat;
  background-size: 100%;
  background-position: bottom center;
}
@media (min-width: 992px) {
  .bg-extra-hero.tuggs-for-chilling {
    background-size: 50%;
    background-position: top right;
  }
}
.bg-extra-hero.venison-and-mealworm-treats {
  background-color: var(--purple);
  background-image: url(//www.tuggs.uk/assets/graphic-elements/zzz-pink-4cab82ceb4c4962d0bbb664a32773b199fffe8ca27f99520f087e131e6a42112.svg);
  background-repeat: no-repeat;
  background-size: 100%;
  background-position: bottom center;
}
@media (min-width: 992px) {
  .bg-extra-hero.venison-and-mealworm-treats {
    background-size: 50%;
    background-position: top right;
  }
}
.bg-extra-hero.whitefish-treats {
  background-color: var(--pink);
  background-image: url(//www.tuggs.uk/assets/graphic-elements/zzz-rose-f27e370a0bd548cfd3dc33f1e83ccdaf34371288515afc88fa263c4e421f9373.svg);
  background-repeat: no-repeat;
  background-size: 100%;
  background-position: bottom center;
}
@media (min-width: 992px) {
  .bg-extra-hero.whitefish-treats {
    background-size: 50%;
    background-position: top right;
  }
}
.bg-extra-hero.lamb-treats {
  background-color: #88DEFF;
  background-image: url(//www.tuggs.uk/assets/graphic-elements/zzz-blue-088f08c33a5f5c59677966ac0850b5dd1293690d0339330a27587afec312a828.svg);
  background-repeat: no-repeat;
  background-size: 100%;
  background-position: bottom center;
}
@media (min-width: 992px) {
  .bg-extra-hero.lamb-treats {
    background-size: 50%;
    background-position: top right;
  }
}
.bg-extra-hero.gut-health-supplement {
  background-color: var(--white);
  background-image: url(//www.tuggs.uk/assets/graphic-elements/zzz-rose-f27e370a0bd548cfd3dc33f1e83ccdaf34371288515afc88fa263c4e421f9373.svg);
  background-repeat: no-repeat;
  background-size: 100%;
  background-position: bottom center;
}
@media (min-width: 992px) {
  .bg-extra-hero.gut-health-supplement {
    background-size: 50%;
    background-position: top right;
  }
}

.hero__inner {
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: center;
  gap: 2rem;
}

.hero__left, .hero__right {
  min-width: 0;
}

.hero__left {
  padding-inline: var(--spacing-3);
}

@media (min-width: 992px) {
  .hero__left {
    padding-inline-start: var(--spacing-8);
    padding-inline-end: var(--spacing-5);
  }
  .hero--right {
    position: relative;
  }
  .hero-picture {
    display: block;
    clip-path: polygon(7% 0%, 100% 0%, 100% 100%, 0% 100%);
  }
}
.hero-spin-badge {
  position: absolute;
  right: var(--spacing-4);
  width: 120px;
  height: 120px;
  pointer-events: none;
}
.hero-spin-badge svg {
  width: 100%;
  height: 100%;
}
.hero-spin-badge text {
  fill: var(--primary-800);
  font-family: var(--body-font);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.25em;
  text-transform: uppercase;
}
.hero-spin-badge__logo {
  position: absolute;
  inset: 0;
  margin: auto;
  width: 115px;
  height: auto;
}
@media (min-width: 992px) {
  .hero-spin-badge {
    width: 155px;
    height: 155px;
    right: var(--spacing-5);
  }
}

.hero-card {
  width: min(640px, 92%);
  margin-inline: auto;
  padding: clamp(16px, 2.5vw, 32px);
  border-radius: var(--spacing-5);
}

.hero-card h1 {
  max-width: 22ch;
  font-size: clamp(32px, 3.2vw, 52px);
  line-height: 1.15;
}

.hero-card h2 {
  max-width: 30ch;
  font-size: clamp(28px, 1.6vw, 42px);
  line-height: 1.25;
}

.hero__right picture {
  display: block;
  width: 100vw;
  margin-right: calc(-50vw + 50%);
}

.hero-image {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 5/4;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: 65% 50%;
     object-position: 65% 50%;
}

@media (min-width: 1200px) and (max-width: 1440px) {
  .hero {
    max-height: 75vh;
  }
  .hero-card {
    width: min(560px, 90%);
    padding: clamp(16px, 2vw, 28px);
  }
  .hero__inner {
    grid-template-columns: 0.9fr 1.1fr;
  }
  .hero-card h1 {
    max-width: 20ch;
    font-size: clamp(30px, 2.6vw, 42px);
  }
  .hero-card h2 {
    max-width: 28ch;
    font-size: clamp(18px, 1.4vw, 22px);
  }
}
@media (max-width: 800px) {
  .hero__inner {
    grid-template-columns: 1fr;
    gap: 1.25rem;
  }
  .hero--right {
    order: 2;
  }
  .hero__left {
    order: 1;
    margin-top: 1.5rem;
    margin-bottom: 0.5rem;
  }
}
.hero-v2 {
  position: relative;
  overflow: hidden;
}
.hero-v2 .hero-spin-badge {
  bottom: var(--spacing-4);
  right: var(--spacing-3);
}
@media (min-width: 992px) {
  .hero-v2 .hero-spin-badge {
    bottom: var(--spacing-5);
    right: var(--spacing-5);
  }
}

.hero-v2__copy {
  display: flex;
  justify-content: center;
  padding: var(--spacing-4) var(--spacing-3) var(--spacing-3);
}
@media (min-width: 992px) {
  .hero-v2__copy {
    padding: var(--spacing-5) var(--spacing-8) var(--spacing-4);
  }
}

.hero-v2__carousel {
  display: flex;
  gap: var(--spacing-3);
  padding-inline: var(--spacing-3);
  padding-top: var(--spacing-3);
  padding-bottom: var(--spacing-8);
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}
.hero-v2__carousel::-webkit-scrollbar {
  display: none;
}
@media (min-width: 992px) {
  .hero-v2__carousel {
    justify-content: center;
    padding-inline: var(--spacing-5);
    padding-bottom: var(--spacing-9);
    gap: var(--spacing-4);
    overflow-x: hidden;
  }
}

.hero-v2__carousel-img {
  flex-shrink: 0;
  -o-object-fit: cover;
     object-fit: cover;
  border-radius: var(--spacing-3);
  height: 260px;
  will-change: transform;
  transition: transform 0.15s ease-out;
  transform: rotate(var(--tilt)) translate(var(--nudge-x, 0px), var(--nudge-y, 0px));
}
@media (min-width: 992px) {
  .hero-v2__carousel-img {
    height: 390px;
  }
  .hero-v2__carousel-img:nth-child(1) {
    flex: 0.8;
    width: auto;
  }
  .hero-v2__carousel-img:nth-child(2) {
    flex: 1.2;
    width: auto;
  }
  .hero-v2__carousel-img:nth-child(3) {
    flex: 1.2;
    width: auto;
  }
  .hero-v2__carousel-img:nth-child(4) {
    flex: 0.8;
    width: auto;
  }
}

.offer-hero {
  padding-block: var(--spacing-3);
  text-align: left;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--spacing-2);
}
@media (min-width: 992px) {
  .offer-hero {
    padding-block: var(--spacing-4);
    gap: var(--spacing-3);
  }
}
.offer-hero__title {
  color: #fff;
  font-weight: 800;
  margin: 0;
  font-size: clamp(2.25rem, 5vw, 5rem) !important;
  line-height: 1.05;
  font-family: var(--display-font);
  font-size: 2.75rem;
  line-height: 1.15;
  letter-spacing: -0.06rem;
}
@media (min-width: 992px) {
  .offer-hero__title {
    font-size: 3.5rem;
    line-height: 1.12;
    letter-spacing: -0.08rem;
  }
}
.offer-hero .btn {
  text-align: center;
}
.offer-hero--centered {
  text-align: center;
  align-items: center;
}
.offer-hero__rating {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: var(--spacing-1);
  font-size: 0.875rem;
  color: var(--primary-200);
  margin: 0;
}
@media (min-width: 992px) {
  .offer-hero__rating {
    gap: var(--spacing-2);
    font-size: 1rem;
  }
}
.offer-hero__stars {
  color: var(--success);
  letter-spacing: 0.05em;
  font-size: 0.875rem;
}
@media (min-width: 992px) {
  .offer-hero__stars {
    font-size: 1.25rem;
    letter-spacing: 0.1em;
  }
}
.offer-hero__microcopy {
  color: var(--primary-400);
  margin: 0;
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.875rem;
  line-height: 1.6;
}
@media (min-width: 992px) {
  .offer-hero__microcopy {
    font-size: 0.9375rem;
    line-height: 1.6;
  }
}

.big-dogs {
  background: var(--primary-800);
}
.big-dogs__header {
  padding: var(--spacing-5) var(--spacing-4);
}
@media (min-width: 992px) {
  .big-dogs__header {
    padding: var(--spacing-7) calc(9vw + var(--spacing-3));
  }
}
.big-dogs__title {
  margin: 0;
  color: var(--yellow-500);
  font-weight: 500;
  font-family: var(--display-font);
  font-size: 2.75rem;
  line-height: 1.15;
  letter-spacing: -0.06rem;
}
@media (min-width: 992px) {
  .big-dogs__title {
    font-size: 3.5rem;
    line-height: 1.12;
    letter-spacing: -0.08rem;
  }
}
.big-dogs__grid {
  display: grid;
  grid-template-columns: 1fr;
}
@media (min-width: 992px) {
  .big-dogs__grid {
    grid-template-columns: 1fr 1fr;
  }
}
.big-dogs__panel {
  padding: var(--spacing-6) var(--spacing-4);
}
@media (min-width: 992px) {
  .big-dogs__panel {
    padding: var(--spacing-7) calc(9vw + var(--spacing-3));
  }
}
.big-dogs__panel--stats {
  background: var(--yellow-500);
}
.big-dogs__panel--vet {
  background: var(--pink-500);
  position: relative;
  overflow: hidden;
  min-height: 360px;
}
@media (min-width: 992px) {
  .big-dogs__panel--vet {
    min-height: 440px;
    padding-left: var(--spacing-5);
  }
}

.big-dogs-stats {
  list-style: none;
  margin: 0 0 var(--spacing-5);
  padding: 0;
}
.big-dogs-stats__eyebrow {
  margin: 0 0 var(--spacing-4);
  color: var(--primary-800);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.18em;
  text-align: left;
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.875rem;
  line-height: 1.6;
}
@media (min-width: 992px) {
  .big-dogs-stats__eyebrow {
    font-size: 0.9375rem;
    line-height: 1.6;
  }
}
.big-dogs-stats__row {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: var(--spacing-3);
  padding: var(--spacing-4) 0;
  border-bottom: 1px solid var(--primary-800);
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 0.6s ease, transform 0.6s ease;
}
.big-dogs-stats__row.is-visible {
  opacity: 1;
  transform: translateY(0);
}
.big-dogs-stats__row:first-child {
  padding-top: 0;
}
.big-dogs-stats__row:last-child {
  border-bottom: none;
  padding-bottom: 0;
}
.big-dogs-stats__logo {
  margin: 0;
  width: auto;
  max-width: none;
  -o-object-fit: contain;
     object-fit: contain;
  -o-object-position: left center;
     object-position: left center;
}
.big-dogs-stats__logo--google {
  height: 36px;
}
.big-dogs-stats__logo--aadf {
  height: 28px;
}
.big-dogs-stats__logo--trustpilot {
  height: 28px;
}
@media (min-width: 992px) {
  .big-dogs-stats__logo--google {
    height: 40px;
  }
  .big-dogs-stats__logo--aadf {
    height: 32px;
  }
  .big-dogs-stats__logo--trustpilot {
    height: 32px;
  }
}
.big-dogs-stats__score {
  margin: 0;
  display: flex;
  align-items: baseline;
  gap: var(--spacing-1);
  color: var(--primary-800);
  font-family: var(--display-font);
  font-weight: 600;
  color: var(--primary-800);
  font-size: 2.75rem;
  line-height: 1.2;
  font-weight: 300;
}
@media (min-width: 992px) {
  .big-dogs-stats__score {
    font-size: 3.5rem;
    line-height: 1.15;
  }
}
.big-dogs-stats__unit {
  color: var(--primary-800);
  font-family: var(--display-font);
  font-weight: 600;
  color: var(--primary-800);
  font-size: 1.125rem;
  line-height: 1.25;
  font-weight: 300;
}
@media (min-width: 992px) {
  .big-dogs-stats__unit {
    font-size: 1.25rem;
    line-height: 1.25;
  }
}

.big-dogs__slider {
  background: var(--primary-800);
  padding: var(--spacing-5) var(--spacing-4);
}
@media (min-width: 992px) {
  .big-dogs__slider {
    padding: var(--spacing-6) calc(9vw + var(--spacing-3));
  }
}
@media (min-width: 992px) {
  .big-dogs__slider--mobile {
    display: none;
  }
}
.big-dogs__slider--desktop {
  display: none;
}
@media (min-width: 992px) {
  .big-dogs__slider--desktop {
    display: block;
  }
}

.big-dogs-vet__copy {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-4);
  position: relative;
  z-index: 1;
  max-width: 36ch;
  margin-bottom: 60vw;
  text-align: left;
}
@media (min-width: 992px) {
  .big-dogs-vet__copy {
    max-width: 38ch;
    gap: var(--spacing-4);
    margin-bottom: 0;
  }
}
.big-dogs-vet__eyebrow {
  margin: 0;
  color: var(--primary-800);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.18em;
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.875rem;
  line-height: 1.6;
}
@media (min-width: 992px) {
  .big-dogs-vet__eyebrow {
    font-size: 0.9375rem;
    line-height: 1.6;
  }
}
.big-dogs-vet__quote {
  margin: 0;
  color: var(--primary-800);
  font-style: italic;
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 1.125rem;
  line-height: 1.55;
}
@media (min-width: 992px) {
  .big-dogs-vet__quote {
    font-size: 1.25rem;
    line-height: 1.55;
  }
}
.big-dogs-vet__attribution {
  margin: 0;
  display: flex;
  align-items: center;
  gap: var(--spacing-3);
  color: var(--primary-800);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.875rem;
  line-height: 1.6;
}
@media (min-width: 992px) {
  .big-dogs-vet__attribution {
    font-size: 0.9375rem;
    line-height: 1.6;
  }
}
.big-dogs-vet__attribution-rule {
  display: inline-block;
  width: var(--spacing-3);
  height: 1px;
  background: var(--primary-800);
  flex-shrink: 0;
}
.big-dogs-vet__img {
  position: absolute;
  bottom: 0;
  right: 0;
  width: 70%;
  height: auto;
  pointer-events: none;
}
@media (min-width: 992px) {
  .big-dogs-vet__img {
    right: 0;
    height: 90%;
    width: auto;
  }
}

.ingredients-section {
  position: relative;
  display: flex;
  flex-direction: column;
  background-color: var(--white);
}
@media (min-width: 992px) {
  .ingredients-section {
    display: grid;
    grid-template-columns: 1fr 1fr;
    min-height: 600px;
    align-items: stretch;
  }
}

.ingredients-section__image {
  display: block;
  position: relative;
  background-image: url(//www.tuggs.uk/assets/food-images/dog-bowl-1500-1400-52df2001583061333ab0e29656715f29e7ca82ff94ac782c714f6d77d43c80d0.jpg);
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  width: 100%;
  aspect-ratio: 4/3;
}
@media (min-width: 992px) {
  .ingredients-section__image {
    aspect-ratio: auto;
  }
}

.ingredients-cards {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-5);
  padding: var(--spacing-5) var(--spacing-4);
  width: 100%;
}
@media (min-width: 992px) {
  .ingredients-cards {
    padding: var(--spacing-7) var(--spacing-6);
    max-width: 90%;
    align-self: center;
    justify-self: start;
  }
}
.ingredients-cards__title {
  margin: 0;
  color: var(--primary-800);
  text-align: left;
  font-weight: 400;
  font-family: var(--display-font);
  font-size: 2rem;
  line-height: 1.18;
  letter-spacing: -0.05rem;
  font-size: clamp(2rem, 3.5vw, 3.25rem);
  line-height: 1.1;
  letter-spacing: -0.02em;
}
@media (min-width: 992px) {
  .ingredients-cards__title {
    font-size: 2.5rem;
    line-height: 1.15;
    letter-spacing: -0.06rem;
  }
}
.ingredients-cards__rule {
  margin: 0;
  width: 100%;
  border: 0;
  border-top: 1px solid var(--pink-900);
}

.ingredients-card {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  gap: var(--spacing-4);
  text-align: left;
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 0.6s ease, transform 0.6s ease;
}
.ingredients-card.is-visible {
  opacity: 1;
  transform: translateY(0);
}
.ingredients-card__number {
  flex-shrink: 0;
  margin: 0;
  color: var(--pink-500);
  font-weight: 500;
  font-family: var(--display-font);
  font-size: 2rem;
  line-height: 1.18;
  letter-spacing: -0.05rem;
}
@media (min-width: 992px) {
  .ingredients-card__number {
    font-size: 2.5rem;
    line-height: 1.15;
    letter-spacing: -0.06rem;
  }
}
.ingredients-card__content {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-1);
}
.ingredients-card__title {
  margin: 0;
  font-family: var(--display-font);
  font-size: 1.25rem;
  line-height: 1.25;
  letter-spacing: -0.015rem;
}
@media (min-width: 992px) {
  .ingredients-card__title {
    font-size: 1.5rem;
    line-height: 1.22;
    letter-spacing: -0.02rem;
  }
}
@media (min-width: 992px) {
  .ingredients-card__title {
    font-family: var(--display-font);
    font-size: 1rem;
    line-height: 1.3;
    letter-spacing: 0;
  }
}
@media (min-width: 992px) and (min-width: 992px) {
  .ingredients-card__title {
    font-size: 1.25rem;
    line-height: 1.25;
    letter-spacing: -0.01rem;
  }
}
.ingredients-card__body {
  margin: 0;
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.9375rem;
  line-height: 1.6;
}
@media (min-width: 992px) {
  .ingredients-card__body {
    font-size: 1rem;
    line-height: 1.6;
  }
}
@media (min-width: 992px) {
  .ingredients-card {
    gap: var(--spacing-5);
  }
}

.why-tuggs-section {
  background: var(--white);
}
.why-tuggs-section .section-heading__title {
  font-size: clamp(2rem, 3.5vw, 3.25rem);
  line-height: 1.1;
  letter-spacing: -0.02em;
}

.why-tuggs-cards {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--spacing-3);
  width: 100%;
}
@media (min-width: 768px) {
  .why-tuggs-cards {
    grid-template-columns: 1fr 1fr;
  }
}
@media (min-width: 992px) {
  .why-tuggs-cards {
    grid-template-columns: repeat(4, 1fr);
  }
}

.why-tuggs-card {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: var(--spacing-4);
  padding: var(--spacing-4);
  border-radius: var(--spacing-3);
  border: 1px solid var(--tan-100);
  background: var(--tan-100);
  overflow: hidden;
  text-decoration: none;
  color: var(--primary-800);
  transition: color 0.3s ease;
}
.why-tuggs-card::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 4px;
  transition: height 0.35s cubic-bezier(0.4, 0, 0.2, 1);
  z-index: 0;
}
.why-tuggs-card > * {
  position: relative;
  z-index: 1;
}
.why-tuggs-card--1::after {
  background: var(--yellow);
}
.why-tuggs-card--2::after {
  background: var(--success);
}
.why-tuggs-card--3::after {
  background: var(--pink-500);
}
.why-tuggs-card--4::after {
  background: var(--blue-300);
}
@media (hover: hover) {
  .why-tuggs-card:hover {
    color: var(--primary-800);
  }
  .why-tuggs-card:hover::after {
    height: 100%;
  }
  .why-tuggs-card:hover .why-tuggs-card__number {
    color: var(--primary-600);
    border-color: var(--primary-400);
  }
  .why-tuggs-card:hover .why-tuggs-card__sub {
    color: var(--primary-600);
  }
  .why-tuggs-card:hover .why-tuggs-card__arrow {
    opacity: 1;
    transform: translateX(4px);
  }
}
@media (hover: none) {
  .why-tuggs-card::after {
    transition: height 0.6s cubic-bezier(0.4, 0, 0.2, 1) 0.6s;
  }
  .why-tuggs-card.is-visible {
    color: var(--primary-800);
  }
  .why-tuggs-card.is-visible::after {
    height: 100%;
  }
  .why-tuggs-card.is-visible .why-tuggs-card__number {
    color: var(--primary-600);
    border-color: var(--primary-400);
  }
  .why-tuggs-card.is-visible .why-tuggs-card__sub {
    color: var(--primary-600);
  }
}
.why-tuggs-card__number {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  align-self: flex-start;
  width: 44px;
  height: 28px;
  border: 1.5px dashed var(--primary-300);
  border-radius: var(--spacing-5);
  color: var(--primary-500);
  font-weight: 700;
  letter-spacing: 0.05em;
  transition: color 0.3s ease, border-color 0.3s ease;
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.875rem;
  line-height: 1.6;
}
@media (min-width: 992px) {
  .why-tuggs-card__number {
    font-size: 0.9375rem;
    line-height: 1.6;
  }
}
.why-tuggs-card__body {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-1);
  flex: 1;
}
.why-tuggs-card__title {
  margin: 0;
  font-weight: 400;
  font-family: var(--display-font);
  font-size: 1.5rem;
  line-height: 1.2;
  letter-spacing: -0.03rem;
}
@media (min-width: 992px) {
  .why-tuggs-card__title {
    font-size: 2rem;
    line-height: 1.18;
    letter-spacing: -0.04rem;
  }
}
.why-tuggs-card__sub {
  margin: 0;
  color: var(--primary-500);
  transition: color 0.3s ease;
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.9375rem;
  line-height: 1.6;
}
@media (min-width: 992px) {
  .why-tuggs-card__sub {
    font-size: 1rem;
    line-height: 1.6;
  }
}
.why-tuggs-card__arrow {
  align-self: flex-end;
  font-size: 1.25rem;
  opacity: 0;
  transition: opacity 0.3s ease, transform 0.3s ease;
}
.why-tuggs-card__cta {
  position: absolute;
  bottom: var(--spacing-3);
  display: inline-flex;
  align-items: center;
  gap: var(--spacing-1);
  padding: var(--spacing-1) var(--spacing-25);
  background: var(--tan-50);
  border: 1px solid var(--tan-500);
  border-radius: var(--spacing-5);
  color: var(--primary-800);
  z-index: 2;
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.875rem;
  line-height: 1.6;
}
@media (min-width: 992px) {
  .why-tuggs-card__cta {
    font-size: 0.9375rem;
    line-height: 1.6;
  }
}
@media (min-width: 992px) {
  .why-tuggs-card__cta {
    display: none;
  }
}
.why-tuggs-card__cta-arrow {
  transition: transform 0.3s ease;
}
.why-tuggs-card--1 .why-tuggs-card__cta, .why-tuggs-card--3 .why-tuggs-card__cta {
  left: var(--spacing-4);
}
.why-tuggs-card--2 .why-tuggs-card__cta, .why-tuggs-card--4 .why-tuggs-card__cta {
  right: var(--spacing-4);
}
@media (hover: hover) {
  .why-tuggs-card:hover .why-tuggs-card__cta-arrow {
    transform: translateX(4px);
  }
}
.why-tuggs-card__img {
  display: block;
  width: 65%;
  height: auto;
  margin-top: var(--spacing-2);
  margin-inline: auto;
  -o-object-fit: contain;
     object-fit: contain;
  transform: translateY(8px);
  transition: transform 0.35s cubic-bezier(0.4, 0, 0.2, 1);
  pointer-events: none;
}
@media (min-width: 992px) {
  .why-tuggs-card__img {
    width: 85%;
  }
}
.why-tuggs-card:hover .why-tuggs-card__img {
  transform: translateY(0px) scale(1.04);
}
.why-tuggs-card--1 .why-tuggs-card__img, .why-tuggs-card--3 .why-tuggs-card__img {
  margin-top: calc(-1 * var(--spacing-8));
  margin-left: auto;
  margin-right: calc(-1 * var(--spacing-4));
  margin-bottom: calc(-1 * var(--spacing-4));
}
@media (min-width: 992px) {
  .why-tuggs-card--1 .why-tuggs-card__img, .why-tuggs-card--3 .why-tuggs-card__img {
    margin-top: calc(-1 * var(--spacing-5));
    margin-right: calc(-1 * var(--spacing-4));
    margin-bottom: calc(-1 * var(--spacing-4));
    width: 90%;
  }
}
.why-tuggs-card--2 .why-tuggs-card__img, .why-tuggs-card--4 .why-tuggs-card__img {
  margin-top: calc(-1 * var(--spacing-8));
  margin-right: auto;
  margin-left: calc(-1 * var(--spacing-4));
  margin-bottom: calc(-1 * var(--spacing-4));
}
@media (min-width: 992px) {
  .why-tuggs-card--2 .why-tuggs-card__img, .why-tuggs-card--4 .why-tuggs-card__img {
    margin-top: calc(-1 * var(--spacing-5));
    margin-left: calc(-1 * var(--spacing-4));
    margin-bottom: calc(-1 * var(--spacing-4));
    width: 90%;
  }
}

.recipes-section {
  background: var(--primary-800);
  color: #fff;
  padding: var(--spacing-6) 0 var(--spacing-4);
  text-align: left;
}
@media (min-width: 992px) {
  .recipes-section {
    padding: var(--spacing-8) 0;
  }
}
.recipes-section__inner {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-5);
  padding-inline: var(--spacing-4);
  margin-inline: auto;
  max-width: 1200px;
}
@media (min-width: 992px) {
  .recipes-section__inner {
    gap: var(--spacing-9);
    max-width: 82%;
    padding-inline: var(--spacing-8);
  }
}
.recipes-section__header {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-2);
}
.recipes-section__title {
  margin: 0;
  color: #fff;
  font-weight: 500;
  text-align: right;
  font-family: var(--display-font);
  font-size: 2rem;
  line-height: 1.18;
  letter-spacing: -0.05rem;
}
@media (min-width: 992px) {
  .recipes-section__title {
    font-size: 2.5rem;
    line-height: 1.15;
    letter-spacing: -0.06rem;
  }
}
@media (min-width: 992px) {
  .recipes-section__title {
    font-family: var(--display-font);
    font-size: 2.75rem;
    line-height: 1.15;
    letter-spacing: -0.06rem;
  }
}
@media (min-width: 992px) and (min-width: 992px) {
  .recipes-section__title {
    font-size: 3.5rem;
    line-height: 1.12;
    letter-spacing: -0.08rem;
  }
}

.recipe-rows-wrap {
  position: relative;
  padding-inline: var(--spacing-4);
  margin-top: var(--spacing-5);
  max-width: 1200px;
  margin-inline: auto;
  width: 100%;
  box-sizing: border-box;
}
@media (min-width: 992px) {
  .recipe-rows-wrap {
    max-width: 82%;
    padding-inline: var(--spacing-8);
    margin-top: var(--spacing-6);
  }
}

.recipe-rows {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  border-top: 1px solid var(--primary-700);
}
@media (min-width: 992px) {
  .recipe-rows {
    flex-direction: row;
    overflow-x: auto;
    overflow-y: hidden;
    gap: var(--spacing-3);
    border-top: none;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
    scroll-snap-type: x mandatory;
  }
  .recipe-rows::-webkit-scrollbar {
    display: none;
  }
}

.recipes-section:not(.is-expanded) .recipe-rows .recipe-row:nth-child(n+5) {
  display: none;
}
@media (min-width: 992px) {
  .recipes-section:not(.is-expanded) .recipe-rows .recipe-row:nth-child(n+5) {
    display: block;
  }
}

.recipes-section:not(.is-expanded) .recipe-rows .recipe-row:nth-child(4) {
  max-height: 9rem;
  overflow: hidden;
}
@media (min-width: 992px) {
  .recipes-section:not(.is-expanded) .recipe-rows .recipe-row:nth-child(4) {
    max-height: none;
    overflow: visible;
  }
}

.recipe-rows__reveal {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  display: flex;
  justify-content: center;
  align-items: flex-end;
  padding-bottom: var(--spacing-3);
  pointer-events: none;
  background: linear-gradient(to bottom, transparent 0%, var(--primary-800) 65%);
  height: 9rem;
}
@media (min-width: 992px) {
  .recipe-rows__reveal {
    display: none;
  }
}

.recipe-rows__reveal-button {
  pointer-events: auto;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  cursor: pointer;
  border: 2px solid var(--primary-800);
  border-radius: var(--spacing-7);
  background-color: var(--white);
  color: var(--primary-800);
  padding: var(--spacing-25) var(--spacing-5);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.14em;
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.875rem;
  line-height: 1.6;
  box-shadow: var(--shadow);
}
@media (min-width: 992px) {
  .recipe-rows__reveal-button {
    font-size: 0.9375rem;
    line-height: 1.6;
  }
}

.recipes-section.is-expanded .recipe-rows__reveal {
  display: none;
}

.recipe-row {
  position: relative;
  border-bottom: 1px solid var(--primary-700);
}
@media (min-width: 992px) {
  .recipe-row {
    flex: 0 0 calc((100% - var(--spacing-3) * 2.25) / 3.25);
    scroll-snap-align: start;
    border-bottom: none;
  }
  .recipe-row::before {
    display: none;
  }
}
.recipe-row--green {
  --recipe-accent: var(--green-300);
}
.recipe-row--rose {
  --recipe-accent: var(--rose-300);
}
.recipe-row--pink {
  --recipe-accent: var(--pink-500);
}
.recipe-row--orange {
  --recipe-accent: var(--orange-500);
}
.recipe-row--purple {
  --recipe-accent: var(--purple-300);
}
.recipe-row--blue {
  --recipe-accent: var(--blue-300);
}
.recipe-row--yellow {
  --recipe-accent: var(--yellow-500);
}
.recipe-row--tan {
  --recipe-accent: var(--tan-300);
}
.recipe-row__link {
  display: grid;
  grid-template-columns: 1fr auto;
  grid-template-areas: "image image" "body  number";
  align-items: center;
  -moz-column-gap: var(--spacing-3);
       column-gap: var(--spacing-3);
  row-gap: var(--spacing-3);
  padding-block: var(--spacing-3);
  text-align: left;
  text-decoration: none;
  color: inherit;
}
@media (min-width: 992px) {
  .recipe-row__link {
    padding: var(--spacing-3);
    height: 100%;
    border-radius: var(--spacing-3);
    transition: background-color 0.3s ease;
  }
}
.recipe-row__image-wrap {
  grid-area: image;
  width: 100%;
  border-radius: var(--spacing-2);
  overflow: hidden;
}
.recipe-row__body {
  grid-area: body;
}
.recipe-row__number {
  grid-area: number;
}
.recipe-row__image {
  display: block;
  width: 100%;
  height: auto;
}
.recipe-row__body {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-1);
  min-width: 0;
}
@media (min-width: 992px) {
  .recipe-row__body {
    gap: var(--spacing-2);
  }
}
.recipe-row__title {
  margin: 0;
  color: #fff;
  font-weight: 500;
  transition: color 0.3s ease;
  font-family: var(--display-font);
  font-size: 1.25rem;
  line-height: 1.25;
  letter-spacing: -0.015rem;
}
@media (min-width: 992px) {
  .recipe-row__title {
    font-size: 1.5rem;
    line-height: 1.22;
    letter-spacing: -0.02rem;
  }
}
.recipe-row__desc {
  margin: 0;
  color: var(--primary-200);
  transition: color 0.3s ease;
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.875rem;
  line-height: 1.6;
}
@media (min-width: 992px) {
  .recipe-row__desc {
    font-size: 0.9375rem;
    line-height: 1.6;
  }
}
@media (min-width: 992px) {
  .recipe-row__desc {
    max-width: 52ch;
  }
}
.recipe-row__pill {
  display: inline-flex;
  align-self: flex-start;
  margin-top: var(--spacing-1);
  padding: var(--spacing-1) var(--spacing-3);
  border: 1px solid var(--primary-800);
  border-radius: var(--spacing-7);
  color: var(--primary-800);
  background-color: var(--recipe-accent);
  font-weight: 700;
  text-transform: uppercase;
  transition: background-color 0.3s ease, color 0.3s ease, border-color 0.3s ease;
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.625rem;
  line-height: 1.6;
}
@media (min-width: 992px) {
  .recipe-row__pill {
    font-size: 0.75rem;
    line-height: 1.6;
  }
}
@media (min-width: 992px) {
  .recipe-row__pill {
    margin-top: var(--spacing-2);
  }
}
.recipe-row__number {
  color: var(--primary-600);
  font-weight: 500;
  transition: color 0.3s ease;
  font-family: var(--display-font);
  font-size: 2rem;
  line-height: 1.18;
  letter-spacing: -0.05rem;
}
@media (min-width: 992px) {
  .recipe-row__number {
    font-size: 2.5rem;
    line-height: 1.15;
    letter-spacing: -0.06rem;
  }
}
@media (hover: hover) {
  .recipe-row__link:hover {
    background-color: var(--recipe-accent);
  }
  .recipe-row__link:hover .recipe-row__title {
    color: var(--primary-800);
  }
  .recipe-row__link:hover .recipe-row__desc {
    color: var(--primary-800);
  }
  .recipe-row__link:hover .recipe-row__number {
    color: var(--primary-800);
  }
  .recipe-row__link:hover .recipe-row__pill {
    background-color: var(--primary-800);
    border-color: var(--primary-800);
    color: var(--recipe-accent);
  }
}

.see-difference {
  --card-accent: var(--green-500);
  background: var(--tan-200);
  color: var(--primary-800);
}
.see-difference__cards-wrapper {
  position: relative;
}
.see-difference__scroll-hint {
  display: none;
}
.see-difference__inner {
  max-width: 1280px;
  margin: 0 auto;
  padding: var(--spacing-6) var(--spacing-3);
}
@media (min-width: 992px) {
  .see-difference__inner {
    padding: var(--spacing-8) var(--spacing-5);
  }
}
.see-difference__header {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--spacing-3);
  margin-bottom: var(--spacing-5);
}
@media (min-width: 992px) {
  .see-difference__header {
    grid-template-columns: 2fr 1fr;
    align-items: end;
    gap: var(--spacing-5);
    margin-bottom: var(--spacing-6);
  }
}
.see-difference__title {
  font-weight: 400;
  color: var(--primary-800);
  margin: 0;
  text-align: left;
  font-family: var(--display-font);
  font-weight: 600;
  color: var(--primary-800);
  font-size: 2rem;
  line-height: 1.2;
}
@media (min-width: 992px) {
  .see-difference__title {
    font-size: 2.5rem;
    line-height: 1.18;
  }
}
.see-difference__lede {
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 1rem;
  line-height: 1.6;
  color: var(--primary-500);
  margin: 0;
  max-width: 30ch;
}
@media (min-width: 992px) {
  .see-difference__lede {
    font-size: 1.125rem;
    line-height: 1.6;
  }
}
@media (min-width: 992px) {
  .see-difference__lede {
    justify-self: end;
    text-align: right;
  }
}
.see-difference__rule {
  border: 0;
  border-top: 1px solid var(--tan-300);
  margin: 0;
}
.see-difference__cards {
  display: flex;
  flex-direction: column;
  background-color: var(--tan-50);
  border-radius: 0 var(--spacing-4) var(--spacing-4) 0;
}
@media (min-width: 992px) {
  .see-difference__cards {
    border-radius: var(--spacing-4);
    flex-direction: row;
    align-items: stretch;
  }
}
@media (min-width: 1200px) {
  .see-difference__cards {
    max-width: 82%;
    margin: auto;
  }
}
.see-difference__card {
  position: relative;
  overflow: hidden;
  padding: var(--spacing-5) var(--spacing-3);
  border-left: 3px solid var(--card-accent);
  text-align: left;
}
.see-difference__card--1 {
  --card-accent: var(--green-300);
}
.see-difference__card--2 {
  --card-accent: var(--pink-500);
}
.see-difference__card--3 {
  --card-accent: var(--yellow-500);
}
.see-difference__card--4 {
  --card-accent: var(--purple-500);
}
@media (min-width: 992px) {
  .see-difference__card {
    flex: 1 1 0;
    min-width: 0;
    padding: var(--spacing-5) var(--spacing-4) var(--spacing-7);
    border-left: 0;
    border-right: 1px solid var(--tan-300);
    transition: flex-grow 0.5s cubic-bezier(0.4, 0, 0.2, 1);
  }
  .see-difference__card:last-child {
    border-right: 0;
  }
}
.see-difference__card-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: var(--spacing-4);
}
.see-difference__dot {
  display: inline-block;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: var(--card-accent);
}
.see-difference__index {
  color: var(--primary-300);
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.875rem;
  line-height: 1.6;
}
@media (min-width: 992px) {
  .see-difference__index {
    font-size: 0.9375rem;
    line-height: 1.6;
  }
}
.see-difference__period {
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.875rem;
  line-height: 1.6;
  color: var(--primary-500);
  margin: 0 0 var(--spacing-1);
}
@media (min-width: 992px) {
  .see-difference__period {
    font-size: 0.9375rem;
    line-height: 1.6;
  }
}
.see-difference__range {
  font-weight: 400 !important;
  color: var(--card-accent) !important;
  margin: 0 0 var(--spacing-4);
  line-height: 1;
  font-family: var(--display-font);
  font-weight: 600;
  color: var(--primary-800);
  font-size: 2.75rem;
  line-height: 1.2;
}
@media (min-width: 992px) {
  .see-difference__range {
    font-size: 3.5rem;
    line-height: 1.15;
  }
}
.see-difference__card-title {
  font-weight: 400;
  color: var(--primary-800);
  margin: 0 0 var(--spacing-2);
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 1.125rem;
  line-height: 1.55;
}
@media (min-width: 992px) {
  .see-difference__card-title {
    font-size: 1.25rem;
    line-height: 1.55;
  }
}
.see-difference__card-body {
  color: var(--primary-500);
  margin: 0;
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.9375rem;
  line-height: 1.6;
}
@media (min-width: 992px) {
  .see-difference__card-body {
    font-size: 1rem;
    line-height: 1.6;
  }
}
.see-difference__watermark {
  display: none;
}
@media (min-width: 992px) and (hover: hover) {
  .see-difference__cards:hover .see-difference__card {
    flex-grow: 0.7;
  }
  .see-difference__cards .see-difference__card:hover {
    flex-grow: 2.2;
  }
}

@media (max-width: 991px) {
  .see-difference {
    --see-difference-card-height: 360px;
  }
  .see-difference__cards {
    height: var(--see-difference-card-height);
    overflow-y: scroll;
    scroll-snap-type: y mandatory;
    scrollbar-width: none;
  }
  .see-difference__cards::-webkit-scrollbar {
    display: none;
  }
  .see-difference__card {
    height: var(--see-difference-card-height);
    flex-shrink: 0;
    scroll-snap-align: start;
    display: flex;
    flex-direction: column;
    justify-content: center;
    transition: background 0.3s ease, border-color 0.3s ease;
  }
  .see-difference__scroll-hint {
    display: block;
    margin: var(--spacing-25) auto 0;
    width: 2rem;
    height: 2rem;
    background: none;
    border: none;
    padding: 0;
    cursor: pointer;
    transition: opacity 0.3s ease;
    animation: see-difference-bounce 1.6s ease-in-out infinite;
  }
  .see-difference__scroll-hint::after {
    content: "";
    display: block;
    width: 0.6rem;
    height: 0.6rem;
    border-right: 2px solid var(--primary-400);
    border-bottom: 2px solid var(--primary-400);
    transform: rotate(45deg);
    margin: 0.55rem auto 0;
  }
  .see-difference__scroll-hint--hidden {
    opacity: 0;
    pointer-events: none;
  }
  @keyframes see-difference-bounce {
    0%, 100% {
      transform: translateY(0);
    }
    50% {
      transform: translateY(4px);
    }
  }
}
.also-from-tuggs-hero {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  background-color: #fff;
}
.also-from-tuggs-hero__copy {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--spacing-4);
  text-align: center;
  max-width: 760px;
  padding: var(--spacing-6) var(--spacing-3) var(--spacing-5);
}
@media (min-width: 992px) {
  .also-from-tuggs-hero__copy {
    padding: var(--spacing-7) var(--spacing-3) var(--spacing-5);
  }
}
.also-from-tuggs-hero__title {
  margin: 0;
  color: var(--primary-800);
  font-family: var(--display-font);
  font-size: 2.75rem;
  line-height: 1.15;
  letter-spacing: -0.06rem;
}
@media (min-width: 992px) {
  .also-from-tuggs-hero__title {
    font-size: 3.5rem;
    line-height: 1.12;
    letter-spacing: -0.08rem;
  }
}
.also-from-tuggs-hero__body {
  margin: 0;
  color: var(--primary-700);
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 1.125rem;
  line-height: 1.55;
}
@media (min-width: 992px) {
  .also-from-tuggs-hero__body {
    font-size: 1.25rem;
    line-height: 1.55;
  }
}
.also-from-tuggs-hero__cta {
  margin-top: var(--spacing-2);
}
.also-from-tuggs-hero__img {
  display: block;
  width: 100%;
  max-width: 1200px;
  height: auto;
  margin-top: auto;
}

.lab-roll-section {
  display: block;
  width: 100%;
  line-height: 0;
}
.lab-roll-section__img {
  display: block;
  width: 100%;
  height: auto;
}

.testimonials-section {
  padding: var(--spacing-7) 0;
  color: var(--white);
}
@media (min-width: 992px) {
  .testimonials-section {
    padding: var(--spacing-8) 0;
  }
}
.testimonials-section__inner {
  text-align: left;
  display: flex;
  flex-direction: column;
  gap: var(--spacing-4);
  padding-inline: var(--spacing-3);
  margin-bottom: var(--spacing-5);
}
@media (min-width: 992px) {
  .testimonials-section__inner {
    padding-inline: 9vw;
    margin-bottom: var(--spacing-6);
  }
}
.testimonials-section__eyebrow {
  margin: 0;
  color: var(--white);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.18em;
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.875rem;
  line-height: 1.6;
}
@media (min-width: 992px) {
  .testimonials-section__eyebrow {
    font-size: 0.9375rem;
    line-height: 1.6;
  }
}
.testimonials-section__title {
  margin: 0;
  color: var(--white);
  font-family: var(--display-font);
  font-size: 2rem;
  line-height: 1.18;
  letter-spacing: -0.05rem;
}
@media (min-width: 992px) {
  .testimonials-section__title {
    font-size: 2.5rem;
    line-height: 1.15;
    letter-spacing: -0.06rem;
  }
}

.testimonials-carousel {
  list-style: none;
  margin: 0;
  padding: 0;
  padding-left: calc(var(--spacing-3) - var(--spacing-4));
  display: flex;
  gap: 0;
  overflow-x: auto;
  overflow-y: hidden;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
}
.testimonials-carousel::-webkit-scrollbar {
  display: none;
}
@media (min-width: 992px) {
  .testimonials-carousel {
    padding-left: calc(9vw - var(--spacing-5));
  }
}

.testimonial-card {
  --testimonial-accent: var(--green-300);
  flex: 0 0 88%;
  scroll-snap-align: start;
  background: transparent;
  color: var(--white);
  border-radius: var(--spacing-3);
  padding: var(--spacing-4);
  display: flex;
  flex-direction: column;
  gap: var(--spacing-3);
  text-align: left;
  transition: background-color 0.3s ease, color 0.3s ease;
}
@media (min-width: 992px) {
  .testimonial-card {
    flex: 0 0 28vw;
    padding: var(--spacing-5);
  }
}
.testimonial-card--green {
  --testimonial-accent: var(--green-300);
}
.testimonial-card--yellow {
  --testimonial-accent: var(--yellow-500);
}
.testimonial-card--orange {
  --testimonial-accent: var(--orange-500);
}
.testimonial-card--pink {
  --testimonial-accent: var(--pink-500);
}
.testimonial-card--blue {
  --testimonial-accent: var(--blue-300);
}
@media (hover: hover) {
  .testimonial-card:hover {
    background-color: var(--testimonial-accent);
    color: var(--primary-800);
  }
  .testimonial-card:hover .testimonial-card__headline,
  .testimonial-card:hover .testimonial-card__quote,
  .testimonial-card:hover .testimonial-card__name,
  .testimonial-card:hover .testimonial-card__stars {
    color: var(--primary-800);
  }
  .testimonial-card:hover .testimonial-card__toggle,
  .testimonial-card:hover .testimonial-card__toggle-more,
  .testimonial-card:hover .testimonial-card__toggle-less {
    color: var(--primary-800) !important;
  }
}
.testimonial-card__stars {
  color: var(--testimonial-accent);
  letter-spacing: 0.1em;
  font-family: var(--display-font);
  font-size: 1.25rem;
  line-height: 1.25;
  letter-spacing: -0.015rem;
}
@media (min-width: 992px) {
  .testimonial-card__stars {
    font-size: 1.5rem;
    line-height: 1.22;
    letter-spacing: -0.02rem;
  }
}
.testimonial-card__headline {
  margin: 0;
  color: var(--white);
  font-family: var(--display-font);
  font-size: 1.25rem;
  line-height: 1.25;
  letter-spacing: -0.015rem;
}
@media (min-width: 992px) {
  .testimonial-card__headline {
    font-size: 1.5rem;
    line-height: 1.22;
    letter-spacing: -0.02rem;
  }
}
.testimonial-card__quote {
  margin: 0;
  color: var(--navy-200);
  font-style: italic;
  text-align: left;
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 1rem;
  line-height: 1.6;
  line-height: 2;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 4;
  overflow: hidden;
}
@media (min-width: 992px) {
  .testimonial-card__quote {
    font-size: 1.125rem;
    line-height: 1.6;
  }
}
.testimonial-card.is-expanded .testimonial-card__quote {
  display: block;
  -webkit-line-clamp: unset;
  overflow: visible;
}
.testimonial-card__toggle {
  align-self: flex-start;
  background: none;
  border: 0;
  padding: 0;
  color: var(--navy-100);
  cursor: pointer;
  text-decoration: underline;
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.9375rem;
  line-height: 1.6;
}
@media (min-width: 992px) {
  .testimonial-card__toggle {
    font-size: 1rem;
    line-height: 1.6;
  }
}
.testimonial-card__toggle-less {
  display: none;
}
.testimonial-card.is-expanded .testimonial-card__toggle-more {
  display: none;
}
.testimonial-card.is-expanded .testimonial-card__toggle-less {
  display: inline;
}
.testimonial-card__name {
  margin: 0;
  color: var(--white);
  text-align: left;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.875rem;
  line-height: 1.6;
}
@media (min-width: 992px) {
  .testimonial-card__name {
    font-size: 0.9375rem;
    line-height: 1.6;
  }
}

.food-comparison-section {
  overflow: hidden;
}
@media (min-width: 992px) {
  .food-comparison-section {
    overflow: visible;
  }
}

.food-comparison {
  position: relative;
  isolation: isolate;
  background: var(--tan-200);
  padding: var(--spacing-6) var(--spacing-3);
  text-align: left;
  color: var(--primary-800);
  --shimmy: 0;
}
.food-comparison__title, .food-comparison__tabs, .food-comparison__table, .food-comparison__continuation {
  position: relative;
  z-index: 1;
}
@media (min-width: 992px) {
  .food-comparison {
    border-radius: var(--spacing-5);
    padding-block: var(--spacing-8);
    text-align: center;
    padding-inline: var(--spacing-8);
    max-width: 82%;
    margin-inline: auto;
  }
}
.food-comparison__table-wrap {
  position: relative;
}
@media (min-width: 992px) {
  .food-comparison__table-wrap {
    max-width: 960px;
    margin-inline: auto;
  }
}
.food-comparison__scatter {
  position: absolute;
  top: -260px;
  left: 0;
  right: 0;
  height: 260px;
  pointer-events: none;
  z-index: 0;
}
@media (min-width: 992px) {
  .food-comparison__scatter {
    inset: 0;
    top: 0;
    height: auto;
    overflow: visible;
  }
}
.food-comparison__ingredient {
  position: absolute;
  width: var(--ingredient-size, 64px);
  height: auto;
  transform: translate3d(calc(var(--shimmy, 0) * var(--shimmy-x, 0px)), calc(var(--shimmy, 0) * var(--shimmy-y, 0px)), 0) rotate(calc(var(--shimmy, 0) * var(--shimmy-r, 0deg)));
  transition: transform 0.2s linear;
  will-change: transform;
}
@media (min-width: 992px) {
  .food-comparison__ingredient {
    width: var(--ingredient-size-l, 110px);
  }
}
.food-comparison__ingredient--carrot {
  top: 6px;
  left: 2%;
  --shimmy-x: 12px;
  --shimmy-y: -8px;
  --shimmy-r: 8deg;
}
@media (min-width: 992px) {
  .food-comparison__ingredient--carrot {
    top: -36px;
    left: -56px;
    --shimmy-x: 26px;
    --shimmy-y: -18px;
  }
}
.food-comparison__ingredient--broccoli {
  top: 90px;
  left: 42%;
  --ingredient-size: 72px;
  --ingredient-size-l: 130px;
  --shimmy-x: -14px;
  --shimmy-y: -10px;
  --shimmy-r: -10deg;
}
@media (min-width: 992px) {
  .food-comparison__ingredient--broccoli {
    top: -64px;
    right: -64px;
    left: auto;
    --shimmy-x: -28px;
    --shimmy-y: -14px;
  }
}
.food-comparison__ingredient--quinoa {
  top: 190px;
  left: 6%;
  --ingredient-size: 56px;
  --ingredient-size-l: 100px;
  --shimmy-x: -10px;
  --shimmy-y: 14px;
  --shimmy-r: -6deg;
}
@media (min-width: 992px) {
  .food-comparison__ingredient--quinoa {
    top: auto;
    bottom: 18%;
    left: -83px;
    --shimmy-x: -18px;
    --shimmy-y: 22px;
  }
}
.food-comparison__ingredient--salmon-oil {
  top: 50px;
  left: 70%;
  --ingredient-size: 60px;
  --ingredient-size-l: 115px;
  --shimmy-x: 16px;
  --shimmy-y: 12px;
  --shimmy-r: 12deg;
}
@media (min-width: 992px) {
  .food-comparison__ingredient--salmon-oil {
    top: 32%;
    left: auto;
    right: -136px;
    --shimmy-x: 30px;
    --shimmy-y: 18px;
  }
}
.food-comparison__ingredient--insects {
  top: 200px;
  left: 78%;
  --ingredient-size: 64px;
  --ingredient-size-l: 105px;
  --shimmy-x: 14px;
  --shimmy-y: 10px;
  --shimmy-r: -14deg;
}
@media (min-width: 992px) {
  .food-comparison__ingredient--insects {
    top: auto;
    bottom: -64px;
    left: 42%;
    --shimmy-x: 20px;
    --shimmy-y: 16px;
  }
}
.food-comparison__title {
  margin: 0 auto;
  font-weight: 700;
  color: var(--primary-800);
  font-family: var(--display-font);
  font-size: 2rem;
  line-height: 1.18;
  letter-spacing: -0.05rem;
}
@media (min-width: 992px) {
  .food-comparison__title {
    font-size: 2.5rem;
    line-height: 1.15;
    letter-spacing: -0.06rem;
  }
}
@media (min-width: 992px) {
  .food-comparison__title {
    font-family: var(--display-font);
    font-size: 2.75rem;
    line-height: 1.15;
    letter-spacing: -0.06rem;
  }
}
@media (min-width: 992px) and (min-width: 992px) {
  .food-comparison__title {
    font-size: 3.5rem;
    line-height: 1.12;
    letter-spacing: -0.08rem;
  }
}
.food-comparison__tabs {
  display: inline-flex;
  background: #fff;
  border-radius: var(--spacing-7);
  padding: var(--spacing-1);
  margin-top: var(--spacing-5);
  margin-bottom: var(--spacing-5);
}
@media (min-width: 992px) {
  .food-comparison__tabs {
    margin-top: var(--spacing-6);
    margin-bottom: var(--spacing-6);
  }
}
.food-comparison__tab {
  -moz-appearance: none;
       appearance: none;
  -webkit-appearance: none;
  -webkit-tap-highlight-color: transparent;
  border: 0;
  cursor: pointer;
  background: transparent;
  color: var(--primary-800);
  border-radius: var(--spacing-7);
  text-transform: uppercase;
  transition: background-color 0.3s ease, color 0.3s ease;
  padding: var(--spacing-2) var(--spacing-3);
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.9375rem;
  line-height: 1.6;
}
@media (min-width: 992px) {
  .food-comparison__tab {
    font-size: 1rem;
    line-height: 1.6;
  }
}
@media (min-width: 992px) {
  .food-comparison__tab {
    font-weight: 700;
    padding: var(--spacing-25) var(--spacing-4);
  }
}
@media (hover: hover) {
  .food-comparison__tab:hover:not(.is-active) {
    background: var(--tan-100);
  }
}
.food-comparison__tab.is-active, .food-comparison__tab.is-active:focus, .food-comparison__tab.is-active:active {
  background: var(--primary-800);
  color: #fff;
}
.food-comparison__table {
  display: grid;
  grid-template-columns: 1.5fr 1fr 1fr;
  -moz-column-gap: var(--spacing-1);
       column-gap: var(--spacing-1);
  text-align: left;
}
@media (min-width: 992px) {
  .food-comparison__table {
    grid-template-columns: minmax(0, 1.5fr) minmax(120px, 1fr) minmax(120px, 1fr);
    -moz-column-gap: var(--spacing-2);
         column-gap: var(--spacing-2);
    max-width: 960px;
    margin-inline: auto;
  }
}
.food-comparison__table [data-key] {
  display: none;
}
.food-comparison__table[data-active=kibble] [data-key=kibble], .food-comparison__table[data-active=wet] [data-key=wet], .food-comparison__table[data-active=raw] [data-key=raw], .food-comparison__table[data-active=shelf] [data-key=shelf] {
  display: inline-flex;
}
.food-comparison__head-spacer {
  display: block;
}
.food-comparison__col-head {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: var(--spacing-3) var(--spacing-2);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.9375rem;
  line-height: 1.6;
}
@media (min-width: 992px) {
  .food-comparison__col-head {
    font-size: 1rem;
    line-height: 1.6;
  }
}
.food-comparison__row-label {
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding: var(--spacing-2) var(--spacing-1) var(--spacing-2) 0;
  align-self: center;
  min-width: 0;
}
@media (min-width: 992px) {
  .food-comparison__row-label {
    padding: var(--spacing-3) var(--spacing-3) var(--spacing-3) 0;
    gap: var(--spacing-1);
  }
}
.food-comparison__row-title {
  margin: 0;
  color: var(--primary-800);
  font-weight: 700;
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.875rem;
  line-height: 1.6;
}
@media (min-width: 992px) {
  .food-comparison__row-title {
    font-size: 0.9375rem;
    line-height: 1.6;
  }
}
@media (min-width: 992px) {
  .food-comparison__row-title {
    font-family: var(--body-font);
    font-weight: 300;
    font-size: 1rem;
    line-height: 1.6;
    font-weight: 700;
  }
}
@media (min-width: 992px) and (min-width: 992px) {
  .food-comparison__row-title {
    font-size: 1.125rem;
    line-height: 1.6;
  }
}
.food-comparison__row-sub {
  margin: 0;
  color: var(--primary-700);
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.625rem;
  line-height: 1.6;
}
@media (min-width: 992px) {
  .food-comparison__row-sub {
    font-size: 0.75rem;
    line-height: 1.6;
  }
}
@media (min-width: 992px) {
  .food-comparison__row-sub {
    font-family: var(--body-font);
    font-weight: 300;
    font-size: 0.875rem;
    line-height: 1.6;
  }
}
@media (min-width: 992px) and (min-width: 992px) {
  .food-comparison__row-sub {
    font-size: 0.9375rem;
    line-height: 1.6;
  }
}
.food-comparison__cell {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: var(--spacing-2);
  min-height: 48px;
}
@media (min-width: 992px) {
  .food-comparison__cell {
    padding: var(--spacing-3);
    min-height: 64px;
  }
}
.food-comparison__cell--tuggs {
  background: var(--yellow);
}
.food-comparison__col-head--tuggs {
  background: var(--primary-800);
  border-top-left-radius: var(--spacing-3);
  border-top-right-radius: var(--spacing-3);
  padding-inline: var(--spacing-2);
}
@media (min-width: 992px) {
  .food-comparison__col-head--tuggs {
    padding-inline: var(--spacing-3);
  }
}
.food-comparison__col-head-logo {
  display: block;
  width: 100%;
  max-width: 140px;
  height: auto;
}
.food-comparison__row:last-of-type .food-comparison__cell--tuggs {
  border-bottom-left-radius: var(--spacing-3);
  border-bottom-right-radius: var(--spacing-3);
}
.food-comparison__col-head--other, .food-comparison__cell--other {
  background: #fff;
  color: var(--primary-700);
}
.food-comparison__col-head--other {
  border-top-left-radius: var(--spacing-3);
  border-top-right-radius: var(--spacing-3);
}
.food-comparison__row:last-of-type .food-comparison__cell--other {
  border-bottom-left-radius: var(--spacing-3);
  border-bottom-right-radius: var(--spacing-3);
}
.food-comparison__row {
  display: contents;
}
.food-comparison__row + .food-comparison__row .food-comparison__row-label {
  border-top: 1px solid var(--tan-500);
}
.food-comparison__mark {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  font-weight: 700;
  line-height: 1;
}
@media (min-width: 992px) {
  .food-comparison__mark {
    width: 36px;
    height: 36px;
  }
}
.food-comparison__mark--tick {
  background: var(--success);
}
.food-comparison__mark--cross {
  background: var(--pink-500);
}
.food-comparison__continuation {
  margin-top: var(--spacing-7);
}
@media (min-width: 992px) {
  .food-comparison__continuation {
    margin-top: var(--spacing-8);
  }
}
.food-comparison__continuation-rule {
  border: 0;
  border-top: 1px solid var(--tan-300);
  margin: 0 0 var(--spacing-5);
}
@media (min-width: 992px) {
  .food-comparison__continuation-rule {
    margin-bottom: var(--spacing-6);
  }
}
.food-comparison__continuation-header {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--spacing-3);
  margin-bottom: var(--spacing-4);
}
@media (min-width: 992px) {
  .food-comparison__continuation-header {
    grid-template-columns: 2fr 1fr;
    align-items: start;
    gap: var(--spacing-5);
    margin-bottom: var(--spacing-5);
  }
}
.food-comparison__continuation-title {
  margin: 0;
  color: var(--primary-800);
  font-weight: 400;
  text-align: left;
  font-family: var(--display-font);
  font-weight: 600;
  color: var(--primary-800);
  font-size: 2rem;
  line-height: 1.2;
}
@media (min-width: 992px) {
  .food-comparison__continuation-title {
    font-size: 2.5rem;
    line-height: 1.18;
  }
}
.food-comparison__continuation-lede {
  margin: 0;
  color: var(--primary-500);
  max-width: 40ch;
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.9375rem;
  line-height: 1.6;
}
@media (min-width: 992px) {
  .food-comparison__continuation-lede {
    font-size: 1rem;
    line-height: 1.6;
  }
}
@media (min-width: 992px) {
  .food-comparison__continuation-lede {
    justify-self: end;
    text-align: right;
  }
}

.food-comparison__continuation {
  --see-difference-card-height: 360px;
}
.food-comparison__continuation .see-difference__cards {
  max-width: none;
  margin: 0;
}
.food-comparison__continuation .see-difference__card::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 4px;
  background: var(--card-accent);
  transition: height 0.35s cubic-bezier(0.4, 0, 0.2, 1);
  z-index: 0;
}
.food-comparison__continuation .see-difference__card > * {
  position: relative;
  z-index: 1;
}
@media (min-width: 992px) and (hover: hover) {
  .food-comparison__continuation .see-difference__cards:hover .see-difference__card,
  .food-comparison__continuation .see-difference__cards .see-difference__card:hover {
    flex-grow: 1;
  }
  .food-comparison__continuation .see-difference__card:hover::after {
    height: 100%;
  }
  .food-comparison__continuation .see-difference__card:hover .see-difference__period,
  .food-comparison__continuation .see-difference__card:hover .see-difference__index,
  .food-comparison__continuation .see-difference__card:hover .see-difference__card-title,
  .food-comparison__continuation .see-difference__card:hover .see-difference__card-body {
    color: var(--primary-800) !important;
  }
  .food-comparison__continuation .see-difference__card:hover .see-difference__range {
    color: var(--primary-800) !important;
  }
  .food-comparison__continuation .see-difference__card:hover .see-difference__dot {
    background: var(--primary-800);
  }
}

header.desktop-header {
  display: none;
}
header.desktop-header input[type=checkbox] {
  display: none;
}
@media (min-width: 992px) {
  header.desktop-header {
    display: block;
    background-color: var(--navy);
    top: 0;
    left: 0;
    width: 100%;
    box-shadow: var(--light-shadow);
    z-index: 77;
  }
}
header.desktop-header:has(#desktopMenuToggle:checked) {
  z-index: 10001;
}
header.desktop-header .sub-desktop-burger-panel {
  position: fixed;
  top: 0;
  left: 0;
  bottom: 0;
  width: 30%;
  z-index: 2147483002;
  display: flex;
  flex-direction: column;
  background-color: white;
  box-shadow: var(--shadow);
  overflow: hidden;
  opacity: 0;
  pointer-events: none;
  transform: translateX(-100%);
  transition: transform 0.5s ease, opacity 0.5s ease;
}
header.desktop-header .sub-desktop-burger-panel .nav-links {
  flex: 1;
  overflow-y: auto;
}
header.desktop-header #desktopMenuToggle:checked ~ .sub-desktop-burger-panel {
  opacity: 1;
  pointer-events: auto;
  transform: translateX(0);
}
header.desktop-header #desktopMenuToggle:checked ~ #overlay {
  display: block;
}
header.desktop-header .sub-header__right details,
header.desktop-header .sub-header__right summary {
  color: white;
  all: unset;
  cursor: pointer;
}
header.desktop-header .sub-header__right details summary::-webkit-details-marker {
  display: none;
}
header.desktop-header ul {
  list-style: none;
}
header.desktop-header details > .accordion-content {
  list-style: none;
  background-color: var(--secondary-300);
  position: absolute;
  opacity: 0.95;
  border-radius: var(--spacing-1);
  box-shadow: var(--shadow);
}
header.desktop-header details > .accordion-content {
  padding: var(--spacing-1);
}
@media (min-width: 992px) {
  header.desktop-header details > .accordion-content {
    padding: var(--spacing-2);
  }
}
header.desktop-header details > .accordion-content li {
  text-align: left;
  cursor: pointer;
  transition: transform 0.2s ease-in-out;
}
header.desktop-header details > .accordion-content li {
  padding: var(--spacing-1);
}
@media (min-width: 992px) {
  header.desktop-header details > .accordion-content li {
    padding: var(--spacing-2);
  }
}
header.desktop-header details > .accordion-content li:hover {
  transform: scale(1.02);
}
header.desktop-header details > .avatar-dropdown {
  width: 200px;
  right: var(--spacing-2);
}

.sub-header__bar {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
}
.sub-header__bar {
  padding: var(--spacing-2);
}
@media (min-width: 992px) {
  .sub-header__bar {
    padding: var(--spacing-3);
  }
}

.sub-header__wordmark {
  justify-self: center;
}
.sub-header__wordmark img {
  width: 10ch;
  display: block;
}

.sub-header__left {
  display: flex;
  align-items: center;
  gap: var(--spacing-3);
  justify-self: start;
}

.sub-header__right {
  display: flex;
  align-items: center;
  gap: var(--spacing-3);
  justify-self: end;
}

.sub-header__desktop-links {
  display: flex;
  align-items: center;
  gap: var(--spacing-3);
  margin-left: var(--spacing-3);
}

.sub-header__icon-btn {
  display: flex;
  align-items: center;
  cursor: pointer;
  color: white;
}
.sub-header__icon-btn img {
  width: auto;
  height: var(--spacing-4);
}

.sub-nav-panel__header {
  background-color: var(--navy-800);
  flex-shrink: 0;
  padding-bottom: var(--spacing-4);
}

.sub-nav-panel__header-bar {
  display: flex;
  justify-content: flex-end;
  align-items: center;
}
.sub-nav-panel__header-bar {
  padding: var(--spacing-2);
}
@media (min-width: 992px) {
  .sub-nav-panel__header-bar {
    padding: var(--spacing-3);
  }
}

.sub-nav-panel__intro {
  padding: 0 var(--spacing-4) var(--spacing-3);
  text-align: left;
}

.sub-nav-panel__eyebrow {
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.875rem;
  line-height: 1.6;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--navy-300);
  margin-bottom: var(--spacing-2);
}
@media (min-width: 992px) {
  .sub-nav-panel__eyebrow {
    font-size: 0.9375rem;
    line-height: 1.6;
  }
}

.sub-nav-panel__heading {
  font-family: var(--display-font);
  font-size: 1.5rem;
  line-height: 1.2;
  letter-spacing: -0.03rem;
  color: white;
}
@media (min-width: 992px) {
  .sub-nav-panel__heading {
    font-size: 2rem;
    line-height: 1.18;
    letter-spacing: -0.04rem;
  }
}

.sub-nav-panel__login {
  margin-top: var(--spacing-4);
  display: flex;
  align-items: center;
  gap: var(--spacing-3);
}

.sub-nav-panel__login-text {
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.875rem;
  line-height: 1.6;
  color: var(--navy-300);
}
@media (min-width: 992px) {
  .sub-nav-panel__login-text {
    font-size: 0.9375rem;
    line-height: 1.6;
  }
}

.burger-nav-accordion {
  border-bottom: 1px solid var(--tan-100);
}
.burger-nav-accordion summary {
  list-style: none;
}
.burger-nav-accordion summary::-webkit-details-marker {
  display: none;
}
.burger-nav-accordion__header {
  display: flex;
  align-items: center;
  gap: var(--spacing-3);
  padding: var(--spacing-3) var(--spacing-4);
  cursor: pointer;
  text-align: left;
  transition: background-color 0.15s ease;
}
.burger-nav-accordion__header:hover {
  background-color: var(--tan-50);
}
.burger-nav-accordion__text {
  flex: 1;
  display: flex;
  flex-direction: column;
  text-align: left;
}
.burger-nav-accordion__text strong {
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 1rem;
  line-height: 1.6;
  font-weight: 600;
  color: var(--primary-800);
}
@media (min-width: 992px) {
  .burger-nav-accordion__text strong {
    font-size: 1.125rem;
    line-height: 1.6;
  }
}
.burger-nav-accordion__text span {
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.875rem;
  line-height: 1.6;
  color: var(--primary-400);
}
@media (min-width: 992px) {
  .burger-nav-accordion__text span {
    font-size: 0.9375rem;
    line-height: 1.6;
  }
}
.burger-nav-accordion__chevron {
  color: var(--primary-300);
  font-size: 1.25rem;
  transition: transform 0.2s ease;
  flex-shrink: 0;
  margin-left: auto;
}
.burger-nav-accordion[open] .burger-nav-accordion__chevron {
  transform: rotate(180deg);
}
.burger-nav-accordion__body {
  background-color: var(--tan-50);
}
.burger-nav-accordion__body li {
  list-style: none;
  text-align: left;
}
.burger-nav-accordion__body li a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: var(--spacing-25) var(--spacing-4);
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.9375rem;
  line-height: 1.6;
  color: var(--primary-600);
  text-decoration: none;
  border-bottom: 1px solid var(--tan-100);
  transition: background-color 0.15s ease, color 0.15s ease;
}
@media (min-width: 992px) {
  .burger-nav-accordion__body li a {
    font-size: 1rem;
    line-height: 1.6;
  }
}
.burger-nav-accordion__body li a::after {
  content: "›";
  color: var(--primary-300);
  font-size: 1.1rem;
  flex-shrink: 0;
}
.burger-nav-accordion__body li a:hover {
  background-color: white;
  color: var(--primary-800);
}

.burger-nav-link {
  display: flex;
  align-items: center;
  gap: var(--spacing-3);
  padding: var(--spacing-3) var(--spacing-4);
  text-align: left;
  text-decoration: none;
  border-bottom: 1px solid var(--tan-100);
  transition: background-color 0.15s ease;
}
.burger-nav-link:hover {
  background-color: var(--tan-50);
}
.burger-nav-link__text {
  flex: 1;
  text-align: left;
}
.burger-nav-link__text strong {
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 1rem;
  line-height: 1.6;
  font-weight: 600;
  color: var(--primary-800);
}
@media (min-width: 992px) {
  .burger-nav-link__text strong {
    font-size: 1.125rem;
    line-height: 1.6;
  }
}
.burger-nav-link__chevron {
  color: var(--primary-300);
  font-size: 1.25rem;
  flex-shrink: 0;
  margin-left: auto;
}
.burger-nav-link__cta {
  padding: var(--spacing-4);
}
.burger-nav-link--alert {
  background-color: var(--success-900);
  color: white;
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.875rem;
  line-height: 1.6;
}
@media (min-width: 992px) {
  .burger-nav-link--alert {
    font-size: 0.9375rem;
    line-height: 1.6;
  }
}
.burger-nav-link--alert a {
  color: white;
}

.sub-nav-panel__footer {
  background-color: var(--tan-50);
  border-top: 1px solid var(--tan-100);
  padding: var(--spacing-4);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--spacing-3);
  flex-shrink: 0;
}

.sub-nav-panel__footer-text {
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.9375rem;
  line-height: 1.6;
  color: var(--primary-400);
  text-align: center;
}
@media (min-width: 992px) {
  .sub-nav-panel__footer-text {
    font-size: 1rem;
    line-height: 1.6;
  }
}

#overlay {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5);
  z-index: 2147483001;
}

header.header-with-swipe-nav input[type=checkbox] {
  display: none;
}
header.header-with-swipe-nav nav {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 2147483002;
  background-color: white;
  box-shadow: var(--shadow);
  opacity: 0;
  transform: translateX(100%);
  transition: transform 0.5s ease, opacity 0.5s ease;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
header.header-with-swipe-nav nav .nav-links {
  flex: 1;
  overflow-y: auto;
}
header.header-with-swipe-nav #headerMenuToggle:checked ~ nav {
  transform: translateX(0);
  opacity: 1;
}
header.header-with-swipe-nav #headerMenuToggle:checked ~ #overlay {
  display: block;
}

.tabbed-content .tabs {
  display: flex;
  flex-wrap: wrap !important;
}
.tabbed-content .input {
  position: absolute;
  opacity: 0;
  width: auto;
}
.tabbed-content .label {
  width: -moz-fit-content;
  width: fit-content;
  cursor: pointer;
  font-weight: bold;
  font-size: 18px;
  color: var(--navy-400);
  background-color: var(--navy-50);
  transition: background 0.1s, color 0.1s;
}
.tabbed-content .label {
  padding: var(--spacing-2);
}
@media (min-width: 992px) {
  .tabbed-content .label {
    padding: var(--spacing-3);
  }
}
.tabbed-content .label:hover {
  background: var(--success-50);
  color: var(--navy);
}
.tabbed-content .label:active {
  background: #ccc;
}
.tabbed-content .input:focus + .label {
  z-index: 1;
}
.tabbed-content .input:checked + .label {
  background: #fff;
  color: var(--primary-800);
}
.tabbed-content .panel {
  display: none;
  width: 100%;
  background: #fff;
  order: 99;
}
.tabbed-content .input:checked + .label + .panel {
  display: block;
}

.site-toggle {
  display: flex;
  align-items: center;
  background-color: var(--navy-700) !important;
  border-radius: var(--spacing-5);
  padding: 0.2rem;
  gap: 0;
}
.site-toggle__item {
  padding: 0.3rem 1rem;
  border-radius: var(--spacing-5);
  color: var(--navy-300) !important;
  font-size: 0.85rem;
  font-weight: 600;
  text-decoration: none;
  transition: background-color 0.2s ease, color 0.2s ease;
  white-space: nowrap;
}
.site-toggle__item:hover {
  color: white;
}
.site-toggle__item--active {
  background-color: white;
  color: var(--navy-800) !important;
}
.site-toggle__item--active:hover {
  color: var(--navy-800);
}

.press-section-wrapper {
  background: var(--tan-100);
  padding: var(--spacing-6) var(--spacing-3);
}
@media (min-width: 992px) {
  .press-section-wrapper {
    padding: var(--spacing-6) var(--spacing-6);
  }
}

.press-section {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--spacing-3);
}
@media (min-width: 992px) {
  .press-section {
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    gap: 0;
  }
}
.press-section__trustpilot {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  gap: var(--spacing-3);
}
@media (min-width: 992px) {
  .press-section__trustpilot {
    padding-right: var(--spacing-6);
  }
}
.press-section__tagline {
  margin: 4px 0 0;
  font-size: 0.875rem;
  line-height: 1;
  color: var(--primary-400);
  text-align: left;
}
.press-section__divider {
  background: var(--primary-300);
  flex-shrink: 0;
  height: 1px;
  width: 100%;
}
@media (min-width: 992px) {
  .press-section__divider {
    height: auto;
    align-self: stretch;
    width: 1px;
    margin-inline: var(--spacing-6);
  }
}
.press-section__logos {
  width: 100%;
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: minmax(5rem, auto);
  overflow-x: auto;
  overflow-y: hidden;
  scroll-snap-type: x mandatory;
  gap: var(--spacing-4);
  align-items: center;
}
.press-section__logos::-webkit-scrollbar {
  display: none;
}
.press-section__logos a {
  scroll-snap-align: start;
}
@media (min-width: 992px) {
  .press-section__logos {
    display: flex;
    overflow-x: initial;
    flex: 0 0 35%;
    flex-wrap: nowrap;
    justify-content: space-between;
    gap: var(--spacing-3);
  }
}
@media (min-width: 1500px) {
  .press-section__logos {
    flex: 0 0 30%;
  }
}

.press-img {
  height: 1rem;
  width: auto;
  filter: grayscale(100%) opacity(0.6);
}
@media (min-width: 992px) {
  .press-img {
    height: 1.125rem;
  }
}

.gut-supplement-bg-image {
  background-image: url(//www.tuggs.uk/assets/marketing/2025-lifestyle-dog-sofa-treat-293dbadc2a550fac7a53b16fb7d2a67f672d8856277f6d6f01c63737680fb458.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
}

.feature-list {
  display: none;
}
@media (min-width: 992px) {
  .feature-list {
    width: -moz-fit-content;
    width: fit-content;
    list-style: none;
    display: flex;
    gap: 20px;
    padding: 0;
    margin: 0;
  }
}

.feature-list li, .feature-list li span {
  color: inherit;
}

.feature-list li::after {
  content: "•";
  margin-left: 20px;
}

.feature-list li:last-child::after {
  content: "";
}

.accordion-scroll {
  position: relative;
  border-radius: var(--spacing-2);
  max-height: 300px;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  -webkit-mask-image: linear-gradient(to bottom, black 80%, transparent);
          mask-image: linear-gradient(to bottom, black 80%, transparent);
  scrollbar-width: none;
  -ms-overflow-style: none;
  z-index: 2;
}

.accordion-scroll::-webkit-scrollbar {
  display: none;
}

.ingredient-circles {
  scale: 0.5;
  rotate: 90deg;
  bottom: -55%;
  right: -47%;
  z-index: 1;
}
@media (min-width: 992px) {
  .ingredient-circles {
    rotate: 0deg;
    scale: 1;
    top: -70%;
    right: -20%;
  }
}

.feeding-table {
  color: white;
  padding: var(--spacing-2);
  border-radius: var(--spacing-2);
}

.feeding-row {
  display: grid;
  grid-template-columns: 1fr auto;
  padding: 18px 0;
  border-bottom: 1px solid rgba(255, 255, 255, 0.25);
  font-size: 18px;
}

.feeding-row:last-child {
  border-bottom: none;
}

.feeding-header {
  color: var(--green-300);
  font-weight: 700;
  font-size: 0.75rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.feeding-row__label {
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
}

.feeding-row__weight {
  font-weight: 700;
  color: white;
}

.feeding-row__subtitle {
  font-size: 0.875rem;
  color: rgba(255, 255, 255, 0.5);
}

.feeding-row__amount-cell {
  display: flex;
  align-items: baseline;
  gap: 0.3rem;
  justify-content: flex-end;
}

.feeding-row__amount {
  font-weight: 800;
  color: var(--green-300);
}

.feeding-row__unit {
  font-size: 0.875rem;
  color: rgba(255, 255, 255, 0.75);
}

.trial-offer-section {
  background-color: var(--white);
  padding: var(--spacing-6) var(--spacing-4);
}
@media (min-width: 992px) {
  .trial-offer-section {
    padding: var(--spacing-8) var(--spacing-4);
  }
}
.trial-offer-section--with-packshot {
  overflow: visible;
  background-color: transparent;
}
.trial-offer-section--with-packshot + .tape-banner-section {
  background-color: transparent;
}
.trial-offer-section__grid {
  margin-inline: auto;
  display: flex;
  flex-direction: column;
  gap: var(--spacing-5);
}
@media (min-width: 992px) {
  .trial-offer-section__grid {
    max-width: 82%;
    display: grid;
    grid-template-columns: 1.8fr 1fr;
    gap: var(--spacing-6);
    align-items: end;
  }
}
.trial-offer-section__packshot {
  position: relative;
  z-index: -1;
  display: flex;
  justify-content: center;
  align-items: flex-end;
  overflow-x: clip;
  width: calc(100% + 2 * var(--spacing-4));
  margin-inline: calc(-1 * var(--spacing-4));
  margin-top: var(--spacing-9);
  margin-bottom: -300px;
}
@media (min-width: 992px) {
  .trial-offer-section__packshot {
    justify-content: flex-end;
    margin-bottom: -350px;
  }
}
.trial-offer-section__packshot-image {
  display: block;
  flex-shrink: 0;
  width: 100%;
  height: auto;
  -o-object-fit: contain;
     object-fit: contain;
  -o-object-position: bottom;
     object-position: bottom;
  transform: scale(1.5);
  transform-origin: bottom center;
}
@media (min-width: 992px) {
  .trial-offer-section__packshot-image {
    transform: scale(1.5);
  }
}

.trial-offer-wrapper {
  position: relative;
}
@media (min-width: 992px) {
  .trial-offer-wrapper {
    margin-bottom: var(--spacing-8);
  }
}
.trial-offer-wrapper::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: var(--spacing-4);
  transform: translate(0, 0) rotate(0deg);
  transform-origin: center;
  transition: transform 0.7s cubic-bezier(0.2, 0.9, 0.3, 1.2);
  z-index: 0;
}
.trial-offer-wrapper.is-visible::before {
  transform: translate(10px, 12px) rotate(-1.5deg);
}
@media (min-width: 992px) {
  .trial-offer-wrapper.is-visible::before {
    transform: translate(14px, 16px) rotate(-1.5deg);
  }
}
@media (hover: hover) {
  .trial-offer-wrapper.is-visible:hover::before {
    transform: translate(18px, 20px) rotate(-2.5deg);
  }
}
@media (hover: hover) and (min-width: 992px) {
  .trial-offer-wrapper.is-visible:hover::before {
    transform: translate(22px, 24px) rotate(-2.5deg);
  }
}
.trial-offer-wrapper--yellow::before {
  background-color: var(--yellow-500);
}
.trial-offer-wrapper--pink::before {
  background-color: var(--pink-500);
}
.trial-offer-wrapper--purple::before {
  background-color: var(--purple-500);
}
.trial-offer-wrapper--orange::before {
  background-color: var(--orange-500);
}
.trial-offer-wrapper--green::before {
  background-color: var(--green-300);
}

.trial-offer-card {
  position: relative;
  z-index: 1;
  background-color: var(--white);
  color: var(--primary-800);
  border-radius: var(--spacing-4);
  padding: var(--spacing-5) var(--spacing-4);
  display: flex;
  flex-direction: column;
  gap: var(--spacing-4);
  text-align: left;
  transform-origin: center;
  transition: transform 0.5s cubic-bezier(0.2, 0.9, 0.3, 1.2);
}
@media (hover: hover) {
  .trial-offer-wrapper.is-visible:hover .trial-offer-card {
    transform: translate(-3px, -5px) rotate(0.6deg);
  }
}
@media (min-width: 992px) {
  .trial-offer-card {
    display: grid;
    grid-template-columns: 1.2fr 0.8fr;
    gap: var(--spacing-7);
    padding: var(--spacing-7);
    align-items: center;
  }
}
.trial-offer-card__copy {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-2);
}
@media (min-width: 992px) {
  .trial-offer-card__copy {
    gap: var(--spacing-3);
  }
}
.trial-offer-card__buy {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-3);
}
@media (min-width: 992px) {
  .trial-offer-card__buy {
    gap: var(--spacing-4);
  }
}
.trial-offer-card__eyebrow {
  margin: 0;
  color: var(--primary-800);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.18em;
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.875rem;
  line-height: 1.6;
}
@media (min-width: 992px) {
  .trial-offer-card__eyebrow {
    font-size: 0.9375rem;
    line-height: 1.6;
  }
}
.trial-offer-card__headline {
  margin: 0;
  color: var(--primary-800);
  font-weight: 400;
  line-height: 1.05;
  font-family: var(--display-font);
  font-size: 2rem;
  line-height: 1.18;
  letter-spacing: -0.05rem;
}
@media (min-width: 992px) {
  .trial-offer-card__headline {
    font-size: 2.5rem;
    line-height: 1.15;
    letter-spacing: -0.06rem;
  }
}
.trial-offer-card__headline strong {
  font-weight: 800;
}
.trial-offer-card__headline sup {
  font-weight: 400;
  font-size: 0.55em;
  vertical-align: super;
  line-height: 0;
  margin-left: 0.05em;
}
.trial-offer-card__body {
  margin: 0;
  color: var(--primary-700);
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.9375rem;
  line-height: 1.6;
}
@media (min-width: 992px) {
  .trial-offer-card__body {
    font-size: 1rem;
    line-height: 1.6;
  }
}
.trial-offer-card__caption {
  margin: 0;
  color: var(--primary-700);
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.625rem;
  line-height: 1.6;
}
@media (min-width: 992px) {
  .trial-offer-card__caption {
    font-size: 0.75rem;
    line-height: 1.6;
  }
}
.trial-offer-card__benefits {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: var(--spacing-2);
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 1rem;
  line-height: 1.6;
}
@media (min-width: 992px) {
  .trial-offer-card__benefits {
    font-size: 1.125rem;
    line-height: 1.6;
  }
}
.trial-offer-card__benefit {
  display: inline-flex;
  align-items: center;
  gap: var(--spacing-2);
  color: var(--primary-800);
  font-weight: 600;
}
.trial-offer-card__tick {
  color: var(--green-700);
  font-weight: 800;
  font-size: 1.1em;
}

.ingredients-carousel {
  color: var(--white);
  padding-block: var(--spacing-7);
}
@media (min-width: 992px) {
  .ingredients-carousel {
    padding-block: var(--spacing-8);
  }
}
.ingredients-carousel__inner {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  text-align: left;
  gap: var(--spacing-3);
  padding-inline: var(--spacing-4);
  margin-bottom: var(--spacing-5);
}
@media (min-width: 992px) {
  .ingredients-carousel__inner {
    max-width: 82%;
    margin-inline: auto;
    padding-inline: var(--spacing-8);
    gap: var(--spacing-3);
    margin-bottom: var(--spacing-6);
  }
}
.ingredients-carousel__eyebrow {
  margin: 0;
  color: var(--green-300);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.18em;
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.875rem;
  line-height: 1.6;
}
@media (min-width: 992px) {
  .ingredients-carousel__eyebrow {
    font-size: 0.9375rem;
    line-height: 1.6;
  }
}
.ingredients-carousel__title {
  margin: 0;
  color: var(--white);
  font-weight: 800;
  font-family: var(--display-font);
  font-size: 2.75rem;
  line-height: 1.15;
  letter-spacing: -0.06rem;
}
@media (min-width: 992px) {
  .ingredients-carousel__title {
    font-size: 3.5rem;
    line-height: 1.12;
    letter-spacing: -0.08rem;
  }
}
.ingredients-carousel__subheading {
  margin: 0;
  color: var(--navy-200);
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 1rem;
  line-height: 1.6;
}
@media (min-width: 992px) {
  .ingredients-carousel__subheading {
    font-size: 1.125rem;
    line-height: 1.6;
  }
}
.ingredients-carousel__rail-wrap {
  position: relative;
}
@media (min-width: 992px) {
  .ingredients-carousel__rail-wrap {
    max-width: 82%;
    margin-inline: auto;
    padding-inline: var(--spacing-8);
  }
}
.ingredients-carousel__rail {
  list-style: none;
  margin: 0;
  margin-left: var(--spacing-4);
  padding: 0;
  display: flex;
  gap: var(--spacing-3);
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
}
.ingredients-carousel__rail::-webkit-scrollbar {
  display: none;
}
@media (min-width: 992px) {
  .ingredients-carousel__rail {
    margin-left: 0;
    gap: var(--spacing-4);
  }
}

.ingredient-card {
  --card-accent: var(--green-300);
  position: relative;
  flex: 0 0 78%;
  scroll-snap-align: start;
  display: flex;
  flex-direction: column;
  gap: var(--spacing-3);
  background-color: var(--primary-700);
  border-radius: var(--spacing-3);
  padding: var(--spacing-4) var(--spacing-4) var(--spacing-5);
  overflow: hidden;
  text-align: left;
  color: var(--white);
  transition: color 0.3s ease;
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 0.6s ease, transform 0.6s ease, color 0.3s ease;
}
.ingredient-card.is-visible {
  opacity: 1;
  transform: translateY(0);
}
.ingredient-card::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 4px;
  background-color: var(--card-accent);
  transition: height 0.35s cubic-bezier(0.4, 0, 0.2, 1);
  z-index: 0;
}
.ingredient-card > * {
  position: relative;
  z-index: 1;
}
@media (hover: hover) {
  .ingredient-card:hover {
    color: var(--primary-800);
  }
  .ingredient-card:hover::after {
    height: 100%;
  }
  .ingredient-card:hover .ingredient-card__title,
  .ingredient-card:hover .ingredient-card__body {
    color: var(--primary-800);
  }
  .ingredient-card:hover .ingredient-card__number {
    color: var(--primary-600);
  }
}
@media (hover: none) {
  .ingredient-card::after {
    transition: height 0.6s cubic-bezier(0.4, 0, 0.2, 1) 0.5s;
  }
  .ingredient-card.is-visible::after {
    height: 10%;
  }
}
@media (min-width: 768px) {
  .ingredient-card {
    flex: 0 0 40%;
  }
}
@media (min-width: 992px) {
  .ingredient-card {
    flex: 0 0 calc((100% - 3 * var(--spacing-4)) / 3.5);
    padding: var(--spacing-5) var(--spacing-5) var(--spacing-6);
  }
}
.ingredient-card--green {
  --card-accent: var(--green-300);
}
.ingredient-card--pink {
  --card-accent: var(--pink-500);
}
.ingredient-card--yellow {
  --card-accent: var(--yellow-500);
}
.ingredient-card--purple {
  --card-accent: var(--purple-500);
}
.ingredient-card--orange {
  --card-accent: var(--orange-500);
}
.ingredient-card--blue {
  --card-accent: var(--blue-300);
}
.ingredient-card__top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--spacing-3);
}
.ingredient-card__image {
  display: block;
  width: 64px;
  height: 64px;
  margin: 0;
  -o-object-fit: contain;
     object-fit: contain;
  -o-object-position: left center;
     object-position: left center;
}
@media (min-width: 992px) {
  .ingredient-card__image {
    width: 76px;
    height: 76px;
  }
}
.ingredient-card__number {
  color: var(--navy-200);
  font-weight: 500;
  letter-spacing: 0.05em;
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.875rem;
  line-height: 1.6;
}
@media (min-width: 992px) {
  .ingredient-card__number {
    font-size: 0.9375rem;
    line-height: 1.6;
  }
}
.ingredient-card__title {
  margin: 0;
  color: var(--white);
  font-weight: 500;
  font-family: var(--display-font);
  font-size: 1.25rem;
  line-height: 1.25;
  letter-spacing: -0.015rem;
}
@media (min-width: 992px) {
  .ingredient-card__title {
    font-size: 1.5rem;
    line-height: 1.22;
    letter-spacing: -0.02rem;
  }
}
.ingredient-card__body {
  margin: 0;
  color: var(--navy-200);
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.9375rem;
  line-height: 1.6;
}
@media (min-width: 992px) {
  .ingredient-card__body {
    font-size: 1rem;
    line-height: 1.6;
  }
}

.post-card {
  padding: 0;
}
.post-card .content {
  padding: var(--spacing-2);
}
@media (min-width: 992px) {
  .post-card .content {
    padding: var(--spacing-3);
  }
}
@media (min-width: 992px) {
  .post-card .content {
    text-align: left;
  }
}
.post-card:hover {
  transform: rotate(1deg);
}
.post-card .red-900 {
  color: var(--red-900) !important;
}

.find-address-container {
  margin-top: var(--spacing-4);
  width: 100%;
}
.find-address-container .input-container {
  display: flex;
  flex-wrap: wrap;
  gap: var(--spacing-4);
  align-items: baseline;
  justify-content: center;
}
@media (min-width: 992px) {
  .find-address-container .input-container {
    justify-content: flex-start;
  }
  .find-address-container .input-container input {
    width: 75%;
  }
}
.find-address-container .input-container button {
  padding: 0.25rem;
  font-family: var(--body-font);
  text-transform: initial;
  background-color: transparent;
  outline: 2px solid var(--secondary-500) !important;
  color: var(--primary-800);
  border: none;
  margin-top: 0;
  font-size: var(--body-font-size);
}
.find-address-container .input-container select {
  display: block;
}

.refer-a-friend-offer {
  align-items: flex-start;
  text-align: left;
  box-shadow: none;
}
.refer-a-friend-offer.user {
  background-color: var(--success-100);
  background-image: url(//www.tuggs.uk/assets/dogs-images/hero-dog-table-83964109fca2aff503eeb01777899cc5a1b4bbc771f2f899cab58a5c22089f92.png);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: bottom;
  padding-bottom: 6rem;
}
.refer-a-friend-offer.friend {
  background-color: var(--warning-100);
  background-image: url(//www.tuggs.uk/assets/food-images/floating-ingredients-b0a9fd5b096353c154ab84a15f00f4c107658235468bd4aa3513249f4fb26df7.png);
  background-repeat: no-repeat;
  background-position: right;
  background-size: 35%;
}

.insect-arrow {
  width: 4rem;
  transform: rotate(180deg);
}
@media (min-width: 992px) {
  .insect-arrow {
    transform: rotate(90deg);
    margin-inline: var(--spacing-6);
  }
}

.extras-product-image {
  padding: 0;
  width: 100%;
  height: 20rem;
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
}
.extras-product-image.tuggs-for-tummies {
  background-image: url(//www.tuggs.uk/assets/food-images/lifestyle-treats-bf3c09ae0c279ae05849dfc05eaeb668c2e5112a2c64d7b996261a699f83ffae.png);
}
.extras-product-image.tuggs-for-chilling {
  background-image: url(//www.tuggs.uk/assets/food-images/tuggs-for-chilling-product-sm-5303f760c19ce7ecea1289e37b30d7ee7a388049b7f487629bb399aad9df1592.png);
}

.extras-card.container {
  display: flex;
  flex-direction: column;
  text-align: left;
  background-color: white;
  border-radius: 0.5rem;
  overflow-x: hidden;
  padding: 0;
}
.extras-card.container .remove-link {
  text-align: end;
}
.extras-card.container .remove-link > a {
  color: var(--primary-500);
  font-size: 1rem;
}
@media (min-width: 768px) {
  .extras-card.container {
    flex-direction: row;
    align-items: center;
  }
}

.extras-card.image-container {
  padding: 0;
}
.extras-card.image-container img {
  aspect-ratio: 2/1.5;
}
@media (min-width: 992px) {
  .extras-card.image-container img {
    aspect-ratio: 1.45/2;
    width: 18rem;
    height: 100%;
  }
}

.extras-card.details-container {
  width: 100%;
  padding: var(--spacing-2);
}
@media (min-width: 992px) {
  .extras-card.details-container {
    padding: var(--spacing-3);
  }
}
.extras-card.details-container > .details {
  display: flex;
  flex-direction: column;
}
@media (min-width: 992px) {
  .extras-card.details-container > .details {
    flex-direction: row;
    justify-content: space-between;
    align-items: baseline;
  }
}

.extras-card.form-container {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-4);
}
@media (min-width: 1200px) {
  .extras-card.form-container {
    flex-direction: row;
  }
}

.extras-card.form-details {
  background-color: var(--secondary-200);
  border-radius: 0.5rem;
  text-align: center;
}
.extras-card.form-details.in-plan {
  padding: var(--spacing-1) var(--spacing-2);
}
@media (min-width: 992px) {
  .extras-card.form-details.in-plan {
    width: -moz-fit-content;
    width: fit-content;
  }
}
.extras-card.form-details > .price-and-cta {
  display: flex;
  align-content: center;
  justify-content: space-around;
  background-color: var(--secondary-200);
  border-radius: 0.5rem;
}
.extras-card.form-details > .price-and-cta a {
  height: -moz-fit-content;
  height: fit-content;
}

.in-plan {
  display: flex;
  gap: var(--spacing-2);
  align-items: baseline;
  justify-content: space-around;
}
.in-plan input {
  height: -moz-fit-content;
  height: fit-content;
}

.price-and-cta {
  display: flex;
  align-content: center;
  justify-content: space-around;
  background-color: var(--secondary-200);
  border-radius: 0.5rem;
}
.price-and-cta a {
  height: -moz-fit-content;
  height: fit-content;
}

.table-container {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}
.table-container table {
  border-collapse: collapse;
}
.table-container thead {
  font-family: var(--header-font);
}
.table-container th, .table-container td {
  border: 2px solid var(--primary-800);
}

.next-delivery-date-container {
  background-color: var(--secondary-400);
  border-radius: var(--spacing-2);
  margin-top: var(--spacing-5);
  padding: var(--spacing-2);
}
@media (min-width: 992px) {
  .next-delivery-date-container {
    padding: var(--spacing-3);
  }
}

.pre-discount-price {
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.875rem;
  line-height: 1.6;
  color: var(--navy-300);
  font-weight: 300;
}
@media (min-width: 992px) {
  .pre-discount-price {
    font-size: 0.9375rem;
    line-height: 1.6;
  }
}

.plan-promo-code-form__label {
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.875rem;
  line-height: 1.6;
  color: var(--primary-800);
  margin: 0;
}
@media (min-width: 992px) {
  .plan-promo-code-form__label {
    font-size: 0.9375rem;
    line-height: 1.6;
  }
}

.points-action-card {
  background-color: var(--primary);
  position: relative;
}
.points-action-card.completed {
  background-color: var(--primary-700);
}
.points-action-card.completed .tick {
  position: absolute;
  right: 0.5rem;
  top: 0.5rem;
}

.plan-action-card-wrapper {
  padding: var(--spacing-4);
}
@media (min-width: 992px) {
  .plan-action-card-wrapper {
    padding: var(--spacing-7);
  }
}

.plan-action-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--spacing-5);
  text-align: center;
}

.plan-action-card__header {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-2);
  max-width: 36rem;
}

.plan-action-card__title {
  font-family: var(--display-font);
  font-weight: 600;
  color: var(--primary-800);
  font-size: 2rem;
  line-height: 1.2;
}
@media (min-width: 992px) {
  .plan-action-card__title {
    font-size: 2.5rem;
    line-height: 1.18;
  }
}

.plan-action-card__lede {
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.9375rem;
  line-height: 1.6;
  color: var(--primary-500);
}
@media (min-width: 992px) {
  .plan-action-card__lede {
    font-size: 1rem;
    line-height: 1.6;
  }
}

.plan-action-card__form {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-4);
  align-items: center;
  width: 100%;
}

.plan-action-card__feedback {
  width: 16rem;
  max-width: 16rem;
}
@media (min-width: 768px) {
  .plan-action-card__feedback {
    width: 32rem;
    max-width: 32rem;
  }
}
.plan-action-card__feedback textarea {
  width: 100%;
}

.plan-action-note {
  background-color: var(--warning-50);
  border: 1px solid var(--warning-500);
  display: flex;
  flex-direction: column;
  gap: var(--spacing-1);
  text-align: left;
  max-width: 36rem;
}

.plan-action-note__title {
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.9375rem;
  line-height: 1.6;
  font-weight: 700;
  color: var(--primary-800);
}
@media (min-width: 992px) {
  .plan-action-note__title {
    font-size: 1rem;
    line-height: 1.6;
  }
}

.plan-action-note__body {
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.875rem;
  line-height: 1.6;
  color: var(--primary-700);
}
@media (min-width: 992px) {
  .plan-action-note__body {
    font-size: 0.9375rem;
    line-height: 1.6;
  }
}

.medium-button-tan {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1rem;
  text-align: left;
}
.medium-button-tan > .radio > label {
  width: 16rem;
  max-width: 16rem;
  display: flex;
  align-items: center;
  justify-content: start;
  border-radius: 0.25rem;
}
.medium-button-tan > .radio > label::before {
  content: "";
  height: 25px;
  width: 25px;
  background-color: white;
  border-radius: 50%;
  display: inline-block;
  margin-right: var(--spacing-25);
}
@media (min-width: 768px) {
  .medium-button-tan > .radio > label {
    width: 32rem;
    max-width: 32rem;
  }
}
.medium-button-tan > .radio > label:has(input:checked) {
  background: var(--secondary-200);
  color: var(--primary-800);
}
.medium-button-tan > .radio > label:has(input:checked)::before {
  content: "✔";
  text-align: center;
  font-size: 1rem;
  background-color: var(--primary-800);
  color: white;
}

.plan_cancellation_reasons_additional_feedback {
  display: inline-block;
  width: 16rem;
  max-width: 16rem;
}
@media (min-width: 768px) {
  .plan_cancellation_reasons_additional_feedback {
    width: 32rem;
    max-width: 32rem;
  }
}

.link-submit-button {
  font-family: var(--body-font) !important;
  text-transform: none !important;
  background: none !important;
  text-decoration: underline !important;
  color: var(--primary-800) !important;
}
.link-submit-button:hover {
  outline: none !important;
}

.back-button {
  display: inline-block;
  margin-bottom: var(--spacing-3);
}

.recipe-health-section {
  position: relative;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
@media (min-width: 992px) {
  .recipe-health-section {
    display: grid;
    grid-template-columns: 0.7fr 1.3fr;
    align-items: center;
  }
}
.recipe-health-section__image-wrap {
  width: 100%;
  order: 2;
}
@media (min-width: 992px) {
  .recipe-health-section__image-wrap {
    order: 0;
  }
}
.recipe-health-section__image {
  display: block;
  width: 100%;
  height: auto;
}
.recipe-health-section__content {
  display: flex;
  flex-direction: column;
  order: 1;
  padding: var(--spacing-7) var(--spacing-4);
}
@media (min-width: 992px) {
  .recipe-health-section__content {
    order: 0;
    padding: var(--spacing-8) 9vw var(--spacing-8) var(--spacing-8);
  }
}
.recipe-health-section__copy {
  display: flex;
  flex-direction: column;
  text-align: left;
}
.recipe-health-section__eyebrow {
  margin: 0 0 var(--spacing-3);
  color: var(--white);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.18em;
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.875rem;
  line-height: 1.6;
}
@media (min-width: 992px) {
  .recipe-health-section__eyebrow {
    font-size: 0.9375rem;
    line-height: 1.6;
  }
}
.recipe-health-section__title {
  margin: 0 0 var(--spacing-3);
  color: var(--white);
  font-weight: 400;
  font-family: var(--display-font);
  font-size: 2rem;
  line-height: 1.18;
  letter-spacing: -0.05rem;
}
@media (min-width: 992px) {
  .recipe-health-section__title {
    font-size: 2.5rem;
    line-height: 1.15;
    letter-spacing: -0.06rem;
  }
}
.recipe-health-section__subheading {
  margin: 0 0 var(--spacing-5);
  color: var(--navy-200);
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 1rem;
  line-height: 1.6;
}
@media (min-width: 992px) {
  .recipe-health-section__subheading {
    font-size: 1.125rem;
    line-height: 1.6;
  }
}

.recipe-health-benefits {
  --recipe-accent: var(--primary-500);
  --recipe-rule: var(--primary-100);
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0;
}
.recipe-health-benefits--green {
  --recipe-accent: var(--green-500);
  --recipe-rule: var(--green-300);
}
.recipe-health-benefits--pink {
  --recipe-accent: var(--pink-500);
  --recipe-rule: var(--pink-300);
}
.recipe-health-benefits--purple {
  --recipe-accent: var(--purple-500);
  --recipe-rule: var(--purple-300);
}
.recipe-health-benefits--orange {
  --recipe-accent: var(--orange-500);
  --recipe-rule: var(--orange-300);
}
.recipe-health-benefits--yellow {
  --recipe-accent: var(--yellow-500);
  --recipe-rule: var(--yellow-300);
}
.recipe-health-benefits__item {
  display: flex;
  align-items: center;
  gap: var(--spacing-4);
  padding: var(--spacing-25) 0;
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 0.6s ease, transform 0.6s ease;
}
.recipe-health-benefits__item.is-visible {
  opacity: 1;
  transform: translateY(0);
}
@media (min-width: 992px) {
  .recipe-health-benefits__item {
    gap: var(--spacing-4);
    padding: var(--spacing-3) 0;
  }
}
.recipe-health-benefits__number {
  flex-shrink: 0;
  color: var(--recipe-accent);
  font-weight: 500;
  line-height: 1;
  font-family: var(--display-font);
  font-size: 2rem;
  line-height: 1.18;
  letter-spacing: -0.05rem;
}
@media (min-width: 992px) {
  .recipe-health-benefits__number {
    font-size: 2.5rem;
    line-height: 1.15;
    letter-spacing: -0.06rem;
  }
}
.recipe-health-benefits__text {
  margin: 0;
  color: var(--white);
  text-align: left;
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 1rem;
  line-height: 1.6;
}
@media (min-width: 992px) {
  .recipe-health-benefits__text {
    font-size: 1.125rem;
    line-height: 1.6;
  }
}
.recipe-health-benefits__rule {
  margin: 0;
  width: 100%;
  border: 0;
  border-top: 1px solid var(--recipe-rule);
}

.recipe-hero {
  position: relative;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  background-color: var(--tan-200);
}
@media (min-width: 992px) {
  .recipe-hero {
    display: grid;
    grid-template-columns: 1.05fr 0.95fr;
    grid-template-areas: "copy image" "stats image";
    grid-template-rows: 1fr auto;
    align-items: center;
    min-height: 560px;
  }
}
.recipe-hero__copy {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  text-align: left;
  gap: var(--spacing-4);
  padding: var(--spacing-6) var(--spacing-4) var(--spacing-5);
}
@media (min-width: 992px) {
  .recipe-hero__copy {
    grid-area: copy;
    align-self: center;
    gap: var(--spacing-5);
    padding: var(--spacing-7) var(--spacing-5) var(--spacing-5) calc(9vw + var(--spacing-3));
  }
}
.recipe-hero__heading {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-2);
  align-items: flex-start;
}
.recipe-hero__action {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-2);
  align-items: flex-start;
}
.recipe-hero__rating {
  margin: 0;
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--spacing-2);
  color: var(--primary-700);
  font-weight: 600;
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.875rem;
  line-height: 1.6;
}
@media (min-width: 992px) {
  .recipe-hero__rating {
    font-size: 0.9375rem;
    line-height: 1.6;
  }
}
.recipe-hero__stars {
  color: var(--green-700);
  letter-spacing: 0.1em;
}
.recipe-hero__eyebrow {
  margin: 0;
  color: var(--primary-800);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.18em;
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.875rem;
  line-height: 1.6;
}
@media (min-width: 992px) {
  .recipe-hero__eyebrow {
    font-size: 0.9375rem;
    line-height: 1.6;
  }
}
.recipe-hero__microcopy {
  margin: 0;
  color: var(--primary-500);
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.875rem;
  line-height: 1.6;
}
@media (min-width: 992px) {
  .recipe-hero__microcopy {
    font-size: 0.9375rem;
    line-height: 1.6;
  }
}
.recipe-hero__stats {
  width: 100%;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  background-color: var(--tan-100);
}
@media (min-width: 992px) {
  .recipe-hero__stats {
    grid-area: stats;
    align-self: end;
  }
}
.recipe-hero__stat {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: var(--spacing-1);
  padding: var(--spacing-3) var(--spacing-2);
  overflow: hidden;
  isolation: isolate;
}
@media (min-width: 992px) {
  .recipe-hero__stat {
    gap: var(--spacing-2);
    padding: var(--spacing-5) var(--spacing-4);
  }
}
.recipe-hero__stat + .recipe-hero__stat {
  border-left: 1px solid var(--tan-300);
}
.recipe-hero__stat:nth-child(odd) {
  background-color: var(--tan-200);
}
.recipe-hero__stat:nth-child(even) {
  background-color: var(--tan-50);
}
.recipe-hero__stat::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  height: 5px;
  background-color: var(--accent);
  z-index: -1;
  transition: height 0.35s cubic-bezier(0.4, 0, 0.2, 1);
}
@media (min-width: 992px) {
  .recipe-hero__stat::after {
    height: 5px;
  }
}
.recipe-hero__stat:nth-child(odd)::after {
  top: 0;
}
.recipe-hero__stat:nth-child(even)::after {
  bottom: 0;
}
.recipe-hero__stat:hover::after {
  height: 100%;
}
.recipe-hero__stat:hover .recipe-hero__stat-label, .recipe-hero__stat:hover .recipe-hero__stat-sub {
  color: var(--primary-800);
}
.recipe-hero__stat--green {
  --accent: var(--green-300);
}
.recipe-hero__stat--yellow {
  --accent: var(--yellow-500);
}
.recipe-hero__stat--pink {
  --accent: var(--pink-500);
}
.recipe-hero__stat--blue {
  --accent: var(--blue-300);
}
.recipe-hero__stat-label {
  margin: 0;
  color: var(--primary-400);
  transition: color 0.35s cubic-bezier(0.4, 0, 0.2, 1);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.625rem;
  line-height: 1.6;
}
@media (min-width: 992px) {
  .recipe-hero__stat-label {
    font-size: 0.75rem;
    line-height: 1.6;
  }
}
.recipe-hero__stat-sub {
  display: block;
  margin-top: var(--spacing-1);
  color: var(--primary-400);
  font-weight: 400;
  letter-spacing: 0.08em;
  text-transform: none;
  transition: color 0.35s cubic-bezier(0.4, 0, 0.2, 1);
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.625rem;
  line-height: 1.6;
}
@media (min-width: 992px) {
  .recipe-hero__stat-sub {
    font-size: 0.75rem;
    line-height: 1.6;
  }
}
.recipe-hero__stat-value {
  margin: 0;
  color: var(--primary-800);
  line-height: 1;
  font-family: var(--display-font);
  font-weight: 600;
  color: var(--primary-800);
  font-size: 1.5rem;
  line-height: 1.22;
  font-weight: 400 !important;
}
@media (min-width: 992px) {
  .recipe-hero__stat-value {
    font-size: 2rem;
    line-height: 1.2;
  }
}
@media (min-width: 992px) {
  .recipe-hero__stat-value {
    font-family: var(--display-font);
    font-weight: 600;
    color: var(--primary-800);
    font-size: 2rem;
    line-height: 1.2;
    font-weight: 400 !important;
  }
}
@media (min-width: 992px) and (min-width: 992px) {
  .recipe-hero__stat-value {
    font-size: 2.5rem;
    line-height: 1.18;
  }
}
.recipe-hero__title {
  margin: 0;
  color: var(--primary-800);
  font-weight: 800;
  line-height: 0.95;
  letter-spacing: -0.02em;
  font-family: var(--display-font);
  font-size: 2.75rem;
  line-height: 1.15;
  letter-spacing: -0.06rem;
  font-size: clamp(3rem, 5.5vw, 5rem) !important;
}
@media (min-width: 992px) {
  .recipe-hero__title {
    font-size: 3.5rem;
    line-height: 1.12;
    letter-spacing: -0.08rem;
  }
}
.recipe-hero__desc {
  margin: var(--spacing-2) 0 0;
  color: var(--primary-700);
  max-width: 44ch;
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 1.125rem;
  line-height: 1.55;
}
@media (min-width: 992px) {
  .recipe-hero__desc {
    font-size: 1.25rem;
    line-height: 1.55;
  }
}
.recipe-hero__image-wrap {
  display: flex;
  justify-content: center;
  align-items: stretch;
  width: 100%;
}
@media (min-width: 992px) {
  .recipe-hero__image-wrap {
    grid-area: image;
    justify-content: flex-end;
    align-self: stretch;
    height: 100%;
  }
}
.recipe-hero__image {
  display: block;
  width: 100%;
  height: auto;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center;
     object-position: center;
}
@media (min-width: 992px) {
  .recipe-hero__image {
    width: 100%;
    height: 100%;
    max-height: none;
  }
}

.green-300-background {
  background-color: var(--green-50);
}

.red-300-background {
  background-color: var(--red-50);
}

.purple-300-background {
  background-color: var(--purple-50);
}

.yellow-300-background {
  background-color: var(--yellow-50);
}

.recipe-hero-image {
  width: 100%;
  height: 18rem;
}
@media (min-width: 768px) {
  .recipe-hero-image {
    -o-object-fit: contain;
       object-fit: contain;
    height: 24rem;
  }
}
@media (min-width: 992px) {
  .recipe-hero-image {
    height: 30rem;
    width: 75%;
    -o-object-fit: cover;
       object-fit: cover;
  }
}

.recipes-index-tiles {
  display: flex;
  width: -moz-fit-content;
  width: fit-content;
  text-align: left;
}
@media (min-width: 992px) {
  .recipes-index-tiles {
    flex-direction: column;
    text-align: center;
    align-items: flex-start;
  }
}
.recipes-index-tiles img {
  width: 6.25rem;
  margin: unset;
  -o-object-fit: contain;
     object-fit: contain;
}
@media (min-width: 992px) {
  .recipes-index-tiles img {
    margin: auto;
  }
}

.recipe-ingredients-container {
  align-items: start;
  justify-content: center;
}
@media (min-width: 992px) {
  .recipe-ingredients-container {
    justify-content: flex-end;
  }
}
.recipe-ingredients-container > .mini-card {
  width: 8rem;
  display: flex;
  flex-direction: column;
  text-align: center;
}
.recipe-ingredients-container > .mini-card img {
  width: 100%;
}

.recipe-nutritional-info-table {
  margin-top: 0;
}

.treats-ingredients-container {
  align-items: start;
  justify-content: center;
}
@media (min-width: 992px) {
  .treats-ingredients-container {
    justify-content: flex-end;
  }
}
.treats-ingredients-container > .mini-card {
  width: 16rem;
  display: flex;
  flex-direction: column;
  text-align: center;
}
.treats-ingredients-container > .mini-card img {
  width: 100%;
}

.ingredients-image-container {
  margin: 0;
  aspect-ratio: 1/1;
  border-radius: 50%;
  width: 8rem;
  padding: 0;
}
.ingredients-image-container img {
  -o-object-fit: cover;
     object-fit: cover;
}

@media (min-width: 992px) {
  .nutritional-information-container {
    gap: var(--spacing-9);
  }
}

.desktop-button {
  display: none;
}
@media (min-width: 992px) {
  .desktop-button {
    display: block;
  }
}

.recipe-nutrition {
  padding-block: var(--spacing-7);
}
@media (min-width: 992px) {
  .recipe-nutrition {
    padding-block: var(--spacing-8);
  }
}
.recipe-nutrition__inner {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-4);
  text-align: left;
}
@media (min-width: 992px) {
  .recipe-nutrition__inner {
    flex-direction: row;
    align-items: flex-start;
    gap: var(--spacing-6);
  }
}
.recipe-nutrition__copy {
  flex-shrink: 0;
}
@media (min-width: 992px) {
  .recipe-nutrition__copy {
    width: 36%;
    position: sticky;
    top: 2rem;
  }
}
.recipe-nutrition__eyebrow {
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.875rem;
  line-height: 1.6;
  font-weight: 700;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--primary-800);
  margin-bottom: var(--spacing-3);
}
@media (min-width: 992px) {
  .recipe-nutrition__eyebrow {
    font-size: 0.9375rem;
    line-height: 1.6;
  }
}
.recipe-nutrition__title {
  font-family: var(--display-font);
  font-size: 2rem;
  line-height: 1.18;
  letter-spacing: -0.05rem;
  font-weight: 400;
  color: var(--primary-800);
  margin-bottom: var(--spacing-3);
}
@media (min-width: 992px) {
  .recipe-nutrition__title {
    font-size: 2.5rem;
    line-height: 1.15;
    letter-spacing: -0.06rem;
  }
}
.recipe-nutrition__sub {
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.9375rem;
  line-height: 1.6;
  color: var(--primary-500);
}
@media (min-width: 992px) {
  .recipe-nutrition__sub {
    font-size: 1rem;
    line-height: 1.6;
  }
}
.recipe-nutrition__accordions {
  flex: 1;
  min-width: 0;
}

.recipe-trustpilot {
  padding-block: var(--spacing-7);
}
@media (min-width: 992px) {
  .recipe-trustpilot {
    padding-block: var(--spacing-8);
  }
}
.recipe-trustpilot__inner {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-2);
}
@media (min-width: 992px) {
  .recipe-trustpilot__inner {
    gap: var(--spacing-5);
  }
}
.recipe-trustpilot__copy {
  text-align: left;
}
.recipe-trustpilot__eyebrow {
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.875rem;
  line-height: 1.6;
  font-weight: 700;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--primary-800);
  margin-bottom: var(--spacing-3);
}
@media (min-width: 992px) {
  .recipe-trustpilot__eyebrow {
    font-size: 0.9375rem;
    line-height: 1.6;
  }
}
.recipe-trustpilot__title {
  font-family: var(--display-font);
  font-size: 2rem;
  line-height: 1.18;
  letter-spacing: -0.05rem;
  font-weight: 400;
  color: var(--primary-800);
}
@media (min-width: 992px) {
  .recipe-trustpilot__title {
    font-size: 2.5rem;
    line-height: 1.15;
    letter-spacing: -0.06rem;
  }
}
.recipe-trustpilot .trustpilot-widget {
  margin-top: var(--spacing-1);
}
@media (min-width: 992px) {
  .recipe-trustpilot .trustpilot-widget {
    margin-top: var(--spacing-4);
  }
}

.mobile-button {
  display: block;
}
@media (min-width: 992px) {
  .mobile-button {
    display: none;
  }
}

.calculator-section-bg-image {
  background-image: url(//www.tuggs.uk/assets/marketing/dogs-hanging-out-2afede4e0d00728f867ab41da7b6b37a2e2d91c5b5a2410b0a9bd31d672ece67.png);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
}

.extras-card.container {
  display: flex;
  flex-direction: column;
  text-align: left;
  background-color: white;
  border-radius: 0.5rem;
  overflow-x: hidden;
  padding: 0;
}
.extras-card.container .remove-link {
  text-align: end;
}
.extras-card.container .remove-link > a {
  color: var(--primary-500);
  font-size: 1rem;
}
@media (min-width: 768px) {
  .extras-card.container {
    flex-direction: row;
    align-items: center;
  }
}

.extras-card.image-container {
  padding: 0;
}
.extras-card.image-container img {
  aspect-ratio: 2/1.5;
}
@media (min-width: 992px) {
  .extras-card.image-container img {
    aspect-ratio: 1.45/2;
    width: 18rem;
    height: 100%;
  }
}

.extras-card.details-container {
  width: 100%;
  display: flex;
  flex-direction: column;
  padding: var(--spacing-2);
}
@media (min-width: 992px) {
  .extras-card.details-container {
    padding: var(--spacing-3);
  }
}
.extras-card.details-container > .details {
  display: flex;
  flex-direction: column;
}
@media (min-width: 992px) {
  .extras-card.details-container > .details {
    flex-direction: row;
    justify-content: space-between;
    align-items: baseline;
  }
}

.extras-card.form-container, .extras-show-card.form-container {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--spacing-4);
}
@media (min-width: 1200px) {
  .extras-card.form-container, .extras-show-card.form-container {
    flex-direction: row;
  }
}

.extras-card.form-details, .extras-show-card.form-details {
  background-color: var(--secondary-200);
  border-radius: 0.5rem;
  text-align: center;
  height: -moz-fit-content;
  height: fit-content;
}
.extras-card.form-details.in-plan, .extras-show-card.form-details.in-plan {
  padding: var(--spacing-1) var(--spacing-2);
}
@media (min-width: 992px) {
  .extras-card.form-details.in-plan, .extras-show-card.form-details.in-plan {
    width: -moz-fit-content;
    width: fit-content;
  }
}
.extras-card.form-details > .price-and-cta, .extras-show-card.form-details > .price-and-cta {
  display: flex;
  align-content: center;
  justify-content: space-around;
  background-color: var(--secondary-200);
  border-radius: 0.5rem;
}
.extras-card.form-details > .price-and-cta a, .extras-show-card.form-details > .price-and-cta a {
  height: -moz-fit-content;
  height: fit-content;
}

.extras-show-card.image-container img {
  border-radius: 0.5rem;
}
@media (min-width: 992px) {
  .extras-show-card.image-container img {
    width: 40rem;
    height: 25rem;
  }
}

.extras-show-card.details-container {
  display: flex;
  gap: var(--spacing-2);
}
.extras-show-card.details-container > .quantity-stepper {
  margin-inline: 0;
}

.extras-show-card.extra-info-container details {
  width: 100%;
}

header.shop-header input[type=checkbox] {
  display: none;
}
header.shop-header .shop-header__bar {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
}
header.shop-header .shop-header__bar {
  padding: var(--spacing-2);
}
@media (min-width: 992px) {
  header.shop-header .shop-header__bar {
    padding: var(--spacing-3);
  }
}
header.shop-header .shop-header__wordmark {
  justify-self: center;
}
header.shop-header .shop-header__wordmark img {
  width: 10ch;
  display: block;
}
header.shop-header .shop-header__cart {
  justify-self: end;
}
header.shop-header .shop-header__cart .cart-quantity-count {
  top: -0.3rem;
  right: -0.3rem;
  transform: none;
}
header.shop-header .shop-header__icon-btn {
  display: flex;
  align-items: center;
  cursor: pointer;
  color: white;
  position: relative;
}
header.shop-header .shop-header__icon-btn img {
  width: var(--spacing-5);
  height: var(--spacing-5);
}
header.shop-header .shop-header__left {
  display: flex;
  align-items: center;
  gap: var(--spacing-3);
  justify-self: start;
}
header.shop-header .shop-header__burger-btn img {
  width: auto;
  height: var(--spacing-4);
}
header.shop-header .shop-header__desktop-links {
  display: none;
}
@media (min-width: 992px) {
  header.shop-header .shop-header__desktop-links {
    display: flex;
    align-items: center;
    gap: var(--spacing-3);
    margin-left: var(--spacing-3);
  }
}
header.shop-header .shop-burger-panel {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 2147483002;
  display: flex;
  flex-direction: column;
  opacity: 0;
  pointer-events: none;
  transform: translateX(-100%);
  transition: transform 0.5s ease, opacity 0.5s ease;
}
@media (min-width: 992px) {
  header.shop-header .shop-burger-panel {
    right: auto;
    width: 30%;
    box-shadow: var(--shadow);
  }
}
header.shop-header #shopBurgerToggle:checked ~ .shop-burger-panel {
  opacity: 1;
  pointer-events: auto;
  transform: translateX(0);
}
header.shop-header .shop-burger-panel__header {
  background-color: var(--navy-800);
  flex-shrink: 0;
  padding-bottom: var(--spacing-4);
}
header.shop-header .shop-burger-panel__header-bar {
  display: flex;
  align-items: center;
  justify-content: flex-end;
}
header.shop-header .shop-burger-panel__header-bar {
  padding: var(--spacing-2);
}
@media (min-width: 992px) {
  header.shop-header .shop-burger-panel__header-bar {
    padding: var(--spacing-3);
  }
}
header.shop-header .shop-burger-panel__intro {
  padding: 0 var(--spacing-4) var(--spacing-3);
  text-align: left;
}
header.shop-header .shop-burger-panel__eyebrow {
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.875rem;
  line-height: 1.6;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--navy-300);
  margin-bottom: var(--spacing-2);
}
@media (min-width: 992px) {
  header.shop-header .shop-burger-panel__eyebrow {
    font-size: 0.9375rem;
    line-height: 1.6;
  }
}
header.shop-header .shop-burger-panel__heading {
  font-family: var(--display-font);
  font-size: 1.5rem;
  line-height: 1.2;
  letter-spacing: -0.03rem;
  color: white;
}
@media (min-width: 992px) {
  header.shop-header .shop-burger-panel__heading {
    font-size: 2rem;
    line-height: 1.18;
    letter-spacing: -0.04rem;
  }
}
header.shop-header .shop-burger-panel__nav {
  flex: 1;
  overflow-y: auto;
  background-color: white;
}
header.shop-header .shop-burger-panel__nav ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
header.shop-header .shop-burger-panel__link {
  display: flex;
  align-items: center;
  gap: var(--spacing-3);
  padding: var(--spacing-3) var(--spacing-4);
  text-decoration: none;
  color: var(--primary-800);
  text-align: left;
  border-bottom: 1px solid var(--tan-100);
  transition: background-color 0.15s ease;
}
header.shop-header .shop-burger-panel__link:hover {
  background-color: var(--tan-50);
}
header.shop-header .shop-burger-panel__icon {
  width: var(--spacing-7);
  height: var(--spacing-7);
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: var(--spacing-2);
  background-color: var(--tan-50);
  font-size: 1.5rem;
  flex-shrink: 0;
}
header.shop-header .shop-burger-panel__link-text {
  flex: 1;
  display: flex;
  flex-direction: column;
}
header.shop-header .shop-burger-panel__link-text strong {
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 1rem;
  line-height: 1.6;
  font-weight: 600;
  color: var(--primary-800);
}
@media (min-width: 992px) {
  header.shop-header .shop-burger-panel__link-text strong {
    font-size: 1.125rem;
    line-height: 1.6;
  }
}
header.shop-header .shop-burger-panel__link-text span {
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.875rem;
  line-height: 1.6;
  color: var(--primary-400);
}
@media (min-width: 992px) {
  header.shop-header .shop-burger-panel__link-text span {
    font-size: 0.9375rem;
    line-height: 1.6;
  }
}
header.shop-header .shop-burger-panel__chevron {
  color: var(--primary-300);
  font-size: 1.25rem;
}
header.shop-header .shop-burger-panel__footer {
  background-color: var(--tan-50);
  border-top: 1px solid var(--tan-100);
  padding: var(--spacing-4);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--spacing-3);
  flex-shrink: 0;
}
header.shop-header .shop-burger-panel__footer-text {
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.9375rem;
  line-height: 1.6;
  color: var(--primary-400);
  text-align: center;
}
@media (min-width: 992px) {
  header.shop-header .shop-burger-panel__footer-text {
    font-size: 1rem;
    line-height: 1.6;
  }
}
header.shop-header .shop-burger-panel__ctas {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--spacing-3);
  padding: var(--spacing-4);
  background-color: white;
  border-top: 1px solid var(--tan-100);
  flex-shrink: 0;
}
header.shop-header .shop-burger-panel__ctas .btn {
  width: 100%;
  text-align: center;
}
header.shop-header nav.cart-nav {
  position: fixed;
  width: 75%;
  right: 0;
  top: 0;
  z-index: 2147483002;
  height: 100vh;
  height: 100svh;
  box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.1);
  opacity: 0;
  transform: translateX(100%);
  transition: transform 0.5s ease, opacity 0.5s ease;
}
header.shop-header nav.cart-nav {
  padding: var(--spacing-3);
}
@media (min-width: 992px) {
  header.shop-header nav.cart-nav {
    padding: var(--spacing-4);
  }
}
@media (min-width: 992px) {
  header.shop-header nav.cart-nav {
    width: 30%;
  }
}
header.shop-header #headerMenuToggle:checked ~ nav.cart-nav {
  transform: translateX(0);
  opacity: 1;
}
header.shop-header #headerMenuToggle:checked ~ #overlay,
header.shop-header #shopBurgerToggle:checked ~ #overlay {
  display: block;
}

header.shop-header .cart-nav {
  background-color: var(--navy-900);
}
.cart-nav turbo-frame {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.cart-nav .nav-links {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
}

.perks-bar {
  display: flex;
  justify-content: center;
  gap: 2rem;
  width: min(80%, 1200px);
  margin-inline: auto;
}
.perks-bar p {
  white-space: nowrap;
}
@media (max-width: 767px) {
  .perks-bar {
    width: 100%;
    overflow-x: scroll;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
    padding-inline: 1.5rem;
    padding-top: 1rem;
    gap: 0;
  }
  .perks-bar::-webkit-scrollbar {
    display: none;
  }
  .perks-bar p {
    flex-shrink: 0;
    width: 100%;
    scroll-snap-align: center;
    text-align: center;
    white-space: normal;
  }
}

.numbered-feature-list {
  list-style: none;
  padding: 0;
  margin: 0;
  counter-reset: feature-counter;
}
.numbered-feature-list li {
  counter-increment: feature-counter;
  display: grid;
  grid-template-columns: 3rem 1fr;
  gap: 1rem;
  padding-block: 1.5rem;
}
.numbered-feature-list li + li {
  border-top: 1px solid var(--navy-200);
}
.numbered-feature-list li::before {
  content: counter(feature-counter, decimal-leading-zero);
  color: var(--navy-500);
  font-weight: 700;
  font-size: 1rem;
  padding-top: 0.2rem;
}
.numbered-feature-list li strong {
  display: block;
  margin-bottom: 0.4rem;
  grid-column: 2;
}
.numbered-feature-list li p {
  margin: 0;
  grid-column: 2;
}

@media (max-width: 767px) {
  .shop-home-carousel.carousel-grid-1-4 {
    grid-auto-columns: 85%;
  }
}
@media (min-width: 992px) {
  #chews-and-accessories .carousel-grid-1-4 {
    grid-auto-columns: 30%;
  }
}

.banner-confirmation {
  text-align: center;
}
.banner-confirmation {
  padding-block: var(--spacing-1);
}
@media (min-width: 992px) {
  .banner-confirmation {
    padding-block: var(--spacing-2);
  }
}

.banner-carousel {
  position: relative;
  height: calc(1.4rem + 2 * var(--spacing-1));
}
@media (min-width: 992px) {
  .banner-carousel {
    height: calc(1.4rem + 2 * var(--spacing-2));
  }
}
.banner-carousel .banner-carousel__item {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  transition: opacity 0.5s ease;
  pointer-events: none;
}
.banner-carousel .banner-carousel__item.active {
  opacity: 1;
  pointer-events: auto;
}

.product-gallery {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-2);
  min-width: 0;
  max-width: 100%;
}

.main-image-container {
  width: 100%;
  border-radius: var(--spacing-25);
  background-color: var(--tan-100);
  overflow: hidden;
  aspect-ratio: 1/1;
  display: flex;
  align-items: center;
  justify-content: center;
}

.main-image {
  width: 100%;
  height: 100%;
  -o-object-fit: contain;
     object-fit: contain;
}

.thumbnails {
  display: flex;
  flex-direction: row;
  gap: 0.5rem;
  flex-wrap: nowrap;
  overflow-x: hidden;
  width: 100%;
}

.thumbnail {
  cursor: pointer;
  border: 2px solid transparent;
  border-radius: 0.5rem;
  transition: border-color 0.2s;
  -o-object-fit: cover;
     object-fit: cover;
  background-color: var(--tan-100);
  flex: 1 1 0;
  min-width: 0;
  aspect-ratio: 1/1;
}
.thumbnail:hover {
  border-color: var(--primary-300);
}
.thumbnail.active {
  border-color: var(--green-700);
}

/* app/assets/stylesheets/shop/modal.css */
.modal-container {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 9999;
  /* Hidden by default */
  align-items: center;
  justify-content: center;
}

/* When modal is active, show it */
.modal-container.active {
  display: flex;
}

.modal-backdrop {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.6);
}

.modal-content {
  position: relative;
  background: white;
  border-radius: 8px;
  max-width: 1000px;
  width: 90%;
  max-height: 90vh;
  overflow-y: auto;
  padding: 2rem;
  z-index: 1; /* Above backdrop */
  box-shadow: 0 10px 40px rgba(0, 0, 0, 0.3);
}

/* Optional: smooth animations */
.modal-container.active .modal-backdrop {
  animation: fadeIn 0.2s;
}

.modal-container.active .modal-content {
  animation: slideUp 0.3s;
}

@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes slideUp {
  from {
    opacity: 0;
    transform: translateY(20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
.cart-quantity-count {
  position: absolute;
  width: 17px;
  height: 17px;
  top: 0;
  right: 0;
  background-color: var(--green);
  border-radius: 100px;
  text-align: center;
  transform: translate(-30%, 30%);
  font-size: 0.7rem;
}
@media (min-width: 992px) {
  .cart-quantity-count {
    font-size: 0.8rem;
    width: 20px;
    height: 20px;
    transform: translate(-50%, 50%);
  }
}

.checkout-order-summary summary {
  cursor: pointer;
  list-style: none;
}
.checkout-order-summary summary::-webkit-details-marker {
  display: none;
}
.checkout-order-summary[open] .checkout-order-summary__chevron {
  transform: rotate(180deg);
}
.checkout-order-summary .checkout-order-summary__chevron {
  transition: transform 0.2s ease;
  flex-shrink: 0;
}
@media (min-width: 992px) {
  .checkout-order-summary summary {
    cursor: default;
    pointer-events: none;
  }
  .checkout-order-summary .checkout-order-summary__chevron {
    display: none;
  }
}

.cart-toast {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 2147483004;
  border-radius: 0 0 var(--spacing-2) var(--spacing-2);
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.18);
  overflow: hidden;
  animation: cart-toast-slide-down 0.35s cubic-bezier(0.34, 1.56, 0.64, 1);
}
@media (min-width: 992px) {
  .cart-toast {
    top: 1rem;
    right: 1rem;
    left: auto;
    width: 400px;
    border-radius: var(--spacing-2);
    animation: cart-toast-slide-in 0.35s cubic-bezier(0.34, 1.56, 0.64, 1);
  }
}
.cart-toast--hiding {
  animation: cart-toast-slide-up 0.25s ease-in forwards;
}
@media (min-width: 992px) {
  .cart-toast--hiding {
    animation: cart-toast-slide-out 0.25s ease-in forwards;
  }
}
.cart-toast__header {
  display: flex;
  align-items: center;
  gap: var(--spacing-2);
  padding: var(--spacing-2) var(--spacing-3);
  background-color: var(--navy-900);
}
.cart-toast__check {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  border-radius: 100px;
  background-color: var(--green-300);
  flex-shrink: 0;
}
.cart-toast__check .material-symbols-outlined {
  font-size: 14px;
  color: var(--white);
  font-variation-settings: "wght" 600;
}
.cart-toast__close {
  margin-left: auto;
  display: flex;
  align-items: center;
  justify-content: center;
  background: none;
  border: none;
  cursor: pointer;
  padding: var(--spacing-1);
  border-radius: var(--spacing-1);
  opacity: 0.8;
}
.cart-toast__close:hover {
  opacity: 1;
}
.cart-toast__body {
  background-color: var(--white);
  padding: var(--spacing-3);
  border-bottom: 1px solid var(--navy-100);
}
.cart-toast__product-row {
  display: flex;
  gap: var(--spacing-3);
  align-items: center;
}
.cart-toast__image {
  width: 64px;
  height: 64px;
  border-radius: var(--spacing-1);
  -o-object-fit: cover;
     object-fit: cover;
  flex-shrink: 0;
}
@media (min-width: 992px) {
  .cart-toast__image {
    width: 72px;
    height: 72px;
  }
}
.cart-toast__image--placeholder {
  background-color: var(--tan-200);
  display: flex;
  align-items: center;
  justify-content: center;
}
.cart-toast__product-info {
  flex: 1;
  min-width: 0;
}
.cart-toast__name {
  text-align: left;
  margin-bottom: var(--spacing-1);
}
.cart-toast__price {
  display: flex;
  align-items: center;
  gap: var(--spacing-2);
  flex-wrap: wrap;
}
.cart-toast__discount-badge {
  background-color: var(--yellow-100);
  color: var(--yellow-900);
  font-size: 0.75rem;
  padding: 2px var(--spacing-1);
  border-radius: var(--spacing-1);
  font-weight: 600;
}
.cart-toast__nudge {
  display: flex;
  align-items: center;
  gap: var(--spacing-3);
  margin-top: var(--spacing-3);
}
.cart-toast__nudge-copy {
  flex-shrink: 0;
  color: var(--navy-600);
  white-space: nowrap;
}
.cart-toast__nudge-track {
  flex: 1;
  background-color: var(--green-50);
  height: 6px;
  border-radius: 100px;
  overflow: hidden;
}
.cart-toast__nudge-fill {
  background-color: var(--green-300);
  height: 100%;
  border-radius: 100px;
  transition: width 0.4s ease;
}
.cart-toast__ctas {
  display: flex;
  gap: var(--spacing-2);
  padding: var(--spacing-3);
  background-color: var(--white);
}
.cart-toast__cta {
  flex: 1;
}
.cart-toast__drain-bar {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 3px;
  background-color: var(--green-300);
  transform-origin: left;
}
.cart-toast__drain-bar.draining {
  animation: drain var(--duration, 4000ms) linear forwards;
}

@keyframes cart-toast-slide-down {
  from {
    opacity: 0;
    transform: translateY(-100%);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
@keyframes cart-toast-slide-up {
  to {
    opacity: 0;
    transform: translateY(-100%);
  }
}
@keyframes cart-toast-slide-in {
  from {
    opacity: 0;
    transform: translateX(120%);
  }
  to {
    opacity: 1;
    transform: translateX(0);
  }
}
@keyframes cart-toast-slide-out {
  to {
    opacity: 0;
    transform: translateX(120%);
  }
}
@keyframes drain {
  from {
    transform: scaleX(1);
  }
  to {
    transform: scaleX(0);
  }
}
.shop-feature-product-card:hover {
  box-shadow: 0 12px 24px rgba(0, 0, 0, 0.15);
}
.shop-feature-product-card .bottom-nav {
  padding-inline: var(--spacing-5);
  padding-bottom: var(--spacing-5);
}
.shop-feature-product-card [data-element=feature-bullets] li {
  margin-bottom: var(--spacing-2);
}
.shop-feature-product-card__price {
  margin-top: var(--spacing-3);
  padding-top: var(--spacing-3);
  border-top: 1px solid rgba(255, 255, 255, 0.1);
}
.shop-feature-product-card__pills {
  display: flex;
  flex-wrap: nowrap;
  gap: var(--spacing-2);
  overflow-x: auto;
}
.shop-feature-product-card__image-wrap {
  aspect-ratio: 6/5;
  overflow: hidden;
  background-color: white;
}
.shop-feature-product-card__image {
  width: 100%;
  height: 100%;
  -o-object-fit: contain;
     object-fit: contain;
  -o-object-position: center bottom;
     object-position: center bottom;
  display: block;
}

.shop-product-card {
  height: 100%;
  display: flex;
  flex-direction: column;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.shop-product-card__price {
  margin-top: var(--spacing-3);
  padding-top: var(--spacing-3);
  border-top: 1px solid var(--tan-300);
}
.shop-product-card .bottom-nav {
  margin-top: auto;
  padding-inline: var(--spacing-5);
  padding-bottom: var(--spacing-5);
}
.shop-product-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 12px 24px rgba(0, 0, 0, 0.03);
}

.quantity-stepper.shop {
  overflow: hidden;
}
.quantity-stepper.shop button {
  padding-inline: var(--spacing-3);
  padding-block: var(--spacing-2);
  border-radius: 0rem;
}
.quantity-stepper.shop .stepper-display {
  padding-inline: var(--spacing-4);
  padding-block: var(--spacing-2);
}
.quantity-stepper.shop.mini button {
  padding-inline: var(--spacing-2);
  padding-block: var(--spacing-1);
}
.quantity-stepper.shop.mini .stepper-display {
  padding-inline: var(--spacing-3);
  padding-block: var(--spacing-1);
}

.free-progress {
  margin-top: var(--spacing-2);
  margin-inline: var(--spacing-2);
}

.free-progress__track-wrap {
  position: relative;
  height: var(--spacing-25);
  width: 80%;
  margin-inline: auto;
  margin-bottom: var(--spacing-6);
}
.free-progress__track-wrap--no-labels {
  margin-bottom: var(--spacing-2);
}

.free-progress__track {
  position: absolute;
  inset: 0;
  border-radius: 999px;
  background: var(--navy-700);
  width: 100%;
}

.free-progress__fill {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  border-radius: 999px;
  background-color: var(--green-300);
  transition: width 0.6s cubic-bezier(0.34, 1.56, 0.64, 1);
  box-shadow: 0 0 8px color-mix(in srgb, var(--green-300) 40%, transparent);
}

.free-progress__fill--yellow {
  background-color: var(--yellow);
  box-shadow: 0 0 8px color-mix(in srgb, var(--yellow) 50%, transparent);
}

.free-progress__milestone {
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.35rem;
}

.free-progress__milestone-dot {
  width: 2rem;
  height: 2rem;
  border-radius: 50%;
  background: var(--navy-700);
  border: 2px solid var(--navy-600);
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.3s ease;
  position: relative;
  z-index: 2;
}
@media (min-width: 992px) {
  .free-progress__milestone-dot {
    width: 2.5rem;
    height: 2.5rem;
  }
}

.free-progress__milestone-emoji {
  line-height: 1;
  width: 1rem;
  height: 1rem;
}
@media (min-width: 992px) {
  .free-progress__milestone-emoji {
    width: 1.5rem;
    height: 1.5rem;
  }
}

.free-progress__milestone--unlocked .free-progress__milestone-dot {
  background: var(--green-300);
  border-color: var(--green-400);
  animation: milestone-pop 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.free-progress__milestone--next .free-progress__milestone-dot {
  background: var(--tan-50);
  border-color: var(--green-300);
  border-width: 2px;
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--green-300) 30%, transparent);
}
@media (min-width: 992px) {
  .free-progress__milestone--next .free-progress__milestone-dot {
    width: 2.75rem;
    height: 2.75rem;
  }
}

.free-progress__milestone--future .free-progress__milestone-dot {
  width: 1.75rem;
  height: 1.75rem;
  opacity: 0.5;
}
@media (min-width: 992px) {
  .free-progress__milestone--future .free-progress__milestone-dot {
    width: 2rem;
    height: 2rem;
  }
}

.free-progress__milestone--future .free-progress__milestone-emoji {
  opacity: 0.6;
}

.free-progress__milestone--yellow.free-progress__milestone--unlocked .free-progress__milestone-dot {
  background: var(--yellow);
  border-color: var(--yellow-600);
}
.free-progress__milestone--yellow.free-progress__milestone--unlocked .free-progress__unlock-burst {
  background: var(--yellow-600);
}

.free-progress__milestone-label {
  display: block;
  position: absolute;
  white-space: nowrap;
  top: 2.5rem;
  text-align: center;
  font-size: 0.65rem;
  line-height: 1.3;
  transition: color 0.3s ease;
}
@media (min-width: 992px) {
  .free-progress__milestone-label {
    top: 2.875rem;
  }
}

.free-progress__milestone:last-child .free-progress__milestone-label {
  right: 0;
  left: auto;
  text-align: right;
}

.free-progress__unlock-burst {
  position: absolute;
  top: -0.4rem;
  right: -0.4rem;
  background: var(--green-500);
  color: white;
  border-radius: 50%;
  width: 0.85rem;
  height: 0.85rem;
  font-size: 0.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 3;
  animation: burst-in 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.free-progress__next-copy {
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.9375rem;
  line-height: 1.6;
  color: var(--navy-300);
}
@media (min-width: 992px) {
  .free-progress__next-copy {
    font-size: 1rem;
    line-height: 1.6;
  }
}
.free-progress__next-copy strong {
  color: var(--white);
  font-weight: 600;
}
.free-progress__next-copy span {
  color: var(--green-300);
}
.free-progress__next-copy--complete {
  color: var(--green-300);
}

@keyframes milestone-pop {
  0% {
    transform: scale(0.7);
  }
  60% {
    transform: scale(1.2);
  }
  100% {
    transform: scale(1);
  }
}
@keyframes burst-in {
  0% {
    transform: scale(0);
    opacity: 0;
  }
  100% {
    transform: scale(1);
    opacity: 1;
  }
}
[data-layout=product-show] .grid > * {
  min-width: 0;
}

[data-layout=product-show] .grid > :first-child {
  padding-bottom: var(--spacing-2);
}
@media (min-width: 992px) {
  [data-layout=product-show] .grid > :first-child {
    padding-bottom: var(--spacing-4);
  }
}

[data-layout=product-show] .trustpilot-widget {
  margin-top: var(--spacing-3);
}
@media (min-width: 992px) {
  [data-layout=product-show] .trustpilot-widget {
    margin-top: 0;
  }
}

.category-pill {
  display: inline-flex;
  align-items: center;
  padding: 0.2rem 0.65rem;
  border-radius: 999px;
  font-family: var(--body-font);
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  border: 1.5px solid transparent;
}
.category-pill--supplement, .category-pill--treat, .category-pill--chew, .category-pill--accessories, .category-pill--topper {
  background-color: var(--secondary-50);
  color: var(--secondary-700);
  border-color: var(--secondary-200);
}

[data-section=hero] {
  text-align: left;
}
[data-section=hero] h1 {
  margin-top: var(--spacing-1);
  font-family: var(--display-font);
  font-weight: 600;
  color: var(--primary-800);
  font-size: 1.5rem;
  line-height: 1.22;
}
@media (min-width: 992px) {
  [data-section=hero] h1 {
    font-size: 2rem;
    line-height: 1.2;
  }
}
@media (min-width: 992px) {
  [data-section=hero] h1 {
    font-family: var(--display-font);
    font-weight: 600;
    color: var(--primary-800);
    font-size: 2.75rem;
    line-height: 1.2;
  }
}
@media (min-width: 992px) and (min-width: 992px) {
  [data-section=hero] h1 {
    font-size: 3.5rem;
    line-height: 1.15;
  }
}
[data-section=hero] [data-element=product-weight] {
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 1rem;
  line-height: 1.6;
  color: var(--primary-500);
  white-space: nowrap;
}
@media (min-width: 992px) {
  [data-section=hero] [data-element=product-weight] {
    font-size: 1.125rem;
    line-height: 1.6;
  }
}
@media (min-width: 992px) {
  [data-section=hero] [data-element=product-weight] {
    font-family: var(--body-font);
    font-weight: 300;
    font-size: 1.125rem;
    line-height: 1.55;
  }
}
@media (min-width: 992px) and (min-width: 992px) {
  [data-section=hero] [data-element=product-weight] {
    font-size: 1.25rem;
    line-height: 1.55;
  }
}
[data-section=hero] [data-element=subtitle] {
  font-style: italic;
  color: var(--primary-500);
  margin-top: var(--spacing-1);
}
@media (min-width: 992px) {
  [data-section=hero] [data-element=subtitle] {
    margin-top: var(--spacing-2);
  }
}

[data-section=description] [data-element=description-label] {
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--green-700);
}
[data-section=description] [data-element=description-body] {
  padding-left: 0;
  padding-right: 0;
}
[data-section=description] [data-element=description-body] p {
  color: var(--primary-600);
  line-height: 1.7;
}

[data-element=feature-bullets] {
  list-style: none;
  text-align: left;
  margin-top: var(--spacing-2);
}
[data-element=feature-bullets].paragraph-3 li {
  font-size: var(--text-6);
}
[data-element=feature-bullets] li {
  position: relative;
  padding-left: 2rem;
  margin-bottom: var(--spacing-1);
}
[data-element=feature-bullets] li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.1rem;
  width: 1.4rem;
  height: 1.4rem;
  border-radius: 50%;
  background-color: var(--tan-50);
}
[data-element=feature-bullets] li::after {
  content: "";
  position: absolute;
  left: 0.2rem;
  top: 0.4rem;
  width: 1rem;
  height: 0.75rem;
  background-color: var(--green-700);
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 11' fill='none'%3E%3Cpath d='M1.5 5.8C2.3 7.3 3.8 9 5.3 10.5C8.1 7.4 10.5 4.5 12.5 1.5' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  mask-repeat: no-repeat;
  mask-size: contain;
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 11' fill='none'%3E%3Cpath d='M1.5 5.8C2.3 7.3 3.8 9 5.3 10.5C8.1 7.4 10.5 4.5 12.5 1.5' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-size: contain;
}

.feature-pill--navy {
  border-color: var(--navy-600);
  background: var(--navy-700);
  color: white;
}

.feature-pill {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0.35rem var(--spacing-25);
  border-radius: 999px;
  border: 1.5px solid var(--tan-400);
  background: var(--tan-50);
  font-family: var(--body-font);
  font-size: 0.75rem;
  font-weight: 700;
  color: var(--navy-600);
  white-space: nowrap;
}
@media (min-width: 992px) {
  .feature-pill {
    font-size: 0.875rem;
  }
}
.feature-pill::before {
  content: "";
  display: inline-block;
  width: 0.85em;
  height: 0.7em;
  vertical-align: middle;
  background-color: var(--green-700);
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 11' fill='none'%3E%3Cpath d='M1.5 5.8C2.3 7.3 3.8 9 5.3 10.5C8.1 7.4 10.5 4.5 12.5 1.5' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  mask-repeat: no-repeat;
  mask-size: contain;
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 11' fill='none'%3E%3Cpath d='M1.5 5.8C2.3 7.3 3.8 9 5.3 10.5C8.1 7.4 10.5 4.5 12.5 1.5' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-size: contain;
}

[data-element=attribute-pills] {
  display: none;
}
@media (min-width: 992px) {
  [data-element=attribute-pills] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--spacing-2);
  }
}

[data-element=mobile-product-header] {
  display: block;
  margin-bottom: var(--spacing-3);
}
@media (min-width: 992px) {
  [data-element=mobile-product-header] {
    display: none;
  }
}

[data-element=desktop-product-header] {
  display: none;
}
@media (min-width: 992px) {
  [data-element=desktop-product-header] {
    display: block;
  }
}

[data-section=product-grid] .radio_buttons label {
  display: flex;
  align-items: center;
  gap: 0.375rem;
  background: var(--primary-800);
  color: white;
  font-size: 0.875rem;
  white-space: nowrap;
  outline: 1.5px solid var(--primary-800);
  cursor: pointer;
}
[data-section=product-grid] .radio_buttons label * {
  color: white;
}

[data-section=product-grid] .radio_buttons label:has(input:checked) {
  background: var(--primary-100);
  color: var(--primary-500);
  outline: 1.5px solid var(--primary-300);
}
[data-section=product-grid] .radio_buttons label:has(input:checked)::before {
  content: "";
  display: inline-block;
  width: 1rem;
  height: 1rem;
  border-radius: 50%;
  border: 1.5px solid var(--primary-400);
  background-color: white;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M2 6l3 3 5-5' stroke='%234a6fa5' stroke-width='1.5' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-size: 75%;
  background-repeat: no-repeat;
  background-position: center;
  flex-shrink: 0;
}
[data-section=product-grid] .radio_buttons label:has(input:checked) * {
  color: var(--primary-500);
}

.add-extra__price {
  font-size: 1.375rem;
  font-weight: 700;
  color: var(--primary-800);
  line-height: 1;
  text-align: left;
  padding-bottom: var(--spacing-4);
  border-bottom: 1.5px dashed var(--tan-400);
  margin-top: var(--spacing-4);
}
@media (min-width: 992px) {
  .add-extra__price {
    margin-top: var(--spacing-5);
  }
}

.add-extra__form-body {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-4);
  padding-top: var(--spacing-4);
  text-align: left;
}

.what-to-expect__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--spacing-4);
}
@media (min-width: 992px) {
  .what-to-expect__grid {
    grid-template-columns: 1fr 1fr;
    gap: var(--spacing-5);
    align-items: start;
  }
}
.what-to-expect__image-col {
  display: block;
  order: 2;
}
@media (min-width: 992px) {
  .what-to-expect__image-col {
    order: 0;
    position: sticky;
    top: 2rem;
  }
}
.what-to-expect__content-col {
  text-align: left;
  order: 1;
}
.what-to-expect__image {
  width: 100%;
  display: block;
  border-radius: 1rem;
  -o-object-fit: cover;
     object-fit: cover;
  aspect-ratio: 6/5;
}
.what-to-expect__eyebrow {
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--green-700);
  margin-bottom: var(--spacing-25);
}
.what-to-expect__title {
  font-weight: 800;
  color: var(--primary-800);
  margin-bottom: var(--spacing-25);
  font-family: var(--display-font);
  font-size: 1.5rem;
  line-height: 1.2;
  letter-spacing: -0.03rem;
}
@media (min-width: 992px) {
  .what-to-expect__title {
    font-size: 2rem;
    line-height: 1.18;
    letter-spacing: -0.04rem;
  }
}
.what-to-expect__subtitle {
  color: var(--primary-500);
  margin-bottom: var(--spacing-3);
  font-style: italic;
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.9375rem;
  line-height: 1.6;
}
@media (min-width: 992px) {
  .what-to-expect__subtitle {
    font-size: 1rem;
    line-height: 1.6;
  }
}
.what-to-expect__stages-wrapper {
  position: relative;
}
.what-to-expect__stages-scroll {
  height: 360px;
  overflow-y: scroll;
  scroll-snap-type: y mandatory;
  scrollbar-width: none;
}
.what-to-expect__stages-scroll::-webkit-scrollbar {
  display: none;
}
.what-to-expect__stage {
  height: 360px;
  flex-shrink: 0;
  scroll-snap-align: start;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 1.5rem;
  border-radius: 1rem;
  transition: background 0.3s ease, border-color 0.3s ease;
  background: var(--tan-50);
  border: 1.5px solid transparent;
}
.what-to-expect__stage + .what-to-expect__stage {
  margin-top: var(--spacing-25);
}
.what-to-expect__stage--active {
  background: white;
  border-color: var(--tan-500);
}
.what-to-expect__stage-header {
  display: flex;
  align-items: baseline;
  gap: 0.6rem;
  margin-bottom: var(--spacing-25);
}
.what-to-expect__tag {
  display: inline-block;
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  color: var(--green-700);
  background: var(--green-10);
  border: 1.5px solid var(--green-100);
  border-radius: 999px;
  padding: 0.15rem 0.6rem;
  white-space: nowrap;
}
.what-to-expect__tagline {
  font-style: italic;
  color: var(--primary-400);
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.875rem;
  line-height: 1.6;
}
@media (min-width: 992px) {
  .what-to-expect__tagline {
    font-size: 0.9375rem;
    line-height: 1.6;
  }
}
.what-to-expect__heading {
  font-weight: 700;
  color: var(--primary-800);
  margin-bottom: var(--spacing-25);
  font-family: var(--display-font);
  font-size: 1rem;
  line-height: 1.3;
  letter-spacing: 0;
}
@media (min-width: 992px) {
  .what-to-expect__heading {
    font-size: 1.25rem;
    line-height: 1.25;
    letter-spacing: -0.01rem;
  }
}
.what-to-expect__bullets {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}
.what-to-expect__bullets li {
  position: relative;
  padding-left: 2rem;
  color: var(--primary-600);
  text-align: left;
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.9375rem;
  line-height: 1.6;
}
@media (min-width: 992px) {
  .what-to-expect__bullets li {
    font-size: 1rem;
    line-height: 1.6;
  }
}
.what-to-expect__bullets li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.1rem;
  width: 1.4rem;
  height: 1.4rem;
  border-radius: 50%;
  background-color: var(--tan-50);
}
.what-to-expect__bullets li::after {
  content: "";
  position: absolute;
  left: 0.2rem;
  top: 0.4rem;
  width: 1rem;
  height: 0.75rem;
  background-color: var(--primary-800);
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 11' fill='none'%3E%3Cpath d='M1.5 5.8C2.3 7.3 3.8 9 5.3 10.5C8.1 7.4 10.5 4.5 12.5 1.5' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  mask-repeat: no-repeat;
  mask-size: contain;
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 11' fill='none'%3E%3Cpath d='M1.5 5.8C2.3 7.3 3.8 9 5.3 10.5C8.1 7.4 10.5 4.5 12.5 1.5' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-size: contain;
}
.what-to-expect__scroll-hint {
  display: block;
  margin: var(--spacing-25) auto 0;
  width: 2rem;
  height: 2rem;
  background: none;
  border: none;
  padding: 0;
  cursor: pointer;
  transition: opacity 0.3s ease;
  animation: wte-bounce 1.6s ease-in-out infinite;
}
.what-to-expect__scroll-hint::after {
  content: "";
  display: block;
  width: 0.6rem;
  height: 0.6rem;
  border-right: 2px solid var(--primary-400);
  border-bottom: 2px solid var(--primary-400);
  transform: rotate(45deg);
  margin: 0.55rem auto 0;
}
.what-to-expect__scroll-hint--hidden {
  opacity: 0;
  pointer-events: none;
}
@keyframes wte-bounce {
  0%, 100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(4px);
  }
}
.what-to-expect__dots {
  display: flex;
  justify-content: center;
  gap: 0.5rem;
  margin-top: var(--spacing-25);
}
.what-to-expect__dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--primary-300);
  border: none;
  padding: 0;
  cursor: pointer;
  transition: background 0.25s ease, transform 0.25s ease;
}
.what-to-expect__dot--active {
  background: var(--green-500);
  transform: scale(1.35);
}

.feeding-guide {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-4);
  text-align: left;
}
@media (min-width: 992px) {
  .feeding-guide {
    flex-direction: row;
    align-items: center;
    gap: var(--spacing-6);
  }
}
.feeding-guide__copy {
  flex: 1;
}
.feeding-guide__eyebrow {
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--green-300);
  margin-bottom: var(--spacing-25);
}
.feeding-guide__title {
  font-weight: 800;
  color: white;
  margin-bottom: 1rem;
  font-family: var(--display-font);
  font-size: 2rem;
  line-height: 1.18;
  letter-spacing: -0.05rem;
}
@media (min-width: 992px) {
  .feeding-guide__title {
    font-size: 2.5rem;
    line-height: 1.15;
    letter-spacing: -0.06rem;
  }
}
.feeding-guide__intro {
  color: rgba(255, 255, 255, 0.75);
  margin-bottom: 1rem;
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.9375rem;
  line-height: 1.6;
}
@media (min-width: 992px) {
  .feeding-guide__intro {
    font-size: 1rem;
    line-height: 1.6;
  }
}
.feeding-guide__highlight {
  font-weight: 700;
  color: var(--green-300);
  padding-top: var(--spacing-25);
  border-top: 1px solid rgba(255, 255, 255, 0.15);
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.9375rem;
  line-height: 1.6;
}
@media (min-width: 992px) {
  .feeding-guide__highlight {
    font-size: 1rem;
    line-height: 1.6;
  }
}
.feeding-guide__table-wrapper {
  flex-shrink: 0;
  width: 100%;
}
@media (min-width: 992px) {
  .feeding-guide__table-wrapper {
    width: 36%;
  }
}

.faqs__inner {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-4);
  text-align: left;
}
@media (min-width: 992px) {
  .faqs__inner {
    flex-direction: row;
    align-items: flex-start;
    gap: var(--spacing-6);
  }
}
.faqs__copy {
  flex-shrink: 0;
}
@media (min-width: 992px) {
  .faqs__copy {
    width: 36%;
    position: sticky;
    top: 2rem;
  }
}
.faqs__eyebrow {
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--green-700);
  margin-bottom: var(--spacing-25);
}
.faqs__title {
  font-weight: 800;
  color: var(--primary-800);
  margin-bottom: 1rem;
  font-family: var(--display-font);
  font-size: 2rem;
  line-height: 1.18;
  letter-spacing: -0.05rem;
}
@media (min-width: 992px) {
  .faqs__title {
    font-size: 2.5rem;
    line-height: 1.15;
    letter-spacing: -0.06rem;
  }
}
.faqs__contact {
  color: var(--primary-400);
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.9375rem;
  line-height: 1.6;
}
@media (min-width: 992px) {
  .faqs__contact {
    font-size: 1rem;
    line-height: 1.6;
  }
}
.faqs__email {
  font-weight: 700;
  color: var(--primary-800);
  text-decoration: none;
}
.faqs__email:hover {
  text-decoration: underline;
}
.faqs__accordions {
  flex: 1;
  min-width: 0;
}
.faqs__bullets {
  margin-top: var(--spacing-25);
  padding-left: 1.25rem;
  list-style: disc;
}
.faqs__bullets li {
  color: var(--primary-800);
  margin-bottom: 0.25rem;
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.9375rem;
  line-height: 1.6;
}
@media (min-width: 992px) {
  .faqs__bullets li {
    font-size: 1rem;
    line-height: 1.6;
  }
}

.how-to-use__eyebrow {
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--green-700);
  margin-bottom: var(--spacing-25);
  text-align: left;
  margin-bottom: var(--spacing-1);
}
.how-to-use__title {
  font-weight: 800;
  color: var(--primary-800);
  text-align: left;
  margin-bottom: var(--spacing-4);
  font-family: var(--display-font);
  font-size: 1.5rem;
  line-height: 1.2;
  letter-spacing: -0.03rem;
}
@media (min-width: 992px) {
  .how-to-use__title {
    font-size: 2rem;
    line-height: 1.18;
    letter-spacing: -0.04rem;
  }
}
.how-to-use__steps {
  list-style: none;
  padding: 0;
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--spacing-3);
}
@media (min-width: 768px) {
  .how-to-use__steps {
    grid-template-columns: repeat(3, 1fr);
    gap: var(--spacing-4);
  }
}
.how-to-use__step {
  background: var(--tan-200);
  border-radius: var(--spacing-4);
  padding: var(--spacing-5) var(--spacing-4);
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  box-shadow: var(--light-shadow);
}
.how-to-use__step-number {
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 50%;
  background: var(--primary-800);
  color: var(--white);
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: var(--spacing-3);
  font-family: var(--display-font);
  font-size: 1rem;
  line-height: 1.3;
  letter-spacing: 0;
  font-weight: 700;
}
@media (min-width: 992px) {
  .how-to-use__step-number {
    font-size: 1.25rem;
    line-height: 1.25;
    letter-spacing: -0.01rem;
  }
}
.how-to-use__step-title {
  color: var(--primary-800);
  margin-bottom: var(--spacing-2);
  font-family: var(--display-font);
  font-size: 1rem;
  line-height: 1.3;
  letter-spacing: 0;
  font-weight: 700;
}
@media (min-width: 992px) {
  .how-to-use__step-title {
    font-size: 1.25rem;
    line-height: 1.25;
    letter-spacing: -0.01rem;
  }
}
.how-to-use__step-body {
  color: var(--primary-500);
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.9375rem;
  line-height: 1.6;
}
@media (min-width: 992px) {
  .how-to-use__step-body {
    font-size: 1rem;
    line-height: 1.6;
  }
}

.description-tabs > .description-tabs__input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
  width: 0;
  height: 0;
}
.description-tabs__nav {
  display: flex;
  border-bottom: 1.5px solid var(--tan-300);
  margin-bottom: var(--spacing-4);
}
.description-tabs__label {
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.9375rem;
  line-height: 1.6;
  font-weight: 500;
  padding: var(--spacing-25) var(--spacing-3);
  color: var(--primary-400);
  cursor: pointer;
  border-bottom: 2.5px solid transparent;
  margin-bottom: -1.5px;
  transition: color 0.15s ease, border-color 0.15s ease;
}
@media (min-width: 992px) {
  .description-tabs__label {
    font-size: 1rem;
    line-height: 1.6;
  }
}
.description-tabs__label:hover {
  color: var(--primary-700);
}
.description-tabs__panel {
  display: none;
}
.description-tabs > .description-tabs__input:nth-of-type(1):checked ~ .description-tabs__nav > .description-tabs__label:nth-child(1),
.description-tabs > .description-tabs__input:nth-of-type(2):checked ~ .description-tabs__nav > .description-tabs__label:nth-child(2) {
  color: var(--primary-800);
  font-weight: 700;
  border-bottom-color: var(--success-600);
}
.description-tabs > .description-tabs__input:nth-of-type(1):checked ~ .description-tabs__panel--overview {
  display: block;
}
.description-tabs > .description-tabs__input:nth-of-type(2):checked ~ .description-tabs__panel--studies {
  display: block;
}

.description-sources {
  padding-top: var(--spacing-3);
}
.description-sources__entry {
  padding-bottom: var(--spacing-4);
  border-bottom: 1px solid var(--tan-500);
  margin-bottom: var(--spacing-4);
}
.description-sources__entry:last-child {
  border-bottom: none;
  margin-bottom: 0;
}
.description-sources__title {
  font-family: var(--display-font);
  font-size: 1rem;
  line-height: 1.3;
  letter-spacing: 0;
  color: var(--primary-800);
  margin-bottom: var(--spacing-25);
}
@media (min-width: 992px) {
  .description-sources__title {
    font-size: 1.25rem;
    line-height: 1.25;
    letter-spacing: -0.01rem;
  }
}
.description-sources__quote {
  background: var(--tan-100);
  border-left: 3px solid var(--success-500);
  border-radius: 0 var(--spacing-1) var(--spacing-1) 0;
  padding: var(--spacing-3);
  margin: 0 0 var(--spacing-25);
}
.description-sources__quote p {
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.9375rem;
  line-height: 1.6;
  color: var(--primary-700);
  margin: 0;
}
@media (min-width: 992px) {
  .description-sources__quote p {
    font-size: 1rem;
    line-height: 1.6;
  }
}
.description-sources__citations {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-1);
}
.description-sources__citation {
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.875rem;
  line-height: 1.6;
  color: var(--primary-500);
}
@media (min-width: 992px) {
  .description-sources__citation {
    font-size: 0.9375rem;
    line-height: 1.6;
  }
}
.description-sources__link {
  color: var(--green-500);
  font-weight: 600;
  text-decoration: none;
}
.description-sources__link:hover {
  text-decoration: underline;
}

.bundle-selector__intro {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-1);
}

.bundle-selector__header {
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--primary-600);
}
.bundle-selector__save-hint {
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.875rem;
  line-height: 1.6;
  color: var(--green-700, #077e79);
}
@media (min-width: 992px) {
  .bundle-selector__save-hint {
    font-size: 0.9375rem;
    line-height: 1.6;
  }
}
.bundle-selector__save-hint::before {
  content: "↺ ";
}
.bundle-selector__cards {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}
.bundle-selector__card {
  display: flex;
  align-items: center;
  gap: var(--spacing-25);
  padding: 0.875rem 1rem;
  border: 2px solid var(--tan-400);
  border-radius: var(--spacing-25);
  cursor: pointer;
  background: var(--tan-50);
  transition: border-color 0.15s ease;
}
.bundle-selector__card:has(input:checked) {
  border-color: var(--green-500);
  background: white;
}
.bundle-selector__card:hover {
  border-color: var(--green-500);
}
.bundle-selector__radio {
  width: 18px;
  height: 18px;
  accent-color: var(--green-500);
  flex-shrink: 0;
  cursor: pointer;
}
.bundle-selector__card-body {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex: 1;
  gap: 0.5rem;
}
.bundle-selector__quantity {
  font-weight: 600;
  color: var(--primary-800);
  font-size: 0.95rem;
}
.bundle-selector__badge {
  font-size: 0.7rem;
  font-weight: 700;
  padding: 2px 7px;
  border-radius: 999px;
  background-color: var(--yellow);
  color: var(--primary-800);
  white-space: nowrap;
}
.bundle-selector__delivery {
  font-size: 0.8rem;
  color: var(--primary-400);
}
.bundle-selector__delivery--free {
  color: var(--green-700, #077e79);
  font-weight: 600;
}
.bundle-selector__price {
  font-weight: 700;
  font-size: 0.95rem;
  color: var(--primary-800);
  white-space: nowrap;
}
.bundle-selector__original-price {
  font-size: 0.8rem;
  color: var(--primary-400);
  text-decoration: line-through;
  white-space: nowrap;
}
.bundle-selector__total {
  font-size: 0.8rem;
  color: var(--primary-400);
  white-space: nowrap;
}
.bundle-selector__supply-text {
  font-size: 0.8rem;
  color: var(--green-700, #077e79);
  font-weight: 600;
}

.supplement-size-selector__label {
  font-size: 0.8125rem;
  font-weight: 500;
  color: var(--primary-400);
  margin-bottom: var(--spacing-2);
}
.supplement-size-selector__buttons {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-2);
}
@media (min-width: 992px) {
  .supplement-size-selector__buttons {
    flex-direction: row;
  }
}
.supplement-size-selector__btn {
  flex: 1;
  width: 100%;
  padding: var(--spacing-1) var(--spacing-2);
  border-radius: 999px;
  border: 1.5px solid var(--tan-300);
  background: white;
  font-family: var(--body-font);
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--primary-500);
  cursor: pointer;
  text-align: center;
  white-space: nowrap;
  transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}
@media (min-width: 992px) {
  .supplement-size-selector__btn {
    width: auto;
  }
}
.supplement-size-selector__btn:hover {
  border-color: var(--secondary-400);
  background: var(--secondary-50);
}
.supplement-size-selector__btn--active, .supplement-size-selector__btn[aria-pressed=true] {
  background: var(--green-700);
  border-color: var(--green-700);
  color: white;
}

.key-benefits {
  border-top: 1.5px dashed var(--tan-400);
  border-bottom: 1.5px dashed var(--tan-400);
  padding-top: var(--spacing-4);
  padding-bottom: var(--spacing-4);
}
.key-benefits__track {
  display: flex;
  gap: 1rem;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
  padding-bottom: 0.25rem;
  scrollbar-width: none;
}
.key-benefits__track::-webkit-scrollbar {
  display: none;
}
@media (min-width: 992px) {
  .key-benefits__track {
    overflow-x: visible;
    justify-content: center;
  }
}
.key-benefits__card {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 0.5rem;
  flex: 0 0 8.5rem;
  scroll-snap-align: start;
  opacity: 0;
  transform: translateY(12px);
}
@media (min-width: 992px) {
  .key-benefits__card {
    flex: 1;
    max-width: 11rem;
  }
}
.key-benefits__card--visible {
  animation: benefit-fade-in 0.45s ease forwards;
}
@keyframes benefit-fade-in {
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
.key-benefits__icon-wrap {
  width: 4.4rem;
  height: 4.4rem;
  display: flex;
  align-items: flex-start;
  justify-content: center;
}
.key-benefits__icon {
  width: 100%;
  height: 100%;
  -o-object-fit: contain;
     object-fit: contain;
  -o-object-position: top center;
     object-position: top center;
}
.key-benefits__title {
  font-weight: 700;
  font-size: 0.9375rem;
  color: var(--primary-800);
  line-height: 1.3;
}
.key-benefits__description {
  font-size: 0.875rem;
  color: var(--primary-500);
  line-height: 1.4;
}

.feeding-table {
  width: 100%;
  border-collapse: collapse;
  border-radius: 0.5rem;
  overflow: hidden;
  font-size: 0.875rem;
}
.feeding-table td:first-child, .feeding-table th:first-child {
  width: 35%;
}
.feeding-table td:nth-child(2), .feeding-table th:nth-child(2) {
  width: 15%;
}
.feeding-table thead tr {
  background: var(--primary-800);
}
.feeding-table thead tr th {
  padding: var(--spacing-25) 1rem;
  text-align: left;
  font-weight: 700;
  font-size: 0.8125rem;
  color: white;
  letter-spacing: 0.02em;
}
.feeding-table tbody tr {
  background: var(--tan-50);
  border-bottom: 1px solid var(--tan-300);
}
.feeding-table tbody tr:last-child {
  border-bottom: none;
}
.feeding-table tbody tr td {
  padding: var(--spacing-25) 1rem;
  color: var(--primary-700);
  vertical-align: middle;
}
.feeding-table tbody tr td strong {
  color: var(--primary-800);
}
.feeding-table__note {
  font-size: 0.75rem;
  color: var(--primary-500);
  margin-top: var(--spacing-25);
  font-style: italic;
}

.product-accordion {
  border-bottom: 1.5px solid var(--tan-300);
}
.product-accordion:first-of-type {
  border-top: 1.5px solid var(--tan-300);
}
.product-accordion__summary {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
  padding: 1rem 0;
  cursor: pointer;
  list-style: none;
  transition: opacity 0.15s ease;
}
.product-accordion__summary::-webkit-details-marker {
  display: none;
}
.product-accordion__summary:hover {
  opacity: 0.7;
}
.product-accordion__header {
  font-weight: 700;
  font-size: 0.875rem;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--primary-800);
}
.product-accordion__icon {
  flex-shrink: 0;
  width: 1.25rem;
  height: 1.25rem;
  position: relative;
}
.product-accordion__icon::before, .product-accordion__icon::after {
  content: "";
  position: absolute;
  background: var(--primary-600);
  border-radius: 2px;
  transition: transform 0.25s ease, opacity 0.25s ease;
}
.product-accordion__icon::before {
  width: 100%;
  height: 2px;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
}
.product-accordion__icon::after {
  width: 2px;
  height: 100%;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
}
.product-accordion[open] .product-accordion__icon::after {
  transform: translateX(-50%) rotate(90deg);
  opacity: 0;
}
.product-accordion__body {
  padding-bottom: 1rem;
  color: var(--primary-600);
  line-height: 1.7;
}
.product-accordion__body p {
  font-size: 0.875rem;
  margin-bottom: 0.5rem;
}
.product-accordion__body p:last-child {
  margin-bottom: 0;
}

.money-back-guarantee {
  margin-top: var(--spacing-4);
  background-color: var(--green-10);
  border-radius: var(--spacing-2);
  padding: 0 var(--spacing-3);
}
.money-back-guarantee .product-accordion__header {
  display: flex;
  align-items: center;
  gap: var(--spacing-1);
  color: var(--green-700);
  text-transform: none;
}
.money-back-guarantee .product-accordion__header img {
  width: var(--spacing-4);
  height: var(--spacing-4);
  flex-shrink: 0;
}
.money-back-guarantee .product-accordion__icon::before, .money-back-guarantee .product-accordion__icon::after {
  background: var(--green-700);
}
.money-back-guarantee .product-accordion__body p {
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.875rem;
  line-height: 1.6;
  color: var(--primary-500);
  text-align: left;
}
@media (min-width: 992px) {
  .money-back-guarantee .product-accordion__body p {
    font-size: 0.9375rem;
    line-height: 1.6;
  }
}
.money-back-guarantee .product-accordion__body a {
  color: var(--green-700);
}

.explore-more__heading {
  margin-bottom: var(--spacing-4);
}
.explore-more__cards {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: 78%;
  gap: var(--spacing-3);
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
  padding-bottom: var(--spacing-2);
}
.explore-more__cards::-webkit-scrollbar {
  display: none;
}
.explore-more__cards > * {
  scroll-snap-align: start;
}
@media (min-width: 992px) {
  .explore-more__cards {
    grid-auto-columns: calc(25% - 1.25rem);
  }
}

.bundle-item-section__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--spacing-6);
}
@media (min-width: 992px) {
  .bundle-item-section__grid {
    grid-template-columns: 3fr 2fr;
    align-items: start;
  }
}
.bundle-item-section__image {
  max-width: 70%;
  margin: 0 auto;
  display: block;
}

a.bundle-item-card {
  cursor: pointer;
  text-decoration: none;
}

.bundle-item-card {
  border-radius: 1rem;
  overflow: hidden;
  background: var(--navy-800);
  display: flex;
  flex-direction: column;
}
.bundle-item-card__image {
  position: relative;
  background: var(--tan-50);
  padding: 1.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  aspect-ratio: 1;
}
.bundle-item-card__image img {
  max-width: 100%;
  height: auto;
  -o-object-fit: contain;
     object-fit: contain;
}
.bundle-item-card__qty {
  position: absolute;
  top: var(--spacing-25);
  left: var(--spacing-25);
  background: var(--navy-800);
  color: white;
  font-size: 0.875rem;
  font-weight: 700;
  padding: 0.25rem 0.625rem;
  border-radius: 2rem;
}
.bundle-item-card__info {
  padding: 1rem;
  display: flex;
  flex-direction: column;
  gap: var(--spacing-25);
  flex: 1;
}
.bundle-item-card__title {
  font-weight: 700;
  color: white;
  font-size: 1rem;
  line-height: 1.3;
}
.bundle-item-card__meta {
  color: var(--navy-300);
  font-size: 0.875rem;
  white-space: nowrap;
}
.bundle-item-card__footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: auto;
}
.bundle-item-card__arrow {
  width: 2rem;
  height: 2rem;
  border-radius: 50%;
  border: 1.5px solid var(--navy-500);
  display: flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  flex-shrink: 0;
}
.bundle-item-card__arrow::after {
  content: "";
  display: block;
  width: 0.35rem;
  height: 0.35rem;
  border-right: 2px solid white;
  border-top: 2px solid white;
  transform: rotate(45deg) translate(-1px, 1px);
}
.bundle-item-card__arrow--down::after {
  transform: translateY(-1px) rotate(135deg);
}
.bundle-item-card__arrow:hover {
  border-color: var(--navy-300);
}

.shop-sticky-footer {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 1000;
  background-color: var(--navy-800);
  border-top: 1px solid var(--navy-600);
  box-shadow: 0 -4px 24px rgba(0, 0, 0, 0.2);
  padding: var(--spacing-3) var(--spacing-4);
  padding-bottom: max(var(--spacing-3), env(safe-area-inset-bottom));
  transform: translateY(100%);
  transition: transform 0.3s cubic-bezier(0.34, 1.2, 0.64, 1);
  pointer-events: none;
}
.shop-sticky-footer--visible {
  transform: translateY(0);
  pointer-events: auto;
}
.shop-sticky-footer__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--spacing-3);
  text-align: left;
}
.shop-sticky-footer__info {
  flex: 1;
  min-width: 0;
}
.shop-sticky-footer__title {
  color: white;
  font-weight: 700;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.shop-sticky-footer__price {
  color: var(--navy-300);
  font-size: 0.875rem;
}

@keyframes email-popup-in {
  from {
    opacity: 0;
    transform: translateY(24px) scale(0.98);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}
@keyframes email-popup-backdrop-in {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
.email-popup {
  border: none;
  border-radius: var(--spacing-4);
  padding: 0;
  max-width: 1000px;
  width: calc(100% - var(--spacing-4));
  overflow: hidden;
  box-shadow: var(--shadow);
  text-align: left;
}
.email-popup[open] {
  animation: email-popup-in 0.35s cubic-bezier(0.22, 1, 0.36, 1) both;
}
.email-popup::backdrop {
  background: rgba(20, 36, 66, 0.55);
  animation: email-popup-backdrop-in 0.35s ease both;
}
.email-popup__layout {
  display: flex;
  flex-direction: column;
}
@media (min-width: 992px) {
  .email-popup__layout {
    flex-direction: row;
    min-height: 540px;
  }
}
.email-popup__image-panel {
  flex-shrink: 0;
  height: 210px;
  overflow: hidden;
}
@media (min-width: 992px) {
  .email-popup__image-panel {
    width: 45%;
    height: auto;
  }
}
.email-popup__img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center 100%;
     object-position: center 100%;
  display: block;
}
@media (min-width: 992px) {
  .email-popup__img {
    -o-object-position: 30% center;
       object-position: 30% center;
  }
}
.email-popup__form-panel {
  position: relative;
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: var(--spacing-5);
  background: var(--white);
}
.email-popup__close {
  position: absolute;
  top: var(--spacing-2);
  right: var(--spacing-2);
  background: var(--tan-300);
  border: none;
  border-radius: var(--spacing-5);
  cursor: pointer;
  padding: var(--spacing-1);
}
.email-popup__close:hover {
  opacity: 1;
}
.email-popup__eyebrow {
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--navy-500);
  margin-bottom: var(--spacing-25);
}
.email-popup__discount {
  font-family: var(--display-font);
  font-weight: 600;
  color: var(--primary-800);
  font-size: 2rem;
  line-height: 1.2;
  color: var(--navy-800);
  line-height: 1;
}
@media (min-width: 992px) {
  .email-popup__discount {
    font-size: 2.5rem;
    line-height: 1.18;
  }
}
.email-popup__subheading {
  font-family: var(--display-font);
  font-size: 1.25rem;
  line-height: 1.25;
  letter-spacing: -0.015rem;
  color: var(--navy-600);
  margin-bottom: var(--spacing-1);
}
@media (min-width: 992px) {
  .email-popup__subheading {
    font-size: 1.5rem;
    line-height: 1.22;
    letter-spacing: -0.02rem;
  }
}
.email-popup__code-box {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--spacing-2);
  width: 100%;
  padding: var(--spacing-3) var(--spacing-3);
  border: 2px dashed var(--navy-300);
  border-radius: var(--spacing-2);
  background: none;
  cursor: pointer;
  transition: border-color 0.15s;
}
.email-popup__code-box:hover {
  border-color: var(--navy-600);
}
.email-popup__code-box--copied {
  border-color: var(--green-500);
  border-style: solid;
}
.email-popup__code-box--copied .email-popup__code-text,
.email-popup__code-box--copied .email-popup__copy-icon {
  visibility: hidden;
}
.email-popup__code-box--copied .email-popup__copied-label {
  display: flex;
}
.email-popup__code-text {
  font-family: var(--display-font);
  font-size: 1.25rem;
  line-height: 1.25;
  letter-spacing: -0.015rem;
  color: var(--navy-800);
  letter-spacing: 0.08em;
}
@media (min-width: 992px) {
  .email-popup__code-text {
    font-size: 1.5rem;
    line-height: 1.22;
    letter-spacing: -0.02rem;
  }
}
.email-popup__copy-icon {
  flex-shrink: 0;
  width: 20px;
  height: 20px;
  opacity: 0.4;
  padding: var(--spacing-1);
  box-sizing: content-box;
}
.email-popup__copied-label {
  display: none;
  position: absolute;
  inset: 0;
  align-items: center;
  justify-content: center;
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.9375rem;
  line-height: 1.6;
  color: var(--green-700);
  font-weight: 600;
}
@media (min-width: 992px) {
  .email-popup__copied-label {
    font-size: 1rem;
    line-height: 1.6;
  }
}
.email-popup__terms {
  padding-left: var(--spacing-4);
  list-style: disc;
}
.email-popup__terms li {
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.875rem;
  line-height: 1.6;
  color: var(--navy-400);
}
@media (min-width: 992px) {
  .email-popup__terms li {
    font-size: 0.9375rem;
    line-height: 1.6;
  }
}

.checkout-accordion {
  background-color: var(--white);
  border-radius: var(--spacing-3);
  padding: var(--spacing-4);
  box-shadow: var(--light-shadow);
  position: relative;
}
.checkout-accordion__header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: var(--spacing-2);
}
.checkout-accordion__heading {
  display: flex;
  align-items: center;
  gap: var(--spacing-2);
}
.checkout-accordion__heading h4 {
  margin: 0;
}
.checkout-accordion__edit {
  background: none;
  border: none;
  color: var(--primary-700);
  text-decoration: underline;
  cursor: pointer;
  padding: var(--spacing-1) var(--spacing-2);
  display: none;
  text-transform: none;
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 1rem;
  line-height: 1.6;
}
@media (min-width: 992px) {
  .checkout-accordion__edit {
    font-size: 1.125rem;
    line-height: 1.6;
  }
}
.checkout-accordion__summary {
  margin-top: var(--spacing-1);
  margin-bottom: 0;
  display: none;
}
.checkout-accordion__body {
  display: none;
  padding-top: var(--spacing-3);
}
.checkout-accordion.is-open .checkout-accordion__body {
  display: block;
}
.checkout-accordion.is-complete:not(.is-open) .checkout-accordion__edit,
.checkout-accordion.is-complete:not(.is-open) .checkout-accordion__summary {
  display: block;
}
.checkout-accordion.is-complete:not(.is-open) .checkout-accordion__heading h4 {
  color: var(--primary-700);
}
.checkout-accordion.is-complete:not(.is-open) .checkout-accordion__heading::after {
  content: "✓";
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-left: var(--spacing-1);
  width: var(--spacing-4);
  height: var(--spacing-4);
  border-radius: 50%;
  font-weight: 600;
}
.checkout-accordion:not(.is-open):not(.is-complete) {
  opacity: 0.55;
}
.checkout-accordion:not(.is-open):not(.is-complete) .checkout-accordion__header {
  cursor: default;
}

.recipe-packs-index {
  max-width: 1200px;
  margin-inline: auto;
  padding: var(--spacing-5) var(--spacing-4);
}
@media (min-width: 992px) {
  .recipe-packs-index {
    padding: var(--spacing-7) var(--spacing-5);
  }
}
.recipe-packs-index h1 {
  font-family: var(--display-font);
  font-size: 2rem;
  line-height: 1.18;
  letter-spacing: -0.05rem;
  color: var(--primary-800);
  margin: 0 0 var(--spacing-5);
}
@media (min-width: 992px) {
  .recipe-packs-index h1 {
    font-size: 2.5rem;
    line-height: 1.15;
    letter-spacing: -0.06rem;
  }
}

.recipe-packs-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: var(--spacing-3);
}
@media (min-width: 768px) {
  .recipe-packs-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}
@media (min-width: 992px) {
  .recipe-packs-grid {
    grid-template-columns: repeat(3, 1fr);
    gap: var(--spacing-4);
  }
}
.recipe-packs-grid .recipe-card {
  background-color: var(--white);
  position: relative;
}
@media (hover: hover) {
  .recipe-packs-grid .recipe-card:hover:not(.is-selected) {
    background-color: var(--white);
  }
}

.recipe-card__link {
  position: absolute;
  inset: 0;
  z-index: 1;
  border-radius: inherit;
}

.recipe-card__details-link {
  position: relative;
  z-index: 2;
}

.recipe-card__media {
  position: relative;
  aspect-ratio: 5/4;
  background-color: var(--tan-100);
  border-radius: var(--spacing-2) var(--spacing-2) 0 0;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
}

.recipe-card__image {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}

.recipe-card__image-placeholder {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--primary-300);
}

.recipe-card__price {
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.9375rem;
  line-height: 1.6;
  color: var(--primary-800);
  font-weight: 600;
  margin: 0;
}
@media (min-width: 992px) {
  .recipe-card__price {
    font-size: 1rem;
    line-height: 1.6;
  }
}

.recipe-card__price-per {
  font-weight: 400;
  color: var(--primary-500);
}

.recipe-card__sizes {
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.875rem;
  line-height: 1.6;
  color: var(--primary-500);
  margin: 0;
}
@media (min-width: 992px) {
  .recipe-card__sizes {
    font-size: 0.9375rem;
    line-height: 1.6;
  }
}

@media (min-width: 992px) {
  .feeding-guide--stacked {
    flex-direction: column;
    align-items: stretch;
  }
}

@media (min-width: 992px) {
  .feeding-guide__table-wrapper--wide {
    width: 100%;
  }
}

.recipe-feeding-table {
  width: 100%;
  border-collapse: collapse;
  color: var(--white);
}
.recipe-feeding-table thead th {
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.625rem;
  line-height: 1.6;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--green-300);
  text-align: left;
  padding: var(--spacing-3) var(--spacing-2);
  vertical-align: bottom;
  border-bottom: 1px solid var(--navy-300);
}
@media (min-width: 992px) {
  .recipe-feeding-table thead th {
    font-size: 0.75rem;
    line-height: 1.6;
  }
}
.recipe-feeding-table tbody td {
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.9375rem;
  line-height: 1.6;
  padding: var(--spacing-3) var(--spacing-2);
  border-bottom: 1px solid var(--navy-500);
  vertical-align: middle;
}
@media (min-width: 992px) {
  .recipe-feeding-table tbody td {
    font-size: 1rem;
    line-height: 1.6;
  }
}
.recipe-feeding-table tbody tr:last-child td {
  border-bottom: none;
}
.recipe-feeding-table td:first-child,
.recipe-feeding-table th:first-child {
  font-weight: 700;
}

.recipe-pack-show__image {
  aspect-ratio: 1/1;
  background-color: var(--tan-100);
  border-radius: var(--spacing-3);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--primary-300);
  overflow: hidden;
}

.recipe-pack-show__image-img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}

.recipe-pack-show__swatches {
  display: flex;
  flex-wrap: wrap;
  gap: var(--spacing-2);
}

.recipe-pack-show__swatch {
  flex: 0 0 auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--spacing-2);
  padding: var(--spacing-2);
  border: 1px solid var(--primary-100);
  border-radius: var(--spacing-2);
  background-color: transparent;
  text-decoration: none;
  color: var(--primary-800);
  cursor: pointer;
  transition: border-color 0.15s ease, background-color 0.15s ease;
}
.recipe-pack-show__swatch:hover {
  border-color: var(--primary-300);
}

.recipe-pack-show__swatch--active {
  border-color: var(--primary-800);
  background-color: var(--tan-50);
}

.recipe-pack-show__swatch-image {
  width: 4.5rem;
  height: 4.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
}
.recipe-pack-show__swatch-image img {
  width: 100%;
  height: 100%;
  -o-object-fit: contain;
     object-fit: contain;
}
@media (min-width: 992px) {
  .recipe-pack-show__swatch-image {
    width: 5rem;
    height: 5rem;
  }
}

.recipe-pack-show__swatch-name {
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.625rem;
  line-height: 1.6;
  text-align: center;
  white-space: nowrap;
}
@media (min-width: 992px) {
  .recipe-pack-show__swatch-name {
    font-size: 0.75rem;
    line-height: 1.6;
  }
}

.recipe-pack-show__option-group {
  border: none;
  padding: 0;
  margin: 0;
}

.recipe-pack-show__option-label {
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.875rem;
  line-height: 1.6;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  color: var(--primary-800);
  margin: 0 0 var(--spacing-2);
  padding: 0;
}
@media (min-width: 992px) {
  .recipe-pack-show__option-label {
    font-size: 0.9375rem;
    line-height: 1.6;
  }
}

.recipe-pack-show__size-buttons {
  display: flex;
  gap: var(--spacing-2);
  flex-wrap: wrap;
}

.recipe-pack-show__size-btn {
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.9375rem;
  line-height: 1.6;
  background-color: var(--white);
  border: 1px solid var(--primary-100);
  border-radius: 999px;
  padding: var(--spacing-2) var(--spacing-4);
  cursor: pointer;
  color: var(--primary-800);
  transition: background-color 0.15s ease, border-color 0.15s ease;
}
@media (min-width: 992px) {
  .recipe-pack-show__size-btn {
    font-size: 1rem;
    line-height: 1.6;
  }
}
.recipe-pack-show__size-btn:hover {
  border-color: var(--primary-300);
}
.recipe-pack-show__size-btn.is-active {
  background-color: var(--primary-800);
  border-color: var(--primary-800);
  color: var(--white);
}

.recipe-pack-show__quantity-cards {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-2);
}

.recipe-pack-show__quantity-card {
  display: flex;
  align-items: center;
  gap: var(--spacing-3);
  padding: var(--spacing-3);
  border: 1px solid var(--primary-100);
  border-radius: var(--spacing-2);
  cursor: pointer;
  transition: border-color 0.15s ease, background-color 0.15s ease;
}
.recipe-pack-show__quantity-card[hidden] {
  display: none;
}
.recipe-pack-show__quantity-card:hover {
  border-color: var(--primary-300);
}
.recipe-pack-show__quantity-card:has(input:checked) {
  border-color: var(--primary-800);
  background-color: var(--tan-50);
}
.recipe-pack-show__quantity-card input[type=radio] {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.recipe-pack-show__quantity-card-body {
  display: grid;
  grid-template-columns: 1fr auto;
  grid-template-rows: auto auto;
  gap: 0 var(--spacing-3);
  flex: 1;
  align-items: baseline;
}

.recipe-pack-show__quantity-card-qty {
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.9375rem;
  line-height: 1.6;
  font-weight: 600;
  color: var(--primary-800);
  grid-column: 1;
}
@media (min-width: 992px) {
  .recipe-pack-show__quantity-card-qty {
    font-size: 1rem;
    line-height: 1.6;
  }
}

.recipe-pack-show__quantity-card-price {
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.9375rem;
  line-height: 1.6;
  font-weight: 600;
  color: var(--primary-800);
  grid-column: 2;
  text-align: right;
}
@media (min-width: 992px) {
  .recipe-pack-show__quantity-card-price {
    font-size: 1rem;
    line-height: 1.6;
  }
}

.recipe-pack-show__quantity-card-per {
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.875rem;
  line-height: 1.6;
  color: var(--primary-500);
  grid-column: 1/-1;
}
@media (min-width: 992px) {
  .recipe-pack-show__quantity-card-per {
    font-size: 0.9375rem;
    line-height: 1.6;
  }
}

.recipe-pack-show__quantity-card-strike {
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.875rem;
  line-height: 1.6;
  color: var(--primary-400);
  font-weight: 400;
  margin-right: var(--spacing-2);
}
@media (min-width: 992px) {
  .recipe-pack-show__quantity-card-strike {
    font-size: 0.9375rem;
    line-height: 1.6;
  }
}

.recipe-pack-show__promo-banner {
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.875rem;
  line-height: 1.6;
  background-color: var(--green-100);
  color: var(--green-900);
  border-radius: var(--spacing-2);
  padding: var(--spacing-2) var(--spacing-3);
  margin: 0 0 var(--spacing-3);
  font-weight: 600;
}
@media (min-width: 992px) {
  .recipe-pack-show__promo-banner {
    font-size: 0.9375rem;
    line-height: 1.6;
  }
}

.recipe-why-fresh {
  background-color: var(--white);
  padding-block: var(--spacing-5);
}
@media (min-width: 992px) {
  .recipe-why-fresh {
    padding-block: var(--spacing-7);
  }
}
.recipe-why-fresh__inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--spacing-5);
}
@media (min-width: 992px) {
  .recipe-why-fresh__inner {
    gap: var(--spacing-6);
  }
}
.recipe-why-fresh__header {
  text-align: center;
  max-width: 36rem;
}
.recipe-why-fresh__eyebrow {
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.875rem;
  line-height: 1.6;
  font-weight: 700;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--primary-800);
  margin: 0 0 var(--spacing-2);
}
@media (min-width: 992px) {
  .recipe-why-fresh__eyebrow {
    font-size: 0.9375rem;
    line-height: 1.6;
  }
}
.recipe-why-fresh__title {
  font-family: var(--display-font);
  font-size: 2rem;
  line-height: 1.18;
  letter-spacing: -0.05rem;
  font-weight: 400;
  color: var(--primary-800);
  margin: 0;
}
@media (min-width: 992px) {
  .recipe-why-fresh__title {
    font-size: 2.5rem;
    line-height: 1.15;
    letter-spacing: -0.06rem;
  }
}
.recipe-why-fresh__diagram {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-template-areas: "tl   tr" "bowl bowl" "bl   br";
  -moz-column-gap: 0;
       column-gap: 0;
  row-gap: var(--spacing-3);
  width: 100%;
  max-width: 28rem;
  align-items: stretch;
}
@media (min-width: 992px) {
  .recipe-why-fresh__diagram {
    grid-template-columns: 1fr minmax(20rem, 26rem) 1fr;
    grid-template-rows: 1fr 1fr;
    grid-template-areas: "tl bowl tr" "bl bowl br";
    -moz-column-gap: var(--spacing-5);
         column-gap: var(--spacing-5);
    row-gap: var(--spacing-6);
    max-width: 64rem;
    align-items: center;
  }
}
.recipe-why-fresh__bowl {
  grid-area: bowl;
  display: flex;
  justify-content: center;
  align-items: center;
  opacity: 0;
  transform: scale(0.9);
  transition: opacity 0.6s ease, transform 0.7s cubic-bezier(0.34, 1.56, 0.64, 1);
}
.recipe-why-fresh__bowl.is-visible {
  opacity: 1;
  transform: scale(1);
}
.recipe-why-fresh__bowl-image {
  display: block;
  width: 100%;
  max-width: 18rem;
  height: auto;
  margin-inline: auto;
}
@media (min-width: 992px) {
  .recipe-why-fresh__bowl-image {
    max-width: 100%;
  }
}
.recipe-why-fresh__callout {
  margin: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: var(--spacing-2);
  padding-inline: var(--spacing-3);
  opacity: 0;
  transition: opacity 0.6s ease, transform 0.6s ease;
}
.recipe-why-fresh__callout.is-visible {
  opacity: 1;
  transform: translate(0, 0);
}
.recipe-why-fresh__callout--tl {
  grid-area: tl;
  transform: translate(-12px, -12px);
}
.recipe-why-fresh__callout--tr {
  grid-area: tr;
  transform: translate(12px, -12px);
}
.recipe-why-fresh__callout--bl {
  grid-area: bl;
  transform: translate(-12px, 12px);
}
.recipe-why-fresh__callout--br {
  grid-area: br;
  transform: translate(12px, 12px);
}
.recipe-why-fresh__callout--tr, .recipe-why-fresh__callout--br {
  border-left: 1px solid var(--primary-100);
}
@media (min-width: 992px) {
  .recipe-why-fresh__callout--tr, .recipe-why-fresh__callout--br {
    border-left: 0;
  }
}
.recipe-why-fresh__callout-title {
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.875rem;
  line-height: 1.6;
  font-weight: 700;
  color: var(--primary-800);
  margin: 0;
}
@media (min-width: 992px) {
  .recipe-why-fresh__callout-title {
    font-size: 0.9375rem;
    line-height: 1.6;
  }
}
@media (min-width: 992px) {
  .recipe-why-fresh__callout-title {
    font-family: var(--display-font);
    font-size: 1rem;
    line-height: 1.3;
    letter-spacing: 0;
    font-weight: 500;
  }
}
@media (min-width: 992px) and (min-width: 992px) {
  .recipe-why-fresh__callout-title {
    font-size: 1.25rem;
    line-height: 1.25;
    letter-spacing: -0.01rem;
  }
}
.recipe-why-fresh__callout-body {
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.625rem;
  line-height: 1.6;
  color: var(--primary-500);
  margin: 0;
}
@media (min-width: 992px) {
  .recipe-why-fresh__callout-body {
    font-size: 0.75rem;
    line-height: 1.6;
  }
}
@media (min-width: 992px) {
  .recipe-why-fresh__callout-body {
    font-family: var(--body-font);
    font-weight: 300;
    font-size: 0.875rem;
    line-height: 1.6;
  }
}
@media (min-width: 992px) and (min-width: 992px) {
  .recipe-why-fresh__callout-body {
    font-size: 0.9375rem;
    line-height: 1.6;
  }
}
.recipe-why-fresh__arrow {
  color: var(--pink-500);
}
.recipe-why-fresh__arrow path {
  stroke-dasharray: 220;
  stroke-dashoffset: 220;
  transition: stroke-dashoffset 0.6s ease 0.2s;
}
.recipe-why-fresh__arrow--straight {
  display: block;
  width: 1.25rem;
  height: 2.75rem;
}
@media (min-width: 992px) {
  .recipe-why-fresh__arrow--straight {
    display: none;
  }
}
.recipe-why-fresh__arrow--curve {
  display: none;
}
@media (min-width: 992px) {
  .recipe-why-fresh__arrow--curve {
    display: block;
    width: 4.5rem;
    height: 3.5rem;
  }
}
.recipe-why-fresh__callout.is-visible .recipe-why-fresh__arrow path {
  stroke-dashoffset: 0;
}
.recipe-why-fresh__callout--bl, .recipe-why-fresh__callout--br {
  flex-direction: column-reverse;
}
.recipe-why-fresh__callout--tl .recipe-why-fresh__arrow--straight {
  transform: rotate(-10deg);
}
.recipe-why-fresh__callout--tr .recipe-why-fresh__arrow--straight {
  transform: rotate(10deg);
}
.recipe-why-fresh__callout--bl .recipe-why-fresh__arrow--straight {
  transform: rotate(-170deg);
}
.recipe-why-fresh__callout--br .recipe-why-fresh__arrow--straight {
  transform: rotate(170deg);
}
@media (min-width: 992px) {
  .recipe-why-fresh__callout--tl {
    align-items: flex-end;
    text-align: right;
    flex-direction: column;
  }
  .recipe-why-fresh__callout--tr {
    align-items: flex-start;
    text-align: left;
    flex-direction: column;
  }
  .recipe-why-fresh__callout--tr .recipe-why-fresh__arrow--curve {
    transform: scaleX(-1);
  }
  .recipe-why-fresh__callout--bl {
    align-items: flex-end;
    text-align: right;
  }
  .recipe-why-fresh__callout--bl .recipe-why-fresh__arrow--curve {
    transform: scaleY(-1);
  }
  .recipe-why-fresh__callout--br {
    align-items: flex-start;
    text-align: left;
  }
  .recipe-why-fresh__callout--br .recipe-why-fresh__arrow--curve {
    transform: scale(-1, -1);
  }
}

.recipe-cooking {
  background-color: var(--pink-50);
  padding-block: var(--spacing-5);
}
@media (min-width: 992px) {
  .recipe-cooking {
    padding-block: var(--spacing-8);
  }
}
.recipe-cooking__inner {
  width: 90%;
  margin-inline: auto;
}
@media (min-width: 992px) {
  .recipe-cooking__inner {
    width: 82%;
    display: grid;
    grid-template-columns: 1fr 1fr;
    align-items: stretch;
    -moz-column-gap: var(--spacing-8);
         column-gap: var(--spacing-8);
  }
}
.recipe-cooking__copy {
  text-align: center;
}
@media (min-width: 992px) {
  .recipe-cooking__copy {
    text-align: left;
  }
}
.recipe-cooking__eyebrow {
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.875rem;
  line-height: 1.6;
  font-weight: 700;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--primary-800);
  margin: 0 0 var(--spacing-2);
}
@media (min-width: 992px) {
  .recipe-cooking__eyebrow {
    font-size: 0.9375rem;
    line-height: 1.6;
  }
}
.recipe-cooking__temp {
  font-family: var(--display-font);
  font-weight: 600;
  color: var(--primary-800);
  font-size: 2.75rem;
  line-height: 1.2;
  font-weight: 300;
  color: var(--primary-800);
  margin: 0 0 var(--spacing-3);
  line-height: 1;
  font-size: 5rem;
}
@media (min-width: 992px) {
  .recipe-cooking__temp {
    font-size: 3.5rem;
    line-height: 1.15;
  }
}
@media (min-width: 992px) {
  .recipe-cooking__temp {
    font-size: 7rem;
  }
}
.recipe-cooking__title {
  font-family: var(--display-font);
  font-size: 2rem;
  line-height: 1.18;
  letter-spacing: -0.05rem;
  font-weight: 400;
  color: var(--primary-800);
  margin: 0 0 var(--spacing-3);
}
@media (min-width: 992px) {
  .recipe-cooking__title {
    font-size: 2.5rem;
    line-height: 1.15;
    letter-spacing: -0.06rem;
  }
}
.recipe-cooking__body {
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.9375rem;
  line-height: 1.6;
  color: var(--primary-700);
  margin: 0;
  max-width: 44rem;
}
@media (min-width: 992px) {
  .recipe-cooking__body {
    font-size: 1rem;
    line-height: 1.6;
  }
}
.recipe-cooking__image-wrap {
  display: flex;
  justify-content: center;
  margin-bottom: var(--spacing-5);
}
@media (min-width: 992px) {
  .recipe-cooking__image-wrap {
    position: relative;
    margin-bottom: 0;
    min-height: 0;
    overflow: hidden;
    border-radius: var(--spacing-3);
  }
}
.recipe-cooking__image {
  display: block;
  width: 100%;
  max-width: 22rem;
  height: auto;
  border-radius: var(--spacing-3);
}
@media (min-width: 992px) {
  .recipe-cooking__image {
    position: absolute;
    inset: 0;
    max-width: none;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
       object-fit: cover;
    -o-object-position: center;
       object-position: center;
    border-radius: 0;
  }
}
.recipe-cooking__scale {
  list-style: none;
  margin: var(--spacing-3) 0 0;
  padding: 0;
  text-align: left;
}
.recipe-cooking__scale-row {
  padding-block: var(--spacing-25);
}
.recipe-cooking__scale-row + .recipe-cooking__scale-row {
  border-top: 1px solid var(--pink-300);
}
.recipe-cooking__scale-label {
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.875rem;
  line-height: 1.6;
  display: block;
  color: var(--primary-700);
  margin-bottom: var(--spacing-2);
}
@media (min-width: 992px) {
  .recipe-cooking__scale-label {
    font-size: 0.9375rem;
    line-height: 1.6;
  }
}
.recipe-cooking__meter {
  display: flex;
  align-items: center;
  gap: var(--spacing-1);
}
.recipe-cooking__bulb {
  flex-shrink: 0;
  width: var(--spacing-4);
  height: var(--spacing-4);
  border-radius: 50%;
  background-color: var(--primary-800);
}
.recipe-cooking__stem {
  position: relative;
  flex: 1;
  height: var(--spacing-2);
  border-radius: var(--spacing-4);
  background-color: var(--pink-100);
}
.recipe-cooking__fill {
  position: absolute;
  inset-block: 0;
  left: 0;
  border-radius: var(--spacing-4);
  transform-origin: left center;
  background-color: var(--primary-800);
}
.recipe-cooking__tip {
  position: absolute;
  top: 50%;
  width: var(--spacing-3);
  height: var(--spacing-3);
  border-radius: 50%;
  border: 2px solid var(--pink-50);
  background-color: var(--primary-800);
  transform: translate(-50%, -50%);
}
.recipe-cooking__scale-temp {
  position: absolute;
  top: 50%;
  transform: translate(var(--spacing-3), -50%);
  white-space: nowrap;
  font-family: var(--body-font);
  font-weight: 300;
  font-size: 0.875rem;
  line-height: 1.6;
  font-weight: 700;
  color: var(--primary-800);
}
@media (min-width: 992px) {
  .recipe-cooking__scale-temp {
    font-size: 0.9375rem;
    line-height: 1.6;
  }
}
@media (prefers-reduced-motion: no-preference) {
  .recipe-cooking__fill {
    animation: recipe-cooking-fill linear both;
    animation-timeline: view();
    animation-range: entry 10% cover 35%;
  }
}
@keyframes recipe-cooking-fill {
  from {
    transform: scaleX(0);
  }
  to {
    transform: scaleX(1);
  }
}
.recipe-cooking__scale-row--tuggs .recipe-cooking__scale-label {
  font-weight: 700;
  color: var(--primary-800);
}
.recipe-cooking__scale-row--tuggs .recipe-cooking__bulb,
.recipe-cooking__scale-row--tuggs .recipe-cooking__fill,
.recipe-cooking__scale-row--tuggs .recipe-cooking__tip {
  background-color: var(--green-300);
}

trix-editor {
  border: 1px solid #bbb;
  border-radius: 3px;
  margin: 0;
  padding: 0.4em 0.6em;
  min-height: 5em;
  outline: none;
}

trix-toolbar * {
  box-sizing: border-box;
}

trix-toolbar .trix-button-row {
  display: flex;
  flex-wrap: nowrap;
  justify-content: space-between;
  overflow-x: auto;
}

trix-toolbar .trix-button-group {
  display: flex;
  margin-bottom: 10px;
  border: 1px solid #bbb;
  border-top-color: #ccc;
  border-bottom-color: #888;
  border-radius: 3px;
}

trix-toolbar .trix-button-group:not(:first-child) {
  margin-left: 1.5vw;
}

@media (max-width: 768px) {
  trix-toolbar .trix-button-group:not(:first-child) {
    margin-left: 0;
  }
}
trix-toolbar .trix-button-group-spacer {
  flex-grow: 1;
}

@media (max-width: 768px) {
  trix-toolbar .trix-button-group-spacer {
    display: none;
  }
}
trix-toolbar .trix-button {
  position: relative;
  float: left;
  color: rgba(0, 0, 0, 0.6);
  font-size: 0.75em;
  font-weight: 600;
  white-space: nowrap;
  padding: 0 0.5em;
  margin: 0;
  outline: none;
  border: none;
  border-bottom: 1px solid #ddd;
  border-radius: 0;
  background: transparent;
}

trix-toolbar .trix-button:not(:first-child) {
  border-left: 1px solid #ccc;
}

trix-toolbar .trix-button.trix-active {
  background: #cbeefa;
  color: rgb(0, 0, 0);
}

trix-toolbar .trix-button:not(:disabled) {
  cursor: pointer;
}

trix-toolbar .trix-button:disabled {
  color: rgba(0, 0, 0, 0.125);
}

@media (max-width: 768px) {
  trix-toolbar .trix-button {
    letter-spacing: -0.01em;
    padding: 0 0.3em;
  }
}
trix-toolbar .trix-button--icon {
  font-size: inherit;
  width: 2.6em;
  height: 1.6em;
  max-width: calc(0.8em + 4vw);
  text-indent: -9999px;
}

@media (max-width: 768px) {
  trix-toolbar .trix-button--icon {
    height: 2em;
    max-width: calc(0.8em + 3.5vw);
  }
}
trix-toolbar .trix-button--icon::before {
  display: inline-block;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  opacity: 0.6;
  content: "";
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
}

@media (max-width: 768px) {
  trix-toolbar .trix-button--icon::before {
    right: 6%;
    left: 6%;
  }
}
trix-toolbar .trix-button--icon.trix-active::before {
  opacity: 1;
}

trix-toolbar .trix-button--icon:disabled::before {
  opacity: 0.125;
}

trix-toolbar .trix-button--icon-attach::before {
  background-image: url("data:image/svg+xml,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M10.5%2018V7.5c0-2.25%203-2.25%203%200V18c0%204.125-6%204.125-6%200V7.5c0-6.375%209-6.375%209%200V18%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-miterlimit%3D%2210%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%3C%2Fsvg%3E");
  top: 8%;
  bottom: 4%;
}

trix-toolbar .trix-button--icon-bold::before {
  background-image: url("data:image/svg+xml,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M6.522%2019.242a.5.5%200%200%201-.5-.5V5.35a.5.5%200%200%201%20.5-.5h5.783c1.347%200%202.46.345%203.24.982.783.64%201.216%201.562%201.216%202.683%200%201.13-.587%202.129-1.476%202.71a.35.35%200%200%200%20.049.613c1.259.56%202.101%201.742%202.101%203.22%200%201.282-.483%202.334-1.363%203.063-.876.726-2.132%201.12-3.66%201.12h-5.89ZM9.27%207.347v3.362h1.97c.766%200%201.347-.17%201.733-.464.38-.291.587-.716.587-1.27%200-.53-.183-.928-.513-1.198-.334-.273-.838-.43-1.505-.43H9.27Zm0%205.606v3.791h2.389c.832%200%201.448-.177%201.853-.497.399-.315.614-.786.614-1.423%200-.62-.22-1.077-.63-1.385-.418-.313-1.053-.486-1.905-.486H9.27Z%22%20fill%3D%22%23000%22%2F%3E%3C%2Fsvg%3E");
}

trix-toolbar .trix-button--icon-italic::before {
  background-image: url("data:image/svg+xml,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M9%205h6.5v2h-2.23l-2.31%2010H13v2H6v-2h2.461l2.306-10H9V5Z%22%20fill%3D%22%23000%22%2F%3E%3C%2Fsvg%3E");
}

trix-toolbar .trix-button--icon-link::before {
  background-image: url("data:image/svg+xml,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M18.948%205.258a4.337%204.337%200%200%200-6.108%200L11.217%206.87a.993.993%200%200%200%200%201.41c.392.39%201.027.39%201.418%200l1.623-1.613a2.323%202.323%200%200%201%203.271%200%202.29%202.29%200%200%201%200%203.251l-2.393%202.38a3.021%203.021%200%200%201-4.255%200l-.05-.049a1.007%201.007%200%200%200-1.418%200%20.993.993%200%200%200%200%201.41l.05.049a5.036%205.036%200%200%200%207.091%200l2.394-2.38a4.275%204.275%200%200%200%200-6.072Zm-13.683%2013.6a4.337%204.337%200%200%200%206.108%200l1.262-1.255a.993.993%200%200%200%200-1.41%201.007%201.007%200%200%200-1.418%200L9.954%2017.45a2.323%202.323%200%200%201-3.27%200%202.29%202.29%200%200%201%200-3.251l2.344-2.331a2.579%202.579%200%200%201%203.631%200c.392.39%201.027.39%201.419%200a.993.993%200%200%200%200-1.41%204.593%204.593%200%200%200-6.468%200l-2.345%202.33a4.275%204.275%200%200%200%200%206.072Z%22%20fill%3D%22%23000%22%2F%3E%3C%2Fsvg%3E");
}

trix-toolbar .trix-button--icon-strike::before {
  background-image: url("data:image/svg+xml,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M6%2014.986c.088%202.647%202.246%204.258%205.635%204.258%203.496%200%205.713-1.728%205.713-4.463%200-.275-.02-.536-.062-.781h-3.461c.398.293.573.654.573%201.123%200%201.035-1.074%201.787-2.646%201.787-1.563%200-2.773-.762-2.91-1.924H6ZM6.432%2010h3.763c-.632-.314-.914-.715-.914-1.273%200-1.045.977-1.739%202.432-1.739%201.475%200%202.52.723%202.617%201.914h2.764c-.05-2.548-2.11-4.238-5.39-4.238-3.145%200-5.392%201.719-5.392%204.316%200%20.363.04.703.12%201.02ZM4%2011a1%201%200%201%200%200%202h15a1%201%200%201%200%200-2H4Z%22%20fill%3D%22%23000%22%2F%3E%3C%2Fsvg%3E");
}

trix-toolbar .trix-button--icon-quote::before {
  background-image: url("data:image/svg+xml,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M4.581%208.471c.44-.5%201.056-.834%201.758-.995C8.074%207.17%209.201%207.822%2010%208.752c1.354%201.578%201.33%203.555.394%205.277-.941%201.731-2.788%203.163-4.988%203.56a.622.622%200%200%201-.653-.317c-.113-.205-.121-.49.16-.764.294-.286.567-.566.791-.835.222-.266.413-.54.524-.815.113-.28.156-.597.026-.908-.128-.303-.39-.524-.72-.69a3.02%203.02%200%200%201-1.674-2.7c0-.905.283-1.59.72-2.088Zm9.419%200c.44-.5%201.055-.834%201.758-.995%201.734-.306%202.862.346%203.66%201.276%201.355%201.578%201.33%203.555.395%205.277-.941%201.731-2.789%203.163-4.988%203.56a.622.622%200%200%201-.653-.317c-.113-.205-.122-.49.16-.764.294-.286.567-.566.791-.835.222-.266.412-.54.523-.815.114-.28.157-.597.026-.908-.127-.303-.39-.524-.72-.69a3.02%203.02%200%200%201-1.672-2.701c0-.905.283-1.59.72-2.088Z%22%20fill%3D%22%23000%22%2F%3E%3C%2Fsvg%3E");
}

trix-toolbar .trix-button--icon-heading-1::before {
  background-image: url("data:image/svg+xml,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M21.5%207.5v-3h-12v3H14v13h3v-13h4.5ZM9%2013.5h3.5v-3h-10v3H6v7h3v-7Z%22%20fill%3D%22%23000%22%2F%3E%3C%2Fsvg%3E");
}

trix-toolbar .trix-button--icon-code::before {
  background-image: url("data:image/svg+xml,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M3.293%2011.293a1%201%200%200%200%200%201.414l4%204a1%201%200%201%200%201.414-1.414L5.414%2012l3.293-3.293a1%201%200%200%200-1.414-1.414l-4%204Zm13.414%205.414%204-4a1%201%200%200%200%200-1.414l-4-4a1%201%200%201%200-1.414%201.414L18.586%2012l-3.293%203.293a1%201%200%200%200%201.414%201.414Z%22%20fill%3D%22%23000%22%2F%3E%3C%2Fsvg%3E");
}

trix-toolbar .trix-button--icon-bullet-list::before {
  background-image: url("data:image/svg+xml,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M5%207.5a1.5%201.5%200%201%200%200-3%201.5%201.5%200%200%200%200%203ZM8%206a1%201%200%200%201%201-1h11a1%201%200%201%201%200%202H9a1%201%200%200%201-1-1Zm1%205a1%201%200%201%200%200%202h11a1%201%200%201%200%200-2H9Zm0%206a1%201%200%201%200%200%202h11a1%201%200%201%200%200-2H9Zm-2.5-5a1.5%201.5%200%201%201-3%200%201.5%201.5%200%200%201%203%200ZM5%2019.5a1.5%201.5%200%201%200%200-3%201.5%201.5%200%200%200%200%203Z%22%20fill%3D%22%23000%22%2F%3E%3C%2Fsvg%3E");
}

trix-toolbar .trix-button--icon-number-list::before {
  background-image: url("data:image/svg+xml,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M3%204h2v4H4V5H3V4Zm5%202a1%201%200%200%201%201-1h11a1%201%200%201%201%200%202H9a1%201%200%200%201-1-1Zm1%205a1%201%200%201%200%200%202h11a1%201%200%201%200%200-2H9Zm0%206a1%201%200%201%200%200%202h11a1%201%200%201%200%200-2H9Zm-3.5-7H6v1l-1.5%202H6v1H3v-1l1.667-2H3v-1h2.5ZM3%2017v-1h3v4H3v-1h2v-.5H4v-1h1V17H3Z%22%20fill%3D%22%23000%22%2F%3E%3C%2Fsvg%3E");
}

trix-toolbar .trix-button--icon-undo::before {
  background-image: url("data:image/svg+xml,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M3%2014a1%201%200%200%200%201%201h6a1%201%200%201%200%200-2H6.257c2.247-2.764%205.151-3.668%207.579-3.264%202.589.432%204.739%202.356%205.174%205.405a1%201%200%200%200%201.98-.283c-.564-3.95-3.415-6.526-6.825-7.095C11.084%207.25%207.63%208.377%205%2011.39V8a1%201%200%200%200-2%200v6Zm2-1Z%22%20fill%3D%22%23000%22%2F%3E%3C%2Fsvg%3E");
}

trix-toolbar .trix-button--icon-redo::before {
  background-image: url("data:image/svg+xml,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M21%2014a1%201%200%200%201-1%201h-6a1%201%200%201%201%200-2h3.743c-2.247-2.764-5.151-3.668-7.579-3.264-2.589.432-4.739%202.356-5.174%205.405a1%201%200%200%201-1.98-.283c.564-3.95%203.415-6.526%206.826-7.095%203.08-.513%206.534.614%209.164%203.626V8a1%201%200%201%201%202%200v6Zm-2-1Z%22%20fill%3D%22%23000%22%2F%3E%3C%2Fsvg%3E");
}

trix-toolbar .trix-button--icon-decrease-nesting-level::before {
  background-image: url("data:image/svg+xml,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M5%206a1%201%200%200%201%201-1h12a1%201%200%201%201%200%202H6a1%201%200%200%201-1-1Zm4%205a1%201%200%201%200%200%202h9a1%201%200%201%200%200-2H9Zm-3%206a1%201%200%201%200%200%202h12a1%201%200%201%200%200-2H6Zm-3.707-5.707a1%201%200%200%200%200%201.414l2%202a1%201%200%201%200%201.414-1.414L4.414%2012l1.293-1.293a1%201%200%200%200-1.414-1.414l-2%202Z%22%20fill%3D%22%23000%22%2F%3E%3C%2Fsvg%3E");
}

trix-toolbar .trix-button--icon-increase-nesting-level::before {
  background-image: url("data:image/svg+xml,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M5%206a1%201%200%200%201%201-1h12a1%201%200%201%201%200%202H6a1%201%200%200%201-1-1Zm4%205a1%201%200%201%200%200%202h9a1%201%200%201%200%200-2H9Zm-3%206a1%201%200%201%200%200%202h12a1%201%200%201%200%200-2H6Zm-2.293-2.293%202-2a1%201%200%200%200%200-1.414l-2-2a1%201%200%201%200-1.414%201.414L3.586%2012l-1.293%201.293a1%201%200%201%200%201.414%201.414Z%22%20fill%3D%22%23000%22%2F%3E%3C%2Fsvg%3E");
}

trix-toolbar .trix-dialogs {
  position: relative;
}

trix-toolbar .trix-dialog {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  font-size: 0.75em;
  padding: 15px 10px;
  background: #fff;
  box-shadow: 0 0.3em 1em #ccc;
  border-top: 2px solid #888;
  border-radius: 5px;
  z-index: 5;
}

trix-toolbar .trix-input--dialog {
  font-size: inherit;
  font-weight: normal;
  padding: 0.5em 0.8em;
  margin: 0 10px 0 0;
  border-radius: 3px;
  border: 1px solid #bbb;
  background-color: #fff;
  box-shadow: none;
  outline: none;
  -webkit-appearance: none;
  -moz-appearance: none;
}

trix-toolbar .trix-input--dialog.validate:invalid {
  box-shadow: #F00 0px 0px 1.5px 1px;
}

trix-toolbar .trix-button--dialog {
  font-size: inherit;
  padding: 0.5em;
  border-bottom: none;
}

trix-toolbar .trix-dialog--link {
  max-width: 600px;
}

trix-toolbar .trix-dialog__link-fields {
  display: flex;
  align-items: baseline;
}

trix-toolbar .trix-dialog__link-fields .trix-input {
  flex: 1;
}

trix-toolbar .trix-dialog__link-fields .trix-button-group {
  flex: 0 0 content;
  margin: 0;
}

trix-editor [data-trix-mutable]:not(.attachment__caption-editor) {
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
}

trix-editor [data-trix-mutable] ::-moz-selection, trix-editor [data-trix-mutable]::-moz-selection,
trix-editor [data-trix-cursor-target]::-moz-selection {
  background: none;
}

trix-editor [data-trix-mutable] ::-moz-selection, trix-editor [data-trix-mutable]::-moz-selection, trix-editor [data-trix-cursor-target]::-moz-selection {
  background: none;
}

trix-editor [data-trix-mutable] ::selection, trix-editor [data-trix-mutable]::selection,
trix-editor [data-trix-cursor-target]::selection {
  background: none;
}

trix-editor [data-trix-mutable].attachment__caption-editor:focus::-moz-selection {
  background: highlight;
}

trix-editor [data-trix-mutable].attachment__caption-editor:focus::selection {
  background: highlight;
}

trix-editor [data-trix-mutable].attachment.attachment--file {
  box-shadow: 0 0 0 2px highlight;
  border-color: transparent;
}

trix-editor [data-trix-mutable].attachment img {
  box-shadow: 0 0 0 2px highlight;
}

trix-editor .attachment {
  position: relative;
}

trix-editor .attachment:hover {
  cursor: default;
}

trix-editor .attachment--preview .attachment__caption:hover {
  cursor: text;
}

trix-editor .attachment__progress {
  position: absolute;
  z-index: 1;
  height: 20px;
  top: calc(50% - 10px);
  left: 5%;
  width: 90%;
  opacity: 0.9;
  transition: opacity 200ms ease-in;
}

trix-editor .attachment__progress[value="100"] {
  opacity: 0;
}

trix-editor .attachment__caption-editor {
  display: inline-block;
  width: 100%;
  margin: 0;
  padding: 0;
  font-size: inherit;
  font-family: inherit;
  line-height: inherit;
  color: inherit;
  text-align: center;
  vertical-align: top;
  border: none;
  outline: none;
  -webkit-appearance: none;
  -moz-appearance: none;
}

trix-editor .attachment__toolbar {
  position: absolute;
  z-index: 1;
  top: -0.9em;
  left: 0;
  width: 100%;
  text-align: center;
}

trix-editor .trix-button-group {
  display: inline-flex;
}

trix-editor .trix-button {
  position: relative;
  float: left;
  color: #666;
  white-space: nowrap;
  font-size: 80%;
  padding: 0 0.8em;
  margin: 0;
  outline: none;
  border: none;
  border-radius: 0;
  background: transparent;
}

trix-editor .trix-button:not(:first-child) {
  border-left: 1px solid #ccc;
}

trix-editor .trix-button.trix-active {
  background: #cbeefa;
}

trix-editor .trix-button:not(:disabled) {
  cursor: pointer;
}

trix-editor .trix-button--remove {
  text-indent: -9999px;
  display: inline-block;
  padding: 0;
  outline: none;
  width: 1.8em;
  height: 1.8em;
  line-height: 1.8em;
  border-radius: 50%;
  background-color: #fff;
  border: 2px solid highlight;
  box-shadow: 1px 1px 6px rgba(0, 0, 0, 0.25);
}

trix-editor .trix-button--remove::before {
  display: inline-block;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  opacity: 0.7;
  content: "";
  background-image: url("data:image/svg+xml,%3Csvg%20height%3D%2224%22%20width%3D%2224%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M19%206.41%2017.59%205%2012%2010.59%206.41%205%205%206.41%2010.59%2012%205%2017.59%206.41%2019%2012%2013.41%2017.59%2019%2019%2017.59%2013.41%2012z%22%2F%3E%3Cpath%20d%3D%22M0%200h24v24H0z%22%20fill%3D%22none%22%2F%3E%3C%2Fsvg%3E");
  background-position: center;
  background-repeat: no-repeat;
  background-size: 90%;
}

trix-editor .trix-button--remove:hover {
  border-color: #333;
}

trix-editor .trix-button--remove:hover::before {
  opacity: 1;
}

trix-editor .attachment__metadata-container {
  position: relative;
}

trix-editor .attachment__metadata {
  position: absolute;
  left: 50%;
  top: 2em;
  transform: translate(-50%, 0);
  max-width: 90%;
  padding: 0.1em 0.6em;
  font-size: 0.8em;
  color: #fff;
  background-color: rgba(0, 0, 0, 0.7);
  border-radius: 3px;
}

trix-editor .attachment__metadata .attachment__name {
  display: inline-block;
  max-width: 100%;
  vertical-align: bottom;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

trix-editor .attachment__metadata .attachment__size {
  margin-left: 0.2em;
  white-space: nowrap;
}

.trix-content {
  line-height: 1.5;
  overflow-wrap: break-word;
  word-break: break-word;
}

.trix-content * {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

.trix-content h1 {
  font-size: 1.2em;
  line-height: 1.2;
}

.trix-content blockquote {
  border: 0 solid #ccc;
  border-left-width: 0.3em;
  margin-left: 0.3em;
  padding-left: 0.6em;
}

.trix-content [dir=rtl] blockquote,
.trix-content blockquote[dir=rtl] {
  border-width: 0;
  border-right-width: 0.3em;
  margin-right: 0.3em;
  padding-right: 0.6em;
}

.trix-content li {
  margin-left: 1em;
}

.trix-content [dir=rtl] li {
  margin-right: 1em;
}

.trix-content pre {
  display: inline-block;
  width: 100%;
  vertical-align: top;
  font-family: monospace;
  font-size: 0.9em;
  padding: 0.5em;
  white-space: pre;
  background-color: #eee;
  overflow-x: auto;
}

.trix-content img {
  max-width: 100%;
  height: auto;
}

.trix-content .attachment {
  display: inline-block;
  position: relative;
  max-width: 100%;
}

.trix-content .attachment a {
  color: inherit;
  text-decoration: none;
}

.trix-content .attachment a:hover, .trix-content .attachment a:visited:hover {
  color: inherit;
}

.trix-content .attachment__caption {
  text-align: center;
}

.trix-content .attachment__caption .attachment__name + .attachment__size::before {
  content: " •";
}

.trix-content .attachment--preview {
  width: 100%;
  text-align: center;
}

.trix-content .attachment--preview .attachment__caption {
  color: #666;
  font-size: 0.9em;
  line-height: 1.2;
}

.trix-content .attachment--file {
  color: #333;
  line-height: 1;
  margin: 0 2px 2px 2px;
  padding: 0.4em 1em;
  border: 1px solid #bbb;
  border-radius: 5px;
}

.trix-content .attachment-gallery {
  display: flex;
  flex-wrap: wrap;
  position: relative;
}

.trix-content .attachment-gallery .attachment {
  flex: 1 0 33%;
  padding: 0 0.5em;
  max-width: 33%;
}

.trix-content .attachment-gallery.attachment-gallery--2 .attachment, .trix-content .attachment-gallery.attachment-gallery--4 .attachment {
  flex-basis: 50%;
  max-width: 50%;
}

/*
 * Provides a drop-in pointer for the default Trix stylesheet that will format the toolbar and
 * the trix-editor content (whether displayed or under editing). Feel free to incorporate this
 * inclusion directly in any other asset bundle and remove this file.
 *
 *= require trix
*/
/*
 * We need to override trix.css’s image gallery styles to accommodate the
 * <action-text-attachment> element we wrap around attachments. Otherwise,
 * images in galleries will be squished by the max-width: 33%; rule.
*/
.trix-content > div {
  line-height: 1.75;
}

.trix-content > strong {
  font-weight: 500;
}

.trix-content .attachment-gallery > action-text-attachment,
.trix-content .attachment-gallery > .attachment {
  flex: 1 0 33%;
  padding: 0 0.5em;
  max-width: 33%;
}

.trix-content .attachment-gallery.attachment-gallery--2 > action-text-attachment,
.trix-content .attachment-gallery.attachment-gallery--2 > .attachment, .trix-content .attachment-gallery.attachment-gallery--4 > action-text-attachment,
.trix-content .attachment-gallery.attachment-gallery--4 > .attachment {
  flex-basis: 50%;
  max-width: 50%;
}

.trix-content action-text-attachment .attachment {
  padding: 0 !important;
  max-width: 100% !important;
}

.trix-content a {
  text-decoration: underline;
}