.gallery-hero{
  padding-block:var(--space-6);
  background:var(--color-light);
  color:var(--color-ink)
}

.gallery-hero__grid{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,.92fr);
  gap:var(--space-5);
  align-items:start
}

.gallery-hero__copy,
.gallery-hero__heading,
.gallery-section-title,
.gallery-feature__body,
.gallery-story__body,
.gallery-compact__body,
.ai-budget__head,
.ai-protocol,
.gallery-closing__copy{
  min-width:0
}

.gallery-hero__copy{
  display:flex;
  flex-direction:column;
  align-items:flex-start
}

.gallery-hero__heading{
  display:grid;
  gap:var(--space-1)
}

.gallery-hero h1,
.gallery-hero h2,
.page-section h2,
.page-section h3{
  font-family:var(--font-body)
}

.gallery-hero h1{
  max-width:18ch;
  overflow-wrap:anywhere;
  font-size:clamp(2.4rem,4.8vw,3.2rem);
  line-height:1.16;
  font-weight:700
}

.gallery-hero__lead{
  max-width:42rem;
  color:var(--color-muted)
}

.gallery-hero__actions{
  display:flex;
  flex-wrap:wrap;
  justify-content:flex-start;
  gap:var(--space-2);
  margin-block:var(--space-3)
}

.gallery-hero__facts{
  display:grid;
  width:100%;
  grid-template-columns:repeat(3,minmax(0,1fr));
  margin:0 0 var(--space-3);
  border-top:1px solid var(--line-paper);
  border-bottom:1px solid var(--line-paper)
}

.gallery-hero__facts div{
  min-width:0;
  padding:var(--space-2)
}

.gallery-hero__facts div+div{
  border-left:1px solid var(--line-paper)
}

.gallery-hero__facts dt{
  color:var(--color-muted)
}

.gallery-hero__facts dd{
  margin-top:var(--space-1);
  overflow-wrap:anywhere;
  color:var(--color-ink);
  font-family:var(--font-mono);
  font-variant-numeric:tabular-nums
}

.gallery-workbench{
  min-width:0;
  margin:0;
  overflow:hidden;
  border-radius:var(--radius-lg);
  background:var(--color-warm);
  color:var(--color-ink);
  box-shadow:var(--shadow-soft)
}

.gallery-workbench svg{
  width:100%;
  height:clamp(28rem,47vw,38rem)
}

.gallery-workbench figcaption{
  padding:var(--space-2) var(--space-3);
  background:var(--color-paper);
  color:var(--color-muted)
}

.page-section{
  padding-block:var(--space-6)
}

.page-section--soft{
  background:var(--color-surface);
  color:var(--color-ink)
}

.page-section--warm{
  background:var(--color-light);
  color:var(--color-ink)
}

.section-head{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,.8fr);
  gap:var(--space-4);
  align-items:end;
  margin-bottom:var(--space-4)
}

.section-head>p{
  color:var(--color-muted)
}

.gallery-section-title{
  display:grid;
  gap:var(--space-1)
}

.gallery-section-title h2{
  max-width:19ch;
  overflow-wrap:anywhere;
  font-weight:700
}

.ci-chain{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:var(--space-3);
  list-style:none;
  margin:0;
  padding:0
}

.ci-chain li{
  display:grid;
  min-width:0;
  gap:var(--space-1);
  padding:var(--space-3);
  border-radius:var(--radius-md);
  background:var(--color-surface-2);
  color:var(--color-ink)
}

.ci-chain li:nth-child(2n){
  background:var(--color-light);
  color:var(--color-ink)
}

.ci-chain__code{
  width:fit-content;
  max-width:100%;
  align-self:flex-start;
  padding:.4rem .7rem;
  border-radius:999px;
  background:var(--color-primary);
  color:#fff;
  font:700 var(--fs-0)/1.3 var(--font-mono);
  letter-spacing:.08em
}

.ci-chain h3{
  font-size:var(--fs-3);
  font-weight:700
}

.ci-chain p{
  color:var(--color-muted)
}

.build-command{
  margin-top:var(--space-4);
  overflow:hidden;
  border-radius:var(--radius-lg);
  background:var(--color-dark);
  color:#f9f4ee
}

.build-command__label{
  display:flex;
  flex-wrap:wrap;
  justify-content:space-between;
  gap:var(--space-2);
  padding:var(--space-2) var(--space-3);
  background:var(--color-primary);
  color:#fff;
  font-size:var(--fs-1);
  font-weight:700
}

.build-command pre{
  padding:var(--space-3);
  color:#f9f4ee
}

