npm - @affinda/wc - Versions diffs - 0.0.17 → 0.0.19 - Mend

@affinda/wc 0.0.17 → 0.0.19

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 (705) hide show

package/dist/cjs/af-heading.af-logo.af-nav-item.af-navbar.af-text.entry.cjs.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"af-heading.af-logo.af-nav-item.af-navbar.af-text.entry.cjs.js","sources":["src/components/af-heading/af-heading.css?tag=af-heading&encapsulation=shadow","src/components/af-heading/af-heading.tsx","src/components/af-text/af-text.css?tag=af-text&encapsulation=shadow","src/components/af-text/af-text.tsx","src/components/af-nav-item/af-nav-item.css?tag=af-nav-item&encapsulation=shadow","src/components/af-nav-item/af-nav-item.tsx","src/components/af-navbar/af-navbar.css?tag=af-navbar&encapsulation=shadow","src/components/af-navbar/af-navbar.tsx","src/components/af-logo/af-logo.css?tag=af-logo&encapsulation=shadow","src/components/af-logo/af-logo.tsx"],"sourcesContent":[":host {\n display: block;\n}\n\n.heading {\n margin: 0;\n padding: 0;\n font-family: var(--typography-headingfont, 'NeuSans', Arial, sans-serif);\n font-weight: var(--font-weight-regular, 400);\n /* Inherit color from theme context via CSS custom property /\n color: var(--af-typography-heading-primary, var(--colour-brand-inkwell, #14343b));\n letter-spacing: var(--letter-spacing-heading, -0.02em);\n}\n\n/ Alignment /\n.align-left {\n text-align: left;\n}\n\n.align-center {\n text-align: center;\n}\n\n.align-right {\n text-align: right;\n}\n\n/ Heading XL /\n.level-xl {\n font-size: var(--font-size-heading-xl-mobile, 50px);\n line-height: var(--line-height-heading-tight, 1);\n}\n\n@media (min-width: 768px) {\n .level-xl {\n font-size: var(--font-size-heading-xl-desktop, 80px);\n }\n}\n\n/ Heading 1 /\n.level-1 {\n font-size: var(--font-size-heading-1-mobile, 38px);\n line-height: var(--line-height-heading-tight, 1);\n}\n\n@media (min-width: 768px) {\n .level-1 {\n font-size: var(--font-size-heading-1-desktop, 56px);\n }\n}\n\n/ Heading 2 /\n.level-2 {\n font-size: var(--font-size-heading-2-mobile, 32px);\n line-height: var(--line-height-heading-tight, 1);\n}\n\n@media (min-width: 768px) {\n .level-2 {\n font-size: var(--font-size-heading-2-desktop, 44px);\n }\n}\n\n/ Heading 3 /\n.level-3 {\n font-size: var(--font-size-heading-3-mobile, 25px);\n line-height: var(--line-height-heading-tight, 1);\n}\n\n@media (min-width: 768px) {\n .level-3 {\n font-size: var(--font-size-heading-3-desktop, 34px);\n }\n}\n\n/ Heading 4 /\n.level-4 {\n font-size: var(--font-size-heading-4-mobile, 20px);\n line-height: var(--line-height-heading-normal, 1.1);\n}\n\n@media (min-width: 768px) {\n .level-4 {\n font-size: var(--font-size-heading-4-desktop, 24px);\n line-height: var(--line-height-heading-relaxed, 1.2);\n }\n}\n\n/ Heading 5 /\n.level-5 {\n font-size: var(--font-size-heading-5-mobile, 18px);\n line-height: var(--line-height-heading-normal, 1.1);\n}\n\n@media (min-width: 768px) {\n .level-5 {\n font-size: var(--font-size-heading-5-desktop, 20px);\n line-height: var(--line-height-heading-relaxed, 1.2);\n }\n}\n","import { Component, h, Prop } from '@stencil/core';\n\n/\n Heading component that inherits color from theme context.\n * Color is determined by the parent theme (af-section, af-hero-section, etc.)\n * via CSS custom properties.\n /\n@Component({\n tag: 'af-heading',\n styleUrl: 'af-heading.css',\n shadow: true\n})\nexport class AfHeading {\n /* Heading level /\n @Prop() level: 'xl' \| '1' \| '2' \| '3' \| '4' \| '5' = '1';\n\n /* Visual alignment /\n @Prop() align: 'left' \| 'center' \| 'right' = 'left';\n\n private getHeadingTag() {\n // Map display levels to semantic HTML tags\n const tagMap: Record<string, string> = {\n 'xl': 'h1',\n '1': 'h1',\n '2': 'h2',\n '3': 'h3',\n '4': 'h4',\n '5': 'h5'\n };\n return tagMap[this.level] \|\| 'h1';\n }\n\n render() {\n const Tag = this.getHeadingTag() as any;\n\n return (\n <Tag\n class={{\n 'heading': true,\n [`level-${this.level}`]: true,\n [`align-${this.align}`]: true\n }}\n part=\"base\"\n >\n <slot />\n </Tag>\n );\n }\n}\n",":host {\n display: block;\n}\n\n.text {\n margin: 0;\n padding: 0;\n font-family: var(--typography-bodyfont, 'NeuSans', Arial, sans-serif);\n font-weight: var(--font-weight-regular, 400);\n / Inherit color from theme context via CSS custom property /\n color: var(--af-typography-body-default, var(--colour-inkwell-400, #2b484f));\n letter-spacing: var(--letter-spacing-body, 0);\n}\n\n/ Alignment /\n.align-left {\n text-align: left;\n}\n\n.align-center {\n text-align: center;\n}\n\n.align-right {\n text-align: right;\n}\n\n/ Body variants /\n.variant-xlarge {\n font-size: var(--font-size-body-xlarge, 22px);\n line-height: var(--line-height-body-xlarge, 28px);\n}\n\n.variant-large {\n font-size: var(--font-size-body-large, 18px);\n line-height: var(--line-height-body-large, 26px);\n}\n\n.variant-medium {\n font-size: var(--font-size-body-medium, 16px);\n line-height: var(--line-height-body-medium, 24px);\n}\n\n.variant-small {\n font-size: var(--font-size-body-small, 14px);\n line-height: var(--line-height-body-small, 20px);\n}\n","import { Component, h, Prop } from '@stencil/core';\n\n/\n Text/body component that inherits color from theme context.\n * Color is determined by the parent theme (af-section, af-hero-section, etc.)\n * via CSS custom properties.\n /\n@Component({\n tag: 'af-text',\n styleUrl: 'af-text.css',\n shadow: true\n})\nexport class AfText {\n /* Text variant /\n @Prop() variant: 'xlarge' \| 'large' \| 'medium' \| 'small' = 'medium';\n\n /* Visual alignment /\n @Prop() align: 'left' \| 'center' \| 'right' = 'left';\n\n /* Semantic element to render /\n @Prop() as: 'p' \| 'span' \| 'div' \| 'label' = 'p';\n\n render() {\n const Tag = this.as as any;\n\n return (\n <Tag\n class={{\n 'text': true,\n [`variant-${this.variant}`]: true,\n [`align-${this.align}`]: true\n }}\n part=\"base\"\n >\n <slot />\n </Tag>\n );\n }\n}\n",":host {\n display: inline-block;\n}\n\n.nav-link {\n text-decoration: none;\n color: inherit;\n display: block;\n}\n\n.nav-item {\n display: flex;\n align-items: center;\n gap: 8px;\n box-sizing: border-box;\n cursor: pointer;\n}\n\n/ Primary hierarchy - bold main navigation /\n.hierarchy-primary {\n padding: 12px;\n justify-content: center;\n}\n\n.hierarchy-primary .label-container {\n display: flex;\n align-items: center;\n justify-content: center;\n height: 24px;\n gap: 10px;\n}\n\n/ Primary variant 01 - darker /\n.hierarchy-primary.variant-01 {\n font-family: var(--typography-headingfont, 'NeuSans', 'Inter', system-ui, sans-serif);\n font-size: 16px;\n font-weight: var(--font-weight-book, 500);\n line-height: 20px;\n color: var(--colour-typography-nav-item-primary, #14343b);\n}\n\n/ Add transparent border to prevent layout shift on hover /\n.hierarchy-primary.variant-01 .label-container {\n border-bottom: 1px solid transparent;\n}\n\n/ Primary variant 02 - lighter for light backgrounds /\n.hierarchy-primary.variant-02 {\n font-family: var(--typography-bodyfont, 'Helvetica', 'Inter', system-ui, sans-serif);\n font-size: 16px;\n font-weight: var(--font-weight-regular, 400);\n line-height: 20px;\n color: var(--colour-typography-nav-item-secondary, #2b484f);\n}\n\n/ Hover state for primary variant-01 - show underline /\n.hierarchy-primary.variant-01:hover .label-container {\n border-bottom-color: currentColor;\n}\n\n/ Active state for primary variant-01 - thicker border /\n.hierarchy-primary.variant-01.active .label-container {\n border-bottom: 2px solid var(--colour-background-border-active, #8a7049);\n / Adjust margin to prevent shift from 1px to 2px border /\n margin-bottom: -1px;\n}\n\n/ Hover and active states for variant-02 (light backgrounds) - no border /\n.hierarchy-primary.variant-02:hover {\n background-color: rgba(20, 52, 59, 0.04);\n border-radius: 8px;\n}\n\n.hierarchy-primary.variant-02.active {\n background-color: rgba(20, 52, 59, 0.08);\n border-radius: 8px;\n}\n\n/ Secondary hierarchy - smaller sub-navigation /\n.hierarchy-secondary {\n padding: 4px 0;\n}\n\n.hierarchy-secondary .label-container {\n display: flex;\n align-items: center;\n flex: 1;\n min-height: 24px;\n gap: 10px;\n}\n\n/ Secondary variant 01 - medium weight /\n.hierarchy-secondary.variant-01 {\n font-family: var(--typography-headingfont, 'NeuSans', 'Inter', system-ui, sans-serif);\n font-size: 14px;\n font-weight: 500;\n line-height: 20px;\n color: var(--colour-typography-body-dark, #14343b);\n}\n\n/ Secondary variant 02 - regular weight /\n.hierarchy-secondary.variant-02 {\n font-family: var(--typography-bodyfont, 'NeuSans', 'Inter', system-ui, sans-serif);\n font-size: 14px;\n font-weight: 400;\n line-height: 20px;\n color: var(--colour-typography-body-default, #2b484f);\n}\n\n/ Hover state for secondary - underline text /\n.hierarchy-secondary:hover .label-container {\n text-decoration: underline;\n}\n\n/ Focus states for accessibility /\n.nav-item:focus-within {\n outline: 2px solid var(--colour-background-border-active, #8a7049);\n outline-offset: 2px;\n border-radius: 4px;\n}\n\n/ Remove default focus outline on link /\n.nav-link:focus {\n outline: none;\n}\n\n.nav-link:focus-visible + .nav-item,\n:host(:focus-visible) .nav-item {\n outline: 2px solid var(--colour-background-border-active, #8a7049);\n outline-offset: 2px;\n border-radius: 4px;\n}\n\n/ Mobile breakpoint styles - explicit via prop /\n.hierarchy-primary.breakpoint-mobile {\n padding: 20px 12px;\n border-bottom: 1px solid var(--colour-background-border-subtle, #e8eeed);\n width: 100%;\n justify-content: flex-start;\n}\n\n.hierarchy-primary.breakpoint-mobile .label-container {\n flex: 1;\n justify-content: flex-start;\n}\n\n.hierarchy-primary.variant-01.breakpoint-mobile {\n font-size: 20px;\n line-height: 1.1;\n letter-spacing: -0.4px;\n}\n\n.hierarchy-primary.variant-02.breakpoint-mobile {\n font-size: 20px;\n line-height: 1.1;\n letter-spacing: -0.4px;\n color: var(--colour-typography-body-subtle, #60767b);\n}\n\n/ Mobile breakpoint for secondary hierarchy /\n.hierarchy-secondary.breakpoint-mobile {\n padding: 2px 0;\n height: 40px;\n}\n\n.hierarchy-secondary.breakpoint-mobile .label-container {\n min-height: 24px;\n}\n\n/ Mobile removes the hover underline effect /\n.hierarchy-primary.breakpoint-mobile.variant-01 .label-container {\n border-bottom-color: transparent;\n}\n\n.hierarchy-primary.breakpoint-mobile.variant-01:hover .label-container {\n border-bottom-color: transparent;\n}\n\n.hierarchy-primary.breakpoint-mobile.variant-01.active .label-container {\n border-bottom-color: transparent;\n margin-bottom: 0;\n}\n\n/ Icon sizing and styling /\n::slotted([slot=\"icon-left\"]),\n::slotted([slot=\"icon-right\"]) {\n width: 24px;\n height: 24px;\n flex-shrink: 0;\n display: flex;\n align-items: center;\n justify-content: center;\n transition: transform 0.2s ease;\n}\n\n/ Icon color inheritance for primary hierarchy /\n.hierarchy-primary.variant-01 ::slotted([slot=\"icon-left\"]),\n.hierarchy-primary.variant-01 ::slotted([slot=\"icon-right\"]) {\n color: var(--colour-typography-nav-item-primary, #14343b);\n}\n\n.hierarchy-primary.variant-02 ::slotted([slot=\"icon-left\"]),\n.hierarchy-primary.variant-02 ::slotted([slot=\"icon-right\"]) {\n color: var(--colour-typography-nav-item-secondary, #2b484f);\n}\n\n/ Icon rotation on hover for desktop primary with dropdown indicator /\n.hierarchy-primary.variant-01.breakpoint-desktop:hover ::slotted([slot=\"icon-right\"]),\n.hierarchy-primary.variant-01.breakpoint-desktop.active ::slotted([slot=\"icon-right\"]) {\n transform: rotate(180deg);\n}\n\n/ Icon rotation on active for mobile primary with dropdown indicator /\n.hierarchy-primary.breakpoint-mobile.active ::slotted([slot=\"icon-right\"]) {\n transform: rotate(180deg);\n}\n\n/ Secondary hierarchy - smaller icons /\n.hierarchy-secondary ::slotted([slot=\"icon-right\"]) {\n width: 20px;\n height: 20px;\n}\n\n/ Icon color inheritance for secondary hierarchy /\n.hierarchy-secondary.variant-01 ::slotted([slot=\"icon-right\"]) {\n color: var(--colour-typography-body-dark, #14343b);\n}\n\n.hierarchy-secondary.variant-02 ::slotted([slot=\"icon-right\"]) {\n color: var(--colour-typography-body-default, #2b484f);\n}\n\n/ Fallback media query for when breakpoint prop is not set /\n@media (max-width: 991px) {\n :host([breakpoint=\"auto\"]) .hierarchy-primary,\n :host(:not([breakpoint])) .hierarchy-primary {\n padding: 20px 12px;\n border-bottom: 1px solid var(--colour-background-border-subtle, #e8eeed);\n width: 100%;\n }\n\n :host([breakpoint=\"auto\"]) .hierarchy-primary .label-container,\n :host(:not([breakpoint])) .hierarchy-primary .label-container {\n flex: 1;\n justify-content: flex-start;\n }\n\n :host([breakpoint=\"auto\"]) .hierarchy-primary.variant-01,\n :host(:not([breakpoint])) .hierarchy-primary.variant-01 {\n font-size: 20px;\n line-height: 1.1;\n letter-spacing: -0.4px;\n }\n\n :host([breakpoint=\"auto\"]) .hierarchy-primary.variant-02,\n :host(:not([breakpoint])) .hierarchy-primary.variant-02 {\n font-size: 20px;\n line-height: 1.1;\n letter-spacing: -0.4px;\n color: var(--colour-typography-body-subtle, #60767b);\n }\n\n / Icon rotation on active for auto/responsive breakpoint /\n :host([breakpoint=\"auto\"]) .hierarchy-primary.active ::slotted([slot=\"icon-right\"]),\n :host(:not([breakpoint])) .hierarchy-primary.active ::slotted([slot=\"icon-right\"]) {\n transform: rotate(180deg);\n }\n\n / Disable desktop hover rotation in mobile view /\n :host([breakpoint=\"auto\"]) .hierarchy-primary:hover ::slotted([slot=\"icon-right\"]),\n :host(:not([breakpoint])) .hierarchy-primary:hover ::slotted([slot=\"icon-right\"]) {\n transform: none;\n }\n\n :host([breakpoint=\"auto\"]) .hierarchy-primary.active:hover ::slotted([slot=\"icon-right\"]),\n :host(:not([breakpoint])) .hierarchy-primary.active:hover ::slotted([slot=\"icon-right\"]) {\n transform: rotate(180deg);\n }\n}\n","import { Component, h, Prop, Host } from '@stencil/core';\n\n/\n A generic navigation item component that can be used in navigation bars, menus, and sidebars.\n * Supports multiple hierarchy levels, variants, and states (active, hover).\n /\n@Component({\n tag: 'af-nav-item',\n styleUrl: 'af-nav-item.css',\n shadow: true\n})\nexport class AfNavItem {\n /\n Visual hierarchy level of the navigation item\n * - 'primary': Bold, main navigation (larger text, prominent styling)\n * - 'secondary': Lighter, sub-navigation (smaller text, subtle styling)\n /\n @Prop() hierarchy: 'primary' \| 'secondary' = 'primary';\n\n /\n Visual variant within the hierarchy level\n * - '01': Darker/more prominent styling\n * - '02': Lighter/more subtle styling\n /\n @Prop() variant: '01' \| '02' = '01';\n\n /\n Breakpoint variant for responsive styling\n * - 'desktop': Desktop-specific styles\n * - 'mobile': Mobile-specific styles (larger text, different spacing)\n /\n @Prop() breakpoint: 'desktop' \| 'mobile' = 'desktop';\n\n /\n URL to navigate to when clicked\n /\n @Prop() href?: string;\n\n /\n Whether this nav item is currently active/selected\n /\n @Prop() active: boolean = false;\n\n render() {\n const classes = {\n 'nav-item': true,\n [`hierarchy-${this.hierarchy}`]: true,\n [`variant-${this.variant}`]: true,\n [`breakpoint-${this.breakpoint}`]: true,\n 'active': this.active\n };\n\n const content = (\n <div class={classes}>\n <slot name=\"icon-left\"></slot>\n <div class=\"label-container\">\n <slot></slot>\n </div>\n <slot name=\"icon-right\"></slot>\n </div>\n );\n\n if (this.href) {\n return (\n <Host>\n <a href={this.href} class=\"nav-link\">\n {content}\n </a>\n </Host>\n );\n }\n\n return <Host>{content}</Host>;\n }\n}\n",":host {\n display: block;\n width: 100%;\n}\n\n/ Spacer element that sits in normal document flow to prevent content overlap /\n.navbar-spacer {\n height: 100px; / Accounts for navbar height + top margin /\n}\n\n/ Theme variants for spacer background - matches section themes /\n.navbar-spacer.theme-white {\n background-color: var(--colour-brand-white, #FFFFFF);\n}\n\n.navbar-spacer.theme-inkwell {\n background-color: var(--colour-brand-inkwell, #14343B);\n}\n\n.navbar-spacer.theme-mist-green {\n background-color: var(--colour-brand-mist-green, #C6D5D1);\n}\n\n.navbar-spacer.theme-soft-clay {\n background-color: var(--colour-softclay-400, #c0ab8d);\n}\n\n/ Sticky navbar that floats above the spacer /\n.navbar-container {\n position: fixed;\n top: 32px;\n left: 0;\n right: 0;\n z-index: 10;\n padding: 0 80px;\n box-sizing: border-box;\n}\n\n.navbar {\n background: var(--colour-background-white, #ffffff);\n border-radius: 9999px;\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: 8px 8px 8px 40px;\n box-sizing: border-box;\n flex-wrap: nowrap; / Prevent wrapping /\n}\n\n/ Left section /\n.navbar-left {\n display: flex;\n align-items: center;\n gap: 32px;\n flex-shrink: 0;\n}\n\n.logo {\n display: flex;\n align-items: center;\n flex-shrink: 0;\n}\n\n/ Mobile menu toggle button /\n.mobile-menu-toggle {\n display: none;\n background: none;\n border: none;\n padding: 8px;\n cursor: pointer;\n color: var(--colour-brand-inkwell, #14343b);\n margin-left: auto;\n}\n\n.mobile-menu-toggle svg {\n display: block;\n}\n\n.nav-links {\n display: flex;\n align-items: center;\n gap: 8px;\n flex-wrap: nowrap;\n}\n\n/ Right section /\n.navbar-right {\n display: flex;\n align-items: center;\n gap: 20px;\n}\n\n.nav-actions {\n display: flex;\n align-items: center;\n gap: 12px;\n}\n\n.nav-button {\n display: flex;\n align-items: center;\n}\n\n/ Dropdown container /\n.dropdown-container {\n position: absolute;\n top: 108px;\n left: 0;\n right: 0;\n padding: 0 80px;\n pointer-events: none;\n opacity: 0;\n transform: translateY(-8px);\n transition: opacity 0.2s ease, transform 0.2s ease;\n}\n\n.dropdown-container.is-open {\n pointer-events: auto;\n opacity: 1;\n transform: translateY(0);\n}\n\n.dropdown-panel {\n background: var(--colour-background-base, #ffffff);\n border-radius: 32px;\n overflow: hidden;\n box-shadow: 0 4px 24px rgba(20, 52, 59, 0.12);\n}\n\n/ Hide empty dropdown slots /\n.dropdown-panel:empty {\n display: none;\n}\n\n/ Mobile dropdowns container /\n.mobile-dropdowns {\n display: none;\n}\n\n/ \n * Breakpoint 1: Hide \"Talk to us\" and \"Log in\" (nav-actions) \n * This happens first as the viewport gets narrower\n * Matches affinda.com behavior at ~1100px\n /\n@media (max-width: 1099px) {\n .nav-actions {\n display: none;\n }\n \n .navbar-right {\n gap: 0;\n }\n}\n\n/ Tablet adjustments /\n@media (max-width: 1024px) {\n .navbar-spacer {\n height: 88px;\n }\n\n .navbar-container {\n top: 24px;\n padding: 0 40px;\n }\n\n .navbar-left {\n gap: 24px;\n }\n\n .nav-links {\n gap: 4px;\n }\n\n .dropdown-container {\n padding: 0 40px;\n }\n}\n\n/ \n * Breakpoint 2: Switch to hamburger menu\n * Matches affinda.com behavior at 991px\n /\n@media (max-width: 991px) {\n .navbar-spacer {\n height: 72px;\n }\n\n .navbar-container {\n top: 16px;\n padding: 0 16px;\n }\n\n .navbar {\n padding: 8px 16px;\n flex-direction: column;\n border-radius: 16px;\n gap: 0;\n flex-wrap: wrap; / Allow wrapping in mobile menu /\n }\n\n .navbar-left {\n width: 100%;\n flex-direction: row;\n justify-content: space-between;\n align-items: center;\n gap: 16px;\n }\n\n / Show hamburger button on mobile /\n .mobile-menu-toggle {\n display: flex;\n }\n\n / Hide nav links by default on mobile /\n .nav-links {\n display: none;\n width: 100%;\n flex-direction: column;\n align-items: stretch;\n gap: 0;\n margin-top: 16px;\n flex-wrap: wrap;\n }\n\n / Show nav links when menu is open /\n .nav-links.mobile-open {\n display: flex;\n }\n\n / Hide right section by default on mobile /\n .navbar-right {\n display: none;\n width: 100%;\n flex-direction: column;\n gap: 12px;\n align-items: stretch;\n margin-top: 16px;\n }\n\n / Show right section when menu is open /\n .navbar-right.mobile-open {\n display: flex;\n }\n\n / Show nav-actions again in mobile menu /\n .nav-actions {\n display: flex;\n width: 100%;\n flex-direction: column;\n align-items: stretch;\n gap: 0;\n }\n\n .nav-button {\n width: 100%;\n }\n\n / Hide desktop dropdown on mobile /\n .dropdown-container {\n display: none;\n }\n\n / Show mobile dropdowns /\n .mobile-dropdowns {\n display: block;\n padding: 0 16px;\n margin-top: 8px;\n }\n}\n","import { Component, State, h, Host, Prop, Element, Listen } from '@stencil/core';\n\n/\n A full-width navigation bar component that provides the main site navigation.\n * Features a pill-shaped container with logo, navigation links, and action buttons.\n * Includes mobile hamburger menu and support for mega-menu dropdowns.\n * \n * The logo slot can be used to provide a custom logo. If no logo is provided,\n * the default Affinda logo will be displayed.\n /\n@Component({\n tag: 'af-navbar',\n styleUrl: 'af-navbar.css',\n shadow: true\n})\nexport class AfNavbar {\n @Element() el!: HTMLElement;\n\n @State() mobileMenuOpen: boolean = false;\n \n /* The currently open dropdown identifier (null if none open) /\n @State() activeDropdown: string \| null = null;\n\n /* Whether to show the default Affinda logo when no logo slot content is provided /\n @Prop() showDefaultLogo: boolean = true;\n\n /* Theme for the spacer background - should match the section below the navbar /\n @Prop() theme?: 'white' \| 'inkwell' \| 'mist-green' \| 'soft-clay';\n\n private toggleMobileMenu = () => {\n this.mobileMenuOpen = !this.mobileMenuOpen;\n // Close any open dropdown when toggling mobile menu\n this.activeDropdown = null;\n };\n\n /\n Opens a dropdown by its identifier\n /\n private openDropdown = (dropdownId: string) => {\n this.activeDropdown = dropdownId;\n };\n\n /\n Closes the currently open dropdown\n /\n private closeDropdown = () => {\n this.activeDropdown = null;\n };\n\n /\n Toggles a dropdown by its identifier\n /\n private toggleDropdown = (dropdownId: string) => {\n if (this.activeDropdown === dropdownId) {\n this.activeDropdown = null;\n } else {\n this.activeDropdown = dropdownId;\n }\n };\n\n /\n Handle clicks outside the navbar to close dropdowns\n /\n @Listen('click', { target: 'document' })\n handleDocumentClick(event: MouseEvent) {\n const path = event.composedPath();\n if (!path.includes(this.el)) {\n this.closeDropdown();\n }\n }\n\n /\n Handle escape key to close dropdowns\n /\n @Listen('keydown', { target: 'document' })\n handleKeyDown(event: KeyboardEvent) {\n if (event.key === 'Escape') {\n this.closeDropdown();\n }\n }\n\n render() {\n const hasDropdown = this.activeDropdown !== null;\n\n return (\n <Host class={{ 'has-dropdown-open': hasDropdown }}>\n {/ Spacer element to prevent content from being hidden behind sticky navbar /}\n <div class={`navbar-spacer${this.theme ? ` theme-${this.theme}` : ''}`}></div>\n \n <nav class=\"navbar-container\">\n <div class=\"navbar\">\n {/ Left section: Logo + Nav Links /}\n <div class=\"navbar-left\">\n <div class=\"logo\">\n <slot name=\"logo\">\n {/ Default Affinda logo if no slot content provided /}\n {this.showDefaultLogo && <af-logo></af-logo>}\n </slot>\n </div>\n \n {/ Hamburger menu button - mobile only /}\n <button \n class=\"mobile-menu-toggle\"\n onClick={this.toggleMobileMenu}\n aria-label=\"Toggle navigation menu\"\n aria-expanded={this.mobileMenuOpen ? 'true' : 'false'}\n >\n {this.mobileMenuOpen ? (\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\">\n <path d=\"M18 6L6 18M6 6l12 12\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n </svg>\n ) : (\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\">\n <path d=\"M3 12h18M3 6h18M3 18h18\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n </svg>\n )}\n </button>\n \n <div class={`nav-links ${this.mobileMenuOpen ? 'mobile-open' : ''}`}>\n <slot name=\"start\"></slot>\n </div>\n </div>\n\n {/ Right section: Actions + Button /}\n <div class={`navbar-right ${this.mobileMenuOpen ? 'mobile-open' : ''}`}>\n <div class=\"nav-actions\">\n <slot name=\"end\"></slot>\n </div>\n <div class=\"nav-button\">\n <slot name=\"button\"></slot>\n </div>\n </div>\n </div>\n\n {/ Dropdown panel container /}\n <div class={`dropdown-container ${hasDropdown ? 'is-open' : ''}`}>\n <div class=\"dropdown-panel\">\n <slot name=\"dropdown-solutions\"></slot>\n <slot name=\"dropdown-pricing\"></slot>\n <slot name=\"dropdown-resources\"></slot>\n <slot name=\"dropdown\"></slot>\n </div>\n </div>\n </nav>\n\n {/ Mobile menu dropdown slots /}\n {this.mobileMenuOpen && (\n <div class=\"mobile-dropdowns\">\n <slot name=\"mobile-menu\"></slot>\n </div>\n )}\n </Host>\n );\n }\n}\n",":host {\n display: inline-block;\n color: var(--colour-brand-inkwell, #14343b);\n}\n\n.logo-svg {\n display: block;\n / Maintain aspect ratio based on viewBox (9290:1432 ≈ 6.49:1) /\n width: auto;\n height: 22px;\n}\n","import { Component, h, Host } from '@stencil/core';\n\n/\n Affinda logo component\n */\n@Component({\n tag: 'af-logo',\n styleUrl: 'af-logo.css',\n shadow: true\n})\nexport class AfLogo {\n render() {\n return (\n <Host>\n <svg \n class=\"logo-svg\" \n viewBox=\"0 0 9290 1432\" \n aria-label=\"Affinda\"\n role=\"img\"\n >\n <path \n fill=\"currentColor\" \n d=\"M1691.17,452.11c-107.93-107.48-250.13-166.09-401.3-163.79h-739.51l-148.18,237.98h892.96c86.83,0,168.39,33.64,230.09,95.09,63.28,63.04,98.26,147.32,98.26,237.45,0,185.03-149.41,335.36-332.92,335.36H385.66c-82.44,0-149.59-67.64-149.59-150.68s67.32-151.75,149.41-154.23h810.17l152.93-237.98H381.44C171.21,656.62,0,832.45,0,1043.52s172.97,388.48,385.66,388.48h904.91c313.76,0,569.17-257.28,569.17-573.34,0-154.22-59.76-298.53-168.4-406.72l-.17.18Z\"\n />\n <path \n fill=\"currentColor\" \n d=\"M3265.12,353.81c-21.8-16.16-44.47-30.56-68.02-42.85-75.76-39.69-161-59.89-253.45-59.89-159.6,0-297.92,58.13-411.29,172.82-113.02,114.33-170.49,253.96-170.49,415.01s56.77,304.89,168.73,419.58c112.49,115.21,250.29,173.52,409.35,173.52,89.47,0,173.31-18.97,249.06-56.38,26.19-12.99,51.68-28.1,76.11-45.49v89.05h268.39V276.36h-268.39v77.45ZM3232.07,1013.47c-27.24,48.65-65.38,86.24-116.35,114.87-51.85,29.15-105.11,43.38-162.58,43.38s-107.92-14.05-157.31-43.21c-49.57-28.98-87.88-68.85-117.59-121.53-29.88-53.04-44.29-106.79-44.29-164.39s14.41-111.88,43.94-164.21c29.18-51.99,67.32-91.15,116.36-119.6,49.21-28.63,101.41-42.5,159.94-42.5,90.87,0,165.04,30.56,226.73,93.61,62.23,63.4,92.46,140.68,92.46,236.22,0,63.05-13.54,117.67-41.13,167.02l-.18.35Z\"\n />\n <path fill=\"currentColor\" d=\"M5569.92,278.96h-269.66v1143.74h269.66V278.96Z\"/>\n <path \n fill=\"currentColor\" \n d=\"M6504.78,328.74c-68.7-45.4-148.11-68.37-235.78-68.37s-163.57,19.96-235.61,59.36c-21.61,11.84-42.69,25.44-63.07,40.81v-89.22h-270.22v1151.2h270.22v-436.03c0-154.94,8.78-223.14,15.81-252.11,15.64-61.13,47.44-110.95,96.81-152.65,47.96-40.28,100.49-59.89,160.58-59.89,51.13,0,89.96,11.13,118.95,34.28,28.81,22.79,48.14,58.13,59.56,109.18,4.56,18.37,12.12,70.14,12.12,211.83v545.57h270.21v-583.02c0-146.29-15.28-253.17-46.56-326.67-32.67-76.85-84.33-138.69-153.2-184.27h.18Z\"\n />\n <path \n fill=\"currentColor\" \n d=\"M7728.49,355.19c-21.79-16.14-44.46-30.52-68.02-42.8-75.75-39.64-161-59.81-253.45-59.81-159.59,0-297.92,58.06-411.28,172.6-113.02,114.19-170.49,253.63-170.49,414.48s56.77,304.68,168.73,419.04c112.49,115.07,250.29,173.3,409.35,173.3,89.47,0,173.3-18.94,249.06-56.3,26.19-12.98,51.67-28.07,76.1-45.43v90.68h268.39V0h-268.39v355.37-.17ZM7695.45,1014.01c-27.24,48.59-65.38,86.13-116.36,114.72-51.85,29.11-104.93,43.32-162.58,43.32s-107.92-14.03-157.31-43.15c-49.56-28.94-87.88-68.76-117.58-121.38-29.88-52.97-44.29-106.64-44.29-164.18s14.41-111.73,43.94-164c29.17-51.92,67.32-91.03,116.35-119.45,49.22-28.59,101.42-42.45,159.95-42.45,90.87,0,165.04,30.52,226.73,93.49,62.22,63.32,92.45,140.5,92.45,235.92,0,62.97-13.53,117.52-41.12,166.81l-.18.35Z\"\n />\n <path \n fill=\"currentColor\" \n d=\"M9021.01,277.76v76.05c-21.79-16.16-44.47-30.56-68.02-42.85-75.75-39.69-161-59.89-253.45-59.89-159.59,0-297.92,58.13-411.29,172.82-113.01,114.33-170.48,253.96-170.48,415.01s56.77,304.89,168.73,419.58c112.49,115.21,250.28,173.52,409.35,173.52,89.46,0,173.3-18.97,249.06-56.38,26.19-12.99,51.67-28.1,76.1-45.49v89.05h268.39V277.76h-268.39ZM8987.97,1013.47c-27.25,48.65-65.39,86.24-116.36,114.87-51.85,29.15-105.1,43.38-162.58,43.38s-107.92-14.05-157.3-43.21c-49.57-28.98-87.89-68.85-117.59-121.53-29.88-53.04-44.29-106.79-44.29-164.39s14.41-111.88,43.94-164.21c29.17-51.99,67.31-91.15,116.35-119.6,49.22-28.63,101.42-42.5,159.95-42.5,90.87,0,165.04,30.56,226.73,93.61,62.22,63.4,92.45,140.68,92.45,236.22,0,63.05-13.53,117.67-41.13,167.02l-.17.35Z\"\n />\n <path fill=\"currentColor\" d=\"M3927.32,519.82c0-140.11,112.99-241.01,251.96-241.01h302.69V0h-302.69c-284.39,0-515.59,233.28-515.59,519.82v902.88h263.81v-445.28h431.9v-265.98h-431.9v-191.62h-.18Z\"/>\n <path fill=\"currentColor\" d=\"M4745.61,519.82c0-140.11,112.99-241.01,251.95-241.01h302.7V0h-302.7c-284.38,0-515.59,233.28-515.59,519.82v902.88h263.82v-445.28h431.89v-265.98h-431.89v-191.62h-.18Z\"/>\n </svg>\n </Host>\n );\n }\n}\n"],"names":["h","Host"],"mappings":"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"}
1	+ {"version":3,"file":"af-heading.af-logo.af-nav-item.af-navbar.af-text.entry.cjs.js","sources":["src/components/af-heading/af-heading.css?tag=af-heading&encapsulation=shadow","src/components/af-heading/af-heading.tsx","src/components/af-text/af-text.css?tag=af-text&encapsulation=shadow","src/components/af-text/af-text.tsx","src/components/af-nav-item/af-nav-item.css?tag=af-nav-item&encapsulation=scoped","src/components/af-nav-item/af-nav-item.tsx","src/components/af-navbar/af-navbar.css?tag=af-navbar&encapsulation=scoped","src/components/af-navbar/af-navbar.tsx","src/components/af-logo/af-logo.css?tag=af-logo&encapsulation=shadow","src/components/af-logo/af-logo.tsx"],"sourcesContent":[":host {\n display: block;\n}\n\n.heading {\n margin: 0;\n padding: 0;\n font-family: var(--typography-headingfont, 'NeuSans', Arial, sans-serif);\n font-weight: var(--font-weight-regular, 400);\n /* Inherit color from theme context via CSS custom property /\n color: var(--af-typography-heading-primary, var(--colour-brand-inkwell, #14343b));\n letter-spacing: var(--letter-spacing-heading, -0.02em);\n}\n\n/ Alignment - inherits from --af-text-align if set, otherwise uses explicit align prop /\n.align-inherit {\n text-align: var(--af-text-align, left);\n}\n\n.align-left {\n text-align: left;\n}\n\n.align-center {\n text-align: center;\n}\n\n.align-right {\n text-align: right;\n}\n\n/ Heading XL /\n.level-xl {\n font-size: var(--font-size-heading-xl-mobile, 50px);\n line-height: var(--line-height-heading-tight, 1);\n}\n\n@media (min-width: 768px) {\n .level-xl {\n font-size: var(--font-size-heading-xl-desktop, 80px);\n }\n}\n\n/ Heading 1 /\n.level-1 {\n font-size: var(--font-size-heading-1-mobile, 38px);\n line-height: var(--line-height-heading-tight, 1);\n}\n\n@media (min-width: 768px) {\n .level-1 {\n font-size: var(--font-size-heading-1-desktop, 56px);\n }\n}\n\n/ Heading 2 /\n.level-2 {\n font-size: var(--font-size-heading-2-mobile, 32px);\n line-height: var(--line-height-heading-tight, 1);\n}\n\n@media (min-width: 768px) {\n .level-2 {\n font-size: var(--font-size-heading-2-desktop, 44px);\n }\n}\n\n/ Heading 3 /\n.level-3 {\n font-size: var(--font-size-heading-3-mobile, 25px);\n line-height: var(--line-height-heading-tight, 1);\n}\n\n@media (min-width: 768px) {\n .level-3 {\n font-size: var(--font-size-heading-3-desktop, 34px);\n }\n}\n\n/ Heading 4 /\n.level-4 {\n font-size: var(--font-size-heading-4-mobile, 20px);\n line-height: var(--line-height-heading-normal, 1.1);\n}\n\n@media (min-width: 768px) {\n .level-4 {\n font-size: var(--font-size-heading-4-desktop, 24px);\n line-height: var(--line-height-heading-relaxed, 1.2);\n }\n}\n\n/ Heading 5 /\n.level-5 {\n font-size: var(--font-size-heading-5-mobile, 18px);\n line-height: var(--line-height-heading-normal, 1.1);\n}\n\n@media (min-width: 768px) {\n .level-5 {\n font-size: var(--font-size-heading-5-desktop, 20px);\n line-height: var(--line-height-heading-relaxed, 1.2);\n }\n}\n","import { Component, h, Prop } from '@stencil/core';\n\n/\n Heading component that inherits color from theme context.\n * Color is determined by the parent theme (af-section, af-card, etc.)\n * via CSS custom properties.\n /\n@Component({\n tag: 'af-heading',\n styleUrl: 'af-heading.css',\n shadow: true\n})\nexport class AfHeading {\n /* Heading level /\n @Prop() level: 'xl' \| '1' \| '2' \| '3' \| '4' \| '5' = '1';\n\n /* Visual alignment. Defaults to 'inherit' which reads from parent context (e.g. AfTypographyLockup) /\n @Prop() align: 'inherit' \| 'left' \| 'center' \| 'right' = 'inherit';\n\n private getHeadingTag() {\n // Map display levels to semantic HTML tags\n const tagMap: Record<string, string> = {\n 'xl': 'h1',\n '1': 'h1',\n '2': 'h2',\n '3': 'h3',\n '4': 'h4',\n '5': 'h5'\n };\n return tagMap[this.level] \|\| 'h1';\n }\n\n render() {\n const Tag = this.getHeadingTag() as any;\n\n return (\n <Tag\n class={{\n 'heading': true,\n [`level-${this.level}`]: true,\n [`align-${this.align}`]: true\n }}\n part=\"base\"\n >\n <slot />\n </Tag>\n );\n }\n}\n",":host {\n display: block;\n}\n\n.text {\n margin: 0;\n padding: 0;\n font-family: var(--typography-bodyfont, 'NeuSans', Arial, sans-serif);\n font-weight: var(--font-weight-regular, 400);\n / Inherit color from theme context via CSS custom property /\n color: var(--af-typography-body-default, var(--colour-inkwell-400, #2b484f));\n letter-spacing: var(--letter-spacing-body, 0);\n / Inherit alignment from parent context (e.g. typography lockup), default to left /\n text-align: var(--af-text-align, left);\n}\n\n/ Alignment /\n.align-left {\n text-align: left;\n}\n\n.align-center {\n text-align: center;\n}\n\n.align-right {\n text-align: right;\n}\n\n/ Body variants /\n.variant-xlarge {\n font-size: var(--font-size-body-xlarge, 22px);\n line-height: var(--line-height-body-xlarge, 28px);\n}\n\n.variant-large {\n font-size: var(--font-size-body-large, 18px);\n line-height: var(--line-height-body-large, 26px);\n}\n\n.variant-medium {\n font-size: var(--font-size-body-medium, 16px);\n line-height: var(--line-height-body-medium, 24px);\n}\n\n.variant-small {\n font-size: var(--font-size-body-small, 14px);\n line-height: var(--line-height-body-small, 20px);\n}\n","import { Component, h, Prop } from '@stencil/core';\n\n/\n Text/body component that inherits color from theme context.\n * Color is determined by the parent theme (af-section, af-card, etc.)\n * via CSS custom properties.\n /\n@Component({\n tag: 'af-text',\n styleUrl: 'af-text.css',\n shadow: true\n})\nexport class AfText {\n /* Text variant /\n @Prop() variant: 'xlarge' \| 'large' \| 'medium' \| 'small' = 'medium';\n\n /* Visual alignment. When not set, inherits from parent context (e.g. typography lockup). /\n @Prop() align?: 'left' \| 'center' \| 'right';\n\n /* Semantic element to render /\n @Prop() as: 'p' \| 'span' \| 'div' \| 'label' = 'p';\n\n render() {\n const Tag = this.as as any;\n\n return (\n <Tag\n class={{\n 'text': true,\n [`variant-${this.variant}`]: true,\n [`align-${this.align}`]: !!this.align\n }}\n part=\"base\"\n >\n <slot />\n </Tag>\n );\n }\n}\n",":host {\n display: inline-block;\n}\n\n/ Mobile breakpoint - full width block display /\n:host([breakpoint=\"mobile\"]) {\n display: block;\n width: 100%;\n}\n\n.nav-link {\n text-decoration: none;\n color: inherit;\n display: block;\n}\n\n.nav-item {\n display: flex;\n align-items: center;\n gap: 8px;\n box-sizing: border-box;\n cursor: pointer;\n}\n\n/ Primary hierarchy - bold main navigation /\n.hierarchy-primary {\n padding: 12px;\n justify-content: center;\n}\n\n.hierarchy-primary .label-container {\n display: flex;\n align-items: center;\n justify-content: center;\n height: 24px;\n gap: 10px;\n}\n\n/ Primary variant 01 - darker /\n.hierarchy-primary.variant-01 {\n font-family: var(--typography-headingfont, 'NeuSans', 'Inter', system-ui, sans-serif);\n font-size: 16px;\n font-weight: var(--font-weight-book, 500);\n line-height: 20px;\n color: var(--af-nav-item-primary, var(--af-typography-body-dark, #14343b));\n}\n\n/ Add transparent border to prevent layout shift on hover /\n.hierarchy-primary.variant-01 .label-container {\n border-bottom: 1px solid transparent;\n}\n\n/ Primary variant 02 - lighter for light backgrounds /\n.hierarchy-primary.variant-02 {\n font-family: var(--typography-bodyfont, 'Helvetica', 'Inter', system-ui, sans-serif);\n font-size: 16px;\n font-weight: var(--font-weight-regular, 400);\n line-height: 20px;\n color: var(--af-nav-item-secondary, var(--af-typography-body-default, #2b484f));\n}\n\n/ Hover state for primary variant-01 - show underline /\n.hierarchy-primary.variant-01:hover .label-container {\n border-bottom-color: currentColor;\n}\n\n/ Active state for primary variant-01 - thicker border /\n.hierarchy-primary.variant-01.active .label-container {\n border-bottom: 2px solid var(--af-nav-border-active, var(--af-background-border-active, #8a7049));\n / Adjust margin to prevent shift from 1px to 2px border /\n margin-bottom: -1px;\n}\n\n/ Hover and active states for variant-02 (light backgrounds) - no border /\n.hierarchy-primary.variant-02:hover {\n background-color: rgba(20, 52, 59, 0.04);\n border-radius: 8px;\n}\n\n.hierarchy-primary.variant-02.active {\n background-color: rgba(20, 52, 59, 0.08);\n border-radius: 8px;\n}\n\n/ Secondary hierarchy - smaller sub-navigation /\n.hierarchy-secondary {\n padding: 4px 0;\n}\n\n.hierarchy-secondary .label-container {\n display: flex;\n align-items: center;\n flex: 1;\n min-height: 24px;\n gap: 10px;\n}\n\n/ Secondary variant 01 - medium weight /\n.hierarchy-secondary.variant-01 {\n font-family: var(--typography-headingfont, 'NeuSans', 'Inter', system-ui, sans-serif);\n font-size: 14px;\n font-weight: 500;\n line-height: 20px;\n color: var(--af-nav-item-primary, var(--af-typography-body-dark, #14343b));\n}\n\n/ Secondary variant 02 - regular weight /\n.hierarchy-secondary.variant-02 {\n font-family: var(--typography-bodyfont, 'NeuSans', 'Inter', system-ui, sans-serif);\n font-size: 14px;\n font-weight: 400;\n line-height: 20px;\n color: var(--af-nav-item-secondary, var(--af-typography-body-default, #2b484f));\n}\n\n/ Hover state for secondary - underline text /\n.hierarchy-secondary:hover .label-container {\n text-decoration: underline;\n}\n\n/ Focus states for accessibility /\n.nav-item:focus-within {\n outline: 2px solid var(--af-nav-border-active, var(--af-background-border-active, #8a7049));\n outline-offset: 2px;\n border-radius: 4px;\n}\n\n/ Remove default focus outline on link /\n.nav-link:focus {\n outline: none;\n}\n\n.nav-link:focus-visible + .nav-item,\n:host(:focus-visible) .nav-item {\n outline: 2px solid var(--af-nav-border-active, var(--af-background-border-active, #8a7049));\n outline-offset: 2px;\n border-radius: 4px;\n}\n\n/ Mobile breakpoint styles - explicit via prop /\n.hierarchy-primary.breakpoint-mobile {\n padding: 20px 12px;\n border-bottom: 1px solid var(--af-nav-border-subtle, var(--af-background-border-subtle, #e8eeed));\n width: 100%;\n justify-content: flex-start;\n}\n\n.hierarchy-primary.breakpoint-mobile .label-container {\n flex: 1;\n justify-content: flex-start;\n}\n\n.hierarchy-primary.variant-01.breakpoint-mobile {\n font-size: 20px;\n line-height: 1.1;\n letter-spacing: -0.4px;\n}\n\n.hierarchy-primary.variant-02.breakpoint-mobile {\n font-size: 20px;\n line-height: 1.1;\n letter-spacing: -0.4px;\n color: var(--af-nav-item-subtle, var(--af-typography-body-subtle, #60767b));\n}\n\n/ Mobile breakpoint for secondary hierarchy /\n.hierarchy-secondary.breakpoint-mobile {\n padding: 2px 0;\n height: 40px;\n}\n\n.hierarchy-secondary.breakpoint-mobile .label-container {\n min-height: 24px;\n}\n\n/ Mobile removes the hover underline effect /\n.hierarchy-primary.breakpoint-mobile.variant-01 .label-container {\n border-bottom-color: transparent;\n}\n\n.hierarchy-primary.breakpoint-mobile.variant-01:hover .label-container {\n border-bottom-color: transparent;\n}\n\n.hierarchy-primary.breakpoint-mobile.variant-01.active .label-container {\n border-bottom-color: transparent;\n margin-bottom: 0;\n}\n\n/ Icon sizing and styling /\n::slotted([slot=\"icon-left\"]),\n::slotted([slot=\"icon-right\"]) {\n width: 24px;\n height: 24px;\n flex-shrink: 0;\n display: flex;\n align-items: center;\n justify-content: center;\n transition: transform 0.2s ease;\n}\n\n/ Icon color inheritance for primary hierarchy /\n.hierarchy-primary.variant-01 ::slotted([slot=\"icon-left\"]),\n.hierarchy-primary.variant-01 ::slotted([slot=\"icon-right\"]) {\n color: var(--af-nav-item-primary, var(--af-typography-body-dark, #14343b));\n}\n\n.hierarchy-primary.variant-02 ::slotted([slot=\"icon-left\"]),\n.hierarchy-primary.variant-02 ::slotted([slot=\"icon-right\"]) {\n color: var(--af-nav-item-secondary, var(--af-typography-body-default, #2b484f));\n}\n\n/ Icon rotation on hover for desktop primary with dropdown indicator /\n.hierarchy-primary.variant-01.breakpoint-desktop:hover ::slotted([slot=\"icon-right\"]),\n.hierarchy-primary.variant-01.breakpoint-desktop.active ::slotted([slot=\"icon-right\"]) {\n transform: rotate(180deg);\n}\n\n/ Icon rotation on active for mobile primary with dropdown indicator /\n.hierarchy-primary.breakpoint-mobile.active ::slotted([slot=\"icon-right\"]) {\n transform: rotate(180deg);\n}\n\n/ Secondary hierarchy - smaller icons /\n.hierarchy-secondary ::slotted([slot=\"icon-right\"]) {\n width: 20px;\n height: 20px;\n}\n\n/ Icon color inheritance for secondary hierarchy /\n.hierarchy-secondary.variant-01 ::slotted([slot=\"icon-right\"]) {\n color: var(--af-nav-item-primary, var(--af-typography-body-dark, #14343b));\n}\n\n.hierarchy-secondary.variant-02 ::slotted([slot=\"icon-right\"]) {\n color: var(--af-nav-item-secondary, var(--af-typography-body-default, #2b484f));\n}\n\n/ Fallback media query for when breakpoint prop is not set /\n@media (max-width: 991px) {\n :host([breakpoint=\"auto\"]) .hierarchy-primary,\n :host(:not([breakpoint])) .hierarchy-primary {\n padding: 20px 12px;\n border-bottom: 1px solid var(--af-nav-border-subtle, var(--af-background-border-subtle, #e8eeed));\n width: 100%;\n }\n\n :host([breakpoint=\"auto\"]) .hierarchy-primary .label-container,\n :host(:not([breakpoint])) .hierarchy-primary .label-container {\n flex: 1;\n justify-content: flex-start;\n }\n\n :host([breakpoint=\"auto\"]) .hierarchy-primary.variant-01,\n :host(:not([breakpoint])) .hierarchy-primary.variant-01 {\n font-size: 20px;\n line-height: 1.1;\n letter-spacing: -0.4px;\n }\n\n :host([breakpoint=\"auto\"]) .hierarchy-primary.variant-02,\n :host(:not([breakpoint])) .hierarchy-primary.variant-02 {\n font-size: 20px;\n line-height: 1.1;\n letter-spacing: -0.4px;\n color: var(--af-nav-item-subtle, var(--af-typography-body-subtle, #60767b));\n }\n\n / Icon rotation on active for auto/responsive breakpoint /\n :host([breakpoint=\"auto\"]) .hierarchy-primary.active ::slotted([slot=\"icon-right\"]),\n :host(:not([breakpoint])) .hierarchy-primary.active ::slotted([slot=\"icon-right\"]) {\n transform: rotate(180deg);\n }\n\n / Disable desktop hover rotation in mobile view /\n :host([breakpoint=\"auto\"]) .hierarchy-primary:hover ::slotted([slot=\"icon-right\"]),\n :host(:not([breakpoint])) .hierarchy-primary:hover ::slotted([slot=\"icon-right\"]) {\n transform: none;\n }\n\n :host([breakpoint=\"auto\"]) .hierarchy-primary.active:hover ::slotted([slot=\"icon-right\"]),\n :host(:not([breakpoint])) .hierarchy-primary.active:hover ::slotted([slot=\"icon-right\"]) {\n transform: rotate(180deg);\n }\n}\n","import { Component, h, Prop, Host } from '@stencil/core';\n\n/\n A generic navigation item component that can be used in navigation bars, menus, and sidebars.\n * Supports multiple hierarchy levels, variants, and states (active, hover).\n /\n@Component({\n tag: 'af-nav-item',\n styleUrl: 'af-nav-item.css',\n shadow: false,\n scoped: true,\n})\nexport class AfNavItem {\n /\n Visual hierarchy level of the navigation item\n * - 'primary': Bold, main navigation (larger text, prominent styling)\n * - 'secondary': Lighter, sub-navigation (smaller text, subtle styling)\n /\n @Prop() hierarchy: 'primary' \| 'secondary' = 'primary';\n\n /\n Visual variant within the hierarchy level\n * - '01': Darker/more prominent styling\n * - '02': Lighter/more subtle styling\n /\n @Prop() variant: '01' \| '02' = '01';\n\n /\n Breakpoint variant for responsive styling\n * - 'desktop': Desktop-specific styles\n * - 'mobile': Mobile-specific styles (larger text, different spacing)\n /\n @Prop({ reflect: true }) breakpoint: 'desktop' \| 'mobile' = 'desktop';\n\n /\n URL to navigate to when clicked\n /\n @Prop() href?: string;\n\n /\n Whether this nav item is currently active/selected\n /\n @Prop() active: boolean = false;\n\n render() {\n const classes = {\n 'nav-item': true,\n [`hierarchy-${this.hierarchy}`]: true,\n [`variant-${this.variant}`]: true,\n [`breakpoint-${this.breakpoint}`]: true,\n 'active': this.active\n };\n\n const content = (\n <div class={classes}>\n <slot name=\"icon-left\"></slot>\n <div class=\"label-container\">\n <slot></slot>\n </div>\n <slot name=\"icon-right\"></slot>\n </div>\n );\n\n if (this.href) {\n return (\n <Host>\n <a href={this.href} class=\"nav-link\">\n {content}\n </a>\n </Host>\n );\n }\n\n return <Host>{content}</Host>;\n }\n}\n",":host {\n display: block;\n width: 100%;\n}\n\n/ Spacer element that sits in normal document flow to prevent content overlap /\n.navbar-spacer {\n height: 100px; / Accounts for navbar height + top margin /\n}\n\n/ Theme variants for spacer background - matches section themes /\n.navbar-spacer.theme-white {\n background-color: var(--colour-brand-white, #FFFFFF);\n}\n\n.navbar-spacer.theme-inkwell {\n background-color: var(--colour-brand-inkwell, #14343B);\n}\n\n.navbar-spacer.theme-mist-green {\n background-color: var(--colour-brand-mist-green, #C6D5D1);\n}\n\n.navbar-spacer.theme-soft-clay {\n background-color: var(--colour-softclay-400, #c0ab8d);\n}\n\n/ Sticky navbar that floats above the spacer /\n.navbar-container {\n position: fixed;\n top: 32px;\n left: 0;\n right: 0;\n z-index: 10;\n padding: 0 80px;\n box-sizing: border-box;\n}\n\n.navbar {\n background: var(--colour-background-white, #ffffff);\n border-radius: 9999px;\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: 8px 8px 8px 40px;\n box-sizing: border-box;\n flex-wrap: nowrap; / Prevent wrapping /\n}\n\n/ Left section /\n.navbar-left {\n display: flex;\n align-items: center;\n gap: 32px;\n flex-shrink: 0;\n}\n\n.logo {\n display: flex;\n align-items: center;\n flex-shrink: 0;\n}\n\n/ Mobile menu toggle button /\n.mobile-menu-toggle {\n display: none;\n background: none;\n border: none;\n padding: 8px;\n cursor: pointer;\n color: var(--colour-brand-inkwell, #14343b);\n margin-left: auto;\n}\n\n.mobile-menu-toggle svg {\n display: block;\n}\n\n.nav-links {\n display: flex;\n align-items: center;\n gap: 8px;\n flex-wrap: nowrap;\n}\n\n/ Right section /\n.navbar-right {\n display: flex;\n align-items: center;\n gap: 20px;\n}\n\n.nav-actions {\n display: flex;\n align-items: center;\n gap: 12px;\n}\n\n.nav-button {\n display: flex;\n align-items: center;\n}\n\n/ Dropdown container /\n.dropdown-container {\n position: absolute;\n top: 108px;\n left: 0;\n right: 0;\n padding: 0 80px;\n pointer-events: none;\n opacity: 0;\n transform: translateY(-8px);\n transition: opacity 0.2s ease, transform 0.2s ease;\n}\n\n.dropdown-container.is-open {\n pointer-events: auto;\n opacity: 1;\n transform: translateY(0);\n}\n\n.dropdown-panel {\n background: var(--colour-background-base, #ffffff);\n border-radius: 32px;\n overflow: hidden;\n box-shadow: 0 4px 24px rgba(20, 52, 59, 0.12);\n}\n\n/ Hide empty dropdown slots /\n.dropdown-panel:empty {\n display: none;\n}\n\n/ Mobile menu panel - separate from navbar for proper positioning /\n.mobile-menu-panel {\n display: none;\n position: fixed;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n background: var(--colour-background-base, #ffffff);\n z-index: 9;\n padding: 100px 16px 24px 16px;\n overflow-y: auto;\n opacity: 0;\n pointer-events: none;\n transition: opacity 0.2s ease;\n}\n\n.mobile-menu-panel.is-open {\n display: block;\n opacity: 1;\n pointer-events: auto;\n}\n\n/ Mobile CTA button container /\n.mobile-button-container {\n margin-bottom: 8px;\n}\n\n.mobile-button-container ::slotted() {\n width: 100%;\n}\n\n/* Mobile menu content - flex column ensures items stack vertically /\n.mobile-menu-content {\n display: flex;\n flex-direction: column;\n width: 100%;\n}\n\n/ Force slotted items to take full width for composability /\n.mobile-menu-content ::slotted() {\n flex: 0 0 auto;\n width: 100%;\n}\n\n/* \n * Breakpoint 1: Hide \"Talk to us\" and \"Log in\" (nav-actions) \n * This happens first as the viewport gets narrower\n * Matches affinda.com behavior at ~1100px\n /\n@media (max-width: 1099px) {\n .nav-actions {\n display: none;\n }\n \n .navbar-right {\n gap: 0;\n }\n}\n\n/ Tablet adjustments /\n@media (max-width: 1024px) {\n .navbar-spacer {\n height: 88px;\n }\n\n .navbar-container {\n top: 24px;\n padding: 0 40px;\n }\n\n .navbar-left {\n gap: 24px;\n }\n\n .nav-links {\n gap: 4px;\n }\n\n .dropdown-container {\n padding: 0 40px;\n }\n}\n\n/ \n * Breakpoint 2: Switch to hamburger menu\n * Matches affinda.com behavior at 991px\n /\n@media (max-width: 991px) {\n .navbar-spacer {\n height: 72px;\n }\n\n .navbar-container {\n top: 16px;\n padding: 0 16px;\n z-index: 11; / Above mobile menu panel /\n }\n\n .navbar {\n padding: 8px 8px 8px 24px; / Figma: 8px padding right, 24px left on mobile /\n flex-direction: row;\n border-radius: 9999px; / Keep pill shape on mobile /\n gap: 0;\n }\n\n .navbar-left {\n width: auto;\n flex-direction: row;\n justify-content: flex-start;\n align-items: center;\n gap: 16px;\n flex: 1;\n }\n\n / Show hamburger button on mobile /\n .mobile-menu-toggle {\n display: flex;\n padding: 12px;\n margin-left: auto;\n border-radius: 9999px;\n border: 1px solid var(--colour-brand-inkwell, #14343b);\n }\n\n .mobile-menu-toggle:hover {\n background: rgba(20, 52, 59, 0.05);\n }\n\n / Hide nav links on mobile - they're in the mobile menu panel /\n .nav-links {\n display: none;\n }\n\n / Hide right section on mobile - button is in mobile menu panel /\n .navbar-right {\n display: none;\n }\n\n / Hide desktop dropdown on mobile /\n .dropdown-container {\n display: none;\n }\n\n / Mobile menu panel adjustments /\n .mobile-menu-panel {\n padding-top: 88px; / Accounts for navbar height /\n }\n\n .mobile-button-container {\n padding: 0 12px;\n margin-bottom: 8px;\n }\n\n .mobile-button-container ::slotted(af-button),\n .mobile-button-container ::slotted(button) {\n width: 100%;\n display: flex;\n justify-content: center;\n }\n}\n\n/ ==========================================================================\n Force Mobile Mode\n Apply mobile styles regardless of viewport when force-mobile attribute is set\n ========================================================================== /\n\n:host([force-mobile]) .navbar-spacer {\n height: 72px;\n}\n\n:host([force-mobile]) .navbar-container {\n top: 16px;\n padding: 0 16px;\n z-index: 11;\n}\n\n:host([force-mobile]) .navbar {\n padding: 8px 8px 8px 24px;\n flex-direction: row;\n border-radius: 9999px;\n gap: 0;\n}\n\n:host([force-mobile]) .navbar-left {\n width: auto;\n flex-direction: row;\n justify-content: flex-start;\n align-items: center;\n gap: 16px;\n flex: 1;\n}\n\n:host([force-mobile]) .mobile-menu-toggle {\n display: flex;\n padding: 12px;\n margin-left: auto;\n border-radius: 9999px;\n border: 1px solid var(--colour-brand-inkwell, #14343b);\n}\n\n:host([force-mobile]) .mobile-menu-toggle:hover {\n background: rgba(20, 52, 59, 0.05);\n}\n\n:host([force-mobile]) .nav-links {\n display: none;\n}\n\n:host([force-mobile]) .navbar-right {\n display: none;\n}\n\n:host([force-mobile]) .nav-actions {\n display: none;\n}\n\n:host([force-mobile]) .dropdown-container {\n display: none;\n}\n\n:host([force-mobile]) .mobile-menu-panel {\n padding-top: 88px;\n}\n\n:host([force-mobile]) .mobile-menu-panel.is-open {\n display: block;\n opacity: 1;\n pointer-events: auto;\n}\n\n:host([force-mobile]) .mobile-button-container {\n padding: 0 12px;\n margin-bottom: 8px;\n}\n\n:host([force-mobile]) .mobile-button-container ::slotted(af-button),\n:host([force-mobile]) .mobile-button-container ::slotted(button) {\n width: 100%;\n display: flex;\n justify-content: center;\n}\n\n/ Force mobile: flex column ensures items stack vertically /\n:host([force-mobile]) .mobile-menu-content {\n display: flex;\n flex-direction: column;\n}\n\n/ Force mobile: slotted items take full width for composability /\n:host([force-mobile]) .mobile-menu-content ::slotted() {\n flex: 0 0 auto;\n width: 100%;\n}\n","import { Component, State, h, Host, Prop, Element, Listen } from '@stencil/core';\n\n/*\n A full-width navigation bar component that provides the main site navigation.\n * Features a pill-shaped container with logo, navigation links, and action buttons.\n * Includes mobile hamburger menu and support for mega-menu dropdowns.\n * \n * The logo slot can be used to provide a custom logo. If no logo is provided,\n * the default Affinda logo will be displayed.\n * \n * Slots:\n * - `logo` - Logo area (defaults to Affinda logo if empty)\n * - `start` - Primary navigation links (left side, desktop)\n * - `end` - Secondary/utility links (right side)\n * - `button` - Call-to-action button\n * - `dropdown-solutions` - Mega-menu for Solutions dropdown\n * - `dropdown-pricing` - Mega-menu for Pricing dropdown \n * - `dropdown-resources` - Mega-menu for Resources dropdown\n * - `dropdown` - Generic dropdown slot\n * - `mobile-menu` - Mobile menu content (use af-nav-accordion for accordion menus)\n * - `mobile-button` - CTA button for mobile menu (appears at top)\n /\n@Component({\n tag: 'af-navbar',\n styleUrl: 'af-navbar.css',\n shadow: false,\n scoped: true,\n})\nexport class AfNavbar {\n @Element() el!: HTMLElement;\n\n @State() mobileMenuOpen: boolean = false;\n \n /* The currently open dropdown identifier (null if none open) /\n @State() activeDropdown: string \| null = null;\n\n /* Whether to show the default Affinda logo when no logo slot content is provided /\n @Prop() showDefaultLogo: boolean = true;\n\n /* Theme for the spacer background - should match the section below the navbar /\n @Prop() theme?: 'white' \| 'inkwell' \| 'mist-green' \| 'soft-clay';\n\n /* Force mobile layout regardless of viewport size (useful for testing/stories) /\n @Prop({ reflect: true }) forceMobile: boolean = false;\n\n private toggleMobileMenu = () => {\n this.mobileMenuOpen = !this.mobileMenuOpen;\n // Close any open dropdown when toggling mobile menu\n this.activeDropdown = null;\n };\n\n /\n Opens a dropdown by its identifier\n /\n private openDropdown = (dropdownId: string) => {\n this.activeDropdown = dropdownId;\n };\n\n /\n Closes the currently open dropdown\n /\n private closeDropdown = () => {\n this.activeDropdown = null;\n };\n\n /\n Toggles a dropdown by its identifier\n /\n private toggleDropdown = (dropdownId: string) => {\n if (this.activeDropdown === dropdownId) {\n this.activeDropdown = null;\n } else {\n this.activeDropdown = dropdownId;\n }\n };\n\n /\n Handle clicks outside the navbar to close dropdowns\n /\n @Listen('click', { target: 'document' })\n handleDocumentClick(event: MouseEvent) {\n const path = event.composedPath();\n if (!path.includes(this.el)) {\n this.closeDropdown();\n }\n }\n\n /\n Handle escape key to close dropdowns\n /\n @Listen('keydown', { target: 'document' })\n handleKeyDown(event: KeyboardEvent) {\n if (event.key === 'Escape') {\n this.closeDropdown();\n }\n }\n\n render() {\n const hasDropdown = this.activeDropdown !== null;\n\n return (\n <Host class={{ 'has-dropdown-open': hasDropdown }}>\n {/ Spacer element to prevent content from being hidden behind sticky navbar /}\n <div class={`navbar-spacer${this.theme ? ` theme-${this.theme}` : ''}`}></div>\n \n <nav class=\"navbar-container\">\n <div class=\"navbar theme-white\">\n {/ Left section: Logo + Nav Links /}\n <div class=\"navbar-left\">\n <div class=\"logo\">\n <slot name=\"logo\">\n {/ Default Affinda logo if no slot content provided /}\n {this.showDefaultLogo && <af-logo></af-logo>}\n </slot>\n </div>\n \n {/ Hamburger menu button - mobile only /}\n <button \n class=\"mobile-menu-toggle\"\n onClick={this.toggleMobileMenu}\n aria-label=\"Toggle navigation menu\"\n aria-expanded={this.mobileMenuOpen ? 'true' : 'false'}\n >\n {this.mobileMenuOpen ? (\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\">\n <path d=\"M18 6L6 18M6 6l12 12\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n </svg>\n ) : (\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\">\n <path d=\"M3 12h18M3 6h18M3 18h18\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n </svg>\n )}\n </button>\n \n <div class={`nav-links ${this.mobileMenuOpen ? 'mobile-open' : ''}`}>\n <slot name=\"start\"></slot>\n </div>\n </div>\n\n {/ Right section: Actions + Button /}\n <div class={`navbar-right ${this.mobileMenuOpen ? 'mobile-open' : ''}`}>\n <div class=\"nav-actions\">\n <slot name=\"end\"></slot>\n </div>\n <div class=\"nav-button\">\n <slot name=\"button\"></slot>\n </div>\n </div>\n </div>\n\n {/ Dropdown panel container /}\n <div class={`dropdown-container ${hasDropdown ? 'is-open' : ''}`}>\n <div class=\"dropdown-panel theme-white\">\n <slot name=\"dropdown-solutions\"></slot>\n <slot name=\"dropdown-pricing\"></slot>\n <slot name=\"dropdown-resources\"></slot>\n <slot name=\"dropdown\"></slot>\n </div>\n </div>\n </nav>\n\n {/ Mobile menu panel /}\n <div class={`mobile-menu-panel theme-white ${this.mobileMenuOpen ? 'is-open' : ''}`}>\n {/ Mobile CTA button at top /}\n <div class=\"mobile-button-container\">\n <slot name=\"mobile-button\">\n <slot name=\"button\"></slot>\n </slot>\n </div>\n \n {/ Mobile navigation content /}\n <div class=\"mobile-menu-content\">\n <slot name=\"mobile-menu\"></slot>\n </div>\n </div>\n </Host>\n );\n }\n}\n",":host {\n display: inline-block;\n color: var(--af-background-icon-default, var(--colour-brand-inkwell, #14343b));\n}\n\n.logo-svg {\n display: block;\n / Maintain aspect ratio based on viewBox (9290:1432 ≈ 6.49:1) /\n width: auto;\n height: 22px;\n}\n","import { Component, h, Host } from '@stencil/core';\n\n/\n Affinda logo component\n */\n@Component({\n tag: 'af-logo',\n styleUrl: 'af-logo.css',\n shadow: true\n})\nexport class AfLogo {\n render() {\n return (\n <Host>\n <svg \n class=\"logo-svg\" \n viewBox=\"0 0 9290 1432\" \n aria-label=\"Affinda\"\n role=\"img\"\n >\n <path \n fill=\"currentColor\" \n d=\"M1691.17,452.11c-107.93-107.48-250.13-166.09-401.3-163.79h-739.51l-148.18,237.98h892.96c86.83,0,168.39,33.64,230.09,95.09,63.28,63.04,98.26,147.32,98.26,237.45,0,185.03-149.41,335.36-332.92,335.36H385.66c-82.44,0-149.59-67.64-149.59-150.68s67.32-151.75,149.41-154.23h810.17l152.93-237.98H381.44C171.21,656.62,0,832.45,0,1043.52s172.97,388.48,385.66,388.48h904.91c313.76,0,569.17-257.28,569.17-573.34,0-154.22-59.76-298.53-168.4-406.72l-.17.18Z\"\n />\n <path \n fill=\"currentColor\" \n d=\"M3265.12,353.81c-21.8-16.16-44.47-30.56-68.02-42.85-75.76-39.69-161-59.89-253.45-59.89-159.6,0-297.92,58.13-411.29,172.82-113.02,114.33-170.49,253.96-170.49,415.01s56.77,304.89,168.73,419.58c112.49,115.21,250.29,173.52,409.35,173.52,89.47,0,173.31-18.97,249.06-56.38,26.19-12.99,51.68-28.1,76.11-45.49v89.05h268.39V276.36h-268.39v77.45ZM3232.07,1013.47c-27.24,48.65-65.38,86.24-116.35,114.87-51.85,29.15-105.11,43.38-162.58,43.38s-107.92-14.05-157.31-43.21c-49.57-28.98-87.88-68.85-117.59-121.53-29.88-53.04-44.29-106.79-44.29-164.39s14.41-111.88,43.94-164.21c29.18-51.99,67.32-91.15,116.36-119.6,49.21-28.63,101.41-42.5,159.94-42.5,90.87,0,165.04,30.56,226.73,93.61,62.23,63.4,92.46,140.68,92.46,236.22,0,63.05-13.54,117.67-41.13,167.02l-.18.35Z\"\n />\n <path fill=\"currentColor\" d=\"M5569.92,278.96h-269.66v1143.74h269.66V278.96Z\"/>\n <path \n fill=\"currentColor\" \n d=\"M6504.78,328.74c-68.7-45.4-148.11-68.37-235.78-68.37s-163.57,19.96-235.61,59.36c-21.61,11.84-42.69,25.44-63.07,40.81v-89.22h-270.22v1151.2h270.22v-436.03c0-154.94,8.78-223.14,15.81-252.11,15.64-61.13,47.44-110.95,96.81-152.65,47.96-40.28,100.49-59.89,160.58-59.89,51.13,0,89.96,11.13,118.95,34.28,28.81,22.79,48.14,58.13,59.56,109.18,4.56,18.37,12.12,70.14,12.12,211.83v545.57h270.21v-583.02c0-146.29-15.28-253.17-46.56-326.67-32.67-76.85-84.33-138.69-153.2-184.27h.18Z\"\n />\n <path \n fill=\"currentColor\" \n d=\"M7728.49,355.19c-21.79-16.14-44.46-30.52-68.02-42.8-75.75-39.64-161-59.81-253.45-59.81-159.59,0-297.92,58.06-411.28,172.6-113.02,114.19-170.49,253.63-170.49,414.48s56.77,304.68,168.73,419.04c112.49,115.07,250.29,173.3,409.35,173.3,89.47,0,173.3-18.94,249.06-56.3,26.19-12.98,51.67-28.07,76.1-45.43v90.68h268.39V0h-268.39v355.37-.17ZM7695.45,1014.01c-27.24,48.59-65.38,86.13-116.36,114.72-51.85,29.11-104.93,43.32-162.58,43.32s-107.92-14.03-157.31-43.15c-49.56-28.94-87.88-68.76-117.58-121.38-29.88-52.97-44.29-106.64-44.29-164.18s14.41-111.73,43.94-164c29.17-51.92,67.32-91.03,116.35-119.45,49.22-28.59,101.42-42.45,159.95-42.45,90.87,0,165.04,30.52,226.73,93.49,62.22,63.32,92.45,140.5,92.45,235.92,0,62.97-13.53,117.52-41.12,166.81l-.18.35Z\"\n />\n <path \n fill=\"currentColor\" \n d=\"M9021.01,277.76v76.05c-21.79-16.16-44.47-30.56-68.02-42.85-75.75-39.69-161-59.89-253.45-59.89-159.59,0-297.92,58.13-411.29,172.82-113.01,114.33-170.48,253.96-170.48,415.01s56.77,304.89,168.73,419.58c112.49,115.21,250.28,173.52,409.35,173.52,89.46,0,173.3-18.97,249.06-56.38,26.19-12.99,51.67-28.1,76.1-45.49v89.05h268.39V277.76h-268.39ZM8987.97,1013.47c-27.25,48.65-65.39,86.24-116.36,114.87-51.85,29.15-105.1,43.38-162.58,43.38s-107.92-14.05-157.3-43.21c-49.57-28.98-87.89-68.85-117.59-121.53-29.88-53.04-44.29-106.79-44.29-164.39s14.41-111.88,43.94-164.21c29.17-51.99,67.31-91.15,116.35-119.6,49.22-28.63,101.42-42.5,159.95-42.5,90.87,0,165.04,30.56,226.73,93.61,62.22,63.4,92.45,140.68,92.45,236.22,0,63.05-13.53,117.67-41.13,167.02l-.17.35Z\"\n />\n <path fill=\"currentColor\" d=\"M3927.32,519.82c0-140.11,112.99-241.01,251.96-241.01h302.69V0h-302.69c-284.39,0-515.59,233.28-515.59,519.82v902.88h263.81v-445.28h431.9v-265.98h-431.9v-191.62h-.18Z\"/>\n <path fill=\"currentColor\" d=\"M4745.61,519.82c0-140.11,112.99-241.01,251.95-241.01h302.7V0h-302.7c-284.38,0-515.59,233.28-515.59,519.82v902.88h263.82v-445.28h431.89v-265.98h-431.89v-191.62h-.18Z\"/>\n </svg>\n </Host>\n );\n }\n}\n"],"names":["h","Host"],"mappings":"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"}

