/* Style block 1, extracted from index.html */
  /* Hide ONLY the page content until preloader is ready */
  html.rk-preloading .page-wrapper,
  html.rk-preloading [data-page-container] {
    visibility: hidden;
  }

  /* Ensure preloader is visible and on top immediately */
  html.rk-preloading [data-preloader] {
    visibility: visible;
    display: block;
    position: fixed;
    inset: 0;
    z-index: 999999;
  }
  
    /* Prevent first-paint flash:
     hide dock targets until JS marks dock system ready */
  html:not([data-dock-ready]) [data-dock-target] {
    display: none !important;
  }

/* Style block 2, extracted from index.html */
  html.lenis, html.lenis body {
    height: auto;
  }

  .lenis.lenis-smooth {
    scroll-behavior: auto !important;
  }

  .lenis.lenis-smooth [data-lenis-prevent] {
    overscroll-behavior: contain;
  }

  .lenis.lenis-stopped {
    overflow: hidden;
  }

  .lenis.lenis-smooth iframe {
    pointer-events: none;
  }

/* Style block 3, extracted from index.html */
/* Nav Dark BG */
.navigation__dark-bg {
  transition: all 0.7s cubic-bezier(0.5, 0.5, 0, 1);
}
[data-menu-open="true"] .navigation__dark-bg {
  opacity: 0.15;
  visibility: visible;
}

/* Show/Hide content */
.centered-nav__content {
  transition: grid-template-rows 0.6s cubic-bezier(0.625, 0.05, 0, 1);
}
[data-menu-open="true"] .centered-nav__content {
  grid-template-rows: 1fr;
}

/* Nav content animation (menu items) */
[data-menu="item"] {
  transition: all 0.6s cubic-bezier(0.625, 0.05, 0, 1);
  opacity: 0;
  transform: translate(0px, 2em);
}
[data-menu-open="true"] [data-menu="item"] {
  opacity: 1;
  transform: translate(0px, 0em);
}

/* Link underline */
.hamburger-nav__a::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  width: 100%;
  height: 1px;
  background: currentColor;
  opacity: 0.2;
  transition-delay: inherit;
  transform: scaleX(0);
  transition: transform 0.6s cubic-bezier(.65, 0, 0, 1);
}
[data-menu-open="true"] .hamburger-nav__a::after {
  transform: scaleX(1);
}
.hamburger-nav__a:hover::after { opacity: 0.4; }

/* Link text slide */
.hamburger-nav__p {
  transition: transform 0.6s cubic-bezier(.65, 0, 0, 1);
  transform: translate(0px, 150%);
  transition-delay: inherit;
}
[data-menu-open="true"] .hamburger-nav__p {
  transform: translate(0px, 0%);
}

/* Active Link underline */
.hamburger-nav__a[aria-current]::after { opacity: 1; }

/* Hamburger Button animation */
.centered-nav__toggle .centered-nav__toggle-bar {
  transition: transform 0.6s cubic-bezier(.65, 0, 0, 1);
  transform: translateY(-0.25em) rotate(0.001deg);
}
.centered-nav__toggle:hover .centered-nav__toggle-bar {
  transform: translateY(0.25em) rotate(0.001deg);
}
.centered-nav__toggle .centered-nav__toggle-bar:nth-child(2) {
  transform: translateY(0.15em) rotate(0.001deg);
}
.centered-nav__toggle:hover .centered-nav__toggle-bar:nth-child(2) {
  transform: translateY(-0.15em) rotate(0.001deg);
}
[data-menu-open="true"] .centered-nav__toggle .centered-nav__toggle-bar {
  transform: translateY(0em) rotate(45deg);
}
[data-menu-open="true"] .centered-nav__toggle .centered-nav__toggle-bar:nth-child(2) {
  transform: translateY(0em) rotate(-45deg);
}

/* Style block 4, extracted from index.html */
/* ------------------------- Scaling system -------------------------------------------------- */

/* Desktop */
:root {
  --size-unit: 16; /* body font-size in design - no px */
  --size-container-ideal: 1920; /* screen-size in design - no px */
  --size-container-min: 992px;
  --size-container-max: 2240px;
  --size-container: clamp(var(--size-container-min), 100dvw, var(--size-container-max));
  --size-font: calc(var(--size-container) / (var(--size-container-ideal) / var(--size-unit)));
  --vh: 1vh; /* fallback before JS runs */
  --near-screen-height: 80dvh;
  --full-screen-height: 100dvh;
  --overflow-screen-height: 120dvh;
  --double-screen-height: 200dvh;
}

