.hero { background: var(--surface); color: var(--text); border-bottom: 1px solid var(--line); }
.hero .eyebrow, .hero h1 span:last-child { color: var(--accent); }
.hero .hero-lead { color: var(--muted); }
.hero .button.light { background: #244bd7; color: #fff; }
.hero a:focus-visible { outline-color: var(--accent); }
.hero-app span { color: var(--muted); }
.hero-app img { border-color: var(--bg); box-shadow: 0 18px 36px #1b29451c; }
.approach-visual, .careers-visual { background: transparent; }
.job-apply { flex-wrap: wrap; gap: 8px 18px; }
.job-email-address { display: block; width: 100%; font-size: 15px; font-weight: 400; direction: ltr; unicode-bidi: isolate; overflow-wrap: anywhere; }
/* Shared section rhythm; content determines height, not a fixed viewport. */
:root { --section-space: 72px; }
.hero-inner, .company, .portfolio, .approach,
.careers .careers-inner, .footer-main { padding-block: var(--section-space); }
.hero-inner { min-height: 0; }
footer { padding-top: 0; }
@media (max-width: 767px) {
  :root { --section-space: 48px; }
}
@media (prefers-color-scheme: dark) {
  .hero .button.light { background: #9aacff; color: #141820; }
  .hero-app img { border-color: #374150; box-shadow: 0 18px 36px #00000038; }
}