/* ================================================================
   MEETINGS & EVENTS PAGE
   Loads after eclipse-main (main.css) and relies on its :root tokens
   (--navy, --gold, --gold-light, --cream, --warm, --border, --muted)
   plus the Libre Baskerville / Inter fonts already enqueued site-wide.
   Mobile-first: base rules target ≤767px, then two min-width layers
   add the 768–1024px (tablet) and ≥1025px (desktop) layouts.
   ================================================================ */

/* ── HERO ── */
.events-hero{
  position:relative;
  min-height:64vh;
  display:flex;
  align-items:center;
  padding:clamp(2.5rem,8vw,4rem) clamp(1.25rem,5vw,3rem);
  background-size:cover;
  background-position:center 35%;
  background-repeat:no-repeat;
  color:#fff;
}
.events-hero-inner{max-width:1200px;margin:0 auto;width:100%;}
.events-eyebrow{
  font-family:'Inter',sans-serif;
  font-size:clamp(0.65rem,1.2vw,0.75rem);
  font-weight:600;
  letter-spacing:0.45em;
  text-transform:uppercase;
  color:var(--gold-light);
  margin-bottom:0.75rem;
}
.events-hero-title{
  font-family:'Libre Baskerville',serif;
  font-size:clamp(2.1rem,6.5vw,3.75rem);
  font-weight:700;
  line-height:1.1;
  max-width:14ch;
  margin-bottom:1rem;
}
.events-hero-sub{
  font-size:clamp(0.95rem,1.8vw,1.1rem);
  color:rgba(255,255,255,0.82);
  line-height:1.7;
  max-width:46ch;
  margin-bottom:2rem;
}
.events-hero-actions{display:flex;gap:0.75rem;flex-wrap:wrap;}

/* Book Your Event Now buttons render as inline <a> tags outside any flex
   context (e.g. .events-centre-cta), so uppercase font metrics leave the
   text sitting high in its padding box. Force true flex centering so the
   label sits dead-center regardless of surrounding layout. */
