/* VCD Golf — site-specific stylesheet (loads after vespaclubdavao.com/css/style.css) */

:root {
  --golf:       #1e6b3d;
  --golf-mid:   #2a8a50;
  --golf-dark:  #154d2b;
  --golf-pale:  rgba(30, 107, 61, 0.1);
}

/* ── Accent colour overrides ──────────────────────────────── */
.eyebrow           { color: var(--golf-mid); }
.page-hero__label  { color: var(--golf-mid); }

/* ── Hero title — smaller so "Vespa Club Davao / Golf" fits one line ── */
.page-hero__title {
  font-size: clamp(1.6rem, 3.8vw, 3.2rem);
  white-space: nowrap;
}
@media (max-width: 600px) {
  .page-hero__title { white-space: normal; font-size: clamp(1.4rem, 6vw, 2rem); }
}

/* ── Navbar: VCD back-link ────────────────────────────────── */
.navbar__vcd-link {
  font-size: 0.68rem;
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.38);
  text-decoration: none;
  border: 1px solid rgba(255,255,255,0.14);
  border-radius: 3px;
  padding: 0.3rem 0.7rem;
  flex-shrink: 0;
  transition: color 0.2s, border-color 0.2s;
  white-space: nowrap;
}
.navbar__vcd-link:hover {
  color: #fff;
  border-color: rgba(255,255,255,0.38);
}
@media (max-width: 768px) { .navbar__vcd-link { display: none; } }

/* ── Logo: keep circle treatment, slightly smaller ────────── */
.navbar__logo-wrap {
  width: 48px;
  height: 48px;
}

/* ── Golf stripe divider ──────────────────────────────────── */
.golf-stripe {
  display: flex;
  height: 4px;
  width: 100%;
}
.golf-stripe span:nth-child(1) { background: var(--golf);  flex: 1; }
.golf-stripe span:nth-child(2) { background: #fff; opacity: 0.3; flex: 1; }
.golf-stripe span:nth-child(3) { background: #c8102e; flex: 1; }

/* ── Golf logo — circular frame in intro section ──────────── */
.golf-logo-wrap {
  background: #fff;
  border-radius: 50%;
  padding: 14px;
  box-shadow: 0 0 0 4px #fff, 0 8px 40px rgba(0,0,0,0.5);
  width: 240px;
  height: 240px;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  flex-shrink: 0;
}
.golf-logo-wrap img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
@media (max-width: 768px) {
  .golf-logo-wrap { width: 180px; height: 180px; padding: 10px; }
  .golf-intro { text-align: center; }
  .golf-intro .golf-logo-wrap { margin: 0 auto; }
}

/* ── Parent label ("An official event of …") ─────────────── */
.golf-parent {
  display: inline-block;
  font-size: 0.7rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.42);
  font-family: 'Barlow', sans-serif;
  margin-bottom: 0.6rem;
}
.golf-parent a {
  color: rgba(255,255,255,0.55);
  text-decoration: none;
  transition: color 0.2s;
}
.golf-parent a:hover { color: #fff; }

/* ── Hero sub-brand block ─────────────────────────────────── */
.golf-hero-logo-wrap {
  display: flex;
  align-items: center;
  gap: 1.25rem;
  margin-top: 1.5rem;
}
.golf-hero-logo-wrap img {
  width: 80px;
  height: 80px;
  object-fit: contain;
  filter: drop-shadow(0 2px 12px rgba(0,0,0,0.5));
  flex-shrink: 0;
}
.golf-hero-brand {
  display: flex;
  flex-direction: column;
}
.golf-hero-brand-name {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 1.1rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--golf-mid);
  line-height: 1.1;
}
.golf-hero-brand-sub {
  font-size: 0.72rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.38);
  font-family: 'Barlow', sans-serif;
  margin-top: 0.2rem;
}

/* ── Brand intro section ──────────────────────────────────── */
.golf-intro {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 3.5rem;
  align-items: center;
}
@media (max-width: 768px) {
  .golf-intro {
    grid-template-columns: 1fr;
    gap: 2rem;
    text-align: center;
  }
  .golf-intro .golf-logo-display { margin: 0 auto; }
}
.golf-intro__text h2 {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 2rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #fff;
  margin-bottom: 1rem;
  line-height: 1.1;
  white-space: nowrap;
}
@media (max-width: 900px) {
  .golf-intro__text h2 { white-space: normal; font-size: 1.8rem; }
}
.golf-intro__text p {
  font-size: 1.05rem;
  line-height: 1.8;
  color: rgba(255,255,255,0.65);
  max-width: 560px;
  margin-bottom: 1rem;
}
@media (max-width: 768px) {
  .golf-intro__text p { max-width: 100%; }
}

/* ── Green accent button ──────────────────────────────────── */
.btn--green {
  background: var(--golf);
  color: #fff;
  border: 2px solid var(--golf);
}
.btn--green:hover {
  background: var(--golf-dark);
  border-color: var(--golf-dark);
  color: #fff;
}

/* ── Golf stat strip ──────────────────────────────────────── */
.golf-stats {
  display: flex;
  gap: 3rem;
  margin-top: 3rem;
  padding-top: 2.5rem;
  border-top: 1px solid rgba(255,255,255,0.1);
  flex-wrap: wrap;
}
.golf-stat__num {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 2.2rem;
  font-weight: 700;
  color: var(--golf-mid);
  line-height: 1;
}
.golf-stat__label {
  font-size: 0.72rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.42);
  margin-top: 0.3rem;
  font-family: 'Barlow', sans-serif;
}

/* ── Footer golf tag ──────────────────────────────────────── */
.footer__golf-tag {
  font-size: 0.7rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.25);
  display: block;
  margin-top: 0.35rem;
}
