/* =====================================================================
   AISP course page — interaction & styling layer (course-enhance.css)
   Front-end only. It does not change any content, links, forms, prices
   or backend data. Every rule is scoped to html.ce, which the companion
   script adds, so if the script is missing the page looks exactly as now.
   ===================================================================== */

/* ---------- 1. Reveal on scroll ---------- */
.ce .ce-rv{opacity:0;transform:translateY(22px);transition:opacity .7s ease,transform .7s cubic-bezier(.2,.7,.2,1);transition-delay:var(--ce-d,0ms)}
.ce .ce-rv.ce-in{opacity:1;transform:none}

/* ---------- 2. Reading progress (fallback for browsers without scroll timelines) ---------- */
.ce .subnav-progress.ce-js{animation:none!important;transform-origin:0 50%}

/* ---------- 3. Hero ---------- */
.ce .ce-hero-media{transition:transform .5s cubic-bezier(.2,.7,.2,1);transform-style:preserve-3d;will-change:transform}
.ce .ce-hero-media img{animation:ce-float 7s ease-in-out infinite}
@keyframes ce-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
.ce .ce-hero-media::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:linear-gradient(115deg,transparent 35%,rgba(255,255,255,.18) 50%,transparent 65%);background-size:250% 100%;background-position:120% 0;transition:background-position 1.1s ease}
.ce .ce-hero-media:hover::after{background-position:-40% 0}
.ce .ce-pulse{position:relative}
.ce .ce-pulse::after{content:"";position:absolute;inset:-4px;border-radius:50%;border:2px solid currentColor;opacity:0;animation:ce-ping 2s ease-out infinite}
@keyframes ce-ping{0%{transform:scale(.5);opacity:.8}100%{transform:scale(1.8);opacity:0}}
.ce .facts .fact{transition:background .25s,transform .25s}
.ce .facts .fact:hover{transform:translateY(-3px)}
.ce .facts .fact dt > span{transition:transform .35s cubic-bezier(.3,1.6,.5,1)}
.ce .facts .fact:hover dt > span{transform:rotate(-8deg) scale(1.12)}

/* ---------- 4. Section eyebrows: animated rule ---------- */
.ce .ce-eb{display:inline-flex!important;align-items:center;gap:10px}
.ce .ce-eb::before{content:"";width:0;height:2px;border-radius:2px;background:currentColor;transition:width .6s .2s cubic-bezier(.2,.7,.2,1)}
.ce .ce-seen .ce-eb::before,.ce .ce-eb.ce-seen::before{width:22px}