.events-book-btn{display:inline-flex;align-items:center;justify-content:center;line-height:1;}
.events-hero-outline{border-color:rgba(255,255,255,0.5);color:#fff;}
.events-hero-outline:hover{background:#fff;color:var(--navy);border-color:#fff;}

/* ── CONFERENCE CENTRE ── */
.events-centre{
  padding:clamp(3rem,8vw,6rem) clamp(1.25rem,5vw,3rem);
  background:var(--cream);
}
.events-centre-inner{
  max-width:1200px;
  margin:0 auto;
  display:grid;
  grid-template-columns:1fr;
  gap:2.5rem;
}
.events-centre-content h2{
  font-family:'Libre Baskerville',serif;
  font-size:clamp(1.6rem,3.6vw,2.3rem);
  font-weight:700;
  color:var(--navy);
  line-height:1.2;
  margin-bottom:1.2rem;
}
.events-centre-content p{
  font-size:clamp(0.95rem,1.6vw,1.05rem);
  color:var(--muted);
  line-height:1.8;
  margin-bottom:1.2rem;
}
.events-centre-content strong{color:var(--navy);}
.events-centre-cta{margin-top:0.5rem;}

.events-stats{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:1px;
  background:var(--border);
  border:1px solid var(--border);
}
.events-stat{
  background:#fff;
  padding:1.75rem 1.25rem;
  text-align:center;
}
.events-stat-num{
  display:block;
  font-family:'Libre Baskerville',serif;
  font-size:clamp(2rem,5vw,2.75rem);
  font-weight:700;
  color:var(--gold);
  line-height:1;
  margin-bottom:0.5rem;
}
.events-stat-label{
  display:block;
  font-size:0.7rem;
  letter-spacing:0.1em;
  text-transform:uppercase;
  color:var(--muted);
  line-height:1.5;
}

/* ── SERVICES BENTO GRID ── */
.events-services{
  padding:clamp(3rem,8vw,5.5rem) clamp(1.25rem,5vw,3rem);
}
.events-services-head{
  max-width:1200px;
  margin:0 auto clamp(2rem,5vw,3rem);
  text-align:center;
}
.events-services-head h2{
  font-family:'Libre Baskerville',serif;
  font-size:clamp(1.5rem,3.4vw,2.2rem);
  font-weight:700;
  color:var(--navy);
  margin-bottom:0.6rem;
}
.events-services-head p{
  font-size:clamp(0.95rem,1.6vw,1.05rem);
  color:var(--muted);
}
.events-services-grid{
  max-width:1200px;
  margin:0 auto;
  display:grid;
  grid-template-columns:1fr;
  gap:1.25rem;
}
.events-tile{
  border:1px solid var(--border);
  overflow:hidden;
  background:#fff;
}
.events-tile img{
  width:100%;
  height:200px;
  object-fit:cover;
  display:block;
}
.events-tile--featured img{height:280px;}
.events-tile-label{
  display:block;
  background:var(--navy);
  color:#fff;
  font-family:'Inter',sans-serif;
  font-size:0.78rem;
  font-weight:600;
  letter-spacing:0.12em;
  text-transform:uppercase;
  padding:0.85rem 1rem;
  text-align:center;
}
.events-tile--featured .events-tile-label{background:var(--gold);color:#1a1a1a;}

/* ── CLOSING CTA BAND ── */
.events-cta{
  background:var(--navy);
  padding:clamp(3.5rem,9vw,6rem) clamp(1.25rem,5vw,3rem);
  text-align:center;
}
.events-cta-inner{max-width:780px;margin:0 auto;}
.events-cta-tagline{
  font-family:'Libre Baskerville',serif;
  font-weight:400;
  font-style:normal;
  font-size:clamp(1.4rem,4vw,2.2rem);
  line-height:1.4;
  color:#fff;
  margin-bottom:2rem;
}
.events-cta-actions{display:flex;gap:0.75rem;justify-content:center;flex-wrap:wrap;}
.events-cta-btn{padding:0.9rem 2.2rem;font-size:0.8rem;transition:transform 0.2s ease,background 0.2s ease;}
.events-cta-btn:hover{transform:translateY(-2px);}
.events-cta-outline{border-color:rgba(255,255,255,0.5);color:#fff;}
.events-cta-outline:hover{background:#fff;color:var(--navy);border-color:#fff;transform:translateY(-2px);}

/* ── SCROLL REVEAL (JS toggles .is-visible; see events.js) ── */
.reveal{
  opacity:0;
  transform:translateY(24px);
  transition:opacity 0.6s ease,transform 0.6s ease;
}
.reveal.is-visible{opacity:1;transform:translateY(0);}
@media(prefers-reduced-motion:reduce){
  .reveal{opacity:1;transform:none;transition:none;}
}

/* ── TABLET (768–1024px) ── */
@media(min-width:768px){
  .events-hero{min-height:70vh;}
  .events-centre-inner{grid-template-columns:1.15fr 0.85fr;align-items:center;}
  .events-services-grid{
    grid-template-columns:repeat(2,1fr);
    grid-auto-flow:dense;
  }
  .events-tile--featured{grid-column:span 2;}
  .events-tile--featured img{height:260px;}
}

/* ── DESKTOP (≥1025px) ── */
@media(min-width:1025px){
  .events-hero{min-height:62vh;background-position:center 30%;}
  .events-centre-inner{grid-template-columns:1.2fr 0.8fr;gap:4rem;}
  .events-services-grid{
    grid-template-columns:repeat(4,1fr);
    grid-auto-rows:220px;
    grid-auto-flow:dense;
    gap:1.5rem;
  }
  .events-tile{display:flex;flex-direction:column;}
  .events-tile img{flex:1;height:auto;min-height:0;}
  .events-tile--featured{grid-column:span 2;grid-row:span 2;}
  .events-tile--featured img{height:auto;}
}
