@ptcwebops/ptcw-design 6.3.21 → 6.3.22-beta

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (244) hide show
  1. package/dist/cjs/{component-35540bfb.js → component-4dd13907.js} +2643 -832
  2. package/dist/cjs/featured-list.cjs.entry.js +1 -1
  3. package/dist/cjs/innovator-toggle-container.cjs.entry.js +1 -1
  4. package/dist/cjs/jumbotron-sub-menu.cjs.entry.js +1 -1
  5. package/dist/cjs/list-item.cjs.entry.js +1 -1
  6. package/dist/cjs/loader.cjs.js +1 -1
  7. package/dist/cjs/modal-form-example.cjs.entry.js +94 -0
  8. package/dist/cjs/ptc-back-to-top.cjs.entry.js +1 -16
  9. package/dist/cjs/ptc-bio-card.cjs.entry.js +5 -20
  10. package/dist/cjs/ptc-card_2.cjs.entry.js +5 -10
  11. package/dist/cjs/ptc-case-studies-slider.cjs.entry.js +6 -2
  12. package/dist/cjs/ptc-close-icon_2.cjs.entry.js +17 -32
  13. package/dist/cjs/ptc-data-lookup.cjs.entry.js +1 -2
  14. package/dist/cjs/ptc-dynamic-card.cjs.entry.js +1 -1
  15. package/dist/cjs/ptc-enhanced-product-listing-card.cjs.entry.js +1 -1
  16. package/dist/cjs/ptc-featured-list.cjs.entry.js +1 -1
  17. package/dist/cjs/ptc-filter-level-theater.cjs.entry.js +1 -1
  18. package/dist/cjs/{ptc-form-checkbox_2.cjs.entry.js → ptc-form-checkbox_4.cjs.entry.js} +787 -5
  19. package/dist/cjs/ptc-icon-list.cjs.entry.js +1 -1
  20. package/dist/cjs/ptc-info-tile.cjs.entry.js +1 -2
  21. package/dist/cjs/ptc-jumbotron.cjs.entry.js +1 -1
  22. package/dist/cjs/ptc-nav-skip-to-content.cjs.entry.js +3 -28
  23. package/dist/cjs/ptc-para.cjs.entry.js +1 -1
  24. package/dist/cjs/ptc-podcast-card.cjs.entry.js +1 -1
  25. package/dist/cjs/ptc-previous-url.cjs.entry.js +10 -2
  26. package/dist/cjs/ptc-pricing-packaging-table.cjs.entry.js +11 -9
  27. package/dist/cjs/ptc-pricing-tabs.cjs.entry.js +1 -1
  28. package/dist/cjs/ptc-product-card.cjs.entry.js +2 -2
  29. package/dist/cjs/ptc-product-category.cjs.entry.js +1 -1
  30. package/dist/cjs/ptc-product-dropdown.cjs.entry.js +2 -2
  31. package/dist/cjs/ptc-product-highlight-card.cjs.entry.js +1 -1
  32. package/dist/cjs/ptc-product-list.cjs.entry.js +1 -7
  33. package/dist/cjs/ptc-product-sidebar.cjs.entry.js +6 -38
  34. package/dist/cjs/ptc-readmore-char.cjs.entry.js +1 -1
  35. package/dist/cjs/ptc-readmore-v3.cjs.entry.js +1 -1
  36. package/dist/cjs/ptc-related-card-rail.cjs.entry.js +32 -90
  37. package/dist/cjs/ptc-tooltip-v2.cjs.entry.js +1 -1
  38. package/dist/cjs/ptc-value-led-speed-bump.cjs.entry.js +1 -1
  39. package/dist/cjs/ptc-white-paper.cjs.entry.js +10 -6
  40. package/dist/cjs/ptcw-design.cjs.js +1 -1
  41. package/dist/cjs/tab-header.cjs.entry.js +1 -1
  42. package/dist/collection/collection-manifest.json +1 -0
  43. package/dist/collection/components/icon-asset/media/designer-v6.0.6.svg +30 -2
  44. package/dist/collection/components/innovator-toggle-container/innovator-toggle-container.css +6 -6
  45. package/dist/collection/components/jumbotron-sub-menu/jumbotron-sub-menu.css +0 -1
  46. package/dist/collection/components/list-item/list-item.css +0 -4
  47. package/dist/collection/components/organism-bundles/bundle-featured-list/featured-list.css +3 -3
  48. package/dist/collection/components/organism-bundles/form/modal-from-example/modal-form-example.css +26 -0
  49. package/dist/collection/components/organism-bundles/form/modal-from-example/modal-form-example.js +99 -0
  50. package/dist/collection/components/ptc-back-to-top/ptc-back-to-top.css +0 -4
  51. package/dist/collection/components/ptc-back-to-top/ptc-back-to-top.js +0 -15
  52. package/dist/collection/components/ptc-bio-card/ptc-bio-card.css +6 -10
  53. package/dist/collection/components/ptc-bio-card/ptc-bio-card.js +4 -19
  54. package/dist/collection/components/ptc-case-studies-slider/ptc-case-studies-slider.css +6 -6
  55. package/dist/collection/components/ptc-case-studies-slider/ptc-case-studies-slider.js +5 -1
  56. package/dist/collection/components/ptc-container/ptc-container.js +2 -2
  57. package/dist/collection/components/ptc-dynamic-card/ptc-dynamic-card.css +1 -1
  58. package/dist/collection/components/ptc-enhanced-product-listing-card/ptc-enhanced-product-listing-card.css +0 -16
  59. package/dist/collection/components/ptc-featured-list/ptc-featured-list.css +6 -6
  60. package/dist/collection/components/ptc-filter-level-theater/ptc-filter-level-theater.css +6 -6
  61. package/dist/collection/components/ptc-icon-list/ptc-icon-list.css +0 -3
  62. package/dist/collection/components/ptc-info-tile/ptc-info-tile.js +1 -20
  63. package/dist/collection/components/ptc-jumbotron/ptc-jumbotron.css +6 -6
  64. package/dist/collection/components/ptc-modal/ptc-modal.css +4 -0
  65. package/dist/collection/components/ptc-modal/ptc-modal.js +18 -50
  66. package/dist/collection/components/ptc-nav-skip-to-content/ptc-nav-skip-to-content.css +0 -7
  67. package/dist/collection/components/ptc-nav-skip-to-content/ptc-nav-skip-to-content.js +2 -78
  68. package/dist/collection/components/ptc-para/ptc-para.css +3 -0
  69. package/dist/collection/components/ptc-para/ptc-para.js +2 -2
  70. package/dist/collection/components/ptc-podcast-card/ptc-podcast-card.css +6 -6
  71. package/dist/collection/components/ptc-preloader-section/ptc-preloader-section.css +0 -419
  72. package/dist/collection/components/ptc-preloader-section/ptc-preloader-section.js +4 -9
  73. package/dist/collection/components/ptc-previous-url/ptc-previous-url.css +16 -0
  74. package/dist/collection/components/ptc-previous-url/ptc-previous-url.js +27 -1
  75. package/dist/collection/components/ptc-pricing-packaging-table/ptc-pricing-packaging-table.js +11 -9
  76. package/dist/collection/components/ptc-pricing-tabs/ptc-pricing-tabs.js +1 -1
  77. package/dist/collection/components/ptc-product-card/ptc-product-card.css +6 -10
  78. package/dist/collection/components/ptc-product-card/ptc-product-card.js +1 -1
  79. package/dist/collection/components/ptc-product-category/ptc-product-category.css +6 -6
  80. package/dist/collection/components/ptc-product-dropdown/ptc-product-dropdown.css +0 -8
  81. package/dist/collection/components/ptc-product-dropdown/ptc-product-dropdown.js +1 -1
  82. package/dist/collection/components/ptc-product-highlight-card/ptc-product-highlight-card.css +6 -6
  83. package/dist/collection/components/ptc-product-list/ptc-product-list.js +1 -7
  84. package/dist/collection/components/ptc-product-sidebar/ptc-product-sidebar.css +0 -12
  85. package/dist/collection/components/ptc-product-sidebar/ptc-product-sidebar.js +5 -37
  86. package/dist/collection/components/ptc-readmore-char/ptc-readmore-char.css +6 -6
  87. package/dist/collection/components/ptc-readmore-v3/ptc-readmore-v3.css +6 -6
  88. package/dist/collection/components/ptc-related-card-rail/ptc-related-card-rail.css +2 -1
  89. package/dist/collection/components/ptc-related-card-rail/ptc-related-card-rail.js +33 -113
  90. package/dist/collection/components/ptc-textfield/ptc-textfield.js +19 -19
  91. package/dist/collection/components/ptc-tooltip-v2/ptc-tooltip-v2.css +6 -6
  92. package/dist/collection/components/ptc-value-led-speed-bump/ptc-value-led-speed-bump.css +6 -6
  93. package/dist/collection/components/ptc-white-paper/ptc-white-paper.css +6 -6
  94. package/dist/collection/components/ptc-white-paper/ptc-white-paper.js +9 -5
  95. package/dist/collection/components/tab-header/tab-header.js +1 -1
  96. package/dist/collection/stories/Card.stories.js +148 -3
  97. package/dist/collection/stories/Link.stories.js +13 -25
  98. package/dist/collection/stories/Paragraph.stories.js +10 -18
  99. package/dist/collection/stories/Select.stories.js +8 -5
  100. package/dist/collection/stories/Textfield.stories.js +28 -71
  101. package/dist/collection/stories/Title.stories.js +16 -28
  102. package/dist/collection/stories/organisms/eSupport/CaseTracker/preview.stories.js +45 -0
  103. package/dist/collection/stories/organisms/eSupport/SupportArticle/preview.stories.js +47 -0
  104. package/dist/collection/stories/organisms/eSupport/SupportPage/preview.stories.js +157 -0
  105. package/dist/custom-elements/index.d.ts +6 -0
  106. package/dist/custom-elements/index.js +230 -293
  107. package/dist/esm/{component-8c53e377.js → component-9c921cc6.js} +2592 -793
  108. package/dist/esm/featured-list.entry.js +1 -1
  109. package/dist/esm/innovator-toggle-container.entry.js +1 -1
  110. package/dist/esm/jumbotron-sub-menu.entry.js +1 -1
  111. package/dist/esm/list-item.entry.js +1 -1
  112. package/dist/esm/loader.js +1 -1
  113. package/dist/esm/modal-form-example.entry.js +90 -0
  114. package/dist/esm/ptc-back-to-top.entry.js +1 -16
  115. package/dist/esm/ptc-bio-card.entry.js +5 -20
  116. package/dist/esm/ptc-card_2.entry.js +5 -10
  117. package/dist/esm/ptc-case-studies-slider.entry.js +6 -2
  118. package/dist/esm/ptc-close-icon_2.entry.js +17 -32
  119. package/dist/esm/ptc-data-lookup.entry.js +1 -2
  120. package/dist/esm/ptc-dynamic-card.entry.js +1 -1
  121. package/dist/esm/ptc-enhanced-product-listing-card.entry.js +1 -1
  122. package/dist/esm/ptc-featured-list.entry.js +1 -1
  123. package/dist/esm/ptc-filter-level-theater.entry.js +1 -1
  124. package/dist/esm/{ptc-form-checkbox_2.entry.js → ptc-form-checkbox_4.entry.js} +784 -4
  125. package/dist/esm/ptc-icon-list.entry.js +1 -1
  126. package/dist/esm/ptc-info-tile.entry.js +1 -2
  127. package/dist/esm/ptc-jumbotron.entry.js +1 -1
  128. package/dist/esm/ptc-nav-skip-to-content.entry.js +3 -28
  129. package/dist/esm/ptc-para.entry.js +1 -1
  130. package/dist/esm/ptc-podcast-card.entry.js +1 -1
  131. package/dist/esm/ptc-previous-url.entry.js +10 -2
  132. package/dist/esm/ptc-pricing-packaging-table.entry.js +11 -9
  133. package/dist/esm/ptc-pricing-tabs.entry.js +1 -1
  134. package/dist/esm/ptc-product-card.entry.js +2 -2
  135. package/dist/esm/ptc-product-category.entry.js +1 -1
  136. package/dist/esm/ptc-product-dropdown.entry.js +2 -2
  137. package/dist/esm/ptc-product-highlight-card.entry.js +1 -1
  138. package/dist/esm/ptc-product-list.entry.js +1 -7
  139. package/dist/esm/ptc-product-sidebar.entry.js +6 -38
  140. package/dist/esm/ptc-readmore-char.entry.js +1 -1
  141. package/dist/esm/ptc-readmore-v3.entry.js +1 -1
  142. package/dist/esm/ptc-related-card-rail.entry.js +32 -90
  143. package/dist/esm/ptc-tooltip-v2.entry.js +1 -1
  144. package/dist/esm/ptc-value-led-speed-bump.entry.js +1 -1
  145. package/dist/esm/ptc-white-paper.entry.js +10 -6
  146. package/dist/esm/ptcw-design.js +1 -1
  147. package/dist/esm/tab-header.entry.js +1 -1
  148. package/dist/ptcw-design/media/designer-v6.0.6.svg +30 -2
  149. package/dist/ptcw-design/{p-752bba1c.entry.js → p-0529caaa.entry.js} +1 -1
  150. package/dist/ptcw-design/p-072a76d3.entry.js +1 -0
  151. package/dist/ptcw-design/{p-a791c53a.entry.js → p-0b515839.entry.js} +1 -1
  152. package/dist/ptcw-design/p-0d223232.entry.js +1 -0
  153. package/dist/ptcw-design/p-0de4cd11.entry.js +1 -0
  154. package/dist/ptcw-design/p-21aa746d.entry.js +1 -0
  155. package/dist/ptcw-design/{p-24776ca2.entry.js → p-2cc7e2a8.entry.js} +1 -1
  156. package/dist/ptcw-design/p-32f64f48.entry.js +1 -0
  157. package/dist/ptcw-design/p-3dac861d.entry.js +1 -0
  158. package/dist/ptcw-design/{p-d089dc37.entry.js → p-3dd0ded9.entry.js} +1 -1
  159. package/dist/ptcw-design/{p-4d8f6f46.entry.js → p-445329ed.entry.js} +1 -1
  160. package/dist/ptcw-design/{p-68ed2afe.entry.js → p-48c5eab8.entry.js} +1 -1
  161. package/dist/ptcw-design/p-4b192f5e.entry.js +1 -0
  162. package/dist/ptcw-design/p-4f93c631.entry.js +1 -0
  163. package/dist/ptcw-design/p-5311c6e1.entry.js +1 -0
  164. package/dist/ptcw-design/p-58e91cb8.entry.js +1 -0
  165. package/dist/ptcw-design/p-5db7f70b.entry.js +1 -0
  166. package/dist/ptcw-design/p-67c248ec.entry.js +1 -0
  167. package/dist/ptcw-design/p-71fbb799.entry.js +1 -0
  168. package/dist/ptcw-design/p-75390f63.entry.js +1 -0
  169. package/dist/ptcw-design/{p-e3b1af2b.entry.js → p-7793babb.entry.js} +1 -1
  170. package/dist/ptcw-design/p-799afee5.entry.js +1 -0
  171. package/dist/ptcw-design/p-8038bf31.entry.js +1 -0
  172. package/dist/ptcw-design/p-9501995f.entry.js +1 -0
  173. package/dist/ptcw-design/p-97b9f41b.entry.js +1 -0
  174. package/dist/ptcw-design/p-99ee8a0e.entry.js +1 -0
  175. package/dist/ptcw-design/p-9d612f1f.entry.js +1 -0
  176. package/dist/ptcw-design/p-a89b986a.entry.js +68 -0
  177. package/dist/ptcw-design/p-b50f71dd.entry.js +1 -0
  178. package/dist/ptcw-design/{p-757954b2.entry.js → p-b570e9a5.entry.js} +1 -1
  179. package/dist/ptcw-design/p-baff4d44.entry.js +1 -0
  180. package/dist/ptcw-design/p-bcab66bf.js +336 -0
  181. package/dist/ptcw-design/p-c788f16f.entry.js +1 -0
  182. package/dist/ptcw-design/{p-18ac526f.entry.js → p-d73cc053.entry.js} +1 -1
  183. package/dist/ptcw-design/p-de960790.entry.js +1 -0
  184. package/dist/ptcw-design/p-e6a272d9.entry.js +1 -0
  185. package/dist/ptcw-design/p-f1734520.entry.js +1 -0
  186. package/dist/ptcw-design/{p-0ddf2a09.entry.js → p-f867ebe6.entry.js} +1 -1
  187. package/dist/ptcw-design/p-fe40421e.entry.js +1 -0
  188. package/dist/ptcw-design/ptcw-design.css +2 -2
  189. package/dist/ptcw-design/ptcw-design.esm.js +1 -1
  190. package/dist/types/components/organism-bundles/form/modal-from-example/modal-form-example.d.ts +25 -0
  191. package/dist/types/components/ptc-bio-card/ptc-bio-card.d.ts +1 -1
  192. package/dist/types/components/ptc-container/ptc-container.d.ts +1 -1
  193. package/dist/types/components/ptc-info-tile/ptc-info-tile.d.ts +0 -1
  194. package/dist/types/components/ptc-mobile-select/mobile-select/dist/mobile-select.d.ts +209 -0
  195. package/dist/types/components/ptc-modal/ptc-modal.d.ts +2 -2
  196. package/dist/types/components/ptc-nav-skip-to-content/ptc-nav-skip-to-content.d.ts +0 -6
  197. package/dist/types/components/ptc-para/ptc-para.d.ts +1 -1
  198. package/dist/types/components/ptc-previous-url/ptc-previous-url.d.ts +2 -0
  199. package/dist/types/components/ptc-product-list/ptc-product-list.d.ts +1 -1
  200. package/dist/types/components/ptc-product-sidebar/ptc-product-sidebar.d.ts +3 -6
  201. package/dist/types/components/ptc-related-card-rail/ptc-related-card-rail.d.ts +5 -12
  202. package/dist/types/components/ptc-textfield/ptc-textfield.d.ts +0 -54
  203. package/dist/types/components.d.ts +21 -126
  204. package/dist/types/utils/eloqua.d.ts +9 -0
  205. package/package.json +2 -6
  206. package/readme.md +5 -1
  207. package/dist/cjs/component-1b8ad4d2.js +0 -1819
  208. package/dist/cjs/ptc-multi-select_2.cjs.entry.js +0 -670
  209. package/dist/cjs/validation-messages-33a4f26b.js +0 -126
  210. package/dist/collection/stories/Jumbotron.stories.js +0 -763
  211. package/dist/esm/component-9beac35b.js +0 -1802
  212. package/dist/esm/ptc-multi-select_2.entry.js +0 -665
  213. package/dist/esm/validation-messages-adbb6518.js +0 -124
  214. package/dist/ptcw-design/p-00e21489.entry.js +0 -1
  215. package/dist/ptcw-design/p-05c29cc2.entry.js +0 -1
  216. package/dist/ptcw-design/p-13e338a5.entry.js +0 -1
  217. package/dist/ptcw-design/p-1454ba84.entry.js +0 -1
  218. package/dist/ptcw-design/p-18a5a338.js +0 -1
  219. package/dist/ptcw-design/p-352e87c0.entry.js +0 -1
  220. package/dist/ptcw-design/p-38e5e590.entry.js +0 -1
  221. package/dist/ptcw-design/p-4737a0f6.entry.js +0 -1
  222. package/dist/ptcw-design/p-4ca956c1.entry.js +0 -1
  223. package/dist/ptcw-design/p-593b8eff.entry.js +0 -1
  224. package/dist/ptcw-design/p-73a853fc.entry.js +0 -1
  225. package/dist/ptcw-design/p-75431fa1.entry.js +0 -1
  226. package/dist/ptcw-design/p-98426799.js +0 -203
  227. package/dist/ptcw-design/p-98844b50.js +0 -134
  228. package/dist/ptcw-design/p-a2c7df64.entry.js +0 -1
  229. package/dist/ptcw-design/p-a58698ca.entry.js +0 -1
  230. package/dist/ptcw-design/p-acdd9a1d.entry.js +0 -1
  231. package/dist/ptcw-design/p-ad821a01.entry.js +0 -1
  232. package/dist/ptcw-design/p-b6255525.entry.js +0 -1
  233. package/dist/ptcw-design/p-b7fa9f2c.entry.js +0 -1
  234. package/dist/ptcw-design/p-b963ec8c.entry.js +0 -68
  235. package/dist/ptcw-design/p-bb9a879f.entry.js +0 -1
  236. package/dist/ptcw-design/p-bf84ecc0.entry.js +0 -1
  237. package/dist/ptcw-design/p-c82eaf9d.entry.js +0 -1
  238. package/dist/ptcw-design/p-cad4b517.entry.js +0 -1
  239. package/dist/ptcw-design/p-d6845e91.entry.js +0 -1
  240. package/dist/ptcw-design/p-db1dcce0.entry.js +0 -1
  241. package/dist/ptcw-design/p-ddb898c7.entry.js +0 -1
  242. package/dist/ptcw-design/p-e6619d63.entry.js +0 -1
  243. package/dist/ptcw-design/p-f9256e3d.entry.js +0 -1
  244. package/dist/ptcw-design/p-fbd9c8fc.entry.js +0 -1
