* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    /* font-family: Poppins, sans-serif !important; */
}

*,
 ::after,
 ::before {
    --tw-border-spacing-x: 0;
    --tw-border-spacing-y: 0;
    --tw-translate-x: 0;
    --tw-translate-y: 0;
    --tw-rotate: 0;
    --tw-skew-x: 0;
    --tw-skew-y: 0;
    --tw-scale-x: 1;
    --tw-scale-y: 1;
    --tw-scroll-snap-strictness: proximity;
    --tw-ring-offset-width: 0px;
    --tw-ring-offset-color: #fff;
    --tw-ring-color: rgb(59 130 246 / 0.5);
    --tw-ring-offset-shadow: 0 0 #0000;
    --tw-ring-shadow: 0 0 #0000;
    --tw-shadow: 0 0 #0000;
    --tw-shadow-colored: 0 0 #0000;
    border-width: 0;
    border-style: solid;
    border-color: #e5e7eb;
}

.dark h1,
.dark h2,
.dark h3,
.dark h4,
.dark h5,
.dark a {
    color: #fff !important
}

h2 {
    font-size: .875rem;
    line-height: 1.25rem;
    font-weight: 500;
    --tw-text-opacity: 1;
    margin-bottom: 1.5rem;
}

p {
    margin-bottom: 1.5rem;
    font-size: 1rem;
    font-weight: 500;
    line-height: 1.75rem;
}

.dark p {
    color: rgb(167 169 190 / 1);
}

.font-medium {
    font-weight: 500;
}

.font-1 {
    font-family: Poppins, sans-serif;
}

.flex {
    display: flex;
}

.w-6 {
    width: 1.5rem;
}

.h-6 {
    height: 1.5rem;
}

.mb-6 {
    margin-bottom: 1.5rem;
}

.duration-300 {
    transition-duration: .3s;
}

.text-gray-4 {
    color: rgb(51 65 85 / 1);
}

.leading-lh-2 {
    line-height: 1.125rem;
}

.font-bold {
    font-weight: 700;
}

.w-full {
    width: 100%;
}

.z-30 {
    z-index: 30;
}

.left-0 {
    left: 0;
}

.top-0 {
    top: 0;
}

.sticky {
    position: sticky;
}

.fixed {
    position: fixed;
}

.dark .dark\:opacity-0 {
    opacity: 0;
}

.dark .dark\:opacity-100 {
    opacity: 1;
}

.bg-1 {
    background-image: -webkit-linear-gradient(288.85deg, rgba(254, 252, 247, .4) 12.73%, rgba(243, 227, 214, .4) 72.95%);
    background-image: linear-gradient(161.15deg, rgba(254, 252, 247, .4) 12.73%, rgba(243, 227, 214, .4) 72.95%);
}

.bg-2 {
    background-image: -webkit-linear-gradient(288.85deg, rgba(41, 37, 36, .4) 12.73%, rgba(68, 64, 60, .4) 72.95%);
    background-image: linear-gradient(161.15deg, rgba(41, 37, 36, .4) 12.73%, rgba(68, 64, 60, .4) 72.95%);
}

.bg-gray-14 {
    background-color: rgb(10 9 19 / 1);
}

.inset-0 {
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
}

.dark .dark\:border-gray-10 {
    border-color: rgb(23 22 28 / 1);
}

.px-4 {
    padding-left: 1rem;
    padding-right: 1rem;
}

.bg-orange-4 {
    background-color: rgb(254 252 247 / 1);
}

.dark .dark\:bg-gray-14 {
    background-color: rgb(10 9 19 / 1);
}

.px-6 {
    padding-left: 1.5rem;
    padding-right: 1.5rem;
}

.dark .dark\:text-gray-17 {
    color: rgb(167 169 190 / 1) !important;
}

.dark .dark\:bg-gray-13 {
    background-color: rgb(15 14 23 / 1);
}

.dark .dark\:bg-gray-6 {
    background-color: rgb(28 25 23 / 1);
}

.h-12 {
    height: 3rem;
}

.border-b {
    border-bottom-width: 1px;
}

