:root {
  --bg: #ffffff;
  --fg: #262c30;
  --muted: #676f6b;
  --surface: #f8f8f6;
  --surface-2: #f5f4f1;
  --border: #e6e2dc;
  --accent: #003c50;
  --accent-fg: #ffffff;
  --accent-2: #8fb2be;
  --hero-fg: #ffffff;
  --hero-overlay: linear-gradient(180deg, rgba(0, 60, 80, 0.25), rgba(38, 44, 48, 0.55));
  --font-heading: "Geist", "Aptos", system-ui, sans-serif;
  --font-body: "Geist", "Aptos", system-ui, sans-serif;
  --radius: 14px;
  --radius-lg: 24px;
  --shadow: 0 24px 60px rgba(38, 44, 48, 0.1);
  --h1: clamp(2.4rem, 6.4vw, 5.6rem);
  --h2: clamp(2rem, 4.2vw, 3.4rem);
  --max-width: 1240px;
  --nav-h: 52px;
}
@media (min-width: 1024px) { :root { --section-y: 136px; } }
@media (max-width: 639px) { :root { --h1: clamp(1.7rem, 8vw, 2rem); --h2: clamp(1.6rem, 7.5vw, 2rem); } .services .card-body h3 { font-size: 1.25rem; } .cta-box { padding: 40px 20px; } .project-card { padding: 28px 20px; } }
.eyebrow, .hero-eyebrow, .panel-label, .site-nav a, .lang-toggle, .btn, .breadcrumb, .label, .num, .footer-copy, .stat-label, .demo-badge-wrap { font-family: "Sometype Mono", ui-monospace, monospace; }
h1, h2 { font-weight: 600; letter-spacing: -0.03em; line-height: 1.05; }
h3 { font-weight: 600; letter-spacing: -0.01em; }
.statement { font-size: clamp(1.6rem, 3.4vw, 2.8rem); letter-spacing: -0.025em; font-weight: 600; line-height: 1.15; }
.intro .container, .closing .container, .about .container, .careers-intro .container, .why .container, .apply .container, .calm .container { text-align: center; }
.intro .lead { font-size: 1.25rem; }
.section-head { margin-inline: auto; text-align: center; max-width: 820px; margin-bottom: 56px; }
.section-head p:last-child { font-size: 1.1rem; color: var(--muted); }
.eyebrow, .hero-eyebrow { letter-spacing: 0.14em; font-size: 0.78rem; font-weight: 700; }
.hero-eyebrow { opacity: 0.85; }
.hero-apple .hero-lead { font-size: clamp(1.05rem, 1.4vw, 1.35rem); }
/* navigation: thin dark translucent bar */
.nav-solid { background: rgba(38, 44, 48, 0.82); color: #ffffff; border-bottom: 0; }
.nav-solid .logo svg { height: 12px; }
.nav-solid .nav-inner { min-height: var(--nav-h); }
@media (min-width: 1024px) {
  .nav-solid .site-nav a { font-size: 0.74rem; letter-spacing: 0.1em; text-transform: uppercase; font-weight: 500; opacity: 0.85; }
  .nav-solid .site-nav a:hover, .nav-solid .site-nav a[aria-current="page"] { color: #ffffff; opacity: 1; }
  .nav-solid .lang-toggle { border-color: rgba(255, 255, 255, 0.4); font-size: 0.7rem; }
}
@media (max-width: 1023px) { .nav-solid .site-nav:not(.nav-overlay) { background: #262c30; color: #ffffff; } .nav-solid .site-nav a[aria-current="page"] { color: #b7cdd4; } }
/* pills and links */
.btn { border-radius: 980px; padding: 14px 26px; font-weight: 700; letter-spacing: 0.02em; font-size: 0.9rem; }
.link-more { font-weight: 500; font-size: 1rem; }
.link-more::after { content: " \203A"; font-size: 1.2em; line-height: 1; }
/* tiles */
.card, .bento-item, .step, .feature .pillar, .culture .pillar, .form, .tabs [role="tabpanel"], .word-grid li { border: 0; background: var(--surface); border-radius: var(--radius-lg); }
.card-body { padding: 28px; }
.card-media { aspect-ratio: 4 / 3; }
.services .card-body h3 { font-size: 1.35rem; letter-spacing: -0.02em; margin-bottom: 8px; }
.project-card { padding: 40px; }
.project-card h2 { font-size: clamp(1.4rem, 2.2vw, 1.9rem); letter-spacing: -0.02em; }
.word-grid li { border-left: 0; text-align: center; }
.num { color: var(--accent); }
/* the key-figure section is the dark full-bleed band */
.feature { background: #262c30; color: #f6f6f6; --fg: #f6f6f6; --muted: #b7cdd4; --surface: #30383e; --surface-2: #3a434a; --border: #46525a; --accent: #b7cdd4; --accent-fg: #262c30; }
.feature .section-head p:last-child { color: var(--muted); }
.stats { gap: 32px; margin-bottom: 72px; }
.stat { background: transparent; border: 0; text-align: center; padding: 8px; }
.stat-value { font-size: clamp(2.4rem, 4vw, 3.8rem); font-weight: 600; letter-spacing: -0.04em; color: #ffffff; white-space: nowrap; }
.stat-label { font-size: 0.82rem; }
.feature .pillar { background: var(--surface); padding: 28px; }
.feature .pillar h3 { color: #ffffff; }
/* calm band and closing */
.closing { background: var(--surface); }
.calm { background: var(--surface); }
/* call to action as a quiet tile */
.cta-box { background: var(--surface); color: var(--fg); padding: clamp(48px, 8vw, 96px); }
.cta-box h2 { max-width: 16ch; }
.cta-box p { color: var(--muted); opacity: 1; font-size: 1.1rem; }
.cta-box :focus-visible { outline-color: var(--accent); }
/* accordion */
.acc-trigger { font-size: 1.15rem; padding: 24px 0; font-weight: 500; }
.acc-panel { font-size: 1.05rem; }
/* subpage heroes */
.page-hero.has-media { min-height: 56svh; }
.page-hero h1 { letter-spacing: -0.03em; }
/* footer: light grey directory in small type */
.site-footer { background: var(--surface); border-top: 0; font-size: 0.82rem; color: var(--muted); padding-block: 48px 28px; }
.site-footer .tagline { color: var(--fg); font-size: 1rem; }
.site-footer .logo svg { height: 12px; }
.footer-links a:hover { color: var(--fg); }
.site-footer .footer-address strong { color: var(--fg); }
.iso-badge { width: 40px; height: 40px; }
@media (max-width: 639px) { .services .card-body h3 { font-size: 1.25rem; } }