/*
 * Page: From Oracle Forms to AI agents (key products/oracle-forms-to-ai-agents), EN + FR.
 * Page-scoped styles: every rule starts with .aia (class on each section of the page),
 * so nothing here can reach another page. Colours come from the modern.css tokens and
 * the site's spectrum ribbon (assets/img/spectrum.svg).
 * Motion: assets/pages/oracle-forms-to-ai-agents.js adds html.aia-anim when motion is
 * allowed; without it (no JS, reduced motion) every block shows its final state.
 */

.aia {
	--aia-cyan: #72d5dc;
	--aia-blue: #7198ef;
	--aia-violet: #a581ee;
	--aia-pink: #ed80ae;
	--aia-agent: var(--c-agent, #ff5470);
	--aia-ok: var(--c-ok, #3ccf9e);
	--aia-ok-ink: #1d8a66;
	--aia-night: var(--c-night, #0d1520);
	--aia-dline: rgba(255, 255, 255, 0.1);
	--aia-dcard: rgba(255, 255, 255, 0.035);
	--aia-grad: linear-gradient(90deg, var(--aia-pink), var(--aia-violet) 50%, var(--aia-blue));
}
.aia .aia-mono { font-family: var(--font-mono); }
.aia .aia-mt6 { margin-top: var(--space-6); }
.aia .aia-mt4 { margin-top: var(--space-4); }
.aia .section-title.aia-h2-sm { font-size: var(--fs-2xl); }
.aia .gl-emp { color: #a9c0f5; }
.aia .gl-agent { color: #ff8a9c; }
.aia .gl-grey { color: #cfd7df; }
/* Sprite icons used inside the diagrams: the sprite's root stroke settings do not cross <use>. */
.aia svg use.gl-emp, .aia svg use.gl-agent, .aia svg use.gl-grey { fill: none; stroke: currentColor; stroke-width: 1.75; stroke-linecap: round; stroke-linejoin: round; }
.aia .sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }

/* Night sections: the hero, the core diagram, the worked example, the closing band. */
.aia--night {
	position: relative;
	isolation: isolate;
	overflow: clip;
	border-top: 0;
	background:
		radial-gradient(ellipse 55% 60% at 88% 0%, rgba(165, 129, 238, 0.17), transparent 70%),
		radial-gradient(ellipse 45% 55% at 0% 100%, rgba(237, 128, 174, 0.13), transparent 70%),
		var(--aia-night);
	color: var(--c-on-dark);
}
.aia--night::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	background-image: linear-gradient(var(--c-night-line, rgba(255,255,255,.045)) 1px, transparent 1px), linear-gradient(90deg, var(--c-night-line, rgba(255,255,255,.045)) 1px, transparent 1px);
	background-size: 44px 44px;
	-webkit-mask-image: radial-gradient(ellipse 80% 70% at 60% 40%, #000 20%, transparent 80%);
	mask-image: radial-gradient(ellipse 80% 70% at 60% 40%, #000 20%, transparent 80%);
	pointer-events: none;
}
.aia--night .section-title, .aia--night h3 { color: var(--c-on-dark); }
.aia--night .lead, .aia--night p { color: var(--c-on-dark-muted); }
.aia--night .eyebrow { color: var(--c-on-dark-muted); }
.aia .aia-grad-text {
	background: var(--aia-grad);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
}
.aia .aia-source { margin: var(--space-4) 0 0; font-size: var(--fs-xs); line-height: 1.6; color: var(--c-subtle); }
.aia--night .aia-source { color: #8592a0; }
.aia .aia-tag { display: inline-flex; align-items: center; gap: 6px; padding: 3px 10px; border-radius: 999px; font-size: var(--fs-xs); font-weight: 600; letter-spacing: .02em; background: var(--c-surface-2); color: var(--c-ink); }
.aia .aia-tag--illus { background: transparent; border: 1px dashed var(--c-line-strong); color: var(--c-subtle); font-weight: 500; }
.aia--night .aia-tag--illus { border-color: rgba(255,255,255,.22); color: #8f9cab; }

/* 1. Hero ------------------------------------------------------------------ */
.aia-hero { padding-block: clamp(44px, 6vw, 84px) clamp(48px, 6vw, 80px); background: var(--aia-night); }
.aia-hero::before { opacity: .22; mix-blend-mode: screen; }
.aia-hero__bg {
	position: absolute;
	z-index: -2;
	inset: 0 0 auto auto;
	width: min(1500px, 120%);
	height: 100%;
	object-fit: cover;
	object-position: 70% 40%;
	opacity: .55;
	-webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 45%), linear-gradient(to bottom, #000 70%, transparent);
	-webkit-mask-composite: source-in;
	mask-image: linear-gradient(90deg, transparent 0%, #000 45%), linear-gradient(to bottom, #000 70%, transparent);
	mask-composite: intersect;
	pointer-events: none;
}
.aia-hero__grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: clamp(28px, 4vw, 48px); align-items: center; }
@media (min-width: 980px) {
	.aia-hero__grid { grid-template-columns: minmax(0, 1.02fr) minmax(0, 1fr); gap: clamp(36px, 4vw, 64px); }
}
.aia-hero .eyebrow { color: var(--c-on-dark-muted); }
.aia-hero .aia-hero__title { max-width: 16ch; font-size: clamp(2.375rem, 1.3rem + 3.3vw, 3.75rem); line-height: 1.08; color: var(--c-on-dark); }
.aia-hero .aia-hero__title .lighter {
	margin-top: .12em;
	padding-bottom: .12em;
	margin-bottom: -.12em;
	background: var(--aia-grad);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
}
.aia-hero .lead { color: #b9c4cf; max-width: 36em; margin-top: var(--space-4); }
.aia-hero .btn--ghost { background: rgba(255,255,255,.04); border-color: rgba(255,255,255,.18); color: var(--c-on-dark); }
.aia-hero .btn--ghost:hover { border-color: rgba(255,255,255,.4); }
.aia-hero .btn--ghost::after { content: "↓"; font-size: 1.1em; line-height: 1; }
.aia-hero__proof { display: flex; flex-wrap: wrap; gap: 8px 22px; margin: var(--space-5) 0 0; padding: 0; list-style: none; font-size: var(--fs-sm); color: #aeb9c5; }
.aia-hero__proof li { display: flex; align-items: center; gap: 8px; }
.aia-hero__proof li::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--aia-ok); box-shadow: 0 0 0 4px rgba(60, 207, 158, .14); }
.aia-hero__proof strong { color: var(--c-on-dark); font-weight: 600; }
.aia-hero__visual { margin: 0; justify-self: center; width: min(100%, 540px); }
.aia-hero__visual svg { display: block; width: 100%; height: auto; overflow: visible; }

/* Shared SVG vocabulary (hero, core diagram, same-migration diagram). */
.aia svg text { font-family: var(--font-sans); }
.aia svg .t-mono { font-family: var(--font-mono); }
.aia svg .t-disp { font-family: var(--font-display); font-weight: 600; letter-spacing: -0.01em; }
.aia .flow-base { fill: none; stroke: rgba(255,255,255,.16); stroke-width: 2; }
.aia .flow-dash { fill: none; stroke-width: 2.4; stroke-linecap: round; stroke-dasharray: 3 13; }
.aia .flow-dash--red { stroke: var(--c-red); }
.aia .flow-dash--blue { stroke: var(--aia-blue); }
.aia .flow-dash--agent { stroke: var(--aia-agent); }
html.aia-anim .aia .flow-dash { animation: aia-flow 1.1s linear infinite; }
@keyframes aia-flow { to { stroke-dashoffset: -16; } }

/* Hero visual: triggers light up in turn, the rules flow to both callers. */
.aia-hv .led { fill: var(--aia-ok); }
.aia-hv .led-halo { fill: var(--aia-ok); opacity: .25; }
html.aia-anim .aia-hv .led, html.aia-anim .aia-hv .led-halo { animation: aia-led 4.8s ease-in-out infinite; animation-delay: calc(var(--i) * .6s); }
@keyframes aia-led { 0%, 8% { fill: #9aa4ad; opacity: .5; } 14%, 70% { fill: var(--aia-ok); opacity: 1; } 100% { fill: #9aa4ad; opacity: .5; } }
html.aia-anim .aia-hv .led-halo { animation-name: aia-halo; }
@keyframes aia-halo { 0%, 8% { opacity: 0; } 14% { opacity: .5; } 40%, 100% { opacity: 0; } }
.aia-hv .ofcs-glow { fill: var(--c-red); opacity: .25; filter: blur(14px); }
html.aia-anim .aia-hv .ofcs-glow { animation: aia-glow 3.2s ease-in-out infinite; }
@keyframes aia-glow { 50% { opacity: .5; } }
.aia-hv .ok-pill { opacity: 1; }
html.aia-anim .aia-hv .ok-pill { animation: aia-pill 4.8s ease-in-out infinite; }
html.aia-anim .aia-hv .ok-pill--b { animation-delay: 1.2s; }
@keyframes aia-pill { 0%, 30% { opacity: .25; } 40%, 85% { opacity: 1; } 100% { opacity: .25; } }

/* 2. Market shift ---------------------------------------------------------- */
.aia-market__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border-top: 1px solid var(--c-line); }
.aia-market__grid > div { padding: var(--space-5) var(--space-4) var(--space-4) 0; }
.aia-market__grid > div + div { padding-left: var(--space-4); border-left: 1px solid var(--c-line); }
.aia-big { display: block; font: 500 clamp(3rem, 2rem + 4vw, 5.25rem)/1 var(--font-display); letter-spacing: -0.045em; color: var(--c-ink); font-variant-numeric: tabular-nums; }
.aia-big .aia-unit { color: var(--c-red); }
.aia-market__grid p { margin: var(--space-3) 0 0; font-size: var(--fs-base); max-width: 26ch; }
.aia-gartner { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--space-4); margin-top: var(--space-6); }
.aia-gcard { position: relative; padding: clamp(22px, 3vw, 32px); border: 1px solid var(--c-line); border-radius: var(--radius-lg); background: var(--c-bg); box-shadow: var(--shadow-sm); }
.aia-gcard__head { display: flex; align-items: baseline; gap: 14px; flex-wrap: wrap; }
.aia-gcard .aia-big { font-size: clamp(2.75rem, 2rem + 2.6vw, 4rem); }
.aia-gcard h3 { font-size: var(--fs-xl); max-width: 24ch; }
.aia-gcard p { margin: var(--space-3) 0 0; }
.aia-meter { position: relative; height: 10px; margin-top: var(--space-4); border-radius: 999px; background: var(--c-surface-2); overflow: hidden; }
.aia-meter span { position: absolute; inset: 0 auto 0 0; border-radius: inherit; background: var(--aia-grad); transition: width 1.4s var(--ease) .2s; }
.aia-meter span.is-to { width: 40%; }
.aia-meter span.is-from { z-index: 1; width: 5%; background: #8f9aa5; }
html.aia-anim .aia-meter:not(.is-in) span.is-to { width: 5%; }
.aia-meter-legend { display: flex; justify-content: space-between; gap: 10px; margin-top: 8px; font-size: var(--fs-xs); color: var(--c-subtle); }
.aia-cancel { display: grid; grid-template-columns: repeat(10, 1fr); gap: 6px; margin-top: var(--space-4); }
.aia-cancel i { aspect-ratio: 1; border-radius: 4px; background: var(--c-surface-2); transition: background .4s var(--ease), transform .4s var(--ease); transition-delay: calc(var(--i) * 45ms); }
.aia-cancel i.x { background: var(--c-red); }
html.aia-anim .aia-cancel:not(.is-in) i.x { background: var(--c-surface-2); transform: scale(.7); }
.aia-cancel-reasons { display: flex; flex-wrap: wrap; gap: 6px; margin-top: var(--space-3); padding: 0; list-style: none; }
.aia-cancel-reasons li { padding: 3px 10px; border-radius: 999px; font-size: var(--fs-xs); background: var(--c-surface); color: var(--c-muted); border: 1px solid var(--c-line); }
.aia-cancel-reasons li.is-key { background: var(--c-red-tint); border-color: var(--c-red-soft); color: var(--c-red-dark); font-weight: 600; }

/* 3. Bureaucrat ------------------------------------------------------------ */
.aia-quote { margin: 0; }
.aia-quote blockquote { margin: 0; font: 500 clamp(1.6rem, 1.05rem + 2vw, 2.6rem)/1.22 var(--font-display); letter-spacing: -0.025em; color: var(--c-ink); text-wrap: balance; }
.aia-quote blockquote::before { content: "“"; display: block; height: .55em; margin-bottom: .1em; font-size: 2.2em; line-height: 1; color: var(--c-red); }
html[lang="fr"] .aia-quote blockquote::before { content: "«"; font-size: 1.6em; height: .7em; }
.aia-quote figcaption { margin-top: var(--space-4); font-size: var(--fs-sm); color: var(--c-subtle); }
.aia-quote figcaption strong { color: var(--c-ink); font-weight: 600; }
.aia-quote--small blockquote { font-size: clamp(1.15rem, 1rem + .6vw, 1.45rem); color: var(--c-text); }
.aia-quote--small blockquote::before { display: none; }
.aia-bureau__grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--space-6); }
@media (min-width: 900px) { .aia-bureau__grid { grid-template-columns: 7fr 5fr; gap: clamp(48px, 6vw, 96px); align-items: start; } }
.aia-bureaux { display: grid; gap: 10px; margin: 0; padding: 0; list-style: none; }
.aia-bureaux li { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 13px 16px; border: 1px solid var(--c-line); border-radius: 10px; background: var(--c-bg); transition: border-color .5s var(--ease), box-shadow .5s var(--ease); }
.aia-bureaux li > span:first-child { font-weight: 600; color: var(--c-ink); }
.aia-bureaux .aia-mono { font-size: 11.5px; padding: 3px 8px; border-radius: 6px; background: var(--c-red-tint); color: var(--c-red-dark); white-space: nowrap; }
html.aia-anim .aia-bureaux li { animation: aia-bureau 7.5s ease-in-out infinite; animation-delay: calc(var(--i) * 1.5s); }
@keyframes aia-bureau { 0%, 4% { border-color: var(--c-line); box-shadow: none; } 8%, 18% { border-color: var(--c-red-soft); box-shadow: 0 8px 26px rgba(200, 16, 46, .1); } 24%, 100% { border-color: var(--c-line); box-shadow: none; } }
.aia-bureau__note { margin-top: var(--space-4); font-size: var(--fs-sm); color: var(--c-muted); }
.aia-bureau .section-title.aia-h2-sm { margin-bottom: var(--space-3); }
.aia-bureau .aia-bureaux { margin-top: var(--space-4); }

/* 4. Rewrite trap ---------------------------------------------------------- */
.aia-trap { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--space-4); }
@media (min-width: 900px) { .aia-trap { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } }
.aia-trap__col { padding: clamp(20px, 3vw, 28px); border: 1px solid var(--c-line); border-radius: var(--radius-lg); background: var(--c-bg); }
.aia-trap__col h3 { display: flex; align-items: center; gap: 10px; font-size: var(--fs-lg); }
.aia-trap__col h3 .icon { width: 20px; height: 20px; color: var(--c-red); }
.aia-trap__col > p { margin: 8px 0 var(--space-4); font-size: var(--fs-sm); }
.aia-rules { display: grid; gap: 8px; margin: 0; padding: 0; list-style: none; }
.aia-rules li { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 4px 12px; align-items: baseline; padding: 10px 12px; border-radius: 8px; background: var(--c-surface); font-size: var(--fs-sm); color: var(--c-muted); }
.aia-rules .aia-mono { font-size: 12px; font-weight: 600; color: var(--c-ink); }
.aia-rules li.is-lost { position: relative; background: var(--c-red-tint); color: var(--c-red-dark); }
.aia-rules li.is-lost .aia-mono { color: var(--c-red-dark); text-decoration: line-through; text-decoration-thickness: 2px; }
.aia-rules li.is-lost::after { content: attr(data-lost); position: absolute; top: -9px; right: 10px; padding: 1px 8px; border-radius: 999px; font-size: 10.5px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; background: var(--c-red); color: #fff; }
html.aia-anim [data-aia-reveal]:not(.is-in) .aia-rules li.is-lost { background: var(--c-surface); color: var(--c-muted); }
html.aia-anim [data-aia-reveal]:not(.is-in) .aia-rules li.is-lost .aia-mono { text-decoration-color: transparent; color: var(--c-ink); }
html.aia-anim [data-aia-reveal]:not(.is-in) .aia-rules li.is-lost::after { opacity: 0; transform: translateY(4px); }
.aia-rules li.is-lost, .aia-rules li.is-lost .aia-mono, .aia-rules li.is-lost::after { transition: all .6s var(--ease) .9s; }
.aia-spec { display: grid; gap: 8px; margin: 0; padding: 0; list-style: none; }
.aia-spec li { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border-radius: 8px; border: 1px dashed var(--c-line-strong); font-size: var(--fs-sm); color: var(--c-ink); }
.aia-spec li::before { content: "✓"; font-weight: 700; color: var(--c-teal); }
.aia-spec li.is-missing { border-color: var(--c-red-soft); color: var(--c-red-dark); }
.aia-spec li.is-missing::before { content: "?"; color: var(--c-red); }

.aia-lost { margin-top: var(--space-5); padding: clamp(22px, 3vw, 34px); border-radius: var(--radius-lg); border: 1px solid var(--c-line); border-top: 3px solid var(--c-red); background: var(--c-bg); box-shadow: var(--shadow-lg); }
.aia-lost h3 { font-size: var(--fs-xl); max-width: 30ch; }
.aia-lost > p { margin: var(--space-3) 0 0; max-width: 70ch; }
.aia-lost__vs { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--space-4); margin-top: var(--space-5); }
@media (min-width: 760px) { .aia-lost__vs { grid-template-columns: minmax(0, 1fr) minmax(0, 1.5fr); } }
.aia-lost__vs > div { padding: 18px; border-radius: 10px; background: var(--c-surface); }
.aia-lost__vs h4 { margin: 0 0 4px; font: 600 var(--fs-base)/1.3 var(--font-sans); color: var(--c-ink); }
.aia-lost__vs p { margin: 0 0 12px; font-size: var(--fs-sm); }
.aia-dots { display: grid; grid-template-columns: repeat(24, 1fr); gap: 4px; }
.aia-dots--one { grid-template-columns: repeat(10, 1fr); }
.aia-dots i { aspect-ratio: 1; border-radius: 50%; background: #d3dae0; }
.aia-dots i.x { background: var(--c-red); }
.aia-dots i.ok { background: var(--c-teal); }
html.aia-anim .aia-dots i.x { transition: background .25s ease, transform .25s ease; transition-delay: calc(var(--i) * 14ms); }
html.aia-anim [data-aia-reveal]:not(.is-in) .aia-dots i.x { background: #d3dae0; transform: scale(.6); }

.aia-compare { margin-top: var(--space-6); border-top: 1px solid var(--c-line); }
.aia-compare__row { display: grid; grid-template-columns: minmax(0, 1fr); gap: 4px 24px; padding: 16px 0; border-bottom: 1px solid var(--c-line); }
@media (min-width: 760px) { .aia-compare__row { grid-template-columns: minmax(0, 1.1fr) minmax(0, 1.6fr); align-items: baseline; } }
.aia-compare__row > strong { font: 500 var(--fs-lg)/1.35 var(--font-display); color: var(--c-ink); }
.aia-compare__row > span { font-size: var(--fs-base); color: var(--c-muted); }
.aia-compare__row--us { position: relative; margin-top: -1px; padding-inline: 18px; border: 1px solid var(--c-red-soft); border-radius: 10px; background: var(--c-red-tint); }
.aia-compare__row--us > strong { color: var(--c-red-dark); }
.aia-compare__row--us > span { color: var(--c-ink); font-weight: 500; }
.aia-compare__head { display: none; }
@media (min-width: 760px) { .aia-compare__head { display: grid; padding: 10px 0; font-size: var(--fs-xs); font-weight: 600; letter-spacing: var(--tracking-caps); text-transform: uppercase; color: var(--c-subtle); } }

/* 5. Core diagram ---------------------------------------------------------- */
.aia-core { margin: 0; }
.aia-core__svg { display: block; width: 100%; height: auto; }
.aia-core__svg--v { display: none; max-width: 420px; margin-inline: auto; }
@media (max-width: 759px) { .aia-core__svg--h { display: none; } .aia-core__svg--v { display: block; } }
.aia-core .node { fill: rgba(255,255,255,.045); stroke: rgba(255,255,255,.16); stroke-width: 1.2; }
.aia-core .node--agent { stroke: rgba(255, 84, 112, .55); fill: rgba(255, 84, 112, .07); }
.aia-core .node--emp { stroke: rgba(113, 152, 239, .55); fill: rgba(113, 152, 239, .07); }
.aia-core .ofcs { fill: rgba(200, 16, 46, .1); stroke: var(--c-red); stroke-width: 1.6; }
.aia-core .chip { fill: rgba(255,255,255,.05); stroke: rgba(255,255,255,.14); }
.aia-core .db { fill: rgba(255,255,255,.06); stroke: rgba(255,255,255,.28); stroke-width: 1.3; }
.aia-core .t-strong { fill: var(--c-on-dark); font-weight: 600; }
.aia-core .t-muted { fill: #9eabb8; }
.aia-core .t-red { fill: #ff6d83; font-weight: 600; }
.aia-core .t-ok { fill: var(--aia-ok); font-weight: 700; }
.aia-core .edge { fill: none; stroke: rgba(255,255,255,.28); stroke-width: 2; }
.aia-core .edge--sup { stroke-dasharray: 4 6; stroke: rgba(255,255,255,.35); }
.aia-core .ah { fill: rgba(255,255,255,.5); }
.aia-core .ret { fill: none; stroke: var(--aia-agent); stroke-width: 2; stroke-dasharray: 5 6; }
.aia-core .bubble { fill: rgba(255, 84, 112, .12); stroke: rgba(255, 84, 112, .6); }
.aia-core .pill-ok rect { fill: rgba(60, 207, 158, .14); stroke: rgba(60, 207, 158, .6); }
.aia-core .pill-no rect { fill: rgba(255, 84, 112, .14); stroke: rgba(255, 84, 112, .7); }
.aia-core .pk { fill: none; stroke-width: 7; stroke-linecap: round; stroke-dasharray: .001 2; stroke-dashoffset: 0; opacity: 0; }
.aia-core .pk--emp { stroke: var(--aia-blue); filter: drop-shadow(0 0 6px rgba(113,152,239,.9)); }
.aia-core .pk--ok { stroke: var(--aia-ok); filter: drop-shadow(0 0 6px rgba(60,207,158,.9)); }
.aia-core .pk--agent { stroke: var(--aia-agent); filter: drop-shadow(0 0 6px rgba(255,84,112,.9)); }
.aia-core .rule-hit { fill: transparent; transition: fill .3s ease; }
/* Sequence (js: data-aia-steps): s1 employee request, s2 rules pass, s3 saved,
   s4 agent request, s5 refused, s6 the form's message goes back to the agent. */
.aia-core .seq-ok, .aia-core .seq-no, .aia-core .seq-msg, .aia-core .seq-saved { transition: opacity .45s var(--ease); }
.aia-core.is-playing .seq-ok, .aia-core.is-playing .seq-no, .aia-core.is-playing .seq-msg, .aia-core.is-playing .seq-saved { opacity: 0; }
.aia-core.is-playing.s2:not(.s4) .seq-ok { opacity: 1; }
.aia-core.is-playing.s3 .seq-saved { opacity: 1; }
.aia-core.is-playing.s5 .seq-no { opacity: 1; }
.aia-core.is-playing.s6 .seq-msg { opacity: 1; }
.aia-core.is-playing.s1:not(.s2) .pk--emp { animation: aia-pk 1.25s cubic-bezier(.45,0,.3,1) forwards; }
.aia-core.is-playing.s3:not(.s4) .pk--ok { animation: aia-pk .9s cubic-bezier(.45,0,.3,1) forwards; }
.aia-core.is-playing.s4:not(.s5) .pk--agent { animation: aia-pk 1.25s cubic-bezier(.45,0,.3,1) forwards; }
.aia-core.is-playing.s6 .pk--back { animation: aia-pk 1.1s cubic-bezier(.45,0,.3,1) forwards; }
@keyframes aia-pk { 0% { stroke-dashoffset: 0; opacity: 0; } 8% { opacity: 1; } 92% { opacity: 1; } 100% { stroke-dashoffset: -1; opacity: 0; } }
.aia-core.is-playing.s2:not(.s4) .rule-hit { fill: rgba(60, 207, 158, .16); }
.aia-core.is-playing.s5 .rule-hit--v { fill: rgba(255, 84, 112, .2); }
.aia-core .ofcs-box { transition: filter .4s ease; }
.aia-core.is-playing.s5 .ofcs-box { filter: drop-shadow(0 0 18px rgba(255, 84, 112, .55)); }
.aia-core.is-playing.s2:not(.s4) .ofcs-box { filter: drop-shadow(0 0 18px rgba(60, 207, 158, .45)); }

.aia-core__steps { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; margin: var(--space-5) 0 0; padding: 0; list-style: none; counter-reset: s; }
.aia-core__steps li { position: relative; padding: 14px 14px 14px 46px; border: 1px solid var(--aia-dline); border-radius: 10px; background: var(--aia-dcard); font-size: var(--fs-sm); line-height: 1.5; color: #aab6c2; transition: border-color .35s ease, background .35s ease, color .35s ease; }
.aia-core__steps li::before { counter-increment: s; content: counter(s); position: absolute; left: 14px; top: 13px; display: grid; place-items: center; width: 22px; height: 22px; border-radius: 50%; font-size: 11px; font-weight: 700; background: rgba(255,255,255,.08); color: var(--c-on-dark); }
.aia-core__steps li strong { color: var(--c-on-dark); font-weight: 600; }
.aia-core.is-playing.s1:not(.s3) .aia-core__steps li:nth-child(1),
.aia-core.is-playing.s2:not(.s4) .aia-core__steps li:nth-child(2),
.aia-core.is-playing.s4:not(.s5) .aia-core__steps li:nth-child(3),
.aia-core.is-playing.s5 .aia-core__steps li:nth-child(4) { border-color: rgba(255,255,255,.35); background: rgba(255,255,255,.07); color: #d0d8e0; }
.aia-core.is-playing.s5 .aia-core__steps li:nth-child(4) { border-color: rgba(255, 84, 112, .6); }
.aia-core.is-playing.s2:not(.s4) .aia-core__steps li:nth-child(2) { border-color: rgba(60, 207, 158, .6); }
.aia-core__caption { display: flex; align-items: center; justify-content: center; gap: 10px; margin: var(--space-5) auto 0; padding: 12px 20px; max-width: max-content; border: 1px solid rgba(255, 84, 112, .45); border-radius: 999px; background: rgba(255, 84, 112, .08); font-weight: 600; color: var(--c-on-dark); text-align: center; }
.aia-core__caption .icon { flex: none; width: 18px; height: 18px; color: var(--aia-agent); }
.aia-core__notes { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-4); margin: var(--space-6) 0 0; padding: var(--space-5) 0 0; list-style: none; border-top: 1px solid var(--aia-dline); }
.aia-core__notes h3 { font-size: var(--fs-lg); margin-bottom: 6px; }
.aia-core__notes p { margin: 0; font-size: var(--fs-sm); }
.aia-core__notes .icon { width: 22px; height: 22px; margin-bottom: 10px; color: var(--aia-pink); }
@media (max-width: 899px) { .aia-core__steps { grid-template-columns: repeat(2, minmax(0, 1fr)); } .aia-core__notes { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 480px) { .aia-core__steps { grid-template-columns: minmax(0, 1fr); } .aia-core__caption { border-radius: 14px; } }

/* 6. OFCS by the numbers --------------------------------------------------- */
.aia-nums { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0; margin: 0; padding: 0; list-style: none; border-top: 1px solid var(--c-line); }
.aia-nums li { padding: var(--space-5) var(--space-4) var(--space-3) 0; }
.aia-nums li + li { padding-left: var(--space-4); border-left: 1px solid var(--c-line); }
.aia-nums .aia-big { font-size: clamp(3rem, 2rem + 3.6vw, 5rem); }
.aia-nums .aia-big .aia-unit { font-size: .7em; }
.aia-nums h3 { margin-top: var(--space-3); font-size: var(--fs-base); font-family: var(--font-sans); font-weight: 600; }
.aia-nums p { margin: 6px 0 0; font-size: var(--fs-sm); }
.aia-proof { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--space-4); margin-top: var(--space-6); }
@media (min-width: 900px) { .aia-proof { grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); align-items: stretch; } }
.aia-proof__tests { padding: clamp(22px, 3vw, 32px); border-radius: var(--radius-lg); background: var(--aia-night); color: var(--c-on-dark); position: relative; overflow: hidden; isolation: isolate; }
.aia-proof__tests::before { content: ""; position: absolute; inset: auto -20% -60% 30%; height: 120%; z-index: -1; background: radial-gradient(ellipse at center, rgba(165,129,238,.28), transparent 65%); }
.aia-proof__tests h3 { color: var(--c-on-dark); font-size: var(--fs-xl); }
.aia-proof__tests > p { color: var(--c-on-dark-muted); font-size: var(--fs-sm); margin: 8px 0 0; }
.aia-tests { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin: var(--space-4) 0 0; padding: 0; list-style: none; }
.aia-tests li { padding: 14px; border-radius: 10px; background: rgba(255,255,255,.05); border: 1px solid var(--aia-dline); }
.aia-tests .aia-mid { display: block; font: 500 clamp(1.7rem, 1.3rem + 1.4vw, 2.3rem)/1 var(--font-display); letter-spacing: -0.03em; color: var(--c-on-dark); font-variant-numeric: tabular-nums; }
.aia-tests span + span { display: block; margin-top: 6px; font-size: var(--fs-xs); line-height: 1.45; color: #a9b5c0; }
.aia-proof__list { display: grid; gap: 10px; margin: 0; padding: 0; list-style: none; }
.aia-proof__list li { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 14px; padding: 16px 18px; border: 1px solid var(--c-line); border-radius: 10px; background: var(--c-bg); font-size: var(--fs-sm); color: var(--c-muted); }
.aia-proof__list .icon { width: 20px; height: 20px; color: var(--c-red); margin-top: 2px; }
.aia-proof__list strong { display: block; color: var(--c-ink); font-weight: 600; font-size: var(--fs-base); margin-bottom: 2px; }
.aia-twice { display: flex; align-items: center; gap: 8px; margin-top: 14px; flex-wrap: wrap; font-size: var(--fs-xs); }
.aia-twice span { padding: 5px 10px; border-radius: 999px; border: 1px solid rgba(255,255,255,.18); color: #cfd7df; }
.aia-twice span.ok { border-color: rgba(60,207,158,.55); color: var(--aia-ok); }
.aia-twice b { color: #6d7a88; font-weight: 400; }

/* 7. Same migration, two more products ------------------------------------- */
.aia-same { margin: 0; }
.aia-same svg { display: block; width: 100%; height: auto; }
.aia-same svg.aia-same__v { display: none; max-width: 420px; margin-inline: auto; }
@media (max-width: 759px) { .aia-same svg.aia-same__h { display: none; } .aia-same svg.aia-same__v { display: block; } }
.aia-same .box { fill: #fff; stroke: #b9c3cb; stroke-width: 1.4; }
.aia-same .box--grey { fill: var(--c-surface-2); stroke: none; }
.aia-same .box--app { fill: #fff; stroke: var(--c-red); stroke-width: 2.4; filter: drop-shadow(0 10px 24px rgba(200,16,46,.12)); }
.aia-same .box--agent { fill: #fff; stroke: var(--c-red); stroke-width: 1.8; stroke-dasharray: 7 5; }
.aia-same .t-title { fill: var(--c-ink); font-weight: 600; }
.aia-same .t-sub { fill: var(--c-muted); }
.aia-same .t-label { fill: var(--c-red); font-weight: 700; letter-spacing: .12em; }
.aia-same .t-red { fill: var(--c-red); font-weight: 600; }
.aia-same .ln { fill: none; stroke: var(--c-ink); stroke-width: 1.8; }
.aia-same .ln--red { stroke: var(--c-red); stroke-width: 2.2; }
.aia-same .ah { fill: var(--c-ink); }
.aia-same .ah--red { fill: var(--c-red); }
.aia-same .rule { stroke: var(--c-red); stroke-width: 2; }
.aia-same .g { transition: opacity .6s var(--ease), transform .6s var(--ease); transition-delay: var(--d, 0s); transform-box: fill-box; transform-origin: center; }
.aia-same .ln { stroke-dasharray: 1; stroke-dashoffset: 0; transition: stroke-dashoffset .7s var(--ease); transition-delay: var(--d, 0s); }
.aia-same .ah { transition: opacity .3s ease; transition-delay: calc(var(--d, 0s) + .6s); }
html.aia-anim .aia-same:not(.is-in) .g { opacity: 0; transform: translateY(10px); }
html.aia-anim .aia-same:not(.is-in) .ln { stroke-dashoffset: 1; }
html.aia-anim .aia-same:not(.is-in) .ah { opacity: 0; }
.aia-same .flow-dash--red { stroke-width: 2.2; }
.aia-same__legend { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-4); margin-top: var(--space-5); }
.aia-same__legend > div { padding: 18px 20px; border-radius: 10px; border: 1px solid var(--c-line); background: var(--c-bg); }
.aia-same__legend b { display: inline-grid; place-items: center; width: 24px; height: 24px; margin-right: 8px; border-radius: 50%; background: var(--c-red); color: #fff; font-size: 12px; }
.aia-same__legend h3 { display: flex; align-items: center; font-size: var(--fs-lg); }
.aia-same__legend p { margin: 8px 0 0; font-size: var(--fs-sm); }
@media (max-width: 759px) { .aia-same__legend { grid-template-columns: minmax(0, 1fr); } }

/* 8. The offer: two tiers -------------------------------------------------- */
.aia-tiers { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--space-4); margin: 0; padding: 0; list-style: none; }
@media (min-width: 900px) { .aia-tiers { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } }
.aia-tier { position: relative; display: flex; flex-direction: column; padding: clamp(24px, 3vw, 36px); border: 1px solid var(--c-line); border-radius: 14px; background: var(--c-bg); box-shadow: var(--shadow-lg); overflow: hidden; }
.aia-tier::before { content: ""; position: absolute; inset: 0 0 auto; height: 4px; background: var(--aia-grad); }
.aia-tier--2::before { background: linear-gradient(90deg, var(--c-red), var(--aia-agent), var(--c-agent-2, #ff9a6b)); }
.aia-tier__n { display: inline-flex; align-items: center; gap: 10px; font-size: var(--fs-xs); font-weight: 700; letter-spacing: var(--tracking-caps); text-transform: uppercase; color: var(--c-subtle); }
.aia-tier__n b { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 50%; background: var(--c-ink); color: #fff; font-size: 13px; letter-spacing: 0; }
.aia-tier h3 { margin-top: var(--space-3); font-size: var(--fs-2xl); letter-spacing: -0.025em; }
.aia-tier > p { margin: var(--space-3) 0 0; }
.aia-tier dl { display: grid; gap: 0; margin: var(--space-4) 0 0; border-top: 1px solid var(--c-line); }
.aia-tier dl > div { display: grid; grid-template-columns: minmax(0, 1fr); gap: 4px; padding: 14px 0; border-bottom: 1px solid var(--c-line); }
@media (min-width: 560px) { .aia-tier dl > div { grid-template-columns: 9.5em minmax(0, 1fr); gap: 16px; } }
.aia-tier dt { font-size: var(--fs-xs); font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--c-subtle); padding-top: 2px; }
.aia-tier dd { margin: 0; font-size: var(--fs-sm); color: var(--c-text); }
.aia-pills { display: flex; flex-wrap: wrap; gap: 6px; margin: var(--space-4) 0 0; padding: 0; list-style: none; }
.aia-pills li { padding: 4px 11px; border-radius: 999px; font-size: var(--fs-xs); font-weight: 600; background: var(--c-surface); border: 1px solid var(--c-line); color: var(--c-ink); }

/* 9. Three ways to run a process ------------------------------------------- */
.aia-ways { position: relative; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-3); margin: 0; padding: 0; list-style: none; }
.aia-way { display: flex; flex-direction: column; padding: 24px 22px; border: 1px solid var(--c-line); border-radius: 12px 12px 4px 4px; background: var(--c-bg); }
.aia-way__icon { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 12px; background: var(--c-surface); color: var(--c-ink); }
.aia-way__icon .icon { width: 22px; height: 22px; }
.aia-way--agent .aia-way__icon { background: rgba(255, 84, 112, .1); color: #d6334f; }
.aia-way--agent { border-color: rgba(255, 84, 112, .45); box-shadow: 0 14px 40px rgba(255, 84, 112, .1); }
.aia-way h3 { margin-top: var(--space-3); font-size: var(--fs-xl); }
.aia-way h4 { margin: var(--space-4) 0 4px; font: 700 var(--fs-xs)/1.3 var(--font-sans); letter-spacing: .08em; text-transform: uppercase; color: var(--c-subtle); }
.aia-way p { margin: 0; font-size: var(--fs-sm); }
.aia-foundation { display: flex; align-items: center; justify-content: center; gap: 12px; margin-top: 10px; padding: 14px 20px; border-radius: 4px 4px 12px 12px; background: var(--c-ink); color: #fff; font-weight: 600; text-align: center; font-size: var(--fs-sm); position: relative; overflow: hidden; }
.aia-foundation::before { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, transparent, rgba(255,255,255,.14), transparent); transform: translateX(-100%); }
html.aia-anim .aia-foundation::before { animation: aia-sheen 4s ease-in-out infinite; }
@keyframes aia-sheen { 60%, 100% { transform: translateX(100%); } }
.aia-foundation .aia-mono { padding: 2px 8px; border-radius: 6px; background: var(--c-red); font-size: 12px; }
.aia-foundation-note { margin: var(--space-4) auto 0; max-width: 62ch; text-align: center; font-size: var(--fs-base); }
@media (max-width: 759px) { .aia-ways { grid-template-columns: minmax(0, 1fr); } .aia-way { border-radius: 12px; } }

/* 10. Worked example ------------------------------------------------------- */
.aia-ex { display: grid; grid-template-columns: minmax(0, 1fr); grid-template-areas: "head" "panel" "body"; gap: var(--space-5); align-items: start; }
.aia-ex__head { grid-area: head; }
.aia-ex__body { grid-area: body; }
.aia-ex .aia-stmt { grid-area: panel; }
.aia-ex__body .aia-ex__steps { margin-top: 0; }
@media (min-width: 980px) {
	.aia-ex { grid-template-columns: minmax(0, .9fr) minmax(0, 1.25fr); grid-template-areas: "head panel" "body panel"; column-gap: clamp(40px, 5vw, 72px); row-gap: var(--space-4); }
	.aia-ex .aia-stmt { align-self: center; }
}
.aia-ex__steps { display: grid; gap: 10px; margin: var(--space-5) 0 0; padding: 0; list-style: none; counter-reset: e; }
.aia-ex__steps li { position: relative; padding: 14px 16px 14px 54px; border: 1px solid var(--aia-dline); border-radius: 12px; background: var(--aia-dcard); transition: border-color .35s ease, background .35s ease; }
.aia-ex__steps li::before { counter-increment: e; content: counter(e, decimal-leading-zero); position: absolute; left: 16px; top: 15px; font: 600 12px/1 var(--font-mono); color: #8794a3; }
.aia-ex__steps strong { display: block; color: var(--c-on-dark); font-weight: 600; }
.aia-ex__steps span { display: block; margin-top: 2px; font-size: var(--fs-sm); color: #a6b2be; }
.aia-ex.is-playing.s1:not(.s2) .aia-ex__steps li:nth-child(1),
.aia-ex.is-playing.s2:not(.s3) .aia-ex__steps li:nth-child(2),
.aia-ex.is-playing.s3:not(.s4) .aia-ex__steps li:nth-child(3),
.aia-ex.is-playing.s4 .aia-ex__steps li:nth-child(4) { border-color: rgba(237, 128, 174, .6); background: rgba(237, 128, 174, .08); }
.aia-ex.is-playing.s1:not(.s2) .aia-ex__steps li:nth-child(1)::before,
.aia-ex.is-playing.s2:not(.s3) .aia-ex__steps li:nth-child(2)::before,
.aia-ex.is-playing.s3:not(.s4) .aia-ex__steps li:nth-child(3)::before,
.aia-ex.is-playing.s4 .aia-ex__steps li:nth-child(4)::before { color: var(--aia-pink); }
.aia-stmt { border-radius: 14px; background: #f9fafb; color: var(--c-text); box-shadow: 0 30px 80px rgba(0,0,0,.4); overflow: hidden; }
.aia-stmt__bar { display: flex; align-items: center; gap: 8px; padding: 12px 16px; background: #eef1f3; border-bottom: 1px solid var(--c-line); }
.aia-stmt__bar i { width: 10px; height: 10px; border-radius: 50%; background: #d3d9de; }
.aia-stmt__bar span { margin-left: 8px; font-size: var(--fs-sm); font-weight: 600; color: var(--c-ink); }
.aia-stmt__bar em { margin-left: auto; font-style: normal; }
.aia-stmt__rows { margin: 0; padding: 6px 0; list-style: none; }
.aia-stmt__rows li { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 4px 14px; align-items: center; padding: 11px 16px; border-bottom: 1px solid #eceff2; font-size: var(--fs-sm); }
.aia-stmt__rows li:last-child { border-bottom: 0; }
.aia-stmt__desc { color: var(--c-ink); font-weight: 500; }
.aia-stmt__amt { font-family: var(--font-mono); font-size: 12.5px; color: var(--c-ink); text-align: right; }
.aia-stmt__st { grid-column: 1 / -1; display: flex; flex-wrap: wrap; gap: 6px; align-items: center; min-height: 24px; }
.aia-b { display: inline-flex; align-items: center; gap: 5px; padding: 2px 9px; border-radius: 999px; font-size: 11.5px; font-weight: 600; line-height: 1.6; transition: opacity .35s ease, transform .35s ease; }
.aia-b--rule { background: rgba(38, 115, 101, .1); color: var(--c-teal); }
.aia-b--agent { background: rgba(255, 84, 112, .1); color: #c42a46; }
.aia-b--why { background: transparent; color: var(--c-subtle); font-weight: 400; padding-left: 2px; }
.aia-b--ok { background: rgba(23, 35, 50, .08); color: var(--c-ink); }
.aia-b--post { background: rgba(60, 207, 158, .16); color: var(--aia-ok-ink); }
.aia-b--no { background: var(--c-red); color: #fff; }
/* Without JS (or reduced motion): the final state, every badge shown.
   While playing, a badge shows from its step on (data-s="n" needs .sn). */
.aia-ex.is-playing .aia-b[data-s] { display: none; }
.aia-ex.is-playing.s1 .aia-b[data-s="1"], .aia-ex.is-playing.s2 .aia-b[data-s="2"], .aia-ex.is-playing.s3 .aia-b[data-s="3"], .aia-ex.is-playing.s4 .aia-b[data-s="4"] { display: inline-flex; animation: aia-pop .35s var(--ease); }
.aia-ex.is-playing.s4 .aia-b[data-s="2"].until4, .aia-ex.is-playing.s3 .aia-b[data-s="2"].until3 { display: none; }
@keyframes aia-pop { from { opacity: 0; transform: translateY(4px) scale(.96); } }
.aia-stmt__foot { display: flex; flex-wrap: wrap; gap: 8px 16px; justify-content: space-between; padding: 12px 16px; background: #fff; border-top: 1px solid var(--c-line); font-size: var(--fs-xs); color: var(--c-subtle); }
.aia-stmt__foot strong { color: var(--c-ink); }
.aia-ex.is-playing:not(.s4) .aia-stmt__total { visibility: hidden; }

/* 11. Safe by construction ------------------------------------------------- */
.aia-safe { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: var(--space-3); margin: 0; padding: 0; list-style: none; }
.aia-safe > li { grid-column: span 2; display: flex; flex-direction: column; padding: 24px; border: 1px solid var(--c-line); border-radius: 12px; background: var(--c-bg); }
.aia-safe > li.is-wide { grid-column: span 3; }
.aia-safe .icon { width: 22px; height: 22px; color: var(--c-red); }
.aia-safe h3 { margin-top: 14px; font-size: var(--fs-lg); }
.aia-safe p { margin: 8px 0 0; font-size: var(--fs-sm); }
.aia-trust { position: relative; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin: var(--space-4) 0 4px; padding: 0; list-style: none; }
.aia-trust::before { content: ""; position: absolute; left: 16.66%; right: 16.66%; top: 13px; height: 2px; background: var(--c-line); }
.aia-trust::after { content: ""; position: absolute; left: 16.66%; top: 13px; height: 2px; width: 66.66%; background: var(--aia-grad); transform-origin: left; transition: transform 1.6s var(--ease) .3s; }
html.aia-anim .aia-trust:not(.is-in)::after { transform: scaleX(0); }
.aia-trust li { position: relative; display: flex; flex-direction: column; align-items: center; gap: 8px; text-align: center; font-size: var(--fs-xs); line-height: 1.4; color: var(--c-muted); }
.aia-trust li b { position: relative; z-index: 1; display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; background: #fff; border: 2px solid var(--aia-violet); color: var(--c-ink); font-size: 12px; }
.aia-trust li:last-child b { border-color: var(--aia-blue); }
.aia-trust li:first-child b { border-color: var(--aia-pink); }
@media (max-width: 899px) { .aia-safe > li, .aia-safe > li.is-wide { grid-column: span 3; } }
@media (max-width: 600px) { .aia-safe { grid-template-columns: minmax(0, 1fr); } .aia-safe > li, .aia-safe > li.is-wide { grid-column: auto; } }

/* 12. Gartner context layer ----------------------------------------------- */
.aia-ctx { margin: 0; padding: 0; list-style: none; border-top: 1px solid var(--c-line); }
.aia-ctx li { display: grid; grid-template-columns: minmax(0, .7fr) minmax(0, 1fr) minmax(0, 1.6fr); gap: 8px 28px; padding: 20px 0; border-bottom: 1px solid var(--c-line); align-items: baseline; }
.aia-ctx__head { padding: 10px 0 !important; font-size: var(--fs-xs); font-weight: 700; letter-spacing: var(--tracking-caps); text-transform: uppercase; color: var(--c-subtle); }
.aia-ctx strong { font: 500 var(--fs-xl)/1.2 var(--font-display); color: var(--c-ink); }
.aia-ctx span { font-size: var(--fs-sm); color: var(--c-subtle); }
.aia-ctx p { margin: 0; font-size: var(--fs-base); color: var(--c-text); }
.aia-ctx li:not(.aia-ctx__head) strong::before { content: ""; display: inline-block; width: 10px; height: 10px; margin-right: 12px; border-radius: 3px; background: var(--aia-pink); vertical-align: 2px; }
.aia-ctx li:nth-child(3) strong::before { background: var(--aia-violet); }
.aia-ctx li:nth-child(4) strong::before { background: var(--aia-blue); }
@media (max-width: 759px) { .aia-ctx li { grid-template-columns: minmax(0, 1fr); } .aia-ctx__head { display: none !important; } .aia-ctx span::before { content: attr(data-l) " "; font-weight: 600; } }
.aia-ctx-quote { margin-top: var(--space-5); padding: 20px 24px; border-left: 3px solid var(--c-red); background: var(--c-surface); border-radius: 0 10px 10px 0; }
.aia-ctx-quote p { margin: 0; font-size: var(--fs-base); color: var(--c-text); }

/* 13. First step: 7-step timeline ----------------------------------------- */
.aia-tl { position: relative; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 40px 22px; margin: 0; padding: 0; list-style: none; counter-reset: t; }
.aia-tl li { position: relative; padding-top: 46px; }
.aia-tl li::before { counter-increment: t; content: counter(t, decimal-leading-zero); position: absolute; top: 0; left: 0; z-index: 1; display: grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; background: #fff; border: 2px solid var(--c-red); font: 700 12px/1 var(--font-mono); color: var(--c-red); transition: background .4s ease, color .4s ease; transition-delay: calc(var(--i) * .18s + .2s); }
.aia-tl.is-in li::before, html:not(.aia-anim) .aia-tl li::before { background: var(--c-red); color: #fff; }
.aia-tl li::after { content: ""; position: absolute; z-index: 0; top: 16px; left: 40px; right: -16px; height: 2px; background: var(--c-line); }
.aia-tl li:nth-child(4)::after, .aia-tl li:last-child::after { display: none; }
.aia-tl li > i { position: absolute; top: 16px; left: 40px; right: -16px; height: 2px; background: var(--c-red); transform-origin: left; transition: transform .5s var(--ease); transition-delay: calc(var(--i, 0) * .18s + .3s); z-index: 1; }
.aia-tl li:nth-child(4) > i, .aia-tl li:last-child > i { display: none; }
html.aia-anim .aia-tl:not(.is-in) li > i { transform: scaleX(0); }
.aia-tl h3 { font-size: var(--fs-lg); line-height: 1.3; }
.aia-tl p { margin: 6px 0 0; font-size: var(--fs-sm); }
.aia-tl li.is-key h3 { color: var(--c-red-dark); }
@media (max-width: 899px) {
	.aia-tl { grid-template-columns: minmax(0, 1fr); gap: 0; }
	.aia-tl li { padding: 0 0 26px 54px; }
	.aia-tl li::after, .aia-tl li > i { top: 36px; bottom: 0; left: 16px; right: auto; width: 2px; height: auto; }
	.aia-tl li:nth-child(4)::after, .aia-tl li:nth-child(4) > i { display: block; }
	.aia-tl li > i { transform-origin: top; }
	html.aia-anim .aia-tl:not(.is-in) li > i { transform: scaleY(0); }
	.aia-tl h3 { padding-top: 6px; }
}

/* 14. FAQ: site .faq component; only the width. */
.aia-faq .faq { max-width: 860px; }

/* 15. Closing: white paper cover + form ------------------------------------ */
.aia-cta__grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: clamp(32px, 5vw, 64px); align-items: center; }
@media (min-width: 980px) { .aia-cta__grid { grid-template-columns: minmax(0, .95fr) minmax(0, 1fr); } }
.aia-cta { overflow: clip; }
.aia-book { position: relative; width: min(100%, 440px); margin: 0 auto; aspect-ratio: 540 / 720; perspective: 1400px; }
@media (max-width: 979px) { .aia-book { width: min(70%, 340px); margin: 0 auto 0 4%; } }
.aia-book img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; border-radius: 4px 10px 10px 4px; }
.aia-book__back { transform: translate(14%, 4%) rotate(5deg) scale(.92); box-shadow: 0 20px 50px rgba(23,35,50,.18); filter: saturate(.9); }
.aia-book__front { transform: rotateY(-14deg) rotateX(3deg); transform-origin: left center; box-shadow: -2px 0 0 rgba(255,255,255,.4) inset, 24px 30px 60px rgba(13,21,32,.35); transition: transform .9s var(--ease); }
html.aia-anim .aia-book:not(.is-in) .aia-book__front { transform: rotateY(-32deg) rotateX(6deg) translateY(10px); }
.aia-book__spine { position: absolute; inset: 0 auto 0 0; width: 14px; border-radius: 4px 0 0 4px; background: linear-gradient(90deg, rgba(0,0,0,.35), rgba(255,255,255,.08) 60%, transparent); transform: rotateY(-14deg) rotateX(3deg); transform-origin: left center; pointer-events: none; }
.aia-cta__text .section-title { max-width: 18ch; }
.aia-cta__list { margin: var(--space-4) 0 0; padding: 0; list-style: none; display: grid; gap: 8px; }
.aia-cta__list li { display: flex; gap: 10px; font-size: var(--fs-base); color: var(--c-text); }
.aia-cta__list li::before { content: "✓"; color: var(--c-teal); font-weight: 700; }
.aia-cta .form-panel { margin-top: var(--space-5); }
.aia-cta__alt { margin: var(--space-4) 0 0; font-size: var(--fs-sm); color: var(--c-muted); }

/* Native lead form (LeadForge mechanism), styled like the site's x-form. */
.aia-lead__title { margin: 0; font-size: var(--fs-xl); letter-spacing: var(--tracking-title); line-height: 1.2; }
.aia-lead__intro { margin: 6px 0 var(--space-4); font-size: var(--fs-sm); color: var(--c-muted); }
.aia-lead__row { display: grid; grid-template-columns: minmax(0, 1fr); column-gap: 16px; }
@media (min-width: 560px) { .aia-lead__row { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.aia-lead__group { margin-bottom: var(--space-3); min-width: 0; }
.aia-lead label { display: block; margin-bottom: 5px; font-size: var(--fs-xs); font-weight: 500; color: #4b5d6b; }
.aia-lead label .req { margin-left: 2px; color: var(--c-red); }
.aia-lead input[type="text"], .aia-lead input[type="email"] { display: block; width: 100%; min-height: 42px; padding: 11px 12px; border: 1px solid #d7dfe3; border-radius: 5px; background: #fff; font: 400 var(--fs-sm)/1.4 var(--font-sans); color: var(--c-ink); transition: border-color .15s, box-shadow .15s; }
.aia-lead input:focus { outline: 0; border-color: var(--c-teal); box-shadow: 0 0 0 3px var(--c-focus); }
#wp-form .g-recaptcha { display: inline-block; vertical-align: top; min-width: 304px; min-height: 78px; margin: 4px 0 0; }
.aia-lead__status { min-height: 1.4em; margin: 6px 0 10px; font-size: var(--fs-xs); font-weight: 600; color: var(--c-red); }
.aia-lead .form-submit { display: inline-flex; align-items: center; justify-content: center; gap: 18px; width: 100%; min-height: 45px; padding: 13px 20px; border: 0; border-radius: var(--radius); background: var(--c-red); color: #fff; font: 600 var(--fs-sm)/1.2 var(--font-sans); cursor: pointer; }
.aia-lead .form-submit::after { content: "→"; font-size: 1.25em; line-height: 1; }
.aia-lead .form-submit:hover { background: var(--c-red-dark); }
.aia-lead .form-submit.is-limited { background: #8a96a0; cursor: not-allowed; }
.aia-lead .form-submit.is-limited::after { content: none; }
.aia-lead__privacy { margin: 10px 0 0; font-size: var(--fs-xs); color: var(--c-muted); }
.aia-lead__privacy a { color: inherit; text-decoration: underline; }
@media (max-width: 420px) { .aia-cta .form-panel.aia-lead { padding: 20px 14px; } }

/* Inline thank-you (pattern of /a/oracle-ai-world/): the native POST goes to a hidden iframe;
   once it lands on same-origin /a/thank-you/, the form panel gives way to this dark panel. */
.aia-cta .aia-sink { display: none; }
.aia-cta .aia-done { position: relative; margin-top: var(--space-5); padding: clamp(26px, 3.4vw, 40px); border: 1px solid rgba(255,255,255,.1); border-top: 3px solid var(--c-red); border-radius: 10px; overflow: hidden; color: var(--c-on-dark);
	background: radial-gradient(120% 120% at 100% 0%, rgba(165,129,238,.28), transparent 55%), radial-gradient(90% 110% at 0% 100%, rgba(237,128,174,.16), transparent 60%), var(--aia-night);
	box-shadow: 0 24px 60px rgba(13,21,32,.28); }
.aia-cta .aia-done[hidden] { display: none; }
.aia-cta .aia-done:focus { outline: none; }
.aia-cta .aia-done:focus-visible { outline: 2px solid var(--aia-blue); outline-offset: 3px; }
.aia-cta .aia-done__icon { display: grid; place-items: center; width: 52px; height: 52px; margin-bottom: 18px; border-radius: 50%; background: rgba(60,207,158,.14); color: var(--aia-ok); box-shadow: 0 0 0 6px rgba(60,207,158,.06); }
.aia-cta .aia-done--warn .aia-done__icon { background: rgba(255,84,112,.14); color: var(--aia-agent); box-shadow: 0 0 0 6px rgba(255,84,112,.06); }
.aia-cta .aia-done__title { margin: 0; font-size: var(--fs-2xl); line-height: 1.15; letter-spacing: var(--tracking-title); color: var(--c-on-dark); overflow-wrap: anywhere; }
.aia-cta .aia-done__ready { margin: 8px 0 0; font-size: var(--fs-lg); font-weight: 600; line-height: 1.3; background: var(--aia-grad); -webkit-background-clip: text; background-clip: text; color: transparent; }
.aia-cta .aia-done__meta { margin: 6px 0 0; font-size: var(--fs-sm); color: var(--c-on-dark-muted); }
.aia-cta .aia-done__dl { margin-top: var(--space-5); width: 100%; justify-content: center; }
.aia-cta .aia-done__dl::after { content: "↓"; }
.aia-cta .aia-done__note { margin: var(--space-4) 0 0; font-size: var(--fs-sm); line-height: 1.55; color: #b9c4cf; }
.aia-cta .aia-done a.u { color: var(--c-on-dark); text-decoration: underline; text-underline-offset: 2px; }
.aia-cta .aia-done a[href^="tel:"] { white-space: nowrap; }
.aia-cta .aia-done--warn .aia-done__title { font-size: clamp(1.5rem, 1.2rem + 1vw, 2rem); }
.aia-cta .aia-done__retry { margin-top: var(--space-5); background: rgba(255,255,255,.04); border-color: rgba(255,255,255,.22); color: var(--c-on-dark); }
.aia-cta .aia-done__retry:hover { border-color: rgba(255,255,255,.45); }
.aia-cta .aia-lead .form-submit.is-sending { opacity: .65; cursor: wait; }
@media (max-width: 420px) { .aia-cta .aia-done { padding: 24px 18px; } }

/* Phones ------------------------------------------------------------------ */
@media (max-width: 759px) {
	.aia-market__grid { grid-template-columns: minmax(0, 1fr); }
	.aia-market__grid > div, .aia-market__grid > div + div { padding: var(--space-4) 0; border-left: 0; border-bottom: 1px solid var(--c-line); }
	.aia-gartner { grid-template-columns: minmax(0, 1fr); }
	.aia-nums { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.aia-nums li, .aia-nums li + li { padding: var(--space-4) 12px var(--space-4) 0; border-left: 0; border-bottom: 1px solid var(--c-line); }
	.aia-nums li:nth-child(even) { padding-left: 14px; border-left: 1px solid var(--c-line); }
	.aia-tests { grid-template-columns: minmax(0, 1fr); }
	.aia-tests li { display: grid; grid-template-columns: 6.2em minmax(0, 1fr); align-items: center; gap: 12px; }
	.aia-tests span + span { margin-top: 0; }
	.aia-dots { grid-template-columns: repeat(16, 1fr); }
	.aia-hero__bg { width: 200%; opacity: .45; object-position: 60% 30%; }
	.aia-hero .btn-row .btn { flex: 1 1 100%; justify-content: center; }
}

/* Reduced motion: final states, no loops (also enforced by the script). */
@media (prefers-reduced-motion: reduce) {
	.aia *, .aia *::before, .aia *::after { animation: none !important; transition: none !important; }
}