/* Tablet */
@media screen and (max-width: 991px) {
  :root {
    --size-container-ideal: 991; /* screen-size in design - no px */
    --size-container-min: 768px;
    --size-container-max: 991px;
    --near-screen-height: calc(var(--vh) * 80);
    --full-screen-height: calc(var(--vh) * 100);
    --overflow-screen-height: calc(var(--vh) * 120);
    --double-screen-height: calc(var(--vh) * 200);
  }
}

/* Mobile Landscape */
@media screen and (max-width: 767px) {
  :root {
    --size-container-ideal: 767; /* screen-size in design - no px */
    --size-container-min: 480px;
    --size-container-max: 767px;
  }
}

/* Mobile Portrait */
@media screen and (max-width: 479px) {
  :root {
    --size-container-ideal: 479; /* screen-size in design - no px */
    --size-container-min: 320px;
    --size-container-max: 479px;
  }
}

body {
  font-size: var(--size-font);
}

.container {
  max-width: var(--size-container);
  width: 100%;
  margin-left: auto;
  margin-right: auto;
}

.container.medium {
  max-width: calc(var(--size-container) * 0.85);
}

.container.small {
  max-width: calc(var(--size-container) * 0.7);
}

/* Style block 5, extracted from index.html */
/* Animation */
[data-bunny-background-init] :is(.bunny-bg__placeholder, .bunny-bg__loading) {
  transition: opacity 0.3s linear, visibility 0.3s linear;
}

/* Placeholder */
[data-bunny-background-init][data-player-status="playing"] .bunny-bg__placeholder,
[data-bunny-background-init][data-player-status="paused"] .bunny-bg__placeholder,
[data-bunny-background-init][data-player-activated="true"][data-player-status="ready"] .bunny-bg__placeholder {
  opacity: 0;
  visibility: hidden;
}

/* Play/Pause */
[data-bunny-background-init][data-player-status="playing"] .bunny-bg__play-svg,
[data-bunny-background-init][data-player-status="loading"] .bunny-bg__play-svg {
  display: none;
}

[data-bunny-background-init][data-player-status="playing"] .bunny-bg__pause-svg,
[data-bunny-background-init][data-player-status="loading"] .bunny-bg__pause-svg{
  display: block;
}

/* Loading */
[data-bunny-background-init][data-player-status="loading"] .bunny-bg__loading {
  opacity: 1;
  visibility: visible;
}

/* Style block 6, extracted from index.html */
/* ------------------------- Transitions -------------------------------------------------- */

h1, h2, h3, h4, h5, h6, p, span, a, li, ul, ol {
  transition-property: background, font-size;
  transition-duration: 0.3s;
  transition-timing-function: cubic-bezier(.77,0,.18,1);
}

img, hero_unicon-bg {
  transition-property: box-shadow, background, filter;
  transition-duration: 0.3s;
  transition-timing-function: cubic-bezier(.77,0,.18,1);
}

/* Style block 7, extracted from index.html */
/* Hide element with attribute when CMS doesn't contain items */
 [data-cms-section]:not(:has(.w-dyn-item)) {
 display: none;
 }

/* Style block 8, extracted from index.html */
  /* Cursor Selection */
  ::selection {
    background: var(--_theme---cursor-select-bg);
    color: var(--_theme---cursor-select-text);
  }

  ::-moz-selection { /* Code for Firefox */
    background: var(--_theme---cursor-select-bg);
    color: var(--_theme---cursor-select-text);
  }

/* Style block 9, extracted from index.html */
 /* These classes are never overwritten */
.hide {
  display: none !important;
}

@media screen and (min-width: 992px) {
    .hide, .hide-desktop {
        display: none !important;
    }
}

@media screen and (min-width: 480px) {
    .hide, .hide-desktop-tablet {
        display: none !important;
    }
}

@media screen and (max-width: 991px) {
    .hide, .hide-tablet-mobile {
        display: none !important;
    }
}
  @media screen and (max-width: 767px) {
    .hide-mobile-landscape{
      display: none !important;
    }
}
  @media screen and (max-width: 479px) {
    .hide-mobile{
      display: none !important;
    }
}

/* Style block 10, extracted from index.html */
  /* Focus state style for keyboard navigation for the focusable elements */
  *[tabindex]:focus-visible,
  input[type="file"]:focus-visible {
   outline: 0.125rem solid var(--color-mode-default--focus-state);
   outline-offset: 0.125rem;
}

/* Style block 11, extracted from index.html */
  /* Get rid of top margin on first element in any rich text element */
  .w-richtext > :not(div):first-child,
  .w-richtext > div:first-child > :first-child {
    margin-top: 0 !important;
  }
    /* Get rid of bottom margin on last element in any rich text element */
  .w-richtext>:last-child, .w-richtext ol li:last-child, .w-richtext ul li:last-child {
    margin-bottom: 0;
  }

