/* AI page: explicit layout and theme colors replace legacy demo styles. */
body.editorial.ai-page .subpage-hero {padding-block:3.5rem 2.5rem;border-bottom:0;}
body.editorial.ai-page .subpage-hero > p:not(.eyebrow) {max-width:62ch;font-size:1.05rem;line-height:1.7;}
body.editorial.ai-page .section-block {padding-block:2.5rem;min-height:0;}
body.editorial.ai-page .agent-section {display:block;padding:2rem 0;border:0;border-top:1px solid var(--line);background:transparent;box-shadow:none;}
body.editorial.ai-page .agent-copy {width:100%;max-width:44rem;margin-bottom:2rem;}
body.editorial.ai-page .agent-copy h2 {font-size:clamp(2rem,3.5vw,3rem);max-width:24ch;margin:.75rem 0 1rem;line-height:1.12;}
body.editorial.ai-page .agent-intro {max-width:62ch;color:var(--muted);font-size:1rem;line-height:1.7;}
body.editorial.ai-page .agent-section .workflow-demo {display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);grid-template-areas:"hint hint" "steps output";gap:1rem 1.5rem;margin:0;padding:0;border:0;background:transparent;align-items:start;}
body.editorial.ai-page .workflow-instruction {grid-area:hint;margin:0;color:var(--muted);font-size:.9rem;}
body.editorial.ai-page .agent-section .workflow-demo-panel {grid-area:output;margin:0;padding:1.75rem;border:1px solid var(--line);border-radius:12px;background:var(--paper-deep);background-image:none;box-shadow:none;min-height:280px;}
body.editorial.ai-page .agent-section .workflow-demo-panel :is(.eyebrow,.eyebrow span,h3,p,p:last-child) {color:var(--ink);text-shadow:none;}
body.editorial.ai-page .agent-section .workflow-demo-panel .eyebrow {color:var(--muted);font-size:.7rem;}
body.editorial.ai-page .agent-section .workflow-demo-panel h3 {max-width:22ch;font-size:clamp(1.6rem,2.5vw,2.1rem);line-height:1.2;margin:1rem 0;}
body.editorial.ai-page .agent-section .workflow-demo-panel p:last-child {color:var(--muted);font-size:1rem;line-height:1.7;margin:0;}
body.editorial.ai-page .agent-section .workflow-steps {grid-area:steps;display:grid;grid-template-columns:minmax(0,1fr);gap:.65rem;margin:0;padding:0;list-style:none;border:0;border-radius:0;background:transparent;background-image:none;box-shadow:none;}
body.editorial.ai-page .workflow-steps li {margin:0;padding:0;min-width:0;}
body.editorial.ai-page .workflow-steps button {width:100%;min-height:56px;padding:.9rem 1rem;gap:.8rem;color:var(--ink);background:transparent;border:1px solid var(--line);border-radius:10px;font-size:.95rem;line-height:1.4;text-align:left;box-shadow:none;}
body.editorial.ai-page .workflow-steps button[aria-pressed="true"] {background:var(--ink);color:var(--paper);border-color:var(--ink);}
body.editorial.ai-page .workflow-steps button span {font-size:.8rem;color:inherit;}
@media(hover:hover) and (pointer:fine) {body.editorial.ai-page .workflow-steps button:not([aria-pressed="true"]):hover {background:var(--paper-deep);border-color:var(--muted);}}
body.editorial.ai-page .case-dialog-grid {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem;margin:0;}
body.editorial.ai-page .case-dialog-grid section {min-height:0;padding:1.5rem;border:1px solid var(--line);border-radius:12px;background:var(--paper-deep);color:var(--ink);}
body.editorial.ai-page .case-dialog-grid section > span {display:block;color:var(--ink);font-size:.8rem;letter-spacing:.05em;}
body.editorial.ai-page .case-dialog-grid p {font-size:1rem;line-height:1.6;color:var(--muted);margin:.7rem 0 0;}
body.editorial.ai-page .build-log {display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.3fr);gap:2rem;padding:2rem 0;border:0;border-top:1px solid var(--line);background:transparent;box-shadow:none;}
body.editorial.ai-page .build-log h3 {font-size:clamp(1.8rem,3vw,2.4rem);line-height:1.2;color:var(--ink);max-width:20ch;margin:1rem 0;}
body.editorial.ai-page .build-log-list {display:grid;grid-template-columns:minmax(0,1fr);gap:.75rem;padding:0;margin:0;list-style:none;}
body.editorial.ai-page .build-log-list li {padding:1rem 1.2rem;border:1px solid var(--line);border-radius:10px;background:var(--paper-deep);color:var(--ink);box-shadow:none;}
body.editorial.ai-page .build-log-list li p {color:var(--muted);font-size:.95rem;line-height:1.6;}
@media(max-width:760px) {
 body.editorial.ai-page .subpage-hero {padding-block:2.25rem 2rem;}
 body.editorial.ai-page .section-block {padding-block:1.5rem;}
 body.editorial.ai-page .agent-section .workflow-demo {grid-template-columns:minmax(0,1fr);grid-template-areas:"hint" "steps" "output";gap:1rem;}
 body.editorial.ai-page .agent-section .workflow-demo-panel {padding:1.25rem;min-height:0;}
 body.editorial.ai-page .case-dialog-grid,body.editorial.ai-page .build-log {grid-template-columns:minmax(0,1fr);}
 body.editorial.ai-page .case-dialog-grid section {padding:1.25rem;}
}

