/* ==========================================================================
   ShopMedX Main Stylesheet
   ========================================================================== */

:root {
	--color-primary: #005bb5;
	--color-primary-dark: #004a94;
	--color-primary-light: #e6f0fa;
	--color-navy: #0c3664;
	--color-navy-light: #08284d;
	--color-accent-red: #dc2626;
	--color-bg: #f8fafc;
	--color-white: #ffffff;
	--color-text: #1e293b;
	--color-text-muted: #64748b;
	--color-border: #e2e8f0;
	--color-success: #16a34a;
	--font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	--container-max: 1440px;
	--container-padding: 1.25rem;
	--radius-sm: 6px;
	--radius-md: 10px;
	--radius-lg: 16px;
	--shadow-sm: 0 1px 3px rgba(3, 32, 66, 0.08);
	--shadow-md: 0 4px 16px rgba(3, 32, 66, 0.1);
	--shadow-lg: 0 8px 32px rgba(3, 32, 66, 0.12);
	--transition: 0.2s ease;
	--header-height: 72px;
}

/* --------------------------------------------------------------------------
   Reset & Base
   -------------------------------------------------------------------------- */

*,
*::before,
*::after {
	box-sizing: border-box;
}

html {
	scroll-behavior: smooth;
	-webkit-text-size-adjust: 100%;
}

body {
	margin: 0;
	font-family: var(--font-family);
	font-size: 1rem;
	line-height: 1.6;
	color: var(--color-text);
	background-color: var(--color-bg);
	-webkit-font-smoothing: antialiased;
}

img,
svg {
	max-width: 100%;
	height: auto;
	display: block;
}

a {
	color: var(--color-primary);
	text-decoration: none;
	transition: color var(--transition);
}

a:hover {
	color: var(--color-primary-dark);
}

h1, h2, h3, h4, h5, h6 {
	margin: 0 0 0.5em;
	line-height: 1.25;
	color: var(--color-navy);
	font-weight: 700;
}

p {
	margin: 0 0 1em;
}

ul, ol {
	margin: 0;
	padding: 0;
	list-style: none;
}

button,
input,
select,
textarea {
	font-family: inherit;
	font-size: inherit;
}

/* --------------------------------------------------------------------------
   Accessibility
   -------------------------------------------------------------------------- */

.screen-reader-text {
	border: 0;
	clip: rect(1px, 1px, 1px, 1px);
	clip-path: inset(50%);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute;
	width: 1px;
	word-wrap: normal !important;
}

.screen-reader-text:focus,
.shopmedx-skip-link:focus {
	background-color: var(--color-primary);
	clip: auto !important;
	clip-path: none;
	color: var(--color-white);
	display: block;
	font-size: 0.875rem;
	font-weight: 600;
	height: auto;
	left: 0.5rem;
	line-height: normal;
	padding: 0.75rem 1.25rem;
	position: fixed;
	top: 0.5rem;
	width: auto;
	z-index: 100000;
	border-radius: var(--radius-sm);
	text-decoration: none;
}

/* --------------------------------------------------------------------------
   Layout
   -------------------------------------------------------------------------- */

.shopmedx-site {
	display: flex;
	flex-direction: column;
	min-height: 100vh;
}

.shopmedx-main {
	flex: 1;
}

.shopmedx-container {
	width: 100%;
	max-width: var(--container-max);
	margin-inline: auto;
	padding-inline: var(--container-padding);
}

.shopmedx-card {
	background: var(--color-white);
	border: 1px solid var(--color-border);
	border-radius: var(--radius-lg);
	padding: 1.5rem;
	box-shadow: var(--shadow-sm);
}

/* --------------------------------------------------------------------------
   Buttons
   -------------------------------------------------------------------------- */

.shopmedx-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.5rem;
	padding: 0.75rem 1.5rem;
	font-size: 0.9375rem;
	font-weight: 600;
	line-height: 1.4;
	border-radius: var(--radius-md);
	border: 2px solid transparent;
	cursor: pointer;
	transition: background var(--transition), color var(--transition), border-color var(--transition), box-shadow var(--transition);
	text-decoration: none;
	white-space: nowrap;
}

.shopmedx-btn--primary {
	background: var(--color-primary);
	color: var(--color-white);
	border-color: var(--color-primary);
}

.shopmedx-btn--primary:hover {
	background: var(--color-primary-dark);
	border-color: var(--color-primary-dark);
	color: var(--color-white);
}

.shopmedx-btn--outline {
	background: transparent;
	color: var(--color-primary);
	border-color: var(--color-primary);
}

.shopmedx-btn--outline:hover {
	background: var(--color-primary-light);
	color: var(--color-primary-dark);
}

.shopmedx-btn--ghost {
	background: transparent;
	color: var(--color-text);
	border-color: var(--color-border);
}

.shopmedx-btn--ghost:hover {
	background: var(--color-bg);
	border-color: var(--color-text-muted);
}

.shopmedx-btn--white {
	background: var(--color-white);
	color: var(--color-navy);
	border-color: var(--color-white);
}

.shopmedx-btn--white:hover {
	background: var(--color-bg);
	color: var(--color-navy);
}

.shopmedx-btn--outline-white {
	background: transparent;
	color: var(--color-white);
	border-color: rgba(255, 255, 255, 0.6);
}

.shopmedx-btn--outline-white:hover {
	background: rgba(255, 255, 255, 0.1);
	border-color: var(--color-white);
	color: var(--color-white);
}

.shopmedx-btn--pill {
	border-radius: 999px;
}

.shopmedx-link {
	color: var(--color-primary);
	font-weight: 500;
	font-size: 0.9375rem;
}

.shopmedx-link:hover {
	text-decoration: underline;
}

/* --------------------------------------------------------------------------
   Header – Tier 1: Top Bar
   -------------------------------------------------------------------------- */

.shopmedx-header {
	position: sticky;
	top: 0;
	z-index: 1000;
	background: var(--color-white);
	box-shadow: var(--shadow-sm);
}

.shopmedx-top-bar {
	background: var(--color-navy);
	color: rgba(255, 255, 255, 0.9);
	font-size: 0.8125rem;
}

.shopmedx-top-bar__inner {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
	align-items: center;
	gap: 1rem;
	padding-block: 0.5625rem;
}

.shopmedx-top-bar__left,
.shopmedx-top-bar__center,
.shopmedx-top-bar__right {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	min-width: 0;
}

.shopmedx-top-bar__left {
	justify-self: start;
}

.shopmedx-top-bar__center {
	justify-self: center;
	text-align: center;
	white-space: nowrap;
}

.shopmedx-top-bar__right {
	justify-self: end;
	justify-content: flex-end;
	gap: 1rem;
	flex-wrap: nowrap;
}

.shopmedx-top-bar__icon {
	width: 1rem;
	height: 1rem;
	flex-shrink: 0;
}

.shopmedx-top-bar__link {
	color: rgba(255, 255, 255, 0.95);
	font-weight: 500;
}

.shopmedx-top-bar__link:hover {
	color: var(--color-white);
	text-decoration: underline;
}

.shopmedx-top-bar__contact {
	display: inline-flex;
	align-items: center;
	gap: 0.375rem;
	color: rgba(255, 255, 255, 0.85);
}

.shopmedx-top-bar__contact:hover {
	color: var(--color-white);
}

/* --------------------------------------------------------------------------
   Header – Tier 2: Main Header
   -------------------------------------------------------------------------- */

.shopmedx-main-header {
	border-bottom: 1px solid var(--color-border);
}

.shopmedx-main-header__inner {
	display: grid;
	grid-template-columns: auto minmax(0, 1fr) auto;
	align-items: center;
	gap: 1.25rem 2rem;
	padding-block: 0.875rem 1rem;
}

.shopmedx-logo {
	display: flex;
	align-items: center;
	gap: 0.625rem;
	text-decoration: none;
	flex-shrink: 0;
	min-width: 0;
}

.shopmedx-logo__mark {
	width: 2.75rem;
	height: 2.2rem;
	flex-shrink: 0;
}

.shopmedx-logo__image {
	max-height: 64px;
	width: auto;
	height: auto;
	display: block;
}

.shopmedx-logo__text {
	display: flex;
	flex-direction: column;
	line-height: 1.2;
}

.shopmedx-logo__brand {
	font-size: 1.375rem;
	font-weight: 800;
	color: var(--color-navy);
	letter-spacing: -0.02em;
}

.shopmedx-logo__x {
	color: var(--color-accent-red);
}

.shopmedx-logo__tagline {
	font-size: 0.6875rem;
	color: var(--color-text-muted);
	font-weight: 500;
}

.shopmedx-search {
	position: relative;
	justify-self: center;
	width: min(100%, 34rem);
	max-width: 34rem;
}

.shopmedx-search__form {
	display: flex;
	align-items: stretch;
	min-height: 2.75rem;
	border: 2px solid var(--color-border);
	border-radius: var(--radius-md);
	overflow: hidden;
	background: var(--color-bg);
	transition: border-color var(--transition);
}

.shopmedx-search__form:focus-within {
	border-color: var(--color-primary);
	background: var(--color-white);
}

.shopmedx-search__input {
	flex: 1;
	border: none;
	background: transparent;
	padding: 0.625rem 1rem;
	outline: none;
	min-width: 0;
}

.shopmedx-search__button {
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 0 1rem;
	background: var(--color-primary);
	color: var(--color-white);
	border: none;
	cursor: pointer;
	transition: background var(--transition);
}

.shopmedx-search__button:hover {
	background: var(--color-primary-dark);
}

.shopmedx-search__icon {
	width: 1.25rem;
	height: 1.25rem;
}

.shopmedx-search__results {
	position: absolute;
	top: calc(100% + 4px);
	left: 0;
	right: 0;
	background: var(--color-white);
	border: 1px solid var(--color-border);
	border-radius: var(--radius-md);
	box-shadow: var(--shadow-lg);
	max-height: 360px;
	overflow-y: auto;
	z-index: 100;
}

.shopmedx-search__results:not([hidden]) {
	display: block;
}

.shopmedx-search__result-item {
	display: flex;
	align-items: center;
	gap: 0.75rem;
	padding: 0.75rem 1rem;
	border-bottom: 1px solid var(--color-border);
	color: var(--color-text);
	text-decoration: none;
	transition: background var(--transition);
}

.shopmedx-search__result-item:last-child {
	border-bottom: none;
}

.shopmedx-search__result-item:hover,
.shopmedx-search__result-item.is-active {
	background: var(--color-primary-light);
}

.shopmedx-search__result-item img {
	width: 48px;
	height: 48px;
	object-fit: cover;
	border-radius: var(--radius-sm);
	flex-shrink: 0;
}

.shopmedx-search__result-info {
	flex: 1;
	min-width: 0;
}

.shopmedx-search__result-name {
	font-weight: 600;
	font-size: 0.875rem;
	color: var(--color-navy);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.shopmedx-search__result-price {
	font-size: 0.8125rem;
	color: var(--color-primary);
	font-weight: 600;
}

.shopmedx-search__result-empty,
.shopmedx-search__result-loading {
	padding: 1rem;
	text-align: center;
	color: var(--color-text-muted);
	font-size: 0.875rem;
}

.shopmedx-header-actions {
	display: flex;
	align-items: flex-start;
	justify-content: flex-end;
	gap: 0.375rem;
	flex-shrink: 0;
}

.shopmedx-header-tools {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: 0.125rem;
	flex-shrink: 0;
	justify-self: end;
}

.shopmedx-header-action {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: flex-start;
	gap: 0.25rem;
	min-width: 4.5rem;
	padding: 0.25rem 0.375rem;
	color: var(--color-text);
	font-size: 0.6875rem;
	font-weight: 600;
	line-height: 1.2;
	text-decoration: none;
	border-radius: var(--radius-sm);
	transition: background var(--transition), color var(--transition);
}

.shopmedx-header-action:hover {
	background: var(--color-bg);
	color: var(--color-primary);
}

.shopmedx-header-action__graphic {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 2rem;
	height: 2rem;
	flex-shrink: 0;
}

.shopmedx-header-action__icon {
	width: 1.375rem;
	height: 1.375rem;
}

.shopmedx-header-action__label {
	display: block;
	text-align: center;
	max-width: 4.75rem;
}

.shopmedx-header-action--cart .shopmedx-cart-count {
	position: absolute;
	top: -0.125rem;
	right: -0.25rem;
	background: var(--color-accent-red);
	color: var(--color-white);
	font-size: 0.625rem;
	font-weight: 700;
	min-width: 1.125rem;
	height: 1.125rem;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	line-height: 1;
	padding: 0 0.125rem;
}

.shopmedx-mobile-toggle {
	display: none;
	flex-direction: column;
	justify-content: center;
	gap: 5px;
	width: 44px;
	height: 44px;
	padding: 0.5rem;
	background: none;
	border: none;
	cursor: pointer;
	border-radius: var(--radius-sm);
}

.shopmedx-mobile-toggle__bar {
	display: block;
	width: 100%;
	height: 2px;
	background: var(--color-navy);
	border-radius: 2px;
	transition: transform var(--transition), opacity var(--transition);
}

.shopmedx-mobile-toggle[aria-expanded="true"] .shopmedx-mobile-toggle__bar:nth-child(1) {
	transform: translateY(7px) rotate(45deg);
}

.shopmedx-mobile-toggle[aria-expanded="true"] .shopmedx-mobile-toggle__bar:nth-child(2) {
	opacity: 0;
}

.shopmedx-mobile-toggle[aria-expanded="true"] .shopmedx-mobile-toggle__bar:nth-child(3) {
	transform: translateY(-7px) rotate(-45deg);
}

/* --------------------------------------------------------------------------
   Header – Tier 3: Primary Nav
   -------------------------------------------------------------------------- */

.shopmedx-nav {
	background: var(--color-white);
	border-bottom: 1px solid var(--color-border);
}

.shopmedx-nav .shopmedx-container {
	display: flex;
	align-items: center;
	min-height: 3rem;
}

.shopmedx-primary-menu {
	display: flex;
	align-items: center;
	gap: 2.125rem;
	width: 100%;
	justify-content: center;
}

.shopmedx-primary-menu > li {
	position: relative;
	display: flex;
	align-items: center;
}

.shopmedx-nav-link {
	display: inline-flex;
	align-items: center;
	gap: 0.375rem;
	padding: 0.625rem 0.875rem;
	color: var(--color-text);
	font-size: 0.875rem;
	font-weight: 600;
	text-decoration: none;
	transition: color var(--transition), background var(--transition);
	white-space: nowrap;
	line-height: 1.2;
}

.shopmedx-primary-menu > li:first-child > .shopmedx-nav-link {
	padding-left: 0;
}

.shopmedx-nav-link:hover,
.shopmedx-primary-menu > li.current-menu-item > .shopmedx-nav-link,
.shopmedx-primary-menu > li.current-menu-ancestor > .shopmedx-nav-link {
	color: var(--color-primary);
}

.shopmedx-nav-link--business {
	background: var(--color-primary);
	color: var(--color-white) !important;
	border-radius: var(--radius-sm);
	padding: 0.4375rem 0.875rem;
	margin-left: 0.25rem;
}

.shopmedx-nav-link--business:hover {
	background: var(--color-primary-dark);
}

.shopmedx-menu-item--active-business > .shopmedx-nav-link--business {
	background: var(--color-navy);
}

.shopmedx-nav-chevron {
	width: 0.875rem;
	height: 0.875rem;
	transition: transform var(--transition);
}

.menu-item-has-children.is-open > a .shopmedx-nav-chevron {
	transform: rotate(180deg);
}

.shopmedx-submenu {
	position: absolute;
	top: 100%;
	left: 0;
	min-width: 220px;
	background: var(--color-white);
	border: 1px solid var(--color-border);
	border-radius: var(--radius-md);
	box-shadow: var(--shadow-lg);
	padding: 0.5rem 0;
	opacity: 0;
	visibility: hidden;
	transform: translateY(8px);
	transition: opacity var(--transition), transform var(--transition), visibility var(--transition);
	z-index: 50;
}

.menu-item-has-children.is-open > .shopmedx-submenu,
.menu-item-has-children:hover > .shopmedx-submenu {
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
}

.shopmedx-submenu .shopmedx-nav-link {
	padding: 0.625rem 1.25rem;
	font-size: 0.875rem;
}

/* --------------------------------------------------------------------------
   Footer
   -------------------------------------------------------------------------- */

.shopmedx-footer {
	background: var(--color-navy);
	color: rgba(255, 255, 255, 0.85);
	padding-block: 3rem 0;
	margin-top: auto;
}

.shopmedx-footer__grid {
	display: grid;
	grid-template-columns: 1.5fr repeat(4, 1fr);
	gap: 2rem;
	padding-bottom: 2.5rem;
	border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.shopmedx-footer__logo {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	text-decoration: none;
	margin-bottom: 1rem;
	max-width: 220px;
}

.shopmedx-footer__logo-image {
	max-height: 52px;
	width: auto;
	height: auto;
	display: block;
	object-fit: contain;
}

.shopmedx-footer__logo-mark {
	width: 2rem;
	height: 1.6rem;
	flex-shrink: 0;
}

.shopmedx-footer__logo-text {
	font-size: 1.125rem;
	font-weight: 800;
	color: var(--color-white);
	line-height: 1.1;
}

.shopmedx-footer__logo-dotcom {
	font-weight: 400;
	opacity: 0.7;
}

.shopmedx-footer__tagline {
	font-size: 0.875rem;
	line-height: 1.6;
	color: rgba(255, 255, 255, 0.7);
	margin-bottom: 1.25rem;
	max-width: 280px;
}

.shopmedx-footer__social {
	display: flex;
	gap: 0.625rem;
}

.shopmedx-footer__social-link {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.1);
	color: var(--color-white);
	font-size: 0.75rem;
	font-weight: 700;
	transition: background var(--transition);
}

.shopmedx-footer__social-link:hover {
	background: var(--color-primary);
	color: var(--color-white);
}

.shopmedx-footer__heading {
	font-size: 0.875rem;
	font-weight: 700;
	color: var(--color-white);
	text-transform: uppercase;
	letter-spacing: 0.05em;
	margin-bottom: 1rem;
}

.shopmedx-footer-menu li {
	margin-bottom: 0.5rem;
}

.shopmedx-footer-menu a {
	color: rgba(255, 255, 255, 0.7);
	font-size: 0.875rem;
	transition: color var(--transition);
}

.shopmedx-footer-menu a:hover {
	color: var(--color-white);
}

.shopmedx-footer__bottom {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 1rem;
	padding-block: 1.25rem;
	font-size: 0.8125rem;
	color: rgba(255, 255, 255, 0.6);
}

.shopmedx-footer__secure {
	display: flex;
	align-items: center;
	gap: 0.375rem;
	margin: 0;
}

.shopmedx-footer__secure-icon {
	width: 1rem;
	height: 1rem;
}

.shopmedx-footer__payments {
	display: flex;
	gap: 0.75rem;
}

.shopmedx-footer__payments span {
	padding: 0.25rem 0.5rem;
	background: rgba(255, 255, 255, 0.08);
	border-radius: var(--radius-sm);
	font-size: 0.6875rem;
	font-weight: 600;
}

/* --------------------------------------------------------------------------
   Section Header
   -------------------------------------------------------------------------- */

.shopmedx-section-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	margin-bottom: 1.5rem;
	flex-wrap: wrap;
}

