.showcase-page [hidden]{display:none!important}

.showcase-hero{
  padding-block:var(--hero-space);
  background:var(--color-canvas);
  color:#f2f4f7;
}

.showcase-hero .c-page-hero__grid{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(31rem,1fr);
  align-items:start;
  gap:var(--space-8);
}

.showcase-hero .c-page-hero__copy{
  display:flex;
  min-width:0;
  flex-direction:column;
  align-items:flex-start;
}

.showcase-hero .c-page-hero__copy h1{
  max-width:13ch;
  margin-top:var(--space-4);
  color:#f2f4f7;
  overflow-wrap:anywhere;
}

.showcase-hero__lead{
  max-width:39rem;
  margin-top:var(--space-5);
  color:#b4bbc5;
  font-size:var(--text-lg);
}

.showcase-hero__facts{
  display:grid;
  width:100%;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:var(--space-3);
  margin-top:var(--space-6);
  padding-block:var(--space-4);
  border-top:1px solid rgba(255,255,255,.105);
  border-bottom:1px solid rgba(255,255,255,.105);
}

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

.showcase-hero__facts strong{
  display:block;
  color:#f2f4f7;
  font-size:var(--text-xl);
  line-height:1.2;
}

.showcase-hero__facts span{
  display:block;
  margin-top:var(--space-2);
  color:#969da8;
  font-size:var(--text-sm);
  overflow-wrap:anywhere;
}

.showcase-hero__note{
  max-width:39rem;
  margin-top:var(--space-5);
  color:#969da8;
  font-size:var(--text-sm);
}

.showcase-hero .c-page-hero__stage{
  min-width:0;
}

.hero-art{
  display:grid;
  width:min(42rem,100%);
  height:auto;
  min-height:0;
  margin-inline:auto;
  padding:0;
  gap:0;
  border:0;
  background:transparent;
  box-shadow:none;
  grid-template-columns:minmax(0,1fr);
  grid-template-areas:none;
  grid-auto-flow:row;
}

.slice-inspector{
  overflow:hidden;
  min-width:0;
  border-radius:var(--radius-lg);
  background:#0d1118;
  color:#f2f4f7;
  box-shadow:var(--shadow-window);
}

.slice-inspector__head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:var(--space-4);
  padding:var(--space-4) var(--space-5);
  background:#171b22;
  color:#d6dbe2;
  font-family:var(--font-mono);
  font-size:var(--text-xs);
}

.slice-inspector__head span,
.slice-inspector__head strong{
  min-width:0;
  overflow-wrap:anywhere;
}

.slice-inspector__body{
  display:grid;
  grid-template-columns:minmax(16rem,.9fr) minmax(0,1fr);
  align-items:center;
  gap:var(--space-6);
  padding:var(--space-6);
}

.slice-inspector__wheel{
  position:relative;
  width:min(100%,19rem);
  aspect-ratio:1;
  margin-inline:auto;
  padding:var(--space-4);
  border-radius:50%;
  background:#07090d;
  color:#f2f4f7;
}

.slice-inspector__wheel::before{
  position:absolute;
  inset:19%;
  border-radius:50%;
  background:#1236a6;
  content:"";
}

.slice-inspector__wheel b{
  position:absolute;
  inset:50% auto auto 50%;
  z-index:2;
  color:#ffffff;
  font-family:var(--font-heading);
  font-size:var(--text-lg);
  transform:translate(-50%,-50%);
}

.slice-petal{
  position:absolute;
  z-index:1;
  display:grid;
  width:29%;
  aspect-ratio:1;
  place-items:center;
  border-radius:52% 48% 52% 48%;
  background:#a9c2c5;
  color:#132326;
  font-family:var(--font-mono);
  font-size:var(--text-xs);
  font-weight:700;
}

.slice-petal--one{
  top:4%;
  left:35.5%;
}

.slice-petal--two{
  top:27%;
  right:12%;
  transform:rotate(72deg);
}

.slice-petal--three{
  right:16%;
  bottom:6%;
  transform:rotate(144deg);
}

.slice-petal--four{
  bottom:6%;
  left:16%;
  transform:rotate(216deg);
}

.slice-petal--five{
  top:27%;
  left:12%;
  transform:rotate(288deg);
}

.slice-inspector__data{
  display:grid;
  min-width:0;
  margin:0;
}

