/* SpecHub Knowledge, stage 22 (1 Nov 2026): Case Studies grouped by DCP City type, the case study page, and the
   Technical Library (Brochures, Technical bulletins). Orange on white, square corners, no side stripes, no counts. */
.kn-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* the filter row: City type chips and a country select */
.kn-filter{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:14px 24px;margin:0 0 30px;padding-bottom:20px;border-bottom:1px solid #EDE6DD}
.kn-chips{display:flex;flex-wrap:wrap;gap:8px;flex:1 1 560px;min-width:0}
.kn-chips a{font-size:14px;font-weight:600;color:#211D22;border:1px solid #E4DDD3;background:#fff;padding:8px 13px;text-decoration:none;line-height:1.2}
.kn-chips a:hover{border-color:#211D22}
.kn-chips a.is-on{border-color:#F06C38;background:#FDF1EB}
.kn-chips a:focus-visible,.kn-ctry select:focus-visible,.kn-cs:focus-visible,.kn-used a:focus-visible,.kn-book a:focus-visible{outline:2px solid #F06C38;outline-offset:2px}
.kn-ctry{display:flex;align-items:center;gap:10px;font-size:14px;font-weight:600;color:#3A3537}
.kn-ctry select{min-height:40px;border:1px solid #E4DDD3;background:#fff;padding:0 34px 0 12px;font:inherit;font-weight:500;color:#211D22;border-radius:0;max-width:100%}

/* a City type group */
.kn-grp{margin:0 0 38px}
.kn-grp__h,.kn-strip__h{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:6px 18px;margin:0 0 14px}
.kn-grp__h h2,.kn-strip__h h2{font-size:24px;line-height:1.2;letter-spacing:-.01em;margin:0;color:#211D22}
.kn-grp__h .k-link,.kn-strip__h .k-link{font-size:14.5px}

/* case study cards */
.kn-grid--cs{grid-template-columns:repeat(auto-fill,minmax(280px,1fr))}
.kn-cs__pic{display:block;width:100%;aspect-ratio:16/10;object-fit:cover;background:#F5EFE8}
.kn-cs__pic--none{background:#F5EFE8}
.kn-cs b{font-size:18px;line-height:1.25}
.kn-cs__where{font-size:13.5px;font-weight:600;color:#6B6463}
.kn-cs .kn-item__p{font-size:14.5px}

/* DCP City: the strip under a project type */
.kn-strip{margin:34px 0 44px;padding-top:24px;border-top:1px solid #EDE6DD}

/* one case study: photo and story on the left, the project facts on the right (on a phone: photo, facts, story) */
.kn-case{grid-template-areas:"hero side" "body side";row-gap:0}
.kn-case>.kn-fig--hero{grid-area:hero}.kn-case>.kn-body{grid-area:body}.kn-case>.kn-side{grid-area:side;align-self:start}
.kn-case .kn-body h2{font-size:21px}
.kn-fig{margin:0 0 18px}
.kn-fig img{display:block;width:100%;height:auto;border:1px solid #E9E2D9}
.kn-fig figcaption{font-size:13.5px;line-height:1.45;color:#6B6463;margin-top:7px}
.kn-fig--hero{margin-bottom:24px}
.kn-fig--hero img{max-height:560px;object-fit:cover}
.kn-gal .kn-fig img{aspect-ratio:4/3;object-fit:cover}
.kn-steps{margin:0 0 16px;padding-left:22px}.kn-steps li{margin:0 0 7px;padding-left:4px}
.kn-used__h{font-size:13px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:#6B6463;margin:18px 0 8px!important}
.kn-used{list-style:none;padding:0!important;margin:0 0 10px!important;display:flex;flex-wrap:wrap;gap:8px}
.kn-used li{margin:0!important;font-size:14.5px;line-height:1.35;border:1px solid #E4DDD3;background:#fff;padding:6px 11px}
.kn-used a{color:#D9561F;font-weight:700;text-decoration:none}
.kn-used a:hover{text-decoration:underline}
.kn-used small{color:#6B6463;font-size:12.5px}
.kn-gal{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:16px}
.kn-side--case{position:sticky;top:90px;background:#fff;border-color:#E4DDD3}
.kn-side--case .kn-facts{grid-template-columns:minmax(96px,auto) 1fr;font-size:14px}
.kn-side--case .kn-facts dd{overflow-wrap:anywhere}
.kn-side__a{display:flex;flex-direction:column;align-items:stretch;gap:10px;border-top:1px solid #EDE6DD;padding-top:14px;margin-top:4px}
.kn-side__a .k-btn{justify-content:center;text-align:center}
.kn-side__a .k-link{font-size:14.5px}
.kn-side__n{font-size:13px;color:#6B6463;margin-top:-4px}
.kn-foot{display:flex;flex-wrap:wrap;gap:12px 28px}

/* the Technical Library */
.kn-shelf{margin:0 0 40px}
.kn-shelf__h{font-size:24px;line-height:1.2;letter-spacing:-.01em;margin:0 0 16px;padding-bottom:12px;border-bottom:1px solid #EDE6DD}
.kn-shelf__soon{font-size:15.5px;color:#3A3537;margin:0}
.kn-shelf__note{font-size:14px;color:#6B6463;margin:14px 0 0}
.kn-books{display:grid;grid-template-columns:repeat(auto-fill,minmax(330px,1fr));gap:16px}
.kn-book{display:flex;gap:18px;border:1px solid #E4DDD3;background:#fff;padding:16px;transition:border-color .15s,box-shadow .15s}
.kn-book:hover{border-color:#F06C38;box-shadow:0 10px 26px rgba(33,29,34,.08)}
.kn-book__pic{flex:none;width:118px;align-self:flex-start;display:block;background:#F5EFE8;border:1px solid #E9E2D9}
.kn-book__pic img{display:block;width:100%;height:auto}
.kn-book__b{display:flex;flex-direction:column;gap:6px;min-width:0}
.kn-book b{font-size:19px;line-height:1.25;color:#211D22}
.kn-book__m{font-size:13px;font-weight:600;color:#6B6463}
.kn-book__go{margin-top:auto;padding-top:6px;font-weight:700}

@media(max-width:1000px){.kn-case{grid-template-areas:"hero" "side" "body";row-gap:0}.kn-side--case{position:static;margin-bottom:22px}}
@media(max-width:640px){
  .kn-filter{flex-direction:column;align-items:stretch}
  .kn-chips{flex:none;flex-wrap:nowrap;overflow-x:auto;padding-bottom:6px;scrollbar-width:thin}
  .kn-chips a{white-space:nowrap}
  .kn-ctry{width:100%}.kn-ctry select{flex:1;min-width:0;width:100%}
  .kn-grp__h h2,.kn-strip__h h2,.kn-shelf__h{font-size:21px}
  .kn-books{grid-template-columns:1fr}
  .kn-book{padding:14px;gap:14px}.kn-book__pic{width:92px}
}