/* WebKepler Related Comparisons — approved Figma UI, v1.8.8.
   Uniform card widths, on-site link support, compact responsive grids. */
#wk-comparison-main-content .wkcmp-related,
#wk-comparison-main-content .wkcmp-related * {box-sizing:border-box}
#wk-comparison-main-content .wkcmp-related{
  --wkr-title:#152339;--wkr-muted:#929292;--wkr-dash:#777;--wkr-blue:#0788ff;
  font-family:"Wix Madefor Display",WixMadeforDisplay,"Segoe UI",Arial,sans-serif;
  width:100%;margin:42px 0 30px;max-width:100%;container-type:inline-size;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
}
#wk-comparison-main-content .wkcmp-related__rule{height:1px;width:100%;margin:0 0 36px;background:#e2e2e2}
#wk-comparison-main-content .wkcmp-related__title{
  margin:0 0 30px!important;padding:0!important;font:650 26px/1.3 "Wix Madefor Display",WixMadeforDisplay,"Segoe UI",Arial,sans-serif!important;
  font-variation-settings:"wght" 650;letter-spacing:-.4px!important;color:var(--wkr-title)!important;
}
#wk-comparison-main-content .wkcmp-related__grid{
  display:grid;width:100%;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:18px;row-gap:24px;align-items:stretch;
}
#wk-comparison-main-content .wkcmp-related__card{
  position:relative;display:flex;align-items:center;justify-content:space-between;gap:5px;
  width:100%;max-width:100%;min-width:0;min-height:60px;
  margin:0;padding:7px 13px;border:0;border-radius:32px;background:#fff;color:var(--wkr-muted);
  text-decoration:none!important;box-shadow:none!important;isolation:isolate;cursor:pointer;
  transition:background-color .22s ease,box-shadow .22s ease;
}
/* 6px dash / 8px gap, round corners and a blue line on hover or keyboard focus. */
#wk-comparison-main-content .wkcmp-related__outline{
  position:absolute;inset:0;display:block;width:100%;height:100%;overflow:visible;
  pointer-events:none;z-index:0;fill:none;
}
#wk-comparison-main-content .wkcmp-related__outline rect{
  x:1px;y:1px;width:calc(100% - 2px);height:calc(100% - 2px);
  rx:30px;ry:30px;stroke:var(--wkr-dash);stroke-width:1.1px;
  stroke-dasharray:6px 8px;vector-effect:non-scaling-stroke;
  transition:stroke .22s ease;
}
#wk-comparison-main-content .wkcmp-related__card:hover,
#wk-comparison-main-content .wkcmp-related__card:focus-visible{
  background:rgba(7,136,255,.055);box-shadow:0 3px 12px rgba(20,60,100,.085)!important;
}
#wk-comparison-main-content .wkcmp-related__card:hover .wkcmp-related__outline rect,
#wk-comparison-main-content .wkcmp-related__card:focus-visible .wkcmp-related__outline rect{stroke:var(--wkr-blue)}
#wk-comparison-main-content .wkcmp-related__card:focus-visible{outline:2px solid var(--wkr-blue);outline-offset:3px}
#wk-comparison-main-content .wkcmp-related__card > .wkcmp-related__logo,
#wk-comparison-main-content .wkcmp-related__card > .wkcmp-related__label{position:relative;z-index:1}
#wk-comparison-main-content .wkcmp-related__logo{
  display:grid;place-items:center;width:40px;height:40px;flex:0 0 40px;border-radius:50%;background:#f0f1f3;
  overflow:hidden;border:1px solid #e5e7eb;
}
#wk-comparison-main-content .wkcmp-related__logo img{width:100%;height:100%;display:block;object-fit:cover;border-radius:50%}
#wk-comparison-main-content .wkcmp-related__label{
  display:block;flex:1 1 auto;min-width:0;color:var(--wkr-muted);
  font:500 clamp(12px,1.7cqw,19px)/1.15 "Wix Madefor Display",WixMadeforDisplay,"Segoe UI",Arial,sans-serif;
  letter-spacing:-.025em;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
/* Show More is OUTSIDE the card grid, consistently aligned to the far right. */
#wk-comparison-main-content .wkcmp-related__actions{display:flex;justify-content:flex-end;align-items:center;width:100%;margin-top:23px}
#wk-comparison-main-content .wkcmp-related__more{
  display:inline-flex;align-items:center;gap:13px;min-height:42px;max-width:100%;padding:0 4px;margin:0;
  background:transparent;border:0;color:var(--wkr-blue);
  font:500 clamp(14px,1.65cqw,21px)/1.2 "Wix Madefor Display",WixMadeforDisplay,"Segoe UI",Arial,sans-serif;
  cursor:pointer;white-space:nowrap;
}
#wk-comparison-main-content .wkcmp-related__more svg{width:26px;height:16px;flex:0 0 26px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;transition:transform .28s ease}
#wk-comparison-main-content .wkcmp-related__more:focus-visible{outline:2px solid currentColor;outline-offset:3px}
/* Native grid-track interpolation produces smooth, non-jumping expand/collapse. */
#wk-comparison-main-content .wkcmp-related__extra{
  display:grid;grid-template-rows:0fr;opacity:0;visibility:hidden;
  transition:grid-template-rows .38s cubic-bezier(.2,.7,.2,1),opacity .3s ease,visibility 0s linear .38s;
}
#wk-comparison-main-content .wkcmp-related__extra-inner{
  min-height:0;overflow:hidden;padding-top:0;transition:padding-top .38s ease;
}
#wk-comparison-main-content .wkcmp-related__extra.is-open{
  grid-template-rows:1fr;opacity:1;visibility:visible;
  transition:grid-template-rows .38s cubic-bezier(.2,.7,.2,1),opacity .3s ease,visibility 0s;
}
#wk-comparison-main-content .wkcmp-related__extra.is-open .wkcmp-related__extra-inner{padding-top:23px}
/* Prepared pairs without a destination must not behave as false clickable links. */
#wk-comparison-main-content .wkcmp-related__card--prepared{cursor:default;user-select:text}
@container (max-width:790px){
  #wk-comparison-main-content .wkcmp-related__grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 14px}
  #wk-comparison-main-content .wkcmp-related__card{min-height:55px;padding:6px 11px}
  #wk-comparison-main-content .wkcmp-related__logo{width:34px;height:34px;flex-basis:34px}
  #wk-comparison-main-content .wkcmp-related__label{font-size:clamp(12px,2cqw,18px)}
  #wk-comparison-main-content .wkcmp-related__more{font-size:17px}
}
@container (max-width:520px){
  #wk-comparison-main-content .wkcmp-related__grid{grid-template-columns:1fr;gap:12px}
  #wk-comparison-main-content .wkcmp-related__card{min-height:55px;padding:7px 13px}
  #wk-comparison-main-content .wkcmp-related__logo{width:36px;height:36px;flex-basis:36px}
  #wk-comparison-main-content .wkcmp-related__label{font-size:clamp(15px,4cqw,19px)}
  #wk-comparison-main-content .wkcmp-related__title{font-size:22px!important;margin-bottom:22px!important}
  #wk-comparison-main-content .wkcmp-related__more{font-size:17px}
}
@media (prefers-reduced-motion:reduce){
  #wk-comparison-main-content .wkcmp-related *{transition:none!important}
  #wk-comparison-main-content .wkcmp-related__extra{transition:none!important}
}