/*
 * Redesign 2026 — losse stylesheet (geen build nodig).
 * Wordt na de Vite-bundle geladen via app/setup.php.
 * Design: Figma "Los Cosmos redesign", header = node 12069:2778 / 12069:2806.
 */

/* Sen (Google Fonts, SIL Open Font License) lokaal gehost — variabel lettertype 400-800 */
@font-face {
  font-family: 'Sen';
  font-style: normal;
  font-weight: 400 800;
  font-display: swap;
  src: url('fonts/sen-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: 'Sen';
  font-style: normal;
  font-weight: 400 800;
  font-display: swap;
  src: url('fonts/sen-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root {
  --lc-title: #1d1d1b;
  --lc-title-negative: #fff;
  /* Super Rocky (design) zodra de bestanden er zijn; tot dan Mistica uit het bestaande thema */
  --lc-font-display: 'Super Rocky', 'Mistica', 'Costa', sans-serif;
}

/* ---------- Header ---------- */

.lc-header {
  position: fixed;
  inset: 0 0 auto 0;
  z-index: 50;
  color: var(--lc-title);
  background: rgba(255, 255, 255, 0.5);
  transition: color 0.3s ease-in-out, background-color 0.3s ease-in-out;
}

/* Boven een donkere hero (Scroll.js zet .has-theme-light): transparant + wit */
html.has-theme-light:not(.has-menu) .lc-header {
  color: var(--lc-title-negative);
  background: transparent;
}

html.has-menu .lc-header {
  background: transparent;
}

/* Ingelogd: onder de WordPress-adminbalk */
html:has(#wpadminbar) .lc-header {
  top: 46px;
}

@media (min-width: 783px) {
  html:has(#wpadminbar) .lc-header {
    top: 32px;
  }
}

.lc-header__inner {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 24px;
  padding: 15px;
}

.lc-header__logo {
  display: block;
  flex-shrink: 0;
  width: 80px;
  aspect-ratio: 136.082 / 93.9606;
}

.lc-header__logo svg {
  display: block;
  width: 100%;
  height: 100%;
}

.lc-header__right {
  display: flex;
  align-items: center;
  gap: 30px;
}

.lc-header__nav {
  display: none;
}

.lc-header__list {
  display: flex;
  align-items: center;
  gap: clamp(24px, 3.75vw, 60px);
  margin: 0;
  padding: 0;
  list-style: none;
}

.lc-header__link,
.lc-menu__link {
  font-family: var(--lc-font-display);
  text-transform: uppercase;
  white-space: nowrap;
  line-height: 1.4;
}

.lc-header__link {
  font-size: clamp(17px, 1.375vw, 22px);
  color: inherit;
  transition: opacity 0.2s ease-in-out;
}

.lc-header__link:hover,
.lc-header__link:focus-visible {
  opacity: 0.7;
}

.lc-menu__link {
  display: inline-block;
  font-size: clamp(1.75rem, 8vw, 2.25rem);
  white-space: normal;
}

@media (min-width: 1024px) {
  .lc-header__inner {
    align-items: center;
    padding: 30px clamp(32px, 3.125vw, 50px);
  }

  .lc-header__logo {
    width: clamp(96px, 8.5vw, 136px);
  }

  .lc-header__right {
    gap: clamp(24px, 3.75vw, 60px);
  }

  .lc-header__nav {
    display: block;
  }

  .lc-header__burger {
    display: none;
  }
}

/* ---------- Burger (mobiel) ---------- */

.lc-burger {
  position: relative;
  display: block;
  width: 59.5px;
  height: 60px;
  color: inherit;
}

.lc-burger__closed,
.lc-burger__open {
  position: absolute;
  inset: 0;
  transition: opacity 0.3s ease-in-out, transform 0.3s ease-in-out;
}

.lc-burger svg {
  display: block;
  width: 100%;
  height: 100%;
}

.lc-burger__open {
  opacity: 0;
  transform: rotate(-90deg);
}

/* Kruisje over de open-vorm */
.lc-burger__open::before,
.lc-burger__open::after {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  width: 28px;
  height: 6px;
  margin: -3px 0 0 -14px;
  border-radius: 6px;
  background: var(--lc-burger-cross, #fff);
}

.lc-burger__open::before {
  transform: rotate(45deg);
}

.lc-burger__open::after {
  transform: rotate(-45deg);
}

html.has-menu .lc-burger__closed {
  opacity: 0;
  transform: rotate(90deg);
}

html.has-menu .lc-burger__open {
  opacity: 1;
  transform: none;
}

/* ---------- Taalkeuze (GTranslate) ---------- */

.lc-lang {
  position: relative;
}

.lc-lang__toggle {
  display: flex;
  align-items: center;
  gap: 12px;
  color: inherit;
}

.lc-lang__flag svg,
.lc-lang__menu svg {
  display: block;
  width: 22px;
  height: 22px;
}

@media (min-width: 1024px) {
  .lc-lang__flag svg,
  .lc-lang__menu svg {
    width: 26px;
    height: 26px;
  }
}

.lc-lang__flag {
  display: none;
}

.lc-lang[data-current="nl"] .lc-lang__flag[data-lang="nl"],
.lc-lang[data-current="en"] .lc-lang__flag[data-lang="en"] {
  display: block;
}

.lc-lang__caret {
  width: 9px;
  height: 8px;
  transition: transform 0.2s ease-in-out;
}

@media (min-width: 1024px) {
  .lc-lang__caret {
    width: 13px;
    height: 11.25px;
  }
}

.lc-lang.is-open .lc-lang__caret {
  transform: rotate(180deg);
}

.lc-lang__menu {
  position: absolute;
  top: calc(100% + 12px);
  right: 0;
  min-width: 170px;
  margin: 0;
  padding: 8px;
  list-style: none;
  background: #fff;
  border-radius: 14px;
  box-shadow: 0 8px 24px rgba(29, 29, 27, 0.15);
  color: var(--lc-title);
  opacity: 0;
  visibility: hidden;
  transform: translateY(-4px);
  transition: opacity 0.2s ease, transform 0.2s ease, visibility 0.2s;
}

.lc-lang.is-open .lc-lang__menu {
  opacity: 1;
  visibility: visible;
  transform: none;
}

.lc-lang__menu button {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  padding: 8px 10px;
  border-radius: 8px;
  font-family: var(--lc-font-display);
  text-transform: uppercase;
  font-size: 16px;
  text-align: left;
  white-space: nowrap;
}

.lc-lang__menu button:hover,
.lc-lang__menu button[aria-current="true"] {
  background: #f2e2d1;
}

.lc-lang__engine {
  display: none;
}

/* Google Translate-balk bovenaan verbergen */
body {
  top: 0 !important;
}

.skiptranslate iframe,
#goog-gt-tt,
.goog-te-banner-frame {
  display: none !important;
}

/* ---------- Homepage hero: tagline (Figma 12069:2530 / mobiel 12061:742) ---------- */

/* Inhoud centreren in de ruimte ónder de vaste header (lage laptopschermen) */
.lc-hero--tagline {
  padding-top: 90px;
}

@media (min-width: 1024px) {
  .lc-hero--tagline {
    padding-top: 154px;
  }

  /* Logo schaalt mee op lage schermen: header 154 + tagline 50 + 57 afstand + 80 onder = 341px */
  .lc-hero--tagline .lc-hero-tagline + div {
    max-width: clamp(180px, (100svh - 341px) * 0.684, 18rem);
  }
}

.lc-hero-tagline {
  position: relative;
  z-index: 30;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 30px;
  width: 100%;
  max-width: 375px;
  padding: 0 15px;
  /* afstand tot het logo: 33px (logo-blok heeft zelf 80px padding) */
  margin-bottom: -47px;
  color: #fff;
}

.lc-hero-tagline__wave {
  flex-shrink: 0;
  width: 31.356px;
  height: 30px;
}

.lc-hero-tagline__wave svg {
  display: block;
  width: 100%;
  height: 100%;
}

.lc-hero-tagline__text {
  flex: 1 0 0;
  min-width: 1px;
  margin: 0;
  font-family: var(--lc-font-display);
  font-size: 20px;
  line-height: 1.2;
  text-align: center;
  text-transform: uppercase;
}

@media (min-width: 1024px) {
  .lc-hero-tagline {
    gap: 40px;
    max-width: none;
    width: auto;
    padding: 0;
    /* afstand tot het logo: 57px */
    margin-bottom: -23px;
  }

  .lc-hero-tagline__wave {
    width: 52.259px;
    height: 50px;
  }

  .lc-hero-tagline__text {
    flex: none;
    font-size: 34px;
    white-space: nowrap;
  }
}

/* ---------- Footer (Figma desktop 12069:2479 / mobiel 12039:2782) ---------- */

.lc-footer {
  position: relative;
  color: var(--lc-title);
}

/* Lichte achtergrondvorm met bergrand (uit Figma) */
.lc-footer__shape {
  position: absolute;
  inset: 7px 0 180px 0;
  z-index: 0;
  pointer-events: none;
}

.lc-footer__shape span,
.lc-footer__wave span {
  position: absolute;
  inset: 0;
}

.lc-footer__shape svg,
.lc-footer__wave svg {
  display: block;
  width: 100%;
  height: 100%;
}

.lc-footer__shape-desktop,
.lc-footer__wave-desktop {
  display: none;
}

.lc-footer__main {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 60px;
  width: min(345px, 100% - 30px);
  margin: 0 auto;
  padding-top: 107px;
  text-align: center;
}

.lc-footer__info,
.lc-footer__nav {
  width: 100%;
  font-family: var(--lc-font-display);
  font-size: 20px;
  line-height: 1.4;
  text-transform: uppercase;
}

.lc-footer__info {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.lc-footer__info p {
  margin: 0;
}

/* Adres → openingstijden: 16px in het design */
.lc-footer__info p:first-child {
  margin-bottom: -4px;
}

.lc-footer__nav ul {
  display: flex;
  flex-direction: column;
  gap: 16px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.lc-footer__nav a,
.lc-footer__social,
.lc-footer__copyright a {
  color: inherit;
  transition: opacity 0.2s ease-in-out;
}

.lc-footer__nav a:hover,
.lc-footer__social:hover,
.lc-footer__copyright a:hover {
  opacity: 0.7;
}

.lc-footer__logo {
  display: block;
  width: 100%;
}

.lc-footer__logo svg {
  display: block;
  width: 100%;
  height: auto;
}

/* Rood-gele golf onderaan */
.lc-footer__bottom {
  position: relative;
  height: 220px;
  margin-top: 44px;
  overflow: hidden;
}

.lc-footer__wave {
  position: absolute;
  inset: 0 -5.07% 0 0;
}

.lc-footer__bar {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 30px;
  width: min(345px, 100% - 30px);
  margin: 0 auto;
  padding-top: 55px;
  color: #1d1d1d;
  text-align: center;
}

.lc-footer__social {
  display: flex;
  align-items: center;
  gap: 30px;
  font-family: var(--lc-font-display);
  font-size: 22px;
  line-height: 1.2;
  text-transform: uppercase;
  white-space: nowrap;
}

.lc-footer__instagram {
  display: block;
  width: 30px;
}

.lc-footer__instagram svg {
  display: block;
  width: 100%;
  height: auto;
}

.lc-footer__copyright {
  margin: 0;
  font-family: 'Sen', 'HankenGrotesk', sans-serif;
  font-size: 18px;
  line-height: 1.4;
}

@media (min-width: 1024px) {
  .lc-footer__shape {
    inset: 0 0 37px 0;
  }

  .lc-footer__shape-desktop,
  .lc-footer__wave-desktop {
    display: block;
  }

  .lc-footer__shape-mobile,
  .lc-footer__wave-mobile {
    display: none;
  }

  .lc-footer__main {
    flex-direction: row;
    justify-content: space-between;
    gap: 40px;
    width: auto;
    padding: 275px clamp(32px, 3.125vw, 50px) 0;
    text-align: left;
  }

  .lc-footer__info,
  .lc-footer__nav {
    flex: 1 0 0;
    min-width: 0;
    font-size: clamp(18px, 1.625vw, 26px);
  }

  .lc-footer__nav {
    text-align: right;
  }

  .lc-footer__logo {
    flex-shrink: 0;
    width: clamp(300px, 30.5vw, 488px);
  }

  .lc-footer__bottom {
    height: 222px;
    margin-top: 33px;
  }

  .lc-footer__wave {
    inset: 2px -5.06% -20.6px 0;
  }

  .lc-footer__bar {
    flex-direction: row;
    justify-content: space-between;
    width: min(1500px, 100% - 100px);
    padding-top: 111px;
    text-align: left;
  }

  .lc-footer__instagram {
    width: 50.5px;
  }
}

/* ---------- Homepage: prijzenblok "Onbeperkt Spaanse tapas" ---------- */
/* Figma desktop 12069:2268 + 12069:2271 / mobiel 12037:2222 + 12037:2329 */

:root {
  --lc-font-body: 'Sen', 'HankenGrotesk', sans-serif;
  --lc-red: #ff1800;
  --lc-yellow: #ffce01;
  --lc-cream: #f7e8d9;
}

/* Getekende vormen: desktop/mobiel-variant, uitgerekt naar de container */
.lc-shape {
  position: absolute;
  inset: 0;
  pointer-events: none;
}

.lc-shape svg {
  display: block;
  width: 100%;
  height: 100%;
}

.lc-shape--desktop {
  display: none;
}

@media (min-width: 1024px) {
  .lc-shape--desktop {
    display: block;
  }

  .lc-shape--mobile {
    display: none;
  }
}

.lc-pricing {
  position: relative;
  overflow-x: clip;
  padding: 40px 7px 100px;
  color: var(--lc-title);
}

/* Grote kop in zwarte vorm */
.lc-pricing__heading {
  position: relative;
  width: fit-content;
  max-width: 100%;
  margin: 0 auto 60px;
  padding: 20px 30px;
}

.lc-pricing__heading-text,
.lc-pricing__title {
  position: relative;
  margin: 0;
  font-weight: normal;
  font-family: var(--lc-font-display);
  line-height: 1.2;
  text-align: center;
  text-transform: uppercase;
  color: #fff;
}

.lc-pricing__heading-text {
  font-size: clamp(26px, 7.5vw, 60px);
}

/* Geel blok */
.lc-pricing__block {
  position: relative;
  max-width: 1320px;
  margin: 0 auto;
}

.lc-pricing__blob {
  position: absolute;
  inset: 51px 0 0 0;
}

.lc-pricing__banner {
  position: relative;
  z-index: 1;
  width: min(315px, 100%);
  margin: 0 auto;
  padding: 20px 30px;
}

.lc-pricing__title {
  font-size: clamp(28px, 8vw, 42px);
}

.lc-pricing__content {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 20px;
  width: min(331px, 100% - 30px);
  margin: 20px auto 0;
  padding-bottom: 60px;
}

.lc-pricing__intro {
  max-width: 872px;
  margin: 0;
  font-family: var(--lc-font-body);
  font-size: 20px;
  line-height: 1.4;
  text-align: center;
  color: #484848;
}

/* Prijskaarten (boogvorm) */
.lc-pricing__cards {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 24px;
  width: 100%;
}

.lc-price-card-wrap {
  position: relative;
}

.lc-price-card {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 30px;
  height: 100%;
  overflow: hidden;
  padding: 60px 20px 30px;
  /* titel + golfjes schalen mee met de kaartbreedte */
  container-type: inline-size;
  background: var(--lc-cream);
  border: 17px solid var(--lc-yellow);
  border-radius: 300px 300px 20px 20px;
}

.lc-price-card__light,
.lc-price-card__streak {
  position: absolute;
  pointer-events: none;
}

.lc-price-card__light {
  left: -29px;
  top: 3px;
  width: 516px;
  height: 1060px;
}

.lc-price-card-wrap:nth-child(even) .lc-price-card__light {
  left: 15px;
  top: 5px;
  transform: scaleX(-1);
}

.lc-price-card__streak {
  left: 196px;
  top: -15px;
  width: 193.505px;
  height: 299.64px;
}

.lc-price-card__light svg,
.lc-price-card__streak svg {
  display: block;
  width: 100%;
  height: 100%;
}

.lc-price-card__head,
.lc-price-card__row,
.lc-price-card__divider {
  position: relative;
  width: 100%;
}

.lc-price-card__head {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.lc-price-card__title {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: min(20px, 4.8cqi);
}

.lc-price-card__title h3 {
  margin: 0;
  font-family: var(--lc-font-display);
  font-size: min(42px, 9cqi);
  font-weight: normal;
  line-height: 1.2;
  text-align: center;
  text-transform: uppercase;
  color: #1d1d1d;
}

.lc-price-card__title h3 span {
  display: block;
  color: var(--lc-red);
}

.lc-price-card__wave {
  flex-shrink: 0;
  width: min(52.26px, 12.5cqi);
  color: var(--lc-red);
}

.lc-price-card__wave svg {
  display: block;
  width: 100%;
  height: auto;
}

.lc-price-card__days {
  margin: 0;
  font-family: var(--lc-font-body);
  font-size: 22px;
  font-weight: 700;
  line-height: 1.4;
  text-align: center;
  color: #1d1d1d;
}

.lc-price-card__row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  font-family: var(--lc-font-body);
  line-height: 1.4;
  color: #1d1d1d;
}

.lc-price-card__row span {
  font-size: 20px;
}

.lc-price-card__row strong {
  flex-shrink: 0;
  font-size: 24px;
  font-weight: 600;
}

.lc-price-card__divider {
  display: block;
  height: 3.88px;
}

/* Rood rondje */
.lc-price-badge {
  position: absolute;
  top: 110px;
  right: -20px;
  z-index: 2;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 74.8px;
  height: 74.8px;
  padding: 3.74px;
  border-radius: 50%;
  background: var(--lc-red);
  color: #fff;
  text-align: center;
  transform: rotate(23.88deg);
}

.lc-price-badge span {
  display: block;
  max-width: 57px;
  font-family: var(--lc-font-body);
  font-size: 8.98px;
  font-weight: 800;
  line-height: 1;
  text-transform: uppercase;
}

.lc-price-badge strong {
  font-family: var(--lc-font-display);
  font-size: 19.45px;
  font-weight: normal;
  line-height: 1.2;
}

/* Knoppen */
.lc-pricing__buttons {
  display: flex;
  flex-direction: column;
  gap: 24px;
  width: 100%;
}

.lc-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 20px 30px;
  font-family: var(--lc-font-display);
  font-size: 26px;
  line-height: 1.2;
  text-transform: uppercase;
  white-space: nowrap;
  color: #fff;
  transition: opacity 0.2s ease-in-out;
}

.lc-btn:hover,
.lc-btn:focus-visible {
  opacity: 0.85;
}

/* lange knopteksten passen ook op smalle telefoons */
@media (max-width: 479px) {
  .lc-btn {
    padding-inline: 20px;
    font-size: clamp(20px, 6.6vw, 26px);
  }
}

.lc-btn--red {
  background: var(--lc-red);
}

.lc-btn--dark {
  background: #1d1d1b;
}

@media (min-width: 1024px) {
  .lc-pricing {
    padding: 60px clamp(20px, 8.75vw, 140px) 140px;
  }

  .lc-pricing__heading {
    margin-bottom: 100px;
  }

  .lc-pricing__blob {
    inset: 45px 0 0 0;
  }

  .lc-pricing__banner {
    width: fit-content;
  }

  .lc-pricing__title {
    font-size: clamp(30px, 2.625vw, 42px);
    white-space: nowrap;
  }

  .lc-pricing__content {
    gap: 50px;
    width: min(1096px, 100% - 60px);
    margin-top: 60px;
    padding-bottom: 99px;
  }

  .lc-pricing__intro {
    font-size: 22px;
  }

  .lc-pricing__cards {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    max-width: none;
  }

  .lc-price-card {
    padding: 100px clamp(30px, 3.75vw, 60px) 60px;
  }

  .lc-price-card__days {
    font-size: clamp(22px, 1.625vw, 26px);
  }

  .lc-price-card__row span {
    font-size: clamp(16px, 1.45vw, 24px);
  }

  .lc-price-card__row strong {
    font-size: clamp(24px, 1.875vw, 30px);
  }

  .lc-price-card__divider {
    height: 5.54px;
  }

  .lc-price-badge {
    top: clamp(100px, 10.2vw, 163px);
    right: clamp(-85px, -5.3vw, -30px);
    width: 147px;
    height: 147px;
    padding: 7.35px;
  }

  .lc-price-badge span {
    max-width: 112px;
    font-size: 17.65px;
  }

  .lc-price-badge strong {
    font-size: 38.24px;
  }

  .lc-pricing__buttons {
    flex-direction: row;
    justify-content: center;
    width: auto;
  }
}

/* Mobiel: kaarten niet breder dan het design */
@media (max-width: 1023px) {
  .lc-pricing__cards,
  .lc-pricing__buttons {
    max-width: 536px;
  }
}

/* ---------- Homepage: "Bar de tapas" tegels (columns) ---------- */
/* Figma desktop 12069:2341 + 12008:7236 / mobiel 12037:2335 — blokken met Opmaak "Nieuw" (.lc-columns) */

.lc-columns > .grid-container {
  max-width: 1380px;
  padding-top: 40px;
  padding-bottom: 60px;
}

.lc-columns .c-timeline {
  width: 70px;
}

.lc-columns .c-timeline svg {
  display: block;
  width: 100%;
  height: auto;
}

/* logo → kop: 20px (mobiel) / 40px (desktop) */
.lc-columns .c-timeline {
  margin-bottom: -60px;
}

.lc-columns__heading {
  position: relative;
  width: fit-content;
  max-width: 100%;
  margin: 0 auto 30px;
  padding: 20px 30px;
}

.lc-columns__heading :is(h1, h2) {
  position: relative;
  margin: 0;
  font-family: var(--lc-font-display);
  font-size: 28px;
  line-height: 1.2;
  text-align: center;
  text-transform: uppercase;
  color: #fff;
}

/* Tegels */
.lc-columns .-ml-12.-mb-20 {
  margin: 0;
}

.lc-columns .-ml-12.-mb-20 > .flex {
  flex-direction: column;
  align-items: center;
  gap: 20px;
}

.lc-columns .-ml-12.-mb-20 > .flex > div {
  width: 100%;
  max-width: 424px;
  padding: 0;
}

.lc-columns figure {
  aspect-ratio: 345 / 380;
  border-radius: 1000px 1000px 20px 20px;
}

/* 50% zwarte overlay zoals in het design */
.lc-columns figure > div:first-child {
  opacity: 0.5;
}

.lc-columns figure > div.z-20 {
  top: 50%;
  padding-top: 0;
}

.lc-columns__title {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 20px;
}

.lc-columns__title h3 {
  min-width: 0;
  margin: 0;
  font-family: var(--lc-font-display);
  font-size: 42px;
  line-height: 1.2;
  text-transform: uppercase;
  white-space: nowrap;
  color: #fff;
}

.lc-columns__wave {
  flex-shrink: 0;
  width: 28px;
  color: #fff;
}

.lc-columns__wave svg {
  display: block;
  width: 100%;
  height: auto;
}

@media (min-width: 768px) {
  /* rijen van 3; een 4e, 5e… tegel komt gecentreerd op een nieuwe rij */
  .lc-columns .-ml-12.-mb-20 > .flex {
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
    align-items: stretch;
    gap: 24px;
  }

  .lc-columns .-ml-12.-mb-20 > .flex > div {
    flex: 0 0 calc((100% - 48px) / 3);
    min-width: 0;
    max-width: 424px;
  }

  .lc-columns figure {
    aspect-ratio: 424 / 600;
  }

  .lc-columns__title {
    gap: clamp(12px, 2.3vw, 30px);
  }

  .lc-columns__title h3 {
    font-size: clamp(30px, 3.75vw, 60px);
  }

  .lc-columns__wave {
    width: clamp(22px, 2.16vw, 34.5px);
  }
}

@media (min-width: 1024px) {
  .lc-columns > .grid-container {
    padding-top: 60px;
    padding-bottom: 100px;
  }

  .lc-columns .c-timeline {
    width: 106px;
    margin-bottom: -40px;
  }

  .lc-columns__heading {
    margin-bottom: 70px;
  }

  .lc-columns__heading :is(h1, h2) {
    font-size: 60px;
  }
}

/* ---------- Afbeelding + tekst (Figma home 12069:2406 / mobiel 12069:2869) ---------- */

/* voorkomt een haarlijntje tussen dit blok en de golf eronder */
.lc-media-text + section {
  margin-top: -1px;
}

.lc-media-text__inner {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 30px;
  width: min(345px, 100% - 30px);
  margin: 0 auto;
  padding: 40px 0 60px;
}

/* Foto in de organische vorm uit het design */
.lc-media-text__image {
  position: relative;
  width: 100%;
  aspect-ratio: 539 / 654;
  margin: 0;
  overflow: hidden;
  /* vorm uit Figma (Subtract 12069:2407), omgezet naar een schaalbare polygon */
  clip-path: polygon(57.88% 0%, 26.16% 1.83%, 22.82% 3.67%, 20.41% 5.5%, 18.46% 7.34%, 16.79% 9.17%, 15.4% 11.01%, 14.1% 12.84%, 12.99% 14.68%, 11.97% 16.51%, 11.04% 18.35%, 10.11% 20.18%, 9.37% 22.02%, 8.63% 23.85%, 7.88% 25.69%, 7.24% 27.52%, 6.68% 29.36%, 6.12% 31.19%, 5.57% 33.03%, 5.1% 34.86%, 4.64% 36.7%, 4.27% 38.53%, 3.8% 40.37%, 3.43% 42.2%, 3.15% 44.04%, 2.78% 45.87%, 2.5% 47.71%, 2.23% 49.54%, 1.95% 51.38%, 1.67% 53.21%, 1.48% 55.05%, 1.21% 56.88%, 1.02% 58.72%, 0.83% 60.55%, 0.74% 62.39%, 0.65% 64.22%, 0.46% 66.06%, 0.37% 67.89%, 0.28% 69.72%, 0.19% 71.56%, 0.09% 73.39%, 0.09% 75.23%, 0% 77.06%, 0% 78.9%, 0% 80.73%, 0% 82.57%, 0.09% 84.4%, 0.09% 86.24%, 0.19% 88.07%, 0.28% 89.91%, 0.46% 91.74%, 0.65% 93.58%, 0.83% 95.41%, 1.3% 97.25%, 27.64% 99.08%, 86.46% 98.62%, 92.02% 96.79%, 93.6% 94.95%, 94.16% 93.12%, 94.34% 91.28%, 94.34% 89.45%, 94.16% 87.61%, 93.97% 85.78%, 93.97% 83.94%, 93.97% 82.11%, 94.06% 80.28%, 94.16% 78.44%, 94.34% 76.61%, 94.53% 74.77%, 94.71% 72.94%, 94.99% 71.1%, 95.27% 69.27%, 95.64% 67.43%, 95.92% 65.6%, 96.2% 63.76%, 96.57% 61.93%, 96.94% 60.09%, 97.31% 58.26%, 97.59% 56.42%, 97.96% 54.59%, 98.24% 52.75%, 98.61% 50.92%, 98.98% 49.08%, 99.26% 47.25%, 99.44% 45.41%, 99.63% 43.58%, 99.91% 41.74%, 100% 39.91%, 100% 38.07%, 100% 36.24%, 100% 34.4%, 100% 32.57%, 100% 30.73%, 99.81% 28.9%, 99.54% 27.06%, 99.17% 25.23%, 98.7% 23.39%, 98.24% 21.56%, 97.59% 19.72%, 96.85% 17.89%, 95.92% 16.06%, 94.99% 14.22%, 93.88% 12.39%, 92.76% 10.55%, 91.28% 8.72%, 89.42% 6.88%, 86.83% 5.05%, 83.02% 3.21%, 76.72% 1.38%);
}

.lc-media-text__image img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.lc-media-text__content {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 20px;
  width: 100%;
}

.lc-media-text__heading {
  position: relative;
  max-width: 100%;
  padding: 20px 30px;
}

/* mobiel: lange koppen mogen over meerdere regels */
@media (max-width: 1023px) {
  .lc-media-text .lc-media-text__heading .lc-media-text__title {
    white-space: normal;
    text-align: center;
  }
}

.lc-media-text__heading .lc-media-text__title {
  position: relative;
  margin: 0;
  font-weight: normal;
  font-family: var(--lc-font-display);
  font-size: 28px;
  line-height: 1.2;
  text-transform: uppercase;
  white-space: nowrap;
  color: #fff;
}

.lc-media-text__text {
  margin: 0;
  font-family: var(--lc-font-body);
  font-size: 18px;
  line-height: 1.4;
  color: #484848;
}

@media (min-width: 1024px) {
  .lc-media-text__inner {
    flex-direction: row;
    align-items: center;
    gap: clamp(40px, 8.5vw, 136px);
    width: min(1316px, 100% - 64px);
    padding: 60px 0 100px;
  }

  .lc-media-text__image {
    flex: 0 0 auto;
    width: clamp(380px, 33.7vw, 539px);
  }

  .lc-media-text__content {
    flex: 1 1 0;
    max-width: 641px;
    gap: 30px;
  }

  .lc-media-text__heading {
    padding: 0 39px;
  }

  .lc-media-text__heading .lc-shape {
    inset: -7px 0 -8px 0;
  }

  .lc-media-text__heading .lc-media-text__title {
    font-size: 60px;
  }
}

/* ---------- Zenchef "Reserveer een tafel"-knop ---------- */
/* Zenchef meet de knopbreedte zelf (--zc-widget-width-numeral) en meet soms te krap
   (bijv. vóór het laden van het font), waardoor de knop rechts buiten beeld valt.
   Klikbaar gebied blijft beperkt tot de onderste 80px (Zenchef's eigen clip-path). */
iframe[class*="zc-iframe"][class*="zc-width-numeral"] {
  min-width: min(300px, 100vw);
}

/* ---------- Afbeelding + tekst, variant "kop gecentreerd" (Figma Zakelijk 12008:7718 / mobiel 12039:3816) ---------- */

.lc-media-text__top {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 20px;
  padding: 40px 15px 0;
}

.lc-media-text__logo {
  display: block;
  width: 70px;
}

.lc-media-text__logo svg {
  display: block;
  width: 100%;
  height: auto;
}

.lc-media-text--centered .lc-media-text__inner {
  padding-top: 30px;
}

.lc-media-text--centered .lc-media-text__image {
  order: 2;
  aspect-ratio: 536 / 650;
  /* vorm uit Figma (Subtract 12008:7754) */
  clip-path: polygon(38.34% 0%, 21.55% 1.77%, 16.14% 3.54%, 12.69% 5.31%, 10.35% 7.08%, 8.58% 8.85%, 7.18% 10.62%, 6.16% 12.38%, 5.13% 14.15%, 4.1% 15.92%, 3.26% 17.69%, 2.52% 19.46%, 1.87% 21.23%, 1.4% 23%, 0.93% 24.77%, 0.56% 26.54%, 0.28% 28.31%, 0.09% 30.08%, 0% 31.85%, 0% 33.62%, 0% 35.38%, 0% 37.15%, 0% 38.92%, 0% 40.69%, 0.19% 42.46%, 0.37% 44.23%, 0.65% 46%, 0.84% 47.77%, 1.12% 49.54%, 1.4% 51.31%, 1.77% 53.08%, 2.05% 54.85%, 2.43% 56.62%, 2.71% 58.38%, 3.08% 60.15%, 3.45% 61.92%, 3.73% 63.69%, 4.1% 65.46%, 4.38% 67.23%, 4.66% 69%, 4.94% 70.77%, 5.13% 72.54%, 5.41% 74.31%, 5.6% 76.08%, 5.78% 77.85%, 5.88% 79.62%, 5.97% 81.38%, 6.06% 83.15%, 5.97% 84.92%, 5.97% 86.69%, 5.78% 88.46%, 5.69% 90.23%, 5.69% 92%, 5.97% 93.77%, 6.81% 95.54%, 8.86% 97.31%, 16.51% 99.08%, 72.57% 99.08%, 98.69% 97.31%, 99.16% 95.54%, 99.35% 93.77%, 99.53% 92%, 99.63% 90.23%, 99.72% 88.46%, 99.81% 86.69%, 99.91% 84.92%, 100% 83.15%, 100% 81.38%, 100% 79.62%, 100% 77.85%, 99.91% 76.08%, 99.91% 74.31%, 99.91% 72.54%, 99.81% 70.77%, 99.72% 69%, 99.63% 67.23%, 99.53% 65.46%, 99.35% 63.69%, 99.25% 61.92%, 99.07% 60.15%, 98.97% 58.38%, 98.69% 56.62%, 98.51% 54.85%, 98.32% 53.08%, 98.04% 51.31%, 97.85% 49.54%, 97.57% 47.77%, 97.2% 46%, 96.92% 44.23%, 96.55% 42.46%, 96.18% 40.69%, 95.9% 38.92%, 95.43% 37.15%, 94.96% 35.38%, 94.59% 33.62%, 94.03% 31.85%, 93.56% 30.08%, 93% 28.31%, 92.35% 26.54%, 91.7% 24.77%, 91.04% 23%, 90.3% 21.23%, 89.55% 19.46%, 88.62% 17.69%, 87.78% 15.92%, 86.75% 14.15%, 85.63% 12.38%, 84.33% 10.62%, 82.93% 8.85%, 81.25% 7.08%, 79.38% 5.31%, 77.05% 3.54%, 73.79% 1.77%, 42.07% 0%);
}

/* knoppen: op mobiel onder elkaar over de volle breedte (design 12039:3626), desktop naast elkaar */
.lc-media-text__buttons {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 16px;
  width: 100%;
}

.lc-media-text--centered .lc-media-text__buttons {
  align-items: stretch;
}

.lc-media-text--centered .lc-btn {
  width: 100%;
}

@media (min-width: 1024px) {
  .lc-media-text__top {
    gap: 40px;
    padding-top: 60px;
  }

  .lc-media-text__logo {
    width: 106px;
  }

  .lc-media-text--centered .lc-media-text__heading {
    padding: 20px 30px;
  }

  .lc-media-text--centered .lc-media-text__heading .lc-shape {
    inset: 0;
  }

  .lc-media-text--centered .lc-media-text__inner {
    justify-content: space-between;
    gap: 40px;
    width: min(1320px, 100% - 64px);
    padding-top: 60px;
  }

  .lc-media-text--centered .lc-media-text__content {
    max-width: 758px;
    gap: 40px;
  }

  .lc-media-text--centered .lc-media-text__text {
    font-size: clamp(18px, 1.5vw, 24px);
  }

  .lc-media-text--centered .lc-media-text__image {
    width: clamp(360px, 33.5vw, 536px);
  }

  /* naast elkaar zolang het past; pas onder elkaar als er echt geen ruimte is */
  .lc-media-text__buttons {
    flex-direction: row;
    flex-wrap: wrap;
    gap: 24px;
    width: auto;
  }

  /* knopgrootte volgt de breedte van de tekstkolom */
  .lc-media-text__content {
    container-type: inline-size;
  }

  .lc-media-text__buttons .lc-btn {
    padding-inline: clamp(16px, 4cqi, 30px);
    font-size: clamp(16px, 3.1cqi, 26px);
  }

  .lc-media-text--centered .lc-btn {
    width: auto;
  }
}

/* ---------- FAQ (Figma 12063:877 / mobiel 12063:1210) ---------- */

.lc-faq {
  position: relative;
  padding: 40px 0 60px;
  overflow-x: clip;
}

.lc-faq__top {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 20px;
  margin-bottom: 30px;
}

.lc-faq__logo {
  display: block;
  width: 70px;
}

.lc-faq__logo svg {
  display: block;
  width: 100%;
  height: auto;
}

.lc-faq__heading {
  position: relative;
  padding: 20px 30px;
}

.lc-faq__heading h2 {
  position: relative;
  margin: 0;
  font-family: var(--lc-font-display);
  font-size: 28px;
  line-height: 1.2;
  text-align: center;
  text-transform: uppercase;
  white-space: nowrap;
  color: #fff;
}

/* Geel vlak met de vragen */
.lc-faq__block {
  position: relative;
  width: min(368px, 100% - 6px);
  margin: 0 auto;
  padding: 66px 19px 70px;
}

.lc-faq__blob {
  position: absolute;
  inset: 0;
}

.lc-faq__list {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.lc-faq__item {
  padding: 20px;
  border-radius: 100px;
  background: #ffd527;
  color: var(--lc-title);
}

.lc-faq__item[open] {
  border-radius: 40px;
}

.lc-faq__question {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin: 0;
  font-family: var(--lc-font-display);
  font-size: 17px;
  line-height: 1.6;
  text-transform: uppercase;
  list-style: none;
  cursor: pointer;
}

div.lc-faq__item .lc-faq__question {
  cursor: default;
}

.lc-faq__question::-webkit-details-marker {
  display: none;
}

.lc-faq__question > span:first-child {
  flex: 1 1 0;
  min-width: 0;
}

.lc-faq__toggle {
  flex-shrink: 0;
  width: 40px;
  height: 40px;
  transform: rotate(180deg);
  transition: transform 0.2s ease-in-out;
}

.lc-faq__item[open] .lc-faq__toggle {
  transform: none;
}

.lc-faq__toggle svg {
  display: block;
  width: 100%;
  height: 100%;
}

.lc-faq__question:focus-visible {
  outline: 2px solid var(--lc-title);
  outline-offset: 6px;
  border-radius: 8px;
}

.lc-faq__answer {
  margin: 20px 0 0;
  font-family: var(--lc-font-body);
  font-size: 18px;
  line-height: 1.4;
}

@media (min-width: 1024px) {
  .lc-faq {
    padding: 60px 0 100px;
  }

  .lc-faq__top {
    gap: 40px;
    margin-bottom: 60px;
  }

  .lc-faq__logo {
    width: 106px;
  }

  .lc-faq__heading h2 {
    font-size: 60px;
  }

  .lc-faq__block {
    width: min(1108px, 100% - 64px);
    padding: 100px clamp(40px, 10.3%, 114px) 120px clamp(40px, 11%, 122px);
  }

  .lc-faq__list {
    gap: 30px;
  }

  .lc-faq__item {
    padding: 30px;
  }

  .lc-faq__item[open] {
    border-radius: 100px;
  }

  .lc-faq__question {
    font-size: 22px;
    line-height: 1.2;
  }

  .lc-faq__answer {
    margin-top: 30px;
  }
}

/* ---------- Instagram (Figma 12008:7763 / mobiel 12039:2558) ---------- */

.lc-instagram {
  padding: 40px 15px 60px;
}

.lc-instagram__top {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 20px;
  margin-bottom: 30px;
}

.lc-instagram__logo {
  display: block;
  width: 70px;
}

.lc-instagram__logo svg {
  display: block;
  width: 100%;
  height: auto;
}

.lc-instagram__heading {
  position: relative;
  max-width: 100%;
  padding: 20px 12px;
}

.lc-instagram__heading h2 {
  position: relative;
  margin: 0;
  font-family: var(--lc-font-display);
  font-size: min(28px, 5.3vw);
  line-height: 1.2;
  text-align: center;
  text-transform: uppercase;
  white-space: nowrap;
  color: #fff;
}

@media (max-width: 399px) {
  .lc-instagram__heading h2 {
    white-space: normal;
  }
}

/* Vaste foto's (zolang de feed nog niet gekoppeld is) */
.lc-instagram__grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
  max-width: 345px;
  margin: 0 auto;
}

.lc-instagram__item {
  position: relative;
  display: block;
  aspect-ratio: 164.5 / 226;
  overflow: hidden;
  border-radius: 20px;
}

.lc-instagram__item:nth-child(n + 3) {
  display: none;
}

.lc-instagram__item img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.4s ease;
}

a.lc-instagram__item:hover img {
  transform: scale(1.04);
}

/* Smash Balloon-feed in dezelfde opmaak */
.lc-instagram__feed #sb_instagram {
  width: 100% !important;
  max-width: 345px;
  margin: 0 auto;
  padding: 0 !important;
}

.lc-instagram__feed #sb_instagram .sb_instagram_header,
.lc-instagram__feed #sb_instagram #sbi_load,
.lc-instagram__feed #sb_instagram .sbi_follow_btn,
.lc-instagram__feed #sb_instagram .sbi_load_btn {
  display: none !important;
}

.lc-instagram__feed #sb_instagram #sbi_images {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 16px !important;
  width: 100% !important;
  padding: 0 !important;
}

