/*
  EGYMIX production CSS bundle.
  Contains compiled Tailwind utilities, theme runtime CSS, slider CSS,
  and classes that replace former inline style attributes.
*/

/*! tailwindcss v4.1.10 | MIT License | https://tailwindcss.com */
@layer properties;
@layer theme, base, components, utilities;
@layer theme {
  :root, :host {
    --font-sans: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji",
      "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
    --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono",
      "Courier New", monospace;
    --color-red-700: oklch(50.5% 0.213 27.518);
    --color-black: #000;
    --spacing: 0.25rem;
    --container-md: 28rem;
    --container-xl: 36rem;
    --container-2xl: 42rem;
    --container-3xl: 48rem;
    --container-4xl: 56rem;
    --container-5xl: 64rem;
    --container-7xl: 80rem;
    --text-xs: 0.75rem;
    --text-xs--line-height: calc(1 / 0.75);
    --text-sm: 0.875rem;
    --text-sm--line-height: calc(1.25 / 0.875);
    --text-base: 1rem;
    --text-base--line-height: calc(1.5 / 1);
    --text-lg: 1.125rem;
    --text-lg--line-height: calc(1.75 / 1.125);
    --text-xl: 1.25rem;
    --text-xl--line-height: calc(1.75 / 1.25);
    --text-2xl: 1.5rem;
    --text-2xl--line-height: calc(2 / 1.5);
    --text-3xl: 1.875rem;
    --text-3xl--line-height: calc(2.25 / 1.875);
    --text-4xl: 2.25rem;
    --text-4xl--line-height: calc(2.5 / 2.25);
    --text-5xl: 3rem;
    --text-5xl--line-height: 1;
    --text-6xl: 3.75rem;
    --text-6xl--line-height: 1;
    --text-7xl: 4.5rem;
    --text-7xl--line-height: 1;
    --font-weight-semibold: 600;
    --font-weight-bold: 700;
    --font-weight-extrabold: 800;
    --tracking-tight: -0.025em;
    --leading-tight: 1.25;
    --default-transition-duration: 150ms;
    --default-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    --default-font-family: var(--font-sans);
    --default-mono-font-family: var(--font-mono);
  }
}
@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, ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");
    font-feature-settings: var(--default-font-feature-settings, normal);
    font-variation-settings: var(--default-font-variation-settings, normal);
    -webkit-tap-highlight-color: transparent;
  }
  hr {
    height: 0;
    color: inherit;
    border-top-width: 1px;
  }
  abbr:where([title]) {
    -webkit-text-decoration: underline dotted;
    text-decoration: underline dotted;
  }
  h1, h2, h3, h4, h5, h6 {
    font-size: inherit;
    font-weight: inherit;
  }
  a {
    color: inherit;
    -webkit-text-decoration: inherit;
    text-decoration: inherit;
  }
  b, strong {
    font-weight: bolder;
  }
  code, kbd, samp, pre {
    font-family: var(--default-mono-font-family, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);
    font-feature-settings: var(--default-mono-font-feature-settings, normal);
    font-variation-settings: var(--default-mono-font-variation-settings, normal);
    font-size: 1em;
  }
  small {
    font-size: 80%;
  }
  sub, sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline;
  }
  sub {
    bottom: -0.25em;
  }
  sup {
    top: -0.5em;
  }
  table {
    text-indent: 0;
    border-color: inherit;
    border-collapse: collapse;
  }
  :-moz-focusring {
    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;
  }
  :-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 {
  .sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border-width: 0;
  }
  .absolute {
    position: absolute;
  }
  .relative {
    position: relative;
  }
  .top-0 {
    top: calc(var(--spacing) * 0);
  }
  .right-0 {
    right: calc(var(--spacing) * 0);
  }
  .bottom-2 {
    bottom: calc(var(--spacing) * 2);
  }
  .left-0 {
    left: calc(var(--spacing) * 0);
  }
  .z-50 {
    z-index: 50;
  }
  .mx-auto {
    margin-inline: auto;
  }
  .mt-1 {
    margin-top: calc(var(--spacing) * 1);
  }
  .mt-2 {
    margin-top: calc(var(--spacing) * 2);
  }
  .mt-3 {
    margin-top: calc(var(--spacing) * 3);
  }
  .mt-4 {
    margin-top: calc(var(--spacing) * 4);
  }
  .mt-5 {
    margin-top: calc(var(--spacing) * 5);
  }
  .mt-6 {
    margin-top: calc(var(--spacing) * 6);
  }
  .mt-7 {
    margin-top: calc(var(--spacing) * 7);
  }
  .mt-8 {
    margin-top: calc(var(--spacing) * 8);
  }
  .mt-9 {
    margin-top: calc(var(--spacing) * 9);
  }
  .mt-10 {
    margin-top: calc(var(--spacing) * 10);
  }
  .mt-12 {
    margin-top: calc(var(--spacing) * 12);
  }
  .mt-14 {
    margin-top: calc(var(--spacing) * 14);
  }
  .mt-16 {
    margin-top: calc(var(--spacing) * 16);
  }
  .block {
    display: block;
  }
  .flex {
    display: flex;
  }
  .grid {
    display: grid;
  }
  .hidden {
    display: none;
  }
  .inline-flex {
    display: inline-flex;
  }
  .h-4 {
    height: calc(var(--spacing) * 4);
  }
  .h-5 {
    height: calc(var(--spacing) * 5);
  }
  .h-6 {
    height: calc(var(--spacing) * 6);
  }
  .h-10 {
    height: calc(var(--spacing) * 10);
  }
  .h-64 {
    height: calc(var(--spacing) * 64);
  }
  .h-80 {
    height: calc(var(--spacing) * 80);
  }
  .h-\[520px\] {
    height: 520px;
  }
  .min-h-\[72vh\] {
    min-height: 72vh;
  }
  .min-h-\[74vh\] {
    min-height: 74vh;
  }
  .min-h-\[140px\] {
    min-height: 140px;
  }
  .min-h-\[200px\] {
    min-height: 200px;
  }
  .min-h-\[230px\] {
    min-height: 230px;
  }
  .min-h-\[260px\] {
    min-height: 260px;
  }
  .min-h-\[280px\] {
    min-height: 280px;
  }
  .min-h-\[300px\] {
    min-height: 300px;
  }
  .min-h-\[360px\] {
    min-height: 360px;
  }
  .min-h-\[380px\] {
    min-height: 380px;
  }
  .min-h-\[420px\] {
    min-height: 420px;
  }
  .min-h-\[430px\] {
    min-height: 430px;
  }
  .min-h-\[500px\] {
    min-height: 500px;
  }
  .min-h-\[560px\] {
    min-height: 560px;
  }
  .min-h-\[600px\] {
    min-height: 600px;
  }
  .min-h-screen {
    min-height: 100vh;
  }
  .w-4 {
    width: calc(var(--spacing) * 4);
  }
  .w-5 {
    width: calc(var(--spacing) * 5);
  }
  .w-6 {
    width: calc(var(--spacing) * 6);
  }
  .w-10 {
    width: calc(var(--spacing) * 10);
  }
  .w-\[48\%\] {
    width: 48%;
  }
  .w-\[76\%\] {
    width: 76%;
  }
  .w-full {
    width: 100%;
  }
  .max-w-2xl {
    max-width: var(--container-2xl);
  }
  .max-w-3xl {
    max-width: var(--container-3xl);
  }
  .max-w-4xl {
    max-width: var(--container-4xl);
  }
  .max-w-5xl {
    max-width: var(--container-5xl);
  }
  .max-w-7xl {
    max-width: var(--container-7xl);
  }
  .max-w-md {
    max-width: var(--container-md);
  }
  .max-w-xl {
    max-width: var(--container-xl);
  }
  .shrink-0 {
    flex-shrink: 0;
  }
  .resize {
    resize: both;
  }
  .scroll-mt-28 {
    scroll-margin-top: calc(var(--spacing) * 28);
  }
  .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: calc(var(--spacing) * 1);
  }
  .gap-2 {
    gap: calc(var(--spacing) * 2);
  }
  .gap-3 {
    gap: calc(var(--spacing) * 3);
  }
  .gap-4 {
    gap: calc(var(--spacing) * 4);
  }
  .gap-5 {
    gap: calc(var(--spacing) * 5);
  }
  .gap-6 {
    gap: calc(var(--spacing) * 6);
  }
  .gap-8 {
    gap: calc(var(--spacing) * 8);
  }
  .gap-10 {
    gap: calc(var(--spacing) * 10);
  }
  .gap-12 {
    gap: calc(var(--spacing) * 12);
  }
  .gap-14 {
    gap: calc(var(--spacing) * 14);
  }
  .space-y-3 {
    :where(& > :not(:last-child)) {
      --tw-space-y-reverse: 0;
      margin-block-start: calc(calc(var(--spacing) * 3) * var(--tw-space-y-reverse));
      margin-block-end: calc(calc(var(--spacing) * 3) * calc(1 - var(--tw-space-y-reverse)));
    }
  }
  .space-y-5 {
    :where(& > :not(:last-child)) {
      --tw-space-y-reverse: 0;
      margin-block-start: calc(calc(var(--spacing) * 5) * var(--tw-space-y-reverse));
      margin-block-end: calc(calc(var(--spacing) * 5) * calc(1 - var(--tw-space-y-reverse)));
    }
  }
  .space-y-6 {
    :where(& > :not(:last-child)) {
      --tw-space-y-reverse: 0;
      margin-block-start: calc(calc(var(--spacing) * 6) * var(--tw-space-y-reverse));
      margin-block-end: calc(calc(var(--spacing) * 6) * calc(1 - var(--tw-space-y-reverse)));
    }
  }
  .space-y-7 {
    :where(& > :not(:last-child)) {
      --tw-space-y-reverse: 0;
      margin-block-start: calc(calc(var(--spacing) * 7) * var(--tw-space-y-reverse));
      margin-block-end: calc(calc(var(--spacing) * 7) * calc(1 - var(--tw-space-y-reverse)));
    }
  }
  .space-y-8 {
    :where(& > :not(:last-child)) {
      --tw-space-y-reverse: 0;
      margin-block-start: calc(calc(var(--spacing) * 8) * var(--tw-space-y-reverse));
      margin-block-end: calc(calc(var(--spacing) * 8) * calc(1 - var(--tw-space-y-reverse)));
    }
  }
  .space-y-9 {
    :where(& > :not(:last-child)) {
      --tw-space-y-reverse: 0;
      margin-block-start: calc(calc(var(--spacing) * 9) * var(--tw-space-y-reverse));
      margin-block-end: calc(calc(var(--spacing) * 9) * calc(1 - var(--tw-space-y-reverse)));
    }
  }
  .space-y-10 {
    :where(& > :not(:last-child)) {
      --tw-space-y-reverse: 0;
      margin-block-start: calc(calc(var(--spacing) * 10) * var(--tw-space-y-reverse));
      margin-block-end: calc(calc(var(--spacing) * 10) * calc(1 - var(--tw-space-y-reverse)));
    }
  }
  .gap-x-8 {
    column-gap: calc(var(--spacing) * 8);
  }
  .gap-x-10 {
    column-gap: calc(var(--spacing) * 10);
  }
  .gap-y-3 {
    row-gap: calc(var(--spacing) * 3);
  }
  .gap-y-6 {
    row-gap: calc(var(--spacing) * 6);
  }
  .gap-y-7 {
    row-gap: calc(var(--spacing) * 7);
  }
  .gap-y-8 {
    row-gap: calc(var(--spacing) * 8);
  }
  .gap-y-9 {
    row-gap: calc(var(--spacing) * 9);
  }
  .overflow-x-hidden {
    overflow-x: hidden;
  }
  .scroll-smooth {
    scroll-behavior: smooth;
  }
  .border {
    border-style: var(--tw-border-style);
    border-width: 1px;
  }
  .bg-transparent {
    background-color: transparent;
  }
  .object-top {
    object-position: top;
  }
  .px-4 {
    padding-inline: calc(var(--spacing) * 4);
  }
  .px-5 {
    padding-inline: calc(var(--spacing) * 5);
  }
  .px-6 {
    padding-inline: calc(var(--spacing) * 6);
  }
  .px-7 {
    padding-inline: calc(var(--spacing) * 7);
  }
  .px-8 {
    padding-inline: calc(var(--spacing) * 8);
  }
  .py-3 {
    padding-block: calc(var(--spacing) * 3);
  }
  .py-4 {
    padding-block: calc(var(--spacing) * 4);
  }
  .py-5 {
    padding-block: calc(var(--spacing) * 5);
  }
  .py-8 {
    padding-block: calc(var(--spacing) * 8);
  }
  .py-10 {
    padding-block: calc(var(--spacing) * 10);
  }
  .py-12 {
    padding-block: calc(var(--spacing) * 12);
  }
  .py-14 {
    padding-block: calc(var(--spacing) * 14);
  }
  .pt-4 {
    padding-top: calc(var(--spacing) * 4);
  }
  .pt-5 {
    padding-top: calc(var(--spacing) * 5);
  }
  .pt-6 {
    padding-top: calc(var(--spacing) * 6);
  }
  .pt-7 {
    padding-top: calc(var(--spacing) * 7);
  }
  .pt-8 {
    padding-top: calc(var(--spacing) * 8);
  }
  .pt-12 {
    padding-top: calc(var(--spacing) * 12);
  }
  .pt-14 {
    padding-top: calc(var(--spacing) * 14);
  }
  .pt-16 {
    padding-top: calc(var(--spacing) * 16);
  }
  .pb-8 {
    padding-bottom: calc(var(--spacing) * 8);
  }
  .pb-12 {
    padding-bottom: calc(var(--spacing) * 12);
  }
  .text-right {
    text-align: right;
  }
  .text-2xl {
    font-size: var(--text-2xl);
    line-height: var(--tw-leading, var(--text-2xl--line-height));
  }
  .text-3xl {
    font-size: var(--text-3xl);
    line-height: var(--tw-leading, var(--text-3xl--line-height));
  }
  .text-4xl {
    font-size: var(--text-4xl);
    line-height: var(--tw-leading, var(--text-4xl--line-height));
  }
  .text-5xl {
    font-size: var(--text-5xl);
    line-height: var(--tw-leading, var(--text-5xl--line-height));
  }
  .text-6xl {
    font-size: var(--text-6xl);
    line-height: var(--tw-leading, var(--text-6xl--line-height));
  }
  .text-7xl {
    font-size: var(--text-7xl);
    line-height: var(--tw-leading, var(--text-7xl--line-height));
  }
  .text-base {
    font-size: var(--text-base);
    line-height: var(--tw-leading, var(--text-base--line-height));
  }
  .text-lg {
    font-size: var(--text-lg);
    line-height: var(--tw-leading, var(--text-lg--line-height));
  }
  .text-sm {
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
  }
  .text-xl {
    font-size: var(--text-xl);
    line-height: var(--tw-leading, var(--text-xl--line-height));
  }
  .text-xs {
    font-size: var(--text-xs);
    line-height: var(--tw-leading, var(--text-xs--line-height));
  }
  .text-\[1\.08rem\] {
    font-size: 1.08rem;
  }
  .leading-6 {
    --tw-leading: calc(var(--spacing) * 6);
    line-height: calc(var(--spacing) * 6);
  }
  .leading-7 {
    --tw-leading: calc(var(--spacing) * 7);
    line-height: calc(var(--spacing) * 7);
  }
  .leading-8 {
    --tw-leading: calc(var(--spacing) * 8);
    line-height: calc(var(--spacing) * 8);
  }
  .leading-9 {
    --tw-leading: calc(var(--spacing) * 9);
    line-height: calc(var(--spacing) * 9);
  }
  .leading-10 {
    --tw-leading: calc(var(--spacing) * 10);
    line-height: calc(var(--spacing) * 10);
  }
  .leading-\[1\.7\] {
    --tw-leading: 1.7;
    line-height: 1.7;
  }
  .leading-\[1\.12\] {
    --tw-leading: 1.12;
    line-height: 1.12;
  }
  .leading-none {
    --tw-leading: 1;
    line-height: 1;
  }
  .leading-tight {
    --tw-leading: var(--leading-tight);
    line-height: var(--leading-tight);
  }
  .font-bold {
    --tw-font-weight: var(--font-weight-bold);
    font-weight: var(--font-weight-bold);
  }
  .font-extrabold {
    --tw-font-weight: var(--font-weight-extrabold);
    font-weight: var(--font-weight-extrabold);
  }
  .font-semibold {
    --tw-font-weight: var(--font-weight-semibold);
    font-weight: var(--font-weight-semibold);
  }
  .tracking-\[0\.32em\] {
    --tw-tracking: 0.32em;
    letter-spacing: 0.32em;
  }
  .tracking-tight {
    --tw-tracking: var(--tracking-tight);
    letter-spacing: var(--tracking-tight);
  }
  .text-\[var\(--text-soft\)\] {
    color: var(--text-soft);
  }
  .text-red-700 {
    color: var(--color-red-700);
  }
  .uppercase {
    text-transform: uppercase;
  }
  .antialiased {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
  }
  .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, visibility, content-visibility, overlay, pointer-events;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
  }
  .duration-200 {
    --tw-duration: 200ms;
    transition-duration: 200ms;
  }
  .duration-300 {
    --tw-duration: 300ms;
    transition-duration: 300ms;
  }
  .group-hover\:scale-105 {
    &:is(:where(.group):hover *) {
      @media (hover: hover) {
        --tw-scale-x: 105%;
        --tw-scale-y: 105%;
        --tw-scale-z: 105%;
        scale: var(--tw-scale-x) var(--tw-scale-y);
      }
    }
  }
  .hover\:text-\[var\(--gold\)\] {
    &:hover {
      @media (hover: hover) {
        color: var(--gold);
      }
    }
  }
  .focus\:not-sr-only {
    &:focus {
      position: static;
      width: auto;
      height: auto;
      padding: 0;
      margin: 0;
      overflow: visible;
      clip: auto;
      white-space: normal;
    }
  }
  .focus\:fixed {
    &:focus {
      position: fixed;
    }
  }
  .focus\:top-5 {
    &:focus {
      top: calc(var(--spacing) * 5);
    }
  }
  .focus\:right-5 {
    &:focus {
      right: calc(var(--spacing) * 5);
    }
  }
  .focus\:z-\[100\] {
    &:focus {
      z-index: 100;
    }
  }
  .focus\:bg-black {
    &:focus {
      background-color: var(--color-black);
    }
  }
  .focus\:px-4 {
    &:focus {
      padding-inline: calc(var(--spacing) * 4);
    }
  }
  .focus\:py-2 {
    &:focus {
      padding-block: calc(var(--spacing) * 2);
    }
  }
  .focus\:outline-none {
    &:focus {
      --tw-outline-style: none;
      outline-style: none;
    }
  }
  .sm\:grid-cols-2 {
    @media (width >= 40rem) {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }
  }
  .sm\:flex-row {
    @media (width >= 40rem) {
      flex-direction: row;
    }
  }
  .sm\:items-center {
    @media (width >= 40rem) {
      align-items: center;
    }
  }
  .sm\:justify-between {
    @media (width >= 40rem) {
      justify-content: space-between;
    }
  }
  .sm\:px-6 {
    @media (width >= 40rem) {
      padding-inline: calc(var(--spacing) * 6);
    }
  }
  .sm\:py-14 {
    @media (width >= 40rem) {
      padding-block: calc(var(--spacing) * 14);
    }
  }
  .sm\:text-4xl {
    @media (width >= 40rem) {
      font-size: var(--text-4xl);
      line-height: var(--tw-leading, var(--text-4xl--line-height));
    }
  }
  .sm\:text-5xl {
    @media (width >= 40rem) {
      font-size: var(--text-5xl);
      line-height: var(--tw-leading, var(--text-5xl--line-height));
    }
  }
  .sm\:text-6xl {
    @media (width >= 40rem) {
      font-size: var(--text-6xl);
      line-height: var(--tw-leading, var(--text-6xl--line-height));
    }
  }
  .sm\:text-base {
    @media (width >= 40rem) {
      font-size: var(--text-base);
      line-height: var(--tw-leading, var(--text-base--line-height));
    }
  }
  .sm\:text-lg {
    @media (width >= 40rem) {
      font-size: var(--text-lg);
      line-height: var(--tw-leading, var(--text-lg--line-height));
    }
  }
  .md\:col-span-2 {
    @media (width >= 48rem) {
      grid-column: span 2 / span 2;
    }
  }
  .md\:grid-cols-2 {
    @media (width >= 48rem) {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }
  }
  .lg\:sticky {
    @media (width >= 64rem) {
      position: sticky;
    }
  }
  .lg\:top-28 {
    @media (width >= 64rem) {
      top: calc(var(--spacing) * 28);
    }
  }
  .lg\:order-2 {
    @media (width >= 64rem) {
      order: 2;
    }
  }
  .lg\:flex {
    @media (width >= 64rem) {
      display: flex;
    }
  }
  .lg\:hidden {
    @media (width >= 64rem) {
      display: none;
    }
  }
  .lg\:grid-cols-3 {
    @media (width >= 64rem) {
      grid-template-columns: repeat(3, minmax(0, 1fr));
    }
  }
  .lg\:grid-cols-\[0\.5fr_0\.5fr\] {
    @media (width >= 64rem) {
      grid-template-columns: 0.5fr 0.5fr;
    }
  }
  .lg\:grid-cols-\[0\.32fr_0\.68fr\] {
    @media (width >= 64rem) {
      grid-template-columns: 0.32fr 0.68fr;
    }
  }
  .lg\:grid-cols-\[0\.34fr_0\.66fr\] {
    @media (width >= 64rem) {
      grid-template-columns: 0.34fr 0.66fr;
    }
  }
  .lg\:grid-cols-\[0\.36fr_0\.64fr\] {
    @media (width >= 64rem) {
      grid-template-columns: 0.36fr 0.64fr;
    }
  }
  .lg\:grid-cols-\[0\.38fr_0\.62fr\] {
    @media (width >= 64rem) {
      grid-template-columns: 0.38fr 0.62fr;
    }
  }
  .lg\:grid-cols-\[0\.42fr_0\.58fr\] {
    @media (width >= 64rem) {
      grid-template-columns: 0.42fr 0.58fr;
    }
  }
  .lg\:grid-cols-\[0\.43fr_0\.57fr\] {
    @media (width >= 64rem) {
      grid-template-columns: 0.43fr 0.57fr;
    }
  }
  .lg\:grid-cols-\[0\.44fr_0\.56fr\] {
    @media (width >= 64rem) {
      grid-template-columns: 0.44fr 0.56fr;
    }
  }
  .lg\:grid-cols-\[0\.45fr_0\.55fr\] {
    @media (width >= 64rem) {
      grid-template-columns: 0.45fr 0.55fr;
    }
  }
  .lg\:grid-cols-\[0\.46fr_0\.54fr\] {
    @media (width >= 64rem) {
      grid-template-columns: 0.46fr 0.54fr;
    }
  }
  .lg\:grid-cols-\[0\.48fr_0\.52fr\] {
    @media (width >= 64rem) {
      grid-template-columns: 0.48fr 0.52fr;
    }
  }
  .lg\:grid-cols-\[0\.58fr_0\.42fr\] {
    @media (width >= 64rem) {
      grid-template-columns: 0.58fr 0.42fr;
    }
  }
  .lg\:grid-cols-\[0\.62fr_0\.38fr\] {
    @media (width >= 64rem) {
      grid-template-columns: 0.62fr 0.38fr;
    }
  }
  .lg\:grid-cols-\[1\.02fr_0\.98fr\] {
    @media (width >= 64rem) {
      grid-template-columns: 1.02fr 0.98fr;
    }
  }
  .lg\:grid-cols-\[1\.15fr_0\.85fr_0\.75fr\] {
    @media (width >= 64rem) {
      grid-template-columns: 1.15fr 0.85fr 0.75fr;
    }
  }
  .lg\:items-center {
    @media (width >= 64rem) {
      align-items: center;
    }
  }
  .lg\:items-end {
    @media (width >= 64rem) {
      align-items: flex-end;
    }
  }
  .lg\:items-start {
    @media (width >= 64rem) {
      align-items: flex-start;
    }
  }
  .lg\:justify-end {
    @media (width >= 64rem) {
      justify-content: flex-end;
    }
  }
  .lg\:px-8 {
    @media (width >= 64rem) {
      padding-inline: calc(var(--spacing) * 8);
    }
  }
  .lg\:py-16 {
    @media (width >= 64rem) {
      padding-block: calc(var(--spacing) * 16);
    }
  }
  .lg\:text-7xl {
    @media (width >= 64rem) {
      font-size: var(--text-7xl);
      line-height: var(--tw-leading, var(--text-7xl--line-height));
    }
  }
  .xl\:grid-cols-4 {
    @media (width >= 80rem) {
      grid-template-columns: repeat(4, minmax(0, 1fr));
    }
  }
}
@property --tw-space-y-reverse {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}
@property --tw-border-style {
  syntax: "*";
  inherits: false;
  initial-value: solid;
}
@property --tw-leading {
  syntax: "*";
  inherits: false;
}
@property --tw-font-weight {
  syntax: "*";
  inherits: false;
}
@property --tw-tracking {
  syntax: "*";
  inherits: false;
}
@property --tw-duration {
  syntax: "*";
  inherits: false;
}
@property --tw-scale-x {
  syntax: "*";
  inherits: false;
  initial-value: 1;
}
@property --tw-scale-y {
  syntax: "*";
  inherits: false;
  initial-value: 1;
}
@property --tw-scale-z {
  syntax: "*";
  inherits: false;
  initial-value: 1;
}
@layer properties {
  @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {
    *, ::before, ::after, ::backdrop {
      --tw-space-y-reverse: 0;
      --tw-border-style: solid;
      --tw-leading: initial;
      --tw-font-weight: initial;
      --tw-tracking: initial;
      --tw-duration: initial;
      --tw-scale-x: 1;
      --tw-scale-y: 1;
      --tw-scale-z: 1;
    }
  }
}


