/*
Theme Name: Hokej Superliga
Author: idea4me
Description: Motyw strony Hokej Superligi (PZHT). Treści w WordPressie, dane rozgrywek z systemu PZHT przez wtyczkę PZHT Rozgrywki. Bez zewnętrznych czcionek i skryptów - wszystko serwowane z własnego serwera.
Version: 1.0.0
Text Domain: superliga
*/
:root{--hs-red:#d0112b;--hs-red2:#a30d22;--hs-ink:#0e1a26;--hs-ink2:#16283a;--hs-muted:#62717e;--hs-line:#e3e8ee;--hs-bg:#f3f5f8}
*{box-sizing:border-box}html{scroll-behavior:smooth}
body{margin:0;font-family:"Segoe UI",-apple-system,BlinkMacSystemFont,Roboto,"Helvetica Neue",Arial,sans-serif;background:var(--hs-bg);color:var(--hs-ink);font-size:16px;line-height:1.55;-webkit-font-smoothing:antialiased}
a{color:var(--hs-red);text-decoration:none}a:hover{color:var(--hs-red2)}img{max-width:100%;height:auto}
.hs-wrap{max-width:1240px;margin:0 auto;padding:0 20px}
/* nagłówek */
.hs-top{background:var(--hs-ink);color:#fff;position:sticky;top:0;z-index:100;box-shadow:0 2px 18px rgba(0,0,0,.25)}
.hs-top .hs-wrap{display:flex;align-items:center;gap:18px;min-height:68px}
.hs-logo{display:flex;align-items:center;gap:12px;color:#fff;font-weight:900;font-size:19px;letter-spacing:.04em;text-transform:uppercase;line-height:1.05}.hs-logo:hover{color:#fff}
.hs-logo img{height:44px;width:auto}.hs-logo i{display:block;width:6px;height:38px;background:var(--hs-red);border-radius:3px;transform:skewX(-12deg)}.hs-logo small{display:block;font-size:10.5px;font-weight:600;letter-spacing:.16em;color:#9fb0bf}
.hs-nav{margin-left:auto}.hs-nav ul{list-style:none;margin:0;padding:0}.hs-nav>ul{display:flex;gap:2px;flex-wrap:wrap;justify-content:flex-end}
.hs-nav li{position:relative}.hs-nav a{display:block;color:#dbe4ec;padding:10px 10px;border-radius:9px;font-size:14px;font-weight:600;white-space:nowrap}
.hs-nav a:hover,.hs-nav .current-menu-item>a,.hs-nav .current-menu-parent>a{background:rgba(255,255,255,.10);color:#fff}
.hs-nav .menu-item-has-children>a:after{content:"";display:inline-block;margin-left:7px;border:4px solid transparent;border-top-color:currentColor;vertical-align:-2px}
.hs-nav ul ul{position:absolute;top:100%;left:0;min-width:250px;background:#fff;border-radius:12px;box-shadow:0 16px 40px rgba(14,26,38,.22);padding:8px;opacity:0;visibility:hidden;transform:translateY(6px);transition:all .16s;z-index:20}
.hs-nav li:hover>ul,.hs-nav li:focus-within>ul{opacity:1;visibility:visible;transform:none}.hs-nav ul ul a{color:var(--hs-ink);font-weight:500;white-space:normal}.hs-nav ul ul a:hover{background:var(--hs-bg);color:var(--hs-red)}
.hs-nav>ul>li:nth-last-child(-n+3)>ul{left:auto;right:0}
.hs-nav li.hs-cta>a{background:var(--hs-red);color:#fff}.hs-nav li.hs-cta>a:hover{background:var(--hs-red2)}
.hs-burger{display:none;margin-left:auto;background:none;border:0;color:#fff;font-size:26px;cursor:pointer;padding:6px 10px;border-radius:8px}
/* układ */
.hs-main{padding:26px 0 50px}.hs-sek{margin-top:38px}
.hs-h{display:flex;justify-content:space-between;align-items:flex-end;gap:12px;margin-bottom:14px}.hs-h h2{margin:0;font-size:24px;font-weight:800;position:relative;padding-left:16px}
.hs-h h2:before{content:"";position:absolute;left:0;top:4px;bottom:4px;width:6px;background:var(--hs-red);border-radius:3px;transform:skewX(-12deg)}.hs-h a{font-weight:600;font-size:14.5px}
.hs-2{display:grid;grid-template-columns:1.25fr 1fr;gap:24px}.hs-3{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
/* hero */
.hs-hero{display:grid;grid-template-columns:1.7fr 1fr;gap:18px}
.hs-hero .duzy{position:relative;border-radius:20px;overflow:hidden;min-height:420px;background:linear-gradient(135deg,var(--hs-ink2),var(--hs-ink));display:flex;align-items:flex-end;color:#fff}
.hs-hero .duzy img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.hs-hero .duzy:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(14,26,38,0) 30%,rgba(14,26,38,.92) 100%)}
.hs-hero .duzy .tx{position:relative;z-index:2;padding:28px}.hs-hero .duzy h1{margin:8px 0 6px;font-size:32px;line-height:1.15;font-weight:800}.hs-hero .duzy:hover{color:#fff}.hs-hero .duzy p{margin:0;color:#c9d5df;max-width:640px}
.hs-hero .bok{display:grid;gap:14px}.hs-kat{display:inline-block;background:var(--hs-red);color:#fff;font-size:11.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;padding:4px 10px;border-radius:6px}
/* karty wpisów */
.hs-karta{background:#fff;border:1px solid var(--hs-line);border-radius:16px;overflow:hidden;display:flex;flex-direction:column;color:var(--hs-ink);transition:transform .16s,box-shadow .16s}
.hs-karta:hover{transform:translateY(-3px);box-shadow:0 14px 30px rgba(14,26,38,.10);color:var(--hs-ink)}
.hs-karta .ob{aspect-ratio:16/9;background:linear-gradient(135deg,var(--hs-ink2),var(--hs-ink));position:relative;overflow:hidden}.hs-karta .ob img{width:100%;height:100%;object-fit:cover;display:block}
.hs-karta .ob .gra{position:absolute;inset:0;display:flex;align-items:center;justify-content:center}.hs-karta .ob .gra span{width:58px;height:58px;border-radius:50%;background:rgba(208,17,43,.92);display:flex;align-items:center;justify-content:center;color:#fff;font-size:22px;padding-left:4px}
.hs-karta .tx{padding:14px 16px 16px}.hs-karta h3{margin:6px 0 0;font-size:17px;line-height:1.3}.hs-karta time{font-size:12.5px;color:var(--hs-muted)}
.hs-karta.poz{flex-direction:row}.hs-karta.poz .ob{width:42%;aspect-ratio:auto;min-height:118px}.hs-karta.poz .tx{flex:1}.hs-karta.poz h3{font-size:15.5px}
/* treść */
.hs-art{background:#fff;border:1px solid var(--hs-line);border-radius:20px;padding:32px;max-width:860px;margin:0 auto}.hs-art h1{font-size:34px;line-height:1.15;margin:8px 0 10px}.hs-art .meta{color:var(--hs-muted);font-size:14px;margin-bottom:18px}
.hs-art .wyr{border-radius:14px;overflow:hidden;margin-bottom:22px}.hs-art .wyr img{display:block;width:100%}.hs-tresc{font-size:17px;line-height:1.7}.hs-tresc img{border-radius:12px}.hs-tresc iframe{max-width:100%;border-radius:12px}
.hs-tresc .wp-block-embed__wrapper,.hs-film{position:relative;padding-top:56.25%;border-radius:14px;overflow:hidden;background:#000}.hs-tresc .wp-block-embed__wrapper iframe,.hs-film iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.hs-strona h1.tyt{font-size:32px;margin:0 0 6px}.hs-strona .pod{color:var(--hs-muted);margin-bottom:6px}
.hs-pag{display:flex;gap:8px;justify-content:center;margin-top:28px;flex-wrap:wrap}.hs-pag .page-numbers{padding:9px 14px;border-radius:10px;background:#fff;border:1px solid var(--hs-line);color:var(--hs-ink);font-weight:600}.hs-pag .current{background:var(--hs-ink);color:#fff;border-color:var(--hs-ink)}
/* strefa kibica */
.hs-kibic{background:linear-gradient(120deg,var(--hs-red),#7d0a1a);border-radius:20px;color:#fff;padding:30px;display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:20px;align-items:center}
.hs-kibic h2{margin:0 0 6px;font-size:26px}.hs-kibic p{margin:0;color:#ffd9de}.hs-kibic a{display:block;background:#fff;color:var(--hs-ink);border-radius:14px;padding:16px 18px;font-weight:800}.hs-kibic a small{display:block;font-weight:500;color:var(--hs-muted);margin-top:2px}.hs-kibic a:hover{transform:translateY(-2px)}
/* stopka */
.hs-stopka{background:var(--hs-ink);color:#a9b8c5;padding:36px 0 26px;font-size:14.5px}.hs-stopka .kol{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:26px}.hs-stopka h4{color:#fff;margin:0 0 10px;font-size:14px;text-transform:uppercase;letter-spacing:.08em}
.hs-stopka a{color:#d5dfe8;display:block;padding:3px 0}.hs-stopka a:hover{color:#fff}.hs-stopka ul{list-style:none;margin:0;padding:0}.hs-stopka .dol{border-top:1px solid rgba(255,255,255,.12);margin-top:26px;padding-top:16px;font-size:13px;display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap}
@media (max-width:1240px){.hs-burger{display:block}.hs-nav{display:none;position:absolute;top:100%;left:0;right:0;background:var(--hs-ink);padding:10px 16px 18px;max-height:calc(100vh - 68px);overflow:auto}.hs-nav.otw{display:block}
  .hs-nav>ul{flex-direction:column;gap:0}.hs-nav ul ul{position:static;opacity:1;visibility:visible;transform:none;background:rgba(255,255,255,.06);box-shadow:none;margin:2px 0 8px 12px;padding:4px}.hs-nav ul ul a{color:#dbe4ec}.hs-nav ul ul a:hover{background:rgba(255,255,255,.10);color:#fff}}
@media (max-width:860px){.hs-hero,.hs-2,.hs-3,.hs-kibic{grid-template-columns:1fr}.hs-hero .duzy{min-height:300px}.hs-hero .duzy h1{font-size:24px}.hs-stopka .kol{grid-template-columns:1fr 1fr}.hs-art{padding:20px;border-radius:16px}.hs-art h1{font-size:26px}.hs-h h2{font-size:20px}.hs-logo{font-size:16px}}