/* Adel Labs sub-pages in the landing's language.
   Tokens, base, type, links and buttons, the segmented control, header, phone menu, panels, disclosures, tables,
   project cards, contact and footer follow the landing. The rest maps the sub-page classes onto those
   components. The header is always the floating pill here: no film sits behind it. The landing's heading and label
   scale sets the type; its rooms (a soft bronze light and a fine grain in every section) close the sheet. */

/* ══════════ tokens (the landing's) ══════════ */
:root{
  --font-sans:'Manrope',system-ui,-apple-system,'Segoe UI',Arial,sans-serif;
  --font-mono:'IBM Plex Mono',ui-monospace,SFMono-Regular,Consolas,monospace;
  --ease:cubic-bezier(.22,1,.36,1);
  --t-state:200ms;
  --t-reveal:600ms;
  --r-sm:6px;
  --r:12px;
  --r-pill:999px;
  --rail:1200px;
  --gutter:clamp(16px,4vw,40px);
  --section-y:clamp(52px,5.6vw,80px);
  --header-h:76px;
  --fs-h1:clamp(2.05rem,1.08rem + 4.4vw,5rem);
  --fs-h2:clamp(2.05rem,1.1rem + 3.05vw,3.9rem);
  --fs-h2-xl:clamp(2.3rem,1.1rem + 3.3vw,4rem);
  --fs-h3:clamp(1.1rem,1.01rem + .4vw,1.34rem);
  --fs-lead:clamp(1.02rem,.97rem + .25vw,1.15rem);
  --fs-lead-open:clamp(1.02rem,.9rem + .35vw,1.25rem);
  --fs-body:1rem;
  --fs-small:.9rem;
  --fs-micro:.72rem;
  --film-bg:#0b0c0e;
  --film-ink:#F1EFE9;
  --film-body:#d8d2c6;
  --film-accent:#E4B48A;
  --film-line:rgba(241,239,233,.14);
  --film-line-2:rgba(241,239,233,.26);
  --film-line-3:rgba(241,239,233,.45);
  --film-glass:rgba(13,14,17,.58);
  --film-plate:rgba(13,14,17,.93);
  --hi-edge:rgba(255,255,255,.18);
  --lit-edge:rgba(241,239,233,.34);
}
:root[data-appearance="dark"]{
  --bg:#0e1013;--bg-2:#111317;--surface:#15181d;--surface-2:#1b1f25;--surface-3:#232830;
  --ink:#F1EFE9;--body:#cfcabf;--muted:#9a9487;
  --line:rgba(241,239,233,.09);--line-2:rgba(241,239,233,.16);--line-3:rgba(241,239,233,.28);
  --accent:#B87942;--accent-hi:#E4B48A;--accent-deep:#825027;--accent-text:#E4B48A;
  --btn-bg:#B87942;--btn-bg-hover:#CD9161;--on-accent:#0e1013;
  --edge:rgba(255,255,255,.055);
  --shadow:rgba(0,0,0,.55);--glow:rgba(228,180,138,.26);--wash:rgba(184,121,66,.07);
  --pill-bg:rgba(17,19,23,.84);--pill-solid:#14171b;
  --plate-solid:#14171b;
  --field-line:#6f6b64;
  color-scheme:dark;
}
:root[data-appearance="black"]{
  --bg:#000;--bg-2:#050607;--surface:#0b0c0e;--surface-2:#111316;--surface-3:#191c21;
  --ink:#F1EFE9;--body:#cfcabf;--muted:#968f82;
  --line:rgba(241,239,233,.10);--line-2:rgba(241,239,233,.17);--line-3:rgba(241,239,233,.30);
  --accent:#B87942;--accent-hi:#E4B48A;--accent-deep:#825027;--accent-text:#E4B48A;
  --btn-bg:#B87942;--btn-bg-hover:#CD9161;--on-accent:#000;
  --edge:rgba(255,255,255,.05);
  --shadow:rgba(0,0,0,.7);--glow:rgba(228,180,138,.24);--wash:rgba(184,121,66,.06);
  --pill-bg:rgba(7,8,9,.86);--pill-solid:#08090b;
  --plate-solid:#08090b;
  --field-line:#6f6b64;
  --film-bg:#000;
  color-scheme:dark;
}
:root[data-appearance="light"]{
  --bg:#F4F1EA;--bg-2:#EEEAE0;--surface:#FAF8F3;--surface-2:#F2EEE5;--surface-3:#E7E1D5;
  --ink:#14171b;--body:#34332f;--muted:#5d574c;
  --line:rgba(20,23,27,.10);--line-2:rgba(20,23,27,.17);--line-3:rgba(20,23,27,.30);
  --accent:#B87942;--accent-hi:#9A5F2E;--accent-deep:#825027;--accent-text:#825027;
  --btn-bg:#825027;--btn-bg-hover:#6d421f;--on-accent:#FBF9F4;
  --edge:rgba(255,255,255,.75);
  --shadow:rgba(64,46,24,.16);--glow:rgba(184,121,66,.22);--wash:rgba(184,121,66,.07);
  --pill-bg:rgba(250,248,243,.9);--pill-solid:#FAF8F3;
  --plate-solid:#FBF9F4;
  --field-line:#7d786e;
  --lit-edge:rgba(255,255,255,1);
  color-scheme:light;
}

/* ══════════ base ══════════ */
*,*::before,*::after{box-sizing:border-box}
[hidden]{display:none!important}
html{background:var(--bg);-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:calc(var(--header-h) + 16px);overflow-x:clip;scrollbar-gutter:stable}
html.menu-open{overflow:hidden}
body{margin:0;background:var(--bg);color:var(--body);font-family:var(--font-sans);font-size:var(--fs-body);line-height:1.65;overflow-x:clip;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;transition:background-color var(--t-state) var(--ease),color var(--t-state) var(--ease)}
img,svg,canvas,video{display:block;max-width:100%}
img{height:auto}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer}
:where(h1,h2,h3,h4,p,ul,ol,dl,dd,figure,pre){margin:0}
:where(ul,ol){padding:0;list-style:none}
h1,h2,h3,h4{color:var(--ink);font-weight:700;font-style:normal;overflow-wrap:anywhere;min-width:0}
strong{color:var(--ink);font-weight:700}
::selection{background:var(--accent);color:var(--on-accent)}
:focus-visible{outline:2px solid var(--accent-text);outline-offset:3px;border-radius:var(--r-sm)}
.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}
.skip{position:absolute;left:16px;top:-100px;z-index:100;padding:12px 16px;background:var(--btn-bg);color:var(--on-accent);border-radius:var(--r-sm);font-weight:700}
.skip:focus{top:16px}
.rail,.wrap{width:100%;max-width:calc(var(--rail) + 2 * var(--gutter));margin-inline:auto;padding-inline:max(var(--gutter),env(safe-area-inset-left)) max(var(--gutter),env(safe-area-inset-right))}
.wrap .wrap{max-width:none;padding-inline:0}
.section{position:relative;padding-block:var(--section-y)}
/* the pointer light that site.js still creates belongs to the retired design */
.site-pointer-light{display:none!important}

