:root{
  --snays-container: 1240px;
  --snays-gutter: 20px;
  --snays-bar-pad: 20px;

  --snays-radius-btn: 5px;
  --snays-radius-md: 5px;
  --snays-radius-lg: 8px;
  --snays-border: 1px;

  --snays-font: "Poppins", system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
  --snays-fs-xxs: 11px;
  --snays-fs-xs: 12px;
  --snays-fs-sm: 13px;
  --snays-fs-base: 14px;
  --snays-fs-md: 15px;
  --snays-fs-lg: 17px;
  --snays-fs-xl: 20px;

  --snays-header-h: 70px;

  --snays-z-header: 50;
  --snays-z-panel: 60;
  --snays-z-mega: 65;
  --snays-z-overlay: 80;
  --snays-z-modal: 90;

  --snays-transition: 180ms cubic-bezier(.2,.7,.2,1);

  --snays-bg: #ffffff;
  --snays-surface: #f6f6f9;
  --snays-surface-2: #ececf2;
  --snays-surface-3: #e2e2ea;
  --snays-text: #0e0e12;
  --snays-text-muted: #6b6b75;
  --snays-text-soft: #8a8a95;
  --snays-border-color: #e5e5ec;
  --snays-border-soft: #efeff4;
  --snays-primary: #D72638;
  --snays-primary-hover: #EF233C;
  --snays-primary-soft: rgba(225,29,72,.10);
  --snays-primary-contrast: #ffffff;
  --snays-accent: #0e0e12;
  --snays-gold: #f5b301;
  --snays-success: #16a34a;
  --snays-danger: #D72638;
  --snays-shadow-sm: 0 2px 8px rgba(14,14,18,.06);
  --snays-shadow-md: 0 8px 24px rgba(14,14,18,.10), 0 2px 6px rgba(14,14,18,.06);
  --snays-shadow-lg: 0 18px 50px rgba(14,14,18,.16), 0 4px 12px rgba(14,14,18,.08);
  --snays-overlay: rgba(14,14,18,.55);
}

[data-theme="dark"]{
  --snays-bg: #0a0a0d;
  --snays-surface: #14141a;
  --snays-surface-2: #1c1c24;
  --snays-surface-3: #26262f;
  --snays-text: #f1f1f4;
  --snays-text-muted: #a0a0ac;
  --snays-text-soft: #74747f;
  --snays-border-color: #25252e;
  --snays-border-soft: #1c1c24;
  --snays-accent: #f1f1f4;
  --snays-shadow-sm: 0 2px 10px rgba(0,0,0,.45);
  --snays-shadow-md: 0 10px 28px rgba(0,0,0,.55), 0 2px 8px rgba(0,0,0,.4);
  --snays-shadow-lg: 0 22px 60px rgba(0,0,0,.65), 0 6px 16px rgba(0,0,0,.45);
  --snays-overlay: rgba(0,0,0,.65);
}

*,
*::before,
*::after{
  box-sizing: border-box;
}

html{
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
  scroll-behavior: smooth;
  overflow-x: hidden;
}

body{
  margin: 0;
  font-family: var(--snays-font);
  font-size: var(--snays-fs-base);
  font-weight: 400;
  line-height: 1.5;
  color: var(--snays-text);
  background-color: var(--snays-bg);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  transition: background-color var(--snays-transition), color var(--snays-transition);
  min-width: 0;
  width: 100%;
}

body.snays-lock{
  overflow: hidden;
}

a{
  color: inherit;
  text-decoration: none;
}

button{
  font-family: inherit;
  font-size: inherit;
  font-weight: inherit;
  color: inherit;
  background: none;
  border: 0;
  cursor: pointer;
  padding: 0;
}

ul,
ol{
  list-style: none;
  margin: 0;
  padding: 0;
}

img,
svg{
  display: block;
  max-width: 100%;
}

input,
textarea,
select{
  font-family: inherit;
  font-size: inherit;
  color: inherit;
}

:focus-visible{
  outline: 2px solid var(--snays-primary);
  outline-offset: 2px;
  border-radius: var(--snays-radius-btn);
}

.snays-container{
  width: 100%;
  max-width: var(--snays-container);
  margin-inline: auto;
  padding-inline: var(--snays-gutter);
}

.snays-sr-only{
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0,0,0,0);
  white-space: nowrap;
  border: 0;
}
