/* 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. Every section sits on the page's own flat ground. */

/* ══════════ 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,4rem);
  --fs-h2-xl:clamp(2rem,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="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-appearance{--n:2}
.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}
/* Services: the link and, beside it, its own disclosure button; the panel lists the overview and the four service
   pages and hangs below the pill (nothing in the header clips it). The phone menu repeats the pair as one row. */
.nav-group{position:relative;display:flex;align-items:center}
.nav-group > a{padding-right:3px}
.nav-disclose{display:inline-grid;place-items:center;width:26px;min-height:40px;border-radius:var(--r-sm);color:var(--muted);transition:color var(--t-state) var(--ease)}
.nav-disclose:hover,.nav-disclose[aria-expanded="true"]{color:var(--ink)}
.nav-disclose svg,.mnav-disclose svg{transition:transform var(--t-state) var(--ease)}
.nav-disclose[aria-expanded="true"] svg,.mnav-disclose[aria-expanded="true"] svg{transform:rotate(180deg)}
.nav-panel{position:absolute;left:-6px;top:calc(100% + 14px);z-index:50;min-width:252px;padding:6px;border-radius:var(--r);background:var(--pill-solid);border:1px solid var(--line-2);box-shadow:0 18px 40px -24px var(--shadow)}
.nav-panel ul,.mnav-sub{list-style:none;margin:0;padding:0}
.nav-panel li:first-child{margin-bottom:4px;padding-bottom:4px;border-bottom:1px solid var(--line)}
.site-header .nav .nav-panel a{display:flex;min-height:40px;padding:0 12px;border-radius:calc(var(--r) - 4px);color:var(--muted);font-size:.86rem}
.site-header .nav .nav-panel a:hover,.site-header .nav .nav-panel a[aria-current="page"]{color:var(--ink);background:var(--surface)}
.mnav-row{display:flex;align-items:stretch;border-bottom:1px solid var(--line)}
.mobile-nav .mnav-row > a{flex:1 1 auto;border-bottom:0}
.mnav-disclose{display:inline-grid;place-items:center;flex:none;width:52px;min-height:52px;border-left:1px solid var(--line);color:var(--ink)}
.mnav-sub{padding:2px 0 8px 16px;border-bottom:1px solid var(--line)}
.mobile-nav .mnav-sub a{min-height:44px;border-bottom:0;color:var(--muted);font-weight:600;font-size:.96rem}
.mobile-nav .mnav-sub a[aria-current="page"]{color:var(--accent-text)}

/* ══════════ 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:1rem;line-height:1.52;color:var(--body)}
.project-caveat,.project-attribution{font-size:.94rem;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}
.model-points > li > p{max-width:68ch}
.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-shot-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px clamp(20px,3vw,36px);margin-top:clamp(20px,3vw,32px)!important}
.project-shot-grid > figure{margin:0!important}
.project-shot-grid figcaption{margin-top:10px}
@media (max-width:860px){.project-shot-grid{grid-template-columns:minmax(0,1fr)}}
.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 .footer-title{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)}

/* ══════════ 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}
}
