/* /services/ai-automation/ only. Every rule scoped to body.ai-page.
   Tracks use minmax(0, …) and children min-width:0; long (French) labels wrap.
   The only overflow clipping is the deliberate image crop of the assistant detail. */

body.ai-page .ai-head { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(24px, 5vw, 88px); align-items: end; margin-bottom: clamp(28px, 3.5vw, 46px); }
body.ai-page .ai-head > * { min-width: 0; }
body.ai-page .ai-head .ws-lead { max-width: 56ch; }
body.ai-page .ai-head .ws-eyebrow { display: block; margin-bottom: 12px; }
body.ai-page .ai-tag { display: inline-flex; padding: 5px 10px; border-radius: 999px; font-size: 11.5px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--ws-navy); background: var(--ws-card); border: 1px solid rgba(24,70,132,.25); }
body.ai-page .ai-zoom { display: block; width: 100%; padding: 0; border: 0; background: none; cursor: zoom-in; border-radius: 8px; }
body.ai-page .ai-zoom img { display: block; width: 100%; height: auto; border-radius: 8px; transition: transform .45s var(--ws-ease); }
body.ai-page .ai-zoom:hover img { transform: translateY(-3px); }
body.ai-page .ai-zoom:focus-visible { outline: 2px solid var(--ws-navy); outline-offset: 4px; }
body.ai-page [hidden] { display: none !important; }

/* 1 hero */
body.ai-page .ai-hero { padding: clamp(32px, 4vw, 56px) 0 clamp(40px, 5vw, 64px); }
body.ai-page .ai-hero-grid { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: clamp(28px, 4.5vw, 72px); align-items: center; margin-top: 20px; }
body.ai-page .ai-hero-grid > * { min-width: 0; }
body.ai-page .ai-hero .ws-h1 { font-size: clamp(34px, 4.1vw, 60px); line-height: 1.04; }
body.ai-page .ai-hero .ws-lead { margin-top: 20px; max-width: 52ch; }
body.ai-page .ai-hero .ws-btns { margin-top: 28px; }
body.ai-page .ai-hero-facts { margin: 30px 0 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); border-top: 1px solid var(--ws-line); }
body.ai-page .ai-hero-facts > div { padding: 14px 16px 0 0; min-width: 0; }
body.ai-page .ai-hero-facts > div + div { padding-left: 16px; border-left: 1px solid var(--ws-line); }
body.ai-page .ai-hero-facts dt { font-weight: 600; color: var(--ws-navy); font-size: 16px; }
body.ai-page .ai-hero-facts dd { margin: 4px 0 0; font-size: 14px; line-height: 1.45; color: var(--ws-text-2); }
body.ai-page .ai-hero-fig { margin: 0; }
body.ai-page .ai-hero-fig img { filter: drop-shadow(0 22px 34px rgba(11,22,40,.16)); }
body.ai-page .ai-hero-fig figcaption { display: flex; flex-wrap: wrap; gap: 8px 10px; align-items: center; margin-top: 14px; font-size: 13.5px; line-height: 1.45; color: var(--ws-muted); }