@@ -0,0 +1,99 @@
1
+ import { Host, h } from '@stencil/core';
2
+ export class PtcForm {
3
+ constructor() {
4
+ this.formData = {
5
+ email: '',
6
+ firstName: '',
7
+ lastName: '',
8
+ company: '',
9
+ country: '',
10
+ phone: '',
11
+ inquiryReason: '',
12
+ howhearselfreport: '',
13
+ policyChecked: false,
14
+ };
15
+ }
16
+ // private countryEle: HTMLPtcSelectElement;
17
+ // private inquiryreasonEle: HTMLPtcTextfieldElement;
18
+ // private howhearselfreport: HTMLPtcTextfieldElement;
19
+ componentDidLoad() {
20
+ this.formButton = this.el.querySelector('.form-submit');
21
+ this.formButton.addEventListener('click', this.handleSubmit.bind(this));
22
+ //get Email
23
+ this.emailEle = this.el.querySelector('ptc-textfield[field-id="contact-email"]');
24
+ this.firstNameEle = this.el.querySelector('ptc-textfield[field-id="contact-firstname"]');
25
+ this.lastNameEle = this.el.querySelector('ptc-textfield[field-id="contact-lastname"]');
26
+ this.companyEle = this.el.querySelector('ptc-textfield[field-id="company"]');
27
+ this.phoneEle = this.el.querySelector('ptc-textfield[field-id="contact-phone"]');
28
+ // this.countryEle = this.el.querySelector('ptc-select[field-id="contact-country"]')
29
+ // this.inquiryreasonEle = this.el.querySelector('ptc-textfield[field-id="contact-inquiry"]')
30
+ // this.howhearselfreport = this.el.querySelector('ptc-textfield[field-id="self-reporting"]')
31
+ }
32
+ handleInputChange(field, value) {
33
+ this.formData = Object.assign(Object.assign({}, this.formData), { [field]: value });
34
+ }
35
+ handleSubmit(event) {
36
+ event.preventDefault();
37
+ this.formData.email = this.emailEle.inputValue;
38
+ this.formData.firstName = this.firstNameEle.inputValue;
39
+ this.formData.lastName = this.lastNameEle.inputValue;
40
+ this.formData.company = this.companyEle.inputValue;
41
+ this.formData.phone = this.phoneEle.inputValue;
42
+ // this.formData.country = this.countryEle.inputValue;
43
+ // this.formData.inquiryReason= this.inquiryreasonEle.inputValue;
44
+ // this.formData.howhearselfreport = this.howhearselfreport.inputValue;
45
+ // console.log("get form Data: " + this.formData.email)
46
+ if (this.isValid()) {
47
+ const formSubmitEvent = new CustomEvent('formSubmit', {
48
+ detail: this.formData,
49
+ bubbles: true,
50
+ });
51
+ this.el.dispatchEvent(formSubmitEvent);
52
+ console.log('Form Submitted: ' + this.formData);
53
+ }
54
+ else {
55
+ console.log('Form validation failed');
56
+ console.log('Form Submitted: ' + this.formData.email, this.formData.firstName, this.formData.lastName, this.formData.company, this.formData.phone);
57
+ }
58
+ }
59
+ isValid() {
60
+ const { email, firstName, lastName, company, country, phone, inquiryReason, howhearselfreport, policyChecked } = this.formData;
61
+ const invalidLength = document.querySelectorAll('.invalid-field').length;
62
+ // console.log('invalid fields length: ' + invalidLength), check the select field
63
+ return (email !== '' &&
64
+ phone !== '' &&
65
+ firstName !== '' &&
66
+ lastName !== '' &&
67
+ company !== '' &&
68
+ country !== '' &&
69
+ inquiryReason !== '' &&
70
+ howhearselfreport != '' &&
71
+ policyChecked &&
72
+ invalidLength === 0);
73
+ }
74
+ render() {
75
+ const multiSelectItems = [
76
+ { text: 'Item 1', selected: false, ptcDataEloquaName: 'item_1', ptcDataTargetEloquaName: 'item_target-1' },
77
+ { text: 'Item 2', selected: false, ptcDataEloquaName: 'item_2', ptcDataTargetEloquaName: 'item_target-2' },
78
+ { text: 'Item 3', selected: false, ptcDataEloquaName: 'item_3', ptcDataTargetEloquaName: 'item_target-3' }
79
+ ];
80
+ return (h(Host, null, h("div", { class: "ptc-container u-flex u-flex-justify-center" }, h("div", { class: "form-wrapper" }, h("ptc-title", { "seo-compatibility-mode": true, "text-align": "left", "title-color": "gray", upperline: "no-upperline", "title-display": "inline-block", "title-height": "densest", "title-margin": "margin-flush", "title-weight": "w-7", "is-plm-hub": "false", "title-size": "medium" }, h("h2", null, "PTC\u2019s PLM application suite combines the power of Windchill, the industry\u2019s #1 PLM software with Thingworx")), h("ptc-spacer", { size: "x-small", breakpoint: "small" }), h("ptc-spacer", { size: "small", breakpoint: "x-small" }), h("ptc-para", { "seo-compatibility-mode": true, "font-size": "x-small", "font-weight": "w-4", "para-margin": "margin-flush", "para-style": "main", "para-line-h": "line-height-densest" }, "PTC\u2019s market-leading, purpose-built IIoT platform. The suite offers a mix of Packages, Add-Ons, and Apps to best suit your business needs:"), h("ptc-spacer", { size: "x-small", breakpoint: "small" }), h("ptc-spacer", { size: "small", breakpoint: "x-small" }), h("max-width-container", { "max-width": "277", breakpoint: 480 }, h("ptc-title", { type: "h2", "text-align": "", "title-size": "x-small", "title-color": "gray", upperline: "no-upperline", "title-display": "inline-block", "title-height": "densest", "title-margin": "margin-flush", "title-weight": "w-6", "is-plm-hub": "false" }, "Please fill out the form and a PTC sales representative will be in touch."), h("ptc-spacer", { breakpoint: "x-small", size: "medium" }), h("ptc-spacer", { breakpoint: "x-small", size: "medium" }), h("ptc-spacer", { breakpoint: "small", size: "small" }), h("ptc-spacer", { breakpoint: "small", size: "small" })), h("form", { onSubmit: event => this.handleSubmit(event) }, h("ptc-textfield", { "field-id": "contact-firstname", "label-text": "First Name*", type: "text", "ptc-data-eloqua-name": "C_FirstName", "field-name": "firstname" }), h("ptc-textfield", { "field-id": "contact-lastname", "label-text": "Last Name*", type: "text", "ptc-data-eloqua-name": "C_LastName", "field-name": "lastname" }), h("ptc-textfield", { "field-id": "company", "label-text": "Company*", type: "text", "ptc-data-eloqua-name": "C_Company", "field-name": "company" }), h("ptc-textfield", { "field-id": "contact-email", "label-text": "Email*", type: "email", "ptc-data-eloqua-name": "C_EmailAddress", "field-name": "email" }), h("ptc-textfield", { "field-id": "company-email", "label-text": "Company Email*", type: "email", "ptc-data-eloqua-name": "C_EmailAddress", "field-name": "companyemail" }), h("ptc-select", { "field-id": "contact-country", label: "Country*", "ptc-data-eloqua-name": "C_Country", "field-name": "country" }, h("ul", { class: "mdc-list" }, h("li", { class: "mdc-list-item placehoder-li", "data-value": "" }, h("span", { class: "mdc-list-item__ripple" }), h("span", { class: "mdc-list-item__text" }, "Select a country")), h("li", { class: "mdc-list-item", "data-value": "USA" }, h("span", { class: "mdc-list-item__ripple" }), h("span", { class: "mdc-list-item__text" }, "USA")), h("li", { class: "mdc-list-item", "data-value": "Canada" }, h("span", { class: "mdc-list-item__ripple" }), h("span", { class: "mdc-list-item__text" }, "Canada")), h("li", { class: "mdc-list-item", "data-value": "China" }, h("span", { class: "mdc-list-item__ripple" }), h("span", { class: "mdc-list-item__text" }, "China")))), h("ptc-textfield", { "field-id": "contact-phone", "label-text": "Phone*", type: "tel", "ptc-data-eloqua-name": "C_BusPhone", "field-name": "phone" }), h("ptc-select", { label: "What information are you interested in?*", "ptc-data-eloqua-name": "Inquiry_Reason", "field-name": "inquiryreason", "field-id": "contact-inquiry" }, h("ul", { class: "mdc-list" }, h("li", { class: "mdc-list-item", "data-value": "Please select a value" }, h("span", { class: "mdc-list-item__ripple" })), h("li", { class: "mdc-list-item", "data-value": "Augmented Reality (AR)" }, h("span", { class: "mdc-list-item__ripple" }), h("span", { class: "mdc-list-item__text" }, "Augmented Reality (AR)")), h("li", { class: "mdc-list-item", "data-value": "CAD" }, h("span", { class: "mdc-list-item__ripple" }), h("span", { class: "mdc-list-item__text" }, "Computer Aided Design")), h("li", { class: "mdc-list-item", "data-value": "Retail(FlexPLM)" }, h("span", { class: "mdc-list-item__ripple" }), h("span", { class: "mdc-list-item__text" }, "Fashion and Retail Product Lifecycle Management")))), h("ptc-multi-select", { items: multiSelectItems, "is-required": 'true' }), h("ptc-textfield", { "field-id": "Self-Reporting", "label-text": "How can we help you?*", type: "text", "ptc-data-eloqua-name": "HowHearSelfReport", "ptc-max-length": "100", "field-name": "howhearselfreport" }), h("ptc-form-checkbox", { label: "I agree to the policy", "checkbox-id": "test" }), h("div", { class: "button-wrapper" }, h("ptc-button", { class: "form-submit", color: "ptc-quaternary", type: "submit", styles: ":host{align-self:flex-end; display:block; float: left; width: fit-content;}" }, "Submit"), h("ptc-button", { class: "form-close", color: "ptc-tertiary", type: "button", styles: ":host{align-self:flex-end; display:block; float: left; width: fit-content;}" }, "Cancel")))))));
81
+ }
82
+ static get is() { return "modal-form-example"; }
83
+ static get originalStyleUrls() {
84
+ return {
85
+ "$": ["modal-form-example.css"]
86
+ };
87
+ }
88
+ static get styleUrls() {
89
+ return {
90
+ "$": ["modal-form-example.css"]
91
+ };
92
+ }
93
+ static get states() {
94
+ return {
95
+ "formData": {}
96
+ };
97
+ }
98
+ static get elementRef() { return "el"; }
99
+ }
@@ -81,10 +81,6 @@ ptc-link, ptc-square-card,
81
81
  :host .back-to-top-button:hover {
82
82
  opacity: 1;
83
83
  }
