@designcrowd/library.brand-page 6.2.0 → 6.2.1

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 (121) hide show
  1. package/lib/src/{CreatedOnBrandCrowd-de-de-VQCQvlMg.js → CreatedOnBrandCrowd-de-de-CtvPtYF6.js} +1 -1
  2. package/lib/src/{CreatedOnBrandCrowd-en-us-DSf3BjCG.js → CreatedOnBrandCrowd-en-us-eGF-EjAX.js} +1 -1
  3. package/lib/src/{CreatedOnBrandCrowd-es-es-DGcdM9Ec.js → CreatedOnBrandCrowd-es-es-CSemsOtT.js} +1 -1
  4. package/lib/src/{CreatedOnBrandCrowd-fr-fr-C9g1fc39.js → CreatedOnBrandCrowd-fr-ca-DzylX-AT.js} +1 -1
  5. package/lib/src/{CreatedOnBrandCrowd-fr-ca-C9g1fc39.js → CreatedOnBrandCrowd-fr-fr-DzylX-AT.js} +1 -1
  6. package/lib/src/{CreatedOnBrandCrowd-pt-pt-DSXr7Bxl.js → CreatedOnBrandCrowd-pt-br-QMUxXQsE.js} +1 -1
  7. package/lib/src/{CreatedOnBrandCrowd-pt-br-DSXr7Bxl.js → CreatedOnBrandCrowd-pt-pt-QMUxXQsE.js} +1 -1
  8. package/lib/src/{CreatedOnDcom-de-de-BPdCL6wS.js → CreatedOnDcom-de-de-M7OoJt-1.js} +1 -1
  9. package/lib/src/{CreatedOnDcom-en-us-CLkSTQRu.js → CreatedOnDcom-en-us-D7hMM0AI.js} +1 -1
  10. package/lib/src/{CreatedOnDcom-es-es-CRknMAGv.js → CreatedOnDcom-es-es-CLw-BLp2.js} +1 -1
  11. package/lib/src/{CreatedOnDcom-fr-ca-ClAY_dHI.js → CreatedOnDcom-fr-ca-BRu_kmeu.js} +1 -1
  12. package/lib/src/{CreatedOnDcom-fr-fr-DQtv9rR-.js → CreatedOnDcom-fr-fr-IMnEv_yM.js} +1 -1
  13. package/lib/src/{CreatedOnDcom-pt-br-BbIxvmxv.js → CreatedOnDcom-pt-br-Bt6v1p27.js} +1 -1
  14. package/lib/src/{CreatedOnDcom-pt-pt-BOfOesBj.js → CreatedOnDcom-pt-pt-BVsFJIJg.js} +1 -1
  15. package/lib/src/brand-page/components/navigation/navigation-side-menu/NavigationSideMenu.mixin.d.ts +16 -2
  16. package/lib/src/brand-page/components/navigation/navigation-side-menu/NavigationSideMenu.mixin.js +17 -0
  17. package/lib/src/brand-page/components/page/Page.mixin.d.ts +2 -1
  18. package/lib/src/brand-page/components/page/Page.mixin.js +12 -7
  19. package/lib/src/brand-page/components/page-header/HeaderLayout.stories.d.ts +1 -0
  20. package/lib/src/brand-page/components/page-header/HeaderLayout.stories.js +9 -0
  21. package/lib/src/brand-page/components/page-header/PageHeader.mixin.d.ts +3 -1
  22. package/lib/src/brand-page/components/page-header/PageHeader.mixin.js +10 -4
  23. package/lib/src/brand-page/constants/sections/header-display.constants.d.ts +3 -0
  24. package/lib/src/brand-page/constants/sections/header-display.constants.js +15 -0
  25. package/lib/src/brand-page/models/index.d.ts +12 -0
  26. package/lib/src/brand-page/models/index.js +4 -0
  27. package/lib/src/brand-page/utils/context.util.d.ts +1 -0
  28. package/lib/src/brand-page/utils/context.util.js +9 -0
  29. package/lib/src/brand-page/utils/route.util.d.ts +1 -0
  30. package/lib/src/brand-page/utils/route.util.js +9 -0
  31. package/lib/src/brand-page/utils/view-model.util.js +53 -1
  32. package/lib/src/brand-page/view-models.d.ts +3 -1
  33. package/lib/src/brand-page-maker/components/brand-page-maker/BrandPageMaker.mixin.d.ts +2 -1
  34. package/lib/src/brand-page-maker/components/brandpage-maker-page/BrandPageMakerPage.mixin.d.ts +2 -1
  35. package/lib/src/brand-page-maker/stores/ai-checkpoint/ai-checkpoint-store.d.ts +1626 -0
  36. package/lib/src/brand-page-maker/validators/section-button.validator.d.ts +5 -2
  37. package/lib/src/brand-page-maker/validators/section-button.validator.js +11 -15
  38. package/lib/src/{bundled-translations-B2q5GWTQ.js → bundled-translations-KY0aSmMp.js} +9 -9
  39. package/lib/src/{bundled-translations.de-DE-FhH2H_rd.js → bundled-translations.de-DE-BIFi4bYj.js} +9 -9
  40. package/lib/src/{bundled-translations.es-ES-_ZExxMi7.js → bundled-translations.es-ES-CHlKuPLO.js} +5 -5
  41. package/lib/src/{bundled-translations.fr-CA-Tg-ODIiC.js → bundled-translations.fr-CA-DR1fvm8e.js} +1 -1
  42. package/lib/src/{bundled-translations.fr-FR-C0sU51Mz.js → bundled-translations.fr-FR-DnpWVIQg.js} +9 -9
  43. package/lib/src/{bundled-translations.pt-BR-MYFIhA4u.js → bundled-translations.pt-BR-p8szTOiT.js} +17 -17
  44. package/lib/src/{bundled-translations.pt-PT-DeUBSzCB.js → bundled-translations.pt-PT-DEk39NhW.js} +22 -22
  45. package/lib/src/bundles/bundled-translations.de-DE.json +6 -1
  46. package/lib/src/bundles/bundled-translations.es-ES.json +6 -1
  47. package/lib/src/bundles/bundled-translations.fr-CA.json +6 -1
  48. package/lib/src/bundles/bundled-translations.fr-FR.json +6 -1
  49. package/lib/src/bundles/bundled-translations.json +6 -1
  50. package/lib/src/bundles/bundled-translations.pt-BR.json +6 -1
  51. package/lib/src/bundles/bundled-translations.pt-PT.json +6 -1
  52. package/lib/src/css/library.brand-page-brandCrowd.min.css +573 -135
  53. package/lib/src/css/library.brand-page-brandPage.min.css +573 -135
  54. package/lib/src/css/library.brand-page-designCom.min.css +573 -135
  55. package/lib/src/css/library.brand-page-preview.min.css +573 -135
  56. package/lib/src/index.mjs +1 -1
  57. package/lib/src/{lib-BMVF4uNy.js → lib-B38VVCSw.js} +20304 -19843
  58. package/lib/src/shared/content-settings/components/content-settings/ContentSettings.mixin.d.ts +2 -1
  59. package/lib/src/shared/content-settings/components/content-settings/ReplaceImageSettingsForContent.mixin.d.ts +1 -1
  60. package/lib/src/shared/content-settings/components/content-settings-item/ContentSettingsItemField.mixin.d.ts +1 -1
  61. package/lib/src/shared/content-settings/components/payment-config-field/PaymentConfigField.mixin.d.ts +1 -1
  62. package/lib/src/shared/content-settings/components/text-field/TextField.mixin.d.ts +14 -2
  63. package/lib/src/shared/content-settings/components/text-field/TextField.mixin.js +14 -0
  64. package/lib/src/shared/logo-settings/components/LogoSettings.mixin.d.ts +1 -1
  65. package/lib/src/shared/page-navigation/store/page-navigation-store.d.ts +1 -0
  66. package/lib/src/shared/page-navigation/store/page-navigation-store.js +12 -0
  67. package/lib/src/shared/page-settings/components/delete-page-modal/DeletePageModal.mixin.d.ts +1 -1
  68. package/lib/src/shared/page-settings/components/new-page-modal/NewPageModal.mixin.d.ts +2 -1
  69. package/lib/src/shared/page-settings/components/page-settings/PageSettings.mixin.d.ts +190 -1
  70. package/lib/src/shared/page-settings/components/page-settings-section-styles/PageSettingsSectionStyles.mixin.d.ts +184 -2
  71. package/lib/src/shared/page-settings/components/page-settings-section-styles/PageSettingsSectionStyles.mixin.js +34 -2
  72. package/lib/src/shared/page-settings/store/page-settings-store.d.ts +2 -2
  73. package/lib/src/shared/style-settings/components/StyleSettings.mixin.d.ts +3 -0
  74. package/package.json +2 -2
  75. package/src/brand-page/components/navigation/hamburger/HamburgerNavigation.vue +1 -0
  76. package/src/brand-page/components/navigation/navigation-side-menu/NavigationSideMenu.mixin.ts +18 -1
  77. package/src/brand-page/components/navigation/navigation-side-menu/NavigationSideMenu.vue +73 -3
  78. package/src/brand-page/components/navigation/navigation-side-menu/NavigationSideMenu.vue.test.ts +181 -0
  79. package/src/brand-page/components/page/Page.mixin.ts +21 -11
  80. package/src/brand-page/components/page/Page.vue +2 -0
  81. package/src/brand-page/components/page-header/HeaderLayout.stories.ts +10 -0
  82. package/src/brand-page/components/page-header/HeaderLayout.vue +415 -71
  83. package/src/brand-page/components/page-header/PageHeader.mixin.ts +14 -10
  84. package/src/brand-page/components/page-header/PageHeader.vue +16 -1
  85. package/src/brand-page/components/page-header/PageHeader.vue.test.ts +339 -0
  86. package/src/brand-page/constants/sections/header-display.constants.test.ts +44 -0
  87. package/src/brand-page/constants/sections/header-display.constants.ts +35 -0
  88. package/src/brand-page/models/header-button.model.test.ts +85 -0
  89. package/src/brand-page/models/index.ts +19 -0
  90. package/src/brand-page/utils/context.util.ts +15 -0
  91. package/src/brand-page/utils/route.util.ts +13 -0
  92. package/src/brand-page/utils/view-model.util.test.ts +151 -1
  93. package/src/brand-page/utils/view-model.util.ts +73 -1
  94. package/src/brand-page/view-models.ts +3 -0
  95. package/src/brand-page-maker/validators/section-button.validator.ts +23 -19
  96. package/src/bundles/bundled-translations.de-DE.json +6 -1
  97. package/src/bundles/bundled-translations.es-ES.json +6 -1
  98. package/src/bundles/bundled-translations.fr-CA.json +6 -1
  99. package/src/bundles/bundled-translations.fr-FR.json +6 -1
  100. package/src/bundles/bundled-translations.json +6 -1
  101. package/src/bundles/bundled-translations.pt-BR.json +6 -1
  102. package/src/bundles/bundled-translations.pt-PT.json +6 -1
  103. package/src/shared/content-settings/components/text-field/TextField.mixin.ts +15 -0
  104. package/src/shared/content-settings/components/url-field/UrlField.vue +1 -0
  105. package/src/shared/page-navigation/store/page-navigation-store.ts +16 -0
  106. package/src/shared/page-settings/components/header-settings-panel/HeaderSettingsPanel.button-section.test.ts +131 -0
  107. package/src/shared/page-settings/components/header-settings-panel/HeaderSettingsPanel.vue +65 -10
  108. package/src/shared/page-settings/components/page-settings-section-styles/HeaderButtonSettings.test.ts +305 -0
  109. package/src/shared/page-settings/components/page-settings-section-styles/HeaderButtonSettings.vue +265 -0
  110. package/src/shared/page-settings/components/page-settings-section-styles/HeaderDisplayStyle.test.ts +354 -0
  111. package/src/shared/page-settings/components/page-settings-section-styles/HeaderDisplayStyle.vue +48 -9
  112. package/src/shared/page-settings/components/page-settings-section-styles/PageSettingsSectionStyles.mixin.header-button.test.ts +114 -0
  113. package/src/shared/page-settings/components/page-settings-section-styles/PageSettingsSectionStyles.mixin.ts +38 -1
  114. package/src/shared/page-settings/components/page-settings-section-styles/i18n/page-settings-section.de-DE.json +6 -1
  115. package/src/shared/page-settings/components/page-settings-section-styles/i18n/page-settings-section.es-ES.json +6 -1
  116. package/src/shared/page-settings/components/page-settings-section-styles/i18n/page-settings-section.fr-CA.json +6 -1
  117. package/src/shared/page-settings/components/page-settings-section-styles/i18n/page-settings-section.fr-FR.json +6 -1
  118. package/src/shared/page-settings/components/page-settings-section-styles/i18n/page-settings-section.json +6 -1
  119. package/src/shared/page-settings/components/page-settings-section-styles/i18n/page-settings-section.pt-BR.json +6 -1
  120. package/src/shared/page-settings/components/page-settings-section-styles/i18n/page-settings-section.pt-PT.json +6 -1
  121. package/src/shared/page-settings/store/page-settings-store.ts +2 -0
