/*! tailwindcss v4.3.0 | MIT License | https://tailwindcss.com */
        @layer properties;
        @layer theme, base, components, utilities;
        @layer theme {
          :root,
          :root {
            --font-sans:
              ui-sans-serif, system-ui, 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;
            --spacing: 0.25rem;
            --container-6xl: 72rem;
            --text-xs: 12px;
            --text-xs--line-height: calc(1 / 0.75);
            --text-sm: 14px;
            --text-sm--line-height: calc(1.25 / 0.875);
            --text-base: 16px;
            --text-base--line-height: calc(1.5 / 1);
            --text-lg: 18px;
            --text-lg--line-height: calc(1.75 / 1.125);
            --text-xl: 20px;
            --text-xl--line-height: calc(1.75 / 1.25);
            --text-2xl: 24px;
            --text-2xl--line-height: calc(2 / 1.5);
            --text-4xl: 38px;
            --text-4xl--line-height: calc(2.5 / 2.25);
            --text-5xl: 52px;
            --text-5xl--line-height: 1;
            --leading-relaxed: 1.625;
            --radius-sm: 6px;
            --radius-lg: 18px;
            --radius-xl: 28px;
            --radius-2xl: 1rem;
            --default-font-family: var(--font-sans);
            --default-mono-font-family: var(--font-mono);
            --color-background: #e8e5df;
            --color-foreground: #575f52;
            --color-border: #c8c5bf;
            --color-primary: #a4bec1;
            --color-primary-foreground: #ffffff;
            --color-secondary: #777f71;
            --color-secondary-foreground: #ffffff;
            --color-muted-foreground: #777f71;
            --color-dark: #575f52;
            --color-dark-foreground: #ffffff;
            --color-card: #ffffff;
            --color-accent-light: #d0e2e4;
            --font-body: Roboto, sans-serif;
            --font-headings: Nunito, sans-serif;
          }
        }
        @layer base {
          *,
          ::after,
          ::before,
          ::backdrop,
          ::file-selector-button {
            box-sizing: border-box;
            margin: 0;
            padding: 0;
            border: 0 solid;
          }
          html,
          :root {
            line-height: 1.5;
            -webkit-text-size-adjust: 100%;
            tab-size: 4;
            font-family: var(
              --default-font-family,
              ui-sans-serif,
              system-ui,
              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;
          }
          hr {
            height: 0;
            color: inherit;
            border-top-width: 1px;
          }
          abbr:where([title]) {
            -webkit-text-decoration: underline dotted;
            text-decoration: underline dotted;
          }
          h1,
          h2,
          h3,
          h4,
          h5,
          h6 {
            font-size: inherit;
            font-weight: inherit;
          }
          a {
            color: inherit;
            -webkit-text-decoration: inherit;
            text-decoration: inherit;
          }
          b,
          strong {
            font-weight: bolder;
          }
          code,
          kbd,
          samp,
          pre {
            font-family: var(
              --default-mono-font-family,
              ui-monospace,
              SFMono-Regular,
              Menlo,
              Monaco,
              Consolas,
              "Liberation Mono",
              "Courier New",
              monospace
            );
            font-feature-settings: var(
              --default-mono-font-feature-settings,
              normal
            );
            font-variation-settings: var(
              --default-mono-font-variation-settings,
              normal
            );
            font-size: 1em;
          }
          small {
            font-size: 80%;
          }
          sub,
          sup {
            font-size: 75%;
            line-height: 0;
            position: relative;
            vertical-align: baseline;
          }
          sub {
            bottom: -0.25em;
          }
          sup {
            top: -0.5em;
          }
          table {
            text-indent: 0;
            border-color: inherit;
            border-collapse: collapse;
          }
          :-moz-focusring {
            outline: auto;
          }
          progress {
            vertical-align: baseline;
          }
          summary {
            display: list-item;
          }
          ol,
          ul,
          menu {
            list-style: none;
          }
          img,
          svg,
          video,
          canvas,
          audio,
          iframe,
          embed,
          object {
            display: block;
            vertical-align: middle;
          }
          img,
          video {
            max-width: 100%;
            height: auto;
          }
          button,
          input,
          select,
          optgroup,
          textarea,
          ::file-selector-button {
            font: inherit;
            font-feature-settings: inherit;
            font-variation-settings: inherit;
            letter-spacing: inherit;
            color: inherit;
            border-radius: 0;
            background-color: transparent;
            opacity: 1;
          }
          :where(select:is([multiple], [size])) optgroup {
            font-weight: bolder;
          }
          :where(select:is([multiple], [size])) optgroup option {
            padding-inline-start: 20px;
          }
          ::file-selector-button {
            margin-inline-end: 4px;
          }
          ::placeholder {
            opacity: 1;
          }
          @supports (not (-webkit-appearance: -apple-pay-button)) or
            (contain-intrinsic-size: 1px) {
            ::placeholder {
              color: currentcolor;
              @supports (color: color-mix(in lab, red, red)) {
                color: color-mix(in oklab, currentcolor 50%, transparent);
              }
            }
          }
          textarea {
            resize: vertical;
          }
          ::-webkit-search-decoration {
            -webkit-appearance: none;
          }
          ::-webkit-date-and-time-value {
            min-height: 1lh;
            text-align: inherit;
          }
          ::-webkit-datetime-edit {
            display: inline-flex;
          }
          ::-webkit-datetime-edit-fields-wrapper {
            padding: 0;
          }
          ::-webkit-datetime-edit,
          ::-webkit-datetime-edit-year-field,
          ::-webkit-datetime-edit-month-field,
          ::-webkit-datetime-edit-day-field,
          ::-webkit-datetime-edit-hour-field,
          ::-webkit-datetime-edit-minute-field,
          ::-webkit-datetime-edit-second-field,
          ::-webkit-datetime-edit-millisecond-field,
          ::-webkit-datetime-edit-meridiem-field {
            padding-block: 0;
          }
          ::-webkit-calendar-picker-indicator {
            line-height: 1;
          }
          :-moz-ui-invalid {
            box-shadow: none;
          }
          button,
          input:where([type="button"], [type="reset"], [type="submit"]),
          ::file-selector-button {
            appearance: button;
          }
          ::-webkit-inner-spin-button,
          ::-webkit-outer-spin-button {
            height: auto;
          }
          [hidden]:where(:not([hidden="until-found"])) {
            display: none !important;
          }
        }
        @layer utilities {
          .pointer-events-none {
            pointer-events: none;
          }
          .absolute {
            position: absolute;
          }
          .relative {
            position: relative;
          }
          .top-0 {
            top: calc(var(--spacing) * 0);
          }
          .top-1\/2 {
            top: calc(1 / 2 * 100%);
          }
          .right-0 {
            right: calc(var(--spacing) * 0);
          }
          .right-8 {
            right: calc(var(--spacing) * 8);
          }
          .bottom-0 {
            bottom: calc(var(--spacing) * 0);
          }
          .left-0 {
            left: calc(var(--spacing) * 0);
          }
          .z-10 {
            z-index: 10;
          }
          .mx-auto {
            margin-inline: auto;
          }
          .mt-0\.5 {
            margin-top: calc(var(--spacing) * 0.5);
          }
          .mt-1 {
            margin-top: calc(var(--spacing) * 1);
          }
          .mt-2 {
            margin-top: calc(var(--spacing) * 2);
          }
          .mt-3 {
            margin-top: calc(var(--spacing) * 3);
          }
          .mt-6 {
            margin-top: calc(var(--spacing) * 6);
          }
          .mt-8 {
            margin-top: calc(var(--spacing) * 8);
          }
          .mt-10 {
            margin-top: calc(var(--spacing) * 10);
          }
          .mb-1 {
            margin-bottom: calc(var(--spacing) * 1);
          }
          .mb-3 {
            margin-bottom: calc(var(--spacing) * 3);
          }
          .mb-4 {
            margin-bottom: calc(var(--spacing) * 4);
          }
          .mb-5 {
            margin-bottom: calc(var(--spacing) * 5);
          }
          .mb-6 {
            margin-bottom: calc(var(--spacing) * 6);
          }
          .mb-8 {
            margin-bottom: calc(var(--spacing) * 8);
          }
          .mb-10 {
            margin-bottom: calc(var(--spacing) * 10);
          }
          .block {
            display: block;
          }
          .flex {
            display: flex;
          }
          .grid {
            display: grid;
          }
          .inline-block {
            display: inline-block;
          }
          .inline-flex {
            display: inline-flex;
          }
          .h-9 {
            height: calc(var(--spacing) * 9);
          }
          .h-10 {
            height: calc(var(--spacing) * 10);
          }
          .h-12 {
            height: calc(var(--spacing) * 12);
          }
          .h-full {
            height: 100%;
          }
          .w-9 {
            width: calc(var(--spacing) * 9);
          }
          .w-10 {
            width: calc(var(--spacing) * 10);
          }
          .w-12 {
            width: calc(var(--spacing) * 12);
          }
          .w-full {
            width: 100%;
          }
          .max-w-6xl {
            max-width: var(--container-6xl);
          }
          .flex-1 {
            flex: 1;
          }
          .flex-shrink-0 {
            flex-shrink: 0;
          }
          .grid-cols-2 {
            grid-template-columns: repeat(2, minmax(0, 1fr));
          }
          .grid-cols-3 {
            grid-template-columns: repeat(3, minmax(0, 1fr));
          }
          .flex-col {
            flex-direction: column;
          }
          .flex-wrap {
            flex-wrap: wrap;
          }
          .items-center {
            align-items: center;
          }
          .items-start {
            align-items: flex-start;
          }
          .justify-between {
            justify-content: space-between;
          }
          .justify-center {
            justify-content: center;
          }
          .gap-2 {
            gap: calc(var(--spacing) * 2);
          }
          .gap-3 {
            gap: calc(var(--spacing) * 3);
          }
          .gap-4 {
            gap: calc(var(--spacing) * 4);
          }
          .gap-5 {
            gap: calc(var(--spacing) * 5);
          }
          .gap-6 {
            gap: calc(var(--spacing) * 6);
          }
          .gap-8 {
            gap: calc(var(--spacing) * 8);
          }
          .gap-10 {
            gap: calc(var(--spacing) * 10);
          }
          .gap-16 {
            gap: calc(var(--spacing) * 16);
          }
          .space-y-2 {
            :where(& > :not(:last-child)) {
              --tw-space-y-reverse: 0;
              margin-block-start: calc(
                calc(var(--spacing) * 2) * var(--tw-space-y-reverse)
              );
              margin-block-end: calc(
                calc(var(--spacing) * 2) * calc(1 - var(--tw-space-y-reverse))
              );
            }
          }
          .space-y-4 {
            :where(& > :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))
              );
            }
          }
          .self-start {
            align-self: flex-start;
          }
          .overflow-hidden {
            overflow: hidden;
          }
          .rounded-2xl {
            border-radius: var(--radius-2xl);
          }
          .rounded-lg {
            border-radius: var(--radius-lg);
          }
          .rounded-xl {
            border-radius: var(--radius-xl);
          }
          .border {
            border-style: var(--tw-border-style);
            border-width: 1px;
          }
          .border-t {
            border-top-style: var(--tw-border-style);
            border-top-width: 1px;
          }
          .border-b {
            border-bottom-style: var(--tw-border-style);
            border-bottom-width: 1px;
          }
          .border-border {
            border-color: var(--color-border);
          }
          .border-secondary {
            border-color: var(--color-secondary);
          }
          .bg-accent-light {
            background-color: var(--color-accent-light);
          }
          .bg-background {
            background-color: var(--color-background);
          }
          .bg-card {
            background-color: var(--color-card);
          }
          .bg-dark {
            background-color: var(--color-dark);
          }
          .bg-primary {
            background-color: var(--color-primary);
          }
          .bg-primary-foreground {
            background-color: var(--color-primary-foreground);
          }
          .bg-secondary {
            background-color: var(--color-secondary);
          }
          .object-cover {
            object-fit: cover;
          }
          .p-7 {
            padding: calc(var(--spacing) * 7);
          }
          .px-3 {
            padding-inline: calc(var(--spacing) * 3);
          }
          .px-4 {
            padding-inline: calc(var(--spacing) * 4);
          }
          .px-5 {
            padding-inline: calc(var(--spacing) * 5);
          }
          .px-6 {
            padding-inline: calc(var(--spacing) * 6);
          }
          .px-7 {
            padding-inline: calc(var(--spacing) * 7);
          }
          .px-8 {
            padding-inline: calc(var(--spacing) * 8);
          }
          .py-1 {
            padding-block: calc(var(--spacing) * 1);
          }
          .py-2 {
            padding-block: calc(var(--spacing) * 2);
          }
          .py-3 {
            padding-block: calc(var(--spacing) * 3);
          }
          .py-4 {
            padding-block: calc(var(--spacing) * 4);
          }
          .py-5 {
            padding-block: calc(var(--spacing) * 5);
          }
          .py-12 {
            padding-block: calc(var(--spacing) * 12);
          }
          .py-14 {
            padding-block: calc(var(--spacing) * 14);
          }
          .py-20 {
            padding-block: calc(var(--spacing) * 20);
          }
          .pt-6 {
            padding-top: calc(var(--spacing) * 6);
          }
          .text-center {
            text-align: center;
          }
          .font-body {
            font-family: var(--font-body);
          }
          .font-headings {
            font-family: var(--font-headings);
          }
          .text-2xl {
            font-size: var(--text-2xl);
            line-height: var(--tw-leading, var(--text-2xl--line-height));
          }
          .text-4xl {
            font-size: var(--text-4xl);
            line-height: var(--tw-leading, var(--text-4xl--line-height));
          }
          .text-5xl {
            font-size: var(--text-5xl);
            line-height: var(--tw-leading, var(--text-5xl--line-height));
          }
          .text-base {
            font-size: var(--text-base);
            line-height: var(--tw-leading, var(--text-base--line-height));
          }
          .text-lg {
            font-size: var(--text-lg);
            line-height: var(--tw-leading, var(--text-lg--line-height));
          }
          .text-sm {
            font-size: var(--text-sm);
            line-height: var(--tw-leading, var(--text-sm--line-height));
          }
          .text-xl {
            font-size: var(--text-xl);
            line-height: var(--tw-leading, var(--text-xl--line-height));
          }
          .text-xs {
            font-size: var(--text-xs);
            line-height: var(--tw-leading, var(--text-xs--line-height));
          }
          .leading-relaxed {
            --tw-leading: var(--leading-relaxed);
            line-height: var(--leading-relaxed);
          }
          .whitespace-nowrap {
            white-space: nowrap;
          }
          .text-dark {
            color: var(--color-dark);
          }
          .text-dark-foreground {
            color: var(--color-dark-foreground);
          }
          .text-foreground {
            color: var(--color-foreground);
          }
          .text-muted-foreground {
            color: var(--color-muted-foreground);
          }
          .text-primary-foreground {
            color: var(--color-primary-foreground);
          }
          .text-secondary {
            color: var(--color-secondary);
          }
          .text-secondary-foreground {
            color: var(--color-secondary-foreground);
          }
          .underline {
            text-decoration-line: underline;
          }
        }
        @import url("https://fonts.googleapis.com/css2?family=Nunito:wght@400;500;600;700;800&family=Roboto:wght@400;500&display=swap");
        @property --tw-space-y-reverse {
          syntax: "*";
          inherits: false;
          initial-value: 0;
        }
        @property --tw-border-style {
          syntax: "*";
          inherits: false;
          initial-value: solid;
        }
        @property --tw-leading {
          syntax: "*";
          inherits: false;
        }
        @layer properties {
          @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or
            ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
            *,
            ::before,
            ::after,
            ::backdrop {
              --tw-space-y-reverse: 0;
              --tw-border-style: solid;
              --tw-leading: initial;
            }
          }
        }



        /* Exact Franken Zorg logo mark SVG is used for decorative background marks. */
        .fz-logo-mark-svg {
          display: block;
          overflow: visible;
        }

        /* =========================================================
           Responsive overrides - added by ChatGPT
           The Banani export contained fixed 1440px/min-width styling.
           These overrides preserve the visual design but make the page
           fluid on tablet and mobile screens.
           ========================================================= */
        html,
        body {
          width: 100%;
          max-width: 100%;
          overflow-x: hidden;
          background: var(--color-background, #e8e5df);
        }

        body {
          margin: 0;
        }

        .export-wrapper {
          width: 100% !important;
          max-width: 100% !important;
          min-height: auto !important;
          overflow-x: hidden !important;
          background-color: var(--color-background, #e8e5df) !important;
        }

        .bg-background.font-body[data-component="@screens/FrankenZorg.jsx"] {
          min-width: 0 !important;
          width: 100% !important;
          max-width: 100% !important;
          overflow-x: hidden;
        }

        .max-w-6xl {
          width: 100%;
          max-width: 72rem;
        }

        img,
        svg {
          max-width: 100%;
        }

        a[data-media-type="banani-button"] {
          cursor: pointer;
        }

        a:focus-visible,
        button:focus-visible {
          outline: 3px solid var(--color-dark, #575f52);
          outline-offset: 4px;
        }

        [style*="width: 460px"],
        [style*="width: 380px"],
        [style*="width: 240px"] {
          max-width: 100% !important;
        }

        @media (max-width: 1180px) {
          .max-w-6xl {
            max-width: calc(100% - 40px);
          }

          .gap-16 {
            gap: calc(var(--spacing) * 10) !important;
          }

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

          .text-5xl {
            font-size: 46px !important;
          }
        }

        @media (max-width: 900px) {
          .px-8 {
            padding-inline: 24px !important;
          }

          .py-20 {
            padding-block: 56px !important;
          }

          .py-14 {
            padding-block: 44px !important;
          }

          .py-12 {
            padding-block: 40px !important;
          }

          header .max-w-6xl {
            flex-direction: column;
            align-items: flex-start;
            gap: 18px;
          }

          header nav {
            width: 100%;
            flex-wrap: wrap;
            gap: 10px 16px;
          }

          header nav a {
            font-size: 13px !important;
          }

          section > .max-w-6xl.flex,
          footer .flex.items-start.justify-between {
            flex-direction: column;
            align-items: stretch;
          }

          section > .max-w-6xl.flex.items-center {
            align-items: stretch;
          }

          .grid-cols-2,
          .grid-cols-3 {
            grid-template-columns: 1fr !important;
          }

          [style*="width: 460px"],
          [style*="width: 380px"],
          [style*="width: 240px"] {
            width: 100% !important;
          }

          [style*="height: 420px"],
          [style*="height: 460px"],
          [style*="height: 300px"] {
            height: auto !important;
            min-height: 0 !important;
          }

          [style*="height: 420px"] img,
          [style*="height: 460px"] img,
          [style*="height: 300px"] img {
            width: 100%;
            height: auto !important;
          }

          [style*="height: 420px"] img,
          [style*="height: 300px"] img {
            aspect-ratio: 4 / 3;
          }

          [style*="height: 460px"] img {
            aspect-ratio: 4 / 5;
          }

          .text-5xl {
            font-size: clamp(38px, 8vw, 52px) !important;
          }

          .text-4xl {
            font-size: clamp(30px, 6vw, 38px) !important;
          }

          .text-2xl {
            font-size: 22px !important;
          }
        }

        @media (max-width: 640px) {
          .max-w-6xl {
            max-width: 100%;
          }

          .px-8,
          .px-7,
          .px-6,
          .px-5 {
            padding-inline: 20px !important;
          }

          .p-7 {
            padding: 22px !important;
          }

          .py-20 {
            padding-block: 44px !important;
          }

          .py-14 {
            padding-block: 36px !important;
          }

          .py-12 {
            padding-block: 32px !important;
          }

          header .max-w-6xl {
            padding: 18px 20px !important;
          }

          header img {
            height: 38px !important;
          }

          header nav {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 10px;
          }

          header nav a {
            white-space: normal !important;
            text-align: center;
            padding: 10px 8px !important;
            border-radius: 14px;
          }

          .flex.gap-4.mb-10,
          section:last-of-type .flex.gap-4,
          .font-body.text-base.text-foreground.leading-relaxed.space-y-4.mb-10 + .flex.gap-4 {
            flex-direction: column;
            align-items: stretch;
          }

          a.bg-dark,
          a.bg-primary-foreground,
          a.bg-primary,
          a.bg-card {
            text-align: center;
          }

          .flex.gap-4,
          .flex.gap-6,
          .flex.gap-8,
          .flex.gap-10 {
            flex-wrap: wrap;
          }

          .text-5xl {
            font-size: 36px !important;
            line-height: 1.08 !important;
          }

          .text-4xl {
            font-size: 30px !important;
            line-height: 1.15 !important;
          }

          .text-lg {
            font-size: 17px !important;
          }

          p[style*="max-width"],
          div[style*="max-width"] {
            max-width: 100% !important;
          }

          svg[width="500"] {
            width: 280px;
            height: 280px;
          }

          svg[width="400"] {
            width: 240px;
            height: 240px;
          }

          svg[width="320"] {
            width: 220px;
            height: 220px;
          }

          footer .flex.items-start.justify-between {
            gap: 28px;
          }

          footer .flex.gap-8 {
            flex-direction: column;
            gap: 12px;
          }
        }

        @media (max-width: 420px) {
          header nav {
            grid-template-columns: 1fr;
          }

          .px-8,
          .px-7,
          .px-6,
          .px-5 {
            padding-inline: 16px !important;
          }

          .p-7 {
            padding: 18px !important;
          }

          .text-5xl {
            font-size: 32px !important;
          }
        }



        /* =========================================================
           Hamburger navigation - added by ChatGPT
           Replaces the visible top menu with a clean white hamburger.
           ========================================================= */
        .fz-header,
        header[data-component="@components/FZNav.jsx"] {
          position: relative;
          z-index: 50;
        }

        .fz-header .fz-nav-inner,
        header[data-component="@components/FZNav.jsx"] .fz-nav-inner {
          position: relative;
          flex-direction: row !important;
          align-items: center !important;
          justify-content: space-between !important;
          gap: 16px !important;
        }

        .fz-menu-wrap {
          position: relative;
          display: flex;
          align-items: center;
          justify-content: flex-end;
        }

        .fz-menu-toggle {
          width: 46px;
          height: 46px;
          display: inline-flex;
          flex-direction: column;
          align-items: center;
          justify-content: center;
          gap: 6px;
          border-radius: 999px;
          border: 1px solid rgba(255, 255, 255, 0.45);
          background: rgba(255, 255, 255, 0.08);
          cursor: pointer;
          transition: background 160ms ease, border-color 160ms ease, transform 160ms ease;
        }

        .fz-menu-toggle:hover,
        .fz-menu-toggle:focus-visible {
          background: rgba(255, 255, 255, 0.18);
          border-color: rgba(255, 255, 255, 0.75);
        }

        .fz-menu-toggle-line {
          width: 22px;
          height: 2px;
          display: block;
          border-radius: 999px;
          background: #ffffff;
          transform-origin: center;
          transition: transform 180ms ease, opacity 180ms ease;
        }

        .fz-menu-toggle[aria-expanded="true"] .fz-menu-toggle-line:nth-child(1) {
          transform: translateY(8px) rotate(45deg);
        }

        .fz-menu-toggle[aria-expanded="true"] .fz-menu-toggle-line:nth-child(2) {
          opacity: 0;
        }

        .fz-menu-toggle[aria-expanded="true"] .fz-menu-toggle-line:nth-child(3) {
          transform: translateY(-8px) rotate(-45deg);
        }

        .fz-header .fz-menu-panel,
        header[data-component="@components/FZNav.jsx"] .fz-menu-panel {
          position: absolute;
          top: calc(100% + 12px);
          right: 0;
          width: min(320px, calc(100vw - 40px));
          display: none;
          flex-direction: column;
          gap: 6px;
          padding: 10px;
          border: 1px solid rgba(87, 95, 82, 0.14);
          border-radius: 20px;
          background: rgba(255, 255, 255, 0.96);
          box-shadow: 0 18px 55px rgba(87, 95, 82, 0.2);
          backdrop-filter: blur(10px);
        }

        .fz-header .fz-menu-panel.is-open,
        header[data-component="@components/FZNav.jsx"] .fz-menu-panel.is-open {
          display: flex !important;
        }

        .fz-menu-panel a {
          width: 100%;
          display: flex !important;
          align-items: center;
          justify-content: flex-start;
          padding: 13px 14px !important;
          border-radius: 14px;
          color: var(--color-dark, #575f52) !important;
          font-size: 14px !important;
          text-align: left !important;
          opacity: 1 !important;
          transition: background 160ms ease, color 160ms ease;
        }

        .fz-menu-panel a:hover,
        .fz-menu-panel a:focus-visible {
          background: var(--color-background, #e8e5df);
        }

        .fz-menu-panel a:last-child {
          justify-content: center;
          margin-top: 4px;
          background: var(--color-dark, #575f52) !important;
          color: #ffffff !important;
          font-weight: 700 !important;
        }

        @media (max-width: 900px) {
          .fz-header .fz-nav-inner,
          header[data-component="@components/FZNav.jsx"] .fz-nav-inner {
            padding: 18px 24px !important;
          }

          .fz-menu-toggle {
            width: 44px;
            height: 44px;
          }
        }

        @media (max-width: 640px) {
          .fz-header .fz-nav-inner,
          header[data-component="@components/FZNav.jsx"] .fz-nav-inner {
            padding: 16px 20px !important;
          }

          .fz-menu-panel {
            right: 0;
            width: calc(100vw - 40px);
          }
        }

      

        /* =========================================================
           Header update - desktop menu >= 800px, hamburger < 800px
           ========================================================= */
        .fz-menu-wrap {
          gap: 12px;
        }

        .fz-language-switch {
          display: inline-flex;
          align-items: center;
          justify-content: center;
          gap: 6px;
          min-height: 36px;
          padding: 6px 10px;
          border: 1px solid rgba(255, 255, 255, 0.5);
          border-radius: 999px;
          color: #ffffff;
          font-family: var(--font-headings, Nunito, sans-serif);
          font-size: 14px;
          font-weight: 700;
          line-height: 1;
          white-space: nowrap;
        }

        .fz-language-switch a {
          color: #ffffff !important;
          opacity: 0.72;
          text-decoration: none !important;
        }

        .fz-language-switch a.is-active,
        .fz-language-switch a[aria-current="page"] {
          opacity: 1;
        }

        .fz-language-switch span {
          opacity: 0.55;
        }

        @media (min-width: 800px) {
          .fz-header .fz-nav-inner,
          header[data-component="@components/FZNav.jsx"] .fz-nav-inner {
            flex-direction: row !important;
            align-items: center !important;
            justify-content: space-between !important;
            padding-top: 20px !important;
            padding-bottom: 20px !important;
          }

          .fz-menu-wrap {
            display: flex !important;
            align-items: center !important;
            justify-content: flex-end !important;
            gap: 16px !important;
            width: auto !important;
          }

          .fz-menu-toggle {
            display: none !important;
          }

          .fz-header .fz-menu-panel,
          header[data-component="@components/FZNav.jsx"] .fz-menu-panel {
            position: static !important;
            top: auto !important;
            right: auto !important;
            width: auto !important;
            display: flex !important;
            flex-direction: row !important;
            align-items: center !important;
            justify-content: flex-end !important;
            gap: 22px !important;
            padding: 0 !important;
            border: 0 !important;
            border-radius: 0 !important;
            background: transparent !important;
            box-shadow: none !important;
            backdrop-filter: none !important;
          }

          .fz-menu-panel a {
            width: auto !important;
            display: inline-flex !important;
            align-items: center !important;
            justify-content: center !important;
            padding: 8px 0 !important;
            border-radius: 0 !important;
            color: #ffffff !important;
            font-size: 14px !important;
            font-weight: 600 !important;
            line-height: 1.25 !important;
            text-align: left !important;
            white-space: nowrap !important;
            opacity: 0.92 !important;
            background: transparent !important;
          }

          .fz-menu-panel a:hover,
          .fz-menu-panel a:focus-visible {
            background: transparent !important;
            color: #ffffff !important;
            opacity: 1 !important;
            text-decoration: underline !important;
            text-underline-offset: 5px;
          }

          .fz-menu-panel a:last-child {
            width: auto !important;
            margin-top: 0 !important;
            padding: 10px 18px !important;
            border-radius: 18px !important;
            background: #ffffff !important;
            color: var(--color-dark, #575f52) !important;
            font-family: var(--font-headings, Nunito, sans-serif) !important;
            font-weight: 800 !important;
            text-decoration: none !important;
            opacity: 1 !important;
          }

          .fz-language-switch {
            order: 3;
          }
        }

        @media (max-width: 799px) {
          .fz-menu-wrap {
            gap: 10px !important;
          }

          .fz-menu-toggle {
            display: inline-flex !important;
          }

          .fz-language-switch {
            order: 1;
            min-height: 34px;
            padding: 5px 9px;
            font-size: 13px;
          }

          .fz-menu-toggle {
            order: 2;
          }

          .fz-header .fz-menu-panel,
          header[data-component="@components/FZNav.jsx"] .fz-menu-panel {
            order: 3;
          }

          .fz-header .fz-menu-panel:not(.is-open),
          header[data-component="@components/FZNav.jsx"] .fz-menu-panel:not(.is-open) {
            display: none !important;
          }

          .fz-header .fz-menu-panel.is-open,
          header[data-component="@components/FZNav.jsx"] .fz-menu-panel.is-open {
            display: flex !important;
          }

          .fz-menu-panel a {
            font-size: 14px !important;
          }
        }


        /* =========================================================
           Refinements requested after logo SVG version
           ========================================================= */
        .fz-hero-intro {
          font-size: 20px !important;
        }

        .fz-startup-copy {
          font-size: 18px !important;
        }

        .fz-about-copy,
        .fz-about-copy p {
          font-size: 18px !important;
        }

        .fz-practice-grid .fz-card-full {
          grid-column: 1 / -1 !important;
        }

        footer p,
        footer a,
        footer .text-sm {
          font-size: 16px !important;
        }

        footer .text-xs {
          font-size: 14px !important;
        }

        .fz-footer-general {
          font-size: 16px !important;
        }

        .fz-footer-general h3 {
          font-size: 18px !important;
        }

        @media (min-width: 800px) {
          .fz-menu-panel a {
            font-size: 16px !important;
          }

          .fz-language-switch {
            font-size: 16px !important;
          }
        }

        @media (max-width: 799px) {
          .fz-menu-panel a {
            font-size: 16px !important;
          }
        }

        @media (max-width: 900px) {
          .fz-hero-intro {
            font-size: 19px !important;
          }

          .fz-startup-copy,
          .fz-about-copy,
          .fz-about-copy p {
            font-size: 17px !important;
          }
        }


        /* =========================================================
           Further layout refinements - hero/header inspiration and
           practice-info layout update
           ========================================================= */
        .fz-hero-photo {
          position: relative;
          background-color: #a4bec1;
          background-image: linear-gradient(rgba(87,95,82,0.42), rgba(87,95,82,0.36)), url("https://frankenzorg.nl/sites/frankenzorg/media/tijdelijk/bg-header.webp");
          background-position: center center;
          background-size: cover;
          background-repeat: no-repeat;
        }

        .fz-hero-photo::after {
          content: "";
          position: absolute;
          inset: 0;
          background: linear-gradient(90deg, rgba(232,229,223,0.22) 0%, rgba(232,229,223,0.12) 36%, rgba(232,229,223,0.08) 100%);
          pointer-events: none;
        }

        .fz-hero-panel {
          position: relative;
          z-index: 1;
          max-width: 700px;
          padding: 36px 40px;
          border-radius: 28px;
          background: rgba(87,95,82,0.16);
          border: 1px solid rgba(255,255,255,0.22);
          backdrop-filter: blur(4px);
          -webkit-backdrop-filter: blur(4px);
          box-shadow: 0 12px 36px rgba(49, 56, 45, 0.14);
        }

        .fz-hero-photo .text-5xl {
          font-size: 56px !important;
          line-height: 1.08 !important;
        }

        .fz-hero-photo .fz-hero-intro {
          max-width: 640px !important;
        }

        .fz-practice-grid .fz-card-wide {
          grid-column: span 2 / span 2 !important;
        }

        @media (max-width: 900px) {
          .fz-hero-panel {
            padding: 28px 24px;
            max-width: 100%;
          }

          .fz-hero-photo .text-5xl {
            font-size: 44px !important;
          }
        }

        @media (max-width: 799px) {
          .fz-practice-grid .fz-card-wide {
            grid-column: auto !important;
          }
        }

        @media (max-width: 640px) {
          .fz-hero-panel {
            padding: 24px 18px;
            border-radius: 22px;
          }

          .fz-hero-photo .text-5xl {
            font-size: 34px !important;
          }
        }


        /* =========================================================
           Asset + typography refinements requested afterwards
           ========================================================= */
        .fz-hero-photo {
          background-image: linear-gradient(rgba(164,190,193,0.46), rgba(164,190,193,0.40)), url("https://frankenzorg.nl/sites/frankenzorg/media/tijdelijk/bg-header.webp") !important;
          background-position: center center !important;
          background-size: cover !important;
          background-repeat: no-repeat !important;
        }

        .fz-hero-photo::after {
          background: linear-gradient(90deg, rgba(232,229,223,0.10) 0%, rgba(232,229,223,0.06) 40%, rgba(232,229,223,0.04) 100%) !important;
        }

        @media (min-width: 800px) {
          .fz-menu-panel a {
            font-size: 18px !important;
          }
          .fz-language-switch {
            font-size: 18px !important;
          }
        }

        .fz-practice-grid h3 {
          font-size: 22px !important;
          line-height: 1.25 !important;
        }

        .fz-practice-grid .font-body.text-sm,
        .fz-practice-grid .font-body.text-sm p,
        .fz-practice-grid .font-body.text-sm a,
        .fz-practice-grid .font-body.text-sm div,
        .fz-practice-grid .font-body.text-sm span {
          font-size: 16px !important;
          line-height: 1.65 !important;
        }

        .fz-practice-grid p.font-headings {
          font-size: 18px !important;
          line-height: 1.45 !important;
        }

        .fz-practice-grid .text-xs {
          font-size: 14px !important;
        }

        footer p,
        footer a,
        footer .text-sm,
        .fz-footer-general {
          font-size: 18px !important;
          line-height: 1.7 !important;
        }

        footer .text-xs {
          font-size: 16px !important;
        }

        .fz-footer-general h3 {
          font-size: 20px !important;
        }


        /* =========================================================
           Final requested size refinements
           ========================================================= */
        @media (min-width: 800px) {
          .fz-menu-panel a {
            font-size: 20px !important;
          }
          .fz-language-switch {
            font-size: 20px !important;
          }
        }

        @media (max-width: 799px) {
          .fz-menu-panel a {
            font-size: 18px !important;
          }
        }

        .fz-practice-grid h3 {
          font-size: 24px !important;
          line-height: 1.25 !important;
        }

        .fz-practice-grid .font-body.text-sm,
        .fz-practice-grid .font-body.text-sm p,
        .fz-practice-grid .font-body.text-sm a,
        .fz-practice-grid .font-body.text-sm div,
        .fz-practice-grid .font-body.text-sm span {
          font-size: 18px !important;
          line-height: 1.65 !important;
        }

        .fz-practice-grid p.font-headings {
          font-size: 20px !important;
          line-height: 1.45 !important;
        }

        .fz-practice-grid .text-xs {
          font-size: 16px !important;
        }

        footer p,
        footer a,
        footer .text-sm,
        .fz-footer-general {
          font-size: 20px !important;
          line-height: 1.7 !important;
        }

        footer .text-xs {
          font-size: 18px !important;
        }

        .fz-footer-general h3 {
          font-size: 22px !important;
        }


        /* Exact uploaded assets override */
        .fz-hero-photo {
          background-image: linear-gradient(rgba(164,190,193,0.44), rgba(164,190,193,0.38)), url("https://frankenzorg.nl/sites/frankenzorg/media/tijdelijk/bg-header.webp") !important;
          background-position: center center !important;
          background-size: cover !important;
          background-repeat: no-repeat !important;
        }


        /* Correct logo + single-page language switch refinements */
        img[alt="Franken Zorg logo"] {
          height: 54px !important;
          width: auto !important;
          max-width: min(360px, 58vw) !important;
          object-fit: contain !important;
        }
        .fz-language-switch button {
          border: 0;
          background: transparent;
          color: #ffffff;
          font: inherit;
          cursor: pointer;
          padding: 0;
          opacity: 0.72;
        }
        .fz-language-switch button.is-active,
        .fz-language-switch button[aria-pressed="true"] {
          opacity: 1;
          text-decoration: underline;
          text-underline-offset: 4px;
        }
        .fz-language-switch button:focus-visible {
          outline: 2px solid #ffffff;
          outline-offset: 4px;
          border-radius: 6px;
        }
        @media (max-width: 640px) {
          img[alt="Franken Zorg logo"] {
            height: 42px !important;
            max-width: 220px !important;
          }
        }
    

        /* Final optimized asset version */
        .fz-hero-photo {
          background-image: linear-gradient(rgba(164,190,193,0.44), rgba(164,190,193,0.38)), url("https://frankenzorg.nl/sites/frankenzorg/media/tijdelijk/bg-header.webp") !important;
          background-position: center center !important;
          background-size: cover !important;
          background-repeat: no-repeat !important;
        }
        img[alt="Franken Zorg logo"] {
          height: 54px !important;
          width: auto !important;
          max-width: min(360px, 58vw) !important;
          object-fit: contain !important;
        }
        .fz-language-switch button {
          border: 0;
          background: transparent;
          color: #ffffff;
          font: inherit;
          cursor: pointer;
          padding: 0;
          opacity: 0.72;
        }
        .fz-language-switch button.is-active,
        .fz-language-switch button[aria-pressed="true"] {
          opacity: 1;
          text-decoration: underline;
          text-underline-offset: 4px;
        }
        .fz-language-switch button:focus-visible {
          outline: 2px solid #ffffff;
          outline-offset: 4px;
          border-radius: 6px;
        }
        @media (max-width: 640px) {
          img[alt="Franken Zorg logo"] {
            height: 42px !important;
            max-width: 220px !important;
          }
        }
    

        /* Final typography: Coolvetica headings, Open Sans body text.
           Note: place the licensed Coolvetica file at assets/fonts/Coolvetica-Rg.otf on deployment. */
        @font-face {
          font-family: "Coolvetica";
          src: url("assets/fonts/Coolvetica-Rg.otf") format("opentype");
          font-weight: 400 900;
          font-style: normal;
          font-display: swap;
        }

        :root {
          --font-headings: "Coolvetica", "Open Sans", Arial, sans-serif;
          --font-body: "Open Sans", Arial, sans-serif;
        }

        body,
        .font-body,
        p,
        li,
        a,
        button,
        input,
        textarea,
        select {
          font-family: var(--font-body) !important;
        }

        h1,
        h2,
        h3,
        h4,
        h5,
        h6,
        .font-headings,
        .fz-language-switch,
        .fz-menu-panel a:last-child {
          font-family: var(--font-headings) !important;
          letter-spacing: 0.01em;
        }

        .fz-menu-panel a {
          font-family: var(--font-body) !important;
        }