package/dist/cjs/af-heading_5.cjs.entry.js CHANGED Viewed

@@ -1,16 +1,16 @@
 'use strict';
-var index = require('./index-ybEiHT0b.js');
+var index = require('./index-n-fnurTP.js');
-const afHeadingCss = ":host{display:block}.heading{margin:0;padding:0;font-family:var(--typography-headingfont, 'NeuSans', Arial, sans-serif);font-weight:var(--font-weight-regular, 400);color:var(--af-typography-heading-primary, var(--colour-brand-inkwell, #14343b));letter-spacing:var(--letter-spacing-heading, -0.02em)}.align-left{text-align:left}.align-center{text-align:center}.align-right{text-align:right}.level-xl{font-size:var(--font-size-heading-xl-mobile, 50px);line-height:var(--line-height-heading-tight, 1)}@media (min-width: 768px){.level-xl{font-size:var(--font-size-heading-xl-desktop, 80px)}}.level-1{font-size:var(--font-size-heading-1-mobile, 38px);line-height:var(--line-height-heading-tight, 1)}@media (min-width: 768px){.level-1{font-size:var(--font-size-heading-1-desktop, 56px)}}.level-2{font-size:var(--font-size-heading-2-mobile, 32px);line-height:var(--line-height-heading-tight, 1)}@media (min-width: 768px){.level-2{font-size:var(--font-size-heading-2-desktop, 44px)}}.level-3{font-size:var(--font-size-heading-3-mobile, 25px);line-height:var(--line-height-heading-tight, 1)}@media (min-width: 768px){.level-3{font-size:var(--font-size-heading-3-desktop, 34px)}}.level-4{font-size:var(--font-size-heading-4-mobile, 20px);line-height:var(--line-height-heading-normal, 1.1)}@media (min-width: 768px){.level-4{font-size:var(--font-size-heading-4-desktop, 24px);line-height:var(--line-height-heading-relaxed, 1.2)}}.level-5{font-size:var(--font-size-heading-5-mobile, 18px);line-height:var(--line-height-heading-normal, 1.1)}@media (min-width: 768px){.level-5{font-size:var(--font-size-heading-5-desktop, 20px);line-height:var(--line-height-heading-relaxed, 1.2)}}";
+const afHeadingCss = ":host{display:block}.heading{margin:0;padding:0;font-family:var(--typography-headingfont, 'NeuSans', Arial, sans-serif);font-weight:var(--font-weight-regular, 400);color:var(--af-typography-heading-primary, var(--colour-brand-inkwell, #14343b));letter-spacing:var(--letter-spacing-heading, -0.02em)}.align-inherit{text-align:var(--af-text-align, left)}.align-left{text-align:left}.align-center{text-align:center}.align-right{text-align:right}.level-xl{font-size:var(--font-size-heading-xl-mobile, 50px);line-height:var(--line-height-heading-tight, 1)}@media (min-width: 768px){.level-xl{font-size:var(--font-size-heading-xl-desktop, 80px)}}.level-1{font-size:var(--font-size-heading-1-mobile, 38px);line-height:var(--line-height-heading-tight, 1)}@media (min-width: 768px){.level-1{font-size:var(--font-size-heading-1-desktop, 56px)}}.level-2{font-size:var(--font-size-heading-2-mobile, 32px);line-height:var(--line-height-heading-tight, 1)}@media (min-width: 768px){.level-2{font-size:var(--font-size-heading-2-desktop, 44px)}}.level-3{font-size:var(--font-size-heading-3-mobile, 25px);line-height:var(--line-height-heading-tight, 1)}@media (min-width: 768px){.level-3{font-size:var(--font-size-heading-3-desktop, 34px)}}.level-4{font-size:var(--font-size-heading-4-mobile, 20px);line-height:var(--line-height-heading-normal, 1.1)}@media (min-width: 768px){.level-4{font-size:var(--font-size-heading-4-desktop, 24px);line-height:var(--line-height-heading-relaxed, 1.2)}}.level-5{font-size:var(--font-size-heading-5-mobile, 18px);line-height:var(--line-height-heading-normal, 1.1)}@media (min-width: 768px){.level-5{font-size:var(--font-size-heading-5-desktop, 20px);line-height:var(--line-height-heading-relaxed, 1.2)}}";
 const AfHeading = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
         /** Heading level */
         this.level = '1';
