/*
Theme Name: AB Bostäder 2024
Theme URI:
Author: Carrier Pigeon AB
Author URI: https://duva.se
Description: AB Bostäder 2024 är ett blocktema (FSE) för WordPress som är designat av Dotter&Döse och byggt av Duva.
Requires at least: 6.4
Tested up to: 6.4
Requires PHP: 7.0
Version: 1.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: abbostader2024
Tags: full-site-editing, block-patterns, accessibility-ready
*/

:root {
  --color-rod: var(--wp--preset--color--rod);
  --color-gron: var(--wp--preset--color--gron);
  --color-petrol: var(--wp--preset--color--petrol);
  --color-lime: var(--wp--preset--color--lime);
  --color-sand: var(--wp--preset--color--sand);

  --color-special: #008484;
}

.has-special-color {
  color: var(--color-special) !important;
}

/** GENERAL **/

html {
  overflow-x: hidden;
}

body {
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
}

* {
    scroll-margin-top: 180px;
}

*:hover {
  transition: all 0.3s ease;
}

.wp-site-blocks {
  height: 100vh;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

main {
  padding-top: 72px;
  margin: 0;

  .entry-content {
    padding: 0 !important;
  }
}

strong,
b {
  font-weight: 700;
}

iframe {
  max-width: 100%;
  width: 100%;
}

table {
  border: 2px solid transparent;
}

h1,
h2:not(#shortcuts h2),
h3,
h4,
h5,
h6 {
  hyphens: auto;
}

.relative {
  position: relative;
}

.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
  border: 0;
}

.wp-lightbox-overlay * {
  animation: none !important;
  transition: none !important;
}

.wp-block-tiptip-hyperlink-group-block {
  text-decoration: none;
  position: relative;
}

.wp-block-post-featured-image {
  max-height: 500px;
}

.wp-block-boldblocks-breadcrumb-block {
  font-size: var(--wp--preset--font-size--body);

  a {
    text-decoration: none;
  }

  ol {
    line-height: 1.6;
    row-gap: 0;
  }
}

body {
  .is-layout-constrained > .wp-block-image.alignleft,
  .is-layout-constrained > .wp-block-image.alignleft,
  .is-layout-constrained > .alignleft,
  .is-layout-constrained > .alignright {
    width: 50%;
    margin-block-end: 0.937rem !important;
  }
}

.error404 {
  main a:where(:not(.wp-element-button)) {
    color: var(--wp--preset--color--rod);
  }
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

@media (min-width: 730px) {
  body {
    .is-layout-constrained > .wp-block-image.alignleft {
      margin-left: calc(
        (100% - var(--wp--style--global--content-size)) / 2
      ) !important;
      max-width: 375px !important;
    }
    .is-layout-constrained > .wp-block-image.alignright {
      margin-right: calc(
        (100% - var(--wp--style--global--content-size)) / 2
      ) !important;
      max-width: 375px !important;
    }
  }
}

@media (max-width: 1023px) {
  body:not(.search):not(.home) main .is-layout-grid,
  body:not(.search)
    main
    .wp-block-post-template-is-layout-grid.wp-block-post-template-is-layout-grid.wp-block-post-template-is-layout-grid.wp-block-post-template-is-layout-grid {
    grid-template-columns: repeat(auto-fit, minmax(0, 320px)) !important;
    > * {
      min-height: 320px !important;
      max-width: 320px;
    }
  }
  main {
    .wp-block-columns:first-child {
      flex-direction: column !important;
    }
  }
  body:not(.single-bostadsomrade #bostadsomraden):not(
      .page-template-page-bostadsomraden
    )
    main {
    .wp-block-columns:not(.has-sand-50-background-color .wp-block-columns)
      > .wp-block-column {
      flex-basis: auto !important;
    }
  }
}

@media (max-width: 1439px) {
  main {
    .wp-block-cover .wp-block-columns:first-child {
      flex-direction: column !important;
    }

    .wp-block-cover:first-of-type .wp-block-columns {
      .wp-block-column.is-vertically-aligned-bottom {
        align-self: flex-start !important;
        padding-bottom: 1.875rem !important;
        width: auto;
        .wp-block-post-excerpt {
          margin: 0;
        }
      }
      .wp-block-group.is-content-justification-left {
        margin-block-start: 0.5rem !important;
      }
    }
    .wp-block-cover .wp-block-columns:first-of-type .wp-block-image {
      display: none;
    }

    .wp-block-cover__inner-container {
      padding: 0;
    }

    .entry-content {
      .wp-block-heading ~ p {
        margin-block-start: 0;
      }
      * {
        margin-left: 0 !important;
      }
    }
  }
  .error404 {
    main {
      padding-top: 72px !important;
    }
    .wp-block-image img {
      width: 60px !important;
    }
  }
}

@media (min-width: 1440px) {
  main {
    padding-top: 90px;
  }
}

/**************/

/** NOTIFICATIONS PLUGIN **/
#wpfront-notification-bar {
  min-height: 90px;
  padding: 0.3rem 0;
  box-sizing: border-box;
}

#wpfront-notification-bar-table {
  max-width: 1196px;
  margin-left: auto !important;
  margin-right: auto !important;
  width: 100%;

  .wp-element-button {
    height: 2.375rem;
  }
}

#wpfront-notification-bar div.wpfront-message a {
  width: 100%;
  display: block;
  color: inherit;
  text-decoration: none;
}

.wpfront-notification-bar-spacer {
  z-index: 10;
}

.wpfront-div {
  padding: 0 !important;
  .wp-element-button {
    background: transparent;
    border: 2px solid currentColor;
    padding-bottom: calc(0.157rem - 2px);
    padding-left: calc(1.521rem - 2px);
    padding-right: calc(1.521rem - 2px);
    padding-top: calc(0.157rem - 2px);
    white-space: nowrap;
    border-radius: 30px;
  }
}

@media (max-width: 1439px) {
  #wpfront-notification-bar-spacer {
    top: 72px !important;
  }
  #wpfront-notification-bar .wpfront-message ~ div {
    justify-content: flex-end;
    p {
      display: none;
    }
  }

  .wpfront-message {
    display: block !important;
    padding: 0.3rem 0 !important;
    svg {
      display: inline-block !important;
      margin-right: 0.1rem !important;
      margin-bottom: -2px;
      height: 20px;
      width: 20px;
    }
    p {
      display: inline !important;
      line-height: 1.45;
    }
  }

  #wpfront-notification-bar-table {
    padding-left: 5%;
    padding-right: 5%;
    a div > div:first-of-type {
      gap: 6rem !important;
    }
    a div > div div:last-of-type {
      align-items: flex-end !important;
    }
  }

  .wpfront-div .wp-element-button {
    line-height: 1.7;
    margin-bottom: 0.5rem;
  }
}

/** HEADER **/

