/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */
@layer properties;
@layer theme, base, components, utilities;
@layer theme {
  :root, :host {
    --font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue",
      "Noto Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji",
      "Segoe UI Symbol", "Noto Color Emoji";
    --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono",
      "Courier New", monospace;
    --color-neutral-100: #f5f5f8;
    --color-neutral-200: #e7e7ea;
    --color-neutral-300: #d4d4d7;
    --color-neutral-400: #b7b7ba;
    --color-neutral-500: #98989b;
    --color-neutral-600: #7a7a7d;
    --color-neutral-700: #5d5d60;
    --color-neutral-800: #424244;
    --color-neutral-900: #2b2b2d;
    --color-white: #fff;
    --spacing: 0.25rem;
    --font-weight-semibold: 600;
    --radius-sm: 0px;
    --radius-md: 0px;
    --radius-lg: 0px;
    --shadow-sm: 0 1px 2px color-mix(in srgb, #2b2b2d 14%, transparent);
    --shadow-md: 0 3px 10px color-mix(in srgb, #2b2b2d 16%, transparent);
    --shadow-lg: 0 12px 32px color-mix(in srgb, #2b2b2d 22%, transparent);
    --default-font-family: var(--font-sans);
    --default-mono-font-family: var(--font-mono);
    --color-bg: #f1fcfe;
    --color-surface: #def9fc;
    --color-text: #1d1f20;
    --color-accent: #0fa9bb;
    --color-accent-2: #2fbccb;
    --color-divider: color-mix(in srgb, #1d1f20 16%, transparent);
    --color-bar: #1c1f21;
    --color-bar-text: #f1fcfe;
    --color-support: #d92d20;
    --color-support-dark: #b42318;
    --color-accent-100: #e9f8fa;
    --color-accent-200: #c6eff4;
    --color-accent-300: #92e0e9;
    --color-accent-400: #52cbda;
    --color-accent-500: #23b7c8;
    --color-accent-600: #0fa9bb;
    --color-accent-700: #067a89;
    --color-accent-800: #05606c;
    --color-accent-900: #043f47;
    --color-accent-2-100: #ebf9fb;
    --color-accent-2-200: #cbf1f5;
    --color-accent-2-300: #9ce4ec;
    --color-accent-2-400: #63d1de;
    --color-accent-2-500: #3cc4d3;
    --color-accent-2-600: #2fbccb;
    --color-accent-2-700: #0f8b9a;
    --color-accent-2-800: #0b6b77;
    --color-accent-2-900: #084751;
    --font-heading: "Bahnschrift", "Avenir Next Condensed", "Arial Narrow", "Helvetica Neue", system-ui, sans-serif;
    --font-body: system-ui, "Segoe UI", "Helvetica Neue", Arial, sans-serif;
  }
}

/* Unternehmensseite: moderner, ruhiger B2B-Auftritt */
.business-hero {
  display: block;
  min-height: auto;
  overflow: hidden;
}
.business-hero__copy { max-width: 900px; }
.business-hero__copy { position: relative; z-index: 1; }
.hero-panel {
  padding: clamp(28px, 5vw, 58px);
  border: 1px solid color-mix(in srgb, var(--color-text) 13%, transparent);
  border-top: 4px solid var(--color-accent);
  background: color-mix(in srgb, var(--color-surface) 58%, var(--color-bg));
  box-shadow: 18px 18px 0 color-mix(in srgb, var(--color-accent) 9%, transparent);
}
.hero-panel hr { max-width: 460px; }
.hero-panel .btn { min-height: 44px; padding-inline: 18px; }
.trust-line {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 24px;
  margin-top: 32px;
  color: color-mix(in srgb, var(--color-text) 68%, transparent);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: .06em;
  text-transform: uppercase;
}
.trust-line {
  padding-top: 22px;
  border-top: 1px solid color-mix(in srgb, var(--color-text) 12%, transparent);
}
.trust-line span { display: inline-flex; align-items: center; gap: 9px; }
.trust-line span::before {
  content: "";
  width: 6px;
  height: 6px;
  background: var(--color-accent);
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--color-accent) 13%, transparent);
}
.process-intro {
  max-width: 850px;
  padding-left: clamp(18px, 3vw, 32px);
  border-left: 3px solid var(--color-accent);
}
.process-step {
  position: relative;
  margin-bottom: clamp(24px, 4vw, 40px);
  padding: clamp(24px, 4vw, 42px);
  border: 1px solid var(--color-divider);
  background: var(--color-surface);
}
.process-step::after {
  content: "";
  position: absolute;
  right: 0;
  top: 0;
  width: 48px;
  height: 3px;
  background: var(--color-accent);
}
.process-step__lead { max-width: 790px; }
.process-step > h3,
.process-step__lead h3 { max-width: 900px; }
.process-step > p,
.process-step__lead p { max-width: 760px; }
.service-card, .managed-card, .server-card {
  position: relative;
  transition: transform .2s ease, border-color .2s ease, background-color .2s ease, box-shadow .2s ease;
}
.service-card { background: color-mix(in srgb, var(--color-bg) 68%, transparent); }
.service-card::before, .managed-card::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 42px;
  height: 3px;
  background: var(--color-accent);
}
.managed-card {
  min-height: 100%;
  background: color-mix(in srgb, var(--color-bg) 48%, transparent);
  border-color: color-mix(in srgb, var(--color-text) 12%, transparent);
}
.server-card { background: color-mix(in srgb, var(--color-bg) 64%, transparent); }
.server-card--recommended {
  border-color: var(--color-accent);
  background: var(--color-bar);
  color: var(--color-bar-text);
  box-shadow: 16px 16px 0 color-mix(in srgb, var(--color-accent) 16%, transparent);
}
.server-card--recommended p { color: color-mix(in srgb, var(--color-bar-text) 78%, transparent); }
.server-card--recommended span { color: var(--color-accent-300); }
@media (hover: hover) {
  .service-card:hover, .managed-card:hover, .server-card:not(.server-card--recommended):hover {
    transform: translateY(-4px);
    border-color: color-mix(in srgb, var(--color-accent) 55%, transparent);
    box-shadow: 0 14px 32px color-mix(in srgb, var(--color-bar) 9%, transparent);
  }
}

.contact-finale { padding-top: clamp(44px, 7vw, 88px); }
.contact-finale__inner {
  position: relative;
  overflow: hidden;
  padding: clamp(28px, 5vw, 56px);
  background: var(--color-bar);
  color: var(--color-bar-text);
  box-shadow: 20px 20px 0 color-mix(in srgb, var(--color-accent) 12%, transparent);
}
.contact-finale__inner::after {
  content: "";
  position: absolute;
  width: 260px;
  height: 260px;
  right: -90px;
  top: -110px;
  border: 1px solid color-mix(in srgb, var(--color-accent) 42%, transparent);
  transform: rotate(45deg);
}
.contact-finale__eyebrow {
  display: block;
  margin-bottom: 14px;
  color: var(--color-accent-300);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: .1em;
  text-transform: uppercase;
}
.contact-finale__phone {
  position: relative;
  z-index: 1;
  display: inline-flex;
  align-items: center;
  padding: 11px 0;
  color: var(--color-bar-text);
  font-weight: 600;
}
.contact-finale__phone:hover { color: var(--color-accent-300); }

@media (max-width: 820px) {
  .business-hero h1 { font-size: clamp(38px, 11vw, 64px); }
}
@media (max-width: 520px) {
  .hero-panel { padding: 24px 20px; box-shadow: 10px 10px 0 color-mix(in srgb, var(--color-accent) 9%, transparent); }
  .trust-line { display: grid; gap: 12px; }
  .process-intro { padding-left: 16px; }
  .process-step { padding: 22px 18px; }
  .contact-finale__inner { margin-inline: -8px; }
}
@media (prefers-reduced-motion: reduce) {
  .service-card, .managed-card, .server-card { transition: none; }
}

.support-page {
  background:
    radial-gradient(circle at 100% 0%, color-mix(in srgb, var(--color-accent) 10%, transparent), transparent 34%),
    radial-gradient(circle at 0% 14%, color-mix(in srgb, var(--color-support) 8%, transparent), transparent 26%),
    linear-gradient(180deg, color-mix(in srgb, var(--color-bg) 94%, #fff) 0%, var(--color-bg) 100%);
}
.support-hero {
  position: relative;
}
.support-hero__grid {
  display: grid;
  grid-template-columns: minmax(0, 1.3fr) minmax(320px, 0.8fr);
  gap: clamp(24px, 4vw, 56px);
  align-items: start;
}
.support-hero__copy {
  max-width: 900px;
}
.support-hero__panel {
  background: var(--color-bar);
  color: var(--color-bar-text);
  box-shadow: 20px 20px 0 color-mix(in srgb, var(--color-accent) 12%, transparent);
}
.support-hero__eyebrow {
  display: block;
  color: var(--color-accent-300);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: .1em;
  text-transform: uppercase;
}
.support-hero__phone {
  margin-top: 12px;
  font-family: var(--font-heading);
  font-size: clamp(32px, 4vw, 54px);
  line-height: 1;
  letter-spacing: .01em;
}
.support-hero__meta {
  display: grid;
  grid-template-columns: 1fr;
  gap: 14px;
}
.support-hero__meta div {
  padding-top: 14px;
  border-top: 1px solid color-mix(in srgb, var(--color-bar-text) 16%, transparent);
}
.support-hero__meta span {
  display: block;
  color: color-mix(in srgb, var(--color-bar-text) 68%, transparent);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.support-hero__meta strong {
  display: block;
  margin-top: 6px;
  color: var(--color-bar-text);
  font-family: var(--font-heading);
  font-size: 18px;
  font-weight: 600;
  line-height: 1.15;
}
.support-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}
.support-chips span {
  display: inline-flex;
  align-items: center;
  min-height: 38px;
  padding: 8px 14px;
  border: 1px solid color-mix(in srgb, var(--color-text) 14%, transparent);
  background: color-mix(in srgb, var(--color-surface) 42%, transparent);
  color: var(--color-text);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: .05em;
  text-transform: uppercase;
}
.support-actions {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: clamp(18px, 3vw, 32px);
}
.support-action {
  min-height: 100%;
}
.support-action--phone {
  grid-column: span 7;
}
.support-action--remote {
  grid-column: span 5;
  background: color-mix(in srgb, var(--color-bg) 60%, transparent);
}
.support-action--mail {
  grid-column: span 5;
}
.support-action--onsite {
  grid-column: span 7;
}
.support-action--remote a,
.support-action--phone a,
.support-action--mail a {
  text-underline-offset: 3px;
}

/* Supportseite: mobile Umbrüche – muss nach den Basisregeln stehen */
@media (max-width: 820px) {
  .support-hero__grid { grid-template-columns: minmax(0, 1fr); }
  .support-hero__panel { box-shadow: 12px 12px 0 color-mix(in srgb, var(--color-accent) 12%, transparent); }
  .support-actions { grid-template-columns: minmax(0, 1fr); }
  .support-action--phone,
  .support-action--remote,
  .support-action--mail,
  .support-action--onsite { grid-column: auto; }
}
@media (max-width: 520px) {
  .support-hero__panel { box-shadow: 8px 8px 0 color-mix(in srgb, var(--color-accent) 12%, transparent); }
  .support-hero__phone { font-size: clamp(30px, 9vw, 44px); word-break: break-word; }
  .support-hero__meta strong { font-size: 16px; }
}

/* Supportseite: FAQ-Akkordeon */
.faq-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(16px, 2.4vw, 24px);
  align-items: start;
}
@media (max-width: 820px) {
  .faq-grid { grid-template-columns: 1fr; }
}
.faq > summary {
  display: block;
  cursor: pointer;
  list-style: none;
  position: relative;
  padding-right: 28px;
}
.faq > summary::-webkit-details-marker { display: none; }
.faq > summary::after {
  content: "+";
  position: absolute;
  right: 0;
  top: 0;
  color: var(--color-accent-700);
  font-family: var(--font-heading);
  font-size: 22px;
  line-height: 1;
}
.faq[open] > summary::after { content: "–"; }
.faq > summary:hover { color: var(--color-accent-700); }

@layer base {
  *, ::after, ::before, ::backdrop, ::file-selector-button {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    border: 0 solid;
  }
  html, :host {
    line-height: 1.5;
    -webkit-text-size-adjust: 100%;
    tab-size: 4;
    font-family: var(--default-font-family, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");
    font-feature-settings: var(--default-font-feature-settings, normal);
    font-variation-settings: var(--default-font-variation-settings, normal);
    -webkit-tap-highlight-color: transparent;
  }
  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:where(:not(iframe)) {
    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;
  }
  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 {
  .visible {
    visibility: visible;
  }
  .fixed {
    position: fixed;
  }
  .relative {
    position: relative;
  }
  .static {
    position: static;
  }
  .m-0 {
    margin: 0px;
  }
  .mx-auto {
    margin-inline: auto;
  }
  .my-2 {
    margin-block: calc(var(--spacing) * 2);
  }
  .mt-1\.5 {
    margin-top: calc(var(--spacing) * 1.5);
  }
  .mt-2 {
    margin-top: calc(var(--spacing) * 2);
  }
  .mt-2\.5 {
    margin-top: calc(var(--spacing) * 2.5);
  }
  .mt-3 {
    margin-top: calc(var(--spacing) * 3);
  }
  .mt-3\.5 {
    margin-top: calc(var(--spacing) * 3.5);
  }
  .mt-4 {
    margin-top: calc(var(--spacing) * 4);
  }
  .mt-5 {
    margin-top: calc(var(--spacing) * 5);
  }
  .mt-6 {
    margin-top: calc(var(--spacing) * 6);
  }
  .mt-7 {
    margin-top: calc(var(--spacing) * 7);
  }
  .mt-9 {
    margin-top: calc(var(--spacing) * 9);
  }
  .mt-12 {
    margin-top: calc(var(--spacing) * 12);
  }
  .mt-\[22px\] {
    margin-top: 22px;
  }
  .mr-auto {
    margin-right: auto;
  }
  .mb-2 {
    margin-bottom: calc(var(--spacing) * 2);
  }
  .mb-2\.5 {
    margin-bottom: calc(var(--spacing) * 2.5);
  }
  .mb-\[clamp\(28px\,4vw\,44px\)\] {
    margin-bottom: clamp(28px, 4vw, 44px);
  }
  .-ml-\[0\.05em\] {
    margin-left: calc(0.05em * -1);
  }
  .ml-auto {
    margin-left: auto;
  }
  .block {
    display: block;
  }
  .flex {
    display: flex;
  }
  .grid {
    display: grid;
  }
  .inline {
    display: inline;
  }
  .inline-block {
    display: inline-block;
  }
  .table {
    display: table;
  }
  .aspect-3\/2 {
    aspect-ratio: 3/2;
  }
  .size-13 {
    width: calc(var(--spacing) * 13);
    height: calc(var(--spacing) * 13);
  }
  .h-\[42px\] {
    height: 42px;
  }
  .h-px {
    height: 1px;
  }
  .w-auto {
    width: auto;
  }
  .w-full {
    width: 100%;
  }
  .w-px {
    width: 1px;
  }
  .max-w-\[48ch\] {
    max-width: 48ch;
  }
  .max-w-\[52ch\] {
    max-width: 52ch;
  }
  .max-w-\[56ch\] {
    max-width: 56ch;
  }
  .max-w-\[60ch\] {
    max-width: 60ch;
  }
  .max-w-\[1160px\] {
    max-width: 1160px;
  }
  .flex-1 {
    flex: 1;
  }
  .grid-cols-\[auto_1fr\] {
    grid-template-columns: auto 1fr;
  }
  .grid-cols-\[repeat\(auto-fit\,minmax\(190px\,1fr\)\)\] {
    grid-template-columns: repeat(auto-fit,minmax(190px,1fr));
  }
  .grid-cols-\[repeat\(auto-fit\,minmax\(min\(220px\,100\%\)\,1fr\)\)\] {
    grid-template-columns: repeat(auto-fit,minmax(min(220px, 100%),1fr));
  }
  .grid-cols-\[repeat\(auto-fit\,minmax\(min\(240px\,100\%\)\,1fr\)\)\] {
    grid-template-columns: repeat(auto-fit,minmax(min(240px, 100%),1fr));
  }
  .grid-cols-\[repeat\(auto-fit\,minmax\(min\(270px\,100\%\)\,1fr\)\)\] {
    grid-template-columns: repeat(auto-fit,minmax(min(270px, 100%),1fr));
  }
  .grid-cols-\[repeat\(auto-fit\,minmax\(min\(280px\,100\%\)\,1fr\)\)\] {
    grid-template-columns: repeat(auto-fit,minmax(min(280px, 100%),1fr));
  }
  .grid-cols-\[repeat\(auto-fit\,minmax\(min\(300px\,100\%\)\,1fr\)\)\] {
    grid-template-columns: repeat(auto-fit,minmax(min(300px, 100%),1fr));
  }
  .grid-cols-\[repeat\(auto-fit\,minmax\(min\(320px\,100\%\)\,1fr\)\)\] {
    grid-template-columns: repeat(auto-fit,minmax(min(320px, 100%),1fr));
  }
  .flex-col {
    flex-direction: column;
  }
  .flex-wrap {
    flex-wrap: wrap;
  }
  .items-baseline {
    align-items: baseline;
  }
  .items-center {
    align-items: center;
  }
  .justify-center {
    justify-content: center;
  }
  .justify-end {
    justify-content: flex-end;
  }
  .gap-3 {
    gap: calc(var(--spacing) * 3);
  }
  .gap-4 {
    gap: calc(var(--spacing) * 4);
  }
  .gap-5 {
    gap: calc(var(--spacing) * 5);
  }
  .gap-\[clamp\(20px\,3vw\,32px\)\] {
    gap: clamp(20px, 3vw, 32px);
  }
  .gap-\[clamp\(24px\,3vw\,40px\)\] {
    gap: clamp(24px, 3vw, 40px);
  }
  .gap-\[clamp\(24px\,4vw\,48px\)\] {
    gap: clamp(24px, 4vw, 48px);
  }
  .gap-\[clamp\(28px\,5vw\,72px\)\] {
    gap: clamp(28px, 5vw, 72px);
  }
  .gap-px {
    gap: 1px;
  }
  .gap-x-7 {
    column-gap: calc(var(--spacing) * 7);
  }
  .gap-x-10 {
    column-gap: calc(var(--spacing) * 10);
  }
  .gap-x-\[clamp\(16px\,2\.4vw\,32px\)\] {
    column-gap: clamp(16px, 2.4vw, 32px);
  }
  .gap-x-\[clamp\(16px\,3vw\,32px\)\] {
    column-gap: clamp(16px, 3vw, 32px);
  }
  .gap-y-0 {
    row-gap: 0px;
  }
  .gap-y-1\.5 {
    row-gap: calc(var(--spacing) * 1.5);
  }
  .gap-y-3 {
    row-gap: calc(var(--spacing) * 3);
  }
  .gap-y-4 {
    row-gap: calc(var(--spacing) * 4);
  }
  .rounded {
    border-radius: 0.25rem;
  }
  .border {
    border-style: var(--tw-border-style);
    border-width: 1px;
  }
  .border-0 {
    border-style: var(--tw-border-style);
    border-width: 0px;
  }
  .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-accent {
    border-color: var(--color-accent);
  }
  .border-divider {
    border-color: var(--color-divider);
  }
  .border-white\/10 {
    border-color: color-mix(in srgb, #fff 10%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      border-color: color-mix(in oklab, var(--color-white) 10%, transparent);
    }
  }
  .bg-bar {
    background-color: var(--color-bar);
  }
  .bg-bg {
    background-color: var(--color-bg);
  }
  .bg-divider {
    background-color: var(--color-divider);
  }
  .object-cover {
    object-fit: cover;
  }
  .p-6 {
    padding: calc(var(--spacing) * 6);
  }
  .p-\[22px\] {
    padding: 22px;
  }
  .p-\[clamp\(20px\,3vw\,28px\)\] {
    padding: clamp(20px, 3vw, 28px);
  }
  .p-\[clamp\(22px\,3vw\,32px\)\] {
    padding: clamp(22px, 3vw, 32px);
  }
  .p-\[clamp\(24px\,4vw\,36px\)\] {
    padding: clamp(24px, 4vw, 36px);
  }
  .p-\[clamp\(24px\,4vw\,40px\)\] {
    padding: clamp(24px, 4vw, 40px);
  }
  .px-6 {
    padding-inline: calc(var(--spacing) * 6);
  }
  .px-\[22px\] {
    padding-inline: 22px;
  }
  .px-\[clamp\(20px\,5vw\,64px\)\] {
    padding-inline: clamp(20px, 5vw, 64px);
  }
  .py-5 {
    padding-block: calc(var(--spacing) * 5);
  }
  .py-8 {
    padding-block: calc(var(--spacing) * 8);
  }
  .py-\[22px\] {
    padding-block: 22px;
  }
  .py-\[clamp\(24px\,4vw\,48px\)\] {
    padding-block: clamp(24px, 4vw, 48px);
  }
  .py-\[clamp\(40px\,6vw\,72px\)\] {
    padding-block: clamp(40px, 6vw, 72px);
  }
  .pt-6 {
    padding-top: calc(var(--spacing) * 6);
  }
  .pt-\[clamp\(32px\,5vw\,64px\)\] {
    padding-top: clamp(32px, 5vw, 64px);
  }
  .pt-\[clamp\(40px\,6vw\,80px\)\] {
    padding-top: clamp(40px, 6vw, 80px);
  }
  .pt-\[clamp\(48px\,8vw\,96px\)\] {
    padding-top: clamp(48px, 8vw, 96px);
  }
  .pt-\[clamp\(56px\,9vw\,110px\)\] {
    padding-top: clamp(56px, 9vw, 110px);
  }
  .pb-3\.5 {
    padding-bottom: calc(var(--spacing) * 3.5);
  }
  .pb-5 {
    padding-bottom: calc(var(--spacing) * 5);
  }
  .pb-\[clamp\(24px\,4vw\,40px\)\] {
    padding-bottom: clamp(24px, 4vw, 40px);
  }
  .pb-\[clamp\(36px\,5vw\,56px\)\] {
    padding-bottom: clamp(36px, 5vw, 56px);
  }
  .pb-\[clamp\(40px\,6vw\,64px\)\] {
    padding-bottom: clamp(40px, 6vw, 64px);
  }
  .pb-\[clamp\(40px\,6vw\,72px\)\] {
    padding-bottom: clamp(40px, 6vw, 72px);
  }
  .pb-\[clamp\(48px\,7vw\,88px\)\] {
    padding-bottom: clamp(48px, 7vw, 88px);
  }
  .font-heading {
    font-family: var(--font-heading);
  }
  .text-\[12px\] {
    font-size: 12px;
  }
  .text-\[13px\] {
    font-size: 13px;
  }
  .text-\[14px\] {
    font-size: 14px;
  }
  .text-\[15px\] {
    font-size: 15px;
  }
  .text-\[17px\] {
    font-size: 17px;
  }
  .text-\[18px\] {
    font-size: 18px;
  }
  .text-\[19px\] {
    font-size: 19px;
  }
  .text-\[22px\] {
    font-size: 22px;
  }
  .text-\[24px\] {
    font-size: 24px;
  }
  .text-\[34px\] {
    font-size: 34px;
  }
  .text-\[clamp\(20px\,2\.4vw\,26px\)\] {
    font-size: clamp(20px, 2.4vw, 26px);
  }
  .text-\[clamp\(24px\,3vw\,32px\)\] {
    font-size: clamp(24px, 3vw, 32px);
  }
  .text-\[clamp\(26px\,3\.4vw\,38px\)\] {
    font-size: clamp(26px, 3.4vw, 38px);
  }
  .text-\[clamp\(38px\,6vw\,72px\)\] {
    font-size: clamp(38px, 6vw, 72px);
  }
  .text-\[clamp\(42px\,7vw\,88px\)\] {
    font-size: clamp(42px, 7vw, 88px);
  }
  .leading-\[1\.1\] {
    --tw-leading: 1.1;
    line-height: 1.1;
  }
  .leading-\[1\.2\] {
    --tw-leading: 1.2;
    line-height: 1.2;
  }
  .leading-\[1\.05\] {
    --tw-leading: 1.05;
    line-height: 1.05;
  }
  .leading-\[1\.6\] {
    --tw-leading: 1.6;
    line-height: 1.6;
  }
  .leading-\[1\.9\] {
    --tw-leading: 1.9;
    line-height: 1.9;
  }
  .leading-\[1\.15\] {
    --tw-leading: 1.15;
    line-height: 1.15;
  }
  .leading-\[1\.25\] {
    --tw-leading: 1.25;
    line-height: 1.25;
  }
  .leading-\[1\.55\] {
    --tw-leading: 1.55;
    line-height: 1.55;
  }
  .font-semibold {
    --tw-font-weight: var(--font-weight-semibold);
    font-weight: var(--font-weight-semibold);
  }
  .tracking-\[0\.01em\] {
    --tw-tracking: 0.01em;
    letter-spacing: 0.01em;
  }
  .tracking-\[0\.02em\] {
    --tw-tracking: 0.02em;
    letter-spacing: 0.02em;
  }
  .tracking-\[0\.06em\] {
    --tw-tracking: 0.06em;
    letter-spacing: 0.06em;
  }
  .tracking-\[0\.08em\] {
    --tw-tracking: 0.08em;
    letter-spacing: 0.08em;
  }
  .text-accent-700 {
    color: var(--color-accent-700);
  }
  .text-bar-text {
    color: var(--color-bar-text);
  }
  .text-text\/70 {
    color: color-mix(in srgb, #1d1f20 70%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      color: color-mix(in oklab, var(--color-text) 70%, transparent);
    }
  }
  .text-text\/78 {
    color: color-mix(in srgb, #1d1f20 78%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      color: color-mix(in oklab, var(--color-text) 78%, transparent);
    }
  }
  .uppercase {
    text-transform: uppercase;
  }
  .no-underline {
    text-decoration-line: none;
  }
  .shadow {
    --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  .outline {
    outline-style: var(--tw-outline-style);
    outline-width: 1px;
  }
}
@layer base {
  :root {
    --font-heading-weight: 600;
    --space-1: 3.4px;
    --space-2: 6.8px;
    --space-3: 10.2px;
    --space-4: 13.6px;
  }
  body {
    background: var(--color-bg);
    color: var(--color-text);
    font-family: var(--font-body);
    font-size: 15px;
    line-height: 1.55;
    text-wrap: pretty;
  }
  h1, h2, h3, h4, h5, h6 {
    font-family: var(--font-heading);
    font-weight: var(--font-heading-weight);
    line-height: 1.12;
    letter-spacing: -0.015em;
  }
  a {
    color: var(--color-accent-700);
    text-underline-offset: 3px;
  }
  a:hover {
    color: var(--color-accent-800);
  }
  html {
    scroll-behavior: smooth;
  }
  @media (prefers-reduced-motion: reduce) {
    html {
      scroll-behavior: auto;
    }
  }
  :focus {
    outline: none;
  }
  :focus-visible {
    outline: 2px solid var(--color-accent-700);
    outline-offset: 2px;
  }
  ::selection {
    background: color-mix(in srgb, #0fa9bb 30%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      background: color-mix(in srgb, var(--color-accent) 30%, transparent);
    }
  }
}
@layer components {
  main > section {
    padding-inline: calc(max(0px, (100% - 1160px) / 2) + clamp(20px, 5vw, 64px));
  }
  .band-dark {
    --color-bg: var(--color-bar);
    --color-surface: color-mix(in srgb, var(--color-bar-text) 10%, var(--color-bar));
    --color-text: var(--color-bar-text);
    --color-divider: color-mix(in srgb, var(--color-bar-text) 24%, transparent);
    --color-accent-700: var(--color-accent-400);
    --color-accent-800: var(--color-accent-300);
    background: var(--color-bar);
    color: var(--color-bar-text);
  }
  .blueprint {
    position: relative;
    border: 1px solid var(--color-divider);
  }
  .blueprint.duotone {
    overflow: visible;
  }
  .blueprint > .corner {
    position: absolute;
    width: 11px;
    height: 11px;
    color: color-mix(in srgb, #1d1f20 55%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      color: color-mix(in srgb, var(--color-text) 55%, transparent);
    }
  }
  .blueprint > .corner::before, .blueprint > .corner::after {
    content: "";
    position: absolute;
    background: currentColor;
  }
  .blueprint > .corner::before {
    left: 5px;
    top: 0;
    width: 1px;
    height: 100%;
  }
  .blueprint > .corner::after {
    top: 5px;
    left: 0;
    width: 100%;
    height: 1px;
  }
  .blueprint > .corner.tl {
    top: -6px;
    left: -6px;
  }
  .blueprint > .corner.tr {
    top: -6px;
    right: -6px;
  }
  .blueprint > .corner.bl {
    bottom: -6px;
    left: -6px;
  }
  .blueprint > .corner.br {
    bottom: -6px;
    right: -6px;
  }
  .duotone {
    position: relative;
    overflow: hidden;
  }
  .duotone::after {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background: var(--color-accent);
    mix-blend-mode: color;
  }
  .btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    cursor: pointer;
    text-decoration: none;
    font-family: var(--font-heading);
    font-weight: var(--font-heading-weight);
    font-size: 14px;
    line-height: 1.2;
    color: var(--color-text);
    background: transparent;
    border: 1px solid var(--color-divider);
    padding: var(--space-2) calc(var(--space-3) * 1.2);
  }
  .btn:hover {
    color: var(--color-text);
  }
  .ico {
    display: inline-block;
    flex: none;
    width: 18px;
    height: 18px;
    background: currentColor;
    -webkit-mask: var(--ico) center / contain no-repeat;
    mask: var(--ico) center / contain no-repeat;
  }
  .ico-support {
    --ico: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9ImN1cnJlbnRDb2xvciIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIGNsYXNzPSJsdWNpZGUgbHVjaWRlLXNoaWVsZC1hbGVydC1pY29uIGx1Y2lkZS1zaGllbGQtYWxlcnQiPjxwYXRoIGQ9Ik0yMCAxM2MwIDUtMy41IDcuNS03LjY2IDguOTVhMSAxIDAgMCAxLS42Ny0uMDFDNy41IDIwLjUgNCAxOCA0IDEzVjZhMSAxIDAgMCAxIDEtMWMyIDAgNC41LTEuMiA2LjI0LTIuNzJhMS4xNyAxLjE3IDAgMCAxIDEuNTIgMEMxNC41MSAzLjgxIDE3IDUgMTkgNWExIDEgMCAwIDEgMSAxeiIvPjxwYXRoIGQ9Ik0xMiA4djQiLz48cGF0aCBkPSJNMTIgMTZoLjAxIi8+PC9zdmc+");
  }
  .ico-phone {
    --ico: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9IiMwMjhhOTkiIHN0cm9rZS13aWR0aD0iMiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIiBjbGFzcz0ibHVjaWRlIGx1Y2lkZS1waG9uZS1pY29uIGx1Y2lkZS1waG9uZSI+PHBhdGggZD0iTTEzLjgzMiAxNi41NjhhMSAxIDAgMCAwIDEuMjEzLS4zMDNsLjM1NS0uNDY1QTIgMiAwIDAgMSAxNyAxNWgzYTIgMiAwIDAgMSAyIDJ2M2EyIDIgMCAwIDEtMiAyQTE4IDE4IDAgMCAxIDIgNGEyIDIgMCAwIDEgMi0yaDNhMiAyIDAgMCAxIDIgMnYzYTIgMiAwIDAgMS0uOCAxLjZsLS40NjguMzUxYTEgMSAwIDAgMC0uMjkyIDEuMjMzIDE0IDE0IDAgMCAwIDYuMzkyIDYuMzg0Ii8+PC9zdmc+");
  }
  .ico-mail {
    --ico: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9IiMwMjhhOTkiIHN0cm9rZS13aWR0aD0iMiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIiBjbGFzcz0ibHVjaWRlIGx1Y2lkZS1tYWlsLWljb24gbHVjaWRlLW1haWwiPjxwYXRoIGQ9Im0yMiA3LTguOTkxIDUuNzI3YTIgMiAwIDAgMS0yLjAwOSAwTDIgNyIvPjxyZWN0IHg9IjIiIHk9IjQiIHdpZHRoPSIyMCIgaGVpZ2h0PSIxNiIgcng9IjIiLz48L3N2Zz4=");
  }
  .ico-calendar-days {
    --ico: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9IiMwMjhhOTkiIHN0cm9rZS13aWR0aD0iMiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIiBjbGFzcz0ibHVjaWRlIGx1Y2lkZS1jYWxlbmRhci1kYXlzLWljb24gbHVjaWRlLWNhbGVuZGFyLWRheXMiPjxwYXRoIGQ9Ik04IDJ2MyIvPjxwYXRoIGQ9Ik0xNiAydjMiLz48cmVjdCB4PSIzIiB5PSIzIiB3aWR0aD0iMTgiIGhlaWdodD0iMTgiIHJ4PSIyIi8+PHBhdGggZD0iTTMgOWgxOCIvPjxwYXRoIGQ9Ik04IDEzaC4wMSIvPjxwYXRoIGQ9Ik0xMiAxM2guMDEiLz48cGF0aCBkPSJNMTYgMTNoLjAxIi8+PHBhdGggZD0iTTggMTdoLjAxIi8+PHBhdGggZD0iTTEyIDE3aC4wMSIvPjxwYXRoIGQ9Ik0xNiAxN2guMDEiLz48L3N2Zz4=");
  }
  .ico-flag {
    --ico: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9IiMwMjhhOTkiIHN0cm9rZS13aWR0aD0iMiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIiBjbGFzcz0ibHVjaWRlIGx1Y2lkZS1mbGFnLWljb24gbHVjaWRlLWZsYWciPjxwYXRoIGQ9Ik00IDIyVjRhMSAxIDAgMCAxIC40LS44QTYgNiAwIDAgMSA4IDJjMyAwIDUgMiA3LjMzMyAycTIgMCAzLjA2Ny0uOEExIDEgMCAwIDEgMjAgNHYxMGExIDEgMCAwIDEtLjQuOEE2IDYgMCAwIDEgMTYgMTZjLTMgMC01LTItOC0yYTYgNiAwIDAgMC00IDEuNTI4Ii8+PC9zdmc+");
  }
  .ico-fast-forward {
    --ico: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9IiMwMjhhOTkiIHN0cm9rZS13aWR0aD0iMiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIiBjbGFzcz0ibHVjaWRlIGx1Y2lkZS1mYXN0LWZvcndhcmQtaWNvbiBsdWNpZGUtZmFzdC1mb3J3YXJkIj48cGF0aCBkPSJNMTIgNmEyIDIgMCAwIDEgMy40MTQtMS40MTRsNiA2YTIgMiAwIDAgMSAwIDIuODI4bC02IDZBMiAyIDAgMCAxIDEyIDE4eiIvPjxwYXRoIGQ9Ik0yIDZhMiAyIDAgMCAxIDMuNDE0LTEuNDE0bDYgNmEyIDIgMCAwIDEgMCAyLjgyOGwtNiA2QTIgMiAwIDAgMSAyIDE4eiIvPjwvc3ZnPg==");
  }
  .ico-map-pin {
    --ico: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9IiMwMjhhOTkiIHN0cm9rZS13aWR0aD0iMiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIiBjbGFzcz0ibHVjaWRlIGx1Y2lkZS1tYXAtcGluLWljb24gbHVjaWRlLW1hcC1waW4iPjxwYXRoIGQ9Ik0yMCAxMGMwIDQuOTkzLTUuNTM5IDEwLjE5My03LjM5OSAxMS43OTlhMSAxIDAgMCAxLTEuMjAyIDBDOS41MzkgMjAuMTkzIDQgMTQuOTkzIDQgMTBhOCA4IDAgMCAxIDE2IDAiLz48Y2lyY2xlIGN4PSIxMiIgY3k9IjEwIiByPSIzIi8+PC9zdmc+");
  }
  .stat {
    position: relative;
    overflow: hidden;
  }
  .stat > .ico-bg {
    position: absolute;
    right: 10px;
    bottom: 10px;
    width: 88px;
    height: 88px;
    color: var(--color-accent-700);
    opacity: 0.14;
    pointer-events: none;
  }
  .stat > :not(.ico-bg) {
    position: relative;
  }
  .band-dark .stat > .ico-bg {
    opacity: 0.22;
  }
  .btn .ico {
    display: block;
  }
  .btn:disabled {
    opacity: 0.45;
    cursor: not-allowed;
  }
  .btn-primary {
    background: var(--color-accent);
    border-color: var(--color-accent);
  }
  .btn-primary:hover {
    background: var(--color-accent-500);
  }
  .btn-primary:active {
    background: var(--color-accent-600);
  }
  .btn-secondary {
    border-color: var(--color-divider);
  }
  .btn-secondary:hover {
    background: color-mix(in srgb, #1d1f20 7%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      background: color-mix(in srgb, var(--color-text) 7%, transparent);
    }
  }
  .btn-secondary:active {
    background: color-mix(in srgb, #1d1f20 14%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      background: color-mix(in srgb, var(--color-text) 14%, transparent);
    }
  }
  .btn-ghost {
    color: var(--color-accent-700);
    border-color: transparent;
    padding-inline: var(--space-1);
  }
  .btn-ghost:hover {
    color: var(--color-accent-800);
    background: color-mix(in srgb, #0fa9bb 10%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      background: color-mix(in srgb, var(--color-accent) 10%, transparent);
    }
  }
  .btn-support {
    background: var(--color-support);
    border-color: var(--color-support);
    color: #fff;
    font-size: 16px;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    padding: 9px 18px;
    gap: 9px;
    white-space: nowrap;
  }
  .btn-support:hover {
    background: var(--color-support-dark);
    border-color: var(--color-support-dark);
    color: #fff;
  }
  .btn-support .ico {
    width: 19px;
    height: 19px;
  }
  .field > label {
    display: block;
    font-size: 12px;
    margin-bottom: 5px;
    color: color-mix(in srgb, #1d1f20 70%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      color: color-mix(in srgb, var(--color-text) 70%, transparent);
    }
  }
  .input {
    width: 100%;
    min-height: 36px;
    padding: 6px 10px;
    font: inherit;
    font-size: 14px;
    color: var(--color-text);
    caret-color: var(--color-accent);
    background: var(--color-surface);
    border: 1px solid var(--color-divider);
  }
  .input:hover {
    border-color: color-mix(in srgb, #1d1f20 45%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      border-color: color-mix(in srgb, var(--color-text) 45%, transparent);
    }
  }
  .input:focus-visible {
    border-color: var(--color-accent-700);
    outline-offset: 0;
  }
  textarea.input {
    min-height: 90px;
    resize: vertical;
  }
  .nav-link {
    font-family: var(--font-heading);
    font-weight: var(--font-heading-weight);
    font-size: 17px;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: var(--color-bar-text);
    text-decoration: none;
    padding-bottom: 3px;
    border-bottom: 2px solid transparent;
  }
  .nav-link:hover, .nav-link[aria-current="page"] {
    color: var(--color-accent-400);
    border-bottom-color: var(--color-accent-400);
  }
  .nav-contact-link {
    display: flex;
    align-items: center;
    gap: 9px;
    white-space: nowrap;
    font-size: 15px;
    text-decoration: none;
    color: color-mix(in srgb, #f2f2f3 88%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      color: color-mix(in srgb, var(--color-bar-text) 88%, transparent);
    }
  }
  .nav-contact-link:hover {
    color: var(--color-accent-300);
  }
  .nav-contact-link .ico {
    color: var(--color-accent-400);
  }
  .nav-contact-link:hover .ico {
    color: var(--color-accent-300);
  }
  .img-placeholder {
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    width: 100%;
    padding: 16px;
    background: color-mix(in srgb, #1d1f20 6%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      background: color-mix(in srgb, var(--color-text) 6%, transparent);
    }
    border: 1px dashed color-mix(in srgb, #1d1f20 30%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      border: 1px dashed color-mix(in srgb, var(--color-text) 30%, transparent);
    }
    color: color-mix(in srgb, #1d1f20 60%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      color: color-mix(in srgb, var(--color-text) 60%, transparent);
    }
    font-size: 14px;
    line-height: 1.45;
  }
}
@property --tw-border-style {
  syntax: "*";
  inherits: false;
  initial-value: solid;
}
@property --tw-leading {
  syntax: "*";
  inherits: false;
}
@property --tw-font-weight {
  syntax: "*";
  inherits: false;
}
@property --tw-tracking {
  syntax: "*";
  inherits: false;
}
@property --tw-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@property --tw-shadow-color {
  syntax: "*";
  inherits: false;
}
@property --tw-shadow-alpha {
  syntax: "<percentage>";
  inherits: false;
  initial-value: 100%;
}
@property --tw-inset-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@property --tw-inset-shadow-color {
  syntax: "*";
  inherits: false;
}
@property --tw-inset-shadow-alpha {
  syntax: "<percentage>";
  inherits: false;
  initial-value: 100%;
}
@property --tw-ring-color {
  syntax: "*";
  inherits: false;
}
@property --tw-ring-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@property --tw-inset-ring-color {
  syntax: "*";
  inherits: false;
}
@property --tw-inset-ring-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@property --tw-ring-inset {
  syntax: "*";
  inherits: false;
}
@property --tw-ring-offset-width {
  syntax: "<length>";
  inherits: false;
  initial-value: 0px;
}
@property --tw-ring-offset-color {
  syntax: "*";
  inherits: false;
  initial-value: #fff;
}
@property --tw-ring-offset-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@property --tw-outline-style {
  syntax: "*";
  inherits: false;
  initial-value: solid;
}
@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-border-style: solid;
      --tw-leading: initial;
      --tw-font-weight: initial;
      --tw-tracking: initial;
      --tw-shadow: 0 0 #0000;
      --tw-shadow-color: initial;
      --tw-shadow-alpha: 100%;
      --tw-inset-shadow: 0 0 #0000;
      --tw-inset-shadow-color: initial;
      --tw-inset-shadow-alpha: 100%;
      --tw-ring-color: initial;
      --tw-ring-shadow: 0 0 #0000;
      --tw-inset-ring-color: initial;
      --tw-inset-ring-shadow: 0 0 #0000;
      --tw-ring-inset: initial;
      --tw-ring-offset-width: 0px;
      --tw-ring-offset-color: #fff;
      --tw-ring-offset-shadow: 0 0 #0000;
      --tw-outline-style: solid;
    }
  }
}