.shopmedx-section-header__title {
	font-size: 1.25rem;
	margin: 0;
	font-weight: 800;
}

.shopmedx-section-header__actions {
	display: flex;
	align-items: center;
	gap: 1rem;
}

.shopmedx-section-header__link {
	font-weight: 600;
	font-size: 0.9375rem;
	color: var(--color-primary);
}

/* --------------------------------------------------------------------------
   Hero
   -------------------------------------------------------------------------- */

.shopmedx-hero {
	padding-block: 3rem 2.5rem;
	background: linear-gradient(180deg, rgba(239, 246, 255, 0.55) 0%, #ffffff 45%, var(--color-bg) 100%);
	overflow: hidden;
}

.shopmedx-hero__grid {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr);
	gap: 2.5rem 3rem;
	align-items: center;
}

.shopmedx-hero__media {
	position: relative;
	display: flex;
	justify-content: flex-end;
	align-items: center;
	width: 100%;
}

.shopmedx-hero__image {
	border-radius: var(--radius-lg);
	box-shadow: var(--shadow-lg);
	width: 100%;
	max-width: 42rem;
	aspect-ratio: 4 / 3;
	object-fit: cover;
}

/* Hero default illustration */
.shopmedx-hero-visual {
	width: 100%;
	max-width: 42rem;
	margin-left: auto;
}

