/* V2.7 — heterogeneity section, funders page, motion details */
.hetero-grid { display: grid; grid-template-columns: .85fr 1.15fr; gap: clamp(1.5rem, 4vw, 3.5rem); align-items: center; }
.hetero-stage { position: relative; border-radius: 28px 28px 120px 28px; overflow: hidden; border: 1px solid var(--line); box-shadow: 0 30px 60px -32px rgba(6,58,75,.4); background: var(--white); }
.hetero-stage canvas { display: block; width: 100%; aspect-ratio: 16 / 10; touch-action: pan-y; cursor: crosshair; }
.hetero-stage .tag-illu { position: absolute; left: 1rem; bottom: 1rem; font-size: .68rem; font-weight: 750; letter-spacing: .08em; text-transform: uppercase; background: rgba(255,255,255,.88); padding: .3rem .6rem; border-radius: 999px; color: var(--muted); }
.hetero-controls { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: 1.4rem; }
.hetero-controls button { display: inline-flex; align-items: center; gap: .5rem; min-height: 44px; padding: .5rem .9rem; border-radius: 999px; border: 1.5px solid var(--line); background: var(--white); color: var(--petrol); font: inherit; font-size: .88rem; font-weight: 700; cursor: pointer; transition: background .2s, border-color .2s, transform .2s; }
.hetero-controls button:hover { border-color: var(--turq-ink); transform: translateY(-1px); }
.hetero-controls button[aria-pressed="true"] { background: var(--petrol); border-color: var(--petrol); color: var(--white); }
.hetero-controls .sw { width: .8rem; height: .8rem; border-radius: 50%; flex: 0 0 auto; box-shadow: 0 0 0 2px rgba(255,255,255,.8); }
.hetero-controls .share { font-weight: 600; opacity: .75; font-size: .8rem; }
.hetero-text { margin-top: 1rem; min-height: 3.2em; color: var(--petrol); font-size: .98rem; border-left: 4px solid var(--gold); padding-left: .9rem; }
.hero-art figcaption a { color: inherit; text-decoration: none; }
.hero-art figcaption a:hover { text-decoration: underline; }
.anim-roadmap .roadmap::before { transform: scaleX(0); transform-origin: left center; transition: transform 1.8s cubic-bezier(.2,.7,.2,1); }
.anim-roadmap .roadmap.drawn::before { transform: scaleX(1); }
.anim-roadmap .roadmap .milestone::before { transform: scale(.4); opacity: 0; transition: transform .5s ease, opacity .5s ease; }
.anim-roadmap .roadmap.drawn .milestone::before { transform: scale(1); opacity: 1; }
.anim-roadmap .roadmap.drawn .milestone:nth-child(2)::before { transition-delay: .45s; }
.anim-roadmap .roadmap.drawn .milestone:nth-child(3)::before { transition-delay: .9s; }
.anim-roadmap .roadmap.drawn .milestone:nth-child(4)::before { transition-delay: 1.35s; }
@media (prefers-reduced-motion: no-preference) {
  .mission li .num { transition: transform .4s ease; }
  .mission li:hover .num { transform: rotate(-8deg) scale(1.08); }
  .service::before { background-size: 200% 100%; background-image: linear-gradient(90deg, var(--turq), var(--gold), var(--turq)); animation: shimmer 6s linear infinite; }
}
@keyframes shimmer { from { background-position: 0 0; } to { background-position: 200% 0; } }
/* funders page */
.funders-grid { display: grid; grid-template-columns: 1.15fr .85fr; gap: 1.2rem; align-items: start; }
.funders-grid .feas-form { box-shadow: none; }
.login-card { background: var(--petrol); color: var(--white); border-color: var(--petrol); }
.login-card p { color: #BFD6DA; }
.login-card .button.primary { background: var(--gold); color: var(--petrol); box-shadow: none; margin-top: .6rem; }
.login-card .h3 { color: var(--white); }
@media (max-width: 860px) { .hetero-grid, .funders-grid { grid-template-columns: 1fr; } }
.stack { display: grid; gap: 1.2rem; }
.plain-list { margin: .8rem 0 0; padding-left: 1.1rem; display: grid; gap: .35rem; }
.feas-form h2 { margin: 0; }
@media (max-width: 860px) { .hetero-stage canvas { aspect-ratio: 4 / 3; } .hetero-stage .tag-illu { font-size: .6rem; right: 1rem; text-align: center; } }