/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */
@layer properties;
@layer theme, base, components, utilities, core, partLayout, partPage, partPart, runnableLayout, runnablePage, runnablePart, siteLayout, sitePage, sitePart, themeLayout, themePage, themePart, deploymentInstance, tenant;
@layer theme, base, components, utilities;
@layer theme {
  :root, :host {
    --color-custom-color1: var(--color1);
    --color-custom-color11: var(--color11);
    --font-vazirmatn: 'vazirmatn', sans-serif;
  }
}
@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, var(--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-feature-settings: var(--default-font-feature-settings, initial);
    font-variation-settings: var(--default-font-variation-settings, initial);
    -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, var(--font-mono, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono",
      "Courier New", monospace));
    font-feature-settings: var(--default-mono-font-feature-settings, initial);
    font-variation-settings: var(--default-mono-font-variation-settings, initial);
    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;
    vertical-align: middle;
  }
  img, video {
    max-width: 100%;
    height: auto;
  }
  button, input, select, optgroup, textarea, ::file-selector-button {
    font: inherit;
    font-feature-settings: inherit;
    font-variation-settings: inherit;
    letter-spacing: inherit;
    color: inherit;
    border-radius: 0;
    background-color: transparent;
    opacity: 1;
  }
  :where(select:is([multiple], [size])) optgroup {
    font-weight: bolder;
  }
  :where(select:is([multiple], [size])) optgroup option {
    padding-inline-start: 20px;
  }
  ::file-selector-button {
    margin-inline-end: 4px;
  }
  ::placeholder {
    opacity: 1;
  }
  @supports (not (-webkit-appearance: -apple-pay-button))  or (contain-intrinsic-size: 1px) {
    ::placeholder {
      color: currentcolor;
      @supports (color: color-mix(in lab, red, red)) {
        color: color-mix(in oklab, currentcolor 50%, transparent);
      }
    }
  }
  textarea {
    resize: vertical;
  }
  ::-webkit-search-decoration {
    -webkit-appearance: none;
  }
  ::-webkit-date-and-time-value {
    min-height: 1lh;
    text-align: inherit;
  }
  ::-webkit-datetime-edit {
    display: inline-flex;
  }
  ::-webkit-datetime-edit-fields-wrapper {
    padding: 0;
  }
  ::-webkit-datetime-edit, ::-webkit-datetime-edit-year-field, ::-webkit-datetime-edit-month-field, ::-webkit-datetime-edit-day-field, ::-webkit-datetime-edit-hour-field, ::-webkit-datetime-edit-minute-field, ::-webkit-datetime-edit-second-field, ::-webkit-datetime-edit-millisecond-field, ::-webkit-datetime-edit-meridiem-field {
    padding-block: 0;
  }
  ::-webkit-calendar-picker-indicator {
    line-height: 1;
  }
  :-moz-ui-invalid {
    box-shadow: none;
  }
  button, input:where([type="button"], [type="reset"], [type="submit"]), ::file-selector-button {
    appearance: button;
  }
  ::-webkit-inner-spin-button, ::-webkit-outer-spin-button {
    height: auto;
  }
  [hidden]:where(:not([hidden="until-found"])) {
    display: none !important;
  }
}
@layer utilities {
  .pointer-events-auto {
    pointer-events: auto;
  }
  .pointer-events-none {
    pointer-events: none;
  }
  .collapse {
    visibility: collapse;
  }
  .invisible {
    visibility: hidden;
  }
  .visible {
    visibility: visible;
  }
  .absolute {
    position: absolute;
  }
  .fixed {
    position: fixed;
  }
  .relative {
    position: relative;
  }
  .static {
    position: static;
  }
  .sticky {
    position: sticky;
  }
  .inset-0 {
    inset: 0px;
  }
  .start-0 {
    inset-inline-start: calc(var(--spacing, 0.25rem) * 0);
  }
  .end-0 {
    inset-inline-end: calc(var(--spacing, 0.25rem) * 0);
  }
  .top-0 {
    top: 0px;
  }
  .top-20 {
    top: calc(var(--spacing, 0.25rem) * 20);
  }
  .top-full {
    top: 100%;
  }
  .bottom-0 {
    bottom: 0px;
  }
  .left-0 {
    left: 0px;
  }
  .z-30 {
    z-index: 30;
  }
  .z-40 {
    z-index: 40;
  }
  .z-50 {
    z-index: 50;
  }
  .order-1 {
    order: 1;
  }
  .order-2 {
    order: 2;
  }
  .order-3 {
    order: 3;
  }
  .col-start-9 {
    grid-column-start: 9;
  }
  .col-end-11 {
    grid-column-end: 11;
  }
  .container {
    width: 100%;
    @media (width >= 18.75rem) {
      max-width: 18.75rem;
    }
    @media (width >= 20rem) {
      max-width: 20rem;
    }
    @media (width >= 22.5rem) {
      max-width: 22.5rem;
    }
    @media (width >= 23.75rem) {
      max-width: 23.75rem;
    }
    @media (width >= 30rem) {
      max-width: 30rem;
    }
    @media (width >= 31.25rem) {
      max-width: 31.25rem;
    }
    @media (width >= 32.5rem) {
      max-width: 32.5rem;
    }
    @media (width >= 33.75rem) {
      max-width: 33.75rem;
    }
    @media (width >= 35rem) {
      max-width: 35rem;
    }
    @media (width >= 36rem) {
      max-width: 36rem;
    }
    @media (width >= 37.5rem) {
      max-width: 37.5rem;
    }
    @media (width >= 40rem) {
      max-width: 40rem;
    }
    @media (width >= 40.625rem) {
      max-width: 40.625rem;
    }
    @media (width >= 42rem) {
      max-width: 42rem;
    }
    @media (width >= 43.75rem) {
      max-width: 43.75rem;
    }
    @media (width >= 47.5rem) {
      max-width: 47.5rem;
    }
    @media (width >= 48rem) {
      max-width: 48rem;
    }
    @media (width >= 50rem) {
      max-width: 50rem;
    }
    @media (width >= 53.75rem) {
      max-width: 53.75rem;
    }
    @media (width >= 54rem) {
      max-width: 54rem;
    }
    @media (width >= 55rem) {
      max-width: 55rem;
    }
    @media (width >= 56.25rem) {
      max-width: 56.25rem;
    }
    @media (width >= 57.5rem) {
      max-width: 57.5rem;
    }
    @media (width >= 57.625rem) {
      max-width: 57.625rem;
    }
    @media (width >= 60rem) {
      max-width: 60rem;
    }
    @media (width >= 62rem) {
      max-width: 62rem;
    }
    @media (width >= 62.5rem) {
      max-width: 62.5rem;
    }
    @media (width >= 64rem) {
      max-width: 64rem;
    }
    @media (width >= 65.625rem) {
      max-width: 65.625rem;
    }
    @media (width >= 67.5rem) {
      max-width: 67.5rem;
    }
    @media (width >= 68.125rem) {
      max-width: 68.125rem;
    }
    @media (width >= 68.75rem) {
      max-width: 68.75rem;
    }
    @media (width >= 70rem) {
      max-width: 70rem;
    }
    @media (width >= 73.75rem) {
      max-width: 73.75rem;
    }
    @media (width >= 75rem) {
      max-width: 75rem;
    }
    @media (width >= 80rem) {
      max-width: 80rem;
    }
    @media (width >= 82.5rem) {
      max-width: 82.5rem;
    }
    @media (width >= 86.75rem) {
      max-width: 86.75rem;
    }
    @media (width >= 87.5rem) {
      max-width: 87.5rem;
    }
    @media (width >= 90rem) {
      max-width: 90rem;
    }
    @media (width >= 93.75rem) {
      max-width: 93.75rem;
    }
    @media (width >= 96rem) {
      max-width: 96rem;
    }
    @media (width >= 105rem) {
      max-width: 105rem;
    }
    @media (width >= 118.75rem) {
      max-width: 118.75rem;
    }
    @media (width >= 120rem) {
      max-width: 120rem;
    }
  }
  .mx-auto {
    margin-inline: auto;
  }
  .my-8 {
    margin-block: calc(var(--spacing, 0.25rem) * 8);
  }
  .mt-5 {
    margin-top: calc(var(--spacing, 0.25rem) * 5);
  }
  .mb-20 {
    margin-bottom: calc(var(--spacing, 0.25rem) * 20);
  }
  .surfaceSoft {
    background-color: var(--surfaceSoft);
    display: flow-root;
  }
  .block {
    display: block;
  }
  .contents {
    display: contents;
  }
  .flex {
    display: flex;
  }
  .grid {
    display: grid;
  }
  .hidden {
    display: none;
  }
  .inline {
    display: inline;
  }
  .inline-block {
    display: inline-block;
  }
  .list-item {
    display: list-item;
  }
  .table {
    display: table;
  }
  .table-cell {
    display: table-cell;
  }
  .table-row {
    display: table-row;
  }
  .aspect-\[3\/2\] {
    aspect-ratio: 3/2;
  }
  .aspect-\[3\/4\] {
    aspect-ratio: 3/4;
  }
  .aspect-\[4\/3\] {
    aspect-ratio: 4/3;
  }
  .aspect-\[16\/10\] {
    aspect-ratio: 16/10;
  }
  .aspect-square {
    aspect-ratio: 1 / 1;
  }
  .aspect-video {
    aspect-ratio: var(--aspect-video, 16 / 9);
  }
  .h-5 {
    height: calc(var(--spacing, 0.25rem) * 5);
  }
  .h-6 {
    height: calc(var(--spacing, 0.25rem) * 6);
  }
  .h-8 {
    height: calc(var(--spacing, 0.25rem) * 8);
  }
  .h-9 {
    height: calc(var(--spacing, 0.25rem) * 9);
  }
  .h-10 {
    height: calc(var(--spacing, 0.25rem) * 10);
  }
  .h-12 {
    height: calc(var(--spacing, 0.25rem) * 12);
  }
  .h-14 {
    height: calc(var(--spacing, 0.25rem) * 14);
  }
  .h-16 {
    height: calc(var(--spacing, 0.25rem) * 16);
  }
  .h-20 {
    height: calc(var(--spacing, 0.25rem) * 20);
  }
  .h-24 {
    height: calc(var(--spacing, 0.25rem) * 24);
  }
  .h-28 {
    height: calc(var(--spacing, 0.25rem) * 28);
  }
  .h-32 {
    height: calc(var(--spacing, 0.25rem) * 32);
  }
  .h-40 {
    height: calc(var(--spacing, 0.25rem) * 40);
  }
  .h-44 {
    height: calc(var(--spacing, 0.25rem) * 44);
  }
  .h-48 {
    height: calc(var(--spacing, 0.25rem) * 48);
  }
  .h-56 {
    height: calc(var(--spacing, 0.25rem) * 56);
  }
  .h-60 {
    height: calc(var(--spacing, 0.25rem) * 60);
  }
  .h-64 {
    height: calc(var(--spacing, 0.25rem) * 64);
  }
  .h-72 {
    height: calc(var(--spacing, 0.25rem) * 72);
  }
  .h-80 {
    height: calc(var(--spacing, 0.25rem) * 80);
  }
  .h-\[23px\] {
    height: 23px;
  }
  .h-\[24px\] {
    height: 24px;
  }
  .h-\[32px\] {
    height: 32px;
  }
  .h-\[34px\] {
    height: 34px;
  }
  .h-\[35px\] {
    height: 35px;
  }
  .h-\[36px\] {
    height: 36px;
  }
  .h-\[37px\] {
    height: 37px;
  }
  .h-\[38px\] {
    height: 38px;
  }
  .h-\[40px\] {
    height: 40px;
  }
  .h-\[43px\] {
    height: 43px;
  }
  .h-\[44px\] {
    height: 44px;
  }
  .h-\[46px\] {
    height: 46px;
  }
  .h-\[46rem\] {
    height: 46rem;
  }
  .h-\[47px\] {
    height: 47px;
  }
  .h-\[48px\] {
    height: 48px;
  }
  .h-\[50px\] {
    height: 50px;
  }
  .h-\[52px\] {
    height: 52px;
  }
  .h-\[54px\] {
    height: 54px;
  }
  .h-\[55\.72px\] {
    height: 55.72px;
  }
  .h-\[56\.25cqw\] {
    height: 56.25cqw;
  }
  .h-\[56\.140625px\] {
    height: 56.140625px;
  }
  .h-\[56px\] {
    height: 56px;
  }
  .h-\[65px\] {
    height: 65px;
  }
  .h-\[68px\] {
    height: 68px;
  }
  .h-\[73px\] {
    height: 73px;
  }
  .h-\[75cqw\] {
    height: 75cqw;
  }
  .h-\[75px\] {
    height: 75px;
  }
  .h-\[76px\] {
    height: 76px;
  }
  .h-\[77px\] {
    height: 77px;
  }
  .h-\[80px\] {
    height: 80px;
  }
  .h-\[85px\] {
    height: 85px;
  }
  .h-\[86px\] {
    height: 86px;
  }
  .h-\[88px\] {
    height: 88px;
  }
  .h-\[90px\] {
    height: 90px;
  }
  .h-\[96px\] {
    height: 96px;
  }
  .h-\[100px\] {
    height: 100px;
  }
  .h-\[100vh\] {
    height: 100vh;
  }
  .h-\[104px\] {
    height: 104px;
  }
  .h-\[108\.3591331269cqw\] {
    height: 108.3591331269cqw;
  }
  .h-\[112px\] {
    height: 112px;
  }
  .h-\[116px\] {
    height: 116px;
  }
  .h-\[118px\] {
    height: 118px;
  }
  .h-\[120px\] {
    height: 120px;
  }
  .h-\[123\.5px\] {
    height: 123.5px;
  }
  .h-\[128px\] {
    height: 128px;
  }
  .h-\[136px\] {
    height: 136px;
  }
  .h-\[143px\] {
    height: 143px;
  }
  .h-\[144px\] {
    height: 144px;
  }
  .h-\[150px\] {
    height: 150px;
  }
  .h-\[156px\] {
    height: 156px;
  }
  .h-\[160px\] {
    height: 160px;
  }
  .h-\[163px\] {
    height: 163px;
  }
  .h-\[165px\] {
    height: 165px;
  }
  .h-\[167px\] {
    height: 167px;
  }
  .h-\[170px\] {
    height: 170px;
  }
  .h-\[172px\] {
    height: 172px;
  }
  .h-\[176px\] {
    height: 176px;
  }
  .h-\[177px\] {
    height: 177px;
  }
  .h-\[180px\] {
    height: 180px;
  }
  .h-\[184px\] {
    height: 184px;
  }
  .h-\[185px\] {
    height: 185px;
  }
  .h-\[187px\] {
    height: 187px;
  }
  .h-\[196px\] {
    height: 196px;
  }
  .h-\[197px\] {
    height: 197px;
  }
  .h-\[200px\] {
    height: 200px;
  }
  .h-\[203px\] {
    height: 203px;
  }
  .h-\[207px\] {
    height: 207px;
  }
  .h-\[208px\] {
    height: 208px;
  }
  .h-\[211px\] {
    height: 211px;
  }
  .h-\[216px\] {
    height: 216px;
  }
  .h-\[220px\] {
    height: 220px;
  }
  .h-\[221px\] {
    height: 221px;
  }
  .h-\[222px\] {
    height: 222px;
  }
  .h-\[224px\] {
    height: 224px;
  }
  .h-\[230px\] {
    height: 230px;
  }
  .h-\[234px\] {
    height: 234px;
  }
  .h-\[235px\] {
    height: 235px;
  }
  .h-\[238px\] {
    height: 238px;
  }
  .h-\[240px\] {
    height: 240px;
  }
  .h-\[252px\] {
    height: 252px;
  }
  .h-\[256px\] {
    height: 256px;
  }
  .h-\[270px\] {
    height: 270px;
  }
  .h-\[280px\] {
    height: 280px;
  }
  .h-\[300px\] {
    height: 300px;
  }
  .h-\[312px\] {
    height: 312px;
  }
  .h-\[320px\] {
    height: 320px;
  }
  .h-\[336px\] {
    height: 336px;
  }
  .h-\[350px\] {
    height: 350px;
  }
  .h-\[360px\] {
    height: 360px;
  }
  .h-\[400px\] {
    height: 400px;
  }
  .h-\[418px\] {
    height: 418px;
  }
  .h-\[440px\] {
    height: 440px;
  }
  .h-\[458px\] {
    height: 458px;
  }
  .h-\[500px\] {
    height: 500px;
  }
  .h-\[609px\] {
    height: 609px;
  }
  .h-\[759px\] {
    height: 759px;
  }
  .h-\[830px\] {
    height: 830px;
  }
  .h-\[867px\] {
    height: 867px;
  }
  .h-\[calc\(\(\(var\(--viewportWidth\)-30px\)\*\.3-60px-\(var\(--viewportWidth\)-30px\)\*\.05\*\(\(var\(--viewportWidth\)-30px\)\*\.3-60px\)\/\(\(var\(--viewportWidth\)-30px\)\*1\.05-181px\)\)\*163\.69\/352\.47\)\] {
    height: calc(((var(--viewportWidth) - 30px) * .3 - 60px - (var(--viewportWidth) - 30px) * .05 * ((var(--viewportWidth) - 30px) * .3 - 60px) / ((var(--viewportWidth) - 30px) * 1.05 - 181px)) * 163.69 / 352.47);
  }
  .h-\[calc\(\(100vw-40px\)\*2\/3\)\] {
    height: calc((100vw - 40px) * 2 / 3);
  }
  .h-\[calc\(min\(100cqw\,647px\)\*611\/647\)\] {
    height: calc(min(100cqw, 647px) * 611 / 647);
  }
  .h-auto {
    height: auto;
  }
  .h-full {
    height: 100%;
  }
  .h-max {
    height: max-content;
  }
  .max-h-\[80vh\] {
    max-height: 80vh;
  }
  .max-h-full {
    max-height: 100%;
  }
  .min-h-16 {
    min-height: calc(var(--spacing, 0.25rem) * 16);
  }
  .min-h-\[50vh\] {
    min-height: 50vh;
  }
  .min-h-\[85vh\] {
    min-height: 85vh;
  }
  .min-h-\[400px\] {
    min-height: 400px;
  }
  .min-h-screen {
    min-height: 100vh;
  }
  .w-1\/2 {
    width: calc(1 / 2 * 100%);
  }
  .w-4 {
    width: calc(var(--spacing, 0.25rem) * 4);
  }
  .w-5 {
    width: calc(var(--spacing, 0.25rem) * 5);
  }
  .w-6 {
    width: calc(var(--spacing, 0.25rem) * 6);
  }
  .w-8 {
    width: calc(var(--spacing, 0.25rem) * 8);
  }
  .w-9 {
    width: calc(var(--spacing, 0.25rem) * 9);
  }
  .w-10 {
    width: calc(var(--spacing, 0.25rem) * 10);
  }
  .w-12 {
    width: calc(var(--spacing, 0.25rem) * 12);
  }
  .w-14 {
    width: calc(var(--spacing, 0.25rem) * 14);
  }
  .w-16 {
    width: calc(var(--spacing, 0.25rem) * 16);
  }
  .w-20 {
    width: calc(var(--spacing, 0.25rem) * 20);
  }
  .w-24 {
    width: calc(var(--spacing, 0.25rem) * 24);
  }
  .w-28 {
    width: calc(var(--spacing, 0.25rem) * 28);
  }
  .w-32 {
    width: calc(var(--spacing, 0.25rem) * 32);
  }
  .w-36 {
    width: calc(var(--spacing, 0.25rem) * 36);
  }
  .w-40 {
    width: calc(var(--spacing, 0.25rem) * 40);
  }
  .w-44 {
    width: calc(var(--spacing, 0.25rem) * 44);
  }
  .w-48 {
    width: calc(var(--spacing, 0.25rem) * 48);
  }
  .w-56 {
    width: calc(var(--spacing, 0.25rem) * 56);
  }
  .w-64 {
    width: calc(var(--spacing, 0.25rem) * 64);
  }
  .w-72 {
    width: calc(var(--spacing, 0.25rem) * 72);
  }
  .w-80 {
    width: calc(var(--spacing, 0.25rem) * 80);
  }
  .w-\[24px\] {
    width: 24px;
  }
  .w-\[24rem\] {
    width: 24rem;
  }
  .w-\[32px\] {
    width: 32px;
  }
  .w-\[35px\] {
    width: 35px;
  }
  .w-\[36px\] {
    width: 36px;
  }
  .w-\[38px\] {
    width: 38px;
  }
  .w-\[40em\] {
    width: 40em;
  }
  .w-\[40px\] {
    width: 40px;
  }
  .w-\[46px\] {
    width: 46px;
  }
  .w-\[50px\] {
    width: 50px;
  }
  .w-\[55px\] {
    width: 55px;
  }
  .w-\[56px\] {
    width: 56px;
  }
  .w-\[57px\] {
    width: 57px;
  }
  .w-\[65px\] {
    width: 65px;
  }
  .w-\[67\.3\%\] {
    width: 67.3%;
  }
  .w-\[70px\] {
    width: 70px;
  }
  .w-\[76px\] {
    width: 76px;
  }
  .w-\[80\%\] {
    width: 80%;
  }
  .w-\[80px\] {
    width: 80px;
  }
  .w-\[85px\] {
    width: 85px;
  }
  .w-\[86px\] {
    width: 86px;
  }
  .w-\[90px\] {
    width: 90px;
  }
  .w-\[96px\] {
    width: 96px;
  }
  .w-\[100px\] {
    width: 100px;
  }
  .w-\[100vw\] {
    width: 100vw;
  }
  .w-\[102px\] {
    width: 102px;
  }
  .w-\[105px\] {
    width: 105px;
  }
  .w-\[106px\] {
    width: 106px;
  }
  .w-\[110px\] {
    width: 110px;
  }
  .w-\[112px\] {
    width: 112px;
  }
  .w-\[113px\] {
    width: 113px;
  }
  .w-\[120px\] {
    width: 120px;
  }
  .w-\[122px\] {
    width: 122px;
  }
  .w-\[125px\] {
    width: 125px;
  }
  .w-\[127px\] {
    width: 127px;
  }
  .w-\[128px\] {
    width: 128px;
  }
  .w-\[132px\] {
    width: 132px;
  }
  .w-\[136px\] {
    width: 136px;
  }
  .w-\[144px\] {
    width: 144px;
  }
  .w-\[145px\] {
    width: 145px;
  }
  .w-\[147px\] {
    width: 147px;
  }
  .w-\[150px\] {
    width: 150px;
  }
  .w-\[156px\] {
    width: 156px;
  }
  .w-\[160px\] {
    width: 160px;
  }
  .w-\[168px\] {
    width: 168px;
  }
  .w-\[170px\] {
    width: 170px;
  }
  .w-\[172px\] {
    width: 172px;
  }
  .w-\[174px\] {
    width: 174px;
  }
  .w-\[180px\] {
    width: 180px;
  }
  .w-\[184px\] {
    width: 184px;
  }
  .w-\[190px\] {
    width: 190px;
  }
  .w-\[200px\] {
    width: 200px;
  }
  .w-\[219px\] {
    width: 219px;
  }
  .w-\[234px\] {
    width: 234px;
  }
  .w-\[240px\] {
    width: 240px;
  }
  .w-\[263px\] {
    width: 263px;
  }
  .w-\[280px\] {
    width: 280px;
  }
  .w-\[288px\] {
    width: 288px;
  }
  .w-\[294px\] {
    width: 294px;
  }
  .w-\[296px\] {
    width: 296px;
  }
  .w-\[320px\] {
    width: 320px;
  }
  .w-\[325px\] {
    width: 325px;
  }
  .w-\[513px\] {
    width: 513px;
  }
  .w-\[549px\] {
    width: 549px;
  }
  .w-\[560px\] {
    width: 560px;
  }
  .w-\[814px\] {
    width: 814px;
  }
  .w-\[1024px\] {
    width: 1024px;
  }
  .w-\[calc\(\(100cqw-40px\)\/3\)\] {
    width: calc((100cqw - 40px) / 3);
  }
  .w-\[var\(--viewportWidth\)\] {
    width: var(--viewportWidth);
  }
  .w-auto {
    width: auto;
  }
  .w-fit {
    width: fit-content;
  }
  .w-full {
    width: 100%;
  }
  .w-screen {
    width: 100vw;
  }
  .max-w-7xl {
    max-width: var(--container-7xl, 80rem);
  }
  .max-w-\[9\.375rem\] {
    max-width: 9.375rem;
  }
  .max-w-\[647px\] {
    max-width: 647px;
  }
  .max-w-full {
    max-width: 100%;
  }
  .flex-1 {
    flex: 1;
  }
  .shrink-0 {
    flex-shrink: 0;
  }
  .grow {
    flex-grow: 1;
  }
  .transform {
    transform: var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,);
  }
  .cursor-pointer {
    cursor: pointer;
  }
  .resize {
    resize: both;
  }
  .grid-cols-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .flex-col {
    flex-direction: column;
  }
  .flex-wrap {
    flex-wrap: wrap;
  }
  .items-center {
    align-items: center;
  }
  .justify-between {
    justify-content: space-between;
  }
  .justify-center {
    justify-content: center;
  }
  .gap-1 {
    gap: var(--spacing, 0.25rem);
  }
  .gap-2 {
    gap: calc(var(--spacing, 0.25rem) * 2);
  }
  .gap-4 {
    gap: calc(var(--spacing, 0.25rem) * 4);
  }
  :where(.divide-y > :not(:last-child)) {
    --tw-divide-y-reverse: 0;
    border-bottom-style: var(--tw-border-style);
    border-top-style: var(--tw-border-style);
    border-top-width: calc(1px * var(--tw-divide-y-reverse));
    border-bottom-width: calc(1px * calc(1 - var(--tw-divide-y-reverse)));
  }
  .overflow-auto {
    overflow: auto;
  }
  .overflow-hidden {
    overflow: hidden;
  }
  .overflow-y-scroll {
    overflow-y: scroll;
  }
  .rounded {
    border-radius: 0.25rem;
  }
  .rounded-full {
    border-radius: calc(infinity * 1px);
  }
  .rounded-lg {
    border-radius: var(--radius-lg, 0.5rem);
  }
  .rounded-md {
    border-radius: var(--radius-md, 0.375rem);
  }
  .rounded-sm {
    border-radius: var(--radius-sm, 0.25rem);
  }
  .border {
    border-style: var(--tw-border-style);
    border-width: 1px;
  }
  .border-2 {
    border-style: var(--tw-border-style);
    border-width: 2px;
  }
  .border-b {
    border-bottom-style: var(--tw-border-style);
    border-bottom-width: 1px;
  }
  .border-transparent {
    border-color: transparent;
  }
  .bg-black\/40 {
    background-color: color-mix(in srgb, #000 40%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix(in oklab, var(--color-black, #000) 40%, transparent);
    }
  }
  .bg-custom-color1 {
    background-color: var(--color-custom-color1);
  }
  .bg-slate-800 {
    background-color: var(--color-slate-800, oklch(27.9% 0.041 260.031));
  }
  .bg-transparent {
    background-color: transparent;
  }
  .fill-current {
    fill: currentcolor;
  }
  .p-1 {
    padding: var(--spacing, 0.25rem);
  }
  .p-4 {
    padding: calc(var(--spacing, 0.25rem) * 4);
  }
  .px-1 {
    padding-inline: var(--spacing, 0.25rem);
  }
  .px-2 {
    padding-inline: calc(var(--spacing, 0.25rem) * 2);
  }
  .px-4 {
    padding-inline: calc(var(--spacing, 0.25rem) * 4);
  }
  .px-6 {
    padding-inline: calc(var(--spacing, 0.25rem) * 6);
  }
  .py-2 {
    padding-block: calc(var(--spacing, 0.25rem) * 2);
  }
  .py-3 {
    padding-block: calc(var(--spacing, 0.25rem) * 3);
  }
  .py-4 {
    padding-block: calc(var(--spacing, 0.25rem) * 4);
  }
  .pe-1 {
    padding-inline-end: var(--spacing, 0.25rem);
  }
  .pe-3 {
    padding-inline-end: calc(var(--spacing, 0.25rem) * 3);
  }
  .text-center {
    text-align: center;
  }
  .text-sm {
    font-size: var(--text-sm, 0.875rem);
    line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
  }
  .text-xs {
    font-size: var(--text-xs, 0.75rem);
    line-height: var(--tw-leading, var(--text-xs--line-height, calc(1 / 0.75)));
  }
  .font-normal {
    --tw-font-weight: var(--font-weight-normal, 400);
    font-weight: var(--font-weight-normal, 400);
  }
  .text-ellipsis {
    text-overflow: ellipsis;
  }
  .whitespace-nowrap {
    white-space: nowrap;
  }
  .text-red-700 {
    color: var(--color-red-700, oklch(50.5% 0.213 27.518));
  }
  .text-white {
    color: var(--color-white, #fff);
  }
  .uppercase {
    text-transform: uppercase;
  }
  .italic {
    font-style: italic;
  }
  .ordinal {
    --tw-ordinal: ordinal;
    font-variant-numeric: var(--tw-ordinal,) var(--tw-slashed-zero,) var(--tw-numeric-figure,) var(--tw-numeric-spacing,) var(--tw-numeric-fraction,);
  }
  .underline {
    text-decoration-line: underline;
  }
  .opacity-0 {
    opacity: 0%;
  }
  .opacity-90 {
    opacity: 90%;
  }
  .shadow-\[0px_2px_10px_2px_rgba\(0\,0\,0\,0\.2\)\] {
    --tw-shadow: 0px 2px 10px 2px var(--tw-shadow-color, rgba(0,0,0,0.2));
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  .shadow-md {
    --tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 2px 4px -2px 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;
  }
  .blur {
    --tw-blur: blur(8px);
    filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);
  }
  .filter {
    filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);
  }
  .transition {
    transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, content-visibility, overlay, pointer-events;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(0.4, 0, 0.2, 1)));
    transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
  }
  .transition-all {
    transition-property: all;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(0.4, 0, 0.2, 1)));
    transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
  }
  .duration-200 {
    --tw-duration: 200ms;
    transition-duration: 200ms;
  }
  .duration-300 {
    --tw-duration: 300ms;
    transition-duration: 300ms;
  }
  .select-none {
    -webkit-user-select: none;
    user-select: none;
  }
  .pause {
    animation-play-state: paused;
  }
  @media (hover: hover) {
    .group-hover\:visible:is(:where(.group):hover *) {
      visibility: visible;
    }
    .group-hover\:top-10:is(:where(.group):hover *) {
      top: calc(var(--spacing, 0.25rem) * 10);
    }
    .group-hover\:opacity-100:is(:where(.group):hover *) {
      opacity: 100%;
    }
    .group-hover\/more\:rotate-\[360deg\]:is(:where(.group\/more):hover *) {
      rotate: 360deg;
    }
  }
  .after\:absolute::after {
    content: var(--tw-content);
    position: absolute;
  }
  .after\:start-0::after {
    content: var(--tw-content);
    inset-inline-start: calc(var(--spacing, 0.25rem) * 0);
  }
  .after\:end-0::after {
    content: var(--tw-content);
    inset-inline-end: calc(var(--spacing, 0.25rem) * 0);
  }
  .after\:bottom-\[1px\]::after {
    content: var(--tw-content);
    bottom: 1px;
  }
  .after\:mx-auto::after {
    content: var(--tw-content);
    margin-inline: auto;
  }
  .after\:h-0\.5::after {
    content: var(--tw-content);
    height: calc(var(--spacing, 0.25rem) * 0.5);
  }
  .after\:w-0::after {
    content: var(--tw-content);
    width: 0px;
  }
  .after\:bg-custom-color1\/60::after {
    content: var(--tw-content);
    background-color: var(--color-custom-color1);
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix(in oklab, var(--color-custom-color1) 60%, transparent);
    }
  }
  .after\:transition-all::after {
    content: var(--tw-content);
    transition-property: all;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(0.4, 0, 0.2, 1)));
    transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
  }
  .after\:duration-700::after {
    content: var(--tw-content);
    --tw-duration: 700ms;
    transition-duration: 700ms;
  }
  .after\:content-\[\'\'\]::after {
    --tw-content: '';
    content: var(--tw-content);
  }
  @media (hover: hover) {
    .hover\:scale-110:hover {
      --tw-scale-x: 110%;
      --tw-scale-y: 110%;
      --tw-scale-z: 110%;
      scale: var(--tw-scale-x) var(--tw-scale-y);
    }
    .hover\:scale-125:hover {
      --tw-scale-x: 125%;
      --tw-scale-y: 125%;
      --tw-scale-z: 125%;
      scale: var(--tw-scale-x) var(--tw-scale-y);
    }
    .hover\:after\:w-full:hover::after {
      content: var(--tw-content);
      width: 100%;
    }
  }
  .focus\:outline-none:focus {
    --tw-outline-style: none;
    outline-style: none;
  }
  @media (width >= 36rem) {
    .bootstrapSm\:h-\[307px\] {
      height: 307px;
    }
    .bootstrapSm\:h-\[333\.333px\] {
      height: 333.333px;
    }
    .bootstrapSm\:h-\[344px\] {
      height: 344px;
    }
    .bootstrapSm\:h-\[516px\] {
      height: 516px;
    }
    .bootstrapSm\:w-\[461px\] {
      width: 461px;
    }
    .bootstrapSm\:w-\[500px\] {
      width: 500px;
    }
    .bootstrapSm\:w-\[516px\] {
      width: 516px;
    }
  }
  @media (width >= 40rem) {
    .sm\:block {
      display: block;
    }
    .sm\:inline {
      display: inline;
    }
    .sm\:h-96 {
      height: calc(var(--spacing, 0.25rem) * 96);
    }
    .sm\:h-\[41px\] {
      height: 41px;
    }
    .sm\:h-\[44px\] {
      height: 44px;
    }
    .sm\:h-\[48px\] {
      height: 48px;
    }
    .sm\:h-\[57px\] {
      height: 57px;
    }
    .sm\:h-\[127px\] {
      height: 127px;
    }
    .sm\:h-\[136px\] {
      height: 136px;
    }
    .sm\:h-\[140px\] {
      height: 140px;
    }
    .sm\:h-\[147px\] {
      height: 147px;
    }
    .sm\:h-\[152px\] {
      height: 152px;
    }
    .sm\:h-\[160px\] {
      height: 160px;
    }
    .sm\:h-\[163px\] {
      height: 163px;
    }
    .sm\:h-\[170px\] {
      height: 170px;
    }
    .sm\:h-\[172px\] {
      height: 172px;
    }
    .sm\:h-\[175px\] {
      height: 175px;
    }
    .sm\:h-\[181px\] {
      height: 181px;
    }
    .sm\:h-\[185px\] {
      height: 185px;
    }
    .sm\:h-\[187px\] {
      height: 187px;
    }
    .sm\:h-\[188px\] {
      height: 188px;
    }
    .sm\:h-\[192px\] {
      height: 192px;
    }
    .sm\:h-\[193px\] {
      height: 193px;
    }
    .sm\:h-\[197px\] {
      height: 197px;
    }
    .sm\:h-\[203px\] {
      height: 203px;
    }
    .sm\:h-\[205px\] {
      height: 205px;
    }
    .sm\:h-\[208px\] {
      height: 208px;
    }
    .sm\:h-\[209px\] {
      height: 209px;
    }
    .sm\:h-\[213px\] {
      height: 213px;
    }
    .sm\:h-\[220px\] {
      height: 220px;
    }
    .sm\:h-\[223px\] {
      height: 223px;
    }
    .sm\:h-\[230px\] {
      height: 230px;
    }
    .sm\:h-\[235px\] {
      height: 235px;
    }
    .sm\:h-\[244px\] {
      height: 244px;
    }
    .sm\:h-\[256px\] {
      height: 256px;
    }
    .sm\:h-\[270px\] {
      height: 270px;
    }
    .sm\:h-\[276px\] {
      height: 276px;
    }
    .sm\:h-\[280px\] {
      height: 280px;
    }
    .sm\:h-\[290px\] {
      height: 290px;
    }
    .sm\:h-\[300px\] {
      height: 300px;
    }
    .sm\:h-\[307px\] {
      height: 307px;
    }
    .sm\:h-\[308px\] {
      height: 308px;
    }
    .sm\:h-\[312px\] {
      height: 312px;
    }
    .sm\:h-\[320px\] {
      height: 320px;
    }
    .sm\:h-\[323px\] {
      height: 323px;
    }
    .sm\:h-\[327px\] {
      height: 327px;
    }
    .sm\:h-\[333px\] {
      height: 333px;
    }
    .sm\:h-\[340px\] {
      height: 340px;
    }
    .sm\:h-\[342px\] {
      height: 342px;
    }
    .sm\:h-\[343px\] {
      height: 343px;
    }
    .sm\:h-\[344px\] {
      height: 344px;
    }
    .sm\:h-\[350px\] {
      height: 350px;
    }
    .sm\:h-\[360px\] {
      height: 360px;
    }
    .sm\:h-\[367px\] {
      height: 367px;
    }
    .sm\:h-\[373px\] {
      height: 373px;
    }
    .sm\:h-\[375px\] {
      height: 375px;
    }
    .sm\:h-\[383px\] {
      height: 383px;
    }
    .sm\:h-\[384px\] {
      height: 384px;
    }
    .sm\:h-\[387px\] {
      height: 387px;
    }
    .sm\:h-\[394px\] {
      height: 394px;
    }
    .sm\:h-\[395px\] {
      height: 395px;
    }
    .sm\:h-\[396px\] {
      height: 396px;
    }
    .sm\:h-\[400px\] {
      height: 400px;
    }
    .sm\:h-\[407px\] {
      height: 407px;
    }
    .sm\:h-\[411px\] {
      height: 411px;
    }
    .sm\:h-\[427px\] {
      height: 427px;
    }
    .sm\:h-\[428px\] {
      height: 428px;
    }
    .sm\:h-\[432px\] {
      height: 432px;
    }
    .sm\:h-\[444px\] {
      height: 444px;
    }
    .sm\:h-\[457px\] {
      height: 457px;
    }
    .sm\:h-\[460px\] {
      height: 460px;
    }
    .sm\:h-\[480px\] {
      height: 480px;
    }
    .sm\:h-\[500px\] {
      height: 500px;
    }
    .sm\:h-\[516px\] {
      height: 516px;
    }
    .sm\:h-\[540px\] {
      height: 540px;
    }
    .sm\:h-\[640px\] {
      height: 640px;
    }
    .sm\:h-full {
      height: 100%;
    }
    .sm\:w-10 {
      width: calc(var(--spacing, 0.25rem) * 10);
    }
    .sm\:w-80 {
      width: calc(var(--spacing, 0.25rem) * 80);
    }
    .sm\:w-\[28rem\] {
      width: 28rem;
    }
    .sm\:w-\[55px\] {
      width: 55px;
    }
    .sm\:w-\[85px\] {
      width: 85px;
    }
    .sm\:w-\[128px\] {
      width: 128px;
    }
    .sm\:w-\[136px\] {
      width: 136px;
    }
    .sm\:w-\[150px\] {
      width: 150px;
    }
    .sm\:w-\[160px\] {
      width: 160px;
    }
    .sm\:w-\[190px\] {
      width: 190px;
    }
    .sm\:w-\[203px\] {
      width: 203px;
    }
    .sm\:w-\[208px\] {
      width: 208px;
    }
    .sm\:w-\[210px\] {
      width: 210px;
    }
    .sm\:w-\[228px\] {
      width: 228px;
    }
    .sm\:w-\[240px\] {
      width: 240px;
    }
    .sm\:w-\[245px\] {
      width: 245px;
    }
    .sm\:w-\[246px\] {
      width: 246px;
    }
    .sm\:w-\[255px\] {
      width: 255px;
    }
    .sm\:w-\[256px\] {
      width: 256px;
    }
    .sm\:w-\[258px\] {
      width: 258px;
    }
    .sm\:w-\[263px\] {
      width: 263px;
    }
    .sm\:w-\[272px\] {
      width: 272px;
    }
    .sm\:w-\[280px\] {
      width: 280px;
    }
    .sm\:w-\[282px\] {
      width: 282px;
    }
    .sm\:w-\[288px\] {
      width: 288px;
    }
    .sm\:w-\[290px\] {
      width: 290px;
    }
    .sm\:w-\[296px\] {
      width: 296px;
    }
    .sm\:w-\[300px\] {
      width: 300px;
    }
    .sm\:w-\[308px\] {
      width: 308px;
    }
    .sm\:w-\[312px\] {
      width: 312px;
    }
    .sm\:w-\[314px\] {
      width: 314px;
    }
    .sm\:w-\[320px\] {
      width: 320px;
    }
    .sm\:w-\[330px\] {
      width: 330px;
    }
    .sm\:w-\[331px\] {
      width: 331px;
    }
    .sm\:w-\[334px\] {
      width: 334px;
    }
    .sm\:w-\[352px\] {
      width: 352px;
    }
    .sm\:w-\[360px\] {
      width: 360px;
    }
    .sm\:w-\[366px\] {
      width: 366px;
    }
    .sm\:w-\[368px\] {
      width: 368px;
    }
    .sm\:w-\[384px\] {
      width: 384px;
    }
    .sm\:w-\[400px\] {
      width: 400px;
    }
    .sm\:w-\[460px\] {
      width: 460px;
    }
    .sm\:w-\[480px\] {
      width: 480px;
    }
    .sm\:w-\[484px\] {
      width: 484px;
    }
    .sm\:w-\[490px\] {
      width: 490px;
    }
    .sm\:w-\[510px\] {
      width: 510px;
    }
    .sm\:w-\[514px\] {
      width: 514px;
    }
    .sm\:w-\[516px\] {
      width: 516px;
    }
    .sm\:w-\[540px\] {
      width: 540px;
    }
    .sm\:w-\[550px\] {
      width: 550px;
    }
    .sm\:w-\[560px\] {
      width: 560px;
    }
    .sm\:w-\[563px\] {
      width: 563px;
    }
    .sm\:w-\[575px\] {
      width: 575px;
    }
    .sm\:w-\[576px\] {
      width: 576px;
    }
    .sm\:w-\[580px\] {
      width: 580px;
    }
    .sm\:w-\[592px\] {
      width: 592px;
    }
    .sm\:w-\[608px\] {
      width: 608px;
    }
    .sm\:w-\[610px\] {
      width: 610px;
    }
    .sm\:w-\[616px\] {
      width: 616px;
    }
    .sm\:w-\[640px\] {
      width: 640px;
    }
    .sm\:p-2 {
      padding: calc(var(--spacing, 0.25rem) * 2);
    }
    .sm\:text-base {
      font-size: var(--text-base, 1rem);
      line-height: var(--tw-leading, var(--text-base--line-height, calc(1.5 / 1)));
    }
  }
  @media (width >= 43.75rem) {
    .referenceReading\:h-\[100cqw\] {
      height: 100cqw;
    }
    .referenceReading\:h-\[224px\] {
      height: 224px;
    }
    .referenceReading\:h-full {
      height: 100%;
    }
    .referenceReading\:w-\[100cqw\] {
      width: 100cqw;
    }
  }
  @media (width >= 48rem) {
    .md\:static {
      position: static;
    }
    .md\:order-0 {
      order: 0;
    }
    .md\:order-1 {
      order: 1;
    }
    .md\:order-2 {
      order: 2;
    }
    .md\:\!ms-auto {
      margin-inline-start: auto !important;
    }
    .md\:block {
      display: block;
    }
    .md\:flex {
      display: flex;
    }
    .md\:hidden {
      display: none;
    }
    .md\:h-14 {
      height: calc(var(--spacing, 0.25rem) * 14);
    }
    .md\:h-16 {
      height: calc(var(--spacing, 0.25rem) * 16);
    }
    .md\:h-24 {
      height: calc(var(--spacing, 0.25rem) * 24);
    }
    .md\:h-28 {
      height: calc(var(--spacing, 0.25rem) * 28);
    }
    .md\:h-32 {
      height: calc(var(--spacing, 0.25rem) * 32);
    }
    .md\:h-80 {
      height: calc(var(--spacing, 0.25rem) * 80);
    }
    .md\:h-\[28rem\] {
      height: 28rem;
    }
    .md\:h-\[44px\] {
      height: 44px;
    }
    .md\:h-\[48px\] {
      height: 48px;
    }
    .md\:h-\[50px\] {
      height: 50px;
    }
    .md\:h-\[53px\] {
      height: 53px;
    }
    .md\:h-\[64px\] {
      height: 64px;
    }
    .md\:h-\[67px\] {
      height: 67px;
    }
    .md\:h-\[76px\] {
      height: 76px;
    }
    .md\:h-\[77px\] {
      height: 77px;
    }
    .md\:h-\[80px\] {
      height: 80px;
    }
    .md\:h-\[100px\] {
      height: 100px;
    }
    .md\:h-\[108px\] {
      height: 108px;
    }
    .md\:h-\[122px\] {
      height: 122px;
    }
    .md\:h-\[124px\] {
      height: 124px;
    }
    .md\:h-\[128px\] {
      height: 128px;
    }
    .md\:h-\[139px\] {
      height: 139px;
    }
    .md\:h-\[140px\] {
      height: 140px;
    }
    .md\:h-\[142px\] {
      height: 142px;
    }
    .md\:h-\[146\.667px\] {
      height: 146.667px;
    }
    .md\:h-\[149px\] {
      height: 149px;
    }
    .md\:h-\[151px\] {
      height: 151px;
    }
    .md\:h-\[152px\] {
      height: 152px;
    }
    .md\:h-\[154px\] {
      height: 154px;
    }
    .md\:h-\[160px\] {
      height: 160px;
    }
    .md\:h-\[162px\] {
      height: 162px;
    }
    .md\:h-\[164px\] {
      height: 164px;
    }
    .md\:h-\[171px\] {
      height: 171px;
    }
    .md\:h-\[172px\] {
      height: 172px;
    }
    .md\:h-\[180px\] {
      height: 180px;
    }
    .md\:h-\[183px\] {
      height: 183px;
    }
    .md\:h-\[187px\] {
      height: 187px;
    }
    .md\:h-\[188px\] {
      height: 188px;
    }
    .md\:h-\[192px\] {
      height: 192px;
    }
    .md\:h-\[196px\] {
      height: 196px;
    }
    .md\:h-\[198px\] {
      height: 198px;
    }
    .md\:h-\[204px\] {
      height: 204px;
    }
    .md\:h-\[207px\] {
      height: 207px;
    }
    .md\:h-\[210px\] {
      height: 210px;
    }
    .md\:h-\[212px\] {
      height: 212px;
    }
    .md\:h-\[213px\] {
      height: 213px;
    }
    .md\:h-\[218px\] {
      height: 218px;
    }
    .md\:h-\[220px\] {
      height: 220px;
    }
    .md\:h-\[224px\] {
      height: 224px;
    }
    .md\:h-\[230px\] {
      height: 230px;
    }
    .md\:h-\[232px\] {
      height: 232px;
    }
    .md\:h-\[236px\] {
      height: 236px;
    }
    .md\:h-\[240px\] {
      height: 240px;
    }
    .md\:h-\[246px\] {
      height: 246px;
    }
    .md\:h-\[248px\] {
      height: 248px;
    }
    .md\:h-\[251px\] {
      height: 251px;
    }
    .md\:h-\[252px\] {
      height: 252px;
    }
    .md\:h-\[256px\] {
      height: 256px;
    }
    .md\:h-\[270px\] {
      height: 270px;
    }
    .md\:h-\[279px\] {
      height: 279px;
    }
    .md\:h-\[280px\] {
      height: 280px;
    }
    .md\:h-\[300px\] {
      height: 300px;
    }
    .md\:h-\[342px\] {
      height: 342px;
    }
    .md\:h-\[349px\] {
      height: 349px;
    }
    .md\:h-\[350px\] {
      height: 350px;
    }
    .md\:h-\[372px\] {
      height: 372px;
    }
    .md\:h-\[389px\] {
      height: 389px;
    }
    .md\:h-\[390px\] {
      height: 390px;
    }
    .md\:h-\[392px\] {
      height: 392px;
    }
    .md\:h-\[400px\] {
      height: 400px;
    }
    .md\:h-\[404px\] {
      height: 404px;
    }
    .md\:h-\[405px\] {
      height: 405px;
    }
    .md\:h-\[414px\] {
      height: 414px;
    }
    .md\:h-\[420px\] {
      height: 420px;
    }
    .md\:h-\[427px\] {
      height: 427px;
    }
    .md\:h-\[439px\] {
      height: 439px;
    }
    .md\:h-\[440px\] {
      height: 440px;
    }
    .md\:h-\[445px\] {
      height: 445px;
    }
    .md\:h-\[447px\] {
      height: 447px;
    }
    .md\:h-\[450px\] {
      height: 450px;
    }
    .md\:h-\[452px\] {
      height: 452px;
    }
    .md\:h-\[459px\] {
      height: 459px;
    }
    .md\:h-\[460px\] {
      height: 460px;
    }
    .md\:h-\[464px\] {
      height: 464px;
    }
    .md\:h-\[472px\] {
      height: 472px;
    }
    .md\:h-\[477px\] {
      height: 477px;
    }
    .md\:h-\[480px\] {
      height: 480px;
    }
    .md\:h-\[492px\] {
      height: 492px;
    }
    .md\:h-\[500px\] {
      height: 500px;
    }
    .md\:h-\[512px\] {
      height: 512px;
    }
    .md\:h-\[513px\] {
      height: 513px;
    }
    .md\:h-\[522px\] {
      height: 522px;
    }
    .md\:h-\[528px\] {
      height: 528px;
    }
    .md\:h-\[540px\] {
      height: 540px;
    }
    .md\:h-\[576px\] {
      height: 576px;
    }
    .md\:h-\[640px\] {
      height: 640px;
    }
    .md\:h-\[696px\] {
      height: 696px;
    }
    .md\:h-\[768px\] {
      height: 768px;
    }
    .md\:h-full {
      height: 100%;
    }
    .md\:w-1\/2 {
      width: calc(1 / 2 * 100%);
    }
    .md\:w-10 {
      width: calc(var(--spacing, 0.25rem) * 10);
    }
    .md\:w-28 {
      width: calc(var(--spacing, 0.25rem) * 28);
    }
    .md\:w-32 {
      width: calc(var(--spacing, 0.25rem) * 32);
    }
    .md\:w-40 {
      width: calc(var(--spacing, 0.25rem) * 40);
    }
    .md\:w-64 {
      width: calc(var(--spacing, 0.25rem) * 64);
    }
    .md\:w-96 {
      width: calc(var(--spacing, 0.25rem) * 96);
    }
    .md\:w-\[58rem\] {
      width: 58rem;
    }
    .md\:w-\[65px\] {
      width: 65px;
    }
    .md\:w-\[66px\] {
      width: 66px;
    }
    .md\:w-\[80px\] {
      width: 80px;
    }
    .md\:w-\[88px\] {
      width: 88px;
    }
    .md\:w-\[100px\] {
      width: 100px;
    }
    .md\:w-\[115px\] {
      width: 115px;
    }
    .md\:w-\[120px\] {
      width: 120px;
    }
    .md\:w-\[150px\] {
      width: 150px;
    }
    .md\:w-\[156px\] {
      width: 156px;
    }
    .md\:w-\[160px\] {
      width: 160px;
    }
    .md\:w-\[162px\] {
      width: 162px;
    }
    .md\:w-\[180px\] {
      width: 180px;
    }
    .md\:w-\[181px\] {
      width: 181px;
    }
    .md\:w-\[184px\] {
      width: 184px;
    }
    .md\:w-\[186px\] {
      width: 186px;
    }
    .md\:w-\[192px\] {
      width: 192px;
    }
    .md\:w-\[208px\] {
      width: 208px;
    }
    .md\:w-\[210px\] {
      width: 210px;
    }
    .md\:w-\[213px\] {
      width: 213px;
    }
    .md\:w-\[220px\] {
      width: 220px;
    }
    .md\:w-\[224px\] {
      width: 224px;
    }
    .md\:w-\[226px\] {
      width: 226px;
    }
    .md\:w-\[228px\] {
      width: 228px;
    }
    .md\:w-\[231px\] {
      width: 231px;
    }
    .md\:w-\[235px\] {
      width: 235px;
    }
    .md\:w-\[240px\] {
      width: 240px;
    }
    .md\:w-\[243px\] {
      width: 243px;
    }
    .md\:w-\[245px\] {
      width: 245px;
    }
    .md\:w-\[246px\] {
      width: 246px;
    }
    .md\:w-\[256px\] {
      width: 256px;
    }
    .md\:w-\[258px\] {
      width: 258px;
    }
    .md\:w-\[264px\] {
      width: 264px;
    }
    .md\:w-\[270px\] {
      width: 270px;
    }
    .md\:w-\[272px\] {
      width: 272px;
    }
    .md\:w-\[274px\] {
      width: 274px;
    }
    .md\:w-\[280px\] {
      width: 280px;
    }
    .md\:w-\[283px\] {
      width: 283px;
    }
    .md\:w-\[288px\] {
      width: 288px;
    }
    .md\:w-\[294px\] {
      width: 294px;
    }
    .md\:w-\[312px\] {
      width: 312px;
    }
    .md\:w-\[315px\] {
      width: 315px;
    }
    .md\:w-\[318px\] {
      width: 318px;
    }
    .md\:w-\[320px\] {
      width: 320px;
    }
    .md\:w-\[327px\] {
      width: 327px;
    }
    .md\:w-\[330px\] {
      width: 330px;
    }
    .md\:w-\[336px\] {
      width: 336px;
    }
    .md\:w-\[345px\] {
      width: 345px;
    }
    .md\:w-\[348px\] {
      width: 348px;
    }
    .md\:w-\[350px\] {
      width: 350px;
    }
    .md\:w-\[353px\] {
      width: 353px;
    }
    .md\:w-\[354px\] {
      width: 354px;
    }
    .md\:w-\[360px\] {
      width: 360px;
    }
    .md\:w-\[369px\] {
      width: 369px;
    }
    .md\:w-\[372px\] {
      width: 372px;
    }
    .md\:w-\[377px\] {
      width: 377px;
    }
    .md\:w-\[378px\] {
      width: 378px;
    }
    .md\:w-\[384px\] {
      width: 384px;
    }
    .md\:w-\[400px\] {
      width: 400px;
    }
    .md\:w-\[420px\] {
      width: 420px;
    }
    .md\:w-\[584px\] {
      width: 584px;
    }
    .md\:w-\[606px\] {
      width: 606px;
    }
    .md\:w-\[608px\] {
      width: 608px;
    }
    .md\:w-\[640px\] {
      width: 640px;
    }
    .md\:w-\[641px\] {
      width: 641px;
    }
    .md\:w-\[658px\] {
      width: 658px;
    }
    .md\:w-\[660px\] {
      width: 660px;
    }
    .md\:w-\[667px\] {
      width: 667px;
    }
    .md\:w-\[670px\] {
      width: 670px;
    }
    .md\:w-\[678px\] {
      width: 678px;
    }
    .md\:w-\[688px\] {
      width: 688px;
    }
    .md\:w-\[690px\] {
      width: 690px;
    }
    .md\:w-\[696px\] {
      width: 696px;
    }
    .md\:w-\[704px\] {
      width: 704px;
    }
    .md\:w-\[708px\] {
      width: 708px;
    }
    .md\:w-\[716px\] {
      width: 716px;
    }
    .md\:w-\[720px\] {
      width: 720px;
    }
    .md\:w-\[736px\] {
      width: 736px;
    }
    .md\:w-\[738px\] {
      width: 738px;
    }
    .md\:w-\[768px\] {
      width: 768px;
    }
    .md\:max-w-\[11\.25rem\] {
      max-width: 11.25rem;
    }
    .md\:justify-start {
      justify-content: flex-start;
    }
  }
  @media (width >= 60rem) {
    .referenceSplitContent\:h-\[28\.125cqw\] {
      height: 28.125cqw;
    }
    .referenceSplitContent\:h-\[420px\] {
      height: 420px;
    }
    .referenceSplitContent\:w-1\/2 {
      width: calc(1 / 2 * 100%);
    }
  }
  @media (width >= 62rem) {
    .bootstrapLg\:h-\[52px\] {
      height: 52px;
    }
    .bootstrapLg\:h-\[161px\] {
      height: 161px;
    }
    .bootstrapLg\:h-\[200px\] {
      height: 200px;
    }
    .bootstrapLg\:h-\[230px\] {
      height: 230px;
    }
    .bootstrapLg\:h-\[296px\] {
      height: 296px;
    }
    .bootstrapLg\:h-\[323px\] {
      height: 323px;
    }
    .bootstrapLg\:h-\[970px\] {
      height: 970px;
    }
    .bootstrapLg\:w-\[78px\] {
      width: 78px;
    }
    .bootstrapLg\:w-\[230px\] {
      width: 230px;
    }
    .bootstrapLg\:w-\[241px\] {
      width: 241px;
    }
    .bootstrapLg\:w-\[296px\] {
      width: 296px;
    }
    .bootstrapLg\:w-\[300px\] {
      width: 300px;
    }
    .bootstrapLg\:w-\[443px\] {
      width: 443px;
    }
    .bootstrapLg\:w-\[480px\] {
      width: 480px;
    }
    .bootstrapLg\:w-\[484px\] {
      width: 484px;
    }
  }
  @media (width >= 64rem) {
    .lg\:flex {
      display: flex;
    }
    .lg\:h-12 {
      height: calc(var(--spacing, 0.25rem) * 12);
    }
    .lg\:h-32 {
      height: calc(var(--spacing, 0.25rem) * 32);
    }
    .lg\:h-\[10\.625rem\] {
      height: 10.625rem;
    }
    .lg\:h-\[34rem\] {
      height: 34rem;
    }
    .lg\:h-\[44px\] {
      height: 44px;
    }
    .lg\:h-\[45rem\] {
      height: 45rem;
    }
    .lg\:h-\[48px\] {
      height: 48px;
    }
    .lg\:h-\[66px\] {
      height: 66px;
    }
    .lg\:h-\[82px\] {
      height: 82px;
    }
    .lg\:h-\[93px\] {
      height: 93px;
    }
    .lg\:h-\[97px\] {
      height: 97px;
    }
    .lg\:h-\[102px\] {
      height: 102px;
    }
    .lg\:h-\[103px\] {
      height: 103px;
    }
    .lg\:h-\[105px\] {
      height: 105px;
    }
    .lg\:h-\[107px\] {
      height: 107px;
    }
    .lg\:h-\[108px\] {
      height: 108px;
    }
    .lg\:h-\[109px\] {
      height: 109px;
    }
    .lg\:h-\[114px\] {
      height: 114px;
    }
    .lg\:h-\[126px\] {
      height: 126px;
    }
    .lg\:h-\[128px\] {
      height: 128px;
    }
    .lg\:h-\[140px\] {
      height: 140px;
    }
    .lg\:h-\[144px\] {
      height: 144px;
    }
    .lg\:h-\[147px\] {
      height: 147px;
    }
    .lg\:h-\[148px\] {
      height: 148px;
    }
    .lg\:h-\[151px\] {
      height: 151px;
    }
    .lg\:h-\[159px\] {
      height: 159px;
    }
    .lg\:h-\[160px\] {
      height: 160px;
    }
    .lg\:h-\[163px\] {
      height: 163px;
    }
    .lg\:h-\[168px\] {
      height: 168px;
    }
    .lg\:h-\[171px\] {
      height: 171px;
    }
    .lg\:h-\[172px\] {
      height: 172px;
    }
    .lg\:h-\[175px\] {
      height: 175px;
    }
    .lg\:h-\[176px\] {
      height: 176px;
    }
    .lg\:h-\[183px\] {
      height: 183px;
    }
    .lg\:h-\[185px\] {
      height: 185px;
    }
    .lg\:h-\[187px\] {
      height: 187px;
    }
    .lg\:h-\[189px\] {
      height: 189px;
    }
    .lg\:h-\[193px\] {
      height: 193px;
    }
    .lg\:h-\[196px\] {
      height: 196px;
    }
    .lg\:h-\[197px\] {
      height: 197px;
    }
    .lg\:h-\[199px\] {
      height: 199px;
    }
    .lg\:h-\[203px\] {
      height: 203px;
    }
    .lg\:h-\[206px\] {
      height: 206px;
    }
    .lg\:h-\[208px\] {
      height: 208px;
    }
    .lg\:h-\[210px\] {
      height: 210px;
    }
    .lg\:h-\[211px\] {
      height: 211px;
    }
    .lg\:h-\[217px\] {
      height: 217px;
    }
    .lg\:h-\[219px\] {
      height: 219px;
    }
    .lg\:h-\[220px\] {
      height: 220px;
    }
    .lg\:h-\[221px\] {
      height: 221px;
    }
    .lg\:h-\[222px\] {
      height: 222px;
    }
    .lg\:h-\[228px\] {
      height: 228px;
    }
    .lg\:h-\[230px\] {
      height: 230px;
    }
    .lg\:h-\[238px\] {
      height: 238px;
    }
    .lg\:h-\[244px\] {
      height: 244px;
    }
    .lg\:h-\[246px\] {
      height: 246px;
    }
    .lg\:h-\[247px\] {
      height: 247px;
    }
    .lg\:h-\[255px\] {
      height: 255px;
    }
    .lg\:h-\[262px\] {
      height: 262px;
    }
    .lg\:h-\[270px\] {
      height: 270px;
    }
    .lg\:h-\[272px\] {
      height: 272px;
    }
    .lg\:h-\[280px\] {
      height: 280px;
    }
    .lg\:h-\[284px\] {
      height: 284px;
    }
    .lg\:h-\[286px\] {
      height: 286px;
    }
    .lg\:h-\[297px\] {
      height: 297px;
    }
    .lg\:h-\[300px\] {
      height: 300px;
    }
    .lg\:h-\[304px\] {
      height: 304px;
    }
    .lg\:h-\[314px\] {
      height: 314px;
    }
    .lg\:h-\[321px\] {
      height: 321px;
    }
    .lg\:h-\[325px\] {
      height: 325px;
    }
    .lg\:h-\[331px\] {
      height: 331px;
    }
    .lg\:h-\[333px\] {
      height: 333px;
    }
    .lg\:h-\[334px\] {
      height: 334px;
    }
    .lg\:h-\[336px\] {
      height: 336px;
    }
    .lg\:h-\[337px\] {
      height: 337px;
    }
    .lg\:h-\[341px\] {
      height: 341px;
    }
    .lg\:h-\[348px\] {
      height: 348px;
    }
    .lg\:h-\[350px\] {
      height: 350px;
    }
    .lg\:h-\[360px\] {
      height: 360px;
    }
    .lg\:h-\[375px\] {
      height: 375px;
    }
    .lg\:h-\[376px\] {
      height: 376px;
    }
    .lg\:h-\[400px\] {
      height: 400px;
    }
    .lg\:h-\[402px\] {
      height: 402px;
    }
    .lg\:h-\[414px\] {
      height: 414px;
    }
    .lg\:h-\[464px\] {
      height: 464px;
    }
    .lg\:h-\[465px\] {
      height: 465px;
    }
    .lg\:h-\[468px\] {
      height: 468px;
    }
    .lg\:h-\[480px\] {
      height: 480px;
    }
    .lg\:h-\[500px\] {
      height: 500px;
    }
    .lg\:h-\[512px\] {
      height: 512px;
    }
    .lg\:h-\[520px\] {
      height: 520px;
    }
    .lg\:h-\[533px\] {
      height: 533px;
    }
    .lg\:h-\[549px\] {
      height: 549px;
    }
    .lg\:h-\[552px\] {
      height: 552px;
    }
    .lg\:h-\[558px\] {
      height: 558px;
    }
    .lg\:h-\[563px\] {
      height: 563px;
    }
    .lg\:h-\[607px\] {
      height: 607px;
    }
    .lg\:h-\[609px\] {
      height: 609px;
    }
    .lg\:h-\[620px\] {
      height: 620px;
    }
    .lg\:h-\[640px\] {
      height: 640px;
    }
    .lg\:h-\[643px\] {
      height: 643px;
    }
    .lg\:h-\[648px\] {
      height: 648px;
    }
    .lg\:h-\[651px\] {
      height: 651px;
    }
    .lg\:h-\[663px\] {
      height: 663px;
    }
    .lg\:h-\[683px\] {
      height: 683px;
    }
    .lg\:h-\[723px\] {
      height: 723px;
    }
    .lg\:h-\[1024px\] {
      height: 1024px;
    }
    .lg\:h-full {
      height: 100%;
    }
    .lg\:w-1\/2 {
      width: calc(1 / 2 * 100%);
    }
    .lg\:w-2\/3 {
      width: calc(2 / 3 * 100%);
    }
    .lg\:w-72 {
      width: calc(var(--spacing, 0.25rem) * 72);
    }
    .lg\:w-96 {
      width: calc(var(--spacing, 0.25rem) * 96);
    }
    .lg\:w-\[10\.625rem\] {
      width: 10.625rem;
    }
    .lg\:w-\[45vw\] {
      width: 45vw;
    }
    .lg\:w-\[72rem\] {
      width: 72rem;
    }
    .lg\:w-\[88px\] {
      width: 88px;
    }
    .lg\:w-\[107px\] {
      width: 107px;
    }
    .lg\:w-\[123px\] {
      width: 123px;
    }
    .lg\:w-\[139px\] {
      width: 139px;
    }
    .lg\:w-\[140px\] {
      width: 140px;
    }
    .lg\:w-\[146px\] {
      width: 146px;
    }
    .lg\:w-\[154px\] {
      width: 154px;
    }
    .lg\:w-\[155px\] {
      width: 155px;
    }
    .lg\:w-\[157px\] {
      width: 157px;
    }
    .lg\:w-\[160px\] {
      width: 160px;
    }
    .lg\:w-\[163px\] {
      width: 163px;
    }
    .lg\:w-\[164px\] {
      width: 164px;
    }
    .lg\:w-\[171px\] {
      width: 171px;
    }
    .lg\:w-\[189px\] {
      width: 189px;
    }
    .lg\:w-\[192px\] {
      width: 192px;
    }
    .lg\:w-\[196px\] {
      width: 196px;
    }
    .lg\:w-\[208px\] {
      width: 208px;
    }
    .lg\:w-\[210px\] {
      width: 210px;
    }
    .lg\:w-\[215px\] {
      width: 215px;
    }
    .lg\:w-\[220px\] {
      width: 220px;
    }
    .lg\:w-\[222px\] {
      width: 222px;
    }
    .lg\:w-\[224px\] {
      width: 224px;
    }
    .lg\:w-\[226px\] {
      width: 226px;
    }
    .lg\:w-\[238px\] {
      width: 238px;
    }
    .lg\:w-\[240px\] {
      width: 240px;
    }
    .lg\:w-\[244px\] {
      width: 244px;
    }
    .lg\:w-\[251px\] {
      width: 251px;
    }
    .lg\:w-\[256px\] {
      width: 256px;
    }
    .lg\:w-\[258px\] {
      width: 258px;
    }
    .lg\:w-\[262px\] {
      width: 262px;
    }
    .lg\:w-\[263px\] {
      width: 263px;
    }
    .lg\:w-\[280px\] {
      width: 280px;
    }
    .lg\:w-\[284px\] {
      width: 284px;
    }
    .lg\:w-\[290px\] {
      width: 290px;
    }
    .lg\:w-\[295px\] {
      width: 295px;
    }
    .lg\:w-\[296px\] {
      width: 296px;
    }
    .lg\:w-\[299px\] {
      width: 299px;
    }
    .lg\:w-\[304px\] {
      width: 304px;
    }
    .lg\:w-\[307px\] {
      width: 307px;
    }
    .lg\:w-\[309px\] {
      width: 309px;
    }
    .lg\:w-\[311px\] {
      width: 311px;
    }
    .lg\:w-\[316px\] {
      width: 316px;
    }
    .lg\:w-\[320px\] {
      width: 320px;
    }
    .lg\:w-\[325px\] {
      width: 325px;
    }
    .lg\:w-\[328px\] {
      width: 328px;
    }
    .lg\:w-\[331px\] {
      width: 331px;
    }
    .lg\:w-\[336px\] {
      width: 336px;
    }
    .lg\:w-\[341px\] {
      width: 341px;
    }
    .lg\:w-\[370px\] {
      width: 370px;
    }
    .lg\:w-\[376px\] {
      width: 376px;
    }
    .lg\:w-\[383px\] {
      width: 383px;
    }
    .lg\:w-\[393px\] {
      width: 393px;
    }
    .lg\:w-\[408px\] {
      width: 408px;
    }
    .lg\:w-\[427px\] {
      width: 427px;
    }
    .lg\:w-\[440px\] {
      width: 440px;
    }
    .lg\:w-\[445px\] {
      width: 445px;
    }
    .lg\:w-\[450px\] {
      width: 450px;
    }
    .lg\:w-\[464px\] {
      width: 464px;
    }
    .lg\:w-\[471px\] {
      width: 471px;
    }
    .lg\:w-\[480px\] {
      width: 480px;
    }
    .lg\:w-\[482px\] {
      width: 482px;
    }
    .lg\:w-\[488px\] {
      width: 488px;
    }
    .lg\:w-\[497px\] {
      width: 497px;
    }
    .lg\:w-\[500px\] {
      width: 500px;
    }
    .lg\:w-\[505px\] {
      width: 505px;
    }
    .lg\:w-\[512px\] {
      width: 512px;
    }
    .lg\:w-\[520px\] {
      width: 520px;
    }
    .lg\:w-\[536px\] {
      width: 536px;
    }
    .lg\:w-\[702px\] {
      width: 702px;
    }
    .lg\:w-\[736px\] {
      width: 736px;
    }
    .lg\:w-\[768px\] {
      width: 768px;
    }
    .lg\:w-\[800px\] {
      width: 800px;
    }
    .lg\:w-\[844px\] {
      width: 844px;
    }
    .lg\:w-\[910px\] {
      width: 910px;
    }
    .lg\:w-\[914px\] {
      width: 914px;
    }
    .lg\:w-\[930px\] {
      width: 930px;
    }
    .lg\:w-\[960px\] {
      width: 960px;
    }
    .lg\:w-\[964px\] {
      width: 964px;
    }
    .lg\:w-\[972px\] {
      width: 972px;
    }
    .lg\:w-\[976px\] {
      width: 976px;
    }
    .lg\:w-\[992px\] {
      width: 992px;
    }
    .lg\:w-\[994px\] {
      width: 994px;
    }
    .lg\:w-\[1024px\] {
      width: 1024px;
    }
    .lg\:w-\[1085px\] {
      width: 1085px;
    }
    .lg\:w-full {
      width: 100%;
    }
    .lg\:items-center {
      align-items: center;
    }
    .lg\:gap-x-2 {
      column-gap: calc(var(--spacing, 0.25rem) * 2);
    }
    .lg\:pe-0 {
      padding-inline-end: 0px;
    }
  }
  @media (width >= 75rem) {
    .bootstrapXl\:h-\[150px\] {
      height: 150px;
    }
    .bootstrapXl\:h-\[201px\] {
      height: 201px;
    }
    .bootstrapXl\:h-\[240px\] {
      height: 240px;
    }
    .bootstrapXl\:h-\[354px\] {
      height: 354px;
    }
    .bootstrapXl\:h-\[356px\] {
      height: 356px;
    }
    .bootstrapXl\:w-\[150px\] {
      width: 150px;
    }
    .bootstrapXl\:w-\[301px\] {
      width: 301px;
    }
    .bootstrapXl\:w-\[356px\] {
      width: 356px;
    }
    .bootstrapXl\:w-\[360px\] {
      width: 360px;
    }
    .bootstrapXl\:w-\[530px\] {
      width: 530px;
    }
  }
  @media (width >= 80rem) {
    .xl\:order-2 {
      order: 2;
    }
    .xl\:h-\[41px\] {
      height: 41px;
    }
    .xl\:h-\[48px\] {
      height: 48px;
    }
    .xl\:h-\[65\.5px\] {
      height: 65.5px;
    }
    .xl\:h-\[83px\] {
      height: 83px;
    }
    .xl\:h-\[110px\] {
      height: 110px;
    }
    .xl\:h-\[117px\] {
      height: 117px;
    }
    .xl\:h-\[123px\] {
      height: 123px;
    }
    .xl\:h-\[129px\] {
      height: 129px;
    }
    .xl\:h-\[133px\] {
      height: 133px;
    }
    .xl\:h-\[137px\] {
      height: 137px;
    }
    .xl\:h-\[138px\] {
      height: 138px;
    }
    .xl\:h-\[142px\] {
      height: 142px;
    }
    .xl\:h-\[145px\] {
      height: 145px;
    }
    .xl\:h-\[156px\] {
      height: 156px;
    }
    .xl\:h-\[169px\] {
      height: 169px;
    }
    .xl\:h-\[170px\] {
      height: 170px;
    }
    .xl\:h-\[171px\] {
      height: 171px;
    }
    .xl\:h-\[175px\] {
      height: 175px;
    }
    .xl\:h-\[176px\] {
      height: 176px;
    }
    .xl\:h-\[178px\] {
      height: 178px;
    }
    .xl\:h-\[188px\] {
      height: 188px;
    }
    .xl\:h-\[192px\] {
      height: 192px;
    }
    .xl\:h-\[193px\] {
      height: 193px;
    }
    .xl\:h-\[198px\] {
      height: 198px;
    }
    .xl\:h-\[200px\] {
      height: 200px;
    }
    .xl\:h-\[203px\] {
      height: 203px;
    }
    .xl\:h-\[205px\] {
      height: 205px;
    }
    .xl\:h-\[221px\] {
      height: 221px;
    }
    .xl\:h-\[227px\] {
      height: 227px;
    }
    .xl\:h-\[228px\] {
      height: 228px;
    }
    .xl\:h-\[229px\] {
      height: 229px;
    }
    .xl\:h-\[230px\] {
      height: 230px;
    }
    .xl\:h-\[233px\] {
      height: 233px;
    }
    .xl\:h-\[234px\] {
      height: 234px;
    }
    .xl\:h-\[235px\] {
      height: 235px;
    }
    .xl\:h-\[240px\] {
      height: 240px;
    }
    .xl\:h-\[245px\] {
      height: 245px;
    }
    .xl\:h-\[247px\] {
      height: 247px;
    }
    .xl\:h-\[249px\] {
      height: 249px;
    }
    .xl\:h-\[250px\] {
      height: 250px;
    }
    .xl\:h-\[253px\] {
      height: 253px;
    }
    .xl\:h-\[254px\] {
      height: 254px;
    }
    .xl\:h-\[256px\] {
      height: 256px;
    }
    .xl\:h-\[259px\] {
      height: 259px;
    }
    .xl\:h-\[263px\] {
      height: 263px;
    }
    .xl\:h-\[267px\] {
      height: 267px;
    }
    .xl\:h-\[270px\] {
      height: 270px;
    }
    .xl\:h-\[274px\] {
      height: 274px;
    }
    .xl\:h-\[276px\] {
      height: 276px;
    }
    .xl\:h-\[277px\] {
      height: 277px;
    }
    .xl\:h-\[279px\] {
      height: 279px;
    }
    .xl\:h-\[280px\] {
      height: 280px;
    }
    .xl\:h-\[282px\] {
      height: 282px;
    }
    .xl\:h-\[284px\] {
      height: 284px;
    }
    .xl\:h-\[288px\] {
      height: 288px;
    }
    .xl\:h-\[296px\] {
      height: 296px;
    }
    .xl\:h-\[300px\] {
      height: 300px;
    }
    .xl\:h-\[305px\] {
      height: 305px;
    }
    .xl\:h-\[322px\] {
      height: 322px;
    }
    .xl\:h-\[323px\] {
      height: 323px;
    }
    .xl\:h-\[336px\] {
      height: 336px;
    }
    .xl\:h-\[350px\] {
      height: 350px;
    }
    .xl\:h-\[360px\] {
      height: 360px;
    }
    .xl\:h-\[364px\] {
      height: 364px;
    }
    .xl\:h-\[370px\] {
      height: 370px;
    }
    .xl\:h-\[379px\] {
      height: 379px;
    }
    .xl\:h-\[383px\] {
      height: 383px;
    }
    .xl\:h-\[384px\] {
      height: 384px;
    }
    .xl\:h-\[393px\] {
      height: 393px;
    }
    .xl\:h-\[400px\] {
      height: 400px;
    }
    .xl\:h-\[411px\] {
      height: 411px;
    }
    .xl\:h-\[414px\] {
      height: 414px;
    }
    .xl\:h-\[419px\] {
      height: 419px;
    }
    .xl\:h-\[420px\] {
      height: 420px;
    }
    .xl\:h-\[422px\] {
      height: 422px;
    }
    .xl\:h-\[427px\] {
      height: 427px;
    }
    .xl\:h-\[441px\] {
      height: 441px;
    }
    .xl\:h-\[450px\] {
      height: 450px;
    }
    .xl\:h-\[480px\] {
      height: 480px;
    }
    .xl\:h-\[500px\] {
      height: 500px;
    }
    .xl\:h-\[509px\] {
      height: 509px;
    }
    .xl\:h-\[520px\] {
      height: 520px;
    }
    .xl\:h-\[542px\] {
      height: 542px;
    }
    .xl\:h-\[558px\] {
      height: 558px;
    }
    .xl\:h-\[560px\] {
      height: 560px;
    }
    .xl\:h-\[582px\] {
      height: 582px;
    }
    .xl\:h-\[591px\] {
      height: 591px;
    }
    .xl\:h-\[628px\] {
      height: 628px;
    }
    .xl\:h-\[630px\] {
      height: 630px;
    }
    .xl\:h-\[637px\] {
      height: 637px;
    }
    .xl\:h-\[648px\] {
      height: 648px;
    }
    .xl\:h-\[687px\] {
      height: 687px;
    }
    .xl\:h-\[727px\] {
      height: 727px;
    }
    .xl\:h-\[740px\] {
      height: 740px;
    }
    .xl\:h-\[760px\] {
      height: 760px;
    }
    .xl\:h-\[767px\] {
      height: 767px;
    }
    .xl\:h-\[768px\] {
      height: 768px;
    }
    .xl\:h-\[780px\] {
      height: 780px;
    }
    .xl\:h-\[800px\] {
      height: 800px;
    }
    .xl\:h-\[813px\] {
      height: 813px;
    }
    .xl\:h-\[819px\] {
      height: 819px;
    }
    .xl\:h-\[853px\] {
      height: 853px;
    }
    .xl\:h-\[1280px\] {
      height: 1280px;
    }
    .xl\:h-full {
      height: 100%;
    }
    .xl\:w-80 {
      width: calc(var(--spacing, 0.25rem) * 80);
    }
    .xl\:w-\[61px\] {
      width: 61px;
    }
    .xl\:w-\[111px\] {
      width: 111px;
    }
    .xl\:w-\[112px\] {
      width: 112px;
    }
    .xl\:w-\[127px\] {
      width: 127px;
    }
    .xl\:w-\[160px\] {
      width: 160px;
    }
    .xl\:w-\[165px\] {
      width: 165px;
    }
    .xl\:w-\[175px\] {
      width: 175px;
    }
    .xl\:w-\[185px\] {
      width: 185px;
    }
    .xl\:w-\[193px\] {
      width: 193px;
    }
    .xl\:w-\[200px\] {
      width: 200px;
    }
    .xl\:w-\[205px\] {
      width: 205px;
    }
    .xl\:w-\[207px\] {
      width: 207px;
    }
    .xl\:w-\[213px\] {
      width: 213px;
    }
    .xl\:w-\[218px\] {
      width: 218px;
    }
    .xl\:w-\[234px\] {
      width: 234px;
    }
    .xl\:w-\[248px\] {
      width: 248px;
    }
    .xl\:w-\[254px\] {
      width: 254px;
    }
    .xl\:w-\[255px\] {
      width: 255px;
    }
    .xl\:w-\[256px\] {
      width: 256px;
    }
    .xl\:w-\[263px\] {
      width: 263px;
    }
    .xl\:w-\[264px\] {
      width: 264px;
    }
    .xl\:w-\[267px\] {
      width: 267px;
    }
    .xl\:w-\[282px\] {
      width: 282px;
    }
    .xl\:w-\[288px\] {
      width: 288px;
    }
    .xl\:w-\[290px\] {
      width: 290px;
    }
    .xl\:w-\[297px\] {
      width: 297px;
    }
    .xl\:w-\[300px\] {
      width: 300px;
    }
    .xl\:w-\[304px\] {
      width: 304px;
    }
    .xl\:w-\[307px\] {
      width: 307px;
    }
    .xl\:w-\[309px\] {
      width: 309px;
    }
    .xl\:w-\[320px\] {
      width: 320px;
    }
    .xl\:w-\[340px\] {
      width: 340px;
    }
    .xl\:w-\[341px\] {
      width: 341px;
    }
    .xl\:w-\[344px\] {
      width: 344px;
    }
    .xl\:w-\[350px\] {
      width: 350px;
    }
    .xl\:w-\[351px\] {
      width: 351px;
    }
    .xl\:w-\[352px\] {
      width: 352px;
    }
    .xl\:w-\[356px\] {
      width: 356px;
    }
    .xl\:w-\[360px\] {
      width: 360px;
    }
    .xl\:w-\[363px\] {
      width: 363px;
    }
    .xl\:w-\[368px\] {
      width: 368px;
    }
    .xl\:w-\[370px\] {
      width: 370px;
    }
    .xl\:w-\[375px\] {
      width: 375px;
    }
    .xl\:w-\[380px\] {
      width: 380px;
    }
    .xl\:w-\[381px\] {
      width: 381px;
    }
    .xl\:w-\[384px\] {
      width: 384px;
    }
    .xl\:w-\[387px\] {
      width: 387px;
    }
    .xl\:w-\[394px\] {
      width: 394px;
    }
    .xl\:w-\[395px\] {
      width: 395px;
    }
    .xl\:w-\[411px\] {
      width: 411px;
    }
    .xl\:w-\[413px\] {
      width: 413px;
    }
    .xl\:w-\[416px\] {
      width: 416px;
    }
    .xl\:w-\[418px\] {
      width: 418px;
    }
    .xl\:w-\[427px\] {
      width: 427px;
    }
    .xl\:w-\[448px\] {
      width: 448px;
    }
    .xl\:w-\[450px\] {
      width: 450px;
    }
    .xl\:w-\[458px\] {
      width: 458px;
    }
    .xl\:w-\[461px\] {
      width: 461px;
    }
    .xl\:w-\[464px\] {
      width: 464px;
    }
    .xl\:w-\[483px\] {
      width: 483px;
    }
    .xl\:w-\[484px\] {
      width: 484px;
    }
    .xl\:w-\[488px\] {
      width: 488px;
    }
    .xl\:w-\[504px\] {
      width: 504px;
    }
    .xl\:w-\[509px\] {
      width: 509px;
    }
    .xl\:w-\[540px\] {
      width: 540px;
    }
    .xl\:w-\[552px\] {
      width: 552px;
    }
    .xl\:w-\[555px\] {
      width: 555px;
    }
    .xl\:w-\[560px\] {
      width: 560px;
    }
    .xl\:w-\[568px\] {
      width: 568px;
    }
    .xl\:w-\[575px\] {
      width: 575px;
    }
    .xl\:w-\[576px\] {
      width: 576px;
    }
    .xl\:w-\[588px\] {
      width: 588px;
    }
    .xl\:w-\[589px\] {
      width: 589px;
    }
    .xl\:w-\[592px\] {
      width: 592px;
    }
    .xl\:w-\[616px\] {
      width: 616px;
    }
    .xl\:w-\[628px\] {
      width: 628px;
    }
    .xl\:w-\[633px\] {
      width: 633px;
    }
    .xl\:w-\[640px\] {
      width: 640px;
    }
    .xl\:w-\[723px\] {
      width: 723px;
    }
    .xl\:w-\[942px\] {
      width: 942px;
    }
    .xl\:w-\[956px\] {
      width: 956px;
    }
    .xl\:w-\[992px\] {
      width: 992px;
    }
    .xl\:w-\[1030px\] {
      width: 1030px;
    }
    .xl\:w-\[1090px\] {
      width: 1090px;
    }
    .xl\:w-\[1110px\] {
      width: 1110px;
    }
    .xl\:w-\[1120px\] {
      width: 1120px;
    }
    .xl\:w-\[1140px\] {
      width: 1140px;
    }
    .xl\:w-\[1150px\] {
      width: 1150px;
    }
    .xl\:w-\[1152px\] {
      width: 1152px;
    }
    .xl\:w-\[1170px\] {
      width: 1170px;
    }
    .xl\:w-\[1200px\] {
      width: 1200px;
    }
    .xl\:w-\[1220px\] {
      width: 1220px;
    }
    .xl\:w-\[1228px\] {
      width: 1228px;
    }
    .xl\:w-\[1280px\] {
      width: 1280px;
    }
  }
  @media (width >= 87.5rem) {
    .bootstrapXxl\:h-\[241px\] {
      height: 241px;
    }
    .bootstrapXxl\:h-\[412px\] {
      height: 412px;
    }
    .bootstrapXxl\:h-\[416px\] {
      height: 416px;
    }
    .bootstrapXxl\:w-\[361px\] {
      width: 361px;
    }
    .bootstrapXxl\:w-\[416px\] {
      width: 416px;
    }
    .bootstrapXxl\:w-\[618px\] {
      width: 618px;
    }
  }
  @media (width >= 96rem) {
    .\32 xl\:h-\[44px\] {
      height: 44px;
    }
    .\32 xl\:h-\[100px\] {
      height: 100px;
    }
    .\32 xl\:h-\[115px\] {
      height: 115px;
    }
    .\32 xl\:h-\[133px\] {
      height: 133px;
    }
    .\32 xl\:h-\[141px\] {
      height: 141px;
    }
    .\32 xl\:h-\[142px\] {
      height: 142px;
    }
    .\32 xl\:h-\[147px\] {
      height: 147px;
    }
    .\32 xl\:h-\[162px\] {
      height: 162px;
    }
    .\32 xl\:h-\[176px\] {
      height: 176px;
    }
    .\32 xl\:h-\[188px\] {
      height: 188px;
    }
    .\32 xl\:h-\[213px\] {
      height: 213px;
    }
    .\32 xl\:h-\[236px\] {
      height: 236px;
    }
    .\32 xl\:h-\[243px\] {
      height: 243px;
    }
    .\32 xl\:h-\[250px\] {
      height: 250px;
    }
    .\32 xl\:h-\[262px\] {
      height: 262px;
    }
    .\32 xl\:h-\[267px\] {
      height: 267px;
    }
    .\32 xl\:h-\[269px\] {
      height: 269px;
    }
    .\32 xl\:h-\[270px\] {
      height: 270px;
    }
    .\32 xl\:h-\[272px\] {
      height: 272px;
    }
    .\32 xl\:h-\[283px\] {
      height: 283px;
    }
    .\32 xl\:h-\[296px\] {
      height: 296px;
    }
    .\32 xl\:h-\[300px\] {
      height: 300px;
    }
    .\32 xl\:h-\[311px\] {
      height: 311px;
    }
    .\32 xl\:h-\[312px\] {
      height: 312px;
    }
    .\32 xl\:h-\[317px\] {
      height: 317px;
    }
    .\32 xl\:h-\[332px\] {
      height: 332px;
    }
    .\32 xl\:h-\[364px\] {
      height: 364px;
    }
    .\32 xl\:h-\[382px\] {
      height: 382px;
    }
    .\32 xl\:h-\[392px\] {
      height: 392px;
    }
    .\32 xl\:h-\[424px\] {
      height: 424px;
    }
    .\32 xl\:h-\[432px\] {
      height: 432px;
    }
    .\32 xl\:h-\[440px\] {
      height: 440px;
    }
    .\32 xl\:h-\[443px\] {
      height: 443px;
    }
    .\32 xl\:h-\[471px\] {
      height: 471px;
    }
    .\32 xl\:h-\[496px\] {
      height: 496px;
    }
    .\32 xl\:h-\[500px\] {
      height: 500px;
    }
    .\32 xl\:h-\[505px\] {
      height: 505px;
    }
    .\32 xl\:h-\[507px\] {
      height: 507px;
    }
    .\32 xl\:h-\[512px\] {
      height: 512px;
    }
    .\32 xl\:h-\[526px\] {
      height: 526px;
    }
    .\32 xl\:h-\[560px\] {
      height: 560px;
    }
    .\32 xl\:h-\[592px\] {
      height: 592px;
    }
    .\32 xl\:h-\[648px\] {
      height: 648px;
    }
    .\32 xl\:h-\[664px\] {
      height: 664px;
    }
    .\32 xl\:h-\[702px\] {
      height: 702px;
    }
    .\32 xl\:h-\[720px\] {
      height: 720px;
    }
    .\32 xl\:h-\[880px\] {
      height: 880px;
    }
    .\32 xl\:h-\[984px\] {
      height: 984px;
    }
    .\32 xl\:h-\[1024px\] {
      height: 1024px;
    }
    .\32 xl\:h-full {
      height: 100%;
    }
    .\32 xl\:w-\[65px\] {
      width: 65px;
    }
    .\32 xl\:w-\[133px\] {
      width: 133px;
    }
    .\32 xl\:w-\[172px\] {
      width: 172px;
    }
    .\32 xl\:w-\[200px\] {
      width: 200px;
    }
    .\32 xl\:w-\[212px\] {
      width: 212px;
    }
    .\32 xl\:w-\[213px\] {
      width: 213px;
    }
    .\32 xl\:w-\[220px\] {
      width: 220px;
    }
    .\32 xl\:w-\[243px\] {
      width: 243px;
    }
    .\32 xl\:w-\[264px\] {
      width: 264px;
    }
    .\32 xl\:w-\[282px\] {
      width: 282px;
    }
    .\32 xl\:w-\[320px\] {
      width: 320px;
    }
    .\32 xl\:w-\[333px\] {
      width: 333px;
    }
    .\32 xl\:w-\[354px\] {
      width: 354px;
    }
    .\32 xl\:w-\[364px\] {
      width: 364px;
    }
    .\32 xl\:w-\[375px\] {
      width: 375px;
    }
    .\32 xl\:w-\[384px\] {
      width: 384px;
    }
    .\32 xl\:w-\[393px\] {
      width: 393px;
    }
    .\32 xl\:w-\[395px\] {
      width: 395px;
    }
    .\32 xl\:w-\[400px\] {
      width: 400px;
    }
    .\32 xl\:w-\[408px\] {
      width: 408px;
    }
    .\32 xl\:w-\[416px\] {
      width: 416px;
    }
    .\32 xl\:w-\[424px\] {
      width: 424px;
    }
    .\32 xl\:w-\[440px\] {
      width: 440px;
    }
    .\32 xl\:w-\[444px\] {
      width: 444px;
    }
    .\32 xl\:w-\[447px\] {
      width: 447px;
    }
    .\32 xl\:w-\[466px\] {
      width: 466px;
    }
    .\32 xl\:w-\[475px\] {
      width: 475px;
    }
    .\32 xl\:w-\[478px\] {
      width: 478px;
    }
    .\32 xl\:w-\[480px\] {
      width: 480px;
    }
    .\32 xl\:w-\[499px\] {
      width: 499px;
    }
    .\32 xl\:w-\[526px\] {
      width: 526px;
    }
    .\32 xl\:w-\[546px\] {
      width: 546px;
    }
    .\32 xl\:w-\[573px\] {
      width: 573px;
    }
    .\32 xl\:w-\[588px\] {
      width: 588px;
    }
    .\32 xl\:w-\[592px\] {
      width: 592px;
    }
    .\32 xl\:w-\[636px\] {
      width: 636px;
    }
    .\32 xl\:w-\[640px\] {
      width: 640px;
    }
    .\32 xl\:w-\[648px\] {
      width: 648px;
    }
    .\32 xl\:w-\[660px\] {
      width: 660px;
    }
    .\32 xl\:w-\[707px\] {
      width: 707px;
    }
    .\32 xl\:w-\[720px\] {
      width: 720px;
    }
    .\32 xl\:w-\[744px\] {
      width: 744px;
    }
    .\32 xl\:w-\[746px\] {
      width: 746px;
    }
    .\32 xl\:w-\[756px\] {
      width: 756px;
    }
    .\32 xl\:w-\[761px\] {
      width: 761px;
    }
    .\32 xl\:w-\[768px\] {
      width: 768px;
    }
    .\32 xl\:w-\[972px\] {
      width: 972px;
    }
    .\32 xl\:w-\[996px\] {
      width: 996px;
    }
    .\32 xl\:w-\[1248px\] {
      width: 1248px;
    }
    .\32 xl\:w-\[1320px\] {
      width: 1320px;
    }
    .\32 xl\:w-\[1476px\] {
      width: 1476px;
    }
    .\32 xl\:w-\[1536px\] {
      width: 1536px;
    }
  }
  @media (width >= 120rem) {
    .\33 xl\:h-\[115px\] {
      height: 115px;
    }
    .\33 xl\:h-\[252px\] {
      height: 252px;
    }
    .\33 xl\:h-\[267px\] {
      height: 267px;
    }
    .\33 xl\:h-\[270px\] {
      height: 270px;
    }
    .\33 xl\:h-\[300px\] {
      height: 300px;
    }
    .\33 xl\:h-\[336px\] {
      height: 336px;
    }
    .\33 xl\:h-\[396px\] {
      height: 396px;
    }
    .\33 xl\:h-\[418px\] {
      height: 418px;
    }
    .\33 xl\:h-\[540px\] {
      height: 540px;
    }
    .\33 xl\:h-\[561px\] {
      height: 561px;
    }
    .\33 xl\:h-\[587px\] {
      height: 587px;
    }
    .\33 xl\:h-\[624px\] {
      height: 624px;
    }
    .\33 xl\:h-\[633px\] {
      height: 633px;
    }
    .\33 xl\:h-\[635px\] {
      height: 635px;
    }
    .\33 xl\:h-\[640px\] {
      height: 640px;
    }
    .\33 xl\:h-\[1067px\] {
      height: 1067px;
    }
    .\33 xl\:h-\[1240px\] {
      height: 1240px;
    }
    .\33 xl\:h-full {
      height: 100%;
    }
    .\33 xl\:w-\[154px\] {
      width: 154px;
    }
    .\33 xl\:w-\[378px\] {
      width: 378px;
    }
    .\33 xl\:w-\[400px\] {
      width: 400px;
    }
    .\33 xl\:w-\[448px\] {
      width: 448px;
    }
    .\33 xl\:w-\[450px\] {
      width: 450px;
    }
    .\33 xl\:w-\[480px\] {
      width: 480px;
    }
    .\33 xl\:w-\[540px\] {
      width: 540px;
    }
    .\33 xl\:w-\[594px\] {
      width: 594px;
    }
    .\33 xl\:w-\[627px\] {
      width: 627px;
    }
    .\33 xl\:w-\[800px\] {
      width: 800px;
    }
    .\33 xl\:w-\[880px\] {
      width: 880px;
    }
    .\33 xl\:w-\[912px\] {
      width: 912px;
    }
    .\33 xl\:w-\[936px\] {
      width: 936px;
    }
    .\33 xl\:w-\[948px\] {
      width: 948px;
    }
    .\33 xl\:w-\[953px\] {
      width: 953px;
    }
    .\33 xl\:w-\[960px\] {
      width: 960px;
    }
    .\33 xl\:w-\[1600px\] {
      width: 1600px;
    }
    .\33 xl\:w-\[1860px\] {
      width: 1860px;
    }
  }
  @media (orientation: portrait) {
    .portrait\:w-full {
      width: 100%;
    }
  }
  .ltr\:rotate-180:where(:dir(ltr), [dir="ltr"], [dir="ltr"] *) {
    rotate: 180deg;
  }
  @media (width <= 56.25rem) {
    .maxReferenceMedium\:h-\[380px\] {
      height: 380px;
    }
    .maxReferenceMedium\:h-\[calc\(\(\(var\(--viewportWidth\)-30px\)\*\.3-60px\)\*163\.69\/352\.47\)\] {
      height: calc(((var(--viewportWidth) - 30px) * .3 - 60px) * 163.69 / 352.47);
    }
    .maxReferenceMedium\:w-\[calc\(\(100cqw-20px\)\/2\)\] {
      width: calc((100cqw - 20px) / 2);
    }
    .maxReferenceMedium\:w-\[calc\(\(var\(--viewportWidth\)-30px\)\*\.3-60px\)\] {
      width: calc((var(--viewportWidth) - 30px) * .3 - 60px);
    }
    .maxReferenceMedium\:w-\[calc\(calc\(var\(--viewportWidth\)\*0\.5\)-35px\)\] {
      width: calc(calc(var(--viewportWidth) * 0.5) - 35px);
    }
  }
  @media (width <= 40rem) {
    .maxSm\:h-\[300px\] {
      height: 300px;
    }
    .maxSm\:h-\[390px\] {
      height: 390px;
    }
    .maxSm\:h-\[calc\(100vh-60px\)\] {
      height: calc(100vh - 60px);
    }
    .maxSm\:h-\[calc\(min\(calc\(var\(--viewportWidth\)-50px\)\,352\.453125px\)\*163\.69\/352\.47\)\] {
      height: calc(min(calc(var(--viewportWidth) - 50px), 352.453125px) * 163.69 / 352.47);
    }
    .maxSm\:w-\[calc\(calc\(var\(--viewportWidth\)\*0\.9\)-14px\)\] {
      width: calc(calc(var(--viewportWidth) * 0.9) - 14px);
    }
    .maxSm\:w-\[calc\(var\(--viewportWidth\)-30px\)\] {
      width: calc(var(--viewportWidth) - 30px);
    }
    .maxSm\:w-\[min\(calc\(var\(--viewportWidth\)-50px\)\,352\.453125px\)\] {
      width: min(calc(var(--viewportWidth) - 50px), 352.453125px);
    }
  }
  @media (width > 40rem) {
    @media (width < 56.25rem) {
      .aboveSm\:max-referenceMedium\:h-\[calc\(\(100cqw-20px\)\*0\.40703125\)\] {
        height: calc((100cqw - 20px) * 0.40703125);
      }
      .aboveSm\:max-referenceMedium\:h-\[calc\(\(100cqw-20px\)\/3\)\] {
        height: calc((100cqw - 20px) / 3);
      }
    }
  }
  @media (width >= 48rem) {
    .mediaCard:nth-child(n+4) .\[\.mediaCard\:nth-child\(n\+4\)_\&\]\:md\:h-\[108\.333px\] {
      height: 108.333px;
    }
    .mediaCard:nth-child(n+4) .\[\.mediaCard\:nth-child\(n\+4\)_\&\]\:md\:w-\[162\.5px\] {
      width: 162.5px;
    }
  }
  @media (width >= 62rem) {
    .mediaCard:nth-child(n+4) .\[\.mediaCard\:nth-child\(n\+4\)_\&\]\:bootstrapLg\:h-\[148\.333px\] {
      height: 148.333px;
    }
    .mediaCard:nth-child(n+4) .\[\.mediaCard\:nth-child\(n\+4\)_\&\]\:bootstrapLg\:w-\[222\.5px\] {
      width: 222.5px;
    }
  }
  @media (width >= 75rem) {
    .mediaCard:nth-child(n+4) .\[\.mediaCard\:nth-child\(n\+4\)_\&\]\:bootstrapXl\:h-\[178\.333px\] {
      height: 178.333px;
    }
    .mediaCard:nth-child(n+4) .\[\.mediaCard\:nth-child\(n\+4\)_\&\]\:bootstrapXl\:w-\[267\.5px\] {
      width: 267.5px;
    }
  }
}
@layer themePart {
  .cacheControls {
    position: fixed;
    bottom: calc(var(--spacing, 0.25rem) * 4);
    left: calc(var(--spacing, 0.25rem) * 4);
    z-index: 200;
    border-radius: var(--radius-lg, 0.5rem);
    background-color: color-mix(in srgb, #000 70%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix(in oklab, var(--color-black, #000) 70%, transparent);
    }
    color: var(--color-white, #fff);
    --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);
    .toggle {
      cursor: pointer;
      padding-inline: calc(var(--spacing, 0.25rem) * 3);
      padding-block: calc(var(--spacing, 0.25rem) * 2);
      font-size: var(--text-xs, 0.75rem);
      line-height: var(--tw-leading, var(--text-xs--line-height, calc(1 / 0.75)));
      --tw-font-weight: var(--font-weight-semibold, 600);
      font-weight: var(--font-weight-semibold, 600);
      -webkit-user-select: none;
      user-select: none;
    }
    .content {
      display: flex;
      min-width: calc(var(--spacing, 0.25rem) * 40);
      flex-direction: column;
      gap: calc(var(--spacing, 0.25rem) * 2);
      border-top-style: var(--tw-border-style);
      border-top-width: 1px;
      border-color: color-mix(in srgb, #fff 20%, transparent);
      @supports (color: color-mix(in lab, red, red)) {
        border-color: color-mix(in oklab, var(--color-white, #fff) 20%, transparent);
      }
      padding: calc(var(--spacing, 0.25rem) * 2);
    }
    .keysLink {
      border-radius: 0.25rem;
      border-style: var(--tw-border-style);
      border-width: 1px;
      border-color: var(--color-sky-300, oklch(82.8% 0.111 230.318));
      background-color: var(--color-sky-700, oklch(50% 0.134 242.749));
      padding-inline: calc(var(--spacing, 0.25rem) * 2);
      padding-block: calc(var(--spacing, 0.25rem) * 1.5);
      text-align: center;
      font-size: var(--text-xs, 0.75rem);
      line-height: var(--tw-leading, var(--text-xs--line-height, calc(1 / 0.75)));
      --tw-font-weight: var(--font-weight-semibold, 600);
      font-weight: var(--font-weight-semibold, 600);
      color: var(--color-white, #fff);
      text-decoration-line: none;
      &:hover {
        @media (hover: hover) {
          background-color: var(--color-sky-900, oklch(39.1% 0.09 240.876));
        }
      }
    }
    .title {
      font-size: var(--text-xs, 0.75rem);
      line-height: var(--tw-leading, var(--text-xs--line-height, calc(1 / 0.75)));
      --tw-font-weight: var(--font-weight-semibold, 600);
      font-weight: var(--font-weight-semibold, 600);
    }
    .action {
      border-radius: 0.25rem;
      background-color: var(--color-orange-700, oklch(55.3% 0.195 38.402));
      padding-inline: calc(var(--spacing, 0.25rem) * 2);
      padding-block: var(--spacing, 0.25rem);
      font-size: var(--text-xs, 0.75rem);
      line-height: var(--tw-leading, var(--text-xs--line-height, calc(1 / 0.75)));
      color: var(--color-white, #fff);
      &:hover {
        @media (hover: hover) {
          background-color: var(--color-orange-900, oklch(40.8% 0.123 38.172));
        }
      }
      &:disabled {
        opacity: 50%;
      }
    }
    .loadingIcon {
      display: inline-block;
      width: calc(var(--spacing, 0.25rem) * 3.5);
      height: calc(var(--spacing, 0.25rem) * 3.5);
      animation: var(--animate-spin, spin 1s linear infinite);
      vertical-align: middle;
    }
  }
  .cacheKeysPage {
    margin-inline: auto;
    min-height: 100vh;
    width: 100%;
    max-width: var(--breakpoint-xl, 80rem);
    padding-inline: calc(var(--spacing, 0.25rem) * 6);
    padding-block: calc(var(--spacing, 0.25rem) * 10);
    .title {
      margin-bottom: calc(var(--spacing, 0.25rem) * 6);
      font-size: var(--text-3xl, 1.875rem);
      line-height: var(--tw-leading, var(--text-3xl--line-height, calc(2.25 / 1.875)));
      --tw-font-weight: var(--font-weight-bold, 700);
      font-weight: var(--font-weight-bold, 700);
    }
    .search {
      margin-bottom: calc(var(--spacing, 0.25rem) * 8);
      display: flex;
      gap: calc(var(--spacing, 0.25rem) * 2);
      .input {
        min-width: 0px;
        flex: 1;
        border-radius: var(--radius-md, 0.375rem);
        border-style: var(--tw-border-style);
        border-width: 1px;
        background-color: transparent;
        padding-inline: calc(var(--spacing, 0.25rem) * 3);
        padding-block: calc(var(--spacing, 0.25rem) * 2);
        --tw-outline-style: none;
        outline-style: none;
        border-color: var(--theme-border);
      }
      .action {
        border-radius: var(--radius-md, 0.375rem);
        background-color: var(--color-sky-700, oklch(50% 0.134 242.749));
        padding-inline: calc(var(--spacing, 0.25rem) * 5);
        padding-block: calc(var(--spacing, 0.25rem) * 2);
        color: var(--color-white, #fff);
        &:hover {
          @media (hover: hover) {
            background-color: var(--color-sky-900, oklch(39.1% 0.09 240.876));
          }
        }
      }
    }
    .tree {
      list-style-type: none;
      :where(& > :not(:last-child)) {
        --tw-space-y-reverse: 0;
        margin-block-start: calc(calc(var(--spacing, 0.25rem) * 2) * var(--tw-space-y-reverse));
        margin-block-end: calc(calc(var(--spacing, 0.25rem) * 2) * calc(1 - var(--tw-space-y-reverse)));
      }
      padding-inline-start: 0px;
      .children {
        list-style-type: none;
        :where(& > :not(:last-child)) {
          --tw-space-y-reverse: 0;
          margin-block-start: calc(calc(var(--spacing, 0.25rem) * 2) * var(--tw-space-y-reverse));
          margin-block-end: calc(calc(var(--spacing, 0.25rem) * 2) * calc(1 - var(--tw-space-y-reverse)));
        }
        border-inline-start-style: var(--tw-border-style);
        border-inline-start-width: 1px;
        padding-inline-start: calc(var(--spacing, 0.25rem) * 5);
        padding-top: calc(var(--spacing, 0.25rem) * 2);
        border-color: var(--theme-border);
      }
      .label {
        cursor: pointer;
        --tw-font-weight: var(--font-weight-semibold, 600);
        font-weight: var(--font-weight-semibold, 600);
      }
      .leaf {
        display: flex;
        align-items: center;
        gap: calc(var(--spacing, 0.25rem) * 4);
      }
      .item {
        .nodeHeader {
          display: flex;
          align-items: flex-start;
          gap: var(--spacing, 0.25rem);
          > details {
            min-width: 0px;
            flex: 1;
          }
          .refresh {
            margin-top: calc(var(--spacing, 0.25rem) * 0.5);
            display: flex;
            width: calc(var(--spacing, 0.25rem) * 5);
            height: calc(var(--spacing, 0.25rem) * 5);
            align-items: center;
            justify-content: center;
            border-radius: 0.25rem;
            color: var(--color-sky-700, oklch(50% 0.134 242.749));
            &:hover {
              @media (hover: hover) {
                background-color: var(--color-sky-700, oklch(50% 0.134 242.749));
              }
            }
            &:hover {
              @media (hover: hover) {
                color: var(--color-white, #fff);
              }
            }
            &:disabled {
              opacity: 50%;
            }
            &[aria-busy='true'] .icon {
              animation: var(--animate-spin, spin 1s linear infinite);
            }
            .icon {
              width: calc(var(--spacing, 0.25rem) * 4);
              height: calc(var(--spacing, 0.25rem) * 4);
            }
          }
        }
      }
      .nodeAction {
        .loadingIcon {
          width: calc(var(--spacing, 0.25rem) * 4);
          height: calc(var(--spacing, 0.25rem) * 4);
          animation: var(--animate-spin, spin 1s linear infinite);
        }
        .deleteAction {
          display: flex;
          width: calc(var(--spacing, 0.25rem) * 6);
          height: calc(var(--spacing, 0.25rem) * 6);
          align-items: center;
          justify-content: center;
          border-radius: 0.25rem;
          color: var(--color-red-700, oklch(50.5% 0.213 27.518));
          &:hover {
            @media (hover: hover) {
              background-color: var(--color-red-700, oklch(50.5% 0.213 27.518));
            }
          }
          &:hover {
            @media (hover: hover) {
              color: var(--color-white, #fff);
            }
          }
          .removeIcon {
            width: calc(var(--spacing, 0.25rem) * 4);
            height: calc(var(--spacing, 0.25rem) * 4);
            fill: currentcolor;
          }
        }
      }
      .key {
        font-size: var(--text-sm, 0.875rem);
        line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
        word-break: break-all;
        color: var(--theme-text-muted);
      }
    }
  }
  .layoutDimensions {
    position: fixed;
    inset-inline-start: calc(var(--spacing, 0.25rem) * 4);
    top: calc(var(--spacing, 0.25rem) * 4);
    z-index: 200;
    border-radius: var(--radius-lg, 0.5rem);
    --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);
    background-color: var(--layoutDimensionsSurfaceColor);
    color: var(--layoutDimensionsTextColor);
    .toggle {
      cursor: pointer;
      padding-inline: calc(var(--spacing, 0.25rem) * 3);
      padding-block: calc(var(--spacing, 0.25rem) * 2);
      font-size: var(--text-xs, 0.75rem);
      line-height: var(--tw-leading, var(--text-xs--line-height, calc(1 / 0.75)));
      --tw-font-weight: var(--font-weight-semibold, 600);
      font-weight: var(--font-weight-semibold, 600);
      -webkit-user-select: none;
      user-select: none;
    }
    .content {
      display: flex;
      min-width: calc(var(--spacing, 0.25rem) * 72);
      flex-direction: column;
      gap: var(--spacing, 0.25rem);
      border-top-style: var(--tw-border-style);
      border-top-width: 1px;
      padding: calc(var(--spacing, 0.25rem) * 2);
      border-color: var(--layoutDimensionsBorderColor);
    }
    .measurement {
      font-size: var(--text-xs, 0.75rem);
      line-height: var(--tw-leading, var(--text-xs--line-height, calc(1 / 0.75)));
      --tw-numeric-spacing: tabular-nums;
      font-variant-numeric: var(--tw-ordinal,) var(--tw-slashed-zero,) var(--tw-numeric-figure,) var(--tw-numeric-spacing,) var(--tw-numeric-fraction,);
    }
  }
  .pageMilliseconds {
    position: fixed;
    right: calc(var(--spacing, 0.25rem) * 4);
    bottom: calc(var(--spacing, 0.25rem) * 4);
    z-index: 200;
    border-radius: var(--radius-lg, 0.5rem);
    background-color: color-mix(in srgb, #000 70%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix(in oklab, var(--color-black, #000) 70%, transparent);
    }
    padding-inline: calc(var(--spacing, 0.25rem) * 3);
    padding-block: calc(var(--spacing, 0.25rem) * 2);
    font-size: var(--text-xs, 0.75rem);
    line-height: var(--tw-leading, var(--text-xs--line-height, calc(1 / 0.75)));
    --tw-font-weight: var(--font-weight-semibold, 600);
    font-weight: var(--font-weight-semibold, 600);
    color: var(--color-white, #fff);
    --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);
  }
  .circularProgress {
    position: relative;
    display: block;
    .valueContainer {
      position: absolute;
      z-index: 10;
      display: flex;
      width: 100%;
      height: 100%;
      align-items: center;
      justify-content: center;
      text-align: center;
    }
    .value {
      font-size: var(--text-lg, 1.125rem);
      line-height: var(--tw-leading, var(--text-lg--line-height, calc(1.75 / 1.125)));
      color: var(--circularProgressTextColor);
    }
    .graph {
      width: 100%;
      height: 100%;
      rotate: calc(90deg * -1);
    }
    .rings {
      width: 100%;
      height: 100%;
      circle {
        fill: transparent;
      }
    }
    .track {
      stroke: var(--circularProgressTrackColor);
    }
    .measure {
      stroke: var(--circularProgressMeasureColor);
    }
  }
  .coordinates {
    position: relative;
    .canvas {
      width: 100%;
      height: 100%;
    }
  }
  .download {
    margin-inline: auto;
    max-width: var(--container-xs, 20rem);
    border-radius: var(--radius-lg, 0.5rem);
    padding-inline: calc(var(--spacing, 0.25rem) * 4);
    padding-block: var(--spacing, 0.25rem);
    text-align: center;
    --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);
    background-color: var(--downloadSurfaceColor);
    .title {
      margin-block: 0px;
      text-align: center;
    }
    .description {
      text-align: justify;
      font-size: var(--text-sm, 0.875rem);
      line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
      --tw-leading: calc(var(--spacing, 0.25rem) * 7);
      line-height: calc(var(--spacing, 0.25rem) * 7);
    }
    .action {
      margin-inline: auto;
      margin-block: calc(var(--spacing, 0.25rem) * 2);
      display: flex;
      width: fit-content;
      align-items: center;
      column-gap: calc(var(--spacing, 0.25rem) * 2);
      border-radius: var(--radius-lg, 0.5rem);
      padding-inline: calc(var(--spacing, 0.25rem) * 2);
      padding-block: var(--spacing, 0.25rem);
      background-color: var(--downloadActionColor);
      &:hover {
        .link {
          color: var(--downloadLinkHoverColor);
        }
      }
    }
    .link {
      transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, content-visibility, overlay, pointer-events;
      transition-timing-function: var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(0.4, 0, 0.2, 1)));
      transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
      --tw-duration: 200ms;
      transition-duration: 200ms;
      color: var(--downloadLinkColor);
      &:hover {
        color: var(--downloadLinkHoverColor);
      }
    }
  }
  .field {
    margin-top: calc(var(--spacing, 0.25rem) * 2);
    width: 100%;
    border-radius: var(--radius-md, 0.375rem);
    padding-inline: calc(var(--spacing, 0.25rem) * 4);
    padding-block: calc(var(--spacing, 0.25rem) * 2);
    &:focus {
      --tw-outline-style: none;
      outline-style: none;
      @media (forced-colors: active) {
        outline: 2px solid transparent;
        outline-offset: 2px;
      }
    }
    &::placeholder {
      color: var(--fieldPlaceholderColor);
    }
    .label {
      font-size: var(--text-base, 1rem);
      line-height: var(--tw-leading, var(--text-base--line-height, calc(1.5 / 1)));
      color: var(--fieldLabelColor);
    }
    .required {
      color: var(--fieldRequiredColor);
    }
  }
  .control {
    margin-top: calc(var(--spacing, 0.25rem) * 2);
    width: 100%;
    border-radius: var(--radius-md, 0.375rem);
    padding-inline: calc(var(--spacing, 0.25rem) * 4);
    padding-block: calc(var(--spacing, 0.25rem) * 2);
    background-color: var(--controlSurfaceColor);
    &:focus {
      --tw-outline-style: none;
      outline-style: none;
      @media (forced-colors: active) {
        outline: 2px solid transparent;
        outline-offset: 2px;
      }
    }
    &::placeholder {
      color: var(--fieldPlaceholderColor);
    }
  }
  .heroBento .composition {
    display: grid;
  }
  .heroBackground .media {
    position: absolute;
    inset: 0px;
  }
  .backgroundImage {
    background-image: var(--imageSource);
  }
  .lqipContainer {
    position: relative;
    overflow: hidden;
    .lqipPlaceholder {
      position: absolute;
      width: 100%;
      height: 100%;
      object-fit: cover;
      --tw-blur: blur(var(--blur-lg, 16px));
      filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);
      transition-property: opacity;
      transition-timing-function: var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(0.4, 0, 0.2, 1)));
      transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
      --tw-duration: 500ms;
      transition-duration: 500ms;
    }
    .lqipOriginalImage {
      width: 100%;
      height: 100%;
      object-fit: cover;
      opacity: 0%;
      transition-property: opacity;
      transition-timing-function: var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(0.4, 0, 0.2, 1)));
      transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
      --tw-duration: 500ms;
      transition-duration: 500ms;
    }
    .lqipSkeleton {
      position: absolute;
      inset: 0px;
      animation: var(--animate-pulse, pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite);
      background-color: var(--imageSkeletonColor);
    }
    .indicatorContainer {
      display: flex;
      width: 100%;
      height: 100%;
      align-items: center;
      justify-content: center;
    }
    .indicator {
      margin-inline: auto;
      aspect-ratio: 1 / 1;
      height: auto;
      width: calc(var(--spacing, 0.25rem) * 16);
      animation: var(--animate-spin, spin 1s linear infinite);
      border-radius: calc(infinity * 1px);
      border-style: var(--tw-border-style);
      border-width: 4px;
      border-color: var(--imageIndicatorColor);
      border-top-color: var(--imageSkeletonColor);
    }
  }
  .responsiveImage {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
  .imageStatus {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: calc(var(--spacing, 0.25rem) * 0.5);
    padding: var(--spacing, 0.25rem);
    text-align: start;
    font-size: var(--text-xs, 0.75rem);
    line-height: var(--tw-leading, var(--text-xs--line-height, calc(1 / 0.75)));
    color: var(--imageStatusColor);
  }
  .galleryTabImage {
    height: auto;
    width: 100%;
    object-fit: contain;
  }
  .itemRendererError {
    width: 100%;
    border-style: var(--tw-border-style);
    border-width: 1px;
    padding: calc(var(--spacing, 0.25rem) * 10);
    text-align: center;
    font-size: var(--text-sm, 0.875rem);
    line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
    border-color: var(--itemRendererErrorColor);
  }
  .map {
    position: relative;
    .canvas {
      width: 100%;
      height: 100%;
    }
    .navigation {
      position: absolute;
      inset-inline-end: calc(var(--spacing, 0.25rem) * 2);
      bottom: calc(var(--spacing, 0.25rem) * 2);
      z-index: 500;
      cursor: pointer;
      border-radius: var(--radius-lg, 0.5rem);
      --tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 2px 4px -2px 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);
      transition-property: all;
      transition-timing-function: var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(0.4, 0, 0.2, 1)));
      transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
      --tw-duration: 200ms;
      transition-duration: 200ms;
      background-color: var(--mapNavigationColor);
      &:hover {
        background-color: var(--mapNavigationHoverColor);
      }
    }
    .mobile {
      @media (width >= 40rem) {
        display: none;
      }
    }
    .desktop {
      display: none;
      @media (width >= 40rem) {
        display: block;
      }
    }
    .icon {
      width: calc(var(--spacing, 0.25rem) * 8);
      height: calc(var(--spacing, 0.25rem) * 8);
      padding: var(--spacing, 0.25rem);
      fill: var(--mapIconColor);
    }
  }
  .message {
    position: fixed;
    inset-inline-start: calc(var(--spacing, 0.25rem) * 5);
    inset-inline-end: calc(var(--spacing, 0.25rem) * 5);
    top: calc(var(--spacing, 0.25rem) * 5);
    z-index: 50;
    margin-inline: auto;
    display: flex;
    align-items: center;
    gap: var(--spacing, 0.25rem);
    border-radius: var(--radius-lg, 0.5rem);
    border-style: var(--tw-border-style);
    border-width: 1px;
    padding-inline: calc(var(--spacing, 0.25rem) * 5);
    padding-block: calc(var(--spacing, 0.25rem) * 4);
    font-size: var(--text-sm, 0.875rem);
    line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
    --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);
    background-color: var(--messageSuccessSurfaceColor);
    border-color: var(--messageSuccessBorderColor);
    color: var(--messageSuccessTextColor);
    @media (width >= 40rem) {
      inset-inline-start: calc(var(--spacing, 0.25rem) * 10);
      inset-inline-end: auto;
    }
    &.info {
      background-color: var(--messageInfoSurfaceColor);
      border-color: var(--messageInfoBorderColor);
      color: var(--messageInfoTextColor);
    }
    &.warning {
      background-color: var(--messageWarningSurfaceColor);
      border-color: var(--messageWarningBorderColor);
      color: var(--messageWarningTextColor);
    }
    &.error {
      background-color: var(--messageErrorSurfaceColor);
      border-color: var(--messageErrorBorderColor);
      color: var(--messageErrorTextColor);
    }
    .description {
      padding-top: calc(var(--spacing, 0.25rem) * 5);
    }
  }
  .modal {
    position: fixed;
    inset: 0px;
    z-index: 50;
    height: 100vh;
    width: 100vw;
    transition-property: all;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(0.4, 0, 0.2, 1)));
    transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
    --tw-duration: 300ms;
    transition-duration: 300ms;
    background-color: var(--modalBackdropColor);
    &.open {
      --tw-translate-y: 0px;
      translate: var(--tw-translate-x) var(--tw-translate-y);
      opacity: 100%;
    }
    &.closed {
      --tw-translate-y: -100%;
      translate: var(--tw-translate-x) var(--tw-translate-y);
      opacity: 0%;
    }
    .closeAction {
      margin: calc(var(--spacing, 0.25rem) * 4);
      display: flex;
      aspect-ratio: 1 / 1;
      width: calc(var(--spacing, 0.25rem) * 8);
      cursor: pointer;
      align-items: center;
      justify-content: center;
      border-radius: calc(infinity * 1px);
      font-size: var(--text-xl, 1.25rem);
      line-height: var(--tw-leading, var(--text-xl--line-height, calc(1.75 / 1.25)));
      --tw-font-weight: var(--font-weight-bold, 700);
      font-weight: var(--font-weight-bold, 700);
      background-color: var(--modalActionSurfaceColor);
      color: var(--modalActionTextColor);
    }
    .content {
      z-index: 50;
      margin-inline: auto;
      width: 500px;
      max-width: 100%;
      border-radius: var(--radius-lg, 0.5rem);
      padding: calc(var(--spacing, 0.25rem) * 8);
      text-align: center;
      transition-property: all;
      transition-timing-function: var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(0.4, 0, 0.2, 1)));
      transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
      transition-delay: 1000000;
      --tw-duration: 500ms;
      transition-duration: 500ms;
      background-color: var(--modalContentColor);
      &.open {
        --tw-translate-y: 0px;
        translate: var(--tw-translate-x) var(--tw-translate-y);
        opacity: 100%;
      }
      &.closed {
        --tw-translate-y: -100%;
        translate: var(--tw-translate-x) var(--tw-translate-y);
        opacity: 0%;
      }
    }
  }
}
@layer themePage {
  .notFound {
    display: flex;
    height: 75vh;
    width: 100%;
    align-items: center;
    justify-content: center;
    padding: calc(var(--spacing, 0.25rem) * 5);
    background-color: var(--notFoundSurfaceColor);
    .content {
      text-align: center;
    }
    .iconContainer {
      display: inline-flex;
      border-radius: calc(infinity * 1px);
      padding: calc(var(--spacing, 0.25rem) * 4);
      background-color: var(--notFoundIconContainerColor);
    }
    .iconSurface {
      border-radius: calc(infinity * 1px);
      padding: calc(var(--spacing, 0.25rem) * 4);
      background-color: var(--notFoundIconSurfaceColor);
      stroke: var(--notFoundIconStrokeColor);
    }
    .icon {
      width: calc(var(--spacing, 0.25rem) * 16);
      height: calc(var(--spacing, 0.25rem) * 16);
    }
    .title {
      margin-top: calc(var(--spacing, 0.25rem) * 5);
      font-size: 30px;
      --tw-font-weight: var(--font-weight-bold, 700);
      font-weight: var(--font-weight-bold, 700);
      color: var(--notFoundTitleColor);
      @media (width >= 64rem) {
        font-size: 50px;
      }
    }
    .description {
      margin-top: calc(var(--spacing, 0.25rem) * 5);
      color: var(--notFoundDescriptionColor);
      @media (width >= 64rem) {
        font-size: var(--text-lg, 1.125rem);
        line-height: var(--tw-leading, var(--text-lg--line-height, calc(1.75 / 1.125)));
      }
    }
  }
}
.richText [data-text-align='left'] {
  text-align: left;
}
.richText [data-text-align='center'] {
  text-align: center;
}
.richText [data-text-align='right'] {
  text-align: right;
}
.richText [data-text-align='justify'] {
  text-align: justify;
}
@layer themePart {
  .progress {
    display: flex;
    justify-content: center;
    :where(& > :not(:last-child)) {
      --tw-space-x-reverse: 0;
      margin-inline-start: calc(var(--spacing, 0.25rem) * var(--tw-space-x-reverse));
      margin-inline-end: calc(var(--spacing, 0.25rem) * calc(1 - var(--tw-space-x-reverse)));
    }
    .indicator {
      width: calc(var(--spacing, 0.25rem) * 2);
      height: calc(var(--spacing, 0.25rem) * 2);
      animation: var(--animate-bounce, bounce 1s infinite);
      border-radius: calc(infinity * 1px);
      background-color: var(--progressIndicatorColor);
      &:nth-child(2) {
        animation-delay: 150ms;
      }
      &:nth-child(3) {
        animation-delay: 300ms;
      }
    }
  }
  .scrollToTop {
    position: fixed;
    bottom: calc(var(--spacing, 0.25rem) * 20);
    z-index: 50;
    cursor: pointer;
    --tw-duration: 300ms;
    transition-duration: 300ms;
  }
  .scrollToTop.defaultPosition {
    inset-inline-end: calc(var(--spacing, 0.25rem) * 20);
  }
  .swiperElement {
    position: relative;
    width: 100%;
  }
  .swiperError {
    padding: calc(var(--spacing, 0.25rem) * 10);
    background-color: var(--swiperErrorSurfaceColor);
    color: var(--swiperErrorTextColor);
  }
  .active-bullet .swiper-pagination-bullet-active, .bullet .swiper-pagination-bullet, .swiper-slide-thumb-active, .swiper-slide-active {
    display: block;
  }
  .video {
    width: 100%;
    object-fit: cover;
  }
}
@layer themePage {
  .themeCatalog {
    --catalogBackground: var(--background, #fff);
    --catalogBorder: var(--border, #ddd);
    --catalogMuted: var(--muted, #666);
    --catalogSurface: var(--surface, #fff);
    --catalogText: var(--foreground, #222);
    --catalogAccent: var(--accent, #a43);
    min-height: 100vh;
    flex: 1;
    padding-inline: calc(var(--spacing, 0.25rem) * 6);
    padding-block: calc(var(--spacing, 0.25rem) * 16);
    background: var(--catalogBackground);
    color: var(--catalogText);
    .container {
      margin-inline: auto;
      max-width: var(--container-6xl, 72rem);
    }
    .introduction {
      margin-bottom: calc(var(--spacing, 0.25rem) * 12);
      max-width: var(--container-2xl, 42rem);
      .eyebrow {
        margin-bottom: calc(var(--spacing, 0.25rem) * 3);
        font-size: var(--text-sm, 0.875rem);
        line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
        --tw-font-weight: var(--font-weight-bold, 700);
        font-weight: var(--font-weight-bold, 700);
        --tw-tracking: var(--tracking-widest, 0.1em);
        letter-spacing: var(--tracking-widest, 0.1em);
        text-transform: uppercase;
        color: var(--catalogAccent);
      }
      .title {
        margin-bottom: calc(var(--spacing, 0.25rem) * 4);
        font-size: var(--text-5xl, 3rem);
        line-height: var(--tw-leading, var(--text-5xl--line-height, 1));
        --tw-font-weight: var(--font-weight-bold, 700);
        font-weight: var(--font-weight-bold, 700);
      }
      .description {
        font-size: var(--text-lg, 1.125rem);
        line-height: var(--tw-leading, var(--text-lg--line-height, calc(1.75 / 1.125)));
        --tw-leading: calc(var(--spacing, 0.25rem) * 8);
        line-height: calc(var(--spacing, 0.25rem) * 8);
        color: var(--catalogMuted);
      }
    }
    .themeList {
      display: grid;
      grid-template-columns: repeat(1, minmax(0, 1fr));
      gap: calc(var(--spacing, 0.25rem) * 5);
      @media (width >= 48rem) {
        grid-template-columns: repeat(2, minmax(0, 1fr));
      }
      @media (width >= 80rem) {
        grid-template-columns: repeat(3, minmax(0, 1fr));
      }
    }
    .themeCard {
      display: flex;
      min-height: calc(var(--spacing, 0.25rem) * 52);
      flex-direction: column;
      border-radius: var(--radius-2xl, 1rem);
      border-style: var(--tw-border-style);
      border-width: 1px;
      padding: calc(var(--spacing, 0.25rem) * 6);
      background: var(--catalogSurface);
      border-color: var(--catalogBorder);
      .number {
        margin-bottom: calc(var(--spacing, 0.25rem) * 4);
        font-size: var(--text-sm, 0.875rem);
        line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
        --tw-font-weight: var(--font-weight-bold, 700);
        font-weight: var(--font-weight-bold, 700);
        --tw-tracking: var(--tracking-widest, 0.1em);
        letter-spacing: var(--tracking-widest, 0.1em);
        color: var(--catalogAccent);
      }
      .title {
        margin-bottom: calc(var(--spacing, 0.25rem) * 6);
        font-size: var(--text-2xl, 1.5rem);
        line-height: var(--tw-leading, var(--text-2xl--line-height, calc(2 / 1.5)));
        --tw-font-weight: var(--font-weight-semibold, 600);
        font-weight: var(--font-weight-semibold, 600);
      }
      .description {
        margin-bottom: calc(var(--spacing, 0.25rem) * 6);
        font-size: var(--text-sm, 0.875rem);
        line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
        --tw-leading: calc(var(--spacing, 0.25rem) * 6);
        line-height: calc(var(--spacing, 0.25rem) * 6);
        color: var(--catalogMuted);
      }
      .links {
        margin-top: auto;
        display: flex;
        flex-wrap: wrap;
        column-gap: calc(var(--spacing, 0.25rem) * 5);
        row-gap: calc(var(--spacing, 0.25rem) * 2);
        font-size: var(--text-sm, 0.875rem);
        line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
        --tw-font-weight: var(--font-weight-medium, 500);
        font-weight: var(--font-weight-medium, 500);
        a {
          text-decoration-line: underline;
          text-underline-offset: 4px;
          &:hover {
            color: var(--catalogAccent);
          }
        }
        .preview {
          color: var(--catalogAccent);
        }
      }
    }
  }
}
.themeRoot {
  --surfaceSoft: #eee7d5;
  --theme-accent: #8d5937;
  --theme-accent-hover: #aa7350;
  --theme-accent-soft: #e8d4c5;
  --theme-border: #bcb088;
  --theme-card-accent: var(--theme-accent);
  --theme-card-border: rgb(188 176 136 / 0.65);
  --theme-card-border-hover: #c08a65;
  --theme-card-gradient-end: #c08a65;
  --theme-card-gradient-middle: #bcb088;
  --theme-card-gradient-start: #7b7c5f;
  --theme-card-surface: #fffcf6;
  --theme-card-text: var(--theme-text-muted);
  --theme-card-title: var(--theme-text);
  --theme-cardsGlass: rgb(255 252 246 / 0.78);
  --theme-cardsGlow: rgb(192 138 101 / 0.22);
  --theme-cardsMuted: var(--theme-text-muted);
  --theme-cardsOnAccent: var(--theme-on-accent);
  --theme-cardsText: var(--theme-card-text);
  --theme-cta-accent: var(--theme-accent);
  --theme-cta-accent-hover: var(--theme-accent-hover);
  --theme-footer-action: var(--theme-accent);
  --theme-footer-action-hover: var(--theme-accent-hover);
  --theme-footer-border: var(--theme-border);
  --theme-footer-icon: var(--theme-text-muted);
  --theme-footer-input-border: var(--theme-border);
  --theme-footer-input-surface: var(--theme-surface);
  --theme-footer-link: var(--theme-text-muted);
  --theme-footer-link-hover: var(--theme-accent);
  --theme-footer-on-action: var(--theme-on-accent);
  --theme-footer-surface: var(--surfaceSoft);
  --theme-footer-text: var(--theme-text-muted);
  --theme-footer-text-subtle: var(--theme-text-subtle);
  --theme-footer-title: var(--theme-text);
  --theme-heading-description: var(--theme-text-muted);
  --theme-heading-subtitle: var(--theme-text-subtle);
  --theme-heading-supertitle-background: var(--theme-accent);
  --theme-heading-supertitle-text: var(--theme-on-accent);
  --theme-heading-title: var(--theme-text);
  --theme-hero-background-end: var(--theme-surface-muted);
  --theme-hero-background-start: var(--theme-surface);
  --theme-hero-emphasis-end: var(--theme-highlight);
  --theme-hero-emphasis-start: var(--theme-accent);
  --theme-heroSecondaryCtaAccent: #f6f2e8;
  --theme-highlight: #bcb088;
  --theme-infoAccent: var(--theme-card-accent);
  --theme-infoBorder: var(--theme-card-border);
  --theme-infoBorderHover: var(--theme-card-border-hover);
  --theme-infoGradientEnd: var(--theme-card-gradient-end);
  --theme-infoGradientMiddle: var(--theme-card-gradient-middle);
  --theme-infoGradientStart: var(--theme-card-gradient-start);
  --theme-infoOnAccent: var(--theme-on-accent);
  --theme-infoOverlay: rgb(65 66 49 / 0.72);
  --theme-infoSurface: var(--theme-card-surface);
  --theme-infoSurfaceSoft: var(--surfaceSoft);
  --theme-infoText: var(--theme-card-text);
  --theme-menu-accent: var(--theme-accent);
  --theme-on-accent: #fffaf2;
  --theme-overlay-medium: rgb(85 86 65 / 0.48);
  --theme-pagination-active: var(--theme-accent);
  --theme-pagination-active-border: var(--theme-accent);
  --theme-pagination-border: var(--theme-border);
  --theme-pagination-border-hover: var(--theme-accent);
  --theme-pagination-on-active: var(--theme-on-accent);
  --theme-pagination-surface: var(--theme-surface);
  --theme-pagination-surface-hover: var(--theme-accent-soft);
  --theme-pagination-text: var(--theme-text);
  --theme-pagination-text-hover: var(--theme-accent-hover);
  --theme-shadow: rgb(123 124 95 / 0.18);
  --theme-shadow-strong: rgb(85 86 65 / 0.28);
  --theme-socialList-accent-hover: var(--theme-accent-hover);
  --theme-socialList-surface-hover: var(--theme-accent-soft);
  --theme-socialList-text: var(--theme-text);
  --theme-socialList-text-muted: var(--theme-text-subtle);
  --theme-socialList-title: var(--theme-text);
  --theme-surface: #f6f2e8;
  --theme-surface-muted: #ded6bb;
  --theme-taxonomy-accent: var(--theme-accent);
  --theme-taxonomy-accent-hover: var(--theme-accent-hover);
  --theme-taxonomy-border: var(--theme-border);
  --theme-taxonomy-surface: var(--theme-surface);
  --theme-taxonomy-surface-hover: var(--theme-accent-soft);
  --theme-taxonomy-text: var(--theme-text);
  --theme-taxonomy-text-muted: var(--theme-text-subtle);
  --theme-text: #555641;
  --theme-text-muted: #68694f;
  --theme-text-subtle: #5b5c45;
}
@layer themePart {
  .introHero > .container {
    max-width: var(--breakpoint-xl, 80rem);
    @media (width >= 96rem) {
      max-width: var(--breakpoint-2xl, 96rem);
    }
  }
  .introHero .subtitle {
    display: none;
    @media (width >= 40rem) {
      display: block;
    }
  }
  .introHero .description {
    display: none;
    @media (width >= 48rem) {
      display: block;
    }
  }
  .introHero .actions {
    display: none;
    @media (width >= 64rem) {
      display: flex;
    }
  }
}
:root[data-theme='dark'] .themeRoot {
  --surfaceSoft: #202118;
  --theme-accent: #c9bc8d;
  --theme-accent-hover: #eee9d8;
  --theme-accent-soft: #292a1f;
  --theme-border: #57523e;
  --theme-card-accent: var(--theme-accent);
  --theme-card-border: rgb(119 112 86 / 0.65);
  --theme-card-border-hover: var(--theme-accent);
  --theme-card-gradient-end: #c9bc8d;
  --theme-card-gradient-middle: #777056;
  --theme-card-gradient-start: #57523e;
  --theme-card-surface: #202119;
  --theme-card-title: var(--theme-text);
  --theme-cardsGlass: rgb(32 33 25 / 0.84);
  --theme-highlight: #777056;
  --theme-on-accent: #211a15;
  --theme-shadow: rgb(0 0 0 / 0.38);
  --theme-shadow-strong: rgb(0 0 0 / 0.58);
  --theme-surface: #171813;
  --theme-surface-muted: #292a1f;
  --theme-text: #eee9d8;
  --theme-text-muted: #c9c1a5;
  --theme-text-subtle: #a89f83;
}
:root[data-theme='dark'] {
  color-scheme: dark;
}
:root[data-theme='light'] {
  color-scheme: light;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme='light']) {
    color-scheme: dark;
  }
  :root:not([data-theme='light']) .themeRoot {
    --surfaceSoft: #202118;
    --theme-accent: #c9bc8d;
    --theme-accent-hover: #eee9d8;
    --theme-accent-soft: #292a1f;
    --theme-border: #57523e;
    --theme-card-accent: var(--theme-accent);
    --theme-card-border: rgb(119 112 86 / 0.65);
    --theme-card-border-hover: var(--theme-accent);
    --theme-card-gradient-end: #c9bc8d;
    --theme-card-gradient-middle: #777056;
    --theme-card-gradient-start: #57523e;
    --theme-card-surface: #202119;
    --theme-card-title: var(--theme-text);
    --theme-cardsGlass: rgb(32 33 25 / 0.84);
    --theme-highlight: #777056;
    --theme-on-accent: #211a15;
    --theme-shadow: rgb(0 0 0 / 0.38);
    --theme-shadow-strong: rgb(0 0 0 / 0.58);
    --theme-surface: #171813;
    --theme-surface-muted: #292a1f;
    --theme-text: #eee9d8;
    --theme-text-muted: #c9c1a5;
    --theme-text-subtle: #a89f83;
  }
}
@layer themePart {
  .listSection, .columnGroup {
    margin-top: calc(var(--spacing, 0.25rem) * 12);
    padding-block: calc(var(--spacing, 0.25rem) * 12);
    @media (width >= 80rem) {
      padding-block: calc(var(--spacing, 0.25rem) * 20);
    }
  }
  .cardsList {
    margin-top: calc(var(--spacing, 0.25rem) * 8);
    :where(& > :not(:last-child)) {
      --tw-space-y-reverse: 0;
      margin-block-start: calc(calc(var(--spacing, 0.25rem) * 6) * var(--tw-space-y-reverse));
      margin-block-end: calc(calc(var(--spacing, 0.25rem) * 6) * calc(1 - var(--tw-space-y-reverse)));
    }
    @media (width >= 80rem) {
      margin-top: calc(var(--spacing, 0.25rem) * 12);
    }
  }
  .cardsColumns {
    margin-top: calc(var(--spacing, 0.25rem) * 8);
    columns: 1;
    gap: calc(var(--spacing, 0.25rem) * 8);
    @media (width >= 64rem) {
      columns: 2;
    }
    @media (width >= 80rem) {
      margin-top: calc(var(--spacing, 0.25rem) * 12);
    }
    & > li {
      margin-bottom: calc(var(--spacing, 0.25rem) * 8);
      break-inside: avoid;
    }
  }
  .heroCentered, .twoPartInfo, .cardsProfiles, .cardsStatistics, .cardsChronology {
    padding-block: calc(var(--spacing, 0.25rem) * 16);
    @media (width >= 80rem) {
      padding-block: calc(var(--spacing, 0.25rem) * 24);
    }
  }
  .heroCentered .featureContent {
    margin-inline: auto;
    max-width: var(--container-4xl, 56rem);
    text-align: center;
  }
  .heroCentered .accentRule {
    margin-inline: auto;
    margin-bottom: calc(var(--spacing, 0.25rem) * 8);
    height: 1px;
    width: calc(var(--spacing, 0.25rem) * 16);
    background-image: linear-gradient( to right, var(--theme-accent), var(--theme-highlight) );
  }
  .featureDescription {
    margin-inline: auto;
    margin-top: calc(var(--spacing, 0.25rem) * 6);
    max-width: var(--container-3xl, 48rem);
    font-size: var(--text-lg, 1.125rem);
    line-height: var(--tw-leading, var(--text-lg--line-height, calc(1.75 / 1.125)));
    --tw-leading: calc(var(--spacing, 0.25rem) * 8);
    line-height: calc(var(--spacing, 0.25rem) * 8);
    color: var(--theme-text-muted);
  }
  .twoPartInfo .infoParts {
    margin-top: calc(var(--spacing, 0.25rem) * 12);
    display: grid;
    gap: calc(var(--spacing, 0.25rem) * 10);
    @media (width >= 64rem) {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    @media (width >= 64rem) {
      gap: calc(var(--spacing, 0.25rem) * 16);
    }
  }
  .twoPartInfo .infoPart {
    border-inline-start-style: var(--tw-border-style);
    border-inline-start-width: 2px;
    padding-inline-start: calc(var(--spacing, 0.25rem) * 6);
    border-color: var(--theme-accent);
  }
  .twoPartInfo .infoPart:nth-child(2) {
    border-color: var(--theme-highlight);
  }
  .twoPartInfo .infoPart:only-child {
    grid-column: 1 / -1;
  }
  .infoPart .heading {
    margin-bottom: 0px;
  }
  .infoPart p {
    margin-top: calc(var(--spacing, 0.25rem) * 6);
    --tw-leading: calc(var(--spacing, 0.25rem) * 8);
    line-height: calc(var(--spacing, 0.25rem) * 8);
    color: var(--theme-text-muted);
  }
  .quoteCentered, .callToActionPanel {
    padding-block: calc(var(--spacing, 0.25rem) * 20);
    @media (width >= 80rem) {
      padding-block: calc(var(--spacing, 0.25rem) * 32);
    }
  }
  .quoteCentered figure {
    margin-inline: auto;
    max-width: var(--container-5xl, 64rem);
    text-align: center;
  }
  .quoteCentered blockquote p {
    font-size: var(--text-3xl, 1.875rem);
    line-height: var(--tw-leading, var(--text-3xl--line-height, calc(2.25 / 1.875)));
    --tw-leading: var(--leading-tight, 1.25);
    line-height: var(--leading-tight, 1.25);
    --tw-font-weight: var(--font-weight-bold, 700);
    font-weight: var(--font-weight-bold, 700);
    @media (width >= 48rem) {
      font-size: var(--text-5xl, 3rem);
      line-height: var(--tw-leading, var(--text-5xl--line-height, 1));
    }
    @media (width >= 48rem) {
      --tw-leading: var(--leading-tight, 1.25);
      line-height: var(--leading-tight, 1.25);
    }
    color: var(--theme-text);
  }
  .quoteCentered figcaption {
    margin-top: calc(var(--spacing, 0.25rem) * 10);
    color: var(--theme-text-muted);
  }
  .callToActionPanel .panelContent {
    border-radius: var(--radius-3xl, 1.5rem);
    border-style: var(--tw-border-style);
    border-width: 1px;
    padding-inline: calc(var(--spacing, 0.25rem) * 8);
    padding-block: calc(var(--spacing, 0.25rem) * 14);
    text-align: center;
    @media (width >= 48rem) {
      padding-inline: calc(var(--spacing, 0.25rem) * 16);
    }
    @media (width >= 48rem) {
      padding-block: calc(var(--spacing, 0.25rem) * 20);
    }
    border-color: var(--theme-border);
  }
  .callToActionPanel .heading {
    margin-inline: auto;
    max-width: var(--container-3xl, 48rem);
  }
  .callToActionPanel .panelActions {
    margin-top: calc(var(--spacing, 0.25rem) * 10);
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: calc(var(--spacing, 0.25rem) * 4);
  }
  .callToActionPanel .panelActions:empty {
    display: none;
  }
  .cardsProfiles .items {
    margin-top: calc(var(--spacing, 0.25rem) * 12);
    display: grid;
    gap: calc(var(--spacing, 0.25rem) * 8);
    @media (width >= 40rem) {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    @media (width >= 64rem) {
      grid-template-columns: repeat(3, minmax(0, 1fr));
    }
    @media (width >= 80rem) {
      grid-template-columns: repeat(4, minmax(0, 1fr));
    }
  }
  .profileCard {
    text-align: center;
    & .portrait {
      overflow: hidden;
      border-radius: var(--radius-3xl, 1.5rem);
    }
    & .profileImage {
      aspect-ratio: 1 / 1;
      width: 100%;
      object-fit: cover;
      transition-property: transform, translate, scale, rotate;
      transition-timing-function: var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(0.4, 0, 0.2, 1)));
      transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
      --tw-duration: 500ms;
      transition-duration: 500ms;
    }
    &:hover .profileImage {
      --tw-scale-x: 105%;
      --tw-scale-y: 105%;
      --tw-scale-z: 105%;
      scale: var(--tw-scale-x) var(--tw-scale-y);
    }
    & h3 {
      margin-top: calc(var(--spacing, 0.25rem) * 6);
      font-size: var(--text-xl, 1.25rem);
      line-height: var(--tw-leading, var(--text-xl--line-height, calc(1.75 / 1.25)));
      --tw-font-weight: var(--font-weight-semibold, 600);
      font-weight: var(--font-weight-semibold, 600);
      color: var(--theme-text);
    }
    & .subtitle {
      margin-top: var(--spacing, 0.25rem);
      font-size: var(--text-sm, 0.875rem);
      line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
      --tw-font-weight: var(--font-weight-medium, 500);
      font-weight: var(--font-weight-medium, 500);
      --tw-tracking: var(--tracking-wide, 0.025em);
      letter-spacing: var(--tracking-wide, 0.025em);
      text-transform: uppercase;
      color: var(--theme-accent);
    }
    & .text {
      margin-top: calc(var(--spacing, 0.25rem) * 4);
      --tw-leading: calc(var(--spacing, 0.25rem) * 7);
      line-height: calc(var(--spacing, 0.25rem) * 7);
      color: var(--theme-text-muted);
    }
  }
  .cardsStatistics .items {
    margin-top: calc(var(--spacing, 0.25rem) * 14);
    display: grid;
    :where(& > :not(:last-child)) {
      --tw-divide-y-reverse: 0;
      border-bottom-style: var(--tw-border-style);
      border-top-style: var(--tw-border-style);
      border-top-width: calc(1px * var(--tw-divide-y-reverse));
      border-bottom-width: calc(1px * calc(1 - var(--tw-divide-y-reverse)));
    }
    border-block-style: var(--tw-border-style);
    border-block-width: 1px;
    @media (width >= 40rem) {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    @media (width >= 40rem) {
      :where(& > :not(:last-child)) {
        --tw-divide-x-reverse: 0;
        border-inline-style: var(--tw-border-style);
        border-inline-start-width: calc(1px * var(--tw-divide-x-reverse));
        border-inline-end-width: calc(1px * calc(1 - var(--tw-divide-x-reverse)));
      }
    }
    @media (width >= 40rem) {
      :where(& > :not(:last-child)) {
        --tw-divide-y-reverse: 0;
        border-bottom-style: var(--tw-border-style);
        border-top-style: var(--tw-border-style);
        border-top-width: calc(0px * var(--tw-divide-y-reverse));
        border-bottom-width: calc(0px * calc(1 - var(--tw-divide-y-reverse)));
      }
    }
    @media (width >= 80rem) {
      grid-template-columns: repeat(4, minmax(0, 1fr));
    }
    border-color: var(--theme-border);
  }
  .cardsStatistics .items > li {
    border-color: var(--theme-border);
  }
  .statisticCard {
    padding-inline: calc(var(--spacing, 0.25rem) * 8);
    padding-block: calc(var(--spacing, 0.25rem) * 10);
    text-align: center;
    & .value {
      font-size: var(--text-4xl, 2.25rem);
      line-height: var(--tw-leading, var(--text-4xl--line-height, calc(2.5 / 2.25)));
      --tw-font-weight: var(--font-weight-bold, 700);
      font-weight: var(--font-weight-bold, 700);
      --tw-tracking: var(--tracking-tight, -0.025em);
      letter-spacing: var(--tracking-tight, -0.025em);
      @media (width >= 48rem) {
        font-size: var(--text-5xl, 3rem);
        line-height: var(--tw-leading, var(--text-5xl--line-height, 1));
      }
      color: var(--theme-text);
    }
    & h3 {
      margin-top: calc(var(--spacing, 0.25rem) * 4);
      font-size: var(--text-lg, 1.125rem);
      line-height: var(--tw-leading, var(--text-lg--line-height, calc(1.75 / 1.125)));
      --tw-font-weight: var(--font-weight-semibold, 600);
      font-weight: var(--font-weight-semibold, 600);
      color: var(--theme-text);
    }
    & p {
      margin-top: calc(var(--spacing, 0.25rem) * 3);
      --tw-leading: calc(var(--spacing, 0.25rem) * 7);
      line-height: calc(var(--spacing, 0.25rem) * 7);
      color: var(--theme-text-muted);
    }
  }
  .cardsChronology .items {
    position: relative;
    margin-inline-start: calc(var(--spacing, 0.25rem) * 3);
    margin-top: calc(var(--spacing, 0.25rem) * 14);
    border-inline-start-style: var(--tw-border-style);
    border-inline-start-width: 1px;
    border-color: var(--theme-border);
  }
  .chronologyCard {
    position: relative;
    padding-inline-start: calc(var(--spacing, 0.25rem) * 8);
    padding-bottom: calc(var(--spacing, 0.25rem) * 12);
    &:last-child {
      padding-bottom: 0px;
    }
    & .marker {
      position: absolute;
      inset-inline-start: calc(9px * -1);
      top: var(--spacing, 0.25rem);
      height: calc(var(--spacing, 0.25rem) * 4);
      width: calc(var(--spacing, 0.25rem) * 4);
      border-radius: calc(infinity * 1px);
      --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(4px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
      box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
      --tw-ring-color: var(--theme-surface);
      background-image: linear-gradient( to bottom right, var(--theme-accent), var(--theme-highlight) );
    }
    & .supertitle {
      font-size: var(--text-sm, 0.875rem);
      line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
      --tw-font-weight: var(--font-weight-semibold, 600);
      font-weight: var(--font-weight-semibold, 600);
      --tw-tracking: var(--tracking-wider, 0.05em);
      letter-spacing: var(--tracking-wider, 0.05em);
      text-transform: uppercase;
      color: var(--theme-accent);
    }
    & h3 {
      margin-top: calc(var(--spacing, 0.25rem) * 2);
      font-size: var(--text-2xl, 1.5rem);
      line-height: var(--tw-leading, var(--text-2xl--line-height, calc(2 / 1.5)));
      --tw-font-weight: var(--font-weight-semibold, 600);
      font-weight: var(--font-weight-semibold, 600);
      color: var(--theme-text);
    }
    & .text {
      margin-top: calc(var(--spacing, 0.25rem) * 3);
      max-width: var(--container-2xl, 42rem);
      --tw-leading: calc(var(--spacing, 0.25rem) * 8);
      line-height: calc(var(--spacing, 0.25rem) * 8);
      color: var(--theme-text-muted);
    }
  }
  .cta {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: calc(var(--spacing, 0.25rem) * 2);
    border-start-start-radius: calc(infinity * 1px);
    border-start-end-radius: calc(infinity * 1px);
    border-end-end-radius: 0;
    border-end-start-radius: calc(infinity * 1px);
    padding-inline: calc(var(--spacing, 0.25rem) * 5);
    padding-block: calc(var(--spacing, 0.25rem) * 3);
    font-size: var(--text-base, 1rem);
    line-height: var(--tw-leading, var(--text-base--line-height, calc(1.5 / 1)));
    --tw-font-weight: var(--font-weight-semibold, 600);
    font-weight: var(--font-weight-semibold, 600);
    --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);
    transition-property: all;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(0.4, 0, 0.2, 1)));
    transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
    --tw-duration: 300ms;
    transition-duration: 300ms;
    background-color: var(--theme-cta-accent);
    color: var(--theme-on-accent);
    &:hover {
      --tw-translate-y: calc(var(--spacing, 0.25rem) * -1);
      translate: var(--tw-translate-x) var(--tw-translate-y);
      --tw-shadow: 0 20px 25px -5px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 8px 10px -6px 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);
      background-color: var(--theme-cta-accent-hover);
    }
    &.secondary {
      border-style: var(--tw-border-style);
      border-width: 1px;
      background-color: transparent;
      border-color: var(--theme-cta-accent);
      color: var(--theme-cta-accent);
    }
    &.secondary:hover {
      background-color: var(--theme-accent-soft);
    }
    &.primaryAction.secondary {
      border-color: var(--theme-text);
      color: var(--theme-text);
    }
  }
  .interactionGlyph {
    display: inline-flex;
    height: calc(var(--spacing, 0.25rem) * 6);
    width: calc(var(--spacing, 0.25rem) * 6);
    flex-shrink: 0;
    & > svg {
      height: 100%;
      width: 100%;
    }
  }
}
@layer themeLayout {
  .container {
    margin-inline: auto;
    width: 100%;
    padding-inline: calc(var(--spacing, 0.25rem) * 4);
    @media (width >= 40rem) {
      max-width: 400px;
    }
    @media (width >= 48rem) {
      max-width: var(--breakpoint-sm, 40rem);
    }
    @media (width >= 64rem) {
      max-width: var(--breakpoint-md, 48rem);
    }
    @media (width >= 80rem) {
      max-width: var(--breakpoint-lg, 64rem);
    }
    @media (width >= 96rem) {
      max-width: var(--breakpoint-xl, 80rem);
    }
  }
}
@layer themePart {
  .cardsSection {
    margin-top: calc(var(--spacing, 0.25rem) * 12);
    padding-block: calc(var(--spacing, 0.25rem) * 12);
    @media (width >= 48rem) {
      margin-top: 0px;
    }
    @media (width >= 80rem) {
      padding-block: calc(var(--spacing, 0.25rem) * 20);
    }
  }
  .cardsGrid {
    margin-top: calc(var(--spacing, 0.25rem) * 8);
    display: grid;
    gap: calc(var(--spacing, 0.25rem) * 4);
    @media (width >= 40rem) {
      gap: calc(var(--spacing, 0.25rem) * 6);
    }
    @media (width >= 48rem) {
      gap: calc(var(--spacing, 0.25rem) * 8);
    }
    @media (width >= 64rem) {
      grid-template-columns: repeat(3, minmax(0, 1fr));
    }
    @media (width >= 80rem) {
      margin-top: calc(var(--spacing, 0.25rem) * 12);
    }
  }
}
@layer themeLayout {
  .themeRoot {
    display: flex;
    min-height: 100vh;
    flex-direction: column;
    justify-content: space-between;
    background-color: var(--theme-surface);
    color: var(--theme-text);
  }
  .pageContent {
    flex: 1;
  }
  .menuHeaderBorder {
    border-color: var(--theme-border);
  }
  .desktopNavigationBar > .items {
    display: none;
    width: 100%;
    align-items: center;
    @media (width >= 48rem) {
      display: flex;
    }
    @media (width >= 48rem) {
      width: auto;
    }
    @media (width >= 48rem) {
      :where(& > :not(:last-child)) {
        --tw-space-x-reverse: 0;
        margin-inline-start: calc(calc(var(--spacing, 0.25rem) * 6) * var(--tw-space-x-reverse));
        margin-inline-end: calc(calc(var(--spacing, 0.25rem) * 6) * calc(1 - var(--tw-space-x-reverse)));
      }
    }
  }
  .desktopNavigationBar .item {
    position: relative;
  }
  .desktopNavigationBar .link {
    display: block;
    padding-block: calc(var(--spacing, 0.25rem) * 2);
    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, cubic-bezier(0.4, 0, 0.2, 1)));
    transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
    @media (width >= 48rem) {
      padding-block: 0px;
    }
    color: var(--theme-text);
  }
  .desktopNavigationBar .label {
    display: block;
    padding-block: calc(var(--spacing, 0.25rem) * 2);
    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, cubic-bezier(0.4, 0, 0.2, 1)));
    transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
    @media (width >= 48rem) {
      padding-block: 0px;
    }
    color: var(--theme-text);
  }
  .desktopNavigationBar .link:hover {
    color: var(--theme-menu-accent);
  }
  .desktopNavigationBar .link:focus-visible {
    color: var(--theme-menu-accent);
  }
  .desktopNavigationBar .item > .items {
    position: absolute;
    inset-inline-start: calc(var(--spacing, 0.25rem) * 0);
    top: 100%;
    z-index: 40;
    margin-top: calc(var(--spacing, 0.25rem) * 2);
    min-width: 180px;
    border-radius: var(--radius-md, 0.375rem);
    background-color: var(--theme-surface);
    box-shadow: 0 10px 25px var(--theme-shadow);
    color: var(--theme-text);
  }
  .desktopNavigationBar .item > .items .item {
    padding-inline: calc(var(--spacing, 0.25rem) * 4);
    padding-block: calc(var(--spacing, 0.25rem) * 2);
  }
  .desktopNavigationBar .item > .items .item:hover {
    background-color: var(--theme-surface-muted);
  }
  .mobileSidebarMenu {
    position: fixed;
    inset-inline-start: calc(var(--spacing, 0.25rem) * 0);
    top: 0px;
    z-index: 50;
    height: 100vh;
    width: 90%;
    max-width: 300px;
    transform: var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,);
    overflow-y: auto;
    padding-top: calc(var(--spacing, 0.25rem) * 10);
    transition-property: transform, translate, scale, rotate;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(0.4, 0, 0.2, 1)));
    transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
    --tw-duration: 300ms;
    transition-duration: 300ms;
    --tw-ease: var(--ease-in-out, cubic-bezier(0.4, 0, 0.2, 1));
    transition-timing-function: var(--ease-in-out, cubic-bezier(0.4, 0, 0.2, 1));
    @media (width >= 64rem) {
      display: none;
    }
    background-color: var(--theme-surface);
    color: var(--theme-text);
    &[data-open='true'] {
      --tw-translate-x: 0px;
      translate: var(--tw-translate-x) var(--tw-translate-y);
    }
    &[data-open='false'] {
      pointer-events: none;
      &:where(:dir(ltr), [dir="ltr"], [dir="ltr"] *) {
        --tw-translate-x: -100%;
        translate: var(--tw-translate-x) var(--tw-translate-y);
      }
      &:where(:dir(rtl), [dir="rtl"], [dir="rtl"] *) {
        --tw-translate-x: 100%;
        translate: var(--tw-translate-x) var(--tw-translate-y);
      }
    }
  }
  .mobileSidebarMenu .item {
    border-bottom-style: var(--tw-border-style);
    border-bottom-width: 1px;
    border-color: var(--theme-border);
  }
  .mobileSidebarMenu .link {
    display: block;
    width: 100%;
    padding-inline: calc(var(--spacing, 0.25rem) * 6);
    padding-block: calc(var(--spacing, 0.25rem) * 4);
    text-align: start;
    transition-property: all;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(0.4, 0, 0.2, 1)));
    transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
    --tw-duration: 300ms;
    transition-duration: 300ms;
    color: var(--theme-text);
  }
  .mobileSidebarMenu .label {
    display: block;
    width: 100%;
    padding-inline: calc(var(--spacing, 0.25rem) * 6);
    padding-block: calc(var(--spacing, 0.25rem) * 4);
    text-align: start;
    transition-property: all;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(0.4, 0, 0.2, 1)));
    transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
    --tw-duration: 300ms;
    transition-duration: 300ms;
    color: var(--theme-text);
  }
  .mobileSidebarMenu .toggle {
    display: block;
    width: 100%;
    padding-inline: calc(var(--spacing, 0.25rem) * 6);
    padding-block: calc(var(--spacing, 0.25rem) * 4);
    text-align: start;
    transition-property: all;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(0.4, 0, 0.2, 1)));
    transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
    --tw-duration: 300ms;
    transition-duration: 300ms;
    color: var(--theme-text);
  }
  .mobileSidebarMenu .link:hover {
    padding-inline-start: calc(var(--spacing, 0.25rem) * 7);
    --tw-font-weight: var(--font-weight-bold, 700);
    font-weight: var(--font-weight-bold, 700);
    background-color: var(--surfaceSoft);
  }
  .mobileSidebarMenu .link:focus-visible {
    padding-inline-start: calc(var(--spacing, 0.25rem) * 7);
    --tw-font-weight: var(--font-weight-bold, 700);
    font-weight: var(--font-weight-bold, 700);
    background-color: var(--surfaceSoft);
  }
  .mobileSidebarMenu .toggle:hover {
    padding-inline-start: calc(var(--spacing, 0.25rem) * 7);
    --tw-font-weight: var(--font-weight-bold, 700);
    font-weight: var(--font-weight-bold, 700);
    background-color: var(--surfaceSoft);
  }
  .mobileSidebarMenu .toggle:focus-visible {
    padding-inline-start: calc(var(--spacing, 0.25rem) * 7);
    --tw-font-weight: var(--font-weight-bold, 700);
    font-weight: var(--font-weight-bold, 700);
    background-color: var(--surfaceSoft);
  }
  .mobileSidebarMenu .toggle {
    display: flex;
    align-items: center;
    justify-content: space-between;
  }
  .mobileSidebarMenu .expandIndicator::after {
    content: '+';
  }
  .mobileSidebarMenu .item[data-expanded='true'] > .toggle .expandIndicator::after {
    content: '−';
  }
  .mobileSidebarMenu .item > .items {
    padding-inline-start: calc(var(--spacing, 0.25rem) * 8);
  }
  .mobileSidebarMenu > .actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: calc(var(--spacing, 0.25rem) * 3);
    padding-inline: calc(var(--spacing, 0.25rem) * 6);
    padding-block: calc(var(--spacing, 0.25rem) * 4);
    border-color: var(--theme-border);
    border-top-width: 1px;
  }
  .mobileSidebarMenu > .actions > * {
    position: static;
  }
  .menuToggle {
    color: var(--theme-text);
  }
  .themeSelector {
    position: relative;
    display: flex;
    height: calc(var(--spacing, 0.25rem) * 8);
    width: calc(var(--spacing, 0.25rem) * 8);
    cursor: pointer;
    align-items: center;
    justify-content: center;
    border-radius: calc(infinity * 1px);
    border-style: var(--tw-border-style);
    border-width: 1px;
    padding-inline: calc(var(--spacing, 0.25rem) * 2);
    padding-block: var(--spacing, 0.25rem);
    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, cubic-bezier(0.4, 0, 0.2, 1)));
    transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
    border-color: var(--theme-border);
    color: var(--theme-text);
    & svg {
      height: calc(var(--spacing, 0.25rem) * 5);
      width: calc(var(--spacing, 0.25rem) * 5);
      fill: none;
      stroke: currentColor;
      stroke-linecap: round;
      stroke-linejoin: round;
      stroke-width: 2;
    }
  }
  .backdrop {
    position: fixed;
    inset-inline-start: calc(var(--spacing, 0.25rem) * 0);
    top: 0px;
    z-index: 30;
    height: 100vh;
    width: 100vw;
    transition-property: opacity;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(0.4, 0, 0.2, 1)));
    transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
    --tw-duration: 500ms;
    transition-duration: 500ms;
    background-color: var(--theme-overlay-medium);
  }
  .visibleBackdrop {
    pointer-events: auto;
    opacity: 100%;
  }
  .hiddenBackdrop {
    pointer-events: none;
    opacity: 0%;
  }
  .headerBox {
    cursor: pointer;
    border-radius: calc(infinity * 1px);
    border-style: var(--tw-border-style);
    border-width: 1px;
    padding-inline: calc(var(--spacing, 0.25rem) * 2);
    padding-block: calc(var(--spacing, 0.25rem) * 0.5);
    transition-property: all;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(0.4, 0, 0.2, 1)));
    transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
    background-color: var(--theme-surface);
    border-color: var(--theme-border);
    color: var(--theme-text);
    &:hover {
      background-color: var(--surfaceSoft);
    }
  }
  .headerOption:hover {
    background-color: var(--surfaceSoft);
  }
  .headerPopup {
    background-color: var(--theme-surface);
    border-color: var(--theme-border);
    color: var(--theme-text);
  }
}
:root {
  --cartBadgeSurface: #dc2626;
  --cartBadgeText: #fff;
}
@layer themeLayout {
  .miniCart {
    cursor: pointer;
    border-radius: calc(infinity * 1px);
    border-style: var(--tw-border-style);
    border-width: 1px;
    padding-inline: calc(var(--spacing, 0.25rem) * 2);
    padding-block: calc(var(--spacing, 0.25rem) * 0.5);
    transition-property: all;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(0.4, 0, 0.2, 1)));
    transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
    background-color: var(--theme-surface);
    border-color: var(--theme-border);
    color: var(--theme-text);
    &:hover {
      background-color: var(--surfaceSoft);
    }
  }
  .cartPreview {
    background-color: var(--theme-surface);
    border-color: var(--theme-border);
    color: var(--theme-text);
  }
  .cartSummary {
    background-color: var(--surfaceSoft);
  }
  .cartLink {
    color: var(--theme-text-muted);
    &:hover {
      color: var(--theme-accent);
    }
  }
  .miniCart .link {
    display: flex;
    align-items: center;
    gap: var(--spacing, 0.25rem);
    -webkit-user-select: none;
    user-select: none;
  }
  .miniCart .graphic {
    position: relative;
  }
  .miniCart .icon {
    height: calc(var(--spacing, 0.25rem) * 5);
    width: calc(var(--spacing, 0.25rem) * 5);
    fill: var(--theme-text-muted);
  }
  .miniCart .badge {
    position: absolute;
    inset-inline-end: calc(var(--spacing, 0.25rem) * -1);
    top: calc(var(--spacing, 0.25rem) * -1);
    display: flex;
    height: calc(var(--spacing, 0.25rem) * 4);
    min-width: calc(var(--spacing, 0.25rem) * 4);
    align-items: center;
    justify-content: center;
    border-radius: calc(infinity * 1px);
    padding-inline: var(--spacing, 0.25rem);
    font-size: 10px;
    --tw-leading: 1;
    line-height: 1;
    background-color: var(--cartBadgeSurface);
    color: var(--cartBadgeText);
  }
  .miniCart .title {
    font-size: var(--text-xs, 0.75rem);
    line-height: var(--tw-leading, var(--text-xs--line-height, calc(1 / 0.75)));
  }
  .miniCart .title.active {
    color: var(--color-custom-color11);
  }
  .gradientButton {
    display: inline-flex;
    cursor: pointer;
    align-items: center;
    justify-content: center;
    gap: calc(var(--spacing, 0.25rem) * 2);
    border-radius: var(--radius-md, 0.375rem);
    border-style: var(--tw-border-style);
    border-width: 1px;
    padding-inline: calc(var(--spacing, 0.25rem) * 4);
    padding-block: calc(var(--spacing, 0.25rem) * 3);
    --tw-font-weight: var(--font-weight-semibold, 600);
    font-weight: var(--font-weight-semibold, 600);
    transition-property: all;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(0.4, 0, 0.2, 1)));
    transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
    --tw-duration: 300ms;
    transition-duration: 300ms;
    -webkit-user-select: none;
    user-select: none;
    background-color: var(--theme-accent);
    border-color: var(--theme-accent);
    color: var(--theme-on-accent);
    &:hover {
      background-color: var(--theme-accent-hover);
      border-color: var(--theme-accent-hover);
    }
  }
  .paragraph {
    font-size: var(--text-base, 1rem);
    line-height: var(--tw-leading, var(--text-base--line-height, calc(1.5 / 1)));
    --tw-leading: var(--leading-relaxed, 1.625);
    line-height: var(--leading-relaxed, 1.625);
    color: var(--theme-text-muted);
  }
  .divider {
    margin-top: calc(var(--spacing, 0.25rem) * 2);
    margin-bottom: calc(var(--spacing, 0.25rem) * 6);
    height: 0.25px;
    background-color: var(--theme-border);
    color: var(--theme-text-muted);
  }
}
@layer themePart {
  .hero {
    display: flex;
    min-height: 0px;
    padding-top: calc(var(--spacing, 0.25rem) * 8);
    padding-bottom: calc(var(--spacing, 0.25rem) * 14);
    @media (width >= 48rem) {
      min-height: calc(100svh - 4rem);
    }
    @media (width >= 48rem) {
      padding-block: calc(var(--spacing, 0.25rem) * 12);
    }
    @media (width >= 64rem) {
      min-height: 100vh;
    }
    background-image: linear-gradient( to bottom, var(--theme-hero-background-start), var(--theme-hero-background-end) );
    & > .container {
      width: 100%;
    }
    & .layout {
      margin-inline: auto;
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: calc(var(--spacing, 0.25rem) * 6);
      padding-inline: calc(var(--spacing, 0.25rem) * 4);
      @media (width >= 40rem) {
        gap: calc(var(--spacing, 0.25rem) * 8);
      }
      @media (width >= 48rem) {
        flex-direction: row;
      }
      @media (width >= 96rem) {
        gap: calc(var(--spacing, 0.25rem) * 16);
      }
    }
    & .content {
      :where(& > :not(:last-child)) {
        --tw-space-y-reverse: 0;
        margin-block-start: calc(calc(var(--spacing, 0.25rem) * 6) * var(--tw-space-y-reverse));
        margin-block-end: calc(calc(var(--spacing, 0.25rem) * 6) * calc(1 - var(--tw-space-y-reverse)));
      }
      text-align: center;
      @media (width >= 48rem) {
        flex: 1;
      }
      @media (width >= 48rem) {
        text-align: start;
      }
    }
    & .title {
      font-family: var(--font-vazirmatn);
      font-size: var(--text-2xl, 1.5rem);
      line-height: var(--tw-leading, var(--text-2xl--line-height, calc(2 / 1.5)));
      --tw-leading: var(--leading-tight, 1.25);
      line-height: var(--leading-tight, 1.25);
      --tw-font-weight: var(--font-weight-bold, 700);
      font-weight: var(--font-weight-bold, 700);
      @media (width >= 40rem) {
        font-size: var(--text-3xl, 1.875rem);
        line-height: var(--tw-leading, var(--text-3xl--line-height, calc(2.25 / 1.875)));
      }
      @media (width >= 48rem) {
        font-size: var(--text-4xl, 2.25rem);
        line-height: var(--tw-leading, var(--text-4xl--line-height, calc(2.5 / 2.25)));
      }
      @media (width >= 64rem) {
        font-size: var(--text-5xl, 3rem);
        line-height: var(--tw-leading, var(--text-5xl--line-height, 1));
      }
      @media (width >= 80rem) {
        font-size: var(--text-6xl, 3.75rem);
        line-height: var(--tw-leading, var(--text-6xl--line-height, 1));
      }
      color: var(--theme-text);
    }
    & .supertitle {
      font-size: var(--text-lg, 1.125rem);
      line-height: var(--tw-leading, var(--text-lg--line-height, calc(1.75 / 1.125)));
      --tw-font-weight: var(--font-weight-semibold, 600);
      font-weight: var(--font-weight-semibold, 600);
      @media (width >= 48rem) {
        font-size: var(--text-xl, 1.25rem);
        line-height: var(--tw-leading, var(--text-xl--line-height, calc(1.75 / 1.25)));
      }
      @media (width >= 64rem) {
        font-size: var(--text-2xl, 1.5rem);
        line-height: var(--tw-leading, var(--text-2xl--line-height, calc(2 / 1.5)));
      }
      color: var(--theme-text);
    }
    & .subtitle {
      font-size: var(--text-sm, 0.875rem);
      line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
      --tw-tracking: var(--tracking-wide, 0.025em);
      letter-spacing: var(--tracking-wide, 0.025em);
      text-transform: uppercase;
      @media (width >= 48rem) {
        font-size: var(--text-base, 1rem);
        line-height: var(--tw-leading, var(--text-base--line-height, calc(1.5 / 1)));
      }
      color: var(--theme-text-subtle);
    }
    & .description {
      margin-inline: auto;
      max-width: var(--container-xl, 36rem);
      @media (width >= 48rem) {
        margin-inline: 0px;
      }
      color: var(--theme-text-muted);
    }
    & .emphasis {
      display: inline-block;
      color: var(--theme-hero-emphasis-start);
    }
    & .ltrEmphasis {
      background-image: linear-gradient( 135deg, var(--theme-hero-emphasis-start), var(--theme-hero-emphasis-end) );
    }
    & .rtlEmphasis {
      background-image: linear-gradient( 225deg, var(--theme-hero-emphasis-start), var(--theme-hero-emphasis-end) );
    }
  }
  @supports ((background-clip: text) or (-webkit-background-clip: text)) {
    .hero .emphasis {
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
      background-clip: text;
      color: transparent;
    }
  }
  .hero .details {
    display: none;
    :where(& > :not(:last-child)) {
      --tw-space-y-reverse: 0;
      margin-block-start: calc(calc(var(--spacing, 0.25rem) * 3) * var(--tw-space-y-reverse));
      margin-block-end: calc(calc(var(--spacing, 0.25rem) * 3) * calc(1 - var(--tw-space-y-reverse)));
    }
    @media (width >= 40rem) {
      display: block;
    }
  }
  .hero .actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: calc(var(--spacing, 0.25rem) * 4);
    @media (width >= 48rem) {
      justify-content: flex-start;
    }
  }
  @media (width >= 48rem) {
    .hero .media {
      display: flex;
      flex: 1;
      justify-content: flex-end;
    }
  }
  .hero .image {
    border-radius: var(--radius-2xl, 1rem);
    box-shadow: 0 15px 30px var(--theme-shadow);
  }
  .hero .cta.primaryAction:not(.secondary) {
    background-color: var(--theme-cta-accent);
    box-shadow: 0 10px 20px var(--theme-shadow);
    color: var(--theme-on-accent);
  }
  .hero .cta.primaryAction:not(.secondary):hover {
    background-color: var(--theme-cta-accent-hover);
    box-shadow: 0 16px 28px var(--theme-shadow-strong);
  }
  .hero .cta.primaryAction.secondary {
    background-color: transparent;
    border-color: var(--theme-text);
    box-shadow: 0 10px 20px var(--theme-shadow);
    color: var(--theme-text);
  }
  .hero .cta.primaryAction.secondary:hover {
    background-color: var(--theme-accent-soft);
    box-shadow: 0 16px 28px var(--theme-shadow-strong);
  }
}
.themeRoot {
  --wideHeroBodyText: rgb(242 246 237 / 0.82);
  --wideHeroEmphasisText: #b9d39d;
  --wideHeroEyebrowBorder: rgb(255 255 255 / 0.22);
  --wideHeroEyebrowSurface: rgb(255 255 255 / 0.08);
  --wideHeroEyebrowText: #dce8ce;
  --wideHeroGlowSurface: rgb(116 143 85 / 0.2);
  --wideHeroOverlayEnd: rgb(21 34 21 / 0.22);
  --wideHeroOverlayLight: rgb(21 34 21 / 0.4);
  --wideHeroOverlayMiddle: rgb(21 34 21 / 0.82);
  --wideHeroOverlayStart: rgb(14 24 15 / 0.94);
  --wideHeroSubtitleText: #f2f6ed;
  --wideHeroSurface: #172016;
  --wideHeroTitleShadow: rgb(0 0 0 / 0.35);
  --wideHeroTitleText: #ffffff;
}
@layer themePart {
  .introHero {
    position: relative;
    display: flex;
    min-height: calc(100svh - 4rem);
    width: 100%;
    align-items: center;
    overflow: hidden;
    padding-block: calc(var(--spacing, 0.25rem) * 20);
    @media (width >= 48rem) {
      padding-block: calc(var(--spacing, 0.25rem) * 28);
    }
    background-color: var(--wideHeroSurface);
    & > .image {
      position: absolute;
      inset: 0px;
    }
    & .visualElement {
      height: 100%;
      width: 100%;
      scale: 1.02;
      object-fit: cover;
      object-position: center;
    }
    & > .overlay {
      position: absolute;
      inset: 0px;
      background-image: linear-gradient( 90deg, var(--wideHeroOverlayStart) 0%, var(--wideHeroOverlayMiddle) 42%, var(--wideHeroOverlayLight) 72%, var(--wideHeroOverlayEnd) 100% );
    }
  }
  [dir='rtl'] .introHero > .overlay {
    transform: scaleX(-1);
  }
  .introHero > .glow {
    position: absolute;
    inset-inline-start: calc(var(--spacing, 0.25rem) * -32);
    top: calc(1 / 2 * 100%);
    height: calc(var(--spacing, 0.25rem) * 96);
    width: calc(var(--spacing, 0.25rem) * 96);
    --tw-translate-y: calc(calc(1 / 2 * 100%) * -1);
    translate: var(--tw-translate-x) var(--tw-translate-y);
    border-radius: calc(infinity * 1px);
    --tw-blur: blur(var(--blur-3xl, 64px));
    filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);
    background-color: var(--wideHeroGlowSurface);
  }
  .introHero > .container {
    position: relative;
    z-index: 10;
  }
  .introHero .content {
    max-width: var(--container-3xl, 48rem);
    text-align: start;
  }
  .introHero .eyebrow {
    margin-bottom: calc(var(--spacing, 0.25rem) * 6);
    display: inline-flex;
    border-radius: calc(infinity * 1px);
    border-style: var(--tw-border-style);
    border-width: 1px;
    padding-inline: calc(var(--spacing, 0.25rem) * 4);
    padding-block: calc(var(--spacing, 0.25rem) * 2);
    font-size: var(--text-sm, 0.875rem);
    line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
    --tw-font-weight: var(--font-weight-semibold, 600);
    font-weight: var(--font-weight-semibold, 600);
    --tw-tracking: 0.16em;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    --tw-backdrop-blur: blur(var(--blur-sm, 8px));
    -webkit-backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);
    backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);
    background-color: var(--wideHeroEyebrowSurface);
    border-color: var(--wideHeroEyebrowBorder);
    color: var(--wideHeroEyebrowText);
  }
  .introHero .title {
    font-size: var(--text-4xl, 2.25rem);
    line-height: var(--tw-leading, var(--text-4xl--line-height, calc(2.5 / 2.25)));
    --tw-leading: 1.08;
    line-height: 1.08;
    --tw-font-weight: var(--font-weight-bold, 700);
    font-weight: var(--font-weight-bold, 700);
    --tw-tracking: var(--tracking-tight, -0.025em);
    letter-spacing: var(--tracking-tight, -0.025em);
    @media (width >= 40rem) {
      font-size: var(--text-5xl, 3rem);
      line-height: var(--tw-leading, var(--text-5xl--line-height, 1));
    }
    @media (width >= 64rem) {
      font-size: var(--text-7xl, 4.5rem);
      line-height: var(--tw-leading, var(--text-7xl--line-height, 1));
    }
    color: var(--wideHeroTitleText);
    text-shadow: 0 3px 24px var(--wideHeroTitleShadow);
  }
  .introHero .leadingText {
    display: block;
  }
  .introHero .emphasis {
    display: block;
    margin-top: calc(var(--spacing, 0.25rem) * 2);
    color: var(--wideHeroEmphasisText);
  }
  .introHero .subtitle {
    margin-top: calc(var(--spacing, 0.25rem) * 7);
    font-size: var(--text-xl, 1.25rem);
    line-height: var(--tw-leading, var(--text-xl--line-height, calc(1.75 / 1.25)));
    --tw-font-weight: var(--font-weight-semibold, 600);
    font-weight: var(--font-weight-semibold, 600);
    @media (width >= 48rem) {
      font-size: var(--text-2xl, 1.5rem);
      line-height: var(--tw-leading, var(--text-2xl--line-height, calc(2 / 1.5)));
    }
    color: var(--wideHeroSubtitleText);
  }
  .introHero .description {
    margin-top: calc(var(--spacing, 0.25rem) * 5);
    max-width: var(--container-2xl, 42rem);
    font-size: var(--text-base, 1rem);
    line-height: var(--tw-leading, var(--text-base--line-height, calc(1.5 / 1)));
    --tw-leading: calc(var(--spacing, 0.25rem) * 8);
    line-height: calc(var(--spacing, 0.25rem) * 8);
    @media (width >= 48rem) {
      font-size: var(--text-lg, 1.125rem);
      line-height: var(--tw-leading, var(--text-lg--line-height, calc(1.75 / 1.125)));
    }
    color: var(--wideHeroBodyText);
  }
  .introHero .actions {
    margin-top: calc(var(--spacing, 0.25rem) * 9);
    display: flex;
    flex-wrap: wrap;
    gap: calc(var(--spacing, 0.25rem) * 4);
  }
  .introHero .cta.primaryAction.secondary {
    background-color: var(--theme-heroSecondaryCtaAccent);
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix( in srgb, var(--theme-heroSecondaryCtaAccent) 12%, transparent );
    }
    border-color: var(--theme-heroSecondaryCtaAccent);
    color: var(--theme-heroSecondaryCtaAccent);
  }
  .introHero .cta.primaryAction.secondary:hover {
    background-color: var(--theme-heroSecondaryCtaAccent);
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix( in srgb, var(--theme-heroSecondaryCtaAccent) 22%, transparent );
    }
  }
}
@layer themePage {
  .page.about {
    --about-card-surface-even: var(--theme-card-surface);
    @supports (color: color-mix(in lab, red, red)) {
      --about-card-surface-even: color-mix(
            in srgb,
            var(--theme-card-surface) 92%,
            var(--theme-highlight)
        );
    }
    --about-card-surface-odd: var(--theme-card-surface);
    @supports (color: color-mix(in lab, red, red)) {
      --about-card-surface-odd: color-mix(
            in srgb,
            var(--theme-card-surface) 92%,
            var(--theme-accent)
        );
    }
    --about-section-surface-primary: var(--surfaceSoft);
    --about-section-surface-secondary: var(--theme-surface);
    @supports (color: color-mix(in lab, red, red)) {
      --about-section-surface-secondary: color-mix(
            in srgb,
            var(--theme-surface) 90%,
            var(--theme-accent)
        );
    }
  }
  [data-tenant='wesupply.ir'] .page.about {
    --about-card-surface-even: var(--theme-card-surface);
    @supports (color: color-mix(in lab, red, red)) {
      --about-card-surface-even: color-mix(
            in srgb,
            var(--theme-card-surface) 88%,
            var(--theme-highlight)
        );
    }
    --about-card-surface-odd: var(--theme-card-surface);
    @supports (color: color-mix(in lab, red, red)) {
      --about-card-surface-odd: color-mix(
            in srgb,
            var(--theme-card-surface) 84%,
            var(--theme-accent)
        );
    }
    --about-section-surface-primary: var(--theme-surface);
    @supports (color: color-mix(in lab, red, red)) {
      --about-section-surface-primary: color-mix(
            in srgb,
            var(--theme-surface) 82%,
            var(--theme-highlight)
        );
    }
    --about-section-surface-secondary: var(--theme-surface);
    @supports (color: color-mix(in lab, red, red)) {
      --about-section-surface-secondary: color-mix(
            in srgb,
            var(--theme-surface) 84%,
            var(--theme-accent)
        );
    }
    --theme-accent: #748f55;
    --theme-accent-hover: #5f7845;
    --theme-card-accent: #668248;
    --theme-card-border-hover: var(--theme-accent);
    --theme-heading-supertitle-background: var(--theme-card-accent);
    --theme-highlight: #a9bb8e;
  }
  .page.about > :is( .heroCentered, .twoPartInfo, .cardsSection, .cardsChronology, .cardsProfiles, .cardsStatistics, .quoteCentered, .callToActionPanel ) {
    clip-path: inset(0 -100vmax);
  }
  .page.about > :is( .heroCentered, .twoPartInfo, .cardsSection, .cardsChronology, .cardsProfiles, .cardsStatistics, .quoteCentered, .callToActionPanel ):nth-child(3n + 2) {
    background-color: var(--about-section-surface-primary);
    box-shadow: 0 0 0 100vmax var(--about-section-surface-primary);
  }
  .page.about > :is( .heroCentered, .twoPartInfo, .cardsSection, .cardsChronology, .cardsProfiles, .cardsStatistics, .quoteCentered, .callToActionPanel ):nth-child(3n) {
    background-color: var(--about-section-surface-secondary);
    box-shadow: 0 0 0 100vmax var(--about-section-surface-secondary);
  }
  .page.about :is(.card, .chronologyCard, .profileCard, .statisticCard) {
    background-color: var(--about-card-surface-odd);
  }
  .page.about :is(.card, .chronologyCard, .profileCard, .statisticCard):nth-child( even ) {
    background-color: var(--about-card-surface-even);
  }
  .page.about :is(.chronologyCard, .profileCard, .statisticCard) {
    border-radius: var(--radius-2xl, 1rem);
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--theme-card-border);
    box-shadow: 0 8px 24px var(--theme-shadow);
  }
  .page.about .chronologyCard {
    margin-inline-start: calc(var(--spacing, 0.25rem) * 6);
    margin-bottom: calc(var(--spacing, 0.25rem) * 6);
    padding: calc(var(--spacing, 0.25rem) * 6);
    &:last-child {
      margin-bottom: 0px;
    }
  }
  .page.about .chronologyCard .marker {
    inset-inline-start: calc(33px * -1);
  }
  .page.about .profileCard {
    padding: calc(var(--spacing, 0.25rem) * 4);
  }
  .page.about .cardsStatistics .items {
    gap: calc(var(--spacing, 0.25rem) * 6);
    border-style: var(--tw-border-style);
    border-width: 0px;
    @media (width >= 40rem) {
      :where(& > :not(:last-child)) {
        --tw-divide-x-reverse: 0;
        border-inline-style: var(--tw-border-style);
        border-inline-start-width: calc(0px * var(--tw-divide-x-reverse));
        border-inline-end-width: calc(0px * calc(1 - var(--tw-divide-x-reverse)));
      }
    }
  }
  .accentRule {
    margin-inline: auto;
    margin-bottom: calc(var(--spacing, 0.25rem) * 8);
    height: 1px;
    width: calc(var(--spacing, 0.25rem) * 16);
    background-image: linear-gradient( to right, var(--theme-accent), var(--theme-highlight) );
  }
  .principles {
    background-color: var(--surfaceSoft);
  }
  .principleCard {
    background-color: var(--theme-card-surface);
    border-color: var(--theme-card-border);
    box-shadow: 0 8px 24px var(--theme-shadow);
    &:hover {
      border-color: var(--theme-card-border-hover);
      box-shadow: 0 14px 30px var(--theme-shadow-strong);
    }
  }
  .principleNumber {
    color: var(--theme-card-accent);
  }
  .principleTitle {
    color: var(--theme-card-title);
  }
  .principleText {
    color: var(--theme-card-text);
  }
  .contactPage {
    padding-block: calc(var(--spacing, 0.25rem) * 10);
    @media (width >= 80rem) {
      padding-block: calc(var(--spacing, 0.25rem) * 16);
    }
  }
  .contactLayout {
    display: flex;
    flex-direction: column;
    gap: calc(var(--spacing, 0.25rem) * 10);
    @media (width >= 40rem) {
      gap: calc(var(--spacing, 0.25rem) * 16);
    }
    @media (width >= 48rem) {
      flex-direction: row;
    }
  }
  .contactInfo, .contactForm {
    position: relative;
    width: 100%;
    @media (width >= 48rem) {
      width: calc(1 / 2 * 100%);
    }
  }
  .contactInfo {
    min-height: calc(var(--spacing, 0.25rem) * 96);
    .backImage {
      position: absolute;
      inset-inline-start: calc(var(--spacing, 0.25rem) * 0);
      top: 0px;
    }
    .frontPanel {
      position: relative;
      margin-inline: auto;
      min-height: calc(var(--spacing, 0.25rem) * 96);
      width: 100%;
    }
    .frontImage {
      inset-inline-start: calc(var(--spacing, 0.25rem) * 0);
      top: 0px;
    }
    .frontPanel {
      &::after {
        position: absolute;
        inset: 0px;
        background-color: var(--theme-accent);
        @supports (color: color-mix(in lab, red, red)) {
          background-color: color-mix( in srgb, var(--theme-accent) 30%, transparent );
        }
        content: '';
      }
    }
    .details {
      position: relative;
      z-index: 10;
      display: flex;
      min-height: calc(var(--spacing, 0.25rem) * 96);
      flex-direction: column;
      justify-content: center;
      gap: calc(var(--spacing, 0.25rem) * 5);
      padding: calc(var(--spacing, 0.25rem) * 4);
      @media (width >= 64rem) {
        padding: calc(var(--spacing, 0.25rem) * 8);
      }
      color: var(--theme-text);
    }
    :is(.title, .infoItem) {
      display: flex;
      width: fit-content;
      max-width: 100%;
      align-items: center;
      gap: calc(var(--spacing, 0.25rem) * 4);
      border-radius: var(--radius-lg, 0.5rem);
      padding-inline: calc(var(--spacing, 0.25rem) * 4);
      padding-block: calc(var(--spacing, 0.25rem) * 2);
      --tw-backdrop-blur: blur(var(--blur-sm, 8px));
      -webkit-backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);
      backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);
      background-color: var(--theme-surface);
      @supports (color: color-mix(in lab, red, red)) {
        background-color: color-mix( in srgb, var(--theme-surface) 72%, transparent );
      }
    }
    .title {
      font-size: var(--text-base, 1rem);
      line-height: var(--tw-leading, var(--text-base--line-height, calc(1.5 / 1)));
      --tw-font-weight: var(--font-weight-bold, 700);
      font-weight: var(--font-weight-bold, 700);
      @media (width >= 40rem) {
        font-size: var(--text-lg, 1.125rem);
        line-height: var(--tw-leading, var(--text-lg--line-height, calc(1.75 / 1.125)));
      }
    }
    .infoItem {
      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, cubic-bezier(0.4, 0, 0.2, 1)));
      transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
      &:hover {
        background-color: var(--theme-accent-soft);
        color: var(--theme-accent-hover);
      }
    }
    .icon {
      aspect-ratio: 1 / 1;
      width: calc(var(--spacing, 0.25rem) * 6);
      fill: currentColor;
      stroke: currentColor;
    }
    .address {
      flex-direction: column;
      align-items: flex-start;
      gap: calc(var(--spacing, 0.25rem) * 2);
      --tw-leading: calc(var(--spacing, 0.25rem) * 7);
      line-height: calc(var(--spacing, 0.25rem) * 7);
      font-style: normal;
    }
    .email {
      word-break: break-all;
    }
  }
  .contactMap {
    --tw-grayscale: grayscale(100%);
    filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);
  }
}
@layer themePart {
  .contactForm .title {
    font-size: var(--text-xl, 1.25rem);
    line-height: var(--tw-leading, var(--text-xl--line-height, calc(1.75 / 1.25)));
    --tw-font-weight: var(--font-weight-bold, 700);
    font-weight: var(--font-weight-bold, 700);
    @media (width >= 48rem) {
      font-size: var(--text-2xl, 1.5rem);
      line-height: var(--tw-leading, var(--text-2xl--line-height, calc(2 / 1.5)));
    }
    color: var(--theme-text);
  }
  .contactForm .description {
    margin-top: calc(var(--spacing, 0.25rem) * 3);
    margin-bottom: calc(var(--spacing, 0.25rem) * 5);
    --tw-leading: calc(var(--spacing, 0.25rem) * 7);
    line-height: calc(var(--spacing, 0.25rem) * 7);
    @media (width >= 48rem) {
      margin-bottom: calc(var(--spacing, 0.25rem) * 10);
    }
    color: var(--theme-text-muted);
  }
  .contactForm .fields {
    display: grid;
    gap: calc(var(--spacing, 0.25rem) * 3);
  }
  .contactForm .control {
    width: 100%;
    border-radius: var(--radius-lg, 0.5rem);
    border-style: var(--tw-border-style);
    border-width: 1px;
    padding-inline: calc(var(--spacing, 0.25rem) * 5);
    padding-block: calc(var(--spacing, 0.25rem) * 3);
    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, cubic-bezier(0.4, 0, 0.2, 1)));
    transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
    --tw-outline-style: none;
    outline-style: none;
    background-color: var(--theme-surface);
    border-color: var(--theme-border);
    color: var(--theme-text);
    &:focus {
      border-color: var(--theme-accent);
    }
  }
  .contactForm .action {
    display: inline-flex;
    min-width: calc(var(--spacing, 0.25rem) * 40);
    align-items: center;
    justify-content: center;
    gap: calc(var(--spacing, 0.25rem) * 2);
    justify-self: flex-end;
    border-radius: calc(infinity * 1px);
    padding-inline: calc(var(--spacing, 0.25rem) * 6);
    padding-block: calc(var(--spacing, 0.25rem) * 3);
    --tw-font-weight: var(--font-weight-semibold, 600);
    font-weight: var(--font-weight-semibold, 600);
    --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);
    transition-property: all;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(0.4, 0, 0.2, 1)));
    transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
    background-color: var(--theme-accent);
    color: var(--theme-on-accent);
    &:hover {
      background-color: var(--theme-accent-hover);
    }
    &:disabled {
      cursor: not-allowed;
      opacity: 50%;
      --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);
    }
  }
  .contactForm .loadingIcon {
    height: calc(var(--spacing, 0.25rem) * 5);
    width: calc(var(--spacing, 0.25rem) * 5);
    animation: var(--animate-spin, spin 1s linear infinite);
    fill: currentcolor;
  }
  .cardsIntro {
    color: var(--theme-cardsText);
  }
  .cardsVariant {
    padding-block: calc(var(--spacing, 0.25rem) * 12);
    @media (width >= 80rem) {
      padding-block: calc(var(--spacing, 0.25rem) * 20);
    }
    color: var(--theme-cardsMuted);
  }
  .variantHeader {
    margin-bottom: calc(var(--spacing, 0.25rem) * 8);
    @media (width >= 80rem) {
      margin-bottom: calc(var(--spacing, 0.25rem) * 12);
    }
  }
  .variantBody {
    position: relative;
    z-index: 10;
  }
  .variantKicker {
    margin-bottom: calc(var(--spacing, 0.25rem) * 2);
    font-size: var(--text-xs, 0.75rem);
    line-height: var(--tw-leading, var(--text-xs--line-height, calc(1 / 0.75)));
    --tw-font-weight: var(--font-weight-medium, 500);
    font-weight: var(--font-weight-medium, 500);
    color: var(--theme-card-accent);
  }
  .variantNumber {
    color: var(--theme-card-accent);
  }
  .variantTitle {
    margin-bottom: calc(var(--spacing, 0.25rem) * 2);
    font-family: var(--font-vazirmatn);
    font-size: 20px;
    --tw-font-weight: var(--font-weight-bold, 700);
    font-weight: var(--font-weight-bold, 700);
    --tw-tracking: var(--tracking-wider, 0.05em);
    letter-spacing: var(--tracking-wider, 0.05em);
    text-transform: uppercase;
    color: var(--theme-card-title);
  }
  .variantText {
    font-size: var(--text-sm, 0.875rem);
    line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
    color: var(--theme-card-text);
  }
  .variantAction {
    margin-top: calc(var(--spacing, 0.25rem) * 5);
  }
  .variantMedia {
    position: relative;
    z-index: 10;
    height: 100%;
    width: 100%;
    overflow: hidden;
    border-radius: var(--radius-xl, 0.75rem);
    & img {
      height: 100%;
    }
    & img {
      width: 100%;
    }
    & img {
      object-fit: cover;
    }
  }
  .variantDecoration {
    position: absolute;
    inset-inline-start: calc(var(--spacing, 0.25rem) * -20);
    top: calc(var(--spacing, 0.25rem) * -20);
    height: calc(var(--spacing, 0.25rem) * 40);
    width: calc(var(--spacing, 0.25rem) * 40);
    border-radius: calc(infinity * 1px);
    opacity: 10%;
    transition-property: all;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(0.4, 0, 0.2, 1)));
    transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
    --tw-duration: 500ms;
    transition-duration: 500ms;
    background-color: var(--theme-card-gradient-middle);
    background-image: linear-gradient( to bottom, var(--theme-card-gradient-start), var(--theme-card-gradient-middle), var(--theme-card-gradient-end) );
  }
  :is( .bentoItem, .cardsTimelineCard, .cardsFeatureItem, .zigzagItem, .floatingItem, .carouselItem, .cardsNumberedItem, .cardsSplitItem, .glassItem, .spineItem ):hover .variantDecoration {
    --tw-scale-x: 150%;
    --tw-scale-y: 150%;
    --tw-scale-z: 150%;
    scale: var(--tw-scale-x) var(--tw-scale-y);
    opacity: 20%;
  }
  :is( .bentoItem, .cardsTimelineCard, .cardsFeatureItem, .zigzagItem, .floatingItem, .carouselItem, .cardsNumberedItem, .cardsSplitItem, .glassItem, .spineItem ) {
    position: relative;
    overflow: hidden;
    border-radius: var(--radius-2xl, 1rem);
    border-style: var(--tw-border-style);
    border-width: 1px;
    transition-property: all;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(0.4, 0, 0.2, 1)));
    transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
    --tw-duration: 300ms;
    transition-duration: 300ms;
    --tw-ease: var(--ease-out, cubic-bezier(0, 0, 0.2, 1));
    transition-timing-function: var(--ease-out, cubic-bezier(0, 0, 0.2, 1));
    &:hover {
      @media (hover: hover) {
        --tw-translate-y: calc(var(--spacing, 0.25rem) * -1);
        translate: var(--tw-translate-x) var(--tw-translate-y);
      }
    }
    background-color: var(--theme-card-surface);
    border-color: var(--theme-card-border);
  }
  [data-tenant='wesupply.ir'] :is( .bentoItem, .cardsTimelineCard, .cardsFeatureItem, .zigzagItem, .floatingItem, .carouselItem, .cardsNumberedItem, .cardsSplitItem, .glassItem, .spineItem ), [data-tenant='shifatrip.ir'] :is( .bentoItem, .cardsTimelineCard, .cardsFeatureItem, .zigzagItem, .floatingItem, .carouselItem, .cardsNumberedItem, .cardsSplitItem, .glassItem, .spineItem ) {
    box-shadow: 0 10px 30px -18px var(--theme-shadow-strong), inset 0 3px 0 var(--theme-highlight);
  }
  :is( .bentoItem, .cardsTimelineCard, .cardsFeatureItem, .zigzagItem, .floatingItem, .carouselItem, .cardsNumberedItem, .cardsSplitItem, .glassItem, .spineItem ):hover {
    border-color: var(--theme-card-border-hover);
    box-shadow: 0 20px 25px -5px var(--theme-shadow), 0 8px 10px -6px var(--theme-shadow);
  }
  [data-tenant='wesupply.ir'] :is( .bentoItem, .cardsTimelineCard, .cardsFeatureItem, .zigzagItem, .floatingItem, .carouselItem, .cardsNumberedItem, .cardsSplitItem, .glassItem, .spineItem ):hover, [data-tenant='shifatrip.ir'] :is( .bentoItem, .cardsTimelineCard, .cardsFeatureItem, .zigzagItem, .floatingItem, .carouselItem, .cardsNumberedItem, .cardsSplitItem, .glassItem, .spineItem ):hover {
    box-shadow: 0 24px 45px -20px var(--theme-shadow-strong), inset 0 3px 0 var(--theme-accent);
  }
  .bentoGrid {
    display: grid;
    gap: calc(var(--spacing, 0.25rem) * 5);
    @media (width >= 48rem) {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    @media (width >= 64rem) {
      grid-template-columns: repeat(6, minmax(0, 1fr));
    }
  }
  .bentoItem {
    min-height: calc(var(--spacing, 0.25rem) * 64);
    padding: calc(var(--spacing, 0.25rem) * 4);
    @media (width >= 48rem) {
      padding: calc(var(--spacing, 0.25rem) * 8);
    }
    @media (width >= 64rem) {
      grid-column: span 2 / span 2;
    }
    &:nth-child(5n + 1) {
      @media (width >= 64rem) {
        grid-column: span 3 / span 3;
      }
    }
    &:nth-child(5n + 2) {
      @media (width >= 64rem) {
        grid-column: span 3 / span 3;
      }
    }
    & > .variantMedia {
      margin-bottom: calc(var(--spacing, 0.25rem) * 5);
      height: calc(var(--spacing, 0.25rem) * 44);
    }
  }
  .cardsTimelineList {
    position: relative;
    margin-inline: auto;
    max-width: var(--container-4xl, 56rem);
    &::before {
      content: var(--tw-content);
      position: absolute;
    }
    &::before {
      content: var(--tw-content);
      inset-block: 0px;
    }
    &::before {
      content: var(--tw-content);
      inset-inline-start: calc(var(--spacing, 0.25rem) * 5);
    }
    &::before {
      content: var(--tw-content);
      width: 1px;
    }
    @media (width >= 48rem) {
      &::before {
        content: var(--tw-content);
        inset-inline-start: calc(1/2 * 100%);
      }
    }
    &::before {
      background-color: var(--theme-card-border);
    }
  }
  .cardsSpineList::before {
    background-color: var(--theme-card-border);
  }
  .cardsTimelineItem {
    position: relative;
    margin-bottom: calc(var(--spacing, 0.25rem) * 8);
    padding-inline-start: calc(var(--spacing, 0.25rem) * 14);
    @media (width >= 48rem) {
      width: calc(1 / 2 * 100%);
    }
    @media (width >= 48rem) {
      padding-inline-start: 0px;
    }
    @media (width >= 48rem) {
      &:nth-child(odd) {
        padding-inline-end: calc(var(--spacing, 0.25rem) * 12);
      }
    }
    @media (width >= 48rem) {
      &:nth-child(even) {
        margin-inline-start: auto;
      }
    }
    @media (width >= 48rem) {
      &:nth-child(even) {
        padding-inline-start: calc(var(--spacing, 0.25rem) * 12);
      }
    }
  }
  .cardsTimelineMarker {
    position: absolute;
    inset-inline-start: calc(var(--spacing, 0.25rem) * 0);
    top: calc(var(--spacing, 0.25rem) * 6);
    z-index: 10;
    display: flex;
    height: calc(var(--spacing, 0.25rem) * 10);
    width: calc(var(--spacing, 0.25rem) * 10);
    align-items: center;
    justify-content: center;
    border-radius: calc(infinity * 1px);
    --tw-font-weight: var(--font-weight-bold, 700);
    font-weight: var(--font-weight-bold, 700);
    @media (width >= 48rem) {
      inset-inline-start: auto;
    }
    @media (width >= 48rem) {
      &:nth-child(odd) {
        inset-inline-end: calc(var(--spacing, 0.25rem) * -5);
      }
    }
    @media (width >= 48rem) {
      &:nth-child(even) {
        inset-inline-start: calc(var(--spacing, 0.25rem) * -5);
      }
    }
    background-color: var(--theme-card-accent);
    color: var(--theme-cardsOnAccent);
  }
  .cardsTimelineCard, .cardsNumberedItem, .cardsSplitItem, .spineItem {
    padding: calc(var(--spacing, 0.25rem) * 4);
    @media (width >= 48rem) {
      padding: calc(var(--spacing, 0.25rem) * 8);
    }
  }
  .cardsFeatureLayout {
    display: grid;
    align-items: center;
    gap: calc(var(--spacing, 0.25rem) * 10);
    @media (width >= 64rem) {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    & > .variantMedia {
      min-height: calc(var(--spacing, 0.25rem) * 80);
    }
  }
  .cardsFeatureItems {
    display: grid;
    gap: calc(var(--spacing, 0.25rem) * 5);
  }
  .cardsFeatureItem {
    display: flex;
    gap: calc(var(--spacing, 0.25rem) * 4);
    padding: calc(var(--spacing, 0.25rem) * 4);
    @media (width >= 48rem) {
      padding: calc(var(--spacing, 0.25rem) * 8);
    }
  }
  .cardsFeatureCheck {
    position: relative;
    z-index: 10;
    display: flex;
    height: calc(var(--spacing, 0.25rem) * 8);
    width: calc(var(--spacing, 0.25rem) * 8);
    flex-shrink: 0;
    align-items: center;
    justify-content: center;
    border-radius: calc(infinity * 1px);
    --tw-font-weight: var(--font-weight-bold, 700);
    font-weight: var(--font-weight-bold, 700);
    background-color: var(--theme-card-accent);
    color: var(--theme-cardsOnAccent);
  }
  .zigzagList {
    display: grid;
    gap: calc(var(--spacing, 0.25rem) * 10);
  }
  .zigzagItem {
    display: grid;
    align-items: center;
    gap: calc(var(--spacing, 0.25rem) * 8);
    padding: calc(var(--spacing, 0.25rem) * 4);
    @media (width >= 48rem) {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    @media (width >= 48rem) {
      padding: calc(var(--spacing, 0.25rem) * 8);
    }
    &:nth-child(even) > .variantMedia {
      @media (width >= 48rem) {
        order: 2;
      }
    }
    & > .variantMedia {
      min-height: calc(var(--spacing, 0.25rem) * 64);
    }
  }
  .cardsFloating, .cardsGlass {
    position: relative;
    overflow: hidden;
    background-color: var(--theme-card-surface);
  }
  .floatingGrid, .glassGrid, .cardsNumberedGrid {
    display: grid;
    gap: calc(var(--spacing, 0.25rem) * 6);
    @media (width >= 48rem) {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    @media (width >= 64rem) {
      grid-template-columns: repeat(3, minmax(0, 1fr));
    }
  }
  .floatingItem {
    padding: calc(var(--spacing, 0.25rem) * 4);
    @media (width >= 48rem) {
      padding: calc(var(--spacing, 0.25rem) * 8);
    }
  }
  .floatingOrb {
    position: absolute;
    inset-inline-end: calc(var(--spacing, 0.25rem) * -10);
    top: calc(var(--spacing, 0.25rem) * -10);
    height: calc(var(--spacing, 0.25rem) * 32);
    width: calc(var(--spacing, 0.25rem) * 32);
    border-radius: calc(infinity * 1px);
    opacity: 20%;
    background-color: var(--theme-card-gradient-middle);
  }
  .carouselTrack {
    padding-top: var(--spacing, 0.25rem);
    padding-bottom: calc(var(--spacing, 0.25rem) * 12);
    & > .swiper-slide {
      height: auto;
    }
  }
  .posts .carouselTrack {
    align-items: stretch;
  }
  .posts .carouselTrack > .swiper-slide {
    display: flex;
    height: auto;
  }
  .posts .carouselTrack > .swiper-slide > .post {
    flex: 1;
  }
  .carouselItem {
    height: 100%;
    min-height: calc(var(--spacing, 0.25rem) * 80);
    padding: calc(var(--spacing, 0.25rem) * 4);
    @media (width >= 48rem) {
      padding: calc(var(--spacing, 0.25rem) * 8);
    }
    & > .variantMedia {
      margin-bottom: calc(var(--spacing, 0.25rem) * 5);
      height: calc(var(--spacing, 0.25rem) * 44);
    }
  }
  .carouselPagination .swiper-pagination-bullet-active {
    background-color: var(--theme-card-accent) !important;
  }
  .cardsCarousel > .variantFooter {
    margin-top: calc(var(--spacing, 0.25rem) * 8);
    display: flex;
    justify-content: center;
  }
  .cardsNumberedItem {
    position: relative;
    & .variantNumber {
      font-size: var(--text-4xl, 2.25rem);
      line-height: var(--tw-leading, var(--text-4xl--line-height, calc(2.5 / 2.25)));
      opacity: 30%;
      color: var(--theme-card-accent);
    }
  }
  .cardsSplitLayout {
    display: grid;
    gap: calc(var(--spacing, 0.25rem) * 10);
    @media (width >= 64rem) {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    @media (width >= 64rem) {
      gap: calc(var(--spacing, 0.25rem) * 16);
    }
    & .variantHeader {
      margin-inline: 0px;
      text-align: start;
    }
  }
  .cardsSplitMedia > .variantMedia {
    min-height: calc(var(--spacing, 0.25rem) * 72);
  }
  .cardsSplitList {
    display: grid;
    gap: calc(var(--spacing, 0.25rem) * 5);
  }
  .glassGlow {
    position: absolute;
    height: calc(var(--spacing, 0.25rem) * 80);
    width: calc(var(--spacing, 0.25rem) * 80);
    border-radius: calc(infinity * 1px);
    --tw-blur: blur(var(--blur-3xl, 64px));
    filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);
    background-color: var(--theme-cardsGlow);
  }
  .startGlow {
    inset-inline-start: calc(var(--spacing, 0.25rem) * -32);
    top: calc(var(--spacing, 0.25rem) * -32);
  }
  .endGlow {
    inset-inline-end: calc(var(--spacing, 0.25rem) * -32);
    bottom: calc(var(--spacing, 0.25rem) * -32);
  }
  .glassContent {
    position: relative;
    z-index: 10;
  }
  .glassItem {
    padding: calc(var(--spacing, 0.25rem) * 4);
    --tw-backdrop-blur: blur(var(--blur-xl, 24px));
    -webkit-backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);
    backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);
    @media (width >= 48rem) {
      padding: calc(var(--spacing, 0.25rem) * 8);
    }
    background-color: var(--theme-cardsGlass);
  }
  .cardsSpineList {
    position: relative;
    margin-inline: auto;
    max-width: var(--container-3xl, 48rem);
    &::before {
      content: var(--tw-content);
      position: absolute;
    }
    &::before {
      content: var(--tw-content);
      inset-block: 0px;
    }
    &::before {
      content: var(--tw-content);
      inset-inline-start: calc(var(--spacing, 0.25rem) * 2);
    }
    &::before {
      content: var(--tw-content);
      width: var(--spacing, 0.25rem);
    }
  }
  .cardsSpineItem {
    position: relative;
    margin-bottom: calc(var(--spacing, 0.25rem) * 6);
    padding-inline-start: calc(var(--spacing, 0.25rem) * 10);
  }
  .cardsSpineDot {
    position: absolute;
    inset-inline-start: calc(var(--spacing, 0.25rem) * 0);
    top: calc(var(--spacing, 0.25rem) * 7);
    z-index: 10;
    height: calc(var(--spacing, 0.25rem) * 5);
    width: calc(var(--spacing, 0.25rem) * 5);
    border-radius: calc(infinity * 1px);
    border-style: var(--tw-border-style);
    border-width: 4px;
    background-color: var(--theme-card-accent);
    border-color: var(--theme-card-surface);
  }
  .card {
    position: relative;
    overflow: hidden;
    border-radius: var(--radius-2xl, 1rem);
    border-style: var(--tw-border-style);
    border-width: 1px;
    transition-property: all;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(0.4, 0, 0.2, 1)));
    transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
    --tw-duration: 300ms;
    transition-duration: 300ms;
    --tw-ease: var(--ease-out, cubic-bezier(0, 0, 0.2, 1));
    transition-timing-function: var(--ease-out, cubic-bezier(0, 0, 0.2, 1));
    &:hover {
      @media (hover: hover) {
        --tw-translate-y: calc(var(--spacing, 0.25rem) * -1);
        translate: var(--tw-translate-x) var(--tw-translate-y);
      }
    }
    background-color: var(--theme-card-surface);
    border-color: var(--theme-card-border);
  }
  [data-tenant='wesupply.ir'] .card, [data-tenant='shifatrip.ir'] .card {
    box-shadow: 0 10px 30px -18px var(--theme-shadow-strong), inset 0 3px 0 var(--theme-highlight);
  }
  .card:hover {
    border-color: var(--theme-card-border-hover);
    box-shadow: 0 20px 25px -5px var(--theme-shadow), 0 8px 10px -6px var(--theme-shadow);
  }
  [data-tenant='wesupply.ir'] .card:hover, [data-tenant='shifatrip.ir'] .card:hover {
    box-shadow: 0 24px 45px -20px var(--theme-shadow-strong), inset 0 3px 0 var(--theme-accent);
  }
  .entryDecoration {
    position: absolute;
    inset-inline-start: calc(var(--spacing, 0.25rem) * -20);
    top: calc(var(--spacing, 0.25rem) * -20);
    height: calc(var(--spacing, 0.25rem) * 40);
    width: calc(var(--spacing, 0.25rem) * 40);
    border-radius: calc(infinity * 1px);
    opacity: 10%;
    transition-property: all;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(0.4, 0, 0.2, 1)));
    transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
    --tw-duration: 500ms;
    transition-duration: 500ms;
    background-color: var(--theme-card-gradient-middle);
    background-image: linear-gradient( to bottom, var(--theme-card-gradient-start), var(--theme-card-gradient-middle), var(--theme-card-gradient-end) );
  }
  .card:hover .entryDecoration {
    --tw-scale-x: 150%;
    --tw-scale-y: 150%;
    --tw-scale-z: 150%;
    scale: var(--tw-scale-x) var(--tw-scale-y);
    opacity: 20%;
  }
  .entryContent {
    position: relative;
    padding: calc(var(--spacing, 0.25rem) * 4);
    @media (width >= 48rem) {
      padding: calc(var(--spacing, 0.25rem) * 8);
    }
  }
  .entryTitle {
    margin-bottom: calc(var(--spacing, 0.25rem) * 2);
    font-family: var(--font-vazirmatn);
    font-size: 20px;
    --tw-font-weight: var(--font-weight-bold, 700);
    font-weight: var(--font-weight-bold, 700);
    --tw-tracking: var(--tracking-wider, 0.05em);
    letter-spacing: var(--tracking-wider, 0.05em);
    text-transform: uppercase;
    color: var(--theme-card-title);
  }
  .entrySubtitle {
    margin-bottom: calc(var(--spacing, 0.25rem) * 2);
    font-size: var(--text-xs, 0.75rem);
    line-height: var(--tw-leading, var(--text-xs--line-height, calc(1 / 0.75)));
    --tw-font-weight: var(--font-weight-medium, 500);
    font-weight: var(--font-weight-medium, 500);
    color: var(--theme-card-accent);
  }
  .entryText {
    font-size: var(--text-sm, 0.875rem);
    line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
    color: var(--theme-card-text);
  }
  .heading {
    margin-inline: auto;
    max-width: var(--container-3xl, 48rem);
    text-align: center;
    & .supertitle {
      margin-bottom: calc(var(--spacing, 0.25rem) * 2);
      margin-bottom: calc(var(--spacing, 0.25rem) * 4);
      display: inline-block;
      border-radius: calc(infinity * 1px);
      padding-inline: calc(var(--spacing, 0.25rem) * 4);
      padding-block: calc(var(--spacing, 0.25rem) * 1.5);
      font-size: var(--text-sm, 0.875rem);
      line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
      --tw-font-weight: var(--font-weight-medium, 500);
      font-weight: var(--font-weight-medium, 500);
      --tw-tracking: var(--tracking-widest, 0.1em);
      letter-spacing: var(--tracking-widest, 0.1em);
      text-transform: uppercase;
      background-color: var(--theme-heading-supertitle-background);
      color: var(--theme-heading-supertitle-text);
    }
    & .title {
      margin-bottom: calc(var(--spacing, 0.25rem) * 4);
      font-family: var(--font-vazirmatn);
      font-size: var(--text-2xl, 1.5rem);
      line-height: var(--tw-leading, var(--text-2xl--line-height, calc(2 / 1.5)));
      --tw-font-weight: var(--font-weight-bold, 700);
      font-weight: var(--font-weight-bold, 700);
      @media (width >= 40rem) {
        font-size: var(--text-3xl, 1.875rem);
        line-height: var(--tw-leading, var(--text-3xl--line-height, calc(2.25 / 1.875)));
      }
      @media (width >= 48rem) {
        font-size: var(--text-4xl, 2.25rem);
        line-height: var(--tw-leading, var(--text-4xl--line-height, calc(2.5 / 2.25)));
      }
      color: var(--theme-heading-title);
    }
    & .subtitle {
      margin-bottom: calc(var(--spacing, 0.25rem) * 3);
      font-size: var(--text-sm, 0.875rem);
      line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
      @media (width >= 40rem) {
        font-size: var(--text-lg, 1.125rem);
        line-height: var(--tw-leading, var(--text-lg--line-height, calc(1.75 / 1.125)));
      }
      color: var(--theme-heading-subtitle);
    }
    & .description {
      font-size: var(--text-base, 1rem);
      line-height: var(--tw-leading, var(--text-base--line-height, calc(1.5 / 1)));
      --tw-leading: var(--leading-relaxed, 1.625);
      line-height: var(--leading-relaxed, 1.625);
      --tw-font-weight: var(--font-weight-light, 300);
      font-weight: var(--font-weight-light, 300);
      color: var(--theme-heading-description);
    }
  }
  .heading.taxonomy .title, .heading.social .title {
    text-align: start;
    font-size: var(--text-2xl, 1.5rem);
    line-height: var(--tw-leading, var(--text-2xl--line-height, calc(2 / 1.5)));
    --tw-font-weight: var(--font-weight-bold, 700);
    font-weight: var(--font-weight-bold, 700);
    text-transform: capitalize;
    --tw-drop-shadow-size: drop-shadow(0 1px 2px var(--tw-drop-shadow-color, rgb(0 0 0 / 0.15)));
    --tw-drop-shadow: drop-shadow(var(--drop-shadow-sm, 0 1px 2px rgb(0 0 0 / 0.15)));
    filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);
  }
  .tags {
    max-width: var(--container-lg, 32rem);
    .heading {
      margin-inline: 0px;
      text-align: start;
      .title {
        margin-bottom: 0px;
        text-align: start;
        font-size: var(--text-2xl, 1.5rem);
        line-height: var(--tw-leading, var(--text-2xl--line-height, calc(2 / 1.5)));
      }
    }
    .search {
      margin-bottom: calc(var(--spacing, 0.25rem) * 4);
      width: 100%;
      border-radius: var(--radius-lg, 0.5rem);
      border-style: var(--tw-border-style);
      border-width: 1px;
      padding-inline: calc(var(--spacing, 0.25rem) * 3);
      padding-block: calc(var(--spacing, 0.25rem) * 2);
      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, cubic-bezier(0.4, 0, 0.2, 1)));
      transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
      --tw-outline-style: none;
      outline-style: none;
      background-color: var(--theme-taxonomy-surface);
      border-color: var(--theme-taxonomy-border);
      color: var(--theme-taxonomy-text);
      &::placeholder {
        color: var(--theme-taxonomy-text-muted);
      }
      &:focus {
        border-color: var(--theme-taxonomy-accent);
      }
    }
    .list {
      display: grid;
      list-style-type: none;
      gap: var(--spacing, 0.25rem);
      padding: 0px;
    }
    .link {
      display: flex;
      border-radius: var(--radius-lg, 0.5rem);
      padding-inline: calc(var(--spacing, 0.25rem) * 3);
      padding-block: calc(var(--spacing, 0.25rem) * 2);
      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, cubic-bezier(0.4, 0, 0.2, 1)));
      transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
      color: var(--theme-taxonomy-text);
      &:hover {
        background-color: var(--theme-taxonomy-surface-hover);
        color: var(--theme-taxonomy-accent-hover);
      }
      & .title {
        --tw-font-weight: var(--font-weight-medium, 500);
        font-weight: var(--font-weight-medium, 500);
      }
    }
    .toggle {
      margin-top: calc(var(--spacing, 0.25rem) * 2);
      border-radius: var(--radius-lg, 0.5rem);
      padding-inline: calc(var(--spacing, 0.25rem) * 3);
      padding-block: calc(var(--spacing, 0.25rem) * 2);
      font-size: var(--text-sm, 0.875rem);
      line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
      --tw-font-weight: var(--font-weight-medium, 500);
      font-weight: var(--font-weight-medium, 500);
      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, cubic-bezier(0.4, 0, 0.2, 1)));
      transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
      color: var(--theme-taxonomy-accent);
      &:hover {
        background-color: var(--theme-taxonomy-surface-hover);
        color: var(--theme-taxonomy-accent-hover);
      }
    }
  }
  .categories {
    max-width: var(--container-lg, 32rem);
    .heading {
      margin-inline: 0px;
      text-align: start;
      .title {
        margin-bottom: 0px;
        text-align: start;
        font-size: var(--text-2xl, 1.5rem);
        line-height: var(--tw-leading, var(--text-2xl--line-height, calc(2 / 1.5)));
      }
    }
    .search {
      margin-bottom: calc(var(--spacing, 0.25rem) * 4);
      width: 100%;
      border-radius: var(--radius-lg, 0.5rem);
      border-style: var(--tw-border-style);
      border-width: 1px;
      padding-inline: calc(var(--spacing, 0.25rem) * 3);
      padding-block: calc(var(--spacing, 0.25rem) * 2);
      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, cubic-bezier(0.4, 0, 0.2, 1)));
      transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
      --tw-outline-style: none;
      outline-style: none;
      background-color: var(--theme-taxonomy-surface);
      border-color: var(--theme-taxonomy-border);
      color: var(--theme-taxonomy-text);
      &::placeholder {
        color: var(--theme-taxonomy-text-muted);
      }
      &:focus {
        border-color: var(--theme-taxonomy-accent);
      }
    }
    .list {
      display: grid;
      list-style-type: none;
      gap: var(--spacing, 0.25rem);
      padding: 0px;
    }
    .link {
      display: flex;
      border-radius: var(--radius-lg, 0.5rem);
      padding-inline: calc(var(--spacing, 0.25rem) * 3);
      padding-block: calc(var(--spacing, 0.25rem) * 2);
      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, cubic-bezier(0.4, 0, 0.2, 1)));
      transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
      color: var(--theme-taxonomy-text);
      &:hover {
        background-color: var(--theme-taxonomy-surface-hover);
        color: var(--theme-taxonomy-accent-hover);
      }
      & .title {
        --tw-font-weight: var(--font-weight-medium, 500);
        font-weight: var(--font-weight-medium, 500);
      }
    }
    .toggle {
      margin-top: calc(var(--spacing, 0.25rem) * 2);
      border-radius: var(--radius-lg, 0.5rem);
      padding-inline: calc(var(--spacing, 0.25rem) * 3);
      padding-block: calc(var(--spacing, 0.25rem) * 2);
      font-size: var(--text-sm, 0.875rem);
      line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
      --tw-font-weight: var(--font-weight-medium, 500);
      font-weight: var(--font-weight-medium, 500);
      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, cubic-bezier(0.4, 0, 0.2, 1)));
      transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
      color: var(--theme-taxonomy-accent);
      &:hover {
        background-color: var(--theme-taxonomy-surface-hover);
        color: var(--theme-taxonomy-accent-hover);
      }
    }
  }
}
@layer themePage {
  .drillDown {
    margin-inline: auto;
    max-width: var(--breakpoint-xl, 80rem);
    padding-inline: calc(var(--spacing, 0.25rem) * 4);
    padding-block: calc(var(--spacing, 0.25rem) * 12);
    @media (width >= 40rem) {
      padding-inline: calc(var(--spacing, 0.25rem) * 8);
    }
    .navigation {
      margin-bottom: calc(var(--spacing, 0.25rem) * 6);
    }
    .back {
      font-size: var(--text-sm, 0.875rem);
      line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
      --tw-font-weight: var(--font-weight-medium, 500);
      font-weight: var(--font-weight-medium, 500);
      color: var(--theme-taxonomy-accent);
    }
    .header {
      margin-bottom: calc(var(--spacing, 0.25rem) * 8);
      .title {
        font-size: var(--text-3xl, 1.875rem);
        line-height: var(--tw-leading, var(--text-3xl--line-height, calc(2.25 / 1.875)));
        --tw-font-weight: var(--font-weight-bold, 700);
        font-weight: var(--font-weight-bold, 700);
        color: var(--theme-card-title);
      }
      .description {
        margin-top: calc(var(--spacing, 0.25rem) * 3);
        --tw-leading: calc(var(--spacing, 0.25rem) * 7);
        line-height: calc(var(--spacing, 0.25rem) * 7);
        color: var(--theme-card-text);
      }
    }
    .items {
      display: grid;
      list-style-type: none;
      gap: calc(var(--spacing, 0.25rem) * 5);
      padding: 0px;
      @media (width >= 40rem) {
        grid-template-columns: repeat(2, minmax(0, 1fr));
      }
      @media (width >= 64rem) {
        grid-template-columns: repeat(3, minmax(0, 1fr));
      }
    }
    .empty {
      color: var(--theme-card-text);
    }
    .item {
      overflow: hidden;
      border-radius: var(--radius-xl, 0.75rem);
      border-style: var(--tw-border-style);
      border-width: 1px;
      transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, content-visibility, overlay, pointer-events;
      transition-timing-function: var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(0.4, 0, 0.2, 1)));
      transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
      &:hover {
        @media (hover: hover) {
          --tw-translate-y: calc(var(--spacing, 0.25rem) * -1);
          translate: var(--tw-translate-x) var(--tw-translate-y);
        }
      }
      background-color: var(--theme-card-surface);
      border-color: var(--theme-card-border);
      &:hover {
        border-color: var(--theme-card-border-hover);
      }
    }
    .link {
      display: flex;
      height: 100%;
      flex-direction: column;
      text-decoration-line: none;
    }
    .image {
      aspect-ratio: var(--aspect-video, 16 / 9);
      width: 100%;
      object-fit: cover;
    }
    .details {
      display: flex;
      flex-direction: column;
      gap: calc(var(--spacing, 0.25rem) * 2);
      padding: calc(var(--spacing, 0.25rem) * 5);
      .description {
        overflow: hidden;
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
        font-size: var(--text-sm, 0.875rem);
        line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
        color: var(--theme-card-text);
      }
    }
    .label {
      font-size: var(--text-lg, 1.125rem);
      line-height: var(--tw-leading, var(--text-lg--line-height, calc(1.75 / 1.125)));
      --tw-font-weight: var(--font-weight-semibold, 600);
      font-weight: var(--font-weight-semibold, 600);
      color: var(--theme-card-title);
    }
  }
}
@layer themePart {
  .latest, .mostViewed, .popular {
    max-width: var(--container-lg, 32rem);
    .heading {
      margin-inline: 0px;
      text-align: start;
      .title {
        margin-bottom: 0px;
        text-align: start;
        font-size: var(--text-2xl, 1.5rem);
        line-height: var(--tw-leading, var(--text-2xl--line-height, calc(2 / 1.5)));
        color: var(--theme-socialList-title);
      }
    }
    .list {
      display: grid;
      list-style-type: none;
      gap: calc(var(--spacing, 0.25rem) * 4);
      padding: 0px;
    }
    .item {
      display: flex;
      gap: calc(var(--spacing, 0.25rem) * 4);
      border-radius: var(--radius-lg, 0.5rem);
      padding: calc(var(--spacing, 0.25rem) * 2);
      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, cubic-bezier(0.4, 0, 0.2, 1)));
      transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
      &:hover {
        background-color: var(--theme-socialList-surface-hover);
      }
    }
    .linkedMedia {
      flex-shrink: 0;
    }
    .media {
      aspect-ratio: 1 / 1;
      width: calc(var(--spacing, 0.25rem) * 20);
      overflow: hidden;
      border-radius: var(--radius-lg, 0.5rem);
    }
    .image {
      transition-property: transform, translate, scale, rotate;
      transition-timing-function: var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(0.4, 0, 0.2, 1)));
      transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
      --tw-duration: 300ms;
      transition-duration: 300ms;
    }
    .item {
      &:hover .image {
        --tw-scale-x: 105%;
        --tw-scale-y: 105%;
        --tw-scale-z: 105%;
        scale: var(--tw-scale-x) var(--tw-scale-y);
      }
    }
    .content {
      min-width: 0px;
    }
    .date {
      font-size: var(--text-sm, 0.875rem);
      line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
      color: var(--theme-socialList-text-muted);
    }
    .content {
      & .title {
        margin-top: calc(var(--spacing, 0.25rem) * 0.5);
        --tw-font-weight: var(--font-weight-bold, 700);
        font-weight: var(--font-weight-bold, 700);
      }
    }
    .link {
      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, cubic-bezier(0.4, 0, 0.2, 1)));
      transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
      color: var(--theme-socialList-text);
      &:hover {
        color: var(--theme-socialList-accent-hover);
      }
    }
  }
  .pagination {
    margin-top: calc(var(--spacing, 0.25rem) * 12);
    -webkit-user-select: none;
    user-select: none;
    .list {
      display: flex;
      flex-wrap: wrap;
      align-items: center;
      justify-content: center;
      gap: calc(var(--spacing, 0.25rem) * 2);
      padding: 0px;
      text-align: center;
    }
    .item {
      list-style-type: none;
    }
    .link {
      display: flex;
      aspect-ratio: 1 / 1;
      width: calc(var(--spacing, 0.25rem) * 10);
      align-items: center;
      justify-content: center;
      border-radius: calc(infinity * 1px);
      border-style: var(--tw-border-style);
      border-width: 2px;
      font-size: var(--text-sm, 0.875rem);
      line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
      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, cubic-bezier(0.4, 0, 0.2, 1)));
      transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
      background-color: var(--theme-pagination-surface);
      border-color: var(--theme-pagination-border);
      color: var(--theme-pagination-text);
      &:hover {
        background-color: var(--theme-pagination-surface-hover);
        border-color: var(--theme-pagination-border-hover);
        color: var(--theme-pagination-text-hover);
      }
    }
    .active {
      & .link {
        background-color: var(--theme-pagination-active);
        border-color: var(--theme-pagination-active-border);
        color: var(--theme-pagination-on-active);
      }
    }
    .icon {
      aspect-ratio: 1 / 1;
      width: calc(var(--spacing, 0.25rem) * 5);
      fill: currentColor;
    }
    .ellipsis {
      display: flex;
      height: calc(var(--spacing, 0.25rem) * 10);
      min-width: calc(var(--spacing, 0.25rem) * 6);
      list-style-type: none;
      align-items: center;
      justify-content: center;
      color: var(--theme-pagination-text);
    }
  }
  .richText {
    --tw-leading: calc(var(--spacing, 0.25rem) * 8);
    line-height: calc(var(--spacing, 0.25rem) * 8);
    color: var(--theme-richText-text);
    .heading {
      font-family: var(--font-vazirmatn);
      --tw-leading: var(--leading-tight, 1.25);
      line-height: var(--leading-tight, 1.25);
      --tw-font-weight: var(--font-weight-bold, 700);
      font-weight: var(--font-weight-bold, 700);
      color: var(--theme-richText-heading);
    }
    .levelOne {
      margin-top: calc(var(--spacing, 0.25rem) * 8);
      margin-bottom: calc(var(--spacing, 0.25rem) * 4);
      font-size: var(--text-3xl, 1.875rem);
      line-height: var(--tw-leading, var(--text-3xl--line-height, calc(2.25 / 1.875)));
    }
    .levelTwo {
      margin-top: calc(var(--spacing, 0.25rem) * 8);
      margin-bottom: calc(var(--spacing, 0.25rem) * 4);
      font-size: var(--text-2xl, 1.5rem);
      line-height: var(--tw-leading, var(--text-2xl--line-height, calc(2 / 1.5)));
    }
    .levelThree {
      margin-top: calc(var(--spacing, 0.25rem) * 6);
      margin-bottom: calc(var(--spacing, 0.25rem) * 3);
      font-size: var(--text-xl, 1.25rem);
      line-height: var(--tw-leading, var(--text-xl--line-height, calc(1.75 / 1.25)));
    }
    .levelFour {
      margin-top: calc(var(--spacing, 0.25rem) * 5);
      margin-bottom: calc(var(--spacing, 0.25rem) * 3);
      font-size: var(--text-lg, 1.125rem);
      line-height: var(--tw-leading, var(--text-lg--line-height, calc(1.75 / 1.125)));
    }
    .levelFive, .levelSix {
      margin-top: calc(var(--spacing, 0.25rem) * 4);
      margin-bottom: calc(var(--spacing, 0.25rem) * 3);
      font-size: var(--text-base, 1rem);
      line-height: var(--tw-leading, var(--text-base--line-height, calc(1.5 / 1)));
    }
    .paragraph {
      margin-bottom: calc(var(--spacing, 0.25rem) * 3);
      font-size: var(--text-lg, 1.125rem);
      line-height: var(--tw-leading, var(--text-lg--line-height, calc(1.75 / 1.125)));
    }
    .list {
      margin-block: calc(var(--spacing, 0.25rem) * 5);
      padding-inline-start: calc(var(--spacing, 0.25rem) * 6);
    }
    .bulleted {
      list-style-type: disc;
    }
    .numbered {
      list-style-type: decimal;
    }
    .list {
      & .item {
        margin-bottom: calc(var(--spacing, 0.25rem) * 2);
        padding-inline-start: var(--spacing, 0.25rem);
      }
    }
    .quote {
      margin-block: calc(var(--spacing, 0.25rem) * 6);
      border-inline-start-style: var(--tw-border-style);
      border-inline-start-width: 4px;
      padding-inline: calc(var(--spacing, 0.25rem) * 5);
      padding-block: calc(var(--spacing, 0.25rem) * 3);
      font-size: var(--text-lg, 1.125rem);
      line-height: var(--tw-leading, var(--text-lg--line-height, calc(1.75 / 1.125)));
      font-style: italic;
      background-color: var(--theme-richText-surface);
      border-color: var(--theme-richText-accent);
      color: var(--theme-richText-text-muted);
    }
    .separator {
      margin-block: calc(var(--spacing, 0.25rem) * 8);
      border-style: var(--tw-border-style);
      border-width: 0px;
      border-top-style: var(--tw-border-style);
      border-top-width: 1px;
      border-color: var(--theme-richText-border);
    }
    .link {
      --tw-font-weight: var(--font-weight-medium, 500);
      font-weight: var(--font-weight-medium, 500);
      text-underline-offset: 4px;
      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, cubic-bezier(0.4, 0, 0.2, 1)));
      transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
      &:hover {
        @media (hover: hover) {
          text-decoration-line: underline;
        }
      }
      color: var(--theme-richText-accent);
      &:hover {
        color: var(--theme-richText-accent-hover);
      }
    }
  }
  .richText .image, .richText  .video {
    margin-inline: auto;
    margin-block: calc(var(--spacing, 0.25rem) * 6);
    height: auto;
    max-width: 100%;
    border-radius: var(--radius-lg, 0.5rem);
  }
  .richText .scrollContainer {
    margin-block: calc(var(--spacing, 0.25rem) * 6);
    overflow-x: auto;
    border-radius: var(--radius-lg, 0.5rem);
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--theme-richText-border);
  }
  .richText .table {
    width: 100%;
    border-collapse: collapse;
  }
  .richText .cell {
    border-style: var(--tw-border-style);
    border-width: 1px;
    padding: calc(var(--spacing, 0.25rem) * 3);
    text-align: start;
    border-color: var(--theme-richText-border);
  }
  .richText .rawHtml {
    padding-block: calc(var(--spacing, 0.25rem) * 3);
  }
  .richText .details {
    margin-block: calc(var(--spacing, 0.25rem) * 4);
    border-radius: var(--radius-lg, 0.5rem);
    border-style: var(--tw-border-style);
    border-width: 1px;
    padding: calc(var(--spacing, 0.25rem) * 4);
    border-color: var(--theme-richText-border);
  }
  .richText .summary {
    cursor: pointer;
    --tw-font-weight: var(--font-weight-semibold, 600);
    font-weight: var(--font-weight-semibold, 600);
  }
  .richText .missingComponent {
    margin-block: calc(var(--spacing, 0.25rem) * 4);
    border-radius: var(--radius-lg, 0.5rem);
    border-style: var(--tw-border-style);
    border-width: 1px;
    --tw-border-style: dashed;
    border-style: dashed;
    padding: calc(var(--spacing, 0.25rem) * 6);
    text-align: center;
    border-color: var(--theme-richText-accent);
    color: var(--theme-richText-accent);
  }
  .richText .toc {
    margin-bottom: calc(var(--spacing, 0.25rem) * 8);
    overflow: hidden;
    border-radius: var(--radius-lg, 0.5rem);
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--theme-richText-border);
    .trigger {
      display: flex;
      width: 100%;
      cursor: pointer;
      align-items: center;
      justify-content: space-between;
      gap: calc(var(--spacing, 0.25rem) * 4);
      padding: calc(var(--spacing, 0.25rem) * 3);
      --tw-font-weight: var(--font-weight-bold, 700);
      font-weight: var(--font-weight-bold, 700);
      background-color: var(--theme-richText-accent);
      color: var(--theme-richText-on-accent);
    }
    .icon {
      aspect-ratio: 1 / 1;
      width: calc(var(--spacing, 0.25rem) * 6);
      transition-property: transform, translate, scale, rotate;
      transition-timing-function: var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(0.4, 0, 0.2, 1)));
      transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
      --tw-duration: 300ms;
      transition-duration: 300ms;
      &.expanded {
        rotate: 180deg;
      }
    }
    .list {
      margin: 0px;
      display: grid;
      list-style-type: none;
      overflow: hidden;
      padding: 0px;
      transition-property: all;
      transition-timing-function: var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(0.4, 0, 0.2, 1)));
      transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
      --tw-duration: 300ms;
      transition-duration: 300ms;
      background-color: var(--theme-richText-surface);
      &.closed {
        max-height: 0px;
      }
      &.open {
        max-height: 200vh;
        padding-block: calc(var(--spacing, 0.25rem) * 2);
      }
    }
    .item {
      margin: 0px;
      padding: 0px;
    }
    .link {
      display: block;
      padding-inline: calc(var(--spacing, 0.25rem) * 4);
      padding-block: calc(var(--spacing, 0.25rem) * 2);
      text-decoration-line: none;
      color: var(--theme-richText-text);
      &:hover {
        background-color: var(--theme-richText-surface);
        color: var(--theme-richText-accent-hover);
      }
    }
  }
  .breadcrumb {
    display: flex;
    width: 100%;
    align-items: center;
    gap: calc(var(--spacing, 0.25rem) * 2);
    overflow-x: auto;
    padding: calc(var(--spacing, 0.25rem) * 3);
    font-size: var(--text-sm, 0.875rem);
    line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
    background-color: var(--surfaceSoft);
    box-shadow: inset 0 1px 3px var(--theme-shadow);
    & .item {
      min-width: fit-content;
      white-space: nowrap;
      color: var(--theme-text-muted);
    }
    & .lastItem {
      min-width: fit-content;
      white-space: nowrap;
      color: var(--theme-text-muted);
    }
    & .item {
      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, cubic-bezier(0.4, 0, 0.2, 1)));
      transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
    }
    & .item:hover {
      color: var(--theme-accent-hover);
    }
    & .lastItem {
      color: var(--theme-text);
    }
    & .separator {
      color: var(--theme-text-subtle);
    }
  }
  .blog > .breadcrumb {
    grid-column: 1 / -1;
  }
  .post:has( > .details) > .breadcrumb {
    grid-column: 1 / -1;
  }
}
@layer themePage {
  .blog {
    margin-inline: auto;
    display: grid;
    max-width: var(--breakpoint-xl, 80rem);
    gap: calc(var(--spacing, 0.25rem) * 12);
    padding-inline: calc(var(--spacing, 0.25rem) * 4);
    padding-block: calc(var(--spacing, 0.25rem) * 12);
    @media (width >= 40rem) {
      padding-inline: calc(var(--spacing, 0.25rem) * 16);
    }
    @media (width >= 48rem) {
      padding-inline: calc(var(--spacing, 0.25rem) * 8);
    }
    @media (width >= 64rem) {
      grid-template-columns: repeat(3, minmax(0, 1fr));
    }
    @media (width >= 64rem) {
      padding-inline: calc(var(--spacing, 0.25rem) * 10);
    }
    @media (width >= 80rem) {
      padding-inline: calc(var(--spacing, 0.25rem) * 20);
    }
    @media (width >= 96rem) {
      max-width: var(--breakpoint-2xl, 96rem);
    }
    @media (width >= 96rem) {
      grid-template-columns: repeat(4, minmax(0, 1fr));
    }
    @media (width >= 96rem) {
      padding-inline: calc(var(--spacing, 0.25rem) * 10);
    }
    > .posts {
      min-width: 0px;
      @media (width >= 64rem) {
        grid-column: span 2 / span 2;
      }
      @media (width >= 96rem) {
        grid-column: span 3 / span 3;
      }
    }
    > .sidebar {
      :where(& > :not(:last-child)) {
        --tw-space-y-reverse: 0;
        margin-block-start: calc(calc(var(--spacing, 0.25rem) * 8) * var(--tw-space-y-reverse));
        margin-block-end: calc(calc(var(--spacing, 0.25rem) * 8) * calc(1 - var(--tw-space-y-reverse)));
      }
      @media (width >= 64rem) {
        position: sticky;
      }
      @media (width >= 64rem) {
        top: calc(var(--spacing, 0.25rem) * 8);
      }
      @media (width >= 64rem) {
        align-self: flex-start;
      }
    }
  }
  [data-tenant='wesupply.ir'] .blog, [data-tenant='wesupply.ir'] .post:has(> .details) {
    padding-top: calc(var(--spacing, 0.25rem) * 24);
  }
}
@layer themePart {
  .posts > .items {
    display: grid;
    gap: calc(var(--spacing, 0.25rem) * 8);
    @media (width >= 40rem) {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    @media (width >= 96rem) {
      grid-template-columns: repeat(3, minmax(0, 1fr));
    }
  }
  .posts > .pagination {
    margin-top: calc(var(--spacing, 0.25rem) * 10);
  }
  .posts .post {
    height: 100%;
    overflow: hidden;
    border-radius: var(--radius-xl, 0.75rem);
    border-style: var(--tw-border-style);
    border-width: 1px;
    transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, content-visibility, overlay, pointer-events;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(0.4, 0, 0.2, 1)));
    transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
    --tw-duration: 300ms;
    transition-duration: 300ms;
    &:hover {
      @media (hover: hover) {
        --tw-translate-y: calc(var(--spacing, 0.25rem) * -1);
        translate: var(--tw-translate-x) var(--tw-translate-y);
      }
    }
    background-color: var(--theme-card-surface);
    border-color: var(--theme-card-border);
    box-shadow: 0 10px 24px var(--theme-shadow);
  }
  .posts .post:hover {
    border-color: var(--theme-card-border-hover);
    box-shadow: 0 20px 30px var(--theme-shadow-strong);
  }
  .posts .post > .link {
    display: flex;
    height: 100%;
    flex-direction: column;
    text-decoration-line: none;
  }
  .posts .media {
    aspect-ratio: var(--aspect-video, 16 / 9);
    width: 100%;
    overflow: hidden;
  }
  .posts .media .image {
    height: 100%;
    width: 100%;
    object-fit: cover;
    transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, content-visibility, overlay, pointer-events;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(0.4, 0, 0.2, 1)));
    transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
    --tw-duration: 300ms;
    transition-duration: 300ms;
  }
  .posts .post:hover .media .image {
    --tw-scale-x: 105%;
    --tw-scale-y: 105%;
    --tw-scale-z: 105%;
    scale: var(--tw-scale-x) var(--tw-scale-y);
  }
  .posts .post > .link > .content {
    display: flex;
    flex: 1;
    flex-direction: column;
    padding: calc(var(--spacing, 0.25rem) * 4);
  }
  .posts .meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: calc(var(--spacing, 0.25rem) * 4);
    font-size: var(--text-xs, 0.75rem);
    line-height: var(--tw-leading, var(--text-xs--line-height, calc(1 / 0.75)));
    color: var(--theme-text-subtle);
  }
  .posts .author {
    display: flex;
    align-items: center;
    gap: var(--spacing, 0.25rem);
  }
  .posts .date {
    display: flex;
    align-items: center;
    gap: var(--spacing, 0.25rem);
  }
  .posts .meta .icon {
    height: calc(var(--spacing, 0.25rem) * 5);
    width: calc(var(--spacing, 0.25rem) * 5);
    fill: var(--theme-text-subtle);
  }
  .posts .summary {
    display: flex;
    flex: 1;
    flex-direction: column;
  }
  .posts .summary .title {
    margin-top: calc(var(--spacing, 0.25rem) * 3);
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    min-height: calc(var(--spacing, 0.25rem) * 14);
    font-size: var(--text-xl, 1.25rem);
    line-height: var(--tw-leading, var(--text-xl--line-height, calc(1.75 / 1.25)));
    --tw-font-weight: var(--font-weight-bold, 700);
    font-weight: var(--font-weight-bold, 700);
    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, cubic-bezier(0.4, 0, 0.2, 1)));
    transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
    color: var(--theme-card-title);
  }
  .posts .summary .description {
    margin-top: calc(var(--spacing, 0.25rem) * 3);
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    flex: 1;
    --tw-leading: calc(var(--spacing, 0.25rem) * 7);
    line-height: calc(var(--spacing, 0.25rem) * 7);
    color: var(--theme-card-text);
  }
  .posts .readMore {
    margin-top: calc(var(--spacing, 0.25rem) * 6);
    display: inline-block;
    --tw-font-weight: var(--font-weight-semibold, 600);
    font-weight: var(--font-weight-semibold, 600);
    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, cubic-bezier(0.4, 0, 0.2, 1)));
    transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
    color: var(--theme-card-accent);
  }
  .posts .post:hover .readMore {
    color: var(--theme-accent-hover);
  }
}
@layer themePage {
  .post:has( > .details) {
    margin-inline: auto;
    display: grid;
    max-width: var(--breakpoint-xl, 80rem);
    padding-inline: calc(var(--spacing, 0.25rem) * 4);
    padding-block: calc(var(--spacing, 0.25rem) * 12);
    @media (width >= 40rem) {
      padding-inline: calc(var(--spacing, 0.25rem) * 16);
    }
    @media (width >= 48rem) {
      padding-inline: calc(var(--spacing, 0.25rem) * 8);
    }
    @media (width >= 64rem) {
      grid-template-columns: repeat(3, minmax(0, 1fr));
    }
    @media (width >= 64rem) {
      gap: calc(var(--spacing, 0.25rem) * 12);
    }
    @media (width >= 64rem) {
      padding-inline: calc(var(--spacing, 0.25rem) * 10);
    }
    @media (width >= 80rem) {
      padding-inline: calc(var(--spacing, 0.25rem) * 20);
    }
    > .details {
      min-width: 0px;
      @media (width >= 64rem) {
        grid-column: span 2 / span 2;
      }
    }
    .details {
      & > .media {
        margin-bottom: calc(var(--spacing, 0.25rem) * 8);
        height: calc(var(--spacing, 0.25rem) * 64);
        width: 100%;
        overflow: hidden;
        border-radius: var(--radius-lg, 0.5rem);
        @media (width >= 48rem) {
          height: calc(var(--spacing, 0.25rem) * 96);
        }
      }
      & > .media > .image {
        height: 100%;
        width: 100%;
        object-fit: cover;
      }
    }
    .meta {
      margin-bottom: calc(var(--spacing, 0.25rem) * 4);
      display: flex;
      flex-wrap: wrap;
      align-items: center;
      gap: calc(var(--spacing, 0.25rem) * 6);
      font-size: var(--text-sm, 0.875rem);
      line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
      color: var(--theme-postLayout-meta);
    }
    .author, .date {
      display: flex;
      align-items: center;
      gap: var(--spacing, 0.25rem);
    }
    .icon {
      aspect-ratio: 1 / 1;
      width: calc(var(--spacing, 0.25rem) * 5);
      fill: var(--theme-postLayout-meta);
    }
    .summary {
      & > .title {
        margin-bottom: calc(var(--spacing, 0.25rem) * 8);
        font-family: var(--font-vazirmatn);
        font-size: var(--text-3xl, 1.875rem);
        line-height: var(--tw-leading, var(--text-3xl--line-height, calc(2.25 / 1.875)));
        --tw-leading: var(--leading-tight, 1.25);
        line-height: var(--leading-tight, 1.25);
        --tw-font-weight: var(--font-weight-bold, 700);
        font-weight: var(--font-weight-bold, 700);
        @media (width >= 48rem) {
          font-size: var(--text-5xl, 3rem);
          line-height: var(--tw-leading, var(--text-5xl--line-height, 1));
        }
        color: var(--theme-postLayout-title);
      }
    }
    > .sidebar {
      margin-top: calc(var(--spacing, 0.25rem) * 12);
      :where(& > :not(:last-child)) {
        --tw-space-y-reverse: 0;
        margin-block-start: calc(calc(var(--spacing, 0.25rem) * 8) * var(--tw-space-y-reverse));
        margin-block-end: calc(calc(var(--spacing, 0.25rem) * 8) * calc(1 - var(--tw-space-y-reverse)));
      }
      @media (width >= 64rem) {
        position: sticky;
      }
      @media (width >= 64rem) {
        top: calc(var(--spacing, 0.25rem) * 8);
      }
      @media (width >= 64rem) {
        margin-top: 0px;
      }
      @media (width >= 64rem) {
        align-self: flex-start;
      }
    }
  }
  .catalog:has( > .courses) {
    margin-inline: auto;
    display: grid;
    max-width: var(--breakpoint-xl, 80rem);
    padding-inline: calc(var(--spacing, 0.25rem) * 4);
    padding-block: calc(var(--spacing, 0.25rem) * 12);
    @media (width >= 40rem) {
      padding-inline: calc(var(--spacing, 0.25rem) * 16);
    }
    @media (width >= 48rem) {
      padding-inline: calc(var(--spacing, 0.25rem) * 8);
    }
    @media (width >= 64rem) {
      grid-template-columns: repeat(3, minmax(0, 1fr));
    }
    @media (width >= 64rem) {
      gap: calc(var(--spacing, 0.25rem) * 8);
    }
    @media (width >= 64rem) {
      padding-inline: calc(var(--spacing, 0.25rem) * 10);
    }
    @media (width >= 80rem) {
      padding-inline: calc(var(--spacing, 0.25rem) * 20);
    }
    .main {
      min-width: 0px;
      @media (width >= 64rem) {
        grid-column: span 2 / span 2;
      }
    }
    .courses {
      display: grid;
      gap: calc(var(--spacing, 0.25rem) * 8);
      @media (width >= 48rem) {
        grid-template-columns: repeat(2, minmax(0, 1fr));
      }
    }
    .aside {
      margin-top: calc(var(--spacing, 0.25rem) * 12);
      :where(& > :not(:last-child)) {
        --tw-space-y-reverse: 0;
        margin-block-start: calc(calc(var(--spacing, 0.25rem) * 8) * var(--tw-space-y-reverse));
        margin-block-end: calc(calc(var(--spacing, 0.25rem) * 8) * calc(1 - var(--tw-space-y-reverse)));
      }
      @media (width >= 64rem) {
        position: sticky;
      }
      @media (width >= 64rem) {
        top: calc(var(--spacing, 0.25rem) * 8);
      }
      @media (width >= 64rem) {
        margin-top: 0px;
      }
      @media (width >= 64rem) {
        align-self: flex-start;
      }
    }
  }
}
@layer themePart {
  .course {
    height: 100%;
    overflow: hidden;
    border-radius: var(--radius-xl, 0.75rem);
    border-style: var(--tw-border-style);
    border-width: 1px;
    transition-property: all;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(0.4, 0, 0.2, 1)));
    transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
    --tw-duration: 300ms;
    transition-duration: 300ms;
    &:hover {
      @media (hover: hover) {
        --tw-translate-y: calc(var(--spacing, 0.25rem) * -1);
        translate: var(--tw-translate-x) var(--tw-translate-y);
      }
    }
    background-color: var(--theme-course-surface);
    border-color: var(--theme-course-border);
    .link {
      display: flex;
      height: 100%;
      flex-direction: column;
      text-decoration-line: none;
    }
    .image {
      aspect-ratio: var(--aspect-video, 16 / 9);
      width: 100%;
      overflow: hidden;
    }
    .media {
      height: 100%;
      width: 100%;
      object-fit: cover;
      transition-property: transform, translate, scale, rotate;
      transition-timing-function: var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(0.4, 0, 0.2, 1)));
      transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
      --tw-duration: 300ms;
      transition-duration: 300ms;
    }
    .content {
      display: flex;
      flex: 1;
      flex-direction: column;
      padding: calc(var(--spacing, 0.25rem) * 5);
    }
    .title {
      font-family: var(--font-vazirmatn);
      font-size: var(--text-xl, 1.25rem);
      line-height: var(--tw-leading, var(--text-xl--line-height, calc(1.75 / 1.25)));
      --tw-font-weight: var(--font-weight-bold, 700);
      font-weight: var(--font-weight-bold, 700);
      color: var(--theme-course-title);
    }
    .description {
      margin-top: calc(var(--spacing, 0.25rem) * 3);
      overflow: hidden;
      display: -webkit-box;
      -webkit-box-orient: vertical;
      -webkit-line-clamp: 3;
      --tw-leading: calc(var(--spacing, 0.25rem) * 7);
      line-height: calc(var(--spacing, 0.25rem) * 7);
      color: var(--theme-course-text);
    }
    &:hover {
      border-color: var(--theme-course-border-hover);
      box-shadow: 0 20px 25px -5px var(--theme-shadow), 0 8px 10px -6px var(--theme-shadow);
      .media {
        --tw-scale-x: 105%;
        --tw-scale-y: 105%;
        --tw-scale-z: 105%;
        scale: var(--tw-scale-x) var(--tw-scale-y);
      }
    }
  }
}
@layer themePage {
  .course {
    margin-inline: auto;
    display: grid;
    max-width: var(--breakpoint-xl, 80rem);
    padding-inline: calc(var(--spacing, 0.25rem) * 4);
    padding-block: calc(var(--spacing, 0.25rem) * 12);
    @media (width >= 40rem) {
      padding-inline: calc(var(--spacing, 0.25rem) * 16);
    }
    @media (width >= 48rem) {
      padding-inline: calc(var(--spacing, 0.25rem) * 8);
    }
    @media (width >= 64rem) {
      grid-template-columns: repeat(3, minmax(0, 1fr));
    }
    @media (width >= 64rem) {
      gap: calc(var(--spacing, 0.25rem) * 12);
    }
    @media (width >= 64rem) {
      padding-inline: calc(var(--spacing, 0.25rem) * 10);
    }
    @media (width >= 80rem) {
      padding-inline: calc(var(--spacing, 0.25rem) * 20);
    }
    .main {
      min-width: 0px;
      @media (width >= 64rem) {
        grid-column: span 2 / span 2;
      }
    }
  }
}
@layer themePart {
  .course > .sidebar {
    margin-top: calc(var(--spacing, 0.25rem) * 12);
    :where(& > :not(:last-child)) {
      --tw-space-y-reverse: 0;
      margin-block-start: calc(calc(var(--spacing, 0.25rem) * 8) * var(--tw-space-y-reverse));
      margin-block-end: calc(calc(var(--spacing, 0.25rem) * 8) * calc(1 - var(--tw-space-y-reverse)));
    }
    @media (width >= 64rem) {
      position: sticky;
    }
    @media (width >= 64rem) {
      top: calc(var(--spacing, 0.25rem) * 8);
    }
    @media (width >= 64rem) {
      margin-top: 0px;
    }
    @media (width >= 64rem) {
      align-self: flex-start;
    }
  }
}
@layer themePage {
  .vlog .main {
    margin-inline: auto;
    margin-block: calc(var(--spacing, 0.25rem) * 10);
    max-width: var(--container-7xl, 80rem);
    padding-inline: calc(var(--spacing, 0.25rem) * 6);
  }
  .vlog .videos {
    display: grid;
    gap: calc(var(--spacing, 0.25rem) * 6);
    @media (width >= 40rem) {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    @media (width >= 64rem) {
      grid-template-columns: repeat(3, minmax(0, 1fr));
    }
  }
}
@layer themePart {
  :is(.vlog, .vlogPost) .breadcrumb {
    margin-inline: auto;
    display: flex;
    max-width: var(--container-7xl, 80rem);
    align-items: center;
    overflow-x: auto;
    padding-inline: calc(var(--spacing, 0.25rem) * 6);
    padding-block: calc(var(--spacing, 0.25rem) * 3);
    font-size: var(--text-sm, 0.875rem);
    line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
    & .item {
      min-width: fit-content;
      white-space: nowrap;
      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, cubic-bezier(0.4, 0, 0.2, 1)));
      transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
      color: var(--theme-vlog-text);
    }
    & .item:hover {
      color: var(--theme-vlog-accent-hover);
    }
    & .separator {
      margin-inline: calc(var(--spacing, 0.25rem) * 2);
      color: var(--theme-vlog-text-muted);
    }
  }
  :is(.vlog, .vlogPost) .faq {
    border-style: var(--tw-border-style);
    border-width: 1px;
    --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);
    background-color: var(--theme-vlog-surface);
    border-color: var(--theme-vlog-border);
    color: var(--theme-vlog-text);
  }
  :is(.vlog, .vlogPost) .arrow {
    border-radius: calc(infinity * 1px);
    fill: var(--theme-vlog-accent);
  }
  .video {
    height: 100%;
    overflow: hidden;
    border-radius: var(--radius-xl, 0.75rem);
    border-style: var(--tw-border-style);
    border-width: 1px;
    transition-property: all;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(0.4, 0, 0.2, 1)));
    transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
    --tw-duration: 300ms;
    transition-duration: 300ms;
    &:hover {
      @media (hover: hover) {
        --tw-translate-y: calc(var(--spacing, 0.25rem) * -1);
        translate: var(--tw-translate-x) var(--tw-translate-y);
      }
    }
    background-color: var(--theme-vlog-surface);
    border-color: var(--theme-vlog-border);
    .link {
      display: flex;
      height: 100%;
      flex-direction: column;
      text-decoration-line: none;
    }
    .visual {
      position: relative;
    }
    .image {
      aspect-ratio: var(--aspect-video, 16 / 9);
      width: 100%;
      overflow: hidden;
    }
    .media {
      height: 100%;
      width: 100%;
      object-fit: cover;
      transition-property: transform, translate, scale, rotate;
      transition-timing-function: var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(0.4, 0, 0.2, 1)));
      transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
      --tw-duration: 300ms;
      transition-duration: 300ms;
    }
    .duration {
      position: absolute;
      inset-inline-end: calc(var(--spacing, 0.25rem) * 3);
      bottom: calc(var(--spacing, 0.25rem) * 3);
      border-radius: 0.25rem;
      padding-inline: calc(var(--spacing, 0.25rem) * 2);
      padding-block: var(--spacing, 0.25rem);
      font-size: var(--text-xs, 0.75rem);
      line-height: var(--tw-leading, var(--text-xs--line-height, calc(1 / 0.75)));
      background-color: var(--theme-vlog-overlay);
      color: var(--theme-vlog-on-overlay);
    }
    .content {
      display: flex;
      flex: 1;
      flex-direction: column;
      padding: calc(var(--spacing, 0.25rem) * 5);
    }
    .title {
      overflow: hidden;
      display: -webkit-box;
      -webkit-box-orient: vertical;
      -webkit-line-clamp: 2;
      font-family: var(--font-vazirmatn);
      font-size: var(--text-lg, 1.125rem);
      line-height: var(--tw-leading, var(--text-lg--line-height, calc(1.75 / 1.125)));
      --tw-font-weight: var(--font-weight-bold, 700);
      font-weight: var(--font-weight-bold, 700);
      color: var(--theme-vlog-title);
    }
    .date {
      margin-top: calc(var(--spacing, 0.25rem) * 3);
      font-size: var(--text-sm, 0.875rem);
      line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
      color: var(--theme-vlog-text-muted);
    }
    &:hover {
      border-color: var(--theme-vlog-border-hover);
      box-shadow: 0 20px 25px -5px var(--theme-shadow), 0 8px 10px -6px var(--theme-shadow);
      .media {
        --tw-scale-x: 105%;
        --tw-scale-y: 105%;
        --tw-scale-z: 105%;
        scale: var(--tw-scale-x) var(--tw-scale-y);
      }
    }
  }
}
@layer themePage {
  .vlogPost .main {
    margin-inline: auto;
    margin-block: calc(var(--spacing, 0.25rem) * 10);
    max-width: var(--container-7xl, 80rem);
    padding-inline: calc(var(--spacing, 0.25rem) * 6);
  }
  .vlogPost .content {
    margin-inline: auto;
    width: 100%;
    max-width: var(--container-4xl, 56rem);
    padding-block: calc(var(--spacing, 0.25rem) * 6);
    & > .title {
      margin-top: calc(var(--spacing, 0.25rem) * 6);
      margin-bottom: calc(var(--spacing, 0.25rem) * 3);
      font-family: var(--font-vazirmatn);
      font-size: var(--text-2xl, 1.5rem);
      line-height: var(--tw-leading, var(--text-2xl--line-height, calc(2 / 1.5)));
      --tw-font-weight: var(--font-weight-bold, 700);
      font-weight: var(--font-weight-bold, 700);
      color: var(--theme-vlog-title);
    }
  }
  .vlogPost .description {
    font-size: var(--text-lg, 1.125rem);
    line-height: var(--tw-leading, var(--text-lg--line-height, calc(1.75 / 1.125)));
    --tw-leading: calc(var(--spacing, 0.25rem) * 8);
    line-height: calc(var(--spacing, 0.25rem) * 8);
    color: var(--theme-vlog-text);
  }
}
@layer themePart {
  .vlogPost .info {
    margin-top: calc(var(--spacing, 0.25rem) * 5);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: calc(var(--spacing, 0.25rem) * 4);
    padding-block: 0px;
    font-size: var(--text-sm, 0.875rem);
    line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
    color: var(--theme-vlog-text-muted);
    .visits, .date {
      display: flex;
      align-items: center;
      gap: var(--spacing, 0.25rem);
    }
    .icon {
      aspect-ratio: 1 / 1;
      width: calc(var(--spacing, 0.25rem) * 4);
      fill: var(--theme-vlog-accent);
    }
  }
  .vlogPost > .main > .tags {
    margin-bottom: calc(var(--spacing, 0.25rem) * 10);
    display: flex;
    flex-wrap: wrap;
    gap: calc(var(--spacing, 0.25rem) * 2);
    padding-top: calc(var(--spacing, 0.25rem) * 5);
    .link {
      border-radius: calc(infinity * 1px);
      padding-inline: calc(var(--spacing, 0.25rem) * 4);
      padding-block: calc(var(--spacing, 0.25rem) * 2);
      font-size: var(--text-sm, 0.875rem);
      line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
      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, cubic-bezier(0.4, 0, 0.2, 1)));
      transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
      background-color: var(--theme-vlog-surface);
      color: var(--theme-vlog-text);
      &:hover {
        background-color: var(--theme-vlog-accent);
        color: var(--theme-vlog-on-overlay);
      }
    }
  }
}
:root {
  --videoSurface: #000;
}
@layer themePart {
  .vlogPost > .main > .video {
    margin-inline: auto;
    aspect-ratio: var(--aspect-video, 16 / 9);
    width: 100%;
    max-width: var(--container-4xl, 56rem);
    background-color: var(--videoSurface);
  }
  .vlogPost .related {
    margin-top: calc(var(--spacing, 0.25rem) * 12);
    .list {
      display: grid;
      gap: calc(var(--spacing, 0.25rem) * 6);
      @media (width >= 40rem) {
        grid-template-columns: repeat(2, minmax(0, 1fr));
      }
      @media (width >= 64rem) {
        grid-template-columns: repeat(3, minmax(0, 1fr));
      }
    }
  }
  .contents, :is(.contentDetail, .pageDetail) {
    margin-inline: auto;
    max-width: var(--container-7xl, 80rem);
    padding-inline: calc(var(--spacing, 0.25rem) * 6);
    padding-block: calc(var(--spacing, 0.25rem) * 12);
  }
  :is(.contentDetail, .pageDetail) {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    @media (width >= 48rem) {
      padding-block: calc(var(--spacing, 0.25rem) * 16);
    }
    @media (width >= 64rem) {
      padding-block: calc(var(--spacing, 0.25rem) * 20);
    }
    color: var(--theme-content-text);
  }
  :is(.contentDetail, .pageDetail)::before {
    pointer-events: none;
    position: absolute;
    inset-inline: 0px;
    top: 0px;
    z-index: calc(10 * -1);
    height: calc(var(--spacing, 0.25rem) * 72);
    background-image: linear-gradient( to bottom, var(--theme-accent-soft), transparent );
    @supports (color: color-mix(in lab, red, red)) {
      background-image: linear-gradient( to bottom, color-mix(in srgb, var(--theme-accent-soft) 72%, transparent), transparent );
    }
    content: '';
  }
  .contents > .title, :is(.contentDetail, .pageDetail) .article > .title, :is(.contentDetail, .pageDetail) .article > .summary > .title {
    margin-bottom: calc(var(--spacing, 0.25rem) * 8);
    font-family: var(--font-vazirmatn);
    font-size: var(--text-3xl, 1.875rem);
    line-height: var(--tw-leading, var(--text-3xl--line-height, calc(2.25 / 1.875)));
    --tw-font-weight: var(--font-weight-bold, 700);
    font-weight: var(--font-weight-bold, 700);
    @media (width >= 48rem) {
      font-size: var(--text-5xl, 3rem);
      line-height: var(--tw-leading, var(--text-5xl--line-height, 1));
    }
    color: var(--theme-content-title);
  }
  .contents > .list {
    display: grid;
    gap: calc(var(--spacing, 0.25rem) * 8);
    @media (width >= 40rem) {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    @media (width >= 64rem) {
      grid-template-columns: repeat(3, minmax(0, 1fr));
    }
  }
  .contents > .list > .content {
    height: 100%;
    overflow: hidden;
    border-radius: var(--radius-xl, 0.75rem);
    border-style: var(--tw-border-style);
    border-width: 1px;
    transition-property: all;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(0.4, 0, 0.2, 1)));
    transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
    --tw-duration: 300ms;
    transition-duration: 300ms;
    &:hover {
      @media (hover: hover) {
        --tw-translate-y: calc(var(--spacing, 0.25rem) * -1);
        translate: var(--tw-translate-x) var(--tw-translate-y);
      }
    }
    background-color: var(--theme-content-surface);
    border-color: var(--theme-content-border);
    .link {
      display: flex;
      height: 100%;
      flex-direction: column;
      text-decoration-line: none;
    }
    .image {
      aspect-ratio: var(--aspect-video, 16 / 9);
      width: 100%;
      overflow: hidden;
    }
    .media {
      height: 100%;
      width: 100%;
      object-fit: cover;
      transition-property: transform, translate, scale, rotate;
      transition-timing-function: var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(0.4, 0, 0.2, 1)));
      transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
      --tw-duration: 300ms;
      transition-duration: 300ms;
    }
    .content {
      display: flex;
      flex: 1;
      flex-direction: column;
      padding: calc(var(--spacing, 0.25rem) * 5);
    }
    .title {
      font-family: var(--font-vazirmatn);
      font-size: var(--text-xl, 1.25rem);
      line-height: var(--tw-leading, var(--text-xl--line-height, calc(1.75 / 1.25)));
      --tw-font-weight: var(--font-weight-bold, 700);
      font-weight: var(--font-weight-bold, 700);
      color: var(--theme-content-title);
    }
    .description {
      margin-top: calc(var(--spacing, 0.25rem) * 3);
      overflow: hidden;
      display: -webkit-box;
      -webkit-box-orient: vertical;
      -webkit-line-clamp: 3;
      --tw-leading: calc(var(--spacing, 0.25rem) * 7);
      line-height: calc(var(--spacing, 0.25rem) * 7);
      color: var(--theme-content-text);
    }
  }
  .contents > .list > .content:hover {
    border-color: var(--theme-content-border-hover);
    box-shadow: 0 20px 25px -5px var(--theme-shadow), 0 8px 10px -6px var(--theme-shadow);
    .media {
      --tw-scale-x: 105%;
      --tw-scale-y: 105%;
      --tw-scale-z: 105%;
      scale: var(--tw-scale-x) var(--tw-scale-y);
    }
  }
  :is(.contentDetail, .pageDetail) > :is(.image, .media) {
    margin-inline: auto;
    margin-bottom: calc(var(--spacing, 0.25rem) * 8);
    aspect-ratio: var(--aspect-video, 16 / 9);
    width: 100%;
    max-width: var(--container-5xl, 64rem);
    overflow: hidden;
    border-radius: var(--radius-2xl, 1rem);
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--theme-content-border);
    box-shadow: 0 24px 60px -36px var(--theme-shadow-strong);
  }
  :is(.contentDetail, .pageDetail) > :is(.image, .media) :is(.media, .image) {
    height: 100%;
    width: 100%;
    object-fit: cover;
  }
  :is(.contentDetail, .pageDetail) .article {
    margin-inline: auto;
    max-width: var(--container-4xl, 56rem);
    border-radius: var(--radius-2xl, 1rem);
    border-style: var(--tw-border-style);
    border-width: 1px;
    padding-inline: calc(var(--spacing, 0.25rem) * 6);
    padding-block: calc(var(--spacing, 0.25rem) * 8);
    @media (width >= 40rem) {
      padding-inline: calc(var(--spacing, 0.25rem) * 10);
    }
    @media (width >= 48rem) {
      padding-block: calc(var(--spacing, 0.25rem) * 12);
    }
    @media (width >= 64rem) {
      padding-inline: calc(var(--spacing, 0.25rem) * 14);
    }
    background-color: var(--theme-content-surface);
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix( in srgb, var(--theme-content-surface) 94%, transparent );
    }
    border-color: var(--theme-content-border);
    box-shadow: 0 24px 60px -42px var(--theme-shadow-strong);
  }
  :is(.contentDetail, .pageDetail) .article > .title, :is(.contentDetail, .pageDetail) .article > .summary > .title {
    position: relative;
    padding-bottom: calc(var(--spacing, 0.25rem) * 6);
    --tw-leading: var(--leading-tight, 1.25);
    line-height: var(--leading-tight, 1.25);
    text-wrap: balance;
  }
  :is(.contentDetail, .pageDetail) .article > .title::after, :is(.contentDetail, .pageDetail) .article > .summary > .title::after {
    position: absolute;
    inset-inline-start: calc(var(--spacing, 0.25rem) * 0);
    bottom: 0px;
    height: var(--spacing, 0.25rem);
    width: calc(var(--spacing, 0.25rem) * 16);
    border-radius: calc(infinity * 1px);
    background-image: linear-gradient( to right, var(--theme-accent), var(--theme-highlight) );
    content: '';
  }
  :is(.contentDetail, .pageDetail) .description {
    margin-top: calc(var(--spacing, 0.25rem) * 6);
    margin-bottom: calc(var(--spacing, 0.25rem) * 8);
    font-size: var(--text-lg, 1.125rem);
    line-height: var(--tw-leading, var(--text-lg--line-height, calc(1.75 / 1.125)));
    --tw-leading: calc(var(--spacing, 0.25rem) * 8);
    line-height: calc(var(--spacing, 0.25rem) * 8);
    @media (width >= 48rem) {
      font-size: var(--text-xl, 1.25rem);
      line-height: var(--tw-leading, var(--text-xl--line-height, calc(1.75 / 1.25)));
    }
    color: var(--theme-content-text);
  }
  :is(.contentDetail, .pageDetail) .richText {
    border-top-style: var(--tw-border-style);
    border-top-width: 1px;
    padding-top: calc(var(--spacing, 0.25rem) * 2);
    border-color: var(--theme-content-border);
  }
  :is(.contentDetail, .pageDetail) .richText > :first-child {
    margin-top: calc(var(--spacing, 0.25rem) * 6);
  }
  @media (width < 40rem) {
    :is(.contentDetail, .pageDetail) {
      padding-inline: calc(var(--spacing, 0.25rem) * 4);
      padding-block: calc(var(--spacing, 0.25rem) * 8);
    }
    :is(.contentDetail, .pageDetail) .article {
      border-radius: var(--radius-xl, 0.75rem);
      padding-inline: calc(var(--spacing, 0.25rem) * 5);
      padding-block: calc(var(--spacing, 0.25rem) * 7);
    }
  }
}
@layer themePage {
  .layoutDemo {
    min-height: 100vh;
    padding-inline: calc(var(--spacing, 0.25rem) * 5);
    padding-block: calc(var(--spacing, 0.25rem) * 8);
    background: var(--surfaceSoft);
    color: var(--theme-text);
  }
  .layoutToolbar {
    margin-inline: auto;
    margin-bottom: calc(var(--spacing, 0.25rem) * 6);
    display: flex;
    max-width: var(--container-7xl, 80rem);
    flex-direction: column;
    align-items: flex-start;
    justify-content: space-between;
    gap: calc(var(--spacing, 0.25rem) * 4);
    border-radius: var(--radius-2xl, 1rem);
    border-style: var(--tw-border-style);
    border-width: 1px;
    padding: calc(var(--spacing, 0.25rem) * 4);
    @media (width >= 40rem) {
      flex-direction: row;
    }
    @media (width >= 40rem) {
      align-items: center;
    }
    background: var(--theme-surface);
    border-color: var(--theme-border);
    box-shadow: 0 12px 30px var(--theme-shadow);
  }
  .toolbarLabel {
    --tw-font-weight: var(--font-weight-semibold, 600);
    font-weight: var(--font-weight-semibold, 600);
  }
  .layoutToggle {
    cursor: pointer;
    border-radius: var(--radius-xl, 0.75rem);
    padding-inline: calc(var(--spacing, 0.25rem) * 5);
    padding-block: calc(var(--spacing, 0.25rem) * 3);
    --tw-font-weight: var(--font-weight-semibold, 600);
    font-weight: var(--font-weight-semibold, 600);
    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, cubic-bezier(0.4, 0, 0.2, 1)));
    transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
    background: var(--theme-accent);
    color: var(--theme-on-accent);
    &:hover {
      background: var(--theme-accent-hover);
    }
  }
  .layoutRenderer {
    margin-inline: auto;
    max-width: var(--container-7xl, 80rem);
    overflow: hidden;
    border-radius: var(--radius-3xl, 1.5rem);
    border-style: var(--tw-border-style);
    border-width: 1px;
    background: var(--theme-surface);
    border-color: var(--theme-border);
    box-shadow: 0 20px 45px var(--theme-shadow);
  }
  .layoutSummary {
    border-bottom-style: var(--tw-border-style);
    border-bottom-width: 1px;
    padding-inline: calc(var(--spacing, 0.25rem) * 6);
    padding-block: calc(var(--spacing, 0.25rem) * 7);
    @media (width >= 48rem) {
      padding-inline: calc(var(--spacing, 0.25rem) * 10);
    }
    border-color: var(--theme-border);
  }
  .layoutLabel {
    margin-bottom: calc(var(--spacing, 0.25rem) * 2);
    font-size: var(--text-sm, 0.875rem);
    line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
    --tw-font-weight: var(--font-weight-bold, 700);
    font-weight: var(--font-weight-bold, 700);
    --tw-tracking: var(--tracking-widest, 0.1em);
    letter-spacing: var(--tracking-widest, 0.1em);
    text-transform: uppercase;
    color: var(--theme-accent);
  }
  .layoutTitle {
    font-size: var(--text-3xl, 1.875rem);
    line-height: var(--tw-leading, var(--text-3xl--line-height, calc(2.25 / 1.875)));
    --tw-font-weight: var(--font-weight-bold, 700);
    font-weight: var(--font-weight-bold, 700);
    @media (width >= 48rem) {
      font-size: var(--text-4xl, 2.25rem);
      line-height: var(--tw-leading, var(--text-4xl--line-height, calc(2.5 / 2.25)));
    }
    color: var(--theme-text);
  }
  .layoutDescription {
    margin-top: calc(var(--spacing, 0.25rem) * 3);
    max-width: var(--container-2xl, 42rem);
    --tw-leading: calc(var(--spacing, 0.25rem) * 7);
    line-height: calc(var(--spacing, 0.25rem) * 7);
    color: var(--theme-text-muted);
  }
  .layoutCanvas {
    padding: calc(var(--spacing, 0.25rem) * 4);
    @media (width >= 48rem) {
      padding: calc(var(--spacing, 0.25rem) * 8);
    }
  }
  .layoutItem[data-item-kind='structure'] {
    min-width: 0px;
  }
  .layoutItem[data-item-kind='part'] {
    min-width: 0px;
    border-radius: var(--radius-2xl, 1rem);
    border-style: var(--tw-border-style);
    border-width: 1px;
    padding: calc(var(--spacing, 0.25rem) * 5);
    background: var(--theme-accent-soft);
    border-color: var(--theme-border);
  }
  .uiPartMetadata {
    display: grid;
    gap: calc(var(--spacing, 0.25rem) * 3);
  }
  .metadataItem {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    justify-content: space-between;
    gap: calc(var(--spacing, 0.25rem) * 2);
    border-bottom-style: var(--tw-border-style);
    border-bottom-width: 1px;
    padding-bottom: calc(var(--spacing, 0.25rem) * 2);
    &:last-child {
      border-style: var(--tw-border-style);
      border-width: 0px;
    }
    &:last-child {
      padding-bottom: 0px;
    }
    border-color: var(--theme-border);
  }
  .metadataLabel {
    font-size: var(--text-xs, 0.75rem);
    line-height: var(--tw-leading, var(--text-xs--line-height, calc(1 / 0.75)));
    --tw-font-weight: var(--font-weight-bold, 700);
    font-weight: var(--font-weight-bold, 700);
    --tw-tracking: var(--tracking-wide, 0.025em);
    letter-spacing: var(--tracking-wide, 0.025em);
    text-transform: uppercase;
    color: var(--theme-text-subtle);
  }
  .metadataValue {
    font-family: var(--font-mono, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono",
      "Courier New", monospace);
    font-size: var(--text-sm, 0.875rem);
    line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
    --tw-font-weight: var(--font-weight-semibold, 600);
    font-weight: var(--font-weight-semibold, 600);
    color: var(--theme-text);
  }
  .layoutRenderer[data-layout-variant='sidebarRight'] .layoutItem[data-ui-part='contentPage'] {
    display: grid;
    gap: calc(var(--spacing, 0.25rem) * 6);
  }
  .layoutRenderer[data-layout-variant='sidebarRight'] .layoutItem[data-ui-part='contentBody'] {
    display: grid;
    gap: calc(var(--spacing, 0.25rem) * 6);
    @media (width >= 64rem) {
      grid-template-columns: minmax(0,1fr) 20rem;
    }
  }
  .layoutRenderer[data-layout-variant='sidebarRight'] .layoutItem[data-region='header'] {
    min-height: calc(var(--spacing, 0.25rem) * 32);
    background: var(--surfaceSoft);
  }
  .layoutRenderer[data-layout-variant='sidebarRight'] .layoutItem[data-region='content'] {
    min-height: calc(var(--spacing, 0.25rem) * 96);
  }
  .layoutRenderer[data-layout-variant='sidebarRight'] .layoutItem[data-region='aside'] {
    border-radius: var(--radius-2xl, 1rem);
    border-style: var(--tw-border-style);
    border-width: 1px;
    padding: calc(var(--spacing, 0.25rem) * 4);
    border-color: var(--theme-border);
  }
  .layoutRenderer[data-layout-variant='showcase'] .layoutCanvas {
    padding: 0px;
  }
  .layoutRenderer[data-layout-variant='showcase'] .layoutItem[data-ui-part='campaignPage'] {
    display: grid;
    gap: 0px;
  }
  .layoutRenderer[data-layout-variant='showcase'] .layoutItem[data-region='hero'] {
    min-height: 32rem;
    border-radius: 0;
    border-style: var(--tw-border-style);
    border-width: 0px;
    padding: calc(var(--spacing, 0.25rem) * 10);
    @media (width >= 48rem) {
      padding: calc(var(--spacing, 0.25rem) * 16);
    }
    background: linear-gradient( 135deg, var(--theme-accent), var(--theme-highlight) );
    color: var(--theme-on-accent);
  }
  .layoutRenderer[data-layout-variant='sidebarRight'] .layoutItem[data-ui-part='contentMain'], .layoutRenderer[data-layout-variant='sidebarRight'] .layoutItem[data-ui-part='contentAside'] {
    display: grid;
    align-content: flex-start;
    gap: calc(var(--spacing, 0.25rem) * 6);
  }
  .layoutRenderer[data-layout-variant='showcase'] .layoutItem[data-region='hero'] .metadataLabel, .layoutRenderer[data-layout-variant='showcase'] .layoutItem[data-region='hero'] .metadataValue {
    color: var(--theme-on-accent);
  }
  .layoutRenderer[data-layout-variant='showcase'] .layoutItem[data-region='mosaic'] {
    display: grid;
    gap: calc(var(--spacing, 0.25rem) * 4);
    padding: calc(var(--spacing, 0.25rem) * 4);
    @media (width >= 48rem) {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    @media (width >= 48rem) {
      grid-template-rows: repeat(2, minmax(0, 1fr));
    }
    @media (width >= 48rem) {
      padding: calc(var(--spacing, 0.25rem) * 8);
    }
    background: var(--surfaceSoft);
  }
  .layoutRenderer[data-layout-variant='showcase'] .layoutItem[data-region='spotlight'] {
    min-height: calc(var(--spacing, 0.25rem) * 96);
    @media (width >= 48rem) {
      grid-row: span 2 / span 2;
    }
  }
  .layoutRenderer[data-layout-variant='showcase'] .layoutItem[data-region='offer'] {
    background: var(--theme-highlight);
  }
  .layoutRenderer[data-layout-variant='showcase'] .layoutItem[data-region='stream'] {
    display: grid;
    gap: calc(var(--spacing, 0.25rem) * 8);
    padding-inline: calc(var(--spacing, 0.25rem) * 4);
    padding-block: calc(var(--spacing, 0.25rem) * 16);
    @media (width >= 48rem) {
      padding-inline: calc(var(--spacing, 0.25rem) * 10);
    }
  }
  .layoutRenderer[data-layout-variant='showcase'] .layoutItem[data-region='heading'] {
    margin-inline: auto;
    min-height: calc(var(--spacing, 0.25rem) * 32);
    width: 100%;
    max-width: var(--container-2xl, 42rem);
    text-align: center;
  }
  .layoutRenderer[data-layout-variant='showcase'] .layoutItem[data-region='products'] {
    min-height: calc(var(--spacing, 0.25rem) * 72);
  }
  .layoutRenderer[data-layout-variant='showcase'] .layoutItem[data-region='collections'], .layoutRenderer[data-layout-variant='showcase'] .layoutItem[data-region='offer'] {
    min-height: calc(var(--spacing, 0.25rem) * 44);
  }
  .galleries, .projects, .questions, .question, .forums, .board, .discussion {
    margin-inline: auto;
    max-width: var(--container-7xl, 80rem);
    padding-inline: calc(var(--spacing, 0.25rem) * 5);
    padding-block: calc(var(--spacing, 0.25rem) * 10);
  }
  .galleries > section > .container {
    margin-inline: auto;
    max-width: var(--container-7xl, 80rem);
  }
  .questions > .container {
    margin-inline: auto;
    max-width: var(--container-7xl, 80rem);
  }
  .question > .container {
    margin-inline: auto;
    max-width: var(--container-7xl, 80rem);
    border-radius: var(--radius-2xl, 1rem);
    padding: calc(var(--spacing, 0.25rem) * 5);
    --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);
    @media (width >= 48rem) {
      padding: calc(var(--spacing, 0.25rem) * 14);
    }
  }
  .question .heading {
    margin-bottom: calc(var(--spacing, 0.25rem) * 4);
    border-bottom-style: var(--tw-border-style);
    border-bottom-width: 2px;
    padding-bottom: calc(var(--spacing, 0.25rem) * 4);
    border-color: var(--theme-content-border);
  }
  .question .main {
    margin-top: calc(var(--spacing, 0.25rem) * 8);
    @media (width >= 48rem) {
      padding-inline: calc(var(--spacing, 0.25rem) * 20);
    }
  }
  .question .action {
    margin-top: calc(var(--spacing, 0.25rem) * 5);
    margin-bottom: calc(var(--spacing, 0.25rem) * 8);
    display: flex;
    justify-content: flex-start;
    padding-inline: calc(var(--spacing, 0.25rem) * 4);
  }
  .question .action .link {
    border-radius: var(--radius-md, 0.375rem);
    border-style: var(--tw-border-style);
    border-width: 1px;
    padding-inline: calc(var(--spacing, 0.25rem) * 6);
    padding-block: calc(var(--spacing, 0.25rem) * 3);
    --tw-font-weight: var(--font-weight-bold, 700);
    font-weight: var(--font-weight-bold, 700);
    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, cubic-bezier(0.4, 0, 0.2, 1)));
    transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
    background-color: var(--theme-content-title);
    border-color: var(--theme-content-title);
    color: var(--theme-on-accent);
  }
  .galleries .title {
    margin-bottom: calc(var(--spacing, 0.25rem) * 10);
    text-align: center;
    font-family: var(--font-vazirmatn);
    font-size: var(--text-3xl, 1.875rem);
    line-height: var(--tw-leading, var(--text-3xl--line-height, calc(2.25 / 1.875)));
    --tw-font-weight: var(--font-weight-bold, 700);
    font-weight: var(--font-weight-bold, 700);
    color: var(--theme-content-title);
  }
  .projects > .heading .title {
    margin-bottom: calc(var(--spacing, 0.25rem) * 10);
    text-align: center;
    font-family: var(--font-vazirmatn);
    font-size: var(--text-3xl, 1.875rem);
    line-height: var(--tw-leading, var(--text-3xl--line-height, calc(2.25 / 1.875)));
    --tw-font-weight: var(--font-weight-bold, 700);
    font-weight: var(--font-weight-bold, 700);
    color: var(--theme-content-title);
  }
  .galleries .list {
    display: grid;
    gap: calc(var(--spacing, 0.25rem) * 6);
    @media (width >= 40rem) {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    @media (width >= 64rem) {
      grid-template-columns: repeat(3, minmax(0, 1fr));
    }
  }
  .projects > .list {
    display: grid;
    gap: calc(var(--spacing, 0.25rem) * 6);
    @media (width >= 40rem) {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    @media (width >= 64rem) {
      grid-template-columns: repeat(3, minmax(0, 1fr));
    }
  }
  .galleries .item {
    cursor: pointer;
    border-radius: var(--radius-xl, 0.75rem);
    border-style: var(--tw-border-style);
    border-width: 1px;
    padding: calc(var(--spacing, 0.25rem) * 4);
    background-color: var(--theme-content-surface);
    border-color: var(--theme-content-border);
  }
  .galleries .image {
    aspect-ratio: 3/2;
    overflow: hidden;
    border-radius: var(--radius-xl, 0.75rem);
  }
  .galleries .media {
    height: 100%;
    width: 100%;
    object-fit: cover;
    transition-property: transform, translate, scale, rotate;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(0.4, 0, 0.2, 1)));
    transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
    --tw-duration: 500ms;
    transition-duration: 500ms;
  }
  .galleries .item:hover .media {
    --tw-scale-x: 110%;
    --tw-scale-y: 110%;
    --tw-scale-z: 110%;
    scale: var(--tw-scale-x) var(--tw-scale-y);
  }
  .galleries .entryTitle {
    margin-block: calc(var(--spacing, 0.25rem) * 5);
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
    font-size: var(--text-xl, 1.25rem);
    line-height: var(--tw-leading, var(--text-xl--line-height, calc(1.75 / 1.25)));
    --tw-font-weight: var(--font-weight-bold, 700);
    font-weight: var(--font-weight-bold, 700);
  }
  .galleries .description {
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    --tw-leading: calc(var(--spacing, 0.25rem) * 6);
    line-height: calc(var(--spacing, 0.25rem) * 6);
    color: var(--theme-content-text);
  }
  .projects > .content {
    padding-block: calc(var(--spacing, 0.25rem) * 6);
  }
  .projects .surface {
    border-radius: var(--radius-2xl, 1rem);
    padding: calc(var(--spacing, 0.25rem) * 6);
    background-color: var(--theme-content-surface);
  }
  .questions > .container {
    border-radius: var(--radius-2xl, 1rem);
    padding: calc(var(--spacing, 0.25rem) * 5);
    --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);
    @media (width >= 48rem) {
      padding: calc(var(--spacing, 0.25rem) * 14);
    }
  }
  .questions .heading {
    margin-bottom: calc(var(--spacing, 0.25rem) * 4);
    border-bottom-style: var(--tw-border-style);
    border-bottom-width: 2px;
    padding-bottom: calc(var(--spacing, 0.25rem) * 4);
    border-color: var(--theme-content-border);
  }
  .questions .content {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: calc(var(--spacing, 0.25rem) * 10);
    @media (width >= 64rem) {
      flex-direction: row;
    }
  }
  .forums > .container {
    display: flex;
    flex-direction: column;
    gap: calc(var(--spacing, 0.25rem) * 6);
    @media (width >= 80rem) {
      flex-direction: row;
    }
  }
  .board > .container {
    display: flex;
    flex-direction: column;
    gap: calc(var(--spacing, 0.25rem) * 6);
    @media (width >= 80rem) {
      flex-direction: row;
    }
  }
  .discussion {
    display: flex;
    flex-direction: column;
    gap: calc(var(--spacing, 0.25rem) * 6);
    @media (width >= 80rem) {
      flex-direction: row;
    }
  }
  .forums .main {
    width: 100%;
    @media (width >= 80rem) {
      width: calc(100% - 400px);
    }
  }
  .board .main {
    width: 100%;
    @media (width >= 80rem) {
      width: calc(100% - 400px);
    }
  }
  .discussion .main {
    width: 100%;
    @media (width >= 80rem) {
      width: calc(100% - 400px);
    }
  }
  .forums .aside {
    width: 100%;
    @media (width >= 80rem) {
      width: 350px;
    }
  }
  .board .aside {
    width: 100%;
    @media (width >= 80rem) {
      width: 350px;
    }
  }
  .discussion .aside {
    width: 100%;
    @media (width >= 80rem) {
      width: 350px;
    }
  }
}
@layer themeLayout {
  @media (width >= 64rem) {
    .contactDetails {
      grid-column: span 4 / span 4;
    }
  }
  .contactHeading {
    margin-bottom: calc(var(--spacing, 0.25rem) * 4);
    font-size: var(--text-lg, 1.125rem);
    line-height: var(--tw-leading, var(--text-lg--line-height, calc(1.75 / 1.125)));
    --tw-font-weight: var(--font-weight-semibold, 600);
    font-weight: var(--font-weight-semibold, 600);
    color: var(--theme-footer-title);
  }
  .contactAddress {
    margin-bottom: calc(var(--spacing, 0.25rem) * 4);
    display: flex;
    align-items: flex-start;
    gap: calc(var(--spacing, 0.25rem) * 2);
    font-style: normal;
    color: var(--theme-footer-text);
  }
  .contactGlyph {
    height: calc(var(--spacing, 0.25rem) * 5);
    width: calc(var(--spacing, 0.25rem) * 5);
    flex-shrink: 0;
    &>svg {
      height: 100%;
    }
    &>svg {
      width: 100%;
    }
    color: var(--theme-footer-icon);
  }
  .contactNavigation {
    margin-top: calc(var(--spacing, 0.25rem) * 2);
    margin-bottom: calc(var(--spacing, 0.25rem) * 4);
    display: inline-block;
    border-radius: 0.25rem;
    padding-inline: calc(var(--spacing, 0.25rem) * 3);
    padding-block: var(--spacing, 0.25rem);
    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, cubic-bezier(0.4, 0, 0.2, 1)));
    transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
    background-color: var(--theme-footer-action);
    color: var(--theme-footer-on-action);
    &:hover {
      background-color: var(--theme-footer-action-hover);
    }
  }
  .contactRow {
    margin-bottom: var(--spacing, 0.25rem);
    display: flex;
    align-items: center;
    gap: calc(var(--spacing, 0.25rem) * 2);
    &:last-child {
      margin-bottom: 0px;
    }
  }
  .contactLink {
    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, cubic-bezier(0.4, 0, 0.2, 1)));
    transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
    color: var(--theme-footer-link);
    &:hover {
      color: var(--theme-footer-link-hover);
    }
  }
  @media (width >= 64rem) {
    .linkGroup {
      grid-column: span 2 / span 2;
    }
  }
  .linkGroup .columnTitle {
    margin-bottom: calc(var(--spacing, 0.25rem) * 4);
    font-size: var(--text-lg, 1.125rem);
    line-height: var(--tw-leading, var(--text-lg--line-height, calc(1.75 / 1.125)));
    --tw-font-weight: var(--font-weight-semibold, 600);
    font-weight: var(--font-weight-semibold, 600);
    color: var(--theme-footer-title);
  }
  .linkGroup .columnList {
    list-style-type: none;
  }
  .linkGroup .columnItem {
    margin-bottom: calc(var(--spacing, 0.25rem) * 2);
    &:last-child {
      margin-bottom: 0px;
    }
  }
  .linkGroup .columnLink {
    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, cubic-bezier(0.4, 0, 0.2, 1)));
    transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
    color: var(--theme-footer-link);
    &:hover {
      color: var(--theme-footer-link-hover);
    }
  }
  @media (width >= 64rem) {
    .subscribePanel {
      grid-column: span 4 / span 4;
    }
  }
  .subscribeHeading {
    margin-bottom: calc(var(--spacing, 0.25rem) * 4);
    font-size: var(--text-lg, 1.125rem);
    line-height: var(--tw-leading, var(--text-lg--line-height, calc(1.75 / 1.125)));
    --tw-font-weight: var(--font-weight-semibold, 600);
    font-weight: var(--font-weight-semibold, 600);
    color: var(--theme-footer-title);
  }
  .subscribeText {
    margin-bottom: calc(var(--spacing, 0.25rem) * 4);
    color: var(--theme-footer-text);
  }
  .subscribeForm {
    display: grid;
    row-gap: calc(var(--spacing, 0.25rem) * 4);
  }
  .subscribeGroup {
    display: flex;
    border-radius: 0.25rem;
    border-style: var(--tw-border-style);
    border-width: 1px;
    background-color: var(--theme-footer-input-surface);
    border-color: var(--theme-footer-input-border);
  }
  .subscribeGlyph {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: calc(var(--spacing, 0.25rem) * 2);
    color: var(--theme-footer-icon);
    & svg {
      height: calc(var(--spacing, 0.25rem) * 4);
      width: calc(var(--spacing, 0.25rem) * 4);
    }
  }
  .subscribeField {
    min-width: 0px;
    flex: 1;
    background-color: transparent;
    padding: calc(var(--spacing, 0.25rem) * 2);
    --tw-outline-style: none;
    outline-style: none;
    color: var(--theme-footer-text);
    &::placeholder {
      color: var(--theme-footer-text-subtle);
    }
  }
  .subscribeButton {
    width: 100%;
    border-radius: 0.25rem;
    padding-block: calc(var(--spacing, 0.25rem) * 2);
    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, cubic-bezier(0.4, 0, 0.2, 1)));
    transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
    background-color: var(--theme-footer-action);
    color: var(--theme-footer-on-action);
    &:disabled {
      cursor: not-allowed;
      opacity: 60%;
    }
    &:not(:disabled):hover {
      background-color: var(--theme-footer-action-hover);
    }
  }
  .brandMark {
    display: flex;
    justify-content: center;
    @media (width >= 48rem) {
      justify-content: flex-start;
    }
    .responsiveImage {
      height: auto;
      width: 100%;
      object-fit: contain;
    }
  }
  .copyrightNotice {
    text-align: center;
    color: var(--theme-footer-text);
  }
  .secondaryCopyright {
    margin-top: calc(var(--spacing, 0.25rem) * 2);
    font-size: var(--text-sm, 0.875rem);
    line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
    color: var(--theme-footer-text-subtle);
  }
  .socialNetwork {
    display: flex;
    justify-content: center;
    gap: calc(var(--spacing, 0.25rem) * 3);
    @media (width >= 40rem) {
      justify-content: flex-end;
    }
  }
  .socialAction {
    height: calc(var(--spacing, 0.25rem) * 6);
    width: calc(var(--spacing, 0.25rem) * 6);
    transition-property: opacity;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(0.4, 0, 0.2, 1)));
    transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
    &:hover {
      @media (hover: hover) {
        opacity: 75%;
      }
    }
    fill: var(--theme-footer-icon);
  }
  .footer {
    background-color: var(--theme-footer-surface);
    color: var(--theme-footer-text);
  }
  .primaryFooter {
    border-top-style: var(--tw-border-style);
    border-top-width: 1px;
    padding-block: calc(var(--spacing, 0.25rem) * 4);
    @media (width >= 40rem) {
      padding-block: calc(var(--spacing, 0.25rem) * 5);
    }
    @media (width >= 64rem) {
      padding-block: calc(var(--spacing, 0.25rem) * 8);
    }
    border-color: var(--theme-footer-border);
  }
  .contentShell {
    width: 100%;
    @media (width >= 18.75rem) {
      max-width: 18.75rem;
    }
    @media (width >= 20rem) {
      max-width: 20rem;
    }
    @media (width >= 22.5rem) {
      max-width: 22.5rem;
    }
    @media (width >= 23.75rem) {
      max-width: 23.75rem;
    }
    @media (width >= 30rem) {
      max-width: 30rem;
    }
    @media (width >= 31.25rem) {
      max-width: 31.25rem;
    }
    @media (width >= 32.5rem) {
      max-width: 32.5rem;
    }
    @media (width >= 33.75rem) {
      max-width: 33.75rem;
    }
    @media (width >= 35rem) {
      max-width: 35rem;
    }
    @media (width >= 36rem) {
      max-width: 36rem;
    }
    @media (width >= 37.5rem) {
      max-width: 37.5rem;
    }
    @media (width >= 40rem) {
      max-width: 40rem;
    }
    @media (width >= 40.625rem) {
      max-width: 40.625rem;
    }
    @media (width >= 42rem) {
      max-width: 42rem;
    }
    @media (width >= 43.75rem) {
      max-width: 43.75rem;
    }
    @media (width >= 47.5rem) {
      max-width: 47.5rem;
    }
    @media (width >= 48rem) {
      max-width: 48rem;
    }
    @media (width >= 50rem) {
      max-width: 50rem;
    }
    @media (width >= 53.75rem) {
      max-width: 53.75rem;
    }
    @media (width >= 54rem) {
      max-width: 54rem;
    }
    @media (width >= 55rem) {
      max-width: 55rem;
    }
    @media (width >= 56.25rem) {
      max-width: 56.25rem;
    }
    @media (width >= 57.5rem) {
      max-width: 57.5rem;
    }
    @media (width >= 57.625rem) {
      max-width: 57.625rem;
    }
    @media (width >= 60rem) {
      max-width: 60rem;
    }
    @media (width >= 62rem) {
      max-width: 62rem;
    }
    @media (width >= 62.5rem) {
      max-width: 62.5rem;
    }
    @media (width >= 64rem) {
      max-width: 64rem;
    }
    @media (width >= 65.625rem) {
      max-width: 65.625rem;
    }
    @media (width >= 67.5rem) {
      max-width: 67.5rem;
    }
    @media (width >= 68.125rem) {
      max-width: 68.125rem;
    }
    @media (width >= 68.75rem) {
      max-width: 68.75rem;
    }
    @media (width >= 70rem) {
      max-width: 70rem;
    }
    @media (width >= 73.75rem) {
      max-width: 73.75rem;
    }
    @media (width >= 75rem) {
      max-width: 75rem;
    }
    @media (width >= 80rem) {
      max-width: 80rem;
    }
    @media (width >= 82.5rem) {
      max-width: 82.5rem;
    }
    @media (width >= 86.75rem) {
      max-width: 86.75rem;
    }
    @media (width >= 87.5rem) {
      max-width: 87.5rem;
    }
    @media (width >= 90rem) {
      max-width: 90rem;
    }
    @media (width >= 93.75rem) {
      max-width: 93.75rem;
    }
    @media (width >= 96rem) {
      max-width: 96rem;
    }
    @media (width >= 105rem) {
      max-width: 105rem;
    }
    @media (width >= 118.75rem) {
      max-width: 118.75rem;
    }
    @media (width >= 120rem) {
      max-width: 120rem;
    }
    margin-inline: auto;
    overflow: hidden;
    padding-inline: calc(var(--spacing, 0.25rem) * 4);
  }
  .footer .columns {
    display: grid;
    grid-template-columns: repeat(1, minmax(0, 1fr));
    row-gap: calc(var(--spacing, 0.25rem) * 6);
    @media (width >= 48rem) {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    @media (width >= 64rem) {
      grid-template-columns: repeat(12, minmax(0, 1fr));
    }
    @media (width >= 64rem) {
      column-gap: calc(var(--spacing, 0.25rem) * 6);
    }
  }
  .legalBar {
    border-top-style: var(--tw-border-style);
    border-top-width: 1px;
    padding-block: calc(var(--spacing, 0.25rem) * 4);
    border-color: var(--theme-footer-border);
  }
  .footer .bottomContent {
    display: flex;
    width: 100%;
    flex-direction: column;
    align-items: center;
    justify-content: space-between;
    row-gap: calc(var(--spacing, 0.25rem) * 4);
    padding-inline: calc(var(--spacing, 0.25rem) * 4);
    @media (width >= 48rem) {
      flex-direction: row;
    }
  }
}
@layer themePart {
  .info {
    padding-block: calc(var(--spacing, 0.25rem) * 16);
    @media (width >= 80rem) {
      padding-block: calc(var(--spacing, 0.25rem) * 20);
    }
  }
  .detailContent {
    position: relative;
    z-index: 10;
    flex: 1;
  }
  .detailText {
    color: var(--theme-infoText);
  }
  .detailAction {
    margin-top: calc(var(--spacing, 0.25rem) * 6);
  }
  .visualMedia {
    position: relative;
    z-index: 10;
    width: 100%;
    overflow: hidden;
    border-radius: var(--radius-2xl, 1rem);
    & img {
      height: 100%;
    }
    & img {
      width: 100%;
    }
    & img {
      object-fit: cover;
    }
  }
  .defaultComposition {
    display: flex;
    flex-direction: column-reverse;
    gap: calc(var(--spacing, 0.25rem) * 10);
    @media (width >= 48rem) {
      flex-direction: row;
    }
    @media (width >= 48rem) {
      align-items: center;
    }
    @media (width >= 48rem) {
      gap: calc(var(--spacing, 0.25rem) * 20);
    }
    &.reverseComposition {
      @media (width >= 48rem) {
        flex-direction: row-reverse;
      }
    }
  }
  .defaultMedia {
    display: flex;
    flex: 1;
    justify-content: center;
    & .visualMedia {
      max-width: var(--container-xs, 20rem);
      @media (width >= 40rem) {
        max-width: var(--container-sm, 24rem);
      }
      @media (width >= 48rem) {
        max-width: var(--container-md, 28rem);
      }
    }
  }
  .featureComposition {
    position: relative;
    display: grid;
    align-items: center;
    gap: calc(var(--spacing, 0.25rem) * 8);
    overflow: hidden;
    border-radius: var(--radius-2xl, 1rem);
    border-style: var(--tw-border-style);
    border-width: 1px;
    padding: calc(var(--spacing, 0.25rem) * 4);
    transition-property: all;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(0.4, 0, 0.2, 1)));
    transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
    --tw-duration: 300ms;
    transition-duration: 300ms;
    --tw-ease: var(--ease-out, cubic-bezier(0, 0, 0.2, 1));
    transition-timing-function: var(--ease-out, cubic-bezier(0, 0, 0.2, 1));
    &:hover {
      @media (hover: hover) {
        --tw-translate-y: calc(var(--spacing, 0.25rem) * -1);
        translate: var(--tw-translate-x) var(--tw-translate-y);
      }
    }
    @media (width >= 48rem) {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    @media (width >= 48rem) {
      padding: calc(var(--spacing, 0.25rem) * 8);
    }
    background-color: var(--theme-infoSurface);
    border-color: var(--theme-infoBorder);
    &:hover {
      border-color: var(--theme-infoBorderHover);
      box-shadow: 0 20px 25px -5px var(--theme-shadow), 0 8px 10px -6px var(--theme-shadow);
    }
    &.reverseComposition .visualMedia {
      @media (width >= 48rem) {
        order: 2;
      }
    }
  }
  .overlapPanel:hover {
    border-color: var(--theme-infoBorderHover);
    box-shadow: 0 20px 25px -5px var(--theme-shadow), 0 8px 10px -6px var(--theme-shadow);
  }
  .featureComposition .visualMedia {
    min-height: calc(var(--spacing, 0.25rem) * 72);
  }
  .detailDecoration {
    position: absolute;
    inset-inline-start: calc(var(--spacing, 0.25rem) * -20);
    top: calc(var(--spacing, 0.25rem) * -20);
    height: calc(var(--spacing, 0.25rem) * 40);
    width: calc(var(--spacing, 0.25rem) * 40);
    border-radius: calc(infinity * 1px);
    opacity: 5%;
    transition-property: all;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(0.4, 0, 0.2, 1)));
    transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
    --tw-duration: 500ms;
    transition-duration: 500ms;
    background-color: var(--theme-infoGradientMiddle);
    background-image: linear-gradient( to bottom, var(--theme-infoGradientStart), var(--theme-infoGradientMiddle), var(--theme-infoGradientEnd) );
  }
  .featureComposition:hover .detailDecoration {
    --tw-scale-x: 150%;
    --tw-scale-y: 150%;
    --tw-scale-z: 150%;
    scale: var(--tw-scale-x) var(--tw-scale-y);
    opacity: 10%;
  }
  .overlapPanel:hover .detailDecoration {
    --tw-scale-x: 150%;
    --tw-scale-y: 150%;
    --tw-scale-z: 150%;
    scale: var(--tw-scale-x) var(--tw-scale-y);
    opacity: 10%;
  }
  .bannerComposition {
    position: relative;
    min-height: 30rem;
    overflow: hidden;
    padding-block: 0px;
    & > .visualMedia {
      position: absolute;
      inset: 0px;
      height: 100%;
      border-radius: 0;
    }
    &.reverseComposition .bannerContent {
      justify-content: flex-end;
    }
  }
  .bannerOverlay {
    position: absolute;
    inset: 0px;
    background: linear-gradient( to right, var(--theme-infoOverlay), transparent );
  }
  [dir='rtl'] .bannerOverlay, .bannerComposition.reverseComposition .bannerOverlay {
    background: linear-gradient( to left, var(--theme-infoOverlay), transparent );
  }
  [dir='rtl'] .bannerComposition.reverseComposition .bannerOverlay {
    background: linear-gradient( to right, var(--theme-infoOverlay), transparent );
  }
  .bannerContent {
    position: relative;
    z-index: 10;
    display: flex;
    min-height: 30rem;
    align-items: center;
    padding-block: calc(var(--spacing, 0.25rem) * 16);
    & .detailContent {
      max-width: var(--container-xl, 36rem);
    }
  }
  .bannerComposition .heading :is(.title, .subtitle, .description) {
    color: var(--theme-infoOnAccent);
  }
  .bannerComposition .detailText {
    color: var(--theme-infoOnAccent);
  }
  .overlapComposition {
    position: relative;
    display: grid;
    align-items: center;
    padding-block: calc(var(--spacing, 0.25rem) * 20);
    @media (width >= 64rem) {
      grid-template-columns: repeat(12, minmax(0, 1fr));
    }
    & > .visualMedia {
      min-height: calc(var(--spacing, 0.25rem) * 96);
      @media (width >= 64rem) {
        grid-column: span 8 / span 8;
      }
      @media (width >= 64rem) {
        grid-column-start: 1;
      }
      @media (width >= 64rem) {
        grid-row-start: 1;
      }
    }
    &.reverseComposition > .visualMedia {
      @media (width >= 64rem) {
        grid-column-start: 5;
      }
    }
    &.reverseComposition .overlapPanel {
      @media (width >= 64rem) {
        grid-column-start: 1;
      }
    }
  }
  .overlapPanel {
    position: relative;
    z-index: 20;
    margin-top: calc(var(--spacing, 0.25rem) * -16);
    overflow: hidden;
    border-radius: var(--radius-2xl, 1rem);
    border-style: var(--tw-border-style);
    border-width: 1px;
    padding: calc(var(--spacing, 0.25rem) * 6);
    transition-property: all;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(0.4, 0, 0.2, 1)));
    transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
    --tw-duration: 300ms;
    transition-duration: 300ms;
    @media (width >= 64rem) {
      grid-column: span 6 / span 6;
    }
    @media (width >= 64rem) {
      grid-column-start: 7;
    }
    @media (width >= 64rem) {
      grid-row-start: 1;
    }
    @media (width >= 64rem) {
      margin-top: 0px;
    }
    @media (width >= 64rem) {
      padding: calc(var(--spacing, 0.25rem) * 10);
    }
    background-color: var(--theme-infoSurface);
    border-color: var(--theme-infoBorder);
  }
  .spotlightComposition {
    position: relative;
    overflow: hidden;
    background-color: var(--theme-infoSurfaceSoft);
    &.reverseComposition .visualMedia {
      @media (width >= 48rem) {
        order: -9999;
      }
    }
  }
  .spotlightGlow {
    position: absolute;
    inset-inline-start: calc(1/2 * 100%);
    top: calc(1 / 2 * 100%);
    height: calc(var(--spacing, 0.25rem) * 96);
    width: calc(var(--spacing, 0.25rem) * 96);
    --tw-translate-x: calc(calc(1 / 2 * 100%) * -1);
    --tw-translate-y: calc(calc(1 / 2 * 100%) * -1);
    translate: var(--tw-translate-x) var(--tw-translate-y);
    border-radius: calc(infinity * 1px);
    opacity: 20%;
    --tw-blur: blur(var(--blur-3xl, 64px));
    filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);
    background-color: var(--theme-infoGradientMiddle);
  }
  .highlightContent {
    position: relative;
    z-index: 10;
    display: grid;
    align-items: center;
    gap: calc(var(--spacing, 0.25rem) * 10);
    @media (width >= 48rem) {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    @media (width >= 48rem) {
      gap: calc(var(--spacing, 0.25rem) * 16);
    }
  }
  .spotlightComposition .visualMedia {
    min-height: calc(var(--spacing, 0.25rem) * 80);
    border-radius: calc(infinity * 1px);
    box-shadow: 0 20px 45px -24px var(--theme-shadow-strong);
  }
  .minimalComposition {
    position: relative;
    display: grid;
    align-items: center;
    gap: calc(var(--spacing, 0.25rem) * 8);
    @media (width >= 48rem) {
      grid-template-columns: auto 1fr 1fr;
    }
    @media (width >= 48rem) {
      gap: calc(var(--spacing, 0.25rem) * 12);
    }
  }
  .minimalLine {
    height: var(--spacing, 0.25rem);
    width: calc(var(--spacing, 0.25rem) * 20);
    @media (width >= 48rem) {
      height: 100%;
    }
    @media (width >= 48rem) {
      min-height: calc(var(--spacing, 0.25rem) * 64);
    }
    @media (width >= 48rem) {
      width: var(--spacing, 0.25rem);
    }
    background-image: linear-gradient( to bottom, var(--theme-infoGradientStart), var(--theme-infoGradientEnd) );
  }
  .minimalComposition .visualMedia {
    min-height: calc(var(--spacing, 0.25rem) * 72);
  }
  @media (width >= 48rem) {
    .minimalComposition.reverseComposition .visualMedia {
      grid-column-start: 2;
      grid-row-start: 1;
    }
    .minimalComposition.reverseComposition .detailContent {
      grid-column-start: 3;
      grid-row-start: 1;
    }
  }
  .quoteComposition {
    display: grid;
    align-items: center;
    gap: 0px;
    @media (width >= 48rem) {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    & > .visualMedia {
      min-height: calc(var(--spacing, 0.25rem) * 80);
      @media (width >= 48rem) {
        min-height: 28rem;
      }
      @media (width >= 48rem) {
        border-start-end-radius: 0;
        border-end-end-radius: 0;
      }
    }
    &.reverseComposition > .visualMedia {
      @media (width >= 48rem) {
        order: 2;
      }
      @media (width >= 48rem) {
        border-start-start-radius: 0;
        border-end-start-radius: 0;
      }
      @media (width >= 48rem) {
        border-start-end-radius: var(--radius-2xl, 1rem);
        border-end-end-radius: var(--radius-2xl, 1rem);
      }
    }
    &.reverseComposition .quotePanel {
      @media (width >= 48rem) {
        margin-inline-start: 0px;
      }
      @media (width >= 48rem) {
        margin-inline-end: calc(var(--spacing, 0.25rem) * -8);
      }
    }
  }
  .quotePanel {
    position: relative;
    overflow: hidden;
    border-radius: var(--radius-2xl, 1rem);
    border-style: var(--tw-border-style);
    border-width: 1px;
    padding: calc(var(--spacing, 0.25rem) * 8);
    @media (width >= 48rem) {
      margin-inline-start: calc(var(--spacing, 0.25rem) * -8);
    }
    @media (width >= 48rem) {
      padding: calc(var(--spacing, 0.25rem) * 12);
    }
    background-color: var(--theme-infoSurface);
    border-color: var(--theme-infoBorder);
    box-shadow: 0 20px 45px -28px var(--theme-shadow-strong);
  }
  .quoteMark {
    position: absolute;
    inset-inline-start: calc(var(--spacing, 0.25rem) * 4);
    top: calc(var(--spacing, 0.25rem) * -8);
    font-size: var(--text-9xl, 8rem);
    line-height: var(--tw-leading, var(--text-9xl--line-height, 1));
    --tw-leading: 1;
    line-height: 1;
    --tw-font-weight: var(--font-weight-bold, 700);
    font-weight: var(--font-weight-bold, 700);
    opacity: 10%;
    color: var(--theme-infoAccent);
  }
}
:root {
  --glossaryAccent: var(--theme-accent);
  --glossaryAccentHover: var(--theme-accent-hover);
  --glossaryAccentSoft: var(--theme-accent-soft);
  --glossaryBorder: var(--theme-border);
  --glossaryOnAccent: var(--theme-on-accent);
  --glossaryShadow: var(--theme-shadow);
  --glossarySurface: var(--theme-surface);
  --glossarySurfaceSoft: var(--surfaceSoft);
  --glossaryText: var(--theme-text);
  --glossaryTextMuted: var(--theme-text-muted);
}
@layer themePart {
  .glossary, .dictionaryEntry {
    margin-inline: auto;
    width: 100%;
    max-width: var(--breakpoint-xl, 80rem);
    padding-inline: calc(var(--spacing, 0.25rem) * 4);
    padding-block: calc(var(--spacing, 0.25rem) * 12);
    @media (width >= 40rem) {
      padding-inline: calc(var(--spacing, 0.25rem) * 8);
    }
    @media (width >= 64rem) {
      padding-inline: calc(var(--spacing, 0.25rem) * 12);
    }
    @media (width >= 80rem) {
      padding-inline: calc(var(--spacing, 0.25rem) * 16);
    }
    color: var(--glossaryText);
  }
  [data-tenant='wesupply.ir'] .glossary, [data-tenant='wesupply.ir'] .dictionaryEntry {
    padding-top: calc(var(--spacing, 0.25rem) * 24);
  }
  .glossary > .breadcrumb {
    margin-bottom: calc(var(--spacing, 0.25rem) * 8);
  }
  .dictionaryHeader {
    margin-bottom: calc(var(--spacing, 0.25rem) * 10);
    border-radius: var(--radius-3xl, 1.5rem);
    border-style: var(--tw-border-style);
    border-width: 1px;
    padding: calc(var(--spacing, 0.25rem) * 6);
    --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);
    @media (width >= 48rem) {
      padding: calc(var(--spacing, 0.25rem) * 10);
    }
    background-color: var(--glossarySurface);
    border-color: var(--glossaryBorder);
    box-shadow: 0 18px 50px -35px var(--glossaryShadow);
    & > .title {
      margin-bottom: calc(var(--spacing, 0.25rem) * 8);
      font-size: var(--text-3xl, 1.875rem);
      line-height: var(--tw-leading, var(--text-3xl--line-height, calc(2.25 / 1.875)));
      --tw-font-weight: var(--font-weight-bold, 700);
      font-weight: var(--font-weight-bold, 700);
      @media (width >= 48rem) {
        font-size: var(--text-5xl, 3rem);
        line-height: var(--tw-leading, var(--text-5xl--line-height, 1));
      }
      color: var(--glossaryText);
    }
  }
  .dictionarySearch {
    margin-bottom: calc(var(--spacing, 0.25rem) * 8);
    & > .label {
      margin-bottom: calc(var(--spacing, 0.25rem) * 2);
      display: block;
      font-size: var(--text-sm, 0.875rem);
      line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
      --tw-font-weight: var(--font-weight-semibold, 600);
      font-weight: var(--font-weight-semibold, 600);
      color: var(--glossaryTextMuted);
    }
    & > .control {
      display: flex;
      flex-direction: column;
      gap: calc(var(--spacing, 0.25rem) * 3);
      @media (width >= 40rem) {
        flex-direction: row;
      }
    }
    & .input {
      min-width: 0px;
      flex: 1;
      border-radius: var(--radius-xl, 0.75rem);
      border-style: var(--tw-border-style);
      border-width: 1px;
      background-color: transparent;
      padding-inline: calc(var(--spacing, 0.25rem) * 4);
      padding-block: calc(var(--spacing, 0.25rem) * 3);
      transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, content-visibility, overlay, pointer-events;
      transition-timing-function: var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(0.4, 0, 0.2, 1)));
      transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
      --tw-outline-style: none;
      outline-style: none;
      background-color: var(--glossarySurface);
      border-color: var(--glossaryBorder);
      color: var(--glossaryText);
    }
    & .input:focus {
      border-color: var(--glossaryAccent);
      box-shadow: 0 0 0 3px var(--glossaryAccentSoft);
    }
    & .action {
      border-radius: var(--radius-xl, 0.75rem);
      padding-inline: calc(var(--spacing, 0.25rem) * 6);
      padding-block: calc(var(--spacing, 0.25rem) * 3);
      --tw-font-weight: var(--font-weight-semibold, 600);
      font-weight: var(--font-weight-semibold, 600);
      transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, content-visibility, overlay, pointer-events;
      transition-timing-function: var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(0.4, 0, 0.2, 1)));
      transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
      background-color: var(--glossaryAccent);
      color: var(--glossaryOnAccent);
    }
    & .action:hover {
      background-color: var(--glossaryAccentHover);
    }
  }
  .dictionaryLetters > .list {
    display: flex;
    flex-wrap: wrap;
    gap: calc(var(--spacing, 0.25rem) * 2);
  }
  .dictionaryPagination > .list {
    display: flex;
    flex-wrap: wrap;
    gap: calc(var(--spacing, 0.25rem) * 2);
  }
  .dictionaryLetters .link {
    display: flex;
    width: calc(var(--spacing, 0.25rem) * 10);
    height: calc(var(--spacing, 0.25rem) * 10);
    align-items: center;
    justify-content: center;
    border-radius: var(--radius-lg, 0.5rem);
    border-style: var(--tw-border-style);
    border-width: 1px;
    --tw-font-weight: var(--font-weight-semibold, 600);
    font-weight: var(--font-weight-semibold, 600);
    transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, content-visibility, overlay, pointer-events;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(0.4, 0, 0.2, 1)));
    transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
    background-color: var(--glossarySurface);
    border-color: var(--glossaryBorder);
    color: var(--glossaryText);
  }
  .dictionaryPagination .link {
    display: flex;
    width: calc(var(--spacing, 0.25rem) * 10);
    height: calc(var(--spacing, 0.25rem) * 10);
    align-items: center;
    justify-content: center;
    border-radius: var(--radius-lg, 0.5rem);
    border-style: var(--tw-border-style);
    border-width: 1px;
    --tw-font-weight: var(--font-weight-semibold, 600);
    font-weight: var(--font-weight-semibold, 600);
    transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, content-visibility, overlay, pointer-events;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(0.4, 0, 0.2, 1)));
    transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
    background-color: var(--glossarySurface);
    border-color: var(--glossaryBorder);
    color: var(--glossaryText);
  }
  .dictionaryLetters .link:hover {
    background-color: var(--glossaryAccent);
    border-color: var(--glossaryAccent);
    color: var(--glossaryOnAccent);
  }
  .dictionaryLetters .link[aria-current='page'] {
    background-color: var(--glossaryAccent);
    border-color: var(--glossaryAccent);
    color: var(--glossaryOnAccent);
  }
  .dictionaryPagination .link:hover {
    background-color: var(--glossaryAccent);
    border-color: var(--glossaryAccent);
    color: var(--glossaryOnAccent);
  }
  .dictionaryPagination .link[aria-current='page'] {
    background-color: var(--glossaryAccent);
    border-color: var(--glossaryAccent);
    color: var(--glossaryOnAccent);
  }
  .dictionarySections {
    display: grid;
    gap: calc(var(--spacing, 0.25rem) * 6);
    @media (width >= 64rem) {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }
  }
  .dictionarySection {
    border-radius: var(--radius-2xl, 1rem);
    border-style: var(--tw-border-style);
    border-width: 1px;
    padding: calc(var(--spacing, 0.25rem) * 6);
    background-color: var(--glossarySurface);
    border-color: var(--glossaryBorder);
    & > .heading {
      margin-bottom: calc(var(--spacing, 0.25rem) * 5);
      display: flex;
      align-items: center;
      justify-content: space-between;
      border-bottom-style: var(--tw-border-style);
      border-bottom-width: 1px;
      padding-bottom: calc(var(--spacing, 0.25rem) * 4);
      border-color: var(--glossaryBorder);
    }
    & .letter {
      font-size: var(--text-3xl, 1.875rem);
      line-height: var(--tw-leading, var(--text-3xl--line-height, calc(2.25 / 1.875)));
      --tw-font-weight: var(--font-weight-bold, 700);
      font-weight: var(--font-weight-bold, 700);
      color: var(--glossaryAccent);
    }
    & .more {
      font-size: var(--text-sm, 0.875rem);
      line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
      --tw-font-weight: var(--font-weight-semibold, 600);
      font-weight: var(--font-weight-semibold, 600);
      text-underline-offset: 4px;
      &:hover {
        @media (hover: hover) {
          text-decoration-line: underline;
        }
      }
      color: var(--glossaryAccent);
    }
    & .entries {
      :where(& > :not(:last-child)) {
        --tw-divide-y-reverse: 0;
        border-bottom-style: var(--tw-border-style);
        border-top-style: var(--tw-border-style);
        border-top-width: calc(1px * var(--tw-divide-y-reverse));
        border-bottom-width: calc(1px * calc(1 - var(--tw-divide-y-reverse)));
      }
      border-color: var(--glossaryBorder);
    }
  }
  .dictionaryResults > .entries {
    :where(& > :not(:last-child)) {
      --tw-divide-y-reverse: 0;
      border-bottom-style: var(--tw-border-style);
      border-top-style: var(--tw-border-style);
      border-top-width: calc(1px * var(--tw-divide-y-reverse));
      border-bottom-width: calc(1px * calc(1 - var(--tw-divide-y-reverse)));
    }
    border-color: var(--glossaryBorder);
  }
  .glossary .entry {
    padding-block: calc(var(--spacing, 0.25rem) * 5);
    &:first-child {
      padding-top: 0px;
    }
    &:last-child {
      padding-bottom: 0px;
    }
  }
  .glossary .entry > .link {
    display: block;
    border-radius: var(--radius-xl, 0.75rem);
    padding: calc(var(--spacing, 0.25rem) * 3);
    transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, content-visibility, overlay, pointer-events;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(0.4, 0, 0.2, 1)));
    transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
  }
  .glossary .entry > .summaryOnly {
    display: block;
    border-radius: var(--radius-xl, 0.75rem);
    padding: calc(var(--spacing, 0.25rem) * 3);
    transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, content-visibility, overlay, pointer-events;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(0.4, 0, 0.2, 1)));
    transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
  }
  .glossary .entry > .link:hover {
    background-color: var(--glossaryAccentSoft);
  }
  .glossary .entry .term {
    font-size: var(--text-xl, 1.25rem);
    line-height: var(--tw-leading, var(--text-xl--line-height, calc(1.75 / 1.25)));
    --tw-font-weight: var(--font-weight-bold, 700);
    font-weight: var(--font-weight-bold, 700);
    color: var(--glossaryAccent);
  }
  .glossary .entry .expanded {
    margin-top: var(--spacing, 0.25rem);
    font-size: var(--text-sm, 0.875rem);
    line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
    color: var(--glossaryTextMuted);
  }
  .glossary .entry .translation {
    margin-top: var(--spacing, 0.25rem);
    font-size: var(--text-sm, 0.875rem);
    line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
    color: var(--glossaryTextMuted);
  }
  .glossary .entry .definition {
    margin-top: calc(var(--spacing, 0.25rem) * 2);
    --tw-leading: calc(var(--spacing, 0.25rem) * 7);
    line-height: calc(var(--spacing, 0.25rem) * 7);
    color: var(--glossaryText);
  }
  .dictionaryResults {
    border-radius: var(--radius-2xl, 1rem);
    border-style: var(--tw-border-style);
    border-width: 1px;
    padding: calc(var(--spacing, 0.25rem) * 6);
    @media (width >= 48rem) {
      padding: calc(var(--spacing, 0.25rem) * 8);
    }
    background-color: var(--glossarySurface);
    border-color: var(--glossaryBorder);
    & > .empty {
      padding-block: calc(var(--spacing, 0.25rem) * 12);
      text-align: center;
      color: var(--glossaryTextMuted);
    }
  }
  .dictionaryPagination {
    margin-top: calc(var(--spacing, 0.25rem) * 8);
    border-top-style: var(--tw-border-style);
    border-top-width: 1px;
    padding-top: calc(var(--spacing, 0.25rem) * 6);
    border-color: var(--glossaryBorder);
  }
  .dictionaryEntry > .entryDetail {
    border-radius: var(--radius-3xl, 1.5rem);
    border-style: var(--tw-border-style);
    border-width: 1px;
    padding: calc(var(--spacing, 0.25rem) * 6);
    --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);
    @media (width >= 48rem) {
      padding: calc(var(--spacing, 0.25rem) * 10);
    }
    background-color: var(--glossarySurface);
    border-color: var(--glossaryBorder);
  }
  .dictionaryEntry .entryDetail > .image {
    margin-bottom: calc(var(--spacing, 0.25rem) * 8);
    max-height: calc(var(--spacing, 0.25rem) * 96);
    width: 100%;
    border-radius: var(--radius-2xl, 1rem);
    object-fit: cover;
  }
  .dictionaryEntry .term {
    font-size: var(--text-3xl, 1.875rem);
    line-height: var(--tw-leading, var(--text-3xl--line-height, calc(2.25 / 1.875)));
    --tw-font-weight: var(--font-weight-bold, 700);
    font-weight: var(--font-weight-bold, 700);
    @media (width >= 48rem) {
      font-size: var(--text-5xl, 3rem);
      line-height: var(--tw-leading, var(--text-5xl--line-height, 1));
    }
    color: var(--glossaryAccent);
  }
  .dictionaryEntry .expanded {
    margin-top: calc(var(--spacing, 0.25rem) * 2);
    font-size: var(--text-lg, 1.125rem);
    line-height: var(--tw-leading, var(--text-lg--line-height, calc(1.75 / 1.125)));
    color: var(--glossaryTextMuted);
  }
  .dictionaryEntry .translation {
    margin-top: calc(var(--spacing, 0.25rem) * 2);
    font-size: var(--text-lg, 1.125rem);
    line-height: var(--tw-leading, var(--text-lg--line-height, calc(1.75 / 1.125)));
    color: var(--glossaryTextMuted);
  }
  .dictionaryEntry .definition {
    margin-top: calc(var(--spacing, 0.25rem) * 6);
    font-size: var(--text-lg, 1.125rem);
    line-height: var(--tw-leading, var(--text-lg--line-height, calc(1.75 / 1.125)));
    --tw-leading: calc(var(--spacing, 0.25rem) * 8);
    line-height: calc(var(--spacing, 0.25rem) * 8);
  }
  .dictionaryEntry .content {
    margin-top: calc(var(--spacing, 0.25rem) * 10);
    border-top-style: var(--tw-border-style);
    border-top-width: 1px;
    padding-top: calc(var(--spacing, 0.25rem) * 8);
    border-color: var(--glossaryBorder);
  }
}
@layer themePage {
  .products {
    margin-inline: auto;
    max-width: var(--breakpoint-xl, 80rem);
    padding-inline: calc(var(--spacing, 0.25rem) * 4);
    padding-block: calc(var(--spacing, 0.25rem) * 12);
    @media (width >= 40rem) {
      padding-inline: calc(var(--spacing, 0.25rem) * 16);
    }
    @media (width >= 48rem) {
      padding-inline: calc(var(--spacing, 0.25rem) * 8);
    }
    @media (width >= 64rem) {
      padding-inline: calc(var(--spacing, 0.25rem) * 10);
    }
    @media (width >= 80rem) {
      padding-inline: calc(var(--spacing, 0.25rem) * 20);
    }
    @media (width >= 96rem) {
      max-width: var(--breakpoint-2xl, 96rem);
    }
    @media (width >= 96rem) {
      padding-inline: calc(var(--spacing, 0.25rem) * 10);
    }
    > .title {
      margin-bottom: calc(var(--spacing, 0.25rem) * 10);
      font-size: var(--text-3xl, 1.875rem);
      line-height: var(--tw-leading, var(--text-3xl--line-height, calc(2.25 / 1.875)));
      --tw-font-weight: var(--font-weight-bold, 700);
      font-weight: var(--font-weight-bold, 700);
      @media (width >= 48rem) {
        font-size: var(--text-4xl, 2.25rem);
        line-height: var(--tw-leading, var(--text-4xl--line-height, calc(2.5 / 2.25)));
      }
      color: var(--theme-page-title);
    }
    > .items {
      display: grid;
      gap: calc(var(--spacing, 0.25rem) * 8);
      @media (width >= 40rem) {
        grid-template-columns: repeat(2, minmax(0, 1fr));
      }
      @media (width >= 64rem) {
        grid-template-columns: repeat(3, minmax(0, 1fr));
      }
      @media (width >= 96rem) {
        grid-template-columns: repeat(4, minmax(0, 1fr));
      }
    }
    > .pagination {
      margin-top: calc(var(--spacing, 0.25rem) * 10);
    }
  }
  [data-tenant='wesupply.ir'] .products {
    padding-top: calc(var(--spacing, 0.25rem) * 24);
  }
}
@layer themePart {
  .products .product {
    height: 100%;
    overflow: hidden;
    border-radius: var(--radius-xl, 0.75rem);
    border-style: var(--tw-border-style);
    border-width: 1px;
    transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, content-visibility, overlay, pointer-events;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(0.4, 0, 0.2, 1)));
    transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
    --tw-duration: 300ms;
    transition-duration: 300ms;
    &:hover {
      @media (hover: hover) {
        --tw-translate-y: calc(var(--spacing, 0.25rem) * -1);
        translate: var(--tw-translate-x) var(--tw-translate-y);
      }
    }
    background-color: var(--theme-card-surface);
    border-color: var(--theme-card-border);
    box-shadow: 0 10px 24px var(--theme-shadow);
  }
  .products .product:hover {
    border-color: var(--theme-card-border-hover);
    box-shadow: 0 20px 30px var(--theme-shadow-strong);
  }
  .products .product > .link {
    display: flex;
    height: 100%;
    flex-direction: column;
    text-decoration-line: none;
  }
  .products .product .image {
    aspect-ratio: var(--aspect-video, 16 / 9);
    width: 100%;
    object-fit: cover;
    transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, content-visibility, overlay, pointer-events;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(0.4, 0, 0.2, 1)));
    transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
    --tw-duration: 300ms;
    transition-duration: 300ms;
  }
  .products .product:hover .image {
    --tw-scale-x: 105%;
    --tw-scale-y: 105%;
    --tw-scale-z: 105%;
    scale: var(--tw-scale-x) var(--tw-scale-y);
  }
  .products .summary {
    display: flex;
    flex: 1;
    flex-direction: column;
    padding: calc(var(--spacing, 0.25rem) * 4);
  }
  .products .supertitle {
    font-size: var(--text-sm, 0.875rem);
    line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
    color: var(--theme-text-subtle);
  }
  .products .subtitle {
    font-size: var(--text-sm, 0.875rem);
    line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
    color: var(--theme-text-subtle);
  }
  .products .summary .title {
    margin-top: calc(var(--spacing, 0.25rem) * 2);
    font-size: var(--text-xl, 1.25rem);
    line-height: var(--tw-leading, var(--text-xl--line-height, calc(1.75 / 1.25)));
    --tw-font-weight: var(--font-weight-bold, 700);
    font-weight: var(--font-weight-bold, 700);
    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, cubic-bezier(0.4, 0, 0.2, 1)));
    transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
    color: var(--theme-card-title);
  }
  .products .description {
    margin-top: calc(var(--spacing, 0.25rem) * 3);
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    flex: 1;
    --tw-leading: calc(var(--spacing, 0.25rem) * 7);
    line-height: calc(var(--spacing, 0.25rem) * 7);
    color: var(--theme-card-text);
  }
  .products .code {
    margin-top: calc(var(--spacing, 0.25rem) * 4);
    display: flex;
    align-items: center;
    gap: calc(var(--spacing, 0.25rem) * 2);
    font-size: var(--text-sm, 0.875rem);
    line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
    color: var(--theme-text-subtle);
  }
  .products .rating {
    margin-top: calc(var(--spacing, 0.25rem) * 4);
    display: flex;
    align-items: center;
    gap: calc(var(--spacing, 0.25rem) * 2);
    font-size: var(--text-sm, 0.875rem);
    line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
    color: var(--theme-text-subtle);
  }
  .products .rating meter {
    flex: 1;
  }
  .products .flags {
    margin-top: calc(var(--spacing, 0.25rem) * 4);
    display: flex;
    flex-wrap: wrap;
    gap: calc(var(--spacing, 0.25rem) * 2);
  }
  .products .flags > li {
    border-radius: calc(infinity * 1px);
    padding-inline: calc(var(--spacing, 0.25rem) * 3);
    padding-block: var(--spacing, 0.25rem);
    font-size: var(--text-xs, 0.75rem);
    line-height: var(--tw-leading, var(--text-xs--line-height, calc(1 / 0.75)));
    --tw-font-weight: var(--font-weight-semibold, 600);
    font-weight: var(--font-weight-semibold, 600);
    background-color: var(--theme-card-accent);
    color: var(--theme-card-surface);
  }
}
@layer themePage {
  .product:has( > .detail) {
    margin-inline: auto;
    max-width: var(--breakpoint-xl, 80rem);
    padding-inline: calc(var(--spacing, 0.25rem) * 4);
    padding-block: calc(var(--spacing, 0.25rem) * 12);
    @media (width >= 40rem) {
      padding-inline: calc(var(--spacing, 0.25rem) * 16);
    }
    @media (width >= 48rem) {
      padding-inline: calc(var(--spacing, 0.25rem) * 8);
    }
    @media (width >= 64rem) {
      padding-inline: calc(var(--spacing, 0.25rem) * 10);
    }
    @media (width >= 80rem) {
      padding-inline: calc(var(--spacing, 0.25rem) * 20);
    }
  }
  .product:has( > .detail) > .detail {
    display: grid;
    min-width: 0px;
    gap: calc(var(--spacing, 0.25rem) * 10);
    @media (width >= 64rem) {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    @media (width >= 64rem) {
      gap: calc(var(--spacing, 0.25rem) * 16);
    }
  }
  .product:has( > .detail) > .detail > .image {
    aspect-ratio: 1 / 1;
    width: 100%;
    border-radius: var(--radius-xl, 0.75rem);
    object-fit: cover;
  }
  .product:has( > .detail) .summary {
    align-self: flex-start;
  }
  .product:has( > .detail) .supertitle {
    margin-bottom: calc(var(--spacing, 0.25rem) * 2);
    font-size: var(--text-sm, 0.875rem);
    line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
    --tw-font-weight: var(--font-weight-semibold, 600);
    font-weight: var(--font-weight-semibold, 600);
    color: var(--theme-text-subtle);
  }
  .product:has( > .detail) .summary > .title {
    margin-bottom: calc(var(--spacing, 0.25rem) * 4);
    font-size: var(--text-3xl, 1.875rem);
    line-height: var(--tw-leading, var(--text-3xl--line-height, calc(2.25 / 1.875)));
    --tw-leading: var(--leading-tight, 1.25);
    line-height: var(--leading-tight, 1.25);
    --tw-font-weight: var(--font-weight-bold, 700);
    font-weight: var(--font-weight-bold, 700);
    @media (width >= 48rem) {
      font-size: var(--text-5xl, 3rem);
      line-height: var(--tw-leading, var(--text-5xl--line-height, 1));
    }
    color: var(--theme-page-title);
  }
  .product:has( > .detail) .subtitle {
    margin-bottom: calc(var(--spacing, 0.25rem) * 4);
    font-size: var(--text-lg, 1.125rem);
    line-height: var(--tw-leading, var(--text-lg--line-height, calc(1.75 / 1.125)));
    color: var(--theme-text-subtle);
  }
  .product:has( > .detail) .description {
    margin-bottom: calc(var(--spacing, 0.25rem) * 6);
    --tw-leading: calc(var(--spacing, 0.25rem) * 8);
    line-height: calc(var(--spacing, 0.25rem) * 8);
    color: var(--theme-text);
  }
  .product:has( > .detail) .code {
    margin-bottom: calc(var(--spacing, 0.25rem) * 4);
    display: flex;
    align-items: center;
    gap: calc(var(--spacing, 0.25rem) * 2);
    font-size: var(--text-sm, 0.875rem);
    line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
    color: var(--theme-text-subtle);
  }
  .product:has( > .detail) .rating {
    margin-bottom: calc(var(--spacing, 0.25rem) * 4);
    display: flex;
    align-items: center;
    gap: calc(var(--spacing, 0.25rem) * 3);
    color: var(--theme-text-subtle);
  }
  .product:has( > .detail) .rating meter {
    width: calc(var(--spacing, 0.25rem) * 40);
  }
  .product:has( > .detail) .flags {
    margin-bottom: calc(var(--spacing, 0.25rem) * 6);
    display: flex;
    flex-wrap: wrap;
    gap: calc(var(--spacing, 0.25rem) * 2);
  }
  .product:has( > .detail) .flags > li {
    border-radius: calc(infinity * 1px);
    padding-inline: calc(var(--spacing, 0.25rem) * 3);
    padding-block: var(--spacing, 0.25rem);
    font-size: var(--text-xs, 0.75rem);
    line-height: var(--tw-leading, var(--text-xs--line-height, calc(1 / 0.75)));
    --tw-font-weight: var(--font-weight-semibold, 600);
    font-weight: var(--font-weight-semibold, 600);
    background-color: var(--theme-card-accent);
    color: var(--theme-card-surface);
  }
  @media (width >= 64rem) {
    .product:has( > .detail) .brand {
      grid-column-start: 2;
    }
  }
  .product:has( > .detail) .content {
    @media (width >= 64rem) {
      grid-column: span 2 / span 2;
    }
    color: var(--theme-text);
  }
  [data-tenant='wesupply.ir'] .product:has(> .detail) {
    padding-top: calc(var(--spacing, 0.25rem) * 24);
  }
}
@layer themePart {
  .introHero {
    isolation: isolate;
    min-height: calc(100svh - 4rem);
    > .backgroundMedia {
      position: absolute;
      inset: 0px;
      > .video {
        height: 100%;
        width: 100%;
        --tw-translate-y: 0px;
        translate: var(--tw-translate-x) var(--tw-translate-y);
        border-radius: 0;
        border-style: var(--tw-border-style);
        border-width: 0px;
        object-fit: cover;
        --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);
        background: none;
      }
    }
    > .overlay {
      pointer-events: none;
    }
    > .glow {
      pointer-events: none;
    }
    > .container {
      pointer-events: none;
      .content {
        pointer-events: auto;
      }
      .actions {
        display: flex;
      }
    }
  }
  .floating {
    position: fixed;
    z-index: 40;
    inset-block-end: calc(4rem + env(safe-area-inset-bottom));
    inset-inline-end: max(1.25rem, env(safe-area-inset-left), env(safe-area-inset-right));
    .floatingAction {
      display: flex;
      width: calc(var(--spacing, 0.25rem) * 14);
      height: calc(var(--spacing, 0.25rem) * 14);
      align-items: center;
      justify-content: center;
      border-radius: calc(infinity * 1px);
      padding: 0px;
      background-color: var(--theme-accent);
      color: var(--theme-on-accent);
      &:hover {
        background-color: var(--theme-accent-hover);
      }
      &:focus-visible {
        outline: 2px solid var(--theme-accent);
        outline-offset: 4px;
      }
      .actionIcon {
        display: flex;
        width: calc(var(--spacing, 0.25rem) * 7);
        height: calc(var(--spacing, 0.25rem) * 7);
        align-items: center;
        justify-content: center;
      }
      svg {
        width: 100%;
        height: 100%;
        fill: currentColor;
      }
    }
  }
}
@layer themePage {
  .autoSignIn {
    display: flex;
    height: 100%;
    width: 100%;
    align-items: center;
    justify-content: center;
    .progress {
      height: calc(var(--spacing, 0.25rem) * 5);
      width: calc(var(--spacing, 0.25rem) * 5);
      animation: var(--animate-spin, spin 1s linear infinite);
      border-radius: calc(infinity * 1px);
      border-style: var(--tw-border-style);
      border-width: 1px;
      border-color: currentcolor;
      border-top-color: transparent;
    }
  }
}
@layer themePart {
  .boardLayout {
    display: flex;
    flex-direction: column;
    gap: calc(var(--spacing, 0.25rem) * 4);
    .board {
      overflow: hidden;
      border-radius: var(--radius-2xl, 1rem);
      > .header {
        display: grid;
        grid-template-columns: repeat(1, minmax(0, 1fr));
        gap: calc(var(--spacing, 0.25rem) * 3);
        padding-inline: calc(var(--spacing, 0.25rem) * 3);
        padding-top: calc(var(--spacing, 0.25rem) * 2);
        padding-bottom: calc(var(--spacing, 0.25rem) * 3);
        @media (width >= 48rem) {
          grid-template-columns: repeat(10, minmax(0, 1fr));
        }
        background-color: var(--color-custom-color1);
        @supports (color: color-mix(in lab, red, red)) {
          background-color: color-mix(in srgb, var(--color-custom-color1) 30%, transparent);
        }
        .topicLabel {
          @media (width >= 48rem) {
            grid-column: span 4 / span 4;
          }
        }
        .replyLabel {
          display: none;
          text-align: center;
          @media (width >= 48rem) {
            grid-column: span 2 / span 2;
          }
          @media (width >= 48rem) {
            display: block;
          }
        }
        .lastReplyLabel {
          display: none;
          @media (width >= 48rem) {
            grid-column: span 4 / span 4;
          }
          @media (width >= 48rem) {
            display: block;
          }
        }
      }
      > .list > .discussion {
        display: grid;
        grid-template-columns: repeat(1, minmax(0, 1fr));
        gap: calc(var(--spacing, 0.25rem) * 3);
        padding-inline: calc(var(--spacing, 0.25rem) * 3);
        padding-top: calc(var(--spacing, 0.25rem) * 2);
        padding-bottom: calc(var(--spacing, 0.25rem) * 3);
        font-size: var(--text-sm, 0.875rem);
        line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
        @media (width >= 48rem) {
          grid-template-columns: repeat(10, minmax(0, 1fr));
        }
        &:nth-child(even) {
          background-color: var(--color-gray-100, oklch(96.7% 0.003 264.542));
        }
        .topic, .lastReply {
          display: flex;
          flex-direction: column;
          gap: var(--spacing, 0.25rem);
          @media (width >= 48rem) {
            grid-column: span 4 / span 4;
          }
          .link {
            overflow: hidden;
            display: -webkit-box;
            -webkit-box-orient: vertical;
            -webkit-line-clamp: 1;
            width: 100%;
          }
          .byline {
            display: flex;
            flex-wrap: wrap;
            gap: var(--spacing, 0.25rem);
            .person {
              color: var(--color-custom-color1);
            }
          }
        }
        .topic .link {
          width: calc(100% - 40px);
        }
        .replies {
          order: 3;
          display: flex;
          align-items: center;
          justify-content: center;
          text-align: center;
          @media (width >= 48rem) {
            order: 0;
          }
          @media (width >= 48rem) {
            grid-column: span 2 / span 2;
          }
        }
      }
    }
  }
  .discussionDetail {
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    overflow: hidden;
    border-radius: var(--radius-2xl, 1rem);
    border-style: var(--tw-border-style);
    border-width: 1px;
    .author {
      grid-column: span 7 / span 7;
      display: flex;
      flex-direction: row;
      align-items: center;
      gap: calc(var(--spacing, 0.25rem) * 4);
      padding: calc(var(--spacing, 0.25rem) * 5);
      @media (width >= 48rem) {
        grid-column: span 2 / span 2;
      }
      @media (width >= 48rem) {
        flex-direction: column;
      }
      @media (width >= 48rem) {
        justify-content: center;
      }
      background-color: var(--color-custom-color1);
      @supports (color: color-mix(in lab, red, red)) {
        background-color: color-mix(in srgb, var(--color-custom-color1) 30%, transparent);
      }
      .label {
        border-radius: var(--radius-2xl, 1rem);
        border-style: var(--tw-border-style);
        border-width: 1px;
        border-color: var(--color-gray-400, oklch(70.7% 0.022 261.325));
        padding-inline: calc(var(--spacing, 0.25rem) * 6);
        padding-top: var(--spacing, 0.25rem);
        padding-bottom: calc(var(--spacing, 0.25rem) * 1.5);
      }
    }
    .content {
      grid-column: span 7 / span 7;
      display: flex;
      flex-direction: column;
      gap: calc(var(--spacing, 0.25rem) * 6);
      padding: calc(var(--spacing, 0.25rem) * 5);
      @media (width >= 48rem) {
        grid-column: span 5 / span 5;
      }
      .title {
        --tw-font-weight: var(--font-weight-bold, 700);
        font-weight: var(--font-weight-bold, 700);
        @media (width >= 48rem) {
          font-size: var(--text-xl, 1.25rem);
          line-height: var(--tw-leading, var(--text-xl--line-height, calc(1.75 / 1.25)));
        }
      }
      .date {
        text-align: end;
        font-size: var(--text-xs, 0.75rem);
        line-height: var(--tw-leading, var(--text-xs--line-height, calc(1 / 0.75)));
        color: var(--color-gray-500, oklch(55.1% 0.027 264.364));
        @media (width >= 48rem) {
          font-size: var(--text-sm, 0.875rem);
          line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
        }
      }
    }
  }
  .discussionActions {
    margin-block: calc(var(--spacing, 0.25rem) * 4);
    display: flex;
    justify-content: center;
    .action {
      display: flex;
      align-items: center;
      gap: calc(var(--spacing, 0.25rem) * 2);
      border-radius: var(--radius-2xl, 1rem);
      border-style: var(--tw-border-style);
      border-width: 1px;
      padding-inline: calc(var(--spacing, 0.25rem) * 8);
      padding-top: var(--spacing, 0.25rem);
      padding-bottom: calc(var(--spacing, 0.25rem) * 1.5);
      font-size: var(--text-lg, 1.125rem);
      line-height: var(--tw-leading, var(--text-lg--line-height, calc(1.75 / 1.125)));
      border-color: var(--color-custom-color1);
      color: var(--color-custom-color1);
    }
  }
  .discussionPosts {
    display: flex;
    flex-direction: column;
    gap: calc(var(--spacing, 0.25rem) * 2);
    .post {
      display: grid;
      grid-template-columns: repeat(7, minmax(0, 1fr));
      overflow: hidden;
      border-radius: var(--radius-2xl, 1rem);
      border-style: var(--tw-border-style);
      border-width: 1px;
      .author {
        grid-column: span 7 / span 7;
        display: flex;
        flex-direction: row;
        align-items: center;
        gap: calc(var(--spacing, 0.25rem) * 4);
        padding: calc(var(--spacing, 0.25rem) * 5);
        @media (width >= 48rem) {
          grid-column: span 2 / span 2;
        }
        @media (width >= 48rem) {
          flex-direction: column;
        }
        background-color: var(--color-custom-color2);
        .image {
          aspect-ratio: 1 / 1;
          width: calc(var(--spacing, 0.25rem) * 20);
          overflow: hidden;
          border-radius: var(--radius-sm, 0.25rem);
        }
        .label {
          border-radius: var(--radius-2xl, 1rem);
          border-style: var(--tw-border-style);
          border-width: 1px;
          border-color: var(--color-gray-400, oklch(70.7% 0.022 261.325));
          padding-inline: calc(var(--spacing, 0.25rem) * 6);
          padding-top: var(--spacing, 0.25rem);
          padding-bottom: calc(var(--spacing, 0.25rem) * 1.5);
        }
      }
      .content {
        grid-column: span 7 / span 7;
        display: flex;
        flex-direction: column;
        gap: calc(var(--spacing, 0.25rem) * 6);
        padding: calc(var(--spacing, 0.25rem) * 5);
        @media (width >= 48rem) {
          grid-column: span 5 / span 5;
        }
        .body {
          font-size: var(--text-sm, 0.875rem);
          line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
          color: var(--color-gray-700, oklch(37.3% 0.034 259.733));
          @media (width >= 48rem) {
            font-size: var(--text-base, 1rem);
            line-height: var(--tw-leading, var(--text-base--line-height, calc(1.5 / 1)));
          }
        }
        .date {
          text-align: end;
          font-size: var(--text-xs, 0.75rem);
          line-height: var(--tw-leading, var(--text-xs--line-height, calc(1 / 0.75)));
          color: var(--color-gray-500, oklch(55.1% 0.027 264.364));
          @media (width >= 48rem) {
            font-size: var(--text-sm, 0.875rem);
            line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
          }
        }
      }
    }
  }
  .forumsHeader {
    background-color: var(--color-gray-200, oklch(92.8% 0.006 264.531));
    padding-block: calc(var(--spacing, 0.25rem) * 10);
    @media (width >= 48rem) {
      padding-block: calc(var(--spacing, 0.25rem) * 16);
    }
    .content {
      margin-inline: auto;
      display: flex;
      width: 100%;
      flex-direction: column;
      flex-wrap: wrap;
      align-items: center;
      justify-content: space-between;
      gap: calc(var(--spacing, 0.25rem) * 2);
      padding-inline: calc(var(--spacing, 0.25rem) * 5);
      @media (width >= 40rem) {
        flex-direction: row;
      }
      @media (width >= 64rem) {
        width: 100%;
        @media (width >= 18.75rem) {
          max-width: 18.75rem;
        }
        @media (width >= 20rem) {
          max-width: 20rem;
        }
        @media (width >= 22.5rem) {
          max-width: 22.5rem;
        }
        @media (width >= 23.75rem) {
          max-width: 23.75rem;
        }
        @media (width >= 30rem) {
          max-width: 30rem;
        }
        @media (width >= 31.25rem) {
          max-width: 31.25rem;
        }
        @media (width >= 32.5rem) {
          max-width: 32.5rem;
        }
        @media (width >= 33.75rem) {
          max-width: 33.75rem;
        }
        @media (width >= 35rem) {
          max-width: 35rem;
        }
        @media (width >= 36rem) {
          max-width: 36rem;
        }
        @media (width >= 37.5rem) {
          max-width: 37.5rem;
        }
        @media (width >= 40rem) {
          max-width: 40rem;
        }
        @media (width >= 40.625rem) {
          max-width: 40.625rem;
        }
        @media (width >= 42rem) {
          max-width: 42rem;
        }
        @media (width >= 43.75rem) {
          max-width: 43.75rem;
        }
        @media (width >= 47.5rem) {
          max-width: 47.5rem;
        }
        @media (width >= 48rem) {
          max-width: 48rem;
        }
        @media (width >= 50rem) {
          max-width: 50rem;
        }
        @media (width >= 53.75rem) {
          max-width: 53.75rem;
        }
        @media (width >= 54rem) {
          max-width: 54rem;
        }
        @media (width >= 55rem) {
          max-width: 55rem;
        }
        @media (width >= 56.25rem) {
          max-width: 56.25rem;
        }
        @media (width >= 57.5rem) {
          max-width: 57.5rem;
        }
        @media (width >= 57.625rem) {
          max-width: 57.625rem;
        }
        @media (width >= 60rem) {
          max-width: 60rem;
        }
        @media (width >= 62rem) {
          max-width: 62rem;
        }
        @media (width >= 62.5rem) {
          max-width: 62.5rem;
        }
        @media (width >= 64rem) {
          max-width: 64rem;
        }
        @media (width >= 65.625rem) {
          max-width: 65.625rem;
        }
        @media (width >= 67.5rem) {
          max-width: 67.5rem;
        }
        @media (width >= 68.125rem) {
          max-width: 68.125rem;
        }
        @media (width >= 68.75rem) {
          max-width: 68.75rem;
        }
        @media (width >= 70rem) {
          max-width: 70rem;
        }
        @media (width >= 73.75rem) {
          max-width: 73.75rem;
        }
        @media (width >= 75rem) {
          max-width: 75rem;
        }
        @media (width >= 80rem) {
          max-width: 80rem;
        }
        @media (width >= 82.5rem) {
          max-width: 82.5rem;
        }
        @media (width >= 86.75rem) {
          max-width: 86.75rem;
        }
        @media (width >= 87.5rem) {
          max-width: 87.5rem;
        }
        @media (width >= 90rem) {
          max-width: 90rem;
        }
        @media (width >= 93.75rem) {
          max-width: 93.75rem;
        }
        @media (width >= 96rem) {
          max-width: 96rem;
        }
        @media (width >= 105rem) {
          max-width: 105rem;
        }
        @media (width >= 118.75rem) {
          max-width: 118.75rem;
        }
        @media (width >= 120rem) {
          max-width: 120rem;
        }
      }
    }
    .heading {
      display: flex;
      flex-wrap: wrap;
      align-items: center;
      gap: calc(var(--spacing, 0.25rem) * 2);
      .boardTitle {
        color: var(--color-custom-color1);
      }
      .title {
        font-size: var(--text-xl, 1.25rem);
        line-height: var(--tw-leading, var(--text-xl--line-height, calc(1.75 / 1.25)));
        @media (width >= 48rem) {
          font-size: var(--text-2xl, 1.5rem);
          line-height: var(--tw-leading, var(--text-2xl--line-height, calc(2 / 1.5)));
        }
      }
    }
    .action {
      display: flex;
      gap: calc(var(--spacing, 0.25rem) * 4);
      border-radius: var(--radius-2xl, 1rem);
      border-style: var(--tw-border-style);
      border-width: 1px;
      padding-inline: calc(var(--spacing, 0.25rem) * 4);
      padding-block: calc(var(--spacing, 0.25rem) * 2);
      color: var(--color-black, #000);
      border-color: var(--color-custom-color1);
      .icon {
        aspect-ratio: 1 / 1;
        width: calc(var(--spacing, 0.25rem) * 4);
        fill: var(--color-custom-color1);
      }
    }
  }
  .forumsOverview {
    position: relative;
    width: 100%;
    padding: calc(var(--spacing, 0.25rem) * 5);
    background-color: var(--color-custom-color1);
    .backgroundImage {
      position: absolute;
      inset-inline-start: calc(var(--spacing, 0.25rem) * 0);
      top: 0px;
      z-index: 0;
      height: 100%;
      width: 100%;
    }
    .overlay {
      position: absolute;
      inset-inline-start: calc(var(--spacing, 0.25rem) * 0);
      top: 0px;
      z-index: 10;
      height: 100%;
      width: 100%;
      background-color: var(--color-custom-color1);
      @supports (color: color-mix(in lab, red, red)) {
        background-color: color-mix(in srgb, var(--color-custom-color1) 80%, transparent);
      }
    }
    .content {
      position: relative;
      z-index: 20;
      margin-inline: auto;
      width: 100%;
      border-radius: var(--radius-2xl, 1rem);
      background-color: var(--color-white, #fff);
      padding: calc(var(--spacing, 0.25rem) * 5);
      @media (width >= 64rem) {
        width: 100%;
        @media (width >= 18.75rem) {
          max-width: 18.75rem;
        }
        @media (width >= 20rem) {
          max-width: 20rem;
        }
        @media (width >= 22.5rem) {
          max-width: 22.5rem;
        }
        @media (width >= 23.75rem) {
          max-width: 23.75rem;
        }
        @media (width >= 30rem) {
          max-width: 30rem;
        }
        @media (width >= 31.25rem) {
          max-width: 31.25rem;
        }
        @media (width >= 32.5rem) {
          max-width: 32.5rem;
        }
        @media (width >= 33.75rem) {
          max-width: 33.75rem;
        }
        @media (width >= 35rem) {
          max-width: 35rem;
        }
        @media (width >= 36rem) {
          max-width: 36rem;
        }
        @media (width >= 37.5rem) {
          max-width: 37.5rem;
        }
        @media (width >= 40rem) {
          max-width: 40rem;
        }
        @media (width >= 40.625rem) {
          max-width: 40.625rem;
        }
        @media (width >= 42rem) {
          max-width: 42rem;
        }
        @media (width >= 43.75rem) {
          max-width: 43.75rem;
        }
        @media (width >= 47.5rem) {
          max-width: 47.5rem;
        }
        @media (width >= 48rem) {
          max-width: 48rem;
        }
        @media (width >= 50rem) {
          max-width: 50rem;
        }
        @media (width >= 53.75rem) {
          max-width: 53.75rem;
        }
        @media (width >= 54rem) {
          max-width: 54rem;
        }
        @media (width >= 55rem) {
          max-width: 55rem;
        }
        @media (width >= 56.25rem) {
          max-width: 56.25rem;
        }
        @media (width >= 57.5rem) {
          max-width: 57.5rem;
        }
        @media (width >= 57.625rem) {
          max-width: 57.625rem;
        }
        @media (width >= 60rem) {
          max-width: 60rem;
        }
        @media (width >= 62rem) {
          max-width: 62rem;
        }
        @media (width >= 62.5rem) {
          max-width: 62.5rem;
        }
        @media (width >= 64rem) {
          max-width: 64rem;
        }
        @media (width >= 65.625rem) {
          max-width: 65.625rem;
        }
        @media (width >= 67.5rem) {
          max-width: 67.5rem;
        }
        @media (width >= 68.125rem) {
          max-width: 68.125rem;
        }
        @media (width >= 68.75rem) {
          max-width: 68.75rem;
        }
        @media (width >= 70rem) {
          max-width: 70rem;
        }
        @media (width >= 73.75rem) {
          max-width: 73.75rem;
        }
        @media (width >= 75rem) {
          max-width: 75rem;
        }
        @media (width >= 80rem) {
          max-width: 80rem;
        }
        @media (width >= 82.5rem) {
          max-width: 82.5rem;
        }
        @media (width >= 86.75rem) {
          max-width: 86.75rem;
        }
        @media (width >= 87.5rem) {
          max-width: 87.5rem;
        }
        @media (width >= 90rem) {
          max-width: 90rem;
        }
        @media (width >= 93.75rem) {
          max-width: 93.75rem;
        }
        @media (width >= 96rem) {
          max-width: 96rem;
        }
        @media (width >= 105rem) {
          max-width: 105rem;
        }
        @media (width >= 118.75rem) {
          max-width: 118.75rem;
        }
        @media (width >= 120rem) {
          max-width: 120rem;
        }
      }
      .heading {
        margin-bottom: calc(var(--spacing, 0.25rem) * 6);
        display: flex;
        gap: calc(var(--spacing, 0.25rem) * 1.5);
        font-size: var(--text-lg, 1.125rem);
        line-height: var(--tw-leading, var(--text-lg--line-height, calc(1.75 / 1.125)));
        .subtitle {
          color: var(--color-gray-500, oklch(55.1% 0.027 264.364));
        }
      }
      .horizontalForums {
        display: flex;
        width: 100%;
        gap: calc(var(--spacing, 0.25rem) * 10);
        overflow-x: auto;
        .forum {
          display: flex;
          flex-direction: column;
          align-items: center;
          justify-content: flex-start;
          gap: calc(var(--spacing, 0.25rem) * 2);
          text-align: center;
          .image {
            aspect-ratio: 1 / 1;
            width: calc(var(--spacing, 0.25rem) * 14);
            overflow: hidden;
            border-radius: calc(infinity * 1px);
            border-style: var(--tw-border-style);
            border-width: 1px;
          }
          .link {
            font-size: var(--text-sm, 0.875rem);
            line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
            color: var(--color-gray-500, oklch(55.1% 0.027 264.364));
          }
        }
      }
    }
  }
  .newComment .title {
    margin-bottom: calc(var(--spacing, 0.25rem) * 4);
    border-bottom-style: var(--tw-border-style);
    border-bottom-width: 1px;
    padding-top: calc(var(--spacing, 0.25rem) * 6);
    padding-bottom: calc(var(--spacing, 0.25rem) * 3);
    font-size: var(--text-xl, 1.25rem);
    line-height: var(--tw-leading, var(--text-xl--line-height, calc(1.75 / 1.25)));
    --tw-font-weight: var(--font-weight-bold, 700);
    font-weight: var(--font-weight-bold, 700);
  }
  .newComment .control {
    width: 100%;
    border-radius: var(--radius-2xl, 1rem);
    border-style: var(--tw-border-style);
    border-width: 1px;
    background-color: var(--color-gray-100, oklch(96.7% 0.003 264.542));
  }
  .newComment .message {
    color: var(--color-gray-500, oklch(55.1% 0.027 264.364));
  }
  .newComment .actions {
    text-align: end;
    .action {
      margin-top: calc(var(--spacing, 0.25rem) * 4);
      display: inline-block;
      cursor: pointer;
      border-radius: var(--radius-2xl, 1rem);
      padding-inline: calc(var(--spacing, 0.25rem) * 6);
      padding-top: var(--spacing, 0.25rem);
      padding-bottom: calc(var(--spacing, 0.25rem) * 1.5);
      background-color: var(--color-custom-color1);
      color: var(--color-custom-color2);
    }
  }
  .sideBox {
    margin-bottom: calc(var(--spacing, 0.25rem) * 6);
    overflow: hidden;
    border-radius: var(--radius-2xl, 1rem);
    border-style: var(--tw-border-style);
    border-width: 1px;
    > .title {
      padding-inline: calc(var(--spacing, 0.25rem) * 4);
      padding-block: calc(var(--spacing, 0.25rem) * 2);
      color: var(--color-white, #fff);
      background-color: var(--color-custom-color1);
    }
    .discussions {
      .discussion {
        display: flex;
        flex-direction: column;
        gap: calc(var(--spacing, 0.25rem) * 3);
        border-top-style: var(--tw-border-style);
        border-top-width: 1px;
        padding: calc(var(--spacing, 0.25rem) * 3);
        font-size: var(--text-sm, 0.875rem);
        line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
        .link {
          overflow: hidden;
          display: -webkit-box;
          -webkit-box-orient: vertical;
          -webkit-line-clamp: 1;
          font-size: var(--text-sm, 0.875rem);
          line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
        }
        .meta {
          display: flex;
          align-items: center;
          justify-content: space-between;
          gap: calc(var(--spacing, 0.25rem) * 3);
          .person {
            overflow: hidden;
            display: -webkit-box;
            -webkit-box-orient: vertical;
            -webkit-line-clamp: 1;
          }
        }
      }
    }
  }
  .boardsTitle {
    margin-bottom: calc(var(--spacing, 0.25rem) * 4);
    font-size: var(--text-2xl, 1.5rem);
    line-height: var(--tw-leading, var(--text-2xl--line-height, calc(2 / 1.5)));
    --tw-font-weight: var(--font-weight-bold, 700);
    font-weight: var(--font-weight-bold, 700);
  }
  .boards {
    display: flex;
    flex-direction: column;
    gap: calc(var(--spacing, 0.25rem) * 4);
    > .board {
      overflow: hidden;
      border-radius: var(--radius-2xl, 1rem);
      background-color: var(--color-gray-100, oklch(96.7% 0.003 264.542));
      > .title {
        padding-inline: calc(var(--spacing, 0.25rem) * 3);
        padding-top: calc(var(--spacing, 0.25rem) * 2);
        padding-bottom: calc(var(--spacing, 0.25rem) * 3);
        background-color: var(--color-custom-color1);
        @supports (color: color-mix(in lab, red, red)) {
          background-color: color-mix(in srgb, var(--color-custom-color1) 30%, transparent);
        }
      }
      .discussions > .discussion {
        display: grid;
        grid-template-columns: repeat(1, minmax(0, 1fr));
        gap: calc(var(--spacing, 0.25rem) * 3);
        padding-inline: calc(var(--spacing, 0.25rem) * 3);
        padding-top: calc(var(--spacing, 0.25rem) * 2);
        padding-bottom: calc(var(--spacing, 0.25rem) * 3);
        font-size: var(--text-sm, 0.875rem);
        line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
        @media (width >= 40rem) {
          grid-template-columns: repeat(10, minmax(0, 1fr));
        }
        .boardName, .update {
          @media (width >= 40rem) {
            grid-column: span 2 / span 2;
          }
          @media (width >= 48rem) {
            grid-column: span 3 / span 3;
          }
        }
        .boardName, .lastTopic {
          display: flex;
          gap: calc(var(--spacing, 0.25rem) * 1.5);
        }
        .boardName .label {
          width: calc(var(--spacing, 0.25rem) * 8);
        }
        .boardName .link {
          overflow: hidden;
          display: -webkit-box;
          -webkit-box-orient: vertical;
          -webkit-line-clamp: 1;
          width: calc(100% - 40px);
          --tw-font-weight: var(--font-weight-bold, 700);
          font-weight: var(--font-weight-bold, 700);
        }
        .update {
          display: flex;
          flex-wrap: wrap;
          gap: calc(var(--spacing, 0.25rem) * 3);
        }
        .lastTopic {
          @media (width >= 40rem) {
            grid-column: span 6 / span 6;
          }
          @media (width >= 48rem) {
            grid-column: span 4 / span 4;
          }
          .label {
            width: calc(var(--spacing, 0.25rem) * 20);
          }
          .link {
            overflow: hidden;
            display: -webkit-box;
            -webkit-box-orient: vertical;
            -webkit-line-clamp: 1;
            width: calc(100% - 80px);
          }
        }
      }
    }
  }
  .galleryOverlay {
    position: fixed;
    inset-inline-end: calc(var(--spacing, 0.25rem) * 0);
    top: 0px;
    z-index: 50;
    height: 100vh;
    width: 100vw;
    cursor: pointer;
    background-color: color-mix(in srgb, #000 95%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix(in srgb, var(--color-black) 95%, transparent);
    }
    display: none;
    &[data-open='true'] {
      display: block;
    }
    .cursor {
      position: absolute;
      border-radius: var(--radius-md, 0.375rem);
      background-color: var(--color-white, #fff);
      padding: var(--spacing, 0.25rem);
      display: none;
      &[data-visible='true'] {
        display: block;
      }
      .icon {
        height: calc(var(--spacing, 0.25rem) * 6);
        width: calc(var(--spacing, 0.25rem) * 6);
      }
    }
    .thumbnails {
      position: absolute;
      inset-inline: 0px;
      top: 0px;
      z-index: 30;
      margin-inline: auto;
      height: fit-content;
      width: 100%;
      max-width: var(--container-2xl, 42rem);
      border-bottom-right-radius: var(--radius-md, 0.375rem);
      border-bottom-left-radius: var(--radius-md, 0.375rem);
      background-color: var(--color-zinc-800, oklch(27.4% 0.006 286.033));
      padding: calc(var(--spacing, 0.25rem) * 4);
      .thumbnail {
        aspect-ratio: 1 / 1;
        width: 100%;
        cursor: pointer;
        border-radius: var(--radius-xs, 0.125rem);
        border-style: var(--tw-border-style);
        border-width: 1px;
        padding: var(--spacing, 0.25rem);
        --tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 2px 4px -2px 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);
        .image {
          height: 100%;
          width: 100%;
          object-fit: contain;
        }
      }
    }
    .viewer {
      position: absolute;
      inset: 0px;
      z-index: 30;
      margin: auto;
      margin-top: calc(var(--spacing, 0.25rem) * 48);
      height: fit-content;
      width: calc(3 / 4 * 100%);
      @media (width >= 48rem) {
        max-width: var(--container-md, 28rem);
      }
      .viewerImage {
        margin-inline: auto;
        aspect-ratio: 1 / 1;
        width: 100%;
        cursor: grab;
        overflow: hidden;
        &:active {
          cursor: grabbing;
        }
        .image {
          margin: 0px;
          margin-inline: auto;
          height: 100%;
          width: 100%;
          object-fit: contain;
          padding: 0px;
          transition-property: all;
          transition-timing-function: var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(0.4, 0, 0.2, 1)));
          transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
          --tw-duration: 200ms;
          transition-duration: 200ms;
        }
      }
    }
  }
  .galleryRichText {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: calc(var(--spacing, 0.25rem) * 4);
    @media (width >= 40rem) {
      grid-template-columns: repeat(4, minmax(0, 1fr));
    }
    .image {
      position: relative;
      overflow: hidden;
      .open {
        position: absolute;
        inset: 0px;
        z-index: 10;
        margin: auto;
        height: calc(var(--spacing, 0.25rem) * 8);
        width: calc(var(--spacing, 0.25rem) * 8);
        border-radius: calc(infinity * 1px);
        background-color: var(--color-zinc-700, oklch(37% 0.013 285.805));
        fill: var(--color-white, #fff);
        padding: calc(var(--spacing, 0.25rem) * 2);
        transition-property: all;
        transition-timing-function: var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(0.4, 0, 0.2, 1)));
        transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
        --tw-duration: 500ms;
        transition-duration: 500ms;
        --tw-ease: var(--ease-in-out, cubic-bezier(0.4, 0, 0.2, 1));
        transition-timing-function: var(--ease-in-out, cubic-bezier(0.4, 0, 0.2, 1));
        @media (width >= 48rem) {
          visibility: hidden;
        }
        @media (width >= 48rem) {
          --tw-translate-y: 180px;
          translate: var(--tw-translate-x) var(--tw-translate-y);
        }
      }
      .preview {
        aspect-ratio: 1 / 1;
        width: 100%;
        cursor: pointer;
        overflow: hidden;
        border-radius: var(--radius-md, 0.375rem);
        border-style: var(--tw-border-style);
        border-width: 10px;
        border-color: var(--color-gray-200, oklch(92.8% 0.006 264.531));
        .media {
          margin: 0px;
          padding: 0px;
          --tw-brightness: brightness(75%);
          filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);
          transition-property: all;
          transition-timing-function: var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(0.4, 0, 0.2, 1)));
          transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
          --tw-duration: 200ms;
          transition-duration: 200ms;
        }
      }
      &:hover {
        .open {
          @media (width >= 48rem) {
            visibility: visible;
          }
          @media (width >= 48rem) {
            --tw-translate-y: 0px;
            translate: var(--tw-translate-x) var(--tw-translate-y);
          }
        }
        .media {
          --tw-scale-x: 110%;
          --tw-scale-y: 110%;
          --tw-scale-z: 110%;
          scale: var(--tw-scale-x) var(--tw-scale-y);
          --tw-brightness: brightness(50%);
          filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);
        }
      }
    }
  }
  .gallerySwiper {
    position: fixed;
    inset-inline-start: calc(var(--spacing, 0.25rem) * 0);
    top: 0px;
    z-index: 50;
    display: flex;
    height: 100vh;
    width: 100%;
    cursor: pointer;
    flex-direction: column;
    overflow: hidden;
    background-color: color-mix(in srgb, #000 80%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix(in srgb, var(--color-black) 80%, transparent);
    }
    .toolbar {
      margin-inline: auto;
      margin-block: calc(var(--spacing, 0.25rem) * 1.5);
      display: flex;
      width: calc(100% - 12px);
      cursor: auto;
      flex-direction: row;
      border-radius: 0.25rem;
      border-style: var(--tw-border-style);
      border-width: 1px;
      border-color: var(--color-gray-200, oklch(92.8% 0.006 264.531));
      padding-inline: calc(var(--spacing, 0.25rem) * 2);
      padding-block: calc(var(--spacing, 0.25rem) * 2);
      --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);
      background-color: color-mix(in srgb, #000 85%, transparent);
      @supports (color: color-mix(in lab, red, red)) {
        background-color: color-mix(in srgb, var(--color-black) 85%, transparent);
      }
      .actions {
        display: flex;
        flex-direction: row;
        gap: calc(var(--spacing, 0.25rem) * 1.5);
        @media (width >= 40rem) {
          gap: calc(var(--spacing, 0.25rem) * 2);
        }
        .close {
          height: calc(var(--spacing, 0.25rem) * 6);
          width: calc(var(--spacing, 0.25rem) * 6);
          cursor: pointer;
          fill: var(--color-white, #fff);
          transition-property: all;
          transition-timing-function: var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(0.4, 0, 0.2, 1)));
          transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
          &:hover {
            fill: var(--color-custom-color1);
          }
        }
      }
      .count {
        margin-inline-start: auto;
        --tw-font-weight: var(--font-weight-semibold, 600);
        font-weight: var(--font-weight-semibold, 600);
        color: var(--color-gray-200, oklch(92.8% 0.006 264.531));
      }
    }
    .content {
      z-index: 30;
      display: flex;
      width: 100%;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      gap: var(--spacing, 0.25rem);
      overflow: hidden;
      padding-inline: calc(var(--spacing, 0.25rem) * 2.5);
      .viewer {
        height: 100%;
        width: 100%;
        .zoom {
          height: calc(100vh - 7rem);
        }
        .media {
          margin-inline: auto;
          aspect-ratio: auto;
          width: 1536px;
          max-width: 100%;
          transform-origin: center;
          transform: var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,);
          transition-property: transform, translate, scale, rotate;
          transition-timing-function: var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(0.4, 0, 0.2, 1)));
          transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
          --tw-duration: 300ms;
          transition-duration: 300ms;
          .image {
            margin-inline: auto;
            max-height: calc(100vh - 7rem);
            cursor: grab;
            border-radius: 0.25rem;
            object-fit: contain;
            &:active {
              cursor: grabbing;
            }
          }
        }
        .paginationBar {
          position: fixed;
          inset-inline-end: calc(1/2 * 100%);
          bottom: 0px;
          z-index: 10;
          margin-inline: auto;
          margin-block: calc(var(--spacing, 0.25rem) * 1.5);
          margin-top: auto;
          display: flex;
          height: calc(var(--spacing, 0.25rem) * 11);
          width: 100%;
          max-width: var(--container-2xl, 42rem);
          --tw-translate-x: calc(calc(1 / 2 * 100%) * -1);
          translate: var(--tw-translate-x) var(--tw-translate-y);
          cursor: auto;
          flex-wrap: wrap;
          align-items: center;
          justify-content: center;
          row-gap: var(--spacing, 0.25rem);
          overflow: hidden;
          border-radius: 0.25rem;
          border-style: var(--tw-border-style);
          border-width: 1px;
          border-color: var(--color-gray-200, oklch(92.8% 0.006 264.531));
          padding-inline: calc(var(--spacing, 0.25rem) * 2);
          --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);
          background-color: color-mix(in srgb, #000 50%, transparent);
          @supports (color: color-mix(in lab, red, red)) {
            background-color: color-mix(in srgb, var(--color-black) 50%, transparent);
          }
          &:dir(ltr) {
            inset-inline-start: calc(1/2 * 100%);
          }
          .bullet {
            height: calc(var(--spacing, 0.25rem) * 2);
            width: calc(var(--spacing, 0.25rem) * 5);
            cursor: pointer;
            border-radius: calc(infinity * 1px);
            background-color: var(--color-gray-200, oklch(92.8% 0.006 264.531));
          }
          .pagination {
            width: 100%;
            .swiper-pagination-bullet {
              background-color: var(--color-gray-200, oklch(92.8% 0.006 264.531));
            }
            .swiper-pagination-bullet-active {
              width: calc(var(--spacing, 0.25rem) * 5);
              border-radius: var(--radius-md, 0.375rem);
            }
          }
        }
      }
    }
    .navigation {
      position: absolute;
      top: calc(1 / 2 * 100%);
      z-index: 50;
      display: flex;
      height: fit-content;
      --tw-translate-y: calc(calc(1 / 2 * 100%) * -1);
      translate: var(--tw-translate-x) var(--tw-translate-y);
      flex-direction: column;
      align-items: center;
      justify-content: center;
      overflow: hidden;
      &[data-single='true'] {
        display: none;
      }
      &.next {
        inset-inline-end: calc(var(--spacing, 0.25rem) * 1);
        .icon {
          rotate: 180deg;
          &:dir(ltr) {
            rotate: 0deg;
          }
        }
      }
      &.previous {
        inset-inline-start: calc(var(--spacing, 0.25rem) * 1);
        .icon:dir(ltr) {
          rotate: 180deg;
        }
      }
      .icon {
        height: calc(var(--spacing, 0.25rem) * 9);
        width: calc(var(--spacing, 0.25rem) * 9);
        cursor: pointer;
        border-radius: var(--radius-sm, 0.25rem);
        border-style: var(--tw-border-style);
        border-width: 1px;
        border-color: var(--color-gray-200, oklch(92.8% 0.006 264.531));
        fill: var(--color-gray-200, oklch(92.8% 0.006 264.531));
        opacity: 70%;
        transition-property: all;
        transition-timing-function: var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(0.4, 0, 0.2, 1)));
        transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
        @media (width >= 64rem) {
          height: calc(var(--spacing, 0.25rem) * 12);
        }
        @media (width >= 64rem) {
          width: calc(var(--spacing, 0.25rem) * 12);
        }
        background-color: var(--color-custom-color1);
      }
      &:hover .icon {
        opacity: 100%;
      }
    }
  }
  .audio {
    margin-inline: auto;
    margin-block: calc(var(--spacing, 0.25rem) * 6);
    display: block;
    width: 100%;
    max-width: var(--container-md, 28rem);
  }
  .download {
    margin-inline: auto;
    max-width: var(--container-xs, 20rem);
    border-radius: var(--radius-lg, 0.5rem);
    background-color: var(--color-gray-300, oklch(87.2% 0.01 258.338));
    padding-inline: calc(var(--spacing, 0.25rem) * 4);
    padding-block: var(--spacing, 0.25rem);
    text-align: center;
    --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);
    .title {
      margin-block: calc(var(--spacing, 0.25rem) * 3);
      text-align: center;
      --tw-font-weight: var(--font-weight-bold, 700);
      font-weight: var(--font-weight-bold, 700);
    }
    .description {
      margin-block: 0px;
      text-align: justify;
      font-size: var(--text-sm, 0.875rem);
      line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
      --tw-leading: calc(var(--spacing, 0.25rem) * 6);
      line-height: calc(var(--spacing, 0.25rem) * 6);
    }
    .action {
      margin-inline: auto;
      margin-block: calc(var(--spacing, 0.25rem) * 2);
      display: flex;
      width: fit-content;
      align-items: center;
      justify-content: center;
      column-gap: calc(var(--spacing, 0.25rem) * 2);
      border-radius: var(--radius-lg, 0.5rem);
      background-color: var(--color-gray-800, oklch(27.8% 0.033 256.848));
      padding-inline: calc(var(--spacing, 0.25rem) * 2);
      padding-block: var(--spacing, 0.25rem);
      .link {
        display: flex;
        padding-inline-start: calc(var(--spacing, 0.25rem) * 2);
        color: var(--color-white, #fff);
        transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, content-visibility, overlay, pointer-events;
        transition-timing-function: var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(0.4, 0, 0.2, 1)));
        transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
        --tw-duration: 200ms;
        transition-duration: 200ms;
        &:hover {
          color: var(--color-green-200, oklch(92.5% 0.084 155.995));
          .icon {
            fill: var(--color-green-200, oklch(92.5% 0.084 155.995));
          }
        }
      }
      .icon {
        margin-inline: var(--spacing, 0.25rem);
        aspect-ratio: 1 / 1;
        width: calc(var(--spacing, 0.25rem) * 6);
        fill: var(--color-white, #fff);
        transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, content-visibility, overlay, pointer-events;
        transition-timing-function: var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(0.4, 0, 0.2, 1)));
        transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
        --tw-duration: 200ms;
        transition-duration: 200ms;
      }
    }
  }
  .video {
    width: 100%;
  }
  .virtualTour {
    margin-block: calc(var(--spacing, 0.25rem) * 8);
    height: 500px;
    width: 100%;
    @media (width >= 64rem) {
      height: 640px;
    }
  }
  .billingAddress {
    margin-block: calc(var(--spacing, 0.25rem) * 8);
    .title {
      font-size: var(--text-lg, 1.125rem);
      line-height: var(--tw-leading, var(--text-lg--line-height, calc(1.75 / 1.125)));
      --tw-font-weight: var(--font-weight-bold, 700);
      font-weight: var(--font-weight-bold, 700);
    }
    .details {
      display: flex;
      flex-direction: column;
      gap: calc(var(--spacing, 0.25rem) * 2);
      .item {
        padding-inline: calc(var(--spacing, 0.25rem) * 3);
        padding-top: calc(var(--spacing, 0.25rem) * 1.5);
        color: var(--color-custom-color12);
        .label {
          padding-inline-end: var(--spacing, 0.25rem);
        }
      }
    }
  }
  .transactionStatus {
    display: flex;
    align-items: center;
    gap: calc(var(--spacing, 0.25rem) * 2);
    .status {
      display: flex;
      align-items: center;
      gap: calc(var(--spacing, 0.25rem) * 2);
      border-radius: var(--radius-xl, 0.75rem);
      padding: calc(var(--spacing, 0.25rem) * 2);
      &[data-success='true'] {
        background-color: var(--color-green-500, oklch(72.3% 0.219 149.579));
      }
      &[data-success='false'] {
        background-color: var(--color-red-500, oklch(63.7% 0.237 25.331));
      }
    }
  }
  .orderDetails {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: calc(var(--spacing, 0.25rem) * 5);
    padding: calc(var(--spacing, 0.25rem) * 5);
    font-size: var(--text-base, 1rem);
    line-height: var(--tw-leading, var(--text-base--line-height, calc(1.5 / 1)));
    @media (width >= 48rem) {
      flex-direction: row;
    }
    @media (width >= 48rem) {
      flex-wrap: wrap;
    }
    @media (width >= 48rem) {
      align-items: center;
    }
    .value {
      padding-inline-start: var(--spacing, 0.25rem);
    }
    .date {
      display: flex;
      .value {
        --tw-font-weight: var(--font-weight-bold, 700);
        font-weight: var(--font-weight-bold, 700);
      }
    }
  }
  .orderItems {
    margin-bottom: calc(var(--spacing, 0.25rem) * 2.5);
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    gap: calc(var(--spacing, 0.25rem) * 2.5);
    @media (width >= 40rem) {
      gap: calc(var(--spacing, 0.25rem) * 5);
    }
    .orderItem {
      position: relative;
      .image {
        aspect-ratio: 1 / 1;
        width: calc(var(--spacing, 0.25rem) * 16);
        overflow: hidden;
        border-radius: calc(infinity * 1px);
        border-style: var(--tw-border-style);
        border-width: 1px;
        transition-property: all;
        transition-timing-function: var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(0.4, 0, 0.2, 1)));
        transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
        border-color: var(--color-custom-color3);
        &:hover {
          border-color: var(--color-custom-color1);
        }
      }
      .quantity {
        position: absolute;
        inset-inline-end: calc(var(--spacing, 0.25rem) * -1);
        top: calc(var(--spacing, 0.25rem) * -1);
        z-index: 10;
        border-radius: calc(infinity * 1px);
        padding-inline: calc(var(--spacing, 0.25rem) * 1.5);
        padding-block: var(--spacing, 0.25rem);
        font-size: var(--text-xs, 0.75rem);
        line-height: var(--tw-leading, var(--text-xs--line-height, calc(1 / 0.75)));
        color: var(--color-white, #fff);
        --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);
        -webkit-user-select: none;
        user-select: none;
        background-color: var(--color-custom-color1);
        @supports (color: color-mix(in lab, red, red)) {
          background-color: color-mix(in srgb, var(--color-custom-color1) 70%, transparent);
        }
      }
    }
    .remaining .quantity {
      position: relative;
      display: flex;
      aspect-ratio: 1 / 1;
      width: calc(var(--spacing, 0.25rem) * 16);
      align-items: center;
      justify-content: center;
      border-radius: calc(infinity * 1px);
      border-style: var(--tw-border-style);
      border-width: 1px;
      font-size: var(--text-sm, 0.875rem);
      line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
      --tw-font-weight: var(--font-weight-bold, 700);
      font-weight: var(--font-weight-bold, 700);
      -webkit-user-select: none;
      user-select: none;
      background-color: var(--color-custom-color3);
      border-color: var(--color-custom-color3);
    }
  }
  .orderItemsTable {
    margin-block: calc(var(--spacing, 0.25rem) * 8);
    > .title {
      font-size: var(--text-lg, 1.125rem);
      line-height: var(--tw-leading, var(--text-lg--line-height, calc(1.75 / 1.125)));
      --tw-font-weight: var(--font-weight-bold, 700);
      font-weight: var(--font-weight-bold, 700);
    }
    .table {
      margin-top: calc(var(--spacing, 0.25rem) * 3);
      min-width: 100%;
      overflow: hidden;
      border-radius: 0.25rem;
      font-size: var(--text-sm, 0.875rem);
      line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
      .headers {
        border-bottom-style: var(--tw-border-style);
        border-bottom-width: 1px;
        border-color: var(--color-gray-300, oklch(87.2% 0.01 258.338));
        padding-block: calc(var(--spacing, 0.25rem) * 1.5);
        --tw-font-weight: var(--font-weight-medium, 500);
        font-weight: var(--font-weight-medium, 500);
        background-color: var(--color-custom-color11);
        color: var(--color-custom-color22);
      }
      .cell {
        padding-inline: var(--spacing, 0.25rem);
        padding-block: calc(var(--spacing, 0.25rem) * 2);
        @media (width >= 40rem) {
          padding-inline: calc(var(--spacing, 0.25rem) * 2.5);
        }
        @media (width >= 48rem) {
          padding-inline: calc(var(--spacing, 0.25rem) * 4);
        }
        &.titleCell {
          padding-inline: calc(var(--spacing, 0.25rem) * 2);
        }
      }
      .items {
        text-align: center;
        .orderItem {
          padding-block: calc(var(--spacing, 0.25rem) * 2);
          transition-property: all;
          transition-timing-function: var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(0.4, 0, 0.2, 1)));
          transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
          background-color: var(--color-custom-color2);
          &:nth-child(odd) {
            background-color: var(--color-custom-color1);
          }
          &:hover {
            background-color: var(--color-custom-color1);
            @supports (color: color-mix(in lab, red, red)) {
              background-color: color-mix(in srgb, var(--color-custom-color1) 80%, transparent);
            }
            color: var(--color-custom-color2);
          }
          .index, .currency {
            font-size: var(--text-xs, 0.75rem);
            line-height: var(--tw-leading, var(--text-xs--line-height, calc(1 / 0.75)));
            @media (width >= 48rem) {
              font-size: var(--text-sm, 0.875rem);
              line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
            }
          }
          .quantity {
            padding-inline-start: var(--spacing, 0.25rem);
            --tw-font-weight: var(--font-weight-semibold, 600);
            font-weight: var(--font-weight-semibold, 600);
            @media (width >= 48rem) {
              --tw-font-weight: var(--font-weight-bold, 700);
              font-weight: var(--font-weight-bold, 700);
            }
          }
          .currency {
            padding-inline-start: var(--spacing, 0.25rem);
          }
        }
      }
    }
  }
  .packageDetails {
    margin-top: calc(var(--spacing, 0.25rem) * 3);
    margin-bottom: calc(var(--spacing, 0.25rem) * 12);
    .summary {
      margin-bottom: calc(var(--spacing, 0.25rem) * 2.5);
      font-size: var(--text-base, 1rem);
      line-height: calc(var(--spacing, 0.25rem) * 8);
      .value {
        margin: var(--spacing, 0.25rem);
        display: inline-block;
        border-radius: 0.25rem;
        padding-inline: var(--spacing, 0.25rem);
        background-color: var(--color-custom-color1);
        @supports (color: color-mix(in lab, red, red)) {
          background-color: color-mix(in srgb, var(--color-custom-color1) 15%, transparent);
        }
        &.status {
          color: var(--color-custom-color2);
          &[data-success='true'] {
            background-color: var(--color-green-500, oklch(72.3% 0.219 149.579));
          }
          &[data-success='false'] {
            background-color: var(--color-red-500, oklch(63.7% 0.237 25.331));
          }
        }
      }
    }
    .details {
      display: flex;
      flex-direction: column;
      align-items: flex-start;
      justify-content: flex-start;
      row-gap: calc(var(--spacing, 0.25rem) * 2);
      font-size: var(--text-base, 1rem);
      line-height: var(--tw-leading, var(--text-base--line-height, calc(1.5 / 1)));
      @media (width >= 48rem) {
        flex-direction: row;
      }
      @media (width >= 48rem) {
        flex-wrap: wrap;
      }
      @media (width >= 48rem) {
        column-gap: calc(var(--spacing, 0.25rem) * 5);
      }
      color: var(--color-custom-color1);
      .value {
        padding-inline-start: var(--spacing, 0.25rem);
        --tw-font-weight: var(--font-weight-semibold, 600);
        font-weight: var(--font-weight-semibold, 600);
      }
    }
  }
  .packageItem {
    display: flex;
    flex-direction: column;
    gap: calc(var(--spacing, 0.25rem) * 2.5);
    overflow: hidden;
    border-radius: var(--radius-xl, 0.75rem);
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-top-style: var(--tw-border-style);
    border-top-width: 2px;
    border-bottom-style: var(--tw-border-style);
    border-bottom-width: 4px;
    border-color: var(--color-gray-300, oklch(87.2% 0.01 258.338));
    background-color: var(--color-white, #fff);
    padding-inline: calc(var(--spacing, 0.25rem) * 5);
    padding-top: calc(var(--spacing, 0.25rem) * 5);
    @media (width >= 64rem) {
      padding-bottom: calc(var(--spacing, 0.25rem) * 5);
    }
    &[data-success='true'] {
      border-top-color: var(--color-green-500, oklch(72.3% 0.219 149.579));
    }
    &[data-success='false'] {
      border-top-color: var(--color-red-500, oklch(63.7% 0.237 25.331));
    }
    .actions {
      bottom: 0px;
      z-index: 40;
      border-top-style: var(--tw-border-style);
      border-top-width: 1px;
      --tw-font-weight: var(--font-weight-bold, 700);
      font-weight: var(--font-weight-bold, 700);
      -webkit-user-select: none;
      user-select: none;
      @media (width >= 64rem) {
        margin-inline-start: auto;
      }
      @media (width >= 64rem) {
        --tw-border-style: none;
        border-style: none;
      }
      border-top-color: var(--color-custom-color24);
      .actionContent {
        display: flex;
        align-items: center;
        justify-content: center;
        padding-block: calc(var(--spacing, 0.25rem) * 1.5);
        .action {
          margin-block: var(--spacing, 0.25rem);
          display: inline-flex;
          align-items: center;
          gap: calc(var(--spacing, 0.25rem) * 2);
          border-radius: var(--radius-lg, 0.5rem);
          padding-inline-start: calc(var(--spacing, 0.25rem) * 2.5);
          transition-property: all;
          transition-timing-function: var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(0.4, 0, 0.2, 1)));
          transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
          --tw-duration: 300ms;
          transition-duration: 300ms;
          @media (width >= 64rem) {
            margin-inline-start: auto;
          }
          color: var(--color-custom-color1);
          .icon {
            aspect-ratio: 1 / 1;
            width: calc(var(--spacing, 0.25rem) * 6);
            border-radius: calc(infinity * 1px);
            transition-property: all;
            transition-timing-function: var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(0.4, 0, 0.2, 1)));
            transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
            --tw-duration: 300ms;
            transition-duration: 300ms;
            &:where(:dir(ltr), [dir="ltr"], [dir="ltr"] *) {
              rotate: 180deg;
            }
            background-color: var(--color-custom-color1);
            fill: var(--color-custom-color2);
          }
        }
      }
      &:hover .action {
        background-color: var(--color-custom-color1);
        color: var(--color-custom-color2);
        .icon {
          rotate: 360deg;
        }
      }
    }
  }
}
@layer themePage {
  .packages {
    margin-inline: calc(var(--spacing, 0.25rem) * 2);
    display: flex;
    flex-direction: column;
    gap: calc(var(--spacing, 0.25rem) * 5);
  }
}
@layer themePart {
  .sectionTitle {
    display: flex;
    width: 100%;
    flex-direction: column;
    align-items: center;
    justify-content: space-between;
    gap: calc(var(--spacing, 0.25rem) * 3);
    padding-bottom: calc(var(--spacing, 0.25rem) * 5);
    @media (width >= 48rem) {
      flex-direction: row;
    }
    @media (width >= 48rem) {
      gap: 0px;
    }
    .title {
      z-index: 10;
      width: fit-content;
      border-bottom-style: var(--tw-border-style);
      border-bottom-width: 2px;
      padding-inline: calc(var(--spacing, 0.25rem) * 5);
      font-size: var(--text-xl, 1.25rem);
      line-height: var(--tw-leading, var(--text-xl--line-height, calc(1.75 / 1.25)));
      --tw-leading: calc(var(--spacing, 0.25rem) * 8);
      line-height: calc(var(--spacing, 0.25rem) * 8);
      -webkit-user-select: none;
      user-select: none;
      @media (width >= 64rem) {
        padding-inline-start: 0px;
      }
      @media (width >= 64rem) {
        padding-inline-end: calc(var(--spacing, 0.25rem) * 3);
      }
      @media (width >= 96rem) {
        font-size: var(--text-2xl, 1.5rem);
        line-height: var(--tw-leading, var(--text-2xl--line-height, calc(2 / 1.5)));
      }
      border-color: var(--color-custom-color1);
      color: var(--color-custom-color12);
    }
  }
  .subscriptions {
    display: flex;
    flex-direction: column;
    .content {
      padding-block: calc(var(--spacing, 0.25rem) * 2);
      @media (width >= 40rem) {
        padding-inline: calc(var(--spacing, 0.25rem) * 6);
      }
      @media (width >= 64rem) {
        padding-inline: calc(var(--spacing, 0.25rem) * 8);
      }
    }
    .table {
      min-width: 100%;
      text-align: center;
      font-size: var(--text-sm, 0.875rem);
      line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
      .headers {
        border-bottom-style: var(--tw-border-style);
        border-bottom-width: 1px;
        border-color: var(--color-neutral-200, oklch(92.2% 0 none));
        background-color: var(--color-slate-200, oklch(92.9% 0.013 255.508));
        .heading {
          padding-inline: calc(var(--spacing, 0.25rem) * 6);
          padding-block: calc(var(--spacing, 0.25rem) * 4);
        }
      }
      .item {
        border-bottom-style: var(--tw-border-style);
        border-bottom-width: 1px;
        border-color: var(--color-neutral-200, oklch(92.2% 0 none));
        transition-property: all;
        transition-timing-function: var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(0.4, 0, 0.2, 1)));
        transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
        &:hover {
          background-color: var(--color-gray-300, oklch(87.2% 0.01 258.338));
        }
        .value {
          padding-inline: calc(var(--spacing, 0.25rem) * 6);
          padding-block: calc(var(--spacing, 0.25rem) * 4);
          white-space: nowrap;
        }
      }
    }
  }
}
@layer themePage {
  .tiers {
    display: grid;
    grid-template-columns: repeat(1, minmax(0, 1fr));
    gap: calc(var(--spacing, 0.25rem) * 2);
    padding: calc(var(--spacing, 0.25rem) * 5);
    text-align: center;
    @media (width >= 48rem) {
      grid-template-columns: repeat(3, minmax(0, 1fr));
    }
    .tier {
      cursor: pointer;
      border-radius: var(--radius-md, 0.375rem);
      border-top-style: var(--tw-border-style);
      border-top-width: 4px;
      background-color: var(--color-white, #fff);
      padding-inline: calc(var(--spacing, 0.25rem) * 5);
      padding-block: calc(var(--spacing, 0.25rem) * 2);
      transition-property: all;
      transition-timing-function: var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(0.4, 0, 0.2, 1)));
      transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
      transition-delay: 100ms;
      border-color: var(--color-custom-color1);
      &:hover {
        --tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 2px 4px -2px 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);
        background-color: var(--color-custom-color1);
        @supports (color: color-mix(in lab, red, red)) {
          background-color: color-mix(in srgb, var(--color-custom-color1) 10%, transparent);
        }
      }
      .title {
        font-size: var(--text-xl, 1.25rem);
        line-height: var(--tw-leading, var(--text-xl--line-height, calc(1.75 / 1.25)));
        --tw-font-weight: var(--font-weight-bold, 700);
        font-weight: var(--font-weight-bold, 700);
      }
      .subtitle {
        margin-bottom: calc(var(--spacing, 0.25rem) * 3);
        font-size: var(--text-xs, 0.75rem);
        line-height: var(--tw-leading, var(--text-xs--line-height, calc(1 / 0.75)));
        color: var(--color-slate-400, oklch(70.4% 0.04 256.788));
      }
      .pricing {
        display: flex;
        justify-content: center;
        gap: calc(var(--spacing, 0.25rem) * 2);
        .currency {
          color: var(--color-slate-400, oklch(70.4% 0.04 256.788));
        }
      }
      .interval {
        margin-block: var(--spacing, 0.25rem);
        font-size: var(--text-lg, 1.125rem);
        line-height: var(--tw-leading, var(--text-lg--line-height, calc(1.75 / 1.125)));
      }
      .attribute {
        display: flex;
        align-items: center;
        gap: calc(var(--spacing, 0.25rem) * 2);
        padding-block: var(--spacing, 0.25rem);
        .available, .unavailable {
          width: calc(var(--spacing, 0.25rem) * 5);
        }
        .available {
          fill: var(--color-green-400, oklch(79.2% 0.209 151.711));
        }
        .unavailable {
          fill: var(--color-red-400, oklch(70.4% 0.191 22.216));
        }
      }
    }
  }
  .warrantyInquiry .title {
    text-align: center;
    font-size: var(--text-2xl, 1.5rem);
    line-height: var(--tw-leading, var(--text-2xl--line-height, calc(2 / 1.5)));
    --tw-font-weight: var(--font-weight-bold, 700);
    font-weight: var(--font-weight-bold, 700);
    &::after {
      margin-inline: auto;
      margin-top: calc(var(--spacing, 0.25rem) * 4);
      display: block;
      height: 5px;
      width: calc(var(--spacing, 0.25rem) * 16);
      border-radius: var(--radius-lg, 0.5rem);
      background-color: var(--color-custom-color1);
      content: '';
    }
  }
  .warrantyInquiry .search {
    position: relative;
    margin-inline: auto;
    height: calc(var(--spacing, 0.25rem) * 12);
    width: 100%;
    @media (width >= 40rem) {
      width: calc(4 / 5 * 100%);
    }
    @media (width >= 48rem) {
      height: calc(var(--spacing, 0.25rem) * 14);
    }
    @media (width >= 48rem) {
      width: 500px;
    }
    > .icon {
      position: absolute;
      inset-inline-start: calc(var(--spacing, 0.25rem) * 2);
      top: calc(1 / 2 * 100%);
      height: calc(var(--spacing, 0.25rem) * 7);
      width: calc(var(--spacing, 0.25rem) * 7);
      --tw-translate-y: calc(calc(1 / 2 * 100%) * -1);
      translate: var(--tw-translate-x) var(--tw-translate-y);
      &[data-rtl='true'] {
        --tw-scale-x: calc(100% * -1);
        scale: var(--tw-scale-x) var(--tw-scale-y);
      }
    }
    .control {
      margin-top: calc(var(--spacing, 0.25rem) * 12);
      display: flex;
      height: 100%;
      width: 100%;
      flex: 1;
      align-items: center;
      gap: calc(var(--spacing, 0.25rem) * 2);
      border-radius: var(--radius-lg, 0.5rem);
      border-style: var(--tw-border-style);
      border-width: 2px;
      border-color: transparent;
      background-color: var(--color-gray-100, oklch(96.7% 0.003 264.542));
      padding-block: calc(var(--spacing, 0.25rem) * 2);
      padding-inline-start: calc(var(--spacing, 0.25rem) * 10);
      padding-inline-end: calc(var(--spacing, 0.25rem) * 6);
      --tw-outline-style: none;
      outline-style: none;
      @media (forced-colors: active) {
        outline: 2px solid transparent;
        outline-offset: 2px;
      }
      transition-property: all;
      transition-timing-function: var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(0.4, 0, 0.2, 1)));
      transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
      --tw-duration: 500ms;
      transition-duration: 500ms;
      &:focus {
        background-color: var(--color-white, #fff);
      }
      &:focus {
        border-color: var(--color-custom-color1);
      }
    }
    .tip {
      margin-block: calc(var(--spacing, 0.25rem) * 2);
      display: flex;
      align-items: center;
      justify-content: flex-start;
      border-radius: var(--radius-sm, 0.25rem);
      background-color: var(--color-orange-100, oklch(95.4% 0.038 75.164));
      padding: calc(var(--spacing, 0.25rem) * 2);
      font-size: var(--text-xs, 0.75rem);
      line-height: var(--tw-leading, var(--text-xs--line-height, calc(1 / 0.75)));
      .icon {
        aspect-ratio: 1 / 1;
        width: calc(var(--spacing, 0.25rem) * 5);
        fill: var(--color-orange-600, oklch(64.6% 0.222 41.116));
      }
    }
  }
  .warrantyInquiry .progress {
    margin-top: calc(var(--spacing, 0.25rem) * 16);
    .icon {
      margin-inline: auto;
      aspect-ratio: 1 / 1;
      width: calc(var(--spacing, 0.25rem) * 10);
      animation: var(--animate-spin, spin 1s linear infinite);
    }
  }
  .warrantyInquiry .notFound {
    margin-inline: auto;
    margin-block: calc(var(--spacing, 0.25rem) * 28);
    width: fit-content;
    font-size: var(--text-lg, 1.125rem);
    line-height: var(--tw-leading, var(--text-lg--line-height, calc(1.75 / 1.125)));
    color: var(--color-red-700, oklch(50.5% 0.213 27.518));
  }
  .warrantyInquiry .result {
    margin-inline: auto;
    margin-top: calc(var(--spacing, 0.25rem) * 14);
    max-width: var(--container-md, 28rem);
    text-align: center;
    .details {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      grid-template-rows: repeat(16, minmax(0, 1fr));
      gap: calc(var(--spacing, 0.25rem) * 2);
      .label {
        border-radius: var(--radius-sm, 0.25rem);
        background-color: var(--color-gray-100, oklch(96.7% 0.003 264.542));
        padding: calc(var(--spacing, 0.25rem) * 2);
        font-size: var(--text-base, 1rem);
        line-height: var(--tw-leading, var(--text-base--line-height, calc(1.5 / 1)));
        --tw-font-weight: var(--font-weight-bold, 700);
        font-weight: var(--font-weight-bold, 700);
      }
      .value {
        padding: calc(var(--spacing, 0.25rem) * 2);
        font-size: var(--text-sm, 0.875rem);
        line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
        --tw-font-weight: var(--font-weight-light, 300);
        font-weight: var(--font-weight-light, 300);
      }
    }
  }
  .warrantyInquiry .content {
    margin-inline: auto;
    margin-top: calc(var(--spacing, 0.25rem) * 40);
    max-width: var(--container-5xl, 64rem);
    padding-inline: calc(var(--spacing, 0.25rem) * 5);
    @media (width >= 80rem) {
      padding-inline: 0px;
    }
  }
}
@property --tw-rotate-x {
  syntax: "*";
  inherits: false;
}
@property --tw-rotate-y {
  syntax: "*";
  inherits: false;
}
@property --tw-rotate-z {
  syntax: "*";
  inherits: false;
}
@property --tw-skew-x {
  syntax: "*";
  inherits: false;
}
@property --tw-skew-y {
  syntax: "*";
  inherits: false;
}
@property --tw-divide-y-reverse {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}
@property --tw-border-style {
  syntax: "*";
  inherits: false;
  initial-value: solid;
}
@property --tw-font-weight {
  syntax: "*";
  inherits: false;
}
@property --tw-ordinal {
  syntax: "*";
  inherits: false;
}
@property --tw-slashed-zero {
  syntax: "*";
  inherits: false;
}
@property --tw-numeric-figure {
  syntax: "*";
  inherits: false;
}
@property --tw-numeric-spacing {
  syntax: "*";
  inherits: false;
}
@property --tw-numeric-fraction {
  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;
}
@property --tw-blur {
  syntax: "*";
  inherits: false;
}
@property --tw-brightness {
  syntax: "*";
  inherits: false;
}
@property --tw-contrast {
  syntax: "*";
  inherits: false;
}
@property --tw-grayscale {
  syntax: "*";
  inherits: false;
}
@property --tw-hue-rotate {
  syntax: "*";
  inherits: false;
}
@property --tw-invert {
  syntax: "*";
  inherits: false;
}
@property --tw-opacity {
  syntax: "*";
  inherits: false;
}
@property --tw-saturate {
  syntax: "*";
  inherits: false;
}
@property --tw-sepia {
  syntax: "*";
  inherits: false;
}
@property --tw-drop-shadow {
  syntax: "*";
  inherits: false;
}
@property --tw-drop-shadow-color {
  syntax: "*";
  inherits: false;
}
@property --tw-drop-shadow-alpha {
  syntax: "<percentage>";
  inherits: false;
  initial-value: 100%;
}
@property --tw-drop-shadow-size {
  syntax: "*";
  inherits: false;
}
@property --tw-duration {
  syntax: "*";
  inherits: false;
}
@property --tw-content {
  syntax: "*";
  initial-value: "";
  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;
}
@property --tw-space-y-reverse {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}
@property --tw-leading {
  syntax: "*";
  inherits: false;
}
@property --tw-translate-x {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}
@property --tw-translate-y {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}
@property --tw-translate-z {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}
@property --tw-space-x-reverse {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}
@property --tw-tracking {
  syntax: "*";
  inherits: false;
}
@property --tw-divide-x-reverse {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}
@property --tw-ease {
  syntax: "*";
  inherits: false;
}
@property --tw-backdrop-blur {
  syntax: "*";
  inherits: false;
}
@property --tw-backdrop-brightness {
  syntax: "*";
  inherits: false;
}
@property --tw-backdrop-contrast {
  syntax: "*";
  inherits: false;
}
@property --tw-backdrop-grayscale {
  syntax: "*";
  inherits: false;
}
@property --tw-backdrop-hue-rotate {
  syntax: "*";
  inherits: false;
}
@property --tw-backdrop-invert {
  syntax: "*";
  inherits: false;
}
@property --tw-backdrop-opacity {
  syntax: "*";
  inherits: false;
}
@property --tw-backdrop-saturate {
  syntax: "*";
  inherits: false;
}
@property --tw-backdrop-sepia {
  syntax: "*";
  inherits: false;
}
@keyframes spin {
  to {
    transform: rotate(360deg);
  }
}
@keyframes pulse {
  50% {
    opacity: 0.5;
  }
}
@keyframes bounce {
  0%, 100% {
    transform: translateY(-25%);
    animation-timing-function: cubic-bezier(0.8, 0, 1, 1);
  }
  50% {
    transform: none;
    animation-timing-function: cubic-bezier(0, 0, 0.2, 1);
  }
}
@keyframes spin {
  to {
    transform: rotate(360deg);
  }
}
@keyframes pulse {
  50% {
    opacity: 0.5;
  }
}
@keyframes bounce {
  0%, 100% {
    transform: translateY(-25%);
    animation-timing-function: cubic-bezier(0.8, 0, 1, 1);
  }
  50% {
    transform: none;
    animation-timing-function: cubic-bezier(0, 0, 0.2, 1);
  }
}
@keyframes spin {
  to {
    transform: rotate(360deg);
  }
}
@keyframes pulse {
  50% {
    opacity: 0.5;
  }
}
@keyframes bounce {
  0%, 100% {
    transform: translateY(-25%);
    animation-timing-function: cubic-bezier(0.8, 0, 1, 1);
  }
  50% {
    transform: none;
    animation-timing-function: cubic-bezier(0, 0, 0.2, 1);
  }
}
@keyframes spin {
  to {
    transform: rotate(360deg);
  }
}
@keyframes pulse {
  50% {
    opacity: 0.5;
  }
}
@keyframes bounce {
  0%, 100% {
    transform: translateY(-25%);
    animation-timing-function: cubic-bezier(0.8, 0, 1, 1);
  }
  50% {
    transform: none;
    animation-timing-function: cubic-bezier(0, 0, 0.2, 1);
  }
}
@keyframes spin {
  to {
    transform: rotate(360deg);
  }
}
@keyframes pulse {
  50% {
    opacity: 0.5;
  }
}
@keyframes bounce {
  0%, 100% {
    transform: translateY(-25%);
    animation-timing-function: cubic-bezier(0.8, 0, 1, 1);
  }
  50% {
    transform: none;
    animation-timing-function: cubic-bezier(0, 0, 0.2, 1);
  }
}
@keyframes spin {
  to {
    transform: rotate(360deg);
  }
}
@keyframes pulse {
  50% {
    opacity: 0.5;
  }
}
@keyframes bounce {
  0%, 100% {
    transform: translateY(-25%);
    animation-timing-function: cubic-bezier(0.8, 0, 1, 1);
  }
  50% {
    transform: none;
    animation-timing-function: cubic-bezier(0, 0, 0.2, 1);
  }
}
@keyframes spin {
  to {
    transform: rotate(360deg);
  }
}
@keyframes pulse {
  50% {
    opacity: 0.5;
  }
}
@keyframes bounce {
  0%, 100% {
    transform: translateY(-25%);
    animation-timing-function: cubic-bezier(0.8, 0, 1, 1);
  }
  50% {
    transform: none;
    animation-timing-function: cubic-bezier(0, 0, 0.2, 1);
  }
}
@keyframes spin {
  to {
    transform: rotate(360deg);
  }
}
@keyframes pulse {
  50% {
    opacity: 0.5;
  }
}
@keyframes bounce {
  0%, 100% {
    transform: translateY(-25%);
    animation-timing-function: cubic-bezier(0.8, 0, 1, 1);
  }
  50% {
    transform: none;
    animation-timing-function: cubic-bezier(0, 0, 0.2, 1);
  }
}
@keyframes spin {
  to {
    transform: rotate(360deg);
  }
}
@keyframes pulse {
  50% {
    opacity: 0.5;
  }
}
@keyframes bounce {
  0%, 100% {
    transform: translateY(-25%);
    animation-timing-function: cubic-bezier(0.8, 0, 1, 1);
  }
  50% {
    transform: none;
    animation-timing-function: cubic-bezier(0, 0, 0.2, 1);
  }
}
@keyframes spin {
  to {
    transform: rotate(360deg);
  }
}
@keyframes pulse {
  50% {
    opacity: 0.5;
  }
}
@keyframes bounce {
  0%, 100% {
    transform: translateY(-25%);
    animation-timing-function: cubic-bezier(0.8, 0, 1, 1);
  }
  50% {
    transform: none;
    animation-timing-function: cubic-bezier(0, 0, 0.2, 1);
  }
}
@keyframes spin {
  to {
    transform: rotate(360deg);
  }
}
@keyframes pulse {
  50% {
    opacity: 0.5;
  }
}
@keyframes bounce {
  0%, 100% {
    transform: translateY(-25%);
    animation-timing-function: cubic-bezier(0.8, 0, 1, 1);
  }
  50% {
    transform: none;
    animation-timing-function: cubic-bezier(0, 0, 0.2, 1);
  }
}
@keyframes spin {
  to {
    transform: rotate(360deg);
  }
}
@keyframes pulse {
  50% {
    opacity: 0.5;
  }
}
@keyframes bounce {
  0%, 100% {
    transform: translateY(-25%);
    animation-timing-function: cubic-bezier(0.8, 0, 1, 1);
  }
  50% {
    transform: none;
    animation-timing-function: cubic-bezier(0, 0, 0.2, 1);
  }
}
@keyframes spin {
  to {
    transform: rotate(360deg);
  }
}
@keyframes pulse {
  50% {
    opacity: 0.5;
  }
}
@keyframes bounce {
  0%, 100% {
    transform: translateY(-25%);
    animation-timing-function: cubic-bezier(0.8, 0, 1, 1);
  }
  50% {
    transform: none;
    animation-timing-function: cubic-bezier(0, 0, 0.2, 1);
  }
}
@keyframes spin {
  to {
    transform: rotate(360deg);
  }
}
@keyframes pulse {
  50% {
    opacity: 0.5;
  }
}
@keyframes bounce {
  0%, 100% {
    transform: translateY(-25%);
    animation-timing-function: cubic-bezier(0.8, 0, 1, 1);
  }
  50% {
    transform: none;
    animation-timing-function: cubic-bezier(0, 0, 0.2, 1);
  }
}
@keyframes spin {
  to {
    transform: rotate(360deg);
  }
}
@keyframes pulse {
  50% {
    opacity: 0.5;
  }
}
@keyframes bounce {
  0%, 100% {
    transform: translateY(-25%);
    animation-timing-function: cubic-bezier(0.8, 0, 1, 1);
  }
  50% {
    transform: none;
    animation-timing-function: cubic-bezier(0, 0, 0.2, 1);
  }
}
@keyframes spin {
  to {
    transform: rotate(360deg);
  }
}
@keyframes pulse {
  50% {
    opacity: 0.5;
  }
}
@keyframes bounce {
  0%, 100% {
    transform: translateY(-25%);
    animation-timing-function: cubic-bezier(0.8, 0, 1, 1);
  }
  50% {
    transform: none;
    animation-timing-function: cubic-bezier(0, 0, 0.2, 1);
  }
}
@keyframes spin {
  to {
    transform: rotate(360deg);
  }
}
@keyframes pulse {
  50% {
    opacity: 0.5;
  }
}
@keyframes bounce {
  0%, 100% {
    transform: translateY(-25%);
    animation-timing-function: cubic-bezier(0.8, 0, 1, 1);
  }
  50% {
    transform: none;
    animation-timing-function: cubic-bezier(0, 0, 0.2, 1);
  }
}
@keyframes spin {
  to {
    transform: rotate(360deg);
  }
}
@keyframes pulse {
  50% {
    opacity: 0.5;
  }
}
@keyframes bounce {
  0%, 100% {
    transform: translateY(-25%);
    animation-timing-function: cubic-bezier(0.8, 0, 1, 1);
  }
  50% {
    transform: none;
    animation-timing-function: cubic-bezier(0, 0, 0.2, 1);
  }
}
@keyframes spin {
  to {
    transform: rotate(360deg);
  }
}
@keyframes pulse {
  50% {
    opacity: 0.5;
  }
}
@keyframes bounce {
  0%, 100% {
    transform: translateY(-25%);
    animation-timing-function: cubic-bezier(0.8, 0, 1, 1);
  }
  50% {
    transform: none;
    animation-timing-function: cubic-bezier(0, 0, 0.2, 1);
  }
}
@keyframes spin {
  to {
    transform: rotate(360deg);
  }
}
@keyframes pulse {
  50% {
    opacity: 0.5;
  }
}
@keyframes bounce {
  0%, 100% {
    transform: translateY(-25%);
    animation-timing-function: cubic-bezier(0.8, 0, 1, 1);
  }
  50% {
    transform: none;
    animation-timing-function: cubic-bezier(0, 0, 0.2, 1);
  }
}
@keyframes spin {
  to {
    transform: rotate(360deg);
  }
}
@keyframes pulse {
  50% {
    opacity: 0.5;
  }
}
@keyframes bounce {
  0%, 100% {
    transform: translateY(-25%);
    animation-timing-function: cubic-bezier(0.8, 0, 1, 1);
  }
  50% {
    transform: none;
    animation-timing-function: cubic-bezier(0, 0, 0.2, 1);
  }
}
@keyframes spin {
  to {
    transform: rotate(360deg);
  }
}
@keyframes pulse {
  50% {
    opacity: 0.5;
  }
}
@keyframes bounce {
  0%, 100% {
    transform: translateY(-25%);
    animation-timing-function: cubic-bezier(0.8, 0, 1, 1);
  }
  50% {
    transform: none;
    animation-timing-function: cubic-bezier(0, 0, 0.2, 1);
  }
}
@keyframes spin {
  to {
    transform: rotate(360deg);
  }
}
@keyframes pulse {
  50% {
    opacity: 0.5;
  }
}
@keyframes bounce {
  0%, 100% {
    transform: translateY(-25%);
    animation-timing-function: cubic-bezier(0.8, 0, 1, 1);
  }
  50% {
    transform: none;
    animation-timing-function: cubic-bezier(0, 0, 0.2, 1);
  }
}
@keyframes spin {
  to {
    transform: rotate(360deg);
  }
}
@keyframes pulse {
  50% {
    opacity: 0.5;
  }
}
@keyframes bounce {
  0%, 100% {
    transform: translateY(-25%);
    animation-timing-function: cubic-bezier(0.8, 0, 1, 1);
  }
  50% {
    transform: none;
    animation-timing-function: cubic-bezier(0, 0, 0.2, 1);
  }
}
@keyframes spin {
  to {
    transform: rotate(360deg);
  }
}
@keyframes pulse {
  50% {
    opacity: 0.5;
  }
}
@keyframes bounce {
  0%, 100% {
    transform: translateY(-25%);
    animation-timing-function: cubic-bezier(0.8, 0, 1, 1);
  }
  50% {
    transform: none;
    animation-timing-function: cubic-bezier(0, 0, 0.2, 1);
  }
}
@keyframes spin {
  to {
    transform: rotate(360deg);
  }
}
@keyframes pulse {
  50% {
    opacity: 0.5;
  }
}
@keyframes bounce {
  0%, 100% {
    transform: translateY(-25%);
    animation-timing-function: cubic-bezier(0.8, 0, 1, 1);
  }
  50% {
    transform: none;
    animation-timing-function: cubic-bezier(0, 0, 0.2, 1);
  }
}
@keyframes spin {
  to {
    transform: rotate(360deg);
  }
}
@keyframes pulse {
  50% {
    opacity: 0.5;
  }
}
@keyframes bounce {
  0%, 100% {
    transform: translateY(-25%);
    animation-timing-function: cubic-bezier(0.8, 0, 1, 1);
  }
  50% {
    transform: none;
    animation-timing-function: cubic-bezier(0, 0, 0.2, 1);
  }
}
@keyframes spin {
  to {
    transform: rotate(360deg);
  }
}
@keyframes pulse {
  50% {
    opacity: 0.5;
  }
}
@keyframes bounce {
  0%, 100% {
    transform: translateY(-25%);
    animation-timing-function: cubic-bezier(0.8, 0, 1, 1);
  }
  50% {
    transform: none;
    animation-timing-function: cubic-bezier(0, 0, 0.2, 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-rotate-x: initial;
      --tw-rotate-y: initial;
      --tw-rotate-z: initial;
      --tw-skew-x: initial;
      --tw-skew-y: initial;
      --tw-divide-y-reverse: 0;
      --tw-border-style: solid;
      --tw-font-weight: initial;
      --tw-ordinal: initial;
      --tw-slashed-zero: initial;
      --tw-numeric-figure: initial;
      --tw-numeric-spacing: initial;
      --tw-numeric-fraction: 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;
      --tw-blur: initial;
      --tw-brightness: initial;
      --tw-contrast: initial;
      --tw-grayscale: initial;
      --tw-hue-rotate: initial;
      --tw-invert: initial;
      --tw-opacity: initial;
      --tw-saturate: initial;
      --tw-sepia: initial;
      --tw-drop-shadow: initial;
      --tw-drop-shadow-color: initial;
      --tw-drop-shadow-alpha: 100%;
      --tw-drop-shadow-size: initial;
      --tw-duration: initial;
      --tw-content: "";
      --tw-scale-x: 1;
      --tw-scale-y: 1;
      --tw-scale-z: 1;
      --tw-space-y-reverse: 0;
      --tw-leading: initial;
      --tw-translate-x: 0;
      --tw-translate-y: 0;
      --tw-translate-z: 0;
      --tw-space-x-reverse: 0;
      --tw-tracking: initial;
      --tw-divide-x-reverse: 0;
      --tw-ease: initial;
      --tw-backdrop-blur: initial;
      --tw-backdrop-brightness: initial;
      --tw-backdrop-contrast: initial;
      --tw-backdrop-grayscale: initial;
      --tw-backdrop-hue-rotate: initial;
      --tw-backdrop-invert: initial;
      --tw-backdrop-opacity: initial;
      --tw-backdrop-saturate: initial;
      --tw-backdrop-sepia: initial;
    }
  }
}