/* Inner pages, desktop layer: the homepage's section styles and live windows
   carried onto the inner pages. Loaded after styles.css and stages.css.
   Phones and tablets keep the existing layout, so everything new is hidden
   below 1101px. */
.page-intro>.svc-stage,.intro-actions,.w-issues,.w-recent,.step-out,.svc-quote,.related-cards{display:none}

@media(min-width:0){
/* ---- hero: one column, or copy beside the live composition on service pages */
.page-intro{padding-top:160px;padding-bottom:110px}
.page-intro h1{margin:26px 0 26px;letter-spacing:-.05em;line-height:1.02}
.page-intro .intro-description{margin:0;font-size:var(--fs-lead);line-height:1.55;color:#5d5a68;max-width:30em}
.page-intro:has(>.svc-stage){display:grid;grid-template-columns:minmax(0,9fr) minmax(0,14fr);grid-template-rows:auto auto auto 1fr;column-gap:4.5vw;align-items:start;padding-top:160px;padding-bottom:120px}
.page-intro:has(>.svc-stage)>*{grid-column:1}
.page-intro:has(>.svc-stage) h1{font-size:clamp(44px,4.2vw,62px);line-height:1.04}
.page-intro:has(>.svc-stage) h1 br{display:none}
.page-intro:has(>.svc-stage) h1 em{display:inline}
.page-intro h1 em{font-family:'Newsreader',Georgia,serif;font-style:italic;font-weight:400;letter-spacing:-.01em;color:var(--svc,#5b4f9a)}
.page-intro:has(>.svc-stage) .intro-description{max-width:24em}
.intro-actions{display:flex;gap:12px;margin-top:38px}
.page-intro>.svc-stage{display:block;grid-column:2;grid-row:1/-1;align-self:center;margin-top:-20px}
.hero-btn{display:inline-flex;white-space:nowrap;align-items:center;gap:14px;padding:15px 22px;border-radius:6px;font-size:var(--fs-small);font-weight:500;transition:background .2s,border-color .2s,transform .2s}
.hero-btn b{font-weight:400}
.hero-btn.solid{background:#16151c;color:#fff;border:1px solid #16151c}
.hero-btn.solid:hover{background:#2c2a36;transform:translateY(-1px)}
.hero-btn.line{background:#fffefc;color:#16151c;border:1px solid #d9d4cc}
.hero-btn.line:hover{border-color:#16151c}

/* ---- the starting point: copy beside a window showing the problem */
.service-problem{grid-template-columns:minmax(0,5fr) minmax(0,6fr);grid-template-rows:auto auto 1fr;grid-template-areas:"eye sheet" "head sheet" "body sheet";gap:0 6vw;padding-top:120px;padding-bottom:120px;align-items:start}
.service-problem>.eyebrow{grid-area:eye}
.service-problem h2{grid-area:head;margin:22px 0 30px;font-size:var(--fs-h2);font-weight:600;letter-spacing:-.045em;line-height:1.05}
.service-problem>div:not(.w-issues){grid-area:body}
.service-problem>div>p:first-child{font-size:var(--fs-body);line-height:1.65;color:#5d5a68}
.service-problem .outcome{font-size:var(--fs-small);line-height:1.6}
.service-problem .outcome span{display:block;margin-bottom:8px;font:400 var(--fs-label)/1 ui-monospace,"SF Mono",Menlo,Consolas,monospace;letter-spacing:.1em;color:var(--svc)}
.service-problem>.w-issues{display:block;position:relative;grid-area:sheet;align-self:center}
.sheet{width:100%;border-collapse:collapse;font:400 13px/1 ui-monospace,"SF Mono",Menlo,Consolas,monospace;color:#16151c}
.sheet th{padding:10px 14px;background:#faf8f5;border-bottom:1px solid #ece9e3;text-align:left;font-weight:400;color:#8a8696}
.sheet td{padding:12px 14px;border-bottom:1px solid #f0ede8;white-space:nowrap;transition:background .35s,color .35s}
.sheet td:first-child,.sheet th:first-child{width:34px;padding-right:0;color:#b5b0bd;text-align:right}
.sheet td:first-child{background:#faf8f5}
.sheet tr.lit td:not(:first-child){background:#fbf0f2;color:#b4566b}
.sheet td.txt{text-align:left}
.service-problem .issues-note{display:flex;justify-content:space-between;gap:20px;margin:0;padding:14px 16px;font:400 13px/1.3 ui-monospace,"SF Mono",Menlo,Consolas,monospace;color:#8a8696}
.issues-k{white-space:nowrap}
.issues-msg{color:#b4566b;text-align:right}
.demo-chat{padding:20px 22px 6px}
.demo-chat .msg-user{margin:0 0 14px auto;max-width:85%;width:max-content;padding:11px 15px;border-radius:12px 12px 4px 12px;background:color-mix(in srgb,var(--svc) 9%,#fff);border:1px solid color-mix(in srgb,var(--svc) 25%,#e2ded7);font-size:15px;line-height:1.45;color:#16151c}
.service-problem .demo-answer{margin:0;padding:0 0 14px;font-size:16px;line-height:1.6;color:#16151c}
.checks{list-style:none;margin:0;padding:4px 0;border-top:1px solid #ece9e3}
.checks li{display:flex;justify-content:space-between;gap:16px;padding:11px 18px;font:400 13px/1.3 ui-monospace,"SF Mono",Menlo,Consolas,monospace;color:#16151c;transition:background .35s,color .35s}
.checks li b{font-weight:400;color:#8a8696;transition:color .35s}
.checks li.lit{background:#fbf0f2;color:#b4566b}.checks li.lit b{color:#b4566b}

/* ---- scope steps take turns, each showing what it leaves behind */
.scope-section{padding-top:120px;padding-bottom:120px}
.scope-grid article{position:relative;display:flex;flex-direction:column;overflow:hidden;padding:30px 30px 26px;transition:border-color .4s,box-shadow .4s}
.scope-grid article::before{content:"";position:absolute;left:0;top:0;height:2px;width:0;background:var(--svc)}
.scope-grid article.active{border-color:color-mix(in srgb,var(--svc) 35%,#e2ded7)}
.scope-grid article.active::before{animation:live-bar 2.6s linear forwards}
.scope-grid h3{font-size:var(--fs-h3);font-weight:600;letter-spacing:-.025em}
.scope-grid p{font-size:var(--fs-small);line-height:1.6;color:#5d5a68}
.step-out{display:block;margin-top:auto;padding-top:18px;border-top:1px dashed #e2ded7;font:400 13px/1.4 ui-monospace,"SF Mono",Menlo,Consolas,monospace;color:#8a8696;transition:color .4s}
.scope-grid article.active .step-out{color:var(--svc)}

/* ---- one verbatim quote, on its own */
.svc-quote{display:block;padding:20px max(6%,calc((100vw - 1450px)/2)) 120px}
.svc-quote .svc-proof{max-width:900px;margin:0 auto;padding-left:28px}
.svc-quote .svc-proof blockquote{font-size:32px;line-height:1.35;letter-spacing:-.01em;color:#16151c}
.svc-quote .svc-proof figcaption{margin-top:20px}
.svc-quote .svc-note{max-width:900px;margin:0 auto;padding:26px 30px;font-size:var(--fs-lead);line-height:1.45}
.svc-quote .svc-stat{max-width:900px;margin:0 auto;padding-left:28px;border-left:2px solid var(--svc);font-size:var(--fs-lead);line-height:1.45;color:#5d5a68}
.svc-quote .svc-stat b{display:block;margin-bottom:6px;font-size:56px;font-weight:600;letter-spacing:-.04em;line-height:1;color:var(--svc)}

/* ---- use cases and questions */
.usecases{padding-top:120px;padding-bottom:120px}
.usecases h2,.faq-section h2{font-size:var(--fs-h2);font-weight:600;letter-spacing:-.045em;line-height:1.05}
.usecase-grid h3{font-size:22px;font-weight:600;letter-spacing:-.02em}
.usecase-grid h3::before{content:"↳";margin-right:10px;color:var(--svc);font-weight:400}
.usecase-grid p{font-size:var(--fs-small);line-height:1.6;color:#5d5a68}
.faq-section{padding-top:120px;padding-bottom:110px}
.faq-list summary{font-size:var(--fs-body)}
.faq-list p{font-size:var(--fs-small);line-height:1.65;color:#5d5a68}

/* ---- the connected services, as cards in their own colours */
.related-strip{display:none}
.related-cards{display:grid;grid-template-columns:1fr 1fr;gap:22px;padding:0 max(6%,calc((100vw - 1450px)/2)) 120px}
.related-cards a{position:relative;display:flex;flex-direction:column;gap:26px;padding:30px 32px 34px;background:#fffefc;border:1px solid #e2ded7;border-radius:14px;box-shadow:0 1px 0 #fff inset,0 22px 46px -30px #2a254055;transition:transform .3s,box-shadow .3s,border-color .3s}
.related-cards a:hover{transform:translateY(-3px);border-color:color-mix(in srgb,var(--svc) 45%,#e2ded7);box-shadow:0 1px 0 #fff inset,0 30px 56px -30px #2a254066}
.rc-k{display:flex;align-items:center;gap:10px;font:400 var(--fs-label)/1 ui-monospace,"SF Mono",Menlo,Consolas,monospace;letter-spacing:.12em;text-transform:uppercase;color:#5d5a68}
.rc-k .svc-icon{width:18px;height:18px;color:var(--svc)}
.rc-k b{font-weight:500;color:var(--svc)}
.related-cards strong{font-size:var(--fs-h3);font-size:34px;font-weight:600;letter-spacing:-.04em;line-height:1.08;color:#16151c}
.related-cards strong em{font-family:'Newsreader',Georgia,serif;font-style:italic;font-weight:400;letter-spacing:-.01em;color:var(--svc)}
.rc-go{position:absolute;top:28px;right:30px;font-size:22px;color:#8a8696;transition:transform .2s,color .2s}
.related-cards a:hover .rc-go{transform:translate(3px,-3px);color:var(--svc)}
}
@media(min-width:0){
/* ---- steps and stages that take turns (inner.js adds .active) */
.approach-map article::before{content:"";position:absolute;left:0;top:0;height:2px;width:0;background:var(--svc,#5b4f9a)}
.principles .scope-grid article.active{border-color:color-mix(in srgb,#5b4f9a 35%,#e2ded7)}
.approach-map article.active::before{animation:live-bar 2.6s linear forwards}
.approach-map article{position:relative}
.approach-map article::before{top:-1px}
.map-number{transition:color .5s}
.approach-map article.active .map-number{color:#5b4f9a}
.approach-map article.active .artifact>span{color:#5b4f9a}
.approach-map article p:not(.eyebrow){font-size:var(--fs-body);line-height:1.65}
.artifact{font-size:var(--fs-small)}
.artifact>span{font-family:ui-monospace,"SF Mono",Menlo,Consolas,monospace;font-size:var(--fs-label);transition:color .5s}
.principles h2{font-size:var(--fs-h2);font-weight:600;letter-spacing:-.045em;line-height:1.05}
.principles .scope-grid article{position:relative;overflow:hidden}
.principles .scope-grid article::before{background:#5b4f9a}

/* ---- About: the recent work window replaces the dark art panel; Approach heads its stages */
.company-profile .profile-art{display:none}
.company-profile>.w-recent{display:block;position:relative;align-self:start}
.recent{list-style:none;margin:0;padding:6px 0}
.recent li{display:flex;align-items:center;gap:14px;padding:16px 22px;border-bottom:1px solid #f0ede8;font-size:var(--fs-body);color:#5d5a68;transition:background .4s}
.recent li .svc-icon{width:18px;height:18px;color:var(--svc)}
.recent li b{font-weight:600;color:#16151c}
.recent li.active{background:color-mix(in srgb,var(--svc) 7%,#fff)}
.company-profile p.recent-note{margin:0;padding:12px 22px 16px;font:400 13px/1.4 ui-monospace,"SF Mono",Menlo,Consolas,monospace;color:#8a8696}
.company-profile h2{font-size:var(--fs-h2);font-weight:600;letter-spacing:-.045em;line-height:1.05}
.company-profile p:not(.eyebrow):not(.recent-note){font-size:var(--fs-body);line-height:1.65;color:#5d5a68}
.about-head{max-width:820px;margin:0 0 70px}
.about-head h2{margin:22px 0 20px;font-size:var(--fs-h1);font-weight:600;letter-spacing:-.045em;line-height:1.04}
.about-head h2 em{font-family:'Newsreader',Georgia,serif;font-style:italic;font-weight:400;letter-spacing:-.01em;color:#5b4f9a}
.approach-map .about-head p:not(.eyebrow){margin:0;font-size:var(--fs-lead);line-height:1.55;color:#5d5a68}
.principles .expect-k{margin:80px 0 30px}
}
@media(min-width:0){
/* ---- engineering notes take their service colour */
.notes-list a[href*="evaluating-rag"]{--svc:var(--svc-rag)}.notes-list a[href*="document-ingestion"]{--svc:var(--svc-data)}.notes-list a[href*="bounded-workflows"]{--svc:var(--svc-agents)}
.notes-list a>span{color:var(--svc)}
.notes-list a>span::before{content:"";display:inline-block;width:7px;height:7px;margin-right:10px;border-radius:50%;background:var(--svc);vertical-align:1px}
.notes-list a h2{transition:color .2s}
.notes-list a:hover h2,.notes-list a:hover>b{color:var(--svc)}
body[class*="svc-"] .page-intro>.eyebrow{color:var(--svc)}
body[class*="svc-"] .article-body section .eyebrow{color:var(--svc)}
.article-body h2{font-weight:600;letter-spacing:-.035em}
.article-body p:not(.eyebrow):not(.article-byline){font-size:var(--fs-body)}
}
@media(min-width:0) and (prefers-reduced-motion:reduce){.scope-grid article.active::before{animation:none;width:100%}.related-cards a{transition:none}.related-cards a:hover{transform:none}}

/* ---- Work page: the five cases stacked, each with its live panel ---- */
.work-list{padding:70px max(6%,calc((100vw - 1450px)/2)) 110px}
.work-case{margin:0 0 56px}
.work-case .case-panel{display:none}
.work-case .case-label{margin:0 0 12px;font-size:14px;letter-spacing:.14em;text-transform:uppercase;color:var(--svc)}
.work-case h2{margin:0 0 12px;font-size:32px;font-weight:600;letter-spacing:-.035em;line-height:1.12}
.work-case .case-sub{margin:0 0 22px;font-size:17px;line-height:1.55;opacity:.8}
.work-case .case-metrics{display:grid;gap:14px;margin:0 0 20px}
.work-case .case-metrics dt{font-size:28px;font-weight:600;color:var(--svc)}
.work-case .case-metrics dd{margin:2px 0 0;font-size:15px;opacity:.75}
.work-case .case-stack{display:flex;flex-wrap:wrap;gap:8px;margin:0;padding:0;list-style:none;font-size:14px;opacity:.75}
.work-list .case-quote{margin:0 0 56px}
.work-list .case-quote blockquote{margin:0;font-family:'Newsreader',Georgia,serif;font-style:italic;font-size:22px;line-height:1.45}
.work-list .case-quote .q-mark{display:none}
.work-list .case-quote figcaption{margin-top:12px;font-size:14px;opacity:.75}
.work-list .case-quote figcaption b{margin-right:8px}
@media(min-width:0){
.work-list{padding-top:90px;padding-bottom:130px}
.work-case{margin:0 0 28px}
.work-case .case-panel{display:block}
.work-case .case-copy h2{margin:0 0 12px;font-size:clamp(28px,2.4vw,36px);font-weight:600;letter-spacing:-.035em;line-height:1.12;color:#16151c}
.work-case .case-sub{font-size:var(--fs-body);opacity:1}
.work-case .case-metrics{grid-template-columns:repeat(3,1fr);gap:0}
.work-case .case-metrics dd{opacity:1}
.work-case .case-stack{opacity:1}
.work-list .case-quote{margin:0 0 28px}
.work-list .case-quote .q-mark{display:block}
.work-list .case-quote figcaption{opacity:1}
}