/* ══════════ type ══════════ */
h1{font-size:var(--fs-h1);line-height:1;letter-spacing:-.04em;text-wrap:balance}
h2{font-size:var(--fs-h2);line-height:1.06;letter-spacing:-.03em;text-wrap:balance}
h3{font-size:var(--fs-h3);line-height:1.24;letter-spacing:-.018em}
h4{font-size:.98rem;line-height:1.35;letter-spacing:-.01em}
.lead{font-size:var(--fs-lead);line-height:1.62;color:var(--body);max-width:62ch}
main p,main li,main dd{max-width:70ch}
main p:not(.contact-email) a:not([class]),main dd a:not([class]),.about-source a{color:var(--ink);font-weight:700;background-image:linear-gradient(var(--accent),var(--accent));background-size:100% 1px;background-position:0 100%;background-repeat:no-repeat;transition:color var(--t-state) var(--ease)}
main p:not(.contact-email) a:not([class]):hover,main dd a:not([class]):hover,.about-source a:hover{color:var(--accent-text)}
.eyebrow,.breadcrumb,.breadcrumbs,.service-breadcrumbs,.case-label,.research-family,.step-number,.policy-num,.catalog-status,.collection-count,.service-evidence-label,.founder-title,.media-caption,.locus-delivery-label,.service-receive > span,.deliverable-check > summary{font-family:var(--font-mono);font-size:var(--fs-micro);letter-spacing:.12em;text-transform:uppercase;font-weight:500;color:var(--muted);line-height:1.5}
.eyebrow{display:flex;align-items:center;gap:10px}
.eyebrow::before{content:"";flex:none;width:7px;height:7px;border-radius:50%;border:1.5px solid var(--accent)}
/* inside panels and boxes the label reads like the landing's "What you receive" caption: accent, no ring */
:is(.service-card,.service-framing,.service-engagement,.workflow-proof-panel,.founder-context,.project-evidence-check,.work-starting-points,.locus-offer-heading,.agent-workflows,.service-evidence,.project-story) .eyebrow{color:var(--accent-text)}
:is(.service-framing,.service-engagement,.workflow-proof-panel,.founder-context,.project-evidence-check,.work-starting-points,.service-card) .eyebrow::before{content:none}

/* prose flow: zero specificity, so every component with its own gaps overrides it */
:where(main) :where(*) + :where(p,h2,h3,h4,ul,ol,dl,pre,table,figure,form,details,section,aside,.actions,.media,.service-table-scroll,.filters,.catalog-tools,.catalog-status,.catalog-grid,.catalog-groups,.faq-list,.workflow-grid,.project-facts,.agent-capabilities,.founder-profiles){margin-top:14px}
:where(main) :where(*) + :where(h2){margin-top:28px}
:where(main) :where(.eyebrow,.project-name,.research-family) + :where(h1,h2){margin-top:20px}
:where(main) :where(.eyebrow,.project-name,.research-family) + :where(h3){margin-top:12px}
:where(main) :where(*) + :where(h1){margin-top:16px}
:where(main) :where(h1) + :where(*){margin-top:20px}
:where(main) :where(h2,h3) + :where(p,ul,ol){margin-top:12px}
:where(main) :where(*) + :where(.actions){margin-top:28px}

/* ══════════ links & buttons ══════════ */
.tlink,.text-link{display:inline-flex;align-items:center;gap:6px;min-height:44px;color:var(--ink);font-weight:700;font-size:.95rem;line-height:1.35;text-align:left;background-image:linear-gradient(var(--accent),var(--accent));background-size:0 1px;background-position:0 100%;background-repeat:no-repeat;padding-bottom:2px;transition:background-size var(--t-reveal) var(--ease),color var(--t-state) var(--ease)}
.tlink:hover,.text-link:hover{background-size:100% 1px;color:var(--accent-text)}
.btn,.button{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:0 22px;border-radius:var(--r-pill);font-weight:700;font-size:.95rem;line-height:1.25;letter-spacing:-.005em;text-align:center;transition:background-color var(--t-state) var(--ease),color var(--t-state) var(--ease),border-color var(--t-state) var(--ease),transform var(--t-state) var(--ease)}
.btn{white-space:nowrap}
.button{padding-block:10px;max-width:100%}
.btn:active,.button:active{transform:scale(.98)}
.btn-primary,.button{background:var(--btn-bg);color:var(--on-accent);box-shadow:inset 0 1px 0 var(--hi-edge)}
.btn-primary:hover,.button:hover{background:var(--btn-bg-hover)}
.btn-quiet,.button.secondary{border:1px solid var(--line-2);color:var(--ink);background:var(--surface);box-shadow:none}
.btn-quiet:hover,.button.secondary:hover{border-color:var(--line-3);background:var(--surface-2)}
.btn-sm{min-height:40px;padding:0 16px;font-size:.88rem}
.actions{display:flex;flex-wrap:wrap;align-items:center;gap:12px 20px}
.actions > *{margin:0}

/* segmented control with a gliding pill (the landing's) */
.seg{--n:3;position:relative;display:inline-grid;grid-auto-flow:column;grid-auto-columns:1fr;padding:3px;border-radius:var(--r-pill);background:var(--surface);border:1px solid var(--line);box-shadow:inset 0 1px 0 var(--edge)}
.seg button{position:relative;z-index:1;min-height:34px;padding:0 12px;border-radius:var(--r-pill);font-size:.8rem;font-weight:700;color:var(--muted);white-space:nowrap;transition:color var(--t-state) var(--ease)}
.seg button[aria-pressed="true"],.seg button:hover{color:var(--ink)}
.seg-mark{position:absolute;z-index:0;top:3px;bottom:3px;left:3px;width:calc((100% - 6px) / var(--n));border-radius:var(--r-pill);background:var(--surface-3);box-shadow:inset 0 1px 0 var(--edge);transform:translateX(calc(var(--k,0) * 100%));transition:transform var(--t-reveal) var(--ease)}

/* ══════════ header: the landing's floating pill, always ══════════ */
.site-header{position:fixed;inset:0 0 auto 0;z-index:40;height:var(--header-h);color:var(--ink)}
.header-inner{position:relative;height:100%;max-width:calc(var(--rail) + 2 * var(--gutter));margin-inline:auto;padding-inline:max(var(--gutter),env(safe-area-inset-left)) max(var(--gutter),env(safe-area-inset-right));display:flex;align-items:center;gap:20px}
.hdr-pill{position:absolute;top:8px;bottom:8px;left:calc(var(--gutter) - 14px);right:calc(var(--gutter) - 14px);border-radius:var(--r-pill);background:var(--pill-bg);border:1px solid var(--line-2);-webkit-backdrop-filter:saturate(1.3) blur(16px);backdrop-filter:saturate(1.3) blur(16px);box-shadow:0 14px 34px -22px var(--shadow);overflow:hidden;pointer-events:none}
.progress{position:absolute;left:22px;right:22px;bottom:0;height:1px;overflow:hidden}
.progress-bar{display:block;height:100%;background:linear-gradient(90deg,transparent,var(--accent));transform-origin:0 50%;transform:scaleX(var(--p,0))}
.wordmark{position:relative;display:inline-flex;align-items:center;gap:10px;min-height:44px;color:inherit;font-weight:700;letter-spacing:-.01em;font-size:1.02rem;flex:none}
.nav{position:relative;display:flex;align-items:center;gap:2px;margin-inline:auto}
.nav a{position:relative;display:inline-flex;align-items:center;min-height:40px;padding:0 10px;font-size:.86rem;font-weight:700;color:var(--muted);white-space:nowrap;border-radius:var(--r-sm);transition:color var(--t-state) var(--ease)}
.nav a:hover,.nav a[aria-current="page"]{color:var(--ink)}
/* the landing's section underline; here it rests on the current section (placed once by the shell script, no glide) */
.nav-mark{position:absolute;left:0;bottom:4px;width:100px;height:2px;border-radius:2px;background:var(--accent);transform-origin:0 50%;transform:translateX(var(--nx,0px)) scaleX(var(--ns,0));opacity:var(--no,0)}
.header-tail{position:relative;display:flex;align-items:center;gap:14px;flex:none}
.site-header .seg{background:var(--surface);border-color:var(--line)}
.menu-toggle{display:none;min-height:44px;min-width:44px;padding:0 16px;border-radius:var(--r-pill);border:1px solid var(--line-2);font-weight:700;font-size:.88rem;color:inherit;background:var(--surface)}
.cta-short{display:none}
.mobile-nav{position:fixed;inset:var(--header-h) 0 0 0;z-index:39;background:var(--pill-solid);border-top:1px solid var(--line);padding-block:8px calc(24px + env(safe-area-inset-bottom));overflow:auto;overscroll-behavior:contain}
.mobile-nav .rail{display:flex;flex-direction:column}
.mobile-nav a{display:flex;align-items:center;min-height:52px;border-bottom:1px solid var(--line);color:var(--ink);font-weight:700;font-size:1.05rem}
.mobile-nav a[aria-current="page"]{color:var(--accent-text)}
.mobile-nav .seg{margin-top:24px;align-self:flex-start}
.seg-wide button{min-height:44px;padding:0 18px}

