.sektion-3 {
  min-height: 1400px;
  padding: 140px 30px 10px 30px;
  background-color: #1A1A1A;
  display: flex;
  flex-direction: column;
  border-top: 1px solid #B6A15F;
}

.rubrik-sektion-3 {
  font-size: 18px;
  color: #B6A15F;
  letter-spacing: 6px;
  text-align: left;
  margin-bottom: 10px;
}

.underrubrik-sektion-x {
  font-size: 26px;
  font-weight: bold;
  color: white;
  margin: 25px 0 25px 0;
}

.punktlista-guld {
  color: #8FAE85;
  display: block;
  margin-left: 20px;
  padding-top: 20px;
  font-weight: 500;
  font-size: 18px;
}

.vit-stjarna {
  
  color:#7A9A70;
  margin-right: 8px;
  font-size: 18px;
}

/* Sektion 4 - flexbox med kolumnsortering (vertikal), guldig toppborder och bakgrundsbild */

.sektion-4 {
  min-height: 1650px;
  background-image: url('Bilder/Marmorgron.webp');
  background-color: rgba(0, 0, 0, 0.2);
  background-size: cover;
  background-position: center top;
  background-blend-mode: multiply;
  border-top: 1px solid #B6A15F;
  display: flex;
  margin-bottom: -225px;
}

.kolumn-container {
  height: 1640px;
  display: flex;
  flex-direction: column;
  margin: -80px 0 0 0;
  gap: 60px;
  width: 100%;
  max-width: 800px;
  align-items: center;
  z-index: 3;
}