84
- :host .back-to-top-button:focus-visible {
85
- border-radius: var(--ptc-border-radius-standard);
86
- outline: 5px solid var(--keyboard-nav-outline);
87
- }
88
84
  :host .back-to-top-button-fixed {
89
85
  position: fixed;
90
86
  bottom: 140px;
@@ -64,21 +64,6 @@ export class PtcBackToTop {
64
64
  // Fallback for browsers that do not support smooth scrolling
65
65
  window.scrollTo(0, 0);
66
66
  }
67
- // Focus the first focusable element after a short delay to ensure scroll completes
68
- setTimeout(() => {
69
- const focusableSelector = [
70
- 'a[href]',
71
- 'button:not([disabled])',
72
- 'textarea:not([disabled])',
73
- 'input:not([type="hidden"]):not([disabled])',
74
- 'select:not([disabled])',
75
- '[tabindex]:not([tabindex="-1"])'
76
- ].join(',');
77
- const focusableElements = document.querySelectorAll(focusableSelector);
78
- if (focusableElements.length > 0) {
79
- focusableElements[1].focus();
80
- }
81
- }, 300);
82
67
  }
83
68
  render() {
84
69
  return (h(Host, null, this.showButton && (h("button", { class: 'back-to-top-button hyphenate-text', title: this.backToTop }, h("span", { class: 'arrow' }, h("svg", { width: "18", height: "12", viewBox: "0 0 18 12", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { d: "M15.5248 11.625L8.9998 5.1L2.4748 11.625L0.112305 9.2625L8.9998 0.375L17.8873 9.2625L15.5248 11.625Z", fill: "#323B42" }))), h("span", { class: 'text' }, this.backToTop)))));
@@ -82,26 +82,26 @@ a:focus-visible {
82
82
  border-radius: var(--ptc-border-radius-standard);
83
83
  }
84
84
 
85
- .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a), .light-links a.light-link, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a), .background-grey-10 a.light-link, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a), .background-plm-grey a.light-link {
85
+ .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a), .light-links a.light-link, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a), .background-grey-10 a.light-link, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a), .background-plm-grey a.light-link {
86
86
  color: var(--color-blue-04);
87
87
  margin: -2px;
88
88
  border: 2px solid transparent;
89
89
  }
