/* Yogapoint Nijmegen Site — gegenereerd door scripts/wp-plugin/build.py. Alles gescoped onder .ypn-page. */
@font-face{font-family:"YPN Newsreader";font-style:normal;font-weight:300 500;font-display:swap;src:url(../fonts/ypn-newsreader.woff2) format("woff2")}
@font-face{font-family:"YPN DM Sans";font-style:normal;font-weight:400 700;font-display:swap;src:url(../fonts/ypn-dm-sans.woff2) format("woff2")}
/* ---- Tokens (één blok; merkwissel = alleen deze waarden aanpassen) ---- */
.ypn-page {
  --ypn-base: 17px;
  --ypn-color-cream: #f7f4ef;
  --ypn-color-cream-2: #dfe5dc;
  --ypn-color-cream-3: #faf8f5;
  --ypn-color-text: #3b4e43;
  --ypn-color-sage: #3b4e43;
  --ypn-color-accent: #a6533b;
  /* Oranje knoppen: #a6533b haalt AA met crème tekst; #8f4531 niet. */
  --ypn-color-cta: #a6533b;
  --ypn-color-cta-text: #faf8f5;
  font-size: var(--ypn-base);
  line-height: 1.6;
  color: var(--ypn-color-text);
  background: var(--ypn-color-cream);
  font-family: Arial, Helvetica, sans-serif;
  font-weight: 400;
  text-align: left;
  -webkit-font-smoothing: antialiased;
  overflow-x: clip;
}
/* Minimale reset uitsluitend binnen de plugin (vervangt Tailwind-preflight). */
.ypn-page :where(h1, h2, h3, h4, p, ul, ol, li, figure, blockquote, dl, dd, section, article, header, footer, nav, div, span, a, button, img, picture, svg, input, label) {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
  border: 0 solid currentColor;
  letter-spacing: inherit;
  text-transform: none;
  text-shadow: none;
}
.ypn-page :where(h1, h2, h3, h4) {
  font-family: Arial, Helvetica, sans-serif;
  font-weight: 700;
  font-size: inherit;
  line-height: 1.15;
  color: inherit;
}
.ypn-page :where(p, li, dd, blockquote) { font-size: inherit; line-height: inherit; color: inherit; }
.ypn-page :where(ul, ol) { list-style: none; }
.ypn-page :where(a) { color: inherit; text-decoration: inherit; background: none; }
.ypn-page :where(img, svg, picture, iframe) { display: block; max-width: 100%; }
.ypn-page :where(img) { height: auto; }
.ypn-page :where(button) { font: inherit; color: inherit; background: none; cursor: pointer; }
.ypn-page .ypn-picture { display: contents; }
.ypn-page :where(a, button):focus-visible { outline: 2px solid var(--ypn-color-text); outline-offset: 2px; }

/* ---- Hero-markering ---- */
.ypn-page .ypn-hero-mark {
  background-image: linear-gradient(var(--ypn-color-cta), var(--ypn-color-cta));
  background-repeat: no-repeat;
  background-position: 0 100%;
  background-size: 0 3px;
  padding-bottom: 2px;
  animation: ypn-hero-mark 1.8s ease-out 1s forwards;
}
@keyframes ypn-hero-mark { to { background-size: 100% 3px; } }
@media (prefers-reduced-motion: reduce) {
  .ypn-page .ypn-hero-mark { animation: none; background-size: 100% 3px; }
}

/* ---- Video ---- */
.ypn-page .ypn-video-frame { width: 100%; height: 100%; aspect-ratio: 9 / 16; border: 0; }

/* ---- Subnavigatie (partial) — blijft vrij van de hamburger van het thema ---- */
.ypn-page .ypn-subnav {
  display: grid;
  grid-template-columns: minmax(0, max-content) max-content;
  align-items: center;
  gap: 22px;
  background: var(--ypn-color-cream-3);
  border-bottom: 1px solid var(--ypn-color-cream-2);
  padding: 30px 20px 12px 160px;
  min-height: 75px;
}
.ypn-page .ypn-subnav__list { display: flex; flex-wrap: wrap; gap: 6px 22px; align-items: center; }
.ypn-page .ypn-subnav__link {
  display: inline-block;
  padding: 10px 0;
  font-size: calc(var(--ypn-base) * 0.88);
  font-weight: 500;
  color: var(--ypn-color-text);
  border-bottom: 2px solid transparent;
}
.ypn-page .ypn-subnav__link:hover { border-bottom-color: var(--ypn-color-sage); }
/* 4.1.10: actief item krijgt een kleur in plaats van een streepje. */
.ypn-page .ypn-subnav__link[aria-current="page"] { color: var(--ypn-color-sage); }
.ypn-page .ypn-subnav__cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  white-space: nowrap;
  margin-left: auto;
  background: var(--ypn-color-cta);
  color: var(--ypn-color-cta-text);
  border-radius: 999px;
  padding: 10px 18px;
  font-weight: 500;
  font-size: calc(var(--ypn-base) * 0.88);
}
@media (max-width: 899px) {
  .ypn-page .ypn-subnav { grid-template-columns: minmax(0, 1fr) auto; padding: 30px 20px 12px 85px; gap: 12px; min-height: 86px; }
  .ypn-page .ypn-subnav__links { min-width: 0; position: relative; }
  .ypn-page .ypn-subnav__links::after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    width: 18px;
    pointer-events: none;
    background: linear-gradient(to right, transparent, var(--ypn-color-cream-3));
  }
  .ypn-page .ypn-subnav__list {
    flex-wrap: nowrap;
    gap: 0 16px;
    overflow-x: auto;
    scrollbar-width: none;
    padding-right: 18px;
  }
  .ypn-page .ypn-subnav__list::-webkit-scrollbar { display: none; }
  .ypn-page .ypn-subnav__list > li { flex: 0 0 auto; }
  .ypn-page .ypn-subnav__link { white-space: nowrap; min-height: 44px; }
  .ypn-page .ypn-subnav__cta { margin-left: 0; }
}
/* 4.0.4: sticky op alle breedtes, mobiel max. twee regels zonder horizontaal scrollen, proeflesbalk onderaan. */
.ypn-page .ypn-subnav {
  position: sticky;
  top: var(--wp-admin--admin-bar--height, 0px);
  z-index: 1000;
  background: var(--ypn-color-cream-3);
  transition: box-shadow 0.2s ease;
}
.ypn-page .ypn-subnav.is-stuck { box-shadow: 0 2px 10px rgba(48, 48, 48, 0.1); }
.ypn-page .ypn-trialbar { display: none; }
@media (max-width: 899px) {
  .ypn-page .ypn-subnav { display: block; padding: 26px 16px 6px; min-height: 0; }
  .ypn-page .ypn-subnav.is-stuck { padding-top: 6px; }
  .ypn-page .ypn-subnav__links::after { content: none; }
  .ypn-page .ypn-subnav__list { flex-wrap: wrap; overflow: visible; padding-right: 0; gap: 0 14px; }
  /* Ruimte voor de themahamburger (left 20px, 45×45) op de eerste regel, zolang die in beeld is. */
  .ypn-page .ypn-subnav__list::before { content: ""; flex: 0 0 56px; height: 40px; }
  .ypn-page .ypn-subnav.is-stuck .ypn-subnav__list::before { content: none; }
  .ypn-page .ypn-subnav__link { font-size: 15px; min-height: 40px; padding: 9px 0; line-height: 20px; }
  .ypn-page .ypn-subnav__cta { display: none; }
  .ypn-page .ypn-trialbar {
    display: flex;
    align-items: center;
    justify-content: center;
    position: fixed;
    left: 12px;
    right: 12px;
    bottom: calc(12px + env(safe-area-inset-bottom, 0px));
    height: 52px;
    z-index: 1001;
    border-radius: 999px;
    background: var(--ypn-color-cta);
    color: var(--ypn-color-cta-text);
    font-weight: 500;
    font-size: var(--ypn-base);
    box-shadow: 0 4px 14px rgba(48, 48, 48, 0.2);
    transition: opacity 0.2s ease, transform 0.2s ease;
  }
  .ypn-page .ypn-trialbar.is-hidden { opacity: 0; transform: translateY(16px); pointer-events: none; visibility: hidden; }
}
@media (prefers-reduced-motion: reduce) {
  .ypn-page .ypn-subnav, .ypn-page .ypn-trialbar { transition: none; }
}

/* ---- Adresblok (partial) ---- */
.ypn-page .ypn-address {
  background: var(--ypn-color-sage);
  color: var(--ypn-color-cream-3);
  padding: 40px 20px;
}
.ypn-page .ypn-address__inner { max-width: 1152px; margin: 0 auto; display: flex; flex-wrap: wrap; gap: 16px 40px; align-items: center; }
.ypn-page .ypn-address__title { font-family: Arial, Helvetica, sans-serif; font-size: calc(var(--ypn-base) * 1.4); }
.ypn-page .ypn-address__link { text-decoration: underline; text-underline-offset: 3px; }

/* ---- Lesrooster-widget ---- */
.ypn-page .ypn-schedule-widget { max-width: 1152px; margin: 0 auto; padding: 24px 20px 40px; }
.ypn-page .ypn-schedule-widget__title { font-size: calc(var(--ypn-base) * 1.6); margin-bottom: 16px; }
.ypn-page .ypn-schedule-widget__mount { min-height: 480px; }
.ypn-page .ypn-schedule-widget__fallback { margin-top: 16px; }
.ypn-page .ypn-schedule-widget__fallback a { text-decoration: underline; }