.build-command code{
  color:inherit
}

.build-command>p{
  padding:0 var(--space-3) var(--space-3);
  color:#c5c0ca
}

.remote-layout{
  align-items:stretch
}

.remote-ledger{
  min-width:0;
  overflow:hidden;
  border-radius:var(--radius-lg);
  background:var(--color-paper);
  color:var(--color-ink);
  box-shadow:var(--shadow-soft)
}

.remote-ledger__head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:var(--space-3);
  padding:var(--space-3);
  background:var(--color-primary);
  color:#fff
}

.remote-ledger__head>div{
  display:grid;
  min-width:0;
  gap:var(--space-1)
}

.remote-ledger__head .c-badge{
  background:var(--color-accent-soft);
  color:#17151d
}

.remote-ledger__head h3{
  font-size:var(--fs-4);
  font-weight:700
}

.remote-ledger__status{
  max-width:48%;
  padding:.45rem .75rem;
  border-radius:999px;
  background:#fff8ec;
  color:#17151d;
  font:700 var(--fs-0)/1.35 var(--font-mono);
  overflow-wrap:anywhere
}

.remote-ledger__rows>div{
  display:grid;
  grid-template-columns:minmax(8rem,.35fr) minmax(0,.65fr);
  gap:var(--space-1) var(--space-3);
  padding:var(--space-3)
}

.remote-ledger__rows>div+div{
  border-top:1px solid var(--line-paper)
}

.remote-ledger__rows span{
  color:var(--color-muted);
  font:700 var(--fs-1)/1.5 var(--font-mono)
}

.remote-ledger__rows strong{
  min-width:0;
  overflow-wrap:anywhere
}

.remote-ledger__rows p{
  grid-column:2;
  color:var(--color-muted)
}

.remote-side{
  align-self:stretch
}

.remote-side .c-card{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:var(--space-1)
}

.remote-side .c-card--soft{
  background:var(--color-surface-2);
  color:var(--color-ink)
}

.remote-side .c-card--soft p,
.remote-side .c-card--soft li{
  color:var(--color-muted)
}

.remote-side__icon{
  width:1.5rem;
  height:1.5rem;
  margin-bottom:0
}

.remote-side h3{
  font-weight:700
}

.remote-side ul{
  margin:0;
  padding-left:1.25rem
}

.remote-side .c-btn{
  width:fit-content;
  max-width:100%;
  margin-top:var(--space-3)
}

.ai-case__grid{
  display:grid;
  grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);
  gap:var(--space-3);
  align-items:stretch
}

.ai-budget,
.ai-protocol{
  min-width:0;
  border-radius:var(--radius-lg)
}

.ai-budget{
  overflow:hidden;
  background:var(--color-surface);
  color:var(--color-ink)
}

.ai-budget__head{
  display:grid;
  gap:var(--space-1);
  padding:var(--space-3);
  background:var(--color-primary);
  color:#fff
}

.ai-budget__head .c-badge{
  background:var(--color-accent-soft);
  color:#17151d
}

.ai-budget__head p{
  color:#ded9e4
}

.ai-budget__list{
  margin:0
}

.ai-budget__list>div{
  display:grid;
  grid-template-columns:minmax(7rem,.32fr) minmax(0,.68fr);
  gap:var(--space-3);
  padding:var(--space-3)
}

.ai-budget__list>div+div{
  border-top:1px solid var(--line-paper)
}

.ai-budget__list dd{
  display:grid;
  min-width:0;
  gap:var(--space-1)
}

.ai-budget__list dd span{
  color:var(--color-muted)
}

.ai-protocol{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:var(--space-2);
  padding:var(--space-3);
  background:var(--color-dark);
  color:#f9f4ee
}

.ai-protocol .c-badge{
  background:var(--color-accent-soft);
  color:#17151d
}

.ai-protocol h3{
  font-weight:700
}

.ai-protocol ol{
  display:grid;
  gap:0;
  width:100%;
  list-style:none;
  margin:var(--space-2) 0 0;
  padding:0;
  counter-reset:protocol
}

.ai-protocol li{
  display:grid;
  grid-template-columns:2rem minmax(0,1fr);
  gap:var(--space-1) var(--space-2);
  padding-block:var(--space-2);
  counter-increment:protocol
}

.ai-protocol li+li{
  border-top:1px solid var(--line-dark)
}

.ai-protocol li::before{
  content:counter(protocol,decimal-leading-zero);
  grid-row:1 / span 2;
  color:var(--color-accent-soft);
  font:700 var(--fs-1)/1.5 var(--font-mono)
}