/* ══════════ page frame ══════════ */
main{display:block;padding-top:var(--header-h)}
/* top-level blocks meet edge to edge; their own padding sets the rhythm, so toned bands touch (the 404's main holds its text directly) */
main:not(.section) > *{margin-block:0}
main > :first-child{padding-top:clamp(24px,3vw,40px)}
main.wrap.section{padding-top:calc(var(--header-h) + clamp(24px,3vw,40px))}
:where(main) :where(p,h1,h2) + :where(.button){margin-top:24px}
main > .breadcrumbs:first-child{padding-top:clamp(20px,2.6vw,32px)}
main > .breadcrumbs + .section{padding-top:clamp(16px,2vw,24px)}
/* toned bands (the landing's alternation): full bleed behind a rail-wide block */
/* box-shadow and border-image outset are ink overflow: they paint full width without widening the page */
.project-workflow,.collection-next,.audit-service-compute,.enquiry-section{background:var(--bg-2);box-shadow:0 0 0 100vmax var(--bg-2);clip-path:inset(0 -100vmax);border-top:1px solid var(--line);border-image:linear-gradient(var(--line),var(--line)) 1 / 1px 0 0 0 / 0 100vmax}

/* breadcrumbs */
.breadcrumb,.breadcrumbs ol,.service-breadcrumbs ol{display:flex;flex-wrap:wrap;align-items:center;column-gap:10px}
.breadcrumb > span[aria-hidden]{color:var(--muted)}
:is(.breadcrumbs,.service-breadcrumbs) li{display:inline-flex;align-items:center;min-height:44px}
:is(.breadcrumbs,.service-breadcrumbs) li + li::before{content:"/";margin-right:10px;color:var(--muted)}
.breadcrumb a,.breadcrumbs a,.service-breadcrumbs a{display:inline-flex;align-items:center;min-height:44px;min-width:44px;color:var(--body);transition:color var(--t-state) var(--ease)}
.breadcrumb a:hover,.breadcrumbs a:hover,.service-breadcrumbs a:hover{color:var(--ink)}
:is(.breadcrumb,.breadcrumbs,.service-breadcrumbs) [aria-current]{color:var(--ink)}
.breadcrumb + *,.service-breadcrumbs + *{margin-top:6px}
.service-breadcrumbs{margin-bottom:6px}

/* page openings */
.page-intro .lead,.project-intro .lead,.service-opening-chapter .lead{max-width:64ch;font-size:var(--fs-lead-open);line-height:1.56}
.project-name{font-weight:700;font-size:1.15rem;color:var(--ink);letter-spacing:-.01em}

/* ══════════ panels (the landing's) ══════════ */
.panel,.service-card,.work-starting-points > a,.workflow-grid > article,.service-evidence,.locus-delivery > article,.founder-context > div,.project-evidence-check,.workflow-proof-panel,.agent-workflows,.collection-resources,.locus-location{position:relative;border-radius:var(--r);border:1px solid var(--line);background:linear-gradient(180deg,var(--surface-2),var(--surface) 62%);box-shadow:inset 0 1px 0 var(--edge)}
/* the receive box */
.service-receive,.service-framing > div,.project-facts > div,.founder-education,.service-supplement,.empty-state{border-radius:var(--r-sm);border:1px solid var(--line);background:var(--bg)}
.gloss,.scope-note,.project-note,.case-essential,.public-profile-note,.service-table-hint,.media-caption,.project-screen figcaption,.service-recording figcaption{font-size:var(--fs-small);line-height:1.62;color:var(--muted);max-width:64ch}
.media-caption{font-size:var(--fs-micro)}

/* ══════════ disclosures: the landing's box and plus; the content fades in ══════════ */
main details{border-radius:var(--r);border:1px solid var(--line);background:var(--surface);box-shadow:inset 0 1px 0 var(--edge);transition:border-color var(--t-state) var(--ease)}
main details[open]{border-color:var(--line-2)}
main summary{position:relative;display:block;min-height:60px;padding:17px 64px 17px 20px;cursor:pointer;list-style:none;border-radius:var(--r);color:var(--ink);font-weight:700;font-size:.98rem;letter-spacing:-.01em;line-height:1.35}
main summary::-webkit-details-marker{display:none}
main summary::after{content:"";position:absolute;right:16px;top:50%;width:32px;height:32px;margin-top:-16px;border-radius:50%;border:1px solid var(--line-2);background:linear-gradient(var(--ink),var(--ink)) center/12px 1.5px no-repeat,linear-gradient(var(--ink),var(--ink)) center/1.5px 12px no-repeat;transition:transform var(--t-reveal) var(--ease),border-color var(--t-state) var(--ease),background-color var(--t-state) var(--ease)}
main details[open] > summary::after{transform:rotate(45deg);border-color:var(--accent);background-color:var(--wash)}
.audit-disclosure > summary > span,.brief-details > summary > span{display:block;margin-top:2px;font-weight:400;color:var(--muted);font-size:.86rem;letter-spacing:0}
main details > :not(summary){margin-inline:20px}
main details > summary + *{margin-top:4px}
main details > :not(summary):last-child{margin-bottom:26px}
html.anim main details[open] > :not(summary){animation:acc-in var(--t-reveal) var(--ease) both}
@keyframes acc-in{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}
main details + details{margin-top:8px}
/* content lists inside prose */
main :not(nav) > ul:not([class]) > li,.deliverables > li{position:relative;padding-left:24px;line-height:1.55}
main :not(nav) > ul:not([class]) > li::before{content:"";position:absolute;left:5px;top:.62em;width:6px;height:6px;border-radius:50%;background:var(--line-3)}
main :not(nav) > ul:not([class]) > li + li,main :not(nav) > ol:not([class]) > li + li{margin-top:8px}
main :not(nav) > ol:not([class]){counter-reset:step}
main :not(nav) > ol:not([class]) > li{position:relative;padding-left:40px;line-height:1.55;counter-increment:step}
main :not(nav) > ol:not([class]) > li::before{content:counter(step,decimal-leading-zero);position:absolute;left:0;top:.2em;font-family:var(--font-mono);font-size:var(--fs-micro);letter-spacing:.08em;color:var(--accent-text)}

/* ══════════ tables (the landing's table-scroll) ══════════ */
.service-table-scroll{overflow-x:auto;border-radius:var(--r-sm);border:1px solid var(--line);background:var(--bg);scrollbar-width:thin;scrollbar-color:var(--line-3) transparent}
.service-mode-table{width:100%;min-width:720px;border-collapse:collapse;font-size:.88rem;line-height:1.5}
.service-mode-table th,.service-mode-table td{padding:13px 15px;text-align:left;vertical-align:top;border-bottom:1px solid var(--line)}
.service-mode-table tr:last-child > *{border-bottom:0}
.service-mode-table thead th{color:var(--ink);font-weight:700;background:var(--surface)}
.service-mode-table tbody th{color:var(--ink);font-weight:700;width:22%}
.service-mode-table td{color:var(--body)}

