/* Conceptable — site styles.
   Built on css/tokens.css (copied from the Conceptable Design System, August 2026).
   Style from semantic aliases only, so every rule works in both themes. */

/* ── Accessibility overrides to the design system tokens ──
   Checked with axe-core, October 2026. The design system's values fail WCAG AA at body sizes:
   white on teal-600 is 3.81:1, ink-500 muted text 3.7-3.9:1, ink-400 faint labels 2.5:1,
   dark-mode faint #757575 3.4-3.9:1. These replacements clear 4.5:1 on every surface they use. */
:root:not([data-theme="dark"]) {
  --text-muted:#656D78;   /* 4.9:1 or better on white, paper, tan and sunk */
  --text-faint:#6A7280;   /* 4.54:1 or better */
}
:root {
  --action-primary:var(--teal-700);          /* white type 5.17:1 */
  --action-primary-hover:var(--teal-800);
  --action-primary-active:var(--teal-900);
}
[data-theme="dark"] {
  --text-faint:#8C8C8C;   /* 4.62:1 or better on every dark surface */
  --action-primary:var(--teal-700);
  --action-primary-hover:var(--teal-800);
  --action-primary-active:var(--teal-900);
}

/* ── Base ─────────────────────────────────────────────── */
*,*::before,*::after { box-sizing:border-box; }
html { -webkit-text-size-adjust:100%; scroll-behavior:smooth; scroll-padding-top:88px; }
body {
  margin:0; background:var(--surface-page); color:var(--text-body);
  font-family:var(--font-sans); font-stretch:var(--width-sans); font-size:var(--text-base); line-height:var(--leading-relaxed);
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
}
h1,h2,h3,h4 {
  margin:0; color:var(--text-heading); font-family:var(--font-display); font-stretch:var(--width-sans);
  font-weight:var(--weight-semibold); letter-spacing:var(--tracking-tight); line-height:var(--leading-heading);
  text-wrap:balance;
}
p { margin:0; text-wrap:pretty; }
ul { margin:0; padding:0; list-style:none; }
a { color:var(--text-link); text-decoration:none; transition:color var(--dur-fast) var(--ease); }
a:hover { color:var(--text-link-hover); text-decoration:underline; text-underline-offset:2px; }
img,svg { display:block; max-width:100%; }
button { font:inherit; font-stretch:var(--width-sans); color:inherit; cursor:pointer; }
::selection { background:var(--teal-100); color:var(--ink-900); }
:focus-visible { outline:2px solid var(--focus-ring); outline-offset:2px; border-radius:var(--radius-sm); }
@media (prefers-reduced-motion:reduce) {
  html { scroll-behavior:auto; }
  *,*::before,*::after { animation-duration:.001ms !important; transition-duration:.001ms !important; }
}

.skip-link { position:absolute; left:var(--space-4); top:-60px; z-index:100; padding:var(--space-2) var(--space-4);
  background:var(--action-primary); color:var(--text-on-brand); border-radius:var(--radius-md); }
.skip-link:focus { top:var(--space-4); color:var(--text-on-brand); }
.visually-hidden { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }

/* ── Type helpers ─────────────────────────────────────── */
.serif-em { font-family:var(--font-serif); font-style:italic; font-weight:var(--weight-medium); letter-spacing:0; }
.eyebrow { display:block; font-family:var(--font-mono); font-size:var(--text-xs); font-weight:var(--weight-medium); font-stretch:normal;
  letter-spacing:var(--tracking-wider); text-transform:uppercase; color:var(--text-brand); }
.label { font-family:var(--font-mono); font-size:var(--text-2xs); font-weight:var(--weight-medium); font-stretch:normal;
  letter-spacing:var(--tracking-wider); text-transform:uppercase; color:var(--text-faint); }
.mono { font-family:var(--font-mono); font-stretch:normal; font-variant-numeric:tabular-nums; }
.lead { font-size:var(--text-lg); line-height:var(--leading-relaxed); color:var(--text-body); max-width:var(--measure-lead); }

/* ── Layout ───────────────────────────────────────────── */
.container { max-width:var(--container); margin:0 auto; padding:0 var(--gutter); }
.section { padding:var(--section-y-lg) 0; }
.section--warm { background:var(--surface-page-warm); }
.section--ink { background:var(--surface-inverse); color:var(--text-on-dark-muted); }
.grid { display:grid; gap:var(--space-5); }
.grid--2 { grid-template-columns:repeat(2,1fr); }
.grid--3 { grid-template-columns:repeat(3,1fr); }
.grid--4 { grid-template-columns:repeat(4,1fr); }

.section-head { max-width:var(--measure-lead); }
.section-head--center { margin:0 auto; text-align:center; }
.section-head h2 { margin-top:var(--space-4); font-size:var(--text-3xl); line-height:var(--leading-snug); }
.section-head p { margin-top:var(--space-5); font-size:var(--text-md); }
.section-head--center p { margin-left:auto; margin-right:auto; }
.section-head + * { margin-top:var(--space-12); }
.section--ink .eyebrow { color:var(--teal-400); }
.section--ink h2 { color:var(--text-on-dark); }
.section--ink .section-head p { color:var(--text-on-dark-muted); }

