/* ============================================================
   THE TRAILBLAZER JOURNEY — Global Stylesheet v3
   Colors pulled directly from the TJ logo
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400;0,500;0,700;1,400;1,600&family=Source+Sans+3:wght@300;400;600;700&family=Montserrat:wght@700;800;900&display=swap');

*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }

:root {
  /* From the logo */
  --navy:         #1B2A4A;
  --navy-mid:     #243660;
  --navy-light:   #3D5278;
  --teal:         #2DB5A8;
  --teal-bright:  #18D4C8;
  --teal-dark:    #1A7A72;
  --teal-pale:    #E2F7F5;
  --copper:       #B87C38;
  --copper-light: #F5EAD6;
  --copper-dark:  #7A5020;
  --cream:        #FAF8F4;
  --white:        #FFFFFF;
  --text-dark:    #0E1929;
  --text-mid:     #3A5068;
  --text-light:   #7A98B0;
  --border:       #C8DDE6;
  --shadow-navy:  rgba(27,42,74,0.18);
  --shadow-teal:  rgba(45,181,168,0.25);
}

html { scroll-behavior: smooth; }

body {
  font-family: 'Source Sans 3', sans-serif;
  background: var(--cream);
  color: var(--text-dark);
  font-size: 16px;
  line-height: 1.6;
  overflow-x: hidden;
}

/* ── Typography ── */
h1,h2,h3,h4 { font-family:'Playfair Display',Georgia,serif; line-height:1.15; }
h1 { font-size:clamp(36px,5.5vw,64px); font-weight:700; }
h2 { font-size:clamp(28px,4vw,44px);   font-weight:600; }
h3 { font-size:clamp(19px,2.5vw,24px); font-weight:500; }
p  { color:var(--text-mid); line-height:1.8; }
a  { color:var(--teal);     text-decoration:none; }
a:hover { text-decoration:underline; }

/* ── Layout ── */
.container  { max-width:1120px; margin:0 auto; padding:0 32px; }
.section    { padding:90px 0; }
.section-sm { padding:60px 0; }
.section-label {
  font-family:'Montserrat',sans-serif;
  font-size:11px; font-weight:800;
  letter-spacing:4px;
  text-transform:uppercase;
  color:var(--copper);
  margin-bottom:14px;
  display:block;
}