/* ---- Special Classes (live uit Bsport) ---- */
.ypn-page .ypn-special { display: grid; gap: 12px; margin-top: 28px; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); }
.ypn-page .ypn-special__item { display: flex; gap: 14px; align-items: center; background: var(--ypn-color-cream-3); border: 1px solid var(--ypn-color-cream-2); border-radius: 10px; padding: 14px 16px; }
.ypn-page .ypn-special__date { display: flex; flex-direction: column; align-items: center; min-width: 48px; color: var(--ypn-color-sage); line-height: 1.1; }
.ypn-page .ypn-special__day { font-family: Arial, Helvetica, sans-serif; font-size: calc(var(--ypn-base) * 1.9); }
.ypn-page .ypn-special__month { font-size: 14px; text-transform: uppercase; letter-spacing: 0.08em; }
.ypn-page .ypn-special__body { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.ypn-page .ypn-special__title { font-weight: 500; line-height: 1.3; }
.ypn-page .ypn-special__meta { font-size: 14px; color: var(--ypn-color-sage); }
.ypn-page .ypn-special__cta { margin-top: 20px; }
.ypn-page .ypn-special__button { display: inline-flex; min-height: 44px; align-items: center; padding: 10px 22px; border-radius: 999px; border: 1px solid var(--ypn-color-text); font-size: calc(var(--ypn-base) * 0.88); font-weight: 500; }
.ypn-page .ypn-special-row { max-width: 1152px; margin: 0 auto; padding: 8px 20px 0; }
.ypn-page .ypn-special-row__title { font-size: calc(var(--ypn-base) * 1.3); }
.ypn-page .ypn-special--rooster { display: flex; overflow-x: auto; gap: 10px; margin-top: 12px; padding-bottom: 6px; }
.ypn-page .ypn-special--rooster .ypn-special__item { flex: 0 0 auto; max-width: 280px; padding: 10px 14px; }

/* ---- Tarieven ---- */
.ypn-page .ypn-pricing { max-width: 1152px; margin: 0 auto; padding: 48px 20px 56px; }
.ypn-page .ypn-pricing__head { text-align: center; }
.ypn-page .ypn-pricing__title { font-size: calc(var(--ypn-base) * 2.4); }
.ypn-page .ypn-pricing__proof { margin-top: 10px; color: var(--ypn-color-sage); }
.ypn-page .ypn-pricing__toggle { display: inline-flex; margin-top: 24px; padding: 4px; border-radius: 999px; background: var(--ypn-color-cream-2); }
.ypn-page .ypn-pricing__term { min-height: 44px; padding: 8px 22px; border-radius: 999px; font-weight: 500; }
.ypn-page .ypn-pricing__term[aria-pressed="true"] { background: var(--ypn-color-sage); color: var(--ypn-color-cream-3); }
.ypn-page .ypn-pricing__plans { display: grid; gap: 18px; margin-top: 32px; align-items: start; }
@media (min-width: 900px) { .ypn-page .ypn-pricing__plans { grid-template-columns: 1fr 1fr 1.12fr; } }
@media (max-width: 899px) { .ypn-page .ypn-plan--featured { order: -1; } .ypn-page .ypn-pricing__plans { display: flex; flex-direction: column; align-items: stretch; } }
.ypn-page .ypn-plan { background: var(--ypn-color-cream-3); border: 1px solid var(--ypn-color-cream-2); border-radius: 14px; padding: 26px 24px; }
.ypn-page .ypn-plan--featured { background: var(--ypn-color-sage); color: var(--ypn-color-cream-3); border-color: var(--ypn-color-sage); padding: 34px 28px; }
.ypn-page .ypn-plan__popular { display: inline-block; font-size: 14px; padding: 2px 10px; border-radius: 999px; background: var(--ypn-color-accent); color: var(--ypn-color-text); margin-bottom: 8px; }
.ypn-page .ypn-plan__name { font-size: calc(var(--ypn-base) * 1.6); }
.ypn-page .ypn-plan__freq { margin-top: 4px; font-size: 15px; opacity: 0.9; }
.ypn-page .ypn-plan__price { margin-top: 18px; }
.ypn-page .ypn-plan__amount { font-family: Arial, Helvetica, sans-serif; font-size: calc(var(--ypn-base) * 2.6); line-height: 1; }
.ypn-page .ypn-plan__period { font-size: 15px; }
.ypn-page .ypn-plan__badge { display: inline-block; margin-top: 8px; font-size: 14px; font-weight: 500; padding: 3px 10px; border-radius: 999px; background: var(--ypn-color-cream-2); color: var(--ypn-color-text); }
.ypn-page .ypn-plan__button, .ypn-page .ypn-pass__button, .ypn-page .ypn-pricing__trial-button { display: flex; justify-content: center; align-items: center; min-height: 48px; margin-top: 18px; border-radius: 999px; background: var(--ypn-color-cta); color: var(--ypn-color-cta-text); font-weight: 500; padding: 10px 22px; }
.ypn-page .ypn-plan__note { margin-top: 10px; font-size: 14px; opacity: 0.9; }
.ypn-page .ypn-plan__benefits { margin-top: 18px; display: grid; gap: 6px; font-size: 15px; }
.ypn-page .ypn-plan__benefits li { padding-left: 18px; position: relative; }
.ypn-page .ypn-plan__benefits li::before { content: ""; position: absolute; left: 0; top: 0.6em; width: 7px; height: 7px; border-radius: 50%; background: currentColor; opacity: 0.6; }
.ypn-page .ypn-plan__more { margin-top: 12px; font-size: 15px; }
.ypn-page .ypn-plan__more summary { cursor: pointer; text-decoration: underline; text-underline-offset: 3px; min-height: 44px; display: flex; align-items: center; }
.ypn-page .ypn-pass { display: flex; flex-wrap: wrap; gap: 12px 24px; align-items: center; justify-content: space-between; margin-top: 22px; background: var(--ypn-color-cream-3); border: 1px solid var(--ypn-color-cream-2); border-radius: 14px; padding: 18px 24px; }
.ypn-page .ypn-pass__name { font-size: calc(var(--ypn-base) * 1.3); }
.ypn-page .ypn-pass__detail { font-size: 15px; color: var(--ypn-color-sage); }
.ypn-page .ypn-pass__price { font-family: Arial, Helvetica, sans-serif; font-size: calc(var(--ypn-base) * 1.8); }
.ypn-page .ypn-pass__button { margin-top: 0; }
.ypn-page .ypn-pricing__trial { margin-top: 40px; text-align: center; background: var(--ypn-color-cream-2); border-radius: 14px; padding: 32px 20px; }
.ypn-page .ypn-pricing__trial h2 { font-size: calc(var(--ypn-base) * 1.6); }
.ypn-page .ypn-pricing__trial p { margin-top: 6px; color: var(--ypn-color-sage); }
.ypn-page .ypn-pricing__trial-button { display: inline-flex; }
.ypn-page .ypn-pricing__links, .ypn-page .ypn-pricing__sport { margin-top: 20px; text-align: center; font-size: 15px; }
.ypn-page .ypn-pricing__links a, .ypn-page .ypn-pricing__sport a { text-decoration: underline; text-underline-offset: 3px; }
.ypn-page .ypn-pricing__sport span { display: block; color: var(--ypn-color-sage); font-size: 14px; }
.ypn-page .ypn-card-link { text-decoration: none; } .ypn-page .ypn-card-link:hover { text-decoration: underline; text-underline-offset: 3px; }

/* Quiet secondary CTA; custom button colors override this through scoped tokens. */
.ypn-page a[data-ypn-button="hero_schedule"], .ypn-page a[data-ypn-button="closing_schedule"] {
  background: transparent; border-color: transparent; color: var(--ypn-color-text);
  text-decoration: underline; text-underline-offset: 3px;
}

/* ---- Lesrooster in huisstijl (4.0.5) ---- */
.ypn-page .ypn-sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.ypn-page .ypn-rooster { max-width: 1152px; margin: 0 auto; padding: 24px 20px 40px; }
.ypn-page .ypn-rooster__state { color: var(--ypn-color-sage); min-height: 240px; }
.ypn-page .ypn-rooster__controls { border-bottom: 1px solid var(--ypn-color-cream-2); padding-bottom: 14px; }
.ypn-page .ypn-rooster__days { display: flex; gap: 8px; overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x proximity; padding: 4px 2px 12px; scrollbar-width: none; }
.ypn-page .ypn-rooster__days::-webkit-scrollbar { display: none; }
.ypn-page .ypn-rooster__day { flex: 0 0 auto; min-height: 44px; padding: 0 16px; border-radius: 999px; border: 1px solid var(--ypn-color-sage); background: var(--ypn-color-cream-3); color: var(--ypn-color-text); font: inherit; font-size: 15px; cursor: pointer; scroll-snap-align: start; white-space: nowrap; }
.ypn-page .ypn-rooster__day.is-active { background: var(--ypn-color-sage); color: var(--ypn-color-cream-3); font-weight: 600; }
.ypn-page .ypn-rooster__day:focus-visible, .ypn-page .ypn-rooster__select select:focus-visible, .ypn-page .ypn-rooster__cta:focus-visible, .ypn-page .ypn-rooster__next:focus-visible { outline: 2px solid var(--ypn-color-cta); outline-offset: 2px; }
.ypn-page .ypn-rooster__filters { display: grid; grid-template-columns: repeat(2, minmax(0, 220px)); gap: 10px; }
.ypn-page .ypn-rooster__select select { width: 100%; min-height: 44px; padding: 0 12px; border: 1px solid var(--ypn-color-sage); border-radius: 8px; background: var(--ypn-color-cream-3); color: var(--ypn-color-text); font: inherit; font-size: 15px; }
.ypn-page .ypn-rooster__heading { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; margin: 24px 0 14px; }
.ypn-page .ypn-rooster__heading h3 { font-family: Arial, Helvetica, sans-serif; font-size: calc(var(--ypn-base) * 1.3); font-weight: 400; }
.ypn-page .ypn-rooster__heading span { font-size: 14px; color: var(--ypn-color-sage); white-space: nowrap; }
.ypn-page .ypn-rooster__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.ypn-page .ypn-rooster__card { display: flex; gap: 20px; padding: 22px; border: 1px solid var(--ypn-color-cream-2); border-radius: 12px; background: var(--ypn-color-cream-3); }
.ypn-page .ypn-rooster__card.is-special { border-color: var(--ypn-color-accent); box-shadow: inset 4px 0 0 var(--ypn-color-accent); }
.ypn-page .ypn-rooster__time { display: flex; flex-direction: column; gap: 4px; min-width: 52px; font-variant-numeric: tabular-nums; }
.ypn-page .ypn-rooster__time time { font-size: 19px; font-weight: 600; }
.ypn-page .ypn-rooster__time span { font-size: 14px; color: var(--ypn-color-sage); }
.ypn-page .ypn-rooster__class { flex: 1; min-width: 0; border-left: 1px solid var(--ypn-color-cream-2); padding-left: 20px; display: flex; flex-direction: column; align-items: flex-start; gap: 6px; }
.ypn-page .ypn-rooster__badge { font-size: 14px; font-weight: 600; color: var(--ypn-color-text); background: var(--ypn-color-accent); padding: 2px 10px; border-radius: 999px; }
.ypn-page .ypn-rooster__class h4 { font-size: 19px; font-weight: 600; line-height: 1.35; overflow-wrap: anywhere; }
.ypn-page .ypn-rooster__meta, .ypn-page .ypn-rooster__status { font-size: 14px; color: var(--ypn-color-sage); }
.ypn-page .ypn-rooster__status.is-full { color: var(--ypn-color-text); font-weight: 600; }
.ypn-page .ypn-rooster__cta { margin-top: 8px; display: inline-flex; align-items: center; min-height: 44px; padding: 0 20px; border-radius: 8px; background: var(--ypn-color-sage); color: var(--ypn-color-cream-3); font-size: 15px; font-weight: 600; text-decoration: none; }
.ypn-page .ypn-rooster__cta:hover { filter: brightness(1.1); }
.ypn-page .ypn-rooster__cta.is-outline { background: transparent; color: var(--ypn-color-text); border: 1px solid var(--ypn-color-sage); }
.ypn-page .ypn-rooster__cta.is-disabled { opacity: .55; background: var(--ypn-color-cream-2); color: var(--ypn-color-text); }
.ypn-page .ypn-rooster__empty { grid-column: 1 / -1; padding: 32px 20px; text-align: center; border: 1px dashed var(--ypn-color-sage); border-radius: 12px; }
.ypn-page .ypn-rooster__next { margin-top: 12px; min-height: 44px; padding: 0 18px; border-radius: 8px; border: 1px solid var(--ypn-color-sage); background: var(--ypn-color-cream-3); color: var(--ypn-color-text); font: inherit; font-size: 15px; cursor: pointer; }
.ypn-page .ypn-schedule-widget[hidden], .ypn-page .ypn-rooster[hidden] { display: none; }
@media (max-width: 767px) {
  .ypn-page .ypn-rooster { padding: 20px 16px 32px; }
  .ypn-page .ypn-rooster__filters { grid-template-columns: 1fr 1fr; }
  .ypn-page .ypn-rooster__grid { grid-template-columns: 1fr; }
  .ypn-page .ypn-rooster__card { padding: 18px; gap: 14px; }
  .ypn-page .ypn-rooster__class { padding-left: 14px; }
}

/* ---- 4.0.8 FAQ-accordion ---- */
.ypn-page .ypn-faq { padding: 64px 20px; background: var(--ypn-color-cream-3); }
.ypn-page .ypn-pricing .ypn-faq { background: transparent; padding: 40px 0; }
.ypn-page .ypn-faq__inner { max-width: 760px; margin: 0 auto; }
.ypn-page .ypn-faq__title { font-size: calc(var(--ypn-base) * 1.9); margin-bottom: 20px; }
.ypn-page .ypn-faq__item { border-top: 1px solid rgba(48,48,48,.15); }
.ypn-page .ypn-faq__item:last-child { border-bottom: 1px solid rgba(48,48,48,.15); }
.ypn-page .ypn-faq__q { font-family: Arial, Helvetica, sans-serif; font-size: inherit; }
.ypn-page .ypn-faq__btn { all: unset; box-sizing: border-box; display: flex; width: 100%; justify-content: space-between; gap: 16px; padding: 16px 0; min-height: 44px; cursor: pointer; font-weight: 600; color: var(--ypn-color-text); }
.ypn-page .ypn-faq__btn::after { content: "+"; font-weight: 400; font-size: 1.3em; line-height: 1; color: var(--ypn-color-sage); }
.ypn-page .ypn-faq__btn[aria-expanded="true"]::after { content: "–"; }
.ypn-page .ypn-faq__btn:focus-visible { outline: 2px solid var(--ypn-color-sage); outline-offset: 4px; }
.ypn-page .ypn-faq__a { padding: 0 0 18px; }
.ypn-page .ypn-faq__a[hidden] { display: none; }
.ypn-page .ypn-faq__a a { color: var(--ypn-color-sage); text-decoration: underline; }

/* ---- 4.2.9 Mobiel: vaste volgorde H1 -> intro -> compacte CTA -> foto -> module, rustige witruimte ---- */
@media (max-width: 767px) {
  body.ypn-site-active .ypn-page #ypn-hero, .ypn-page #ypn-hero { display: block; }
  .ypn-page #ypn-hero > div:first-child { display: block !important; }
  .ypn-page #ypn-hero .ypn-hero__text { display: block !important; order: 0 !important; padding: 36px 24px 0 !important; }
  .ypn-page #ypn-hero .ypn-hero__h1 {
    font-size: 31px !important; line-height: 1.2 !important; letter-spacing: -0.01em !important;
    margin: 0 0 22px !important; padding: 0 !important;
  }
  .ypn-page #ypn-hero .ypn-hero__intro {
    font-size: 17px !important; line-height: 1.55 !important; letter-spacing: 0 !important;
    margin: 0 0 26px !important; padding: 0 !important;
  }
  body.ypn-site-active .ypn-page #ypn-hero a.ypn-hero__cta {
    display: inline-flex !important; width: auto !important; max-width: 100%; min-height: 48px;
    align-items: center; justify-content: center; text-align: center;
    padding: 12px 24px !important; margin: 0 0 30px !important; border-radius: 999px !important;
    position: static !important; transform: none !important; float: none !important;
    background: var(--ypn-color-cta); color: var(--ypn-color-cta-text); font-size: 16px; font-weight: 600; line-height: 1.2;
  }
  .ypn-page #ypn-hero .ypn-hero__media {
    display: block !important; order: 0 !important; margin: 0 24px !important;
    height: 220px !important; aspect-ratio: auto !important; border-radius: 16px !important; overflow: hidden;
  }
  .ypn-page #ypn-hero .ypn-hero__media img { width: 100%; height: 220px !important; object-fit: cover; object-position: center; }
  .ypn-page #ypn-hero .ypn-hero-snel { width: 100%; box-sizing: border-box; margin: 0 !important; padding: 32px 24px 32px !important; }
  .ypn-page #ypn-hero .ypn-snel--home { padding: 22px !important; }
  .ypn-page #ypn-hero .ypn-snel__title { font-size: 26px !important; line-height: 1.2 !important; margin: 0 0 10px !important; }
  .ypn-page #ypn-hero .ypn-snel__sub { font-size: 17px !important; line-height: 1.5 !important; margin: 0 0 18px !important; }
  .ypn-page #ypn-hero .ypn-snel__label { margin-top: 0; }
}
@media (min-width: 768px) { .ypn-page #ypn-hero a.ypn-hero__cta { display: none !important; } }

/* ---- 4.2.9 Mobiele header met hamburgermenu ---- */
.ypn-page .ypn-subnav__mbar { display: none; }
@media (max-width: 767px) {
  body.ypn-site-active .ypn-page .ypn-subnav, .ypn-page .ypn-subnav.is-stuck {
    display: block !important; padding: 0 !important; min-height: 0 !important;
  }
  .ypn-page .ypn-subnav__mbar {
    display: flex; align-items: center; gap: 8px; height: 64px; padding: 0 12px 0 24px; box-sizing: border-box;
  }
  .ypn-page .ypn-subnav__mbrand {
    flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
    font-size: 13px; letter-spacing: 0.1em; text-transform: uppercase !important; color: var(--ypn-color-text);
  }
  body.ypn-site-active .ypn-page a.ypn-subnav__mcta {
    flex: 0 0 auto; display: inline-flex !important; width: auto !important; align-items: center; justify-content: center;
    min-height: 44px; padding: 8px 16px !important; margin: 0 !important; border-radius: 999px;
    background: var(--ypn-color-cta); color: var(--ypn-color-cta-text); font-size: 14px; font-weight: 600; white-space: nowrap;
  }
  .ypn-page .ypn-subnav__toggle {
    flex: 0 0 auto; display: inline-flex !important; align-items: center; justify-content: center;
    width: 44px; height: 44px; padding: 0 !important; margin: 0 !important; border: 0 !important; border-radius: 999px;
    background: transparent !important; color: var(--ypn-color-text) !important; box-shadow: none !important;
  }
  .ypn-page .ypn-subnav__toggle .ypn-ico-close { display: none; }
  .ypn-page .ypn-subnav.is-open .ypn-subnav__toggle .ypn-ico-open { display: none; }
  .ypn-page .ypn-subnav.is-open .ypn-subnav__toggle .ypn-ico-close { display: block; }
  .ypn-page .ypn-subnav__links { display: none !important; }
  .ypn-page .ypn-subnav.is-open .ypn-subnav__links { display: block !important; border-top: 1px solid var(--ypn-color-cream-2); }
  .ypn-page .ypn-subnav__list, .ypn-page .ypn-subnav.is-stuck .ypn-subnav__list { display: flex !important; flex-direction: column !important; gap: 0 !important; padding: 6px 0 !important; }
  .ypn-page .ypn-subnav__list::before { content: none !important; }
  .ypn-page .ypn-subnav__list > li:first-child { display: none; }
  .ypn-page .ypn-subnav__link { display: flex !important; width: 100%; min-height: 48px; align-items: center; justify-content: flex-start; text-align: left; padding: 0 24px !important; font-size: 16px !important; border: 0 !important; }
  .ypn-page .ypn-subnav__cta { display: none !important; }
}

/* 4.2.4: rustige mobiele hero, compacte bewijsregel, sociale iconen */
.ypn-page .ypn-hero-proof-m { display: none; }
@media (max-width: 767px) {
  .ypn-page .ypn-hide-m { display: none !important; }
  .ypn-page .ypn-hero-proof-m { display: block; order: 99; max-width: 72rem; margin: 0 auto; padding: 0 20px 24px; font-size: 14px; color: var(--ypn-color-sage); }
}
.ypn-page .ypn-address__icons { display: flex; gap: 8px; margin-top: 8px; }
.ypn-page .ypn-address__icon { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; border-radius: 999px; color: inherit; }
.ypn-page .ypn-address__icon:hover { background: rgba(0,0,0,.06); }
.ypn-page .ypn-address__icon:focus-visible { outline: 2px solid currentColor; outline-offset: 2px; }

/* 4.2.5: review-marquee van links naar rechts (klassen staan ongemoeid in de HTML) */
@keyframes ypn-marquee { from { transform: translateX(0); } to { transform: translateX(-50%); } }
@keyframes ypn-marquee-reversed { from { transform: translateX(-50%); } to { transform: translateX(0); } }
.ypn-page .ypn-marquee-track { width: max-content; animation: ypn-marquee 55s linear infinite; will-change: transform; }
.ypn-page .ypn-marquee-reverse { animation-name: ypn-marquee-reversed; }
.ypn-page .ypn-marquee-track:hover, .ypn-page .ypn-marquee-track:focus-within { animation-play-state: paused; }
@media (prefers-reduced-motion: reduce) { .ypn-page .ypn-marquee-track { animation: none; } }

/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */
@supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
    .ypn-page, .ypn-page [class], .ypn-page [class]::before, .ypn-page [class]::after {
      --tw-translate-x: 0;
      --tw-translate-y: 0;
      --tw-translate-z: 0;
      --tw-rotate-x: initial;
      --tw-rotate-y: initial;
      --tw-rotate-z: initial;
      --tw-skew-x: initial;
      --tw-skew-y: initial;
      --tw-scroll-snap-strictness: proximity;
      --tw-space-y-reverse: 0;
      --tw-space-x-reverse: 0;
      --tw-border-style: solid;
      --tw-gradient-position: initial;
      --tw-gradient-from: #0000;
      --tw-gradient-via: #0000;
      --tw-gradient-to: #0000;
      --tw-gradient-stops: initial;
      --tw-gradient-via-stops: initial;
      --tw-gradient-from-position: 0%;
      --tw-gradient-via-position: 50%;
      --tw-gradient-to-position: 100%;
      --tw-leading: initial;
      --tw-font-weight: initial;
      --tw-tracking: initial;
      --tw-ordinal: initial;
      --tw-slashed-zero: initial;
      --tw-numeric-figure: initial;
      --tw-numeric-spacing: initial;
      --tw-numeric-fraction: initial;
      --tw-shadow: 0 0 #0000;
      --tw-shadow-color: initial;
      --tw-shadow-alpha: 100%;
      --tw-inset-shadow: 0 0 #0000;
      --tw-inset-shadow-color: initial;
      --tw-inset-shadow-alpha: 100%;
      --tw-ring-color: initial;
      --tw-ring-shadow: 0 0 #0000;
      --tw-inset-ring-color: initial;
      --tw-inset-ring-shadow: 0 0 #0000;
      --tw-ring-inset: initial;
      --tw-ring-offset-width: 0px;
      --tw-ring-offset-color: #fff;
      --tw-ring-offset-shadow: 0 0 #0000;
      --tw-outline-style: solid;
      --tw-blur: initial;
      --tw-brightness: initial;
      --tw-contrast: initial;
      --tw-grayscale: initial;
      --tw-hue-rotate: initial;
      --tw-invert: initial;
      --tw-opacity: initial;
      --tw-saturate: initial;
      --tw-sepia: initial;
      --tw-drop-shadow: initial;
      --tw-drop-shadow-color: initial;
      --tw-drop-shadow-alpha: 100%;
      --tw-drop-shadow-size: initial;
      --tw-backdrop-blur: initial;
      --tw-backdrop-brightness: initial;
      --tw-backdrop-contrast: initial;
      --tw-backdrop-grayscale: initial;
      --tw-backdrop-hue-rotate: initial;
      --tw-backdrop-invert: initial;
      --tw-backdrop-opacity: initial;
      --tw-backdrop-saturate: initial;
      --tw-backdrop-sepia: initial;
      --tw-duration: initial;
      --tw-ease: initial;
      --tw-content: "";
      --tw-animation-delay: 0s;
      --tw-animation-direction: normal;
      --tw-animation-duration: initial;
      --tw-animation-fill-mode: none;
      --tw-animation-iteration-count: 1;
      --tw-enter-blur: 0;
      --tw-enter-opacity: 1;
      --tw-enter-rotate: 0;
      --tw-enter-scale: 1;
      --tw-enter-translate-x: 0;
      --tw-enter-translate-y: 0;
      --tw-exit-blur: 0;
      --tw-exit-opacity: 1;
      --tw-exit-rotate: 0;
      --tw-exit-scale: 1;
      --tw-exit-translate-x: 0;
      --tw-exit-translate-y: 0;
    }
  }

