/* === Global === */

/* :root, html, body, #main */

html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
  -webkit-tap-highlight-color: transparent;
  font-family: ui-sans-serif, system-ui, sans-serif, Apple Color Emoji,
    Segoe UI Emoji, Segoe UI Symbol, Noto Color Emoji;
}

html,
:root {
  font-size: 10px !important;
  margin-top: 0 !important;
}

body {
  -webkit-font-smoothing: antialiased;
}

.is-loading main[data-framer-name="Main"] {
  visibility: hidden;
}

.framer-done main[data-framer-name="Main"] {
  visibility: inherit;
}

/* Links */

a {
  color: inherit;
  text-decoration: inherit;
  outline: none;
}

/* SVG */

svg {
  overflow: visible !important;
  overflow-clip-margin: 0.2rem !important;
}

/* GSAP */

.gsap-marker-start,
.gsap-marker-end,
.gsap-marker-scroller-start,
.gsap-marker-scroller-end {
  z-index: 999999 !important;
  pointer-events: none !important;
}

/* === Buttons & Form Elements === */

button {
  all: unset;
  box-sizing: border-box;
}

button,
select {
  text-transform: none;
}

[type="button"],
[type="reset"],
[type="submit"],
button {
  -webkit-appearance: button;
  background-color: transparent;
  background-image: none;
}

/* === Sizing === */

/* Fit content */

#main [data-framer-name*="w-fit"] {
  width: fit-content;
}

#main [data-framer-name*="h-fit"] {
  height: fit-content;
}

/* Min content */

#main [data-framer-name*="w-min"] {
  width: min-content;
}

#main [data-framer-name*="h-min"] {
  height: min-content;
}

/* === Padding === */

/* Padding Top */

#main [data-framer-name*="pt-xs"] {
  padding-top: var(--xs);
}

#main [data-framer-name*="pt-sm"] {
  padding-top: var(--sm);
}

#main [data-framer-name*="pt-md"] {
  padding-top: var(--md);
}

#main [data-framer-name*="pt-lg"] {
  padding-top: var(--lg);
}

#main [data-framer-name*="pt-xl"] {
  padding-top: var(--xl);
}

#main [data-framer-name*="pt-2xl"] {
  padding-top: var(--2xl);
}

#main [data-framer-name*="pt-3xl"] {
  padding-top: var(--3xl);
}

#main [data-framer-name*="pt-4xl"] {
  padding-top: var(--4xl);
}

/* Padding Right */

#main [data-framer-name*="pr-xs"] {
  padding-right: var(--xs);
}

#main [data-framer-name*="pr-sm"] {
  padding-right: var(--sm);
}

#main [data-framer-name*="pr-md"] {
  padding-right: var(--md);
}

#main [data-framer-name*="pr-lg"] {
  padding-right: var(--lg);
}

#main [data-framer-name*="pr-xl"] {
  padding-right: var(--xl);
}

#main [data-framer-name*="pr-2xl"] {
  padding-right: var(--2xl);
}

#main [data-framer-name*="pr-3xl"] {
  padding-right: var(--3xl);
}

#main [data-framer-name*="pr-4xl"] {
  padding-right: var(--4xl);
}

/* Padding Bottom */

#main [data-framer-name*="pb-xs"] {
  padding-bottom: var(--xs);
}

#main [data-framer-name*="pb-sm"] {
  padding-bottom: var(--sm);
}

#main [data-framer-name*="pb-md"] {
  padding-bottom: var(--md);
}

#main [data-framer-name*="pb-lg"] {
  padding-bottom: var(--lg);
}

#main [data-framer-name*="pb-xl"] {
  padding-bottom: var(--xl);
}

#main [data-framer-name*="pb-2xl"] {
  padding-bottom: var(--2xl);
}

#main [data-framer-name*="pb-3xl"] {
  padding-bottom: var(--3xl);
}

#main [data-framer-name*="pb-4xl"] {
  padding-bottom: var(--4xl);
}

/* Padding Left */

#main [data-framer-name*="pl-xs"] {
  padding-left: var(--xs);
}

#main [data-framer-name*="pl-sm"] {
  padding-left: var(--sm);
}

#main [data-framer-name*="pl-md"] {
  padding-left: var(--md);
}

#main [data-framer-name*="pl-lg"] {
  padding-left: var(--lg);
}

#main [data-framer-name*="pl-xl"] {
  padding-left: var(--xl);
}

#main [data-framer-name*="pl-2xl"] {
  padding-left: var(--2xl);
}

#main [data-framer-name*="pl-3xl"] {
  padding-left: var(--3xl);
}

#main [data-framer-name*="pl-4xl"] {
  padding-left: var(--4xl);
}

/* Padding X */

#main [data-framer-name*="px-xs"] {
  padding-left: var(--xs);
  padding-right: var(--xs);
}

#main [data-framer-name*="px-sm"] {
  padding-left: var(--sm);
  padding-right: var(--sm);
}

#main [data-framer-name*="px-md"] {
  padding-left: var(--md);
  padding-right: var(--md);
}

#main [data-framer-name*="px-lg"] {
  padding-left: var(--lg);
  padding-right: var(--lg);
}

#main [data-framer-name*="px-xl"] {
  padding-left: var(--xl);
  padding-right: var(--xl);
}

#main [data-framer-name*="px-2xl"] {
  padding-left: var(--2xl);
  padding-right: var(--2xl);
}

#main [data-framer-name*="px-3xl"] {
  padding-left: var(--3xl);
  padding-right: var(--3xl);
}

#main [data-framer-name*="px-4xl"] {
  padding-left: var(--4xl);
  padding-right: var(--4xl);
}

