/* ═══════════════════════════════════════════════════════════════
GM STEDER — frontend (website)
Designsprog = Gourministeriets anmeldelses-tokens (gm-review.css v2),
selvstændigt namespacet .gmst så pluginet ikke afhænger af temaet.
Mobil-først. Ingen eksterne libs, ingen webfont-loads (arver EB Garamond
fra temaet med Georgia-fallback).
═══════════════════════════════════════════════════════════════ */
:root {
--gmst-green: #2C4A3A;
--gmst-green-light: #3A6350;
--gmst-gold: #B8883A;
--gmst-gold-light: #D4A64E;
--gmst-gold-pale: #F9F3E8;
--gmst-cream: #FAF8F3;
--gmst-dark: #1C1A16;
--gmst-text: #2E2C28;
--gmst-muted: #7A776E;
--gmst-light: #9E9B93;
--gmst-border: #E8E5DD;
--gmst-border-light: #F2F0EA;
--gmst-pros: #3A8A5C;
--gmst-cons: #C0584E;
--gmst-serif: 'EB Garamond', Georgia, serif;
--gmst-sans: 'DM Sans', -apple-system, BlinkMacSystemFont, sans-serif;
}
.gmst, .gmst *, .gmst *::before, .gmst *::after { box-sizing: border-box; }
.gmst { max-width: 1140px; margin: 0 auto; padding: 0 16px 48px; font-family: var(--gmst-sans); color: var(--gmst-text); line-height: 1.65; -webkit-font-smoothing: antialiased; }
.gmst a { color: var(--gmst-green); }
.gmst img { max-width: 100%; height: auto; }
.gmst h2 { font-family: var(--gmst-serif); font-size: 26px; font-weight: 500; color: var(--gmst-dark); margin: 40px 0 14px; line-height: 1.25; }
.gmst p { font-size: 17px; line-height: 1.75; margin: 0 0 18px; }
/* ── Hero ── */
.gmst-hero { position: relative; border-radius: 12px; overflow: hidden; margin: 12px 0 24px; aspect-ratio: 16/7; background: var(--gmst-green); }
.gmst-hero img { width: 100%; height: 100%; object-fit: cover; display: block; }
.gmst-hero-overlay { position: absolute; inset: 0; background: linear-gradient(0deg, rgba(28,26,22,.72) 0%, rgba(28,26,22,.15) 55%, transparent 100%); }
.gmst-hero-content { position: absolute; bottom: 0; left: 0; right: 0; padding: 32px 36px; color: #fff; }
.gmst-hero-cat { font-size: 12px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--gmst-gold-light); margin-bottom: 12px; display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.gmst-award { background: var(--gmst-gold); color: #fff; font-size: 11px; font-weight: 700; letter-spacing: .04em; padding: 3px 10px; border-radius: 999px; text-transform: none; }
.gmst-hero h1 { font-family: var(--gmst-serif); font-size: clamp(27px, 4vw, 46px); font-weight: 500; line-height: 1.15; color: #fff; margin: 0 0 14px; max-width: 720px; }
/* Manchet under rubrikken — "dommen i miniature". Uden den startede siden
koldt paa et afsnit, mens husets oevrige anmeldelser altid har en. */
.gmst-hero-lead {
font-family: var(--gmst-serif); font-size: clamp(16px, 1.6vw, 20px); line-height: 1.5;
color: rgba(255,255,255,.92); margin: 0 0 16px; max-width: 660px; font-weight: 400;
}
.gmst-hero-meta { display: flex; align-items: center; gap: 14px; font-size: 14px; color: rgba(255,255,255,.85); flex-wrap: wrap; }
.gmst-byline strong { color: #fff; font-weight: 600; }
.gmst-updated { color: var(--gmst-gold-light); font-weight: 600; }
/* ── Stjerner ──────────────────────────────────────────────────────────
To lag: tomme konturer nedenunder, fyldte ovenpå klippet i bredden.
Derfor kan 4,3 vises præcist — vi runder ikke brugerens tal væk. Begge
lag har samme markup, så de altid flugter pixel for pixel. */
.gmst-stars { position: relative; display: inline-block; line-height: 0; vertical-align: middle; color: var(--gmst-gold); font-size: 18px; }
.gmst-stars-bg, .gmst-stars-fg { display: flex; gap: 1px; }
.gmst-stars-bg { opacity: .34; }
.gmst-stars-fg { position: absolute; top: 0; left: 0; overflow: hidden; }
.gmst-stars svg { display: block; flex: 0 0 auto; }
.gmst-stars-bg svg path { fill: none; stroke: currentColor; }
.gmst-stars-fg svg path { fill: currentColor; stroke: currentColor; }
.gmst-stars--sm { font-size: 14px; }
.gmst-stars--lg { font-size: 26px; }
.gmst-stars-num { margin-left: 7px; font-weight: 700; font-family: var(--gmst-serif); vertical-align: middle; }
.gmst-badge { display: inline-flex; align-items: center; background: rgba(28, 26, 22, .72); color: #fff; padding: 5px 12px; border-radius: 8px; font-size: 15px; }
.gmst-badge .gmst-stars { color: var(--gmst-gold-light); font-size: 16px; }
.gmst-badge .gmst-stars-num { color: #fff; font-size: 15px; }
.gmst-price { font-size: 12px; font-weight: 700; }
.gmst-price span { margin-right: 3px; }
.gmst-price span:last-child { margin-right: 0; }
.gmst-price .on { color: inherit; }
.gmst-price .off { opacity: .3; }
/* ── Layout ── */
.gmst-grid { display: grid; grid-template-columns: 1fr; gap: 32px; align-items: start; }
@media (min-width: 961px) { .gmst-grid { grid-template-columns: 1fr 340px; gap: 48px; } }
/* ── Indhold ── */
.gmst-intro { background: var(--gmst-cream); border-left: 4px solid var(--gmst-gold); padding: 20px 24px; border-radius: 0 8px 8px 0; margin-bottom: 26px; }
.gmst-intro p { font-size: 16.5px; margin: 0; color: var(--gmst-dark); }
.gmst-intro p + p { margin-top: 10px; }
.gmst-dishes ul { list-style: none; padding: 0; margin: 0; }
.gmst-dishes li { padding: 10px 0 10px 26px; position: relative; border-bottom: 1px solid var(--gmst-border-light); font-size: 16px; }
.gmst-dishes li:last-child { border-bottom: none; }
.gmst-dishes li::before { content: ''; position: absolute; left: 4px; top: 19px; width: 7px; height: 7px; border-radius: 50%; background: var(--gmst-gold); }
/* ── Galleri: collage-teaser (ALDRIG en kilometerlang billedvæg) ── */
.gmst-gallery { margin: 30px 0; }
.gmst-gal-head { font-family: var(--gmst-serif); font-size: 19px; color: var(--gmst-dark); margin-bottom: 10px; display: flex; align-items: baseline; gap: 10px; }
.gmst-gal-head span { font-family: var(--gmst-sans); font-size: 12.5px; color: var(--gmst-muted); }
/* 0.32.1 — MOSAIK (Jes 13/09: «billederne skal være lavet som en mosaik, så de går til kant»).
Fliserne får deres mål fra gitteret, ALDRIG fra billedet: billedet ligger absolut og fylder hele
flisen (object-fit: cover). Før var højden på desktop styret af det store billedes egne mål, så de
små billeder (aspect-ratio 4/3) fik lyse bjælker over og under i for høje rækker.
0.32.2 — LUFT (Jes 13/09: «det skal bare se ordentlig ud, hvor den fletter billederne ind, så der er luft
omkring dem»): hvert billede er sin egen afrundede flise med 8 px (desktop 10 px) imellem — ikke én blok
med hårstreger på 4 px. Fliserne fylder stadig helt ud til kanten. */
.gmst-gal-grid { display: grid; gap: 8px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.gmst-gal-item { position: relative; overflow: hidden; padding: 0; border: 0; border-radius: 10px; background: var(--gmst-border-light); cursor: pointer; display: block; width: 100%; aspect-ratio: 4/3; }
.gmst-gal-item img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .35s ease; }
.gmst-gal-item:hover img { transform: scale(1.03); }
.gmst-gal-item:focus-visible { outline: 3px solid var(--gmst-gold); outline-offset: -3px; }
/* Mobil: 1 bred + 2 små side om side (resten bag +N på den tredje) */
.gmst-gal-grid .gmst-gal-item:nth-child(1) { grid-column: 1 / -1; aspect-ratio: 16/10; }
.gmst-gal-grid .gmst-gal-item:nth-child(n+4) { display: none; }
.gmst-gal-n1 .gmst-gal-item:nth-child(1) { aspect-ratio: 4/3; }
.gmst-gal-n2 .gmst-gal-item:nth-child(1) { grid-column: auto; aspect-ratio: 3/4; }
.gmst-gal-n2 .gmst-gal-item:nth-child(2) { aspect-ratio: 3/4; }
/* Desktop: gitteret har sit eget format; fliserne fylder deres felt. 5 = 1 stor + 2×2, 4 = 1 stor + 2 + 1 bred, 3 = 1 stor + 2 stablet. */
@media (min-width: 641px) {
.gmst-gal-grid { gap: 10px; grid-template-columns: 2fr 1fr 1fr; grid-template-rows: repeat(2, minmax(0, 1fr)); aspect-ratio: 16/9; }
.gmst-gal-grid .gmst-gal-item { aspect-ratio: auto; height: 100%; }
.gmst-gal-grid .gmst-gal-item:nth-child(1) { grid-column: 1; grid-row: 1 / 3; aspect-ratio: auto; }
.gmst-gal-grid .gmst-gal-item:nth-child(n+4) { display: block; }
.gmst-gal-n4 .gmst-gal-item:nth-child(4) { grid-column: 2 / 4; }
.gmst-gal-n3 { grid-template-columns: 2fr 1fr; }
.gmst-gal-n2 { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-rows: minmax(0, 1fr); }
.gmst-gal-n2 .gmst-gal-item:nth-child(1) { grid-row: 1; }
.gmst-gal-n1 { grid-template-columns: minmax(0, 1fr); grid-template-rows: minmax(0, 1fr); }
.gmst-gal-n1 .gmst-gal-item:nth-child(1) { grid-row: 1; }
}
.gmst-gal-more { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; background: rgba(28,26,22,.55); color: #fff; font-size: 22px; font-weight: 700; font-family: var(--gmst-serif); pointer-events: none; }
/* «+N» sidder på den sidste SYNLIGE flise: den tredje på mobil, den femte på desktop. */
.gmst-gal-more.gmst-gal-more-dsk { display: none; }
@media (min-width: 641px) { .gmst-gal-more.gmst-gal-more-dsk { display: flex; } .gmst-gal-more.gmst-gal-more-mob { display: none; } }
/* ── Lightbox: fuldskærms-swiper med scroll-snap ── */
.gmst-lb { position: fixed; inset: 0; z-index: 99999; background: #0F0E0C; display: flex; flex-direction: column; } /* 0.37.1 — tæt: siden skinnede igennem */
.gmst-lb[hidden] { display: none; }
.gmst-lb-track { flex: 1; display: flex; overflow-x: auto; overflow-y: hidden; scroll-snap-type: x mandatory; -webkit-overflow-scrolling: touch; scrollbar-width: none; }
.gmst-lb-track::-webkit-scrollbar { display: none; }
.gmst-lb-slide { flex: 0 0 100%; scroll-snap-align: center; scroll-snap-stop: always; display: flex; align-items: center; justify-content: center; padding: 52px 8px 24px; }
.gmst-lb-slide img { max-width: 100%; max-height: 100%; object-fit: contain; border-radius: 4px; }
.gmst-lb-close { position: absolute; top: 10px; right: 10px; z-index: 2; width: 44px; height: 44px; border: 0; border-radius: 50%; background: rgba(255,255,255,.12); color: #fff; font-size: 26px; line-height: 1; cursor: pointer; }
.gmst-lb-close:hover { background: rgba(255,255,255,.25); }
.gmst-lb-count { position: absolute; top: 22px; left: 0; right: 0; text-align: center; color: rgba(255,255,255,.75); font-size: 13px; letter-spacing: .06em; pointer-events: none; }
/* ── Ratings ── */
.gmst-ratings { background: var(--gmst-cream); border-radius: 10px; padding: 22px 24px; margin: 28px 0; }
.gmst-ratings h3 { font-family: var(--gmst-serif); font-size: 19px; font-weight: 500; color: var(--gmst-dark); margin: 0 0 16px; }
.gmst-rr { display: flex; align-items: center; gap: 12px; margin-bottom: 10px; }
.gmst-rr:last-child { margin-bottom: 0; }
.gmst-rl { font-size: 13px; color: var(--gmst-muted); width: 128px; flex-shrink: 0; }
.gmst-rb { flex: 1; display: flex; align-items: center; }
.gmst-rb .gmst-stars { font-size: 17px; }
.gmst-rs { font-size: 13px; font-weight: 600; color: var(--gmst-dark); width: 30px; text-align: right; }
.gmst-rr.total { border-top: 2px solid var(--gmst-border); padding-top: 13px; margin-top: 8px; }
.gmst-rr.total .gmst-rl { font-weight: 700; color: var(--gmst-dark); }
.gmst-rr.total .gmst-rb .gmst-stars { color: var(--gmst-green); font-size: 19px; }
.gmst-rr.total .gmst-rs { font-size: 16px; color: var(--gmst-green); }
/* ── Pros/cons ── */
.gmst-pc { display: grid; grid-template-columns: 1fr; gap: 14px; margin: 28px 0; font-size: 15px; }
@media (min-width: 641px) { .gmst-pc { grid-template-columns: 1fr 1fr; } }
.gmst-pc-col { background: var(--gmst-cream); border-radius: 10px; padding: 18px 20px; }
.gmst-pc-col.pros { border-top: 3px solid var(--gmst-pros); }
.gmst-pc-col.cons { border-top: 3px solid var(--gmst-cons); }
.gmst-pc-col h4 { font-family: var(--gmst-serif); font-size: 16px; font-weight: 600; margin: 0 0 10px; }
.gmst-pc-col.pros h4 { color: #2E7D32; }
.gmst-pc-col.cons h4 { color: #C62828; }
.gmst-pc-col ul { list-style: none; padding: 0; margin: 0; }
.gmst-pc-col li { padding: 4px 0 4px 18px; position: relative; }
.gmst-pc-col.pros li::before { content: '\2713'; position: absolute; left: 0; color: var(--gmst-pros); font-weight: 700; }
.gmst-pc-col.cons li::before { content: '\2013'; position: absolute; left: 2px; color: var(--gmst-cons); font-weight: 700; }
/* ── Tip + dom ── */
.gmst-tip { background: var(--gmst-gold-pale); border-left: 4px solid var(--gmst-gold); border-radius: 0 10px 10px 0; padding: 16px 20px; margin: 26px 0; }
.gmst-tip-label { display: block; font-size: 12.5px; font-weight: 700; color: var(--gmst-gold); margin-bottom: 4px; letter-spacing: .04em; text-transform: uppercase; }
.gmst-tip p { font-size: 15px; margin: 0; }
.gmst-verdict { border-top: 2px solid var(--gmst-border); margin-top: 34px; }
.gmst-pricenote { font-size: 14px; color: var(--gmst-muted); font-style: italic; }
/* ── Tidslinje-rail: hvert besøg er en fuld mini-anmeldelse på en lodret
guldlinje med dato-prik, score og udvikling (▲/▼). ── */
.gmst-rail { position: relative; }
.gmst-rail::before { content: ''; position: absolute; left: 7px; top: 14px; bottom: 14px; width: 2px; background: linear-gradient(180deg, var(--gmst-gold), var(--gmst-border)); }
.gmst-stop { position: relative; padding: 0 0 14px 34px; }
.gmst-stop + .gmst-stop { margin-top: 8px; }
.gmst-stop-head { display: flex; align-items: flex-start; gap: 14px; margin-bottom: 4px; }
.gmst-stop-dot { position: absolute; left: 0; top: 5px; width: 16px; height: 16px; border-radius: 50%; background: #fff; border: 3px solid var(--gmst-gold); box-shadow: 0 0 0 4px rgba(184,136,58,.12); }
.gmst-stop.is-current .gmst-stop-dot { background: var(--gmst-gold); }
.gmst-stop-meta { flex: 1; min-width: 0; }
.gmst-stop-date { display: flex; align-items: center; gap: 8px; font-size: 11.5px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--gmst-gold); }
.gmst-stop-date em { font-style: normal; background: var(--gmst-gold); color: #fff; border-radius: 999px; padding: 2px 10px; font-size: 10px; letter-spacing: .04em; }
.gmst-stop:not(.is-current) .gmst-stop-date { color: var(--gmst-muted); }
.gmst-stop:not(.is-current) .gmst-stop-date em { background: var(--gmst-border); color: var(--gmst-muted); }
.gmst-stop-title { font-family: var(--gmst-serif); font-size: 24px; font-weight: 600; color: var(--gmst-dark); margin: 4px 0 0; line-height: 1.25; }
.gmst-stop-score { font-family: var(--gmst-serif); font-size: 22px; font-weight: 700; color: var(--gmst-green); white-space: nowrap; display: inline-flex; align-items: baseline; gap: 4px; }
.gmst-stop-score em { font-style: normal; font-size: 13px; }
.gmst-stop-score em.up { color: var(--gmst-pros); }
.gmst-stop-score em.down { color: var(--gmst-cons); }
.gmst-stop-body h3 { font-family: var(--gmst-serif); font-size: 22px; font-weight: 500; color: var(--gmst-dark); margin: 30px 0 12px; line-height: 1.25; }
.gmst-stop:not(:last-child) .gmst-stop-body { border-bottom: 1px dashed var(--gmst-border); padding-bottom: 26px; }
.gmst-stop:not(.is-current) { opacity: .96; }
/* ── Tilknyttede steder (hotel ⇄ restaurant) ── */
.gmst-connected { margin-top: 44px; }
.gmst-conn-card { display: grid; grid-template-columns: 132px 1fr auto; gap: 16px; align-items: center; border: 1px solid var(--gmst-border); border-left: 4px solid var(--gmst-gold); border-radius: 0 14px 14px 0; background: linear-gradient(90deg, var(--gmst-gold-pale), #fff 55%); padding: 14px 18px 14px 14px; text-decoration: none; transition: transform .2s, box-shadow .2s; margin-bottom: 12px; }
.gmst-conn-card:hover { transform: translateY(-2px); box-shadow: 0 14px 30px -16px rgba(28,26,22,.35); }
.gmst-conn-img img { width: 132px; height: 96px; object-fit: cover; border-radius: 10px; display: block; }
.gmst-conn-txt { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.gmst-conn-meta { font-size: 10.5px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--gmst-gold); }
.gmst-conn-txt strong { font-family: var(--gmst-serif); font-size: 21px; font-weight: 600; color: var(--gmst-dark); }
.gmst-conn-line { font-size: 13.5px; color: var(--gmst-muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.gmst-conn-cta { font-size: 13px; font-weight: 700; color: var(--gmst-green); margin-top: 3px; }
.gmst-conn-score { display: inline-flex; align-items: center; color: var(--gmst-green); }
.gmst-conn-score .gmst-stars-num { font-size: 15px; color: var(--gmst-green); }
@media (max-width: 640px) {
.gmst-conn-card { grid-template-columns: 92px 1fr; }
.gmst-conn-img img { width: 92px; height: 80px; }
.gmst-conn-score { display: none; }
}
/* ── Kollapsede besøg (bruges i app/ældre visninger) ── */
.gmst-visit { border: 1px solid var(--gmst-border); border-radius: 12px; margin: 14px 0; background: #fff; overflow: hidden; }
.gmst-visit summary { display: flex; align-items: center; gap: 12px; padding: 15px 18px; cursor: pointer; list-style: none; flex-wrap: wrap; }
.gmst-visit summary::-webkit-details-marker { display: none; }
.gmst-visit summary::after { content: '+'; margin-left: auto; font-size: 20px; color: var(--gmst-gold); font-weight: 600; transition: transform .25s; }
.gmst-visit[open] summary::after { transform: rotate(45deg); }
.gmst-visit-date { font-size: 12px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--gmst-gold); white-space: nowrap; }
.gmst-visit-title { font-family: var(--gmst-serif); font-size: 17px; color: var(--gmst-dark); flex: 1 1 220px; }
.gmst-visit-score { font-size: 13px; font-weight: 700; color: var(--gmst-green); }
.gmst-visit-body { padding: 4px 18px 18px; border-top: 1px solid var(--gmst-border-light); }
.gmst-visit-body h2 { font-size: 21px; margin-top: 26px; }
/* ── FAQ ── */
.gmst-faq { border-top: 2px solid var(--gmst-border); margin-top: 40px; }
.gmst-faq-item { border-bottom: 1px solid var(--gmst-border-light); }
.gmst-faq-item summary { font-family: var(--gmst-serif); font-size: 17px; font-weight: 600; color: var(--gmst-dark); cursor: pointer; padding: 15px 30px 15px 0; list-style: none; position: relative; }
.gmst-faq-item summary::-webkit-details-marker { display: none; }
.gmst-faq-item summary::after { content: '+'; position: absolute; right: 4px; top: 50%; transform: translateY(-50%); color: var(--gmst-gold); font-size: 20px; transition: transform .25s; }
.gmst-faq-item[open] summary::after { transform: translateY(-50%) rotate(45deg); }
.gmst-faq-item p { font-size: 15px; color: var(--gmst-muted); padding-bottom: 16px; margin: 0; }
/* ── Faktaboks ── */
.gmst-sidebar { position: static; }
@media (min-width: 961px) { .gmst-sidebar { position: sticky; top: 60px; } }
.gmst-fb { background: #fff; border: 1px solid var(--gmst-border); border-radius: 12px; overflow: hidden; }
.gmst-fb-head { background: var(--gmst-green); padding: 18px 22px; color: #fff; }
.gmst-fb-name { font-family: var(--gmst-serif); font-size: 19px; font-weight: 500; margin-bottom: 8px; }
.gmst-fb-rating { display: flex; align-items: center; gap: 12px; }
.gmst-fb-rating .gmst-stars { color: var(--gmst-gold-light); }
.gmst-fb-label { font-size: 12.5px; color: rgba(255,255,255,.7); line-height: 1.35; }
.gmst-fb-label strong { display: block; color: #fff; font-size: 13.5px; }
.gmst-fr { display: flex; flex-direction: column; padding: 11px 22px; border-bottom: 1px solid var(--gmst-border-light); }
.gmst-fr:last-child { border-bottom: none; }
.gmst-fl { font-size: 10px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--gmst-muted); }
.gmst-fv { font-size: 14.5px; color: var(--gmst-dark); }
.gmst-map { height: 220px; background: var(--gmst-border-light); position: relative; border-top: 1px solid var(--gmst-border-light); z-index: 0; }
.gmst-map-hint { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; font-size: 12.5px; color: var(--gmst-muted); }
.gmst-pin { background: none; border: none; }
.gmst-pin-dot { display: block; width: 22px; height: 22px; border-radius: 50% 50% 50% 0; background: var(--gmst-gold); border: 3px solid #fff; transform: rotate(-45deg); box-shadow: 0 4px 10px rgba(28,26,22,.35); }
.gmst-map .leaflet-popup-content { font-family: var(--gmst-sans); font-size: 13px; }
.gmst-map .leaflet-popup-content a { color: var(--gmst-green); font-weight: 600; }
.gmst-fb-cta { padding: 16px 22px 20px; text-align: center; background: var(--gmst-gold-pale); }
.gmst-cta-btn { display: block; background: var(--gmst-green); color: #fff !important; font-size: 15px; font-weight: 600; padding: 13px 24px; border-radius: 8px; text-decoration: none; transition: background .2s; }
.gmst-cta-btn:hover { background: var(--gmst-green-light); }
.gmst-cta-note { display: block; font-size: 11px; color: var(--gmst-light); margin-top: 8px; }
/* ── Relaterede ── */
.gmst-related { margin-top: 52px; border-top: 2px solid var(--gmst-border); }
.gmst-rel-grid { display: grid; grid-template-columns: 1fr; gap: 16px; }
@media (min-width: 641px) { .gmst-rel-grid { grid-template-columns: repeat(3, 1fr); } }
.gmst-rel-card { display: block; border-radius: 12px; overflow: hidden; border: 1px solid var(--gmst-border); background: #fff; text-decoration: none; transition: transform .2s, box-shadow .2s; }
.gmst-rel-card:hover { transform: translateY(-2px); box-shadow: 0 12px 28px -14px rgba(28,26,22,.3); }
.gmst-rel-card img { width: 100%; aspect-ratio: 16/10; object-fit: cover; display: block; }
.gmst-rel-txt { padding: 13px 16px 15px; display: flex; flex-direction: column; gap: 3px; }
.gmst-rel-meta { font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--gmst-gold); }
.gmst-rel-txt strong { font-family: var(--gmst-serif); font-size: 17px; color: var(--gmst-dark); font-weight: 600; }
.gmst-rel-score { display: inline-flex; align-items: center; color: var(--gmst-green); }
.gmst-rel-score .gmst-stars-num { font-size: 12.5px; color: var(--gmst-green); }
/* ── Arkiv ── */
.gmst-arch-head { text-align: center; max-width: 640px; margin: 28px auto 26px; }
.gmst-arch-head h1 { font-family: var(--gmst-serif); font-size: clamp(28px, 4vw, 42px); font-weight: 500; color: var(--gmst-dark); margin: 0 0 10px; }
.gmst-arch-head p { color: var(--gmst-muted); font-size: 16px; }
.gmst-filter { display: flex; gap: 8px; justify-content: center; flex-wrap: wrap; margin-top: 18px; }
.gmst-filter a { padding: 8px 18px; border-radius: 999px; border: 1px solid var(--gmst-border); font-size: 13.5px; font-weight: 600; color: var(--gmst-text); text-decoration: none; background: #fff; }
.gmst-filter a.on, .gmst-filter a:hover { background: var(--gmst-green); border-color: var(--gmst-green); color: #fff; }
.gmst-arch-grid { display: grid; grid-template-columns: 1fr; gap: 20px; }
@media (min-width: 641px) { .gmst-arch-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 961px) { .gmst-arch-grid { grid-template-columns: repeat(3, 1fr); } }
.gmst-card { display: block; border-radius: 14px; overflow: hidden; border: 1px solid var(--gmst-border); background: #fff; text-decoration: none; transition: transform .2s, box-shadow .2s; }
.gmst-card:hover { transform: translateY(-3px); box-shadow: 0 16px 36px -18px rgba(28,26,22,.35); }
.gmst-card-img { position: relative; background: var(--gmst-border-light); aspect-ratio: 16/10; }
.gmst-card-img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.gmst-card-score { display: inline-flex; align-items: center; color: var(--gmst-gold); }
.gmst-card-score .gmst-stars-num { font-size: 13px; color: var(--gmst-green); }
.gmst-card-txt { padding: 15px 18px 17px; }
.gmst-card-meta { font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--gmst-gold); }
.gmst-card-txt h2 { font-family: var(--gmst-serif); font-size: 20px; font-weight: 600; color: var(--gmst-dark); margin: 4px 0 6px; line-height: 1.25; }
.gmst-card-sub { font-size: 13px; color: var(--gmst-muted); display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.gmst-pagination { margin-top: 32px; text-align: center; }
.gmst-empty { text-align: center; color: var(--gmst-muted); padding: 48px 0; }
/* ── Mobil-finish ── */
@media (max-width: 640px) {
.gmst-hero { aspect-ratio: 3/4; border-radius: 0; margin: 0 -16px 22px; }
.gmst-hero-content { padding: 22px 18px; }
.gmst h2 { font-size: 23px; }
.gmst-rl { width: 104px; }
}
/* Respektér reduceret bevægelse */
@media (prefers-reduced-motion: reduce) {
.gmst *, .gmst *::before, .gmst *::after { transition: none !important; animation: none !important; }
.gmst-lb-track { scroll-behavior: auto !important; }
}
/* Åbningstidernes alder — vises altid, så læseren kan vurdere friskheden. */
.gmst-hours-age { display: block; margin-top: 2px; font-size: 11.5px; opacity: .65; font-style: italic; }
/* Faktaboks uden nok indhold: ingen egen spalte. En 140 px boks ved siden af
5605 px broedtekst efterlod 97 % tom hoejrespalte. I stedet loeber artiklen
i fuld bredde, og de faa oplysninger staar som en rolig stribe under den. */
@media (min-width: 961px) {
.gmst-grid-solo { grid-template-columns: minmax(0, 1fr); }
.gmst-sidebar-inline { position: static; max-width: 100%; }
.gmst-sidebar-inline .gmst-fb { border-radius: 12px; }
.gmst-sidebar-inline .gmst-fb-body { display: flex; flex-wrap: wrap; gap: 4px 40px; }
.gmst-sidebar-inline .gmst-fr { flex: 0 1 auto; min-width: 200px; }
}
/* ═══════════════════════════════════════════════════════════════
V2 (05/09) — Jes: «en kombi af B og C, med et billede i toppen».
Billede øverst → titelblok → bedømmelseskort (søjler) → tidslinje →
praktisk-fliser + kort. Desktop: dom + praktisk klæbende til højre.
═══════════════════════════════════════════════════════════════ */
.gmst-v2 { padding-bottom: 24px; }
.gmst-kicker { display: block; font-size: 11px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--gmst-gold); }
.gmst-kicker.pros { color: var(--gmst-pros); }
.gmst-kicker.cons { color: var(--gmst-cons); }
.gmst-kicker.gold { color: var(--gmst-gold-light); }
/* 1. Billedet i toppen — rent foto, ingen tekst ovenpå */
.gmst-top { position: relative; margin: 12px 0 0; border-radius: 14px; overflow: hidden; background: var(--gmst-border-light); aspect-ratio: 16/10; }
.gmst-top img { width: 100%; height: 100%; object-fit: cover; display: block; }
.gmst-top-awards { position: absolute; left: 14px; bottom: 14px; display: flex; gap: 6px; flex-wrap: wrap; }
@media (min-width: 641px) { .gmst-top { aspect-ratio: 21/9; border-radius: 16px; margin-top: 20px; } }
/* 0.35 — filmen som top (Jes 22/09): liggende i fuld bredde; højkant centreret og højst 80 % af skærmhøjden. */
.gmst-top-video { margin: 12px 0 0; }
.gmst-top-video .gmst-videos { margin: 0; float: none; width: auto; max-width: none; }
.gmst-top-video--portrait .gmst-video { max-width: min(420px, calc(80vh * 9 / 16)); margin: 0 auto; }
@media (min-width: 641px) { .gmst-top-video { margin-top: 20px; } }
/* 2. Titelblok
0.32.1 — max-height: none. Child-temaet har `header { max-height: 420px }` for ALLE header-elementer
(foodica-child/style.css). På mobil er titelblokken ~600 px, så bedømmelseskortet lagde sig oven på
bylinen og chipsene (målt 13/09 på Strandgade 73: kasse 420, indhold 606). */
/* 0.32.3 — titelblokken er et gitter: teksten + bedømmelseskortet. Mobil: kortet under teksten (som før);
desktop: kortet til HØJRE for titlen i samme spalte som sidespalten under det (Jes 13/09: pladsen til
højre under billedet stod tom). */
.gmst-title { display: grid; grid-template-columns: minmax(0, 1fr); gap: 22px; padding: 22px 0 0; max-height: none; }
.gmst-title-txt { display: flex; flex-direction: column; gap: 10px; min-width: 0; }
.gmst-title h1 { font-family: var(--gmst-serif); font-size: clamp(30px, 5.6vw, 54px); font-weight: 500; line-height: 1.06; letter-spacing: -.012em; color: var(--gmst-dark); margin: 0; max-width: 20ch; text-wrap: balance; }
.gmst-lead { font-family: var(--gmst-serif); font-size: clamp(18px, 2vw, 22px); line-height: 1.45; color: var(--gmst-dark); margin: 4px 0 0; max-width: 62ch; }
.gmst-title-meta { display: flex; flex-direction: column; gap: 12px; margin-top: 4px; }
/* 0.32.5 — bylinen må aldrig klemmes af chipsene (Jes 13/09: «Dianna / Brinch» på to linjer med GOURMINISTERIET
langt til højre). Navn og «Gourministeriet» står nu under hinanden ved siden af portrættet, og blokken krymper ikke. */
.gmst-byline { display: inline-flex; align-items: center; gap: 10px; font-size: 13.5px; color: var(--gmst-muted); flex: none; }
.gmst-byline-txt { display: flex; flex-direction: column; gap: 2px; line-height: 1.2; white-space: nowrap; }
.gmst-byline-dot { width: 36px; height: 36px; border-radius: 50%; background: var(--gmst-green); flex: none; }
/* 0.32.3 — afsenderens profilbillede (Jes 13/09: «husk også hendes profilbillede»).
0.32.4 — 🪤 sitets WebP-plugin pakker ![]()
ind i og flytter klassen derover (målt live 13/09), så
det indre billede skal rammes med — ellers står portrættet firkantet. */
.gmst-byline-img, .gmst-byline-img img { width: 36px; height: 36px; border-radius: 50%; object-fit: cover; flex: none; display: block; overflow: hidden; background: var(--gmst-border-light); }
.gmst-byline strong { color: var(--gmst-text); font-weight: 600; }
.gmst-byline em { font-style: normal; font-size: 11px; letter-spacing: .1em; text-transform: uppercase; color: var(--gmst-light); }
.gmst-chips { display: flex; gap: 8px; flex-wrap: wrap; }
.gmst-chip { font-size: 12.5px; font-weight: 500; padding: 6px 11px; border-radius: 999px; background: var(--gmst-gold-pale); color: var(--gmst-muted); }
@media (min-width: 961px) {
.gmst-title-meta { flex-direction: row; align-items: center; justify-content: space-between; gap: 16px; }
.gmst-chips { justify-content: flex-end; }
.gmst-title { grid-template-columns: minmax(0, 1fr) 360px; column-gap: 56px; align-items: start; }
.gmst-title-solo { grid-template-columns: minmax(0, 1fr); }
}
/* 0.32.5 — mobil: alt under anmeldelsen (flere anbefalinger, kommentarer, Diannas panel) tegnes først når
man ruller derned, så telefonen ikke bruger kræfter på det ved indlæsning. Pladsen reserveres, så intet hopper. */
@media (max-width: 960px) {
.gmst-related, .gmst-comments, .gmst-review { content-visibility: auto; contain-intrinsic-size: auto 600px; }
}
/* Layout: én spalte på mobil; to på desktop (praktisk-spalten klæber til højre under bedømmelseskortet) */
.gmst-layout { display: grid; grid-template-columns: minmax(0, 1fr); gap: 28px; margin-top: 28px; align-items: start; }
.gmst-main { display: flex; flex-direction: column; gap: 28px; min-width: 0; }
@media (min-width: 961px) {
.gmst-layout { grid-template-columns: minmax(0, 1fr) 360px; gap: 56px; }
.gmst-layout-solo { grid-template-columns: minmax(0, 1fr); }
.gmst-main { display: contents; }
.gmst-content { grid-column: 1; grid-row: 1; }
/* Sidespalten deler række med indholdet, ellers har sticky intet at klæbe inden for. */
.gmst-side { grid-column: 2; grid-row: 1; align-self: start; position: sticky; top: 24px; display: flex; flex-direction: column; gap: 16px; }
}
/* 3. Bedømmelseskortet (B) */
.gmst-dom { background: #fff; border: 1px solid var(--gmst-border); border-radius: 14px; padding: 18px 18px 16px; display: flex; flex-direction: column; gap: 12px; box-shadow: 0 10px 30px rgba(44,74,58,.06); }
.gmst-dom-head { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; }
.gmst-dom-score { font-family: var(--gmst-serif); font-size: 34px; line-height: 1; font-weight: 500; color: var(--gmst-green); white-space: nowrap; }
.gmst-dom-score small { font-size: 14px; color: var(--gmst-light); font-family: var(--gmst-sans); }
.gmst-dom .gmst-stars--lg { font-size: 22px; }
/* 0.32.1 — ét fælles gitter for alle rækker: etiket-spalten er så bred som den længste etiket (højst 46 %),
og søjlerne starter stadig samme sted. Før var den låst til 96 px, så «Værdi for pengene» blev «Værdi for pen…». */
.gmst-bars { display: grid; grid-template-columns: fit-content(46%) minmax(0, 1fr) auto; align-items: center; column-gap: 10px; row-gap: 9px; margin-top: 2px; font-size: 13px; }
.gmst-bar-row { display: contents; }
.gmst-bar-lbl { color: var(--gmst-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.gmst-bar { height: 6px; border-radius: 999px; background: #EDE8DD; overflow: hidden; }
.gmst-bar span { display: block; height: 100%; border-radius: 999px; background: var(--gmst-gold); }
.gmst-bar-num { font-weight: 600; text-align: right; color: var(--gmst-dark); font-variant-numeric: tabular-nums; }
.gmst-dom-note { font-size: 12px; color: var(--gmst-light); }
/* Plus / Værd at vide — to spalter, ingen kort-i-kort */
.gmst-pm { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; font-size: 13.5px; line-height: 1.45; }
.gmst-pm-col { display: flex; flex-direction: column; gap: 4px; }
.gmst-pm-dom { border-top: 1px solid var(--gmst-border-light); padding-top: 12px; }
/* 4. Tidslinjen (C) — bygger på husets rail, med egen head-struktur */
.gmst-rail-kicker { margin-bottom: 14px; }
.gmst-v2 .gmst-rail::before { left: 6px; top: 8px; bottom: 8px; }
.gmst-v2 .gmst-rail-single::before { display: none; }
.gmst-v2 .gmst-rail-single .gmst-stop { padding-left: 0; }
.gmst-v2 .gmst-rail-single .gmst-stop-dot { display: none; }
.gmst-v2 .gmst-stop { padding: 0 0 22px 30px; }
.gmst-v2 .gmst-stop + .gmst-stop { margin-top: 10px; }
.gmst-v2 .gmst-stop-dot { top: 3px; width: 14px; height: 14px; }
.gmst-v2 .gmst-stop-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 6px; }
.gmst-v2 .gmst-stop-date { font-size: 13px; font-weight: 500; letter-spacing: 0; text-transform: none; color: var(--gmst-muted); }
.gmst-v2 .gmst-stop-date em { background: var(--gmst-gold); color: #fff; font-size: 10px; letter-spacing: .06em; text-transform: uppercase; }
.gmst-v2 .gmst-stop:not(.is-current) .gmst-stop-date em { background: var(--gmst-border); color: var(--gmst-muted); }
.gmst-v2 .gmst-stop-score { font-family: var(--gmst-sans); font-size: 12.5px; font-weight: 700; color: var(--gmst-muted); background: var(--gmst-border-light); border-radius: 999px; padding: 4px 10px; display: inline-flex; gap: 6px; align-items: baseline; }
.gmst-v2 .gmst-stop-score.is-current { background: var(--gmst-green); color: #fff; }
.gmst-v2 .gmst-stop-score em { font-size: 11px; font-weight: 700; }
.gmst-v2 .gmst-stop-score.is-current em.up { color: #BFE8C9; }
.gmst-v2 .gmst-stop-score.is-current em.down { color: #F6C2BB; }
.gmst-v2 .gmst-stop-title { font-size: clamp(22px, 2.4vw, 27px); font-weight: 500; margin: 2px 0 10px; line-height: 1.18; }
.gmst-v2 .gmst-stop-body h3 { font-family: var(--gmst-serif); font-size: clamp(21px, 2.2vw, 25px); font-weight: 500; color: var(--gmst-dark); margin: 26px 0 10px; line-height: 1.22; }
.gmst-v2 .gmst-stop-body p { font-size: 16.5px; line-height: 1.72; margin: 0 0 16px; }
.gmst-v2 .gmst-stop:not(:last-child) .gmst-stop-body { border-bottom: none; padding-bottom: 0; }
.gmst-v2 .gmst-stop:not(.is-current) { opacity: 1; }
.gmst-v2 .gmst-stop:not(.is-current) .gmst-stop-body p { color: var(--gmst-text); }
.gmst-intro2 { font-family: var(--gmst-serif); font-size: 18px; line-height: 1.5; color: var(--gmst-dark); margin: 0 0 14px; }
.gmst-intro2 p { font-family: inherit; font-size: inherit; line-height: inherit; margin: 0 0 10px; }
/* 0.32.2 — luft over og under galleriet, så det ikke klistrer til teksten. */
.gmst-v2 .gmst-gallery { margin: 22px 0 30px; }
/* «Det fik vi» — listen med retter (Pellegrino-mønstret) */
.gmst-menu { margin: 6px 0 18px; padding: 16px 18px; background: var(--gmst-gold-pale); border-radius: 12px; display: flex; flex-direction: column; gap: 10px; }
.gmst-menu ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.gmst-menu li { font-size: 15.5px; line-height: 1.45; }
.gmst-menu li strong { font-weight: 600; }
.gmst-menu li span { color: var(--gmst-muted); }
.gmst-menu-price { font-size: 13px; color: var(--gmst-muted); border-top: 1px solid var(--gmst-border); padding-top: 10px; }
/* Små fliser: ratings pr. ældre besøg + praktisk */
.gmst-tiles { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; margin: 4px 0 16px; }
.gmst-tile { display: flex; flex-direction: column; align-items: center; gap: 2px; padding: 9px 4px; background: #fff; border: 1px solid var(--gmst-border); border-radius: 8px; }
.gmst-tile-num { font-family: var(--gmst-serif); font-size: 18px; font-weight: 500; color: var(--gmst-green); }
.gmst-tile-lbl { font-size: 10px; letter-spacing: .06em; text-transform: uppercase; color: var(--gmst-light); text-align: center; }
@media (max-width: 480px) { .gmst-tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
/* Vores anbefaling — grønt kort */
.gmst-anbefaling { background: var(--gmst-green); color: var(--gmst-cream); border-radius: 14px; padding: 18px 20px; display: flex; flex-direction: column; gap: 6px; margin: 8px 0 0; }
.gmst-anbefaling-txt, .gmst-anbefaling-txt p { font-family: var(--gmst-serif); font-size: 19px; line-height: 1.42; color: var(--gmst-cream); margin: 0; }
.gmst-anbefaling-txt p + p { margin-top: 8px; }
.gmst-anbefaling-tip { font-size: 13px; color: var(--gmst-gold-light); margin-top: 4px; }
/* 5. Praktisk (B) */
.gmst-praktisk { display: flex; flex-direction: column; gap: 12px; }
.gmst-tiles-praktisk { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin: 0; }
.gmst-tile-txt { align-items: flex-start; gap: 4px; padding: 12px; }
.gmst-tile-txt .gmst-tile-lbl { text-align: left; }
.gmst-tiles-praktisk .gmst-tile-wide { grid-column: 1 / -1; }
.gmst-tile-val { font-size: 13.5px; line-height: 1.45; color: var(--gmst-dark); overflow-wrap: anywhere; }
/* Temaet gør ALLE links fede (`a { font-weight: bold }`) — i fliserne står adressen og kontakten som resten af teksten. */
.gmst-tile-val a { text-decoration: none; font-weight: inherit; }
/* 0.33.0 — lidt højere, så Apple-kortet har plads til stedet OG kvarteret; MapKit tegner selv i boksen. */
.gmst-v2 .gmst-map { border-radius: 12px; border: 1px solid var(--gmst-border); height: 200px; overflow: hidden; }
.gmst-side-cta { display: flex; gap: 8px; }
.gmst-btn { flex: 1; display: inline-flex; align-items: center; justify-content: center; height: 46px; border-radius: 10px; background: var(--gmst-green); color: #fff !important; font-size: 14px; font-weight: 600; text-decoration: none; transition: background .2s; }
.gmst-btn:hover { background: var(--gmst-green-light); }
.gmst-btn-ghost { background: #fff; border: 1px solid var(--gmst-border); color: var(--gmst-green) !important; }
.gmst-btn-ghost:hover { background: var(--gmst-gold-pale); }
.gmst-btn-icon { flex: 0 0 46px; }
@media (min-width: 961px) {
.gmst-praktisk { background: #fff; border: 1px solid var(--gmst-border); border-radius: 14px; padding: 18px; }
.gmst-tiles-praktisk { grid-template-columns: minmax(0, 1fr); gap: 0; }
.gmst-tiles-praktisk .gmst-tile { border: none; border-bottom: 1px solid var(--gmst-border-light); border-radius: 0; padding: 10px 0; }
.gmst-tiles-praktisk .gmst-tile:last-child { border-bottom: none; }
}
/* Tilknyttede steder — rolig række, ikke et kort-i-kort */
.gmst-v2 .gmst-connected { margin-top: 32px; display: flex; flex-direction: column; gap: 10px; }
.gmst-conn { display: grid; grid-template-columns: 72px 1fr auto; gap: 12px; align-items: center; padding: 10px; background: #fff; border: 1px solid var(--gmst-border); border-radius: 12px; text-decoration: none; }
.gmst-conn-img img { width: 72px; height: 72px; object-fit: cover; border-radius: 9px; display: block; }
.gmst-conn-txt { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.gmst-conn-txt strong { font-size: 15px; font-weight: 600; color: var(--gmst-dark); }
.gmst-conn-txt span { font-size: 13px; color: var(--gmst-muted); }
.gmst-conn-arrow { color: var(--gmst-green); font-size: 18px; padding-right: 6px; }
/* Klæbende bund-bar — kun mobil */
.gmst-stickybar { position: sticky; bottom: 0; z-index: 20; display: flex; gap: 8px; margin: 24px -16px 0; padding: 10px 16px calc(10px + env(safe-area-inset-bottom)); background: rgba(250,248,243,.94); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); border-top: 1px solid var(--gmst-border); }
@media (min-width: 961px) { .gmst-stickybar { display: none; } }
@media (max-width: 640px) {
.gmst-v2 .gmst-top { margin: 0 -16px; border-radius: 0; aspect-ratio: 4/3; }
.gmst-v2 h2 { font-size: 22px; }
}
/* Indhold fra de eksisterende anmeldelser (Jes 05/09: «brug indholdet fra de eksisterende») */
.gmst-menukort { margin-top: 36px; display: flex; flex-direction: column; gap: 12px; }
.gmst-v2 .gmst-menukort h2, .gmst-v2 .gmst-hoj h2 { margin: 0; font-size: clamp(23px, 2.4vw, 28px); }
.gmst-menukort-intro { margin: 0; font-size: 16px; line-height: 1.65; color: var(--gmst-text); }
.gmst-menukort-liste { list-style: none; margin: 4px 0 0; padding: 0; display: flex; flex-direction: column; }
.gmst-menukort-liste li { display: flex; justify-content: space-between; gap: 16px; align-items: baseline; padding: 9px 0; border-bottom: 1px solid var(--gmst-border-light); font-size: 15.5px; line-height: 1.45; }
.gmst-menukort-liste li:last-child { border-bottom: none; }
.gmst-mk-navn strong { font-weight: 600; }
.gmst-mk-navn span { color: var(--gmst-muted); }
.gmst-mk-pris { color: var(--gmst-muted); white-space: nowrap; font-variant-numeric: tabular-nums; }
.gmst-prisniveau { display: flex; flex-direction: column; gap: 3px; padding: 12px 14px; background: var(--gmst-gold-pale); border-radius: 10px; font-size: 15px; }
.gmst-menukort-kilde { font-size: 12px; color: var(--gmst-light); font-style: italic; }
.gmst-hoj { margin-top: 32px; display: flex; flex-direction: column; gap: 12px; }
.gmst-hoj dl { margin: 0; display: flex; flex-direction: column; }
.gmst-hoj dl div { display: grid; grid-template-columns: 150px 1fr; gap: 12px; padding: 10px 0; border-bottom: 1px solid var(--gmst-border-light); font-size: 15px; line-height: 1.5; }
.gmst-hoj dl div:last-child { border-bottom: none; }
.gmst-hoj dt { font-weight: 600; color: var(--gmst-dark); }
.gmst-hoj dd { margin: 0; color: var(--gmst-text); }
@media (max-width: 480px) { .gmst-hoj dl div { grid-template-columns: minmax(0, 1fr); gap: 2px; } }
/* Videoer (0.18) — egne klip fra Fotos + YouTube/Vimeo, 16:9. 0.39.0: stumt i løkke uden knapper (nederst) */
.gmst-videos { display: flex; flex-direction: column; gap: 14px; margin: 6px 0 20px; }
.gmst-video { margin: 0; display: flex; flex-direction: column; gap: 6px; }
.gmst-video video { width: 100%; max-height: 70vh; border-radius: 12px; background: #000; display: block; }
.gmst-video-embed { position: relative; aspect-ratio: 16/9; border-radius: 12px; overflow: hidden; background: #000; }
.gmst-video-embed iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.gmst-video figcaption { font-size: 12.5px; color: var(--gmst-light); }
/* 0.32 — BBVMS-afspilleren indsætter sit eget markup og har sit eget størrelsesforhold;
containeren må kun give den bredden og de runde hjørner. */
.gmst-video-bb { width: 100%; border-radius: 12px; overflow: hidden; background: #000; }
.gmst-video-bb > div, .gmst-video-bb iframe, .gmst-video-bb video { width: 100%; display: block; }
/* «Billeder fra besøget» — det samlede galleri til sidst */
.gmst-linse { margin-top: 48px; display: flex; flex-direction: column; gap: 10px; }
.gmst-v2 .gmst-linse .gmst-gallery { margin: 0; }
.gmst-v2 .gmst-linse h2 { margin: 0; font-size: clamp(23px, 2.4vw, 28px); }
.gmst-linse-intro { margin: 0 0 6px; font-size: 15.5px; line-height: 1.6; color: var(--gmst-muted); }
/* 0.21 — godkendelses-panelet (kun på token-siden) */
.gmst-review{margin:40px 0 24px;padding:0 var(--gmst-gutter,20px)}
.gmst-review-in{max-width:720px;margin:0 auto;background:#faf8f3;border:1px solid rgba(44,74,58,.15);border-radius:20px;padding:24px}
.gmst-review-eyebrow{font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:#6b7a70;margin:0 0 6px}
.gmst-review-note{border-left:3px solid #b8883a;padding:8px 12px;margin:0 0 12px;color:#1d2a22}
.gmst-review h2{margin:8px 0 6px;font-size:26px}
.gmst-review-help{margin:0 0 12px;color:#3f4d45}
.gmst-review textarea{width:100%;box-sizing:border-box;border:1px solid rgba(44,74,58,.25);border-radius:14px;padding:12px 14px;font:inherit;font-size:17px;line-height:1.5;background:#fff;color:#1d2a22;resize:vertical}
.gmst-review-row{display:flex;flex-wrap:wrap;gap:10px;margin:12px 0 6px}
.gmst-review-status{min-height:1.4em;color:#2c4a3a;font-weight:600;margin:6px 0 0}
.gmst-review-prev{margin-top:18px;padding-top:14px;border-top:1px solid rgba(44,74,58,.12);font-size:15px}
.gmst-review-prev p{margin:0 0 10px}
/* 0.27.0 — vejen til app-visningen af samme anmeldelse (Jes 09/09: begge visninger skal findes) */
.gmst-applink{margin:26px auto 8px;text-align:center;font-size:15px}
.gmst-applink a{color:#2c4a3a;text-decoration:none;border-bottom:1px solid rgba(44,74,58,.28);padding-bottom:2px}
.gmst-applink a:hover{border-bottom-color:#2c4a3a}
/* ═══ 0.28 — Ophold dag for dag (Jes 10/09) ═══
Dagene som nummereret rail INDE i besøget (en ægte sekvens — derfor tal), måltidskort
der linker til restaurantens egen anmeldelse (samme formsprog som «Spis på hotellet»-
kortet), og «Dagene»-indekset i sidespalten. Spejles i steder-pwa.js — ret begge. */
.gmst-stop-date em.gmst-stop-nights { background: var(--gmst-green); }
.gmst-stop:not(.is-current) .gmst-stop-date em.gmst-stop-nights { background: var(--gmst-border); color: var(--gmst-muted); }
/* 0.34 — tidsrummet («kl. 18.30–22.15»): stille chip med kant, ingen versaler — det er en oplysning, ikke en status. */
.gmst-stop-date em.gmst-stop-time, .gmst-v2 .gmst-stop-date em.gmst-stop-time, .gmst-stop:not(.is-current) .gmst-stop-date em.gmst-stop-time { background: transparent; color: var(--gmst-muted); border: 1px solid var(--gmst-border); text-transform: none; letter-spacing: 0; font-variant-numeric: tabular-nums; }
.gmst-days { margin: 6px 0 26px; }
.gmst-days-kicker { margin-bottom: 14px; }
.gmst-days-list { list-style: none; margin: 0; padding: 0 0 0 4px; position: relative; }
.gmst-days-list::before { content: ''; position: absolute; left: 21px; top: 30px; bottom: 30px; width: 2px; background: linear-gradient(180deg, var(--gmst-gold), var(--gmst-border)); }
.gmst-day { position: relative; padding: 0 0 30px 54px; margin: 0; }
.gmst-day:last-child { padding-bottom: 6px; }
.gmst-day-dot { position: absolute; left: 4px; top: 0; width: 36px; height: 36px; border-radius: 50%; background: #fff; border: 2px solid var(--gmst-gold); color: var(--gmst-gold); font-family: var(--gmst-serif); font-weight: 600; font-size: 18px; display: grid; place-items: center; box-shadow: 0 0 0 5px var(--gmst-cream); line-height: 1; }
.gmst-day:first-child .gmst-day-dot { background: var(--gmst-gold); color: #fff; }
.gmst-day-date { display: block; font-size: 11px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--gmst-gold); margin: 8px 0 4px; }
.gmst-stop-body .gmst-day-title { font-family: var(--gmst-serif); font-size: 24px; font-weight: 600; margin: 0 0 8px; line-height: 1.22; color: var(--gmst-dark); text-wrap: balance; }
.gmst-day-body p { font-size: 16px; line-height: 1.7; margin: 0 0 12px; }
.gmst-day .gmst-gallery { margin: 12px 0 18px; }
.gmst-meals { display: flex; flex-direction: column; gap: 10px; }
.gmst-meal { display: grid; grid-template-columns: 112px 1fr auto; gap: 16px; align-items: center; border: 1px solid var(--gmst-border); border-left: 4px solid var(--gmst-gold); border-radius: 0 14px 14px 0; background: linear-gradient(90deg, var(--gmst-gold-pale), #fff 55%); padding: 12px 16px 12px 12px; text-decoration: none; color: inherit; transition: transform .2s, box-shadow .2s; }
.gmst-meal-noimg { grid-template-columns: 1fr auto; }
a.gmst-meal:hover { transform: translateY(-2px); box-shadow: 0 14px 30px -16px rgba(28,26,22,.35); }
a.gmst-meal:focus-visible { outline: 3px solid var(--gmst-gold); outline-offset: 2px; }
.gmst-meal-img img { width: 112px; height: 84px; object-fit: cover; border-radius: 9px; display: block; }
.gmst-meal-txt { min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.gmst-meal-kicker { font-size: 10.5px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--gmst-gold); }
.gmst-meal-kicker span { color: var(--gmst-light); letter-spacing: .06em; }
.gmst-meal-txt strong { font-family: var(--gmst-serif); font-size: 21px; font-weight: 600; color: var(--gmst-dark); line-height: 1.15; display: flex; gap: 10px; align-items: baseline; flex-wrap: wrap; }
.gmst-meal-score .gmst-stars { font-size: 14px; }
.gmst-meal-score .gmst-stars-num { font-size: 15px; color: var(--gmst-green); }
.gmst-meal-sum { font-size: 13.5px; color: var(--gmst-muted); line-height: 1.45; quotes: '“' '”'; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.gmst-meal-cta { font-size: 13px; font-weight: 700; color: var(--gmst-green); white-space: nowrap; }
.gmst-meal-plain { border-left-color: var(--gmst-border); background: #fff; grid-template-columns: 1fr; }
.gmst-meal-plain .gmst-meal-kicker { color: var(--gmst-muted); }
.gmst-meal-plain .gmst-meal-sum { -webkit-line-clamp: 3; }
@media (max-width: 640px) {
.gmst-day { padding-left: 44px; }
.gmst-days-list::before { left: 17px; }
.gmst-day-dot { width: 28px; height: 28px; font-size: 15px; }
.gmst-stop-body .gmst-day-title { font-size: 21px; }
.gmst-meal { grid-template-columns: 72px 1fr; gap: 12px; padding: 10px 12px 10px 10px; }
.gmst-meal-noimg { grid-template-columns: 1fr; }
.gmst-meal-img img { width: 72px; height: 60px; }
.gmst-meal-cta { grid-column: 1 / -1; }
.gmst-meal-txt strong { font-size: 18px; }
}
/* «Dagene» — navigation, kun i den klæbende sidespalte på desktop (på mobil ligger asiden under alt indhold) */
.gmst-dagene { display: none; }
@media (min-width: 961px) {
.gmst-dagene { display: block; background: #fff; border: 1px solid var(--gmst-border); border-radius: 14px; padding: 16px; box-shadow: 0 10px 30px rgba(44,74,58,.06); }
.gmst-dagene-list { list-style: none; margin: 8px 0 0; padding: 0; }
.gmst-dagene-list li + li { border-top: 1px solid var(--gmst-border-light); }
.gmst-dagene-list a { display: grid; grid-template-columns: 26px 1fr auto; gap: 10px; align-items: center; padding: 9px 0; text-decoration: none; color: var(--gmst-text); font-size: 13px; }
.gmst-dagene-list a:hover span, .gmst-dagene-list a:focus-visible span { color: var(--gmst-green); }
.gmst-dagene-list b { font-family: var(--gmst-serif); color: var(--gmst-gold); font-size: 16px; }
.gmst-dagene-list span { color: var(--gmst-muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.gmst-dagene-list small { font-size: 10.5px; letter-spacing: .06em; text-transform: uppercase; color: var(--gmst-light); font-weight: 700; white-space: nowrap; }
.gmst-stay { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin-top: 12px; }
.gmst-stay div { background: var(--gmst-gold-pale); border-radius: 10px; padding: 10px 8px; text-align: center; }
.gmst-stay b { display: block; font-family: var(--gmst-serif); font-size: 22px; color: var(--gmst-green); line-height: 1; }
.gmst-stay span { font-size: 10px; letter-spacing: .06em; text-transform: uppercase; color: var(--gmst-muted); font-weight: 700; }
}
/* 0.30 — «Med på turen»: de anmeldelser der var en del af opholdet, samlet efter dagene. Samme kort-sprog
som måltidskortene, men bredere, så de kan skimmes. */
.gmst-tur { margin-top: 32px; display: flex; flex-direction: column; gap: 8px; }
.gmst-v2 .gmst-tur h2 { margin: 0; font-size: clamp(23px, 2.4vw, 28px); }
.gmst-tur-intro { margin: 0 0 8px; font-size: 15.5px; line-height: 1.6; color: var(--gmst-muted); }
.gmst-tur-liste { display: grid; gap: 10px; }
.gmst-tur-kort {
display: grid; grid-template-columns: 92px 1fr auto; align-items: center; gap: 14px;
padding: 10px; border: 1px solid var(--gmst-line); border-radius: 14px;
text-decoration: none; color: inherit; background: var(--gmst-card);
transition: border-color .15s ease, transform .15s ease;
}
.gmst-tur-kort:hover { border-color: var(--gmst-accent); transform: translateY(-1px); }
.gmst-tur-noimg { grid-template-columns: 1fr auto; }
.gmst-tur-img img { width: 92px; height: 92px; object-fit: cover; border-radius: 10px; display: block; }
.gmst-tur-txt { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.gmst-tur-kicker { font-size: 12px; letter-spacing: .04em; text-transform: uppercase; color: var(--gmst-muted); }
.gmst-tur-txt strong { font-size: 17px; line-height: 1.3; }
.gmst-tur-meta { font-size: 13.5px; color: var(--gmst-muted); }
.gmst-tur-sum { font-size: 14px; line-height: 1.5; color: var(--gmst-muted); quotes: none; }
.gmst-tur-sum::before, .gmst-tur-sum::after { content: none; }
.gmst-tur-cta { font-size: 13.5px; font-weight: 600; color: var(--gmst-accent); white-space: nowrap; }
@media (max-width: 640px) {
.gmst-tur-kort { grid-template-columns: 72px 1fr; }
.gmst-tur-noimg { grid-template-columns: 1fr; }
.gmst-tur-img img { width: 72px; height: 72px; }
.gmst-tur-cta { grid-column: 1 / -1; }
}
/* 0.31 — Filmene i toppen (Jes 13/09): liggende øverst i fuld bredde, højkant flyder til højre ved siden
af teksten. På mobil stables alt — en float på 375 px klemmer brødteksten ihjel. */
.gmst-videos-top { margin: 0 0 18px; }
.gmst-videos-side { float: right; width: min(42%, 260px); margin: 0 0 16px 20px; }
.gmst-video--portrait .gmst-video-embed { aspect-ratio: 9 / 16; }
.gmst-video--portrait video { max-height: none; aspect-ratio: 9 / 16; object-fit: cover; }
@media (max-width: 640px) {
.gmst-videos-side { float: none; width: 100%; margin: 0 0 16px; }
.gmst-video--portrait .gmst-video-embed,
.gmst-video--portrait video { aspect-ratio: 9 / 16; max-width: 320px; margin-inline: auto; }
}
/* 0.37 — flere film på højkant: vandret strimmel af ens kort (Jes 26/09). Én film flyder stadig til højre. */
.gmst-videos-strip { display: flex; flex-direction: row; gap: 12px; overflow-x: auto; scroll-snap-type: x mandatory; -webkit-overflow-scrolling: touch; padding: 0 0 6px; margin: 6px 0 20px; clear: both; scrollbar-width: thin; }
.gmst-videos-strip .gmst-video { flex: 0 0 auto; width: clamp(150px, 40vw, 250px); scroll-snap-align: start; }
.gmst-videos-strip .gmst-video--portrait .gmst-video-embed,
.gmst-videos-strip .gmst-video--portrait video { max-width: none; margin-inline: 0; }
/* Indlogget, men YouTube-id'et er ikke landet endnu: ingen BBVMS-reklamer — en rolig besked i stedet. */
.gmst-video-venter { display: flex; align-items: center; justify-content: center; padding: 18px; text-align: center; color: rgba(255,255,255,.8); font-size: 13px; line-height: 1.45; background: #1c1a16; }
/* ═══════════════════════════════════════════════════════════════
0.38.1 — SAMLINGEN «Rejser & anmeldelser» på /anmeldelser/ (Jes 27/09).
Samme udtryk som oplægget (canvas Gw2Zh2ypqC33m4kmDevsrZ): serif-overskrifter, guld-kicker, fotos med
mørk karakter-badge, destinationsfliser og kort.
🪤 0.38.2 (målt 27/09): sitets mu-plugin (sumedha) tvinger Merriweather !important på h1–h6/p/a/div, og
EB Garamond er slet ikke indlæst på websitet → samlingen bruger sitets serif, Merriweather, overalt.
═══════════════════════════════════════════════════════════════ */
.gmst-hub { --gmst-hub-serif: Merriweather, Georgia, serif; }
.gmst-hub { max-width: 1240px; padding-top: 8px; }
.gmst-hub [hidden] { display: none !important; }
.gmst-hub button { font-family: inherit; }
.gmst-hub-kick, .gmst-hub-meta { font-size: 11px; font-weight: 700; letter-spacing: .09em; text-transform: uppercase; color: #8F6A24; }
.gmst-hub-hero { display: grid; grid-template-columns: 1fr; gap: 22px; align-items: center; padding: 18px 0 26px; }
@media (min-width: 900px) { .gmst-hub-hero { grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr); gap: 56px; padding: 36px 0 34px; } }
.gmst-hub-hero h1 { font-family: var(--gmst-hub-serif); font-weight: 700; font-size: clamp(34px, 4.6vw, 54px); line-height: 1.08; letter-spacing: -.01em; color: var(--gmst-dark); margin: 10px 0 14px; }
.gmst-hub-hero p { font-size: 17px; line-height: 1.6; color: #5E5A51; margin: 0; max-width: 540px; }
.gmst-hub-stats { display: flex; flex-wrap: wrap; gap: 28px; margin-top: 22px; }
.gmst-hub-stats div { display: flex; flex-direction: column; }
.gmst-hub-stats strong { font-family: var(--gmst-hub-serif); font-weight: 700; font-size: 32px; line-height: 1; color: var(--gmst-green); }
.gmst-hub-stats span { font-size: 13px; color: var(--gmst-muted); }
.gmst-hub-hero-img { position: relative; display: block; border-radius: 22px; overflow: hidden; background: #EAE4D8; aspect-ratio: 4 / 3; text-decoration: none; }
.gmst-hub-hero-img img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .6s ease; }
.gmst-hub-hero-img:hover img { transform: scale(1.02); }
.gmst-hub-cap { position: absolute; left: 16px; right: 16px; bottom: 16px; display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.gmst-hub-pill { background: rgba(28,26,22,.74); color: #fff; border-radius: 999px; padding: 6px 12px; font-size: 13px; }
.gmst-hub-score { display: inline-flex; align-items: center; background: rgba(28,26,22,.78); border-radius: 999px; padding: 5px 10px; }
.gmst-hub-score .gmst-stars { color: var(--gmst-gold-light); }
.gmst-hub-score .gmst-stars-num { color: #fff; font-size: 14px; }
.gmst-hub-filters { display: flex; flex-wrap: wrap; gap: 10px 16px; align-items: center; justify-content: space-between; padding: 12px 14px; margin: 0 0 8px; border-radius: 16px; background: rgba(255,255,255,.96); border: 1px solid var(--gmst-border); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); }
.gmst-hub-chips { display: flex; gap: 8px; overflow-x: auto; scrollbar-width: none; }
.gmst-hub-chips::-webkit-scrollbar { display: none; }
.gmst-hub-chip { flex: 0 0 auto; height: 38px; padding: 0 16px; border-radius: 999px; border: 1px solid #E0DACD; background: #fff; color: var(--gmst-dark); font-size: 14px; font-weight: 500; cursor: pointer; white-space: nowrap; }
.gmst-hub-chip.on { background: var(--gmst-green); border-color: var(--gmst-green); color: #fff; font-weight: 600; }
.gmst-hub-selects { display: flex; flex-wrap: wrap; gap: 12px; }
.gmst-hub-selects label { display: flex; align-items: center; gap: 8px; font-size: 13px; color: #5E5A51; }
.gmst-hub-selects select { height: 38px; padding: 0 10px; border-radius: 10px; border: 1px solid #E0DACD; background: #fff; font: 500 14px var(--gmst-sans); color: var(--gmst-dark); }
.gmst-hub-sec { padding-top: 36px; }
.gmst-hub-sec-h { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin-bottom: 16px; }
.gmst-hub-sec-h h2 { font-family: var(--gmst-hub-serif); font-weight: 700; font-size: clamp(22px, 2.4vw, 28px); color: var(--gmst-dark); margin: 0; }
.gmst-hub-note { font-size: 13px; color: var(--gmst-muted); }
.gmst-hub-cards { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
@media (min-width: 900px) { .gmst-hub-cards { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; } }
.gmst-hub-card { display: flex; flex-direction: column; gap: 4px; text-decoration: none; color: var(--gmst-dark); }
.gmst-hub-card-img { position: relative; display: block; aspect-ratio: 4 / 5; border-radius: 18px; overflow: hidden; background: #EAE4D8; margin-bottom: 8px; }
.gmst-hub-card-img img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .5s ease; }
.gmst-hub-card:hover .gmst-hub-card-img img { transform: scale(1.03); }
.gmst-hub-card-img .gmst-hub-score { position: absolute; right: 10px; top: 10px; }
.gmst-hub-name { font-family: var(--gmst-hub-serif); font-weight: 700; font-size: 18px; line-height: 1.25; }
.gmst-hub-sub { font-size: 13px; color: var(--gmst-muted); }
.gmst-hub-band { display: grid; grid-template-columns: 1fr; gap: 32px; }
@media (min-width: 900px) { .gmst-hub-band { grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); } }
.gmst-hub-map { position: relative; z-index: 0; height: 340px; border-radius: 20px; overflow: hidden; background: #EFEBE1; }
@media (min-width: 900px) { .gmst-hub-map { height: 440px; } }
.gmst-hub-map-hint { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; font-size: 13px; color: var(--gmst-muted); }
.gmst-hub-pin { display: block; width: 18px; height: 18px; border-radius: 50%; background: var(--gmst-gold); border: 3px solid #fff; box-shadow: 0 2px 8px rgba(28,26,22,.3); box-sizing: border-box; }
.gmst-hub-pin-dest { display: block; min-width: 30px; height: 30px; padding: 0 6px; border-radius: 999px; background: var(--gmst-green); border: 3px solid #fff; color: #fff; font: 700 13px/24px var(--gmst-sans); text-align: center; box-shadow: 0 2px 8px rgba(28,26,22,.3); box-sizing: border-box; cursor: pointer; }
.gmst-hub-pop { font-family: var(--gmst-sans); font-size: 13px; line-height: 1.5; }
.gmst-hub-pop strong { font-family: var(--gmst-hub-serif); font-size: 15px; font-weight: 700; }
.gmst-hub-dests { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.gmst-hub-dest { display: flex; flex-direction: column; gap: 2px; padding: 0; border: 0; background: none; text-align: left; cursor: pointer; color: var(--gmst-dark); }
.gmst-hub-dest-img { position: relative; display: block; aspect-ratio: 16 / 10; border-radius: 14px; overflow: hidden; background: #E6EEEA; margin-bottom: 6px; }
.gmst-hub-dest-img img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .5s ease; }
.gmst-hub-dest:hover .gmst-hub-dest-img img { transform: scale(1.04); }
.gmst-hub-dest-n { position: absolute; right: 8px; top: 8px; background: rgba(28,26,22,.74); color: #fff; font-size: 12px; font-weight: 600; padding: 3px 9px; border-radius: 999px; }
.gmst-hub-dest-name { font-family: var(--gmst-hub-serif); font-weight: 700; font-size: 16.5px; line-height: 1.25; }
.gmst-hub-dest-sub { font-size: 12.5px; color: var(--gmst-muted); }
.gmst-hub-ark { display: grid; grid-template-columns: 1fr; gap: 4px 28px; }
@media (min-width: 700px) { .gmst-hub-ark { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1100px) { .gmst-hub-ark { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.gmst-hub-ark-item { display: flex; gap: 14px; align-items: center; padding: 10px 0; border-bottom: 1px solid var(--gmst-border); text-decoration: none; color: var(--gmst-dark); }
.gmst-hub-ark-item img, .gmst-hub-ark-ph { width: 76px; height: 76px; border-radius: 14px; object-fit: cover; flex-shrink: 0; background: #EAE4D8; }
.gmst-hub-ark-txt { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.gmst-hub-ark-name { font-family: var(--gmst-hub-serif); font-weight: 700; font-size: 15.5px; line-height: 1.3; }
.gmst-hub-ark-item:hover .gmst-hub-ark-name { color: var(--gmst-green); }
.gmst-hub-all { display: block; margin: 22px auto 0; height: 44px; padding: 0 24px; border-radius: 999px; border: 1px solid var(--gmst-green); background: #fff; color: var(--gmst-green); font-size: 14px; font-weight: 600; cursor: pointer; }
.gmst-hub-all:hover { background: var(--gmst-green); color: #fff; }
.gmst-hub-none { text-align: center; color: var(--gmst-muted); padding: 40px 16px; }
/* 0.38.3 — uden kortet (offentligt, indtil Apple Maps) fylder destinationerne hele båndet. */
@media (min-width: 900px) { .gmst-hub-band--uden-kort { grid-template-columns: 1fr; } .gmst-hub-band--uden-kort .gmst-hub-dests { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
/* ═══ 0.38.4 — mobil-design på /anmeldelser/ (Jes 27/09 m. skærmbillede: «Lige det her design skal vi rette til») ═══
🪤 Sitets mu-plugin (sumedha) tvinger Merriweather !important på body/a/p/div/label/h1–h6 — knapper og spans ARVER
det. Små UI-tekster (chips, etiketter, meta, noter, piller) sættes derfor eksplicit til DM Sans; overskrifter og
navne beholder sitets Merriweather. Kortenes titler var link-grønne (.gmst a vinder) → mørke. */
.gmst-hub { --gmst-hub-ui: 'DM Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; }
.gmst-hub .gmst-hub-chip, .gmst-hub .gmst-hub-all, .gmst-hub .gmst-hub-dest,
.gmst-hub .gmst-hub-meta, .gmst-hub .gmst-hub-sub, .gmst-hub .gmst-hub-note, .gmst-hub .gmst-hub-pill,
.gmst-hub .gmst-hub-stats span, .gmst-hub .gmst-hub-dest-sub, .gmst-hub .gmst-hub-dest-n, .gmst-hub .gmst-hub-selects select { font-family: var(--gmst-hub-ui) !important; }
.gmst-hub .gmst-hub-kick, .gmst-hub .gmst-hub-selects label, .gmst-hub .gmst-hub-selects span { font-family: var(--gmst-hub-ui) !important; }
.gmst-hub a.gmst-hub-card, .gmst-hub a.gmst-hub-ark-item, .gmst-hub a.gmst-hub-card .gmst-hub-name, .gmst-hub a.gmst-hub-ark-item .gmst-hub-ark-name { color: var(--gmst-dark); }
.gmst-hub a.gmst-hub-ark-item:hover .gmst-hub-ark-name, .gmst-hub a.gmst-hub-card:hover .gmst-hub-name { color: var(--gmst-green); }
/* Meta på én linje (før: «RESTAURANT ·» / «HELSINGBORG» på to linjer i telefonens smalle kort). */
.gmst-hub .gmst-hub-meta { display: block; font-size: 10.5px; letter-spacing: .06em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
@media (max-width: 899px) {
/* Billedet først, så teksten — og lidt mindre luft. */
.gmst-hub-hero { gap: 16px; padding: 12px 0 18px; }
.gmst-hub-hero-img { order: -1; aspect-ratio: 16 / 11; border-radius: 18px; }
.gmst-hub-hero h1 { font-size: clamp(30px, 8.5vw, 38px); margin: 6px 0 10px; }
.gmst-hub-hero p { font-size: 15px; }
.gmst-hub-stats { gap: 18px 24px; margin-top: 16px; }
.gmst-hub-stats strong { font-size: 26px; }
/* Filterboksen: chips på én rullende række til kanten, dropdowns side om side med lille overskrift. */
.gmst-hub-filters { display: block; padding: 12px 0 14px; border-radius: 16px; }
.gmst-hub-chips { padding: 0 12px 2px; scroll-padding-inline: 12px; }
.gmst-hub-chip { height: 36px; padding: 0 14px; font-size: 13.5px; }
.gmst-hub-selects { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; padding: 12px 12px 0; }
.gmst-hub-selects label { display: flex; flex-direction: column; align-items: stretch; gap: 4px; font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: #8F6A24; }
.gmst-hub-selects select { width: 100%; min-width: 0; height: 40px; font-size: 14px; text-transform: none; letter-spacing: 0; }
.gmst-hub-sec { padding-top: 28px; }
.gmst-hub-cards { gap: 12px; }
.gmst-hub-name { font-size: 16px; }
.gmst-hub-card-img { border-radius: 14px; margin-bottom: 6px; }
.gmst-hub-card-img .gmst-hub-score { right: 6px; top: 6px; padding: 4px 8px; }
.gmst-hub-card-img .gmst-stars { font-size: 11px; }
}
/* ═══ 0.39.0 — levende billeder (Jes 28/09: «Alle film kører stumt i løkke, uden knapper … de starter, når man ruller
hen til dem»). YouTube-filmen: plakaten ligger UNDER iframen, som front.js lægger ind i syne — intet foran
afspilleren (YouTube tillader ikke elementer oven på den). Plakaten er et stillbillede fra Blue Billywig/YouTube.
🪤 Sitets WebP-plugin kan pakke ![]()
i og flytte klassen — reglen rammer begge (som bylinen, 0.32.4). */
.gmst-film-frame .gmst-film-poster,
.gmst-film-frame .gmst-film-poster img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; border: 0; border-radius: 0; }
.gmst-film-frame iframe { z-index: 1; }
/* Egne klip uden knapper: et tryk sætter på pause (front.js). Tastaturet når dem også — fokusring i husets grøn. */
.gmst-video video.gmst-film-v { cursor: pointer; }
.gmst-video video.gmst-film-v[controls] { cursor: auto; }
.gmst-video video.gmst-film-v:focus-visible { outline: 2px solid var(--gmst-green); outline-offset: 2px; }