/* Competitor Intelligence AI (redesign): the comparison wall. The positioning map on a framed ribbon stage (the only
   place the ribbon appears in the hero) beside its reading; below, one column per business, every claim typed. */
.ci-hero{padding-bottom:var(--s9)}
.ci-top-row{margin-top:var(--s8);display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:var(--s7);align-items:center}
.ci-stage{margin:0}
.ci-stage>.x-stage-in{padding:clamp(14px,3.4vw,48px)}
.ci-map{padding:18px}
.ci-plane{position:relative;height:470px;container-type:size;border-radius:16px;background:
  linear-gradient(#fff,#fff) padding-box,
  linear-gradient(90deg,#E6F0FD,#fff 50%,#E6F0FD) border-box;border:1px solid var(--line)}
.ci-plane::before,.ci-plane::after{content:"";position:absolute;background:#D5E3F6}
.ci-plane::before{left:50%;top:0;bottom:0;width:1px}.ci-plane::after{top:50%;left:0;right:0;height:1px}
.ax{position:absolute;font-size:13.5px;font-weight:700;color:var(--text);background:#fff;padding:2px 8px;border-radius:6px;z-index:1}
.ax-x0{left:10px;top:calc(50% + 8px)}.ax-x1{right:10px;top:calc(50% + 8px)}
.ax-y0{left:calc(50% + 8px);bottom:10px}.ax-y1{left:calc(50% + 8px);top:10px}
.ci-dot{position:absolute;left:0;top:0;z-index:2;display:flex;align-items:center;gap:10px;transform:translate(calc(var(--x,50) * 1cqw - 13px),calc((100 - var(--y,50)) * 1cqh - 13px));transition:transform .95s cubic-bezier(.65,0,.35,1)}
.ci-dot i{width:26px;height:26px;border-radius:50%;box-shadow:0 0 0 5px #fff,0 8px 20px -6px rgba(11,42,102,.45)}
.ci-dot span{font-size:15px;font-weight:800;color:var(--ink);background:rgba(255,255,255,.92);padding:3px 8px;border-radius:8px;white-space:nowrap}
.dot-a i{background:#FF6B78}.dot-b i{background:#FFC65A}.dot-c i{background:#19BCA9}
.dot-you i{background:#087FFF;width:30px;height:30px;box-shadow:0 0 0 5px #fff,0 0 0 8px #087FFF,0 10px 24px -6px rgba(8,112,230,.5)}
.dot-you span{color:var(--deep)}
.ci-dot.right{flex-direction:row-reverse;transform:translate(calc(var(--x,50) * 1cqw - 100% + 13px),calc((100 - var(--y,50)) * 1cqh - 13px))}
.ci-gap{position:absolute;left:0;top:0;width:200px;height:200px;border-radius:50%;transform:translate(calc(var(--gx,50) * 1cqw - 100px),calc((100 - var(--gy,50)) * 1cqh - 100px));transition:transform .95s cubic-bezier(.65,0,.35,1);
  background:radial-gradient(closest-side,rgba(39,203,245,.30),rgba(39,203,245,.12) 60%,rgba(39,203,245,0));box-shadow:inset 0 0 0 2px rgba(10,111,148,.35)}
.ci-gap::after{content:"Open space";position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);font-size:14px;font-weight:800;color:var(--t-cyan)}
.ci-note{margin-top:18px;font-size:18px;line-height:1.5;font-weight:700;color:var(--ink);min-height:54px}
@media (prefers-reduced-motion:reduce){.ci-dot,.ci-gap{transition:none}}
.ci-read{display:grid;gap:var(--s4);align-content:center}
.ci-lens{display:flex;flex-wrap:wrap;gap:8px}
.ci-lens button{height:44px;padding:0 18px;border-radius:12px;background:#fff;box-shadow:inset 0 0 0 1.5px var(--line);font-size:15.5px;font-weight:700;color:var(--ink);transition:background-color .3s ease,color .3s ease,box-shadow .3s ease}
.ci-lens button[aria-pressed="true"]{background:#0870E6;color:#fff;box-shadow:none}
.ci-note{font-size:clamp(21px,1.9vw,26px);line-height:1.35;letter-spacing:-.015em;font-weight:800;color:var(--ink);min-height:3.6em;text-wrap:balance}

/* the wall: one column per business */
.ci-wall-wrap{margin-top:var(--s8);display:grid;gap:var(--s5)}
.ci-filt{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.ci-filt button{height:42px;padding:0 14px;border-radius:12px;background:#fff;box-shadow:inset 0 0 0 1.5px var(--line);font-size:15px;font-weight:700;color:var(--ink);display:inline-flex;align-items:center}
.ci-filt button .ev{margin:0}
.ci-filt button[aria-pressed="true"]{box-shadow:inset 0 0 0 2px var(--cobalt);background:var(--cloud)}
.ci-wall{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.co{overflow:hidden}
.co-h{display:flex;gap:12px;align-items:flex-start;padding:18px 20px;border-bottom:1px solid var(--line)}
.co-h h3{font-size:19px;letter-spacing:-.01em;color:var(--ink)}.co-h p{margin-top:2px;font-size:14.5px;line-height:1.4;color:var(--text)}
.co-dot{position:static;transform:none;flex:none;padding-top:3px}.co-dot i{display:block;width:18px;height:18px;border-radius:50%;box-shadow:none}
.co-you{box-shadow:0 0 0 2px var(--cobalt),var(--sh-ui)}.co-you .co-h{background:var(--cloud)}
.co dl{display:grid}
.co dl div{display:grid;gap:6px;justify-items:start;padding:14px 20px;border-top:1px solid var(--line);transition:opacity .3s ease,background-color .3s ease}
.co dl div:first-child{border-top:0}
.co dt{font-size:14px;font-weight:700;color:var(--deep)}
.co dd{display:grid;gap:6px;justify-items:start;font-size:16px;line-height:1.45;color:var(--ink);font-weight:600}
.ev{display:block;margin-top:8px;justify-self:start;width:max-content;padding:2px 9px;border-radius:6px;font-size:12px;font-weight:800}
.ev-v{background:#E3F7F4;color:var(--t-teal)}.ev-c{background:#E6F0FD;color:var(--deep)}.ev-i{background:#F2F5FA;color:#8F5E00}.ev-u{background:#FFE9EC;color:var(--t-coral)}
.ev{display:inline-block;margin:0;width:auto;font-size:13px;padding:3px 10px}
.ci-wall:not([data-f=all]) [data-ev]{opacity:.3}
.ci-wall[data-f=v] [data-ev=v],.ci-wall[data-f=c] [data-ev=c],.ci-wall[data-f=i] [data-ev=i],.ci-wall[data-f=u] [data-ev=u]{opacity:1;background:#F7FAFF}
.ci-foot{font-size:15px;color:var(--text)}

/* alternatives, from most to least like you */
.ci-alt-head{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:var(--s5) var(--s9);align-items:end}
.alt-row{margin-top:var(--s8);display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;position:relative}
.alt-row::before{content:"";position:absolute;left:0;right:0;top:0;height:4px;border-radius:4px;background:linear-gradient(90deg,#087FFF,#27CBF5 42%,#FF6B78 70%,#FFC65A)}
.alt-row li{display:grid;gap:8px;padding:28px 24px 0 0}
.alt-row b{font-size:21px;line-height:1.25;letter-spacing:-.012em;color:var(--ink)}
.alt-row span{font-size:16.5px;line-height:1.5;color:var(--text)}
.ci-src{margin-top:var(--s6);font-size:15px;color:var(--text)}

@media (max-width:1100px){
  .ci-top-row,.ci-alt-head{grid-template-columns:1fr}
  .ci-wall{grid-template-columns:1fr 1fr}
  .alt-row{grid-template-columns:1fr 1fr;row-gap:var(--s5)}
}
@media (max-width:760px){
  .ci-plane{height:400px}.ci-map{padding:10px}
  .ci-dot span{font-size:13px}.ax{font-size:12px}
  .ci-wall{grid-template-columns:1fr}
  .alt-row{grid-template-columns:1fr}
}