-        /** Visual alignment */
-        this.align = 'left';
+        /** Visual alignment. Defaults to 'inherit' which reads from parent context (e.g. AfTypographyLockup) */
+        this.align = 'inherit';
     }
     getHeadingTag() {
         // Map display levels to semantic HTML tags
@@ -26,39 +26,37 @@ const AfHeading = class {
     }
     render() {
         const Tag = this.getHeadingTag();
-        return (index.h(Tag, { key: '05bfc95960c7546b642fde77e0cc4018817c4241', class: {
+        return (index.h(Tag, { key: '554451170ad9c9cf3345d4c115cc4bd360c54651', class: {
                 'heading': true,
                 [`level-${this.level}`]: true,
                 [`align-${this.align}`]: true
-            }, part: "base" }, index.h("slot", { key: '9ebf0b011f26063a1835dfe157d0d485a30a5a0b' })));
+            }, part: "base" }, index.h("slot", { key: 'a41808f28f04efa17b49ef1a4ebfd79896ba8e98' })));
     }
 };
 AfHeading.style = afHeadingCss;
-const afTextCss = ":host{display:block}.text{margin:0;padding:0;font-family:var(--typography-bodyfont, 'NeuSans', Arial, sans-serif);font-weight:var(--font-weight-regular, 400);color:var(--af-typography-body-default, var(--colour-inkwell-400, #2b484f));letter-spacing:var(--letter-spacing-body, 0)}.align-left{text-align:left}.align-center{text-align:center}.align-right{text-align:right}.variant-xlarge{font-size:var(--font-size-body-xlarge, 22px);line-height:var(--line-height-body-xlarge, 28px)}.variant-large{font-size:var(--font-size-body-large, 18px);line-height:var(--line-height-body-large, 26px)}.variant-medium{font-size:var(--font-size-body-medium, 16px);line-height:var(--line-height-body-medium, 24px)}.variant-small{font-size:var(--font-size-body-small, 14px);line-height:var(--line-height-body-small, 20px)}";
+const afTextCss = ":host{display:block}.text{margin:0;padding:0;font-family:var(--typography-bodyfont, 'NeuSans', Arial, sans-serif);font-weight:var(--font-weight-regular, 400);color:var(--af-typography-body-default, var(--colour-inkwell-400, #2b484f));letter-spacing:var(--letter-spacing-body, 0);text-align:var(--af-text-align, left)}.align-left{text-align:left}.align-center{text-align:center}.align-right{text-align:right}.variant-xlarge{font-size:var(--font-size-body-xlarge, 22px);line-height:var(--line-height-body-xlarge, 28px)}.variant-large{font-size:var(--font-size-body-large, 18px);line-height:var(--line-height-body-large, 26px)}.variant-medium{font-size:var(--font-size-body-medium, 16px);line-height:var(--line-height-body-medium, 24px)}.variant-small{font-size:var(--font-size-body-small, 14px);line-height:var(--line-height-body-small, 20px)}";
 const AfText = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
         /** Text variant */
         this.variant = 'medium';