/* ══════════ media: the landing's poster frame, recording tag and round button ══════════ */
.media{position:relative;isolation:isolate;aspect-ratio:16 / 10!important;background:var(--film-bg);border-radius:var(--r);border:1px solid var(--line-2);overflow:hidden}
.media img,.media video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 0}
.media video{opacity:0;transition:opacity var(--t-reveal) var(--ease)}
.media.is-playing video{opacity:1}
.rec-tag{position:absolute;left:10px;top:10px;z-index:1;display:inline-flex;align-items:center;gap:6px;min-height:24px;padding:2px 9px;border-radius:var(--r-pill);background:var(--film-plate);border:1px solid var(--film-line-2);color:var(--film-body);font-family:var(--font-mono);font-size:var(--fs-micro);letter-spacing:.1em;text-transform:uppercase;opacity:0;pointer-events:none;transition:opacity var(--t-state) var(--ease)}
.rec-tag::before{content:"";width:5px;height:5px;border-radius:50%;background:var(--film-accent)}
.media.is-playing .rec-tag{opacity:1}
/* site.js writes "Play preview" / "Pause preview" into the button: the words stay its accessible name, the icon shows the state */
.media-button{position:absolute;right:10px;top:10px;z-index:2;display:inline-grid;place-items:center;width:44px;height:44px;border-radius:50%;border:1px solid var(--film-line-2);background:var(--film-glass);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);color:transparent;font-size:0;line-height:0;overflow:hidden;transition:border-color var(--t-state) var(--ease),background-color var(--t-state) var(--ease)}
.media-button:hover{border-color:var(--film-line-3);background:var(--film-plate)}
.media-button::before{content:"";width:13px;height:15px;margin-left:3px;background:var(--film-ink);clip-path:polygon(0 0,100% 50%,0 100%)}
.media-button[aria-pressed="true"]::before{width:12px;height:14px;margin-left:0;clip-path:none;background:linear-gradient(90deg,var(--film-ink) 0 34%,transparent 34% 66%,var(--film-ink) 66%)}
/* the focus ring sits on a dark halo so it reads over pale posters too */
.media-button:focus-visible{outline:2px solid var(--film-ink);outline-offset:2px;border-radius:50%;box-shadow:0 0 0 6px rgba(11,12,14,.72)}
@media (forced-colors:active){
  .media-button{width:auto;padding:0 12px;border-radius:22px;font-size:.8rem;line-height:1.2;color:ButtonText;background:ButtonFace}
  .media-button::before{display:none}
}

/* ══════════ project cards: the landing's li.project ══════════ */
.catalog-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
/* rows keep equal bottoms while every context is closed; an open one grows its own card only */
.catalog-grid:has(> .catalog-card > details.project-context[open]){align-items:start}
.catalog-card{position:relative;display:flex;flex-direction:column;gap:7px;min-width:0;border-radius:var(--r);border:1px solid var(--line);background:var(--surface);box-shadow:inset 0 1px 0 var(--edge);overflow:hidden;transition:border-color var(--t-state) var(--ease),transform var(--t-state) var(--ease)}
.catalog-card:hover,.catalog-card:focus-within{border-color:var(--line-3)}
.catalog-card:hover{transform:translateY(-2px)}
.catalog-card > *{margin:0 18px;min-width:0}
.catalog-card > .media{margin:0 0 8px;border:0;border-bottom:1px solid var(--line);border-radius:0}
.catalog-card > :last-child{margin-bottom:14px}
.catalog-card > .research-family,.catalog-card > .case-label{color:var(--accent-text)}
.catalog-card > .research-family + .case-label{margin-top:-5px}
.catalog-card > h3{font-size:1.06rem;line-height:1.3;letter-spacing:-.015em}
.catalog-card > p:not([class]){font-size:.88rem;line-height:1.52;color:var(--body)}
.project-caveat,.project-attribution{font-size:.83rem;line-height:1.5;color:var(--muted)}
.project-origin{align-self:flex-start;display:inline-flex;align-items:center;min-height:44px;margin-block:-11px -9px!important;font-size:.83rem;font-weight:700;color:var(--muted);background-image:linear-gradient(var(--line-3),var(--line-3));background-size:100% 1px;background-position:0 calc(50% + .8em);background-repeat:no-repeat;transition:color var(--t-state) var(--ease)}
.project-origin:hover{color:var(--ink)}
.project-card-actions,.project-child-links,.project-related-links,.project-resource-links{display:flex;flex-wrap:wrap;align-items:center;gap:0 20px}
.project-card-actions{margin-top:auto!important;padding-top:4px}
.catalog-card :is(.project-card-actions,.project-child-links,.project-related-links,.project-resource-links) .text-link{font-size:.9rem}
.project-child-links .text-link,.project-related-links .text-link,.project-resource-links .text-link{font-weight:700;color:var(--body)}
/* the context disclosure: compact, under the card */
.catalog-card > details.project-context{margin:4px 0 0;border:0;border-top:1px solid var(--line);border-radius:0;background:none;box-shadow:none}
.catalog-card > details.project-context:last-child{margin-bottom:0}
.project-context > summary{min-height:48px;padding:13px 56px 13px 18px;font-size:.88rem;border-radius:0}
.project-context > summary:focus-visible{outline-offset:-3px}
.project-context > summary::after{right:14px;width:28px;height:28px;margin-top:-14px;background-size:11px 1.5px,1.5px 11px}
.project-context > .project-context-body{margin:0 18px 16px}
.project-context-body > * + *{margin-top:12px}
.project-context-body dl{display:grid;gap:10px}
.project-context-body dt,.formal-project-title strong{display:block;font-family:var(--font-mono);font-size:var(--fs-micro);letter-spacing:.12em;text-transform:uppercase;font-weight:500;color:var(--accent-text)}
.project-context-body dd,.formal-project-title{margin-top:2px;font-size:.86rem;line-height:1.55;color:var(--body)}
.project-secondary-media > * + *{margin-top:8px}
.catalog-card > .project-related-links{margin-top:0}

/* ══════════ work: collection tabs, search, groups ══════════ */
.catalog-head{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:16px clamp(24px,5vw,80px);align-items:end}
.eyebrow + .catalog-head{margin-top:20px}
.catalog-head > *,.catalog-head > div > *{margin:0}
.catalog-head > div{display:grid;gap:12px}
.catalog-head h2{font-size:var(--fs-h3);letter-spacing:-.018em}
.catalog-head p,.collection-attribution{color:var(--body)}
.collection-attribution{font-size:var(--fs-small);color:var(--muted)}
.collection-case-links{display:flex;flex-wrap:wrap;gap:0 24px}
/* the filter row: the landing's work tabs, a static underline on the selected one; the row wraps instead of scrolling,
   so every tab and count stays in view at any width */
.filters{position:relative;display:flex;flex-wrap:wrap;column-gap:4px;border-bottom:1px solid var(--line)}
.filter{position:relative;display:inline-flex;align-items:center;gap:10px;flex:none;min-height:52px;padding:0 14px;font-weight:700;font-size:.93rem;color:var(--muted);white-space:nowrap;transition:color var(--t-state) var(--ease)}
.filter:first-child{padding-left:2px}
.filter > span{font-family:var(--font-mono);font-size:var(--fs-micro);letter-spacing:.1em;font-weight:500;color:var(--muted)}
.filter:hover,.filter[aria-current="page"],.filter[aria-pressed="true"]{color:var(--ink)}
.filter[aria-current="page"] > span,.filter[aria-pressed="true"] > span{color:var(--accent-text)}
.filter[aria-current="page"]::after,.filter[aria-pressed="true"]::after{content:"";position:absolute;left:14px;right:14px;bottom:0;height:2px;border-radius:2px;background:var(--accent-text)}
.filter:first-child::after{left:2px}
.catalog-tools{display:grid;gap:18px}
.catalog-tools > *{margin:0;min-width:0}
.catalog-search{display:flex;flex-wrap:wrap;align-items:center;gap:6px 14px;max-width:520px}
.search-wrap{flex:1 1 220px;min-width:0}
#clear-project-search{flex:none;white-space:nowrap}
.catalog-status{letter-spacing:.08em}
.catalog-status + *{margin-top:18px!important}
.empty-state{padding:18px 20px;color:var(--body)}
.collection-directory{margin-top:28px}
.collection-directory > .filters{margin:0 20px 18px;border-bottom:0}
.catalog-groups{display:grid;gap:0}
.catalog-groups > *{margin:0}
.collection-disclosure{border:0;border-top:1px solid var(--line-2);border-radius:0;background:none;box-shadow:none}
.collection-disclosure:last-of-type{border-bottom:1px solid var(--line-2)}
.collection-disclosure > summary{display:flex;align-items:baseline;flex-wrap:wrap;gap:4px 14px;min-height:76px;padding:22px 64px 22px 0;border-radius:0;font-size:clamp(1.2rem,1.05rem + .6vw,1.55rem);letter-spacing:-.02em}
.collection-disclosure > summary::after{right:0}
.collection-disclosure > .catalog-grid{margin:6px 0 36px}
.related-projects{margin-top:clamp(40px,5vw,64px)!important;padding-top:clamp(28px,3vw,40px);border-top:1px solid var(--line-2)}
.catalog-group-heading{display:grid;gap:10px;margin-bottom:24px}
.catalog-group-heading > *{margin:0}
.catalog-group-heading h2{font-size:clamp(1.3rem,1.05rem + .9vw,1.8rem)}
.catalog-group-heading p{color:var(--muted)}
.collection-resources{display:grid;gap:10px;justify-items:start;margin-top:clamp(32px,4vw,48px)!important;padding:clamp(20px,2.4vw,28px)}
.collection-resources > *{margin:0}
.collection-resources h2{font-size:var(--fs-h3)}
.work-starting-points{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:clamp(28px,3.4vw,44px)!important}
.work-starting-points > a{display:flex;flex-direction:column;gap:10px;padding:22px 20px 16px;transition:border-color var(--t-state) var(--ease),transform var(--t-state) var(--ease)}
.work-starting-points > a > *{margin:0}
.work-starting-points > a:hover{border-color:var(--line-3);transform:translateY(-2px)}
.work-starting-points h2{font-size:clamp(1.15rem,1.02rem + .45vw,1.35rem);line-height:1.2;letter-spacing:-.02em}
.work-starting-points p{font-size:.92rem;color:var(--body)}
.work-starting-points .text-link{margin-top:auto;font-size:.92rem}
.work-starting-points > a:hover .text-link{background-size:100% 1px;color:var(--accent-text)}