.lc-instagram__feed #sb_instagram .sbi_item {
  width: auto !important;
  margin: 0 !important;
  padding: 0 !important;
}

.lc-instagram__feed #sb_instagram .sbi_item:nth-child(n + 3) {
  display: none !important;
}

.lc-instagram__feed #sb_instagram .sbi_photo_wrap,
.lc-instagram__feed #sb_instagram .sbi_photo {
  position: relative;
  display: block;
  height: auto !important;
  aspect-ratio: 164.5 / 226;
  overflow: hidden;
  border-radius: 20px;
}

.lc-instagram__feed #sb_instagram .sbi_photo img {
  position: absolute;
  inset: 0;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover;
  opacity: 1 !important;
}

@media (min-width: 768px) {
  .lc-instagram__grid,
  .lc-instagram__feed #sb_instagram,
  .lc-instagram__feed #sb_instagram #sbi_images {
    max-width: none;
  }

  .lc-instagram__grid,
  .lc-instagram__feed #sb_instagram #sbi_images {
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
    gap: clamp(12px, 1.5vw, 24px) !important;
  }

  .lc-instagram__item,
  .lc-instagram__item:nth-child(n + 3),
  .lc-instagram__feed #sb_instagram .sbi_item:nth-child(n + 3) {
    display: block !important;
  }

  .lc-instagram__item,
  .lc-instagram__feed #sb_instagram .sbi_photo_wrap,
  .lc-instagram__feed #sb_instagram .sbi_photo {
    aspect-ratio: auto;
    height: clamp(260px, 25vw, 400px) !important;
  }

  .lc-instagram__feed #sb_instagram .sbi_item:nth-child(n + 6) {
    display: none !important;
  }
}