.shopmedx-hero-visual__frame {
	aspect-ratio: 4 / 3;
	border-radius: var(--radius-lg);
	background: linear-gradient(135deg, rgba(219, 234, 254, 0.45) 0%, rgba(240, 249, 255, 0.75) 55%, #ffffff 100%);
	border: 1px solid rgba(191, 219, 254, 0.8);
	box-shadow: var(--shadow-lg);
	padding: 1.5rem;
	overflow: hidden;
}

.shopmedx-hero-visual__frame--slider-only {
	display: block;
	padding: 0;
	position: relative;
}

.shopmedx-hero-visual__frame--slider-only .shopmedx-hero-slider {
	position: absolute;
	inset: 0;
	min-height: 100%;
}

.shopmedx-hero-visual__frame--split {
	display: flex;
	flex-direction: column;
	padding: 0;
	overflow: hidden;
}

.shopmedx-hero-slider {
	position: relative;
	width: 100%;
	height: 100%;
	min-height: 100%;
	background: linear-gradient(180deg, rgba(219, 234, 254, 0.35) 0%, rgba(240, 249, 255, 0.6) 100%);
	overflow: hidden;
}

.shopmedx-hero-visual__frame--slider-only .shopmedx-hero-slider {
	border-bottom: none;
}

.shopmedx-hero-visual__frame--split .shopmedx-hero-slider {
	flex: 0 0 48%;
	min-height: 9.5rem;
	border-bottom: 1px solid rgba(191, 219, 254, 0.65);
}

.shopmedx-hero__title {
	font-size: clamp(2rem, 4vw, 3rem);
	font-weight: 800;
	color: var(--color-navy);
	margin-bottom: 0.125rem;
	line-height: 1.05;
	letter-spacing: -0.02em;
}

.shopmedx-hero__title-accent {
	font-size: clamp(1.75rem, 3.5vw, 2.75rem);
	font-weight: 800;
	color: var(--color-primary);
	margin-bottom: 1rem;
	line-height: 1.05;
	letter-spacing: -0.02em;
}

.shopmedx-hero__description {
	font-size: 0.9375rem;
	color: var(--color-text-muted);
	max-width: 32rem;
	margin-bottom: 1.25rem;
	line-height: 1.65;
}

.shopmedx-hero__actions {
	display: flex;
	flex-wrap: wrap;
	gap: 0.75rem;
	margin-bottom: 1.5rem;
}

.shopmedx-hero__chips {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 0.75rem;
	padding-top: 1.5rem;
	border-top: 1px solid rgba(226, 232, 240, 0.9);
}

.shopmedx-hero__chip {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	padding: 0;
	background: transparent;
	border-radius: 0;
	box-shadow: none;
}

.shopmedx-hero__chip-icon {
	width: 1.25rem;
	height: 1.25rem;
	color: var(--color-primary);
	flex-shrink: 0;
}

.shopmedx-hero__chip strong {
	display: block;
	font-size: 0.6875rem;
	color: var(--color-text);
}

.shopmedx-hero__chip span {
	font-size: 0.625rem;
	color: var(--color-text-muted);
}

.shopmedx-hero--bg {
	position: relative;
	padding-block: 4rem 3rem;
	background: var(--color-white);
	overflow: hidden;
	min-height: min(42rem, 88vh);
	display: flex;
	align-items: center;
}

.shopmedx-hero--bg__media {
	position: absolute;
	inset: 0;
	z-index: 0;
}

.shopmedx-hero--bg__image {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center right;
}

.shopmedx-hero--bg__overlay {
	position: absolute;
	inset: 0;
	z-index: 1;
	background: linear-gradient(
		90deg,
		rgba(255, 255, 255, 0.98) 0%,
		rgba(255, 255, 255, 0.94) 34%,
		rgba(255, 255, 255, 0.72) 52%,
		rgba(255, 255, 255, 0.18) 72%,
		rgba(255, 255, 255, 0) 100%
	);
	pointer-events: none;
}

.shopmedx-hero--bg__inner {
	position: relative;
	z-index: 2;
	width: 100%;
}

.shopmedx-hero--bg .shopmedx-hero__content {
	max-width: 36rem;
}

.shopmedx-hero-slider--empty {
	background: linear-gradient(180deg, rgba(219, 234, 254, 0.35) 0%, rgba(240, 249, 255, 0.6) 100%);
	min-height: 12rem;
}

.shopmedx-hero-slider__track {
	position: relative;
	width: 100%;
	height: 100%;
}

.shopmedx-hero-slider__slide {
	position: absolute;
	inset: 0;
	opacity: 0;
	transition: opacity 0.7s ease;
	pointer-events: none;
}

.shopmedx-hero-slider__slide.is-active {
	opacity: 1;
	pointer-events: auto;
	z-index: 1;
}

.shopmedx-hero-slider__image {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.shopmedx-hero-slider__dots {
	position: absolute;
	left: 50%;
	bottom: 1rem;
	transform: translateX(-50%);
	display: flex;
	align-items: center;
	gap: 0.5rem;
	z-index: 2;
	padding: 0.375rem 0.625rem;
	background: rgba(255, 255, 255, 0.85);
	border-radius: 999px;
	backdrop-filter: blur(4px);
}

.shopmedx-hero-slider__dot {
	width: 0.5rem;
	height: 0.5rem;
	border-radius: 999px;
	border: none;
	padding: 0;
	background: rgba(255, 255, 255, 0.65);
	box-shadow: 0 0 0 1px rgba(12, 54, 100, 0.12);
	cursor: pointer;
	transition: transform var(--transition), background var(--transition);
}

.shopmedx-hero-slider__dot.is-active {
	background: var(--color-primary);
	transform: scale(1.15);
}

.shopmedx-hero-visual__frame--split .shopmedx-hero-visual__scene {
	flex: 1;
	min-height: 0;
	padding: 1rem 1.25rem 1.25rem;
}

.shopmedx-hero-visual__scene {
	position: relative;
	width: 100%;
	height: 100%;
	min-height: 220px;
}

.shopmedx-hero-visual__product {
	position: absolute;
}

.shopmedx-hero-visual__box,
.shopmedx-hero-visual__bottle,
.shopmedx-hero-visual__canister,
.shopmedx-hero-visual__mask,
.shopmedx-hero-visual__thermo {
	background: #fff;
	border: 1px solid #bfdbfe;
	border-radius: 0.625rem;
	box-shadow: 0 4px 14px rgba(12, 54, 100, 0.08);
	padding: 0.5rem 0.625rem;
}

.shopmedx-hero-visual__brand {
	font-size: 0.5rem;
	font-weight: 700;
	color: var(--color-navy);
}

.shopmedx-hero-visual__brand-x {
	color: var(--color-accent-red);
}

.shopmedx-hero-visual__label {
	display: inline-block;
	margin-top: 0.25rem;
	padding: 0.125rem 0.375rem;
	border-radius: 0.25rem;
	background: var(--color-primary);
	color: #fff;
	font-size: 0.5rem;
	font-weight: 700;
}

.shopmedx-hero-visual__label--sky {
	background: #0ea5e9;
}

.shopmedx-hero-visual__meta {
	font-size: 0.4375rem;
	color: var(--color-text-muted);
	margin-top: 0.125rem;
	font-weight: 600;
}

.shopmedx-hero-visual__meta--green {
	color: var(--color-success);
}

.shopmedx-hero-visual__count {
	display: flex;
	align-items: center;
	justify-content: space-between;
	font-size: 0.4375rem;
	color: var(--color-primary);
	font-weight: 700;
	margin-top: 0.25rem;
}

.shopmedx-hero-visual__count span {
	width: 0.875rem;
	height: 0.875rem;
	border-radius: 50%;
	background: var(--color-primary-light);
	display: inline-flex;
	align-items: center;
	justify-content: center;
}

.shopmedx-hero-visual__product--gloves-box {
	left: 0.5rem;
	bottom: 1rem;
	width: 44%;
	z-index: 1;
}

.shopmedx-hero-visual__glove {
	position: absolute;
	left: 28%;
	bottom: 2.5rem;
	width: 28%;
	z-index: 2;
	transform: rotate(-12deg);
}

.shopmedx-hero-visual__product--sanitizer {
	right: 28%;
	bottom: 1rem;
	width: 24%;
	z-index: 1;
}

.shopmedx-hero-visual__pump {
	width: 1.25rem;
	height: 0.5rem;
	background: #475569;
	border-radius: 0.125rem 0.125rem 0 0;
	margin: -0.75rem auto 0.25rem;
}

.shopmedx-hero-visual__product--wipes {
	right: 0.5rem;
	bottom: 2rem;
	width: 28%;
	z-index: 1;
}

.shopmedx-hero-visual__lid {
	width: 70%;
	height: 0.375rem;
	background: var(--color-primary);
	border-radius: 0.375rem 0.375rem 0 0;
	margin: -0.625rem auto 0.25rem;
}

.shopmedx-hero-visual__canister-title {
	font-size: 0.5rem;
	font-weight: 800;
	color: var(--color-navy);
	line-height: 1.2;
}

.shopmedx-hero-visual__canister-count {
	font-size: 0.5625rem;
	font-weight: 900;
	color: var(--color-primary);
}

.shopmedx-hero-visual__product--mask {
	left: 34%;
	bottom: 0.25rem;
	width: 36%;
	z-index: 3;
	transform: rotate(6deg);
}

.shopmedx-hero-visual__mask {
	background: #bae6fd;
	border-color: #38bdf8;
	padding: 0.375rem;
}

.shopmedx-hero-visual__mask span {
	display: block;
	height: 0.125rem;
	background: #7dd3fc;
	margin-bottom: 0.125rem;
	border-radius: 999px;
}

.shopmedx-hero-visual__mask-label {
	font-size: 0.4375rem;
	font-weight: 700;
	color: #0369a1;
	text-align: center;
	margin-top: 0.25rem;
}

.shopmedx-hero-visual__product--thermo {
	right: 0.25rem;
	bottom: 0.25rem;
	width: 32%;
	z-index: 4;
	transform: rotate(-12deg);
}

.shopmedx-hero-visual__thermo {
	display: flex;
	align-items: center;
	gap: 0.25rem;
	border-radius: 999px;
	padding: 0.25rem 0.5rem;
}

.shopmedx-hero-visual__thermo-tip {
	width: 0.5rem;
	height: 0.25rem;
	background: #94a3b8;
	border-radius: 999px 0 0 999px;
}

.shopmedx-hero-visual__thermo-reading {
	font-size: 0.4375rem;
	font-weight: 700;
	color: var(--color-success);
	background: #ecfdf5;
	padding: 0.125rem 0.25rem;
	border-radius: 0.25rem;
	font-family: ui-monospace, monospace;
}

.shopmedx-hero-visual__thermo-dot {
	width: 0.375rem;
	height: 0.375rem;
	border-radius: 50%;
	background: var(--color-primary);
}

/* --------------------------------------------------------------------------
   Trust Bar
   -------------------------------------------------------------------------- */

.shopmedx-trust-bar {
	padding-block: 0 1.75rem;
	background: transparent;
	border: none;
	margin-top: -1.25rem;
	position: relative;
	z-index: 2;
}

.shopmedx-trust-bar .shopmedx-container {
	background: var(--color-white);
	border: 1px solid #e8edf2;
	border-radius: 0.875rem;
	box-shadow: 0 4px 18px rgba(12, 54, 100, 0.06);
	padding: 1.125rem 0;
}

.shopmedx-trust-bar__grid {
	display: grid;
	grid-template-columns: repeat(var(--trust-count, 4), minmax(0, 1fr));
	gap: 0;
}

.shopmedx-trust-bar__item {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 0.75rem;
	padding: 0.375rem 1rem;
}

.shopmedx-trust-bar__item:not(:last-child) {
	border-right: 1px solid #e8edf2;
}

.shopmedx-trust-bar__icon {
	flex-shrink: 0;
	width: auto;
	height: auto;
	display: flex;
	align-items: center;
	justify-content: center;
	background: transparent;
	border-radius: 0;
	color: var(--color-primary);
}

.shopmedx-trust-bar__svg {
	width: 2rem;
	height: 2rem;
}

.shopmedx-trust-bar__title {
	font-weight: 700;
	font-size: 0.875rem;
	color: var(--color-navy);
	line-height: 1.25;
}

.shopmedx-trust-bar__subtitle {
	font-size: 0.75rem;
	color: var(--color-text-muted);
	line-height: 1.3;
	margin-top: 0.125rem;
}

.shopmedx-trust-bar__item > div:last-child {
	min-width: 0;
}

/* --------------------------------------------------------------------------
   Category Grid
   -------------------------------------------------------------------------- */

.shopmedx-category-grid {
	padding-block: 0.5rem 3rem;
	background: var(--color-bg);
}

.shopmedx-section-header--categories {
	margin-bottom: 1.125rem;
}

.shopmedx-section-header--categories .shopmedx-section-header__link {
	font-size: 0.75rem;
	font-weight: 600;
}

.shopmedx-category-grid__items {
	display: grid;
	grid-template-columns: repeat(10, minmax(0, 1fr));
	gap: 0.625rem;
}

.shopmedx-category-card {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 0.625rem;
	min-height: 6.75rem;
	padding: 0.875rem 0.375rem;
	background: var(--color-white);
	border: 1px solid #e8edf2;
	border-radius: 0.625rem;
	text-align: center;
	text-decoration: none;
	color: var(--color-navy);
	transition: border-color var(--transition), box-shadow var(--transition), transform var(--transition), color var(--transition);
}

.shopmedx-category-card:hover {
	border-color: #bfdbfe;
	box-shadow: 0 4px 14px rgba(12, 54, 100, 0.06);
	transform: translateY(-1px);
	color: var(--color-primary);
}

.shopmedx-category-card__icon {
	width: auto;
	height: auto;
	display: flex;
	align-items: center;
	justify-content: center;
	background: transparent;
	border-radius: 0;
}

.shopmedx-category-card__icon-svg {
	width: 2rem;
	height: 2rem;
	color: var(--color-primary);
}

.shopmedx-category-card__icon img {
	width: 2rem;
	height: 2rem;
	object-fit: contain;
}

.shopmedx-category-card__label {
	font-weight: 600;
	font-size: 0.6875rem;
	line-height: 1.25;
}

/* --------------------------------------------------------------------------
   Product Cards
   -------------------------------------------------------------------------- */

.shopmedx-product-card {
	list-style: none;
}

.shopmedx-product-card__inner {
	position: relative;
	display: flex;
	flex-direction: column;
	height: 100%;
	background: var(--color-white);
	border: 1px solid var(--color-border);
	border-radius: var(--radius-lg);
	overflow: hidden;
	transition: box-shadow var(--transition), border-color var(--transition);
}

.shopmedx-product-card__inner:hover {
	box-shadow: var(--shadow-md);
	border-color: var(--color-primary-light);
}

.shopmedx-product-card__wishlist {
	position: absolute;
	top: 0.75rem;
	right: 0.75rem;
	z-index: 2;
	width: 36px;
	height: 36px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: var(--color-white);
	border: 1px solid var(--color-border);
	border-radius: 50%;
	cursor: pointer;
	color: var(--color-text-muted);
	transition: color var(--transition), border-color var(--transition);
}

.shopmedx-product-card__wishlist:hover {
	color: var(--color-accent-red);
	border-color: var(--color-accent-red);
}

.shopmedx-product-card__image-link {
	display: block;
	aspect-ratio: 1;
	overflow: hidden;
	background: #f1f5f9;
}

.shopmedx-product-card__placeholder {
	width: 100%;
	height: 100%;
	min-height: 9rem;
	display: flex;
	align-items: center;
	justify-content: center;
	background: linear-gradient(180deg, #f8fafc 0%, #eef2f7 100%);
}

.shopmedx-product-card__placeholder-icon {
	width: 2.5rem;
	height: 2.5rem;
	color: #94a3b8;
}

.shopmedx-product-card__image {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.3s ease;
}

.shopmedx-product-card__inner:hover .shopmedx-product-card__image {
	transform: scale(1.05);
}

.shopmedx-product-card__body {
	display: flex;
	flex-direction: column;
	flex: 1;
	padding: 1rem;
	gap: 0.375rem;
}

.shopmedx-product-card__category {
	font-size: 0.6875rem;
	font-weight: 700;
	color: var(--color-primary);
	letter-spacing: 0.05em;
}

.shopmedx-product-card__title {
	font-size: 0.9375rem;
	font-weight: 600;
	margin: 0;
	line-height: 1.35;
}

.shopmedx-product-card__title a {
	color: var(--color-navy);
	text-decoration: none;
}

.shopmedx-product-card__title a:hover {
	color: var(--color-primary);
}

.shopmedx-product-card__rating {
	display: flex;
	align-items: center;
	gap: 0.375rem;
	font-size: 0.75rem;
	color: var(--color-text-muted);
}

.shopmedx-product-card__price {
	font-size: 1.0625rem;
	font-weight: 700;
	color: var(--color-navy);
	margin-top: auto;
}

.shopmedx-product-card__price del {
	color: var(--color-text-muted);
	font-weight: 400;
	font-size: 0.875rem;
}

.shopmedx-product-card__price ins {
	text-decoration: none;
	color: var(--color-accent-red);
}

.shopmedx-product-card__stock {
	display: inline-flex;
	align-items: center;
	gap: 0.375rem;
	font-size: 0.75rem;
	font-weight: 600;
}

.shopmedx-product-card__stock-dot {
	width: 0.375rem;
	height: 0.375rem;
	border-radius: 50%;
	background: currentColor;
}

.shopmedx-product-card__stock--in {
	color: var(--color-success);
}

.shopmedx-product-card__actions {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	margin-top: 0.5rem;
}

.shopmedx-product-card__actions .shopmedx-btn {
	flex: 1;
	padding: 0.5rem 0.75rem;
	font-size: 0.8125rem;
}

.shopmedx-qty {
	display: flex;
	align-items: center;
	border: 1px solid var(--color-border);
	border-radius: var(--radius-sm);
	overflow: hidden;
	flex-shrink: 0;
}

.shopmedx-qty button {
	width: 32px;
	height: 36px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: var(--color-bg);
	border: none;
	cursor: pointer;
	font-size: 1rem;
	color: var(--color-text);
	transition: background var(--transition);
}

.shopmedx-qty button:hover {
	background: var(--color-border);
}

.shopmedx-qty input.qty {
	width: 40px;
	height: 36px;
	border: none;
	text-align: center;
	padding: 0;
	-moz-appearance: textfield;
}

.shopmedx-qty input.qty::-webkit-outer-spin-button,
.shopmedx-qty input.qty::-webkit-inner-spin-button {
	-webkit-appearance: none;
	margin: 0;
}

/* --------------------------------------------------------------------------
   Product Carousel
   -------------------------------------------------------------------------- */

.shopmedx-product-carousel {
	padding-block: 2.5rem 3rem;
	background: #f8f9fa;
}

.shopmedx-section-header--products {
	margin-bottom: 1.25rem;
}

.shopmedx-product-carousel .shopmedx-section-header__link {
	font-size: 0.75rem;
	font-weight: 600;
}

.shopmedx-product-carousel__viewport {
	display: grid;
	grid-template-columns: auto minmax(0, 1fr) auto;
	align-items: center;
	gap: 0.75rem;
}

.shopmedx-product-carousel__arrow {
	width: 2rem;
	height: 2rem;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	background: var(--color-white);
	border: 1px solid #cbd5e1;
	border-radius: 50%;
	color: var(--color-primary);
	cursor: pointer;
	padding: 0;
	transition: border-color var(--transition), color var(--transition), box-shadow var(--transition);
}

.shopmedx-product-carousel__arrow:hover {
	border-color: var(--color-primary);
	box-shadow: var(--shadow-sm);
}

.shopmedx-product-carousel__arrow-icon {
	width: 1rem;
	height: 1rem;
}

.shopmedx-product-carousel__track {
	display: flex;
	gap: 1rem;
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	scroll-behavior: smooth;
	-ms-overflow-style: none;
	scrollbar-width: none;
	margin: 0;
	padding: 0;
	list-style: none;
}

.shopmedx-product-carousel__track::-webkit-scrollbar {
	display: none;
}

.shopmedx-product-carousel__track > .shopmedx-product-card {
	flex: 0 0 calc(16.666% - 0.833rem);
	min-width: 10.5rem;
	max-width: 100%;
	scroll-snap-align: start;
}

/* Carousel card variant */
.shopmedx-product-carousel .shopmedx-product-card__inner--carousel {
	border-radius: 0.625rem;
	border-color: #e5e7eb;
	box-shadow: none;
	padding: 0.875rem;
	overflow: visible;
}

.shopmedx-product-carousel .shopmedx-product-card__inner--carousel:hover {
	box-shadow: 0 8px 24px rgba(12, 54, 100, 0.08);
	border-color: #dbeafe;
}

.shopmedx-product-carousel .shopmedx-product-card__wishlist {
	top: 0.625rem;
	right: 0.625rem;
	width: auto;
	height: auto;
	padding: 0;
	background: transparent;
	border: none;
	color: #94a3b8;
}

.shopmedx-product-carousel .shopmedx-product-card__wishlist svg {
	width: 1rem;
	height: 1rem;
}

.shopmedx-product-carousel .shopmedx-product-card__wishlist:hover {
	color: var(--color-accent-red);
	background: transparent;
	border: none;
}

.shopmedx-product-carousel .shopmedx-product-card__image-link {
	aspect-ratio: auto;
	height: 9rem;
	margin-bottom: 0.375rem;
	background: transparent;
	display: flex;
	align-items: center;
	justify-content: center;
	overflow: visible;
}

.shopmedx-product-carousel .shopmedx-product-card__image {
	width: auto;
	height: auto;
	max-width: 100%;
	max-height: 9rem;
	object-fit: contain;
}

.shopmedx-product-carousel .shopmedx-product-card__inner--carousel:hover .shopmedx-product-card__image {
	transform: none;
}

.shopmedx-product-carousel .shopmedx-product-card__placeholder {
	min-height: 9rem;
	background: transparent;
}

.shopmedx-product-carousel .shopmedx-product-card__body {
	padding: 0;
	gap: 0.25rem;
}

.shopmedx-product-carousel .shopmedx-product-card__title {
	font-size: 0.75rem;
	font-weight: 600;
	line-height: 1.35;
	margin: 0;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	min-height: 2.025rem;
}

.shopmedx-product-carousel .shopmedx-product-card__rating {
	display: flex;
	align-items: center;
	gap: 0.25rem;
	margin-top: 0.125rem;
}

.shopmedx-stars {
	display: inline-flex;
	align-items: center;
	gap: 0.0625rem;
	line-height: 1;
}

.shopmedx-stars__full,
.shopmedx-stars__empty {
	font-size: 0.75rem;
	line-height: 1;
}

.shopmedx-stars__full {
	color: #fbbf24;
}

.shopmedx-stars__empty {
	color: #e2e8f0;
}

.shopmedx-product-carousel .shopmedx-product-card__review-count {
	font-size: 0.625rem;
	color: var(--color-text-muted);
	line-height: 1;
}

.shopmedx-product-carousel .shopmedx-product-card__price {
	font-size: 0.875rem;
	font-weight: 700;
	margin-top: 0.25rem;
}

.shopmedx-product-carousel .shopmedx-product-card__price .woocommerce-Price-amount {
	color: var(--color-navy);
}

.shopmedx-product-carousel .shopmedx-product-card__actions {
	display: block;
	margin-top: 0.625rem;
}

.shopmedx-product-carousel .shopmedx-product-card__actions .shopmedx-btn {
	width: 100%;
	padding: 0.4375rem 0.75rem;
	font-size: 0.75rem;
	font-weight: 600;
	border-radius: 0.375rem;
}

.shopmedx-carousel-nav {
	display: flex;
	gap: 0.375rem;
}

.shopmedx-carousel-nav__btn {
	width: 36px;
	height: 36px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: var(--color-white);
	border: 1px solid var(--color-border);
	border-radius: 50%;
	cursor: pointer;
	font-size: 1.25rem;
	color: var(--color-navy);
	transition: background var(--transition), border-color var(--transition);
}

.shopmedx-carousel-nav__btn:hover {
	background: var(--color-primary);
	border-color: var(--color-primary);
	color: var(--color-white);
}

.shopmedx-carousel-dots {
	display: flex;
	justify-content: center;
	gap: 0.5rem;
	margin-top: 1rem;
}

.shopmedx-carousel-dot {
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: var(--color-border);
	border: none;
	cursor: pointer;
	padding: 0;
	transition: background var(--transition), transform var(--transition);
}

.shopmedx-carousel-dot.is-active {
	background: var(--color-primary);
	transform: scale(1.25);
}

/* --------------------------------------------------------------------------
   Features Grid
   -------------------------------------------------------------------------- */

.shopmedx-features-grid {
	padding-block: 2.5rem 3rem;
	background: var(--color-bg);
}

.shopmedx-features-grid__title {
	text-align: center;
	font-size: 1.25rem;
	margin-bottom: 2rem;
	font-weight: 800;
}

.shopmedx-features-grid__items {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 1.25rem;
}

.shopmedx-feature-card {
	text-align: left;
	padding: 1.5rem;
	background: var(--color-white);
	border: 1px solid var(--color-border);
	border-radius: var(--radius-lg);
	transition: box-shadow var(--transition);
}

.shopmedx-feature-card:hover {
	box-shadow: var(--shadow-md);
}

.shopmedx-feature-card__icon {
	width: 3rem;
	height: 3rem;
	margin: 0 0 1rem;
	display: flex;
	align-items: center;
	justify-content: center;
	background: rgba(230, 240, 250, 0.65);
	border: 1px solid rgba(191, 219, 254, 0.8);
	border-radius: 0.75rem;
	color: var(--color-primary);
}

.shopmedx-feature-card__svg {
	width: 1.5rem;
	height: 1.5rem;
}

.shopmedx-feature-card h3 {
	font-size: 0.875rem;
	margin-bottom: 0.375rem;
	font-weight: 800;
}

.shopmedx-feature-card p {
	font-size: 0.75rem;
	color: var(--color-text-muted);
	margin: 0;
	line-height: 1.6;
}

/* --------------------------------------------------------------------------
   B2B Banner
   -------------------------------------------------------------------------- */

.shopmedx-b2b-banner {
	padding-block: 2.5rem 3rem;
}

.shopmedx-b2b-banner__grid {
	display: grid;
	grid-template-columns: minmax(0, 5fr) minmax(0, 4fr) minmax(0, 3fr);
	gap: 0;
	min-height: 17.5rem;
	background: var(--color-navy);
	border-radius: 1.25rem;
	overflow: hidden;
	box-shadow: 0 12px 40px rgba(12, 54, 100, 0.18);
}

.shopmedx-b2b-banner__content {
	padding: 2.25rem 1.75rem 2.25rem 2.5rem;
	color: var(--color-white);
	display: flex;
	flex-direction: column;
	justify-content: center;
	background: var(--color-navy);
	z-index: 2;
}

.shopmedx-b2b-banner__title {
	font-size: clamp(1.625rem, 2.4vw, 2rem);
	color: var(--color-white);
	margin-bottom: 0.875rem;
	font-weight: 800;
	line-height: 1.15;
	letter-spacing: -0.02em;
}

.shopmedx-b2b-banner__text {
	color: rgba(219, 234, 254, 0.92);
	margin-bottom: 1.375rem;
	font-size: 0.8125rem;
	line-height: 1.65;
	max-width: 22rem;
}

.shopmedx-b2b-banner__actions {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.625rem;
	margin-bottom: 0;
}

.shopmedx-b2b-banner__actions .shopmedx-btn {
	padding: 0.5625rem 1.125rem;
	font-size: 0.75rem;
	font-weight: 700;
	border-width: 1px;
	line-height: 1.2;
}

.shopmedx-b2b-banner__actions .shopmedx-btn--white {
	color: var(--color-navy);
}

.shopmedx-b2b-banner__actions .shopmedx-btn--white:hover {
	background: #eff6ff;
	color: var(--color-navy);
}

.shopmedx-b2b-banner__actions .shopmedx-btn--outline-white {
	border-color: rgba(255, 255, 255, 0.72);
}

.shopmedx-b2b-banner__features-panel {
	background: var(--color-navy-light);
	padding: 2rem 1.75rem 2rem 1.5rem;
	display: flex;
	align-items: center;
	z-index: 2;
}

.shopmedx-b2b-banner__features {
	display: flex;
	flex-direction: column;
	gap: 0.9375rem;
	margin: 0;
	padding: 0;
	list-style: none;
	width: 100%;
}

.shopmedx-b2b-banner__features li {
	display: flex;
	align-items: center;
	gap: 0.75rem;
	font-size: 0.75rem;
	color: rgba(255, 255, 255, 0.95);
	font-weight: 600;
	line-height: 1.3;
}

.shopmedx-b2b-banner__feature-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 1.125rem;
	height: 1.125rem;
	flex-shrink: 0;
	color: rgba(255, 255, 255, 0.92);
}

.shopmedx-b2b-banner__feature-svg {
	width: 1.125rem;
	height: 1.125rem;
}

.shopmedx-b2b-banner__media {
	position: relative;
	min-height: 17.5rem;
	overflow: hidden;
	background: #cbd5e1;
}

.shopmedx-b2b-banner__media-overlay {
	position: absolute;
	inset: 0;
	background: linear-gradient(
		90deg,
		var(--color-navy) 0%,
		rgba(12, 54, 100, 0.72) 12%,
		rgba(12, 54, 100, 0.18) 32%,
		transparent 48%,
		transparent 58%,
		rgba(8, 40, 77, 0.35) 78%,
		var(--color-navy-light) 100%
	);
	pointer-events: none;
	z-index: 1;
}

.shopmedx-b2b-banner__image {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center 20%;
}

/* --------------------------------------------------------------------------
   B2B Sections
   -------------------------------------------------------------------------- */

.shopmedx-b2b-hero {
	padding-block: 2.5rem 3rem;
	background: linear-gradient(180deg, var(--color-primary-light) 0%, var(--color-bg) 100%);
}

.shopmedx-b2b-hero__grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 3rem;
	align-items: center;
	margin-top: 1.5rem;
}

.shopmedx-b2b-hero__eyebrow {
	display: inline-block;
	font-size: 0.8125rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	color: var(--color-primary);
	margin-bottom: 0.75rem;
}

.shopmedx-b2b-hero__title {
	font-size: clamp(1.75rem, 3.5vw, 2.5rem);
	font-weight: 800;
	color: var(--color-navy);
	margin-bottom: 0.5rem;
}

.shopmedx-b2b-hero__intro {
	color: var(--color-text-muted);
	margin-bottom: 1.5rem;
}

.shopmedx-b2b-hero__actions {
	display: flex;
	flex-wrap: wrap;
	gap: 0.75rem;
	margin-bottom: 2rem;
}

.shopmedx-b2b-hero__chips {
	display: flex;
	flex-wrap: wrap;
	gap: 1rem;
}

.shopmedx-b2b-hero__chip {
	display: flex;
	align-items: center;
	gap: 0.625rem;
	padding: 0.75rem 1rem;
	background: var(--color-white);
	border-radius: var(--radius-md);
	box-shadow: var(--shadow-sm);
}

.shopmedx-b2b-hero__chip-icon {
	width: 1.5rem;
	height: 1.5rem;
	color: var(--color-primary);
}

.shopmedx-b2b-hero__chip strong {
	display: block;
	font-size: 0.875rem;
	color: var(--color-navy);
}

.shopmedx-b2b-hero__chip span {
	font-size: 0.75rem;
	color: var(--color-text-muted);
}

.shopmedx-b2b-hero__image {
	border-radius: var(--radius-lg);
	box-shadow: var(--shadow-lg);
}

.shopmedx-b2b-split {
	padding-block: 3rem;
}

.shopmedx-b2b-split__grid {
	display: grid;
	grid-template-columns: 1fr 1.2fr;
	gap: 2rem;
}

.shopmedx-b2b-serve {
	background: var(--color-navy);
	color: var(--color-white);
	padding: 2rem;
	border-radius: var(--radius-lg);
}

.shopmedx-b2b-serve h3 {
	color: var(--color-white);
	margin-bottom: 1.25rem;
}

.shopmedx-b2b-serve__list li {
	display: flex;
	align-items: center;
	gap: 0.75rem;
	padding: 0.625rem 0;
	border-bottom: 1px solid rgba(255, 255, 255, 0.1);
	font-size: 0.9375rem;
}

.shopmedx-b2b-serve__list li:last-child {
	border-bottom: none;
}

.shopmedx-b2b-serve__icon {
	color: var(--color-accent-red);
	flex-shrink: 0;
}

.shopmedx-b2b-partner {
	background: var(--color-white);
	border: 1px solid var(--color-border);
	border-radius: var(--radius-lg);
	padding: 2rem;
}

.shopmedx-b2b-partner h3 {
	margin-bottom: 1.25rem;
}

.shopmedx-b2b-partner__features {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 1rem;
	margin-bottom: 1.5rem;
}

.shopmedx-b2b-partner__feature-icon {
	width: 40px;
	height: 40px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: var(--color-primary-light);
	border-radius: var(--radius-sm);
	color: var(--color-primary);
	margin-bottom: 0.5rem;
}

.shopmedx-b2b-partner__feature h4 {
	font-size: 0.9375rem;
	margin-bottom: 0.25rem;
}

.shopmedx-b2b-partner__feature p {
	font-size: 0.8125rem;
	color: var(--color-text-muted);
	margin: 0;
}

.shopmedx-b2b-partner__quotes {
	overflow: hidden;
}

.shopmedx-b2b-partner__quotes[data-carousel-track] {
	display: flex;
	transition: transform 0.4s ease;
}

.shopmedx-b2b-quote {
	flex: 0 0 100%;
	padding: 1rem;
	background: var(--color-bg);
	border-radius: var(--radius-md);
	margin: 0;
}

.shopmedx-b2b-quote p {
	font-style: italic;
	color: var(--color-text);
	margin-bottom: 0.5rem;
}

.shopmedx-b2b-quote cite {
	font-size: 0.8125rem;
	color: var(--color-text-muted);
	font-style: normal;
}

.shopmedx-b2b-partner__nav {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-top: 1rem;
}

.shopmedx-b2b-support {
	padding-block: 3rem;
	background: var(--color-bg);
}

.shopmedx-b2b-support__title {
	text-align: center;
	font-size: 1.75rem;
	margin-bottom: 2rem;
}

.shopmedx-b2b-support__grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 1.5rem;
}