/* Style block 12, extracted from index.html */
/* ------------------------- Hide Scrollbar -------------------------------------------------- */

body ::-webkit-scrollbar{display: none;} /* Chrome, Safari, Opera */
body {-ms-overflow-style: none;} /* IE & Edge */
html {scrollbar-width: none;} /* Firefox */

html {
  overscroll-behavior-y: none;
}

/* Style block 13, extracted from index.html */
/* ------------------------- Menu -------------------------------------------------- */

/* ===== skip row 1 col 3 ===== */
.menu-inner::before {
  content: "";
  grid-column: 3;
  grid-row: 1;
}

/* -------------------------------------------------------
MENU ITEM HOVER (button-style swap) — attribute-driven
Uses SAME duplication approach as buttons:
- [data-mi-inner] has data-text="..."
- [data-mi-text] is the real label element inside inner

APPLY:
[data-mi]
[data-mi-bg]
[data-mi-inner][data-text="..."]
  [data-mi-text]   (custom span)
  [data-mi-icon]   (optional)
  [data-mi-arrow]  (optional)
------------------------------------------------------- */

[data-mi] {
  --mi-smooth: cubic-bezier(0.32, 0.72, 0, 1);
  --mi-transform: cubic-bezier(0.59, 1, 0.88, 1.01);
  --mi-bounce: cubic-bezier(0.34, 2.27, 0.64, 1);
}

/* BG squish like buttons */
[data-mi] [data-mi-bg] {
  transition: transform 0.35s var(--mi-transform);
  transform-origin: center;
}

/* INNER creates the duplicated hover label (like btn inner) */
[data-mi] [data-mi-inner]::after {
  content: attr(data-text);
  display: block;
  grid-area: 1 / 1;
  align-self: flex-start;

  clip-path: inset(0% 0% 100% 0%);
  translate: 0 -0.25em 0;
  scale: 1.05;
  transform-origin: top center;

  transition:
    clip-path 0.4s var(--mi-smooth),
    scale 0.3s var(--mi-bounce),
    translate 0.35s var(--mi-smooth);
}

/* Ensure inner can stack text + ::after without changing layout */
[data-mi] [data-mi-inner] {
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: 1fr;
  align-items: center;
}

/* Put the real text in the same grid cell */
[data-mi] [data-mi-text] {
  grid-area: 1 / 1;

  clip-path: inset(0% 0% 0% 0%);
  translate: 0 0 0;
  scale: 1;
  transform-origin: bottom center;

  transition:
    clip-path 0.4s var(--mi-smooth),
    scale 0.3s var(--mi-bounce),
    translate 0.35s var(--mi-smooth);
}

/* Optional icon / arrow motion */
[data-mi] [data-mi-icon],
[data-mi] [data-mi-arrow] {
  transition:
    transform 0.35s var(--mi-smooth),
    opacity 0.25s var(--mi-smooth);
  will-change: transform;
}

@media (hover: hover) and (pointer: fine) {
  [data-mi]:is(:hover, :focus-visible) [data-mi-bg] {
    transform: scaleX(0.965) scaleY(0.965);
  }

  [data-mi]:is(:hover, :focus-visible) [data-mi-inner]::after {
    clip-path: inset(0% 0% 0% 0%);
    scale: 1;
    translate: 0 0 0;
    transition-delay: 0.075s;
  }

  [data-mi]:is(:hover, :focus-visible) [data-mi-text] {
    clip-path: inset(100% 0% 0% 0%);
    translate: 0 0.25em 0;
    scale: 0.95;
  }

  /* Optional nudges */
  [data-mi]:is(:hover, :focus-visible) [data-mi-arrow] {
    transform: translateX(0.25em);
  }

  [data-mi]:is(:hover, :focus-visible) [data-mi-icon] {
    transform: translateX(0.15em);
  }
}

/* -------------------------------------------------------
MENU ITEM ICON BG + ARROW (fixed)
- BG reveal starts bottom-left -> expands to top-right
- Arrow is ALWAYS center-center (absolute centered)
- Arrow animates from bottom-left-ish into center
------------------------------------------------------- */

[data-mi] [data-mi-icon] {
  position: relative;
  overflow: hidden;
  display: block;
  background: transparent;
}

/* BG layer */
[data-mi] [data-mi-icon]::before {
  content: "";
  position: absolute;
  inset: 0;
  background: var(--mi-icon-bg, currentColor);

  /* inset order: top right bottom left */
  clip-path: inset(100% 100% 0% 0%);

  transition: clip-path 0.4s var(--mi-smooth);
  will-change: clip-path;
}