/* ══════════ forms (search, brief) ══════════ */
input[type="search"],input[type="text"],input:not([type]),select,textarea{display:block;width:100%;min-height:48px;margin:0;padding:11px 14px;border-radius:var(--r-sm);border:1px solid var(--field-line);background:var(--surface);color:var(--ink);font:inherit;font-size:1rem;line-height:1.45;box-shadow:inset 0 1px 0 var(--edge);transition:border-color var(--t-state) var(--ease)}
textarea{min-height:148px;resize:vertical}
select{-webkit-appearance:none;appearance:none;padding-right:44px;background-image:linear-gradient(45deg,transparent 50%,var(--muted) 50%),linear-gradient(135deg,var(--muted) 50%,transparent 50%);background-position:calc(100% - 23px) 52%,calc(100% - 17px) 52%;background-size:6px 6px,6px 6px;background-repeat:no-repeat}
select option{background:var(--surface);color:var(--ink)}
input:hover,select:hover,textarea:hover{border-color:var(--muted)}
input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--accent-text);outline-offset:2px;border-color:var(--muted)}
::placeholder{color:var(--muted);opacity:1}
input:user-invalid,select:user-invalid,textarea:user-invalid{border-color:var(--accent-text);box-shadow:0 0 0 1px var(--accent-text)}
#brief-form{display:grid;gap:18px}
#brief-form > *{margin:0}
#brief-form label{display:grid;gap:8px;color:var(--ink);font-weight:700;font-size:1rem;line-height:1.4}
#brief-form > p{font-size:var(--fs-small);color:var(--muted);margin-top:-8px}
#brief-form .brief-details{background:var(--bg)}
.brief-details > label{margin-top:14px!important}
#brief-form .button{justify-self:start;min-width:200px}
#brief-result{display:grid;gap:14px;padding:clamp(20px,2.4vw,28px);border-radius:var(--r);border:1px solid var(--line-2);background:var(--surface)}
#brief-result > *{margin:0}
#brief-result h2{font-size:var(--fs-h3)}
#brief-text{padding:16px 18px;border-radius:var(--r-sm);border:1px solid var(--line);background:var(--bg);color:var(--ink);font-family:var(--font-mono);font-size:.84rem;line-height:1.6;white-space:pre-wrap;overflow-wrap:anywhere}
#copy-status{color:var(--body)}

