/* Strona główna – karta reklamowa LKH Secure w przeglądarce (components/hero_secure_przegladarka.php). */
#main-content .hs-karta {
    --hs-cyjan: #3ee6c4; --hs-niebieski: #38bdf8; --hs-czerwony: #fb7185; --hs-zloty: #fbbf24;
    position: relative; z-index: 3; justify-self: end;
    width: 100%; max-width: 24.5rem; padding: 1.2rem 1.25rem 1.25rem;
    border: 1px solid rgba(255,255,255,.18); border-radius: 16px;
    background: linear-gradient(160deg, rgba(8,56,52,.94), rgba(7,42,39,.97));
    backdrop-filter: blur(12px) saturate(125%); -webkit-backdrop-filter: blur(12px) saturate(125%);
    box-shadow: 0 22px 48px -22px rgba(5,32,29,.55), 0 0 0 1px rgba(62,230,196,.12);
    color: #e6f0f6; animation: hs-wejscie .75s .25s cubic-bezier(.2,.8,.2,1) backwards;
}
@keyframes hs-wejscie { from { opacity: 0; transform: translateY(14px) scale(.97); } }

#main-content .hs-karta p.hs-plakietka { display: inline-flex; align-items: center; gap: .45rem; margin: 0 0 .75rem; padding: .28rem .7rem; border-radius: 999px; background: rgba(62,230,196,.14); color: var(--hs-cyjan); font-size: .7rem; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; }
#main-content .hs-kropka { width: .45rem; height: .45rem; border-radius: 50%; background: var(--hs-cyjan); box-shadow: 0 0 0 0 rgba(62,230,196,.7); animation: hs-puls-kropki 1.6s infinite; }
@keyframes hs-puls-kropki { 70% { box-shadow: 0 0 0 .45rem rgba(62,230,196,0); } 100% { box-shadow: 0 0 0 0 rgba(62,230,196,0); } }

/* Mini przeglądarka */
#main-content .hs-okno { overflow: hidden; border: 1px solid rgba(255,255,255,.12); border-radius: .85rem; background: #f4f6f8; box-shadow: 0 14px 30px -18px rgba(0,0,0,.8); }
#main-content .hs-pasek { display: flex; align-items: center; gap: .5rem; padding: .45rem .55rem; background: #1b2733; }
#main-content .hs-kropki { display: flex; gap: .25rem; }
#main-content .hs-kropki i { width: .45rem; height: .45rem; border-radius: 50%; background: #fb7185; }
#main-content .hs-kropki i:nth-child(2) { background: #fbbf24; } #main-content .hs-kropki i:nth-child(3) { background: #34d399; }
#main-content .hs-adres { flex: 1; min-width: 0; padding: .18rem .55rem; border-radius: 999px; background: #0e1720; color: #9db0c2; font-size: .62rem; white-space: nowrap; overflow: hidden; }
#main-content .hs-adres i { margin-right: .25rem; color: #34d399; font-size: .55rem; }
#main-content .hs-rozszerzenie { position: relative; display: grid; place-items: center; width: 1.45rem; height: 1.45rem; border-radius: .4rem; background: linear-gradient(140deg, var(--hs-cyjan), var(--hs-niebieski)); color: #03221d; font-size: .7rem; }
#main-content .hs-rozszerzenie b { position: absolute; top: -.45rem; right: -.6rem; min-width: 1.15rem; padding: .05rem .25rem; border-radius: 999px; background: #e11d48; color: #fff; font-size: .55rem; line-height: 1.3; text-align: center; font-variant-numeric: tabular-nums; }
#main-content .hs-rozszerzenie b.hs-puls { animation: hs-puls-licznik .45s ease-out; }
@keyframes hs-puls-licznik { 40% { transform: scale(1.45); } }

#main-content .hs-strona { position: relative; display: grid; gap: .45rem; height: 11.2rem; padding: .6rem; overflow: hidden; }
#main-content .hs-tresc { display: grid; grid-template-columns: minmax(0,1fr) 38%; gap: .5rem; }
#main-content .hs-tekst { display: grid; gap: .38rem; align-content: start; padding-top: .15rem; }
#main-content .hs-tekst i { display: block; height: .42rem; border-radius: 3px; background: #d5dde4; }
#main-content .hs-tekst i.krotka { width: 62%; }

