:root{--km-bg:#fff;--km-ink:#000;--km-yellow:#fde047;--km-pink:#ff4d6d;--km-blue:#3b82f6;--km-green:#22c55e}
*{box-sizing:border-box;margin:0;padding:0}
body{font-family:"PingFang SC","Helvetica Neue",Arial,sans-serif;background:var(--km-bg);color:var(--km-ink);line-height:1.55}
a{color:inherit;text-decoration:none}
.km-shell{max-width:1340px;margin:0 auto;padding:0 22px}
.km-top{background:var(--km-yellow);border-bottom:4px solid #000;padding:16px 0;position:sticky;top:0;z-index:30}
.km-bar{display:flex;align-items:center;gap:18px;flex-wrap:wrap}
.km-logo{font-size:24px;font-weight:900;background:#000;color:var(--km-yellow);padding:6px 14px;letter-spacing:1px;border:3px solid #000;box-shadow:5px 5px 0 #ff4d6d}
.km-menu{display:flex;gap:8px;flex:1;flex-wrap:wrap}
.km-menu a{padding:8px 16px;font-size:14px;font-weight:800;background:#fff;border:3px solid #000;transition:.15s;text-transform:uppercase;letter-spacing:.5px}
.km-menu a:hover,.km-menu a.on{background:var(--km-pink);color:#fff;transform:translate(-2px,-2px);box-shadow:4px 4px 0 #000}
.km-hero{padding:50px 0 30px;border-bottom:4px solid #000}
.km-hero h1{font-size:64px;font-weight:900;line-height:.95;letter-spacing:-2px;text-transform:uppercase}
.km-hero h1 em{background:var(--km-pink);color:#fff;padding:0 12px;font-style:normal;display:inline-block}
.km-hero p{margin-top:20px;max-width:680px;font-size:16px;font-weight:600}
.km-st{margin:40px 0 18px;font-size:20px;font-weight:900;text-transform:uppercase;letter-spacing:1px;background:#000;color:var(--km-yellow);display:inline-block;padding:6px 18px;border:3px solid #000;box-shadow:6px 6px 0 var(--km-pink)}
.km-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:22px;padding-bottom:40px}
.km-card{background:#fff;border:4px solid #000;transition:.15s;display:flex;flex-direction:column;position:relative}
.km-card:nth-child(4n+1){box-shadow:8px 8px 0 var(--km-pink)}
.km-card:nth-child(4n+2){box-shadow:8px 8px 0 var(--km-blue)}
.km-card:nth-child(4n+3){box-shadow:8px 8px 0 var(--km-green)}
.km-card:nth-child(4n){box-shadow:8px 8px 0 var(--km-yellow)}
.km-card:hover{transform:translate(-3px,-3px)}
.km-card:hover:nth-child(4n+1){box-shadow:11px 11px 0 var(--km-pink)}
.km-card:hover:nth-child(4n+2){box-shadow:11px 11px 0 var(--km-blue)}
.km-card:hover:nth-child(4n+3){box-shadow:11px 11px 0 var(--km-green)}
.km-card:hover:nth-child(4n){box-shadow:11px 11px 0 var(--km-yellow)}
.km-pic{aspect-ratio:16/10;background:#000;overflow:hidden;border-bottom:4px solid #000;position:relative}
.km-pic img{width:100%;height:100%;object-fit:cover;display:block}
.km-tag{position:absolute;top:10px;left:10px;background:var(--km-yellow);border:3px solid #000;padding:2px 10px;font-size:12px;font-weight:900;text-transform:uppercase}
.km-bd{padding:14px;flex:1;display:flex;flex-direction:column;gap:10px}
.km-bd h3{font-size:16px;font-weight:900;line-height:1.3;text-transform:uppercase}
.km-mt{display:flex;justify-content:space-between;font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.5px;margin-top:auto}
.km-mt span:last-child{background:#000;color:#fde047;padding:2px 6px}
.km-foot{margin-top:50px;background:#000;color:var(--km-yellow);padding:36px 0;border-top:4px solid var(--km-pink)}
.km-foot a{color:var(--km-pink);font-weight:800}
.km-watch{display:grid;grid-template-columns:1fr 320px;gap:24px;padding:30px 0}
.km-screen{background:#000;border:4px solid #000;aspect-ratio:16/9;position:relative;overflow:hidden;box-shadow:10px 10px 0 var(--km-pink)}
.km-screen img{width:100%;height:100%;object-fit:cover;opacity:.85}
.km-screen .km-pl{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:64px;color:var(--km-yellow);text-shadow:4px 4px 0 #000}
.km-side{border:4px solid #000;padding:18px;background:var(--km-yellow);box-shadow:8px 8px 0 #000}
.km-side h4{font-weight:900;text-transform:uppercase;margin-bottom:14px;background:#000;color:var(--km-yellow);padding:4px 10px;display:inline-block}
.km-side ul{list-style:none}
.km-side li{padding:10px 0;border-bottom:2px solid #000;font-size:13px;font-weight:700}
@media(max-width:880px){.km-hero h1{font-size:38px}.km-watch{grid-template-columns:1fr}}