header {
  height: 72px;
  z-index: 100;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;

  .wp-block-group.wp-container-core-group-layout-2 {
    flex-direction: row-reverse;
  }

  .wp-block-group.wp-container-core-group-layout-3
    > .wp-container-core-group-layout-2 {
    align-items: center;
  }

  > .has-background {
    max-width: 100vw;
  }

  nav.items-justified-right {
    display: none;
  }

  .wp-block-navigation-submenu {
    font-weight: 400;
  }

  .wp-block-navigation__submenu-container.wp-block-navigation-submenu {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }

  .has-modal-open
    .wp-block-navigation__container.is-responsive.wp-block-navigation
    > li
    a {
    font-size: 1.25rem;
  }

  #modal-2-content {
    overflow-x: hidden;
    height: 85vh;
    overflow-y: auto;
    padding-top: 3.125rem !important;

    button[aria-expanded="true"] ~ ul {
      margin-top: 0.875rem !important;
      button[aria-expanded="true"] ~ ul {
        margin-bottom: 0.875rem;
      }
    }
  }

  .wp-block-site-logo {
    position: fixed;
    transform: translateX(-50%);
    left: 50%;
    top: -2px;
    box-shadow: 0px 3px 6px #00000029;
    border-bottom-right-radius: 10px;
    border-bottom-left-radius: 10px;

    a {
      width: 95px;
      padding: 0;
    }
  }

  .wp-block-navigation__responsive-container.is-menu-open
    .wp-block-navigation__responsive-container-content {
    align-items: center;
  }

  .wp-block-navigation ul {
    width: 100%;
    align-items: flex-start;
  }

  .wp-block-navigation__responsive-dialog {
    display: flex;
    justify-content: center;
  }

  .wp-block-navigation-item.wp-block-navigation-link.omoss {
    margin-top: 2rem;
  }

  .wp-block-navigation__responsive-container-content {
    max-width: var(--wp--style--global--content-size);
    width: 100%;
  }

  #translate,
  #searchbtn {
    margin-top: 1.8rem;
  }

  .navigation {
    margin: 0;
    > .wp-block-group:first-of-type {
      display: none;
    }
    .wp-block-buttons {
      flex-wrap: nowrap;
    }

    .wp-block-button__link {
      white-space: nowrap;
    }
  }

  .wp-block-navigation-item.wp-block-navigation-link
    a
    .wp-block-navigation-item__label {
    display: inline-block;
    transition: transform 0.3s ease-out;
  }

  .wp-block-navigation-submenu ul a {
    font-size: var(--wp--preset--font-size--body);
  }

  .wp-block-navigation-submenu__toggle svg,
  .wp-block-pages-list__item.has-child.wp-block-navigation-item.open-on-hover-click
    .wp-block-navigation-submenu__toggle
    svg {
    width: 17px !important;
    height: 17px !important;
    rotate: -90deg;
  }

  .wp-block-navigation-submenu__toggle[aria-expanded="true"] svg,
  .wp-block-pages-list__item.has-child.wp-block-navigation-item.open-on-hover-click
    .wp-block-navigation-submenu__toggle[aria-expanded="true"]
    svg {
    transform: rotate(90deg);
  }

  nav.items-justified-left {
    display: none;
  }

  .wp-block-navigation__submenu-container {
    padding-top: 0 !important;
  }

  .wp-block-buttons {
    margin-top: 1rem;
  }

  .wp-block-navigation__responsive-container-open {
    svg {
      height: 20px;
      width: 27px;
    }
  }

  &.has-petrol-background-color {
    .wp-block-navigation__responsive-container-close {
      svg {
        color: var(--wp--preset--color--turkos) !important;
      }
    }
  }
  &.has-sand-background-color {
    .wp-block-navigation__responsive-container-close {
      svg {
        color: var(--wp--preset--color--svart) !important;
      }
    }
  }
  &.has-rosa-background-color {
    .wp-block-navigation__responsive-container-close {
      svg {
        color: var(--wp--preset--color--rod) !important;
      }
    }
  }
  &.has-gron-background-color {
    .wp-block-navigation__responsive-container-close {
      svg {
        color: var(--wp--preset--color--lime) !important;
      }
    }
  }
}

header
  .has-modal-open
  .wp-block-navigation__container.is-responsive.wp-block-navigation
  > li > a {
  font-weight: 700;
}

.is-menu-open {
  overflow-x: hidden !important;
  z-index: 1;
  &::after {
    content: "";
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100vw;
    max-width: 100%;
    z-index: -1;
    height: 76px;
    background-image: url(../abbostader2024/assets/images/bostader-footer-hq.webp);
    background-size: cover;
    background-position: left bottom 1rem;
    filter: none;
  }
  &.invert-after::after {
    filter: invert(1);
  }
  .wp-block-navigation__responsive-container-close {
    svg {
      width: 43px !important;
      height: 43px !important;
      fill: currentColor;
    }
  }
}

header
  .wp-block-navigation.has-expandable-modal-submenus
  .wp-block-navigation__responsive-container.is-menu-open
  .wp-block-navigation__responsive-container-content
  .wp-block-navigation-item__content,
header
  .wp-block-navigation.has-expandable-modal-submenus
  .wp-block-navigation
  .wp-block-navigation-item__content {
  padding-right: 0 !important;
}

.wp-block-navigation.has-expandable-modal-submenus
  .wp-block-navigation__responsive-container.is-menu-open
  .wp-block-navigation__responsive-container-content
  .wp-block-navigation__submenu-icon {
  display: inline-flex;
  width: 48px;
  height: 25px;
  align-items: center;
  position: relative;
  top: 2px;
}

.wp-block-navigation.has-expandable-modal-submenus
  .wp-block-navigation
  .has-child
  .wp-block-navigation__submenu-container
  > .wp-block-navigation-item
  > .wp-block-navigation-item__content {
  display: inline-flex;
  text-align: left;
  align-items: flex-start;
  justify-content: flex-start !important;
  padding: 0.2rem 0 !important;
}

.wp-block-navigation.has-expandable-modal-submenus
  .wp-block-navigation__responsive-container.is-menu-open
  .wp-block-navigation__responsive-container-content
  .has-child
  .wp-block-navigation__submenu-container {
  gap: 0.5rem;
}

header
  .wp-block-navigation__submenu-container.wp-block-navigation-submenu
  .wp-block-pages-list__item__link.wp-block-navigation-item__content,
header ul.wp-block-navigation-submenu a {
  font-size: var(--wp--preset--font-size--body) !important;
}

header a[aria-current="page"],
.current-menu-item {
  font-weight: 700;
}

#minasidor {
  display: none;
  position: relative;
}

#minasidor a {
  font-weight: 400;
}

#minasidor a:hover {
  background: var(--wp--preset--color--vit) !important;
}

#minasidor-mobile {
  display: flex;
  align-items: center;
}

@media (min-width: 600px) {
  .wp-block-navigation__responsive-container-open:not(.always-shown) {
    display: flex;
  }
  .wp-block-navigation__responsive-container:not(.hidden-by-default):not(
      .is-menu-open
    ) {
    display: none;
  }
}

@media (min-width: 782px) {
  .wp-block-navigation
    .has-child
    .wp-block-navigation__submenu-container
    .wp-block-navigation__submenu-icon
    svg {
    transform: rotate(0);
  }
}

