/* ============================================================
   FORESTIA PARK — Landing Page
   Design system: navy #083B36 / paper #FCFCFC / champagne gold
   Type: Playfair Display (display) + Be Vietnam Pro (UI/body)
   ============================================================ */

:root{
  --navy:        #083B36;
  --navy-700:    #0F4A45;
  --navy-900:    #04231F;
  --navy-ink:    #0A2621;
  --paper:       #FCFCFC;
  --paper-2:     #F4F1EA;   /* warm rest section */
  --paper-3:     #EEEAE0;
  --line:        rgba(8,59,54,.12);
  --line-soft:   rgba(8,59,54,.08);

  --gold:        #BE967D;
  --gold-deep:   #9E7C44;
  --gold-soft:   #E4D2A8;
  --gold-grad:   linear-gradient(135deg,#E4D2A8 0%,#BE967D 45%,#9E7C44 100%);

  --ink:         #15212e;
  --ink-soft:    #43546a;
  --on-navy:     #F2EEE6;
  --on-navy-soft:#C2D2CC;

  --ff-display: "Lora", Georgia, serif;
  --ff-body:    "Be Vietnam Pro", system-ui, sans-serif;

  --maxw: 1240px;
  --gut: clamp(20px, 5vw, 64px);
  --r-lg: 22px;
  --r-md: 14px;
  --r-sm: 9px;

  --shadow-card: 0 24px 60px -28px rgba(6,40,36,.45);
  --shadow-soft: 0 14px 40px -22px rgba(6,40,36,.40);
  --ease: cubic-bezier(.22,.61,.36,1);
}

*{ box-sizing:border-box; }
html{ scroll-behavior:smooth; -webkit-text-size-adjust:100%; }
body{
  margin:0;
  font-family:var(--ff-body);
  color:var(--ink);
  background:var(--paper);
  font-size:17px;
  line-height:1.65;
  font-weight:400;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img{ display:block; max-width:100%; }
a{ color:inherit; text-decoration:none; }
button{ font-family:inherit; cursor:pointer; }

/* ---------- typography ---------- */
.display{ font-family:var(--ff-display); font-weight:600; line-height:1.06; letter-spacing:-.01em; }
h1,h2,h3{ margin:0; }

.eyebrow{
  font-size:13px; font-weight:600; letter-spacing:.32em; text-transform:uppercase;
  color:var(--gold-deep); display:inline-flex; align-items:center; gap:.7em;
}
.eyebrow::before{ content:""; width:30px; height:1px; background:var(--gold); display:inline-block; }
.eyebrow.center::after{ content:""; width:30px; height:1px; background:var(--gold); display:inline-block; }
.eyebrow.on-dark{ color:var(--gold-soft); }
.eyebrow.on-dark::before,.eyebrow.on-dark.center::after{ background:var(--gold-soft); }

.h-sec{ font-family:var(--ff-display); font-weight:600; font-size:clamp(2rem,4.6vw,3.5rem); line-height:1.08; letter-spacing:-.015em; }
.lead{ font-size:clamp(1.02rem,1.5vw,1.18rem); color:var(--ink-soft); line-height:1.75; }
.serif-accent{ font-family:var(--ff-display); font-style:italic; color:var(--gold-deep); font-weight:500; }

/* ---------- layout ---------- */
.section{ padding:clamp(64px,9vw,128px) var(--gut); position:relative; }
.wrap{ max-width:var(--maxw); margin-inline:auto; }
.wrap-wide{ max-width:1480px; margin-inline:auto; }
.center{ text-align:center; }
.sec-head{ max-width:780px; }
.sec-head.center{ margin-inline:auto; }
.sec-head .h-sec{ margin-top:18px; }
.sec-head .lead{ margin-top:20px; }

.bg-navy{ background:var(--navy); color:var(--on-navy); }
.bg-paper2{ background:var(--paper-2); }

/* ---------- buttons ---------- */
.btn{
  display:inline-flex; align-items:center; gap:.6em; justify-content:center;
  font-weight:600; font-size:15px; letter-spacing:.01em;
  padding:16px 30px; border-radius:999px; border:1px solid transparent;
  transition:transform .35s var(--ease), box-shadow .35s var(--ease), background .3s, color .3s, border-color .3s;
  white-space:nowrap; line-height:1;
}
.btn svg{ width:17px; height:17px; flex:none; }
.btn-gold{ background:var(--gold-grad); color:#2a1e07; box-shadow:0 14px 30px -12px rgba(158,124,60,.65); }
.btn-gold:hover{ transform:translateY(-3px); box-shadow:0 20px 40px -12px rgba(158,124,60,.8); }
.btn-navy{ background:var(--navy); color:#fff; }
.btn-navy:hover{ transform:translateY(-3px); background:var(--navy-700); box-shadow:var(--shadow-soft); }
.btn-ghost{ background:transparent; color:var(--navy); border-color:var(--line); }
.btn-ghost:hover{ border-color:var(--gold); color:var(--gold-deep); transform:translateY(-2px); }
.btn-ghost.on-dark{ color:var(--on-navy); border-color:rgba(255,255,255,.28); }
.btn-ghost.on-dark:hover{ border-color:var(--gold-soft); color:#fff; }
.btn-lg{ padding:19px 38px; font-size:16px; }
.btn-block{ width:100%; }

/* ---------- nav ---------- */
.nav{
  position:fixed; inset:0 0 auto 0; z-index:60;
  display:flex; align-items:center; justify-content:space-between;
  padding:18px var(--gut);
  transition:background .4s var(--ease), padding .4s var(--ease), box-shadow .4s, border-color .4s;
  border-bottom:1px solid transparent;
}
.nav.scrolled{
  background:rgba(252,252,252,.92);
  backdrop-filter:saturate(140%) blur(14px);
  padding-top:12px; padding-bottom:12px;
  border-bottom-color:var(--line-soft);
  box-shadow:0 10px 30px -24px rgba(6,40,36,.6);
}
.brand{ display:flex; align-items:center; gap:13px; color:#fff; transition:color .4s; }
.brand-logo{ height:46px; width:auto; display:block; }
.nav.scrolled .brand{ color:var(--navy); }
.brand .mark{ width:42px; height:42px; flex:none; }
.brand .bname{ font-family:var(--ff-display); font-weight:600; font-size:22px; letter-spacing:.03em; line-height:1; white-space:nowrap; }
.brand .btag{ display:block; font-family:var(--ff-body); font-size:9.5px; font-weight:600; letter-spacing:.42em; text-transform:uppercase; color:var(--gold-soft); margin-top:5px; }
.nav.scrolled .brand .btag{ color:var(--gold-deep); }

.nav-links{ display:flex; align-items:center; gap:34px; }
.nav-links a{ font-size:14.5px; font-weight:500; color:rgba(255,255,255,.86); letter-spacing:.01em; position:relative; transition:color .3s; }
.nav.scrolled .nav-links a{ color:var(--ink-soft); }
.nav-links a::after{ content:""; position:absolute; left:0; bottom:-6px; width:0; height:1.5px; background:var(--gold); transition:width .35s var(--ease); }
.nav-links a:hover{ color:var(--gold-soft); }
.nav.scrolled .nav-links a:hover{ color:var(--navy); }
.nav-links a:hover::after{ width:100%; }
.nav-cta{ display:flex; align-items:center; gap:16px; }
.nav-phone{ display:flex; align-items:center; gap:8px; font-weight:600; font-size:14.5px; color:#fff; }
.nav.scrolled .nav-phone{ color:var(--navy); }
.nav-phone svg{ width:16px; height:16px; color:var(--gold); }
.nav-burger{ display:none; }

@media (max-width:1024px){
  .nav-links{ display:none; }
  .nav-phone span{ display:none; }
}

/* promo timer strip */
.promo-strip{max-width:600px;margin:28px auto;padding:14px 22px;display:flex;align-items:center;justify-content:center;gap:12px;flex-wrap:wrap;text-align:center;background:var(--navy);color:#fff;border:1px solid var(--gold);border-radius:14px;font-weight:700;font-size:18px}
.promo-strip .promo-logo{height:34px;width:auto}
.promo-strip #mg-time{font-variant-numeric:tabular-nums;font-size:20px;color:var(--gold-soft)}
.promo-strip .key{display:none;color:var(--gold-soft);letter-spacing:.08em}
