/* TBA-forsiden 2027 – "Nattelys". Farver: nat #0E1133, creme #F6EBD9, koral #FF6B5A, rav #FFB547. */

body.bn-tba {
	background: #0E1133;
	color: #F6EBD9;
	font-family: 'Figtree', system-ui, sans-serif;
}
body.bn-tba ::selection { background: #FFB547; color: #0E1133; }

/* Kun ét scrollområde: Divi giver både html og body overflow-x:hidden, og så bliver body sin egen
   scroll-container inde i siden (to rullebjælker, hakkende hjul). clip skærer kanten af uden at scrolle. */
html:has(body.bn-tba),
body.bn-tba { overflow-x: clip !important; overflow-y: visible !important; height: auto !important; }

/* Siden har sit eget hoved og sin egen fod – det gamle festivalhoved (menu til #program osv.) skjules. */
body.bn-tba .et-l--header,
body.bn-tba .et-l--footer,
body.bn-tba #main-header,
body.bn-tba #top-header,
body.bn-tba #main-footer { display: none !important; }
body.bn-tba #page-container { position: relative; isolation: isolate; overflow-x: clip; background: transparent; padding-top: 0 !important; margin-top: 0 !important; }
body.bn-tba #main-content,
body.bn-tba .et_pb_section { background-color: transparent !important; }

body.bn-tba .et_pb_section { padding: clamp(40px, 6vw, 72px) 0; }
body.bn-tba .et_pb_row { width: calc(100% - 32px); max-width: 1120px; padding: 0; }
body.bn-tba .et_pb_module { margin-bottom: 0 !important; }
body.bn-tba .et_pb_column { gap: 24px; }

/* Tekst */
body.bn-tba .et_pb_text,
body.bn-tba .et_pb_text p { color: #F6EBD9; font-family: 'Figtree', system-ui, sans-serif; font-size: 18px; line-height: 1.55; }
body.bn-tba .et_pb_text h1,
body.bn-tba .et_pb_text h2 { font-family: 'Gabarito', sans-serif !important; color: #F6EBD9 !important; font-weight: 900; padding: 0; text-wrap: balance; }
body.bn-tba .et_pb_text h1 { font-size: clamp(40px, 5.6vw, 76px); line-height: 1.02; letter-spacing: -.02em; }
body.bn-tba .et_pb_text h2 { font-size: clamp(32px, 4vw, 48px); line-height: 1.05; }
body.bn-tba .bn-accent { color: #FF6B5A; }

/* Links: understreget i løbende tekst, tydelig fokus for tastatur */
body.bn-tba a { color: #F6EBD9; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 4px; transition: color .2s ease-out; }
body.bn-tba a:hover { color: #FFB547; }
body.bn-tba a:focus-visible { outline: 3px solid #FFB547; outline-offset: 3px; border-radius: 4px; }

/* Top: lille label + kontaktlinks (links med 44 px trykflade uden at flytte layoutet) */
.bn-top .et_pb_text_inner { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 4px 24px; }
body.bn-tba .bn-top p { margin: 0; padding: 0 !important; font-size: 15px; }
body.bn-tba .bn-top p.bn-label { font-family: 'Gabarito', sans-serif; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; color: #FFB547; }
.bn-top .bn-links { display: flex; flex-wrap: wrap; gap: 0 20px; }
.bn-top .bn-links a,
.bn-kontakt a { display: inline-block; padding: 12px 0; margin: -12px 0; }

.bn-logo img { width: min(560px, 100%); height: auto; }
body.bn-tba .bn-intro p { color: #E3DACB; font-size: 20px; max-width: 520px; }

/* Dagene: løbende tekst, skiftevis creme og rav, koral prik imellem */
.bn-chips ul { list-style: none; margin: 0; padding: 0 !important; display: flex; flex-wrap: wrap; align-items: baseline; }
.bn-chips li { font-family: 'Gabarito', sans-serif; font-size: clamp(20px, 2.6vw, 30px); font-weight: 600; line-height: 1.4; padding: 0; white-space: nowrap; }
.bn-chips li:nth-child(even) { color: #FFB547; }
.bn-chips li:not(:last-child)::after { content: "•"; color: #FF6B5A; padding: 0 .5em; }
.bn-chips li.bn-linjeslut::after { content: none; }

/* Facebook-knappen – i toppen og i afslutningen */
body.bn-tba .bn-knap { display: inline-flex; align-items: center; gap: 10px; min-height: 52px; padding: 0 28px 0 22px; border-radius: 999px; background: #FF6B5A; color: #0E1133; text-decoration: none; font-family: 'Gabarito', sans-serif; font-size: 18px; font-weight: 800; transition: background-color .2s ease-out, transform .2s ease-out; }
body.bn-tba .bn-knap:hover { background: #FFB547; color: #0E1133; transform: translateY(-1px); }
body.bn-tba .bn-knap:focus-visible { outline: 3px solid #F6EBD9; outline-offset: 4px; }
body.bn-tba .bn-knap svg { flex: none; }
body.bn-tba .bn-cta p { padding: 0; margin-top: 8px; }

/* Sole bag illustrationen og plakaten */
.bn-sole,
.bn-plakat { position: relative; isolation: isolate; width: 100%; }
.bn-sole .et_pb_image_wrap,
.bn-plakat .et_pb_image_wrap { display: block; }
.bn-sole::before,
.bn-sole::after,
.bn-plakat::before,
.bn-fod::after { content: ""; position: absolute; z-index: -1; aspect-ratio: 1; background: center / contain no-repeat; pointer-events: none; }
.bn-sole::before { background-image: var(--bn-roed); top: -4%; right: -22%; width: 72%; }
.bn-sole::after { background-image: var(--bn-gul); bottom: 6%; left: -24%; width: 58%; }
.bn-sole img { width: 100%; max-width: 380px; }
.bn-plakat::before { background-image: var(--bn-gul); top: -12%; left: -26%; width: 70%; }
/* Plakaten males én gang som sit eget lag; mindre slør på skyggen er billigere at male */
.bn-plakat img { transform: rotate(-3deg) translateZ(0); will-change: transform; box-shadow: 0 14px 24px rgba(0, 0, 0, .4); max-width: 320px; }
body.bn-tba .bn-tak p { color: #E3DACB; font-size: 20px; max-width: 34em; }
body.bn-tba .bn-tak h2 { margin-bottom: 16px; }

/* Kunstnerne fra 2026 – loopet */
body.bn-tba .bn-label-midt h2 { text-align: center; font-size: 15px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; color: #FFB547 !important; }
/* Fuld rækkebredde + padding i stedet for max-width/margin:auto – Divi tvinger margin-right:0 på sidste kolonne, så auto-margin skubbede listen mod højre */
.bn-kunstnerliste { flex-direction: row !important; flex-wrap: wrap !important; justify-content: center; align-items: baseline; gap: 0 !important; max-width: none !important; margin: 0 !important; padding: 0 clamp(0px, 5vw, 60px) !important; }
.bn-kunstner { display: inline-flex !important; flex-direction: row !important; flex-wrap: nowrap !important; align-items: baseline !important; gap: 0 !important; width: auto !important; flex: 0 0 auto !important; }
body.bn-tba .bn-kunstner .et_pb_text p { margin: 0; padding: 0; font-family: 'Gabarito', sans-serif; font-size: clamp(22px, 2.6vw, 30px); font-weight: 600; line-height: 1.55; white-space: nowrap; }
body.bn-tba .bn-kunstner:nth-child(even) .et_pb_text p { color: #FFB547; }
.bn-kunstner:not(:last-child)::after { content: "•"; color: #FF6B5A; padding: 0 .5em; font-family: 'Gabarito', sans-serif; font-size: clamp(22px, 2.6vw, 30px); line-height: 1.55; }
.bn-kunstner.bn-linjeslut::after { content: none !important; }

/* Afslutning: datoen igen, knappen, kontakt */
.bn-fod { position: relative; isolation: isolate; text-align: center; padding: 56px 0 24px; border-top: 1px solid #2E3266; }
.bn-fod::after { background-image: var(--bn-roed); right: -120px; bottom: -160px; width: 260px; opacity: .9; }
body.bn-tba .bn-fod h2 { margin-bottom: 28px; }
body.bn-tba .bn-fod p.bn-fod-cta { padding: 0 0 28px; }
body.bn-tba .bn-fod p.bn-kontakt { color: #A9A8D0; font-size: 15px; }
body.bn-tba .bn-fod p.bn-kontakt a { color: #A9A8D0; }
body.bn-tba .bn-fod p.bn-kontakt a:hover { color: #FFB547; }

@media (max-width: 980px) {
	.bn-plakat::before { left: -6%; }
	.bn-plakat img { margin: 0 auto; display: block; }

	/* Benene hænger ned fra skærmens overkant i højre side – tegningens beskårne kant
	   falder sammen med skærmkanten. Label, links og logo står til venstre ved siden af. */
	.bn-hero { position: relative; }
	.bn-hero .et_pb_row,
	.bn-hero .et_pb_column:not(.bn-sole-kol) { position: static; }
	.bn-hero .bn-sole-kol { position: absolute !important; top: 0; right: 0; width: 44vw !important; max-width: 240px; margin: 0 !important; z-index: 0; pointer-events: none; }
	.bn-hero .bn-sole { max-width: none; margin: 0; }
	.bn-hero .bn-sole img { width: 100%; max-width: none; display: block; }
	.bn-hero .bn-sole::before { top: 30%; right: -14%; width: 76%; }
	.bn-hero .bn-sole::after { bottom: 4%; left: -12%; width: 62%; }
	.bn-hero .et_pb_text,
	.bn-hero .bn-logo { position: relative; z-index: 1; }
	.bn-top,
	.bn-hero .bn-logo { max-width: 52vw; }
	.bn-top .et_pb_text_inner { flex-direction: column; align-items: flex-start; gap: 6px; }
	.bn-top .bn-links { flex-direction: column; gap: 0; }
	.bn-hero .bn-logo img { width: 100%; }
}

@media (max-width: 767px) {
	body.bn-tba .bn-kunstner .et_pb_text p { white-space: normal; }

	/* Mobil: de grafiske elementer (logo, illustration, foto) på midten – teksten forbliver venstrestillet */
	.bn-plakat { display: flex !important; justify-content: center; align-self: center !important; margin-left: auto !important; margin-right: auto !important; }
	.bn-plakat .et_pb_image_wrap { display: inline-block; margin-left: auto !important; margin-right: auto !important; }
	/* Solen under kontaktlinjen i stedet for bag den */
	.bn-fod { padding-bottom: 150px; }
	.bn-fod::after { right: -60px; bottom: -40px; width: 170px; }
}

@media (max-width: 400px) {
	.bn-chips li { font-size: 18px; }
}

@media (prefers-reduced-motion: reduce) {
	body.bn-tba .bn-knap { transition: none; }
	body.bn-tba .bn-knap:hover { transform: none; }
}