/* Arrow: hard-center inside icon */
[data-mi] [data-mi-arrow] {
  position: absolute;
  left: 50%;
  top: 50%;
  z-index: 1;
  display: block;

  transform-origin: bottom left;
  transform: translate(-50%, -50%) translate(-35%, 35%) scale(1.05);

  opacity: 0;

  transition:
    transform 0.35s var(--mi-smooth),
    opacity 0.25s var(--mi-smooth);

  will-change: transform, opacity;
}

@media (hover: hover) and (pointer: fine) {
  [data-mi]:is(:hover, :focus-visible) [data-mi-icon]::before {
    clip-path: inset(0% 0% 0% 0%);
    transition-delay: 0.05s;
  }

  [data-mi]:is(:hover, :focus-visible) [data-mi-arrow] {
    transform: translate(-50%, -50%) translate(0%, 0%) scale(1);
    opacity: 1;
    transition-delay: 0.075s;
  }
}

/* Style block 14, extracted from index.html */
  /* These classes are never overwritten */
  .margin-0 {
    margin: 0rem !important;
  }
  .padding-0 {
    padding: 0rem !important;
  }
  .margin-top {
    margin-right: 0rem !important;
    margin-bottom: 0rem !important;
    margin-left: 0rem !important;
  }
  .padding-top {
    padding-right: 0rem !important;
    padding-bottom: 0rem !important;
    padding-left: 0rem !important;
  }
  .margin-right {
    margin-top: 0rem !important;
    margin-bottom: 0rem !important;
    margin-left: 0rem !important;
  }
  .padding-right {
    padding-top: 0rem !important;
    padding-bottom: 0rem !important;
    padding-left: 0rem !important;
  }
  .margin-bottom {
    margin-top: 0rem !important;
    margin-right: 0rem !important;
    margin-left: 0rem !important;
  }
  .padding-bottom {
    padding-top: 0rem !important;
    padding-right: 0rem !important;
    padding-left: 0rem !important;
  }
  .margin-left {
    margin-top: 0rem !important;
    margin-right: 0rem !important;
    margin-bottom: 0rem !important;
  }
  .padding-left {
    padding-top: 0rem !important;
    padding-right: 0rem !important;
    padding-bottom: 0rem !important;
  }
  .margin-horizontal {
    margin-top: 0rem !important;
    margin-bottom: 0rem !important;
  }
  .padding-horizontal {
    padding-top: 0rem !important;
    padding-bottom: 0rem !important;
  }
  .margin-vertical {
    margin-right: 0rem !important;
    margin-left: 0rem !important;
  }
  .padding-vertical {
    padding-right: 0rem !important;
    padding-left: 0rem !important;
  }

/* Style block 15, extracted from index.html */
  /* Remove all highlights when tapping links on mobile */
  body {-webkit-tap-highlight-color: transparent;}
  :focus {outline: 0;}

/* Style block 16, extracted from index.html */
  /* Make text look crisper and more legible in all browsers */
  body {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
  }

/* Style block 17, extracted from index.html */
.util__heading-wrapper {
  width: max-content;                 
  width: clamp(18.8rem, 18.8rem, calc(100vw - 2rem));
  max-width: calc(100vw - 2rem);
  white-space: pre;
}

/* tablet */
@media (min-width: 768px) {
  .util__heading-wrapper {
    width: max-content;
    width: clamp(25rem, 25rem, calc(100vw - 2rem));
  }
}

/* desktop */
@media (min-width: 1024px) {
  .util__heading-wrapper {
    width: max-content;
    width: clamp(28rem, 28rem, calc(100vw - 2rem));
  }
}

/* ultra-wide */
@media (min-width: 1800px) {
  .util__heading-wrapper {
    width: max-content;
    width: clamp(32rem, 32rem, calc(100vw - 2rem));
  }
}

/* Force wrapping under 300px */
@media (max-width: 300px) {
  .util__heading-wrapper {
    white-space: normal;     /* overrides pre */
    overflow-wrap: anywhere; /* prevents overflow from long words */
  }
}

/* Style block 18, extracted from index.html */
/* Variables: Automatically set all headings to the variable heading font */
h1, h2, h3, h4, h5, h6 {
  font-family: var(--typography--heading-style);
  font-weight: 500 !important;
  color: 	var(--color-mode-default--heading);
  line-height: 1;
  letter-spacing: -0.06em;
}
/* Variables: Auto change all classes with 'heading-style' */
[class*="heading-style-"] {
  font-family: var(--typography--heading-style) !important;
  font-weight: 500 !important;
	color: 	var(--color-mode-default--heading);
	line-height: 1;
  letter-spacing: -0.06em;
}

