.civic{background:#102d2d;--muted:#c0d3ce;--cyan:#b9dcc0}
.civic-intro{min-height:680px;padding-top:70px;gap:65px}
.civic-intro .app-name{align-items:flex-start;flex-direction:column;gap:8px;letter-spacing:0}
.product-category{font-size:.65rem;text-transform:uppercase;letter-spacing:.12em;color:#c0d3ce}
.civic-intro .eyebrow{color:#b9dcc0}.civic-intro h1{font-size:clamp(3rem,5.6vw,5rem)}
.research-flow{margin:0;padding:38px 34px;border:1px solid #63867b;border-radius:6px;background:#163c3a}
.research-flow figcaption{font-size:1.6rem;line-height:1.35;letter-spacing:-.035em}.research-flow figcaption .eyebrow{display:block;font-size:.65rem;letter-spacing:.12em;color:#b9dcc0;margin-bottom:18px}
.research-flow ol{list-style:none;padding:0;margin:28px 0 0}.research-flow li{display:flex;gap:18px;padding:22px 0;border-top:1px solid #ffffff26}.research-flow strong{font-weight:500;font-size:.95rem}.research-flow li p{font-size:.8rem;line-height:1.7;color:#c0d3ce;margin:7px 0 0}.flow-number{font-size:.65rem;line-height:2.4;color:#b9dcc0}.research-flow .flow-note{font-size:.65rem;color:#c0d3ce;margin:12px 0 0}
.civic .vision{border-top:1px solid var(--line)}.civic-principles{display:grid;grid-template-columns:1fr 1fr;gap:70px;padding:60px;background:#e4ece4;color:#193d37;border-radius:5px}.civic-principles h2{margin:0}.civic-principles>div>p:not(.eyebrow){font-size:.92rem}.civic-principles .civic-boundary{font-size:.75rem;border-top:1px solid #a5bcb0;padding-top:18px;margin-bottom:0}.civic .site-foot{flex-wrap:wrap}.civic .site-foot nav{flex:1;justify-content:flex-end}
@media(max-width:1000px){.civic-intro{gap:35px}.research-flow{padding:28px}.civic-principles{padding:40px;gap:40px}}
@media(max-width:700px){.civic-intro{padding-top:35px;padding-bottom:60px;min-height:0}.civic-intro h1{font-size:clamp(2.7rem,10vw,4.4rem)}.research-flow{max-width:490px;width:100%}.civic-principles{grid-template-columns:1fr;padding:32px 26px;gap:20px}.civic .site-foot nav{justify-content:flex-start}}

.pilot-examples{padding:15px 0 75px}.pilot-examples .vision-heading{margin-bottom:35px}.pilot-grid{display:grid;grid-template-columns:1fr 1fr;gap:42px}.pilot-grid article{border-top:1px solid var(--line);padding-top:24px}.pilot-grid h3{font-size:1.45rem}.pilot-grid p{font-size:.92rem;color:var(--muted)}.pilot-note{font-size:.72rem;color:var(--muted);max-width:850px;margin-top:20px}@media(max-width:700px){.pilot-grid{grid-template-columns:1fr;gap:18px}.pilot-examples{padding-bottom:55px}}

.civic-intro{grid-template-columns:1.15fr 1fr;gap:48px;min-height:0;padding:24px 0 42px}
.civic-intro .app-name{margin-bottom:16px}.civic-intro .eyebrow{margin-bottom:14px}
.civic-intro h1{font-size:clamp(2.8rem,4.1vw,4rem);margin-bottom:24px}
.civic-intro .intro-copy{font-size:1rem}.civic-intro .actions{margin-top:22px}
.civic-hero-preview{margin:0;display:flex;flex-direction:column;align-items:center;gap:8px}
.civic-hero-preview picture{display:block}.civic-hero-preview img{height:min(550px,calc(100svh - 210px));width:auto;max-width:100%;object-fit:contain}
.civic-hero-preview figcaption{font-size:.68rem;color:var(--muted);text-align:center;margin:0}
.hero-motion-toggle{font:inherit;font-size:.72rem;color:#f5f7f8;background:transparent;border:1px solid #63867b;border-radius:4px;min-height:36px;padding:6px 14px;cursor:pointer}
.hero-motion-toggle:focus-visible{outline:3px solid #b9dcc0;outline-offset:4px}.hero-motion-toggle[hidden]{display:none}
.research-flow-section{padding:28px 0 60px}.research-flow-section .research-flow{padding:30px 34px}
.research-flow-section .research-flow ol{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;margin-top:22px}
.research-flow-section .research-flow figcaption{font-size:1.45rem}.research-flow-section .research-flow figcaption .eyebrow{margin-bottom:10px}
@media(max-width:700px){
  .civic-intro{display:flex;flex-direction:column;gap:0;padding:12px 0 36px}
  .civic-copy{display:contents}.civic-intro .app-name{order:0;align-self:flex-start;display:flex;flex-direction:row;align-items:center;flex-wrap:wrap;gap:9px;font-size:.85rem;margin:0 0 8px}
  .civic-intro .eyebrow{order:1;align-self:flex-start;font-size:.6rem;margin:0 0 8px}
  .civic-intro h1{order:2;align-self:flex-start;font-size:clamp(1.9rem,7.3vw,2.8rem);line-height:1.07;margin:0 0 14px}
  .civic-hero-preview{order:3;gap:5px;margin-bottom:24px}.civic-hero-preview img{height:min(340px,46svh)}
  .civic-intro .intro-copy{order:4;align-self:flex-start;margin:0 0 18px}.civic-intro .actions{order:5;align-self:flex-start;margin:0}
  .civic-intro .release-note{order:6;align-self:flex-start;margin:16px 0 0}
  .civic .masthead nav{gap:12px}.civic .masthead nav a{font-size:.68rem}.civic .wordmark{font-size:.72rem;gap:7px}
  .research-flow-section .research-flow ol{grid-template-columns:1fr;gap:0}.research-flow-section .research-flow{width:100%;max-width:none;padding:26px}
}
@media(prefers-reduced-motion:reduce){.civic{scroll-behavior:auto}.civic .button{transition:none}.civic .button:hover{transform:none}}