/* ══════════ services ══════════ */
.service-list{padding-bottom:var(--section-y)}
.service-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-template-rows:repeat(7,auto);gap:16px}
/* rows aligned across the set: every card spans the same seven rows, so each row of cards ends level */
.service-card{grid-row:span 7;display:grid;grid-template-rows:subgrid;row-gap:11px;padding:22px 18px 14px;overflow:hidden}
.service-card > *{margin:0}
.service-card::before{content:"";position:absolute;left:18px;right:18px;top:0;height:1px;background:linear-gradient(90deg,transparent,var(--lit-edge),transparent);pointer-events:none}
.service-card > .eyebrow:first-child{display:inline-grid;place-items:center;width:32px;height:32px;border-radius:50%;border:1px solid var(--line-2);letter-spacing:.04em}
.service-card h3{font-size:clamp(1.24rem,1.02rem + .5vw,1.5rem);line-height:1.16;letter-spacing:-.024em;text-wrap:balance}
.service-card > p:not([class]){font-size:.9rem;line-height:1.56}
.service-receive{align-self:end;padding:12px 14px;color:var(--ink);font-size:.9rem;line-height:1.55}
.service-receive > span{display:block;margin-bottom:6px;color:var(--accent-text)}
.service-card .text-link{align-self:start;justify-self:start;font-size:.9rem}
.service-supplement{display:grid;gap:4px;justify-items:start;padding:12px 14px}
.service-supplement > *{margin:0}
.service-supplement p{font-size:.86rem;color:var(--muted)}
.service-bottom{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px 32px;margin-top:24px;padding-top:18px;border-top:1px solid var(--line)}
.service-bottom > *{margin:0}
.audit-service-compute{padding-block:var(--section-y)}
.audit-disclosure{background:var(--surface)}
.audit-disclosure > summary{min-height:72px;font-size:1.1rem}
.audit-disclosure > .audit-disclosure-body{margin-inline:0}
.locus-offer.section{padding-block:8px 8px}
.locus-offer .wrap{padding-inline:clamp(16px,2.4vw,28px)}
.locus-offer .wrap > * + *{margin-top:20px}
.locus-offer-heading{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:16px clamp(24px,4vw,56px);align-items:end}
.locus-offer-heading > *,.locus-offer-heading > div > *{margin:0}
.locus-offer-heading > div{display:grid;gap:12px}
.locus-offer-heading h2 span{color:var(--accent-text)}
.locus-delivery{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.locus-delivery > article{display:flex;flex-direction:column;gap:10px;padding:20px}
.locus-delivery > article > *{margin:0}
.locus-delivery-label{display:flex;flex-wrap:wrap;gap:4px 12px;color:var(--accent-text)}
.locus-delivery-label span + span{color:var(--muted)}
.locus-delivery-result{padding:12px 14px;border-radius:var(--r-sm);border:1px solid var(--line);background:var(--bg);color:var(--ink);font-size:.92rem}
.locus-offer-links{display:flex;flex-wrap:wrap;gap:0 22px;margin-top:auto!important}
.locus-location{display:grid;gap:8px;padding:18px 20px}
.locus-location > *{margin:0}
.locus-offer-close{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px 32px}
.locus-offer-close > *{margin:0}
/* service detail pages */
.service-detail > *{margin-top:clamp(40px,5vw,64px)}
.service-detail > :first-child{margin-top:0}
.service-detail > details + details,.service-detail > details + .service-disclosure{margin-top:10px}
.service-opening-chapter > *{margin-top:0}
.service-opening-chapter .eyebrow{margin-top:10px}
.service-opening-chapter h1{margin-top:14px}
.service-opening-chapter .lead{margin-top:20px}
.service-opening-chapter .actions{margin-top:28px}
.service-framing{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:clamp(32px,4vw,48px)!important;max-width:980px}
.service-framing > div{display:grid;gap:8px;align-content:start;padding:16px 18px}
.service-framing > div > *{margin:0}
.service-framing p:not(.eyebrow){color:var(--ink);font-size:.95rem;line-height:1.55}
.service-evidence{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);column-gap:clamp(24px,3.4vw,48px);row-gap:0;align-items:start;padding:clamp(20px,2.6vw,32px)}
.service-evidence > *{grid-column:2;margin:10px 0 0}
.service-evidence > .eyebrow:first-child{grid-column:1 / -1;margin:0 0 6px}
.service-evidence > .service-recording{grid-column:1;grid-row:2 / span 30}
.service-evidence-label{color:var(--accent-text);margin-top:10px!important}
.service-evidence > .eyebrow:first-child + .service-evidence-label{margin-top:0!important}
.service-recording > * + *{margin-top:10px}
.service-example{display:grid;gap:2px;padding:12px 14px;border-radius:var(--r-sm);border:1px solid var(--line);background:var(--bg);transition:border-color var(--t-state) var(--ease),background-color var(--t-state) var(--ease)}
.service-example:hover{border-color:var(--line-3);background:var(--surface-2)}
.service-example strong{display:inline-flex;gap:8px;font-size:1rem}
.service-example > span{font-size:.88rem;line-height:1.5;color:var(--body)}
.service-evidence .scope-note{margin-top:8px!important}
.related-label{margin-top:12px!important}
.collection-link{display:inline-flex;align-items:center;min-height:44px;justify-self:start;font-weight:700;font-size:.95rem;color:var(--ink);background-image:linear-gradient(var(--accent),var(--accent));background-size:0 1px;background-position:0 100%;background-repeat:no-repeat;transition:background-size var(--t-reveal) var(--ease),color var(--t-state) var(--ease)}
.collection-link:hover{background-size:100% 1px;color:var(--accent-text)}
.service-evidence > .collection-link + .collection-link{margin-top:-8px!important}
.scope-disclosure > summary,.service-proof > summary{min-height:72px;font-size:1.1rem}
.scope-disclosure > div > * + *{margin-top:14px}
.service-scope-intro{color:var(--body)}
.deliverables{display:grid;gap:0;margin-top:18px!important;border-top:1px solid var(--line)}
.deliverables > li{padding:14px 0 6px 28px;border-bottom:1px solid var(--line);max-width:none}
.deliverables > li::before{content:"";position:absolute;left:2px;top:1.25em;width:12px;height:12px;border-radius:50%;border:1.5px solid var(--accent)}
.deliverables > li > p{color:var(--ink);max-width:78ch}
.deliverable-check{margin-top:2px!important;border:0;background:none;box-shadow:none}
.deliverable-check > summary{display:inline-flex;align-items:center;min-height:44px;padding:0 40px 0 0;color:var(--accent-text);letter-spacing:.1em}
.deliverable-check > summary::after{right:0;width:26px;height:26px;margin-top:-13px;background-size:10px 1.5px,1.5px 10px}
.deliverable-check > :not(summary){margin:0 0 10px}
.service-check{padding:10px 14px;border-radius:var(--r-sm);border-left:2px solid var(--accent);background:var(--wash);color:var(--body);font-size:.92rem}
.service-engagement{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;padding:clamp(18px,2.4vw,28px);border-radius:var(--r);border:1px solid var(--line);background:var(--bg-2)}
.service-engagement > *{margin:0}
.service-engagement > div{display:grid;gap:8px;align-content:start;padding:4px 4px 8px}
.service-engagement > div > *{margin:0}
.service-engagement > details{grid-column:1 / -1}
.service-block > .eyebrow + h2{margin-top:12px}
.service-block > p:not([class]){color:var(--body)}
.service-block > details{margin-top:16px}
.service-block > details + details{margin-top:8px}
.service-proof ol{margin-top:16px}
/* the worked example: step buttons as the landing's segmented control, panels as its service panels */
.workflow-proof-nav{display:inline-grid;grid-auto-flow:column;grid-auto-columns:minmax(0,auto);gap:2px;margin-top:22px!important;padding:3px;border-radius:var(--r-pill);background:var(--surface);border:1px solid var(--line);box-shadow:inset 0 1px 0 var(--edge);max-width:100%}
.workflow-proof-nav button{min-height:44px;padding:0 16px;border-radius:var(--r-pill);font-size:.86rem;font-weight:700;color:var(--muted);white-space:nowrap;transition:color var(--t-state) var(--ease),background-color var(--t-state) var(--ease)}
.workflow-proof-nav button:hover{color:var(--ink)}
.workflow-proof-nav button[aria-pressed="true"]{color:var(--ink);background:var(--surface-3);box-shadow:inset 0 1px 0 var(--edge)}
.workflow-proof-panel{display:grid;gap:10px;margin-top:14px!important;padding:clamp(20px,2.4vw,28px);max-width:820px}
.workflow-proof-panel > *{margin:0}
.workflow-proof > .text-link{margin-top:10px}
.agent-workflows{display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.2fr);gap:14px clamp(28px,4vw,56px);padding:clamp(22px,2.6vw,34px)}
.agent-workflows > *{grid-column:1;margin:0}
.agent-workflows > .agent-capabilities{grid-column:2;grid-row:1 / span 4}
.agent-workflows > h3{font-size:clamp(1.3rem,1.05rem + .9vw,1.8rem);line-height:1.15}
.agent-capabilities{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px 28px;align-content:start}
.agent-capabilities article{padding:11px 0;border-top:1px solid var(--line)}
.agent-capabilities h4{font-size:.94rem}
.agent-capabilities p{margin-top:4px;font-size:.88rem;line-height:1.55;color:var(--muted)}
.agent-workflows > details{align-self:start}
/* FAQ */
.faq-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 20px;align-items:start;margin-top:clamp(22px,2.8vw,34px)!important}
.faq-list > details{margin:0}
.faq-list details > p{color:var(--body)}
.faq-list details > .text-link{margin-top:6px}

/* ══════════ projects ══════════ */
.project-intro{padding-bottom:clamp(28px,3.4vw,44px)}
.project-screen{padding-bottom:clamp(40px,5vw,64px)}
.project-screen figcaption{margin-top:12px}
.project-story{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px clamp(28px,5vw,80px);border-top:1px solid var(--line);border-image:linear-gradient(var(--line),var(--line)) 1 / 1px 0 0 0 / 0 100vmax}
.project-story > div > *{margin:0}
.project-story > div{display:grid;gap:12px;align-content:start}
.project-story > *{margin:0}
.workflow-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:clamp(24px,3vw,36px)!important}
@media (min-width:861px){.workflow-grid.workflow-grid-four{grid-template-columns:repeat(2,minmax(0,1fr))}}
.workflow-grid > article{display:grid;gap:10px;align-content:start;padding:22px 20px 20px}
.workflow-grid > article > *{margin:0}
.step-number{display:inline-grid;place-items:center;justify-self:start;width:40px;height:40px;border-radius:50%;border:1px solid var(--accent);color:var(--accent-text);letter-spacing:.04em}
.workflow-grid p{font-size:.94rem}
.project-facts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-top:16px!important}
.project-facts > div{padding:12px 14px}
.project-facts dt{font-family:var(--font-mono);font-size:var(--fs-micro);letter-spacing:.12em;text-transform:uppercase;font-weight:500;color:var(--accent-text)}
.project-facts dd{margin-top:6px;color:var(--ink);font-size:.9rem;line-height:1.55}
.project-note{margin-top:16px!important}
.project-evidence-check{display:grid;gap:10px;justify-items:start;margin-top:24px!important;padding:clamp(20px,2.4vw,28px);max-width:880px}
.project-evidence-check > *{margin:0}
.project-workflow > .actions{margin-top:24px}
.comfy-case-assets{margin-top:clamp(32px,4vw,48px)!important}
.comfy-case-assets h2{font-size:clamp(1.3rem,1.05rem + .9vw,1.8rem)}
.comfy-case-assets > div{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:18px}
.comfy-case-assets figure{margin:0}
.comfy-case-assets img{width:100%;aspect-ratio:4 / 5;object-fit:cover;border-radius:var(--r);border:1px solid var(--line-2);background:var(--film-bg)}
.comfy-case-assets figcaption{display:grid;gap:2px;margin-top:10px;font-size:.88rem;line-height:1.5;color:var(--muted)}