/* Style block 19, extracted from index.html */
button {
  all: unset;
  cursor: pointer;
  pointer-events: auto;
}

button:focus {
  outline: revert;
}

/* Style block 20, extracted from index.html */
/* 
Make the following elements inherit typography styles from the parent and not have hardcoded values. 
Important: You will not be able to style for example "All Links" in Designer with this CSS applied.
Uncomment this CSS to use it in the project. Leave this message for future hand-off.
*/

a,
.w-input,
.w-select,
.w-tab-link,
.w-nav-link,
.w-dropdown-btn,
.w-dropdown-toggle,
.w-dropdown-link {
  color: inherit;
  text-decoration: inherit;
  font-size: inherit;
}


/* Remove the default Webflow icons from Input- Select and Text Area fields */
input,select,textarea {
    -webkit-appearance: none!important;
    -moz-appearance: none!important;
    appearance: none!important
}

/* Dropdown Toggle */
.w-dropdown-toggle, .w-dropdown-toggle.w--open {
    margin: 0;
    border: none;
    background: none;
    font-family: inherit;
    font-size: inherit;
    color: inherit;
}

/* Style block 21, extracted from index.html */
/* -------------------------------------------------------
ATTRIBUTE-DRIVEN BUTTON ANIMATIONS + OPTIONAL MENU ICON ADDON

Core button:
- data-btn on the button wrapper
- data-btn-bg / data-btn-inner / data-btn-text etc. (as before)

Optional addon (ONLY if present inside the button):
- data-btn-menu on the menu toggle wrapper inside [data-btn]
- data-btn-menu-bar on each bar element (2 bars)

Menu-open state (same behavior as before):
- any ancestor sets: data-menu-open="true"
------------------------------------------------------- */

/* Remove Webflow Designer / Editor empty-element padding bug */
.wf-design-mode .wf-empty,
.wf-editor-mode .wf-empty {
  padding: 0;
}

/* For menu only */
:root {
  --btn-w: 100%;      /* default menu button width */
  --btn-gap: 1.5em;  /* default spacing between text + icon */
}

/* =========================
   CORE BUTTON (as before)
========================= */

[data-btn] {
  --elastic-ease-out: linear(
    0,
    0.5737 7.6%,
    0.8382 11.87%,
    0.9463 14.19%,
    1.0292 16.54%,
    1.0886 18.97%,
    1.1258 21.53%,
    1.137 22.97%,
    1.1424 24.48%,
    1.1423 26.1%,
    1.1366 27.86%,
    1.1165 31.01%,
    1.0507 38.62%,
    1.0219 42.57%,
    0.9995 46.99%,
    0.9872 51.63%,
    0.9842 58.77%,
    1.0011 81.26%,
    1
  );
  --smooth-ease: cubic-bezier(.32, .72, 0, 1);
  --transform-ease: cubic-bezier(.59, 1, .88, 1.01);
  --bounce-cubic-ease: cubic-bezier(.34, 2.27, .64, 1);

  transition: transform .45s var(--elastic-ease-out);
  -webkit-tap-highlight-color: transparent;
}

/* Only the menu button gets a forced width */
[data-btn="menu"] {
  width: var(--btn-w, auto);
}

/* Keep your grid-stack behavior (BG and inner can remain grid-area: 1/1) */
/* Add spacing + left/right layout INSIDE the inner */
[data-btn="menu"] [data-btn-inner]{
  display: grid;
  grid-template-columns: 1fr auto; /* text left, icon right */
  align-items: center;
  column-gap: var(--btn-gap, 0.75rem);
  width: 100%;
}

/* Make sure the animated text layers stay in column 1 only */
[data-btn="menu"] [data-btn-inner]::after {
  grid-column: 1;
  justify-self: start;
}

[data-btn="menu"] [data-btn-text]{
  grid-column: 1;
  justify-self: start;
}

/* Ensure the icon wrapper sits on the right */
[data-btn="menu"] [data-btn-menu]{
  grid-column: 2;
  justify-self: end;
}

[data-btn]:active {
  transform: scaleX(0.955) scaleY(0.954);
}

[data-btn] [data-btn-bg] {
  transition: scale .15s var(--transform-ease), transform .15s var(--transform-ease);
}

[data-btn] [data-btn-bg-icon] {
  transition: translate .3s var(--smooth-ease), clip-path .3s var(--smooth-ease);
}

