@font-face {
  font-family: 'Nunito Variable';
  font-style: normal;
  font-display: swap;
  font-weight: 200 1000;
  src: url(/api/font-files/file/nunito-latin-ext-wght-normal-1.woff2) format('woff2-variations');
  unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}

@font-face {
  font-family: 'Nunito Variable';
  font-style: normal;
  font-display: swap;
  font-weight: 200 1000;
  src: url(/api/font-files/file/nunito-latin-wght-normal-1.woff2) format('woff2-variations');
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}



:root {
  --background: hsl(0 0% 100%);
  --foreground: hsl(220 14.3000% 4.3000%);
  --card: hsl(0 0% 100%);
  --card-foreground: hsl(220 14.3000% 4.3000%);
  --popover: hsl(0 0% 100%);
  --popover-foreground: hsl(220 14.3000% 4.3000%);
  --primary: hsl(330 80% 45%);
  --primary-foreground: hsl(0 0% 98%);
  --secondary: hsl(24 76% 55.0000%);
  --secondary-foreground: hsl(0 0% 98%);
  --muted: hsl(220 14.3000% 95.9000%);
  --muted-foreground: hsl(220 8.9000% 46.1000%);
  --accent: hsl(330 80% 95%);
  --accent-foreground: hsl(330 80% 30%);
  --destructive: hsl(0 84.2000% 60.2000%);
  --destructive-foreground: hsl(0 0% 98%);
  --border: hsl(220 13% 91%);
  --input: hsl(220 13% 91%);
  --ring: hsl(330 80% 45%);
  --chart-1: hsl(350 80% 55.0000%);
  --chart-2: hsl(30 80% 55.0000%);
  --chart-3: hsl(200 80% 55.0000%);
  --chart-4: hsl(100 80% 55.0000%);
  --chart-5: hsl(270 80% 55.0000%);
  --sidebar: hsl(350 100% 98%);
  --sidebar-foreground: hsl(220 14.3000% 4.3000%);
  --sidebar-primary: hsl(330 80% 45%);
  --sidebar-primary-foreground: hsl(0 0% 98%);
  --sidebar-accent: hsl(24 76% 90%);
  --sidebar-accent-foreground: hsl(24 76% 40%);
  --sidebar-border: hsl(350 100% 95%);
  --sidebar-ring: hsl(330 80% 45%);
  --font-sans: serif;
  --font-serif: serif;
  --font-mono: monospace;
  --radius: 0.5rem;
  --shadow-x: 0px;
  --shadow-y: 5px;
  --shadow-blur: 10px;
  --shadow-spread: 0px;
  --shadow-opacity: 0.1;
  --shadow-color: 0 0 0;
  --shadow-2xs: 0px 5px 10px 0px hsl(0 0 0 / 0.05);
  --shadow-xs: 0px 5px 10px 0px hsl(0 0 0 / 0.05);
  --shadow-sm: 0px 5px 10px 0px hsl(0 0 0 / 0.10), 0px 1px 2px -1px hsl(0 0 0 / 0.10);
  --shadow: 0px 5px 10px 0px hsl(0 0 0 / 0.10), 0px 1px 2px -1px hsl(0 0 0 / 0.10);
  --shadow-md: 0px 5px 10px 0px hsl(0 0 0 / 0.10), 0px 2px 4px -1px hsl(0 0 0 / 0.10);
  --shadow-lg: 0px 5px 10px 0px hsl(0 0 0 / 0.10), 0px 4px 6px -1px hsl(0 0 0 / 0.10);
  --shadow-xl: 0px 5px 10px 0px hsl(0 0 0 / 0.10), 0px 8px 10px -1px hsl(0 0 0 / 0.10);
  --shadow-2xl: 0px 5px 10px 0px hsl(0 0 0 / 0.25);
  --tracking-normal: 0.01em;
  --spacing: 0.25rem;
}

.dark {
  --background: hsl(220 14.3000% 4.3000%);
  --foreground: hsl(0 0% 98%);
  --card: hsl(220 14.3000% 4.3000%);
  --card-foreground: hsl(0 0% 98%);
  --popover: hsl(220 14.3000% 4.3000%);
  --popover-foreground: hsl(0 0% 98%);
  --primary: hsl(330 80% 45%);
  --primary-foreground: hsl(0 0% 98%);
  --secondary: hsl(24 76% 55.0000%);
  --secondary-foreground: hsl(0 0% 98%);
  --muted: hsl(215 27.9000% 16.9000%);
  --muted-foreground: hsl(217.2000 32.6000% 60.6000%);
  --accent: hsl(330 80% 15%);
  --accent-foreground: hsl(330 80% 75%);
  --destructive: hsl(0 72.2000% 50.6000%);
  --destructive-foreground: hsl(0 0% 98%);
  --border: hsl(215 27.9000% 16.9000%);
  --input: hsl(215 27.9000% 16.9000%);
  --ring: hsl(330 80% 45%);
  --chart-1: hsl(350 80% 65%);
  --chart-2: hsl(30 80% 65%);
  --chart-3: hsl(200 80% 65%);
  --chart-4: hsl(100 80% 65%);
  --chart-5: hsl(270 80% 65%);
  --sidebar: hsl(220 15% 8%);
  --sidebar-foreground: hsl(0 0% 98%);
  --sidebar-primary: hsl(330 80% 45%);
  --sidebar-primary-foreground: hsl(0 0% 98%);
  --sidebar-accent: hsl(24 76% 20%);
  --sidebar-accent-foreground: hsl(24 76% 70%);
  --sidebar-border: hsl(220 15% 15%);
  --sidebar-ring: hsl(330 80% 45%);
  --font-sans: serif;
  --font-serif: serif;
  --font-mono: monospace;
  --radius: 0.5rem;
  --shadow-x: 0px;
  --shadow-y: 5px;
  --shadow-blur: 10px;
  --shadow-spread: 0px;
  --shadow-opacity: 0.5;
  --shadow-color: 0 0 0;
  --shadow-2xs: 0px 5px 10px 0px hsl(0 0 0 / 0.25);
  --shadow-xs: 0px 5px 10px 0px hsl(0 0 0 / 0.25);
  --shadow-sm: 0px 5px 10px 0px hsl(0 0 0 / 0.50), 0px 1px 2px -1px hsl(0 0 0 / 0.50);
  --shadow: 0px 5px 10px 0px hsl(0 0 0 / 0.50), 0px 1px 2px -1px hsl(0 0 0 / 0.50);
  --shadow-md: 0px 5px 10px 0px hsl(0 0 0 / 0.50), 0px 2px 4px -1px hsl(0 0 0 / 0.50);
  --shadow-lg: 0px 5px 10px 0px hsl(0 0 0 / 0.50), 0px 4px 6px -1px hsl(0 0 0 / 0.50);
  --shadow-xl: 0px 5px 10px 0px hsl(0 0 0 / 0.50), 0px 8px 10px -1px hsl(0 0 0 / 0.50);
  --shadow-2xl: 0px 5px 10px 0px hsl(0 0 0 / 1.25);
}

@layer utilities {
  .test-text-center {
    text-align: center;
  }
}

@layer theme {
  :root, :host {
    --spacing: 0.25rem;
  }
}
@layer utilities {
  .home-page-block-spacer-pb-8 {
    padding-bottom: calc(var(--spacing) * 8);
  }
}

@layer theme {
  :root, :host {
    --spacing: 0.25rem;
    --text-lg: 1.125rem;
    --text-lg--line-height: calc(1.75 / 1.125);
  }
}
@layer utilities {
  .impact-description-mt-4 {
    margin-top: calc(var(--spacing) * 4);
  }
  .impact-description-text-lg {
    font-size: var(--text-lg);
    line-height: var(--tw-leading, var(--text-lg--line-height));
  }
  .impact-description-text-primary {
    color: var(--primary);
  }
}

@layer theme {
  :root, :host {
    --text-2xl: 1.5rem;
    --text-2xl--line-height: calc(2 / 1.5);
  }
}
@layer utilities {
  .impact-title-text-2xl {
    font-size: var(--text-2xl);
    line-height: var(--tw-leading, var(--text-2xl--line-height));
  }
}

@layer theme {
  :root, :host {
    --default-transition-duration: 150ms;
    --default-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  }
}
@layer utilities {
  .impact-card-h-full {
    height: 100%;
  }
  .impact-card-transition-all {
    transition-property: all;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
  }
  .impact-card-hover\:border-primary\/50 {
    &:hover {
      @media (hover: hover) {
        border-color: var(--primary);
        @supports (color: color-mix(in lab, red, red)) {
          border-color: color-mix(in oklab, var(--primary) 50%, transparent);
        }
      }
    }
  }
  .impact-card-hover\:shadow-lg {
    &:hover {
      @media (hover: hover) {
        --tw-shadow: 0 10px 15px -3px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 4px 6px -4px 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);
      }
    }
  }
}
@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-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@property --tw-inset-ring-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@property --tw-ring-offset-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@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-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-shadow: 0 0 #0000;
      --tw-inset-ring-shadow: 0 0 #0000;
      --tw-ring-offset-shadow: 0 0 #0000;
    }
  }
}

