/* ============================================================
   OneSig - August Style Guide
   Single source of truth for all site styling.
   Palette + type sampled from marriott.com (Aug 2026).
   Edit here; every page inherits.
   ============================================================ */

:root{
  /* --- core --- */
  --ink:      #1C1C1C;   /* body text, dark bands, primary buttons */
  --muted:    #707070;   /* secondary text */
  --canvas:   #F4F4F4;   /* page background */
  --surface:  #FFFFFF;   /* cards, white bands */
  --line:     #E2E2E2;   /* hairline borders, dividers */

  /* --- accent --- */
  --orange:   #B84C16;   /* text-safe accent: eyebrows, accent words, icons */
  --coral:    #FF8D6B;   /* decorative only: underlines, highlights. NOT for text */

  /* --- legacy aliases (kept so old markup keeps resolving) --- */
  --navy:#0B2E4F; --teal:#0EA5A4; --gold:#C9A227; --clay:#B4432F;
  --tint:#FFFFFF; --paper:#F4F4F4;
  --os-cream:#FFFFFF; --os-paper:#F4F4F4; --os-ink:#1C1C1C; --os-muted:#707070;
}

/* ---------- Typography ---------- */
body{
  font-family:'Inter',Helvetica,Arial,sans-serif !important;
  font-weight:400; color:var(--ink) !important;
  font-size:16px; line-height:1.65;
  background-color:var(--canvas) !important; background-image:none !important;
  -webkit-font-smoothing:antialiased;
}
@media (min-width:768px){ body{ font-size:17px; } }
html{ scroll-behavior:smooth; }

h1,h2,h3,h4{
  font-family:'Inter',Helvetica,Arial,sans-serif !important;
  font-weight:700 !important; letter-spacing:-0.02em;
  text-wrap:balance; color:var(--ink);
}
p{ text-wrap:pretty; }
.font-mono,code,kbd,samp{ font-family:'IBM Plex Mono',ui-monospace,monospace; }

/* Heading scale (use these, don't invent new sizes)
   h1  40 / 48 / 60px      h2  28 / 34 / 42px
   h3  20 / 22px           body 16 / 17px      eyebrow 11.5px           */

/* ---------- Eyebrow / section label ---------- */
.eyebrow{
  font-family:'Inter',sans-serif !important;
  font-size:.72rem; font-weight:700; letter-spacing:.16em;
  text-transform:uppercase; color:var(--orange) !important;
}

/* ---------- Accent word: orange text + thick coral underline ----------
   The signature move. One per heading, never more.                     */
.os-mark-gold,.os-mark-teal,.os-underline{
  background:none !important; padding:0 !important;
  color:var(--orange) !important;
  text-decoration:underline;
  text-decoration-color:var(--coral);
  text-decoration-thickness:4px;
  text-underline-offset:6px;
}

/* ---------- Surfaces ---------- */
.os-card,.os-card-white{
  background:var(--surface) !important;
  border:1px solid var(--line) !important;
  border-radius:14px !important;
  box-shadow:none !important;
}
section{ position:relative; }

/* ---------- Utilities ---------- */
.os-navy{ color:var(--ink); }
.os-bg-navy,.os-bg-ink{ background:var(--ink) !important; }
.os-teal,.os-gold{ color:var(--orange) !important; }
.os-bg-teal{ background:var(--orange) !important; }
.os-clay{ color:var(--clay); }
.os-above{ position:relative; z-index:1; }
.os-orb{ display:none !important; }   /* retired: flat surfaces only */

/* ---------- Navigation ---------- */
.osNavBtn.active{ background:rgba(28,28,28,.06) !important; }
.osDdItem.active{ background:rgba(184,76,22,.08) !important; color:var(--orange) !important; }
.os-nav{ background:rgba(255,255,255,.85) !important; }
.os-nav-links a.active{ background:rgba(28,28,28,.06) !important; }
.os-nav-cta{ background:var(--ink) !important; }
.os-nav-dd-menu a:hover{ background:var(--canvas) !important; }