/* ============================================================
   ATTICUS — Interim Site · Policy pages
   Editorial two-column reading layout, locked identity v1.0.
   Loaded after atticus.css.
   ============================================================ */

/* Top rule bar (matches the site's centred label rule) */
.policy-top {
  display: flex; align-items: center; justify-content: center;
  gap: 16px;
  padding-top: clamp(20px, 3.5vh, 36px);
  color: var(--ow-45);
}
.policy-top .rule { width: clamp(20px, 6vw, 64px); }

/* Masthead */
.policy-head {
  padding-top: clamp(40px, 7vh, 88px);
  padding-bottom: clamp(40px, 7vh, 72px);
}
.policy-head .wordmark {
  height: clamp(26px, 3vw, 34px);
  width: auto;
  margin-bottom: clamp(36px, 6vh, 60px);
  opacity: 0.92;
  transition: opacity 0.3s ease;
}
.policy-head .wordmark:hover { opacity: 1; }
.policy-head .back {
  display: inline-flex; align-items: center; gap: 9px;
  color: var(--ow-45);
  margin-bottom: clamp(28px, 5vh, 48px);
  transition: color 0.3s ease;
}
.policy-head .back .arr { transition: transform 0.3s ease; }
.policy-head .back:hover { color: var(--cyan); }
.policy-head .back:hover .arr { transform: translateX(-4px); }
.policy-head .kicker { color: var(--cyan); display: block; margin-bottom: 18px; }
.policy-head h1 { color: var(--offwhite); }
.policy-head .meta { color: var(--ow-45); margin-top: 20px; }

/* Body — numbered editorial sections */
.policy { padding-bottom: var(--section-gap); }
.policy-sec {
  display: grid;
  grid-template-columns: minmax(0, 0.7fr) minmax(0, 1.6fr);
  gap: clamp(20px, 5vw, 80px);
  padding-block: clamp(30px, 4.5vh, 52px);
  border-top: 1px solid var(--ow-08);
}
.policy-sec:last-child { border-bottom: 1px solid var(--ow-08); }

.policy-sec .sec-head {
  display: flex; align-items: baseline; gap: 16px;
}
.policy-sec .num {
  font-family: var(--display);
  font-size: clamp(20px, 2vw, 26px);
  letter-spacing: 0.06em;
  color: var(--cyan);
}
.policy-sec h2 { color: var(--offwhite); }

.policy-sec .sec-body > * + * { margin-top: 18px; }
.policy-sec p {
  color: var(--ow-90);
  font-size: clamp(14px, 1.4vw, 16px);
  line-height: 1.85;
  max-width: 42em;
}
.policy-sec .lead { color: var(--ow-60); }
.policy-sec a {
  color: var(--cyan);
  border-bottom: 1px solid var(--ow-14);
  transition: border-color 0.3s ease;
}
.policy-sec a:hover { border-color: var(--cyan); }

/* Lists — fine cyan dash markers */
.policy-sec ul { list-style: none; max-width: 42em; }
.policy-sec ul li {
  position: relative;
  padding-left: 26px;
  color: var(--ow-90);
  font-size: clamp(14px, 1.4vw, 16px);
  line-height: 1.7;
}
.policy-sec ul li + li { margin-top: 12px; }
.policy-sec ul li::before {
  content: "";
  position: absolute;
  left: 0; top: 0.72em;
  width: 12px; height: 1px;
  background: var(--cyan);
}
.policy-sec ul li .role {
  color: var(--offwhite);
  font-weight: 500;
}

@media (max-width: 720px) {
  .policy-sec { grid-template-columns: 1fr; gap: 14px; }
}
