@font-face {
  font-family: 'AgavalancheC';
  src: url('../fonts/AgavalancheC-Regular.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'AgavalancheC';
  src: url('../fonts/AgavalancheC-Bold.woff2') format('woff2');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'AgavalancheC';
  src: url('../fonts/AgavalancheC-RegularItalic.woff2') format('woff2');
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: 'AgavalancheC';
  src: url('../fonts/AgavalancheC-BoldItalic.woff2') format('woff2');
  font-weight: 700;
  font-style: italic;
  font-display: swap;
}

@import url("https://fonts.googleapis.com/css2?family=Nunito:ital,wght@0,700;0,800;0,900;1,700;1,800&display=swap");

:root {

  --color-primary:        #FFE4ED;
  --color-secondary:      #E5307A;
  --color-text-primary:   #2B4B3D;
  --color-text-secondary: #333333;
  --color-text-muted:     #69727D;
  --color-green-dark:     #2B4B3D;
  --color-green-med:      #3C6E57;
  --color-orange:         #FEA55B;
  --color-beige:          #F9EDE6;
  --color-bg:             #FAF9F5;
  --color-white:          #FFFFFF;
  --color-grey-light:     #CDD2D0;
  --color-grey-pale:      #F8F8F8;
  --color-grey-warm:      #F4F4F4;
  --color-link:           #1863DC;
  --color-surface:        #F0ECE8;
  --color-surfaceLight:   #FFF6F8;

  --font-primary: 'AgavalancheC', 'Nunito', sans-serif;
  --font-heading: var(--font-primary);
  --font-body:    var(--font-primary);
  --font-system:  -apple-system, "system-ui", "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;

  --color-footer:           #FFC9D9;
  --color-border-subtle:    #EBEBEB;
  --color-strike:           #C8C8C8;
  --color-peach:            #FFD2AD;

  --font-size-display-xxl:  100px;
  --font-size-display-lg:   80px;
  --font-size-display-xl:   85px;
  --font-size-display-md:   76px;
  --font-size-display:      74px;
  --font-size-hero-exact:   57px;
  --font-size-hero:         58px;
  --font-size-heading:      55px;
  --font-size-heading-md: 42px;
  --font-size-body-lg:    20px;
  --font-size-body:       18px;
  --font-size-body-sm:    16px;
  --font-size-caption:    15px;

  --font-weight-regular: 400;
  --font-weight-medium:  500;
  --font-weight-bold:    700;

  --radius-pill:   100px;
  --radius-card:   30px;
  --radius-hero:   20px;
  --radius-block:  50px;
  --radius-header: 80px;
  --radius-sm:     20px;

  --shadow-button: 0px 4px 18px 4px rgba(0, 0, 0, 0.25);

  --container-max:     1440px;
  --container-padding: 16px;
  --gap-default:       20px;

  --rhythm-scale:      1;
  --section-gap:       calc(60px * var(--rhythm-scale));

  --transition-fast:   0.1s ease;
  --transition-base:   0.3s ease;
  --transition-slow:   0.4s ease;
  --transition-button: background 0.3s, border 0.3s, box-shadow 0.3s, transform 0.4s;
  --transition-card:   background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s, transform 0.4s;
}

@media (max-width: 900px) {
  :root {
    --rhythm-scale: 0.8;
  }
}

@media (max-width: 767px) {
  :root {
    --font-size-body-lg:    17px;
    --font-size-body:       16px;
    --font-size-body-sm:    14px;
    --font-size-caption:    13px;
    --radius-card:          20px;
    --radius-hero:          14px;
    --gap-default:          14px;
    --rhythm-scale:         0.6;
  }
}