/*
 * Compass Projects | editorial visual system | 2026-10-09
 * Final cascade layer for public /projects/ only.
 * Applied to the directory and all generated project detail guides.
 * Never load in Dashboard, counselor, checkout, or Majors routes.
 */

body.projects-public-page {
  --project-gold-ink:#1b304e;
  --project-gold-copy:#425b77;
  --project-gold-muted:#566d86;
  --project-gold-blue:#2067d7;
  --project-gold-stroke:#d8e4f3;
  --project-gold-ivory:#fbfdff;
  background:#f6f9fe;
}
body.projects-public-page main {color:var(--project-gold-ink);}
body.projects-public-page main :is(a,button,input,select,summary):focus-visible {
  outline:3px solid #6facff !important;
  outline-offset:3px;
}
body.projects-public-page main [hidden] {display:none !important;}

/* Premium navy headline, bright body type, and a genuine project-workspace
 * illustration instead of the old low-contrast toy laptop, plant and mug. */
body.projects-public-page .projects-hero--premium {
  background:
    radial-gradient(ellipse 650px 360px at 84% 36%,rgba(35,116,225,.32),transparent 74%),
    radial-gradient(ellipse 520px 480px at 20% 4%,rgba(47,85,165,.17),transparent 78%),
    linear-gradient(125deg,#07192e 0%,#102a4c 62%,#081a31 100%) !important;
  padding:72px 0 74px;
  border:0 !important;
  overflow:hidden;
}
body.projects-public-page .projects-hero--premium::before {
  content:"";
  position:absolute;
  inset:0;
  background-image:radial-gradient(circle,rgba(133,185,250,.48) .8px,transparent 1px);
  background-size:24px 24px;
  mask-image:linear-gradient(90deg,transparent 38%,#000 82%);
  opacity:.17;
  pointer-events:none;
}
body.projects-public-page .projects-hero-grid {
  grid-template-columns:minmax(0,1.03fr) minmax(0,.97fr);
  align-items:center;
  gap:clamp(28px,5vw,72px);
  min-height:440px;
}
body.projects-public-page .projects-hero-copy {padding:15px 0 22px;}
body.projects-public-page .projects-hero--premium .projects-eyebrow {
  color:#9ed1ff !important;
  font-size:12px !important;
  font-weight:800;
  letter-spacing:.09em;
}
body.projects-public-page .projects-hero--premium h1 {
  max-width:690px;
  color:#f7fbff !important;
  font-size:clamp(45px,4.8vw,72px);
  line-height:1.07;
  letter-spacing:-.048em;
}
body.projects-public-page .projects-hero--premium h1 span {
  color:#8ecaff !important;
  background:linear-gradient(110deg,#8ee4fa,#7b9bff);
  background-clip:text;
  -webkit-text-fill-color:transparent;
}
body.projects-public-page .projects-hero--premium .projects-lede {
  max-width:590px;
  color:#c2d5ee !important;
  font-size:clamp(16px,1.28vw,18px);
  line-height:1.68;
  margin-top:24px;
}
body.projects-public-page .projects-hero-actions {margin-top:30px;gap:13px;}
body.projects-public-page .projects-hero-actions .projects-primary {
  background:#2373eb !important;color:#fff !important;
  border:1px solid #468efa;
  box-shadow:0 13px 30px rgba(1,12,33,.22);
}
body.projects-public-page .projects-hero-actions .projects-secondary {
  background:rgba(19,44,78,.82) !important;
  border:1px solid rgba(162,200,247,.36) !important;
  color:#edf5ff !important;
}
body.projects-public-page .projects-hero-actions a {font-size:14px;}

/* Distinct, stable CSS-rendered project workspace (no image download).
 * Everything here is illustrative and deliberately aria-hidden. */
body.projects-public-page .projects-hero-visual--studio {
  height:auto;
  min-height:410px;
  isolation:isolate;
  position:relative;
  transform:none !important;
  margin:0;
}
body.projects-public-page .studio-aura {
  position:absolute;inset:4% 4% 0;
  border-radius:50%;
  background:radial-gradient(ellipse,#2378e943,transparent 70%);
  filter:blur(12px);
}
body.projects-public-page .studio-laptop {
  position:absolute;
  width:94%;height:330px;
  left:3%;top:40px;
  transform:rotate(-2deg);
  filter:drop-shadow(0 26px 28px rgba(0,7,19,.30));
}
body.projects-public-page .studio-screen {
  position:relative;
  height:304px;
  background:#f7faff;
  border:8px solid #162b49;
  outline:1px solid rgba(145,190,245,.35);
  border-radius:17px 17px 10px 10px;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.8);
  overflow:hidden;
}
body.projects-public-page .studio-browser-top {
  display:flex;align-items:center;gap:11px;
  height:39px;padding:0 14px;
  background:#102947;color:#c3d9f6;
  font:800 9px/1.2 Inter,Arial,sans-serif;
  letter-spacing:.1em;
}
body.projects-public-page .studio-browser-top b {
  margin-left:auto;font-size:8px;color:#9abce9;font-weight:700;
  letter-spacing:.06em;
}
body.projects-public-page .studio-browser-dots {display:flex;gap:5px;}
body.projects-public-page .studio-browser-dots i {
  display:block;width:7px;height:7px;border-radius:50%;
  background:#779ac9;
}
body.projects-public-page .studio-browser-dots i:first-child {background:#5ad0c5;}
body.projects-public-page .studio-browser-dots i:nth-child(2) {background:#7db8f6;}
body.projects-public-page .studio-dashboard {display:grid;grid-template-columns:56px minmax(0,1fr);min-height:250px;}
body.projects-public-page .studio-menu {
  display:flex;flex-direction:column;align-items:center;gap:17px;
  padding:17px 0;background:#e9f2ff;border-right:1px solid #d6e4f6;
}
body.projects-public-page .studio-menu-symbol {
  display:grid;place-items:center;width:27px;height:27px;
  color:#fff;background:#2366d9;border-radius:8px;font-size:19px;
}
body.projects-public-page .studio-menu-line {
  width:22px;height:7px;border-radius:10px;background:#b5c9e6;
}
body.projects-public-page .studio-menu-line.is-current {
  background:#3479ee;width:27px;
}
body.projects-public-page .studio-menu-line--short {width:15px;}
body.projects-public-page .studio-work {padding:17px clamp(15px,3vw,24px);}
body.projects-public-page .studio-work-kicker {
  display:flex;align-items:center;gap:7px;
  font-size:9px;font-weight:800;letter-spacing:.075em;color:#345d9c;
}
body.projects-public-page .studio-live-dot {
  display:inline-block;flex:0 0 6px;width:6px;height:6px;
  border-radius:50%;background:#22a9a2;
}
body.projects-public-page .studio-progress-pill {
  margin-left:auto;padding:4px 7px;
  border-radius:999px;background:#e4f6f1;color:#176e61;
  font-size:8px;white-space:nowrap;
}
body.projects-public-page .studio-work > strong {
  display:block;margin-top:9px;color:#17345b;
  font:800 clamp(18px,2.4vw,24px)/1.15 Manrope,Inter,sans-serif;
  letter-spacing:-.04em;
}
body.projects-public-page .studio-work > p {
  margin:4px 0 11px !important;
  color:#607895 !important;
  font:600 11px/1.3 Inter,sans-serif;
}
body.projects-public-page .studio-progress-track {
  width:100%;height:7px;background:#e0eaf7;
  border-radius:999px;overflow:hidden;
}
body.projects-public-page .studio-progress-track i {
  display:block;width:61%;height:100%;
  border-radius:999px;background:linear-gradient(90deg,#2777e9,#47c4d8);
}
body.projects-public-page .studio-milestones {
  display:grid;gap:7px;margin-top:13px;
}
body.projects-public-page .studio-milestone {
  display:flex;align-items:center;gap:9px;
  min-width:0;padding:8px 9px;
  border:1px solid #e1e9f5;border-radius:9px;background:#fff;
  box-shadow:0 2px 7px rgba(24,52,95,.035);
}
body.projects-public-page .studio-milestone > span {
  display:grid;place-items:center;flex:0 0 25px;
  width:25px;height:25px;border-radius:7px;
  background:#ebf2ff;color:#4276c2;
  font:800 9px/1 Inter,sans-serif;
}
body.projects-public-page .studio-milestone b {
  color:#274360;font:750 11px/1.25 Inter,sans-serif;min-width:0;
}
body.projects-public-page .studio-milestone em {
  margin-left:auto;font:800 8px/1.2 Inter,sans-serif;
  color:#63809d;letter-spacing:.035em;
}
body.projects-public-page .studio-milestone.is-done > span {
  color:#08796e;background:#d9f6ef;
}
body.projects-public-page .studio-milestone.is-current {
  border-color:#a9c8f6;background:#eff6ff;
}
body.projects-public-page .studio-milestone.is-current > span {
  color:#fff;background:#2869db;
}
body.projects-public-page .studio-milestone.is-current em {color:#2465c3;}
body.projects-public-page .studio-laptop-base {
  position:absolute;bottom:1px;left:-5%;right:-5%;height:31px;
  clip-path:polygon(8% 0,92% 0,100% 66%,78% 100%,22% 100%,0 66%);
  border-radius:3px 3px 18px 18px;
  background:linear-gradient(180deg,#dbe7f7 0%,#9aafc9 54%,#7891b3 100%);
}
body.projects-public-page .studio-laptop-base::before {
  content:"";position:absolute;left:41%;top:2px;
  width:18%;height:5px;border-radius:0 0 9px 9px;background:#8faacb;
}
body.projects-public-page .studio-float {
  position:absolute;z-index:5;display:flex;align-items:center;
  gap:8px;padding:11px 13px;
  background:#fff;color:#254165;
  border:1px solid #b9d3f3;border-radius:12px;
  box-shadow:0 12px 35px rgba(0,11,37,.21);
}
body.projects-public-page .studio-float > span {
  display:grid;place-items:center;
  width:28px;height:28px;border-radius:9px;
  background:#e7f2ff;color:#2267d9;
  font-size:17px;
}
body.projects-public-page .studio-float b {font-size:10px;letter-spacing:.08em;}
body.projects-public-page .studio-float small {font-size:10px;color:#4c6787;}
body.projects-public-page .studio-float--one {top:7px;left:-5%;}
body.projects-public-page .studio-float--two {right:-4%;bottom:7px;}
body.projects-public-page .studio-float--two > span {color:#0d8279;background:#dcf6f0;}

/* Truth & editorial details. These must be readable, never navy-on-navy. */
body.projects-public-page :is(.projects-editorial-strip,.project-editorial-trust) {
  background:#f5f8fd !important;
  padding:19px 0 !important;
  color:#314b6a !important;
}
body.projects-public-page :is(.projects-editorial-strip,.project-editorial-trust) .projects-shell {
  background:#fff !important;
  border:1px solid #dbe5f1 !important;
  border-radius:16px;
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr)) minmax(155px,.9fr);
  box-shadow:0 7px 23px rgba(24,51,86,.04) !important;
  overflow:hidden;
}
body.projects-public-page :is(.projects-editorial-strip,.project-editorial-trust) .projects-shell > :is(span,a) {
  display:flex;align-items:center;flex-wrap:wrap;gap:5px;
  padding:16px !important;
  border:0 !important;
  border-left:1px solid #e4edf7 !important;
  color:#465e7c !important;
  background:transparent !important;
  font-size:13px !important;
  line-height:1.45;
  text-decoration:none;
}
body.projects-public-page :is(.projects-editorial-strip,.project-editorial-trust) .projects-shell > :first-child {border-left:0 !important;}
body.projects-public-page :is(.projects-editorial-strip,.project-editorial-trust) .projects-shell strong {
  color:#23415f !important;font-size:13px !important;font-weight:800;
}
body.projects-public-page :is(.projects-editorial-strip,.project-editorial-trust) .projects-shell > a {
  color:#155bb9 !important;text-decoration:underline;
  text-underline-offset:3px;font-weight:750;justify-content:center;
}
body.projects-public-page :is(.projects-editorial-strip,.project-editorial-trust) .projects-shell > a:hover {
  background:#eef5ff !important;color:#103f83 !important;
}

/* Landing: clear reading rhythm with grouped category collections. */
body.projects-public-page main > .projects-benefits {
  background:#f5f8fd !important;padding:10px 0 28px;
}
body.projects-public-page .projects-benefits-grid {
  background:#fff !important;
  border:1px solid #dce7f4 !important;
  border-radius:20px;
  box-shadow:0 10px 31px rgba(32,58,97,.045) !important;
}
body.projects-public-page .projects-benefits article {
  background:#fff !important;min-width:0;
  border-color:#e5edf6 !important;
}
body.projects-public-page .projects-benefits article > span {
  flex:0 0 46px;width:46px;height:46px;
  background:#e7f1ff !important;color:#235fc6 !important;
  border-radius:13px;
}
body.projects-public-page .projects-benefits strong {
  color:#243d5e !important;font-size:14px !important;
  font-weight:800;line-height:1.3;
}
body.projects-public-page .projects-benefits p {
  margin:6px 0 0;color:#425a77 !important;
  font-size:13px !important;line-height:1.52;
}
body.projects-public-page main > .projects-directory {
  background:#f5f8fd !important;
  padding:20px 0 72px;
}
body.projects-public-page .projects-filter-panel {
  position:relative !important;top:auto !important;z-index:auto !important;
  display:grid;
  grid-template-columns:minmax(190px,2fr) repeat(4,minmax(0,.9fr)) auto;
  margin:0 0 29px;
  border:1px solid #d4e2f1 !important;
  border-radius:18px !important;
  background:#fff !important;
  color:#23405f !important;
  box-shadow:0 15px 35px rgba(22,50,87,.06) !important;
  backdrop-filter:none !important;
  overflow:visible !important;
}
body.projects-public-page .projects-filter-panel label {
  padding:15px 13px;
  border-color:#e5edf5 !important;
  background:#fff !important;
}
body.projects-public-page .projects-filter-panel label > span {
  color:#4b6683 !important;
  font-size:12px !important;font-weight:750;
  line-height:1.45;margin-bottom:5px;
}
body.projects-public-page .projects-filter-panel :is(select,input) {
  background:#fff !important;
  border:0 !important;
  border-radius:6px !important;
  color:#1b3858 !important;
  font-size:14px !important;
  line-height:1.45;min-height:29px;
  font-weight:650;
}
body.projects-public-page .projects-filter-panel input::placeholder {
  color:#647a94 !important;opacity:1;
}
body.projects-public-page .projects-clear {
  background:#f0f6ff !important;color:#1657b0 !important;
  padding:10px 16px;min-width:70px;font-size:13px !important;
  border-color:#e5edf5 !important;border-radius:0 17px 0 0;
}
body.projects-public-page .projects-popular {
  background:#f8fbff !important;
  padding:12px 16px;gap:8px;flex-wrap:wrap;
  border-color:#e1ebf6 !important;
  border-radius:0 0 18px 18px;
}
body.projects-public-page .projects-popular > span,
body.projects-public-page .projects-popular small {
  color:#435c79 !important;font-size:12px !important;
}
body.projects-public-page .projects-popular small strong {color:#1456b9 !important;}
body.projects-public-page .projects-popular button {
  background:#e8f1ff !important;
  color:#25548e !important;
  border:1px solid #d7e6f7 !important;
  border-radius:999px;
  font-size:12px !important;
  line-height:1.2;
  padding:7px 11px;
  font-weight:750;
}
body.projects-public-page .projects-popular button:hover {
  background:#d8e9ff !important;color:#134680 !important;
}
body.projects-public-page .project-family-section {
  position:relative;
  padding:30px clamp(19px,2.3vw,34px) 33px;
  margin:0 0 26px;
  background:#fff !important;
  border:1px solid #e0e9f5 !important;
  border-radius:24px;
  box-shadow:0 12px 37px rgba(26,56,95,.045);
}
body.projects-public-page .project-family-section:nth-of-type(even) {
  background:#eaf2fd !important;
}
body.projects-public-page .project-family-heading {
  display:grid;grid-template-columns:48px minmax(0,1fr) auto;
  gap:15px;align-items:center;
  margin-bottom:22px;
}
body.projects-public-page .project-family-icon {
  width:46px;height:46px;border-radius:13px;
  background:var(--family-soft,#e7f2ff) !important;
  color:var(--family-accent,#2866d9) !important;
}
body.projects-public-page .project-family-icon svg {width:24px;height:24px;}
body.projects-public-page .project-family-heading h2 {
  color:#1b3758 !important;
  font-size:clamp(22px,2vw,29px) !important;
  letter-spacing:-.034em;
  line-height:1.22;
}
body.projects-public-page .project-family-heading p {
  margin-top:4px;
  color:#48627f !important;font-size:14px !important;
  line-height:1.55;
}
body.projects-public-page .project-family-toggle {
  display:inline-flex;align-items:center;justify-content:center;
  min-width:92px;min-height:38px;padding:8px 14px;
  color:#1b59b7 !important;background:#e9f2ff !important;
  border:1px solid #d3e4fb !important;
  border-radius:999px;
  font-size:12px !important;font-weight:800;
}
body.projects-public-page .project-family-toggle:hover {
  color:#103c82 !important;background:#dceaff !important;
}
body.projects-public-page .project-directory-grid {gap:16px;}
body.projects-public-page .project-directory-card {
  position:relative;
  min-height:285px;
  padding:22px;
  background:#fff !important;
  color:#1d3756 !important;
  border:1px solid #dce5f0 !important;
  border-top:3px solid var(--family-accent,#2769db) !important;
  border-radius:16px !important;
  box-shadow:0 7px 23px rgba(25,53,91,.065) !important;
}
body.projects-public-page .project-directory-card:hover {
  border-color:#b9d5f7 !important;
  box-shadow:0 16px 35px rgba(19,53,102,.12) !important;
}
body.projects-public-page .project-card-icon {
  box-shadow:none !important;border-radius:12px;
}
body.projects-public-page .project-card-save {
  color:#3a668e !important;
  border:1px solid #e0ebf6 !important;
  border-radius:9px;
  background:#f7faff !important;
}
body.projects-public-page .project-directory-top {
  color:#526b87 !important;
  font-size:12px !important;line-height:1.45;
  gap:12px;
}
body.projects-public-page .project-directory-top small {
  color:#526b87 !important;font-size:12px !important;
}
body.projects-public-page .project-directory-card h3,
body.projects-public-page .project-directory-card h3 a {
  color:#1b3657 !important;
  font-size:19px !important;line-height:1.33;
}
body.projects-public-page .project-directory-card > p {
  color:#405a77 !important;font-size:14px !important;
  line-height:1.58;
}
body.projects-public-page .project-directory-meta {gap:7px;margin-top:17px;}
body.projects-public-page .project-directory-meta span {
  background:#eaf2ff !important;color:#315b90 !important;
  border:1px solid #dce9f8;
  padding:6px 9px;font-size:11px !important;
  font-weight:700;line-height:1.25;
  white-space:normal;
}
body.projects-public-page .project-directory-link {
  color:#155bbd !important;font-size:13px !important;
  font-weight:800;line-height:1.35;
  text-decoration:underline;text-underline-offset:3px;
}
body.projects-public-page .project-directory-link:hover {
  color:#0a3e89 !important;
}
body.projects-public-page main > .projects-discovery-band {
  padding:24px 0 26px;
  background:#eaf2fd !important;
}
body.projects-public-page .projects-discovery-grid article {
  background:#fff !important;
  border:1px solid #dce6f3 !important;
  box-shadow:0 7px 22px rgba(24,52,91,.04) !important;
}
body.projects-public-page .projects-discovery-grid h2 {
  color:#1c3a5c !important;font-size:19px;
}
body.projects-public-page .projects-discovery-grid p {
  color:#49617b !important;font-size:14px !important;
}
body.projects-public-page .projects-discovery-grid a {
  color:#1459ba !important;font-size:13px !important;
}
body.projects-public-page main > .projects-choice-guide {
  padding:70px 0;background:#fff !important;
}
body.projects-public-page .projects-choice-title h2 {
  color:#203b5c !important;
  font-size:clamp(27px,3vw,38px);
}
body.projects-public-page .projects-choice-steps::before {border-color:#cbdff5;}
body.projects-public-page .projects-choice-steps li {
  background:#f7faff !important;
  border:1px solid #e0e9f4 !important;
  box-shadow:none !important;
  padding:22px;
}
body.projects-public-page .projects-choice-steps li > span {
  background:#e5f0ff !important;color:#255ec3 !important;
}
body.projects-public-page .projects-choice-steps strong {
  color:#244260 !important;font-size:15px !important;
}
body.projects-public-page .projects-choice-steps p {
  color:#465f7a !important;font-size:13px !important;
  line-height:1.6;
}

/* All 180 details: retain their plan, sources and content, but restore
 * bright text and consistent panels across the alternating sections. */
body.projects-public-page .project-detail-hero--premium {
  background:
    radial-gradient(ellipse 650px 450px at 85% 28%,rgba(47,108,225,.28),transparent 70%),
    linear-gradient(115deg,#081b32,#113257) !important;
  border:0 !important;
  padding:62px 0 68px;
}
body.projects-public-page .project-detail-hero .project-breadcrumb,
body.projects-public-page .project-detail-hero .project-breadcrumb :is(a,span) {
  color:#c4d9f2 !important;font-size:13px;
}
body.projects-public-page .project-detail-hero .projects-eyebrow {
  color:#9bcbff !important;font-size:12px !important;
}
body.projects-public-page .project-detail-hero h1 {
  color:#fff !important;line-height:1.08;
}
body.projects-public-page .project-detail-hero :is(.project-detail-lede,.project-detail-why) {
  color:#d5e3f4 !important;
  font-size:clamp(16px,1.35vw,19px) !important;
  line-height:1.6;
}
body.projects-public-page .project-detail-hero .projects-primary {
  background:#2775eb !important;color:#fff !important;
  border:1px solid #639ef2;
}
body.projects-public-page .project-detail-hero .projects-secondary {
  background:rgba(20,50,84,.9) !important;
  border:1px solid #799cc8 !important;color:#eef6ff !important;
}
body.projects-public-page .project-snapshot {
  background:#fff !important;color:#24415f !important;
  border:1px solid #d9e6f5 !important;
  box-shadow:0 16px 35px rgba(0,10,34,.12) !important;
  backdrop-filter:none;
}
body.projects-public-page .project-snapshot > span {
  color:#1657b7 !important;font-size:12px !important;
}
body.projects-public-page .project-snapshot :is(dt,dd) {
  color:#355372 !important;font-size:13px !important;
}
body.projects-public-page .project-snapshot dd {
  color:#1e3a5d !important;font-size:14px !important;font-weight:800;
}
body.projects-public-page .project-snapshot dl div {border-color:#e5edf5 !important;}
/* Crisp project-process illustration; remove the dated faceless figure. */
body.projects-public-page .project-hero-art {
  min-height:280px;
}
body.projects-public-page .project-hero-art .project-art-person,
body.projects-public-page .project-hero-art .project-art-plant {display:none !important;}
body.projects-public-page .project-hero-art .project-art-blob {
  background:radial-gradient(ellipse,#368ce638,transparent 75%) !important;
}
body.projects-public-page .project-hero-art .project-art-device {
  left:8%;right:6%;top:16%;bottom:auto;
  width:86%;height:170px;
  background:#f7faff !important;
  border:8px solid #1a3558 !important;
  border-radius:18px !important;
  box-shadow:0 22px 35px rgba(0,10,35,.19) !important;
  transform:rotate(-3deg);
}
body.projects-public-page .project-hero-art .project-art-screen {
  background:#f4f8ff !important;
}
body.projects-public-page .project-hero-art .project-art-main-icon {
  color:#1964cd !important;
}
body.projects-public-page .project-detail-nav {
  background:rgba(246,250,255,.97) !important;
  border:0 !important;border-bottom:1px solid #d8e4f2 !important;
  box-shadow:0 5px 15px rgba(21,52,94,.05) !important;
}
body.projects-public-page .project-detail-nav a,
body.projects-public-page .project-detail-nav a svg {
  color:#24517f !important;font-size:13px !important;
}
body.projects-public-page .project-detail-nav a:hover {color:#0b4fa5 !important;}
body.projects-public-page .project-detail-section {
  padding-block:clamp(56px,6vw,85px);
}
body.projects-public-page .project-detail-section:nth-of-type(odd) {
  background:#f5f9fe !important;
}
body.projects-public-page .project-detail-section:nth-of-type(even) {
  background:#fff !important;
}
body.projects-public-page .project-detail-section :is(.projects-eyebrow,.project-section-heading .projects-eyebrow) {
  color:#225fac !important;font-size:12px !important;
}
body.projects-public-page .project-detail-section :is(h2,h3,strong) {
  color:#203b5b !important;
}
body.projects-public-page .project-detail-section :is(p,li,dd) {
  color:#435c79 !important;font-size:14px !important;
  line-height:1.69;
}
body.projects-public-page .project-detail-section :is(.project-deliverables li,.project-quality-card,.project-rich-copy aside,.project-skill-card,.project-outcome-card,.project-major-grid a) {
  background:#fff !important;
  border:1px solid #dce7f4 !important;
  border-radius:17px;
  color:#24415f !important;
  box-shadow:0 7px 22px rgba(25,57,99,.045) !important;
}
body.projects-public-page .project-detail-section :is(.project-chip-list span,.project-signal-grid span) {
  background:#eaf2ff !important;color:#28568d !important;
  border:1px solid #d8e7f9 !important;font-size:12px !important;
}
body.projects-public-page .project-detail-section .project-deliverables h3 {
  font-size:18px !important;
}
body.projects-public-page .project-detail-section .project-major-grid a {
  text-decoration:none;
}
body.projects-public-page .project-detail-section .project-major-grid a:hover {
  border-color:#a9c9f3 !important;
}
body.projects-public-page .project-methodology-note {
  background:#f3f7fd !important;padding:28px 0 !important;
}
body.projects-public-page .project-methodology-note .projects-shell {
  background:#fff !important;color:#284363 !important;
  border:1px solid #dce6f4 !important;
  border-radius:17px !important;
  box-shadow:none !important;
  padding:22px;
}
body.projects-public-page .project-methodology-note strong {
  color:#203a58 !important;font-size:16px !important;
}
body.projects-public-page .project-methodology-note p {
  color:#465f7c !important;font-size:14px !important;line-height:1.65;
}
body.projects-public-page .project-methodology-note a {
  color:#1256b6 !important;font-size:13px !important;
  text-decoration:underline;text-underline-offset:3px;
}

/* Footer should be the natural continuation of the project capstone.
 * No gray/red seam, no bright social circle, no discordant CTA purple. */
body.projects-public-page main > .projects-final-cta {
  background:#081b32 !important;
  padding:56px 0 48px !important;
  margin:0;
  border:0 !important;
}
body.projects-public-page .projects-final-cta .projects-shell {
  background:linear-gradient(110deg,#123a65,#0c2b4e 75%,#102e52) !important;
  border:1px solid rgba(148,191,241,.3) !important;
  box-shadow:none !important;
  border-radius:21px !important;
  color:#f6fbff !important;
}
body.projects-public-page .projects-final-cta :is(span,h2) {
  color:#f3f8ff !important;
}
body.projects-public-page .projects-final-cta p {
  color:#c6d9ef !important;font-size:14px !important;line-height:1.55;
}
body.projects-public-page .projects-final-cta a {
  background:#2375ec !important;
  color:#fff !important;
  border:1px solid #4b92fa !important;
  border-radius:12px !important;
  box-shadow:none !important;
  font-size:13px !important;
}
body.projects-public-page .projects-final-cta a:hover {
  background:#155cc4 !important;
}
body.projects-public-page #site-footer .site-footer {
  background:#061222 !important;color:#d9eafa !important;
  border-top:1px solid rgba(148,193,242,.16) !important;
}
body.projects-public-page #site-footer .footer-main-row {
  border-color:rgba(159,203,251,.18) !important;
}
body.projects-public-page #site-footer .footer-brand-block h3 {
  color:#edf6ff !important;
}
body.projects-public-page #site-footer :is(.footer-brand-block p,.footer-small,.footer-copy) {
  color:#bad0ea !important;
}
body.projects-public-page #site-footer .footer-links a {
  color:#c0d5ee !important;
}
body.projects-public-page #site-footer .footer-links a:hover {
  color:#fff !important;
}
body.projects-public-page #site-footer .footer-actions .social-circle {
  background:#112843 !important;color:#edf5ff !important;
  border:1px solid #3a597b !important;box-shadow:none !important;
}
body.projects-public-page #site-footer .footer-actions .support-button {
  background:#245fc5 !important;color:#fff !important;
  border:1px solid #427ce3 !important;box-shadow:none !important;
  letter-spacing:.035em;
}

/* Compact widths: avoid clipped filters, offscreen hero art and sticky bars. */
@media(max-width:1130px) {
  body.projects-public-page .projects-hero-grid {grid-template-columns:1fr 1fr;gap:22px;}
  body.projects-public-page .projects-filter-panel {
    grid-template-columns:minmax(0,1.5fr) repeat(2,minmax(0,1fr));
  }
  body.projects-public-page .projects-filter-panel .projects-clear {
    border-radius:0;border-top:1px solid #e5edf5 !important;
  }
  body.projects-public-page .project-detail-hero-grid {grid-template-columns:minmax(0,1.25fr) minmax(240px,.75fr);}
  body.projects-public-page .project-hero-art {grid-column:1/-1;max-width:530px;}
}
@media(max-width:900px) {
  body.projects-public-page .projects-hero-grid {grid-template-columns:1fr;}
  body.projects-public-page .projects-hero--premium {padding:52px 0 48px;}
  body.projects-public-page .projects-hero-visual--studio {width:100%;max-width:610px;min-height:390px;margin:0 auto;}
  body.projects-public-page :is(.projects-editorial-strip,.project-editorial-trust) .projects-shell {
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  body.projects-public-page :is(.projects-editorial-strip,.project-editorial-trust) .projects-shell > :nth-child(3) {border-left:0 !important;border-top:1px solid #e4edf7 !important;}
  body.projects-public-page :is(.projects-editorial-strip,.project-editorial-trust) .projects-shell > :nth-child(4) {border-top:1px solid #e4edf7 !important;}
  body.projects-public-page .projects-benefits-grid {grid-template-columns:repeat(2,minmax(0,1fr));}
  body.projects-public-page .projects-benefits article:nth-child(3) {border-left:0 !important;border-top:1px solid #e5edf6 !important;}
  body.projects-public-page .projects-benefits article:nth-child(4) {border-top:1px solid #e5edf6 !important;}
}
@media(max-width:620px) {
  body.projects-public-page .projects-shell {width:min(100% - 30px,1240px);}
  body.projects-public-page .projects-hero--premium h1 {font-size:clamp(39px,10vw,54px);}
  body.projects-public-page .projects-hero-visual--studio {min-height:290px;}
  body.projects-public-page .studio-laptop {top:28px;height:254px;}
  body.projects-public-page .studio-screen {height:228px;border-width:5px;}
  body.projects-public-page .studio-browser-top {height:32px;font-size:7px;gap:6px;padding:0 8px;}
  body.projects-public-page .studio-browser-top b {display:none;}
  body.projects-public-page .studio-dashboard {grid-template-columns:37px minmax(0,1fr);}
  body.projects-public-page .studio-menu {gap:13px;padding-top:12px;}
  body.projects-public-page .studio-menu-symbol {width:23px;height:23px;font-size:16px;}
  body.projects-public-page .studio-menu-line {width:16px;height:5px;}
  body.projects-public-page .studio-work {padding:10px 12px;}
  body.projects-public-page .studio-work-kicker {font-size:7px;}
  body.projects-public-page .studio-progress-pill {font-size:6px;padding:3px 5px;}
  body.projects-public-page .studio-work > strong {font-size:18px;margin-top:6px;}
  body.projects-public-page .studio-work > p {font-size:9px !important;margin:3px 0 7px !important;}
  body.projects-public-page .studio-progress-track {height:5px;}
  body.projects-public-page .studio-milestones {margin-top:7px;gap:5px;}
  body.projects-public-page .studio-milestone {padding:5px 7px;gap:6px;}
  body.projects-public-page .studio-milestone > span {width:19px;height:19px;flex-basis:19px;font-size:7px;}
  body.projects-public-page .studio-milestone b {font-size:9px;}
  body.projects-public-page .studio-milestone em {font-size:6px;}
  body.projects-public-page .studio-laptop-base {height:26px;}
  body.projects-public-page .studio-float {padding:6px 7px;gap:6px;}
  body.projects-public-page .studio-float > span {width:22px;height:22px;font-size:13px;}
  body.projects-public-page .studio-float b {font-size:8px;}
  body.projects-public-page .studio-float small {display:none;}
  body.projects-public-page .studio-float--one {left:0;top:0;}
  body.projects-public-page .studio-float--two {right:0;bottom:5px;}
  body.projects-public-page :is(.projects-editorial-strip,.project-editorial-trust) .projects-shell {grid-template-columns:1fr;}
  body.projects-public-page :is(.projects-editorial-strip,.project-editorial-trust) .projects-shell > :is(span,a) {
    border-left:0 !important;border-top:1px solid #e4edf7 !important;
    padding:13px 16px !important;
  }
  body.projects-public-page :is(.projects-editorial-strip,.project-editorial-trust) .projects-shell > :first-child {border-top:0 !important;}
  body.projects-public-page .projects-benefits-grid {grid-template-columns:1fr;}
  body.projects-public-page .projects-benefits article {border-left:0 !important;border-top:1px solid #e5edf6 !important;}
  body.projects-public-page .projects-benefits article:first-child {border-top:0 !important;}
  body.projects-public-page .projects-filter-panel {grid-template-columns:repeat(2,minmax(0,1fr));overflow:hidden !important;}
  body.projects-public-page .projects-filter-panel .projects-search {grid-column:1/-1;}
  body.projects-public-page .projects-filter-panel label:nth-of-type(2n) {border-left:0 !important;}
  body.projects-public-page .projects-popular {gap:6px;}
  body.projects-public-page .projects-popular small {margin-left:0;}
  body.projects-public-page .project-family-section {padding:21px 16px;}
  body.projects-public-page .project-family-heading {grid-template-columns:38px minmax(0,1fr) auto;gap:10px;}
  body.projects-public-page .project-family-icon {width:38px;height:38px;}
  body.projects-public-page .project-family-heading h2 {font-size:21px !important;}
  body.projects-public-page .project-family-heading p {display:block;font-size:12px !important;}
  body.projects-public-page .project-family-toggle {min-width:75px;padding:7px 10px;font-size:11px !important;}
  body.projects-public-page .project-directory-grid {grid-template-columns:1fr;}
  body.projects-public-page .projects-choice-steps {grid-template-columns:1fr;}
  body.projects-public-page .projects-final-cta .projects-shell {padding:24px;}
  body.projects-public-page .project-detail-hero-grid {grid-template-columns:1fr;}
  body.projects-public-page .project-hero-art {min-height:195px;}
  body.projects-public-page .project-detail-nav .projects-shell {gap:20px;}
}
@media(prefers-reduced-motion:reduce) {
  body.projects-public-page :is(.project-directory-card,.projects-primary,.projects-secondary) {
    transition:none !important;
  }
}


/* October 9 visual refinement: repeat the approved major-guide masthead
 * treatment across the Projects hub and all 180 project guides. The artwork
 * stays the official blue Compass mark, on a bright disc so it is visible
 * on navy. The header component and navigation behavior are unchanged. */
body.projects-public-page #site-header .brand-icon {
  display:block;
  width:48px;
  height:48px;
  box-sizing:border-box;
  padding:6px;
  flex:0 0 48px;
  object-fit:contain;
  border:1px solid rgba(198,219,255,.94);
  border-radius:50%;
  background:linear-gradient(145deg,#fff 0%,#edf4ff 100%);
  box-shadow:0 3px 13px rgba(0,0,0,.14);
}
body.projects-public-page #site-header .brand {
  display:inline-flex;
  align-items:center;
  gap:12px;
  text-decoration:none;
}
body.projects-public-page #site-header .brand-name {
  color:#f8fbff !important;
}
body.projects-public-page #site-header .brand-subtitle {
  color:#b8c9e3 !important;
}

/* Hero: replace the simulated laptop/dashboard with a single complete,
 * intentionally composed vector journey. There are no overlapping HTML
 * cards, clipped window frames, photo downloads or fixed-size laptop parts. */
body.projects-public-page .projects-hero-visual--journey {
  position:relative;
  isolation:isolate;
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:0;
  height:auto;
  max-width:640px;
  margin-inline:auto;
  overflow:visible;
  transform:none !important;
}
body.projects-public-page .projects-hero-visual--journey::before {
  content:"";
  position:absolute;
  z-index:-1;
  left:9%;
  right:5%;
  top:14%;
  bottom:6%;
  border-radius:50%;
  background:radial-gradient(ellipse,rgba(45,111,225,.22) 0%,transparent 70%);
  filter:blur(28px);
  pointer-events:none;
}
body.projects-public-page .projects-journey-map {
  display:block;
  width:100%;
  height:auto;
  max-width:600px;
  aspect-ratio:600/440;
  overflow:visible;
}
body.projects-public-page .projects-hero--premium .projects-hero-grid {
  align-items:center;
}
@media(max-width:900px) {
  body.projects-public-page .projects-hero-visual--journey {
    width:100%;
    max-width:575px;
    min-height:0;
    margin:0 auto;
  }
  body.projects-public-page .projects-journey-map {
    max-width:575px;
  }
}
@media(max-width:620px) {
  body.projects-public-page .projects-hero--premium .projects-hero-grid {gap:8px;}
  body.projects-public-page .projects-hero-visual--journey {
    width:100%;
    min-height:0;
    margin:4px auto 8px;
  }
  body.projects-public-page .projects-journey-map {width:100%;height:auto;max-width:100%;}
  body.projects-public-page #site-header .brand-icon {
    width:43px;
    height:43px;
    flex-basis:43px;
    padding:5px;
  }
}


/* Contained hero journey, October 2026: replace the too-wide 55vw
   illustration that crossed into the headline with a grid-bounded graphic.
   The image must never exceed its own right column. */
body.projects-public-page .projects-hero--premium .projects-hero-grid {
  display:grid;
  grid-template-columns:minmax(0,1.06fr) minmax(0,.94fr);
  gap:clamp(26px,3.5vw,52px);
  align-items:center;
}
body.projects-public-page .projects-hero--premium .projects-hero-grid > * {
  min-width:0;
  max-width:100%;
}
body.projects-public-page .projects-hero--premium .projects-hero-copy {
  position:relative;
  z-index:2;
}
body.projects-public-page .projects-hero--premium .projects-hero-visual--journey {
  display:flex;
  align-items:center;
  justify-content:center;
  align-self:center;
  justify-self:stretch;
  width:100%;
  max-width:100%;
  min-width:0;
  min-height:0;
  height:auto;
  margin:0 !important;
  padding:0;
  overflow:hidden;
  transform:none !important;
  z-index:1;
}
body.projects-public-page .projects-hero--premium .projects-journey-map {
  display:block;
  width:100% !important;
  max-width:580px !important;
  min-width:0;
  height:auto !important;
  margin:0 auto !important;
  flex:none !important;
  transform:none !important;
  aspect-ratio:600/440;
  overflow:visible;
}
/* The count cell should present two complete sentences, never a hanging
   comma from a free-floating inline text node beside a flex child. */
body.projects-public-page .projects-editorial-strip .projects-shell > span:nth-child(3) {
  display:flex;
  flex-direction:column;
  flex-wrap:nowrap;
  justify-content:center;
  align-items:flex-start;
  gap:4px;
}
body.projects-public-page .projects-editorial-strip .projects-shell > span:nth-child(3) > strong {
  display:block;
  color:#23415f !important;
  font-size:14px !important;
  line-height:1.35;
}
body.projects-public-page .projects-editorial-strip .projects-shell > span:nth-child(3) > small {
  display:block;
  color:#465e7c !important;
  font-size:12px !important;
  line-height:1.45;
  font-weight:550;
}
@media (max-width:1100px) and (min-width:901px) {
  body.projects-public-page .projects-hero--premium .projects-hero-grid {
    grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);
    gap:22px;
  }
}
@media (max-width:900px) {
  body.projects-public-page .projects-hero--premium .projects-hero-grid {
    grid-template-columns:minmax(0,1fr);
    gap:12px;
  }
  body.projects-public-page .projects-hero--premium .projects-hero-visual--journey {
    width:100%;
    max-width:570px;
    margin:0 auto !important;
  }
  body.projects-public-page .projects-hero--premium .projects-journey-map {
    width:100% !important;
    max-width:570px !important;
    margin:0 auto !important;
    transform:none !important;
  }
}
@media (max-width:620px) {
  body.projects-public-page .projects-hero--premium .projects-hero-grid {
    gap:8px;
  }
  body.projects-public-page .projects-hero--premium .projects-hero-visual--journey {
    width:100%;
    max-width:100%;
    min-height:0;
  }
  body.projects-public-page .projects-hero--premium .projects-journey-map {
    width:100% !important;
    max-width:100% !important;
    height:auto !important;
  }
}