/* Bloc d'accueil et page de soutien : aucun script de paiement externe. */
.support-teaser-section { position: relative; padding: 1.5rem 0; }
.support-teaser,
.support-payment-panel {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 1.8rem;
  padding: clamp(1.5rem, 4vw, 2.5rem);
  border: 1px solid rgba(255, 170, 100, 0.28);
  border-radius: 22px;
  background: radial-gradient(circle at 0 0, rgba(255, 122, 26, 0.13), transparent 55%), linear-gradient(135deg, rgba(30, 26, 18, 0.97), rgba(18, 17, 13, 0.97));
  box-shadow: 0 18px 60px rgba(0, 0, 0, 0.22);
}
.support-heart {
  display: grid;
  place-items: center;
  width: 64px;
  height: 64px;
  border-radius: 20px;
  color: #ffb347;
  border: 1px solid rgba(255, 179, 71, 0.25);
  background: rgba(255, 122, 26, 0.08);
}
.support-heart svg { width: 30px; height: 30px; }
.support-teaser h2,
.support-payment-panel h2 { margin: 0.4rem 0 0.7rem; font-size: clamp(1.6rem, 3vw, 2.3rem); line-height: 1.15; }
.support-teaser p,
.support-payment-panel p { margin: 0; color: #b8b0a4; line-height: 1.7; max-width: 65ch; }
.support-action {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  gap: 0.8rem;
  min-height: 48px;
  padding: 0.8rem 1.2rem;
  border-radius: 12px;
  background: var(--flare, linear-gradient(100deg, #ff4d2e, #ffb347));
  color: #1a0f04;
  text-decoration: none;
  font-weight: 700;
  font-family: var(--font-display, inherit);
  line-height: 1.4;
  text-align: center;
}
.support-action:hover { filter: brightness(1.1); }
.support-action:focus-visible,
.support-text-link:focus-visible,
.support-faq summary:focus-visible { outline: 2px solid #ffd49b; outline-offset: 5px; }
.support-teaser .support-teaser-note { margin-top: 0.7rem; font-size: 0.85rem; }
.support-hero { padding: clamp(2rem, 6vw, 4.5rem) 0 2.8rem; }
.support-hero h1 { font-size: clamp(2.5rem, 7vw, 5rem); line-height: 1.02; margin: 1rem 0 1.3rem; }
.support-hero > p { max-width: 65ch; color: #b8b0a4; line-height: 1.8; }
.support-text-link { display: inline-flex; gap: 0.6rem; align-items: center; color: #ffbd75; text-underline-offset: 4px; }
.support-section-heading h2,
.support-faq h2 { margin: 0.5rem 0 0.8rem; font-size: clamp(1.6rem, 4vw, 2.3rem); }
.support-section-heading > p { margin: 0; color: #b8b0a4; line-height: 1.7; }
.support-purpose-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.2rem; margin-top: 1.5rem; }
.support-purpose-card { position: relative; padding: 1.7rem; border: 1px solid rgba(255, 170, 100, 0.2); border-radius: 20px; background: rgba(26, 24, 18, 0.94); }
.support-card-number { font-family: var(--font-display, inherit); color: #ffb347; letter-spacing: 0.14em; font-size: 0.85rem; }
.support-purpose-card h3 { font-size: 1.4rem; margin: 0.8rem 0; }
.support-purpose-card p { color: #b8b0a4; line-height: 1.75; margin: 0; }
.support-participate { padding: 2.5rem 0; scroll-margin-top: 6rem; }
.support-payment-panel { grid-template-columns: auto minmax(0, 1fr); align-items: start; }
.support-payment-panel .support-action { margin-top: 1.3rem; }
.support-payment-panel .support-small { font-size: 0.88rem; margin-top: 0.9rem; }
.support-alternatives { display: flex; flex-wrap: wrap; align-items: baseline; gap: 1.2rem; }
.support-faq { margin-bottom: 3rem; }
.support-faq details { padding: 1.2rem 0; border-bottom: 1px solid rgba(255, 170, 100, 0.2); }
.support-faq summary { cursor: pointer; font-weight: 600; padding: 0.4rem 0; }
.support-faq details p { color: #b8b0a4; line-height: 1.8; max-width: 85ch; }
@media (max-width: 1000px) {
  .support-teaser { grid-template-columns: auto minmax(0, 1fr); }
  .support-teaser > .support-action { grid-column: 2; justify-self: start; }
}
@media (max-width: 600px) {
  .support-teaser, .support-payment-panel, .support-purpose-grid { grid-template-columns: minmax(0, 1fr); }
  .support-teaser > .support-action { grid-column: 1; justify-self: stretch; }
  .support-heart { width: 52px; height: 52px; border-radius: 16px; }
  .support-payment-panel .support-action { width: 100%; }
}
