@designcrowd/library.brand-page 6.1.16 → 6.1.17-ast-header-button

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 (85) hide show
  1. package/lib/src/{CreatedOnBrandCrowd-de-de-CmNhDMIf.js → CreatedOnBrandCrowd-de-de-Cwq9enJs.js} +1 -1
  2. package/lib/src/{CreatedOnBrandCrowd-en-us-DgplxxWa.js → CreatedOnBrandCrowd-en-us-ILK04gFj.js} +1 -1
  3. package/lib/src/{CreatedOnBrandCrowd-es-es-DFdhFOa1.js → CreatedOnBrandCrowd-es-es-CbjxLxtu.js} +1 -1
  4. package/lib/src/{CreatedOnBrandCrowd-fr-fr-DjLCWBLB.js → CreatedOnBrandCrowd-fr-ca-BwBDiK9z.js} +1 -1
  5. package/lib/src/{CreatedOnBrandCrowd-fr-ca-DjLCWBLB.js → CreatedOnBrandCrowd-fr-fr-BwBDiK9z.js} +1 -1
  6. package/lib/src/{CreatedOnBrandCrowd-pt-pt-CI2XD0OS.js → CreatedOnBrandCrowd-pt-br-DvhJROpG.js} +1 -1
  7. package/lib/src/{CreatedOnBrandCrowd-pt-br-CI2XD0OS.js → CreatedOnBrandCrowd-pt-pt-DvhJROpG.js} +1 -1
  8. package/lib/src/{CreatedOnDcom-de-de-CkLkBztx.js → CreatedOnDcom-de-de-BK9imWOh.js} +1 -1
  9. package/lib/src/{CreatedOnDcom-en-us-frnxBJJv.js → CreatedOnDcom-en-us-CyH-_qz1.js} +1 -1
  10. package/lib/src/{CreatedOnDcom-es-es-CrqgiERj.js → CreatedOnDcom-es-es-Dh51qYEA.js} +1 -1
  11. package/lib/src/{CreatedOnDcom-fr-ca-CPoEcusj.js → CreatedOnDcom-fr-ca-BArRxwWX.js} +1 -1
  12. package/lib/src/{CreatedOnDcom-fr-fr-BqrRH3dV.js → CreatedOnDcom-fr-fr-CdglI-ZB.js} +1 -1
  13. package/lib/src/{CreatedOnDcom-pt-br-CpbVi3Sw.js → CreatedOnDcom-pt-br-DCehns-G.js} +1 -1
  14. package/lib/src/{CreatedOnDcom-pt-pt-s0XZ3c7y.js → CreatedOnDcom-pt-pt-B8hl-oew.js} +1 -1
  15. package/lib/src/brand-page/components/navigation/navigation-side-menu/NavigationSideMenu.mixin.d.ts +27 -2
  16. package/lib/src/brand-page/components/navigation/navigation-side-menu/NavigationSideMenu.mixin.js +26 -0
  17. package/lib/src/brand-page/components/page-header/PageHeader.mixin.d.ts +3 -1
  18. package/lib/src/brand-page/components/page-header/PageHeader.mixin.js +12 -0
  19. package/lib/src/brand-page/models/index.d.ts +12 -0
  20. package/lib/src/brand-page/models/index.js +3 -0
  21. package/lib/src/brand-page/utils/button.util.d.ts +5 -0
  22. package/lib/src/brand-page/utils/button.util.js +4 -0
  23. package/lib/src/brand-page/utils/view-model.util.d.ts +1 -0
  24. package/lib/src/brand-page/utils/view-model.util.js +51 -1
  25. package/lib/src/brand-page/view-models.d.ts +3 -1
  26. package/lib/src/brand-page-maker/components/brand-page-maker/BrandPageMaker.mixin.d.ts +1 -1
  27. package/lib/src/brand-page-maker/components/brandpage-maker-page/BrandPageMakerPage.mixin.d.ts +1 -1
  28. package/lib/src/brand-page-maker/stores/ai-checkpoint/ai-checkpoint-store.d.ts +1008 -0
  29. package/lib/src/{bundled-translations-B2q5GWTQ.js → bundled-translations-B8fAEel0.js} +1 -1
  30. package/lib/src/bundles/bundled-translations.json +7 -1
  31. package/lib/src/css/library.brand-page-brandCrowd.min.css +315 -122
  32. package/lib/src/css/library.brand-page-brandPage.min.css +315 -122
  33. package/lib/src/css/library.brand-page-designCom.min.css +315 -122
  34. package/lib/src/css/library.brand-page-preview.min.css +315 -122
  35. package/lib/src/index.d.ts +1 -0
  36. package/lib/src/index.mjs +45 -44
  37. package/lib/src/{lib-O_eJgJHP.js → lib-KFjPFfxn.js} +31522 -31118
  38. package/lib/src/lib.js +1 -0
  39. package/lib/src/shared/content-settings/components/content-settings/ContentSettings.mixin.d.ts +1 -1
  40. package/lib/src/shared/content-settings/components/content-settings/ReplaceImageSettingsForContent.mixin.d.ts +1 -1
  41. package/lib/src/shared/content-settings/components/content-settings-item/ContentSettingsItemField.mixin.d.ts +1 -1
  42. package/lib/src/shared/content-settings/components/payment-config-field/PaymentConfigField.mixin.d.ts +1 -1
  43. package/lib/src/shared/ecommerce-settings/util/refreshDuplicatedMetadata.d.ts +11 -0
  44. package/lib/src/shared/ecommerce-settings/util/refreshDuplicatedMetadata.js +80 -0
  45. package/lib/src/shared/logo-settings/components/LogoSettings.mixin.d.ts +1 -1
  46. package/lib/src/shared/page-settings/components/delete-page-modal/DeletePageModal.mixin.d.ts +1 -1
  47. package/lib/src/shared/page-settings/components/new-page-modal/NewPageModal.mixin.d.ts +1 -1
  48. package/lib/src/shared/page-settings/components/page-settings/PageSettings.mixin.d.ts +113 -1
  49. package/lib/src/shared/page-settings/components/page-settings-section-styles/PageSettingsSectionStyles.mixin.d.ts +117 -2
  50. package/lib/src/shared/page-settings/components/page-settings-section-styles/PageSettingsSectionStyles.mixin.js +43 -1
  51. package/lib/src/shared/page-settings/store/page-settings-store.d.ts +2 -2
  52. package/package.json +1 -1
  53. package/src/brand-page/components/button/Button.vue +35 -8
  54. package/src/brand-page/components/button/Button.vue.test.ts +59 -0
  55. package/src/brand-page/components/navigation/navigation-side-menu/NavigationSideMenu.mixin.ts +29 -1
  56. package/src/brand-page/components/navigation/navigation-side-menu/NavigationSideMenu.vue +36 -0
  57. package/src/brand-page/components/navigation/navigation-side-menu/NavigationSideMenu.vue.test.ts +175 -0
  58. package/src/brand-page/components/page/Page.vue +6 -0
  59. package/src/brand-page/components/page-header/HeaderLayout.vue +198 -4
  60. package/src/brand-page/components/page-header/PageHeader.mixin.ts +16 -1
  61. package/src/brand-page/components/page-header/PageHeader.vue +23 -1
  62. package/src/brand-page/components/page-header/PageHeader.vue.test.ts +378 -0
  63. package/src/brand-page/models/header-button.model.test.ts +86 -0
  64. package/src/brand-page/models/index.ts +16 -0
  65. package/src/brand-page/utils/__snapshots__/migration.util.test.ts.snap +6 -0
  66. package/src/brand-page/utils/__snapshots__/migration2.util.test.ts.snap +2 -0
  67. package/src/brand-page/utils/__snapshots__/model.util.test.ts.snap +4 -0
  68. package/src/brand-page/utils/button.util.ts +8 -0
  69. package/src/brand-page/utils/view-model.util.test.ts +146 -1
  70. package/src/brand-page/utils/view-model.util.ts +71 -1
  71. package/src/brand-page/view-models.ts +3 -0
  72. package/src/bundles/bundled-translations.json +7 -1
  73. package/src/lib.ts +1 -0
  74. package/src/shared/ecommerce-settings/util/refreshDuplicatedMetadata.test.ts +399 -0
  75. package/src/shared/ecommerce-settings/util/refreshDuplicatedMetadata.ts +99 -0
  76. package/src/shared/page-settings/components/header-settings-panel/HeaderSettingsPanel.button-section.test.ts +126 -0
  77. package/src/shared/page-settings/components/header-settings-panel/HeaderSettingsPanel.vue +43 -6
  78. package/src/shared/page-settings/components/page-settings-section-styles/HeaderButtonSettings.test.ts +167 -0
  79. package/src/shared/page-settings/components/page-settings-section-styles/HeaderButtonSettings.vue +237 -0
  80. package/src/shared/page-settings/components/page-settings-section-styles/HeaderDisplayStyle.test.ts +160 -0
  81. package/src/shared/page-settings/components/page-settings-section-styles/HeaderDisplayStyle.vue +37 -8
  82. package/src/shared/page-settings/components/page-settings-section-styles/PageSettingsSectionStyles.mixin.header-button.test.ts +113 -0
  83. package/src/shared/page-settings/components/page-settings-section-styles/PageSettingsSectionStyles.mixin.ts +47 -0
  84. package/src/shared/page-settings/components/page-settings-section-styles/i18n/page-settings-section.json +7 -1
  85. package/src/shared/page-settings/store/page-settings-store.ts +2 -0