[data-btn] [data-btn-inner]::after {
  content: attr(data-text);
  display: block;
  grid-area: 1 / 1;
  transition: clip-path .4s var(--smooth-ease), scale .3s var(--bounce-cubic-ease), translate .35s var(--smooth-ease);
  clip-path: inset(0% 0% 100% 0%);
  translate: 0 -.25em 0;
  scale: 1.05;
  transform-origin: top center;
}

[data-btn] [data-btn-text] {
  clip-path: inset(0% 0% 0% 0%);
  transition: clip-path .4s var(--smooth-ease), scale .3s var(--bounce-cubic-ease), translate .35s var(--smooth-ease);
  translate: 0 0 0;
  scale: 1;
  transform-origin: bottom center;
}

@media (hover: hover) and (pointer: fine) {
  [data-btn]:is(:hover, :focus-visible) [data-btn-bg] {
    scale: .975 .945;
    transform: scale(calc(1/.975), calc(1/.945));
    transition: scale .15s var(--transform-ease), transform .35s .15s var(--bounce-cubic-ease);
  }

  [data-btn]:is(:hover, :focus-visible) [data-btn-inner]::after {
    clip-path: inset(0% 0% 0% 0%);
    scale: 1;
    translate: 0 0 0;
    transition-delay: .075s;
  }

  [data-btn]:is(:hover, :focus-visible) [data-btn-text] {
    clip-path: inset(100% 0% 0% 0%);
    translate: 0 .25em 0;
    scale: .95;
  }
}

/* =========================
   OPTIONAL MENU ICON ADDON
   (only runs if you add the attributes)
========================= */

/* Base state: bars offset (no hover needed) */
[data-btn] [data-btn-menu] [data-btn-menu-bar] {
  transition: transform 0.6s cubic-bezier(.65, 0, 0, 1);
  transform: translateY(-0.25em) rotate(0.001deg);
  transform-origin: center;
}

/* Second bar different offset */
[data-btn] [data-btn-menu] [data-btn-menu-bar]:nth-child(2) {
  transform: translateY(0.15em) rotate(0.001deg);
}

/* Hover/focus on the BUTTON triggers the menu bar animation */
@media (hover: hover) and (pointer: fine) {
  [data-btn]:is(:hover, :focus-visible) [data-btn-menu] [data-btn-menu-bar] {
    transform: translateY(0.25em) rotate(0.001deg);
  }

  [data-btn]:is(:hover, :focus-visible) [data-btn-menu] [data-btn-menu-bar]:nth-child(2) {
    transform: translateY(-0.15em) rotate(0.001deg);
  }
}

/* Menu-open state — shortened X */
[data-menu-open="true"] [data-btn] [data-btn-menu] [data-btn-menu-bar] {
  transform: translateY(0em) rotate(45deg) scaleX(0.75);
}

[data-menu-open="true"] [data-btn] [data-btn-menu] [data-btn-menu-bar]:nth-child(2) {
  transform: translateY(0em) rotate(-45deg) scaleX(0.75);
}
/* ========================================
   ICON-ONLY BUTTON VARIANT
   data-btn="icon"
   - no gap
   - 1 col / 1 row
   - centers one icon inside
======================================== */

/* Inner becomes a single centered cell */
[data-btn="icon"] [data-btn-inner] {
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: 1fr;
  place-items: center;
  height: 100%;
}

/* If text layers exist in the structure, hide them */
[data-btn="icon"] [data-btn-text],
[data-btn="icon"] [data-btn-inner]::after {
  display: none;
}

/* Center common icon wrappers if present (hamburger / sound / any icon wrapper) */
[data-btn="icon"] [data-btn-menu],
[data-btn="icon"] [data-btn-sound],
[data-btn="icon"] [data-btn-bg-icon] {
  display: grid;
  place-items: center;
}

/* Style block 22, extracted from index.html */
/* =========================================================
   DATA UNDERLINE — BACKGROUND-BASED (SAFE)
   ========================================================= */

[data-underline] {
  background-image: linear-gradient(currentColor, currentColor);
  background-repeat: no-repeat;
  background-position: left bottom;
  background-size: 0% 0.0625em;
  transition: background-size 0.35s cubic-bezier(0.625, 0.05, 0, 1);
}

/* ALT default (line visible) */
[data-underline="alt"] {
  background-size: 100% 0.0625em;
  background-position: left bottom;
}

/* hover / focus-visible */
@media (hover: hover) and (pointer: fine) {
  [data-underline]:hover,
  [data-underline]:focus-visible {
    background-size: 100% 0.0625em;
  }

  [data-underline="alt"]:hover,
  [data-underline="alt"]:focus-visible {
    background-size: 0% 0.0625em;
    background-position: right bottom;
  }
}