@media (min-width: 1440px) {
  header {
    height: 90px;

    .wp-block-navigation-item.wp-block-navigation-link {
      margin-top: 2.8rem;
    }

    nav.items-justified-left,
    nav.items-justified-right,
    #minasidor {
      display: flex;
    }

    .navigation,
    .wp-block-group.wp-container-core-group-layout-2 {
      flex-direction: row;
    }

    .navigation > .wp-block-group:first-of-type {
      display: flex;
    }

    .has-expandable-modal-submenus,
    .om-oss,
    #minasidor-mobile,
    .navigation .is-content-justification-right {
      display: none !important;
    }

    .wp-block-site-logo {
      flex: none;
    }

    .wp-block-site-logo a {
      width: inherit;
    }

    .wp-block-navigation-item.wp-block-navigation-link a {
      border-bottom: 2px solid transparent;
      line-height: 1.3;
      transition: transform 0.2s ease-out;
    }

    .wp-block-navigation-item.wp-block-navigation-link a:hover {
      border-color: currentColor;
    }

    .wp-block-navigation-item.wp-block-navigation-link
      a:hover
      .wp-block-navigation-item__label {
      transform: translateY(-0.25rem);
    }
  }

  .wp-block-navigation__responsive-container-open:not(.always-shown) {
    display: none !important;
  }
  .wp-block-navigation__responsive-container:not(.hidden-by-default):not(
      .is-menu-open
    ) {
    display: block !important;
  }

  .navigation {
    min-height: 90px;
    width: 100%;
    display: flex;
    justify-content: space-between;
    gap: 1.937rem;
    align-items: flex-start;
  }
}

@media (max-width: 1439px) {
  header {
    .wp-block-navigation
      .wp-block-navigation__responsive-container
      .wp-block-navigation-item__content {
      font-size: var(--wp--preset--font-size--medium-20);
      padding: var(--wp--preset--spacing--10) 0.937rem !important;
      box-sizing: border-box;
      width: 50%;
      text-align: center;
      justify-content: center !important;
    }

    > .has-background {
      padding-left: 8.9% !important;
      padding-right: 8.9% !important;
      margin-top: 1.5rem;
    }

    .wp-block-navigation .wp-block-navigation-item {
      width: 100%;
      align-items: center !important;
    }

    .wp-block-group.is-layout-flex {
      justify-content: space-between;
      gap: 0rem;
    }

    .navigation .wp-block-group {
      gap: 1.75rem;
    }

    .wp-block-group.is-content-justification-left {
      flex-direction: row-reverse;
    }
    .wp-block-buttons-is-layout-flex {
      gap: 0rem;
    }

    #wpfront-notification-bar-spacer {
      top: 72px !important;
    }

    #wpfront-notification-bar {
      min-height: 72px !important;
      height: auto !important;
      padding: 0.3rem 0;
    }

    .navigation {
      align-items: flex-start;
    }

    .wp-block-site-logo {
      background: white;
      height: 117px;
      display: flex;
      align-items: flex-end;
      border-bottom-right-radius: 10px;
      border-bottom-left-radius: 10px;
    }

    #menu-tools {
      .wp-block-group {
        padding-left: unset !important;
      }
      ~ .wp-block-buttons {
        display: none;
      }
    }

    #translate {
      margin-top: 0;
      svg {
        width: 20px;
        height: 20px;
      }
    }
    #searchbtn {
      margin-top: 0;
      svg {
        width: 28px;
        height: 28px;
      }
    }
  }
}

/**************/

/** FRONTPAGE **/

.opacity-60 {
  position: relative;
}

.opacity-60::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.6);
}

#shortcuts .wp-block-tiptip-hyperlink-group-block {
  position: relative;
  transition: transform 0.3s ease-out;
  transform-origin: top left;

  &:hover {
    transform: scale(1.05);
  }

  > .wp-block-group {
    aspect-ratio: 1 / 1;
    display: flex;
    justify-content: center;
    align-items: center;
    max-height: 114px;

    figure img {
      height: auto !important;
    }
  }
}

#news {
  position: relative;
  z-index: 1;
  overflow: hidden;
  width: 100%;
  max-width: var(--wp--style--global--content-size);
  aspect-ratio: 9 / 16;

  > * {
    max-width: 280px;
  }

  &::after {
    content: "";
    background-image: url("../abbostader2024/assets/images/Iphone3.webp");
    background-repeat: no-repeat;
    position: absolute;
    z-index: -1;
    inset: 0px;
    background-size: 325vw;
    background-position: center top;
  }

  .wp-block-tiptip-hyperlink-group-block:hover h2 {
    color: var(--wp--preset--color--petrol) !important;
  }

  .wp-block-button a:hover {
    background: var(--wp--preset--color--petrol) !important;
    color: var(--wp--preset--color--vit) !important;
  }
}

@media (min-width: 700px) {
  #news {
    aspect-ratio: 9 / 9;
  }
}

@media (max-width: 699px) {
  #news {
    h2 {
      padding-top: 10%;
    }
  }
}

@media (max-width: 767px) {
  #shortcuts .wp-block-tiptip-hyperlink-group-block {
    width: 4.125rem;

    > .wp-block-group {
      width: 4.125rem;
    }
  }
  #shortcuts .is-layout-grid {
    justify-content: center;
    display: flex;
  }
  #news {
    .wp-block-heading {
      margin-top: 0.5rem !important;
      font-size: 1.125rem !important;
    }
    .wp-block-buttons {
      justify-content: center;
    }
  }
}

@media (max-width: 1023px) {
  #news {
    hr {
      margin-top: 0.5rem !important;
      margin-bottom: 1rem !important;
    }
    > * {
      max-width: 188px;
    }
  }
  #portals .wp-block-columns {
    gap: 0;
  }

  #portals a {
    margin-left: auto !important;
    margin-right: auto !important;
  }

  .home .wp-block-cover:first-of-type {
    min-height: 293px !important;
  }

  #front-carousel {
    margin-top: -265px !important;

    p {
      margin: 0;
    }
  }

  main .wp-block-cover.is-position-bottom-center {
    min-height: 300px !important;
  }

  #shortcuts
    .wp-block-tiptip-hyperlink-group-block:nth-child(2)
    .wp-block-heading {
    width: 120%;
    left: -0.4rem;
    position: relative;
  }
}

@media (min-width: 1440px) and (max-width: 1634px) {
  #news {
    &::after {
      background-size: 150vw;
    }
  }
}

@media (min-width: 1024px) {
  #shortcuts .is-layout-grid {
    gap: 4.62rem;
  }
}

@media (min-width: 700px) and (max-width: 1439px) {
  #news {
    &::after {
      background-size: 200%;
    }
  }
}

@media (min-width: 700px) and (max-width: 1634px) {
  #news {
    h2 {
      padding-top: 5%;
    }
  }
}