/* EGYMIX static theme CSS extracted from the former runtime style injection. */
:root {
          --body-bg: #F5FFFA;
          --page-bg-a: #F8FFFC;
          --page-bg-b: #E6F8F1;
          --surface: rgba(255,255,255,0.74);
          --surface-strong: rgba(255,255,255,0.92);
          --surface-muted: rgba(44,222,133,0.075);
          --border: rgba(0,65,74,0.13);
          --border-strong: rgba(0,65,74,0.22);
          --text: #07343B;
          --text-soft: #245B60;
          --text-muted: #5F7E7B;
          --title: #00414A;
          --inverse: #FFFFFF;
          --gold: #2CDE85;
          --gold-soft: rgba(44,222,133,0.16);
          --bronze: #00414A;
          --green: #2CDE85;
          --green-soft: rgba(44,222,133,0.13);
          --ink: #E8FBF2;
          --nav-bg: rgba(248,255,252,0.76);
          --footer-bg: #E8F8F1;
          --field-bg: rgba(255,255,255,0.78);
          --field-border: rgba(0,65,74,0.18);
          --placeholder: #6F8D8A;
          --shadow: 0 36px 120px -74px rgba(0,65,74,0.30);
          --glow: 0 0 82px rgba(44,222,133,0.12);
          --gradient-text: linear-gradient(90deg, #00414A 0%, #12B970 52%, #2CDE85 100%);
          --visualA: linear-gradient(135deg, rgba(44,222,133,0.19), rgba(0,65,74,0.07), rgba(255,255,255,0.78));
          --visualB: linear-gradient(135deg, rgba(0,65,74,0.10), rgba(44,222,133,0.12), rgba(255,255,255,0.80));
          --visualC: linear-gradient(135deg, rgba(44,222,133,0.15), rgba(0,65,74,0.09), rgba(255,255,255,0.80));
        }
      

      :root { color-scheme: light; }
      html, body, body *, button, input, select, textarea, option, label, a, p, span, div, section, article, header, footer, nav, main, h1, h2, h3, h4, h5, h6, small, strong, em, li, th, td, figcaption, ::before, ::after { font-family: 'Almarai', sans-serif !important; }
      body { background: var(--body-bg); color: var(--text); }
      body::before {
        content: '';
        position: fixed;
        inset: 0;
        z-index: -2;
        background:
          radial-gradient(circle at 12% 8%, rgba(44,222,133,0.22), transparent 30%),
          radial-gradient(circle at 88% 18%, rgba(0,65,74,0.10), transparent 34%),
          radial-gradient(circle at 55% 86%, rgba(44,222,133,0.09), transparent 30%),
          linear-gradient(180deg, var(--page-bg-a), var(--page-bg-b));
      }
      body::after {
        content: '';
        position: fixed;
        inset: 0;
        z-index: -1;
        pointer-events: none;
        opacity: .72;
        background:
          linear-gradient(135deg, rgba(255,255,255,0.035), transparent 38%, rgba(44,222,133,0.045)),
          radial-gradient(circle at 72% 42%, rgba(44,222,133,0.075), transparent 26%);
        mix-blend-mode: screen;
      }
      .theme-title { color: var(--title); }
      .theme-text { color: var(--text); }
      .theme-soft { color: var(--text-soft); }
      .theme-muted { color: var(--text-muted); }
      .theme-gold { color: var(--gold); }
      .theme-gradient-text { background: var(--gradient-text); -webkit-background-clip: text; background-clip: text; color: transparent; }
      :root {
        --fixed-nav-height: 82px;
        --fixed-nav-side-gap: clamp(0.75rem, 2vw, 1.5rem);
      }

      body {
        padding-top: var(--fixed-nav-height);
      }

      .theme-nav {
        position: fixed !important;
        inset-block-start: 0;
        inset-inline: 0;
        z-index: 90;
        width: 100%;
        isolation: isolate;
        background:
          linear-gradient(135deg, rgba(255,255,255,0.52), rgba(255,255,255,0.22)),
          rgba(255,255,255,0.30);
        background-clip: padding-box;
        border-bottom: 1px solid rgba(255,255,255,0.46);
        box-shadow:
          0 22px 70px -58px rgba(0,65,74,0.24),
          0 1px 0 rgba(255,255,255,0.62) inset,
          0 -1px 0 rgba(255,255,255,0.22) inset;
        backdrop-filter: blur(34px) saturate(178%) brightness(1.04);
        -webkit-backdrop-filter: blur(34px) saturate(178%) brightness(1.04);
        transform: translateZ(0);
        will-change: backdrop-filter, background, box-shadow;
      }

      .theme-nav::before {
        content: '';
        position: absolute;
        inset: 0;
        z-index: -1;
        pointer-events: none;
        background:
          linear-gradient(90deg, transparent 0%, rgba(255,255,255,0.34) 48%, transparent 100%),
          linear-gradient(180deg, rgba(255,255,255,0.34), rgba(255,255,255,0.06) 62%, transparent);
        opacity: .56;
      }

      .theme-nav::after {
        content: '';
        position: absolute;
        inset-inline: var(--fixed-nav-side-gap);
        bottom: 0;
        height: 1px;
        pointer-events: none;
        background: linear-gradient(90deg, transparent, rgba(255,255,255,0.82), rgba(236,242,240,0.58), rgba(255,255,255,0.82), transparent);
      }

      .theme-nav > div:first-child {
        min-height: var(--fixed-nav-height);
      }

      .theme-nav #mobileMenu {
        background:
          linear-gradient(135deg, rgba(255,255,255,0.62), rgba(255,255,255,0.30)),
          rgba(255,255,255,0.38);
        border-top: 1px solid rgba(255,255,255,0.44);
        box-shadow: 0 18px 58px -52px rgba(0,65,74,0.22);
        backdrop-filter: blur(30px) saturate(170%) brightness(1.04);
        -webkit-backdrop-filter: blur(30px) saturate(170%) brightness(1.04);
      }

      @supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
        .theme-nav {
          background: rgba(255,255,255,0.82);
        }
        .theme-nav #mobileMenu {
          background: rgba(255,255,255,0.88);
        }
      }

      @media (max-width: 767px) {
        :root { --fixed-nav-height: 74px; }
        body { padding-top: var(--fixed-nav-height); }
        .theme-nav {
          background:
            linear-gradient(135deg, rgba(255,255,255,0.58), rgba(255,255,255,0.28)),
            rgba(255,255,255,0.34);
          border-bottom-color: rgba(255,255,255,0.44);
          box-shadow:
            0 16px 52px -46px rgba(0,65,74,0.22),
            0 1px 0 rgba(255,255,255,0.60) inset;
          backdrop-filter: blur(32px) saturate(172%) brightness(1.04);
          -webkit-backdrop-filter: blur(32px) saturate(172%) brightness(1.04);
        }
        .theme-nav > div:first-child {
          min-height: var(--fixed-nav-height);
        }
      }
      .route-icon,
      .section-kicker-icon,
      .inline-feature-icon,
      .service-main-icon,
      .sub-service-icon {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        flex: 0 0 auto;
        color: var(--gold);
        background: transparent !important;
        border: 0 !important;
        box-shadow: none !important;
        outline: 0 !important;
      }
      .route-link .route-icon { opacity: .72; transition: opacity .25s ease, transform .25s ease; }
      .route-link:hover .route-icon,
      .route-link.is-active .route-icon { opacity: 1; transform: translateY(-1px); }
      .mobile-route .route-icon { color: currentColor; opacity: .82; }
      .footer-route-icon { color: #2CDE85; opacity: .76; }
      .iconized-action > svg:first-child { color: var(--gold); }
      .iconized-feature { position: relative; }
      .iconized-feature > .inline-feature-icon { margin-inline-end: .38rem; transform: translateY(.045em); }
      .route-icon svg,
      .footer-route-icon svg,
      .section-kicker-icon svg,
      .inline-feature-icon svg,
      .service-main-icon svg,
      .sub-service-icon svg,
      .iconized-action > svg:first-child {
        width: 1em !important;
        height: 1em !important;
      }
      .route-icon { font-size: .88em; transform: translateY(.025em); }
      .footer-route-icon { font-size: .88em; transform: translateY(.025em); }
      .section-kicker-icon { font-size: .88em; transform: translateY(.015em); }
      .inline-feature-icon { font-size: .82em; }
      .service-main-icon { font-size: 1.04em; transform: translateY(.04em); }
      .sub-service-icon { font-size: .88em; transform: translateY(.13em); }
      .iconized-action > svg:first-child { flex: 0 0 auto; width: .95em !important; height: .95em !important; transform: translateY(.035em); }

      .brand-diamond {
        min-width: 3.25rem;
        min-height: 3.25rem;
        font-size: 1.9rem !important;
        line-height: 1;
      }
      .brand-diamond > span {
        font-size: 1.08rem !important;
      }
      .footer-brand-mark {
        min-width: 3rem;
        min-height: 3rem;
        font-size: 1.85rem !important;
        line-height: 1;
      }
      .route-icon { font-size: 1.1em; }
      .footer-route-icon { font-size: 1.22em; }
      #pageRoot h1.theme-title { font-size: clamp(2.35rem, 5.2vw, 4.45rem) !important; letter-spacing: -0.015em; }
      #pageRoot h1.theme-title.text-5xl { font-size: clamp(2.18rem, 4.35vw, 3.55rem) !important; }
      #pageRoot h1.theme-title.text-6xl { font-size: clamp(2.32rem, 4.8vw, 4rem) !important; }
      #pageRoot h1.theme-title.text-7xl { font-size: clamp(2.6rem, 5.6vw, 4.9rem) !important; }
      #pageRoot h2.theme-title { font-size: clamp(1.42rem, 2.18vw, 2.05rem) !important; letter-spacing: -0.01em; }
      #pageRoot h2.theme-title.text-2xl { font-size: clamp(1.16rem, 1.48vw, 1.34rem) !important; }
      #pageRoot h2.theme-title.text-3xl { font-size: clamp(1.32rem, 1.82vw, 1.68rem) !important; }
      #pageRoot h2.theme-title.text-4xl { font-size: clamp(1.52rem, 2.25vw, 1.98rem) !important; }
      #pageRoot h2.theme-title.text-5xl { font-size: clamp(1.72rem, 2.7vw, 2.28rem) !important; }
      #pageRoot h3.theme-title { font-size: clamp(1.05rem, 1.5vw, 1.34rem) !important; line-height: 1.45 !important; }
      #pageRoot h3.theme-title.text-xl { font-size: clamp(1rem, 1.26vw, 1.14rem) !important; }
      #pageRoot h3.theme-title.text-2xl { font-size: clamp(1.15rem, 1.6vw, 1.38rem) !important; }
      #pageRoot h3.theme-title.text-3xl { font-size: clamp(1.28rem, 1.95vw, 1.72rem) !important; }
      #pageRoot p { text-wrap: pretty; }
      .service-cluster {
        position: relative;
        padding-block: 1.5rem;
      }
      .service-cluster:first-child { padding-top: 0; }
      .service-heading {
        display: flex;
        align-items: center;
        gap: .72rem;
      }
      .service-main-icon {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        flex: 0 0 auto;
        color: var(--gold);
        background: transparent !important;
        border: 0 !important;
        box-shadow: none !important;
        width: auto !important;
        height: auto !important;
        font-size: 1.04em;
      }
      .service-main-icon svg { width: 1em !important; height: 1em !important; }
      .sub-service-list {
        display: grid;
        gap: .62rem;
        margin-top: 1.12rem;
      }
      .sub-service-item {
        display: flex;
        align-items: flex-start;
        gap: .55rem;
        color: var(--text-muted);
        font-size: .86rem;
        line-height: 1.9;
      }
      .sub-service-icon {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        flex: 0 0 auto;
        margin-top: .42em;
        color: var(--gold);
        font-size: .92em;
      }
      .companies-list-clean > article + article {
        padding-top: 4rem;
      }
      .companies-list-clean > article {
        padding-bottom: 4rem;
      }
      .companies-list-clean > article:last-child { padding-bottom: 0; }
      .theme-border { border-color: var(--border); }
      .theme-border-strong { border-color: var(--border-strong); }
      .theme-surface { background: var(--surface); border-color: var(--border); box-shadow: var(--shadow); }
      .theme-surface-strong { background: var(--surface-strong); border-color: var(--border-strong); }
      .theme-surface-muted { background: var(--surface-muted); border-color: var(--border); }
      .theme-footer { background: var(--footer-bg); color: var(--text); }
      .theme-field { background: var(--field-bg); border-color: var(--field-border); color: var(--text); }
      .theme-field::placeholder { color: var(--placeholder); }
      .theme-field:focus { outline: none; border-color: var(--gold); box-shadow: 0 0 0 4px var(--gold-soft); }
      .theme-button-primary { background: var(--gold); color: var(--inverse); }
      .theme-button-primary:hover { filter: brightness(1.06); transform: translateY(-1px); }
      .theme-button-secondary { border-color: var(--border-strong); color: var(--text); background: transparent; }
      .theme-button-secondary:hover { border-color: var(--gold); color: var(--gold); transform: translateY(-1px); }


      /*
        ============================================================
        SOFTER PREMIUM BUTTON RADIUS
        ============================================================
        Makes every interactive button feel more rounded and refined
        without changing the layout or content.
      */
      :root {
        --premium-button-radius: 999px;
        --premium-button-radius-soft: 1.35rem;
      }

      .theme-button-primary,
      .theme-button-secondary,
      .iconized-action,
      button[data-route],
      a[data-route],
      button[type="submit"],
      #mobileMenuButton {
        border-radius: var(--premium-button-radius) !important;
      }

      .theme-button-primary,
      .theme-button-secondary,
      button[type="submit"] {
        overflow: hidden;
        box-shadow: 0 16px 42px -34px rgba(0, 65, 74, 0.38);
      }

      .theme-button-primary:hover,
      .theme-button-secondary:hover,
      button[type="submit"]:hover {
        box-shadow: 0 20px 52px -34px rgba(0, 65, 74, 0.44);
      }

      .hairline-list button[data-route],
      footer button[data-route],
      footer #footerNav a,
      .mobile-route {
        border-radius: var(--premium-button-radius-soft) !important;
      }

      .hairline-list button[data-route] {
        padding-inline: 1.1rem;
      }

      footer button[data-route],
      footer #footerNav a {
        padding: .48rem .72rem;
      }

      .mobile-route {
        padding-inline: .9rem;
      }

      .premium-line {
        display: block;
        width: 100%;
        height: 1px;
        min-height: 1px;
        border: 0 !important;
        background: linear-gradient(90deg, transparent, var(--gold), transparent);
        margin: clamp(1.25rem, 2.4vw, 1.9rem) 0;
        flex: 0 0 auto;
        grid-column: 1 / -1;
      }
      .premium-line:first-child { margin-top: 0; }
      .premium-line:last-child { margin-bottom: 0; }
      .route-link { color: var(--text-soft); position: relative; }
      .route-link::after { content: ''; position: absolute; right: 0; bottom: -10px; width: 0; height: 1px; background: var(--gold); transition: width .25s ease; }
      .route-link:hover, .route-link.is-active { color: var(--title); }
      .route-link:hover::after, .route-link.is-active::after { width: 100%; }
      .mobile-route.is-active { color: var(--gold); }
      .brand-diamond { background: transparent; color: var(--gold); transform: none; }
      .brand-diamond > span { transform: none; }
      .visual-placeholder {
        position: relative;
        overflow: hidden;
        border: 1px solid var(--border-strong);
        background: var(--visualA);
        box-shadow: var(--glow);
      }
      .visual-placeholder::before {
        content: '';
        position: absolute;
        inset: 0;
        opacity: .24;
        background-image:
          linear-gradient(115deg, transparent 0 38%, rgba(255,255,255,.32) 39%, transparent 41%),
          repeating-linear-gradient(90deg, rgba(255,255,255,.18) 0 1px, transparent 1px 18px);
        transform: translateX(12%);
      }
      .visual-placeholder::after { content: none !important; display: none !important; }
      .visual-placeholder.has-image {
        background: #E8FBF2;
        isolation: isolate;
      }
      .visual-placeholder.has-image img {
        position: absolute;
        inset: 0;
        z-index: 0;
        width: 100%;
        height: 100%;
        object-fit: cover;
        transform: scale(1.001);
        transition: transform .9s ease, filter .9s ease;
      }
      .visual-placeholder.has-image:hover img { transform: scale(1.035); }
      .visual-placeholder.has-image::before {
        z-index: 1;
        opacity: .38;
        background-image:
          linear-gradient(180deg, rgba(255,255,255,.02), rgba(0,65,74,.10)),
          linear-gradient(115deg, transparent 0 42%, rgba(255,255,255,.28) 43%, transparent 45%);
        transform: none;
      }
      .visual-placeholder.has-image::after { content: none !important; display: none !important; }
      .visual-arch {
        background: var(--visualA);
        border-radius: 48% 48% 2rem 2rem / 24% 24% 2rem 2rem;
        clip-path: none !important;
      }

      .premium-slider {
        position: relative;
      }
      .premium-slider-frame {
        position: relative;
        min-height: clamp(340px, 48vw, 600px);
        overflow: hidden;
        border-block: 1px solid var(--border-strong);
        background:
          radial-gradient(circle at 22% 12%, var(--gold-soft), transparent 28%),
          radial-gradient(circle at 74% 84%, var(--green-soft), transparent 30%),
          linear-gradient(135deg, rgba(255,255,255,0.90), rgba(44,222,133,0.13), rgba(0,65,74,0.045));
        box-shadow: var(--shadow), var(--glow);
        isolation: isolate;
      }
      .premium-slider-frame::before {
        content: '';
        position: absolute;
        inset: 1.1rem;
        z-index: 8;
        pointer-events: none;
        border: 1px solid rgba(0,65,74,0.12);
      }
      .premium-slider-frame::after {
        content: '';
        position: absolute;
        inset-inline: 0;
        bottom: 0;
        z-index: 7;
        height: 38%;
        pointer-events: none;
        background: linear-gradient(180deg, transparent, rgba(255,255,255,0.30));
      }
      .premium-slider-track {
        position: absolute;
        inset: 0;
        perspective: 1400px;
      }
      .premium-slide {
        position: absolute;
        top: clamp(1rem, 2vw, 1.45rem);
        bottom: clamp(1rem, 2vw, 1.45rem);
        right: 50%;
        width: 38%;
        opacity: 0;
        transform: translateX(50%) scale(.84) rotateY(-6deg);
        transform-origin: center;
        transition:
          right 920ms cubic-bezier(.19,1,.22,1),
          width 920ms cubic-bezier(.19,1,.22,1),
          opacity 680ms cubic-bezier(.22,.61,.36,1),
          transform 980ms cubic-bezier(.19,1,.22,1),
          filter 760ms cubic-bezier(.22,.61,.36,1);
        filter: saturate(.72) contrast(.92) brightness(.74);
        pointer-events: none;
        z-index: 1;
      }
      .premium-slide.is-active {
        right: 27%;
        width: 46%;
        opacity: 1;
        transform: translateX(0) scale(1) rotateY(0deg);
        filter: saturate(1.05) contrast(1.03) brightness(1);
        pointer-events: auto;
        z-index: 6;
      }
      .premium-slide.is-prev {
        right: 0;
        width: 30%;
        opacity: .66;
        transform: translateX(0) scale(.92) rotateY(-4deg);
        z-index: 4;
      }
      .premium-slide.is-next {
        right: 70%;
        width: 30%;
        opacity: .66;
        transform: translateX(0) scale(.92) rotateY(4deg);
        z-index: 4;
      }
      .premium-slide.is-far-prev {
        right: -17%;
        width: 26%;
        opacity: .22;
        transform: translateX(0) scale(.82) rotateY(-7deg);
        z-index: 2;
      }
      .premium-slide.is-far-next {
        right: 91%;
        width: 26%;
        opacity: .22;
        transform: translateX(0) scale(.82) rotateY(7deg);
        z-index: 2;
      }
      .premium-slide .visual-placeholder {
        height: 100%;
        width: 100%;
        border: 1px solid rgba(0,65,74,.16);
        box-shadow: none;
        border-radius: 48% 48% 2rem 2rem / 24% 24% 2rem 2rem;
        clip-path: none !important;
      }
      .premium-slide .visual-placeholder::before {
        opacity: .30;
      }
      .premium-slide.is-active .visual-placeholder::before {
        opacity: .18;
      }
      .premium-slider-progress { display: none !important;
        position: absolute;
        inset-inline: 0;
        bottom: 0;
        z-index: 12;
        height: 2px;
        background: rgba(255,255,255,0.16);
      }
      .premium-slider-progress > span {
        display: block;
        height: 100%;
        width: var(--slider-progress, 25%);
        background: var(--gold);
        transition: width 420ms ease;
      }
      .premium-slider-arrow {
        position: absolute;
        top: 50%;
        z-index: 15;
        display: inline-flex;
        height: 3.25rem;
        width: 3.25rem;
        transform: translateY(-50%);
        align-items: center;
        justify-content: center;
        border: 0;
        background: transparent;
        color: var(--title);
        transition: transform 220ms ease, color 220ms ease, opacity 220ms ease;
      }
      .premium-slider-arrow:hover {
        color: var(--gold);
        opacity: .88;
      }
      .premium-slider-arrow:focus-visible {
        outline: 2px solid var(--gold);
        outline-offset: 3px;
      }
      .premium-slider-arrow[data-slider-prev] { right: 1.25rem; }
      .premium-slider-arrow[data-slider-next] { left: 1.25rem; }
      .premium-slider-dot {
        height: .55rem;
        width: .55rem;
        border: 1px solid var(--border-strong);
        background: transparent;
        transition: width 260ms ease, background 260ms ease, border-color 260ms ease, opacity 260ms ease;
      }
      .premium-slider-dot.is-active {
        width: 2.1rem;
        border-color: var(--gold);
        background: var(--gold);
      }
      .premium-slider-meta { display: none !important;
        padding-bottom: 1.25rem;
      }
      .premium-slider [data-slider-dots] { min-height: 1.5rem; }
      .premium-reveal {
        opacity: 0;
        transform: translateY(34px) scale(.985);
        filter: blur(10px);
        transition:
          opacity 820ms cubic-bezier(.22,.61,.36,1),
          transform 980ms cubic-bezier(.19,1,.22,1),
          filter 980ms cubic-bezier(.19,1,.22,1);
        transition-delay: var(--reveal-delay, 0ms);
        will-change: opacity, transform, filter;
      }
      @media (max-width: 767px) {
  .premium-reveal {
    opacity: 1 !important;
    transform: none !important;
    filter: none !important;
    transition: none !important;
  }
}
      .premium-reveal.is-visible {
        opacity: 1;
        transform: translateY(0) scale(1);
        filter: blur(0);
      }
      .premium-reveal::selection { background: var(--gold); color: var(--inverse); }
      @media (max-width: 760px) {
        .premium-slider-frame {
          min-height: clamp(310px, 88vw, 470px);
        }
        .premium-slide.is-active {
          right: 13%;
          width: 74%;
        }
        .premium-slide.is-prev {
          right: -24%;
          width: 44%;
          opacity: .38;
        }
        .premium-slide.is-next {
          right: 80%;
          width: 44%;
          opacity: .38;
        }
        .premium-slide.is-far-prev,
        .premium-slide.is-far-next {
          opacity: 0;
        }
      }
      @media (max-width: 640px) {
        .premium-slider-arrow {
          top: auto;
          bottom: 1rem;
          height: 2.75rem;
          width: 2.75rem;
          transform: none;
        }
        .premium-slider-arrow[data-slider-prev] { right: 1rem; }
        .premium-slider-arrow[data-slider-next] { left: 1rem; }
      }
      .hairline-list > * + * { }
      .page-enter { animation: pageEnter .42s ease both; }
      @keyframes pageEnter { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }


      /*
        ============================================================
        MOBILE VIEWPORT HARDENING
        ============================================================
        These rules prevent any section, slider, image, button, or long text
        from expanding the mobile viewport and creating white horizontal gutters.
      */
      html,
      body {
        width: 100%;
        max-width: 100%;
        overflow-x: clip;
      }

      @supports not (overflow: clip) {
        html,
        body {
          overflow-x: hidden;
        }
      }

      *,
      *::before,
      *::after {
        box-sizing: border-box;
      }

      body,
      header,
      footer,
      main,
      nav,
      section,
      article,
      aside,
      figure,
      form,
      fieldset,
      .theme-nav,
      .theme-footer,
      #pageRoot {
        min-width: 0;
        max-width: 100%;
      }

      #pageRoot,
      #pageRoot *,
      #desktopNav,
      #mobileNav,
      #footerNav,
      #desktopNav *,
      #mobileNav *,
      #footerNav * {
        min-width: 0;
      }

      #pageRoot {
        overflow-x: clip;
      }

      @supports not (overflow: clip) {
        #pageRoot {
          overflow-x: hidden;
        }
      }

      #pageRoot p,
      #pageRoot h1,
      #pageRoot h2,
      #pageRoot h3,
      #pageRoot h4,
      #pageRoot h5,
      #pageRoot h6,
      #pageRoot span,
      #pageRoot a,
      #pageRoot button,
      #pageRoot li,
      #pageRoot figcaption,
      footer p,
      footer a,
      footer button,
      header a,
      header button {
        overflow-wrap: anywhere;
        word-break: normal;
      }

      img,
      picture,
      video,
      canvas,
      iframe,
      svg {
        max-width: 100%;
      }

      img,
      picture,
      video,
      canvas,
      iframe {
        display: block;
      }

      input,
      textarea,
      select,
      button,
      a {
        max-width: 100%;
      }

      .theme-button-primary,
      .theme-button-secondary,
      .iconized-action,
      button[data-route],
      a[data-route] {
        white-space: normal;
        text-align: center;
      }

      .visual-placeholder,
      .visual-placeholder.has-image,
      .premium-slider,
      .premium-slider-frame,
      .premium-slider-track {
        max-width: 100%;
        min-width: 0;
      }

      .premium-slider,
      .premium-slider-frame {
        overflow-x: clip;
      }

      @supports not (overflow: clip) {
        .premium-slider,
        .premium-slider-frame {
          overflow-x: hidden;
        }
      }

      .premium-slider [data-slider-dots] {
        display: flex;
        flex-wrap: wrap;
        max-width: 100%;
        min-width: 0;
        overflow: hidden;
      }

      @media (max-width: 767px) {
        body {
          position: relative;
        }

        .theme-nav,
        .theme-footer,
        header,
        footer {
          width: 100%;
          max-width: 100vw;
          overflow-x: clip;
        }

        @supports not (overflow: clip) {
          .theme-nav,
          .theme-footer,
          header,
          footer {
            overflow-x: hidden;
          }
        }

        header .max-w-7xl,
        footer .max-w-7xl,
        #pageRoot {
          width: 100%;
          max-width: 100%;
          padding-left: clamp(1rem, 4vw, 1.25rem) !important;
          padding-right: clamp(1rem, 4vw, 1.25rem) !important;
        }

        header a[data-route='home'] {
          min-width: 0;
          max-width: calc(100vw - 5.5rem);
        }

        header a[data-route='home'] > span:last-child {
          min-width: 0;
          overflow: hidden;
        }

        header a[data-route='home'] > span:last-child span {
          overflow: hidden;
          text-overflow: ellipsis;
          white-space: nowrap;
        }

        .brand-diamond,
        .footer-brand-mark {
          flex: 0 0 auto;
        }

        #pageRoot .grid,
        #pageRoot .flex,
        footer .grid,
        footer .flex,
        header .flex {
          min-width: 0;
          max-width: 100%;
        }

        #pageRoot [class*='grid-cols'],
        footer [class*='grid-cols'] {
          min-width: 0;
        }

        #pageRoot section,
        #pageRoot article,
        #pageRoot figure,
        #pageRoot form,
        #pageRoot .visual-placeholder {
          min-width: 0;
          max-width: 100%;
        }

        #pageRoot h1.theme-title {
          font-size: clamp(2.05rem, 10vw, 3.08rem) !important;
          line-height: 1.22 !important;
        }

        #pageRoot h2.theme-title,
        #pageRoot h2.theme-title.text-4xl,
        #pageRoot h2.theme-title.text-5xl {
          font-size: clamp(1.46rem, 7vw, 2.1rem) !important;
          line-height: 1.38 !important;
        }

        #pageRoot h3.theme-title,
        #pageRoot h3.theme-title.text-2xl,
        #pageRoot h3.theme-title.text-3xl {
          font-size: clamp(1.08rem, 5.2vw, 1.45rem) !important;
          line-height: 1.5 !important;
        }

        .premium-slider,
        .premium-slider-frame,
        .premium-slider-track {
          width: 100%;
          max-width: 100%;
          min-width: 0;
          overflow: hidden !important;
        }

        .premium-slider-frame {
          min-height: clamp(300px, 92vw, 460px) !important;
          border-inline: 1px solid var(--border-strong);
        }

        .premium-slider-frame::before {
          inset: .75rem;
        }

        .premium-slide {
          top: .85rem !important;
          bottom: .85rem !important;
          right: 50% !important;
          left: auto !important;
          width: min(86%, 430px) !important;
          max-width: calc(100% - 2rem) !important;
          opacity: 0 !important;
          transform: translateX(50%) scale(.94) !important;
          filter: saturate(.92) contrast(.98) brightness(.92) !important;
          pointer-events: none !important;
        }

        .premium-slide.is-active {
          right: 50% !important;
          left: auto !important;
          width: min(88%, 440px) !important;
          max-width: calc(100% - 2rem) !important;
          opacity: 1 !important;
          transform: translateX(50%) scale(1) !important;
          filter: saturate(1.04) contrast(1.02) brightness(1) !important;
          pointer-events: auto !important;
        }

        .premium-slide.is-prev,
        .premium-slide.is-next,
        .premium-slide.is-far-prev,
        .premium-slide.is-far-next {
          opacity: 0 !important;
          pointer-events: none !important;
          transform: translateX(50%) scale(.92) !important;
        }

        .premium-slider [data-slider-dots] {
          display: none !important;
        }

        .premium-slider-arrow {
          top: auto !important;
          bottom: .9rem !important;
          width: 2.65rem !important;
          height: 2.65rem !important;
          transform: none !important;
          background: rgba(255,255,255,.72) !important;
          border: 1px solid var(--border) !important;
          border-radius: 999px !important;
          backdrop-filter: blur(12px);
        }

        .premium-slider-arrow[data-slider-prev] {
          right: .85rem !important;
        }

        .premium-slider-arrow[data-slider-next] {
          left: .85rem !important;
        }

        .theme-button-primary,
        .theme-button-secondary {
          width: 100%;
          justify-content: center;
        }

        .visual-placeholder.has-image img {
          max-width: none;
        }

        .premium-line {
          max-width: 100%;
          overflow: hidden;
        }
      }

      @media (prefers-reduced-motion: reduce) {
        *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; scroll-behavior: auto !important; transition-duration: .01ms !important; }
        .premium-reveal { opacity: 1 !important; transform: none !important; filter: none !important; }
      }

