/* Arca — shared styles for index.html and job.html.
   Page-specific rules (scroll-margin, carousel, keyframes) stay inline in each page. */

:root {
  --ink: #40434E;      /* primary text and dark surfaces */
  --paper: #F8F4EF;    /* page background, light text on dark */
  --sand: #8A8579;     /* muted accent */
  --stone: #DCD5CB;    /* light tile / accent */
  --ink-hover: #7A7E8B;
  --ink-rgb: 64, 67, 78;
  --paper-rgb: 248, 244, 239;
}

/* Base — identical across both pages */
body { margin: 0; background: var(--paper); -webkit-font-smoothing: antialiased; }
a { color: var(--ink); text-decoration: none; }
a:hover { color: var(--ink-hover); }
::selection { background: var(--ink); color: var(--paper); }
em, h1, h2, h3 { hyphens: none; }
html { scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
[data-reveal][data-shown] { opacity: 1 !important; transform: none !important; }
@media (prefers-reduced-motion: reduce) { [data-reveal] { opacity: 1 !important; transform: none !important; } }

/* Chrome shared across both pages */
.site-header {
  position: sticky; top: 0; z-index: 50;
  display: flex; align-items: center; justify-content: space-between;
  gap: 24px; padding: 18px clamp(20px, 5vw, 72px);
  background: rgba(var(--paper-rgb), 0.84); backdrop-filter: blur(14px);
  border-bottom: 1px solid rgba(var(--ink-rgb), 0.12);
}
.site-footer { padding: 0 clamp(20px, 5vw, 72px) 40px; }

/* Apply form fields (job page) */
.field {
  box-sizing: border-box; width: 100%; padding: 13px 14px; border-radius: 4px;
  border: 1px solid rgba(var(--paper-rgb), 0.28); background-color: rgba(var(--paper-rgb), 0.06);
  color: var(--paper); font-family: inherit; font-size: 15px; letter-spacing: normal; text-transform: none;
}
.field-label {
  display: grid; gap: 7px; font-size: 12px; letter-spacing: 0.16em;
  text-transform: uppercase; color: rgba(var(--paper-rgb), 0.62);
}