@media (max-width: 1634px) {
  #shortcuts {
    padding-right: var(--wp--preset--spacing--40);
    padding-left: var(--wp--preset--spacing--40);
    width: 100%;

    > .wp-block-heading {
      text-align: center;
    }

    .wp-container-core-group-is-layout-31 {
      gap: var(--wp--preset--spacing--20);
    }
    .wp-block-tiptip-hyperlink-group-block > .wp-block-group {
      border-radius: 10px !important;
      padding-top: var(--wp--preset--spacing--40) !important;
      padding-right: var(--wp--preset--spacing--40) !important;
      padding-bottom: var(--wp--preset--spacing--40) !important;
      padding-left: var(--wp--preset--spacing--40) !important;
    }
    .wp-block-tiptip-hyperlink-group-block .wp-block-heading {
      font-size: clamp(0.75rem, 0.6708rem + 0.3223vw, 1rem) !important;
      margin-top: 0.5rem;
      margin-right: 0 !important;
      margin-left: 0 !important;
      max-width: 114px;
    }
  }

  #news {
    max-width: unset;
    max-height: 1200px;
    > * {
      position: relative;
      left: -1%;
    }
  }

  #about {
    background-position: bottom 0 right -35% !important;
    background-size: 50% !important;
  }

  .wp-container-core-group-is-layout-42 {
    justify-content: center;
  }
}

@media (min-width: 1635px) {
  #news {
    position: absolute;
    left: 60vw;
    top: 0;
    z-index: 1;
    width: 100%;
    overflow: visible;
    height: 90vh;

    > * {
      max-width: 252px;
      margin-left: 7.8rem !important;
    }

    &::after {
      content: "";
      background-image: url("../abbostader2024/assets/images/Iphone.png");
      top: -30px;
      right: 0;
      width: auto;
      height: 980px;
      z-index: -1;
      background-size: 1165px;
      background-position: inherit;
    }
  }
}

/**************/

/** PORTALS - Bostadssökande, Hyresgäst **/
.portal-grid {
  a {
    position: relative;
    border-radius: 30px;
    overflow: hidden;
    height: 100%;
    min-height: 287px;
    outline-offset: 2px;
    &:hover,
    &:focus {
      .wp-block-cover {
        opacity: 0;
      }
    }

    .wp-block-group.is-layout-flow {
      display: flex;
      flex-direction: column;
      justify-content: space-between;
      height: 100%;
    }

    .wp-block-cover {
      position: absolute !important;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      z-index: 2;
    }

    .wp-block-cover:not(:has(img)) .has-background-dim {
      position: relative;
      z-index: 0;
    }

    .has-background-dim {
      margin: 0;
    }

    .wp-block-heading,
    p {
      position: relative;
      z-index: 3;
    }
  }
}

#portal-grid-hyresgast {
  row-gap: 1.562rem;
  a {
    &:nth-child(2) {
      border-radius: 0;
      overflow: visible;
      .wp-block-group.is-layout-flow {
        position: relative;
        padding-top: 2.8rem !important;
        &::after {
          content: "";
          background-image: url("../abbostader2024/assets/images/lapp 1.png");
          background-repeat: no-repeat;
          background-size: contain;
          position: absolute;
          top: -3.25rem;
          left: 0;
          width: 100%;
          height: 127%;
          z-index: 2;
        }
      }
    }
  }
}

#portal-grid-bostadssokande {
  grid-template-columns: repeat(auto-fit, minmax(0, 287px));
  gap: 0.937rem;

  a {
    &:nth-child(3) {
      border-radius: 0;
      margin-bottom: 20rem;
      overflow: visible;

      &::after {
        content: "";
        background-image: url("/wp-content/themes/abbostader2024/assets/images/lapp 3.png");
        background-repeat: no-repeat;
        background-size: cover;
        position: absolute;
        top: 0;
        left: -15px;
        width: 111%;
        height: 97%;
        z-index: 2;
      }

      .wp-block-group.is-layout-flow {
        background-position-x: -13px;
        background-repeat: no-repeat;
        padding-right: 2.25rem !important;
      }
    }
  }
}

@media (max-width: 1023px) {
  .portal-grid {
    gap: 2.5rem;
    margin-bottom: 0 !important;
    margin-top: 1.75rem !important;
    grid-template-columns: repeat(auto-fit, minmax(0, 320px)) !important;
    a,
    .wp-block-group.has-background {
      border-radius: 10px !important;
    }
    .wp-block-heading {
      margin-bottom: 1rem;
    }
  }
  #portal-grid-bostadssokande {
    gap: 1.687rem;
  }
}

@media (min-width: 1024px) {
  #portal-grid-bostadssokande {
    a:nth-child(3) {
      grid-row: span 2;
      margin-bottom: unset;
      overflow: visible;
      .wp-block-group.is-layout-flow {
        padding-right: 1.25rem !important;
        background-size: 108%;
      }
    }
  }
  #portal-grid-hyresgast {
    a:nth-child(1) {
      grid-column: span 2;
    }
    a:nth-child(2) {
      .wp-block-group.is-layout-flow {
        &::after {
          top: -3.25rem;
          height: 127%;
        }
      }
    }
  }
}

/**************/

/** SINGLE POST + default page **/

.sidebar-menu,
.wp-block-boldblocks-breadcrumb-block,
.wp-block-column:has(.sidebar-menu),
.wp-block-column:has(#radhuset-project) {
  display: none;
}

.sidebar-menu {
  .menu-item .menu-item-wrap {
    display: flex;
    align-items: baseline;
  }
  .menu-list {
    margin-top: 0;
    a:first-of-type {
      padding-top: 0;
    }
  }
  ul {
    list-style: none;
    margin: 0 0 1.187rem;
    padding: 0;
  }
  a {
    text-decoration: none;
    font-size: var(--wp--preset--font-size--body);
    padding: 1.187rem 0;
  }

  .menu-item.open {
    font-weight: normal;
  }

  .menu-item.open:not(:has(.menu-item.open)) > .menu-item-wrap a,
  .menu-item.open .menu-item.open a {
    font-weight: 700;
  }

  .toggle-button {
    background: none;
    padding: 0 0.5rem 1.187rem;
    cursor: pointer;
    border: none;
    top: 2px;
    position: relative;
    svg {
      transform: rotate(-90deg);
      transition: transform 0.3s ease;
      &.open {
        transform: rotate(0deg);
      }
    }
  }
  /* Submenu Styling */
  .sub-menu {
    padding-left: 1.375rem;
    border-left: 2px solid currentColor;
    a {
      padding: 1.1875rem 0 1.1875rem;
    }
    .menu-item:first-of-type .menu-item-wrap a {
      padding-top: 0;
    }
    .menu-item:last-of-type .menu-item-wrap a {
      padding-bottom: 0;
    }
  }
}

.wp-block-details {
  border-radius: 30px;
  &.has-background {
    border-color: transparent;
  }
  summary {
    transition: margin 150ms ease-out;
    font-weight: 400;
  }
  &[open] summary {
    margin-bottom: 10px;
  }
}

@media (max-width: 768px) {
  .page-template-default
    .wp-container-core-column-layout-2.wp-container-core-column-layout-2
    > :where(:not(.alignleft):not(.alignright):not(.alignfull)),
  .page-template-page-bostadsomraden
    .wp-container-core-column-layout-2.wp-container-core-column-layout-2
    > :where(:not(.alignleft):not(.alignright):not(.alignfull)) {
    padding: var(--wp--preset--spacing--20) inherit !important;
  }
}