90
- .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):visited, .light-links a.light-link:visited, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):visited, .background-grey-10 a.light-link:visited, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):visited, .background-plm-grey a.light-link:visited {
90
+ .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a):visited, .light-links a.light-link:visited, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a):visited, .background-grey-10 a.light-link:visited, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a):visited, .background-plm-grey a.light-link:visited {
91
91
  color: var(--color-blue-06);
92
92
  }
93
- .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):active, .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):visited:active, .light-links a.light-link:active, .light-links a.light-link:visited:active, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):active, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):visited:active, .background-grey-10 a.light-link:active, .background-grey-10 a.light-link:visited:active, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):active, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):visited:active, .background-plm-grey a.light-link:active, .background-plm-grey a.light-link:visited:active {
93
+ .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a):active, .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a):visited:active, .light-links a.light-link:active, .light-links a.light-link:visited:active, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a):active, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a):visited:active, .background-grey-10 a.light-link:active, .background-grey-10 a.light-link:visited:active, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a):active, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a):visited:active, .background-plm-grey a.light-link:active, .background-plm-grey a.light-link:visited:active {
94
94
  transition: none;
95
95
  color: var(--color-blue-07);
96
96
  }
97
- .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):hover, .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):visited:hover, .light-links a.light-link:hover, .light-links a.light-link:visited:hover, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):hover, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):visited:hover, .background-grey-10 a.light-link:hover, .background-grey-10 a.light-link:visited:hover, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):hover, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):visited:hover, .background-plm-grey a.light-link:hover, .background-plm-grey a.light-link:visited:hover {
97
+ .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a):hover, .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a):visited:hover, .light-links a.light-link:hover, .light-links a.light-link:visited:hover, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a):hover, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a):visited:hover, .background-grey-10 a.light-link:hover, .background-grey-10 a.light-link:visited:hover, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a):hover, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a):visited:hover, .background-plm-grey a.light-link:hover, .background-plm-grey a.light-link:visited:hover {
98
98
  color: var(--color-blue-05);
99
99
  }
100
- .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a).disabled, .light-links a.light-link.disabled, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a).disabled, .background-grey-10 a.light-link.disabled, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a).disabled, .background-plm-grey a.light-link.disabled {
100
+ .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a).disabled, .light-links a.light-link.disabled, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a).disabled, .background-grey-10 a.light-link.disabled, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a).disabled, .background-plm-grey a.light-link.disabled {
101
101
  color: var(--color-gray-04) !important;
102
102
  cursor: not-allowed;
103
103
  }
104
- .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):focus-visible, .light-links a.light-link:focus-visible, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):focus-visible, .background-grey-10 a.light-link:focus-visible, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):focus-visible, .background-plm-grey a.light-link:focus-visible {
104
+ .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a):focus-visible, .light-links a.light-link:focus-visible, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a):focus-visible, .background-grey-10 a.light-link:focus-visible, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a):focus-visible, .background-plm-grey a.light-link:focus-visible {
105
105
  border-radius: var(--ptc-border-radius-standard);
106
106
  border: 2px solid white;
107
107
  outline: 5px solid var(--keyboard-nav-outline);
@@ -181,10 +181,6 @@ a:focus-visible {
181
181
  transition: box-shadow 0.25s ease-out, -webkit-box-shadow 0.25s ease-out;
182
182
  background-color: var(--color-white);
183
183
  }
184
- :host .bio-card:focus-visible {
185
- border-radius: var(--ptc-border-radius-standard);
186
- outline: 5px solid var(--keyboard-nav-outline);
187
- }
188
184
  :host .bio-card .bio-card__image {
189
185
  max-width: 150px;
190
186
  min-width: 100px;
@@ -9,11 +9,8 @@ export class PtcBioCard {
9
9
  this.twitter = undefined;
10
10
  this.isModal = true;
11
11
  }
12
- openModal(e) {
12
+ openModal() {
13
13
  if (this.isModal) {
14
- //seting up the focus element when modal closed
15
- let modalRefFocus = this.el.shadowRoot.querySelector("#bio-modal");
16
- modalRefFocus.focusBackElement = e.target;
17
14
  this.showModal = true;
18
15
  }
19
16
  }
@@ -24,23 +21,11 @@ export class PtcBioCard {
24
21
  this.showModal = false;
25
22
  });
26
23
  }
27
- // Code for to stop opening the modal when clicked on social icons
28
- const socialIcons = this.el.shadowRoot.querySelectorAll('.bio-card__social-links .social-icon');
29
- const stopClickPropagation = (e) => {
30
- e.stopPropagation();
31
- };
32
- const stopEnterKeyPropagation = (e) => {
33
- if (e.key === 'Enter') {
34
- e.stopPropagation();
35
- }
36
- };
37
- socialIcons.forEach(icon => {
38
- icon.addEventListener('click', stopClickPropagation);
39
- icon.addEventListener('keydown', stopEnterKeyPropagation);
40
- });
41
24
  }
