/* =========================================================
   BASE — resets, global typography, shared utility classes.
   These classes (.container, .btn, .eyebrow, .section, .star-row,
   .reveal) are used by multiple section files, so keep them here
   rather than duplicating in each section's own CSS file.
   ========================================================= */
*{box-sizing:border-box; margin:0; padding:0;}
html{scroll-behavior:smooth;}
body{
  font-family:var(--font-body);
  background:var(--cream);
  color:var(--ink);
  overflow-x:hidden;
}
h1,h2,h3, .display{
  font-family:var(--font-display);
  font-weight:600;
  line-height:1.05;
}
a{color:inherit; text-decoration:none;}
img{display:block; max-width:100%;}
::selection{background:var(--gold); color:var(--primary-dark);}

.container{max-width:1180px; margin:0 auto; padding:0 32px;}

/* generic section spacing + heading block, reused by every section */
.section{padding:110px 0;}
.section-head{max-width:620px; margin:0 auto 64px; text-align:center;}
.section-head .eyebrow{justify-content:center; color:var(--primary-mid);}
.section-head .eyebrow::before{background:var(--gold);}
.section-head h2{font-size:clamp(32px,4vw,46px); color:var(--primary-dark);}
.section-head p{margin-top:16px; font-size:16.5px; color:#5b6660; line-height:1.6;}
.on-dark .section-head h2{color:var(--cream);}
.on-dark .section-head p{color:rgba(246,241,228,0.72);}

.eyebrow{
  display:inline-flex; align-items:center; gap:10px;
  font-size:13px; letter-spacing:2.2px; text-transform:uppercase;
  color:var(--gold-light); font-weight:700; margin-bottom:22px;
}
.eyebrow::before{content:''; width:26px; height:1px; background:var(--gold);}

/* buttons — reused in hero, download, anywhere a CTA is needed */
.btn{
  display:inline-flex; align-items:center; gap:10px;
  padding:15px 28px; border-radius:10px; font-weight:700; font-size:15px;
  border:1px solid transparent; transition:transform .2s, box-shadow .2s;
}
.btn:hover{transform:translateY(-2px);}
.btn-gold{background:var(--gold); color:var(--primary-dark); box-shadow:0 10px 30px -8px rgba(201,161,91,0.55);}
.btn-ghost{border-color:rgba(246,241,228,0.35); color:var(--cream);}

/* decorative star divider — used between sections, see sections/divider.html */
.star-row{display:flex; justify-content:center; gap:28px; padding:6px 0; opacity:0.55; background:var(--cream); color:var(--gold);}
.star-row svg{width:16px; height:16px;}

/* scroll reveal animation target, activated by assets/js/main.js */
.reveal{opacity:0; transform:translateY(18px); transition:opacity .7s ease, transform .7s ease;}
.reveal.in{opacity:1; transform:translateY(0);}