/* Hochglanz — Hotelregister (prefix hk-). Magazine register: numbered rows, contact sheet, refine drawer, article-style detail page.
   Built on the --hg-* tokens of style.css (espresso ground, champagne accent, Bebas Neue + Figtree). Mobile-first (min-width only). */

:root {
  --hk-star: #e3c98f;
  --hk-deep: #1c110b;
  --hk-lift: #3d2b1f;
}
.hk-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.hk-i { width: 18px; height: 18px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.hk-i--xl { width: 44px; height: 44px; stroke-width: 1.2; }
.hk-stars { color: var(--hk-star); letter-spacing: .08em; font-size: .95rem; white-space: nowrap; }
.hk-stars__half { opacity: .45; }
body.hk-lock { overflow: hidden; }
.hk-badge[hidden], .hk-link[hidden], .hk-more[hidden], .hk-empty[hidden], .hk-scrim[hidden] { display: none; }

.hk-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 44px; padding: 10px 18px; border: 1px solid var(--hg-line-strong); background: transparent; color: var(--hg-ink); font: 600 .78rem/1 var(--hg-font-body); text-transform: uppercase; letter-spacing: .1em; text-decoration: none; cursor: pointer; border-radius: var(--hg-radius); }
.hk-btn:hover { border-color: var(--hg-rose); color: var(--hg-rose); }
.hk-link { background: none; border: none; padding: 10px 0; min-height: 44px; color: var(--hg-rose); font: 600 .78rem/1 var(--hg-font-body); text-transform: uppercase; letter-spacing: .08em; text-decoration: underline; text-underline-offset: .25em; cursor: pointer; }
.hk-badge { display: inline-grid; place-items: center; min-width: 20px; height: 20px; padding: 0 5px; border-radius: 10px; background: var(--hg-rose); color: var(--hg-ivoire); font-size: .7rem; }

/* ---------- masthead ---------- */
.hk-masthead { padding: 34px 0 10px; }
.hk-masthead__row { display: flex; align-items: flex-end; justify-content: space-between; gap: 18px; border-bottom: 1px solid var(--hg-line-strong); padding-bottom: 14px; }
.hk-masthead h1 { font-size: clamp(2.6rem, 11vw, 6rem); margin: 0; line-height: .9; }
.hk-masthead__num { margin: 0; font: 400 clamp(3.4rem, 15vw, 8.5rem)/.8 var(--hg-font-display); color: transparent; -webkit-text-stroke: 1px var(--hg-rose); letter-spacing: .02em; }
.hk-masthead__lede { color: var(--hg-ink-soft); max-width: 64ch; margin: 16px 0 0; }

