/*
 * Altitude kit 3a. Values come from handoff/design-1-2/altitude-3a.html.
 * Every selector is scoped under .al-3a. base.css loads first.
 */

/* ===== Page frame ===== */
.al-3a {
	max-width: 1200px;
	margin-inline: auto;
	background: #fff;
	color: #0b0b0b;
	font-family: 'Instrument Sans', sans-serif;
	font-size: 16px;
	font-weight: 400;
	line-height: normal;
	letter-spacing: normal;
	padding-bottom: 16px;
}
.al-3a .al-heading { color: inherit; font-family: inherit; }
/* The theme sets text-wrap:pretty on p and headings; the handoff wraps normally. */
.al-3a :is(p, h1, h2, h3) { text-wrap: wrap; }
.al-3a .al-appender { grid-column: 1 / -1; }

/* ===== Inline formats ===== */
.al-3a :is(.al-hl-pink, .al-hl-white, .al-hl-ink) {
	padding: 2px 8px;
	border-radius: 7px;
	-webkit-box-decoration-break: clone;
	box-decoration-break: clone;
}
.al-3a .al-hl-pink { background: #fdbcfc; color: #0b0b0b; }
.al-3a .al-hl-white { background: #fff; color: #0b0b0b; }
.al-3a .al-hl-ink { background: #0b0b0b; color: #fff; }

/* H1 "phone + chevrons" pill, drawn entirely in CSS. */
.al-3a .al-dial {
	display: inline-block;
	position: relative;
	top: -4px;
	vertical-align: middle;
	width: 109px;
	height: 56px;
	margin: 0 14px;
	border-radius: 999px;
	background: #132120;
	font-size: 0;
	line-height: 0;
	color: transparent;
	overflow: hidden;
}
.al-3a .al-dial::before,
.al-3a .al-dial::after {
	content: "";
	position: absolute;
	background-repeat: no-repeat;
	background-position: center;
}
.al-3a .al-dial::before {
	left: 5px;
	top: 5px;
	width: 46px;
	height: 46px;
	border-radius: 50%;
	background-color: #a3fb62;
	background-size: 22px 22px;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230b0b0b' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6.5 3.5h3l1.5 4-2 1.3a11 11 0 005.2 5.2l1.3-2 4 1.5v3a2 2 0 01-2 2A15 15 0 014.5 5.5a2 2 0 012-2z'/%3E%3C/svg%3E");
}
.al-3a .al-dial::after {
	left: 61px;
	top: 19px;
	width: 30px;
	height: 18px;
	background-size: 30px 18px;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 26 18' fill='none' stroke='%23fff' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 2l5 7-5 7M10 2l5 7-5 7M18 2l5 7-5 7'/%3E%3C/svg%3E");
}

/* ===== Kicker (tag pill) ===== */
.al-3a .al-kicker {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	border-radius: 999px;
	padding: 6px 13px;
	font-size: 11.5px;
	font-weight: 500;
}
.al-3a .al-kicker__dot {
	display: block;
	width: 4px;
	height: 4px;
	border-radius: 50%;
	flex: none;
}
.al-3a .al-3a-hero .al-kicker { background: #fff; border: 1px solid #e3e3e3; }
.al-3a .al-3a-hero .al-kicker__dot { background: #0b0b0b; }
.al-3a .al-3a-how .al-kicker { background: #1b1b1b; color: #fff; }
.al-3a .al-3a-how .al-kicker__dot { background: #fff; }
.al-3a .al-summary .al-kicker { background: rgba(255, 255, 255, .1); padding: 5px 12px; align-self: flex-start; }
.al-3a .al-summary .al-kicker__dot { background: #fff; }
.al-3a .al-3a-ent .al-kicker { background: #fff; color: #0b0b0b; }
.al-3a .al-3a-ent .al-kicker__dot { background: #0b0b0b; }

/* ===== Buttons ===== */
.al-3a .al-btn {
	border-radius: 999px;
	font-weight: 500;
	line-height: normal;
	text-align: left;
}
.al-3a .al-btn__chip { border-radius: 50%; }
.al-3a .al-btn__chip svg { width: 11px; height: 11px; stroke-width: 1.7; }

/* Colors (hv1 to hv8 mapped below). The chip keeps its colors on hover. */
.al-3a .al-btn--dark { background: #0b0b0b; color: #fff; }
.al-3a .al-btn--dark .al-btn__chip { background: #fff; color: #0b0b0b; }
.al-3a .al-btn--dark:is(:hover, .is-preview-hover) { background: #243230; color: #fff; }

.al-3a .al-btn--outline {
	background: transparent;
	color: #0b0b0b;
	border: 1px solid #0b0b0b;
	height: 52px;
	padding: 0 26px;
	font-size: 14px;
}
.al-3a .al-btn--outline .al-btn__chip { display: none; }
.al-3a .al-btn--outline:is(:hover, .is-preview-hover) { background: #0b0b0b; color: #fff; }

.al-3a .al-btn--lime {
	gap: 12px;
	background: #a3fb62;
	color: #0b0b0b;
	font-size: 13.5px;
	padding: 5px 5px 5px 20px;
}
.al-3a .al-btn--lime .al-btn__chip { width: 32px; height: 32px; background: #0b0b0b; color: #fff; }
.al-3a .al-btn--lime:is(:hover, .is-preview-hover) { background: #fff; color: #0b0b0b; }

.al-3a .al-btn--checkout {
	display: flex;
	justify-content: space-between;
	width: 100%;
	background: #fff;
	color: #0b0b0b;
	font-size: 14px;
	padding: 6px 6px 6px 22px;
	margin-top: 18px;
}
.al-3a .al-btn--checkout .al-btn__chip { background: #0b0b0b; color: #fff; }
.al-3a .al-btn--checkout:is(:hover, .is-preview-hover) { background: #a3fb62; color: #0b0b0b; }

.al-3a .al-btn--submit {
	display: flex;
	justify-content: space-between;
	width: 100%;
	background: #0b0b0b;
	color: #fff;
	font-size: 14px;
	padding: 6px 6px 6px 22px;
	margin-top: auto;
}
.al-3a .al-btn--submit .al-btn__chip { background: #a3fb62; color: #0b0b0b; }
.al-3a .al-btn--submit:is(:hover, .is-preview-hover) { background: #243230; color: #fff; }

/* Large chip (38px, 13px arrow): hero primary, checkout, submit. */
.al-3a :is(.al-btn--checkout, .al-btn--submit) .al-btn__chip,
.al-3a .al-3a-hero .al-btn--dark .al-btn__chip { width: 38px; height: 38px; }
.al-3a :is(.al-btn--checkout, .al-btn--submit) .al-btn__chip svg,
.al-3a .al-3a-hero .al-btn--dark .al-btn__chip svg { width: 13px; height: 13px; }

/* Nav CTA (B1) */
.al-3a .al-3a-nav .al-btn--dark { gap: 12px; font-size: 13px; padding: 5px 5px 5px 18px; }
.al-3a .al-3a-nav .al-btn--dark .al-btn__chip { width: 30px; height: 30px; }
/* Hero primary (B2) */
.al-3a .al-3a-hero .al-btn--dark {
	gap: 14px;
	font-size: 14px;
	padding: 6px 6px 6px 24px;
	box-shadow: 0 14px 26px -10px rgba(0, 0, 0, .5);
}
/* How it works CTA (B3); the footer CTA (B6) has no top margin. */
.al-3a .al-3a-how .al-btn--lime { margin-top: 34px; }

/* ===== Grid-line overlay ===== */
.al-3a .al-gridlines { position: absolute; inset: 0; pointer-events: none; }
.al-3a .al-gridlines > i {
	position: absolute;
	top: 0;
	bottom: 0;
	width: 1px;
	background: rgba(255, 255, 255, .06);
}
.al-3a .al-gridlines > i:nth-of-type(1) { left: 28%; }
.al-3a .al-gridlines > i:nth-of-type(2) { left: 50%; }
.al-3a .al-gridlines > i:nth-of-type(3) { left: 72%; }
.al-3a .al-3a-hero .al-gridlines > i { top: -10px; background: rgba(0, 0, 0, .05); }

/* ===== Logo ===== */
.al-3a .al-logo { display: flex; align-items: center; gap: 9px; }
.al-3a .al-logo__mark {
	width: 30px;
	height: 30px;
	border-radius: 50%;
	background: #0b0b0b;
	color: #a3fb62;
	display: flex;
	align-items: center;
	justify-content: center;
	flex: none;
}
.al-3a .al-logo__mark svg { width: 16px; height: 16px; stroke-width: 3; display: block; }
.al-3a .al-logo__word { font-size: 20px; font-weight: 600; letter-spacing: -.04em; white-space: nowrap; }
.al-3a .al-logo__word span { font-weight: 400; }

/* ===== 1. Nav ===== */
.al-3a .al-3a-nav {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	padding: 20px 40px;
}
.al-3a .al-3a-nav__links { display: flex; gap: 4px; font-size: 13px; font-weight: 500; }
.al-3a .al-3a-nav__links .al-link { color: #5a5a5a; padding: 9px 16px; border-radius: 999px; white-space: nowrap; }
.al-3a .al-3a-nav__links .al-link:is(:hover, .is-preview-hover) { color: #0b0b0b; }
.al-3a .al-3a-nav__links .al-link.is-active { background: #efefef; color: #0b0b0b; }

/* ===== 2. Hero ===== */
.al-3a .al-3a-hero { margin: 0 16px; background: #efefef; border-radius: 36px; padding: 10px; }
.al-3a .al-3a-hero__copy { position: relative; padding: 76px 0 64px; text-align: center; }
.al-3a .al-3a-hero__copy-inner { position: relative; }
.al-3a .al-3a-hero__copy .al-heading {
	font-weight: 500;
	font-size: 70px;
	line-height: 1.1;
	letter-spacing: -.055em;
	margin: 26px 0 24px;
}
.al-3a .al-3a-hero__copy .al-text {
	font-size: 17px;
	line-height: 1.75;
	color: #5a5a5a;
	max-width: 540px;
	margin: 0 auto 32px;
	text-wrap: pretty;
}
.al-3a .al-3a-hero .al-actions { display: flex; flex-wrap: wrap; gap: 12px; justify-content: center; }

/* ===== 3. Image + dot card ===== */
.al-3a .al-3a-hero__media {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 340px;
	gap: 10px;
	height: 470px;
}
.al-3a .al-3a-hero__media > .al-image {
	border-radius: 28px;
	background: linear-gradient(160deg, #58a6d6, #2c5f8e);
}
.al-3a :is(.al-3a-hero__media, .al-3a-how__media, .al-3a-ent__media) .al-image > img {
	position: absolute;
	inset: 0;
}

.al-3a .al-dotcard { background: #132120; border-radius: 28px; padding: 6px; display: flex; }
.al-3a .al-dotcard__inner {
	flex: 1;
	min-width: 0;
	border: 1px solid rgba(255, 255, 255, .1);
	border-radius: 23px;
	padding: 20px 20px 18px;
	display: flex;
	flex-direction: column;
	color: #fff;
}
.al-3a .al-dotgrid { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 7px; }
.al-3a .al-dot { display: block; aspect-ratio: 1; border-radius: 50%; background: #2b3a38; }
.al-3a .al-dot--fresh { background: #a3fb62; }
.al-3a .al-dot--aged { background: #fdbcfc; }
.al-3a .al-dot--empty { background: #2b3a38; }

.al-3a .al-dotcard__legend { display: flex; gap: 14px; font-size: 11px; color: #b9c4c2; margin-top: 10px; }
.al-3a .al-dotcard__legend > .al-text { display: flex; align-items: center; gap: 5px; }
.al-3a .al-dotcard__legend > .al-text::before {
	content: "";
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background: #a3fb62;
	flex: none;
}
.al-3a .al-dotcard__legend > .al-text:nth-of-type(2)::before { background: #fdbcfc; }

.al-3a .al-dotcard__total {
	display: flex;
	justify-content: space-between;
	align-items: flex-end;
	gap: 12px;
	margin-top: auto;
}
.al-3a .al-dotcard__total > .al-text:first-of-type {
	font-size: 58px;
	font-weight: 500;
	letter-spacing: -.06em;
	line-height: 1;
}
.al-3a .al-dotcard__total > .al-text:nth-of-type(2) {
	font-size: 12.5px;
	color: #b9c4c2;
	text-align: right;
	line-height: 1.35;
}
/* The handoff's 1px rule is drawn as this paragraph's top border. */
.al-3a .al-dotcard__from {
	border-top: 1px solid rgba(255, 255, 255, .12);
	margin-top: 16px;
	padding-top: 14px;
	font-size: 17px;
	line-height: 1.3;
	letter-spacing: -.02em;
}
.al-3a .al-dotcard__foot {
	display: flex;
	justify-content: space-between;
	align-items: flex-end;
	gap: 12px;
	margin-top: 6px;
}
.al-3a .al-dotcard__foot > .al-text:first-of-type { font-size: 12.5px; color: #b9c4c2; }
.al-3a .al-dotcard__foot > .al-text:nth-of-type(2) {
	font-size: 34px;
	font-weight: 500;
	letter-spacing: -.05em;
	color: #fdbcfc;
	line-height: 1;
}

/* ===== 4. Stats ===== */
.al-3a .al-3a-stats {
	padding: 84px 40px 20px;
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	text-align: center;
}
.al-3a .al-stat__value { font-size: 78px; font-weight: 600; letter-spacing: -.06em; line-height: 1; }
.al-3a .al-3a-stats .al-accent { color: #fdbcfc; }
.al-3a .al-stat__label { font-size: 14px; color: #5a5a5a; margin-top: 10px; }

/* ===== 5. How it works + ticker ===== */
.al-3a .al-3a-how { margin: 64px 16px 0; }
.al-3a .al-3a-how__panel {
	position: relative;
	background: #0b0b0b;
	color: #fff;
	border-radius: 36px 36px 0 0;
	padding: 84px 100px 92px;
	overflow: hidden;
}
.al-3a .al-3a-how__inner { position: relative; }
.al-3a .al-3a-how__inner > .al-heading {
	font-weight: 500;
	font-size: 58px;
	line-height: 1.05;
	letter-spacing: -.055em;
	margin: 22px 0 0;
	max-width: 760px;
}
.al-3a .al-3a-how .al-accent { color: #a3fb62; }
.al-3a .al-3a-how__grid {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	gap: 72px;
	margin-top: 84px;
	align-items: center;
}
.al-3a .al-3a-how__steps { min-width: 0; }

.al-3a .al-steps { display: flex; flex-direction: column; gap: 6px; counter-reset: al-step; }
.al-3a .al-step {
	counter-increment: al-step;
	display: flex;
	width: 100%;
	align-items: baseline;
	gap: 14px;
	padding: 18px 20px;
	border: 0;
	border-radius: 14px;
	background: transparent;
	color: inherit;
	text-align: left;
	line-height: normal;
	cursor: pointer;
}
.al-3a .al-step__num { font-size: 13px; color: #5c8f3d; flex: none; }
.al-3a .al-step__num::before { content: counter(al-step, decimal-leading-zero); }
.al-3a .al-step__title { font-size: 34px; letter-spacing: -.045em; color: #8d8d8d; font-weight: 500; }
.al-3a .al-step.is-active,
.al-3a .al-steps:not(.is-ready) .al-step:first-of-type { background: #1b1b1b; }
.al-3a .al-step.is-active .al-step__title,
.al-3a .al-steps:not(.is-ready) .al-step:first-of-type .al-step__title { color: #fff; }
.al-3a .al-step.is-active .al-step__num,
.al-3a .al-steps:not(.is-ready) .al-step:first-of-type .al-step__num { color: #a3fb62; }

.al-3a .al-3a-how__media .al-image {
	aspect-ratio: 1 / 1.02;
	border-radius: 28px;
	background: linear-gradient(160deg, #79a88f, #2b4a3d);
}
.al-3a .al-step-caption {
	font-size: 14px;
	line-height: 1.55;
	color: #b9b9b9;
	margin: 18px 0 0;
	max-width: 380px;
	min-height: 44px;
}

.al-3a .al-ticker {
	background: #fdbcfc;
	border-radius: 0 0 36px 36px;
	color: #0b0b0b;
	padding: 18px 0;
	overflow: hidden;
	font-size: 16px;
	font-weight: 500;
	letter-spacing: -.02em;
	margin-top: -1px;
}
.al-3a .al-ticker__track { display: flex; align-items: center; gap: 28px; white-space: nowrap; }
.al-3a .al-ticker-item { display: flex; align-items: center; gap: 28px; flex: none; }
.al-3a .al-ticker-item:first-of-type { margin-left: -24px; }
.al-3a .al-ticker-item__sep { display: flex; color: #fff; flex: none; }
.al-3a .al-ticker-item__sep svg { width: 18px; height: 18px; stroke-width: 3; display: block; }
.al-3a .al-ticker-item:last-of-type .al-ticker-item__sep { display: none; }

/* ===== 6. Build your pack ===== */
.al-3a .al-3a-pack { padding: 110px 40px 0; }
.al-3a .al-3a-pack > .al-heading {
	text-align: center;
	font-weight: 500;
	font-size: 52px;
	line-height: 1.05;
	letter-spacing: -.055em;
	margin: 0 0 14px;
}
.al-3a .al-3a-pack > .al-text { text-align: center; font-size: 15px; color: #5a5a5a; }

.al-3a .al-packcards {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 10px;
	margin-top: 44px;
}
.al-3a .al-packcard {
	--al-sub: #5a5a5a;
	--al-ring: #0b0b0b;
	position: relative;
	border-radius: 28px;
	padding: 28px;
	min-height: 306px;
	display: flex;
	flex-direction: column;
	background: #efefef;
	color: #0b0b0b;
}
.al-3a .al-packcard--yellow { background: #fde587; color: #0b0b0b; --al-sub: #4d4420; --al-ring: #0b0b0b; }
.al-3a .al-packcard--grey { background: #efefef; color: #0b0b0b; --al-sub: #5a5a5a; --al-ring: #0b0b0b; }
.al-3a .al-packcard--forest { background: #132120; color: #fff; --al-sub: #b9c4c2; --al-ring: #a3fb62; }
.al-3a .al-packcard.is-selected { box-shadow: 0 0 0 2px var(--al-ring); }
.al-3a .al-packcard__radio {
	position: absolute;
	top: 28px;
	right: 28px;
	width: 21px;
	height: 21px;
	border-radius: 50%;
	border: 1.5px solid var(--al-ring);
	background: transparent;
}
.al-3a .al-packcard.is-selected .al-packcard__radio { background: var(--al-ring); }
.al-3a .al-packcard__name {
	font-size: 26px;
	font-weight: 500;
	letter-spacing: -.04em;
	line-height: normal;
	padding-right: 28px;
}
.al-3a .al-packcard__desc {
	font-size: 14px;
	color: var(--al-sub);
	margin-top: 6px;
	max-width: 210px;
	line-height: 1.4;
}
.al-3a .al-packcard__price { margin-top: auto; display: flex; align-items: baseline; gap: 8px; }
.al-3a .al-packcard__amt { font-size: 54px; font-weight: 500; letter-spacing: -.06em; line-height: 1; }
.al-3a .al-packcard__per { font-size: 14px; color: var(--al-sub); }

.al-3a .al-packbody {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 360px;
	gap: 10px;
	margin-top: 10px;
	align-items: stretch;
}
.al-3a .al-packrows { background: #efefef; border-radius: 28px; padding: 10px 28px 26px; min-width: 0; }
.al-3a .al-product {
	display: flex;
	align-items: center;
	gap: 16px;
	padding: 18px 0;
	border-bottom: 1px solid rgba(0, 0, 0, .08);
}
.al-3a .al-product__info { flex: 1; min-width: 0; }
.al-3a .al-product__name { font-size: 18px; font-weight: 500; letter-spacing: -.03em; }
.al-3a .al-product__per { font-size: 13px; color: #5a5a5a; margin-top: 2px; }
.al-3a .al-product__stepper {
	display: flex;
	align-items: center;
	gap: 4px;
	background: #fff;
	border-radius: 999px;
	padding: 4px;
	flex: none;
}
.al-3a .al-product__btn {
	width: 32px;
	height: 32px;
	border-radius: 50%;
	border: 0;
	background: transparent;
	font-size: 18px;
	line-height: 1;
	color: #0b0b0b;
	cursor: pointer;
}
.al-3a .al-product__btn--dec:is(:hover, .is-preview-hover) { background: #efefef; }
.al-3a .al-product__btn--inc:is(:hover, .is-preview-hover) { background: #a3fb62; }
.al-3a .al-product__qty { width: 34px; text-align: center; font-weight: 500; font-size: 16px; }
.al-3a .al-product__total {
	width: 70px;
	flex: none;
	text-align: right;
	font-weight: 500;
	font-size: 17px;
	letter-spacing: -.02em;
}
.al-3a .al-packrows__note { font-size: 12.5px; color: #5a5a5a; margin-top: 18px; line-height: 1.5; }

.al-3a .al-summary {
	background: #132120;
	color: #fff;
	border-radius: 28px;
	padding: 30px;
	display: flex;
	flex-direction: column;
	min-width: 0;
}
.al-3a .al-summary__total {
	font-size: 88px;
	font-weight: 500;
	letter-spacing: -.065em;
	line-height: 1;
	margin: 22px 0 8px;
	color: #a3fb62;
}
.al-3a .al-summary__count { font-size: 14px; color: #b9c4c2; }
.al-3a .al-summary__monthly {
	display: flex;
	justify-content: space-between;
	align-items: flex-end;
	gap: 12px;
	border-top: 1px solid rgba(255, 255, 255, .14);
	margin-top: 24px;
	padding-top: 16px;
	font-size: 13.5px;
	color: #b9c4c2;
}
.al-3a .al-summary__monthly > .al-text:first-of-type { max-width: 120px; line-height: 1.4; }
.al-3a .al-summary__monthly > .al-text:nth-of-type(2) { color: #fff; font-weight: 500; text-align: right; }
.al-3a .al-summary__fine { font-size: 12px; line-height: 1.5; color: #b9c4c2; margin-top: 14px; }

/* ===== Fields ===== */
.al-3a .al-field { display: flex; flex-direction: column; gap: 5px; font-size: 12px; color: #5a5a5a; min-width: 0; }
.al-3a .al-field__control {
	width: 100%;
	min-width: 0;
	background: #efefef;
	color: #0b0b0b;
	border: 0;
	border-radius: 12px;
	padding: 12px 14px;
	font-size: 14px;
	line-height: normal;
}
.al-3a .al-summary__states { gap: 8px; margin-top: 22px; color: #b9c4c2; }
.al-3a .al-summary__states .al-field__control {
	background: rgba(255, 255, 255, .08);
	color: #fff;
	border-radius: 14px;
	padding: 14px 16px;
}

/* ===== 7. Trust bento ===== */
.al-3a .al-3a-trust {
	margin: 110px 16px 0;
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 10px;
}
.al-3a .al-trust-card {
	border-radius: 26px;
	padding: 24px;
	min-height: 298px;
	display: flex;
	flex-direction: column;
	background: #efefef;
	color: #0b0b0b;
}
.al-3a .al-trust-card__icon {
	width: 44px;
	height: 44px;
	border-radius: 50%;
	background: #0b0b0b;
	color: #a3fb62;
	display: flex;
	align-items: center;
	justify-content: center;
	flex: none;
}
.al-3a .al-trust-card__icon svg { width: 20px; height: 20px; stroke-width: 1.8; display: block; }
.al-3a .al-trust-card__body { margin-top: auto; padding-top: 24px; }
.al-3a .al-trust-card .al-heading {
	font-size: 21px;
	font-weight: 500;
	letter-spacing: -.04em;
	line-height: normal;
	margin-bottom: 8px;
}
.al-3a .al-trust-card .al-text { font-size: 13.5px; line-height: 1.55; }
.al-3a .al-trust-card--yellow { background: #fde587; }
.al-3a .al-trust-card--yellow .al-text { color: #4d4420; }
.al-3a .al-trust-card--grey { background: #efefef; }
.al-3a .al-trust-card--grey .al-text { color: #5a5a5a; }
.al-3a .al-trust-card--pink { background: #fdbcfc; }
.al-3a .al-trust-card--pink .al-text { color: #4a2a49; }
.al-3a .al-trust-card--forest { background: #132120; color: #fff; }
.al-3a .al-trust-card--forest .al-text { color: #b9c4c2; }
.al-3a .al-trust-card--forest .al-trust-card__icon { background: #a3fb62; color: #0b0b0b; }

/* ===== 8. Enterprise ===== */
.al-3a .al-3a-ent {
	margin: 110px 16px 0;
	background: #132120;
	border-radius: 36px;
	padding: 8px;
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	gap: 8px;
}
.al-3a .al-3a-ent__media {
	position: relative;
	overflow: hidden;
	border-radius: 30px;
	min-height: 600px;
	background: linear-gradient(160deg, #3d5e58, #132120);
}
.al-3a .al-3a-ent__media > .al-image { position: absolute; inset: 0; }
.al-3a .al-3a-ent__media::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(0deg, rgba(11, 20, 19, .92) 0%, rgba(11, 20, 19, .55) 45%, rgba(11, 20, 19, 0) 75%);
	pointer-events: none;
}
.al-3a .al-3a-ent__copy {
	position: absolute;
	left: 36px;
	right: 36px;
	bottom: 36px;
	z-index: 1;
	color: #fff;
}
.al-3a .al-3a-ent__copy .al-heading {
	font-weight: 500;
	font-size: 44px;
	line-height: 1.05;
	letter-spacing: -.055em;
	margin: 18px 0 14px;
}
.al-3a .al-3a-ent__copy .al-text {
	font-size: 15px;
	line-height: 1.55;
	color: #d6e0de;
	max-width: 380px;
	text-wrap: pretty;
}
.al-3a .al-3a-ent__panel {
	background: #efefef;
	border-radius: 30px;
	padding: 34px;
	display: flex;
	flex-direction: column;
	gap: 22px;
	min-width: 0;
}
.al-3a .al-3a-ent .al-bullets {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 12px 14px;
	font-size: 14px;
	font-weight: 500;
}
.al-3a .al-bullet { display: flex; gap: 10px; align-items: center; }
.al-3a .al-bullet__mark {
	width: 20px;
	height: 20px;
	border-radius: 50%;
	background: #a3fb62;
	color: #0b0b0b;
	display: flex;
	align-items: center;
	justify-content: center;
	flex: none;
}
.al-3a .al-bullet__mark svg { width: 10px; height: 10px; stroke-width: 2; display: block; }

.al-3a .al-form {
	background: #fff;
	border-radius: 22px;
	padding: 24px;
	display: flex;
	flex-direction: column;
	gap: 12px;
	flex: 1;
}
.al-3a .al-form__title { font-size: 24px; font-weight: 500; letter-spacing: -.04em; line-height: normal; }
.al-3a .al-form__fields { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }

/* ===== 9. FAQ ===== */
.al-3a .al-3a-faq {
	padding: 110px 40px 0;
	display: grid;
	grid-template-columns: 330px minmax(0, 1fr);
	gap: 56px;
	align-items: start;
}
.al-3a .al-3a-faq > .al-heading {
	font-weight: 500;
	font-size: 46px;
	line-height: 1.05;
	letter-spacing: -.055em;
}
.al-3a .al-faq { display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.al-3a .al-faq-item { background: #efefef; border-radius: 22px; padding: 20px 22px 20px 26px; }
.al-3a .al-faq-item__q {
	display: flex;
	width: 100%;
	justify-content: space-between;
	align-items: center;
	gap: 16px;
	padding: 0;
	border: 0;
	background: none;
	color: inherit;
	text-align: left;
	line-height: normal;
	cursor: pointer;
}
.al-3a .al-faq-item__question { font-size: 19px; font-weight: 500; letter-spacing: -.035em; }
.al-3a .al-faq-item__sign {
	width: 32px;
	height: 32px;
	border-radius: 50%;
	background: #fff;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 18px;
	flex: none;
}
.al-3a .al-faq-item.is-open .al-faq-item__sign { background: #a3fb62; }
.al-3a .al-faq-item__a p {
	font-size: 14.5px;
	line-height: 1.6;
	color: #5a5a5a;
	margin: 12px 0 0;
	max-width: 520px;
	text-wrap: pretty;
}

/* ===== 10. Footer ===== */
.al-3a .al-3a-footer {
	margin: 110px 16px 0;
	position: relative;
	background: #0b0b0b;
	color: #fff;
	border-radius: 36px;
	padding: 54px 48px 0;
	overflow: hidden;
}
.al-3a .al-3a-footer__top {
	position: relative;
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 24px;
	font-size: 14px;
}
.al-3a .al-3a-footer__links { display: flex; flex-wrap: wrap; gap: 30px; font-weight: 500; }
.al-3a .al-3a-footer__links .al-link { color: #fff; }
.al-3a .al-3a-footer__links .al-link:is(:hover, .is-preview-hover) { color: #a3fb62; }
.al-3a .al-wordmark {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 26px;
	margin-top: 70px;
	line-height: .82;
	white-space: nowrap;
	color: #a3fb62;
}
.al-3a .al-wordmark svg { width: 150px; height: 150px; stroke-width: 2.6; flex: none; display: block; }
.al-3a .al-wordmark__word {
	font-size: 230px;
	font-weight: 500;
	letter-spacing: -.07em;
	position: relative;
	top: 34px;
	color: #fff;
}
.al-3a .al-3a-footer__legal {
	position: relative;
	display: flex;
	justify-content: space-between;
	gap: 8px 24px;
	font-size: 12.5px;
	color: #b9b9b9;
	padding: 28px 0 26px;
	border-top: 1px solid rgba(255, 255, 255, .1);
	margin-top: 12px;
}

/* ===== Responsive ===== */
@media (max-width: 1180px) {
	.al-3a .al-wordmark { gap: 2.2vw; }
	.al-3a .al-wordmark svg { width: 12.5vw; height: 12.5vw; }
	.al-3a .al-wordmark__word { font-size: 19vw; top: 2.8vw; }
}

@media (max-width: 1079px) {
	.al-3a .al-3a-hero__media { grid-template-columns: minmax(0, 1fr); height: auto; }
	.al-3a .al-3a-hero__media > .al-image { aspect-ratio: 16 / 9; }
	.al-3a .al-3a-hero__copy .al-heading { font-size: clamp(44px, 7.3vw, 70px); }
	.al-3a .al-dotcard__total { margin-top: 24px; }

	.al-3a .al-3a-how__panel { padding: 64px 48px 72px; }
	.al-3a .al-3a-how__grid { gap: 48px; margin-top: 64px; }
}

@media (min-width: 600px) and (max-width: 1079px) {
	/* Stacked dot card: dots on the left, totals on the right. */
	.al-3a .al-dotcard__inner {
		display: grid;
		grid-template-columns: minmax(0, 300px) minmax(0, 1fr);
		grid-template-rows: 1fr auto auto;
		column-gap: 40px;
		padding: 24px;
	}
	.al-3a .al-dotgrid { grid-column: 1; grid-row: 1 / 3; }
	.al-3a .al-dotcard__legend { grid-column: 1; grid-row: 3; }
	.al-3a .al-dotcard__total { grid-column: 2; grid-row: 1; align-self: end; margin-top: 0; }
	.al-3a .al-dotcard__from { grid-column: 2; grid-row: 2; }
	.al-3a .al-dotcard__foot { grid-column: 2; grid-row: 3; }
}

@media (max-width: 899px) {
	.al-3a .al-3a-nav { padding: 20px 24px; }
	.al-3a .al-3a-nav__links .al-link { padding: 9px 11px; }
	.al-3a .al-3a-stats { padding-top: 64px; }
	.al-3a .al-stat__value { font-size: 60px; }

	.al-3a .al-3a-how__inner > .al-heading { font-size: 46px; }
	.al-3a .al-3a-how__grid { grid-template-columns: minmax(0, 1fr); margin-top: 48px; }
	.al-3a .al-step__title { font-size: 28px; }
	.al-3a .al-3a-how__media .al-image { aspect-ratio: 4 / 3; }

	.al-3a .al-3a-pack { padding-top: 88px; }
	.al-3a .al-3a-pack > .al-heading { font-size: 42px; }
	.al-3a .al-packcards { grid-template-columns: minmax(0, 1fr); margin-top: 32px; }
	.al-3a .al-packcard { min-height: 210px; }
	.al-3a .al-packbody { grid-template-columns: minmax(0, 1fr); }

	.al-3a .al-3a-trust { margin-top: 88px; grid-template-columns: repeat(2, minmax(0, 1fr)); }

	.al-3a .al-3a-ent { margin-top: 88px; grid-template-columns: minmax(0, 1fr); }
	.al-3a .al-3a-ent__media { min-height: 420px; }

	.al-3a .al-3a-faq { padding-top: 88px; grid-template-columns: minmax(0, 1fr); gap: 28px; }
	.al-3a .al-3a-faq > .al-heading { font-size: 40px; }

	.al-3a .al-3a-footer { margin-top: 88px; padding: 44px 32px 0; }
	.al-3a .al-3a-footer__top { flex-wrap: wrap; }
}

@media (max-width: 759px) {
	.al-3a .al-3a-nav { flex-wrap: wrap; row-gap: 10px; padding: 16px 24px; }
	.al-3a .al-3a-nav__links { order: 3; width: 100%; justify-content: center; }
}

@media (max-width: 599px) {
	/* Nav: logo + CTA only. */
	.al-3a .al-3a-nav { padding: 16px; }
	.al-3a .al-3a-nav__links { display: none; }

	/* Hero */
	.al-3a .al-3a-hero { border-radius: 28px; padding: 8px; }
	.al-3a .al-3a-hero__copy { padding: 48px 8px 40px; }
	.al-3a .al-3a-hero__copy .al-heading { font-size: clamp(32px, 10.4vw, 44px); margin: 20px 0 18px; }
	.al-3a .al-dial { width: 78px; height: 40px; margin: 0 8px; top: -3px; }
	.al-3a .al-dial::before { left: 4px; top: 4px; width: 32px; height: 32px; background-size: 16px 16px; }
	.al-3a .al-dial::after { left: 44px; top: 13px; width: 22px; height: 14px; background-size: 22px 14px; }
	.al-3a .al-3a-hero__copy .al-text { font-size: 16px; line-height: 1.7; margin-bottom: 26px; }
	.al-3a .al-3a-hero__media > .al-image { aspect-ratio: 4 / 3; border-radius: 22px; }
	.al-3a .al-dotcard { border-radius: 22px; }
	.al-3a .al-dotcard__inner { border-radius: 17px; padding: 16px 16px 14px; }
	.al-3a .al-dotcard__total > .al-text:first-of-type { font-size: 48px; }

	/* Stats */
	.al-3a .al-3a-stats { padding: 56px 16px 8px; grid-template-columns: minmax(0, 1fr); gap: 28px; }
	.al-3a .al-stat__value { font-size: 52px; }
	.al-3a .al-stat__label { margin-top: 6px; }

	/* How it works */
	.al-3a .al-3a-how { margin-top: 48px; }
	.al-3a .al-3a-how__panel { border-radius: 28px 28px 0 0; padding: 48px 16px 56px; }
	.al-3a .al-3a-how__inner > .al-heading { font-size: 36px; }
	.al-3a .al-3a-how__grid { gap: 36px; margin-top: 36px; }
	.al-3a .al-step { padding: 14px 16px; gap: 12px; }
	.al-3a .al-step__title { font-size: 23px; }
	.al-3a .al-3a-how .al-btn--lime { margin-top: 24px; }
	.al-3a .al-3a-how__media .al-image { border-radius: 22px; }
	.al-3a .al-ticker { border-radius: 0 0 28px 28px; padding: 14px 0; font-size: 15px; }

	/* Pack */
	.al-3a .al-3a-pack { padding: 72px 16px 0; }
	.al-3a .al-3a-pack > .al-heading { font-size: 34px; }
	.al-3a .al-packcard { padding: 24px; min-height: 180px; border-radius: 24px; }
	.al-3a .al-packcard__radio { top: 24px; right: 24px; }
	.al-3a .al-packcard__amt { font-size: 46px; }
	.al-3a .al-packrows { padding: 6px 18px 20px; border-radius: 24px; }
	.al-3a .al-product { flex-wrap: wrap; gap: 10px 12px; padding: 16px 0; }
	.al-3a .al-product__info { flex: 1 1 100%; }
	.al-3a .al-product__total { margin-left: auto; }
	.al-3a .al-summary { padding: 24px; border-radius: 24px; }
	.al-3a .al-summary__total { font-size: 68px; }

	/* Trust */
	.al-3a .al-3a-trust { margin-top: 72px; grid-template-columns: minmax(0, 1fr); }
	.al-3a .al-trust-card { min-height: 200px; }

	/* Enterprise */
	.al-3a .al-3a-ent { margin-top: 72px; border-radius: 28px; padding: 6px; gap: 6px; }
	.al-3a .al-3a-ent__media { border-radius: 24px; min-height: 420px; }
	.al-3a .al-3a-ent__copy { left: 22px; right: 22px; bottom: 24px; }
	.al-3a .al-3a-ent__copy .al-heading { font-size: 32px; }
	.al-3a .al-3a-ent__panel { border-radius: 24px; padding: 18px; }
	.al-3a .al-3a-ent .al-bullets { grid-template-columns: minmax(0, 1fr); }
	.al-3a .al-form { padding: 18px; border-radius: 18px; }
	.al-3a .al-form__fields { grid-template-columns: minmax(0, 1fr); }

	/* FAQ */
	.al-3a .al-3a-faq { padding: 72px 16px 0; gap: 22px; }
	.al-3a .al-3a-faq > .al-heading { font-size: 34px; }
	.al-3a .al-faq-item { padding: 16px 16px 16px 20px; border-radius: 18px; }
	.al-3a .al-faq-item__question { font-size: 17px; }

	/* Footer */
	.al-3a .al-3a-footer { margin-top: 72px; border-radius: 28px; padding: 36px 20px 0; }
	.al-3a .al-3a-footer__top { flex-direction: column; align-items: flex-start; }
	.al-3a .al-3a-footer__links { gap: 12px 22px; }
	.al-3a .al-wordmark { margin-top: 44px; }
	.al-3a .al-wordmark svg { width: 13vw; height: 13vw; }
	.al-3a .al-wordmark__word { font-size: 18vw; }
	.al-3a .al-3a-footer__legal { flex-direction: column; padding: 22px 0 22px; }
}

/* ===== Sub-pages: legal document ===== */
.al-3a .al-3a-doc {
	margin: 0 16px;
	background: #efefef;
	border-radius: 36px;
	padding: 76px 10px 10px;
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
}
.al-3a .al-3a-doc .al-kicker { background: #fff; border: 1px solid #e3e3e3; }
.al-3a .al-3a-doc .al-kicker__dot { background: #0b0b0b; }
.al-3a .al-3a-doc > .al-heading {
	font-weight: 500;
	font-size: 58px;
	line-height: 1.05;
	letter-spacing: -.055em;
	margin: 22px 0 14px;
}
.al-3a .al-3a-doc > .al-text { font-size: 14px; color: #5a5a5a; margin-bottom: 56px; }
.al-3a .al-doc {
	align-self: stretch;
	background: #fff;
	border-radius: 28px;
	padding: 56px max(24px, calc((100% - 760px) / 2)) 64px;
	text-align: left;
	font-size: 16px;
	line-height: 1.7;
	color: #3a3a3a;
}
.al-3a .al-doc > * + * { margin-top: 14px; }
.al-3a .al-doc h2 {
	font-size: 26px;
	font-weight: 500;
	letter-spacing: -.04em;
	line-height: 1.2;
	color: #0b0b0b;
	margin-top: 44px;
}
.al-3a .al-doc h2 + * { margin-top: 12px; }
.al-3a .al-doc ul { list-style: disc; padding-left: 22px; }
.al-3a .al-doc li + li { margin-top: 6px; }
.al-3a .al-doc li::marker { color: #0b0b0b; }
.al-3a .al-doc strong { color: #0b0b0b; font-weight: 600; }
.al-3a .al-doc a { color: #0b0b0b; text-decoration: underline; text-underline-offset: 3px; }

/* ===== Sub-pages: contact + SMS opt-in ===== */
.al-3a .al-3a-contact {
	margin: 0 16px;
	background: #132120;
	border-radius: 36px;
	padding: 8px;
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr);
	gap: 8px;
}
.al-3a .al-3a-contact__copy {
	position: relative;
	padding: 64px 48px;
	color: #fff;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
}
.al-3a .al-3a-contact__copy .al-kicker { background: #fff; color: #0b0b0b; }
.al-3a .al-3a-contact__copy .al-kicker__dot { background: #0b0b0b; }
.al-3a .al-3a-contact__copy .al-heading {
	font-weight: 500;
	font-size: 58px;
	line-height: 1.05;
	letter-spacing: -.055em;
	margin: 22px 0 18px;
}
.al-3a .al-3a-contact__copy .al-text { font-size: 16px; line-height: 1.6; color: #d6e0de; max-width: 400px; margin-bottom: 36px; }
.al-3a .al-3a-contact__copy .al-note { font-size: 17px; letter-spacing: -.02em; color: #b9c4c2; }
.al-3a .al-3a-contact__copy .al-note + .al-note { margin-top: 10px; }
.al-3a .al-3a-contact__copy .al-note a { color: #a3fb62; }
.al-3a .al-3a-contact__copy .al-note a:hover { text-decoration: underline; }
.al-3a .al-3a-contact .al-form { border-radius: 30px; padding: 34px; gap: 14px; }

/* Consent checkboxes, message box and the disclosure line (any 3a form). */
.al-3a .al-form__fields .al-field--check,
.al-3a .al-form__fields .al-field:has(textarea) { grid-column: 1 / -1; }
.al-3a .al-field--check {
	flex-direction: row;
	align-items: flex-start;
	gap: 10px;
	font-size: 12px;
	line-height: 1.55;
	color: #5a5a5a;
	cursor: pointer;
}
.al-3a .al-field__check {
	flex: none;
	width: 18px;
	height: 18px;
	margin: 1px 0 0;
	accent-color: #0b0b0b;
	cursor: pointer;
}
.al-3a .al-field--check a,
.al-3a .al-form__legal a { color: #0b0b0b; text-decoration: underline; text-underline-offset: 2px; }
.al-3a textarea.al-field__control { resize: vertical; min-height: 96px; font-family: inherit; }
.al-3a .al-form__legal { font-size: 12px; line-height: 1.5; color: #5a5a5a; }
.al-3a .al-form__status { font-size: 13px; color: #0b0b0b; }
.al-3a .al-form__status.is-error { color: #b42318; }

@media (max-width: 899px) {
	.al-3a .al-3a-contact { grid-template-columns: minmax(0, 1fr); }
	.al-3a .al-3a-contact__copy { padding: 48px 28px 36px; }
}
@media (max-width: 599px) {
	.al-3a .al-3a-doc { padding-top: 56px; border-radius: 28px; }
	.al-3a .al-3a-doc > .al-heading,
	.al-3a .al-3a-contact__copy .al-heading { font-size: clamp(34px, 10vw, 44px); }
	.al-3a .al-3a-doc > .al-text { margin-bottom: 36px; }
	.al-3a .al-doc { padding: 36px 20px 44px; border-radius: 22px; font-size: 15px; }
	.al-3a .al-doc h2 { font-size: 22px; margin-top: 34px; }
	.al-3a .al-3a-contact { border-radius: 28px; }
	.al-3a .al-3a-contact .al-form { padding: 20px; border-radius: 22px; }
}

/* Template parts: header + page + footer read as one continuous page. */
.al-page.al-3a.al-part--header { padding-bottom: 0; }
body.al-template .al-page.al-3a:not(.al-part) { padding-bottom: 0; }