/* ============================================================
   Foundation Aminos — About page chrome
   The About page layout + all text live in Elementor (page 132).
   This file styles only the "chrome" that's fragile to author
   through the atomic API: card borders/shadows/hover, the dark
   CTA card, and the CTA button fills. Loaded on the About page.
   Version 1.0.0
   ============================================================ */

/* Page surface (canvas template renders white by default) */
body.page-id-132 {
  background:
    radial-gradient(60% 40% at 85% 0%, rgba(55,94,251,0.18) 0%, transparent 60%),
    #051226;
}

/* ---- Dark scheme: story section text (mirrors home palette) ---- */
body.page-id-132 .a00004a { color: #FFFFFF !important; }
body.page-id-132 .a00004c,
body.page-id-132 .a00004e { color: rgba(255,255,255,0.62) !important; }

/* ---- Evidence cards ---- */
body.page-id-132 .ac-card {
  background: #FFFFFF;
  border: 1px solid #E2E8F0;
  border-radius: 16px;
  box-shadow: 0 1px 2px 0 rgba(10,33,72,0.06);
  transition: transform 0.3s cubic-bezier(0.16,1,0.3,1),
              border-color 0.3s ease,
              box-shadow 0.3s ease;
}
body.page-id-132 .ac-card:hover {
  transform: translateY(-3px);
  border-color: #CBD5E1;
  box-shadow: 0 12px 28px -6px rgba(10,33,72,0.12), 0 4px 8px -4px rgba(10,33,72,0.06);
}

/* ---- Stats row: hairline divider above ---- */
body.page-id-132 .ac-stats {
  border-top: 1px solid #E2E8F0;
  padding-top: 32px;
}

/* ---- Dark CTA card ---- */
body.page-id-132 .ac-cta {
  border: 1px solid rgba(255,255,255,0.10);
  background:
    radial-gradient(80% 120% at 88% 0%, rgba(55,94,251,0.20) 0%, transparent 55%),
    linear-gradient(180deg, #0A1E3A 0%, #051226 100%);
  border-radius: 20px;
}

/* ---- CTA buttons ---- */
body.page-id-132 .ac-btn {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  gap: 8px;
  height: 46px;
  border-radius: 12px !important;
  text-decoration: none !important;
  cursor: pointer;
  transition: background-color 120ms ease, box-shadow 180ms cubic-bezier(0.16,1,0.3,1);
}
body.page-id-132 .ac-btn-primary {
  background-color: #1954AC !important;
  background-image: none !important;
  color: #FFFFFF !important;
  border: none !important;
}
body.page-id-132 .ac-btn-primary:hover {
  background-color: #133F84 !important;
  box-shadow: 0 4px 12px -2px rgba(0,0,0,0.25);
}
body.page-id-132 .ac-btn-secondary {
  background-color: #FFFFFF !important;
  background-image: none !important;
  color: #0A1628 !important;
  border: 1px solid rgba(255,255,255,0.0) !important;
}
body.page-id-132 .ac-btn-secondary:hover {
  background-color: #EAF2FE !important;
}

/* ---- Responsive ---- */
@media (max-width: 1024px) {
  body.page-id-132 .ac-card { width: 100% !important; }
}
@media (max-width: 767px) {
  body.page-id-132 .ac-btn { width: 100%; }

  /* Stack the multi-column layouts (layout lives in Elementor, page 132;
     scoped by element id so all text stays editable there). */
  body.page-id-132 .elementor-element-a00000d { flex-direction: column; }
  body.page-id-132 .elementor-element-a00000d > * { width: 100%; }

  body.page-id-132 .elementor-element-a000029 { flex-direction: column; }
  body.page-id-132 .elementor-element-a000029 > * { width: 100%; }

  body.page-id-132 .elementor-element-a000045 { display: grid; grid-template-columns: 1fr 1fr; gap: 24px 12px; }

  body.page-id-132 .elementor-element-a000059 { flex-direction: column; }
}