42
25
  render() {
43
- return (h(Host, { type: "button", class: this.isModal ? 'card-with-modal' : '' }, h("div", { class: "bio-card mf-listen", onClick: (e) => { this.openModal(e); }, tabIndex: 0, onKeyDown: (e) => { e.key === 'Enter' ? this.openModal(e) : null; } }, h("slot", { name: "seo-content" }), h("div", { class: "bio-card__image" }, h("img", { src: this.image, alt: `${this.name} profile image` })), h("div", { class: "bio-card__content" }, h("div", null, h("h3", { class: "bio-card__name" }, this.name), h("p", { class: "bio-card__job-title" }, this.jobTitle)), (this.linkedin || this.twitter) && (h("div", { class: "bio-card__social-links" }, this.linkedin && (h("a", { href: this.linkedin, target: "_blank", class: "tw social-icon mf-listen", "aria-label": "linkedin", title: "linkedin" }, h("style", null, `.social-icon .cls-1 { fill: url(#linear-gradient1-in); } `), h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "32", height: "36.794", viewBox: "0 0 32 36.794" }, h("defs", null, h("linearGradient", { id: "linear-gradient1-in", x1: ".5", x2: ".5", y2: "1", gradientUnits: "objectBoundingBox" }, h("stop", { offset: "0", "stop-color": "#fff" }), h("stop", { offset: "1", "stop-color": "#e5e5e5" }))), h("g", { class: "cls-1", "data-name": "Path 4255" }, h("path", { d: "M27.307 31.495H9.487L.578 15.998 9.487.5h17.82l8.91 15.498-8.91 15.497z", class: "cls-3", transform: "rotate(90 15.998 15.998)" }), h("path", { d: "M9.777 1L1.154 15.998l8.623 14.997h17.24l8.624-14.997L27.017 1H9.777M9.2 0h18.397l9.198 15.998-9.198 15.997H9.199L0 15.998 9.199 0z", class: "cls-4", transform: "rotate(90 15.998 15.998)" })), h("path", { d: "M-416.964 153.563h-2.487v-7.987h2.487zm-1.311-8.985h-.018a1.385 1.385 0 0 1-1.485-1.279v-.107a1.4 1.4 0 0 1 1.524-1.385 1.393 1.393 0 0 1 1.5 1.278v.107a1.4 1.4 0 0 1-1.521 1.386zm11.283 8.985h-2.842v-4.132c0-1.066-.441-1.819-1.421-1.819a1.422 1.422 0 0 0-1.35.977 1.82 1.82 0 0 0-.06.65v4.324h-2.778s.036-7.319 0-7.983h2.8v1.265a2.563 2.563 0 0 1 2.487-1.329c1.776 0 3.165 1.147 3.165 3.62z", class: "cls-2", "data-name": "Path 8769", transform: "translate(429.342 -128.977)" })))), this.twitter && (h("a", { href: this.twitter, target: "_blank", class: "tw social-icon mf-listen", "aria-label": "X", title: "X" }, h("style", null, `.social-icon .cls-1 { fill: url(#linear-gradient0-tw); } `), h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "32", height: "36.794", viewBox: "0 0 32 36.794" }, h("defs", null, h("linearGradient", { id: "linear-gradient0-tw", x1: ".5", x2: ".5", y2: "1", gradientUnits: "objectBoundingBox" }, h("stop", { offset: "0", "stop-color": "#fff" }), h("stop", { offset: "1", "stop-color": "#e5e5e5" }))), h("g", { class: "cls-1", "data-name": "Path 4255" }, h("path", { d: "M27.307 31.495H9.487L.578 15.998 9.487.5h17.82l8.91 15.498-8.91 15.497z", class: "cls-3", transform: "rotate(90 15.998 15.998)" }), h("path", { d: "M9.777 1L1.154 15.998l8.623 14.997h17.24l8.624-14.997L27.017 1H9.777M9.2 0h18.397l9.198 15.998-9.198 15.997H9.199L0 15.998 9.199 0z", class: "cls-4", transform: "rotate(90 15.998 15.998)" })), h("g", { transform: "translate(9.205 13.034) scale(0.13)", "data-name": "Group 3004" }, h("path", { class: "cls-x-1", d: "M57.95,42.55L88.66,6.86h-7.28l-26.67,31L33.42,6.86H8.86l32.21,46.87L8.86,91.16h7.28l28.16-32.73,22.49,32.73h24.56l-33.4-48.61h0ZM47.98,54.14l-3.26-4.67L18.76,12.33h11.18l20.95,29.97,3.26,4.67,27.24,38.96h-11.18l-22.23-31.79h0Z", width: "15", height: "15" }), h("rect", { class: "cls-x-2" }))))))))), this.isModal && (h("ptc-modal", { id: "bio-modal", show: this.showModal, size: "lg", "border-radius": 'large', "is-bio-modal": true, fixed: true }, h("div", { class: "modal-wrap" }, h("div", { class: "bio-modal-left" }, h("div", { class: "bio-modal__image" }, h("img", { src: this.image, alt: `${this.name} profile image` })), (this.linkedin || this.twitter) && (h("div", { class: "bio-card__social-links" }, this.linkedin && (h("a", { href: this.linkedin, target: "_blank", class: "tw social-icon", "aria-label": "linkedin" }, h("style", null, `.social-icon .cls-1 { fill: url(#linear-gradient1-in); } `), h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "32", height: "36.794", viewBox: "0 0 32 36.794" }, h("defs", null, h("linearGradient", { id: "linear-gradient1-in", x1: ".5", x2: ".5", y2: "1", gradientUnits: "objectBoundingBox" }, h("stop", { offset: "0", "stop-color": "#fff" }), h("stop", { offset: "1", "stop-color": "#e5e5e5" }))), h("g", { class: "cls-1", "data-name": "Path 4255" }, h("path", { d: "M27.307 31.495H9.487L.578 15.998 9.487.5h17.82l8.91 15.498-8.91 15.497z", class: "cls-3", transform: "rotate(90 15.998 15.998)" }), h("path", { d: "M9.777 1L1.154 15.998l8.623 14.997h17.24l8.624-14.997L27.017 1H9.777M9.2 0h18.397l9.198 15.998-9.198 15.997H9.199L0 15.998 9.199 0z", class: "cls-4", transform: "rotate(90 15.998 15.998)" })), h("path", { d: "M-416.964 153.563h-2.487v-7.987h2.487zm-1.311-8.985h-.018a1.385 1.385 0 0 1-1.485-1.279v-.107a1.4 1.4 0 0 1 1.524-1.385 1.393 1.393 0 0 1 1.5 1.278v.107a1.4 1.4 0 0 1-1.521 1.386zm11.283 8.985h-2.842v-4.132c0-1.066-.441-1.819-1.421-1.819a1.422 1.422 0 0 0-1.35.977 1.82 1.82 0 0 0-.06.65v4.324h-2.778s.036-7.319 0-7.983h2.8v1.265a2.563 2.563 0 0 1 2.487-1.329c1.776 0 3.165 1.147 3.165 3.62z", class: "cls-2", "data-name": "Path 8769", transform: "translate(429.342 -128.977)" })))), this.twitter && (h("a", { href: this.twitter, target: "_blank", class: "tw social-icon", "aria-label": "twitter" }, h("style", null, `.social-icon .cls-1 { fill: url(#linear-gradient0-tw); } `), h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "32", height: "36.794", viewBox: "0 0 32 36.794" }, h("defs", null, h("linearGradient", { id: "linear-gradient0-tw", x1: ".5", x2: ".5", y2: "1", gradientUnits: "objectBoundingBox" }, h("stop", { offset: "0", "stop-color": "#fff" }), h("stop", { offset: "1", "stop-color": "#e5e5e5" }))), h("g", { class: "cls-1", "data-name": "Path 4255" }, h("path", { d: "M27.307 31.495H9.487L.578 15.998 9.487.5h17.82l8.91 15.498-8.91 15.497z", class: "cls-3", transform: "rotate(90 15.998 15.998)" }), h("path", { d: "M9.777 1L1.154 15.998l8.623 14.997h17.24l8.624-14.997L27.017 1H9.777M9.2 0h18.397l9.198 15.998-9.198 15.997H9.199L0 15.998 9.199 0z", class: "cls-4", transform: "rotate(90 15.998 15.998)" })), h("g", { transform: "translate(9.205 13.034) scale(0.13)", "data-name": "Group 3004" }, h("path", { class: "cls-x-1", d: "M57.95,42.55L88.66,6.86h-7.28l-26.67,31L33.42,6.86H8.86l32.21,46.87L8.86,91.16h7.28l28.16-32.73,22.49,32.73h24.56l-33.4-48.61h0ZM47.98,54.14l-3.26-4.67L18.76,12.33h11.18l20.95,29.97,3.26,4.67,27.24,38.96h-11.18l-22.23-31.79h0Z", width: "15", height: "15" }), h("rect", { class: "cls-x-2" })))))))), h("div", { class: "bio-modal-right" }, h("div", { class: "bio-modal-header" }, h("h2", { class: "bio-card__name" }, this.name), h("p", { class: "bio-card__job-title" }, this.jobTitle)), h("div", { class: "bio-modal-description" }, h("slot", null))))))));
26
+ return (h(Host, { onClick: () => {
27
+ this.openModal();
28
+ }, type: "button", class: this.isModal ? 'card-with-modal' : '' }, h("div", { class: "bio-card" }, h("slot", { name: "seo-content" }), h("div", { class: "bio-card__image" }, h("img", { src: this.image, alt: `${this.name} profile image` })), h("div", { class: "bio-card__content" }, h("div", null, h("h3", { class: "bio-card__name" }, this.name), h("p", { class: "bio-card__job-title" }, this.jobTitle)), (this.linkedin || this.twitter) && (h("div", { class: "bio-card__social-links" }, this.linkedin && (h("a", { href: this.linkedin, target: "_blank", class: "tw social-icon", "aria-label": "linkedin", title: "linkedin" }, h("style", null, `.social-icon .cls-1 { fill: url(#linear-gradient1-in); } `), h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "32", height: "36.794", viewBox: "0 0 32 36.794" }, h("defs", null, h("linearGradient", { id: "linear-gradient1-in", x1: ".5", x2: ".5", y2: "1", gradientUnits: "objectBoundingBox" }, h("stop", { offset: "0", "stop-color": "#fff" }), h("stop", { offset: "1", "stop-color": "#e5e5e5" }))), h("g", { class: "cls-1", "data-name": "Path 4255" }, h("path", { d: "M27.307 31.495H9.487L.578 15.998 9.487.5h17.82l8.91 15.498-8.91 15.497z", class: "cls-3", transform: "rotate(90 15.998 15.998)" }), h("path", { d: "M9.777 1L1.154 15.998l8.623 14.997h17.24l8.624-14.997L27.017 1H9.777M9.2 0h18.397l9.198 15.998-9.198 15.997H9.199L0 15.998 9.199 0z", class: "cls-4", transform: "rotate(90 15.998 15.998)" })), h("path", { d: "M-416.964 153.563h-2.487v-7.987h2.487zm-1.311-8.985h-.018a1.385 1.385 0 0 1-1.485-1.279v-.107a1.4 1.4 0 0 1 1.524-1.385 1.393 1.393 0 0 1 1.5 1.278v.107a1.4 1.4 0 0 1-1.521 1.386zm11.283 8.985h-2.842v-4.132c0-1.066-.441-1.819-1.421-1.819a1.422 1.422 0 0 0-1.35.977 1.82 1.82 0 0 0-.06.65v4.324h-2.778s.036-7.319 0-7.983h2.8v1.265a2.563 2.563 0 0 1 2.487-1.329c1.776 0 3.165 1.147 3.165 3.62z", class: "cls-2", "data-name": "Path 8769", transform: "translate(429.342 -128.977)" })))), this.twitter && (h("a", { href: this.twitter, target: "_blank", class: "tw social-icon", "aria-label": "X", title: "X" }, h("style", null, `.social-icon .cls-1 { fill: url(#linear-gradient0-tw); } `), h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "32", height: "36.794", viewBox: "0 0 32 36.794" }, h("defs", null, h("linearGradient", { id: "linear-gradient0-tw", x1: ".5", x2: ".5", y2: "1", gradientUnits: "objectBoundingBox" }, h("stop", { offset: "0", "stop-color": "#fff" }), h("stop", { offset: "1", "stop-color": "#e5e5e5" }))), h("g", { class: "cls-1", "data-name": "Path 4255" }, h("path", { d: "M27.307 31.495H9.487L.578 15.998 9.487.5h17.82l8.91 15.498-8.91 15.497z", class: "cls-3", transform: "rotate(90 15.998 15.998)" }), h("path", { d: "M9.777 1L1.154 15.998l8.623 14.997h17.24l8.624-14.997L27.017 1H9.777M9.2 0h18.397l9.198 15.998-9.198 15.997H9.199L0 15.998 9.199 0z", class: "cls-4", transform: "rotate(90 15.998 15.998)" })), h("g", { transform: "translate(9.205 13.034) scale(0.13)", "data-name": "Group 3004" }, h("path", { class: "cls-x-1", d: "M57.95,42.55L88.66,6.86h-7.28l-26.67,31L33.42,6.86H8.86l32.21,46.87L8.86,91.16h7.28l28.16-32.73,22.49,32.73h24.56l-33.4-48.61h0ZM47.98,54.14l-3.26-4.67L18.76,12.33h11.18l20.95,29.97,3.26,4.67,27.24,38.96h-11.18l-22.23-31.79h0Z", width: "15", height: "15" }), h("rect", { class: "cls-x-2" }))))))))), this.isModal && (h("ptc-modal", { id: "bio-modal", show: this.showModal, size: "lg", "border-radius": 'large', "is-bio-modal": true, fixed: true }, h("div", { class: "modal-wrap" }, h("div", { class: "bio-modal-left" }, h("div", { class: "bio-modal__image" }, h("img", { src: this.image, alt: `${this.name} profile image` })), (this.linkedin || this.twitter) && (h("div", { class: "bio-card__social-links" }, this.linkedin && (h("a", { href: this.linkedin, target: "_blank", class: "tw social-icon", "aria-label": "linkedin" }, h("style", null, `.social-icon .cls-1 { fill: url(#linear-gradient1-in); } `), h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "32", height: "36.794", viewBox: "0 0 32 36.794" }, h("defs", null, h("linearGradient", { id: "linear-gradient1-in", x1: ".5", x2: ".5", y2: "1", gradientUnits: "objectBoundingBox" }, h("stop", { offset: "0", "stop-color": "#fff" }), h("stop", { offset: "1", "stop-color": "#e5e5e5" }))), h("g", { class: "cls-1", "data-name": "Path 4255" }, h("path", { d: "M27.307 31.495H9.487L.578 15.998 9.487.5h17.82l8.91 15.498-8.91 15.497z", class: "cls-3", transform: "rotate(90 15.998 15.998)" }), h("path", { d: "M9.777 1L1.154 15.998l8.623 14.997h17.24l8.624-14.997L27.017 1H9.777M9.2 0h18.397l9.198 15.998-9.198 15.997H9.199L0 15.998 9.199 0z", class: "cls-4", transform: "rotate(90 15.998 15.998)" })), h("path", { d: "M-416.964 153.563h-2.487v-7.987h2.487zm-1.311-8.985h-.018a1.385 1.385 0 0 1-1.485-1.279v-.107a1.4 1.4 0 0 1 1.524-1.385 1.393 1.393 0 0 1 1.5 1.278v.107a1.4 1.4 0 0 1-1.521 1.386zm11.283 8.985h-2.842v-4.132c0-1.066-.441-1.819-1.421-1.819a1.422 1.422 0 0 0-1.35.977 1.82 1.82 0 0 0-.06.65v4.324h-2.778s.036-7.319 0-7.983h2.8v1.265a2.563 2.563 0 0 1 2.487-1.329c1.776 0 3.165 1.147 3.165 3.62z", class: "cls-2", "data-name": "Path 8769", transform: "translate(429.342 -128.977)" })))), this.twitter && (h("a", { href: this.twitter, target: "_blank", class: "tw social-icon", "aria-label": "twitter" }, h("style", null, `.social-icon .cls-1 { fill: url(#linear-gradient0-tw); } `), h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "32", height: "36.794", viewBox: "0 0 32 36.794" }, h("defs", null, h("linearGradient", { id: "linear-gradient0-tw", x1: ".5", x2: ".5", y2: "1", gradientUnits: "objectBoundingBox" }, h("stop", { offset: "0", "stop-color": "#fff" }), h("stop", { offset: "1", "stop-color": "#e5e5e5" }))), h("g", { class: "cls-1", "data-name": "Path 4255" }, h("path", { d: "M27.307 31.495H9.487L.578 15.998 9.487.5h17.82l8.91 15.498-8.91 15.497z", class: "cls-3", transform: "rotate(90 15.998 15.998)" }), h("path", { d: "M9.777 1L1.154 15.998l8.623 14.997h17.24l8.624-14.997L27.017 1H9.777M9.2 0h18.397l9.198 15.998-9.198 15.997H9.199L0 15.998 9.199 0z", class: "cls-4", transform: "rotate(90 15.998 15.998)" })), h("g", { transform: "translate(9.205 13.034) scale(0.13)", "data-name": "Group 3004" }, h("path", { class: "cls-x-1", d: "M57.95,42.55L88.66,6.86h-7.28l-26.67,31L33.42,6.86H8.86l32.21,46.87L8.86,91.16h7.28l28.16-32.73,22.49,32.73h24.56l-33.4-48.61h0ZM47.98,54.14l-3.26-4.67L18.76,12.33h11.18l20.95,29.97,3.26,4.67,27.24,38.96h-11.18l-22.23-31.79h0Z", width: "15", height: "15" }), h("rect", { class: "cls-x-2" })))))))), h("div", { class: "bio-modal-right" }, h("div", { class: "bio-modal-header" }, h("h2", { class: "bio-card__name" }, this.name), h("p", { class: "bio-card__job-title" }, this.jobTitle)), h("div", { class: "bio-modal-description" }, h("slot", null))))))));
44
29
  }
