/* Chargedeck landing pages (comparison, solution and regional pages).
   Loaded after cdk.css. Built by /root/chargedeck-seo/build.py. */

/* reveal safety net: landing-page content always becomes visible, even if the scroll observer never fires */
.lsec .rv,.band .rv{animation:rvSafe .01s linear 2.2s forwards}
@keyframes rvSafe{to{opacity:1;transform:none}}

/* breadcrumb */
.crumbs{font-family:var(--mono);font-size:.68rem;letter-spacing:.1em;text-transform:uppercase;color:var(--muted-2);padding-top:28px;display:flex;gap:9px;flex-wrap:wrap;align-items:center;position:relative;z-index:2}
.crumbs a{color:var(--muted);transition:color .2s}
.crumbs a:hover{color:var(--lime)}
.crumbs i{font-style:normal;opacity:.5}
.crumbs span[aria-current]{color:var(--violet-lt)}
.phero .crumbs + .phero-in{padding-top:34px}
.phero-in.wide{max-width:880px}
.phero-in.wide p.lead{max-width:64ch}
.phero .hero-sub{margin-top:1.1rem;font-family:var(--mono);font-size:.74rem;letter-spacing:.04em;color:var(--muted-2)}

/* sections */
.lsec{padding:68px 0 12px}
.lsec.first{padding-top:28px}
.lsec.last{padding-bottom:84px}
.lsec .sec-head h2{max-width:28ch}
.lsec .sec-head p{max-width:62ch}
.lsec .sec-head p a,.prose a,.tldr a,.lc p a,.src a,.pk a,.st a,.qa p a{color:var(--lime);font-weight:600;text-decoration:underline;text-decoration-color:rgba(203,255,58,.35);text-underline-offset:3px}
.lsec .sec-head p a:hover,.prose a:hover,.tldr a:hover,.lc p a:hover,.src a:hover,.pk a:hover,.st a:hover{text-decoration-color:var(--lime)}