/* The interactive grid belongs to the AI introduction. */
body.editorial.ai-page .ai-grid-hero {display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,380px);align-items:center;gap:clamp(2rem,6vw,5rem);padding-block:3rem;min-height:0;height:auto;}
body.editorial.ai-page .ai-hero-copy {min-width:0;}
body.editorial.ai-page .ai-grid-hero::after {display:none;}
body.editorial.ai-page .ai-hero-copy h1 {font-size:clamp(2.8rem,4.8vw,4.4rem);line-height:1.06;max-width:16ch;margin:1.25rem 0 1.5rem;}
body.editorial.ai-page .ai-hero-copy > p:not(.eyebrow) {max-width:52ch;color:var(--muted);font-size:1.05rem;line-height:1.7;}
body.editorial.ai-page .ai-grid-hero .interactive-grid {margin:0;width:100%;justify-self:end;}
@media(max-width:760px) {
 body.editorial.ai-page .ai-grid-hero {grid-template-columns:minmax(0,1fr);gap:2rem;padding-block:2rem;}
 body.editorial.ai-page .ai-hero-copy h1 {font-size:clamp(2.6rem,10vw,3.7rem);}
 body.editorial.ai-page .ai-grid-hero .interactive-grid {width:min(100%,360px);justify-self:start;}
}

