/**
 * Hero fullscreen – bakgrundsbild, text ovanpå, centrerat på höjd och bredd.
 * Depends: design/tokens.css, design/buttons.css, sections/hero/hero.css
 */

.hero--fullscreen {
  position: relative;
  min-height: 100vh; /* fallback */
  min-height: 100dvh; /* modern mobil: följer synlig viewport när browser-UI ändras */
  padding: var(--space-8) var(--content-gutter);
  display: flex;
  align-items: center;
  justify-content: center;
}

.hero--fullscreen .hero__inner {
  grid-template-columns: 1fr;
  position: relative;
  z-index: 1;
}

.hero__inner--centered {
  text-align: center;
}

.hero__inner--centered .hero__actions {
  justify-content: center;
}

.hero__bg {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  /* Sätt via inline style: background-image: url(...) från config.background_image */
}

.hero__overlay {
  position: absolute;
  inset: 0;
}

.hero--fullscreen .hero__subtitle {
  max-width: 40rem;
  margin-left: auto;
  margin-right: auto;
}

/* Exempel */
.hero--fullscreen {
  background-color: var(--color-dark);
}

.hero__overlay {
  background: linear-gradient(to bottom, rgba(0,0,0,0.4) 0%, rgba(0,0,0,0.6) 100%);
}

.hero--fullscreen .hero__title,
.hero--fullscreen .hero__subtitle {
  color: var(--color-bg);
  text-shadow: 0 1px 2px rgba(0,0,0,0.5);
}

.hero--fullscreen .hero__subtitle a {
  color: var(--color-link, currentColor);
  text-decoration: underline;
  text-underline-offset: 0.15em;
}

.hero--fullscreen .hero__subtitle strong,
.hero--fullscreen .hero__subtitle b {
  font-weight: 700;
}
/* Exempel */