/* Homepage "Programs & curriculum" (tools/build-pillars.mjs): auto-cycling pillar tabs + animated illustration stage. */
.acs-pillars {
  --navy: #071a36; --blue: #1f8fd6; --green: #8dc63f; --muted: #5d6b82; --line: #e4ebf4; --ease: cubic-bezier(.22, 1, .36, 1); --dur: 6s;
  padding: 100px 0; font-family: "Plus Jakarta Sans", "Inter", system-ui, sans-serif; color: var(--navy); -webkit-font-smoothing: antialiased;
}
.acs-pillars *, .acs-pillars *::before, .acs-pillars *::after { box-sizing: border-box; }
.acs-pillars [data-tone="blue"] { --c: #1f8fd6; --c2: #e3f1fc; }
.acs-pillars [data-tone="amber"] { --c: #f0a500; --c2: #fff4d6; }
.acs-pillars [data-tone="green"] { --c: #5fa21e; --c2: #ebf6dd; }
.acs-pillars [data-tone="purple"] { --c: #7b4fd6; --c2: #efe8fd; }
.acs-pillars [data-tone="teal"] { --c: #0b7f7c; --c2: #dff5f4; }
.acs-pillars .acs-pillars__inner { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr); gap: 56px; align-items: center; max-width: 1240px; margin: 0 auto; padding: 0 24px; }
.acs-pillars .acs-pillars__eyebrow { margin: 0 0 12px; font-size: 13px; font-weight: 700; letter-spacing: .28em; text-transform: uppercase; color: var(--blue-ink, #1670b0); }
.acs-pillars .acs-pillars__h { margin: 0 0 30px; font-family: inherit; font-size: clamp(30px, 3.8vw, 48px); font-weight: 800; line-height: 1.07; letter-spacing: -.035em; color: var(--navy); text-transform: none; }
.acs-pillars .acs-pillars__h span { background: linear-gradient(90deg, var(--blue), var(--green)); -webkit-background-clip: text; background-clip: text; color: transparent; }

/* tabs */
.acs-pillars .acs-pillars__tabs { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.acs-pillars .acs-pillars__tab { position: relative; display: flex; align-items: flex-start; gap: 16px; width: 100%; padding: 16px 18px 18px; border: 0; border-radius: 20px; background: transparent; cursor: pointer;
  font: inherit; text-align: left; text-transform: none; letter-spacing: 0; color: var(--navy); box-shadow: none; overflow: hidden; transition: background-color .3s, box-shadow .3s; }
.acs-pillars .acs-pillars__tab:hover { background: #f4f7fb; }
.acs-pillars .acs-pillars__tab.is-on { background: #fff; box-shadow: 0 18px 40px -26px rgba(7, 26, 54, .45), 0 0 0 1px var(--line); }
.acs-pillars .acs-pillars__num { flex: none; display: grid; place-items: center; width: 38px; height: 38px; border-radius: 12px; font-size: 13px; font-weight: 800; color: var(--muted); background: #eef3f9; transition: background-color .3s, color .3s; }
.acs-pillars .acs-pillars__tab.is-on .acs-pillars__num { background: var(--c); color: #fff; }
.acs-pillars .acs-pillars__tt b { display: block; font-size: 17px; line-height: 1.3; }
.acs-pillars .acs-pillars__tab .acs-pillars__tt span { display: block; font-size: 14.5px; line-height: 1.55; color: var(--muted); max-height: 0; overflow: hidden; transition: max-height .5s var(--ease), margin .4s var(--ease); }
.acs-pillars .acs-pillars__tab.is-on .acs-pillars__tt span { max-height: 90px; margin-top: 6px; }
.acs-pillars .acs-pillars__bar { position: absolute; left: 18px; right: 18px; bottom: 8px; height: 3px; border-radius: 3px; background: transparent; overflow: hidden; }
.acs-pillars .acs-pillars__tab.is-on .acs-pillars__bar { background: #eef3f9; }
.acs-pillars .acs-pillars__bar i { display: block; width: 100%; height: 100%; background: var(--c); transform: scaleX(0); transform-origin: left; }
.acs-pillars .acs-pillars__tab.is-on .acs-pillars__bar i { animation: acs-pl-fill var(--dur) linear forwards; }
.acs-pillars.is-paused .acs-pillars__tab.is-on .acs-pillars__bar i { animation-play-state: paused; }
@keyframes acs-pl-fill { to { transform: scaleX(1); } }
.acs-pillars .acs-pillars__all { display: inline-flex; align-items: center; gap: 8px; margin: 22px 0 0 18px; font-weight: 800; color: var(--blue-ink, #1670b0); text-decoration: none; }
.acs-pillars .acs-pillars__all:hover { color: var(--navy); }

/* the 3D render floats on the page (no box behind it) and tilts toward the pointer (--rx/--ry from acs-pillars.js) */
.acs-pillars .acs-pillars__stage { position: relative; aspect-ratio: .9; perspective: 1200px; isolation: isolate; }
.acs-pillars .acs-pillars__stage::before { content: ""; position: absolute; left: 12%; right: 12%; top: 10%; bottom: 18%; z-index: -1; border-radius: 50%;
  background: radial-gradient(closest-side, var(--glow, rgba(31, 143, 214, .16)), transparent); filter: blur(10px); transition: background .8s; }
.acs-pillars .acs-pillars__blob { display: none; }
.acs-pillars .acs-pillars__panel { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 18px; transform-style: preserve-3d; }
.acs-pillars .acs-pillars__panel[hidden] { display: flex; visibility: hidden; }
.acs-pillars .acs-pillars__scene { position: relative; width: 84%; aspect-ratio: 1; transform-style: preserve-3d;
  transform: rotateX(var(--rx, 0deg)) rotateY(var(--ry, 0deg)); transition: transform .7s var(--ease); }
.acs-pillars.is-tilting .acs-pillars__scene { transition: transform .15s linear; }
.acs-pillars .pl3-hero { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain;
  filter: drop-shadow(0 26px 30px rgba(7, 26, 54, .22)); transform: translateZ(60px); opacity: 0;
  transition: opacity .5s, transform 1s var(--ease); animation: acs-pl3-float 5.5s ease-in-out infinite; }
.acs-pillars .acs-pillars__panel.is-on .pl3-hero { opacity: 1; }
.acs-pillars .acs-pillars__panel:not(.is-on) .pl3-hero { transform: translateZ(-160px) rotateY(-60deg) scale(.75); }
@keyframes acs-pl3-float { 50% { translate: 0 -16px; } }
/* a soft shadow on the "floor" that breathes with the float */
.acs-pillars .pl3-shadow { position: absolute; left: 22%; right: 22%; bottom: -4%; height: 8%; border-radius: 50%;
  background: radial-gradient(closest-side, rgba(7, 26, 54, .28), transparent); animation: acs-pl3-shadow 5.5s ease-in-out infinite; opacity: 0; transition: opacity .5s; }
.acs-pillars .acs-pillars__panel.is-on .pl3-shadow { opacity: 1; }
@keyframes acs-pl3-shadow { 50% { transform: scaleX(.82); opacity: .55; } }
.acs-pillars [data-tone="blue"] .acs-pillars__scene, .acs-pillars .acs-pillars__stage { --glow: rgba(31, 143, 214, .16); }

.acs-pillars .acs-pillars__foot { display: flex; align-items: center; justify-content: center; gap: 10px; flex-wrap: wrap; }
.acs-pillars .acs-pillars__chip { position: relative; padding: 10px 16px; border-radius: 999px; font-size: 14px; font-weight: 800; color: var(--navy);
  background: #fff; box-shadow: 0 14px 30px -16px rgba(7, 26, 54, .45), 0 0 0 1px var(--line);
  opacity: 0; transform: translateY(-10px); transition: opacity .4s .3s, transform .6s .3s var(--ease); }
.acs-pillars .acs-pillars__chip::before { content: ""; display: inline-block; width: 8px; height: 8px; margin-right: 8px; border-radius: 50%; background: var(--c); }
.acs-pillars .acs-pillars__go { position: relative; display: inline-flex; align-items: center; gap: 8px; padding: 13px 22px; border-radius: 999px; background: var(--navy); color: #fff;
  font-size: 14.5px; font-weight: 800; text-decoration: none; white-space: nowrap; opacity: 0; transform: translateY(10px); transition: opacity .4s .4s, transform .6s .4s var(--ease), background-color .25s; }
.acs-pillars .acs-pillars__go:hover { background: var(--c); color: #fff; }
.acs-pillars .acs-pillars__panel.is-on .acs-pillars__chip { opacity: 1; transform: none; }
.acs-pillars .acs-pillars__panel.is-on .acs-pillars__go { opacity: 1; transform: none; }

@media (max-width: 960px) {
  .acs-pillars { padding: 72px 0; }
  .acs-pillars .acs-pillars__inner { grid-template-columns: 1fr; gap: 28px; }
  .acs-pillars .acs-pillars__stage { order: -1; aspect-ratio: 1.25; }
  .acs-pillars .acs-pillars__h { margin-bottom: 20px; }
}
@media (max-width: 600px) {
  .acs-pillars .acs-pillars__inner { padding: 0 16px; }
  .acs-pillars .acs-pillars__stage { aspect-ratio: .92; }
  .acs-pillars .acs-pillars__chip { font-size: 12.5px; }
  .acs-pillars .acs-pillars__go { font-size: 13.5px; padding: 11px 18px; }
  .acs-pillars .acs-pillars__tab { padding: 14px 14px 16px; gap: 12px; }
}
@media (prefers-reduced-motion: reduce) {
  .acs-pillars *, .acs-pillars *::before { animation: none !important; transition: none !important; }
  .acs-pillars .acs-pillars__tab.is-on .acs-pillars__bar i { transform: scaleX(1); }
}

/* homepage "Join Our Community" (Elementor container fa23ca3): a soft blue-to-green tint so it stands apart from the white sections around it */
.elementor-element.elementor-element-fa23ca3 {
  background: radial-gradient(600px 360px at 85% 20%, rgba(141, 198, 63, .16), transparent 70%), linear-gradient(135deg, #eaf4fd 0%, #f2f8ec 100%) !important;
  padding-top: 70px !important; padding-bottom: 70px !important;
}