-        /** Visual alignment */
-        this.align = 'left';
         /** Semantic element to render */
         this.as = 'p';
     }
     render() {
         const Tag = this.as;
-        return (index.h(Tag, { key: '824ada09e3f1b9eff027c758087e8369f4de5daa', class: {
+        return (index.h(Tag, { key: '522550f1e2027db872a76232f0833571b558e817', class: {
                 'text': true,
                 [`variant-${this.variant}`]: true,
-                [`align-${this.align}`]: true
-            }, part: "base" }, index.h("slot", { key: '3c9762436be40ed4920db1dea3a38561e275848e' })));
+                [`align-${this.align}`]: !!this.align
+            }, part: "base" }, index.h("slot", { key: '8968ce08e3080dcefa3583520dcc75894140c057' })));
     }
 };
 AfText.style = afTextCss;
-const afNavItemCss = ":host{display:inline-block}.nav-link{text-decoration:none;color:inherit;display:block}.nav-item{display:flex;align-items:center;gap:8px;box-sizing:border-box;cursor:pointer}.hierarchy-primary{padding:12px;justify-content:center}.hierarchy-primary .label-container{display:flex;align-items:center;justify-content:center;height:24px;gap:10px}.hierarchy-primary.variant-01{font-family:var(--typography-headingfont, 'NeuSans', 'Inter', system-ui, sans-serif);font-size:16px;font-weight:var(--font-weight-book, 500);line-height:20px;color:var(--colour-typography-nav-item-primary, #14343b)}.hierarchy-primary.variant-01 .label-container{border-bottom:1px solid transparent}.hierarchy-primary.variant-02{font-family:var(--typography-bodyfont, 'Helvetica', 'Inter', system-ui, sans-serif);font-size:16px;font-weight:var(--font-weight-regular, 400);line-height:20px;color:var(--colour-typography-nav-item-secondary, #2b484f)}.hierarchy-primary.variant-01:hover .label-container{border-bottom-color:currentColor}.hierarchy-primary.variant-01.active .label-container{border-bottom:2px solid var(--colour-background-border-active, #8a7049);margin-bottom:-1px}.hierarchy-primary.variant-02:hover{background-color:rgba(20, 52, 59, 0.04);border-radius:8px}.hierarchy-primary.variant-02.active{background-color:rgba(20, 52, 59, 0.08);border-radius:8px}.hierarchy-secondary{padding:4px 0}.hierarchy-secondary .label-container{display:flex;align-items:center;flex:1;min-height:24px;gap:10px}.hierarchy-secondary.variant-01{font-family:var(--typography-headingfont, 'NeuSans', 'Inter', system-ui, sans-serif);font-size:14px;font-weight:500;line-height:20px;color:var(--colour-typography-body-dark, #14343b)}.hierarchy-secondary.variant-02{font-family:var(--typography-bodyfont, 'NeuSans', 'Inter', system-ui, sans-serif);font-size:14px;font-weight:400;line-height:20px;color:var(--colour-typography-body-default, #2b484f)}.hierarchy-secondary:hover .label-container{text-decoration:underline}.nav-item:focus-within{outline:2px solid var(--colour-background-border-active, #8a7049);outline-offset:2px;border-radius:4px}.nav-link:focus{outline:none}.nav-link:focus-visible+.nav-item,:host(:focus-visible) .nav-item{outline:2px solid var(--colour-background-border-active, #8a7049);outline-offset:2px;border-radius:4px}.hierarchy-primary.breakpoint-mobile{padding:20px 12px;border-bottom:1px solid var(--colour-background-border-subtle, #e8eeed);width:100%;justify-content:flex-start}.hierarchy-primary.breakpoint-mobile .label-container{flex:1;justify-content:flex-start}.hierarchy-primary.variant-01.breakpoint-mobile{font-size:20px;line-height:1.1;letter-spacing:-0.4px}.hierarchy-primary.variant-02.breakpoint-mobile{font-size:20px;line-height:1.1;letter-spacing:-0.4px;color:var(--colour-typography-body-subtle, #60767b)}.hierarchy-secondary.breakpoint-mobile{padding:2px 0;height:40px}.hierarchy-secondary.breakpoint-mobile .label-container{min-height:24px}.hierarchy-primary.breakpoint-mobile.variant-01 .label-container{border-bottom-color:transparent}.hierarchy-primary.breakpoint-mobile.variant-01:hover .label-container{border-bottom-color:transparent}.hierarchy-primary.breakpoint-mobile.variant-01.active .label-container{border-bottom-color:transparent;margin-bottom:0}::slotted([slot=\"icon-left\"]),::slotted([slot=\"icon-right\"]){width:24px;height:24px;flex-shrink:0;display:flex;align-items:center;justify-content:center;transition:transform 0.2s ease}.hierarchy-primary.variant-01 ::slotted([slot=\"icon-left\"]),.hierarchy-primary.variant-01 ::slotted([slot=\"icon-right\"]){color:var(--colour-typography-nav-item-primary, #14343b)}.hierarchy-primary.variant-02 ::slotted([slot=\"icon-left\"]),.hierarchy-primary.variant-02 ::slotted([slot=\"icon-right\"]){color:var(--colour-typography-nav-item-secondary, #2b484f)}.hierarchy-primary.variant-01.breakpoint-desktop:hover ::slotted([slot=\"icon-right\"]),.hierarchy-primary.variant-01.breakpoint-desktop.active ::slotted([slot=\"icon-right\"]){transform:rotate(180deg)}.hierarchy-primary.breakpoint-mobile.active ::slotted([slot=\"icon-right\"]){transform:rotate(180deg)}.hierarchy-secondary ::slotted([slot=\"icon-right\"]){width:20px;height:20px}.hierarchy-secondary.variant-01 ::slotted([slot=\"icon-right\"]){color:var(--colour-typography-body-dark, #14343b)}.hierarchy-secondary.variant-02 ::slotted([slot=\"icon-right\"]){color:var(--colour-typography-body-default, #2b484f)}@media (max-width: 991px){:host([breakpoint=\"auto\"]) .hierarchy-primary,:host(:not([breakpoint])) .hierarchy-primary{padding:20px 12px;border-bottom:1px solid var(--colour-background-border-subtle, #e8eeed);width:100%}:host([breakpoint=\"auto\"]) .hierarchy-primary .label-container,:host(:not([breakpoint])) .hierarchy-primary .label-container{flex:1;justify-content:flex-start}:host([breakpoint=\"auto\"]) .hierarchy-primary.variant-01,:host(:not([breakpoint])) .hierarchy-primary.variant-01{font-size:20px;line-height:1.1;letter-spacing:-0.4px}:host([breakpoint=\"auto\"]) .hierarchy-primary.variant-02,:host(:not([breakpoint])) .hierarchy-primary.variant-02{font-size:20px;line-height:1.1;letter-spacing:-0.4px;color:var(--colour-typography-body-subtle, #60767b)}:host([breakpoint=\"auto\"]) .hierarchy-primary.active ::slotted([slot=\"icon-right\"]),:host(:not([breakpoint])) .hierarchy-primary.active ::slotted([slot=\"icon-right\"]){transform:rotate(180deg)}:host([breakpoint=\"auto\"]) .hierarchy-primary:hover ::slotted([slot=\"icon-right\"]),:host(:not([breakpoint])) .hierarchy-primary:hover ::slotted([slot=\"icon-right\"]){transform:none}:host([breakpoint=\"auto\"]) .hierarchy-primary.active:hover ::slotted([slot=\"icon-right\"]),:host(:not([breakpoint])) .hierarchy-primary.active:hover ::slotted([slot=\"icon-right\"]){transform:rotate(180deg)}}";
+const afNavItemCss = ".sc-af-nav-item-h{display:inline-block}[breakpoint=\"mobile\"].sc-af-nav-item-h{display:block;width:100%}.nav-link.sc-af-nav-item{text-decoration:none;color:inherit;display:block}.nav-item.sc-af-nav-item{display:flex;align-items:center;gap:8px;box-sizing:border-box;cursor:pointer}.hierarchy-primary.sc-af-nav-item{padding:12px;justify-content:center}.hierarchy-primary.sc-af-nav-item .label-container.sc-af-nav-item{display:flex;align-items:center;justify-content:center;height:24px;gap:10px}.hierarchy-primary.variant-01.sc-af-nav-item{font-family:var(--typography-headingfont, 'NeuSans', 'Inter', system-ui, sans-serif);font-size:16px;font-weight:var(--font-weight-book, 500);line-height:20px;color:var(--af-nav-item-primary, var(--af-typography-body-dark, #14343b))}.hierarchy-primary.variant-01.sc-af-nav-item .label-container.sc-af-nav-item{border-bottom:1px solid transparent}.hierarchy-primary.variant-02.sc-af-nav-item{font-family:var(--typography-bodyfont, 'Helvetica', 'Inter', system-ui, sans-serif);font-size:16px;font-weight:var(--font-weight-regular, 400);line-height:20px;color:var(--af-nav-item-secondary, var(--af-typography-body-default, #2b484f))}.hierarchy-primary.variant-01.sc-af-nav-item:hover .label-container.sc-af-nav-item{border-bottom-color:currentColor}.hierarchy-primary.variant-01.active.sc-af-nav-item .label-container.sc-af-nav-item{border-bottom:2px solid var(--af-nav-border-active, var(--af-background-border-active, #8a7049));margin-bottom:-1px}.hierarchy-primary.variant-02.sc-af-nav-item:hover{background-color:rgba(20, 52, 59, 0.04);border-radius:8px}.hierarchy-primary.variant-02.active.sc-af-nav-item{background-color:rgba(20, 52, 59, 0.08);border-radius:8px}.hierarchy-secondary.sc-af-nav-item{padding:4px 0}.hierarchy-secondary.sc-af-nav-item .label-container.sc-af-nav-item{display:flex;align-items:center;flex:1;min-height:24px;gap:10px}.hierarchy-secondary.variant-01.sc-af-nav-item{font-family:var(--typography-headingfont, 'NeuSans', 'Inter', system-ui, sans-serif);font-size:14px;font-weight:500;line-height:20px;color:var(--af-nav-item-primary, var(--af-typography-body-dark, #14343b))}.hierarchy-secondary.variant-02.sc-af-nav-item{font-family:var(--typography-bodyfont, 'NeuSans', 'Inter', system-ui, sans-serif);font-size:14px;font-weight:400;line-height:20px;color:var(--af-nav-item-secondary, var(--af-typography-body-default, #2b484f))}.hierarchy-secondary.sc-af-nav-item:hover .label-container.sc-af-nav-item{text-decoration:underline}.nav-item.sc-af-nav-item:focus-within{outline:2px solid var(--af-nav-border-active, var(--af-background-border-active, #8a7049));outline-offset:2px;border-radius:4px}.nav-link.sc-af-nav-item:focus{outline:none}.nav-link.sc-af-nav-item:focus-visible+.nav-item.sc-af-nav-item,.sc-af-nav-item-h:focus-visible .nav-item.sc-af-nav-item{outline:2px solid var(--af-nav-border-active, var(--af-background-border-active, #8a7049));outline-offset:2px;border-radius:4px}.hierarchy-primary.breakpoint-mobile.sc-af-nav-item{padding:20px 12px;border-bottom:1px solid var(--af-nav-border-subtle, var(--af-background-border-subtle, #e8eeed));width:100%;justify-content:flex-start}.hierarchy-primary.breakpoint-mobile.sc-af-nav-item .label-container.sc-af-nav-item{flex:1;justify-content:flex-start}.hierarchy-primary.variant-01.breakpoint-mobile.sc-af-nav-item{font-size:20px;line-height:1.1;letter-spacing:-0.4px}.hierarchy-primary.variant-02.breakpoint-mobile.sc-af-nav-item{font-size:20px;line-height:1.1;letter-spacing:-0.4px;color:var(--af-nav-item-subtle, var(--af-typography-body-subtle, #60767b))}.hierarchy-secondary.breakpoint-mobile.sc-af-nav-item{padding:2px 0;height:40px}.hierarchy-secondary.breakpoint-mobile.sc-af-nav-item .label-container.sc-af-nav-item{min-height:24px}.hierarchy-primary.breakpoint-mobile.variant-01.sc-af-nav-item .label-container.sc-af-nav-item{border-bottom-color:transparent}.hierarchy-primary.breakpoint-mobile.variant-01.sc-af-nav-item:hover .label-container.sc-af-nav-item{border-bottom-color:transparent}.hierarchy-primary.breakpoint-mobile.variant-01.active.sc-af-nav-item .label-container.sc-af-nav-item{border-bottom-color:transparent;margin-bottom:0}.sc-af-nav-item-s>[slot=\"icon-left\"],.sc-af-nav-item-s>[slot=\"icon-right\"]{width:24px;height:24px;flex-shrink:0;display:flex;align-items:center;justify-content:center;transition:transform 0.2s ease}.hierarchy-primary.variant-01.sc-af-nav-item-s>[slot=\"icon-left\"],.hierarchy-primary.variant-01 .sc-af-nav-item-s>[slot=\"icon-left\"],.hierarchy-primary.variant-01.sc-af-nav-item-s>[slot=\"icon-right\"],.hierarchy-primary.variant-01 .sc-af-nav-item-s>[slot=\"icon-right\"]{color:var(--af-nav-item-primary, var(--af-typography-body-dark, #14343b))}.hierarchy-primary.variant-02.sc-af-nav-item-s>[slot=\"icon-left\"],.hierarchy-primary.variant-02 .sc-af-nav-item-s>[slot=\"icon-left\"],.hierarchy-primary.variant-02.sc-af-nav-item-s>[slot=\"icon-right\"],.hierarchy-primary.variant-02 .sc-af-nav-item-s>[slot=\"icon-right\"]{color:var(--af-nav-item-secondary, var(--af-typography-body-default, #2b484f))}.hierarchy-primary.variant-01.breakpoint-desktop:hover.sc-af-nav-item-s>[slot=\"icon-right\"],.hierarchy-primary.variant-01.breakpoint-desktop:hover .sc-af-nav-item-s>[slot=\"icon-right\"],.hierarchy-primary.variant-01.breakpoint-desktop.active.sc-af-nav-item-s>[slot=\"icon-right\"],.hierarchy-primary.variant-01.breakpoint-desktop.active .sc-af-nav-item-s>[slot=\"icon-right\"]{transform:rotate(180deg)}.hierarchy-primary.breakpoint-mobile.active.sc-af-nav-item-s>[slot=\"icon-right\"],.hierarchy-primary.breakpoint-mobile.active .sc-af-nav-item-s>[slot=\"icon-right\"]{transform:rotate(180deg)}.hierarchy-secondary.sc-af-nav-item-s>[slot=\"icon-right\"],.hierarchy-secondary .sc-af-nav-item-s>[slot=\"icon-right\"]{width:20px;height:20px}.hierarchy-secondary.variant-01.sc-af-nav-item-s>[slot=\"icon-right\"],.hierarchy-secondary.variant-01 .sc-af-nav-item-s>[slot=\"icon-right\"]{color:var(--af-nav-item-primary, var(--af-typography-body-dark, #14343b))}.hierarchy-secondary.variant-02.sc-af-nav-item-s>[slot=\"icon-right\"],.hierarchy-secondary.variant-02 .sc-af-nav-item-s>[slot=\"icon-right\"]{color:var(--af-nav-item-secondary, var(--af-typography-body-default, #2b484f))}@media (max-width: 991px){[breakpoint=\"auto\"].sc-af-nav-item-h .hierarchy-primary.sc-af-nav-item,.sc-af-nav-item-h:not([breakpoint]) .hierarchy-primary.sc-af-nav-item{padding:20px 12px;border-bottom:1px solid var(--af-nav-border-subtle, var(--af-background-border-subtle, #e8eeed));width:100%}[breakpoint=\"auto\"].sc-af-nav-item-h .hierarchy-primary.sc-af-nav-item .label-container.sc-af-nav-item,.sc-af-nav-item-h:not([breakpoint]) .hierarchy-primary.sc-af-nav-item .label-container.sc-af-nav-item{flex:1;justify-content:flex-start}[breakpoint=\"auto\"].sc-af-nav-item-h .hierarchy-primary.variant-01.sc-af-nav-item,.sc-af-nav-item-h:not([breakpoint]) .hierarchy-primary.variant-01.sc-af-nav-item{font-size:20px;line-height:1.1;letter-spacing:-0.4px}[breakpoint=\"auto\"].sc-af-nav-item-h .hierarchy-primary.variant-02.sc-af-nav-item,.sc-af-nav-item-h:not([breakpoint]) .hierarchy-primary.variant-02.sc-af-nav-item{font-size:20px;line-height:1.1;letter-spacing:-0.4px;color:var(--af-nav-item-subtle, var(--af-typography-body-subtle, #60767b))}.sc-af-nav-item-h[breakpoint=\"auto\"] .hierarchy-primary.active.sc-af-nav-item-s>[slot=\"icon-right\"],.sc-af-nav-item-h[breakpoint=\"auto\"] .hierarchy-primary.active .sc-af-nav-item-s>[slot=\"icon-right\"],.sc-af-nav-item-h:not([breakpoint]) .hierarchy-primary.active.sc-af-nav-item-s>[slot=\"icon-right\"],.sc-af-nav-item-h:not([breakpoint]) .hierarchy-primary.active .sc-af-nav-item-s>[slot=\"icon-right\"]{transform:rotate(180deg)}.sc-af-nav-item-h[breakpoint=\"auto\"] .hierarchy-primary:hover.sc-af-nav-item-s>[slot=\"icon-right\"],.sc-af-nav-item-h[breakpoint=\"auto\"] .hierarchy-primary:hover .sc-af-nav-item-s>[slot=\"icon-right\"],.sc-af-nav-item-h:not([breakpoint]) .hierarchy-primary:hover.sc-af-nav-item-s>[slot=\"icon-right\"],.sc-af-nav-item-h:not([breakpoint]) .hierarchy-primary:hover .sc-af-nav-item-s>[slot=\"icon-right\"]{transform:none}.sc-af-nav-item-h[breakpoint=\"auto\"] .hierarchy-primary.active:hover.sc-af-nav-item-s>[slot=\"icon-right\"],.sc-af-nav-item-h[breakpoint=\"auto\"] .hierarchy-primary.active:hover .sc-af-nav-item-s>[slot=\"icon-right\"],.sc-af-nav-item-h:not([breakpoint]) .hierarchy-primary.active:hover.sc-af-nav-item-s>[slot=\"icon-right\"],.sc-af-nav-item-h:not([breakpoint]) .hierarchy-primary.active:hover .sc-af-nav-item-s>[slot=\"icon-right\"]{transform:rotate(180deg)}}";
 const AfNavItem = class {
     constructor(hostRef) {
@@ -103,7 +101,7 @@ const AfNavItem = class {
 };
 AfNavItem.style = afNavItemCss;
-const afNavbarCss = ":host{display:block;width:100%}.navbar-spacer{height:100px;}.navbar-spacer.theme-white{background-color:var(--colour-brand-white, #FFFFFF)}.navbar-spacer.theme-inkwell{background-color:var(--colour-brand-inkwell, #14343B)}.navbar-spacer.theme-mist-green{background-color:var(--colour-brand-mist-green, #C6D5D1)}.navbar-spacer.theme-soft-clay{background-color:var(--colour-softclay-400, #c0ab8d)}.navbar-container{position:fixed;top:32px;left:0;right:0;z-index:10;padding:0 80px;box-sizing:border-box}.navbar{background:var(--colour-background-white, #ffffff);border-radius:9999px;display:flex;align-items:center;justify-content:space-between;padding:8px 8px 8px 40px;box-sizing:border-box;flex-wrap:nowrap;}.navbar-left{display:flex;align-items:center;gap:32px;flex-shrink:0}.logo{display:flex;align-items:center;flex-shrink:0}.mobile-menu-toggle{display:none;background:none;border:none;padding:8px;cursor:pointer;color:var(--colour-brand-inkwell, #14343b);margin-left:auto}.mobile-menu-toggle svg{display:block}.nav-links{display:flex;align-items:center;gap:8px;flex-wrap:nowrap}.navbar-right{display:flex;align-items:center;gap:20px}.nav-actions{display:flex;align-items:center;gap:12px}.nav-button{display:flex;align-items:center}.dropdown-container{position:absolute;top:108px;left:0;right:0;padding:0 80px;pointer-events:none;opacity:0;transform:translateY(-8px);transition:opacity 0.2s ease, transform 0.2s ease}.dropdown-container.is-open{pointer-events:auto;opacity:1;transform:translateY(0)}.dropdown-panel{background:var(--colour-background-base, #ffffff);border-radius:32px;overflow:hidden;box-shadow:0 4px 24px rgba(20, 52, 59, 0.12)}.dropdown-panel:empty{display:none}.mobile-dropdowns{display:none}@media (max-width: 1099px){.nav-actions{display:none}.navbar-right{gap:0}}@media (max-width: 1024px){.navbar-spacer{height:88px}.navbar-container{top:24px;padding:0 40px}.navbar-left{gap:24px}.nav-links{gap:4px}.dropdown-container{padding:0 40px}}@media (max-width: 991px){.navbar-spacer{height:72px}.navbar-container{top:16px;padding:0 16px}.navbar{padding:8px 16px;flex-direction:column;border-radius:16px;gap:0;flex-wrap:wrap;}.navbar-left{width:100%;flex-direction:row;justify-content:space-between;align-items:center;gap:16px}.mobile-menu-toggle{display:flex}.nav-links{display:none;width:100%;flex-direction:column;align-items:stretch;gap:0;margin-top:16px;flex-wrap:wrap}.nav-links.mobile-open{display:flex}.navbar-right{display:none;width:100%;flex-direction:column;gap:12px;align-items:stretch;margin-top:16px}.navbar-right.mobile-open{display:flex}.nav-actions{display:flex;width:100%;flex-direction:column;align-items:stretch;gap:0}.nav-button{width:100%}.dropdown-container{display:none}.mobile-dropdowns{display:block;padding:0 16px;margin-top:8px}}";
+const afNavbarCss = ".sc-af-navbar-h{display:block;width:100%}.navbar-spacer.sc-af-navbar{height:100px}.navbar-spacer.theme-white.sc-af-navbar{background-color:var(--colour-brand-white, #FFFFFF)}.navbar-spacer.theme-inkwell.sc-af-navbar{background-color:var(--colour-brand-inkwell, #14343B)}.navbar-spacer.theme-mist-green.sc-af-navbar{background-color:var(--colour-brand-mist-green, #C6D5D1)}.navbar-spacer.theme-soft-clay.sc-af-navbar{background-color:var(--colour-softclay-400, #c0ab8d)}.navbar-container.sc-af-navbar{position:fixed;top:32px;left:0;right:0;z-index:10;padding:0 80px;box-sizing:border-box}.navbar.sc-af-navbar{background:var(--colour-background-white, #ffffff);border-radius:9999px;display:flex;align-items:center;justify-content:space-between;padding:8px 8px 8px 40px;box-sizing:border-box;flex-wrap:nowrap}.navbar-left.sc-af-navbar{display:flex;align-items:center;gap:32px;flex-shrink:0}.logo.sc-af-navbar{display:flex;align-items:center;flex-shrink:0}.mobile-menu-toggle.sc-af-navbar{display:none;background:none;border:none;padding:8px;cursor:pointer;color:var(--colour-brand-inkwell, #14343b);margin-left:auto}.mobile-menu-toggle.sc-af-navbar svg.sc-af-navbar{display:block}.nav-links.sc-af-navbar{display:flex;align-items:center;gap:8px;flex-wrap:nowrap}.navbar-right.sc-af-navbar{display:flex;align-items:center;gap:20px}.nav-actions.sc-af-navbar{display:flex;align-items:center;gap:12px}.nav-button.sc-af-navbar{display:flex;align-items:center}.dropdown-container.sc-af-navbar{position:absolute;top:108px;left:0;right:0;padding:0 80px;pointer-events:none;opacity:0;transform:translateY(-8px);transition:opacity 0.2s ease, transform 0.2s ease}.dropdown-container.is-open.sc-af-navbar{pointer-events:auto;opacity:1;transform:translateY(0)}.dropdown-panel.sc-af-navbar{background:var(--colour-background-base, #ffffff);border-radius:32px;overflow:hidden;box-shadow:0 4px 24px rgba(20, 52, 59, 0.12)}.dropdown-panel.sc-af-navbar:empty{display:none}.mobile-menu-panel.sc-af-navbar{display:none;position:fixed;top:0;left:0;right:0;bottom:0;background:var(--colour-background-base, #ffffff);z-index:9;padding:100px 16px 24px 16px;overflow-y:auto;opacity:0;pointer-events:none;transition:opacity 0.2s ease}.mobile-menu-panel.is-open.sc-af-navbar{display:block;opacity:1;pointer-events:auto}.mobile-button-container.sc-af-navbar{margin-bottom:8px}.mobile-button-container.sc-af-navbar-s>*,.mobile-button-container .sc-af-navbar-s>*{width:100%}.mobile-menu-content.sc-af-navbar{display:flex;flex-direction:column;width:100%}.mobile-menu-content.sc-af-navbar-s>*,.mobile-menu-content .sc-af-navbar-s>*{flex:0 0 auto;width:100%}@media (max-width: 1099px){.nav-actions.sc-af-navbar{display:none}.navbar-right.sc-af-navbar{gap:0}}@media (max-width: 1024px){.navbar-spacer.sc-af-navbar{height:88px}.navbar-container.sc-af-navbar{top:24px;padding:0 40px}.navbar-left.sc-af-navbar{gap:24px}.nav-links.sc-af-navbar{gap:4px}.dropdown-container.sc-af-navbar{padding:0 40px}}@media (max-width: 991px){.navbar-spacer.sc-af-navbar{height:72px}.navbar-container.sc-af-navbar{top:16px;padding:0 16px;z-index:11}.navbar.sc-af-navbar{padding:8px 8px 8px 24px;flex-direction:row;border-radius:9999px;gap:0}.navbar-left.sc-af-navbar{width:auto;flex-direction:row;justify-content:flex-start;align-items:center;gap:16px;flex:1}.mobile-menu-toggle.sc-af-navbar{display:flex;padding:12px;margin-left:auto;border-radius:9999px;border:1px solid var(--colour-brand-inkwell, #14343b)}.mobile-menu-toggle.sc-af-navbar:hover{background:rgba(20, 52, 59, 0.05)}.nav-links.sc-af-navbar{display:none}.navbar-right.sc-af-navbar{display:none}.dropdown-container.sc-af-navbar{display:none}.mobile-menu-panel.sc-af-navbar{padding-top:88px}.mobile-button-container.sc-af-navbar{padding:0 12px;margin-bottom:8px}.mobile-button-container.sc-af-navbar-s>af-button,.mobile-button-container .sc-af-navbar-s>af-button,.mobile-button-container.sc-af-navbar-s>button,.mobile-button-container .sc-af-navbar-s>button{width:100%;display:flex;justify-content:center}}[force-mobile].sc-af-navbar-h .navbar-spacer.sc-af-navbar{height:72px}[force-mobile].sc-af-navbar-h .navbar-container.sc-af-navbar{top:16px;padding:0 16px;z-index:11}[force-mobile].sc-af-navbar-h .navbar.sc-af-navbar{padding:8px 8px 8px 24px;flex-direction:row;border-radius:9999px;gap:0}[force-mobile].sc-af-navbar-h .navbar-left.sc-af-navbar{width:auto;flex-direction:row;justify-content:flex-start;align-items:center;gap:16px;flex:1}[force-mobile].sc-af-navbar-h .mobile-menu-toggle.sc-af-navbar{display:flex;padding:12px;margin-left:auto;border-radius:9999px;border:1px solid var(--colour-brand-inkwell, #14343b)}[force-mobile].sc-af-navbar-h .mobile-menu-toggle.sc-af-navbar:hover{background:rgba(20, 52, 59, 0.05)}[force-mobile].sc-af-navbar-h .nav-links.sc-af-navbar{display:none}[force-mobile].sc-af-navbar-h .navbar-right.sc-af-navbar{display:none}[force-mobile].sc-af-navbar-h .nav-actions.sc-af-navbar{display:none}[force-mobile].sc-af-navbar-h .dropdown-container.sc-af-navbar{display:none}[force-mobile].sc-af-navbar-h .mobile-menu-panel.sc-af-navbar{padding-top:88px}[force-mobile].sc-af-navbar-h .mobile-menu-panel.is-open.sc-af-navbar{display:block;opacity:1;pointer-events:auto}[force-mobile].sc-af-navbar-h .mobile-button-container.sc-af-navbar{padding:0 12px;margin-bottom:8px}.sc-af-navbar-h[force-mobile] .mobile-button-container.sc-af-navbar-s>af-button,.mobile-button-container .sc-af-navbar-s>af-button,.sc-af-navbar-h[force-mobile] .mobile-button-container.sc-af-navbar-s>button,.mobile-button-container .sc-af-navbar-s>button{width:100%;display:flex;justify-content:center}[force-mobile].sc-af-navbar-h .mobile-menu-content.sc-af-navbar{display:flex;flex-direction:column}.sc-af-navbar-h[force-mobile] .mobile-menu-content.sc-af-navbar-s>*,.mobile-menu-content .sc-af-navbar-s>*{flex:0 0 auto;width:100%}";
 const AfNavbar = class {
     constructor(hostRef) {
@@ -113,6 +111,8 @@ const AfNavbar = class {
         this.activeDropdown = null;
         /** Whether to show the default Affinda logo when no logo slot content is provided */
         this.showDefaultLogo = true;
+        /** Force mobile layout regardless of viewport size (useful for testing/stories) */
+        this.forceMobile = false;
         this.toggleMobileMenu = () => {
             this.mobileMenuOpen = !this.mobileMenuOpen;
             // Close any open dropdown when toggling mobile menu
@@ -161,20 +161,20 @@ const AfNavbar = class {
     }
     render() {
         const hasDropdown = this.activeDropdown !== null;
-        return (index.h(index.Host, { key: '56ca144ca11afcaeb86bbdbab52aee47c8a4e8db', class: { 'has-dropdown-open': hasDropdown } }, index.h("div", { key: '8ccc05b735246db5ca63ee2ad4546dbafda8c949', class: `navbar-spacer${this.theme ? ` theme-${this.theme}` : ''}` }), index.h("nav", { key: '10d422e2fb0ae5c227522813da2f3f788e144074', class: "navbar-container" }, index.h("div", { key: 'b7062b1ead44808b1df54776c34833e7d710cc8e', class: "navbar" }, index.h("div", { key: 'fd88961f3744b8f38a27541d19ba59bd3b50a537', class: "navbar-left" }, index.h("div", { key: '1747708e1970b53acca93f8f1e902aadf99b094e', class: "logo" }, index.h("slot", { key: '30cd58a1cb5419f84044b8ff31b5646c916648a9', name: "logo" }, this.showDefaultLogo && index.h("af-logo", { key: 'df1ae72b0689352b823499e5d01e39166077fcfe' }))), index.h("button", { key: '93c3d9c6a21cfb056958f81b774b373acd9b3565', class: "mobile-menu-toggle", onClick: this.toggleMobileMenu, "aria-label": "Toggle navigation menu", "aria-expanded": this.mobileMenuOpen ? 'true' : 'false' }, this.mobileMenuOpen ? (index.h("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor" }, index.h("path", { d: "M18 6L6 18M6 6l12 12", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" }))) : (index.h("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor" }, index.h("path", { d: "M3 12h18M3 6h18M3 18h18", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" })))), index.h("div", { key: '3fd2c86dc4c90818d5c9227f2b8a86af7b4e9759', class: `nav-links ${this.mobileMenuOpen ? 'mobile-open' : ''}` }, index.h("slot", { key: 'c65a49fc343293508a5112f0aa41aa04c3fc2062', name: "start" }))), index.h("div", { key: 'c0e23ee412e251b927db5557b30d44ea356db74a', class: `navbar-right ${this.mobileMenuOpen ? 'mobile-open' : ''}` }, index.h("div", { key: 'b770b0a10f9f01c7314464dd1a8925b92190b394', class: "nav-actions" }, index.h("slot", { key: '597e24b9a726a7b050640f17d13c4082e643ed68', name: "end" })), index.h("div", { key: '15930743487c7719ea81df36ecbdf349a44faa32', class: "nav-button" }, index.h("slot", { key: '445dd032e53ab524cee0c55e2183f9062b9f2ee0', name: "button" })))), index.h("div", { key: '462113ba1fd1465baae3eb06d8a0a6153b3879f7', class: `dropdown-container ${hasDropdown ? 'is-open' : ''}` }, index.h("div", { key: 'f88a39284ae6bb4596b9d5bb50e300b301714445', class: "dropdown-panel" }, index.h("slot", { key: '7b0e453d4f87c1e50b0557f72c16a77362825eb5', name: "dropdown-solutions" }), index.h("slot", { key: 'd4988f12dadfa08037d93adf8199cb82ae87fde3', name: "dropdown-pricing" }), index.h("slot", { key: 'ac7fee5d8cc9eae53a4ac2974f833869e5df3921', name: "dropdown-resources" }), index.h("slot", { key: 'c32254e0fa9b96f1d56a03430141c3d5854e5099', name: "dropdown" })))), this.mobileMenuOpen && (index.h("div", { key: 'a50c1ca35d99949f619960898fcb2e37211f5445', class: "mobile-dropdowns" }, index.h("slot", { key: '2539233c4536572946776249f40bfaa993939213', name: "mobile-menu" })))));
+        return (index.h(index.Host, { key: '92f8f346f85a3dc591a97bde173442b963b37e5c', class: { 'has-dropdown-open': hasDropdown } }, index.h("div", { key: '059a556fb84aadf47f5e5cc78adf39314f35e7cd', class: `navbar-spacer${this.theme ? ` theme-${this.theme}` : ''}` }), index.h("nav", { key: 'a724927e2b4e571efcc90baf2bc95047ee9e9e5b', class: "navbar-container" }, index.h("div", { key: '8459055c4d73dd08cf9e411e39b6a5efd281db33', class: "navbar theme-white" }, index.h("div", { key: '1672a840e29672b08bdd097decc5d3704f680b53', class: "navbar-left" }, index.h("div", { key: '6a7dd0e111b1afb93815d92c7ea401c6041b786e', class: "logo" }, index.h("slot", { key: '49706feeb1ffcf21bccb033baf717e29ed0f6809', name: "logo" }, this.showDefaultLogo && index.h("af-logo", { key: 'c4894daec4529effc143cd015dc298e3fe68bde6' }))), index.h("button", { key: '5cc3605bfd31104a8357a270b71bae0d539d459c', class: "mobile-menu-toggle", onClick: this.toggleMobileMenu, "aria-label": "Toggle navigation menu", "aria-expanded": this.mobileMenuOpen ? 'true' : 'false' }, this.mobileMenuOpen ? (index.h("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor" }, index.h("path", { d: "M18 6L6 18M6 6l12 12", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" }))) : (index.h("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor" }, index.h("path", { d: "M3 12h18M3 6h18M3 18h18", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" })))), index.h("div", { key: '37cb78db1c5385f069988d2236aca7c916d24ebe', class: `nav-links ${this.mobileMenuOpen ? 'mobile-open' : ''}` }, index.h("slot", { key: '446e40b871d0e9c689405b234d15e5a9043058bf', name: "start" }))), index.h("div", { key: '1112576571e29edaa6e6c33f083b1a058fdaef64', class: `navbar-right ${this.mobileMenuOpen ? 'mobile-open' : ''}` }, index.h("div", { key: '036a55766ab0e4bbc566b6cfbe6513ea0656ccb3', class: "nav-actions" }, index.h("slot", { key: '01b2df1708553d51475941e109c8f23652d7e0ff', name: "end" })), index.h("div", { key: '4429b2e026ec6b730d8c17cf9f716ad5a6a3c050', class: "nav-button" }, index.h("slot", { key: '0a290b167e6d32441770df9d4f6b3e6104552b77', name: "button" })))), index.h("div", { key: '08c1695708ddf0ef0a1a18bfbd1c45d66ef1bf4f', class: `dropdown-container ${hasDropdown ? 'is-open' : ''}` }, index.h("div", { key: 'b54b6dbd58888e9a844b615337ba7ee62bca00c0', class: "dropdown-panel theme-white" }, index.h("slot", { key: '0f72aff472972bf323e1891518d99eb5d92d2916', name: "dropdown-solutions" }), index.h("slot", { key: '1f7bf6bb90b334d19737e011e759787105a91fa5', name: "dropdown-pricing" }), index.h("slot", { key: '52272d982908c702c3447d9b2b7bddcf2cc030df', name: "dropdown-resources" }), index.h("slot", { key: 'ba1ea577efa7b2a9af9b8a50253eae8eef661bd7', name: "dropdown" })))), index.h("div", { key: '21f14e04f0c351733f7452dc1c10b6abfb26e1ce', class: `mobile-menu-panel theme-white ${this.mobileMenuOpen ? 'is-open' : ''}` }, index.h("div", { key: '22565f6b52971a5fe4235c8f9e2fce4ee5a2d006', class: "mobile-button-container" }, index.h("slot", { key: '2b01297d62d6cca6a58b128701a5a14a02d91e2d', name: "mobile-button" }, index.h("slot", { key: 'd755113cabd174a46acd6d2d5b65d9454964b759', name: "button" }))), index.h("div", { key: '31f63fa53ae2c12b5f0f19e7b2235d94f09f50cb', class: "mobile-menu-content" }, index.h("slot", { key: '748e5a320fb5b5940f1134e332738dccf015748e', name: "mobile-menu" })))));
     }
     get el() { return index.getElement(this); }
 };
 AfNavbar.style = afNavbarCss;
-const afLogoCss = ":host{display:inline-block;color:var(--colour-brand-inkwell, #14343b)}.logo-svg{display:block;width:auto;height:22px}";
+const afLogoCss = ":host{display:inline-block;color:var(--af-background-icon-default, var(--colour-brand-inkwell, #14343b))}.logo-svg{display:block;width:auto;height:22px}";
 const AfLogo = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
     }
     render() {
-        return (index.h(index.Host, { key: '6e315eac8e083807fb987237502d1bdaa06a579c' }, index.h("svg", { key: 'a837202d331f867eecd017d388d952cdbd09c0b0', class: "logo-svg", viewBox: "0 0 9290 1432", "aria-label": "Affinda", role: "img" }, index.h("path", { key: '425b4957d10c5427134caa67834ea5f306d23d14', fill: "currentColor", d: "M1691.17,452.11c-107.93-107.48-250.13-166.09-401.3-163.79h-739.51l-148.18,237.98h892.96c86.83,0,168.39,33.64,230.09,95.09,63.28,63.04,98.26,147.32,98.26,237.45,0,185.03-149.41,335.36-332.92,335.36H385.66c-82.44,0-149.59-67.64-149.59-150.68s67.32-151.75,149.41-154.23h810.17l152.93-237.98H381.44C171.21,656.62,0,832.45,0,1043.52s172.97,388.48,385.66,388.48h904.91c313.76,0,569.17-257.28,569.17-573.34,0-154.22-59.76-298.53-168.4-406.72l-.17.18Z" }), index.h("path", { key: '3dbe122502fce7882967a8a77a04b38e61a9d30f', fill: "currentColor", d: "M3265.12,353.81c-21.8-16.16-44.47-30.56-68.02-42.85-75.76-39.69-161-59.89-253.45-59.89-159.6,0-297.92,58.13-411.29,172.82-113.02,114.33-170.49,253.96-170.49,415.01s56.77,304.89,168.73,419.58c112.49,115.21,250.29,173.52,409.35,173.52,89.47,0,173.31-18.97,249.06-56.38,26.19-12.99,51.68-28.1,76.11-45.49v89.05h268.39V276.36h-268.39v77.45ZM3232.07,1013.47c-27.24,48.65-65.38,86.24-116.35,114.87-51.85,29.15-105.11,43.38-162.58,43.38s-107.92-14.05-157.31-43.21c-49.57-28.98-87.88-68.85-117.59-121.53-29.88-53.04-44.29-106.79-44.29-164.39s14.41-111.88,43.94-164.21c29.18-51.99,67.32-91.15,116.36-119.6,49.21-28.63,101.41-42.5,159.94-42.5,90.87,0,165.04,30.56,226.73,93.61,62.23,63.4,92.46,140.68,92.46,236.22,0,63.05-13.54,117.67-41.13,167.02l-.18.35Z" }), index.h("path", { key: 'e0f15cb4025c3fadcc740fc8f4b47e240f4497c3', fill: "currentColor", d: "M5569.92,278.96h-269.66v1143.74h269.66V278.96Z" }), index.h("path", { key: 'b7054c3fe019f0c42e8d56338c6034d9843a4a05', fill: "currentColor", d: "M6504.78,328.74c-68.7-45.4-148.11-68.37-235.78-68.37s-163.57,19.96-235.61,59.36c-21.61,11.84-42.69,25.44-63.07,40.81v-89.22h-270.22v1151.2h270.22v-436.03c0-154.94,8.78-223.14,15.81-252.11,15.64-61.13,47.44-110.95,96.81-152.65,47.96-40.28,100.49-59.89,160.58-59.89,51.13,0,89.96,11.13,118.95,34.28,28.81,22.79,48.14,58.13,59.56,109.18,4.56,18.37,12.12,70.14,12.12,211.83v545.57h270.21v-583.02c0-146.29-15.28-253.17-46.56-326.67-32.67-76.85-84.33-138.69-153.2-184.27h.18Z" }), index.h("path", { key: 'abb1e667124d30d807c41ab1cd446c4568990a18', fill: "currentColor", d: "M7728.49,355.19c-21.79-16.14-44.46-30.52-68.02-42.8-75.75-39.64-161-59.81-253.45-59.81-159.59,0-297.92,58.06-411.28,172.6-113.02,114.19-170.49,253.63-170.49,414.48s56.77,304.68,168.73,419.04c112.49,115.07,250.29,173.3,409.35,173.3,89.47,0,173.3-18.94,249.06-56.3,26.19-12.98,51.67-28.07,76.1-45.43v90.68h268.39V0h-268.39v355.37-.17ZM7695.45,1014.01c-27.24,48.59-65.38,86.13-116.36,114.72-51.85,29.11-104.93,43.32-162.58,43.32s-107.92-14.03-157.31-43.15c-49.56-28.94-87.88-68.76-117.58-121.38-29.88-52.97-44.29-106.64-44.29-164.18s14.41-111.73,43.94-164c29.17-51.92,67.32-91.03,116.35-119.45,49.22-28.59,101.42-42.45,159.95-42.45,90.87,0,165.04,30.52,226.73,93.49,62.22,63.32,92.45,140.5,92.45,235.92,0,62.97-13.53,117.52-41.12,166.81l-.18.35Z" }), index.h("path", { key: '8cd032a3cb346e1e2bf41b33a8c888d366a9c634', fill: "currentColor", d: "M9021.01,277.76v76.05c-21.79-16.16-44.47-30.56-68.02-42.85-75.75-39.69-161-59.89-253.45-59.89-159.59,0-297.92,58.13-411.29,172.82-113.01,114.33-170.48,253.96-170.48,415.01s56.77,304.89,168.73,419.58c112.49,115.21,250.28,173.52,409.35,173.52,89.46,0,173.3-18.97,249.06-56.38,26.19-12.99,51.67-28.1,76.1-45.49v89.05h268.39V277.76h-268.39ZM8987.97,1013.47c-27.25,48.65-65.39,86.24-116.36,114.87-51.85,29.15-105.1,43.38-162.58,43.38s-107.92-14.05-157.3-43.21c-49.57-28.98-87.89-68.85-117.59-121.53-29.88-53.04-44.29-106.79-44.29-164.39s14.41-111.88,43.94-164.21c29.17-51.99,67.31-91.15,116.35-119.6,49.22-28.63,101.42-42.5,159.95-42.5,90.87,0,165.04,30.56,226.73,93.61,62.22,63.4,92.45,140.68,92.45,236.22,0,63.05-13.53,117.67-41.13,167.02l-.17.35Z" }), index.h("path", { key: '3087e75a044032e2bf6ff1a49f78d18adb3a0688', fill: "currentColor", d: "M3927.32,519.82c0-140.11,112.99-241.01,251.96-241.01h302.69V0h-302.69c-284.39,0-515.59,233.28-515.59,519.82v902.88h263.81v-445.28h431.9v-265.98h-431.9v-191.62h-.18Z" }), index.h("path", { key: '3118ef825a1bc7640b1a49abddc5f0b6f1743bf0', fill: "currentColor", d: "M4745.61,519.82c0-140.11,112.99-241.01,251.95-241.01h302.7V0h-302.7c-284.38,0-515.59,233.28-515.59,519.82v902.88h263.82v-445.28h431.89v-265.98h-431.89v-191.62h-.18Z" }))));
+        return (index.h(index.Host, { key: 'df7fdd77101269480d619d9ba86275680079b32a' }, index.h("svg", { key: '96644e0b5cf18e589084ca1083718c7b6c4b9f17', class: "logo-svg", viewBox: "0 0 9290 1432", "aria-label": "Affinda", role: "img" }, index.h("path", { key: '954a70a6af7a9f98899b1093a9ec86bde3b69637', fill: "currentColor", d: "M1691.17,452.11c-107.93-107.48-250.13-166.09-401.3-163.79h-739.51l-148.18,237.98h892.96c86.83,0,168.39,33.64,230.09,95.09,63.28,63.04,98.26,147.32,98.26,237.45,0,185.03-149.41,335.36-332.92,335.36H385.66c-82.44,0-149.59-67.64-149.59-150.68s67.32-151.75,149.41-154.23h810.17l152.93-237.98H381.44C171.21,656.62,0,832.45,0,1043.52s172.97,388.48,385.66,388.48h904.91c313.76,0,569.17-257.28,569.17-573.34,0-154.22-59.76-298.53-168.4-406.72l-.17.18Z" }), index.h("path", { key: '97f720a0fbbf7b40f08fa96e4cec4020b723b19e', fill: "currentColor", d: "M3265.12,353.81c-21.8-16.16-44.47-30.56-68.02-42.85-75.76-39.69-161-59.89-253.45-59.89-159.6,0-297.92,58.13-411.29,172.82-113.02,114.33-170.49,253.96-170.49,415.01s56.77,304.89,168.73,419.58c112.49,115.21,250.29,173.52,409.35,173.52,89.47,0,173.31-18.97,249.06-56.38,26.19-12.99,51.68-28.1,76.11-45.49v89.05h268.39V276.36h-268.39v77.45ZM3232.07,1013.47c-27.24,48.65-65.38,86.24-116.35,114.87-51.85,29.15-105.11,43.38-162.58,43.38s-107.92-14.05-157.31-43.21c-49.57-28.98-87.88-68.85-117.59-121.53-29.88-53.04-44.29-106.79-44.29-164.39s14.41-111.88,43.94-164.21c29.18-51.99,67.32-91.15,116.36-119.6,49.21-28.63,101.41-42.5,159.94-42.5,90.87,0,165.04,30.56,226.73,93.61,62.23,63.4,92.46,140.68,92.46,236.22,0,63.05-13.54,117.67-41.13,167.02l-.18.35Z" }), index.h("path", { key: 'aca04016a8e4c386527296e8072d833a19ac64db', fill: "currentColor", d: "M5569.92,278.96h-269.66v1143.74h269.66V278.96Z" }), index.h("path", { key: '548ae27e683f7e40841b33e4b23f99d1cd35132e', fill: "currentColor", d: "M6504.78,328.74c-68.7-45.4-148.11-68.37-235.78-68.37s-163.57,19.96-235.61,59.36c-21.61,11.84-42.69,25.44-63.07,40.81v-89.22h-270.22v1151.2h270.22v-436.03c0-154.94,8.78-223.14,15.81-252.11,15.64-61.13,47.44-110.95,96.81-152.65,47.96-40.28,100.49-59.89,160.58-59.89,51.13,0,89.96,11.13,118.95,34.28,28.81,22.79,48.14,58.13,59.56,109.18,4.56,18.37,12.12,70.14,12.12,211.83v545.57h270.21v-583.02c0-146.29-15.28-253.17-46.56-326.67-32.67-76.85-84.33-138.69-153.2-184.27h.18Z" }), index.h("path", { key: '04bd2f2c3f4428a8705f31842226f1ee12876416', fill: "currentColor", d: "M7728.49,355.19c-21.79-16.14-44.46-30.52-68.02-42.8-75.75-39.64-161-59.81-253.45-59.81-159.59,0-297.92,58.06-411.28,172.6-113.02,114.19-170.49,253.63-170.49,414.48s56.77,304.68,168.73,419.04c112.49,115.07,250.29,173.3,409.35,173.3,89.47,0,173.3-18.94,249.06-56.3,26.19-12.98,51.67-28.07,76.1-45.43v90.68h268.39V0h-268.39v355.37-.17ZM7695.45,1014.01c-27.24,48.59-65.38,86.13-116.36,114.72-51.85,29.11-104.93,43.32-162.58,43.32s-107.92-14.03-157.31-43.15c-49.56-28.94-87.88-68.76-117.58-121.38-29.88-52.97-44.29-106.64-44.29-164.18s14.41-111.73,43.94-164c29.17-51.92,67.32-91.03,116.35-119.45,49.22-28.59,101.42-42.45,159.95-42.45,90.87,0,165.04,30.52,226.73,93.49,62.22,63.32,92.45,140.5,92.45,235.92,0,62.97-13.53,117.52-41.12,166.81l-.18.35Z" }), index.h("path", { key: '1fe70269b3db17a9c423f241d2cf4cbf073a54d4', fill: "currentColor", d: "M9021.01,277.76v76.05c-21.79-16.16-44.47-30.56-68.02-42.85-75.75-39.69-161-59.89-253.45-59.89-159.59,0-297.92,58.13-411.29,172.82-113.01,114.33-170.48,253.96-170.48,415.01s56.77,304.89,168.73,419.58c112.49,115.21,250.28,173.52,409.35,173.52,89.46,0,173.3-18.97,249.06-56.38,26.19-12.99,51.67-28.1,76.1-45.49v89.05h268.39V277.76h-268.39ZM8987.97,1013.47c-27.25,48.65-65.39,86.24-116.36,114.87-51.85,29.15-105.1,43.38-162.58,43.38s-107.92-14.05-157.3-43.21c-49.57-28.98-87.89-68.85-117.59-121.53-29.88-53.04-44.29-106.79-44.29-164.39s14.41-111.88,43.94-164.21c29.17-51.99,67.31-91.15,116.35-119.6,49.22-28.63,101.42-42.5,159.95-42.5,90.87,0,165.04,30.56,226.73,93.61,62.22,63.4,92.45,140.68,92.45,236.22,0,63.05-13.53,117.67-41.13,167.02l-.17.35Z" }), index.h("path", { key: 'a0ff5279153bd62d88d0bbca172159aef3ca96a3', fill: "currentColor", d: "M3927.32,519.82c0-140.11,112.99-241.01,251.96-241.01h302.69V0h-302.69c-284.39,0-515.59,233.28-515.59,519.82v902.88h263.81v-445.28h431.9v-265.98h-431.9v-191.62h-.18Z" }), index.h("path", { key: '23f6981ad2f37b47528985eb436eb4c18ba32c9f', fill: "currentColor", d: "M4745.61,519.82c0-140.11,112.99-241.01,251.95-241.01h302.7V0h-302.7c-284.38,0-515.59,233.28-515.59,519.82v902.88h263.82v-445.28h431.89v-265.98h-431.89v-191.62h-.18Z" }))));
     }
 };
 AfLogo.style = afLogoCss;

package/dist/cjs/af-icon-box.cjs.entry.js CHANGED Viewed

@@ -1,6 +1,6 @@
 'use strict';
-var index = require('./index-ybEiHT0b.js');
+var index = require('./index-n-fnurTP.js');
 const afIconBoxCss = ".sc-af-icon-box-h{display:inline-block}.icon-box.sc-af-icon-box{display:inline-flex;align-items:center;justify-content:center;border-radius:16px;background-color:var(--af-background-contrast, var(--colour-brand-mist-green, #c6d5d1));color:var(--af-background-icon-default, var(--colour-brand-inkwell, #14343b));flex-shrink:0}.icon-box--size-small.sc-af-icon-box{width:48px;height:48px;padding:14px;border-radius:12px}.icon-box--size-default.sc-af-icon-box{width:64px;height:64px;padding:12px;border-radius:16px}.icon-box--size-large.sc-af-icon-box{width:80px;height:80px;padding:16px;border-radius:20px}";
@@ -21,7 +21,7 @@ const AfIconBox = class {
             [`icon-box--size-${this.size}`]: true,
         };
         const iconSize = this.size === 'small' ? 20 : this.size === 'large' ? 48 : 40;
-        return (index.h(index.Host, { key: 'f98a89d393a98dbb00fe8f3d47c22e18392015c9' }, index.h("div", { key: '5f899eafc9b55126f495ba5ac60e768454bde2c9', class: containerClasses }, index.h("af-icon", { key: '1be5097838ffb99ac6b127d3848327bbe24f6e7e', name: this.icon, size: iconSize }))));
+        return (index.h(index.Host, { key: '961d990c78faedbaa7595e26966edd712ffe323a' }, index.h("div", { key: '499bd1a36c589994cd1f1c848450aa0fe3d43ac0', class: containerClasses }, index.h("af-icon", { key: '6b48d327dc1a712e764f9ff783ba904252f9873d', name: this.icon, size: iconSize }))));
     }
 };
 AfIconBox.style = afIconBoxCss;