.shopmedx-b2b-support-card {
	background: var(--color-white);
	border: 1px solid var(--color-border);
	border-radius: var(--radius-lg);
	padding: 1.5rem;
	text-align: center;
	transition: box-shadow var(--transition);
}

.shopmedx-b2b-support-card:hover {
	box-shadow: var(--shadow-md);
}

.shopmedx-b2b-support-card__icon {
	width: 56px;
	height: 56px;
	margin: 0 auto 1rem;
	display: flex;
	align-items: center;
	justify-content: center;
	background: var(--color-primary-light);
	border-radius: 50%;
	color: var(--color-primary);
}

.shopmedx-b2b-support-card h3 {
	font-size: 1.0625rem;
	margin-bottom: 0.5rem;
}

.shopmedx-b2b-support-card p {
	font-size: 0.875rem;
	color: var(--color-text-muted);
	margin: 0;
}

.shopmedx-b2b-process {
	padding-block: 3rem;
}

.shopmedx-b2b-process__title {
	text-align: center;
	font-size: 1.75rem;
	margin-bottom: 2.5rem;
}

.shopmedx-b2b-process__steps {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 1.5rem;
}

.shopmedx-b2b-process-step {
	text-align: center;
	padding: 1rem;
}

.shopmedx-b2b-process-step__icon {
	position: relative;
	width: 64px;
	height: 64px;
	margin: 0 auto 1rem;
	display: flex;
	align-items: center;
	justify-content: center;
	background: var(--color-primary-light);
	border-radius: 50%;
	color: var(--color-primary);
}

.shopmedx-b2b-process-step__num {
	position: absolute;
	top: -4px;
	right: -4px;
	width: 22px;
	height: 22px;
	background: var(--color-accent-red);
	color: var(--color-white);
	font-size: 0.6875rem;
	font-weight: 700;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
}

.shopmedx-b2b-process-step h3 {
	font-size: 1rem;
	margin-bottom: 0.375rem;
}

.shopmedx-b2b-process-step p {
	font-size: 0.8125rem;
	color: var(--color-text-muted);
	margin: 0;
}

.shopmedx-b2b-cta {
	padding-block: 3rem;
}

.shopmedx-b2b-cta__inner {
	display: flex;
	align-items: center;
	gap: 2rem;
	background: var(--color-navy);
	border-radius: var(--radius-lg);
	padding: 2rem;
	color: var(--color-white);
}

.shopmedx-b2b-cta__media {
	flex-shrink: 0;
}

.shopmedx-b2b-cta__image {
	width: 80px;
	height: 80px;
	border-radius: var(--radius-md);
	object-fit: cover;
}

.shopmedx-b2b-cta__content {
	flex: 1;
}

.shopmedx-b2b-cta__content h3 {
	color: var(--color-white);
	margin-bottom: 0.375rem;
}

.shopmedx-b2b-cta__content p {
	color: rgba(255, 255, 255, 0.8);
	margin: 0;
}

.shopmedx-b2b-cta__actions {
	display: flex;
	flex-wrap: wrap;
	gap: 0.75rem;
	flex-shrink: 0;
}

/* --------------------------------------------------------------------------
   Testimonials
   -------------------------------------------------------------------------- */

.shopmedx-testimonials {
	padding-block: 2.5rem 3rem;
	background: var(--color-bg);
}

.shopmedx-testimonials__viewport {
	display: grid;
	grid-template-columns: auto minmax(0, 1fr) auto;
	align-items: center;
	gap: 0.75rem;
}

.shopmedx-testimonials__arrow {
	width: 2rem;
	height: 2rem;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	background: var(--color-white);
	border: 1px solid #cbd5e1;
	border-radius: 50%;
	color: var(--color-primary);
	cursor: pointer;
	padding: 0;
	transition: border-color var(--transition), color var(--transition), box-shadow var(--transition);
}

.shopmedx-testimonials__arrow:hover {
	border-color: var(--color-primary);
	box-shadow: var(--shadow-sm);
}

.shopmedx-testimonials__arrow-icon {
	width: 1rem;
	height: 1rem;
}

.shopmedx-testimonials__track {
	display: flex;
	gap: 1rem;
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	scroll-behavior: smooth;
	-ms-overflow-style: none;
	scrollbar-width: none;
	margin: 0;
	padding: 0;
	align-items: stretch;
}

.shopmedx-testimonials__track::-webkit-scrollbar {
	display: none;
}

.shopmedx-testimonials__track > .shopmedx-testimonial-card {
	scroll-snap-align: start;
}

.shopmedx-testimonial-card {
	flex: 0 0 calc(25% - 0.75rem);
	min-width: 0;
	display: flex;
	flex-direction: column;
	padding: 1.75rem 2rem;
	background: var(--color-white);
	border-radius: var(--radius-lg);
	border: 1px solid var(--color-border);
	margin: 0;
	box-shadow: var(--shadow-sm);
}

.shopmedx-testimonial-card__stars {
	color: #f59e0b;
	font-size: 0.875rem;
	margin-bottom: 0.875rem;
	letter-spacing: 0.05em;
}

.shopmedx-testimonial-card p {
	font-size: 0.9375rem;
	color: var(--color-text);
	font-style: italic;
	margin-bottom: 1rem;
	line-height: 1.65;
	flex: 1 1 auto;
}

.shopmedx-testimonial-card cite {
	display: block;
	font-style: normal;
}

.shopmedx-testimonial-card cite strong {
	font-size: 0.8125rem;
	color: var(--color-navy);
	font-weight: 700;
}

.shopmedx-testimonial-card cite span {
	display: block;
	font-size: 0.6875rem;
	color: var(--color-text-muted);
	font-weight: 500;
	margin-top: 0.125rem;
}

/* --------------------------------------------------------------------------
   Page Banner & Breadcrumbs
   -------------------------------------------------------------------------- */

.shopmedx-page-banner {
	padding-block: 2rem;
	background: var(--color-navy);
	color: var(--color-white);
}

.shopmedx-page-banner__title {
	font-size: clamp(1.75rem, 3vw, 2.25rem);
	color: var(--color-white);
	margin-bottom: 0.375rem;
}

.shopmedx-page-banner__subtitle {
	color: rgba(255, 255, 255, 0.75);
	margin: 0;
	font-size: 0.9375rem;
}

.shopmedx-breadcrumbs {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.375rem;
	font-size: 0.8125rem;
	margin-bottom: 0.75rem;
}

.shopmedx-breadcrumbs a {
	color: rgba(255, 255, 255, 0.7);
}

.shopmedx-breadcrumbs a:hover {
	color: var(--color-white);
}

.shopmedx-breadcrumbs__sep {
	color: rgba(255, 255, 255, 0.4);
}

.shopmedx-breadcrumbs span,
.shopmedx-breadcrumbs .breadcrumb_last {
	color: rgba(255, 255, 255, 0.9);
}

/* --------------------------------------------------------------------------
   Contact Page
   -------------------------------------------------------------------------- */

.shopmedx-contact-page {
	background: var(--color-bg);
}

.shopmedx-contact-head {
	position: relative;
	background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
	border-bottom: 1px solid var(--color-border);
	padding-block: 1.5rem 1.75rem;
	overflow: hidden;
}

.shopmedx-contact-head__decor {
	position: absolute;
	top: 0;
	right: 0;
	width: min(45%, 420px);
	height: 100%;
	color: #eff6ff;
	pointer-events: none;
}

.shopmedx-contact-head__decor svg {
	width: 100%;
	height: 100%;
}

.shopmedx-contact-head__inner {
	position: relative;
	z-index: 1;
}

.shopmedx-contact-head .shopmedx-breadcrumbs {
	margin-bottom: 0.625rem;
	font-size: 0.8125rem;
}

.shopmedx-contact-head .shopmedx-breadcrumbs a {
	color: var(--color-text-muted);
}

.shopmedx-contact-head .shopmedx-breadcrumbs a:hover {
	color: var(--color-primary);
}

.shopmedx-contact-head .shopmedx-breadcrumbs__sep {
	color: #cbd5e1;
}

.shopmedx-contact-head .shopmedx-breadcrumbs__current,
.shopmedx-contact-head .shopmedx-breadcrumbs span {
	color: var(--color-navy);
	font-weight: 600;
}

.shopmedx-contact-head__title {
	font-size: clamp(1.75rem, 3vw, 2.25rem);
	font-weight: 800;
	color: var(--color-navy);
	margin: 0;
	line-height: 1.15;
}

.shopmedx-contact {
	padding-block: 2.5rem 3rem;
}

.shopmedx-contact__grid {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr);
	gap: 2.5rem;
	align-items: start;
}

.shopmedx-contact__info h2 {
	font-size: 1.375rem;
	font-weight: 800;
	color: var(--color-navy);
	margin-bottom: 0.625rem;
}

.shopmedx-contact__intro {
	color: var(--color-text-muted);
	margin-bottom: 1.5rem;
	font-size: 0.9375rem;
	line-height: 1.65;
	max-width: 34rem;
}

.shopmedx-contact-cards {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 1rem;
}

.shopmedx-contact-card {
	padding: 1.125rem 1.25rem;
	background: var(--color-white);
	border: 1px solid var(--color-border);
	border-radius: 0.875rem;
	box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
	transition: border-color var(--transition), box-shadow var(--transition);
}

.shopmedx-contact-card:hover {
	border-color: #bfdbfe;
	box-shadow: 0 4px 12px rgba(15, 23, 42, 0.06);
}

.shopmedx-contact-card__icon {
	width: 2.5rem;
	height: 2.5rem;
	display: flex;
	align-items: center;
	justify-content: center;
	background: #eff6ff;
	border-radius: 0.625rem;
	color: var(--color-primary);
	margin-bottom: 0.75rem;
}

.shopmedx-contact-card__icon svg {
	width: 1.25rem;
	height: 1.25rem;
}

.shopmedx-contact-card h3 {
	font-size: 0.9375rem;
	font-weight: 700;
	color: var(--color-navy);
	margin-bottom: 0.375rem;
}

.shopmedx-contact-card div {
	font-size: 0.8125rem;
	color: var(--color-text-muted);
	line-height: 1.55;
}

.shopmedx-contact-card a {
	color: var(--color-primary);
}

.shopmedx-contact-form-card {
	padding: 1.5rem 1.625rem;
	border-radius: 1rem;
	box-shadow: 0 4px 16px rgba(15, 23, 42, 0.06);
}

.shopmedx-contact-form-card h2,
.shopmedx-contact__form h2 {
	font-size: 1.125rem;
	font-weight: 800;
	color: var(--color-navy);
	margin-bottom: 1.25rem;
}

.shopmedx-contact-form-card__notice {
	font-size: 0.875rem;
	color: var(--color-text-muted);
}

.shopmedx-contact-faq-map {
	padding-block: 0 3rem;
	background: var(--color-bg);
}

.shopmedx-contact-faq-map__grid {
	display: grid;
	grid-template-columns: minmax(0, 1.15fr) minmax(0, 0.85fr);
	gap: 2.5rem;
	align-items: start;
}

.shopmedx-section-header--contact {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	margin-bottom: 1rem;
}

