.bn-about-page { background: var(--bn-cream); }
.bn-about-main { overflow: hidden; }
.bn-about-intro { padding: clamp(72px, 9vw, 142px) 0 clamp(90px, 11vw, 168px); background: var(--bn-cream); }
.bn-about-page-label { margin: 0 0 clamp(48px, 7vw, 92px); color: var(--bn-forest); font-size: 13px; font-weight: 700; letter-spacing: .2em; text-align: center; text-transform: uppercase; }
.bn-about-grid { display: grid; grid-template-columns: minmax(0, .88fr) minmax(0, 1.12fr); align-items: center; gap: clamp(44px, 8vw, 124px); }
.bn-about-visual { position: relative; aspect-ratio: 1 / 1; overflow: hidden; border-radius: 26px; background: var(--bn-paper); }
.bn-about-visual img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center; image-rendering: auto; }
.bn-about-app-stage { display: grid; place-items: center; background: #f5f2e9; isolation: isolate; }
.bn-about-app-stage::before { position: absolute; width: 68%; aspect-ratio: 1; border-radius: 50%; background: #e4ead0; content: ''; opacity: .82; }
.bn-about-app-phone { position: relative; z-index: 2; width: min(44%, 250px); aspect-ratio: 382 / 816; filter: drop-shadow(0 24px 22px rgba(18,63,52,.18)); }
.bn-about-app-phone img { object-fit: contain; }
.bn-about-app-trigger { position: absolute; z-index: 3; inset: 0; display: block; width: 100%; height: 100%; padding: 0; border: 0; border-radius: 0; background: transparent; cursor: pointer; }
.bn-about-app-trigger:focus-visible { outline: 3px solid #8ad6bc; outline-offset: 6px; }
.bn-about-bird-card { position: absolute; z-index: 4; display: block; width: clamp(56px, 16%, 82px); aspect-ratio: 4 / 5; padding: 4px; border: 0; border-radius: 14px; background: #fffdf8; box-shadow: 0 14px 24px rgba(18,63,52,.16); cursor: pointer; opacity: 0; visibility: hidden; pointer-events: none; transition: opacity .18s ease, visibility 0s linear .18s, box-shadow .25s ease, filter .25s ease; }
.bn-about-bird-card img { border-radius: 12px; object-fit: contain; object-position: center; }
.bn-about-app-stage.is-ready .bn-about-bird-card { opacity: 1; visibility: visible; pointer-events: auto; transition-delay: 0s; }
.bn-about-bird-card:hover { box-shadow: 0 18px 30px rgba(18,63,52,.22); filter: saturate(1.08); }
.bn-about-bird-card:focus-visible { outline: 3px solid #8ad6bc; outline-offset: 5px; }
.bn-about-bird-card--north { top: 7%; left: 10%; transform: rotate(-5deg); }
.bn-about-bird-card--east { top: 40%; right: 7%; transform: rotate(7deg); }
.bn-about-bird-card--south { right: 10%; bottom: 7%; transform: rotate(5deg); }
.bn-about-bird-card--west { top: 55%; left: 7%; transform: rotate(-7deg); }
.bn-about-app-stage.is-flying .bn-about-bird-card--north { animation: bn-about-app-bird-north 1450ms cubic-bezier(.25,.8,.3,1) both; }
.bn-about-app-stage.is-flying .bn-about-bird-card--east { animation: bn-about-app-bird-east 1450ms cubic-bezier(.25,.8,.3,1) 70ms both; }
.bn-about-app-stage.is-flying .bn-about-bird-card--south { animation: bn-about-app-bird-south 1450ms cubic-bezier(.25,.8,.3,1) 140ms both; }
.bn-about-app-stage.is-flying .bn-about-bird-card--west { animation: bn-about-app-bird-west 1450ms cubic-bezier(.25,.8,.3,1) 210ms both; }
.bn-about-copy { max-width: 660px; }
.bn-about-kicker { display: flex; align-items: center; gap: 12px; margin: 0 0 18px; color: var(--bn-accent); font-size: 12px; font-weight: 700; letter-spacing: .17em; line-height: 1.4; text-transform: uppercase; }
.bn-about-kicker::before { width: 20px; height: 1px; background: currentColor; content: ''; }
.bn-about-copy h1, .bn-about-copy h2 { margin: 0; color: var(--bn-forest); font-family: var(--bn-sans); font-size: clamp(40px, 5vw, 72px); font-weight: 750; letter-spacing: -.065em; line-height: .98; }
.bn-about-copy h1 em, .bn-about-copy h2 em { display: block; color: var(--bn-accent); font-family: var(--bn-serif); font-size: 1.03em; font-weight: 500; letter-spacing: -.055em; line-height: .98; }
.bn-about-copy p { max-width: 650px; margin: 28px 0 0; color: var(--bn-muted); font-size: 16px; line-height: 1.78; }
.bn-about-copy p + p { margin-top: 18px; }
.bn-about-mission { padding: clamp(86px, 11vw, 164px) 0; background: #19341b; }
.bn-about-mission .bn-about-grid { grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); }
.bn-about-mission .bn-about-visual { background: #19341b; }
.bn-about-mission-visual { isolation: isolate; }
.bn-about-mission-trigger { position: absolute; z-index: 5; inset: 0; display: block; width: 100%; height: 100%; padding: 0; border: 0; border-radius: inherit; background: transparent; cursor: pointer; }
.bn-about-mission-trigger:focus-visible { outline: 3px solid #a1bf55; outline-offset: -8px; }
.bn-about-mission-bird { position: absolute; z-index: 4; width: clamp(42px, 13%, 72px); height: auto; opacity: 0; visibility: hidden; pointer-events: none; filter: drop-shadow(0 8px 8px rgba(0,0,0,.12)); }
.bn-about-mission-visual img.bn-about-mission-bird { width: clamp(42px, 13%, 72px); height: auto; object-fit: contain; }
.bn-about-mission-visual.is-flying .bn-about-mission-bird { visibility: visible; animation-duration: 1800ms; animation-timing-function: cubic-bezier(.25,.72,.25,1); animation-fill-mode: both; }
.bn-about-mission-bird--one { top: 29%; left: 6%; transform: rotate(-8deg) scale(.72); }
.bn-about-mission-bird--two { top: 43%; right: auto; left: 6%; transform: rotate(7deg) scale(.66); }
.bn-about-mission-bird--three { top: 23%; right: auto; bottom: auto; left: 6%; transform: rotate(-4deg) scale(.58); }
.bn-about-mission-visual.is-flying .bn-about-mission-bird--one { animation-name: bn-about-mission-flight-one; }
.bn-about-mission-visual.is-flying .bn-about-mission-bird--two { animation-name: bn-about-mission-flight-two; animation-delay: 450ms; }
.bn-about-mission-visual.is-flying .bn-about-mission-bird--three { animation-name: bn-about-mission-flight-three; animation-delay: 900ms; }
.bn-about-mission .bn-about-copy h2 { color: #fffdf4; }
.bn-about-mission .bn-about-copy p { color: rgba(255,253,244,.75); }
.bn-about-mission .bn-about-kicker { color: #a1bf55; }
.bn-about-goal { display: grid; gap: 8px; margin-top: 34px; padding-top: 22px; border-top: 1px solid rgba(255,255,255,.24); }
.bn-about-goal span { color: #a1bf55; font-size: 12px; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; }
.bn-about-goal strong { color: #fffdf4; font-family: var(--bn-serif); font-size: clamp(24px, 3vw, 40px); font-weight: 500; letter-spacing: -.04em; line-height: 1.08; }
@keyframes bn-about-app-bird-north {
  0% { top: 7%; left: 10%; transform: rotate(-5deg) scale(.82); }
  100% { top: 5%; left: 10%; transform: rotate(10deg) scale(.94) translateY(-4px); }
}
@keyframes bn-about-app-bird-east {
  0% { top: 40%; right: 7%; transform: rotate(7deg) scale(.82); }
  100% { top: 40%; right: 5.5%; transform: rotate(16deg) scale(.94) translateX(4px); }
}
@keyframes bn-about-app-bird-south {
  0% { right: 10%; bottom: 7%; transform: rotate(5deg) scale(.82); }
  100% { right: 10%; bottom: 5.5%; transform: rotate(-8deg) scale(.94) translateY(4px); }
}
@keyframes bn-about-app-bird-west {
  0% { top: 55%; left: 7%; transform: rotate(-7deg) scale(.82); }
  100% { top: 55%; left: 5.5%; transform: rotate(-16deg) scale(.94) translateX(-4px); }
}
@keyframes bn-about-mission-flight-one {
  0% { top: 29%; left: 6%; opacity: 0; transform: rotate(-8deg) scale(.72); }
  12% { opacity: 1; }
  100% { top: 29%; left: 46%; opacity: 1; transform: rotate(8deg) scale(.88); }
}
@keyframes bn-about-mission-flight-two {
  0% { top: 43%; right: auto; left: 6%; opacity: 0; transform: rotate(7deg) scale(.66); }
  12% { opacity: 1; }
  100% { top: 43%; right: auto; left: 61%; opacity: 1; transform: rotate(18deg) scale(.82); }
}
@keyframes bn-about-mission-flight-three {
  0% { top: 23%; right: auto; bottom: auto; left: 6%; opacity: 0; transform: rotate(-4deg) scale(.58); }
  12% { opacity: 1; }
  100% { top: 23%; right: auto; bottom: auto; left: 62%; opacity: 1; transform: rotate(12deg) scale(.76); }
}
@media (max-width: 820px) {
  .bn-about-intro { padding-block: 68px 86px; }
  .bn-about-page-label { margin-bottom: 46px; }
  .bn-about-grid, .bn-about-mission .bn-about-grid { grid-template-columns: 1fr; gap: 38px; }
  .bn-about-visual { width: min(100%, 520px); margin-inline: auto; }
  .bn-about-copy { max-width: none; }
  .bn-about-copy h1, .bn-about-copy h2 { font-size: clamp(42px, 11vw, 66px); }
  .bn-about-mission { padding-block: 76px 92px; }
  .bn-about-mission .bn-about-visual { order: 2; }
  .bn-about-mission .bn-about-copy { order: 1; }
}