@layer theme {
  :root, :host {
    --spacing: 0.25rem;
  }
}
@layer utilities {
  .homepage-block-title-spacer-mb-6 {
    margin-bottom: calc(var(--spacing) * 6);
  }
}

@layer theme {
  :root, :host {
    --spacing: 0.25rem;
    --text-lg: 1.125rem;
    --text-lg--line-height: calc(1.75 / 1.125);
  }
}
@layer utilities {
  .home-page-services-description-mt-4 {
    margin-top: calc(var(--spacing) * 4);
  }
  .home-page-services-description-text-lg {
    font-size: var(--text-lg);
    line-height: var(--tw-leading, var(--text-lg--line-height));
  }
  .home-page-services-description-text-primary {
    color: var(--primary);
  }
}

@layer theme {
  :root, :host {
    --text-2xl: 1.5rem;
    --text-2xl--line-height: calc(2 / 1.5);
  }
}
@layer utilities {
  .home-page-service-title-text-2xl {
    font-size: var(--text-2xl);
    line-height: var(--tw-leading, var(--text-2xl--line-height));
  }
}

@layer theme {
  :root, :host {
    --default-transition-duration: 150ms;
    --default-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  }
}
@layer utilities {
  .home-page-service-card-h-full {
    height: 100%;
  }
  .home-page-service-card-transition-all {
    transition-property: all;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
  }
  .home-page-service-card-hover\:border-primary\/50 {
    &:hover {
      @media (hover: hover) {
        border-color: var(--primary);
        @supports (color: color-mix(in lab, red, red)) {
          border-color: color-mix(in oklab, var(--primary) 50%, transparent);
        }
      }
    }
  }
  .home-page-service-card-hover\:shadow-lg {
    &:hover {
      @media (hover: hover) {
        --tw-shadow: 0 10px 15px -3px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 4px 6px -4px 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);
      }
    }
  }
}
@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-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@property --tw-inset-ring-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@property --tw-ring-offset-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@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-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-shadow: 0 0 #0000;
      --tw-inset-ring-shadow: 0 0 #0000;
      --tw-ring-offset-shadow: 0 0 #0000;
    }
  }
}

@layer theme {
  :root, :host {
    --spacing: 0.25rem;
    --text-4xl: 2.25rem;
    --text-4xl--line-height: calc(2.5 / 2.25);
    --text-5xl: 3rem;
    --text-5xl--line-height: 1;
    --font-weight-bold: 700;
    --tracking-tight: -0.025em;
  }
}
@layer utilities {
  .home-page-heading-mb-4 {
    margin-bottom: calc(var(--spacing) * 4);
  }
  .home-page-heading-text-center {
    text-align: center;
  }
  .home-page-heading-text-4xl {
    font-size: var(--text-4xl);
    line-height: var(--tw-leading, var(--text-4xl--line-height));
  }
  .home-page-heading-font-bold {
    --tw-font-weight: var(--font-weight-bold);
    font-weight: var(--font-weight-bold);
  }
  .home-page-heading-tracking-tight {
    --tw-tracking: var(--tracking-tight);
    letter-spacing: var(--tracking-tight);
  }
  .home-page-heading-text-balance {
    text-wrap: balance;
  }
  .home-page-heading-md\:text-5xl {
    @media (width >= 48rem) {
      font-size: var(--text-5xl);
      line-height: var(--tw-leading, var(--text-5xl--line-height));
    }
  }
}
@property --tw-font-weight {
  syntax: "*";
  inherits: false;
}
@property --tw-tracking {
  syntax: "*";
  inherits: false;
}
@layer properties {
  @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {
    *, ::before, ::after, ::backdrop {
      --tw-font-weight: initial;
      --tw-tracking: initial;
    }
  }
}

@layer theme {
  :root, :host {
    --spacing: 0.25rem;
  }
}
@layer utilities {
  .about-card-icon-h-8 {
    height: calc(var(--spacing) * 8);
  }
  .about-card-icon-w-8 {
    width: calc(var(--spacing) * 8);
  }
  .about-card-icon-items-center {
    align-items: center;
  }
  .about-card-icon-justify-center {
    justify-content: center;
  }
  .about-card-icon-text-primary {
    color: var(--primary);
  }
}

@layer utilities {
  .about-card-styles-border {
    border-style: var(--tw-border-style);
    border-width: 1px;
  }
  .about-card-styles-hover\:border-primary {
    &:hover {
      @media (hover: hover) {
        border-color: var(--primary);
      }
    }
  }
}
@property --tw-border-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;
    }
  }
}

@layer theme {
  :root, :host {
    --text-lg: 1.125rem;
    --text-lg--line-height: calc(1.75 / 1.125);
  }
}
@layer utilities {
  .about-card-content-text-lg {
    font-size: var(--text-lg);
    line-height: var(--tw-leading, var(--text-lg--line-height));
  }
}

@layer theme {
  :root, :host {
    --spacing: 0.25rem;
    --text-2xl: 1.5rem;
    --text-2xl--line-height: calc(2 / 1.5);
    --font-weight-bold: 700;
  }
}
@layer utilities {
  .about-card-title-mb-4 {
    margin-bottom: calc(var(--spacing) * 4);
  }
  .about-card-title-text-2xl {
    font-size: var(--text-2xl);
    line-height: var(--tw-leading, var(--text-2xl--line-height));
  }
  .about-card-title-font-bold {
    --tw-font-weight: var(--font-weight-bold);
    font-weight: var(--font-weight-bold);
  }
  .about-card-title-text-primary {
    color: var(--primary);
  }
}
@property --tw-font-weight {
  syntax: "*";
  inherits: false;
}
@layer properties {
  @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {
    *, ::before, ::after, ::backdrop {
      --tw-font-weight: initial;
    }
  }
}

@layer theme {
  :root, :host {
    --spacing: 0.25rem;
    --text-xl: 1.25rem;
    --text-xl--line-height: calc(1.75 / 1.25);
    --radius-2xl: 1rem;
  }
}
@layer utilities {
  .about-footer-rounded-2xl {
    border-radius: var(--radius-2xl);
  }
  .about-footer-border {
    border-style: var(--tw-border-style);
    border-width: 1px;
  }
  .about-footer-border-primary\/10 {
    border-color: var(--primary);
    @supports (color: color-mix(in lab, red, red)) {
      border-color: color-mix(in oklab, var(--primary) 10%, transparent);
    }
  }
  .about-footer-bg-primary\/10 {
    background-color: var(--primary);
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix(in oklab, var(--primary) 10%, transparent);
    }
  }
  .about-footer-p-6 {
    padding: calc(var(--spacing) * 6);
  }
  .about-footer-text-xl {
    font-size: var(--text-xl);
    line-height: var(--tw-leading, var(--text-xl--line-height));
  }
  .about-footer-shadow-lg {
    --tw-shadow: 0 10px 15px -3px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 4px 6px -4px 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);
  }
}
@property --tw-border-style {
  syntax: "*";
  inherits: false;
  initial-value: solid;
}
@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-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@property --tw-inset-ring-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@property --tw-ring-offset-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@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-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-shadow: 0 0 #0000;
      --tw-inset-ring-shadow: 0 0 #0000;
      --tw-ring-offset-shadow: 0 0 #0000;
    }
  }
}

@layer theme {
  :root, :host {
    --spacing: 0.25rem;
    --text-4xl: 2.25rem;
    --text-4xl--line-height: calc(2.5 / 2.25);
    --text-5xl: 3rem;
    --text-5xl--line-height: 1;
    --text-6xl: 3.75rem;
    --text-6xl--line-height: 1;
    --font-weight-bold: 700;
  }
}
@layer utilities {
  .our-story-mb-4 {
    margin-bottom: calc(var(--spacing) * 4);
  }
  .our-story-text-4xl {
    font-size: var(--text-4xl);
    line-height: var(--tw-leading, var(--text-4xl--line-height));
  }
  .our-story-font-bold {
    --tw-font-weight: var(--font-weight-bold);
    font-weight: var(--font-weight-bold);
  }
  .our-story-text-balance {
    text-wrap: balance;
  }
  .our-story-text-primary {
    color: var(--primary);
  }
  .our-story-sm\:text-5xl {
    @media (width >= 40rem) {
      font-size: var(--text-5xl);
      line-height: var(--tw-leading, var(--text-5xl--line-height));
    }
  }
  .our-story-lg\:text-6xl {
    @media (width >= 64rem) {
      font-size: var(--text-6xl);
      line-height: var(--tw-leading, var(--text-6xl--line-height));
    }
  }
}
@property --tw-font-weight {
  syntax: "*";
  inherits: false;
}
@layer properties {
  @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {
    *, ::before, ::after, ::backdrop {
      --tw-font-weight: initial;
    }
  }
}