@@ -792,6 +792,9 @@ a.maker-anchor {
792
792
  .tw-col-span-8 {
793
793
  grid-column: span 8 / span 8;
794
794
  }
795
+ .tw-float-right {
796
+ float: right;
797
+ }
795
798
  .tw-float-left {
796
799
  float: left;
797
800
  }
@@ -2025,6 +2028,9 @@ a.maker-anchor {
2025
2028
  .tw-grid-cols-7 {
2026
2029
  grid-template-columns: repeat(7, minmax(0, 1fr));
2027
2030
  }
2031
+ .tw-grid-rows-2 {
2032
+ grid-template-rows: repeat(2, minmax(0, 1fr));
2033
+ }
2028
2034
  .tw-flex-row {
2029
2035
  -webkit-box-orient: horizontal;
2030
2036
  -webkit-box-direction: normal;
@@ -2112,6 +2118,9 @@ a.maker-anchor {
2112
2118
  -ms-flex-pack: justify;
2113
2119
  justify-content: space-between;
2114
2120
  }
2121
+ .tw-justify-items-center {
2122
+ justify-items: center;
2123
+ }
2115
2124
  .tw-gap-0 {
2116
2125
  gap: 0px;
2117
2126
  }
@@ -7755,93 +7764,96 @@ select[data-v-665b8067] {
7755
7764
  margin: 0 auto;
7756
7765
  }
7757
7766
 
7758
- .root[data-v-32fe142c] {
7759
- --logo-width: var(--v5fd54c9a);
7767
+ .root[data-v-c23d864e] {
7768
+ --logo-width: var(--v62a07554);
7760
7769
  --logo-max-width: 20rem;
7761
7770
  --tab-nav-height: 56px;
7762
7771
  --hamburger-nav-height: 32px;
7763
7772
  --hamburger-nav-width: 32px;
7764
7773
  }
7765
- .layout[data-v-32fe142c] {
7766
- -webkit-box-align: center;
7767
- -ms-flex-align: center;
7768
- align-items: center;
7769
- }
7770
- .nav-container[data-v-32fe142c] {
7774
+ .nav-container[data-v-c23d864e] {
7771
7775
  max-width: 100%;
7772
7776
  overflow: hidden;
7773
7777
  }
7774
- .logo-container[data-v-32fe142c] {
7778
+ .logo-container[data-v-c23d864e] {
7779
+ }
7780
+ /* The rules below position this box; the button just fills whatever box it gets.
7781
+ Never shrinks below its label: in the flex placements a wide nav compresses into its
7782
+ carousel instead of wrapping the button's text (the grid placements floor it likewise). */
7783
+ .cta-container[data-v-c23d864e] {
7784
+ min-width: 0px;
7785
+ -ms-flex-negative: 0;
7786
+ flex-shrink: 0;
7775
7787
  }
7776
7788
 
7777
7789
  /* DESKTOP_TAB_1 */
7778
- .desktop-tab-horizontal-stack-left-logo-right-menu[data-v-32fe142c] {
7790
+ .desktop-tab-horizontal-stack-left-logo-right-menu[data-v-c23d864e] {
7779
7791
  display: -webkit-box;
7780
7792
  display: -ms-flexbox;
7781
7793
  display: flex;
7782
7794
  }
7783
- .desktop-tab-horizontal-stack-left-logo-right-menu .nav-container[data-v-32fe142c] {
7784
- -webkit-box-flex: 1;
7785
- -ms-flex: 1;
7786
- flex: 1;
7795
+ .desktop-tab-horizontal-stack-left-logo-right-menu .nav-container[data-v-c23d864e] {
7787
7796
  margin-left: 1rem;
7797
+ -webkit-box-flex: 1;
7798
+ -ms-flex: 1 1 0%;
7799
+ flex: 1 1 0%;
7788
7800
  }
7789
- .desktop-tab-horizontal-stack-left-logo-right-menu .nav-container__inner[data-v-32fe142c] {
7790
- display: inline-block;
7801
+ .desktop-tab-horizontal-stack-left-logo-right-menu .nav-container__inner[data-v-c23d864e] {
7791
7802
  float: right;
7803
+ display: inline-block;
7792
7804
  max-width: 100%;
7793
7805
  }
7794
7806
 
7795
7807
  /* DESKTOP_TAB_2 */
7796
- .desktop-tab-horizontal-stack-left-logo-left-menu[data-v-32fe142c] {
7808
+ .desktop-tab-horizontal-stack-left-logo-left-menu[data-v-c23d864e] {
7797
7809
  display: -webkit-box;
7798
7810
  display: -ms-flexbox;
7799
7811
  display: flex;
7800
7812
  }
7801
- .desktop-tab-horizontal-stack-left-logo-left-menu .nav-container[data-v-32fe142c] {
7802
- -webkit-box-flex: 1;
7803
- -ms-flex: 1;
7804
- flex: 1;
7813
+ .desktop-tab-horizontal-stack-left-logo-left-menu .nav-container[data-v-c23d864e] {
7805
7814
  margin-left: 1rem;
7815
+ -webkit-box-flex: 1;
7816
+ -ms-flex: 1 1 0%;
7817
+ flex: 1 1 0%;
7806
7818
  }
7807
- .desktop-tab-horizontal-stack-left-logo-left-menu .nav-container__inner[data-v-32fe142c] {
7819
+ .desktop-tab-horizontal-stack-left-logo-left-menu .nav-container__inner[data-v-c23d864e] {
7808
7820
  display: inline-block;
7809
7821
  max-width: 100%;
7810
7822
  }
7811
7823
 
7812
7824
  /* DESKTOP_TAB_3 */
7813
- .desktop-tab-horizontal-stack-left-logo-centered-menu[data-v-32fe142c] {
7825
+ .desktop-tab-horizontal-stack-left-logo-centered-menu[data-v-c23d864e] {
7814
7826
  display: grid;
7815
7827
  grid-template-columns:
7816
7828
  [logo-start] var(--logo-max-width) [logo-end nav-start] 1fr [nav-end] var(
7817
7829
  --logo-max-width
7818
7830
  )
7819
7831
  [cols-end];
7832
+ margin-top: 1rem;
7833
+ margin-bottom: 1rem;
7820
7834
  -webkit-column-gap: 1rem;
7821
7835
  -moz-column-gap: 1rem;
7822
7836
  column-gap: 1rem;
7823
- margin-top: 1rem;
7824
- margin-bottom: 1rem;
7825
7837
  }
7826
- .desktop-tab-horizontal-stack-left-logo-centered-menu .logo-container[data-v-32fe142c] {
7838
+ .desktop-tab-horizontal-stack-left-logo-centered-menu .logo-container[data-v-c23d864e] {
7827
7839
  grid-column: logo-start / logo-end;
7828
7840
  justify-self: start;
7829
7841
  }
7830
- .desktop-tab-horizontal-stack-left-logo-centered-menu .nav-container[data-v-32fe142c] {
7842
+ .desktop-tab-horizontal-stack-left-logo-centered-menu .nav-container[data-v-c23d864e] {
7831
7843
  grid-column: nav-start / nav-end;
7832
7844
  }
7833
- .desktop-tab-horizontal-stack-left-logo-centered-menu .nav-container__inner[data-v-32fe142c] {
7845
+ .desktop-tab-horizontal-stack-left-logo-centered-menu .nav-container__inner[data-v-c23d864e] {
7834
7846
  /* start - center content */
7835
7847
  display: inline-block;
7836
7848
  -webkit-transform: translateX(-50%);
7837
7849
  transform: translateX(-50%);
7838
- left: 50%;
7839
7850
  position: relative;
7851
+ left: 50%;
7840
7852
  max-width: 100%;
7841
7853
  /* end - center content */
7842
7854
  }
7843
7855
  /* DESKTOP_TAB_4 */
7844
- .desktop-tab-horizontal-stack-centered-logo-right-menu[data-v-32fe142c] {
7856
+ .desktop-tab-horizontal-stack-centered-logo-right-menu[data-v-c23d864e] {
7845
7857
  display: grid;
7846
7858
  -webkit-column-gap: 1rem;
7847
7859
  -moz-column-gap: 1rem;
@@ -7850,26 +7862,26 @@ select[data-v-665b8067] {
7850
7862
  [col-start] 1fr [logo-start] var(--logo-max-width)
7851
7863
  [logo-end nav-start] 1fr [nav-end];
7852
7864
  }
7853
- .desktop-tab-horizontal-stack-centered-logo-right-menu .logo-container[data-v-32fe142c] {
7865
+ .desktop-tab-horizontal-stack-centered-logo-right-menu .logo-container[data-v-c23d864e] {
7854
7866
  grid-column: logo-start / logo-end;
7855
7867
  }
7856
- .desktop-tab-horizontal-stack-centered-logo-right-menu .nav-container[data-v-32fe142c] {
7868
+ .desktop-tab-horizontal-stack-centered-logo-right-menu .nav-container[data-v-c23d864e] {
7857
7869
  grid-column: nav-start / nav-end;
7858
7870
  }
7859
- .desktop-tab-horizontal-stack-centered-logo-right-menu .nav-container__inner[data-v-32fe142c] {
7871
+ .desktop-tab-horizontal-stack-centered-logo-right-menu .nav-container__inner[data-v-c23d864e] {
7860
7872
  /* start - align right content */
7861
7873
  float: right;
7862
7874
  max-width: 100%;
7863
7875
  /* end - align right content */
7864
7876
  }
7865
7877
  /* DESKTOP_TAB_5 */
7866
- .desktop-tab-vertical-stack-centered-logo-centered-menu[data-v-32fe142c] {
7878
+ .desktop-tab-vertical-stack-centered-logo-centered-menu[data-v-c23d864e] {
7867
7879
  -webkit-box-align: center;
7868
7880
  -ms-flex-align: center;
7869
7881
  align-items: center;
7870
7882
  justify-items: center;
7871
7883
  }
7872
- .desktop-tab-vertical-stack-centered-logo-centered-menu.show-nav[data-v-32fe142c] {
7884
+ .desktop-tab-vertical-stack-centered-logo-centered-menu.show-nav[data-v-c23d864e] {
7873
7885
  display: grid;
7874
7886
  grid-template-rows: repeat(2, minmax(0, 1fr));
7875
7887
  row-gap: 1rem;
@@ -7878,24 +7890,24 @@ select[data-v-665b8067] {
7878
7890
  [row2-end];
7879
7891
  }
7880
7892
  .desktop-tab-vertical-stack-centered-logo-centered-menu.show-nav
7881
- .logo-container[data-v-32fe142c] {
7893
+ .logo-container[data-v-c23d864e] {
7882
7894
  grid-row: row1-start / row1-end;
7883
7895
  }
7884
7896
  .desktop-tab-vertical-stack-centered-logo-centered-menu.show-nav
7885
- .nav-container[data-v-32fe142c] {
7897
+ .nav-container[data-v-c23d864e] {
7886
7898
  grid-row: row2-start / row2-end;
7887
7899
  width: 100%;
7888
7900
  }
7889
7901
  .desktop-tab-vertical-stack-centered-logo-centered-menu.show-nav
7890
- .nav-container__inner[data-v-32fe142c] {
7902
+ .nav-container__inner[data-v-c23d864e] {
7891
7903
  display: inline-block;
7892
7904
  -webkit-transform: translateX(-50%);
7893
7905
  transform: translateX(-50%);
7894
- left: 50%;
7895
7906
  position: relative;
7907
+ left: 50%;
7896
7908
  max-width: 100%;
7897
7909
  }
7898
- .desktop-tab-vertical-stack-centered-logo-centered-menu.no-nav[data-v-32fe142c] {
7910
+ .desktop-tab-vertical-stack-centered-logo-centered-menu.no-nav[data-v-c23d864e] {
7899
7911
  display: -webkit-box;
7900
7912
  display: -ms-flexbox;
7901
7913
  display: flex;
@@ -7905,14 +7917,14 @@ select[data-v-665b8067] {
7905
7917
  }
7906
7918
 
7907
7919
  /* MOBILE_TAB_1 */
7908
- .mobile-tab-vertical-stack-centered-logo-centered-menu[data-v-32fe142c] {
7920
+ .mobile-tab-vertical-stack-centered-logo-centered-menu[data-v-c23d864e] {
7921
+ width: 100%;
7909
7922
  -webkit-box-align: center;
7910
7923
  -ms-flex-align: center;
7911
7924
  align-items: center;
7912
7925
  justify-items: center;
7913
- width: 100%;
7914
7926
  }
7915
- .mobile-tab-vertical-stack-centered-logo-centered-menu.show-nav[data-v-32fe142c] {
7927
+ .mobile-tab-vertical-stack-centered-logo-centered-menu.show-nav[data-v-c23d864e] {
7916
7928
  display: grid;
7917
7929
  row-gap: 1rem;
7918
7930
  grid-template-rows:
@@ -7920,78 +7932,81 @@ select[data-v-665b8067] {
7920
7932
  [row2-end];
7921
7933
  }
7922
7934
  .mobile-tab-vertical-stack-centered-logo-centered-menu.show-nav
7923
- .logo-container[data-v-32fe142c] {
7935
+ .logo-container[data-v-c23d864e] {
7924
7936
  grid-row: row1-start / row1-end;
7925
7937
  }
7926
- .mobile-tab-vertical-stack-centered-logo-centered-menu.show-nav .nav-container[data-v-32fe142c] {
7938
+ .mobile-tab-vertical-stack-centered-logo-centered-menu.show-nav .nav-container[data-v-c23d864e] {
7927
7939
  grid-row: row2-start / row2-end;
7928
7940
  width: 100%;
7929
7941
  }
7930
- .mobile-tab-vertical-stack-centered-logo-centered-menu.no-nav[data-v-32fe142c] {
7942
+ .mobile-tab-vertical-stack-centered-logo-centered-menu.no-nav[data-v-c23d864e] {
7931
7943
  display: -webkit-box;
7932
7944
  display: -ms-flexbox;
7933
7945
  display: flex;
7934
7946
  }
7935
7947
 
7936
7948
  /* DESKTOP_TAB_6 */
7937
- .desktop-tab-vertical-stack-centered-menu-centered-logo.show-nav[data-v-32fe142c] {
7949
+ .desktop-tab-vertical-stack-centered-menu-centered-logo.show-nav[data-v-c23d864e] {
7938
7950
  display: grid;
7939
7951
  grid-template-rows:
7940
7952
  [row1-start] var(--tab-nav-height)
7941
7953
  [row1-end row2-start] 1fr [row2-end];
7942
- row-gap: 1rem;
7943
7954
  -webkit-box-pack: center;
7944
7955
  -ms-flex-pack: center;
7945
7956
  justify-content: center;
7946
7957
  justify-items: center;
7958
+ row-gap: 1rem;
7947
7959
  }
7948
7960
  .desktop-tab-vertical-stack-centered-menu-centered-logo.show-nav
7949
- .logo-container[data-v-32fe142c] {
7961
+ .logo-container[data-v-c23d864e] {
7950
7962
  grid-row: row2-start / row2-end;
7951
7963
  text-align: center;
7952
7964
  }
7953
7965
  .desktop-tab-vertical-stack-centered-menu-centered-logo.show-nav
7954
- .nav-container[data-v-32fe142c] {
7966
+ .nav-container[data-v-c23d864e] {
7955
7967
  grid-row: row1-start / row1-end;
7956
7968
  }
7957
- .layout desktop-tab-vertical-stack-centered-menu-centered-logo.no-nav[data-v-32fe142c] {
7969
+ .desktop-tab-vertical-stack-centered-menu-centered-logo.no-nav[data-v-c23d864e] {
7958
7970
  display: -webkit-box;
7959
7971
  display: -ms-flexbox;
7960
7972
  display: flex;
7973
+ -webkit-box-pack: center;
7974
+ -ms-flex-pack: center;
7975
+ justify-content: center;
7961
7976
  }
7962
7977
  /* MOBILE_TAB_2 */
7963
- .mobile-tab-vertical-stack-centered-menu-centered-logo[data-v-32fe142c] {
7978
+ .mobile-tab-vertical-stack-centered-menu-centered-logo[data-v-c23d864e] {
7979
+ width: 100%;
7964
7980
  -webkit-box-align: center;
7965
7981
  -ms-flex-align: center;
7966
7982
  align-items: center;
7967
7983
  justify-items: center;
7968
- width: 100%;
7969
7984
  }
7970
- .mobile-tab-vertical-stack-centered-menu-centered-logo.show-nav[data-v-32fe142c] {
7985
+ .mobile-tab-vertical-stack-centered-menu-centered-logo.show-nav[data-v-c23d864e] {
7971
7986
  display: grid;
7972
7987
  grid-template-rows:
7973
7988
  [row1-start] var(--tab-nav-height)
7974
7989
  [row1-end row2-start] 1fr [row2-end];
7975
- row-gap: 1rem;
7976
7990
  margin-top: 1rem;
7991
+ row-gap: 1rem;
7977
7992
  }
7978
7993
  .mobile-tab-vertical-stack-centered-menu-centered-logo.show-nav
7979
- .logo-container[data-v-32fe142c] {
7994
+ .logo-container[data-v-c23d864e] {
7980
7995
  grid-row: row2-start / row2-end;
7981
7996
  }
7982
- .mobile-tab-vertical-stack-centered-menu-centered-logo.show-nav .nav-container[data-v-32fe142c] {
7997
+ .mobile-tab-vertical-stack-centered-menu-centered-logo.show-nav .nav-container[data-v-c23d864e] {
7983
7998
  grid-row: row1-start / row1-end;
7984
7999
  width: 100%;
7985
8000
  }
7986
- .mobile-tab-vertical-stack-centered-menu-centered-logo.no-nav[data-v-32fe142c] {
8001
+ .mobile-tab-vertical-stack-centered-menu-centered-logo.no-nav[data-v-c23d864e] {
7987
8002
  display: -webkit-box;
7988
8003
  display: -ms-flexbox;
7989
8004
  display: flex;
7990
8005
  }
7991
8006
 
7992
8007
  /* DESKTOP_TAB_NO_LOGO_1, DESKTOP_HAMBURGER_NO_LOGO_1 */
7993
- .desktop-tab-left-menu-no-logo[data-v-32fe142c],
7994
- .desktop-hamburger-no-logo-left-menu[data-v-32fe142c] {
8008
+ .desktop-tab-left-menu-no-logo[data-v-c23d864e],
8009
+ .desktop-hamburger-no-logo-left-menu[data-v-c23d864e] {
7995
8010
  display: -webkit-box;
7996
8011
  display: -ms-flexbox;
7997
8012
  display: flex;
@@ -7999,15 +8014,15 @@ select[data-v-665b8067] {
7999
8014
  -ms-flex-pack: start;
8000
8015
  justify-content: flex-start;
8001
8016
  }
8002
- .desktop-tab-left-menu-no-logo .logo-container[data-v-32fe142c],
8003
- .desktop-hamburger-no-logo-left-menu .logo-container[data-v-32fe142c] {
8017
+ .desktop-tab-left-menu-no-logo .logo-container[data-v-c23d864e],
8018
+ .desktop-hamburger-no-logo-left-menu .logo-container[data-v-c23d864e] {
8004
8019
  display: none;
8005
8020
  }
8006
8021
 
8007
8022
  /* DESKTOP_TAB_NO_LOGO_2, DESKTOP_HAMBURGER_NO_LOGO_2, MOBILE_TAB_NO_LOGO_1 */
8008
- .desktop-tab-centered-menu-no-logo[data-v-32fe142c],
8009
- .desktop-hamburger-no-logo-centered-menu[data-v-32fe142c],
8010
- .mobile-tab-centered-menu-no-logo[data-v-32fe142c] {
8023
+ .desktop-tab-centered-menu-no-logo[data-v-c23d864e],
8024
+ .desktop-hamburger-no-logo-centered-menu[data-v-c23d864e],
8025
+ .mobile-tab-centered-menu-no-logo[data-v-c23d864e] {
8011
8026
  display: -webkit-box;
8012
8027
  display: -ms-flexbox;
8013
8028
  display: flex;
@@ -8015,15 +8030,15 @@ select[data-v-665b8067] {
8015
8030
  -ms-flex-pack: center;
8016
8031
  justify-content: center;
8017
8032
  }
8018
- .desktop-tab-centered-menu-no-logo .logo-container[data-v-32fe142c],
8019
- .desktop-hamburger-no-logo-centered-menu .logo-container[data-v-32fe142c],
8020
- .mobile-tab-centered-menu-no-logo .logo-container[data-v-32fe142c] {
8033
+ .desktop-tab-centered-menu-no-logo .logo-container[data-v-c23d864e],
8034
+ .desktop-hamburger-no-logo-centered-menu .logo-container[data-v-c23d864e],
8035
+ .mobile-tab-centered-menu-no-logo .logo-container[data-v-c23d864e] {
8021
8036
  display: none;
8022
8037
  }
8023
8038
 
8024
8039
  /* DESKTOP_TAB_NO_LOGO_3, DESKTOP_HAMBURGER_NO_LOGO_3 */
8025
- .desktop-tab-right-menu-no-logo[data-v-32fe142c],
8026
- .desktop-hamburger-no-logo-right-menu[data-v-32fe142c] {
8040
+ .desktop-tab-right-menu-no-logo[data-v-c23d864e],
8041
+ .desktop-hamburger-no-logo-right-menu[data-v-c23d864e] {
8027
8042
  display: -webkit-box;
8028
8043
  display: -ms-flexbox;
8029
8044
  display: flex;
@@ -8031,24 +8046,24 @@ select[data-v-665b8067] {
8031
8046
  -ms-flex-pack: end;
8032
8047
  justify-content: flex-end;
8033
8048
  }
8034
- .desktop-tab-right-menu-no-logo .logo-container[data-v-32fe142c],
8035
- .desktop-hamburger-no-logo-right-menu .logo-container[data-v-32fe142c] {
8049
+ .desktop-tab-right-menu-no-logo .logo-container[data-v-c23d864e],
8050
+ .desktop-hamburger-no-logo-right-menu .logo-container[data-v-c23d864e] {
8036
8051
  display: none;
8037
8052
  }
8038
8053
 
8039
8054
  /* DESKTOP_HAMBURGER_1, MOBILE_HAMBURGER_1 */
8040
- .desktop-hamburger-horizontal-stack-left-logo-right-menu[data-v-32fe142c],
8041
- .mobile-hamburger-horizontal-stack-left-logo-right-menu[data-v-32fe142c] {
8055
+ .desktop-hamburger-horizontal-stack-left-logo-right-menu[data-v-c23d864e],
8056
+ .mobile-hamburger-horizontal-stack-left-logo-right-menu[data-v-c23d864e] {
8042
8057
  display: grid;
8043
8058
  grid-template-columns: [logo-start] auto [nav-start] var(
8044
8059
  --hamburger-nav-width
8045
8060
  );
8046
8061
  -webkit-box-align: start;
8047
8062
  -ms-flex-align: start;
8048
- align-items: start;
8063
+ align-items: flex-start;
8049
8064
  }
8050
- .desktop-hamburger-horizontal-stack-left-logo-right-menu .logo-container[data-v-32fe142c],
8051
- .mobile-hamburger-horizontal-stack-left-logo-right-menu .logo-container[data-v-32fe142c] {
8065
+ .desktop-hamburger-horizontal-stack-left-logo-right-menu .logo-container[data-v-c23d864e],
8066
+ .mobile-hamburger-horizontal-stack-left-logo-right-menu .logo-container[data-v-c23d864e] {
8052
8067
  margin-right: 1rem;
8053
8068
  display: -webkit-box;
8054
8069
  display: -ms-flexbox;
@@ -8058,25 +8073,26 @@ select[data-v-665b8067] {
8058
8073
  justify-content: flex-start;
8059
8074
  grid-column: logo-start;
8060
8075
  }
8061
- .desktop-hamburger-horizontal-stack-left-logo-right-menu .nav-container[data-v-32fe142c],
8062
- .mobile-hamburger-horizontal-stack-left-logo-right-menu .nav-container[data-v-32fe142c] {
8076
+ .desktop-hamburger-horizontal-stack-left-logo-right-menu .nav-container[data-v-c23d864e],
8077
+ .mobile-hamburger-horizontal-stack-left-logo-right-menu .nav-container[data-v-c23d864e] {
8063
8078
  grid-column: nav-start;
8064
- margin: var(--page-padding) 0;
8079
+ /* The icon centres on the row's height (the logo is usually the tallest thing in it). */
8080
+ align-self: center;
8065
8081
  }
8066
8082
 
8067
8083
  /* DESKTOP_HAMBURGER_2, MOBILE_HAMBURGER_2 */
8068
- .desktop-hamburger-horizontal-stack-centered-logo-right-menu[data-v-32fe142c],
8069
- .mobile-hamburger-horizontal-stack-centered-logo-right-menu[data-v-32fe142c] {
8084
+ .desktop-hamburger-horizontal-stack-centered-logo-right-menu[data-v-c23d864e],
8085
+ .mobile-hamburger-horizontal-stack-centered-logo-right-menu[data-v-c23d864e] {
8070
8086
  display: grid;
8071
8087
  grid-template-columns:
8072
8088
  [start] var(--hamburger-nav-width)
8073
8089
  [logo-start] auto [nav-start] var(--hamburger-nav-width);
8074
8090
  -webkit-box-align: start;
8075
8091
  -ms-flex-align: start;
8076
- align-items: start;
8092
+ align-items: flex-start;
8077
8093
  }
8078
- .desktop-hamburger-horizontal-stack-centered-logo-right-menu .logo-container[data-v-32fe142c],
8079
- .mobile-hamburger-horizontal-stack-centered-logo-right-menu .logo-container[data-v-32fe142c] {
8094
+ .desktop-hamburger-horizontal-stack-centered-logo-right-menu .logo-container[data-v-c23d864e],
8095
+ .mobile-hamburger-horizontal-stack-centered-logo-right-menu .logo-container[data-v-c23d864e] {
8080
8096
  margin-left: 1rem;
8081
8097
  margin-right: 1rem;
8082
8098
  display: -webkit-box;
@@ -8087,14 +8103,14 @@ select[data-v-665b8067] {
8087
8103
  justify-content: center;
8088
8104
  grid-column: logo-start;
8089
8105
  }
8090
- .desktop-hamburger-horizontal-stack-centered-logo-right-menu .nav-container[data-v-32fe142c],
8091
- .mobile-hamburger-horizontal-stack-centered-logo-right-menu .nav-container[data-v-32fe142c] {
8106
+ .desktop-hamburger-horizontal-stack-centered-logo-right-menu .nav-container[data-v-c23d864e],
8107
+ .mobile-hamburger-horizontal-stack-centered-logo-right-menu .nav-container[data-v-c23d864e] {
8092
8108
  grid-column: nav-start;
8093
- margin: var(--page-padding) 0;
8109
+ align-self: center;
8094
8110
  }
8095
8111
 
8096
8112
  /* MOBILE_HAMBURGER_3 */
8097
- .mobile-hamburger-horizontal-stack-left-menu-centered-logo[data-v-32fe142c] {
8113
+ .mobile-hamburger-horizontal-stack-left-menu-centered-logo[data-v-c23d864e] {
8098
8114
  display: grid;
8099
8115
  grid-template-columns: var(--hamburger-nav-width) auto var(
8100
8116
  --hamburger-nav-width
@@ -8102,9 +8118,9 @@ select[data-v-665b8067] {
8102
8118
  grid-template-areas: 'a b c';
8103
8119
  -webkit-box-align: start;
8104
8120
  -ms-flex-align: start;
8105
- align-items: start;
8121
+ align-items: flex-start;
8106
8122
  }
8107
- .mobile-hamburger-horizontal-stack-left-menu-centered-logo .logo-container[data-v-32fe142c] {
8123
+ .mobile-hamburger-horizontal-stack-left-menu-centered-logo .logo-container[data-v-c23d864e] {
8108
8124
  margin-left: 1rem;
8109
8125
  margin-right: 1rem;
8110
8126
  display: -webkit-box;
@@ -8115,26 +8131,26 @@ select[data-v-665b8067] {
8115
8131
  justify-content: center;
8116
8132
  grid-area: b;
8117
8133
  }
8118
- .mobile-hamburger-horizontal-stack-left-menu-centered-logo .nav-container[data-v-32fe142c] {
8134
+ .mobile-hamburger-horizontal-stack-left-menu-centered-logo .nav-container[data-v-c23d864e] {
8119
8135
  grid-area: a;
8120
- margin: var(--page-padding) 0;
8136
+ align-self: center;
8121
8137
  }
8122
8138
  .mobile-hamburger-horizontal-stack-left-menu-centered-logo
8123
- .nav-container__inner[data-v-32fe142c] {
8139
+ .nav-container__inner[data-v-c23d864e] {
8124
8140
  float: left;
8125
8141
  max-width: 100%;
8126
8142
  }
8127
8143
 
8128
8144
  /* MOBILE_HAMBURGER_4 */
8129
- .mobile-hamburger-horizontal-stack-left-menu-left-logo[data-v-32fe142c] {
8145
+ .mobile-hamburger-horizontal-stack-left-menu-left-logo[data-v-c23d864e] {
8130
8146
  display: grid;
8131
8147
  grid-template-columns: var(--hamburger-nav-width) auto;
8132
8148
  grid-template-areas: 'a b';
8133
8149
  -webkit-box-align: start;
8134
8150
  -ms-flex-align: start;
8135
- align-items: start;
8151
+ align-items: flex-start;
8136
8152
  }
8137
- .mobile-hamburger-horizontal-stack-left-menu-left-logo .logo-container[data-v-32fe142c] {
8153
+ .mobile-hamburger-horizontal-stack-left-menu-left-logo .logo-container[data-v-c23d864e] {
8138
8154
  margin-left: 1rem;
8139
8155
  display: -webkit-box;
8140
8156
  display: -ms-flexbox;
@@ -8144,17 +8160,17 @@ select[data-v-665b8067] {
8144
8160
  justify-content: flex-start;
8145
8161
  grid-area: b;
8146
8162
  }
8147
- .mobile-hamburger-horizontal-stack-left-menu-left-logo .nav-container[data-v-32fe142c] {
8163
+ .mobile-hamburger-horizontal-stack-left-menu-left-logo .nav-container[data-v-c23d864e] {
8148
8164
  grid-area: a;
8149
- margin: var(--page-padding) 0;
8165
+ align-self: center;
8150
8166
  }
8151
- .mobile-hamburger-horizontal-stack-left-menu-left-logo .nav-container__inner[data-v-32fe142c] {
8167
+ .mobile-hamburger-horizontal-stack-left-menu-left-logo .nav-container__inner[data-v-c23d864e] {
8152
8168
  float: left;
8153
8169
  max-width: 100%;
8154
8170
  }
8155
8171
 
8156
8172
  /* MOBILE_HAMBURGER_NO_LOGO_1 */
8157
- .mobile-hamburger-no-logo-left-menu[data-v-32fe142c] {
8173
+ .mobile-hamburger-no-logo-left-menu[data-v-c23d864e] {
8158
8174
  display: -webkit-box;
8159
8175
  display: -ms-flexbox;
8160
8176
  display: flex;
@@ -8162,12 +8178,12 @@ select[data-v-665b8067] {
8162
8178
  -ms-flex-pack: start;
8163
8179
  justify-content: flex-start;
8164
8180
  }
8165
- .mobile-hamburger-no-logo-left-menu .logo-container[data-v-32fe142c] {
8181
+ .mobile-hamburger-no-logo-left-menu .logo-container[data-v-c23d864e] {
8166
8182
  display: none;
8167
8183
  }
8168
8184
 
8169
8185
  /* MOBILE_HAMBURGER_NO_LOGO_2 */
8170
- .mobile-hamburger-no-logo-centered-menu[data-v-32fe142c] {
8186
+ .mobile-hamburger-no-logo-centered-menu[data-v-c23d864e] {
8171
8187
  display: -webkit-box;
8172
8188
  display: -ms-flexbox;
8173
8189
  display: flex;
@@ -8175,11 +8191,11 @@ select[data-v-665b8067] {
8175
8191
  -ms-flex-pack: center;
8176
8192
  justify-content: center;
8177
8193
  }
8178
- .mobile-hamburger-no-logo-centered-menu .logo-container[data-v-32fe142c] {
8194
+ .mobile-hamburger-no-logo-centered-menu .logo-container[data-v-c23d864e] {
8179
8195
  display: none;
8180
8196
  }
8181
8197
  /* MOBILE_HAMBURGER_NO_LOGO_3 */
8182
- .mobile-hamburger-no-logo-right-menu[data-v-32fe142c] {
8198
+ .mobile-hamburger-no-logo-right-menu[data-v-c23d864e] {
8183
8199
  display: -webkit-box;
8184
8200
  display: -ms-flexbox;
8185
8201
  display: flex;
@@ -8187,10 +8203,364 @@ select[data-v-665b8067] {
8187
8203
  -ms-flex-pack: end;
8188
8204
  justify-content: flex-end;
8189
8205
  }
8190
- .mobile-hamburger-no-logo-right-menu .logo-container[data-v-32fe142c] {
8206
+ .mobile-hamburger-no-logo-right-menu .logo-container[data-v-c23d864e] {
8191
8207
  display: none;
8192
8208
  }
8193
8209
 
8210
+ /* Button placement — all rules only apply while the button is on (.has-header-cta), so headers without it look exactly as before. */
8211
+
8212
+ /* The generic Button ships section spacing; the header row, as the caller, strips it here:
8213
+ no stack margin, no maker height floor, no icon spacer/label offset (icon room it never uses). */
8214
+ .cta-container[data-v-c23d864e] .bp-button,
8215
+ .cta-mirror[data-v-c23d864e] .bp-button {
8216
+ margin-bottom: 0;
8217
+ min-height: 0;
8218
+ }
8219
+ .cta-container[data-v-c23d864e] .c-button__no-icon,
8220
+ .cta-mirror[data-v-c23d864e] .c-button__no-icon {
8221
+ display: none;
8222
+ }
8223
+ /* Target the base label class, not a specific --offset-* variant, so the icon-gutter shift is
8224
+ neutralised for whichever offset the button carries — a future offset swap can't slide the label. */
8225
+ .cta-container[data-v-c23d864e] .c-button__label,
8226
+ .cta-mirror[data-v-c23d864e] .c-button__label {
8227
+ -webkit-transform: none;
8228
+ transform: none;
8229
+ }
8230
+ /* Decorative styles (arrow/brush/paper) size by percentage, which collapses to zero inside the
8231
+ header's content-sized tracks — hug the label instead. Full-width rows re-stretch below. */
8232
+ .cta-container[data-v-c23d864e] .bp-style-wrapper,
8233
+ .cta-mirror[data-v-c23d864e] .bp-style-wrapper {
8234
+ width: -webkit-fit-content;
8235
+ width: -moz-fit-content;
8236
+ width: fit-content;
8237
+ }
8238
+
8239
+ /* Invisible size-peer of the CTA (see template). Sized exactly like .cta-container — same
8240
+ button-normalising :deep rules above, same max-width cap — so the leading mirror track it
8241
+ occupies matches the trailing button track. Per-style placement is defined below. */
8242
+ .cta-mirror[data-v-c23d864e] {
8243
+ visibility: hidden;
8244
+ pointer-events: none;
8245
+ min-width: 0px;
8246
+ -ms-flex-negative: 0;
8247
+ flex-shrink: 0;
8248
+ max-width: var(--logo-max-width);
8249
+ }
8250
+
8251
+ /* DESKTOP_TAB_1/2, TAB_NO_LOGO_3: extra flex child one gap after the nav — beside the links, or at the right edge when the nav is right-aligned. */
8252
+ .desktop-tab-horizontal-stack-left-logo-right-menu .cta-container[data-v-c23d864e],
8253
+ .desktop-tab-horizontal-stack-left-logo-left-menu .cta-container[data-v-c23d864e],
8254
+ .desktop-tab-right-menu-no-logo .cta-container[data-v-c23d864e] {
8255
+ margin-left: 1rem;
8256
+ }
8257
+
8258
+ /* TAB_NO_LOGO_1: the nav sits left, so the button pins to the right edge — the same spot
8259
+ whether the nav is shown or not (BP-6120). */
8260
+ .desktop-tab-left-menu-no-logo .cta-container[data-v-c23d864e] {
8261
+ margin-left: auto;
8262
+ }
8263
+
8264
+ /* Same styles with the nav hidden (single page): no nav to sit beside — button takes the right edge. */
8265
+ .desktop-tab-horizontal-stack-left-logo-right-menu.no-nav .cta-container[data-v-c23d864e],
8266
+ .desktop-tab-horizontal-stack-left-logo-left-menu.no-nav .cta-container[data-v-c23d864e] {
8267
+ margin-left: auto;
8268
+ }
8269
+
8270
+ /* DESKTOP_TAB_3: button uses the existing spare right column, nothing else moves. */
8271
+ .desktop-tab-horizontal-stack-left-logo-centered-menu .cta-container[data-v-c23d864e] {
8272
+ grid-column: nav-end / cols-end;
8273
+ justify-self: end;
8274
+ }
8275
+
8276
+ /* DESKTOP_TAB_4: adds a column for the button after the nav links, mirrored by a leading
8277
+ track sized by the hidden button copy so the logo keeps the header's true centre. */
8278
+ .desktop-tab-horizontal-stack-centered-logo-right-menu.has-header-cta[data-v-c23d864e] {
8279
+ grid-template-columns:
8280
+ [mirror-start] minmax(-webkit-max-content, auto) [col-start] 1fr
8281
+ [logo-start] var(--logo-max-width)
8282
+ /* The button's track never shrinks below its label, so a wide nav compresses instead. */
8283
+ [logo-end nav-start] 1fr [nav-end cta-start] minmax(-webkit-max-content, auto)
8284
+ [cta-end];
8285
+ grid-template-columns:
8286
+ [mirror-start] minmax(max-content, auto) [col-start] 1fr
8287
+ [logo-start] var(--logo-max-width)
8288
+ /* The button's track never shrinks below its label, so a wide nav compresses instead. */
8289
+ [logo-end nav-start] 1fr [nav-end cta-start] minmax(max-content, auto)
8290
+ [cta-end];
8291
+ }
8292
+ .desktop-tab-horizontal-stack-centered-logo-right-menu .cta-container[data-v-c23d864e] {
8293
+ grid-column: cta-start / cta-end;
8294
+ }
8295
+ .desktop-tab-horizontal-stack-centered-logo-right-menu .cta-mirror[data-v-c23d864e] {
8296
+ grid-column: mirror-start / col-start;
8297
+ /* Pinned to row 1: the mirror follows the real CTA in the DOM, so auto-placement — whose
8298
+ cursor never moves backwards along a row — would drop it onto a second row and grow the
8299
+ header band by the button's height. */
8300
+ grid-row: 1;
8301
+ }
8302
+
8303
+ /* DESKTOP_TAB_6, TAB_NO_LOGO_2: nav and button share the top row, so the button takes a
8304
+ trailing column mirrored by the leading one — the nav pays for the collision it would
8305
+ otherwise have. */
8306
+ .desktop-tab-vertical-stack-centered-menu-centered-logo.show-nav.has-header-cta[data-v-c23d864e],
8307
+ .desktop-tab-centered-menu-no-logo.show-nav.has-header-cta[data-v-c23d864e] {
8308
+ display: grid;
8309
+ /* The trailing track never shrinks below the button, so a wide nav compresses (its carousel
8310
+ scrolls) rather than running under it; the leading track floors at the hidden button copy
8311
+ so nav and logo hold the header's true centre even at full compression. */
8312
+ grid-template-columns:
8313
+ minmax(-webkit-max-content, 1fr) [nav-start] auto
8314
+ [nav-end cta-start] minmax(-webkit-max-content, 1fr) [cta-end];
8315
+ grid-template-columns:
8316
+ minmax(max-content, 1fr) [nav-start] auto
8317
+ [nav-end cta-start] minmax(max-content, 1fr) [cta-end];
8318
+ }
8319
+ .desktop-tab-vertical-stack-centered-menu-centered-logo.show-nav.has-header-cta
8320
+ .nav-container[data-v-c23d864e],
8321
+ .desktop-tab-centered-menu-no-logo.show-nav.has-header-cta .nav-container[data-v-c23d864e] {
8322
+ grid-column: nav-start / nav-end;
8323
+ }
8324
+
8325
+ /* The logo shares the nav's track: that track widens to whichever is bigger, so both stay centered. */
8326
+ .desktop-tab-vertical-stack-centered-menu-centered-logo.show-nav.has-header-cta
8327
+ .logo-container[data-v-c23d864e] {
8328
+ grid-column: nav-start / nav-end;
8329
+ }
8330
+ .desktop-tab-vertical-stack-centered-menu-centered-logo.show-nav.has-header-cta
8331
+ .cta-container[data-v-c23d864e],
8332
+ .desktop-tab-centered-menu-no-logo.show-nav.has-header-cta .cta-container[data-v-c23d864e] {
8333
+ grid-column: cta-start / cta-end;
8334
+ /* Top row, right edge — the shipped corner position. */
8335
+ grid-row: 1;
8336
+ justify-self: end;
8337
+ align-self: start;
8338
+ }
8339
+ .desktop-tab-vertical-stack-centered-menu-centered-logo.show-nav.has-header-cta
8340
+ .cta-mirror[data-v-c23d864e],
8341
+ .desktop-tab-centered-menu-no-logo.show-nav.has-header-cta .cta-mirror[data-v-c23d864e] {
8342
+ grid-column: 1 / nav-start;
8343
+ grid-row: 1;
8344
+ }
8345
+
8346
+ /* DESKTOP_TAB_5: the button shares the TOP row with the logo — the nav lives on its own
8347
+ full-width row below — so an absolute corner pin collides with nothing and, unlike a
8348
+ column, costs the nav no width. */
8349
+ .desktop-tab-vertical-stack-centered-logo-centered-menu.has-header-cta[data-v-c23d864e] {
8350
+ position: relative;
8351
+ }
8352
+ .desktop-tab-vertical-stack-centered-logo-centered-menu .cta-container[data-v-c23d864e] {
8353
+ position: absolute;
8354
+ top: 0px;
8355
+ right: 0px;
8356
+ }
8357
+
8358
+ /* TAB_6 with the nav hidden: no nav to collide with, so the button keeps its corner pin
8359
+ (absolute, so it never pushes the logo off-centre; the logo keeps the band's height). */
8360
+ .desktop-tab-vertical-stack-centered-menu-centered-logo.no-nav.has-header-cta[data-v-c23d864e] {
8361
+ position: relative;
8362
+ }
8363
+ .desktop-tab-vertical-stack-centered-menu-centered-logo.no-nav .cta-container[data-v-c23d864e] {
8364
+ position: absolute;
8365
+ top: 0px;
8366
+ right: 0px;
8367
+ }
8368
+
8369
+ /* TAB_NO_LOGO_2 with the nav hidden: the button is the band's only content, so it stays in
8370
+ flow (an absolute pin would collapse the header to zero height) at the same right edge. */
8371
+ .desktop-tab-centered-menu-no-logo.no-nav .cta-container[data-v-c23d864e] {
8372
+ margin-left: auto;
8373
+ }
8374
+
8375
+ /* MOBILE_TAB_1/2: full-width button row in the centered stack. */
8376
+ .mobile-tab-vertical-stack-centered-logo-centered-menu .cta-container[data-v-c23d864e],
8377
+ .mobile-tab-vertical-stack-centered-menu-centered-logo .cta-container[data-v-c23d864e] {
8378
+ width: 100%;
8379
+ justify-self: stretch;
8380
+ }
8381
+ /* The row is definite-width, so the decorated button can span it like a section's. */
8382
+ .mobile-tab-vertical-stack-centered-logo-centered-menu
8383
+ .cta-container[data-v-c23d864e]
8384
+ .bp-style-wrapper,
8385
+ .mobile-tab-vertical-stack-centered-menu-centered-logo
8386
+ .cta-container[data-v-c23d864e]
8387
+ .bp-style-wrapper,
8388
+ .mobile-tab-centered-menu-no-logo .cta-container[data-v-c23d864e] .bp-style-wrapper,
8389
+ .mobile-hamburger-no-logo-left-menu.no-nav
8390
+ .cta-container[data-v-c23d864e]
8391
+ .bp-style-wrapper,
8392
+ .mobile-hamburger-no-logo-centered-menu.no-nav
8393
+ .cta-container[data-v-c23d864e]
8394
+ .bp-style-wrapper,
8395
+ .mobile-hamburger-no-logo-right-menu.no-nav
8396
+ .cta-container[data-v-c23d864e]
8397
+ .bp-style-wrapper,
8398
+ .mobile-hamburger-horizontal-stack-left-logo-right-menu.no-nav
8399
+ .cta-container[data-v-c23d864e]
8400
+ .bp-style-wrapper,
8401
+ .mobile-hamburger-horizontal-stack-centered-logo-right-menu.no-nav
8402
+ .cta-container[data-v-c23d864e]
8403
+ .bp-style-wrapper,
8404
+ .mobile-hamburger-horizontal-stack-left-menu-centered-logo.no-nav
8405
+ .cta-container[data-v-c23d864e]
8406
+ .bp-style-wrapper,
8407
+ .mobile-hamburger-horizontal-stack-left-menu-left-logo.no-nav
8408
+ .cta-container[data-v-c23d864e]
8409
+ .bp-style-wrapper {
8410
+ width: 100%;
8411
+ }
8412
+
8413
+ /* MOBILE_TAB_1/2 with the nav hidden: the stack is a plain flex row, so the button wraps below it. */
8414
+ .mobile-tab-vertical-stack-centered-logo-centered-menu.no-nav.has-header-cta[data-v-c23d864e],
8415
+ .mobile-tab-vertical-stack-centered-menu-centered-logo.no-nav.has-header-cta[data-v-c23d864e] {
8416
+ -ms-flex-wrap: wrap;
8417
+ flex-wrap: wrap;
8418
+ -webkit-box-pack: center;
8419
+ -ms-flex-pack: center;
8420
+ justify-content: center;
8421
+ }
8422
+
8423
+ /* MOBILE_TAB_NO_LOGO_1 (nav shown or not — its flex-centre stack wraps the button either way)
8424
+ and MOBILE_HAMBURGER_NO_LOGO_1..3 with the nav hidden: button wraps onto its own full-width
8425
+ line below the nav, one row gap apart (the same gap the with-logo stacks use). */
8426
+ .mobile-tab-centered-menu-no-logo.has-header-cta[data-v-c23d864e],
8427
+ .mobile-hamburger-no-logo-left-menu.no-nav.has-header-cta[data-v-c23d864e],
8428
+ .mobile-hamburger-no-logo-centered-menu.no-nav.has-header-cta[data-v-c23d864e],
8429
+ .mobile-hamburger-no-logo-right-menu.no-nav.has-header-cta[data-v-c23d864e] {
8430
+ -ms-flex-wrap: wrap;
8431
+ flex-wrap: wrap;
8432
+ row-gap: 1rem;
8433
+ }
8434
+ .mobile-tab-centered-menu-no-logo .cta-container[data-v-c23d864e],
8435
+ .mobile-hamburger-no-logo-left-menu.no-nav .cta-container[data-v-c23d864e],
8436
+ .mobile-hamburger-no-logo-centered-menu.no-nav .cta-container[data-v-c23d864e],
8437
+ .mobile-hamburger-no-logo-right-menu.no-nav .cta-container[data-v-c23d864e] {
8438
+ width: 100%;
8439
+ }
8440
+
8441
+ /* DESKTOP_HAMBURGER_1: button gets its own column just before the hamburger icon. */
8442
+ .desktop-hamburger-horizontal-stack-left-logo-right-menu.has-header-cta[data-v-c23d864e] {
8443
+ grid-template-columns: [logo-start] 1fr [cta-start] auto [nav-start] var(
8444
+ --hamburger-nav-width
8445
+ );
8446
+ }
8447
+ .desktop-hamburger-horizontal-stack-left-logo-right-menu .cta-container[data-v-c23d864e] {
8448
+ grid-column: cta-start;
8449
+ /* Without an explicit row the button wraps onto a second row. */
8450
+ grid-row: 1;
8451
+ align-self: center;
8452
+ /* Same gap the nav-bar styles keep between links and button. */
8453
+ margin-right: 1rem;
8454
+ }
8455
+
8456
+ /* DESKTOP_HAMBURGER_2: button and icon share the trailing track (the button's right margin
8457
+ reserves the icon's spot), mirrored by a leading 1fr so the logo stays truly centered.
8458
+ The track's max-content floor means a tight header shifts the logo instead of overlapping. */
8459
+ .desktop-hamburger-horizontal-stack-centered-logo-right-menu.has-header-cta[data-v-c23d864e] {
8460
+ grid-template-columns:
8461
+ minmax(-webkit-max-content, 1fr)
8462
+ [logo-start] auto [right-start] minmax(-webkit-max-content, 1fr);
8463
+ grid-template-columns:
8464
+ minmax(max-content, 1fr)
8465
+ [logo-start] auto [right-start] minmax(max-content, 1fr);
8466
+ }
8467
+ .desktop-hamburger-horizontal-stack-centered-logo-right-menu.has-header-cta
8468
+ .logo-container[data-v-c23d864e] {
8469
+ grid-column: logo-start;
8470
+ }
8471
+ .desktop-hamburger-horizontal-stack-centered-logo-right-menu.has-header-cta
8472
+ .nav-container[data-v-c23d864e] {
8473
+ grid-column: right-start;
8474
+ grid-row: 1;
8475
+ justify-self: end;
8476
+ }
8477
+ .desktop-hamburger-horizontal-stack-centered-logo-right-menu .cta-container[data-v-c23d864e] {
8478
+ grid-column: right-start;
8479
+ grid-row: 1;
8480
+ justify-self: end;
8481
+ align-self: center;
8482
+ /* Sits left of the icon: the old icon column's width plus the usual 1rem gap. */
8483
+ margin-right: calc(var(--hamburger-nav-width) + 1rem);
8484
+ }
8485
+ /* The mirror reserves the icon's spot the same way the real button does (margin-right), so the
8486
+ leading track equals button + icon + gap and the logo stays centred. */
8487
+ .desktop-hamburger-horizontal-stack-centered-logo-right-menu.has-header-cta
8488
+ .cta-mirror[data-v-c23d864e] {
8489
+ grid-column: 1;
8490
+ grid-row: 1;
8491
+ margin-right: calc(var(--hamburger-nav-width) + 1rem);
8492
+ }
8493
+
8494
+ /* Single page: no nav means no icon, so the button takes the right edge and the
8495
+ leading mirror shrinks to just the button's width. */
8496
+ .desktop-hamburger-horizontal-stack-centered-logo-right-menu.no-nav.has-header-cta[data-v-c23d864e] {
8497
+ grid-template-columns:
8498
+ minmax(-webkit-max-content, 1fr)
8499
+ [logo-start] auto [right-start] minmax(-webkit-max-content, 1fr);
8500
+ grid-template-columns:
8501
+ minmax(max-content, 1fr)
8502
+ [logo-start] auto [right-start] minmax(max-content, 1fr);
8503
+ }
8504
+ .desktop-hamburger-horizontal-stack-centered-logo-right-menu.no-nav
8505
+ .cta-container[data-v-c23d864e],
8506
+ .desktop-hamburger-horizontal-stack-centered-logo-right-menu.no-nav
8507
+ .cta-mirror[data-v-c23d864e] {
8508
+ /* Single page: no icon to reserve. */
8509
+ margin-right: 0;
8510
+ }
8511
+
8512
+ /* DESKTOP_HAMBURGER_NO_LOGO_1..3: button shows before the icon. */
8513
+ .desktop-hamburger-no-logo-left-menu .cta-container[data-v-c23d864e],
8514
+ .desktop-hamburger-no-logo-centered-menu .cta-container[data-v-c23d864e],
8515
+ .desktop-hamburger-no-logo-right-menu .cta-container[data-v-c23d864e] {
8516
+ -webkit-box-ordinal-group: 0;
8517
+ -ms-flex-order: -1;
8518
+ order: -1;
8519
+ margin-right: 1rem;
8520
+ -ms-flex-item-align: center;
8521
+ align-self: center;
8522
+ }
8523
+
8524
+ /* With the button on, icon + button always sit at the right whatever alignment the stored
8525
+ style carries — the display-style picker is hidden in this state (HeaderDisplayStyle.vue). */
8526
+ .desktop-hamburger-no-logo-left-menu.has-header-cta[data-v-c23d864e],
8527
+ .desktop-hamburger-no-logo-centered-menu.has-header-cta[data-v-c23d864e] {
8528
+ -webkit-box-pack: end;
8529
+ -ms-flex-pack: end;
8530
+ justify-content: flex-end;
8531
+ }
8532
+
8533
+ /* MOBILE_HAMBURGER_1..4 with the nav hidden (single page): no side menu exists, so the button gets a full-width row below the logo. */
8534
+ .mobile-hamburger-horizontal-stack-left-logo-right-menu.no-nav .cta-container[data-v-c23d864e],
8535
+ .mobile-hamburger-horizontal-stack-centered-logo-right-menu.no-nav
8536
+ .cta-container[data-v-c23d864e],
8537
+ .mobile-hamburger-horizontal-stack-left-menu-centered-logo.no-nav
8538
+ .cta-container[data-v-c23d864e],
8539
+ .mobile-hamburger-horizontal-stack-left-menu-left-logo.no-nav .cta-container[data-v-c23d864e] {
8540
+ grid-column: 1 / -1;
8541
+ margin-top: 1rem;
8542
+ width: 100%;
8543
+ }
8544
+
8545
+ /* Desktop placements: cap the button so a long label wraps to the next line (like the
8546
+ banner's button) instead of stretching across the header. Mobile rows stay full-width. */
8547
+ .desktop-tab-horizontal-stack-left-logo-right-menu .cta-container[data-v-c23d864e],
8548
+ .desktop-tab-horizontal-stack-left-logo-left-menu .cta-container[data-v-c23d864e],
8549
+ .desktop-tab-horizontal-stack-left-logo-centered-menu .cta-container[data-v-c23d864e],
8550
+ .desktop-tab-horizontal-stack-centered-logo-right-menu .cta-container[data-v-c23d864e],
8551
+ .desktop-tab-vertical-stack-centered-logo-centered-menu .cta-container[data-v-c23d864e],
8552
+ .desktop-tab-vertical-stack-centered-menu-centered-logo .cta-container[data-v-c23d864e],
8553
+ .desktop-tab-left-menu-no-logo .cta-container[data-v-c23d864e],
8554
+ .desktop-tab-centered-menu-no-logo .cta-container[data-v-c23d864e],
8555
+ .desktop-tab-right-menu-no-logo .cta-container[data-v-c23d864e],
8556
+ .desktop-hamburger-horizontal-stack-left-logo-right-menu .cta-container[data-v-c23d864e],
8557
+ .desktop-hamburger-horizontal-stack-centered-logo-right-menu .cta-container[data-v-c23d864e],
8558
+ .desktop-hamburger-no-logo-left-menu .cta-container[data-v-c23d864e],
8559
+ .desktop-hamburger-no-logo-centered-menu .cta-container[data-v-c23d864e],
8560
+ .desktop-hamburger-no-logo-right-menu .cta-container[data-v-c23d864e] {
8561
+ max-width: var(--logo-max-width);
8562
+ }
8563
+
8194
8564
  /* global styles */
8195
8565
  /* TODO - remove centering from the logo container, so this can be deprecated */
8196
8566
  .desktop-tab-horizontal-stack-left-logo-centered-menu
@@ -8199,7 +8569,7 @@ select[data-v-665b8067] {
8199
8569
  margin: 0;
8200
8570
  }
8201
8571
 
8202
- .c-page-header-container[data-v-c289294b] {
8572
+ .c-page-header-container[data-v-73d5a1ed] {
8203
8573
  max-width: var(--brandsite-max-width);
8204
8574
  margin: 0 auto;
8205
8575
  padding: 0.25rem var(--page-padding);
@@ -8255,7 +8625,7 @@ select[data-v-665b8067] {
8255
8625
  }
8256
8626
  }
8257
8627
 
8258
- .c-overlay[data-v-a8c3857a] {
8628
+ .c-overlay[data-v-0b2b4f62] {
8259
8629
  position: fixed;
8260
8630
  inset: 0px;
8261
8631
  z-index: 40;
@@ -8273,15 +8643,15 @@ select[data-v-665b8067] {
8273
8643
  -webkit-transition-timing-function: cubic-bezier(0, 0, 0.2, 1);
8274
8644
  transition-timing-function: cubic-bezier(0, 0, 0.2, 1);
8275
8645
  }
8276
- .c-overlay--open[data-v-a8c3857a] {
8646
+ .c-overlay--open[data-v-0b2b4f62] {
8277
8647
  opacity: 0.7;
8278
8648
  }
8279
- .c-overlay--closed[data-v-a8c3857a] {
8649
+ .c-overlay--closed[data-v-0b2b4f62] {
8280
8650
  pointer-events: none;
8281
8651
  display: none;
8282
8652
  opacity: 0;
8283
8653
  }
8284
- .c-sidebar[data-v-a8c3857a] {
8654
+ .c-sidebar[data-v-0b2b4f62] {
8285
8655
  /* No hardcoded background: the panel background comes from the hamburger
8286
8656
  defaultButtonStyle (bound via :style), so a transparent/unset default bg
8287
8657
  renders transparent instead of being forced white */
@@ -8301,30 +8671,89 @@ select[data-v-665b8067] {
8301
8671
  max-width: 66%;
8302
8672
  }
8303
8673
  @media (min-width: 768px) {
8304
- .device--mobile .c-sidebar[data-v-a8c3857a] {
8674
+ .device--mobile .c-sidebar[data-v-0b2b4f62] {
8305
8675
  width: 66.666667%;
8306
8676
  }
8307
8677
  }
8308
- .c-sidebar--closed[data-v-a8c3857a] {
8678
+ .c-sidebar--closed[data-v-0b2b4f62] {
8309
8679
  -webkit-transform: translateX(-100%);
8310
8680
  transform: translateX(-100%);
8311
8681
  visibility: hidden;
8312
8682
  }
8313
- .c-sidebar--open[data-v-a8c3857a] {
8683
+ .c-sidebar--open[data-v-0b2b4f62] {
8314
8684
  -webkit-transform: translateX(0%);
8315
8685
  transform: translateX(0%);
8316
8686
  }
8317
- .c-chevron-transform[data-v-a8c3857a] {
8687
+ .c-chevron-transform[data-v-0b2b4f62] {
8318
8688
  -webkit-transition: -webkit-transform 0.3s ease;
8319
8689
  transition: -webkit-transform 0.3s ease;
8320
8690
  transition: transform 0.3s ease;
8321
8691
  transition: transform 0.3s ease, -webkit-transform 0.3s ease;
8322
8692
  }
8323
- .c-chevron-expanded[data-v-a8c3857a] {
8693
+ .c-chevron-expanded[data-v-0b2b4f62] {
8324
8694
  -webkit-transform: rotate(180deg);
8325
8695
  transform: rotate(180deg);
8326
8696
  }
8327
8697
 
8698
+ /* Button pinned to the bottom of the side menu; rules only apply when the button is on. */
8699
+ .c-sidebar--has-cta[data-v-0b2b4f62] {
8700
+ display: -webkit-box;
8701
+ display: -ms-flexbox;
8702
+ display: flex;
8703
+ -webkit-box-orient: vertical;
8704
+ -webkit-box-direction: normal;
8705
+ -ms-flex-direction: column;
8706
+ flex-direction: column;
8707
+ overflow: hidden;
8708
+ }
8709
+ .c-sidebar--has-cta .c-sidebar-header[data-v-0b2b4f62] {
8710
+ -ms-flex-negative: 0;
8711
+ flex-shrink: 0;
8712
+ }
8713
+ .c-sidebar--has-cta .c-nav-list[data-v-0b2b4f62] {
8714
+ /* Lets the link list scroll instead of the panel. */
8715
+ min-height: 0;
8716
+ overflow-y: auto;
8717
+ }
8718
+ .c-sidebar-cta[data-v-0b2b4f62] {
8719
+ position: relative;
8720
+ padding: 1rem;
8721
+ }
8722
+
8723
+ /* The generic Button ships section spacing; the side menu, as the caller, strips it
8724
+ (same fit the header row applies in HeaderLayout.vue). */
8725
+ .c-sidebar-cta[data-v-0b2b4f62] .bp-button {
8726
+ margin-bottom: 0;
8727
+ min-height: 0;
8728
+ }
8729
+ .c-sidebar-cta[data-v-0b2b4f62] .c-button__no-icon {
8730
+ display: none;
8731
+ }
8732
+ /* Base label class, not a specific --offset-* variant, so a future offset swap can't slide it. */
8733
+ .c-sidebar-cta[data-v-0b2b4f62] .c-button__label {
8734
+ -webkit-transform: none;
8735
+ transform: none;
8736
+ }
8737
+ .c-sidebar--has-cta .c-sidebar-cta[data-v-0b2b4f62] {
8738
+ /* Keeps the button at the bottom whether links underfill or overflow. */
8739
+ margin-top: auto;
8740
+ -ms-flex-negative: 0;
8741
+ flex-shrink: 0;
8742
+ /* Opaque so scrolled links don't show through. */
8743
+ background-color: inherit;
8744
+ }
8745
+
8746
+ /* Thin separator line above the button, faded without dimming the button itself. */
8747
+ .c-sidebar-cta[data-v-0b2b4f62]::before {
8748
+ content: '';
8749
+ position: absolute;
8750
+ top: 0;
8751
+ left: 0;
8752
+ right: 0;
8753
+ border-top: 1px solid currentColor;
8754
+ opacity: 0.2;
8755
+ }
8756
+
8328
8757
  .nav-container[data-v-a74eb6f7] {
8329
8758
  max-width: 100%;
8330
8759
  overflow: hidden;
@@ -8505,14 +8934,14 @@ body {
8505
8934
  visibility: hidden !important;
8506
8935
  }
8507
8936
 
8508
- .brand-page-root[data-v-fbc9fc94] {
8937
+ .brand-page-root[data-v-2debce4b] {
8509
8938
  height: 100%;
8510
8939
  }
8511
- .sortable[data-v-fbc9fc94] {
8940
+ .sortable[data-v-2debce4b] {
8512
8941
  outline-color: #F7768C;
8513
8942
  outline-width: 0.2rem;
8514
8943
  }
8515
- .brand-page[data-v-fbc9fc94] {
8944
+ .brand-page[data-v-2debce4b] {
8516
8945
  -webkit-box-sizing: border-box;
8517
8946
  box-sizing: border-box;
8518
8947
  display: -webkit-box;
@@ -8524,7 +8953,7 @@ body {
8524
8953
  -ms-flex-direction: column;
8525
8954
  flex-direction: column;
8526
8955
  }
8527
- .brand-page__background-shapes-layer[data-v-fbc9fc94] {
8956
+ .brand-page__background-shapes-layer[data-v-2debce4b] {
8528
8957
  position: fixed;
8529
8958
  top: 0;
8530
8959
  left: 0;
@@ -8535,11 +8964,11 @@ body {
8535
8964
  transform: translate3d(0, 0, 0);
8536
8965
  contain: layout paint;
8537
8966
  }
8538
- .template-preview .brand-page__background-shapes-layer[data-v-fbc9fc94],
8539
- .device-wrapper .brand-page__background-shapes-layer[data-v-fbc9fc94] {
8967
+ .template-preview .brand-page__background-shapes-layer[data-v-2debce4b],
8968
+ .device-wrapper .brand-page__background-shapes-layer[data-v-2debce4b] {
8540
8969
  height: 100%;
8541
8970
  }
8542
- .brand-page__inner--default[data-v-fbc9fc94] {
8971
+ .brand-page__inner--default[data-v-2debce4b] {
8543
8972
  position: relative;
8544
8973
  z-index: 10;
8545
8974
  display: -webkit-box;
@@ -8551,16 +8980,16 @@ body {
8551
8980
  -ms-flex-direction: column;
8552
8981
  flex-direction: column;
8553
8982
  }
8554
- .brand-page__inner--desktop[data-v-fbc9fc94] {
8983
+ .brand-page__inner--desktop[data-v-2debce4b] {
8555
8984
  min-height: 100vh;
8556
8985
  }
8557
- .brand-site__header[data-v-fbc9fc94] {
8986
+ .brand-site__header[data-v-2debce4b] {
8558
8987
  container-type: inline-size;
8559
8988
  }
8560
- .brand-page__header[data-v-fbc9fc94] {
8989
+ .brand-page__header[data-v-2debce4b] {
8561
8990
  padding-top: var(--page-padding);
8562
8991
  }
8563
- .brand-page__content--default[data-v-fbc9fc94] {
8992
+ .brand-page__content--default[data-v-2debce4b] {
8564
8993
  margin-left: auto;
8565
8994
  margin-right: auto;
8566
8995
  margin-bottom: 2.5rem;
@@ -8577,7 +9006,7 @@ body {
8577
9006
  flex-direction: column;
8578
9007
  max-width: var(--page-max-width);
8579
9008
  }
8580
- .brand-page__content--desktop[data-v-fbc9fc94] {
9009
+ .brand-page__content--desktop[data-v-2debce4b] {
8581
9010
  margin-left: auto;
8582
9011
  margin-right: auto;
8583
9012
  display: -webkit-box;
@@ -8593,15 +9022,15 @@ body {
8593
9022
  flex-direction: column;
8594
9023
  max-width: 100%;
8595
9024
  }
8596
- .brand-page__content--inner[data-v-fbc9fc94] {
9025
+ .brand-page__content--inner[data-v-2debce4b] {
8597
9026
  padding-left: var(--page-padding);
8598
9027
  padding-right: var(--page-padding);
8599
9028
  }
8600
- .brand-page__content--inner--brandsite[data-v-fbc9fc94] {
9029
+ .brand-page__content--inner--brandsite[data-v-2debce4b] {
8601
9030
  max-width: var(--brandsite-max-width);
8602
9031
  margin: 0 auto;
8603
9032
  }
8604
- .brand-page__content--outline-selected[data-v-fbc9fc94] {
9033
+ .brand-page__content--outline-selected[data-v-2debce4b] {
8605
9034
  position: relative;
8606
9035
  z-index: 10;
8607
9036
  outline-color: #F7768C;
@@ -8609,20 +9038,20 @@ body {
8609
9038
  outline-style: dashed;
8610
9039
  outline-offset: -0.25rem;
8611
9040
  }
8612
- .brand-page__content--outline-footer-selected[data-v-fbc9fc94] {
9041
+ .brand-page__content--outline-footer-selected[data-v-2debce4b] {
8613
9042
  outline-color: #f7768c;
8614
9043
  outline-width: 0.2rem;
8615
9044
  outline-style: dashed;
8616
9045
  outline-offset: -0.25rem;
8617
9046
  }
8618
9047
  @media (max-width: 640px) {
8619
- .brand-page__content--inner--full-width[data-v-fbc9fc94] {
9048
+ .brand-page__content--inner--full-width[data-v-2debce4b] {
8620
9049
  padding-left: 0;
8621
9050
  padding-right: 0;
8622
9051
  }
8623
9052
  }
8624
9053
  @media (min-width: 640px) {
8625
- .brand-page__content--inner--full-width[data-v-fbc9fc94] {
9054
+ .brand-page__content--inner--full-width[data-v-2debce4b] {
8626
9055
  padding-left: var(--page-padding);
8627
9056
  padding-right: var(--page-padding);
8628
9057
  }
@@ -10215,6 +10644,15 @@ input.dynamic-width-input[data-v-97be2e87]:focus {
10215
10644
  color: rgb(36 36 36 / var(--tw-text-opacity))
10216
10645
  }
10217
10646
 
10647
+ .header-button-settings_option-title[data-v-86ff33c1] {
10648
+ font-family: Lato, Helvetica, sans-serif;
10649
+ font-size: 0.875rem;
10650
+ line-height: 1.25rem;
10651
+ font-weight: 700;
10652
+ --tw-text-opacity: 1;
10653
+ color: rgb(36 36 36 / var(--tw-text-opacity))
10654
+ }
10655
+
10218
10656
  .navigation-type-options[data-v-0fece584] button {
10219
10657
  padding-top: 8px !important;
10220
10658
  }
@@ -10254,7 +10692,7 @@ input.dynamic-width-input[data-v-97be2e87]:focus {
10254
10692
  margin: 0 auto;
10255
10693
  }
10256
10694
 
10257
- .header-settings-panel_option-title[data-v-473cfcf3] {
10695
+ .header-settings-panel_option-title[data-v-670bf7f8] {
10258
10696
  font-family: Lato, Helvetica, sans-serif;
10259
10697
  font-size: 0.875rem;
10260
10698
  line-height: 1.25rem;