.beci-page { background: #101419; color: #f7f4ed; }
.beci-page .site-header { background: rgba(247, 244, 237, 0.97); }
.beci-page .nav-current { color: var(--blue); }

.beci-hero { position: relative; overflow: hidden; padding: 78px 0 88px; }
.beci-grid { position: absolute; inset: 0; opacity: 0.22; background-image: linear-gradient(rgba(180, 138, 81, 0.17) 1px, transparent 1px), linear-gradient(90deg, rgba(180, 138, 81, 0.17) 1px, transparent 1px); background-size: 46px 46px; mask-image: linear-gradient(to bottom, black, transparent 88%); }
.beci-layout { position: relative; z-index: 1; display: grid; grid-template-columns: minmax(0, 1fr) minmax(320px, 480px); gap: clamp(44px, 8vw, 110px); align-items: center; }
.beci-copy { max-width: 690px; }
.beci-copy .eyebrow, .beci-note .eyebrow { color: #d2a866; }
.beci-copy h1 { margin: 18px 0 24px; max-width: 780px; color: #fff; font-family: Georgia, "Times New Roman", serif; font-size: clamp(2.8rem, 6vw, 5.65rem); font-weight: 500; line-height: 0.98; letter-spacing: -0.045em; }
.beci-copy p { max-width: 660px; color: #c7d0d6; font-size: 1.08rem; line-height: 1.75; }
.beci-copy .beci-lead { color: #f0ede6; font-size: clamp(1.16rem, 2.2vw, 1.43rem); line-height: 1.55; }
.beci-actions { display: flex; flex-wrap: wrap; gap: 13px; margin-top: 32px; }
.beci-actions .button { min-width: 168px; justify-content: center; cursor: pointer; }
.beci-actions .button-primary { border-color: #d2a866; background: #d2a866; color: #101419; }
.beci-actions .button-primary:hover, .beci-actions .button-primary:focus-visible { border-color: #eed09f; background: #eed09f; }
.button-quiet { border: 1px solid rgba(255, 255, 255, 0.42); color: #fff; }
.button-quiet:hover, .button-quiet:focus-visible { border-color: #fff; background: #fff; color: #101419; }
.share-status { min-height: 1.65em; margin-top: 12px; color: #d8b77f !important; font-size: 0.9rem !important; }

.video-column { width: min(100%, 480px); justify-self: center; }
.video-frame { overflow: hidden; border: 1px solid rgba(210, 168, 102, 0.58); border-radius: 4px; background: #000; box-shadow: 0 30px 90px rgba(0, 0, 0, 0.58); }
.video-frame video { display: block; width: 100%; aspect-ratio: 9 / 16; background: #000; object-fit: contain; }
.video-facts { display: grid; grid-template-columns: repeat(3, 1fr); border: 1px solid rgba(255, 255, 255, 0.13); border-top: 0; background: rgba(255, 255, 255, 0.045); }
.video-facts span { display: grid; gap: 4px; padding: 15px 11px; color: #abb5bc; font-size: 0.73rem; text-align: center; text-transform: uppercase; letter-spacing: 0.08em; }
.video-facts span + span { border-left: 1px solid rgba(255, 255, 255, 0.13); }
.video-facts strong { color: #fff; font-size: 0.67rem; }

.beci-note { padding: 0 0 92px; background: #101419; }
.note-card { padding: clamp(30px, 6vw, 58px); border-top: 1px solid rgba(210, 168, 102, 0.42); background: #181e25; }
.note-card h2 { max-width: 780px; margin: 14px 0 18px; color: #fff; font-family: Georgia, "Times New Roman", serif; font-size: clamp(1.9rem, 4vw, 3.25rem); font-weight: 500; line-height: 1.08; }
.note-card p:last-child { max-width: 900px; margin-bottom: 0; color: #bec8ce; line-height: 1.7; }
.beci-page .site-footer { border-top: 1px solid rgba(255, 255, 255, 0.09); }

@media (max-width: 900px) {
  .beci-hero { padding-top: 54px; }
  .beci-layout { grid-template-columns: 1fr; }
  .beci-copy { max-width: 760px; }
  .video-column { width: min(100%, 500px); }
}

@media (max-width: 520px) {
  .beci-hero { padding: 40px 0 64px; }
  .beci-copy h1 { font-size: clamp(2.55rem, 14vw, 4rem); }
  .beci-actions { display: grid; }
  .beci-actions .button { width: 100%; }
  .video-facts span { padding: 12px 6px; font-size: 0.64rem; }
  .video-facts strong { font-size: 0.6rem; }
  .beci-note { padding-bottom: 64px; }
}

@media (prefers-reduced-motion: reduce) {
  * { scroll-behavior: auto !important; }
}