/* Replacements for former inline style attributes. */
.egymix-body {
  font-family: 'Almarai', sans-serif;
}

.egymix-noscript-main {
  max-width: 1100px;
  margin: 2rem auto;
  padding: 1.5rem;
  line-height: 2;
  font-family: 'Almarai', Arial, sans-serif;
  direction: rtl;
  text-align: right;
  color: #07343B;
  background: #F8FFFC;
  border: 1px solid rgba(0, 65, 74, .18);
  border-radius: 1.5rem;
}

.egymix-seo-static {
  padding: 3rem 0;
  line-height: 2;
}

.egymix-seo-title {
  font-size: clamp(2rem, 5vw, 4rem);
  font-weight: 800;
  line-height: 1.35;
}

.egymix-seo-panel {
  max-width: 860px;
  margin-top: 1.25rem;
  font-size: 1.05rem;
}

.egymix-seo-links {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  margin-top: 1.5rem;
}

/* Slider and process-control overrides extracted from former inline style blocks. */
/*
      Borderless, ultra-smooth image slider polish.
      This override intentionally sits after the runtime theme style tag so it
      wins over the base slider rules and all mobile hardening overrides.
    */
    :root {
      --slider-smooth-ease: cubic-bezier(0.2, 0.95, 0.24, 1);
      --slider-opacity-ease: cubic-bezier(0.25, 0.8, 0.25, 1);
    }

    .premium-slider {
      isolation: isolate;
      transform: translateZ(0);
    }

    .premium-slider-frame {
      border: 0 !important;
      border-block: 0 !important;
      border-inline: 0 !important;
      outline: 0 !important;
      background: transparent !important;
      box-shadow: none !important;
      overflow: hidden !important;
      transform: translateZ(0);
      backface-visibility: hidden;
    }

    .premium-slider-frame::before,
    .premium-slider-frame::after {
      content: none !important;
      display: none !important;
      border: 0 !important;
      background: none !important;
      box-shadow: none !important;
    }

    .premium-slider-track {
      overflow: hidden !important;
      perspective: 1600px;
      transform: translateZ(0);
      transform-style: preserve-3d;
      backface-visibility: hidden;
      will-change: transform;
      contain: layout paint;
    }

    .premium-slide {
      right: 50% !important;
      left: auto !important;
      width: clamp(260px, 42%, 560px) !important;
      max-width: calc(100% - 2rem) !important;
      opacity: 0 !important;
      transform: translate3d(50%, 0, 0) scale(0.82) !important;
      transform-origin: center center !important;
      transition:
        transform 620ms var(--slider-smooth-ease),
        opacity 420ms var(--slider-opacity-ease),
        filter 620ms var(--slider-smooth-ease) !important;
      will-change: transform, opacity, filter;
      backface-visibility: hidden;
      transform-style: preserve-3d;
    }

    .premium-slide.is-active {
      right: 50% !important;
      width: clamp(280px, 46%, 620px) !important;
      max-width: calc(100% - 2rem) !important;
      opacity: 1 !important;
      transform: translate3d(50%, 0, 0) scale(1) !important;
      filter: saturate(1.05) contrast(1.03) brightness(1) !important;
      pointer-events: auto !important;
    }

    .premium-slide.is-prev {
      right: 50% !important;
      width: clamp(240px, 36%, 500px) !important;
      max-width: calc(100% - 2rem) !important;
      opacity: 0.64 !important;
      transform: translate3d(142%, 0, 0) scale(0.9) !important;
      filter: saturate(0.82) contrast(0.96) brightness(0.86) !important;
      pointer-events: none !important;
    }

    .premium-slide.is-next {
      right: 50% !important;
      width: clamp(240px, 36%, 500px) !important;
      max-width: calc(100% - 2rem) !important;
      opacity: 0.64 !important;
      transform: translate3d(-42%, 0, 0) scale(0.9) !important;
      filter: saturate(0.82) contrast(0.96) brightness(0.86) !important;
      pointer-events: none !important;
    }

    .premium-slide.is-far-prev {
      right: 50% !important;
      width: clamp(220px, 32%, 460px) !important;
      max-width: calc(100% - 2rem) !important;
      opacity: 0.18 !important;
      transform: translate3d(206%, 0, 0) scale(0.78) !important;
      filter: saturate(0.7) contrast(0.92) brightness(0.76) !important;
      pointer-events: none !important;
    }

    .premium-slide.is-far-next {
      right: 50% !important;
      width: clamp(220px, 32%, 460px) !important;
      max-width: calc(100% - 2rem) !important;
      opacity: 0.18 !important;
      transform: translate3d(-106%, 0, 0) scale(0.78) !important;
      filter: saturate(0.7) contrast(0.92) brightness(0.76) !important;
      pointer-events: none !important;
    }

    .premium-slide .visual-placeholder,
    .premium-slide .visual-placeholder.has-image {
      border: 0 !important;
      outline: 0 !important;
      box-shadow: none !important;
      background: transparent !important;
      overflow: hidden !important;
      transform: translateZ(0);
      backface-visibility: hidden;
    }

    .premium-slide .visual-placeholder::before,
    .premium-slide .visual-placeholder::after {
      content: none !important;
      display: none !important;
      border: 0 !important;
      background: none !important;
      box-shadow: none !important;
    }

    .premium-slide .visual-placeholder.has-image img {
      transform: translateZ(0) scale(1.002);
      transition: transform 760ms var(--slider-smooth-ease), filter 760ms var(--slider-smooth-ease) !important;
      will-change: transform, filter;
      backface-visibility: hidden;
    }

    .premium-slide.is-active .visual-placeholder.has-image img {
      transform: translateZ(0) scale(1.012);
    }

    .premium-slider-arrow {
      border: 0 !important;
      outline: 0 !important;
      background: transparent !important;
      box-shadow: none !important;
      backdrop-filter: none !important;
      -webkit-backdrop-filter: none !important;
    }

    @media (max-width: 767px) {
      .premium-slide,
      .premium-slide.is-active,
      .premium-slide.is-prev,
      .premium-slide.is-next,
      .premium-slide.is-far-prev,
      .premium-slide.is-far-next {
        right: 50% !important;
        left: auto !important;
        width: min(88%, 440px) !important;
        max-width: calc(100% - 2rem) !important;
      }

      .premium-slide {
        transform: translate3d(50%, 0, 0) scale(0.94) !important;
      }

      .premium-slide.is-active {
        opacity: 1 !important;
        transform: translate3d(50%, 0, 0) scale(1) !important;
      }

      .premium-slide.is-prev {
        opacity: 0 !important;
        transform: translate3d(118%, 0, 0) scale(0.92) !important;
      }

      .premium-slide.is-next {
        opacity: 0 !important;
        transform: translate3d(-18%, 0, 0) scale(0.92) !important;
      }

      .premium-slide.is-far-prev,
      .premium-slide.is-far-next {
        opacity: 0 !important;
      }
    }

    @media (prefers-reduced-motion: reduce) {
      .premium-slide,
      .premium-slide .visual-placeholder.has-image img {
        transition: none !important;
      }
    }