.shopmedx-section-header--contact h2 {
	font-size: 1.125rem;
	font-weight: 800;
	color: var(--color-navy);
	margin: 0;
}

.shopmedx-faq-card {
	background: var(--color-white);
	border: 1px solid var(--color-border);
	border-radius: 1rem;
	overflow: hidden;
	box-shadow: 0 1px 3px rgba(15, 23, 42, 0.04);
}

.shopmedx-faq {
	display: grid;
	grid-template-columns: minmax(11rem, 14rem) minmax(0, 1fr);
	min-height: 20rem;
}

.shopmedx-faq__sidebar {
	display: flex;
	flex-direction: column;
	gap: 0.25rem;
	padding: 0.75rem;
	background: #f8fafc;
	border-right: 1px solid var(--color-border);
}

.shopmedx-faq__content {
	padding: 0.5rem 1.25rem 1rem;
	min-width: 0;
}

.shopmedx-faq__tabs {
	display: none;
}

.shopmedx-faq__tab {
	display: block;
	width: 100%;
	text-align: left;
	padding: 0.75rem 0.875rem;
	background: transparent;
	border: none;
	border-radius: 0.625rem;
	font-size: 0.8125rem;
	font-weight: 600;
	color: var(--color-text-muted);
	cursor: pointer;
	transition: background var(--transition), color var(--transition);
}

.shopmedx-faq__tab:hover {
	color: var(--color-navy);
	background: rgba(255, 255, 255, 0.7);
}

.shopmedx-faq__tab.is-active {
	color: #fff;
	background: var(--color-navy);
	box-shadow: 0 2px 8px rgba(15, 23, 42, 0.15);
}

.shopmedx-faq__panel {
	display: none;
}

.shopmedx-faq__panel.is-active {
	display: block;
}

.shopmedx-faq__item {
	border-bottom: 1px solid #f1f5f9;
}

.shopmedx-faq__item:last-child {
	border-bottom: none;
}

.shopmedx-faq__question {
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	padding: 1rem 0;
	background: none;
	border: none;
	font-size: 0.875rem;
	font-weight: 600;
	color: var(--color-navy);
	text-align: left;
	cursor: pointer;
	transition: color var(--transition);
}

.shopmedx-faq__question::after {
	content: '+';
	font-size: 1.125rem;
	font-weight: 400;
	color: var(--color-primary);
	flex-shrink: 0;
}

.shopmedx-faq__question[aria-expanded="true"]::after {
	content: '−';
}

.shopmedx-faq__question:hover {
	color: var(--color-primary);
}

.shopmedx-faq__answer {
	padding-bottom: 1rem;
	font-size: 0.8125rem;
	color: var(--color-text-muted);
	line-height: 1.65;
}

.shopmedx-faq__answer[hidden] {
	display: none;
}

.shopmedx-map {
	border-radius: 1rem;
	overflow: hidden;
	border: 1px solid var(--color-border);
	box-shadow: 0 1px 3px rgba(15, 23, 42, 0.04);
	min-height: 20rem;
}

.shopmedx-map iframe {
	display: block;
	min-height: 20rem;
}

/* --------------------------------------------------------------------------
   Quote Page
   -------------------------------------------------------------------------- */

.shopmedx-quote-page {
	background: var(--color-bg);
}

.shopmedx-quote-hero {
	padding: 1.5rem 0 2.5rem;
	background: var(--color-white);
	border-bottom: 1px solid var(--color-border);
}

.shopmedx-quote-hero .shopmedx-breadcrumbs {
	margin-bottom: 1.25rem;
	font-size: 0.8125rem;
}

.shopmedx-quote-hero__grid {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 26rem);
	gap: 2.5rem;
	align-items: center;
}

.shopmedx-quote-hero__copy h1 {
	font-size: clamp(1.875rem, 3vw, 2.5rem);
	font-weight: 800;
	color: var(--color-navy);
	margin-bottom: 0.75rem;
	line-height: 1.15;
}

.shopmedx-quote-hero__copy p {
	color: var(--color-text-muted);
	margin: 0;
	max-width: 34rem;
	line-height: 1.65;
	font-size: 0.9375rem;
}

.shopmedx-quote-hero__visual {
	position: relative;
	justify-self: end;
	width: 100%;
	max-width: 26rem;
}

.shopmedx-quote-hero__image {
	border-radius: var(--radius-lg);
	width: 100%;
	height: auto;
	display: block;
}

.shopmedx-hero-visual--quote {
	position: relative;
	max-width: none;
	margin: 0;
}

.shopmedx-hero-visual__frame--quote {
	aspect-ratio: 4 / 3;
	min-height: 15rem;
}

.shopmedx-quote-hero__verified {
	position: absolute;
	right: 1rem;
	bottom: 1rem;
	width: 2.5rem;
	height: 2.5rem;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
	background: var(--color-primary);
	color: var(--color-white);
	box-shadow: var(--shadow-md);
}

.shopmedx-quote-hero__verified svg {
	width: 1.125rem;
	height: 1.125rem;
}

.shopmedx-quote-main {
	padding-block: 2.5rem 3rem;
}

.shopmedx-quote-main__grid {
	display: grid;
	grid-template-columns: minmax(0, 22rem) minmax(0, 1fr);
	gap: 1.75rem;
	align-items: start;
}

.shopmedx-quote-sidebar__card {
	background: #f1f5f9;
	border-radius: var(--radius-lg);
	padding: 1.5rem;
	border: 1px solid var(--color-border);
}

.shopmedx-quote-sidebar__card h2 {
	font-size: 1.125rem;
	font-weight: 700;
	color: var(--color-navy);
	margin-bottom: 0.625rem;
}

.shopmedx-quote-sidebar__card > p {
	font-size: 0.875rem;
	color: var(--color-text-muted);
	margin-bottom: 1.25rem;
	line-height: 1.55;
}

.shopmedx-quote-benefits {
	display: flex;
	flex-direction: column;
	gap: 1rem;
	margin: 0;
	padding: 0;
	list-style: none;
}

.shopmedx-quote-benefits li {
	display: flex;
	gap: 0.75rem;
	align-items: flex-start;
	font-size: 0.875rem;
}

.shopmedx-quote-benefits__icon {
	flex-shrink: 0;
	width: 2.25rem;
	height: 2.25rem;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
	background: rgba(219, 234, 254, 0.85);
	color: var(--color-primary);
}

.shopmedx-quote-benefits__icon svg {
	width: 1rem;
	height: 1rem;
}

.shopmedx-quote-benefits strong {
	display: block;
	color: var(--color-navy);
	margin-bottom: 0.125rem;
	font-size: 0.875rem;
}

.shopmedx-quote-benefits p {
	margin: 0;
	font-size: 0.8125rem;
	color: var(--color-text-muted);
	line-height: 1.45;
}

.shopmedx-quote-signin {
	margin-top: 1rem;
	background: var(--color-white);
	border: 1px solid var(--color-border);
	border-radius: var(--radius-lg);
	padding: 1.25rem 1.5rem;
}

.shopmedx-quote-signin h3 {
	font-size: 0.9375rem;
	font-weight: 700;
	color: var(--color-navy);
	margin-bottom: 0.375rem;
}

.shopmedx-quote-signin p {
	font-size: 0.8125rem;
	color: var(--color-text-muted);
	margin-bottom: 1rem;
	line-height: 1.5;
}

.shopmedx-quote-signin__btn {
	width: 100%;
	justify-content: center;
}

.shopmedx-quote-form-card {
	background: var(--color-white);
	border: 1px solid var(--color-border);
	border-radius: var(--radius-lg);
	padding: 1.75rem;
}

.shopmedx-quote-form-card > h2 {
	font-size: 1.125rem;
	font-weight: 700;
	color: var(--color-navy);
	margin-bottom: 1.25rem;
}

.shopmedx-quote-form-card__notice {
	font-size: 0.875rem;
	color: var(--color-text-muted);
	margin: 0;
}

.shopmedx-quote-products {
	margin-top: 0.25rem;
}

.shopmedx-quote-products__label {
	display: block;
	font-size: 0.8125rem;
	font-weight: 600;
	color: var(--color-navy);
	margin-bottom: 0.625rem;
}

.shopmedx-quote-upload {
	margin-top: 0.25rem;
}

.shopmedx-quote-upload__label {
	display: block;
	font-size: 0.8125rem;
	font-weight: 600;
	color: var(--color-navy);
	margin-bottom: 0.375rem;
}

.shopmedx-quote-upload__help {
	font-size: 0.8125rem;
	color: var(--color-text-muted);
	margin: 0 0 0.75rem;
	line-height: 1.5;
}

.shopmedx-quote-upload__zone {
	border: 2px dashed #bfdbfe;
	border-radius: var(--radius-lg);
	background: rgba(239, 246, 255, 0.55);
	padding: 1.5rem 1rem;
	text-align: center;
}

.shopmedx-quote-form-secure {
	display: flex;
	align-items: flex-start;
	gap: 0.625rem;
	margin: 0.5rem 0 0.75rem;
	padding: 0;
}

.shopmedx-quote-form-secure__icon {
	flex-shrink: 0;
	color: #059669;
	margin-top: 0.125rem;
}

.shopmedx-quote-form-secure p {
	margin: 0;
	font-size: 0.8125rem;
	color: var(--color-text-muted);
	line-height: 1.5;
}

.shopmedx-quote-builder {
	margin-top: 0.75rem;
}

.shopmedx-quote-builder__search-row {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	gap: 0.75rem;
	align-items: start;
	margin-bottom: 0.75rem;
}

.shopmedx-quote-builder__search {
	position: relative;
}

.shopmedx-quote-builder__search input {
	width: 100%;
	padding: 0.75rem 2.5rem 0.75rem 1rem;
	border: 1px solid var(--color-border);
	border-radius: var(--radius-md);
	font-size: 0.875rem;
	outline: none;
	transition: border-color var(--transition), box-shadow var(--transition);
}

.shopmedx-quote-builder__search input:focus {
	border-color: var(--color-primary);
	box-shadow: 0 0 0 3px rgba(0, 91, 181, 0.1);
}

.shopmedx-quote-builder__search-icon {
	position: absolute;
	right: 0.875rem;
	top: 50%;
	transform: translateY(-50%);
	width: 1rem;
	height: 1rem;
	opacity: 0.45;
	pointer-events: none;
	background: currentColor;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='M20 20l-3-3'/%3E%3C/svg%3E") center / contain no-repeat;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='M20 20l-3-3'/%3E%3C/svg%3E") center / contain no-repeat;
}

.shopmedx-quote-builder__add-btn {
	min-width: 5.5rem;
	padding-inline: 1.25rem;
	white-space: nowrap;
}

.shopmedx-quote-builder__results {
	position: absolute;
	top: calc(100% + 4px);
	left: 0;
	right: 0;
	background: var(--color-white);
	border: 1px solid var(--color-border);
	border-radius: var(--radius-md);
	box-shadow: var(--shadow-lg);
	max-height: 240px;
	overflow-y: auto;
	z-index: 20;
}

.shopmedx-quote-builder__result {
	display: block;
	width: 100%;
	text-align: left;
	padding: 0.625rem 1rem;
	border: none;
	border-bottom: 1px solid var(--color-border);
	background: transparent;
	font-size: 0.875rem;
	color: var(--color-navy);
	cursor: pointer;
}

.shopmedx-quote-builder__result:last-child {
	border-bottom: none;
}

.shopmedx-quote-builder__result:hover {
	background: rgba(239, 246, 255, 0.85);
}

.shopmedx-quote-builder__quick-add {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.5rem;
	margin-bottom: 1rem;
	font-size: 0.8125rem;
	color: var(--color-text-muted);
}

.shopmedx-quote-builder__quick {
	border: none;
	background: rgba(219, 234, 254, 0.65);
	color: var(--color-primary);
	font-size: 0.8125rem;
	font-weight: 600;
	padding: 0.375rem 0.625rem;
	border-radius: 999px;
	cursor: pointer;
	transition: background var(--transition);
}

.shopmedx-quote-builder__quick:hover {
	background: rgba(191, 219, 254, 0.95);
}

.shopmedx-quote-builder__help {
	padding: 1rem;
	background: rgba(239, 246, 255, 0.65);
	border: 1px solid #bfdbfe;
	border-radius: var(--radius-md);
	margin-bottom: 1rem;
}

.shopmedx-quote-builder__help p {
	margin: 0;
	font-size: 0.875rem;
	color: var(--color-text-muted);
	line-height: 1.55;
}

.shopmedx-quote-builder__table-wrap {
	border: 1px solid var(--color-border);
	border-radius: var(--radius-md);
	overflow: hidden;
}

.shopmedx-quote-builder__table {
	width: 100%;
	border-collapse: collapse;
	font-size: 0.8125rem;
}

.shopmedx-quote-builder__table thead {
	background: #f8fafc;
}

.shopmedx-quote-builder__table th,
.shopmedx-quote-builder__table td {
	padding: 0.75rem 0.875rem;
	border-bottom: 1px solid var(--color-border);
	text-align: left;
	vertical-align: middle;
}

.shopmedx-quote-builder__table th {
	font-weight: 600;
	color: var(--color-navy);
	font-size: 0.75rem;
}

.shopmedx-quote-builder__table tbody tr:last-child td {
	border-bottom: none;
}

.shopmedx-quote-builder__empty-row td {
	text-align: center;
	color: var(--color-text-muted);
	padding: 1.5rem;
}

.shopmedx-quote-builder__product {
	font-weight: 600;
	color: var(--color-navy);
}

.shopmedx-quote-builder__qty {
	width: 4.5rem;
	padding: 0.375rem 0.5rem;
	text-align: center;
	border: 1px solid var(--color-border);
	border-radius: var(--radius-sm);
}

.shopmedx-quote-builder__notes {
	width: 100%;
	min-width: 8rem;
	padding: 0.375rem 0.625rem;
	border: 1px solid var(--color-border);
	border-radius: var(--radius-sm);
	font-size: 0.8125rem;
}

.shopmedx-quote-builder__remove {
	background: none;
	border: none;
	color: var(--color-accent-red);
	cursor: pointer;
	font-size: 0.8125rem;
	font-weight: 600;
	padding: 0.25rem 0;
}

.shopmedx-quote-process {
	padding-block: 3rem;
	background: var(--color-white);
}

.shopmedx-quote-process h2 {
	text-align: center;
	font-size: 1.75rem;
	font-weight: 700;
	color: var(--color-navy);
	margin-bottom: 2rem;
}

.shopmedx-quote-process__steps {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 1.25rem;
}

.shopmedx-quote-process-step {
	text-align: center;
	background: var(--color-white);
	border: 1px solid var(--color-border);
	border-radius: var(--radius-lg);
	padding: 1.5rem 1rem;
}

.shopmedx-quote-process-step__number {
	width: 2.25rem;
	height: 2.25rem;
	margin: 0 auto 0.875rem;
	display: flex;
	align-items: center;
	justify-content: center;
	background: var(--color-primary);
	border-radius: 50%;
	color: var(--color-white);
	font-size: 0.875rem;
	font-weight: 700;
}

.shopmedx-quote-process-step h3 {
	font-size: 0.9375rem;
	font-weight: 700;
	color: var(--color-navy);
	margin-bottom: 0.375rem;
}

.shopmedx-quote-process-step p {
	font-size: 0.8125rem;
	color: var(--color-text-muted);
	margin: 0;
	line-height: 1.5;
}

.shopmedx-quote-assist {
	padding-block: 0 3rem;
}

.shopmedx-quote-assist__inner {
	display: flex;
	align-items: center;
	gap: 1.25rem;
	padding: 1.25rem 1.5rem;
	background: rgba(239, 246, 255, 0.75);
	border: 1px solid #bfdbfe;
	border-radius: var(--radius-lg);
}

.shopmedx-quote-assist__icon {
	flex-shrink: 0;
	width: 3rem;
	height: 3rem;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
	background: var(--color-primary);
	color: var(--color-white);
}

.shopmedx-quote-assist__icon svg {
	width: 1.375rem;
	height: 1.375rem;
}

.shopmedx-quote-assist__copy {
	flex: 1;
	min-width: 0;
}

.shopmedx-quote-assist__copy h2 {
	font-size: 1rem;
	font-weight: 700;
	color: var(--color-navy);
	margin-bottom: 0.25rem;
}

.shopmedx-quote-assist__copy p {
	margin: 0;
	font-size: 0.875rem;
	color: var(--color-text-muted);
	line-height: 1.55;
}

.shopmedx-quote-assist__copy a {
	color: var(--color-primary);
	font-weight: 600;
	text-decoration: none;
}

.shopmedx-quote-assist__copy a:hover {
	text-decoration: underline;
}