@media (min-width: 1440px) {
  .sidebar-menu,
  .wp-block-boldblocks-breadcrumb-block,
  .wp-block-column:has(.sidebar-menu),
  .wp-block-column:has(#radhuset-project) {
    display: block;
  }
}

@media (max-width: 1339px) {
  .single-bostadsomrade main .wp-block-cover:first {
    min-height: 200px !important;
    height: 100%;
  }

  main .wp-block-column:first .wp-block-image {
    display: none;
  }
}

/**************/

/** PROJECTS **/

#brush {
  position: absolute;
  top: -100px;
  right: -2rem;
  z-index: 1;
  img {
    height: 279px;
    width: auto !important;
  }
}

#red-dot {
  position: absolute;
  top: -100px;
  left: -1.3rem;
}

#radhuset-project {
  display: none;
}

#radhus-projekt {
  display: none;
}

#radhus-sand {
  position: relative;
  left: -50%;
}

.page-template-page-projekt {
  .wp-block-query {
    .is-layout-grid {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(0, 274px)) !important;
      gap: 1.87rem;
    }

    li {
      position: relative;
      background: var(--wp--preset--color--sand);
      border-radius: 30px;

      a {
        height: 100%;
        overflow: hidden;
        border-radius: 30px;
        min-height: 274px;
        outline-offset: 2px;
        &:hover,
        &:focus {
          .wp-block-cover {
            opacity: 0;
          }
        }
      }

      .wp-block-group.is-layout-flow {
        height: 100%;
      }

      .wp-block-cover {
        position: absolute !important;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        opacity: 0.2;
        z-index: 0;
      }

      .wp-block-post-title,
      .wp-block-post-excerpt,
      .wp-block-buttons {
        position: relative;
        z-index: 1;
      }
    }

    @media (max-width: 1023px) {
      .is-layout-grid {
        grid-template-columns: repeat(auto-fit, minmax(0, 320px)) !important;
        .wp-block-post-title {
          margin-bottom: 1rem !important;
        }
      }
    }

    @media (min-width: 1440px) {
      li:nth-child(12n + 1),
      li:nth-child(12n + 8),
      li:nth-child(12n + 11) {
        grid-column: span 2;
      }
      li:nth-child(12n + 3),
      li:nth-child(12n + 7) {
        grid-row: span 2;
      }
    }

    li:nth-child(11n + 2),
    li:nth-child(11n + 5),
    li:nth-child(11n) {
      background-color: var(--wp--preset--color--rod);

      .wp-block-post-title,
      .wp-block-post-excerpt {
        color: var(--wp--preset--color--vit) !important;
      }

      .wp-element-button {
        background-color: var(--wp--preset--color--rosa) !important;
        color: var(--wp--preset--color--rod) !important;
      }
    }

    li:nth-child(11n + 3),
    li:nth-child(11n + 4),
    li:nth-child(11n + 8) {
      background-color: var(--wp--preset--color--rosa);
    }
  }

  .wp-block-column:first-child {
    box-sizing: border-box;
  }
  .wp-block-cover.is-position-bottom-left {
    overflow: visible;
  }
}

.single-projekt {
  #gallery {
    max-width: 1196px;
    margin: auto;
  }

  .wp-block-table tr:not(tr:last-of-type) {
    border-bottom: 1px solid;
    td {
      border-color: var(--wp--preset--color--rosa) !important;
    }
  }

  .splide__arrow {
    background: none !important;
    svg {
      fill: var(--wp--preset--color--sand);
      width: 1.5rem !important;
      height: 1.5rem !important;
    }
  }

  .splide__slide.is-active figure {
    transform: scale(1);
  }

  .splide__slide {
    transform-origin: center;
    max-width: 75vw;
    margin-right: 0 !important;
    aspect-ratio: 1 / 1;

    figure {
      height: 100%;
      transform: scale(0.8);
      transition: all 0.2s ease;
    }

    img {
      height: 100%;
      max-height: 600px;
      object-fit: cover;
      border: 2px solid transparent;
    }

    &.is-active img {
      border-color: var(--wp--preset--color--sand);
    }

    .wp-lightbox-overlay .wp-block-image img {
      object-fit: contain !important;
    }

    figcaption {
      position: absolute;
      width: -webkit-fill-available;
      bottom: 0;
      left: 0;
    }

    iframe {
      height: 388px !important;
    }
  }

  .wp-block-splide-carousel .splide__pagination__page {
    height: 6px;
    width: 6px;
    margin: 4px;
    background: var(--wp--preset--color--sand);
    opacity: 1;
  }

  #brush-single {
    transform: rotate(90deg);
    position: absolute;
    right: 23rem;
    bottom: -24rem;
    z-index: 1;
    img {
      height: 100% !important;
      max-height: 771px;
    }
  }
}

@media (max-width: 689px) {
  .single-projekt {
    .wp-block-columns:has(iframe) {
      > .wp-block-column:first-of-type {
        width: 100vw;
        position: relative;
        left: calc(-50vw + 50%);
      }
    }
  }
}

@media (max-width: 1023px) {
  .single-projekt {
    #gallery {
      padding: 0 !important;
    }
    .wp-block-group.has-sand-50-background-color
      .has-vit-background-color
      .wp-block-group {
      padding-top: 2.375rem !important;
      padding-bottom: 2.375rem !important;
      min-height: unset !important;
    }
  }
  .page-template-page-projekt {
    section.wp-block-group:has(.wp-block-column .entry-content) {
      margin-bottom: 2.812rem !important;
    }
    & .wp-block-query {
      & li {
        border-radius: 10px !important;
        a {
          border-radius: 10px !important;
        }
      }
    }
  }
}

@media (max-width: 1439px) {
  .page-template-page-projekt {
    .wp-block-columns.is-not-stacked-on-mobile {
      .wp-block-group {
        margin-right: 1rem;
      }
    }

    .load-more {
      margin: 0;
    }

    .wp-block-group.has-sand-50-background-color {
      margin-top: 2rem !important;
    }

    .wp-block-columns:last-of-type {
      flex-direction: column;
      gap: 0;
      > .wp-block-column:first-of-type {
        padding-bottom: 0 !important;
        padding-right: 8.9% !important;
        padding-top: 1rem !important;
        > * {
          max-width: none;
        }
      }

      .wp-block-cover {
        height: 320px;
      }

      .has-background-dim {
        background: linear-gradient(
          180deg,
          rgb(234, 232, 220) 0%,
          rgba(255, 255, 255, 0) 57%
        ) !important;
      }

      #red-dot {
        width: 119px !important;
        left: unset;
        right: -1rem;
        top: -50px;
      }

      #radhus-sand {
        display: none;
      }
    }
  }
  .single-projekt {
    #cover {
      .has-vit-background-color {
        background: none !important;
        padding-bottom: 0 !important;
      }

      .wp-block-columns .wp-block-column:first-child {
        display: none;
      }

      .wp-block-columns
        .wp-container-core-column-is-layout-2
        > :where(:not(.alignleft):not(.alignright):not(.alignfull)) {
        max-width: 100%;
      }
    }

    #intro {
      padding-left: 0 !important;
      padding-right: 0 !important;

      p,
      .wp-block-post-title {
        color: var(--wp--preset--color--vit) !important;
        text-align: left !important;
      }
    }

    .wp-block-table {
      margin: auto !important;
    }

    #brush-single {
      right: 50%;
      bottom: -14rem;
      transform-origin: right;
      img {
        max-height: 375px;
      }
    }

    #gallery {
      padding-left: 0 !important;
      padding-right: 0 !important;
    }

    .splide__slide {
      width: 246px !important;

      figcaption {
        display: none;
      }
    }

    .wp-block-splide-carousel__container {
      margin-bottom: 9rem;
      padding-top: 1.437rem;
    }
  }
}