.justify-between {
    justify-content: space-between;
}

.text-3xl {
    font-size: 1.875rem;
    line-height: 2.25rem;
}

.items-center {
    align-items: center;
}

.fill-current {
    fill: currentColor;
    color: #fff;
}

.stroke-current {
    stroke: currentColor;
}

.z-20 {
    z-index: 20;
}

.h-16 {
    height: 4rem;
}

.relative {
    position: relative;
}

.dark .dark\:text-white {
    color: rgb(255 255 255);
}

.text-gray-1 {
    color: rgb(67 64 60 / 1);
}

.filters-popover .text-gray-1 {
    color: rgb(67 64 60 / 1) !important;
}

a {
    transition-duration: .3s;
    text-decoration: inherit;
    color: inherit;
}

audio,
canvas,
embed,
iframe,
img,
object,
svg,
video {
    display: block;
    vertical-align: middle;
}

.h-screen {
    height: 100vh;
}

.inline-flex {
    display: inline-flex;
}

.mb-5 {
    margin-bottom: 1.25rem;
}

.hide-scrollbar {
    -ms-overflow-style: none;
    scrollbar-width: none;
}

.mobile-secondary-sidebar .secondary-sidebar .inner {
    height: 24rem;
    width: 100%;
    border-radius: .25rem;
    border-width: 1px;
    background-color: rgb(254 252 247 / 1);
}

.dark .mobile-secondary-sidebar .secondary-sidebar .inner {
    --tw-bg-opacity: 1;
    background-color: rgb(10 9 19 / var(--tw-bg-opacity));
}

.pb-6 {
    padding-bottom: 1.5rem;
}

.overflow-auto {
    overflow: auto;
}

.flex-col {
    flex-direction: column;
}

.w-80 {
    width: 20rem;
}

.dark .dark\:text-opacity-60 {
    --tw-text-opacity: 0.6;
}

.dark .dark\:text-gray-7 {
    color: rgb(168 162 158 / var(--tw-text-opacity));
}

.leading-none {
    line-height: 1;
}

.text-sm {
    font-size: .875rem;
    line-height: 1.25rem;
}

.bg-gray-5 {
    background-color: rgb(179 176 172 / 1);
}

.h-px {
    height: 1px;
}

.my-4 {
    margin-top: 1rem;
    margin-bottom: 1rem;
}

hr {
    height: 0;
    color: inherit;
    border-top-width: 1px;
}

.border-none {
    border-style: none;
}

.p-2 {
    padding: .5rem;
}

.text-xs {
    font-size: .75rem;
    line-height: 1rem;
}

.pt-2 {
    padding-top: .5rem;
}

.bg-white {
    background-color: rgb(255 255 255 / 1);
}

.gap-x-1\.5 {
    column-gap: .375rem;
}

.border-orange-3 {
    border-color: rgb(246 235 225 /1);
}

.border-l-0 {
    border-left-width: 0;
}

.border-orange-2 {
    --tw-border-opacity: 1;
    border-color: rgb(243 227 214 / var(--tw-border-opacity));
}

.rounded-r {
    border-top-right-radius: .25rem;
    border-bottom-right-radius: .25rem;
}

.py-6 {
    padding-top: 1.5rem;
    padding-bottom: 1.5rem;
}

.px-7 {
    padding-left: 1.75rem;
    padding-right: 1.75rem;
}

.border {
    border-width: 1px;
}

.max-h-max-h-1 {
    max-height: calc(100vh - 200px);
}

.mt-12 {
    margin-top: 3rem;
}

.prose :where(.prose>:last-child):not(:where([class~=not-prose]*)) {
    margin-bottom: 0;
}

.dark .prose :where(.prose>:last-child):not(:where([class~=not-prose]*)) * {
    color: rgb(167 169 190 / 1);
}

.rounded {
    border-radius: .25rem;
}

.text-black {
    --tw-text-opacity: 1;
    color: rgb(0 0 0 / var(--tw-text-opacity));
}

.bg-gray-9 {
    --tw-bg-opacity: 1;
    background-color: rgb(227 230 232 / var(--tw-bg-opacity));
}

