@ptcwebops/ptcw-design 7.0.7-upgrade → 7.0.9-upgrade

package/dist/components/p-BvGlmU4v.js

@@ -0,0 +1,2024 @@
+class PTCLogger {
+    prefix = '[PTC FEF LOG]';
+    format(level, message, ...args) {
+        const timestamp = new Date().toISOString();
+        return [`${this.prefix} [${level.toUpperCase()}] ${timestamp}:`, message, ...args];
+    }
+    log(message, ...args) {
+        console.log(...this.format('log', message, ...args));
+    }
+    info(message, ...args) {
+        console.info(...this.format('info', message, ...args));
+    }
+    warn(message, ...args) {
+        console.warn(...this.format('warn', message, ...args));
+    }
+    error(message, ...args) {
+        console.error(...this.format('error', message, ...args));
+    }
+}
+// Singleton
+const ptcLogger = new PTCLogger();
+
+// 1. Hardcoded fallback messages
+const fallbackValidationMessages = {
+    de: {
+        required: 'Dieses Feld ist erforderlich.',
+        select: 'Bitte wählen Sie einen Wert.',
+        firstname: 'Bitte überprüfen Sie Ihren Vornamen.',
+        lastname: 'Bitte überprüfen Sie Ihren Nachnamen.',
+        validemail: 'Bitte geben Sie eine gültige E-Mail-Adresse ein.',
+        email: 'Bitte geben Sie eine gültige E-Mail-Adresse ein.',
+        companyemail: 'Bitte geben Sie eine Firmen-E-Mail-Adresse ein.',
+        tel: 'Telefonnummer ist erforderlich.',
+        validtel: 'Bitte geben Sie eine gültige Telefonnummer ein.',
+        confirmemail: "E-Mail-Adressen müssen übereinstimmen."
+    },
+    en: {
+        required: 'This field is required.',
+        select: 'Please select a value.',
+        firstname: 'Please check your firstname.',
+        lastname: 'Please check your lastname.',
+        validemail: 'Please enter a valid email.',
+        email: 'Email is required.',
+        companyemail: 'Please enter a company email.',
+        tel: 'Telephone number is required.',
+        validtel: 'Please enter a valid telephone number',
+        confirmemail: 'Email addresses must match.'
+    },
+    fr: {
+        required: 'Ce champ est obligatoire.',
+        select: 'Veuillez sélectionner une valeur.',
+        firstname: 'Veuillez vérifier votre prénom.',
+        lastname: 'Veuillez vérifier votre nom de famille.',
+        validemail: 'Veuillez saisir une adresse e-mail valide.',
+        email: 'Adresse e-mail requise.',
+        companyemail: 'Veuillez saisir une adresse e-mail professionnelle.',
+        tel: 'Numéro de téléphone requis.',
+        validtel: 'Veuillez saisir un numéro de téléphone valide.',
+        confirmemail: 'Les adresses e-mail doivent correspondre.'
+    },
+    ko: {
+        required: '이 필드는 필수입니다.',
+        select: '값을 선택해 주세요.',
+        firstname: '이름을 확인해 주세요.',
+        lastname: '성을 확인해 주세요.',
+        validemail: '유효한 이메일 주소를 입력해 주세요.',
+        email: '이메일 주소가 필요합니다.',
+        companyemail: '회사 이메일을 입력해 주세요.',
+        tel: '전화번호가 필요합니다.',
+        validtel: '유효한 전화번호를 입력해 주세요.',
+        confirmemail: "이메일 주소가 일치해야 합니다"
+    },
+    pt: {
+        required: 'Este campo é obrigatório.',
+        select: 'Por favor, selecione um valor.',
+        firstname: 'Por favor, verifique seu primeiro nome.',
+        lastname: 'Por favor, verifique seu sobrenome.',
+        validemail: 'Por favor, insira um endereço de e-mail válido.',
+        email: 'Endereço de e-mail é obrigatório.',
+        companyemail: 'Por favor, insira um e-mail da empresa.',
+        tel: 'Número de telefone é obrigatório.',
+        validtel: 'Por favor, insira um número de telefone válido.',
+        confirmemail: 'Os endereços de e-mail devem corresponder.'
+    },
+    cn: {
+        required: '此字段为必填项。',
+        select: '请选择一个值。',
+        firstname: '请检查您的名字。',
+        lastname: '请检查您的姓氏。',
+        validemail: '请输入有效的电子邮件地址。',
+        email: '需要电子邮件地址。',
+        companyemail: '请输入公司电子邮件。',
+        tel: '需要电话号码。',
+        validtel: '请输入有效的电话号码。',
+        confirmemail: '电子邮件地址必须匹配。'
+    },
+    tw: {
+        required: '此欄位為必填。',
+        select: '請選擇一個值。',
+        firstname: '請檢查您的名字。',
+        lastname: '請檢查您的姓氏。',
+        validemail: '請輸入有效的電子郵件地址。',
+        email: '需要電子郵件地址。',
+        companyemail: '請輸入公司電子郵件。',
+        tel: '需要電話號碼。',
+        validtel: '請輸入有效的電話號碼。',
+        confirmemail: '電子郵件地址必須匹配。'
+    },
+    ja: {
+        required: 'このフィールドは必須です。',
+        select: '値を選択してください。',
+        firstname: '名前を確認してください。',
+        lastname: '苗字を確認してください。',
+        validemail: '有効なメールアドレスを入力してください。',
+        email: 'メールアドレスが必要です。',
+        companyemail: '会社のメールアドレスを入力してください。',
+        tel: '電話番号が必要です。',
+        validtel: '有効な電話番号を入力してください。',
+        confirmemail: 'メールアドレスが一致する必要があります。'
+    },
+    it: {
+        required: 'Questo campo è obbligatorio.',
+        select: 'Si prega di selezionare un valore.',
+        firstname: 'Si prega di controllare il proprio nome.',
+        lastname: 'Si prega di controllare il proprio cognome.',
+        validemail: 'Si prega di inserire un indirizzo email valido.',
+        email: "L'indirizzo email è richiesto.",
+        companyemail: "Si prega di inserire un'email aziendale.",
+        tel: 'È richiesto un numero di telefono.',
+        validtel: 'Si prega di inserire un numero di telefono valido.',
+        confirmemail: 'Gli indirizzi email devono corrispondere.'
+    },
+    es: {
+        required: 'Por favor introduce un valor.',
+        select: 'Por favor seleccione un valor.',
+        firstname: 'Por favor verifique su nombre.',
+        lastname: 'Por favor verifique su apellido.',
+        validemail: 'Por favor introduzca un correo válido.',
+        email: "Se requiere un correo electrónico.",
+        companyemail: "Por favor introduzca un correo de empresa.",
+        tel: 'Se requiere un número de teléfono.',
+        validtel: 'Por favor introduzca un número de teléfono válido.',
+        confirmemail: 'Los correos electrónicos deben coincidir.'
+    }
+};
+// 2. Remote messages (fetched from API)
+let remoteValidationMessages = null;
+let messagesLoaded = false;
+// 3. Load messages from API
+async function loadValidationMessages() {
+    if (messagesLoaded)
+        return;
+    try {
+        const apiUrl = `${window.location.origin}/api/forms/validation-messages`;
+        const response = await fetch(apiUrl);
+        if (!response.ok) {
+            ptcLogger.warn(`Validation API returned status ${response.status}`);
+            return;
+        }
+        const data = await response.json();
+        if (data && Object.keys(data).length > 0) {
+            remoteValidationMessages = data;
+        }
+        else {
+            ptcLogger.warn('Validation API returned empty data, using fallback messages');
+        }
+    }
+    catch (error) {
+        ptcLogger.error('Error fetching validation messages:', error);
+    }
+    finally {
+        messagesLoaded = true;
+    }
+}
+// 4. Optional direct getter (used if needed elsewhere)
+function getValidationMessageText(type, lang = 'en') {
+    return (remoteValidationMessages?.[lang]?.[type] ??
+        fallbackValidationMessages?.[lang]?.[type] ??
+        '');
+}
+// 5. Proxy to allow usage like: ValidationMessages[lang][type]
+const ValidationMessages = new Proxy({}, {
+    get(_, lang) {
+        return new Proxy({}, {
+            get(_, type) {
+                return getValidationMessageText(type, lang);
+            }
+        });
+    }
+});
+
+// src/global/global.ts
+var appGlobalScript = () => {
+    globalThis.ptcLogger = ptcLogger;
+    loadValidationMessages()
+        .then(() => ptcLogger?.info?.('Validation messages loaded successfully'))
+        .catch((err) => ptcLogger?.error?.('Failed to load validation messages', err));
+};
+
+const globalScripts = appGlobalScript;
+const globalStyles = "@charset \"UTF-8\";\n@import url(\"https://fonts.googleapis.com/css2?family=Rajdhani:wght@400;500;600;700&family=Raleway:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap\");\n/*\n* Theme color tokens\n*/\n:root {\n  --color-black: #000000;\n  --color-white: #ffffff;\n  --color-white-grey: #fbfbfb;\n  --color-white-01: #c8c9c7;\n  --color-green-01: #e1f1e2;\n  --color-green-02: #bde1bf;\n  --color-green-03: #97cf9b;\n  --color-green-04: #7dc382;\n  --color-green-05: #5cb463;\n  --color-green-06: #33a13c;\n  --color-green-07: #00890b;\n  --color-green-08: #006e09;\n  --color-green-09: #005807;\n  --color-green-10: #004606;\n  --color-green-11: #003805;\n  --color-green-12: #002d04;\n  --color-green-13: #5bb73b;\n  --color-green-14: #74c34d;\n  --color-blue-01: #e1edf6;\n  --color-blue-02: #c3ddee;\n  --color-blue-03: #a1c9e5;\n  --color-blue-04: #89bbdf;\n  --color-blue-05: #6caad7;\n  --color-blue-06: #4795cd;\n  --color-blue-07: #197bc0;\n  --color-blue-08: #14629a;\n  --color-blue-09: #104e7b;\n  --color-blue-10: #0d3e62;\n  --color-blue-11: #0a324e;\n  --color-blue-12: #08283e;\n  --color-orange-01: #f8ede3;\n  --color-orange-02: #f0dbc7;\n  --color-orange-03: #e7c7a7;\n  --color-orange-04: #e1b991;\n  --color-orange-05: #d9a876;\n  --color-orange-06: #cf9254;\n  --color-orange-07: #c37729;\n  --color-orange-08: #9c5f21;\n  --color-orange-09: #7d4c1a;\n  --color-orange-10: #643d15;\n  --color-orange-11: #503111;\n  --color-orange-12: #40270e;\n  --color-red-01: #fae6e6;\n  --color-red-02: #f4cdcd;\n  --color-red-03: #edb1b1;\n  --color-red-04: #e99d9d;\n  --color-red-05: #e38484;\n  --color-red-06: #dc6565;\n  --color-red-07: #d33e3e;\n  --color-red-08: #a7232e;\n  --color-red-09: #861c25;\n  --color-red-10: #6b161e;\n  --color-red-11: #561218;\n  --color-red-12: #450e13;\n  --color-gray-01: #f6f6f6;\n  --color-gray-02: #e4e7e9;\n  --color-gray-03: #bec6ca;\n  --color-gray-04: #aeb8bd;\n  --color-gray-05: #9aa6ad;\n  --color-gray-06: #819099;\n  --color-gray-07: #617480;\n  --color-gray-08: #4e5d66;\n  --color-gray-09: #3e4a52;\n  --color-gray-10: #323b42;\n  --color-gray-11: #282f35;\n  --color-gray-12: #20262a;\n  --color-gray-13: #40434a;\n  --color-standard-gray: #f3f3f3;\n  --color-hyperlink: #1773b5;\n  --keyboard-nav-outline: rgb(0, 61, 214);\n}\n\n.background-plm-grey {\n  background-color: var(--color-gray-12);\n}\n\n.background-grey-10 {\n  background-color: var(--color-gray-10);\n}\n\n.background-white {\n  background-color: var(--color-white);\n}\n\nhr {\n  height: 1px;\n  background-color: var(--color-gray-02);\n  border: none;\n}\n\nhtml {\n  scroll-behavior: smooth;\n}\n\n.ptc-button-focus:focus-visible {\n  border-radius: var(--ptc-border-radius-standard);\n  outline: 5px solid var(--keyboard-nav-outline);\n}\n\n.ptc-button-focus-dark:focus-visible {\n  border-radius: var(--ptc-border-radius-standard);\n  outline: 5px solid var(--keyboard-nav-outline);\n  outline-offset: 2px;\n}\n\n.ptc-container {\n  padding-right: 24px;\n  padding-left: 24px;\n  margin-right: auto;\n  margin-left: auto;\n}\n\n@media only screen and (min-width: 1200px) {\n  .ptc-container {\n    padding-left: 0;\n    padding-right: 0;\n    max-width: 1136px;\n  }\n}\n@media only screen and (min-width: 1440px) {\n  .ptc-container {\n    padding-left: 0;\n    padding-right: 0;\n    max-width: 1200px;\n  }\n}\n.ptc-container-lg {\n  padding-right: 15px;\n  padding-left: 15px;\n  margin-right: auto;\n  margin-left: auto;\n}\n\n@media only screen and (min-width: 480px) {\n  .ptc-container-lg {\n    padding-left: var(--ptc-layout-spacing-03);\n    padding-right: var(--ptc-layout-spacing-03);\n  }\n}\n@media only screen and (min-width: 768px) {\n  .ptc-container-lg {\n    padding-left: var(--ptc-layout-spacing-04);\n    padding-right: var(--ptc-layout-spacing-04);\n  }\n}\n@media only screen and (min-width: 992px) {\n  .ptc-container-lg {\n    padding-left: var(--ptc-element-spacing-08);\n    padding-right: var(--ptc-element-spacing-08);\n  }\n}\n@media only screen and (min-width: 1980px) {\n  .ptc-container-lg {\n    padding-left: 0;\n    padding-right: 0;\n    max-width: 1900px;\n  }\n}\n.ptc-container-fluid {\n  width: 100%;\n}\n\na {\n  font-family: var(--ptc-font-latin);\n  font-style: var(--ptc-font-style-normal);\n  text-decoration-line: underline;\n  color: var(--color-hyperlink);\n  transition: color var(--ptc-transition-medium) var(--ptc-ease-out);\n  font-weight: var(--ptc-font-weight-bold);\n}\na:visited {\n  color: var(--color-blue-10);\n}\na:active, a:visited:active {\n  transition: none;\n  color: var(--color-blue-09);\n}\na:hover, a:visited:hover {\n  color: var(--color-blue-08);\n}\na.disabled {\n  color: var(--color-gray-04) !important;\n  cursor: not-allowed;\n}\na:focus-visible {\n  outline: 5px solid #003dd6 !important;\n  outline-offset: 0px !important;\n  border-radius: var(--ptc-border-radius-standard);\n}\n\n.light-links a:not(.hero-footer-form-wrapper a,\nptc-modal inline-form a,\n.vjs-social-share-links a),\n.light-links a.light-link,\n.background-grey-10 a:not(.hero-footer-form-wrapper a,\nptc-modal inline-form a,\n.vjs-social-share-links a),\n.background-grey-10 a.light-link,\n.background-plm-grey a:not(.hero-footer-form-wrapper a,\nptc-modal inline-form a,\n.vjs-social-share-links a),\n.background-plm-grey a.light-link {\n  color: var(--color-blue-06);\n  margin: -2px;\n  border: 2px solid transparent;\n}\n.light-links a:not(.hero-footer-form-wrapper a,\nptc-modal inline-form a,\n.vjs-social-share-links a):visited,\n.light-links a.light-link:visited,\n.background-grey-10 a:not(.hero-footer-form-wrapper a,\nptc-modal inline-form a,\n.vjs-social-share-links a):visited,\n.background-grey-10 a.light-link:visited,\n.background-plm-grey a:not(.hero-footer-form-wrapper a,\nptc-modal inline-form a,\n.vjs-social-share-links a):visited,\n.background-plm-grey a.light-link:visited {\n  color: var(--color-blue-06);\n}\n.light-links a:not(.hero-footer-form-wrapper a,\nptc-modal inline-form a,\n.vjs-social-share-links a):active, .light-links a:not(.hero-footer-form-wrapper a,\nptc-modal inline-form a,\n.vjs-social-share-links a):visited:active,\n.light-links a.light-link:active,\n.light-links a.light-link:visited:active,\n.background-grey-10 a:not(.hero-footer-form-wrapper a,\nptc-modal inline-form a,\n.vjs-social-share-links a):active,\n.background-grey-10 a:not(.hero-footer-form-wrapper a,\nptc-modal inline-form a,\n.vjs-social-share-links a):visited:active,\n.background-grey-10 a.light-link:active,\n.background-grey-10 a.light-link:visited:active,\n.background-plm-grey a:not(.hero-footer-form-wrapper a,\nptc-modal inline-form a,\n.vjs-social-share-links a):active,\n.background-plm-grey a:not(.hero-footer-form-wrapper a,\nptc-modal inline-form a,\n.vjs-social-share-links a):visited:active,\n.background-plm-grey a.light-link:active,\n.background-plm-grey a.light-link:visited:active {\n  transition: none;\n  color: var(--color-blue-07);\n}\n.light-links a:not(.hero-footer-form-wrapper a,\nptc-modal inline-form a,\n.vjs-social-share-links a):hover, .light-links a:not(.hero-footer-form-wrapper a,\nptc-modal inline-form a,\n.vjs-social-share-links a):visited:hover,\n.light-links a.light-link:hover,\n.light-links a.light-link:visited:hover,\n.background-grey-10 a:not(.hero-footer-form-wrapper a,\nptc-modal inline-form a,\n.vjs-social-share-links a):hover,\n.background-grey-10 a:not(.hero-footer-form-wrapper a,\nptc-modal inline-form a,\n.vjs-social-share-links a):visited:hover,\n.background-grey-10 a.light-link:hover,\n.background-grey-10 a.light-link:visited:hover,\n.background-plm-grey a:not(.hero-footer-form-wrapper a,\nptc-modal inline-form a,\n.vjs-social-share-links a):hover,\n.background-plm-grey a:not(.hero-footer-form-wrapper a,\nptc-modal inline-form a,\n.vjs-social-share-links a):visited:hover,\n.background-plm-grey a.light-link:hover,\n.background-plm-grey a.light-link:visited:hover {\n  color: var(--color-blue-05);\n}\n.light-links a:not(.hero-footer-form-wrapper a,\nptc-modal inline-form a,\n.vjs-social-share-links a).disabled,\n.light-links a.light-link.disabled,\n.background-grey-10 a:not(.hero-footer-form-wrapper a,\nptc-modal inline-form a,\n.vjs-social-share-links a).disabled,\n.background-grey-10 a.light-link.disabled,\n.background-plm-grey a:not(.hero-footer-form-wrapper a,\nptc-modal inline-form a,\n.vjs-social-share-links a).disabled,\n.background-plm-grey a.light-link.disabled {\n  color: var(--color-gray-04) !important;\n  cursor: not-allowed;\n}\n.light-links a:not(.hero-footer-form-wrapper a,\nptc-modal inline-form a,\n.vjs-social-share-links a):focus-visible,\n.light-links a.light-link:focus-visible,\n.background-grey-10 a:not(.hero-footer-form-wrapper a,\nptc-modal inline-form a,\n.vjs-social-share-links a):focus-visible,\n.background-grey-10 a.light-link:focus-visible,\n.background-plm-grey a:not(.hero-footer-form-wrapper a,\nptc-modal inline-form a,\n.vjs-social-share-links a):focus-visible,\n.background-plm-grey a.light-link:focus-visible {\n  border-radius: var(--ptc-border-radius-standard);\n  border: 2px solid rgb(255, 255, 255);\n  outline: 5px solid var(--keyboard-nav-outline);\n}\n.light-links .podcast-cta-section a,\n.background-grey-10 .podcast-cta-section a,\n.background-plm-grey .podcast-cta-section a {\n  border: 2px solid transparent;\n}\n.light-links .podcast-cta-section a:focus-visible,\n.background-grey-10 .podcast-cta-section a:focus-visible,\n.background-plm-grey .podcast-cta-section a:focus-visible {\n  border-radius: var(--ptc-border-radius-standard);\n  border: 2px solid rgb(255, 255, 255);\n  outline: 5px solid var(--keyboard-nav-outline);\n}\n\n.white-links a {\n  color: var(--color-white) !important;\n}\n\n.ptc-link {\n  color: var(--color-gray-10);\n  text-decoration: underline;\n  text-decoration-thickness: 2px;\n  text-decoration-color: var(--color-green-06);\n  text-underline-offset: 5px;\n  transition: text-decoration-color var(--ptc-transition-medium) var(--ptc-ease-inout);\n}\n.ptc-link:hover {\n  color: var(--color-green-06);\n}\n.ptc-link:visited {\n  color: var(--color-gray-10);\n}\n.ptc-link:active, .ptc-link:visited:active {\n  transition: none;\n  color: var(--color-green-06);\n}\n.ptc-link:hover, .ptc-link:visited:hover {\n  color: var(--color-green-06);\n}\n\n.ptc-link-dark {\n  color: var(--color-white);\n  text-decoration: underline;\n  text-decoration-thickness: 2px;\n  text-decoration-color: var(--color-green-06);\n  text-underline-offset: 5px;\n  transition: text-decoration-color var(--ptc-transition-medium) var(--ptc-ease-inout);\n}\n.ptc-link-dark:hover {\n  color: var(--color-green-06);\n}\n.ptc-link-dark:visited {\n  color: var(--color-white);\n}\n.ptc-link-dark:active, .ptc-link-dark:visited:active {\n  transition: none;\n  color: var(--color-green-06);\n}\n.ptc-link-dark:hover, .ptc-link-dark:visited:hover {\n  color: var(--color-green-06);\n}\n\n.vjs-social-share-links a {\n  color: var(--color-white);\n}\n.vjs-social-share-links a:hover {\n  color: var(--color-white);\n}\n\n.ptc-ordered-list {\n  margin-bottom: var(--ptc-element-spacing-03);\n}\n.ptc-ordered-list .ptc-list-item {\n  color: var(--color-gray-10);\n  font-size: var(--ptc-font-size-xx-small);\n}\n\n.ptc-unordered-list {\n  margin-bottom: var(--ptc-element-spacing-03);\n}\n.ptc-unordered-list .ptc-list-item {\n  color: var(--color-gray-10);\n  font-size: var(--ptc-font-size-xx-small);\n  line-height: 20px;\n}\n\nul.minimalist {\n  list-style: none;\n  margin: 0 0 24px;\n  padding-left: 1rem;\n  -moz-columns: 1;\n       columns: 1;\n}\n@media only screen and (min-width: 768px) {\n  ul.minimalist {\n    -moz-columns: 2;\n         columns: 2;\n  }\n}\n@media only screen and (min-width: 992px) {\n  ul.minimalist {\n    -moz-columns: 3;\n         columns: 3;\n  }\n}\n@media only screen and (min-width: 1200px) {\n  ul.minimalist {\n    -moz-columns: 4;\n         columns: 4;\n  }\n}\nul.minimalist li {\n  position: relative;\n  font-family: var(--ptc-font-latin);\n  font-size: var(--ptc-font-size-small);\n  font-weight: var(--ptc-font-weight-regular);\n  letter-spacing: var(--ptc-letter-spacing-normal);\n  color: var(--color-gray-10);\n  max-width: 260px;\n}\nul.minimalist li::before {\n  color: var(--color-gray-12);\n  font-family: var(--ptc-font-latin);\n  content: \"•\";\n  font-size: 1rem;\n  position: absolute;\n  left: -1rem;\n  top: 0.125rem;\n}\n\nul li,\nol li {\n  font-family: var(--ptc-font-latin);\n  font-size: var(--ptc-font-size-small);\n  font-weight: var(--ptc-font-weight-regular);\n  letter-spacing: var(--ptc-letter-spacing-normal);\n  color: var(--color-gray-10);\n}\n\n.light-links ul li,\n.light-links ol li {\n  color: var(--color-white);\n}\n\n/*\n* Typography tokens\n*/\nh1,\nh2,\nh3,\nh4,\nh5,\nh6,\np,\nul,\nli,\nptc-subnav,\nptc-tab-list,\nptc-link,\nptc-square-card,\n.hyphenate-text,\nptc-footer {\n  word-break: break-word;\n  hyphens: manual;\n  -webkit-hyphens: manual;\n  -moz-hyphens: manual;\n  -ms-hyphens: manual;\n}\n@supports (hyphenate-limit-chars: 12 3 3) {\n  h1,\n  h2,\n  h3,\n  h4,\n  h5,\n  h6,\n  p,\n  ul,\n  li,\n  ptc-subnav,\n  ptc-tab-list,\n  ptc-link,\n  ptc-square-card,\n  .hyphenate-text,\n  ptc-footer {\n    hyphens: auto;\n    -webkit-hyphenate-limit-before: 3;\n    /* For Safari */\n    -webkit-hyphenate-limit-after: 3;\n    /* For Safari */\n    hyphenate-limit-chars: 12 3 3;\n    hyphenate-limit-lines: 2;\n    hyphenate-limit-last: always;\n    hyphenate-limit-zone: 6%;\n    -webkit-hyphens: auto;\n    -webkit-hyphenate-limit-before: 3;\n    -webkit-hyphenate-limit-after: 3;\n    -webkit-hyphenate-limit-chars: 12 3 3;\n    -webkit-hyphenate-limit-lines: 2;\n    -moz-hyphens: auto;\n    -moz-hyphenate-limit-chars: 12 3 3;\n    -moz-hyphenate-limit-lines: 2;\n    -ms-hyphens: auto;\n    -ms-hyphenate-limit-chars: 12 3 3;\n    -ms-hyphenate-limit-lines: 2;\n  }\n}\n\n:root {\n  /* Fonts */\n  --ptc-font-latin: \"Raleway\", sans-serif;\n  --ptc-font-secondary-latin: \"Rajdhani\", sans-serif;\n  --ptc-font-sans:\n  \t-apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial,\n  \tsans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";\n  /* Font sizes */\n  --ptc-font-size-xxx-small: 0.75rem;\n  /* 12px */\n  --ptc-font-size-xx-small: 0.875rem;\n  /* 14px */\n  --ptc-font-size-x-small: 1rem;\n  /* 16px */\n  --ptc-font-size-small: 1.125rem;\n  /* 18px */\n  --ptc-font-size-medium: 1.25rem;\n  /* 20px */\n  --ptc-font-size-large: 1.5rem;\n  /* 24px */\n  --ptc-font-size-x-large: 1.75rem;\n  /* 28px */\n  --ptc-font-size-xx-large: 2rem;\n  /* 32px */\n  --ptc-font-size-xxx-large: 2.25rem;\n  /* 36px */\n  --ptc-font-size-xxxx-large: 3rem;\n  /* 48px */\n  /* Font weights */\n  --ptc-font-weight-thin: 300;\n  --ptc-font-weight-regular: 400;\n  --ptc-font-weight-medium: 500;\n  --ptc-font-weight-semibold: 600;\n  --ptc-font-weight-bold: 700;\n  --ptc-font-weight-extrabold: 800;\n  --ptc-font-weight-black: 900;\n  /* Letter spacings */\n  --ptc-letter-spacing-dense: -0.015rem;\n  --ptc-letter-spacing-normal: normal;\n  --ptc-letter-spacing-loose: 0.075rem;\n  /* Line heights */\n  --ptc-line-height-densest: 1.25;\n  --ptc-line-height-denser: 1.4;\n  --ptc-line-height-dense: 1.6;\n  --ptc-line-height-normal: 1.8;\n  --ptc-line-height-loose: 2;\n  --ptc-line-height-looser: 2.2;\n  --ptc-line-height-p: 1.5;\n  /* Font Style*/\n  --ptc-font-style-italic: italic;\n  --ptc-font-style-oblique: oblique;\n  --ptc-font-style-normal: normal;\n}\n\nhtml,\nbody {\n  font-family: var(--ptc-font-latin);\n  width: 100%;\n  height: auto;\n  padding: 0;\n  margin: 0;\n  -moz-osx-font-smoothing: grayscale;\n  /*(For Firefox)*/\n}\n\nh1 {\n  font-size: var(--ptc-font-size-xxx-large);\n  font-weight: var(--ptc-font-weight-extrabold);\n  line-height: var(--ptc-line-height-densest);\n  margin-bottom: var(--ptc-element-spacing-03);\n}\n@media only screen and (min-width: 768px) {\n  h1 {\n    font-size: var(--ptc-font-size-xxxx-large);\n  }\n}\n\n.h1-special {\n  font-size: var(--ptc-font-size-medium);\n  font-weight: var(--ptc-font-weight-extrabold);\n  line-height: var(--ptc-line-height-densest);\n  margin-bottom: var(--ptc-element-spacing-01);\n}\n\nh2 {\n  font-size: var(--ptc-font-size-x-large);\n  font-weight: var(--ptc-font-weight-extrabold);\n  line-height: var(--ptc-line-height-densest);\n  margin-bottom: var(--ptc-element-spacing-03);\n}\n@media only screen and (min-width: 768px) {\n  h2 {\n    font-size: var(--ptc-font-size-xx-large);\n  }\n}\n\nh3 {\n  font-size: var(--ptc-font-size-medium);\n  font-weight: var(--ptc-font-weight-bold);\n  line-height: var(--ptc-line-height-densest);\n  margin-bottom: var(--ptc-element-spacing-01);\n}\n@media only screen and (min-width: 768px) {\n  h3 {\n    font-size: var(--ptc-font-size-large);\n  }\n}\n\nh4 {\n  font-size: var(--ptc-font-size-small);\n  font-weight: var(--ptc-font-weight-bold);\n  line-height: var(--ptc-line-height-densest);\n  margin-bottom: var(--ptc-element-spacing-01);\n}\n@media only screen and (min-width: 768px) {\n  h4 {\n    font-size: var(--ptc-font-size-medium);\n  }\n}\n\np {\n  color: var(--color-gray-10);\n  font-size: var(--ptc-font-size-small);\n  line-height: var(--ptc-line-height-p);\n  font-weight: var(--ptc-font-weight-regular);\n  margin-top: 0;\n  margin-bottom: var(--ptc-element-spacing-05);\n}\n\n.p-large {\n  font-size: var(--ptc-font-size-small);\n  line-height: var(--ptc-line-height-p);\n  font-weight: var(--ptc-font-weight-regular);\n  margin-bottom: var(--ptc-element-spacing-05);\n}\n\n.p-small {\n  font-size: var(--ptc-font-size-x-small);\n  line-height: var(--ptc-line-height-p);\n  font-weight: var(--ptc-font-weight-regular);\n  margin-bottom: var(--ptc-element-spacing-05);\n}\n\n.p-x-small {\n  font-size: var(--ptc-font-size-xx-small);\n  line-height: var(--ptc-line-height-p);\n  font-weight: var(--ptc-font-weight-semibold);\n  margin-bottom: var(--ptc-element-spacing-05);\n}\n\nblockquote p {\n  color: var(--color-gray-10);\n  line-height: 27px;\n  font-size: var(--ptc-font-size-large);\n  letter-spacing: 0.6px;\n  font-style: italic;\n  margin-bottom: var(--ptc-element-spacing-05);\n}\n\n/*\n* Elevation tokens\n*/\n:root {\n  --ptc-shadow-x-small: 0px 1px 4px rgba(0, 0, 0, 0.24);\n  --ptc-shadow-small: 0px 2px 6px rgba(0, 0, 0, 0.24);\n  --ptc-shadow-medium: 0px 4px 8px rgba(0, 0, 0, 0.24);\n  --ptc-shadow-large: 0px 6px 16px rgba(0, 0, 0, 0.24);\n  --ptc-shadow-x-large: 0px 8px 24px rgba(0, 0, 0, 0.24);\n}\n\n/*\n* Border radius tokens\n*/\n:root {\n  --ptc-border-radius-standard: 0.25rem; /* 4px Standard*/\n  --ptc-border-radius-large: 0.75rem; /* 12px Large */\n  --ptc-border-radius-pill: 9999px; /* 9999px Pill */\n  --ptc-border-radius-circle: 50%; /* 50% Circle*/\n  --ptc-clip-path-bottom-right: polygon(\n  \t100% 0,\n  \t100% 70%,\n  \t84% 100%,\n  \t0 100%,\n  \t0 0\n  );\n}\n\n/* Color demo */\n.color-demo {\n  width: 2rem;\n  height: 2rem;\n  border-radius: var(--ptc-border-radius-standard);\n  box-shadow: inset 0 0 1px rgba(0, 0, 0, 0.33);\n}\n\n/* Color demo */\n.color-demo-2 {\n  width: 2rem;\n  height: 2rem;\n  border-radius: var(--ptc-border-radius-circle);\n  box-shadow: inset 0 0 1px rgba(0, 0, 0, 0.33);\n}\n\n.color-palette-grid {\n  display: flex;\n  flex-direction: row;\n  flex-wrap: wrap;\n  align-items: center;\n}\n.color-palette-grid .swatch-set {\n  display: flex;\n  flex-direction: column;\n  flex-wrap: wrap;\n  -moz-column-count: 12;\n       column-count: 12;\n  align-items: center;\n  justify-content: space-evenly;\n}\n.color-palette-grid .swatch-set .swatch {\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  align-content: center;\n}\n.color-palette-grid .swatch-set .swatch .color-swatch {\n  display: inline-block;\n  width: 3rem;\n  height: 3rem;\n  margin: 1rem;\n  border-radius: var(--ptc-border-radius-circle);\n  box-shadow: inset 0 0 1px rgba(0, 0, 0, 0.33);\n}\n.color-palette-grid .swatch-set .swatch .swatch-text span {\n  display: block;\n  margin-right: 0.5rem;\n  color: var(--color-primary-gray);\n}\n\n/* Border radius demo */\n.border-radius-demo {\n  width: 3rem;\n  height: 3rem;\n  background: var(--color-gray-03);\n}\n\n/* Transition demo */\n.transition-demo,\n.transition-delay-demo,\n.transition-ease-demo {\n  position: relative;\n  background: var(--color-gray-03);\n  width: 10rem;\n  height: 2rem;\n}\n\n.transition-demo::after {\n  content: \"\";\n  position: absolute;\n  background-color: var(--color-green-08);\n  top: 0;\n  left: 0;\n  width: 0;\n  height: 100%;\n  transition-duration: inherit;\n  transition-property: width;\n}\n\n.transition-delay-demo::after {\n  content: \"\";\n  position: absolute;\n  background-color: var(--color-green-08);\n  top: 0;\n  left: 0;\n  width: 0;\n  height: 100%;\n  transition-duration: 1s;\n  transition-property: width;\n  transition-delay: inherit;\n}\n\n.transition-ease-demo::after {\n  content: \"\";\n  position: absolute;\n  background-color: var(--color-green-08);\n  top: 0;\n  left: 0;\n  width: 20%;\n  height: 100%;\n  transition-duration: 2s;\n  transition-property: left;\n  transition-timing-function: inherit;\n}\n\n.transition-demo:hover::after,\n.transition-delay-demo:hover::after {\n  width: 100%;\n}\n\n.transition-ease-demo:hover::after {\n  left: 80%;\n}\n\n.sl-theme-dark .transition-demo {\n  background: var(--color-gray-03);\n}\n\n/* Spacing demo */\n.spacing-demo {\n  width: 100px;\n  background: var(--color-blue-05);\n}\n\n/* Elevation dmeo */\n.elevation-demo {\n  background: var(--color-white);\n  border-radius: var(--ptc-border-radius-standard);\n  width: 4rem;\n  height: 4rem;\n}\n\n.sl-theme-dark .elevation-demo {\n  background-color: var(--color-gray-03);\n}\n\n/* Grid Demo*/\n.grid-demo-wrapper {\n  width: 500px;\n  border: 1px solid var(--color-gray-03);\n}\n\n.grid-demo-style > div {\n  background-color: var(--color-gray-10);\n  color: var(--color-white);\n  border-radius: var(--ptc-border-radius-standard);\n  font-size: var(--ptc-font-size-x-small);\n  padding: var(--ptc-element-spacing-04);\n}\n\n.grid-demo-child-style {\n  width: 100%;\n}\n.grid-demo-child-style > div {\n  background-color: var(--color-white);\n  border-radius: var(--ptc-border-radius-standard);\n  color: var(--color-gray-10);\n  padding: var(--ptc-element-spacing-04);\n}\n\n.title-demo-wrapper {\n  width: 100%;\n  border: 1px solid var(--color-gray-03);\n  padding: var(--ptc-element-spacing-04);\n  height: 300px;\n}\n\n.img-demo {\n  height: 400px;\n  width: 100%;\n}\n@media only screen and (min-width: 768px) {\n  .img-demo {\n    height: 550px;\n    width: 100%;\n  }\n}\n@media only screen and (min-width: 1200px) {\n  .img-demo {\n    height: 650px;\n    width: 100%;\n  }\n}\n\n.demo-with-bgcolor {\n  width: 100%;\n  border: 1px solid var(--color-gray-03);\n  padding: var(--ptc-element-spacing-04);\n  background-color: var(--color-gray-10);\n  height: auto;\n}\n\n.demo-plm-bgcolor {\n  background-color: var(--color-gray-12);\n}\n\n.demo-container-max {\n  max-width: 1980px;\n  margin: 0 auto;\n}\n\n.spacer-demo ptc-spacer {\n  background-color: var(--color-blue-01);\n}\n\n.motion-demo {\n  width: 100%;\n  border-radius: var(--color-gray-02);\n  background-color: var(--spectrum-global-color-gray-100);\n  min-height: 252px;\n  position: relative;\n  margin-bottom: 20px;\n  overflow: hidden;\n  border: 1px solid var(--color-gray-06);\n  display: flex;\n  align-content: center;\n  justify-content: center;\n  align-items: center;\n}\n\n.motion-object {\n  width: 120px;\n  height: 120px;\n  border-radius: var(--ptc-border-radius-circle);\n  background-color: var(--color-green-12);\n}\n\n.fitler-check-list-demo ptc-checkbox {\n  padding: 0.25rem 0;\n}\n\n.ptc-dropdown-demo {\n  min-height: 10rem;\n}\n\n/* -------------------------------------------\n\nPTC Design System is using Griddle Grid System.\nCredits to Dave Berning\n\n------------------------------------------- */\n/* Note:\n** These must be in the same order\n----------------------------------------- */\n/* Needed for Loops - Add to this if you add color variables\n----------------------------------------------------------------- */\n/* Class Generation\n------------------------- */\n/* Grid\n------------------------ */\n.is-grid,\n.is-grid-inline {\n  display: grid;\n  grid-template-rows: auto;\n  grid-template-columns: repeat(12, 1fr);\n  direction: ltr;\n  grid-column-gap: var(--col-gap);\n  grid-row-gap: var(--row-gap);\n}\n.is-grid > *,\n.is-grid-inline > * {\n  grid-column: span 12;\n}\n@media screen and (min-width: 992px) {\n  .is-grid > *,\n  .is-grid-inline > * {\n    grid-column: span 1;\n  }\n}\n.is-grid.is-dense,\n.is-grid-inline.is-dense {\n  grid-auto-flow: dense;\n  grid-template-rows: auto;\n  grid-template-columns: repeat(12, 1fr);\n}\n.is-grid.has-wrapped-row,\n.is-grid-inline.has-wrapped-row {\n  grid-auto-flow: row;\n  grid-template-rows: auto;\n  grid-template-columns: repeat(12, 1fr);\n}\n.is-grid.has-wrapped-row.is-dense,\n.is-grid-inline.has-wrapped-row.is-dense {\n  grid-auto-flow: row dense;\n  grid-template-rows: auto;\n  grid-template-columns: repeat(12, 1fr);\n}\n.is-grid.has-wrapped-col,\n.is-grid-inline.has-wrapped-col {\n  grid-auto-flow: column;\n}\n.is-grid.has-wrapped-col.is-dense,\n.is-grid-inline.has-wrapped-col.is-dense {\n  grid-auto-flow: column dense;\n  grid-template-rows: auto;\n  grid-template-columns: repeat(12, 1fr);\n}\n\n.is-grid-inline {\n  display: inline-grid !important;\n}\n\n.has-row-1 {\n  grid-template-rows: repeat(1, 1fr);\n}\n.has-row-1 > * {\n  grid-column: span 1;\n}\n@media screen and (min-width: 992px) {\n  .has-row-1 > * {\n    grid-column: span 1;\n  }\n}\n\n.has-row-1-xs > * {\n  grid-column: span 1;\n}\n@media screen and (min-width: 992px) {\n  .has-row-1-xs > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 575.5px) {\n  .has-row-1-xs {\n    grid-template-rows: repeat(1, 1fr) !important;\n  }\n}\n\n.has-row-1-sm > * {\n  grid-column: span 1;\n}\n@media screen and (min-width: 992px) {\n  .has-row-1-sm > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 576px) {\n  .has-row-1-sm {\n    grid-template-rows: repeat(1, 1fr) !important;\n  }\n}\n\n.has-row-1-md > * {\n  grid-column: span 1;\n}\n@media screen and (min-width: 992px) {\n  .has-row-1-md > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 768px) {\n  .has-row-1-md {\n    grid-template-rows: repeat(1, 1fr) !important;\n  }\n}\n\n.has-row-1-lg > * {\n  grid-column: span 1;\n}\n@media screen and (min-width: 992px) {\n  .has-row-1-lg > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 992px) {\n  .has-row-1-lg {\n    grid-template-rows: repeat(1, 1fr) !important;\n  }\n}\n\n.has-row-1-xl > * {\n  grid-column: span 1;\n}\n@media screen and (min-width: 992px) {\n  .has-row-1-xl > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 1200px) {\n  .has-row-1-xl {\n    grid-template-rows: repeat(1, 1fr) !important;\n  }\n}\n\n.has-row-1-xxl > * {\n  grid-column: span 1;\n}\n@media screen and (min-width: 992px) {\n  .has-row-1-xxl > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 1440px) {\n  .has-row-1-xxl {\n    grid-template-rows: repeat(1, 1fr) !important;\n  }\n}\n\n.has-row-2 {\n  grid-template-rows: repeat(2, 1fr);\n}\n.has-row-2 > * {\n  grid-column: span 2;\n}\n@media screen and (min-width: 992px) {\n  .has-row-2 > * {\n    grid-column: span 1;\n  }\n}\n\n.has-row-2-xs > * {\n  grid-column: span 2;\n}\n@media screen and (min-width: 992px) {\n  .has-row-2-xs > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 575.5px) {\n  .has-row-2-xs {\n    grid-template-rows: repeat(2, 1fr) !important;\n  }\n}\n\n.has-row-2-sm > * {\n  grid-column: span 2;\n}\n@media screen and (min-width: 992px) {\n  .has-row-2-sm > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 576px) {\n  .has-row-2-sm {\n    grid-template-rows: repeat(2, 1fr) !important;\n  }\n}\n\n.has-row-2-md > * {\n  grid-column: span 2;\n}\n@media screen and (min-width: 992px) {\n  .has-row-2-md > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 768px) {\n  .has-row-2-md {\n    grid-template-rows: repeat(2, 1fr) !important;\n  }\n}\n\n.has-row-2-lg > * {\n  grid-column: span 2;\n}\n@media screen and (min-width: 992px) {\n  .has-row-2-lg > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 992px) {\n  .has-row-2-lg {\n    grid-template-rows: repeat(2, 1fr) !important;\n  }\n}\n\n.has-row-2-xl > * {\n  grid-column: span 2;\n}\n@media screen and (min-width: 992px) {\n  .has-row-2-xl > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 1200px) {\n  .has-row-2-xl {\n    grid-template-rows: repeat(2, 1fr) !important;\n  }\n}\n\n.has-row-2-xxl > * {\n  grid-column: span 2;\n}\n@media screen and (min-width: 992px) {\n  .has-row-2-xxl > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 1440px) {\n  .has-row-2-xxl {\n    grid-template-rows: repeat(2, 1fr) !important;\n  }\n}\n\n.has-row-3 {\n  grid-template-rows: repeat(3, 1fr);\n}\n.has-row-3 > * {\n  grid-column: span 3;\n}\n@media screen and (min-width: 992px) {\n  .has-row-3 > * {\n    grid-column: span 1;\n  }\n}\n\n.has-row-3-xs > * {\n  grid-column: span 3;\n}\n@media screen and (min-width: 992px) {\n  .has-row-3-xs > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 575.5px) {\n  .has-row-3-xs {\n    grid-template-rows: repeat(3, 1fr) !important;\n  }\n}\n\n.has-row-3-sm > * {\n  grid-column: span 3;\n}\n@media screen and (min-width: 992px) {\n  .has-row-3-sm > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 576px) {\n  .has-row-3-sm {\n    grid-template-rows: repeat(3, 1fr) !important;\n  }\n}\n\n.has-row-3-md > * {\n  grid-column: span 3;\n}\n@media screen and (min-width: 992px) {\n  .has-row-3-md > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 768px) {\n  .has-row-3-md {\n    grid-template-rows: repeat(3, 1fr) !important;\n  }\n}\n\n.has-row-3-lg > * {\n  grid-column: span 3;\n}\n@media screen and (min-width: 992px) {\n  .has-row-3-lg > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 992px) {\n  .has-row-3-lg {\n    grid-template-rows: repeat(3, 1fr) !important;\n  }\n}\n\n.has-row-3-xl > * {\n  grid-column: span 3;\n}\n@media screen and (min-width: 992px) {\n  .has-row-3-xl > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 1200px) {\n  .has-row-3-xl {\n    grid-template-rows: repeat(3, 1fr) !important;\n  }\n}\n\n.has-row-3-xxl > * {\n  grid-column: span 3;\n}\n@media screen and (min-width: 992px) {\n  .has-row-3-xxl > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 1440px) {\n  .has-row-3-xxl {\n    grid-template-rows: repeat(3, 1fr) !important;\n  }\n}\n\n.has-row-4 {\n  grid-template-rows: repeat(4, 1fr);\n}\n.has-row-4 > * {\n  grid-column: span 4;\n}\n@media screen and (min-width: 992px) {\n  .has-row-4 > * {\n    grid-column: span 1;\n  }\n}\n\n.has-row-4-xs > * {\n  grid-column: span 4;\n}\n@media screen and (min-width: 992px) {\n  .has-row-4-xs > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 575.5px) {\n  .has-row-4-xs {\n    grid-template-rows: repeat(4, 1fr) !important;\n  }\n}\n\n.has-row-4-sm > * {\n  grid-column: span 4;\n}\n@media screen and (min-width: 992px) {\n  .has-row-4-sm > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 576px) {\n  .has-row-4-sm {\n    grid-template-rows: repeat(4, 1fr) !important;\n  }\n}\n\n.has-row-4-md > * {\n  grid-column: span 4;\n}\n@media screen and (min-width: 992px) {\n  .has-row-4-md > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 768px) {\n  .has-row-4-md {\n    grid-template-rows: repeat(4, 1fr) !important;\n  }\n}\n\n.has-row-4-lg > * {\n  grid-column: span 4;\n}\n@media screen and (min-width: 992px) {\n  .has-row-4-lg > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 992px) {\n  .has-row-4-lg {\n    grid-template-rows: repeat(4, 1fr) !important;\n  }\n}\n\n.has-row-4-xl > * {\n  grid-column: span 4;\n}\n@media screen and (min-width: 992px) {\n  .has-row-4-xl > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 1200px) {\n  .has-row-4-xl {\n    grid-template-rows: repeat(4, 1fr) !important;\n  }\n}\n\n.has-row-4-xxl > * {\n  grid-column: span 4;\n}\n@media screen and (min-width: 992px) {\n  .has-row-4-xxl > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 1440px) {\n  .has-row-4-xxl {\n    grid-template-rows: repeat(4, 1fr) !important;\n  }\n}\n\n.has-row-5 {\n  grid-template-rows: repeat(5, 1fr);\n}\n.has-row-5 > * {\n  grid-column: span 5;\n}\n@media screen and (min-width: 992px) {\n  .has-row-5 > * {\n    grid-column: span 1;\n  }\n}\n\n.has-row-5-xs > * {\n  grid-column: span 5;\n}\n@media screen and (min-width: 992px) {\n  .has-row-5-xs > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 575.5px) {\n  .has-row-5-xs {\n    grid-template-rows: repeat(5, 1fr) !important;\n  }\n}\n\n.has-row-5-sm > * {\n  grid-column: span 5;\n}\n@media screen and (min-width: 992px) {\n  .has-row-5-sm > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 576px) {\n  .has-row-5-sm {\n    grid-template-rows: repeat(5, 1fr) !important;\n  }\n}\n\n.has-row-5-md > * {\n  grid-column: span 5;\n}\n@media screen and (min-width: 992px) {\n  .has-row-5-md > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 768px) {\n  .has-row-5-md {\n    grid-template-rows: repeat(5, 1fr) !important;\n  }\n}\n\n.has-row-5-lg > * {\n  grid-column: span 5;\n}\n@media screen and (min-width: 992px) {\n  .has-row-5-lg > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 992px) {\n  .has-row-5-lg {\n    grid-template-rows: repeat(5, 1fr) !important;\n  }\n}\n\n.has-row-5-xl > * {\n  grid-column: span 5;\n}\n@media screen and (min-width: 992px) {\n  .has-row-5-xl > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 1200px) {\n  .has-row-5-xl {\n    grid-template-rows: repeat(5, 1fr) !important;\n  }\n}\n\n.has-row-5-xxl > * {\n  grid-column: span 5;\n}\n@media screen and (min-width: 992px) {\n  .has-row-5-xxl > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 1440px) {\n  .has-row-5-xxl {\n    grid-template-rows: repeat(5, 1fr) !important;\n  }\n}\n\n.has-row-6 {\n  grid-template-rows: repeat(6, 1fr);\n}\n.has-row-6 > * {\n  grid-column: span 6;\n}\n@media screen and (min-width: 992px) {\n  .has-row-6 > * {\n    grid-column: span 1;\n  }\n}\n\n.has-row-6-xs > * {\n  grid-column: span 6;\n}\n@media screen and (min-width: 992px) {\n  .has-row-6-xs > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 575.5px) {\n  .has-row-6-xs {\n    grid-template-rows: repeat(6, 1fr) !important;\n  }\n}\n\n.has-row-6-sm > * {\n  grid-column: span 6;\n}\n@media screen and (min-width: 992px) {\n  .has-row-6-sm > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 576px) {\n  .has-row-6-sm {\n    grid-template-rows: repeat(6, 1fr) !important;\n  }\n}\n\n.has-row-6-md > * {\n  grid-column: span 6;\n}\n@media screen and (min-width: 992px) {\n  .has-row-6-md > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 768px) {\n  .has-row-6-md {\n    grid-template-rows: repeat(6, 1fr) !important;\n  }\n}\n\n.has-row-6-lg > * {\n  grid-column: span 6;\n}\n@media screen and (min-width: 992px) {\n  .has-row-6-lg > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 992px) {\n  .has-row-6-lg {\n    grid-template-rows: repeat(6, 1fr) !important;\n  }\n}\n\n.has-row-6-xl > * {\n  grid-column: span 6;\n}\n@media screen and (min-width: 992px) {\n  .has-row-6-xl > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 1200px) {\n  .has-row-6-xl {\n    grid-template-rows: repeat(6, 1fr) !important;\n  }\n}\n\n.has-row-6-xxl > * {\n  grid-column: span 6;\n}\n@media screen and (min-width: 992px) {\n  .has-row-6-xxl > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 1440px) {\n  .has-row-6-xxl {\n    grid-template-rows: repeat(6, 1fr) !important;\n  }\n}\n\n.has-row-7 {\n  grid-template-rows: repeat(7, 1fr);\n}\n.has-row-7 > * {\n  grid-column: span 7;\n}\n@media screen and (min-width: 992px) {\n  .has-row-7 > * {\n    grid-column: span 1;\n  }\n}\n\n.has-row-7-xs > * {\n  grid-column: span 7;\n}\n@media screen and (min-width: 992px) {\n  .has-row-7-xs > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 575.5px) {\n  .has-row-7-xs {\n    grid-template-rows: repeat(7, 1fr) !important;\n  }\n}\n\n.has-row-7-sm > * {\n  grid-column: span 7;\n}\n@media screen and (min-width: 992px) {\n  .has-row-7-sm > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 576px) {\n  .has-row-7-sm {\n    grid-template-rows: repeat(7, 1fr) !important;\n  }\n}\n\n.has-row-7-md > * {\n  grid-column: span 7;\n}\n@media screen and (min-width: 992px) {\n  .has-row-7-md > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 768px) {\n  .has-row-7-md {\n    grid-template-rows: repeat(7, 1fr) !important;\n  }\n}\n\n.has-row-7-lg > * {\n  grid-column: span 7;\n}\n@media screen and (min-width: 992px) {\n  .has-row-7-lg > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 992px) {\n  .has-row-7-lg {\n    grid-template-rows: repeat(7, 1fr) !important;\n  }\n}\n\n.has-row-7-xl > * {\n  grid-column: span 7;\n}\n@media screen and (min-width: 992px) {\n  .has-row-7-xl > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 1200px) {\n  .has-row-7-xl {\n    grid-template-rows: repeat(7, 1fr) !important;\n  }\n}\n\n.has-row-7-xxl > * {\n  grid-column: span 7;\n}\n@media screen and (min-width: 992px) {\n  .has-row-7-xxl > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 1440px) {\n  .has-row-7-xxl {\n    grid-template-rows: repeat(7, 1fr) !important;\n  }\n}\n\n.has-row-8 {\n  grid-template-rows: repeat(8, 1fr);\n}\n.has-row-8 > * {\n  grid-column: span 8;\n}\n@media screen and (min-width: 992px) {\n  .has-row-8 > * {\n    grid-column: span 1;\n  }\n}\n\n.has-row-8-xs > * {\n  grid-column: span 8;\n}\n@media screen and (min-width: 992px) {\n  .has-row-8-xs > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 575.5px) {\n  .has-row-8-xs {\n    grid-template-rows: repeat(8, 1fr) !important;\n  }\n}\n\n.has-row-8-sm > * {\n  grid-column: span 8;\n}\n@media screen and (min-width: 992px) {\n  .has-row-8-sm > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 576px) {\n  .has-row-8-sm {\n    grid-template-rows: repeat(8, 1fr) !important;\n  }\n}\n\n.has-row-8-md > * {\n  grid-column: span 8;\n}\n@media screen and (min-width: 992px) {\n  .has-row-8-md > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 768px) {\n  .has-row-8-md {\n    grid-template-rows: repeat(8, 1fr) !important;\n  }\n}\n\n.has-row-8-lg > * {\n  grid-column: span 8;\n}\n@media screen and (min-width: 992px) {\n  .has-row-8-lg > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 992px) {\n  .has-row-8-lg {\n    grid-template-rows: repeat(8, 1fr) !important;\n  }\n}\n\n.has-row-8-xl > * {\n  grid-column: span 8;\n}\n@media screen and (min-width: 992px) {\n  .has-row-8-xl > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 1200px) {\n  .has-row-8-xl {\n    grid-template-rows: repeat(8, 1fr) !important;\n  }\n}\n\n.has-row-8-xxl > * {\n  grid-column: span 8;\n}\n@media screen and (min-width: 992px) {\n  .has-row-8-xxl > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 1440px) {\n  .has-row-8-xxl {\n    grid-template-rows: repeat(8, 1fr) !important;\n  }\n}\n\n.has-row-9 {\n  grid-template-rows: repeat(9, 1fr);\n}\n.has-row-9 > * {\n  grid-column: span 9;\n}\n@media screen and (min-width: 992px) {\n  .has-row-9 > * {\n    grid-column: span 1;\n  }\n}\n\n.has-row-9-xs > * {\n  grid-column: span 9;\n}\n@media screen and (min-width: 992px) {\n  .has-row-9-xs > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 575.5px) {\n  .has-row-9-xs {\n    grid-template-rows: repeat(9, 1fr) !important;\n  }\n}\n\n.has-row-9-sm > * {\n  grid-column: span 9;\n}\n@media screen and (min-width: 992px) {\n  .has-row-9-sm > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 576px) {\n  .has-row-9-sm {\n    grid-template-rows: repeat(9, 1fr) !important;\n  }\n}\n\n.has-row-9-md > * {\n  grid-column: span 9;\n}\n@media screen and (min-width: 992px) {\n  .has-row-9-md > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 768px) {\n  .has-row-9-md {\n    grid-template-rows: repeat(9, 1fr) !important;\n  }\n}\n\n.has-row-9-lg > * {\n  grid-column: span 9;\n}\n@media screen and (min-width: 992px) {\n  .has-row-9-lg > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 992px) {\n  .has-row-9-lg {\n    grid-template-rows: repeat(9, 1fr) !important;\n  }\n}\n\n.has-row-9-xl > * {\n  grid-column: span 9;\n}\n@media screen and (min-width: 992px) {\n  .has-row-9-xl > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 1200px) {\n  .has-row-9-xl {\n    grid-template-rows: repeat(9, 1fr) !important;\n  }\n}\n\n.has-row-9-xxl > * {\n  grid-column: span 9;\n}\n@media screen and (min-width: 992px) {\n  .has-row-9-xxl > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 1440px) {\n  .has-row-9-xxl {\n    grid-template-rows: repeat(9, 1fr) !important;\n  }\n}\n\n.has-row-10 {\n  grid-template-rows: repeat(10, 1fr);\n}\n.has-row-10 > * {\n  grid-column: span 10;\n}\n@media screen and (min-width: 992px) {\n  .has-row-10 > * {\n    grid-column: span 1;\n  }\n}\n\n.has-row-10-xs > * {\n  grid-column: span 10;\n}\n@media screen and (min-width: 992px) {\n  .has-row-10-xs > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 575.5px) {\n  .has-row-10-xs {\n    grid-template-rows: repeat(10, 1fr) !important;\n  }\n}\n\n.has-row-10-sm > * {\n  grid-column: span 10;\n}\n@media screen and (min-width: 992px) {\n  .has-row-10-sm > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 576px) {\n  .has-row-10-sm {\n    grid-template-rows: repeat(10, 1fr) !important;\n  }\n}\n\n.has-row-10-md > * {\n  grid-column: span 10;\n}\n@media screen and (min-width: 992px) {\n  .has-row-10-md > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 768px) {\n  .has-row-10-md {\n    grid-template-rows: repeat(10, 1fr) !important;\n  }\n}\n\n.has-row-10-lg > * {\n  grid-column: span 10;\n}\n@media screen and (min-width: 992px) {\n  .has-row-10-lg > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 992px) {\n  .has-row-10-lg {\n    grid-template-rows: repeat(10, 1fr) !important;\n  }\n}\n\n.has-row-10-xl > * {\n  grid-column: span 10;\n}\n@media screen and (min-width: 992px) {\n  .has-row-10-xl > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 1200px) {\n  .has-row-10-xl {\n    grid-template-rows: repeat(10, 1fr) !important;\n  }\n}\n\n.has-row-10-xxl > * {\n  grid-column: span 10;\n}\n@media screen and (min-width: 992px) {\n  .has-row-10-xxl > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 1440px) {\n  .has-row-10-xxl {\n    grid-template-rows: repeat(10, 1fr) !important;\n  }\n}\n\n.has-row-11 {\n  grid-template-rows: repeat(11, 1fr);\n}\n.has-row-11 > * {\n  grid-column: span 11;\n}\n@media screen and (min-width: 992px) {\n  .has-row-11 > * {\n    grid-column: span 1;\n  }\n}\n\n.has-row-11-xs > * {\n  grid-column: span 11;\n}\n@media screen and (min-width: 992px) {\n  .has-row-11-xs > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 575.5px) {\n  .has-row-11-xs {\n    grid-template-rows: repeat(11, 1fr) !important;\n  }\n}\n\n.has-row-11-sm > * {\n  grid-column: span 11;\n}\n@media screen and (min-width: 992px) {\n  .has-row-11-sm > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 576px) {\n  .has-row-11-sm {\n    grid-template-rows: repeat(11, 1fr) !important;\n  }\n}\n\n.has-row-11-md > * {\n  grid-column: span 11;\n}\n@media screen and (min-width: 992px) {\n  .has-row-11-md > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 768px) {\n  .has-row-11-md {\n    grid-template-rows: repeat(11, 1fr) !important;\n  }\n}\n\n.has-row-11-lg > * {\n  grid-column: span 11;\n}\n@media screen and (min-width: 992px) {\n  .has-row-11-lg > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 992px) {\n  .has-row-11-lg {\n    grid-template-rows: repeat(11, 1fr) !important;\n  }\n}\n\n.has-row-11-xl > * {\n  grid-column: span 11;\n}\n@media screen and (min-width: 992px) {\n  .has-row-11-xl > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 1200px) {\n  .has-row-11-xl {\n    grid-template-rows: repeat(11, 1fr) !important;\n  }\n}\n\n.has-row-11-xxl > * {\n  grid-column: span 11;\n}\n@media screen and (min-width: 992px) {\n  .has-row-11-xxl > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 1440px) {\n  .has-row-11-xxl {\n    grid-template-rows: repeat(11, 1fr) !important;\n  }\n}\n\n.has-row-12 {\n  grid-template-rows: repeat(12, 1fr);\n}\n.has-row-12 > * {\n  grid-column: span 12;\n}\n@media screen and (min-width: 992px) {\n  .has-row-12 > * {\n    grid-column: span 1;\n  }\n}\n\n.has-row-12-xs > * {\n  grid-column: span 12;\n}\n@media screen and (min-width: 992px) {\n  .has-row-12-xs > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 575.5px) {\n  .has-row-12-xs {\n    grid-template-rows: repeat(12, 1fr) !important;\n  }\n}\n\n.has-row-12-sm > * {\n  grid-column: span 12;\n}\n@media screen and (min-width: 992px) {\n  .has-row-12-sm > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 576px) {\n  .has-row-12-sm {\n    grid-template-rows: repeat(12, 1fr) !important;\n  }\n}\n\n.has-row-12-md > * {\n  grid-column: span 12;\n}\n@media screen and (min-width: 992px) {\n  .has-row-12-md > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 768px) {\n  .has-row-12-md {\n    grid-template-rows: repeat(12, 1fr) !important;\n  }\n}\n\n.has-row-12-lg > * {\n  grid-column: span 12;\n}\n@media screen and (min-width: 992px) {\n  .has-row-12-lg > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 992px) {\n  .has-row-12-lg {\n    grid-template-rows: repeat(12, 1fr) !important;\n  }\n}\n\n.has-row-12-xl > * {\n  grid-column: span 12;\n}\n@media screen and (min-width: 992px) {\n  .has-row-12-xl > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 1200px) {\n  .has-row-12-xl {\n    grid-template-rows: repeat(12, 1fr) !important;\n  }\n}\n\n.has-row-12-xxl > * {\n  grid-column: span 12;\n}\n@media screen and (min-width: 992px) {\n  .has-row-12-xxl > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 1440px) {\n  .has-row-12-xxl {\n    grid-template-rows: repeat(12, 1fr) !important;\n  }\n}\n\n.has-col-1 {\n  grid-template-columns: repeat(1, 1fr);\n}\n.has-col-1 > * {\n  grid-column: span 1;\n}\n@media screen and (min-width: 992px) {\n  .has-col-1 > * {\n    grid-column: span 1;\n  }\n}\n\n.has-col-1-xs > * {\n  grid-column: span 1;\n}\n@media screen and (min-width: 992px) {\n  .has-col-1-xs > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 575.5px) {\n  .has-col-1-xs {\n    grid-template-columns: repeat(1, 1fr) !important;\n  }\n}\n\n.has-col-1-sm > * {\n  grid-column: span 1;\n}\n@media screen and (min-width: 992px) {\n  .has-col-1-sm > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 576px) {\n  .has-col-1-sm {\n    grid-template-columns: repeat(1, 1fr) !important;\n  }\n}\n\n.has-col-1-md > * {\n  grid-column: span 1;\n}\n@media screen and (min-width: 992px) {\n  .has-col-1-md > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 768px) {\n  .has-col-1-md {\n    grid-template-columns: repeat(1, 1fr) !important;\n  }\n}\n\n.has-col-1-lg > * {\n  grid-column: span 1;\n}\n@media screen and (min-width: 992px) {\n  .has-col-1-lg > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 992px) {\n  .has-col-1-lg {\n    grid-template-columns: repeat(1, 1fr) !important;\n  }\n}\n\n.has-col-1-xl > * {\n  grid-column: span 1;\n}\n@media screen and (min-width: 992px) {\n  .has-col-1-xl > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 1200px) {\n  .has-col-1-xl {\n    grid-template-columns: repeat(1, 1fr) !important;\n  }\n}\n\n.has-col-1-xxl > * {\n  grid-column: span 1;\n}\n@media screen and (min-width: 992px) {\n  .has-col-1-xxl > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 1440px) {\n  .has-col-1-xxl {\n    grid-template-columns: repeat(1, 1fr) !important;\n  }\n}\n\n.has-col-2 {\n  grid-template-columns: repeat(2, 1fr);\n}\n.has-col-2 > * {\n  grid-column: span 2;\n}\n@media screen and (min-width: 992px) {\n  .has-col-2 > * {\n    grid-column: span 1;\n  }\n}\n\n.has-col-2-xs > * {\n  grid-column: span 2;\n}\n@media screen and (min-width: 992px) {\n  .has-col-2-xs > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 575.5px) {\n  .has-col-2-xs {\n    grid-template-columns: repeat(2, 1fr) !important;\n  }\n}\n\n.has-col-2-sm > * {\n  grid-column: span 2;\n}\n@media screen and (min-width: 992px) {\n  .has-col-2-sm > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 576px) {\n  .has-col-2-sm {\n    grid-template-columns: repeat(2, 1fr) !important;\n  }\n}\n\n.has-col-2-md > * {\n  grid-column: span 2;\n}\n@media screen and (min-width: 992px) {\n  .has-col-2-md > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 768px) {\n  .has-col-2-md {\n    grid-template-columns: repeat(2, 1fr) !important;\n  }\n}\n\n.has-col-2-lg > * {\n  grid-column: span 2;\n}\n@media screen and (min-width: 992px) {\n  .has-col-2-lg > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 992px) {\n  .has-col-2-lg {\n    grid-template-columns: repeat(2, 1fr) !important;\n  }\n}\n\n.has-col-2-xl > * {\n  grid-column: span 2;\n}\n@media screen and (min-width: 992px) {\n  .has-col-2-xl > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 1200px) {\n  .has-col-2-xl {\n    grid-template-columns: repeat(2, 1fr) !important;\n  }\n}\n\n.has-col-2-xxl > * {\n  grid-column: span 2;\n}\n@media screen and (min-width: 992px) {\n  .has-col-2-xxl > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 1440px) {\n  .has-col-2-xxl {\n    grid-template-columns: repeat(2, 1fr) !important;\n  }\n}\n\n.has-col-3 {\n  grid-template-columns: repeat(3, 1fr);\n}\n.has-col-3 > * {\n  grid-column: span 3;\n}\n@media screen and (min-width: 992px) {\n  .has-col-3 > * {\n    grid-column: span 1;\n  }\n}\n\n.has-col-3-xs > * {\n  grid-column: span 3;\n}\n@media screen and (min-width: 992px) {\n  .has-col-3-xs > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 575.5px) {\n  .has-col-3-xs {\n    grid-template-columns: repeat(3, 1fr) !important;\n  }\n}\n\n.has-col-3-sm > * {\n  grid-column: span 3;\n}\n@media screen and (min-width: 992px) {\n  .has-col-3-sm > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 576px) {\n  .has-col-3-sm {\n    grid-template-columns: repeat(3, 1fr) !important;\n  }\n}\n\n.has-col-3-md > * {\n  grid-column: span 3;\n}\n@media screen and (min-width: 992px) {\n  .has-col-3-md > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 768px) {\n  .has-col-3-md {\n    grid-template-columns: repeat(3, 1fr) !important;\n  }\n}\n\n.has-col-3-lg > * {\n  grid-column: span 3;\n}\n@media screen and (min-width: 992px) {\n  .has-col-3-lg > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 992px) {\n  .has-col-3-lg {\n    grid-template-columns: repeat(3, 1fr) !important;\n  }\n}\n\n.has-col-3-xl > * {\n  grid-column: span 3;\n}\n@media screen and (min-width: 992px) {\n  .has-col-3-xl > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 1200px) {\n  .has-col-3-xl {\n    grid-template-columns: repeat(3, 1fr) !important;\n  }\n}\n\n.has-col-3-xxl > * {\n  grid-column: span 3;\n}\n@media screen and (min-width: 992px) {\n  .has-col-3-xxl > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 1440px) {\n  .has-col-3-xxl {\n    grid-template-columns: repeat(3, 1fr) !important;\n  }\n}\n\n.has-col-4 {\n  grid-template-columns: repeat(4, 1fr);\n}\n.has-col-4 > * {\n  grid-column: span 4;\n}\n@media screen and (min-width: 992px) {\n  .has-col-4 > * {\n    grid-column: span 1;\n  }\n}\n\n.has-col-4-xs > * {\n  grid-column: span 4;\n}\n@media screen and (min-width: 992px) {\n  .has-col-4-xs > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 575.5px) {\n  .has-col-4-xs {\n    grid-template-columns: repeat(4, 1fr) !important;\n  }\n}\n\n.has-col-4-sm > * {\n  grid-column: span 4;\n}\n@media screen and (min-width: 992px) {\n  .has-col-4-sm > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 576px) {\n  .has-col-4-sm {\n    grid-template-columns: repeat(4, 1fr) !important;\n  }\n}\n\n.has-col-4-md > * {\n  grid-column: span 4;\n}\n@media screen and (min-width: 992px) {\n  .has-col-4-md > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 768px) {\n  .has-col-4-md {\n    grid-template-columns: repeat(4, 1fr) !important;\n  }\n}\n\n.has-col-4-lg > * {\n  grid-column: span 4;\n}\n@media screen and (min-width: 992px) {\n  .has-col-4-lg > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 992px) {\n  .has-col-4-lg {\n    grid-template-columns: repeat(4, 1fr) !important;\n  }\n}\n\n.has-col-4-xl > * {\n  grid-column: span 4;\n}\n@media screen and (min-width: 992px) {\n  .has-col-4-xl > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 1200px) {\n  .has-col-4-xl {\n    grid-template-columns: repeat(4, 1fr) !important;\n  }\n}\n\n.has-col-4-xxl > * {\n  grid-column: span 4;\n}\n@media screen and (min-width: 992px) {\n  .has-col-4-xxl > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 1440px) {\n  .has-col-4-xxl {\n    grid-template-columns: repeat(4, 1fr) !important;\n  }\n}\n\n.has-col-5 {\n  grid-template-columns: repeat(5, 1fr);\n}\n.has-col-5 > * {\n  grid-column: span 5;\n}\n@media screen and (min-width: 992px) {\n  .has-col-5 > * {\n    grid-column: span 1;\n  }\n}\n\n.has-col-5-xs > * {\n  grid-column: span 5;\n}\n@media screen and (min-width: 992px) {\n  .has-col-5-xs > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 575.5px) {\n  .has-col-5-xs {\n    grid-template-columns: repeat(5, 1fr) !important;\n  }\n}\n\n.has-col-5-sm > * {\n  grid-column: span 5;\n}\n@media screen and (min-width: 992px) {\n  .has-col-5-sm > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 576px) {\n  .has-col-5-sm {\n    grid-template-columns: repeat(5, 1fr) !important;\n  }\n}\n\n.has-col-5-md > * {\n  grid-column: span 5;\n}\n@media screen and (min-width: 992px) {\n  .has-col-5-md > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 768px) {\n  .has-col-5-md {\n    grid-template-columns: repeat(5, 1fr) !important;\n  }\n}\n\n.has-col-5-lg > * {\n  grid-column: span 5;\n}\n@media screen and (min-width: 992px) {\n  .has-col-5-lg > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 992px) {\n  .has-col-5-lg {\n    grid-template-columns: repeat(5, 1fr) !important;\n  }\n}\n\n.has-col-5-xl > * {\n  grid-column: span 5;\n}\n@media screen and (min-width: 992px) {\n  .has-col-5-xl > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 1200px) {\n  .has-col-5-xl {\n    grid-template-columns: repeat(5, 1fr) !important;\n  }\n}\n\n.has-col-5-xxl > * {\n  grid-column: span 5;\n}\n@media screen and (min-width: 992px) {\n  .has-col-5-xxl > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 1440px) {\n  .has-col-5-xxl {\n    grid-template-columns: repeat(5, 1fr) !important;\n  }\n}\n\n.has-col-6 {\n  grid-template-columns: repeat(6, 1fr);\n}\n.has-col-6 > * {\n  grid-column: span 6;\n}\n@media screen and (min-width: 992px) {\n  .has-col-6 > * {\n    grid-column: span 1;\n  }\n}\n\n.has-col-6-xs > * {\n  grid-column: span 6;\n}\n@media screen and (min-width: 992px) {\n  .has-col-6-xs > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 575.5px) {\n  .has-col-6-xs {\n    grid-template-columns: repeat(6, 1fr) !important;\n  }\n}\n\n.has-col-6-sm > * {\n  grid-column: span 6;\n}\n@media screen and (min-width: 992px) {\n  .has-col-6-sm > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 576px) {\n  .has-col-6-sm {\n    grid-template-columns: repeat(6, 1fr) !important;\n  }\n}\n\n.has-col-6-md > * {\n  grid-column: span 6;\n}\n@media screen and (min-width: 992px) {\n  .has-col-6-md > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 768px) {\n  .has-col-6-md {\n    grid-template-columns: repeat(6, 1fr) !important;\n  }\n}\n\n.has-col-6-lg > * {\n  grid-column: span 6;\n}\n@media screen and (min-width: 992px) {\n  .has-col-6-lg > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 992px) {\n  .has-col-6-lg {\n    grid-template-columns: repeat(6, 1fr) !important;\n  }\n}\n\n.has-col-6-xl > * {\n  grid-column: span 6;\n}\n@media screen and (min-width: 992px) {\n  .has-col-6-xl > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 1200px) {\n  .has-col-6-xl {\n    grid-template-columns: repeat(6, 1fr) !important;\n  }\n}\n\n.has-col-6-xxl > * {\n  grid-column: span 6;\n}\n@media screen and (min-width: 992px) {\n  .has-col-6-xxl > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 1440px) {\n  .has-col-6-xxl {\n    grid-template-columns: repeat(6, 1fr) !important;\n  }\n}\n\n.has-col-7 {\n  grid-template-columns: repeat(7, 1fr);\n}\n.has-col-7 > * {\n  grid-column: span 7;\n}\n@media screen and (min-width: 992px) {\n  .has-col-7 > * {\n    grid-column: span 1;\n  }\n}\n\n.has-col-7-xs > * {\n  grid-column: span 7;\n}\n@media screen and (min-width: 992px) {\n  .has-col-7-xs > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 575.5px) {\n  .has-col-7-xs {\n    grid-template-columns: repeat(7, 1fr) !important;\n  }\n}\n\n.has-col-7-sm > * {\n  grid-column: span 7;\n}\n@media screen and (min-width: 992px) {\n  .has-col-7-sm > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 576px) {\n  .has-col-7-sm {\n    grid-template-columns: repeat(7, 1fr) !important;\n  }\n}\n\n.has-col-7-md > * {\n  grid-column: span 7;\n}\n@media screen and (min-width: 992px) {\n  .has-col-7-md > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 768px) {\n  .has-col-7-md {\n    grid-template-columns: repeat(7, 1fr) !important;\n  }\n}\n\n.has-col-7-lg > * {\n  grid-column: span 7;\n}\n@media screen and (min-width: 992px) {\n  .has-col-7-lg > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 992px) {\n  .has-col-7-lg {\n    grid-template-columns: repeat(7, 1fr) !important;\n  }\n}\n\n.has-col-7-xl > * {\n  grid-column: span 7;\n}\n@media screen and (min-width: 992px) {\n  .has-col-7-xl > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 1200px) {\n  .has-col-7-xl {\n    grid-template-columns: repeat(7, 1fr) !important;\n  }\n}\n\n.has-col-7-xxl > * {\n  grid-column: span 7;\n}\n@media screen and (min-width: 992px) {\n  .has-col-7-xxl > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 1440px) {\n  .has-col-7-xxl {\n    grid-template-columns: repeat(7, 1fr) !important;\n  }\n}\n\n.has-col-8 {\n  grid-template-columns: repeat(8, 1fr);\n}\n.has-col-8 > * {\n  grid-column: span 8;\n}\n@media screen and (min-width: 992px) {\n  .has-col-8 > * {\n    grid-column: span 1;\n  }\n}\n\n.has-col-8-xs > * {\n  grid-column: span 8;\n}\n@media screen and (min-width: 992px) {\n  .has-col-8-xs > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 575.5px) {\n  .has-col-8-xs {\n    grid-template-columns: repeat(8, 1fr) !important;\n  }\n}\n\n.has-col-8-sm > * {\n  grid-column: span 8;\n}\n@media screen and (min-width: 992px) {\n  .has-col-8-sm > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 576px) {\n  .has-col-8-sm {\n    grid-template-columns: repeat(8, 1fr) !important;\n  }\n}\n\n.has-col-8-md > * {\n  grid-column: span 8;\n}\n@media screen and (min-width: 992px) {\n  .has-col-8-md > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 768px) {\n  .has-col-8-md {\n    grid-template-columns: repeat(8, 1fr) !important;\n  }\n}\n\n.has-col-8-lg > * {\n  grid-column: span 8;\n}\n@media screen and (min-width: 992px) {\n  .has-col-8-lg > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 992px) {\n  .has-col-8-lg {\n    grid-template-columns: repeat(8, 1fr) !important;\n  }\n}\n\n.has-col-8-xl > * {\n  grid-column: span 8;\n}\n@media screen and (min-width: 992px) {\n  .has-col-8-xl > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 1200px) {\n  .has-col-8-xl {\n    grid-template-columns: repeat(8, 1fr) !important;\n  }\n}\n\n.has-col-8-xxl > * {\n  grid-column: span 8;\n}\n@media screen and (min-width: 992px) {\n  .has-col-8-xxl > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 1440px) {\n  .has-col-8-xxl {\n    grid-template-columns: repeat(8, 1fr) !important;\n  }\n}\n\n.has-col-9 {\n  grid-template-columns: repeat(9, 1fr);\n}\n.has-col-9 > * {\n  grid-column: span 9;\n}\n@media screen and (min-width: 992px) {\n  .has-col-9 > * {\n    grid-column: span 1;\n  }\n}\n\n.has-col-9-xs > * {\n  grid-column: span 9;\n}\n@media screen and (min-width: 992px) {\n  .has-col-9-xs > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 575.5px) {\n  .has-col-9-xs {\n    grid-template-columns: repeat(9, 1fr) !important;\n  }\n}\n\n.has-col-9-sm > * {\n  grid-column: span 9;\n}\n@media screen and (min-width: 992px) {\n  .has-col-9-sm > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 576px) {\n  .has-col-9-sm {\n    grid-template-columns: repeat(9, 1fr) !important;\n  }\n}\n\n.has-col-9-md > * {\n  grid-column: span 9;\n}\n@media screen and (min-width: 992px) {\n  .has-col-9-md > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 768px) {\n  .has-col-9-md {\n    grid-template-columns: repeat(9, 1fr) !important;\n  }\n}\n\n.has-col-9-lg > * {\n  grid-column: span 9;\n}\n@media screen and (min-width: 992px) {\n  .has-col-9-lg > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 992px) {\n  .has-col-9-lg {\n    grid-template-columns: repeat(9, 1fr) !important;\n  }\n}\n\n.has-col-9-xl > * {\n  grid-column: span 9;\n}\n@media screen and (min-width: 992px) {\n  .has-col-9-xl > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 1200px) {\n  .has-col-9-xl {\n    grid-template-columns: repeat(9, 1fr) !important;\n  }\n}\n\n.has-col-9-xxl > * {\n  grid-column: span 9;\n}\n@media screen and (min-width: 992px) {\n  .has-col-9-xxl > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 1440px) {\n  .has-col-9-xxl {\n    grid-template-columns: repeat(9, 1fr) !important;\n  }\n}\n\n.has-col-10 {\n  grid-template-columns: repeat(10, 1fr);\n}\n.has-col-10 > * {\n  grid-column: span 10;\n}\n@media screen and (min-width: 992px) {\n  .has-col-10 > * {\n    grid-column: span 1;\n  }\n}\n\n.has-col-10-xs > * {\n  grid-column: span 10;\n}\n@media screen and (min-width: 992px) {\n  .has-col-10-xs > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 575.5px) {\n  .has-col-10-xs {\n    grid-template-columns: repeat(10, 1fr) !important;\n  }\n}\n\n.has-col-10-sm > * {\n  grid-column: span 10;\n}\n@media screen and (min-width: 992px) {\n  .has-col-10-sm > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 576px) {\n  .has-col-10-sm {\n    grid-template-columns: repeat(10, 1fr) !important;\n  }\n}\n\n.has-col-10-md > * {\n  grid-column: span 10;\n}\n@media screen and (min-width: 992px) {\n  .has-col-10-md > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 768px) {\n  .has-col-10-md {\n    grid-template-columns: repeat(10, 1fr) !important;\n  }\n}\n\n.has-col-10-lg > * {\n  grid-column: span 10;\n}\n@media screen and (min-width: 992px) {\n  .has-col-10-lg > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 992px) {\n  .has-col-10-lg {\n    grid-template-columns: repeat(10, 1fr) !important;\n  }\n}\n\n.has-col-10-xl > * {\n  grid-column: span 10;\n}\n@media screen and (min-width: 992px) {\n  .has-col-10-xl > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 1200px) {\n  .has-col-10-xl {\n    grid-template-columns: repeat(10, 1fr) !important;\n  }\n}\n\n.has-col-10-xxl > * {\n  grid-column: span 10;\n}\n@media screen and (min-width: 992px) {\n  .has-col-10-xxl > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 1440px) {\n  .has-col-10-xxl {\n    grid-template-columns: repeat(10, 1fr) !important;\n  }\n}\n\n.has-col-11 {\n  grid-template-columns: repeat(11, 1fr);\n}\n.has-col-11 > * {\n  grid-column: span 11;\n}\n@media screen and (min-width: 992px) {\n  .has-col-11 > * {\n    grid-column: span 1;\n  }\n}\n\n.has-col-11-xs > * {\n  grid-column: span 11;\n}\n@media screen and (min-width: 992px) {\n  .has-col-11-xs > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 575.5px) {\n  .has-col-11-xs {\n    grid-template-columns: repeat(11, 1fr) !important;\n  }\n}\n\n.has-col-11-sm > * {\n  grid-column: span 11;\n}\n@media screen and (min-width: 992px) {\n  .has-col-11-sm > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 576px) {\n  .has-col-11-sm {\n    grid-template-columns: repeat(11, 1fr) !important;\n  }\n}\n\n.has-col-11-md > * {\n  grid-column: span 11;\n}\n@media screen and (min-width: 992px) {\n  .has-col-11-md > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 768px) {\n  .has-col-11-md {\n    grid-template-columns: repeat(11, 1fr) !important;\n  }\n}\n\n.has-col-11-lg > * {\n  grid-column: span 11;\n}\n@media screen and (min-width: 992px) {\n  .has-col-11-lg > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 992px) {\n  .has-col-11-lg {\n    grid-template-columns: repeat(11, 1fr) !important;\n  }\n}\n\n.has-col-11-xl > * {\n  grid-column: span 11;\n}\n@media screen and (min-width: 992px) {\n  .has-col-11-xl > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 1200px) {\n  .has-col-11-xl {\n    grid-template-columns: repeat(11, 1fr) !important;\n  }\n}\n\n.has-col-11-xxl > * {\n  grid-column: span 11;\n}\n@media screen and (min-width: 992px) {\n  .has-col-11-xxl > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 1440px) {\n  .has-col-11-xxl {\n    grid-template-columns: repeat(11, 1fr) !important;\n  }\n}\n\n.has-col-12 {\n  grid-template-columns: repeat(12, 1fr);\n}\n.has-col-12 > * {\n  grid-column: span 12;\n}\n@media screen and (min-width: 992px) {\n  .has-col-12 > * {\n    grid-column: span 1;\n  }\n}\n\n.has-col-12-xs > * {\n  grid-column: span 12;\n}\n@media screen and (min-width: 992px) {\n  .has-col-12-xs > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 575.5px) {\n  .has-col-12-xs {\n    grid-template-columns: repeat(12, 1fr) !important;\n  }\n}\n\n.has-col-12-sm > * {\n  grid-column: span 12;\n}\n@media screen and (min-width: 992px) {\n  .has-col-12-sm > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 576px) {\n  .has-col-12-sm {\n    grid-template-columns: repeat(12, 1fr) !important;\n  }\n}\n\n.has-col-12-md > * {\n  grid-column: span 12;\n}\n@media screen and (min-width: 992px) {\n  .has-col-12-md > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 768px) {\n  .has-col-12-md {\n    grid-template-columns: repeat(12, 1fr) !important;\n  }\n}\n\n.has-col-12-lg > * {\n  grid-column: span 12;\n}\n@media screen and (min-width: 992px) {\n  .has-col-12-lg > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 992px) {\n  .has-col-12-lg {\n    grid-template-columns: repeat(12, 1fr) !important;\n  }\n}\n\n.has-col-12-xl > * {\n  grid-column: span 12;\n}\n@media screen and (min-width: 992px) {\n  .has-col-12-xl > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 1200px) {\n  .has-col-12-xl {\n    grid-template-columns: repeat(12, 1fr) !important;\n  }\n}\n\n.has-col-12-xxl > * {\n  grid-column: span 12;\n}\n@media screen and (min-width: 992px) {\n  .has-col-12-xxl > * {\n    grid-column: span 1;\n  }\n}\n@media screen and (min-width: 1440px) {\n  .has-col-12-xxl {\n    grid-template-columns: repeat(12, 1fr) !important;\n  }\n}\n\n.is-row-1 {\n  grid-row: span 1;\n}\n\n@media screen and (min-width: 575.5px) {\n  .is-row-1-xs {\n    grid-row: span 1 !important;\n  }\n}\n.is-row-2 {\n  grid-row: span 2;\n}\n\n@media screen and (min-width: 575.5px) {\n  .is-row-2-xs {\n    grid-row: span 2 !important;\n  }\n}\n.is-row-3 {\n  grid-row: span 3;\n}\n\n@media screen and (min-width: 575.5px) {\n  .is-row-3-xs {\n    grid-row: span 3 !important;\n  }\n}\n.is-row-4 {\n  grid-row: span 4;\n}\n\n@media screen and (min-width: 575.5px) {\n  .is-row-4-xs {\n    grid-row: span 4 !important;\n  }\n}\n.is-row-5 {\n  grid-row: span 5;\n}\n\n@media screen and (min-width: 575.5px) {\n  .is-row-5-xs {\n    grid-row: span 5 !important;\n  }\n}\n.is-row-6 {\n  grid-row: span 6;\n}\n\n@media screen and (min-width: 575.5px) {\n  .is-row-6-xs {\n    grid-row: span 6 !important;\n  }\n}\n.is-row-7 {\n  grid-row: span 7;\n}\n\n@media screen and (min-width: 575.5px) {\n  .is-row-7-xs {\n    grid-row: span 7 !important;\n  }\n}\n.is-row-8 {\n  grid-row: span 8;\n}\n\n@media screen and (min-width: 575.5px) {\n  .is-row-8-xs {\n    grid-row: span 8 !important;\n  }\n}\n.is-row-9 {\n  grid-row: span 9;\n}\n\n@media screen and (min-width: 575.5px) {\n  .is-row-9-xs {\n    grid-row: span 9 !important;\n  }\n}\n.is-row-10 {\n  grid-row: span 10;\n}\n\n@media screen and (min-width: 575.5px) {\n  .is-row-10-xs {\n    grid-row: span 10 !important;\n  }\n}\n.is-row-11 {\n  grid-row: span 11;\n}\n\n@media screen and (min-width: 575.5px) {\n  .is-row-11-xs {\n    grid-row: span 11 !important;\n  }\n}\n.is-row-12 {\n  grid-row: span 12;\n}\n\n@media screen and (min-width: 575.5px) {\n  .is-row-12-xs {\n    grid-row: span 12 !important;\n  }\n}\n.is-row-1 {\n  grid-row: span 1;\n}\n\n@media screen and (min-width: 576px) {\n  .is-row-1-sm {\n    grid-row: span 1 !important;\n  }\n}\n.is-row-2 {\n  grid-row: span 2;\n}\n\n@media screen and (min-width: 576px) {\n  .is-row-2-sm {\n    grid-row: span 2 !important;\n  }\n}\n.is-row-3 {\n  grid-row: span 3;\n}\n\n@media screen and (min-width: 576px) {\n  .is-row-3-sm {\n    grid-row: span 3 !important;\n  }\n}\n.is-row-4 {\n  grid-row: span 4;\n}\n\n@media screen and (min-width: 576px) {\n  .is-row-4-sm {\n    grid-row: span 4 !important;\n  }\n}\n.is-row-5 {\n  grid-row: span 5;\n}\n\n@media screen and (min-width: 576px) {\n  .is-row-5-sm {\n    grid-row: span 5 !important;\n  }\n}\n.is-row-6 {\n  grid-row: span 6;\n}\n\n@media screen and (min-width: 576px) {\n  .is-row-6-sm {\n    grid-row: span 6 !important;\n  }\n}\n.is-row-7 {\n  grid-row: span 7;\n}\n\n@media screen and (min-width: 576px) {\n  .is-row-7-sm {\n    grid-row: span 7 !important;\n  }\n}\n.is-row-8 {\n  grid-row: span 8;\n}\n\n@media screen and (min-width: 576px) {\n  .is-row-8-sm {\n    grid-row: span 8 !important;\n  }\n}\n.is-row-9 {\n  grid-row: span 9;\n}\n\n@media screen and (min-width: 576px) {\n  .is-row-9-sm {\n    grid-row: span 9 !important;\n  }\n}\n.is-row-10 {\n  grid-row: span 10;\n}\n\n@media screen and (min-width: 576px) {\n  .is-row-10-sm {\n    grid-row: span 10 !important;\n  }\n}\n.is-row-11 {\n  grid-row: span 11;\n}\n\n@media screen and (min-width: 576px) {\n  .is-row-11-sm {\n    grid-row: span 11 !important;\n  }\n}\n.is-row-12 {\n  grid-row: span 12;\n}\n\n@media screen and (min-width: 576px) {\n  .is-row-12-sm {\n    grid-row: span 12 !important;\n  }\n}\n.is-row-1 {\n  grid-row: span 1;\n}\n\n@media screen and (min-width: 768px) {\n  .is-row-1-md {\n    grid-row: span 1 !important;\n  }\n}\n.is-row-2 {\n  grid-row: span 2;\n}\n\n@media screen and (min-width: 768px) {\n  .is-row-2-md {\n    grid-row: span 2 !important;\n  }\n}\n.is-row-3 {\n  grid-row: span 3;\n}\n\n@media screen and (min-width: 768px) {\n  .is-row-3-md {\n    grid-row: span 3 !important;\n  }\n}\n.is-row-4 {\n  grid-row: span 4;\n}\n\n@media screen and (min-width: 768px) {\n  .is-row-4-md {\n    grid-row: span 4 !important;\n  }\n}\n.is-row-5 {\n  grid-row: span 5;\n}\n\n@media screen and (min-width: 768px) {\n  .is-row-5-md {\n    grid-row: span 5 !important;\n  }\n}\n.is-row-6 {\n  grid-row: span 6;\n}\n\n@media screen and (min-width: 768px) {\n  .is-row-6-md {\n    grid-row: span 6 !important;\n  }\n}\n.is-row-7 {\n  grid-row: span 7;\n}\n\n@media screen and (min-width: 768px) {\n  .is-row-7-md {\n    grid-row: span 7 !important;\n  }\n}\n.is-row-8 {\n  grid-row: span 8;\n}\n\n@media screen and (min-width: 768px) {\n  .is-row-8-md {\n    grid-row: span 8 !important;\n  }\n}\n.is-row-9 {\n  grid-row: span 9;\n}\n\n@media screen and (min-width: 768px) {\n  .is-row-9-md {\n    grid-row: span 9 !important;\n  }\n}\n.is-row-10 {\n  grid-row: span 10;\n}\n\n@media screen and (min-width: 768px) {\n  .is-row-10-md {\n    grid-row: span 10 !important;\n  }\n}\n.is-row-11 {\n  grid-row: span 11;\n}\n\n@media screen and (min-width: 768px) {\n  .is-row-11-md {\n    grid-row: span 11 !important;\n  }\n}\n.is-row-12 {\n  grid-row: span 12;\n}\n\n@media screen and (min-width: 768px) {\n  .is-row-12-md {\n    grid-row: span 12 !important;\n  }\n}\n.is-row-1 {\n  grid-row: span 1;\n}\n\n@media screen and (min-width: 992px) {\n  .is-row-1-lg {\n    grid-row: span 1 !important;\n  }\n}\n.is-row-2 {\n  grid-row: span 2;\n}\n\n@media screen and (min-width: 992px) {\n  .is-row-2-lg {\n    grid-row: span 2 !important;\n  }\n}\n.is-row-3 {\n  grid-row: span 3;\n}\n\n@media screen and (min-width: 992px) {\n  .is-row-3-lg {\n    grid-row: span 3 !important;\n  }\n}\n.is-row-4 {\n  grid-row: span 4;\n}\n\n@media screen and (min-width: 992px) {\n  .is-row-4-lg {\n    grid-row: span 4 !important;\n  }\n}\n.is-row-5 {\n  grid-row: span 5;\n}\n\n@media screen and (min-width: 992px) {\n  .is-row-5-lg {\n    grid-row: span 5 !important;\n  }\n}\n.is-row-6 {\n  grid-row: span 6;\n}\n\n@media screen and (min-width: 992px) {\n  .is-row-6-lg {\n    grid-row: span 6 !important;\n  }\n}\n.is-row-7 {\n  grid-row: span 7;\n}\n\n@media screen and (min-width: 992px) {\n  .is-row-7-lg {\n    grid-row: span 7 !important;\n  }\n}\n.is-row-8 {\n  grid-row: span 8;\n}\n\n@media screen and (min-width: 992px) {\n  .is-row-8-lg {\n    grid-row: span 8 !important;\n  }\n}\n.is-row-9 {\n  grid-row: span 9;\n}\n\n@media screen and (min-width: 992px) {\n  .is-row-9-lg {\n    grid-row: span 9 !important;\n  }\n}\n.is-row-10 {\n  grid-row: span 10;\n}\n\n@media screen and (min-width: 992px) {\n  .is-row-10-lg {\n    grid-row: span 10 !important;\n  }\n}\n.is-row-11 {\n  grid-row: span 11;\n}\n\n@media screen and (min-width: 992px) {\n  .is-row-11-lg {\n    grid-row: span 11 !important;\n  }\n}\n.is-row-12 {\n  grid-row: span 12;\n}\n\n@media screen and (min-width: 992px) {\n  .is-row-12-lg {\n    grid-row: span 12 !important;\n  }\n}\n.is-row-1 {\n  grid-row: span 1;\n}\n\n@media screen and (min-width: 1200px) {\n  .is-row-1-xl {\n    grid-row: span 1 !important;\n  }\n}\n.is-row-2 {\n  grid-row: span 2;\n}\n\n@media screen and (min-width: 1200px) {\n  .is-row-2-xl {\n    grid-row: span 2 !important;\n  }\n}\n.is-row-3 {\n  grid-row: span 3;\n}\n\n@media screen and (min-width: 1200px) {\n  .is-row-3-xl {\n    grid-row: span 3 !important;\n  }\n}\n.is-row-4 {\n  grid-row: span 4;\n}\n\n@media screen and (min-width: 1200px) {\n  .is-row-4-xl {\n    grid-row: span 4 !important;\n  }\n}\n.is-row-5 {\n  grid-row: span 5;\n}\n\n@media screen and (min-width: 1200px) {\n  .is-row-5-xl {\n    grid-row: span 5 !important;\n  }\n}\n.is-row-6 {\n  grid-row: span 6;\n}\n\n@media screen and (min-width: 1200px) {\n  .is-row-6-xl {\n    grid-row: span 6 !important;\n  }\n}\n.is-row-7 {\n  grid-row: span 7;\n}\n\n@media screen and (min-width: 1200px) {\n  .is-row-7-xl {\n    grid-row: span 7 !important;\n  }\n}\n.is-row-8 {\n  grid-row: span 8;\n}\n\n@media screen and (min-width: 1200px) {\n  .is-row-8-xl {\n    grid-row: span 8 !important;\n  }\n}\n.is-row-9 {\n  grid-row: span 9;\n}\n\n@media screen and (min-width: 1200px) {\n  .is-row-9-xl {\n    grid-row: span 9 !important;\n  }\n}\n.is-row-10 {\n  grid-row: span 10;\n}\n\n@media screen and (min-width: 1200px) {\n  .is-row-10-xl {\n    grid-row: span 10 !important;\n  }\n}\n.is-row-11 {\n  grid-row: span 11;\n}\n\n@media screen and (min-width: 1200px) {\n  .is-row-11-xl {\n    grid-row: span 11 !important;\n  }\n}\n.is-row-12 {\n  grid-row: span 12;\n}\n\n@media screen and (min-width: 1200px) {\n  .is-row-12-xl {\n    grid-row: span 12 !important;\n  }\n}\n.is-row-1 {\n  grid-row: span 1;\n}\n\n@media screen and (min-width: 1440px) {\n  .is-row-1-xxl {\n    grid-row: span 1 !important;\n  }\n}\n.is-row-2 {\n  grid-row: span 2;\n}\n\n@media screen and (min-width: 1440px) {\n  .is-row-2-xxl {\n    grid-row: span 2 !important;\n  }\n}\n.is-row-3 {\n  grid-row: span 3;\n}\n\n@media screen and (min-width: 1440px) {\n  .is-row-3-xxl {\n    grid-row: span 3 !important;\n  }\n}\n.is-row-4 {\n  grid-row: span 4;\n}\n\n@media screen and (min-width: 1440px) {\n  .is-row-4-xxl {\n    grid-row: span 4 !important;\n  }\n}\n.is-row-5 {\n  grid-row: span 5;\n}\n\n@media screen and (min-width: 1440px) {\n  .is-row-5-xxl {\n    grid-row: span 5 !important;\n  }\n}\n.is-row-6 {\n  grid-row: span 6;\n}\n\n@media screen and (min-width: 1440px) {\n  .is-row-6-xxl {\n    grid-row: span 6 !important;\n  }\n}\n.is-row-7 {\n  grid-row: span 7;\n}\n\n@media screen and (min-width: 1440px) {\n  .is-row-7-xxl {\n    grid-row: span 7 !important;\n  }\n}\n.is-row-8 {\n  grid-row: span 8;\n}\n\n@media screen and (min-width: 1440px) {\n  .is-row-8-xxl {\n    grid-row: span 8 !important;\n  }\n}\n.is-row-9 {\n  grid-row: span 9;\n}\n\n@media screen and (min-width: 1440px) {\n  .is-row-9-xxl {\n    grid-row: span 9 !important;\n  }\n}\n.is-row-10 {\n  grid-row: span 10;\n}\n\n@media screen and (min-width: 1440px) {\n  .is-row-10-xxl {\n    grid-row: span 10 !important;\n  }\n}\n.is-row-11 {\n  grid-row: span 11;\n}\n\n@media screen and (min-width: 1440px) {\n  .is-row-11-xxl {\n    grid-row: span 11 !important;\n  }\n}\n.is-row-12 {\n  grid-row: span 12;\n}\n\n@media screen and (min-width: 1440px) {\n  .is-row-12-xxl {\n    grid-row: span 12 !important;\n  }\n}\n.is-col-1 {\n  grid-column: span 1;\n}\n\n@media screen and (min-width: 575.5px) {\n  .is-col-1-xs {\n    grid-column: span 1 !important;\n  }\n}\n.is-col-2 {\n  grid-column: span 2;\n}\n\n@media screen and (min-width: 575.5px) {\n  .is-col-2-xs {\n    grid-column: span 2 !important;\n  }\n}\n.is-col-3 {\n  grid-column: span 3;\n}\n\n@media screen and (min-width: 575.5px) {\n  .is-col-3-xs {\n    grid-column: span 3 !important;\n  }\n}\n.is-col-4 {\n  grid-column: span 4;\n}\n\n@media screen and (min-width: 575.5px) {\n  .is-col-4-xs {\n    grid-column: span 4 !important;\n  }\n}\n.is-col-5 {\n  grid-column: span 5;\n}\n\n@media screen and (min-width: 575.5px) {\n  .is-col-5-xs {\n    grid-column: span 5 !important;\n  }\n}\n.is-col-6 {\n  grid-column: span 6;\n}\n\n@media screen and (min-width: 575.5px) {\n  .is-col-6-xs {\n    grid-column: span 6 !important;\n  }\n}\n.is-col-7 {\n  grid-column: span 7;\n}\n\n@media screen and (min-width: 575.5px) {\n  .is-col-7-xs {\n    grid-column: span 7 !important;\n  }\n}\n.is-col-8 {\n  grid-column: span 8;\n}\n\n@media screen and (min-width: 575.5px) {\n  .is-col-8-xs {\n    grid-column: span 8 !important;\n  }\n}\n.is-col-9 {\n  grid-column: span 9;\n}\n\n@media screen and (min-width: 575.5px) {\n  .is-col-9-xs {\n    grid-column: span 9 !important;\n  }\n}\n.is-col-10 {\n  grid-column: span 10;\n}\n\n@media screen and (min-width: 575.5px) {\n  .is-col-10-xs {\n    grid-column: span 10 !important;\n  }\n}\n.is-col-11 {\n  grid-column: span 11;\n}\n\n@media screen and (min-width: 575.5px) {\n  .is-col-11-xs {\n    grid-column: span 11 !important;\n  }\n}\n.is-col-12 {\n  grid-column: span 12;\n}\n\n@media screen and (min-width: 575.5px) {\n  .is-col-12-xs {\n    grid-column: span 12 !important;\n  }\n}\n.is-col-1 {\n  grid-column: span 1;\n}\n\n@media screen and (min-width: 576px) {\n  .is-col-1-sm {\n    grid-column: span 1 !important;\n  }\n}\n.is-col-2 {\n  grid-column: span 2;\n}\n\n@media screen and (min-width: 576px) {\n  .is-col-2-sm {\n    grid-column: span 2 !important;\n  }\n}\n.is-col-3 {\n  grid-column: span 3;\n}\n\n@media screen and (min-width: 576px) {\n  .is-col-3-sm {\n    grid-column: span 3 !important;\n  }\n}\n.is-col-4 {\n  grid-column: span 4;\n}\n\n@media screen and (min-width: 576px) {\n  .is-col-4-sm {\n    grid-column: span 4 !important;\n  }\n}\n.is-col-5 {\n  grid-column: span 5;\n}\n\n@media screen and (min-width: 576px) {\n  .is-col-5-sm {\n    grid-column: span 5 !important;\n  }\n}\n.is-col-6 {\n  grid-column: span 6;\n}\n\n@media screen and (min-width: 576px) {\n  .is-col-6-sm {\n    grid-column: span 6 !important;\n  }\n}\n.is-col-7 {\n  grid-column: span 7;\n}\n\n@media screen and (min-width: 576px) {\n  .is-col-7-sm {\n    grid-column: span 7 !important;\n  }\n}\n.is-col-8 {\n  grid-column: span 8;\n}\n\n@media screen and (min-width: 576px) {\n  .is-col-8-sm {\n    grid-column: span 8 !important;\n  }\n}\n.is-col-9 {\n  grid-column: span 9;\n}\n\n@media screen and (min-width: 576px) {\n  .is-col-9-sm {\n    grid-column: span 9 !important;\n  }\n}\n.is-col-10 {\n  grid-column: span 10;\n}\n\n@media screen and (min-width: 576px) {\n  .is-col-10-sm {\n    grid-column: span 10 !important;\n  }\n}\n.is-col-11 {\n  grid-column: span 11;\n}\n\n@media screen and (min-width: 576px) {\n  .is-col-11-sm {\n    grid-column: span 11 !important;\n  }\n}\n.is-col-12 {\n  grid-column: span 12;\n}\n\n@media screen and (min-width: 576px) {\n  .is-col-12-sm {\n    grid-column: span 12 !important;\n  }\n}\n.is-col-1 {\n  grid-column: span 1;\n}\n\n@media screen and (min-width: 768px) {\n  .is-col-1-md {\n    grid-column: span 1 !important;\n  }\n}\n.is-col-2 {\n  grid-column: span 2;\n}\n\n@media screen and (min-width: 768px) {\n  .is-col-2-md {\n    grid-column: span 2 !important;\n  }\n}\n.is-col-3 {\n  grid-column: span 3;\n}\n\n@media screen and (min-width: 768px) {\n  .is-col-3-md {\n    grid-column: span 3 !important;\n  }\n}\n.is-col-4 {\n  grid-column: span 4;\n}\n\n@media screen and (min-width: 768px) {\n  .is-col-4-md {\n    grid-column: span 4 !important;\n  }\n}\n.is-col-5 {\n  grid-column: span 5;\n}\n\n@media screen and (min-width: 768px) {\n  .is-col-5-md {\n    grid-column: span 5 !important;\n  }\n}\n.is-col-6 {\n  grid-column: span 6;\n}\n\n@media screen and (min-width: 768px) {\n  .is-col-6-md {\n    grid-column: span 6 !important;\n  }\n}\n.is-col-7 {\n  grid-column: span 7;\n}\n\n@media screen and (min-width: 768px) {\n  .is-col-7-md {\n    grid-column: span 7 !important;\n  }\n}\n.is-col-8 {\n  grid-column: span 8;\n}\n\n@media screen and (min-width: 768px) {\n  .is-col-8-md {\n    grid-column: span 8 !important;\n  }\n}\n.is-col-9 {\n  grid-column: span 9;\n}\n\n@media screen and (min-width: 768px) {\n  .is-col-9-md {\n    grid-column: span 9 !important;\n  }\n}\n.is-col-10 {\n  grid-column: span 10;\n}\n\n@media screen and (min-width: 768px) {\n  .is-col-10-md {\n    grid-column: span 10 !important;\n  }\n}\n.is-col-11 {\n  grid-column: span 11;\n}\n\n@media screen and (min-width: 768px) {\n  .is-col-11-md {\n    grid-column: span 11 !important;\n  }\n}\n.is-col-12 {\n  grid-column: span 12;\n}\n\n@media screen and (min-width: 768px) {\n  .is-col-12-md {\n    grid-column: span 12 !important;\n  }\n}\n.is-col-1 {\n  grid-column: span 1;\n}\n\n@media screen and (min-width: 992px) {\n  .is-col-1-lg {\n    grid-column: span 1 !important;\n  }\n}\n.is-col-2 {\n  grid-column: span 2;\n}\n\n@media screen and (min-width: 992px) {\n  .is-col-2-lg {\n    grid-column: span 2 !important;\n  }\n}\n.is-col-3 {\n  grid-column: span 3;\n}\n\n@media screen and (min-width: 992px) {\n  .is-col-3-lg {\n    grid-column: span 3 !important;\n  }\n}\n.is-col-4 {\n  grid-column: span 4;\n}\n\n@media screen and (min-width: 992px) {\n  .is-col-4-lg {\n    grid-column: span 4 !important;\n  }\n}\n.is-col-5 {\n  grid-column: span 5;\n}\n\n@media screen and (min-width: 992px) {\n  .is-col-5-lg {\n    grid-column: span 5 !important;\n  }\n}\n.is-col-6 {\n  grid-column: span 6;\n}\n\n@media screen and (min-width: 992px) {\n  .is-col-6-lg {\n    grid-column: span 6 !important;\n  }\n}\n.is-col-7 {\n  grid-column: span 7;\n}\n\n@media screen and (min-width: 992px) {\n  .is-col-7-lg {\n    grid-column: span 7 !important;\n  }\n}\n.is-col-8 {\n  grid-column: span 8;\n}\n\n@media screen and (min-width: 992px) {\n  .is-col-8-lg {\n    grid-column: span 8 !important;\n  }\n}\n.is-col-9 {\n  grid-column: span 9;\n}\n\n@media screen and (min-width: 992px) {\n  .is-col-9-lg {\n    grid-column: span 9 !important;\n  }\n}\n.is-col-10 {\n  grid-column: span 10;\n}\n\n@media screen and (min-width: 992px) {\n  .is-col-10-lg {\n    grid-column: span 10 !important;\n  }\n}\n.is-col-11 {\n  grid-column: span 11;\n}\n\n@media screen and (min-width: 992px) {\n  .is-col-11-lg {\n    grid-column: span 11 !important;\n  }\n}\n.is-col-12 {\n  grid-column: span 12;\n}\n\n@media screen and (min-width: 992px) {\n  .is-col-12-lg {\n    grid-column: span 12 !important;\n  }\n}\n.is-col-1 {\n  grid-column: span 1;\n}\n\n@media screen and (min-width: 1200px) {\n  .is-col-1-xl {\n    grid-column: span 1 !important;\n  }\n}\n.is-col-2 {\n  grid-column: span 2;\n}\n\n@media screen and (min-width: 1200px) {\n  .is-col-2-xl {\n    grid-column: span 2 !important;\n  }\n}\n.is-col-3 {\n  grid-column: span 3;\n}\n\n@media screen and (min-width: 1200px) {\n  .is-col-3-xl {\n    grid-column: span 3 !important;\n  }\n}\n.is-col-4 {\n  grid-column: span 4;\n}\n\n@media screen and (min-width: 1200px) {\n  .is-col-4-xl {\n    grid-column: span 4 !important;\n  }\n}\n.is-col-5 {\n  grid-column: span 5;\n}\n\n@media screen and (min-width: 1200px) {\n  .is-col-5-xl {\n    grid-column: span 5 !important;\n  }\n}\n.is-col-6 {\n  grid-column: span 6;\n}\n\n@media screen and (min-width: 1200px) {\n  .is-col-6-xl {\n    grid-column: span 6 !important;\n  }\n}\n.is-col-7 {\n  grid-column: span 7;\n}\n\n@media screen and (min-width: 1200px) {\n  .is-col-7-xl {\n    grid-column: span 7 !important;\n  }\n}\n.is-col-8 {\n  grid-column: span 8;\n}\n\n@media screen and (min-width: 1200px) {\n  .is-col-8-xl {\n    grid-column: span 8 !important;\n  }\n}\n.is-col-9 {\n  grid-column: span 9;\n}\n\n@media screen and (min-width: 1200px) {\n  .is-col-9-xl {\n    grid-column: span 9 !important;\n  }\n}\n.is-col-10 {\n  grid-column: span 10;\n}\n\n@media screen and (min-width: 1200px) {\n  .is-col-10-xl {\n    grid-column: span 10 !important;\n  }\n}\n.is-col-11 {\n  grid-column: span 11;\n}\n\n@media screen and (min-width: 1200px) {\n  .is-col-11-xl {\n    grid-column: span 11 !important;\n  }\n}\n.is-col-12 {\n  grid-column: span 12;\n}\n\n@media screen and (min-width: 1200px) {\n  .is-col-12-xl {\n    grid-column: span 12 !important;\n  }\n}\n.is-col-1 {\n  grid-column: span 1;\n}\n\n@media screen and (min-width: 1440px) {\n  .is-col-1-xxl {\n    grid-column: span 1 !important;\n  }\n}\n.is-col-2 {\n  grid-column: span 2;\n}\n\n@media screen and (min-width: 1440px) {\n  .is-col-2-xxl {\n    grid-column: span 2 !important;\n  }\n}\n.is-col-3 {\n  grid-column: span 3;\n}\n\n@media screen and (min-width: 1440px) {\n  .is-col-3-xxl {\n    grid-column: span 3 !important;\n  }\n}\n.is-col-4 {\n  grid-column: span 4;\n}\n\n@media screen and (min-width: 1440px) {\n  .is-col-4-xxl {\n    grid-column: span 4 !important;\n  }\n}\n.is-col-5 {\n  grid-column: span 5;\n}\n\n@media screen and (min-width: 1440px) {\n  .is-col-5-xxl {\n    grid-column: span 5 !important;\n  }\n}\n.is-col-6 {\n  grid-column: span 6;\n}\n\n@media screen and (min-width: 1440px) {\n  .is-col-6-xxl {\n    grid-column: span 6 !important;\n  }\n}\n.is-col-7 {\n  grid-column: span 7;\n}\n\n@media screen and (min-width: 1440px) {\n  .is-col-7-xxl {\n    grid-column: span 7 !important;\n  }\n}\n.is-col-8 {\n  grid-column: span 8;\n}\n\n@media screen and (min-width: 1440px) {\n  .is-col-8-xxl {\n    grid-column: span 8 !important;\n  }\n}\n.is-col-9 {\n  grid-column: span 9;\n}\n\n@media screen and (min-width: 1440px) {\n  .is-col-9-xxl {\n    grid-column: span 9 !important;\n  }\n}\n.is-col-10 {\n  grid-column: span 10;\n}\n\n@media screen and (min-width: 1440px) {\n  .is-col-10-xxl {\n    grid-column: span 10 !important;\n  }\n}\n.is-col-11 {\n  grid-column: span 11;\n}\n\n@media screen and (min-width: 1440px) {\n  .is-col-11-xxl {\n    grid-column: span 11 !important;\n  }\n}\n.is-col-12 {\n  grid-column: span 12;\n}\n\n@media screen and (min-width: 1440px) {\n  .is-col-12-xxl {\n    grid-column: span 12 !important;\n  }\n}\n/* Class Generation\n------------------------- */\n.has-row-gap {\n  grid-row-gap: var(--spacing);\n}\n\n.has-row-gap-md {\n  grid-row-gap: var(--spacing-md);\n}\n\n.has-row-gap-lg {\n  grid-row-gap: var(--spacing-lg);\n}\n\n.has-no-row-gap {\n  grid-row-gap: 0;\n}\n\n.has-col-gap {\n  grid-column-gap: var(--spacing);\n}\n\n.has-col-gap-md {\n  grid-column-gap: var(--spacing-md);\n}\n\n.has-col-gap-lg {\n  grid-column-gap: var(--spacing-lg);\n}\n\n.has-no-col-gap {\n  grid-column-gap: 0;\n}\n\n.is-ltr {\n  direction: ltr;\n}\n\n@media screen and (min-width: 575.5px) {\n  .is-ltr-xs {\n    direction: ltr;\n  }\n}\n\n.is-ltr {\n  direction: ltr;\n}\n\n@media screen and (min-width: 576px) {\n  .is-ltr-sm {\n    direction: ltr;\n  }\n}\n\n.is-ltr {\n  direction: ltr;\n}\n\n@media screen and (min-width: 768px) {\n  .is-ltr-md {\n    direction: ltr;\n  }\n}\n\n.is-ltr {\n  direction: ltr;\n}\n\n@media screen and (min-width: 992px) {\n  .is-ltr-lg {\n    direction: ltr;\n  }\n}\n\n.is-ltr {\n  direction: ltr;\n}\n\n@media screen and (min-width: 1200px) {\n  .is-ltr-xl {\n    direction: ltr;\n  }\n}\n\n.is-ltr {\n  direction: ltr;\n}\n\n@media screen and (min-width: 1440px) {\n  .is-ltr-xxl {\n    direction: ltr;\n  }\n}\n\n.is-rtl {\n  direction: rtl;\n}\n\n@media screen and (min-width: 575.5px) {\n  .is-rtl-xs {\n    direction: rtl;\n  }\n}\n\n.is-rtl {\n  direction: rtl;\n}\n\n@media screen and (min-width: 576px) {\n  .is-rtl-sm {\n    direction: rtl;\n  }\n}\n\n.is-rtl {\n  direction: rtl;\n}\n\n@media screen and (min-width: 768px) {\n  .is-rtl-md {\n    direction: rtl;\n  }\n}\n\n.is-rtl {\n  direction: rtl;\n}\n\n@media screen and (min-width: 992px) {\n  .is-rtl-lg {\n    direction: rtl;\n  }\n}\n\n.is-rtl {\n  direction: rtl;\n}\n\n@media screen and (min-width: 1200px) {\n  .is-rtl-xl {\n    direction: rtl;\n  }\n}\n\n.is-rtl {\n  direction: rtl;\n}\n\n@media screen and (min-width: 1440px) {\n  .is-rtl-xxl {\n    direction: rtl;\n  }\n}\n\n.is-placed-left {\n  place-self: left;\n}\n\n.is-placed-right {\n  place-self: right;\n}\n\n.is-placed-center {\n  place-self: center;\n}\n\n.is-placed-start {\n  place-self: start;\n}\n\n.is-placed-normal {\n  place-self: normal;\n}\n\n.is-order-1 {\n  order: 1;\n}\n\n@media screen and (min-width: 575.5px) {\n  .is-order-1-xs {\n    order: 1;\n  }\n}\n\n@media screen and (min-width: 576px) {\n  .is-order-1-sm {\n    order: 1;\n  }\n}\n\n@media screen and (min-width: 768px) {\n  .is-order-1-md {\n    order: 1;\n  }\n}\n\n@media screen and (min-width: 992px) {\n  .is-order-1-lg {\n    order: 1;\n  }\n}\n\n@media screen and (min-width: 1200px) {\n  .is-order-1-xl {\n    order: 1;\n  }\n}\n\n@media screen and (min-width: 1440px) {\n  .is-order-1-xxl {\n    order: 1;\n  }\n}\n\n.is-order-2 {\n  order: 2;\n}\n\n@media screen and (min-width: 575.5px) {\n  .is-order-2-xs {\n    order: 2;\n  }\n}\n\n@media screen and (min-width: 576px) {\n  .is-order-2-sm {\n    order: 2;\n  }\n}\n\n@media screen and (min-width: 768px) {\n  .is-order-2-md {\n    order: 2;\n  }\n}\n\n@media screen and (min-width: 992px) {\n  .is-order-2-lg {\n    order: 2;\n  }\n}\n\n@media screen and (min-width: 1200px) {\n  .is-order-2-xl {\n    order: 2;\n  }\n}\n\n@media screen and (min-width: 1440px) {\n  .is-order-2-xxl {\n    order: 2;\n  }\n}\n\n.is-order-3 {\n  order: 3;\n}\n\n@media screen and (min-width: 575.5px) {\n  .is-order-3-xs {\n    order: 3;\n  }\n}\n\n@media screen and (min-width: 576px) {\n  .is-order-3-sm {\n    order: 3;\n  }\n}\n\n@media screen and (min-width: 768px) {\n  .is-order-3-md {\n    order: 3;\n  }\n}\n\n@media screen and (min-width: 992px) {\n  .is-order-3-lg {\n    order: 3;\n  }\n}\n\n@media screen and (min-width: 1200px) {\n  .is-order-3-xl {\n    order: 3;\n  }\n}\n\n@media screen and (min-width: 1440px) {\n  .is-order-3-xxl {\n    order: 3;\n  }\n}\n\n.is-order-4 {\n  order: 4;\n}\n\n@media screen and (min-width: 575.5px) {\n  .is-order-4-xs {\n    order: 4;\n  }\n}\n\n@media screen and (min-width: 576px) {\n  .is-order-4-sm {\n    order: 4;\n  }\n}\n\n@media screen and (min-width: 768px) {\n  .is-order-4-md {\n    order: 4;\n  }\n}\n\n@media screen and (min-width: 992px) {\n  .is-order-4-lg {\n    order: 4;\n  }\n}\n\n@media screen and (min-width: 1200px) {\n  .is-order-4-xl {\n    order: 4;\n  }\n}\n\n@media screen and (min-width: 1440px) {\n  .is-order-4-xxl {\n    order: 4;\n  }\n}\n\n.is-order-5 {\n  order: 5;\n}\n\n@media screen and (min-width: 575.5px) {\n  .is-order-5-xs {\n    order: 5;\n  }\n}\n\n@media screen and (min-width: 576px) {\n  .is-order-5-sm {\n    order: 5;\n  }\n}\n\n@media screen and (min-width: 768px) {\n  .is-order-5-md {\n    order: 5;\n  }\n}\n\n@media screen and (min-width: 992px) {\n  .is-order-5-lg {\n    order: 5;\n  }\n}\n\n@media screen and (min-width: 1200px) {\n  .is-order-5-xl {\n    order: 5;\n  }\n}\n\n@media screen and (min-width: 1440px) {\n  .is-order-5-xxl {\n    order: 5;\n  }\n}\n\n.is-order-6 {\n  order: 6;\n}\n\n@media screen and (min-width: 575.5px) {\n  .is-order-6-xs {\n    order: 6;\n  }\n}\n\n@media screen and (min-width: 576px) {\n  .is-order-6-sm {\n    order: 6;\n  }\n}\n\n@media screen and (min-width: 768px) {\n  .is-order-6-md {\n    order: 6;\n  }\n}\n\n@media screen and (min-width: 992px) {\n  .is-order-6-lg {\n    order: 6;\n  }\n}\n\n@media screen and (min-width: 1200px) {\n  .is-order-6-xl {\n    order: 6;\n  }\n}\n\n@media screen and (min-width: 1440px) {\n  .is-order-6-xxl {\n    order: 6;\n  }\n}\n\n.is-order-7 {\n  order: 7;\n}\n\n@media screen and (min-width: 575.5px) {\n  .is-order-7-xs {\n    order: 7;\n  }\n}\n\n@media screen and (min-width: 576px) {\n  .is-order-7-sm {\n    order: 7;\n  }\n}\n\n@media screen and (min-width: 768px) {\n  .is-order-7-md {\n    order: 7;\n  }\n}\n\n@media screen and (min-width: 992px) {\n  .is-order-7-lg {\n    order: 7;\n  }\n}\n\n@media screen and (min-width: 1200px) {\n  .is-order-7-xl {\n    order: 7;\n  }\n}\n\n@media screen and (min-width: 1440px) {\n  .is-order-7-xxl {\n    order: 7;\n  }\n}\n\n.is-order-8 {\n  order: 8;\n}\n\n@media screen and (min-width: 575.5px) {\n  .is-order-8-xs {\n    order: 8;\n  }\n}\n\n@media screen and (min-width: 576px) {\n  .is-order-8-sm {\n    order: 8;\n  }\n}\n\n@media screen and (min-width: 768px) {\n  .is-order-8-md {\n    order: 8;\n  }\n}\n\n@media screen and (min-width: 992px) {\n  .is-order-8-lg {\n    order: 8;\n  }\n}\n\n@media screen and (min-width: 1200px) {\n  .is-order-8-xl {\n    order: 8;\n  }\n}\n\n@media screen and (min-width: 1440px) {\n  .is-order-8-xxl {\n    order: 8;\n  }\n}\n\n.is-order-9 {\n  order: 9;\n}\n\n@media screen and (min-width: 575.5px) {\n  .is-order-9-xs {\n    order: 9;\n  }\n}\n\n@media screen and (min-width: 576px) {\n  .is-order-9-sm {\n    order: 9;\n  }\n}\n\n@media screen and (min-width: 768px) {\n  .is-order-9-md {\n    order: 9;\n  }\n}\n\n@media screen and (min-width: 992px) {\n  .is-order-9-lg {\n    order: 9;\n  }\n}\n\n@media screen and (min-width: 1200px) {\n  .is-order-9-xl {\n    order: 9;\n  }\n}\n\n@media screen and (min-width: 1440px) {\n  .is-order-9-xxl {\n    order: 9;\n  }\n}\n\n.is-order-10 {\n  order: 10;\n}\n\n@media screen and (min-width: 575.5px) {\n  .is-order-10-xs {\n    order: 10;\n  }\n}\n\n@media screen and (min-width: 576px) {\n  .is-order-10-sm {\n    order: 10;\n  }\n}\n\n@media screen and (min-width: 768px) {\n  .is-order-10-md {\n    order: 10;\n  }\n}\n\n@media screen and (min-width: 992px) {\n  .is-order-10-lg {\n    order: 10;\n  }\n}\n\n@media screen and (min-width: 1200px) {\n  .is-order-10-xl {\n    order: 10;\n  }\n}\n\n@media screen and (min-width: 1440px) {\n  .is-order-10-xxl {\n    order: 10;\n  }\n}\n\n.is-order-11 {\n  order: 11;\n}\n\n@media screen and (min-width: 575.5px) {\n  .is-order-11-xs {\n    order: 11;\n  }\n}\n\n@media screen and (min-width: 576px) {\n  .is-order-11-sm {\n    order: 11;\n  }\n}\n\n@media screen and (min-width: 768px) {\n  .is-order-11-md {\n    order: 11;\n  }\n}\n\n@media screen and (min-width: 992px) {\n  .is-order-11-lg {\n    order: 11;\n  }\n}\n\n@media screen and (min-width: 1200px) {\n  .is-order-11-xl {\n    order: 11;\n  }\n}\n\n@media screen and (min-width: 1440px) {\n  .is-order-11-xxl {\n    order: 11;\n  }\n}\n\n.is-order-12 {\n  order: 12;\n}\n\n@media screen and (min-width: 575.5px) {\n  .is-order-12-xs {\n    order: 12;\n  }\n}\n\n@media screen and (min-width: 576px) {\n  .is-order-12-sm {\n    order: 12;\n  }\n}\n\n@media screen and (min-width: 768px) {\n  .is-order-12-md {\n    order: 12;\n  }\n}\n\n@media screen and (min-width: 992px) {\n  .is-order-12-lg {\n    order: 12;\n  }\n}\n\n@media screen and (min-width: 1200px) {\n  .is-order-12-xl {\n    order: 12;\n  }\n}\n\n@media screen and (min-width: 1440px) {\n  .is-order-12-xxl {\n    order: 12;\n  }\n}\n\n.is-order-1 {\n  order: 1;\n}\n\n@media screen and (min-width: 575.5px) {\n  .is-order-1-xs {\n    order: 1;\n  }\n}\n\n@media screen and (min-width: 576px) {\n  .is-order-1-sm {\n    order: 1;\n  }\n}\n\n@media screen and (min-width: 768px) {\n  .is-order-1-md {\n    order: 1;\n  }\n}\n\n@media screen and (min-width: 992px) {\n  .is-order-1-lg {\n    order: 1;\n  }\n}\n\n@media screen and (min-width: 1200px) {\n  .is-order-1-xl {\n    order: 1;\n  }\n}\n\n@media screen and (min-width: 1440px) {\n  .is-order-1-xxl {\n    order: 1;\n  }\n}\n\n.is-order-2 {\n  order: 2;\n}\n\n@media screen and (min-width: 575.5px) {\n  .is-order-2-xs {\n    order: 2;\n  }\n}\n\n@media screen and (min-width: 576px) {\n  .is-order-2-sm {\n    order: 2;\n  }\n}\n\n@media screen and (min-width: 768px) {\n  .is-order-2-md {\n    order: 2;\n  }\n}\n\n@media screen and (min-width: 992px) {\n  .is-order-2-lg {\n    order: 2;\n  }\n}\n\n@media screen and (min-width: 1200px) {\n  .is-order-2-xl {\n    order: 2;\n  }\n}\n\n@media screen and (min-width: 1440px) {\n  .is-order-2-xxl {\n    order: 2;\n  }\n}\n\n.is-order-3 {\n  order: 3;\n}\n\n@media screen and (min-width: 575.5px) {\n  .is-order-3-xs {\n    order: 3;\n  }\n}\n\n@media screen and (min-width: 576px) {\n  .is-order-3-sm {\n    order: 3;\n  }\n}\n\n@media screen and (min-width: 768px) {\n  .is-order-3-md {\n    order: 3;\n  }\n}\n\n@media screen and (min-width: 992px) {\n  .is-order-3-lg {\n    order: 3;\n  }\n}\n\n@media screen and (min-width: 1200px) {\n  .is-order-3-xl {\n    order: 3;\n  }\n}\n\n@media screen and (min-width: 1440px) {\n  .is-order-3-xxl {\n    order: 3;\n  }\n}\n\n.is-order-4 {\n  order: 4;\n}\n\n@media screen and (min-width: 575.5px) {\n  .is-order-4-xs {\n    order: 4;\n  }\n}\n\n@media screen and (min-width: 576px) {\n  .is-order-4-sm {\n    order: 4;\n  }\n}\n\n@media screen and (min-width: 768px) {\n  .is-order-4-md {\n    order: 4;\n  }\n}\n\n@media screen and (min-width: 992px) {\n  .is-order-4-lg {\n    order: 4;\n  }\n}\n\n@media screen and (min-width: 1200px) {\n  .is-order-4-xl {\n    order: 4;\n  }\n}\n\n@media screen and (min-width: 1440px) {\n  .is-order-4-xxl {\n    order: 4;\n  }\n}\n\n.is-order-5 {\n  order: 5;\n}\n\n@media screen and (min-width: 575.5px) {\n  .is-order-5-xs {\n    order: 5;\n  }\n}\n\n@media screen and (min-width: 576px) {\n  .is-order-5-sm {\n    order: 5;\n  }\n}\n\n@media screen and (min-width: 768px) {\n  .is-order-5-md {\n    order: 5;\n  }\n}\n\n@media screen and (min-width: 992px) {\n  .is-order-5-lg {\n    order: 5;\n  }\n}\n\n@media screen and (min-width: 1200px) {\n  .is-order-5-xl {\n    order: 5;\n  }\n}\n\n@media screen and (min-width: 1440px) {\n  .is-order-5-xxl {\n    order: 5;\n  }\n}\n\n.is-order-6 {\n  order: 6;\n}\n\n@media screen and (min-width: 575.5px) {\n  .is-order-6-xs {\n    order: 6;\n  }\n}\n\n@media screen and (min-width: 576px) {\n  .is-order-6-sm {\n    order: 6;\n  }\n}\n\n@media screen and (min-width: 768px) {\n  .is-order-6-md {\n    order: 6;\n  }\n}\n\n@media screen and (min-width: 992px) {\n  .is-order-6-lg {\n    order: 6;\n  }\n}\n\n@media screen and (min-width: 1200px) {\n  .is-order-6-xl {\n    order: 6;\n  }\n}\n\n@media screen and (min-width: 1440px) {\n  .is-order-6-xxl {\n    order: 6;\n  }\n}\n\n.is-order-7 {\n  order: 7;\n}\n\n@media screen and (min-width: 575.5px) {\n  .is-order-7-xs {\n    order: 7;\n  }\n}\n\n@media screen and (min-width: 576px) {\n  .is-order-7-sm {\n    order: 7;\n  }\n}\n\n@media screen and (min-width: 768px) {\n  .is-order-7-md {\n    order: 7;\n  }\n}\n\n@media screen and (min-width: 992px) {\n  .is-order-7-lg {\n    order: 7;\n  }\n}\n\n@media screen and (min-width: 1200px) {\n  .is-order-7-xl {\n    order: 7;\n  }\n}\n\n@media screen and (min-width: 1440px) {\n  .is-order-7-xxl {\n    order: 7;\n  }\n}\n\n.is-order-8 {\n  order: 8;\n}\n\n@media screen and (min-width: 575.5px) {\n  .is-order-8-xs {\n    order: 8;\n  }\n}\n\n@media screen and (min-width: 576px) {\n  .is-order-8-sm {\n    order: 8;\n  }\n}\n\n@media screen and (min-width: 768px) {\n  .is-order-8-md {\n    order: 8;\n  }\n}\n\n@media screen and (min-width: 992px) {\n  .is-order-8-lg {\n    order: 8;\n  }\n}\n\n@media screen and (min-width: 1200px) {\n  .is-order-8-xl {\n    order: 8;\n  }\n}\n\n@media screen and (min-width: 1440px) {\n  .is-order-8-xxl {\n    order: 8;\n  }\n}\n\n.is-order-9 {\n  order: 9;\n}\n\n@media screen and (min-width: 575.5px) {\n  .is-order-9-xs {\n    order: 9;\n  }\n}\n\n@media screen and (min-width: 576px) {\n  .is-order-9-sm {\n    order: 9;\n  }\n}\n\n@media screen and (min-width: 768px) {\n  .is-order-9-md {\n    order: 9;\n  }\n}\n\n@media screen and (min-width: 992px) {\n  .is-order-9-lg {\n    order: 9;\n  }\n}\n\n@media screen and (min-width: 1200px) {\n  .is-order-9-xl {\n    order: 9;\n  }\n}\n\n@media screen and (min-width: 1440px) {\n  .is-order-9-xxl {\n    order: 9;\n  }\n}\n\n.is-order-10 {\n  order: 10;\n}\n\n@media screen and (min-width: 575.5px) {\n  .is-order-10-xs {\n    order: 10;\n  }\n}\n\n@media screen and (min-width: 576px) {\n  .is-order-10-sm {\n    order: 10;\n  }\n}\n\n@media screen and (min-width: 768px) {\n  .is-order-10-md {\n    order: 10;\n  }\n}\n\n@media screen and (min-width: 992px) {\n  .is-order-10-lg {\n    order: 10;\n  }\n}\n\n@media screen and (min-width: 1200px) {\n  .is-order-10-xl {\n    order: 10;\n  }\n}\n\n@media screen and (min-width: 1440px) {\n  .is-order-10-xxl {\n    order: 10;\n  }\n}\n\n.is-order-11 {\n  order: 11;\n}\n\n@media screen and (min-width: 575.5px) {\n  .is-order-11-xs {\n    order: 11;\n  }\n}\n\n@media screen and (min-width: 576px) {\n  .is-order-11-sm {\n    order: 11;\n  }\n}\n\n@media screen and (min-width: 768px) {\n  .is-order-11-md {\n    order: 11;\n  }\n}\n\n@media screen and (min-width: 992px) {\n  .is-order-11-lg {\n    order: 11;\n  }\n}\n\n@media screen and (min-width: 1200px) {\n  .is-order-11-xl {\n    order: 11;\n  }\n}\n\n@media screen and (min-width: 1440px) {\n  .is-order-11-xxl {\n    order: 11;\n  }\n}\n\n.is-order-12 {\n  order: 12;\n}\n\n@media screen and (min-width: 575.5px) {\n  .is-order-12-xs {\n    order: 12;\n  }\n}\n\n@media screen and (min-width: 576px) {\n  .is-order-12-sm {\n    order: 12;\n  }\n}\n\n@media screen and (min-width: 768px) {\n  .is-order-12-md {\n    order: 12;\n  }\n}\n\n@media screen and (min-width: 992px) {\n  .is-order-12-lg {\n    order: 12;\n  }\n}\n\n@media screen and (min-width: 1200px) {\n  .is-order-12-xl {\n    order: 12;\n  }\n}\n\n@media screen and (min-width: 1440px) {\n  .is-order-12-xxl {\n    order: 12;\n  }\n}\n\n:root {\n  --col-gap-sm: 0.5rem;\n  --col-gap: 1rem;\n  --col-gap-md: 1.5rem;\n  --col-gap-lg: 2rem;\n  --col-gap-xl: 2.5rem;\n  --col-gap-xxl: 3rem;\n  --row-gap-sm: 0.5rem;\n  --row-gap: 1rem;\n  --row-gap-md: 1.5rem;\n  --row-gap-lg: 2rem;\n  --col-gap-xl: 2.5rem;\n  --col-gap-xxl: 3rem;\n  /* Misc */\n  --spacing-sm: 0.5rem;\n  --spacing-sml: 0.75rem;\n  --spacing: 1rem;\n  --spacing-md: 1.5rem;\n  --spacing-lg: 2rem;\n  --spacing-xl: 2.5rem;\n  --spacing-xxl: 3rem;\n}\n\n.has-col-gap-default {\n  grid-column-gap: var(--spacing-md);\n}\n@media only screen and (min-width: 1200px) {\n  .has-col-gap-default {\n    grid-column-gap: var(--spacing-lg);\n  }\n}\n@media only screen and (min-width: 1440px) {\n  .has-col-gap-default {\n    grid-column-gap: var(--spacing-xl);\n  }\n}\n\n.has-row-gap-default {\n  grid-row-gap: var(--spacing-md);\n}\n@media only screen and (min-width: 1200px) {\n  .has-row-gap-default {\n    grid-row-gap: var(--spacing-lg);\n  }\n}\n@media only screen and (min-width: 1440px) {\n  .has-row-gap-default {\n    grid-row-gap: var(--spacing-xl);\n  }\n}\n\n.has-col-gap-sm {\n  grid-column-gap: var(--spacing-sm);\n}\n\n.has-row-gap-sm {\n  grid-row-gap: var(--spacing-sm);\n}\n\n.has-col-gap-sml {\n  grid-column-gap: var(--spacing-sml);\n}\n\n.has-row-gap-sml {\n  grid-row-gap: var(--spacing-sml);\n}\n\n.has-col-gap-lg {\n  grid-column-gap: 0px;\n}\n@media only screen and (min-width: 768px) {\n  .has-col-gap-lg {\n    grid-column-gap: var(--spacing-lg);\n  }\n}\n\n.has-row-gap-lg {\n  grid-row-gap: var(--spacing-lg);\n}\n\n.has-col-gap-xl {\n  grid-column-gap: 0px;\n}\n@media only screen and (min-width: 768px) {\n  .has-col-gap-xl {\n    grid-column-gap: var(--spacing-xl);\n  }\n}\n\n.has-row-gap-xl {\n  grid-row-gap: var(--spacing-xl);\n}\n\n.has-col-gap-xxl {\n  grid-column-gap: 0px;\n}\n@media only screen and (min-width: 768px) {\n  .has-col-gap-xxl {\n    grid-column-gap: var(--spacing-xxl);\n  }\n}\n\n.has-row-gap-xxl {\n  grid-row-gap: var(--spacing-xxl);\n}\n\n.has-no-row {\n  grid-row-gap: 0;\n}\n\n.has-m-sm {\n  margin: var(--spacing-sm);\n}\n\n.has-m-top-sm {\n  margin-top: var(--spacing-sm);\n}\n\n.has-m-right-sm {\n  margin-right: var(--spacing-sm);\n}\n\n.has-m-bottom-sm {\n  margin-bottom: var(--spacing-sm);\n}\n\n.has-m-left-sm {\n  margin-left: var(--spacing-sm);\n}\n\n.has-m {\n  margin: var(--spacing);\n}\n\n.has-m-top {\n  margin-top: var(--spacing);\n}\n\n.has-m-right {\n  margin-right: var(--spacing);\n}\n\n.has-m-bottom {\n  margin-bottom: var(--spacing);\n}\n\n.has-m-left {\n  margin-left: var(--spacing);\n}\n\n.has-m-md {\n  margin: var(--spacing-md);\n}\n\n.has-m-top-md {\n  margin-top: var(--spacing-md);\n}\n\n.has-m-right-md {\n  margin-right: var(--spacing-md);\n}\n\n.has-m-bottom-md {\n  margin-bottom: var(--spacing-md);\n}\n\n.has-m-left-md {\n  margin-left: var(--spacing-md);\n}\n\n.has-m-lg {\n  margin: var(--spacing-lg);\n}\n\n.has-m-top-lg {\n  margin-top: var(--spacing-lg);\n}\n\n.has-m-right-lg {\n  margin-right: var(--spacing-lg);\n}\n\n.has-m-bottom-lg {\n  margin-bottom: var(--spacing-lg);\n}\n\n.has-m-left-lg {\n  margin-left: var(--spacing-lg);\n}\n\n.has-m-xl {\n  margin: var(--spacing-xl);\n}\n\n.has-m-top-xl {\n  margin-top: var(--spacing-xl);\n}\n\n.has-m-right-xl {\n  margin-right: var(--spacing-xl);\n}\n\n.has-m-bottom-xl {\n  margin-bottom: var(--spacing-xl);\n}\n\n.has-m-left-xl {\n  margin-left: var(--spacing-xl);\n}\n\n.has-m-xxl {\n  margin: var(--spacing-xxl);\n}\n\n.has-m-top-xxl {\n  margin-top: var(--spacing-xxl);\n}\n\n.has-m-right-xxl {\n  margin-right: var(--spacing-xxl);\n}\n\n.has-m-bottom-xxl {\n  margin-bottom: var(--spacing-xxl);\n}\n\n.has-m-left-xxl {\n  margin-left: var(--spacing-xxl);\n}\n\n.has-no-m {\n  margin: 0;\n}\n\n.has-no-top-m {\n  margin-top: 0;\n}\n\n.has-no-right-m {\n  margin-right: 0;\n}\n\n.has-no-bottom-m {\n  margin-bottom: 0;\n}\n\n.has-no-left-m {\n  margin-left: 0;\n}\n\n.has-p-sm {\n  padding: var(--spacing-sm);\n}\n\n.has-p-top-sm {\n  padding-top: var(--spacing-sm);\n}\n\n.has-p-right-sm {\n  padding-right: var(--spacing-sm);\n}\n\n.has-p-bottom-sm {\n  padding-bottom: var(--spacing-sm);\n}\n\n.has-p-left-sm {\n  padding-left: var(--spacing-sm);\n}\n\n.has-p {\n  padding: var(--spacing);\n}\n\n.has-p-top {\n  padding-top: var(--spacing);\n}\n\n.has-p-right {\n  padding-right: var(--spacing);\n}\n\n.has-p-bottom {\n  padding-bottom: var(--spacing);\n}\n\n.has-p-left {\n  padding-left: var(--spacing);\n}\n\n.has-p-md {\n  padding: var(--spacing-md);\n}\n\n.has-p-top-md {\n  padding-top: var(--spacing-md);\n}\n\n.has-p-right-md {\n  padding-right: var(--spacing-md);\n}\n\n.has-p-bottom-md {\n  padding-bottom: var(--spacing-md);\n}\n\n.has-p-left-md {\n  padding-left: var(--spacing-md);\n}\n\n.has-p-lg {\n  padding: var(--spacing-lg);\n}\n\n.has-p-top-lg {\n  padding-top: var(--spacing-lg);\n}\n\n.has-p-right-lg {\n  padding-right: var(--spacing-lg);\n}\n\n.has-p-bottom-lg {\n  padding-bottom: var(--spacing-lg);\n}\n\n.has-p-left-lg {\n  padding-left: var(--spacing-lg);\n}\n\n.has-p-xl {\n  padding: var(--spacing-xl);\n}\n\n.has-p-top-xl {\n  padding-top: var(--spacing-xl);\n}\n\n.has-p-right-xl {\n  padding-right: var(--spacing-xl);\n}\n\n.has-p-bottom-xl {\n  padding-bottom: var(--spacing-xl);\n}\n\n.has-p-left-xl {\n  padding-left: var(--spacing-xl);\n}\n\n.has-p-xxl {\n  padding: var(--spacing-lg);\n}\n@media screen and (min-width: 769px) {\n  .has-p-xxl {\n    padding: var(--spacing-xxl);\n  }\n}\n\n.has-p-top-xxl {\n  padding-top: var(--spacing-lg);\n}\n@media screen and (min-width: 769px) {\n  .has-p-top-xxl {\n    padding-top: var(--spacing-xxl);\n  }\n}\n\n.has-p-right-xxl {\n  padding-right: var(--spacing-lg);\n}\n@media screen and (min-width: 769px) {\n  .has-p-right-xxl {\n    padding-right: var(--spacing-xxl);\n  }\n}\n\n.has-p-bottom-xxl {\n  padding-bottom: var(--spacing-lg);\n}\n@media screen and (min-width: 769px) {\n  .has-p-bottom-xxl {\n    padding-bottom: var(--spacing-xxl);\n  }\n}\n\n.has-p-left-xxl {\n  padding-left: var(--spacing-lg);\n}\n@media screen and (min-width: 769px) {\n  .has-p-left-xxl {\n    padding-left: var(--spacing-xxl);\n  }\n}\n\n.has-no-p {\n  margin: 0;\n}\n\n.has-no-top-p {\n  padding-top: 0;\n}\n\n.has-no-right-p {\n  padding-right: 0;\n}\n\n.has-no-bottom-p {\n  padding-bottom: 0;\n}\n\n.has-no-left-p {\n  padding-left: 0;\n}\n\n.is-centered {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n\n.is-centered-horizontally {\n  display: flex;\n  justify-content: center;\n}\n\n.is-centered-vertically {\n  display: flex;\n  align-items: center;\n}\n\n.is-block {\n  display: block;\n}\n\n@media screen and (min-width: 575.5px) {\n  .is-block-xs {\n    display: block;\n  }\n}\n@media screen and (min-width: 576px) {\n  .is-block-sm {\n    display: block;\n  }\n}\n@media only screen and (min-width: 768px) {\n  .is-block-md {\n    display: block;\n  }\n}\n@media only screen and (min-width: 992px) {\n  .is-block-lg {\n    display: block;\n  }\n}\n@media only screen and (min-width: 1200px) {\n  .is-block-xl {\n    display: block;\n  }\n}\n@media only screen and (min-width: 1440px) {\n  .is-block-xxl {\n    display: block;\n  }\n}\n.is-inline-block {\n  display: inline-block;\n}\n\n@media screen and (min-width: 575.5px) {\n  .is-inline-block-xs {\n    display: inline-block;\n  }\n}\n@media screen and (min-width: 576px) {\n  .is-inline-block-sm {\n    display: inline-block;\n  }\n}\n@media only screen and (min-width: 768px) {\n  .is-inline-block-md {\n    display: inline-block;\n  }\n}\n@media only screen and (min-width: 992px) {\n  .is-inline-block-lg {\n    display: inline-block;\n  }\n}\n@media only screen and (min-width: 1200px) {\n  .is-inline-block-xl {\n    display: inline-block;\n  }\n}\n@media only screen and (min-width: 1440px) {\n  .is-inline-block-xxl {\n    display: inline-block;\n  }\n}\n.is-flex {\n  display: flex;\n}\n\n@media screen and (min-width: 575.5px) {\n  .is-flex-xs {\n    display: flex;\n  }\n}\n@media screen and (min-width: 576px) {\n  .is-flex-sm {\n    display: flex;\n  }\n}\n@media only screen and (min-width: 768px) {\n  .is-flex-md {\n    display: flex;\n  }\n}\n@media only screen and (min-width: 992px) {\n  .is-flex-lg {\n    display: flex;\n  }\n}\n@media only screen and (min-width: 1200px) {\n  .is-flex-xl {\n    display: flex;\n  }\n}\n@media only screen and (min-width: 1440px) {\n  .is-flex-xxl {\n    display: flex;\n  }\n}\n.is-inline-flex {\n  display: inline-flex;\n}\n\n@media screen and (min-width: 575.5px) {\n  .is-inline-flex-xs {\n    display: inline-flex;\n  }\n}\n@media screen and (min-width: 576px) {\n  .is-inline-flex-sm {\n    display: inline-flex;\n  }\n}\n@media only screen and (min-width: 768px) {\n  .is-inline-flex-md {\n    display: inline-flex;\n  }\n}\n@media only screen and (min-width: 992px) {\n  .is-inline-flex-lg {\n    display: inline-flex;\n  }\n}\n@media only screen and (min-width: 1200px) {\n  .is-inline-flex-xl {\n    display: inline-flex;\n  }\n}\n@media only screen and (min-width: 1440px) {\n  .is-inline-flex-xxl {\n    display: inline-flex;\n  }\n}\n.is-device {\n  display: none;\n}\n\n.is-screen {\n  display: block;\n}\n\n.is-medium {\n  display: block !important;\n}\n\n@media only screen and (min-device-width: 1px) and (-webkit-min-device-pixel-ratio: 2) {\n  .is-device {\n    display: block;\n  }\n  .is-screen {\n    display: none;\n  }\n}\n@media only screen and (min-width: 992px) {\n  .is-medium {\n    display: none !important;\n  }\n}\n.is-flexBasis-half {\n  flex-basis: 50%;\n}\n\n.is-table {\n  display: table !important;\n}\n\n.is-tableCell {\n  display: table-cell !important;\n}\n\n.is-widthFull {\n  width: 100% !important;\n}\n\n@media only screen and (min-width: 2600px) {\n  .is-grid .is-col-1-xxxl {\n    grid-column: span 1 !important;\n  }\n  .is-grid .is-col-2-xxxl {\n    grid-column: span 2 !important;\n  }\n  .is-grid .is-col-3-xxxl {\n    grid-column: span 3 !important;\n  }\n  .is-grid .is-col-4-xxxl {\n    grid-column: span 4 !important;\n  }\n  .is-grid .is-col-5-xxxl {\n    grid-column: span 6 !important;\n  }\n  .is-grid .is-col-7-xxxl {\n    grid-column: span 7 !important;\n  }\n  .is-grid .is-col-8-xxxl {\n    grid-column: span 8 !important;\n  }\n  .is-grid .is-col-9-xxxl {\n    grid-column: span 9 !important;\n  }\n  .is-grid .is-col-10-xxxl {\n    grid-column: span 10 !important;\n  }\n  .is-grid .is-col-11-xxxl {\n    grid-column: span 11 !important;\n  }\n  .is-grid .is-col-12-xxxl {\n    grid-column: span 12 !important;\n  }\n}\n.media-gutter {\n  grid-column-gap: 10px;\n  grid-row-gap: 10px;\n}\n\n.bio-grid {\n  grid-row-gap: var(--ptc-layout-spacing-04);\n}\n@media only screen and (min-width: 768px) {\n  .bio-grid {\n    grid-column-gap: var(--ptc-layout-spacing-04);\n    grid-row-gap: var(--ptc-layout-spacing-04);\n  }\n}\n\n@media (max-width: 480px) {\n  .column-gap-mobile {\n    grid-column-gap: 1rem;\n  }\n}\n\n.hr-1 {\n  background-color: var(--color-gray-01);\n}\n\n.hr-2 {\n  background-color: var(--color-gray-02);\n}\n\n.hr-3 {\n  background-color: var(--color-gray-03);\n}\n\n.hr-4 {\n  background-color: var(--color-gray-04);\n}\n\n.hr-5 {\n  background-color: var(--color-gray-05);\n}\n\n.hr-6 {\n  background-color: var(--color-gray-06);\n}\n\n/*\n* Element and layout spacing\n*/\n:root {\n  --ptc-element-spacing-01: 0.25rem; /* 4px */\n  --ptc-element-spacing-02: 0.5rem; /* 8px */\n  --ptc-element-spacing-03: 0.75rem; /* 12px */\n  --ptc-element-spacing-04: 1rem; /* 16px */\n  --ptc-element-spacing-05: 1.25rem; /* 20px */\n  --ptc-element-spacing-06: 1.5rem; /* 24px */\n  --ptc-element-spacing-07: 2rem; /* 32px */\n  --ptc-element-spacing-08: 2.5rem; /* 40px */\n  --ptc-element-spacing-09: 3rem; /* 48px */\n  --ptc-layout-spacing-01: 0.5rem; /* 8px */\n  --ptc-layout-spacing-02: 1rem; /* 16px */\n  --ptc-layout-spacing-03: 1.5rem; /* 24px */\n  --ptc-layout-spacing-04: 2rem; /* 32px */\n  --ptc-layout-spacing-05: 4rem; /* 64px */\n  --ptc-layout-spacing-06: 5rem; /* 80px */\n  --ptc-layout-spacing-07: 6rem; /* 96px */\n}\n\n/**\n* transaction and ease\n**/\n:root {\n  --ptc-transition-x-fast: 100ms;\n  --ptc-transition-faster: 150ms;\n  --ptc-transition-fast: 200ms;\n  --ptc-transition-medium: 250ms;\n  --ptc-transition-slow: 300ms;\n  --ptc-transition-slower: 500ms;\n  --ptc-transition-x-slow: 600ms;\n  --ptc-transition-xx-slow: 1000ms;\n  --ptc-ease-in: cubic-bezier(0.42, 0, 1, 1);\n  --ptc-ease-out: cubic-bezier(0, 0, 0.58, 1);\n  --ptc-ease-inout: cubic-bezier(0.42, 0, 0.58, 1);\n  --ptc-delay-5: 50ms;\n  --ptc-delay-10: 100ms;\n  --ptc-delay-20: 200ms;\n  --ptc-delay-25: 250ms;\n  --ptc-delay-30: 300ms;\n  --ptc-delay-40: 400ms;\n  --ptc-delay-50: 500ms;\n  --ptc-delay-60: 600ms;\n  --ptc-delay-70: 700ms;\n  --ptc-delay-80: 800ms;\n  --ptc-delay-90: 900ms;\n}\n@keyframes move-up-small {\n  from {\n    transform: translateY(0px);\n  }\n  to {\n    transform: translateY(calc(-1 * var(--ptc-element-spacing-01)));\n  }\n}\n@keyframes move-up-medium {\n  from {\n    transform: translateY(0px);\n  }\n  to {\n    transform: translateY(calc(-1 * var(--ptc-element-spacing-02)));\n  }\n}\n@keyframes move-up-large {\n  from {\n    transform: translateY(0px);\n  }\n  to {\n    transform: translateY(calc(-1 * var(--ptc-element-spacing-03)));\n  }\n}\n@keyframes fade-in {\n  0% {\n    opacity: 0;\n  }\n  100% {\n    opacity: 1;\n  }\n}\n@keyframes scale-up {\n  0% {\n    transform: scale(0.9);\n  }\n  100% {\n    transform: scale(1);\n  }\n}\n@keyframes scale-x {\n  0% {\n    transform: scaleX(0);\n  }\n  100% {\n    transform: scaleX(1);\n  }\n}\n:root .ptc-anim-delay-5 {\n  animation-delay: var(--ptc-delay-5);\n}\n:root .ptc-anim-delay-10 {\n  animation-delay: var(--ptc-delay-10);\n}\n:root .ptc-anim-delay-20 {\n  animation-delay: var(--ptc-delay-20);\n}\n:root .ptc-anim-delay-25 {\n  animation-delay: var(--ptc-delay-25);\n}\n:root .ptc-anim-delay-30 {\n  animation-delay: var(--ptc-delay-30);\n}\n:root .ptc-anim-delay-40 {\n  animation-delay: var(--ptc-delay-40);\n}\n:root .ptc-anim-delay-50 {\n  animation-delay: var(--ptc-delay-50);\n}\n:root .ptc-anim-delay-60 {\n  animation-delay: var(--ptc-delay-60);\n}\n:root .ptc-anim-delay-70 {\n  animation-delay: var(--ptc-delay-70);\n}\n:root .ptc-anim-delay-80 {\n  animation-delay: var(--ptc-delay-80);\n}\n:root .ptc-anim-delay-90 {\n  animation-delay: var(--ptc-delay-90);\n}\n:root .ptc-fade-in {\n  animation-name: fade-in;\n  animation-duration: var(--ptc-transition-xx-slow);\n  animation-timing-function: var(--ptc-ease-inout);\n  animation-fill-mode: forwards;\n}\n\n@media screen and (prefers-reduced-motion: reduce) {\n  * {\n    animation-duration: 0.001ms !important;\n    animation-iteration-count: 1 !important;\n    transition-duration: 0.001ms !important;\n  }\n}\n.u-para-sm {\n  font-size: var(--ptc-font-size-small) !important;\n}\n\n.u-para-md {\n  font-size: var(--ptc-font-size-medium) !important;\n}\n\n.u-para-lg {\n  font-size: var(--ptc-font-size-large) !important;\n}\n\n.u-para-xl {\n  font-size: var(--ptc-font-size-x-large) !important;\n}\n\n.u-para-xxl {\n  font-size: var(--ptc-font-size-xx-large) !important;\n}\n\n.u-para-xxxl {\n  font-size: var(--ptc-font-size-xxx-large) !important;\n}\n\n@media only screen and (min-width: 768px) {\n  .u-para-sm {\n    font-size: calc(var(--ptc-font-size-small) + 0.05vw) !important;\n  }\n  .u-para-md {\n    font-size: calc(var(--ptc-font-size-medium) + 0.05vw) !important;\n  }\n  .u-para-lg {\n    font-size: calc(var(--ptc-font-size-large) + 0.05vw) !important;\n  }\n  .u-para-xl {\n    font-size: calc(var(--ptc-font-size-x-large) + 0.05vw) !important;\n  }\n  .u-para-xxl {\n    font-size: calc(var(--ptc-font-size-xx-large) + 0.05vw) !important;\n  }\n  .u-para-xxxl {\n    font-size: calc(var(--ptc-font-size-xxx-large) + 0.05vw) !important;\n  }\n}\n@media only screen and (min-width: 992px) {\n  .u-para-sm {\n    font-size: calc(var(--ptc-font-size-small) + 0.1vw) !important;\n  }\n  .u-para-md {\n    font-size: calc(var(--ptc-font-size-medium) + 0.1vw) !important;\n  }\n  .u-para-lg {\n    font-size: calc(var(--ptc-font-size-large) + 0.1vw) !important;\n  }\n  .u-para-xl {\n    font-size: calc(var(--ptc-font-size-x-large) + 0.1vw) !important;\n  }\n  .u-para-xxl {\n    font-size: calc(var(--ptc-font-size-xx-large) + 0.1vw) !important;\n  }\n  .u-para-xxxl {\n    font-size: calc(var(--ptc-font-size-xxx-large) + 0.1vw) !important;\n  }\n}\n@media only screen and (min-width: 1200px) {\n  .u-para-sm {\n    font-size: calc(var(--ptc-font-size-small) + 0.15vw) !important;\n  }\n  .u-para-md {\n    font-size: calc(var(--ptc-font-size-medium) + 0.15vw) !important;\n  }\n  .u-para-lg {\n    font-size: calc(var(--ptc-font-size-large) + 0.15vw) !important;\n  }\n  .u-para-xl {\n    font-size: calc(var(--ptc-font-size-x-large) + 0.15vw) !important;\n  }\n  .u-para-xxl {\n    font-size: calc(var(--ptc-font-size-xx-large) + 0.15vw) !important;\n  }\n  .u-para-xxxl {\n    font-size: calc(var(--ptc-font-size-xxx-large) + 0.15vw) !important;\n  }\n}\n@media only screen and (min-width: 1440px) {\n  .u-para-sm {\n    font-size: calc(var(--ptc-font-size-small) + 0.2vw) !important;\n  }\n  .u-para-md {\n    font-size: calc(var(--ptc-font-size-medium) + 0.2vw) !important;\n  }\n  .u-para-lg {\n    font-size: calc(var(--ptc-font-size-large) + 0.2vw) !important;\n  }\n  .u-para-xl {\n    font-size: calc(var(--ptc-font-size-x-large) + 0.2vw) !important;\n  }\n  .u-para-xxl {\n    font-size: calc(var(--ptc-font-size-xx-large) + 0.2vw) !important;\n  }\n  .u-para-xxxl {\n    font-size: calc(var(--ptc-font-size-xxx-large) + 0.2vw) !important;\n  }\n}\n@media only screen and (min-width: 1600px) {\n  .u-para-sm {\n    font-size: calc(var(--ptc-font-size-small) + 0.25vw) !important;\n  }\n  .u-para-md {\n    font-size: calc(var(--ptc-font-size-medium) + 0.25vw) !important;\n  }\n  .u-para-lg {\n    font-size: calc(var(--ptc-font-size-large) + 0.25vw) !important;\n  }\n  .u-para-xl {\n    font-size: calc(var(--ptc-font-size-x-large) + 0.25vw) !important;\n  }\n  .u-para-xxl {\n    font-size: calc(var(--ptc-font-size-xx-large) + 0.25vw) !important;\n  }\n  .u-para-xxxl {\n    font-size: calc(var(--ptc-font-size-xxx-large) + 0.25vw) !important;\n  }\n}\n@media only screen and (min-width: 1980px) {\n  .u-para-sm {\n    font-size: calc(var(--ptc-font-size-small) + 0.3vw) !important;\n  }\n  .u-para-md {\n    font-size: calc(var(--ptc-font-size-medium) + 0.3vw) !important;\n  }\n  .u-para-lg {\n    font-size: calc(var(--ptc-font-size-large) + 0.3vw) !important;\n  }\n  .u-para-xl {\n    font-size: calc(var(--ptc-font-size-x-large) + 0.3vw) !important;\n  }\n  .u-para-xxl {\n    font-size: calc(var(--ptc-font-size-xx-large) + 0.3vw) !important;\n  }\n  .u-para-xxxl {\n    font-size: calc(var(--ptc-font-size-xxx-large) + 0.3vw) !important;\n  }\n}\n@media only screen and (min-width: 2600px) {\n  .u-para-sm {\n    font-size: calc(var(--ptc-font-size-small) + 0.35vw) !important;\n  }\n  .u-para-md {\n    font-size: calc(var(--ptc-font-size-medium) + 0.35vw) !important;\n  }\n  .u-para-lg {\n    font-size: calc(var(--ptc-font-size-large) + 0.35vw) !important;\n  }\n  .u-para-xl {\n    font-size: calc(var(--ptc-font-size-x-large) + 0.35vw) !important;\n  }\n  .u-para-xxl {\n    font-size: calc(var(--ptc-font-size-xx-large) + 0.35vw) !important;\n  }\n  .u-para-xxxl {\n    font-size: calc(var(--ptc-font-size-xxx-large) + 0.35vw) !important;\n  }\n}\n.u-para-body {\n  font-size: var(--ptc-font-size-medium) !important;\n}\n\n.u-color-white {\n  color: var(--color-white) !important;\n}\n\n.u-uppercase {\n  text-transform: uppercase !important;\n}\n\n.u-margin-flush {\n  margin: 0 !important;\n}\n\n.u-marginTop-flush {\n  margin-top: 0 !important;\n}\n\n.u-marginLeft-flush {\n  margin-left: 0 !important;\n}\n\n.u-marginRight-flush {\n  margin-right: 0 !important;\n}\n\n.u-marginBottom-flush {\n  margin-bottom: 0 !important;\n}\n\n.u-padding-flush {\n  padding: 0 !important;\n}\n\n.u-paddingTop-flush {\n  padding-top: 0 !important;\n}\n\n.u-paddingLeft-flush {\n  padding-left: 0 !important;\n}\n\n.u-paddingRight-flush {\n  padding-right: 0 !important;\n}\n\n.u-paddingBottom-flush {\n  padding-bottom: 0 !important;\n}\n\n.u-margin-xs {\n  margin: var(--ptc-element-spacing-01) !important;\n}\n\n.u-marginTop-xs {\n  margin-top: var(--ptc-element-spacing-01) !important;\n}\n\n.u-marginLeft-xs {\n  margin-left: var(--ptc-element-spacing-01) !important;\n}\n\n.u-marginRight-xs {\n  margin-right: var(--ptc-element-spacing-01) !important;\n}\n\n.u-marginBottom-xs {\n  margin-bottom: var(--ptc-element-spacing-01) !important;\n}\n\n.u-margin-sm {\n  margin: var(--ptc-element-spacing-02) !important;\n}\n\n.u-marginTop-sm {\n  margin-top: var(--ptc-element-spacing-02) !important;\n}\n\n.u-marginLeft-sm {\n  margin-left: var(--ptc-element-spacing-02) !important;\n}\n\n.u-marginRight-sm {\n  margin-right: var(--ptc-element-spacing-02) !important;\n}\n\n.u-marginBottom-sm {\n  margin-bottom: var(--ptc-element-spacing-02) !important;\n}\n\n.u-margin-md {\n  margin: var(--ptc-element-spacing-03) !important;\n}\n\n.u-marginTop-md {\n  margin-top: var(--ptc-element-spacing-03) !important;\n}\n\n.u-marginLeft-md {\n  margin-left: var(--ptc-element-spacing-03) !important;\n}\n\n.u-marginRight-md {\n  margin-right: var(--ptc-element-spacing-03) !important;\n}\n\n.u-marginBottom-md {\n  margin-bottom: var(--ptc-element-spacing-03) !important;\n}\n\n.u-margin-lg {\n  margin: var(--ptc-element-spacing-04) !important;\n}\n\n.u-marginTop-lg {\n  margin-top: var(--ptc-element-spacing-04) !important;\n}\n\n.u-marginLeft-lg {\n  margin-left: var(--ptc-element-spacing-04) !important;\n}\n\n.u-marginRight-lg {\n  margin-right: var(--ptc-element-spacing-04) !important;\n}\n\n.u-marginBottom-lg {\n  margin-bottom: var(--ptc-element-spacing-04) !important;\n}\n\n.u-margin-xl {\n  margin: var(--ptc-element-spacing-05) !important;\n}\n\n.u-marginTop-xl {\n  margin-top: var(--ptc-element-spacing-05) !important;\n}\n\n.u-marginLeft-xl {\n  margin-left: var(--ptc-element-spacing-05) !important;\n}\n\n.u-marginRight-xl {\n  margin-right: var(--ptc-element-spacing-05) !important;\n}\n\n.u-marginBottom-xl {\n  margin-bottom: var(--ptc-element-spacing-05) !important;\n}\n\n.u-margin-xxl {\n  margin: var(--ptc-element-spacing-06) !important;\n}\n\n.u-marginTop-xxl {\n  margin-top: var(--ptc-element-spacing-06) !important;\n}\n\n.u-marginLeft-xxl {\n  margin-left: var(--ptc-element-spacing-06) !important;\n}\n\n.u-marginRight-xxl {\n  margin-right: var(--ptc-element-spacing-06) !important;\n}\n\n.u-marginBottom-xxl {\n  margin-bottom: var(--ptc-element-spacing-06) !important;\n}\n\n.u-margin-xxxl {\n  margin: var(--ptc-element-spacing-07) !important;\n}\n\n.u-marginTop-xxxl {\n  margin-top: var(--ptc-element-spacing-07) !important;\n}\n\n.u-marginLeft-xxxl {\n  margin-left: var(--ptc-element-spacing-07) !important;\n}\n\n.u-marginRight-xxxl {\n  margin-right: var(--ptc-element-spacing-07) !important;\n}\n\n.u-marginBottom-xxxl {\n  margin-bottom: var(--ptc-element-spacing-07) !important;\n}\n\n.u-margin-4xl {\n  margin: var(--ptc-element-spacing-08) !important;\n}\n\n.u-marginTop-4xl {\n  margin-top: var(--ptc-element-spacing-08) !important;\n}\n\n.u-marginLeft-4xl {\n  margin-left: var(--ptc-element-spacing-08) !important;\n}\n\n.u-marginRight-4xl {\n  margin-right: var(--ptc-element-spacing-08) !important;\n}\n\n.u-marginBottom-4xl {\n  margin-bottom: var(--ptc-element-spacing-08) !important;\n}\n\n.u-textAlign-ctr {\n  text-align: center !important;\n}\n\n.u-textAlign-right {\n  text-align: right !important;\n}\n\n.u-textAlign-left {\n  text-align: left !important;\n}\n\n.u-textWhite {\n  color: var(--color-white) !important;\n}\n\n.u-textGreen1 {\n  color: var(--color-green-07) !important;\n}\n\n.u-textGreen2 {\n  color: var(--color-green-06) !important;\n}\n\n.u-text-nowrap {\n  white-space: nowrap;\n}\n\n.u-text-medium {\n  font-weight: var(--ptc-font-weight-medium);\n}\n\n.u-text-semibold {\n  font-weight: var(--ptc-font-weight-semibold);\n}\n\n.u-text-bold {\n  font-weight: var(--ptc-font-weight-bold);\n}\n\n.u-text-thin {\n  font-weight: var(--ptc-font-weight-thin);\n}\n\n.u-textStyle-normal {\n  font-style: normal !important;\n}\n\n.u-no-scroll {\n  overflow: hidden;\n}\n\n.overflow-x-hidden {\n  overflow-x: hidden;\n}\n\n.u-background-white {\n  background-color: var(--color-white);\n}\n\n.u-background-reset {\n  background-color: transparent !important;\n}\n\n.u-white-overylay {\n  background: hsla(0, 0%, 94.9%, 0.9);\n}\n\n.u-cursor-pointer {\n  cursor: pointer;\n}\n\n.u-clear {\n  clear: both;\n}\n\n.u-border-radius-standard {\n  border-radius: var(--ptc-border-radius-standard);\n}\n\n.u-border-radius-large {\n  border-radius: var(--ptc-border-radius-large);\n}\n\n.u-border-radius-pill {\n  border-radius: var(--ptc-border-radius-pill);\n}\n\n.u-border-radius-circle {\n  border-radius: var(--ptc-border-radius-circle);\n}\n\n.u-border-none {\n  border: none;\n}\n\n.u-shadow-x-small {\n  box-shadow: var(--ptc-shadow-x-small);\n}\n\n.u-shadow-small {\n  box-shadow: var(--ptc-shadow-small);\n}\n\n.u-shadow-medium {\n  box-shadow: var(--ptc-shadow-medium);\n}\n\n.u-shadow-large {\n  box-shadow: var(--ptc-shadow-large);\n}\n\n.u-shadow-x-large {\n  box-shadow: var(--ptc-shadow-x-large);\n}\n\n@media only screen and (min-width: 768px) {\n  .u-hero-width {\n    width: 525px;\n  }\n  .u-margin-center {\n    margin: 0 auto;\n  }\n  .u-justify-self-end {\n    justify-self: flex-end;\n  }\n}\n.u-hero-pushup {\n  transform: translateY(-120px);\n}\n@media only screen and (min-width: 768px) {\n  .u-hero-pushup {\n    transform: translateY(-144px);\n  }\n}\n\n@media only screen and (min-width: 768px) {\n  .grid-order-1-md {\n    order: 1;\n  }\n  .grid-order-2-md {\n    order: 2;\n  }\n  .grid-order-3-md {\n    order: 3;\n  }\n}\n@media only screen and (min-width: 992px) {\n  .grid-order-1-lg {\n    order: 1;\n  }\n  .grid-order-2-lg {\n    order: 2;\n  }\n  .grid-order-3-lg {\n    order: 3;\n  }\n}\n.standard-list {\n  list-style: none;\n  margin-left: 0;\n  margin-bottom: 20px;\n  padding: 0;\n}\n\n.is-spaced-between {\n  justify-content: space-between;\n}\n\n.h-100 {\n  height: 100%;\n}\n\n.w-100 {\n  width: 100%;\n}\n\n.grid-large-col-gap-md {\n  -moz-column-gap: 0;\n       column-gap: 0;\n}\n@media only screen and (min-width: 992px) {\n  .grid-large-col-gap-md {\n    -moz-column-gap: 3rem;\n         column-gap: 3rem;\n  }\n}\n\n.grid-large-col-gap-sm {\n  -moz-column-gap: 0;\n       column-gap: 0;\n}\n@media only screen and (min-width: 768px) {\n  .grid-large-col-gap-sm {\n    -moz-column-gap: 3rem;\n         column-gap: 3rem;\n  }\n}\n\n.grid-x-large-col-gap-md {\n  -moz-column-gap: 0;\n       column-gap: 0;\n}\n@media only screen and (min-width: 992px) {\n  .grid-x-large-col-gap-md {\n    -moz-column-gap: 4rem;\n         column-gap: 4rem;\n  }\n}\n\n.grid-x-large-col-gap-sm {\n  -moz-column-gap: 0;\n       column-gap: 0;\n}\n@media only screen and (min-width: 768px) {\n  .grid-x-large-col-gap-sm {\n    -moz-column-gap: 4rem;\n         column-gap: 4rem;\n  }\n}\n\n.grid-medium-col-gap-md {\n  -moz-column-gap: 0;\n       column-gap: 0;\n}\n@media only screen and (min-width: 992px) {\n  .grid-medium-col-gap-md {\n    -moz-column-gap: 2rem;\n         column-gap: 2rem;\n  }\n}\n\n.grid-medium-col-gap-sm {\n  -moz-column-gap: 0;\n       column-gap: 0;\n}\n@media only screen and (min-width: 768px) {\n  .grid-medium-col-gap-sm {\n    -moz-column-gap: 2rem;\n         column-gap: 2rem;\n  }\n}\n\n/* Floating Content */\n.is-float-left {\n  float: left;\n}\n\n.is-float-right {\n  float: right;\n}\n\n/* Hiding Content by Breakpoint */\n.is-mobile {\n  display: block;\n}\n\n.is-desktop {\n  display: none;\n}\n\n@media only screen and (min-width: 992px) {\n  .is-mobile {\n    display: none;\n  }\n  .is-desktop {\n    display: block;\n  }\n}\n.ptc-section {\n  padding-top: 3rem;\n  padding-bottom: 3rem;\n}\n\n.ptc-section-standard {\n  padding-top: 3rem;\n  padding-bottom: 3rem;\n}\n\n.ptc-section-half {\n  padding-top: 1.5rem;\n  padding-bottom: 1.5rem;\n}\n\n.ptc-section-large {\n  padding-top: 2.25rem;\n  padding-bottom: 2.25rem;\n}\n@media only screen and (min-width: 992px) {\n  .ptc-section-large {\n    padding-top: 3.5rem;\n    padding-bottom: 3.5rem;\n  }\n}\n\n.ptc-section-hp {\n  padding-bottom: calc(2.25rem - 32px);\n}\n@media only screen and (min-width: 992px) {\n  .ptc-section-hp {\n    padding-bottom: calc(3.5rem - 32px);\n  }\n}\n\n.u-flex {\n  display: flex;\n}\n\n@media only screen and (min-width: 480px) {\n  .u-flex-xs {\n    display: flex;\n  }\n}\n@media only screen and (min-width: 768px) {\n  .u-flex-sm {\n    display: flex;\n  }\n}\n@media only screen and (min-width: 992px) {\n  .u-flex-md {\n    display: flex;\n  }\n}\n@media only screen and (min-width: 1200px) {\n  .u-flex-lg {\n    display: flex;\n  }\n}\n@media only screen and (min-width: 1440px) {\n  .u-flex-xl {\n    display: flex;\n  }\n}\n@media only screen and (min-width: 1600px) {\n  .u-flex-xxl {\n    display: flex;\n  }\n}\n@media only screen and (min-width: 1980px) {\n  .u-flex-2k {\n    display: flex;\n  }\n}\n@media only screen and (min-width: 2600px) {\n  .u-flex-4k {\n    display: flex;\n  }\n}\n.u-align-center {\n  margin: auto;\n  align-self: center;\n}\n\n.u-align-left {\n  margin-right: auto;\n  align-self: center;\n}\n\n.u-align-right {\n  margin-left: auto;\n  align-self: center;\n}\n\n.u-align-x-center {\n  margin-right: auto;\n  margin-left: auto;\n}\n\n.u-align-x-left {\n  margin-right: auto;\n}\n\n.u-align-x-right {\n  margin-left: auto;\n}\n\n.u-align-y-center {\n  align-self: center;\n}\n\n.u-align-y-top {\n  align-self: flex-start;\n}\n\n.u-align-y-bottom {\n  align-self: flex-end;\n}\n\n.is-flex-column {\n  flex-direction: column;\n}\n\n.flex-align-items {\n  align-items: flex-end;\n}\n\n.flex-align-items-center {\n  align-items: center;\n}\n\n.u-flex-nowrap {\n  flex-wrap: nowrap;\n}\n\n.u-flex-wrap {\n  flex-wrap: wrap;\n}\n\n.u-align-self-start {\n  align-self: start;\n}\n\n.u-align-self-center {\n  align-self: center;\n}\n\n.u-align-self-stretch {\n  align-self: stretch;\n}\n\n.u-justify-self-start {\n  justify-self: start;\n}\n\n.u-justify-self-center {\n  justify-self: center;\n}\n\n.u-justify-self-stretch {\n  justify-self: stretch;\n}\n\n.u-flex-justify-center {\n  justify-content: center;\n}\n\n.u-flex-justify-flexend {\n  justify-content: flex-end;\n}\n\n.u-section-heading-wrapper {\n  max-width: 768px;\n  margin-left: auto;\n  margin-right: auto;\n}\n\n.embed-responsive {\n  position: relative;\n  display: block;\n  height: 0;\n  padding: 0;\n  overflow: hidden;\n}\n\n.embed-responsive-16by9 {\n  padding-bottom: 56.25%;\n}\n\n.embed-responsive .embed-responsive-item,\n.embed-responsive embed,\n.embed-responsive iframe,\n.embed-responsive object,\n.embed-responsive video {\n  position: absolute;\n  top: 0;\n  bottom: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n  border: 0;\n}\n\n@media only screen and (min-width: 768px) {\n  .is-grid.grid-large-col-gap-xs-0 {\n    row-gap: 0;\n  }\n}\n.max-content {\n  max-width: 90%;\n}\n@media only screen and (min-width: 480px) {\n  .max-content {\n    max-width: 80%;\n  }\n}\n.max-content {\n  margin: auto;\n}\n\n.u-justify-space-between {\n  justify-content: space-between;\n}\n\n.all-product-banner {\n  padding: 50px 0 44px 0px;\n}\n@media only screen and (min-width: 992px) {\n  .all-product-banner {\n    padding: 50px 0 72px 0px;\n    display: flex;\n    min-height: 300px;\n    justify-content: center;\n    align-items: center;\n  }\n}\n\n.all-product-gradient {\n  background: linear-gradient(180deg, #f3f3f3 2.6%, rgba(225, 241, 226, 0.2) 40.63%, #f3f3f3 82.29%), linear-gradient(0deg, #f3f3f3, #f3f3f3);\n}\n\n.menu-right ptc-nav-submenu {\n  position: relative;\n}\n\n.media-thumb-feature {\n  display: block;\n}\n@media only screen and (min-width: 992px) {\n  .media-thumb-feature {\n    display: flex;\n    justify-content: space-between;\n  }\n}\n.media-thumb-feature .media-thumb {\n  width: 100%;\n  margin-bottom: 2rem;\n}\n@media only screen and (min-width: 992px) {\n  .media-thumb-feature .media-thumb {\n    width: 340px;\n    flex: 0 0 340px;\n  }\n}\n.media-thumb-feature .media-thumb > ptc-picture:not(:last-of-type),\n.media-thumb-feature .media-thumb > img:not(:last-of-type) {\n  margin-bottom: 1.5rem;\n}\n.media-thumb-feature .media-feature {\n  width: 100%;\n  margin-bottom: 2rem;\n}\n@media only screen and (min-width: 992px) {\n  .media-thumb-feature .media-feature {\n    width: auto;\n    flex: 1 1 auto;\n  }\n}\n\n.partner-card-desc h5.description {\n  font-family: var(--ptc-font-latin);\n  color: var(--color-gray-10);\n  font-size: var(--ptc-font-size-x-small);\n  font-weight: var(--ptc-font-weight-medium);\n  letter-spacing: var(--ptc-letter-spacing-normal);\n  line-height: var(--ptc-line-height-medium);\n  margin: 0 0 10px 0;\n}\n.partner-card-desc .tags {\n  margin-bottom: 0.75rem;\n}\n.partner-card-desc .tags .tag:not(:first-child) {\n  border-left: 2px solid var(--color-green-07);\n  padding: 0 8px;\n}\n.partner-card-desc .tags .tag:first-child {\n  padding: 0 8px 0 0;\n}\n.partner-card-desc .tags .tag {\n  color: var(--color-gray-10);\n  display: inline;\n  font-size: var(--ptc-font-size-xx-small);\n  font-weight: var(--ptc-font-weight-bold);\n  letter-spacing: var(--ptc-letter-spacing-loose);\n  margin: 0 0 10px 0;\n  padding: 0 8px;\n}\n\n.u-3-col-grid {\n  width: 100%;\n  display: flex;\n  flex-wrap: wrap;\n  grid-row-gap: 1rem;\n  grid-column-gap: 1rem;\n}\n.u-3-col-grid .u-3-col {\n  width: 100%;\n}\n@media only screen and (min-width: 768px) {\n  .u-3-col-grid .u-3-col {\n    width: calc(50% - 10.66666666px);\n  }\n}\n@media only screen and (min-width: 992px) {\n  .u-3-col-grid .u-3-col {\n    width: calc(33.3333333333% - 10.66666666px);\n  }\n}\n.u-3-col-grid.u-col-space-lg {\n  grid-row-gap: 2rem;\n  grid-column-gap: 2rem;\n}\n.u-3-col-grid.u-col-space-lg .u-3-col {\n  width: 100%;\n}\n@media only screen and (min-width: 768px) {\n  .u-3-col-grid.u-col-space-lg .u-3-col {\n    width: calc(50% - 21.3333333px);\n  }\n}\n@media only screen and (min-width: 992px) {\n  .u-3-col-grid.u-col-space-lg .u-3-col {\n    width: calc(33.3333333333% - 21.3333333px);\n  }\n}\n\n.u-display-none {\n  display: none;\n}\n\nptc-preloader-section.min-height {\n  min-height: 150vh;\n}\n\n@media only screen and (min-width: 1200px) {\n  .ms-mobile-select {\n    display: none;\n  }\n}\n.ms-mobile-select.ms-show {\n  position: fixed;\n}\n\n.light-font {\n  color: var(--color-white);\n}\n.light-font * {\n  color: var(--color-white);\n}\n\nptc-nav-submenu {\n  margin-top: 6px;\n  border-left: 2px solid transparent;\n  border-right: 2px solid transparent;\n  border-bottom: 2px solid transparent;\n}\nptc-nav-submenu:focus-visible, ptc-nav-submenu:focus {\n  margin-top: 4px;\n  border-radius: var(--ptc-border-radius-standard);\n  border: 2px solid rgb(255, 255, 255);\n  outline: 5px solid var(--keyboard-nav-outline);\n}\n\nptc-nav-link {\n  margin-top: 6px;\n  border-left: 2px solid transparent;\n  border-right: 2px solid transparent;\n  border-bottom: 2px solid transparent;\n}\n\n.tooltip-box {\n  visibility: visible;\n  padding: 8px;\n  color: var(--color-white);\n  font-size: var(--ptc-font-size-xxx-small);\n  font-weight: var(--ptc-font-weight-semibold);\n  background-color: var(--color-gray-09);\n  box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.3);\n  border: none;\n  border-radius: var(--ptc-border-radius-standard);\n  width: auto;\n  height: auto;\n  text-align: left;\n  text-shadow: none;\n  white-space: normal;\n  position: absolute;\n  z-index: 999;\n  line-height: 1.5;\n}\n@media only screen and (min-width: 480px) {\n  .tooltip-box {\n    width: 273px;\n  }\n}\n.tooltip-box.hide-tooltip-mobile {\n  display: none !important;\n}\n@media only screen and (min-width: 768px) {\n  .tooltip-box.hide-tooltip-mobile {\n    display: block !important;\n  }\n}\n.tooltip-box.full-width {\n  width: 100%;\n}\n.tooltip-box::after {\n  content: \"\";\n  position: absolute;\n}\n.tooltip-box.bottom {\n  bottom: -12px;\n  transform: translateY(100%);\n}\n.tooltip-box.bottom::after {\n  top: 1px;\n  left: 50%;\n  transform: translate(-50%, -100%);\n  border: 8px solid transparent;\n  border-bottom: 8px solid var(--color-gray-09);\n}\n.tooltip-box.left {\n  bottom: -12px;\n  transform: translate(-80%, 100%);\n}\n.tooltip-box.left::after {\n  top: 1px;\n  right: 8px;\n  transform: translateY(-100%);\n  border: 8px solid transparent;\n  border-bottom: 8px solid var(--color-gray-09);\n}\n.tooltip-box.right {\n  bottom: -12px;\n  transform: translateY(100%);\n  right: 0px;\n}\n@-moz-document url-prefix() {\n  .tooltip-box.right {\n    right: unset !important;\n    bottom: unset !important;\n    transform: translate(60%, 8px) !important;\n  }\n  @media screen and (min-width: 992px) {\n    .tooltip-box.right {\n      transform: translate(100%, 8px) !important;\n    }\n  }\n}\n.tooltip-box.right::after {\n  top: 1px;\n  left: 8px;\n  transform: translateY(-100%);\n  border: 8px solid transparent;\n  border-bottom: 8px solid var(--color-gray-09);\n}\n.tooltip-box.top {\n  top: -8px;\n  transform: translateY(-100%);\n}\n.tooltip-box.top::after {\n  left: 50%;\n  bottom: 1px;\n  transform: translate(-50%, 100%);\n  border: 8px solid transparent;\n  border-top: 8px solid var(--color-gray-09);\n}\n.tooltip-box.bottom-right {\n  bottom: -12px;\n  transform: translate(100%, 100%);\n}\n.tooltip-box.bottom-right::after {\n  top: 1px;\n  left: 10%;\n  transform: translate(-50%, -100%);\n  border: 8px solid transparent;\n  border-bottom: 8px solid var(--color-gray-09);\n}\n.tooltip-box.danger {\n  color: var(--color-red-07);\n  font-family: var(--ptc-font-latin);\n  font-weight: var(--ptc-font-weight-semibold);\n  font-size: var(--ptc-font-size-xx-small);\n  line-height: var(--ptc-line-height-p);\n  border: 2px solid var(--color-red-07);\n  border-radius: var(--ptc-border-radius-standard);\n  background-color: var(--color-white);\n  padding: var(--ptc-element-spacing-06);\n}\n.tooltip-box.danger a {\n  color: var(--color-hyperlink);\n}\n\n@media (max-width: 768px) {\n  .hide-tooltip-on-mobile h1,\n  .hide-tooltip-on-mobile h2,\n  .hide-tooltip-on-mobile h3,\n  .hide-tooltip-on-mobile h4,\n  .hide-tooltip-on-mobile h5,\n  .hide-tooltip-on-mobile h6 {\n    -webkit-line-clamp: initial !important;\n  }\n}\n\ndynamic-box-bundle p {\n  margin: 0px !important;\n}\n\n.col-media-slot-text p {\n  font-size: var(--ptc-font-size-x-small);\n}\n\n.fef-two-column-two-media .has-col-gap-lg {\n  grid-column-gap: var(--spacing-md);\n}\n@media only screen and (min-width: 992px) {\n  .fef-two-column-two-media .has-col-gap-lg {\n    grid-column-gap: var(--spacing-lg);\n  }\n}\n.fef-two-column-two-media .is-col-6-md {\n  padding-bottom: 3rem;\n}\n.fef-two-column-two-media .is-col-6-md:last-child {\n  padding-bottom: 0rem;\n}\n@media only screen and (min-width: 768px) {\n  .fef-two-column-two-media .is-col-6-md {\n    padding-bottom: 0rem;\n  }\n}\n\n.product-tab ptc-title h3 {\n  font-size: 20px !important;\n  font-weight: 900;\n}\n@media only screen and (min-width: 1200px) {\n  .product-tab ptc-title h3 {\n    font-size: 15px !important;\n    font-weight: 800;\n  }\n}\n.product-tab .is-grid {\n  grid-column-gap: 20px;\n  grid-row-gap: 12px;\n}\n\nptc-bio-card .bio-modal-open-content {\n  color: var(--color-gray-10);\n  font-size: var(--ptc-font-size-small);\n  line-height: var(--ptc-line-height-denser);\n}\nptc-bio-card .bio-modal-open-content h3 {\n  letter-spacing: 0.08rem;\n  margin-bottom: 2px;\n  font-size: var(--ptc-font-size-small);\n}\nptc-bio-card .bio-modal-open-content ul {\n  margin-top: 0;\n}\nptc-bio-card .bio-modal-open-content ul li {\n  line-height: var(--ptc-line-height-p);\n}\nptc-bio-card .bio-modal-open-content .btn-blackgrey {\n  background-color: var(--color-gray-10);\n  display: inline-block;\n  border-style: solid;\n  border-width: 1px;\n  white-space: normal;\n  position: relative;\n  text-decoration: none;\n  -moz-osx-font-smoothing: grayscale;\n  /*(For Firefox)*/\n  -webkit-font-smoothing: antialiased;\n  /*(For Chrome and Safari)*/\n  cursor: pointer;\n  padding: 14px 20px;\n  border: 2px solid var(--color-gray-08);\n  border-radius: var(--ptc-border-radius-standard);\n  color: var(--color-white);\n  font-weight: 700;\n}\nptc-bio-card .bio-modal-open-content .btn-blackgrey:hover {\n  background-color: var(--color-gray-09);\n  border-color: var(--color-gray-08);\n}\nptc-bio-card .bio-modal-open-content .btn-blackgrey svg {\n  display: none;\n}\nptc-bio-card .bio-modal-open-content hr {\n  margin-top: 20px;\n  margin-bottom: 20px;\n  border: 0;\n  border-top: 1px solid #eee;\n}\n\nptc-nav-submenu .dropdown-content {\n  display: none;\n}\nptc-nav-submenu .dropdown-content.open {\n  display: block;\n  border-top: 1px solid var(--color-gray-08);\n}\n@media only screen and (min-width: 1200px) {\n  ptc-nav-submenu .dropdown-content.open {\n    border-top: none;\n  }\n}\nptc-nav-submenu .dropdown-content.open ptc-nav-link {\n  padding-left: 24px;\n}\n@media only screen and (min-width: 1200px) {\n  ptc-nav-submenu .dropdown-content.open ptc-nav-link {\n    padding-left: 0;\n  }\n}\nptc-nav-submenu.short-dropdown .dropdown-content.open {\n  padding: var(--ptc-layout-spacing-04);\n}\n@media only screen and (min-width: 1200px) {\n  ptc-nav-submenu.short-dropdown .dropdown-content.open {\n    padding: var(--ptc-layout-spacing-03) var(--ptc-layout-spacing-04);\n  }\n}\n\n/* // All product page specific Css,  */\n.all-product-banner {\n  padding: 50px 0 44px 0px;\n}\n@media only screen and (min-width: 992px) {\n  .all-product-banner {\n    padding: 50px 0 72px 0px;\n    display: flex;\n    min-height: 300px;\n    justify-content: center;\n    align-items: center;\n  }\n}\n\n.all-product-gradient {\n  background: linear-gradient(180deg, var(--color-gray-01) 2.6%, rgba(225, 241, 226, 0.2) 40.63%, var(--color-gray-01) 82.29%), linear-gradient(0deg, var(--color-gray-01), var(--color-gray-01));\n}\n\n.flex-grid {\n  width: 100%;\n  display: flex;\n  flex-wrap: wrap;\n  justify-content: center;\n  grid-row-gap: 12px;\n  grid-column-gap: 12px;\n}\n.flex-grid ptc-product-highlight-card {\n  margin: 0;\n  width: 100%;\n  height: auto;\n}\n@media only screen and (min-width: 992px) {\n  .flex-grid ptc-product-highlight-card {\n    width: calc(33.3333333333% - 8px);\n  }\n}\n\n.flex-grid-creo {\n  width: 100%;\n  display: flex;\n  flex-wrap: wrap;\n  justify-content: center;\n  grid-row-gap: 2rem;\n  grid-column-gap: 2rem;\n  padding: 32px 0 44px 0;\n}\n.flex-grid-creo ptc-card {\n  margin: 0;\n  width: 100%;\n  height: auto;\n}\n@media only screen and (min-width: 768px) {\n  .flex-grid-creo ptc-card {\n    width: calc(33.3333333333% - 22px);\n  }\n}\n\n.min-height-300 {\n  min-height: 300px;\n}\n\n.social-share-slot ptc-social-share {\n  margin-left: var(--ptc-element-spacing-03);\n}\n\n.ic-header-margin {\n  margin-bottom: 48px;\n}\n@media only screen and (min-width: 768px) {\n  .ic-header-margin {\n    margin-bottom: 40px;\n  }\n}\n@media only screen and (min-width: 992px) {\n  .ic-header-margin {\n    margin-bottom: 36px;\n  }\n}\n\n.blog-section {\n  color: var(--color-gray-10);\n}\n.blog-section h2 {\n  margin-block-start: 0px;\n  margin-block-end: 0px;\n  margin: 20px 0px;\n}\n.blog-section ul li,\n.blog-section ol li {\n  font-size: var(--ptc-font-size-small);\n  line-height: var(--ptc-line-height-p);\n  margin-bottom: var(--ptc-element-spacing-03);\n  color: var(--color-gray-10);\n}\n.blog-section ptc-tag {\n  color: var(--color-gray-10);\n}\n\n.top-section ptc-tag {\n  color: var(--color-gray-10);\n}\n\nptc-icon-component .icon-component ptc-title {\n  max-width: 85%;\n  margin: auto;\n  display: block;\n}\nptc-icon-component .icon-component:nth-child(odd) max-width-container {\n  margin-left: auto;\n  margin-right: 0;\n}\nptc-icon-component .icon-component:nth-child(even) max-width-container {\n  margin-right: auto;\n  margin-left: 0;\n}\nptc-icon-component .icon-component:last-child:not(ptc-icon-component .icon-component:nth-child(even)) max-width-container {\n  margin-right: auto;\n  margin-left: auto;\n}\n\n.podcast-cta-section {\n  margin-bottom: 0;\n}\n.podcast-cta-section .btn {\n  padding: var(--ptc-font-size-xx-small) var(--ptc-font-size-medium);\n  transition: background-color var(--ptc-ease-inout) var(--ptc-transition-medium);\n  background: var(--color-gray-12);\n  border: 2px solid var(--color-gray-08);\n  border-radius: var(--ptc-border-radius-standard);\n  display: inline-block;\n  margin: 0 20px 20px 0;\n  color: var(--color-white) !important;\n  text-decoration: none;\n}\n.podcast-cta-section .btn:focus {\n  outline: 3px solid var(--color-blue-07);\n  outline-offset: 2px;\n}\n.podcast-cta-section .btn:hover, .podcast-cta-section .btn:visited:hover {\n  background-color: var(--color-gray-10);\n  color: var(--color-white);\n}\n.podcast-cta-section .btn:active {\n  transition: none;\n  background-color: var(--color-black);\n}\n\nptc-background-video .aspect-ratio-container {\n  position: relative;\n  width: 100%;\n  padding-top: 56.25%;\n  /* 9 / 16 * 100% */\n  max-height: 500px;\n}\nptc-background-video .content {\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n}\n\n.max-width-768-tab {\n  max-width: 768px;\n  margin: auto;\n}\n@media only screen and (min-width: 992px) {\n  .max-width-768-tab {\n    max-width: none;\n  }\n}\n\n.creo-banner .c-banner-wrap {\n  width: 100%;\n  height: auto !important;\n  padding-top: 66.66%;\n  position: relative;\n}\n@media only screen and (min-width: 768px) {\n  .creo-banner ptc-picture {\n    margin-left: auto;\n  }\n}\n\n.creo-card-wrap .smart-img {\n  max-height: 340px;\n}\n\nptc-theater-video-modal .video-modal-description div.dotted.sc-ptc-title h2.sc-ptc-title::before,\nptc-theater-video-modal .video-modal-description div.dotted.sc-ptc-title h3.sc-ptc-title::before {\n  content: none;\n}\nptc-theater-video-modal .video-modal-description p,\nptc-theater-video-modal .video-modal-description ul li,\nptc-theater-video-modal .video-modal-description ol li {\n  color: var(--color-white);\n}\nptc-theater-video-modal {\n  /*Adding anchor style on dark background for filter-level-theater comp*/\n}\nptc-theater-video-modal a {\n  font-family: \"Raleway\", sans-serif;\n  font-style: normal;\n  text-decoration-line: underline;\n  color: #89bbdf;\n  transition: color 250ms cubic-bezier(0, 0, 0.58, 1);\n  font-weight: 700;\n}\nptc-theater-video-modal a:visited {\n  color: #4795cd;\n}\nptc-theater-video-modal a:active, ptc-theater-video-modal a:visited:active {\n  transition: none;\n  color: #197bc0;\n}\nptc-theater-video-modal a:hover, ptc-theater-video-modal a:visited:hover {\n  color: #6caad7;\n}\nptc-theater-video-modal a.disabled {\n  color: #aeb8bd !important;\n  cursor: not-allowed;\n}\n\nfilter-level-theater {\n  /*Adding anchor style on dark background for filter-level-theater comp*/\n}\nfilter-level-theater a {\n  font-family: \"Raleway\", sans-serif;\n  font-style: normal;\n  text-decoration-line: underline;\n  color: #89bbdf;\n  transition: color 250ms cubic-bezier(0, 0, 0.58, 1);\n  font-weight: 700;\n}\nfilter-level-theater a:visited {\n  color: #4795cd;\n}\nfilter-level-theater a:active, filter-level-theater a:visited:active {\n  transition: none;\n  color: #197bc0;\n}\nfilter-level-theater a:hover, filter-level-theater a:visited:hover {\n  color: #6caad7;\n}\nfilter-level-theater a.disabled {\n  color: #aeb8bd !important;\n  cursor: not-allowed;\n}\n\n.rich-text-content ul li,\n.rich-text-content ol li {\n  font-size: var(--ptc-font-size-small);\n  line-height: var(--ptc-line-height-p);\n  margin-bottom: var(--ptc-element-spacing-03);\n  color: var(--color-gray-10);\n}\n\nptc-value-led-content .vl-rich-content {\n  color: var(--color-gray-10);\n  font-size: var(--ptc-font-size-small);\n  line-height: var(--ptc-line-height-p);\n  font-weight: var(--ptc-font-weight-regular);\n}\nptc-value-led-content .vl-rich-content img {\n  max-width: 100%;\n  -o-object-fit: cover;\n     object-fit: cover;\n  margin-top: 48px;\n}\nptc-value-led-content .vl-rich-content h3 {\n  margin: 0 0 12px 0;\n  color: var(--color-gray-10);\n}\nptc-value-led-content .vl-rich-content p:last-child {\n  margin-bottom: 0;\n}\nptc-value-led-content ptc-picture {\n  margin-top: 48px;\n}\n\n.showcase-section-col-gap {\n  grid-column-gap: var(--ptc-element-spacing-06);\n}\n@media only screen and (min-width: 1200px) {\n  .showcase-section-col-gap {\n    grid-column-gap: var(--ptc-element-spacing-07);\n  }\n}\n@media only screen and (min-width: 1440px) {\n  .showcase-section-col-gap {\n    grid-column-gap: var(--ptc-element-spacing-08);\n  }\n}\n\n@media only screen and (min-width: 768px) {\n  .desktop-8px-height {\n    height: 8px;\n  }\n}\n\n.cs-top-results .cs-count,\n.events-top-results .events-count {\n  font-size: var(--ptc-font-size-x-small);\n  font-weight: var(--ptc-font-weight-medium);\n  line-height: var(--ptc-line-height-densest);\n  letter-spacing: 0.53px;\n  text-align: right;\n  color: var(--color-gray-09);\n}\n\n.tooltip-box {\n  visibility: visible;\n  padding: 8px;\n  color: var(--color-white);\n  font-size: var(--ptc-font-size-xxx-small);\n  font-weight: var(--ptc-font-weight-semibold);\n  background-color: var(--color-gray-09);\n  box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.3);\n  border: none;\n  border-radius: var(--ptc-border-radius-standard);\n  width: auto;\n  height: auto;\n  text-align: left;\n  text-shadow: none;\n  white-space: normal;\n  position: absolute;\n  z-index: 999;\n  line-height: 1.5;\n}\n@media only screen and (min-width: 480px) {\n  .tooltip-box {\n    width: 273px;\n  }\n}\n.tooltip-box.hide-tooltip-mobile {\n  display: none !important;\n}\n@media only screen and (min-width: 768px) {\n  .tooltip-box.hide-tooltip-mobile {\n    display: block !important;\n  }\n}\n.tooltip-box.full-width .tooltip {\n  width: 100%;\n}\n@media only screen and (min-width: 480px) {\n  .tooltip-box.full-width .tooltip {\n    width: 100%;\n  }\n}\n.tooltip-box::after {\n  content: \"\";\n  position: absolute;\n}\n.tooltip-box.bottom {\n  bottom: -12px;\n  transform: translateY(100%);\n}\n.tooltip-box.bottom::after {\n  top: 1px;\n  left: 50%;\n  transform: translate(-50%, -100%);\n  border: 8px solid transparent;\n  border-bottom: 8px solid var(--color-gray-09);\n}\n.tooltip-box.left {\n  bottom: -12px;\n  transform: translate(-80%, 100%);\n}\n.tooltip-box.left::after {\n  top: 1px;\n  right: 8px;\n  transform: translateY(-100%);\n  border: 8px solid transparent;\n  border-bottom: 8px solid var(--color-gray-09);\n}\n.tooltip-box.right {\n  bottom: -12px;\n  transform: translateY(100%);\n  right: 0px;\n}\n@-moz-document url-prefix() {\n  .tooltip-box.right {\n    right: unset !important;\n    bottom: unset !important;\n    transform: translate(60%, 8px) !important;\n  }\n  @media screen and (min-width: 992px) {\n    .tooltip-box.right {\n      transform: translate(100%, 8px) !important;\n    }\n  }\n}\n.tooltip-box.right::after {\n  top: 1px;\n  left: 8px;\n  transform: translateY(-100%);\n  border: 8px solid transparent;\n  border-bottom: 8px solid var(--color-gray-09);\n}\n.tooltip-box.top {\n  top: -8px;\n  transform: translateY(-100%);\n}\n.tooltip-box.top::after {\n  left: 50%;\n  bottom: 1px;\n  transform: translate(-50%, 100%);\n  border: 8px solid transparent;\n  border-top: 8px solid var(--color-gray-09);\n}\n.tooltip-box.bottom-right {\n  bottom: -12px;\n  transform: translate(100%, 100%);\n}\n.tooltip-box.bottom-right::after {\n  top: 1px;\n  left: 10%;\n  transform: translate(-50%, -100%);\n  border: 8px solid transparent;\n  border-bottom: 8px solid var(--color-gray-09);\n}\n.tooltip-box.danger {\n  color: var(--color-red-07);\n  font-family: var(--ptc-font-latin);\n  font-weight: var(--ptc-font-weight-semibold);\n  font-size: var(--ptc-font-size-xx-small);\n  line-height: var(--ptc-line-height-p);\n  border: 2px solid var(--color-red-07);\n  border-radius: var(--ptc-border-radius-standard);\n  background-color: var(--color-white);\n  padding: var(--ptc-element-spacing-06);\n}\n.tooltip-box.danger a {\n  color: var(--color-hyperlink);\n}\n\n@media (max-width: 768px) {\n  .hide-tooltip-on-mobile h1,\n  .hide-tooltip-on-mobile h2,\n  .hide-tooltip-on-mobile h3,\n  .hide-tooltip-on-mobile h4,\n  .hide-tooltip-on-mobile h5,\n  .hide-tooltip-on-mobile h6 {\n    -webkit-line-clamp: initial !important;\n  }\n}\n\n.news-title > div {\n  margin-bottom: 12px !important;\n}\n.news-title h1 {\n  margin: 0;\n}\n\n.news-secondary-title {\n  margin: 0 0 20px 0;\n  font-size: var(--ptc-font-size-medium);\n  color: var(--color-gray-10);\n}\n@media only screen and (min-width: 768px) {\n  .news-secondary-title {\n    font-size: var(--ptc-font-size-large);\n  }\n}\n\n.news-summary {\n  font-size: var(--ptc-font-size-medium);\n  color: var(--color-gray-10);\n  font-weight: var(--ptc-font-weight-medium);\n  line-height: var(--ptc-line-height-normal);\n  margin: 0 0 20px 0;\n}\n\nptc-icon-component .ptc-link {\n  line-height: var(--ptc-line-height-densest) !important;\n  font-size: var(--ptc-font-size-small);\n  font-weight: var(--ptc-font-weight-extrabold) !important;\n}\n\n.min-foot-list-item {\n  display: inline-block;\n  font-size: var(--ptc-font-size-xx-small);\n  font-weight: var(--ptc-font-weight-regular);\n  font-style: normal;\n  font-stretch: normal;\n  line-height: var(--ptc-line-height-denser);\n  letter-spacing: normal;\n  color: var(--color-white);\n  margin: 0 0.5rem;\n}\n.min-foot-list-item a {\n  color: var(--color-white-grey);\n  font-weight: var(--ptc-font-weight-regular);\n  border-bottom: 1px solid transparent;\n  display: inline-block;\n  text-decoration: none;\n  padding: 1px 0;\n}\n.min-foot-list-item a:hover, .min-foot-list-item a:focus {\n  text-decoration: none;\n  border-bottom: 1px solid var(--color-green-06);\n  color: var(--color-white-grey);\n  transition: border var(--ptc-ease-inout) var(--ptc-transition-medium);\n}\n.min-foot-list-item a:active {\n  text-decoration: none;\n  border-bottom: 1px solid var(--color-green-06);\n  color: var(--color-white-grey);\n}\n.min-foot-list-item a:focus {\n  outline: 3px solid var(--color-blue-07);\n  outline-offset: 2px;\n  border-radius: var(--ptc-border-radius-standard);\n  text-decoration: none;\n  border-color: transparent !important;\n}\n.min-foot-list-item a:focus-visible {\n  border-radius: var(--ptc-border-radius-standard);\n  border: 2px solid rgb(255, 255, 255);\n  outline: 5px solid var(--keyboard-nav-outline);\n  transition: none !important;\n  border-color: white !important;\n}\n\n.row-header-h4 {\n  text-align: left;\n  line-height: var(--ptc-line-height-p);\n  margin-top: 0px;\n  margin-bottom: 0px;\n  font-weight: var(--ptc-font-weight-semibold);\n  font-size: var(--ptc-font-size-small) !important;\n  color: var(--color-gray-10);\n  -webkit-font-smoothing: antialiased;\n}\n\nptc-title h1 a,\nptc-title h2 a {\n  font-weight: var(--ptc-font-weight-extrabold);\n}\nptc-title .w-8 h1 a,\nptc-title .w-8 h2 a,\nptc-title .w-8 h3 a,\nptc-title .w-8 h4 a,\nptc-title .w-8 h5 a,\nptc-title .w-8 h6 a {\n  font-weight: var(--ptc-font-weight-extrabold);\n}\nptc-title .w-9 h1 a,\nptc-title .w-9 h2 a,\nptc-title .w-9 h3 a,\nptc-title .w-9 h4 a,\nptc-title .w-9 h5 a,\nptc-title .w-9 h6 a {\n  font-weight: var(--ptc-font-weight-black);\n}\n\n.email-sign-up-wrapper {\n  background: linear-gradient(91deg, var(--color-green-07) 0%, var(--color-green-08) 100%);\n  padding: 40px 0;\n}\n.email-sign-up-wrapper .ptc-container.u-flex.has-col-gap-xxl.has-row-gap-md {\n  flex-direction: column;\n}\n.email-sign-up-wrapper .ptc-container.u-flex.has-col-gap-xxl.has-row-gap-md max-width-container {\n  width: 100%;\n  padding-right: 48px;\n}\n@media only screen and (min-width: 992px) {\n  .email-sign-up-wrapper .ptc-container.u-flex.has-col-gap-xxl.has-row-gap-md max-width-container {\n    padding-right: 0;\n  }\n}\n@media only screen and (min-width: 992px) {\n  .email-sign-up-wrapper .ptc-container.u-flex.has-col-gap-xxl.has-row-gap-md {\n    flex-direction: row;\n  }\n}\n.email-sign-up-wrapper .signup-form {\n  min-width: auto;\n}\n@media only screen and (min-width: 480px) {\n  .email-sign-up-wrapper .signup-form {\n    min-width: 373px;\n  }\n}\n.email-sign-up-wrapper .signup-form {\n  max-width: 100%;\n}\n\nptc-card-wrapper.card-video-intro.background-grey-10 ul li,\nptc-card-wrapper.card-video-intro.background-grey-10 ol li {\n  color: var(--color-white);\n}\n\n.three-up-event-cards-wrapper .is-grid.has-col-gap-xl {\n  -moz-column-gap: 24px;\n       column-gap: 24px;\n}\n@media only screen and (min-width: 1200px) {\n  .three-up-event-cards-wrapper .is-grid.has-col-gap-xl {\n    -moz-column-gap: 32px;\n         column-gap: 32px;\n  }\n}\n@media only screen and (min-width: 1440px) {\n  .three-up-event-cards-wrapper .is-grid.has-col-gap-xl {\n    -moz-column-gap: 40px;\n         column-gap: 40px;\n  }\n}\n\n.html-quote-section-wrapper ptc-readmore-v3 .description {\n  line-height: var(--ptc-line-height-p);\n  margin-bottom: 0px;\n  font-weight: var(--ptc-font-weight-semibold);\n  font-size: var(--ptc-font-size-small);\n  color: var(--color-gray-10);\n}\n@media only screen and (min-width: 992px) {\n  .html-quote-section-wrapper ptc-readmore-v3 .description {\n    font-size: var(--ptc-font-size-large);\n  }\n}\n\n.bulleted-list-section-v1 .bul-col-gap {\n  -moz-column-gap: var(--ptc-element-spacing-06);\n       column-gap: var(--ptc-element-spacing-06);\n  row-gap: 0;\n}\n@media only screen and (min-width: 1200px) {\n  .bulleted-list-section-v1 .bul-col-gap {\n    -moz-column-gap: var(--ptc-element-spacing-07);\n         column-gap: var(--ptc-element-spacing-07);\n  }\n}\n@media only screen and (min-width: 1440px) {\n  .bulleted-list-section-v1 .bul-col-gap {\n    -moz-column-gap: var(--ptc-element-spacing-08);\n         column-gap: var(--ptc-element-spacing-08);\n  }\n}\n.bulleted-list-section-v1 ptc-icon-list {\n  padding-bottom: 40px;\n  width: 100%;\n}\n.bulleted-list-section-v1 ptc-icon-list p {\n  margin-bottom: 0;\n}\n.bulleted-list-section-v1 ptc-icon-list icon-asset {\n  transform: rotate(30deg);\n  margin-top: 8px;\n}\n.bulleted-list-section-v1 .bul-col ptc-icon-list:last-child {\n  padding-bottom: 40px;\n}\n@media only screen and (min-width: 768px) {\n  .bulleted-list-section-v1 .bul-col ptc-icon-list:last-child {\n    padding-bottom: 0px;\n  }\n}\n.bulleted-list-section-v1 .bul-col:last-child ptc-icon-list:last-child {\n  padding-bottom: 0;\n}\n\n.large-bulleted-list-v2 .grid-container {\n  display: grid;\n  grid-template-columns: 1fr; /* Default: 1 column (mobile) */\n  row-gap: var(--ptc-element-spacing-08);\n  -moz-column-gap: var(--ptc-element-spacing-06);\n       column-gap: var(--ptc-element-spacing-06);\n}\n@media only screen and (min-width: 768px) {\n  .large-bulleted-list-v2 .grid-container {\n    grid-template-columns: repeat(2, 1fr);\n  }\n}\n@media only screen and (min-width: 992px) {\n  .large-bulleted-list-v2 .grid-container {\n    grid-template-columns: repeat(3, 1fr);\n  }\n}\n@media only screen and (min-width: 1200px) {\n  .large-bulleted-list-v2 .grid-container {\n    -moz-column-gap: var(--ptc-element-spacing-07);\n         column-gap: var(--ptc-element-spacing-07);\n  }\n}\n@media only screen and (min-width: 1440px) {\n  .large-bulleted-list-v2 .grid-container {\n    -moz-column-gap: var(--ptc-element-spacing-08);\n         column-gap: var(--ptc-element-spacing-08);\n  }\n}\n.large-bulleted-list-v2 .grid-container .grid-item {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n}\n.large-bulleted-list-v2 .grid-container .grid-item ptc-icon-list {\n  padding-bottom: 0;\n  width: 100%;\n}\n.large-bulleted-list-v2 .grid-container .grid-item p {\n  margin-bottom: 0;\n}\n\n.text-copy-footer-cta {\n  padding-top: 48px;\n}\n\n.u-bg-black {\n  background-color: var(--color-black);\n}\n\n.u-bg-white {\n  background-color: var(--color-white);\n}\n\n.u-bg-white-grey {\n  background-color: var(--color-white-grey);\n}\n\n.u-bg-white-01 {\n  background-color: var(--color-white-01);\n}\n\n.u-bg-standard-gray {\n  background-color: var(--color-standard-gray);\n}\n\n.u-bg-green-01 {\n  background-color: var(--color-green-01);\n}\n\n.u-bg-green-02 {\n  background-color: var(--color-green-02);\n}\n\n.u-bg-green-03 {\n  background-color: var(--color-green-03);\n}\n\n.u-bg-green-04 {\n  background-color: var(--color-green-04);\n}\n\n.u-bg-green-05 {\n  background-color: var(--color-green-05);\n}\n\n.u-bg-green-06 {\n  background-color: var(--color-green-06);\n}\n\n.u-bg-green-07 {\n  background-color: var(--color-green-07);\n}\n\n.u-bg-green-08 {\n  background-color: var(--color-green-08);\n}\n\n.u-bg-green-09 {\n  background-color: var(--color-green-09);\n}\n\n.u-bg-green-10 {\n  background-color: var(--color-green-10);\n}\n\n.u-bg-green-11 {\n  background-color: var(--color-green-11);\n}\n\n.u-bg-green-12 {\n  background-color: var(--color-green-12);\n}\n\n.u-bg-green-13 {\n  background-color: var(--color-green-13);\n}\n\n.u-bg-green-14 {\n  background-color: var(--color-green-14);\n}\n\n.u-bg-blue-01 {\n  background-color: var(--color-blue-01);\n}\n\n.u-bg-blue-02 {\n  background-color: var(--color-blue-02);\n}\n\n.u-bg-blue-03 {\n  background-color: var(--color-blue-03);\n}\n\n.u-bg-blue-04 {\n  background-color: var(--color-blue-04);\n}\n\n.u-bg-blue-05 {\n  background-color: var(--color-blue-05);\n}\n\n.u-bg-blue-06 {\n  background-color: var(--color-blue-06);\n}\n\n.u-bg-blue-07 {\n  background-color: var(--color-blue-07);\n}\n\n.u-bg-blue-08 {\n  background-color: var(--color-blue-08);\n}\n\n.u-bg-blue-09 {\n  background-color: var(--color-blue-09);\n}\n\n.u-bg-blue-10 {\n  background-color: var(--color-blue-10);\n}\n\n.u-bg-blue-11 {\n  background-color: var(--color-blue-11);\n}\n\n.u-bg-blue-12 {\n  background-color: var(--color-blue-12);\n}\n\n.u-bg-orange-01 {\n  background-color: var(--color-orange-01);\n}\n\n.u-bg-orange-02 {\n  background-color: var(--color-orange-02);\n}\n\n.u-bg-orange-03 {\n  background-color: var(--color-orange-03);\n}\n\n.u-bg-orange-04 {\n  background-color: var(--color-orange-04);\n}\n\n.u-bg-orange-05 {\n  background-color: var(--color-orange-05);\n}\n\n.u-bg-orange-06 {\n  background-color: var(--color-orange-06);\n}\n\n.u-bg-orange-07 {\n  background-color: var(--color-orange-07);\n}\n\n.u-bg-orange-08 {\n  background-color: var(--color-orange-08);\n}\n\n.u-bg-orange-09 {\n  background-color: var(--color-orange-09);\n}\n\n.u-bg-orange-10 {\n  background-color: var(--color-orange-10);\n}\n\n.u-bg-orange-11 {\n  background-color: var(--color-orange-11);\n}\n\n.u-bg-orange-12 {\n  background-color: var(--color-orange-12);\n}\n\n.u-bg-red-01 {\n  background-color: var(--color-red-01);\n}\n\n.u-bg-red-02 {\n  background-color: var(--color-red-02);\n}\n\n.u-bg-red-03 {\n  background-color: var(--color-red-03);\n}\n\n.u-bg-red-04 {\n  background-color: var(--color-red-04);\n}\n\n.u-bg-red-05 {\n  background-color: var(--color-red-05);\n}\n\n.u-bg-red-06 {\n  background-color: var(--color-red-06);\n}\n\n.u-bg-red-07 {\n  background-color: var(--color-red-07);\n}\n\n.u-bg-red-08 {\n  background-color: var(--color-red-08);\n}\n\n.u-bg-red-09 {\n  background-color: var(--color-red-09);\n}\n\n.u-bg-red-10 {\n  background-color: var(--color-red-10);\n}\n\n.u-bg-red-11 {\n  background-color: var(--color-red-11);\n}\n\n.u-bg-red-12 {\n  background-color: var(--color-red-12);\n}\n\n.u-bg-gray-01 {\n  background-color: var(--color-gray-01);\n}\n\n.u-bg-gray-02 {\n  background-color: var(--color-gray-02);\n}\n\n.u-bg-gray-03 {\n  background-color: var(--color-gray-03);\n}\n\n.u-bg-gray-04 {\n  background-color: var(--color-gray-04);\n}\n\n.u-bg-gray-05 {\n  background-color: var(--color-gray-05);\n}\n\n.u-bg-gray-06 {\n  background-color: var(--color-gray-06);\n}\n\n.u-bg-gray-07 {\n  background-color: var(--color-gray-07);\n}\n\n.u-bg-gray-08 {\n  background-color: var(--color-gray-08);\n}\n\n.u-bg-gray-09 {\n  background-color: var(--color-gray-09);\n}\n\n.u-bg-gray-10 {\n  background-color: var(--color-gray-10);\n}\n\n.u-bg-gray-11 {\n  background-color: var(--color-gray-11);\n}\n\n.u-bg-gray-12 {\n  background-color: var(--color-gray-12);\n}\n\n/*! tailwindcss v4.1.14 | MIT License | https://tailwindcss.com */\n@layer properties;\n.collapse {\n  visibility: collapse;\n}\n\n.invisible {\n  visibility: hidden;\n}\n\n.visible {\n  visibility: visible;\n}\n\n.absolute {\n  position: absolute;\n}\n\n.fixed {\n  position: fixed;\n}\n\n.relative {\n  position: relative;\n}\n\n.static {\n  position: static;\n}\n\n.sticky {\n  position: sticky;\n}\n\n.z-1 {\n  z-index: 1;\n}\n\n.z-2 {\n  z-index: 2;\n}\n\n.z-3 {\n  z-index: 3;\n}\n\n.z-99 {\n  z-index: 99;\n}\n\n.z-999 {\n  z-index: 999;\n}\n\n.z-auto {\n  z-index: auto;\n}\n\n.container {\n  width: 100%;\n}\n\n.block {\n  display: block;\n}\n\n.flex {\n  display: flex;\n}\n\n.hidden {\n  display: none;\n}\n\n.inline {\n  display: inline;\n}\n\n.inline-block {\n  display: inline-block;\n}\n\n.list-item {\n  display: list-item;\n}\n\n.table {\n  display: table;\n}\n\n.table-cell {\n  display: table-cell;\n}\n\n.table-row {\n  display: table-row;\n}\n\n.flex-shrink {\n  flex-shrink: 1;\n}\n\n.transform {\n  transform: var(--tw-rotate-x, ) var(--tw-rotate-y, ) var(--tw-rotate-z, ) var(--tw-skew-x, ) var(--tw-skew-y, );\n}\n\n.resize {\n  resize: both;\n}\n\n.flex-col {\n  flex-direction: column;\n}\n\n.truncate {\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n.overflow-x-hidden {\n  overflow-x: hidden;\n}\n\n.border {\n  border-style: var(--tw-border-style);\n  border-width: 1px;\n}\n\n.border-none {\n  --tw-border-style: none;\n  border-style: none;\n}\n\n.text-center {\n  text-align: center;\n}\n\n.text-ellipsis {\n  text-overflow: ellipsis;\n}\n\n.capitalize {\n  text-transform: capitalize;\n}\n\n.lowercase {\n  text-transform: lowercase;\n}\n\n.uppercase {\n  text-transform: uppercase;\n}\n\n.italic {\n  font-style: italic;\n}\n\n.underline {\n  text-decoration-line: underline;\n}\n\n.ring {\n  --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);\n  box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n}\n\n.outline {\n  outline-style: var(--tw-outline-style);\n  outline-width: 1px;\n}\n\n.grayscale {\n  --tw-grayscale: grayscale(100%);\n  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, );\n}\n\n.filter {\n  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, );\n}\n\n.backdrop-filter {\n  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, );\n}\n\n.transition {\n  transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, backdrop-filter, display, content-visibility, overlay, pointer-events;\n  transition-timing-function: var(--tw-ease, ease);\n  transition-duration: var(--tw-duration, 0s);\n}\n\n.select-all {\n  -webkit-user-select: all;\n  -moz-user-select: all;\n       user-select: all;\n}\n\n@property --tw-rotate-x {\n  syntax: \"*\";\n  inherits: false;\n}\n@property --tw-rotate-y {\n  syntax: \"*\";\n  inherits: false;\n}\n@property --tw-rotate-z {\n  syntax: \"*\";\n  inherits: false;\n}\n@property --tw-skew-x {\n  syntax: \"*\";\n  inherits: false;\n}\n@property --tw-skew-y {\n  syntax: \"*\";\n  inherits: false;\n}\n@property --tw-border-style {\n  syntax: \"*\";\n  inherits: false;\n  initial-value: solid;\n}\n@property --tw-shadow {\n  syntax: \"*\";\n  inherits: false;\n  initial-value: 0 0 rgba(0, 0, 0, 0);\n}\n@property --tw-shadow-color {\n  syntax: \"*\";\n  inherits: false;\n}\n@property --tw-shadow-alpha {\n  syntax: \"<percentage>\";\n  inherits: false;\n  initial-value: 100%;\n}\n@property --tw-inset-shadow {\n  syntax: \"*\";\n  inherits: false;\n  initial-value: 0 0 rgba(0, 0, 0, 0);\n}\n@property --tw-inset-shadow-color {\n  syntax: \"*\";\n  inherits: false;\n}\n@property --tw-inset-shadow-alpha {\n  syntax: \"<percentage>\";\n  inherits: false;\n  initial-value: 100%;\n}\n@property --tw-ring-color {\n  syntax: \"*\";\n  inherits: false;\n}\n@property --tw-ring-shadow {\n  syntax: \"*\";\n  inherits: false;\n  initial-value: 0 0 rgba(0, 0, 0, 0);\n}\n@property --tw-inset-ring-color {\n  syntax: \"*\";\n  inherits: false;\n}\n@property --tw-inset-ring-shadow {\n  syntax: \"*\";\n  inherits: false;\n  initial-value: 0 0 rgba(0, 0, 0, 0);\n}\n@property --tw-ring-inset {\n  syntax: \"*\";\n  inherits: false;\n}\n@property --tw-ring-offset-width {\n  syntax: \"<length>\";\n  inherits: false;\n  initial-value: 0px;\n}\n@property --tw-ring-offset-color {\n  syntax: \"*\";\n  inherits: false;\n  initial-value: #fff;\n}\n@property --tw-ring-offset-shadow {\n  syntax: \"*\";\n  inherits: false;\n  initial-value: 0 0 rgba(0, 0, 0, 0);\n}\n@property --tw-outline-style {\n  syntax: \"*\";\n  inherits: false;\n  initial-value: solid;\n}\n@property --tw-blur {\n  syntax: \"*\";\n  inherits: false;\n}\n@property --tw-brightness {\n  syntax: \"*\";\n  inherits: false;\n}\n@property --tw-contrast {\n  syntax: \"*\";\n  inherits: false;\n}\n@property --tw-grayscale {\n  syntax: \"*\";\n  inherits: false;\n}\n@property --tw-hue-rotate {\n  syntax: \"*\";\n  inherits: false;\n}\n@property --tw-invert {\n  syntax: \"*\";\n  inherits: false;\n}\n@property --tw-opacity {\n  syntax: \"*\";\n  inherits: false;\n}\n@property --tw-saturate {\n  syntax: \"*\";\n  inherits: false;\n}\n@property --tw-sepia {\n  syntax: \"*\";\n  inherits: false;\n}\n@property --tw-drop-shadow {\n  syntax: \"*\";\n  inherits: false;\n}\n@property --tw-drop-shadow-color {\n  syntax: \"*\";\n  inherits: false;\n}\n@property --tw-drop-shadow-alpha {\n  syntax: \"<percentage>\";\n  inherits: false;\n  initial-value: 100%;\n}\n@property --tw-drop-shadow-size {\n  syntax: \"*\";\n  inherits: false;\n}\n@property --tw-backdrop-blur {\n  syntax: \"*\";\n  inherits: false;\n}\n@property --tw-backdrop-brightness {\n  syntax: \"*\";\n  inherits: false;\n}\n@property --tw-backdrop-contrast {\n  syntax: \"*\";\n  inherits: false;\n}\n@property --tw-backdrop-grayscale {\n  syntax: \"*\";\n  inherits: false;\n}\n@property --tw-backdrop-hue-rotate {\n  syntax: \"*\";\n  inherits: false;\n}\n@property --tw-backdrop-invert {\n  syntax: \"*\";\n  inherits: false;\n}\n@property --tw-backdrop-opacity {\n  syntax: \"*\";\n  inherits: false;\n}\n@property --tw-backdrop-saturate {\n  syntax: \"*\";\n  inherits: false;\n}\n@property --tw-backdrop-sepia {\n  syntax: \"*\";\n  inherits: false;\n}\n@layer properties {\n  @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {\n    *, ::before, ::after, ::backdrop {\n      --tw-rotate-x: initial;\n      --tw-rotate-y: initial;\n      --tw-rotate-z: initial;\n      --tw-skew-x: initial;\n      --tw-skew-y: initial;\n      --tw-border-style: solid;\n      --tw-shadow: 0 0 #0000;\n      --tw-shadow-color: initial;\n      --tw-shadow-alpha: 100%;\n      --tw-inset-shadow: 0 0 #0000;\n      --tw-inset-shadow-color: initial;\n      --tw-inset-shadow-alpha: 100%;\n      --tw-ring-color: initial;\n      --tw-ring-shadow: 0 0 #0000;\n      --tw-inset-ring-color: initial;\n      --tw-inset-ring-shadow: 0 0 #0000;\n      --tw-ring-inset: initial;\n      --tw-ring-offset-width: 0px;\n      --tw-ring-offset-color: #fff;\n      --tw-ring-offset-shadow: 0 0 #0000;\n      --tw-outline-style: solid;\n      --tw-blur: initial;\n      --tw-brightness: initial;\n      --tw-contrast: initial;\n      --tw-grayscale: initial;\n      --tw-hue-rotate: initial;\n      --tw-invert: initial;\n      --tw-opacity: initial;\n      --tw-saturate: initial;\n      --tw-sepia: initial;\n      --tw-drop-shadow: initial;\n      --tw-drop-shadow-color: initial;\n      --tw-drop-shadow-alpha: 100%;\n      --tw-drop-shadow-size: initial;\n      --tw-backdrop-blur: initial;\n      --tw-backdrop-brightness: initial;\n      --tw-backdrop-contrast: initial;\n      --tw-backdrop-grayscale: initial;\n      --tw-backdrop-hue-rotate: initial;\n      --tw-backdrop-invert: initial;\n      --tw-backdrop-opacity: initial;\n      --tw-backdrop-saturate: initial;\n      --tw-backdrop-sepia: initial;\n    }\n  }\n}\n.markdown-section .table-wrapper h1,\n.markdown-section .table-wrapper h2,\n.markdown-section .table-wrapper h3,\n.markdown-section .table-wrapper h4,\n.markdown-section .table-wrapper p {\n  font-family: var(--ptc-font-latin);\n  color: var(--color-gray-10);\n  border: none;\n}\n.markdown-section .table-wrapper h1 {\n  font-size: var(--ptc-font-size-xxx-large);\n  font-weight: var(--ptc-font-weight-extrabold);\n  line-height: var(--ptc-line-height-densest);\n  margin-bottom: var(--ptc-element-spacing-03);\n}\n@media only screen and (min-width: 768px) {\n  .markdown-section .table-wrapper h1 {\n    font-size: var(--ptc-font-size-xxxx-large);\n  }\n}\n.markdown-section .table-wrapper .h1-special {\n  font-size: var(--ptc-font-size-medium);\n  font-weight: var(--ptc-font-weight-extrabold);\n  line-height: var(--ptc-line-height-densest);\n  margin-bottom: var(--ptc-element-spacing-01);\n}\n.markdown-section .table-wrapper h2 {\n  font-size: var(--ptc-font-size-x-large);\n  font-weight: var(--ptc-font-weight-extrabold);\n  line-height: var(--ptc-line-height-densest);\n  margin-bottom: var(--ptc-element-spacing-03);\n}\n@media only screen and (min-width: 768px) {\n  .markdown-section .table-wrapper h2 {\n    font-size: var(--ptc-font-size-xx-large);\n  }\n}\n.markdown-section .table-wrapper h3 {\n  font-size: var(--ptc-font-size-medium);\n  font-weight: var(--ptc-font-weight-bold);\n  line-height: var(--ptc-line-height-densest);\n  margin-bottom: var(--ptc-element-spacing-01);\n}\n@media only screen and (min-width: 768px) {\n  .markdown-section .table-wrapper h3 {\n    font-size: var(--ptc-font-size-large);\n  }\n}\n.markdown-section .table-wrapper h4 {\n  font-size: var(--ptc-font-size-small);\n  font-weight: var(--ptc-font-weight-bold);\n  line-height: var(--ptc-line-height-densest);\n  margin-bottom: var(--ptc-element-spacing-01);\n}\n@media only screen and (min-width: 768px) {\n  .markdown-section .table-wrapper h4 {\n    font-size: var(--ptc-font-size-medium);\n  }\n}\n.markdown-section .table-wrapper p {\n  color: var(--color-gray-10);\n  font-size: var(--ptc-font-size-small);\n  line-height: var(--ptc-line-height-p);\n  font-weight: var(--ptc-font-weight-regular);\n  margin-top: 0;\n  margin-bottom: var(--ptc-element-spacing-05);\n}\n.markdown-section .table-wrapper .p-large {\n  font-size: var(--ptc-font-size-small);\n  line-height: var(--ptc-line-height-p);\n  font-weight: var(--ptc-font-weight-regular);\n  margin-bottom: var(--ptc-element-spacing-05);\n}\n.markdown-section .table-wrapper .p-small {\n  font-size: var(--ptc-font-size-x-small);\n  line-height: var(--ptc-line-height-p);\n  font-weight: var(--ptc-font-weight-regular);\n  margin-bottom: var(--ptc-element-spacing-05);\n}\n.markdown-section .table-wrapper .p-x-small {\n  font-size: var(--ptc-font-size-xx-small);\n  line-height: var(--ptc-line-height-p);\n  font-weight: var(--ptc-font-weight-semibold);\n  margin-bottom: var(--ptc-element-spacing-05);\n}\n\n* {\n  box-sizing: border-box;\n}\n\n.ptc-background-wrapper {\n  height: 100%;\n  left: 0;\n  position: absolute;\n  top: 0;\n  width: 100%;\n  z-index: -1;\n}\n\n.ptc-image-container {\n  height: 100%;\n  width: auto;\n  position: relative;\n  box-shadow: var(--ptc-shadow-medium);\n}";
+
+const NAMESPACE = 'ptcw-design';
+const BUILD = /* ptcw-design */ { hydratedSelectorName: "hydrated", lazyLoad: false, slotRelocation: true, updatable: true};
+
+/*
+ Stencil Client Platform v4.38.0 | MIT Licensed | https://stenciljs.com
+ */
+var __defProp = Object.defineProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+
+// src/utils/constants.ts
+var SVG_NS = "http://www.w3.org/2000/svg";
+var HTML_NS = "http://www.w3.org/1999/xhtml";
+
+// src/utils/es2022-rewire-class-members.ts
+var reWireGetterSetter = (instance, hostRef) => {
+  var _a;
+  const cmpMeta = hostRef.$cmpMeta$;
+  const members = Object.entries((_a = cmpMeta.$members$) != null ? _a : {});
+  members.map(([memberName, [memberFlags]]) => {
+    if ((memberFlags & 31 /* Prop */ || memberFlags & 32 /* State */)) {
+      const ogValue = instance[memberName];
+      const ogDescriptor = getPropertyDescriptor(Object.getPrototypeOf(instance), memberName) || Object.getOwnPropertyDescriptor(instance, memberName);
+      if (ogDescriptor) {
+        Object.defineProperty(instance, memberName, {
+          get() {
+            return ogDescriptor.get.call(this);
+          },
+          set(newValue) {
+            ogDescriptor.set.call(this, newValue);
+          },
+          configurable: true,
+          enumerable: true
+        });
+      }
+      instance[memberName] = hostRef.$instanceValues$.has(memberName) ? hostRef.$instanceValues$.get(memberName) : ogValue;
+    }
+  });
+};
+function getPropertyDescriptor(obj, memberName) {
+  while (obj) {
+    const desc = Object.getOwnPropertyDescriptor(obj, memberName);
+    if (desc == null ? void 0 : desc.get) return desc;
+    obj = Object.getPrototypeOf(obj);
+  }
+  return void 0;
+}
+
+// src/client/client-host-ref.ts
+var getHostRef = (ref) => {
+  if (ref.__stencil__getHostRef) {
+    return ref.__stencil__getHostRef();
+  }
+  return void 0;
+};
+var registerHost = (hostElement, cmpMeta) => {
+  const hostRef = {
+    $flags$: 0,
+    $hostElement$: hostElement,
+    $cmpMeta$: cmpMeta,
+    $instanceValues$: /* @__PURE__ */ new Map(),
+    $serializerValues$: /* @__PURE__ */ new Map()
+  };
+  {
+    hostRef.$onReadyPromise$ = new Promise((r) => hostRef.$onReadyResolve$ = r);
+    hostElement["s-p"] = [];
+    hostElement["s-rc"] = [];
+  }
+  const ref = hostRef;
+  hostElement.__stencil__getHostRef = () => ref;
+  {
+    reWireGetterSetter(hostElement, hostRef);
+  }
+  return ref;
+};
+var isMemberInElement = (elm, memberName) => memberName in elm;
+var consoleError = (e, el) => (0, console.error)(e, el);
+
+// src/client/client-style.ts
+var styles = /* @__PURE__ */ new Map();
+var SLOT_FB_CSS = "slot-fb{display:contents}slot-fb[hidden]{display:none}";
+var XLINK_NS = "http://www.w3.org/1999/xlink";
+var win = typeof window !== "undefined" ? window : {};
+var H = win.HTMLElement || class {
+};
+var plt = {
+  $flags$: 0,
+  $resourcesUrl$: "",
+  jmp: (h2) => h2(),
+  raf: (h2) => requestAnimationFrame(h2),
+  ael: (el, eventName, listener, opts) => el.addEventListener(eventName, listener, opts),
+  rel: (el, eventName, listener, opts) => el.removeEventListener(eventName, listener, opts),
+  ce: (eventName, opts) => new CustomEvent(eventName, opts)
+};
+var supportsListenerOptions = /* @__PURE__ */ (() => {
+  var _a;
+  let supportsListenerOptions2 = false;
+  try {
+    (_a = win.document) == null ? void 0 : _a.addEventListener(
+      "e",
+      null,
+      Object.defineProperty({}, "passive", {
+        get() {
+          supportsListenerOptions2 = true;
+        }
+      })
+    );
+  } catch (e) {
+  }
+  return supportsListenerOptions2;
+})();
+var promiseResolve = (v) => Promise.resolve(v);
+var supportsConstructableStylesheets = /* @__PURE__ */ (() => {
+  try {
+    new CSSStyleSheet();
+    return typeof new CSSStyleSheet().replaceSync === "function";
+  } catch (e) {
+  }
+  return false;
+})() ;
+var supportsMutableAdoptedStyleSheets = supportsConstructableStylesheets ? /* @__PURE__ */ (() => !!win.document && Object.getOwnPropertyDescriptor(win.document.adoptedStyleSheets, "length").writable)() : false;
+var queuePending = false;
+var queueDomReads = [];
+var queueDomWrites = [];
+var queueTask = (queue, write) => (cb) => {
+  queue.push(cb);
+  if (!queuePending) {
+    queuePending = true;
+    if (write && plt.$flags$ & 4 /* queueSync */) {
+      nextTick(flush);
+    } else {
+      plt.raf(flush);
+    }
+  }
+};
+var consume = (queue) => {
+  for (let i2 = 0; i2 < queue.length; i2++) {
+    try {
+      queue[i2](performance.now());
+    } catch (e) {
+      consoleError(e);
+    }
+  }
+  queue.length = 0;
+};
+var flush = () => {
+  consume(queueDomReads);
+  {
+    consume(queueDomWrites);
+    if (queuePending = queueDomReads.length > 0) {
+      plt.raf(flush);
+    }
+  }
+};
+var nextTick = (cb) => promiseResolve().then(cb);
+var writeTask = /* @__PURE__ */ queueTask(queueDomWrites, true);
+
+// src/runtime/asset-path.ts
+var getAssetPath = (path) => {
+  const assetUrl = new URL(path, plt.$resourcesUrl$);
+  return assetUrl.origin !== win.location.origin ? assetUrl.href : assetUrl.pathname;
+};
+var setAssetPath = (path) => plt.$resourcesUrl$ = path;
+
+// src/utils/helpers.ts
+var isDef = (v) => v != null && v !== void 0;
+var isComplexType = (o) => {
+  o = typeof o;
+  return o === "object" || o === "function";
+};
+
+// src/utils/query-nonce-meta-tag-content.ts
+function queryNonceMetaTagContent(doc) {
+  var _a, _b, _c;
+  return (_c = (_b = (_a = doc.head) == null ? void 0 : _a.querySelector('meta[name="csp-nonce"]')) == null ? void 0 : _b.getAttribute("content")) != null ? _c : void 0;
+}
+
+// src/utils/regular-expression.ts
+var escapeRegExpSpecialCharacters = (text) => {
+  return text.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
+};
+
+// src/utils/result.ts
+var result_exports = {};
+__export(result_exports, {
+  err: () => err,
+  map: () => map,
+  ok: () => ok,
+  unwrap: () => unwrap,
+  unwrapErr: () => unwrapErr
+});
+var ok = (value) => ({
+  isOk: true,
+  isErr: false,
+  value
+});
+var err = (value) => ({
+  isOk: false,
+  isErr: true,
+  value
+});
+function map(result, fn) {
+  if (result.isOk) {
+    const val = fn(result.value);
+    if (val instanceof Promise) {
+      return val.then((newVal) => ok(newVal));
+    } else {
+      return ok(val);
+    }
+  }
+  if (result.isErr) {
+    const value = result.value;
+    return err(value);
+  }
+  throw "should never get here";
+}
+var unwrap = (result) => {
+  if (result.isOk) {
+    return result.value;
+  } else {
+    throw result.value;
+  }
+};
+var unwrapErr = (result) => {
+  if (result.isErr) {
+    return result.value;
+  } else {
+    throw result.value;
+  }
+};
+
+// src/utils/style.ts
+function createStyleSheetIfNeededAndSupported(styles2) {
+  if (!supportsConstructableStylesheets) return void 0;
+  const sheet = new CSSStyleSheet();
+  sheet.replaceSync(styles2);
+  return sheet;
+}
+
+// src/utils/shadow-root.ts
+var globalStyleSheet;
+function createShadowRoot(cmpMeta) {
+  var _a;
+  const shadowRoot = this.attachShadow({ mode: "open" });
+  if (globalStyleSheet === void 0) globalStyleSheet = (_a = createStyleSheetIfNeededAndSupported(globalStyles)) != null ? _a : null;
+  if (globalStyleSheet) {
+    if (supportsMutableAdoptedStyleSheets) {
+      shadowRoot.adoptedStyleSheets.push(globalStyleSheet);
+    } else {
+      shadowRoot.adoptedStyleSheets = [...shadowRoot.adoptedStyleSheets, globalStyleSheet];
+    }
+  }
+}
+var updateFallbackSlotVisibility = (elm) => {
+  const childNodes = internalCall(elm, "childNodes");
+  if (elm.tagName && elm.tagName.includes("-") && elm["s-cr"] && elm.tagName !== "SLOT-FB") {
+    getHostSlotNodes(childNodes, elm.tagName).forEach((slotNode) => {
+      if (slotNode.nodeType === 1 /* ElementNode */ && slotNode.tagName === "SLOT-FB") {
+        if (getSlotChildSiblings(slotNode, getSlotName(slotNode), false).length) {
+          slotNode.hidden = true;
+        } else {
+          slotNode.hidden = false;
+        }
+      }
+    });
+  }
+  let i2 = 0;
+  for (i2 = 0; i2 < childNodes.length; i2++) {
+    const childNode = childNodes[i2];
+    if (childNode.nodeType === 1 /* ElementNode */ && internalCall(childNode, "childNodes").length) {
+      updateFallbackSlotVisibility(childNode);
+    }
+  }
+};
+var getSlottedChildNodes = (childNodes) => {
+  const result = [];
+  for (let i2 = 0; i2 < childNodes.length; i2++) {
+    const slottedNode = childNodes[i2]["s-nr"] || void 0;
+    if (slottedNode && slottedNode.isConnected) {
+      result.push(slottedNode);
+    }
+  }
+  return result;
+};
+function getHostSlotNodes(childNodes, hostName, slotName) {
+  let i2 = 0;
+  let slottedNodes = [];
+  let childNode;
+  for (; i2 < childNodes.length; i2++) {
+    childNode = childNodes[i2];
+    if (childNode["s-sr"] && (!hostName || childNode["s-hn"] === hostName) && (slotName === void 0)) {
+      slottedNodes.push(childNode);
+    }
+    slottedNodes = [...slottedNodes, ...getHostSlotNodes(childNode.childNodes, hostName, slotName)];
+  }
+  return slottedNodes;
+}
+var getSlotChildSiblings = (slot, slotName, includeSlot = true) => {
+  const childNodes = [];
+  if (includeSlot && slot["s-sr"] || !slot["s-sr"]) childNodes.push(slot);
+  let node = slot;
+  while (node = node.nextSibling) {
+    if (getSlotName(node) === slotName && (includeSlot || !node["s-sr"])) childNodes.push(node);
+  }
+  return childNodes;
+};
+var isNodeLocatedInSlot = (nodeToRelocate, slotName) => {
+  if (nodeToRelocate.nodeType === 1 /* ElementNode */) {
+    if (nodeToRelocate.getAttribute("slot") === null && slotName === "") {
+      return true;
+    }
+    if (nodeToRelocate.getAttribute("slot") === slotName) {
+      return true;
+    }
+    return false;
+  }
+  if (nodeToRelocate["s-sn"] === slotName) {
+    return true;
+  }
+  return slotName === "";
+};
+var getSlotName = (node) => typeof node["s-sn"] === "string" ? node["s-sn"] : node.nodeType === 1 && node.getAttribute("slot") || void 0;
+function patchSlotNode(node) {
+  if (node.assignedElements || node.assignedNodes || !node["s-sr"]) return;
+  const assignedFactory = (elementsOnly) => (function(opts) {
+    const toReturn = [];
+    const slotName = this["s-sn"];
+    if (opts == null ? void 0 : opts.flatten) {
+      console.error(`
+          Flattening is not supported for Stencil non-shadow slots.
+          You can use \`.childNodes\` to nested slot fallback content.
+          If you have a particular use case, please open an issue on the Stencil repo.
+        `);
+    }
+    const parent = this["s-cr"].parentElement;
+    const slottedNodes = parent.__childNodes ? parent.childNodes : getSlottedChildNodes(parent.childNodes);
+    slottedNodes.forEach((n) => {
+      if (slotName === getSlotName(n)) {
+        toReturn.push(n);
+      }
+    });
+    if (elementsOnly) {
+      return toReturn.filter((n) => n.nodeType === 1 /* ElementNode */);
+    }
+    return toReturn;
+  }).bind(node);
+  node.assignedElements = assignedFactory(true);
+  node.assignedNodes = assignedFactory(false);
+}
+function internalCall(node, method) {
+  if ("__" + method in node) {
+    const toReturn = node["__" + method];
+    if (typeof toReturn !== "function") return toReturn;
+    return toReturn.bind(node);
+  } else {
+    if (typeof node[method] !== "function") return node[method];
+    return node[method].bind(node);
+  }
+}
+var createTime = (fnName, tagName = "") => {
+  {
+    return () => {
+      return;
+    };
+  }
+};
+var rootAppliedStyles = /* @__PURE__ */ new WeakMap();
+var registerStyle = (scopeId2, cssText, allowCS) => {
+  let style = styles.get(scopeId2);
+  if (supportsConstructableStylesheets && allowCS) {
+    style = style || new CSSStyleSheet();
+    if (typeof style === "string") {
+      style = cssText;
+    } else {
+      style.replaceSync(cssText);
+    }
+  } else {
+    style = cssText;
+  }
+  styles.set(scopeId2, style);
+};
+var addStyle = (styleContainerNode, cmpMeta, mode) => {
+  var _a;
+  const scopeId2 = getScopeId(cmpMeta);
+  const style = styles.get(scopeId2);
+  if (!win.document) {
+    return scopeId2;
+  }
+  styleContainerNode = styleContainerNode.nodeType === 11 /* DocumentFragment */ ? styleContainerNode : win.document;
+  if (style) {
+    if (typeof style === "string") {
+      styleContainerNode = styleContainerNode.head || styleContainerNode;
+      let appliedStyles = rootAppliedStyles.get(styleContainerNode);
+      let styleElm;
+      if (!appliedStyles) {
+        rootAppliedStyles.set(styleContainerNode, appliedStyles = /* @__PURE__ */ new Set());
+      }
+      if (!appliedStyles.has(scopeId2)) {
+        {
+          styleElm = win.document.createElement("style");
+          styleElm.innerHTML = style;
+          const nonce = (_a = plt.$nonce$) != null ? _a : queryNonceMetaTagContent(win.document);
+          if (nonce != null) {
+            styleElm.setAttribute("nonce", nonce);
+          }
+          if (!(cmpMeta.$flags$ & 1 /* shadowDomEncapsulation */)) {
+            if (styleContainerNode.nodeName === "HEAD") {
+              const preconnectLinks = styleContainerNode.querySelectorAll("link[rel=preconnect]");
+              const referenceNode2 = preconnectLinks.length > 0 ? preconnectLinks[preconnectLinks.length - 1].nextSibling : styleContainerNode.querySelector("style");
+              styleContainerNode.insertBefore(
+                styleElm,
+                (referenceNode2 == null ? void 0 : referenceNode2.parentNode) === styleContainerNode ? referenceNode2 : null
+              );
+            } else if ("host" in styleContainerNode) {
+              if (supportsConstructableStylesheets) {
+                const stylesheet = new CSSStyleSheet();
+                stylesheet.replaceSync(style);
+                if (supportsMutableAdoptedStyleSheets) {
+                  styleContainerNode.adoptedStyleSheets.unshift(stylesheet);
+                } else {
+                  styleContainerNode.adoptedStyleSheets = [stylesheet, ...styleContainerNode.adoptedStyleSheets];
+                }
+              } else {
+                const existingStyleContainer = styleContainerNode.querySelector("style");
+                if (existingStyleContainer) {
+                  existingStyleContainer.innerHTML = style + existingStyleContainer.innerHTML;
+                } else {
+                  styleContainerNode.prepend(styleElm);
+                }
+              }
+            } else {
+              styleContainerNode.append(styleElm);
+            }
+          }
+          if (cmpMeta.$flags$ & 1 /* shadowDomEncapsulation */) {
+            styleContainerNode.insertBefore(styleElm, null);
+          }
+        }
+        if (cmpMeta.$flags$ & 4 /* hasSlotRelocation */) {
+          styleElm.innerHTML += SLOT_FB_CSS;
+        }
+        if (appliedStyles) {
+          appliedStyles.add(scopeId2);
+        }
+      }
+    } else if (!styleContainerNode.adoptedStyleSheets.includes(style)) {
+      if (supportsMutableAdoptedStyleSheets) {
+        styleContainerNode.adoptedStyleSheets.push(style);
+      } else {
+        styleContainerNode.adoptedStyleSheets = [...styleContainerNode.adoptedStyleSheets, style];
+      }
+    }
+  }
+  return scopeId2;
+};
+var attachStyles = (hostRef) => {
+  const cmpMeta = hostRef.$cmpMeta$;
+  const elm = hostRef.$hostElement$;
+  const flags = cmpMeta.$flags$;
+  const endAttachStyles = createTime("attachStyles", cmpMeta.$tagName$);
+  const scopeId2 = addStyle(
+    elm.shadowRoot ? elm.shadowRoot : elm.getRootNode(),
+    cmpMeta);
+  if (flags & 10 /* needsScopedEncapsulation */) {
+    elm["s-sc"] = scopeId2;
+    elm.classList.add(scopeId2 + "-h");
+  }
+  endAttachStyles();
+};
+var getScopeId = (cmp, mode) => "sc-" + (cmp.$tagName$);
+var h = (nodeName, vnodeData, ...children) => {
+  let child = null;
+  let key = null;
+  let slotName = null;
+  let simple = false;
+  let lastSimple = false;
+  const vNodeChildren = [];
+  const walk = (c) => {
+    for (let i2 = 0; i2 < c.length; i2++) {
+      child = c[i2];
+      if (Array.isArray(child)) {
+        walk(child);
+      } else if (child != null && typeof child !== "boolean") {
+        if (simple = typeof nodeName !== "function" && !isComplexType(child)) {
+          child = String(child);
+        }
+        if (simple && lastSimple) {
+          vNodeChildren[vNodeChildren.length - 1].$text$ += child;
+        } else {
+          vNodeChildren.push(simple ? newVNode(null, child) : child);
+        }
+        lastSimple = simple;
+      }
+    }
+  };
+  walk(children);
+  if (vnodeData) {
+    if (vnodeData.key) {
+      key = vnodeData.key;
+    }
+    if (vnodeData.name) {
+      slotName = vnodeData.name;
+    }
+    {
+      const classData = vnodeData.className || vnodeData.class;
+      if (classData) {
+        vnodeData.class = typeof classData !== "object" ? classData : Object.keys(classData).filter((k) => classData[k]).join(" ");
+      }
+    }
+  }
+  if (typeof nodeName === "function") {
+    return nodeName(
+      vnodeData === null ? {} : vnodeData,
+      vNodeChildren,
+      vdomFnUtils
+    );
+  }
+  const vnode = newVNode(nodeName, null);
+  vnode.$attrs$ = vnodeData;
+  if (vNodeChildren.length > 0) {
+    vnode.$children$ = vNodeChildren;
+  }
+  {
+    vnode.$key$ = key;
+  }
+  {
+    vnode.$name$ = slotName;
+  }
+  return vnode;
+};
+var newVNode = (tag, text) => {
+  const vnode = {
+    $flags$: 0,
+    $tag$: tag,
+    $text$: text,
+    $elm$: null,
+    $children$: null
+  };
+  {
+    vnode.$attrs$ = null;
+  }
+  {
+    vnode.$key$ = null;
+  }
+  {
+    vnode.$name$ = null;
+  }
+  return vnode;
+};
+var Host = {};
+var isHost = (node) => node && node.$tag$ === Host;
+var vdomFnUtils = {
+  forEach: (children, cb) => children.map(convertToPublic).forEach(cb),
+  map: (children, cb) => children.map(convertToPublic).map(cb).map(convertToPrivate)
+};
+var convertToPublic = (node) => ({
+  vattrs: node.$attrs$,
+  vchildren: node.$children$,
+  vkey: node.$key$,
+  vname: node.$name$,
+  vtag: node.$tag$,
+  vtext: node.$text$
+});
+var convertToPrivate = (node) => {
+  if (typeof node.vtag === "function") {
+    const vnodeData = { ...node.vattrs };
+    if (node.vkey) {
+      vnodeData.key = node.vkey;
+    }
+    if (node.vname) {
+      vnodeData.name = node.vname;
+    }
+    return h(node.vtag, vnodeData, ...node.vchildren || []);
+  }
+  const vnode = newVNode(node.vtag, node.vtext);
+  vnode.$attrs$ = node.vattrs;
+  vnode.$children$ = node.vchildren;
+  vnode.$key$ = node.vkey;
+  vnode.$name$ = node.vname;
+  return vnode;
+};
+var createSupportsRuleRe = (selector) => {
+  const safeSelector2 = escapeRegExpSpecialCharacters(selector);
+  return new RegExp(
+    // First capture group: match any context before the selector that's not inside @supports selector()
+    // Using negative lookahead to avoid matching inside @supports selector(...) condition
+    `(^|[^@]|@(?!supports\\s+selector\\s*\\([^{]*?${safeSelector2}))(${safeSelector2}\\b)`,
+    "g"
+  );
+};
+createSupportsRuleRe("::slotted");
+createSupportsRuleRe(":host");
+createSupportsRuleRe(":host-context");
+var parsePropertyValue = (propValue, propType, isFormAssociated) => {
+  if (propValue != null && !isComplexType(propValue)) {
+    if (propType & 4 /* Boolean */) {
+      {
+        return propValue === "false" ? false : propValue === "" || !!propValue;
+      }
+    }
+    if (propType & 2 /* Number */) {
+      return typeof propValue === "string" ? parseFloat(propValue) : typeof propValue === "number" ? propValue : NaN;
+    }
+    if (propType & 1 /* String */) {
+      return String(propValue);
+    }
+    return propValue;
+  }
+  return propValue;
+};
+var getElement = (ref) => {
+  return ref;
+};
+
+// src/runtime/event-emitter.ts
+var createEvent = (ref, name, flags) => {
+  const elm = getElement(ref);
+  return {
+    emit: (detail) => {
+      return emitEvent(elm, name, {
+        bubbles: true,
+        composed: true,
+        cancelable: true,
+        detail
+      });
+    }
+  };
+};
+var emitEvent = (elm, name, opts) => {
+  const ev = plt.ce(name, opts);
+  elm.dispatchEvent(ev);
+  return ev;
+};
+var setAccessor = (elm, memberName, oldValue, newValue, isSvg, flags, initialRender) => {
+  if (oldValue === newValue) {
+    return;
+  }
+  let isProp = isMemberInElement(elm, memberName);
+  let ln = memberName.toLowerCase();
+  if (memberName === "class") {
+    const classList = elm.classList;
+    const oldClasses = parseClassList(oldValue);
+    let newClasses = parseClassList(newValue);
+    {
+      classList.remove(...oldClasses.filter((c) => c && !newClasses.includes(c)));
+      classList.add(...newClasses.filter((c) => c && !oldClasses.includes(c)));
+    }
+  } else if (memberName === "style") {
+    {
+      for (const prop in oldValue) {
+        if (!newValue || newValue[prop] == null) {
+          if (prop.includes("-")) {
+            elm.style.removeProperty(prop);
+          } else {
+            elm.style[prop] = "";
+          }
+        }
+      }
+    }
+    for (const prop in newValue) {
+      if (!oldValue || newValue[prop] !== oldValue[prop]) {
+        if (prop.includes("-")) {
+          elm.style.setProperty(prop, newValue[prop]);
+        } else {
+          elm.style[prop] = newValue[prop];
+        }
+      }
+    }
+  } else if (memberName === "key") ; else if (memberName === "ref") {
+    if (newValue) {
+      newValue(elm);
+    }
+  } else if ((!elm.__lookupSetter__(memberName)) && memberName[0] === "o" && memberName[1] === "n") {
+    if (memberName[2] === "-") {
+      memberName = memberName.slice(3);
+    } else if (isMemberInElement(win, ln)) {
+      memberName = ln.slice(2);
+    } else {
+      memberName = ln[2] + memberName.slice(3);
+    }
+    if (oldValue || newValue) {
+      const capture = memberName.endsWith(CAPTURE_EVENT_SUFFIX);
+      memberName = memberName.replace(CAPTURE_EVENT_REGEX, "");
+      if (oldValue) {
+        plt.rel(elm, memberName, oldValue, capture);
+      }
+      if (newValue) {
+        plt.ael(elm, memberName, newValue, capture);
+      }
+    }
+  } else {
+    const isComplex = isComplexType(newValue);
+    if ((isProp || isComplex && newValue !== null) && !isSvg) {
+      try {
+        if (!elm.tagName.includes("-")) {
+          const n = newValue == null ? "" : newValue;
+          if (memberName === "list") {
+            isProp = false;
+          } else if (oldValue == null || elm[memberName] != n) {
+            if (typeof elm.__lookupSetter__(memberName) === "function") {
+              elm[memberName] = n;
+            } else {
+              elm.setAttribute(memberName, n);
+            }
+          }
+        } else if (elm[memberName] !== newValue) {
+          elm[memberName] = newValue;
+        }
+      } catch (e) {
+      }
+    }
+    let xlink = false;
+    {
+      if (ln !== (ln = ln.replace(/^xlink\:?/, ""))) {
+        memberName = ln;
+        xlink = true;
+      }
+    }
+    if (newValue == null || newValue === false) {
+      if (newValue !== false || elm.getAttribute(memberName) === "") {
+        if (xlink) {
+          elm.removeAttributeNS(XLINK_NS, memberName);
+        } else {
+          elm.removeAttribute(memberName);
+        }
+      }
+    } else if ((!isProp || flags & 4 /* isHost */ || isSvg) && !isComplex && elm.nodeType === 1 /* ElementNode */) {
+      newValue = newValue === true ? "" : newValue;
+      if (xlink) {
+        elm.setAttributeNS(XLINK_NS, memberName, newValue);
+      } else {
+        elm.setAttribute(memberName, newValue);
+      }
+    }
+  }
+};
+var parseClassListRegex = /\s/;
+var parseClassList = (value) => {
+  if (typeof value === "object" && value && "baseVal" in value) {
+    value = value.baseVal;
+  }
+  if (!value || typeof value !== "string") {
+    return [];
+  }
+  return value.split(parseClassListRegex);
+};
+var CAPTURE_EVENT_SUFFIX = "Capture";
+var CAPTURE_EVENT_REGEX = new RegExp(CAPTURE_EVENT_SUFFIX + "$");
+
+// src/runtime/vdom/update-element.ts
+var updateElement = (oldVnode, newVnode, isSvgMode2, isInitialRender) => {
+  const elm = newVnode.$elm$.nodeType === 11 /* DocumentFragment */ && newVnode.$elm$.host ? newVnode.$elm$.host : newVnode.$elm$;
+  const oldVnodeAttrs = oldVnode && oldVnode.$attrs$ || {};
+  const newVnodeAttrs = newVnode.$attrs$ || {};
+  {
+    for (const memberName of sortedAttrNames(Object.keys(oldVnodeAttrs))) {
+      if (!(memberName in newVnodeAttrs)) {
+        setAccessor(
+          elm,
+          memberName,
+          oldVnodeAttrs[memberName],
+          void 0,
+          isSvgMode2,
+          newVnode.$flags$);
+      }
+    }
+  }
+  for (const memberName of sortedAttrNames(Object.keys(newVnodeAttrs))) {
+    setAccessor(
+      elm,
+      memberName,
+      oldVnodeAttrs[memberName],
+      newVnodeAttrs[memberName],
+      isSvgMode2,
+      newVnode.$flags$);
+  }
+};
+function sortedAttrNames(attrNames) {
+  return attrNames.includes("ref") ? (
+    // we need to sort these to ensure that `'ref'` is the last attr
+    [...attrNames.filter((attr) => attr !== "ref"), "ref"]
+  ) : (
+    // no need to sort, return the original array
+    attrNames
+  );
+}
+
+// src/runtime/vdom/vdom-render.ts
+var scopeId;
+var contentRef;
+var hostTagName;
+var useNativeShadowDom = false;
+var checkSlotFallbackVisibility = false;
+var checkSlotRelocate = false;
+var isSvgMode = false;
+var createElm = (oldParentVNode, newParentVNode, childIndex) => {
+  var _a;
+  const newVNode2 = newParentVNode.$children$[childIndex];
+  let i2 = 0;
+  let elm;
+  let childNode;
+  let oldVNode;
+  if (!useNativeShadowDom) {
+    checkSlotRelocate = true;
+    if (newVNode2.$tag$ === "slot") {
+      newVNode2.$flags$ |= newVNode2.$children$ ? (
+        // slot element has fallback content
+        // still create an element that "mocks" the slot element
+        2 /* isSlotFallback */
+      ) : (
+        // slot element does not have fallback content
+        // create an html comment we'll use to always reference
+        // where actual slot content should sit next to
+        1 /* isSlotReference */
+      );
+    }
+  }
+  if (newVNode2.$text$ !== null) {
+    elm = newVNode2.$elm$ = win.document.createTextNode(newVNode2.$text$);
+  } else if (newVNode2.$flags$ & 1 /* isSlotReference */) {
+    elm = newVNode2.$elm$ = win.document.createTextNode("");
+    {
+      updateElement(null, newVNode2, isSvgMode);
+    }
+  } else {
+    if (!isSvgMode) {
+      isSvgMode = newVNode2.$tag$ === "svg";
+    }
+    if (!win.document) {
+      throw new Error(
+        "You are trying to render a Stencil component in an environment that doesn't support the DOM. Make sure to populate the [`window`](https://developer.mozilla.org/en-US/docs/Web/API/Window/window) object before rendering a component."
+      );
+    }
+    elm = newVNode2.$elm$ = win.document.createElementNS(
+      isSvgMode ? SVG_NS : HTML_NS,
+      !useNativeShadowDom && BUILD.slotRelocation && newVNode2.$flags$ & 2 /* isSlotFallback */ ? "slot-fb" : newVNode2.$tag$
+    ) ;
+    if (isSvgMode && newVNode2.$tag$ === "foreignObject") {
+      isSvgMode = false;
+    }
+    {
+      updateElement(null, newVNode2, isSvgMode);
+    }
+    if (isDef(scopeId) && elm["s-si"] !== scopeId) {
+      elm.classList.add(elm["s-si"] = scopeId);
+    }
+    if (newVNode2.$children$) {
+      for (i2 = 0; i2 < newVNode2.$children$.length; ++i2) {
+        childNode = createElm(oldParentVNode, newVNode2, i2);
+        if (childNode) {
+          elm.appendChild(childNode);
+        }
+      }
+    }
+    {
+      if (newVNode2.$tag$ === "svg") {
+        isSvgMode = false;
+      } else if (elm.tagName === "foreignObject") {
+        isSvgMode = true;
+      }
+    }
+  }
+  elm["s-hn"] = hostTagName;
+  {
+    if (newVNode2.$flags$ & (2 /* isSlotFallback */ | 1 /* isSlotReference */)) {
+      elm["s-sr"] = true;
+      elm["s-cr"] = contentRef;
+      elm["s-sn"] = newVNode2.$name$ || "";
+      elm["s-rf"] = (_a = newVNode2.$attrs$) == null ? void 0 : _a.ref;
+      patchSlotNode(elm);
+      oldVNode = oldParentVNode && oldParentVNode.$children$ && oldParentVNode.$children$[childIndex];
+      if (oldVNode && oldVNode.$tag$ === newVNode2.$tag$ && oldParentVNode.$elm$) {
+        {
+          putBackInOriginalLocation(oldParentVNode.$elm$, false);
+        }
+      }
+      {
+        addRemoveSlotScopedClass(contentRef, elm, newParentVNode.$elm$, oldParentVNode == null ? void 0 : oldParentVNode.$elm$);
+      }
+    }
+  }
+  return elm;
+};
+var putBackInOriginalLocation = (parentElm, recursive) => {
+  plt.$flags$ |= 1 /* isTmpDisconnected */;
+  const oldSlotChildNodes = Array.from(parentElm.__childNodes || parentElm.childNodes);
+  for (let i2 = oldSlotChildNodes.length - 1; i2 >= 0; i2--) {
+    const childNode = oldSlotChildNodes[i2];
+    if (childNode["s-hn"] !== hostTagName && childNode["s-ol"]) {
+      insertBefore(referenceNode(childNode).parentNode, childNode, referenceNode(childNode));
+      childNode["s-ol"].remove();
+      childNode["s-ol"] = void 0;
+      childNode["s-sh"] = void 0;
+      checkSlotRelocate = true;
+    }
+    if (recursive) {
+      putBackInOriginalLocation(childNode, recursive);
+    }
+  }
+  plt.$flags$ &= -2 /* isTmpDisconnected */;
+};
+var addVnodes = (parentElm, before, parentVNode, vnodes, startIdx, endIdx) => {
+  let containerElm = parentElm["s-cr"] && parentElm["s-cr"].parentNode || parentElm;
+  let childNode;
+  if (containerElm.shadowRoot && containerElm.tagName === hostTagName) {
+    containerElm = containerElm.shadowRoot;
+  }
+  for (; startIdx <= endIdx; ++startIdx) {
+    if (vnodes[startIdx]) {
+      childNode = createElm(null, parentVNode, startIdx);
+      if (childNode) {
+        vnodes[startIdx].$elm$ = childNode;
+        insertBefore(containerElm, childNode, referenceNode(before) );
+      }
+    }
+  }
+};
+var removeVnodes = (vnodes, startIdx, endIdx) => {
+  for (let index = startIdx; index <= endIdx; ++index) {
+    const vnode = vnodes[index];
+    if (vnode) {
+      const elm = vnode.$elm$;
+      nullifyVNodeRefs(vnode);
+      if (elm) {
+        {
+          checkSlotFallbackVisibility = true;
+          if (elm["s-ol"]) {
+            elm["s-ol"].remove();
+          } else {
+            putBackInOriginalLocation(elm, true);
+          }
+        }
+        elm.remove();
+      }
+    }
+  }
+};
+var updateChildren = (parentElm, oldCh, newVNode2, newCh, isInitialRender = false) => {
+  let oldStartIdx = 0;
+  let newStartIdx = 0;
+  let idxInOld = 0;
+  let i2 = 0;
+  let oldEndIdx = oldCh.length - 1;
+  let oldStartVnode = oldCh[0];
+  let oldEndVnode = oldCh[oldEndIdx];
+  let newEndIdx = newCh.length - 1;
+  let newStartVnode = newCh[0];
+  let newEndVnode = newCh[newEndIdx];
+  let node;
+  let elmToMove;
+  while (oldStartIdx <= oldEndIdx && newStartIdx <= newEndIdx) {
+    if (oldStartVnode == null) {
+      oldStartVnode = oldCh[++oldStartIdx];
+    } else if (oldEndVnode == null) {
+      oldEndVnode = oldCh[--oldEndIdx];
+    } else if (newStartVnode == null) {
+      newStartVnode = newCh[++newStartIdx];
+    } else if (newEndVnode == null) {
+      newEndVnode = newCh[--newEndIdx];
+    } else if (isSameVnode(oldStartVnode, newStartVnode, isInitialRender)) {
+      patch(oldStartVnode, newStartVnode, isInitialRender);
+      oldStartVnode = oldCh[++oldStartIdx];
+      newStartVnode = newCh[++newStartIdx];
+    } else if (isSameVnode(oldEndVnode, newEndVnode, isInitialRender)) {
+      patch(oldEndVnode, newEndVnode, isInitialRender);
+      oldEndVnode = oldCh[--oldEndIdx];
+      newEndVnode = newCh[--newEndIdx];
+    } else if (isSameVnode(oldStartVnode, newEndVnode, isInitialRender)) {
+      if ((oldStartVnode.$tag$ === "slot" || newEndVnode.$tag$ === "slot")) {
+        putBackInOriginalLocation(oldStartVnode.$elm$.parentNode, false);
+      }
+      patch(oldStartVnode, newEndVnode, isInitialRender);
+      insertBefore(parentElm, oldStartVnode.$elm$, oldEndVnode.$elm$.nextSibling);
+      oldStartVnode = oldCh[++oldStartIdx];
+      newEndVnode = newCh[--newEndIdx];
+    } else if (isSameVnode(oldEndVnode, newStartVnode, isInitialRender)) {
+      if ((oldStartVnode.$tag$ === "slot" || newEndVnode.$tag$ === "slot")) {
+        putBackInOriginalLocation(oldEndVnode.$elm$.parentNode, false);
+      }
+      patch(oldEndVnode, newStartVnode, isInitialRender);
+      insertBefore(parentElm, oldEndVnode.$elm$, oldStartVnode.$elm$);
+      oldEndVnode = oldCh[--oldEndIdx];
+      newStartVnode = newCh[++newStartIdx];
+    } else {
+      idxInOld = -1;
+      {
+        for (i2 = oldStartIdx; i2 <= oldEndIdx; ++i2) {
+          if (oldCh[i2] && oldCh[i2].$key$ !== null && oldCh[i2].$key$ === newStartVnode.$key$) {
+            idxInOld = i2;
+            break;
+          }
+        }
+      }
+      if (idxInOld >= 0) {
+        elmToMove = oldCh[idxInOld];
+        if (elmToMove.$tag$ !== newStartVnode.$tag$) {
+          node = createElm(oldCh && oldCh[newStartIdx], newVNode2, idxInOld);
+        } else {
+          patch(elmToMove, newStartVnode, isInitialRender);
+          oldCh[idxInOld] = void 0;
+          node = elmToMove.$elm$;
+        }
+        newStartVnode = newCh[++newStartIdx];
+      } else {
+        node = createElm(oldCh && oldCh[newStartIdx], newVNode2, newStartIdx);
+        newStartVnode = newCh[++newStartIdx];
+      }
+      if (node) {
+        {
+          insertBefore(
+            referenceNode(oldStartVnode.$elm$).parentNode,
+            node,
+            referenceNode(oldStartVnode.$elm$)
+          );
+        }
+      }
+    }
+  }
+  if (oldStartIdx > oldEndIdx) {
+    addVnodes(
+      parentElm,
+      newCh[newEndIdx + 1] == null ? null : newCh[newEndIdx + 1].$elm$,
+      newVNode2,
+      newCh,
+      newStartIdx,
+      newEndIdx
+    );
+  } else if (newStartIdx > newEndIdx) {
+    removeVnodes(oldCh, oldStartIdx, oldEndIdx);
+  }
+};
+var isSameVnode = (leftVNode, rightVNode, isInitialRender = false) => {
+  if (leftVNode.$tag$ === rightVNode.$tag$) {
+    if (leftVNode.$tag$ === "slot") {
+      return leftVNode.$name$ === rightVNode.$name$;
+    }
+    if (!isInitialRender) {
+      return leftVNode.$key$ === rightVNode.$key$;
+    }
+    if (isInitialRender && !leftVNode.$key$ && rightVNode.$key$) {
+      leftVNode.$key$ = rightVNode.$key$;
+    }
+    return true;
+  }
+  return false;
+};
+var referenceNode = (node) => node && node["s-ol"] || node;
+var patch = (oldVNode, newVNode2, isInitialRender = false) => {
+  const elm = newVNode2.$elm$ = oldVNode.$elm$;
+  const oldChildren = oldVNode.$children$;
+  const newChildren = newVNode2.$children$;
+  const tag = newVNode2.$tag$;
+  const text = newVNode2.$text$;
+  let defaultHolder;
+  if (text === null) {
+    {
+      isSvgMode = tag === "svg" ? true : tag === "foreignObject" ? false : isSvgMode;
+    }
+    {
+      updateElement(oldVNode, newVNode2, isSvgMode);
+    }
+    if (oldChildren !== null && newChildren !== null) {
+      updateChildren(elm, oldChildren, newVNode2, newChildren, isInitialRender);
+    } else if (newChildren !== null) {
+      if (oldVNode.$text$ !== null) {
+        elm.textContent = "";
+      }
+      addVnodes(elm, null, newVNode2, newChildren, 0, newChildren.length - 1);
+    } else if (
+      // don't do this on initial render as it can cause non-hydrated content to be removed
+      !isInitialRender && BUILD.updatable && oldChildren !== null
+    ) {
+      removeVnodes(oldChildren, 0, oldChildren.length - 1);
+    } else ;
+    if (isSvgMode && tag === "svg") {
+      isSvgMode = false;
+    }
+  } else if ((defaultHolder = elm["s-cr"])) {
+    defaultHolder.parentNode.textContent = text;
+  } else if (oldVNode.$text$ !== text) {
+    elm.data = text;
+  }
+};
+var relocateNodes = [];
+var markSlotContentForRelocation = (elm) => {
+  let node;
+  let hostContentNodes;
+  let j;
+  const children = elm.__childNodes || elm.childNodes;
+  for (const childNode of children) {
+    if (childNode["s-sr"] && (node = childNode["s-cr"]) && node.parentNode) {
+      hostContentNodes = node.parentNode.__childNodes || node.parentNode.childNodes;
+      const slotName = childNode["s-sn"];
+      for (j = hostContentNodes.length - 1; j >= 0; j--) {
+        node = hostContentNodes[j];
+        if (!node["s-cn"] && !node["s-nr"] && node["s-hn"] !== childNode["s-hn"] && (true)) {
+          if (isNodeLocatedInSlot(node, slotName)) {
+            let relocateNodeData = relocateNodes.find((r) => r.$nodeToRelocate$ === node);
+            checkSlotFallbackVisibility = true;
+            node["s-sn"] = node["s-sn"] || slotName;
+            if (relocateNodeData) {
+              relocateNodeData.$nodeToRelocate$["s-sh"] = childNode["s-hn"];
+              relocateNodeData.$slotRefNode$ = childNode;
+            } else {
+              node["s-sh"] = childNode["s-hn"];
+              relocateNodes.push({
+                $slotRefNode$: childNode,
+                $nodeToRelocate$: node
+              });
+            }
+            if (node["s-sr"]) {
+              relocateNodes.map((relocateNode) => {
+                if (isNodeLocatedInSlot(relocateNode.$nodeToRelocate$, node["s-sn"])) {
+                  relocateNodeData = relocateNodes.find((r) => r.$nodeToRelocate$ === node);
+                  if (relocateNodeData && !relocateNode.$slotRefNode$) {
+                    relocateNode.$slotRefNode$ = relocateNodeData.$slotRefNode$;
+                  }
+                }
+              });
+            }
+          } else if (!relocateNodes.some((r) => r.$nodeToRelocate$ === node)) {
+            relocateNodes.push({
+              $nodeToRelocate$: node
+            });
+          }
+        }
+      }
+    }
+    if (childNode.nodeType === 1 /* ElementNode */) {
+      markSlotContentForRelocation(childNode);
+    }
+  }
+};
+var nullifyVNodeRefs = (vNode) => {
+  {
+    vNode.$attrs$ && vNode.$attrs$.ref && vNode.$attrs$.ref(null);
+    vNode.$children$ && vNode.$children$.map(nullifyVNodeRefs);
+  }
+};
+var insertBefore = (parent, newNode, reference) => {
+  if (typeof newNode["s-sn"] === "string" && !!newNode["s-sr"] && !!newNode["s-cr"]) {
+    addRemoveSlotScopedClass(newNode["s-cr"], newNode, parent, newNode.parentElement);
+  }
+  {
+    return parent == null ? void 0 : parent.insertBefore(newNode, reference);
+  }
+};
+function addRemoveSlotScopedClass(reference, slotNode, newParent, oldParent) {
+  var _a, _b;
+  let scopeId2;
+  if (reference && typeof slotNode["s-sn"] === "string" && !!slotNode["s-sr"] && reference.parentNode && reference.parentNode["s-sc"] && (scopeId2 = slotNode["s-si"] || reference.parentNode["s-sc"])) {
+    const scopeName = slotNode["s-sn"];
+    const hostName = slotNode["s-hn"];
+    (_a = newParent.classList) == null ? void 0 : _a.add(scopeId2 + "-s");
+    if (oldParent && ((_b = oldParent.classList) == null ? void 0 : _b.contains(scopeId2 + "-s"))) {
+      let child = (oldParent.__childNodes || oldParent.childNodes)[0];
+      let found = false;
+      while (child) {
+        if (child["s-sn"] !== scopeName && child["s-hn"] === hostName && !!child["s-sr"]) {
+          found = true;
+          break;
+        }
+        child = child.nextSibling;
+      }
+      if (!found) oldParent.classList.remove(scopeId2 + "-s");
+    }
+  }
+}
+var renderVdom = (hostRef, renderFnResults, isInitialLoad = false) => {
+  var _a, _b, _c, _d;
+  const hostElm = hostRef.$hostElement$;
+  const cmpMeta = hostRef.$cmpMeta$;
+  const oldVNode = hostRef.$vnode$ || newVNode(null, null);
+  const isHostElement = isHost(renderFnResults);
+  const rootVnode = isHostElement ? renderFnResults : h(null, null, renderFnResults);
+  hostTagName = hostElm.tagName;
+  if (cmpMeta.$attrsToReflect$) {
+    rootVnode.$attrs$ = rootVnode.$attrs$ || {};
+    cmpMeta.$attrsToReflect$.forEach(([propName, attribute]) => {
+      {
+        rootVnode.$attrs$[attribute] = hostElm[propName];
+      }
+    });
+  }
+  if (isInitialLoad && rootVnode.$attrs$) {
+    for (const key of Object.keys(rootVnode.$attrs$)) {
+      if (hostElm.hasAttribute(key) && !["key", "ref", "style", "class"].includes(key)) {
+        rootVnode.$attrs$[key] = hostElm[key];
+      }
+    }
+  }
+  rootVnode.$tag$ = null;
+  rootVnode.$flags$ |= 4 /* isHost */;
+  hostRef.$vnode$ = rootVnode;
+  rootVnode.$elm$ = oldVNode.$elm$ = hostElm.shadowRoot || hostElm ;
+  {
+    scopeId = hostElm["s-sc"];
+  }
+  useNativeShadowDom = !!(cmpMeta.$flags$ & 1 /* shadowDomEncapsulation */) && !(cmpMeta.$flags$ & 128 /* shadowNeedsScopedCss */);
+  {
+    contentRef = hostElm["s-cr"];
+    checkSlotFallbackVisibility = false;
+  }
+  patch(oldVNode, rootVnode, isInitialLoad);
+  {
+    plt.$flags$ |= 1 /* isTmpDisconnected */;
+    if (checkSlotRelocate) {
+      markSlotContentForRelocation(rootVnode.$elm$);
+      for (const relocateData of relocateNodes) {
+        const nodeToRelocate = relocateData.$nodeToRelocate$;
+        if (!nodeToRelocate["s-ol"] && win.document) {
+          const orgLocationNode = win.document.createTextNode("");
+          orgLocationNode["s-nr"] = nodeToRelocate;
+          insertBefore(nodeToRelocate.parentNode, nodeToRelocate["s-ol"] = orgLocationNode, nodeToRelocate);
+        }
+      }
+      for (const relocateData of relocateNodes) {
+        const nodeToRelocate = relocateData.$nodeToRelocate$;
+        const slotRefNode = relocateData.$slotRefNode$;
+        if (slotRefNode) {
+          const parentNodeRef = slotRefNode.parentNode;
+          let insertBeforeNode = slotRefNode.nextSibling;
+          {
+            let orgLocationNode = (_a = nodeToRelocate["s-ol"]) == null ? void 0 : _a.previousSibling;
+            while (orgLocationNode) {
+              let refNode = (_b = orgLocationNode["s-nr"]) != null ? _b : null;
+              if (refNode && refNode["s-sn"] === nodeToRelocate["s-sn"] && parentNodeRef === (refNode.__parentNode || refNode.parentNode)) {
+                refNode = refNode.nextSibling;
+                while (refNode === nodeToRelocate || (refNode == null ? void 0 : refNode["s-sr"])) {
+                  refNode = refNode == null ? void 0 : refNode.nextSibling;
+                }
+                if (!refNode || !refNode["s-nr"]) {
+                  insertBeforeNode = refNode;
+                  break;
+                }
+              }
+              orgLocationNode = orgLocationNode.previousSibling;
+            }
+          }
+          const parent = nodeToRelocate.__parentNode || nodeToRelocate.parentNode;
+          const nextSibling = nodeToRelocate.__nextSibling || nodeToRelocate.nextSibling;
+          if (!insertBeforeNode && parentNodeRef !== parent || nextSibling !== insertBeforeNode) {
+            if (nodeToRelocate !== insertBeforeNode) {
+              if (!nodeToRelocate["s-hn"] && nodeToRelocate["s-ol"]) {
+                nodeToRelocate["s-hn"] = nodeToRelocate["s-ol"].parentNode.nodeName;
+              }
+              insertBefore(parentNodeRef, nodeToRelocate, insertBeforeNode);
+              if (nodeToRelocate.nodeType === 1 /* ElementNode */ && nodeToRelocate.tagName !== "SLOT-FB") {
+                nodeToRelocate.hidden = (_c = nodeToRelocate["s-ih"]) != null ? _c : false;
+              }
+            }
+          }
+          nodeToRelocate && typeof slotRefNode["s-rf"] === "function" && slotRefNode["s-rf"](slotRefNode);
+        } else {
+          if (nodeToRelocate.nodeType === 1 /* ElementNode */) {
+            if (isInitialLoad) {
+              nodeToRelocate["s-ih"] = (_d = nodeToRelocate.hidden) != null ? _d : false;
+            }
+            nodeToRelocate.hidden = true;
+          }
+        }
+      }
+    }
+    if (checkSlotFallbackVisibility) {
+      updateFallbackSlotVisibility(rootVnode.$elm$);
+    }
+    plt.$flags$ &= -2 /* isTmpDisconnected */;
+    relocateNodes.length = 0;
+  }
+  contentRef = void 0;
+};
+
+// src/runtime/update-component.ts
+var attachToAncestor = (hostRef, ancestorComponent) => {
+  if (ancestorComponent && !hostRef.$onRenderResolve$ && ancestorComponent["s-p"]) {
+    const index = ancestorComponent["s-p"].push(
+      new Promise(
+        (r) => hostRef.$onRenderResolve$ = () => {
+          ancestorComponent["s-p"].splice(index - 1, 1);
+          r();
+        }
+      )
+    );
+  }
+};
+var scheduleUpdate = (hostRef, isInitialLoad) => {
+  {
+    hostRef.$flags$ |= 16 /* isQueuedForUpdate */;
+  }
+  if (hostRef.$flags$ & 4 /* isWaitingForChildren */) {
+    hostRef.$flags$ |= 512 /* needsRerender */;
+    return;
+  }
+  attachToAncestor(hostRef, hostRef.$ancestorComponent$);
+  const dispatch = () => dispatchHooks(hostRef, isInitialLoad);
+  if (isInitialLoad) {
+    queueMicrotask(() => {
+      dispatch();
+    });
+    return;
+  }
+  return writeTask(dispatch) ;
+};
+var dispatchHooks = (hostRef, isInitialLoad) => {
+  const elm = hostRef.$hostElement$;
+  const endSchedule = createTime("scheduleUpdate", hostRef.$cmpMeta$.$tagName$);
+  const instance = elm;
+  if (!instance) {
+    throw new Error(
+      `Can't render component <${elm.tagName.toLowerCase()} /> with invalid Stencil runtime! Make sure this imported component is compiled with a \`externalRuntime: true\` flag. For more information, please refer to https://stenciljs.com/docs/custom-elements#externalruntime`
+    );
+  }
+  let maybePromise;
+  if (isInitialLoad) {
+    maybePromise = safeCall(instance, "componentWillLoad", void 0, elm);
+  } else {
+    maybePromise = safeCall(instance, "componentWillUpdate", void 0, elm);
+  }
+  maybePromise = enqueue(maybePromise, () => safeCall(instance, "componentWillRender", void 0, elm));
+  endSchedule();
+  return enqueue(maybePromise, () => updateComponent(hostRef, instance, isInitialLoad));
+};
+var enqueue = (maybePromise, fn) => isPromisey(maybePromise) ? maybePromise.then(fn).catch((err2) => {
+  console.error(err2);
+  fn();
+}) : fn();
+var isPromisey = (maybePromise) => maybePromise instanceof Promise || maybePromise && maybePromise.then && typeof maybePromise.then === "function";
+var updateComponent = async (hostRef, instance, isInitialLoad) => {
+  var _a;
+  const elm = hostRef.$hostElement$;
+  const endUpdate = createTime("update", hostRef.$cmpMeta$.$tagName$);
+  const rc = elm["s-rc"];
+  if (isInitialLoad) {
+    attachStyles(hostRef);
+  }
+  const endRender = createTime("render", hostRef.$cmpMeta$.$tagName$);
+  {
+    callRender(hostRef, instance, elm, isInitialLoad);
+  }
+  if (rc) {
+    rc.map((cb) => cb());
+    elm["s-rc"] = void 0;
+  }
+  endRender();
+  endUpdate();
+  {
+    const childrenPromises = (_a = elm["s-p"]) != null ? _a : [];
+    const postUpdate = () => postUpdateComponent(hostRef);
+    if (childrenPromises.length === 0) {
+      postUpdate();
+    } else {
+      Promise.all(childrenPromises).then(postUpdate);
+      hostRef.$flags$ |= 4 /* isWaitingForChildren */;
+      childrenPromises.length = 0;
+    }
+  }
+};
+var callRender = (hostRef, instance, elm, isInitialLoad) => {
+  try {
+    instance = instance.render() ;
+    {
+      hostRef.$flags$ &= -17 /* isQueuedForUpdate */;
+    }
+    {
+      hostRef.$flags$ |= 2 /* hasRendered */;
+    }
+    {
+      {
+        {
+          renderVdom(hostRef, instance, isInitialLoad);
+        }
+      }
+    }
+  } catch (e) {
+    consoleError(e, hostRef.$hostElement$);
+  }
+  return null;
+};
+var postUpdateComponent = (hostRef) => {
+  const tagName = hostRef.$cmpMeta$.$tagName$;
+  const elm = hostRef.$hostElement$;
+  const endPostUpdate = createTime("postUpdate", tagName);
+  const instance = elm;
+  const ancestorComponent = hostRef.$ancestorComponent$;
+  safeCall(instance, "componentDidRender", void 0, elm);
+  if (!(hostRef.$flags$ & 64 /* hasLoadedComponent */)) {
+    hostRef.$flags$ |= 64 /* hasLoadedComponent */;
+    {
+      addHydratedFlag(elm);
+    }
+    safeCall(instance, "componentDidLoad", void 0, elm);
+    endPostUpdate();
+    {
+      hostRef.$onReadyResolve$(elm);
+      if (!ancestorComponent) {
+        appDidLoad();
+      }
+    }
+  } else {
+    safeCall(instance, "componentDidUpdate", void 0, elm);
+    endPostUpdate();
+  }
+  {
+    if (hostRef.$onRenderResolve$) {
+      hostRef.$onRenderResolve$();
+      hostRef.$onRenderResolve$ = void 0;
+    }
+    if (hostRef.$flags$ & 512 /* needsRerender */) {
+      nextTick(() => scheduleUpdate(hostRef, false));
+    }
+    hostRef.$flags$ &= -517;
+  }
+};
+var appDidLoad = (who) => {
+  nextTick(() => emitEvent(win, "appload", { detail: { namespace: NAMESPACE } }));
+};
+var safeCall = (instance, method, arg, elm) => {
+  if (instance && instance[method]) {
+    try {
+      return instance[method](arg);
+    } catch (e) {
+      consoleError(e, elm);
+    }
+  }
+  return void 0;
+};
+var addHydratedFlag = (elm) => {
+  var _a;
+  return elm.classList.add((_a = BUILD.hydratedSelectorName) != null ? _a : "hydrated") ;
+};
+
+// src/runtime/set-value.ts
+var getValue = (ref, propName) => getHostRef(ref).$instanceValues$.get(propName);
+var setValue = (ref, propName, newVal, cmpMeta) => {
+  const hostRef = getHostRef(ref);
+  if (!hostRef) {
+    return;
+  }
+  const elm = ref;
+  const oldVal = hostRef.$instanceValues$.get(propName);
+  const flags = hostRef.$flags$;
+  const instance = elm;
+  newVal = parsePropertyValue(
+    newVal,
+    cmpMeta.$members$[propName][0]);
+  const areBothNaN = Number.isNaN(oldVal) && Number.isNaN(newVal);
+  const didValueChange = newVal !== oldVal && !areBothNaN;
+  if (didValueChange) {
+    hostRef.$instanceValues$.set(propName, newVal);
+    {
+      if (cmpMeta.$watchers$ && flags & 128 /* isWatchReady */) {
+        const watchMethods = cmpMeta.$watchers$[propName];
+        if (watchMethods) {
+          watchMethods.map((watchMethodName) => {
+            try {
+              instance[watchMethodName](newVal, oldVal, propName);
+            } catch (e) {
+              consoleError(e, elm);
+            }
+          });
+        }
+      }
+      if ((flags & (2 /* hasRendered */ | 16 /* isQueuedForUpdate */)) === 2 /* hasRendered */) {
+        if (instance.componentShouldUpdate) {
+          if (instance.componentShouldUpdate(newVal, oldVal, propName) === false) {
+            return;
+          }
+        }
+        scheduleUpdate(hostRef, false);
+      }
+    }
+  }
+};
+
+// src/runtime/proxy-component.ts
+var proxyComponent = (Cstr, cmpMeta, flags) => {
+  var _a, _b;
+  const prototype = Cstr.prototype;
+  {
+    {
+      if (Cstr.watchers && !cmpMeta.$watchers$) {
+        cmpMeta.$watchers$ = Cstr.watchers;
+      }
+      if (Cstr.deserializers && !cmpMeta.$deserializers$) {
+        cmpMeta.$deserializers$ = Cstr.deserializers;
+      }
+      if (Cstr.serializers && !cmpMeta.$serializers$) {
+        cmpMeta.$serializers$ = Cstr.serializers;
+      }
+    }
+    const members = Object.entries((_a = cmpMeta.$members$) != null ? _a : {});
+    members.map(([memberName, [memberFlags]]) => {
+      if ((memberFlags & 31 /* Prop */ || memberFlags & 32 /* State */)) {
+        const { get: origGetter, set: origSetter } = Object.getOwnPropertyDescriptor(prototype, memberName) || {};
+        if (origGetter) cmpMeta.$members$[memberName][0] |= 2048 /* Getter */;
+        if (origSetter) cmpMeta.$members$[memberName][0] |= 4096 /* Setter */;
+        {
+          Object.defineProperty(prototype, memberName, {
+            get() {
+              {
+                return origGetter ? origGetter.apply(this) : getValue(this, memberName);
+              }
+            },
+            configurable: true,
+            enumerable: true
+          });
+        }
+        Object.defineProperty(prototype, memberName, {
+          set(newValue) {
+            const ref = getHostRef(this);
+            if (!ref) {
+              return;
+            }
+            if (origSetter) {
+              const currentValue = memberFlags & 32 /* State */ ? this[memberName] : ref.$hostElement$[memberName];
+              if (typeof currentValue === "undefined" && ref.$instanceValues$.get(memberName)) {
+                newValue = ref.$instanceValues$.get(memberName);
+              }
+              origSetter.apply(this, [
+                parsePropertyValue(
+                  newValue,
+                  memberFlags)
+              ]);
+              newValue = memberFlags & 32 /* State */ ? this[memberName] : ref.$hostElement$[memberName];
+              setValue(this, memberName, newValue, cmpMeta);
+              return;
+            }
+            {
+              setValue(this, memberName, newValue, cmpMeta);
+              return;
+            }
+          }
+        });
+      }
+    });
+    {
+      const attrNameToPropName = /* @__PURE__ */ new Map();
+      prototype.attributeChangedCallback = function(attrName, oldValue, newValue) {
+        plt.jmp(() => {
+          var _a2;
+          const propName = attrNameToPropName.get(attrName);
+          const hostRef = getHostRef(this);
+          if (this.hasOwnProperty(propName) && BUILD.lazyLoad) ;
+          if (prototype.hasOwnProperty(propName) && typeof this[propName] === "number" && // cast type to number to avoid TS compiler issues
+          this[propName] == newValue) {
+            return;
+          } else if (propName == null) {
+            const flags2 = hostRef == null ? void 0 : hostRef.$flags$;
+            if (hostRef && flags2 && !(flags2 & 8 /* isConstructingInstance */) && flags2 & 128 /* isWatchReady */ && newValue !== oldValue) {
+              const elm = this;
+              const instance = elm;
+              const entry = (_a2 = cmpMeta.$watchers$) == null ? void 0 : _a2[attrName];
+              entry == null ? void 0 : entry.forEach((callbackName) => {
+                if (instance[callbackName] != null) {
+                  instance[callbackName].call(instance, newValue, oldValue, attrName);
+                }
+              });
+            }
+            return;
+          }
+          const propDesc = Object.getOwnPropertyDescriptor(prototype, propName);
+          newValue = newValue === null && typeof this[propName] === "boolean" ? false : newValue;
+          if (newValue != this[propName] && (!propDesc.get || !!propDesc.set)) {
+            this[propName] = newValue;
+          }
+        });
+      };
+      Cstr.observedAttributes = Array.from(
+        /* @__PURE__ */ new Set([
+          ...Object.keys((_b = cmpMeta.$watchers$) != null ? _b : {}),
+          ...members.filter(([_, m]) => m[0] & 31 /* HasAttribute */).map(([propName, m]) => {
+            var _a2;
+            const attrName = m[1] || propName;
+            attrNameToPropName.set(attrName, propName);
+            if (m[0] & 512 /* ReflectAttr */) {
+              (_a2 = cmpMeta.$attrsToReflect$) == null ? void 0 : _a2.push([propName, attrName]);
+            }
+            return attrName;
+          })
+        ])
+      );
+    }
+  }
+  return Cstr;
+};
+
+// src/runtime/initialize-component.ts
+var initializeComponent = async (elm, hostRef, cmpMeta, hmrVersionId) => {
+  let Cstr;
+  if ((hostRef.$flags$ & 32 /* hasInitializedComponent */) === 0) {
+    hostRef.$flags$ |= 32 /* hasInitializedComponent */;
+    {
+      Cstr = elm.constructor;
+      const cmpTag = elm.localName;
+      customElements.whenDefined(cmpTag).then(() => hostRef.$flags$ |= 128 /* isWatchReady */);
+    }
+    if (Cstr && Cstr.style) {
+      let style;
+      if (typeof Cstr.style === "string") {
+        style = Cstr.style;
+      }
+      const scopeId2 = getScopeId(cmpMeta);
+      if (!styles.has(scopeId2)) {
+        const endRegisterStyles = createTime("registerStyles", cmpMeta.$tagName$);
+        registerStyle(scopeId2, style, !!(cmpMeta.$flags$ & 1 /* shadowDomEncapsulation */));
+        endRegisterStyles();
+      }
+    }
+  }
+  const ancestorComponent = hostRef.$ancestorComponent$;
+  const schedule = () => scheduleUpdate(hostRef, true);
+  if (ancestorComponent && ancestorComponent["s-rc"]) {
+    ancestorComponent["s-rc"].push(schedule);
+  } else {
+    schedule();
+  }
+};
+var fireConnectedCallback = (instance, elm) => {
+};
+
+// src/runtime/connected-callback.ts
+var connectedCallback = (elm) => {
+  if ((plt.$flags$ & 1 /* isTmpDisconnected */) === 0) {
+    const hostRef = getHostRef(elm);
+    if (!hostRef) {
+      return;
+    }
+    const cmpMeta = hostRef.$cmpMeta$;
+    const endConnected = createTime("connectedCallback", cmpMeta.$tagName$);
+    if (!(hostRef.$flags$ & 1 /* hasConnected */)) {
+      hostRef.$flags$ |= 1 /* hasConnected */;
+      {
+        if (// TODO(STENCIL-854): Remove code related to legacy shadowDomShim field
+        cmpMeta.$flags$ & (4 /* hasSlotRelocation */ | 8 /* needsShadowDomShim */)) {
+          setContentReference(elm);
+        }
+      }
+      {
+        let ancestorComponent = elm;
+        while (ancestorComponent = ancestorComponent.parentNode || ancestorComponent.host) {
+          if (ancestorComponent["s-p"]) {
+            attachToAncestor(hostRef, hostRef.$ancestorComponent$ = ancestorComponent);
+            break;
+          }
+        }
+      }
+      if (cmpMeta.$members$) {
+        Object.entries(cmpMeta.$members$).map(([memberName, [memberFlags]]) => {
+          if (memberFlags & 31 /* Prop */ && memberName in elm && elm[memberName] !== Object.prototype[memberName]) {
+            const value = elm[memberName];
+            delete elm[memberName];
+            elm[memberName] = value;
+          }
+        });
+      }
+      {
+        initializeComponent(elm, hostRef, cmpMeta);
+      }
+    } else {
+      addHostEventListeners(elm, hostRef, cmpMeta.$listeners$);
+      if (hostRef == null ? void 0 : hostRef.$lazyInstance$) ; else if (hostRef == null ? void 0 : hostRef.$onReadyPromise$) {
+        hostRef.$onReadyPromise$.then(() => fireConnectedCallback());
+      }
+    }
+    endConnected();
+  }
+};
+var setContentReference = (elm) => {
+  if (!win.document) {
+    return;
+  }
+  const contentRefElm = elm["s-cr"] = win.document.createComment(
+    ""
+  );
+  contentRefElm["s-cn"] = true;
+  insertBefore(elm, contentRefElm, elm.firstChild);
+};
+var disconnectedCallback = async (elm) => {
+  if ((plt.$flags$ & 1 /* isTmpDisconnected */) === 0) {
+    const hostRef = getHostRef(elm);
+    {
+      if (hostRef == null ? void 0 : hostRef.$rmListeners$) {
+        hostRef.$rmListeners$.map((rmListener) => rmListener());
+        hostRef.$rmListeners$ = void 0;
+      }
+    }
+  }
+  if (rootAppliedStyles.has(elm)) {
+    rootAppliedStyles.delete(elm);
+  }
+  if (elm.shadowRoot && rootAppliedStyles.has(elm.shadowRoot)) {
+    rootAppliedStyles.delete(elm.shadowRoot);
+  }
+};
+var proxyCustomElement = (Cstr, compactMeta) => {
+  const cmpMeta = {
+    $flags$: compactMeta[0],
+    $tagName$: compactMeta[1]
+  };
+  {
+    cmpMeta.$members$ = compactMeta[2];
+  }
+  {
+    cmpMeta.$listeners$ = compactMeta[3];
+  }
+  {
+    cmpMeta.$watchers$ = Cstr.$watchers$;
+    cmpMeta.$deserializers$ = Cstr.$deserializers$;
+    cmpMeta.$serializers$ = Cstr.$serializers$;
+  }
+  {
+    cmpMeta.$attrsToReflect$ = [];
+  }
+  const originalConnectedCallback = Cstr.prototype.connectedCallback;
+  const originalDisconnectedCallback = Cstr.prototype.disconnectedCallback;
+  Object.assign(Cstr.prototype, {
+    __hasHostListenerAttached: false,
+    __registerHost() {
+      registerHost(this, cmpMeta);
+    },
+    connectedCallback() {
+      if (!this.__hasHostListenerAttached) {
+        const hostRef = getHostRef(this);
+        if (!hostRef) {
+          return;
+        }
+        addHostEventListeners(this, hostRef, cmpMeta.$listeners$);
+        this.__hasHostListenerAttached = true;
+      }
+      connectedCallback(this);
+      if (originalConnectedCallback) {
+        originalConnectedCallback.call(this);
+      }
+    },
+    disconnectedCallback() {
+      disconnectedCallback(this);
+      if (originalDisconnectedCallback) {
+        originalDisconnectedCallback.call(this);
+      }
+    },
+    __attachShadow() {
+      {
+        if (!this.shadowRoot) {
+          createShadowRoot.call(this, cmpMeta);
+        } else {
+          if (this.shadowRoot.mode !== "open") {
+            throw new Error(
+              `Unable to re-use existing shadow root for ${cmpMeta.$tagName$}! Mode is set to ${this.shadowRoot.mode} but Stencil only supports open shadow roots.`
+            );
+          }
+        }
+      }
+    }
+  });
+  Cstr.is = cmpMeta.$tagName$;
+  return proxyComponent(Cstr, cmpMeta);
+};
+
+// src/runtime/fragment.ts
+var Fragment = (_, children) => children;
+var addHostEventListeners = (elm, hostRef, listeners, attachParentListeners) => {
+  if (listeners && win.document) {
+    listeners.map(([flags, name, method]) => {
+      const target = getHostListenerTarget(win.document, elm, flags) ;
+      const handler = hostListenerProxy(hostRef, method);
+      const opts = hostListenerOpts(flags);
+      plt.ael(target, name, handler, opts);
+      (hostRef.$rmListeners$ = hostRef.$rmListeners$ || []).push(() => plt.rel(target, name, handler, opts));
+    });
+  }
+};
+var hostListenerProxy = (hostRef, methodName) => (ev) => {
+  try {
+    {
+      hostRef.$hostElement$[methodName](ev);
+    }
+  } catch (e) {
+    consoleError(e, hostRef.$hostElement$);
+  }
+};
+var getHostListenerTarget = (doc, elm, flags) => {
+  if (flags & 4 /* TargetDocument */) {
+    return doc;
+  }
+  if (flags & 8 /* TargetWindow */) {
+    return win;
+  }
+  if (flags & 16 /* TargetBody */) {
+    return doc.body;
+  }
+  return elm;
+};
+var hostListenerOpts = (flags) => supportsListenerOptions ? {
+  passive: (flags & 1 /* Passive */) !== 0,
+  capture: (flags & 2 /* Capture */) !== 0
+} : (flags & 2 /* Capture */) !== 0;
+
+// src/runtime/nonce.ts
+var setNonce = (nonce) => plt.$nonce$ = nonce;
+
+// src/runtime/platform-options.ts
+var setPlatformOptions = (opts) => Object.assign(plt, opts);
+
+// src/runtime/render.ts
+function render(vnode, container) {
+  const cmpMeta = {
+    $flags$: 0,
+    $tagName$: container.tagName
+  };
+  const ref = {
+    $cmpMeta$: cmpMeta,
+    $hostElement$: container
+  };
+  renderVdom(ref, vnode);
+}
+
+export { Fragment as F, H, ValidationMessages as V, getAssetPath as a, setNonce as b, setPlatformOptions as c, Host as d, createEvent as e, globalScripts as g, h, proxyCustomElement as p, render as r, setAssetPath as s };
+//# sourceMappingURL=p-BvGlmU4v.js.map
+
+//# sourceMappingURL=p-BvGlmU4v.js.map