/* ---------- sticky bar: regions + tools ---------- */
.hk-bar { position: sticky; top: 61px; z-index: 30; background: rgba(43, 29, 22, .96); backdrop-filter: blur(6px); border-bottom: 1px solid var(--hg-line); margin-top: 22px; }
.hk-regions { display: flex; gap: 6px; overflow-x: auto; padding: 10px 0 4px; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
.hk-regions::-webkit-scrollbar { display: none; }
.hk-region { flex: none; min-height: 44px; padding: 8px 14px; background: none; border: none; border-bottom: 2px solid transparent; color: var(--hg-ink-soft); font: 600 .74rem/1 var(--hg-font-body); text-transform: uppercase; letter-spacing: .1em; cursor: pointer; white-space: nowrap; }
.hk-region small { opacity: .6; margin-left: 4px; }
.hk-region:hover { color: var(--hg-ink); }
.hk-region[aria-pressed="true"] { color: var(--hg-rose); border-bottom-color: var(--hg-rose); }
.hk-tools { display: flex; flex-wrap: wrap; gap: 8px; padding: 8px 0 12px; align-items: center; }
.hk-search { flex: 1 1 100%; display: flex; align-items: center; gap: 10px; border-bottom: 1.5px solid var(--hg-line-strong); color: var(--hg-ink-soft); }
.hk-search:focus-within { border-color: var(--hg-rose); color: var(--hg-rose); }
.hk-search input { flex: 1; min-width: 0; min-height: 44px; border: none; background: transparent; color: var(--hg-ink); font: 400 1rem var(--hg-font-body); outline: none; }
.hk-select, .hk-sort select { min-height: 44px; padding: 8px 12px; background: var(--hg-ivoire-alt); color: var(--hg-ink); border: 1px solid var(--hg-line-strong); border-radius: var(--hg-radius); font: 400 1rem var(--hg-font-body); max-width: 100%; }
.hk-sort { margin-left: auto; }
.hk-view { display: flex; }
.hk-view button { width: 44px; height: 44px; display: grid; place-items: center; background: transparent; border: 1px solid var(--hg-line-strong); color: var(--hg-ink-soft); cursor: pointer; }
.hk-view button + button { border-left: none; }
.hk-view button[aria-pressed="true"] { background: var(--hg-rose); color: var(--hg-ivoire); border-color: var(--hg-rose); }
@media (min-width: 900px) {
  .hk-bar { top: 69px; }
  .hk-tools { flex-wrap: nowrap; }
  .hk-search { flex: 1 1 auto; }
  .hk-sort { margin-left: 0; }
}

.hk-status { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 18px 0 6px; }
.hk-count { margin: 0; color: var(--hg-ink-soft); font-size: .86rem; text-transform: uppercase; letter-spacing: .08em; }
.hk-count strong { color: var(--hg-ink); font: 400 1.7rem/1 var(--hg-font-display); letter-spacing: .02em; margin-right: 4px; }

/* ---------- register rows ---------- */
.hk-list { counter-reset: hk; margin-top: 6px; }
.hk-item { counter-increment: hk; border-top: 1px solid var(--hg-line); }
.hk-item:last-child { border-bottom: 1px solid var(--hg-line); }
.hk-item__link { display: grid; gap: 14px; padding: 22px 0; color: inherit; text-decoration: none; grid-template-areas: "photo" "text"; }
.hk-item__no { display: none; }
.hk-item__text { grid-area: text; display: block; min-width: 0; }
.hk-item__photo { grid-area: photo; display: block; position: relative; overflow: hidden; aspect-ratio: 16 / 10; background: var(--hg-ivoire-alt); }
.hk-item__photo img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s ease, filter .3s ease; filter: saturate(.92); }
.hk-item__link:hover .hk-item__photo img { transform: scale(1.04); filter: saturate(1.05); }
.hk-nophoto { display: grid; place-items: center; width: 100%; height: 100%; color: var(--hg-line-strong); }
.hk-item__meta { display: block; font: 600 .7rem/1.3 var(--hg-font-body); text-transform: uppercase; letter-spacing: .14em; color: var(--hg-rose); margin-bottom: 6px; }
.hk-item__name { margin: 0 0 6px; font-size: clamp(1.7rem, 5vw, 2.5rem); line-height: 1; transition: color .2s ease; }
.hk-item__link:hover .hk-item__name { color: var(--hg-rose); }
.hk-item__sub { display: flex; flex-wrap: wrap; gap: 4px 12px; align-items: center; font-size: .82rem; color: var(--hg-ink-soft); margin-bottom: 8px; }
.hk-item__excerpt { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; color: var(--hg-ink-soft); font-size: .92rem; line-height: 1.6; }
.hk-item__icons { display: flex; gap: 12px; margin-top: 10px; color: var(--hg-rose-deep); }
@media (min-width: 760px) {
  .hk-item__link { grid-template-columns: 64px minmax(0, 1fr) minmax(220px, 300px); grid-template-areas: "no text photo"; gap: 26px; align-items: center; padding: 28px 0; }
  .hk-item__no { display: block; grid-area: no; align-self: start; font: 400 2.4rem/1 var(--hg-font-display); color: var(--hg-line-strong); letter-spacing: .02em; }
  .hk-item__no::before { content: counter(hk, decimal-leading-zero); }
  .hk-item__link:hover .hk-item__no { color: var(--hg-rose); }
  .hk-item__photo { aspect-ratio: 4 / 3; }
}

/* ---------- contact sheet ---------- */
.hk-list--sheet { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px 12px; border: none; }
.hk-list--sheet .hk-item { border: none; }
.hk-list--sheet .hk-item:last-child { border: none; }
.hk-list--sheet .hk-item__link { display: flex; flex-direction: column-reverse; gap: 10px; padding: 0; }
.hk-list--sheet .hk-item__no, .hk-list--sheet .hk-item__excerpt, .hk-list--sheet .hk-item__icons { display: none; }
.hk-list--sheet .hk-item__photo { aspect-ratio: 4 / 5; }
.hk-list--sheet .hk-item__name { font-size: 1.25rem; }
.hk-list--sheet .hk-item__meta { font-size: .62rem; letter-spacing: .1em; }
@media (min-width: 640px) { .hk-list--sheet { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 30px 18px; } }
@media (min-width: 1000px) { .hk-list--sheet { grid-template-columns: repeat(4, minmax(0, 1fr)); } }

