/* Shared plain-language layer for the 15 non-website case-study demos. */
.simple-note{
  width:min(1120px,calc(100% - 2rem));
  margin:1.5rem auto 2.5rem;
  padding:1.25rem 1.4rem;
  border:1px solid rgba(225,224,204,.18);
  border-radius:16px;
  background:rgba(225,224,204,.07);
  color:#e1e0cc;
}
.simple-note strong{
  display:block;
  margin-bottom:.75rem;
  color:#bd775e;
  font:700 .72rem/1.2 "JetBrains Mono",monospace;
  letter-spacing:.16em;
  text-transform:uppercase;
}
.simple-note ol{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:.8rem;
  margin:0;
  padding:0;
  list-style:none;
  counter-reset:simple-step;
}
.simple-note li{
  counter-increment:simple-step;
  font:400 .95rem/1.45 "Almarai",sans-serif;
  color:rgba(225,224,204,.74);
}
.simple-note li::before{
  content:counter(simple-step) ". ";
  color:#e1e0cc;
  font-weight:800;
}
.simple-end{
  width:min(1120px,calc(100% - 2rem));
  margin:2.5rem auto;
  padding-top:1.5rem;
  border-top:1px solid rgba(225,224,204,.16);
  display:flex;
  justify-content:space-between;
  gap:1rem;
  flex-wrap:wrap;
}
.simple-end a{
  color:#e1e0cc;
  font:700 .76rem/1.3 "JetBrains Mono",monospace;
  letter-spacing:.08em;
  text-transform:uppercase;
  text-decoration:none;
}
.simple-end a:last-child{color:#bd775e}

/* Keep the working example; remove the long sales/research layers from view. */
body[data-simple="standard"] main.shell>section:not(:first-of-type),
body[data-simple="standard"]>footer.foot,
body[data-simple="app"]>section:not(#forge),
body[data-simple="app"]>footer,
body[data-simple="brand"]>section:not(#lab),
body[data-simple="brand"]>.cta,
body[data-simple="brand"]>footer,
body[data-simple="motion"]>.shell>.sec:not(#studio),
body[data-simple="motion"]>.shell>.cta,
body[data-simple="motion"]>.shell>.foot,
body[data-simple="growth"] main>section:not(#sim),
body[data-simple="growth"]>footer.foot,
body[data-simple="automation"] .foot{
  display:none!important;
}
body[data-simple="standard"] .heroMeta,
body[data-simple="standard"] .cue,
body[data-simple="brand"] .hero .meta,
body[data-simple="app"] .notmpl{
  display:none!important;
}
body[data-simple="app"] #forge .rig,
body[data-simple="app"] #forge .rig>*{min-width:0;max-width:100%}

/* Keep each working example focused on one understandable action. */
body[data-simple="app"] #forge .ctrl-stack>.panel:last-child,
body[data-simple="app"] #forge .blog,
body[data-simple="app"] #forge .arch,
body[data-simple="app"] #forge .pv .bar,
body[data-simple="standard"] #concierge .console,
body[data-simple="standard"] #concierge .embed,
body[data-simple="standard"] #concierge .decknote,
body[data-simple="standard"] #forge .proofs,
body[data-simple="standard"] #forge .decknote,
body[data-simple="standard"] #forge .benchhead,
body[data-simple="standard"] #forge .bench,
body[data-simple="brand"] #lab .labkick,
body[data-simple="brand"] #lab .labmeta,
body[data-simple="brand"] #lab .labrow2,
body[data-simple="brand"] #lab .mocks,
body[data-simple="brand"] #lab .tglgrid,
body[data-simple="motion"] #studio .tlg,
body[data-simple="standard"] #bay .calc,
body[data-simple="standard"] #bay .smeta,
body[data-simple="standard"] #bay .decknote,
body[data-simple="standard"] #bay .pencil,
body[data-simple="standard"] #bay #voBtn,
body[data-simple="standard"] #bench .bench>.panel:first-child,
body[data-simple="standard"] #bench .decknote,
body[data-simple="standard"] #instrument .stats,
body[data-simple="standard"] #instrument .insp,
body[data-simple="standard"] #instrument .palettehint,
body[data-simple="standard"] #instrument .decknote,
body[data-simple="growth"] #sim .math,
body[data-simple="growth"] #sim .projgrid,
body[data-simple="standard"] #instrument .compose,
body[data-simple="standard"] #instrument #composeBtn,
body[data-simple="standard"] #instrument .brushrow,
body[data-simple="standard"] #instrument .grid>.panel:nth-child(2),
body[data-simple="standard"] #instrument .grid2,
body[data-simple="standard"] #rig .codebox,
body[data-simple="standard"] #rig .pmet,
body[data-simple="standard"] #rig .rignote,
body[data-simple="standard"] #rig .ethics,
body[data-simple="standard"] #rig .rude,
body[data-simple="standard"] #pipeline .codebox,
body[data-simple="standard"] #pipeline .pmet,
body[data-simple="standard"] #pipeline .rignote,
body[data-simple="standard"] #pipeline .ethics,
body[data-simple="standard"] #pipeline .rude,
body[data-simple="standard"] #rig .stage>.spanel:has(#circ),
body[data-simple="standard"] #desk .grid2,
body[data-simple="standard"] #desk .ribbon,
body[data-simple="standard"] #desk .assume,
body[data-simple="standard"] #desk .decknote,
body[data-simple="standard"] #instrument .iwrap>.panel:last-child,
body[data-simple="standard"] #instrument .verdict{
  display:none!important;
}

body[data-simple="standard"] #concierge .coregrid,
body[data-simple="standard"] #bench .bench,
body[data-simple="standard"] #instrument .flowgrid,
body[data-simple="standard"] #instrument .grid,
body[data-simple="standard"] #instrument .iwrap,
body[data-simple="standard"] #rig .stage:has(#finput){
  grid-template-columns:minmax(0,1fr)!important;
}
body[data-simple="standard"] #concierge .chatw{max-width:760px;margin-inline:auto}
body[data-simple="automation"] .grid>.panel:first-child{display:none!important}
body[data-simple="automation"] .grid{grid-template-columns:minmax(0,1fr)!important}

@media(max-width:680px){
  .simple-note{margin:1rem auto 1.75rem;padding:1rem}
  .simple-note ol{grid-template-columns:1fr;gap:.45rem}
  .simple-note li{font-size:.88rem}
  .simple-end{margin:1.75rem auto 2.5rem;flex-direction:column}
  body[data-simple="standard"] #cohort{min-width:0!important;width:100%;font-size:.52rem}
}