/* Page-specific sections */

/* --- Hero (Home) --- */
.hero {
  min-height: 85vh; display: grid; place-items: center; text-align: center;
  background: linear-gradient(135deg, var(--color-primary-dark), var(--color-primary));
  color: #fff;
}
.hero h1 { color: #fff; }
.hero__tagline { color: var(--color-accent-light); font-size: clamp(1rem, 2.5vw, 1.35rem); }
.hero__cta { display: flex; gap: 1rem; justify-content: center; flex-wrap: wrap; margin-top: 2rem; }

/* --- Timeline (Achievements) --- */
.timeline { position: relative; padding-left: 2rem; }
.timeline::before {
  content: ""; position: absolute; left: 0.5rem; top: 0; bottom: 0;
  width: 3px; background: var(--color-accent);
}
.timeline__entry { position: relative; margin-bottom: 2rem; }
.timeline__entry::before {
  content: ""; position: absolute; left: -1.9rem; top: 0.4rem;
  width: 14px; height: 14px; border-radius: 50%;
  background: var(--color-primary); border: 3px solid var(--color-accent-light);
}

/* --- Generations tabs (About) --- */
.gen-tabs { display: flex; gap: 0.5rem; overflow-x: auto; padding-bottom: 0.5rem; }
.gen-grid { margin-top: 1.5rem; }
.member-card { text-align: center; padding: 1.25rem; }
.member-card__photo {
  width: 96px; height: 96px; border-radius: 50%; object-fit: cover;
  margin-inline: auto; background: var(--color-accent-light);
}

/* ===== Dynamic hero ===== */
.hero { min-height:88vh; position:relative; overflow:hidden; isolation:isolate;
 background:radial-gradient(circle at 50% 35%,rgba(99,102,241,.35),transparent 35%), linear-gradient(135deg,#071a4b,#102b77 55%,#082f49); }
.hero::before { content:"";position:absolute;inset:-30%;z-index:-1;background:conic-gradient(from 0deg,transparent,rgba(34,211,238,.14),transparent 30%);animation:spin 18s linear infinite; }
.hero::after { content:"";position:absolute;left:50%;bottom:-70%;width:900px;height:900px;transform:translateX(-50%);border-radius:50%;border:1px solid rgba(255,255,255,.1);box-shadow:0 0 0 50px rgba(255,255,255,.015),0 0 0 100px rgba(255,255,255,.01);z-index:-1; }
.hero .container { position:relative;z-index:2; }
.hero h1 { font-size:clamp(3rem,9vw,7rem); letter-spacing:-.06em; text-shadow:0 12px 40px rgba(0,0,0,.25); }
.hero h1::after { content:"";display:block;width:80px;height:5px;border-radius:99px;margin:1.2rem auto;background:linear-gradient(90deg,#818cf8,#22d3ee);animation:shimmer 2s linear infinite;background-size:200% 100%; }
.hero__tagline { max-width:700px;margin-inline:auto; }
.hero__cta .btn--primary { box-shadow:0 12px 35px rgba(34,211,238,.22); }