.ttf-hero-slider { position:relative; }
.ttf-hero-slider .splide__slide {
  position:relative; min-height:56vh;
  display:grid; place-items:center;
  background-size:cover; background-position:center;
  border-radius:16px; overflow:hidden;
}
@media (min-width: 900px){ .ttf-hero-slider .splide__slide{ min-height:72vh; } }

.ttf-hero-overlay {
  width:100%; text-align:center;
  color:var(--wp--preset--color--base, #fff);
  padding-block: clamp(18px, 12vw, 88px); /* topp og bunn */
  padding-inline: clamp(16px, 4vw, 64px);
   box-sizing: border-box;  
  background: linear-gradient(to bottom, rgb(0,0,0,0), rgb(0,0,0,0.8));
  display: flex;
    align-self: flex-end;
    flex-direction: column;
}
.ttf-hero-overlay h2 { margin:0 0 .4em; font-size:clamp(28px,4.5vw,56px); }
.ttf-hero-overlay p  { margin:0 0 1em; font-size:clamp(16px,2.2vw,20px); }
.ttf-hero-overlay .ttf-hero-buttons { 
  display:flex; 
  gap:.6rem; 
  justify-content:center; 
  flex-wrap:wrap; 
}
.ttf-hero-overlay .ttf-hero-buttons .wp-block-button__link {
  background-color: rgba(255,255,255,0.85);
  color: #000000;
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
  border-radius: 30px;
}
.ttf-hero-overlay .ttf-hero-buttons .wp-block-button__link:hover {
  background-color: rgba(0,0,0,0.85);
  color: #ffffff;
}

.ttf-hero-slider .splide__arrow {
  width:44px; height:44px; border-radius:999px;
  color:#fff; border:0;
  display:grid; place-items:center; top:50%;
  font-size: 20px;
  background: rgba(0,0,0,0);
}
.ttf-hero-slider .splide__pagination__page.is-active{ transform:scale(1.8); }

@media (prefers-reduced-motion: reduce){
  .splide__track{ scroll-behavior:auto !important; }
}

/* Fullbreddevariant */
.oi-hero-slider--wide {
  width: min(96vw, 1600px);
  margin-inline: auto;
}

.acf-block-preview .oi-hero-slider--wide {
  width: auto;
}

@media (min-width: 1400px){
  .oi-hero-slider--wide {
    width: 94vw;
  }
}

/* Break out av .is-layout-constrained / global padding – behold liten marg */
.oi-breakout {
  --oi-gutter: 2vw;            /* juster "ørliten marg" her */
  position: relative;
  left: 50%;
  right: 50%;
  margin-left: calc(-50vw + var(--oi-gutter));
  margin-right: calc(-50vw + var(--oi-gutter));
  width: calc(98vw - (var(--oi-gutter) * 2));
  max-width: none !important;  /* overstyr temaets max-width */
}

/* Behold dine "wide"-regler på selve slideren */
.oi-hero-slider--wide { margin-inline: auto; }

/* Fjern ekstra innvendig padding hvis den følger med fra global padding */
.oi-breakout.wp-block-group,
.oi-breakout .wp-block-group {
  padding-left: 0;
  padding-right: 0;
}

.oi-arrow {
  display: none;
}

.ttf-hero-slider .splide__arrow i {
  font-size: 35px;
}
.ttf-hero-slider .splide__arrow {
  bottom: 1%;
  top: auto;
}
.ttf-hero-static {
  min-height: 42vh;
  background-size: cover;
  background-position: center;
  border-radius: 16px;
  display: grid;
  place-items: center;
  overflow: hidden;
}