:root {
  --bg: #FDFCF9;       /* off-white parchment */
  --surface: #F6F1E9;  /* warm ivory cards */
  --ink: #1C1C1C;      /* dark charcoal text (main body) */
  --muted: #9E9B91;    /* weathered stone gray */
  --primary: #A23E48;  /* adobe red (main accent/buttons) */
  --secondary: #3E7B4A;/* cactus green (golf + accents) */
  --accent: #E9B44C;   /* trophy gold highlights */
  --sand: #D7B377;     /* sandy beige */
  --border: #8E6C4E;   /* desert rock brown */
  --navbg: #2A2A2A;    /* charcoal nav background */
  --navtext: #C0C0C0;  /* silver nav text */
  --radius: 18px;
  --shadow: 0 12px 30px rgba(0,0,0,.25);
  --maxw: 1200px;
}


* { box-sizing:border-box }
html,body {
  margin:0;
  background:var(--bg);
  color:var(--ink);
  font-family:ui-sans-serif,system-ui,Segoe UI,Inter,Arial;
  scroll-behavior:smooth;
}

a { color:var(--primary); }
.wrap { max-width:var(--maxw); margin:0 auto; padding:0 1rem; }

/* Header */
header.site {
  position:sticky; top:0; z-index:40;
  background:var(--navbg); /* charcoal background */
  backdrop-filter:blur(8px);
  border-bottom:2px solid var(--border);
}
.nav {
  display:flex; align-items:center; justify-content:space-between;
  gap:.75rem; padding:.6rem 0;
}
.brand { display:flex; align-items:center; gap:.6rem; font-weight:800; letter-spacing:.3px }
.brand-logo {
  width: 250px;
  height: auto;
  border-radius: 10px;   /* optional, if you want rounded corners */
  object-fit: contain;   /* keeps logo aspect ratio */
}

.nav a {
  padding:.55rem .8rem;
  border-radius:10px;
  color:var(--navtext); /* silver text*/
  opacity:.9;
  text-decoration:none;
  font-size: 1.5rem;   /* adjust up or down */
  font-weight: 1000;    /* optional: make it bolder */
}

.nav a:hover,.nav a.active {
  background:var(--sand); color:var(--ink); opacity:1
}

