.showcase-hero{
  padding-block:var(--sm-hero-pad);
  background:linear-gradient(132deg,#EEF5F6 0%,#F2EEFA 42%,#FFF1E8 72%,#FFF7D8 100%);
  color:#18252A;
}

.showcase-hero>.c-wide{
  display:grid;
  grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);
  align-items:start;
  gap:var(--sm-space-5);
}

.showcase-hero__copy{
  min-width:0;
  align-items:flex-start;
  text-align:left;
  padding-top:var(--sm-space-2);
  color:#18252A;
}

.showcase-hero__copy .showcase-hero__lead{
  color:#18252A;
}

.showcase-heading-group{
  min-width:0;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:var(--sm-space-2);
}

.showcase-heading-group>.c-kicker{
  width:fit-content;
  max-width:100%;
  align-self:flex-start;
}

.showcase-heading-group h1,
.showcase-heading-group h2{
  max-width:100%;
  margin-inline:0;
  overflow-wrap:anywhere;
}

.showcase-hero__lead{
  max-width:42rem;
  margin-top:var(--sm-space-1);
  color:#314146;
}

.showcase-hero__actions{
  justify-content:flex-start;
  margin-top:var(--sm-space-3);
  margin-bottom:var(--sm-space-3);
}

.showcase-hero__facts{
  width:100%;
  margin:0;
  padding-top:var(--sm-space-3);
  border-top:1px solid color-mix(in srgb,#18252A 14%,transparent);
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:var(--sm-space-2);
}

.showcase-hero__facts>div{
  min-width:0;
}

.showcase-hero__facts dt,
.showcase-hero__facts dd{
  min-width:0;
  overflow-wrap:anywhere;
}

.showcase-hero__facts dt{
  color:#075D70;
  font-size:var(--sm-text-3);
  line-height:1.3;
}

.showcase-hero__facts dd{
  margin-top:var(--sm-space-1);
  color:#536066;
}

.showcase-stage{
  min-width:0;
  align-self:start;
  height:auto;
  overflow:visible;
}

.showcase-board{
  width:100%;
  max-width:none;
  height:auto;
  padding:0;
  overflow:hidden;
  border-radius:var(--sm-radius-lg);
  background:#FFFFFF;
  color:#18252A;
  box-shadow:var(--sm-shadow-float);
}

.showcase-board__header{
  padding:var(--sm-space-3);
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:var(--sm-space-2);
  background:#18252A;
  color:#F9FBFA;
}

.showcase-board__header>div{
  min-width:0;
}

.showcase-board__overline{
  display:block;
  color:#C6D0D2;
  font-size:var(--sm-text-0);
  line-height:1.4;
  font-weight:700;
  letter-spacing:.04em;
}

.showcase-board__header h2{
  margin-top:var(--sm-space-1);
  color:#F9FBFA;
  font-size:var(--sm-text-3);
  line-height:1.35;
  letter-spacing:-.025em;
  overflow-wrap:anywhere;
}

.showcase-board__header .c-badge{
  flex:0 0 auto;
  width:fit-content;
  max-width:42%;
  align-self:flex-start;
  background:#FFF7D8;
  color:#4B3A08;
}

.showcase-board__labels{
  padding:.7rem var(--sm-space-3) .85rem;
  display:grid;
  grid-template-columns:minmax(0,1.4fr) minmax(0,.72fr) auto;
  gap:var(--sm-space-2);
  background:#F6F7F6;
  color:#667278;
  font-family:var(--sm-font-mono);
  font-size:var(--sm-text-0);
  line-height:1.4;
}

.showcase-board__rows{
  padding-inline:var(--sm-space-3);
  background:#FFFFFF;
  color:#18252A;
}

.showcase-board__row{
  min-width:0;
  padding-block:var(--sm-space-2);
  border-bottom:1px solid #E8EBEA;
  display:grid;
  grid-template-columns:minmax(0,1.4fr) minmax(0,.72fr) auto;
  align-items:center;
  gap:var(--sm-space-2);
}

.showcase-board__task{
  min-width:0;
  display:grid;
  grid-template-columns:auto minmax(0,1fr);
  align-items:center;
  gap:var(--sm-space-1);
}

.showcase-board__task>span{
  min-width:0;
}

.showcase-board__task strong,
.showcase-board__task small{
  display:block;
  overflow-wrap:anywhere;
}

.showcase-board__task strong{
  color:#18252A;
  font-size:var(--sm-text-1);
  line-height:1.45;
}

.showcase-board__task small{
  margin-top:.25rem;
  color:#667278;
}

.showcase-board__mark{
  width:2.25rem;
  height:2.25rem;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:var(--sm-radius-sm);
  background:#EEF5F6;
  color:#075D70;
}

.showcase-board__mark svg{
  width:1.125rem;
  height:1.125rem;
}

.showcase-board__row>.u-mono{
  min-width:0;
  color:#47555A;
  font-size:var(--sm-text-0);
  overflow-wrap:anywhere;
}

.showcase-board__status{
  width:fit-content;
  max-width:100%;
  justify-self:start;
  padding:.35rem .55rem;
  border-radius:999px;
  background:#EAF4F0;
  color:#185844;
  font-size:var(--sm-text-0);
  line-height:1.3;
  font-weight:700;
  overflow-wrap:anywhere;
}

.showcase-board__footer{
  padding:var(--sm-space-2) var(--sm-space-3) var(--sm-space-3);
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:var(--sm-space-1);
  background:#FFFFFF;
  color:#465459;
}

.showcase-board__footer span{
  min-width:0;
  padding:.45rem .5rem;
  border-radius:var(--sm-radius-sm);
  background:#F6F7F6;
  color:#465459;
  font-size:var(--sm-text-0);
  line-height:1.4;
  text-align:center;
  overflow-wrap:anywhere;
}

.showcase-intro,
.showcase-case-section,
.showcase-quotes{
  padding-block:var(--sm-section);
}

.showcase-section-head{
  max-width:48rem;
}

.showcase-section-head>p{
  margin-top:var(--sm-space-1);
  color:#46555A;
}

.showcase-section-head--center{
  margin-inline:auto;
  text-align:center;
}

.showcase-section-head--center .showcase-heading-group{
  align-items:center;
}

.showcase-section-head--center .showcase-heading-group>.c-kicker{
  align-self:center;
  margin-inline:auto;
}

.showcase-principles{
  margin-top:var(--sm-space-4);
  align-items:start;
}

.showcase-principles>.c-card{
  height:auto;
  padding-inline:var(--sm-space-3);
}

.showcase-principles>.c-card h3{
  margin-top:var(--sm-space-2);
  font-size:var(--sm-text-3);
}

.showcase-principles>.c-card p{
  margin-top:var(--sm-space-1);
  color:inherit;
  opacity:.8;
}

.showcase-icon-chip{
  width:2.5rem;
  height:2.5rem;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:var(--sm-radius-sm);
  background:rgba(255,255,255,.68);
  color:inherit;
}

.showcase-icon-chip svg{
  width:1.125rem;
  height:1.125rem;
}

.showcase-case{
  padding:var(--sm-space-4);
  border-radius:var(--sm-radius-lg);
}

.showcase-case--peach{
  background:#FFF1E8;
  color:#572B1B;
}

.showcase-case--mist{
  background:#EEF5F6;
  color:#183D45;
}

.showcase-case--lilac{
  background:#F2EEFA;
  color:#33284F;
}

.showcase-case--butter{
  background:#FFF7D8;
  color:#4B3A08;
}

.showcase-case__summary{
  display:grid;
  grid-template-columns:minmax(0,1.04fr) minmax(0,.96fr);
  align-items:start;
  gap:var(--sm-space-4);
}

.showcase-case__copy{
  min-width:0;
}

.showcase-case__copy>p{
  margin-top:var(--sm-space-2);
  color:inherit;
  opacity:.82;
}

.showcase-case__brief{
  min-width:0;
  margin:0;
  padding:var(--sm-space-3);
  border-radius:var(--sm-radius-md);
  background:rgba(255,255,255,.68);
  color:inherit;
}

.showcase-case__brief>div{
  min-width:0;
  padding-block:var(--sm-space-2);
  border-bottom:1px solid color-mix(in srgb,currentColor 15%,transparent);
  display:grid;
  grid-template-columns:minmax(0,.34fr) minmax(0,1fr);
  gap:var(--sm-space-2);
}

.showcase-case__brief>div:first-child{
  padding-top:0;
}

.showcase-case__brief>div:last-child{
  padding-bottom:0;
  border-bottom:0;
}

.showcase-case__brief dt,
.showcase-case__brief dd{
  min-width:0;
  color:inherit;
  overflow-wrap:anywhere;
}

.showcase-case__brief dd{
  opacity:.8;
}

.showcase-flow{
  margin-top:var(--sm-space-4);
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  align-items:start;
  gap:var(--sm-space-2);
}

.showcase-flow__step{
  min-width:0;
  padding:var(--sm-space-3);
  border-radius:var(--sm-radius-md);
  background:rgba(255,255,255,.72);
  color:inherit;
}

.showcase-flow__number{
  width:fit-content;
  max-width:100%;
  display:block;
  color:inherit;
  font-size:var(--sm-text-1);
  line-height:1.4;
  font-weight:700;
}

.showcase-flow__step h3{
  margin-top:var(--sm-space-2);
  font-size:var(--sm-text-3);
  overflow-wrap:anywhere;
}

.showcase-flow__step p{
  margin-top:var(--sm-space-1);
  color:inherit;
  font-size:var(--sm-text-1);
  opacity:.8;
}

.showcase-case__outcome{
  margin-top:var(--sm-space-3);
  padding-top:var(--sm-space-3);
  border-top:1px solid color-mix(in srgb,currentColor 16%,transparent);
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:end;
  gap:var(--sm-space-3);
}

.showcase-case__outcome>div{
  min-width:0;
}

.showcase-case__outcome strong{
  display:block;
  font-size:var(--sm-text-1);
  line-height:1.5;
}

.showcase-case__outcome p{
  max-width:46rem;
  margin-top:var(--sm-space-1);
  color:inherit;
  font-size:var(--sm-text-1);
  opacity:.82;
}

.showcase-case__actions{
  justify-content:flex-start;
  margin-top:var(--sm-space-3);
}

.showcase-case__outcome>.showcase-case__actions{
  margin-top:0;
}

.showcase-quote-strip{
  margin-top:var(--sm-space-4);
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  align-items:start;
  gap:var(--sm-space-3);
}

.showcase-quote{
  min-width:0;
  margin:0;
  padding:var(--sm-space-3);
  border-radius:var(--sm-radius-md);
  background:#FFFFFF;
  color:#18252A;
}

.showcase-quote blockquote{
  color:#18252A;
  font-size:var(--sm-text-2);
  line-height:1.7;
}

.showcase-quote figcaption{
  margin-top:var(--sm-space-3);
  padding-top:var(--sm-space-2);
  border-top:1px solid #E3E7E6;
  color:#667278;
  font-weight:700;
}

.showcase-closing-section{
  padding-block:var(--sm-section) var(--sm-space-5);
  background:#FCFCFB;
  color:#18252A;
}

.showcase-closing__copy{
  min-width:0;
}

.showcase-closing__copy h2{
  color:#F9FBFA;
  overflow-wrap:anywhere;
}

.showcase-closing__copy p{
  max-width:48rem;
  color:#B8C2C4;
}

.showcase-closing__actions{
  min-width:min(100%,15rem);
  display:flex;
  flex-direction:column;
  align-items:stretch;
  gap:var(--sm-space-1);
}

.showcase-closing__actions .c-btn{
  width:100%;
}

.showcase-closing__actions .c-btn--ghost{
  border-color:color-mix(in srgb,#F9FBFA 38%,transparent);
  background:transparent;
  color:#F9FBFA;
}

@media(max-width:64rem){
  .showcase-hero>.c-wide{
    grid-template-columns:minmax(0,1fr);
    gap:var(--sm-space-4);
  }

  .showcase-hero__copy{
    padding-top:0;
  }

  .showcase-stage,
  .showcase-board{
    height:auto;
    overflow:visible;
  }

  .showcase-board{
    overflow:hidden;
  }

  .showcase-case__summary{
    grid-template-columns:minmax(0,1fr);
  }

  .showcase-flow{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .showcase-quote-strip{
    grid-template-columns:minmax(0,1fr);
  }
}

@media(max-width:42rem){
  .showcase-hero__facts{
    grid-template-columns:minmax(0,1fr);
  }

  .showcase-board__header{
    flex-direction:column;
  }

  .showcase-board__header .c-badge{
    max-width:100%;
  }

  .showcase-board__labels{
    display:none;
  }

  .showcase-board__row{
    grid-template-columns:minmax(0,1fr) auto;
  }

  .showcase-board__task{
    grid-column:1 / -1;
  }

  .showcase-board__footer{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .showcase-case{
    padding:var(--sm-space-3);
  }

  .showcase-case__brief>div{
    grid-template-columns:minmax(0,1fr);
    gap:var(--sm-space-1);
  }

  .showcase-flow{
    grid-template-columns:minmax(0,1fr);
  }

  .showcase-case__outcome{
    grid-template-columns:minmax(0,1fr);
    align-items:start;
  }

  .showcase-case__outcome>.showcase-case__actions{
    margin-top:var(--sm-space-2);
  }

  .showcase-case__actions{
    width:100%;
  }
}

@media(max-width:24.375rem){
  .showcase-board__rows{
    padding-inline:var(--sm-space-2);
  }

  .showcase-board__header,
  .showcase-board__footer{
    padding-inline:var(--sm-space-2);
  }

  .showcase-board__row{
    grid-template-columns:minmax(0,1fr);
  }

  .showcase-board__task{
    grid-column:auto;
  }

  .showcase-board__status{
    justify-self:start;
  }

  .showcase-board__footer{
    grid-template-columns:minmax(0,1fr);
  }
}
