/* Spvgg Weil der Stadt – Startseite (Startbühne, Startbereich, Karten). Aus dem Baukasten übernommen, nur benötigte Regeln. Stand 14.10.2026 */
.bk { --navy: #14295c; --deep: #14295C; --royal: #3361AC; --sky: #429CBF; --ice: #EEF2F8; --line: #D9E1EE; --ink: #1D2A3A; --muted: #5B6B80; font-family: United, sans-serif; color: var(--ink); overflow-x: clip; }
.bk *, .bk ::before, .bk ::after { box-sizing: border-box; }
.bk :where(a) { color: inherit; text-decoration: none; }
.bk img { display: block; max-width: 100%; }
.bk-wrap { max-width: 1140px; margin: 0px auto; padding: 0px 20px; }
.bk-sec { padding: 72px 0px; }
.bk-sec.ice { background: var(--ice); }
.bk-h { font-size: 40px; line-height: 1; font-weight: 500; color: var(--navy); margin: 0px 0px 28px; letter-spacing: 0.2px; }
.bk-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; margin-bottom: 28px; }
.bk-head .bk-h { margin: 0px; }
.bk-btn { display: inline-flex; align-items: center; gap: 10px; background: rgb(255, 255, 255); color: var(--navy); font-size: 18px; padding: 14px 26px; clip-path: polygon(0px 0px, 100% 0px, calc(100% - 14px) 100%, 0px 100%); transition: background 0.2s, color 0.2s; }
.bk-btn:hover { background: var(--sky); color: rgb(255, 255, 255); }
.bk a:focus-visible, .bk button:focus-visible { outline: 3px solid var(--sky); outline-offset: 3px; }
.bk-chev { width: 16px; height: 16px; flex: 0 0 auto; }
.bk-meta { font-size: 13px; color: var(--muted); display: flex; gap: 10px; align-items: center; }
.bk-cat { background: var(--ice); color: var(--royal); padding: 3px 8px; font-size: 12px; }
.bk-hero { position: relative; color: rgb(255, 255, 255); background: var(--deep); overflow: hidden; }
.bk-hero img.bg { position: absolute; inset: 0px; width: 100%; height: 100%; object-fit: cover; }
.bk-hero h1, .bk-hero h2 { font-weight: 500; line-height: 0.95; margin: 0px; color: rgb(255, 255, 255); }
.bk-hero p { font-size: 19px; line-height: 1.45; margin: 18px 0px 28px; max-width: 30em; color: rgba(255, 255, 255, 0.92); }
.bk-pct { display: flex; align-items: center; gap: 14px; margin: 0px 0px 26px; font-size: 15px; }
.bk-pct .bar { flex: 0 0 220px; height: 8px; background: rgba(255, 255, 255, 0.25); }
.bk-pct .bar i { display: block; height: 100%; background: var(--sky); }
.bk-h1 { height: clamp(580px, 80vh, 780px); }
.bk-h1 .bk-slide .in { justify-content: flex-end; padding-bottom: 104px; }
.bk-slide { position: absolute; inset: 0px; opacity: 0; visibility: hidden; transition: opacity 0.8s, visibility 0.8s; }
.bk-slide.on { opacity: 1; visibility: visible; }
.bk-slide::after { content: ""; position: absolute; inset: 0px; background: linear-gradient(90deg, rgba(0, 24, 58, 0.88) 0%, rgba(0, 24, 58, 0.55) 45%, rgba(0, 24, 58, 0.05) 80%), linear-gradient(0deg, rgba(0, 24, 58, 0.6), transparent 40%); }
.bk-slide .in { position: relative; z-index: 2; height: 100%; display: flex; flex-direction: column; justify-content: center; max-width: 1140px; margin: 0px auto; padding: 0px 20px; }
.bk-slide h2 { font-size: clamp(46px, 7vw, 92px); max-width: 9.5em; }
.bk-dots { position: absolute; z-index: 3; left: 0px; right: 0px; bottom: 30px; max-width: 1140px; margin: 0px auto; padding: 0px 20px; display: flex; gap: 10px; align-items: center; }
.bk-dots button { width: 46px; height: 5px; border: 0px; padding: 0px; background: rgba(255, 255, 255, 0.35); cursor: pointer; }
.bk-dots button.on { background: rgb(255, 255, 255); }
.bk-arr { margin-left: auto; display: flex; gap: 8px; }
.bk-arr button { width: 44px; height: 44px; border: 2px solid rgba(255, 255, 255, 0.6); background: transparent; color: rgb(255, 255, 255); cursor: pointer; display: grid; place-items: center; }
.bk-arr button:hover { background: rgb(255, 255, 255); color: var(--navy); }
@keyframes bkfill { 
  100% { width: 100%; }
}
.bk-n1 { display: grid; grid-template-columns: 7fr 5fr; gap: 28px; }
.bk-n1 .nlead { position: relative; min-height: 460px; color: rgb(255, 255, 255); background: var(--navy); }
.bk-n1 .nlead img { position: absolute; inset: 0px; width: 100%; height: 100%; object-fit: cover; }
.bk-n1 .nlead::after { content: ""; position: absolute; inset: 0px; background: linear-gradient(0deg, rgba(0, 24, 58, 0.92) 0%, rgba(0, 24, 58, 0.2) 55%, transparent); }
.bk-n1 .nlead .t { position: absolute; z-index: 2; left: 30px; right: 30px; bottom: 28px; }
.bk-n1 .nlead h3 { color: rgb(255, 255, 255); font-size: clamp(26px, 3vw, 38px); line-height: 1.05; margin: 10px 0px 0px; font-weight: 500; }
.bk-n1 .nlead .bk-meta { color: rgba(255, 255, 255, 0.85); }
.bk-n1 .side { display: flex; flex-direction: column; gap: 0px; }
.bk-n1 .side a { display: grid; grid-template-columns: 130px 1fr; gap: 18px; padding: 16px 0px; border-bottom: 1px solid var(--line); align-items: center; }
.bk-n1 .side a:first-child { padding-top: 0px; }
.bk-n1 .side .ph { aspect-ratio: 4 / 3; overflow: hidden; background: var(--royal); }
.bk-n1 .side img { width: 100%; height: 100%; object-fit: cover; }
.bk-n1 .side h3 { font-size: 19px; line-height: 1.12; color: var(--navy); margin: 0px 0px 8px; font-weight: 500; }
.bk-n1 .side a:hover h3 { color: var(--royal); }
.bk-scroll { display: grid; grid-auto-flow: column; grid-auto-columns: calc(29.4118% - 19.4118px); gap: 22px; overflow-x: auto; scroll-snap-type: x mandatory; padding-bottom: 14px; scrollbar-width: thin; }
.bk-scroll > * { scroll-snap-align: start; }
.bk-sarr { display: flex; gap: 8px; }
.bk-sarr button { width: 42px; height: 42px; border: 2px solid var(--line); background: rgb(255, 255, 255); color: var(--navy); cursor: pointer; display: grid; place-items: center; }
.bk-sarr button:hover { border-color: var(--royal); color: var(--royal); }
.bk-tc { background: rgb(255, 255, 255); display: flex; flex-direction: column; min-height: 100%; }
.bk-tc .top { background: var(--royal); color: rgb(255, 255, 255); display: flex; align-items: baseline; gap: 8px; padding: 12px 16px; }
.bk-tc .top b { font-size: 34px; font-weight: 500; line-height: 1; }
.bk-tc .top span { font-size: 14px; }
.bk-tc .top em { margin-left: auto; font-style: normal; font-size: 13px; opacity: 0.85; }
.bk-tc .bd { padding: 14px 16px 18px; border-right-color: ; border-right-style: ; border-right-width: ; border-bottom-color: ; border-bottom-style: ; border-bottom-width: ; border-left-color: ; border-left-style: ; border-left-width: ; border-image-source: ; border-image-slice: ; border-image-width: ; border-image-outset: ; border-image-repeat: ; border-top: 0px; flex: 1 1 0%; }
.bk-tc h3 { font-size: 19px; line-height: 1.15; color: var(--navy); margin: 0px 0px 10px; font-weight: 500; }
.bk-tc .li { font-size: 14px; color: var(--muted); display: flex; gap: 6px; align-items: center; margin-top: 4px; }
.bk-tc .li svg { width: 14px; height: 14px; color: var(--royal); }
.bk-tc .bk-cat { display: inline-block; margin-top: 12px; }
.bk-t1 .bk-scroll { grid-auto-columns: calc(25% - 16.5px); }
.bk-ico { width: 30px; height: 30px; }
@media (max-width: 991px){
.bk-sec { padding: 56px 0px; }
.bk-h { font-size: 34px; }
.bk-n1 { grid-template-columns: 1fr; }
.bk-scroll { grid-auto-columns: calc(45.4545% - 10px); }
.bk-t1 .bk-scroll { grid-auto-columns: calc(38.4615% - 16.9231px); }
}
@media (max-width: 767px){
.bk-h { font-size: 30px; }
.bk-hero p { font-size: 17px; }
.bk-slide::after { background: linear-gradient(0deg, rgba(0, 24, 58, 0.94) 0%, rgba(0, 24, 58, 0.55) 55%, rgba(0, 24, 58, 0.15)); }
.bk-arr { display: none; }
.bk-pct .bar { flex-basis: 140px; }
.bk-n1 .nlead { min-height: 380px; }
.bk-n1 .side a { grid-template-columns: 104px 1fr; }
.bk-scroll, .bk-t1 .bk-scroll { grid-auto-columns: 82%; }
.bk-head { flex-wrap: wrap; }
}
@media (prefers-reduced-motion: reduce){
.bk * { transition: none !important; animation: auto ease 0s 1 normal none running none !important; }
}
.bk img[src*="1.Mannschaft_2024_25"] { transform: scale(1.3); transform-origin: 50% 0px; object-position: 50% 0px !important; }
@media (max-width: 767px){
.bk-h1 { height: clamp(500px, 78vh, 620px); }
.bk-h1 .bk-slide .in { padding-bottom: 72px; }
}
.bk img[src*="1.Mannschaft_2024_25"] { transform: scale(1.3); transform-origin: 50% 40%; object-position: 50% 40% !important; }
.bk-n2b, .bk-n4b { display: grid; grid-template-columns: repeat(3, 1fr); gap: 26px; }
.bk-oc { position: relative; display: block; background: rgb(255, 255, 255); box-shadow: rgba(20,41,92, 0.12) 0px 3px 16px; }
.bk-oc .ph { aspect-ratio: 4 / 5; overflow: hidden; background: var(--royal); }
.bk-oc .ph img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.5s; }
.bk-oc:hover .ph img { transform: scale(1.04); }
.bk-oc .tx { padding: 18px 20px 22px; }
.bk-oc h3 { font-size: 20px; line-height: 1.12; color: var(--navy); margin: 0px 0px 10px; font-weight: 500; }
.bk-oc .c { color: var(--royal); }
.bk-oc .corner { position: absolute; right: 0px; bottom: 0px; width: 0px; height: 0px; border-style: solid; border-width: 0px 0px 22px 22px; border-color: transparent transparent var(--line) transparent; }
.bk-oc:hover h3 { color: var(--royal); }
@media (max-width: 991px){
.bk-n2b, .bk-n4b, .bk-n7 { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 767px){
.bk-n2b, .bk-n4b, .bk-n7 { grid-template-columns: 1fr; }
}
.bk-cl { --k-navy: #14295c; --k-blue: #3361ab; --k-ink: #1d2a3a; --k-mut: #56637a; --k-soft: #eef2f8; --k-line: #d6deeb; }
.bk-kick { display: block; font-family: AdobeClean-Bold, Arial, sans-serif; font-size: 13px; letter-spacing: 1.6px; text-transform: uppercase; color: var(--k-blue); margin: 0px 0px 8px; }
.bk-cl p, .bk-cl .bk-meta, .bk-cl small, .bk-cl .s, .bk-cl .bk-empty { font-family: AdobeClean-Regular, Arial, sans-serif; }
.bk-cl .bk-h { font-size: 40px; color: var(--k-navy); text-transform: uppercase; letter-spacing: 0.5px; margin: 0px; }
.bk-cl .bk-head { align-items: flex-end; margin-bottom: 26px; }
.bk-cl.bk-sec, .bk-cl.bk-sec.ice { background: rgb(235, 235, 235); padding: 28px 0px; }
.bk-cl.bk-sec > .bk-wrap { background: rgb(255, 255, 255); padding: 48px 56px 52px; clip-path: polygon(0px 0px, 100% 0px, 100% calc(100% - 26px), calc(100% - 26px) 100%, 0px 100%); }
.bk-clmore { text-align: center; margin-top: 34px; }
.bk-clbtn { display: inline-flex; align-items: center; gap: 8px; border: 2px solid var(--k-navy); color: var(--k-navy); border-radius: 10px; padding: 13px 24px; font-size: 17px; text-transform: uppercase; letter-spacing: 0.5px; transition: transform 0.15s, background 0.15s, color 0.15s; }
.bk-clbtn:hover { transform: translateY(-2px); background: var(--k-navy); color: rgb(255, 255, 255); }
.bk-cl .bk-cat { background: var(--k-soft); color: var(--k-blue); border-radius: 6px; font-family: AdobeClean-Bold, Arial, sans-serif; font-size: 11px; letter-spacing: 0.8px; text-transform: uppercase; padding: 4px 8px; }
.bk-cl .bk-ni, .bk-cl .bk-oc, .bk-cl .bk-tc, .bk-cl .bk-n1 .nlead, .bk-cl .bk-n1 .side a, .bk-cl .bk-t3 .big, .bk-cl .bk-t3 .list a, .bk-cl .bk-t4 a, .bk-cl .bk-m1b .first, .bk-cl .bk-m1b .pair a, .bk-cl .bk-m1b .youth .yr, .bk-cl .bk-m2 a, .bk-cl .bk-d3 .kura, .bk-cl .bk-d3 .side a { border-radius: 14px; overflow: hidden; }
.bk-cl .bk-ni, .bk-cl .bk-oc, .bk-cl .bk-tc, .bk-cl .bk-n1 .side a, .bk-cl .bk-t3 .list a, .bk-cl .bk-t4 a, .bk-cl .bk-m1b .youth .yr, .bk-cl .bk-m2 a, .bk-cl .bk-d3 .side a { background: rgb(255, 255, 255); border: 1px solid var(--k-line); box-shadow: rgba(20, 41, 92, 0.08) 0px 10px 26px; }
.bk-cl .bk-n2 .bk-ni::after, .bk-cl .bk-oc .corner { display: none; }
.bk-cl .bk-ni h3, .bk-cl .bk-oc h3, .bk-cl .bk-tc h3, .bk-cl .bk-n1 .side h3, .bk-cl .bk-t3 .list h3, .bk-cl .bk-t4 h3, .bk-cl .bk-d3 .side h3 { color: var(--k-navy); text-transform: uppercase; letter-spacing: 0.3px; }
.bk-cl .bk-n1 .side a { padding: 12px; margin-bottom: 12px; border-bottom: 1px solid var(--k-line); }
.bk-cl .bk-n1 .side .ph { border-radius: 10px; }
.bk-cl .bk-n1 .nlead::after { background: linear-gradient(0deg, rgba(20, 41, 92, 0.92), rgba(20, 41, 92, 0.15) 60%); }
.bk-cl .bk-tc .top { background: var(--k-blue); }
.bk-cl .bk-tc .bd { border: 0px; }
@media (max-width: 991px){
.bk-cl.bk-sec > .bk-wrap { padding: 36px 28px 40px; }
}
@media (max-width: 767px){
.bk-cl.bk-sec { padding: 14px 0px; }
.bk-cl.bk-sec > .bk-wrap { padding: 28px 18px 32px; margin: 0px 10px; }
.bk-cl .bk-h { font-size: 30px; }
}
@media (max-width: 767px){
.bk-hero img[src*="1.Mannschaft_2024_25"] { transform: scale(1.35) !important; transform-origin: 50% 0px !important; object-position: 50% 0px !important; }
}
.bk-bg-w { background: rgb(255, 255, 255) !important; }
.bk-bg-i { background: rgb(238, 242, 248) !important; }
.bk-cl.bk-sec, .bk-cl.bk-sec.ice { padding: 72px 0px; }
.bk-cl.bk-sec > .bk-wrap { background: none; padding: 0px 20px; clip-path: none; margin: 0px auto; }
.bk-ma { display: grid; grid-template-columns: 1fr 1fr; gap: 28px; }
.bk-ma .c { display: flex; flex-direction: column; background: var(--navy); color: rgb(255, 255, 255); overflow: hidden; transition: transform 0.2s; }
.bk-ma .c:hover { transform: translateY(-4px); }
.bk-ma .ph { display: block; aspect-ratio: 16 / 9; overflow: hidden; background: var(--royal); }
.bk-ma .ph img { width: 100%; height: 100%; object-fit: cover; }
.bk-ma .tx { display: flex; flex-direction: column; gap: 8px; padding: 24px 26px 26px; flex: 1 1 0%; }
.bk-ma small { font-size: 14px; color: var(--sky); }
.bk-ma b { font-size: 40px; font-weight: 500; line-height: 1; }
.bk-ma .tags { display: flex; flex-wrap: wrap; gap: 8px; margin: 8px 0px 6px; }
.bk-ma .tags i { font-style: normal; font-size: 14px; padding: 6px 12px; background: rgba(255, 255, 255, 0.12); }
.bk-ma .go { margin-top: auto; display: inline-flex; align-items: center; gap: 6px; font-size: 17px; color: var(--sky); }
.bk-cl .bk-ma .c { background: rgb(255, 255, 255); color: var(--k-navy); border: 1px solid var(--k-line); border-radius: 16px; box-shadow: rgba(20, 41, 92, 0.08) 0px 10px 26px; }
.bk-cl .bk-ma small { font-family: AdobeClean-Bold, Arial, sans-serif; font-size: 13px; letter-spacing: 1.6px; text-transform: uppercase; color: var(--k-blue); }
.bk-cl .bk-ma b { text-transform: uppercase; color: var(--k-navy); }
.bk-cl .bk-ma .tags i { background: var(--k-soft); color: var(--k-navy); border-radius: 8px; font-family: AdobeClean-Regular, Arial, sans-serif; }
.bk-cl .bk-ma .go { align-self: flex-start; background: var(--k-blue); color: rgb(255, 255, 255); border-radius: 10px; padding: 12px 20px; font-size: 16px; text-transform: uppercase; letter-spacing: 0.5px; box-shadow: rgba(51, 97, 171, 0.3) 0px 8px 20px; }
.bk-cl .bk-ma .c:hover .go { background: var(--k-navy); }
.bk-ma .c img[src*="1.Mannschaft_2024_25"] { transform: scale(1.35) !important; transform-origin: 50% 0px !important; }
.bk-dn { background: var(--navy); color: rgb(255, 255, 255); padding: 76px 0px; }
.bk-dn .bk-kick { color: var(--sky); }
.bk-dn .bk-h { color: rgb(255, 255, 255); margin: 0px 0px 10px; }
.bk-dhead p { font-family: AdobeClean-Regular, Arial, sans-serif; font-size: 17px; opacity: 0.85; margin: 0px 0px 30px; max-width: 30em; }
.bk-dfan { display: flex; justify-content: center; padding: 10px 0px 20px; }
.bk-dfan a { width: 380px; background: rgb(255, 255, 255); color: var(--navy); border-radius: 16px; padding: 32px 30px 30px; display: flex; flex-direction: column; gap: 10px; box-shadow: rgba(0, 0, 0, 0.35) 0px 18px 40px; transition: transform 0.3s; }
.bk-dfan a:nth-child(1) { transform: rotate(-4deg) translate(14px, 10px); }
.bk-dfan a:nth-child(2) { transform: rotate(4deg) translate(-14px, 10px); }
.bk-dfan a:hover { transform: rotate(0deg) translateY(-8px); z-index: 2; }
.bk-dfan svg { width: 42px; height: 42px; color: var(--royal); }
.bk-dfan h3 { font-size: 28px; margin: 4px 0px 0px; color: var(--navy); font-weight: 500; text-transform: uppercase; }
.bk-dfan p { font-family: AdobeClean-Regular, Arial, sans-serif; font-size: 16px; color: rgb(86, 99, 122); margin: 0px 0px 12px; line-height: 1.45; }
.bk-dfan .bk-btn { align-self: flex-start; margin-top: auto; background: var(--royal); color: rgb(255, 255, 255); clip-path: none; border-radius: 10px; font-size: 16px; text-transform: uppercase; padding: 12px 20px; }
.bk-dfan a:hover .bk-btn { background: var(--navy); }
@media (max-width: 767px){
.bk-cl.bk-sec, .bk-cl.bk-sec.ice { padding: 52px 0px; }
.bk-cl.bk-sec > .bk-wrap { padding: 0px 20px; margin: 0px auto; }
.bk-ma { grid-template-columns: 1fr; gap: 18px; }
.bk-ma b { font-size: 32px; }
.bk-dn { padding: 56px 0px; }
.bk-dfan { flex-direction: column; align-items: center; gap: 16px; }
.bk-dfan a, .bk-dfan a:nth-child(1), .bk-dfan a:nth-child(2) { transform: none; width: 100%; }
}
.bk-rb .bk-btn { clip-path: none; border-radius: 10px; background: rgb(51, 97, 171); color: rgb(255, 255, 255); box-shadow: rgba(51, 97, 171, 0.3) 0px 8px 20px; text-transform: uppercase; letter-spacing: 0.5px; font-size: 17px; padding: 15px 26px; transition: transform 0.15s, background 0.15s; }
.bk-rb .bk-btn:hover { transform: translateY(-2px); background: rgb(20, 41, 92); color: rgb(255, 255, 255); }
.bk-cl .bk-ma.bk-ma-dk .c { background: rgb(20, 41, 92); color: rgb(255, 255, 255); border-color: rgb(20, 41, 92); box-shadow: rgba(20, 41, 92, 0.25) 0px 14px 34px; }
.bk-cl .bk-ma.bk-ma-dk small { color: rgb(159, 192, 234); }
.bk-cl .bk-ma.bk-ma-dk b { color: rgb(255, 255, 255); }
.bk-cl .bk-ma.bk-ma-dk .tags i { background: rgba(255, 255, 255, 0.12); color: rgb(255, 255, 255); }
.bk-cl .bk-ma.bk-ma-dk .go { background: rgb(255, 255, 255); color: rgb(20, 41, 92); box-shadow: rgba(0, 0, 0, 0.25) 0px 8px 20px; }
.bk-cl .bk-ma.bk-ma-dk .c:hover .go { background: rgb(238, 242, 248); color: rgb(20, 41, 92); }
.bk-dfan.sm a { width: 310px; padding: 24px 24px 22px; gap: 6px; }
.bk-dfan.sm svg { width: 32px; height: 32px; }
.bk-dfan.sm h3 { font-size: 22px; }
.bk-dfan.sm p { font-size: 15px; margin: 0px 0px 8px; }
.bk-dfan.sm .bk-btn { font-size: 14px; padding: 10px 16px; }
.bk-s9 { background: rgb(255, 255, 255); color: rgb(20, 41, 92); padding: 72px 0px; }
.bk-s9 .in { display: grid; grid-template-columns: 1.2fr 1fr; gap: 44px; align-items: center; }
.bk-s9 h2 { font-size: clamp(36px, 4vw, 54px); font-weight: 500; color: rgb(20, 41, 92); margin: 0px 0px 12px; line-height: 1; text-transform: uppercase; }
.bk-s9 p { font-family: AdobeClean-Regular, Arial, sans-serif; font-size: 17px; color: rgb(86, 99, 122); margin: 0px; max-width: 30em; }
.bk-s9 .b { display: flex; flex-direction: column; gap: 14px; }
.bk-s9 .b a { display: flex; align-items: center; gap: 14px; color: rgb(255, 255, 255); border-radius: 12px; padding: 18px 24px; font-size: 20px; box-shadow: rgba(20, 41, 92, 0.12) 0px 10px 26px; transition: transform 0.15s; }
.bk-s9 .b a:hover { transform: translateY(-2px); color: rgb(255, 255, 255); }
.bk-s9 .b svg { width: 28px; height: 28px; flex: 0 0 auto; }
.bk-s9 .b small { display: block; font-family: AdobeClean-Regular, Arial, sans-serif; font-size: 13px; opacity: 0.9; }
.bk-s9 .ig { background: linear-gradient(45deg, rgb(245, 133, 41), rgb(221, 42, 123) 55%, rgb(129, 52, 175)); }
.bk-s9 .fb { background: rgb(24, 119, 242); }
@media (max-width: 991px){
.bk-s9 .in { grid-template-columns: 1fr; gap: 26px; }
}
@media (max-width: 767px){
.bk-dfan.sm a { width: 100%; }
.bk-s9 { padding: 52px 0px; }
}
.bk .bk-kick { display: none !important; }
.bk-dn .bk-dhead { text-align: center; }
.bk-dn .bk-dhead p { margin-left: auto; margin-right: auto; }
.bk-s9 .b { width: 75%; justify-self: end; }
@media (max-width: 991px){
.bk-s9 .b { width: 100%; justify-self: stretch; }
}
.bk-n2b.n4 { grid-template-columns: repeat(4, 1fr); gap: 20px; }
.bk-n2b.n4 .bk-oc .tx { padding: 14px 16px 16px; }
.bk-n2b.n4 .bk-oc h3 { font-size: 17px; margin: 0px 0px 8px; }
.bk-n2b.n4 .bk-meta { font-size: 13px; }
.bk-dfan.fl a { padding: 20px 24px; gap: 8px; }
.bk-dfan.fl .hd { display: flex; align-items: center; gap: 12px; }
.bk-dfan.fl .hd svg { width: 30px; height: 30px; flex: 0 0 auto; }
.bk-dfan.fl h3 { margin: 0px; font-size: 22px; }
.bk-dfan.fl p { margin: 0px 0px 6px; }
.bk-s9 .b { width: auto; justify-self: end; }
.bk-s9 .b a { width: 340px; max-width: 100%; }
@media (max-width: 991px){
.bk-n2b.n4 { grid-template-columns: 1fr 1fr; }
.bk-s9 .b { justify-self: start; }
}
@media (max-width: 767px){
.bk-n2b.n4 { gap: 14px; }
.bk-n2b.n4 .bk-oc h3 { font-size: 15px; }
.bk-dfan.fl a, .bk-dfan.f3 a:nth-child(3) { transform: none; width: 100%; }
}
.bk-s9.ice { background: rgb(238, 242, 248); }
@media (max-width: 991px){
.bk-s9 .b { justify-self: center; }
}
.bk-s9.ice .in { grid-template-columns: 1fr; justify-items: center; text-align: center; gap: 30px; }
.bk-s9.ice h2 { font-size: 40px; line-height: 40px; letter-spacing: 0.2px; margin: 0px 0px 10px; }
.bk-s9.ice p { margin: 0px auto; }
.bk-s9.ice .b { flex-flow: wrap; justify-content: center; justify-self: center; width: auto; }
@media (max-width: 767px){
.bk-s9.ice h2 { font-size: 30px; line-height: 32px; }
.bk-s9.ice .b { flex-direction: column; align-items: center; width: 100%; }
}
.bk-s9.ice .b a { text-align: left; }