/* compsreviews.com round 6 (11/7/2026). Loads after home5.css. */

/* second button: white (default) or white with a blue line; never the shaded outline */
.btn-soft2{background:#fff!important;color:var(--blue-deep)!important;box-shadow:0 6px 16px rgba(13,34,56,.1)!important}
.btn-soft2:hover{transform:translateY(-2px)}
html[data-sb="wl"] .btn-soft2{box-shadow:inset 0 0 0 2px var(--blue),0 6px 16px rgba(13,34,56,.1)!important}
.btn-white2{background:var(--b2);color:var(--blue-deep)}
.btn-white2:hover{background:var(--b3);transform:translateY(-2px)}

/* header: Call only, with or without the icon */
html[data-call="5"] .call-link,html[data-call="5n"] .call-link{display:none}
html[data-call="5n"] .top-right .btn-main{font-size:0!important;padding:13px 30px}
html[data-call="5n"] .top-right .btn-main:before{content:"Call";font-size:16px}

/* ---------- hero positions (B locked) ---------- */
.hx.h6{justify-content:flex-start}
.hx.h6 .wrap{height:calc(100vh - 76px - 96px);min-height:620px}
.h6 h1{margin-top:0}
.h6.p1 h1{margin-top:6vh}.h6.p1 .find{margin-top:10vh}.h6.p1 .chipsrow{margin-top:auto;margin-bottom:2vh}
.h6.p2 h1{margin-top:10vh}.h6.p2 .find{margin-top:12vh}.h6.p2 .chipsrow{margin-top:auto;margin-bottom:5vh}
.h6.p3 h1{margin-top:12vh}.h6.p3 .find{margin-top:7vh}.h6.p3 .chipsrow{margin-top:auto;margin-bottom:3vh}
.h6.p4 h1{margin-top:8vh}.h6.p4 .find{margin-top:auto;margin-bottom:5vh}.h6.p4 .chipsrow{margin-top:0;margin-bottom:6vh}

/* ---------- app ---------- */
.app6 .stage4{height:720px}
.app6 .ph4{height:700px}
.app6 .pin5{margin-top:26px}
.app6.big .float4{width:280px;padding:18px 20px}
.app6.big .float4 .big{font-size:38px}
.app6.glow .float4{box-shadow:0 0 0 2px rgba(140,198,255,.8),0 24px 50px rgba(13,34,56,.3)}
.app6.glow .ph4{box-shadow:0 0 60px rgba(140,198,255,.5),0 40px 80px rgba(13,34,56,.4)}

/* ---------- average client bar: no dots, seamless fades ---------- */
.bar6{position:relative;margin-top:-2px;padding:26px 0 84px;font-family:var(--ui);color:#fff;
  background:linear-gradient(180deg,#3b8fe0 0%,#3489dd 30%,#2f85db 48%,#7fb6ea 72%,var(--b2) 100%)}
.bar6 .mq4 .trk{gap:56px;animation-duration:48s}
.bar6 .mq4:hover .trk{animation-play-state:running}
.bar6 .it{display:flex;align-items:center;gap:10px;font-size:17px;font-weight:500;white-space:nowrap}
.bar6 .it svg{width:20px;height:20px;color:#fff;background:rgba(255,255,255,.22);border-radius:50%;padding:3px}
.bar6 .lab5{font-weight:700;letter-spacing:.06em;text-transform:uppercase;font-size:14px}
.bar6.tall{padding:40px 0 110px}
.bar6.big .it{font-size:19px}
.bar6.wide .mq4 .trk{gap:80px}
.bar6.slow .mq4 .trk{animation-duration:70s}
.app4:after{height:200px;background:linear-gradient(180deg,rgba(59,143,224,0) 0%,#3b8fe0 100%)}

/* ---------- what we do: boxes never merge ---------- */
.hk6{grid-template-columns:repeat(4,minmax(0,1fr));column-gap:20px}
.hk6 h3{white-space:normal;font-size:clamp(19px,1.55vw,24px);text-wrap:balance;min-width:0}
.hk6 .tb{min-width:0}
.hk6.tight{column-gap:14px}
.hk6.tall .tb{padding:28px 22px}
.hk6.left h3,.hk6.left .tb{text-align:left}

/* ---------- offer boxes ---------- */
.o3s{background:none;display:grid;gap:14px}
.o3s > div{background:#fff;border-radius:var(--rr);box-shadow:var(--sh)}
.o3s > div + div{border-left:0}
.o3t{background:none;display:grid;gap:14px}
.o3t > div{background:#fff;border-radius:var(--rr);border-top:4px solid var(--blue)}
.o3t > div + div{border-left:0}
.o3b{background:none;display:grid;gap:14px}
.o3b > div{background:var(--b2);border-radius:var(--rr)}
.o3b > div + div{border-left:0}

/* ---------- values ---------- */
.v6{grid-template-columns:380px 1fr}
.v6 .tic{font-size:44px}
.fr{margin:0;width:330px;text-align:center}
.fr img{width:100%;height:360px;object-fit:cover;display:block}
.fr figcaption{padding:12px 0 4px}
.fr figcaption b{display:block;font-family:var(--serif);font-weight:400;font-size:32px;color:var(--head)}
.fr figcaption span{font-family:var(--ui);font-size:13px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--blue-ink)}
.fr.gold{background:#fff;padding:14px;border:10px solid #c9a35a;box-shadow:inset 0 0 0 2px #e8d29b,var(--sh-lift)}
.fr.wood{background:#fff;padding:12px;border:16px solid #6b4a2b;box-shadow:inset 0 0 0 3px #a37a4e,var(--sh-lift)}
.fr.blue{background:#fff;padding:12px;border:10px solid var(--blue);border-radius:6px;box-shadow:var(--sh-lift)}
.fr.pola{background:#fff;padding:14px 14px 4px;box-shadow:var(--sh-lift)}
.fr.oval img{border-radius:50%;width:300px;height:340px;margin:0 auto;border:8px solid #fff;box-shadow:0 0 0 4px var(--blue),var(--sh-lift)}
.fr.badge6{background:#fff;border-radius:12px;padding:12px;box-shadow:0 0 0 3px var(--blue),var(--sh-lift)}
.bcard.big6{width:380px;grid-template-columns:150px 1fr;padding:22px;border:3px solid var(--blue)}
.bcard.big6 img{width:150px;height:190px}
.bcard.big6 b{font-size:34px}
.bcard.alt{border-color:#c9a35a}
.idc.wide6{width:340px}
.idc.wide6 img{width:220px;height:250px}
.idc .ttl{display:block;font-size:13px;color:var(--muted);margin-top:4px;padding:0 20px}

/* ---------- questions D: center everything ---------- */
.ask5.two .tb{align-items:center;text-align:center}

/* ---------- why D: rank 1 glows ---------- */
.q0{background:#2bff7a;box-shadow:0 0 10px rgba(43,255,122,.85),0 2px 6px rgba(0,0,0,.18)!important;color:#0d3a1f!important}
.fr.pola figcaption{display:block;color:var(--head)}
.fr{flex:none}
.v6 .fr img{height:330px}
.hk6 h3{font-size:clamp(18px,1.45vw,22px)}

