/* Boca Grande Sitters — site-wide styles for the UI kit */
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--fg-1);font-family:var(--font-body);-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
img{display:block}
html,body{overflow-x:hidden;overflow-x:clip}
.bg-container{max-width:1180px;margin:0 auto;padding:0 32px}

/* buttons */
.bg-btn{font-family:var(--font-display);font-weight:600;font-size:16px;border:none;cursor:pointer;
  display:inline-flex;align-items:center;gap:9px;padding:15px 30px;border-radius:var(--radius-pill);
  transition:transform .2s cubic-bezier(.22,1,.36,1),background .2s,box-shadow .2s,border-color .2s,color .2s}
.bg-btn:active{transform:scale(.985)}
.bg-btn--primary{background:var(--periwinkle);color:#fff;box-shadow:var(--shadow-sm)}
.bg-btn--primary:hover{background:#5f6f91;transform:translateY(-1px);box-shadow:var(--shadow-md)}
.bg-btn--secondary{background:#fff;color:var(--navy);border:1.5px solid var(--hairline)}
.bg-btn--secondary:hover{border-color:var(--periwinkle);color:var(--periwinkle)}
.bg-btn--ghost{background:none;color:var(--navy);padding:8px 6px}
.bg-btn--ghost:hover{color:var(--periwinkle)}
.bg-btn--lg{font-size:17px;padding:17px 36px}
.bg-btn--oncolor{background:#fff;color:var(--navy)}
.bg-btn--oncolor:hover{background:var(--shell);transform:translateY(-1px)}

/* prominent "Book a sitter" CTA */
.bg-btn--book{font-size:18px;padding:19px 40px;box-shadow:0 16px 34px -12px rgba(117,132,164,.7)}
.bg-btn--book.bg-btn--xl{font-size:20px;padding:22px 48px}
.bg-btn--book svg{transition:transform .25s cubic-bezier(.22,1,.36,1)}
.bg-btn--book:hover svg.bgs-arrow{transform:translateX(4px) translateY(-4px)}
@keyframes bgsBookPulse{0%,100%{box-shadow:0 16px 34px -12px rgba(117,132,164,.7)}50%{box-shadow:0 18px 44px -10px rgba(117,132,164,.95)}}
.bgs-book-pulse{animation:bgsBookPulse 2.6s ease-in-out infinite}
@media (prefers-reduced-motion:reduce){.bgs-book-pulse{animation:none}}

.bg-eyebrow{font-family:var(--font-display);font-weight:600;font-size:13px;letter-spacing:.18em;
  text-transform:uppercase;color:var(--periwinkle);margin:0}
.bg-section{padding:104px 0}
.bg-section--tight{padding:72px 0}

/* reveal on scroll */
.reveal{opacity:0;transform:translateY(22px);transition:opacity .7s ease,transform .7s cubic-bezier(.22,1,.36,1)}
.reveal.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none;transition:none}}

@media(max-width:760px){
  .bg-container{padding:0 22px}
  .bg-section{padding:68px 0}
  .bg-section--tight{padding:52px 0}
  .bg-btn--book.bg-btn--xl{font-size:18px;padding:18px 30px}
}