/* short answer */
.tldr{position:relative;border:1px solid rgba(203,255,58,.34);background:linear-gradient(168deg,rgba(203,255,58,.07),var(--panel));border-radius:19px;padding:26px 28px;max-width:86ch}
.tldr-k{font-family:var(--mono);font-size:.66rem;letter-spacing:.18em;text-transform:uppercase;color:var(--lime)}
.tldr p{color:#E9E6FF;font-size:1.05rem;margin-top:.6rem}
.tldr p + p{margin-top:.8rem}
.tldr b{color:#fff}

/* prose */
.prose{max-width:74ch;margin-top:26px}
.prose p{color:var(--muted);font-size:1.02rem;margin:0 0 1.05em}
.prose p b,.prose p strong{color:#fff;font-weight:600}
.prose h3{font-size:1.2rem;font-weight:700;letter-spacing:-.015em;margin:1.7em 0 .5em}
.prose ul{list-style:none;display:grid;gap:9px;margin:0 0 1.2em}
.prose li{position:relative;padding-left:22px;color:var(--muted);font-size:1rem}
.prose li::before{content:"";position:absolute;left:0;top:.68em;width:10px;height:2px;border-radius:2px;background:var(--lime)}
.prose li b{color:#fff;font-weight:600}

/* numbered steps and code snippets (platform guides) */
.prose ol{counter-reset:ol;list-style:none;display:grid;gap:10px;margin:0 0 1.2em}
.prose ol li{counter-increment:ol;padding-left:34px}
.prose ol li::before{content:counter(ol);top:.1em;width:22px;height:22px;border-radius:50%;background:rgba(203,255,58,.14);color:var(--lime);font-family:var(--mono);font-size:.72rem;font-weight:700;display:grid;place-items:center}
.snip{position:relative;background:#0B0A1E;border:1px solid var(--line-2);border-radius:14px;padding:16px 18px;margin:0 0 1.3em;overflow-x:auto;font-family:var(--mono);font-size:.82rem;line-height:1.65;color:#D9D5FF;white-space:pre;-webkit-overflow-scrolling:touch}
.snip-k{display:block;font-family:var(--mono);font-size:.62rem;letter-spacing:.16em;text-transform:uppercase;color:var(--muted-2);margin:0 0 .5em}
.meth{background:var(--panel);border:1px solid var(--line);border-radius:18px;padding:26px 28px;margin-top:18px;max-width:900px}
.meth .prose{margin-top:14px;max-width:none}
.meth h3{font-size:1.18rem;font-weight:700;letter-spacing:-.015em}
.meth-k{font-family:var(--mono);font-size:.64rem;letter-spacing:.14em;text-transform:uppercase;color:var(--lime)}
.meth-n{display:inline-block;margin-top:.5rem;font-family:var(--mono);font-size:.68rem;color:var(--muted-2)}

/* cards */
.lgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:38px}
.lgrid.two{grid-template-columns:repeat(2,1fr)}
@media(max-width:980px){.lgrid{grid-template-columns:1fr 1fr}}
@media(max-width:680px){.lgrid,.lgrid.two{grid-template-columns:1fr}}
.lc{position:relative;background:var(--panel);border:1px solid var(--line);border-radius:17px;padding:24px;transition:border-color .3s,transform .3s var(--ease),box-shadow .3s}
.lc:hover{transform:translateY(-3px);border-color:var(--line-2);box-shadow:0 26px 56px -30px rgba(93,75,246,.7)}
.lc-i{width:44px;height:44px;border-radius:12px;display:grid;place-items:center;margin-bottom:15px;background:linear-gradient(150deg,rgba(93,75,246,.35),rgba(93,75,246,.12));border:1px solid rgba(138,121,255,.28);color:var(--lime)}
.lc-i svg{width:22px;height:22px}
.lc h3{font-size:1.08rem;font-weight:700;margin-bottom:.4rem;letter-spacing:-.015em}
.lc p{color:var(--muted);font-size:.94rem}
.lc p b{color:#fff;font-weight:600}
.lc .note{display:block;margin-top:.75rem;padding-top:.7rem;border-top:1px solid var(--line);font-family:var(--mono);font-size:.66rem;line-height:1.5;color:var(--muted-2)}

/* comparison table */
.cmp-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:18px;background:var(--panel);margin-top:34px;-webkit-overflow-scrolling:touch}
table.cmp{width:100%;border-collapse:collapse;min-width:660px;font-size:.93rem}
.cmp caption{caption-side:bottom;text-align:left;padding:12px 18px;font-size:.78rem;color:var(--muted-2);border-top:1px solid var(--line)}
.cmp th,.cmp td{padding:14px 18px;text-align:left;border-bottom:1px solid var(--line);vertical-align:top}
.cmp thead th{font-family:var(--mono);font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;color:var(--muted-2);background:rgba(0,0,0,.26);font-weight:600;white-space:nowrap}
.cmp thead th.us{color:var(--lime)}
.cmp tbody th{font-weight:600;color:#fff;width:28%}
.cmp td{color:var(--muted)}
.cmp td.us{background:rgba(203,255,58,.05);color:#F3F1FF}
.cmp td b{color:#fff;font-weight:600}
.cmp td.us b{color:var(--lime)}
.cmp tbody tr:last-child th,.cmp tbody tr:last-child td{border-bottom:none}
.cmp .mk{display:inline-flex;align-items:center;gap:7px}
.cmp .mk svg{width:15px;height:15px;flex:none}
.cmp .yes svg{color:var(--lime)}
.cmp .no svg{color:#F0468A}
.cmp .mid svg{color:var(--muted-2)}
.cmp .num{font-family:var(--mono);font-weight:700;color:#fff;white-space:nowrap}
.cmp td.us .num{color:var(--lime)}
@media(max-width:640px){
  table.cmp{min-width:0;font-size:.84rem}
  .cmp th,.cmp td{padding:12px 10px}
  .cmp thead th{white-space:normal;font-size:.58rem;letter-spacing:.08em}
  .cmp tbody th{width:36%}
  .cmp .mk{gap:5px;align-items:flex-start}
  .cmp .mk svg{width:13px;height:13px;margin-top:.28em}
  .cmp caption{padding:10px}
}
.src{font-size:.8rem;color:var(--muted-2);margin-top:14px;max-width:86ch;line-height:1.55}

/* pick one */
.pick{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:36px}
@media(max-width:760px){.pick{grid-template-columns:1fr}}
.pk{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:26px}
.pk.on{border-color:rgba(203,255,58,.4);background:linear-gradient(168deg,rgba(203,255,58,.06),var(--panel))}
.pk-k{font-family:var(--mono);font-size:.66rem;letter-spacing:.14em;text-transform:uppercase;color:var(--muted-2)}
.pk h3{font-size:1.15rem;font-weight:700;letter-spacing:-.02em;margin:.5rem 0 .2rem}
.pk.on h3{color:var(--lime)}
.pk ul{list-style:none;display:grid;gap:10px;margin-top:14px}
.pk li{position:relative;padding-left:22px;color:var(--muted);font-size:.94rem}
.pk li b{color:#fff;font-weight:600}
.pk li::before{content:"";position:absolute;left:0;top:.66em;width:10px;height:2px;border-radius:2px;background:var(--violet-lt)}
.pk.on li::before{background:var(--lime)}

/* steps */
.steps{counter-reset:st;display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:36px}
.steps.four{grid-template-columns:repeat(4,1fr)}
@media(max-width:980px){.steps.four{grid-template-columns:1fr 1fr}}
@media(max-width:760px){.steps,.steps.four{grid-template-columns:1fr}}
.st{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:24px;counter-increment:st}
.st::before{content:counter(st,decimal-leading-zero);display:block;font-family:var(--mono);font-size:.8rem;font-weight:700;color:var(--lime);letter-spacing:.1em;margin-bottom:.7rem}
.st h3{font-size:1.05rem;font-weight:700;letter-spacing:-.015em;margin-bottom:.35rem}
.st p{color:var(--muted);font-size:.93rem}
.st p b{color:#fff;font-weight:600}

/* plan cards (three up) */
.lplans{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:36px}
@media(max-width:900px){.lplans{grid-template-columns:1fr}}
.planc{position:relative;background:var(--panel);border:1px solid var(--line);border-radius:19px;padding:28px;display:flex;flex-direction:column}
.planc.feat{border-color:var(--line-2);background:linear-gradient(168deg,var(--panel-2),var(--panel));box-shadow:0 30px 70px -34px rgba(93,75,246,.6)}
.planc.feat::before{content:"";position:absolute;inset:-1px;border-radius:19px;padding:1px;background:linear-gradient(160deg,var(--lime),transparent 55%,var(--violet-lt));-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none}
.pc-badge{position:absolute;top:-11px;left:28px;background:var(--lime);color:var(--lime-ink);font-family:var(--mono);font-size:.6rem;letter-spacing:.14em;text-transform:uppercase;font-weight:700;padding:5px 11px;border-radius:20px;box-shadow:0 8px 22px -6px rgba(203,255,58,.7)}
.pc-name{font-family:var(--mono);font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:var(--muted-2)}
.pc-amt{font-family:var(--mono);font-size:2.5rem;font-weight:800;letter-spacing:-.05em;line-height:1;margin:.4rem 0 0}
.planc.feat .pc-amt{color:var(--lime)}
.pc-amt sub{font-family:var(--font);font-size:.9rem;font-weight:600;color:var(--muted);vertical-align:baseline;letter-spacing:0}
.pc-sub{color:var(--muted);font-size:.92rem;margin:.7rem 0 0}
.pc-list{list-style:none;margin:20px 0 24px;display:grid;gap:11px;flex:1;align-content:start}
.pc-list li{position:relative;padding-left:26px;font-size:.92rem;color:var(--muted)}
.pc-list li b{color:#fff;font-weight:600}
.pc-list li.yes::before{content:"";position:absolute;left:0;top:.18em;width:16px;height:16px;border-radius:50%;background:rgba(203,255,58,.14);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7' stroke='%23CBFF3A' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-size:12px;background-repeat:no-repeat;background-position:center}
.pc-list li.lim::before{content:"";position:absolute;left:3px;top:.62em;width:11px;height:2px;border-radius:2px;background:var(--muted-2)}
.pc-list li.all{padding-left:0;font-family:var(--mono);font-size:.66rem;letter-spacing:.12em;text-transform:uppercase;color:var(--lime)}
.pc-cta{width:100%;justify-content:center;margin-top:auto}
.plans-note{text-align:center;color:var(--muted-2);font-size:.86rem;margin-top:22px}

/* faq */
.lfaq{max-width:880px;margin-top:30px;background:var(--panel);border:1px solid var(--line);border-radius:18px;padding:8px 22px 12px}
.q{border-top:1px solid var(--line)}
.lfaq .q:first-of-type{border-top:none}
.q summary{list-style:none;cursor:pointer;padding:16px 34px 16px 4px;position:relative;font-weight:600;font-size:1rem;letter-spacing:-.01em;color:#fff;transition:color .2s}
.q summary::-webkit-details-marker{display:none}
.q summary:hover{color:var(--lime)}
.q summary:focus-visible{outline:2px solid var(--lime);outline-offset:3px;border-radius:6px}
.q summary i{position:absolute;right:4px;top:50%;width:15px;height:15px;margin-top:-7.5px}
.q summary i::before,.q summary i::after{content:"";position:absolute;background:var(--muted);border-radius:2px;transition:transform .3s var(--ease),background .2s}
.q summary i::before{top:6.5px;left:0;width:15px;height:2px}
.q summary i::after{left:6.5px;top:0;width:2px;height:15px}
.q[open] summary i::after{transform:scaleY(0)}
.q[open] summary i::before{background:var(--lime)}
.q summary h3{display:inline;font:inherit;letter-spacing:inherit}
.qa p{color:var(--muted);font-size:.96rem;padding:0 4px 16px;max-width:70ch}
.qa p b{color:#fff;font-weight:600}

/* related links */
.rel{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:30px}
@media(max-width:900px){.rel{grid-template-columns:1fr 1fr}}
@media(max-width:600px){.rel{grid-template-columns:1fr}}
.rel a{display:block;background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:18px 20px;transition:border-color .25s,transform .25s var(--ease)}
.rel a:hover{border-color:rgba(203,255,58,.45);transform:translateY(-2px)}
.rel b{display:block;font-size:.98rem;font-weight:650;letter-spacing:-.01em;color:#fff}
.rel span{display:block;color:var(--muted);font-size:.86rem;margin-top:.25rem}

/* stat row */
.lstats{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:34px}
@media(max-width:820px){.lstats{grid-template-columns:1fr 1fr}}
.ls{background:var(--panel);border:1px solid var(--line);border-radius:15px;padding:20px}
.ls b{display:block;font-family:var(--mono);font-size:1.7rem;font-weight:800;letter-spacing:-.04em;color:var(--lime);line-height:1.1}
.ls span{display:block;color:var(--muted);font-size:.86rem;margin-top:.4rem}