@font-face {
  font-family: "Archivo";
  src: url("../opt2/fonts/archivo-400.woff2") format("woff2");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}
@font-face {
  font-family: "Archivo";
  src: url("../opt2/fonts/archivo-600.woff2") format("woff2");
  font-style: normal;
  font-weight: 600 900;
  font-display: swap;
}
@font-face {
  font-family: "Archivo Narrow";
  src: url("../opt2/fonts/archivonarrow-600.woff2") format("woff2");
  font-style: normal;
  font-weight: 500 900;
  font-display: swap;
}
@font-face {
  font-family: "IBM Plex Mono";
  src: url("../opt2/fonts/plexmono-500.woff2") format("woff2");
  font-style: normal;
  font-weight: 500;
  font-display: swap;
}


/* ═══════════════════════════════════════════════════════════════════════
   COWORK 3 Sep 2026 — LEGAL PAGES AT THE RINSE LEVEL (light, contract-safe)
   Head contract kept: color-scheme light only, theme-color #F5EFDF, html/body
   background+color !important. Everything else: three planes, hairlines not
   boxes, one accent three uses, type with air, motion on every tap.
   Copy in the HTML is untouched (SOURCE-BASELINE). This file only paints it.
   ═══════════════════════════════════════════════════════════════════════ */
:root {
  color-scheme: light only;
  --legal-paper: #F5EFDF;
  --legal-paper-deep: #EDE5D2;
  --legal-ink: #141B1A;
  --legal-ink-soft: #3E4644;
  --legal-muted: #7A7368;
  --legal-rule: rgba(20, 27, 26, 0.12);
  --legal-rule-strong: rgba(20, 27, 26, 0.22);
  --legal-glass: rgba(245, 239, 223, 0.66);
  --legal-card: rgba(255, 252, 245, 0.72);
  --legal-accent: #FF9F1F;
  --legal-accent-ink: #B86A00;
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
}

html, body {
  background: var(--legal-paper) !important;
  color: var(--legal-ink) !important;
  color-scheme: light only !important;
}
html { scroll-padding-top: 140px; scroll-behavior: smooth; }
body {
  margin: 0 !important;
  padding: 132px 0 96px !important;
  font-family: "Archivo", system-ui, -apple-system, sans-serif !important;
  font-size: 16px !important;
  line-height: 1.68 !important;
  -webkit-font-smoothing: antialiased;
  background-image:
    radial-gradient(120% 60% at 50% -10%, rgba(255, 159, 31, 0.10), transparent 60%),
    radial-gradient(80% 50% at 100% 100%, rgba(20, 27, 26, 0.05), transparent 60%) !important;
  background-attachment: fixed !important;
}

/* ── PLANE 1 · CHASSIS (glass) ─────────────────────────────────────────── */
.legal-chassis {
  position: fixed; inset: 0 0 auto; z-index: 100;
  display: flex !important; flex-direction: row !important; align-items: center; justify-content: space-between;
  gap: 20px !important; margin: 0 !important; min-height: 64px;
  padding: 10px max(20px, calc((100vw - 760px) / 2)) !important;
  background: linear-gradient(180deg, rgba(255,255,255,0.35), rgba(255,255,255,0)), var(--legal-glass) !important;
  -webkit-backdrop-filter: blur(18px) saturate(1.15); backdrop-filter: blur(18px) saturate(1.15);
  border-bottom: 1px solid var(--legal-rule) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.55), 0 8px 24px -20px rgba(20,27,26,0.35);
}
.legal-chassis__mark { display: block; width: 104px; height: auto; filter: brightness(0); opacity: 0.92; border: 0 !important; }
.legal-chassis__back {
  display: inline-flex; align-items: center; min-height: 36px; padding: 0 14px;
  border: 1px solid var(--legal-rule-strong); border-radius: 18px;
  background: linear-gradient(180deg, rgba(255,255,255,0.5), rgba(255,255,255,0.1));
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.7);
  color: var(--legal-ink) !important; text-decoration: none;
  font-family: "Archivo", sans-serif; font-size: 11px; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase;
  transition: transform 220ms var(--ease-out), border-color 200ms, box-shadow 220ms var(--ease-out);
}
.legal-chassis__back::before { content: "←"; margin-right: 8px; opacity: 0.7; transition: transform 220ms var(--ease-out); }
.legal-chassis__back:hover { border-color: var(--legal-accent); box-shadow: inset 0 1px 0 rgba(255,255,255,0.7), 0 8px 18px -12px rgba(255,159,31,0.6); }
.legal-chassis__back:hover::before { transform: translateX(-3px); }
.legal-chassis__back:active { transform: translateY(1px) scale(0.985); transition-duration: 120ms; }