/* 2 where */
body.ai-page .ai-where { padding-top: clamp(48px, 6vw, 84px); padding-bottom: clamp(48px, 6vw, 84px); }
body.ai-page .ai-where-grid { display: grid; grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); gap: clamp(28px, 5vw, 80px); align-items: start; }
body.ai-page .ai-where-grid > * { min-width: 0; }
body.ai-page .ai-where-left .ws-lead { margin-top: 18px; }
body.ai-page .ai-photo { position: relative; margin: 28px 0 0; max-width: 460px; }
body.ai-page .ai-photo img { display: block; width: 100%; height: auto; aspect-ratio: 1 / 1; object-fit: cover; border-radius: 14px; }
body.ai-page .ai-illus { position: absolute; left: 12px; bottom: 12px; padding: 4px 9px; border-radius: 4px; background: rgba(11,22,40,.66); color: #EDF2FA; font-size: 11.5px; font-weight: 500; }
body.ai-page .ai-probs { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--ws-line); }
body.ai-page .ai-probs li { display: grid; grid-template-columns: 44px minmax(0, 1fr); gap: 14px; padding: 20px 0; border-bottom: 1px solid var(--ws-line); }
body.ai-page .ai-prob-n { font-size: 13px; font-weight: 600; color: var(--ws-blue); letter-spacing: .04em; padding-top: 4px; }
body.ai-page .ai-probs h3 { font-size: 19px; line-height: 1.3; color: var(--ws-ink); margin: 0; }
body.ai-page .ai-probs p { margin: 6px 0 0; color: var(--ws-text-2); line-height: 1.55; }
body.ai-page .ai-prob-a { color: var(--ws-text) !important; }
body.ai-page .ai-prob-a b { color: var(--ws-navy); }
body.ai-page .ai-oversight { margin-top: 30px; padding: clamp(20px, 3vw, 30px); border-radius: 14px; background: var(--ws-ice); border: 1px solid var(--ws-line); }
body.ai-page .ai-oversight > p { margin: 10px 0 0; color: var(--ws-text-2); line-height: 1.6; }
body.ai-page .ai-risk { list-style: none; margin: 20px 0 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
body.ai-page .ai-risk li { min-width: 0; padding: 14px; border-radius: 10px; background: var(--ws-card); border: 1px solid var(--ws-line); display: grid; gap: 6px; align-content: start; position: relative; }
body.ai-page .ai-risk li::before { content: ""; height: 4px; border-radius: 2px; background: var(--ws-blue); opacity: .3; }
body.ai-page .ai-risk li.r2::before { opacity: .6; }
body.ai-page .ai-risk li.r3::before { opacity: 1; background: var(--ws-navy); }
body.ai-page .ai-risk b { color: var(--ws-ink); font-size: 15px; line-height: 1.3; }
body.ai-page .ai-risk span { font-size: 13.5px; line-height: 1.45; color: var(--ws-text-2); }
body.ai-page .ai-noai { font-size: 14.5px; border-top: 1px solid var(--ws-line); padding-top: 14px; margin-top: 18px !important; }

/* 3 capabilities */
body.ai-page .ai-major { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
body.ai-page .ai-cap-big { min-width: 0; padding: clamp(22px, 3vw, 36px); background: var(--ws-card); border: 1px solid var(--ws-line); border-radius: 16px; }
body.ai-page .ai-cap-k { display: inline-grid; place-items: center; width: 30px; height: 30px; border-radius: 8px; background: var(--ws-navy); color: #F4F7FC; font-size: 13px; font-weight: 600; }
body.ai-page .ai-cap-big h3 { margin: 16px 0 0; font-size: clamp(22px, 2.2vw, 28px); line-height: 1.2; color: var(--ws-ink); }
body.ai-page .ai-cap-big > p { margin: 10px 0 0; color: var(--ws-text-2); line-height: 1.6; max-width: 54ch; }
body.ai-page .ai-feat { list-style: none; margin: 18px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
body.ai-page .ai-feat li { padding: 6px 11px; border-radius: 999px; font-size: 13px; color: var(--ws-navy); background: var(--ws-ice); border: 1px solid var(--ws-line); }
body.ai-page .ai-cap-ex { margin: 20px 0 0; font-size: 14.5px; }
body.ai-page .ai-minor { margin-top: 18px; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border-top: 1px solid var(--ws-line); }
body.ai-page .ai-minor article { min-width: 0; padding: 22px 20px 4px 0; }
body.ai-page .ai-minor article + article { padding-left: 20px; border-left: 1px solid var(--ws-line); }
body.ai-page .ai-minor .ai-cap-k { width: 26px; height: 26px; font-size: 12px; background: transparent; color: var(--ws-navy); border: 1px solid rgba(24,70,132,.35); }
body.ai-page .ai-minor h3 { margin: 12px 0 0; font-size: 17px; line-height: 1.3; color: var(--ws-ink); }
body.ai-page .ai-minor p { margin: 8px 0 0; font-size: 14.5px; line-height: 1.55; color: var(--ws-text-2); }
body.ai-page .ai-agents .ws-link { margin-top: 12px; display: inline-flex; min-height: 44px; align-items: center; }
body.ai-page .ai-caps-foot { margin-top: 28px; display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); gap: 24px; align-items: start; }
body.ai-page .ai-agents-note { margin: 0; padding: 18px 20px; border-left: 3px solid var(--ws-navy); background: var(--ws-card); border-radius: 0 10px 10px 0; line-height: 1.6; color: var(--ws-text-2); }
body.ai-page .ai-agents-note b { color: var(--ws-ink); }
body.ai-page .ai-caps-acc { margin: 0; font-size: 13.5px; line-height: 1.55; color: var(--ws-muted); }

/* 4 demo */
body.ai-page .ai-demo { padding-top: clamp(56px, 7vw, 96px); padding-bottom: clamp(56px, 7vw, 96px); }
body.ai-page .ai-static { padding: 24px; border: 1px dashed var(--ws-line); border-radius: 14px; background: var(--ws-card); }
body.ai-page .ai-static ol { margin: 0; padding-left: 20px; display: grid; gap: 10px; line-height: 1.55; }
body.ai-page .ai-static p { margin: 16px 0 0; color: var(--ws-muted); font-size: 14px; }
body.ai-page .ai-app { background: var(--ws-card); border: 1px solid var(--ws-line); border-radius: 20px; padding: clamp(16px, 2.6vw, 30px); box-shadow: 0 30px 60px -36px rgba(11,22,40,.28); }
body.ai-page .ai-app-top { display: flex; flex-wrap: wrap; gap: 14px 24px; align-items: center; justify-content: space-between; }
body.ai-page .ai-app-label { margin: 0; display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; font-size: 13.5px; color: var(--ws-muted); min-width: 0; }
body.ai-page .ai-app-label b { color: var(--ws-navy); font-weight: 600; text-transform: uppercase; letter-spacing: .06em; font-size: 12px; }
body.ai-page .ai-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--ws-blue); }
body.ai-page .ai-scen { display: flex; flex-wrap: wrap; gap: 6px; padding: 4px; border-radius: 12px; background: var(--ws-ice); border: 1px solid var(--ws-line); max-width: 100%; }
body.ai-page .ai-scen button { min-height: 44px; padding: 8px 14px; border: 0; border-radius: 9px; background: transparent; color: var(--ws-text-2); font: inherit; font-size: 14px; line-height: 1.3; text-align: left; cursor: pointer; transition: background .2s var(--ws-ease), color .2s var(--ws-ease); }
body.ai-page .ai-scen button[aria-pressed="true"] { background: var(--ws-navy); color: #F4F7FC; }
body.ai-page .ai-scen button:focus-visible,
body.ai-page .ai-tabs [role="tab"]:focus-visible,
body.ai-page .ai-btn:focus-visible,
body.ai-page .ai-cite-link:focus-visible,
body.ai-page .ai-panel:focus-visible { outline: 2px solid var(--ws-navy); outline-offset: 3px; }

body.ai-page .ai-tabs { margin-top: 22px; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
body.ai-page .ai-tabs [role="tab"] { min-width: 0; min-height: 64px; display: grid; grid-template-columns: auto minmax(0, 1fr); grid-template-rows: auto auto; column-gap: 10px; align-items: center; padding: 10px 14px; text-align: left; font: inherit; border-radius: 12px; border: 1px solid var(--ws-line); background: var(--ws-paper); color: var(--ws-text-2); cursor: pointer; transition: border-color .2s var(--ws-ease), background .2s var(--ws-ease); }
body.ai-page .ai-tabs .n { grid-row: 1 / 3; display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; border: 1px solid currentColor; font-size: 13px; font-weight: 600; }
body.ai-page .ai-tabs .t { font-weight: 600; font-size: 16px; color: var(--ws-ink); line-height: 1.2; overflow-wrap: anywhere; }
body.ai-page .ai-tabs .h { font-size: 12.5px; line-height: 1.3; overflow-wrap: anywhere; }
body.ai-page .ai-tabs [role="tab"].done .n { background: rgba(24,70,132,.1); }
body.ai-page .ai-tabs [role="tab"][aria-selected="true"] { background: var(--ws-navy); border-color: var(--ws-navy); color: #C9D8EF; }
body.ai-page .ai-tabs [role="tab"][aria-selected="true"] .t { color: #fff; }
body.ai-page .ai-tabs [role="tab"][aria-selected="true"] .n { background: #F4F7FC; color: var(--ws-navy); border-color: #F4F7FC; }
body.ai-page .ai-prog { margin-top: 10px; height: 3px; border-radius: 2px; background: var(--ws-line); }
body.ai-page .ai-prog i { display: block; height: 100%; border-radius: 2px; background: var(--ws-blue); transform-origin: left center; transform: scaleX(.25); transition: transform .4s var(--ws-ease); }

body.ai-page .ai-panel { margin-top: 20px; display: grid; grid-template-columns: minmax(0, 1.55fr) minmax(0, 1fr); gap: clamp(18px, 3vw, 36px); align-items: start; border-radius: 14px; }
body.ai-page .ai-panel > * { min-width: 0; }
body.ai-page .ai-stage { min-height: 360px; }
body.ai-page .ai-s { animation: wsAiAutomationStageIn .35s var(--ws-ease) both; }
@keyframes wsAiAutomationStageIn { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
body.ai-page .ai-explain { padding: 20px; border-radius: 14px; background: var(--ws-ice); border: 1px solid var(--ws-line); }
body.ai-page .ai-progress { margin: 0; font-size: 12px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--ws-blue); }
body.ai-page .ai-explain > p[data-ai="explain"] { margin: 10px 0 0; line-height: 1.6; color: var(--ws-text); }
body.ai-page .ai-ctrls { margin-top: 18px; display: flex; flex-wrap: wrap; gap: 8px; }
body.ai-page .ai-btn { min-height: 44px; padding: 10px 16px; border-radius: 10px; border: 1px solid var(--ws-line); background: var(--ws-card); color: var(--ws-navy); font: inherit; font-size: 14.5px; font-weight: 600; line-height: 1.25; cursor: pointer; text-align: center; }
body.ai-page .ai-btn-primary { background: var(--ws-navy); border-color: var(--ws-navy); color: #F4F7FC; }
body.ai-page .ai-btn[aria-disabled="true"] { opacity: .55; cursor: not-allowed; }
body.ai-page .ai-err { margin: 12px 0 0; min-height: 1.4em; font-size: 13.5px; color: var(--ws-err); }
body.ai-page .ai-disc { margin: 18px 0 0; font-size: 13px; line-height: 1.5; color: var(--ws-muted); }

/* stage visuals */
body.ai-page .ai-chat { border: 1px solid var(--ws-line); border-radius: 14px; background: var(--ws-paper); }
body.ai-page .ai-chat-head { display: flex; flex-wrap: wrap; gap: 6px 14px; align-items: center; justify-content: space-between; padding: 12px 16px; background: var(--ws-navy); color: #F4F7FC; border-radius: 13px 13px 0 0; }
body.ai-page .ai-chat-head b { font-size: 14.5px; }
body.ai-page .ai-src-ind { display: inline-flex; align-items: center; gap: 7px; font-size: 12.5px; color: #C9D8EF; min-width: 0; }
body.ai-page .ai-src-ind i { width: 7px; height: 7px; border-radius: 50%; background: #8FD3B0; flex: none; }
body.ai-page .ai-chat-body { padding: 18px 16px; display: grid; gap: 12px; }
body.ai-page .ai-role { margin: 0; font-size: 12px; color: var(--ws-muted); text-align: right; }
body.ai-page .ai-msg { max-width: 88%; padding: 12px 14px; border-radius: 14px; line-height: 1.5; }
body.ai-page .ai-msg p { margin: 0; }
body.ai-page .ai-msg.user { justify-self: end; background: #E4ECF8; border-bottom-right-radius: 4px; color: var(--ws-ink); }
body.ai-page .ai-msg-who { font-size: 11.5px; font-weight: 600; color: var(--ws-navy); margin-bottom: 4px !important; }
body.ai-page .ai-msg.bot { justify-self: start; background: var(--ws-card); border: 1px solid var(--ws-line); border-bottom-left-radius: 4px; }
body.ai-page .ai-msg.bot.unsure { border-color: rgba(176,112,26,.45); background: #FCF7EE; }
body.ai-page .ai-sent { margin: 0; justify-self: end; font-size: 12px; color: var(--ws-muted); }
body.ai-page .ai-scope { margin-top: 14px; padding: 14px 16px; border-radius: 12px; border: 1px dashed rgba(24,70,132,.35); }
body.ai-page .ai-scope-t { margin: 0; font-size: 12px; font-weight: 600; text-transform: uppercase; letter-spacing: .06em; color: var(--ws-navy); }
body.ai-page .ai-scope ul { list-style: none; margin: 10px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
body.ai-page .ai-scope li { font-size: 13px; padding: 5px 10px; border-radius: 999px; background: var(--ws-ice); color: var(--ws-navy); }
body.ai-page .ai-scope li::before { content: "\2713\00a0"; }
body.ai-page .ai-scope li.no { background: transparent; border: 1px solid var(--ws-line); color: var(--ws-text-2); }
body.ai-page .ai-scope li.no::before { content: "\2715\00a0"; }

body.ai-page .ai-ret-bar { display: flex; flex-wrap: wrap; gap: 6px 14px; justify-content: space-between; padding: 12px 14px; border-radius: 10px; background: var(--ws-paper); border: 1px solid var(--ws-line); }
body.ai-page .ai-ret-q { font-size: 14px; color: var(--ws-ink); min-width: 0; overflow-wrap: anywhere; }
body.ai-page .ai-ret-meta { font-size: 12.5px; color: var(--ws-muted); }
body.ai-page .ai-ret-status { margin: 14px 0 0; font-size: 13px; font-weight: 600; }
body.ai-page .ai-ret-status::before { content: ""; display: inline-block; width: 8px; height: 8px; border-radius: 50%; margin-right: 8px; vertical-align: 1px; }
body.ai-page .ai-ret-status.ok { color: #1E6B48; } body.ai-page .ai-ret-status.ok::before { background: #2E8B5E; }
body.ai-page .ai-ret-status.warn { color: #8A5A12; } body.ai-page .ai-ret-status.warn::before { background: #C08A2E; }
body.ai-page .ai-docs { margin-top: 12px; display: grid; gap: 10px; }
body.ai-page .ai-doc { position: relative; padding: 18px 18px 16px; border-radius: 12px; background: var(--ws-card); border: 1px solid var(--ws-line); }
body.ai-page .ai-doc.hit { border-left: 4px solid var(--ws-blue); box-shadow: 0 16px 30px -24px rgba(11,22,40,.35); }
body.ai-page .ai-doc.near { border-style: dashed; background: var(--ws-paper); }
body.ai-page .ai-doc p { margin: 0; }
body.ai-page .ai-doc-k { font-size: 12px; color: var(--ws-muted); text-transform: uppercase; letter-spacing: .06em; margin-bottom: 6px !important; }
body.ai-page .ai-doc-t { font-weight: 600; color: var(--ws-ink); }
body.ai-page .ai-doc-s { font-size: 13.5px; color: var(--ws-navy); margin-top: 2px !important; }
body.ai-page .ai-doc-pass { margin: 12px 0 0; padding: 10px 14px; border-radius: 8px; background: #FFF5D6; color: var(--ws-ink); line-height: 1.55; font-size: 15px; }
body.ai-page .ai-doc-v, body.ai-page .ai-doc-why { font-size: 12.5px; color: var(--ws-muted); margin-top: 10px !important; }
body.ai-page .ai-pill { display: inline-block; margin-top: 10px; padding: 4px 10px; border-radius: 999px; font-size: 12px; font-weight: 600; }
body.ai-page .ai-pill.ok { background: rgba(46,139,94,.12); color: #1E6B48; }
body.ai-page .ai-pill.warn { background: rgba(192,138,46,.14); color: #8A5A12; }
body.ai-page .ai-filtered { margin: 0; padding: 10px 14px 10px 36px; position: relative; font-size: 13px; line-height: 1.45; color: var(--ws-text-2); border-radius: 10px; background: var(--ws-ice); }
body.ai-page .ai-filtered::before { content: ""; position: absolute; left: 14px; top: 13px; width: 10px; height: 8px; border: 2px solid var(--ws-navy); border-radius: 2px; }
body.ai-page .ai-filtered::after { content: ""; position: absolute; left: 16px; top: 8px; width: 6px; height: 6px; border: 2px solid var(--ws-navy); border-bottom: 0; border-radius: 4px 4px 0 0; }

body.ai-page .ai-cite { margin-top: 12px; padding-top: 10px; border-top: 1px solid var(--ws-line); display: flex; flex-wrap: wrap; gap: 6px 10px; align-items: center; font-size: 13px; }
body.ai-page .ai-cite-k { font-weight: 600; color: var(--ws-muted); text-transform: uppercase; letter-spacing: .06em; font-size: 11.5px; }
body.ai-page .ai-cite-link { min-height: 44px; padding: 6px 12px; border-radius: 8px; border: 1px solid rgba(24,70,132,.3); background: var(--ws-ice); color: var(--ws-navy); font: inherit; font-size: 13.5px; font-weight: 600; text-decoration: underline; text-underline-offset: 3px; cursor: pointer; text-align: left; }
body.ai-page .ai-cite-none { padding: 5px 10px; border-radius: 8px; border: 1px dashed rgba(176,112,26,.5); color: #8A5A12; font-weight: 600; }
body.ai-page .ai-next { margin: 0; font-size: 13.5px; color: var(--ws-text-2); }
body.ai-page .ai-next b { color: var(--ws-navy); }
body.ai-page .ai-check { margin: 12px 0 0; padding: 10px 14px; border-radius: 10px; font-size: 13.5px; line-height: 1.5; }
body.ai-page .ai-check.ok { background: var(--ws-ice); color: var(--ws-navy); }
body.ai-page .ai-check.warn { background: #FCF7EE; color: #7A4F0F; }

body.ai-page .ai-s-review { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: 14px; align-items: start; }
body.ai-page .ai-queue { padding: 18px; border-radius: 14px; background: var(--ws-card); border: 1px solid var(--ws-line); min-width: 0; }
body.ai-page .ai-queue-t { margin: 0 0 12px; font-size: 12px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--ws-navy); }
body.ai-page .ai-fields { display: grid; gap: 8px; }
body.ai-page .ai-kv { display: grid; grid-template-columns: minmax(0, 9.5em) minmax(0, 1fr); gap: 10px; font-size: 13.5px; line-height: 1.4; }
body.ai-page .ai-kv span { color: var(--ws-muted); }
body.ai-page .ai-kv b { color: var(--ws-ink); font-weight: 600; overflow-wrap: anywhere; }
body.ai-page .ai-kv:not(:has(span)) b { grid-column: 2; font-size: 18px; }
body.ai-page .ai-rule { margin: 12px 0 0; font-size: 12.5px; color: var(--ws-navy); }
body.ai-page .ai-status { margin: 14px 0 0; padding: 10px 12px; border-radius: 10px; display: grid; gap: 2px; font-size: 13px; background: var(--ws-paper); border: 1px solid var(--ws-line); }
body.ai-page .ai-status span { color: var(--ws-muted); font-size: 11.5px; text-transform: uppercase; letter-spacing: .06em; }
body.ai-page .ai-status.st-prepared { border-color: rgba(192,138,46,.5); background: #FCF7EE; }
body.ai-page .ai-status.st-approved { border-color: rgba(46,139,94,.45); background: rgba(46,139,94,.08); }
body.ai-page .ai-status.st-returned { border-color: rgba(24,70,132,.35); background: var(--ws-ice); }
body.ai-page .ai-status.st-blocked { border-color: rgba(176,112,26,.5); background: #FCF7EE; }
body.ai-page .ai-rv-acts { margin-top: 14px; display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
body.ai-page .ai-mgr-hint { flex-basis: 100%; margin: 0; font-size: 12.5px; color: var(--ws-muted); }
body.ai-page .ai-log { padding: 16px; border-radius: 14px; background: var(--ws-ink); color: var(--ws-on-dark); min-width: 0; }
body.ai-page .ai-log-t { margin: 0 0 10px; font-size: 11.5px; letter-spacing: .08em; text-transform: uppercase; color: var(--ws-on-dark-2); }
body.ai-page .ai-log ol { margin: 0; padding-left: 18px; display: grid; gap: 8px; font-size: 13px; line-height: 1.45; }
body.ai-page .ai-log li.idle { list-style: none; margin-left: -18px; color: var(--ws-on-dark-2); }

/* 5 BOA */
body.ai-page .ai-boa { padding-top: clamp(56px, 7vw, 96px); padding-bottom: clamp(56px, 7vw, 96px); }
body.ai-page .ai-boa-head { display: grid; gap: 14px; margin-bottom: clamp(24px, 3vw, 40px); }
body.ai-page .ai-boa-head .ai-tag { justify-self: start; }
body.ai-page .ai-boa-meta { margin: 6px 0 0; display: flex; flex-wrap: wrap; gap: 10px 32px; }
body.ai-page .ai-boa-meta > div { min-width: 0; }
body.ai-page .ai-boa-meta dt { font-size: 11.5px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--ws-muted); }
body.ai-page .ai-boa-meta dd { margin: 3px 0 0; color: var(--ws-ink); font-weight: 500; }
body.ai-page .ai-boa-grid { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, .62fr) minmax(0, 1.1fr); gap: clamp(16px, 2.4vw, 32px); align-items: start; }
body.ai-page .ai-boa-grid > * { min-width: 0; margin: 0; }
body.ai-page .ai-boa-grid figcaption { margin-top: 10px; font-size: 13px; line-height: 1.45; color: var(--ws-muted); display: flex; flex-wrap: wrap; gap: 6px 8px; align-items: center; }
body.ai-page .ai-boa-main img { filter: drop-shadow(0 18px 30px rgba(11,22,40,.14)); }
body.ai-page .ai-crop { max-width: 340px; }
body.ai-page .ai-crop-box { display: block; position: relative; aspect-ratio: 424 / 652; overflow: hidden; border-radius: 12px; border: 1px solid var(--ws-line); background: #fff; box-shadow: 0 18px 30px -18px rgba(11,22,40,.3); }
body.ai-page .ai-crop-box img { position: absolute; max-width: none; width: 320.3%; height: auto; left: -205.2%; top: -48.8%; border-radius: 0; }
body.ai-page .ai-zoom.ai-crop:hover img { transform: none; }
body.ai-page .ai-boa-intro { margin: 0; font-size: 17px; line-height: 1.6; color: var(--ws-ink); }
body.ai-page .ai-visit { list-style: none; counter-reset: v; margin: 18px 0 0; padding: 0; display: grid; gap: 10px; }
body.ai-page .ai-visit li { counter-increment: v; display: grid; grid-template-columns: 30px minmax(0, 1fr); column-gap: 10px; }
body.ai-page .ai-visit li::before { content: counter(v); grid-row: 1 / 3; display: grid; place-items: center; width: 26px; height: 26px; border-radius: 50%; background: var(--ws-navy); color: #F4F7FC; font-size: 12px; font-weight: 600; }
body.ai-page .ai-visit b { color: var(--ws-ink); font-size: 15px; }
body.ai-page .ai-visit span { font-size: 13.5px; color: var(--ws-text-2); }
body.ai-page .ai-admin { margin-top: 18px; padding: 16px; border-radius: 12px; border: 1px dashed rgba(24,70,132,.35); background: var(--ws-card); }
body.ai-page .ai-admin-k { margin: 0; font-size: 11.5px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--ws-muted); }
body.ai-page .ai-admin-flow { margin-top: 10px; display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
body.ai-page .ai-admin-flow span { padding: 5px 9px; border-radius: 6px; background: var(--ws-ice); color: var(--ws-navy); font-size: 12.5px; }
body.ai-page .ai-admin-flow i { width: 14px; height: 1px; background: var(--ws-navy); }
body.ai-page .ai-admin > p:last-child { margin: 10px 0 0; font-size: 13.5px; line-height: 1.5; color: var(--ws-text-2); }
body.ai-page .ai-boa-lim { margin: 16px 0 0; font-size: 13.5px; line-height: 1.55; color: var(--ws-muted); }
body.ai-page .ai-boa-ctas { margin-top: 16px; display: flex; flex-wrap: wrap; gap: 4px 24px; }
body.ai-page .ai-boa-ctas .ws-link { min-height: 44px; display: inline-flex; align-items: center; }

/* 6 engineering */
body.ai-page .ai-eng { padding-top: clamp(60px, 7vw, 100px); padding-bottom: clamp(60px, 7vw, 100px); }
body.ai-page .ai-arch { margin: 0; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 300px); gap: 18px; }
body.ai-page .ai-arch-main { min-width: 0; display: grid; gap: 0; }
body.ai-page .ai-layer { min-width: 0; padding: 16px 18px; border-radius: 12px; border: 1px solid var(--ws-line-dark); background: rgba(157,189,240,.06); display: grid; grid-template-columns: minmax(0, 14em) minmax(0, 1fr); gap: 8px 18px; align-items: center; }
body.ai-page .ai-layer h3 { margin: 0; font-size: 15.5px; color: #F4F7FC; }
body.ai-page .ai-layer ul { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px; }
body.ai-page .ai-layer li { padding: 5px 10px; border-radius: 6px; font-size: 13px; color: var(--ws-on-dark); background: rgba(157,189,240,.1); border: 1px solid rgba(157,189,240,.18); }
body.ai-page .ai-layer li.key { border-color: #9DBDF0; color: #fff; }
body.ai-page .ai-layer-n { grid-column: 2; margin: 2px 0 0; font-size: 12.5px; line-height: 1.45; color: var(--ws-on-dark-2); }
body.ai-page .ai-arrow { margin: 0; padding: 6px 0 6px 28px; position: relative; font-size: 12.5px; color: #9DBDF0; font-style: italic; }
body.ai-page .ai-arrow::before { content: ""; position: absolute; left: 14px; top: 0; bottom: 0; width: 1px; background: #9DBDF0; }
body.ai-page .ai-arrow::after { content: ""; position: absolute; left: 10px; bottom: 0; border: 5px solid transparent; border-top-color: #9DBDF0; border-bottom: 0; }
body.ai-page .ai-arch-side { min-width: 0; display: grid; gap: 14px; align-content: start; }
body.ai-page .ai-tools { padding: 16px; border-radius: 12px; border: 1px dashed #9DBDF0; }
body.ai-page .ai-tools h3, body.ai-page .ai-cross h3 { margin: 0; font-size: 15px; color: #F4F7FC; }
body.ai-page .ai-tools p { margin: 8px 0 0; font-size: 13.5px; line-height: 1.5; color: var(--ws-on-dark-2); }
body.ai-page .ai-cross { padding: 16px; border-radius: 12px; background: rgba(157,189,240,.1); }
body.ai-page .ai-cross ul { list-style: none; margin: 10px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px; }
body.ai-page .ai-cross li { font-size: 13px; padding: 4px 9px; border-radius: 999px; border: 1px solid rgba(157,189,240,.35); color: var(--ws-on-dark); }
body.ai-page .ai-arch figcaption { grid-column: 1 / -1; font-size: 13px; line-height: 1.5; color: var(--ws-on-dark-2); }
body.ai-page .ai-arch figcaption b { color: #F4F7FC; }
body.ai-page .ai-cons-head { margin-top: clamp(40px, 5vw, 64px); }
body.ai-page .ai-cons { list-style: none; counter-reset: k; margin: 22px 0 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 clamp(24px, 4vw, 56px); }
body.ai-page .ai-cons li { counter-increment: k; min-width: 0; padding: 18px 0 18px 46px; position: relative; border-top: 1px solid var(--ws-line-dark); }
body.ai-page .ai-cons li::before { content: counter(k, decimal-leading-zero); position: absolute; left: 0; top: 20px; font-size: 13px; font-weight: 600; color: #9DBDF0; }
body.ai-page .ai-cons h4 { margin: 0; font-size: 16.5px; color: #F4F7FC; }
body.ai-page .ai-cons p { margin: 6px 0 0; font-size: 14.5px; line-height: 1.55; color: var(--ws-on-dark-2); }
body.ai-page .ai-eng-link { margin: 26px 0 0; }
body.ai-page .ai-eng .ws-link { min-height: 44px; display: inline-flex; align-items: center; }

/* 7 path + faq */
body.ai-page .ai-path { padding-top: clamp(56px, 7vw, 96px); padding-bottom: clamp(56px, 7vw, 96px); }
body.ai-page .ai-stages { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1.5fr) minmax(0, 1fr) minmax(0, 1fr); gap: 10px; align-items: stretch; }
body.ai-page .ai-stages li { min-width: 0; padding: 18px 16px; border-radius: 14px; border: 1px solid var(--ws-line); background: var(--ws-card); display: flex; flex-direction: column; }
body.ai-page .ai-st-k { font-size: 11.5px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--ws-blue); overflow-wrap: anywhere; }
body.ai-page .ai-stages h3 { margin: 8px 0 0; font-size: 17px; line-height: 1.25; color: var(--ws-ink); }
body.ai-page .ai-stages p { margin: 8px 0 0; font-size: 14px; line-height: 1.5; color: var(--ws-text-2); }
body.ai-page .ai-you { margin-top: auto !important; padding-top: 12px; border-top: 1px dashed var(--ws-line); font-size: 13px !important; }
body.ai-page .ai-you b { color: var(--ws-navy); }
body.ai-page .ai-stages li > p:not(.ai-you):last-of-type { margin-bottom: 12px; }
body.ai-page .ai-st-key { background: var(--ws-navy) !important; border-color: var(--ws-navy) !important; }
body.ai-page .ai-st-key .ai-st-k { color: #9DBDF0; }
body.ai-page .ai-st-key h3 { color: #fff; font-size: 20px; }
body.ai-page .ai-st-key p { color: #C9D8EF; }
body.ai-page .ai-st-key .ai-st-why { padding: 10px 12px; border-radius: 8px; background: rgba(255,255,255,.08); color: #F4F7FC; }
body.ai-page .ai-st-key .ai-you { border-top-color: rgba(201,216,239,.35); }
body.ai-page .ai-st-key .ai-you b { color: #fff; }
body.ai-page .ai-path-note { margin: 16px 0 0; font-size: 14px; color: var(--ws-muted); display: flex; flex-wrap: wrap; gap: 4px 14px; align-items: center; }
body.ai-page .ai-path-note .ws-link, body.ai-page .ai-related a { min-height: 44px; display: inline-flex; align-items: center; }
body.ai-page .ai-faq-wrap { margin-top: clamp(48px, 6vw, 80px); padding-top: clamp(32px, 4vw, 48px); border-top: 1px solid var(--ws-line); display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: clamp(24px, 5vw, 72px); align-items: start; }
body.ai-page .ai-faq-wrap > * { min-width: 0; }
body.ai-page .ai-related { margin: 18px 0 0; display: flex; flex-wrap: wrap; gap: 0 16px; font-size: 14.5px; color: var(--ws-muted); }
body.ai-page .ai-related > span { flex-basis: 100%; }
body.ai-page .ai-related a { color: var(--ws-navy); text-decoration: underline; text-underline-offset: 3px; }
body.ai-page .ws-faq summary { min-height: 44px; }

/* 8 CTA */
body.ai-page .ai-cta-in { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: clamp(24px, 5vw, 72px); align-items: end; }
body.ai-page .ai-cta-in > * { min-width: 0; }
body.ai-page .ai-cta .ws-lead { margin-top: 18px; }
body.ai-page .ai-cta .ws-btn { min-height: 44px; }
body.ai-page .ai-cta-sub { margin: 16px 0 0; font-size: 14.5px; color: var(--ws-on-dark-2); }
body.ai-page .ai-cta-sub a { color: #F4F7FC; text-decoration: underline; text-underline-offset: 3px; display: inline-flex; min-height: 44px; align-items: center; }

/* responsive */
@media (max-width: 1100px) {
  body.ai-page .ai-boa-grid { grid-template-columns: minmax(0, 1.4fr) minmax(0, .7fr); }
  body.ai-page .ai-boa-body { grid-column: 1 / -1; }
  body.ai-page .ai-stages { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  body.ai-page .ai-st-key { grid-column: 1 / -1; }
  body.ai-page .ai-minor { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  body.ai-page .ai-minor article:nth-child(3) { padding-left: 0; border-left: 0; }
  body.ai-page .ai-arch { grid-template-columns: minmax(0, 1fr); }
  body.ai-page .ai-arch-side { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 900px) {
  body.ai-page .ai-head, body.ai-page .ai-hero-grid, body.ai-page .ai-where-grid, body.ai-page .ai-major,
  body.ai-page .ai-caps-foot, body.ai-page .ai-panel, body.ai-page .ai-faq-wrap, body.ai-page .ai-cta-in { grid-template-columns: minmax(0, 1fr); }
  body.ai-page .ai-head { align-items: start; }
  body.ai-page .ai-tabs { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  body.ai-page .ai-stage { min-height: 0; }
  body.ai-page .ai-s-review { grid-template-columns: minmax(0, 1fr); }
  body.ai-page .ai-risk { grid-template-columns: minmax(0, 1fr); }
  body.ai-page .ai-cons { grid-template-columns: minmax(0, 1fr); }
  body.ai-page .ai-layer { grid-template-columns: minmax(0, 1fr); }
  body.ai-page .ai-layer-n { grid-column: 1; }
  body.ai-page .ai-photo { max-width: none; }
  body.ai-page .ai-photo img { aspect-ratio: 4 / 3; object-position: 50% 38%; }
}
@media (max-width: 640px) {
  body.ai-page .ai-hero-facts, body.ai-page .ai-minor, body.ai-page .ai-stages, body.ai-page .ai-arch-side, body.ai-page .ai-boa-grid { grid-template-columns: minmax(0, 1fr); }
  body.ai-page .ai-hero-facts > div + div { padding-left: 0; border-left: 0; border-top: 1px solid var(--ws-line); margin-top: 12px; }
  body.ai-page .ai-minor article, body.ai-page .ai-minor article + article { padding-left: 0; border-left: 0; border-bottom: 1px solid var(--ws-line); padding-bottom: 18px; }
  body.ai-page .ai-crop { max-width: 300px; margin: 0 auto; }
  body.ai-page .ai-scen { width: 100%; }
  body.ai-page .ai-scen button { flex: 1 1 100%; }
  body.ai-page .ai-msg { max-width: 100%; }
  body.ai-page .ai-kv { grid-template-columns: minmax(0, 1fr); gap: 0; }
  body.ai-page .ai-kv:not(:has(span)) b { grid-column: 1; }
  body.ai-page .ai-tabs [role="tab"] { padding: 10px; column-gap: 8px; }
  body.ai-page .ai-tabs .h { display: none; }
  body.ai-page .ai-tabs [role="tab"] { min-height: 52px; }
  body.ai-page .ai-probs li { grid-template-columns: minmax(0, 1fr); gap: 4px; }
}
@media (prefers-reduced-motion: reduce) {
  body.ai-page .ai-s { animation: none; }
  body.ai-page .ai-prog i, body.ai-page .ai-zoom img, body.ai-page .ai-scen button, body.ai-page .ai-tabs [role="tab"] { transition: none; }
  body.ai-page .ai-zoom:hover img { transform: none; }
}