@media (max-width: 1269px) {
  .single-projekt {
    .splide__arrows {
      display: none;
    }
    .wp-block-splide-carousel .splide__pagination {
      bottom: -2.25rem;
      display: flex;
    }
  }
}

@media (min-width: 1270px) {
  .single-projekt {
    .splide__pagination {
      display: none;
    }
  }
}

@media (min-width: 1440px) {
  .page-template-page-projekt #radhuset-project,
  .page-template-page-projekt #radhus-projekt {
    display: block;
  }

  .single-projekt {
    #intro {
      background-color: var(--wp--preset--color--vit) !important;
    }

    #cover .wp-block-cover__background {
      display: none;
    }

    #radhus-projekt {
      display: block;
    }
  }

  #brush {
    top: -16.5rem;
    right: -3.5%;
    img {
      height: auto;
      width: 144px !important;
    }
  }
  .page-template-page-projekt .wp-block-columns:first-of-type .wp-block-column {
    margin-right: unset;
  }
}

/**************/

/** BOSTADSOMRÅDE **/

.page-template-page-bostadsomraden .wp-block-query {
  .is-layout-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(0, 270px)) !important;
  }

  li {
    position: relative;
    background: var(--wp--preset--color--gron);
    border-radius: 30px;

    a {
      height: 100%;
      min-height: 270px;
      overflow: hidden;
      border-radius: 30px;
      outline-offset: 2px;
      &:hover,
      &:focus {
        .wp-block-cover {
          opacity: 0;
        }
      }
    }

    .wp-block-group.is-layout-flow {
      display: flex;
      flex-direction: column;
      justify-content: space-between;
      height: 100%;
    }

    .wp-block-cover {
      position: absolute !important;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      z-index: 2;
    }

    .wp-block-cover:not(:has(img)) .has-background-dim {
      position: relative;
      z-index: 0;
    }

    .wp-block-post-title,
    .wp-block-buttons {
      position: relative;
      z-index: 3;
    }

    .wp-block-post-excerpt {
      position: relative;
      z-index: 1;
    }

    &:nth-child(9n + 1),
    &:nth-child(9n + 5),
    &:nth-child(9n + 8) {
      background-color: var(--wp--preset--color--gron);
      .wp-block-post-title,
      .wp-block-buttons {
        color: var(--wp--preset--color--lime);
      }
      h3 {
          border-radius: 500px;
          background-color: var(--wp--preset--color--gron) !important;
          padding: 5px 10px;
      }
      .wp-block-cover .has-background-dim {
        background-color: var(--wp--preset--color--gron) !important;
        opacity: 0 !important;
      }
    }

    &:nth-child(9n + 2),
    &:nth-child(9n + 7),
    &:nth-child(9n + 9) {
      background-color: var(--wp--preset--color--lime);
      .wp-block-post-title {
        color: var(--wp--preset--color--gron) !important;
      }
      .wp-block-buttons .has-background {
        background-color: var(--wp--preset--color--gron) !important;
        color: var(--wp--preset--color--lime) !important;
      }
      h3 {
          border-radius: 500px;
          background-color: var(--wp--preset--color--lime);
          padding: 5px 10px;
      }
      .wp-block-cover .has-background-dim {
        background-color: var(--wp--preset--color--lime) !important;
        opacity: 0 !important;
      }
    }

    &:nth-child(9n + 3) {
      background-color: var(--wp--preset--color--gron);
      .wp-block-post-title {
        color: var(--wp--preset--color--lime) !important;
      }
      .wp-block-buttons,
      .wp-block-post-excerpt {
        color: var(--wp--preset--color--vit) !important;
      }
      h3 {
          border-radius: 500px;
          background-color: var(--wp--preset--color--gron);
          padding: 5px 10px;
      }
      .wp-block-cover .has-background-dim {
        background-color: var(--wp--preset--color--gron) !important;
        opacity: 0 !important;
      }
    }

    &:nth-child(9n + 4),
    &:nth-child(9n + 6) {
      background-color: var(--wp--preset--color--sand);
      .wp-block-post-title,
      .wp-block-post-excerpt {
        color: var(--wp--preset--color--gron) !important;
      }
      h3 {
          border-radius: 500px;
          background-color: var(--wp--preset--color--sand);
          padding: 5px 10px;
      }
      .wp-block-cover .has-background-dim {
        background-color: var(--wp--preset--color--sand) !important;
        opacity: 0 !important;
      }
    }
  }
}

.single-bostadsomrade {
  main .wp-block-cover:first-of-type {
    min-height: 100%;
  }

  .wp-block-table tr:not(tr:last-of-type) {
    border-bottom: 1px solid;
    td {
      border-color: var(--wp--preset--color--lime) !important;
    }
  }

  .wp-block-splide-carousel__container,
  .wp-block-splide-carousel,
  .wp-block-splide-carousel__track,
  .wp-block-cover {
    height: 100%;
  }
}

.radhus-sand {
  position: absolute;
  right: -10.1rem;
  top: -23rem;
  z-index: -1;
}

@media (max-width: 689px) {
  .page-template-page-bostadsomraden {
    .wp-block-embed {
      width: 100vw;
      position: relative;
      left: calc(-50vw + 50%);
    }
  }
}

@media (max-width: 1023px) {
  .page-template-page-bostadsomraden {
    .wp-block-group.has-sand-50-background-color {
      padding-top: 4.25rem !important;
      .wp-block-columns {
        margin-top: 0;
      }
    }

    .wp-block-columns:has(.entry-content) {
      .wp-block-column:first-of-type {
        flex-basis: 100% !important;
      }
    }

    #tatort,
    #landsbygd {
      text-align: center !important;
    }

    .wp-block-buttons {
      max-width: 100%;
    }

    .wp-block-query {
      .is-layout-grid {
        grid-template-columns: repeat(auto-fit, minmax(0, 320px)) !important;
      }

      li {
        border-radius: 10px;

        a {
          border-radius: 10px;
        }

        .wp-block-group.is-layout-flow {
          padding: 2rem !important;
        }

        .has-text-align-center {
          text-align: left !important;
        }

        .is-content-justification-center {
          justify-content: flex-start !important;
        }
      }
    }
  }
}

