/* c2-ba.css: styles for c2_ba (Before and after), all scoped under .c2-ba. Engine tokens only (../research-deck/styles.css,
   brand.css). Motion: lines fade + rise 6px, 80ms apart; Before dims to .6 when After shows. None under reduced motion. */
@keyframes c2baIn{from{opacity:0;transform:translateY(6px)}}
.c2-ba{--c2ba-pad:clamp(22px,4.4vh,48px) clamp(24px,2.8vw,48px);flex:1;min-height:0;min-width:0;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(28px,4.4vw,80px);align-content:center;align-items:stretch;max-width:1500px;width:100%;margin-inline:auto}
.c2-ba .c2-ba-col{position:relative;min-width:0;border-radius:28px;padding:var(--c2ba-pad);display:flex;flex-direction:column;gap:clamp(14px,2.8vh,30px)}
.c2-ba .c2-ba-h{margin:0;font-family:Montserrat,Inter,system-ui,sans-serif;font-size:clamp(26px,min(2.8vw,5.2vh),46px);font-weight:450;letter-spacing:-.035em;line-height:1.05;color:var(--ink)}
/* Before: quiet card, one highlighted line, two smaller lines */
.c2-ba .c2-ba-before{border:1px solid var(--line);transition:opacity .4s var(--ease)}
.c2-ba.on .c2-ba-before{opacity:.6}
.c2-ba .c2-ba-before .c2-ba-h{color:var(--soft)}
.c2-ba .c2-ba-hi{margin:0;font-size:clamp(19px,min(1.65vw,3.3vh),28px);font-weight:500;line-height:1.32;letter-spacing:-.018em;color:var(--ink);max-width:32ch;text-wrap:balance}
.c2-ba .c2-ba-small{list-style:none;margin:0;padding:clamp(12px,2.4vh,24px) 0 0;border-top:1px solid var(--line);display:flex;flex-direction:column;gap:clamp(8px,1.6vh,14px)}
.c2-ba .c2-ba-small li{font-size:clamp(14px,min(1.1vw,2.3vh),18px);line-height:1.5;color:var(--muted);max-width:40ch;text-wrap:pretty}
.c2-ba .c2-ba-small b{font-weight:600;color:var(--ink)}
.c2-ba .c2-ba-in{animation:c2baIn .4s var(--ease) backwards;animation-delay:calc(var(--d,0ms) + 120ms)}
/* After: calm glass card, accent heading, ticks */
.c2-ba .c2-ba-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:clamp(12px,2.4vh,24px)}
.c2-ba .c2-ba-list li{display:grid;grid-template-columns:auto minmax(0,1fr);gap:clamp(10px,1vw,16px);align-items:start}
.c2-ba .c2-ba-ic{width:clamp(22px,3.2vh,28px);height:clamp(22px,3.2vh,28px);margin-top:.08em;display:grid;place-items:center;border-radius:50%;color:var(--blue);background:rgba(102,51,153,.09)}
.c2-ba .c2-ba-ic svg{width:70%;height:70%}
.c2-ba .c2-ba-t{font-size:clamp(17px,min(1.4vw,2.9vh),24px);line-height:1.4;letter-spacing:-.01em;color:var(--ink);font-weight:500;max-width:28ch;text-wrap:pretty}
.c2-ba .c2-ba-after{opacity:0;transition:opacity .35s var(--ease)}
.c2-ba .c2-ba-up{opacity:0;transform:translateY(6px);transition:opacity .4s var(--ease),transform .4s var(--ease);transition-delay:0ms}
.c2-ba.on .c2-ba-after{opacity:1}
.c2-ba.on .c2-ba-up{opacity:1;transform:none;transition-delay:calc(var(--d,0ms) + 90ms)}
@media (max-width:900px){
 .c2-ba{grid-template-columns:1fr;align-content:start;gap:14px;--c2ba-pad:16px 18px}
 .c2-ba .c2-ba-col{gap:10px;border-radius:22px}
 .c2-ba .c2-ba-h{font-size:24px}
 .c2-ba .c2-ba-hi{font-size:17px}
 .c2-ba .c2-ba-small{padding-top:10px;gap:6px}
 .c2-ba .c2-ba-small li{font-size:14px}
 .c2-ba .c2-ba-list{gap:10px}
 .c2-ba .c2-ba-t{font-size:15.5px}
 .c2-ba .c2-ba-ic{width:22px;height:22px}
}
.c2-ba.c2-ba-rm *,.c2-ba.c2-ba-rm .c2-ba-before{animation:none!important;transition:none!important}
@media (prefers-reduced-motion:reduce){.c2-ba *,.c2-ba .c2-ba-before{animation:none!important;transition:none!important}}