@layer theme {
  :root, :host {
    --spacing: 0.25rem;
  }
}
@layer utilities {
  .about-card-border-0 {
    border-style: var(--tw-border-style);
    border-width: 0px;
  }
  .about-card-bg-transparent {
    background-color: transparent;
  }
  .about-card-shadow-none {
    --tw-shadow: 0 0 #0000;
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  .about-card-lg\:mt-28 {
    @media (width >= 64rem) {
      margin-top: calc(var(--spacing) * 28);
    }
  }
}
@property --tw-border-style {
  syntax: "*";
  inherits: false;
  initial-value: solid;
}
@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-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@property --tw-inset-ring-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@property --tw-ring-offset-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@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-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-shadow: 0 0 #0000;
      --tw-inset-ring-shadow: 0 0 #0000;
      --tw-ring-offset-shadow: 0 0 #0000;
    }
  }
}

@layer theme {
  :root, :host {
    --spacing: 0.25rem;
  }
}
@layer utilities {
  .service-detail-icon-inline {
    display: inline;
  }
  .service-detail-icon-h-5 {
    height: calc(var(--spacing) * 5);
  }
  .service-detail-icon-w-5 {
    width: calc(var(--spacing) * 5);
  }
  .service-detail-icon-shrink-0 {
    flex-shrink: 0;
  }
  .service-detail-icon-text-primary {
    color: var(--primary);
  }
}

@layer utilities {
  .service-detail-card-bg-primary\/10 {
    background-color: var(--primary);
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix(in oklab, var(--primary) 10%, transparent);
    }
  }
}

@layer theme {
  :root, :host {
    --spacing: 0.25rem;
    --text-lg: 1.125rem;
    --text-lg--line-height: calc(1.75 / 1.125);
  }
}
@layer utilities {
  .service-detail-description-pt-4 {
    padding-top: calc(var(--spacing) * 4);
  }
  .service-detail-description-text-lg {
    font-size: var(--text-lg);
    line-height: var(--tw-leading, var(--text-lg--line-height));
  }
  .service-detail-description-text-primary {
    color: var(--primary);
  }
}

@layer theme {
  :root, :host {
    --text-2xl: 1.5rem;
    --text-2xl--line-height: calc(2 / 1.5);
  }
}
@layer utilities {
  .service-detail-title-text-2xl {
    font-size: var(--text-2xl);
    line-height: var(--tw-leading, var(--text-2xl--line-height));
  }
}

@layer utilities {
  .cta-card-styles-border-0 {
    border-style: var(--tw-border-style);
    border-width: 0px;
  }
  .cta-card-styles-bg-transparent {
    background-color: transparent;
  }
  .cta-card-styles-text-center {
    text-align: center;
  }
  .cta-card-styles-shadow-none {
    --tw-shadow: 0 0 #0000;
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
}
@property --tw-border-style {
  syntax: "*";
  inherits: false;
  initial-value: solid;
}
@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-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@property --tw-inset-ring-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@property --tw-ring-offset-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@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-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-shadow: 0 0 #0000;
      --tw-inset-ring-shadow: 0 0 #0000;
      --tw-ring-offset-shadow: 0 0 #0000;
    }
  }
}

@layer theme {
  :root, :host {
    --spacing: 0.25rem;
  }
}
@layer utilities {
  .services-page-description-mt-8 {
    margin-top: calc(var(--spacing) * 8);
  }
  .services-page-description-text-muted-foreground {
    color: var(--muted-foreground);
  }
}

@layer theme {
  :root, :host {
    --spacing: 0.25rem;
  }
}
@layer utilities {
  .services-page-action-flex {
    display: flex;
  }
  .services-page-action-w-full {
    width: 100%;
  }
  .services-page-action-justify-center {
    justify-content: center;
  }
  .services-page-action-gap-2 {
    gap: calc(var(--spacing) * 2);
  }
}

@layer theme {
  :root, :host {
    --text-2xl: 1.5rem;
    --text-2xl--line-height: calc(2 / 1.5);
  }
}
@layer utilities {
  .services-page-title-text-2xl {
    font-size: var(--text-2xl);
    line-height: var(--tw-leading, var(--text-2xl--line-height));
  }
}

@layer theme {
  :root, :host {
    --default-transition-duration: 150ms;
    --default-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  }
}
@layer utilities {
  .services-page-card-h-full {
    height: 100%;
  }
  .services-page-card-transition-all {
    transition-property: all;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
  }
  .services-page-card-hover\:border-primary\/50 {
    &:hover {
      @media (hover: hover) {
        border-color: var(--primary);
        @supports (color: color-mix(in lab, red, red)) {
          border-color: color-mix(in oklab, var(--primary) 50%, transparent);
        }
      }
    }
  }
  .services-page-card-hover\:shadow-lg {
    &:hover {
      @media (hover: hover) {
        --tw-shadow: 0 10px 15px -3px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 4px 6px -4px 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);
      }
    }
  }
}
@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-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@property --tw-inset-ring-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@property --tw-ring-offset-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@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-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-shadow: 0 0 #0000;
      --tw-inset-ring-shadow: 0 0 #0000;
      --tw-ring-offset-shadow: 0 0 #0000;
    }
  }
}

@layer theme {
  :root, :host {
    --spacing: 0.25rem;
  }
}
@layer utilities {
  .card-background-primary-rounded-lg {
    border-radius: var(--radius);
  }
  .card-background-primary-bg-card {
    background-color: var(--card);
  }
  .card-background-primary-bg-primary\/10 {
    background-color: var(--primary);
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix(in oklab, var(--primary) 10%, transparent);
    }
  }
  .card-background-primary-px-6 {
    padding-inline: calc(var(--spacing) * 6);
  }
}

@layer utilities {
  .shadow-shadow-primary\/30 {
    --tw-shadow-color: var(--primary);
    @supports (color: color-mix(in lab, red, red)) {
      --tw-shadow-color: color-mix(in oklab, color-mix(in oklab, var(--primary) 30%, transparent) var(--tw-shadow-alpha), transparent);
    }
  }
}
@property --tw-shadow-color {
  syntax: "*";
  inherits: false;
}
@property --tw-shadow-alpha {
  syntax: "<percentage>";
  inherits: false;
  initial-value: 100%;
}
@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-shadow-color: initial;
      --tw-shadow-alpha: 100%;
    }
  }
}

@layer theme {
  :root, :host {
    --spacing: 0.25rem;
  }
}
@layer utilities {
  .cta-button-styles-flex {
    display: flex;
  }
  .cta-button-styles-w-full {
    width: 100%;
  }
  .cta-button-styles-justify-center {
    justify-content: center;
  }
  .cta-button-styles-gap-2 {
    gap: calc(var(--spacing) * 2);
  }
}

@layer utilities {
  .cta-background-styles-bg-gradient-to-b {
    --tw-gradient-position: to bottom in oklab;
    background-image: linear-gradient(var(--tw-gradient-stops));
  }
  .cta-background-styles-from-background {
    --tw-gradient-from: var(--background);
    --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
  }
  .cta-background-styles-to-primary\/10 {
    --tw-gradient-to: var(--primary);
    @supports (color: color-mix(in lab, red, red)) {
      --tw-gradient-to: color-mix(in oklab, var(--primary) 10%, transparent);
    }
    --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
  }
}
@property --tw-gradient-position {
  syntax: "*";
  inherits: false;
}
@property --tw-gradient-from {
  syntax: "<color>";
  inherits: false;
  initial-value: #0000;
}
@property --tw-gradient-to {
  syntax: "<color>";
  inherits: false;
  initial-value: #0000;
}
@property --tw-gradient-stops {
  syntax: "*";
  inherits: false;
}
@property --tw-gradient-via-stops {
  syntax: "*";
  inherits: false;
}
@property --tw-gradient-from-position {
  syntax: "<length-percentage>";
  inherits: false;
  initial-value: 0%;
}
@property --tw-gradient-to-position {
  syntax: "<length-percentage>";
  inherits: false;
  initial-value: 100%;
}
@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-gradient-position: initial;
      --tw-gradient-from: #0000;
      --tw-gradient-to: #0000;
      --tw-gradient-stops: initial;
      --tw-gradient-via-stops: initial;
      --tw-gradient-from-position: 0%;
      --tw-gradient-to-position: 100%;
    }
  }
}

@layer theme {
  :root, :host {
    --spacing: 0.25rem;
    --text-lg: 1.125rem;
    --text-lg--line-height: calc(1.75 / 1.125);
  }
}
@layer utilities {
  .cta-description-styles-mb-8 {
    margin-bottom: calc(var(--spacing) * 8);
  }
  .cta-description-styles-text-lg {
    font-size: var(--text-lg);
    line-height: var(--tw-leading, var(--text-lg--line-height));
  }
  .cta-description-styles-text-muted-foreground {
    color: var(--muted-foreground);
  }
}

