@charset "UTF-8";
ul {
  margin: 0 0 1.5rem 1.5rem;
}

.product-model li {
  padding-inline-start: 1ch;
}
.product-model li::marker {
  content: url("data:image/svg+xml;charset=UTF-8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 6.86 12' width='6.86' height='12'><path d='M4.79 6 .25 1.46a.854.854 0 0 1 0-1.21c.34-.33.88-.33 1.22 0l5.15 5.14c.32.32.33.84.03 1.18l-5.18 5.18c-.34.33-.88.33-1.21 0a.863.863 0 0 1 0-1.21L4.8 6Z' fill='%23075290' /></svg>");
}

@media (max-width: 87.5rem) {
  .overflow-hidden > .gb-inside-container {
    overflow: hidden;
  }
}

.gb-query-loop-wrapper:not(:empty) + .no-post-message {
  display: none;
}

/* Image aspect ratios */
.aspect-1-1 {
  aspect-ratio: 1/1;
  -o-object-fit: cover;
     object-fit: cover;
}

.aspect-3-2 {
  aspect-ratio: 3/2;
  -o-object-fit: cover;
     object-fit: cover;
}

.aspect-2-3 {
  aspect-ratio: 2/3;
  -o-object-fit: cover;
     object-fit: cover;
}

.aspect-4-3 {
  aspect-ratio: 4/3;
  -o-object-fit: cover;
     object-fit: cover;
}

.aspect-3-4 {
  aspect-ratio: 3/4;
  -o-object-fit: cover;
     object-fit: cover;
}

.aspect-16-9 {
  aspect-ratio: 16/9;
  -o-object-fit: cover;
     object-fit: cover;
}

.aspect-9-16 {
  aspect-ratio: 9/16;
  -o-object-fit: cover;
     object-fit: cover;
}

/* When using svg icon as header */
.header-icon svg {
  height: auto !important;
}

.text-ellipsis .gb-headline-text {
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}

/* @link https://utopia.fyi/type/calculator?c=320,16,1.2,1240,18,1.333,4,1,&s=0.75|0.5|0.25,1.5|2|3|4|6,s-l&g=s,l,xl,12 */
:root {
  /* Step -1: 13.3333px → 13.5034px */
  --fs-body-s: clamp(0.8333rem, 0.8296rem + 0.0185vw, 0.844rem);
  /* Step 0: 16px → 18px */
  --fs-body: clamp(1rem, 0.9565rem + 0.2174vw, 1.125rem);
  /* Step 1: 19.2px → 23.994px */
  --fs-h4: clamp(1.2rem, 1.0958rem + 0.5211vw, 1.4996rem);
  /* Step 1: 19.2px → 23.994px */
  --fs-h3: clamp(1.2rem, 1.0958rem + 0.5211vw, 1.4996rem);
  /* Step 2: 23.04px → 31.984px */
  --fs-h2: clamp(1.44rem, 1.2456rem + 0.9722vw, 1.999rem);
  /* Step 3: 27.648px → 42.6347px */
  --fs-h1: clamp(1.728rem, 1.4022rem + 1.629vw, 2.6647rem);
  /* Step 4: 33.1776px → 56.832px */
  --fs-xl: clamp(2.0736rem, 1.5594rem + 2.5711vw, 3.552rem);
  /* @link https://utopia.fyi/space/calculator?c=320,16,1.2,1240,18,1.333,4,1,&s=0.75,1.5|2|3|4|6|8,s-l|m-xl|l-2xl|xl-3xl|2xl-4xl&g=s,l,xl,12 */
  --space-xs: clamp(0.75rem, 0.7065rem + 0.2174vw, 0.875rem);
  --space-s: clamp(1rem, 0.9565rem + 0.2174vw, 1.125rem);
  --space-m: clamp(1.5rem, 1.4348rem + 0.3261vw, 1.6875rem);
  --space-l: clamp(2rem, 1.913rem + 0.4348vw, 2.25rem);
  --space-xl: clamp(3rem, 2.8696rem + 0.6522vw, 3.375rem);
  --space-2xl: clamp(4rem, 3.8261rem + 0.8696vw, 4.5rem);
  --space-3xl: clamp(6rem, 5.7391rem + 1.3043vw, 6.75rem);
  --space-4xl: clamp(8rem, 7.6522rem + 1.7391vw, 9rem);
  /* One-up pairs */
  --space-xs-s: clamp(0.75rem, 0.6196rem + 0.6522vw, 1.125rem);
  --space-s-m: clamp(1rem, 0.7609rem + 1.1957vw, 1.6875rem);
  --space-m-l: clamp(1.5rem, 1.2391rem + 1.3043vw, 2.25rem);
  --space-l-xl: clamp(2rem, 1.5217rem + 2.3913vw, 3.375rem);
  --space-xl-2xl: clamp(3rem, 2.4783rem + 2.6087vw, 4.5rem);
  --space-2xl-3xl: clamp(4rem, 3.0435rem + 4.7826vw, 6.75rem);
  --space-3xl-4xl: clamp(6rem, 4.9565rem + 5.2174vw, 9rem);
  /* Custom pairs */
  --space-s-l: clamp(1rem, 0.5652rem + 2.1739vw, 2.25rem);
  --space-m-xl: clamp(1.5rem, 0.8478rem + 3.2609vw, 3.375rem);
  --space-l-2xl: clamp(2rem, 1.1304rem + 4.3478vw, 4.5rem);
  --space-xl-3xl: clamp(3rem, 1.6957rem + 6.5217vw, 6.75rem);
  --space-2xl-4xl: clamp(4rem, 2.2609rem + 8.6957vw, 9rem);
}

