/* Shared presentation for all seven case studies. Product UIs inside images/iframes keep their own styles. */
#route-content .experience{grid-template-columns:170px minmax(0,1fr)}
#route-content .experience time{white-space:nowrap}
@media(max-width:1000px){#route-content .experience{grid-template-columns:minmax(0,1fr);gap:10px}}
#route-content .skill-columns ul{list-style:disc;margin:0;padding-left:20px;font-size:16px;line-height:1.7}
#route-content .skill-columns li{margin-bottom:8px;padding-left:3px}
#route-content .eu-work-badge{background:transparent;border:0;border-radius:0;box-shadow:none;padding:0;cursor:default}
#route-content .cv-actions a[download]{display:inline-flex;align-items:center;justify-content:center;min-height:48px;background:#285d80;border-color:#285d80;color:#fff;text-decoration:none;font-weight:500}
#route-content .cv-actions a[download]:hover{background:#1b435f;border-color:#1b435f}
#route-content .cv-actions a[download]:focus-visible{outline:3px solid #82b7d7;outline-offset:4px}
.work-item[href="/work/ai-fluency/"] .work-cover{padding:0;background:#edf4f7}
.work-item[href="/work/ai-fluency/"] .work-cover img{width:100%;height:100%;max-height:none;object-fit:cover;object-position:center;transform:none}
#route-content>.route-toolbar{position:sticky;top:0;z-index:30;background:#fcfdfd;padding:16px 0;box-shadow:0 7px 12px #fcfdfd;margin-top:-16px}
#route-content .case-next{flex-wrap:wrap;gap:16px}
#route-content .case-next a{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:12px 24px;background:#285d80;color:#fff;border:1px solid #285d80;border-radius:28px;font-size:15px;font-weight:500;line-height:1.5;text-decoration:none;text-align:center;max-width:100%;transition:background .2s}
#route-content .case-next a:hover{background:#1b435f;border-color:#1b435f}
#route-content .case-next a:focus-visible{outline:3px solid #82b7d7;outline-offset:4px}
@media(max-width:760px){#route-content>.route-toolbar{top:calc(var(--reading-sidebar-height,140px) - 1px);padding:10px 0;margin-top:0}}
#route-content:has(.case-next){--case-title:40px;--case-heading:28px;--case-subheading:21px;--case-body:16px;--case-note:13px;--case-gap:60px;--case-panel:#edf4f7}
#route-content:has(.case-next) h1{font-size:var(--case-title);line-height:1.2;font-weight:500;letter-spacing:-.035em;margin:0 0 24px;text-align:left}
#route-content:has(.case-next) h2{font-size:var(--case-heading);line-height:1.35;font-weight:500;letter-spacing:-.025em;margin:0 0 22px;text-align:left}
#route-content:has(.case-next) h3{font-size:var(--case-subheading);line-height:1.4;font-weight:500;letter-spacing:-.015em;margin:0 0 16px;text-align:left}
#route-content:has(.case-next) p{font-size:var(--case-body)!important;line-height:1.8;letter-spacing:normal;text-align:left;max-width:76ch;margin:0 0 20px}
#route-content:has(.case-next) :is(.route-lead,.teacher-subtitle,.shopper-subtitle,.ai-deck,.lbai-deck){font-size:20px!important;line-height:1.6;max-width:68ch;margin:0 0 28px}
#route-content:has(.case-next) :is(.case-section,.ai-tool){margin:0 0 var(--case-gap)}
#route-content:has(.case-next) :is(.case-section li,.outcome-list li){font-size:var(--case-body);line-height:1.8}
#route-content:has(.case-next) :is(.case-meta,.admin-meta,.lbai-meta){display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;border:0;padding:0;margin:0 0 32px}
#route-content:has(.case-next) :is(.case-meta,.admin-meta,.lbai-meta)>div{grid-column:auto}
#route-content:has(.case-next) :is(.case-meta,.admin-meta,.lbai-meta) dt{font-size:var(--case-note);line-height:1.6;margin-bottom:5px}
#route-content:has(.case-next) :is(.case-meta,.admin-meta,.lbai-meta) dd{font-size:var(--case-body);line-height:1.7;margin:0}
#route-content .case-meta .case-team{list-style:disc;margin:0;padding-left:1.2em;font:inherit}
#route-content .case-meta .case-team li{margin:0;padding:0;font:inherit}
#route-content:has(.case-next) :is(.lbai-note,.ai-visual-context,.outcome-context,figcaption){font-size:var(--case-note)!important;line-height:1.7;max-width:90ch;margin:14px 0 24px}
/* Narrative always precedes the visual, with one common left edge. */
#route-content:has(.case-next) :is(.research-layout,.research-copy,.problem-context,.direction-layout,.workflow-intro,.teacher-research-layout,.shopper-research-copy,.shopper-design-row,.ai-intro-copy,.ai-copy-columns,.lbai-columns,.lbai-api){display:block;columns:auto;column-count:1;gap:0;text-align:left}
#route-content:has(.case-next) :is(.research-copy,.ai-ticket-copy,.shopper-design-copy){max-width:76ch;margin:0 0 26px}
#route-content:has(.case-next) :is(.research-copy,.problem-context,.teacher-after-launch,.teacher-research-layout) p+p{margin-top:0}
#route-content:has(.case-next) .workflow-intro{margin-bottom:24px}
#route-content:has(.case-next) .shopper-design-row{margin:32px 0 48px}
#route-content:has(.case-next) .shopper-design-copy p{margin-bottom:24px}
/* Single text sections use the page background. */
#route-content:has(.case-next) :is(.case-project-summary,.admin-outcomes,.ai-intro,.lbai-intro,#reflection,.lbai-next,.direction-decision,.lbai-research,.ai-key-detail,.lbai-detail,.admin-workflow,.teacher-question,.case-next){background:transparent;border:0;box-shadow:none;border-radius:0;padding:0}
#route-content:has(.case-next) :is(.case-project-summary,.ai-intro,.lbai-intro){margin-bottom:var(--case-gap);overflow:visible}
#route-content:has(.case-next) :is(#reflection,.lbai-next){margin-bottom:var(--case-gap)}
#route-content:has(.case-next) :is(.lbai-research,.ai-key-detail,.lbai-detail){margin:24px 0}
#route-content:has(.case-next) .admin-workflow{margin:32px 0 48px}
#route-content:has(.case-next) .case-next{padding-top:12px;margin-top:36px}
/* Remove decorative overlines; status and data labels remain meaningful. */
#route-content:has(.case-next) :is(.ai-eyebrow,.lbai-kicker,.shopper-step,.ai-feature-label,.lbai-research>span,.lbai-detail>span,.ai-key-detail>span,.lbai-measures>div>span,.lbai-next>.lbai-status){display:none}
#route-content:has(.case-next) .shopper-concept-label{background:none;padding:0;border-radius:0;font-size:var(--case-note);margin:0 0 20px}
/* Panels distinguish multiple related items, not an entire section. */
#route-content:has(.case-next) :is(.order-types,.admin-metrics,.teacher-testing-notes,.workflow-notes,.lbai-measures,.shopper-testing){gap:24px}
#route-content:has(.case-next) :is(.order-types>.workflow-detail,.admin-metrics>div,.workflow-notes>div,.teacher-complexity>div,.lbai-measures>div,.shopper-testing>div){background:var(--case-panel);border:0;border-radius:12px;padding:24px;box-shadow:none}
#route-content:has(.case-next) .shopper-testing>div{padding:0}
#route-content:has(.case-next) :is(.order-types,.workflow-notes,.lbai-measures) p{margin:0;max-width:none}
#route-content:has(.case-next) :is(.admin-metrics strong,.shopper-results strong){font-size:32px;line-height:1.2;font-weight:500;letter-spacing:-.02em}
#route-content:has(.case-next) .admin-metrics span{font-size:var(--case-body);line-height:1.6}
#route-content:has(.case-next) :is(.admin-metrics small,.shopper-results p span){font-size:var(--case-note);line-height:1.6}
#route-content:has(.case-next) .shopper-results{background:none;margin:26px 0 0;padding:0;gap:24px}
#route-content:has(.case-next) .shopper-results>div{background:var(--case-panel);border-radius:12px;padding:24px}
#route-content:has(.case-next) .shopper-results p{margin:0}
#route-content:has(.case-next) .shopper-hero{margin:28px 0 0;border-radius:12px}
/* Screens are uncropped. Grouped mockups retain their deliberate composition. */
#route-content:has(.case-next) :is(.admin-figure,.teacher-research-map,.ai-wide-visual,.ai-ticket-visual,.lbai-visual){background:transparent;padding:0;border:0;box-shadow:none;margin:28px 0}
#route-content:has(.case-next) .ai-ticket-visual{max-width:420px}
#route-content .ai-tool-index a{display:grid;grid-template-columns:22px minmax(0,1fr);gap:12px;justify-content:start;text-align:left}
#route-content .ai-tool-index a>span:last-child{margin-left:0;min-width:0;text-align:left}
#route-content .ai-ticket-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(240px,36%);gap:clamp(24px,4vw,56px);align-items:start}
#route-content .ai-ticket-layout .ai-ticket-copy{margin:0;min-width:0}
#route-content .ai-ticket-layout .ai-ticket-visual{width:100%;margin:0;justify-self:end}
@media(max-width:900px){#route-content .ai-ticket-layout{grid-template-columns:1fr;gap:28px}#route-content .ai-ticket-layout .ai-ticket-visual{justify-self:start}}
#route-content:has(.case-next) .teacher-research-map img{max-height:none}
#route-content:has(.case-next) .shopper-design-screens:has(> :only-child){background:transparent;padding:0;justify-content:flex-start}
#route-content:has(.case-next) :is(.ai-report-controls button,.case-next a,.route-toolbar a){font-size:14px}
@media(max-width:1100px){#route-content:has(.case-next) :is(.admin-metrics,.order-types,.workflow-notes,.lbai-measures){grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:760px){
 #route-content:has(.case-next){--case-title:34px;--case-heading:26px;--case-subheading:20px;--case-body:15px;--case-gap:44px}
 #route-content:has(.case-next) :is(.route-lead,.teacher-subtitle,.shopper-subtitle,.ai-deck,.lbai-deck){font-size:18px!important}
 #route-content:has(.case-next) :is(.case-meta,.admin-meta,.lbai-meta){grid-template-columns:1fr;gap:16px}
 #route-content:has(.case-next) :is(.order-types,.workflow-notes,.lbai-measures,.shopper-testing){grid-template-columns:1fr}
 #route-content:has(.case-next) :is(.admin-metrics>div,.shopper-results>div,.lbai-measures>div,.order-types>.workflow-detail){padding:18px}
 #route-content:has(.case-next) .admin-metrics strong{font-size:28px}
 #route-content:has(.case-next) .shopper-results{grid-template-columns:1fr}
}

/* Technology logos remain ordinary HTML content, including without JavaScript. */
#route-content .ai-stack{margin:-8px 0 26px;max-width:100%}
#route-content .ai-stack-label{display:block;margin:0 0 10px;color:#547186;font-size:12px;line-height:1.5;font-weight:500}
#route-content .ai-stack-list{display:flex;flex-wrap:wrap;gap:8px 10px;list-style:none;padding:0;margin:0}
#route-content .ai-case .ai-stack-list li{display:inline-flex;align-items:center;gap:8px;margin:0;padding:8px 11px;border:1px solid #d5e2ea;border-radius:8px;background:#f4f8fa;color:#294c64;font-size:13px;line-height:1.4;white-space:nowrap}
#route-content .ai-case .ai-stack-list li::before{content:none}
#route-content .ai-stack-list img{display:block;flex:0 0 20px;width:20px;height:20px;object-fit:contain}
@media(max-width:600px){#route-content .ai-stack{margin-bottom:22px}#route-content .ai-stack-list{gap:8px}#route-content .ai-case .ai-stack-list li{padding:7px 9px;font-size:12px}}