@layer theme {
  :root, :host {
    --spacing: 0.25rem;
    --text-3xl: 1.875rem;
    --text-3xl--line-height: calc(2.25 / 1.875);
    --font-weight-bold: 700;
  }
}
@layer utilities {
  .cta-title-styles-mb-4 {
    margin-bottom: calc(var(--spacing) * 4);
  }
  .cta-title-styles-text-3xl {
    font-size: var(--text-3xl);
    line-height: var(--tw-leading, var(--text-3xl--line-height));
  }
  .cta-title-styles-font-bold {
    --tw-font-weight: var(--font-weight-bold);
    font-weight: var(--font-weight-bold);
  }
}
@property --tw-font-weight {
  syntax: "*";
  inherits: false;
}
@layer properties {
  @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {
    *, ::before, ::after, ::backdrop {
      --tw-font-weight: initial;
    }
  }
}

@layer theme {
  :root, :host {
    --spacing: 0.25rem;
  }
}
@layer utilities {
  .divider-styles-py-3 {
    padding-block: calc(var(--spacing) * 3);
  }
}

@layer theme {
  :root, :host {
    --default-transition-duration: 150ms;
    --default-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  }
}
@layer utilities {
  .item-animate-enlarge-transition-transform {
    transition-property: transform, translate, scale, rotate;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
  }
  .item-animate-enlarge-duration-300 {
    --tw-duration: 300ms;
    transition-duration: 300ms;
  }
  .item-animate-enlarge-hover\:scale-102 {
    &:hover {
      @media (hover: hover) {
        --tw-scale-x: 102%;
        --tw-scale-y: 102%;
        --tw-scale-z: 102%;
        scale: var(--tw-scale-x) var(--tw-scale-y);
      }
    }
  }
}
@property --tw-duration {
  syntax: "*";
  inherits: false;
}
@property --tw-scale-x {
  syntax: "*";
  inherits: false;
  initial-value: 1;
}
@property --tw-scale-y {
  syntax: "*";
  inherits: false;
  initial-value: 1;
}
@property --tw-scale-z {
  syntax: "*";
  inherits: false;
  initial-value: 1;
}
@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-duration: initial;
      --tw-scale-x: 1;
      --tw-scale-y: 1;
      --tw-scale-z: 1;
    }
  }
}

@layer theme {
  :root, :host {
    --text-base: 1rem;
    --text-base--line-height: calc(1.5 / 1);
    --leading-relaxed: 1.625;
  }
}
@layer utilities {
  .accordian-style-content-text-base {
    font-size: var(--text-base);
    line-height: var(--tw-leading, var(--text-base--line-height));
  }
  .accordian-style-content-leading-relaxed {
    --tw-leading: var(--leading-relaxed);
    line-height: var(--leading-relaxed);
  }
  .accordian-style-content-text-muted-foreground {
    color: var(--muted-foreground);
  }
}
@property --tw-leading {
  syntax: "*";
  inherits: false;
}
@layer properties {
  @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {
    *, ::before, ::after, ::backdrop {
      --tw-leading: initial;
    }
  }
}

@layer theme {
  :root, :host {
    --text-lg: 1.125rem;
    --text-lg--line-height: calc(1.75 / 1.125);
    --font-weight-semibold: 600;
  }
}
@layer utilities {
  .accordian-style-trigger-text-left {
    text-align: left;
  }
  .accordian-style-trigger-text-lg {
    font-size: var(--text-lg);
    line-height: var(--tw-leading, var(--text-lg--line-height));
  }
  .accordian-style-trigger-font-semibold {
    --tw-font-weight: var(--font-weight-semibold);
    font-weight: var(--font-weight-semibold);
  }
  .accordian-style-trigger-hover\:no-underline {
    &:hover {
      @media (hover: hover) {
        text-decoration-line: none;
      }
    }
  }
}
@property --tw-font-weight {
  syntax: "*";
  inherits: false;
}
@layer properties {
  @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {
    *, ::before, ::after, ::backdrop {
      --tw-font-weight: initial;
    }
  }
}

@layer theme {
  :root, :host {
    --spacing: 0.25rem;
  }
}
@layer utilities {
  .accordion-style-item-rounded-lg {
    border-radius: var(--radius);
  }
  .accordion-style-item-bg-card {
    background-color: var(--card);
  }
  .accordion-style-item-bg-primary\/10 {
    background-color: var(--primary);
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix(in oklab, var(--primary) 10%, transparent);
    }
  }
  .accordion-style-item-px-6 {
    padding-inline: calc(var(--spacing) * 6);
  }
}

@layer theme {
  :root, :host {
    --spacing: 0.25rem;
  }
}
@layer utilities {
  .accordion-style-spacing-space-y-4 {
    :where(& > :not(:last-child)) {
      --tw-space-y-reverse: 0;
      margin-block-start: calc(calc(var(--spacing) * 4) * var(--tw-space-y-reverse));
      margin-block-end: calc(calc(var(--spacing) * 4) * calc(1 - var(--tw-space-y-reverse)));
    }
  }
}
@property --tw-space-y-reverse {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}
@layer properties {
  @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {
    *, ::before, ::after, ::backdrop {
      --tw-space-y-reverse: 0;
    }
  }
}

@layer theme {
  :root, :host {
    --spacing: 0.25rem;
    --text-2xl: 1.5rem;
    --text-2xl--line-height: calc(2 / 1.5);
    --text-3xl: 1.875rem;
    --text-3xl--line-height: calc(2.25 / 1.875);
    --font-weight-bold: 700;
  }
}
@layer utilities {
  .section-style-heading-mb-3 {
    margin-bottom: calc(var(--spacing) * 3);
  }
  .section-style-heading-pt-8 {
    padding-top: calc(var(--spacing) * 8);
  }
  .section-style-heading-text-center {
    text-align: center;
  }
  .section-style-heading-text-2xl {
    font-size: var(--text-2xl);
    line-height: var(--tw-leading, var(--text-2xl--line-height));
  }
  .section-style-heading-font-bold {
    --tw-font-weight: var(--font-weight-bold);
    font-weight: var(--font-weight-bold);
  }
  .section-style-heading-text-balance {
    text-wrap: balance;
  }
  .section-style-heading-md\:text-3xl {
    @media (width >= 48rem) {
      font-size: var(--text-3xl);
      line-height: var(--tw-leading, var(--text-3xl--line-height));
    }
  }
}
@property --tw-font-weight {
  syntax: "*";
  inherits: false;
}
@layer properties {
  @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {
    *, ::before, ::after, ::backdrop {
      --tw-font-weight: initial;
    }
  }
}

@layer utilities {
  .hero-style-card-border-none {
    --tw-border-style: none;
    border-style: none;
  }
  .hero-style-card-bg-transparent {
    background-color: transparent;
  }
  .hero-style-card-shadow-none {
    --tw-shadow: 0 0 #0000;
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
}
@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-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@property --tw-inset-ring-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@property --tw-ring-offset-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@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-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-shadow: 0 0 #0000;
      --tw-inset-ring-shadow: 0 0 #0000;
      --tw-ring-offset-shadow: 0 0 #0000;
    }
  }
}

@layer theme {
  :root, :host {
    --text-lg: 1.125rem;
    --text-lg--line-height: calc(1.75 / 1.125);
  }
}
@layer utilities {
  .hero-style-description-text-center {
    text-align: center;
  }
  .hero-style-description-text-lg {
    font-size: var(--text-lg);
    line-height: var(--tw-leading, var(--text-lg--line-height));
  }
  .hero-style-description-text-muted-foreground {
    color: var(--muted-foreground);
  }
}

@layer theme {
  :root, :host {
    --spacing: 0.25rem;
    --text-4xl: 2.25rem;
    --text-4xl--line-height: calc(2.5 / 2.25);
    --text-5xl: 3rem;
    --text-5xl--line-height: 1;
    --font-weight-bold: 700;
  }
}
@layer utilities {
  .hero-style-title-mb-4 {
    margin-bottom: calc(var(--spacing) * 4);
  }
  .hero-style-title-text-center {
    text-align: center;
  }
  .hero-style-title-text-4xl {
    font-size: var(--text-4xl);
    line-height: var(--tw-leading, var(--text-4xl--line-height));
  }
  .hero-style-title-font-bold {
    --tw-font-weight: var(--font-weight-bold);
    font-weight: var(--font-weight-bold);
  }
  .hero-style-title-text-balance {
    text-wrap: balance;
  }
  .hero-style-title-text-primary {
    color: var(--primary);
  }
  .hero-style-title-md\:text-5xl {
    @media (width >= 48rem) {
      font-size: var(--text-5xl);
      line-height: var(--tw-leading, var(--text-5xl--line-height));
    }
  }
}
@property --tw-font-weight {
  syntax: "*";
  inherits: false;
}
@layer properties {
  @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {
    *, ::before, ::after, ::backdrop {
      --tw-font-weight: initial;
    }
  }
}

