/* Section « Au quotidien » : avant / avec Kordial. Les lignes des deux colonnes sont alignées deux à deux. */
.ba-band{background:color-mix(in srgb,var(--brand) 8%,var(--paper));border-top:none;}
.ba-head{text-align:center;margin-bottom:32px;}
.ba-head h2{margin:0 auto;max-width:none;}
.ba-head .lead{margin:12px auto 0;max-width:640px;}
.ba{display:grid;grid-template-columns:1fr 1fr;border:1px solid var(--line);border-radius:20px;overflow:hidden;background:var(--surface);box-shadow:var(--shadow-soft);}
.ba-before,.ba-after{padding:36px;min-width:0;}
.ba-after{position:relative;background:linear-gradient(155deg,#15477A 0%,var(--brand) 55%,#0A2C4A 100%);color:#fff;overflow:hidden;}
.ba-after::before{content:'';position:absolute;inset:0;background-image:radial-gradient(circle,rgba(255,255,255,.05) 1.5px,transparent 1.5px);background-size:24px 24px;pointer-events:none;}
.ba-after > *{position:relative;}
.ba-label{font-family:var(--font-mono);font-size:.72rem;font-weight:600;letter-spacing:.09em;text-transform:uppercase;margin:0 0 18px;color:var(--ink-soft);}
.ba-after .ba-label{color:rgba(255,255,255,.65);}
.ba ul{list-style:none;margin:0;padding:0;display:grid;gap:14px;}
.ba li{position:relative;padding-left:30px;font-size:.98rem;line-height:1.5;color:var(--ink-soft);}
.ba li::before{content:'×';position:absolute;left:0;top:-1px;width:20px;height:20px;border-radius:50%;background:var(--paper);color:var(--ink-soft);font-weight:700;font-size:.95rem;line-height:20px;text-align:center;}
.ba-after li{color:rgba(255,255,255,.92);}
.ba-after li::before{content:'✓';background:var(--accent);color:#fff;font-size:.72rem;}
.ba-cta{margin:28px 0 0;text-align:center;}

/* colonnes alignées ligne à ligne : chaque ligne de gauche fait face à sa ligne de droite */
@supports (grid-template-rows:subgrid){
  @media (min-width:861px){
    .ba{grid-template-rows:auto repeat(5,auto);}
    .ba-before,.ba-after{display:grid;grid-row:span 6;grid-template-rows:subgrid;row-gap:0;}
    .ba-label{margin-bottom:12px;}
    .ba ul{grid-row:2 / span 5;grid-template-rows:subgrid;gap:0;}
    .ba li{display:flex;align-items:center;min-height:56px;padding-top:9px;padding-bottom:9px;}
    .ba li::before{top:50%;margin-top:-10px;}
    .ba li + li{border-top:1px solid rgba(15,58,95,.08);}
    .ba-after li + li{border-top-color:rgba(255,255,255,.1);}
  }
}
@media (max-width:860px){.ba{grid-template-columns:1fr;}.ba-before,.ba-after{padding:26px;}}

/* animation : les lignes de gauche se barrent, celles de droite se cochent */
.ba.js-anim:not(.play) .ba-after li{opacity:.22;transform:translateX(-10px);}
.ba.js-anim:not(.play) .ba-after li::before{transform:scale(0);}
.ba.js-anim.play .ba-before li{animation:baGone .5s ease forwards;animation-delay:calc(1.4s + var(--i) * .6s);}
.ba.js-anim.play .ba-after li{opacity:.22;transform:translateX(-10px);animation:baOn .55s cubic-bezier(.2,.8,.2,1) forwards;animation-delay:calc(1.7s + var(--i) * .6s);}
.ba.js-anim.play .ba-after li::before{transform:scale(0);animation:baPop .45s cubic-bezier(.3,1.6,.5,1) forwards;animation-delay:calc(1.85s + var(--i) * .6s);}
@keyframes baGone{to{opacity:.5;text-decoration:line-through;text-decoration-color:rgba(230,57,70,.7);}}
@keyframes baOn{to{opacity:1;transform:none;}}
@keyframes baPop{to{transform:scale(1);}}