@media (min-width: 1024px) {
  .lc-instagram {
    padding: 60px 24px 100px;
  }

  .lc-instagram__top {
    gap: 40px;
    margin-bottom: 60px;
  }

  .lc-instagram__logo {
    width: 106px;
  }

  .lc-instagram__heading {
    padding: 20px 30px;
  }

  .lc-instagram__heading h2 {
    font-size: clamp(40px, 3.75vw, 60px);
  }
}

/* ---------- Paginahero gewone pagina's (Figma 12008:6916 + 12008:6726 / mobiel 12039:3155) ---------- */

.lc-page-hero {
  position: relative;
  /* golf (44px) + 16px, zodat de inhoud op 56px onder de golf begint (mobiel design) */
  margin-bottom: 60px;
}

.lc-page-hero__image {
  position: relative;
  height: 180px;
  overflow: hidden;
  background: #1d1d1b;
}

.lc-page-hero__image img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: grayscale(1);
}

.lc-page-hero__image--top img {
  object-position: center top;
}

.lc-page-hero__image--upper img {
  object-position: center 30%;
}

.lc-page-hero__image--lower img {
  object-position: center 78%;
}

.lc-page-hero__image--bottom img {
  object-position: center bottom;
}

/* 30% donkere laag */
.lc-page-hero__image::after {
  content: '';
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.3);
}

