/* v58 (11/09/2026): /cost-guide and /offers */
.cg-rules{display:grid;gap:12px;background:#0b1017;color:#e8edf5;border-radius:26px;padding:24px;box-shadow:0 50px 100px -40px rgba(11,16,23,.6);position:relative;overflow:hidden}
.cg-rules:before{content:"";position:absolute;inset:-40%;background:conic-gradient(from 180deg at 50% 50%,rgba(47,111,209,0),rgba(47,111,209,.25),rgba(124,92,240,.25),rgba(47,111,209,0));filter:blur(40px);animation:b2bspin 18s linear infinite;pointer-events:none}
.cg-rule{position:relative;display:grid;grid-template-columns:36px 1fr;gap:14px;align-items:start;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08);border-radius:16px;padding:14px 16px}
.cg-rule b{width:36px;height:36px;border-radius:12px;background:linear-gradient(135deg,#2f6fd1,#7c5cf0);display:grid;place-items:center;font-family:var(--head);color:#fff}
.cg-rule strong{display:block;font-family:var(--head);font-size:.98rem;color:#fff;margin-bottom:2px}
.cg-rule span{color:#a9b5c6;font-size:.86rem;line-height:1.45}

.cg-grid{display:grid;grid-template-columns:300px 1fr;gap:22px;margin-top:36px;align-items:start}
.cg-syms{display:grid;gap:8px;position:sticky;top:96px}
.cg-sym{text-align:left;font-family:var(--head);font-weight:600;font-size:.95rem;color:var(--ink);background:var(--card);border:1px solid var(--line);border-radius:14px;padding:14px 16px;cursor:pointer;box-shadow:var(--shadow-xs);transition:all .3s var(--ease);display:flex;align-items:center;gap:10px}
.cg-sym:before{content:"";width:9px;height:9px;border-radius:50%;background:var(--line-2);transition:background .3s,box-shadow .3s;flex-shrink:0}
.cg-sym:hover{transform:translateX(4px);border-color:var(--line-2)}
.cg-sym.on{border-color:var(--accent);background:var(--accent-soft);color:var(--accent-2);box-shadow:var(--shadow)}
.cg-sym.on:before{background:var(--accent);box-shadow:0 0 0 4px var(--accent-ring)}
.cg-card{background:var(--card);border:1px solid var(--line);border-radius:26px;padding:30px 32px;box-shadow:var(--shadow-lg);position:relative;overflow:hidden}
.cg-card:before{content:"";position:absolute;inset:0 0 auto 0;height:4px;background:var(--v2-grad)}
.cg-card.swap>*{animation:v56fadein .45s var(--ease) both}
.cg-head h3{font-size:clamp(1.4rem,2.6vw,1.9rem);letter-spacing:-.02em;margin:4px 0 0;color:var(--ink)}
.cg-meter{display:flex;align-items:center;gap:12px;margin:22px 0 8px;font-family:var(--head);font-weight:700;font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;color:var(--soft)}
.cg-meter .bar{flex:1;height:10px;border-radius:999px;background:var(--sky-2);overflow:hidden}
.cg-meter .bar i{display:block;height:100%;transform-origin:left;transform:scaleX(0);transition:transform .8s var(--ease);background:linear-gradient(90deg,#1f9d57,#b7791f,#c2410c)}
.cg-cols{display:grid;grid-template-columns:1fr 1.4fr;gap:18px;margin-top:18px}
.cg-cols>div,.cg-drivers{background:var(--sky);border:1px solid var(--line);border-radius:16px;padding:16px 18px}
.cg-cols small,.cg-drivers small{display:block;font-family:var(--head);font-weight:700;font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;color:var(--soft);margin-bottom:8px}
.cg-cols b{font-family:var(--head);font-size:1.15rem;color:var(--ink)}
.cg-card ul{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.cg-card li{position:relative;padding-left:20px;color:var(--text);font-size:.94rem;line-height:1.45}
.cg-card li:before{content:"";position:absolute;left:0;top:.55em;width:8px;height:8px;border-radius:50%;background:var(--accent)}
.cg-drivers{margin-top:14px}
.cg-drivers li:before{background:#b7791f}
.cg-note{margin:16px 0 20px;padding:12px 16px;border-left:3px solid var(--warn);background:#fff8ea;border-radius:0 10px 10px 0;color:#6b4a0c;font-weight:600;font-size:.92rem}
.cg-why .b2b-card h3{font-size:1.2rem}
[data-theme="dark"] .cg-sym{background:#121a26;border-color:#232d3b;color:#e6ecf5}
[data-theme="dark"] .cg-card,[data-theme="dark"] .cg-cols>div,[data-theme="dark"] .cg-drivers{background:#121a26;border-color:#232d3b}
[data-theme="dark"] .cg-head h3,[data-theme="dark"] .cg-cols b{color:#fff}
[data-theme="dark"] .cg-note{background:#2a2110;color:#f3cf8a}

/* offers card */
.of-card{position:relative;background:#0b1017;color:#e8edf5;border-radius:26px;padding:24px;box-shadow:0 50px 100px -40px rgba(11,16,23,.6);overflow:hidden;transform:rotate(1deg);transition:transform .9s var(--ease)}
.of-card:hover{transform:none}
.of-card:before{content:"";position:absolute;inset:-40%;background:conic-gradient(from 180deg at 50% 50%,rgba(47,111,209,0),rgba(47,111,209,.28),rgba(124,92,240,.28),rgba(47,111,209,0));filter:blur(40px);animation:b2bspin 18s linear infinite;pointer-events:none}
.of-card>*{position:relative}
.of-card-top{display:flex;justify-content:space-between;align-items:center;font-family:var(--head);font-weight:700;font-size:.82rem;margin-bottom:16px}
.of-big{font-family:var(--head);font-weight:800;font-size:2.1rem;letter-spacing:-.03em;line-height:1;background:linear-gradient(92deg,#9fc0f0,#c7b5ff);-webkit-background-clip:text;background-clip:text;color:transparent;padding:6px 0 14px;border-bottom:1px dashed rgba(255,255,255,.18);margin-bottom:12px}
.of-big small{display:block;font-size:.8rem;font-weight:600;letter-spacing:.02em;color:#a9b5c6;-webkit-text-fill-color:#a9b5c6;margin-top:8px}
.of-row{display:flex;justify-content:space-between;gap:12px;padding:9px 0;border-bottom:1px solid rgba(255,255,255,.07);font-size:.9rem}
.of-row span{color:#a9b5c6}.of-row b{color:#fff;font-family:var(--head);text-align:right}
.of-print{margin-top:16px;width:100%;font-family:var(--head);font-weight:700;font-size:.86rem;color:#0b1017;background:#fff;border:0;border-radius:999px;padding:12px;cursor:pointer;transition:transform .2s}
.of-print:hover{transform:translateY(-2px)}
@media print{header,.topbar,footer,.v2-strip,.block,.cta,.v56-bar,.mobile-bar,.of-print,.pagehero-cta,.crumb{display:none!important}.of-card{transform:none;box-shadow:none;border:2px solid #000;color:#000;background:#fff}.of-card:before{display:none}.of-big{-webkit-text-fill-color:#000;color:#000;background:none}.of-row b,.of-card .b2b-live,.of-card .b2b-wo{color:#000}}

@media(max-width:1000px){.cg-grid{grid-template-columns:1fr}.cg-syms{position:static;grid-template-columns:1fr 1fr}}
@media(max-width:760px){.cg-syms{grid-template-columns:1fr}.cg-cols{grid-template-columns:1fr}.of-card{transform:none}}