@import url("https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght@0,9..144,600;0,9..144,700;1,9..144,600&family=Manrope:wght@400;500;600;700;800&display=swap");

:root {
  --bt-ink: #071f33;
  --bt-cream: #f6f0e6;
  --bt-paper: #fffaf2;
  --bt-green: #087f69;
  --bt-mint: #d6f1df;
  --bt-coral: #ff705d;
  --bt-yellow: #ffd75f;
  --bt-blue: #b8dff2;
  --bt-line: rgba(7, 31, 51, 0.24);
  --bt-muted: #50677a;
  --bt-shell: 1440px;
  --bt-serif: "Fraunces", Georgia, serif;
  --bt-sans: "Manrope", sans-serif;
}

html { scroll-behavior: smooth; }

body {
  margin: 0;
  color: var(--bt-ink);
  background:
    radial-gradient(circle at 12% 8%, rgba(255, 215, 95, 0.17), transparent 26rem),
    radial-gradient(circle at 92% 18%, rgba(214, 241, 223, 0.55), transparent 30rem),
    var(--bt-cream);
  font-family: var(--bt-sans);
}

body::before { display: none; }

h1, h2, h3, .journey-band {
  color: var(--bt-ink);
  font-family: var(--bt-serif);
  letter-spacing: -0.045em;
}

a { color: inherit; }

.announcement {
  width: 100%;
  padding: 10px 16px;
  color: #fff;
  background: var(--bt-ink);
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.17em;
  text-align: center;
  text-transform: uppercase;
}

.announcement span { margin: 0 12px; color: var(--bt-yellow); }

.site-header {
  position: relative;
  top: 0;
  z-index: 20;
  width: min(var(--bt-shell), calc(100% - 64px));
  min-height: 82px;
  margin: 0 auto;
  padding: 16px 0;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  background: transparent;
}

.site-header .brand,
.site-footer .brand {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-weight: 800;
  text-decoration: none;
}

.site-header .brand img,
.site-footer .brand img { width: 42px; height: 42px; }

.site-header nav { display: flex; align-items: center; gap: 10px; }

.site-header nav a {
  padding: 10px 13px;
  border-radius: 999px;
  font-size: 0.84rem;
  font-weight: 800;
  text-decoration: none;
}

.site-header nav a:hover,
.site-header nav a:focus-visible { background: rgba(214, 241, 223, 0.72); }

.site-header nav .nav-portal {
  margin-left: 18px;
  padding: 12px 18px;
  border: 1px solid var(--bt-ink);
  background: rgba(255, 250, 242, 0.6);
}

.hero,
.intro-band,
.program-flow,
.split-section,
.rules-strip,
.trust-panel,
.reward-panel,
.faq-section,
.form-section,
.contact-section,
.site-footer {
  width: min(var(--bt-shell), calc(100% - 64px));
  margin-right: auto;
  margin-left: auto;
}

.hero {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(360px, 0.95fr);
  align-items: center;
  gap: clamp(40px, 7vw, 110px);
  min-height: 0;
  padding: clamp(54px, 6vw, 88px) 0 64px;
}

.hero-copy, .hero-visual { padding: 0; border: 0; background: transparent; box-shadow: none; }
.hero-copy::before, .hero-visual::after { display: none; }

.eyebrow {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 0 0 22px;
  color: var(--bt-green);
  font-size: 0.73rem;
  font-weight: 800;
  letter-spacing: 0.16em;
  text-transform: uppercase;
}

.eyebrow::before {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--bt-green);
  content: "";
}

.hero h1 {
  max-width: 690px;
  margin: 0;
  font-size: clamp(4rem, 7vw, 7.4rem);
  line-height: 0.83;
}

.hero h1 em { color: var(--bt-green); font-weight: 600; }

.hero-lede {
  max-width: 640px;
  margin: 34px 0 0;
  color: var(--bt-muted);
  font-size: clamp(1.05rem, 1.8vw, 1.3rem);
  line-height: 1.65;
}

.hero-actions { display: flex; align-items: center; gap: 22px; margin-top: 34px; }

