/* Case study page (template-parts/case-ada.php), 2026-10-26. Same tokens as lux.css. */

.lc-sec{padding:96px 24px;background:#FFFFFF}
.lc-sec--soft{background:#FAFBFA}
.lc-wrap{max-width:1080px;margin:0 auto}
.lc-wrap--md{max-width:820px}
.lc-center{text-align:center}
.lx .lc-sec h2{font-size:clamp(1.9rem,3.6vw,2.5rem);line-height:1.12;letter-spacing:-.03em;margin:0 0 12px}
.lx .lc-sec h3{font-size:19px;margin:0 0 12px}
.lc-lede{margin:0 0 28px;font-size:18px;color:#4E625C}
.lc-note{display:block;width:max-content;max-width:100%;margin:0 auto 28px;padding:8px 14px;border-radius:999px;background:#F1F5F2;font-size:13px;color:#4E625C;text-align:center}
.lc-small{margin-top:20px;font-size:15px;color:#4E625C}
.lc-points{list-style:none;margin:0;padding:0;display:grid;gap:14px}
.lc-points li{position:relative;padding:18px 20px 18px 50px;background:#FFFFFF;border:1px solid #E8ECEA;border-radius:16px;font-size:16px;line-height:1.55}
.lc-points li::before{content:"";position:absolute;left:20px;top:24px;width:10px;height:10px;border-radius:50%;background:#0F5740;box-shadow:0 0 0 4px #E3F2E9}
.lc-points sup a{font-size:11px;text-decoration:none;font-weight:600;padding:0 2px}

/* The illustration */
.lc-film{margin:0;background:#FFFFFF;border:1px solid #E8ECEA;border-radius:28px;padding:20px;box-shadow:0 40px 80px -50px rgba(11,31,25,.35)}
.lc-film__stage svg{display:block;width:100%;height:auto;font-family:Inter,-apple-system,"Segoe UI",Roboto,sans-serif}
.lc-film__cap{display:flex;gap:14px;align-items:baseline;min-height:56px;padding:18px 8px 4px}
.lc-film__n{flex:none;font-size:12px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:#2C6B52}
.lc-film__t{font-size:18px;line-height:1.45;color:#0B1F19}
.lc-film__bar{display:flex;align-items:center;gap:16px;padding:8px 8px 4px}
.lc-film__play{position:relative;flex:none;width:44px;height:44px;border-radius:50%;border:0;background:#0B1F19;cursor:pointer}
.lc-film__play i{position:absolute;left:50%;top:50%;width:12px;height:14px;transform:translate(-50%,-50%);border-left:4px solid #FFFFFF;border-right:4px solid #FFFFFF}
.lc-film.is-paused .lc-film__play i{width:0;height:0;border-left:13px solid #FFFFFF;border-right:0;border-top:8px solid transparent;border-bottom:8px solid transparent;margin-left:2px}
.lc-film__dots{display:flex;gap:6px;flex:1}
.lc-film__dots button{flex:1;min-height:44px;border:0;background:none;padding:0;cursor:pointer;display:flex;align-items:center}
.lc-film__dots span{display:block;width:100%;height:4px;border-radius:2px;background:#E3E8E5;transition:background .3s ease}
.lc-film__dots button[aria-current="step"] span{background:#0F5740}
.lc-film__text{margin:8px 8px 4px;font-size:14px;color:#4E625C}
.lc-film__text summary{cursor:pointer;color:#0F5740;font-weight:500;min-height:36px;display:flex;align-items:center}
.lc-film__text ol{margin:6px 0 4px;padding-left:1.3em;list-style:decimal}
.lc-film__text li{margin:4px 0}

/* Scene states. data-s on the figure runs 1 to 6. */
.lc-film svg *{transition:opacity .7s ease,transform .9s cubic-bezier(.2,.7,.2,1),stroke .5s ease}
.lc-link{stroke:#D5DED9;stroke-width:2.5;stroke-dasharray:6 8;opacity:0}
.lc-node--a,.lc-node--b,.lc-node--p,.lc-stood,.lc-gap,.lc-reads,.lc-ok,.lc-plan__v2{opacity:0}
.lc-plan{transform:translate(318px,196px)}
@keyframes lc-flow{to{stroke-dashoffset:-56}}

[data-s="1"] .lc-plan{transform:translate(318px,196px)}

[data-s="2"] .lc-node--a,[data-s="3"] .lc-node--a,[data-s="4"] .lc-node--a,[data-s="5"] .lc-node--a,[data-s="6"] .lc-node--a{opacity:1}
[data-s="2"] .lc-link--a{opacity:1;stroke:#0F5740;animation:lc-flow 1.4s linear infinite}
[data-s="2"] .lc-plan,[data-s="3"] .lc-plan,[data-s="4"] .lc-plan{transform:translate(556px,88px)}
[data-s="3"] .lc-link--a,[data-s="4"] .lc-link--a,[data-s="5"] .lc-link--a{opacity:.5}

[data-s="3"] .lc-node--b,[data-s="4"] .lc-node--b,[data-s="5"] .lc-node--b,[data-s="6"] .lc-node--b{opacity:1}
[data-s="3"] .lc-node--a,[data-s="4"] .lc-node--a,[data-s="5"] .lc-node--a{opacity:.6}

[data-s="4"] .lc-link--b{opacity:1;stroke:#C9A13B}
[data-s="4"] .lc-gap{opacity:1}

[data-s="5"] .lc-node--p,[data-s="6"] .lc-node--p{opacity:1}
[data-s="5"] .lc-plan{transform:translate(392px,246px)}
[data-s="5"] .lc-ok,[data-s="6"] .lc-ok{opacity:1}
[data-s="5"] .lc-plan__v,[data-s="6"] .lc-plan__v{opacity:0}
[data-s="5"] .lc-plan__v2,[data-s="6"] .lc-plan__v2{opacity:1}

[data-s="6"] .lc-link--p{opacity:1;stroke:#0F5740;animation:lc-flow 1.4s linear infinite}
[data-s="6"] .lc-plan{transform:translate(556px,300px)}
[data-s="6"] .lc-reads,[data-s="6"] .lc-stood{opacity:1}
[data-s="6"] .lc-node--a{opacity:.55}

/* Routes and comparison */
.lc-routes{margin-top:40px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.lc-route{background:#FFFFFF;border:1px solid #E8ECEA;border-radius:24px;padding:32px}
.lc-route.is-hp{border:1.5px solid #0F5740;box-shadow:0 30px 60px -40px rgba(15,87,64,.4)}
.lc-route__k{margin:0 0 10px;font-size:12px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:#4E625C}
.lc-route.is-hp .lc-route__k{color:#2C6B52}
.lc-route ol{margin:0;padding-left:1.25em;list-style:decimal;display:grid;gap:10px;font-size:16px;line-height:1.5}
.lc-route__out{margin:22px 0 0;padding-top:16px;border-top:1px solid #EEF1EF;font-weight:500}
.lc-table{overflow-x:auto;border:1px solid #E8ECEA;border-radius:20px;background:#FFFFFF;margin-top:28px}
.lc-table table{width:100%;min-width:560px;border-collapse:collapse;font-size:15px}
.lc-table th,.lc-table td{text-align:left;padding:16px 20px;border-bottom:1px solid #F1F4F2;vertical-align:top}
.lc-table thead th{font-size:12px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:#4E625C}
.lc-table tbody th{font-weight:600}
.lc-table td:last-child{color:#0F5740;font-weight:500}
.lc-table tr:last-child th,.lc-table tr:last-child td{border-bottom:0}
.lc-sources{margin-top:48px;padding-top:28px;border-top:1px solid #E8ECEA;font-size:13px;color:#4E625C}
.lx .lc-sources h3{font-size:14px;margin-bottom:10px}
.lc-sources ol{margin:0;padding-left:1.2em;list-style:decimal;display:grid;gap:8px}

@media (max-width:760px){
  .lc-sec{padding:64px 20px}
  .lc-film{padding:12px;border-radius:20px}
  .lc-film__cap{flex-direction:column;gap:6px}
  .lc-film__t{font-size:16px}
  .lc-routes{grid-template-columns:1fr}
}
@media (prefers-reduced-motion:reduce){
  .lc-film svg *{transition:none!important;animation:none!important}
}