.shopmedx-quote-assist__btn {
	flex-shrink: 0;
	white-space: nowrap;
}

.shopmedx-shop-trust-bar {
	background: var(--color-white);
	border-top: 1px solid var(--color-border);
	border-bottom: 1px solid var(--color-border);
	padding: 1.5rem 0;
}

.shopmedx-shop-trust-bar__grid {
	display: grid;
	grid-template-columns: repeat(5, minmax(0, 1fr));
	gap: 1.25rem;
	align-items: center;
}

.shopmedx-shop-trust-bar__item {
	display: flex;
	align-items: center;
	gap: 0.75rem;
	min-width: 0;
}

.shopmedx-shop-trust-bar__icon {
	flex-shrink: 0;
	width: 2.5rem;
	height: 2.5rem;
	display: flex;
	align-items: center;
	justify-content: center;
	border: 1px solid #bfdbfe;
	border-radius: var(--radius-md);
	background: rgba(239, 246, 255, 0.6);
	color: var(--color-primary);
}

.shopmedx-shop-trust-bar__svg {
	width: 1.25rem;
	height: 1.25rem;
	flex-shrink: 0;
}

.shopmedx-shop-trust-bar__title {
	font-size: 0.75rem;
	font-weight: 700;
	color: var(--color-navy);
	line-height: 1.25;
}

.shopmedx-shop-trust-bar__subtitle {
	font-size: 0.6875rem;
	color: var(--color-text-muted);
	line-height: 1.3;
}

@media (max-width: 1024px) {
	.shopmedx-quote-hero__grid,
	.shopmedx-quote-main__grid {
		grid-template-columns: 1fr;
	}

	.shopmedx-quote-hero__visual {
		justify-self: stretch;
		max-width: none;
	}

	.shopmedx-quote-process__steps {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.shopmedx-shop-trust-bar__grid {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}

@media (max-width: 768px) {
	.shopmedx-quote-assist__inner {
		flex-direction: column;
		align-items: flex-start;
	}

	.shopmedx-quote-assist__btn {
		width: 100%;
		justify-content: center;
	}

	.shopmedx-quote-builder__search-row {
		grid-template-columns: 1fr;
	}

	.shopmedx-quote-process__steps {
		grid-template-columns: 1fr;
	}

	.shopmedx-trust-bar__grid,
	.shopmedx-trust-bar--4 .shopmedx-trust-bar__grid,
	.shopmedx-trust-bar--5 .shopmedx-trust-bar__grid {
		grid-template-columns: 1fr;
	}

	.shopmedx-trust-bar .shopmedx-container {
		padding-inline: 1rem;
	}

	.shopmedx-trust-bar__item:not(:last-child) {
		border-right: none;
		border-bottom: 1px solid #e8edf2;
	}

	.shopmedx-trust-bar__item {
		justify-content: flex-start;
		padding: 0.875rem 0;
	}

	.shopmedx-shop-trust-bar__grid {
		grid-template-columns: 1fr;
	}

	.shopmedx-shop-trust-bar__item {
		padding: 0.5rem 0;
	}
}

/* --------------------------------------------------------------------------
   Newsletter
   -------------------------------------------------------------------------- */

.shopmedx-newsletter {
	padding-block: 2.75rem;
	background: var(--color-primary);
	color: var(--color-white);
}

.shopmedx-newsletter__inner {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr);
	align-items: center;
	gap: 2rem;
}

.shopmedx-newsletter__content {
	display: flex;
	align-items: center;
	gap: 1.25rem;
}

.shopmedx-newsletter__icon-wrap {
	width: 4.5rem;
	height: 4.5rem;
	border-radius: 1rem;
	background: rgba(255, 255, 255, 0.12);
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
}

.shopmedx-newsletter__icon {
	width: 2.25rem;
	height: 2.25rem;
	color: #fff;
}

.shopmedx-newsletter__title,
.shopmedx-newsletter h2,
.shopmedx-newsletter h3 {
	color: var(--color-white);
	margin-bottom: 0.375rem;
	font-size: 1.375rem;
	font-weight: 800;
	line-height: 1.2;
}

.shopmedx-newsletter__text,
.shopmedx-newsletter p {
	color: rgba(255, 255, 255, 0.88);
	margin: 0;
	font-size: 0.875rem;
	line-height: 1.5;
}

.shopmedx-newsletter__form {
	width: 100%;
}

.shopmedx-newsletter__fallback {
	display: flex;
	align-items: stretch;
	gap: 0;
	background: #fff;
	border-radius: var(--radius-md);
	overflow: hidden;
	box-shadow: var(--shadow-sm);
}

.shopmedx-newsletter__fallback input[type="email"] {
	flex: 1;
	border: none;
	padding: 0.875rem 1rem;
	font-size: 0.875rem;
	min-width: 0;
}

.shopmedx-newsletter__fallback .shopmedx-btn {
	border-radius: 0;
	padding-inline: 1.25rem;
	white-space: nowrap;
}

/* --------------------------------------------------------------------------
   Responsive – 1280px
   -------------------------------------------------------------------------- */

@media (max-width: 1280px) {
	.shopmedx-category-grid__items {
		grid-template-columns: repeat(5, minmax(0, 1fr));
	}

	.shopmedx-product-carousel__track > .shopmedx-product-card {
		flex: 0 0 calc(20% - 0.8rem);
	}

	.shopmedx-features-grid__items {
		grid-template-columns: repeat(2, 1fr);
	}

	.shopmedx-b2b-process__steps,
	.shopmedx-quote-process__steps {
		grid-template-columns: repeat(2, 1fr);
	}

	.shopmedx-footer__grid {
		grid-template-columns: 1.5fr repeat(3, 1fr);
	}

	.shopmedx-footer__col:last-child {
		grid-column: span 2;
	}
}

/* --------------------------------------------------------------------------
   Responsive – 1024px
   -------------------------------------------------------------------------- */

@media (max-width: 1024px) {
	.shopmedx-hero__grid,
	.shopmedx-b2b-hero__grid,
	.shopmedx-b2b-banner__grid,
	.shopmedx-b2b-split__grid,
	.shopmedx-contact__grid,
	.shopmedx-contact-faq-map__grid,
	.shopmedx-quote-hero__grid,
	.shopmedx-quote-main__grid {
		grid-template-columns: 1fr;
	}

	.shopmedx-main-header__inner {
		gap: 1rem 1.25rem;
	}

	.shopmedx-search {
		width: min(100%, 28rem);
	}

	.shopmedx-header-action {
		min-width: 3.75rem;
		padding-inline: 0.25rem;
	}

	.shopmedx-top-bar {
		font-size: 0.75rem;
	}

	.shopmedx-category-grid__items {
		grid-template-columns: repeat(3, 1fr);
	}

	.shopmedx-product-carousel__track > .shopmedx-product-card {
		flex: 0 0 calc(25% - 0.75rem);
	}

	.shopmedx-testimonial-card {
		flex: 0 0 calc(50% - 0.5rem);
	}

	.shopmedx-newsletter__inner {
		grid-template-columns: 1fr;
	}

	.shopmedx-b2b-banner__grid {
		grid-template-columns: 1fr;
		min-height: 0;
	}

	.shopmedx-b2b-banner__content {
		padding: 2rem 1.5rem;
	}

	.shopmedx-b2b-banner__media {
		min-height: 14rem;
		order: 2;
	}

	.shopmedx-b2b-banner__features-panel {
		padding: 1.5rem;
		order: 3;
	}

	.shopmedx-b2b-banner__image {
		object-position: center center;
	}

	.shopmedx-b2b-support__grid {
		grid-template-columns: repeat(2, 1fr);
	}

	.shopmedx-b2b-partner__features {
		grid-template-columns: 1fr;
	}

	.shopmedx-b2b-cta__inner {
		flex-direction: column;
		text-align: center;
	}

	.shopmedx-trust-bar__grid,
	.shopmedx-trust-bar--4 .shopmedx-trust-bar__grid,
	.shopmedx-trust-bar--5 .shopmedx-trust-bar__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.shopmedx-trust-bar__item:nth-child(2n):not(:last-child) {
		border-right: none;
	}

	.shopmedx-trust-bar__item:nth-child(-n+2) {
		border-bottom: 1px solid #e8edf2;
	}

	.shopmedx-footer__grid {
		grid-template-columns: 1fr 1fr;
	}

	.shopmedx-footer__brand {
		grid-column: span 2;
	}

	.shopmedx-top-bar__center {
		display: none;
	}

	.shopmedx-header-action__label {
		display: none;
	}

	.shopmedx-header-action {
		min-width: auto;
		padding: 0.375rem;
	}

	.shopmedx-quote-main__grid {
		grid-template-columns: 1fr;
	}
}

/* --------------------------------------------------------------------------
   Responsive – 768px (Mobile)
   -------------------------------------------------------------------------- */

@media (max-width: 768px) {
	:root {
		--container-padding: 1rem;
	}

	.shopmedx-top-bar__right {
		display: none;
	}

	.shopmedx-top-bar__inner {
		grid-template-columns: 1fr;
		justify-items: center;
		padding-block: 0.5rem;
	}

	.shopmedx-top-bar__left {
		justify-self: center;
		justify-content: center;
		width: 100%;
		max-width: 100%;
		flex-wrap: nowrap;
		white-space: nowrap;
		font-size: 0.6875rem;
	}

	.shopmedx-top-bar__left span {
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
	}

	.shopmedx-main-header__inner {
		grid-template-columns: minmax(0, 1fr) auto;
		gap: 0.75rem;
	}

	.shopmedx-logo {
		grid-column: 1;
		grid-row: 1;
		min-width: 0;
	}

	.shopmedx-header-tools {
		grid-column: 2;
		grid-row: 1;
	}

	.shopmedx-search {
		order: unset;
		grid-column: 1 / -1;
		grid-row: 2;
		justify-self: stretch;
		width: 100%;
		max-width: none;
	}

	.shopmedx-mobile-toggle {
		display: flex;
	}

	.shopmedx-nav {
		display: none;
		position: absolute;
		top: 100%;
		left: 0;
		right: 0;
		background: var(--color-white);
		border-bottom: 1px solid var(--color-border);
		box-shadow: var(--shadow-lg);
		max-height: calc(100vh - var(--header-height));
		overflow-y: auto;
	}

	.shopmedx-nav.is-open {
		display: block;
	}

	.shopmedx-primary-menu {
		flex-direction: column;
	}

	.shopmedx-nav-link {
		padding: 0.875rem 0;
		border-bottom: 1px solid var(--color-border);
	}

	.shopmedx-submenu {
		position: static;
		opacity: 1;
		visibility: visible;
		transform: none;
		box-shadow: none;
		border: none;
		border-radius: 0;
		padding-left: 1rem;
		display: none;
	}

	.menu-item-has-children.is-open > .shopmedx-submenu {
		display: block;
	}

	.menu-item-has-children:hover > .shopmedx-submenu {
		transform: none;
	}

	.shopmedx-hero {
		padding-block: 2rem;
	}

	.shopmedx-hero--bg {
		min-height: auto;
		padding-block: 2.5rem 2rem;
	}

	.shopmedx-hero--bg__overlay {
		background: linear-gradient(
			180deg,
			rgba(255, 255, 255, 0.96) 0%,
			rgba(255, 255, 255, 0.88) 55%,
			rgba(255, 255, 255, 0.72) 100%
		);
	}

	.shopmedx-hero--bg__image {
		object-position: 70% center;
	}

	.shopmedx-hero--bg .shopmedx-hero__content {
		max-width: none;
	}

	.shopmedx-hero__chips {
		grid-template-columns: 1fr;
	}

	.shopmedx-hero__media {
		order: -1;
		justify-content: center;
	}

	.shopmedx-hero-visual {
		margin-inline: auto;
		max-width: 100%;
	}

	.shopmedx-category-grid__items {
		grid-template-columns: repeat(2, 1fr);
	}

	.shopmedx-product-carousel__viewport {
		grid-template-columns: 1fr;
	}

	.shopmedx-product-carousel__arrow,
	.shopmedx-testimonials__arrow {
		display: none;
	}

	.shopmedx-testimonials__viewport {
		grid-template-columns: 1fr;
	}

	.shopmedx-product-carousel__track > .shopmedx-product-card {
		flex: 0 0 calc(50% - 0.5rem);
		min-width: 9.5rem;
	}

	.shopmedx-features-grid__items,
	.shopmedx-b2b-support__grid,
	.shopmedx-b2b-process__steps,
	.shopmedx-quote-process__steps {
		grid-template-columns: 1fr;
	}

	.shopmedx-contact-cards {
		grid-template-columns: 1fr;
	}

	.shopmedx-faq {
		grid-template-columns: 1fr;
	}

	.shopmedx-faq__sidebar {
		flex-direction: row;
		flex-wrap: nowrap;
		overflow-x: auto;
		border-right: none;
		border-bottom: 1px solid var(--color-border);
	}

	.shopmedx-faq__tab {
		white-space: nowrap;
		flex-shrink: 0;
	}

	.shopmedx-trust-bar__grid,
	.shopmedx-trust-bar--4 .shopmedx-trust-bar__grid,
	.shopmedx-trust-bar--5 .shopmedx-trust-bar__grid {
		grid-template-columns: 1fr;
	}

	.shopmedx-trust-bar__item:not(:last-child) {
		border-right: none;
		border-bottom: 1px solid #e8edf2;
	}

	.shopmedx-trust-bar__item {
		justify-content: flex-start;
		padding: 0.75rem 0;
	}

	.shopmedx-shop-trust-bar__grid {
		grid-template-columns: 1fr;
	}

	.shopmedx-footer__grid {
		grid-template-columns: 1fr;
	}

	.shopmedx-footer__brand {
		grid-column: auto;
	}

	.shopmedx-footer__bottom {
		flex-direction: column;
		text-align: center;
	}

	.shopmedx-testimonial-card {
		flex: 0 0 100%;
	}

	.shopmedx-section-header {
		flex-direction: column;
		align-items: flex-start;
	}

	.shopmedx-quote-builder__item {
		grid-template-columns: 1fr;
	}
}


/* --------------------------------------------------------------------------
   Mega Menu (Categories / Brands)
   -------------------------------------------------------------------------- */

/* Anchor the panel to the nav bar, not the menu item. The base theme sets
   `.shopmedx-primary-menu > li { position: relative }`, which is more
   specific than a single class, so the override has to match it. */
.shopmedx-nav {
	position: relative;
}

.shopmedx-primary-menu > li.shopmedx-menu-item--mega {
	position: static;
}

.shopmedx-mega {
	position: absolute;
	top: 100%;
	left: 50%;
	transform: translateX(-50%) translateY(-4px);
	width: min(64rem, calc(100vw - 3rem));
	z-index: 60;
	background: var(--color-white);
	border: 1px solid var(--color-border);
	border-radius: var(--radius-lg);
	box-shadow: var(--shadow-lg);
	opacity: 0;
	visibility: hidden;
	transition: opacity var(--transition), transform var(--transition), visibility var(--transition);
}

.shopmedx-primary-menu > li.shopmedx-menu-item--mega:hover > .shopmedx-mega,
.shopmedx-primary-menu > li.shopmedx-menu-item--mega:focus-within > .shopmedx-mega,
.shopmedx-primary-menu > li.shopmedx-menu-item--mega.is-open > .shopmedx-mega {
	opacity: 1;
	visibility: visible;
	transform: translateX(-50%) translateY(0);
}

/* Keeps the panel reachable while the pointer travels down to it. */
.shopmedx-mega::before {
	content: '';
	position: absolute;
	top: -0.75rem;
	left: 0;
	right: 0;
	height: 0.75rem;
}

.shopmedx-mega__inner {
	padding: 1.5rem;
}

.shopmedx-mega__grid {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 0.5rem 1rem;
}

.shopmedx-mega__item {
	display: flex;
	align-items: center;
	gap: 0.75rem;
	min-width: 0;
	padding: 0.625rem 0.75rem;
	border-radius: var(--radius-md);
	color: var(--color-navy);
	text-decoration: none;
	font-size: 0.875rem;
	font-weight: 500;
	line-height: 1.3;
	transition: background var(--transition), color var(--transition);
}

.shopmedx-mega__item:hover {
	background: var(--color-primary-light);
	color: var(--color-primary);
}

.shopmedx-mega__icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 2.25rem;
	height: 2.25rem;
	flex: 0 0 2.25rem;
	border-radius: 50%;
	background: var(--color-bg);
	color: var(--color-primary);
	transition: background var(--transition);
}

.shopmedx-mega__item:hover .shopmedx-mega__icon {
	background: var(--color-white);
}

.shopmedx-mega__icon-svg {
	width: 1.125rem;
	height: 1.125rem;
}