.ypn-page {
    --font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue",
      "Noto Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji",
      "Segoe UI Symbol", "Noto Color Emoji";
    --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono",
      "Courier New", monospace;
    --color-black: #000;
    --spacing: calc(var(--ypn-base) * .25);
    --container-sm: calc(var(--ypn-base) * 24);
    --container-md: calc(var(--ypn-base) * 28);
    --container-lg: calc(var(--ypn-base) * 32);
    --container-xl: calc(var(--ypn-base) * 36);
    --container-2xl: calc(var(--ypn-base) * 42);
    --container-4xl: calc(var(--ypn-base) * 56);
    --container-6xl: calc(var(--ypn-base) * 72);
    --text-xs: 14px;
    --text-xs--line-height: calc(1 / .75);
    --text-sm: calc(var(--ypn-base) * .875);
    --text-sm--line-height: calc(1.25 / .875);
    --text-base: calc(var(--ypn-base) * 1);
    --text-base--line-height: calc(1.5 / 1);
    --text-lg: calc(var(--ypn-base) * 1.125);
    --text-lg--line-height: calc(1.75 / 1.125);
    --text-xl: calc(var(--ypn-base) * 1.25);
    --text-xl--line-height: calc(1.75 / 1.25);
    --text-2xl: calc(var(--ypn-base) * 1.5);
    --text-2xl--line-height: calc(2 / 1.5);
    --text-3xl: calc(var(--ypn-base) * 1.875);
    --text-3xl--line-height: calc(2.25 / 1.875);
    --text-4xl: calc(var(--ypn-base) * 2.25);
    --text-4xl--line-height: calc(2.5 / 2.25);
    --text-5xl: calc(var(--ypn-base) * 3);
    --text-5xl--line-height: 1;
    --text-6xl: calc(var(--ypn-base) * 3.75);
    --text-6xl--line-height: 1;
    --text-7xl: calc(var(--ypn-base) * 4.5);
    --text-7xl--line-height: 1;
    --font-weight-normal: 400;
    --font-weight-medium: 500;
    --font-weight-semibold: 600;
    --font-weight-bold: 700;
    --tracking-tight: -.025em;
    --tracking-widest: .1em;
    --leading-tight: 1.25;
    --leading-relaxed: 1.625;
    --radius-md: calc(var(--radius) - 2px);
    --radius-lg: var(--radius);
    --ease-in-out: cubic-bezier(.4, 0, .2, 1);
    --animate-pulse: pulse 2s cubic-bezier(.4, 0, .6, 1) infinite;
    --blur-sm: 8px;
    --aspect-video: 16 / 9;
    --default-transition-duration: .15s;
    --default-transition-timing-function: cubic-bezier(.4, 0, .2, 1);
    --default-font-family: var(--font-sans);
    --default-mono-font-family: var(--font-mono);
    --font-display: Arial, Helvetica, sans-serif;
    --font-body: Arial, Helvetica, sans-serif;
    --color-background: var(--background);
    --color-foreground: var(--foreground);
    --color-border: var(--border);
  }