/* Buttons */
.cta {
  display:inline-flex; gap:.6rem; align-items:center;
  padding:.9rem 1.1rem;
  border-radius:12px; font-weight:800;
  border:1px solid var(--border);
  background:linear-gradient(180deg, var(--primary), #822F36);
  color:#fff; box-shadow:var(--shadow); text-decoration:none;
}
.cta.secondary {
  background:linear-gradient(180deg, var(--secondary), #2C5A35);
  color:#fff;
}

/* Sections & cards */
.section { padding: clamp(2rem,6vw,4rem) 0;} 
.section .section-title {
  scroll-margin-top: 134px;  /* match your header height */
}
.card {
  background:var(--surface);
  border:1px solid var(--border);
  border-radius:var(--radius);
  padding:1.1rem;
}
h1 {
  font-size: clamp(2.2rem, 6vw, 3.6rem);
  margin:.4rem 0 .6rem;
  line-height:1.05;
}
.pill {
  display:inline-block;
  background:var(--sand);
  border:1px solid var(--border);
  padding:.35rem .6rem;
  border-radius:999px;
  font-size:.86rem;
  color:var(--ink);
}
.kpi {
  display:grid; grid-template-columns:repeat(2,1fr);
  gap:.75rem; margin-top:1rem;
}
@media(min-width:700px){ .kpi{ grid-template-columns:repeat(4,1fr) } }
.kpi .item {
  background:var(--surface);
  border:1px solid var(--border);
  border-radius:14px;
  padding:.9rem; text-align:center;
}
.kpi .item h3 { margin:0; font-size:1.1rem }
.kpi .item p { margin:.3rem 0 0; color:var(--muted); font-size:.9rem }

.split { display:grid; gap:1rem; grid-template-columns:1fr }
@media(min-width:900px){ .split{ grid-template-columns:1fr 1fr } }
h2.section-title { font-size: clamp(1.4rem,3.5vw,2rem); margin:0 0 .6rem }

.list-check { list-style:none; padding:0; margin:0 }
.list-check li { padding-left:1.6rem; margin:.5rem 0; position:relative }
.list-check li::before {
  content:"✓"; position:absolute; left:0; top:0;
  color:var(--secondary); font-weight:900;
}

.strip {
  background:var(--sand);
  border-top:1px solid var(--border);
  border-bottom:1px solid var(--border);
}
.sponsor-strip {
  display:grid; grid-template-columns:repeat(2,1fr); gap:.75rem
}
@media(min-width:800px){ .sponsor-strip{ grid-template-columns:repeat(6,1fr) } }

.faq details {
  border:1px solid var(--border);
  border-radius:12px;
  padding:.75rem 1rem;
  background:var(--surface);
}
.faq details+details { margin-top:.6rem }

footer {
  border-top:1px solid var(--border);
  color:var(--muted);
  background:var(--surface);
}

.badge {
  display:inline-flex; align-items:center; gap:.4rem;
  border:1px solid var(--border);
  padding:.35rem .6rem;
  border-radius:999px;
  background:var(--sand);
  color:var(--ink);
  font-size:.85rem;
}
.badge b { color:var(--ink) }

.hero {
  background: radial-gradient(1000px 480px at 80% -20%, rgba(233,180,76,.25) 10%, transparent 60%),
              linear-gradient(180deg, var(--bg) 0%, var(--surface) 100%);
}

/* Sponsor marquee */
.sponsor-marquee { overflow:hidden; position:relative; width:100%; margin-top:1rem; }
.sponsor-track {
  display:flex; gap:1rem;
  width:max-content;
  animation: scrollSponsors 20s linear infinite;
}
@keyframes scrollSponsors {
  from { transform: translateX(0); }
  to { transform: translateX(-50%); }
}
@font-face {
  font-family: 'PermanentMarker-Regular';
  src: url('fonts/PermanentMarker-Regular.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
}
.brand span:last-child {
  font-family: 'PermanentMarker-Regular', cursive; /* fallback cursive */
  font-size: 1.6rem;                /* adjust as needed */
  font-weight: normal;              /* Sharpie style */
}
h1.sharpie {
  font-family: 'Sharpie', cursive;
}  
.subheader {
  font-family: ui-sans-serif, system-ui, Segoe UI, Inter, Arial, sans-serif; /* clean sans serif */
  font-size: 1.5rem;    /* about half the Sharpie h1 size */
  font-weight: 600;     /* semi-bold for emphasis */
  color: #000;          /* pure black */
  margin-top: -0.5rem;  /* pull it a little closer to the h1 */
  margin-bottom: 0rem;  /* space before the pill */
}
.subheader-small {
  font-family: ui-sans-serif, system-ui, Segoe UI, Inter, Arial, sans-serif;
  font-size: 0.75rem;   /* half of your h2’s 1.5rem */
  font-weight: 200;
  color: #000;
  margin-top: 0.25rem;
  margin-bottom: 0.8rem;
}
.logo-slot {
  position: relative;
  flex: 0 0 auto;
  width: 180px;
  height: 120px;
  background: var(--surface);
  border: 1px dashed var(--border);
  border-radius: 14px;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  padding: 0.5rem;
}

.logo-slot img {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
}

.logo-badge.overlay {
  position: absolute;
  top: 6px;
  left: 50%;
  transform: translateX(-50%);
  background: var(--accent);   /* trophy gold, or use var(--primary) */
  color: #fff;
  font-size: 0.7rem;
  font-weight: bold;
  padding: 2px 6px;
  border-radius: 6px;
}
/* Mobile adjustments */
@media (max-width: 600px) {
  .brand-logo {
    width: 140px;   /* scale down the logo */
  }

  .nav {
    flex-direction: column;   /* stack logo and nav vertically */
    gap: 0.5rem;
    padding: 0.4rem 0;
  }

  .nav a {
    font-size: 1rem;      /* smaller text */
    padding: 0.4rem 0.6rem;
  }

  header.site {
    text-align: center;   /* keeps nav centered */
  }
}
/* Offset anchor scroll for sticky header */
section[id] {
  scroll-margin-top: 100px; /* match or slightly exceed header height */
}
.processing-msg {
  display: block;
  margin-top: 0.5rem;
  font-size: 0.9rem;
  font-weight: 600;
  color: var(--secondary); /* green or theme color */
}