.ai-protocol p{
  color:#c5c0ca
}

.ai-table-wrap{
  margin-top:var(--space-4);
  border-radius:var(--radius-md)
}

.ai-table-wrap table{
  min-width:48rem
}

.ai-table-wrap caption{
  padding:var(--space-2);
  background:var(--color-surface-2);
  color:var(--color-ink);
  text-align:left;
  font-weight:700
}

.gallery-magazine{
  display:grid;
  grid-template-columns:minmax(0,1.28fr) minmax(18rem,.72fr);
  gap:var(--space-3);
  align-items:stretch
}

.gallery-feature{
  position:relative;
  display:flex;
  min-width:0;
  min-height:32rem;
  overflow:hidden;
  border-radius:var(--radius-lg);
  background:linear-gradient(145deg,var(--color-primary),var(--color-primary-soft));
  color:#fff
}

.gallery-feature__body{
  position:relative;
  z-index:1;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  width:100%;
  padding:clamp(1.5rem,4vw,3.5rem)
}

.gallery-feature .c-badge{
  background:var(--color-accent-soft);
  color:#17151d
}

.gallery-feature h3{
  max-width:18ch;
  margin-top:var(--space-3);
  overflow-wrap:anywhere;
  font-size:clamp(1.8rem,3.5vw,2.75rem);
  line-height:1.18;
  font-weight:700
}

.gallery-feature p{
  max-width:38rem;
  margin-top:var(--space-2);
  color:#e4dfeb
}

.gallery-feature__mark{
  position:absolute;
  right:-2rem;
  bottom:-2rem;
  width:12rem;
  height:12rem;
  opacity:.85;
  pointer-events:none
}

.gallery-card-meta{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:space-between;
  gap:var(--space-2);
  width:100%;
  margin-top:auto;
  padding-top:var(--space-3);
  font:700 var(--fs-0)/1.4 var(--font-mono)
}

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

.gallery-story{
  display:flex;
  min-width:0;
  flex-direction:column;
  overflow:hidden;
  border-radius:var(--radius-lg);
  background:var(--color-paper);
  color:var(--color-ink);
  box-shadow:var(--shadow-soft)
}

.gallery-story__media{
  height:11rem;
  flex:0 0 11rem;
  overflow:hidden
}

.gallery-story__media svg{
  width:100%;
  height:100%
}

.gallery-story__body{
  display:flex;
  flex:1;
  flex-direction:column;
  align-items:flex-start;
  gap:var(--space-2);
  padding:var(--space-3)
}

.gallery-story h3{
  overflow-wrap:anywhere;
  font-size:var(--fs-3);
  font-weight:700
}

.gallery-story p{
  color:var(--color-muted)
}

.gallery-story .gallery-card-meta{
  color:var(--color-muted)
}

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

.gallery-compact{
  display:flex;
  min-width:0;
  height:100%;
  overflow:hidden;
  border-radius:var(--radius-lg);
  background:var(--color-paper);
  color:var(--color-ink);
  box-shadow:var(--shadow-soft)
}

.gallery-compact--full{
  grid-column:1 / -1
}

.gallery-compact__media{
  width:10rem;
  flex:0 0 10rem;
  overflow:hidden
}

.gallery-compact__media svg{
  width:100%;
  height:100%;
  min-height:100%
}

.gallery-compact__body{
  display:flex;
  flex:1;
  flex-direction:column;
  align-items:flex-start;
  gap:var(--space-2);
  padding:var(--space-3)
}

.gallery-compact h3{
  overflow-wrap:anywhere;
  font-size:var(--fs-3);
  font-weight:700
}

.gallery-compact p{
  color:var(--color-muted)
}

.gallery-compact .gallery-card-meta{
  color:var(--color-muted)
}

.gallery-feature,
.gallery-story,
.gallery-compact{
  transition:transform .25s var(--ease),box-shadow .25s var(--ease)
}

.gallery-feature:hover,
.gallery-story:hover,
.gallery-compact:hover{
  transform:translateY(-4px);
  box-shadow:0 1.8rem 4rem rgba(35,30,48,.14)
}

.gallery-feature:focus-visible,
.gallery-story:focus-visible,
.gallery-compact:focus-visible{
  outline:3px solid var(--color-accent);
  outline-offset:4px
}

.gallery-reading__actions{
  display:flex;
  justify-content:flex-start;
  margin-top:var(--space-4)
}

.evidence-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(min(100%,16rem),1fr));
  gap:var(--space-3);
  align-items:start
}

