/* =========================================================
   Section: auto_ship_promo (split panel)
   Visual: bag illustration + frequency chips + discount badge.
   ========================================================= */

.auto-ship-promo__inner {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: var(--space-8);
	align-items: center;
}
@media (max-width: 900px) {
	.auto-ship-promo__inner { grid-template-columns: 1fr; gap: var(--space-6); }
	.auto-ship-promo__media { order: -1; }
}

.auto-ship-promo__media {
	margin: 0;
	position: relative;
}

.auto-ship-promo__image {
	position: relative;
	aspect-ratio: 4 / 3;
	border-radius: var(--radius-lg);
	overflow: hidden;
	background: var(--color-bg-subtle);
	box-shadow: var(--shadow-md);
}
.auto-ship-promo__image-placeholder {
	position: absolute; inset: 0;
	background:
		radial-gradient(60% 45% at 50% 100%, rgba(46, 90, 69, 0.18) 0%, transparent 70%),
		radial-gradient(45% 35% at 25% 30%, rgba(250, 244, 232, 0.85) 0%, transparent 70%),
		linear-gradient(135deg, #E2CDA8 0%, #B58F5B 100%);
}

.auto-ship-promo__art {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	color: var(--color-ink-primary);
}

/* Frequency chips */
.auto-ship-promo__chips {
	position: absolute;
	left: var(--space-4);
	bottom: var(--space-4);
	display: flex;
	gap: 6px;
}
.auto-ship-promo__chip {
	display: inline-flex;
	align-items: center;
	height: 32px;
	padding: 0 12px;
	background: var(--color-bg-surface);
	color: var(--color-ink-primary);
	border-radius: var(--radius-pill);
	font-size: var(--fs-caption);
	font-weight: 600;
	box-shadow: var(--shadow-sm);
	border: 1px solid var(--color-border-default);
}
.auto-ship-promo__chip--active {
	background: var(--color-brand-primary);
	color: var(--color-bg-base);
	border-color: var(--color-brand-primary);
}

/* Discount badge */
.auto-ship-promo__discount {
	position: absolute;
	top: var(--space-4);
	right: var(--space-4);
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	width: 84px;
	height: 84px;
	background: var(--color-accent);
	color: var(--color-bg-surface);
	border-radius: 50%;
	box-shadow: var(--shadow-md);
	transform: rotate(-8deg);
}
.auto-ship-promo__discount-num {
	font-family: var(--font-display);
	font-size: 1.5rem;
	font-weight: 600;
	line-height: 1;
}
.auto-ship-promo__discount-label {
	margin-top: 2px;
	font-size: 10px;
	font-weight: 500;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	opacity: 0.95;
}

/* ---------- Copy ---------- */
.auto-ship-promo__copy { max-width: 32rem; }
.auto-ship-promo__eyebrow {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	color: var(--color-brand-primary);
	margin: 0 0 var(--space-3);
}
.auto-ship-promo__title {
	font-family: var(--font-display);
	font-size: clamp(1.875rem, 3.5vw, 2.75rem);
	font-weight: 500;
	color: var(--color-ink-primary);
	letter-spacing: -0.015em;
	line-height: 1.1;
	margin: 0 0 var(--space-3);
	max-width: 15ch;
}
.auto-ship-promo__body {
	color: var(--color-ink-secondary);
	font-size: var(--fs-body-l);
	margin: 0 0 var(--space-5);
	max-width: 46ch;
}

.auto-ship-promo__bullets {
	list-style: none;
	padding: 0;
	margin: 0 0 var(--space-6);
	display: grid;
	gap: var(--space-2);
}
.auto-ship-promo__bullets li {
	display: flex;
	align-items: center;
	gap: 12px;
	font-size: var(--fs-body);
	color: var(--color-ink-primary);
	margin: 0;
}
.auto-ship-promo__check {
	display: inline-flex;
	width: 24px; height: 24px;
	align-items: center;
	justify-content: center;
	background: var(--color-brand-primary);
	color: var(--color-bg-base);
	border-radius: 50%;
	flex: 0 0 auto;
}

.auto-ship-promo__ctas {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: var(--space-4);
}
.auto-ship-promo__proof {
	margin: 0;
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-size: var(--fs-body-s);
	color: var(--color-ink-secondary);
	font-weight: 500;
}
.auto-ship-promo__proof svg { color: var(--color-success); }

@media (max-width: 540px) {
	.auto-ship-promo__discount { width: 68px; height: 68px; top: var(--space-3); right: var(--space-3); }
	.auto-ship-promo__discount-num { font-size: 1.125rem; }
	.auto-ship-promo__chips { left: var(--space-3); bottom: var(--space-3); }
	.auto-ship-promo__chip { font-size: 11px; padding: 0 9px; height: 28px; }
}