.ypn-page {
    -webkit-text-size-adjust: 100%;
    -moz-tab-size: 4;
    tab-size: 4;
    line-height: 1.5;
    font-family: var(--default-font-family, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");
    font-feature-settings: var(--default-font-feature-settings, normal);
    font-variation-settings: var(--default-font-variation-settings, normal);
    -webkit-tap-highlight-color: transparent;
  }

@supports (not ((-webkit-appearance: -apple-pay-button))) or (contain-intrinsic-size: 1px) {
  }

.ypn-page {
    background-color: var(--color-background);
    color: var(--color-foreground);
    font-family: var(--font-body);
  }

.ypn-page .ypn-absolute-dc4d {
    position: absolute;
  }

.ypn-page .ypn-relative-99c4 {
    position: relative;
  }

.ypn-page .ypn-inset-0-5f1c {
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
  }

.ypn-page .ypn-isolate-1540 {
    isolation: isolate;
  }

.ypn-page .ypn-z-0-42a1 {
    z-index: calc(0 * -1);
  }

.ypn-page .ypn-mx-5-c32d {
    margin-inline: calc(var(--spacing) * 5);
  }

.ypn-page .ypn-mx-auto-3e01 {
    margin-inline-start: auto;
    margin-inline-end: auto;
  }

.ypn-page .ypn-mt-0-5-f8e4 {
    margin-top: calc(var(--spacing) * .5);
  }

.ypn-page .ypn-mt-1-cc2c {
    margin-top: var(--spacing);
  }

.ypn-page .ypn-mt-2-2c93 {
    margin-top: calc(var(--spacing) * 2);
  }

.ypn-page .ypn-mt-3-c38d {
    margin-top: calc(var(--spacing) * 3);
  }

.ypn-page .ypn-mt-4-7335 {
    margin-top: calc(var(--spacing) * 4);
  }

.ypn-page .ypn-mt-5-7dff {
    margin-top: calc(var(--spacing) * 5);
  }

.ypn-page .ypn-mt-6-42b3 {
    margin-top: calc(var(--spacing) * 6);
  }

.ypn-page .ypn-mt-7-99f4 {
    margin-top: calc(var(--spacing) * 7);
  }

.ypn-page .ypn-mt-8-2125 {
    margin-top: calc(var(--spacing) * 8);
  }

.ypn-page .ypn-mt-9-7f2a {
    margin-top: calc(var(--spacing) * 9);
  }

.ypn-page .ypn-mt-12-2045 {
    margin-top: calc(var(--spacing) * 12);
  }

.ypn-page .ypn-mb-4-b42c {
    margin-bottom: calc(var(--spacing) * 4);
  }

.ypn-page .ypn-flex-897a {
    display: flex;
  }

.ypn-page .ypn-grid-ff4a {
    display: grid;
  }

.ypn-page .ypn-hidden-662f {
    display: none;
  }

.ypn-page .ypn-inline-flex-4fb2 {
    display: inline-flex;
  }

.ypn-page .ypn-aspect-3-2-e07e {
    aspect-ratio: 3 / 2;
  }

.ypn-page .ypn-aspect-4-3-eee8 {
    aspect-ratio: 4 / 3;
  }

.ypn-page .ypn-aspect-9-16-46be {
    aspect-ratio: 9 / 16;
  }

.ypn-page .ypn-aspect-16-9-13cf {
    aspect-ratio: 16 / 9;
  }

.ypn-page .ypn-aspect-square-1212 {
    aspect-ratio: 1;
  }

.ypn-page .ypn-h-5-530b {
    height: calc(var(--spacing) * 5);
  }

.ypn-page .ypn-h-9-a46c {
    height: calc(var(--spacing) * 9);
  }

.ypn-page .ypn-h-11-eb20 {
    height: calc(var(--spacing) * 11);
  }

.ypn-page .ypn-h-12-e762 {
    height: calc(var(--spacing) * 12);
  }

.ypn-page .ypn-h-220px-77d8 {
    height: 220px;
  }

.ypn-page .ypn-h-full-6c96 {
    height: 100%;
  }

.ypn-page .ypn-min-h-11-2ac5 {
    min-height: calc(var(--spacing) * 11);
  }

.ypn-page .ypn-min-h-44px-204d {
    min-height: 44px;
  }

.ypn-page .ypn-w-5-b64d {
    width: calc(var(--spacing) * 5);
  }

.ypn-page .ypn-w-11-178f {
    width: calc(var(--spacing) * 11);
  }

.ypn-page .ypn-w-12-cd48 {
    width: calc(var(--spacing) * 12);
  }

.ypn-page .ypn-w-17rem-8cbd {
    width: calc(var(--ypn-base) * 17);
  }

.ypn-page .ypn-w-full-d486 {
    width: 100%;
  }

.ypn-page .ypn-max-w-2xl-fcb5 {
    max-width: var(--container-2xl);
  }

.ypn-page .ypn-max-w-4xl-b3a9 {
    max-width: var(--container-4xl);
  }

.ypn-page .ypn-max-w-6xl-a0d1 {
    max-width: var(--container-6xl);
  }

.ypn-page .ypn-max-w-220px-159e {
    max-width: 220px;
  }

.ypn-page .ypn-max-w-full-b390 {
    max-width: 100%;
  }

.ypn-page .ypn-max-w-md-c5ab {
    max-width: var(--container-md);
  }

.ypn-page .ypn-max-w-xl-22be {
    max-width: var(--container-xl);
  }

.ypn-page .ypn-min-w-0-179d {
    min-width: 0;
  }

.ypn-page .ypn-flex-1-f8d8 {
    flex: 1;
  }

.ypn-page .ypn-shrink-0-0ff4 {
    flex-shrink: 0;
  }

.ypn-page .ypn-cursor-pointer-d44c {
    cursor: pointer;
  }

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

.ypn-page .ypn-grid-cols-2-92d2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

.ypn-page .ypn-flex-col-f66b {
    flex-direction: column;
  }

.ypn-page .ypn-flex-wrap-6197 {
    flex-wrap: wrap;
  }

.ypn-page .ypn-items-center-5418 {
    align-items: center;
  }

.ypn-page .ypn-items-start-769d {
    align-items: flex-start;
  }

.ypn-page .ypn-items-stretch-49a6 {
    align-items: stretch;
  }

.ypn-page .ypn-justify-between-79b7 {
    justify-content: space-between;
  }

.ypn-page .ypn-justify-center-4b73 {
    justify-content: center;
  }

.ypn-page .ypn-gap-2-ce81 {
    gap: calc(var(--spacing) * 2);
  }

.ypn-page .ypn-gap-3-62c1 {
    gap: calc(var(--spacing) * 3);
  }

.ypn-page .ypn-gap-4-5238 {
    gap: calc(var(--spacing) * 4);
  }

.ypn-page .ypn-gap-5-c9ff {
    gap: calc(var(--spacing) * 5);
  }

.ypn-page .ypn-gap-6-996d {
    gap: calc(var(--spacing) * 6);
  }

.ypn-page .ypn-gap-10-50a8 {
    gap: calc(var(--spacing) * 10);
  }

.ypn-page :where(.ypn-space-y-1-6eba > :not(:last-child)) {
    --tw-space-y-reverse: 0;
    margin-block-start: calc(var(--spacing) * var(--tw-space-y-reverse));
    margin-block-end: calc(var(--spacing) * calc(1 - var(--tw-space-y-reverse)));
  }

.ypn-page :where(.ypn-space-y-4-eeef > :not(:last-child)) {
    --tw-space-y-reverse: 0;
    margin-block-start: calc(calc(var(--spacing) * 4) * var(--tw-space-y-reverse));
    margin-block-end: calc(calc(var(--spacing) * 4) * calc(1 - var(--tw-space-y-reverse)));
  }

.ypn-page .ypn-gap-x-2-d916 {
    column-gap: calc(var(--spacing) * 2);
  }

.ypn-page .ypn-overflow-hidden-9384 {
    overflow: hidden;
  }

.ypn-page .ypn-rounded-full-fee2 {
    border-radius: 2147483647px;
  }

.ypn-page .ypn-rounded-lg-e7aa {
    border-radius: var(--radius);
  }

.ypn-page .ypn-rounded-md-d55f {
    border-radius: calc(var(--radius) - 2px);
  }

.ypn-page .ypn-rounded-none-2971 {
    border-radius: 0;
  }

.ypn-page .ypn-rounded-xl-ccd0 {
    border-radius: calc(var(--radius) + 4px);
  }

.ypn-page .ypn-border-2de4 {
    border-style: var(--tw-border-style);
    border-width: 1px;
  }

.ypn-page .ypn-border-t-22d4 {
    border-top-style: var(--tw-border-style);
    border-top-width: 1px;
  }

.ypn-page .ypn-border-b-5bdb {
    border-bottom-style: var(--tw-border-style);
    border-bottom-width: 1px;
  }

.ypn-page .ypn-border-dashed-71be {
    --tw-border-style: dashed;
    border-style: dashed;
  }

.ypn-page .ypn-border-border-c4a3 {
    border-color: var(--border);
  }

.ypn-page .ypn-border-foreground-a623 {
    border-color: var(--foreground);
  }

.ypn-page .ypn-border-input-1d3e {
    border-color: var(--input);
  }

.ypn-page .ypn-border-primary-foreground-40-f7e1 {
    border-color: var(--primary-foreground);
  }

@supports (color: color-mix(in lab, red, red)) {
    .ypn-page .ypn-border-primary-foreground-40-f7e1 {
      border-color: color-mix(in oklab, var(--primary-foreground) 40%, transparent);
    }
  }

.ypn-page .ypn-border-secondary-25-241d {
    border-color: var(--secondary);
  }

@supports (color: color-mix(in lab, red, red)) {
    .ypn-page .ypn-border-secondary-25-241d {
      border-color: color-mix(in oklab, var(--secondary) 25%, transparent);
    }
  }

.ypn-page .ypn-bg-background-9ebd,
.ypn-page .ypn-bg-background-95-8ea4 {
    background-color: var(--background);
  }

@supports (color: color-mix(in lab, red, red)) {
    .ypn-page .ypn-bg-background-95-8ea4 {
      background-color: color-mix(in oklab, var(--background) 95%, transparent);
    }
  }

.ypn-page .ypn-bg-card-15eb {
    background-color: var(--card);
  }

.ypn-page .ypn-bg-foreground-94ad {
    background-color: var(--foreground);
  }

.ypn-page .ypn-bg-muted-54d1 {
    background-color: var(--muted);
  }

.ypn-page .ypn-bg-primary-4c3d {
    background-color: var(--primary);
  }

.ypn-page .ypn-bg-primary-foreground-da6a {
    background-color: var(--primary-foreground);
  }

.ypn-page .ypn-bg-primary-70-8757 {
    background-color: var(--primary);
  }

@supports (color: color-mix(in lab, red, red)) {
    .ypn-page .ypn-bg-primary-70-8757 {
      background-color: color-mix(in oklab, var(--primary) 70%, transparent);
    }
  }

.ypn-page .ypn-bg-sand-1cd3,
.ypn-page .ypn-bg-sand-60-9ac7 {
    background-color: var(--sand);
  }

@supports (color: color-mix(in lab, red, red)) {
    .ypn-page .ypn-bg-sand-60-9ac7 {
      background-color: color-mix(in oklab, var(--sand) 60%, transparent);
    }
  }

.ypn-page .ypn-bg-secondary-ea47,
.ypn-page .ypn-bg-secondary-10-cb5c {
    background-color: var(--secondary);
  }

@supports (color: color-mix(in lab, red, red)) {
    .ypn-page .ypn-bg-secondary-10-cb5c {
      background-color: color-mix(in oklab, var(--secondary) 10%, transparent);
    }
  }

.ypn-page .ypn-bg-transparent-2639 {
    background-color: #0000;
  }

.ypn-page .ypn-object-cover-b8dd {
    object-fit: cover;
  }

.ypn-page .ypn-object-center-40-50b1 {
    object-position: center 40%;
  }

.ypn-page .ypn-p-0-1958 {
    padding: 0;
  }

.ypn-page .ypn-p-5-13d6 {
    padding: calc(var(--spacing) * 5);
  }

.ypn-page .ypn-p-6-6adb {
    padding: calc(var(--spacing) * 6);
  }

.ypn-page .ypn-px-3-d4de {
    padding-inline: calc(var(--spacing) * 3);
  }

.ypn-page .ypn-px-4-7f48 {
    padding-inline: calc(var(--spacing) * 4);
  }

.ypn-page .ypn-px-5-2f01 {
    padding-inline: calc(var(--spacing) * 5);
  }

.ypn-page .ypn-px-6-36ca {
    padding-inline: calc(var(--spacing) * 6);
  }

.ypn-page .ypn-py-1-7176 {
    padding-block: var(--spacing);
  }

.ypn-page .ypn-py-2-f812 {
    padding-block: calc(var(--spacing) * 2);
  }

.ypn-page .ypn-py-2-5-58ed {
    padding-block: calc(var(--spacing) * 2.5);
  }

.ypn-page .ypn-py-3-013c {
    padding-block: calc(var(--spacing) * 3);
  }

.ypn-page .ypn-py-8-cbf6 {
    padding-block: calc(var(--spacing) * 8);
  }

.ypn-page .ypn-py-9-dd9c {
    padding-block: calc(var(--spacing) * 9);
  }

.ypn-page .ypn-py-10-c7c8 {
    padding-block: calc(var(--spacing) * 10);
  }

.ypn-page .ypn-py-12-d7d6 {
    padding-block: calc(var(--spacing) * 12);
  }

.ypn-page .ypn-py-14-1123 {
    padding-block: calc(var(--spacing) * 14);
  }

.ypn-page .ypn-py-16-9cfb {
    padding-block: calc(var(--spacing) * 16);
  }

.ypn-page .ypn-pt-5-aecf {
    padding-top: calc(var(--spacing) * 5);
  }

.ypn-page .ypn-pt-6-248f {
    padding-top: calc(var(--spacing) * 6);
  }

.ypn-page .ypn-pb-5-ee09 {
    padding-bottom: calc(var(--spacing) * 5);
  }

.ypn-page .ypn-pb-8-abed {
    padding-bottom: calc(var(--spacing) * 8);
  }

.ypn-page .ypn-pl-5-7fc9 {
    padding-left: calc(var(--spacing) * 5);
  }

.ypn-page .ypn-text-center-70df {
    text-align: center;
  }

.ypn-page .ypn-text-left-6e15 {
    text-align: left;
  }

.ypn-page .ypn-font-display-6f22 {
    font-family: var(--font-display);
  }

.ypn-page .ypn-text-2xl-c986 {
    font-size: var(--text-2xl);
    line-height: var(--tw-leading, var(--text-2xl--line-height));
  }

.ypn-page .ypn-text-3xl-5954 {
    font-size: var(--text-3xl);
    line-height: var(--tw-leading, var(--text-3xl--line-height));
  }

.ypn-page .ypn-text-4xl-10d5 {
    font-size: var(--text-4xl);
    line-height: var(--tw-leading, var(--text-4xl--line-height));
  }

.ypn-page .ypn-text-5xl-44ba {
    font-size: var(--text-5xl);
    line-height: var(--tw-leading, var(--text-5xl--line-height));
  }

.ypn-page .ypn-text-base-8698 {
    font-size: var(--text-base);
    line-height: var(--tw-leading, var(--text-base--line-height));
  }

.ypn-page .ypn-text-sm-65ab {
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
  }

.ypn-page .ypn-text-xl-29fc {
    font-size: var(--text-xl);
    line-height: var(--tw-leading, var(--text-xl--line-height));
  }

.ypn-page .ypn-text-xs-9d5b {
    font-size: var(--text-xs);
    line-height: var(--tw-leading, var(--text-xs--line-height));
  }

.ypn-page .ypn-text-11px-3eb3 {
    font-size: 14px;
  }

.ypn-page .ypn-text-15px-81e6 {
    font-size: 15px;
  }

.ypn-page .ypn-text-17px-6fa1 {
    font-size: 17px;
  }

.ypn-page .ypn-text-31px-8dc9 {
    font-size: 31px;
  }

.ypn-page .ypn-leading-6-3e6a {
    --tw-leading: calc(var(--spacing) * 6);
    line-height: calc(var(--spacing) * 6);
  }

.ypn-page .ypn-leading-7-0af2 {
    --tw-leading: calc(var(--spacing) * 7);
    line-height: calc(var(--spacing) * 7);
  }

.ypn-page .ypn-leading-0-98-017d {
    --tw-leading: .98;
    line-height: .98;
  }

.ypn-page .ypn-leading-1-5-321f {
    --tw-leading: 1.5;
    line-height: 1.5;
  }

.ypn-page .ypn-leading-1-15-e026 {
    --tw-leading: 1.15;
    line-height: 1.15;
  }

.ypn-page .ypn-leading-relaxed-cf40 {
    --tw-leading: var(--leading-relaxed);
    line-height: var(--leading-relaxed);
  }

.ypn-page .ypn-leading-tight-602a {
    --tw-leading: var(--leading-tight);
    line-height: var(--leading-tight);
  }

.ypn-page .ypn-font-medium-a9c8 {
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
  }

.ypn-page .ypn-tracking-0-2em-619c {
    --tw-tracking: .2em;
    letter-spacing: .2em;
  }

.ypn-page .ypn-tracking-0-16em-7e6f {
    --tw-tracking: .16em;
    letter-spacing: .16em;
  }

.ypn-page .ypn-tracking-0-18em-66f7 {
    --tw-tracking: .18em;
    letter-spacing: .18em;
  }

.ypn-page .ypn-tracking-0-25em-4cc8 {
    --tw-tracking: .25em;
    letter-spacing: .25em;
  }

.ypn-page .ypn-whitespace-normal-b89f {
    white-space: normal;
  }

.ypn-page .ypn-whitespace-nowrap-65ba {
    white-space: nowrap;
  }

.ypn-page .ypn-text-background-411e {
    color: var(--background);
  }

.ypn-page .ypn-text-card-foreground-91af {
    color: var(--card-foreground);
  }

.ypn-page .ypn-text-feature-heading-a430 {
    color: var(--feature-heading);
  }

.ypn-page .ypn-text-foreground-d24b {
    color: var(--foreground);
  }

.ypn-page .ypn-text-gold-25af {
    color: var(--gold);
  }

.ypn-page .ypn-text-muted-foreground-9fb9 {
    color: var(--muted-foreground);
  }

.ypn-page .ypn-text-primary-a72b {
    color: var(--primary);
  }

.ypn-page .ypn-text-primary-foreground-c241,
.ypn-page .ypn-text-primary-foreground-80-1be8 {
    color: var(--primary-foreground);
  }

@supports (color: color-mix(in lab, red, red)) {
    .ypn-page .ypn-text-primary-foreground-80-1be8 {
      color: color-mix(in oklab, var(--primary-foreground) 80%, transparent);
    }
  }

.ypn-page .ypn-text-secondary-foreground-be10,
.ypn-page .ypn-text-secondary-foreground-80-3df7 {
    color: var(--secondary-foreground);
  }

@supports (color: color-mix(in lab, red, red)) {
    .ypn-page .ypn-text-secondary-foreground-80-3df7 {
      color: color-mix(in oklab, var(--secondary-foreground) 80%, transparent);
    }
  }

.ypn-page .ypn-uppercase-2e99 {
    text-transform: uppercase;
  }

.ypn-page .ypn-not-italic-ff99 {
    font-style: normal;
  }

.ypn-page .ypn-no-underline-0eba {
    text-decoration-line: none;
  }

.ypn-page .ypn-underline-6dc7 {
    text-decoration-line: underline;
  }

.ypn-page .ypn-decoration-border-7faa {
    -webkit-text-decoration-color: var(--border);
    -webkit-text-decoration-color: var(--border);
    text-decoration-color: var(--border);
  }

.ypn-page .ypn-underline-offset-2-03da {
    text-underline-offset: 2px;
  }

.ypn-page .ypn-underline-offset-4-b961 {
    text-underline-offset: 4px;
  }

.ypn-page .ypn-shadow-3bf1 {
    --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, #0000001a), 0 1px 2px -1px var(--tw-shadow-color, #0000001a);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }

.ypn-page .ypn-shadow-none-1c18 {
    --tw-shadow: 0 0 #0000;
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }

.ypn-page .ypn-shadow-sm-5000 {
    --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, #0000001a), 0 1px 2px -1px var(--tw-shadow-color, #0000001a);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }

.ypn-page .ypn-transition-colors-9b04 {
    transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
  }

@media (hover: hover) {
    .ypn-page .ypn-hover-bg-accent-ed90:hover {
      background-color: var(--accent);
    }

    .ypn-page .ypn-hover-bg-card-9a45:hover {
      background-color: var(--card);
    }

    .ypn-page .ypn-hover-bg-primary-foreground--a3c6:hover {
      background-color: var(--primary-foreground);
    }

    @supports (color: color-mix(in lab, red, red)) {
      .ypn-page .ypn-hover-bg-primary-foreground--a3c6:hover {
        background-color: color-mix(in oklab, var(--primary-foreground) 10%, transparent);
      }
    }

    .ypn-page .ypn-hover-bg-primary-foreground--52bc:hover {
      background-color: var(--primary-foreground);
    }

    @supports (color: color-mix(in lab, red, red)) {
      .ypn-page .ypn-hover-bg-primary-foreground--52bc:hover {
        background-color: color-mix(in oklab, var(--primary-foreground) 90%, transparent);
      }
    }

    .ypn-page .ypn-hover-bg-primary-90-7728:hover {
      background-color: var(--primary);
    }

    @supports (color: color-mix(in lab, red, red)) {
      .ypn-page .ypn-hover-bg-primary-90-7728:hover {
        background-color: color-mix(in oklab, var(--primary) 90%, transparent);
      }
    }

    .ypn-page .ypn-hover-text-accent-foreground-b83c:hover {
      color: var(--accent-foreground);
    }

    .ypn-page .ypn-hover-text-muted-foreground-1296:hover {
      color: var(--muted-foreground);
    }

    .ypn-page .ypn-hover-text-primary-foregroun-817d:hover {
      color: var(--primary-foreground);
    }

    .ypn-page .ypn-hover-underline-a263:hover {
      text-decoration-line: underline;
    }

    .ypn-page .ypn-hover-opacity-80-36bd:hover {
      opacity: .8;
    }
  }

.ypn-page .ypn-focus-visible-ring-1-e43c:focus-visible {
    --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }

.ypn-page .ypn-focus-visible-ring-ring-8848:focus-visible {
    --tw-ring-color: var(--ring);
  }

.ypn-page .ypn-focus-visible-outline-792b:focus-visible {
    outline-style: var(--tw-outline-style);
    outline-width: 1px;
  }

.ypn-page .ypn-focus-visible-outline-2-0980:focus-visible {
    outline-style: var(--tw-outline-style);
    outline-width: 2px;
  }

.ypn-page .ypn-focus-visible-outline-offset-63b9:focus-visible {
    outline-offset: 2px;
  }

.ypn-page .ypn-focus-visible-outline-backgr-ab2e:focus-visible {
    outline-color: var(--background);
  }

.ypn-page .ypn-focus-visible-outline-curren-bba7:focus-visible {
    outline-color: currentColor;
  }

.ypn-page .ypn-focus-visible-outline-none-089e:focus-visible {
    --tw-outline-style: none;
    outline-style: none;
  }

.ypn-page .ypn-disabled-pointer-events-none-256f:disabled {
    pointer-events: none;
  }

.ypn-page .ypn-disabled-cursor-not-allowed-5e5d:disabled {
    cursor: not-allowed;
  }

.ypn-page .ypn-disabled-opacity-50-c1c9:disabled {
    opacity: .5;
  }

@media (min-width: 640px) {

    .ypn-page .ypn-sm-aspect-2-1-cc68 {
      aspect-ratio: 2;
    }

    .ypn-page .ypn-sm-w-19rem-b161 {
      width: calc(var(--ypn-base) * 19);
    }

    .ypn-page .ypn-sm-w-auto-2d1a {
      width: auto;
    }

    .ypn-page .ypn-sm-grid-cols-2-0065 {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .ypn-page .ypn-sm-flex-row-48e9 {
      flex-direction: row;
    }

    .ypn-page .ypn-sm-flex-wrap-a9c6 {
      flex-wrap: wrap;
    }

    .ypn-page .ypn-sm-p-7-a25b {
      padding: calc(var(--spacing) * 7);
    }

    .ypn-page .ypn-sm-p-8-518a {
      padding: calc(var(--spacing) * 8);
    }

    .ypn-page .ypn-sm-px-8-62ba {
      padding-inline: calc(var(--spacing) * 8);
    }

    .ypn-page .ypn-sm-py-14-f2f4 {
      padding-block: calc(var(--spacing) * 14);
    }

    .ypn-page .ypn-sm-py-20-0ce0 {
      padding-block: calc(var(--spacing) * 20);
    }

    .ypn-page .ypn-sm-text-3xl-d902 {
      font-size: var(--text-3xl);
      line-height: var(--tw-leading, var(--text-3xl--line-height));
    }

    .ypn-page .ypn-sm-text-4xl-5f43 {
      font-size: var(--text-4xl);
      line-height: var(--tw-leading, var(--text-4xl--line-height));
    }

    .ypn-page .ypn-sm-text-5xl-fc40 {
      font-size: var(--text-5xl);
      line-height: var(--tw-leading, var(--text-5xl--line-height));
    }

    .ypn-page .ypn-sm-text-6xl-8ba1 {
      font-size: var(--text-6xl);
      line-height: var(--tw-leading, var(--text-6xl--line-height));
    }

    .ypn-page .ypn-sm-text-lg-7d95 {
      font-size: var(--text-lg);
      line-height: var(--tw-leading, var(--text-lg--line-height));
    }

    .ypn-page .ypn-sm-leading-8-3830 {
      --tw-leading: calc(var(--spacing) * 8);
      line-height: calc(var(--spacing) * 8);
    }
  }

@media (min-width: 768px) {

    .ypn-page .ypn-md-mx-0-a4a5 {
      margin-inline-start: 0;
      margin-inline-end: 0;
    }

    .ypn-page .ypn-md-mt-3-99c1 {
      margin-top: calc(var(--spacing) * 3);
    }

    .ypn-page .ypn-md-block-4000 {
      display: block;
    }

    .ypn-page .ypn-md-flex-201e {
      display: flex;
    }

    .ypn-page .ypn-md-hidden-9e1d {
      display: none;
    }

    .ypn-page .ypn-md-aspect-4-3-4bc5 {
      aspect-ratio: 4 / 3;
    }

    .ypn-page .ypn-md-aspect-auto-438a {
      aspect-ratio: auto;
    }

    .ypn-page .ypn-md-h-auto-0593 {
      height: auto;
    }

    .ypn-page .ypn-md-min-h-340px-5f4f {
      min-height: 340px;
    }

    .ypn-page .ypn-md-shrink-0-1025 {
      flex-shrink: 0;
    }

    .ypn-page .ypn-md-grid-cols-2-e0ec {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .ypn-page .ypn-md-grid-cols-minmax-0-1fr-au-0cef {
      grid-template-columns: minmax(0, 1fr) auto;
    }

    .ypn-page .ypn-md-flex-row-44a7 {
      flex-direction: row;
    }

    .ypn-page .ypn-md-items-center-9dbe {
      align-items: center;
    }

    .ypn-page .ypn-md-items-end-ba18 {
      align-items: flex-end;
    }

    .ypn-page .ypn-md-justify-between-b307 {
      justify-content: space-between;
    }

    .ypn-page .ypn-md-gap-8-7e23 {
      gap: calc(var(--spacing) * 8);
    }

    .ypn-page .ypn-md-gap-10-6a30 {
      gap: calc(var(--spacing) * 10);
    }

    .ypn-page .ypn-md-gap-12-6d59 {
      gap: calc(var(--spacing) * 12);
    }

    .ypn-page .ypn-md-rounded-2xl-1f7a {
      border-radius: calc(var(--radius) + 8px);
    }

    .ypn-page .ypn-md-px-0-fe6b {
      padding-inline-start: 0;
      padding-inline-end: 0;
    }

    .ypn-page .ypn-md-px-5-3117 {
      padding-inline: calc(var(--spacing) * 5);
    }

    .ypn-page .ypn-md-py-0-1990 {
      padding-block-start: 0;
      padding-block-end: 0;
    }

    .ypn-page .ypn-md-py-10-08d3 {
      padding-block: calc(var(--spacing) * 10);
    }

    .ypn-page .ypn-md-py-12-f5b9 {
      padding-block: calc(var(--spacing) * 12);
    }

    .ypn-page .ypn-md-py-14-76ed {
      padding-block: calc(var(--spacing) * 14);
    }

    .ypn-page .ypn-md-pt-10-6c3e {
      padding-top: calc(var(--spacing) * 10);
    }

    .ypn-page .ypn-md-pr-10-b137 {
      padding-right: calc(var(--spacing) * 10);
    }

    .ypn-page .ypn-md-text-3xl-da55 {
      font-size: var(--text-3xl);
      line-height: var(--tw-leading, var(--text-3xl--line-height));
    }

    .ypn-page .ypn-md-text-4xl-8b39 {
      font-size: var(--text-4xl);
      line-height: var(--tw-leading, var(--text-4xl--line-height));
    }

    .ypn-page .ypn-md-text-3rem-d430 {
      font-size: calc(var(--ypn-base) * 3);
    }

    .ypn-page .ypn-md-leading-1-1-7fe0 {
      --tw-leading: 1.1;
      line-height: 1.1;
    }
  }

@media (min-width: 1024px) {

    .ypn-page .ypn-lg-aspect-3-1-178a {
      aspect-ratio: 3;
    }

    .ypn-page .ypn-lg-grid-cols-2-8aa0 {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .ypn-page .ypn-lg-grid-cols-3-3d6d {
      grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .ypn-page .ypn-lg-grid-cols-4-634c {
      grid-template-columns: repeat(4, minmax(0, 1fr));
    }

    .ypn-page .ypn-lg-gap-6-4f10 {
      gap: calc(var(--spacing) * 6);
    }

    .ypn-page .ypn-lg-gap-10-343a {
      gap: calc(var(--spacing) * 10);
    }

    .ypn-page .ypn-lg-py-16-c30e {
      padding-block: calc(var(--spacing) * 16);
    }

    .ypn-page .ypn-lg-py-24-6f47 {
      padding-block: calc(var(--spacing) * 24);
    }

    .ypn-page .ypn-lg-text-right-13b8 {
      text-align: right;
    }

    .ypn-page .ypn-lg-text-7xl-c142 {
      font-size: var(--text-7xl);
      line-height: var(--tw-leading, var(--text-7xl--line-height));
    }
  }

.ypn-page .ypn-svg-pointer-events-none-8564 svg {
    pointer-events: none;
  }

.ypn-page .ypn-svg-size-4-3ae2 svg {
    width: calc(var(--spacing) * 4);
    height: calc(var(--spacing) * 4);
  }

.ypn-page .ypn-svg-shrink-0-5a3d svg {
    flex-shrink: 0;
  }

@property --tw-animation-delay {
  syntax: "*";
  inherits: false;
  initial-value: 0s;
}

@property --tw-animation-direction {
  syntax: "*";
  inherits: false;
  initial-value: normal;
}

@property --tw-animation-duration {
  syntax: "*";
  inherits: false
}

@property --tw-animation-fill-mode {
  syntax: "*";
  inherits: false;
  initial-value: none;
}

@property --tw-animation-iteration-count {
  syntax: "*";
  inherits: false;
  initial-value: 1;
}

@property --tw-enter-blur {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}

@property --tw-enter-opacity {
  syntax: "*";
  inherits: false;
  initial-value: 1;
}

@property --tw-enter-rotate {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}

@property --tw-enter-scale {
  syntax: "*";
  inherits: false;
  initial-value: 1;
}

@property --tw-enter-translate-x {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}

@property --tw-enter-translate-y {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}

@property --tw-exit-blur {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}

@property --tw-exit-opacity {
  syntax: "*";
  inherits: false;
  initial-value: 1;
}

@property --tw-exit-rotate {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}

@property --tw-exit-scale {
  syntax: "*";
  inherits: false;
  initial-value: 1;
}

@property --tw-exit-translate-x {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}

@property --tw-exit-translate-y {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}

.ypn-page {
  --radius: calc(var(--ypn-base) * .5);
  --font-display: Arial, Helvetica, sans-serif;
  --font-body: Arial, Helvetica, sans-serif;
  --background: #f7f4ef;
  --foreground: #3b4e43;
  --card: #faf8f5;
  --card-foreground: var(--foreground);
  --popover: var(--card);
  --popover-foreground: var(--foreground);
  --primary: #a6533b;
  --primary-foreground: var(--background);
  --secondary: #dfe5dc;
  --secondary-foreground: var(--foreground);
  --muted: var(--secondary);
  --muted-foreground: #686864;
  --accent: var(--secondary);
  --accent-foreground: var(--foreground);
  --destructive: #e40014;
  --destructive-foreground: #f8fafc;
  --border: #bcc4b8;
  --input: var(--border);
  --ring: var(--primary);
  --sand: var(--background);
  --gold: var(--primary);
  --feature-heading: #c93a01;
  --chart-1: var(--primary);
  --chart-2: var(--secondary);
  --chart-3: var(--foreground);
  --chart-4: var(--background);
  --chart-5: var(--muted-foreground);
  --sidebar: var(--secondary);
  --sidebar-foreground: var(--foreground);
  --sidebar-primary: var(--primary);
  --sidebar-primary-foreground: var(--primary-foreground);
  --sidebar-accent: var(--background);
  --sidebar-accent-foreground: var(--foreground);
  --sidebar-border: var(--border);
  --sidebar-ring: var(--ring);
}

@supports (color: color(display-p3 0 0 0)) {
  .ypn-page {
    --background: color(display-p3 .966552 .95726 .939251);
    --foreground: color(display-p3 .246533 .303751 .265665);
    --card: color(display-p3 .979456 .973148 .960912);
    --primary: color(display-p3 .608862 .342875 .254243);
    --secondary: color(display-p3 .878749 .897275 .865564);
    --muted-foreground: color(display-p3 .407844 .407843 .393595);
    --destructive: color(display-p3 .830323 .140383 .133196);
    --destructive-foreground: color(display-p3 .974377 .979815 .986207);
    --border: color(display-p3 .742715 .766366 .725801);
  }
}

@supports (color: lab(0% 0 0)) {
  .ypn-page {
    --background: lab(96.32% .391334 2.7861);
    --foreground: lab(31.2895% -9.69379 3.98974);
    --card: lab(97.6956% .261396 1.8852);
    --primary: lab(45.5668% 33.4555 30.3415);
    --secondary: lab(90.2884% -3.28669 3.66447);
    --muted-foreground: lab(43.9107% -.603974 2.2601);
    --destructive: lab(48.4493% 77.4328 61.5452);
    --destructive-foreground: lab(98.1434% -.369519 -1.05966);
    --border: lab(78.1836% -4.32652 4.84329);
  }
}

@keyframes ypn-marquee {
  from {
    transform: translateX(0);
  }

  to {
    transform: translateX(-50%);
  }
}

@keyframes ypn-marquee-reversed {
  from {
    transform: translateX(-50%);
  }

  to {
    transform: translateX(0);
  }
}

@property --tw-translate-x {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}

@property --tw-translate-y {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}

@property --tw-translate-z {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}

@property --tw-rotate-x {
  syntax: "*";
  inherits: false
}

@property --tw-rotate-y {
  syntax: "*";
  inherits: false
}

@property --tw-rotate-z {
  syntax: "*";
  inherits: false
}

@property --tw-skew-x {
  syntax: "*";
  inherits: false
}

@property --tw-skew-y {
  syntax: "*";
  inherits: false
}

@property --tw-scroll-snap-strictness {
  syntax: "*";
  inherits: false;
  initial-value: proximity;
}

@property --tw-space-y-reverse {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}

@property --tw-space-x-reverse {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}

@property --tw-border-style {
  syntax: "*";
  inherits: false;
  initial-value: solid;
}

@property --tw-gradient-position {
  syntax: "*";
  inherits: false
}

@property --tw-gradient-from {
  syntax: "<color>";
  inherits: false;
  initial-value: #0000;
}

@property --tw-gradient-via {
  syntax: "<color>";
  inherits: false;
  initial-value: #0000;
}

@property --tw-gradient-to {
  syntax: "<color>";
  inherits: false;
  initial-value: #0000;
}

@property --tw-gradient-stops {
  syntax: "*";
  inherits: false
}

@property --tw-gradient-via-stops {
  syntax: "*";
  inherits: false
}

@property --tw-gradient-from-position {
  syntax: "<length-percentage>";
  inherits: false;
  initial-value: 0%;
}

@property --tw-gradient-via-position {
  syntax: "<length-percentage>";
  inherits: false;
  initial-value: 50%;
}

@property --tw-gradient-to-position {
  syntax: "<length-percentage>";
  inherits: false;
  initial-value: 100%;
}

@property --tw-leading {
  syntax: "*";
  inherits: false
}

@property --tw-font-weight {
  syntax: "*";
  inherits: false
}

@property --tw-tracking {
  syntax: "*";
  inherits: false
}

@property --tw-ordinal {
  syntax: "*";
  inherits: false
}

@property --tw-slashed-zero {
  syntax: "*";
  inherits: false
}

@property --tw-numeric-figure {
  syntax: "*";
  inherits: false
}

@property --tw-numeric-spacing {
  syntax: "*";
  inherits: false
}

@property --tw-numeric-fraction {
  syntax: "*";
  inherits: false
}

@property --tw-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}

@property --tw-shadow-color {
  syntax: "*";
  inherits: false
}

@property --tw-shadow-alpha {
  syntax: "<percentage>";
  inherits: false;
  initial-value: 100%;
}

@property --tw-inset-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}

@property --tw-inset-shadow-color {
  syntax: "*";
  inherits: false
}

@property --tw-inset-shadow-alpha {
  syntax: "<percentage>";
  inherits: false;
  initial-value: 100%;
}

@property --tw-ring-color {
  syntax: "*";
  inherits: false
}

@property --tw-ring-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}

@property --tw-inset-ring-color {
  syntax: "*";
  inherits: false
}

@property --tw-inset-ring-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}

@property --tw-ring-inset {
  syntax: "*";
  inherits: false
}

@property --tw-ring-offset-width {
  syntax: "<length>";
  inherits: false;
  initial-value: 0;
}

@property --tw-ring-offset-color {
  syntax: "*";
  inherits: false;
  initial-value: #fff;
}

@property --tw-ring-offset-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}

@property --tw-outline-style {
  syntax: "*";
  inherits: false;
  initial-value: solid;
}

@property --tw-blur {
  syntax: "*";
  inherits: false
}

@property --tw-brightness {
  syntax: "*";
  inherits: false
}

@property --tw-contrast {
  syntax: "*";
  inherits: false
}

@property --tw-grayscale {
  syntax: "*";
  inherits: false
}

@property --tw-hue-rotate {
  syntax: "*";
  inherits: false
}

@property --tw-invert {
  syntax: "*";
  inherits: false
}

@property --tw-opacity {
  syntax: "*";
  inherits: false
}

@property --tw-saturate {
  syntax: "*";
  inherits: false
}

@property --tw-sepia {
  syntax: "*";
  inherits: false
}

@property --tw-drop-shadow {
  syntax: "*";
  inherits: false
}

@property --tw-drop-shadow-color {
  syntax: "*";
  inherits: false
}

@property --tw-drop-shadow-alpha {
  syntax: "<percentage>";
  inherits: false;
  initial-value: 100%;
}

@property --tw-drop-shadow-size {
  syntax: "*";
  inherits: false
}

@property --tw-backdrop-blur {
  syntax: "*";
  inherits: false
}

@property --tw-backdrop-brightness {
  syntax: "*";
  inherits: false
}

@property --tw-backdrop-contrast {
  syntax: "*";
  inherits: false
}

@property --tw-backdrop-grayscale {
  syntax: "*";
  inherits: false
}

@property --tw-backdrop-hue-rotate {
  syntax: "*";
  inherits: false
}

@property --tw-backdrop-invert {
  syntax: "*";
  inherits: false
}

@property --tw-backdrop-opacity {
  syntax: "*";
  inherits: false
}

@property --tw-backdrop-saturate {
  syntax: "*";
  inherits: false
}

@property --tw-backdrop-sepia {
  syntax: "*";
  inherits: false
}

@property --tw-duration {
  syntax: "*";
  inherits: false
}

@property --tw-ease {
  syntax: "*";
  inherits: false
}

@property --tw-content {
  syntax: "*";
  inherits: false;
  initial-value: "";
}

@keyframes ypn-pulse {
  50% {
    opacity: .5;
  }
}

@keyframes ypn-enter {
  from {
    opacity: var(--tw-enter-opacity, 1);
    transform: translate3d(var(--tw-enter-translate-x, 0),var(--tw-enter-translate-y, 0),0)scale3d(var(--tw-enter-scale, 1),var(--tw-enter-scale, 1),var(--tw-enter-scale, 1))rotate(var(--tw-enter-rotate, 0));
    filter: blur(var(--tw-enter-blur, 0));
  }
}

@keyframes ypn-exit {
  to {
    opacity: var(--tw-exit-opacity, 1);
    transform: translate3d(var(--tw-exit-translate-x, 0),var(--tw-exit-translate-y, 0),0)scale3d(var(--tw-exit-scale, 1),var(--tw-exit-scale, 1),var(--tw-exit-scale, 1))rotate(var(--tw-exit-rotate, 0));
    filter: blur(var(--tw-exit-blur, 0));
  }
}

@keyframes ypn-accordion-down {
  from {
    height: 0;
  }

  to {
    height: var(--radix-accordion-content-height, var(--bits-accordion-content-height, var(--reka-accordion-content-height, var(--kb-accordion-content-height, var(--ngp-accordion-content-height, auto)))));
  }
}

@keyframes ypn-accordion-up {
  from {
    height: var(--radix-accordion-content-height, var(--bits-accordion-content-height, var(--reka-accordion-content-height, var(--kb-accordion-content-height, var(--ngp-accordion-content-height, auto)))));
  }

  to {
    height: 0;
  }
}

@keyframes ypn-caret-blink {
  0%, 70%, 100% {
    opacity: 1;
  }

  20%, 50% {
    opacity: 0;
  }
}

.ypn-page .ypn-schedule {
  max-width: 1120px;
  color: var(--foreground);
  margin: auto;
  padding: 40px 24px 64px;
}

.ypn-page .ypn-schedule__intro {
  padding-bottom: 26px;
}

.ypn-page .ypn-schedule__eyebrow {
  text-transform: uppercase;
  letter-spacing: .18em;
  color: var(--muted-foreground);
  margin-bottom: 12px;
  font-size: 14px;
}

.ypn-page .ypn-schedule__intro h1 {
  font-family: var(--font-display);
  max-width: 700px;
  font-size: 36px;
  line-height: 1.2;
}

.ypn-page .ypn-schedule__intro p:last-child {
  color: var(--muted-foreground);
  max-width: 640px;
  margin-top: 14px;
  line-height: 1.6;
}

.ypn-page .ypn-schedule__action {
  min-height: 44px;
}

.ypn-page .ypn-schedule__content {
  border-top: 1px solid var(--border);
  max-width: 720px;
  color: var(--muted-foreground);
  margin-top: 32px;
  padding-top: 24px;
  line-height: 1.7;
}

.ypn-page .ypn-schedule__content h2 {
  font-family: var(--font-display);
  color: var(--foreground);
  margin-bottom: 10px;
  font-size: 21px;
}

.ypn-page .ypn-schedule__content p + p {
  margin-top: 12px;
}

.ypn-page .ypn-schedule__footer {
  border-top: 1px solid var(--border);
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  margin-top: 32px;
  padding-top: 24px;
  font-size: 14px;
  display: flex;
}

@keyframes ypn-yp-schedule-pulse {
  50% {
    opacity: .4;
  }
}

@media (max-width: 767px) {
  .ypn-page .ypn-schedule {
    padding: 28px 16px 40px;
  }

  .ypn-page .ypn-schedule__intro h1 {
    font-size: 28px;
  }
}

/* Knopkleur via token (AA) */
.ypn-page { --primary: var(--ypn-color-cta); --primary-foreground: var(--ypn-color-cta-text); --color-primary: var(--ypn-color-cta); --color-primary-foreground: var(--ypn-color-cta-text); }