/* ============================================================
   ARM — v2 motion & depth styles
   Glass panels · kinetic type · reveals · tilt · progress
   Layered on top of arm-styles.css
   ============================================================ */

/* ---------- scroll progress hairline ---------- */
[id] { scroll-margin-top: 130px; }

.scroll-progress {
  position: fixed; top: 0; left: 0; right: 0; height: 2px;
  background: linear-gradient(90deg, var(--gold-deep), var(--gold), var(--gold-warm));
  transform-origin: 0 50%;
  transform: scaleX(0);
  z-index: 200;
  pointer-events: none;
}

/* ---------- nav elevation ---------- */
.nav { transition: background .4s ease, box-shadow .4s ease; }
.nav-scrolled {
  background: rgba(8, 6, 3, 0.86);
  box-shadow: 0 10px 40px rgba(0,0,0,0.45);
}

/* ---------- glass panels ---------- */
.glass {
  background: linear-gradient(160deg, rgba(255,232,178,0.055) 0%, rgba(181,151,90,0.028) 45%, rgba(255,255,255,0.012) 100%);
  border: 1px solid rgba(212,184,122,0.16);
  backdrop-filter: blur(18px) saturate(1.15);
  -webkit-backdrop-filter: blur(18px) saturate(1.15);
  box-shadow:
    0 1px 0 rgba(255,230,170,0.10) inset,
    0 -1px 0 rgba(0,0,0,0.3) inset,
    0 24px 60px rgba(0,0,0,0.45);
  border-radius: 6px;
}
.glass-deep {
  background: linear-gradient(165deg, rgba(255,232,178,0.035) 0%, rgba(0,0,0,0.25) 100%);
  border: 1px solid rgba(212,184,122,0.12);
  backdrop-filter: blur(24px);
  -webkit-backdrop-filter: blur(24px);
  border-radius: 6px;
}

/* ---------- kinetic type ---------- */
.kin-w { display: inline-block; overflow: hidden; vertical-align: bottom; }
.kin-i {
  display: inline-block;
  transform: translateY(110%);
  opacity: 0;
  transition: transform 0.9s cubic-bezier(0.19, 1, 0.22, 1), opacity 0.6s ease;
}
.in-view .kin-i, [data-kinetic].in-view .kin-i {
  transform: translateY(0);
  opacity: 1;
}

/* ---------- scroll reveals ---------- */
[data-reveal] {
  opacity: 0;
  transform: translateY(36px);
  transition: opacity 0.9s cubic-bezier(0.22, 1, 0.36, 1), transform 0.9s cubic-bezier(0.22, 1, 0.36, 1);
  will-change: opacity, transform;
}
[data-reveal="fade"]  { transform: none; }
[data-reveal="left"]  { transform: translateX(-44px); }
[data-reveal="right"] { transform: translateX(44px); }
[data-reveal="scale"] { transform: scale(0.94); }
[data-reveal].in-view,
[data-reveal].is-revealed {
  opacity: 1;
  transform: none;
}

/* ---------- stagger groups ---------- */
[data-stagger] .stagger-item {
  opacity: 0;
  transform: translateY(28px);
  transition: opacity 0.8s cubic-bezier(0.22, 1, 0.36, 1), transform 0.8s cubic-bezier(0.22, 1, 0.36, 1);
}
[data-stagger].in-view .stagger-item {
  opacity: 1;
  transform: none;
}

/* ---------- 3D tilt cards ---------- */
.tilt-card {
  position: relative;
  transform-style: preserve-3d;
  will-change: transform;
  transition: box-shadow .4s ease;
}
.tilt-card .tilt-glare {
  position: absolute; inset: 0;
  border-radius: inherit;
  pointer-events: none;
  z-index: 3;
}

/* ---------- hero 3D canvas ---------- */
.hero-3d {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  z-index: 0;
}