/* Padding Y */

#main [data-framer-name*="py-xs"] {
  padding-top: var(--xs);
  padding-bottom: var(--xs);
}

#main [data-framer-name*="py-sm"] {
  padding-top: var(--sm);
  padding-bottom: var(--sm);
}

#main [data-framer-name*="py-md"] {
  padding-top: var(--md);
  padding-bottom: var(--md);
}

#main [data-framer-name*="py-lg"] {
  padding-top: var(--lg);
  padding-bottom: var(--lg);
}

#main [data-framer-name*="py-xl"] {
  padding-top: var(--xl);
  padding-bottom: var(--xl);
}

#main [data-framer-name*="py-2xl"] {
  padding-top: var(--2xl);
  padding-bottom: var(--2xl);
}

#main [data-framer-name*="py-3xl"] {
  padding-top: var(--3xl);
  padding-bottom: var(--3xl);
}

#main [data-framer-name*="py-4xl"] {
  padding-top: var(--4xl);
  padding-bottom: var(--4xl);
}

/* === Inset === */

/* Top */

#main [data-framer-name*="top-sm"] {
  top: var(--sm);
}

#main [data-framer-name*="top-md"] {
  top: var(--md);
}

#main [data-framer-name*="top-lg"] {
  top: var(--lg);
}

/* Right */

#main [data-framer-name*="right-sm"] {
  right: var(--sm);
}

#main [data-framer-name*="right-md"] {
  right: var(--md);
}

#main [data-framer-name*="right-lg"] {
  right: var(--lg);
}

/* Bottom */

#main [data-framer-name*="bottom-sm"] {
  bottom: var(--sm);
}

#main [data-framer-name*="bottom-md"] {
  bottom: var(--md);
}

#main [data-framer-name*="bottom-lg"] {
  bottom: var(--lg);
}

/* Left */

#main [data-framer-name*="left-sm"] {
  left: var(--sm);
}

#main [data-framer-name*="left-md"] {
  left: var(--md);
}

#main [data-framer-name*="left-lg"] {
  left: var(--lg);
}

/* === Gap === */

/* Gap X & Y */

#main [data-framer-name*="gap-xs"] {
  gap: var(--xs);
}

#main [data-framer-name*="gap-sm"] {
  gap: var(--sm);
}

#main [data-framer-name*="gap-md"] {
  gap: var(--md);
}

#main [data-framer-name*="gap-lg"] {
  gap: var(--lg);
}

#main [data-framer-name*="gap-xl"] {
  gap: var(--xl);
}

#main [data-framer-name*="gap-2xl"] {
  gap: var(--2xl);
}

#main [data-framer-name*="gap-3xl"] {
  gap: var(--3xl);
}

#main [data-framer-name*="gap-4xl"] {
  gap: var(--4xl);
}

/* Gap X */

#main [data-framer-name*="gap-x-xs"] {
  column-gap: var(--xs);
}

#main [data-framer-name*="gap-x-sm"] {
  column-gap: var(--sm);
}

#main [data-framer-name*="gap-x-md"] {
  column-gap: var(--md);
}

#main [data-framer-name*="gap-x-lg"] {
  column-gap: var(--lg);
}

#main [data-framer-name*="gap-x-xl"] {
  column-gap: var(--xl);
}

#main [data-framer-name*="gap-x-2xl"] {
  column-gap: var(--2xl);
}

#main [data-framer-name*="gap-x-3xl"] {
  column-gap: var(--3xl);
}

#main [data-framer-name*="gap-x-4xl"] {
  column-gap: var(--4xl);
}

/* Gap Y */

#main [data-framer-name*="gap-y-xs"] {
  row-gap: var(--xs);
}

#main [data-framer-name*="gap-y-sm"] {
  row-gap: var(--sm);
}

#main [data-framer-name*="gap-y-md"] {
  row-gap: var(--md);
}

#main [data-framer-name*="gap-y-lg"] {
  row-gap: var(--lg);
}

#main [data-framer-name*="gap-y-xl"] {
  row-gap: var(--xl);
}

#main [data-framer-name*="gap-y-2xl"] {
  row-gap: var(--2xl);
}

#main [data-framer-name*="gap-y-3xl"] {
  row-gap: var(--3xl);
}

#main [data-framer-name*="gap-y-4xl"] {
  row-gap: var(--4xl);
}

/* === Border Radius === */

#main [data-framer-name*="rounded-xs"] {
  border-radius: var(--xs) !important;
}

#main [data-framer-name*="rounded-top-xs"] {
  border-top-left-radius: var(--xs) !important;
  border-top-right-radius: var(--xs) !important;
}

#main [data-framer-name*="rounded-bottom-xs"] {
  border-bottom-left-radius: var(--xs) !important;
  border-bottom-right-radius: var(--xs) !important;
}

#main [data-framer-name*="rounded-sm"] {
  border-radius: var(--sm) !important;
}

#main [data-framer-name*="rounded-sm-top"] {
  border-top-left-radius: var(--sm) !important;
  border-top-right-radius: var(--sm) !important;
  border-bottom-left-radius: 0 !important;
  border-bottom-right-radius: 0 !important;
}

#main [data-framer-name*="rounded-sm-bottom"] {
  border-top-left-radius: 0 !important;
  border-top-right-radius: 0 !important;
  border-bottom-left-radius: var(--sm) !important;
  border-bottom-right-radius: var(--sm) !important;
}

/* === Media queries === */

/* From 1440px onwards*/
@media (min-width: 1440px) {
  html,
  :root {
    font-size: 0.6944444444444444vw !important;
  }
}