.legal-index {
  position: fixed; inset: 64px 0 auto; z-index: 99;
  display: flex; gap: 6px; padding: 8px max(20px, calc((100vw - 760px) / 2));
  overflow-x: auto; scrollbar-width: none;
  background: var(--legal-glass) !important;
  -webkit-backdrop-filter: blur(18px) saturate(1.15); backdrop-filter: blur(18px) saturate(1.15);
  border-bottom: 1px solid var(--legal-rule);
  -webkit-mask-image: linear-gradient(90deg, transparent, black 16px, black calc(100% - 24px), transparent);
  mask-image: linear-gradient(90deg, transparent, black 16px, black calc(100% - 24px), transparent);
}
.legal-index::-webkit-scrollbar { display: none; }
.legal-index a {
  flex: 0 0 auto; display: inline-flex; align-items: center; min-height: 32px; padding: 0 12px;
  border: 1px solid transparent; border-radius: 16px;
  color: var(--legal-muted) !important; text-decoration: none;
  font-family: "Archivo", sans-serif; font-size: 11px; font-weight: 600; letter-spacing: 0.10em; text-transform: uppercase;
  transition: color 160ms, border-color 160ms, background-color 160ms, transform 220ms var(--ease-out);
}
.legal-index a:hover, .legal-index a:focus-visible { color: var(--legal-ink) !important; border-color: var(--legal-rule-strong); background: rgba(255,255,255,0.45); }
.legal-index a:active { transform: scale(0.97); }
.site-header { display: none !important; }

/* ── PLANE 2 · PAGE ─────────────────────────────────────────────────────── */
.wrap, .page, main { width: min(100%, 760px) !important; max-width: 760px !important; margin: 0 auto !important; padding: 0 20px !important; }
.page > header, .hero { margin-bottom: 40px !important; }

/* Eyebrows and data: Archivo tracked caps for labels, mono ONLY for genuine data. */
.brand, .eyebrow, .section-num, .summary-box-label, .phase-badge, .contact-card-label, .sn, .track-tag, .dir-num, .sc-label {
  font-family: "Archivo", sans-serif !important; font-size: 11px !important; font-weight: 600 !important;
  letter-spacing: 0.16em !important; text-transform: uppercase !important;
}
.doc-meta, .page-meta, .contact-label, .sc-url, .timing {
  font-family: "IBM Plex Mono", monospace !important; font-size: 11px !important; letter-spacing: 0.04em !important; color: var(--legal-muted) !important;
}
.section-num, .summary-box-label { color: var(--legal-accent-ink) !important; }

.page-title, h1 {
  font-family: "Archivo", sans-serif !important; font-weight: 700 !important;
  font-size: clamp(34px, 8.6vw, 52px) !important; line-height: 1.02 !important; letter-spacing: -0.035em !important;
  color: var(--legal-ink) !important; margin: 0 0 14px !important; max-width: 14ch;
}
.page-title em { font-family: "Archivo", sans-serif !important; font-style: normal !important; font-weight: 300 !important; color: var(--legal-accent-ink) !important; }
.page-meta { margin-bottom: 28px !important; }
.page-lede, .hero > p {
  font-size: 17px !important; line-height: 1.6 !important; color: var(--legal-ink-soft) !important;
  margin: 0 0 36px !important; padding: 0 0 28px !important; border-bottom: 1px solid var(--legal-rule) !important;
}