/* ---------- big numeric stats ---------- */
.stat-xl {
  font-family: 'EB Garamond', Georgia, serif;
  font-weight: 500;
  font-size: clamp(44px, 5.4vw, 84px);
  line-height: 1;
  letter-spacing: -0.02em;
  color: var(--gold);
  font-variant-numeric: tabular-nums;
}
.stat-label {
  font-family: 'IBM Plex Mono', monospace;
  font-size: 11px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--mute);
  margin-top: 12px;
  line-height: 1.6;
}

/* ---------- pinned / sticky story sections ---------- */
.pin-wrap { position: relative; }
.pin-sticky {
  position: sticky;
  top: 120px;
}

/* ---------- marquee band ---------- */
@keyframes arm-marquee {
  from { transform: translateX(0); }
  to   { transform: translateX(-50%); }
}
.marquee {
  overflow: hidden;
  white-space: nowrap;
  border-top: 1px solid var(--rule-2);
  border-bottom: 1px solid var(--rule-2);
  padding: 18px 0;
  position: relative;
}
.marquee-track {
  display: inline-flex;
  gap: 64px;
  padding-right: 64px;
  animation: arm-marquee 46s linear infinite;
  will-change: transform;
}
.marquee-track span {
  font-family: 'IBM Plex Mono', monospace;
  font-size: 12px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--mute);
}
.marquee-track span em { color: var(--gold); font-style: normal; }
.gw-heavy .gw-mark { font-weight: 900; }
@media (prefers-reduced-motion: reduce) {
  .marquee-track { animation: none; }
}

/* ---------- depth backdrop orbs ---------- */
.depth-orb {
  position: absolute;
  border-radius: 50%;
  filter: blur(90px);
  pointer-events: none;
  z-index: 0;
}
.depth-orb-gold {
  background: radial-gradient(circle, rgba(181,151,90,0.14) 0%, transparent 70%);
}

/* keep content above orbs/canvas */
.z-1 { position: relative; z-index: 1; }

/* ============================================================
   GLASS EVERYWHERE — match the orbit detail panel's translucency
   (body-prefixed so these win over page-level <style> blocks)
   ============================================================ */

/* shared recipe */
body .graice-card,
body .board-card,
body .lane,
body .care-specialties,
body .care-guardrails,
body .care-tenet,
body .graice-banner,
body .ask,
body .focus-card,
body .vet-stat,
body .incl-cell,
body .cap-cell,
body .apply-sidebar,
body .apply-form,
body .wp-note {
  background: linear-gradient(160deg, rgba(255,232,178,0.055) 0%, rgba(181,151,90,0.028) 45%, rgba(255,255,255,0.012) 100%);
  border: 1px solid rgba(212,184,122,0.16);
  backdrop-filter: blur(18px) saturate(1.15);
  -webkit-backdrop-filter: blur(18px) saturate(1.15);
  box-shadow:
    0 1px 0 rgba(255,230,170,0.10) inset,
    0 -1px 0 rgba(0,0,0,0.3) inset,
    0 24px 60px rgba(0,0,0,0.35);
  border-radius: 6px;
}
body .graice-card:hover,
body .board-card:hover,
body .lane:hover,
body .focus-card:hover {
  border-color: rgba(212,184,122,0.42);
  background: linear-gradient(160deg, rgba(255,232,178,0.085) 0%, rgba(181,151,90,0.045) 45%, rgba(255,255,255,0.02) 100%);
}

/* 1px-gap grids → real gaps so each cell reads as a floating pane */
body .vet-stats,
body .incl-grid,
body .cap-grid {
  background: transparent;
  border: none;
  gap: 16px;
}

/* form shell: keep the embed area solid for legibility, glass frame */
body .apply-form-embed iframe { border-radius: 0 0 6px 6px; }
body .form-eyebrow { border-bottom: 1px solid rgba(212,184,122,0.16); }