45
30
  static get is() { return "ptc-bio-card"; }
46
31
  static get encapsulation() { return "shadow"; }
@@ -781,26 +781,26 @@ a:focus-visible {
781
781
  border-radius: var(--ptc-border-radius-standard);
782
782
  }
783
783
 
784
- .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a), .light-links a.light-link, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a), .background-grey-10 a.light-link, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a), .background-plm-grey a.light-link {
784
+ .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a), .light-links a.light-link, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a), .background-grey-10 a.light-link, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a), .background-plm-grey a.light-link {
785
785
  color: var(--color-blue-04);
786
786
  margin: -2px;
787
787
  border: 2px solid transparent;
788
788
  }
789
- .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):visited, .light-links a.light-link:visited, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):visited, .background-grey-10 a.light-link:visited, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):visited, .background-plm-grey a.light-link:visited {
789
+ .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a):visited, .light-links a.light-link:visited, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a):visited, .background-grey-10 a.light-link:visited, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a):visited, .background-plm-grey a.light-link:visited {
790
790
  color: var(--color-blue-06);
791
791
  }
792
- .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):active, .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):visited:active, .light-links a.light-link:active, .light-links a.light-link:visited:active, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):active, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):visited:active, .background-grey-10 a.light-link:active, .background-grey-10 a.light-link:visited:active, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):active, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):visited:active, .background-plm-grey a.light-link:active, .background-plm-grey a.light-link:visited:active {
792
+ .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a):active, .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a):visited:active, .light-links a.light-link:active, .light-links a.light-link:visited:active, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a):active, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a):visited:active, .background-grey-10 a.light-link:active, .background-grey-10 a.light-link:visited:active, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a):active, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a):visited:active, .background-plm-grey a.light-link:active, .background-plm-grey a.light-link:visited:active {
793
793
  transition: none;
794
794
  color: var(--color-blue-07);
795
795
  }