@media (max-width: 1439px) {
  .page-template-page-bostadsomraden {
    .wp-block-query .is-layout-grid {
      gap: 1.5rem;
    }

    .wp-block-columns:has(.entry-content) {
      margin-left: 0 !important;
    }

    .wp-block-buttons {
      justify-content: center !important;
    }

    #tatort {
      margin-top: 3.75rem !important;
    }

    #tatort,
    #landsbygd {
      margin-bottom: 1.562rem !important;
    }

    .wp-block-query
      li
      .wp-block-cover__background.has-background-dim-0.has-background-dim {
      opacity: 0.8 !important;
    }

    .wp-block-query li {
        &:nth-child(9n + 1),
        &:nth-child(9n + 5),
        &:nth-child(9n + 8),
        &:nth-child(9n + 2),
        &:nth-child(9n + 7),
        &:nth-child(9n + 9),
        &:nth-child(9n + 3),
        &:nth-child(9n + 4),
        &:nth-child(9n + 6) {
            h3 {
                background-color: transparent !important;
                padding: 0 !important;
            }
        }
    }

    .wp-block-query li .wp-block-post-excerpt {
      z-index: 2;
    }

    .wp-block-group.has-sand-50-background-color {
      margin-top: 6rem;
      padding-bottom: 3.75rem !important;
    }
  }
  .radhus-sand {
    top: -8rem;
    right: 36px;
    img {
      height: 136px !important;
    }
  }
  #bostadsomraden {
    margin-left: -6% !important;
    width: 112%;
    position: relative;
    max-width: none;

    .wp-block-heading {
      max-width: unset;
    }

    p {
      padding: 0 !important;
      max-width: unset;
      font-size: 1rem !important;
    }

    .wp-block-table {
      margin: 0 !important;
    }

    .wp-block-column:not(:has(.splide)) {
      padding: 1.812rem 8.9% 1.5rem !important;
    }

    .wp-block-columns.building-left {
      flex-direction: column;

      .wp-block-column:nth-child(2) > .wp-block-heading,
      .wp-block-column:nth-child(2) > div {
        padding-right: 0 !important;
        padding-left: 0 !important;
        max-width: unset;
      }
    }

    .wp-block-columns.building-right {
      flex-direction: column-reverse;

      .wp-block-column:first-of-type > .wp-block-heading,
      .wp-block-column:first-of-type > div {
        padding-right: 0;
        padding-left: 0;
        max-width: unset;
      }
    }
  }
}

@media (min-width: 782px) and (max-width: 1439px) {
  #bostadsomraden {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(0, 50%));
  }
  .single-bostadsomrade {
    .wp-block-splide-carousel__container,
    .wp-block-splide-carousel,
    .wp-block-splide-carousel__track,
    .wp-block-cover {
      height: unset !important;
    }
    .building-left .wp-block-column:has(.splide) {
      flex-basis: 0 !important;
    }
  }
}
/**************/

/** PAGE - OM OSS **/

#video-omoss {
  overflow: visible;
  aspect-ratio: 1920/480 !important;
  min-height: 0 !important;
}

#pen {
  display: none;
}

#sand-hus-omoss img {
  height: 170px !important;
}

@media (max-width: 1439px) {
  #vision-btn-omoss {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    top: 1rem;
    white-space: nowrap;
    z-index: 1;
  }

  #last-col-omoss {
    flex-direction: column-reverse !important;
    .wp-block-column {
      padding-bottom: 0 !important;
      flex-basis: 0 !important;
    }
  }
}

@media (min-width: 1440px) {

  #pen {
    display: block;
    position: absolute;
    right: -27rem;
    bottom: -9rem;
  }

  #sand-hus-omoss {
    position: absolute;
    top: -2.5rem;
    img {
      height: 320px !important;
    }
  }
}

/** SEARCH **/

#search-field {
  .wp-block-search {
    border: 0;
  }
  .wp-block-search__inside-wrapper {
    padding: 0 1.375rem;
  }
  input,
  input::placeholder {
    color: var(--wp--preset--color--rod) !important;
  }
}

@media (max-width: 1439px) {
  .search main {
    .wp-block-columns {
      margin-top: 1rem;
    }
    .wp-block-navigation {
      display: none;
    }
  }
}

/*************/

/** ARCHIVE + NEWS **/

.news-archive.wp-block-query .is-layout-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(0, 270px)) !important;
  grid-template-rows: repeat(auto-fit, minmax(0, 270px)) !important;
  column-gap: 2.5rem;
  row-gap: 1.375rem;

  li {
    border-radius: 30px;

    a {
      min-height: 230px;
      border-radius: 30px;
      outline-offset: 2px;
      &:hover,
      &:focus {
        .wp-block-cover {
          opacity: 0;
        }
      }
    }
  }

  li:nth-child(12n + 1),
  li:nth-child(12n + 5),
  li:nth-child(12n + 7),
  li:nth-child(12n + 11) {
    background-color: var(--wp--preset--color--rod);

    .wp-block-post-date,
    .wp-block-post-title,
    .wp-block-post-excerpt {
      color: var(--wp--preset--color--rosa) !important;
    }
  }

  li:nth-child(12n + 1) button,
  li:nth-child(12n + 5) button,
  li:nth-child(12n + 7) button,
  li:nth-child(12n + 11) button {
    background-color: var(--wp--preset--color--rosa);

    color: red;
    border: none;
    padding: 0.5rem 1rem;
    cursor: pointer;
  }

  li:nth-child(12n + 2),
  li:nth-child(12n + 6),
  li:nth-child(12n + 8),
  li:nth-child(12n + 12) {
    background-color: var(--wp--preset--color--rosa);
  }

  li:nth-child(12n + 3),
  li:nth-child(12n + 4),
  li:nth-child(12n + 9),
  li:nth-child(12n + 10) {
    background-color: var(--wp--preset--color--sand);
  }
}

@media (max-width: 1023px) {
  .news-archive.wp-block-query .is-layout-grid {
    grid-template-columns: repeat(auto-fit, minmax(0, 320px)) !important;
    grid-template-rows: repeat(auto-fit, minmax(0, 320px)) !important;
    li {
      border-radius: 10px;

      a {
        border-radius: 10px;
      }
    }
  }
}

/*************/

/** FOOTER **/
footer {
  margin-block-start: 0;
  z-index: 1;

  .is-content-justification-space-between {
    row-gap: 1.319rem;
  }

  a:where(:not(.wp-element-button)) {
    text-decoration: none;
    &:hover {
      text-decoration: underline;
    }
  }

  .wp-block-navigation a:where(:not(.wp-element-button)):hover {
    text-decoration: none;
    background: none;
    &:hover {
      text-decoration: underline;
    }
  }

  .wp-social-link-facebook svg {
    height: 45px !important;
    width: 45px !important;
  }

  .wp-social-link-instagram svg path {
    transform: scale(1.25);
    transform-origin: center;
  }

  .wp-social-link-youtube svg path {
    transform: scale(1.18);
    transform-origin: top;
  }

  #houses {
    background-position: center bottom 1rem !important;
    background-repeat: no-repeat !important;
  }
}

@media (max-width: 599px) {
  footer {
    #footer-nav {
      display: block;
    }
    .wp-container-core-group-is-layout-50 {
      width: 100%;
    }
    .wp-container-core-group-is-layout-53 {
      display: flex;
      align-items: flex-end;
      gap: 1.5rem;
      flex-direction: row-reverse;
    }
    .wp-block-heading {
      margin-bottom: 0 !important;
    }
  }
}