/* ── Icons (inline Lucide sprite, 2px stroke) ─────────── */
.icon { width:20px; height:20px; flex:0 0 auto; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
.icon--sm { width:16px; height:16px; }
.icon--lg { width:26px; height:26px; }
.icon-disc { display:inline-flex; padding:12px; border-radius:50%; background:color-mix(in srgb, var(--teal-600) 10%, transparent);
  color:var(--teal-600); transition:color var(--dur) var(--ease); }
[data-theme="dark"] .icon-disc { color:var(--teal-400); }

/* ── Buttons ──────────────────────────────────────────── */
.btn { display:inline-flex; align-items:center; justify-content:center; gap:8px; padding:11px 20px;
  font-family:var(--font-sans); font-stretch:var(--width-sans); font-size:var(--text-base); font-weight:var(--weight-semibold); line-height:1;
  white-space:nowrap; border:1px solid transparent; border-radius:var(--radius-md); text-decoration:none;
  transition:background var(--dur-fast) var(--ease), color var(--dur-fast) var(--ease), border-color var(--dur-fast) var(--ease), transform var(--dur-fast) var(--ease); }
.btn:hover { text-decoration:none; }
.btn:active { transform:var(--press); }
.btn--lg { padding:14px 26px; font-size:var(--text-md); gap:10px; }
.btn--sm { padding:8px 14px; font-size:var(--text-sm); gap:6px; }
.btn--primary { background:var(--action-primary); color:var(--text-on-brand); box-shadow:var(--shadow-sm); }
.btn--primary:hover { background:var(--action-primary-hover); color:var(--text-on-brand); }
.btn--secondary { background:transparent; color:var(--action-secondary); border-color:var(--action-secondary); }
.btn--secondary:hover { background:var(--action-secondary); color:var(--surface-page); }
.btn--quiet { background:transparent; color:var(--text-brand); padding-left:0; padding-right:0; }
.btn--quiet:hover { color:var(--accent-hover-strong); }
.btn--inverse { background:var(--white); color:var(--ink-900); }
.btn--inverse:hover { background:var(--tan-100); color:var(--ink-900); }

/* ── Cards ────────────────────────────────────────────── */
.card { padding:var(--space-6); border-radius:var(--radius-xl); background:var(--surface-card); color:var(--text-body);
  border:1px solid var(--border-default); box-shadow:var(--shadow-card);
  transition:border-color var(--dur) var(--ease), box-shadow var(--dur) var(--ease), transform var(--dur) var(--ease), background var(--dur) var(--ease); }
.card--interactive:hover { border-color:var(--border-brand); box-shadow:var(--shadow-md); transform:translateY(var(--lift)); }
.card--warm { background:var(--surface-card); border-color:var(--border-warm); box-shadow:none; }
.card--warm.card--interactive:hover { border-color:var(--border-hover-warm); background:var(--surface-warm-hover); }
.card--interactive:hover .icon-disc { color:var(--icon-hover); }
.card--inverse { background:var(--surface-inverse-alt); border-color:var(--border-inverse); box-shadow:none; color:var(--text-on-dark-muted); }
.card h3 { font-size:var(--text-xl); }
.card p { font-size:var(--text-sm); }

.badge { display:inline-flex; align-items:center; gap:6px; padding:3px 9px; border-radius:var(--radius-pill); border:1px solid var(--teal-200);
  background:var(--status-info-soft); color:var(--teal-800); font-size:var(--text-2xs); font-weight:var(--weight-semibold); line-height:1.4; white-space:nowrap; }
.badge::before { content:""; width:6px; height:6px; border-radius:50%; background:currentColor; }
[data-theme="dark"] .badge { color:var(--teal-300); border-color:var(--teal-800); }
.tag { display:inline-block; padding:3px 8px; border-radius:var(--radius-sm); background:var(--surface-sunk); border:1px solid var(--border-subtle);
  font-family:var(--font-mono); font-stretch:normal; font-size:var(--text-2xs); font-weight:var(--weight-medium); letter-spacing:var(--tracking-wide);
  text-transform:uppercase; color:var(--text-muted); }

/* ── Header ───────────────────────────────────────────── */
.site-header { position:sticky; top:0; z-index:40; border-bottom:1px solid var(--border-subtle);
  background:color-mix(in srgb, var(--surface-page) 92%, transparent); backdrop-filter:saturate(1.4) blur(10px); -webkit-backdrop-filter:saturate(1.4) blur(10px); }
.site-header__inner { height:72px; display:flex; align-items:center; gap:var(--space-8); }
.brand { display:flex; align-items:center; margin-right:auto; }
.brand img { height:28px; width:auto; }
.logo-dark { display:none; }
[data-theme="dark"] .logo-light { display:none; }
[data-theme="dark"] .logo-dark { display:block; }
.site-nav { display:flex; align-items:center; gap:var(--space-8); }
.site-nav__link { padding-bottom:2px; border-bottom:2px solid transparent; font-size:var(--text-sm); font-weight:var(--weight-semibold); color:var(--text-body); }
.site-nav__link:hover { color:var(--text-brand); text-decoration:none; }
.site-nav__link[aria-current="page"] { color:var(--text-heading); border-bottom-color:var(--teal-500); }
.icon-btn { display:inline-flex; align-items:center; justify-content:center; width:38px; height:38px; padding:0; border-radius:var(--radius-md);
  border:1px solid var(--border-default); background:transparent; color:var(--text-muted);
  transition:background var(--dur-fast) var(--ease), color var(--dur-fast) var(--ease), border-color var(--dur-fast) var(--ease); }
.icon-btn:hover { background:var(--accent-hover-soft); color:var(--accent-hover-strong); border-color:var(--border-hover-warm); }
.theme-toggle .icon-moon { display:none; }
[data-theme="dark"] .theme-toggle .icon-sun { display:none; }
[data-theme="dark"] .theme-toggle .icon-moon { display:block; }
.nav-toggle { display:none; }

/* ── Hero ─────────────────────────────────────────────── */
.hero { position:relative; overflow:hidden; padding:var(--space-24) 0 var(--space-24); }
.hero__grid { display:grid; grid-template-columns:1.05fr .95fr; gap:var(--space-16); align-items:center; }
.hero h1 { margin-top:var(--space-4); font-size:var(--text-5xl); line-height:var(--leading-tight); letter-spacing:var(--tracking-tighter); }
.hero .lead { margin-top:var(--space-6); }
.hero__actions { display:flex; flex-wrap:wrap; gap:var(--space-3); margin-top:var(--space-10); }
.hero__proof { display:flex; align-items:center; gap:var(--space-2); margin-top:var(--space-8); font-size:var(--text-sm); color:var(--text-muted); }
.hero__proof .icon { color:var(--teal-600); }
.hero__visual { position:relative; height:420px; }
.hero__visual::before { content:""; position:absolute; top:50%; left:46%; width:260px; height:260px; border-radius:50%;
  background:color-mix(in srgb, var(--teal-600) 10%, transparent); filter:blur(64px); transform:translate(-50%,-50%); }
.hero__img { position:absolute; object-fit:cover; border-radius:var(--radius-xl); }
.hero__img--a { top:0; right:0; width:80%; height:280px; box-shadow:var(--shadow-hero); }
.hero__img--b { bottom:0; left:0; width:58%; height:210px; box-shadow:var(--shadow-lg); border:4px solid var(--surface-page); }
[data-theme="dark"] .hero__img { filter:brightness(.88) contrast(1.04); }

/* ── Companies ────────────────────────────────────────── */
.company { display:flex; flex-direction:column; padding:0; overflow:hidden; }
.company__top { display:flex; align-items:center; justify-content:space-between; gap:var(--space-3); min-height:96px; padding:var(--space-6); }
.company__top img { height:30px; width:auto; }
.company__bar { height:4px; background:var(--accent, var(--teal-600)); }
.company__body { display:flex; flex-direction:column; flex:1; padding:var(--space-6); }
.company__body p { margin-top:var(--space-4); font-size:var(--text-base); }
.company__links { display:flex; flex-wrap:wrap; gap:var(--space-6); margin-top:auto; padding-top:var(--space-6); }
.company__links a { display:inline-flex; align-items:center; gap:6px; font-size:var(--text-sm); font-weight:var(--weight-semibold); }

/* ── Track record ─────────────────────────────────────── */
.stat__n { font-family:var(--font-mono); font-stretch:normal; font-size:var(--text-4xl); font-weight:var(--weight-semibold); line-height:1.1; color:var(--teal-400); }
.stat__l { margin-top:var(--space-2); font-size:var(--text-sm); color:var(--text-on-dark-muted); }
.clients { margin-top:var(--space-16); padding-top:var(--space-8); border-top:1px solid var(--border-inverse); text-align:center; }
.clients .label { color:var(--text-on-dark-faint); }
.clients__list { display:flex; flex-wrap:wrap; justify-content:center; gap:var(--space-3) var(--space-10); margin-top:var(--space-5);
  font-size:var(--text-xl); font-weight:var(--weight-semibold); color:var(--text-on-dark); letter-spacing:var(--tracking-tight); }

/* ── Split (image + text) ─────────────────────────────── */
.split { display:grid; grid-template-columns:.9fr 1.1fr; gap:var(--space-16); align-items:center; }
.split__img { width:100%; height:360px; object-fit:cover; object-position:70% center; border-radius:var(--radius-xl); }
[data-theme="dark"] .split__img { filter:brightness(.88) contrast(1.04); }
.split h2 { margin-top:var(--space-4); font-size:var(--text-3xl); line-height:var(--leading-snug); }
.split p { margin-top:var(--space-5); font-size:var(--text-md); max-width:var(--measure); }
.quote { margin:var(--space-8) 0 0; padding-left:var(--space-5); border-left:3px solid var(--teal-600); }
.quote p { margin:0; font-family:var(--font-serif); font-style:italic; font-weight:var(--weight-medium); font-size:var(--text-xl);
  line-height:1.45; color:var(--text-heading); max-width:none; }
.quote cite { display:block; margin-top:var(--space-3); font-size:var(--text-xs); font-style:normal; color:var(--text-muted); }

/* ── Closing CTA ──────────────────────────────────────── */
.cta { display:flex; align-items:center; justify-content:space-between; gap:var(--space-10); padding:var(--space-12);
  border-radius:var(--radius-2xl); background:var(--surface-brand-soft); border:1px solid var(--teal-200); }
[data-theme="dark"] .cta { border-color:var(--teal-900); }
.cta h2 { font-size:var(--text-2xl); }
.cta p { margin-top:var(--space-3); max-width:var(--measure); }
.cta__actions { display:flex; flex-wrap:wrap; gap:var(--space-3); flex:none; }

/* ── Inner page hero ──────────────────────────────────── */
.page-hero { padding:var(--space-20) 0 var(--space-16); border-bottom:1px solid var(--border-subtle); }
.page-hero h1 { margin-top:var(--space-4); max-width:18em; font-size:var(--text-5xl); line-height:var(--leading-tight); letter-spacing:var(--tracking-tighter); }
.page-hero .lead { margin-top:var(--space-6); }
.jump { display:flex; flex-wrap:wrap; gap:var(--space-3); margin-top:var(--space-10); }
.jump a { display:inline-flex; align-items:center; gap:var(--space-3); padding:10px 16px; border-radius:var(--radius-md);
  border:1px solid var(--border-default); background:var(--surface-card); color:var(--text-heading); font-size:var(--text-sm); font-weight:var(--weight-semibold); }
.jump a:hover { text-decoration:none; border-color:var(--border-hover-warm); background:var(--accent-hover-soft); color:var(--accent-hover-strong); }
.jump__dot { width:10px; height:10px; border-radius:50%; background:var(--accent); }

/* ── Company sections (Companies page) ────────────────── */
.co-head { display:flex; flex-wrap:wrap; align-items:center; gap:var(--space-4) var(--space-6); }
.co-head img { height:34px; width:auto; }
.co-head__line { margin-left:auto; font-size:var(--text-sm); color:var(--text-muted); }
.co-rule { height:4px; margin-top:var(--space-6); border-radius:2px; background:var(--accent); }
.co-intro { display:grid; grid-template-columns:1.2fr .8fr; gap:var(--space-12); margin-top:var(--space-10); align-items:start; }
.co-intro h2 { font-size:var(--text-3xl); line-height:var(--leading-snug); }
.co-intro .lead { margin-top:var(--space-5); }
.co-facts { display:flex; flex-direction:column; gap:var(--space-4); }
.co-facts dt { font-family:var(--font-mono); font-stretch:normal; font-size:var(--text-2xs); font-weight:var(--weight-medium); letter-spacing:var(--tracking-wider); text-transform:uppercase; color:var(--text-faint); }
.co-facts dd { margin:var(--space-1) 0 0; color:var(--text-heading); font-weight:var(--weight-semibold); }
.co-facts div + div { padding-top:var(--space-4); border-top:1px solid var(--border-subtle); }
.feature .icon { color:var(--accent, var(--teal-600)); transition:color var(--dur) var(--ease); }
.feature.card--interactive:hover .icon { color:var(--icon-hover); }
.feature h3 { margin-top:var(--space-4); font-size:var(--text-lg); }
.feature p { margin-top:var(--space-2); }
.card--sunk { background:var(--surface-sunk); border-color:var(--border-subtle); box-shadow:none; }
.card--sunk.card--interactive:hover { border-color:var(--border-hover-warm); background:var(--accent-hover-soft); }
.work { margin-top:var(--space-12); }
.work__grid { margin-top:var(--space-5); }
.work figure { margin:0; }
.work img { width:100%; aspect-ratio:3 / 2; height:auto; object-fit:cover; border-radius:var(--radius-lg); filter:grayscale(1); }
[data-theme="dark"] .work img { filter:grayscale(1) brightness(.88) contrast(1.04); }
.work figcaption { margin-top:var(--space-3); }
.work__kind { font-family:var(--font-mono); font-stretch:normal; font-size:var(--text-2xs); font-weight:var(--weight-medium); letter-spacing:var(--tracking-wider); text-transform:uppercase; color:var(--text-brand); }
.work__name { margin-top:3px; font-weight:var(--weight-semibold); color:var(--text-heading); }
.work__desc { margin-top:var(--space-2); font-size:var(--text-sm); color:var(--text-body); max-width:none; }
.work__more { margin-top:var(--space-10); font-size:var(--text-base); color:var(--text-body); max-width:var(--measure); }
.fit.fit--light h3 { color:var(--text-heading); }
.fit.fit--light p { color:var(--text-body); font-size:var(--text-base); }
.fit.fit--light p + p { margin-top:var(--space-3); }
/* Brand colour mixed with the heading colour: the raw brand hues fall below 4.5:1 at this size */
.fit.fit--light .fit__who { color:color-mix(in srgb, var(--accent, var(--text-brand)) 55%, var(--text-heading)); }
.note { margin-top:var(--space-10); padding:var(--space-6); border-radius:var(--radius-xl); background:var(--surface-warm); border:1px solid var(--border-warm); }
.note p { font-size:var(--text-sm); max-width:none; }
.co-actions { display:flex; flex-wrap:wrap; gap:var(--space-3); margin-top:var(--space-10); }

/* ── Fit (how the group fits together) ────────────────── */
.fit h3 { font-size:var(--text-lg); color:var(--text-on-dark); }
.fit p { margin-top:var(--space-3); font-size:var(--text-sm); }
.fit__who { font-family:var(--font-mono); font-stretch:normal; font-size:var(--text-xs); font-weight:var(--weight-medium); letter-spacing:var(--tracking-wider); text-transform:uppercase; color:var(--teal-400); }
.fit .fit__who + h3 { margin-top:var(--space-3); }

/* ── Timeline (About page) ────────────────────────────── */
.list { list-style:none; padding:0; display:grid; gap:var(--space-3); }
.list li { position:relative; padding-left:var(--space-5); font-size:var(--text-base); color:var(--text-body); max-width:var(--measure); }
.list li::before { content:""; position:absolute; left:0; top:.6em; width:8px; height:8px; border-radius:50%; background:var(--teal-600); }
.page-hero .hero__actions { margin-top:var(--space-8); }

/* Image slots added 24 Oct: journey strip, heritage portrait, division image, photo behind ink bands */
.strip { padding:var(--space-12) 0; }
.strip__img { display:block; width:100%; height:auto; aspect-ratio:21/9; object-fit:cover; border-radius:var(--radius-xl); }
.heritage { display:grid; grid-template-columns:minmax(0,1fr) 380px; gap:var(--space-16); align-items:start; }
.heritage__img { width:380px; height:auto; aspect-ratio:3/4; object-fit:cover; border-radius:var(--radius-xl); position:sticky; top:var(--space-24); }
.co-img { display:block; width:100%; height:auto; aspect-ratio:12/5; object-fit:cover; object-position:center 42%; border-radius:var(--radius-xl); margin-top:var(--space-12); }
.section--ink-photo { position:relative; isolation:isolate; overflow:hidden; }
.section--ink-photo::before { content:""; position:absolute; inset:0; z-index:-1; background:url(/assets/img/band-factory.webp) center/cover no-repeat; opacity:.14; }
[data-theme="dark"] .strip__img, [data-theme="dark"] .heritage__img, [data-theme="dark"] .co-img { filter:brightness(.88) contrast(1.04); }
@media (max-width:960px) {
  .heritage { grid-template-columns:1fr; }
  .heritage__img { display:none; }
  .co-img { aspect-ratio:3/2; }
}

.timeline { position:relative; max-width:860px; }
.timeline::before { content:""; position:absolute; left:180px; top:8px; bottom:8px; width:2px; background:var(--border-default); }
.timeline__item { position:relative; display:grid; grid-template-columns:180px 1fr; gap:var(--space-10); padding-bottom:var(--space-10); }
.timeline__item:last-child { padding-bottom:0; }
.timeline__item::before { content:""; position:absolute; left:175px; top:6px; width:12px; height:12px; border-radius:50%;
  background:var(--surface-page-warm); border:2px solid var(--teal-600); }
.timeline__item--now::before { background:var(--teal-600); }
.timeline__when { padding-top:1px; font-family:var(--font-mono); font-stretch:normal; font-size:var(--text-sm); font-weight:var(--weight-medium); color:var(--text-brand); }
.timeline__item h3 { font-size:var(--text-xl); }
.timeline__item p { margin-top:var(--space-2); max-width:var(--measure); }

/* ── Founder and team (About page) ────────────────────── */
.founder { display:grid; grid-template-columns:auto 1fr; gap:var(--space-10); align-items:start; }
.founder img { width:160px; height:160px; border-radius:var(--radius-2xl); object-fit:cover; }
.founder h2 { margin-top:var(--space-4); font-size:var(--text-3xl); line-height:var(--leading-snug); }
.founder p { margin-top:var(--space-4); font-size:var(--text-md); max-width:var(--measure-lead); }
.founder__role { margin-top:var(--space-2); font-size:var(--text-sm); color:var(--text-muted); }
.team { display:grid; grid-template-columns:repeat(5,1fr); gap:var(--space-5); }
.team figure { margin:0; text-align:center; }
.team img { width:112px; height:112px; margin:0 auto; border-radius:50%; object-fit:cover; border:4px solid var(--surface-card); box-shadow:var(--shadow-card); }
.team__initials { display:flex; align-items:center; justify-content:center; width:112px; height:112px; margin:0 auto; border-radius:50%;
  border:4px solid var(--surface-card); box-shadow:var(--shadow-card); background:var(--surface-brand-soft);
  font-family:var(--font-serif); font-style:italic; font-weight:var(--weight-medium); font-size:var(--text-4xl); color:var(--text-brand); }
.team figcaption { margin-top:var(--space-4); font-weight:var(--weight-semibold); color:var(--text-heading); }
.team__role { margin-top:2px; font-size:var(--text-sm); font-weight:var(--weight-regular); color:var(--text-muted); }
.details { display:grid; grid-template-columns:repeat(3,1fr); gap:var(--space-8); }
.details dt { font-family:var(--font-mono); font-stretch:normal; font-size:var(--text-2xs); font-weight:var(--weight-medium); letter-spacing:var(--tracking-wider); text-transform:uppercase; color:var(--text-faint); }
.details dd { margin:var(--space-2) 0 0; color:var(--text-heading); }

/* ── Contact ──────────────────────────────────────────── */
.contact { display:grid; grid-template-columns:1.25fr .75fr; gap:var(--space-12); align-items:start; }
.form { display:grid; gap:var(--space-5); }
.form__row { display:grid; grid-template-columns:1fr 1fr; gap:var(--space-5); }
.field { display:flex; flex-direction:column; gap:var(--space-2); }
.field label { font-size:var(--text-sm); font-weight:var(--weight-semibold); color:var(--text-heading); }
.field__opt { font-weight:var(--weight-regular); color:var(--text-muted); }
.input { width:100%; padding:11px 14px; border-radius:var(--radius-md); border:1px solid var(--border-default); background:var(--surface-card);
  color:var(--text-heading); font:inherit; font-stretch:var(--width-sans); font-size:var(--text-base); line-height:1.4;
  transition:border-color var(--dur-fast) var(--ease), box-shadow var(--dur-fast) var(--ease); }
.input:hover { border-color:var(--border-strong); }
.input:focus { outline:none; border-color:var(--teal-600); box-shadow:var(--ring-focus); }
textarea.input { min-height:160px; resize:vertical; }
select.input { appearance:none; padding-right:40px; cursor:pointer;
  background-image:linear-gradient(45deg, transparent 50%, var(--text-muted) 50%), linear-gradient(135deg, var(--text-muted) 50%, transparent 50%);
  background-position:calc(100% - 20px) 52%, calc(100% - 15px) 52%; background-size:5px 5px; background-repeat:no-repeat; }
.hp { position:absolute; left:-10000px; width:1px; height:1px; overflow:hidden; }
.form__foot { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:var(--space-4); }
.form__note { font-size:var(--text-xs); color:var(--text-muted); max-width:30em; }
p a:not(.btn), .form__note a, .prose a { text-decoration:underline; text-underline-offset:2px; }
.btn:disabled { opacity:.45; cursor:not-allowed; }
.form-status { padding:var(--space-3) var(--space-4); border-radius:var(--radius-md); font-size:var(--text-sm); }
.form-status--error { background:var(--status-danger-soft); color:var(--status-danger); border:1px solid color-mix(in srgb, var(--status-danger) 30%, transparent); }
.form-done { padding:var(--space-8); border-radius:var(--radius-xl); background:var(--surface-brand-soft); border:1px solid var(--teal-200); }
[data-theme="dark"] .form-done { border-color:var(--teal-900); }
.form-done:focus { outline:none; }
.form-done h2 { font-size:var(--text-2xl); }
.form-done p { margin-top:var(--space-3); }
.aside { display:flex; flex-direction:column; gap:var(--space-5); }
.aside h2 { font-size:var(--text-lg); }
.aside p { margin-top:var(--space-2); font-size:var(--text-sm); }
.aside__line { display:flex; gap:var(--space-3); margin-top:var(--space-3); font-size:var(--text-sm); color:var(--text-body); }
.aside__line .icon { margin-top:2px; color:var(--teal-600); }
.aside__links { display:flex; flex-direction:column; gap:var(--space-3); margin-top:var(--space-4); }
.aside__links a { display:inline-flex; align-items:center; gap:6px; font-size:var(--text-sm); font-weight:var(--weight-semibold); }

/* ── Contact: message or call (shown only when JS runs) ── */
.choice { display:grid; grid-template-columns:1fr 1fr; gap:var(--space-3); margin-bottom:var(--space-8); }
.choice[hidden] { display:none; }
.choice__opt { display:flex; gap:var(--space-3); align-items:flex-start; padding:var(--space-4) var(--space-5); text-align:left;
  border:1px solid var(--border-default); border-radius:var(--radius-lg); background:var(--surface-card); color:var(--text-body);
  transition:border-color var(--dur-fast) var(--ease), background var(--dur-fast) var(--ease), box-shadow var(--dur-fast) var(--ease); }
.choice__opt:hover { border-color:var(--border-hover-warm); }
.choice__opt[aria-selected="true"] { border-color:var(--teal-600); box-shadow:inset 0 0 0 1px var(--teal-600); background:var(--surface-brand-soft); }
.choice__opt .icon { margin-top:2px; color:var(--text-brand); }
.choice__t { display:block; font-weight:var(--weight-semibold); color:var(--text-heading); }
.choice__d { display:block; margin-top:2px; font-size:var(--text-sm); line-height:var(--leading-normal); color:var(--text-muted); }

/* ── Call scheduler (ported from its.fashion) ─────────── */
.sched { display:grid; gap:var(--space-6); padding:var(--space-6); border:1px solid var(--border-default); border-radius:var(--radius-xl); background:var(--surface-sunk); }
.sched__title { font-size:var(--text-lg); }
.sched__note { display:flex; gap:var(--space-2); margin-top:var(--space-2); font-size:var(--text-sm); color:var(--text-muted); }
.sched__note .icon { margin-top:3px; color:var(--text-brand); }
.sched__days { display:grid; gap:var(--space-2); }
.sched__week { display:grid; grid-template-columns:repeat(5,1fr); gap:var(--space-2); }
.sched__dow span { font-family:var(--font-mono); font-stretch:normal; font-size:var(--text-2xs); font-weight:var(--weight-medium);
  letter-spacing:var(--tracking-wider); text-transform:uppercase; text-align:center; color:var(--text-faint); }
.sched__day { position:relative; display:flex; flex-direction:column; align-items:center; gap:2px; padding:var(--space-2) 0;
  border:1px solid var(--border-default); border-radius:var(--radius-md); background:var(--surface-card); color:var(--text-heading);
  transition:border-color var(--dur-fast) var(--ease), background var(--dur-fast) var(--ease); }
.sched__day small { font-size:var(--text-2xs); color:var(--text-muted); text-transform:uppercase; letter-spacing:var(--tracking-wide); }
.sched__day strong { font-size:var(--text-md); font-weight:var(--weight-semibold); line-height:1.2; }
.sched__day--off { border-color:transparent; background:transparent; color:var(--text-faint); }
.sched__day--off small { color:var(--text-faint); }
button.sched__day:hover, .sched__slot:hover:not(:disabled) { border-color:var(--border-hover-warm); }
.sched__day[aria-pressed="true"] { border-color:var(--action-primary); background:var(--action-primary); color:var(--text-on-brand); }
.sched__day[aria-pressed="true"] small { color:inherit; }
.sched__day.has-pick::after { content:""; position:absolute; top:6px; right:6px; width:6px; height:6px; border-radius:50%; background:var(--accent-hover); }
.sched__day-label { margin-bottom:var(--space-3); font-size:var(--text-sm); font-weight:var(--weight-semibold); color:var(--text-heading); }
.sched__slots { display:grid; grid-template-columns:repeat(4,1fr); gap:var(--space-2); }
.sched__slot { padding:10px 0; border:1px solid var(--border-default); border-radius:var(--radius-md); background:var(--surface-card);
  font-family:var(--font-mono); font-stretch:normal; font-size:var(--text-sm); font-weight:var(--weight-medium); color:var(--text-heading);
  transition:border-color var(--dur-fast) var(--ease), background var(--dur-fast) var(--ease); }
.sched__slot[aria-pressed="true"] { border-color:var(--action-primary); background:var(--action-primary); color:var(--text-on-brand); }
.sched__slot:disabled { opacity:.45; cursor:not-allowed; }
.sched__picked-head { display:flex; justify-content:space-between; align-items:baseline; }
.sched__picked-head .label { color:var(--text-muted); }
.sched__count { font-family:var(--font-mono); font-stretch:normal; font-size:var(--text-xs); color:var(--text-muted); }
.sched__list { display:grid; gap:var(--space-2); margin-top:var(--space-3); }
.sched__list li { display:flex; justify-content:space-between; align-items:center; gap:var(--space-3); padding:var(--space-2) var(--space-2) var(--space-2) var(--space-4);
  border:1px solid var(--border-default); border-radius:var(--radius-md); background:var(--surface-card); font-size:var(--text-sm); color:var(--text-body); }
.sched__list strong { color:var(--text-heading); font-weight:var(--weight-semibold); }
.sched__list li.sched__empty { padding:var(--space-3) var(--space-4); border-style:dashed; background:transparent; color:var(--text-muted); }
.sched__local { color:var(--text-muted); }
.sched__remove { display:inline-flex; align-items:center; justify-content:center; width:32px; height:32px; flex:none; padding:0;
  border:0; border-radius:var(--radius-md); background:transparent; color:var(--text-muted); }
.sched__remove:hover { background:var(--accent-hover-soft); color:var(--accent-hover-strong); }
textarea.input--short { min-height:96px; }
.form-done__list { display:grid; gap:var(--space-1); margin-top:var(--space-4); font-weight:var(--weight-semibold); color:var(--text-heading); }

/* ── Legal prose ──────────────────────────────────────── */
.prose { max-width:var(--container-narrow); }
.prose h2 { margin-top:var(--space-12); font-size:var(--text-2xl); }
.prose h2:first-child { margin-top:0; }
.prose h3 { margin-top:var(--space-8); font-size:var(--text-lg); }
.prose p, .prose ul { margin-top:var(--space-4); }
.prose ul { padding-left:1.25em; list-style:disc; }
.prose li + li { margin-top:var(--space-2); }
.prose table { width:100%; margin-top:var(--space-5); border-collapse:collapse; font-size:var(--text-sm); }
.prose th { text-align:left; font-family:var(--font-mono); font-stretch:normal; font-size:var(--text-2xs); font-weight:var(--weight-medium);
  letter-spacing:var(--tracking-wider); text-transform:uppercase; color:var(--text-faint); padding:0 var(--space-4) var(--space-3) 0; border-bottom:1px solid var(--border-default); }
.prose td { vertical-align:top; padding:var(--space-3) var(--space-4) var(--space-3) 0; border-bottom:1px solid var(--border-subtle); }
.prose__meta { margin-top:var(--space-6); font-size:var(--text-sm); color:var(--text-muted); }

/* ── Footer ───────────────────────────────────────────── */
.site-footer { padding:var(--space-20) 0 var(--space-8); background:var(--surface-inverse); color:var(--text-on-dark-muted); }
.site-footer__grid { display:grid; grid-template-columns:1.4fr repeat(3,1fr); gap:var(--space-12); }
.site-footer__brand img { height:26px; width:auto; }
.site-footer__brand p { margin-top:var(--space-5); max-width:28em; font-size:var(--text-sm); }
.site-footer__heading { font-family:var(--font-mono); font-stretch:normal; font-size:var(--text-xs); font-weight:var(--weight-medium);
  letter-spacing:var(--tracking-wider); text-transform:uppercase; color:var(--teal-400); }
.site-footer ul { display:flex; flex-direction:column; gap:var(--space-3); margin-top:var(--space-5); }
.site-footer a { display:inline-flex; align-items:center; gap:4px; font-size:var(--text-sm); color:var(--text-on-dark-muted); }
.site-footer a:hover { color:var(--text-on-dark); }
.site-footer__base { display:flex; align-items:center; justify-content:space-between; gap:var(--space-6);
  margin-top:var(--space-16); padding-top:var(--space-6); border-top:1px solid var(--border-inverse); }
.site-footer__legal { font-size:var(--text-xs); color:var(--text-on-dark-faint); }
.site-footer__mark { flex:none; width:auto; height:32px; }

/* ── Privacy notice ───────────────────────────────────── */
.privacy-notice { position:fixed; right:var(--space-6); bottom:var(--space-6); z-index:50; width:min(380px, calc(100% - 2 * var(--space-6)));
  display:flex; gap:var(--space-3); align-items:flex-start; padding:var(--space-5);
  background:var(--surface-card); border:1px solid var(--border-default); border-radius:var(--radius-xl); box-shadow:var(--shadow-pop);
  opacity:0; transform:translateY(12px); transition:opacity var(--dur-slow) var(--ease-out), transform var(--dur-slow) var(--ease-out); }
.privacy-notice[hidden] { display:none; }
.privacy-notice.is-visible { opacity:1; transform:none; }
.privacy-notice__ic { flex:none; display:inline-flex; align-items:center; justify-content:center; width:32px; height:32px;
  border-radius:var(--radius-md); background:var(--surface-brand-soft); color:var(--text-brand); }
.privacy-notice__t { font-size:var(--text-sm); font-weight:var(--weight-semibold); color:var(--text-heading); }
.privacy-notice__d { margin-top:var(--space-1); font-size:var(--text-sm); line-height:var(--leading-normal); color:var(--text-muted); }
.privacy-notice__actions { display:flex; flex-wrap:wrap; align-items:center; gap:var(--space-4); margin-top:var(--space-4); }
.privacy-notice__actions a { font-size:var(--text-sm); }

/* ── Reveal (only when JS is running) ─────────────────── */
.js .reveal { opacity:0; transform:translateY(8px); transition:opacity var(--dur-slower) var(--ease-out), transform var(--dur-slower) var(--ease-out); }
.js .reveal.is-visible { opacity:1; transform:none; }

/* ── Responsive ───────────────────────────────────────── */
@media (max-width:960px) {
  :root { --section-y-lg:80px; }
  .hero { padding:var(--space-16) 0; }
  .hero__grid, .split { grid-template-columns:1fr; gap:var(--space-12); }
  .hero__visual { height:360px; max-width:560px; }
  .grid--3 { grid-template-columns:1fr; }
  .grid--4 { grid-template-columns:repeat(2,1fr); }
  .site-footer__grid { grid-template-columns:1fr 1fr; }
  .site-footer__brand { grid-column:1 / -1; }
  .cta { flex-direction:column; align-items:flex-start; padding:var(--space-8); }
  .page-hero { padding:var(--space-16) 0 var(--space-12); }
  .co-intro { grid-template-columns:1fr; gap:var(--space-8); }
  .team { grid-template-columns:repeat(3,1fr); row-gap:var(--space-10); }
  .details { grid-template-columns:1fr 1fr; }
  .contact { grid-template-columns:1fr; }

  .site-header__inner { gap:var(--space-2); }
  .nav-toggle { display:inline-flex; }
  .site-nav { position:absolute; top:72px; left:0; right:0; flex-direction:column; align-items:stretch; gap:0;
    padding:var(--space-2) var(--gutter) var(--space-6); background:var(--surface-page); border-bottom:1px solid var(--border-subtle);
    box-shadow:var(--shadow-md); display:none; }
  .site-nav.is-open { display:flex; }
  .site-nav__link { padding:var(--space-4) 0; border-bottom:1px solid var(--border-subtle); font-size:var(--text-base); }
  .site-nav__link[aria-current="page"] { border-bottom-color:var(--border-subtle); color:var(--text-brand); }
  .site-nav .btn { margin-top:var(--space-5); }
}
@media (max-width:640px) {
  :root { --gutter:16px; --section-y-lg:64px; }
  .hero h1 { font-size:var(--text-4xl); }
  .hero .lead { font-size:var(--text-md); }
  .hero__visual { height:280px; }
  .hero__img--a { height:200px; }
  .hero__img--b { height:150px; }
  .grid--2 { grid-template-columns:1fr; }
  .grid--4 { gap:var(--space-3); }
  .grid--4 .card { padding:var(--space-5); }
  .stat__n { font-size:var(--text-3xl); }
  .section-head h2, .split h2 { font-size:var(--text-2xl); }
  .split__img { height:240px; }
  .site-footer__grid { grid-template-columns:1fr; gap:var(--space-8); }
  .hero__proof { align-items:flex-start; }
  .page-hero h1 { font-size:var(--text-4xl); }
  .co-head__line { margin-left:0; flex-basis:100%; }
  .timeline::before { left:5px; }
  .timeline__item { grid-template-columns:1fr; gap:var(--space-2); padding-left:var(--space-8); }
  .timeline__item::before { left:0; }
  .founder { grid-template-columns:1fr; gap:var(--space-6); }
  .founder img { width:120px; height:120px; }
  .team { grid-template-columns:repeat(2,1fr); }
  .team img, .team__initials { width:96px; height:96px; }
  .details { grid-template-columns:1fr; gap:var(--space-5); }
  .form__row { grid-template-columns:1fr; }
  .form__foot .btn { width:100%; }
  .prose table, .prose thead, .prose tbody, .prose tr, .prose th, .prose td { display:block; }
  .prose thead { display:none; }
  .prose tr { padding:var(--space-3) 0; border-bottom:1px solid var(--border-subtle); }
  .prose td { padding:var(--space-1) 0; border:0; }
  .prose td[data-label]::before { content:attr(data-label); display:block; margin-bottom:2px; font-family:var(--font-mono); font-stretch:normal;
    font-size:var(--text-2xs); font-weight:var(--weight-medium); letter-spacing:var(--tracking-wider); text-transform:uppercase; color:var(--text-faint); }
  .choice { grid-template-columns:1fr; }
  .sched { padding:var(--space-4); }
  .privacy-notice { right:0; bottom:0; width:100%; border-width:1px 0 0; border-radius:var(--radius-xl) var(--radius-xl) 0 0; }
}
