/* ============================================================
   Branding — Bt mark, wordmark, green bands, headline type, CTA
   ============================================================ */

/* ---- Bt logo mark ---- */
.brand-mark {
  width: 56px; height: 56px; border-radius: 14px;
  background: linear-gradient(150deg, var(--green-bright), var(--green));
  color: #fff; font-weight: 800; font-size: 28px; line-height: 1;
  display: grid; place-items: center; letter-spacing: -.05em;
  flex: 0 0 auto;
  box-shadow: inset 0 1.5px 0 rgba(255,255,255,.28), 0 8px 18px -8px rgba(15,138,75,.65);
}
.brand-word { font-weight: 700; font-size: 30px; letter-spacing: -.02em; color: #fff; }

.brand-lockup { display: flex; align-items: center; gap: 15px; }
.brand-lockup.lg .brand-mark { width: 76px; height: 76px; font-size: 38px; border-radius: 19px; }
.brand-lockup.lg .brand-word { font-size: 42px; }

/* ---- green band ---- */
.band {
  background:
    radial-gradient(135% 130% at 28% -10%, #0e5132 0%, var(--deep-1) 48%, var(--deep-2) 100%);
  color: #fff;
  padding: var(--pad);
  display: flex; flex-direction: column; justify-content: center;
  gap: 22px;
}
.band-title { font-size: var(--h1); line-height: var(--h1-lh); font-weight: 800; letter-spacing: -.02em; }
.band-title.big { font-size: calc(var(--h1) * 1.16); }
.band .hl { color: var(--green-glow); }
.band-sub { font-size: var(--band-sub); font-weight: 400; color: #c7e2d2; }
.band-sub b { color: #fff; font-weight: 700; }

/* ---- headline on white (slides B, C top) ---- */
.hl { color: var(--green); }
.b-title, .c-title {
  font-size: var(--h1); line-height: var(--h1-lh);
  font-weight: 800; letter-spacing: -.02em; color: var(--ink);
}
.c-title { font-weight: 800; }
.c-title .hl { color: var(--green); }

/* ---- CTA button ---- */
.cta {
  align-self: flex-start;
  display: inline-flex; align-items: center; gap: 14px;
  background: linear-gradient(180deg, var(--green-bright), #15924f);
  color: #fff; border: 0; border-radius: 16px;
  padding: 21px 32px; font-size: 25px; font-weight: 700; letter-spacing: -.01em;
  box-shadow: 0 16px 34px -12px rgba(31,177,95,.7), inset 0 1px 0 rgba(255,255,255,.25);
}
.cta-arrow { font-size: 1.15em; transition: transform .25s; }
.cta:hover .cta-arrow { transform: translateX(5px); }