/* buttons — frosted variants */
body .btn-gold {
  background: linear-gradient(160deg, rgba(212,184,122,0.32) 0%, rgba(181,151,90,0.18) 55%, rgba(138,111,58,0.14) 100%);
  border: 1px solid rgba(212,184,122,0.55);
  color: var(--gold-warm);
  backdrop-filter: blur(14px) saturate(1.2);
  -webkit-backdrop-filter: blur(14px) saturate(1.2);
  box-shadow:
    0 1px 0 rgba(255,230,170,0.25) inset,
    0 -1px 0 rgba(0,0,0,0.25) inset,
    0 10px 30px rgba(0,0,0,0.3);
  border-radius: 4px;
}
body .btn-gold:hover {
  background: linear-gradient(160deg, rgba(212,184,122,0.45) 0%, rgba(181,151,90,0.28) 55%, rgba(138,111,58,0.2) 100%);
  border-color: rgba(232,206,148,0.8);
  color: #ffe8b0;
  box-shadow:
    0 1px 0 rgba(255,230,170,0.3) inset,
    0 10px 34px rgba(181,151,90,0.28);
  filter: none;
}
body .btn-ghost,
body .btn-outline-gold {
  background: linear-gradient(160deg, rgba(255,232,178,0.05) 0%, rgba(255,255,255,0.012) 100%);
  border: 1px solid rgba(212,184,122,0.22);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  border-radius: 4px;
}
body .btn-ghost:hover,
body .btn-outline-gold:hover {
  border-color: rgba(212,184,122,0.6);
  background: linear-gradient(160deg, rgba(255,232,178,0.09) 0%, rgba(181,151,90,0.04) 100%);
  box-shadow: 0 8px 26px rgba(181,151,90,0.16);
}

/* pill strips and badges pick up the same frost */
body .apply-sidebar .pillstrip,
body .focus-card-badge {
  background: linear-gradient(160deg, rgba(255,232,178,0.08), rgba(181,151,90,0.03));
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border-radius: 3px;
}

/* marquee band — faint frosted ribbon */
body .marquee {
  background: linear-gradient(160deg, rgba(255,232,178,0.03), rgba(255,255,255,0.008));
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}

/* ---------- orbit (7 pillars) ---------- */
.orbit-shell { display: flex; flex-direction: column; gap: 18px; }
@keyframes orbit-pulse-anim {
  0%   { opacity: 0.5; transform: scale(1); }
  70%  { opacity: 0;   transform: scale(1.22); }
  100% { opacity: 0;   transform: scale(1.22); }
}
.orbit-pulse {
  transform-box: fill-box;
  transform-origin: center;
  animation: orbit-pulse-anim 3.2s cubic-bezier(0.22, 1, 0.36, 1) infinite;
}
@media (prefers-reduced-motion: reduce) { .orbit-pulse { animation: none; } }

@keyframes od-in {
  from { opacity: 0; transform: translateY(10px); }
  to   { opacity: 1; transform: none; }
}
.orbit-detail {
  padding: 20px 24px 22px;
  animation: od-in 0.4s cubic-bezier(0.22, 1, 0.36, 1);
  min-height: 132px;
}
.orbit-detail .od-top {
  display: flex; justify-content: space-between; align-items: baseline;
  gap: 16px; flex-wrap: wrap;
}
.orbit-detail .od-num {
  font-family: 'IBM Plex Mono', monospace;
  font-size: 11px; letter-spacing: 0.18em; text-transform: uppercase;
  color: var(--gold);
}
.orbit-detail .od-status {
  font-family: 'IBM Plex Mono', monospace;
  font-size: 10px; letter-spacing: 0.16em; text-transform: uppercase;
}
.orbit-detail .od-confirmed { color: var(--gold-warm); }
.orbit-detail .od-invited   { color: var(--warn); }
.orbit-detail .od-vacant    { color: var(--mute); }
.orbit-detail .od-org {
  font-family: 'EB Garamond', serif;
  font-size: 17px; color: var(--text);
  margin-top: 8px;
}
.orbit-detail .od-mission {
  font-family: 'EB Garamond', serif;
  font-style: italic;
  font-size: 16.5px; line-height: 1.5;
  color: var(--text-2);
  margin: 8px 0 0;
}