/* The Olive Tree House — shared site styles
   One copy of the design system, referenced by every page,
   instead of being duplicated inline in each screen. */

:root{
  --warm-white:#FAF8F3;
  --off-black:#292A27;
  --charcoal:#292A27;
  --olive:#949A63;
  --deep-olive:#626842;
  --pale-olive:#E9EAD9;
  --soft-stone:#E8E4DA;
  --muted:#6e6c62;
}

html, body{ color-scheme: light; min-height: 100dvh; }
*{ box-sizing: border-box; }

body{
  margin: 0;
  background: var(--warm-white);
  color: var(--off-black);
  font-family: 'Inter', sans-serif;
  -webkit-font-smoothing: antialiased;
}

h1, h2, h3{
  font-family: 'Cormorant Garamond', serif;
  font-weight: 500;
  color: var(--off-black);
  margin: 0;
}

p{ margin: 0 0 16px; font-size: 15px; line-height: 1.65; color: var(--charcoal); }
a{ color: inherit; }

/* Shared header, used on every screen */
header{
  position: sticky; top: 0; z-index: 10;
  display: flex; align-items: center; justify-content: space-between;
  padding: 16px 22px;
  background: rgba(248,245,238,0.94);
  backdrop-filter: blur(6px);
  border-bottom: 1px solid var(--soft-stone);
}
header img.logo-small{ height: 44px; width: auto; display: block; }
.close-x{
  font-size: 24px; line-height: 1; color: var(--off-black);
  text-decoration: none; padding: 4px 8px;
}

main{ max-width: 520px; margin: 0 auto; padding: 28px 22px 10px; }

/* Shared footer branch ornament, used on every screen */
.branch-img{
  width: 190px; aspect-ratio: 732/259;
  background-image: url('branch.png');
  background-size: contain; background-repeat: no-repeat; background-position: center;
  margin: 0 auto 10px;
}
footer{ margin-top: 44px; padding: 28px 22px 40px; text-align: center; }
footer p{ font-size: 12px; color: var(--deep-olive); margin: 0; }

/* Shared footer policy links, used on every non-overlay screen */
.footer-links{
  display: flex; flex-wrap: wrap; justify-content: center;
  margin: 0 0 14px; padding: 0;
}
.footer-links a{
  font-size: 12px; color: var(--deep-olive); text-decoration: none;
}
.footer-links a:hover{ text-decoration: underline; }
.footer-links a:not(:last-child)::after{
  content: "·"; margin: 0 10px; color: var(--soft-stone);
}

/* Shared primary CTA button (the actual olive/uppercase site button) */
.btn-primary{
  display: inline-block;
  background: var(--olive); color: var(--warm-white);
  text-decoration: none; border-radius: 3px;
  font-family: 'Inter', sans-serif; font-size: 12.5px; font-weight: 600;
  letter-spacing: 0.06em; text-transform: uppercase;
  padding: 13px 22px;
}

/* Shared section divider ornament */
.divider{ display: flex; justify-content: center; margin: 30px 0; }
.divider .branch-img{ margin: 0 auto; }