/*
 * Ada module styles. Each block maps to a builder module / template component.
 */

/* ---------- Shared bits ---------- */
.img-placeholder {
	display: block; width: 100%; height: 100%; min-height: 200px;
	background: linear-gradient(135deg, var(--ada-grey-light), var(--ada-grey-lightest));
	border-radius: inherit;
}

.circle-btn {
	display: inline-flex; align-items: center; justify-content: center;
	width: 44px; height: 44px; border-radius: 50%;
	background: var(--ada-red-dark); color: var(--ada-white);
	transition: background 0.2s ease, transform 0.2s ease;
}
.circle-btn:hover { background: var(--ada-red); }
.circle-btn--outline { background: transparent; color: var(--ada-ink); border: 1px solid var(--ada-grey); }
.circle-btn--outline:hover { background: var(--ada-grey-lightest); }
.circle-btn[disabled] { opacity: 0.4; pointer-events: none; }

.check-list { list-style: none; display: grid; gap: 12px; margin-top: 22px; }
.check-list li { display: flex; gap: 12px; align-items: flex-start; font-size: var(--fs-body-sm); line-height: 1.5; }
.check-list--tight { gap: 10px; margin-top: 14px; }
.check-dot {
	flex: 0 0 auto; width: 20px; height: 20px; margin-top: 1px;
	display: inline-flex; align-items: center; justify-content: center;
	background: var(--ada-red-dark); color: var(--ada-white); border-radius: 50%;
}
.check-dot svg { width: 11px; height: 11px; }
.check-list--dark .check-dot { background: var(--ada-red); }

/* ---------- Hero: home (dark) ---------- */
.module--hero-home {
	padding-block: clamp(90px, 12vw, 170px);
	overflow: hidden;
	/* Design's hero base: near-black with a red cast rising bottom-left / top-right. */
	background:
		linear-gradient(295deg, rgba(181, 11, 11, 0.09) 0%, rgba(181, 11, 11, 0) 26%),
		linear-gradient(115deg, rgba(153, 4, 34, 0.13) 0%, rgba(153, 4, 34, 0.03) 20%, rgba(0, 0, 0, 0) 46%),
		#161514;
}
.hero-home__bg { position: absolute; inset: 0; pointer-events: none; overflow: hidden; }
/* Broad diagonal band edge sweeping lower-left -> upper-right. */
.hero-home__band {
	position: absolute; left: -20%; right: -20%; top: 34%; bottom: -46%;
	background: linear-gradient(180deg, rgba(255, 255, 255, 0.035) 0%, rgba(255, 255, 255, 0.01) 20%, rgba(0, 0, 0, 0.22) 100%);
	transform: rotate(-16deg);
	transform-origin: 50% 0;
}
/* Exported dashed sweeps, placed to the Figma frame coordinates (1440x845). */
.hero-home__curve { position: absolute; opacity: 0; animation: ada-curve-in 1.6s var(--ease-out) forwards; }
.hero-home__curve--sweep { left: -6%; top: 46%; width: 121%; height: 52%; animation-delay: 0.1s; }
.hero-home__curve--a { left: -14.6%; top: 12%; width: 116%; height: 112%; animation-delay: 0.25s; }
.hero-home__curve--b { left: -24.6%; top: 32%; width: 116.5%; height: 60%; animation-delay: 0.4s; }
.hero-home__curve--c { left: -8.8%; top: 61.8%; width: 116.5%; height: 60%; animation-delay: 0.55s; }
.hero-home__curve--red { left: 30%; top: -12%; width: 80%; height: 118%; animation-delay: 0.3s; }
@keyframes ada-curve-in { to { opacity: 1; } }
/* Red dashes march for ever. */
.hero-home__red-path { animation: ada-dash-march 30s linear infinite; }
@keyframes ada-dash-march { to { stroke-dashoffset: -540; } }
@media (prefers-reduced-motion: reduce) {
	.hero-home__curve { animation: none; opacity: 1; }
	.hero-home__red-path { animation: none; }
}
.hero-home__inner { max-width: 960px; }
/* Design measure: headline runs 747px wide (3 lines), sub two lines. */
.hero-home__title { margin-inline: auto; max-width: 760px; }
.hero-home__body { max-width: 680px; margin: 18px auto 0; color: var(--ada-dark-muted); }
.hero-home__ctas { display: flex; gap: 14px; justify-content: center; margin-top: 34px; flex-wrap: wrap; }

/* ---------- Hero: page ---------- */
.module--hero-page { padding-block: clamp(72px, 9vw, 130px); overflow: hidden; }
.hero-page__inner { display: grid; gap: 48px; align-items: center; }
.hero-page--product .hero-page__inner { grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr); }
.hero-page__copy .h2 { max-width: 22ch; }
.hero-page__body { max-width: 56ch; margin-top: 6px; }
.hero-page__ctas { display: flex; gap: 14px; margin-top: 28px; flex-wrap: wrap; }

.hero-page__collage { position: relative; min-height: 380px; }
.hero-page__card {
	position: absolute; border-radius: var(--radius); overflow: hidden;
	box-shadow: var(--shadow-card); background: var(--ada-white);
	animation: ada-float 7s ease-in-out infinite;
}
.hero-page__card img { width: 100%; height: 100%; object-fit: cover; }
.hero-page__card--1 { width: 46%; top: 0; left: 8%; z-index: 2; }
.hero-page__card--2 { width: 42%; top: 18%; right: 0; animation-delay: 1.2s; }
.hero-page__card--3 { width: 38%; bottom: 0; left: 0; animation-delay: 2.1s; }
.hero-page__card--4 { width: 34%; bottom: 6%; right: 14%; z-index: 2; animation-delay: 3s; }
.hero-page__chip {
	position: absolute; left: 10px; bottom: 10px;
	display: inline-grid; gap: 1px;
	background: var(--ada-white); border-radius: 6px; box-shadow: var(--shadow-card);
	padding: 6px 10px; font-size: 12px; font-weight: 600; line-height: 1.2;
}
.hero-page__chip small { font-weight: 400; color: var(--ada-muted); }
@keyframes ada-float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-10px); } }
@media (prefers-reduced-motion: reduce) { .hero-page__card { animation: none; } }
@media (max-width: 900px) {
	.hero-page--product .hero-page__inner { grid-template-columns: 1fr; }
	.hero-page__collage { min-height: 320px; max-width: 440px; }
}

/* ---------- Logo strip / grid ---------- */
.module--logo-row { padding-block: clamp(30px, 4vw, 56px); }
.logo-strip { margin-top: 34px; }
.module--logo-row .logo-strip { margin-top: 0; }
.logo-strip__title { text-align: center; font-size: var(--fs-caption); color: var(--ada-muted); letter-spacing: 0.06em; margin-bottom: 22px; }
.logo-strip__list {
	list-style: none; display: flex; flex-wrap: wrap; align-items: center; justify-content: center;
	gap: 28px clamp(28px, 5vw, 64px);
}
.logo-strip__list img { max-height: 30px; width: auto; filter: grayscale(1); opacity: 0.75; transition: opacity 0.2s ease, filter 0.2s ease; }
.logo-strip__list li:hover img { filter: none; opacity: 1; }
.logo-strip__name { font-weight: 700; color: var(--ada-grey-dark); opacity: 0.75; font-size: 18px; letter-spacing: 0.02em; }
.logo-row--grid .logo-strip__list { display: grid; grid-template-columns: repeat(6, 1fr); justify-items: center; gap: 34px 24px; }
@media (max-width: 900px) { .logo-row--grid .logo-strip__list { grid-template-columns: repeat(3, 1fr); } }