#main-content .hs-reklama { position: relative; display: flex; align-items: center; justify-content: center; gap: .4rem; overflow: hidden; border-radius: .45rem; color: #fff; text-align: center; transform-origin: center; transition: transform .35s cubic-bezier(.6,-0.4,.7,1), opacity .35s, height .35s, filter .35s; }
#main-content .hs-reklama b { font-size: .68rem; font-weight: 900; letter-spacing: .02em; }
#main-content .hs-reklama small { font-size: .55rem; font-weight: 700; opacity: .9; }
#main-content .hs-reklama-gora { height: 2.3rem; background: linear-gradient(90deg, #f43f5e, #f59e0b, #f43f5e); background-size: 200% 100%; }
#main-content .hs-reklama-bok { flex-direction: column; gap: .2rem; height: 4.3rem; background: linear-gradient(160deg, #8b5cf6, #ec4899); }
#main-content .hs-reklama-bok i { font-size: 1rem; }
#main-content .hs-reklama-dol { height: 2rem; background: repeating-linear-gradient(45deg, #facc15 0 10px, #f97316 10px 20px); color: #1c1917; }
#main-content .hs-reklama-dol small { color: #1c1917; }
@keyframes hs-miganie { 50% { filter: brightness(1.25) saturate(1.3); } }
#main-content .hs-reklama.hs-zbita { animation: none; transform: scale(.2) rotate(-6deg); opacity: 0; filter: blur(4px); }

#main-content .hs-skan { position: absolute; left: 0; right: 0; top: -20%; z-index: 2; height: 18%; pointer-events: none; opacity: 0; background: linear-gradient(180deg, transparent, rgba(62,230,196,.35) 70%, rgba(62,230,196,.95)); box-shadow: 0 6px 18px rgba(62,230,196,.6); }
#main-content .hs-skanuje .hs-skan { animation: hs-skan 1.9s cubic-bezier(.45,0,.55,1) forwards; }
@keyframes hs-skan { 0% { top: -20%; opacity: 1; } 90% { opacity: 1; } 100% { top: 105%; opacity: 0; } }

#main-content .hs-iskra { position: absolute; z-index: 3; width: 5px; height: 5px; margin: -2.5px 0 0 -2.5px; border-radius: 50%; background: var(--hs-cyjan); box-shadow: 0 0 8px var(--hs-cyjan); pointer-events: none; animation: hs-iskra .65s ease-out forwards; }
#main-content .hs-iskra:nth-child(3n) { background: var(--hs-zloty); box-shadow: 0 0 8px var(--hs-zloty); }
@keyframes hs-iskra { to { transform: translate(var(--dx), var(--dy)) scale(.2); opacity: 0; } }

#main-content .hs-ostrzezenie { position: absolute; left: .6rem; right: .6rem; bottom: .6rem; z-index: 4; display: flex; align-items: center; gap: .55rem; padding: .55rem .65rem; border-radius: .6rem; background: #0b1724; border: 1px solid rgba(251,113,133,.5); box-shadow: 0 10px 24px -8px rgba(0,0,0,.6); color: #fecdd3; font-size: .62rem; line-height: 1.35; opacity: 0; transform: translateY(120%); transition: transform .45s cubic-bezier(.2,1.2,.3,1), opacity .3s; }
#main-content .hs-ostrzezenie.hs-widoczne { opacity: 1; transform: none; }
#main-content .hs-ostrzezenie > i { display: grid; place-items: center; flex: none; width: 1.7rem; height: 1.7rem; border-radius: .5rem; background: rgba(251,113,133,.18); color: var(--hs-czerwony); font-size: .8rem; }
#main-content .hs-ostrzezenie b { display: block; color: #fff; font-size: .68rem; }

