/* ── HERO KLASYCZNY ──────────────────────────────────────────── */
.cls-hero{background:var(--dark-bg);padding:100px 0 80px}
.cls-hero-note{margin-top:28px;display:inline-block;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);border-radius:10px;padding:10px 20px;font-size:.85rem;color:var(--txt-muted);line-height:1.6}
.cls-hero-note i{color:var(--accent);margin-right:6px}
.cls-hero-note a{color:var(--accent);text-decoration:none;font-weight:600}
.cls-hero-note a:hover{text-decoration:underline}

/* ── PRICING ─────────────────────────────────────────────────── */
.cls-pricing-sec{padding:80px 0;background:#f8fafc}
.cls-card{border:1px solid var(--border);border-radius:20px;padding:32px 28px;background:#fff;height:100%;transition:all .3s;position:relative}
.cls-card:hover{transform:translateY(-4px);box-shadow:var(--shadow)}
.cls-featured{border:2px solid var(--accent)}
.cls-name{font-size:1.25rem;font-weight:700;margin-bottom:4px;color:var(--txt-dark)}
.cls-sub{font-size:.88rem;color:var(--txt-muted);margin-bottom:16px}
.cls-price{display:flex;align-items:baseline;gap:4px;margin-bottom:4px}
.cls-pr{font-family:'Space Grotesk',sans-serif;font-size:2.8rem;font-weight:700;color:var(--txt-dark);line-height:1}
.cls-pr-dec{font-size:1.4rem;vertical-align:top}
.cls-per{font-size:.85rem;color:var(--txt-body);font-weight:400}
.cls-annual{font-size:.78rem;color:var(--txt-muted);margin-bottom:20px}
.cls-annual strong{color:var(--txt-body)}
.cls-btn{margin-bottom:24px}
.cls-specs{list-style:none;padding:0;margin:0 0 20px;border-top:1px solid var(--border);padding-top:16px}
.cls-specs li{display:flex;align-items:center;gap:10px;padding:7px 0;border-bottom:1px solid var(--border);font-size:.85rem;color:var(--txt-body)}
.cls-specs li:last-child{border-bottom:none}
.cls-specs li i{width:16px;text-align:center;color:var(--txt-muted);font-size:.85rem;flex-shrink:0}
.cls-specs li span{flex:1}
.cls-specs li strong{font-weight:600;color:var(--txt-dark)}
.cls-feat{margin-top:0}

/* ── CMS COMPATIBILITY ───────────────────────────────────────── */
.cls-cms-sec{padding:80px 0;background:#fff}
.cls-cms-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin:40px 0 24px}
.cls-cms-item{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;padding:28px 16px;border:1px solid var(--border);border-radius:16px;transition:all .3s;cursor:default}
.cls-cms-item:hover{transform:translateY(-4px);box-shadow:var(--shadow);border-color:rgba(30,177,180,.3)}
.cls-cms-item i{font-size:2.2rem;line-height:1}
.cls-cms-item span{font-size:.88rem;font-weight:600;color:var(--txt-dark)}
.cls-cms-note{font-size:.9rem;color:var(--txt-muted);max-width:520px;margin:0 auto}
.cls-cms-note strong{color:var(--txt-dark)}

/* ── DIRECTADMIN SECTION ─────────────────────────────────────── */
.cls-da-sec{padding:80px 0;background:var(--bg-alt)}
.cls-da-feature{display:flex;gap:14px;align-items:flex-start}
.cls-da-feature i{font-size:1.1rem;color:var(--accent);flex-shrink:0;margin-top:2px;width:20px;text-align:center}
.cls-da-feature strong{font-size:.9rem;font-weight:700;color:var(--txt-dark);display:block;margin-bottom:2px}
.cls-da-feature p{font-size:.82rem;color:var(--txt-muted);margin:0;line-height:1.5}

/* ── DA PREVIEW (browser mockup) ─────────────────────────────── */
.cls-da-preview{background:var(--dark-bg);border-radius:16px;overflow:hidden;box-shadow:0 20px 60px rgba(0,0,0,.3);border:1px solid rgba(255,255,255,.08)}
.cls-da-bar{background:#1e2334;display:flex;align-items:center;gap:6px;padding:10px 16px}
.cls-da-dot{width:10px;height:10px;border-radius:50%;background:#ff5f57;display:inline-block}
.cls-da-dot:nth-child(2){background:#febc2e}
.cls-da-dot:nth-child(3){background:#28c840}
.cls-da-url{flex:1;text-align:center;font-size:.72rem;color:rgba(255,255,255,.3);background:rgba(255,255,255,.05);border-radius:4px;padding:3px 10px;margin-left:8px}
.cls-da-body{display:flex;min-height:260px}
.cls-da-sidebar{width:140px;flex-shrink:0;background:#151b2d;padding:12px 0;border-right:1px solid rgba(255,255,255,.06)}
.cls-da-menu-item{display:flex;align-items:center;gap:8px;padding:9px 16px;font-size:.75rem;color:rgba(255,255,255,.4);cursor:pointer;transition:all .2s}
.cls-da-menu-item i{font-size:.75rem;width:14px;text-align:center}
.cls-da-menu-item.active{background:rgba(30,177,180,.12);color:var(--accent);border-right:2px solid var(--accent)}
.cls-da-content{flex:1;padding:20px}
.cls-da-stat-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.cls-da-stat{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.07);border-radius:10px;padding:14px;text-align:center}
.cls-da-stat-val{display:block;font-family:'Space Grotesk',sans-serif;font-size:1.4rem;font-weight:700;color:var(--txt-light);line-height:1;margin-bottom:4px}
.cls-da-stat-lbl{display:block;font-size:.7rem;color:rgba(255,255,255,.35);text-transform:uppercase;letter-spacing:.5px}

/* ── COMPARISON TABLE ────────────────────────────────────────── */
.cls-vs-sec{padding:80px 0;background:#fff}
.cls-vs-table-wrap{overflow-x:auto;border-radius:16px;box-shadow:0 2px 20px rgba(0,0,0,.06);margin-top:40px;margin-bottom:32px}
.cls-vs-table{width:100%;border-collapse:collapse;background:#fff;font-size:.9rem}
.cls-vs-table thead tr{background:var(--dark-bg)}
.cls-vs-th-label{width:220px;padding:16px 20px}
.cls-vs-th{padding:16px 24px;font-weight:700;font-size:.8rem;letter-spacing:.5px;text-transform:uppercase;color:var(--txt-muted);text-align:center}
.cls-vs-th.cls-vs-wp{color:var(--accent);background:rgba(30,177,180,.1)}
.cls-vs-table tbody tr{border-bottom:1px solid var(--border)}
.cls-vs-table tbody tr:last-child{border-bottom:none}
.cls-vs-table tbody tr:nth-child(even){background:#fafbfc}
.cls-vs-table tbody tr:hover{background:#f0fdfe}
.cls-vs-label{padding:14px 20px;font-weight:600;font-size:.85rem;color:var(--txt-body);text-align:left}
.cls-vs-table td{padding:14px 24px;text-align:center;color:var(--txt-body)}
.cls-vs-val{font-weight:500;color:var(--txt-body)}
.cls-vs-table td.cls-vs-wp{background:rgba(30,177,180,.04);border-left:1px solid rgba(30,177,180,.15)}
.cls-vs-win{font-weight:700;color:var(--accent)}
.cls-vs-win i{margin-right:5px;font-size:.8rem}
.cls-vs-no{color:#94a3b8;font-weight:500}
.cls-vs-no i{margin-right:4px;font-size:.8rem}

/* ── RESPONSIVE ──────────────────────────────────────────────── */
@media(max-width:991px){
  .cls-cms-grid{grid-template-columns:repeat(4,1fr)}
}
@media(max-width:768px){
  .cls-pr{font-size:2.2rem}
  .cls-cms-grid{grid-template-columns:repeat(2,1fr)}
  .cls-da-sidebar{width:110px}
  .cls-da-menu-item{font-size:.7rem;padding:8px 10px}
  .cls-vs-table{font-size:.8rem}
  .cls-vs-th,.cls-vs-label,.cls-vs-table td{padding:12px 12px}
  .cls-vs-th-label{width:140px}
  .cls-da-sec .sec-title{font-size:1.6rem}
  .cls-hero-note{font-size:.8rem}
}
@media(max-width:480px){
  .cls-cms-grid{grid-template-columns:repeat(2,1fr)}
}