/* ===== Incredible Luxury Holidays — Brand foundation ===== */
:root {
  --midnight:     #060E1A;
  --deep-navy:    #0D1A2E;
  --gold:         #C19B48;
  --gold-light:   #E8C97A;
  --ivory:        #FAF6EE;
  --linen:        #F2EDE3;
  --gold-shadow:  #2A2015;

  --gold-border:  rgba(193, 155, 72, 0.20);
  --gold-line:    rgba(193, 155, 72, 0.12);
  --gold-subtle:  rgba(193, 155, 72, 0.08);
  --text-primary: #FAF6EE;
  --text-muted:   rgba(250, 246, 238, 0.45);
  --text-dim:     rgba(250, 246, 238, 0.25);

  --max-width:    1320px;
  --nav-height:   72px;
  --hero-wash-rgb: 6,14,26;   /* hero image fade — matches dark page bg by default */

  /* corner radii — soft, modern */
  --r-card:   16px;
  --r-panel:  20px;
  --r-img:    12px;
  --r-chip:   8px;
  --r-input:  10px;
}

* { box-sizing: border-box; }

/* ---- Type ---- */
.eyebrow {
  font-family: 'Montserrat', sans-serif;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0.34em;
  text-transform: uppercase;
  color: var(--gold);
  margin: 0 0 14px;
}
.serif { font-family: 'Cormorant Garamond', serif; }
.sans  { font-family: 'Montserrat', sans-serif; }

.section-title {
  font-family: 'Cormorant Garamond', serif;
  font-weight: 300;
  color: var(--ivory);
  letter-spacing: 0.01em;
  line-height: 1.05;
  margin: 0;
}
.gold-em { color: var(--gold); font-style: italic; }
.section-rule {
  width: 36px; height: 1px;
  background: var(--gold);
  margin: 18px 0 0;
  border: none;
}

/* ---- Buttons ---- */
.btn-gold, .btn-ghost {
  font-family: 'Montserrat', sans-serif;
  font-size: 9.5px;
  font-weight: 700;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  transition: background .35s ease, color .35s ease, border-color .35s ease, transform .35s cubic-bezier(.2,.8,.2,1);
  border-radius: var(--r-chip);
}
.btn-gold {
  background: var(--gold);
  color: var(--midnight);
  border: 1px solid var(--gold);
  padding: 15px 32px;
}
.btn-gold:hover { background: var(--gold-light); border-color: var(--gold-light); transform: translateY(-2px); }
.btn-ghost {
  background: transparent;
  color: var(--gold);
  border: 1px solid rgba(193,155,72,0.5);
  padding: 14px 32px;
}
.btn-ghost:hover { background: var(--gold); color: var(--midnight); transform: translateY(-2px); }

/* ---- Hairline grid placeholder ---- */
.ph {
  position: relative;
  background:
    repeating-linear-gradient(135deg, transparent, transparent 9px, rgba(193,155,72,0.05) 9px, rgba(193,155,72,0.05) 10px),
    var(--deep-navy);
  overflow: hidden;
}
.ph-label {
  position: absolute;
  bottom: 12px; left: 14px;
  font-family: 'Montserrat', monospace;
  font-size: 8px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: rgba(250,246,238,0.35);
}
.ph::before {
  content: '';
  position: absolute; inset: 0;
  border: 1px solid rgba(193,155,72,0.10);
  pointer-events: none;
}

/* diagonal hero texture */
.hero-texture {
  background: repeating-linear-gradient(-45deg, transparent, transparent 28px, rgba(193,155,72,0.035) 28px, rgba(193,155,72,0.035) 29px);
}

/* btn radius handled in button base */