.mr-2 {
    margin-right: .5rem;
}

.opacity-0 {
    opacity: 0;
}

.absolute {
    position: absolute;
}

.translate-x-px {
    --tw-translate-x: 1px;
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.ml-auto {
    margin-left: auto;
}

body .mac {
    display: none;
}

.text-opacity-40 {
    --tw-text-opacity: 0.4;
}

.space-x-1>:not([hidden])~:not([hidden]) {
    --tw-space-x-reverse: 0;
    margin-right: calc(.25rem* var(--tw-space-x-reverse));
    margin-left: calc(.25rem* calc(1 - var(--tw-space-x-reverse)));
}

.mt-4 {
    margin-top: 1rem;
}

.mb-12 {
    margin-bottom: 3rem;
}

.mb-1 {
    margin-bottom: .25rem;
}

/* ----- SIDOMENY / MAIN MENU ----- */

.sidebar nav .kg-product-card {
    position: relative;
    margin-bottom: .125rem;
}

.dark .sidebar nav .kg-product-card.active .kg-product-card-container {
    border-color: rgb(61 60 72 / var(--tw-border-opacity));
    background-color: rgb(61 60 72 / var(--tw-bg-opacity));
    color: rgb(229 229 229 / var(--tw-text-opacity));
}

.dark .sidebar nav .kg-product-card .kg-product-card-container {
    color: rgb(229 229 229 / var(--tw-text-opacity));
}

.sidebar nav .kg-product-card.active .kg-product-card-container {
    background-color: rgb(67 64 60 / var(--tw-bg-opacity));
    color: rgb(255 255 255 / var(--tw-text-opacity));
}

.sidebar nav .kg-product-card .kg-product-card-container {
    display: flex;
    align-items: center;
    border-radius: .25rem;
    border-width: 1px;
    border-color: transparent;
    padding: .5rem;
    font-size: .875rem;
    line-height: 1.25rem;
    color: rgb(67 64 60 / var(--tw-text-opacity));
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000),
        var(--tw-ring-shadow, 0 0 #0000),
        var(--tw-shadow);
    transition-duration: .3s;
}

.dark .sidebar nav .kg-product-card .kg-product-card-container .kg-product-card-image {
    filter: brightness(0) invert(1);
    opacity: .5;
}

.sidebar nav .kg-product-card.active .kg-product-card-container .kg-product-card-image {
    filter: brightness(0) invert(1);
}

.sidebar nav .kg-product-card .kg-product-card-container .kg-product-card-image {
    margin-right: .5rem;
    height: 1rem;
    width: 1.25rem;
    object-fit: contain;
    object-position: center;
    transition-duration: .3s;
}

img,
video {
    max-width: 100%;
    height: auto;
}

.flex-1 {
    flex: 1 1 0%;
}

.my-24 {
    margin-top: 6rem;
    margin-bottom: 6rem;
}

.sidebar nav .kg-product-card .kg-product-card-container h4.kg-product-card-title {
    font-family: Poppins, sans-serif;
    font-size: .875rem;
    line-height: 1.25rem;
    font-weight: 500;
}

.sidebar nav .kg-product-card .kg-product-card-container a.kg-product-card-button {
    position: absolute;
    inset: 0;
    opacity: 0;
}

.-translate-x-full {
    --tw-translate-x: -100%;
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

/* Dark mode toggle block */

.dark .color-mode {
    background-color: rgb(15 14 23 / var(--tw-bg-opacity));
}

.color-mode {
    position: relative;
    margin-top: auto;
    display: flex;
    justify-content: space-between;
    border-radius: .25rem;
    background-color: rgb(243 227 214 / var(--tw-bg-opacity));
    --tw-bg-opacity: 0.4;
    padding: .25rem;
    transition-duration: .3s;
    width: 70%;
    margin-right: auto;
    margin-left: auto;
}

.dark .color-mode a {
    color: rgb(255 255 254 / var(--tw-text-opacity));
}

.color-mode a {
    position: relative;
    z-index: 10;
    flex: 1 1 0%;
    border-radius: .25rem;
    padding-top: .375rem;
    padding-bottom: .375rem;
    padding-left: 1.75rem;
    padding-right: 1.75rem;
    font-size: .75rem;
    line-height: 1rem;
    color: rgb(67 64 60 / var(--tw-text-opacity));
    transition-duration: .3s;
}

.dark .color-mode span {
    left: 91px;
    background-color: rgb(61 60 72 / var(--tw-bg-opacity));
}

.color-mode span {
    width: 88px;
    position: absolute;
    top: .25rem;
    left: .25rem;
    z-index: 0;
    height: 1.75rem;
    border-radius: .25rem;
    background-color: rgb(255 255 255 / var(--tw-bg-opacity));
    transition-duration: .3s;
}

.mt-6 {
    margin-top: 1.5rem;
}

.light .fill-current,
.auto .fill-current {
    fill: #000;
}

.backdrop {
    -webkit-backdrop-filter: blur(4px);
    backdrop-filter: blur(4px);
    pointer-events: none;
    visibility: hidden;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 30;
    height: 100%;
    width: 100%;
    background-color: rgb(255 255 255 / var(--tw-bg-opacity));
    --tw-bg-opacity: 0.4;
    opacity: 0;
    transition-duration: .3s;
}

.sidebar-active .sidebar {
    z-index: 40;
    --tw-translate-x: 0px;
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.translate-x-0 {
    --tw-translate-x: 0px;
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.mobile-secondary-sidebar .secondary-sidebar .backdrop {
    pointer-events: none;
    visibility: hidden;
    opacity: 0;
}

.hidden {
    display: none;
}

.-ml-4 {
    margin-left: -1rem;
}

.z-40 {
    z-index: 40;
}

.right-7 {
    right: 1.75rem;
}

.top-14 {
    top: 3.5rem;
}

.mb-4 {
    margin-bottom: 1rem;
}

.-mt-2 {
    margin-top: -.5rem;
}

.-translate-y-1\/2 {
    --tw-translate-y: -50%;
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.dark .text-gray-4,
.dark .text-gray-1 {
    color: #fff;
}

.z-10 {
    z-index: 10;
}

.w-7 {
    width: 1.75rem;
}

.h-7 {
    height: 1.75rem;
}

.dark footer .social-icons svg {
    filter: brightness(0) invert(1);
    opacity: .5;
}

.prose :where(a):not(:where([class~=not-prose]*)) {
    color: var(--tw-prose-links);
    text-decoration: underline;
    font-weight: 500;
}

.right-0\.5 {
    right: .125rem;
}

.top-1\/2 {
    top: 50%;
}

.gap-1 {
    gap: .25rem;
}

.grid-cols-1 {
    grid-template-columns: repeat(1, minmax(0, 1fr));
}

.grid {
    display: grid;
}

.mb-10 {
    margin-bottom: 2.5rem;
}

.grid-cols-4 {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.-mx-2 {
    margin-left: -.5rem;
    margin-right: -.5rem;
}

.mw-660 {
    max-width: 660px;
    margin-left: auto;
    margin-right: auto;
}

.prose {
    position: relative;
    margin-left: auto;
    margin-right: auto;
    max-width: 660px;
    color: rgb(67 64 60 / 1);
}

.filters-popover {
    pointer-events: none;
    visibility: hidden;
    opacity: 0;
}

.pt-1\.5 {
    padding-top: .375rem;
}

.whitespace-nowrap {
    white-space: nowrap;
}

.wrap {
    flex-wrap: wrap;
}

.translate-y-1 {
    --tw-translate-y: 0.25rem;
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.shadow-1 {
    --tw-shadow: 0px 8px 16px rgba(67, 64, 60, 0.08);
    --tw-shadow-colored: 0px 8px 16px var(--tw-shadow-color);
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000),
        var(--tw-ring-shadow, 0 0 #0000),
        var(--tw-shadow);
}

.p-4 {
    padding: 1rem;
}

/* ---- URSPRUNGLIGA LIST-CATEGORY (används ev. på fler ställen) ---- */

.list-category {
    justify-content: space-around;
    flex-wrap: wrap;
    margin-bottom: 25px;
    border: 1px solid;
    padding: 5px;
    background-color: rgb(67 64 60 / 1);
    border-radius: 10px;
}

.dark .list-category {
    background-color: rgb(61 60 72 / 1);
}

.dark .filters-popover a:nth-child(1) {
    color: #A7A9BE;
}

.filters-popover a:nth-child(1):hover {
    color: #000 !important;
}

.filters-popover a:hover {
    color: rgb(255 137 6 / 1) !important;
}

.dark .list-category {
    border: 1px solid #fff;
}

.list-category a {
    padding: 10px;
    height: fit-content;
    color: #fff;
    border-radius: 10px;
}

.filters-popover a.active {
    font-weight: 700;
}

.list-category a.active {
    padding: 10px;
    background-color: #fff;
    border-radius: 10px;
    color: rgb(67 64 60 / 1);
}

.dark .list-category a.active {
    background-color: #fff;
    color: #000;
}

.show-filters-active .backdrop,
.show-filters-active .filters-popover {
    pointer-events: auto;
    visibility: visible;
    opacity: 1;
}

.max-w-max-w-2 {
    max-width: 660px;
}

.mb-14 {
    margin-bottom: 3.5rem;
}

.mx-auto {
    margin-left: auto;
    margin-right: auto;
}

.mobile-secondary-sidebar-active .mobile-secondary-sidebar .secondary-sidebar {
    pointer-events: auto;
    visibility: visible;
    opacity: 1;
}

.mobile-secondary-sidebar .secondary-sidebar {
    pointer-events: none;
    visibility: hidden;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 30;
    margin: 0;
    display: flex;
    width: 100%;
    padding: 0;
    opacity: 0;
    transition-duration: .3s;
}

/* ---- Innehållssida typografi (the-content-side) ---- */

h1 {
    font-size: 2.25rem;
    line-height: 2.5rem;
    color: rgb(67 64 60 / 1);
    margin: 25px 0;
}

.dark .the-content-side h1 {
    color: #FFF;
}

.the-content-side h2 {
    font-size: 2rem;
    line-height: 1.25rem;
    font-weight: 500;
    margin: 25px 0;
    color: rgb(166 162 158 / 1);
}

.the-content-side h3 {
    margin-bottom: 1rem;
    margin-top: 1.5rem;
    font-size: 1.75rem;
    font-weight: 700;
    line-height: 140%;
    margin: 25px 0;
    color: rgb(67 64 60 / 1);
}

.dark .the-content-side h3 {
    color: #fff;
}

.the-content-side h4 {
    font-size: 1.5rem;
    line-height: 1.25rem;
    margin: 25px 0;
    font-weight: 500;
    color: rgb(166 162 158 / 1);
}

.the-content-side h5 {
    margin: 25px 0;
    font-size: 1.25rem;
    line-height: 1.25rem;
    font-weight: 500;
    color: rgb(166 162 158 / 1);
}

.the-content-side h6 {
    font-size: .875rem;
    line-height: 1.25rem;
    margin: 25px 0;
    font-weight: 500;
    color: rgb(166 162 158 / 1);
}

.the-content-side a {
    color: rgb(255 137 6 / 1);
    font-size: 16px;
    font-weight: 500;
    line-height: 28px;
    text-decoration: none;
}

.the-content-side a:hover {
    color: rgb(67 64 60 / 1)
}

.dark .the-content-side a:hover {
    color: rgb(167 169 190 / 1)
}

.the-content-side ul {
    margin-bottom: 1.5rem;
    font-size: 1.25rem;
    font-weight: 500;
    line-height: 1.75rem;
}

.dark ul {
    color: rgb(167 169 190 / 1);
}

.the-content-side li {
    margin-bottom: 1.5rem;
    font-size: 1rem;
    font-weight: 500;
    line-height: 1.75rem;
}

.the-content-side table,
.the-content-side th,
.the-content-side td {
    border: 1px solid black;
}

.dark li {
    color: rgb(167 169 190 / 1);
}

/* gamla nth-child-regler för menyrubriker är kommenterade bort */

/*
#mainMenu .kg-card.kg-product-card:nth-child(1),
#mainMenu .kg-card.kg-product-card:nth-child(3){
	margin-top: 50px;
}
*/

.light #mainMenu .kg-card.kg-product-card:nth-child(1):before{
	color: rgb(67 64 60 / 0.4)
}
.light #mainMenu .kg-card.kg-product-card:nth-child(3):before{
	color: rgb(67 64 60 / 0.4)
}

/*
#mainMenu .kg-card.kg-product-card:nth-child(1):before{
	content: 'Personal';
	...
}
#mainMenu .kg-card.kg-product-card:nth-child(3):before{
	content: 'Business';
	...
}
*/

@media (max-width: 1279px) {
    .backdrop {
        -webkit-backdrop-filter: none;
        backdrop-filter: none;
    }
}

@media (min-width: 1280px) {
    .xl\:opacity-100 {
        opacity: 1;
    }
    .xl\:h-screen {
        height: 100vh;
    }
    .xl\:inline-flex {
        display: inline-flex;
    }
    .xl\:hidden {
        display: none;
    }
    .xl\:bg-1 {
        background-image: -webkit-linear-gradient(288.85deg, rgba(254, 252, 247, .4) 12.73%, rgba(243, 227, 214, .4) 72.95%);
        background-image: linear-gradient(161.15deg, rgba(254, 252, 247, .4) 12.73%, rgba(243, 227, 214, .4) 72.95%);
    }
    .xl\:-translate-x-16 {
        --tw-translate-x: -4rem;
        transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
    }
    .xl\:left-full {
        left: 100%;
    }
    .xl\:right-auto {
        right: auto;
    }
}

@media (min-width: 1024px) {
    .lg\:hidden {
        display: none;
    }
    .lg\:pt-6 {
        padding-top: 1.5rem;
    }
    .lg\:border {
        border-width: 1px;
    }
    .lg\:rounded {
        border-radius: .25rem;
    }
    .lg\:p-2 {
        padding: .5rem;
    }
    .lg\:translate-x-0 {
        --tw-translate-x: 0px;
        transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
    }
    .lg\:sticky {
        position: sticky;
    }
    .lg\:mb-20 {
        margin-bottom: 5rem;
    }
    .lg\:text-4xl {
        font-size: 2.25rem;
        line-height: 2.5rem;
    }
}

/* ------------ SIDOMENY / MENU-LABEL & IKONER ------------ */

/* Spacing before section titles (menu-label) */
.kg-card.menu-label {
    margin-top: 1.5rem;
}

/* Större ikoner i sidomenyn */
.sidebar .kg-product-card-image {
    width: 22px !important;
    height: 22px !important;
    margin-right: 10px;
}

/* Rubriker i sidomenyn – mindre och subtila */
.sidebar #mainMenu .menu-label {
    font-size: 12px;
    opacity: 0.55;
    letter-spacing: 0.5px;
    margin-top: 18px !important;
    margin-bottom: 2px !important;
}

/* Bättre vertikal alignment */
.sidebar .kg-product-card-title {
    line-height: 1.3 !important;
}

/* Clean hover – ingen färg, bara brightness */
.sidebar .kg-product-card:hover {
    filter: brightness(1.2);
}

.sidebar #mainMenu a {
    font-weight: 500 !important;
}

/* Tightare mellan menylänkar */
.sidebar .kg-product-card {
    margin-bottom: 1px !important;
}

/* ---- BLOGG / FILTER UI (ny layout) ---- */

/* Dölj gamla filter-UI för blogg/sekundär sidebar */
.placeholder-filters,
.filters-popover,
.show-filters,
.show-filters2 {
    display: none !important;
}

/* Blogglistans rubrik i secondary sidebar */
.secondary-sidebar h4 {
    text-transform: uppercase;
    letter-spacing: 0.06em;
    font-size: 12px;
    opacity: 0.7;
}

/* BLOGG: layout för filter-knappar – Alla överst, kategorier i 2 kolumner */
.secondary-sidebar .list-category {
    margin-top: 8px !important;
    margin-bottom: 16px !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;

    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 0.75rem;
    row-gap: 0.5rem;
}

/* Gör första chipet (Alla) centrerat överst och lite bredare */
.secondary-sidebar .list-category a:first-child {
    grid-column: 1 / -1;
    justify-self: center;
    min-width: 60%;
}

/* Grundstil – alla chip */
.secondary-sidebar .list-category a {
    font-size: 11px;
    line-height: 1.2;
    padding: 4px 10px;
    border-radius: 999px;
    border: 1px solid rgba(148, 146, 140, 0.65);
    background: transparent !important;
    color: #f5f5f5 !important;
    font-weight: 500;
    white-space: nowrap;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Aktiv kategori (Driva eget / Produktivitet / Verktyg etc) */
.secondary-sidebar .list-category a.bg-gray-10 {
    background: rgba(148, 146, 140, 0.25) !important;
    border-color: rgba(245, 245, 245, 0.9) !important;
}

/* "Alla" när den är aktiv (på /blog) */
.secondary-sidebar .list-category a.bg-orange-2 {
    background: rgba(249, 115, 22, 0.18) !important;
    border-color: #f97316 !important;
    color: #fed7aa !important;
}

/* Hover – lite subtil highlight */
.secondary-sidebar .list-category a:hover {
    background: rgba(148, 146, 140, 0.2) !important;
}

/* --- LIGHT MODE OVERRIDES FÖR BLOGG-CHIPS --- */

.light .secondary-sidebar .list-category a {
    color: #333 !important;
    border-color: rgba(0, 0, 0, 0.25) !important;
    background: transparent !important;
}

.light .secondary-sidebar .list-category a.bg-gray-10 {
    background: rgba(0, 0, 0, 0.06) !important;
    border-color: rgba(0, 0, 0, 0.4) !important;
    color: #111 !important;
}

.light .secondary-sidebar .list-category a.bg-orange-2 {
    background: rgba(249, 115, 22, 0.12) !important;
    border-color: #ea580c !important;
    color: #7c2d12 !important;
}

.light .secondary-sidebar .list-category a:hover {
    background: rgba(0, 0, 0, 0.04) !important;
}

/* ------- FOOTER / KONTAKT ------- */

.fm-footer {
    font-family: inherit;
    line-height: 1.45;
}

.fm-footer a {
    transition: 0.15s ease;
    font-weight: 500;
}

.fm-footer a:hover {
    opacity: 1;
    text-decoration: underline;
}

/* Light mode */
.light .fm-footer {
    color: #393939;
}

.light .fm-footer a {
    color: #111;
}

/* Dark mode */
.dark .fm-footer {
    color: #ddd;
}

.dark .fm-footer a {
    color: #f6f6f6;
}

/* Footer: kontaktlänkar */
.footer-links {
    display: flex;
    gap: 1.5rem;
    margin-bottom: 0.75rem;
    justify-content: center;
}

.footer-link {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

/****************************************
 * FOOTER & TEXTLINKS — ORANGE STYLE
 ****************************************/

/* Footer-länkar – standard + visited */
.footer a,
.footer a:visited {
    color: #f97316 !important;
    text-decoration: none;
    font-weight: 500;
    transition: color 0.2s ease;
}

/* Hover-effekt i footern */
.footer a:hover {
    color: #fb923c !important;
    text-decoration: underline;
}

/* Global styling för länkar i textinnehåll (blogg + sidor) */
.entry-content a,
.entry-content a:visited {
    color: #f97316 !important;
    text-decoration: none;
    font-weight: 500;
}

.entry-content a:hover {
    color: #fb923c !important;
    text-decoration: underline;
}

/* LinkedIn ikon – färga om SVG till orange */
.footer img {
    width: 18px;
    height: 18px;
    filter: brightness(0) saturate(100%) invert(59%) sepia(75%) saturate(3436%) hue-rotate(352deg) brightness(99%) contrast(101%);
    transition: filter 0.2s ease;
}

.footer a:hover img {
    filter: brightness(1.1);
}

/* --------- Tjänster: hero-intro --------- */

.entry-content .lead-services {
    font-size: 1.02rem;
    line-height: 1.6;
    margin-bottom: 1.5rem;
    opacity: 0.9;
}

body:not(.dark) .entry-content .lead-services {
    color: rgb(55 65 81);
}

/* --------- Tjänster: kontaktblock --------- */

.entry-content .services-contact {
    margin-top: 2.5rem;
    padding-top: 1.75rem;
    border-top: 1px solid rgba(148, 146, 140, 0.4);
}

.entry-content .services-contact p {
    margin-bottom: 0.75rem;
}

.entry-content .services-contact-links {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}

.entry-content .services-contact .services-link {
    font-size: 0.9rem;
    text-decoration: none;
    color: #f97316;
    font-weight: 500;
}

.entry-content .services-contact .services-link:hover {
    text-decoration: underline;
}

@media (min-width: 768px) {
    .entry-content .services-contact-links {
        flex-direction: row;
        gap: 1.5rem;
        flex-wrap: wrap;
    }
}

/* Tjänstesidor – lite extra luft och typografi */

.page-template-default .entry-content .lead {
    font-size: 1.05rem;
    opacity: 0.9;
    margin-bottom: 1.75rem;
}

.page-template-default .entry-content h2 {
    margin-top: 3rem;
    margin-bottom: 0.75rem;
}

.page-template-default .entry-content ul {
    margin-bottom: 1.5rem;
}

/* Extra luft under sidans huvudrubrik (t.ex. Tjänster) */
#content .title {
    margin-bottom: 2.5rem;
}

/* --------- SIDOR – RUBRIKER & LISTOR I INNEHÅLL --------- */

/* Gemensam typografi för h2/h3 i sidinnehåll (Tjänster, Guider, Tech & Gear, osv.) */
#content .entry-content h2,
#content .entry-content h3 {
    font-weight: 700;
    margin-top: 2.5rem;
    margin-bottom: 0.75rem;
    line-height: 1.3;
}

/* H2: större underrubrik */
#content .entry-content h2 {
    font-size: 1.5rem;
}

/* H3: något mindre än H2 */
#content .entry-content h3 {
    font-size: 1.25rem;
}

/* Listor under rubriker i sidinnehåll */
#content .entry-content ul {
    margin-top: 0.5rem;
    margin-bottom: 1.5rem;
    padding-left: 1.5rem;
}

