/* Readable solution narratives and differentiated visual summaries. */
:root{--muted:#526076}
body{font-size:16px}
.hero h1{font-size:56px;line-height:1.25;letter-spacing:-2px}
.hero-description{font-size:18px;line-height:1.9}
.eyebrow{font-size:13px;letter-spacing:1px}
.hero .button{font-size:16px}
.carousel-heading{font-size:14px}
#carousel-toggle{font-size:13px}
.solution-illustration{display:block;width:100%;height:100%;stroke:none}
.case-cover .solution-illustration,.featured-image .solution-illustration{width:100%;height:100%}
.featured-caption>div>span{font-size:14px}
.featured-caption h2{font-size:24px}
.case-body{padding:23px}
.card-kicker{font-size:13px}
.case-body h3{font-size:22px;font-weight:700;margin-block:12px}
.case-body>p{font-size:15px;line-height:1.85;color:var(--muted)}
.featured-badge{font-size:13px;left:14px;top:12px;padding:3px 10px}
.filter-label,.filter-button{font-size:13px}
.search-box input{font-size:16px}
.filter-line{margin-top:9px}
.nav-link{font-size:16px}
.breadcrumb{font-size:13px}
#results-count{font-size:14px}
/* A single reading column leads from explanation into the full-width demo. */
#case-detail{max-width:1080px;margin:auto}
.detail-heading{max-width:980px;margin-bottom:27px}
.detail-heading h1{font-size:44px;line-height:1.35;margin-block:15px}
.detail-heading .lead{font-size:20px;line-height:1.8;color:var(--ink);max-width:940px}
.solution-audience{display:flex;align-items:baseline;gap:15px;font-size:15px;color:var(--muted);margin-top:19px}
.solution-audience strong{font-size:14px;font-weight:600;flex-shrink:0}
.solution-nav{display:flex;gap:28px;border-bottom:1px solid var(--rule);padding:12px 0 17px;margin-bottom:0;overflow-x:auto}
.solution-nav a{font-size:15px;white-space:nowrap;color:var(--muted)}
.solution-nav a:hover{color:var(--accent)}
.solution-section{padding-top:42px;scroll-margin-top:25px}
.section-title{display:flex;gap:14px;align-items:baseline;margin-bottom:23px}
.section-title>span{font-size:13px;color:var(--accent);letter-spacing:1px;flex-shrink:0}
.section-title h2{font-size:28px;letter-spacing:-.5px;line-height:1.5}
.pain-grid{display:grid;grid-template-columns:1fr 1fr;gap:19px}
.pain-card{padding:24px 26px;background:var(--surface);border:1px solid var(--rule);border-radius:12px}
.pain-card h3{font-size:19px;line-height:1.6;margin-bottom:9px}
.pain-card p{font-size:16px;line-height:1.95;color:var(--muted)}
.solution-value{display:grid;grid-template-columns:90px 1fr;gap:20px;padding:21px 26px;margin-top:18px;background:var(--accent-soft);border-radius:10px}
.solution-value>span{color:var(--accent);font-size:15px;font-weight:700;padding-top:2px}
.solution-value>p{font-size:17px;color:var(--ink);line-height:1.95}
.solution-instructions{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:26px}
.solution-instructions li{border-top:2px solid var(--rule);padding-top:18px;min-width:0}
.instruction-number{display:grid;place-items:center;width:32px;height:32px;border-radius:9px;background:var(--accent-soft);color:var(--accent);font-size:15px;font-weight:700;margin-bottom:13px}
.solution-instructions h3{font-size:18px;line-height:1.7;margin-bottom:8px}
.solution-instructions p{font-size:16px;line-height:1.95;color:var(--muted)}
.skill-download{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:21px 25px;border:1px solid var(--rule);background:var(--surface);border-radius:10px;margin-top:23px}
.skill-download strong{font-size:17px}
.skill-download p{font-size:15px;color:var(--muted);margin-top:5px}
.skill-download .button{font-size:15px;white-space:nowrap}
.prompt-details{margin-top:20px}
.prompt-details summary{font-size:15px;color:var(--ink)}
.prompt-header{font-size:14px}
.copy-button{font-size:14px;padding:6px 12px}
.prompt-block pre{font-size:16px}
.experience-heading{align-items:center;margin-bottom:12px}
.experience-heading .section-title{margin-bottom:0}
.experience-heading h2{font-size:28px}
.demo-label{font-size:13px;white-space:normal}
.experience-context{font-size:16px;color:var(--muted);line-height:1.9;margin-bottom:19px}
.experience-outcome{display:flex;align-items:baseline;gap:20px;margin-top:20px;padding:20px 23px;background:var(--surface);border:1px solid var(--rule);border-radius:10px}
.experience-outcome strong{font-size:16px;white-space:nowrap}
.experience-outcome p{font-size:16px;color:var(--muted);line-height:1.9}
.boundary-list{margin:0;padding-left:23px}
.boundary-list li{font-size:16px;color:var(--muted);line-height:1.95;margin-bottom:12px;padding-left:5px}
.boundary-list li::marker{color:var(--accent)}
.solution-sources{display:flex;align-items:center;flex-wrap:wrap;gap:13px 24px;margin-top:23px;padding-top:20px;border-top:1px solid var(--rule)}
.solution-sources>span{font-size:15px;color:var(--muted);font-weight:600}
.solution-sources a{font-size:15px;color:var(--accent)}
.solution-sources small{width:100%;font-size:14px;color:var(--muted)}
.detail-bottom{font-size:15px;margin-top:32px}
/* Demo content is read at normal size, with metadata one level below it. */
.demo-topbar{font-size:16px}
.demo-local,.demo-topbar button{font-size:13px}
.demo-progress li{font-size:14px}
.demo-progress li>span{font-size:13px;width:28px;height:28px}
.demo-input,.demo-output{padding:27px}
.role-label{font-size:13px;letter-spacing:.5px}
.demo-input>h3,.demo-output h3{font-size:24px;line-height:1.6}
.demo-input label,.demo-output label{font-size:15px}
.demo-app input:not([type=checkbox]):not([type=radio]),.demo-app textarea,.demo-app select,.batch-preview input{font-size:16px}
.demo-app .button.small,.garment-demo .button.small{font-size:15px;min-height:44px}
.field-help,.output-caption,.demo-footnote{font-size:14px}
.demo-empty h3{font-size:22px}
.demo-empty p{font-size:16px}
.linked-data>span,.knowledge-card>span{font-size:13px}
.linked-data>strong,.knowledge-card>strong{font-size:16px}
.linked-data p,.knowledge-card p{font-size:15px}
.ticket-heading,.compact-fields{font-size:15px}
.status-pill{font-size:13px}
.demo-input>p:not(.role-label):not(.field-help){font-size:16px}
.automation-note{font-size:15px}
.notification-app{font-size:13px}
.notification-card h4,.receipt h4{font-size:22px}
.notification-card p,.receipt>p{font-size:15px}
.notification-card blockquote,.receipt blockquote{font-size:16px}
.demo-chips span{font-size:14px}
.conversation-option>span{font-size:16px}
.conversation-option small,.source-option small{font-size:13px}
.insight-item p,.insight-item>strong{font-size:16px}
.topic-groups strong{font-size:37px}
.topic-groups small{font-size:14px}
.topic-groups>div>span{font-size:16px}
.action-card>span{font-size:14px}
.action-card h4{font-size:18px}
.action-card p{font-size:15px}
.demo-app th,.demo-app td,.garment-demo th,.garment-demo td{font-size:14px}
.demo-app th,.garment-demo th{font-weight:600}
.customer-list strong,.customer-note,.choice-stack button{font-size:16px}
.customer-list small{font-size:14px}
.inline-success{font-size:15px}
.rate-compare small,.quote-card>span{font-size:14px}
.output-card>p,.quote-card blockquote{font-size:16px}
.document-preview>span{font-size:14px}
.document-preview h4{font-size:17px}
.document-preview p{font-size:16px}
.file-result h4,.source-option strong{font-size:17px}
.file-result p,.challenge-question span{font-size:14px}
.paper-tally span,.tally-confirm legend{font-size:15px}
.resume-preview strong{font-size:15px}
.resume-preview p{font-size:16px}
.garment-tabs button{font-size:15px}
.garment-images figcaption strong{font-size:17px}
.garment-images figcaption p,.garment-zoom>span,.image-note{font-size:14px}
.batch-preview h3{font-size:24px}
.image-dialog>p,.dialog-close{font-size:15px}
.platform-queue{list-style:none;padding:0;margin:20px 0}
.platform-queue li{display:flex;align-items:center;gap:14px;border:1px solid var(--rule);border-radius:9px;padding:17px;margin-bottom:12px;background:var(--surface)}
.platform-queue li>span{width:29px;height:29px;display:grid;place-items:center;border-radius:50%;background:var(--bg);color:var(--muted);font-size:14px;flex-shrink:0}
.platform-queue strong{font-size:16px}
.platform-queue p{font-size:14px;color:var(--muted);margin-top:4px}
.platform-queue .complete{border-color:var(--success)}
.platform-queue .complete>span{background:var(--success-soft);color:var(--success)}
.platform-queue .active{border-color:var(--accent)}
.platform-queue .active>span{background:var(--accent-soft);color:var(--accent)}
.capture-path{display:flex;align-items:center;flex-wrap:wrap;gap:10px;font-size:14px;margin-bottom:18px}
.capture-path span{background:var(--accent-soft);padding:9px 11px;border-radius:6px}
.trial-note{background:var(--accent-soft);border-radius:9px;padding:17px;margin-top:18px}
.trial-note strong{font-size:16px;line-height:1.8}
.trial-note p{font-size:15px;color:var(--muted);line-height:1.95;margin-top:7px}
.guide-heading p,.guide-section>p,.guide-resource p{font-size:16px}
.guide-resource h3{font-size:17px}
.usage-list h3,.usage-list p{font-size:16px}
.usage-list>div>span{font-size:13px}
@media(max-width:1100px){
  .hero h1{font-size:48px}
  .pain-card{padding:22px}
  .solution-instructions{gap:21px}
}
@media(max-width:820px){
  .hero h1{font-size:40px}
  .hero-description{font-size:16px}
  .featured-caption h2{font-size:21px}
  .solution-instructions{grid-template-columns:1fr}
  .solution-instructions li{display:grid;grid-template-columns:34px 1fr;gap:4px 15px;padding-top:20px}
  .solution-instructions .instruction-number{grid-row:1/3;margin-bottom:0}
  .solution-instructions p{grid-column:2}
  .pain-grid{gap:14px}
  .experience-outcome{flex-direction:column;gap:7px}
}
@media(max-width:600px){
  .hero h1{font-size:43px;letter-spacing:-1.5px}
  .hero-description{font-size:16px;line-height:1.95}
  .hero .eyebrow{font-size:12px}
  .hero .button{font-size:15px}
  .case-body h3{font-size:22px}
  .case-body>p{font-size:15px}
  .nav-link{font-size:14px}
  .filter-button,.filter-label,.card-kicker{font-size:12px}
  .breadcrumb{font-size:12px}
  .detail-heading h1{font-size:32px;line-height:1.45}
  .detail-heading .lead{font-size:18px;line-height:1.9}
  .detail-heading .eyebrow{font-size:12px}
  .solution-audience{font-size:14px;flex-direction:column;gap:3px}
  .solution-nav{gap:19px;padding-bottom:14px}
  .solution-nav a{font-size:14px}
  .solution-section{padding-top:31px}
  .section-title{gap:10px;margin-bottom:18px}
  .section-title h2,.experience-heading h2{font-size:23px}
  .section-title>span{font-size:12px}
  .pain-grid{grid-template-columns:1fr}
  .pain-card{padding:20px}
  .pain-card h3{font-size:18px}
  .pain-card p,.solution-instructions p{font-size:16px}
  .solution-value{grid-template-columns:1fr;gap:7px;padding:19px 20px}
  .solution-value>p{font-size:16px}
  .solution-instructions h3{font-size:18px}
  .skill-download{flex-direction:column;align-items:flex-start;gap:16px;padding:20px}
  .skill-download .button{width:100%}
  .experience-heading{flex-wrap:wrap;gap:10px}
  .experience-context{font-size:15px}
  .demo-label{font-size:12px}
  .boundary-list li,.experience-outcome p{font-size:15px}
  .solution-sources small{font-size:13px}
  .detail-bottom{font-size:14px}
  .demo-topbar{font-size:14px}
  .demo-topbar button{font-size:13px}
  .demo-progress li{font-size:12px}
  .demo-progress li>span{font-size:12px;width:25px;height:25px}
  .demo-input,.demo-output{padding:21px}
  .demo-input>h3,.demo-output h3{font-size:22px}
  .demo-input label,.demo-output label{font-size:15px}
  .demo-app input:not([type=checkbox]):not([type=radio]),.demo-app textarea,.demo-app select{font-size:16px}
  .demo-footnote,.field-help,.output-caption{font-size:13px}
  .demo-app th,.demo-app td,.garment-demo th,.garment-demo td{font-size:14px}
  .garment-tabs button{font-size:14px}
  .batch-preview h3{font-size:21px}
  .guide-resource h3,.guide-section>p{font-size:16px}
}
/* Shared chapter navigation and clear section boundaries for every solution. */
body[data-page="case"] #case-detail{max-width:none}
.solution-return-bar{gap:17px;margin-bottom:34px;padding-top:24px}
.solution-return-bar .return-library{display:inline-flex;align-items:center;gap:11px;min-height:45px;padding:9px 16px;background:var(--accent);border:1px solid var(--accent);border-radius:8px;color:var(--surface);font-size:16px;font-weight:700}
.solution-return-bar .return-library:hover{background:var(--accent-hover);color:var(--surface)}
.solution-return-bar .return-home{font-size:16px;font-weight:600;color:var(--ink);border-bottom:1px solid var(--rule)}
.solution-return-bar .return-home:hover{color:var(--accent)}
.solution-return-bar #breadcrumb-title{font-size:14px;color:var(--muted);border-left:1px solid var(--rule);padding-left:17px}
.solution-layout{display:grid;grid-template-columns:202px minmax(0,1fr);gap:34px;align-items:start}
.solution-sidebar{position:sticky;top:26px;align-self:start;border:1px solid var(--rule);border-radius:13px;padding:21px 14px 15px;background:var(--surface)}
.toc-heading{font-size:14px;font-weight:700;color:var(--muted);padding:0 12px;margin-bottom:16px}
.toc-toggle{display:none}
.solution-sidebar .solution-nav{display:flex;flex-direction:column;gap:7px;overflow:visible;border:0;padding:0;margin:0}
.solution-sidebar .solution-nav a{display:flex;align-items:center;gap:12px;padding:13px 12px;border-radius:8px;color:var(--muted);font-size:16px;font-weight:500}
.solution-sidebar .solution-nav a:hover{color:var(--accent);background:var(--bg)}
.solution-sidebar .solution-nav a[aria-current="location"]{color:var(--accent);background:var(--accent-soft);font-weight:700;box-shadow:inset 3px 0 var(--accent)}
.toc-number{font-size:12px;letter-spacing:.6px;opacity:.8;flex-shrink:0}
.toc-return{display:block;font-size:14px;color:var(--accent);font-weight:600;margin:19px 9px 0;padding-top:16px;border-top:1px solid var(--rule)}
.solution-body{min-width:0}
.solution-body .detail-heading{padding:1px 0 6px;margin-bottom:24px}
.solution-body .detail-heading h1{font-size:42px}
.solution-body .solution-section{padding:29px 30px;margin-top:28px;border:1px solid var(--rule);border-radius:15px;background:var(--surface);scroll-margin-top:26px}
.solution-body .section-title{align-items:center;gap:18px;margin-bottom:24px;padding-bottom:21px;border-bottom:2px solid #e5eaf5}
.solution-body .section-title>span{display:grid;place-items:center;width:48px;height:48px;flex-shrink:0;border-radius:10px;background:var(--accent);color:var(--surface);font-size:21px;font-weight:700;letter-spacing:0}
.solution-body .section-title h2{font-size:29px;font-weight:700;line-height:1.5;letter-spacing:-.6px;min-width:0}
.solution-body .pain-card{padding:21px;background:var(--bg);border-color:#e7ebf1}
.solution-body .experience-heading{padding-bottom:21px;margin-bottom:19px;border-bottom:2px solid #e5eaf5;flex-wrap:wrap;gap:14px}
.solution-body .experience-heading .section-title{border:0;padding:0;margin:0}
.solution-body .demo-label{margin-left:66px}
.solution-body .solution-instructions{gap:20px}
.solution-body .solution-instructions li{border-top:0;padding-top:0}
.solution-body .skill-download{background:var(--bg)}
.solution-body .detail-bottom{margin-top:28px}
@media(min-width:1001px) and (max-width:1180px){
  .solution-layout{grid-template-columns:184px minmax(0,1fr);gap:26px}
  .solution-body .solution-section{padding:25px}
  .solution-body .section-title h2{font-size:27px}
  .solution-body .demo-workspace{grid-template-columns:1fr}
  .solution-body .demo-input{border-right:0;border-bottom:1px solid var(--rule)}
  .solution-body .demo-output{min-height:280px}
  .solution-body .solution-instructions{grid-template-columns:1fr}
  .solution-body .solution-instructions li{display:grid;grid-template-columns:34px 1fr;gap:4px 15px}
  .solution-body .solution-instructions .instruction-number{grid-row:1/3;margin-bottom:0}
  .solution-body .solution-instructions p{grid-column:2}
}
@media(max-width:1000px){
  .solution-layout{display:block}
  .solution-sidebar{top:0;z-index:20;display:flex;align-items:center;padding:0 14px;border-radius:10px;margin-bottom:25px;box-shadow:0 4px 14px rgba(35,48,79,.06)}
  .toc-heading{display:none}
  .toc-toggle{display:flex;align-items:center;justify-content:space-between;gap:12px;border:0;background:none;min-height:62px;padding:10px 0;color:var(--ink);text-align:left;flex:1;min-width:0;font-size:14px;font-weight:700}
  .toc-toggle>span:first-child{display:flex;align-items:baseline;gap:14px;flex-wrap:wrap;min-width:0}
  .toc-current{color:var(--accent);font-size:14px}
  .toc-chevron{font-size:20px;color:var(--accent);padding-right:13px;transition:transform .15s}
  .solution-sidebar[data-expanded="true"] .toc-chevron{transform:rotate(180deg)}
  .solution-sidebar .solution-nav{display:none;position:absolute;left:-1px;right:-1px;top:calc(100% - 1px);padding:11px 14px 15px;background:var(--surface);border:1px solid var(--rule);border-top:0;border-radius:0 0 10px 10px;box-shadow:0 15px 25px rgba(35,48,79,.1)}
  .solution-sidebar[data-expanded="true"]{border-radius:10px 10px 0 0}
  .solution-sidebar[data-expanded="true"] .solution-nav{display:flex}
  .solution-sidebar .toc-return{margin:0;padding:5px 0 5px 13px;border-top:0;border-left:1px solid var(--rule);font-size:13px;white-space:nowrap}
  .solution-body .solution-section{scroll-margin-top:88px}
  .solution-body .demo-output{scroll-margin-top:88px}
  .solution-body .detail-heading{padding-top:5px}
  .solution-return-bar{margin-bottom:23px}
}
@media(max-width:600px){
  .solution-return-bar{gap:14px;margin-bottom:20px;padding-top:18px}
  .solution-return-bar .return-library{font-size:15px;min-height:44px;padding:9px 13px;gap:8px}
  .solution-return-bar .return-home{font-size:15px}
  .solution-return-bar #breadcrumb-title{flex-basis:100%;border:0;padding:0;font-size:13px}
  .solution-sidebar{margin-bottom:24px;padding-inline:12px}
  .toc-toggle{min-height:61px;font-size:13px}
  .toc-toggle>span:first-child{gap:2px;flex-direction:column}
  .toc-current{font-size:13px}
  .solution-sidebar .solution-nav a{font-size:16px}
  .solution-body .detail-heading h1{font-size:32px}
  .solution-body .detail-heading{margin-bottom:23px}
  .solution-body .solution-section{padding:22px 18px;margin-top:23px;border-radius:12px}
  .solution-body .section-title{gap:13px;padding-bottom:18px;margin-bottom:20px;align-items:flex-start}
  .solution-body .section-title>span{width:39px;height:39px;font-size:18px;border-radius:8px}
  .solution-body .section-title h2{font-size:23px;line-height:1.55;padding-top:1px}
  .solution-body .pain-card{padding:18px}
  .solution-body .experience-heading{gap:11px;padding-bottom:18px}
  .solution-body .demo-label{margin-left:52px}
  .solution-body .demo-input,.solution-body .demo-output{padding:18px}
  .solution-body .demo-topbar{padding-inline:14px}
  .solution-body .demo-progress{gap:4px;padding-inline:8px}
  .solution-body .demo-progress li{font-size:11px}
  .solution-body .garment-tabs{padding-inline:13px;gap:17px}
  .solution-body .garment-tabs button{font-size:13px}
  .solution-body #garment-panel{padding:13px}
  .solution-body .garment-zoom{height:320px}
  .solution-body .garment-images.solo .garment-zoom{height:440px}
  .solution-body .skill-download{padding:18px}
}
@media print{
  .solution-return-bar,.solution-sidebar{display:none!important}
  .solution-layout{display:block}
  .solution-body .solution-section{break-inside:auto;box-shadow:none}
  .solution-body .section-title{break-after:avoid}
}
