.elementor-7988 .elementor-element.elementor-element-2c78402{--display:flex;}.elementor-7988 .elementor-element.elementor-element-20a3cb4{--display:flex;}.elementor-7988 .elementor-element.elementor-element-b6e2b06{--display:flex;}.elementor-7988 .elementor-element.elementor-element-5e6f1ca{--display:flex;}/* Start custom CSS for html, class: .elementor-element-2e1b0c5 */.product-hero{
  padding:80px 20px;
}

.product-wrapper{
  max-width:1200px;
  margin:auto;
  display:grid;
  grid-template-columns:1.2fr 1fr;
  gap:60px;
  align-items:center;

  position:relative;
}


/* IMAGE */

.product-image-box{
  text-align:center;
  display:flex;
  flex-direction:column;
  align-items:center;
}

.main-product-image{
  width:100%;
  transition:opacity .25s ease;
}

.main-product-image.fade{
  opacity:0;
}


/* BUTTON – placerad mellan bild och text */

.product-hero .image-next{

  position:absolute;
  left:calc(40% - 22px);
  bottom:120px;

  width:44px;
  height:44px;

  border-radius:50%;
  border:none;

  font-size:18px;

  display:flex;
  align-items:center;
  justify-content:center;

  cursor:pointer;

  color:#1fa37a !important;

  background:linear-gradient(135deg,#eaf4f1 0%,#dff1eb 100%) !important;

  box-shadow:0 6px 18px rgba(0,0,0,0.08);

  transition:all .25s ease;

  z-index:5;
}


/* PRODUCT INFO */

.product-category{
  color:#1fa37a;
  font-size:12px;
  letter-spacing:2px;
  font-weight:600;
  margin-bottom:10px;
}

.badge{
  background:#1fa37a;
  color:white;
  font-size:10px;
  padding:4px 8px;
  border-radius:12px;
  margin-left:10px;
}

.product-info h1{
  font-size:48px;
  font-weight:300;
  color:#2f3c44;
  margin-bottom:10px;
}

.product-name{
  color:#1fa37a;
  font-weight:500;
  margin-bottom:12px;
}

.divider{
  width:50px;
  height:2px;
  background:#1fa37a;
  margin:12px 0 20px;
}

.product-info p{
  color:#5a6a73;
  line-height:1.7;
  max-width:420px;

  font-family:"Gotham", sans-serif !important;
  font-weight:300 !important;
}


/* TAGS */

.product-tags{
  margin-top:24px;
}

.product-tags span{
  display:inline-block;
  padding:8px 16px;
  margin-right:8px;
  margin-bottom:10px;
  font-size:12px;
  border-radius:20px;

  background:linear-gradient(135deg,#eaf4f1 0%,#dff1eb 100%);
  color:#1fa37a;
  font-weight:500;

  transition:.2s;
}

.product-tags span:hover{
  background:linear-gradient(135deg,#1fa37a 0%,#2bbf93 100%);
  color:white;
  transform:translateY(-1px);
}


/* DOCUMENT BUTTONS */

.product-documents{
  margin-top:28px;
  display:flex;
  flex-wrap:wrap;
  gap:12px;
}

.doc-btn{
  padding:10px 18px;
  border-radius:30px;
  font-size:13px;
  text-decoration:none;
  font-weight:500;
  border:none;

  background:linear-gradient(135deg,#1fa37a,#2bbf93);
  color:#ffffff !important;

  transition:all .25s ease;
}

.doc-btn:hover{
  background:linear-gradient(135deg,#17906c,#25a985);
  transform:translateY(-2px);
  box-shadow:0 8px 18px rgba(31,163,122,0.25);
}

.doc-btn:visited,
.doc-btn:active{
  color:#ffffff !important;
}


/* MOBILE */

@media(max-width:768px){

  .product-wrapper{
    grid-template-columns:1fr;
    gap:30px;
  }

  .product-hero .image-next{
    position:relative;
    left:auto;
    bottom:auto;
    margin:40px auto 0;
  }

  .product-info h1{
    font-size:32px;
  }

  .product-info p{
    max-width:100%;
    font-size:15px;
  }

  .product-tags span{
    font-size:11px;
    padding:6px 12px;
  }

  .product-hero{
    padding:50px 20px;
  }

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-69b59d0 */.product-description {
  padding: 1px 20px 80px;
}

.product-description-container {
  max-width: 900px;
  margin: auto;
}

/* HIGHLIGHT BLOCK */
.description-highlight {
  position: relative;
  padding-left: 28px;

  transition: all 0.35s ease;
}

/* GRADIENT STRECK */
.description-highlight::before {
  content: "";
  position: absolute;
  left: 0;
  top: 4px;
  bottom: 4px;
  width: 4px;

  background: linear-gradient(
    180deg,
    #1fa37a 0%,
    #7fdcc6 100%
  );

  border-radius: 4px;
  transition: all 0.35s ease;
}

/* TEXT — ALLT i blocket */
.description-highlight,
.description-highlight p {
  font-family: "Gotham", sans-serif !important;
  font-weight: 300 !important;
  font-style: normal;
}

.description-highlight p {
  color: #5a6a73;
  line-height: 1.85;
  margin-bottom: 18px;
  font-size: 16px;
  transition: color 0.35s ease;
}

/* =========================
   HOVER ANIMATION
   ========================= */

.description-highlight:hover {
  transform: translateY(-3px);
}

.description-highlight:hover::before {
  box-shadow: 0 0 12px rgba(31,163,122,0.35);
}

.description-highlight:hover p {
  color: #44535c;
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-607d9ae *//* SECTION — full width bakgrund */
.product-specs {
padding: 100px 0;

background-image: url("https://gedoc.se/wp-content/uploads/2026/03/Bakgrund.png") !important;
background-size: cover !important;
background-position: center !important;
background-repeat: no-repeat !important;

/* gör att bakgrunden går ut till viewportens kanter */
width: 100vw;
margin-left: calc(50% - 50vw);
margin-right: calc(50% - 50vw);
}

/* centrerat innehåll */
.specs-wrapper {
max-width: 1100px;
margin: auto;
padding: 0 20px;
display: grid;
grid-template-columns: 1fr 1fr;
gap: 40px;
}

/* CARDS */
.spec-card {
background: #ffffff;
border-radius: 20px;
padding: 36px;
box-shadow: 0 12px 32px rgba(0,0,0,0.05);
border: 1px solid #eef1f2;
}

/* HEADER */
.spec-header {
display: flex;
align-items: center;
gap: 14px;
margin-bottom: 24px;
}

.spec-icon {
width: 44px;
height: 44px;
background: #eaf4f1;
border-radius: 12px;
display: flex;
align-items: center;
justify-content: center;
}

.spec-icon svg {
width: 20px;
height: 20px;
stroke: #1fa37a;
}

.spec-header h3 {
font-size: 20px;
color: #2f3c44;
margin: 0;
}

.spec-header span {
display: block;
font-size: 13px;
color: #7a8a93;
margin-top: 2px;
}

/* LIST */
.spec-list {
list-style: none;
padding: 0;
margin: 0;
}

.spec-list li {
list-style: none;
position: relative;
margin-bottom: 16px;
font-size: 15px;
color: #4d5b63;
padding: 10px 12px 10px 40px;
border-radius: 10px;
transition: background 0.2s ease;
}

/* CHECK ICON */
.spec-list li::before {
content: "✓";
position: absolute;
left: 12px;
top: 50%;
transform: translateY(-50%);
width: 20px;
height: 20px;
background: #eaf4f1;
border-radius: 50%;
color: #1fa37a;
font-size: 12px;
font-weight: bold;
display: flex;
align-items: center;
justify-content: center;
}

/* HOVER EFFECT */
.spec-list li:hover {
background: #eef6f3;
border-left: 3px solid #1fa37a;
}

/* RESPONSIVE */
@media (max-width: 900px) {
.specs-wrapper {
grid-template-columns: 1fr;
}
}
/* Ta bort emoji */
.spec-icon {
font-size: 0;
background-size: 30px;   /* ikonstorlek */
background-position: center;
background-repeat: no-repeat;
}

/* Funktioner ikon */
.spec-card:first-child .spec-icon {
background-image: url("https://gedoc.se/wp-content/uploads/2026/03/Funktioner.png");
}

/* Teknisk kapacitet ikon */
.spec-card:last-child .spec-icon {
background-image: url("https://gedoc.se/wp-content/uploads/2026/03/Tekniskt-kapacitet.png");
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-e9c08bc */:root{
--mint:#2bb58f;
--grid:rgba(43,181,143,.35);
--text:#2a2f33;
--muted:#5b666f;
--bg:#ffffff;
--featured:rgba(43,181,143,.12);
--featured-light:rgba(43,181,143,.06);
}

.compare{
background:var(--bg);
padding:40px 16px;
font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial;
}

.compare__inner{
max-width:1100px;
margin:auto;
}

/* RUBRIKER */

.product-row{
display:grid;
grid-template-columns:24% repeat(4,1fr);
align-items:center;
margin-bottom:20px;
}

.product{
text-align:left;
padding-left:12px;
}

.product__name{
font-size:20px;
color:var(--mint);
font-weight:600;
}

.product__underline{
width:60px;
height:3px;
background:var(--mint);
margin-top:8px;
border-radius:3px;
}

/* TABELL */

.table-wrap{
overflow-x:auto;
}

.spec{
width:100%;
border-collapse:collapse;
table-layout:fixed;
}

.spec th,
.spec td{
padding:14px;
border-bottom:1px solid var(--grid);
border-right:1px solid var(--grid);
}

.spec th{
text-align:left;
color:var(--mint);
width:24%;
font-weight:600;
}

.spec td{
text-align:center;
color:var(--muted);
background:white;
}

/* PRO (ljus markering) */

.spec tbody tr:nth-child(n+2):nth-child(-n+10) td:nth-child(4){
background:var(--featured-light);
}

/* PROXL (mörkare markering) */

.spec tbody tr:nth-child(n+2):nth-child(-n+10) td:nth-child(5){
background:var(--featured);
}/* End custom CSS */