/* ══════════ founder ══════════ */
.about-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:clamp(32px,5vw,80px);align-items:start}
.about-grid > *{margin:0}
.about-grid figure{position:sticky;top:calc(var(--header-h) + 24px)}
.about-photo{width:100%;aspect-ratio:4 / 3;object-fit:cover;object-position:50% 30%;border-radius:var(--r);border:1px solid var(--line-2);background:var(--film-bg)}
.about-photo.about-portrait{aspect-ratio:1 / 1}
.about-source{margin-top:12px;font-size:.87rem;color:var(--muted);line-height:1.55}
.about-source a{display:inline-flex;align-items:center;min-height:44px;white-space:nowrap}
.about-grid > div > * + *{margin-top:14px}
.about-grid h1{margin-top:12px!important}
.about-grid .lead{margin-top:20px!important;color:var(--ink);font-weight:700}
.founder-title{color:var(--accent-text)!important}
/* the title breaks only between its two roles (the dot stays with the first) */
.founder-title .founder-role{white-space:nowrap}
.founder-profiles{display:flex;flex-wrap:wrap;gap:12px;margin-top:18px!important}
.founder-education{display:grid;grid-template-columns:auto minmax(0,1fr);gap:4px 24px;margin-top:clamp(32px,4vw,48px)!important;padding:16px 18px;max-width:880px}
.founder-education dt{color:var(--accent-text);font-family:var(--font-mono);font-size:var(--fs-micro);letter-spacing:.12em;text-transform:uppercase;font-weight:500;line-height:1.9}
.founder-education dd{color:var(--ink);font-size:.95rem}
.founder-context{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;align-items:start;margin-top:clamp(32px,4vw,48px)!important}
.founder-context > div{display:grid;gap:10px;align-content:start;justify-items:start;padding:clamp(20px,2.4vw,28px)}
.founder-context > div > *{margin:0}
.founder-context h2{font-size:clamp(1.3rem,1.05rem + .9vw,1.8rem)}

/* ══════════ start ══════════ */
.enquiry-section{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:18px clamp(32px,5vw,80px);align-items:start;padding-block:var(--section-y)}
.enquiry-section > *{margin:0;grid-column:2}
.enquiry-section > .enquiry-direct{grid-column:1;grid-row:1 / span 4;display:grid;gap:14px;justify-items:start}
.enquiry-direct > *{margin:0}
.enquiry-direct p{color:var(--body)}
.brief-next{display:flex;flex-wrap:wrap;gap:0 24px}
.brief-privacy a,.policy-contact a{display:inline-flex;align-items:center;min-height:44px}

/* ══════════ privacy and legal: a readable measure, numbered parts in mono ══════════ */
.policy{padding-bottom:var(--section-y)}
.policy-part{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2fr);gap:10px clamp(24px,4vw,64px);padding-block:26px;border-top:1px solid var(--line)}
.policy-part > *{margin:0}
.policy-part > p,.policy-part > ul{grid-column:2;max-width:70ch}
.policy-part h2{grid-column:1;display:grid;gap:8px;align-content:start;font-size:var(--fs-h3);letter-spacing:-.018em}
.policy-num{color:var(--accent-text)}
.policy-contact{max-width:none;margin-top:0!important;padding-top:26px;border-top:1px solid var(--line)}

/* ══════════ contact: the landing's, the text straight on the page ground (no plate, no band), no film ══════════ */
main > .contact{position:relative;padding-block:clamp(56px,7vw,100px)}
.contact .contact-inner{display:grid;gap:14px;justify-items:start;width:min(780px,calc(100% - 2 * var(--gutter)));max-width:none;margin-inline:max(var(--gutter),calc((100% - var(--rail)) / 2)) auto}
.contact-inner > *,.contact-inner > div > *{margin:0}
.contact-inner > div{display:grid;gap:14px;justify-items:start}
.contact h2{font-size:var(--fs-h2-xl);line-height:1.02;letter-spacing:-.035em}
.contact-inner > .actions,.contact-inner > .button{margin-top:10px}
.contact-inner .actions{gap:14px 28px}
.contact-email{margin-top:6px;color:var(--body);font-size:1.05rem}
.contact-email a{display:inline-flex;align-items:center;min-height:44px;color:var(--ink);font-weight:700;border-bottom:1px solid var(--accent)}

/* ══════════ footer (the landing's) ══════════ */
.site-footer{border-top:1px solid var(--line);background:var(--bg-2);padding-block:clamp(44px,5vw,64px) 28px}
.footer-statement{display:flex;align-items:center;gap:16px;color:var(--ink);font-weight:700;font-size:clamp(1.45rem,1rem + 1.7vw,2.3rem);line-height:1.1;letter-spacing:-.03em;text-wrap:balance}
.footer-statement img{flex:none;width:40px;height:40px}
.footer-inner{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2.2fr);gap:32px;margin-top:30px;padding-top:26px;border-top:1px solid var(--line)}
.footer-note{font-size:.88rem;color:var(--muted);max-width:32ch}
.footer-dir{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px}
.footer-dir h2{font-family:var(--font-mono);font-size:var(--fs-micro);letter-spacing:.12em;text-transform:uppercase;font-weight:500;color:var(--muted);margin-bottom:6px;line-height:1.5}
.footer-dir a{display:flex;align-items:center;min-height:36px;color:var(--body);font-size:.92rem;white-space:nowrap;transition:color var(--t-state) var(--ease)}
.footer-dir a:hover{color:var(--ink)}
.footer-legal{display:flex;flex-wrap:wrap;align-items:center;gap:6px 24px;margin-top:32px;padding-top:16px;border-top:1px solid var(--line);font-size:.85rem;color:var(--muted)}
.footer-legal a{display:inline-flex;align-items:center;min-height:36px}
.footer-legal a:hover{color:var(--ink)}

/* ══════════ rooms (the landing's): every section of a page has its own soft bronze light and a fine grain ══════════ */
/* The grain covers the whole page body; the toned bands carry their own over their own ground.
   Each block adds its light behind everything in it, so cards, panels, fields and plates keep their surfaces, and a
   light may spread past its block's edges without a seam (the page body clips it at the footer). Lights stay clear of
   the running text: the opening light hangs from the page's upper right, card grids take theirs from the side walls,
   the case screen from behind its frame, reading columns a faint one from the right wall, toned bands a low one from
   below and the contact band one beside its text. The grain is fainter than the landing's: these pages run long
   passages of small grey text directly on the ground, and the brightest speck under a line must still leave 4.5:1. */
:root{--grain:.6;--room-a:rgba(184,121,66,.11);--room-b:rgba(184,121,66,.06)}
:root[data-appearance="black"]{--grain:.7;--room-a:rgba(184,121,66,.1);--room-b:rgba(184,121,66,.05)}
:root[data-appearance="light"]{--grain:.5;--room-a:rgba(184,121,66,.1);--room-b:rgba(184,121,66,.06)}
/* phones: the same lights, softer, since every line runs the full width through them */
@media (max-width:699px){
  :root[data-appearance]{--room-a:rgba(184,121,66,.07);--room-b:rgba(184,121,66,.04)}
}
/* the light and grain layers never serve as the scroll anchor: a late font swap above an anchor jump then still keeps the
   target in place */