.hk-empty { text-align: center; padding: 56px 0; }
.hk-empty h3 { font-size: 2rem; margin: 0 0 8px; }
.hk-empty p { color: var(--hg-ink-soft); margin: 0 0 18px; }
.hk-more { text-align: center; padding: 30px 0 8px; }
.hk-more p { margin: 0 0 12px; color: var(--hg-ink-soft); font-size: .84rem; }
.hk-note { color: var(--hg-ink-soft); font-size: .8rem; max-width: 80ch; padding: 18px 0 44px; margin: 0; }

/* ---------- refine drawer ---------- */
.hk-scrim { position: fixed; inset: 0; z-index: 60; background: rgba(10, 6, 3, .62); }
.hk-drawer { position: fixed; top: 0; right: 0; bottom: 0; z-index: 61; width: min(100%, 420px); display: flex; flex-direction: column; background: var(--hk-deep); border-left: 1px solid var(--hg-rose); transform: translateX(100%); visibility: hidden; transition: transform .3s ease, visibility 0s linear .3s; }
.hk-drawer[aria-hidden="false"] { transform: none; visibility: visible; transition: transform .3s ease; }
.hk-drawer__head { display: flex; align-items: center; justify-content: space-between; padding: 14px 20px; border-bottom: 1px solid var(--hg-line); }
.hk-drawer__head h2 { margin: 0; font-size: 1.8rem; }
.hk-x { width: 44px; height: 44px; display: grid; place-items: center; background: none; border: none; color: var(--hg-ink); cursor: pointer; }
.hk-drawer__body { flex: 1; overflow-y: auto; padding: 8px 20px 20px; }
.hk-fs { border: none; margin: 0; padding: 18px 0 6px; min-width: 0; }
.hk-fs legend, .hk-legend { display: block; padding: 0; margin-bottom: 10px; font: 600 .72rem/1 var(--hg-font-body); text-transform: uppercase; letter-spacing: .14em; color: var(--hg-rose); }
.hk-seg { display: grid; grid-template-columns: repeat(4, 1fr); }
.hk-seg button { min-height: 44px; background: transparent; border: 1px solid var(--hg-line-strong); color: var(--hg-ink-soft); font: 600 .78rem/1.1 var(--hg-font-body); cursor: pointer; }
.hk-seg button + button { border-left: none; }
.hk-seg small { opacity: .6; }
.hk-seg button[aria-pressed="true"] { background: var(--hg-rose); color: var(--hg-ivoire); border-color: var(--hg-rose); }
.hk-select { width: 100%; }
.hk-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.hk-chip { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 8px 14px; background: transparent; border: 1px solid var(--hg-line-strong); color: var(--hg-ink-soft); font: 500 .85rem/1 var(--hg-font-body); cursor: pointer; border-radius: 22px; }
.hk-chip[aria-pressed="true"] { background: var(--hg-rose); color: var(--hg-ivoire); border-color: var(--hg-rose); }
.hk-drawer__foot { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 20px; border-top: 1px solid var(--hg-line); }

/* ---------- Ortsregister ---------- */
.hk-ortsregister { background: var(--hg-ivoire-alt); padding: 56px 0 64px; }
.hk-ortsregister h2 { font-size: clamp(1.9rem, 5vw, 2.6rem); margin: 0 0 24px; }
.hk-orte { columns: 2; column-gap: 28px; }
.hk-orte__grp { break-inside: avoid; margin-bottom: 22px; }
.hk-orte__grp h3 { font-size: 2rem; color: var(--hg-rose); border-bottom: 1px solid var(--hg-line-strong); margin: 0 0 8px; padding-bottom: 4px; }
.hk-orte ul { list-style: none; margin: 0; padding: 0; }
.hk-orte li { display: flex; justify-content: space-between; gap: 8px; }
.hk-orte li a { display: block; padding: 8px 0; color: var(--hg-ink); text-decoration: none; min-height: 44px; }
.hk-orte li a:hover { color: var(--hg-rose); }
.hk-orte small { color: var(--hg-ink-soft); align-self: center; }
@media (min-width: 640px) { .hk-orte { columns: 3; } }
@media (min-width: 1000px) { .hk-orte { columns: 5; } }