.button, .submit {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 24px;
  min-height: 54px;
  padding: 0 24px;
  border: 1px solid var(--bt-ink);
  border-radius: 999px;
  color: var(--bt-ink);
  font-family: var(--bt-sans);
  font-size: 0.92rem;
  font-weight: 800;
  text-decoration: none;
}

.button.primary, .submit {
  background: var(--bt-coral);
  box-shadow: 0 8px 0 var(--bt-ink);
}

.button.secondary { border: 0; background: transparent; }
.button:hover, .submit:hover { transform: translateY(-2px); }

.hero-disclosure { margin-top: 28px; color: var(--bt-muted); font-size: 0.72rem; }

.hero-visual {
  position: relative;
  transform: rotate(2deg);
}

.hero-visual::before {
  position: absolute;
  inset: -8% 0 0 8%;
  z-index: -1;
  border: 1px solid var(--bt-line);
  border-radius: 50%;
  content: "";
}

.hero-visual img {
  width: 100%;
  border: 1px solid var(--bt-ink);
  border-radius: 28px;
  background: var(--bt-mint);
  box-shadow: 12px 12px 0 var(--bt-yellow);
}

.journey-band {
  width: 100%;
  padding: 18px 24px;
  border-top: 1px solid var(--bt-ink);
  border-bottom: 1px solid var(--bt-ink);
  color: var(--bt-ink);
  background: var(--bt-yellow);
  font-size: clamp(1.1rem, 2.2vw, 1.7rem);
  font-style: italic;
  font-weight: 600;
  text-align: center;
}

.journey-band span { margin: 0 clamp(14px, 3vw, 34px); font-family: var(--bt-sans); font-size: 0.8rem; }

.intro-band { padding: clamp(48px, 4.5vw, 64px) 0 48px; }

.section-heading {
  display: grid;
  max-width: none;
  grid-template-areas:
    "eyebrow copy"
    "title copy";
  grid-template-columns: minmax(0, 1.55fr) minmax(280px, 0.55fr);
  align-items: start;
  column-gap: clamp(32px, 4vw, 64px);
  row-gap: 10px;
  margin-bottom: 28px;
}

.section-heading .eyebrow { grid-area: eyebrow; margin-bottom: 0; }
.section-heading h2 { grid-area: title; max-width: 920px; }

.section-heading h2 {
  margin: 0;
  font-size: clamp(2.75rem, 4vw, 4.25rem);
  line-height: 0.95;
}

.form-intro h2,
.split-section h2,
.trust-panel h2,
.reward-panel h2,
.contact-section h2 {
  margin: 0;
  font-size: clamp(2.75rem, 4.5vw, 4.8rem);
  line-height: 0.94;
}

.section-heading > p:last-child {
  grid-area: copy;
  align-self: end;
  max-width: 34rem;
  margin: 0;
  color: var(--bt-muted);
  font-size: 1rem;
  line-height: 1.65;
}

.steps {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  border: 1px solid var(--bt-ink);
}

.steps article {
  display: flex;
  min-height: 310px;
  padding: 26px 22px 24px;
  border-right: 1px solid var(--bt-ink);
  border-radius: 0;
  background: rgba(255, 250, 242, 0.56);
  box-shadow: none;
  flex-direction: column;
}

.steps article:nth-child(2) { background: rgba(214, 241, 223, 0.7); }
.steps article:nth-child(3) { background: rgba(184, 223, 242, 0.56); }
.steps article:nth-child(4) { background: rgba(255, 112, 93, 0.14); }
.steps article:nth-child(5) { border-right: 0; background: rgba(255, 215, 95, 0.38); }
.steps article > span { font-family: var(--bt-serif); font-size: 1.1rem; font-style: italic; }