/*
      Pure autoplay sliders: remove all visible slider process/control blocks
      across every gallery while preserving automatic image movement.
    */
    .premium-slider-arrow,
    .premium-slider-progress,
    .premium-slider-meta,
    .premium-slider [data-slider-dots],
    .premium-slider-dot {
      display: none !important;
      visibility: hidden !important;
      opacity: 0 !important;
      pointer-events: none !important;
      width: 0 !important;
      height: 0 !important;
      min-width: 0 !important;
      min-height: 0 !important;
      max-width: 0 !important;
      max-height: 0 !important;
      margin: 0 !important;
      padding: 0 !important;
      border: 0 !important;
      overflow: hidden !important;
    }

    .premium-slider {
      margin-bottom: 0 !important;
    }

.egymix-microdata { display: none; }

/* EGYMIX hero alignment and landmark fixes */
.egymix-noscript-main {
  display: block;
}

.egymix-hero-media {
  position: relative;
  min-height: 560px;
  width: 100%;
  max-width: 100%;
  overflow: visible;
  isolation: isolate;
}

.egymix-hero-primary,
.egymix-hero-secondary {
  position: absolute;
  display: block;
  margin: 0;
}

.egymix-hero-primary {
  top: 0;
  left: 0;
  width: 76%;
  height: 520px;
  z-index: 1;
}

