/* ! tailwindcss v3.4.0 | MIT License | https://tailwindcss.com *//* 1. Prevent padding and border from affecting element width. (https://github.com/mozdevs/cssremedy/issues/4) 2. Allow adding a border to an element by just adding a border-width. (https://github.com/tailwindcss/tailwindcss/pull/116) */ *, ::before, ::after { box-sizing: border-box; /* 1 */ border-width: 0; /* 2 */ border-style: solid; /* 2 */ border-color: #e5e7eb; /* 2 */ } ::before, ::after { --tw-content: ''; } /* 1. Use a consistent sensible line-height in all browsers. 2. Prevent adjustments of font size after orientation changes in iOS. 3. Use a more readable tab size. 4. Use the user's configured `sans` font-family by default. 5. Use the user's configured `sans` font-feature-settings by default. 6. Use the user's configured `sans` font-variation-settings by default. 7. Disable tap highlights on iOS */ html, :host { line-height: 1.5; /* 1 */ -webkit-text-size-adjust: 100%; /* 2 */ -moz-tab-size: 4; /* 3 */ -o-tab-size: 4; tab-size: 4; /* 3 */ font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; /* 4 */ font-feature-settings: normal; /* 5 */ font-variation-settings: normal; /* 6 */ -webkit-tap-highlight-color: transparent; /* 7 */ } /* 1. Remove the margin in all browsers. 2. Inherit line-height from `html` so users can set them as a class directly on the `html` element. */ body { margin: 0; /* 1 */ line-height: inherit; /* 2 */ } /* 1. Add the correct height in Firefox. 2. Correct the inheritance of border color in Firefox. (https://bugzilla.mozilla.org/show_bug.cgi?id=190655) 3. Ensure horizontal rules are visible by default. */ hr { height: 0; /* 1 */ color: inherit; /* 2 */ border-top-width: 1px; /* 3 */ } /* Add the correct text decoration in Chrome, Edge, and Safari. */ abbr:where([title]) { -webkit-text-decoration: underline dotted; text-decoration: underline dotted; } /* Remove the default font size and weight for headings. */ h1, h2, h3, h4, h5, h6 { font-size: inherit; font-weight: inherit; } /* Reset links to optimize for opt-in styling instead of opt-out. */ a { color: inherit; text-decoration: inherit; } /* Add the correct font weight in Edge and Safari. */ b, strong { font-weight: bolder; } /* 1. Use the user's configured `mono` font-family by default. 2. Use the user's configured `mono` font-feature-settings by default. 3. Use the user's configured `mono` font-variation-settings by default. 4. Correct the odd `em` font sizing in all browsers. */ code, kbd, samp, pre { font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; /* 1 */ font-feature-settings: normal; /* 2 */ font-variation-settings: normal; /* 3 */ font-size: 1em; /* 4 */ } /* Add the correct font size in all browsers. */ small { font-size: 80%; } /* Prevent `sub` and `sup` elements from affecting the line height in all browsers. */ sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; } sub { bottom: -0.25em; } sup { top: -0.5em; } /* 1. Remove text indentation from table contents in Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=999088, https://bugs.webkit.org/show_bug.cgi?id=201297) 2. Correct table border color inheritance in all Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=935729, https://bugs.webkit.org/show_bug.cgi?id=195016) 3. Remove gaps between table borders by default. */ table { text-indent: 0; /* 1 */ border-color: inherit; /* 2 */ border-collapse: collapse; /* 3 */ } /* 1. Change the font styles in all browsers. 2. Remove the margin in Firefox and Safari. 3. Remove default padding in all browsers. */ button, input, optgroup, select, textarea { font-family: inherit; /* 1 */ font-feature-settings: inherit; /* 1 */ font-variation-settings: inherit; /* 1 */ font-size: 100%; /* 1 */ font-weight: inherit; /* 1 */ line-height: inherit; /* 1 */ color: inherit; /* 1 */ margin: 0; /* 2 */ padding: 0; /* 3 */ } /* Remove the inheritance of text transform in Edge and Firefox. */ button, select { text-transform: none; } /* 1. Correct the inability to style clickable types in iOS and Safari. 2. Remove default button styles. */ button, [type='button'], [type='reset'], [type='submit'] { -webkit-appearance: button; /* 1 */ background-color: transparent; /* 2 */ background-image: none; /* 2 */ } /* Use the modern Firefox focus style for all focusable elements. */ :-moz-focusring { outline: auto; } /* Remove the additional `:invalid` styles in Firefox. (https://github.com/mozilla/gecko-dev/blob/2f9eacd9d3d995c937b4251a5557d95d494c9be1/layout/style/res/forms.css#L728-L737) */ :-moz-ui-invalid { box-shadow: none; } /* Add the correct vertical alignment in Chrome and Firefox. */ progress { vertical-align: baseline; } /* Correct the cursor style of increment and decrement buttons in Safari. */ ::-webkit-inner-spin-button, ::-webkit-outer-spin-button { height: auto; } /* 1. Correct the odd appearance in Chrome and Safari. 2. Correct the outline style in Safari. */ [type='search'] { -webkit-appearance: textfield; /* 1 */ outline-offset: -2px; /* 2 */ } /* Remove the inner padding in Chrome and Safari on macOS. */ ::-webkit-search-decoration { -webkit-appearance: none; } /* 1. Correct the inability to style clickable types in iOS and Safari. 2. Change font properties to `inherit` in Safari. */ ::-webkit-file-upload-button { -webkit-appearance: button; /* 1 */ font: inherit; /* 2 */ } /* Add the correct display in Chrome and Safari. */ summary { display: list-item; } /* Removes the default spacing and border for appropriate elements. */ blockquote, dl, dd, h1, h2, h3, h4, h5, h6, hr, figure, p, pre { margin: 0; } fieldset { margin: 0; padding: 0; } legend { padding: 0; } ol, ul, menu { list-style: none; margin: 0; padding: 0; } /* Reset default styling for dialogs. */ dialog { padding: 0; } /* Prevent resizing textareas horizontally by default. */ textarea { resize: vertical; } /* 1. Reset the default placeholder opacity in Firefox. (https://github.com/tailwindlabs/tailwindcss/issues/3300) 2. Set the default placeholder color to the user's configured gray 400 color. */ input::-moz-placeholder, textarea::-moz-placeholder { opacity: 1; /* 1 */ color: #9ca3af; /* 2 */ } input::placeholder, textarea::placeholder { opacity: 1; /* 1 */ color: #9ca3af; /* 2 */ } /* Set the default cursor for buttons. */ button, [role="button"] { cursor: pointer; } /* Make sure disabled buttons don't get the pointer cursor. */ :disabled { cursor: default; } /* 1. Make replaced elements `display: block` by default. (https://github.com/mozdevs/cssremedy/issues/14) 2. Add `vertical-align: middle` to align replaced elements more sensibly by default. (https://github.com/jensimmons/cssremedy/issues/14#issuecomment-634934210) This can trigger a poorly considered lint error in some tools but is included by design. */ img, svg, video, canvas, audio, iframe, embed, object { display: block; /* 1 */ vertical-align: middle; /* 2 */ } /* Constrain images and videos to the parent width and preserve their intrinsic aspect ratio. (https://github.com/mozdevs/cssremedy/issues/14) */ img, video { max-width: 100%; height: auto; } /* Make elements with the HTML hidden attribute stay hidden by default */ [hidden] { display: none; } *, ::before, ::after{ --tw-border-spacing-x: 0; --tw-border-spacing-y: 0; --tw-translate-x: 0; --tw-translate-y: 0; --tw-rotate: 0; --tw-skew-x: 0; --tw-skew-y: 0; --tw-scale-x: 1; --tw-scale-y: 1; --tw-pan-x: ; --tw-pan-y: ; --tw-pinch-zoom: ; --tw-scroll-snap-strictness: proximity; --tw-gradient-from-position: ; --tw-gradient-via-position: ; --tw-gradient-to-position: ; --tw-ordinal: ; --tw-slashed-zero: ; --tw-numeric-figure: ; --tw-numeric-spacing: ; --tw-numeric-fraction: ; --tw-ring-inset: ; --tw-ring-offset-width: 0px; --tw-ring-offset-color: #fff; --tw-ring-color: rgb(59 130 246 / 0.5); --tw-ring-offset-shadow: 0 0 #0000; --tw-ring-shadow: 0 0 #0000; --tw-shadow: 0 0 #0000; --tw-shadow-colored: 0 0 #0000; --tw-blur: ; --tw-brightness: ; --tw-contrast: ; --tw-grayscale: ; --tw-hue-rotate: ; --tw-invert: ; --tw-saturate: ; --tw-sepia: ; --tw-drop-shadow: ; --tw-backdrop-blur: ; --tw-backdrop-brightness: ; --tw-backdrop-contrast: ; --tw-backdrop-grayscale: ; --tw-backdrop-hue-rotate: ; --tw-backdrop-invert: ; --tw-backdrop-opacity: ; --tw-backdrop-saturate: ; --tw-backdrop-sepia: } ::backdrop{ --tw-border-spacing-x: 0; --tw-border-spacing-y: 0; --tw-translate-x: 0; --tw-translate-y: 0; --tw-rotate: 0; --tw-skew-x: 0; --tw-skew-y: 0; --tw-scale-x: 1; --tw-scale-y: 1; --tw-pan-x: ; --tw-pan-y: ; --tw-pinch-zoom: ; --tw-scroll-snap-strictness: proximity; --tw-gradient-from-position: ; --tw-gradient-via-position: ; --tw-gradient-to-position: ; --tw-ordinal: ; --tw-slashed-zero: ; --tw-numeric-figure: ; --tw-numeric-spacing: ; --tw-numeric-fraction: ; --tw-ring-inset: ; --tw-ring-offset-width: 0px; --tw-ring-offset-color: #fff; --tw-ring-color: rgb(59 130 246 / 0.5); --tw-ring-offset-shadow: 0 0 #0000; --tw-ring-shadow: 0 0 #0000; --tw-shadow: 0 0 #0000; --tw-shadow-colored: 0 0 #0000; --tw-blur: ; --tw-brightness: ; --tw-contrast: ; --tw-grayscale: ; --tw-hue-rotate: ; --tw-invert: ; --tw-saturate: ; --tw-sepia: ; --tw-drop-shadow: ; --tw-backdrop-blur: ; --tw-backdrop-brightness: ; --tw-backdrop-contrast: ; --tw-backdrop-grayscale: ; --tw-backdrop-hue-rotate: ; --tw-backdrop-invert: ; --tw-backdrop-opacity: ; --tw-backdrop-saturate: ; --tw-backdrop-sepia: } .\!font-primary { font-family: "Inter" !important; } .font-primary { font-family: "Inter"; } .font-secondary { font-family: "STIX Two Text"; } .fluid-fs { --max-fs: var(--text-base); --min-fs: var(--text-base-min); --slope: calc( (var(--max-fs) - var(--min-fs)) / (var(--max-vw) - var(--min-vw)) ); --min-fs-px: calc(var(--min-fs) * 1px); --max-fs-px: calc(var(--max-fs) * 1px); --fs-px: calc(var(--slope) * (100vw - var(--min-vw-px)) + var(--min-fs-px)); font-size: clamp(var(--min-fs-px), var(--fs-px), var(--max-fs-px)) !important; } .display1 { --max-fs: var(--text-base); --min-fs: var(--text-base-min); --slope: calc( (var(--max-fs) - var(--min-fs)) / (var(--max-vw) - var(--min-vw)) ); --min-fs-px: calc(var(--min-fs) * 1px); --max-fs-px: calc(var(--max-fs) * 1px); --fs-px: calc(var(--slope) * (100vw - var(--min-vw-px)) + var(--min-fs-px)); font-size: clamp(var(--min-fs-px), var(--fs-px), var(--max-fs-px)); --max-fs: var(--text-d1); --min-fs: var(--text-d1-md); } @media screen and (min-width: 320px) { .display1 { --min-vw: 320; --min-vw-px: calc(var(--min-vw) * 1px); --max-vw: 1279; --max-vw-px: calc(var(--max-vw) * 1px); --max-fs: var(--text-d1-lg); --min-fs: var(--text-d1-md); } } @media screen and (min-width: 1280px) { .display1 { --min-vw: 1280; --min-vw-px: calc(var(--min-vw) * 1px); --max-vw: 1920; --max-vw-px: calc(var(--max-vw) * 1px); --max-fs: var(--text-d1); --min-fs: var(--text-d1-lg); } } .display1{ line-height: 100%; font-weight: 600} .heading1 { --max-fs: var(--text-base); --min-fs: var(--text-base-min); --slope: calc( (var(--max-fs) - var(--min-fs)) / (var(--max-vw) - var(--min-vw)) ); --min-fs-px: calc(var(--min-fs) * 1px); --max-fs-px: calc(var(--max-fs) * 1px); --fs-px: calc(var(--slope) * (100vw - var(--min-vw-px)) + var(--min-fs-px)); font-size: clamp(var(--min-fs-px), var(--fs-px), var(--max-fs-px)); --max-fs: var(--text-h1); --min-fs: var(--text-h1-md); } @media screen and (min-width: 320px) { .heading1 { --min-vw: 320; --min-vw-px: calc(var(--min-vw) * 1px); --max-vw: 1279; --max-vw-px: calc(var(--max-vw) * 1px); --max-fs: var(--text-h1-lg); --min-fs: var(--text-h1-md); } } @media screen and (min-width: 1280px) { .heading1 { --min-vw: 1280; --min-vw-px: calc(var(--min-vw) * 1px); --max-vw: 1920; --max-vw-px: calc(var(--max-vw) * 1px); --max-fs: var(--text-h1); --min-fs: var(--text-h1-lg); } } .heading1{ line-height: 120%; font-weight: 600} .heading2 { --max-fs: var(--text-base); --min-fs: var(--text-base-min); --slope: calc( (var(--max-fs) - var(--min-fs)) / (var(--max-vw) - var(--min-vw)) ); --min-fs-px: calc(var(--min-fs) * 1px); --max-fs-px: calc(var(--max-fs) * 1px); --fs-px: calc(var(--slope) * (100vw - var(--min-vw-px)) + var(--min-fs-px)); font-size: clamp(var(--min-fs-px), var(--fs-px), var(--max-fs-px)); --max-fs: var(--text-h2); --min-fs: var(--text-h2-md); } @media screen and (min-width: 320px) { .heading2 { --min-vw: 320; --min-vw-px: calc(var(--min-vw) * 1px); --max-vw: 1279; --max-vw-px: calc(var(--max-vw) * 1px); --max-fs: var(--text-h2-lg); --min-fs: var(--text-h2-md); } } @media screen and (min-width: 1280px) { .heading2 { --min-vw: 1280; --min-vw-px: calc(var(--min-vw) * 1px); --max-vw: 1920; --max-vw-px: calc(var(--max-vw) * 1px); --max-fs: var(--text-h2); --min-fs: var(--text-h2-lg); } } .heading2{ line-height: 120%; font-weight: 600} .heading3 { --max-fs: var(--text-base); --min-fs: var(--text-base-min); --slope: calc( (var(--max-fs) - var(--min-fs)) / (var(--max-vw) - var(--min-vw)) ); --min-fs-px: calc(var(--min-fs) * 1px); --max-fs-px: calc(var(--max-fs) * 1px); --fs-px: calc(var(--slope) * (100vw - var(--min-vw-px)) + var(--min-fs-px)); font-size: clamp(var(--min-fs-px), var(--fs-px), var(--max-fs-px)); --max-fs: var(--text-h3); --min-fs: var(--text-h3-md); } @media screen and (min-width: 320px) { .heading3 { --min-vw: 320; --min-vw-px: calc(var(--min-vw) * 1px); --max-vw: 1279; --max-vw-px: calc(var(--max-vw) * 1px); --max-fs: var(--text-h3-lg); --min-fs: var(--text-h3-md); } } @media screen and (min-width: 1280px) { .heading3 { --min-vw: 1280; --min-vw-px: calc(var(--min-vw) * 1px); --max-vw: 1920; --max-vw-px: calc(var(--max-vw) * 1px); --max-fs: var(--text-h3); --min-fs: var(--text-h3-lg); } } .heading3{ line-height: 120%; font-weight: 600} .heading4 { --max-fs: var(--text-base); --min-fs: var(--text-base-min); --slope: calc( (var(--max-fs) - var(--min-fs)) / (var(--max-vw) - var(--min-vw)) ); --min-fs-px: calc(var(--min-fs) * 1px); --max-fs-px: calc(var(--max-fs) * 1px); --fs-px: calc(var(--slope) * (100vw - var(--min-vw-px)) + var(--min-fs-px)); font-size: clamp(var(--min-fs-px), var(--fs-px), var(--max-fs-px)); --max-fs: var(--text-h4); --min-fs: var(--text-h4-md); } @media screen and (min-width: 320px) { .heading4 { --min-vw: 320; --min-vw-px: calc(var(--min-vw) * 1px); --max-vw: 1279; --max-vw-px: calc(var(--max-vw) * 1px); --max-fs: var(--text-h4-lg); --min-fs: var(--text-h4-md); } } @media screen and (min-width: 1280px) { .heading4 { --min-vw: 1280; --min-vw-px: calc(var(--min-vw) * 1px); --max-vw: 1920; --max-vw-px: calc(var(--max-vw) * 1px); --max-fs: var(--text-h4); --min-fs: var(--text-h4-lg); } } .heading4{ line-height: 120%; font-weight: 600} .heading5 { --max-fs: var(--text-base); --min-fs: var(--text-base-min); --slope: calc( (var(--max-fs) - var(--min-fs)) / (var(--max-vw) - var(--min-vw)) ); --min-fs-px: calc(var(--min-fs) * 1px); --max-fs-px: calc(var(--max-fs) * 1px); --fs-px: calc(var(--slope) * (100vw - var(--min-vw-px)) + var(--min-fs-px)); font-size: clamp(var(--min-fs-px), var(--fs-px), var(--max-fs-px)); --max-fs: var(--text-h5); --min-fs: var(--text-h5-md); } @media screen and (min-width: 320px) { .heading5 { --min-vw: 320; --min-vw-px: calc(var(--min-vw) * 1px); --max-vw: 1279; --max-vw-px: calc(var(--max-vw) * 1px); --max-fs: var(--text-h5-lg); --min-fs: var(--text-h5-md); } } @media screen and (min-width: 1280px) { .heading5 { --min-vw: 1280; --min-vw-px: calc(var(--min-vw) * 1px); --max-vw: 1920; --max-vw-px: calc(var(--max-vw) * 1px); --max-fs: var(--text-h5); --min-fs: var(--text-h5-lg); } } .heading5{ line-height: 120%; font-weight: 600} .heading6 { --max-fs: var(--text-base); --min-fs: var(--text-base-min); --slope: calc( (var(--max-fs) - var(--min-fs)) / (var(--max-vw) - var(--min-vw)) ); --min-fs-px: calc(var(--min-fs) * 1px); --max-fs-px: calc(var(--max-fs) * 1px); --fs-px: calc(var(--slope) * (100vw - var(--min-vw-px)) + var(--min-fs-px)); font-size: clamp(var(--min-fs-px), var(--fs-px), var(--max-fs-px)); --max-fs: var(--text-h6); --min-fs: var(--text-h6-md); } @media screen and (min-width: 320px) { .heading6 { --min-vw: 320; --min-vw-px: calc(var(--min-vw) * 1px); --max-vw: 1279; --max-vw-px: calc(var(--max-vw) * 1px); --max-fs: var(--text-h6-lg); --min-fs: var(--text-h6-md); } } @media screen and (min-width: 1280px) { .heading6 { --min-vw: 1280; --min-vw-px: calc(var(--min-vw) * 1px); --max-vw: 1920; --max-vw-px: calc(var(--max-vw) * 1px); --max-fs: var(--text-h6); --min-fs: var(--text-h6-lg); } } .heading6{ line-height: 120%; font-weight: 600} .text-body-lg { --max-fs: var(--text-base); --min-fs: var(--text-base-min); --slope: calc( (var(--max-fs) - var(--min-fs)) / (var(--max-vw) - var(--min-vw)) ); --min-fs-px: calc(var(--min-fs) * 1px); --max-fs-px: calc(var(--max-fs) * 1px); --fs-px: calc(var(--slope) * (100vw - var(--min-vw-px)) + var(--min-fs-px)); font-size: clamp(var(--min-fs-px), var(--fs-px), var(--max-fs-px)); --max-fs: var(--text-lg); --min-fs: var(--text-lg-md); } @media screen and (min-width: 320px) { .text-body-lg { --min-vw: 320; --min-vw-px: calc(var(--min-vw) * 1px); --max-vw: 1279; --max-vw-px: calc(var(--max-vw) * 1px); --max-fs: var(--text-lg-lg); --min-fs: var(--text-lg-md); } } @media screen and (min-width: 1280px) { .text-body-lg { --min-vw: 1280; --min-vw-px: calc(var(--min-vw) * 1px); --max-vw: 1920; --max-vw-px: calc(var(--max-vw) * 1px); --max-fs: var(--text-lg); --min-fs: var(--text-lg-lg); } } .text-body-lg{ line-height: 150%; font-weight: 400} .\!text-body-md { --max-fs: var(--text-base); --min-fs: var(--text-base-min); --slope: calc( (var(--max-fs) - var(--min-fs)) / (var(--max-vw) - var(--min-vw)) ); --min-fs-px: calc(var(--min-fs) * 1px); --max-fs-px: calc(var(--max-fs) * 1px); --fs-px: calc(var(--slope) * (100vw - var(--min-vw-px)) + var(--min-fs-px)); font-size: clamp(var(--min-fs-px), var(--fs-px), var(--max-fs-px)); } .text-body-md { --max-fs: var(--text-base); --min-fs: var(--text-base-min); --slope: calc( (var(--max-fs) - var(--min-fs)) / (var(--max-vw) - var(--min-vw)) ); --min-fs-px: calc(var(--min-fs) * 1px); --max-fs-px: calc(var(--max-fs) * 1px); --fs-px: calc(var(--slope) * (100vw - var(--min-vw-px)) + var(--min-fs-px)); font-size: clamp(var(--min-fs-px), var(--fs-px), var(--max-fs-px)); } .\!text-body-md { --max-fs: var(--text-md) !important; --min-fs: var(--text-md-md) !important; } .text-body-md { --max-fs: var(--text-md); --min-fs: var(--text-md-md); } @media screen and (min-width: 320px) { .\!text-body-md { --min-vw: 320 !important; --min-vw-px: calc(var(--min-vw) * 1px) !important; --max-vw: 1279 !important; --max-vw-px: calc(var(--max-vw) * 1px) !important; --max-fs: var(--text-md-lg) !important; --min-fs: var(--text-md-md) !important; } .text-body-md { --min-vw: 320; --min-vw-px: calc(var(--min-vw) * 1px); --max-vw: 1279; --max-vw-px: calc(var(--max-vw) * 1px); --max-fs: var(--text-md-lg); --min-fs: var(--text-md-md); } } @media screen and (min-width: 1280px) { .\!text-body-md { --min-vw: 1280 !important; --min-vw-px: calc(var(--min-vw) * 1px) !important; --max-vw: 1920 !important; --max-vw-px: calc(var(--max-vw) * 1px) !important; --max-fs: var(--text-md) !important; --min-fs: var(--text-md-lg) !important; } .text-body-md { --min-vw: 1280; --min-vw-px: calc(var(--min-vw) * 1px); --max-vw: 1920; --max-vw-px: calc(var(--max-vw) * 1px); --max-fs: var(--text-md); --min-fs: var(--text-md-lg); } } .\!text-body-md{ line-height: 150% !important; font-weight: 400 !important} .text-body-md{ line-height: 150%; font-weight: 400} .text-body-sm { --max-fs: var(--text-base); --min-fs: var(--text-base-min); --slope: calc( (var(--max-fs) - var(--min-fs)) / (var(--max-vw) - var(--min-vw)) ); --min-fs-px: calc(var(--min-fs) * 1px); --max-fs-px: calc(var(--max-fs) * 1px); --fs-px: calc(var(--slope) * (100vw - var(--min-vw-px)) + var(--min-fs-px)); font-size: clamp(var(--min-fs-px), var(--fs-px), var(--max-fs-px)); --max-fs: var(--text-sm); --min-fs: var(--text-sm-md); } @media screen and (min-width: 320px) { .text-body-sm { --min-vw: 320; --min-vw-px: calc(var(--min-vw) * 1px); --max-vw: 1279; --max-vw-px: calc(var(--max-vw) * 1px); --max-fs: var(--text-sm-lg); --min-fs: var(--text-sm-md); } } @media screen and (min-width: 1280px) { .text-body-sm { --min-vw: 1280; --min-vw-px: calc(var(--min-vw) * 1px); --max-vw: 1920; --max-vw-px: calc(var(--max-vw) * 1px); --max-fs: var(--text-sm); --min-fs: var(--text-sm-lg); } } .text-body-sm{ line-height: 160%; font-weight: 400} .\!text-button { --max-fs: var(--text-base); --min-fs: var(--text-base-min); --slope: calc( (var(--max-fs) - var(--min-fs)) / (var(--max-vw) - var(--min-vw)) ); --min-fs-px: calc(var(--min-fs) * 1px); --max-fs-px: calc(var(--max-fs) * 1px); --fs-px: calc(var(--slope) * (100vw - var(--min-vw-px)) + var(--min-fs-px)); font-size: clamp(var(--min-fs-px), var(--fs-px), var(--max-fs-px)); } .text-button { --max-fs: var(--text-base); --min-fs: var(--text-base-min); --slope: calc( (var(--max-fs) - var(--min-fs)) / (var(--max-vw) - var(--min-vw)) ); --min-fs-px: calc(var(--min-fs) * 1px); --max-fs-px: calc(var(--max-fs) * 1px); --fs-px: calc(var(--slope) * (100vw - var(--min-vw-px)) + var(--min-fs-px)); font-size: clamp(var(--min-fs-px), var(--fs-px), var(--max-fs-px)); } .\!text-button { --max-fs: var(--text-button) !important; --min-fs: var(--text-button-md) !important; } .text-button { --max-fs: var(--text-button); --min-fs: var(--text-button-md); } @media screen and (min-width: 320px) { .\!text-button { --min-vw: 320 !important; --min-vw-px: calc(var(--min-vw) * 1px) !important; --max-vw: 1279 !important; --max-vw-px: calc(var(--max-vw) * 1px) !important; --max-fs: var(--text-button-lg) !important; --min-fs: var(--text-button-md) !important; } .text-button { --min-vw: 320; --min-vw-px: calc(var(--min-vw) * 1px); --max-vw: 1279; --max-vw-px: calc(var(--max-vw) * 1px); --max-fs: var(--text-button-lg); --min-fs: var(--text-button-md); } } @media screen and (min-width: 1280px) { .\!text-button { --min-vw: 1280 !important; --min-vw-px: calc(var(--min-vw) * 1px) !important; --max-vw: 1920 !important; --max-vw-px: calc(var(--max-vw) * 1px) !important; --max-fs: var(--text-button) !important; --min-fs: var(--text-button-lg) !important; } .text-button { --min-vw: 1280; --min-vw-px: calc(var(--min-vw) * 1px); --max-vw: 1920; --max-vw-px: calc(var(--max-vw) * 1px); --max-fs: var(--text-button); --min-fs: var(--text-button-lg); } } .\!text-button{ font-weight: 600 !important; line-height: 100% !important} .text-button{ font-weight: 600; line-height: 100%} .text-eyebrow { --max-fs: var(--text-base); --min-fs: var(--text-base-min); --slope: calc( (var(--max-fs) - var(--min-fs)) / (var(--max-vw) - var(--min-vw)) ); --min-fs-px: calc(var(--min-fs) * 1px); --max-fs-px: calc(var(--max-fs) * 1px); --fs-px: calc(var(--slope) * (100vw - var(--min-vw-px)) + var(--min-fs-px)); font-size: clamp(var(--min-fs-px), var(--fs-px), var(--max-fs-px)); --max-fs: var(--text-eyebrow); --min-fs: var(--text-eyebrow-md); } @media screen and (min-width: 320px) { .text-eyebrow { --min-vw: 320; --min-vw-px: calc(var(--min-vw) * 1px); --max-vw: 1279; --max-vw-px: calc(var(--max-vw) * 1px); --max-fs: var(--text-eyebrow-lg); --min-fs: var(--text-eyebrow-md); } } @media screen and (min-width: 1280px) { .text-eyebrow { --min-vw: 1280; --min-vw-px: calc(var(--min-vw) * 1px); --max-vw: 1920; --max-vw-px: calc(var(--max-vw) * 1px); --max-fs: var(--text-eyebrow); --min-fs: var(--text-eyebrow-lg); } } .text-eyebrow{ font-weight: 600; line-height: 100%} .text-navigation { --max-fs: var(--text-base); --min-fs: var(--text-base-min); --slope: calc( (var(--max-fs) - var(--min-fs)) / (var(--max-vw) - var(--min-vw)) ); --min-fs-px: calc(var(--min-fs) * 1px); --max-fs-px: calc(var(--max-fs) * 1px); --fs-px: calc(var(--slope) * (100vw - var(--min-vw-px)) + var(--min-fs-px)); font-size: clamp(var(--min-fs-px), var(--fs-px), var(--max-fs-px)); --max-fs: var(--text-navigation); --min-fs: var(--text-navigation-md); } @media screen and (min-width: 320px) { .text-navigation { --min-vw: 320; --min-vw-px: calc(var(--min-vw) * 1px); --max-vw: 1279; --max-vw-px: calc(var(--max-vw) * 1px); --max-fs: var(--text-navigation-lg); --min-fs: var(--text-navigation-md); } } @media screen and (min-width: 1280px) { .text-navigation { --min-vw: 1280; --min-vw-px: calc(var(--min-vw) * 1px); --max-vw: 1920; --max-vw-px: calc(var(--max-vw) * 1px); --max-fs: var(--text-navigation); --min-fs: var(--text-navigation-lg); } } .text-navigation{ font-weight: 600; line-height: 100%} .display1, .heading1, .heading2, .heading3, .heading4, .heading5, .heading6, .text-button, .text-eyebrow, .text-navigation, h1, h2, h3, h4, h5, h6 { font-family: "STIX Two Text"; font-family: "STIX Two Text", serif; } .\!text-button { font-family: "STIX Two Text"; font-family: "STIX Two Text", serif; } .pointer-events-none{ pointer-events: none} .visible{ visibility: visible} .static{ position: static} .fixed{ position: fixed} .absolute{ position: absolute} .\!relative{ position: relative !important} .relative{ position: relative} .sticky{ position: sticky} .inset-0{ inset: 0px} .\!bottom-\[7\%\]{ bottom: 7% !important} .\!top-auto{ top: auto !important} .-bottom-0{ bottom: -0px} .-bottom-\[250px\]{ bottom: -250px} .-left-\[169px\]{ left: -169px} .-left-\[62px\]{ left: -62px} .-right-\[100\.355px\]{ right: -100.355px} .-right-\[110px\]{ right: -110px} .-top-\[155px\]{ top: -155px} .-top-\[250px\]{ top: -250px} .bottom-5{ bottom: 1.25rem} .bottom-8{ bottom: 2rem} .bottom-\[-3px\]{ bottom: -3px} .bottom-auto{ bottom: auto} .left-0{ left: 0px} .left-1\/2{ left: 50%} .right-0{ right: 0px} .right-5{ right: 1.25rem} .top-0{ top: 0px} .top-1\/2{ top: 50%} .top-\[-40px\]{ top: -40px} .top-\[197\%\]{ top: 197%} .top-\[200\%\]{ top: 200%} .top-\[78px\]{ top: 78px} .z-10{ z-index: 10} .z-20{ z-index: 20} .z-50{ z-index: 50} .z-\[11\]{ z-index: 11} .z-\[91\]{ z-index: 91} .z-\[991\]{ z-index: 991} .z-\[99999\]{ z-index: 99999} .z-\[9999\]{ z-index: 9999} .z-\[99\]{ z-index: 99} .z-\[9\]{ z-index: 9} .order-1{ order: 1} .order-2{ order: 2} .mx-\[10px\]{ margin-left: 10px; margin-right: 10px} .mx-auto{ margin-left: auto; margin-right: auto} .my-10{ margin-top: 2.5rem; margin-bottom: 2.5rem} .my-4{ margin-top: 1rem; margin-bottom: 1rem} .my-8{ margin-top: 2rem; margin-bottom: 2rem} .my-\[60px\]{ margin-top: 60px; margin-bottom: 60px} .\!mb-2{ margin-bottom: 0.5rem !important} .\!mb-5{ margin-bottom: 1.25rem !important} .\!ml-1{ margin-left: 0.25rem !important} .mb-10{ margin-bottom: 2.5rem} .mb-2{ margin-bottom: 0.5rem} .mb-3{ margin-bottom: 0.75rem} .mb-5{ margin-bottom: 1.25rem} .mb-\[10px\]{ margin-bottom: 10px} .mb-\[30px\]{ margin-bottom: 30px} .mb-\[32px\]{ margin-bottom: 32px} .ml-1{ margin-left: 0.25rem} .ml-\[10px\]{ margin-left: 10px} .mr-2{ margin-right: 0.5rem} .mr-3{ margin-right: 0.75rem} .mt-0{ margin-top: 0px} .mt-1{ margin-top: 0.25rem} .mt-10{ margin-top: 2.5rem} .mt-2{ margin-top: 0.5rem} .mt-3{ margin-top: 0.75rem} .mt-4{ margin-top: 1rem} .mt-5{ margin-top: 1.25rem} .mt-8{ margin-top: 2rem} .mt-\[10px\]{ margin-top: 10px} .mt-\[28px\]{ margin-top: 28px} .mt-\[60px\]{ margin-top: 60px} .mt-\[78px\]{ margin-top: 78px} .mt-\[var\(--header-height\)\]{ margin-top: var(--header-height)} .line-clamp-2{ overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2} .line-clamp-6{ overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 6} .block{ display: block} .inline-block{ display: inline-block} .flex{ display: flex} .inline-flex{ display: inline-flex} .table{ display: table} .grid{ display: grid} .\!hidden{ display: none !important} .hidden{ display: none} .\!aspect-\[740\/640\]{ aspect-ratio: 740/640 !important} .aspect-\[114\/114\]{ aspect-ratio: 114/114} .aspect-\[153\/36\]{ aspect-ratio: 153/36} .aspect-\[1920\/2000\]{ aspect-ratio: 1920/2000} .aspect-\[20\/16\]{ aspect-ratio: 20/16} .aspect-\[20\/20\]{ aspect-ratio: 20/20} .aspect-\[230\/54\]{ aspect-ratio: 230/54} .aspect-\[24\/24\]{ aspect-ratio: 24/24} .aspect-\[26\/26\]{ aspect-ratio: 26/26} .aspect-\[27\/27\]{ aspect-ratio: 27/27} .aspect-\[300\/400\]{ aspect-ratio: 300/400} .aspect-\[32\/30\]{ aspect-ratio: 32/30} .aspect-\[373\/372\]{ aspect-ratio: 373/372} .aspect-\[4\/5\]{ aspect-ratio: 4/5} .aspect-\[40\/40\]{ aspect-ratio: 40/40} .aspect-\[400\/400\]{ aspect-ratio: 400/400} .aspect-\[480\/372\]{ aspect-ratio: 480/372} .aspect-\[539\/539\]{ aspect-ratio: 539/539} .aspect-\[55\/60\]{ aspect-ratio: 55/60} .aspect-\[556\/556\]{ aspect-ratio: 556/556} .aspect-\[572\/466\]{ aspect-ratio: 572/466} .aspect-\[680\/450\]{ aspect-ratio: 680/450} .aspect-\[722\/575\]{ aspect-ratio: 722/575} .aspect-\[740\/416\]{ aspect-ratio: 740/416} .aspect-\[740\/468\]{ aspect-ratio: 740/468} .aspect-\[740\/640\]{ aspect-ratio: 740/640} .aspect-\[760\/340\]{ aspect-ratio: 760/340} .aspect-\[80\/80\]{ aspect-ratio: 80/80} .aspect-\[960\/500\]{ aspect-ratio: 960/500} .aspect-\[960\/700\]{ aspect-ratio: 960/700} .aspect-square{ aspect-ratio: 1 / 1} .\!h-5{ height: 1.25rem !important} .\!h-\[16px\]{ height: 16px !important} .\!h-\[30px\]{ height: 30px !important} .\!h-\[45px\]{ height: 45px !important} .\!h-\[88\%\]{ height: 88% !important} .h-0{ height: 0px} .h-1{ height: 0.25rem} .h-3{ height: 0.75rem} .h-4{ height: 1rem} .h-5{ height: 1.25rem} .h-\[10px\]{ height: 10px} .h-\[1px\]{ height: 1px} .h-\[2px\]{ height: 2px} .h-\[474px\]{ height: 474px} .h-\[55px\]{ height: 55px} .h-\[74px\]{ height: 74px} .h-\[90\%\]{ height: 90%} .h-auto{ height: auto} .h-full{ height: 100%} .h-screen{ height: 100vh} .max-h-0{ max-height: 0px} .max-h-6{ max-height: 1.5rem} .max-h-\[16px\]{ max-height: 16px} .max-h-\[180px\]{ max-height: 180px} .max-h-\[300px\]{ max-height: 300px} .max-h-\[474px\]{ max-height: 474px} .max-h-max{ max-height: -moz-max-content; max-height: max-content} .min-h-screen{ min-height: 100vh} .\!w-5{ width: 1.25rem !important} .\!w-\[26px\]{ width: 26px !important} .\!w-\[30px\]{ width: 30px !important} .w-1{ width: 0.25rem} .w-10\/12{ width: 83.333333%} .w-3{ width: 0.75rem} .w-4{ width: 1rem} .w-5{ width: 1.25rem} .w-\[30\%\]{ width: 30%} .w-\[55px\]{ width: 55px} .w-\[70\%\]{ width: 70%} .w-\[74px\]{ width: 74px} .w-auto{ width: auto} .w-full{ width: 100%} .min-w-6{ min-width: 1.5rem} .min-w-\[74px\]{ min-width: 74px} .max-w-6{ max-width: 1.5rem} .max-w-\[1000px\]{ max-width: 1000px} .max-w-\[1173px\]{ max-width: 1173px} .max-w-\[20px\]{ max-width: 20px} .max-w-\[265px\]{ max-width: 265px} .max-w-\[300px\]{ max-width: 300px} .max-w-\[400px\]{ max-width: 400px} .max-w-\[484px\]{ max-width: 484px} .max-w-\[526px\]{ max-width: 526px} .max-w-\[600px\]{ max-width: 600px} .max-w-\[70\%\]{ max-width: 70%} .max-w-\[720px\]{ max-width: 720px} .max-w-\[85\%\]{ max-width: 85%} .max-w-full{ max-width: 100%} .max-w-max{ max-width: -moz-max-content; max-width: max-content} .flex-1{ flex: 1 1 0%} .flex-shrink-0{ flex-shrink: 0} .-translate-x-1\/2{ --tw-translate-x: -50%; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))} .-translate-y-0{ --tw-translate-y: -0px; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))} .-translate-y-1\/2{ --tw-translate-y: -50%; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))} .-translate-y-\[300\%\]{ --tw-translate-y: -300%; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))} .translate-x-full{ --tw-translate-x: 100%; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))} .translate-y-0{ --tw-translate-y: 0px; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))} .translate-y-\[-300px\]{ --tw-translate-y: -300px; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))} .rotate-\[75deg\]{ --tw-rotate: 75deg; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))} .\!scale-125{ --tw-scale-x: 1.25 !important; --tw-scale-y: 1.25 !important; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)) !important} .scale-x-0{ --tw-scale-x: 0; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))} .transform{ transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))} .cursor-pointer{ cursor: pointer} .resize{ resize: both} .scroll-mt-10{ scroll-margin-top: 2.5rem} .scroll-mt-20{ scroll-margin-top: 5rem} .grid-cols-1{ grid-template-columns: repeat(1, minmax(0, 1fr))} .grid-cols-3{ grid-template-columns: repeat(3, minmax(0, 1fr))} .flex-row{ flex-direction: row} .flex-col{ flex-direction: column} .flex-wrap{ flex-wrap: wrap} .place-items-center{ place-items: center} .items-start{ align-items: flex-start} .items-center{ align-items: center} .items-stretch{ align-items: stretch} .justify-start{ justify-content: flex-start} .justify-end{ justify-content: flex-end} .justify-center{ justify-content: center} .justify-between{ justify-content: space-between} .gap-1{ gap: 0.25rem} .gap-10{ gap: 2.5rem} .gap-2{ gap: 0.5rem} .gap-3{ gap: 0.75rem} .gap-4{ gap: 1rem} .gap-5{ gap: 1.25rem} .gap-6{ gap: 1.5rem} .gap-8{ gap: 2rem} .gap-\[100px\]{ gap: 100px} .gap-\[10px\]{ gap: 10px} .gap-\[15px\]{ gap: 15px} .gap-\[20px\]{ gap: 20px} .gap-\[30px\]{ gap: 30px} .gap-\[32px\]{ gap: 32px} .gap-\[50px\]{ gap: 50px} .gap-\[60px\]{ gap: 60px} .gap-\[8px\]{ gap: 8px} .gap-x-5{ -moz-column-gap: 1.25rem; column-gap: 1.25rem} .gap-y-10{ row-gap: 2.5rem} .justify-self-start{ justify-self: start} .overflow-hidden{ overflow: hidden} .overflow-x-auto{ overflow-x: auto} .scroll-smooth{ scroll-behavior: smooth} .whitespace-nowrap{ white-space: nowrap} .\!rounded-\[4px\]{ border-radius: 4px !important} .rounded{ border-radius: 0.25rem} .rounded-\[100px\]{ border-radius: 100px} .rounded-\[4px\]{ border-radius: 4px} .rounded-\[8px\]{ border-radius: 8px} .rounded-full{ border-radius: 9999px} .rounded-t-lg{ border-top-left-radius: 0.5rem; border-top-right-radius: 0.5rem} .\!border{ border-width: 1px !important} .border{ border-width: 1px} .border-b{ border-bottom-width: 1px} .border-b-\[2\.5px\]{ border-bottom-width: 2.5px} .border-t{ border-top-width: 1px} .border-none{ border-style: none} .border-black-20{ --tw-border-opacity: 1; border-color: rgb(204 204 204 / var(--tw-border-opacity))} .border-logo-green{ --tw-border-opacity: 1; border-color: rgb(3 75 34 / var(--tw-border-opacity))} .border-primary-orange{ --tw-border-opacity: 1; border-color: rgb(237 125 49 / var(--tw-border-opacity))} .border-white{ --tw-border-opacity: 1; border-color: rgb(255 255 255 / var(--tw-border-opacity))} .border-b-black-20{ --tw-border-opacity: 1; border-bottom-color: rgb(204 204 204 / var(--tw-border-opacity))} .border-b-black-60{ --tw-border-opacity: 1; border-bottom-color: rgb(102 102 102 / var(--tw-border-opacity))} .border-b-logo-orange{ --tw-border-opacity: 1; border-bottom-color: rgb(248 149 3 / var(--tw-border-opacity))} .border-t-\[rgba\(0_0_0_0\.25\)\]{ border-top-color: rgba(0 0 0 0.25)} .border-t-white{ --tw-border-opacity: 1; border-top-color: rgb(255 255 255 / var(--tw-border-opacity))} .\!bg-primary-dark-grey{ --tw-bg-opacity: 1 !important; background-color: rgb(62 60 60 / var(--tw-bg-opacity)) !important} .bg-\[\#FFF7F2\]{ --tw-bg-opacity: 1; background-color: rgb(255 247 242 / var(--tw-bg-opacity))} .bg-\[\#fff\]{ --tw-bg-opacity: 1; background-color: rgb(255 255 255 / var(--tw-bg-opacity))} .bg-black{ --tw-bg-opacity: 1; background-color: rgb(0 0 0 / var(--tw-bg-opacity))} .bg-black-20{ --tw-bg-opacity: 1; background-color: rgb(204 204 204 / var(--tw-bg-opacity))} .bg-black\/50{ background-color: rgb(0 0 0 / 0.5)} .bg-gray-200{ --tw-bg-opacity: 1; background-color: rgb(229 231 235 / var(--tw-bg-opacity))} .bg-light-green{ --tw-bg-opacity: 1; background-color: rgb(249 255 244 / var(--tw-bg-opacity))} .bg-light-grey{ --tw-bg-opacity: 1; background-color: rgb(247 247 247 / var(--tw-bg-opacity))} .bg-light-orange{ --tw-bg-opacity: 1; background-color: rgb(255 247 242 / var(--tw-bg-opacity))} .bg-logo-green\/50{ background-color: rgb(3 75 34 / 0.5)} .bg-logo-orange{ --tw-bg-opacity: 1; background-color: rgb(248 149 3 / var(--tw-bg-opacity))} .bg-primary-dark-grey{ --tw-bg-opacity: 1; background-color: rgb(62 60 60 / var(--tw-bg-opacity))} .bg-primary-orange{ --tw-bg-opacity: 1; background-color: rgb(237 125 49 / var(--tw-bg-opacity))} .bg-transparent{ background-color: transparent} .bg-white{ --tw-bg-opacity: 1; background-color: rgb(255 255 255 / var(--tw-bg-opacity))} .bg-orange-fade{ background-image: linear-gradient(90deg, rgba(106, 43, 0, 0.60) 55.21%, rgba(106, 43, 0, 0.00) 100%)} .bg-cover{ background-size: cover} .bg-center{ background-position: center} .object-contain{ -o-object-fit: contain; object-fit: contain} .object-cover{ -o-object-fit: cover; object-fit: cover} .object-center{ -o-object-position: center; object-position: center} .p-0{ padding: 0px} .p-10{ padding: 2.5rem} .p-2{ padding: 0.5rem} .p-5{ padding: 1.25rem} .p-6{ padding: 1.5rem} .\!px-\[28px\]{ padding-left: 28px !important; padding-right: 28px !important} .\!py-4{ padding-top: 1rem !important; padding-bottom: 1rem !important} .px-3{ padding-left: 0.75rem; padding-right: 0.75rem} .px-4{ padding-left: 1rem; padding-right: 1rem} .px-5{ padding-left: 1.25rem; padding-right: 1.25rem} .px-6{ padding-left: 1.5rem; padding-right: 1.5rem} .px-7{ padding-left: 1.75rem; padding-right: 1.75rem} .px-\[20px\]{ padding-left: 20px; padding-right: 20px} .px-\[28px\]{ padding-left: 28px; padding-right: 28px} .px-\[4\%\]{ padding-left: 4%; padding-right: 4%} .px-\[5\%\]{ padding-left: 5%; padding-right: 5%} .py-2{ padding-top: 0.5rem; padding-bottom: 0.5rem} .py-20{ padding-top: 5rem; padding-bottom: 5rem} .py-3{ padding-top: 0.75rem; padding-bottom: 0.75rem} .py-4{ padding-top: 1rem; padding-bottom: 1rem} .py-5{ padding-top: 1.25rem; padding-bottom: 1.25rem} .py-\[100px\]{ padding-top: 100px; padding-bottom: 100px} .py-\[10px\]{ padding-top: 10px; padding-bottom: 10px} .py-\[22px\]{ padding-top: 22px; padding-bottom: 22px} .py-\[40px\]{ padding-top: 40px; padding-bottom: 40px} .py-\[50px\]{ padding-top: 50px; padding-bottom: 50px} .pb-1{ padding-bottom: 0.25rem} .pb-5{ padding-bottom: 1.25rem} .pb-\[10px\]{ padding-bottom: 10px} .pb-\[2px\]{ padding-bottom: 2px} .pb-\[30px\]{ padding-bottom: 30px} .pr-\[10px\]{ padding-right: 10px} .pt-1{ padding-top: 0.25rem} .pt-2{ padding-top: 0.5rem} .pt-3{ padding-top: 0.75rem} .pt-5{ padding-top: 1.25rem} .pt-\[10px\]{ padding-top: 10px} .pt-\[60px\]{ padding-top: 60px} .text-center{ text-align: center} .text-start{ text-align: start} .\!font-primary{ font-family: "Inter", sans-serif !important} .font-primary{ font-family: "Inter", sans-serif} .font-secondary{ font-family: "STIX Two Text", serif} .text-4xl{ font-size: 2.25rem; line-height: 2.5rem} .text-\[0px\]{ font-size: 0px} .\!font-\[0px\]{ font-weight: 0px !important} .\!font-normal{ font-weight: 400 !important} .\!font-semibold{ font-weight: 600 !important} .font-bold{ font-weight: 700} .font-normal{ font-weight: 400} .font-semibold{ font-weight: 600} .uppercase{ text-transform: uppercase} .\!leading-100{ line-height: 100% !important} .\!leading-150{ line-height: 150% !important} .leading-100{ line-height: 100%} .leading-120{ line-height: 120%} .leading-150{ line-height: 150%} .leading-160{ line-height: 160%} .\!text-black-60{ --tw-text-opacity: 1 !important; color: rgb(102 102 102 / var(--tw-text-opacity)) !important} .\!text-black-80{ --tw-text-opacity: 1 !important; color: rgb(51 51 51 / var(--tw-text-opacity)) !important} .\!text-red-400{ --tw-text-opacity: 1 !important; color: rgb(248 113 113 / var(--tw-text-opacity)) !important} .\!text-white{ --tw-text-opacity: 1 !important; color: rgb(255 255 255 / var(--tw-text-opacity)) !important} .text-\[\#333333\]{ --tw-text-opacity: 1; color: rgb(51 51 51 / var(--tw-text-opacity))} .text-black{ --tw-text-opacity: 1; color: rgb(0 0 0 / var(--tw-text-opacity))} .text-black-40{ --tw-text-opacity: 1; color: rgb(153 153 153 / var(--tw-text-opacity))} .text-black-60{ --tw-text-opacity: 1; color: rgb(102 102 102 / var(--tw-text-opacity))} .text-black-80{ --tw-text-opacity: 1; color: rgb(51 51 51 / var(--tw-text-opacity))} .text-logo-green{ --tw-text-opacity: 1; color: rgb(3 75 34 / var(--tw-text-opacity))} .text-logo-orange{ --tw-text-opacity: 1; color: rgb(248 149 3 / var(--tw-text-opacity))} .text-primary-dark-grey{ --tw-text-opacity: 1; color: rgb(62 60 60 / var(--tw-text-opacity))} .text-primary-orange{ --tw-text-opacity: 1; color: rgb(237 125 49 / var(--tw-text-opacity))} .text-white{ --tw-text-opacity: 1; color: rgb(255 255 255 / var(--tw-text-opacity))} .\!underline{ text-decoration-line: underline !important} .underline{ text-decoration-line: underline} .\!decoration-1{ text-decoration-thickness: 1px !important} .\!underline-offset-2{ text-underline-offset: 2px !important} .underline-offset-4{ text-underline-offset: 4px} .\!opacity-50{ opacity: 0.5 !important} .opacity-0{ opacity: 0} .opacity-100{ opacity: 1} .opacity-15{ opacity: 0.15} .opacity-50{ opacity: 0.5} .opacity-80{ opacity: 0.8} .opacity-\[0\.3\]{ opacity: 0.3} .opacity-\[0\.5\]{ opacity: 0.5} .\!shadow-\[0_4px_20px_0_rgba\(0\2c 0\2c 0\2c 0\.10\)\]{ --tw-shadow: 0 4px 20px 0 rgba(0,0,0,0.10) !important; --tw-shadow-colored: 0 4px 20px 0 var(--tw-shadow-color) !important; box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow) !important} .shadow{ --tw-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1); --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color); box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)} .shadow-\[0_-1px_3\.6px_0_rgba\(0_0_0_0\.25\)\]{ --tw-shadow: 0 -1px 3.6px 0 rgba(0 0 0 0.25); --tw-shadow-colored: 0 -1px 3.6px 0 var(--tw-shadow-color); box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)} .shadow-\[0_0_11px_0_rgba\(0\2c 0\2c 0\2c 0\.15\)\]{ --tw-shadow: 0 0 11px 0 rgba(0,0,0,0.15); --tw-shadow-colored: 0 0 11px 0 var(--tw-shadow-color); box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)} .shadow-\[0_0_20px_4px_rgba\(0_0_0_0\.07\)\]{ --tw-shadow: 0 0 20px 4px rgba(0 0 0 0.07); --tw-shadow-colored: 0 0 20px 4px var(--tw-shadow-color); box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)} .shadow-\[0_0_8px_0_rgba\(0\2c 0\2c 0\2c 0\.15\)\]{ --tw-shadow: 0 0 8px 0 rgba(0,0,0,0.15); --tw-shadow-colored: 0 0 8px 0 var(--tw-shadow-color); box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)} .shadow-\[0_0_9\.1px_0_rgba\(0\2c 0\2c 0\2c 0\.15\)\]{ --tw-shadow: 0 0 9.1px 0 rgba(0,0,0,0.15); --tw-shadow-colored: 0 0 9.1px 0 var(--tw-shadow-color); box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)} .shadow-md{ --tw-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1); --tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color); box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)} .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)} .invert{ --tw-invert: invert(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)} .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)} .backdrop-blur-\[2px\]{ --tw-backdrop-blur: blur(2px); -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)} .backdrop-blur-sm{ --tw-backdrop-blur: blur(4px); -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)} .\!transition-all{ transition-property: all !important; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1) !important; transition-duration: 150ms !important} .transition{ transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-backdrop-filter; transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter; transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-backdrop-filter; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 150ms} .transition-all{ transition-property: all; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 150ms} .transition-colors{ transition-property: color, background-color, border-color, text-decoration-color, fill, stroke; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 150ms} .transition-opacity{ transition-property: opacity; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 150ms} .transition-transform{ transition-property: transform; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 150ms} .\!duration-300{ transition-duration: 300ms !important} .duration-300{ transition-duration: 300ms} .duration-500{ transition-duration: 500ms} .duration-700{ transition-duration: 700ms} .ease-out{ transition-timing-function: cubic-bezier(0, 0, 0.2, 1)} .\!content-\[\'\*\'\]{ --tw-content: '*' !important; content: var(--tw-content) !important} .content-\[\"\"\]{ --tw-content: ""; content: var(--tw-content)} .content-\[\"\/\"\]{ --tw-content: "/"; content: var(--tw-content)} /* Third Party Libraries */ /** * Swiper 11.0.7 * Most modern mobile touch slider and framework with hardware accelerated transitions * https://swiperjs.com * * Copyright 2014-2024 Vladimir Kharlampidi * * Released under the MIT License * * Released on: February 27, 2024 */ @font-face{font-family:swiper-icons;src:url('data:application/font-woff;charset=utf-8;base64, d09GRgABAAAAAAZgABAAAAAADAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABGRlRNAAAGRAAAABoAAAAci6qHkUdERUYAAAWgAAAAIwAAACQAYABXR1BPUwAABhQAAAAuAAAANuAY7+xHU1VCAAAFxAAAAFAAAABm2fPczU9TLzIAAAHcAAAASgAAAGBP9V5RY21hcAAAAkQAAACIAAABYt6F0cBjdnQgAAACzAAAAAQAAAAEABEBRGdhc3AAAAWYAAAACAAAAAj//wADZ2x5ZgAAAywAAADMAAAD2MHtryVoZWFkAAABbAAAADAAAAA2E2+eoWhoZWEAAAGcAAAAHwAAACQC9gDzaG10eAAAAigAAAAZAAAArgJkABFsb2NhAAAC0AAAAFoAAABaFQAUGG1heHAAAAG8AAAAHwAAACAAcABAbmFtZQAAA/gAAAE5AAACXvFdBwlwb3N0AAAFNAAAAGIAAACE5s74hXjaY2BkYGAAYpf5Hu/j+W2+MnAzMYDAzaX6QjD6/4//Bxj5GA8AuRwMYGkAPywL13jaY2BkYGA88P8Agx4j+/8fQDYfA1AEBWgDAIB2BOoAeNpjYGRgYNBh4GdgYgABEMnIABJzYNADCQAACWgAsQB42mNgYfzCOIGBlYGB0YcxjYGBwR1Kf2WQZGhhYGBiYGVmgAFGBiQQkOaawtDAoMBQxXjg/wEGPcYDDA4wNUA2CCgwsAAAO4EL6gAAeNpj2M0gyAACqxgGNWBkZ2D4/wMA+xkDdgAAAHjaY2BgYGaAYBkGRgYQiAHyGMF8FgYHIM3DwMHABGQrMOgyWDLEM1T9/w8UBfEMgLzE////P/5//f/V/xv+r4eaAAeMbAxwIUYmIMHEgKYAYjUcsDAwsLKxc3BycfPw8jEQA/gZBASFhEVExcQlJKWkZWTl5BUUlZRVVNXUNTQZBgMAAMR+E+gAEQFEAAAAKgAqACoANAA+AEgAUgBcAGYAcAB6AIQAjgCYAKIArAC2AMAAygDUAN4A6ADyAPwBBgEQARoBJAEuATgBQgFMAVYBYAFqAXQBfgGIAZIBnAGmAbIBzgHsAAB42u2NMQ6CUAyGW568x9AneYYgm4MJbhKFaExIOAVX8ApewSt4Bic4AfeAid3VOBixDxfPYEza5O+Xfi04YADggiUIULCuEJK8VhO4bSvpdnktHI5QCYtdi2sl8ZnXaHlqUrNKzdKcT8cjlq+rwZSvIVczNiezsfnP/uznmfPFBNODM2K7MTQ45YEAZqGP81AmGGcF3iPqOop0r1SPTaTbVkfUe4HXj97wYE+yNwWYxwWu4v1ugWHgo3S1XdZEVqWM7ET0cfnLGxWfkgR42o2PvWrDMBSFj/IHLaF0zKjRgdiVMwScNRAoWUoH78Y2icB/yIY09An6AH2Bdu/UB+yxopYshQiEvnvu0dURgDt8QeC8PDw7Fpji3fEA4z/PEJ6YOB5hKh4dj3EvXhxPqH/SKUY3rJ7srZ4FZnh1PMAtPhwP6fl2PMJMPDgeQ4rY8YT6Gzao0eAEA409DuggmTnFnOcSCiEiLMgxCiTI6Cq5DZUd3Qmp10vO0LaLTd2cjN4fOumlc7lUYbSQcZFkutRG7g6JKZKy0RmdLY680CDnEJ+UMkpFFe1RN7nxdVpXrC4aTtnaurOnYercZg2YVmLN/d/gczfEimrE/fs/bOuq29Zmn8tloORaXgZgGa78yO9/cnXm2BpaGvq25Dv9S4E9+5SIc9PqupJKhYFSSl47+Qcr1mYNAAAAeNptw0cKwkAAAMDZJA8Q7OUJvkLsPfZ6zFVERPy8qHh2YER+3i/BP83vIBLLySsoKimrqKqpa2hp6+jq6RsYGhmbmJqZSy0sraxtbO3sHRydnEMU4uR6yx7JJXveP7WrDycAAAAAAAH//wACeNpjYGRgYOABYhkgZgJCZgZNBkYGLQZtIJsFLMYAAAw3ALgAeNolizEKgDAQBCchRbC2sFER0YD6qVQiBCv/H9ezGI6Z5XBAw8CBK/m5iQQVauVbXLnOrMZv2oLdKFa8Pjuru2hJzGabmOSLzNMzvutpB3N42mNgZGBg4GKQYzBhYMxJLMlj4GBgAYow/P/PAJJhLM6sSoWKfWCAAwDAjgbRAAB42mNgYGBkAIIbCZo5IPrmUn0hGA0AO8EFTQAA');font-weight:400;font-style:normal} :root{--swiper-theme-color:#007aff} :host{position:relative;display:block;margin-left:auto;margin-right:auto;z-index:1} .swiper{margin-left:auto;margin-right:auto;position:relative;overflow:hidden;list-style:none;padding:0;z-index:1;display:block} .swiper-vertical>.swiper-wrapper{flex-direction:column} .swiper-wrapper{position:relative;width:100%;height:100%;z-index:1;display:flex;transition-property:transform;transition-timing-function:var(--swiper-wrapper-transition-timing-function,initial);box-sizing:content-box} .swiper-android .swiper-slide,.swiper-ios .swiper-slide,.swiper-wrapper{transform:translate3d(0px,0,0)} .swiper-horizontal{touch-action:pan-y} .swiper-vertical{touch-action:pan-x} .swiper-slide{flex-shrink:0;width:100%;height:100%;position:relative;transition-property:transform;display:block} .swiper-slide-invisible-blank{visibility:hidden} .swiper-autoheight,.swiper-autoheight .swiper-slide{height:auto} .swiper-autoheight .swiper-wrapper{align-items:flex-start;transition-property:transform,height} .swiper-backface-hidden .swiper-slide{transform:translateZ(0);backface-visibility:hidden} .swiper-3d.swiper-css-mode .swiper-wrapper{perspective:1200px} .swiper-3d .swiper-wrapper{transform-style:preserve-3d} .swiper-3d{perspective:1200px} .swiper-3d .swiper-cube-shadow,.swiper-3d .swiper-slide{transform-style:preserve-3d} .swiper-css-mode>.swiper-wrapper{overflow:auto;scrollbar-width:none;-ms-overflow-style:none} .swiper-css-mode>.swiper-wrapper::-webkit-scrollbar{display:none} .swiper-css-mode>.swiper-wrapper>.swiper-slide{scroll-snap-align:start start} .swiper-css-mode.swiper-horizontal>.swiper-wrapper{scroll-snap-type:x mandatory} .swiper-css-mode.swiper-vertical>.swiper-wrapper{scroll-snap-type:y mandatory} .swiper-css-mode.swiper-free-mode>.swiper-wrapper{scroll-snap-type:none} .swiper-css-mode.swiper-free-mode>.swiper-wrapper>.swiper-slide{scroll-snap-align:none} .swiper-css-mode.swiper-centered>.swiper-wrapper::before{content:'';flex-shrink:0;order:9999} .swiper-css-mode.swiper-centered>.swiper-wrapper>.swiper-slide{scroll-snap-align:center center;scroll-snap-stop:always} .swiper-css-mode.swiper-centered.swiper-horizontal>.swiper-wrapper>.swiper-slide:first-child{margin-inline-start:var(--swiper-centered-offset-before)} .swiper-css-mode.swiper-centered.swiper-horizontal>.swiper-wrapper::before{height:100%;min-height:1px;width:var(--swiper-centered-offset-after)} .swiper-css-mode.swiper-centered.swiper-vertical>.swiper-wrapper>.swiper-slide:first-child{margin-block-start:var(--swiper-centered-offset-before)} .swiper-css-mode.swiper-centered.swiper-vertical>.swiper-wrapper::before{width:100%;min-width:1px;height:var(--swiper-centered-offset-after)} .swiper-3d .swiper-slide-shadow,.swiper-3d .swiper-slide-shadow-bottom,.swiper-3d .swiper-slide-shadow-left,.swiper-3d .swiper-slide-shadow-right,.swiper-3d .swiper-slide-shadow-top{position:absolute;left:0;top:0;width:100%;height:100%;pointer-events:none;z-index:10} .swiper-3d .swiper-slide-shadow{background:rgba(0,0,0,.15)} .swiper-3d .swiper-slide-shadow-left{background-image:linear-gradient(to left,rgba(0,0,0,.5),rgba(0,0,0,0))} .swiper-3d .swiper-slide-shadow-right{background-image:linear-gradient(to right,rgba(0,0,0,.5),rgba(0,0,0,0))} .swiper-3d .swiper-slide-shadow-top{background-image:linear-gradient(to top,rgba(0,0,0,.5),rgba(0,0,0,0))} .swiper-3d .swiper-slide-shadow-bottom{background-image:linear-gradient(to bottom,rgba(0,0,0,.5),rgba(0,0,0,0))} .swiper-lazy-preloader{width:42px;height:42px;position:absolute;left:50%;top:50%;margin-left:-21px;margin-top:-21px;z-index:10;transform-origin:50%;box-sizing:border-box;border:4px solid var(--swiper-preloader-color,var(--swiper-theme-color));border-radius:50%;border-top-color:transparent} .swiper-watch-progress .swiper-slide-visible .swiper-lazy-preloader,.swiper:not(.swiper-watch-progress) .swiper-lazy-preloader{animation:swiper-preloader-spin 1s infinite linear} .swiper-lazy-preloader-white{--swiper-preloader-color:#fff} .swiper-lazy-preloader-black{--swiper-preloader-color:#000} @keyframes swiper-preloader-spin{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}} .swiper-virtual .swiper-slide{-webkit-backface-visibility:hidden;transform:translateZ(0)} .swiper-virtual.swiper-css-mode .swiper-wrapper::after{content:'';position:absolute;left:0;top:0;pointer-events:none} .swiper-virtual.swiper-css-mode.swiper-horizontal .swiper-wrapper::after{height:1px;width:var(--swiper-virtual-size)} .swiper-virtual.swiper-css-mode.swiper-vertical .swiper-wrapper::after{width:1px;height:var(--swiper-virtual-size)} :root{--swiper-navigation-size:44px} .swiper-button-next,.swiper-button-prev{position:absolute;top:var(--swiper-navigation-top-offset,50%);width:calc(var(--swiper-navigation-size)/ 44 * 27);height:var(--swiper-navigation-size);margin-top:calc(0px - (var(--swiper-navigation-size)/ 2));z-index:10;cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--swiper-navigation-color,var(--swiper-theme-color))} .swiper-button-next.swiper-button-disabled,.swiper-button-prev.swiper-button-disabled{opacity:.35;cursor:auto;pointer-events:none} .swiper-button-next.swiper-button-hidden,.swiper-button-prev.swiper-button-hidden{opacity:0;cursor:auto;pointer-events:none} .swiper-navigation-disabled .swiper-button-next,.swiper-navigation-disabled .swiper-button-prev{display:none!important} .swiper-button-next svg,.swiper-button-prev svg{width:100%;height:100%;-o-object-fit:contain;object-fit:contain;transform-origin:center} .swiper-rtl .swiper-button-next svg,.swiper-rtl .swiper-button-prev svg{transform:rotate(180deg)} .swiper-button-prev,.swiper-rtl .swiper-button-next{left:var(--swiper-navigation-sides-offset,10px);right:auto} .swiper-button-next,.swiper-rtl .swiper-button-prev{right:var(--swiper-navigation-sides-offset,10px);left:auto} .swiper-button-lock{display:none} .swiper-button-next:after,.swiper-button-prev:after{font-family:swiper-icons;font-size:var(--swiper-navigation-size);text-transform:none!important;letter-spacing:0;font-variant:initial;line-height:1} .swiper-button-prev:after,.swiper-rtl .swiper-button-next:after{content:'prev'} .swiper-button-next,.swiper-rtl .swiper-button-prev{right:var(--swiper-navigation-sides-offset,10px);left:auto} .swiper-button-next:after,.swiper-rtl .swiper-button-prev:after{content:'next'} .swiper-pagination{position:absolute;text-align:center;transition:.3s opacity;transform:translate3d(0,0,0);z-index:10} .swiper-pagination.swiper-pagination-hidden{opacity:0} .swiper-pagination-disabled>.swiper-pagination,.swiper-pagination.swiper-pagination-disabled{display:none!important} .swiper-horizontal>.swiper-pagination-bullets,.swiper-pagination-bullets.swiper-pagination-horizontal,.swiper-pagination-custom,.swiper-pagination-fraction{bottom:var(--swiper-pagination-bottom,8px);top:var(--swiper-pagination-top,auto);left:0;width:100%} .swiper-pagination-bullets-dynamic{overflow:hidden;font-size:0} .swiper-pagination-bullets-dynamic .swiper-pagination-bullet{transform:scale(.33);position:relative} .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active{transform:scale(1)} .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-main{transform:scale(1)} .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev{transform:scale(.66)} .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev-prev{transform:scale(.33)} .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next{transform:scale(.66)} .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next-next{transform:scale(.33)} .swiper-pagination-bullet{width:var(--swiper-pagination-bullet-width,var(--swiper-pagination-bullet-size,8px));height:var(--swiper-pagination-bullet-height,var(--swiper-pagination-bullet-size,8px));display:inline-block;border-radius:var(--swiper-pagination-bullet-border-radius,50%);background:var(--swiper-pagination-bullet-inactive-color,#000);opacity:var(--swiper-pagination-bullet-inactive-opacity, .2)} button.swiper-pagination-bullet{border:none;margin:0;padding:0;box-shadow:none;-webkit-appearance:none;-moz-appearance:none;appearance:none} .swiper-pagination-clickable .swiper-pagination-bullet{cursor:pointer} .swiper-pagination-bullet:only-child{display:none!important} .swiper-pagination-bullet-active{opacity:var(--swiper-pagination-bullet-opacity, 1);background:var(--swiper-pagination-color,var(--swiper-theme-color))} .swiper-pagination-vertical.swiper-pagination-bullets,.swiper-vertical>.swiper-pagination-bullets{right:var(--swiper-pagination-right,8px);left:var(--swiper-pagination-left,auto);top:50%;transform:translate3d(0px,-50%,0)} .swiper-pagination-vertical.swiper-pagination-bullets .swiper-pagination-bullet,.swiper-vertical>.swiper-pagination-bullets .swiper-pagination-bullet{margin:var(--swiper-pagination-bullet-vertical-gap,6px) 0;display:block} .swiper-pagination-vertical.swiper-pagination-bullets.swiper-pagination-bullets-dynamic,.swiper-vertical>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic{top:50%;transform:translateY(-50%);width:8px} .swiper-pagination-vertical.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet,.swiper-vertical>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{display:inline-block;transition:.2s transform,.2s top} .swiper-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet,.swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet{margin:0 var(--swiper-pagination-bullet-horizontal-gap,4px)} .swiper-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic,.swiper-pagination-horizontal.swiper-pagination-bullets.swiper-pagination-bullets-dynamic{left:50%;transform:translateX(-50%);white-space:nowrap} .swiper-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet,.swiper-pagination-horizontal.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{transition:.2s transform,.2s left} .swiper-horizontal.swiper-rtl>.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{transition:.2s transform,.2s right} .swiper-pagination-fraction{color:var(--swiper-pagination-fraction-color,inherit)} .swiper-pagination-progressbar{background:var(--swiper-pagination-progressbar-bg-color,rgba(0,0,0,.25));position:absolute} .swiper-pagination-progressbar .swiper-pagination-progressbar-fill{background:var(--swiper-pagination-color,var(--swiper-theme-color));position:absolute;left:0;top:0;width:100%;height:100%;transform:scale(0);transform-origin:left top} .swiper-rtl .swiper-pagination-progressbar .swiper-pagination-progressbar-fill{transform-origin:right top} .swiper-horizontal>.swiper-pagination-progressbar,.swiper-pagination-progressbar.swiper-pagination-horizontal,.swiper-pagination-progressbar.swiper-pagination-vertical.swiper-pagination-progressbar-opposite,.swiper-vertical>.swiper-pagination-progressbar.swiper-pagination-progressbar-opposite{width:100%;height:var(--swiper-pagination-progressbar-size,4px);left:0;top:0} .swiper-horizontal>.swiper-pagination-progressbar.swiper-pagination-progressbar-opposite,.swiper-pagination-progressbar.swiper-pagination-horizontal.swiper-pagination-progressbar-opposite,.swiper-pagination-progressbar.swiper-pagination-vertical,.swiper-vertical>.swiper-pagination-progressbar{width:var(--swiper-pagination-progressbar-size,4px);height:100%;left:0;top:0} .swiper-pagination-lock{display:none} .swiper-scrollbar{border-radius:var(--swiper-scrollbar-border-radius,10px);position:relative;touch-action:none;background:var(--swiper-scrollbar-bg-color,rgba(0,0,0,.1))} .swiper-scrollbar-disabled>.swiper-scrollbar,.swiper-scrollbar.swiper-scrollbar-disabled{display:none!important} .swiper-horizontal>.swiper-scrollbar,.swiper-scrollbar.swiper-scrollbar-horizontal{position:absolute;left:var(--swiper-scrollbar-sides-offset,1%);bottom:var(--swiper-scrollbar-bottom,4px);top:var(--swiper-scrollbar-top,auto);z-index:50;height:var(--swiper-scrollbar-size,4px);width:calc(100% - 2 * var(--swiper-scrollbar-sides-offset,1%))} .swiper-scrollbar.swiper-scrollbar-vertical,.swiper-vertical>.swiper-scrollbar{position:absolute;left:var(--swiper-scrollbar-left,auto);right:var(--swiper-scrollbar-right,4px);top:var(--swiper-scrollbar-sides-offset,1%);z-index:50;width:var(--swiper-scrollbar-size,4px);height:calc(100% - 2 * var(--swiper-scrollbar-sides-offset,1%))} .swiper-scrollbar-drag{height:100%;width:100%;position:relative;background:var(--swiper-scrollbar-drag-bg-color,rgba(0,0,0,.5));border-radius:var(--swiper-scrollbar-border-radius,10px);left:0;top:0} .swiper-scrollbar-cursor-drag{cursor:move} .swiper-scrollbar-lock{display:none} .swiper-zoom-container{width:100%;height:100%;display:flex;justify-content:center;align-items:center;text-align:center} .swiper-zoom-container>canvas,.swiper-zoom-container>img,.swiper-zoom-container>svg{max-width:100%;max-height:100%;-o-object-fit:contain;object-fit:contain} .swiper-slide-zoomed{cursor:move;touch-action:none} .swiper .swiper-notification{position:absolute;left:0;top:0;pointer-events:none;opacity:0;z-index:-1000} .swiper-free-mode>.swiper-wrapper{transition-timing-function:ease-out;margin:0 auto} .swiper-grid>.swiper-wrapper{flex-wrap:wrap} .swiper-grid-column>.swiper-wrapper{flex-wrap:wrap;flex-direction:column} .swiper-fade.swiper-free-mode .swiper-slide{transition-timing-function:ease-out} .swiper-fade .swiper-slide{pointer-events:none;transition-property:opacity} .swiper-fade .swiper-slide .swiper-slide{pointer-events:none} .swiper-fade .swiper-slide-active{pointer-events:auto} .swiper-fade .swiper-slide-active .swiper-slide-active{pointer-events:auto} .swiper-cube{overflow:visible} .swiper-cube .swiper-slide{pointer-events:none;backface-visibility:hidden;z-index:1;visibility:hidden;transform-origin:0 0;width:100%;height:100%} .swiper-cube .swiper-slide .swiper-slide{pointer-events:none} .swiper-cube.swiper-rtl .swiper-slide{transform-origin:100% 0} .swiper-cube .swiper-slide-active,.swiper-cube .swiper-slide-active .swiper-slide-active{pointer-events:auto} .swiper-cube .swiper-slide-active,.swiper-cube .swiper-slide-next,.swiper-cube .swiper-slide-prev{pointer-events:auto;visibility:visible} .swiper-cube .swiper-cube-shadow{position:absolute;left:0;bottom:0px;width:100%;height:100%;opacity:.6;z-index:0} .swiper-cube .swiper-cube-shadow:before{content:'';background:#000;position:absolute;left:0;top:0;bottom:0;right:0;filter:blur(50px)} .swiper-cube .swiper-slide-next+.swiper-slide{pointer-events:auto;visibility:visible} .swiper-cube .swiper-slide-shadow-cube.swiper-slide-shadow-bottom,.swiper-cube .swiper-slide-shadow-cube.swiper-slide-shadow-left,.swiper-cube .swiper-slide-shadow-cube.swiper-slide-shadow-right,.swiper-cube .swiper-slide-shadow-cube.swiper-slide-shadow-top{z-index:0;backface-visibility:hidden} .swiper-flip{overflow:visible} .swiper-flip .swiper-slide{pointer-events:none;backface-visibility:hidden;z-index:1} .swiper-flip .swiper-slide .swiper-slide{pointer-events:none} .swiper-flip .swiper-slide-active,.swiper-flip .swiper-slide-active .swiper-slide-active{pointer-events:auto} .swiper-flip .swiper-slide-shadow-flip.swiper-slide-shadow-bottom,.swiper-flip .swiper-slide-shadow-flip.swiper-slide-shadow-left,.swiper-flip .swiper-slide-shadow-flip.swiper-slide-shadow-right,.swiper-flip .swiper-slide-shadow-flip.swiper-slide-shadow-top{z-index:0;backface-visibility:hidden} .swiper-creative .swiper-slide{backface-visibility:hidden;overflow:hidden;transition-property:transform,opacity,height} .swiper-cards{overflow:visible} .swiper-cards .swiper-slide{transform-origin:center bottom;backface-visibility:hidden;overflow:hidden} /* Configure all fonts here */ /* @font-face { font-family: "Palatino Linotype"; src: url("../fonts/pala-regular.ttf") format("truetype"); font-weight: 400; } @font-face { font-family: "Palatino Linotype"; src: url("../fonts/pala-bold.ttf") format("truetype"); font-weight: 700; } */ @font-face { font-family: "STIX Two Text"; src: url(../fonts/STIXTwoText-VariableFont_wght.ttf?d333f6648cab719b60b734303be3b228) format("truetype"); } @font-face { font-family: "Inter"; src: url(../fonts/Inter-VariableFont_opsz,wght.ttf?e05c5f3d1fa6a3893d84c1eef4e89951) format("truetype"); } :root { --min-vw: 320; --min-vw-lg: 1280; --max-vw: 1920; /* convert to px */ --min-vw-px: calc(var(--min-vw) * 1px); --min-vw-lg-px: calc(var(--min-vw-lg) * 1px); --max-vw-px: calc(var(--max-vw) * 1px); /* font sizes at --max-vw (1920px and above) */ --text-d1: 80; --text-h1: 56; --text-h2: 48; --text-h3: 36; --text-h4: 28; --text-h5: 24; --text-h6: 20; --text-lg: 20; --text-md: 16; --text-sm: 14; --text-button: 18; --text-eyebrow: 18; --text-navigation: 18; /* font sizes at --max-vw (between 1280px and 1920px ) */ --text-d1-lg: 60; --text-h1-lg: 52; --text-h2-lg: 40; --text-h3-lg: 32; --text-h4-lg: 24; --text-h5-lg: 20; --text-h6-lg: 18; --text-lg-lg: 18; --text-md-lg: 16; --text-sm-lg: 14; --text-button-lg: 18; --text-eyebrow-lg: 18; --text-navigation-lg: 18; /* font sizes at --min-vw (320px) */ --text-d1-md: 44; --text-h1-md: 32; --text-h2-md: 28; --text-h3-md: 22; --text-h4-md: 18; --text-h5-md: 16; --text-h6-md: 16; --text-lg-md: 16; --text-md-md: 14; --text-sm-md: 12; --text-button-md: 16; --text-eyebrow-md: 16; --text-navigation-md: 16; } body { font-family: "Inter"; font-family: "Inter", sans-serif; } /* Configure website containers here */ :root { --container: 1880; --container-lg: 1720; --container-md: 1560; --container-sm: 1360; --container-xs: 1360; --container-md-px: 8.51%; --container-sm-px: 13.814%; --container-xs-px: 13.814%; --container-lg-px: 4%; } .container-base { max-width: 1920px; width: 100%; padding-left: 20px; padding-right: 20px; margin-left: auto; margin-right: auto; } @media (min-width: 640px) { .container-lg { padding: 0 var(--container-lg-px); } .container-md { padding: 0 var(--container-md-px); } .container-sm { padding: 0 var(--container-sm-px); } } @media (min-width: 480px) { .container-xs { padding: 0 var(--container-xs-px); } } .primary-menu > ul.menu{ display: flex; align-items: center; justify-content: space-between; gap: 20px} @media (min-width: 1536px){ .primary-menu > ul.menu{ gap: 60px}} .primary-menu > ul.menu > li{ --tw-text-opacity: 1; color: rgb(0 0 0 / var(--tw-text-opacity))} .primary-menu > ul.menu > li:hover{ --tw-text-opacity: 1; color: rgb(248 149 3 / var(--tw-text-opacity))} .primary-menu > ul.menu > .menu-item.current-menu-item{ border-bottom-width: 2.5px; --tw-border-opacity: 1; border-bottom-color: rgb(248 149 3 / var(--tw-border-opacity)); padding-bottom: 2px; transition-property: transform; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 300ms} .primary-menu > ul.menu > li > a { font-family: "STIX Two Text"; --max-fs: var(--text-base); --min-fs: var(--text-base-min); --slope: calc( (var(--max-fs) - var(--min-fs)) / (var(--max-vw) - var(--min-vw)) ); --min-fs-px: calc(var(--min-fs) * 1px); --max-fs-px: calc(var(--max-fs) * 1px); --fs-px: calc(var(--slope) * (100vw - var(--min-vw-px)) + var(--min-fs-px)); font-size: clamp(var(--min-fs-px), var(--fs-px), var(--max-fs-px)); --max-fs: var(--text-navigation); --min-fs: var(--text-navigation-md); } @media screen and (min-width: 320px) { .primary-menu > ul.menu > li > a { --min-vw: 320; --min-vw-px: calc(var(--min-vw) * 1px); --max-vw: 1279; --max-vw-px: calc(var(--max-vw) * 1px); --max-fs: var(--text-navigation-lg); --min-fs: var(--text-navigation-md); } } @media screen and (min-width: 1280px) { .primary-menu > ul.menu > li > a { --min-vw: 1280; --min-vw-px: calc(var(--min-vw) * 1px); --max-vw: 1920; --max-vw-px: calc(var(--max-vw) * 1px); --max-fs: var(--text-navigation); --min-fs: var(--text-navigation-lg); } } .primary-menu > ul.menu > li > a{ font-family: "STIX Two Text"; position: relative; font-family: "STIX Two Text", serif; font-weight: 600; line-height: 100%; transition-property: all; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 300ms} .primary-menu > ul.menu > li{ position: relative} .primary-menu > ul.menu > li::before{ position: absolute; left: 0px; bottom: -3px; height: 2px; width: 100%; transform-origin: left; --tw-scale-x: 0; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); --tw-bg-opacity: 1; background-color: rgb(248 149 3 / var(--tw-bg-opacity)); transition-property: transform; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 300ms; --tw-content: ""; content: var(--tw-content)} .primary-menu > ul.menu > li:hover::before{ --tw-scale-x: 1; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))} .primary-menu > ul.menu > li:nth-child(3) .sub-menu { /* top-[197%] */ position: absolute; left: 0px; top: 200%; z-index: 11; margin-top: 0.5rem; display: none; --tw-bg-opacity: 1; background-color: rgb(255 255 255 / var(--tw-bg-opacity)); --tw-shadow: 0 4px 20px 0 rgba(0,0,0,0.10) !important; --tw-shadow-colored: 0 4px 20px 0 var(--tw-shadow-color) !important; box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow) !important; transition-property: opacity; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 300ms; } .primary-menu > ul.menu > li:nth-child(3) .sub-menu > li { --max-fs: var(--text-base); --min-fs: var(--text-base-min); --slope: calc( (var(--max-fs) - var(--min-fs)) / (var(--max-vw) - var(--min-vw)) ); --min-fs-px: calc(var(--min-fs) * 1px); --max-fs-px: calc(var(--max-fs) * 1px); --fs-px: calc(var(--slope) * (100vw - var(--min-vw-px)) + var(--min-fs-px)); font-size: clamp(var(--min-fs-px), var(--fs-px), var(--max-fs-px)); --max-fs: var(--text-button); --min-fs: var(--text-button-md); } @media screen and (min-width: 320px) { .primary-menu > ul.menu > li:nth-child(3) .sub-menu > li { --min-vw: 320; --min-vw-px: calc(var(--min-vw) * 1px); --max-vw: 1279; --max-vw-px: calc(var(--max-vw) * 1px); --max-fs: var(--text-button-lg); --min-fs: var(--text-button-md); } } @media screen and (min-width: 1280px) { .primary-menu > ul.menu > li:nth-child(3) .sub-menu > li { --min-vw: 1280; --min-vw-px: calc(var(--min-vw) * 1px); --max-vw: 1920; --max-vw-px: calc(var(--max-vw) * 1px); --max-fs: var(--text-button); --min-fs: var(--text-button-lg); } } .primary-menu > ul.menu > li:nth-child(3) .sub-menu > li{ font-family: "STIX Two Text"; font-family: "STIX Two Text", serif; white-space: nowrap; padding-left: 28px; padding-right: 28px; padding-top: 0.75rem; padding-bottom: 0.75rem; font-weight: 600; line-height: 100%; --tw-text-opacity: 1; color: rgb(0 0 0 / var(--tw-text-opacity)); transition-property: all; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 300ms} .primary-menu > ul.menu > li:nth-child(3) .sub-menu > li:hover{ --tw-bg-opacity: 1; background-color: rgb(248 149 3 / var(--tw-bg-opacity))} .primary-menu > .menu > .menu-item-has-children > .sub-menu.show{ display: block} .primary-menu > .menu > .menu-item-has-children{ position: relative} .primary-menu > .menu > .menu-item-has-children::after { content: ""; position: absolute; top: 100%; left: 0; height: 40px; width: 100%; } .primary-menu > .menu > .menu-item-has-children:hover > a::after { text-decoration: underline; } .primary-menu > .menu > .menu-item-has-children > a{ position: relative; padding-right: 10px} .primary-menu > .menu > .menu-item-has-children > a::after { content: url('data:image/svg+xml,'); position: absolute; top: 50%; margin-left: 0.25rem; --tw-translate-y: -50%; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); } @media (min-width: 1536px){ .primary-menu > .menu > .menu-item-has-children > a::after{ margin-left: 0.75rem}} .primary-menu > .menu > .menu-item-has-children:hover > a::after { content: url('data:image/svg+xml,'); } /* @apply opacity-0 right-0 w-full translate-x-full transition-all duration-300; */ .header-fixed-bar.active{ width: 100%; --tw-translate-y: -0px; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); opacity: 1; transition-property: all; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 300ms} /* //for mobile */ .primary-menu-mobile > ul.menu-mobile{ display: flex; flex-direction: column; align-items: flex-start; gap: 20px} .primary-menu-mobile > ul.menu-mobile > li:nth-child(3){ position: relative} .primary-menu-mobile > ul.menu-mobile > li:nth-child(3) .sub-menu{ height: 0px; width: 100%; --tw-translate-y: 0px; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); opacity: 0; transition-property: opacity; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 300ms} .primary-menu-mobile > ul.menu-mobile > li > a{ margin-bottom: 0.5rem; display: inline-block} .primary-menu-mobile > ul.menu-mobile > li { font-family: "STIX Two Text"; --max-fs: var(--text-base); --min-fs: var(--text-base-min); --slope: calc( (var(--max-fs) - var(--min-fs)) / (var(--max-vw) - var(--min-vw)) ); --min-fs-px: calc(var(--min-fs) * 1px); --max-fs-px: calc(var(--max-fs) * 1px); --fs-px: calc(var(--slope) * (100vw - var(--min-vw-px)) + var(--min-fs-px)); font-size: clamp(var(--min-fs-px), var(--fs-px), var(--max-fs-px)); --max-fs: var(--text-navigation); --min-fs: var(--text-navigation-md); } @media screen and (min-width: 320px) { .primary-menu-mobile > ul.menu-mobile > li { --min-vw: 320; --min-vw-px: calc(var(--min-vw) * 1px); --max-vw: 1279; --max-vw-px: calc(var(--max-vw) * 1px); --max-fs: var(--text-navigation-lg); --min-fs: var(--text-navigation-md); } } @media screen and (min-width: 1280px) { .primary-menu-mobile > ul.menu-mobile > li { --min-vw: 1280; --min-vw-px: calc(var(--min-vw) * 1px); --max-vw: 1920; --max-vw-px: calc(var(--max-vw) * 1px); --max-fs: var(--text-navigation); --min-fs: var(--text-navigation-lg); } } .primary-menu-mobile > ul.menu-mobile > li{ font-family: "STIX Two Text"; position: relative; width: 100%; font-family: "STIX Two Text", serif; font-weight: 600; line-height: 100%; transition-property: all; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 300ms} .primary-menu-mobile > .menu-mobile > .menu-item-has-children > .sub-menu.show{ right: 0px; margin-top: 0.75rem; display: flex; height: 100%; width: 100%; --tw-translate-y: -0px; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); flex-direction: column; align-items: flex-start; gap: 0.5rem; opacity: 1; transition-property: opacity; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 300ms} .primary-menu-mobile > .menu-mobile > .menu-item-has-children > a{ position: relative; display: inline-block; width: 100%} .primary-menu-mobile > .menu-mobile > .menu-item-has-children > a::after{ position: absolute; right: 0px; content: url('data:image/svg+xml,')} .primary-menu-mobile > .menu-mobile > .menu-item-has-children:has(.show) > a::after{ --tw-rotate: 180deg; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); content: url('data:image/svg+xml,')} .primary-menu-mobile > ul.menu-mobile > li:nth-child(3) a.show{ display: inline-block; border-bottom-width: 1px; --tw-border-opacity: 1; border-bottom-color: rgb(248 149 3 / var(--tw-border-opacity))} .our-factory-section-page .swiper-pagination-bullet{ height: 0.75rem; width: 0.75rem; border-radius: 9999px; --tw-bg-opacity: 1; background-color: rgb(204 204 204 / var(--tw-bg-opacity)); opacity: 0.5} .our-factory-section-page .swiper-pagination-bullet-active{ --tw-bg-opacity: 1; background-color: rgb(248 149 3 / var(--tw-bg-opacity)); opacity: 1} .our-factory-section-page .swiper-slide{ height: 90%} @media (min-width: 480px){ .our-factory-section-page .swiper-slide{ height: 94%}} @media (min-width: 768px){ .our-factory-section-page .swiper-slide{ height: 92%}} @media (min-width: 1024px){ .our-factory-section-page .swiper-slide{ height: 94%}} @media (min-width: 1280px){ .our-factory-section-page .swiper-slide{ height: 96%}} #prev-btn:enabled:hover svg, #next-btn:enabled:hover svg { color: white; } #prev-btn:enabled:hover, #next-btn:enabled:hover { background-color: #ED7D31; } .hide-scrollbar { -ms-overflow-style: none; scrollbar-width: none; } .hide-scrollbar::-webkit-scrollbar { display: none; } /* @layer utilities { .bg-connect-sm { background-image: url('../images/connect/bg-connect-sm.jpg'); } @media (min-width: 768px) { .md\:bg-connect-us { background-image: url('../images/connect/bg-connect-us.png'); } } } */ .bg-connect-sm { /* background-image: url("../images/connect/bg-connect-sm.jpg"); */ } @media (min-width: 768px) { .md\:bg-connect-us { /* background-image: url("../images/connect/bg-connect-us.png"); */ } } .footer-navigation-menu.footer.quick-links{ width: 100%} .footer-navigation-menu.footer.quick-links > .footer-menu{ display: grid; grid-template-columns: repeat(1, minmax(0, 1fr)); gap: 32px} @media (min-width: 640px){ .footer-navigation-menu.footer.quick-links > .footer-menu{ grid-template-columns: 150px 150px}} @media (min-width: 768px){ .footer-navigation-menu.footer.quick-links > .footer-menu{ grid-template-columns: 170px 170px}} @media (min-width: 1024px){ .footer-navigation-menu.footer.quick-links > .footer-menu{ grid-template-columns: 200px 200px; gap: 2.5rem}} @media (min-width: 1440px){ .footer-navigation-menu.footer.quick-links > .footer-menu{ grid-template-columns: 260px 260px}} .footer-menu > .menu-item-has-children { /* @apply mb-4; */ } .footer-menu > .menu-item-has-children > a { font-family: "STIX Two Text"; --max-fs: var(--text-base); --min-fs: var(--text-base-min); --slope: calc( (var(--max-fs) - var(--min-fs)) / (var(--max-vw) - var(--min-vw)) ); --min-fs-px: calc(var(--min-fs) * 1px); --max-fs-px: calc(var(--max-fs) * 1px); --fs-px: calc(var(--slope) * (100vw - var(--min-vw-px)) + var(--min-fs-px)); font-size: clamp(var(--min-fs-px), var(--fs-px), var(--max-fs-px)); --max-fs: var(--text-navigation); --min-fs: var(--text-navigation-md); } @media screen and (min-width: 320px) { .footer-menu > .menu-item-has-children > a { --min-vw: 320; --min-vw-px: calc(var(--min-vw) * 1px); --max-vw: 1279; --max-vw-px: calc(var(--max-vw) * 1px); --max-fs: var(--text-navigation-lg); --min-fs: var(--text-navigation-md); } } @media screen and (min-width: 1280px) { .footer-menu > .menu-item-has-children > a { --min-vw: 1280; --min-vw-px: calc(var(--min-vw) * 1px); --max-vw: 1920; --max-vw-px: calc(var(--max-vw) * 1px); --max-fs: var(--text-navigation); --min-fs: var(--text-navigation-lg); } } .footer-menu > .menu-item-has-children > a{ font-family: "STIX Two Text"; position: relative; margin-bottom: 1.25rem; display: inline-block; width: 100%; border-bottom-width: 1px; --tw-border-opacity: 1; border-bottom-color: rgb(248 149 3 / var(--tw-border-opacity)); padding-bottom: 0.25rem; text-align: start; font-family: "STIX Two Text", serif; font-weight: 600; line-height: 100%; --tw-text-opacity: 1; color: rgb(255 255 255 / var(--tw-text-opacity))} /* .footer-menu > .menu-item-has-children > .sub-menu > li { @apply mb-4; } */ .footer-menu > .menu-item-has-children > .sub-menu > li > a { font-family: "Inter"; --max-fs: var(--text-base); --min-fs: var(--text-base-min); --slope: calc( (var(--max-fs) - var(--min-fs)) / (var(--max-vw) - var(--min-vw)) ); --min-fs-px: calc(var(--min-fs) * 1px); --max-fs-px: calc(var(--max-fs) * 1px); --fs-px: calc(var(--slope) * (100vw - var(--min-vw-px)) + var(--min-fs-px)); font-size: clamp(var(--min-fs-px), var(--fs-px), var(--max-fs-px)); --max-fs: var(--text-md); --min-fs: var(--text-md-md); } @media screen and (min-width: 320px) { .footer-menu > .menu-item-has-children > .sub-menu > li > a { --min-vw: 320; --min-vw-px: calc(var(--min-vw) * 1px); --max-vw: 1279; --max-vw-px: calc(var(--max-vw) * 1px); --max-fs: var(--text-md-lg); --min-fs: var(--text-md-md); } } @media screen and (min-width: 1280px) { .footer-menu > .menu-item-has-children > .sub-menu > li > a { --min-vw: 1280; --min-vw-px: calc(var(--min-vw) * 1px); --max-vw: 1920; --max-vw-px: calc(var(--max-vw) * 1px); --max-fs: var(--text-md); --min-fs: var(--text-md-lg); } } .footer-menu > .menu-item-has-children > .sub-menu > li > a{ margin-bottom: 0.75rem; display: inline-block; text-align: center; font-family: "Inter", sans-serif; font-weight: 400; line-height: 150%; --tw-text-opacity: 1; color: rgb(255 255 255 / var(--tw-text-opacity)); transition-property: all; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 300ms} .footer-menu > .menu-item-has-children > .sub-menu > li > a:hover{ --tw-text-opacity: 1; color: rgb(248 149 3 / var(--tw-text-opacity))} .copy-right-footers > a { font-family: "Inter"; --max-fs: var(--text-base); --min-fs: var(--text-base-min); --slope: calc( (var(--max-fs) - var(--min-fs)) / (var(--max-vw) - var(--min-vw)) ); --min-fs-px: calc(var(--min-fs) * 1px); --max-fs-px: calc(var(--max-fs) * 1px); --fs-px: calc(var(--slope) * (100vw - var(--min-vw-px)) + var(--min-fs-px)); font-size: clamp(var(--min-fs-px), var(--fs-px), var(--max-fs-px)); --max-fs: var(--text-sm); --min-fs: var(--text-sm-md); } @media screen and (min-width: 320px) { .copy-right-footers > a { --min-vw: 320; --min-vw-px: calc(var(--min-vw) * 1px); --max-vw: 1279; --max-vw-px: calc(var(--max-vw) * 1px); --max-fs: var(--text-sm-lg); --min-fs: var(--text-sm-md); } } @media screen and (min-width: 1280px) { .copy-right-footers > a { --min-vw: 1280; --min-vw-px: calc(var(--min-vw) * 1px); --max-vw: 1920; --max-vw-px: calc(var(--max-vw) * 1px); --max-fs: var(--text-sm); --min-fs: var(--text-sm-lg); } } .copy-right-footers > a{ font-family: "Inter", sans-serif; font-weight: 400; line-height: 160%; --tw-text-opacity: 1; color: rgb(255 255 255 / var(--tw-text-opacity)); opacity: 0.5; transition-property: all; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 300ms} .copy-right-footers > a:hover{ --tw-text-opacity: 1; color: rgb(248 149 3 / var(--tw-text-opacity))} .gf_browser_chrome.gform_wrapper.gform-theme.gform-theme--foundation.gform-theme--framework.gform-theme--orbital{ width: 100% !important} .gform-footer.gform_footer.top_label .gform_button.button { font-family: "STIX Two Text" !important; --max-fs: var(--text-base); --min-fs: var(--text-base-min); --slope: calc( (var(--max-fs) - var(--min-fs)) / (var(--max-vw) - var(--min-vw)) ); --min-fs-px: calc(var(--min-fs) * 1px); --max-fs-px: calc(var(--max-fs) * 1px); --fs-px: calc(var(--slope) * (100vw - var(--min-vw-px)) + var(--min-fs-px)); font-size: clamp(var(--min-fs-px), var(--fs-px), var(--max-fs-px)); --max-fs: var(--text-button) !important; --min-fs: var(--text-button-md) !important; } @media screen and (min-width: 320px) { .gform-footer.gform_footer.top_label .gform_button.button { --min-vw: 320 !important; --min-vw-px: calc(var(--min-vw) * 1px) !important; --max-vw: 1279 !important; --max-vw-px: calc(var(--max-vw) * 1px) !important; --max-fs: var(--text-button-lg) !important; --min-fs: var(--text-button-md) !important; } } @media screen and (min-width: 1280px) { .gform-footer.gform_footer.top_label .gform_button.button { --min-vw: 1280 !important; --min-vw-px: calc(var(--min-vw) * 1px) !important; --max-vw: 1920 !important; --max-vw-px: calc(var(--max-vw) * 1px) !important; --max-fs: var(--text-button) !important; --min-fs: var(--text-button-lg) !important; } } .gform-footer.gform_footer.top_label .gform_button.button{ font-family: "STIX Two Text"; --tw-bg-opacity: 1 !important; background-color: rgb(62 60 60 / var(--tw-bg-opacity)) !important; padding-top: 1rem !important; padding-bottom: 1rem !important; padding-left: 28px !important; padding-right: 28px !important; font-family: "STIX Two Text", serif !important; font-weight: 600 !important; line-height: 100% !important; --tw-text-opacity: 1 !important; color: rgb(255 255 255 / var(--tw-text-opacity)) !important; transition-property: all; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 300ms} .gform-footer.gform_footer.top_label .gform_button.button:hover{ --tw-bg-opacity: 1 !important; background-color: rgb(248 149 3 / var(--tw-bg-opacity)) !important; --tw-text-opacity: 1 !important; color: rgb(0 0 0 / var(--tw-text-opacity)) !important} .gform-field-label.gform-field-label--type-inline > a{ text-decoration-line: underline !important; text-decoration-color: #333333 !important; text-decoration-thickness: 1px !important; text-underline-offset: 2px !important} .gform-field-label.gform-field-label--type-inline { font-family: "Inter" !important; --max-fs: var(--text-base); --min-fs: var(--text-base-min); --slope: calc( (var(--max-fs) - var(--min-fs)) / (var(--max-vw) - var(--min-vw)) ); --min-fs-px: calc(var(--min-fs) * 1px); --max-fs-px: calc(var(--max-fs) * 1px); --fs-px: calc(var(--slope) * (100vw - var(--min-vw-px)) + var(--min-fs-px)); font-size: clamp(var(--min-fs-px), var(--fs-px), var(--max-fs-px)); --max-fs: var(--text-md) !important; --min-fs: var(--text-md-md) !important; } @media screen and (min-width: 320px) { .gform-field-label.gform-field-label--type-inline { --min-vw: 320 !important; --min-vw-px: calc(var(--min-vw) * 1px) !important; --max-vw: 1279 !important; --max-vw-px: calc(var(--max-vw) * 1px) !important; --max-fs: var(--text-md-lg) !important; --min-fs: var(--text-md-md) !important; } } @media screen and (min-width: 1280px) { .gform-field-label.gform-field-label--type-inline { --min-vw: 1280 !important; --min-vw-px: calc(var(--min-vw) * 1px) !important; --max-vw: 1920 !important; --max-vw-px: calc(var(--max-vw) * 1px) !important; --max-fs: var(--text-md) !important; --min-fs: var(--text-md-lg) !important; } } .gform-field-label.gform-field-label--type-inline{ margin-bottom: 1.25rem !important; font-family: "Inter", sans-serif !important; font-weight: 400 !important; line-height: 150% !important; --tw-text-opacity: 1 !important; color: rgb(51 51 51 / var(--tw-text-opacity)) !important} .ginput_container.ginput_container_text input[type="text"], .ginput_container.ginput_container_phone input[type="tel"], .ginput_container.ginput_container_email input[type="email"], .ginput_container.ginput_container_textarea textarea { font-family: "Inter" !important; --max-fs: var(--text-base); --min-fs: var(--text-base-min); --slope: calc( (var(--max-fs) - var(--min-fs)) / (var(--max-vw) - var(--min-vw)) ); --min-fs-px: calc(var(--min-fs) * 1px); --max-fs-px: calc(var(--max-fs) * 1px); --fs-px: calc(var(--slope) * (100vw - var(--min-vw-px)) + var(--min-fs-px)); font-size: clamp(var(--min-fs-px), var(--fs-px), var(--max-fs-px)); --max-fs: var(--text-md) !important; --min-fs: var(--text-md-md) !important; } @media screen and (min-width: 320px) { .ginput_container.ginput_container_text input[type="text"], .ginput_container.ginput_container_phone input[type="tel"], .ginput_container.ginput_container_email input[type="email"], .ginput_container.ginput_container_textarea textarea { --min-vw: 320 !important; --min-vw-px: calc(var(--min-vw) * 1px) !important; --max-vw: 1279 !important; --max-vw-px: calc(var(--max-vw) * 1px) !important; --max-fs: var(--text-md-lg) !important; --min-fs: var(--text-md-md) !important; } } @media screen and (min-width: 1280px) { .ginput_container.ginput_container_text input[type="text"], .ginput_container.ginput_container_phone input[type="tel"], .ginput_container.ginput_container_email input[type="email"], .ginput_container.ginput_container_textarea textarea { --min-vw: 1280 !important; --min-vw-px: calc(var(--min-vw) * 1px) !important; --max-vw: 1920 !important; --max-vw-px: calc(var(--max-vw) * 1px) !important; --max-fs: var(--text-md) !important; --min-fs: var(--text-md-lg) !important; } } .ginput_container.ginput_container_text input[type="text"], .ginput_container.ginput_container_phone input[type="tel"], .ginput_container.ginput_container_email input[type="email"], .ginput_container.ginput_container_textarea textarea{ height: 45px !important; border-radius: 4px; border-width: 1px; --tw-border-opacity: 1; border-color: rgb(204 204 204 / var(--tw-border-opacity)); font-family: "Inter", sans-serif !important; font-weight: 400 !important; line-height: 150% !important; --tw-text-opacity: 1 !important; color: rgb(51 51 51 / var(--tw-text-opacity)) !important; transition-property: all !important; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1) !important; transition-duration: 300ms !important} .ginput_container.ginput_container_text input[type="text"]:focus, .ginput_container.ginput_container_phone input[type="tel"]:focus, .ginput_container.ginput_container_email input[type="email"]:focus, .ginput_container.ginput_container_textarea textarea:focus{ --tw-shadow: 0 0 #0000 !important; --tw-shadow-colored: 0 0 #0000 !important; box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow) !important; outline: 2px solid transparent !important; outline-offset: 2px !important; --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color) !important; --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color) !important; box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000) !important; --tw-ring-opacity: 1 !important; --tw-ring-color: rgb(237 125 49 / var(--tw-ring-opacity)) !important; --tw-ring-offset-width: 0px !important} .gfield.gfield--type-textarea .gfield_label.gform-field-label, .gfield.gfield--type-text .gfield_label.gform-field-label, .gfield.gfield--type-phone .gfield_label.gform-field-label, .gfield.gfield--type-email .gfield_label.gform-field-label { font-family: "Inter" !important; --max-fs: var(--text-base); --min-fs: var(--text-base-min); --slope: calc( (var(--max-fs) - var(--min-fs)) / (var(--max-vw) - var(--min-vw)) ); --min-fs-px: calc(var(--min-fs) * 1px); --max-fs-px: calc(var(--max-fs) * 1px); --fs-px: calc(var(--slope) * (100vw - var(--min-vw-px)) + var(--min-fs-px)); font-size: clamp(var(--min-fs-px), var(--fs-px), var(--max-fs-px)); --max-fs: var(--text-md) !important; --min-fs: var(--text-md-md) !important; } @media screen and (min-width: 320px) { .gfield.gfield--type-textarea .gfield_label.gform-field-label, .gfield.gfield--type-text .gfield_label.gform-field-label, .gfield.gfield--type-phone .gfield_label.gform-field-label, .gfield.gfield--type-email .gfield_label.gform-field-label { --min-vw: 320 !important; --min-vw-px: calc(var(--min-vw) * 1px) !important; --max-vw: 1279 !important; --max-vw-px: calc(var(--max-vw) * 1px) !important; --max-fs: var(--text-md-lg) !important; --min-fs: var(--text-md-md) !important; } } @media screen and (min-width: 1280px) { .gfield.gfield--type-textarea .gfield_label.gform-field-label, .gfield.gfield--type-text .gfield_label.gform-field-label, .gfield.gfield--type-phone .gfield_label.gform-field-label, .gfield.gfield--type-email .gfield_label.gform-field-label { --min-vw: 1280 !important; --min-vw-px: calc(var(--min-vw) * 1px) !important; --max-vw: 1920 !important; --max-vw-px: calc(var(--max-vw) * 1px) !important; --max-fs: var(--text-md) !important; --min-fs: var(--text-md-lg) !important; } } .gfield.gfield--type-textarea .gfield_label.gform-field-label, .gfield.gfield--type-text .gfield_label.gform-field-label, .gfield.gfield--type-phone .gfield_label.gform-field-label, .gfield.gfield--type-email .gfield_label.gform-field-label{ margin-bottom: 0.5rem !important; font-family: "Inter", sans-serif !important; font-weight: 400 !important; line-height: 150% !important; --tw-text-opacity: 1 !important; color: rgb(51 51 51 / var(--tw-text-opacity)) !important} .ginput_container.ginput_container_text input[type="text"]::-moz-placeholder, .ginput_container.ginput_container_phone input[type="tel"]::-moz-placeholder, .ginput_container.ginput_container_email input[type="email"]::-moz-placeholder, .ginput_container.ginput_container_textarea textarea::-moz-placeholder { font-family: "Inter" !important; --max-fs: var(--text-base); --min-fs: var(--text-base-min); --slope: calc( (var(--max-fs) - var(--min-fs)) / (var(--max-vw) - var(--min-vw)) ); --min-fs-px: calc(var(--min-fs) * 1px); --max-fs-px: calc(var(--max-fs) * 1px); --fs-px: calc(var(--slope) * (100vw - var(--min-vw-px)) + var(--min-fs-px)); font-size: clamp(var(--min-fs-px), var(--fs-px), var(--max-fs-px)); --max-fs: var(--text-md) !important; --min-fs: var(--text-md-md) !important; } .ginput_container.ginput_container_text input[type="text"]::placeholder, .ginput_container.ginput_container_phone input[type="tel"]::placeholder, .ginput_container.ginput_container_email input[type="email"]::placeholder, .ginput_container.ginput_container_textarea textarea::placeholder { font-family: "Inter" !important; --max-fs: var(--text-base); --min-fs: var(--text-base-min); --slope: calc( (var(--max-fs) - var(--min-fs)) / (var(--max-vw) - var(--min-vw)) ); --min-fs-px: calc(var(--min-fs) * 1px); --max-fs-px: calc(var(--max-fs) * 1px); --fs-px: calc(var(--slope) * (100vw - var(--min-vw-px)) + var(--min-fs-px)); font-size: clamp(var(--min-fs-px), var(--fs-px), var(--max-fs-px)); --max-fs: var(--text-md) !important; --min-fs: var(--text-md-md) !important; } @media screen and (min-width: 320px) { .ginput_container.ginput_container_text input[type="text"]::-moz-placeholder, .ginput_container.ginput_container_phone input[type="tel"]::-moz-placeholder, .ginput_container.ginput_container_email input[type="email"]::-moz-placeholder, .ginput_container.ginput_container_textarea textarea::-moz-placeholder { --min-vw: 320 !important; --min-vw-px: calc(var(--min-vw) * 1px) !important; --max-vw: 1279 !important; --max-vw-px: calc(var(--max-vw) * 1px) !important; --max-fs: var(--text-md-lg) !important; --min-fs: var(--text-md-md) !important; } .ginput_container.ginput_container_text input[type="text"]::placeholder, .ginput_container.ginput_container_phone input[type="tel"]::placeholder, .ginput_container.ginput_container_email input[type="email"]::placeholder, .ginput_container.ginput_container_textarea textarea::placeholder { --min-vw: 320 !important; --min-vw-px: calc(var(--min-vw) * 1px) !important; --max-vw: 1279 !important; --max-vw-px: calc(var(--max-vw) * 1px) !important; --max-fs: var(--text-md-lg) !important; --min-fs: var(--text-md-md) !important; } } @media screen and (min-width: 1280px) { .ginput_container.ginput_container_text input[type="text"]::-moz-placeholder, .ginput_container.ginput_container_phone input[type="tel"]::-moz-placeholder, .ginput_container.ginput_container_email input[type="email"]::-moz-placeholder, .ginput_container.ginput_container_textarea textarea::-moz-placeholder { --min-vw: 1280 !important; --min-vw-px: calc(var(--min-vw) * 1px) !important; --max-vw: 1920 !important; --max-vw-px: calc(var(--max-vw) * 1px) !important; --max-fs: var(--text-md) !important; --min-fs: var(--text-md-lg) !important; } .ginput_container.ginput_container_text input[type="text"]::placeholder, .ginput_container.ginput_container_phone input[type="tel"]::placeholder, .ginput_container.ginput_container_email input[type="email"]::placeholder, .ginput_container.ginput_container_textarea textarea::placeholder { --min-vw: 1280 !important; --min-vw-px: calc(var(--min-vw) * 1px) !important; --max-vw: 1920 !important; --max-vw-px: calc(var(--max-vw) * 1px) !important; --max-fs: var(--text-md) !important; --min-fs: var(--text-md-lg) !important; } } .ginput_container.ginput_container_text input[type="text"]::-moz-placeholder, .ginput_container.ginput_container_phone input[type="tel"]::-moz-placeholder, .ginput_container.ginput_container_email input[type="email"]::-moz-placeholder, .ginput_container.ginput_container_textarea textarea::-moz-placeholder{ font-family: "Inter", sans-serif !important; font-weight: 400 !important; line-height: 150% !important; --tw-text-opacity: 1 !important; color: rgb(102 102 102 / var(--tw-text-opacity)) !important; opacity: 0.5 !important} .ginput_container.ginput_container_text input[type="text"]::placeholder, .ginput_container.ginput_container_phone input[type="tel"]::placeholder, .ginput_container.ginput_container_email input[type="email"]::placeholder, .ginput_container.ginput_container_textarea textarea::placeholder{ font-family: "Inter", sans-serif !important; font-weight: 400 !important; line-height: 150% !important; --tw-text-opacity: 1 !important; color: rgb(102 102 102 / var(--tw-text-opacity)) !important; opacity: 0.5 !important} /* Last Name * */ .gfield_label.gform-field-label .gfield_required::before { font-family: "Inter" !important; --max-fs: var(--text-base); --min-fs: var(--text-base-min); --slope: calc( (var(--max-fs) - var(--min-fs)) / (var(--max-vw) - var(--min-vw)) ); --min-fs-px: calc(var(--min-fs) * 1px); --max-fs-px: calc(var(--max-fs) * 1px); --fs-px: calc(var(--slope) * (100vw - var(--min-vw-px)) + var(--min-fs-px)); font-size: clamp(var(--min-fs-px), var(--fs-px), var(--max-fs-px)); --max-fs: var(--text-md) !important; --min-fs: var(--text-md-md) !important; } @media screen and (min-width: 320px) { .gfield_label.gform-field-label .gfield_required::before { --min-vw: 320 !important; --min-vw-px: calc(var(--min-vw) * 1px) !important; --max-vw: 1279 !important; --max-vw-px: calc(var(--max-vw) * 1px) !important; --max-fs: var(--text-md-lg) !important; --min-fs: var(--text-md-md) !important; } } @media screen and (min-width: 1280px) { .gfield_label.gform-field-label .gfield_required::before { --min-vw: 1280 !important; --min-vw-px: calc(var(--min-vw) * 1px) !important; --max-vw: 1920 !important; --max-vw-px: calc(var(--max-vw) * 1px) !important; --max-fs: var(--text-md) !important; --min-fs: var(--text-md-lg) !important; } } .gfield_label.gform-field-label .gfield_required::before{ margin-left: 0.25rem !important; font-family: "Inter", sans-serif !important; font-weight: 400 !important; line-height: 150% !important; --tw-text-opacity: 1 !important; color: rgb(248 113 113 / var(--tw-text-opacity)) !important; --tw-content: '*' !important; content: var(--tw-content) !important} .gfield_label.gform-field-label .gfield_required .gfield_required.gfield_required_text{ display: none !important} .gfield_label.gform-field-label .gfield_required{ position: relative !important; font-weight: 0px !important} .ginput_container.ginput_container_checkbox .gfield_checkbox .gchoice .gfield-choice-input{ border-radius: 4px !important; border-width: 1px !important; --tw-border-opacity: 1 !important; border-color: rgb(153 153 153 / var(--tw-border-opacity)) !important} .ginput_container.ginput_container_checkbox .gfield_checkbox .gchoice .gfield-choice-input:focus{ --tw-shadow: 0 0 #0000 !important; --tw-shadow-colored: 0 0 #0000 !important; box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow) !important; outline: 2px solid transparent !important; outline-offset: 2px !important} .ginput_container.ginput_container_checkbox .gfield_checkbox .gchoice .gfield-choice-input:checked{ --tw-bg-opacity: 1 !important; background-color: rgb(248 149 3 / var(--tw-bg-opacity)) !important} .ginput_container.ginput_container_checkbox .gfield_checkbox .gchoice .gfield-choice-input::before{ --tw-text-opacity: 1 !important; color: rgb(255 255 255 / var(--tw-text-opacity)) !important} .gform-body.gform_body .gform_fields.top_label.form_sublabel_below.description_below.validation_below { -moz-column-gap: 20px !important; column-gap: 20px !important; row-gap: 20px !important; } .our-factory-image-wrapper .swiper-slide{ height: 88% !important} @media (min-width: 480px){ .our-factory-image-wrapper .swiper-slide{ height: 92% !important}} @media (min-width: 768px){ .our-factory-image-wrapper .swiper-slide{ height: 93% !important}} @media (min-width: 1024px){ .our-factory-image-wrapper .swiper-slide{ height: 94% !important}} @media (min-width: 1280px){ .our-factory-image-wrapper .swiper-slide{ height: 92% !important}} @media (min-width: 1366px){ .our-factory-image-wrapper .swiper-slide{ height: 93% !important}} @media (min-width: 1536px){ .our-factory-image-wrapper .swiper-slide{ height: 93% !important}} @media (min-width: 1920px){ .our-factory-image-wrapper .swiper-slide{ height: 94% !important}} .our-factory-image-wrapper .swiper-pagination-bullet{ height: 0.75rem; width: 0.75rem; border-radius: 9999px; --tw-bg-opacity: 1; background-color: rgb(204 204 204 / var(--tw-bg-opacity)); opacity: 0.5} .our-factory-image-wrapper .swiper-pagination-bullet-active{ --tw-bg-opacity: 1; background-color: rgb(248 149 3 / var(--tw-bg-opacity)); opacity: 1} .our-factory-image-wrapper .swiper { width: 100%; } .qualification .mySwipers-qualification .swiper-pagination{ position: relative; bottom: auto; margin-top: 0.75rem} @media (min-width: 1280px){ .qualification .mySwipers-qualification .swiper-pagination{ margin-top: 1.25rem}} .qualification .swiper-pagination-bullet{ height: 0.75rem; width: 0.75rem; border-radius: 9999px; --tw-bg-opacity: 1; background-color: rgb(204 204 204 / var(--tw-bg-opacity)); opacity: 0.5} .qualification .swiper-pagination-bullet-active{ --tw-scale-x: 1.25 !important; --tw-scale-y: 1.25 !important; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)) !important; --tw-bg-opacity: 1; background-color: rgb(248 149 3 / var(--tw-bg-opacity)); opacity: 1} .qualification .swiper { width: 100%; } .breadcrumbs.event-breadcrumb > a{ position: relative; padding-right: 1.25rem; opacity: 0.5} .breadcrumbs.event-breadcrumb > a::before{ position: absolute; top: 0px; right: 0px; padding-right: 10px; --tw-text-opacity: 1; color: rgb(0 0 0 / var(--tw-text-opacity)); --tw-content: "/"; content: var(--tw-content)} .swiper.mySwiper-detail::before { /* @apply !w-[26px] !h-[16px]; content: "" !important; background-image: url('data:image/svg+xml,') !important; background-repeat: no-repeat !important; background-position: center !important; background-size: 24px 24px !important; */ } .product-detail-swipper { /* .swiper-button-next, .swiper-button-prev { @apply absolute shadow-[0_0_8px_0_rgba(0,0,0,0.15)] !bottom-[7%] 2xl:!bottom-[5%] lg:!bottom-[3%] !top-auto z-[9] bg-light-orange rounded-full !w-[30px] !h-[30px] lg:!w-[36px] lg:!h-[36px] 3xl:!w-[56px] 3xl:!h-[56px] flex items-center justify-center cursor-pointer; } .swiper-wrapper { @apply flex relative z-50 w-full !h-auto; } .swiper { } .swiper-slide { } .slider1-wrapper > .swiper-slide img { @apply block object-cover aspect-[740/416]; } .swiper { width: 100%; } .swiper-slide { background-size: cover; background-position: center; } .mySwiper2 { @apply w-full lg:max-h-[427px]; } .mySwiper-detail { @apply pt-[10px] lg:pt-5; } .mySwiper-detail .swiper-slide { width: 25%; height: 100%; opacity: 0.4; } .mySwiper-detail .swiper-slide-thumb-active { opacity: 1; } .slider2-wrapper > .swiper-slide img { @apply aspect-[114/114] object-cover; } */ } .product-detail-swipper .swiper-button-next::after { content: "" !important; background-image: url('data:image/svg+xml,'); background-repeat: no-repeat !important; background-position: center !important; background-size: 24px 24px !important; height: 1.25rem !important; width: 1.25rem !important; } @media (min-width: 1024px){ .product-detail-swipper .swiper-button-next::after{ height: 25px !important; width: 25px !important}} .product-detail-swipper .swiper-button-prev::after { content: "" !important; background-image:url('data:image/svg+xml,'); background-repeat: no-repeat !important; background-position: center !important; background-size: 24px 24px !important; height: 1.25rem !important; width: 1.25rem !important; } @media (min-width: 1024px){ .product-detail-swipper .swiper-button-prev::after{ height: 25px !important; width: 25px !important}} /* .swiper-button-next { @apply relative ; } */ .product-detail-swipper .swiper-button-next::after { /* @apply text-[0px]; */ } html{ scroll-behavior: smooth} .btn-primary { --max-fs: var(--text-base); --min-fs: var(--text-base-min); --slope: calc( (var(--max-fs) - var(--min-fs)) / (var(--max-vw) - var(--min-vw)) ); --min-fs-px: calc(var(--min-fs) * 1px); --max-fs-px: calc(var(--max-fs) * 1px); --fs-px: calc(var(--slope) * (100vw - var(--min-vw-px)) + var(--min-fs-px)); font-size: clamp(var(--min-fs-px), var(--fs-px), var(--max-fs-px)); --max-fs: var(--text-button); --min-fs: var(--text-button-md); } @media screen and (min-width: 320px) { .btn-primary { --min-vw: 320; --min-vw-px: calc(var(--min-vw) * 1px); --max-vw: 1279; --max-vw-px: calc(var(--max-vw) * 1px); --max-fs: var(--text-button-lg); --min-fs: var(--text-button-md); } } @media screen and (min-width: 1280px) { .btn-primary { --min-vw: 1280; --min-vw-px: calc(var(--min-vw) * 1px); --max-vw: 1920; --max-vw-px: calc(var(--max-vw) * 1px); --max-fs: var(--text-button); --min-fs: var(--text-button-lg); } } .btn-primary{ font-weight: 600; line-height: 100%; font-family: "STIX Two Text"; font-family: "STIX Two Text", serif; display: inline-block; cursor: pointer; --tw-bg-opacity: 1; background-color: rgb(62 60 60 / var(--tw-bg-opacity)); padding-top: 0.75rem; padding-bottom: 0.75rem; padding-left: 1.5rem; padding-right: 1.5rem; --tw-text-opacity: 1; color: rgb(255 255 255 / var(--tw-text-opacity))} .btn-primary:hover{ --tw-bg-opacity: 1; background-color: rgb(248 149 3 / var(--tw-bg-opacity)); --tw-text-opacity: 1; color: rgb(0 0 0 / var(--tw-text-opacity))} @media (min-width: 1440px){ .btn-primary{ padding-top: 1rem; padding-bottom: 1rem}} @media (min-width: 1536px){ .btn-primary{ padding-left: 1.75rem; padding-right: 1.75rem}} .disabled-now{ pointer-events: none; opacity: 0.2} .first\:pl-0:first-child{ padding-left: 0px} .last\:border-0:last-child{ border-width: 0px} .last\:pr-0:last-child{ padding-right: 0px} .hover\:-translate-y-2:hover{ --tw-translate-y: -0.5rem; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))} .hover\:scale-110:hover{ --tw-scale-x: 1.1; --tw-scale-y: 1.1; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))} .hover\:scale-x-100:hover{ --tw-scale-x: 1; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))} .hover\:\!bg-logo-orange:hover{ --tw-bg-opacity: 1 !important; background-color: rgb(248 149 3 / var(--tw-bg-opacity)) !important} .hover\:bg-logo-green:hover{ --tw-bg-opacity: 1; background-color: rgb(3 75 34 / var(--tw-bg-opacity))} .hover\:bg-logo-orange:hover{ --tw-bg-opacity: 1; background-color: rgb(248 149 3 / var(--tw-bg-opacity))} .hover\:bg-primary-orange:hover{ --tw-bg-opacity: 1; background-color: rgb(237 125 49 / var(--tw-bg-opacity))} .hover\:\!text-black:hover{ --tw-text-opacity: 1 !important; color: rgb(0 0 0 / var(--tw-text-opacity)) !important} .hover\:text-black:hover{ --tw-text-opacity: 1; color: rgb(0 0 0 / var(--tw-text-opacity))} .hover\:text-black-40:hover{ --tw-text-opacity: 1; color: rgb(153 153 153 / var(--tw-text-opacity))} .hover\:text-logo-orange:hover{ --tw-text-opacity: 1; color: rgb(248 149 3 / var(--tw-text-opacity))} .hover\:text-primary-orange:hover{ --tw-text-opacity: 1; color: rgb(237 125 49 / var(--tw-text-opacity))} .hover\:underline-offset-2:hover{ text-underline-offset: 2px} .focus\:\!shadow-none:focus{ --tw-shadow: 0 0 #0000 !important; --tw-shadow-colored: 0 0 #0000 !important; box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow) !important} .focus\:\!outline-none:focus{ outline: 2px solid transparent !important; outline-offset: 2px !important} .focus\:outline-none:focus{ outline: 2px solid transparent; outline-offset: 2px} .focus\:\!ring-1:focus{ --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color) !important; --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color) !important; box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000) !important} .focus\:\!ring-primary-orange:focus{ --tw-ring-opacity: 1 !important; --tw-ring-color: rgb(237 125 49 / var(--tw-ring-opacity)) !important} .focus\:\!ring-offset-0:focus{ --tw-ring-offset-width: 0px !important} .disabled\:cursor-auto:disabled{ cursor: auto} .disabled\:opacity-50:disabled{ opacity: 0.5} .group:hover .group-hover\:-translate-y-5{ --tw-translate-y: -1.25rem; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))} .group:hover .group-hover\:translate-x-2{ --tw-translate-x: 0.5rem; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))} .group:hover .group-hover\:scale-105{ --tw-scale-x: 1.05; --tw-scale-y: 1.05; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))} .group:hover .group-hover\:text-logo-orange{ --tw-text-opacity: 1; color: rgb(248 149 3 / var(--tw-text-opacity))} .group:hover .group-hover\:text-primary-orange{ --tw-text-opacity: 1; color: rgb(237 125 49 / var(--tw-text-opacity))} .group:hover .group-hover\:text-white{ --tw-text-opacity: 1; color: rgb(255 255 255 / var(--tw-text-opacity))} .group:hover .group-hover\:underline{ text-decoration-line: underline} .group:hover .group-hover\:decoration-logo-orange{ text-decoration-color: #F89503} .group:hover .group-hover\:underline-offset-4{ text-underline-offset: 4px} @media (min-width: 480px){ .xs\:\!h-\[92\%\]{ height: 92% !important} .xs\:h-\[94\%\]{ height: 94%}} @media (min-width: 640px){ .sm\:h-6{ height: 1.5rem} .sm\:w-6{ width: 1.5rem} .sm\:w-auto{ width: auto} .sm\:max-w-\[400px\]{ max-width: 400px} .sm\:max-w-\[540pxs\]{ max-width: 540pxs} .sm\:grid-cols-2{ grid-template-columns: repeat(2, minmax(0, 1fr))} .sm\:grid-cols-\[150px_150px\]{ grid-template-columns: 150px 150px} .sm\:flex-row{ flex-direction: row} .sm\:p-2{ padding: 0.5rem} .sm\:p-2\.5{ padding: 0.625rem}} @media (min-width: 768px){ .md\:bottom-10{ bottom: 2.5rem} .md\:bottom-\[40px\]{ bottom: 40px} .md\:right-10{ right: 2.5rem} .md\:right-\[40px\]{ right: 40px} .md\:top-\[-52px\]{ top: -52px} .md\:top-\[92px\]{ top: 92px} .md\:mt-\[90px\]{ margin-top: 90px} .md\:inline-block{ display: inline-block} .md\:flex{ display: flex} .md\:hidden{ display: none} .md\:aspect-\[16\/10\]{ aspect-ratio: 16/10} .md\:aspect-\[1920\/700\]{ aspect-ratio: 1920/700} .md\:aspect-\[750\/500\]{ aspect-ratio: 750/500} .md\:\!h-\[93\%\]{ height: 93% !important} .md\:h-8{ height: 2rem} .md\:h-\[68px\]{ height: 68px} .md\:h-\[92\%\]{ height: 92%} .md\:w-1\/2{ width: 50%} .md\:w-8{ width: 2rem} .md\:w-\[68px\]{ width: 68px} .md\:min-w-\[104px\]{ min-width: 104px} .md\:max-w-\[265px\]{ max-width: 265px} .md\:grid-cols-\[170px_170px\]{ grid-template-columns: 170px 170px} .md\:flex-row{ flex-direction: row} .md\:gap-0{ gap: 0px} .md\:bg-transparent{ background-color: transparent} .md\:bg-green-fade{ background-image: linear-gradient(90.02deg, rgba(255, 251, 247, 0) 3.76%, #034B22 60.97%, #034B22 97.7%)} .md\:p-3{ padding: 0.75rem} .md\:p-3\.5{ padding: 0.875rem}} @media (min-width: 1024px){ .lg\:\!bottom-\[3\%\]{ bottom: 3% !important} .lg\:-bottom-\[360px\]{ bottom: -360px} .lg\:-right-\[80px\]{ right: -80px} .lg\:-top-\[290px\]{ top: -290px} .lg\:right-16{ right: 4rem} .lg\:order-1{ order: 1} .lg\:order-2{ order: 2} .lg\:my-3{ margin-top: 0.75rem; margin-bottom: 0.75rem} .lg\:my-5{ margin-top: 1.25rem; margin-bottom: 1.25rem} .lg\:my-6{ margin-top: 1.5rem; margin-bottom: 1.5rem} .lg\:mb-\[60px\]{ margin-bottom: 60px} .lg\:mt-5{ margin-top: 1.25rem} .lg\:mt-60{ margin-top: 60px} .lg\:block{ display: block} .lg\:aspect-\[1920\/400\]{ aspect-ratio: 1920/400} .lg\:aspect-square{ aspect-ratio: 1 / 1} .lg\:\!h-\[25px\]{ height: 25px !important} .lg\:\!h-\[36px\]{ height: 36px !important} .lg\:\!h-\[94\%\]{ height: 94% !important} .lg\:h-10{ height: 2.5rem} .lg\:h-6{ height: 1.5rem} .lg\:h-\[94\%\]{ height: 94%} .lg\:max-h-\[427px\]{ max-height: 427px} .lg\:max-h-full{ max-height: 100%} .lg\:\!w-\[25px\]{ width: 25px !important} .lg\:\!w-\[36px\]{ width: 36px !important} .lg\:w-1\/2{ width: 50%} .lg\:w-10{ width: 2.5rem} .lg\:w-2\/3{ width: 66.666667%} .lg\:w-2\/5{ width: 40%} .lg\:w-3\/5{ width: 60%} .lg\:w-6{ width: 1.5rem} .lg\:w-\[50\%\]{ width: 50%} .lg\:grid-cols-2{ grid-template-columns: repeat(2, minmax(0, 1fr))} .lg\:grid-cols-3{ grid-template-columns: repeat(3, minmax(0, 1fr))} .lg\:grid-cols-\[200px_200px\]{ grid-template-columns: 200px 200px} .lg\:flex-row{ flex-direction: row} .lg\:gap-10{ gap: 2.5rem} .lg\:gap-20{ gap: 5rem} .lg\:gap-5{ gap: 1.25rem} .lg\:gap-6{ gap: 1.5rem} .lg\:gap-8{ gap: 2rem} .lg\:gap-\[100px\]{ gap: 100px} .lg\:gap-\[40px\]{ gap: 40px} .lg\:border-b-0{ border-bottom-width: 0px} .lg\:border-r{ border-right-width: 1px} .lg\:border-r-black-20{ --tw-border-opacity: 1; border-right-color: rgb(204 204 204 / var(--tw-border-opacity))} .lg\:p-3{ padding: 0.75rem} .lg\:p-3\.5{ padding: 0.875rem} .lg\:p-5{ padding: 1.25rem} .lg\:p-8{ padding: 2rem} .lg\:px-4{ padding-left: 1rem; padding-right: 1rem} .lg\:px-\[5\%\]{ padding-left: 5%; padding-right: 5%} .lg\:px-\[8\%\]{ padding-left: 8%; padding-right: 8%} .lg\:py-10{ padding-top: 2.5rem; padding-bottom: 2.5rem} .lg\:py-100{ padding-top: 100px; padding-bottom: 100px} .lg\:py-8{ padding-top: 2rem; padding-bottom: 2rem} .lg\:py-\[0px\]{ padding-top: 0px; padding-bottom: 0px} .lg\:py-\[100px\]{ padding-top: 100px; padding-bottom: 100px} .lg\:py-\[80px\]{ padding-top: 80px; padding-bottom: 80px} .lg\:\!pl-0{ padding-left: 0px !important} .lg\:\!pl-\[0\]{ padding-left: 0 !important} .lg\:\!pr-0{ padding-right: 0px !important} .lg\:pb-0{ padding-bottom: 0px} .lg\:pb-5{ padding-bottom: 1.25rem} .lg\:pr-\[60px\]{ padding-right: 60px} .lg\:pt-10{ padding-top: 2.5rem}} @media (min-width: 1280px){ .xl\:static{ position: static} .xl\:-bottom-\[187\.141px\]{ bottom: -187.141px} .xl\:block{ display: block} .xl\:flex{ display: flex} .xl\:hidden{ display: none} .xl\:aspect-auto{ aspect-ratio: auto} .xl\:\!h-\[92\%\]{ height: 92% !important} .xl\:\!h-full{ height: 100% !important} .xl\:h-\[96\%\]{ height: 96%} .xl\:h-full{ height: 100%} .xl\:\!w-1\/2{ width: 50% !important} .xl\:w-1\/2{ width: 50%} .xl\:grid-cols-2{ grid-template-columns: repeat(2, minmax(0, 1fr))} .xl\:grid-cols-3{ grid-template-columns: repeat(3, minmax(0, 1fr))} .xl\:flex-row{ flex-direction: row} .xl\:gap-0{ gap: 0px} .xl\:gap-60{ gap: 60px} .xl\:gap-\[50px\]{ gap: 50px} .xl\:border-r{ border-right-width: 1px} .xl\:p-9{ padding: 2.25rem} .xl\:px-5{ padding-left: 1.25rem; padding-right: 1.25rem} .xl\:px-\[10\.814\%\]{ padding-left: 10.814%; padding-right: 10.814%} .xl\:py-0{ padding-top: 0px; padding-bottom: 0px} .xl\:py-10{ padding-top: 2.5rem; padding-bottom: 2.5rem} .xl\:pb-0{ padding-bottom: 0px}} @media (min-width: 1366px){ .\32xl\:\!bottom-\[5\%\]{ bottom: 5% !important} .\32xl\:right-0{ right: 0px} .\32xl\:line-clamp-none{ overflow: visible; display: block; -webkit-box-orient: horizontal; -webkit-line-clamp: none} .\32xl\:\!h-\[93\%\]{ height: 93% !important} .\32xl\:gap-10{ gap: 2.5rem} .\32xl\:gap-12{ gap: 3rem} .\32xl\:gap-\[60px\]{ gap: 60px} .\32xl\:py-20{ padding-top: 5rem; padding-bottom: 5rem} .\32xl\:pt-20{ padding-top: 5rem}} @media (min-width: 1440px){ .\33xl\:my-10{ margin-top: 2.5rem; margin-bottom: 2.5rem} .\33xl\:mb-\[60px\]{ margin-bottom: 60px} .\33xl\:mt-10{ margin-top: 2.5rem} .\33xl\:mt-5{ margin-top: 1.25rem} .\33xl\:\!h-\[56px\]{ height: 56px !important} .\33xl\:\!w-\[56px\]{ width: 56px !important} .\33xl\:w-2\/5{ width: 40%} .\33xl\:w-\[60\%\]{ width: 60%} .\33xl\:grid-cols-4{ grid-template-columns: repeat(4, minmax(0, 1fr))} .\33xl\:grid-cols-\[260px_260px\]{ grid-template-columns: 260px 260px} .\33xl\:gap-10{ gap: 2.5rem} .\33xl\:gap-20{ gap: 5rem} .\33xl\:gap-5{ gap: 1.25rem} .\33xl\:px-10{ padding-left: 2.5rem; padding-right: 2.5rem} .\33xl\:px-\[12\%\]{ padding-left: 12%; padding-right: 12%} .\33xl\:py-4{ padding-top: 1rem; padding-bottom: 1rem} .\33xl\:pb-10{ padding-bottom: 2.5rem} .\33xl\:pt-3{ padding-top: 0.75rem}} @media (min-width: 1536px){ .\34xl\:my-10{ margin-top: 2.5rem; margin-bottom: 2.5rem} .\34xl\:my-5{ margin-top: 1.25rem; margin-bottom: 1.25rem} .\34xl\:ml-3{ margin-left: 0.75rem} .\34xl\:mt-10{ margin-top: 2.5rem} .\34xl\:\!h-\[93\%\]{ height: 93% !important} .\34xl\:gap-20{ gap: 5rem} .\34xl\:gap-\[10px\]{ gap: 10px} .\34xl\:gap-\[32px\]{ gap: 32px} .\34xl\:gap-\[60px\]{ gap: 60px} .\34xl\:gap-\[80px\]{ gap: 80px} .\34xl\:px-10{ padding-left: 2.5rem; padding-right: 2.5rem} .\34xl\:px-7{ padding-left: 1.75rem; padding-right: 1.75rem} .\34xl\:px-\[8\.51\%\]{ padding-left: 8.51%; padding-right: 8.51%} .\34xl\:pb-20{ padding-bottom: 5rem} .\34xl\:pb-5{ padding-bottom: 1.25rem}} @media (min-width: 1680px){ .\35xl\:gap-20{ gap: 5rem} .\35xl\:gap-\[100px\]{ gap: 100px} .\35xl\:gap-\[60px\]{ gap: 60px} .\35xl\:py-16{ padding-top: 4rem; padding-bottom: 4rem} .\35xl\:py-20{ padding-top: 5rem; padding-bottom: 5rem}} @media (min-width: 1920px){ .\36xl\:mt-20{ margin-top: 5rem} .\36xl\:\!h-\[94\%\]{ height: 94% !important} .\36xl\:py-100{ padding-top: 100px; padding-bottom: 100px} .\36xl\:pt-100{ padding-top: 100px}} .\[\&_a\]\:underline a{ text-decoration-line: underline} .\[\&_a\]\:\[text-decoration-skip-ink\:none\] a{ -webkit-text-decoration-skip-ink: none; text-decoration-skip-ink: none} .\[\&_a\]\:\[text-underline-position\:from-font\] a{ text-underline-position: from-font}