/* Tekst karty */
body[data-current-page="home"] #main-content .hs-karta h2 { margin: .95rem 0 .6rem; color: #fff; font-size: 1.28rem; line-height: 1.25; letter-spacing: -.025em; }
#main-content .hs-karta h2 span { display: block; color: var(--hs-cyjan); }
#main-content .hs-ai-powod { display: flex; align-items: flex-start; gap: .5rem; margin: 0 0 .7rem; padding: .55rem .7rem; border-radius: .65rem; border: 1px solid #3cf2dc33; background: #041d24a6; color: #e9f5fb; font-size: .78rem; line-height: 1.45; }
#main-content .hs-ai-powod i { flex: 0 0 auto; margin-top: .16rem; color: var(--hs-cyjan); }
#main-content .hs-testy-przypis { display: flex; align-items: flex-start; gap: .45rem; margin: 0 0 .7rem; color: #dbe9f2; font-size: .78rem; line-height: 1.4; }
#main-content .hs-testy-przypis i { color: var(--hs-cyjan); margin-top: .18rem; flex-shrink: 0; }
#main-content .hs-testy-przypis small { color: #94adb9; font-size: .7rem; }
#main-content .hs-atuty { display: flex; flex-wrap: wrap; gap: .35rem; list-style: none; margin: 0 0 .95rem; padding: 0; }
#main-content .hs-atuty li { display: inline-flex; align-items: center; gap: .35rem; padding: .3rem .6rem; border: 1px solid rgba(255,255,255,.12); border-radius: 999px; background: rgba(255,255,255,.05); color: #cfe0ea; font-size: .7rem; }
#main-content .hs-atuty i { color: var(--hs-cyjan); font-size: .65rem; }
#main-content .hs-przycisk { display: flex; align-items: center; justify-content: center; gap: .6rem; min-height: 46px; border-radius: .7rem; background: linear-gradient(135deg, var(--hs-cyjan), var(--hs-niebieski)); color: #03221d; font-size: .88rem; font-weight: 800; text-decoration: none; box-shadow: 0 10px 26px -10px rgba(62,230,196,.8); transition: transform .2s, box-shadow .2s; }
#main-content .hs-przycisk:hover { transform: translateY(-2px); box-shadow: 0 16px 30px -10px rgba(62,230,196,.95); color: #03221d; }
#main-content .hs-przycisk:hover i { transform: translateX(3px); }
#main-content .hs-przycisk i { transition: transform .2s; }
#main-content .hs-przycisk:focus-visible { outline: 3px solid #fff; outline-offset: 3px; }
#main-content .hs-pakiety-link { display: inline-flex; align-items: center; justify-content: center; gap: .4rem; width: 100%; margin-top: .7rem; color: #b8ece2; font-size: .76rem; font-weight: 600; text-decoration: none; text-align: center; transition: color .2s; }
#main-content .hs-pakiety-link:hover { color: #fff; text-decoration: underline; text-underline-offset: 3px; }
#main-content .hs-pakiety-link i { font-size: .68rem; }

#main-content .hs-spokojna .hs-reklama { animation: none; display: none; }
#main-content .hs-spokojna .hs-ostrzezenie { opacity: 1; transform: none; }

@media (max-width: 900px) {
    #main-content .hs-karta { padding: .95rem; }
    #main-content .hs-strona { height: 9.6rem; }
    body[data-current-page="home"] #main-content .hs-karta h2 { font-size: 1.08rem; }
    #main-content .hs-atuty li:nth-child(3) { display: none; }
}
@media (max-width: 760px) {
    #main-content .hs-karta { justify-self: start; max-width: 30rem; margin: 4px 0 4px; animation-name: hs-wejscie-tel; }
    #main-content .hs-strona { height: 10.4rem; }
    #main-content .hs-atuty li:nth-child(3) { display: inline-flex; }
}
@keyframes hs-wejscie-tel { from { opacity: 0; transform: translateY(14px); } }
@media (prefers-reduced-motion: reduce) {
    #main-content .hs-karta, #main-content .hs-kropka { animation: none; }
}
/* po zbiciu strona się domyka – zostaje czysta treść */
#main-content .hs-reklama.hs-zbita { height: 0; margin-block: -.225rem; }
#main-content .hs-tresc { transition: grid-template-columns .45s ease, gap .45s ease; }
#main-content .hs-tresc:has(.hs-reklama-bok.hs-zbita) { grid-template-columns: minmax(0,1fr) 0; gap: 0; }
#main-content .hs-tekst i { transition: width .45s ease; }