.lc-page-hero__wave {
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  height: 44px;
}

@media (min-width: 1024px) {
  .lc-page-hero {
    margin-bottom: 64px;
  }

  .lc-page-hero__image {
    height: clamp(220px, 17.2vw, 275px);
  }

  .lc-page-hero__wave {
    height: 64px;
  }
}

/* ---------- Carrousel, opmaak "Nieuw" (Figma groepen 12008:7701 + 12008:7717 / mobiel 12039:3654) ---------- */

.lc-carousel {
  padding: 20px 0 60px;
}

.lc-carousel__top {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 20px;
  margin-bottom: 30px;
  padding: 0 15px;
}

.lc-carousel__logo {
  display: block;
  width: 70px;
}

.lc-carousel__logo svg {
  display: block;
  width: 100%;
  height: auto;
}

.lc-carousel__heading {
  position: relative;
  max-width: 100%;
  padding: 20px 30px;
}

.lc-carousel__heading :is(h1, h2) {
  position: relative;
  margin: 0;
  font-family: var(--lc-font-display);
  font-size: 28px;
  line-height: 1.2;
  text-align: center;
  text-transform: uppercase;
  color: #fff;
}

.lc-carousel__inner {
  width: min(1320px, 100% - 30px);
  margin: 0 auto;
}

