/* Keep the header's original space when it becomes compact. Switching from
   relative to fixed used to remove 194px from the page while scrolling. */
.page-beacon-donations { padding-top: var(--header-height); overflow-anchor: none; }
.page-beacon-donations .site-header {
    position: fixed;
    background: var(--dark);
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
}
.page-beacon-donations .site-main { padding-top: 0; }

/* Match the English content typography used by Facts & Figures and Mission. */
.beacon-intro,
.beacon-donation-section {
    color: var(--muted);
    font-size: 15px;
    font-weight: 400;
    line-height: 2;
    background: var(--white);
}

.beacon-intro h1,
.beacon-donation-section h2 {
    margin: 0 0 8px;
    color: var(--orange);
    font-size: 27.342px;
    font-weight: 700;
    letter-spacing: 0;
    line-height: 1.3;
    text-transform: uppercase;
}

.beacon-intro .container,
.beacon-donation-layout {
    width: min(calc(100% - 48px), var(--container));
}

.beacon-intro { padding: var(--pe-section-edge, 60px) 0 var(--pe-section-pair, 25px); }
.beacon-intro-copy { max-width: 790px; margin: 0; }
.beacon-donation-section { padding: var(--pe-section-pair, 25px) 0 var(--pe-section-edge, 60px); }
.beacon-donation-layout {
    display: grid;
    grid-template-columns: minmax(0, .8fr) minmax(0, 1.5fr);
    gap: 44px;
    align-items: start;
}

.beacon-donation-section h2 { letter-spacing: .015em; }
.beacon-context { padding-top: 24px; }
.beacon-context > p { margin: 0 0 15px; }
.beacon-context > .eyebrow { margin-bottom: 16px; }
.beacon-context > .beacon-contact { margin-top: 25px; }
.beacon-preview-note {
    border-left: 3px solid var(--orange);
    background: #f5f5f5;
    padding: 20px;
    margin: 25px 0;
}
.beacon-preview-note strong { color: #4b4b4b; font-weight: 700; }
.beacon-preview-note p { margin: 8px 0 0; }
.beacon-contact a,
.beacon-fallback a {
    color: var(--orange);
    text-decoration: underline;
    text-underline-offset: 4px;
    overflow-wrap: anywhere;
}
.beacon-contact a:hover,
.beacon-fallback a:hover { color: var(--orange-dark); }

.beacon-donation-card {
    min-width: 0;
    border: 1px solid var(--line);
    padding: 24px;
    scroll-margin-top: calc(var(--header-height) + 24px);
}
.beacon-donation-card h2 { margin-bottom: 20px; }
.beacon-currencies {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
}
.beacon-currencies .button {
    gap: 10px;
    min-height: 50px;
    padding: 10px 12px;
    color: var(--orange);
    background: transparent;
    text-decoration: none;
}
.beacon-currencies .button[aria-current="page"],
.beacon-currencies .button:hover {
    color: var(--white);
    background: var(--orange);
    transform: none;
}
.beacon-currencies a:focus-visible,
.beacon-contact a:focus-visible,
.beacon-fallback a:focus-visible {
    outline: 2px solid var(--orange);
    outline-offset: 4px;
}
.beacon-currency-symbol { font-size: 18px; font-weight: 400; letter-spacing: 0; }
.beacon-currency-help { margin: 15px 0 24px; }
.beacon-currency-help,
.beacon-fallback,
.beacon-load-status { line-height: 1.8; }
[data-beacon-currency-name] { display: block; }
.beacon-embed-container {
    position: relative;
    min-height: 2300px;
    overflow-anchor: none;
}
.beacon-form { width: 100%; transition: opacity 160ms ease; }
.beacon-form[hidden] { display: none; }
.beacon-embed-container.is-loading .beacon-form { position: absolute; inset: 0 0 auto; opacity: 0; }
.beacon-form iframe { display: block; max-width: 100%; }
.beacon-load-status { position: absolute; inset: 0 0 auto; margin: 0; padding: 16px; background: #f5f5f5; }
.beacon-load-status[hidden] { display: none; }
.beacon-fallback { margin: 24px 0 0; padding-top: 20px; border-top: 1px solid var(--line); }

@media (max-width: 1000px) {
    .beacon-donation-layout { grid-template-columns: minmax(0, 1fr); gap: 28px; max-width: 780px; }
    .beacon-intro .container { max-width: 780px; }
    .beacon-context { padding-top: 0; }
    .beacon-preview-note { margin: 22px 0; }
}

@media (max-width: 940px) {
    .page-beacon-donations { padding-top: 84px; }
}

@media (max-width: 680px) {
    .beacon-intro .container,
    .beacon-donation-layout { width: calc(100% - 32px); }
    .beacon-intro { padding: 40px 0 20px; }
    .beacon-intro h1,
    .beacon-donation-section h2 { font-size: 25px; }
    .beacon-donation-section { padding: 15px 0 50px; }
    .beacon-donation-card { padding: 20px 12px; }
    .beacon-currencies { gap: 7px; }
    .beacon-currencies .button { gap: 8px; }
    .beacon-embed-container { min-height: 3100px; }
}

@media (prefers-reduced-motion: reduce) {
    .beacon-form { transition: none; }
}