.kolumn {
  width: 300px;
  height: 300px;
  border-radius: 20px;
  text-align: center;
  color: white;
  padding: 32px;
  
  background-color: #1A1A1A;
  border: 1px solid transparent;
  
background:
    linear-gradient(#1A1A1A, #1A1A1A) padding-box,
    linear-gradient(
      135deg,
      #8FAE85,
      #B6A15F,
      #8FAE85
    ) border-box;
}
.kolumn h3 {
  color: #B6A15F;
}

/* Bild-kolumn: ingen padding, ingen text, bara bilden */
.kolumn--bild {
  padding: 0 !important;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* Bilden fyller hela kortet snyggt */
.kolumn-bild {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 40%;
  display: block;
}
  
.sektion-5 {
  min-height: 3300px;
  background-color: #1A1A1A;
  background-size: cover;
  background-position: center top;
  border-top: 1px solid #B6A15F;
  display: flex;
  flex-direction: column;
  padding-top: 300px;
}

.s5-rubrik {
  font-size: 18px;
  color: #B6A15F;
  letter-spacing: 6px;
  text-align: left;
  padding-left: 30px;
}

.padding {
  display: block;
  padding-left: 30px;
}

.step-box-wrapper {
  display: flex;
  flex-direction: column;
  padding-top: 80px;
  padding-left: 0px;
  gap: 75px;
}
.step-box {
  display: flex;
  flex-direction: column;
}

.step {
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.letter {
  margin-top: 0px;
  width: 100%;
  max-width: 100px;   /* <- DU styr maxbredd här */
  height: auto;       /* <- behåller rätt ratio */
  display: block;
}

.scroll-open{
  margin-top: 0px;
  margin-left: 0px;
  width: 100%;
  max-width: 100px;   /* <- DU styr maxbredd här */
  height: auto;       /* <- behåller rätt ratio */
  display: block;
}

.glas{
  margin-top: 0px;
  width: 100%;
  max-width: 100px;   /* <- DU styr maxbredd här */
  height: auto;       /* <- behåller rätt ratio */
  display: block;
}

.gloves{
  margin-top: 0px;
  width: 100%;
  max-width: 100px;   /* <- DU styr maxbredd här */
  height: auto;       /* <- behåller rätt ratio */
  display: block;
}


.h3-step-box {
  font-size: 26px;
  color: #B6A15F;
  letter-spacing: 1px;
}

.p-step-box {
  font-size: 16px;
  color: #e8d6b2;
  padding-bottom: 30px;
  padding-left: 35px;
  padding-right:35px;
  padding-top: 35px;
}

.kontakt-info {
  font-size: 22px;
  font-weight: bold;
  color: #e8d6b2;
  line-height: 40px;
}

.kontakt-info a {
  text-decoration: none;
  font-weight: bold;
  color: #B6A15F;
}

.kontakt-offert-wrapper {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding-top: 25px;
  margin-left: -25px;
}

.kontakt-delare {
  border: none;
  height: 1px;
  width: 85%;
  margin: 50px auto;

  background: linear-gradient(
    to right,
    transparent,
    #8FAE85,
    #B6A15F,
    #8FAE85,
    transparent
  );
}

.lista {
  padding-left: 35px;
}

.lista summary {
  color: #e8d6b2;
  cursor: pointer;
}

.lista ul {
  padding-left: 20px;
  color: #e8d6b2;
}

.lista ul p {
  color: #e8d6b2;
}

/* Sektion 6 - flexbox med kolumnsortering (vertikal), guldig toppborder */

.sektion-6 {
  flex-direction: column;
  background-color: #1A1A1A;
  border-top: 1px solid #B6A15F;
  display: flex;
  padding-top: 120px;
  padding-bottom: 80px;
  width: 100%;
  gap: 50px;
  align-items: center;
}

.s6-rubrik {
  font-size: 18px;
  color: #B6A15F;
  letter-spacing: 6px;
  text-align: left;
  z-index: 2;
}

.s6-rubrik-wrapper {
  display: flex;
  gap: 25px;
  flex-direction: column;
  padding-left: 25px;
  padding-right: 25px;
}

.s6-rubrik-wrapper p {
  color: white;
  font-size: 24px;
  font-weight: bold;
  z-index: 2;
}

/* Karusell */
.s6-karusell-container {
  position: relative;
  width: 100%;
  overflow: hidden;
}

.s6-karusell-container::before,
.s6-karusell-container::after {
  content: '';
  position: absolute;
  top: 0;
  bottom: 0;
  width: 30px;
  z-index: 2;
  pointer-events: none;
}

.s6-karusell-container::before {
  left: 0;
  background: linear-gradient(to right, #1A1A1A, transparent);
}

.s6-karusell-container::after {
  right: 0;
  background: linear-gradient(to left, #1A1A1A, transparent);
}

.s6-karusell {
  display: flex;
  gap: 16px;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scroll-padding-inline: 5%;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  padding: 0 5%;
}


.s6-karusell::-webkit-scrollbar {
  display: none;
}

.s6-kort {
  flex: 0 0 90%;
  scroll-snap-align: center;
  scroll-snap-stop: always;
  display: flex;
  flex-direction: column;
  gap: 20px;
  padding: 30px 25px;
  border: 1px solid #B6A15F;
  border-radius: 16px;
  background: linear-gradient(160deg, #252525 0%, #1A1A1A 100%);
}

/* Swipe-indikator prickar */
.s6-dots {
  display: flex;
  justify-content: center;
  gap: 8px;
  padding-top: 20px;
  padding-bottom: 10px;  /* plats för aktiva prickens scale(1.3) inom overflow:hidden-containern */
}

.s6-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: rgba(182, 161, 95, 0.3);
  transition: background 0.3s, transform 0.3s;
}

.s6-dot.active {
  background: #B6A15F;
  transform: scale(1.3);
}

/* Bläddringsknappar (skapas av karusell.js, visas på desktop) */
.s6-nav {
  position: absolute;
  top: 46%;
  transform: translate(-50%, -50%);
  z-index: 4;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  border: 1px solid rgba(182, 161, 95, 0.6);
  background: rgba(26, 26, 26, 0.9);
  color: #B6A15F;
  font-size: 30px;
  line-height: 1;
  cursor: pointer;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 0;
  font-family: inherit;
  transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}
.s6-nav:hover,
.s6-nav:focus-visible {
  background: rgba(182, 161, 95, 0.18);
  border-color: #B6A15F;
  color: #E2C879;
  outline: none;
}
/* Pilarna sitter i gapet mellan center-kortet (28,5–71,5%) och grannkorten */
.s6-nav-prev { left: 25%; }
.s6-nav-next { left: 75%; }

.s6-kort h3 {
  font-size: 22px;
  font-weight: 400;
  color: #B6A15F;
}

.s6-kort p {
  color: #f0e3c4;
  font-size: 16px;
  line-height: 1.8;
}

.s6-kort li {
  font-size: 16px;
  color: #8FAE85;
  line-height: 1.7;
}




.sektion-7 {
  width: 100%;
  min-height: 890px;
  padding-top: 120px;
  background-color: #131313;
  background-image: url('Bilder/Sverigekarta-tall3.webp');
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center bottom;
  border-top: 1px solid #B6A15F;
  display: flex;
  flex-direction: column;

}

.map-box {
  margin-top: 10px;
  padding-top: 20px;
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  height: 580px;
  border: 0px solid #B6A15F;
}

.stad-box {
  width: 100%;
  padding-top: 25px;
}

.stader-left {
  padding-left: 35px;
  line-height: 38px;
  font-size: 20px;
  color: #8FAE85;
}

.stader-right{
  list-style: none;
  padding-top: 15px;
  padding-right: 25px;
  line-height: 38px;
  font-size: 20px;
  color: #8FAE85;

  /* detta gör att listan ligger på höger sida */
  margin-left: auto;
  width: fit-content;
}

.stader-right li{
  position: relative;
  padding-left: 18px; /* plats för punkten */
  text-align: left;   /* viktigt: texten vänster i sin egen lilla box */
}

.stader-right li::before{
  content: "\2022";
  position: absolute;
  left: 0;
  top: 0;
  color: #8FAE85;
  font-size: 22px;   /* SAMMA som texten */
  line-height: 38px; /* matchar listan */
}

.box-center{
  display: flex;
  flex-direction: column;
  width: 100%;
  height: auto;
  align-items: center;
  padding-top: 20px;
}

.sektion-karta {
  width: 100%;
  background-color: #131313;
  border-top: 1px solid #B6A15F;
  padding: 120px 0 0;
  display: flex;
  flex-direction: column;
  gap: 32px;
}

.sektion-karta .karta-info {
  padding: 0 25px;
  display: flex;
  flex-direction: column;
  gap: 18px;
}

.karta-adress {
  font-style: normal;
  color: #f0e3c4;
  font-size: 18px;
  line-height: 1.7;
  font-family: 'Lora', serif;
}

.karta-adress strong {
  color: #B6A15F;
  font-weight: 600;
  letter-spacing: 1px;
}

.karta-link {
  color: #B6A15F;
  text-decoration: none;
  font-size: 16px;
  letter-spacing: 3px;
  align-self: flex-start;
  border-bottom: 1px solid #B6A15F;
  padding-bottom: 4px;
  text-transform: uppercase;
}

.karta-facade {
  position: relative;
  width: 100%;
  height: 340px;
  background-color: #1a1a1a;
  background-image:
    radial-gradient(ellipse at 50% 55%, rgba(182,161,95,.12) 0%, transparent 60%),
    repeating-linear-gradient(0deg, rgba(240,227,196,.04) 0 1px, transparent 1px 56px),
    repeating-linear-gradient(90deg, rgba(240,227,196,.04) 0 1px, transparent 1px 56px);
  border-top: 1px solid #B6A15F;
  overflow: hidden;
}

.karta-iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
  display: block;
}

.karta-facade-inner {
  position: absolute;
  inset: 0;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 18px;
  padding: 24px;
  text-align: center;
  pointer-events: none;
  transition: opacity .3s ease;
}

.karta-facade.is-loaded .karta-facade-inner {
  opacity: 0;
}

.karta-pin {
  display: block;
  width: 36px;
  height: 36px;
  background: #B6A15F;
  border-radius: 50% 50% 50% 0;
  transform: rotate(-45deg);
  box-shadow: 0 8px 22px rgba(0,0,0,.6);
  position: relative;
}

.karta-pin::after {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  width: 12px;
  height: 12px;
  background: #131313;
  border-radius: 50%;
  transform: translate(-50%,-50%);
}

.karta-placeholder-text {
  color: #f0e3c4;
  font-size: 15px;
  font-weight: 600;
  letter-spacing: 2px;
  font-family: 'Lora', serif;
}

@media (min-width: 768px) {
  .sektion-karta {
    padding: 140px 0 0;
    gap: 40px;
  }
  .sektion-karta .karta-info {
    padding: 0 60px;
  }
  .karta-facade {
    height: 460px;
  }
  .karta-placeholder-text {
    font-size: 16px;
  }
}

@media (min-width: 1024px) {
  .sektion-karta {
    padding: 160px 0 0;
    gap: 50px;
  }
  .sektion-karta .s6-rubrik-wrapper {
    max-width: 980px;
    margin: 0 auto;
    width: 100%;
    padding-left: 0;
    padding-right: 0;
  }
  .sektion-karta .karta-info {
    max-width: 980px;
    margin: 0 auto;
    padding: 0;
    width: 100%;
    flex-direction: row;
    align-items: flex-end;
    justify-content: space-between;
    gap: 24px;
  }
  .karta-facade {
    height: 520px;
  }
  .karta-adress {
    font-size: 20px;
  }
}

.sektion-8 {
  width: 100%;
  height: 250px;
  padding-top: 50px;
  background-color: #131313;
}

.end {
  width:30%;
  color: #B6A15F;
  border: 1px solid;
  display: block;
  margin: 0 auto;
}

.h2-end {
  font-size: 42px;
  color: #B6A15F;
  text-align: center;
}

.fe-hp{
  position:absolute !important;
  left:-9999px !important;
  width:1px;
  height:1px;
  overflow:hidden;
}

.fe-thankyou-toast{
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, calc(-50% + 20px));
  width: min(92vw, 420px);
  background: rgba(26, 26, 26, 0.96);
  color: #fff;
  border: 1px solid rgba(182, 161, 95, 0.45);
  border-radius: 16px;
  padding: 18px 20px;
  box-shadow: 0 20px 60px rgba(0,0,0,.55);
  z-index: 100000;
  opacity: 0;
  pointer-events: none;
  transition: opacity 260ms ease, transform 260ms ease;
  text-align: center;
}

.fe-thankyou-toast.is-visible{
  opacity: 1;
  transform: translate(-50%, -50%);
}

.fe-thankyou-toast__title{
  font-weight: 700;
  color: #B6A15F;
  margin-bottom: 6px;
  font-size: 16px;
}

.fe-thankyou-toast__text{
  font-size: 14px;
  line-height: 1.45;
}

/* =========================
   FOOTER (Premium, clean)
   ========================= */

.site-footer{
  background: #0f0f0f;
  border-top: 1px solid #B6A15F;
  color: #e6d7b0;
  padding-top: 60px;
}

.footer-inner{
  max-width: 1100px;
  margin: 0 auto;
  padding: 40px 16px 24px;
  display: grid;
  grid-template-columns: 1fr;
  gap: 26px;
}

.footer-title{
  color: #B6A15F;
  font-weight: 700;
  letter-spacing: 2px;
  font-size: 16px;
  margin-bottom: 12px;
  text-transform: uppercase;
}

.footer-text{
  margin: 0 0 16px;
  line-height: 1.6;
  color: rgba(230, 215, 176, 0.90);
}

.footer-contact{
  line-height: 1.8;
}

.footer-address{
  font-style: normal;
  margin-top: 14px;
  line-height: 1.6;
  color: rgba(230, 215, 176, 0.90);
  font-size: 15px;
}

.footer-link{
  color: rgba(230, 215, 176, 0.92);
  text-decoration: none;
}

.footer-link:hover{
  color: #ffffff;
  text-decoration: underline;
}

.footer-nav{
  display: grid;
  gap: 10px;
}

.footer-list{
  list-style: none;
  padding: 0;
  margin: 0 0 14px;
  display: grid;
  gap: 10px;
  color: rgba(230, 215, 176, 0.90);
}

.footer-list li{
  position: relative;
  padding-left: 14px;
}

.footer-list li::before{
  content: "";
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #B6A15F;
  position: absolute;
  left: 0;
  top: 8px;
}

.footer-org{
  color: rgba(230, 215, 176, 0.85);
  font-size: 14px;
}

.footer-muted{
  color: rgba(230, 215, 176, 0.70);
}

.footer-bottom{
  border-top: 1px solid rgba(182, 161, 95, 0.35);
  padding: 18px 16px 22px;
  max-width: 1100px;
  margin: 0 auto;
  display: grid;
  gap: 10px;
  text-align: center;
}

.footer-areas{
  color: rgba(230, 215, 176, 0.75);
  font-size: 13px;
  line-height: 1.4;
}

.footer-copy{
  color: rgba(230, 215, 176, 0.65);
  font-size: 12px;
}

/* Desktop layout */
@media (min-width: 900px){
  .footer-inner{
    grid-template-columns: 1.4fr 1fr 1fr;
    gap: 40px;
    padding: 52px 20px 28px;
  }

  .footer-bottom{
    grid-template-columns: 1fr 1fr;
    text-align: left;
    align-items: center;
  }

  .footer-copy{
    text-align: right;
  }
}

/* =========================
   Responsive: surfplatta & desktop
   Mobil är baseline (default)
   ========================= */

@media (min-width: 768px) {
  .sektion-3 { padding: 120px 60px 40px 60px; }
  .rubrik-sektion-3 { font-size: 20px; }
  .underrubrik-sektion-x { font-size: 34px; }

  .sektion-4 { justify-content: center; }
  .kolumn-container {
    height: auto;
    margin: 0;
    padding: 120px 30px 80px 30px;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
    gap: 40px;
    max-width: 1100px;
  }
  .kolumn { width: 340px; height: 320px; box-sizing: border-box; }
  .kolumn--reviews { height: 540px; }
  .sektion-4 { min-height: 1150px; }

  .sektion-5 { padding-top: 220px; padding-bottom: 120px; }
  .s5-rubrik-wrapper { max-width: 980px; margin: 0 auto; }
  .h3-step-box { font-size: 34px; }
  .p-step-box { font-size: 18px; }
  .kontakt-info { font-size: 24px; }

  /* Samla rubriker + steg i en centrerad kolumn — text fortsatt vänsterställd inuti,
     så vänsterkanten matchar de centrerade step-rubrikerna/ikonerna/knapparna */
  .sektion-5 .s5-rubrik,
  .sektion-5 .underrubrik-sektion-x,
  .sektion-5 .step-box-wrapper {
    width: 100%;
    max-width: 720px;
    margin-left: auto;
    margin-right: auto;
  }

  .sektion-6 { padding-top: 140px; padding-bottom: 90px; }
  .s6-rubrik-wrapper { max-width: 980px; margin: 0 auto; }
  .s6-rubrik-wrapper p { font-size: 28px; }
  /* Ett centrerat kort i taget (som mobil) — grannarna tittar fram i kanterna */
  .s6-karusell-container { max-width: 920px; margin: 70px auto 0; }
  .s6-karusell { padding: 0; gap: 60px; }   /* ingen %-padding; horisontellt gap 60px */
  .s6-kort {
    flex: 0 0 43%;          /* center-kort 43% + gap 60 → ~50% av grannkorten syns på vardera sida */
    padding: 60px 44px 48px;/* konsekvent topp-luft (60px) på ALLA kort */
    gap: 26px;
    justify-content: flex-start; /* topp-justerat → samma rubrik-position; höjd växer nedåt */
    /* ingen min-height → align-items:stretch ger alla kort höjden av det kort med mest text */
  }
  /* Fade: inre ~30% av grannkortet skarpt, tonar ut 30→50% till helt fade vid ytterkanten.
     Bredd ≈ 20% av kortet (43% × 20% ≈ 8,6% av stagen) */
  .s6-karusell-container::before,
  .s6-karusell-container::after { width: 9%; }
  .s6-nav { display: flex; }
  /* Större guldprickar på desktop */
  .s6-dots { padding-top: 30px; gap: 12px; }
  .s6-dot { width: 12px; height: 12px; }
  .s6-kort h3 { font-size: 30px; }
  .s6-kort p,
  .s6-kort li { font-size: 18px; }

  .sektion-7 { padding-top: 80px; }
  .map-box { height: 620px; }
  .stader { font-size: 22px; padding-left: 80px; }
}

@media (min-width: 1024px) {
  .sektion-3 { padding: 140px 90px 60px 90px; align-items: center; }
  .rubrik-sektion-3 { font-size: 22px; width: 700px; margin-right: 200px; }
  .underrubrik-sektion-x { font-size: 32px; max-width: 700px; width: 100%; margin-right: 200px; }
  .sektion-3 .text-box-3 { max-width: 700px; width: 100%; margin-right: 200px; }
  .punktlista-guld { margin-left: 40px; }

  .sektion-4 { min-height: 1000px; }
  .kolumn-container { padding: 0 30px; margin-top: -57px; gap: 60px; align-content: flex-start; }

  .sektion-5 { min-height: 2200px; }
  .step-box-wrapper { gap: 80px; }

  /* Sektion-6: TRE hela tjänstkort i bredd, pilarna i ytterkanterna (desktop) */
  .s6-karusell-container { max-width: 1240px; margin: 70px auto 0; padding: 0 72px; }
  .s6-karusell { gap: 28px; }
  .s6-kort {
    flex: 0 0 calc((100% - 56px) / 3);  /* 3 kort + 2×28px gap = exakt full bredd → 3 hela kort syns */
    padding: 40px 32px;
    gap: 20px;
  }
  /* Inga fade-kanter på desktop — korten ska visas HELT */
  .s6-karusell-container::before,
  .s6-karusell-container::after { width: 0; }
  /* Pilarna ut i ytterkanterna (utanför de två yttre korten, i sid-paddingen) */
  .s6-nav { transform: translateY(-50%); top: 50%; }
  .s6-nav-prev { left: 12px; right: auto; }
  .s6-nav-next { left: auto; right: 12px; }
  .s6-kort h3 { font-size: 26px; }

  /* Sektion-7 desktop: större centrerad karta + städerna precis intill till vänster/höger */
  .sektion-7 {
    min-height: 1280px;
    padding-left: 60px;
    padding-right: 60px;
    background-size: auto 1000px;       /* stor karta: ~1000px hög, ~480px bred */
    background-position: center 160px;  /* under rubriken */
  }
  .map-box {
    height: auto;
    min-height: 1100px;
    padding-top: 40px;
    display: grid;
    grid-template-columns: 1fr 500px 1fr;  /* mittkolumn ≈ kartbredd */
    grid-template-rows: auto auto auto;
    align-items: center;
    column-gap: 12px;
  }
  .map-box > .stad-box { width: auto; padding-top: 0; }
  .map-box > .stad-box:nth-child(1) { grid-column: 1; grid-row: 1; justify-self: end; align-self: end; }
  .map-box > .stad-box:nth-child(3) { grid-column: 1; grid-row: 2; justify-self: end; align-self: start; margin-top: 40px; }
  .map-box > .stad-box:nth-child(2) { grid-column: 3; grid-row: 1 / 3; justify-self: start; align-self: center; }
  .map-box > .box-center { grid-column: 1 / -1; grid-row: 3; margin-top: 30px; }
  .map-box .stader-left { padding-left: 0; }
  .map-box .stader-right { margin-left: 0; padding-right: 0; padding-top: 0; }
}

/* Bred desktop: 3 kort på rad, recensions-kortet centrerat under på ~70% bredd */
@media (min-width: 1200px) {
  .sektion-4 { min-height: 1030px; }
  .kolumn-container {
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
    align-items: flex-start;
    align-content: flex-start;
    gap: 40px;
    max-width: 1160px;
    margin-top: -57px;
    padding: 0 30px;
  }
  .kolumn { width: 340px; height: 320px; }

  /* Byt plats kort 1↔2: Trygghet till vänster, lastbilen i mitten (desktop) */
  .kolumn-container > .kolumn:nth-child(2) { order: 1; }  /* Trygghet */
  .kolumn-container > .kolumn--bild         { order: 2; }  /* lastbild → mitten */
  .kolumn-container > .kolumn:nth-child(3)  { order: 3; }  /* Fina recensioner */
  .kolumn-container > .kolumn--reviews      { order: 4; }  /* recensioner under */

  .kolumn--reviews {
    width: 770px;        /* ~70% av de tre kortens totala bredd (3×340 + 2×40 = 1100) */
    max-width: 770px;
    height: 620px;
    padding: 44px;       /* mer luft i kortet */
    margin: 0 auto;      /* centrerat under de tre korten */
  }

  /* Allt i recensions-kortet lite större (proportionerna bevarade) */
  .kolumn--reviews h3 { font-size: 26px; margin-bottom: 16px; }
  .kolumn--reviews .review-stars { font-size: 24px; letter-spacing: 4px; margin-bottom: 10px; }
  .kolumn--reviews .review-text { font-size: 19px; line-height: 1.5; margin-bottom: 12px; }
  .kolumn--reviews .review-name { font-size: 19px; }
  .kolumn--reviews .review-date { font-size: 14px; margin-top: 6px; }
  .kolumn--reviews .review-source-icon { width: 18px; height: 18px; }
  .kolumn--reviews .review-slide { padding: 10px 10px 66px; }
  .kolumn--reviews .review-nav button { width: 38px; height: 38px; font-size: 22px; }
  .kolumn--reviews .review-counter { font-size: 14px; }
}


.kolumn-list {
  list-style: none;
  padding-left: 0;
  margin: 0 auto;          /* håll blocket centrerat i kortet */
  width: fit-content;      /* blocket bara så brett som innehållet */
  text-align: left;        /* texten vänsterställd */
}
.kolumn-list li {
  color: #e8d6b2;
  margin: 14px 0;          /* mer luft mellan raderna (var 6px) */
  position: relative;
  padding-left: 16px;      /* plats för punkten precis innan texten */
}
.kolumn-list li::before {
  content: "\2022";        /* guldpunkt */
  position: absolute;
  left: 0;
  top: -1px;
  color: #B6A15F;
  font-size: 18px;
  line-height: inherit;
}

.rating-gold { color: #B6A15F; font-weight: 700; }
.brand-google,
.brand-facebook {
  text-decoration: none;
  font-weight: 700;
  letter-spacing: .3px;
}
.brand-google:hover,
.brand-facebook:hover { text-decoration: underline; }
.brand-facebook { color: #1877F2; }
.brand-google span:nth-child(1) { color: #4285F4; }
.brand-google span:nth-child(2) { color: #EA4335; }
.brand-google span:nth-child(3) { color: #FBBC05; }
.brand-google span:nth-child(4) { color: #4285F4; }
.brand-google span:nth-child(5) { color: #34A853; }
.brand-google span:nth-child(6) { color: #EA4335; }
.tjanst-list { padding-left: 20px; margin: 0; display: flex; flex-direction: column; gap: 10px; }
.tjanst-list li { margin-left: 0; color: #8FAE85; }

/* Recensionskarusell */
.review-carousel{
  position:relative;
  width:100%;
  height:100%;
  overflow:hidden;
}
.review-slide{
  position:absolute;
  inset:0;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
  padding:8px 8px 56px;
  opacity:0;
  pointer-events:none;
  transition:opacity .6s ease;
}
.review-carousel.is-visible .review-slide.is-active{
  opacity:1;
  pointer-events:auto;
}
.review-nav{
  position:absolute;
  bottom:6px;
  left:0;
  right:0;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:18px;
  pointer-events:none;
  z-index:2;
}
.review-nav button{
  pointer-events:auto;
  background:transparent;
  border:1px solid rgba(182,161,95,.5);
  color:#B6A15F;
  width:30px;
  height:30px;
  border-radius:50%;
  cursor:pointer;
  font-size:18px;
  line-height:1;
  padding:0;
  display:grid;
  place-items:center;
  transition:background .15s ease, border-color .15s ease;
  font-family:inherit;
}
.review-nav button:hover,
.review-nav button:focus-visible{
  background:rgba(182,161,95,.15);
  border-color:#B6A15F;
  outline:none;
}
.review-counter{
  color:rgba(255,255,255,.55);
  font-size:12px;
  min-width:50px;
  text-align:center;
  letter-spacing:1px;
}
.kolumn--reviews{
  height:540px;
  flex-shrink:0;
  display:flex;
  flex-direction:column;
}
.kolumn--reviews h3{
  margin:0 0 12px;
  flex-shrink:0;
}
.kolumn--reviews .review-carousel{
  flex:1;
  min-height:0;
}

.fe-kontakt{
  transition:opacity .2s ease;
}
body.menu-open .fe-kontakt,
body.menu-open .fe-kontakt .fe-tab,
body.menu-open .fe-kontakt .fe-panel{
  opacity:0;
  pointer-events:none;
}
.review-stars{
  color:#B6A15F;
  font-size:18px;
  letter-spacing:3px;
  margin-bottom:6px;
}
.review-text{
  font-size:14px;
  line-height:1.4;
  color:rgba(255,255,255,.85);
  font-style:italic;
  margin:0 0 8px;
}
.review-meta{
  display:inline-flex;
  align-items:center;
  gap:6px;
  text-decoration:none;
  color:inherit;
}
.review-meta:hover .review-name{
  text-decoration:underline;
}
.review-source-icon{
  width:14px;
  height:14px;
  flex-shrink:0;
}
.review-name{
  color:#fff;
}
.review-date{
  display:block;
  font-size:12px;
  color:rgba(255,255,255,.6);
  margin-top:4px;
}
.review-name{
  font-size:14px;
  color:#B6A15F;
  font-weight:600;
  letter-spacing:.5px;
}
.review-date{
  font-size:11px;
  color:rgba(255,255,255,.45);
  margin-top:4px;
}