.egymix-hero-secondary {
  right: 0;
  bottom: 0.5rem;
  width: 48%;
  height: 16rem;
  z-index: 2;
}

.egymix-hero-primary img,
.egymix-hero-secondary img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

@media (max-width: 767px) {
  .egymix-hero-media {
    min-height: 500px;
    overflow: hidden;
  }

  .egymix-hero-primary {
    top: 0;
    left: 50%;
    width: min(86%, 440px);
    height: 370px;
    transform: translateX(-50%);
  }

  .egymix-hero-secondary {
    right: 50%;
    bottom: 0;
    width: min(58%, 280px);
    height: 160px;
    transform: translateX(50%);
  }
}

/* ============================================================
   EGYMIX PERFORMANCE HELPERS
   These rules do not change website content; they reduce rendering work
   for below-the-fold areas and keep hero media stable during loading.
   ============================================================ */
img {
  height: auto;
}

.egymix-hero-primary,
.egymix-hero-secondary {
  contain: layout paint;
}

@supports (content-visibility: auto) {
  footer.theme-footer,
  #homeProjectsPreview,
  #homeCompanies,
  #homeClients {
    content-visibility: auto;
    contain-intrinsic-size: 1px 720px;
  }
}


/*
  ============================================================
  EGYMIX REAL LOGO ASSET
  ============================================================
  Uses the official logo at /images/site/egymix.png while preserving
  the existing header/footer layout and external-assets rule.
*/
.brand-diamond,
.footer-brand-mark {
  overflow: hidden;
  border-radius: 999px;
  background: transparent !important;
  color: inherit;
}