main{position:relative;isolation:isolate;overflow-y:clip}
main::after,main > :is(.project-workflow,.collection-next,.audit-service-compute,.enquiry-section)::after{content:"";position:absolute;inset:0 calc(50% - 50vw);z-index:-1;pointer-events:none;overflow-anchor:none;background:url(/assets/grain.0198a82dbfbe.png) repeat 0 0 / 128px 128px;opacity:var(--grain)}
main > :is(.project-workflow,.collection-next,.audit-service-compute,.enquiry-section){isolation:isolate}
main:not(.section) > *{position:relative}
main:not(.section) > *::before,main.section::before{content:"";position:absolute;top:var(--room-top,0px);bottom:var(--room-bottom,0px);left:calc(50% - 50vw);right:calc(50% - 50vw);z-index:-2;pointer-events:none;overflow-anchor:none;background:var(--room-light,none)}
/* the opening: the first block's light reaches from the top of the page at least 480 px down */
:where(main:not(.section) > :first-child){--room-top:calc(-1 * var(--header-h));--room-bottom:min(0px,calc(100% + var(--header-h) - 480px));--room-light:var(--room-open)}
:where(main.section){--room-light:var(--room-open)}
:root{--room-open:radial-gradient(900px 560px at 94% 0,var(--room-a),transparent 72%)}
main > section:has(> .catalog-head){--room-light:var(--room-open),radial-gradient(520px 900px at 100% 46%,var(--room-b),transparent 72%),radial-gradient(520px 900px at 0 80%,var(--room-b),transparent 72%)}
main > .service-detail{--room-light:var(--room-open),radial-gradient(520px 900px at 100% 56%,var(--room-b),transparent 72%)}
/* card grids: light from the side walls, seen between and around the cards */
main > .service-list{--room-light:radial-gradient(520px 760px at 100% 38%,var(--room-a),transparent 72%),radial-gradient(520px 760px at 0 72%,var(--room-b),transparent 72%)}
/* the case screen: light from behind the sides of its frame, ending above the frame's lower edge */
main > .project-screen{--screen-w:min(100vw - 2 * var(--gutter),var(--rail));--room-light:radial-gradient(300px calc(var(--screen-w) * .34) at calc(50% - var(--screen-w) / 2) calc(var(--screen-w) * .28),var(--room-a),transparent 72%),radial-gradient(300px calc(var(--screen-w) * .34) at calc(50% + var(--screen-w) / 2) calc(var(--screen-w) * .28),var(--room-a),transparent 72%)}
/* reading columns: a faint light from the right wall */
main > :is(.project-story,.policy){--room-light:radial-gradient(480px 640px at 100% 60%,var(--room-b),transparent 72%)}
main > .faq{--room-light:radial-gradient(900px 460px at 100% 0,var(--room-b),transparent 72%)}
main > .section:has(> .agent-workflows){--room-light:radial-gradient(520px 640px at 0 50%,var(--room-b),transparent 72%)}
/* toned bands: a low light from below */
main > :is(.project-workflow,.collection-next,.audit-service-compute,.enquiry-section){--room-light:radial-gradient(1200px min(380px,130%) at 50% 100%,var(--room-b),transparent 72%)}
/* the contact band: light beside the text */
main > .contact{--room-light:radial-gradient(620px min(520px,56%) at 82% 58%,var(--room-a),transparent 72%)}
@media (forced-colors:active){
  main::after,main.section::before,main:not(.section) > *::before,main > :is(.project-workflow,.collection-next,.audit-service-compute,.enquiry-section)::after{display:none}
}

/* ══════════ reduced motion ══════════ */
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{transition-duration:0s!important;transition-delay:0s!important;animation:none!important}
  .catalog-card:hover,.work-starting-points > a:hover{transform:none}
}

/* ══════════ responsive ══════════ */
@media (max-width:1279px){
  .service-grid{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:repeat(14,auto)}
}
@media (max-width:1179px){
  .nav a{padding:0 7px;font-size:.82rem}
  .header-inner{gap:14px}
  .agent-workflows{grid-template-columns:minmax(0,1fr)}
  .agent-workflows > .agent-capabilities{grid-column:1;grid-row:auto}
}
@media (max-width:1079px){
  .nav,.header-tail .seg-appearance{display:none}
  .menu-toggle{display:inline-flex;align-items:center}
  .header-inner{justify-content:space-between}
  .hdr-pill{background:var(--pill-solid);-webkit-backdrop-filter:none;backdrop-filter:none}
  .catalog-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .catalog-head,.locus-offer-heading{grid-template-columns:minmax(0,1fr);align-items:start}
  .footer-inner{grid-template-columns:minmax(0,1fr);gap:28px}
  .service-evidence{grid-template-columns:minmax(0,1fr)}
  .service-evidence > *,.service-evidence > .service-recording{grid-column:1;grid-row:auto}
  .enquiry-section{grid-template-columns:minmax(0,1fr)}
  .enquiry-section > *,.enquiry-section > .enquiry-direct{grid-column:1;grid-row:auto}
  .about-grid{grid-template-columns:minmax(0,1fr)}
  .about-grid figure{position:static;max-width:640px}
  .project-facts{grid-template-columns:repeat(2,minmax(0,1fr))}
  .work-starting-points{grid-template-columns:minmax(0,1fr)}
  .nav a,.footer-dir a,.footer-legal a,.tlink{min-height:44px}
  .btn-sm,.seg button{min-height:44px}
  .footer-legal a{min-width:44px;justify-content:center}
  /* the collection row closes up so the six tabs fit on one line down to 1024 px and wrap cleanly below */
  .filters{column-gap:22px;row-gap:0}
  .filter,.filter:first-child{min-height:44px;padding:0}
  .filter::after,.filter:first-child::after{left:0;right:0}
}
@media (max-width:860px){
  .faq-list,.project-story,.founder-context,.locus-delivery,.service-framing,.service-engagement,.agent-capabilities{grid-template-columns:minmax(0,1fr)}
  .workflow-grid{grid-template-columns:minmax(0,1fr)}
  .comfy-case-assets > div{grid-template-columns:repeat(2,minmax(0,1fr))}
  .policy-part{grid-template-columns:minmax(0,1fr)}
  .policy-part > p,.policy-part > ul,.policy-part h2{grid-column:1}
  .footer-dir{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:699px){
  .service-grid{grid-template-columns:minmax(0,1fr);grid-template-rows:none}
  .service-card{grid-row:auto;grid-template-rows:none;display:flex;flex-direction:column;gap:12px}
  .service-receive{align-self:stretch}
  .service-card .text-link{align-self:flex-start}
}
@media (max-width:639px){
  :root{--header-h:64px;--section-y:56px}
  .wordmark span{font-size:.98rem}
  .site-footer{padding-top:40px}
  .footer-inner{margin-top:24px;padding-top:20px;gap:22px}
  .footer-legal{margin-top:22px}
  .footer-dir{grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:20px 14px}
  .footer-dir a{font-size:.86rem}
  .footer-dir section:last-child{grid-column:1 / -1}
  .footer-dir a,.footer-legal a{min-height:44px}
  main details > :not(summary){margin-inline:16px}
  main summary{padding-left:16px}
  .workflow-proof-nav{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-flow:row;border-radius:var(--r)}
  .workflow-proof-nav button{padding:0 10px;border-radius:calc(var(--r) - 3px)}
  .founder-education{grid-template-columns:minmax(0,1fr)}
  .founder-education dd{margin-bottom:6px}
}
@media (max-width:599px){
  .catalog-grid{grid-template-columns:minmax(0,1fr)}
  .comfy-case-assets > div{grid-template-columns:minmax(0,1fr)}
  .project-facts{grid-template-columns:minmax(0,1fr)}
}
/* "Start a project" is wider than the old label: between 361 and 374 px the header closes up to keep it on the row */
@media (max-width:374px){
  .header-tail{gap:8px}
  .header-tail .btn-sm{padding:0 14px}
}
@media (max-width:360px){
  .footer-dir{grid-template-columns:minmax(0,1fr)}
  .cta-long{display:none}
  .cta-short{display:inline}
  .header-tail{gap:8px}
  .header-tail .btn-sm{padding:0 14px}
  /* the founder's first role stays on one line down to a 273 px column (320 px with a scrollbar) */
  .founder-title{letter-spacing:.04em}
}