package/dist/cjs/af-icon-button.cjs.entry.js CHANGED Viewed

@@ -1,6 +1,6 @@
 'use strict';
-var index = require('./index-ybEiHT0b.js');
+var index = require('./index-n-fnurTP.js');
 const afIconButtonCss = ":host{display:inline-block}:host([variant=\"secondary\"]){color:var(--af-button-secondary-icon, var(--af-typography-body-dark, var(--colour-brand-inkwell, #14343B)))}:host([variant=\"primary\"]){color:var(--af-button-primary-icon, var(--colour-brand-inkwell, #14343B))}:host([variant=\"tertiary\"]){color:var(--af-button-tertiary-icon, var(--colour-brand-inkwell, #14343B))}.icon-button{display:inline-flex;align-items:center;justify-content:center;border-radius:50%;cursor:pointer;transition:all 0.2s ease;border:1px solid transparent;box-sizing:border-box;flex-shrink:0;text-decoration:none;padding:0}.size-large{width:72px;height:72px;padding:24px}.size-large .icon{width:24px;height:24px}.size-medium{width:48px;height:48px;padding:12px}.size-medium .icon{width:24px;height:24px}.size-small{width:36px;height:36px;padding:8px}.size-small .icon{width:20px;height:20px}.icon{display:flex;align-items:center;justify-content:center;flex-shrink:0;color:inherit}.icon ::slotted(*){width:100%;height:100%;color:inherit}.variant-primary{background:var(--af-button-primary-bg, var(--colour-brand-ice, #A6FFFB));border-color:var(--af-button-primary-stroke, var(--colour-brand-inkwell, #14343B));color:var(--af-button-primary-text, var(--colour-brand-inkwell, #14343B))}.variant-primary:hover:not(.disabled){background:var(--af-button-primary-bg-hover, #95e6e2)}.variant-primary:active:not(.disabled){background:var(--af-button-primary-bg-hover, #95e6e2)}.variant-secondary{background:var(--af-button-secondary-bg, transparent);border-color:var(--af-button-secondary-stroke, currentColor);color:var(--af-button-secondary-text, var(--af-typography-body-dark, var(--colour-brand-inkwell, #14343B)))}.variant-secondary:hover:not(.disabled){background:var(--af-button-secondary-bg-hover, rgba(128, 128, 128, 0.1))}.variant-secondary:active:not(.disabled){background:var(--af-button-secondary-bg-hover, rgba(128, 128, 128, 0.1))}.variant-tertiary{background:transparent;border-color:transparent;color:var(--af-button-tertiary-text, var(--colour-brand-inkwell, #14343B))}.variant-tertiary:hover:not(.disabled){opacity:0.8}.variant-tertiary:active:not(.disabled){opacity:0.6}.disabled{opacity:0.4;cursor:not-allowed;pointer-events:none}button.icon-button{background:none;border:none;padding:0;font:inherit;color:inherit;cursor:pointer}button.icon-button.variant-primary{background:var(--af-button-primary-bg, var(--colour-brand-ice, #A6FFFB));border:1px solid var(--af-button-primary-stroke, var(--colour-brand-inkwell, #14343B))}button.icon-button.variant-secondary{background:var(--af-button-secondary-bg, transparent);border:1px solid var(--af-button-secondary-stroke, currentColor);color:var(--af-button-secondary-text, var(--af-typography-body-dark, var(--colour-brand-inkwell, #14343B)))}button.icon-button.variant-tertiary{background:transparent;border:1px solid transparent}";

