/* ==========================================================================
   Brand: logo i header og footer, fotos i hero (forside og lokalsider) og i "Om os"
   ========================================================================== */
.site-branding a.brand-link { display: inline-flex; align-items: center; min-height: 44px; font-size: 0; }
.brand-logo { display: block; height: 46px; width: auto; max-width: 100%; }
.site-footer .brand .brand-logo { height: 58px; }
@media (max-width: 780px) { .brand-logo { height: 38px; } }
@media (max-width: 380px) { .brand-logo { height: 32px; } }

/* Hero med foto: mørk gradient fra venstre, så tekst og formular altid kan læses */
.hero.has-photo { overflow: hidden; background: var(--bt-color-navy-deeper); }
.hero-media { position: absolute; inset: 0; z-index: 0; }
.hero-media picture, .hero-media img { display: block; width: 100%; height: 100%; }
.hero-media img { object-fit: cover; object-position: 72% 62%; }
.hero-media::after { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(11, 27, 43, .97) 0%, rgba(11, 27, 43, .9) 40%, rgba(11, 27, 43, .5) 72%, rgba(11, 27, 43, .25) 100%); }
.lp-hero.has-photo .hero-media::after { background: linear-gradient(90deg, rgba(11, 27, 43, .97) 0%, rgba(11, 27, 43, .92) 48%, rgba(11, 27, 43, .6) 100%); }
.hero.has-photo .container { position: relative; z-index: 1; }

/* Mobil: fotoet vises som et bånd over overskriften i stedet for bag teksten */
@media (max-width: 640px) {
	.hero-media { position: relative; height: 170px; }
	.hero-media img { object-position: 82% 60%; }
	.hero-media::after, .lp-hero.has-photo .hero-media::after { background: linear-gradient(180deg, rgba(11, 27, 43, .05) 0%, rgba(11, 27, 43, .25) 55%, var(--bt-color-navy-deeper) 100%); }
	.hero.has-photo .container { padding-top: 6px; }
}

/* Om os: foto mellem tekst og kontaktkort */
.about-grid.has-photo { grid-template-columns: minmax(0, 1.1fr) minmax(0, .75fr) minmax(0, 1fr); align-items: stretch; }
.about-photo { margin: 0; height: auto; padding: 0; border: 0; background: none; display: flex; flex-direction: column; }
.about-photo picture { flex: 1 1 auto; display: block; min-height: 300px; }
.about-photo img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 62%; border-radius: var(--bt-radius-lg); display: block; }
.about-photo figcaption { margin-top: 8px; font-size: 13px; color: var(--bt-color-navy-text-muted-2); }
@media (max-width: 900px) {
	.about-grid.has-photo { grid-template-columns: 1fr; }
	.about-photo picture { min-height: 0; }
	.about-photo img { aspect-ratio: 4 / 3; height: auto; }
}