/* ── PLANE 3 · ONE CARD, then hairline sections ────────────────────────── */
.summary-box, .rule, .action-block {
  position: relative; margin: 0 0 48px !important; padding: 26px 26px 24px !important;
  border: 1px solid rgba(20,27,26,0.35) !important; border-radius: 18px !important;
  background: linear-gradient(180deg, #1B2322, #141B1A) !important; color: var(--legal-paper) !important;
  box-shadow: 0 30px 60px -36px rgba(20,27,26,0.7), inset 0 1px 0 rgba(255,255,255,0.06) !important;
}
.summary-box *, .rule *, .action-block * { color: rgba(245,239,223,0.86) !important; }
.summary-box-label { color: var(--legal-accent) !important; margin-bottom: 14px !important; }
.summary-box li { padding-left: 22px !important; font-size: 14.5px !important; line-height: 1.55 !important; }
.summary-box li::before { color: var(--legal-accent) !important; }

.section { margin: 0 0 40px !important; padding: 0 0 32px !important; border-bottom: 1px solid var(--legal-rule) !important; }
.section:last-of-type { border-bottom: 0 !important; }
h2 { font-family: "Archivo", sans-serif !important; font-size: 22px !important; font-weight: 700 !important; letter-spacing: -0.02em !important; line-height: 1.2 !important; color: var(--legal-ink) !important; margin: 0 0 14px !important; }
h3 { font-family: "Archivo", sans-serif !important; font-size: 16px !important; font-weight: 700 !important; color: var(--legal-ink) !important; margin: 18px 0 8px !important; }
p, li { color: var(--legal-ink-soft) !important; }
p { margin: 0 0 14px !important; }
a { color: var(--legal-accent-ink) !important; text-decoration-thickness: 1px; text-underline-offset: 3px; transition: color 160ms; }
a:hover { color: var(--legal-ink) !important; }

/* Boxed blocks in the source become hairline sections. No box in a box. */
.phase-block, .contact-card {
  background: transparent !important; border: 0 !important; border-radius: 0 !important;
  border-top: 1px solid var(--legal-rule) !important; margin: 0 !important; padding: 16px 0 !important; overflow: visible !important;
}
.phase-header { padding: 0 0 10px !important; border-bottom: 0 !important; }
.phase-badge { padding: 4px 10px !important; border-radius: 12px !important; font-size: 10px !important; }
.badge-live { background: rgba(255,159,31,0.14) !important; color: var(--legal-accent-ink) !important; }
.badge-future { background: rgba(20,27,26,0.06) !important; color: var(--legal-muted) !important; }
.contact-card { margin-top: 40px !important; padding-top: 24px !important; }
.contact-row { grid-template-columns: 140px 1fr !important; font-size: 14px !important; }
table { font-size: 14px !important; }
thead th { background: transparent !important; border-bottom: 1px solid var(--legal-rule-strong) !important; padding: 8px 0 !important; color: var(--legal-muted) !important; font-family: "Archivo", sans-serif !important; font-size: 11px !important; letter-spacing: 0.14em !important; }
tbody td { padding: 12px 0 !important; border-bottom: 1px solid var(--legal-rule) !important; }
tbody td:first-child { color: var(--legal-ink) !important; }
tbody td:last-child { font-family: "IBM Plex Mono", monospace !important; color: var(--legal-muted) !important; }
.future-note { background: transparent !important; border-top: 1px solid var(--legal-rule) !important; padding: 12px 0 0 !important; }
.rights-list li::before { color: var(--legal-accent-ink) !important; }
.divider { background: var(--legal-rule) !important; margin: 32px 0 !important; }

.site-footer { margin-top: 56px !important; padding: 24px 0 0 !important; border-top: 1px solid var(--legal-rule) !important; text-align: left !important; font-size: 12px !important; color: var(--legal-muted) !important; letter-spacing: 0.02em; }
.site-footer a { color: var(--legal-ink-soft) !important; }

/* Arrival: the page rises 12px and fades in, like every other surface. */
@keyframes legal-in { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: none; } }
.wrap, .page, main { animation: legal-in 420ms var(--ease-out) both; }
@media (prefers-reduced-motion: reduce) { .wrap, .page, main { animation: none; } html { scroll-behavior: auto; } }
@media (max-width: 480px) {
  body { padding-top: 124px !important; }
  .summary-box, .rule, .action-block { padding: 22px 20px 20px !important; border-radius: 16px !important; }
  .contact-row { grid-template-columns: 1fr !important; gap: 2px !important; }
}
/* Narrow phones: chassis never wider than the viewport; back pill stays whole. */
.legal-chassis, .legal-index { width: 100vw; max-width: 100vw; box-sizing: border-box; left: 0; right: 0; }
.legal-chassis__back { flex: 0 0 auto; white-space: nowrap; }
.legal-chassis__mark { flex: 0 1 auto; max-width: 40vw; }
@media (max-width: 420px) { .legal-chassis__back { font-size: 10px; padding: 0 12px; letter-spacing: 0.12em; } }