package/dist/cjs/af-icon-text.cjs.entry.js CHANGED Viewed

@@ -1,6 +1,6 @@
 'use strict';
-var index = require('./index-ybEiHT0b.js');
+var index = require('./index-n-fnurTP.js');
 const afIconTextCss = ".sc-af-icon-text-h{display:block}.icon-text.sc-af-icon-text{display:flex;width:100%}.icon-text--vertical.sc-af-icon-text{flex-direction:column;gap:24px;align-items:flex-start}.icon-text--horizontal.sc-af-icon-text{flex-direction:row;gap:20px;align-items:flex-start}.icon-text__icon.sc-af-icon-text{flex-shrink:0}.icon-text__lockup.sc-af-icon-text{flex:1;min-width:0}@media (max-width: 768px){.icon-text--vertical.sc-af-icon-text{gap:20px}.icon-text--horizontal.sc-af-icon-text{gap:16px}}";
@@ -27,7 +27,7 @@ const AfIconText = class {
             'icon-text': true,
             [`icon-text--${this.orientation}`]: true,
         };
-        return (index.h(index.Host, { key: '4ab83cfbaeadd4d5db898582966050b6bc193d6c' }, index.h("div", { key: 'ff16245f1344e9cb51e60f9615b126f31154c998', class: containerClasses }, index.h("af-icon-box", { key: 'dc83c0df2a209383d501dfba6ae0d633cc56dc1d', icon: this.icon, size: this.iconSize, class: "icon-text__icon" }), index.h("af-typography-lockup", { key: 'e0b1c5ed913b36c137de77e194e5241cfa3e6973', headingSize: this.headingSize, textAlignment: "left", buttonAlignment: "vertical", class: "icon-text__lockup" }, index.h("slot", { key: 'df7ddf9e2ea7045346db6380f52b74ff36bbad45' }), index.h("span", { key: '07dcdcaa69def9ba0a5c1964efdcf7778f4dc210', slot: "description" }, index.h("slot", { key: '2c609e55d2c5fd41ee6c7681f73ea2e0c84e8130', name: "description" })), index.h("span", { key: '27789b11658d17fd3695648e1798f6efdc3ac913', slot: "buttons" }, index.h("slot", { key: '3e9c4e2ff23ba9966add8f618d5b3c0ef0b8bc4e', name: "buttons" }))))));
+        return (index.h(index.Host, { key: '05f526330b69a8868f4d5d98e43ba59367a17319' }, index.h("div", { key: '1f64e5aa24607f13916bbde18e2ec9427c9a3f7c', class: containerClasses }, index.h("af-icon-box", { key: '9db629d1afad970e95194b87796b56abc6b94b27', icon: this.icon, size: this.iconSize, class: "icon-text__icon" }), index.h("af-typography-lockup", { key: '998fa3c49a6f8eca89d4235d8f2c6b226671ba04', headingSize: this.headingSize, textAlignment: "left", buttonAlignment: "vertical", class: "icon-text__lockup" }, index.h("slot", { key: 'd2d2e7054010367e338d54788b4f3ed8d0c157d7' }), index.h("span", { key: 'e31750f8dc682839c544dba6ea924fd21a454e52', slot: "description" }, index.h("slot", { key: '10248d219f5125818d91a41d2472bcad65e24b4f', name: "description" })), index.h("span", { key: '634276962dea534962e7a33dbcb9d87f98ca968f', slot: "buttons" }, index.h("slot", { key: 'b52e5205b2a9e3d7947c8978050b15c2431e5f8a', name: "buttons" }))))));
     }
 };
 AfIconText.style = afIconTextCss;