.slice-inspector__data div{
  display:grid;
  min-width:0;
  grid-template-columns:minmax(7rem,.8fr) minmax(0,1fr);
  gap:var(--space-4);
  padding-block:var(--space-3);
  border-bottom:1px solid rgba(255,255,255,.105);
}

.slice-inspector__data dt,
.slice-inspector__data dd{
  min-width:0;
  overflow-wrap:anywhere;
}

.slice-inspector__data dt{
  color:#969da8;
}

.slice-inspector__data dd{
  color:#f2f4f7;
  font-family:var(--font-mono);
}

.slice-inspector__foot{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:space-between;
  gap:var(--space-3);
  padding:var(--space-4) var(--space-5);
  background:#111720;
  color:#cbd1da;
  font-size:var(--text-xs);
}

.workflow-overview,
.workflow-section,
.editorial-section,
.quote-section,
.closing-section{
  padding-block:var(--section-space);
}

.workflow-overview{
  background:var(--color-canvas-2);
  color:#f2f4f7;
}

.workflow-overview .c-section__head,
.workflow-section .c-section__head,
.editorial-section .c-section__head,
.quote-section .c-section__head{
  max-width:48rem;
  margin-inline:auto;
  text-align:center;
}

.workflow-overview .c-section__head .c-kicker,
.workflow-section .c-section__head .c-kicker,
.editorial-section .c-section__head .c-kicker,
.quote-section .c-section__head .c-kicker{
  margin-inline:auto;
}

.workflow-overview .c-section__head h2,
.workflow-section .c-section__head h2,
.editorial-section .c-section__head h2,
.quote-section .c-section__head h2{
  margin-top:var(--space-4);
  color:#f2f4f7;
}

.workflow-overview .c-section__head p,
.workflow-section .c-section__head p,
.editorial-section .c-section__head p,
.quote-section .c-section__head p{
  margin-top:var(--space-4);
  color:#969da8;
}

.workflow-filter{
  justify-content:center;
  margin-top:var(--space-6);
}

.workflow-filter .c-filter{
  min-height:2.75rem;
}

.workflow-index{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:var(--space-3);
  margin-top:var(--space-7);
}

.workflow-index div{
  min-width:0;
  padding:var(--space-5);
  border-radius:var(--radius-md);
  background:#111720;
  color:#f2f4f7;
}

.workflow-index span{
  display:block;
  color:#969da8;
  font-size:var(--text-xs);
}

.workflow-index strong{
  display:block;
  margin-top:var(--space-2);
  color:#f2f4f7;
  font-size:var(--text-sm);
  overflow-wrap:anywhere;
}

.workflow-section{
  background:var(--color-canvas);
  color:#f2f4f7;
}

.workflow-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:var(--space-5);
  align-items:stretch;
  margin-top:var(--space-8);
}

.workflow-card{
  display:flex;
  min-width:0;
  height:100%;
  flex-direction:column;
  padding:var(--space-6);
  border-radius:var(--radius-md);
  background:#111720;
  color:#f2f4f7;
  transition:background var(--motion-base),box-shadow var(--motion-base),transform var(--motion-base);
  scroll-margin-top:calc(var(--header-height) + var(--space-5));
}

.workflow-card.is-highlighted{
  background:#151a2b;
  box-shadow:inset 0 0 0 2px #5477f1;
  transform:translateY(-2px);
}

.workflow-card__top{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:var(--space-4);
}

.workflow-card__mark{
  display:flex;
  min-width:0;
  flex-wrap:wrap;
  align-items:center;
  gap:var(--space-3);
}

.workflow-card__code{
  flex:0 0 auto;
  color:#969da8;
  font-size:var(--text-xs);
}

.workflow-card h3{
  margin-top:var(--space-5);
  color:#f2f4f7;
  font-size:var(--text-xl);
}

.workflow-card>p{
  margin-top:var(--space-3);
  color:#a1a8b2;
}

.workflow-steps{
  display:grid;
  gap:0;
  margin:var(--space-5) 0 0;
  padding:0;
  list-style:none;
}

.workflow-steps li{
  display:grid;
  min-width:0;
  grid-template-columns:2.5rem minmax(0,1fr);
  gap:var(--space-3);
  align-items:start;
  padding:var(--space-4) 0;
  border-top:1px solid rgba(255,255,255,.105);
}

