/* Home page specific styles */

.hero {
  position: relative;
  overflow: hidden;
  min-height: 640px;
  display: flex;
  align-items: center;
  background-image: url('/images/hero-silhouette.jpg');
  background-size: cover;
  background-position: center;
}
.hero::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(10,10,10,0.78) 0%, rgba(10,10,10,0.45) 45%, rgba(10,10,10,0) 75%),
              linear-gradient(180deg, rgba(17,17,17,0) 75%, #111111 100%);
  z-index: 0;
}
.hero::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 4%;
  transform: translateY(-50%);
  width: min(46vw, 620px);
  height: min(30vw, 405px);
  background-image: url('https://milesaheadfootball.co.uk/wp-content/uploads/2026/07/ma_hero_watermark_v2-1.png');
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  z-index: 0;
  pointer-events: none;
}
.hero .container { position: relative; z-index: 1; }
.hero h6.eyebrow { font-family: var(--font-body); }
.hero h1 {
  font-size: clamp(42px, 7vw, 76px);
  margin-bottom: 0.1em;
}
.hero .sub { font-size: clamp(42px, 7vw, 76px); font-family: var(--font-display); line-height: 1.05; }
.hero .btn { margin-top: 28px; }

/* Method typography section */
.method-section { padding-block: 110px; text-align: center; }
.method-section .container { max-width: 900px; }
.method-section .lead { font-size: 18px; color: var(--muted); margin-bottom: 0.6em; }
.method-scale {
  font-family: var(--font-display);
  text-transform: uppercase;
  line-height: 1.08;
}
.method-scale .sm { font-size: clamp(22px, 3vw, 30px); margin: 0.3em 0; }
.method-scale .huge { font-size: clamp(64px, 12vw, 150px); color: var(--gold); margin: 0.1em 0; }
.method-scale .md { font-size: clamp(28px, 4vw, 42px); margin: 0.3em 0 0.6em; }
.method-section .quotes { margin: 40px 0; font-size: 16px; color: var(--muted); }
.method-section .quotes p { margin: 0.3em 0; }
.method-section .closer {
  font-family: var(--font-display);
  font-size: clamp(30px, 5vw, 48px);
  margin-top: 0.4em;
}
.method-section .explore { margin-top: 30px; display: inline-block; font-weight: 600; }

/* Fade-up entrance animation, same as live site */
.fade-up {
  opacity: 0;
  transform: translateY(24px);
  transition: opacity 0.6s ease, transform 0.6s ease;
}
.fade-up.in { opacity: 1; transform: translateY(0); }

/* Sessions cards */
.sessions-section { padding-block: 100px; background: var(--card-bg); }
.sessions-section > .container > .eyebrow,
.sessions-section > .container > h2 { text-align: center; }
.sessions-section > .container > h2 { margin-bottom: 50px; }
.card-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 36px; }
.session-card {
  background: var(--black);
  border: 1px solid var(--border);
  border-radius: 4px;
  padding: 36px;
  text-align: center;
}
.session-card .divider { display: none; }
.session-card h3 { font-size: 26px; margin-bottom: 14px; }
.session-card p { color: var(--muted); margin-bottom: 24px; }
@media (max-width: 760px) {
  .card-grid { grid-template-columns: 1fr; }
}

/* Closing CTA */
.cta-section { padding-block: 100px; text-align: center; }
.cta-section .container { max-width: 640px; }
.cta-section p { color: var(--muted); margin-bottom: 30px; }