/* Global & section styles — wireframe/styles/main.css */

html,
body {
  margin: 0;
  padding: 0;
  min-height: 100%;
}

html {
  overflow-x: clip;
  background-color: var(--color-background);
}

html:has(.hero--scroll-drive) {
  scroll-behavior: auto;
}

body.is-ready #hero.hero--scroll-drive {
  transform: none !important;
  filter: none !important;
  overflow: visible !important;
  will-change: auto !important;
  contain: none !important;
  isolation: auto !important;
}

body { font-family: var(--font-body); color: var(--color-text); background: var(--color-background); overflow-x: clip; }

h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-heading);
}
    body::before {
      content: "";
      position: fixed;
      inset: -12%;
      pointer-events: none;
      z-index: 120;
      opacity: 0;
      background:
        radial-gradient(75% 55% at 50% 0%, rgba(195, 196, 227, 0.28) 0%, transparent 72%),
        radial-gradient(55% 50% at 50% 100%, rgba(88, 90, 116, 0.18) 0%, transparent 75%);
      transition: opacity 620ms ease;
    }
    .site-header,
    .scroll-progress,
    main > section,
    .site-footer {
      transition:
        opacity 760ms cubic-bezier(0.22, 1, 0.36, 1),
        transform 980ms cubic-bezier(0.22, 1, 0.36, 1),
        filter 760ms cubic-bezier(0.22, 1, 0.36, 1);
      will-change: opacity, transform, filter;
    }
    main > section#hero.hero--scroll-drive {
      will-change: auto;
    }
    body.is-loading::before { opacity: 1; }
    body.is-loading .site-header:not(.site-header--premium),
    body.is-loading .scroll-progress,
    body.is-loading .site-footer {
      opacity: 0;
      transform: translateY(-12px) scale(0.995);
      filter: blur(4px);
    }
    /* Premium-Header: Shell ohne filter/transform — sonst kein backdrop-filter auf der Glasleiste */
    body.is-loading .site-header--premium,
    body.is-ready .site-header--premium,
    .site-header--premium {
      opacity: 1;
      transform: none;
      filter: none;
      will-change: auto;
      transition: none;
    }
    body.is-loading main > section {
      opacity: 0;
      transform: translateY(28px) scale(0.992);
      filter: blur(6px);
    }
    /* Premium Hero: Shell stabil (kein Section-Zoom), Intro auf inneren Layern */
    html:has(#hero.hero--premium),
    body:has(#hero.hero--premium) {
      background-color: var(--color-background);
    }
    body:has(#hero.hero--premium).is-loading::before {
      opacity: 1;
    }
    body.is-loading #hero.hero--premium {
      opacity: 1;
      transform: none;
      filter: none;
    }
    /* Glasleiste: opacity auf Glass selbst (nicht auf Wrap — sonst kein backdrop-filter während Fade) */
    body.is-loading .site-header--premium .site-header__wrap {
      transform: none;
      pointer-events: none;
    }
    body.is-loading.header-usable .site-header--premium .site-header__wrap {
      pointer-events: auto;
    }
    body.is-loading .site-header--premium .site-header__glass {
      opacity: 0;
      visibility: hidden;
    }
    body.is-loading.header-usable .site-header--premium .site-header__glass {
      opacity: 0.94;
      visibility: visible;
      transition: opacity 0.42s cubic-bezier(0.22, 1, 0.36, 1);
    }
    body.is-ready .site-header--premium .site-header__wrap {
      pointer-events: auto;
    }
    body.is-ready .site-header--premium .site-header__glass {
      opacity: 1;
      visibility: visible;
      transition:
        opacity 0.92s cubic-bezier(0.22, 1, 0.36, 1),
        visibility 0s linear,
        background 280ms cubic-bezier(0.22, 1, 0.36, 1),
        border-color 280ms cubic-bezier(0.22, 1, 0.36, 1),
        box-shadow 280ms cubic-bezier(0.22, 1, 0.36, 1);
      transition-delay: 0.14s, 0s, 0s, 0s, 0s;
    }
    body.is-ready .site-header--premium {
      filter: none !important;
    }
    body.is-ready #hero.hero--premium {
      transform: none !important;
      transition: none !important;
    }
    body.has-scroll-weight.is-ready #hero.hero--premium {
      transform: none !important;
    }
    /* Fallback: Inhalt sichtbar, wenn main.js nicht lädt (z. B. file://-Preview) */
    body.is-loading:not(.is-ready) main > section:not(#hero),
    body.is-loading:not(.is-ready) .site-header:not(.site-header--premium),
    body.is-loading:not(.is-ready) .site-footer {
      animation: wf-content-reveal 0s 800ms forwards;
    }
    @keyframes wf-content-reveal {
      to { opacity: 1; transform: none; filter: none; }
    }
    body.is-ready .site-header,
    body.is-ready .scroll-progress,
    body.is-ready .site-footer,
    body.is-ready main > section {
      opacity: 1;
      transform: none;
      filter: none;
    }
    body.is-ready .site-header:not(.site-header--premium),
    body.is-ready .scroll-progress,
    body.is-ready .site-footer,
    body.is-ready main > section:not(#hero) {
      filter: blur(0);
    }
    body.is-ready main > section:nth-of-type(1) { transition-delay: 60ms; }
    body.is-ready main > section:nth-of-type(2) { transition-delay: 110ms; }
    body.is-ready main > section:nth-of-type(3) { transition-delay: 150ms; }
    body.is-ready main > section:nth-of-type(4) { transition-delay: 190ms; }
    body.is-ready main > section:nth-of-type(5) { transition-delay: 230ms; }
    body.is-ready main > section:nth-of-type(6) { transition-delay: 270ms; }
    body.is-ready main > section:nth-of-type(7) { transition-delay: 310ms; }
    body.is-ready main > section:nth-of-type(8) { transition-delay: 350ms; }
    body.is-ready main > section:nth-of-type(9) { transition-delay: 390ms; }
    body.is-ready main > section:nth-of-type(10) { transition-delay: 430ms; }
    body.is-ready main > section:nth-of-type(11) { transition-delay: 470ms; }
    body.is-ready main > section:nth-of-type(12) { transition-delay: 510ms; }
    body.has-scroll-weight.is-ready main > section {
      transform-origin: center top;
      backface-visibility: hidden;
    }
    body.has-scroll-weight.is-ready #anfrage.inquiry,
    body.has-scroll-weight.is-ready #faq.faq,
    body.has-scroll-weight.is-ready #referenzen.cases,
    body.has-scroll-weight.is-ready .subpage-hero,
    body.has-scroll-weight.is-ready .subpage-body {
      transform: none !important;
    }
    .material-symbols-outlined {
      font-family: "Material Symbols Outlined";
      font-weight: normal;
      font-style: normal;
      line-height: 1;
      letter-spacing: normal;
      text-transform: none;
      display: inline-block;
      white-space: nowrap;
      word-wrap: normal;
      direction: ltr;
      font-feature-settings: "liga";
      -webkit-font-smoothing: antialiased;
      font-variation-settings: "FILL" 0, "wght" 300, "GRAD" 0, "opsz" 24;
    }
    .no-scrollbar::-webkit-scrollbar { display: none; }
    .no-scrollbar { -ms-overflow-style: none; scrollbar-width: none; }
    .glass-effect {
      background: rgba(255, 255, 255, 0.88);
      backdrop-filter: blur(12px);
      border: 1px solid rgba(88, 90, 116, 0.14);
      box-shadow: var(--shadow-sm);
    }
    .video-play-btn {
      position: relative;
      width: 5.5rem;
      height: 5.5rem;
      border-radius: 9999px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      cursor: pointer;
      background: rgba(255, 255, 255, 0.24);
      backdrop-filter: blur(18px);
      border: 1px solid rgba(255, 255, 255, 0.5);
      box-shadow: 0 10px 36px rgba(28, 27, 27, 0.14), inset 0 1px 0 rgba(255, 255, 255, 0.55);
      transition: transform 280ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 280ms ease, background 280ms ease;
    }
    .video-play-btn::before {
      content: "";
      position: absolute;
      inset: -7px;
      border-radius: inherit;
      border: 1px solid rgba(255, 255, 255, 0.28);
      opacity: 0.65;
      transition: inset 280ms ease, opacity 280ms ease;
    }
    .video-play-btn:hover {
      background: rgba(255, 255, 255, 0.34);
      box-shadow: 0 18px 44px rgba(28, 27, 27, 0.18), inset 0 1px 0 rgba(255, 255, 255, 0.65);
    }
    .video-play-btn:hover::before {
      inset: -11px;
      opacity: 0.95;
    }
    .video-play-btn__icon {
      font-size: 2.75rem;
      color: var(--color-text);
      transform: translateX(1px);
      font-variation-settings: "FILL" 1, "wght" 400, "GRAD" 0, "opsz" 48;
    }
    .dark-glass { background: rgba(28, 27, 27, 0.85); backdrop-filter: blur(16px); }
    .site-section { padding-top: clamp(4rem, 3rem + 4vw, 8rem); padding-bottom: clamp(4rem, 3rem + 4vw, 8rem); }
    .site-container { max-width: 80rem; margin-inline: auto; padding-inline: clamp(1.25rem, 1rem + 1vw, 1.5rem); }
    .site-container.max-w-3xl { max-width: 48rem; }
    .site-container.max-w-4xl { max-width: 56rem; }
    .site-container.max-w-5xl { max-width: 64rem; }
    .site-container.max-w-6xl { max-width: 72rem; }
    .site-container.max-w-7xl { max-width: 80rem; }
    .site-container.max-w-none { max-width: none; }
    @media (min-width: 768px) { .site-container { padding-inline: clamp(1.5rem, 1rem + 2vw, 3rem); } }
    .sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
    .line-clamp-3 { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden; }
    summary::-webkit-details-marker { display: none; }
    summary { list-style: none; }
    .mobile-menu-toggle {
      width: 3rem;
      height: 3rem;
      padding: 0;
      border: 0;
      border-radius: 9999px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      flex-shrink: 0;
      background: transparent;
      color: inherit;
      cursor: pointer;
      transition: background 200ms ease, color 200ms ease, opacity 320ms cubic-bezier(0.16, 1, 0.3, 1), transform 320ms cubic-bezier(0.16, 1, 0.3, 1);
    }
    .mobile-menu-toggle:hover { background: #f6f3f2; }
    .mobile-menu-toggle[aria-expanded="true"] {
      background: rgba(255, 255, 255, 0.96);
      color: var(--color-primary);
      box-shadow: 0 10px 32px rgba(28, 27, 27, 0.22);
    }
    .site-header {
      z-index: 100;
    }
    .site-header--premium {
      background: transparent;
      border-bottom: none;
      backdrop-filter: none;
      -webkit-backdrop-filter: none;
    }
    .site-header--premium .site-header__wrap {
      overflow: visible;
      width: 100%;
      max-width: none;
      margin-inline: 0;
      box-sizing: border-box;
      transition: padding-top 280ms cubic-bezier(0.22, 1, 0.36, 1);
    }
    .site-header--premium.is-scrolled .site-header__wrap {
      padding-top: 0.625rem;
    }
    .site-header--premium .site-header__glass {
      --nav-glass-bg: rgba(8, 18, 32, 0.38);
      --nav-glass-border: rgba(255, 255, 255, 0.12);
      --nav-glass-highlight: rgba(255, 255, 255, 0.06);
      opacity: 1;
      visibility: visible;
      position: relative;
      z-index: 1;
      overflow: visible;
      display: grid;
      grid-template-columns: auto minmax(0, 1fr) auto;
      align-items: center;
      column-gap: clamp(0.75rem, 0.5rem + 0.8vw, 1.5rem);
      padding: 0.5rem 0.625rem 0.5rem 1.25rem;
      border-radius: 1.75rem;
      background: var(--nav-glass-bg);
      backdrop-filter: blur(20px) saturate(150%);
      -webkit-backdrop-filter: blur(20px) saturate(150%);
      border: 1px solid var(--nav-glass-border);
      box-shadow:
        0 0.5px 0 0 var(--nav-glass-highlight) inset,
        0 12px 40px rgba(2, 8, 23, 0.28),
        0 2px 8px rgba(2, 8, 23, 0.12);
      transform: none;
      filter: none;
      transition:
        background 280ms cubic-bezier(0.22, 1, 0.36, 1),
        border-color 280ms cubic-bezier(0.22, 1, 0.36, 1),
        box-shadow 280ms cubic-bezier(0.22, 1, 0.36, 1);
    }
    .site-header--premium.site-header--on-hero .site-header__glass {
      --nav-glass-bg: rgba(8, 18, 32, 0.32);
    }
    @media (min-width: 640px) {
      .site-header--premium .site-header__glass {
        padding: 0.5625rem 0.875rem 0.5625rem 1.375rem;
        border-radius: 2rem;
      }
    }
    @media (min-width: 1024px) {
      .site-header--premium .site-header__glass {
        padding-left: 1.5rem;
      }
    }
    .site-header--premium .site-header__glass::before {
      content: "";
      position: absolute;
      inset: 0;
      z-index: 1;
      border-radius: inherit;
      pointer-events: none;
      background: linear-gradient(180deg, rgba(255, 255, 255, 0.08) 0%, transparent 38%);
      opacity: 0.45;
    }
    .site-header--premium.site-header--past-hero .site-header__glass,
    .site-header--premium.is-scrolled .site-header__glass {
      --nav-glass-bg: rgba(6, 14, 28, 0.72);
      --nav-glass-border: rgba(255, 255, 255, 0.15);
    }
    .site-header--premium.site-header--past-hero .site-header__glass,
    .site-header--premium.is-scrolled .site-header__glass {
      box-shadow:
        0 0.5px 0 0 rgba(255, 255, 255, 0.1) inset,
        0 16px 48px rgba(2, 8, 23, 0.34),
        0 4px 12px rgba(2, 8, 23, 0.18);
    }
    .site-header--premium .brand {
      position: relative;
      z-index: 2;
      display: inline-flex;
      align-items: center;
      text-decoration: none;
      border-radius: 0.875rem;
      transition: opacity 200ms ease, transform 200ms ease;
    }
    .site-header--premium .brand:hover {
      opacity: 0.92;
      transform: translateY(-0.5px);
    }
    .site-header--premium .brand__logo {
      display: block;
      height: clamp(1.75rem, 1.55rem + 0.45vw, 2.25rem);
      width: auto;
      max-width: clamp(9.5rem, 7.5rem + 7vw, 11.75rem);
      object-fit: contain;
      object-position: left center;
    }
    .site-header--premium .u-focus-ring:focus-visible {
      outline-color: rgba(255, 255, 255, 0.72);
      outline-offset: 3px;
    }
    .site-header--premium .primary-navigation {
      justify-self: center;
      position: relative;
      z-index: 3;
      overflow: visible;
    }
    .site-header--premium .nav-dropdown {
      position: relative;
      z-index: 3;
    }
    .site-header--premium .nav-dropdown[open],
    .site-header--premium .nav-dropdown.is-hover,
    .site-header--premium .nav-dropdown:focus-within {
      z-index: 70;
    }
    .site-header--premium .nav-pill {
      display: inline-flex;
      align-items: center;
      gap: 0.2rem;
      padding: 0.5rem 0.8rem;
      border-radius: 9999px;
      border: 1px solid transparent;
      font-size: var(--fs-body);
      font-weight: 500;
      line-height: 1.3;
      color: rgba(255, 255, 255, 0.82);
      text-decoration: none;
      cursor: pointer;
      white-space: nowrap;
      transition:
        color 200ms ease,
        background 200ms ease,
        border-color 200ms ease,
        transform 200ms cubic-bezier(0.22, 1, 0.36, 1);
    }
    @media (min-width: 1280px) {
      .site-header--premium .nav-pill {
        padding: 0.5rem 0.95rem;
      }
    }
    .site-header--premium .nav-pill:hover,
    .site-header--premium .nav-pill:focus-visible,
    .site-header--premium .nav-dropdown[open] .nav-dropdown__trigger {
      color: #fff;
      background: rgba(255, 255, 255, 0.09);
      border-color: rgba(255, 255, 255, 0.1);
      transform: translateY(-0.5px);
    }
    .site-header--premium .nav-pill__chevron {
      font-size: 1.125rem;
      opacity: 0.75;
      transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1);
    }
    .site-header--premium .nav-dropdown[open] .nav-pill__chevron,
    .site-header--premium .nav-dropdown.is-hover .nav-pill__chevron {
      transform: rotate(180deg);
    }
    .site-header--premium .header-actions {
      justify-self: end;
      position: relative;
      z-index: 2;
    }
    .site-header--premium .header-icon-btn {
      width: 2.5rem;
      height: 2.5rem;
      border-radius: 9999px;
      border: 1px solid rgba(255, 255, 255, 0.12);
      background: rgba(255, 255, 255, 0.05);
      color: #fff;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      cursor: pointer;
      transition:
        background 200ms ease,
        border-color 200ms ease,
        transform 200ms cubic-bezier(0.22, 1, 0.36, 1);
    }
    .site-header--premium .header-icon-btn:hover,
    .site-header--premium .header-icon-btn:focus-visible {
      background: rgba(255, 255, 255, 0.12);
      border-color: rgba(255, 255, 255, 0.2);
      transform: translateY(-1px);
    }
    .site-header--premium .header-icon-btn .material-symbols-outlined {
      font-size: 1.125rem;
    }
    .site-header--premium .header-contact__link--text {
      align-items: center;
      gap: 0.45rem;
      padding: 0.5rem 0.75rem;
      border-radius: 9999px;
      font-size: var(--fs-body);
      font-weight: 500;
      line-height: 1.3;
      color: rgba(255, 255, 255, 0.82);
      text-decoration: none;
      border: 1px solid transparent;
      transition:
        color 200ms ease,
        background 200ms ease,
        border-color 200ms ease,
        transform 200ms cubic-bezier(0.22, 1, 0.36, 1);
    }
    .site-header--premium .header-contact__link--text:hover,
    .site-header--premium .header-contact__link--text:focus-visible {
      color: #fff;
      background: rgba(255, 255, 255, 0.08);
      border-color: rgba(255, 255, 255, 0.1);
      transform: translateY(-0.5px);
    }
    .site-header--premium .header-contact__link--text .material-symbols-outlined {
      font-size: 1.125rem;
    }
    .site-header--premium .header-cta-btn {
      align-items: center;
      justify-content: center;
      gap: 0.45rem;
      padding: 0.55rem 0.95rem;
      border-radius: 9999px;
      font-size: var(--fs-body);
      font-weight: 600;
      line-height: 1.3;
      white-space: nowrap;
      text-decoration: none;
      color: #fff;
      cursor: pointer;
      border: 1px solid rgba(255, 255, 255, 0.14);
      background: linear-gradient(180deg, #0a9fd4 0%, #0084b4 52%, #00739c 100%);
      box-shadow:
        0 0.5px 0 0 rgba(255, 255, 255, 0.22) inset,
        0 8px 22px rgba(0, 132, 180, 0.34);
      transition:
        transform 220ms cubic-bezier(0.22, 1, 0.36, 1),
        box-shadow 220ms cubic-bezier(0.22, 1, 0.36, 1),
        background 220ms ease;
    }
    @media (min-width: 1536px) {
      .site-header--premium .header-cta-btn {
        padding: 0.625rem 1.125rem;
      }
    }
    .site-header--premium .header-cta-btn:hover,
    .site-header--premium .header-cta-btn:focus-visible {
      transform: translateY(-1px);
      background: linear-gradient(180deg, #12b0e8 0%, #0096cc 52%, #0084b4 100%);
      box-shadow:
        0 0.5px 0 0 rgba(255, 255, 255, 0.28) inset,
        0 12px 28px rgba(0, 132, 180, 0.42);
    }
    .site-header--premium .header-cta-btn__icon {
      font-size: 1.125rem;
      transition: transform 220ms cubic-bezier(0.22, 1, 0.36, 1);
    }
    .site-header--premium .header-cta-btn:hover .header-cta-btn__icon,
    .site-header--premium .header-cta-btn:focus-visible .header-cta-btn__icon {
      transform: translateX(2px);
    }
    /* Dropdown-Shell: portiert an body (JS) — außerhalb Header-Glass für backdrop-filter */
    .nav-dropdown__menu-shell {
      position: absolute;
      top: 100%;
      left: 0;
      z-index: 60;
      min-width: 15rem;
      margin-top: 1rem;
      transform-origin: top left;
      visibility: hidden;
      transform: translateY(0.625rem) scale(0.975);
      pointer-events: none;
      transition:
        transform 360ms cubic-bezier(0.22, 1, 0.36, 1),
        visibility 300ms cubic-bezier(0.22, 1, 0.36, 1);
    }
    .nav-dropdown__menu-shell.is-visible {
      visibility: visible;
      transform: none;
      pointer-events: auto;
    }
    .nav-dropdown__menu-shell--portaled {
      position: fixed;
      margin-top: 0;
      z-index: 110;
      display: none;
    }
    .nav-dropdown__menu-shell--portaled.is-visible {
      display: block;
    }
    .site-header--premium .nav-dropdown[open] .nav-dropdown__menu-shell:not(.nav-dropdown__menu-shell--portaled),
    .site-header--premium .nav-dropdown.is-hover .nav-dropdown__menu-shell:not(.nav-dropdown__menu-shell--portaled),
    .site-header--premium .nav-dropdown:focus-within .nav-dropdown__menu-shell:not(.nav-dropdown__menu-shell--portaled) {
      visibility: visible;
      transform: none;
      pointer-events: auto;
    }
    .nav-dropdown__menu-shell::before {
      content: "";
      position: absolute;
      top: -1rem;
      left: 0;
      right: 0;
      height: 1rem;
    }
    .nav-dropdown__menu--premium {
      position: relative;
      top: auto;
      left: auto;
      margin: 0;
      min-width: 100%;
      padding: 0.375rem;
      border-radius: 1.25rem;
      background: transparent;
      border: none;
      box-shadow: none;
      opacity: 1;
      visibility: visible;
      transform: none;
      filter: none;
      pointer-events: auto;
      overflow: hidden;
      list-style: none;
      transition: none;
    }
    .nav-dropdown__menu--premium::after {
      content: "";
      position: absolute;
      inset: 0;
      z-index: 0;
      border-radius: inherit;
      pointer-events: none;
      background: rgba(8, 18, 32, 0.32);
      backdrop-filter: blur(20px) saturate(150%);
      -webkit-backdrop-filter: blur(20px) saturate(150%);
      border: 1px solid rgba(255, 255, 255, 0.12);
      box-shadow:
        0 0.5px 0 0 rgba(255, 255, 255, 0.06) inset,
        0 20px 48px rgba(2, 8, 23, 0.38);
    }
    .nav-dropdown__menu--premium::before {
      content: "";
      position: absolute;
      inset: 0;
      z-index: 1;
      border-radius: inherit;
      pointer-events: none;
      background: linear-gradient(180deg, rgba(255, 255, 255, 0.08) 0%, transparent 38%);
      opacity: 0.45;
    }
    .nav-dropdown__menu--premium .nav-dropdown__link {
      position: relative;
      z-index: 2;
      display: block;
      padding: 0.625rem 0.875rem;
      border-radius: 0.75rem;
      font-size: var(--fs-body);
      font-weight: 500;
      line-height: 1.3;
      color: rgba(255, 255, 255, 0.86);
      text-decoration: none;
      opacity: 0;
      transform: translateY(-0.3rem);
      transition:
        color 200ms ease,
        background 200ms ease,
        transform 280ms cubic-bezier(0.22, 1, 0.36, 1),
        opacity 280ms cubic-bezier(0.22, 1, 0.36, 1);
    }
    .nav-dropdown__menu-shell.is-visible .nav-dropdown__link {
      opacity: 1;
      transform: translateY(0);
    }
    .nav-dropdown__menu-shell.is-visible li:nth-child(1) .nav-dropdown__link {
      transition-delay: 55ms;
    }
    .nav-dropdown__menu-shell.is-visible li:nth-child(2) .nav-dropdown__link {
      transition-delay: 95ms;
    }
    .nav-dropdown__menu-shell.is-visible li:nth-child(3) .nav-dropdown__link {
      transition-delay: 135ms;
    }
    .nav-dropdown__menu--premium .nav-dropdown__link:hover,
    .nav-dropdown__menu--premium .nav-dropdown__link:focus-visible {
      color: #fff;
      background: rgba(255, 255, 255, 0.08);
      transform: translateX(2px);
    }
    .site-header--premium .mobile-menu-toggle {
      color: #fff;
    }
    .site-header--premium .mobile-menu-toggle[aria-expanded="true"] {
      background: rgba(255, 255, 255, 0.14);
      border-color: rgba(255, 255, 255, 0.22);
      color: #fff;
      box-shadow: 0 8px 24px rgba(2, 8, 23, 0.24);
    }
    body:has(.site-header--premium) .scroll-progress {
      top: 0;
    }
    body.mobile-nav-open .site-header {
      background: transparent;
      border-bottom-color: transparent;
      backdrop-filter: none;
      -webkit-backdrop-filter: none;
    }
    @media (max-width: 1023px) {
      .site-header .header-actions {
        margin-left: auto;
      }

      .site-header .header-phone {
        display: none;
      }

      body.mobile-nav-open .site-header .site-header__wrap {
        pointer-events: none;
      }

      body.mobile-nav-open .site-header .site-header__glass {
        background: transparent;
        border-color: transparent;
        box-shadow: none;
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
        pointer-events: none;
      }

      body.mobile-nav-open .site-header .site-header__glass::before {
        opacity: 0;
      }

      body.mobile-nav-open .site-header .brand,
      body.mobile-nav-open .site-header .header-contact__icon-btn,
      body.mobile-nav-open .site-header .mobile-menu-toggle {
        visibility: hidden;
        pointer-events: none;
      }
    }

    @media (min-width: 640px) and (max-width: 1023px) {
      .site-header .header-phone {
        display: inline-flex;
      }
    }

    @media (min-width: 1024px) {
      .site-header .mobile-menu-toggle,
      .site-header .header-contact__icon-btn {
        display: none !important;
      }
    }
    .hamburger-icon {
      position: relative;
      width: 1.375rem;
      height: 0.875rem;
      display: block;
    }
    .hamburger-icon__line {
      position: absolute;
      left: 0;
      width: 100%;
      height: 2px;
      border-radius: 9999px;
      background: currentColor;
      transform-origin: center;
      transition:
        transform 320ms cubic-bezier(0.22, 1, 0.36, 1),
        opacity 220ms ease,
        width 220ms ease;
    }
    .hamburger-icon__line:nth-child(1) { top: 0; }
    .hamburger-icon__line:nth-child(2) { top: 50%; transform: translateY(-50%); width: 72%; }
    .hamburger-icon__line:nth-child(3) { bottom: 0; }
    .mobile-menu-toggle[aria-expanded="true"] .hamburger-icon__line:nth-child(1) {
      top: 50%;
      transform: translateY(-50%) rotate(45deg);
    }
    .mobile-menu-toggle[aria-expanded="true"] .hamburger-icon__line:nth-child(2) {
      opacity: 0;
      transform: translateY(-50%) scaleX(0);
    }
    .mobile-menu-toggle[aria-expanded="true"] .hamburger-icon__line:nth-child(3) {
      bottom: 50%;
      transform: translateY(50%) rotate(-45deg);
    }
    .mobile-offcanvas {
      position: fixed;
      inset: 0;
      z-index: 240;
      pointer-events: none;
      visibility: hidden;
    }
    .mobile-offcanvas.is-open {
      pointer-events: auto;
      visibility: visible;
    }
    .mobile-offcanvas__backdrop {
      position: absolute;
      inset: 0;
      padding: 0;
      border: 0;
      cursor: pointer;
      background:
        radial-gradient(120% 80% at 0% 50%, rgba(88, 90, 116, 0.18) 0%, transparent 58%),
        rgba(28, 27, 27, 0.52);
      backdrop-filter: blur(0);
      -webkit-backdrop-filter: blur(0);
      opacity: 0;
      transition:
        opacity 520ms cubic-bezier(0.16, 1, 0.3, 1),
        backdrop-filter 520ms cubic-bezier(0.16, 1, 0.3, 1),
        -webkit-backdrop-filter 520ms cubic-bezier(0.16, 1, 0.3, 1);
    }
    .mobile-offcanvas.is-open .mobile-offcanvas__backdrop {
      opacity: 1;
      backdrop-filter: blur(14px);
      -webkit-backdrop-filter: blur(14px);
    }
    .mobile-offcanvas__panel {
      position: absolute;
      top: 0;
      left: 0;
      width: min(20rem, 88vw);
      height: 100%;
      display: flex;
      flex-direction: column;
      padding: 0;
      background-color: #f6f3f2;
      background-image:
        radial-gradient(110% 70% at 0% 0%, rgba(195, 196, 227, 0.16) 0%, transparent 58%),
        linear-gradient(180deg, #ffffff 0%, #f6f3f2 55%, #f0eded 100%);
      background-repeat: no-repeat;
      background-size: 100% 100%;
      background-attachment: local;
      border-right: 1px solid rgba(88, 90, 116, 0.12);
      box-shadow: 28px 0 72px rgba(28, 27, 27, 0.18);
      opacity: 0;
      filter: blur(10px);
      transform: translateX(-108%) scale(0.985);
      transition:
        transform 560ms cubic-bezier(0.16, 1, 0.3, 1),
        opacity 480ms cubic-bezier(0.16, 1, 0.3, 1),
        filter 560ms cubic-bezier(0.16, 1, 0.3, 1);
      overflow-y: auto;
      overscroll-behavior: contain;
      isolation: isolate;
    }
    .mobile-offcanvas__surface {
      position: relative;
      z-index: 1;
      min-height: 100%;
      display: flex;
      flex-direction: column;
      flex: 1 0 auto;
      padding: clamp(1.25rem, 1rem + 1vw, 1.75rem);
      background: transparent;
    }
    .mobile-offcanvas__panel::before {
      display: none;
    }
    .mobile-offcanvas.is-open .mobile-offcanvas__panel {
      opacity: 1;
      filter: blur(0);
      transform: translateX(0) scale(1);
    }
    .mobile-offcanvas__header {
      position: relative;
      z-index: 1;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 0.75rem;
      min-height: 5rem;
      padding-top: 0;
      padding-bottom: 1.25rem;
      margin-bottom: 0.5rem;
      border-bottom: 1px solid rgba(88, 90, 116, 0.1);
    }
    .mobile-offcanvas__brand {
      display: inline-flex;
      align-items: center;
      gap: 0.625rem;
      min-width: 0;
      text-decoration: none;
      color: inherit;
    }
    .mobile-offcanvas__header-actions {
      display: flex;
      align-items: center;
      gap: 0.5rem;
      margin-left: auto;
      flex-shrink: 0;
      position: relative;
      z-index: 2;
    }
    .mobile-offcanvas__header-phone {
      flex-shrink: 0;
      position: relative;
      z-index: 2;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      width: 2.5rem;
      height: 2.5rem;
      min-width: 2.5rem;
      min-height: 2.5rem;
      padding: 0;
      border-radius: 9999px;
      box-sizing: border-box;
      text-decoration: none;
      color: var(--color-primary);
      background: rgba(223, 224, 255, 0.45);
      border: 1px solid rgba(88, 90, 116, 0.12);
      cursor: pointer;
      -webkit-tap-highlight-color: transparent;
      touch-action: manipulation;
      transition: background 200ms ease, border-color 200ms ease, color 200ms ease, transform 200ms ease, box-shadow 200ms ease;
    }
    .mobile-offcanvas__header-phone .material-symbols-outlined {
      font-size: 1.125rem;
      font-variation-settings: "FILL" 1, "wght" 400, "GRAD" 0, "opsz" 24;
      pointer-events: none;
    }
    .mobile-offcanvas__header-phone:hover,
    .mobile-offcanvas__header-phone:focus-visible {
      background: var(--color-primary);
      border-color: var(--color-primary);
      color: #fff;
      transform: translateY(-1px);
    }
    .mobile-offcanvas__close {
      width: 2.5rem;
      height: 2.5rem;
      min-width: 2.5rem;
      min-height: 2.5rem;
      padding: 0;
      border-radius: 9999px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      flex-shrink: 0;
      background: var(--color-text);
      border: 1px solid rgba(255, 255, 255, 0.14);
      color: #fff;
      box-shadow: 0 10px 32px rgba(28, 27, 27, 0.32);
      cursor: pointer;
      -webkit-tap-highlight-color: transparent;
      touch-action: manipulation;
      transition: background 200ms ease, border-color 200ms ease, color 200ms ease, transform 200ms ease, box-shadow 200ms ease;
    }
    .mobile-offcanvas__close:hover,
    .mobile-offcanvas__close:focus-visible {
      background: #000;
      color: #fff;
    }
    .mobile-offcanvas__close .hamburger-icon__line:nth-child(1) {
      top: 50%;
      transform: translateY(-50%) rotate(45deg);
    }
    .mobile-offcanvas__close .hamburger-icon__line:nth-child(2) {
      opacity: 0;
      transform: translateY(-50%) scaleX(0);
    }
    .mobile-offcanvas__close .hamburger-icon__line:nth-child(3) {
      bottom: 50%;
      transform: translateY(50%) rotate(-45deg);
    }
    .mobile-offcanvas__brand-logo {
      display: block;
      height: 2rem;
      width: auto;
      max-width: 10.5rem;
      object-fit: contain;
      object-position: left center;
    }
    .mobile-offcanvas__brand-mark {
      width: 2.25rem;
      height: 2.25rem;
      border-radius: 0.75rem;
      background: var(--color-primary);
      color: #fff;
      display: inline-flex;
      align-items: center;
      justify-content: center;
    }
    .mobile-offcanvas__brand-mark .material-symbols-outlined { font-size: 1.25rem; }
    .mobile-offcanvas__brand-name {
      font-size: 1.25rem;
      font-weight: 700;
      letter-spacing: -0.02em;
    }
    .mobile-offcanvas__bottom {
      position: relative;
      z-index: 1;
      margin-top: auto;
      display: flex;
      flex-direction: column;
      padding-top: 1.25rem;
      border-top: 1px solid rgba(88, 90, 116, 0.1);
    }
    .mobile-offcanvas__action-row {
      display: flex;
      align-items: center;
      gap: 0.625rem;
      padding-top: 1.25rem;
      border-top: 1px solid rgba(88, 90, 116, 0.08);
    }
    .mobile-offcanvas__action-icon {
      flex-shrink: 0;
      width: 3.375rem;
      height: 3.375rem;
      border-radius: 9999px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      color: var(--color-primary);
      background: rgba(223, 224, 255, 0.45);
      border: 1px solid rgba(88, 90, 116, 0.12);
      text-decoration: none;
      transition: background 200ms ease, border-color 200ms ease, color 200ms ease, transform 200ms ease, box-shadow 200ms ease;
    }
    .mobile-offcanvas__action-icon .material-symbols-outlined {
      font-size: 1.125rem;
      font-variation-settings: "FILL" 1, "wght" 400, "GRAD" 0, "opsz" 24;
    }
    .mobile-offcanvas__action-icon:hover,
    .mobile-offcanvas__action-icon:focus-visible {
      background: var(--color-primary);
      border-color: var(--color-primary);
      color: #fff;
      transform: translateY(-1px);
      box-shadow: var(--shadow-sm);
    }
    .mobile-offcanvas__nav {
      position: relative;
      z-index: 1;
      display: flex;
      flex-direction: column;
      gap: 0.375rem;
      padding-block: 1rem;
      flex: 0 0 auto;
    }
    .mobile-offcanvas__link {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 1rem;
      padding: 0.95rem 1rem;
      border-radius: 1rem;
      font-size: var(--fs-label);
      font-weight: 700;
      letter-spacing: 0.14em;
      text-transform: uppercase;
      text-decoration: none;
      color: var(--color-text);
      border: 1px solid transparent;
      opacity: 0;
      transform: translateX(-1rem);
      transition:
        opacity 320ms cubic-bezier(0.22, 1, 0.36, 1),
        transform 320ms cubic-bezier(0.22, 1, 0.36, 1),
        background 200ms ease,
        border-color 200ms ease,
        color 200ms ease;
    }
    .mobile-offcanvas.is-open .mobile-offcanvas__link {
      opacity: 1;
      transform: translateX(0);
    }
    .mobile-offcanvas.is-open .mobile-offcanvas__link:nth-child(1) { transition-delay: 70ms; }
    .mobile-offcanvas.is-open .mobile-offcanvas__link:nth-child(2) { transition-delay: 110ms; }
    .mobile-offcanvas.is-open .mobile-offcanvas__link:nth-child(3) { transition-delay: 150ms; }
    .mobile-offcanvas.is-open .mobile-offcanvas__link:nth-child(4) { transition-delay: 190ms; }
    .mobile-offcanvas.is-open .mobile-offcanvas__link:nth-child(5) { transition-delay: 230ms; }
    .mobile-offcanvas.is-open .mobile-offcanvas__link:nth-child(6) { transition-delay: 270ms; }
    .mobile-offcanvas.is-open .mobile-offcanvas__link:nth-child(7) { transition-delay: 310ms; }
    .mobile-offcanvas__link:hover,
    .mobile-offcanvas__link:focus-visible {
      background: rgba(223, 224, 255, 0.45);
      border-color: rgba(88, 90, 116, 0.14);
      color: var(--color-primary);
    }
    .mobile-offcanvas__link-icon {
      font-size: 1.125rem;
      color: rgba(88, 90, 116, 0.45);
      transition: transform 220ms ease, color 220ms ease;
    }
    .mobile-offcanvas__link:hover .mobile-offcanvas__link-icon,
    .mobile-offcanvas__link:focus-visible .mobile-offcanvas__link-icon {
      transform: translateX(2px);
      color: var(--color-primary);
    }
    .mobile-offcanvas__footer {
      position: relative;
      z-index: 1;
      background: transparent;
    }
    .mobile-offcanvas__meta {
      display: flex;
      flex-direction: column;
      gap: 0.75rem;
      margin: 0;
    }
    .mobile-offcanvas__meta-item {
      display: flex;
      align-items: flex-start;
      gap: 0.75rem;
      font-size: var(--fs-body);
      line-height: 1.5;
      font-weight: 500;
      color: var(--color-text);
      text-decoration: none;
    }
    .mobile-offcanvas__meta-item .material-symbols-outlined {
      flex-shrink: 0;
      width: 2rem;
      height: 2rem;
      border-radius: 9999px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      font-size: 1rem;
      color: var(--color-primary);
      background: rgba(223, 224, 255, 0.45);
      border: 1px solid rgba(88, 90, 116, 0.1);
    }
    .mobile-offcanvas__meta-link {
      transition: color 200ms ease;
    }
    .mobile-offcanvas__meta-link:hover,
    .mobile-offcanvas__meta-link:focus-visible {
      color: var(--color-primary);
    }
    .mobile-offcanvas__meta-text {
      display: flex;
      flex-direction: column;
      gap: 0.125rem;
      padding-top: 0.2rem;
    }
    .mobile-offcanvas__meta-label {
      font-size: var(--fs-micro);
      font-weight: 800;
      letter-spacing: 0.14em;
      text-transform: uppercase;
      color: #475569;
    }
    .mobile-offcanvas__social {
      display: flex;
      align-items: center;
      gap: 0.625rem;
      margin-top: 1.25rem;
      padding-top: 1.25rem;
      border-top: 1px solid rgba(88, 90, 116, 0.06);
    }
    .mobile-offcanvas__social-link {
      width: 2.5rem;
      height: 2.5rem;
      border-radius: 9999px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      color: var(--color-primary);
      background: rgba(255, 255, 255, 0.72);
      border: 1px solid rgba(88, 90, 116, 0.12);
      text-decoration: none;
      transition: background 200ms ease, border-color 200ms ease, color 200ms ease, transform 200ms ease, box-shadow 200ms ease;
    }
    .mobile-offcanvas__social-link .material-symbols-outlined {
      font-size: 1.125rem;
    }
    .mobile-offcanvas__social-link:hover,
    .mobile-offcanvas__social-link:focus-visible {
      background: var(--color-primary);
      border-color: var(--color-primary);
      color: #fff;
      transform: translateY(-1px);
      box-shadow: var(--shadow-sm);
    }
    .mobile-offcanvas__phone {
      flex: 1;
      min-width: 0;
      justify-content: center;
      padding: 0.95rem 1.25rem;
      font-size: var(--fs-label);
      letter-spacing: 0.1em;
      text-transform: uppercase;
    }
    html.mobile-nav-open,
    body.mobile-nav-open {
      overflow: hidden;
      overscroll-behavior: none;
    }
    @media (prefers-reduced-motion: reduce) {
      .mobile-offcanvas__backdrop,
      .mobile-offcanvas__panel,
      .mobile-offcanvas__panel::before,
      .mobile-offcanvas__link,
      .hamburger-icon__line,
      .site-header .mobile-menu-toggle {
        transition: none !important;
      }
      .mobile-offcanvas__panel {
        opacity: 1;
        filter: none;
        transform: none;
      }
      .mobile-offcanvas__link {
        opacity: 1;
        transform: none;
      }
      body.mobile-nav-open .site-header .mobile-menu-toggle {
        box-shadow: none;
      }
    }
    .u-focus-ring:focus-visible { outline: 2px solid var(--color-primary); outline-offset: 2px; }
    .site-footer .u-focus-ring:focus-visible,
    .cta-switch .u-focus-ring:focus-visible {
      outline-color: var(--color-focus-inverse);
    }
    :target { scroll-margin-top: var(--header-height, 5rem); }
    .u-fluid-heading { text-wrap: balance; overflow-wrap: anywhere; font-family: var(--font-heading); }
    .u-type-micro { font-size: var(--fs-micro); line-height: 1.35; letter-spacing: 0.14em; }
    .u-type-label { font-size: var(--fs-label); line-height: 1.4; letter-spacing: 0.16em; }
    .u-type-eyebrow { font-size: var(--fs-label); line-height: 1.4; letter-spacing: 0.22em; text-transform: uppercase; font-weight: 800; }
    .u-type-body { font-size: var(--fs-body); line-height: 1.65; }
    .u-type-body-lg { font-size: var(--fs-body-lg); line-height: 1.6; }
    .u-type-title-md { font-size: var(--fs-title-md); line-height: 1.16; letter-spacing: -0.015em; font-family: var(--font-heading); }
    .u-type-title-lg { font-size: var(--fs-title-lg); line-height: 1.1; letter-spacing: -0.02em; font-family: var(--font-heading); }
    .u-type-title-xl { font-size: var(--fs-title-xl); line-height: 1.04; letter-spacing: -0.025em; font-family: var(--font-heading); }
    .u-type-title-hero { font-size: var(--fs-title-hero); line-height: 0.98; letter-spacing: -0.03em; font-family: var(--font-heading); }
    .header-phone {
      display: inline-flex;
      align-items: center;
      gap: 0.75rem;
      cursor: pointer;
      padding: 0.375rem 1.25rem 0.375rem 0.375rem;
      border-radius: 9999px;
      border: 1px solid rgba(255, 255, 255, 0.09);
      background: linear-gradient(165deg, #2e2d2d 0%, #1a1919 55%, #1c1b1b 100%);
      box-shadow:
        0 1px 0 rgba(255, 255, 255, 0.06) inset,
        0 8px 24px rgba(28, 27, 27, 0.24);
      text-decoration: none;
      color: #fff;
      transition:
        border-color 480ms cubic-bezier(0.22, 1, 0.36, 1),
        box-shadow 480ms cubic-bezier(0.22, 1, 0.36, 1),
        transform 480ms cubic-bezier(0.22, 1, 0.36, 1),
        background 480ms cubic-bezier(0.22, 1, 0.36, 1);
    }
    .header-phone:hover {
      border-color: rgba(255, 255, 255, 0.16);
      background: linear-gradient(165deg, #363535 0%, #1f1e1e 55%, #1c1b1b 100%);
      box-shadow:
        0 1px 0 rgba(255, 255, 255, 0.09) inset,
        0 12px 32px rgba(28, 27, 27, 0.32);
      transform: translateY(-1px);
    }
    .header-phone__icon {
      position: relative;
      flex-shrink: 0;
      width: 2.125rem;
      height: 2.125rem;
      border-radius: 9999px;
      background: linear-gradient(155deg, rgba(255, 255, 255, 0.14) 0%, rgba(255, 255, 255, 0.05) 100%);
      border: 1px solid rgba(255, 255, 255, 0.12);
      color: #fff;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.16),
        0 2px 10px rgba(0, 0, 0, 0.2);
      transition:
        background 480ms cubic-bezier(0.22, 1, 0.36, 1),
        border-color 480ms cubic-bezier(0.22, 1, 0.36, 1),
        box-shadow 480ms cubic-bezier(0.22, 1, 0.36, 1);
    }
    .header-phone__icon::before,
    .header-phone__icon::after {
      content: "";
      position: absolute;
      inset: 0;
      border-radius: 9999px;
      pointer-events: none;
      transition:
        opacity 480ms cubic-bezier(0.22, 1, 0.36, 1),
        transform 480ms cubic-bezier(0.22, 1, 0.36, 1);
    }
    .header-phone__icon::before {
      inset: -1px;
      background: radial-gradient(circle at 35% 25%, rgba(255, 255, 255, 0.55) 0%, transparent 58%);
      opacity: 0.45;
    }
    .header-phone__icon::after {
      inset: -4px;
      border: 1px solid rgba(255, 255, 255, 0.14);
      opacity: 0;
      transform: scale(0.94);
    }
    .header-phone__icon .material-symbols-outlined {
      position: relative;
      z-index: 1;
      font-size: 1.0625rem;
      font-variation-settings: "FILL" 1, "wght" 500, "GRAD" 0, "opsz" 24;
      transition: opacity 480ms cubic-bezier(0.22, 1, 0.36, 1);
    }
    .header-phone:hover .header-phone__icon {
      background: linear-gradient(155deg, rgba(255, 255, 255, 0.22) 0%, rgba(255, 255, 255, 0.08) 100%);
      border-color: rgba(255, 255, 255, 0.22);
      color: #fff;
      box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.28),
        0 4px 18px rgba(0, 0, 0, 0.28),
        0 0 28px rgba(195, 196, 227, 0.35);
    }
    .header-phone:hover .header-phone__icon::before {
      opacity: 0.75;
    }
    .header-phone:hover .header-phone__icon::after {
      opacity: 1;
      transform: scale(1);
      inset: -6px;
      border-color: rgba(255, 255, 255, 0.14);
    }
    .header-phone__number {
      font-family: "JetBrains Mono", ui-monospace, monospace;
      font-size: 0.8125rem;
      font-weight: 700;
      letter-spacing: 0.05em;
      white-space: nowrap;
      font-variant-numeric: tabular-nums;
      color: #fff;
      transition: color 480ms cubic-bezier(0.22, 1, 0.36, 1);
    }
    .header-phone:hover .header-phone__number {
      color: #dfe0ff;
    }
    .header-cta .header-phone__label {
      font-family: var(--font-body);
      font-size: var(--fs-label);
      font-weight: 700;
      letter-spacing: 0.04em;
      white-space: nowrap;
      color: #fff;
      transition: color 480ms cubic-bezier(0.22, 1, 0.36, 1);
    }
    .header-cta:hover .header-phone__label {
      color: #dfe0ff;
    }
    .icon-button { width: 3rem; height: 3rem; border: 1px solid #c7c5ce; border-radius: 9999px; display: inline-flex; align-items: center; justify-content: center; cursor: pointer; transition: color 200ms ease, background 200ms ease, border-color 200ms ease; }
    .icon-button:hover { border-color: var(--color-primary); background: var(--color-primary); color: #fff; }
    .icon-button:focus-visible { border-color: var(--color-primary); background: var(--color-primary); color: #fff; outline: 2px solid var(--color-primary); outline-offset: 2px; }
    .icon-button:disabled { opacity: 0.4; cursor: not-allowed; pointer-events: none; }
    .card-surface { background: #fff; border: 1px solid #eae7e7; border-radius: var(--radius-lg); }
    .newsletter-form-card,
    .inquiry-form-card {
      background: linear-gradient(180deg, #ffffff 0%, #faf8f7 100%);
      border: 1px solid rgba(88, 90, 116, 0.12);
      border-radius: 1.75rem;
      padding: clamp(1.25rem, 1rem + 0.8vw, 2rem);
      box-shadow: var(--shadow-sm);
    }
    .u-section-eyebrow { font-size: 11px; font-weight: 800; letter-spacing: 0.3em; text-transform: uppercase; color: var(--color-primary); }
    .u-section-title { font-size: clamp(2rem, 4vw, 3rem); font-weight: 700; line-height: 1.1; letter-spacing: -0.02em; }
    .input-field,
    .select-field,
    .textarea-field {
      width: 100%;
      border: 1px solid #c7c5ce;
      background: #fcf9f8;
      color: #1c1b1b;
      border-radius: 1rem;
      padding: 1rem 1.25rem;
    }
    .input-field:focus:not(:focus-visible),
    .select-field:focus:not(:focus-visible),
    .textarea-field:focus:not(:focus-visible) {
      outline: none;
    }
    .input-field:focus-visible,
    .select-field:focus-visible,
    .textarea-field:focus-visible {
      outline: none;
      border-color: var(--color-primary);
      box-shadow: 0 0 0 2px rgba(88, 90, 116, 0.2);
    }
    .inquiry-form .input-field.inquiry-form__input,
    .inquiry-form .textarea-field.inquiry-form__textarea {
      border: 1px solid rgba(88, 90, 116, 0.16);
      background: linear-gradient(180deg, #ffffff 0%, #faf8f7 100%);
      padding: 0.95rem 1.5rem;
      font-size: var(--fs-body);
      line-height: 1.45;
      box-shadow: inset 0 1px 2px rgba(28, 27, 27, 0.04);
      transition: border-color 200ms ease, box-shadow 200ms ease, background 200ms ease;
      -webkit-appearance: none;
      appearance: none;
    }
    .inquiry-form .input-field.inquiry-form__input {
      border-radius: 9999px;
      min-height: 3.25rem;
    }
    .inquiry-form .textarea-field.inquiry-form__textarea {
      width: 100%;
      border-radius: 2rem;
      resize: vertical;
      min-height: 9.5rem;
      padding: 1.125rem 1.5rem;
      line-height: 1.6;
    }
    .inquiry-form .input-field.inquiry-form__input::placeholder,
    .inquiry-form .textarea-field.inquiry-form__textarea::placeholder {
      color: rgba(28, 27, 27, 0.52);
      font-weight: 400;
    }
    .inquiry-form .input-field.inquiry-form__input:hover,
    .inquiry-form .textarea-field.inquiry-form__textarea:hover {
      border-color: rgba(88, 90, 116, 0.3);
      background: #fff;
    }
    .inquiry-form .input-field.inquiry-form__input:focus-visible,
    .inquiry-form .textarea-field.inquiry-form__textarea:focus-visible {
      outline: none;
      border-color: var(--color-primary);
      background: #fff;
      box-shadow: 0 0 0 3px rgba(88, 90, 116, 0.14);
    }
    .scroll-progress {
      position: fixed;
      top: 0;
      left: 0;
      width: 100%;
      height: 10px;
      z-index: 130;
      isolation: isolate;
      overflow: visible;
      pointer-events: none;
    }
    .scroll-progress__track {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 3px;
      background: rgba(88, 90, 116, 0.07);
      overflow: visible;
    }
    .scroll-progress__fill {
      position: relative;
      height: 100%;
      width: 0;
      background: linear-gradient(90deg, var(--color-primary) 0%, var(--color-primary-light) 45%, var(--color-focus-inverse) 100%);
      box-shadow:
        0 0 18px rgba(88, 90, 116, calc(0.2 + (var(--scroll-weight-velocity) * 0.4))),
        0 0 6px rgba(195, 196, 227, calc(0.3 + (var(--scroll-weight-velocity) * 0.6)));
      will-change: width;
    }
    .scroll-progress__fill::after {
      content: "";
      position: absolute;
      top: 50%;
      right: 0;
      z-index: 1;
      width: 10px;
      height: 10px;
      border-radius: 9999px;
      background: #fff;
      transform: translate(50%, -50%);
      box-shadow: 0 0 0 2px rgba(88, 90, 116, 0.25), 0 0 14px rgba(195, 196, 227, 0.9);
    }
    @media (prefers-reduced-motion: no-preference) {
      .scroll-progress__fill { transition: width 120ms ease-out; }
    }
    @media (prefers-reduced-motion: reduce) {
      *, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
      body.has-scroll-weight.is-ready main > section { transform: none !important; }
      body.is-loading .site-header,
      body.is-loading .scroll-progress,
      body.is-loading .site-footer,
      body.is-loading main > section {
        opacity: 1;
        transform: none;
        filter: none;
      }
      body.is-loading::before { opacity: 0; }
    }
    .text-link-cta {
      cursor: pointer;
      transition: border-color 200ms ease, color 200ms ease;
    }
    .text-link-cta:focus-visible { outline: 2px solid var(--color-primary); outline-offset: 2px; }
    .site-footer {
      padding-bottom: 2px;
    }
    body.is-loading .site-footer--premium,
    body.is-ready .site-footer--premium {
      opacity: 1;
      transform: none;
      filter: none;
    }
    .form-feedback {
      margin-top: 0.75rem;
      font-size: var(--fs-label);
      font-weight: 600;
      text-align: center;
    }
    .form-feedback[hidden] { display: none; }
    .form-feedback--success { color: var(--color-primary); }
    .mobile-offcanvas__action-icon { cursor: pointer; }
    .primary-navigation a { cursor: pointer; }

    /* Desktop nav dropdown (Leistungen) */
    .nav-dropdown { position: relative; }
    .nav-dropdown__trigger {
      cursor: pointer;
      user-select: none;
    }
    .nav-dropdown__trigger .material-symbols-outlined {
      transition: transform 200ms ease;
    }
    .nav-dropdown[open] .nav-dropdown__trigger .material-symbols-outlined,
    .nav-dropdown.is-hover .nav-dropdown__trigger .material-symbols-outlined {
      transform: rotate(180deg);
    }
    .nav-dropdown__menu:not(.nav-dropdown__menu--premium) {
      position: absolute;
      top: 100%;
      left: 0;
      margin: 0;
      padding: 0;
      list-style: none;
      opacity: 0;
      visibility: hidden;
      transform: translateY(0.375rem);
      pointer-events: none;
      transition:
        opacity 180ms ease,
        transform 180ms ease,
        visibility 180ms ease;
    }
    .nav-dropdown[open] .nav-dropdown__menu:not(.nav-dropdown__menu--premium),
    .nav-dropdown.is-hover .nav-dropdown__menu:not(.nav-dropdown__menu--premium),
    .nav-dropdown:focus-within .nav-dropdown__menu:not(.nav-dropdown__menu--premium) {
      opacity: 1;
      visibility: visible;
      transform: translateY(0);
      pointer-events: auto;
    }
    @media (min-width: 1024px) and (hover: hover) {
      .nav-dropdown:hover .nav-dropdown__menu:not(.nav-dropdown__menu--premium) {
        opacity: 1;
        visibility: visible;
        transform: translateY(0);
        pointer-events: auto;
      }
    }
    /* Premium-Dropdown: kein transform auf Glass-Layer (backdrop-filter) */
    .site-header--premium .nav-dropdown[open] .nav-dropdown__menu--premium,
    .site-header--premium .nav-dropdown.is-hover .nav-dropdown__menu--premium,
    .site-header--premium .nav-dropdown:focus-within .nav-dropdown__menu--premium {
      transform: none !important;
      filter: none !important;
    }
    @media (min-width: 1024px) and (hover: hover) {
      .site-header--premium .nav-dropdown:hover .nav-dropdown__menu--premium {
        transform: none !important;
        filter: none !important;
      }
    }

    .inquiry-form select.inquiry-form__input {
      padding-right: 2.75rem;
      background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%2346464d' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
      background-repeat: no-repeat;
      background-position: right 1.25rem center;
      background-size: 1rem;
      cursor: pointer;
    }

    .form-feedback--error {
      color: #ba1a1a;
    }

    @media (prefers-reduced-motion: reduce) {
      body.is-loading::before,
      body.is-loading .site-header,
      body.is-loading .scroll-progress,
      body.is-loading .site-footer,
      body.is-loading main > section,
      body.is-loading .site-header--premium .site-header__wrap,
      body.is-ready .site-header--premium .site-header__wrap,
      body.is-loading .site-header--premium .site-header__glass,
      body.is-ready .site-header--premium .site-header__glass {
        animation: none !important;
        transition: none !important;
        opacity: 1 !important;
        visibility: visible !important;
        transform: none !important;
        filter: none !important;
      }
      body.has-scroll-weight.is-ready main > section {
        transform: none !important;
      }
      .nav-dropdown__menu,
      .nav-dropdown__trigger .material-symbols-outlined,
      .site-header--premium .nav-dropdown .nav-dropdown__menu-shell,
      .site-header--premium .nav-dropdown .nav-dropdown__menu--premium,
      .site-header--premium .nav-dropdown__link,
      .site-header--premium .nav-pill__chevron {
        transition: none !important;
        transition-delay: 0ms !important;
        filter: none !important;
      }
      .site-header--premium .nav-dropdown[open] .nav-dropdown__menu-shell,
      .site-header--premium .nav-dropdown.is-hover .nav-dropdown__menu-shell,
      .site-header--premium .nav-dropdown:focus-within .nav-dropdown__menu-shell {
        transform: none !important;
      }
      .nav-dropdown__menu-shell.is-visible .nav-dropdown__link {
        opacity: 1 !important;
        transform: none !important;
      }
    }