.lc-carousel .swiper-slide.lc-carousel__slide {
  width: 280px;
  height: auto;
  margin-right: 24px;
}

.lc-carousel__link {
  display: flex;
  flex-direction: column;
  height: 100%;
  color: inherit;
}

.lc-carousel__image {
  position: relative;
  height: 380px;
  margin: 0;
  overflow: hidden;
  border-radius: 1000px 1000px 0 0;
  background: #1d1d1b;
}

.lc-carousel__image img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  /* 50% zwarte overlay zoals in het design */
  opacity: 0.5;
  transition: opacity 0.3s ease, transform 0.4s ease;
}

a.lc-carousel__link:hover .lc-carousel__image img {
  opacity: 0.6;
  transform: scale(1.03);
}

.lc-carousel__title {
  position: absolute;
  top: 50%;
  left: 0;
  right: 0;
  padding: 0 16px;
  transform: translateY(-50%);
}

.lc-carousel__title h3 {
  flex: 1 1 0;
  white-space: normal;
  text-align: center;
}

.lc-carousel__text {
  flex: 1 1 auto;
  margin: 0;
  padding: 30px 20px;
  border-radius: 0 0 20px 20px;
  background: rgba(255, 255, 255, 0.15);
  font-family: var(--lc-font-body);
  font-size: 16px;
  font-weight: 700;
  line-height: 1.4;
  text-align: center;
  color: #1d1d1b;
}

.lc-carousel__nav {
  display: flex;
  justify-content: flex-end;
  gap: 30px;
  margin-top: 40px;
}

.lc-carousel__arrow {
  display: block;
  width: 59px;
  height: 60px;
  color: #1d1d1d;
  transition: opacity 0.2s ease;
}

.lc-carousel__arrow svg {
  display: block;
  width: 100%;
  height: 100%;
}

.lc-carousel__arrow--prev svg {
  transform: scaleX(-1);
}

.lc-carousel__arrow.swiper-button-disabled {
  opacity: 0.3;
  cursor: default;
}

@media (min-width: 1024px) {
  .lc-carousel {
    padding: 40px 0 100px;
  }

  .lc-carousel__top {
    gap: 40px;
    margin-bottom: 60px;
  }

  .lc-carousel__logo {
    width: 106px;
  }

  .lc-carousel__heading :is(h1, h2) {
    font-size: clamp(40px, 3.75vw, 60px);
    white-space: nowrap;
  }

  .lc-carousel__inner {
    width: min(1320px, 100% - 64px);
  }

  .lc-carousel .swiper-slide.lc-carousel__slide {
    width: clamp(300px, 26.5vw, 424px);
  }

  .lc-carousel__image {
    height: clamp(380px, 31.25vw, 500px);
  }

  .lc-carousel__text {
    padding: 40px;
    font-size: 18px;
  }

  .lc-carousel__nav {
    margin-top: 52px;
  }

  .lc-carousel__arrow {
    width: 69.4px;
    height: 70px;
  }
}

/* ---------- Tekstblok, opmaak "Nieuw" (Figma jobs 12008:7813) ---------- */

.lc-text {
  padding: 40px 15px 40px;
}

.lc-text__top {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 20px;
}

.lc-text__logo {
  display: block;
  width: 70px;
}

.lc-text__logo svg {
  display: block;
  width: 100%;
  height: auto;
}

.lc-text__heading {
  position: relative;
  max-width: 100%;
  padding: 20px 30px;
}

.lc-text__heading .lc-text__title {
  position: relative;
  margin: 0;
  font-family: var(--lc-font-display);
  font-size: 28px;
  font-weight: normal;
  line-height: 1.2;
  text-align: center;
  text-transform: uppercase;
  color: #fff;
}

.lc-text__body {
  max-width: 1092px;
  margin: 30px auto 0;
  font-family: var(--lc-font-body);
  font-size: 20px;
  line-height: 1.4;
  text-align: center;
  color: #484848;
}

.lc-text__body p {
  margin: 0;
}

.lc-text__body p + p {
  margin-top: 1em;
}

.lc-text__buttons {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 16px;
  margin-top: 30px;
}

@media (min-width: 1024px) {
  .lc-text {
    padding: 60px 32px 60px;
  }

  .lc-text__top {
    gap: 40px;
  }

  .lc-text__logo {
    width: 106px;
  }

  .lc-text__heading .lc-text__title {
    font-size: clamp(40px, 3.75vw, 60px);
    white-space: nowrap;
  }

  .lc-text__body {
    margin-top: 60px;
    font-size: clamp(20px, 1.5vw, 24px);
  }

  .lc-text__buttons {
    gap: 24px;
  }
}

/* ---------- Tegels "2 per rij, met tekst" (Figma jobs 12008:7944 / tegel 12008:7975) ---------- */

.lc-columns--two figure {
  border-radius: 1000px 1000px 0 0;
}

.lc-columns--two .-ml-12.-mb-20 > .flex > div > a,
.lc-columns--two .-ml-12.-mb-20 > .flex > div {
  display: flex;
  flex-direction: column;
}

.lc-columns--two .-ml-12.-mb-20 > .flex > div > a {
  height: 100%;
  color: inherit;
}

.lc-columns__text {
  flex: 1 1 auto;
  margin: 0;
  padding: 30px 20px;
  border-radius: 0 0 20px 20px;
  background: rgba(255, 255, 255, 0.15);
  font-family: var(--lc-font-body);
  font-size: 18px;
  font-weight: 700;
  line-height: 1.4;
  text-align: center;
  color: #1d1d1b;
}

/* mobiel (Figma "MOBIEL - jobs" 12039:3936): foto 380px hoog, titel 32px over meerdere regels */
@media (max-width: 767px) {
  .lc-columns--two figure {
    aspect-ratio: auto;
    height: 380px;
  }

  .lc-columns--two figure > div.z-20 {
    padding: 0 30px;
  }

  .lc-columns--two .lc-columns__title {
    gap: 16px;
  }

  .lc-columns--two .lc-columns__title h3 {
    font-size: 32px;
    white-space: normal;
    text-align: center;
  }

  .lc-columns--two .lc-columns__wave {
    width: 34.5px;
  }
}

/* geen lichte naad tussen golfscheiding en gele tegelsectie */
section:has(+ .lc-columns--two) {
  margin-bottom: -1px;
}

.lc-columns--two + section {
  margin-top: -1px;
}

@media (min-width: 768px) {
  .lc-columns--two .-ml-12.-mb-20 > .flex {
    align-items: stretch;
  }

  .lc-columns--two .-ml-12.-mb-20 > .flex > div {
    flex: 0 0 calc((100% - 24px) / 2);
    max-width: 648px;
  }

  .lc-columns--two figure {
    aspect-ratio: auto;
    height: clamp(320px, 31.25vw, 500px);
  }

  .lc-columns--two .lc-columns__title h3 {
    font-size: clamp(30px, 2.625vw, 42px);
  }
}

@media (min-width: 1024px) {
  .lc-columns__text {
    padding: 40px;
    font-size: clamp(18px, 1.375vw, 22px);
  }
}

/* ---------- Sollicitatieformulier, opmaak "Nieuw" (Figma jobs 12034:464) ---------- */

.lc-jobs-form {
  padding: 0 0 60px;
}

.lc-jobs-form__block {
  position: relative;
  width: min(560px, 100% - 16px);
  margin: 0 auto;
}

/* ruim binnen de golvende rand van de gele vorm blijven */
.lc-jobs-form__inner {
  position: relative;
  display: block;
  padding: 70px clamp(26px, 7vw, 48px) 80px;
}

