/* Final layer, loaded last on every work page.
   It removes decorative defaults that made the site read as generated:
   glows and grid textures behind sections, a coloured word in every heading,
   fade-in on scroll, a gradient progress bar and side accent bars.
   Corners stay square, as in the rest of the identity.
   One typeface (Manrope) everywhere; DM Mono is kept for code samples. */

/* ── Flat section backgrounds ──────────────────────────────── */
body.work-page .work-hero,body.work-page .work-guide,body.work-page .inquiry-page-hero,body.work-page .conversion-close,body.work-page .work-references,body.work-page .plus-close { background:#090b0a; }
body.work-page .shopify-services,body.work-page .project-diagnostic { background:#0b0e0c; }
body.work-page .solution-paths { background:#0a0d0b; }
body.work-page .collaboration-flow { background:#090b0a; }
body.work-page .conversion-case,body.work-page .case-study,body.case-page { background:var(--case-canvas); }
body.work-page .work-hero::after,body.work-page .work-hero::before,body.work-page .shopify-services::after,body.work-page .solution-paths::after { display:none; }
body.work-page .collaboration-steps::before { background:var(--line); }
body.work-page .plus-hero-card { background:#0d100e; }
body.work-page .plus-hero-card::before,body.work-page .plus-timeline article::before { display:none; }
body.work-page .plus-verdict article,body.work-page .plus-path,body.work-page .plus-cost-figures div { background:#0d100e; }
body.work-page .plus-path-primary { background:rgba(var(--commerce-rgb),.07); }
body.work-page .plus-path:hover { transform:none; background:rgba(var(--commerce-rgb),.05); }
body.work-page .ac-answer { background:#0b0f10; }
body.work-page .nav-wrap>nav { background-image:none; }

/* No progress bar and no fade-in: content is simply there. */
.scroll-progress { display:none; }
.reveal,.reveal.visible { opacity:1; transform:none; transition:none; }

/* ── Headings: one solid colour ────────────────────────────── */
/* The accent stays in the page's main h1 only. */
body.work-page h2 em,body.work-page h2 em * { color:inherit; text-shadow:none; }

/* ── Square corners ────────────────────────────────────────── */
.project-showcase .project-gallery > .media-frame,.case-media .video-duo > .media-frame { border-radius:2px; }
.project-showcase .media-caption-text,.case-media .media-caption-text,
.project-showcase .media-toggle,.case-media .media-toggle { border-radius:2px; }

/* ── Play / pause chip: icon optically centred ─────────────────
   The visually empty label still took part in the flex gap and pushed the
   glyph off centre. The play triangle is nudged right by its optical centre. */
.project-showcase .media-toggle,.case-media .media-toggle { gap:0; line-height:0; }
.project-showcase .media-toggle::before,.case-media .media-toggle::before { margin:0; }
.project-showcase .media-toggle:not([data-playing="true"])::before,
.case-media .media-toggle:not([data-playing="true"])::before { margin-left:2px; }

/* ── Notes as tinted panels, not side bars ─────────────────── */
.sim-lever { border-left:0; background:rgba(var(--commerce-rgb),.07); }

/* Cards don't jump on hover; the border change is enough. */
.solution-path-list article:hover,.work-reference:hover,.plus-path:hover,.work-brand-item:hover { transform:none; }

/* Buttons: sentence case, one weight. */
.work-hero-primary,.work-hero-secondary,.plus-cta-primary,.plus-cta-ghost,.case-action,.case-more,
.flow-action,.conversion-close-actions a,.sim-prev,.sim-next,.ac-help a,.plus-card-link {
  font-family:"Manrope",sans-serif; font-weight:600; font-size:14px; letter-spacing:0; text-transform:none;
}

/* ── Section heads: one layout everywhere ─────────────────────
   Heading on the left, its short intro on the right, aligned to the same
   top line. No small label above each heading: the heading says it. The
   page hero keeps its one context line. */
body.work-page .work-index { display:none; }
body.work-page :is(.work-hero,.plus-hero,.case-hero) .work-index { display:block; }
@media (min-width:900px) {
  body.work-page :is(.projects-intro,.work-references-head) {
    display:grid; grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr); gap:48px; align-items:end;
  }
  body.work-page :is(.projects-intro,.work-references-head) > h2 { grid-column:1; margin:0; }
  body.work-page :is(.projects-intro,.work-references-head) > p { grid-column:2; margin:0; max-width:440px; justify-self:end; }
}

/* One accent for headings across the site: lime. Cyan stays for the agent's
   voice inside the walkthrough only. */
body.agentic-page .ac-hero h1 em { color:var(--commerce); }