/* ---------- detail: header + mosaic ---------- */
.hk-head { padding: 26px 0 30px; }
.hk-head__grid { display: grid; gap: 24px; }
.hk-head__kicker { margin: 0 0 8px; font: 600 .74rem/1.4 var(--hg-font-body); text-transform: uppercase; letter-spacing: .14em; color: var(--hg-rose); display: flex; flex-wrap: wrap; gap: 4px 8px; align-items: center; }
.hk-head h1 { font-size: clamp(2.5rem, 9vw, 5rem); margin: 0 0 14px; line-height: .92; overflow-wrap: anywhere; }
.hk-head__addr { display: flex; gap: 8px; align-items: flex-start; color: var(--hg-ink-soft); margin: 0 0 20px; }
.hk-head__addr .hk-i { margin-top: 3px; color: var(--hg-rose); }
.hk-head__cta { display: flex; flex-wrap: wrap; gap: 10px; }
.hk-mosaic { display: grid; gap: 6px; }
.hk-mosaic__cell { position: relative; display: block; padding: 0; border: none; background: var(--hg-ivoire-alt); overflow: hidden; cursor: zoom-in; min-height: 0; }
.hk-mosaic__cell img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .5s ease; }
.hk-mosaic__cell:hover img { transform: scale(1.03); }
.hk-mosaic__more { position: absolute; inset: 0; display: grid; place-items: center; background: rgba(28, 17, 11, .62); color: #fff; font: 400 1.5rem var(--hg-font-display); letter-spacing: .08em; text-transform: uppercase; }
.hk-mosaic--1 { grid-template-columns: 1fr; }
.hk-mosaic--1 .hk-mosaic__cell { aspect-ratio: 3 / 2; }
.hk-mosaic--2 { grid-template-columns: 1fr 1fr; }
.hk-mosaic--2 .hk-mosaic__cell { aspect-ratio: 1; }
.hk-mosaic--3, .hk-mosaic--5 { grid-template-columns: 1fr 1fr; }
.hk-mosaic--3 .hk-mosaic__cell, .hk-mosaic--5 .hk-mosaic__cell { aspect-ratio: 1; }
.hk-mosaic--3 .hk-mosaic__cell:first-child, .hk-mosaic--5 .hk-mosaic__cell:first-child { grid-column: 1 / -1; aspect-ratio: 3 / 2; }
.hk-nophoto--head { aspect-ratio: 3 / 2; background: var(--hg-ivoire-alt); }
@media (min-width: 960px) {
  .hk-head { padding: 34px 0 44px; }
  .hk-head__grid { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 44px; align-items: end; }
  .hk-mosaic--3 { grid-template-columns: 2fr 1fr; grid-template-rows: 1fr 1fr; aspect-ratio: 3 / 2; }
  .hk-mosaic--3 .hk-mosaic__cell, .hk-mosaic--3 .hk-mosaic__cell:first-child { aspect-ratio: auto; grid-column: auto; }
  .hk-mosaic--3 .hk-mosaic__cell:first-child { grid-row: 1 / 3; }
  .hk-mosaic--5 { grid-template-columns: 2fr 1fr 1fr; grid-template-rows: 1fr 1fr; aspect-ratio: 3 / 2; }
  .hk-mosaic--5 .hk-mosaic__cell, .hk-mosaic--5 .hk-mosaic__cell:first-child { aspect-ratio: auto; grid-column: auto; }
  .hk-mosaic--5 .hk-mosaic__cell:first-child { grid-row: 1 / 3; }
}

/* ---------- detail: body ---------- */
.hk-body { display: grid; gap: 28px; padding-bottom: 56px; }
.hk-card { background: var(--hg-ivoire-alt); border-top: 2px solid var(--hg-rose); padding: 22px 20px 24px; align-self: start; }
.hk-card h2 { font-size: 1.8rem; margin: 0 0 8px; }
.hk-card h3 { font-size: 1.3rem; margin: 22px 0 6px; padding-top: 16px; border-top: 1px solid var(--hg-line); }
.hk-spec { margin: 0; }
.hk-spec div { display: flex; justify-content: space-between; gap: 14px; padding: 8px 0; border-bottom: 1px dotted var(--hg-line-strong); font-size: .9rem; }
.hk-spec dt { color: var(--hg-ink-soft); }
.hk-spec dd { margin: 0; text-align: right; }
.hk-contact { list-style: none; margin: 0; padding: 0; }
.hk-contact li { display: flex; gap: 12px; padding: 8px 0; font-size: .92rem; overflow-wrap: anywhere; }
.hk-contact .hk-i { margin-top: 3px; color: var(--hg-rose); }
.hk-contact small { display: block; color: var(--hg-ink-soft); font-size: .68rem; text-transform: uppercase; letter-spacing: .1em; }
.hk-contact a { color: var(--hg-ink); }
.hk-card__note { color: var(--hg-ink-soft); font-size: .8rem; margin: 14px 0; }
.hk-card__maps { display: flex; flex-wrap: wrap; gap: 8px; }
.hk-article { min-width: 0; }
.hk-sec { padding: 6px 0 38px; }
.hk-sec h2 { font-size: clamp(1.9rem, 5vw, 2.6rem); margin: 0 0 18px; padding-bottom: 10px; border-bottom: 1px solid var(--hg-line-strong); }
.hk-prose p { margin: 0 0 16px; max-width: 70ch; }
.hk-dropcap::first-letter { float: left; font: 400 4.4rem/.8 var(--hg-font-display); color: var(--hg-rose); padding: 6px 12px 0 0; }
.hk-callout { border-left: 2px solid var(--hg-rose); background: var(--hg-ivoire-alt); padding: 12px 16px; margin: 0 0 14px; font-size: .9rem; }
.hk-amen { list-style: none; margin: 22px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.hk-amen li { display: inline-flex; align-items: center; gap: 8px; padding: 8px 14px; border: 1px solid var(--hg-line-strong); font-size: .82rem; color: var(--hg-ink-soft); border-radius: 22px; }
.hk-amen .hk-i { color: var(--hg-rose); }
.hk-fac { display: grid; gap: 26px; }
.hk-fac__grp h3 { display: flex; justify-content: space-between; align-items: baseline; font-size: 1.35rem; margin: 0 0 6px; color: var(--hg-rose); }
.hk-fac__grp h3 small { font: 600 .72rem var(--hg-font-body); color: var(--hg-ink-soft); }
.hk-fac ul { list-style: none; margin: 0; padding: 0; }
.hk-fac li { padding: 6px 0; border-bottom: 1px solid var(--hg-line); font-size: .9rem; }
.hk-fac details summary { cursor: pointer; padding: 10px 0; min-height: 44px; color: var(--hg-rose); font-size: .8rem; text-transform: uppercase; letter-spacing: .08em; }
@media (min-width: 700px) { .hk-fac { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 26px 40px; } }
.hk-rooms { list-style: none; margin: 0; padding: 0; }
.hk-rooms li { display: grid; grid-template-columns: 48px 1fr; gap: 12px; padding: 18px 0; border-bottom: 1px solid var(--hg-line); }
.hk-rooms__no { font: 400 2rem/1 var(--hg-font-display); color: var(--hg-rose); }
.hk-rooms h3 { font-size: 1.4rem; margin: 0 0 6px; }
.hk-rooms p { margin: 0; color: var(--hg-ink-soft); font-size: .92rem; }
.hk-h3 { font-size: 1.5rem; margin: 30px 0 8px; }
.hk-occ, .hk-dist { list-style: none; margin: 0; padding: 0; }
.hk-occ li, .hk-dist li { display: flex; align-items: baseline; gap: 8px; padding: 9px 0; font-size: .92rem; }
.hk-occ i, .hk-dist i { flex: 1; min-width: 12px; border-bottom: 1px dotted var(--hg-line-strong); transform: translateY(-3px); }
.hk-occ small { color: var(--hg-ink-soft); }
.hk-occ__n { text-align: right; }
.hk-dist b { font-weight: 600; color: var(--hg-rose); white-space: nowrap; }
.hk-where { display: flex; gap: 8px; align-items: flex-start; margin: 0 0 14px; color: var(--hg-ink-soft); }
.hk-where .hk-i { margin-top: 3px; color: var(--hg-rose); }
.hk-fine { color: var(--hg-ink-soft); font-size: .8rem; margin: 12px 0 0; }
.hk-label { margin: 18px 0 8px; font: 600 .72rem/1 var(--hg-font-body); text-transform: uppercase; letter-spacing: .14em; color: var(--hg-rose); }
.hk-tags { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px; }
.hk-tags li { padding: 5px 12px; border: 1px solid var(--hg-line-strong); font-size: .82rem; color: var(--hg-ink-soft); }
.hk-facts { margin: 0; }
.hk-facts div { display: flex; justify-content: space-between; gap: 14px; padding: 8px 0; border-bottom: 1px dotted var(--hg-line-strong); font-size: .9rem; }
.hk-facts dt { color: var(--hg-ink-soft); }
.hk-facts dd { margin: 0; text-align: right; }
@media (min-width: 960px) {
  .hk-body { grid-template-columns: minmax(0, 1fr) 340px; grid-template-areas: "article card"; gap: 56px; }
  .hk-article { grid-area: article; }
  .hk-card { grid-area: card; position: sticky; top: 92px; }
}

.hk-related { background: var(--hg-ivoire-alt); padding: 52px 0 60px; }
.hk-related h2 { font-size: clamp(1.9rem, 5vw, 2.6rem); margin: 0 0 22px; }

/* ---------- mobile dock ---------- */
.hk-dock { position: sticky; bottom: 0; z-index: 25; display: flex; gap: 8px; padding: 10px 16px; background: rgba(28, 17, 11, .96); border-top: 1px solid var(--hg-rose); }
.hk-dock .hg-btn { flex: 1; padding-inline: 12px; }
@media (min-width: 960px) { .hk-dock { display: none; } }

/* ---------- lightbox ---------- */
.hk-lb { position: fixed; inset: 0; z-index: 80; display: none; flex-direction: column; background: rgba(10, 6, 3, .96); }
.hk-lb[aria-hidden="false"] { display: flex; }
.hk-lb__top { display: flex; align-items: center; justify-content: space-between; padding: 6px 12px 6px 20px; color: var(--hg-ink-soft); font-size: .85rem; }
.hk-lb__top button { width: 44px; height: 44px; display: grid; place-items: center; background: none; border: none; color: #fff; cursor: pointer; }
.hk-lb__stage { flex: 1; min-height: 0; display: flex; align-items: center; justify-content: center; gap: 6px; padding: 0 6px; }
.hk-lb__stage img { max-width: 100%; max-height: 100%; min-width: 0; object-fit: contain; flex: 1 1 auto; }
.hk-lb__prev, .hk-lb__next { flex: none; width: 44px; height: 44px; display: grid; place-items: center; background: rgba(237, 230, 220, .1); border: none; color: #fff; cursor: pointer; border-radius: 50%; }
.hk-lb__prev .hk-i { transform: rotate(180deg); }
.hk-lb__cap { text-align: center; padding: 12px; color: var(--hg-ink-soft); font-size: .85rem; text-transform: uppercase; letter-spacing: .1em; }

/* ---------- home: featured strip + city pills ---------- */
.hk-feat { display: grid; gap: 14px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.hk-feat__item { display: flex; flex-direction: column; gap: 6px; color: inherit; text-decoration: none; }
.hk-feat__photo { display: block; overflow: hidden; aspect-ratio: 4 / 3; background: var(--hg-ivoire-alt); }
.hk-feat__photo img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease; }
.hk-feat__item:hover .hk-feat__photo img { transform: scale(1.04); }
.hk-feat__meta { font: 600 .68rem/1.3 var(--hg-font-body); text-transform: uppercase; letter-spacing: .12em; color: var(--hg-rose); }
.hk-feat__name { font: 400 1.35rem/1.05 var(--hg-font-display); text-transform: uppercase; letter-spacing: .02em; color: #fff; }
.hk-feat__item:first-child { grid-column: 1 / -1; }
.hk-feat__item:first-child .hk-feat__name { font-size: clamp(1.9rem, 6vw, 3rem); }
@media (min-width: 900px) {
  .hk-feat { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .hk-feat__item:first-child { grid-column: 1 / 3; grid-row: 1 / 3; }
  .hk-feat__item:first-child .hk-feat__photo { aspect-ratio: auto; flex: 1; min-height: 260px; }
}
.hk-pills { list-style: none; margin: 26px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.hk-pills a { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 8px 16px; border: 1px solid var(--hg-line-strong); color: var(--hg-ink); text-decoration: none; border-radius: 22px; font-size: .88rem; }
.hk-pills a:hover { border-color: var(--hg-rose); color: var(--hg-rose); }
.hk-pills small { color: var(--hg-ink-soft); }

.hk-near p { margin: 0 0 14px; }
.hk-map { position: relative; width: 100%; height: 380px; margin: 16px 0 10px; border: 1px solid var(--hg-line-strong); overflow: hidden; background: var(--hg-line); }
.hk-map iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
@media (min-width: 700px) { .hk-map { height: 460px; } }