/* Strip style: continuous marquee (list printed twice for a seamless loop). */
.logo-strip--marquee {
	overflow: hidden;
	-webkit-mask-image: linear-gradient(90deg, transparent, #000 10%, #000 90%, transparent);
	mask-image: linear-gradient(90deg, transparent, #000 10%, #000 90%, transparent);
}
.logo-strip--marquee .logo-strip__track {
	display: flex; align-items: center; width: max-content;
	gap: clamp(28px, 5vw, 64px);
	animation: ada-marquee 36s linear infinite;
}
.logo-strip--marquee .logo-strip__list { flex: none; flex-wrap: nowrap; justify-content: flex-start; }
.logo-strip--marquee:hover .logo-strip__track { animation-play-state: paused; }
/* Shift by one full list + one track gap: -50% of the track minus half a gap. */
@keyframes ada-marquee { to { transform: translateX(calc(-50% - clamp(14px, 2.5vw, 32px))); } }
@media (prefers-reduced-motion: reduce) {
	.logo-strip--marquee { -webkit-mask-image: none; mask-image: none; }
	.logo-strip--marquee .logo-strip__track { animation: none; width: auto; flex-wrap: wrap; justify-content: center; }
	.logo-strip--marquee .logo-strip__list[aria-hidden] { display: none; }
	.logo-strip--marquee .logo-strip__list { flex-wrap: wrap; justify-content: center; }
}

/* ---------- Media / text ---------- */
.media-text__inner { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(36px, 6vw, 84px); align-items: center; }
/* Text-only variant: heading column narrower, prose column starts at top. */
.media-text__inner--text { grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr); align-items: start; }
.media-text__inner--text .h3 { max-width: 16ch; }
.media-text--reverse .media-text__inner > .media-text__media { order: 2; }
.media-text__media { position: relative; }
.media-text__copy .h3 { max-width: 20ch; }
.media-text__body { margin-top: 6px; }
.media-text__cta { margin-top: 26px; }

.media-text__rays {
	position: absolute; inset: -8% -6%; width: 112%; height: 116%;
	pointer-events: none; z-index: 0;
}
.media-circle { position: relative; width: min(440px, 88%); margin-inline: auto; aspect-ratio: 1; }
.media-circle--sm { width: min(340px, 80%); }
.media-circle__disc {
	position: absolute; inset: -3% auto auto -4%; width: 104%; aspect-ratio: 1;
	background: var(--ada-grey-lightest); border-radius: 50%;
}
.media-circle__img { width: 100%; height: 100%; object-fit: cover; border-radius: 50%; position: relative; z-index: 1; }
/* Multiple offset red keylines, echoing the design's layered rings. */
.media-circle__ring {
	position: absolute; inset: -4.5%; border-radius: 50%;
	border: 1.5px solid var(--ada-red);
	transform: rotate(-14deg) scale(1.015);
	clip-path: inset(0 0 10% 0);
	animation: ada-ring-drift 14s ease-in-out infinite;
	z-index: 2; pointer-events: none;
}
.media-circle__ring--2 {
	inset: -2.5%;
	transform: rotate(112deg) scale(1.03);
	clip-path: inset(0 0 22% 0);
	animation: ada-ring-drift-2 18s ease-in-out infinite;
	opacity: 0.85;
}
@keyframes ada-ring-drift {
	0%, 100% { transform: rotate(-14deg) scale(1.015); }
	50% { transform: rotate(-2deg) scale(1.015); }
}
@keyframes ada-ring-drift-2 {
	0%, 100% { transform: rotate(112deg) scale(1.03); }
	50% { transform: rotate(96deg) scale(1.03); }
}
.media-circle--circle-dark .media-circle__img { filter: saturate(0.85) brightness(0.92); }

.chat-bubbles { list-style: none; position: absolute; inset: 0; pointer-events: none; z-index: 2; }
.chat-bubble {
	position: absolute; background: var(--ada-white);
	border-radius: 10px; box-shadow: var(--shadow-card);
	padding: 10px 12px 12px; max-width: 210px;
	font-size: 13px; line-height: 1.35; font-weight: 500;
}
/* Bubbles cycle in and out continuously (design request): rise in, hold, drift out. */
.is-visible .chat-bubble, .tabs__panel.is-active .chat-bubble, [data-static] .chat-bubble { animation: ada-bubble-cycle 11s var(--ease-out) infinite both; }
@keyframes ada-bubble-cycle {
	0% { opacity: 0; transform: translateY(18px) scale(0.94); }
	6%, 62% { opacity: 1; transform: translateY(0) scale(1); }
	62.01%, 70% { opacity: 1; transform: translateY(-4px) scale(1); }
	78%, 100% { opacity: 0; transform: translateY(-20px) scale(0.96); }
}
.chat-bubble--1 { top: 2%; left: -4%; }
.chat-bubble--2 { top: 20%; right: -6%; animation-delay: 2.75s !important; }
.chat-bubble--3 { bottom: 26%; left: -8%; animation-delay: 5.5s !important; }
.chat-bubble--4 { bottom: 4%; right: 2%; animation-delay: 8.25s !important; }
.chat-bubble__tag {
	display: inline-block; margin-top: 7px;
	padding: 3px 9px; border-radius: 999px;
	font-size: 11px; font-weight: 600;
	background: #ECF0F1; color: #3E4447;
}
/* Tag pill colours matched to the design's saturated chips. */
.chat-bubble__tag--motivation { background: #3EC1A7; color: #0E4438; }
.chat-bubble__tag--mindset { background: #8B2FC9; color: #FFFFFF; }
.chat-bubble__tag--pain-points { background: #A98243; color: #FFFFFF; }
.chat-bubble__tag--market-context { background: #7C6FD9; color: #FFFFFF; }
.chat-bubble__tag--personality { background: #3EC1A7; color: #0E4438; }
.chat-bubble__tag--high-openness { background: #E3ECFA; color: #2C5590; }
@media (prefers-reduced-motion: reduce) {
	.is-visible .chat-bubble, [data-static] .chat-bubble { animation: none; opacity: 1; transform: none; }
	.media-circle__ring, .media-circle__ring--2 { animation: none; }
}

/* Decorative rings / quote mark can poke past the viewport on small screens. */
.module--media-text, .module--quote-banner { overflow-x: clip; }

@media (max-width: 900px) {
	.media-text__inner { grid-template-columns: 1fr; }
	.media-text--reverse .media-text__inner > .media-text__media { order: 0; }
	.chat-bubble { max-width: 170px; font-size: 12px; }
	.chat-bubble--1 { left: 0; } .chat-bubble--3 { left: 0; }
}

/* ---------- Feature showcase (What Ada Does) ---------- */
.module--feature-showcase { padding-block: calc(var(--section-pad) * 0.68); }
.process-strip {
	display: flex; align-items: center; justify-content: center; gap: 14px;
	margin-bottom: clamp(26px, 3.4vw, 44px); flex-wrap: wrap;
}
.process-strip__step { display: grid; justify-items: center; gap: 8px; color: var(--ada-muted); }
.process-strip__icon {
	width: 44px; height: 44px; display: inline-flex; align-items: center; justify-content: center;
	background: var(--ada-white); border: 1px solid var(--ada-line); border-radius: 50%;
	transition: background 0.3s ease, color 0.3s ease, border-color 0.3s ease;
}
.process-strip__icon svg { width: 22px; height: 22px; }
.process-strip__label { font-size: 11px; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; }
.process-strip__step.is-active { color: var(--ada-red); }
.process-strip__step.is-active .process-strip__icon { background: #FBE9E9; border-color: var(--ada-red); color: var(--ada-red); }
.process-strip__dash { width: clamp(24px, 4vw, 64px); border-top: 1.5px dashed var(--ada-grey); margin-bottom: 22px; }

/* Strip lives in the card column, centred to the card, one line on desktop. */
.feature-showcase__media .process-strip { width: max-content; max-width: none; flex-wrap: nowrap; margin-inline: auto; }
.feature-showcase__media .process-strip__dash { width: 28px; }
.feature-showcase__inner { display: grid; grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr); gap: clamp(36px, 6vw, 84px); align-items: center; }
.feature-showcase--reverse .feature-showcase__inner > .feature-showcase__copy { order: 2; }
.feature-showcase__copy .h3 { max-width: 20ch; }
.feature-showcase__copy em { font-style: italic; font-weight: 600; }

.ui-card {
	background: var(--ada-white); border-radius: var(--radius-lg);
	box-shadow: var(--shadow-card); overflow: hidden;
}
.ui-card--briefing { padding: 28px; display: grid; gap: 10px; }
.ui-card__q { color: var(--ada-red); font-size: var(--fs-caption); font-weight: 600; margin: 8px 0 0; }
.ui-card__q:first-child { margin-top: 0; }
.ui-card__input {
	border: 1px solid var(--ada-line); border-radius: 8px;
	padding: 12px 14px; font-size: var(--fs-body-sm); color: var(--ada-grey-dark);
}
.ui-card__opts { display: flex; gap: 10px; flex-wrap: wrap; }
.ui-card__opts span {
	border: 1px solid var(--ada-line); border-radius: 8px;
	padding: 14px 18px; font-size: var(--fs-body-sm); color: var(--ada-grey-dark);
	flex: 1 1 0; text-align: center; min-width: 100px;
}
.ui-card__opts .is-selected { border-color: var(--ada-red); color: var(--ada-red); background: #FDF3F3; font-weight: 600; }
.ui-card__opts span { transition: border-color 0.3s ease, color 0.3s ease, background 0.3s ease; }

/* ---------- Animated showcase card (per-step panels) ---------- */
.ui-card--showcase { position: relative; min-height: min(430px, 70vh); }
.ui-panel {
	position: absolute; inset: 0; padding: clamp(20px, 2.2vw, 30px) clamp(28px, 3.2vw, 48px);
	display: grid; gap: 15px; align-content: center;
	opacity: 0; visibility: hidden; transform: translateY(10px);
	transition: opacity 0.4s var(--ease-out), transform 0.4s var(--ease-out), visibility 0.4s;
}
.ui-panel.is-active { opacity: 1; visibility: visible; transform: none; }
.ui-panel--briefing .ui-card__input { min-height: 72px; }
.ui-panel .ui-card__q { font-size: var(--fs-body-sm); }

.type-caret {
	display: none; width: 2px; height: 1.1em;
	background: var(--ada-red); margin-left: 2px; vertical-align: text-bottom;
}
.type-caret.is-on { display: inline-block; animation: ada-caret 0.85s step-end infinite; }
@keyframes ada-caret { 50% { opacity: 0; } }

/* Perspective panel: trait meters. */
.ui-trait { display: grid; gap: 10px; opacity: 0; transform: translateY(10px); transition: opacity 0.45s var(--ease-out), transform 0.45s var(--ease-out); padding-block: 8px; }
.ui-trait.is-in { opacity: 1; transform: none; }
.ui-trait__label { display: flex; justify-content: space-between; gap: 12px; font-size: var(--fs-body); color: var(--ada-grey-dark); }
.ui-trait__label em { font-style: normal; font-weight: 600; color: var(--ada-ink); }
.ui-trait__meter { display: block; height: 8px; border-radius: 999px; background: var(--ada-grey-light); overflow: hidden; }
.ui-trait__meter span { display: block; height: 100%; width: 0; border-radius: inherit; background: linear-gradient(90deg, #990422, #B70422); transition: width 0.9s var(--ease-out) 0.15s; }
.ui-trait.is-in .ui-trait__meter span { width: var(--w, 60%); }

/* Positioning panel: argument rows. */
.ui-arg {
	display: grid; grid-template-columns: 84px 1fr; gap: 16px; align-items: start;
	border: 1px solid var(--ada-line); border-radius: 10px; padding: 18px 20px;
	opacity: 0; transform: translateX(-12px);
	transition: opacity 0.45s var(--ease-out), transform 0.45s var(--ease-out);
}
.ui-arg.is-in { opacity: 1; transform: none; }
.ui-arg__who { color: var(--ada-red); font-weight: 700; font-size: var(--fs-caption); letter-spacing: 0.06em; text-transform: uppercase; padding-top: 3px; }
.ui-arg__what { font-size: var(--fs-body); color: var(--ada-grey-dark); line-height: 1.55; }

/* Personalisation panel: output chips + counter. */
.ui-outputs { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.ui-output {
	border: 1px solid var(--ada-line); border-left: 3px solid var(--ada-red);
	border-radius: 10px; padding: 20px 22px;
	font-size: var(--fs-body); font-weight: 500; color: var(--ada-grey-dark);
	opacity: 0; transform: translateY(12px) scale(0.97);
	transition: opacity 0.4s var(--ease-out), transform 0.4s var(--ease-out);
}
.ui-output.is-in { opacity: 1; transform: none; }
.ui-outputs__count {
	margin-top: 14px; font-size: var(--fs-body); color: var(--ada-muted);
	opacity: 0; transition: opacity 0.5s ease 0.2s;
}
.ui-outputs__count.is-in { opacity: 1; }
.ui-outputs__count strong { color: var(--ada-red); font-size: var(--fs-h4); }
.ui-outputs__count .arrow { margin-inline: 8px; }

@media (max-width: 480px) {
	.ui-card--showcase { min-height: 480px; }
	.ui-outputs { grid-template-columns: 1fr; }
}

@media (max-width: 900px) {
	.feature-showcase__inner { grid-template-columns: 1fr; }
	.feature-showcase__media .process-strip { width: auto; flex-wrap: wrap; justify-content: center; }
	.feature-showcase--reverse .feature-showcase__inner > .feature-showcase__copy { order: 0; }
}

/* Small phones: one compact row — no dashes, smaller icons/labels. */
@media (max-width: 600px) {
	.feature-showcase__media .process-strip { width: 100%; flex-wrap: nowrap; justify-content: space-between; gap: 8px; }
	.feature-showcase__media .process-strip__dash { display: none; }
	.feature-showcase__media .process-strip .process-strip__icon { width: 34px; height: 34px; }
	.feature-showcase__media .process-strip .process-strip__icon svg { width: 17px; height: 17px; }
	.feature-showcase__media .process-strip .process-strip__label { font-size: 9px; letter-spacing: 0.06em; }
}

/* ---------- Home hero: heartbeats (ECG) variant ---------- */
.hero-home__bg--beats { overflow: hidden; }
.hero-home__beatglow {
	position: absolute; left: 50%; top: 30%; width: 900px; height: 620px;
	transform: translate(-50%, -50%);
	background: radial-gradient(circle, rgba(183, 4, 34, 0.16), transparent 62%);
	animation: ada-heartbeat 1.15s ease-in-out infinite;
}
@keyframes ada-heartbeat {
	0%, 100% { transform: translate(-50%, -50%) scale(1); opacity: 0.85; }
	12% { transform: translate(-50%, -50%) scale(1.07); opacity: 1; }
	24% { transform: translate(-50%, -50%) scale(1); opacity: 0.9; }
	36% { transform: translate(-50%, -50%) scale(1.05); opacity: 1; }
	52% { transform: translate(-50%, -50%) scale(1); opacity: 0.85; }
}
.hero-home__ecg { position: absolute; left: -2%; width: 104%; height: 26%; }
.hero-home__ecg--ghost { top: 8%; }
.hero-home__ecg--flat { top: 76%; animation: ada-ecg-fade 9s ease-in-out infinite; }
@keyframes ada-ecg-fade { 0%, 100% { opacity: 1; } 50% { opacity: 0.25; } }
.hero-home__ecg--main { top: 56%; height: 32%; }
/* Runner: a short bright segment races the trace, monitor-sweep style. */
.hero-home__ecg-run {
	stroke-dasharray: 160 840;
	stroke-dashoffset: 160;
	animation: ada-ecg-run 5.5s linear infinite;
}
.hero-home__ecg-run--glow { opacity: 0.55; }
@keyframes ada-ecg-run { to { stroke-dashoffset: -840; } }
/* Headline rises word by word. */
/* Natural word spaces come from the markup whitespace — no extra margins. */
.hero-home--heartbeats .hero-home__w {
	display: inline-block;
	opacity: 0; transform: translateY(20px);
	animation: ada-word-in 0.7s var(--ease-out) forwards;
	animation-delay: calc(0.2s + 0.07s * var(--i));
}
@keyframes ada-word-in { to { opacity: 1; transform: none; } }

/* Live heartbeat ticker. */
.hero-home__ticker {
	margin-top: 34px; font-size: var(--fs-body); color: var(--ada-dark-muted);
	display: inline-flex; align-items: center; gap: 13px;
}
.hero-home__ticker strong { color: var(--ada-white); font-variant-numeric: tabular-nums; min-width: 2ch; text-align: right; font-size: 30px; line-height: 1; }
.hero-home__ticker-beat {
	width: 13px; height: 13px; border-radius: 50%;
	background: linear-gradient(135deg, #990422, #B70422);
	box-shadow: 0 0 12px rgba(183, 4, 34, 0.8);
}
.hero-home__ticker.is-beating .hero-home__ticker-beat { animation: ada-tick-beat 0.5s ease-out; }
@keyframes ada-tick-beat { 0% { transform: scale(1); } 30% { transform: scale(1.55); } 100% { transform: scale(1); } }

/* CTA hover revives the flatline into a beating trace. */
.hero-home__ecg-revive { opacity: 0; transition: opacity 0.5s ease; }
.hero-home--heartbeats.is-revived .hero-home__ecg-revive { opacity: 1; animation: ada-dash-march 8s linear infinite; }
.hero-home--heartbeats.is-revived .hero-home__ecg-flatline { opacity: 0; }
.hero-home__ecg-flatline { transition: opacity 0.5s ease; }
.hero-home--heartbeats.is-revived .hero-home__ecg--flat { animation: none; opacity: 1; }

/* Parallax transforms are set inline by JS; keep them cheap. */
.hero-home__ecg, .hero-home__beatglow { will-change: transform; }

@media (prefers-reduced-motion: reduce) {
	.hero-home__beatglow, .hero-home__ecg--flat { animation: none; }
	.hero-home__ecg-run { animation: none; stroke-dasharray: none; }
	.hero-home__ecg-run--glow { display: none; }
	.hero-home--heartbeats .hero-home__w { animation: none; opacity: 1; transform: none; }
	.hero-home--heartbeats.is-revived .hero-home__ecg-revive { animation: none; }
	.hero-home__ticker.is-beating .hero-home__ticker-beat { animation: none; }
}
@media (max-width: 700px) {
	.hero-home__ecg--main { top: 62%; height: 24%; }
	.hero-home__beatglow { width: 560px; height: 460px; }
}

/* ---------- Product animation vignettes (heroes + audience tabs) ---------- */
.panim { position: relative; width: min(500px, 100%); aspect-ratio: 10 / 9; margin-inline: auto; font-size: 14px; container-type: inline-size; }
.panim__card {
	position: absolute; background: var(--ada-white); border: 1px solid #EEF1F2;
	border-radius: 14px; padding: 14px 16px; box-shadow: 0 14px 34px rgba(17, 17, 17, 0.07);
	display: grid; gap: 7px; align-content: start;
}
.panim__card b { display: block; height: 7px; border-radius: 999px; background: var(--ada-grey-light); width: var(--w, 70%); }
.panim__pill {
	justify-self: start; font-size: 10.5px; font-weight: 700; letter-spacing: 0.05em;
	padding: 3px 9px; border-radius: 999px; margin-bottom: 3px;
}
.panim__pill--red { background: #FDF3F3; color: var(--ada-red); }
.panim__pill--gold { background: #A98243; color: #FFFFFF; }
.panim__pill--violet { background: #7C6FD9; color: #FFFFFF; }
.panim__who { font-size: 11px; font-weight: 700; letter-spacing: 0.07em; text-transform: uppercase; color: var(--ada-red); }

/* Every vignette lays its cards out in a real grid (copy can be any length).
   ABM, fan-out and channel are wired by main.js, which draws the wires in
   pixels from the cards' measured edges, so dashes stay even and every line
   lands exactly on its card. */
.panim--abm, .panim--fanout, .panim--channel, .panim--sales, .panim--demand { display: grid; align-items: center; }
.panim__fan, .panim__drop, .panim__deal { position: relative; z-index: 1; padding-block: 6%; }
.panim__fan .panim__card, .panim__drop .panim__card, .panim__deal .panim__card, .panim__head .panim__card { position: relative; inset: auto; width: auto; transform: none; }
.panim__fan .panim__mark, .panim__drop .panim__mark { position: relative; inset: auto; transform: none; }
.panim__body { margin: 0; font-size: 12px; line-height: 1.45; color: var(--ada-muted); }
.panim__pill { max-width: 100%; line-height: 1.35; } /* Long titles wrap rather than overflow the card. */
.panim__outs { display: grid; gap: 14px; }

/* Wires + end nodes (the nodes sit on the card borders as ports). */
.panim__wires { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; pointer-events: none; z-index: 2; }
.panim__wire {
	fill: none; stroke: var(--ada-red); stroke-width: 1.5; stroke-linecap: round;
	stroke-dasharray: 4 5; opacity: 0.45; animation: ada-wire-march 1.4s linear infinite;
}
.panim__node { fill: var(--ada-red); opacity: 0.55; }
@keyframes ada-wire-march { to { stroke-dashoffset: -9; } }

/* Focus cycle: each output card lights up in turn — no lift, so its wire
   stays attached — and its wire and node brighten with it. 3s per card. */
.panim__out, .panim__node, .panim__wire[class*="panim__wire--"] {
	--cycle: calc(var(--n, 3) * 3s);
	animation-duration: var(--cycle); animation-timing-function: ease-in-out; animation-iteration-count: infinite;
	animation-delay: calc(var(--slot, 0) * 3s);
}
.panim__out { animation-name: ada-card-focus; }
.panim__node { animation-name: ada-node-focus; }
.panim__wire[class*="panim__wire--"] {
	animation-name: ada-wire-march, ada-wire-focus;
	animation-duration: 1.4s, var(--cycle); animation-timing-function: linear, ease-in-out;
	animation-delay: 0s, calc(var(--slot, 0) * 3s);
}
.panim__out--2, .panim__node--2, .panim__wire--2 { --slot: 1; }
.panim__out--3, .panim__node--3, .panim__wire--3 { --slot: 2; }
.panim__out--4, .panim__node--4, .panim__wire--4 { --slot: 3; }
.panim__out--5, .panim__node--5, .panim__wire--5 { --slot: 4; }
@keyframes ada-card-focus {
	0%, 30%, 100% { border-color: #EEF1F2; box-shadow: 0 14px 34px rgba(17, 17, 17, 0.07); }
	8%, 22% { border-color: var(--ada-red); box-shadow: 0 14px 34px rgba(181, 11, 11, 0.14); }
}
@keyframes ada-wire-focus { 0%, 30%, 100% { opacity: 0.4; } 8%, 22% { opacity: 1; } }
@keyframes ada-node-focus { 0%, 30%, 100% { opacity: 0.45; } 8%, 22% { opacity: 1; } }

/* Ada mark chip (fan hub, channel top). */
.panim__mark {
	position: absolute; display: grid; place-items: center;
	background: var(--ada-white); border: 1.5px solid rgba(181, 11, 11, 0.35);
	border-radius: 16px; box-shadow: 0 14px 34px rgba(17, 17, 17, 0.1);
}
.panim__mark svg { width: 26px; height: auto; display: block; }

/* Fan (ABM, one document → five versions): source · Ada mark · versions. */
.panim__fan {
	display: grid; align-items: center;
	grid-template-columns: minmax(0, 1fr) 58px minmax(0, 1.15fr); column-gap: 10%;
}
.panim__mark--hub { width: 58px; height: 58px; }
.panim--fanout .panim__fan { grid-template-columns: minmax(0, 0.9fr) 52px minmax(0, 1.25fr); }
.panim--fanout .panim__mark--hub { width: 52px; height: 52px; }
.panim--fanout .panim__outs { gap: 9px; }
.panim--fanout .panim__out { padding: 9px 12px; gap: 5px; border-radius: 12px; }
.panim--fanout .panim__who { font-size: 10.5px; letter-spacing: 0.05em; }
.panim--fanout .panim__body { font-size: 11px; line-height: 1.4; }
.panim--fanout .panim__out b { height: 5px; }

/* Drop (channel): Ada mark → approved asset → a version per partner market. */
.panim__drop { display: grid; justify-items: center; row-gap: 34px; }
.panim__mark--top { width: 52px; height: 52px; border-radius: 50%; }
.panim__vsrc { width: 46%; }
.panim--channel .panim__outs { width: 100%; grid-template-columns: repeat(var(--n, 3), minmax(0, 1fr)); gap: 5%; align-items: start; }

/* Deal (sales): the approved deck deals a version per conversation into an
   even cascade — each card steps right by the same amount, none overlap. */
.panim__deal { display: grid; align-items: center; grid-template-columns: minmax(0, 0.95fr) minmax(0, 1.1fr); column-gap: 9%; }
.panim__deckcard::before, .panim__deckcard::after {
	content: ""; position: absolute; inset: 0; border-radius: inherit;
	background: var(--ada-white); border: 1px solid #EEF1F2; z-index: -1;
}
.panim__deckcard::before { transform: rotate(-2.5deg) translate(-5px, 5px); }
.panim__deckcard::after { transform: rotate(2deg) translate(5px, 7px); }
.panim--sales .panim__outs { gap: 12px; }
.panim--sales .panim__out {
	margin-left: calc(var(--i, 0) * 8%); margin-right: calc((2 - var(--i, 0)) * 8%);
	animation-name: ada-deal-in, ada-card-focus; animation-duration: 9s, 9s;
	animation-delay: calc(var(--i, 0) * 0.45s), calc(var(--i, 0) * 3s); animation-fill-mode: backwards, none;
}
@keyframes ada-deal-in {
	0% { opacity: 0; transform: translateX(-28px); }
	6%, 88% { opacity: 1; transform: none; }
	96%, 100% { opacity: 0; transform: none; }
}

/* Demand gen: one campaign multiplying at scale. */
.panim--demand { align-content: center; }
.panim__head { display: flex; justify-content: space-between; align-items: flex-start; gap: 6%; margin-bottom: 7%; }
.panim--demand .panim__src { width: 46%; }
.panim__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.panim__mini {
	background: var(--ada-white); border: 1px solid #EEF1F2; border-radius: 10px; min-height: 66px;
	padding: 10px; display: grid; gap: 5px; align-content: center;
	box-shadow: 0 10px 24px rgba(17, 17, 17, 0.06);
	animation: ada-panim-pop 6.5s ease-in-out infinite; animation-delay: var(--d, 0s);
}
.panim__mini b { display: block; height: 5px; border-radius: 999px; background: var(--ada-grey-light); width: var(--w, 70%); }
.panim__mini-title { font-size: 11px; font-weight: 600; line-height: 1.3; color: var(--ada-ink); }
.panim__dot { width: 8px; height: 8px; border-radius: 50%; }
.panim__dot--motivation { background: #3EC1A7; }
.panim__dot--mindset { background: #8B2FC9; }
.panim__dot--pain { background: #A98243; }
.panim__dot--context { background: #7C6FD9; }
@keyframes ada-panim-pop {
	0%, 4% { opacity: 0; transform: translateY(10px) scale(0.94); }
	10%, 88% { opacity: 1; transform: none; }
	96%, 100% { opacity: 0; transform: translateY(10px) scale(0.94); }
}
.panim__count {
	flex: none; font-weight: 700; font-size: 20px; color: var(--ada-red);
	background: #FDF3F3; border-radius: 999px; padding: 8px 16px;
	animation: ada-heartbeat-min 6.5s ease-in-out infinite;
}
@keyframes ada-heartbeat-min { 0%, 78%, 100% { transform: scale(1); } 84% { transform: scale(1.09); } 90% { transform: scale(1); } }

/* Narrow graphics (phones, tight columns): smaller type, chips and padding. */
@container (max-width: 400px) {
	.panim__fan { grid-template-columns: minmax(0, 1fr) 40px minmax(0, 1.1fr); column-gap: 8%; padding-block: 4%; }
	.panim--fanout .panim__fan { grid-template-columns: minmax(0, 0.9fr) 36px minmax(0, 1.25fr); }
	.panim__mark--hub, .panim--fanout .panim__mark--hub { width: 40px; height: 40px; border-radius: 12px; }
	.panim--fanout .panim__mark--hub { width: 36px; height: 36px; }
	.panim__mark--top { width: 40px; height: 40px; }
	.panim__fan .panim__mark svg, .panim__drop .panim__mark svg { width: 19px; }
	.panim__fan .panim__card, .panim__drop .panim__card, .panim__deal .panim__card, .panim__head .panim__card { padding: 9px 10px; border-radius: 11px; gap: 5px; }
	.panim__outs { gap: 10px; }
	.panim--fanout .panim__outs { gap: 7px; }
	.panim__body, .panim--fanout .panim__body { font-size: 10.5px; }
	.panim__who, .panim--fanout .panim__who { font-size: 9.5px; }
	.panim__pill { padding: 2px 7px; font-size: 9.5px; }
	.panim__drop { row-gap: 26px; }
	.panim__vsrc { width: 58%; }
	.panim__count { font-size: 16px; padding: 6px 12px; }
	.panim__grid { gap: 8px; }
	.panim__mini { min-height: 50px; padding: 8px; }
	.panim__mini-title { font-size: 9.5px; }
}

@media (prefers-reduced-motion: reduce) {
	.panim__wire, .panim__wire[class*="panim__wire--"], .panim__node, .panim__out,
	.panim--sales .panim__out, .panim__mini, .panim__count { animation: none; }
	.panim__mini, .panim__out { opacity: 1; }
}

/* Product hero: animation replaces the collage column. */
.hero-page__anim { display: grid; align-items: center; }

/* ---------- Audience tabs ---------- */
.tabs { margin-top: clamp(28px, 4vw, 48px); }
.tabs__bar {
	display: flex; gap: clamp(10px, 2.5vw, 40px); justify-content: center;
	border-bottom: 1px solid var(--ada-line); flex-wrap: wrap;
}
.tabs__tab {
	padding: 12px 4px 14px; font-size: var(--fs-body-sm); font-weight: 500; color: var(--ada-muted);
	border-bottom: 2px solid transparent; margin-bottom: -1px; white-space: nowrap;
	transition: color 0.2s ease, border-color 0.2s ease;
}
.tabs__tab:hover { color: var(--ada-ink); }
.tabs__tab.is-active { color: var(--ada-red); border-bottom-color: var(--ada-red); font-weight: 600; }

.tabs__panel {
	display: none; grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr);
	gap: clamp(28px, 5vw, 72px); align-items: center;
	border: 1px solid #EEF1F2; border-radius: var(--radius-lg);
	padding: clamp(28px, 4.5vw, 56px); margin-top: 34px;
	background: var(--ada-white);
	box-shadow: 0 18px 50px rgba(17, 17, 17, 0.05);
}
.tabs__panel.is-active { display: grid; animation: ada-fade 0.4s ease; }
@keyframes ada-fade { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
.tabs__card .h4 { margin-bottom: 12px; }
.tabs__card .link-more { margin-top: 22px; }
.link-more--ink { color: var(--ada-ink); font-weight: 500; }
.link-more--ink .arrow { color: var(--ada-red); }
.link-more--ink:hover { color: var(--ada-red); }

/* Three-circle collage with red keyline rings, node dots and bubbles. */
.tabs__collage { position: relative; width: min(500px, 100%); aspect-ratio: 10 / 9; margin-inline: auto; }
.tabs__circle { position: absolute; aspect-ratio: 1; border-radius: 50%; }
.tabs__circle img, .tabs__circle .img-placeholder { display: block; width: 100%; height: 100%; object-fit: cover; border-radius: 50%; min-height: 0; }
.tabs__circle::after {
	content: ''; position: absolute; inset: -3.5%; border-radius: 50%;
	border: 1.2px solid var(--ada-red);
	clip-path: inset(0 0 8% 0);
}
.tabs__circle::before {
	content: ''; position: absolute; width: 9px; height: 9px; border-radius: 50%;
	background: var(--ada-red); z-index: 2;
}
.tabs__circle--a { width: 32%; top: 12%; left: 4%; }
.tabs__circle--a::before { bottom: 6%; right: 4%; }
.tabs__circle--b { width: 52%; top: 2%; left: 42%; }
.tabs__circle--b::before { top: 50%; left: -2%; }
.tabs__circle--c { width: 41%; bottom: 2%; left: 14%; }
.tabs__circle--c::before { top: 4%; left: 10%; }

.tabs__bubble { position: absolute; z-index: 3; }
.tabs__bubble--1 { top: 4%; left: 12%; }
.tabs__bubble--2 { top: -3%; left: 46%; animation-delay: 2.75s !important; }
.tabs__bubble--3 { top: 48%; left: 22%; animation-delay: 5.5s !important; }
.tabs__bubble--4 { bottom: 4%; left: 30%; animation-delay: 8.25s !important; }
.chat-bubble--pill .chat-bubble__tag { margin-top: 0; margin-bottom: 6px; }
.chat-bubble--pill .chat-bubble__text { display: block; font-weight: 400; color: var(--ada-grey-dark); }
.chat-bubble__tag--ink { background: var(--ada-black); color: var(--ada-white); }

@media (max-width: 900px) {
	.tabs__panel.is-active { grid-template-columns: 1fr; }
	.tabs__collage { aspect-ratio: 1; }
	.tabs__bubble { max-width: 160px; font-size: 12px; }
}

/* ---------- Case studies carousel ---------- */
.case-carousel__track { position: relative; }
.case-slide {
	display: none; grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
	border-radius: var(--radius-lg); overflow: hidden;
	border: 1px solid var(--ada-line); background: var(--ada-white);
}
.case-slide.is-active { display: grid; animation: ada-fade 0.45s ease; }
.case-slide__media { position: relative; min-height: 380px; background: var(--ada-dark-bg); }
.case-slide__img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0.8; }
.case-slide__logo {
	position: absolute; inset: 0; display: flex; align-items: center; justify-content: center;
}
.case-slide__logo img { max-width: 40%; max-height: 64px; filter: brightness(0) invert(1); }
.case-slide__body { padding: clamp(28px, 4vw, 52px); display: grid; gap: 18px; align-content: center; }
.case-slide__quote { margin: 0; font-weight: 500; max-width: 30ch; }
.case-slide__stats { display: grid; grid-template-columns: 1fr 1fr; border-top: 1px solid var(--ada-line); }
.case-slide__stat { padding: 18px 18px 0 0; display: grid; gap: 4px; }
.case-slide__stat + .case-slide__stat { border-left: 1px solid var(--ada-line); padding-left: 18px; }
.case-slide__stat-value { color: var(--ada-red); font-size: var(--fs-h4); font-weight: 600; }
.case-slide__foot { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-top: 6px; flex-wrap: wrap; }
.case-carousel__nav { display: inline-flex; gap: 10px; }

@media (max-width: 900px) { .case-slide.is-active { grid-template-columns: 1fr; } .case-slide__media { min-height: 240px; } }

/* ---------- Integrations orbit ---------- */
.orbit__intro { max-width: 56ch; margin-inline: auto; }
.orbit {
	position: relative; width: min(640px, 100%); aspect-ratio: 640 / 420;
	margin: clamp(28px, 4vw, 52px) auto 0;
}
.orbit__paths { position: absolute; inset: 0; width: 100%; height: 100%; }
.orbit__paths path { stroke-dashoffset: 0; animation: ada-orbit-dash 30s linear infinite; }
@keyframes ada-orbit-dash { to { stroke-dashoffset: -200; } }
.orbit__center {
	position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%);
	width: 108px; height: 108px; border-radius: 50%;
	background: radial-gradient(circle at 34% 30%, #2A2A2A, #101010);
	display: flex; align-items: center; justify-content: center;
	box-shadow: 0 24px 50px rgba(17, 17, 17, 0.35);
	animation: ada-pulse 4s ease-in-out infinite;
}
.orbit__center svg { width: 34px; height: 48px; }
@keyframes ada-pulse {
	0%, 100% { box-shadow: 0 24px 50px rgba(17, 17, 17, 0.35), 0 0 0 0 rgba(181, 11, 11, 0.28); }
	50% { box-shadow: 0 24px 50px rgba(17, 17, 17, 0.35), 0 0 0 26px rgba(181, 11, 11, 0); }
}
.orbit__chip {
	position: absolute; width: 84px; height: 84px; border-radius: 50%;
	background: var(--ada-white); box-shadow: var(--shadow-card);
	display: flex; align-items: center; justify-content: center;
	padding: 18px; animation: ada-float 6.5s ease-in-out infinite;
}
.orbit__chip img { max-width: 100%; max-height: 100%; object-fit: contain; }
.orbit__name { font-size: 11px; font-weight: 700; color: var(--ada-grey-dark); text-align: center; }
.orbit__chip--1 { left: 12%; top: 8%; }
.orbit__chip--2 { right: 12%; top: 8%; animation-delay: 0.8s; }
.orbit__chip--3 { left: 4%; top: 42%; animation-delay: 1.6s; }
.orbit__chip--4 { right: 4%; top: 42%; animation-delay: 2.4s; }
.orbit__chip--5 { left: 12%; bottom: 6%; animation-delay: 3.2s; }
.orbit__chip--6 { right: 12%; bottom: 6%; animation-delay: 4s; }
@media (max-width: 640px) { .orbit__chip { width: 62px; height: 62px; padding: 12px; } .orbit__center { width: 84px; height: 84px; } }

/* ---------- CTA banner ---------- */
.cta-card {
	position: relative; display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 0.85fr);
	background: linear-gradient(120deg, #1B1B1B, #101010);
	color: var(--ada-white); border-radius: var(--radius-lg);
	padding: clamp(28px, 4vw, 52px); overflow: visible; align-items: center;
	min-height: 300px;
}
.cta-card__dot { display: inline-block; width: 9px; height: 9px; border-radius: 50%; background: var(--ada-red); margin-left: 8px; vertical-align: middle; }
.cta-card__body { color: var(--ada-dark-muted); max-width: 52ch; margin-bottom: 22px; }
/* Cut-out sizes with the CARD (head pokes ~16% above), never the viewport. */
.cta-card__media {
	position: absolute; right: clamp(20px, 6%, 80px); bottom: 0; top: -16%;
	display: flex; align-items: flex-end; pointer-events: none;
}
.cta-card__img, .cta-card__media img, .cta-card__media .img-placeholder {
	height: 100%; width: auto; max-width: none; object-fit: contain; object-position: bottom;
}
.cta-card__media .img-placeholder { display: none; }
@media (max-width: 900px) {
	.cta-card { grid-template-columns: 1fr; }
	.cta-card__media { display: none; }
}

/* ---------- Stats row ---------- */
.stats-row { display: grid; grid-template-columns: repeat(3, 1fr); }
.stats-row__cell { padding: 10px clamp(18px, 3vw, 44px); display: grid; gap: 8px; align-content: start; }
.stats-row__cell + .stats-row__cell { border-left: 1px solid var(--ada-line); }
.stats-row__value { color: var(--ada-red); font-size: clamp(30px, 3.4vw, 44px); font-weight: 600; line-height: 1; }
.stats-row__caption { max-width: 30ch; }
@media (max-width: 720px) {
	.stats-row { grid-template-columns: 1fr; gap: 20px; }
	.stats-row__cell + .stats-row__cell { border-left: 0; border-top: 1px solid var(--ada-line); padding-top: 20px; }
}

/* ---------- Values grid ---------- */
.values-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 22px; margin-top: clamp(24px, 3vw, 40px); }
.value-card {
	border: 1px solid var(--ada-line); border-radius: var(--radius);
	padding: 26px; background: var(--ada-white);
	transition: transform 0.25s var(--ease-out), box-shadow 0.25s var(--ease-out);
}
.value-card:hover { transform: translateY(-4px); box-shadow: var(--shadow-card); }
.value-card__icon {
	display: inline-flex; width: 42px; height: 42px; align-items: center; justify-content: center;
	border-radius: 10px; background: #FBE9E9; color: var(--ada-red); margin-bottom: 16px;
}
.value-card__icon svg { width: 22px; height: 22px; }
.value-card .h5 { margin-bottom: 8px; }
@media (max-width: 1024px) { .values-grid { grid-template-columns: 1fr; } }

/* ---------- Quote banner (dark, slash mark) ---------- */
.quote-banner {
	position: relative; overflow: hidden;
	background: linear-gradient(120deg, #1C1C1C, #101010);
	color: var(--ada-white); border-radius: var(--radius-lg);
	padding: clamp(36px, 6vw, 72px);
}
.quote-banner__quote { max-width: 24ch; margin: 0; font-weight: 500; }
.quote-banner__quote em { font-style: italic; font-weight: 700; }
.quote-banner__attr { color: var(--ada-dark-muted); margin-top: 16px; }
.quote-banner__mark { position: absolute; right: -30px; top: -40px; bottom: -40px; width: 42%; pointer-events: none; }
.quote-banner__slash {
	position: absolute; right: 22%; top: -12%; width: 26%; height: 130%;
	background: linear-gradient(160deg, #C4180D, #8E0A1E);
	transform: skewX(-24deg);
	border-radius: 18px;
}
.quote-banner__dot {
	position: absolute; right: 6%; bottom: 10%; width: clamp(60px, 7vw, 96px); aspect-ratio: 1;
	background: radial-gradient(circle at 32% 30%, #C4180D, #8E0A1E); border-radius: 50%;
}
@media (max-width: 720px) { .quote-banner__mark { opacity: 0.5; } }

/* ---------- Accordions ---------- */
.accordion__item { border-top: 1px solid var(--ada-line); }
.accordion__item:last-child { border-bottom: 1px solid var(--ada-line); }
.accordion__heading { margin: 0; font-size: inherit; font-weight: inherit; }
.accordion__trigger {
	display: flex; align-items: center; justify-content: space-between; gap: 18px;
	width: 100%; padding: 18px 2px; text-align: left;
	font-size: var(--fs-body); font-weight: 500; line-height: 1.45;
}
.accordion__trigger:hover { color: var(--ada-red); }
.accordion__icon { position: relative; flex: 0 0 auto; width: 18px; height: 18px; color: var(--ada-red); }
.accordion__icon::before, .accordion__icon::after {
	content: ''; position: absolute; background: currentColor; border-radius: 1px;
	transition: transform 0.25s ease, opacity 0.25s ease;
}
.accordion__icon::before { left: 0; right: 0; top: 8px; height: 2px; }
.accordion__icon::after { top: 0; bottom: 0; left: 8px; width: 2px; }
.accordion__item.is-open .accordion__icon::after { transform: scaleY(0); }
.accordion__panel { overflow: hidden; }
.accordion__body { padding: 0 40px 20px 2px; max-width: 62ch; }
.accordion__bullet { display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: var(--ada-red); margin-right: 12px; vertical-align: 2px; }

/* FAQ strip */
.faqs-strip__inner { display: grid; grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr); gap: clamp(32px, 5vw, 72px); align-items: start; }
.faqs-strip__head .btn { margin-top: 18px; }
.faqs-strip__head .h3 { max-width: 14ch; }
@media (max-width: 900px) { .faqs-strip__inner { grid-template-columns: 1fr; } }

/* FAQ page */
.faq-page { display: grid; grid-template-columns: minmax(0, 1fr) 250px; gap: clamp(32px, 5vw, 72px); margin-top: clamp(24px, 3vw, 44px); }
.faq-group + .faq-group { margin-top: clamp(36px, 5vw, 60px); }
.faq-group__title { margin-bottom: 14px; }
.faq-page__aside { order: 2; }
.faq-page__nav { position: sticky; top: 110px; }
.faq-page__nav-title { color: var(--ada-red); font-size: var(--fs-caption); font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; margin-bottom: 12px; border-bottom: 1px solid var(--ada-line); padding-bottom: 10px; }
.faq-page__nav ul { list-style: none; display: grid; gap: 8px; }
.faq-page__nav a { text-decoration: none; color: var(--ada-muted); font-size: var(--fs-body-sm); position: relative; padding-left: 14px; }
.faq-page__nav a::before { content: ''; position: absolute; left: 0; top: 7px; width: 6px; height: 6px; border-radius: 50%; background: transparent; }
.faq-page__nav a.is-active { color: var(--ada-red); font-weight: 600; }
.faq-page__nav a.is-active::before { background: var(--ada-red); }
@media (max-width: 900px) { .faq-page { grid-template-columns: 1fr; } .faq-page__aside { order: -1; } .faq-page__nav { position: static; } }

/* ---------- Timeline cards ---------- */
.timeline { position: relative; margin-top: clamp(28px, 4vw, 48px); }
/* Connector drawn per node (behind its card) so it ends at the last card —
   a line running on past the final step read as a missing extra step. */
.timeline__node { position: relative; padding-top: clamp(56px, 7vw, 88px); }
.timeline__node::before {
	content: ''; position: absolute; left: 50%; top: 0; bottom: 0;
	border-left: 2.5px dashed rgba(181, 11, 11, 0.75); transform: translateX(-1px);
}
.timeline__node:first-child { padding-top: 0; }
.timeline__node:first-child::before { top: -18px; }
.timeline__node:last-child::before { bottom: auto; height: clamp(56px, 7vw, 88px); }
.timeline__node:first-child:last-child::before { height: 18px; }
.timeline__dot {
	position: absolute; left: 50%; top: 6px; transform: translateX(-50%);
	width: 16px; height: 16px; border-radius: 50%; background: var(--ada-red);
	box-shadow: 0 0 0 5px rgba(181, 11, 11, 0.15); z-index: 1;
}
/* Dots sit centred in the gap between cards. */
.timeline__node .timeline__dot { top: clamp(20px, 2.6vw, 36px); }
.timeline__node:first-child .timeline__dot { top: -26px; }
.timeline__card {
	position: relative; display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 0.85fr);
	gap: clamp(22px, 3.5vw, 48px);
	background: linear-gradient(130deg, #1E1E1E, #141414);
	color: var(--ada-white); border: 1px solid rgba(181, 11, 11, 0.35);
	border-radius: var(--radius-lg); padding: clamp(24px, 3.5vw, 44px);
}
/* No "What happens here" checklist: the copy runs the full card width. */
.timeline__card--solo { grid-template-columns: minmax(0, 1fr); }
.timeline__body { color: var(--ada-dark-muted); }
.timeline__side-title { font-weight: 600; color: var(--ada-white); margin-bottom: 12px; }
.timeline__card .link-more { margin-top: 14px; color: var(--ada-white); }
.timeline__card .link-more .arrow { color: var(--ada-red); }
.timeline__card .link-more:hover { opacity: 0.85; }
.timeline__heading .cta-card__dot { margin-left: 10px; }
@media (max-width: 820px) {
	.timeline__node::before { left: 10px; }
	.timeline__dot { left: 10px; }
	.timeline__card { grid-template-columns: 1fr; margin-left: 30px; }
}

/* ---------- Comparison table ---------- */
.compare { border: 1px solid var(--ada-line); border-radius: var(--radius-lg); overflow: hidden; box-shadow: var(--shadow-card); }
.compare__head { padding: clamp(20px, 3vw, 34px) clamp(20px, 3vw, 34px) 0; }
.compare__title { margin: 0 0 8px; }
.compare__accent { color: var(--ada-red); display: block; font-size: var(--fs-body); font-weight: 600; margin-bottom: 4px; }
.compare__scroll { overflow-x: auto; }
.compare__table { width: 100%; border-collapse: collapse; min-width: 640px; }
.compare__table th, .compare__table td { padding: 16px clamp(16px, 2.5vw, 30px); text-align: left; font-size: var(--fs-body-sm); border-top: 1px solid var(--ada-line); vertical-align: top; }
.compare__table thead th { border-top: 0; font-size: var(--fs-body); font-weight: 600; padding-top: 22px; }
.compare__table tbody th { font-weight: 500; color: var(--ada-ink); width: 26%; }
.compare__ada-col { background: #FBF1F1; }
thead .compare__ada-col { color: var(--ada-red); }
.compare__mark { display: inline-block; margin-right: 10px; font-weight: 700; }
.compare__mark--yes { color: var(--ada-red); }
.compare__mark--no { color: var(--ada-grey); }
.compare__note { font-style: italic; color: var(--ada-muted); }

/* ---------- Milestones ---------- */
.milestones__head { display: flex; justify-content: space-between; align-items: flex-end; gap: 24px; }
.milestones__intro { max-width: 56ch; }
.milestones__scroller { margin-top: clamp(24px, 3vw, 40px); }
.milestones__track {
	display: grid; grid-auto-flow: column; grid-auto-columns: min(300px, 78vw);
	gap: 20px; overflow-x: auto; scroll-snap-type: x mandatory;
	padding-bottom: 8px; scrollbar-width: none;
}
.milestones__track::-webkit-scrollbar { display: none; }
.milestone-card {
	scroll-snap-align: start;
	border: 1px solid var(--ada-line); border-radius: var(--radius);
	padding: 24px; background: var(--ada-white); display: grid; gap: 12px; align-content: start;
}
.milestone-card__year {
	justify-self: start; background: var(--ada-red-dark); color: var(--ada-white);
	font-size: var(--fs-caption); font-weight: 700; border-radius: 999px; padding: 4px 12px;
}
.milestones__nav { display: flex; gap: 10px; justify-content: flex-end; margin-top: 16px; }

/* ---------- Team grid + modal ---------- */
.team-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; margin-top: clamp(24px, 3vw, 44px); }
.team-card { position: relative; }
.team-card__open { display: grid; gap: 4px; text-align: left; width: 100%; }
.team-card__media { display: block; border-radius: var(--radius); overflow: hidden; aspect-ratio: 5 / 6; margin-bottom: 12px; background: var(--ada-grey-lightest); }
.team-card__media img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.4s var(--ease-out); }
.team-card__open:hover .team-card__media img { transform: scale(1.04); }
.team-card__name { margin: 0; }
.team-card__li { display: inline-flex; margin-top: 8px; color: var(--ada-red); }
.team-card__li svg { width: 20px; height: 20px; }
@media (max-width: 1000px) { .team-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 520px) { .team-grid { grid-template-columns: 1fr; } }

/* Modal is fixed-position and class-styled, so the [hidden] guard in base.css
 * is what keeps it closed — never add a display rule stronger than it. */
.team-modal { position: fixed; inset: 0; z-index: 90; display: grid; place-items: center; padding: 20px; }
.team-modal[hidden] { display: none !important; }
.team-modal__backdrop { position: absolute; inset: 0; background: rgba(10, 10, 10, 0.6); }
.team-modal__card {
	position: relative; display: grid; grid-template-columns: 260px 1fr; gap: 28px;
	width: min(760px, 100%); background: linear-gradient(130deg, #202020, #131313);
	color: var(--ada-white); border-radius: var(--radius-lg); padding: 28px;
	box-shadow: 0 40px 90px rgba(0, 0, 0, 0.4);
	animation: ada-fade 0.3s ease;
}
.team-modal__close { position: absolute; right: 16px; top: 12px; color: var(--ada-grey); font-size: 18px; padding: 8px; }
.team-modal__close:hover { color: var(--ada-white); }
.team-modal__media { border-radius: var(--radius); overflow: hidden; aspect-ratio: 5 / 6; }
.team-modal__media img { width: 100%; height: 100%; object-fit: cover; }
.team-modal__name { display: flex; align-items: center; gap: 10px; margin: 4px 0 2px; }
.team-modal__li { color: var(--ada-white); background: rgba(255, 255, 255, 0.12); border-radius: 5px; display: inline-flex; padding: 3px; }
.team-modal__li svg { width: 16px; height: 16px; }
.team-modal__role { color: var(--ada-grey); margin-bottom: 14px; }
.team-modal__bio { color: var(--ada-dark-muted); }
@media (max-width: 680px) { .team-modal__card { grid-template-columns: 1fr; max-height: 90vh; overflow-y: auto; } }

/* ---------- Explore cards ---------- */
.explore-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.explore-card { display: grid; gap: 8px; align-content: start; }
.explore-card__media { display: block; border-radius: var(--radius); overflow: hidden; aspect-ratio: 16 / 10; margin-bottom: 8px; }
.explore-card__media img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.4s var(--ease-out); }
.explore-card:hover .explore-card__media img { transform: scale(1.05); }
@media (max-width: 900px) { .explore-cards { grid-template-columns: 1fr; } }

/* ---------- Pricing ---------- */
.plans { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; margin-top: clamp(30px, 4vw, 52px); align-items: stretch; }
.plan {
	position: relative; border: 1px solid var(--ada-line); border-radius: var(--radius-lg);
	padding: 28px; display: grid; gap: 10px; align-content: start; background: var(--ada-white);
}
.plan--featured { border-color: var(--ada-red); box-shadow: var(--shadow-card); }
.plan__badge {
	position: absolute; top: -12px; right: 20px;
	background: var(--ada-red); color: var(--ada-white);
	font-size: 11px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase;
	border-radius: 999px; padding: 5px 12px;
}
.plan__name { font-size: var(--fs-caption); font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; color: var(--ada-grey-dark); margin: 0; }
.plan__price { margin: 0; display: flex; align-items: baseline; gap: 6px; }
.plan__price .h2 { margin: 0; }
.plan__desc { min-height: 3.6em; }
.plan__cta { justify-self: stretch; }
.plan__included { font-weight: 600; margin: 14px 0 0; }
@media (max-width: 900px) { .plans { grid-template-columns: 1fr; } }

.pricing-table { overflow-x: auto; margin-top: clamp(28px, 4vw, 48px); }
.pricing-table table { width: 100%; border-collapse: collapse; min-width: 720px; }
.pricing-table th, .pricing-table td { padding: 13px 18px; font-size: var(--fs-body-sm); text-align: center; }
.pricing-table tbody th[scope='row'] { text-align: left; font-weight: 400; color: var(--ada-grey-dark); width: 34%; }
.pricing-table tbody tr:nth-child(even) { background: var(--ada-grey-lightest); }
.pricing-table__plans th { vertical-align: top; padding-bottom: 20px; }
.pricing-table__plan-name { display: block; font-weight: 700; font-size: var(--fs-body); }
.pricing-table__price { display: block; margin: 2px 0 10px; }
.pricing-table__group th {
	text-align: left; font-weight: 600; font-size: var(--fs-body);
	padding-top: 30px; border-bottom: 1px solid var(--ada-line);
}
.pricing-table .is-featured { background: #FBF1F1; }
.pricing-table tbody tr:nth-child(even) .is-featured { background: #F7E7E7; }
.pricing-table__notes { margin-top: 18px; }

/* ---------- Form split (Contact / Demo) ---------- */
.form-split { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr); gap: clamp(32px, 5vw, 80px); align-items: start; }
.form-split__copy { padding-top: 12px; }
.form-split__copy .h2 { max-width: 16ch; }
.form-card {
	background: var(--ada-white); border-radius: var(--radius-lg);
	box-shadow: var(--shadow-card); border: 1px solid var(--ada-line);
	padding: clamp(24px, 3.5vw, 44px);
}
.form-card__missing { color: var(--ada-muted); font-size: var(--fs-body-sm); }
.module--form-split .logo-strip { margin-top: clamp(40px, 6vw, 72px); }
@media (max-width: 900px) { .form-split { grid-template-columns: 1fr; } }
/* "Keep form in view": the card sticks below the sticky header while long copy scrolls. */
@media (min-width: 901px) { .form-split--sticky .form-card { position: sticky; top: 102px; } }

/* ---------- Dimensions accordion (product) ---------- */
.dimensions { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(32px, 5vw, 72px); align-items: start; margin-top: clamp(24px, 3vw, 44px); }
.dimensions__intro { max-width: 60ch; }
.accordion--dimensions .accordion__trigger { font-size: var(--fs-h5); font-weight: 500; }
@media (max-width: 900px) { .dimensions { grid-template-columns: 1fr; } }
/* Desktop: heading + briefing mock stack on the left and the accordion runs
   from the top of the section on the right, so a long accordion (6+ items)
   doesn't leave a tall gap under the mock (client request, Nov 2026). */
@media (min-width: 901px) {
	.module--dimensions-accordion .container {
		display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); grid-template-rows: auto 1fr;
		column-gap: clamp(32px, 5vw, 72px); align-items: start;
	}
	.module--dimensions-accordion .container > header { grid-column: 1; grid-row: 1; }
	.module--dimensions-accordion .dimensions { display: contents; }
	.module--dimensions-accordion .dimensions__media { grid-column: 1; grid-row: 2; margin-top: clamp(24px, 3vw, 44px); }
	.module--dimensions-accordion .accordion--dimensions { grid-column: 2; grid-row: 1 / span 2; }
}

/* ---------- Rich text / prose ---------- */
.prose { max-width: 72ch; }
.prose--narrow { max-width: 68ch; margin-inline: auto; }
.prose h2 { font-size: var(--fs-h4); font-weight: 600; margin-top: 1.6em; }
.prose h3 { font-size: var(--fs-h5); font-weight: 600; margin-top: 1.4em; }
.prose img { border-radius: var(--radius); margin-block: 1.6em; }
.prose a { color: var(--ada-red); }
.prose ul, .prose ol { padding-left: 1.2em; margin-bottom: 1em; display: grid; gap: 0.4em; }
.prose blockquote { border-left: 3px solid var(--ada-red); margin: 1.4em 0; padding: 0.2em 0 0.2em 1.2em; color: var(--ada-grey-dark); font-size: var(--fs-body-lg); }

/* ---------- Blog archive ---------- */
.blog-archive__head { margin-bottom: clamp(28px, 4vw, 52px); }
.blog-archive__intro { max-width: 60ch; margin-inline: auto; }
.filter-pills { display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; margin-top: 26px; }
.filter-pill {
	display: inline-block; padding: 8px 18px; border-radius: 999px;
	border: 1px solid var(--ada-line); text-decoration: none;
	font-size: var(--fs-body-sm); font-weight: 500; color: var(--ada-grey-dark);
	transition: all 0.2s ease;
}
.filter-pill:hover { border-color: var(--ada-red); color: var(--ada-red); }
.filter-pill.is-active { background: var(--ada-red-dark); border-color: var(--ada-red-dark); color: var(--ada-white); }

.blog-archive__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 30px 24px; }
.post-card { display: grid; gap: 6px; align-content: start; }
.post-card--featured { grid-column: 1 / -1; grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr); gap: 28px; align-items: center; }
.post-card__media { position: relative; display: block; border-radius: var(--radius); overflow: hidden; aspect-ratio: 16 / 10; background: var(--ada-grey-lightest); }
.post-card--featured .post-card__media { aspect-ratio: 16 / 9; }
.post-card__media img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.4s var(--ease-out); }
.post-card:hover .post-card__media img { transform: scale(1.04); }
.post-card__pill {
	position: absolute; left: 12px; top: 12px;
	background: var(--ada-red-dark); color: var(--ada-white);
	font-size: 11px; font-weight: 600; letter-spacing: 0.04em;
	padding: 5px 12px; border-radius: 999px;
}
.post-card__pill--static { position: static; display: inline-block; text-decoration: none; }
.post-card__meta { display: flex; gap: 8px; margin: 10px 0 0; }
.post-card__title { margin: 0; }
.post-card__title a { text-decoration: none; }
.post-card__title a:hover { color: var(--ada-red); }
.post-card--featured .post-card__title { font-size: var(--fs-h4); }
.post-card__excerpt { margin: 0; }
.post-card .link-more { margin-top: 6px; }
.blog-archive__foot { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-top: clamp(30px, 4vw, 48px); flex-wrap: wrap; }
.pagination-nav .page-numbers { display: inline-flex; align-items: center; justify-content: center; min-width: 34px; height: 34px; padding: 0 6px; border-radius: 6px; text-decoration: none; font-size: var(--fs-body-sm); color: var(--ada-grey-dark); }
.pagination-nav .page-numbers.current { background: var(--ada-red-dark); color: var(--ada-white); }
.pagination-nav .page-numbers:hover:not(.current) { background: var(--ada-grey-lightest); }
@media (max-width: 900px) { .blog-archive__grid { grid-template-columns: 1fr; } .post-card--featured { grid-template-columns: 1fr; } }

/* ---------- Single post ---------- */
.single-post__head { padding-top: clamp(24px, 3vw, 44px); }
.single-post__back { margin-bottom: 26px; display: inline-flex; }
.single-post__meta { display: flex; align-items: center; gap: 12px; margin: 18px 0 10px; flex-wrap: wrap; }
.single-post__title { max-width: 24ch; }
.single-post__hero { border-radius: var(--radius-lg); overflow: hidden; margin-block: clamp(20px, 3vw, 36px); aspect-ratio: 21 / 9; }
.single-post__hero img { width: 100%; height: 100%; object-fit: cover; }
.single-post__body { padding-bottom: var(--section-pad); }
.single-post__body.prose { max-width: min(72ch, 100% - 2 * var(--gutter)); }
.other-articles { border-top: 1px solid var(--ada-line); }

/* ---------- 404 ---------- */
.error-404__body { max-width: 46ch; margin-inline: auto; }
.error-404__actions { display: flex; gap: 14px; justify-content: center; margin-top: 28px; flex-wrap: wrap; }

/* ---------- Pricing options (pricing page hero) ---------- */
.module--pricing-options { padding-block: clamp(72px, 9vw, 130px) clamp(48px, 6vw, 80px); overflow: hidden; }
.pricing-options__head { max-width: 760px; }
.pricing-options__head .lead { margin-top: 18px; }
.text-red { color: var(--ada-red); }
.options { display: grid; grid-template-columns: repeat(var(--n, 2), minmax(0, 1fr)); gap: 20px; margin-top: clamp(32px, 4vw, 52px); }
.option {
	position: relative; overflow: hidden; display: flex; flex-direction: column; gap: 8px;
	background: var(--ada-white); border: 1px solid var(--ada-line); border-radius: var(--radius-lg);
	padding: clamp(24px, 3vw, 32px); color: var(--ada-ink); text-decoration: none;
	transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
/* The Ada slash, faint, along the right edge. */
.option::after {
	content: ""; position: absolute; right: -40px; top: 0; bottom: 0; width: 96px;
	background: var(--ada-red); transform: skewX(-18deg); opacity: 0.06; pointer-events: none;
}
a.option:hover { border-color: var(--ada-red); box-shadow: var(--shadow-card); }
.option__name { font-size: var(--fs-caption); font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; color: var(--ada-grey-dark); }
.option__price { font-size: var(--fs-h2); font-weight: 500; line-height: 1.15; letter-spacing: -0.01em; }
.option__price small { font-size: var(--fs-body); font-weight: 500; color: var(--ada-muted); letter-spacing: 0; }
.option__desc { color: var(--ada-muted); max-width: 44ch; }
.option__fit { color: var(--ada-red); font-weight: 600; font-size: var(--fs-body-sm); }
.option__link { margin-top: auto; padding-top: 10px; }
.option--dark { background: linear-gradient(120deg, #1B1B1B, #101010); border-color: transparent; color: var(--ada-white); }
.option--dark::after { opacity: 0.3; }
.option--dark .option__name, .option--dark .option__price small, .option--dark .option__desc { color: var(--ada-dark-muted); }
.option--dark .option__fit { color: #FF7A80; }
.option--dark .option__link { color: var(--ada-white); }
.option--dark .option__link .arrow { color: var(--ada-red); }
.pricing-options__decide { display: grid; justify-items: center; gap: 16px; text-align: center; margin-top: clamp(32px, 4vw, 48px); }
.pricing-options__decide p { margin: 0; max-width: 54ch; }
@media (max-width: 900px) { .options { grid-template-columns: 1fr; } }

/* ---------- Numbered steps ---------- */
/* Straight after the pricing hero, as in the design: no second band of space. */
.module--pricing-options + .module--steps-row { padding-top: 0; }
.steps {
	list-style: none; margin: clamp(28px, 4vw, 44px) 0 0; padding: 0;
	display: grid; grid-template-columns: repeat(var(--n, 3), minmax(0, 1fr));
	border-top: 1px solid var(--ada-ink);
}
.step { padding: 26px 28px 0 0; }
.step + .step { padding-left: 28px; border-left: 1px solid var(--ada-line); }
.step__n { display: block; font-size: var(--fs-h2); font-weight: 500; line-height: 1; color: var(--ada-red); }
.step__title { margin: 14px 0 8px; }
.step p { margin: 0; }
@media (max-width: 760px) {
	.steps { grid-template-columns: 1fr; }
	.step, .step + .step { padding: 22px 0; border-left: 0; border-bottom: 1px solid var(--ada-line); }
}

/* ---------- Pricing bundles ---------- */
.pricing-bundles__intro { max-width: 62ch; margin-top: 12px; }
.bundles { display: grid; grid-template-columns: repeat(var(--n, 5), minmax(0, 1fr)); gap: 16px; margin-top: clamp(32px, 4vw, 48px); align-items: stretch; }
.bundle {
	position: relative; display: flex; flex-direction: column;
	background: var(--ada-white); border: 1px solid var(--ada-line); border-radius: var(--radius-lg);
	padding: 24px 20px 20px;
}
.bundle p { margin: 0; }
.bundle__name { font-size: var(--fs-caption); font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; color: var(--ada-grey-dark); }
.bundle__price { font-size: var(--fs-h3); font-weight: 500; line-height: 1.15; margin: 8px 0 2px !important; }
.bundle__credits { font-weight: 600; }
.bundle__bonus { color: var(--ada-red); font-weight: 600; font-size: var(--fs-body-sm); min-height: 2.9em; margin-top: 4px !important; }
.bundle__bonus--none { color: var(--ada-muted); font-weight: 400; }
.bundle__meter { display: block; height: 6px; border-radius: 6px; background: var(--ada-grey-light); margin: 12px 0 16px; overflow: hidden; }
.bundle__meter i { display: block; height: 100%; background: var(--ada-red); border-radius: 6px; }
.bundle__rate { margin-top: auto !important; padding-top: 12px; border-top: 1px solid var(--ada-line); font-size: var(--fs-body-sm); color: var(--ada-muted); }
.bundle__rate strong { color: var(--ada-ink); }
.bundle__cta { margin-top: 16px; width: 100%; justify-content: center; }
.bundle--best { background: linear-gradient(160deg, #1B1B1B, #101010); border-color: transparent; color: var(--ada-white); box-shadow: var(--shadow-card); }
.bundle--best .bundle__name, .bundle--best .bundle__rate { color: var(--ada-dark-muted); }
.bundle--best .bundle__rate { border-color: rgba(255, 255, 255, 0.14); }
.bundle--best .bundle__rate strong { color: var(--ada-white); }
.bundle--best .bundle__bonus { color: #FF7A80; }
.bundle--best .bundle__meter { background: rgba(255, 255, 255, 0.14); }
.bundles-tip {
	display: flex; gap: 16px; align-items: flex-start; margin-top: 24px;
	padding: 20px 22px; border-radius: var(--radius-lg); background: #FDF3F3;
}
.bundles-tip svg { flex: none; width: 24px; height: 24px; color: var(--ada-red); margin-top: 1px; }
.bundles-tip__body p { margin: 0; }
@media (max-width: 1100px) {
	.bundles { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.bundle--best { grid-column: 1 / -1; }
}
@media (max-width: 600px) { .bundles { grid-template-columns: 1fr; } }

/* ---------- CTA banner: figures + split (no photo) variant ---------- */
.cta-card__figures { display: flex; flex-wrap: wrap; gap: 12px 40px; margin: 4px 0 0; }
.cta-card__figures dt { font-size: var(--fs-h4); font-weight: 600; color: var(--ada-white); line-height: 1.2; }
.cta-card__figures dd { margin: 2px 0 0; font-size: var(--fs-body-sm); color: var(--ada-dark-muted); }
.cta-card--split { grid-template-columns: minmax(0, 1fr) auto; gap: 32px; min-height: 0; overflow: hidden; }
.cta-card--split .cta-card__body { margin-bottom: 18px; }
.cta-card--split::after {
	content: ""; position: absolute; right: -60px; top: -40px; width: 220px; height: 140%;
	background: rgba(255, 255, 255, 0.04); transform: skewX(-22deg); pointer-events: none;
}
@media (max-width: 900px) { .cta-card--split { grid-template-columns: 1fr; } }

/* ---------- FAQs strip intro ---------- */
.faqs-strip__intro { margin: 12px 0 0; max-width: 40ch; }

/* ---------- Rich text tables (legal pages, articles) ---------- */
/* Pasted-in Word tables carry fixed widths; tables fill the column instead and
   scroll sideways on small screens rather than squashing. */
.prose table {
	width: 100%; margin: 1.4em 0 1.8em;
	border-collapse: collapse; font-size: var(--fs-body-sm); line-height: 1.5;
}
@media (max-width: 640px) { .prose table { display: block; overflow-x: auto; } }
.prose table :is(td, th) {
	width: auto !important; min-width: 9em; padding: 12px 14px; text-align: left; vertical-align: top;
	border-bottom: 1px solid var(--ada-line);
}
.prose table thead :is(td, th), .prose table tr:first-child th {
	font-weight: 600; color: var(--ada-ink); background: var(--ada-grey-lightest);
	border-bottom: 2px solid var(--ada-ink);
}
.prose table tbody tr:nth-child(even) { background: #FBFCFC; }
.prose table p { margin: 0; }

/* ---------- Media + Text: headingless text section continuing the one above ---------- */
.module--media-text + .module--media-text.media-text--continued { padding-top: 0; }
.module--media-text:has(+ .module--media-text.media-text--continued) { padding-bottom: calc(var(--section-pad) * 0.35); }

/* ---------- Newsletter: footer sign-up + Resources card ---------- */
.newsletter { margin-top: 22px; max-width: 360px; }
.newsletter__heading { color: var(--ada-white); font-weight: 600; margin: 0 0 4px; }
.newsletter__text { color: var(--ada-dark-muted); font-size: var(--fs-body-sm); margin: 0 0 12px; }
.newsletter .gform_wrapper form { gap: 0; }
.newsletter .gform_wrapper .gform_fields { grid-template-columns: 1fr; gap: 10px; }
.newsletter .gform_wrapper .gfield_label { color: var(--ada-dark-muted); }
.newsletter .gform_wrapper input[type='email'],
.newsletter .gform_wrapper input[type='text'] {
	background: rgba(255, 255, 255, 0.06); border-color: rgba(255, 255, 255, 0.22); color: var(--ada-white);
}
.newsletter .gform_wrapper ::placeholder { color: rgba(255, 255, 255, 0.5); }
.newsletter .gform_wrapper .gfield--type-html, .newsletter .gform_wrapper .gfield--type-html p { color: var(--ada-dark-muted); }
.newsletter .gform_wrapper .gfield--type-html a { color: var(--ada-white); }
.newsletter .gform_footer { margin-top: 12px; }
.newsletter .gform_footer .gform_button { width: auto; }
.newsletter .gform_confirmation_message { color: var(--ada-white); font-size: var(--fs-body-sm); }
.newsletter-band { padding-top: 0; }
.newsletter-card {
	display: flex; align-items: center; justify-content: space-between; gap: 24px 40px; flex-wrap: wrap;
	background: linear-gradient(135deg, #FFFFFF 0%, var(--ada-warm-tint) 70%, #F9E9E4 100%);
	border: 1px solid var(--ada-line); border-radius: var(--radius-lg); padding: clamp(24px, 4vw, 40px);
}
.newsletter-card .h4 { margin: 0 0 6px; }
.newsletter-card p { margin: 0; max-width: 56ch; }

/* ---------- Cookie banner ---------- */
.cookie-banner {
	position: fixed; left: 50%; bottom: 20px; transform: translateX(-50%); z-index: 90;
	width: min(760px, calc(100% - 32px));
	display: flex; align-items: center; gap: 16px 24px; flex-wrap: wrap;
	background: var(--ada-white); border: 1px solid var(--ada-line); border-radius: var(--radius-lg);
	box-shadow: 0 18px 50px rgba(17, 17, 17, 0.16); padding: 18px 22px;
}
.cookie-banner[hidden] { display: none; }
.cookie-banner__text { flex: 1 1 320px; margin: 0; font-size: var(--fs-body-sm); color: var(--ada-grey-dark); }
.cookie-banner__text a { color: var(--ada-red); }
.cookie-banner__actions { display: flex; gap: 10px; flex-wrap: wrap; }
.site-footer__cookies {
	background: none; border: 0; padding: 0; cursor: pointer;
	color: var(--ada-grey); font: inherit; text-decoration: none;
}
.site-footer__cookies:hover { color: var(--ada-white); }

/* ---------- Book a meeting (calendar pop-up) ---------- */
.module--booking { padding-block: clamp(72px, 9vw, 130px); overflow: hidden; }
.booking__inner { max-width: 760px; }
.booking__body { margin-top: 14px; }
.booking__ctas { margin-top: 28px; }
.booking-dialog {
	width: min(1000px, calc(100% - 32px)); height: min(760px, calc(100% - 48px));
	padding: 0; border: 0; border-radius: var(--radius-lg); overflow: hidden;
	box-shadow: 0 30px 80px rgba(17, 17, 17, 0.3);
}
.booking-dialog::backdrop { background: rgba(17, 17, 17, 0.55); }
.booking-dialog__frame, .booking-dialog__frame iframe { width: 100%; height: 100%; border: 0; display: block; }
.booking-dialog__close {
	position: absolute; top: 10px; right: 12px; z-index: 1;
	width: 40px; height: 40px; border-radius: 50%; border: 1px solid var(--ada-line);
	background: var(--ada-white); font-size: 24px; line-height: 1; cursor: pointer; color: var(--ada-ink);
}
