/* ============================================
   serwis-pakiety — holo glass pricing cards
   ============================================ */

.serwis-pakiety {
    background: linear-gradient(160deg, #e8eef6 0%, #f0f4f8 40%, #e4eef8 100%);
    position: relative;
    overflow: hidden;
}

/* Cyjanowy glow centralny */
.serwis-pakiety::before {
    content: "";
    position: absolute;
    left: 50%; top: 60%;
    transform: translate(-50%, -50%);
    width: 900px; height: 500px;
    background: radial-gradient(ellipse at center,
        rgba(56,189,248,0.22) 0%,
        rgba(125,211,252,0.10) 45%,
        transparent 70%);
    pointer-events: none; z-index: 0;
}
.serwis-pakiety .container { position: relative; z-index: 1; }

/* ---- Nagłówek sekcji ---- */
.serwis-pakiety__eyebrow {
    font-family: "JetBrains Mono", monospace;
    font-size: 0.72rem; letter-spacing: 0.14em; text-transform: uppercase;
    color: #28538E; display: inline-flex; align-items: center; gap: 10px;
}
.serwis-pakiety__eyebrow::before {
    content: ""; display: inline-block; width: 24px; height: 1px; background: #28538E;
}
.serwis-pakiety__tytul {
    font-size: clamp(2rem, 4vw, 3rem);
    font-weight: 500; letter-spacing: -0.025em; line-height: 1.1; color: #0A0A0A;
}
.serwis-pakiety__opis {
    font-size: 1rem; color: #6B6B6B; line-height: 1.6;
    max-width: 38rem; margin: 0;
}

/* ---- Karta ---- */
.serwis-pakiety__karta {
    background: rgba(255,255,255,0.82);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border-radius: 20px;
    border: 1px solid rgba(56,189,248,0.35);
    box-shadow:
        0 0 0 1px rgba(56,189,248,0.14),
        0 8px 32px rgba(40,83,142,0.07),
        inset 0 1px 0 rgba(255,255,255,0.95);
    position: relative;
    transition: transform 0.25s ease, box-shadow 0.25s ease;
}
.serwis-pakiety__karta:hover {
    transform: translateY(-5px);
    box-shadow:
        0 0 0 1px rgba(56,189,248,0.45),
        0 20px 48px rgba(40,83,142,0.12),
        0 0 40px rgba(56,189,248,0.14),
        inset 0 1px 0 rgba(255,255,255,0.95);
}

/* Narożniki cyjanowe */
.serwis-pakiety__karta::before,
.serwis-pakiety__karta::after {
    content: ""; position: absolute;
    width: 16px; height: 16px;
    border-color: rgba(56,189,248,0.65); border-style: solid;
    pointer-events: none;
}
.serwis-pakiety__karta::before {
    top: 10px; left: 10px;
    border-width: 2px 0 0 2px; border-top-left-radius: 4px;
}
.serwis-pakiety__karta::after {
    bottom: 10px; right: 10px;
    border-width: 0 2px 2px 0; border-bottom-right-radius: 4px;
}

/* Wyróżniona karta (Pro) — lekko uniesiona */
.serwis-pakiety__karta--wyro {
    transform: translateY(-10px);
    box-shadow:
        0 0 0 1px rgba(56,189,248,0.5),
        0 24px 60px rgba(40,83,142,0.16),
        0 0 56px rgba(56,189,248,0.18),
        inset 0 1px 0 rgba(255,255,255,0.95);
}
.serwis-pakiety__karta--wyro:hover { transform: translateY(-14px); }

/* ---- Etykieta "PAKIET" ---- */
.serwis-pakiety__karta-label {
    font-family: "JetBrains Mono", monospace;
    font-size: 0.62rem; letter-spacing: 0.12em;
    text-transform: uppercase; color: #9ab8d4;
}

/* Badge Najpopularniejszy */
.serwis-pakiety__badge-wyro {
    font-family: "JetBrains Mono", monospace;
    font-size: 0.6rem; letter-spacing: 0.1em; text-transform: uppercase;
    background: #28538E; color: white;
    padding: 4px 10px; border-radius: 50px;
    white-space: nowrap;
}

/* Nazwa pakietu */
.serwis-pakiety__karta-nazwa {
    font-size: 2.4rem; font-weight: 500;
    letter-spacing: -0.03em; line-height: 1; margin: 0.2rem 0 0.15rem;
    color: #0A0A0A;
}

/* Tagline */
.serwis-pakiety__karta-tagline {
    font-size: 0.88rem; color: #6B7A8A; margin: 0; line-height: 1.4;
}

/* ---- Cena ---- */
.serwis-pakiety__karta-cena {
    display: flex; align-items: baseline; gap: 4px;
}
.serwis-pakiety__cena-kwota {
    font-size: 1.8rem; font-weight: 600;
    letter-spacing: -0.02em; color: #0A0A0A; line-height: 1;
}
.serwis-pakiety__cena-okres {
    font-size: 0.82rem; color: #9ab8d4;
}

/* ---- Divider ---- */
.serwis-pakiety__divider {
    height: 1px; background: rgba(8,47,73,0.08);
}

/* ---- Cechy ---- */
.serwis-pakiety__cechy { font-size: 0.88rem; }

/* Check / X ikona */
.serwis-pakiety__check {
    width: 20px; min-width: 20px; height: 20px;
    border-radius: 50%; font-size: 10px; font-weight: 700;
    display: inline-flex; align-items: center; justify-content: center;
    margin-top: 1px; flex-shrink: 0; line-height: 1;
}
.serwis-pakiety__check--tak {
    background: rgba(40,83,142,0.12);
    color: #28538E;
    border: 1px solid rgba(40,83,142,0.20);
}
.serwis-pakiety__check--nie {
    background: transparent;
    color: #B0BAC5;
    border: 1px solid #DDE3EA;
}

/* Tekst cech niedostępnych */
.serwis-pakiety__cecha--nie .serwis-pakiety__cecha-tekst {
    text-decoration: line-through;
    color: #B0BAC5;
}

/* ---- Przyciski ---- */
.serwis-pakiety__btn {
    padding: 14px 20px;
    border-radius: 50px;
    font-size: 0.9rem; font-weight: 600;
    text-decoration: none;
    transition: all 0.2s;
    letter-spacing: 0.01em;
}
.serwis-pakiety__btn--primary {
    background: #1b3d6e; color: white;
    box-shadow: 0 4px 16px rgba(27,61,110,0.30);
}
.serwis-pakiety__btn--primary:hover {
    background: #0f2647; color: white;
    box-shadow: 0 6px 20px rgba(27,61,110,0.40);
    transform: translateY(-1px);
}
.serwis-pakiety__btn--ghost {
    background: white; color: #0A0A0A;
    border: 1px solid rgba(8,47,73,0.15);
}
.serwis-pakiety__btn--ghost:hover {
    background: #f4f6f8; color: #0A0A0A;
}

.serwis-pakiety__btn-ico {
    width: 26px; height: 26px; border-radius: 50%;
    background: rgba(255,255,255,0.18);
    display: inline-flex; align-items: center; justify-content: center;
    font-size: 0.82rem; flex-shrink: 0;
}
.serwis-pakiety__btn--ghost .serwis-pakiety__btn-ico {
    background: rgba(40,83,142,0.08);
    color: #28538E;
}

/* ---- Responsywność ---- */
@media (max-width: 991.98px) {
    .serwis-pakiety__karta--wyro { transform: none; }
    .serwis-pakiety__karta--wyro:hover { transform: translateY(-5px); }
}
@media (max-width: 767.98px) {
    .serwis-pakiety__karta { max-width: 420px; margin: 0 auto; }
}