.shopmedx-mega__label {
	min-width: 0;
}

/* Three columns: brand names such as "Cardinal Health" and
   "McKesson Brand" need more room than a category label. */
.shopmedx-mega--brands {
	width: min(46rem, calc(100vw - 3rem));
}

.shopmedx-mega__brands {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 0.5rem 1rem;
}

.shopmedx-mega__brand {
	display: block;
	min-width: 0;
	padding: 0.625rem 0.75rem;
	border-radius: var(--radius-md);
	color: var(--color-navy);
	text-decoration: none;
	font-size: 0.875rem;
	font-weight: 500;
	line-height: 1.3;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	transition: background var(--transition), color var(--transition);
}

.shopmedx-mega__brand:hover {
	background: var(--color-primary-light);
	color: var(--color-primary);
}

.shopmedx-mega__footer {
	margin-top: 1rem;
	padding-top: 0.875rem;
	border-top: 1px solid var(--color-border);
	text-align: right;
}

.shopmedx-mega__view-all {
	display: inline-block;
	font-size: 0.8125rem;
	font-weight: 600;
	color: var(--color-primary);
	text-decoration: none;
	white-space: nowrap;
}

.shopmedx-mega__view-all:hover {
	text-decoration: underline;
}

/* --------------------------------------------------------------------------
   Shop All Categories page
   -------------------------------------------------------------------------- */

.shopmedx-departments {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 1.25rem;
	margin-block: 1.5rem 2rem;
}

.shopmedx-department-card {
	display: flex;
	flex-direction: column;
	padding: 1.25rem;
	background: var(--color-white);
	border: 1px solid var(--color-border);
	border-radius: var(--radius-lg);
	box-shadow: var(--shadow-sm);
}

.shopmedx-department-card__head {
	display: flex;
	align-items: center;
	gap: 0.75rem;
	text-decoration: none;
	color: var(--color-navy);
}

.shopmedx-department-card__icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 2.5rem;
	height: 2.5rem;
	flex-shrink: 0;
	border-radius: 50%;
	background: var(--color-bg);
	color: var(--color-primary);
}

.shopmedx-department-card__title {
	font-size: 1rem;
	font-weight: 700;
}

.shopmedx-department-card__list {
	list-style: none;
	margin: 0.875rem 0 0;
	padding: 0;
	display: grid;
	gap: 0.35rem;
}

.shopmedx-department-card__list a {
	font-size: 0.8125rem;
	color: var(--color-text-muted);
	text-decoration: none;
}

.shopmedx-department-card__list a:hover {
	color: var(--color-primary);
}

.shopmedx-department-card__link {
	margin-top: auto;
	padding-top: 0.875rem;
	font-size: 0.8125rem;
	font-weight: 600;
	color: var(--color-primary);
	text-decoration: none;
}

.shopmedx-department-card__link:hover {
	text-decoration: underline;
}

/* --------------------------------------------------------------------------
   Shop by Brand page
   -------------------------------------------------------------------------- */

.shopmedx-brands-toolbar {
	display: flex;
	flex-direction: column;
	gap: 1rem;
	margin-block: 1.5rem;
}

.shopmedx-brands-search {
	position: relative;
	max-width: 26rem;
}

.shopmedx-brands-search__icon {
	position: absolute;
	left: 0.875rem;
	top: 50%;
	transform: translateY(-50%);
	width: 1rem;
	height: 1rem;
	color: var(--color-text-muted);
	pointer-events: none;
}

.shopmedx-brands-search__input {
	width: 100%;
	padding: 0.7rem 0.875rem 0.7rem 2.5rem;
	border: 1px solid var(--color-border);
	border-radius: var(--radius-md, 8px);
	font-size: 0.875rem;
	font-family: inherit;
}

.shopmedx-brands-search__input:focus {
	outline: none;
	border-color: var(--color-primary);
	box-shadow: 0 0 0 3px rgba(2, 82, 156, 0.12);
}

.shopmedx-brands-az {
	display: flex;
	flex-wrap: wrap;
	gap: 0.25rem;
}

.shopmedx-brands-az__link {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 1.85rem;
	height: 1.85rem;
	padding: 0 0.35rem;
	border: 1px solid var(--color-border);
	border-radius: var(--radius-md, 8px);
	font-size: 0.8125rem;
	font-weight: 600;
	color: var(--color-primary);
	text-decoration: none;
	background: var(--color-white);
}

.shopmedx-brands-az__link:hover {
	background: var(--color-primary);
	border-color: var(--color-primary);
	color: var(--color-white);
}

.shopmedx-brands-az__link.is-disabled {
	color: var(--color-text-muted);
	opacity: 0.45;
	background: transparent;
	pointer-events: none;
}

.shopmedx-brand-group {
	margin-bottom: 1.75rem;
	scroll-margin-top: 6rem;
}

.shopmedx-brand-group__letter {
	font-size: 1.125rem;
	font-weight: 800;
	color: var(--color-navy);
	margin-bottom: 0.75rem;
	padding-bottom: 0.35rem;
	border-bottom: 2px solid var(--color-border);
}

.shopmedx-brand-grid {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 0.875rem;
}

.shopmedx-brand-card {
	display: flex;
	flex-direction: column;
	gap: 0.2rem;
	padding: 0.875rem 1rem;
	background: var(--color-white);
	border: 1px solid var(--color-border);
	border-radius: var(--radius-lg);
	text-decoration: none;
	transition: border-color var(--transition), box-shadow var(--transition);
}

.shopmedx-brand-card:hover {
	border-color: var(--color-primary);
	box-shadow: var(--shadow-sm);
}

.shopmedx-brand-card__name {
	font-size: 0.9375rem;
	font-weight: 700;
	color: var(--color-navy);
}

.shopmedx-brand-card__count {
	font-size: 0.75rem;
	color: var(--color-text-muted);
}

.shopmedx-brands-empty {
	padding: 1.5rem 0;
	color: var(--color-text-muted);
}

@media (max-width: 1024px) {
	.shopmedx-mega {
		width: calc(100vw - 2rem);
	}

	.shopmedx-mega__grid,
	.shopmedx-mega__brands {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}

	.shopmedx-departments,
	.shopmedx-brand-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 768px) {
	.shopmedx-mega {
		position: static;
		width: 100%;
		opacity: 1;
		visibility: visible;
		transform: none;
		box-shadow: none;
		border: 0;
		border-radius: 0;
		display: none;
	}

	.shopmedx-primary-menu > li.shopmedx-menu-item--mega.is-open > .shopmedx-mega {
		display: block;
		transform: none;
	}

	.shopmedx-mega::before {
		display: none;
	}

	.shopmedx-mega__inner {
		padding: 0.5rem 0 0.75rem;
	}

	.shopmedx-mega__grid,
	.shopmedx-mega__brands {
		grid-template-columns: 1fr;
	}

	.shopmedx-mega__footer {
		text-align: left;
	}

	.shopmedx-departments,
	.shopmedx-brand-grid {
		grid-template-columns: 1fr;
	}
}


/* == shopmedx mobile nav v2 == */
@media (max-width: 768px) {

	/* The nav bar becomes a dropdown panel under the header. */
	.shopmedx-nav .shopmedx-container {
		display: block;
		min-height: 0;
		padding-inline: 0;
	}

	.shopmedx-primary-menu {
		display: block;
		width: 100%;
		gap: 0;
		justify-content: flex-start;
	}

	.shopmedx-primary-menu > li,
	.shopmedx-primary-menu > li.shopmedx-menu-item--mega {
		display: block;
		width: 100%;
		position: static;
	}

	/* Top-level rows */
	.shopmedx-primary-menu > li > .shopmedx-nav-link {
		display: flex;
		align-items: center;
		justify-content: space-between;
		width: 100%;
		padding: 0.9375rem 1.25rem;
		margin: 0;
		font-size: 0.9375rem;
		font-weight: 600;
		color: var(--color-navy);
		border-bottom: 1px solid var(--color-border);
	}

	.shopmedx-primary-menu > li:first-child > .shopmedx-nav-link {
		padding-left: 1.25rem;
	}

	/* Business Solutions keeps its emphasis but as a full-width row. */
	.shopmedx-primary-menu > li > .shopmedx-nav-link--business {
		margin: 0.75rem 1.25rem;
		width: calc(100% - 2.5rem);
		justify-content: center;
		border-radius: var(--radius-sm);
		border-bottom: 0;
	}

	.shopmedx-nav-chevron {
		width: 1.125rem;
		height: 1.125rem;
		flex-shrink: 0;
		transition: transform var(--transition);
	}

	.shopmedx-primary-menu > li.is-open > .shopmedx-nav-link .shopmedx-nav-chevron {
		transform: rotate(180deg);
	}

	.shopmedx-primary-menu > li.is-open > .shopmedx-nav-link {
		color: var(--color-primary);
		background: var(--color-primary-light);
	}

	/* The mega panel drops inline, full width, no card chrome. */
	.shopmedx-mega,
	.shopmedx-primary-menu > li.shopmedx-menu-item--mega > .shopmedx-mega {
		position: static;
		width: 100%;
		max-width: none;
		left: auto;
		right: auto;
		top: auto;
		transform: none;
		opacity: 1;
		visibility: visible;
		display: none;
		background: var(--color-bg);
		border: 0;
		border-bottom: 1px solid var(--color-border);
		border-radius: 0;
		box-shadow: none;
	}

	.shopmedx-primary-menu > li.shopmedx-menu-item--mega.is-open > .shopmedx-mega {
		display: block;
		transform: none;
	}

	/* Hover must not open panels on touch devices. */
	.shopmedx-primary-menu > li.shopmedx-menu-item--mega:hover > .shopmedx-mega,
	.shopmedx-primary-menu > li.shopmedx-menu-item--mega:focus-within > .shopmedx-mega {
		display: none;
	}

	.shopmedx-primary-menu > li.shopmedx-menu-item--mega.is-open:hover > .shopmedx-mega,
	.shopmedx-primary-menu > li.shopmedx-menu-item--mega.is-open:focus-within > .shopmedx-mega {
		display: block;
	}

	.shopmedx-mega::before {
		display: none;
	}

	.shopmedx-mega__inner {
		padding: 0.5rem 0;
	}

	.shopmedx-mega__grid,
	.shopmedx-mega__brands {
		display: block;
	}

	/* Single-column rows, comfortable tap targets. */
	.shopmedx-mega__item {
		gap: 0.75rem;
		padding: 0.75rem 1.25rem 0.75rem 1.5rem;
		border-radius: 0;
		font-size: 0.875rem;
		font-weight: 500;
	}

	.shopmedx-mega__item + .shopmedx-mega__item {
		border-top: 1px solid rgba(226, 232, 240, 0.7);
	}

	.shopmedx-mega__icon {
		width: 1.75rem;
		height: 1.75rem;
		flex: 0 0 1.75rem;
		background: var(--color-white);
	}

	.shopmedx-mega__icon-svg {
		width: 0.9375rem;
		height: 0.9375rem;
	}

	.shopmedx-mega__brand {
		padding: 0.75rem 1.25rem 0.75rem 1.5rem;
		border-radius: 0;
		white-space: normal;
	}

	.shopmedx-mega__brand + .shopmedx-mega__brand {
		border-top: 1px solid rgba(226, 232, 240, 0.7);
	}

	.shopmedx-mega__footer {
		margin: 0;
		padding: 0.875rem 1.25rem 0.875rem 1.5rem;
		text-align: left;
		border-top: 1px solid var(--color-border);
		background: var(--color-white);
	}

	/* Plain (non-mega) submenus follow the same shape. */
	.shopmedx-submenu {
		padding-left: 0;
		background: var(--color-bg);
	}

	.shopmedx-submenu .shopmedx-nav-link {
		padding: 0.75rem 1.25rem 0.75rem 1.5rem;
		border-bottom: 1px solid rgba(226, 232, 240, 0.7);
	}

	/* Panel scrolls rather than pushing the page. */
	.shopmedx-nav {
		max-height: calc(100vh - var(--header-height));
		overflow-y: auto;
		-webkit-overflow-scrolling: touch;
	}
}


/* == shopmedx mobile overflow fix == */
@media (max-width: 768px) {
	/* Nothing may exceed the viewport width. */
	html,
	body {
		max-width: 100%;
		overflow-x: hidden;
	}

	.shopmedx-header,
	.shopmedx-main-header,
	.shopmedx-top-bar {
		max-width: 100%;
	}

	.shopmedx-main-header__inner {
		grid-template-columns: minmax(0, 1fr) auto;
		gap: 0.625rem 0.75rem;
		align-items: center;
	}

	/* Both grid children must be allowed to shrink. */
	.shopmedx-main-header__inner > * {
		min-width: 0;
	}

	.shopmedx-header-tools {
		display: flex;
		align-items: center;
		gap: 0.375rem;
		flex-shrink: 0;
	}

	.shopmedx-header-actions {
		gap: 0.25rem;
	}

	/* Labels ("My Account", "Contact Us", "Cart") cost too much width. */
	.shopmedx-header-action__label {
		display: none;
	}

	.shopmedx-header-action {
		min-width: 0;
		padding-inline: 0.375rem;
	}

	.shopmedx-logo__image {
		max-width: 100%;
		height: auto;
	}

	.shopmedx-logo__tagline {
		display: none;
	}

	.shopmedx-search {
		min-width: 0;
		max-width: 100%;
	}

	.shopmedx-search__form {
		width: 100%;
		max-width: 100%;
	}

	.shopmedx-search__input {
		min-width: 0;
		width: 100%;
	}

	.shopmedx-top-bar__inner {
		max-width: 100%;
		padding-inline: 1rem;
	}

	.shopmedx-top-bar__left {
		min-width: 0;
	}
}

@media (max-width: 380px) {
	/* Very narrow phones: trim the icon row further. */
	.shopmedx-header-action {
		padding-inline: 0.25rem;
	}

	.shopmedx-header-actions {
		gap: 0.125rem;
	}

	.shopmedx-mega__item,
	.shopmedx-mega__brand {
		padding-left: 1rem;
		padding-right: 1rem;
	}

	.shopmedx-primary-menu > li > .shopmedx-nav-link {
		padding-inline: 1rem;
	}
}


/* == shopmedx hero image blend == */
/* The hero visual is no longer a card: no shadow, no border, no panel
   tint. The image itself feathers out on every edge so it merges with
   the section background. */

.shopmedx-hero-visual__frame {
	background: none;
	border: 0;
	box-shadow: none;
	border-radius: 0;
	padding: 0;
	overflow: visible;
}

/* Feather the slider (and its images) on all four edges. */
.shopmedx-hero-visual__frame--slider-only,
.shopmedx-hero-slider {
	background: none;
	border: 0;
	box-shadow: none;
	border-radius: 0;
}