/* ---------- 5. Process stepper (scroll-linked) ---------- */
.ce .ce-step > span:first-child > span:first-child{background:#E6F3F0!important;color:#0E7C6B!important;box-shadow:inset 0 0 0 2px #B9DCD4;transition:background .35s,color .35s,box-shadow .35s,transform .35s cubic-bezier(.3,1.6,.5,1)}
.ce .ce-step > span:first-child > span[aria-hidden]{background:#D5E6E2!important;background-image:linear-gradient(#0E7C6B,#19A88F)!important;background-repeat:no-repeat!important;background-size:100% 0!important;transition:background-size .6s ease}
.ce .ce-step > span:last-child{transition:opacity .35s,transform .35s;opacity:.55}
.ce .ce-step.ce-on > span:first-child > span:first-child{background:#0E7C6B!important;color:#fff!important;box-shadow:0 0 0 6px rgba(25,168,143,.18),0 10px 22px -8px rgba(14,124,107,.6);transform:scale(1.06)}
.ce .ce-step.ce-on > span:first-child > span[aria-hidden]{background-size:100% 100%!important}
.ce .ce-step.ce-on > span:last-child{opacity:1}
.ce .ce-step.ce-now > span:last-child{transform:translateX(4px)}
.ce .ce-step.ce-now > span:last-child strong{color:#0E7C6B!important}
.ce .ce-step{cursor:default}

/* hierarchy-style pyramid bars */
.ce .ce-pyr > li{transform-origin:50% 50%;transition:transform .5s cubic-bezier(.2,.7,.2,1),box-shadow .25s,opacity .5s;transition-delay:var(--ce-d,0ms)}
.ce .ce-pyr:not(.ce-in) > li{transform:scaleX(.35);opacity:0}
.ce .ce-pyr.ce-in > li:hover{transform:translateY(-2px) scale(1.03);box-shadow:0 12px 24px -10px rgba(11,42,46,.45);transition-delay:0ms}

/* example tables */
.ce main table tbody tr{transition:background .2s}
.ce main table tbody tr:hover{background:#F0F8F6}
.ce main table tbody tr:hover td:first-child{box-shadow:inset 3px 0 0 #0E7C6B}

/* ---------- 6. Lists with check icons ("Who should take this", outcomes) ---------- */
.ce .ce-tick{transition:background .2s,transform .2s,padding .2s;border-radius:10px}
.ce .ce-tick:hover{background:#F0F8F6;transform:translateX(4px)}
.ce .ce-tick > svg{transition:transform .35s cubic-bezier(.3,1.6,.5,1)}
.ce .ce-tick:hover > svg{transform:scale(1.25) rotate(-8deg)}

/* ---------- 7. Info / feature cards ---------- */
.ce .ce-card{transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease!important}
.ce .ce-card:hover{transform:translateY(-4px);box-shadow:0 22px 44px -22px rgba(11,42,46,.32)!important;border-color:#9FCFC4!important}
.ce .ce-card .ce-ic{transition:background .3s,color .3s,transform .4s cubic-bezier(.3,1.6,.5,1)}
.ce .ce-card:hover .ce-ic{background:#0E7C6B!important;color:#fff!important;transform:rotate(-6deg) scale(1.08)}
.ce .ce-card:hover .ce-ic svg{stroke:#fff}

/* ---------- 8. Modules & topic chips ---------- */
.ce .mod{transition:background .2s,transform .2s;border-radius:10px}
.ce .mod:hover{background:#F0F8F6;transform:translateX(4px)}
.ce .mod > span:first-child{transition:background .25s,color .25s,transform .35s cubic-bezier(.3,1.6,.5,1)}
.ce .mod:hover > span:first-child{background:#0E7C6B!important;color:#fff!important;transform:scale(1.1)}
.ce .mod[data-kind="Optional"]:hover > span:first-child{background:#C9A24A!important;color:#3A2F12!important}
.ce .ce-chip{transition:background .2s,border-color .2s,color .2s,transform .2s;cursor:default}
.ce .ce-chip:hover{background:#0E7C6B!important;border-color:#0E7C6B!important;color:#fff!important;transform:translateY(-2px)}

/* ---------- 9. Assessment timeline ---------- */
.ce .ce-tl > li > div > span:first-child{transition:transform .45s cubic-bezier(.3,1.6,.5,1),box-shadow .45s;transform:scale(.6)}
.ce .ce-tl > li > div > span:nth-child(2){background-image:linear-gradient(90deg,#19A88F,#5FD3B8)!important;background-repeat:no-repeat!important;background-size:0 100%!important;transition:background-size .7s ease}
.ce .ce-tl > li > span{transition:opacity .5s,transform .5s;opacity:0;transform:translateY(8px)}
.ce .ce-tl.ce-in > li > div > span:first-child{transform:none;box-shadow:0 0 0 6px rgba(25,168,143,.16)}
.ce .ce-tl.ce-in > li > div > span:nth-child(2){background-size:100% 100%!important}
.ce .ce-tl.ce-in > li > span{opacity:1;transform:none}
.ce .ce-tl > li:nth-child(1) *{transition-delay:.05s}
.ce .ce-tl > li:nth-child(2) *{transition-delay:.35s}
.ce .ce-tl > li:nth-child(3) *{transition-delay:.65s}
.ce .ce-tl > li:nth-child(4) *{transition-delay:.95s}
.ce .ce-tl > li:nth-child(5) *{transition-delay:1.25s}
.ce .ce-tl > li:nth-child(6) *{transition-delay:1.55s}
.ce .ce-stat{transition:background .25s}
.ce .ce-stat:hover{background:rgba(255,255,255,.05)}
.ce .doc > span:last-child{transition:transform .3s,background .2s,color .2s}
.ce .doc:hover > span:last-child{animation:ce-bob .8s ease infinite}
@keyframes ce-bob{0%,100%{transform:translateY(0)}50%{transform:translateY(3px)}}

/* ---------- 10. Credentials: zoomable images ---------- */
.ce .cred-fig a{cursor:zoom-in;position:relative}
.ce .cred-fig a::after{content:"";position:absolute;right:12px;top:12px;width:34px;height:34px;border-radius:10px;background:rgba(11,42,46,.78) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' viewBox='0 0 24 24'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m20 20-3.5-3.5M11 8v6M8 11h6'/%3E%3C/svg%3E") center/18px no-repeat;opacity:0;transform:scale(.8);transition:opacity .2s,transform .2s}
.ce .cred-fig a:hover::after,.ce .cred-fig a:focus-visible::after{opacity:1;transform:none}
.ce-lb{position:fixed;inset:0;z-index:200;display:grid;place-items:center;padding:24px;background:rgba(5,22,24,.86);backdrop-filter:blur(6px);animation:ce-fade .2s ease}
.ce-lb[hidden]{display:none}
.ce-lb figure{margin:0;max-width:min(1100px,100%);display:flex;flex-direction:column;gap:12px;animation:ce-zoom .3s cubic-bezier(.2,.7,.2,1)}
.ce-lb img{max-width:100%;max-height:78vh;border-radius:12px;background:#fff;box-shadow:0 40px 80px -20px rgba(0,0,0,.6);object-fit:contain}
.ce-lb figcaption{color:#DCEBE8;font:600 14px/1.4 'Plus Jakarta Sans',system-ui,sans-serif;text-align:center}
.ce-lb button{position:absolute;top:18px;right:18px;width:46px;height:46px;border-radius:50%;border:1px solid rgba(255,255,255,.3);background:rgba(255,255,255,.08);color:#fff;font-size:26px;line-height:1;cursor:pointer}
.ce-lb button:hover{background:rgba(255,255,255,.18)}
@keyframes ce-fade{from{opacity:0}}
@keyframes ce-zoom{from{opacity:0;transform:scale(.94)}}

/* ---------- 11. Pricing ---------- */
.ce #fees .lift > span:first-child{position:relative;overflow:hidden}
.ce #fees .lift > span:first-child::after{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,.65) 50%,transparent 70%);transform:translateX(-100%);animation:ce-sheen 3.2s ease-in-out infinite}
@keyframes ce-sheen{60%,100%{transform:translateX(100%)}}

/* ---------- 12. FAQ tools ---------- */
.ce-faq-tools{display:flex;gap:10px;align-items:center;margin:0 0 14px;flex-wrap:wrap}
.ce-faq-tools label{flex:1 1 240px;display:flex;align-items:center;gap:10px;height:50px;padding:0 16px;border:1px solid #D5E3E0;border-radius:14px;background:#fff;transition:border-color .2s,box-shadow .2s}
.ce-faq-tools label:focus-within{border-color:#0E7C6B;box-shadow:0 0 0 4px rgba(25,168,143,.15)}
.ce-faq-tools svg{flex:none;color:#5A6E71}
.ce-faq-tools input{flex:1;min-width:0;border:0;outline:0;background:none;font:500 15px 'Plus Jakarta Sans',system-ui,sans-serif;color:#0B2A2E}
.ce-faq-tools button{height:50px;padding:0 18px;border:1px solid #D5E3E0;border-radius:14px;background:#fff;font:700 14px 'Plus Jakarta Sans',system-ui,sans-serif;color:#0B2A2E;cursor:pointer;white-space:nowrap}
.ce-faq-tools button:hover{border-color:#0E7C6B;color:#0E7C6B}
.ce-faq-count{flex-basis:100%;font:500 13px 'Plus Jakarta Sans',system-ui,sans-serif;color:#5A6E71;min-height:1em}
.ce-faq-empty{margin:0;padding:22px;border:1px dashed #B9D6D0;border-radius:16px;background:#fff;font:500 15px/1.6 'Plus Jakarta Sans',system-ui,sans-serif;color:#2E4346;text-align:center}
.ce details[name="faq"] > summary,.ce .ce-faq > summary{transition:background .2s}
.ce details[name="faq"] > summary:hover,.ce .ce-faq > summary:hover{background:#F7FBFA}
.ce details[open] > summary + *{animation:ce-open .35s ease}
@keyframes ce-open{from{opacity:0;transform:translateY(-6px)}}
.ce details mark.ce-hl{background:#FBEFC9;color:inherit;border-radius:3px;padding:0 2px}

/* ---------- 13. Related courses + closing CTA ---------- */
.ce .rel-card svg:first-child{transition:transform .6s cubic-bezier(.2,.7,.2,1)}
.ce .rel-card:hover svg:first-child{transform:scale(1.05)}
.ce .ce-shine{position:relative!important;overflow:hidden!important;isolation:isolate}
.ce .ce-shine::before{content:"";position:absolute;z-index:-1;width:520px;height:520px;right:-140px;top:-260px;border-radius:50%;background:radial-gradient(circle,rgba(95,211,184,.45),transparent 65%);animation:ce-orb 9s ease-in-out infinite alternate}
.ce .ce-shine::after{content:"";position:absolute;z-index:-1;inset:0;background-image:linear-gradient(rgba(255,255,255,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.06) 1px,transparent 1px);background-size:40px 40px;-webkit-mask-image:linear-gradient(90deg,transparent,#000);mask-image:linear-gradient(90deg,transparent,#000)}
@keyframes ce-orb{to{transform:translate(-260px,140px)}}

/* ---------- 14. Back to top (with reading-progress ring) ---------- */
.ce-top{position:fixed;right:20px;bottom:24px;z-index:45;width:52px;height:52px;border:0;border-radius:50%;background:#fff;color:#0B2A2E;box-shadow:0 14px 30px -10px rgba(11,42,46,.45);display:grid;place-items:center;cursor:pointer;opacity:0;visibility:hidden;transform:translateY(12px);transition:opacity .25s,transform .25s,visibility .25s}
.ce-top.ce-show{opacity:1;visibility:visible;transform:none}
.ce-top svg.ce-ring{position:absolute;inset:0;transform:rotate(-90deg)}
.ce-top:hover{color:#0E7C6B}
@media (max-width:1179px){.ce-top{bottom:96px;right:14px;width:46px;height:46px}}

/* ---------- 15. Mobile buy bar entrance ---------- */
@media (max-width:1179px){
  .ce .mbar{transition:transform .35s cubic-bezier(.2,.7,.2,1)}
  .ce .mbar.ce-away{transform:translateY(110%)}
}

/* ---------- Accessibility: respect reduced motion ---------- */
@media (prefers-reduced-motion:reduce){
  .ce .ce-rv,.ce .ce-pyr > li,.ce .ce-tl *{opacity:1!important;transform:none!important;transition:none!important}
  .ce .ce-hero-media img,.ce .ce-pulse::after,.ce #fees .lift > span:first-child::after,.ce .ce-shine::before,.ce .doc:hover > span:last-child{animation:none!important}
}

/* =====================================================================
   v2 — illustrations, hero ambience, persona cards, image frames
   ===================================================================== */
/* ---------- Section header + illustration ---------- */
.ce2 .ce-hdx{display:grid!important;grid-template-columns:minmax(0,1fr) 230px;column-gap:40px;align-items:start}
.ce2 .ce-hdx > *{grid-column:1}
.ce2 .ce-hdx > .ce-ill{grid-column:2;grid-row:1 / span 8;align-self:center}
.ce-ill{width:230px;max-width:100%;filter:drop-shadow(0 22px 30px rgba(11,42,46,.14))}
.ce-ill svg{display:block;width:100%;height:auto;overflow:visible}
.ce-ill *{transform-box:fill-box;transform-origin:center}
.ce-ill .fl{animation:ci-fl 6s ease-in-out infinite}
.ce-ill .fl2{animation:ci-fl 5s ease-in-out -1.5s infinite}
.ce-ill .fl3{animation:ci-fl 7s ease-in-out -3s infinite}
@keyframes ci-fl{0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)}}
.ce-ill .sp{animation:ci-sp 40s linear infinite}
@keyframes ci-sp{to{transform:rotate(360deg)}}
.ce-ill .pp{animation:ci-pp 4.5s ease-in-out infinite}
.ce-ill .p2{animation-delay:.6s}.ce-ill .p3{animation-delay:1.2s}
@keyframes ci-pp{0%,8%{transform:scale(0);opacity:0}18%,80%{transform:scale(1);opacity:1}92%,100%{transform:scale(0);opacity:0}}
.ce-ill .dr{stroke-dasharray:1;stroke-dashoffset:1;animation:ci-dr 4.5s ease-in-out infinite}
@keyframes ci-dr{10%{stroke-dashoffset:1}35%,85%{stroke-dashoffset:0}100%{stroke-dashoffset:1}}
.ce-ill .dash{animation:ci-dash 2s linear infinite}
@keyframes ci-dash{to{stroke-dashoffset:-22}}
.ce-ill .arrow{animation:ci-arrow 4s cubic-bezier(.2,.7,.2,1) infinite}
@keyframes ci-arrow{0%{transform:translate(60px,-44px);opacity:0}25%{transform:none;opacity:1}30%{transform:translate(-3px,2px)}35%,85%{transform:none;opacity:1}100%{opacity:0}}
.ce-ill .hand{transform-box:view-box;transform-origin:190px 56px;animation:ci-sp 4s linear infinite}
.ce-ill .bar{transform-origin:left center;animation:ci-bar 3.6s ease-in-out infinite}
.ce-ill .b2{animation-delay:.4s}.ce-ill .b3{animation-delay:.8s}
@keyframes ci-bar{0%{transform:scaleX(.1)}40%,80%{transform:scaleX(1)}100%{transform:scaleX(.1)}}
.ce-ill .ring{stroke-dashoffset:100;animation:ci-ring 4s ease-in-out infinite}
@keyframes ci-ring{0%{stroke-dashoffset:100}45%,85%{stroke-dashoffset:30}100%{stroke-dashoffset:100}}
.ce-ill .seal{animation:ci-sp 12s linear infinite}
.ce-ill .slide{animation:ci-slide 5s ease-in-out infinite}
@keyframes ci-slide{0%,100%{transform:translate(8px,6px) rotate(4deg)}50%{transform:translate(-6px,-4px) rotate(-3deg)}}
.ce-ill .flag{transform-origin:left bottom;animation:ci-flag 2.4s ease-in-out infinite}
@keyframes ci-flag{50%{transform:skewY(-6deg)}}
.ce-ill .hop{animation:ci-hop 4.8s ease-in-out infinite}
@keyframes ci-hop{0%,12%{transform:translate(0,0)}22%{transform:translate(21px,-44px)}28%,36%{transform:translate(42px,-28px)}46%{transform:translate(63px,-72px)}52%,60%{transform:translate(84px,-56px)}70%{transform:translate(105px,-100px)}76%,90%{transform:translate(126px,-84px)}100%{transform:translate(0,0);opacity:0}}
.ce-ill .coin{animation:ci-coin 2.4s cubic-bezier(.3,1.6,.5,1) infinite}
@keyframes ci-coin{0%{transform:translateY(-40px);opacity:0}40%,85%{transform:none;opacity:1}100%{transform:none;opacity:0}}
.ce-ill .orbit{transform-box:view-box;transform-origin:120px 104px;animation:ci-orb 9s linear infinite}
@keyframes ci-orb{0%{transform:rotate(0)}100%{transform:rotate(360deg)}}
.ce-ill .dot{animation:ci-dot 1.2s ease-in-out infinite}
.ce-ill .d2{animation-delay:.15s}.ce-ill .d3{animation-delay:.3s}
@keyframes ci-dot{0%,60%,100%{transform:translateY(0);opacity:.5}30%{transform:translateY(-6px);opacity:1}}
.ce-ill:not(.ce-play) *{animation-play-state:paused!important}
.ce-rm .ce-ill *{animation:none!important}
.ce-rm .ce-ill .dr,.ce-rm .ce-ill .ring{stroke-dashoffset:0}

/* ---------- Hero ambience ---------- */
.ce-amb{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:0}
.ce-amb svg{position:absolute;fill:#5FD3B8;opacity:.14;animation:ce-drift 14s ease-in-out infinite}
.ce-amb svg:nth-child(3n){fill:#F2CE7A;opacity:.16}
@keyframes ce-drift{0%,100%{transform:translate(0,0) rotate(0)}33%{transform:translate(14px,-20px) rotate(10deg)}66%{transform:translate(-10px,12px) rotate(-8deg)}}
.ce2 main > section:first-of-type > *:not(.ce-amb){position:relative;z-index:1}
.ce-rm .ce-amb svg{animation:none}


/* ---------- Persona cards ---------- */
.ce2 .ce-personas{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px!important}
.ce2 .ce-personas > li{display:flex!important;align-items:center!important;gap:14px!important;padding:16px!important;border:1px solid #E2EAE8!important;border-radius:16px!important;background:#fff;line-height:1.45!important;transition:transform .25s,box-shadow .25s,border-color .25s}
.ce2 .ce-personas > li:hover{transform:translateY(-3px)!important;box-shadow:0 18px 34px -20px rgba(11,42,46,.35);border-color:#9FCFC4!important}
.ce2 .ce-personas > li > svg{display:none!important}
.ce-av{flex:none;width:48px;height:48px;border-radius:14px;display:grid;place-items:center;background:var(--ce-hue,#E6F3F0);color:#0E7C6B;transition:transform .35s cubic-bezier(.3,1.6,.5,1)}
.ce-personas > li:hover .ce-av{transform:rotate(-8deg) scale(1.1)}

.ce-mods-short > .ce-mod-x{display:none!important}
.ce-mods-b{margin:14px 0 0 0}

/* ---------- Glance icons ---------- */
.ce-gi{display:inline-grid;place-items:center;width:28px;height:28px;margin-right:10px;border-radius:8px;background:#E6F3F0;color:#0E7C6B;vertical-align:middle}
.ce2 .glance dt{display:flex!important;align-items:center}

@media (max-width:760px){
  .ce2 .ce-hdx{grid-template-columns:minmax(0,1fr)}
  .ce2 .ce-hdx > .ce-ill{grid-column:1;grid-row:1;width:170px;align-self:start;margin-bottom:6px}
  .ce2 .ce-personas{grid-template-columns:minmax(0,1fr)}
  .ce-track span{padding:12px 20px;font-size:14px}
}

.ce2 .ce-hdx.ce-hdc{grid-template-columns:minmax(0,1fr);justify-items:center}
.ce2 .ce-hdx.ce-hdc > .ce-ill{grid-column:1;grid-row:1;width:170px;margin-bottom:4px}

/* overview text justified */
.ce2 #overview p{text-align:justify;-webkit-hyphens:auto;hyphens:auto}
/* related courses image area */
.ce-relimg{position:relative;aspect-ratio:16/9;overflow:hidden;background:linear-gradient(140deg,#0B2A2E,#0E7C6B)}
.ce-relimg img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .6s cubic-bezier(.2,.7,.2,1)}
.rel-card:hover .ce-relimg img{transform:scale(1.05)}
.ce-relimg-ph{position:absolute;inset:12px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;border:2px dashed rgba(255,255,255,.32);border-radius:12px;background:rgba(255,255,255,.05);color:#fff;text-align:center;font-family:'Plus Jakarta Sans',system-ui,sans-serif}
.ce-relimg-ph svg{width:58px;height:58px;padding:14px;border-radius:16px;background:rgba(255,255,255,.12);box-sizing:border-box;margin-bottom:4px}
.ce-relimg-ph b{font-size:14px}.ce-relimg-ph small{font-size:11.5px;opacity:.75}
.ce-mods-b{align-self:flex-start;display:inline-flex;align-items:center;gap:6px;padding:9px 16px;border:1px solid #CFE3DE;border-radius:999px;background:#fff;color:#0E7C6B;font:700 14px 'Plus Jakarta Sans',system-ui,sans-serif;cursor:pointer;transition:background .2s,border-color .2s}
.ce-mods-b:hover{background:#E6F3F0;border-color:#0E7C6B}