.showcase-page [hidden]{display:none!important}
.showcase-page .showcase-hero{display:block;padding-block:var(--hero-top) var(--hero-bottom);background:#0B1F2E;background-image:linear-gradient(120deg,#0B1F2E,#16324A,#00687D);color:#FFFFFF;--muted:#B8C7D4;--line:rgba(255,255,255,.18);--focus:#A8EFD2}
.showcase-hero-copy{min-width:0;text-align:center}
.showcase-hero-copy>.c-kicker{margin-inline:auto;margin-bottom:var(--space-4);align-self:center}
.showcase-page .showcase-hero h1{color:#FFFFFF;font-size:clamp(2.25rem,4vw,3rem);line-height:var(--lh-heading)}
.showcase-hero-copy>.showcase-hero-lead{max-width:var(--container-narrow);margin-inline:auto;margin-top:var(--space-4);color:#FFFFFF;font-size:var(--text-md)}
.showcase-hero-copy>.showcase-hero-note{max-width:var(--container-narrow);margin-inline:auto;margin-top:var(--space-3);color:#B8C7D4;font-size:var(--text-sm)}
.showcase-hero-copy>.c-actions{justify-content:center;margin-top:var(--space-action)}
.showcase-hero-copy>.showcase-hero-foot{max-width:var(--container-narrow);margin-inline:auto;margin-top:var(--space-action);color:#B8C7D4;font-size:var(--text-sm)}
.showcase-page .showcase-on-dark{background:transparent;color:#FFFFFF;border-color:rgba(255,255,255,.45)}
.showcase-page .showcase-on-dark:hover{background:#FFFFFF;color:#0B1F2E;border-color:#FFFFFF}
.showcase-workflows{background:#F4F5F2;color:#1F2933;--muted:#56616A;--line:#E3E7EB}
.showcase-section-head{margin-bottom:var(--space-6);text-align:center}
.showcase-section-head>.c-kicker{margin-inline:auto;margin-bottom:var(--space-4)}
.showcase-section-head>h2{color:#1F2933}
.showcase-section-head>p{max-width:var(--container-narrow);margin-inline:auto;margin-top:var(--space-3);color:#53616D}
.showcase-cards{align-items:stretch}
.c-usecase-cards>.showcase-workflow{display:flex;flex-direction:column;align-items:stretch;gap:var(--space-4);height:100%;min-width:0;padding:var(--space-5);background:#FFFFFF;color:#1F2933;--ink:#1F2933;--muted:#53616D;--line:#E3E7EB;border-radius:var(--r-md)}
.showcase-card-head{display:grid;align-content:start;gap:var(--space-2);min-width:0}
.showcase-case-label{color:#53616D;font-size:var(--text-xs);font-weight:var(--weight-bold);line-height:var(--lh-small)}
.showcase-card-head>h3{color:#1F2933;font-size:var(--text-lg);line-height:var(--lh-heading)}
.showcase-card-head>p{color:#53616D}
.showcase-recommendation{display:grid;gap:var(--space-2);min-width:0;padding:var(--space-4);border-radius:var(--r-md);background:#E7EDF3;color:#1B2A3A;--muted:#465768;--line:#E3E7EB}
.showcase-recommendation>strong{font-family:var(--font-heading);font-size:var(--text-base);line-height:var(--lh-heading);color:#1B2A3A}
.showcase-workflow .showcase-recommendation>p{color:#465768;font-size:var(--text-sm)}
.showcase-flow{display:grid;gap:var(--space-3);margin:0;padding-inline-start:var(--space-4)}
.showcase-flow>li{min-width:0;padding-inline-start:var(--space-1);color:#1F2933}
.showcase-flow>li::marker{color:#53616D;font-family:var(--font-mono);font-size:var(--text-sm)}
.showcase-flow strong{display:block;font-size:var(--text-base);line-height:var(--lh-heading);color:#1F2933}
.showcase-flow p{margin-top:var(--space-2);color:#53616D}
.showcase-boundary{display:grid;gap:var(--space-2);min-width:0;padding:var(--space-4);border-radius:var(--r-md);background:#F3EEE5;color:#2E2A24;--muted:#645B50;--line:#E3E7EB}
.showcase-boundary>strong{color:#2E2A24;font-size:var(--text-sm)}
.showcase-workflow .showcase-boundary>p{color:#645B50;font-size:var(--text-sm)}
.showcase-workflow>.showcase-prerequisite{color:#53616D;font-size:var(--text-sm)}
.showcase-workflow>.c-btn{margin-top:auto;align-self:stretch}
.showcase-reference{background:#E7EDF3;color:#1B2A3A;--muted:#465768;--line:#E3E7EB}
.showcase-reference .showcase-section-head>h2{color:#1B2A3A}
.showcase-reference .showcase-section-head>p{color:#465768}
.showcase-reference .c-table{min-width:760px}
.showcase-reference-note{margin-top:var(--space-4);color:#465768;font-size:var(--text-sm)}
.showcase-reference-actions{margin-top:var(--space-action)}
.showcase-section-head~.showcase-reference-actions{justify-content:center}
.showcase-scheduling{background:#FFFFFF;color:#1F2933;--muted:#53616D;--line:#E3E7EB}
.showcase-boards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:stretch;gap:var(--space-4)}
.showcase-board{display:flex;flex-direction:column;min-width:0;height:auto;border-radius:var(--r-md);overflow:hidden;background:#F4F5F2;color:#1F2933;--muted:#56616A;--line:#E3E7EB}
.showcase-board-heading{display:grid;gap:var(--space-2);padding:var(--space-4);background:#16324A;color:#FFFFFF;--muted:#B8C7D4;--line:rgba(255,255,255,.18)}
.showcase-board-heading>strong{font-family:var(--font-heading);font-size:var(--text-lg);line-height:var(--lh-heading);color:#FFFFFF}
.showcase-board-heading>span{color:#B8C7D4;font-size:var(--text-sm)}
.showcase-board-body{display:flex;flex-direction:column;gap:var(--space-3);flex:1;min-width:0;padding:var(--space-4)}
.showcase-board-axis{display:grid;grid-template-columns:7rem repeat(4,minmax(0,1fr));gap:var(--space-2);color:#56616A;font-size:var(--text-xs)}
.showcase-board-axis>span{min-width:0;text-align:center}
.showcase-board-axis>span:first-child{text-align:start}
.showcase-lane{display:grid;grid-template-columns:7rem minmax(0,1fr);align-items:center;gap:var(--space-2);min-width:0}
.showcase-lane>.mono{min-width:0;color:#1F2933;font-size:var(--text-xs);overflow-wrap:break-word}
.showcase-track{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));align-items:stretch;gap:var(--space-2);min-width:0}
.showcase-task{display:flex;align-items:center;justify-content:center;min-width:0;padding:var(--space-2);border-radius:var(--r-sm);font-size:var(--text-xs);line-height:var(--lh-small);text-align:center;overflow-wrap:break-word}
.showcase-task--build{background:#00687D;color:#FFFFFF;--muted:#FFFFFF;--line:rgba(255,255,255,.18)}
.showcase-task--check{background:#E7EDF3;color:#1B2A3A;--muted:#465768;--line:#E3E7EB}
.showcase-task--archive{background:#16324A;color:#FFFFFF;--muted:#B8C7D4;--line:rgba(255,255,255,.18)}
.showcase-task--waiting{background:#F3EEE5;color:#2E2A24;--muted:#645B50;--line:#E3E7EB}
.showcase-span-two{grid-column:span 2}
.showcase-span-three{grid-column:span 3}
.showcase-board-note{margin-top:auto;padding-top:var(--space-3);color:#56616A;font-size:var(--text-sm)}
.showcase-schedule-takeaway{display:grid;gap:var(--space-2);margin-top:var(--space-5);min-width:0}
.showcase-schedule-takeaway>h3{font-size:var(--text-lg);color:#1F2933}
.showcase-schedule-takeaway>p{color:#53616D}
.showcase-page .showcase-close-section{padding-bottom:var(--space-close)}
.showcase-page .showcase-closing{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);align-items:center;gap:var(--space-6);padding:var(--space-7);border-radius:var(--r-lg);background:#16324A;color:#FFFFFF;--muted:#B8C7D4;--line:rgba(255,255,255,.18);--focus:#A8EFD2;text-align:left}
.showcase-closing-copy{min-width:0;text-align:left}
.showcase-closing-copy>.c-kicker{margin-bottom:var(--space-4)}
.showcase-page .showcase-closing-copy>h2{color:#FFFFFF;font-size:var(--text-xl);line-height:var(--lh-heading)}
.showcase-closing-copy>p{margin-top:var(--space-3);color:#B8C7D4}
.showcase-closing-copy>.showcase-closing-price{font-size:var(--text-sm)}
.showcase-closing>.showcase-closing-actions{display:flex;flex-direction:column;align-items:stretch;justify-content:center;gap:var(--space-3);min-width:0;margin-top:0}
@media(max-width:64rem){
.showcase-page .showcase-closing{grid-template-columns:minmax(0,1fr);padding:var(--space-5)}
.showcase-closing>.showcase-closing-actions{align-items:flex-start}
.showcase-boards{grid-template-columns:minmax(0,1fr)}
}
@media(max-width:42rem){
.c-usecase-cards>.showcase-workflow{padding:var(--space-4)}
.showcase-section-head{margin-bottom:var(--space-5)}
.showcase-board-axis{display:none}
.showcase-lane{grid-template-columns:minmax(0,1fr);gap:var(--space-2)}
.showcase-page .showcase-closing{padding:var(--space-4);gap:var(--space-5)}
.showcase-closing>.showcase-closing-actions{align-items:stretch}
.showcase-closing-actions>.c-btn{flex:0 1 auto;width:100%}
.showcase-hero-copy>.c-actions>.c-btn{flex:1 1 100%}
}