.shopmedx-hero-slider {
	-webkit-mask-image:
		linear-gradient(to right, transparent 0%, #000 12%, #000 88%, transparent 100%),
		linear-gradient(to bottom, transparent 0%, #000 12%, #000 88%, transparent 100%);
	-webkit-mask-composite: source-in;
	mask-image:
		linear-gradient(to right, transparent 0%, #000 12%, #000 88%, transparent 100%),
		linear-gradient(to bottom, transparent 0%, #000 12%, #000 88%, transparent 100%);
	mask-composite: intersect;
}

/* Keep the dots crisp - they must not fade with the picture. */
.shopmedx-hero-slider__dots {
	-webkit-mask-image: none;
	mask-image: none;
}

/* Plain (non-slider) hero image. */
.shopmedx-hero__image {
	border-radius: 0;
	box-shadow: none;
	-webkit-mask-image:
		linear-gradient(to right, transparent 0%, #000 12%, #000 88%, transparent 100%),
		linear-gradient(to bottom, transparent 0%, #000 12%, #000 88%, transparent 100%);
	-webkit-mask-composite: source-in;
	mask-image:
		linear-gradient(to right, transparent 0%, #000 12%, #000 88%, transparent 100%),
		linear-gradient(to bottom, transparent 0%, #000 12%, #000 88%, transparent 100%);
	mask-composite: intersect;
}

/* Business Solutions hero image. */
.shopmedx-b2b-hero__image {
	border-radius: 0;
	box-shadow: none;
	-webkit-mask-image:
		linear-gradient(to right, transparent 0%, #000 12%, #000 88%, transparent 100%),
		linear-gradient(to bottom, transparent 0%, #000 12%, #000 88%, transparent 100%);
	-webkit-mask-composite: source-in;
	mask-image:
		linear-gradient(to right, transparent 0%, #000 12%, #000 88%, transparent 100%),
		linear-gradient(to bottom, transparent 0%, #000 12%, #000 88%, transparent 100%);
	mask-composite: intersect;
}

/* On small screens the image is nearly full-bleed, so soften the fade to
   avoid eating too much of the picture. */
@media (max-width: 768px) {
	.shopmedx-hero-slider,
	.shopmedx-hero__image,
	.shopmedx-b2b-hero__image {
		-webkit-mask-image:
			linear-gradient(to right, transparent 0%, #000 8%, #000 92%, transparent 100%),
			linear-gradient(to bottom, transparent 0%, #000 8%, #000 92%, transparent 100%);
		mask-image:
			linear-gradient(to right, transparent 0%, #000 8%, #000 92%, transparent 100%),
			linear-gradient(to bottom, transparent 0%, #000 8%, #000 92%, transparent 100%);
	}
}


/* == shopmedx b2b split + cta design match == */

/* Narrower "Who We Serve" column, wider partner panel (as per design). */
.shopmedx-b2b-split__grid {
	grid-template-columns: minmax(0, 0.85fr) minmax(0, 2fr);
	gap: 1.5rem;
	align-items: start;
}

/* ---- Who We Serve: light card ---- */
.shopmedx-b2b-serve {
	background: #f1f6fc;
	color: var(--color-text);
	border: 1px solid rgba(191, 219, 254, 0.7);
	padding: 1.5rem;
}

.shopmedx-b2b-serve h3 {
	color: var(--color-navy);
	font-size: 1.125rem;
	margin-bottom: 1rem;
}

.shopmedx-b2b-serve__list {
	list-style: none;
	margin: 0;
	padding: 0;
}

.shopmedx-b2b-serve__list li {
	border-bottom: 0;
	padding: 0.5rem 0;
	font-size: 0.875rem;
	color: var(--color-text);
	gap: 0.625rem;
}

.shopmedx-b2b-serve__icon {
	color: var(--color-primary);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 1.5rem;
	height: 1.5rem;
}

.shopmedx-b2b-serve__icon svg {
	width: 1.125rem;
	height: 1.125rem;
}

/* ---- Why Partner: dark navy panel, four columns ---- */
.shopmedx-b2b-partner {
	background: var(--color-navy);
	border: 0;
	color: var(--color-white);
	padding: 1.75rem;
}

.shopmedx-b2b-partner h3 {
	color: var(--color-white);
	font-size: 1.125rem;
	margin-bottom: 1.25rem;
}

.shopmedx-b2b-partner__features {
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 1.25rem;
	margin-bottom: 1.25rem;
}

.shopmedx-b2b-partner__feature {
	position: relative;
	padding-right: 1.25rem;
}

/* Thin dividers between the four features, as in the design. */
.shopmedx-b2b-partner__feature:not(:last-child)::after {
	content: '';
	position: absolute;
	top: 0.25rem;
	bottom: 0.25rem;
	right: 0;
	width: 1px;
	background: rgba(255, 255, 255, 0.15);
}

.shopmedx-b2b-partner__feature-icon {
	width: auto;
	height: auto;
	justify-content: flex-start;
	background: none;
	color: var(--color-white);
	margin-bottom: 0.625rem;
}

.shopmedx-b2b-partner__feature-icon svg {
	width: 1.75rem;
	height: 1.75rem;
}

.shopmedx-b2b-partner__feature h4 {
	color: var(--color-white);
	font-size: 0.9375rem;
	margin-bottom: 0.375rem;
}

.shopmedx-b2b-partner__feature p {
	color: rgba(255, 255, 255, 0.75);
	font-size: 0.8125rem;
	line-height: 1.5;
	margin: 0;
}

/* Testimonial sits inside the dark panel on a slightly lighter block. */
.shopmedx-b2b-quote {
	background: rgba(255, 255, 255, 0.06);
	border-radius: var(--radius-md);
	padding: 1.125rem 1.25rem;
	margin: 0;
}

.shopmedx-b2b-quote p {
	color: var(--color-white);
	font-style: italic;
	font-size: 0.875rem;
	margin-bottom: 0.5rem;
}

.shopmedx-b2b-quote cite {
	color: rgba(255, 255, 255, 0.7);
	font-size: 0.8125rem;
	font-style: normal;
}

.shopmedx-b2b-partner__nav {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 0.75rem;
	margin-top: 0.875rem;
}

.shopmedx-b2b-partner__nav .shopmedx-carousel-dot {
	background: rgba(255, 255, 255, 0.3);
}

.shopmedx-b2b-partner__nav .shopmedx-carousel-dot.is-active {
	background: var(--color-white);
}

.shopmedx-b2b-partner__nav .shopmedx-carousel-nav__btn {
	background: var(--color-primary);
	border-color: var(--color-primary);
	color: var(--color-white);
}

/* ---- Ready to Get Started: light blue banner with product image ---- */
.shopmedx-b2b-cta__inner {
	background: #eaf2fc;
	color: var(--color-text);
	border-radius: var(--radius-lg);
	padding: 1.5rem 2rem;
	gap: 1.75rem;
}

.shopmedx-b2b-cta__media {
	flex: 0 0 auto;
	line-height: 0;
}

.shopmedx-b2b-cta__image {
	width: auto;
	height: auto;
	max-height: 130px;
	max-width: 220px;
	border-radius: 0;
	object-fit: contain;
}

.shopmedx-b2b-cta__content h3 {
	color: var(--color-navy);
	font-size: 1.375rem;
	margin-bottom: 0.5rem;
}

.shopmedx-b2b-cta__content p {
	color: var(--color-text);
	font-size: 0.9375rem;
	max-width: 34rem;
}

/* Stack the two buttons, primary solid over outline, as per design. */
.shopmedx-b2b-cta__actions {
	flex-direction: column;
	gap: 0.625rem;
	min-width: 13rem;
}

.shopmedx-b2b-cta__actions .shopmedx-btn {
	width: 100%;
	justify-content: center;
}

.shopmedx-b2b-cta__actions .shopmedx-btn--outline {
	background: var(--color-white);
	border-color: var(--color-primary);
	color: var(--color-primary);
}

/* ---- Responsive ---- */
@media (max-width: 1024px) {
	.shopmedx-b2b-split__grid {
		grid-template-columns: 1fr;
	}

	.shopmedx-b2b-partner__features {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.shopmedx-b2b-partner__feature:nth-child(2n)::after {
		display: none;
	}
}

@media (max-width: 768px) {
	.shopmedx-b2b-partner__features {
		grid-template-columns: 1fr;
	}

	.shopmedx-b2b-partner__feature::after {
		display: none;
	}

	.shopmedx-b2b-partner__feature {
		padding-right: 0;
	}

	.shopmedx-b2b-cta__inner {
		flex-direction: column;
		text-align: center;
		padding: 1.5rem;
	}

	.shopmedx-b2b-cta__actions {
		width: 100%;
		min-width: 0;
	}

	.shopmedx-b2b-cta__image {
		max-height: 110px;
	}
}


/* == shopmedx b2b cta media slot == */
.shopmedx-b2b-cta__media {
	flex: 0 0 200px;
	width: 200px;
	min-height: 130px;
	display: flex;
	align-items: center;
	justify-content: center;
	line-height: 0;
}

.shopmedx-b2b-cta__image {
	width: 100%;
	height: auto;
	max-height: 130px;
	max-width: 200px;
	border-radius: 0;
	object-fit: contain;
}

/* Neutral stand-in while no CTA image is set. */
.shopmedx-b2b-cta__placeholder {
	width: 100%;
	height: 118px;
	display: flex;
	align-items: center;
	justify-content: center;
	border: 1px dashed rgba(2, 82, 156, 0.28);
	border-radius: var(--radius-md);
	background: rgba(255, 255, 255, 0.55);
	color: rgba(2, 82, 156, 0.45);
}

.shopmedx-b2b-cta__placeholder-icon {
	width: 2.25rem;
	height: 2.25rem;
}

@media (max-width: 768px) {
	.shopmedx-b2b-cta__media {
		flex: 0 0 auto;
		width: 100%;
		max-width: 220px;
		margin-inline: auto;
		min-height: 0;
	}

	.shopmedx-b2b-cta__placeholder {
		height: 100px;
	}
}


/* == shopmedx footer design match == */

/* Vertical rules between the four link columns. */
.shopmedx-footer__col {
	position: relative;
}

.shopmedx-footer__col + .shopmedx-footer__col::before,
.shopmedx-footer__grid > .shopmedx-footer__col:first-of-type::before {
	content: '';
	position: absolute;
	left: -1rem;
	top: 0.15rem;
	bottom: 0.15rem;
	width: 1px;
	background: rgba(255, 255, 255, 0.14);
}

.shopmedx-footer__heading {
	font-size: 0.8125rem;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--color-white);
	margin-bottom: 0.875rem;
}

.shopmedx-footer-menu li {
	margin-bottom: 0.5rem;
}

.shopmedx-footer-menu a {
	font-size: 0.875rem;
	color: rgba(255, 255, 255, 0.8);
	text-decoration: none;
	transition: color var(--transition);
}

.shopmedx-footer-menu a:hover {
	color: var(--color-white);
}

/* ---- Social: circular buttons with real brand marks ---- */
.shopmedx-footer__social {
	display: flex;
	flex-wrap: wrap;
	gap: 0.625rem;
	margin-top: 1.125rem;
}

.shopmedx-footer__social-link {
	width: 2.25rem;
	height: 2.25rem;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.12);
	color: var(--color-white);
	text-decoration: none;
	font-size: 0.8125rem;
	font-weight: 700;
	transition: background var(--transition), transform var(--transition);
}

.shopmedx-footer__social-link:hover {
	background: var(--color-primary);
	transform: translateY(-1px);
}

.shopmedx-footer__social-icon {
	width: 1.125rem;
	height: 1.125rem;
}

/* ---- Payments: white card badges ---- */
.shopmedx-footer__payments {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.5rem;
}

.shopmedx-footer__payment {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 2.75rem;
	height: 1.625rem;
	padding: 0 0.5rem;
	border-radius: 4px;
	background: var(--color-white);
	color: #1e293b;
	font-size: 0.625rem;
	font-weight: 700;
	letter-spacing: 0.01em;
	white-space: nowrap;
	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.18);
}

/* Brand tints so the row reads at a glance, as in the design. */
.shopmedx-footer__payment--visa       { color: #1a1f71; }
.shopmedx-footer__payment--mastercard { color: #eb001b; }
.shopmedx-footer__payment--amex       { color: #006fcf; }
.shopmedx-footer__payment--paypal     { color: #003087; }
.shopmedx-footer__payment--applepay   { color: #000000; }
.shopmedx-footer__payment--googlepay  { color: #5f6368; }

.shopmedx-footer__bottom {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	flex-wrap: wrap;
	padding-top: 1.25rem;
	margin-top: 1.75rem;
	border-top: 1px solid rgba(255, 255, 255, 0.12);
}

.shopmedx-footer__copyright,
.shopmedx-footer__secure {
	font-size: 0.8125rem;
	color: rgba(255, 255, 255, 0.75);
	margin: 0;
}

.shopmedx-footer__secure {
	display: inline-flex;
	align-items: center;
	gap: 0.4rem;
}

.shopmedx-footer__secure-icon {
	width: 0.9375rem;
	height: 0.9375rem;
}

@media (max-width: 1024px) {
	.shopmedx-footer__col + .shopmedx-footer__col::before,
	.shopmedx-footer__grid > .shopmedx-footer__col:first-of-type::before {
		display: none;
	}
}

@media (max-width: 768px) {
	.shopmedx-footer__bottom {
		flex-direction: column;
		text-align: center;
	}

	.shopmedx-footer__payments {
		justify-content: center;
	}

	.shopmedx-footer__social {
		justify-content: flex-start;
	}
}


/* == shopmedx footer contrast fix == */
/* Beat the older `.shopmedx-footer__payments span` rule. */
.shopmedx-footer .shopmedx-footer__payments span.shopmedx-footer__payment {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 2.75rem;
	height: 1.625rem;
	padding: 0 0.5rem;
	border-radius: 4px;
	background: #ffffff;
	font-size: 0.625rem;
	font-weight: 700;
	white-space: nowrap;
	border: 0;
	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.18);
}

.shopmedx-footer .shopmedx-footer__payments span.shopmedx-footer__payment--visa       { color: #1a1f71; }
.shopmedx-footer .shopmedx-footer__payments span.shopmedx-footer__payment--mastercard { color: #c8102e; }
.shopmedx-footer .shopmedx-footer__payments span.shopmedx-footer__payment--amex       { color: #006fcf; }
.shopmedx-footer .shopmedx-footer__payments span.shopmedx-footer__payment--paypal     { color: #003087; }
.shopmedx-footer .shopmedx-footer__payments span.shopmedx-footer__payment--applepay   { color: #111111; }
.shopmedx-footer .shopmedx-footer__payments span.shopmedx-footer__payment--googlepay  { color: #3c4043; }

/* Keep the footer wordmark legible on navy. */
.shopmedx-footer__logo-text,
.shopmedx-footer__logo-text .shopmedx-logo__x {
	color: var(--color-white);
}

.shopmedx-footer__logo-dotcom {
	color: rgba(255, 255, 255, 0.6);
}


/* == shopmedx footer svg payments == */
/* No vertical rules between the footer link columns. */
.shopmedx-footer__col + .shopmedx-footer__col::before,
.shopmedx-footer__grid > .shopmedx-footer__col:first-of-type::before,
.shopmedx-footer__col::before,
.shopmedx-footer__col::after {
	display: none !important;
	content: none !important;
}

/* ---- Payment badges: white cards holding brand SVGs ---- */
.shopmedx-footer__payments {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.5rem;
}

.shopmedx-footer .shopmedx-footer__payments span.shopmedx-footer__payment {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	height: 1.75rem;
	min-width: 0;
	padding: 0 0.5rem;
	border-radius: 4px;
	background: #ffffff;
	border: 0;
	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.18);
	font-size: 0;
	line-height: 0;
}

.shopmedx-footer__payment-svg {
	display: block;
	height: 0.875rem;
	width: auto;
}

/* Mastercard's mark is circular, so it needs a squarer footprint. */
.shopmedx-footer__payment--mastercard .shopmedx-footer__payment-svg {
	height: 1.125rem;
}

.shopmedx-footer__payment--amex .shopmedx-footer__payment-svg {
	height: 1rem;
}

/* ---- Footer logo: fully white ---- */
.shopmedx-footer__logo-mark path,
.shopmedx-footer__logo-mark circle {
	stroke: #ffffff;
	fill: none;
}

.shopmedx-footer__logo-mark circle {
	fill: #ffffff;
	stroke: none;
}

.shopmedx-footer__logo-text,
.shopmedx-footer__logo-text .shopmedx-logo__x {
	color: #ffffff;
}

.shopmedx-footer__logo-dotcom {
	color: rgba(255, 255, 255, 0.65);
}

@media (max-width: 768px) {
	.shopmedx-footer__payments {
		justify-content: center;
	}
}


/* == shopmedx footer logo white == */
/* Uploaded footer logo (PNG/JPG) forced to solid white on the navy footer. */
.shopmedx-footer__logo-image {
	filter: brightness(0) invert(1);
	max-height: 71px;
	width: auto;
}

/* Inline SVG fallback, if no image is uploaded. */
.shopmedx-footer__logo-mark path {
	stroke: #ffffff;
}

.shopmedx-footer__logo-mark circle {
	fill: #ffffff;
}


/* == shopmedx payment badge sizing == */
/* Amex renders its own filled plate, so let it sit flush in the card. */
.shopmedx-footer__payment--amex .shopmedx-footer__payment-svg {
	height: 1.375rem;
}

.shopmedx-footer .shopmedx-footer__payments span.shopmedx-footer__payment--amex {
	padding: 0 0.25rem;
}

/* Wordmarks that need a little more width to stay legible. */
.shopmedx-footer__payment--paypal .shopmedx-footer__payment-svg,
.shopmedx-footer__payment--googlepay .shopmedx-footer__payment-svg {
	height: 0.8125rem;
}

.shopmedx-footer__payment--visa .shopmedx-footer__payment-svg {
	height: 0.8125rem;
}

.shopmedx-footer__payment--applepay .shopmedx-footer__payment-svg {
	height: 0.9375rem;
}

/* Allow the taller footer logo to size naturally. */
.shopmedx-footer__logo {
	max-width: none;
}


/* == shopmedx footer rules removed == */
/* No horizontal dividers inside the footer. */
.shopmedx-footer__grid {
	border-bottom: 0;
	padding-bottom: 1.75rem;
}

.shopmedx-footer__bottom {
	border-top: 0;
	margin-top: 0;
	padding-top: 0.5rem;
}
