@font-face {
  font-family: 'Cinema Sunday';
  src: url('/fonts/cinema-sunday.woff2') format('woff2'),
       url('/fonts/cinema-sunday.woff') format('woff'),
       url('/fonts/cinema-sunday.ttf') format('truetype'),
       url('/fonts/cinema-sunday.otf') format('opentype');
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}


/* =============================================================
   Rocky Mountain District — Homepage Styles
   ============================================================= */

@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,400;0,600;1,400;1,600&family=Jost:wght@300;400;500&display=swap');

:root {
  --sage:        #75a096;
  --terracotta:  #CE6144;
  --gold:        #d1b76b;
  --beige:       #d2c198;
  --white:       #ffffff;
  --dark:        #000000;  

  --cream:       #F5F0E8;
  --grey:        #6C6C6C;
  --grey-mid:    #F2F2F2;
  --dark:        #000000;

  --sage-dark:   #4a6659;
  --terracotta-dark: #a8503b;

  --font-display: 'Cinema Sunday', Georgia, serif;
  --font-subheading: 'Helvetica Neue', Helvetica, Arial, sans-serif;
  --font-body: 'Helvetica Neue', Helvetica, Arial, sans-serif;

  --column-width: 960px;
  --outside-column-width: 1200px;

  --interior-column-width: 1280px;
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

body {
  font-family: var(--font-body);
  color: var(--dark);
  background: var(--white);
}

h1, h2, h3 {
  font-family: var(--font-display);
}

h4, h5, h6, p, a, li, span, button, input {
  font-family: var(--font-body);
}

img { display: block; max-width: 100%; }
/* a { text-decoration: none; color: inherit; } */

/* =============================================================
   BUTTONS
   ============================================================= */

.btn, .fui-btn, .fui-submit{
  display: inline-block;
  font-family: var(--font-body);
  font-size: 0.75rem;
  font-weight: 500;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  padding: 0.65rem 1.4rem;
  border: 1.5px solid transparent;
  cursor: pointer;
  transition: background 0.2s, color 0.2s, border-color 0.2s;
  text-decoration: none;
  margin-top: 20px;
}

.btn--primary, .fui-btn, .fui-form-container .fui-submit {
  background: var(--terracotta);
  color: var(--white);
  border-color: var(--terracotta);
}
.btn--primary:hover {
  background: var(--terracotta-dark);
  border-color: var(--terracotta-dark);
}

.btn--secondary {
  background: var(--sage);
  color: var(--white);
  border-color: var(--sage);
}
.btn--secondary:hover {
  background: var(--sage-dark);
  border-color: var(--sage-dark);
}

.btn--outline {
  background: transparent;
  color: var(--white);
  border-color: var(--white);
}
.btn--outline:hover {
  background: rgba(255,255,255,0.15);
}

.btn--outline-dark {
  background: transparent;
  color: var(--terracotta);
  border-color: var(--terracotta);
}
.btn--outline-dark:hover {
  background: var(--terracotta);
  color: var(--white);
}

.btn--ghost {
  background: transparent;
  color: var(--white);
  border-color: var(--white);
  font-size: 0.7rem;
}
.btn--ghost:hover {
  background: rgba(255,255,255,0.15);
}

.btn--outline-light {
  background: transparent;
  color: var(--white);
  border-color: var(--white);
}
.btn--outline-light:hover {
  background: rgba(255,255,255,0.2);
}

.animate-in {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 0.6s ease, transform 0.6s ease;
}

.animate-in-second {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 0.8s ease, transform 0.8s ease;
}

.animate-in.is-visible {
  opacity: 1;
  transform: translateY(0);
}

.animate-in-second.is-visible {
  opacity: 1;
  transform: translateY(0);
}

.animate-from-top {
  opacity: 0;
  transform: translateY(-20px);
  transition: opacity 0.6s ease, transform 0.6s ease;
}

.animate-from-top.is-visible {
  opacity: 1;
  transform: translateY(0);
}

.animate-in:nth-child(2) { transition-delay: 0.2s; }
.animate-in-second { transition-delay: 0.4s; }
.animate-from-top { transition-delay: 0.4s; }