/* Bryllupssiden (staging-udkast 28-09-2026).
 * Bygger oven på forsidens v5-CSS (header, footer, bund-bar, skrift) og lægger
 * sine egne, lyse sektioner ovenpå med præfikset br-. Apple-stil: hvid og
 * #f5f5f7 på skift, store overskrifter, afrundede kort, masser af luft. */

html.br-side, html.br-side body { background: #fff; }
.br {
  --br-tekst: #1d1d1f; --br-graa: #6e6e73; --br-flade: #f5f5f7; --br-kant: rgba(0, 0, 0, .08);
  --br-groen: #0e3b2f; --br-maks: 100%; --br-side: var(--kant, 20px);
  --br-kurve: cubic-bezier(.22, 1, .36, 1);
  color: var(--br-tekst);
}
/* Kun de egne sektioner; hero og slidere (kv-hero, mtf-collection) styles af forsidens CSS. Hvid flade, så den faste hero ikke skinner igennem. */
.br section[class^="br-"] { padding: var(--sek-luft) var(--br-side); background: #fff; }
.br section[class^="br-"] :is(h1, h2, h3) { color: var(--br-tekst); margin: 0; font-weight: 600; letter-spacing: -.028em; }
.br section[class^="br-"] h2 { font-size: var(--t-titel); line-height: 1.07; letter-spacing: -.015em; }
.br section[class^="br-"] h3 { font-size: clamp(1.15rem, 1.6vw, 1.35rem); line-height: 1.25; letter-spacing: -.015em; }
.br section[class^="br-"] p { margin: 0; }
.br-graa { color: var(--br-graa); }
.br-etiket { font-size: var(--t-over); font-weight: 600; color: var(--br-groen); margin: 0 0 var(--t-over-gap) !important; }
.br-hoved { margin: 0 0 var(--t-hoved-gap); }
.br-hoved--midt { text-align: center; }
.br-hoved__tekst { max-width: 34em; margin-top: var(--t-intro-gap) !important; font-size: 19px; line-height: 1.42; color: var(--br-graa); }

/* Knapper og links: sort pille som Apples "Køb", blå-agtig tekstlink erstattet af sitets grøn */
.br-knap { display: inline-flex; align-items: center; justify-content: center; min-height: 48px; padding: 0 26px; border-radius: 999px;
  font-size: 16px; font-weight: 600; text-decoration: none; transition: background-color .25s ease, transform .35s var(--br-kurve); }
.br-knap--moerk { background: var(--br-tekst); color: #fff !important; }
.br-knap--moerk:hover { background: #000; transform: translateY(-1px); }
.br-link { display: inline-flex; align-items: center; gap: 4px; font-size: 16px; font-weight: 500; color: var(--br-groen) !important; text-decoration: none; }
.br-link:hover { text-decoration: underline; text-underline-offset: 3px; }
.br-link span { font-size: 1.25em; line-height: 1; transition: transform .3s var(--br-kurve); }
.br-link:hover span { transform: translateX(3px); }

/* Kort: hvide på grå flade, eller grå på hvid */
.br-kort { background: #fff; border-radius: 24px; }

/* ── 3. Gruppe ───────────────────────────────────────────── */
.br section.br-gruppe {
  display: grid; grid-template-columns: 1.15fr 1fr; gap: clamp(32px, 5vw, 72px); align-items: center; }
.br-gruppe__billede { margin: 0; border-radius: 28px; overflow: hidden; background: var(--br-flade); }
.br-gruppe__billede img { display: block; width: 100%; height: auto; aspect-ratio: 8 / 5; object-fit: cover; }
.br-punkter { list-style: none; margin: 24px 0 32px; padding: 0; display: grid; gap: 14px; }
.br-punkter li { position: relative; padding-left: 30px; font-size: 16px; line-height: 1.5; color: var(--br-graa); }
.br-punkter li b { color: var(--br-tekst); font-weight: 600; }
.br-punkter li::before { content: ""; position: absolute; left: 0; top: 3px; width: 20px; height: 20px; border-radius: 50%; background: var(--br-groen)
  url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M2.5 6.3l2.3 2.3L9.5 3.8' fill='none' stroke='%23fff' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 12px no-repeat; }

/* ── 4. Trin ─────────────────────────────────────────────── */
.br section.br-trin { background: var(--br-flade); }
.br-trin__liste { list-style: none; margin: 0 auto; padding: 0; max-width: var(--br-maks); display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.br-trin__liste .br-kort { padding: clamp(28px, 3vw, 40px); display: flex; flex-direction: column; gap: 12px; }
.br-trin__nr { font-size: clamp(2.6rem, 4vw, 3.4rem); font-weight: 600; letter-spacing: -.04em; line-height: 1;
  background: linear-gradient(135deg, #0e3b2f, #6b8f7f); -webkit-background-clip: text; background-clip: text; color: transparent; margin-bottom: 18px; }
.br-trin__liste p { font-size: 16px; line-height: 1.55; color: var(--br-graa); }

/* ── 5. Anmeldelser ──────────────────────────────────────── */
.br-ros__gitter { max-width: var(--br-maks); margin: 0 auto; display: grid; grid-template-columns: 1.3fr 1fr 1fr; grid-template-rows: auto auto; gap: 20px; }
.br-ros .br-kort { background: var(--br-flade); margin: 0; }
.br-ros__stor { grid-row: span 2; display: flex; flex-direction: column; overflow: hidden; }
.br-ros__stor img { display: block; width: 100%; aspect-ratio: 4 / 4.2; object-fit: cover; object-position: 50% 20%; }
.br-ros__stor blockquote { margin: 0; padding: 26px 28px 30px; }
.br-ros__kort { padding: 26px 28px; display: flex; flex-direction: column; gap: 14px; }
.br-ros__kort:last-child { grid-column: 2 / span 2; }
.br-ros blockquote { margin: 0; }
.br-ros blockquote p { font-size: clamp(1.02rem, 1.35vw, 1.15rem); line-height: 1.5; letter-spacing: -.01em; }
.br-ros__stor blockquote p { font-size: clamp(1.1rem, 1.6vw, 1.35rem); margin: 12px 0 18px; }
.br-ros figcaption { font-size: 14px; color: var(--br-graa); margin-top: auto; }
.br-ros figcaption b { display: block; color: var(--br-tekst); font-weight: 600; font-size: 15px; }
.br-stjerner { color: #00b67a; letter-spacing: 2px; font-size: 15px; }
.br-ros__alle { display: flex; width: fit-content; margin: 32px auto 0; }

/* ── 7. Koncept ──────────────────────────────────────────── */
.br section.br-koncept { background: var(--br-flade); display: grid; grid-template-columns: 1fr 1fr; gap: clamp(32px, 5vw, 72px); align-items: center;
  padding-inline: max(var(--br-side), calc((100% - var(--br-maks)) / 2)); }
.br-koncept__liste { list-style: none; margin: 28px 0 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 22px 28px; }
.br-koncept__liste li { display: flex; flex-direction: column; gap: 4px; padding-top: 16px; border-top: 1px solid var(--br-kant); }
.br-koncept__liste b { font-size: 17px; font-weight: 600; }
.br-koncept__liste span { font-size: 15px; line-height: 1.5; color: var(--br-graa); }
.br-koncept__billede { margin: 0; border-radius: 28px; overflow: hidden; }
.br-koncept__billede img { display: block; width: 100%; aspect-ratio: 4 / 4.4; object-fit: cover; object-position: 45% 30%; }

/* ── 10. Slut ────────────────────────────────────────────── */
.br section.br-slut { background: var(--br-flade); text-align: center; }
.br-slut h2 { font-size: clamp(2.2rem, 5vw, 4rem); }
.br-slut > p { max-width: 40ch; margin: 16px auto 0 !important; font-size: clamp(1.05rem, 1.5vw, 1.25rem); line-height: 1.45; color: var(--br-graa); }
.br-byer { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin-top: 32px; }
.br-byer a { display: inline-flex; align-items: center; height: 38px; padding: 0 16px; border-radius: 999px; background: #fff; color: var(--br-tekst) !important;
  font-size: 14px; font-weight: 500; text-decoration: none; box-shadow: inset 0 0 0 1px var(--br-kant); transition: box-shadow .2s ease; }
.br-byer a:hover { box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .3); }

/* ── Footeren: lys som resten (forsidens er mørk) ─────────── */
html.br-side .br footer.foed { background: var(--br-flade) !important; color: var(--br-tekst) !important; border-top: 1px solid var(--br-kant); }
html.br-side .br footer.foed .foed__kald { display: none !important; }
html.br-side .br .foed *:not(svg):not(path):not(img) { border-color: var(--br-kant) !important; }
html.br-side .br .foed__titel a, html.br-side .br .foed__adresse, html.br-side .br .foed__brev,
html.br-side .br .foed__bund, html.br-side .br .foed__bund * { color: var(--br-graa) !important; }
html.br-side .br .foed__link, html.br-side .br .foed a:not(.foed__tilmeld) { color: var(--br-tekst) !important; }
html.br-side .br .foed__tilmeld { background: #fff !important; color: var(--br-tekst) !important; box-shadow: inset 0 0 0 1px var(--br-kant) !important; }
html.br-side .br .foed__logo { filter: invert(1) brightness(.2); }
html.br-side .br .foed [class*="some"] a, html.br-side .br .foed a[aria-label*="acebook"], html.br-side .br .foed a[aria-label*="nstagram"],
html.br-side .br .foed a[aria-label*="ouTube"], html.br-side .br .foed a[aria-label*="inked"] { color: var(--br-tekst) !important; background: #fff !important; }

/* ── Tablet og mobil ─────────────────────────────────────── */
@media (max-width: 960px) {
  .br section.br-gruppe, .br section.br-koncept { grid-template-columns: 1fr; }
  .br-koncept__billede { order: -1; }
  .br-trin__liste { grid-template-columns: 1fr; }
  .br-ros__gitter { grid-template-columns: 1fr 1fr; }
  .br-ros__stor { grid-row: auto; grid-column: 1 / -1; }
  .br-ros__stor img { aspect-ratio: 4 / 3; }
  .br-ros__kort:last-child { grid-column: auto; }
}
@media (max-width: 600px) {
  .br-ros__gitter { grid-template-columns: 1fr; }
  .br-koncept__liste { grid-template-columns: 1fr; }
  html.br-side footer.foed::after { content: ""; display: block; height: calc(72px + env(safe-area-inset-bottom)); }
}
@media (prefers-reduced-motion: reduce) { .br * { transition: none !important; } }

/* ── Rettelser efter første gennemsyn ─────────────────────── */
.br h2 .br-graa { color: var(--br-graa) !important; }
/* Anmeldelser: Ulrik bredt øverst (billede | citat), de tre andre i en række */
.br-ros__gitter { grid-template-columns: repeat(3, 1fr); grid-template-rows: none; }
.br-ros__stor { grid-row: auto; grid-column: 1 / -1; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.25fr); align-items: stretch; }
.br-ros__stor img { height: 100%; min-height: 420px; aspect-ratio: auto; object-position: 50% 25%; }
.br-ros__stor blockquote { display: flex; flex-direction: column; justify-content: center; padding: clamp(28px, 4vw, 56px); }
.br-ros__stor blockquote p { font-size: clamp(1.3rem, 2.2vw, 1.9rem); line-height: 1.3; letter-spacing: -.02em; }
.br-ros__stor figcaption { margin-top: 0; }
.br-ros__kort:last-child { grid-column: auto; }
/* Footeren: små, grå overskrifter som på Apple */
html.br-side .br .foed__titel, html.br-side .br .foed__titel a { font-size: 13px !important; font-weight: 600 !important; letter-spacing: 0 !important; color: #6e6e73 !important; }
html.br-side .br .foed__link { font-size: 14px !important; }
@media (max-width: 960px) {
  .br-ros__gitter { grid-template-columns: 1fr; }
  .br-ros__stor { grid-template-columns: 1fr; }
  .br-ros__stor img { min-height: 0; aspect-ratio: 4 / 3.4; }
}
/* Indglidning (bryllup.js sætter .br-js og .br-ind) */
html.br-js .br-ind { opacity: 0; transform: translateY(28px); transition: opacity .9s var(--br-kurve), transform 1s var(--br-kurve); }
html.br-js .br-ind.er-vist { opacity: 1; transform: none; }

/* ── Sliderne: forsidens .ux-rul. Kun jakkekortene og fotokortene tilpasses ── */
.br .mtf-collection.br-rul { margin: 0; padding: var(--sek-luft) var(--kant); background: #fff; }
.br .mtf-collection.br-rul + .br-gruppe { padding-top: 0; }
/* Jakkerne er packshots på hvid: multiply gør det hvide til kortets grå, og jakken står øverst over teksten */
.br .ux-rul .br-jakke .ux-rul__foto { background-size: 128% auto; background-position: 50% 4%; mix-blend-mode: multiply; }
.br .ux-rul .br-jakke::after { display: none; }
.br-prik { display: inline-block; width: 11px; height: 11px; margin-right: 8px; border-radius: 50%; vertical-align: 0; box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .15); }
/* Fotokort uden tekst: ingen mørk toning */
.br .ux-rul .br-foto::after { display: none; }
.br .br-galleri .ux-rul__kort { cursor: default; }
@media (max-width: 600px) { .br .mtf-collection.br-rul { padding: var(--sek-luft) 0; } }
.br-hero__knapper { display: flex; flex-wrap: wrap; gap: 14px 28px; align-items: center; justify-content: center; margin-top: 32px; }

/* ── Bryllupsguiden: mørkt fotokort med fire af guidens regler (lige efter kollektionen) ── */
.br section.br-guide { padding-top: 0; }
.br-guide__kort { position: relative; isolation: isolate; overflow: hidden; border-radius: 28px; color: #fff;
  display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: clamp(28px, 4vw, 64px); align-items: end;
  padding: clamp(32px, 4.4vw, 72px); min-height: min(640px, 82vh); background: #0e1512; }
/* Baggrundsfotoet er et element (ikke ::before), så det kan skiftes med Rediger. Sløret (::after) lader klik gå igennem til fotoet. */
.br-guide__foto { position: absolute; inset: 0; z-index: -2; background: url("../assets/galleri-kys-1400.webp") 50% 35% / cover no-repeat;
  transform: scale(1.02); transition: transform 1.4s var(--br-kurve); }
.br-guide__kort::after { content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background: linear-gradient(90deg, rgba(8, 14, 12, .88) 0%, rgba(8, 14, 12, .62) 45%, rgba(8, 14, 12, .38) 100%), linear-gradient(0deg, rgba(8, 14, 12, .55), rgba(8, 14, 12, 0) 55%); }
.br-guide__kort:hover .br-guide__foto { transform: scale(1.05); }
.br section.br-guide .br-guide__over { font-size: var(--t-over); font-weight: 600; color: rgba(255, 255, 255, .72); margin: 0 0 var(--t-over-gap); }
.br section.br-guide h2 { color: #fff; font-size: var(--t-titel); max-width: 11em; }
.br section.br-guide .br-guide__intro { margin: var(--t-intro-gap) 0 0; max-width: 30em; font-size: 19px; line-height: 1.42; color: rgba(255, 255, 255, .78); }
.br-guide__knap { display: inline-flex; align-items: center; gap: 10px; margin-top: 32px; min-height: 50px; padding: 0 24px; border-radius: 999px;
  background: #fff; color: #1d1d1f !important; font-size: 16px; font-weight: 600; text-decoration: none; transition: transform .35s var(--br-kurve), background-color .2s ease; }
.br-guide__knap:hover { transform: translateY(-2px); background: #f5f5f7; }
.br-guide__knap svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; transition: transform .3s var(--br-kurve); }
.br-guide__knap:hover svg { transform: translateX(3px); }
.br-guide__regler { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.br-guide__regler a { display: flex; flex-direction: column; gap: 8px; height: 100%; padding: 22px 22px 24px; border-radius: 20px; color: #fff !important; text-decoration: none;
  background: rgba(255, 255, 255, .1); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .16);
  -webkit-backdrop-filter: blur(18px) saturate(1.4); backdrop-filter: blur(18px) saturate(1.4); transition: background-color .25s ease, transform .4s var(--br-kurve); }
.br-guide__regler a:hover { background: rgba(255, 255, 255, .17); transform: translateY(-3px); }
.br-guide__nr { font-size: 13px; font-weight: 600; letter-spacing: .04em; color: rgba(255, 255, 255, .55); }
.br-guide__regler b { font-size: 21px; font-weight: 600; letter-spacing: -.015em; line-height: 1.2; }
.br-guide__regler a > span:last-child { font-size: 15px; line-height: 1.45; color: rgba(255, 255, 255, .78); }
@media (max-width: 960px) {
  .br-guide__kort { grid-template-columns: 1fr; align-items: start; min-height: 0; }
  .br-guide__kort::after { background: linear-gradient(180deg, rgba(8, 14, 12, .5) 0%, rgba(8, 14, 12, .82) 45%, rgba(8, 14, 12, .92) 100%); }
}
@media (max-width: 600px) {
  .br-guide__kort { border-radius: 24px; padding: 28px 20px 20px; }
  .br-guide__regler { grid-template-columns: 1fr; gap: 10px; }
  .br-guide__regler a { padding: 18px 18px 20px; gap: 6px; }
  .br-guide__regler b { font-size: 19px; }
  .br-guide__knap { margin-top: 24px; }
}
/* "Sådan foregår det" ligger over den faste hero: hvid flade */
.br .ux-hp { background: #fff; }


/* ── Gruppekampagnen (runde 4): ét fotokort som forsidens kort – foto, mørk toning, hvid tekst nederst ── */
.br section.br-gruppe { display: block; }
.br-gruppe__kort { position: relative; isolation: isolate; overflow: hidden; border-radius: 28px; min-height: min(620px, 78vh);
  display: flex; align-items: flex-end; background: #0b0f0d; color: #fff; }
.br-gruppe__foto { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; object-fit: cover; object-position: 78% 38%;
  transform: scale(1.02); transition: transform 1.4s var(--br-kurve); }
.br-gruppe__kort:hover .br-gruppe__foto { transform: scale(1.05); }
.br-gruppe__kort::after { content: ""; position: absolute; inset: 0; z-index: -1;
  background: linear-gradient(90deg, rgba(0, 0, 0, .62) 0%, rgba(0, 0, 0, .3) 34%, rgba(0, 0, 0, 0) 55%), linear-gradient(0deg, rgba(0, 0, 0, .55) 0%, rgba(0, 0, 0, 0) 50%); }
.br-gruppe__tekst { padding: clamp(28px, 3.4vw, 52px); max-width: 560px; }
.br section.br-gruppe .br-gruppe__over { margin: 0 0 var(--t-over-gap); font-size: var(--t-over); font-weight: 600; color: rgba(255, 255, 255, .86); }
.br section.br-gruppe h2 { color: #fff; font-size: var(--t-titel); }
.br section.br-gruppe .br-gruppe__brod { margin: var(--t-intro-gap) 0 0; font-size: 17px; line-height: 1.5; color: rgba(255, 255, 255, .86); max-width: 34em; }
.br-gruppe__knap { display: inline-flex; align-items: center; gap: 10px; margin-top: 26px; min-height: 50px; padding: 0 24px; border-radius: 999px;
  background: #fff; color: #1d1d1f !important; font-size: 16px; font-weight: 600; text-decoration: none; transition: transform .35s var(--br-kurve), background-color .2s ease; }
.br-gruppe__knap:hover { transform: translateY(-2px); background: #f5f5f7; }
.br-gruppe__knap svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
@media (max-width: 600px) {
  .br-gruppe__kort { border-radius: 24px; min-height: 0; aspect-ratio: 3 / 4.3; }
  .br-gruppe__foto { object-position: 66% 40%; }
  .br-gruppe__kort::after { background: linear-gradient(0deg, rgba(0, 0, 0, .8) 0%, rgba(0, 0, 0, .4) 48%, rgba(0, 0, 0, 0) 72%); }
  .br-gruppe__tekst { padding: 24px 22px; }
  .br section.br-gruppe .br-gruppe__brod { font-size: 15px; }
}

/* ── Anmeldelser (runde 4): større kort med anmelderens foto og ansigt ── */
html.br-side .kv .ros .ros__liste { max-width: none !important; }
html.br-side .kv .ros .ros__kort.br-ros-kort { padding: 12px 12px 22px !important; gap: 12px !important; }
.br-ros-kort__foto { height: clamp(170px, 15vw, 220px); margin: 0 0 4px; border-radius: 12px; background-size: cover; background-repeat: no-repeat; }
.br-ros-kort .ros__fem, .br-ros-kort .ros__citat, .br-ros-kort .ros__navn { margin-left: 10px !important; margin-right: 10px !important; }
html.br-side .kv .ros .br-ros-kort .ros__citat { font-size: 16px !important; line-height: 1.5 !important; }
html.br-side .kv .ros .ros__hoved--lille.br-ansigt { width: 40px !important; height: 40px !important; flex: none; font-size: 0 !important; color: transparent !important;
  background-image: var(--kv-bg, var(--ansigt)) !important; background-position: var(--kv-bgpos, center) !important;
  background-size: var(--kv-bgsize, cover) !important; background-repeat: no-repeat !important; box-shadow: 0 0 0 2px rgba(255, 255, 255, .85) !important; }
html.br-side .kv .ros .br-ros-kort cite { font-size: 15px !important; }

/* Runde 5: sliderne har ingen runde bundhjørner – forsidens kollektion overlapper næste sektion, det gør de ikke her */
.br .mtf-collection.br-rul { border-bottom-left-radius: 0 !important; border-bottom-right-radius: 0 !important; }

/* Runde 6: guidens fire regler som vandret spor på mobil (snap, næste kort titter frem) */
@media (max-width: 600px) {
  .br-guide__kort { padding-right: 0; }
  .br-guide__hoved { padding-right: 20px; }
  .br-guide__regler { display: flex; gap: 10px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none;
    overscroll-behavior-x: contain; margin: 0; padding: 0 20px 4px 0; scroll-padding-left: 0; }
  .br-guide__regler::-webkit-scrollbar { display: none; }
  .br-guide__regler li { flex: 0 0 78%; scroll-snap-align: start; }
}

/* ── Kollektionen (runde 7): større kort, fotoet i fokus – kun navn, pris og "Se stoffet" ── */
.br #kollektion .ux-rul__kort { flex-basis: clamp(300px, 31vw, 470px); }
.br #kollektion .br-stofkort::after { background: linear-gradient(0deg, rgba(0, 0, 0, .62) 0%, rgba(0, 0, 0, .18) 30%, rgba(0, 0, 0, 0) 46%) !important; }
.br #kollektion .br-stofkort .ux-rul__navn { margin-bottom: 4px; }
@media (max-width: 600px) { .br #kollektion .ux-rul__kort { flex-basis: 80vw; } }

/* ── FAQ (runde 7): overskrift + knap til venstre (klæber på computer), spørgsmålene til højre ──
 * Tynde linjer mellem punkterne, nummer, stort spørgsmål og et rundt +/− der skifter farve, når punktet er åbent.
 * Højden animeres i bryllup.js; uden script åbner <details> bare. */
.br-faq__ramme { display: grid; grid-template-columns: minmax(0, .82fr) minmax(0, 1.18fr); gap: clamp(40px, 6vw, 120px); align-items: start; }
.br-faq__side { position: sticky; top: 120px; }
.br section.br-faq h2 { max-width: 12em; }
.br section.br-faq .br-faq__intro { margin: var(--t-intro-gap) 0 0; max-width: 26em; font-size: 19px; line-height: 1.42; color: var(--br-graa); }
.br-faq__knap { display: inline-flex; align-items: center; gap: 10px; margin-top: 30px; min-height: 50px; padding: 0 24px; border-radius: 999px;
  background: var(--br-tekst); color: #fff !important; font-size: 16px; font-weight: 600; text-decoration: none; transition: transform .35s var(--br-kurve), background-color .2s ease; }
.br-faq__knap:hover { background: #000; transform: translateY(-2px); }
.br-faq__knap svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; transition: transform .3s var(--br-kurve); }
.br-faq__knap:hover svg { transform: translateX(3px); }

.br-faq__liste { border-top: 1px solid rgba(0, 0, 0, .12); }
.br-faq__punkt { border-bottom: 1px solid rgba(0, 0, 0, .12); }
.br-faq__punkt summary { list-style: none; display: grid; grid-template-columns: 48px minmax(0, 1fr) 40px; align-items: center; gap: 12px;
  padding: 26px 0; cursor: pointer; -webkit-tap-highlight-color: transparent; }
.br-faq__punkt summary::-webkit-details-marker { display: none; }
.br-faq__punkt summary:focus-visible { outline: 2px solid var(--br-groen); outline-offset: 4px; border-radius: 12px; }
.br-faq__nr { font-size: 13px; font-weight: 600; letter-spacing: .06em; color: #86868b; font-variant-numeric: tabular-nums; transition: color .3s ease; }
.br-faq__spm { font-size: clamp(18px, 1.5vw, 21px); font-weight: 600; letter-spacing: -.015em; line-height: 1.3; color: var(--br-tekst); transition: color .3s ease; }
.br-faq__ikon { position: relative; width: 40px; height: 40px; border-radius: 50%; background: var(--br-flade); justify-self: end;
  transition: background-color .35s ease, transform .5s var(--br-kurve); }
.br-faq__ikon::before, .br-faq__ikon::after { content: ""; position: absolute; left: 50%; top: 50%; width: 14px; height: 1.8px; margin: -.9px 0 0 -7px;
  border-radius: 2px; background: var(--br-tekst); transition: transform .5s var(--br-kurve), background-color .35s ease; }
.br-faq__ikon::after { transform: rotate(90deg); }
@media (hover: hover) {
  .br-faq__punkt summary:hover .br-faq__spm { color: var(--br-groen); }
  .br-faq__punkt summary:hover .br-faq__nr { color: var(--br-groen); }
  .br-faq__punkt summary:hover .br-faq__ikon { background: #e8e8ed; transform: scale(1.06); }
}
/* Åbent punkt: − på mørk cirkel. Med script følger det .er-aaben (skifter ved klik), uden script [open]. */
html.br-faq-js .br-faq__punkt.er-aaben .br-faq__ikon, html:not(.br-faq-js) .br-faq__punkt[open] .br-faq__ikon { background: var(--br-tekst); transform: rotate(180deg); }
html.br-faq-js .br-faq__punkt.er-aaben .br-faq__ikon::before, html:not(.br-faq-js) .br-faq__punkt[open] .br-faq__ikon::before,
html.br-faq-js .br-faq__punkt.er-aaben .br-faq__ikon::after, html:not(.br-faq-js) .br-faq__punkt[open] .br-faq__ikon::after { background: #fff; }
html.br-faq-js .br-faq__punkt.er-aaben .br-faq__ikon::after, html:not(.br-faq-js) .br-faq__punkt[open] .br-faq__ikon::after { transform: rotate(90deg) scaleX(0); }
html.br-faq-js .br-faq__punkt.er-aaben .br-faq__nr { color: var(--br-groen); }
.br-faq__svar { overflow: hidden; }
.br section.br-faq .br-faq__svar p { margin: 0; padding: 0 56px 30px 60px; max-width: 62ch; font-size: 17px; line-height: 1.6; color: #515154; }
.br section.br-faq .br-faq__slut { display: flex; gap: 14px; align-items: flex-start; margin: 32px 0 0; padding: 22px 24px; border-radius: 20px;
  background: var(--br-flade); font-size: 15px; line-height: 1.55; color: var(--br-graa); }
.br-faq__slut svg { flex: none; width: 22px; height: 22px; margin-top: 1px; fill: none; stroke: var(--br-groen); stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
@media (max-width: 960px) {
  .br-faq__ramme { grid-template-columns: 1fr; gap: 36px; }
  .br-faq__side { position: static; }
}
@media (max-width: 600px) {
  .br-faq__punkt summary { grid-template-columns: 32px minmax(0, 1fr) 34px; gap: 10px; padding: 20px 0; }
  .br-faq__ikon { width: 34px; height: 34px; }
  .br-faq__ikon::before, .br-faq__ikon::after { width: 12px; margin-left: -6px; }
  .br-faq__spm { font-size: 17px; }
  .br section.br-faq .br-faq__svar p { padding: 0 0 22px 42px; font-size: 16px; }
  .br-faq__knap { margin-top: 22px; }
}

/* ── Redigeringsknappen (runde 8): over den faste bundbjælke på mobil ── */
@media (max-width: 1024px) { body .red-knap { bottom: calc(86px + env(safe-area-inset-bottom)) !important; } body .red-bjaelke { bottom: calc(138px + env(safe-area-inset-bottom)) !important; } }
/* Editoren giver billeder position:relative for sin ramme. De absolut placerede fotos skal beholde absolute, ellers falder de sammen til 0 px. */
.red-til .ux-rul__foto.red-billede, .red-til .ros__foto.red-billede, .red-til .br-gruppe__foto.red-billede, .red-til .br-guide__foto.red-billede { position: absolute; }
/* "Skift billede"-knapperne (kun i redigeringstilstand) til billeder der ligger under tekst eller slør. */
.red-til .kv-hero, .red-til section.ros { position: relative; }
.red-til .kv-hero__slor, .red-til .br-gruppe__kort::after, .red-til .br-gruppe__kort::before { pointer-events: none; }
.red-skift { position: absolute; top: 16px; right: 16px; z-index: 60; padding: 10px 16px; border: 0; border-radius: 999px;
  background: #b9946a; color: #14100b; font-size: 13px; font-weight: 700; cursor: pointer; box-shadow: 0 6px 20px rgba(0, 0, 0, .3); }
.red-skift:hover { background: #d1ad82; }
.kv-hero > .red-skift { top: 110px; }
/* Trustpilot-tavlen: laget med tekst ligger hen over hele fotoet. I redigeringstilstand går klik på de tomme
   flader igennem til fotoet, mens tekst og knapper stadig kan rammes. Knappen ligger under den faste header. */
.red-til .ros__vens { pointer-events: none; }
.red-til .ros__vens * { pointer-events: auto; }
section.ros > .red-skift { top: 110px; }