/* Style block 23, extracted from index.html */
#bar1 {
  animation: bar1 1.2s infinite linear;
}
#bar2 {
  animation: bar2 0.8s infinite linear;
}
#bar3 {
  animation: bar3 1s infinite linear;
}
#bar4 {
  animation: bar4 0.7s infinite linear;
}
@keyframes bar1 {
  0% {
    height: 2px;
  }
  50% {
    height: 7px;
  }
  100% {
    height: 2px;
  }
}
@keyframes bar2 {
  0% {
    height: 5px;
  }
  40% {
    height: 1px;
  }
  80% {
    height: 7px;
  }
  100% {
    height: 5px;
  }
}
@keyframes bar3 {
  0% {
    height: 7px;
  }
  50% {
    height: 0;
  }
  100% {
    height: 7px;
  }
}

@keyframes bar4 {
  0% {
    height: 2px;
  }
  50% {
    height: 7px;
  }
  100% {
    height: 2px;
  }
}

/* Style block 24, extracted from index.html */
.scroll__indicator{
  position: relative;
  width: 1px;
  height: 8em;
  background: color-mix(in srgb, var(--_theme---body-text) 40%, transparent);
  overflow: hidden;
}

/* velocity-based "comet" block */
.scroll__indicator::after{
  content:"";
  position:absolute;
  left: 50%;
  top: 0;

  width: 33px;              /* overlaps rail */
  height: 1.9em;            /* block size */
  background: rgba(255,255,255,0.95);
  opacity: 0;

  /* starts compact */
  clip-path: polygon(
    18% 0%,
    82% 0%,
    82% 100%,
    18% 100%
  );

  /* motion + morph */
  animation: scroll-indicator 2.8s cubic-bezier(0.7, 0.05, 0.13, 1) infinite;
  pointer-events: none;
  will-change: transform, opacity, clip-path;
}

@keyframes scroll-indicator{
  /* appear */
  0%{
    transform: translate(-50%, -160%) scaleY(.8);
    opacity: 0;
    clip-path: polygon(20% 0%, 80% 0%, 80% 100%, 20% 100%);
  }
  10%{
    opacity: 1;
    transform: translate(-50%, -120%) scaleY(.95);
    clip-path: polygon(16% 0%, 84% 0%, 84% 100%, 16% 100%);
  }

  /* accelerate: stretch into a comet (longer tail upward) */
  40%{
    transform: translate(-50%, 170%) scaleY(1.35);
    clip-path: polygon(
      22% 0%,
      78% 0%,
      92% 32%,
      86% 100%,
      14% 100%,
      8% 32%
    );
  }

  /* peak velocity: very noticeable streak */
  65%{
    transform: translate(-50%, 320%) scaleY(2);
    clip-path: polygon(
      28% 0%,
      72% 0%,
      92% 20%,
      84% 100%,
      16% 100%,
      8% 20%
    );
  }

  /* decelerate: compress back into a block */
  75%{
    transform: translate(-50%, 560%) scaleY(1);
    opacity: 1;
    clip-path: polygon(16% 0%, 84% 0%, 84% 100%, 16% 100%);
  }

  /* exit */
  100%{
    transform: translate(-50%, 620%) scaleY(.5);
    opacity: 1;
    clip-path: polygon(22% 0%, 78% 0%, 78% 100%, 22% 100%);
  }
}

/* Style block 25, extracted from index.html */
#bar1 {
  animation: bar1 1.2s infinite linear;
}
#bar2 {
  animation: bar2 0.8s infinite linear;
}
#bar3 {
  animation: bar3 1s infinite linear;
}
#bar4 {
  animation: bar4 0.7s infinite linear;
}
@keyframes bar1 {
  0% {
    height: 2px;
  }
  50% {
    height: 7px;
  }
  100% {
    height: 2px;
  }
}
@keyframes bar2 {
  0% {
    height: 5px;
  }
  40% {
    height: 1px;
  }
  80% {
    height: 7px;
  }
  100% {
    height: 5px;
  }
}
@keyframes bar3 {
  0% {
    height: 7px;
  }
  50% {
    height: 0;
  }
  100% {
    height: 7px;
  }
}

@keyframes bar4 {
  0% {
    height: 2px;
  }
  50% {
    height: 7px;
  }
  100% {
    height: 2px;
  }
}

/* Style block 26, extracted from index.html */
/* Default image ratio (vertical cards) */
.case__img-wrapper {
  aspect-ratio: 16 / 22;
}

/* ---------------------------------------
   Desktop + Tablet → Featured layout ON
--------------------------------------- */

