/* MinBy design – layout-varianter (Tilpas → MinBy design → Layout).
   Standarddesignet (avis) bruger kun minby.css og artikel.css; alt her er bundet til en
   body-klasse som .mb-front-moderne, så standarden ikke kan påvirkes. På mobil (≤ 760 px)
   bruger alle layouts den fælles mobilvisning – variant-reglerne ligger derfor mest i
   @media (min-width: 761px). */

/* Elementer der kun bruges af nogle layouts */
body .mb-mast-search, body .mb-lead-go { display: none; }

/* =====================================================================
   SKRIFTTYPER
   ===================================================================== */
body:is(.mb-font-moderne, .mb-font-elegant, .mb-font-lokal, .mb-font-kraftig) :is(.mb-header, .mb-drawer, .mb-front, .mb-band, .mb-newsbox, .mb-article) :is(h1, h2, h3, .mb-logo, .mb-latest a, .mb-aside li a, .mb-drawer-list a, .mb-drawer-btn):not(.mb-label):not(.mb-side-h):not(.mb-fakta-h) {
  font-weight: var(--mb-head-w); letter-spacing: var(--mb-head-ls); text-transform: var(--mb-head-tt);
}
body.mb-font-kraftig :is(.mb-front, .mb-band, .mb-article, .mb-newsbox) :is(h1, h2, h3) { line-height: 1; }
body.mb-font-elegant :is(.mb-front, .mb-band, .mb-article, .mb-newsbox) :is(h1, h2, h3) { line-height: 1.04; }
body.mb-font-kraftig .mb-abody blockquote p { text-transform: none; }

@media (min-width: 761px) {
  /* Tynde/smalle skrifter får lidt større overskrifter */
  body.mb-font-elegant .mb-logo { font-size: 112px; }
  body.mb-font-elegant .mb-lead h1 { font-size: 68px; }
  body.mb-font-elegant :is(.mb-card, .mb-stack article) h3 { font-size: 27px; }
  body.mb-font-elegant .mb-feat h2 { font-size: 52px; }
  body.mb-font-elegant .mb-sec h2 { font-size: 54px; }
  body.mb-font-elegant .mb-latest a, body.mb-font-elegant .mb-aside li a { font-size: 21px; }
  body.mb-font-elegant .mb-ahead h1 { font-size: 74px; }
  body.mb-font-kraftig .mb-lead h1 { font-size: 66px; }
  body.mb-font-kraftig :is(.mb-card, .mb-stack article) h3 { font-size: 25px; }
  body.mb-font-kraftig .mb-sec h2 { font-size: 54px; }
  body.mb-font-kraftig .mb-ahead h1 { font-size: 72px; }
}

/* =====================================================================
   HEADER: MODERNE – logo til venstre, menu som "piller"
   ===================================================================== */