796
- .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):hover, .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):visited:hover, .light-links a.light-link:hover, .light-links a.light-link:visited:hover, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):hover, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):visited:hover, .background-grey-10 a.light-link:hover, .background-grey-10 a.light-link:visited:hover, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):hover, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):visited:hover, .background-plm-grey a.light-link:hover, .background-plm-grey a.light-link:visited:hover {
796
+ .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a):hover, .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a):visited:hover, .light-links a.light-link:hover, .light-links a.light-link:visited:hover, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a):hover, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a):visited:hover, .background-grey-10 a.light-link:hover, .background-grey-10 a.light-link:visited:hover, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a):hover, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a):visited:hover, .background-plm-grey a.light-link:hover, .background-plm-grey a.light-link:visited:hover {
797
797
  color: var(--color-blue-05);
798
798
  }
799
- .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a).disabled, .light-links a.light-link.disabled, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a).disabled, .background-grey-10 a.light-link.disabled, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a).disabled, .background-plm-grey a.light-link.disabled {
799
+ .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a).disabled, .light-links a.light-link.disabled, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a).disabled, .background-grey-10 a.light-link.disabled, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a).disabled, .background-plm-grey a.light-link.disabled {
800
800
  color: var(--color-gray-04) !important;
801
801
  cursor: not-allowed;
802
802
  }
803
- .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):focus-visible, .light-links a.light-link:focus-visible, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):focus-visible, .background-grey-10 a.light-link:focus-visible, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):focus-visible, .background-plm-grey a.light-link:focus-visible {
803
+ .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a):focus-visible, .light-links a.light-link:focus-visible, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a):focus-visible, .background-grey-10 a.light-link:focus-visible, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a):focus-visible, .background-plm-grey a.light-link:focus-visible {
804
804
  border-radius: var(--ptc-border-radius-standard);
805
805
  border: 2px solid white;
806
806
  outline: 5px solid var(--keyboard-nav-outline);
@@ -157,7 +157,11 @@ export class PtcCaseStudiesSlider {
157
157
  loop: false,
158
158
  grabCursor: true,
159
159
  effect: 'fade',
160
- autoplay: false,
160
+ autoplay: {
161
+ delay: 20000,
162
+ disableOnInteraction: false,
163
+ waitForTransition: true,
164
+ },
161
165
  thumbs: {
162
166
  swiper: this.caseStudiesThumbs,
163
167
  },
@@ -102,8 +102,8 @@ export class PtcContainer {
102
102
  "type": "string",
103
103
  "mutable": false,
104
104
  "complexType": {
105
- "original": "'xx-small' | 'x-small' | 'small' | 'medium' | 'large' | 'x-large' | 'xx-large' | 'xxx-large'",
106
- "resolved": "\"large\" | \"medium\" | \"small\" | \"x-large\" | \"x-small\" | \"xx-large\" | \"xx-small\" | \"xxx-large\"",
105
+ "original": "'xx-small' | 'x-small' | 'small' | 'medium' | 'large' | 'x-large' | 'xxx-large' | 'xxx-large'",
106
+ "resolved": "\"large\" | \"medium\" | \"small\" | \"x-large\" | \"x-small\" | \"xx-small\" | \"xxx-large\"",
107
107
  "references": {}
108
108
  },
109
109
  "required": false,
@@ -188,7 +188,7 @@ ptc-link, ptc-square-card,
188
188
  }
189
189
  @media only screen and (min-width: 1200px) {
190
190
  :host(.sequential) .card-dt-open:not([hidden]) {
191
- min-width: 600px;
191
+ min-width: 675px;
192
192
  }
193
193
  }
194
194
  :host(.sequential):host(.active) .card-mobile::before {
@@ -126,11 +126,6 @@ ptc-link, ptc-square-card,
126
126
  font-weight: var(--ptc-font-weight-extrabold);
127
127
  line-height: 35px;
128
128
  }
129
- @media only screen and (min-width: 480px) {
130
- :host .card.standard {
131
- width: 348px;
132
- }
133
- }
134
129
  @media only screen and (min-width: 768px) {
135
130
  :host .card:not(.alternate) {
136
131
  width: 100%;
@@ -140,15 +135,4 @@ ptc-link, ptc-square-card,
140
135
  :host .card.alternate {
141
136
  width: 100%;
142
137
  }
143
- }
144
-
145
- @media only screen and (min-width: 480px) {
146
- :host(.two-card) .card.alternate {
147
- width: 348px;
148
- }
149
- }
150
- @media only screen and (min-width: 768px) {
151
- :host(.two-card) .card.alternate {
152
- width: 100%;
153
- }
154
138
  }
@@ -82,26 +82,26 @@ a:focus-visible {
82
82
  border-radius: var(--ptc-border-radius-standard);
83
83
  }
84
84
 
85
- .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a), .light-links a.light-link, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a), .background-grey-10 a.light-link, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a), .background-plm-grey a.light-link {
85
+ .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a), .light-links a.light-link, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a), .background-grey-10 a.light-link, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a), .background-plm-grey a.light-link {
86
86
  color: var(--color-blue-04);
87
87
  margin: -2px;
88
88
  border: 2px solid transparent;
89
89
  }
90
- .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):visited, .light-links a.light-link:visited, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):visited, .background-grey-10 a.light-link:visited, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):visited, .background-plm-grey a.light-link:visited {
90
+ .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a):visited, .light-links a.light-link:visited, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a):visited, .background-grey-10 a.light-link:visited, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a):visited, .background-plm-grey a.light-link:visited {
91
91
  color: var(--color-blue-06);
92
92
  }
93
- .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):active, .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):visited:active, .light-links a.light-link:active, .light-links a.light-link:visited:active, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):active, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):visited:active, .background-grey-10 a.light-link:active, .background-grey-10 a.light-link:visited:active, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):active, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):visited:active, .background-plm-grey a.light-link:active, .background-plm-grey a.light-link:visited:active {
93
+ .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a):active, .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a):visited:active, .light-links a.light-link:active, .light-links a.light-link:visited:active, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a):active, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a):visited:active, .background-grey-10 a.light-link:active, .background-grey-10 a.light-link:visited:active, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a):active, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a):visited:active, .background-plm-grey a.light-link:active, .background-plm-grey a.light-link:visited:active {
94
94
  transition: none;
95
95
  color: var(--color-blue-07);
96
96
  }
97
- .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):hover, .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):visited:hover, .light-links a.light-link:hover, .light-links a.light-link:visited:hover, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):hover, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):visited:hover, .background-grey-10 a.light-link:hover, .background-grey-10 a.light-link:visited:hover, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):hover, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):visited:hover, .background-plm-grey a.light-link:hover, .background-plm-grey a.light-link:visited:hover {
97
+ .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a):hover, .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a):visited:hover, .light-links a.light-link:hover, .light-links a.light-link:visited:hover, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a):hover, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a):visited:hover, .background-grey-10 a.light-link:hover, .background-grey-10 a.light-link:visited:hover, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a):hover, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a):visited:hover, .background-plm-grey a.light-link:hover, .background-plm-grey a.light-link:visited:hover {
98
98
  color: var(--color-blue-05);
99
99
  }
100
- .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a).disabled, .light-links a.light-link.disabled, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a).disabled, .background-grey-10 a.light-link.disabled, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a).disabled, .background-plm-grey a.light-link.disabled {
100
+ .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a).disabled, .light-links a.light-link.disabled, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a).disabled, .background-grey-10 a.light-link.disabled, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a).disabled, .background-plm-grey a.light-link.disabled {
101
101
  color: var(--color-gray-04) !important;
102
102
  cursor: not-allowed;
103
103
  }
104
- .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):focus-visible, .light-links a.light-link:focus-visible, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):focus-visible, .background-grey-10 a.light-link:focus-visible, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):focus-visible, .background-plm-grey a.light-link:focus-visible {
104
+ .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a):focus-visible, .light-links a.light-link:focus-visible, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a):focus-visible, .background-grey-10 a.light-link:focus-visible, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a):focus-visible, .background-plm-grey a.light-link:focus-visible {
105
105
  border-radius: var(--ptc-border-radius-standard);
106
106
  border: 2px solid white;
107
107
  outline: 5px solid var(--keyboard-nav-outline);
@@ -139,26 +139,26 @@ a:focus-visible {
139
139
  border-radius: var(--ptc-border-radius-standard);
140
140
  }
141
141
 
142
- .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a), .light-links a.light-link, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a), .background-grey-10 a.light-link, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a), .background-plm-grey a.light-link {
142
+ .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a), .light-links a.light-link, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a), .background-grey-10 a.light-link, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a), .background-plm-grey a.light-link {
143
143
  color: var(--color-blue-04);
144
144
  margin: -2px;
145
145
  border: 2px solid transparent;
146
146
  }
147
- .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):visited, .light-links a.light-link:visited, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):visited, .background-grey-10 a.light-link:visited, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):visited, .background-plm-grey a.light-link:visited {
147
+ .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a):visited, .light-links a.light-link:visited, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a):visited, .background-grey-10 a.light-link:visited, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a):visited, .background-plm-grey a.light-link:visited {
148
148
  color: var(--color-blue-06);
149
149
  }