@layer utilities {
  .hero-style-background-bg-gradient-to-b {
    --tw-gradient-position: to bottom in oklab;
    background-image: linear-gradient(var(--tw-gradient-stops));
  }
  .hero-style-background-from-primary\/10 {
    --tw-gradient-from: var(--primary);
    @supports (color: color-mix(in lab, red, red)) {
      --tw-gradient-from: color-mix(in oklab, var(--primary) 10%, transparent);
    }
    --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
  }
  .hero-style-background-to-background {
    --tw-gradient-to: var(--background);
    --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
  }
}
@property --tw-gradient-position {
  syntax: "*";
  inherits: false;
}
@property --tw-gradient-from {
  syntax: "<color>";
  inherits: false;
  initial-value: #0000;
}
@property --tw-gradient-to {
  syntax: "<color>";
  inherits: false;
  initial-value: #0000;
}
@property --tw-gradient-stops {
  syntax: "*";
  inherits: false;
}
@property --tw-gradient-via-stops {
  syntax: "*";
  inherits: false;
}
@property --tw-gradient-from-position {
  syntax: "<length-percentage>";
  inherits: false;
  initial-value: 0%;
}
@property --tw-gradient-to-position {
  syntax: "<length-percentage>";
  inherits: false;
  initial-value: 100%;
}
@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-gradient-position: initial;
      --tw-gradient-from: #0000;
      --tw-gradient-to: #0000;
      --tw-gradient-stops: initial;
      --tw-gradient-via-stops: initial;
      --tw-gradient-from-position: 0%;
      --tw-gradient-to-position: 100%;
    }
  }
}

@layer theme {
  :root, :host {
    --spacing: 0.25rem;
  }
}
@layer utilities {
  .hcb-bg-primary {
    background-color: var(--primary);
  }
  .hcb-px-6 {
    padding-inline: calc(var(--spacing) * 6);
  }
  .hcb-py-16 {
    padding-block: calc(var(--spacing) * 16);
  }
  .hcb-text-primary-foreground {
    color: var(--primary-foreground);
  }
  .hcb-md\:py-24 {
    @media (width >= 48rem) {
      padding-block: calc(var(--spacing) * 24);
    }
  }
}

@layer theme {
  :root, :host {
    --text-4xl: 2.25rem;
    --text-4xl--line-height: calc(2.5 / 2.25);
    --text-5xl: 3rem;
    --text-5xl--line-height: 1;
    --font-weight-bold: 700;
    --tracking-tight: -0.025em;
  }
}
@layer utilities {
  .hct-text-4xl {
    font-size: var(--text-4xl);
    line-height: var(--tw-leading, var(--text-4xl--line-height));
  }
  .hct-font-bold {
    --tw-font-weight: var(--font-weight-bold);
    font-weight: var(--font-weight-bold);
  }
  .hct-tracking-tight {
    --tw-tracking: var(--tracking-tight);
    letter-spacing: var(--tracking-tight);
  }
  .hct-text-balance {
    text-wrap: balance;
  }
  .hct-md\:text-5xl {
    @media (width >= 48rem) {
      font-size: var(--text-5xl);
      line-height: var(--tw-leading, var(--text-5xl--line-height));
    }
  }
}
@property --tw-font-weight {
  syntax: "*";
  inherits: false;
}
@property --tw-tracking {
  syntax: "*";
  inherits: false;
}
@layer properties {
  @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {
    *, ::before, ::after, ::backdrop {
      --tw-font-weight: initial;
      --tw-tracking: initial;
    }
  }
}

@layer theme {
  :root, :host {
    --text-lg: 1.125rem;
    --text-lg--line-height: calc(1.75 / 1.125);
    --text-xl: 1.25rem;
    --text-xl--line-height: calc(1.75 / 1.25);
    --leading-relaxed: 1.625;
  }
}
@layer utilities {
  .hcd-text-lg {
    font-size: var(--text-lg);
    line-height: var(--tw-leading, var(--text-lg--line-height));
  }
  .hcd-leading-relaxed {
    --tw-leading: var(--leading-relaxed);
    line-height: var(--leading-relaxed);
  }
  .hcd-text-pretty {
    text-wrap: pretty;
  }
  .hcd-text-primary-foreground\/90 {
    color: var(--primary-foreground);
    @supports (color: color-mix(in lab, red, red)) {
      color: color-mix(in oklab, var(--primary-foreground) 90%, transparent);
    }
  }
  .hcd-md\:text-xl {
    @media (width >= 48rem) {
      font-size: var(--text-xl);
      line-height: var(--tw-leading, var(--text-xl--line-height));
    }
  }
}
@property --tw-leading {
  syntax: "*";
  inherits: false;
}
@layer properties {
  @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {
    *, ::before, ::after, ::backdrop {
      --tw-leading: initial;
    }
  }
}

@layer utilities {
  .full-width-w-full {
    width: 100%;
  }
}

@layer theme {
  :root, :host {
    --default-transition-duration: 150ms;
    --default-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  }
}
@layer utilities {
  .cardstyle2-transition-all {
    transition-property: all;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
  }
  .cardstyle2-hover\:shadow-lg {
    &:hover {
      @media (hover: hover) {
        --tw-shadow: 0 10px 15px -3px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 4px 6px -4px 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);
      }
    }
  }
}
@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-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@property --tw-inset-ring-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@property --tw-ring-offset-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@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-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-shadow: 0 0 #0000;
      --tw-inset-ring-shadow: 0 0 #0000;
      --tw-ring-offset-shadow: 0 0 #0000;
    }
  }
}

@layer theme {
  :root, :host {
    --text-base: 1rem;
    --text-base--line-height: calc(1.5 / 1);
    --leading-relaxed: 1.625;
  }
}
@layer utilities {
  .carddescription-text-base {
    font-size: var(--text-base);
    line-height: var(--tw-leading, var(--text-base--line-height));
  }
  .carddescription-leading-relaxed {
    --tw-leading: var(--leading-relaxed);
    line-height: var(--leading-relaxed);
  }
}
@property --tw-leading {
  syntax: "*";
  inherits: false;
}
@layer properties {
  @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {
    *, ::before, ::after, ::backdrop {
      --tw-leading: initial;
    }
  }
}

@layer theme {
  :root, :host {
    --spacing: 0.25rem;
  }
}
@layer utilities {
  .pagetop-py-16 {
    padding-block: calc(var(--spacing) * 16);
  }
  .pagetop-md\:py-24 {
    @media (width >= 48rem) {
      padding-block: calc(var(--spacing) * 24);
    }
  }
}

@layer utilities {
  .item-center-items-center {
    align-items: center;
  }
}

@layer utilities {
  .cardstyle-border-0 {
    border-style: var(--tw-border-style);
    border-width: 0px;
  }
  .cardstyle-bg-transparent {
    background-color: transparent;
  }
  .cardstyle-shadow-none {
    --tw-shadow: 0 0 #0000;
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
}
@property --tw-border-style {
  syntax: "*";
  inherits: false;
  initial-value: solid;
}
@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-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@property --tw-inset-ring-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@property --tw-ring-offset-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@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-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-shadow: 0 0 #0000;
      --tw-inset-ring-shadow: 0 0 #0000;
      --tw-ring-offset-shadow: 0 0 #0000;
    }
  }
}

@layer utilities {
  .gradient-bg-bg-gradient-to-b {
    --tw-gradient-position: to bottom in oklab;
    background-image: linear-gradient(var(--tw-gradient-stops));
  }
  .gradient-bg-from-background {
    --tw-gradient-from: var(--background);
    --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
  }
  .gradient-bg-to-secondary\/10 {
    --tw-gradient-to: var(--secondary);
    @supports (color: color-mix(in lab, red, red)) {
      --tw-gradient-to: color-mix(in oklab, var(--secondary) 10%, transparent);
    }
    --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
  }
}
@property --tw-gradient-position {
  syntax: "*";
  inherits: false;
}
@property --tw-gradient-from {
  syntax: "<color>";
  inherits: false;
  initial-value: #0000;
}
@property --tw-gradient-to {
  syntax: "<color>";
  inherits: false;
  initial-value: #0000;
}
@property --tw-gradient-stops {
  syntax: "*";
  inherits: false;
}
@property --tw-gradient-via-stops {
  syntax: "*";
  inherits: false;
}
@property --tw-gradient-from-position {
  syntax: "<length-percentage>";
  inherits: false;
  initial-value: 0%;
}
@property --tw-gradient-to-position {
  syntax: "<length-percentage>";
  inherits: false;
  initial-value: 100%;
}
@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-gradient-position: initial;
      --tw-gradient-from: #0000;
      --tw-gradient-to: #0000;
      --tw-gradient-stops: initial;
      --tw-gradient-via-stops: initial;
      --tw-gradient-from-position: 0%;
      --tw-gradient-to-position: 100%;
    }
  }
}