@@ -6493,7 +6493,7 @@ input[data-v-4cd691db]::-webkit-inner-spin-button {
6493
6493
  content: '\00A0';
6494
6494
  }
6495
6495
 
6496
- .c-button[data-v-7574ba8b] {
6496
+ .c-button[data-v-bb52efe6] {
6497
6497
  --icon-h: 1.5rem;
6498
6498
  --icon-m-r: 2rem;
6499
6499
  --icon-m-icon: 0.5rem;
@@ -6507,7 +6507,7 @@ input[data-v-4cd691db]::-webkit-inner-spin-button {
6507
6507
 
6508
6508
  /* Shape-library icons (vector, nested in .c-shape, no class on the img):
6509
6509
  render at the default icon size, centered in normal flow like the SVG icons. */
6510
- .bp-button[data-v-7574ba8b] .c-button__icon-img img {
6510
+ .bp-button[data-v-bb52efe6] .c-button__icon-img img {
6511
6511
  max-width: none;
6512
6512
  -o-object-fit: cover;
6513
6513
  object-fit: cover;
@@ -6517,7 +6517,7 @@ input[data-v-4cd691db]::-webkit-inner-spin-button {
6517
6517
 
6518
6518
  /* Raster image thumbnails (FallbackImage renders <img class="c-image">):
6519
6519
  render larger/prominent and centered over the icon slot. */
6520
- .bp-button[data-v-7574ba8b] .c-button__icon-img img.c-image {
6520
+ .bp-button[data-v-bb52efe6] .c-button__icon-img img.c-image {
6521
6521
  --icon-img-size: 2.3rem;
6522
6522
  position: absolute;
6523
6523
  top: calc(var(--icon-img-size) / -2 + var(--icon-h) / 2);
@@ -6525,49 +6525,49 @@ input[data-v-4cd691db]::-webkit-inner-spin-button {
6525
6525
  width: var(--icon-img-size);
6526
6526
  height: var(--icon-img-size);
6527
6527
  }
6528
- .c-button--disabled[data-v-7574ba8b] {
6528
+ .c-button--disabled[data-v-bb52efe6] {
6529
6529
  pointer-events: none;
6530
6530
  }
6531
- .c-button[data-v-7574ba8b]:hover .c-button__label p {
6531
+ .c-button[data-v-bb52efe6]:hover .c-button__label p {
6532
6532
  text-decoration: underline;
6533
6533
  }
6534
- .c-button__icon[data-v-7574ba8b] {
6534
+ .c-button__icon[data-v-bb52efe6] {
6535
6535
  margin-right: var(--icon-m-r);
6536
6536
  }
6537
- .bp-button[data-v-7574ba8b] .c-button__icon-img {
6537
+ .bp-button[data-v-bb52efe6] .c-button__icon-img {
6538
6538
  margin-right: var(--icon-m-r);
6539
6539
  width: var(--icon-w);
6540
6540
  height: var(--icon-h);
6541
6541
  }
6542
- .c-button__label[data-v-7574ba8b] {
6542
+ .c-button__label[data-v-bb52efe6] {
6543
6543
  margin: 0 auto;
6544
6544
  word-break: break-word;
6545
6545
  overflow-wrap: anywhere;
6546
6546
  width: auto;
6547
6547
  }
6548
- .c-button__label--offset-sm[data-v-7574ba8b] {
6548
+ .c-button__label--offset-sm[data-v-bb52efe6] {
6549
6549
  -webkit-transform: translateX(-1.5rem);
6550
6550
  transform: translateX(-1.5rem);
6551
6551
  }
6552
- .c-button__label--offset-md[data-v-7574ba8b] {
6552
+ .c-button__label--offset-md[data-v-bb52efe6] {
6553
6553
  -webkit-transform: translateX(-1.75rem);
6554
6554
  transform: translateX(-1.75rem);
6555
6555
  }
6556
- .c-button__label--offset-lg[data-v-7574ba8b] {
6556
+ .c-button__label--offset-lg[data-v-bb52efe6] {
6557
6557
  -webkit-transform: translateX(-1.5rem);
6558
6558
  transform: translateX(-1.5rem);
6559
6559
  }
6560
- .c-button__no-icon[data-v-7574ba8b] {
6560
+ .c-button__no-icon[data-v-bb52efe6] {
6561
6561
  margin-right: var(--icon-m-r);
6562
6562
  width: var(--icon-w);
6563
6563
  height: var(--icon-h);
6564
6564
  }
6565
- .device-wrapper--mobile .c-button__icon[data-v-7574ba8b] {
6565
+ .device-wrapper--mobile .c-button__icon[data-v-bb52efe6] {
6566
6566
  margin: 0;
6567
6567
  margin-right: var(--icon-m-r);
6568
6568
  }
6569
6569
  @media (min-width: 767px) {
6570
- .c-button__icon[data-v-7574ba8b] {
6570
+ .c-button__icon[data-v-bb52efe6] {
6571
6571
  margin: 0 var(--icon-m-icon);
6572
6572
  }
6573
6573
  }
@@ -7719,62 +7719,68 @@ select[data-v-665b8067] {
7719
7719
  margin: 0 auto;
7720
7720
  }
7721
7721
 
7722
- .root[data-v-32fe142c] {
7723
- --logo-width: var(--v5fd54c9a);
7722
+ .root[data-v-27d98913] {
7723
+ --logo-width: var(--aa5a55f0);
7724
7724
  --logo-max-width: 20rem;
7725
7725
  --tab-nav-height: 56px;
7726
7726
  --hamburger-nav-height: 32px;
7727
7727
  --hamburger-nav-width: 32px;
7728
7728
  }
7729
- .layout[data-v-32fe142c] {
7729
+ .layout[data-v-27d98913] {
7730
7730
  -webkit-box-align: center;
7731
7731
  -ms-flex-align: center;
7732
7732
  align-items: center;
7733
7733
  }
7734
- .nav-container[data-v-32fe142c] {
7734
+ .nav-container[data-v-27d98913] {
7735
7735
  max-width: 100%;
7736
7736
  overflow: hidden;
7737
7737
  }
7738
- .logo-container[data-v-32fe142c] {
7738
+ .logo-container[data-v-27d98913] {
7739
+ }
7740
+ /* The CTA container is a plain block: every family below positions the BOX, and the
7741
+ button then fills whatever box it is given (full width for the mobile row,
7742
+ content width everywhere else). */
7743
+ .cta-container[data-v-27d98913] {
7744
+ min-width: 0;
7739
7745
  }
7740
7746
 
7741
7747
  /* DESKTOP_TAB_1 */
7742
- .desktop-tab-horizontal-stack-left-logo-right-menu[data-v-32fe142c] {
7748
+ .desktop-tab-horizontal-stack-left-logo-right-menu[data-v-27d98913] {
7743
7749
  display: -webkit-box;
7744
7750
  display: -ms-flexbox;
7745
7751
  display: flex;
7746
7752
  }
7747
- .desktop-tab-horizontal-stack-left-logo-right-menu .nav-container[data-v-32fe142c] {
7753
+ .desktop-tab-horizontal-stack-left-logo-right-menu .nav-container[data-v-27d98913] {
7748
7754
  -webkit-box-flex: 1;
7749
7755
  -ms-flex: 1;
7750
7756
  flex: 1;
7751
7757
  margin-left: 1rem;
7752
7758
  }
7753
- .desktop-tab-horizontal-stack-left-logo-right-menu .nav-container__inner[data-v-32fe142c] {
7759
+ .desktop-tab-horizontal-stack-left-logo-right-menu .nav-container__inner[data-v-27d98913] {
7754
7760
  display: inline-block;
7755
7761
  float: right;
7756
7762
  max-width: 100%;
7757
7763
  }
7758
7764
 
7759
7765
  /* DESKTOP_TAB_2 */
7760
- .desktop-tab-horizontal-stack-left-logo-left-menu[data-v-32fe142c] {
7766
+ .desktop-tab-horizontal-stack-left-logo-left-menu[data-v-27d98913] {
7761
7767
  display: -webkit-box;
7762
7768
  display: -ms-flexbox;
7763
7769
  display: flex;
7764
7770
  }
7765
- .desktop-tab-horizontal-stack-left-logo-left-menu .nav-container[data-v-32fe142c] {
7771
+ .desktop-tab-horizontal-stack-left-logo-left-menu .nav-container[data-v-27d98913] {
7766
7772
  -webkit-box-flex: 1;
7767
7773
  -ms-flex: 1;
7768
7774
  flex: 1;
7769
7775
  margin-left: 1rem;
7770
7776
  }
7771
- .desktop-tab-horizontal-stack-left-logo-left-menu .nav-container__inner[data-v-32fe142c] {
7777
+ .desktop-tab-horizontal-stack-left-logo-left-menu .nav-container__inner[data-v-27d98913] {
7772
7778
  display: inline-block;
7773
7779
  max-width: 100%;
7774
7780
  }
7775
7781
 
7776
7782
  /* DESKTOP_TAB_3 */
7777
- .desktop-tab-horizontal-stack-left-logo-centered-menu[data-v-32fe142c] {
7783
+ .desktop-tab-horizontal-stack-left-logo-centered-menu[data-v-27d98913] {
7778
7784
  display: grid;
7779
7785
  grid-template-columns:
7780
7786
  [logo-start] var(--logo-max-width) [logo-end nav-start] 1fr [nav-end] var(
@@ -7787,14 +7793,14 @@ select[data-v-665b8067] {
7787
7793
  margin-top: 1rem;
7788
7794
  margin-bottom: 1rem;
7789
7795
  }
7790
- .desktop-tab-horizontal-stack-left-logo-centered-menu .logo-container[data-v-32fe142c] {
7796
+ .desktop-tab-horizontal-stack-left-logo-centered-menu .logo-container[data-v-27d98913] {
7791
7797
  grid-column: logo-start / logo-end;
7792
7798
  justify-self: start;
7793
7799
  }
7794
- .desktop-tab-horizontal-stack-left-logo-centered-menu .nav-container[data-v-32fe142c] {
7800
+ .desktop-tab-horizontal-stack-left-logo-centered-menu .nav-container[data-v-27d98913] {
7795
7801
  grid-column: nav-start / nav-end;
7796
7802
  }
7797
- .desktop-tab-horizontal-stack-left-logo-centered-menu .nav-container__inner[data-v-32fe142c] {
7803
+ .desktop-tab-horizontal-stack-left-logo-centered-menu .nav-container__inner[data-v-27d98913] {
7798
7804
  /* start - center content */
7799
7805
  display: inline-block;
7800
7806
  -webkit-transform: translateX(-50%);
@@ -7805,7 +7811,7 @@ select[data-v-665b8067] {
7805
7811
  /* end - center content */
7806
7812
  }
7807
7813
  /* DESKTOP_TAB_4 */
7808
- .desktop-tab-horizontal-stack-centered-logo-right-menu[data-v-32fe142c] {
7814
+ .desktop-tab-horizontal-stack-centered-logo-right-menu[data-v-27d98913] {
7809
7815
  display: grid;
7810
7816
  -webkit-column-gap: 1rem;
7811
7817
  -moz-column-gap: 1rem;
@@ -7814,26 +7820,26 @@ select[data-v-665b8067] {
7814
7820
  [col-start] 1fr [logo-start] var(--logo-max-width)
7815
7821
  [logo-end nav-start] 1fr [nav-end];
7816
7822
  }
7817
- .desktop-tab-horizontal-stack-centered-logo-right-menu .logo-container[data-v-32fe142c] {
7823
+ .desktop-tab-horizontal-stack-centered-logo-right-menu .logo-container[data-v-27d98913] {
7818
7824
  grid-column: logo-start / logo-end;
7819
7825
  }
7820
- .desktop-tab-horizontal-stack-centered-logo-right-menu .nav-container[data-v-32fe142c] {
7826
+ .desktop-tab-horizontal-stack-centered-logo-right-menu .nav-container[data-v-27d98913] {
7821
7827
  grid-column: nav-start / nav-end;
7822
7828
  }
7823
- .desktop-tab-horizontal-stack-centered-logo-right-menu .nav-container__inner[data-v-32fe142c] {
7829
+ .desktop-tab-horizontal-stack-centered-logo-right-menu .nav-container__inner[data-v-27d98913] {
7824
7830
  /* start - align right content */
7825
7831
  float: right;
7826
7832
  max-width: 100%;
7827
7833
  /* end - align right content */
7828
7834
  }
7829
7835
  /* DESKTOP_TAB_5 */
7830
- .desktop-tab-vertical-stack-centered-logo-centered-menu[data-v-32fe142c] {
7836
+ .desktop-tab-vertical-stack-centered-logo-centered-menu[data-v-27d98913] {
7831
7837
  -webkit-box-align: center;
7832
7838
  -ms-flex-align: center;
7833
7839
  align-items: center;
7834
7840
  justify-items: center;
7835
7841
  }
7836
- .desktop-tab-vertical-stack-centered-logo-centered-menu.show-nav[data-v-32fe142c] {
7842
+ .desktop-tab-vertical-stack-centered-logo-centered-menu.show-nav[data-v-27d98913] {
7837
7843
  display: grid;
7838
7844
  grid-template-rows: repeat(2, minmax(0, 1fr));
7839
7845
  row-gap: 1rem;
@@ -7842,16 +7848,16 @@ select[data-v-665b8067] {
7842
7848
  [row2-end];
7843
7849
  }
7844
7850
  .desktop-tab-vertical-stack-centered-logo-centered-menu.show-nav
7845
- .logo-container[data-v-32fe142c] {
7851
+ .logo-container[data-v-27d98913] {
7846
7852
  grid-row: row1-start / row1-end;
7847
7853
  }
7848
7854
  .desktop-tab-vertical-stack-centered-logo-centered-menu.show-nav
7849
- .nav-container[data-v-32fe142c] {
7855
+ .nav-container[data-v-27d98913] {
7850
7856
  grid-row: row2-start / row2-end;
7851
7857
  width: 100%;
7852
7858
  }
7853
7859
  .desktop-tab-vertical-stack-centered-logo-centered-menu.show-nav
7854
- .nav-container__inner[data-v-32fe142c] {
7860
+ .nav-container__inner[data-v-27d98913] {
7855
7861
  display: inline-block;
7856
7862
  -webkit-transform: translateX(-50%);
7857
7863
  transform: translateX(-50%);
@@ -7859,7 +7865,7 @@ select[data-v-665b8067] {
7859
7865
  position: relative;
7860
7866
  max-width: 100%;
7861
7867
  }
7862
- .desktop-tab-vertical-stack-centered-logo-centered-menu.no-nav[data-v-32fe142c] {
7868
+ .desktop-tab-vertical-stack-centered-logo-centered-menu.no-nav[data-v-27d98913] {
7863
7869
  display: -webkit-box;
7864
7870
  display: -ms-flexbox;
7865
7871
  display: flex;
@@ -7869,14 +7875,14 @@ select[data-v-665b8067] {
7869
7875
  }
7870
7876
 
7871
7877
  /* MOBILE_TAB_1 */
7872
- .mobile-tab-vertical-stack-centered-logo-centered-menu[data-v-32fe142c] {
7878
+ .mobile-tab-vertical-stack-centered-logo-centered-menu[data-v-27d98913] {
7873
7879
  -webkit-box-align: center;
7874
7880
  -ms-flex-align: center;
7875
7881
  align-items: center;
7876
7882
  justify-items: center;
7877
7883
  width: 100%;
7878
7884
  }
7879
- .mobile-tab-vertical-stack-centered-logo-centered-menu.show-nav[data-v-32fe142c] {
7885
+ .mobile-tab-vertical-stack-centered-logo-centered-menu.show-nav[data-v-27d98913] {
7880
7886
  display: grid;
7881
7887
  row-gap: 1rem;
7882
7888
  grid-template-rows:
@@ -7884,21 +7890,21 @@ select[data-v-665b8067] {
7884
7890
  [row2-end];
7885
7891
  }
7886
7892
  .mobile-tab-vertical-stack-centered-logo-centered-menu.show-nav
7887
- .logo-container[data-v-32fe142c] {
7893
+ .logo-container[data-v-27d98913] {
7888
7894
  grid-row: row1-start / row1-end;
7889
7895
  }
7890
- .mobile-tab-vertical-stack-centered-logo-centered-menu.show-nav .nav-container[data-v-32fe142c] {
7896
+ .mobile-tab-vertical-stack-centered-logo-centered-menu.show-nav .nav-container[data-v-27d98913] {
7891
7897
  grid-row: row2-start / row2-end;
7892
7898
  width: 100%;
7893
7899
  }
7894
- .mobile-tab-vertical-stack-centered-logo-centered-menu.no-nav[data-v-32fe142c] {
7900
+ .mobile-tab-vertical-stack-centered-logo-centered-menu.no-nav[data-v-27d98913] {
7895
7901
  display: -webkit-box;
7896
7902
  display: -ms-flexbox;
7897
7903
  display: flex;
7898
7904
  }
7899
7905
 
7900
7906
  /* DESKTOP_TAB_6 */
7901
- .desktop-tab-vertical-stack-centered-menu-centered-logo.show-nav[data-v-32fe142c] {
7907
+ .desktop-tab-vertical-stack-centered-menu-centered-logo.show-nav[data-v-27d98913] {
7902
7908
  display: grid;
7903
7909
  grid-template-rows:
7904
7910
  [row1-start] var(--tab-nav-height)
@@ -7910,28 +7916,28 @@ select[data-v-665b8067] {
7910
7916
  justify-items: center;
7911
7917
  }
7912
7918
  .desktop-tab-vertical-stack-centered-menu-centered-logo.show-nav
7913
- .logo-container[data-v-32fe142c] {
7919
+ .logo-container[data-v-27d98913] {
7914
7920
  grid-row: row2-start / row2-end;
7915
7921
  text-align: center;
7916
7922
  }
7917
7923
  .desktop-tab-vertical-stack-centered-menu-centered-logo.show-nav
7918
- .nav-container[data-v-32fe142c] {
7924
+ .nav-container[data-v-27d98913] {
7919
7925
  grid-row: row1-start / row1-end;
7920
7926
  }
7921
- .layout desktop-tab-vertical-stack-centered-menu-centered-logo.no-nav[data-v-32fe142c] {
7927
+ .layout desktop-tab-vertical-stack-centered-menu-centered-logo.no-nav[data-v-27d98913] {
7922
7928
  display: -webkit-box;
7923
7929
  display: -ms-flexbox;
7924
7930
  display: flex;
7925
7931
  }
7926
7932
  /* MOBILE_TAB_2 */
7927
- .mobile-tab-vertical-stack-centered-menu-centered-logo[data-v-32fe142c] {
7933
+ .mobile-tab-vertical-stack-centered-menu-centered-logo[data-v-27d98913] {
7928
7934
  -webkit-box-align: center;
7929
7935
  -ms-flex-align: center;
7930
7936
  align-items: center;
7931
7937
  justify-items: center;
7932
7938
  width: 100%;
7933
7939
  }
7934
- .mobile-tab-vertical-stack-centered-menu-centered-logo.show-nav[data-v-32fe142c] {
7940
+ .mobile-tab-vertical-stack-centered-menu-centered-logo.show-nav[data-v-27d98913] {
7935
7941
  display: grid;
7936
7942
  grid-template-rows:
7937
7943
  [row1-start] var(--tab-nav-height)
@@ -7940,22 +7946,22 @@ select[data-v-665b8067] {
7940
7946
  margin-top: 1rem;
7941
7947
  }
7942
7948
  .mobile-tab-vertical-stack-centered-menu-centered-logo.show-nav
7943
- .logo-container[data-v-32fe142c] {
7949
+ .logo-container[data-v-27d98913] {
7944
7950
  grid-row: row2-start / row2-end;
7945
7951
  }
7946
- .mobile-tab-vertical-stack-centered-menu-centered-logo.show-nav .nav-container[data-v-32fe142c] {
7952
+ .mobile-tab-vertical-stack-centered-menu-centered-logo.show-nav .nav-container[data-v-27d98913] {
7947
7953
  grid-row: row1-start / row1-end;
7948
7954
  width: 100%;
7949
7955
  }
7950
- .mobile-tab-vertical-stack-centered-menu-centered-logo.no-nav[data-v-32fe142c] {
7956
+ .mobile-tab-vertical-stack-centered-menu-centered-logo.no-nav[data-v-27d98913] {
7951
7957
  display: -webkit-box;
7952
7958
  display: -ms-flexbox;
7953
7959
  display: flex;
7954
7960
  }
7955
7961
 
7956
7962
  /* DESKTOP_TAB_NO_LOGO_1, DESKTOP_HAMBURGER_NO_LOGO_1 */
7957
- .desktop-tab-left-menu-no-logo[data-v-32fe142c],
7958
- .desktop-hamburger-no-logo-left-menu[data-v-32fe142c] {
7963
+ .desktop-tab-left-menu-no-logo[data-v-27d98913],
7964
+ .desktop-hamburger-no-logo-left-menu[data-v-27d98913] {
7959
7965
  display: -webkit-box;
7960
7966
  display: -ms-flexbox;
7961
7967
  display: flex;
@@ -7963,15 +7969,15 @@ select[data-v-665b8067] {
7963
7969
  -ms-flex-pack: start;
7964
7970
  justify-content: flex-start;
7965
7971
  }
7966
- .desktop-tab-left-menu-no-logo .logo-container[data-v-32fe142c],
7967
- .desktop-hamburger-no-logo-left-menu .logo-container[data-v-32fe142c] {
7972
+ .desktop-tab-left-menu-no-logo .logo-container[data-v-27d98913],
7973
+ .desktop-hamburger-no-logo-left-menu .logo-container[data-v-27d98913] {
7968
7974
  display: none;
7969
7975
  }
7970
7976
 
7971
7977
  /* DESKTOP_TAB_NO_LOGO_2, DESKTOP_HAMBURGER_NO_LOGO_2, MOBILE_TAB_NO_LOGO_1 */
7972
- .desktop-tab-centered-menu-no-logo[data-v-32fe142c],
7973
- .desktop-hamburger-no-logo-centered-menu[data-v-32fe142c],
7974
- .mobile-tab-centered-menu-no-logo[data-v-32fe142c] {
7978
+ .desktop-tab-centered-menu-no-logo[data-v-27d98913],
7979
+ .desktop-hamburger-no-logo-centered-menu[data-v-27d98913],
7980
+ .mobile-tab-centered-menu-no-logo[data-v-27d98913] {
7975
7981
  display: -webkit-box;
7976
7982
  display: -ms-flexbox;
7977
7983
  display: flex;
@@ -7979,15 +7985,15 @@ select[data-v-665b8067] {
7979
7985
  -ms-flex-pack: center;
7980
7986
  justify-content: center;
7981
7987
  }
7982
- .desktop-tab-centered-menu-no-logo .logo-container[data-v-32fe142c],
7983
- .desktop-hamburger-no-logo-centered-menu .logo-container[data-v-32fe142c],
7984
- .mobile-tab-centered-menu-no-logo .logo-container[data-v-32fe142c] {
7988
+ .desktop-tab-centered-menu-no-logo .logo-container[data-v-27d98913],
7989
+ .desktop-hamburger-no-logo-centered-menu .logo-container[data-v-27d98913],
7990
+ .mobile-tab-centered-menu-no-logo .logo-container[data-v-27d98913] {
7985
7991
  display: none;
7986
7992
  }
7987
7993
 
7988
7994
  /* DESKTOP_TAB_NO_LOGO_3, DESKTOP_HAMBURGER_NO_LOGO_3 */
7989
- .desktop-tab-right-menu-no-logo[data-v-32fe142c],
7990
- .desktop-hamburger-no-logo-right-menu[data-v-32fe142c] {
7995
+ .desktop-tab-right-menu-no-logo[data-v-27d98913],
7996
+ .desktop-hamburger-no-logo-right-menu[data-v-27d98913] {
7991
7997
  display: -webkit-box;
7992
7998
  display: -ms-flexbox;
7993
7999
  display: flex;
@@ -7995,14 +8001,14 @@ select[data-v-665b8067] {
7995
8001
  -ms-flex-pack: end;
7996
8002
  justify-content: flex-end;
7997
8003
  }
7998
- .desktop-tab-right-menu-no-logo .logo-container[data-v-32fe142c],
7999
- .desktop-hamburger-no-logo-right-menu .logo-container[data-v-32fe142c] {
8004
+ .desktop-tab-right-menu-no-logo .logo-container[data-v-27d98913],
8005
+ .desktop-hamburger-no-logo-right-menu .logo-container[data-v-27d98913] {
8000
8006
  display: none;
8001
8007
  }
8002
8008
 
8003
8009
  /* DESKTOP_HAMBURGER_1, MOBILE_HAMBURGER_1 */
8004
- .desktop-hamburger-horizontal-stack-left-logo-right-menu[data-v-32fe142c],
8005
- .mobile-hamburger-horizontal-stack-left-logo-right-menu[data-v-32fe142c] {
8010
+ .desktop-hamburger-horizontal-stack-left-logo-right-menu[data-v-27d98913],
8011
+ .mobile-hamburger-horizontal-stack-left-logo-right-menu[data-v-27d98913] {
8006
8012
  display: grid;
8007
8013
  grid-template-columns: [logo-start] auto [nav-start] var(
8008
8014
  --hamburger-nav-width
@@ -8011,8 +8017,8 @@ select[data-v-665b8067] {
8011
8017
  -ms-flex-align: start;
8012
8018
  align-items: start;
8013
8019
  }
8014
- .desktop-hamburger-horizontal-stack-left-logo-right-menu .logo-container[data-v-32fe142c],
8015
- .mobile-hamburger-horizontal-stack-left-logo-right-menu .logo-container[data-v-32fe142c] {
8020
+ .desktop-hamburger-horizontal-stack-left-logo-right-menu .logo-container[data-v-27d98913],
8021
+ .mobile-hamburger-horizontal-stack-left-logo-right-menu .logo-container[data-v-27d98913] {
8016
8022
  margin-right: 1rem;
8017
8023
  display: -webkit-box;
8018
8024
  display: -ms-flexbox;
@@ -8022,15 +8028,15 @@ select[data-v-665b8067] {
8022
8028
  justify-content: flex-start;
8023
8029
  grid-column: logo-start;
8024
8030
  }
8025
- .desktop-hamburger-horizontal-stack-left-logo-right-menu .nav-container[data-v-32fe142c],
8026
- .mobile-hamburger-horizontal-stack-left-logo-right-menu .nav-container[data-v-32fe142c] {
8031
+ .desktop-hamburger-horizontal-stack-left-logo-right-menu .nav-container[data-v-27d98913],
8032
+ .mobile-hamburger-horizontal-stack-left-logo-right-menu .nav-container[data-v-27d98913] {
8027
8033
  grid-column: nav-start;
8028
8034
  margin: var(--page-padding) 0;
8029
8035
  }
8030
8036
 
8031
8037
  /* DESKTOP_HAMBURGER_2, MOBILE_HAMBURGER_2 */
8032
- .desktop-hamburger-horizontal-stack-centered-logo-right-menu[data-v-32fe142c],
8033
- .mobile-hamburger-horizontal-stack-centered-logo-right-menu[data-v-32fe142c] {
8038
+ .desktop-hamburger-horizontal-stack-centered-logo-right-menu[data-v-27d98913],
8039
+ .mobile-hamburger-horizontal-stack-centered-logo-right-menu[data-v-27d98913] {
8034
8040
  display: grid;
8035
8041
  grid-template-columns:
8036
8042
  [start] var(--hamburger-nav-width)
@@ -8039,8 +8045,8 @@ select[data-v-665b8067] {
8039
8045
  -ms-flex-align: start;
8040
8046
  align-items: start;
8041
8047
  }
8042
- .desktop-hamburger-horizontal-stack-centered-logo-right-menu .logo-container[data-v-32fe142c],
8043
- .mobile-hamburger-horizontal-stack-centered-logo-right-menu .logo-container[data-v-32fe142c] {
8048
+ .desktop-hamburger-horizontal-stack-centered-logo-right-menu .logo-container[data-v-27d98913],
8049
+ .mobile-hamburger-horizontal-stack-centered-logo-right-menu .logo-container[data-v-27d98913] {
8044
8050
  margin-left: 1rem;
8045
8051
  margin-right: 1rem;
8046
8052
  display: -webkit-box;
@@ -8051,14 +8057,14 @@ select[data-v-665b8067] {
8051
8057
  justify-content: center;
8052
8058
  grid-column: logo-start;
8053
8059
  }
8054
- .desktop-hamburger-horizontal-stack-centered-logo-right-menu .nav-container[data-v-32fe142c],
8055
- .mobile-hamburger-horizontal-stack-centered-logo-right-menu .nav-container[data-v-32fe142c] {
8060
+ .desktop-hamburger-horizontal-stack-centered-logo-right-menu .nav-container[data-v-27d98913],
8061
+ .mobile-hamburger-horizontal-stack-centered-logo-right-menu .nav-container[data-v-27d98913] {
8056
8062
  grid-column: nav-start;
8057
8063
  margin: var(--page-padding) 0;
8058
8064
  }
8059
8065
 
8060
8066
  /* MOBILE_HAMBURGER_3 */
8061
- .mobile-hamburger-horizontal-stack-left-menu-centered-logo[data-v-32fe142c] {
8067
+ .mobile-hamburger-horizontal-stack-left-menu-centered-logo[data-v-27d98913] {
8062
8068
  display: grid;
8063
8069
  grid-template-columns: var(--hamburger-nav-width) auto var(
8064
8070
  --hamburger-nav-width
@@ -8068,7 +8074,7 @@ select[data-v-665b8067] {
8068
8074
  -ms-flex-align: start;
8069
8075
  align-items: start;
8070
8076
  }
8071
- .mobile-hamburger-horizontal-stack-left-menu-centered-logo .logo-container[data-v-32fe142c] {
8077
+ .mobile-hamburger-horizontal-stack-left-menu-centered-logo .logo-container[data-v-27d98913] {
8072
8078
  margin-left: 1rem;
8073
8079
  margin-right: 1rem;
8074
8080
  display: -webkit-box;
@@ -8079,18 +8085,18 @@ select[data-v-665b8067] {
8079
8085
  justify-content: center;
8080
8086
  grid-area: b;
8081
8087
  }
8082
- .mobile-hamburger-horizontal-stack-left-menu-centered-logo .nav-container[data-v-32fe142c] {
8088
+ .mobile-hamburger-horizontal-stack-left-menu-centered-logo .nav-container[data-v-27d98913] {
8083
8089
  grid-area: a;
8084
8090
  margin: var(--page-padding) 0;
8085
8091
  }
8086
8092
  .mobile-hamburger-horizontal-stack-left-menu-centered-logo
8087
- .nav-container__inner[data-v-32fe142c] {
8093
+ .nav-container__inner[data-v-27d98913] {
8088
8094
  float: left;
8089
8095
  max-width: 100%;
8090
8096
  }
8091
8097
 
8092
8098
  /* MOBILE_HAMBURGER_4 */
8093
- .mobile-hamburger-horizontal-stack-left-menu-left-logo[data-v-32fe142c] {
8099
+ .mobile-hamburger-horizontal-stack-left-menu-left-logo[data-v-27d98913] {
8094
8100
  display: grid;
8095
8101
  grid-template-columns: var(--hamburger-nav-width) auto;
8096
8102
  grid-template-areas: 'a b';
@@ -8098,7 +8104,7 @@ select[data-v-665b8067] {
8098
8104
  -ms-flex-align: start;
8099
8105
  align-items: start;
8100
8106
  }
8101
- .mobile-hamburger-horizontal-stack-left-menu-left-logo .logo-container[data-v-32fe142c] {
8107
+ .mobile-hamburger-horizontal-stack-left-menu-left-logo .logo-container[data-v-27d98913] {
8102
8108
  margin-left: 1rem;
8103
8109
  display: -webkit-box;
8104
8110
  display: -ms-flexbox;
@@ -8108,17 +8114,17 @@ select[data-v-665b8067] {
8108
8114
  justify-content: flex-start;
8109
8115
  grid-area: b;
8110
8116
  }
8111
- .mobile-hamburger-horizontal-stack-left-menu-left-logo .nav-container[data-v-32fe142c] {
8117
+ .mobile-hamburger-horizontal-stack-left-menu-left-logo .nav-container[data-v-27d98913] {
8112
8118
  grid-area: a;
8113
8119
  margin: var(--page-padding) 0;
8114
8120
  }
8115
- .mobile-hamburger-horizontal-stack-left-menu-left-logo .nav-container__inner[data-v-32fe142c] {
8121
+ .mobile-hamburger-horizontal-stack-left-menu-left-logo .nav-container__inner[data-v-27d98913] {
8116
8122
  float: left;
8117
8123
  max-width: 100%;
8118
8124
  }
8119
8125
 
8120
8126
  /* MOBILE_HAMBURGER_NO_LOGO_1 */
8121
- .mobile-hamburger-no-logo-left-menu[data-v-32fe142c] {
8127
+ .mobile-hamburger-no-logo-left-menu[data-v-27d98913] {
8122
8128
  display: -webkit-box;
8123
8129
  display: -ms-flexbox;
8124
8130
  display: flex;
@@ -8126,12 +8132,12 @@ select[data-v-665b8067] {
8126
8132
  -ms-flex-pack: start;
8127
8133
  justify-content: flex-start;
8128
8134
  }
8129
- .mobile-hamburger-no-logo-left-menu .logo-container[data-v-32fe142c] {
8135
+ .mobile-hamburger-no-logo-left-menu .logo-container[data-v-27d98913] {
8130
8136
  display: none;
8131
8137
  }
8132
8138
 
8133
8139
  /* MOBILE_HAMBURGER_NO_LOGO_2 */
8134
- .mobile-hamburger-no-logo-centered-menu[data-v-32fe142c] {
8140
+ .mobile-hamburger-no-logo-centered-menu[data-v-27d98913] {
8135
8141
  display: -webkit-box;
8136
8142
  display: -ms-flexbox;
8137
8143
  display: flex;
@@ -8139,11 +8145,11 @@ select[data-v-665b8067] {
8139
8145
  -ms-flex-pack: center;
8140
8146
  justify-content: center;
8141
8147
  }
8142
- .mobile-hamburger-no-logo-centered-menu .logo-container[data-v-32fe142c] {
8148
+ .mobile-hamburger-no-logo-centered-menu .logo-container[data-v-27d98913] {
8143
8149
  display: none;
8144
8150
  }
8145
8151
  /* MOBILE_HAMBURGER_NO_LOGO_3 */
8146
- .mobile-hamburger-no-logo-right-menu[data-v-32fe142c] {
8152
+ .mobile-hamburger-no-logo-right-menu[data-v-27d98913] {
8147
8153
  display: -webkit-box;
8148
8154
  display: -ms-flexbox;
8149
8155
  display: flex;
@@ -8151,10 +8157,171 @@ select[data-v-665b8067] {
8151
8157
  -ms-flex-pack: end;
8152
8158
  justify-content: flex-end;
8153
8159
  }
8154
- .mobile-hamburger-no-logo-right-menu .logo-container[data-v-32fe142c] {
8160
+ .mobile-hamburger-no-logo-right-menu .logo-container[data-v-27d98913] {
8155
8161
  display: none;
8156
8162
  }
8157
8163
 
8164
+ /* ==========================================================================
8165
+ Header CTA placement (BP-5852)
8166
+
8167
+ Every rule here is additive and only applies once a CTA is rendered — the
8168
+ track/flow-changing ones are gated on `.has-header-cta` — so a header with no
8169
+ button lays out exactly as it did before. Four placements:
8170
+ join - inline immediately after the nav links
8171
+ edge - pinned to the header's outer right edge, nav left untouched
8172
+ corner - floats top-right, out of flow, independent of a centered stack
8173
+ row - full-width row below the whole stack (mobile bar nav)
8174
+ ========================================================================== */
8175
+
8176
+ /* join - DESKTOP_TAB_1: appended flex child; the nav's `flex: 1` right-aligns the
8177
+ [links][button] group, so the button lands adjacent to the links. */
8178
+ .desktop-tab-horizontal-stack-left-logo-right-menu .cta-container[data-v-27d98913] {
8179
+ margin-left: 1rem;
8180
+ }
8181
+
8182
+ /* edge - DESKTOP_TAB_2: the nav's `flex: 1` keeps the left-aligned links in place
8183
+ and pushes the button to the outer right edge. */
8184
+ .desktop-tab-horizontal-stack-left-logo-left-menu .cta-container[data-v-27d98913] {
8185
+ margin-left: 1rem;
8186
+ }
8187
+
8188
+ /* edge - DESKTOP_TAB_3: reuses the grid's existing trailing spacer column, so the
8189
+ centered nav and left logo keep their tracks unchanged. */
8190
+ .desktop-tab-horizontal-stack-left-logo-centered-menu .cta-container[data-v-27d98913] {
8191
+ grid-column: nav-end / cols-end;
8192
+ justify-self: end;
8193
+ }
8194
+
8195
+ /* join - DESKTOP_TAB_4: adds a content-width column after the nav column. The two
8196
+ `1fr` tracks absorb the free space (an `auto` logo track would stretch and pull
8197
+ the button away from the links). */
8198
+ .desktop-tab-horizontal-stack-centered-logo-right-menu.has-header-cta[data-v-27d98913] {
8199
+ grid-template-columns:
8200
+ [col-start] 1fr [logo-start] var(--logo-max-width)
8201
+ [logo-end nav-start] 1fr [nav-end cta-start] auto [cta-end];
8202
+ }
8203
+ .desktop-tab-horizontal-stack-centered-logo-right-menu .cta-container[data-v-27d98913] {
8204
+ grid-column: cta-start / cta-end;
8205
+ }
8206
+
8207
+ /* corner - DESKTOP_TAB_5 / DESKTOP_TAB_6: out of flow, so the centered vertical
8208
+ stack keeps its two explicit grid rows and stays centered. */
8209
+ .desktop-tab-vertical-stack-centered-logo-centered-menu.has-header-cta[data-v-27d98913],
8210
+ .desktop-tab-vertical-stack-centered-menu-centered-logo.has-header-cta[data-v-27d98913] {
8211
+ position: relative;
8212
+ }
8213
+ .desktop-tab-vertical-stack-centered-logo-centered-menu .cta-container[data-v-27d98913],
8214
+ .desktop-tab-vertical-stack-centered-menu-centered-logo .cta-container[data-v-27d98913] {
8215
+ position: absolute;
8216
+ top: 0;
8217
+ right: 0;
8218
+ }
8219
+
8220
+ /* row - MOBILE_TAB_1 / MOBILE_TAB_2: auto-places into an implicit third grid row
8221
+ below the stack (both explicit rows are taken by the logo and the nav). */
8222
+ .mobile-tab-vertical-stack-centered-logo-centered-menu .cta-container[data-v-27d98913],
8223
+ .mobile-tab-vertical-stack-centered-menu-centered-logo .cta-container[data-v-27d98913] {
8224
+ width: 100%;
8225
+ justify-self: stretch;
8226
+ }
8227
+ .mobile-tab-vertical-stack-centered-logo-centered-menu.no-nav.has-header-cta[data-v-27d98913],
8228
+ .mobile-tab-vertical-stack-centered-menu-centered-logo.no-nav.has-header-cta[data-v-27d98913] {
8229
+ -ms-flex-wrap: wrap;
8230
+ flex-wrap: wrap;
8231
+ -webkit-box-pack: center;
8232
+ -ms-flex-pack: center;
8233
+ justify-content: center;
8234
+ }
8235
+
8236
+ /* row - MOBILE_TAB_NO_LOGO_1: single centered flex row, so the full-width button
8237
+ needs a wrap to drop below the nav. */
8238
+ .mobile-tab-centered-menu-no-logo.has-header-cta[data-v-27d98913] {
8239
+ -ms-flex-wrap: wrap;
8240
+ flex-wrap: wrap;
8241
+ }
8242
+ .mobile-tab-centered-menu-no-logo .cta-container[data-v-27d98913] {
8243
+ width: 100%;
8244
+ }
8245
+
8246
+ /* join - DESKTOP_TAB_NO_LOGO_1 / _3: appended flex child sits adjacent to the
8247
+ left- / right-aligned links. */
8248
+ .desktop-tab-left-menu-no-logo .cta-container[data-v-27d98913],
8249
+ .desktop-tab-right-menu-no-logo .cta-container[data-v-27d98913] {
8250
+ margin-left: 1rem;
8251
+ }
8252
+
8253
+ /* edge - DESKTOP_TAB_NO_LOGO_2: out of flow so the nav stays exactly centered
8254
+ (an in-flow button would shift the centered group left). */
8255
+ .desktop-tab-centered-menu-no-logo.has-header-cta[data-v-27d98913] {
8256
+ position: relative;
8257
+ }
8258
+ .desktop-tab-centered-menu-no-logo .cta-container[data-v-27d98913] {
8259
+ position: absolute;
8260
+ top: 0;
8261
+ right: 0;
8262
+ }
8263
+
8264
+ /* DESKTOP_HAMBURGER_1 / _2: the button joins the header row BEFORE the icon. These
8265
+ grids declare exact tracks, so each gains a content-width CTA column ahead of the
8266
+ nav column; the logo track becomes `1fr` to absorb the free space that an `auto`
8267
+ track would otherwise share with the CTA. The mobile hamburger styles share the
8268
+ base rules above but never render a CTA, so their tracks are untouched. */
8269
+ .desktop-hamburger-horizontal-stack-left-logo-right-menu.has-header-cta[data-v-27d98913] {
8270
+ grid-template-columns: [logo-start] 1fr [cta-start] auto [nav-start] var(
8271
+ --hamburger-nav-width
8272
+ );
8273
+ }
8274
+ .desktop-hamburger-horizontal-stack-centered-logo-right-menu.has-header-cta[data-v-27d98913] {
8275
+ grid-template-columns:
8276
+ [start] var(--hamburger-nav-width)
8277
+ [logo-start] 1fr [cta-start] auto [nav-start] var(--hamburger-nav-width);
8278
+ }
8279
+ .desktop-hamburger-horizontal-stack-left-logo-right-menu .cta-container[data-v-27d98913],
8280
+ .desktop-hamburger-horizontal-stack-centered-logo-right-menu .cta-container[data-v-27d98913] {
8281
+ grid-column: cta-start;
8282
+ align-self: center;
8283
+ margin-right: 1rem;
8284
+ }
8285
+
8286
+ /* DESKTOP_HAMBURGER_NO_LOGO_1..3: flex rows; `order` puts the button before the
8287
+ icon without reordering the DOM. */
8288
+ .desktop-hamburger-no-logo-left-menu .cta-container[data-v-27d98913],
8289
+ .desktop-hamburger-no-logo-centered-menu .cta-container[data-v-27d98913],
8290
+ .desktop-hamburger-no-logo-right-menu .cta-container[data-v-27d98913] {
8291
+ -webkit-box-ordinal-group: 0;
8292
+ -ms-flex-order: -1;
8293
+ order: -1;
8294
+ -ms-flex-item-align: center;
8295
+ align-self: center;
8296
+ margin-right: 1rem;
8297
+ }
8298
+
8299
+ /* row - MOBILE_HAMBURGER_* with the nav hidden (single-page site): no icon, no
8300
+ drawer, so the button gets the mobile-bar full-width row below the logo. The
8301
+ grid styles auto-place it into an implicit row spanning all tracks; the
8302
+ flex no-logo styles wrap it onto its own line. */
8303
+ .mobile-hamburger-horizontal-stack-left-logo-right-menu.no-nav .cta-container[data-v-27d98913],
8304
+ .mobile-hamburger-horizontal-stack-centered-logo-right-menu.no-nav
8305
+ .cta-container[data-v-27d98913],
8306
+ .mobile-hamburger-horizontal-stack-left-menu-centered-logo.no-nav
8307
+ .cta-container[data-v-27d98913],
8308
+ .mobile-hamburger-horizontal-stack-left-menu-left-logo.no-nav .cta-container[data-v-27d98913] {
8309
+ grid-column: 1 / -1;
8310
+ width: 100%;
8311
+ margin-top: 1rem;
8312
+ }
8313
+ .mobile-hamburger-no-logo-left-menu.no-nav.has-header-cta[data-v-27d98913],
8314
+ .mobile-hamburger-no-logo-centered-menu.no-nav.has-header-cta[data-v-27d98913],
8315
+ .mobile-hamburger-no-logo-right-menu.no-nav.has-header-cta[data-v-27d98913] {
8316
+ -ms-flex-wrap: wrap;
8317
+ flex-wrap: wrap;
8318
+ }
8319
+ .mobile-hamburger-no-logo-left-menu.no-nav .cta-container[data-v-27d98913],
8320
+ .mobile-hamburger-no-logo-centered-menu.no-nav .cta-container[data-v-27d98913],
8321
+ .mobile-hamburger-no-logo-right-menu.no-nav .cta-container[data-v-27d98913] {
8322
+ width: 100%;
8323
+ }
8324
+
8158
8325
  /* global styles */
8159
8326
  /* TODO - remove centering from the logo container, so this can be deprecated */
8160
8327
  .desktop-tab-horizontal-stack-left-logo-centered-menu
@@ -8163,7 +8330,7 @@ select[data-v-665b8067] {
8163
8330
  margin: 0;
8164
8331
  }
8165
8332
 
8166
- .c-page-header-container[data-v-c289294b] {
8333
+ .c-page-header-container[data-v-b8e729d7] {
8167
8334
  max-width: var(--brandsite-max-width);
8168
8335
  margin: 0 auto;
8169
8336
  padding: 0.25rem var(--page-padding);
@@ -8219,7 +8386,7 @@ select[data-v-665b8067] {
8219
8386
  }
8220
8387
  }
8221
8388
 
8222
- .c-overlay[data-v-a8c3857a] {
8389
+ .c-overlay[data-v-b618b914] {
8223
8390
  position: fixed;
8224
8391
  inset: 0px;
8225
8392
  z-index: 40;
@@ -8237,15 +8404,15 @@ select[data-v-665b8067] {
8237
8404
  -webkit-transition-timing-function: cubic-bezier(0, 0, 0.2, 1);
8238
8405
  transition-timing-function: cubic-bezier(0, 0, 0.2, 1);
8239
8406
  }
8240
- .c-overlay--open[data-v-a8c3857a] {
8407
+ .c-overlay--open[data-v-b618b914] {
8241
8408
  opacity: 0.7;
8242
8409
  }
8243
- .c-overlay--closed[data-v-a8c3857a] {
8410
+ .c-overlay--closed[data-v-b618b914] {
8244
8411
  pointer-events: none;
8245
8412
  display: none;
8246
8413
  opacity: 0;
8247
8414
  }
8248
- .c-sidebar[data-v-a8c3857a] {
8415
+ .c-sidebar[data-v-b618b914] {
8249
8416
  /* No hardcoded background: the panel background comes from the hamburger
8250
8417
  defaultButtonStyle (bound via :style), so a transparent/unset default bg
8251
8418
  renders transparent instead of being forced white */
@@ -8265,29 +8432,46 @@ select[data-v-665b8067] {
8265
8432
  max-width: 66%;
8266
8433
  }
8267
8434
  @media (min-width: 768px) {
8268
- .device--mobile .c-sidebar[data-v-a8c3857a] {
8435
+ .device--mobile .c-sidebar[data-v-b618b914] {
8269
8436
  width: 66.666667%;
8270
8437
  }
8271
8438
  }
8272
- .c-sidebar--closed[data-v-a8c3857a] {
8439
+ .c-sidebar--closed[data-v-b618b914] {
8273
8440
  -webkit-transform: translateX(-100%);
8274
8441
  transform: translateX(-100%);
8275
8442
  visibility: hidden;
8276
8443
  }
8277
- .c-sidebar--open[data-v-a8c3857a] {
8444
+ .c-sidebar--open[data-v-b618b914] {
8278
8445
  -webkit-transform: translateX(0%);
8279
8446
  transform: translateX(0%);
8280
8447
  }
8281
- .c-chevron-transform[data-v-a8c3857a] {
8448
+ .c-chevron-transform[data-v-b618b914] {
8282
8449
  -webkit-transition: -webkit-transform 0.3s ease;
8283
8450
  transition: -webkit-transform 0.3s ease;
8284
8451
  transition: transform 0.3s ease;
8285
8452
  transition: transform 0.3s ease, -webkit-transform 0.3s ease;
8286
8453
  }
8287
- .c-chevron-expanded[data-v-a8c3857a] {
8454
+ .c-chevron-expanded[data-v-b618b914] {
8288
8455
  -webkit-transform: rotate(180deg);
8289
8456
  transform: rotate(180deg);
8290
8457
  }
8458
+ .c-drawer-cta[data-v-b618b914] {
8459
+ position: relative;
8460
+ padding: 1rem;
8461
+ }
8462
+
8463
+ /* Hairline separator from the nav list, drawn in the drawer's own text colour so it
8464
+ works on any panel background. A pseudo-element carries the fade — opacity on the
8465
+ section itself would wash out the button. */
8466
+ .c-drawer-cta[data-v-b618b914]::before {
8467
+ content: '';
8468
+ position: absolute;
8469
+ top: 0;
8470
+ left: 0;
8471
+ right: 0;
8472
+ border-top: 1px solid currentColor;
8473
+ opacity: 0.2;
8474
+ }
8291
8475
 
8292
8476
  .nav-container[data-v-a74eb6f7] {
8293
8477
  max-width: 100%;
@@ -8469,14 +8653,14 @@ body {
8469
8653
  visibility: hidden !important;
8470
8654
  }
8471
8655
 
8472
- .brand-page-root[data-v-fbc9fc94] {
8656
+ .brand-page-root[data-v-1a7e8144] {
8473
8657
  height: 100%;
8474
8658
  }
8475
- .sortable[data-v-fbc9fc94] {
8659
+ .sortable[data-v-1a7e8144] {
8476
8660
  outline-color: #F7768C;
8477
8661
  outline-width: 0.2rem;
8478
8662
  }
8479
- .brand-page[data-v-fbc9fc94] {
8663
+ .brand-page[data-v-1a7e8144] {
8480
8664
  -webkit-box-sizing: border-box;
8481
8665
  box-sizing: border-box;
8482
8666
  display: -webkit-box;
@@ -8488,7 +8672,7 @@ body {
8488
8672
  -ms-flex-direction: column;
8489
8673
  flex-direction: column;
8490
8674
  }
8491
- .brand-page__background-shapes-layer[data-v-fbc9fc94] {
8675
+ .brand-page__background-shapes-layer[data-v-1a7e8144] {
8492
8676
  position: fixed;
8493
8677
  top: 0;
8494
8678
  left: 0;
@@ -8499,11 +8683,11 @@ body {
8499
8683
  transform: translate3d(0, 0, 0);
8500
8684
  contain: layout paint;
8501
8685
  }
8502
- .template-preview .brand-page__background-shapes-layer[data-v-fbc9fc94],
8503
- .device-wrapper .brand-page__background-shapes-layer[data-v-fbc9fc94] {
8686
+ .template-preview .brand-page__background-shapes-layer[data-v-1a7e8144],
8687
+ .device-wrapper .brand-page__background-shapes-layer[data-v-1a7e8144] {
8504
8688
  height: 100%;
8505
8689
  }
8506
- .brand-page__inner--default[data-v-fbc9fc94] {
8690
+ .brand-page__inner--default[data-v-1a7e8144] {
8507
8691
  position: relative;
8508
8692
  z-index: 10;
8509
8693
  display: -webkit-box;
@@ -8515,16 +8699,16 @@ body {
8515
8699
  -ms-flex-direction: column;
8516
8700
  flex-direction: column;
8517
8701
  }
8518
- .brand-page__inner--desktop[data-v-fbc9fc94] {
8702
+ .brand-page__inner--desktop[data-v-1a7e8144] {
8519
8703
  min-height: 100vh;
8520
8704
  }
8521
- .brand-site__header[data-v-fbc9fc94] {
8705
+ .brand-site__header[data-v-1a7e8144] {
8522
8706
  container-type: inline-size;
8523
8707
  }
8524
- .brand-page__header[data-v-fbc9fc94] {
8708
+ .brand-page__header[data-v-1a7e8144] {
8525
8709
  padding-top: var(--page-padding);
8526
8710
  }
8527
- .brand-page__content--default[data-v-fbc9fc94] {
8711
+ .brand-page__content--default[data-v-1a7e8144] {
8528
8712
  margin-left: auto;
8529
8713
  margin-right: auto;
8530
8714
  margin-bottom: 2.5rem;
@@ -8541,7 +8725,7 @@ body {
8541
8725
  flex-direction: column;
8542
8726
  max-width: var(--page-max-width);
8543
8727
  }
8544
- .brand-page__content--desktop[data-v-fbc9fc94] {
8728
+ .brand-page__content--desktop[data-v-1a7e8144] {
8545
8729
  margin-left: auto;
8546
8730
  margin-right: auto;
8547
8731
  display: -webkit-box;
@@ -8557,15 +8741,15 @@ body {
8557
8741
  flex-direction: column;
8558
8742
  max-width: 100%;
8559
8743
  }
8560
- .brand-page__content--inner[data-v-fbc9fc94] {
8744
+ .brand-page__content--inner[data-v-1a7e8144] {
8561
8745
  padding-left: var(--page-padding);
8562
8746
  padding-right: var(--page-padding);
8563
8747
  }
8564
- .brand-page__content--inner--brandsite[data-v-fbc9fc94] {
8748
+ .brand-page__content--inner--brandsite[data-v-1a7e8144] {
8565
8749
  max-width: var(--brandsite-max-width);
8566
8750
  margin: 0 auto;
8567
8751
  }
8568
- .brand-page__content--outline-selected[data-v-fbc9fc94] {
8752
+ .brand-page__content--outline-selected[data-v-1a7e8144] {
8569
8753
  position: relative;
8570
8754
  z-index: 10;
8571
8755
  outline-color: #F7768C;
@@ -8573,20 +8757,20 @@ body {
8573
8757
  outline-style: dashed;
8574
8758
  outline-offset: -0.25rem;
8575
8759
  }
8576
- .brand-page__content--outline-footer-selected[data-v-fbc9fc94] {
8760
+ .brand-page__content--outline-footer-selected[data-v-1a7e8144] {
8577
8761
  outline-color: #f7768c;
8578
8762
  outline-width: 0.2rem;
8579
8763
  outline-style: dashed;
8580
8764
  outline-offset: -0.25rem;
8581
8765
  }
8582
8766
  @media (max-width: 640px) {
8583
- .brand-page__content--inner--full-width[data-v-fbc9fc94] {
8767
+ .brand-page__content--inner--full-width[data-v-1a7e8144] {
8584
8768
  padding-left: 0;
8585
8769
  padding-right: 0;
8586
8770
  }
8587
8771
  }
8588
8772
  @media (min-width: 640px) {
8589
- .brand-page__content--inner--full-width[data-v-fbc9fc94] {
8773
+ .brand-page__content--inner--full-width[data-v-1a7e8144] {
8590
8774
  padding-left: var(--page-padding);
8591
8775
  padding-right: var(--page-padding);
8592
8776
  }
@@ -10179,6 +10363,15 @@ input.dynamic-width-input[data-v-97be2e87]:focus {
10179
10363
  color: rgb(36 36 36 / var(--tw-text-opacity))
10180
10364
  }
10181
10365
 
10366
+ .header-button-settings_option-title[data-v-9a1ee526] {
10367
+ font-family: Lato, Helvetica, sans-serif;
10368
+ font-size: 0.875rem;
10369
+ line-height: 1.25rem;
10370
+ font-weight: 700;
10371
+ --tw-text-opacity: 1;
10372
+ color: rgb(36 36 36 / var(--tw-text-opacity))
10373
+ }
10374
+
10182
10375
  .navigation-type-options[data-v-0fece584] button {
10183
10376
  padding-top: 8px !important;
10184
10377
  }
@@ -10218,7 +10411,7 @@ input.dynamic-width-input[data-v-97be2e87]:focus {
10218
10411
  margin: 0 auto;
10219
10412
  }
10220
10413
 
10221
- .header-settings-panel_option-title[data-v-473cfcf3] {
10414
+ .header-settings-panel_option-title[data-v-8244a08c] {
10222
10415
  font-family: Lato, Helvetica, sans-serif;
10223
10416
  font-size: 0.875rem;
10224
10417
  line-height: 1.25rem;