@media (min-width: 761px) {
  body.mb-hdr-moderne .mb-mast { display: flex; align-items: center; gap: 20px; border-top: 0; border-bottom: 1px solid var(--mb-line); padding: 18px 0; }
  body.mb-hdr-moderne .mb-brand { order: 0; flex: 1; min-width: 0; display: flex; align-items: baseline; gap: 18px; text-align: left; }
  body.mb-hdr-moderne .mb-logo, body.mb-hdr-moderne .mb-header--compact .mb-logo { font-size: 44px; }
  body.mb-hdr-moderne .mb-tagline { display: block !important; margin: 0; font-size: 11px; letter-spacing: .14em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  body.mb-hdr-moderne .mb-mast-r { order: 1; }
  body.mb-hdr-moderne .mb-mast-l { order: 2; }
  body.mb-hdr-moderne .mb-btn { border-radius: 999px; }
  body.mb-hdr-moderne .mb-nav { border-bottom: 1px solid var(--mb-line); }
  body.mb-hdr-moderne .mb-nav ul { justify-content: flex-start; gap: 4px; padding: 10px 0; }
  body.mb-hdr-moderne :is(.mb-nav-link, .mb-dd-trigger) { padding: 9px 16px; border: 0; border-radius: 999px; font-size: 15px; letter-spacing: 0; text-transform: none; }
  body.mb-hdr-moderne .mb-nav-link:hover { background: var(--mb-field); }
  body.mb-hdr-moderne .mb-nav-link.active { background: var(--mb-ink); color: var(--mb-bg); }
}

/* =====================================================================
   HEADER: PORTAL – farvet topbjælke med søgefelt
   ===================================================================== */
body.mb-hdr-portal .mb-header { overflow-x: clip; }
body.mb-hdr-portal .mb-mast { position: relative; isolation: isolate; border-top: 0; border-bottom: 0; color: #fff; }
body.mb-hdr-portal .mb-mast::before { content: ""; position: absolute; top: 0; bottom: 0; left: calc(50% - 50vw); right: calc(50% - 50vw); background: var(--mb-blue); z-index: -1; }
body.mb-hdr-portal .mb-mast :is(.mb-logo, .mb-logo-link, .mb-icon) { color: #fff; }
body.mb-hdr-portal .mb-mast .mb-logo i { color: color-mix(in srgb, var(--mb-accent) 45%, #fff); }
body.mb-hdr-portal .mb-mast .mb-tagline { color: var(--mb-on-blue-muted); }
@media (min-width: 761px) {
  body.mb-hdr-portal .mb-mast { display: flex; align-items: center; gap: 24px; padding: 22px 0; }
  body.mb-hdr-portal .mb-brand { order: 0; text-align: left; display: flex; flex-direction: column; gap: 6px; }
  body.mb-hdr-portal .mb-logo, body.mb-hdr-portal .mb-header--compact .mb-logo { font-size: 44px; }
  body.mb-hdr-portal .mb-tagline { display: block !important; margin: 0; font-size: 11px; letter-spacing: .14em; }
  body.mb-hdr-portal .mb-mast-r { order: 1; flex: 1; justify-content: flex-end; }
  body.mb-hdr-portal .mb-mast-l { order: 2; }
  body.mb-hdr-portal .mb-mast-search { display: flex; flex: 1; max-width: 520px; margin: 0 auto 0 32px; }
  body.mb-hdr-portal .mb-mast-search input { flex: 1; min-width: 0; height: 48px; border: 0; border-radius: 8px 0 0 8px; padding: 0 16px; font: 16px var(--mb-sans); background: #fff; color: #111; }
  body.mb-hdr-portal .mb-mast-search button { width: 52px; height: 48px; border: 0; border-radius: 0 8px 8px 0; background: var(--mb-accent); color: #fff; display: flex; align-items: center; justify-content: center; cursor: pointer; }
  body.mb-hdr-portal .mb-mast-r > [data-mb-drawer="search"] { display: none; }
  body.mb-hdr-portal .mb-btn { border-radius: 8px; }
  body.mb-hdr-portal .mb-nav { border-bottom: 1px solid var(--mb-line); }
  body.mb-hdr-portal .mb-nav ul { justify-content: flex-start; }
}

/* =====================================================================
   FORSIDE: MODERNE – stort foto-kort, blå "Lige nu"-boks, afrundede kort
   ===================================================================== */
body.mb-front-moderne:is(.minby-fullwidth, :has(#mb-front)) { background: var(--mb-field) !important; }
body.mb-front-moderne.minby-fullwidth :is(#content, .site-content), body.mb-front-moderne:has(#mb-front) :is(#content, .site-content) { background: transparent !important; }
@media (min-width: 761px) {
  body.mb-front-moderne .mb-top { grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); gap: 20px; margin-top: 28px; }
  body.mb-front-moderne .mb-top > * { padding: 0 !important; border: 0 !important; }
  body.mb-front-moderne .mb-stack { display: none !important; }
  body.mb-front-moderne .mb-lead { position: relative; min-height: 560px; border-radius: 24px; overflow: hidden; background: #111; color: #fff; }
  body.mb-front-moderne .mb-lead .mb-img { position: absolute; inset: 0; aspect-ratio: auto !important; }
  body.mb-front-moderne .mb-lead::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0,0,0,0) 35%, rgba(0,0,0,.82) 100%); pointer-events: none; }
  body.mb-front-moderne .mb-lead .mb-cap { display: none; }
  body.mb-front-moderne .mb-lead-tx { position: absolute; left: 40px; right: 40px; bottom: 36px; z-index: 1; }
  body.mb-front-moderne .mb-lead h1 { font-size: 54px; color: #fff; }
  body.mb-front-moderne .mb-lead :is(.mb-kick, .mb-kick span, .mb-meta, .mb-paid) { color: #fff; }
  body.mb-front-moderne .mb-lead .mb-kick::before { background: #FFB08F; }
  body.mb-front-moderne .mb-latest { background: var(--mb-blue); color: #fff; border-radius: 24px; padding: 26px 26px 10px !important; }
  body.mb-front-moderne .mb-latest .mb-label { color: #fff; border-bottom-color: rgba(255,255,255,.4); }
  body.mb-front-moderne .mb-latest li { border-bottom-color: rgba(255,255,255,.2); }
  body.mb-front-moderne .mb-latest li:last-child { border-bottom: 0; }
  body.mb-front-moderne .mb-latest li::before { color: #FFC6A8; }
  body.mb-front-moderne .mb-latest :is(time, a, .mb-paid) { color: #fff; }
  body.mb-front-moderne .mb-latest time { color: var(--mb-on-blue-muted); }

  body.mb-front-moderne .mb-sec .mb-ln { display: none; }
  body.mb-front-moderne .mb-feat { background: var(--mb-bg); border-radius: 24px; overflow: hidden; gap: 0; padding: 0; border: 0; margin-bottom: 20px; }
  body.mb-front-moderne .mb-feat > div { padding: 40px; }
  body.mb-front-moderne :is(#news-grid, .mb-band .mb-grid) { gap: 20px; }
  body.mb-front-moderne :is(#news-grid, .mb-band .mb-grid) .mb-card { padding: 0 0 22px !important; margin: 0; border: 0 !important; border-radius: 20px; overflow: hidden; background: var(--mb-bg); }
  body.mb-front-moderne .mb-band .mb-grid .mb-card { background: rgba(255,255,255,.1); }
  body.mb-front-moderne :is(#news-grid, .mb-band .mb-grid) .mb-card .mb-img { margin: 0 0 16px; }
  body.mb-front-moderne :is(#news-grid, .mb-band .mb-grid) .mb-card > :not(.mb-img) { margin-left: 22px; margin-right: 22px; }
  body.mb-front-moderne .mb-outline-btn { border-radius: 999px; background: var(--mb-bg); }
  body.mb-front-moderne .mb-newsbox { background: var(--mb-bg); border: 0; border-radius: 24px; padding: 40px 44px; }
}

/* =====================================================================
   FORSIDE: MAGASIN – delt top i farve, tidslinje, skiftende features
   ===================================================================== */
@media (min-width: 761px) {
  body.mb-front-magasin .mb-top { grid-template-columns: 1fr; margin-top: 28px; }
  body.mb-front-magasin .mb-top > * { padding: 0 !important; border: 0 !important; }
  body.mb-front-magasin .mb-stack { display: none !important; }
  body.mb-front-magasin .mb-lead { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); min-height: 540px; }
  body.mb-front-magasin .mb-lead .mb-img { grid-column: 2; grid-row: 1; aspect-ratio: auto !important; height: 100%; }
  body.mb-front-magasin .mb-lead .mb-cap { display: none; }
  body.mb-front-magasin .mb-lead-tx { grid-column: 1; grid-row: 1; background: var(--mb-blue); color: #fff; padding: 56px; display: flex; flex-direction: column; justify-content: flex-end; }
  body.mb-front-magasin .mb-lead h1 { font-size: 52px; color: #fff; }
  body.mb-front-magasin .mb-lead .mb-kick { margin-top: 0; color: #FFD2BD; }
  body.mb-front-magasin .mb-lead .mb-kick::before { background: #FFD2BD; }
  body.mb-front-magasin .mb-lead :is(.mb-kick span, .mb-meta) { color: var(--mb-on-blue-muted); }
  body.mb-front-magasin .mb-lead .mb-paid { color: #fff; }
  body.mb-front-magasin .mb-lead-go { display: inline-flex; align-self: flex-start; align-items: center; margin-top: 26px; height: 50px; padding: 0 24px; border-radius: 999px; background: #fff; color: #111 !important; font-weight: 700; font-size: 15px; }
  body.mb-front-magasin .mb-latest { margin-top: 0; }
  body.mb-front-magasin .mb-latest .mb-label { display: none; }
  body.mb-front-magasin .mb-latest ol { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); border-bottom: 1px solid var(--mb-line); }
  body.mb-front-magasin .mb-latest li { display: block; padding: 22px 20px 24px; border-bottom: 0; border-left: 1px solid var(--mb-line); }
  body.mb-front-magasin .mb-latest li:first-child { border-left: 0; padding-left: 0; }
  body.mb-front-magasin .mb-latest li::before { display: none; }
  body.mb-front-magasin .mb-latest time { display: inline-block; margin-bottom: 10px; padding: 3px 8px; border-radius: 4px; background: var(--mb-field); color: var(--mb-ink); }
  body.mb-front-magasin .mb-latest a { display: block; font-size: 16px; }
  body.mb-front-magasin .mb-feat { grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: 56px; border-bottom: 0; padding-bottom: 0; margin-bottom: 56px; }
  body.mb-front-magasin .mb-feat--rev { grid-template-columns: minmax(0, 1fr) minmax(0, 1.25fr); }
  body.mb-front-magasin .mb-feat--rev .mb-img { order: 2; }
  body.mb-front-magasin :is(.mb-feat, #news-grid .mb-card, .mb-band .mb-card) .mb-img { border-radius: 10px; }
  body.mb-front-magasin #news-grid { gap: 40px 28px; }
  body.mb-front-magasin #news-grid .mb-card { padding: 0 !important; margin: 0; border: 0 !important; }
  body.mb-front-magasin .mb-outline-btn { border-radius: 999px; }
}

/* =====================================================================
   FORSIDE: MINIMAL – stor overskrift + portræt, nummereret liste
   ===================================================================== */
@media (min-width: 761px) {
  body.mb-front-minimal .mb-top { grid-template-columns: 1fr; margin-top: 48px; }
  body.mb-front-minimal .mb-top > * { padding: 0 !important; border: 0 !important; }
  body.mb-front-minimal .mb-stack { display: none !important; }
  body.mb-front-minimal .mb-lead { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); gap: 64px; align-items: center; padding-bottom: 56px !important; border-bottom: 1px solid var(--mb-line) !important; }
  body.mb-front-minimal .mb-lead .mb-img { grid-column: 2; grid-row: 1; aspect-ratio: 4 / 5 !important; border-radius: 4px; }
  body.mb-front-minimal .mb-lead .mb-cap { display: none; }
  body.mb-front-minimal .mb-lead-tx { grid-column: 1; grid-row: 1; }
  body.mb-front-minimal .mb-lead h1 { font-size: 72px; line-height: 1; }
  body.mb-front-minimal .mb-latest { margin-top: 32px; padding: 24px 28px 8px !important; border-radius: 6px; background: var(--mb-field); }
  body.mb-front-minimal .mb-latest .mb-label { border-bottom: 0; padding-bottom: 6px; }
  body.mb-front-minimal .mb-latest ol { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 0 28px; }
  body.mb-front-minimal .mb-latest li { border-bottom: 0; grid-template-columns: 32px minmax(0, 1fr); }
  body.mb-front-minimal .mb-latest li::before { font-size: 28px; color: var(--mb-blue); }
  body.mb-front-minimal .mb-latest a { font-size: 17px; }
  body.mb-front-minimal .mb-sec .mb-ln { border-top-color: var(--mb-line); }
  body.mb-front-minimal #news-grid { grid-template-columns: 1fr !important; counter-reset: mbrow; }
  body.mb-front-minimal #news-grid .mb-card { counter-increment: mbrow; display: grid; grid-template-columns: 56px 170px minmax(0, 1fr) 180px; grid-template-rows: auto auto; grid-template-areas: "n k h i" "n m h i"; column-gap: 28px; align-items: center; padding: 24px 0 !important; margin: 0; border: 0 !important; border-bottom: 1px solid var(--mb-line) !important; }
  body.mb-front-minimal #news-grid .mb-card::before { content: counter(mbrow, decimal-leading-zero); grid-area: n; font-family: var(--mb-serif); font-size: 34px; line-height: 1; color: var(--mb-blue); }
  body.mb-front-minimal #news-grid .mb-card .mb-img { grid-area: i; margin: 0; aspect-ratio: 3 / 2; border-radius: 4px; }
  body.mb-front-minimal #news-grid .mb-card .mb-kick { grid-area: k; align-self: end; margin: 0; }
  body.mb-front-minimal #news-grid .mb-card .mb-meta { grid-area: m; align-self: start; margin-top: 6px; }
  body.mb-front-minimal #news-grid .mb-card h3 { grid-area: h; font-size: 30px; line-height: 1.1; }
}
@media (min-width: 761px) and (max-width: 1100px) {
  body.mb-front-minimal #news-grid .mb-card { grid-template-columns: 44px minmax(0, 1fr) 150px; grid-template-areas: "n k i" "n h i" "n m i"; row-gap: 6px; }
  body.mb-front-minimal #news-grid .mb-card h3 { font-size: 24px; }
}

/* =====================================================================
   ARTIKEL: FOKUS – én centreret spalte, sidebar under artiklen
   ===================================================================== */
@media (min-width: 761px) {
  body.mb-art-fokus .mb-alay { grid-template-columns: 1fr; }
  body.mb-art-fokus .mb-amain { width: 100%; max-width: 760px; margin: 0 auto; padding-right: 0; border-right: 0; }
  body.mb-art-fokus .mb-crumb { max-width: 760px; margin-left: auto; margin-right: auto; }
  body.mb-art-fokus :is(.mb-ahead, .mb-by, .mb-paid-note, .mb-abody, .mb-endshare) { max-width: none; }
  body.mb-art-fokus .mb-ahead h1 { font-size: 56px; }
  body.mb-art-fokus .mb-aside { width: 100%; max-width: 760px; margin: 56px auto 0; padding: 40px 0 0; border-top: 1px solid var(--mb-line); display: grid; grid-template-columns: 1fr 1fr; gap: 0 40px; }
}
@media (min-width: 1101px) {
  body.mb-art-fokus .mb-amain > .mb-afig { margin: 0 -80px; }
}

/* =====================================================================
   ARTIKEL: MAGASIN – stort billede øverst
   ===================================================================== */
body.mb-art-magasin .mb-afig--hero { margin: 18px 0 0; }
@media (min-width: 761px) {
  body.mb-art-magasin .mb-afig--hero .mb-afig-img { aspect-ratio: 21 / 9; }
  body.mb-art-magasin .mb-alay { margin-top: 36px; }
  body.mb-art-magasin .mb-ahead h1 { font-size: 64px; }
}
@media (max-width: 760px) {
  body.mb-art-magasin .mb-afig--hero { margin: 16px -20px 0; }
}