@layer theme {
  :root, :host {
    --container-3xl: 48rem;
    --text-lg: 1.125rem;
    --text-lg--line-height: calc(1.75 / 1.125);
    --text-xl: 1.25rem;
    --text-xl--line-height: calc(1.75 / 1.25);
    --leading-relaxed: 1.625;
  }
}
@layer utilities {
  .herocontent-max-w-3xl {
    max-width: var(--container-3xl);
  }
  .herocontent-text-center {
    text-align: center;
  }
  .herocontent-text-lg {
    font-size: var(--text-lg);
    line-height: var(--tw-leading, var(--text-lg--line-height));
  }
  .herocontent-leading-relaxed {
    --tw-leading: var(--leading-relaxed);
    line-height: var(--leading-relaxed);
  }
  .herocontent-md\:text-xl {
    @media (width >= 48rem) {
      font-size: var(--text-xl);
      line-height: var(--tw-leading, var(--text-xl--line-height));
    }
  }
}
@property --tw-leading {
  syntax: "*";
  inherits: false;
}
@layer properties {
  @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {
    *, ::before, ::after, ::backdrop {
      --tw-leading: initial;
    }
  }
}

@layer theme {
  :root, :host {
    --text-5xl: 3rem;
    --text-5xl--line-height: 1;
    --text-6xl: 3.75rem;
    --text-6xl--line-height: 1;
    --text-7xl: 4.5rem;
    --text-7xl--line-height: 1;
    --font-weight-bold: 700;
    --tracking-tight: -0.025em;
  }
}
@layer utilities {
  .herotitle-text-center {
    text-align: center;
  }
  .herotitle-text-5xl {
    font-size: var(--text-5xl);
    line-height: var(--tw-leading, var(--text-5xl--line-height));
  }
  .herotitle-font-bold {
    --tw-font-weight: var(--font-weight-bold);
    font-weight: var(--font-weight-bold);
  }
  .herotitle-tracking-tight {
    --tw-tracking: var(--tracking-tight);
    letter-spacing: var(--tracking-tight);
  }
  .herotitle-md\:text-6xl {
    @media (width >= 48rem) {
      font-size: var(--text-6xl);
      line-height: var(--tw-leading, var(--text-6xl--line-height));
    }
  }
  .herotitle-lg\:text-7xl {
    @media (width >= 64rem) {
      font-size: var(--text-7xl);
      line-height: var(--tw-leading, var(--text-7xl--line-height));
    }
  }
}
@property --tw-font-weight {
  syntax: "*";
  inherits: false;
}
@property --tw-tracking {
  syntax: "*";
  inherits: false;
}
@layer properties {
  @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {
    *, ::before, ::after, ::backdrop {
      --tw-font-weight: initial;
      --tw-tracking: initial;
    }
  }
}

@layer utilities {
  .hover-primary-hover\:text-primary {
    &:hover {
      @media (hover: hover) {
        color: var(--primary);
      }
    }
  }
}

@layer utilities {
  .item-hover-styles-border {
    border-style: var(--tw-border-style);
    border-width: 1px;
  }
  .item-hover-styles-hover\:border-primary {
    &:hover {
      @media (hover: hover) {
        border-color: var(--primary);
      }
    }
  }
}
@property --tw-border-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;
    }
  }
}

@layer utilities {
  .height-400-relative {
    position: relative;
  }
  .height-400-h-\[256px\] {
    height: 256px;
  }
}

@layer theme {
  :root, :host {
    --spacing: 0.25rem;
    --text-3xl: 1.875rem;
    --text-3xl--line-height: calc(2.25 / 1.875);
    --font-weight-bold: 700;
  }
}
@layer utilities {
  .home-page-title-py-6 {
    padding-block: calc(var(--spacing) * 6);
  }
  .home-page-title-text-3xl {
    font-size: var(--text-3xl);
    line-height: var(--tw-leading, var(--text-3xl--line-height));
  }
  .home-page-title-font-bold {
    --tw-font-weight: var(--font-weight-bold);
    font-weight: var(--font-weight-bold);
  }
}
@property --tw-font-weight {
  syntax: "*";
  inherits: false;
}
@layer properties {
  @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {
    *, ::before, ::after, ::backdrop {
      --tw-font-weight: initial;
    }
  }
}

@layer theme {
  :root, :host {
    --spacing: 0.25rem;
  }
}
@layer utilities {
  .cta-button-flex {
    display: flex;
  }
  .cta-button-w-full {
    width: 100%;
  }
  .cta-button-items-center {
    align-items: center;
  }
  .cta-button-justify-center {
    justify-content: center;
  }
  .cta-button-gap-4 {
    gap: calc(var(--spacing) * 4);
  }
}

@layer utilities {
  .bg-50-bg-background\/50 {
    background-color: var(--background);
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix(in oklab, var(--background) 50%, transparent);
    }
  }
}

@layer theme {
  :root, :host {
    --text-xl: 1.25rem;
    --text-xl--line-height: calc(1.75 / 1.25);
  }
}
@layer utilities {
  .text-xl-text-xl {
    font-size: var(--text-xl);
    line-height: var(--tw-leading, var(--text-xl--line-height));
  }
}

@layer utilities {
  .rounded-large-rounded-lg {
    border-radius: var(--radius);
  }
}

@layer theme {
  :root, :host {
    --spacing: 0.25rem;
    --text-4xl: 2.25rem;
    --text-4xl--line-height: calc(2.5 / 2.25);
    --font-weight-bold: 700;
  }
}
@layer utilities {
  .h-1-mt-8 {
    margin-top: calc(var(--spacing) * 8);
  }
  .h-1-mb-4 {
    margin-bottom: calc(var(--spacing) * 4);
  }
  .h-1-text-4xl {
    font-size: var(--text-4xl);
    line-height: var(--tw-leading, var(--text-4xl--line-height));
  }
  .h-1-font-bold {
    --tw-font-weight: var(--font-weight-bold);
    font-weight: var(--font-weight-bold);
  }
}
@property --tw-font-weight {
  syntax: "*";
  inherits: false;
}
@layer properties {
  @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {
    *, ::before, ::after, ::backdrop {
      --tw-font-weight: initial;
    }
  }
}

@layer theme {
  :root, :host {
    --leading-relaxed: 1.625;
  }
}
@layer utilities {
  .text-pretty-leading-relaxed {
    --tw-leading: var(--leading-relaxed);
    line-height: var(--leading-relaxed);
  }
  .text-pretty-text-pretty {
    text-wrap: pretty;
  }
}
@property --tw-leading {
  syntax: "*";
  inherits: false;
}
@layer properties {
  @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {
    *, ::before, ::after, ::backdrop {
      --tw-leading: initial;
    }
  }
}

@layer theme {
  :root, :host {
    --text-2xl: 1.5rem;
    --text-2xl--line-height: calc(2 / 1.5);
  }
}
@layer utilities {
  .text-2xl-text-2xl {
    font-size: var(--text-2xl);
    line-height: var(--tw-leading, var(--text-2xl--line-height));
  }
}

@layer theme {
  :root, :host {
    --spacing: 0.25rem;
  }
}
@layer utilities {
  .padding-6-p-6 {
    padding: calc(var(--spacing) * 6);
  }
}

@layer utilities {
  .about-color-bg-primary\/10 {
    background-color: var(--primary);
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix(in oklab, var(--primary) 10%, transparent);
    }
  }
}

@layer theme {
  :root, :host {
    --spacing: 0.25rem;
    --text-xl: 1.25rem;
    --text-xl--line-height: calc(1.75 / 1.25);
    --radius-2xl: 1rem;
  }
}
@layer utilities {
  .about-background-infomation-rounded-2xl {
    border-radius: var(--radius-2xl);
  }
  .about-background-infomation-border {
    border-style: var(--tw-border-style);
    border-width: 1px;
  }
  .about-background-infomation-border-primary\/10 {
    border-color: var(--primary);
    @supports (color: color-mix(in lab, red, red)) {
      border-color: color-mix(in oklab, var(--primary) 10%, transparent);
    }
  }
  .about-background-infomation-bg-primary\/10 {
    background-color: var(--primary);
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix(in oklab, var(--primary) 10%, transparent);
    }
  }
  .about-background-infomation-p-6 {
    padding: calc(var(--spacing) * 6);
  }
  .about-background-infomation-text-xl {
    font-size: var(--text-xl);
    line-height: var(--tw-leading, var(--text-xl--line-height));
  }
  .about-background-infomation-shadow-lg {
    --tw-shadow: 0 10px 15px -3px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 4px 6px -4px 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);
  }
}
@property --tw-border-style {
  syntax: "*";
  inherits: false;
  initial-value: solid;
}
@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-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@property --tw-inset-ring-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@property --tw-ring-offset-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@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-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-shadow: 0 0 #0000;
      --tw-inset-ring-shadow: 0 0 #0000;
      --tw-ring-offset-shadow: 0 0 #0000;
    }
  }
}

@layer theme {
  :root, :host {
    --text-xl: 1.25rem;
    --text-xl--line-height: calc(1.75 / 1.25);
  }
}
@layer utilities {
  .text-large-text-xl {
    font-size: var(--text-xl);
    line-height: var(--tw-leading, var(--text-xl--line-height));
  }
}

