/* Landing cards: sale alerts (#c5), cost comparison (#c4), hosted plans (#c6). */
.card .hv{transition:transform .3s cubic-bezier(.3,1.5,.5,1)}.card .hv:hover{transform:translateX(6px)}
.card .sc{width:38px;height:38px;border-radius:11px;display:grid;place-items:center;background:#fff;box-shadow:0 0 0 1px var(--line);flex:none}
.card .sc.k{background:#000}.card .sc.k img{filter:invert(1)}.card .sc img{width:20px;height:20px}
.card .pill{display:inline-block;padding:3px 10px;border-radius:99px;background:#dff5e7;color:var(--green);font-weight:600;white-space:nowrap}
.card .tm{color:var(--muted);font-size:12px;white-space:nowrap}
.card .nt2{margin-top:16px}
.card .clay{filter:drop-shadow(0 10px 14px rgba(30,40,90,.18));animation:flo 4.5s ease-in-out infinite alternate}

/* alerts */
.bnx{display:grid;gap:10px}
.bnr{display:grid;grid-template-columns:38px 1fr auto auto;gap:12px;align-items:center;background:#fff;border-radius:18px;padding:12px 14px;box-shadow:0 8px 22px rgba(20,20,40,.09),0 0 0 1px rgba(0,0,0,.05)}
.bnr b,.bnr .sm{display:block}

/* comparison */
.cmp-h{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:14px;color:var(--muted)}
.cmp-h b{color:var(--ink);font-size:22px;font-weight:600;font-variant-numeric:tabular-nums}
.duo{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:10px}
.who{display:flex;align-items:center;gap:6px;background:#fff;border-radius:20px;padding:10px 14px 10px 6px;box-shadow:0 0 0 1px rgba(0,0,0,.06);overflow:hidden}
.who>img{width:84px;height:84px;object-fit:contain;flex:none}
.who>div{min-width:0}.who .sm{display:block}
.card .who .big{display:block;font-size:clamp(30px,7vw,42px);font-weight:600;letter-spacing:-.045em;line-height:1.1;font-variant-numeric:tabular-nums;transition:color .3s}
.who.over .big{color:#c8374a}
.cmp-f{margin-top:6px;padding:11px 14px;border-radius:12px;background:#fff;color:var(--muted);box-shadow:0 0 0 1px rgba(0,0,0,.05);transition:color .3s,background .3s}
.cmp-f.bad{background:#fff1f1;color:#b42318}
.cmp-c{width:100%;height:auto;display:block;margin-bottom:8px}.cmp-c text{font-size:12px!important;fill:var(--muted)}
.cmp-c .cuv{transition:transform .55s cubic-bezier(.3,.8,.3,1)}

/* plans */
.pls{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.plc{background:#fff;border-radius:22px;padding:12px 12px 20px;box-shadow:0 0 0 1px rgba(0,0,0,.06);transition:transform .25s,box-shadow .25s}
.plc:hover{transform:translateY(-4px);box-shadow:0 14px 30px rgba(20,20,40,.12),0 0 0 1px rgba(0,0,0,.05)}
.plc>:not(.stg){margin-left:8px;margin-right:8px}
.stg{max-width:none;padding:0;height:136px;border-radius:16px;display:grid;place-items:center;margin-bottom:14px;background:linear-gradient(180deg,#dcecff,#f3f8ff)}
.plc.g .stg{background:linear-gradient(180deg,#ffe9b8,#fff8e6)}
.stg img{height:116px;width:auto;max-width:90%;object-fit:contain}
.plc.g .stg img{height:128px}
.card .pn{font-weight:600;color:var(--muted)}
.card .pv{font-size:clamp(38px,8vw,52px);font-weight:600;letter-spacing:-.045em;line-height:1.05;margin:6px 0 12px}.pv small{font-size:15px;color:var(--muted);letter-spacing:0;margin-left:3px}
.mt{height:8px;border-radius:5px;background:#e6e9f1;overflow:hidden;margin:2px 0 8px}.mt i{display:block;height:100%;background:var(--blue);border-radius:5px}
.fl2{list-style:none;margin:14px 0 0;padding:0;display:grid;gap:8px}.fl2 li{display:flex;gap:8px;align-items:center;color:var(--muted)}
.fl2 svg{width:16px;height:16px;color:var(--green);flex:none}


/* buy buttons */
.card .buy{display:flex;align-items:center;justify-content:center;gap:6px;margin:16px 8px 0;padding:13px 18px;border-radius:99px;background:var(--ink);color:#fff;font-size:15px;font-weight:600;text-decoration:none;transition:transform .2s,box-shadow .2s}
.card .buy:hover{transform:translateY(-2px);box-shadow:0 10px 22px rgba(20,20,40,.25)}
.card .buy .arr{display:inline-block;font-size:15px;transition:transform .2s}.card .buy:hover .arr{transform:translate(3px,-3px)}
.plc .buy{margin:18px 8px 0}

/* $49 self-hosted card */
.big49{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);padding:12px;margin-top:44px}
.stg49{position:relative;border-radius:20px;background:linear-gradient(180deg,#ffe9b8,#fff7e0);display:grid;place-items:center;min-height:300px;overflow:hidden}
.stg49 .main{width:auto;height:230px;max-width:80%;object-fit:contain}
.stg49 .tg{position:absolute;width:auto;height:92px;right:8%;top:10%;animation-delay:-2s}
.b49{padding:24px 22px 18px}
.card .bdg{display:inline-block;padding:5px 12px;border-radius:99px;background:#e9f0ff;color:var(--blue);font-weight:600}
.card .p49{font-size:clamp(64px,13vw,96px);font-weight:600;letter-spacing:-.055em;line-height:1;margin:14px 0 18px}
.p49 small{font-size:17px;letter-spacing:0;color:var(--muted);margin-left:8px;font-weight:500}
.b49 .fl2{margin:0}.card .b49 .fl2 li{font-size:15px;color:var(--ink)}
.b49 .buy.lg{margin:24px 0 0;padding:17px 22px;font-size:17px}.card .b49 .buy.lg{font-size:17px}
.card .fine{margin:14px 0 0;text-align:center}.fine a.d{color:var(--ink);text-decoration:underline}

/* landing: the journey strip and scroll cue */
.hz{position:relative;height:150px;margin:30px 0 0;display:flex;justify-content:space-between;align-items:center}
.hzl{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.hzl path{fill:none;stroke:#2447d6;stroke-width:4;stroke-linecap:round;stroke-dasharray:1 13;opacity:.4;animation:hzd 1.6s linear infinite}
@keyframes hzd{to{stroke-dashoffset:-28}}
.hzo{position:relative;width:72px;height:72px;object-fit:contain;filter:drop-shadow(0 10px 12px rgba(30,40,90,.22));animation:hzf 4.2s ease-in-out var(--t,0s) infinite alternate,hzin .9s cubic-bezier(.3,1.5,.5,1) backwards}
.hzo:nth-of-type(1){animation-delay:0s}
.hzp{width:84px;height:84px;transform:rotate(18deg)}
@keyframes hzf{from{transform:translateY(calc(var(--y,0px) - 6px))}to{transform:translateY(calc(var(--y,0px) + 6px))}}
@keyframes hzin{from{opacity:0;scale:.5}}
.hzs{display:flex;width:max-content;margin:6px auto 0;align-items:center;gap:8px;padding:9px 16px;border-radius:99px;background:#fff;box-shadow:0 0 0 1px rgba(0,0,0,.08),0 8px 20px rgba(20,20,40,.08);color:var(--ink);font-size:14px;font-weight:500;text-decoration:none;transition:opacity .4s,transform .4s}
.hzs i{font-style:normal;display:inline-block;animation:hzb 1.3s ease-in-out infinite}
@keyframes hzb{50%{transform:translateY(4px)}}
.hzs.gone{opacity:0;transform:translateY(-8px);pointer-events:none}

@media (max-width:760px){
  .big49{grid-template-columns:1fr}
  .stg49{min-height:240px}.stg49 .main{height:190px}
}
@media (max-width:560px){.hzo{width:56px;height:56px}.hzp{width:64px;height:64px}.hz{height:130px}}
@media (prefers-reduced-motion:reduce){.hzo,.hzl path,.hzs i{animation:none}}

@media (max-width:560px){
  .bnr{grid-template-columns:38px 1fr auto}.bnr .tm{display:none}
  .duo{grid-template-columns:1fr}
  .pls{grid-template-columns:1fr}
  .stg{height:150px}
}
@media (prefers-reduced-motion:reduce){.card .clay{animation:none}}