#content .entry-content ul li {
    margin-bottom: 0.35rem;
}
/* Justera avstånd från toppen för sidrubriker (Tjänster, Guider, osv.)
   så att de ligger ungefär som "Home" */
#content.hhh {
    margin-top: 4rem !important;   /* tidigare 6rem via .my-24 */
}

/* Lite mer luft på större skärmar om du vill finjustera */
@media (min-width: 1024px) {
    #content.hhh {
        margin-top: 4.5rem !important;
    }
}
/* Light mode – highlight aktiv meny-länk */
.light .sidebar nav .kg-product-card.active .kg-product-card-container {
    border-color: rgba(0, 0, 0, 0.25) !important; /* tunn svart kant */
    background-color: rgba(255, 255, 255, 0.65) !important; /* subtil bakgrund */
    color: #111 !important;
}

/* Light mode – ikonfärg i aktiv */
.light .sidebar nav .kg-product-card.active .kg-product-card-container .kg-product-card-image {
    filter: brightness(0.2) !important; /* gör ikonen mörkare så text+ikon matchar */
}

/* 🌓 Default to DARK MODE */
html:not(.light) {
    background-color: rgb(10 9 19) !important;
    color-scheme: dark !important;
}

/* Se till att dark-klassen alltid sätts om inget annat tema är valt */
html:not(.light):not(.dark) {
    color-scheme: dark !important;
}
/* Storlek på loggan */
.site-logo {
    height: 72px;
    width: auto;
}

/* Dark mode – inverterad + samma storlek */
.dark .site-logo {
    filter: invert(1) brightness(1.2);
    height: 72px;
    width: auto;
}


/* Ökar maxbredd på content-området */
.site-content,
.content-area,
.entry-content {
    max-width: 1200px !important;
    width: 100%;
    margin: 0 auto;
}