@media (max-width: 767px) {
  footer {
    #houses {
      min-height: 76px !important;
      margin-top: 0;
    }

    .wp-block-group:nth-child(2) {
      width: 100%;
    }

    .wp-block-group:nth-child(4) {
      width: 47%;
    }

    .wp-block-group:nth-child(5) {
      display: flex;
      flex-direction: row-reverse;
      align-items: center;
      flex-wrap: wrap;
      gap: 1rem;

      ul {
        margin-top: 0;
      }
    }

    .wp-social-link-facebook svg {
      height: 23px !important;
      width: 23px !important;
      padding: 1px;
    }

    .wp-social-link-instagram svg path {
      transform: scale(0.667);
      transform-origin: center;
    }

    .wp-social-link-youtube svg path {
      transform: scale(0.575);
      transform-origin: left;
    }
  }
}
@media (max-width: 1439px) {
  footer #houses {
    background-size: cover !important;
    background-position: left bottom 1rem !important;
  }
}
@media (max-width: 1439px) {
  footer > .wp-block-group:first-of-type {
    padding-top: 2.5rem !important;
  }
}

/**************/

/** NINJA FORMS **/

.nf-form-layout label,
.nf-form-layout .nf-form-content label,
.nf-form-layout .nf-field-label .nf-label-span,
.nf-form-layout .nf-field-label label {
  font-weight: 400;
}

.nf-form-layout .nf-form-content input[type="submit"] {
  background: var(--wp--preset--color--svart);
  border-radius: 30px;
  color: var(--wp--preset--color--vit);
  cursor: pointer !important;
  padding-top: 0.432rem;
  padding-right: 1.521rem;
  padding-bottom: 0.432rem;
  padding-left: 1.521rem;
}

.nf-form-layout .nf-form-content input[type="submit"]:hover {
  background: var(--wp--preset--color--rod);
}

.nf-form-layout
  .nf-form-content
  .list-select-wrap
  .nf-field-element
  > div:focus,
.nf-form-layout .nf-form-content input:not([type="button"]):focus,
.nf-form-layout .nf-form-content textarea:focus {
  color: var(--wp--preset--color--black);
}

.nf-form-layout .nf-error-msg,
.nf-form-layout .ninja-forms-req-symbol {
  color: var(--wp-preset--color--rod);
}

.nf-form-layout .nf-error.field-wrap .nf-field-element:after {
  background: var(--wp--preset--color--rod);
}

/* SPLIDE CAROUSEL BLOCK PLUGIN */

#front-carousel {
  margin-top: -640px;
  position: relative;
  z-index: 1;

  .wp-block-splide-carousel {
    margin-bottom: 2.5rem;
  }

  .wp-block-splide-carousel .splide__list {
    align-items: flex-end;
  }

  .wp-block-splide-carousel .splide__slide {
    padding: 0.85rem 0.468rem 0;
    box-sizing: initial;
    margin-right: 0 !important;
  }

  .wp-block-splide-carousel .splide__pagination {
    bottom: -40px !important;
  }

  .wp-block-splide-carousel .splide__pagination__page {
    height: 6px;
    width: 6px;
    margin: 4px;
    background: var(--wp--preset--color--rosa);
    opacity: 1;
  }

  .wp-block-cover {
    align-items: end;
    width: 100%;
  }

  a > .wp-block-group.has-background {
    box-shadow: 0px -6px 10px #00000029;
    min-height: 500px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
  }
}

.splide__slide {
  max-width: 100%;
}

.wp-block-splide-carousel {
  margin-bottom: 0;
}

.wp-block-splide-carousel .splide__slide .wp-element-button:hover {
  background: var(--wp--preset--color--vit) !important;
  color: var(--wp--preset--color--rod);
}

.wp-block-splide-carousel .splide__slide img {
  transition: transform 0.3s ease-out;
}

.home .wp-block-splide-carousel .splide__slide:hover img {
  transform: scale(1.1);
}

.wp-block-splide-carousel__slide #radhus1 img {
  position: relative;
  z-index: 1;
  margin-bottom: -1px !important;
  transform: translateX(-50%);
  left: 50%;
}

.wp-block-splide-carousel .splide__arrow {
  opacity: 1;
  background: var(--wp--preset--color--vit);
}

.wp-block-splide-carousel .splide__toggle {
  background: var(--wp--preset--color--svart-10);
  opacity: 1;
}

.wp-block-splide-carousel .splide__toggle svg {
  fill: var(--wp--preset--color--svart-85);
}

.wp-block-splide-carousel .splide__pagination {
  bottom: 0.5rem;
}

.wp-block-splide-carousel .splide__pagination__page {
  background: var(--wp--preset--color--vit);
  opacity: 1;
}

.wp-block-splide-carousel .splide__pagination__page.is-active {
  background: var(--wp--preset--color--rod) !important;
}

.wp-block-splide-carousel.is-focus-in .splide__arrow:focus {
  outline-color: var(--wp--preset--color--white);
}

@media (min-width: 782px) {
  #front-carousel {
    .wp-block-splide-carousel .splide__arrows--ltr .splide__arrow--next {
      right: 1rem;
    }

    .wp-block-splide-carousel .splide__arrows--ltr .splide__arrow--prev {
      left: 1rem;
    }
  }
}

@media (max-width: 1023px) {
  #front-carousel .splide__slide {
    max-width: 75vw;
    width: 286px !important;

    .wp-block-group.has-background,
    .wp-block-cover {
      border-radius: 10px !important;
    }

    .wp-block-cover {
      padding-bottom: var(--wp--preset--spacing--40) !important;
      min-height: 80px !important;
    }
  }
  #front-carousel {
    a > .wp-block-group.has-background {
      min-height: 310px !important;
      .has-full-block-link {
        padding: 1.9rem 1.25rem 0 !important;
      }
    }
  }
}

@media (max-width: 1439px) {
  #front-carousel .wp-block-splide-carousel .splide__slide {
    padding: 1rem 0.5rem 0 !important;
    width: 100%;
    margin-right: 0 !important;
  }

  .wp-block-splide-carousel__slide #radhus1 {
    width: 107px;
  }
}

@media (min-width: 1440px) {
  #front-carousel .wp-block-button {
    height: 3.062rem;
    width: 7.937rem;
  }
}

/**************/

/* LOAD MORE */

@keyframes fadeIn {
  0% {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }
}

.ajax-pagination-loading {
  display: none;
  margin: auto;
  text-align: center;
  transition: all 0.2s ease;
  animation: fadeIn 2s infinite;
}

.ajax-pagination-loading img {
  width: 50px;
  height: 50px;
  margin: auto;
}

.load-more {
  text-align: center;
  padding: 1rem 0;
  a {
    text-decoration: none;
    &:hover {
      text-decoration: underline;
    }
  }
}

.load-more__button-disable {
  pointer-events: none;
}

div.load-more {
  transition: all 0.3s ease;
}

div.ajax-pagination-loading img {
  margin: auto;
}

/**************/