/* Full-width interactive hero; text and controls stay above the grid. */
body.editorial.ai-page .ai-grid-hero {position:relative;isolation:isolate;display:grid;grid-template-columns:minmax(0,1fr);width:100%;max-width:none;margin:0;min-height:clamp(620px,calc(100svh - 80px),900px);padding:4rem 0 8rem;gap:0;overflow:hidden;background:#10233f;}
body.editorial.ai-page .ai-hero-copy {position:relative;z-index:2;width:min(91%,1200px);margin:0 auto;pointer-events:none;}
body.editorial.ai-page .ai-hero-copy .eyebrow,body.editorial.ai-page .ai-hero-copy .eyebrow span {color:#bcd0eb;}
body.editorial.ai-page .ai-hero-copy h1 {color:#eef4ff;font-size:clamp(3.2rem,6.5vw,6.5rem);max-width:15ch;line-height:1.02;margin:1.5rem 0;}
body.editorial.ai-page .ai-hero-copy > p:not(.eyebrow) {color:#d0dcef;font-size:clamp(1rem,1.3vw,1.15rem);max-width:48ch;}
body.editorial.ai-page .ai-grid-hero .interactive-grid {position:absolute;inset:0;z-index:0;width:100%;height:100%;margin:0;max-width:none;}
body.editorial.ai-page .ai-grid-hero .grid-surface {position:absolute;inset:0;width:100%;height:100%;aspect-ratio:auto;border:0;border-radius:0;background:#10233f;}
body.editorial.ai-page .ai-grid-hero .interactive-grid::after {content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,#0b1730ed 0%,#0b1730c7 40%,#0b173033 75%);}
body.editorial.ai-page .ai-grid-hero .grid-controls {position:absolute;z-index:3;bottom:2rem;right:4.5%;margin:0;}
body.editorial.ai-page .ai-grid-hero .grid-controls button {background:#10233fdd;color:#eef4ff;border-color:#738dae;}
body.editorial.ai-page .ai-grid-hero .grid-controls button[aria-pressed="true"] {background:#eef4ff;color:#10233f;border-color:#eef4ff;}
body.editorial.ai-page .ai-grid-hero .grid-controls button:not([aria-pressed="true"]):hover {background:#234a7b;}
body.editorial.ai-page .ai-grid-hero .grid-controls button:focus-visible,body.editorial.ai-page .ai-grid-hero .grid-surface:focus-visible {outline-color:#fff;outline-offset:-5px;}
body.editorial.ai-page .ai-grid-hero .interactive-grid figcaption {position:absolute;z-index:3;bottom:2.85rem;left:4.5%;max-width:45ch;padding-right:1rem;margin:0;color:#bcd0eb;pointer-events:none;}
@media(max-width:760px) {
 body.editorial.ai-page .ai-grid-hero {min-height:650px;padding:3rem 0 9rem;}
 body.editorial.ai-page .ai-hero-copy h1 {font-size:clamp(2.8rem,11vw,4.8rem);max-width:14ch;}
 body.editorial.ai-page .ai-grid-hero .interactive-grid::after {background:linear-gradient(90deg,#0b1730e6,#0b17309e);}
 body.editorial.ai-page .ai-grid-hero .grid-controls {left:4.5%;right:auto;bottom:1.5rem;}
 body.editorial.ai-page .ai-grid-hero .interactive-grid figcaption {bottom:5rem;right:4.5%;max-width:none;font-size:.7rem;}
}

/* Hero colors follow the same light and dark palette as the page. */
body.editorial.ai-page .ai-grid-hero {background:var(--paper-deep);}
body.editorial.ai-page .ai-grid-hero .grid-surface {background:var(--paper-deep);}
body.editorial.ai-page .ai-hero-copy h1 {color:var(--ink);}
body.editorial.ai-page .ai-hero-copy .eyebrow,body.editorial.ai-page .ai-hero-copy .eyebrow span,
body.editorial.ai-page .ai-hero-copy > p:not(.eyebrow),body.editorial.ai-page .ai-grid-hero .interactive-grid figcaption {color:var(--muted);}
body.editorial.ai-page .ai-grid-hero .interactive-grid::after {background:linear-gradient(90deg,#edf2f8ed 0%,#edf2f8c7 40%,#edf2f833 75%);}
html[data-theme="dark"] body.editorial.ai-page .ai-grid-hero .interactive-grid::after {background:linear-gradient(90deg,#0b1730ed 0%,#0b1730c7 40%,#0b173033 75%);}
body.editorial.ai-page .ai-grid-hero .grid-controls button {background:var(--paper);color:var(--ink);border-color:var(--muted);}
body.editorial.ai-page .ai-grid-hero .grid-controls button[aria-pressed="true"] {background:var(--ink);color:var(--paper);border-color:var(--ink);}
body.editorial.ai-page .ai-grid-hero .grid-controls button:not([aria-pressed="true"]):hover {background:var(--paper-deep);}
body.editorial.ai-page .ai-grid-hero .grid-controls button:focus-visible,body.editorial.ai-page .ai-grid-hero .grid-surface:focus-visible {outline-color:var(--ink);}
@media(max-width:760px) {
 body.editorial.ai-page .ai-grid-hero .interactive-grid::after {background:linear-gradient(90deg,#edf2f8e6,#edf2f89e);}
 html[data-theme="dark"] body.editorial.ai-page .ai-grid-hero .interactive-grid::after {background:linear-gradient(90deg,#0b1730e6,#0b17309e);}
}