@layer utilities {
  .text-primary-text-primary {
    color: var(--primary);
  }
}

@layer theme {
  :root, :host {
    --spacing: 0.25rem;
  }
}
@layer utilities {
  .about-padding-pt-10 {
    padding-top: calc(var(--spacing) * 10);
  }
  .about-padding-sm\:pt-12 {
    @media (width >= 40rem) {
      padding-top: calc(var(--spacing) * 12);
    }
  }
  .about-padding-md\:pt-16 {
    @media (width >= 48rem) {
      padding-top: calc(var(--spacing) * 16);
    }
  }
}

@layer theme {
  :root, :host {
    --spacing: 0.25rem;
  }
}
@layer utilities {
  .margin-top-8-lg\:mt-28 {
    @media (width >= 64rem) {
      margin-top: calc(var(--spacing) * 28);
    }
  }
}

@layer theme {
  :root, :host {
    --spacing: 0.25rem;
  }
}
@layer utilities {
  .about-gridheight-h-80 {
    height: calc(var(--spacing) * 80);
  }
  .about-gridheight-lg\:h-96 {
    @media (width >= 64rem) {
      height: calc(var(--spacing) * 96);
    }
  }
}

@layer utilities {
  .object-cover-object-cover {
    object-fit: cover;
  }
}

@layer theme {
  :root, :host {
    --radius-2xl: 1rem;
  }
}
@layer utilities {
  .about-shiham-overflow-hidden {
    overflow: hidden;
  }
  .about-shiham-rounded-2xl {
    border-radius: var(--radius-2xl);
  }
  .about-shiham-shadow-2xl {
    --tw-shadow: 0 25px 50px -12px var(--tw-shadow-color, rgb(0 0 0 / 0.25));
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
}
@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-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@property --tw-inset-ring-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@property --tw-ring-offset-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@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-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-shadow: 0 0 #0000;
      --tw-inset-ring-shadow: 0 0 #0000;
      --tw-ring-offset-shadow: 0 0 #0000;
    }
  }
}

@layer theme {
  :root, :host {
    --spacing: 0.25rem;
  }
}
@layer utilities {
  .about-grid-mb-16 {
    margin-bottom: calc(var(--spacing) * 16);
  }
  .about-grid-items-center {
    align-items: center;
  }
  .about-grid-lg\:mb-24 {
    @media (width >= 64rem) {
      margin-bottom: calc(var(--spacing) * 24);
    }
  }
}

@layer theme {
  :root, :host {
    --spacing: 0.25rem;
    --text-4xl: 2.25rem;
    --text-4xl--line-height: calc(2.5 / 2.25);
    --text-5xl: 3rem;
    --text-5xl--line-height: 1;
    --text-6xl: 3.75rem;
    --text-6xl--line-height: 1;
    --font-weight-bold: 700;
  }
}
@layer utilities {
  .about-title-mb-4 {
    margin-bottom: calc(var(--spacing) * 4);
  }
  .about-title-text-4xl {
    font-size: var(--text-4xl);
    line-height: var(--tw-leading, var(--text-4xl--line-height));
  }
  .about-title-font-bold {
    --tw-font-weight: var(--font-weight-bold);
    font-weight: var(--font-weight-bold);
  }
  .about-title-text-balance {
    text-wrap: balance;
  }
  .about-title-text-primary {
    color: var(--primary);
  }
  .about-title-sm\:text-5xl {
    @media (width >= 40rem) {
      font-size: var(--text-5xl);
      line-height: var(--tw-leading, var(--text-5xl--line-height));
    }
  }
  .about-title-lg\:text-6xl {
    @media (width >= 64rem) {
      font-size: var(--text-6xl);
      line-height: var(--tw-leading, var(--text-6xl--line-height));
    }
  }
}
@property --tw-font-weight {
  syntax: "*";
  inherits: false;
}
@layer properties {
  @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {
    *, ::before, ::after, ::backdrop {
      --tw-font-weight: initial;
    }
  }
}

@layer utilities {
  .tab-center-flex {
    display: flex;
  }
  .tab-center-justify-center {
    justify-content: center;
  }
}

@layer utilities {
  .cta-hero-bg-bg-background\/90 {
    background-color: var(--background);
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix(in oklab, var(--background) 90%, transparent);
    }
  }
}

@layer theme {
  :root, :host {
    --text-3xl: 1.875rem;
    --text-3xl--line-height: calc(2.25 / 1.875);
    --text-4xl: 2.25rem;
    --text-4xl--line-height: calc(2.5 / 2.25);
    --text-5xl: 3rem;
    --text-5xl--line-height: 1;
    --font-weight-bold: 700;
    --tracking-tight: -0.025em;
  }
}
@layer utilities {
  .cta-title-text-center {
    text-align: center;
  }
  .cta-title-text-3xl {
    font-size: var(--text-3xl);
    line-height: var(--tw-leading, var(--text-3xl--line-height));
  }
  .cta-title-font-bold {
    --tw-font-weight: var(--font-weight-bold);
    font-weight: var(--font-weight-bold);
  }
  .cta-title-tracking-tight {
    --tw-tracking: var(--tracking-tight);
    letter-spacing: var(--tracking-tight);
  }
  .cta-title-break-words {
    overflow-wrap: break-word;
  }
  .cta-title-hyphens-auto {
    -webkit-hyphens: auto;
    hyphens: auto;
  }
  .cta-title-text-foreground {
    color: var(--foreground);
  }
  .cta-title-sm\:text-left {
    @media (width >= 40rem) {
      text-align: left;
    }
  }
  .cta-title-sm\:text-3xl {
    @media (width >= 40rem) {
      font-size: var(--text-3xl);
      line-height: var(--tw-leading, var(--text-3xl--line-height));
    }
  }
  .cta-title-md\:text-4xl {
    @media (width >= 48rem) {
      font-size: var(--text-4xl);
      line-height: var(--tw-leading, var(--text-4xl--line-height));
    }
  }
  .cta-title-lg\:text-5xl {
    @media (width >= 64rem) {
      font-size: var(--text-5xl);
      line-height: var(--tw-leading, var(--text-5xl--line-height));
    }
  }
}
@property --tw-font-weight {
  syntax: "*";
  inherits: false;
}
@property --tw-tracking {
  syntax: "*";
  inherits: false;
}
@layer properties {
  @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {
    *, ::before, ::after, ::backdrop {
      --tw-font-weight: initial;
      --tw-tracking: initial;
    }
  }
}

@layer theme {
  :root, :host {
    --spacing: 0.25rem;
  }
}
@layer utilities {
  .spacer-space-y-4 {
    :where(& > :not(:last-child)) {
      --tw-space-y-reverse: 0;
      margin-block-start: calc(calc(var(--spacing) * 4) * var(--tw-space-y-reverse));
      margin-block-end: calc(calc(var(--spacing) * 4) * calc(1 - var(--tw-space-y-reverse)));
    }
  }
}
@property --tw-space-y-reverse {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}
@layer properties {
  @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {
    *, ::before, ::after, ::backdrop {
      --tw-space-y-reverse: 0;
    }
  }
}

@layer theme {
  :root, :host {
    --spacing: 0.25rem;
  }
}
@layer utilities {
  .gap-4-gap-4 {
    gap: calc(var(--spacing) * 4);
  }
}

@layer utilities {
  .w2-header-drropdown-w-\[220px\] {
    width: 220px;
  }
}

@layer utilities {
  .w1-header-drropdown-w-\[120px\] {
    width: 120px;
  }
}

@layer theme {
  :root, :host {
    --text-4xl: 2.25rem;
    --text-4xl--line-height: calc(2.5 / 2.25);
    --text-5xl: 3rem;
    --text-5xl--line-height: 1;
    --text-6xl: 3.75rem;
    --text-6xl--line-height: 1;
    --font-weight-bold: 700;
    --tracking-tight: -0.025em;
  }
}
@layer utilities {
  .hero-title-text-center {
    text-align: center;
  }
  .hero-title-text-4xl {
    font-size: var(--text-4xl);
    line-height: var(--tw-leading, var(--text-4xl--line-height));
  }
  .hero-title-font-bold {
    --tw-font-weight: var(--font-weight-bold);
    font-weight: var(--font-weight-bold);
  }
  .hero-title-tracking-tight {
    --tw-tracking: var(--tracking-tight);
    letter-spacing: var(--tracking-tight);
  }
  .hero-title-break-words {
    overflow-wrap: break-word;
  }
  .hero-title-hyphens-auto {
    -webkit-hyphens: auto;
    hyphens: auto;
  }
  .hero-title-text-foreground {
    color: var(--foreground);
  }
  .hero-title-sm\:text-left {
    @media (width >= 40rem) {
      text-align: left;
    }
  }
  .hero-title-sm\:text-4xl {
    @media (width >= 40rem) {
      font-size: var(--text-4xl);
      line-height: var(--tw-leading, var(--text-4xl--line-height));
    }
  }
  .hero-title-md\:text-5xl {
    @media (width >= 48rem) {
      font-size: var(--text-5xl);
      line-height: var(--tw-leading, var(--text-5xl--line-height));
    }
  }
  .hero-title-lg\:text-6xl {
    @media (width >= 64rem) {
      font-size: var(--text-6xl);
      line-height: var(--tw-leading, var(--text-6xl--line-height));
    }
  }
}
@property --tw-font-weight {
  syntax: "*";
  inherits: false;
}
@property --tw-tracking {
  syntax: "*";
  inherits: false;
}
@layer properties {
  @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {
    *, ::before, ::after, ::backdrop {
      --tw-font-weight: initial;
      --tw-tracking: initial;
    }
  }
}