/* Default: all items are 1 column */
.cases__list .cases__item {
  grid-column: span 1;
}

/* 3rd and 4th items span 2 columns */
.cases__list .cases__item:nth-child(3),
.cases__list .cases__item:nth-child(4) {
  grid-column: span 2;
}

/* Landscape images for featured cards */
.cases__list .cases__item:nth-child(3) .case__img-wrapper,
.cases__list .cases__item:nth-child(4) .case__img-wrapper {
  aspect-ratio: 16 / 11;
  width: calc(100% - 0.125em);
  margin-inline: auto;
}

/* ---------------------------------------
   Mobile landscape + portrait → RESET
   (767px matches Webflow mobile breakpoint)
--------------------------------------- */

@media (max-width: 767px) {

  .cases__list .cases__item:nth-child(3),
  .cases__list .cases__item:nth-child(4) {
    grid-column: span 1;
  }

  .cases__list .cases__item:nth-child(3) .case__img-wrapper,
  .cases__list .cases__item:nth-child(4) .case__img-wrapper {
    aspect-ratio: 16 / 22;
    width: 100%;
    margin-inline: 0;
  }

}

/* Style block 27, extracted from index.html */
/* ================================
   Default styles
================================ */
.case__img-inner,
.case__img-hover {
  transform-style: preserve-3d;
  will-change: transform;
}

/* wrapper we scale instead of the parallax-driven element */
[data-hover-scale] {
  will-change: transform;
  transform-origin: center;
}

.case__img-inner img,
.case__img-hover img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.hover-overlay {
  pointer-events: none;
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 1);
  opacity: 0;
}

/* Style block 28, extracted from index.html */
.cta-ticket {
  display: flex;
  transform: rotate(-12deg);
  transform-origin: center center;
  perspective: 1000px; /* For 3D folding effect */
  cursor: pointer;
  transition: transform 0.6s ease;
}

.ticket-inner {
  overflow: hidden;
  transition: transform 0.6s cubic-bezier(0.625, 0.05, 0, 1), box-shadow 0.6s ease;
}

.ticket-inner.left {
  transform-origin: top right; /* corner fold pivot */
}

.ticket-inner.right {
  transform-origin: top left;
}

/* Hover effect */
.cta-ticket:hover {
  transform: rotate(-12deg) translateY(5px); /* slight tilt of whole ticket */
}

.cta-ticket:hover .ticket-inner.left {
  transform: rotateY(-32deg) rotateX(5deg) rotate(-6deg) translateX(-4em) translateY(-4em) translateZ(0.125em); /* curl effect */
}

.cta-ticket:hover .ticket-inner.right {
  transform: rotateX(5deg) rotate(12deg) translateX(2em) translateY(-2em) translateZ(4em); /* slight downward tilt */
}

/* Style block 29, extracted from index.html */
/* Previous and next Button*/ 
.slider__btn,
.slider__btn-overlay { 
  transition: transform 0.475s cubic-bezier(0.625, 0.05, 0, 1), opacity 0.475s cubic-bezier(0.625, 0.05, 0, 1)
}

.slider__btn:hover .slider__btn-overlay { 
  transform: scale(1.4);
}

.slider__overlay-nav:hover:has(.slider__btn:hover) .slider__btn { 
  opacity: 0.4;
}

.slider__btn:hover { 
  transform: scale(0.85);
  opacity: 1 !important;
}

/* Style block 30, extracted from index.html */
/* Default image ratio (vertical cards) */
.insights__img-wrapper {
  aspect-ratio: 16 / 22;
}

/* ---------------------------------------
 Desktop + Tablet → Featured layout ON
--------------------------------------- */

/* Default: all items are 1 column */
.insights__list .insights__item {
  grid-column: span 1;
}

/* ---------------------------------------
 Mobile landscape + portrait → RESET
 (767px matches Webflow mobile breakpoint)
--------------------------------------- */

@media (max-width: 767px) {
  .insights__list .insights__item:nth-child(3) .insight__img-wrapper,
  .insights__list .insights__item:nth-child(4) .insight__img-wrapper {
    aspect-ratio: 16 / 22;
    width: 100%;
    margin-inline: 0;
  }
}

/* Style block 31, extracted from index.html */
/* ================================
   Default styles
================================ */
.insight__img-inner,
.insight__img-hover {
  transform-style: preserve-3d;
  will-change: transform;
}

/* wrapper we scale instead of the parallax-driven element */
[data-hover-scale] {
  will-change: transform;
  transform-origin: center;
}

.insight__img-inner img,
.insight__img-hover img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.hover-overlay {
  pointer-events: none;
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 1);
  opacity: 0;
}