package/dist/cjs/af-icon.cjs.entry.js CHANGED Viewed

@@ -1,6 +1,6 @@
 'use strict';
-var index = require('./index-ybEiHT0b.js');
+var index = require('./index-n-fnurTP.js');
 var _documentCurrentScript = typeof document !== 'undefined' ? document.currentScript : null;
 /**

package/dist/cjs/af-illustrated-card.cjs.entry.js CHANGED Viewed

@@ -1,6 +1,6 @@
 'use strict';
-var index = require('./index-ybEiHT0b.js');
+var index = require('./index-n-fnurTP.js');
 const afIllustratedCardCss = ".sc-af-illustrated-card-h{display:flex;flex-direction:column;width:100%;--af-card-padding:0;--af-card-gap:0}.illustrated-card.sc-af-illustrated-card{min-height:400px}.illustrated-card__content.sc-af-illustrated-card{position:relative;display:flex;flex-direction:column;box-sizing:border-box;z-index:1}.illustrated-card--breakpoint-desktop.illustrated-card--size-default.sc-af-illustrated-card .illustrated-card__content.sc-af-illustrated-card{padding:40px 32px 12px 32px}.illustrated-card--breakpoint-desktop.illustrated-card--size-large.sc-af-illustrated-card .illustrated-card__content.sc-af-illustrated-card{padding:40px 40px 0 40px}.illustrated-card--breakpoint-mobile.sc-af-illustrated-card .illustrated-card__content.sc-af-illustrated-card{padding:32px 24px 12px 24px}.illustrated-card__illustration-area.sc-af-illustrated-card{position:relative;width:100%;flex:1;overflow:hidden;display:flex;align-items:center;justify-content:center;padding:24px;box-sizing:border-box}.illustrated-card--breakpoint-desktop.sc-af-illustrated-card .illustrated-card__illustration-area.sc-af-illustrated-card{min-height:160px}.illustrated-card--breakpoint-mobile.sc-af-illustrated-card .illustrated-card__illustration-area.sc-af-illustrated-card{min-height:192px}.illustrated-card__illustration-placeholder.sc-af-illustrated-card{width:100%;height:100%;min-height:120px;display:flex;align-items:center;justify-content:center}.illustrated-card__illustration-area.sc-af-illustrated-card-s>img,.illustrated-card__illustration-area .sc-af-illustrated-card-s>img,.illustrated-card__illustration-area.sc-af-illustrated-card img.sc-af-illustrated-card{max-width:100%;max-height:200px;height:auto;object-fit:contain}.illustrated-card.sc-af-illustrated-card af-typography-lockup.sc-af-illustrated-card{--colour-typography-heading-primary:var(--af-typography-heading-primary);--colour-typography-body-default:var(--af-typography-body-default)}";
@@ -27,7 +27,7 @@ const AfIllustratedCard = class {
             [`illustrated-card--breakpoint-${this.breakpoint}`]: true,
             [`illustrated-card--size-${this.cardSize}`]: true,
         };
-        return (index.h(index.Host, { key: '60f265c32638f31318bcb0292b108cc1989af937' }, index.h("div", { key: '25d4c1f7652930f7e6948fef7ff33c21448dcb0f', class: wrapperClasses }, index.h("af-card", { key: '3b6dcf78a697a100273447de8ac6c19cc774bf1c', theme: this.theme }, index.h("div", { key: '4f1268ae1c60812414414423ec4af94ab3ee8b72', class: "illustrated-card__content" }, index.h("af-typography-lockup", { key: '346399ff84a4c2d22b201e0296f47a9b3fd5ab0a', headingSize: 3, breakpoint: this.breakpoint, textAlignment: "left", buttonAlignment: "vertical" }, index.h("slot", { key: '6e164be82cc05eb6debffc4ec24af5653f6a1306' }), index.h("span", { key: 'd0266f34ec02d44b76eba1e0ccf9c4856c08f33c', slot: "description" }, index.h("slot", { key: '6b6d659c54e83419f3b5e452b64fada7ba33e257', name: "body" })))), index.h("div", { key: '1319568917cdce5d2d37294af416dcfe58b1c4b5', class: "illustrated-card__illustration-area" }, index.h("slot", { key: 'bdea39d0db9615de5a1a6535f845d0c392604e74', name: "illustration" }))))));
+        return (index.h(index.Host, { key: '10c5250554859428b03c48c48b095b8b688b9e76' }, index.h("div", { key: '6c9859967f5fa583c7910ca6f2f33f53d14688e9', class: wrapperClasses }, index.h("af-card", { key: '945d2120fe82c60b60ca961ffa86cfe8f2344da3', theme: this.theme }, index.h("div", { key: 'd09cf3a9bd78dce22ccbed77b6b037b1533a106b', class: "illustrated-card__content" }, index.h("af-typography-lockup", { key: '5bbc4f4885d0b5c7369e363ba5f8a32b2ab0792f', headingSize: 3, breakpoint: this.breakpoint, textAlignment: "left", buttonAlignment: "vertical" }, index.h("slot", { key: 'c356febe02752679ac3e2210dbef75ea793fd884' }), index.h("span", { key: '677bbb48a4aeb2d65d4943541639942e8de96258', slot: "description" }, index.h("slot", { key: 'd747b66a032e5043614f0192dc5b01eafc98bb0d', name: "body" })))), index.h("div", { key: 'e3552088bc91fbdaf9c7c6901b30a75545e51e06', class: "illustrated-card__illustration-area" }, index.h("slot", { key: '0b42d7faec8934be964d400d324e26c9b1b8d5ee', name: "illustration" }))))));
     }
 };
 AfIllustratedCard.style = afIllustratedCardCss;

package/dist/cjs/af-image.cjs.entry.js CHANGED Viewed

@@ -1,6 +1,6 @@
 'use strict';
-var index = require('./index-ybEiHT0b.js');
+var index = require('./index-n-fnurTP.js');
 const afImageCss = ".sc-af-image-h{display:block;width:100%}.image-container.sc-af-image{position:relative;border-radius:var(--radius-md, 12px);overflow:hidden}.image.sc-af-image{display:block;width:100%;height:auto;object-fit:cover}.image-border.sc-af-image{position:absolute;inset:0;border-radius:var(--radius-md, 12px);box-shadow:inset 0 0 0 1px var(--af-background-border-subtle, rgba(0, 0, 0, 0.08));pointer-events:none}";
@@ -9,7 +9,7 @@ const AfImage = class {
         index.registerInstance(this, hostRef);
     }
     render() {
-        return (index.h(index.Host, { key: 'dd1304f9c9c6c757638ddd67ee312534819e9e48' }, index.h("div", { key: '4ecbd48548404ecf0839eb15fef64dcb7b2d0757', class: "image-container" }, index.h("img", { key: '73d9d87b21b3aec12f708f19a83f91622b5bb896', src: this.src, alt: this.alt, class: "image" }), index.h("div", { key: 'e54f1dbc2ec4976056e58a570420fd3f772907cf', class: "image-border", "aria-hidden": "true" }))));
+        return (index.h(index.Host, { key: '96f56008e769e15ec20399b2911563a7be1561b9' }, index.h("div", { key: 'a4b7eb695f4a7074e657f5cfb947a472f3bf9ae9', class: "image-container" }, index.h("img", { key: 'fcd9e6ca93ea345cf7a94a895b5161c79c9fe776', src: this.src, alt: this.alt, class: "image" }), index.h("div", { key: 'cee231a0d19312cc4659da8707d3e31955dcad18', class: "image-border", "aria-hidden": "true" }))));
     }
 };
 AfImage.style = afImageCss;

package/dist/cjs/af-in-page-banner.cjs.entry.js CHANGED Viewed

@@ -1,6 +1,6 @@
 'use strict';
-var index = require('./index-ybEiHT0b.js');
+var index = require('./index-n-fnurTP.js');
 const afInPageBannerCss = ".sc-af-in-page-banner-h{display:block;width:100%}.banner.sc-af-in-page-banner{position:relative;display:flex;align-items:center;gap:40px;padding-left:40px;padding-right:148px;padding-top:0;padding-bottom:0;border-radius:var(--radii-card-level-1, 32px);overflow:hidden;max-width:1280px;width:100%}.banner.theme-mist-green.sc-af-in-page-banner{background-color:var(--colour-brand-mist-green, #c6d5d1);--banner-heading-color:var(--colour-brand-inkwell, #14343b);--banner-body-color:var(--colour-inkwell-400, #2b484f);--af-button-primary-bg:var(--colour-brand-ice, #a6fffb);--af-button-primary-bg-hover:var(--colour-ice-600, #95e6e2);--af-button-primary-text:var(--colour-brand-inkwell, #14343b);--af-button-primary-stroke:var(--colour-brand-inkwell, #14343b);--af-button-secondary-text:var(--colour-brand-inkwell, #14343b);--af-button-secondary-stroke:var(--colour-brand-inkwell, #14343b)}.banner.theme-inkwell.sc-af-in-page-banner{background-color:var(--colour-brand-inkwell, #14343b);--banner-heading-color:var(--colour-brand-mist-green, #c6d5d1);--banner-body-color:var(--colour-inkwell-100, #d0d6d8);--af-button-primary-bg:var(--colour-brand-ice, #a6fffb);--af-button-primary-bg-hover:var(--colour-ice-600, #95e6e2);--af-button-primary-text:var(--colour-brand-inkwell, #14343b);--af-button-primary-stroke:var(--colour-brand-inkwell, #14343b);--af-button-secondary-text:var(--colour-brand-white, #ffffff);--af-button-secondary-stroke:var(--colour-brand-white, #ffffff)}.banner.theme-soft-clay.sc-af-in-page-banner{background-color:var(--colour-softclay-400, #c0ab8d);--banner-heading-color:var(--colour-brand-inkwell, #14343b);--banner-body-color:var(--colour-inkwell-450, #203e45);--af-button-primary-bg:var(--colour-brand-ice, #a6fffb);--af-button-primary-bg-hover:var(--colour-ice-600, #95e6e2);--af-button-primary-text:var(--colour-brand-inkwell, #14343b);--af-button-primary-stroke:var(--colour-brand-inkwell, #14343b);--af-button-secondary-text:var(--colour-brand-inkwell, #14343b);--af-button-secondary-stroke:var(--colour-brand-inkwell, #14343b)}.banner.theme-white-ivory.sc-af-in-page-banner{background-color:var(--colour-brand-ivory-paper, #fff9ee);--banner-heading-color:var(--colour-brand-inkwell, #14343b);--banner-body-color:var(--colour-inkwell-400, #2b484f);--af-button-primary-bg:var(--colour-brand-ice, #a6fffb);--af-button-primary-bg-hover:var(--colour-ice-600, #95e6e2);--af-button-primary-text:var(--colour-brand-inkwell, #14343b);--af-button-primary-stroke:var(--colour-brand-inkwell, #14343b);--af-button-secondary-text:var(--colour-brand-inkwell, #14343b);--af-button-secondary-stroke:var(--colour-brand-inkwell, #14343b)}.banner__wave-overlay.sc-af-in-page-banner{position:absolute;bottom:-17px;right:-156px;width:521px;height:323px;pointer-events:none;z-index:0}.banner__wave-svg.sc-af-in-page-banner{width:100%;height:100%}.banner.theme-mist-green.sc-af-in-page-banner .banner__wave-overlay.sc-af-in-page-banner{color:#d1ddda}.banner.theme-inkwell.sc-af-in-page-banner .banner__wave-overlay.sc-af-in-page-banner{color:rgba(255, 255, 255, 0.06)}.banner.theme-soft-clay.sc-af-in-page-banner .banner__wave-overlay.sc-af-in-page-banner{color:rgba(20, 52, 59, 0.06)}.banner.theme-white-ivory.sc-af-in-page-banner .banner__wave-overlay.sc-af-in-page-banner{color:rgba(20, 52, 59, 0.04)}.banner__illustration.sc-af-in-page-banner{position:relative;z-index:1;flex-shrink:0;display:flex;align-items:center;justify-content:center;width:360px;height:360px;max-width:360px;max-height:360px;aspect-ratio:1}.banner__illustration-img.sc-af-in-page-banner{width:100%;height:100%;object-fit:contain}.banner__illustration.sc-af-in-page-banner-s>*,.banner__illustration .sc-af-in-page-banner-s>*{width:100%;height:100%;object-fit:contain}.banner__content.sc-af-in-page-banner{position:relative;z-index:1;flex:1 1 0;min-width:0;min-height:0;display:flex;flex-direction:column;gap:40px;padding-top:var(--margins-margin-tb-tight, 48px);padding-bottom:var(--margins-margin-tb-tight, 48px);padding-right:0;padding-left:0}.banner__copy.sc-af-in-page-banner{display:flex;flex-direction:column;gap:16px;max-width:840px;width:100%;white-space:pre-wrap}.banner__heading.sc-af-in-page-banner{font-family:var(--typography-primaryfont, 'NeuSans', sans-serif);font-weight:var(--typography-headingweight, 500);font-size:44px;line-height:1;letter-spacing:-0.88px;color:var(--banner-heading-color, var(--colour-brand-inkwell, #14343b));margin:0;white-space:pre-wrap}.banner__description.sc-af-in-page-banner{font-family:var(--typography-primaryfont, 'NeuSans', sans-serif);font-weight:var(--typography-bodyweight, 400);font-size:18px;line-height:26px;color:var(--banner-body-color, var(--colour-inkwell-400, #2b484f));margin:0;white-space:pre-wrap}.banner__buttons.sc-af-in-page-banner{display:flex;flex-direction:row;gap:12px;align-items:flex-start}@media (max-width: 768px){.banner.sc-af-in-page-banner{flex-direction:column;align-items:stretch;padding:224px 0 0 0;border-radius:var(--radii-card-level-1-mobile, 24px);max-width:100%;min-height:auto}.banner__wave-overlay.sc-af-in-page-banner{display:none}.banner__illustration.sc-af-in-page-banner{position:absolute;top:12px;left:auto;right:0;transform:none;width:212px;height:212px;max-width:280px;max-height:280px}.banner__content.sc-af-in-page-banner{width:100%;min-height:320px;padding:16px 28px 48px 28px;gap:40px;flex:none}.banner__copy.sc-af-in-page-banner{max-width:100%}.banner__heading.sc-af-in-page-banner{font-size:32px;letter-spacing:-0.64px}.banner__buttons.sc-af-in-page-banner{flex-direction:column;align-items:stretch;gap:12px;width:100%}.banner__buttons.sc-af-in-page-banner{--af-button-width:100%}.banner__buttons.sc-af-in-page-banner af-button.sc-af-in-page-banner{display:block;width:100%}}@media (max-width: 480px){.banner.sc-af-in-page-banner{padding-top:200px}.banner__illustration.sc-af-in-page-banner{right:0;width:180px;height:180px}.banner__content.sc-af-in-page-banner{padding:16px 20px 36px 20px;min-height:280px}.banner__heading.sc-af-in-page-banner{font-size:28px;letter-spacing:-0.56px}}";
@@ -38,7 +38,7 @@ const AfInPageBanner = class {
         return (index.h("div", { class: "banner__wave-overlay", "aria-hidden": "true" }, index.h("svg", { viewBox: "0 0 521 323", fill: "none", xmlns: "http://www.w3.org/2000/svg", class: "banner__wave-svg" }, index.h("path", { d: "M473.775 46.273C443.539 15.92 403.701 -0.631616 361.351 0.0184478H154.183L112.67 67.225H361.893C362.189 67.225 362.533 67.225 362.829 67.225C387.155 67.225 410.004 76.7259 427.289 94.0776C445.017 111.879 454.816 135.682 454.816 161.134C454.816 213.389 412.959 255.843 361.548 255.843H108.041C84.9457 255.843 66.1345 236.742 66.1345 213.289C66.1345 189.837 84.9949 170.435 107.992 169.735H334.957L377.799 102.528H106.859C47.9636 104.029 0 153.683 0 213.289C0 272.895 48.456 323 108.041 323H361.548C449.449 323 521 250.343 521 161.084C521 117.53 504.257 76.7759 473.824 46.2229L473.775 46.273Z", fill: "currentColor" }))));
     }
     render() {
-        return (index.h(index.Host, { key: '41403ba6ca0b60c416dd41d81f1eedbfe566f5c4' }, index.h("div", { key: '0c68549f2f1664d676fd969500702ccb8d4e43f5', class: `banner theme-${this.theme}` }, this.showWaveDecoration && this.renderWaveOverlay(), index.h("div", { key: '213397e65a87e0999f857af1201219ec1987c5b1', class: "banner__illustration" }, this.illustrationUrl ? (index.h("img", { src: this.illustrationUrl, alt: "", class: "banner__illustration-img", loading: "lazy" })) : (index.h("slot", { name: "illustration" }))), index.h("div", { key: '972c0ba5f99a8cc22bb9bf04402ee6f7feabb6be', class: "banner__content" }, index.h("div", { key: '659301eefed48b4abdfaaafa2c4db3fe242703fc', class: "banner__copy" }, this.heading && (index.h("h2", { key: 'aa4e2b0acf38d149b302c573da7e8f5bf097b846', class: "banner__heading" }, this.heading)), this.description && (index.h("p", { key: 'e0bb0b75f31b1a3c5bb0c61e48521a3ee0085f6e', class: "banner__description" }, this.description))), (this.primaryButtonText || this.secondaryButtonText) && (index.h("div", { key: '8a029743425b837cc8275eea38a1313366add6ec', class: "banner__buttons" }, this.primaryButtonText && (index.h("af-button", { key: '9a237dc0b9c4165c7b96ba526aae791b8504941e', href: this.primaryButtonUrl, variant: "primary" }, this.primaryButtonText)), this.secondaryButtonText && (index.h("af-button", { key: 'a9ab21d4efa1f68061b64f6e64c1da2d179eb0d2', href: this.secondaryButtonUrl, variant: "secondary" }, this.secondaryButtonText))))))));
+        return (index.h(index.Host, { key: '382549642707642ba3182f7bf4391e3254a6cf8e' }, index.h("div", { key: '0d144e64a93e5222c426d0b9d0379a1318538972', class: `banner theme-${this.theme}` }, this.showWaveDecoration && this.renderWaveOverlay(), index.h("div", { key: 'f82845be709ec7e98b84dd5e65f5eb67473c13bb', class: "banner__illustration" }, this.illustrationUrl ? (index.h("img", { src: this.illustrationUrl, alt: "", class: "banner__illustration-img", loading: "lazy" })) : (index.h("slot", { name: "illustration" }))), index.h("div", { key: '73c35ca159f9588ac8fb9c8941ec43ea5ffa0b7a', class: "banner__content" }, index.h("div", { key: '5cab358c648677515bb9bf8f8594d2e37c43af89', class: "banner__copy" }, this.heading && (index.h("h2", { key: 'f0bbe316c200bbf7e6a5406f3e089c0a839e7709', class: "banner__heading" }, this.heading)), this.description && (index.h("p", { key: 'c6a0f293b2eb35489ed97d32ed162791a9087a2d', class: "banner__description" }, this.description))), (this.primaryButtonText || this.secondaryButtonText) && (index.h("div", { key: '87cff6182bb7de438ba7393ae308aaf0fba09814', class: "banner__buttons" }, this.primaryButtonText && (index.h("af-button", { key: 'b3f3c97a10e8571fbbf9ebd20c6773303dc90b18', href: this.primaryButtonUrl, variant: "primary" }, this.primaryButtonText)), this.secondaryButtonText && (index.h("af-button", { key: 'efae95eebae4dc6401bff0c1219c376f7c7d73a5', href: this.secondaryButtonUrl, variant: "secondary" }, this.secondaryButtonText))))))));
     }
 };
 AfInPageBanner.style = afInPageBannerCss;