/* ============================================================
   Become a Tutor Landing Page
   ============================================================ */

/* ── Hero ─────────────────────────────────────────────────── */
.bt-hero {
  background: linear-gradient(135deg, #0f1929 0%, #1e3560 50%, #2F5080 100%);
  padding: 5rem 0 4rem;
  position: relative;
  overflow: hidden;
}
.bt-hero::before {
  content:'';
  position:absolute;
  inset:0;
  background:radial-gradient(circle at 70% 50%, rgba(59,130,246,.15) 0%, transparent 60%);
  pointer-events:none;
}
.bt-hero-badge {
  display:inline-flex; align-items:center;
  background:rgba(255,255,255,.1);
  border:1px solid rgba(255,255,255,.2);
  color:#fff;
  padding:.35rem .9rem;
  border-radius:50px;
  font-size:.82rem;
  font-weight:600;
  margin-bottom:1.25rem;
}
.bt-hero-title { font-size:clamp(1.8rem,4vw,2.75rem); font-weight:800; color:#fff; line-height:1.2; margin-bottom:1rem; }
.bt-hero-sub { font-size:1.05rem; color:rgba(255,255,255,.75); line-height:1.7; margin-bottom:1.75rem; }
.bt-hero-stats { display:flex; align-items:center; gap:1.5rem; margin-bottom:2rem; flex-wrap:wrap; }
.bt-hero-stat { text-align:center; }
.bt-stat-num { display:block; font-size:1.6rem; font-weight:800; color:#fff; line-height:1; }
.bt-stat-label { display:block; font-size:.72rem; color:rgba(255,255,255,.55); text-transform:uppercase; letter-spacing:.05em; margin-top:.2rem; }
.bt-stat-divider { width:1px; height:36px; background:rgba(255,255,255,.2); }
.bt-hero-cta { display:flex; gap:1rem; flex-wrap:wrap; margin-bottom:1.25rem; }
.bt-hero-note { font-size:.82rem; color:rgba(255,255,255,.6); margin:0; }

/* Hero visual */
.bt-hero-visual { position:relative; padding:.5rem; }
.bt-hero-img-wrap {
  border-radius:20px; overflow:hidden;
  border:2px solid rgba(255,255,255,.1);
  aspect-ratio:4/3;
  background:linear-gradient(135deg,#1e3560,#2F5080);
}
.bt-hero-img { width:100%; height:100%; object-fit:cover; display:block; }
.bt-hero-placeholder { display:flex; align-items:center; justify-content:center; color:rgba(255,255,255,.3); font-size:3rem; }

.bt-float-card {
  position:absolute;
  background:#fff;
  border-radius:10px;
  padding:.6rem 1rem;
  box-shadow:0 8px 24px rgba(0,0,0,.18);
  font-size:.84rem;
  white-space:nowrap;
  display:flex;
  align-items:center;
}
.bt-float-1 { bottom:15%; right:-5%; }
.bt-float-2 { top:10%; left:-8%; }
.bt-float-3 { top:50%; right:-10%; }
.bt-mini-avatars { display:flex; margin-right:.25rem; }
.bt-mini-av { width:24px; height:24px; border-radius:50%; border:2px solid #fff; display:flex; align-items:center; justify-content:center; font-size:.65rem; font-weight:700; color:#fff; margin-right:-8px; }

/* ── Buttons ──────────────────────────────────────────────── */
.bt-btn-primary {
  background:var(--gc-red,#e30b13);
  border-color:var(--gc-red,#e30b13);
  color:#fff; font-weight:700;
  border-radius:50px;
  transition:all .2s;
}
.bt-btn-primary:hover { background:#c0080f; border-color:#c0080f; color:#fff; transform:translateY(-2px); box-shadow:0 6px 20px rgba(227,11,19,.4); }
.bt-btn-secondary { background:rgba(255,255,255,.1); border-color:rgba(255,255,255,.3); color:#fff; font-weight:600; border-radius:50px; }
.bt-btn-secondary:hover { background:rgba(255,255,255,.2); color:#fff; }
.bt-btn-secondary-light { background:#fff; border-color:#fff; color:var(--gc-navy,#2F5080); font-weight:700; border-radius:50px; }
.bt-btn-secondary-light:hover { background:#f0f4ff; color:var(--gc-navy,#2F5080); }

/* ── Benefits ─────────────────────────────────────────────── */
.bt-benefit-card {
  background:#fff;
  border:1px solid #e8ecf0;
  border-radius:12px;
  padding:1.75rem 1.5rem;
  height:100%;
  transition:all .25s;
  box-shadow:0 2px 12px rgba(0,0,0,.05);
}
.bt-benefit-card:hover { transform:translateY(-4px); box-shadow:0 10px 30px rgba(0,0,0,.1); }
.bt-benefit-icon { width:52px; height:52px; border-radius:12px; display:flex; align-items:center; justify-content:center; font-size:1.3rem; margin-bottom:1rem; }
.bt-benefit-title { font-size:1rem; font-weight:700; margin-bottom:.5rem; }
.bt-benefit-desc { font-size:.88rem; color:#6b7280; line-height:1.6; margin:0; }

/* ── Requirements ─────────────────────────────────────────── */
.bt-req-card { text-align:center; padding:2rem 1.5rem; background:#fff; border:1px solid #e8ecf0; border-radius:12px; height:100%; transition:all .25s; }
.bt-req-card:hover { transform:translateY(-3px); box-shadow:0 8px 24px rgba(0,0,0,.1); }
.bt-req-icon { width:60px; height:60px; background:linear-gradient(135deg,#1e3560,#2F5080); color:#fff; border-radius:16px; display:flex; align-items:center; justify-content:center; font-size:1.4rem; margin:0 auto 1rem; }
.bt-req-title { font-size:1rem; font-weight:700; margin-bottom:.5rem; }
.bt-req-desc { font-size:.85rem; color:#6b7280; line-height:1.6; margin:0; }
.bt-nreq-row { display:flex; align-items:flex-start; gap:1.25rem; flex-wrap:wrap; background:#fff; border:1px solid #e8ecf0; border-radius:12px; padding:1.25rem 1.5rem; }
.bt-nreq-label { white-space:nowrap; font-size:.9rem; color:#1e2a3a; padding-top:.1rem; }
.bt-nreq-chips { display:flex; flex-wrap:wrap; gap:.5rem; }
.bt-nreq-chip { background:#f0f4ff; color:#2F5080; border:1px solid #c7d7f0; padding:.3rem .75rem; border-radius:50px; font-size:.8rem; font-weight:500; }

/* ── Programs ─────────────────────────────────────────────── */
.bt-prog-card { background:#fff; border:1px solid #e8ecf0; border-radius:14px; padding:2rem 1.75rem; height:100%; position:relative; transition:all .25s; }
.bt-prog-card:hover { transform:translateY(-4px); box-shadow:0 12px 35px rgba(0,0,0,.12); }
.bt-prog-tag { position:absolute; top:1rem; right:1rem; font-size:.7rem; font-weight:700; padding:.25rem .65rem; border-radius:50px; text-transform:uppercase; letter-spacing:.05em; }
.bt-prog-icon { width:56px; height:56px; border-radius:14px; display:flex; align-items:center; justify-content:center; font-size:1.4rem; margin-bottom:1.1rem; }
.bt-prog-title { font-size:1.1rem; font-weight:800; margin-bottom:.6rem; }
.bt-prog-desc { font-size:.87rem; color:#6b7280; margin-bottom:1.25rem; line-height:1.6; }
.bt-prog-features { list-style:none; padding:0; margin:0; display:flex; flex-direction:column; gap:.5rem; }
.bt-prog-features li { display:flex; align-items:center; gap:.6rem; font-size:.87rem; font-weight:500; }
.bt-prog-features li i { font-size:.9rem; flex-shrink:0; }

/* ── How it works steps ───────────────────────────────────── */
.bt-how-steps { display:flex; align-items:flex-start; gap:0; flex-wrap:wrap; justify-content:center; }
.bt-how-step { flex:1; min-width:160px; max-width:200px; text-align:center; padding:1rem .75rem; }
.bt-how-num { font-size:.7rem; font-weight:800; letter-spacing:.1em; color:var(--gc-red,#e30b13); text-transform:uppercase; margin-bottom:.6rem; }
.bt-how-icon { width:52px; height:52px; background:#eaf0f9; color:#2F5080; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:1.2rem; margin:0 auto .75rem; }
.bt-how-title { font-size:.9rem; font-weight:700; margin-bottom:.4rem; }
.bt-how-desc { font-size:.8rem; color:#6b7280; line-height:1.5; }
.bt-how-arrow { align-self:center; color:#d1d5db; font-size:1.25rem; padding:.5rem; margin-top:-2rem; flex-shrink:0; }
@media(max-width:767px) { .bt-how-arrow { display:none; } .bt-how-step { min-width:140px; } }

/* ── Tutor voices ─────────────────────────────────────────── */
.bt-voice-card { background:#fff; border:1px solid #e8ecf0; border-radius:12px; padding:1.75rem; height:100%; }
.bt-voice-quote { font-size:2rem; color:#e8ecf0; line-height:1; margin-bottom:.75rem; }
.bt-voice-text { font-size:.9rem; color:#374151; line-height:1.7; font-style:italic; flex:1; margin-bottom:1.25rem; }
.bt-voice-author { display:flex; align-items:center; gap:.75rem; }
.bt-voice-av { width:40px; height:40px; background:#2F5080; color:#fff; border-radius:50%; display:flex; align-items:center; justify-content:center; font-weight:700; font-size:.9rem; flex-shrink:0; }

/* ── FAQ ──────────────────────────────────────────────────── */
.bt-faq-item { border-bottom:1px solid #e8ecf0; }
.bt-faq-q {
  width:100%; background:none; border:none; text-align:left;
  padding:1.1rem 0;
  font-size:.95rem; font-weight:600; color:#1e2a3a;
  display:flex; justify-content:space-between; align-items:center;
  cursor:pointer; gap:1rem;
}
.bt-faq-q:hover { color:#2F5080; }
.bt-faq-icon { flex-shrink:0; font-size:1.1rem; color:#2F5080; transition:transform .2s; }
.bt-faq-q:not(.collapsed) .bt-faq-icon { transform:rotate(45deg); }
.bt-faq-a { padding:.25rem 0 1.25rem; font-size:.9rem; color:#6b7280; line-height:1.7; }

/* ── Final CTA ────────────────────────────────────────────── */
.bt-final-cta { padding:5rem 0; }
.bt-final-inner {
  background:linear-gradient(135deg,#0f1929,#2F5080);
  border-radius:20px;
  padding:4rem 2rem;
  text-align:center;
  position:relative;
  overflow:hidden;
}
.bt-final-inner::before { content:''; position:absolute; inset:0; background:radial-gradient(circle at 30% 50%,rgba(59,130,246,.2),transparent 60%); pointer-events:none; }
.bt-final-title { font-size:clamp(1.5rem,3vw,2.25rem); font-weight:800; color:#fff; margin-bottom:1rem; }
.bt-final-sub { font-size:1rem; color:rgba(255,255,255,.75); margin-bottom:2rem; max-width:540px; margin-left:auto; margin-right:auto; }
.bt-final-checks { display:flex; gap:1.5rem; justify-content:center; flex-wrap:wrap; margin-top:1.5rem; }
.bt-final-checks span { font-size:.85rem; color:rgba(255,255,255,.8); }