.lc-jobs-form__fields {
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.lc-jobs-form__row {
  display: grid;
  gap: 24px;
}

.lc-field {
  display: flex;
  flex-direction: column;
  gap: 10px;
  min-width: 0;
  margin: 0;
  padding: 0;
  border: 0;
}

.lc-field__label {
  padding: 0;
  font-family: var(--lc-font-display);
  font-size: 17px;
  line-height: 1.2;
  text-transform: uppercase;
  color: #1d1d1b;
}

.lc-field__input {
  width: 100%;
  height: 56px;
  padding: 0 24px;
  border: 0;
  border-radius: 100px;
  background: #fff;
  font-family: var(--lc-font-body);
  font-size: 18px;
  color: #1d1d1b;
  outline: none;
}

.lc-field__input:focus-visible {
  box-shadow: 0 0 0 3px #1d1d1b;
}

.lc-field__input--date {
  color: #484848;
}

/* checkboxen (Form.js togglet .-checked op het label) */
.lc-checks {
  display: grid;
  gap: 10px 24px;
}

.lc-check {
  position: relative;
}

.lc-check .c-form_checkbox {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.lc-check .lc-check__label {
  position: relative;
  display: block;
  margin: 0;
  padding-left: 36px;
  font-family: var(--lc-font-body);
  font-size: 16px;
  line-height: 24px;
  color: #1d1d1b;
  cursor: pointer;
}

/* oude theme-vakjes (c-form_checkboxLabel) volledig vervangen */
.lc-check .lc-check__label::before,
.lc-check .lc-check__label::after {
  content: ;
  position: absolute;
  margin: 0;
  padding: 0;
  background-image: none;
}

.lc-check .lc-check__label::before {
  left: 0;
  top: 0;
  width: 24px;
  height: 24px;
  border: 0;
  border-radius: 4px;
  background-color: #fff;
}

.lc-check .lc-check__label::after {
  left: 8px;
  top: 3px;
  width: 8px;
  height: 14px;
  border: solid var(--lc-red);
  border-width: 0 3px 3px 0;
  background-color: transparent;
  transform: rotate(45deg);
  opacity: 0;
}

.lc-check .c-form_checkbox + .lc-check__label.-checked::after {
  opacity: 1;
}

/* radio Ja / Nee */
.lc-radio {
  display: flex;
  align-items: center;
  gap: 12px;
  font-family: var(--lc-font-body);
  font-size: 16px;
  color: #1d1d1b;
  cursor: pointer;
}

.lc-radio input {
  appearance: none;
  width: 24px;
  height: 24px;
  margin: 0;
  border-radius: 50%;
  background: #fff;
  cursor: pointer;
}

.lc-radio input:checked {
  background: radial-gradient(circle, var(--lc-red) 0 6px, #fff 7px);
}

.lc-radio input:focus-visible {
  box-shadow: 0 0 0 2px #1d1d1b;
}

/* cv-upload */
.lc-upload {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  padding: 24px 16px;
  border: 2px dashed rgba(255, 255, 255, 0.8);
  border-radius: 12px;
  text-align: center;
  color: #6c6c6c;
  cursor: pointer;
}

.lc-upload input {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  cursor: pointer;
}

.lc-upload__icon {
  width: 32px;
  height: 32px;
  color: #fff;
}

.lc-upload__icon svg {
  display: block;
  width: 100%;
  height: 100%;
}

.lc-upload__text {
  font-family: var(--lc-font-body);
  font-size: 16px;
  font-weight: 700;
  word-break: break-all;
}

.lc-upload__hint {
  font-family: var(--lc-font-body);
  font-size: 13px;
}

.lc-upload:focus-within {
  border-color: #1d1d1b;
}

.lc-jobs-form__submit {
  width: 100%;
  border: 0;
  cursor: pointer;
}

.lc-jobs-form__feedback {
  font-family: var(--lc-font-body);
  font-size: 20px;
  font-weight: 700;
  text-align: center;
  color: #1d1d1b;
}

/* naast elkaar pas vanaf desktop; op tablet is het gele blok daar te smal voor */
@media (min-width: 1024px) {
  .lc-jobs-form__row,
  .lc-checks {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (min-width: 1024px) {
  .lc-jobs-form {
    padding-bottom: 100px;
  }

  .lc-jobs-form__block {
    width: min(1108px, 100% - 64px);
  }

  .lc-jobs-form__inner {
    padding: 100px clamp(40px, 10.3%, 114px) 110px clamp(40px, 10.1%, 112px);
  }

  .lc-jobs-form__fields {
    gap: 30px;
  }

  .lc-field__label {
    font-size: 22px;
  }

  .lc-field__input {
    height: 64px;
  }

  .lc-check__label,
  .lc-radio {
    font-size: 18px;
  }
}

/* ---------- Vacature (Figma VACATURE 12034:465 / mobiel 12039:4413) ---------- */

.lc-vacancy {
  padding: 40px 15px 60px;
}

.lc-vacancy__inner {
  display: flex;
  flex-direction: column;
  gap: 40px;
  max-width: 1320px;
  margin: 40px auto 0;
}

.lc-vacancy__main {
  display: flex;
  flex-direction: column;
  gap: 24px;
  min-width: 0;
  font-family: var(--lc-font-body);
  font-size: 16px;
  line-height: 1.4;
  color: #484848;
}

.lc-vacancy__intro {
  margin: 0;
  font-size: 20px;
  font-weight: 700;
}

.lc-vacancy__content {
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.lc-vacancy__content > * {
  margin: 0;
}

.lc-vacancy__content h2,
.lc-vacancy__content h3,
.lc-vacancy__content h4 {
  margin-top: 6px;
  font-family: var(--lc-font-display);
  font-size: 24px;
  font-weight: normal;
  line-height: 1.2;
  text-transform: uppercase;
  color: #1d1d1b;
}

.lc-vacancy__content ul {
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 0;
  list-style: none;
}

.lc-vacancy__content li {
  position: relative;
  padding-left: 32px;
}

/* rood vinkje (Figma 12034:981) */
.lc-vacancy__content li::before {
  content: "";
  position: absolute;
  top: 0.35em;
  left: 0;
  width: 16px;
  height: 15px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 15'%3E%3Cpath d='M3.69506 13.759C2.90906 12.8826 2.27415 12.0253 1.66083 11.1951C1.10039 10.4402 0.614455 9.63351 0.209725 8.78621C-0.0435934 8.2721 -0.155718 7.75152 0.392987 7.41682C1.96551 6.45773 2.28777 7.37351 3.14249 8.4361C3.64913 9.06573 4.39621 10.104 4.86431 10.76C5.31144 11.3865 5.85653 10.2558 6.07413 9.93675C6.84755 8.8029 8.85769 6.02704 9.68837 5.00096C10.477 4.02691 13.0224 1.29811 13.4969 0.864078C13.9008 0.494509 14.7536 -0.316095 15.327 0.131081C15.9296 0.600924 16.224 1.49404 15.8004 2.07475C15.0628 3.08574 13.904 4.04747 13.1022 5.01011C11.4792 6.95873 9.94268 9.05917 8.46775 11.1506C7.96655 11.8613 7.26286 13.0516 6.82599 13.8223C6.00877 15.2642 5.29096 15.5386 3.69506 13.759Z' fill='%23FF1800'/%3E%3C/svg%3E") no-repeat center / contain;
}

.lc-vacancy__content a {
  text-decoration: underline;
}

.lc-vacancy__aside {
  display: flex;
  justify-content: center;
}

.lc-vacancy__card {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 24px;
  width: 100%;
  max-width: 536px;
  padding: 70px 20px 24px;
  overflow: hidden;
  border-radius: 1000px 1000px 30px 30px;
  background: #f7e8d9;
}

.lc-vacancy__arch,
.lc-vacancy__swirl {
  position: absolute;
  pointer-events: none;
}

.lc-vacancy__arch {
  top: 11px;
  left: 0;
  width: 92.9%;
}

.lc-vacancy__swirl {
  top: -7px;
  right: 25.3%;
  width: 36.2%;
}

.lc-vacancy__arch svg,
.lc-vacancy__swirl svg {
  display: block;
  width: 100%;
  height: auto;
  overflow: visible;
}

.lc-vacancy__card > :not(.lc-vacancy__arch):not(.lc-vacancy__swirl) {
  position: relative;
}

.lc-vacancy__card-title {
  max-width: 400px;
  margin: 0;
  font-family: var(--lc-font-display);
  font-size: 24px;
  font-weight: normal;
  line-height: 1.2;
  text-align: center;
  text-transform: uppercase;
  color: #1d1d1b;
}

.lc-vacancy__line {
  display: block;
  width: 100%;
  height: 7px;
}

.lc-vacancy__line svg {
  display: block;
  width: 100%;
  height: 100%;
}

.lc-vacancy__facts {
  display: flex;
  flex-direction: column;
  gap: 20px;
  width: 100%;
  margin: 0;
  padding: 0;
  list-style: none;
  font-family: var(--lc-font-body);
  font-size: 16px;
  font-weight: 700;
  line-height: 1.4;
  color: #1d1d1b;
}

.lc-vacancy__facts li {
  display: flex;
  align-items: flex-start;
  gap: 16px;
}

.lc-vacancy__icon {
  flex-shrink: 0;
  width: 16px;
  margin-top: 0.2em;
}

.lc-vacancy__icon svg {
  display: block;
  width: 100%;
  height: auto;
}

.lc-vacancy__button {
  width: 100%;
  white-space: normal;
  text-align: center;
}

@media (min-width: 1024px) {
  .lc-vacancy {
    padding: 60px 32px 100px;
  }

  .lc-vacancy__inner {
    flex-direction: row;
    align-items: flex-start;
    justify-content: space-between;
    gap: 24px;
    margin-top: 100px;
  }

  .lc-vacancy__main {
    flex: 0 1 760px;
    gap: 30px;
    font-size: 18px;
  }

  .lc-vacancy__intro {
    font-size: 24px;
  }

  .lc-vacancy__content {
    gap: 30px;
  }

  .lc-vacancy__content h2,
  .lc-vacancy__content h3,
  .lc-vacancy__content h4 {
    font-size: 32px;
  }

  .lc-vacancy__content ul {
    gap: 16px;
  }

  .lc-vacancy__aside {
    flex: 0 1 536px;
    min-width: 400px;
  }

  .lc-vacancy__card {
    padding: 80px 40px 30px;
  }

  .lc-vacancy__card-title {
    font-size: 32px;
  }

  .lc-vacancy__facts {
    gap: 24px;
    font-size: 18px;
  }
}

/* ---------- Sollicitatieformulier met titel op de vlek (vacaturepagina) ---------- */

.lc-jobs-form__heading {
  position: relative;
  z-index: 1;
  width: fit-content;
  max-width: calc(100% - 30px);
  margin: 0 auto -28px;
  padding: 16px 24px;
}

.lc-jobs-form__heading .lc-text__title {
  position: relative;
  margin: 0;
  font-family: var(--lc-font-display);
  font-size: 22px;
  font-weight: normal;
  line-height: 1.2;
  text-align: center;
  text-transform: uppercase;
  color: #fff;
}

.lc-jobs-form__text {
  position: relative;
  max-width: 700px;
  margin: 0 auto 30px;
  font-family: var(--lc-font-body);
  font-size: 16px;
  line-height: 1.4;
  text-align: center;
  color: #484848;
}

@media (min-width: 1024px) {
  .lc-jobs-form__heading {
    margin-bottom: -40px;
    padding: 20px 30px;
  }

  .lc-jobs-form__heading .lc-text__title {
    font-size: 40px;
    white-space: nowrap;
  }

  .lc-jobs-form__text {
    margin-bottom: 40px;
    font-size: 18px;
  }
}

@media (max-width: 1023px) {
  .lc-vacancy__button {
    padding: 16px 20px;
    font-size: 20px;
    white-space: nowrap;
  }
}

/* ---------- Contactformulier, opmaak "Nieuw" (Figma CONTACT 12034:1280) ---------- */

.lc-field__input--textarea {
  height: auto;
  min-height: 120px;
  padding: 18px 24px;
  border-radius: 28px;
  line-height: 1.4;
  resize: vertical;
}

@media (min-width: 1024px) {
  .lc-field__input--textarea {
    min-height: 136px;
  }
}

.lc-text__body a {
  color: inherit;
  white-space: nowrap;
}

.lc-text__body a:hover {
  text-decoration: underline;
}

@media (min-width: 1024px) {
  .lc-contact-form {
    padding-top: 80px;
  }

  .lc-contact-form .lc-jobs-form__block {
    width: min(1312px, 100% - 64px);
  }

  /* velden 884px breed, zoals bij het sollicitatieformulier */
  .lc-contact-form .lc-jobs-form__inner {
    padding: 90px max(40px, (100% - 884px) / 2) 90px;
  }
}

/* ---------- Fotogalerij "Proef de sfeer" (Figma 12064:1631 / mobiel 12064:1635) ---------- */

.lc-gallery {
  padding: 40px 15px 40px;
  container-type: inline-size;
}

.lc-gallery__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 20px;
  max-width: 1320px;
  margin: 0 auto;
}

.lc-text__top + .lc-gallery__grid {
  margin-top: 30px;
}

.lc-gallery__item {
  position: relative;
  margin: 0;
  aspect-ratio: 1;
  overflow: hidden;
  border-radius: 30px;
  background: #d9d9d9;
}

.lc-gallery__item img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: cover;
}

@media (min-width: 640px) {
  .lc-gallery__grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

/* 3 kolommen, per 8 foto's: nr. 3 en 5 hoog, nr. 4 en 8 breed */
@media (min-width: 1024px) {
  .lc-gallery {
    padding: 60px 32px 60px;
  }

  .lc-gallery__grid {
    grid-template-columns: repeat(3, 1fr);
    grid-auto-rows: calc((min(100cqi, 1320px) - 48px) / 3 * 375 / 424);
    grid-auto-flow: dense;
    gap: 24px;
  }

  .lc-text__top + .lc-gallery__grid {
    margin-top: 60px;
  }

  .lc-gallery__item {
    aspect-ratio: auto;
  }

  .lc-gallery__item:nth-child(8n + 3),
  .lc-gallery__item:nth-child(8n + 5) {
    grid-row: span 2;
  }

  .lc-gallery__item:nth-child(8n + 4),
  .lc-gallery__item:nth-child(8n + 8) {
    grid-column: span 2;
  }
}

/* ---------- Menukaart (Figma MENUKAART 12069:2893) ---------- */

.lc-menu {
  padding: 40px 15px 40px;
}

.lc-menu .lc-text__top + .lc-menu__card {
  margin-top: 30px;
}

.lc-menu__card {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 50px;
  max-width: 1320px;
  margin: 0 auto;
  padding: 30px 15px;
  border-radius: 30px;
  background: #f7e8d9;
  color: #1d1d1b;
}

.lc-menu__blobs {
  position: absolute;
  inset: 0 0 auto;
  pointer-events: none;
}

.lc-menu__blobs svg {
  display: block;
  width: 100%;
  height: auto;
}

.lc-menu__column {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 50px;
  min-width: 0;
}

.lc-menu__column:empty {
  display: none;
}

.lc-menu__heading {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 24px;
  padding: 16px 20px;
  color: #fff;
}

.lc-menu__heading > .lc-shape {
  inset: -10px 0;
}

.lc-menu__heading h2 {
  position: relative;
  margin: 0;
  font-family: var(--lc-font-display);
  font-size: 28px;
  font-weight: normal;
  line-height: 1.2;
  text-align: center;
  text-transform: uppercase;
  color: #fff;
}

.lc-menu__heading-icon {
  position: relative;
  display: block;
  flex: none;
  width: auto;
  height: 30px;
}

.lc-menu__heading-icon svg {
  display: block;
  width: auto;
  height: 100%;
}

.lc-menu__intro {
  margin: 20px 0 0;
  font-family: var(--lc-font-body);
  font-size: 16px;
  line-height: 1.4;
  text-align: center;
}

.lc-menu__items {
  display: flex;
  flex-direction: column;
  gap: 20px;
  margin: 30px 0 0;
  padding: 0;
  list-style: none;
}

.lc-menu__item {
  margin: 0;
  padding: 0;
}

.lc-menu__row {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
}

.lc-menu__name {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px 12px;
  min-width: 0;
}

.lc-menu__name h3 {
  margin: 0;
  font-family: var(--lc-font-display);
  font-size: 21px;
  font-weight: normal;
  line-height: 1.2;
  text-transform: uppercase;
  color: #1d1d1b;
  overflow-wrap: anywhere;
}

.lc-menu__price {
  flex: none;
  font-family: var(--lc-font-body);
  font-size: 18px;
  font-weight: 700;
  line-height: 1.4;
  white-space: nowrap;
}

.lc-menu__subtitle,
.lc-menu__description {
  margin: 4px 0 0;
  font-family: var(--lc-font-body);
  font-size: 16px;
  line-height: 1.4;
}

.lc-menu__subtitle {
  font-style: italic;
}

.lc-menu__subtitle + .lc-menu__description {
  margin-top: 0;
}

/* Allergeen-icoon met optionele bolletjes linksboven (zwart = weglaten, rood = sporen) */
.lc-allergen {
  position: relative;
  display: inline-flex;
  align-items: flex-start;
}

.lc-allergen__dots {
  display: flex;
  gap: 2px;
}

.lc-allergen__dot {
  display: block;
  flex: none;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: #1d1d1d;
}

.lc-allergen__dot--red {
  background: #c22126;
}

.lc-allergen__icon {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: none;
  width: 26px;
  height: 26px;
  border: 1px solid var(--lc-allergen);
  border-radius: 50%;
}

.lc-allergen__icon svg {
  display: block;
  width: auto;
  max-width: 70%;
  height: 62%;
}

/* Ei en mosterd zijn als compleet rondje getekend */
.lc-allergen__icon--ei,
.lc-allergen__icon--mosterd {
  border: 0;
}

.lc-allergen__icon--ei svg,
.lc-allergen__icon--mosterd svg {
  width: 100%;
  max-width: none;
  height: 100%;
}

.lc-allergen .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;
}

/* Uitleg allergenen (Figma 12072:3148) */
.lc-menu__legend {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 24px;
  padding: 20px 15px;
  border-radius: 30px;
  background: #f3e2d1;
}

.lc-menu__legend h2 {
  margin: 0;
  font-family: var(--lc-font-display);
  font-size: 22px;
  font-weight: normal;
  line-height: 1.2;
  text-transform: uppercase;
  color: #1d1d1b;
}

.lc-menu__legend-list {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 16px 18px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.lc-menu__legend-list li {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
  font-family: var(--lc-font-body);
  font-size: 14px;
  font-weight: 700;
  line-height: 1.4;
}

.lc-menu__legend-list .lc-allergen__icon {
  width: 36px;
  height: 36px;
  border-width: 1.5px;
}

.lc-menu__legend-list .lc-allergen__icon svg {
  height: 50%;
}

.lc-menu__legend-list .lc-allergen__icon--ei svg,
.lc-menu__legend-list .lc-allergen__icon--mosterd svg {
  height: 100%;
}

.lc-menu__legend-notes {
  display: flex;
  flex-direction: column;
  gap: 12px;
  align-self: stretch;
  margin: 0;
  padding: 0;
  list-style: none;
  font-family: var(--lc-font-body);
  font-size: 14px;
  line-height: 1.4;
}

.lc-menu__legend-notes li {
  display: flex;
  align-items: center;
  gap: 12px;
}

.lc-menu__legend-notes .lc-allergen__dot {
  width: 6px;
  height: 6px;
}

.lc-menu__legend-note--red {
  color: #c22126;
}

@media (min-width: 1024px) {
  .lc-menu {
    padding: 60px 32px 60px;
  }

  .lc-menu .lc-text__top + .lc-menu__card {
    margin-top: 60px;
  }

  .lc-menu__card {
    flex-direction: row;
    align-items: flex-start;
    justify-content: space-between;
    gap: 80px;
    padding: 60px clamp(30px, 4.5vw, 60px);
  }

  .lc-menu__column {
    flex: 0 1 560px;
    gap: 60px;
  }

  .lc-menu__heading {
    gap: clamp(24px, 4vw, 60px);
    padding: 20px;
  }

  .lc-menu__heading > .lc-shape {
    inset: -13px 0;
  }

  .lc-menu__heading h2 {
    font-size: clamp(30px, 2.4vw, 38px);
    white-space: nowrap;
  }

  .lc-menu__heading-icon {
    height: 39px;
  }

  .lc-menu__items {
    margin-top: 40px;
  }

  .lc-menu__name h3 {
    font-size: 26px;
  }

  .lc-menu__price {
    font-size: 22px;
  }

  .lc-menu__subtitle,
  .lc-menu__description {
    font-size: 18px;
  }

  .lc-menu__legend {
    gap: 30px;
    padding: 20px;
  }

  .lc-menu__legend h2 {
    font-size: 26px;
  }

  .lc-menu__legend-list {
    gap: 22px 14px;
  }

  .lc-menu__legend-list li {
    font-size: 16px;
  }

  .lc-menu__legend-list .lc-allergen__icon {
    width: 40px;
    height: 40px;
  }
}

/* ---------- Reviews (Figma home 12069:2424, achtergrond 12069:2423) ---------- */

.lc-reviews {
  padding: 80px 0 90px;
  color: #fff;
}

.lc-reviews__background {
  position: absolute;
  inset: 0;
  pointer-events: none;
}

.lc-reviews__background img {
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: cover;
  object-position: center;
}

.lc-reviews__inner {
  position: relative;
}

.lc-reviews__top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 0 15px;
}

.lc-reviews__heading {
  position: relative;
  padding: 14px 24px;
}

.lc-reviews__heading h2 {
  position: relative;
  margin: 0;
  font-family: var(--lc-font-display);
  font-size: 30px;
  font-weight: normal;
  line-height: 1.2;
  text-transform: uppercase;
  color: #fff;
}

.lc-reviews__nav {
  display: flex;
  gap: 12px;
}

.lc-reviews__arrow {
  display: block;
  width: 48px;
  height: 48px;
  padding: 0;
  border: 0;
  background: none;
  cursor: pointer;
  transition: opacity 0.3s;
}

.lc-reviews__arrow svg {
  display: block;
  width: 100%;
  height: 100%;
}

.lc-reviews__arrow--prev svg {
  transform: scaleX(-1);
}

.lc-reviews__arrow.swiper-button-disabled {
  opacity: 0.35;
  cursor: default;
}

.lc-reviews__swiper {
  margin-top: 40px;
  overflow: hidden;
}

.lc-reviews__slide {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 100%;
  height: auto;
  padding: 0 15px;
}

.lc-reviews__card {
  display: flex;
  flex-direction: column;
  gap: 20px;
  width: 100%;
  max-width: 872px;
  margin: 0;
  padding: 30px 24px;
  border-radius: 30px;
  background: rgba(255, 255, 255, 0.15);
  -webkit-backdrop-filter: blur(7.5px);
  backdrop-filter: blur(7.5px);
}

.lc-reviews__quote svg {
  display: block;
  width: 60px;
  height: auto;
  transform: rotate(180deg);
}

.lc-reviews__text {
  margin: 0;
  font-family: var(--lc-font-body);
  font-size: 20px;
  font-weight: 800;
  line-height: 1.6;
  color: #fff;
}

.lc-reviews__footer {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 12px 20px;
}

.lc-reviews__author {
  display: flex;
  flex-direction: column;
  font-family: var(--lc-font-body);
  line-height: 1.4;
}

.lc-reviews__author strong {
  font-size: 18px;
  font-weight: 700;
}

.lc-reviews__author small {
  font-size: 14px;
}

.lc-reviews__stars {
  display: flex;
  gap: 12px;
  color: #ffce01;
}

.lc-reviews__star svg {
  display: block;
  width: 18px;
  height: auto;
}

.lc-reviews__star--off {
  opacity: 0.3;
}

@media (min-width: 1024px) {
  .lc-reviews {
    padding: 126px 0 190px;
  }

  .lc-reviews__top {
    padding: 0 140px;
  }

  .lc-reviews__heading {
    padding: 0 30px;
  }

  .lc-reviews__heading > .lc-shape {
    inset: -7px 0 -8px;
  }

  .lc-reviews__heading h2 {
    font-size: clamp(44px, 3.75vw, 60px);
  }

  .lc-reviews__nav {
    gap: 30px;
  }

  .lc-reviews__arrow {
    width: 69px;
    height: 70px;
  }

  .lc-reviews__swiper {
    margin-top: 60px;
  }

  .lc-reviews__card {
    gap: 30px;
    padding: 60px;
    border-radius: 40px;
  }

  .lc-reviews__quote svg {
    width: 95px;
  }

  .lc-reviews__text {
    font-size: clamp(24px, 1.9vw, 30px);
  }

  .lc-reviews__author strong {
    font-size: 20px;
  }

  .lc-reviews__stars {
    gap: 12.5px;
  }

  .lc-reviews__star svg {
    width: 21px;
  }
}

/* Lange Google-reviews inkorten; volledige tekst via "Lees op Google" */
.lc-reviews__text {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 6;
  overflow: hidden;
}

.lc-reviews__more {
  margin-top: -10px;
  font-family: var(--lc-font-body);
  font-size: 14px;
  color: #fff;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.lc-reviews__more:hover {
  color: #ffce01;
}

@media (min-width: 1024px) {
  .lc-reviews__text {
    -webkit-line-clamp: 5;
  }

  .lc-reviews__more {
    margin-top: -20px;
  }
}

/* Rollende tekst (oud Buzzwords-blok): niet breder dan het scherm (100vw telt de scrollbalk mee) */
.c-buzzwords .overflow-hidden.w-\[100vw\] {
  width: 100%;
}

/* Footer: copyright altijd rechts (Figma footer 12069:2479) */
@media (min-width: 1024px) {
  .lc-footer__copyright {
    margin-left: auto;
    text-align: right;
  }
}

/* Prijsblok tot 1024px: kaart blijft 331px breed (mobiel design), dus alles daarop afstemmen */
@media (max-width: 1023px) {
  /* zwarte kop: lettergrootte niet laten meegroeien met het scherm */
  .lc-pricing__title {
    font-size: clamp(26px, 8vw, 30px);
  }

  /* zoals mobiel design 12037:2329: kop iets lager in de boog, ronde onderhoeken (binnen de gele rand) */
  .lc-price-card {
    /* 17px gele rand + 3px = 20px tot de inhoud, zoals mobiel design (inhoud 291px) */
    padding: 70px 3px 30px;
    border-radius: 300px 300px 37px 37px;
  }

  /* titel kleiner zodat de golfjes ruim binnen de boog vallen */
  .lc-price-card__title {
    gap: 3.5cqi;
  }

  .lc-price-card__title h3 {
    font-size: 7.4cqi;
  }

  .lc-price-card__wave {
    width: 11cqi;
  }

  .lc-price-card__row span {
    font-size: 18px;
  }

  .lc-price-card__row strong {
    font-size: 22px;
  }

  /* knoppen: minder zijruimte; past het dan nog niet, dan op twee regels */
  .lc-pricing__buttons .lc-btn {
    padding-inline: 12px;
    font-size: clamp(16px, 5vw, 21px);
    white-space: normal;
    text-align: center;
  }
}

/* Tegels: knopje "Bekijken" rechtsonder op mobiel en tablet (Figma mobiel 12069:2839) */
.lc-columns__view {
  position: absolute;
  right: 5.2%;
  bottom: 5%;
  z-index: 30;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 78px;
  height: 78.7px;
  color: var(--lc-yellow);
  pointer-events: none;
}

.lc-columns__view-text {
  position: relative;
  font-family: var(--lc-font-display);
  font-size: 11px;
  line-height: 1;
  text-transform: uppercase;
  color: #1d1d1d;
}

@media (min-width: 1200px) {
  .lc-columns__view {
    display: none;
  }
}

/* Reviews op mobiel en tablet: kop gecentreerd, pijltjes onder de review links en rechts (Figma mobiel 12039:2463) */
@media (max-width: 1199px) {
  .lc-reviews__inner {
    display: flex;
    flex-direction: column;
  }

  .lc-reviews__top {
    display: contents;
  }

  .lc-reviews__heading {
    order: 1;
    align-self: center;
  }

  .lc-reviews__swiper {
    order: 2;
    width: 100%;
  }

  .lc-reviews__nav {
    order: 3;
    justify-content: space-between;
    width: 100%;
    max-width: 902px;
    margin: 30px auto 0;
    padding: 0 15px;
  }

  .lc-reviews__arrow {
    width: 49px;
    height: 50px;
  }
}

@media (max-width: 1199px) {
  .lc-reviews__swiper .swiper-wrapper {
    align-items: flex-start;
    transition-property: transform, height;
  }

  .lc-reviews__slide {
    align-items: flex-start;
  }
}

/* ---------- Mobiel menu open (Figma component "MENU" 12008:5628) ---------- */

.lc-nav-overlay {
  background: rgba(29, 29, 27, 0.55);
  -webkit-backdrop-filter: blur(14px);
  backdrop-filter: blur(14px);
}

.lc-nav-overlay__inner {
  height: 100%;
  overflow-y: auto;
  padding: 105px 15px 40px;
}

html:has(#wpadminbar) .lc-nav-overlay__inner {
  padding-top: 151px;
}

.lc-nav-overlay__list {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: clamp(20px, 9vw, 36px);
  margin: 0;
  padding: 0;
  list-style: none;
  text-align: right;
}

.lc-nav-overlay .lc-menu__link {
  font-size: clamp(22px, 7vw, 42px);
  line-height: 1.4;
  white-space: nowrap;
  color: #fff;
  transition: opacity 0.2s ease-in-out;
}

.lc-nav-overlay .lc-menu__link:hover,
.lc-nav-overlay .lc-menu__link:focus-visible {
  opacity: 0.7;
}

@media (min-width: 600px) {
  .lc-nav-overlay__inner {
    padding-right: 30px;
  }

  .lc-nav-overlay__list {
    gap: 30px;
  }
}

/* Header bij open menu: wit logo, witte sluitknop met zwart kruis */
html.has-menu .lc-header {
  color: #fff;
}

html.has-menu .lc-burger {
  --lc-burger-cross: #1d1d1d;
}

/* Smash Balloon-feed zoals het design: alleen foto's (reel-covers zijn vaak een leeg beeld),
   geen bijschrift/likes of type-icoontjes; mobiel de eerste 2, vanaf tablet de eerste 5 foto's */
.lc-instagram__feed #sb_instagram .sbi_info_wrapper,
.lc-instagram__feed #sb_instagram .sbi_photo_wrap > svg,
.lc-instagram__feed #sb_instagram .sbi_type_video {
  display: none !important;
}

.lc-instagram__feed #sb_instagram .sbi_item:nth-child(n + 3) {
  display: block !important;
}

.lc-instagram__feed #sb_instagram .sbi_item.sbi_type_video,
.lc-instagram__feed #sb_instagram .sbi_item:nth-child(n + 3 of .sbi_item:not(.sbi_type_video)) {
  display: none !important;
}

@media (min-width: 768px) {
  .lc-instagram__feed #sb_instagram .sbi_item:nth-child(n + 3 of .sbi_item:not(.sbi_type_video)) {
    display: block !important;
  }

  .lc-instagram__feed #sb_instagram .sbi_item.sbi_type_video,
  .lc-instagram__feed #sb_instagram .sbi_item:nth-child(n + 6 of .sbi_item:not(.sbi_type_video)) {
    display: none !important;
  }
}

/* telefoonnummer in de footer is klikbaar, maar ziet eruit als de rest van de tekst */
.lc-footer__info a {
  color: inherit;
}

.lc-footer__info a:hover,
.lc-footer__info a:focus-visible {
  text-decoration: underline;
}

/* ---------- Groepsformulier (zelfde opmaak als contactformulier) ---------- */

.lc-radios {
  display: grid;
  gap: 10px 24px;
}

@media (min-width: 768px) {
  .lc-radios {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}