150
- .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):active, .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):visited:active, .light-links a.light-link:active, .light-links a.light-link:visited:active, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):active, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):visited:active, .background-grey-10 a.light-link:active, .background-grey-10 a.light-link:visited:active, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):active, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):visited:active, .background-plm-grey a.light-link:active, .background-plm-grey a.light-link:visited:active {
150
+ .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a):active, .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a):visited:active, .light-links a.light-link:active, .light-links a.light-link:visited:active, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a):active, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a):visited:active, .background-grey-10 a.light-link:active, .background-grey-10 a.light-link:visited:active, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a):active, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a):visited:active, .background-plm-grey a.light-link:active, .background-plm-grey a.light-link:visited:active {
151
151
  transition: none;
152
152
  color: var(--color-blue-07);
153
153
  }
154
- .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):hover, .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):visited:hover, .light-links a.light-link:hover, .light-links a.light-link:visited:hover, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):hover, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):visited:hover, .background-grey-10 a.light-link:hover, .background-grey-10 a.light-link:visited:hover, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):hover, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):visited:hover, .background-plm-grey a.light-link:hover, .background-plm-grey a.light-link:visited:hover {
154
+ .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a):hover, .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a):visited:hover, .light-links a.light-link:hover, .light-links a.light-link:visited:hover, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a):hover, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a):visited:hover, .background-grey-10 a.light-link:hover, .background-grey-10 a.light-link:visited:hover, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a):hover, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a):visited:hover, .background-plm-grey a.light-link:hover, .background-plm-grey a.light-link:visited:hover {
155
155
  color: var(--color-blue-05);
156
156
  }
157
- .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a).disabled, .light-links a.light-link.disabled, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a).disabled, .background-grey-10 a.light-link.disabled, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a).disabled, .background-plm-grey a.light-link.disabled {
157
+ .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a).disabled, .light-links a.light-link.disabled, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a).disabled, .background-grey-10 a.light-link.disabled, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a).disabled, .background-plm-grey a.light-link.disabled {
158
158
  color: var(--color-gray-04) !important;
159
159
  cursor: not-allowed;
160
160
  }
161
- .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):focus-visible, .light-links a.light-link:focus-visible, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):focus-visible, .background-grey-10 a.light-link:focus-visible, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):focus-visible, .background-plm-grey a.light-link:focus-visible {
161
+ .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a):focus-visible, .light-links a.light-link:focus-visible, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a):focus-visible, .background-grey-10 a.light-link:focus-visible, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a):focus-visible, .background-plm-grey a.light-link:focus-visible {
162
162
  border-radius: var(--ptc-border-radius-standard);
163
163
  border: 2px solid white;
164
164
  outline: 5px solid var(--keyboard-nav-outline);
@@ -134,9 +134,6 @@ ptc-link, ptc-square-card,
134
134
  margin-bottom: 0;
135
135
  }
136
136
 
137
- :host(.feature-callout-list) {
138
- padding-bottom: var(--ptc-element-spacing-04);
139
- }
140
137
  :host(.feature-callout-list) .ptc-icon-list .ptc-content-simple {
141
138
  margin: 0 0 0 var(--ptc-element-spacing-03);
142
139
  font-size: var(--ptc-font-size-x-small);
@@ -6,7 +6,6 @@ export class PtcInfoTile {
6
6
  this.styles = undefined;
7
7
  this.trackerId = undefined;
8
8
  this.accessibilityIndex = 0;
9
- this.target = "";
10
9
  }
11
10
  handleClick() {
12
11
  this.tileClick.emit();
@@ -32,7 +31,7 @@ export class PtcInfoTile {
32
31
  }
33
32
  render() {
34
33
  const content = (h("div", { class: "tile-content" }, h("span", { class: "tile-title-span" }, h("slot", { name: "tile-title" })), h("div", { class: "tile-title-desc" }, h("slot", { name: "tile-description" }))));
35
- return (h(Host, null, this.styles && h("style", null, this.styles), h("div", { id: this.trackerId, class: `tile ${this.variant}`, onClick: () => this.handleClick(), tabindex: this.accessibilityIndex }, this.variant === 'image' && (h("div", { class: "tile-image" }, h("slot", { name: "tile-image" }))), content, this.link && h("a", { href: this.link, class: "link-overlay link-press", tabindex: "-1", target: this.target }))));
34
+ return (h(Host, null, this.styles && h("style", null, this.styles), h("div", { id: this.trackerId, class: `tile ${this.variant}`, onClick: () => this.handleClick(), tabindex: this.accessibilityIndex }, this.variant === 'image' && (h("div", { class: "tile-image" }, h("slot", { name: "tile-image" }))), content, this.link && h("a", { href: this.link, class: "link-overlay link-press", tabindex: "-1" }))));
36
35
  }
37
36
  static get is() { return "ptc-info-tile"; }
38
37
  static get encapsulation() { return "shadow"; }
@@ -133,24 +132,6 @@ export class PtcInfoTile {
133
132
  "attribute": "accessibility-index",
134
133
  "reflect": false,
135
134
  "defaultValue": "0"
136
- },
137
- "target": {
138
- "type": "string",
139
- "mutable": false,
140
- "complexType": {
141
- "original": "string",
142
- "resolved": "string",
143
- "references": {}
144
- },
145
- "required": false,
146
- "optional": false,
147
- "docs": {
148
- "tags": [],
149
- "text": ""
150
- },
151
- "attribute": "target",
152
- "reflect": false,
153
- "defaultValue": "\"\""
154
135
  }
155
136
  };
156
137
  }
@@ -1198,26 +1198,26 @@ a:focus-visible {
1198
1198
  border-radius: var(--ptc-border-radius-standard);
1199
1199
  }
1200
1200
 
1201
- .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a), .light-links a.light-link, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a), .background-grey-10 a.light-link, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a), .background-plm-grey a.light-link {
1201
+ .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a), .light-links a.light-link, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a), .background-grey-10 a.light-link, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a), .background-plm-grey a.light-link {
1202
1202
  color: var(--color-blue-04);
1203
1203
  margin: -2px;
1204
1204
  border: 2px solid transparent;
1205
1205
  }
1206
- .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):visited, .light-links a.light-link:visited, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):visited, .background-grey-10 a.light-link:visited, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):visited, .background-plm-grey a.light-link:visited {
1206
+ .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a):visited, .light-links a.light-link:visited, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a):visited, .background-grey-10 a.light-link:visited, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a):visited, .background-plm-grey a.light-link:visited {
1207
1207
  color: var(--color-blue-06);
1208
1208
  }
1209
- .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):active, .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):visited:active, .light-links a.light-link:active, .light-links a.light-link:visited:active, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):active, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):visited:active, .background-grey-10 a.light-link:active, .background-grey-10 a.light-link:visited:active, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):active, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):visited:active, .background-plm-grey a.light-link:active, .background-plm-grey a.light-link:visited:active {
1209
+ .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a):active, .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a):visited:active, .light-links a.light-link:active, .light-links a.light-link:visited:active, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a):active, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a):visited:active, .background-grey-10 a.light-link:active, .background-grey-10 a.light-link:visited:active, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a):active, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a):visited:active, .background-plm-grey a.light-link:active, .background-plm-grey a.light-link:visited:active {
1210
1210
  transition: none;
1211
1211
  color: var(--color-blue-07);
1212
1212
  }
1213
- .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):hover, .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):visited:hover, .light-links a.light-link:hover, .light-links a.light-link:visited:hover, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):hover, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):visited:hover, .background-grey-10 a.light-link:hover, .background-grey-10 a.light-link:visited:hover, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):hover, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):visited:hover, .background-plm-grey a.light-link:hover, .background-plm-grey a.light-link:visited:hover {
1213
+ .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a):hover, .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a):visited:hover, .light-links a.light-link:hover, .light-links a.light-link:visited:hover, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a):hover, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a):visited:hover, .background-grey-10 a.light-link:hover, .background-grey-10 a.light-link:visited:hover, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a):hover, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a):visited:hover, .background-plm-grey a.light-link:hover, .background-plm-grey a.light-link:visited:hover {
1214
1214
  color: var(--color-blue-05);
1215
1215
  }
1216
- .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a).disabled, .light-links a.light-link.disabled, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a).disabled, .background-grey-10 a.light-link.disabled, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a).disabled, .background-plm-grey a.light-link.disabled {
1216
+ .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a).disabled, .light-links a.light-link.disabled, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a).disabled, .background-grey-10 a.light-link.disabled, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a).disabled, .background-plm-grey a.light-link.disabled {
1217
1217
  color: var(--color-gray-04) !important;
1218
1218
  cursor: not-allowed;
1219
1219
  }
1220
- .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):focus-visible, .light-links a.light-link:focus-visible, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):focus-visible, .background-grey-10 a.light-link:focus-visible, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):focus-visible, .background-plm-grey a.light-link:focus-visible {
1220
+ .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a):focus-visible, .light-links a.light-link:focus-visible, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a):focus-visible, .background-grey-10 a.light-link:focus-visible, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a):focus-visible, .background-plm-grey a.light-link:focus-visible {
1221
1221
  border-radius: var(--ptc-border-radius-standard);
1222
1222
  border: 2px solid white;
1223
1223
  outline: 5px solid var(--keyboard-nav-outline);
@@ -82,6 +82,7 @@ ptc-link, ptc-square-card,
82
82
  align-content: flex-end;
83
83
  z-index: 50020;
84
84
  transform: translateY(-100%);
85
+ position: relative;
85
86
  }
86
87
  @media only screen and (min-width: 992px) {
87
88
  .wrapper .modal-popup {
@@ -97,6 +98,9 @@ ptc-link, ptc-square-card,
97
98
  .wrapper .modal-popup.xl {
98
99
  max-width: 64.0625rem;
99
100
  }
101
+ .wrapper .modal-popup.fit-content {
102
+ max-width: fit-content;
103
+ }
100
104
  .wrapper .modal-popup.max {
101
105
  width: calc(100% - 4rem);
102
106
  max-width: 75rem;