.workflow-steps__number{
  display:inline-flex;
  width:2.25rem;
  height:2.25rem;
  align-items:center;
  justify-content:center;
  border-radius:999px;
  background:#1c2d67;
  color:#dbe2ff;
  font-family:var(--font-mono);
  font-size:var(--text-xs);
  line-height:1;
}

.workflow-steps li div{
  min-width:0;
}

.workflow-steps strong{
  display:block;
  color:#eef1f5;
  font-size:var(--text-sm);
}

.workflow-steps p{
  margin-top:var(--space-2);
  color:#969da8;
  font-size:var(--text-sm);
}

.workflow-card__result{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:space-between;
  gap:var(--space-3);
  margin-top:auto;
  padding-top:var(--space-5);
  border-top:1px solid rgba(255,255,255,.105);
}

.workflow-card__result span{
  color:#969da8;
  font-size:var(--text-xs);
}

.workflow-card__result strong{
  min-width:0;
  color:#dbe2ff;
  font-family:var(--font-mono);
  font-size:var(--text-xs);
  overflow-wrap:anywhere;
}

.editorial-section{
  background:var(--color-canvas-2);
  color:#f2f4f7;
}

.editorial-lead{
  display:grid;
  grid-template-columns:minmax(0,1.45fr) minmax(18rem,.75fr);
  gap:var(--space-5);
  align-items:stretch;
  margin-top:var(--space-8);
}

.editorial-side{
  display:grid;
  grid-template-rows:repeat(2,minmax(0,1fr));
  gap:var(--space-5);
  min-width:0;
}

.editorial-card{
  display:flex;
  min-width:0;
  height:100%;
  flex-direction:column;
  padding:var(--space-5);
  border-radius:var(--radius-md);
  background:#111720;
  color:#f2f4f7;
  transition:transform var(--motion-fast),background var(--motion-fast);
}

.editorial-card:hover{
  transform:translateY(-2px);
  background:#171f2b;
}

.editorial-card:focus-visible{
  outline-offset:4px;
}

