/* OMC use-cases section v1 - replaces the Swiper carousel in .popular-scenarios with a
   tabbed card grid. Ported from the Kamatera compute page (try.omc.cloud/kamatera).
   Loaded only by the omc-usecases mu-plugin; delete that plugin to revert. */

.omc-uc{background:#E8EEFD;padding:64px 0}
.omc-uc .omc-uc-head{margin-bottom:34px}
.omc-uc .omc-uc-eyebrow{display:block;margin-bottom:10px;color:#2C5CED;font-size:14px;font-weight:500}
.omc-uc .omc-uc-head h2{font-size:clamp(26px,3.2vw,34px);font-weight:500;color:#17307A;margin:0}

.omc-uc-tabs{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:26px;padding:0;list-style:none}
.omc-uc-tab{
  border:1px solid #17307A;background:#fff;color:#17307A;
  border-radius:9999px;padding:11px 24px;font-size:15px;font-weight:500;
  cursor:pointer;font-family:inherit;line-height:1.2;
  transition:background .16s ease,color .16s ease,border-color .16s ease;
}
.omc-uc-tab:hover{border-color:#2C5CED;color:#2C5CED}
.omc-uc-tab[aria-selected="true"]{background:#2C5CED;border-color:#2C5CED;color:#fff}

.omc-uc-panel{display:grid;grid-template-columns:repeat(2,1fr);gap:18px;margin:0;padding:0;list-style:none}
/* an author display rule outranks the UA [hidden] rule, so say it again */
.omc-uc-panel[hidden]{display:none}

.omc-uc-card{
  background:#fff;border-radius:15px;box-shadow:0 6px 24px rgba(23,48,122,.08);
  padding:24px;transition:transform .16s ease;margin:0;
}
.omc-uc-card:hover{transform:translateY(-3px)}
.omc-uc-card h3{
  font-size:17px;font-weight:600;margin:0 0 7px;color:#17307A;
  direction:ltr;unicode-bidi:isolate;text-align:start;
}
.omc-uc-card p{color:#5b6789;font-size:15px;line-height:1.6;margin:0}

@media(max-width:860px){
  .omc-uc{padding:44px 0}
  .omc-uc-panel{grid-template-columns:1fr}
  .omc-uc-tab{padding:9px 18px;font-size:14px}
}