@layer utilities {
  .full-screen-hero-height-h-\[calc\(100vh-64px\)\] {
    height: calc(100vh - 64px);
  }
  .full-screen-hero-height-md\:h-\[calc\(100vh-72px\)\] {
    @media (width >= 48rem) {
      height: calc(100vh - 72px);
    }
  }
  .full-screen-hero-height-lg\:h-\[calc\(100vh-80px\)\] {
    @media (width >= 64rem) {
      height: calc(100vh - 80px);
    }
  }
}

@layer theme {
  :root, :host {
    --spacing: 0.25rem;
  }
}
@layer utilities {
  .hero-button-flex {
    display: flex;
  }
  .hero-button-w-full {
    width: 100%;
  }
  .hero-button-flex-col {
    flex-direction: column;
  }
  .hero-button-gap-2 {
    gap: calc(var(--spacing) * 2);
  }
  .hero-button-md\:w-auto {
    @media (width >= 48rem) {
      width: auto;
    }
  }
  .hero-button-md\:flex-row {
    @media (width >= 48rem) {
      flex-direction: row;
    }
  }
  .hero-button-md\:gap-4 {
    @media (width >= 48rem) {
      gap: calc(var(--spacing) * 4);
    }
  }
}

@layer utilities {
  .no-shadow-shadow-none {
    --tw-shadow: 0 0 #0000;
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
}
@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-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@property --tw-inset-ring-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@property --tw-ring-offset-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@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-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-shadow: 0 0 #0000;
      --tw-inset-ring-shadow: 0 0 #0000;
      --tw-ring-offset-shadow: 0 0 #0000;
    }
  }
}

@layer theme {
  :root, :host {
    --text-2xl: 1.5rem;
    --text-2xl--line-height: calc(2 / 1.5);
  }
}
@layer utilities {
  .card-title-text-2xl {
    font-size: var(--text-2xl);
    line-height: var(--tw-leading, var(--text-2xl--line-height));
  }
}

@layer theme {
  :root, :host {
    --spacing: 0.25rem;
  }
}
@layer utilities {
  .margin-bottom-6-mb-6 {
    margin-bottom: calc(var(--spacing) * 6);
  }
}

@layer theme {
  :root, :host {
    --spacing: 0.25rem;
  }
}
@layer utilities {
  .padding-y8-py-4 {
    padding-block: calc(var(--spacing) * 4);
  }
}

@layer utilities {
  .text-center-text-center {
    text-align: center;
  }
}

@layer theme {
  :root, :host {
    --spacing: 0.25rem;
  }
}
@layer utilities {
  .margin-top-4-mt-4 {
    margin-top: calc(var(--spacing) * 4);
  }
}

@layer theme {
  :root, :host {
    --spacing: 0.25rem;
  }
}
@layer utilities {
  .margin-top-2-mt-2 {
    margin-top: calc(var(--spacing) * 2);
  }
}

@layer theme {
  :root, :host {
    --spacing: 0.25rem;
  }
}
@layer utilities {
  .padding-top-2-pt-2 {
    padding-top: calc(var(--spacing) * 2);
  }
}

@layer theme {
  :root, :host {
    --spacing: 0.25rem;
    --text-3xl: 1.875rem;
    --text-3xl--line-height: calc(2.25 / 1.875);
    --font-weight-bold: 700;
  }
}
@layer utilities {
  .simple-hero-border-b {
    border-bottom-style: var(--tw-border-style);
    border-bottom-width: 1px;
  }
  .simple-hero-py-6 {
    padding-block: calc(var(--spacing) * 6);
  }
  .simple-hero-text-3xl {
    font-size: var(--text-3xl);
    line-height: var(--tw-leading, var(--text-3xl--line-height));
  }
  .simple-hero-font-bold {
    --tw-font-weight: var(--font-weight-bold);
    font-weight: var(--font-weight-bold);
  }
}
@property --tw-border-style {
  syntax: "*";
  inherits: false;
  initial-value: solid;
}
@property --tw-font-weight {
  syntax: "*";
  inherits: false;
}
@layer properties {
  @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {
    *, ::before, ::after, ::backdrop {
      --tw-border-style: solid;
      --tw-font-weight: initial;
    }
  }
}

@layer theme {
  :root, :host {
    --spacing: 0.25rem;
  }
}
@layer utilities {
  .container-container {
    width: 100%;
    @media (width >= 40rem) {
      max-width: 40rem;
    }
    @media (width >= 48rem) {
      max-width: 48rem;
    }
    @media (width >= 64rem) {
      max-width: 64rem;
    }
    @media (width >= 80rem) {
      max-width: 80rem;
    }
    @media (width >= 96rem) {
      max-width: 96rem;
    }
  }
  .container-mx-auto {
    margin-inline: auto;
  }
  .container-px-4 {
    padding-inline: calc(var(--spacing) * 4);
  }
}

@layer theme {
  :root, :host {
    --spacing: 0.25rem;
  }
}
@layer utilities {
  .last-modified-margin-my-4 {
    margin-block: calc(var(--spacing) * 4);
  }
}

@layer theme {
  :root, :host {
    --default-transition-duration: 150ms;
    --default-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  }
}
@layer utilities {
  .link-text-primary {
    color: var(--primary);
  }
  .link-transition-colors {
    transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
  }
  .link-hover\:underline {
    &:hover {
      @media (hover: hover) {
        text-decoration-line: underline;
      }
    }
  }
}

@layer theme {
  :root, :host {
    --spacing: 0.25rem;
  }
}
@layer utilities {
  .my-4-sm-0-my-4 {
    margin-block: calc(var(--spacing) * 4);
  }
  .my-4-sm-0-sm\:my-0 {
    @media (width >= 40rem) {
      margin-block: calc(var(--spacing) * 0);
    }
  }
}

@layer theme {
  :root, :host {
    --spacing: 0.25rem;
    --container-2xl: 42rem;
    --text-sm: 0.875rem;
    --text-sm--line-height: calc(1.25 / 0.875);
    --text-base: 1rem;
    --text-base--line-height: calc(1.5 / 1);
    --text-lg: 1.125rem;
    --text-lg--line-height: calc(1.75 / 1.125);
    --text-xl: 1.25rem;
    --text-xl--line-height: calc(1.75 / 1.25);
  }
}
@layer utilities {
  .hero-content-mx-auto {
    margin-inline: auto;
  }
  .hero-content-max-w-2xl {
    max-width: var(--container-2xl);
  }
  .hero-content-text-sm {
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
  }
  .hero-content-break-words {
    overflow-wrap: break-word;
  }
  .hero-content-text-muted-foreground {
    color: var(--muted-foreground);
  }
  .hero-content-sm\:text-base {
    @media (width >= 40rem) {
      font-size: var(--text-base);
      line-height: var(--tw-leading, var(--text-base--line-height));
    }
  }
  .hero-content-md\:mx-0 {
    @media (width >= 48rem) {
      margin-inline: calc(var(--spacing) * 0);
    }
  }
  .hero-content-md\:text-lg {
    @media (width >= 48rem) {
      font-size: var(--text-lg);
      line-height: var(--tw-leading, var(--text-lg--line-height));
    }
  }
  .hero-content-lg\:text-xl {
    @media (width >= 64rem) {
      font-size: var(--text-xl);
      line-height: var(--tw-leading, var(--text-xl--line-height));
    }
  }
}

@layer utilities {
  .no-background-bg-transparent {
    background-color: transparent;
  }
}

@layer utilities {
  .border-0-border-0 {
    border-style: var(--tw-border-style);
    border-width: 0px;
  }
}
@property --tw-border-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;
    }
  }
}

@layer theme {
  :root, :host {
    --spacing: 0.25rem;
  }
}
@layer utilities {
  .logo-header-h-12 {
    height: calc(var(--spacing) * 12);
  }
  .logo-header-w-auto {
    width: auto;
  }
  .logo-header-object-contain {
    object-fit: contain;
  }
  .logo-header-md\:h-14 {
    @media (width >= 48rem) {
      height: calc(var(--spacing) * 14);
    }
  }
  .logo-header-lg\:h-16 {
    @media (width >= 64rem) {
      height: calc(var(--spacing) * 16);
    }
  }
}