.evidence-grid article{
  display:grid;
  min-width:0;
  gap:var(--space-1);
  padding:var(--space-3);
  border-radius:var(--radius-md);
  background:var(--color-surface-2);
  color:var(--color-ink)
}

.evidence-grid__wide{
  grid-column:1 / -1
}

.evidence-grid__number{
  width:fit-content;
  max-width:100%;
  align-self:flex-start;
  color:var(--color-primary);
  font:700 var(--fs-3)/1 var(--font-mono)
}

.evidence-grid h3{
  font-weight:700
}

.evidence-grid p{
  color:var(--color-muted)
}

.evidence-note{
  margin-top:var(--space-4);
  background:var(--color-light);
  color:var(--color-ink)
}

.evidence-note .c-note__icon svg{
  width:1.25rem;
  height:1.25rem
}

.evidence-note .c-note-row>div{
  display:grid;
  min-width:0;
  gap:var(--space-1)
}

.evidence-note h3{
  font-weight:700
}

.evidence-note p{
  color:var(--color-muted)
}

.gallery-closing{
  padding-top:var(--space-6);
  padding-bottom:var(--space-3)
}

.gallery-closing__card{
  background:var(--color-dark);
  color:#f9f4ee
}

.gallery-closing__copy{
  display:grid;
  max-width:46rem;
  gap:var(--space-1)
}

.gallery-closing__copy .c-kicker{
  color:var(--color-accent-soft)
}

.gallery-closing__copy h2{
  font-weight:700
}

.gallery-closing__copy p{
  color:#c7c1cb
}

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

.gallery-closing__actions .c-btn{
  width:100%
}

.gallery-closing__actions .c-btn--ghost{
  color:#f9f4ee;
  border-color:color-mix(in srgb,currentColor 45%,transparent)
}

@media(max-width:64rem){
  .gallery-hero__grid{
    grid-template-columns:1fr;
    gap:var(--space-4)
  }

  .gallery-hero h1{
    max-width:24ch
  }

  .gallery-workbench svg{
    height:clamp(25rem,72vw,34rem)
  }

  .section-head{
    grid-template-columns:1fr;
    gap:var(--space-3);
    align-items:start
  }

  .gallery-section-title h2{
    max-width:24ch
  }

  .ci-chain{
    grid-template-columns:repeat(2,minmax(0,1fr))
  }

  .ai-case__grid{
    grid-template-columns:1fr
  }

  .gallery-magazine{
    grid-template-columns:1fr
  }

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

  .gallery-feature{
    min-height:27rem
  }
}

@media(max-width:48rem){
  .gallery-hero,
  .page-section{
    padding-block:var(--space-5)
  }

  .gallery-hero__facts{
    grid-template-columns:1fr
  }

  .gallery-hero__facts div+div{
    border-top:1px solid var(--line-paper);
    border-left:0
  }

  .gallery-workbench svg{
    height:auto;
    min-height:25rem
  }

  .ci-chain{
    grid-template-columns:1fr
  }

  .remote-ledger__head{
    flex-direction:column
  }

  .remote-ledger__status{
    max-width:100%
  }

  .remote-ledger__rows>div{
    grid-template-columns:1fr
  }

  .remote-ledger__rows p{
    grid-column:auto
  }

  .ai-budget__list>div{
    grid-template-columns:1fr;
    gap:var(--space-1)
  }

  .gallery-magazine__side,
  .gallery-rest{
    grid-template-columns:1fr
  }

  .gallery-compact--full{
    grid-column:auto
  }

  .gallery-closing{
    padding-top:var(--space-5);
    padding-bottom:var(--space-3)
  }
}

@media(max-width:24.375rem){
  .gallery-hero{
    padding-block:var(--space-4)
  }

  .gallery-hero h1{
    font-size:2.25rem
  }

  .gallery-hero__actions{
    width:100%
  }

  .gallery-hero__actions .c-btn{
    width:100%;
    white-space:normal
  }

  .gallery-workbench svg{
    min-height:22rem
  }

  .build-command__label{
    flex-direction:column
  }

  .gallery-feature{
    min-height:31rem
  }

  .gallery-feature__mark{
    width:9rem;
    height:9rem
  }

  .gallery-compact{
    flex-direction:column
  }

  .gallery-compact__media{
    width:100%;
    height:10rem;
    flex-basis:10rem
  }

  .gallery-closing__actions{
    width:100%;
    min-width:0
  }
}

@media(prefers-reduced-motion:reduce){
  .gallery-feature,
  .gallery-story,
  .gallery-compact{
    transition:none
  }

  .gallery-feature:hover,
  .gallery-story:hover,
  .gallery-compact:hover{
    transform:none
  }
}