.editorial-card--featured{
  min-height:31rem;
  justify-content:space-between;
  padding:var(--space-6);
  background:linear-gradient(145deg,#193fbd 0%,#111a40 52%,#0d1118 100%);
  color:#ffffff;
}

.editorial-card--featured:hover{
  background:linear-gradient(145deg,#214ac8 0%,#151f4b 52%,#111720 100%);
}

.editorial-card__meta{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:space-between;
  gap:var(--space-3);
  color:#969da8;
  font-family:var(--font-mono);
  font-size:var(--text-xs);
}

.editorial-card--featured .editorial-card__meta{
  color:#dbe2ff;
}

.editorial-card__body{
  display:flex;
  min-width:0;
  flex-direction:column;
}

.editorial-card__series{
  margin-bottom:var(--space-3);
  color:#dbe2ff;
  font-size:var(--text-xs);
}

.editorial-card h3{
  color:#f2f4f7;
  font-size:var(--text-xl);
  overflow-wrap:anywhere;
}

.editorial-card--featured h3{
  max-width:18ch;
  color:#ffffff;
  font-size:clamp(2rem,4vw,3rem);
  line-height:1.16;
}

.editorial-card__body>p:not(.editorial-card__series){
  margin-top:var(--space-3);
  color:#a1a8b2;
}

.editorial-card--featured .editorial-card__body>p:not(.editorial-card__series){
  max-width:42rem;
  color:#e0e5f1;
  font-size:var(--text-lg);
}

.editorial-card__link{
  display:inline-flex;
  width:fit-content;
  align-items:center;
  gap:var(--space-2);
  margin-top:var(--space-5);
  color:#c9d3ff;
  font-size:var(--text-sm);
  font-weight:650;
}

.editorial-card__link svg{
  width:1rem;
  height:1rem;
}

.editorial-card--compact h3,
.editorial-card--list h3{
  margin-top:var(--space-5);
  font-size:var(--text-xl);
}

.editorial-card--compact .editorial-card__link,
.editorial-card--list .editorial-card__link{
  margin-top:auto;
  padding-top:var(--space-5);
}

.editorial-rest{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:var(--space-5);
  align-items:stretch;
  margin-top:var(--space-5);
}

.editorial-card--list{
  min-height:22rem;
}

.quote-section{
  background:var(--color-canvas);
  color:#f2f4f7;
}

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

.quote-card{
  display:flex;
  min-width:0;
  height:100%;
  flex-direction:column;
  margin:0;
  padding:var(--space-6);
  border-radius:var(--radius-md);
  background:#111720;
  color:#f2f4f7;
}

.quote-card blockquote{
  color:#dce1e8;
  font-size:var(--text-lg);
}

.quote-card figcaption{
  display:flex;
  flex-direction:column;
  gap:var(--space-1);
  margin-top:auto;
  padding-top:var(--space-6);
  color:#969da8;
}

.quote-card figcaption strong{
  color:#dbe2ff;
}

.closing-section{
  padding-top:var(--section-space);
  padding-bottom:var(--space-8);
  background:var(--color-canvas);
  color:#f2f4f7;
}

.closing-section .c-cta{
  padding-inline:var(--space-7);
  background:#0e131b;
  color:#f2f4f7;
}

.closing-copy{
  min-width:0;
  max-width:47rem;
}

.closing-copy .c-kicker{
  margin-bottom:var(--space-4);
}

.closing-copy h2{
  color:#f2f4f7;
  font-size:clamp(1.9rem,3.5vw,2.75rem);
}

.closing-copy p{
  color:#969da8;
}

.closing-actions{
  display:flex;
  flex:0 0 auto;
  flex-direction:column;
  align-items:stretch;
  gap:var(--space-3);
  min-width:14rem;
}

.closing-actions .c-btn{
  width:100%;
}

.closing-section .c-btn-ghost{
  color:#eef1f5;
  border-color:rgba(238,241,245,.42);
}

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

  .showcase-hero .c-page-hero__copy h1{
    max-width:16ch;
  }

  .showcase-hero .c-page-hero__stage{
    width:100%;
  }

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

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

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

  .editorial-side{
    grid-template-columns:repeat(2,minmax(0,1fr));
    grid-template-rows:auto;
  }

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

@media(max-width:48rem){
  .slice-inspector__body{
    grid-template-columns:minmax(0,1fr);
  }

  .slice-inspector__wheel{
    width:min(18rem,100%);
  }

  .editorial-side,
  .editorial-rest{
    grid-template-columns:minmax(0,1fr);
  }

  .editorial-card--featured{
    min-height:27rem;
  }
}

@media(max-width:42rem){
  .showcase-hero{
    padding-block:var(--hero-space);
  }

  .showcase-hero .c-page-hero__grid{
    align-items:start;
  }

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

  .showcase-hero__facts div{
    display:grid;
    grid-template-columns:3rem minmax(0,1fr);
    gap:var(--space-3);
    align-items:center;
  }

  .showcase-hero__facts span{
    margin-top:0;
  }

  .showcase-hero .c-action-row{
    width:100%;
  }

  .showcase-hero .c-action-row .c-btn{
    width:100%;
  }

  .hero-art{
    width:min(calc(100% - var(--gutter)*2),100%);
    height:auto;
    margin-inline:auto;
    grid-template-columns:minmax(0,1fr);
    overflow:visible;
    transform:none;
  }

  .slice-inspector__head,
  .slice-inspector__foot{
    align-items:flex-start;
    flex-direction:column;
  }

  .slice-inspector__body{
    padding:var(--space-5);
  }

  .slice-inspector__data div{
    grid-template-columns:minmax(0,1fr);
    gap:var(--space-2);
  }

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

  .workflow-card,
  .quote-card,
  .editorial-card{
    padding-inline:var(--space-5);
  }

  .workflow-card__top{
    flex-direction:column;
  }

  .workflow-card__result{
    align-items:flex-start;
    flex-direction:column;
  }

  .workflow-steps li{
    grid-template-columns:2.25rem minmax(0,1fr);
  }

  .editorial-card--featured{
    min-height:0;
  }

  .editorial-card--featured h3{
    max-width:none;
    font-size:clamp(2rem,10vw,2.65rem);
  }

  .closing-section .c-cta{
    padding-inline:var(--space-5);
  }

  .closing-actions{
    width:100%;
    min-width:0;
  }
}

@media(max-width:24.375rem){
  .workflow-card,
  .quote-card,
  .editorial-card,
  .slice-inspector__body{
    padding-inline:var(--space-5);
  }

  .workflow-card__mark{
    align-items:flex-start;
    flex-direction:column;
  }
}