html {
  scroll-behavior: smooth;
}

.site-logo svg {
  width: 5.7990998363em;
  height: 1em;
  font-size: 30px;
  fill: currentColor;
}

.inside-header {
  padding-inline: 0;
}

.site-header {
  padding-inline: var(--space-s);
}

.site-wrapper {
  max-width: 1920px;
  margin-inline: auto;
}

@media (max-width: 1024px), (min-width: 1025px) {
  .main-navigation.sticky-navigation-transition .navigation-branding img {
    height: 40px;
  }
}
/* ---- grid ---- */
/* clear fix */
.grid:after {
  content: "";
  display: block;
  clear: both;
}

/* ---- .grid-item ---- */
.grid-sizer,
.grid-item {
  width: 48%;
}

.gutter-sizer {
  width: 4%;
}

.grid-item {
  margin-bottom: 4%;
}

.grid-item img {
  display: block;
  max-width: 100%;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}

@media (min-width: 980px) {
  .grid-sizer,
  .grid-item {
    width: 31%;
  }
  .gutter-sizer {
    width: 3%;
  }
  .grid-item {
    margin-bottom: 3%;
  }
}
.gslide-image {
  background-color: var(--base);
}

.gb-query-loop-item.husmodeller, .aos {
  opacity: 0;
  transition: all 0.7s;
  transform: translateY(100px);
}
.gb-query-loop-item.husmodeller.in-view, .aos.in-view {
  opacity: 1;
  transform: translateY(0);
}

@media (prefers-reduced-motion) {
  .gb-container {
    transition: none;
  }
}
.gb-query-loop-item.husmodeller:nth-child(2n+1) {
  transition-delay: 100ms;
}
.gb-query-loop-item.husmodeller:nth-child(2n+2) {
  transition-delay: 200ms;
}

.aos-delay-100 {
  transition-delay: 100ms;
}
.aos-delay-200 {
  transition-delay: 200ms;
}

/* Wrapper runt videon */
.sidebar-video-wrapper {
    margin-bottom: 2rem;
}

/* Gör iframe responsiv */
.sidebar-video {
    position: relative;
    width: 100%;
    padding-bottom: 56.25%; /* 16:9 aspect ratio */
    height: 0;
}

/* Iframe insidan */
.sidebar-video iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: 0;
}
/* DOKUMENTLÄNKAR */
.sidebar-docs-wrapper a {
    display: block;
    margin-bottom: 1rem;
    text-align: center;
}

/* ----------------------------------------------
   3. IKONLISTA
---------------------------------------------- */
.sidebar-icon-list {
    display: flex;
    flex-direction: column;
	gap: 1.5rem;
}

.icon-list-item {
    display: flex;
    align-items: flex-start;
    gap: 1rem;
	position: relative;
}

.icon-list-item::after {
    content: "";
    position: absolute;
    left: 20px;
    top: 40px;
    /* bottom: 0px; */
    width: 1px;
    border-left: 1px dashed #272727;
    height: calc(100% + 1.5rem - 40px);
}

.icon-list-item:last-child::after{
	display: none;
}

.icon-wrapper {
    width: 40px;
    height: 40px;
    background-color: var(--accent); /* din blå cirkel */
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
	flex-shrink: 0;
}

.icon-wrapper svg {
    width: 24px;
    height: 24px;
	display: block;
}

.icon-wrapper svg path{
	stroke: white;
}

.icon-text {
    font-size: 1.1rem;
    line-height: 1.4;
    color: #1b1b1b;
    max-width: 300px;
}