/* ── Buttons ── */
.btn {
  display:inline-flex; align-items:center; gap:9px;
  font-family:'Montserrat',sans-serif;
  font-size:13px; font-weight:700;
  letter-spacing:0.5px;
  padding:14px 32px;
  border-radius:50px;
  border:none; cursor:pointer;
  text-decoration:none;
  transition:all 0.2s;
}
.btn:hover { transform:translateY(-3px); text-decoration:none; }
.btn-primary {
  background:linear-gradient(135deg,var(--copper) 0%,#D4922A 100%);
  color:#ffffff;
  box-shadow:0 6px 24px rgba(184,124,56,0.45);
}
.btn-primary:hover { box-shadow:0 10px 32px rgba(184,124,56,0.55); }
.btn-teal {
  background:linear-gradient(135deg,var(--teal) 0%,var(--teal-bright) 100%);
  color:#ffffff;
  box-shadow:0 6px 24px var(--shadow-teal);
}
.btn-teal:hover { box-shadow:0 10px 32px rgba(45,181,168,0.5); }
.btn-outline {
  background:transparent;
  color:var(--navy);
  border:2px solid var(--navy);
}
.btn-outline:hover { background:var(--navy); color:#fff; }
.btn-outline-white {
  background:transparent;
  color:#ffffff;
  border:2px solid rgba(255,255,255,0.6);
}
.btn-outline-white:hover { background:rgba(255,255,255,0.15); border-color:#fff; }
.btn-white {
  background:#ffffff;
  color:var(--navy);
  box-shadow:0 6px 24px rgba(0,0,0,0.15);
}
.btn-white:hover { background:var(--teal-pale); }

/* ── Navigation ── */
.navbar {
  position:sticky; top:0; z-index:100;
  background:var(--navy);
  box-shadow:0 4px 30px rgba(0,0,0,0.3);
}
.navbar .container {
  display:flex; align-items:center;
  justify-content:space-between;
  height:76px;
}
.nav-logo { display:flex; align-items:center; gap:14px; text-decoration:none; }
.nav-logo img {
  height:52px; width:52px;
  border-radius:8px;
  object-fit:cover;
  border:2px solid rgba(255,255,255,0.15);
}
.nav-logo-text { display:flex; flex-direction:column; }
.nav-brand-name {
  font-family:'Playfair Display',serif;
  font-style:italic; font-size:18px;
  color:#ffffff; line-height:1.1; font-weight:600;
}
.nav-brand-motto {
  font-size:9px; letter-spacing:2px;
  color:var(--teal-bright);
  text-transform:uppercase; font-weight:700;
}
.nav-links { display:flex; align-items:center; gap:4px; list-style:none; }
.nav-links a {
  font-family:'Source Sans 3',sans-serif;
  font-size:14px; font-weight:600;
  color:rgba(255,255,255,0.8);
  padding:8px 16px; border-radius:6px;
  transition:all 0.15s; text-decoration:none;
}
.nav-links a:hover,
.nav-links a.active { color:#fff; background:rgba(255,255,255,0.12); }
.nav-links .btn-nav {
  background:linear-gradient(135deg,var(--copper),#D4922A);
  color:#fff; padding:9px 22px;
  border-radius:50px;
  box-shadow:0 4px 14px rgba(184,124,56,0.4);
  font-family:'Montserrat',sans-serif;
  font-size:12px; font-weight:700; letter-spacing:0.5px;
}
.nav-links .btn-nav:hover { box-shadow:0 6px 20px rgba(184,124,56,0.55); background:var(--copper-dark); }
.hamburger { display:none; cursor:pointer; flex-direction:column; gap:5px; background:none; border:none; padding:4px; }
.hamburger span { display:block; width:24px; height:2.5px; background:#fff; border-radius:2px; }

/* ── Wave dividers ── */
.wave { display:block; width:100%; line-height:0; }
.wave svg { display:block; width:100%; }

/* ── Footer ── */
.footer {
  background:var(--navy);
  background-image:linear-gradient(180deg,#162238 0%,#0E1929 100%);
  padding:70px 0 36px;
}
.footer-top {
  display:grid; grid-template-columns:2fr 1fr 1fr;
  gap:52px; margin-bottom:48px;
}
.footer-logo { display:flex; align-items:center; gap:14px; margin-bottom:16px; }
.footer-logo img { height:52px; width:52px; border-radius:8px; object-fit:cover; border:2px solid rgba(255,255,255,0.12); }
.footer-brand-name {
  font-family:'Playfair Display',serif;
  font-style:italic; font-size:20px;
  color:#fff; line-height:1.1;
}
.footer-motto {
  font-size:10px; letter-spacing:2.5px;
  color:var(--teal-bright); text-transform:uppercase;
  font-weight:700;
}
.footer-desc { font-size:14px; line-height:1.8; color:rgba(255,255,255,0.55); margin-top:12px; }
.footer h4 {
  font-family:'Montserrat',sans-serif;
  font-size:11px; font-weight:800;
  letter-spacing:3px; text-transform:uppercase;
  color:var(--teal-bright); margin-bottom:18px;
}
.footer ul { list-style:none; }
.footer ul li { margin-bottom:11px; }
.footer ul a { font-size:14px; color:rgba(255,255,255,0.6); text-decoration:none; transition:color 0.15s; }
.footer ul a:hover { color:#fff; }
.footer-bottom {
  border-top:1px solid rgba(255,255,255,0.08);
  padding-top:24px;
  display:flex; justify-content:space-between;
  align-items:center; flex-wrap:wrap; gap:12px;
}
.footer-bottom p { font-size:12px; color:rgba(255,255,255,0.35); margin:0; }
.footer-disclaimer {
  font-size:11px; color:rgba(255,255,255,0.32);
  line-height:1.7; margin-top:18px;
  padding-top:18px;
  border-top:1px solid rgba(255,255,255,0.07);
}

/* ── Cards ── */
.card {
  background:#fff; border-radius:20px;
  padding:36px;
  box-shadow:0 4px 24px var(--shadow-navy);
  border:1px solid var(--border);
}

/* ── Badge ── */
.badge {
  display:inline-block;
  font-family:'Montserrat',sans-serif;
  font-size:10px; font-weight:800;
  letter-spacing:1.5px; text-transform:uppercase;
  padding:4px 14px; border-radius:20px;
}
.badge-teal   { background:var(--teal-pale);    color:var(--teal-dark); }
.badge-copper { background:var(--copper-light);  color:var(--copper-dark); }
.badge-free   { background:#e4f7f0;              color:#0a6644; }

/* ── Disclaimer box ── */
.disclaimer-box {
  background:var(--teal-pale);
  border-left:4px solid var(--teal);
  border-radius:0 12px 12px 0;
  padding:20px 24px;
  font-size:13px; color:var(--text-mid); line-height:1.7;
}
.disclaimer-box strong { color:var(--navy); }

/* ── Responsive ── */
@media (max-width:900px) {
  .footer-top { grid-template-columns:1fr; gap:32px; }
}
@media (max-width:768px) {
  .section { padding:60px 0; }
  .nav-links { display:none; flex-direction:column; position:absolute; top:76px; left:0; right:0; background:var(--navy); padding:16px; gap:4px; z-index:200; }
  .nav-links.open { display:flex; }
  .hamburger { display:flex; }
  .footer-bottom { flex-direction:column; text-align:center; }
}