.step-art { position: relative; width: 110px; height: 94px; margin: 8px auto 16px; }
.step-art i, .step-art b, .step-art small { position: absolute; display: block; }
.step-person i { top: 2px; left: 43px; width: 40px; height: 40px; border: 1px solid var(--bt-ink); border-radius: 50%; background: var(--bt-coral); }
.step-person b { top: 43px; left: 24px; width: 75px; height: 48px; border: 1px solid var(--bt-ink); border-radius: 44px 44px 10px 10px; background: var(--bt-mint); }
.step-person small { right: 0; bottom: 0; width: 29px; height: 29px; border: 1px solid var(--bt-ink); border-radius: 50%; background: var(--bt-yellow); font-weight: 900; line-height: 29px; text-align: center; }
.step-invite i { top: 24px; left: 14px; width: 82px; height: 56px; border: 1px solid var(--bt-ink); border-radius: 7px; background: #fff; transform: rotate(-5deg); }
.step-invite i::after { position: absolute; inset: 0; background: linear-gradient(35deg, transparent 49%, var(--bt-ink) 50%, transparent 51%), linear-gradient(-35deg, transparent 49%, var(--bt-ink) 50%, transparent 51%); content: ""; }
.step-invite b { top: 8px; right: 2px; width: 18px; height: 18px; border: 1px solid var(--bt-ink); border-radius: 50%; background: var(--bt-coral); }
.step-invite small { bottom: 0; left: 0; width: 18px; height: 18px; border: 1px solid var(--bt-ink); border-radius: 50%; background: var(--bt-yellow); }
.step-product i { top: 24px; left: 27px; width: 58px; height: 58px; border: 1px solid var(--bt-ink); background: var(--bt-coral); }
.step-product b { top: 11px; left: 18px; width: 72px; height: 32px; border: 1px solid var(--bt-ink); background: var(--bt-yellow); transform: skew(-12deg); }
.step-product small { inset: 2px 6px 2px 5px; border: 1px solid var(--bt-line); border-radius: 50%; }
.step-feedback i { top: 16px; left: 16px; width: 82px; height: 60px; border: 1px solid var(--bt-ink); border-radius: 10px; background: var(--bt-mint); }
.step-feedback i::after { position: absolute; right: 10px; bottom: -13px; border-width: 14px 3px 0 14px; border-style: solid; border-color: var(--bt-ink) transparent transparent transparent; content: ""; }
.step-feedback b { right: 0; bottom: 6px; color: var(--bt-coral); font-size: 24px; }
.step-refund i { top: 18px; left: 18px; width: 72px; height: 56px; border: 1px solid var(--bt-ink); border-radius: 9px; background: #fff; color: var(--bt-green); font-family: var(--bt-serif); font-size: 34px; font-style: normal; font-weight: 700; line-height: 56px; text-align: center; }
.step-refund i::after { position: absolute; inset: 8px; border: 1px dashed var(--bt-line); content: ""; }
.step-refund b { right: 0; bottom: 3px; width: 29px; height: 29px; border: 1px solid var(--bt-ink); border-radius: 50%; background: var(--bt-mint); line-height: 29px; text-align: center; }

.steps h3 { min-height: 2.2em; margin: auto 0 12px; font-size: clamp(1.45rem, 2vw, 2rem); line-height: 1.05; }
.steps p { margin: 0; color: var(--bt-muted); font-size: 0.83rem; line-height: 1.55; }

.program-flow, .split-section, .trust-panel, .reward-panel, .faq-section, .contact-section {
  margin-bottom: 56px;
  padding: clamp(32px, 3vw, 48px);
  border: 1px solid var(--bt-ink);
  border-radius: 28px;
  background: rgba(255, 250, 242, 0.75);
  box-shadow: 10px 10px 0 var(--bt-yellow);
}

.flow-cards, .rules-strip { gap: 0; }
.flow-cards article, .rules-strip article { border-color: var(--bt-line); border-radius: 0; background: transparent; box-shadow: none; }

.split-section { background: var(--bt-ink); color: #fff; box-shadow: 10px 10px 0 var(--bt-coral); }
.split-section h2 { font-size: clamp(2.75rem, 4.2vw, 4.7rem); }
.split-section h2, .split-section strong { color: #fff; }
.split-section p { color: rgba(255,255,255,.76); }
.split-section .eyebrow { color: var(--bt-yellow); }
.split-section .eyebrow::before { background: var(--bt-yellow); }

.trust-panel { background: var(--bt-mint); }
.reward-panel { background: var(--bt-yellow); }

.faq-section { display: block; }
.faq-section .section-heading { margin-bottom: 20px; }
.faq-list { border-top: 1px solid var(--bt-ink); }
.faq-list details { padding: 0; border: 0; border-bottom: 1px solid var(--bt-ink); background: transparent; box-shadow: none; }
.faq-list summary { padding: 24px 0; font-family: var(--bt-serif); font-size: clamp(1.35rem, 2.6vw, 2.15rem); }
.faq-list details p { max-width: 800px; padding: 0 0 26px; color: var(--bt-muted); line-height: 1.65; }

.form-section {
  display: grid;
  grid-template-columns: minmax(280px, .75fr) minmax(520px, 1.25fr);
  gap: clamp(44px, 7vw, 100px);
  align-items: start;
  margin-bottom: 100px;
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
}

.form-intro { position: sticky; top: 30px; }
.form-intro h2 { margin-bottom: 28px; }
.form-intro > p { color: var(--bt-muted); line-height: 1.65; }

.preapply-summary {
  margin-top: 36px;
  padding: 24px;
  border: 1px solid var(--bt-ink);
  border-radius: 20px;
  background: var(--bt-mint);
}

.application-form {
  padding: clamp(28px, 4vw, 48px);
  border: 1px solid var(--bt-ink);
  border-radius: 30px;
  background: rgba(255, 250, 242, 0.92);
  box-shadow: 11px 11px 0 var(--bt-yellow);
}

.application-form label, .application-form legend { color: var(--bt-ink); font-size: 0.8rem; font-weight: 800; }
.application-form input, .application-form select, .application-form textarea {
  border: 1px solid rgba(7, 31, 51, 0.45);
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.8);
  font-family: var(--bt-sans);
}
.application-form input:focus, .application-form select:focus, .application-form textarea:focus { border-color: var(--bt-green); box-shadow: 0 0 0 4px rgba(8, 127, 105, 0.13); }
.field-help { display: block; min-height: 2.9em; margin: 6px 0 8px; color: var(--bt-muted); font-size: 0.69rem; font-weight: 500; line-height: 1.45; }
.form-field { min-width: 0; }
.field-label-with-info { display: flex; align-items: center; gap: 8px; min-height: 28px; }
.field-label-with-info label { margin: 0; }
.info-tooltip {
  position: relative;
  display: inline-grid;
  width: 24px;
  height: 24px;
  padding: 0;
  place-items: center;
  border: 1px solid var(--bt-ink);
  border-radius: 50%;
  color: var(--bt-ink);
  background: var(--bt-mint);
  font: 800 0.78rem/1 var(--bt-sans);
  cursor: help;
}
.info-tooltip-content {
  position: absolute;
  z-index: 30;
  bottom: calc(100% + 10px);
  left: 50%;
  width: min(310px, calc(100vw - 48px));
  padding: 13px 15px;
  border: 1px solid var(--bt-ink);
  border-radius: 14px;
  color: #fff;
  background: var(--bt-ink);
  box-shadow: 0 10px 28px rgba(7, 31, 51, 0.2);
  font: 600 0.76rem/1.5 var(--bt-sans);
  text-align: left;
  transform: translate(-50%, 4px);
  visibility: hidden;
  opacity: 0;
  pointer-events: none;
  transition: opacity 150ms ease, transform 150ms ease, visibility 150ms ease;
}
.info-tooltip:hover .info-tooltip-content,
.info-tooltip:focus .info-tooltip-content,
.info-tooltip:focus-visible .info-tooltip-content {
  transform: translate(-50%, 0);
  visibility: visible;
  opacity: 1;
}
.choice-grid label { border-color: var(--bt-line); border-radius: 13px; background: rgba(255,255,255,.62); }
.choice-grid label:hover { border-color: var(--bt-green); background: var(--bt-mint); }
.other-category-field { margin-top: 12px; }
.other-category-field[hidden] { display: none; }
.consent a { color: var(--bt-green); font-weight: 800; }

.contact-section { background: var(--bt-blue); box-shadow: 10px 10px 0 var(--bt-coral); }
.contact-section h2 { margin-bottom: 18px; }
.contact-actions { display: flex; min-width: 230px; gap: 13px; align-items: stretch; flex-direction: column; }
.contact-faq-button { background: rgba(255, 250, 242, 0.78); }

.site-footer {
  padding: 36px 0 50px;
  border-top: 1px solid var(--bt-ink);
}

.site-footer nav, .site-footer > div { display: flex; gap: 18px; flex-wrap: wrap; }
.site-footer a { font-size: 0.82rem; font-weight: 800; }

.inner-header {
  width: min(100% - 48px, 1180px);
  margin: 0 auto;
}

.inner-hero {
  display: grid;
  grid-template-columns: minmax(0, 1.3fr) minmax(280px, .7fr);
  gap: 48px;
  align-items: end;
  width: min(100% - 48px, 1180px);
  margin: 0 auto;
  padding: 104px 0 82px;
}

.inner-hero h1 {
  max-width: 850px;
  margin: 0;
  font-size: clamp(4rem, 8vw, 7.6rem);
  line-height: .86;
}

.inner-hero p {
  margin: 0 0 10px;
  color: var(--bt-muted);
  font-size: 1.05rem;
  line-height: 1.65;
}

.content-wrap {
  width: min(100% - 48px, 980px);
  margin: 0 auto 100px;
}

.content-card {
  padding: clamp(32px, 6vw, 66px);
  border: 1px solid var(--bt-ink);
  border-radius: 30px;
  background: rgba(255, 250, 242, .9);
  box-shadow: 10px 10px 0 var(--bt-yellow);
}

.content-card h2 {
  margin: 40px 0 10px;
  font-family: var(--bt-serif);
  font-size: clamp(2rem, 4vw, 3.25rem);
  letter-spacing: -.04em;
}

.content-card h2:first-of-type { margin-top: 0; }
.content-card p, .content-card li { color: var(--bt-muted); line-height: 1.72; }
.content-note { margin-bottom: 34px; padding: 20px 22px; border-left: 4px solid var(--bt-green); background: var(--bt-mint); color: var(--bt-ink); }
.content-actions { display: flex; gap: 14px; flex-wrap: wrap; margin-top: 40px; }

.faq-page .inner-hero { grid-template-columns: 1fr; }
.faq-page .content-card { padding-top: 20px; }
.faq-page .faq-list details { border-color: var(--bt-ink); }
.faq-page .faq-list summary { font-family: var(--bt-serif); font-size: clamp(1.45rem, 3vw, 2.25rem); }
.faq-page .faq-list details p { padding-right: 54px; }

.simple-page {
  display: block;
  min-height: 100vh;
  padding: 0;
}

.legal-page {
  width: min(1080px, calc(100% - 48px));
  margin: 80px auto 100px;
  padding: clamp(34px, 6vw, 70px);
  border: 1px solid var(--bt-ink);
  border-radius: 30px;
  background: rgba(255, 250, 242, 0.88);
  box-shadow: 11px 11px 0 var(--bt-yellow);
}

.legal-page .brand { margin-bottom: 50px; }
.legal-page h1 { max-width: 850px; margin: 0 0 46px; font-size: clamp(3.4rem, 8vw, 7rem); line-height: .9; }
.legal-page h2 { margin: 46px 0 12px; font-family: var(--bt-serif); font-size: clamp(2rem, 4vw, 3.4rem); letter-spacing: -.04em; }
.legal-page p, .legal-page li { color: var(--bt-muted); line-height: 1.75; }
.legal-page .content-note { margin-bottom: 36px; padding: 22px; border-left: 4px solid var(--bt-green); background: var(--bt-mint); color: var(--bt-ink); }
.legal-page .back-link { display: inline-flex; margin-top: 40px; font-weight: 800; }

.faq-page .faq-list { margin-top: 20px; }
.faq-page .faq-list details p { margin: 0; }

@media (max-width: 1040px) {
  .hero { grid-template-columns: 1fr; }
  .hero-visual { width: min(620px, 92%); margin: 0 auto; }
  .section-heading {
    grid-template-areas: "eyebrow" "title" "copy";
    grid-template-columns: 1fr;
    row-gap: 12px;
  }
  .section-heading > p:last-child { max-width: 680px; }
  .steps { grid-template-columns: repeat(2, 1fr); }
  .steps article:nth-child(2), .steps article:nth-child(4) { border-right: 0; }
  .steps article:nth-child(5) { grid-column: 1 / -1; }
  .form-section { grid-template-columns: 1fr; }
  .form-intro { position: static; }
}

@media (max-width: 760px) {
  .announcement { font-size: .6rem; }
  .site-header { width: min(100% - 28px, 1180px); align-items: flex-start; flex-direction: column; }
  .inner-header { width: min(100% - 28px, 1180px); }
  .site-header nav { width: 100%; overflow-x: auto; }
  .site-header nav .nav-portal { margin-left: 0; }
  .hero, .intro-band, .program-flow, .split-section, .rules-strip, .trust-panel, .reward-panel, .faq-section, .form-section, .contact-section, .site-footer { width: min(100% - 24px, 1180px); }
  .hero { min-height: 0; padding: 40px 0 46px; }
  .hero h1 { font-size: clamp(3.25rem, 15vw, 4.8rem); }
  .hero-lede { margin-top: 24px; line-height: 1.55; }
  .hero-actions { align-items: stretch; gap: 14px; margin-top: 26px; flex-direction: column; }
  .hero-disclosure { margin-top: 24px; }
  .journey-band { overflow: hidden; padding: 12px 10px; font-size: .82rem; white-space: nowrap; }
  .journey-band span { margin: 0 3px; }
  .intro-band { padding: 42px 0 38px; }
  .section-heading { gap: 10px; margin-bottom: 24px; }
  .section-heading h2 { font-size: clamp(2.55rem, 11.5vw, 3.45rem); line-height: .96; }
  .section-heading > p:last-child { margin-top: 4px; font-size: .94rem; line-height: 1.55; }
  .steps { grid-template-columns: 1fr; }
  .steps article { min-height: 0; padding: 22px 20px; border-right: 0; border-bottom: 1px solid var(--bt-ink); }
  .steps article:nth-child(5) { grid-column: auto; border-bottom: 0; }
  .steps h3, .steps p { min-height: 0; }
  .steps h3 { margin-top: 8px; }
  .step-art { margin: 2px auto 8px; transform: scale(.9); }
  .program-flow, .split-section, .trust-panel, .reward-panel, .faq-section, .contact-section { margin-bottom: 42px; padding: 24px 20px; border-radius: 22px; }
  .program-flow .section-heading { margin-bottom: 22px; }
  .flow-cards { grid-template-columns: 1fr; }
  .flow-cards article { min-height: 0; padding: 20px; }
  .flow-cards span { margin-bottom: 18px; }
  .split-section { gap: 22px; }
  .split-section h2, .form-intro h2, .contact-section h2 { font-size: clamp(2.55rem, 12vw, 3.7rem); }
  .form-section { padding: 0; }
  .application-form { padding: 24px 18px; }
  .field-row, .choice-grid { grid-template-columns: 1fr; }
  .legal-page { width: min(100% - 28px, 1080px); margin-top: 42px; padding: 28px 20px; }
  .inner-hero { grid-template-columns: 1fr; width: min(100% - 28px, 1180px); padding: 64px 0 50px; }
  .inner-hero h1 { font-size: clamp(3.4rem, 16vw, 5.6rem); }
  .content-wrap { width: min(100% - 28px, 980px); }
  .content-card { padding: 28px 20px; }
  .site-footer { align-items: flex-start; flex-direction: column; }
}