/* Website Lab · Batch A · 2026-08-25
   The demonstration is the page: four complete strategic websites for one
   clearly fictional company. No preview frame, no explanatory module deck. */

.lab {
  --lab-ink: #f5f4ee;
  --lab-muted: #a9adb9;
  --lab-line: rgba(255,255,255,.13);
  --lab-accent: #a7b0ff;
  --lab-ease: cubic-bezier(.22,.9,.24,1);
  width: 100vw;
  margin-left: calc(50% - 50vw);
  overflow: clip;
  background: #080b10;
  color: var(--lab-ink);
}
.lab *, .lab *::before, .lab *::after { box-sizing: border-box; }
.lab button, .lab input, .lab select { font: inherit; }
.lab button { cursor: pointer; }
.lab [hidden] { display: none !important; }
.sr-only { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }

/* Jemke control layer */
.lab-switch {
  width: min(1380px, 94vw);
  margin-inline: auto;
  padding: clamp(5.4rem,10vh,8rem) 0 clamp(1.5rem,4vh,2.5rem);
}
.lab-switch__intro { display: grid; grid-template-columns: minmax(0,1fr) minmax(260px,.55fr); gap: 1rem 3rem; align-items: end; }
.lab-switch__eyebrow {
  grid-column: 1/-1; color: var(--lab-accent); font-family: var(--font-heading);
  font-weight: 800; font-size: .68rem; letter-spacing: .16em; text-transform: uppercase;
}
.lab-switch h1 {
  margin: 0; max-width: 19ch; font-family: var(--font-heading); font-weight: 800;
  letter-spacing: -.045em; line-height: 1; font-size: clamp(2rem,4.8vw,4.6rem);
}
.lab-switch__intro p { margin: 0; color: var(--lab-muted); line-height: 1.65; max-width: 44ch; }
.lab-tabs { display: grid; grid-template-columns: repeat(4,1fr); gap: 1px; margin-top: clamp(1.6rem,4vh,2.6rem); background: var(--lab-line); border: 1px solid var(--lab-line); }
.lab-tab {
  min-height: 76px; display: flex; align-items: center; gap: .75rem; justify-content: center;
  border: 0; background: #10141b; color: #d7dae3; font-family: var(--font-heading); font-weight: 700;
  transition: background .25s var(--lab-ease), color .25s var(--lab-ease), transform .25s var(--lab-ease);
}
.lab-tab span { color: #7d8595; font-size: .68rem; letter-spacing: .08em; }
.lab-tab:hover { background: #171d27; }
.lab-tab.is-active { background: #f2f0e8; color: #141619; }
.lab-tab.is-active span { color: #4a4f59; }
.lab-tab:focus-visible, .lab-reset:focus-visible, .lab-outro button:focus-visible, .lab-outro a:focus-visible { outline: 3px solid #9da9ff; outline-offset: 3px; }
.lab-switch__meta { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-top: .8rem; color: #858c9a; font-size: .75rem; }
.lab-reset { border: 0; background: transparent; color: #b8bdc8; text-decoration: underline; text-underline-offset: 3px; padding: .45rem; }
.lab-canvas { position: relative; min-height: 900px; background: #fff; transition: opacity .2s var(--lab-ease), transform .2s var(--lab-ease); }
.lab-canvas.is-switching { opacity: .25; transform: translateY(8px); }

/* Shared Musterbau primitives */
.mb-site { min-height: 100vh; color: var(--mb-ink); background: var(--mb-bg); overflow: hidden; }
.mb-site button:focus-visible, .mb-site input:focus-visible, .mb-site select:focus-visible { outline: 3px solid var(--mb-focus); outline-offset: 3px; }
.mb-nav {
  position: relative; z-index: 10; min-height: 78px; padding: 0 clamp(1rem,4vw,4rem);
  display: flex; align-items: center; gap: clamp(.8rem,2.8vw,2.8rem); border-bottom: 1px solid var(--mb-line);
  background: var(--mb-nav-bg); color: var(--mb-ink);
}
.mb-brand { display: inline-flex; align-items: center; gap: .65rem; border: 0; background: transparent; color: inherit; padding: .4rem 0; font-family: var(--font-heading); font-weight: 800; }
.mb-brand__mark { width: 32px; height: 32px; display: grid; place-items: center; color: var(--mb-brand-mark); background: var(--mb-brand-bg); border-radius: var(--mb-brand-radius,6px); }
.mb-brand small { display: block; font-size: .58rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; opacity: .66; }
.mb-nav__links { display: flex; gap: clamp(.5rem,2vw,1.8rem); margin-left: auto; }
.mb-nav__links button { border: 0; background: transparent; color: inherit; padding: .75rem .2rem; font-size: .8rem; }
.mb-nav__action { border: 0; border-radius: var(--mb-action-radius,999px); background: var(--mb-action-bg); color: var(--mb-action-ink); padding: .72rem 1.1rem; font-family: var(--font-heading); font-weight: 700; font-size: .8rem; }
.mb-section-head > span, .lead-request__intro > span, .lead-team > div > span, .self-guides__copy > span, .editorial-case > header > span, .editorial-team > div > span, .editorial-talk > div > span {
  display: block; margin-bottom: .6rem; font-family: var(--font-heading); font-weight: 800; font-size: .65rem; letter-spacing: .15em; text-transform: uppercase; color: var(--mb-accent);
}
.mb-section-head h3, .lead-request h3, .lead-team h3, .self-guides h3, .editorial-case h3, .editorial-team h3, .editorial-talk h3 {
  margin: 0; font-family: var(--font-heading); font-weight: 800; letter-spacing: -.035em; line-height: 1.08; font-size: clamp(1.7rem,3.7vw,3.35rem);
}
.mb-button { border: 0; border-radius: 999px; padding: .82rem 1.25rem; font-family: var(--font-heading); font-weight: 800; font-size: .84rem; }
.mb-actions { display: flex; flex-wrap: wrap; gap: .65rem; }
.mb-footer { min-height: 130px; padding: 2rem clamp(1rem,5vw,5rem); display: flex; align-items: center; gap: 1rem 2rem; border-top: 1px solid var(--mb-line); }
.mb-footer b { font-family: var(--font-heading); font-size: 1.05rem; }
.mb-footer span { color: var(--mb-muted); font-size: .82rem; }
.mb-footer button { margin-left: auto; border: 0; background: transparent; color: inherit; font-family: var(--font-heading); font-weight: 800; }

/* A — conversion website */
.mb-lead {
  --mb-bg:#f4efe5; --mb-ink:#1d211b; --mb-muted:#63695f; --mb-line:rgba(29,33,27,.16);
  --mb-accent:#9a4a18; --mb-focus:#c95f1a; --mb-nav-bg:#f7f2e9; --mb-action-bg:#222820; --mb-action-ink:#fff;
  --mb-brand-bg:#d15d18; --mb-brand-mark:#fff;
  font-family: var(--font-body);
}
.lead-hero { position: relative; min-height: min(780px,78vh); display: flex; align-items: flex-end; color: #fff; background: #25261f; }
.lead-hero__media, .lead-hero__media img, .lead-hero__shade { position: absolute; inset: 0; width: 100%; height: 100%; }
.lead-hero__media img { object-fit: cover; object-position: center 48%; }
.lead-hero__shade { background: linear-gradient(90deg,rgba(18,22,16,.86) 0%,rgba(18,22,16,.48) 48%,rgba(18,22,16,.08) 78%),linear-gradient(0deg,rgba(10,12,9,.55),transparent 45%); }
.lead-hero__copy { position: relative; z-index: 2; width: min(720px,88vw); margin: 0 0 clamp(3rem,8vh,6.5rem) clamp(1rem,7vw,7rem); }
.lead-kicker { font-family: var(--font-heading); font-weight: 800; font-size: .7rem; letter-spacing: .16em; text-transform: uppercase; color: #ffc28d; }
.lead-hero h2 { max-width: 13ch; margin: .9rem 0 1rem; font-family: var(--font-heading); font-weight: 800; letter-spacing: -.05em; line-height: .96; font-size: clamp(2.5rem,6.2vw,6rem); }
.lead-hero p { max-width: 52ch; margin: 0 0 1.5rem; color: rgba(255,255,255,.86); line-height: 1.65; }
.mb-button--sun { background: #a9440c; color: #fff; }
.mb-button--glass { border: 1px solid rgba(255,255,255,.5); background: rgba(20,24,18,.35); color: #fff; backdrop-filter: blur(8px); }
.lead-hero__proof { position: absolute; z-index: 2; right: clamp(1rem,5vw,5rem); bottom: clamp(1.4rem,4vh,3rem); display: grid; grid-template-columns: auto auto; gap: .1rem .6rem; padding: 1rem 1.2rem; border-left: 2px solid #e56b1f; background: rgba(17,20,15,.66); backdrop-filter: blur(12px); }
.lead-hero__proof b { font-family: var(--font-heading); font-size: 1.25rem; }.lead-hero__proof span { align-self: center; font-size: .68rem; color: rgba(255,255,255,.73); }
.lead-projects, .lead-services, .lead-request { padding: clamp(4rem,9vh,8rem) clamp(1rem,6vw,6rem); }
.lead-projects { background: #1e241d; color: #f5f2e9; }
.lead-projects .mb-section-head > span { color: #f2a164; }
.lead-project-grid { display: grid; grid-template-columns: 1.35fr .82fr .82fr; gap: .85rem; margin-top: 2rem; }
.lead-project { position: relative; min-height: 360px; border: 0; padding: 0; overflow: hidden; background: #111; color: #fff; text-align: left; }
.lead-project img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; filter: saturate(.78) brightness(.72); transition: transform .5s var(--lab-ease), filter .35s; }
.lead-project:hover img, .lead-project.is-selected img { transform: scale(1.035); filter: saturate(.92) brightness(.88); }
.lead-project > span { position: absolute; inset: auto 1rem 1rem; z-index: 2; display: grid; gap: .2rem; }
.lead-project b { font-family: var(--font-heading); font-size: 1.1rem; }.lead-project small { color: rgba(255,255,255,.74); }
.lead-project.is-selected { box-shadow: inset 0 0 0 3px #e56b1f; }
.lead-project-detail { display: grid; grid-template-columns: .7fr 1.5fr auto; gap: 1rem 2rem; align-items: center; padding: 1.4rem 0 0; color: #c7cec2; }
.lead-project-detail span { color: #f2a164; font-family: var(--font-heading); font-weight: 800; }.lead-project-detail p { margin: 0; line-height: 1.55; }.lead-project-detail b { color: #fff; font-size: .85rem; }
.lead-services { background: #f4efe5; }
.lead-service-layout { display: grid; grid-template-columns: minmax(220px,.55fr) minmax(0,1.45fr); gap: clamp(2rem,6vw,6rem); margin-top: 2rem; }
.lead-service-tabs { display: grid; align-content: start; border-top: 1px solid var(--mb-line); }
.lead-service-tabs button { padding: 1rem .2rem; border: 0; border-bottom: 1px solid var(--mb-line); background: transparent; color: var(--mb-muted); text-align: left; font-family: var(--font-heading); font-weight: 700; }
.lead-service-tabs button.is-active { color: var(--mb-accent); padding-left: 1rem; }
.lead-service-answer { min-height: 330px; padding: clamp(1.5rem,4vw,3.5rem); background: #fff; border-radius: 0 48px 0 0; box-shadow: 0 22px 55px rgba(47,39,25,.08); }
.lead-service-answer > span { color: var(--mb-accent); font-weight: 800; font-size: .72rem; text-transform: uppercase; letter-spacing: .12em; }
.lead-service-answer h4 { margin: 1rem 0; max-width: 18ch; font-family: var(--font-heading); font-size: clamp(1.5rem,3vw,2.6rem); line-height: 1.05; }
.lead-service-answer p { max-width: 54ch; line-height: 1.7; color: var(--mb-muted); }
.lead-service-answer button { margin-top: 1rem; border: 0; border-bottom: 2px solid var(--mb-accent); background: transparent; color: var(--mb-ink); padding: .5rem 0; font-weight: 800; }
.lead-request { display: grid; grid-template-columns: minmax(240px,.65fr) minmax(0,1.35fr); gap: clamp(2rem,7vw,7rem); color: #fff; background: #a6420d; }
.lead-request__intro p { max-width: 38ch; color: #fff; line-height: 1.65; }.lead-request__intro > span { color: #fff; }
.lead-form { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; align-content: start; }
.lead-form label { display: grid; gap: .4rem; font-size: .75rem; font-weight: 700; }
.lead-form input, .lead-form select { width: 100%; min-height: 52px; border: 1px solid rgba(255,255,255,.34); border-radius: 8px; background: rgba(117,41,3,.22); color: #fff; padding: .75rem; }
.lead-form select option { color: #1d211b; }.lead-form input::placeholder { color: rgba(255,255,255,.74); }
.mb-button--ink { background: #20251f; color: #fff; }.mb-text-button { border: 0; background: transparent; color: #fff; text-decoration: underline; text-underline-offset: 3px; }
.lead-success { align-self: center; padding: 2rem; background: #fff; color: #1d211b; }.lead-success > span { color: #317149; font-weight: 800; }.lead-success h3 { margin: .7rem 0; }.lead-success p { color: #5d645b; }
.lead-team { display: grid; grid-template-columns: 1.25fr .75fr; min-height: 620px; background: #e3dacb; }
.lead-team picture, .lead-team img { width: 100%; height: 100%; }.lead-team img { object-fit: cover; }
.lead-team > div { align-self: center; padding: clamp(2rem,6vw,6rem); }.lead-team p { color: #4c534a; line-height: 1.7; }
.mb-footer--lead { background: #f7f2e9; }

/* B — service portal */
.mb-admin {
  --mb-bg:#eaf0f2; --mb-ink:#10222a; --mb-muted:#60727a; --mb-line:rgba(16,34,42,.14);
  --mb-accent:#0a6b72; --mb-focus:#087f88; --mb-nav-bg:#10232c; --mb-action-bg:#78decf; --mb-action-ink:#0c2528;
  --mb-brand-bg:#78decf; --mb-brand-mark:#0c2528; --mb-action-radius:7px;
}
.mb-nav--admin { color: #edf8f8; --mb-line:rgba(255,255,255,.13); }
.admin-hero { display: grid; grid-template-columns: minmax(320px,.82fr) minmax(0,1.18fr); min-height: 600px; background: #10232c; color: #f2fbfa; }
.admin-hero__copy { align-self: center; padding: clamp(2rem,6vw,6rem); }
.admin-kicker { color: #78decf; font-family: var(--font-heading); font-size: .68rem; font-weight: 800; letter-spacing: .15em; text-transform: uppercase; }
.admin-hero h2 { margin: 1rem 0; max-width: 10ch; font-family: var(--font-heading); font-weight: 800; letter-spacing: -.045em; line-height: .98; font-size: clamp(2.5rem,5.8vw,5.7rem); }
.admin-hero p { color: #aec2c6; max-width: 42ch; line-height: 1.65; }
.admin-hero__image, .admin-hero__image img { width: 100%; height: 100%; }.admin-hero__image img { object-fit: cover; filter: saturate(.7) contrast(1.05); }
.admin-status-form { margin-top: 2rem; max-width: 520px; }.admin-status-form > label { display: block; margin-bottom: .45rem; color: #d8e8e8; font-size: .76rem; font-weight: 700; }
.admin-status-form > div { display: grid; grid-template-columns: 1fr auto; }.admin-status-form input { min-height: 54px; border: 1px solid #41616a; border-radius: 7px 0 0 7px; background: #0c1d25; color: #fff; padding: .8rem; letter-spacing: .08em; text-transform: uppercase; }
.admin-status-form button { border: 0; border-radius: 0 7px 7px 0; background: #78decf; color: #0c2528; padding: .8rem 1.1rem; font-weight: 800; }.admin-status-form small { display: block; margin-top: .45rem; color: #8ca4aa; }
.admin-status { margin: -2rem auto 0; width: min(1160px,92vw); position: relative; z-index: 3; border-radius: 14px; background: #fff; color: #10222a; box-shadow: 0 25px 70px rgba(8,35,44,.18); padding: clamp(1.5rem,4vw,3rem); }
.admin-status__head { display: flex; gap: 1rem; justify-content: space-between; align-items: start; }.admin-status__head span { color: #0a6b72; font-family: var(--font-heading); font-weight: 800; }.admin-status__head h3 { margin: .25rem 0; font-family: var(--font-heading); font-size: 1.5rem; }.admin-status__head p { margin: 0; color: #60727a; }
.admin-status__head > strong { border-radius: 99px; padding: .55rem .8rem; background: #d9f4ee; color: #075b56; font-size: .76rem; }
.admin-timeline { display: grid; grid-template-columns: repeat(4,1fr); list-style: none; padding: 0; margin: 2rem 0; counter-reset: step; }
.admin-timeline li { position: relative; display: grid; gap: .3rem; padding: 1.2rem .8rem .2rem 0; border-top: 2px solid #d8e0e3; color: #78878d; font-size: .78rem; }.admin-timeline li::before { content: ""; position: absolute; width: 12px; height: 12px; border-radius: 50%; top: -7px; left: 0; background: #c4cfd2; }.admin-timeline li.is-done, .admin-timeline li.is-active { border-color: #0a8582; color: #19383f; }.admin-timeline li.is-done::before,.admin-timeline li.is-active::before { background: #0a8582; }.admin-timeline li.is-active::before { box-shadow: 0 0 0 6px rgba(10,133,130,.15); }
.admin-next { display: grid; grid-template-columns: 1fr auto; gap: .25rem 1rem; align-items: center; padding: 1rem; border-radius: 8px; background: #eff6f7; }.admin-next span { color: #60727a; font-size: .72rem; }.admin-next button { grid-row: 1/3; grid-column: 2; border: 1px solid #0a6b72; border-radius: 6px; background: #fff; color: #0a6b72; padding: .65rem .9rem; font-weight: 800; }
.admin-actions, .admin-docs { padding: clamp(4rem,9vh,7rem) clamp(1rem,6vw,6rem); }
.admin-action-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 1rem; margin-top: 2rem; }
.admin-action-grid button { min-height: 190px; display: grid; align-content: space-between; text-align: left; border: 1px solid var(--mb-line); border-radius: 10px; background: #fff; color: var(--mb-ink); padding: 1.2rem; }
.admin-action-grid button:hover { border-color: #0a6b72; transform: translateY(-2px); }.admin-action-grid span { color: #0a6b72; font-size: 1.6rem; }.admin-action-grid b { font-family: var(--font-heading); font-size: 1rem; }.admin-action-grid small { color: var(--mb-muted); }
.admin-action-panel { position: relative; margin-top: 1rem; padding: clamp(1.3rem,4vw,2.5rem); border-radius: 10px; background: #10232c; color: #fff; }
.admin-action-panel__close { position: absolute; top: .6rem; right: .7rem; border: 0; background: transparent; color: #fff; font-size: 1.6rem; }.admin-action-panel h4 { margin: .5rem 0 1.3rem; font-family: var(--font-heading); font-size: 1.5rem; }.admin-action-panel > div > span { color: #78decf; font-size: .7rem; text-transform: uppercase; letter-spacing: .12em; }
.admin-action-panel form { display: grid; grid-template-columns: 1fr 1fr auto; gap: .8rem; align-items: end; }.admin-action-panel label { display: grid; gap: .35rem; font-size: .75rem; }.admin-action-panel input,.admin-action-panel select { min-height: 46px; border: 1px solid #4e6b72; border-radius: 6px; background: #0b1b22; color: #fff; padding: .7rem; }.admin-action-panel form button,.admin-action-panel [data-admin-upload] { min-height: 46px; border: 0; border-radius: 6px; background: #78decf; color: #0c2528; padding: .7rem 1rem; font-weight: 800; }
.admin-upload { max-width: 520px; padding: 1rem; border: 1px dashed #5e8188; border-radius: 8px; }.admin-upload input { margin-top: .5rem; }.admin-upload b { color: #a9c0c4; font-weight: 400; }
.admin-action-result { min-height: 1.3em; color: #9de9dc; }
.admin-docs { background: #dce6e9; }.admin-doc-list { display: grid; gap: .6rem; margin-top: 2rem; }.admin-doc-list button { display: grid; grid-template-columns: 44px 1fr auto; gap: 1rem; align-items: center; border: 0; border-bottom: 1px solid #bdcdd2; background: transparent; color: var(--mb-ink); padding: 1rem .3rem; text-align: left; }.admin-doc-list button > span { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 6px; background: #fff; color: #0a6b72; font-size: .68rem; font-weight: 800; }.admin-doc-list small { color: #465b63; }.admin-docs > p { color: #0a6b72; font-weight: 700; }
.mb-footer--admin { color: #edf8f8; background: #10232c; --mb-line:rgba(255,255,255,.15); --mb-muted:#9fb5b9; }

/* C — self-service knowledge site */
.mb-self {
  --mb-bg:#edf6ef; --mb-ink:#15342b; --mb-muted:#59736a; --mb-line:rgba(21,52,43,.14);
  --mb-accent:#17694d; --mb-focus:#17694d; --mb-nav-bg:#f7fbf7; --mb-action-bg:#174f3c; --mb-action-ink:#fff;
  --mb-brand-bg:#d7e8a2; --mb-brand-mark:#173b2f; --mb-brand-radius:50%;
}
.self-hero { position: relative; min-height: 650px; display: grid; place-items: center; overflow: hidden; }
.self-hero__image, .self-hero__image img { position: absolute; inset: 0; width: 100%; height: 100%; }.self-hero__image img { object-fit: cover; filter: saturate(.68) brightness(.73); }
.self-hero::after { content: ""; position: absolute; inset: 0; background: linear-gradient(rgba(11,38,29,.25),rgba(11,38,29,.68)); }
.self-hero__copy { position: relative; z-index: 2; width: min(900px,90vw); text-align: center; color: #fff; }
.self-hero__copy > span { font-family: var(--font-heading); font-size: .7rem; font-weight: 800; letter-spacing: .15em; text-transform: uppercase; color: #d8efa1; }
.self-hero h2 { margin: .8rem 0 1.3rem; font-family: var(--font-heading); font-size: clamp(2.5rem,6.3vw,6.2rem); letter-spacing: -.05em; line-height: .95; }
.self-search { display: grid; grid-template-columns: 1fr auto; width: min(760px,100%); margin-inline: auto; border-radius: 999px; background: #fff; padding: .45rem; box-shadow: 0 22px 60px rgba(4,27,19,.3); }
.self-search input { min-height: 58px; border: 0; background: transparent; color: #15342b; padding: .7rem 1rem; outline: none; }.self-search input::placeholder { color: #65796f; }.self-search button { width: 58px; height: 58px; border: 0; border-radius: 50%; background: #174f3c; color: #fff; font-size: 1.4rem; }
.self-suggestions { display: flex; justify-content: center; flex-wrap: wrap; gap: .45rem; margin-top: 1rem; }.self-suggestions button { border: 1px solid rgba(255,255,255,.45); border-radius: 99px; background: rgba(10,35,27,.32); color: #fff; padding: .55rem .8rem; backdrop-filter: blur(6px); font-size: .76rem; }
.self-answer { width: min(1080px,92vw); margin: -2.2rem auto 0; position: relative; z-index: 4; display: grid; grid-template-columns: 1.4fr .6fr; gap: 2rem; border-radius: 18px; background: #fff; box-shadow: 0 25px 65px rgba(25,62,48,.16); padding: clamp(1.5rem,4vw,3rem); color: #15342b; }
.self-answer > div > span { color: #17694d; font-size: .7rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }.self-answer h3 { margin: .6rem 0; max-width: 24ch; font-family: var(--font-heading); font-size: clamp(1.5rem,3vw,2.55rem); line-height: 1.05; }.self-answer p { color: #59736a; line-height: 1.7; }
.self-answer aside { display: grid; align-content: center; gap: .6rem; padding-left: 1.5rem; border-left: 1px solid #dbe7df; }.self-answer aside > span { color: #59736a; font-size: .72rem; }.self-answer aside button { border: 0; border-radius: 7px; background: #e5f1e9; color: #174f3c; padding: .75rem; text-align: left; font-weight: 800; }
.self-paths { padding: clamp(4rem,9vh,8rem) clamp(1rem,6vw,6rem); }.self-path-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: .8rem; margin-top: 2rem; }.self-path-grid button { min-height: 230px; display: grid; align-content: space-between; text-align: left; border: 0; border-radius: 70px 10px 10px 10px; background: #f8fcf8; color: #15342b; padding: 1.4rem; box-shadow: 0 12px 36px rgba(21,52,43,.07); }.self-path-grid button:hover { background: #dcebd7; }.self-path-grid span { color: #4c6856; font-size: .7rem; }.self-path-grid b { font-family: var(--font-heading); font-size: 1.05rem; }.self-path-grid small { color: #59736a; }
.self-guides { display: grid; grid-template-columns: .8fr 1.2fr; gap: 1rem 5rem; padding: clamp(4rem,9vh,7rem) clamp(1rem,6vw,6rem); background: #173b2f; color: #f0f8f2; }.self-guides__copy > span { color: #d8efa1; }.self-guides__copy p { color: #afc6bb; line-height: 1.7; }.self-guides ol { list-style: none; margin: 0; padding: 0; }.self-guides li { display: grid; grid-template-columns: .65fr 1fr; padding: .9rem 0; border-bottom: 1px solid rgba(255,255,255,.14); }.self-guides li span { color: #afc6bb; }.self-guides > button { justify-self: start; border: 0; border-radius: 99px; background: #d8efa1; color: #18392e; padding: .8rem 1rem; font-weight: 800; }.self-guides > p { color: #d8efa1; }
.self-contact { padding: 2rem clamp(1rem,6vw,6rem); background: #dcebd7; color: #15342b; }.self-contact form { display: grid; grid-template-columns: 1fr 1fr auto; gap: .8rem; align-items: end; }.self-contact label { display: grid; gap: .35rem; font-size: .75rem; }.self-contact input { min-height: 48px; border: 1px solid #9db3a4; border-radius: 7px; background: #fff; padding: .7rem; }.self-contact button { min-height: 48px; border: 0; border-radius: 7px; background: #174f3c; color: #fff; padding: .7rem 1rem; font-weight: 800; }
.mb-footer--self { background: #f7fbf7; }

/* D — editorial expertise site */
.mb-editorial {
  --mb-bg:#eee5d8; --mb-ink:#2b2119; --mb-muted:#5b4b40; --mb-line:rgba(43,33,25,.17);
  --mb-accent:#8e3e24; --mb-focus:#a44729; --mb-nav-bg:#eee5d8; --mb-action-bg:transparent; --mb-action-ink:#2b2119;
  --mb-brand-bg:#2b2119; --mb-brand-mark:#f5eee4; --mb-brand-radius:0; --mb-action-radius:0;
  font-family: Georgia, "Times New Roman", serif;
}
.mb-editorial .mb-nav { font-family: var(--font-body); }.mb-editorial .mb-nav__action { border-bottom: 1px solid #2b2119; padding-inline: 0; }
.editorial-hero { position: relative; min-height: min(900px,86vh); color: #fff; background: #211b16; }
.editorial-hero picture, .editorial-hero img { position: absolute; inset: 0; width: 100%; height: 100%; }.editorial-hero img { object-fit: cover; }
.editorial-hero::after { content: ""; position: absolute; inset: 0; background: linear-gradient(0deg,rgba(28,18,12,.78),transparent 62%); }
.editorial-hero__caption { position: absolute; z-index: 2; left: clamp(1rem,6vw,6rem); bottom: clamp(2rem,7vh,6rem); width: min(820px,88vw); }
.editorial-hero__caption > span { font-family: var(--font-body); font-size: .7rem; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; color: #f1bc9f; }.editorial-hero h2 { margin: .8rem 0; font-family: Georgia,serif; font-weight: 400; letter-spacing: -.045em; line-height: .95; font-size: clamp(2.7rem,6.6vw,6.8rem); }.editorial-hero p { max-width: 54ch; color: rgba(255,255,255,.82); line-height: 1.65; }.editorial-hero button { border: 0; border-bottom: 1px solid #fff; background: transparent; color: #fff; padding: .55rem 0; font-family: var(--font-body); font-weight: 800; }
.editorial-case { padding: clamp(5rem,12vh,10rem) clamp(1rem,6vw,6rem); }.editorial-case > header { display: grid; grid-template-columns: .55fr 1.1fr .85fr; gap: 2rem; align-items: start; margin-bottom: 3rem; }.editorial-case > header > span { color: #8e3e24; }.editorial-case > header p { margin: 0; color: #5b4b40; line-height: 1.75; }
.editorial-case__visual { position: relative; min-height: 720px; overflow: hidden; background: #211b16; }.editorial-case__visual > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.editorial-pin { position: absolute; z-index: 3; width: 42px; height: 42px; border: 1px solid #fff; border-radius: 50%; background: rgba(33,24,18,.6); color: #fff; font-family: var(--font-body); font-weight: 800; backdrop-filter: blur(6px); }.editorial-pin.is-active { background: #fff; color: #2b2119; }.editorial-pin--one { left: 22%; top: 56%; }.editorial-pin--two { left: 53%; top: 23%; }.editorial-pin--three { right: 18%; top: 47%; }
.editorial-note { position: absolute; z-index: 2; right: 2rem; bottom: 2rem; width: min(380px,calc(100% - 4rem)); padding: 1.4rem; background: #eee5d8; color: #2b2119; box-shadow: 0 22px 60px rgba(20,12,8,.25); }.editorial-note span { color: #8e3e24; font-family: var(--font-body); font-size: .67rem; font-weight: 800; text-transform: uppercase; letter-spacing: .12em; }.editorial-note b { display: block; margin: .7rem 0; font-size: 1.15rem; }.editorial-note p { margin: 0; color: #5b4b40; line-height: 1.55; font-size: .86rem; }
.editorial-projects { display: grid; grid-template-columns: 1fr 1fr; gap: 1px; background: #bdb0a0; }.editorial-projects article { display: grid; grid-template-columns: auto 1fr; gap: .3rem 1rem; padding: clamp(2rem,5vw,5rem); background: #f5eee4; }.editorial-projects article > span { grid-row: 1/4; color: #8e3e24; font-family: var(--font-body); font-size: .68rem; }.editorial-projects h3 { margin: 0; font-family: Georgia,serif; font-weight: 400; font-size: clamp(1.7rem,3vw,3rem); }.editorial-projects p { color: #77675a; line-height: 1.6; }.editorial-projects img { grid-column: 1/-1; width: 100%; aspect-ratio: 16/9; object-fit: cover; margin-top: 1rem; filter: saturate(.7); }
.editorial-team { display: grid; grid-template-columns: 1.25fr .75fr; min-height: 680px; background: #2b2119; color: #f6efe6; }.editorial-team picture,.editorial-team img { width: 100%; height: 100%; }.editorial-team img { object-fit: cover; filter: saturate(.6); }.editorial-team > div { align-self: center; padding: clamp(2rem,6vw,6rem); }.editorial-team > div > span { color: #f1bc9f; }.editorial-team p { color: #cbbfb3; line-height: 1.75; }.editorial-team button { border: 0; border-bottom: 1px solid #f6efe6; background: transparent; color: #f6efe6; padding: .55rem 0; font-family: var(--font-body); font-weight: 800; }
.editorial-talk { display: grid; grid-template-columns: .75fr 1.25fr; gap: 2rem 6rem; padding: clamp(4rem,10vh,8rem) clamp(1rem,6vw,6rem); }.editorial-talk p { color: #5b4b40; line-height: 1.7; }.editorial-talk form { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; align-content: start; }.editorial-talk label { display: grid; gap: .4rem; font-family: var(--font-body); font-size: .75rem; }.editorial-talk input,.editorial-talk select { min-height: 52px; border: 0; border-bottom: 1px solid #8f8174; background: transparent; color: #2b2119; padding: .7rem 0; }.editorial-talk form button { border: 1px solid #2b2119; background: #2b2119; color: #fff; padding: .75rem; font-family: var(--font-body); font-weight: 800; }.editorial-talk form button[type="reset"] { background: transparent; color: #2b2119; }.editorial-talk > p { grid-column: 2; color: #8e3e24; font-weight: 700; }
.mb-footer--editorial { background: #ded2c2; }

/* Jemke ending */
.lab-outro { width: min(1100px,90vw); margin-inline: auto; padding: clamp(4.5rem,10vh,8rem) 0; text-align: center; }
.lab-outro > span { color: #a7b0ff; font-family: var(--font-heading); font-size: .68rem; font-weight: 800; letter-spacing: .15em; text-transform: uppercase; }.lab-outro h2 { margin: .8rem auto 1.5rem; max-width: 16ch; font-family: var(--font-heading); font-size: clamp(2rem,4.5vw,4rem); line-height: 1; letter-spacing: -.04em; }
.lab-outro__goals { display: flex; flex-wrap: wrap; justify-content: center; gap: .5rem; }.lab-outro__goals button { border: 1px solid #3c4350; border-radius: 99px; background: #11161e; color: #e8eaf0; padding: .7rem 1rem; }.lab-outro > a { display: inline-flex; margin-top: 1.5rem; border-radius: 99px; background: #e9e7df; color: #171a20; padding: .85rem 1.2rem; text-decoration: none; font-family: var(--font-heading); font-weight: 800; }.lab-outro > p { color: #7e8592; font-size: .72rem; }

@media (max-width: 900px) {
  .lab-switch__intro { grid-template-columns: 1fr; }.lab-switch__eyebrow { grid-column: auto; }
  .lab-tabs { grid-template-columns: 1fr 1fr; }
  .mb-nav { flex-wrap: wrap; padding-block: .7rem; }.mb-nav__links { order: 3; width: 100%; overflow-x: auto; justify-content: flex-start; }.mb-nav__action { margin-left: auto; }
  .lead-hero { min-height: 680px; }.lead-hero__copy { margin-left: 6vw; }.lead-hero__proof { display: none; }
  .lead-project-grid { grid-template-columns: 1fr 1fr; }.lead-project--wide { grid-column: 1/-1; }.lead-project { min-height: 300px; }
  .lead-project-detail { grid-template-columns: 1fr; }
  .lead-request, .lead-team, .admin-hero, .self-guides, .editorial-team, .editorial-talk { grid-template-columns: 1fr; }
  .admin-hero__image { max-height: 480px; }.admin-status { margin-top: 1rem; }
  .admin-action-panel form, .self-contact form { grid-template-columns: 1fr; }
  .self-path-grid { grid-template-columns: 1fr 1fr; }
  .editorial-case > header { grid-template-columns: 1fr 1fr; }.editorial-case > header p { grid-column: 2; }
  .editorial-projects { grid-template-columns: 1fr; }.editorial-talk > p { grid-column: auto; }
}

@media (max-width: 620px) {
  .lab-switch { width: 90vw; padding-top: 5.5rem; }.lab-switch h1 { font-size: clamp(2rem,11vw,3.2rem); }
  .lab-tabs { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; }.lab-tab { flex: 0 0 76%; min-height: 64px; scroll-snap-align: start; }
  .lab-switch__meta { align-items: flex-start; flex-direction: column; }
  .mb-nav { min-height: 68px; }.mb-nav__links { gap: 1rem; }.mb-nav__links button { white-space: nowrap; }.mb-brand small { display: none; }
  .lead-hero { min-height: 650px; align-items: flex-end; }.lead-hero__shade { background: linear-gradient(0deg,rgba(18,22,16,.9),rgba(18,22,16,.05) 80%); }.lead-hero__copy { width: 88vw; margin: 0 auto 2.5rem; }.lead-hero h2 { font-size: clamp(2.4rem,13vw,4.4rem); }.mb-actions { display: grid; }
  .lead-project-grid { grid-template-columns: 1fr; }.lead-project--wide { grid-column: auto; }.lead-project { min-height: 260px; }
  .lead-service-layout, .lead-form { grid-template-columns: 1fr; }.lead-service-answer { min-height: 0; border-radius: 0 28px 0 0; }
  .lead-team { min-height: 0; }.lead-team picture { height: 420px; }
  .mb-footer { align-items: flex-start; flex-direction: column; }.mb-footer button { margin-left: 0; }
  .admin-hero { min-height: 0; }.admin-hero__copy { padding-block: 4rem; }.admin-hero h2 { font-size: clamp(2.5rem,13vw,4rem); }.admin-hero__image { height: 360px; }
  .admin-status__head { display: grid; }.admin-status__head > strong { justify-self: start; }.admin-timeline { grid-template-columns: 1fr; margin-left: .4rem; }.admin-timeline li { border-top: 0; border-left: 2px solid #d8e0e3; padding: .2rem 0 1.5rem 1rem; }.admin-timeline li::before { left: -7px; top: .25rem; }.admin-next { grid-template-columns: 1fr; }.admin-next button { grid-column: auto; grid-row: auto; }
  .admin-action-grid, .self-path-grid { grid-template-columns: 1fr; }.admin-action-grid button { min-height: 150px; }.admin-doc-list button { grid-template-columns: 44px 1fr; }.admin-doc-list small { grid-column: 2; }
  .self-hero { min-height: 600px; }.self-hero h2 { font-size: clamp(2.6rem,14vw,4.6rem); }.self-search input { min-width: 0; }.self-answer { grid-template-columns: 1fr; }.self-answer aside { padding: 1.2rem 0 0; border: 0; border-top: 1px solid #dbe7df; }
  .self-guides li { grid-template-columns: 1fr; gap: .2rem; }
  .editorial-hero { min-height: 700px; }.editorial-hero h2 { font-size: clamp(2.6rem,13vw,4.8rem); }
  .editorial-case > header { grid-template-columns: 1fr; }.editorial-case > header p { grid-column: auto; }.editorial-case__visual { min-height: 600px; }.editorial-note { right: 1rem; bottom: 1rem; width: calc(100% - 2rem); }
  .editorial-projects article { padding-inline: 1rem; }.editorial-team picture { height: 430px; }.editorial-talk form { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: reduce) {
  .lab-canvas, .lab-tab, .lead-project img { transition: none; }
  .lead-project:hover img, .lead-project.is-selected img { transform: none; }
  .lab { scroll-behavior: auto; }
}