#featured .cards{ display: grid; grid-template-columns: minmax(0, 1fr); gap: 36px; margin: 0 0 56px; padding: 0; list-style: none; }
#featured .card{ display: block; text-decoration: none; }
#featured .card-media{ position: relative; display: block; overflow: hidden; aspect-ratio: 297 / 156; background: var(--soft); }
#featured .card-media img{ position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .3s; }
#featured .card:hover .card-media img{ transform: scale(1.03); }
#featured .card-icon-wrap{ position: absolute; inset: 0 0 40% 0; display: flex; align-items: center; justify-content: center; }
#featured .card-icon{ display: block; height: 62%; width: auto; aspect-ratio: 1; transition: transform .2s; }
#featured .card:hover .card-icon{ transform: scale(1.05); }
#featured .card-fill{ position: absolute; inset: 0; background: linear-gradient(160deg, #3a3a3a, #1c1c1c); }
#featured .card-media::after{ content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 62%; background: linear-gradient(to top, rgba(0, 0, 0, 0.62), rgba(0, 0, 0, 0)); pointer-events: none; }
#featured .card-title{ position: absolute; left: 14px; right: 14px; bottom: 10px; z-index: 1; color: #fff; font-size: 20px; font-weight: 700; line-height: 1.15; text-shadow: var(--on-photo-shadow); }
#featured .card-text{ display: block; margin-top: 10px; font-size: 12px; font-weight: 400; line-height: 1.45; color: var(--ink); }
#featured .card-meta{ display: block; margin-top: 6px; font-size: 13px; line-height: 1.3; color: var(--muted); }
#featured .card:hover .card-text{ text-decoration: underline; text-underline-offset: 3px; }
@media (min-width: 600px){#featured .cards{ grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 44px 24px; }
#featured .card-title{ left: 16px; right: 16px; bottom: 12px; font-size: 24px; }
#featured .card-meta{ font-size: 14px; }}
#featured .card-media .card-meta{ position: absolute; top: 10px; right: 10px; z-index: 1; margin: 0; padding: 3px 9px; border-radius: 999px; background: rgba(0, 0, 0, 0.55); color: #fff; font-size: 12.5px; font-weight: 400; line-height: 1.35; }
@media (min-width: 600px){#featured .card-media .card-meta{ top: 12px; right: 12px; font-size: 13px; }}
#featured .card-title{ display: flex; align-items: center; gap: 10px; }
#featured .card-badge{ flex: none; width: 34px; height: 34px; border-radius: 50%; box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.85); }
#featured .card-name{ display: flex; flex-direction: column; min-width: 0; }
#featured .card-type{ margin-top: 2px; font-size: 14px; font-weight: 400; line-height: 1.2; opacity: 0.88; }
@media (min-width: 600px){#featured .card-type{ font-size: 15px; }}
#featured .card-media.photo img{ transform: translateY(var(--py, 0px)) scale(1.1); transition: transform .3s; }
#featured .card:hover .card-media.photo img{ transform: translateY(var(--py, 0px)) scale(1.13); }
@media (prefers-reduced-motion: reduce){#featured .card-media.photo img{ transform: none; }}
/* generated by build_pages.cjs: the map fills the screen and stays in the background; the Featured strip sits at its
   foot by default, scrolls sideways only, hides while the side panel is open and comes back when it closes. The page itself
   does not scroll (his note, 2 Nov 2026: "the landing page should not be scrolable verticaly, only that strip should be
   scrolable horisontaly. Map stays as it is, in th background"). */
.featured{--ink:#1c1c1c;--muted:#6b6b6b;--line:#e6e6e6;--soft:#f5f5f3;position:fixed;left:0;right:0;bottom:var(--mini-footer-h);z-index:30;color:#1c1c1c;font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;background:rgba(252,252,250,.9);-webkit-backdrop-filter:blur(14px) saturate(1.2);backdrop-filter:blur(14px) saturate(1.2);border-top:1px solid rgba(0,0,0,.08);padding:12px 0 14px;transition:transform .35s cubic-bezier(.2,.7,.2,1),opacity .25s,visibility 0s}
body.panel-open .featured{transform:translateY(calc(100% + var(--mini-footer-h)));opacity:0;visibility:hidden;pointer-events:none;transition:transform .3s,opacity .2s,visibility 0s .3s}
.featured-inner{padding:0 24px}
.featured-head{display:flex;flex-wrap:wrap;align-items:center;gap:8px 18px;margin-bottom:10px}
.featured-head h2{margin:0;font:700 21px/26px "Helvetica Neue",Helvetica,Arial,sans-serif;letter-spacing:0}
.featured-chips{display:flex;gap:6px;flex-wrap:wrap}
.featured-chips button{display:inline-grid;place-items:center;font:500 13px/18px "Helvetica Neue",Helvetica,Arial,sans-serif;padding:5px 12px;min-height:32px;border:1px solid #d6d6d1;border-radius:99px;background:#fff;color:#1c1c1c;cursor:pointer}
.featured-chips button>span,.featured-chips button::after{grid-area:1/1}
.featured-chips button::after{content:attr(data-label);font-weight:700;visibility:hidden;height:0;overflow:hidden}
.featured-chips button[aria-selected=true]{background:#1c1c1c;color:#fff;border-color:#1c1c1c;font-weight:700}
#featured ul.featured-row.cards{display:flex;gap:12px;margin:0;padding:0 0 4px;list-style:none;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x proximity;scrollbar-width:thin}
#featured ul.featured-row.cards[hidden]{display:none}
#featured ul.featured-row.cards>li{flex:0 0 240px;min-width:0;scroll-snap-align:start}
#featured .card-text,#featured .card-meta{display:none}
#featured .card-media{aspect-ratio:16/9}
#featured .card-media::after{height:100%;background:linear-gradient(to top,rgba(0,0,0,.86) 0%,rgba(0,0,0,.62) 34%,rgba(0,0,0,.18) 66%,rgba(0,0,0,0) 100%)}
#featured .card-title{left:12px;right:12px;bottom:10px;font-size:19px;text-shadow:0 1px 2px rgba(0,0,0,.55)}
#featured .card-type{font-size:13.5px}
#featured .card-press{position:absolute;top:8px;left:8px;z-index:3;padding:3px 9px;border-radius:99px;background:#fff;color:#1c1c1c;font:600 11.5px/15px "Helvetica Neue",Helvetica,Arial,sans-serif;box-shadow:0 1px 3px rgba(0,0,0,.2)}
@media (max-width:700px){.featured{padding:8px 0 10px}.featured-inner{padding:0 12px}.featured-head{margin-bottom:8px}.featured-chips{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none}.featured-chips button{flex:none;font-size:12.5px;padding:4px 10px}.featured-head h2{display:none}#featured ul.featured-row.cards{gap:10px}#featured ul.featured-row.cards>li{flex:0 0 calc((100vw - 24px - 20px) / 2.35)}#featured .card-name{font-size:14px;line-height:17px}#featured .card-type{display:none}#featured .card-badge{width:24px;height:24px}}
@media (max-height:560px){.featured-head{display:none}#featured ul.featured-row.cards>li{flex-basis:180px}}
@media (min-width:1200px){#featured ul.featured-row.cards>li{flex-basis:288px}}
#featured::before{content:"";position:absolute;left:0;right:0;bottom:100%;height:32px;background:linear-gradient(to top,rgba(252,252,250,.9),rgba(252,252,250,0));pointer-events:none}
#featured .card-media{border-radius:12px}
@media (prefers-reduced-motion:reduce){.featured,body.panel-open .featured{transition:none}}