.brand-logo-img,
.footer-logo-img {
  display: block;
  width: 100%;
  height: 100%;
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
}

.brand-diamond {
  width: 3.25rem;
  height: 3.25rem;
  min-width: 3.25rem;
  min-height: 3.25rem;
}

.footer-brand-mark {
  width: 3rem;
  height: 3rem;
  min-width: 3rem;
  min-height: 3rem;
}

@media (max-width: 767px) {
  .brand-diamond {
    width: 3rem;
    height: 3rem;
    min-width: 3rem;
    min-height: 3rem;
  }

  .footer-brand-mark {
    width: 2.85rem;
    height: 2.85rem;
    min-width: 2.85rem;
    min-height: 2.85rem;
  }
}

/* ============================================================
   EGYMIX FOOTER SOCIAL LINKS
   ============================================================ */
.egymix-footer-social {
  max-width: 100%;
}

.egymix-social-links {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  flex-wrap: wrap;
}

.egymix-social-link {
  width: 2.75rem;
  height: 2.75rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  border: 1px solid var(--border-strong);
  color: var(--gold);
  background:
    linear-gradient(135deg, rgba(255,255,255,0.86), rgba(44,222,133,0.11)),
    var(--surface-strong);
  box-shadow:
    0 18px 48px -36px rgba(0,65,74,0.48),
    inset 0 1px 0 rgba(255,255,255,0.72);
  text-decoration: none;
  transition:
    transform 220ms ease,
    color 220ms ease,
    background 220ms ease,
    border-color 220ms ease,
    box-shadow 220ms ease,
    opacity 220ms ease;
}

.egymix-social-link:hover {
  color: var(--inverse);
  background: var(--gold);
  border-color: var(--gold);
  transform: translateY(-2px);
  box-shadow:
    0 22px 58px -34px rgba(0,65,74,0.54),
    0 0 34px rgba(44,222,133,0.20);
}


.egymix-social-link-whatsapp {
  color: var(--green);
  background:
    linear-gradient(135deg, rgba(255,255,255,0.88), rgba(44,222,133,0.15)),
    var(--surface-strong);
}

.egymix-social-link-whatsapp:hover {
  color: var(--inverse);
  background: var(--green);
  border-color: var(--green);
  box-shadow:
    0 22px 58px -34px rgba(0,65,74,0.54),
    0 0 34px rgba(44,222,133,0.24);
}

.egymix-social-link:focus-visible {
  outline: 2px solid var(--gold);
  outline-offset: 4px;
}

.egymix-social-icon {
  display: block;
  width: 1.12rem;
  height: 1.12rem;
  flex: 0 0 auto;
}

@media (max-width: 767px) {
  .egymix-social-link {
    width: 2.65rem;
    height: 2.65rem;
  }
}