/* Pantheon Build — marketing site (navy + gold). Shared by index.html + about.html. */
:root{
  --ink:#1B2331; --body:#2B3340; --muted:#5C6674; --faint:#8B94A3;
  --page:#F8F8F7; --panel:#F2F3F5; --warm:#EDEEF1; --line:#DFE2E7;
  --accent:#B08D3E; --gold:#C9A45C; --gold-dark:#A57F35;
  --navy:#232B38; --navy-deep:#161D28; --slate:#8B94A3;
  --info:#2F6FB0; --ok:#2E7D52;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:'Inter',system-ui,sans-serif;background:var(--page);color:var(--body);
     font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased}
.mono{font-family:'JetBrains Mono',monospace}
.wrap{max-width:1060px;margin:0 auto;padding:0 28px}
a{color:inherit;text-decoration:none}

/* nav */
nav{position:sticky;top:0;z-index:40;background:rgba(248,248,247,.92);backdrop-filter:blur(8px);
    border-bottom:1px solid var(--line)}
.nav-inner{display:flex;align-items:center;gap:12px;height:64px}
.brand{display:flex;align-items:center;gap:12px}
.brand img{width:36px;height:36px;object-fit:contain}
.navlinks{margin-left:auto;display:flex;align-items:center;gap:26px;font-size:14px;font-weight:600;color:var(--muted)}
.navlinks a:hover{color:var(--ink)}
.navlinks a.active{color:var(--ink)}
.btn{display:inline-flex;align-items:center;gap:8px;background:var(--navy);color:#fff;
     border-radius:8px;padding:11px 20px;font-size:14px;font-weight:600;transition:opacity .15s;cursor:pointer;border:none}
.btn:hover{opacity:.88}
.btn .arrow{color:var(--gold)}
.btn-gold{background:var(--accent);color:var(--navy-deep)}
.btn-gold .arrow{color:var(--navy-deep)}
.btn-ghost{background:transparent;color:var(--ink);border:1px solid var(--line)}
.btn-ghost:hover{border-color:var(--navy);opacity:1}

.wordmark{font-weight:800;font-size:18px;letter-spacing:.14em;color:var(--ink)}
.wordmark .bp{color:var(--accent)}

/* hero */
.hero{padding:88px 0 72px;position:relative;overflow:hidden}
.hero-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:56px;align-items:center}
.eyebrow{font-family:'JetBrains Mono',monospace;font-size:11px;letter-spacing:.16em;
         color:var(--accent);text-transform:uppercase;margin-bottom:18px}
h1{font-size:clamp(34px,5vw,52px);font-weight:800;letter-spacing:-.025em;line-height:1.08;color:var(--ink)}
.hero p.sub{margin:22px 0 30px;font-size:18px;color:var(--muted);max-width:520px}
.tagline{font-family:'JetBrains Mono',monospace;font-size:11.5px;letter-spacing:.1em;
         line-height:2;color:var(--accent);text-transform:uppercase;margin-top:26px}
.cta-row{display:flex;gap:12px;flex-wrap:wrap}
.hero-art img{width:100%;max-width:340px;display:block}

/* sections */
section{padding:76px 0}
.sec-eyebrow{font-family:'JetBrains Mono',monospace;font-size:10.5px;letter-spacing:.16em;
             color:var(--accent);text-transform:uppercase;margin-bottom:10px}
h2{font-size:clamp(26px,3.4vw,34px);font-weight:800;letter-spacing:-.02em;color:var(--ink);margin-bottom:14px}
.lede{font-size:17px;color:var(--muted);max-width:640px}

.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:44px}
.card{background:#fff;border:1px solid var(--line);border-top:3px solid var(--navy);
      border-radius:0 0 12px 12px;padding:24px}
.card .k{font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:.12em;
         color:var(--accent);text-transform:uppercase}
.card h3{font-size:16.5px;font-weight:700;color:var(--ink);margin:8px 0 8px}
.card p{font-size:13.5px;color:var(--muted);line-height:1.55}

/* quote band */
.band{background:var(--navy-deep);color:#fff;padding:84px 0;position:relative;overflow:hidden}
.band::before{content:"";position:absolute;inset:0;opacity:.5;
  background-image:linear-gradient(#ffffff10 1px,transparent 1px),linear-gradient(90deg,#ffffff10 1px,transparent 1px);
  background-size:38px 38px}
.band .wrap{position:relative}
.band blockquote{font-size:clamp(24px,3.4vw,36px);font-weight:800;letter-spacing:-.02em;
                 line-height:1.25;max-width:820px}
.band blockquote em{color:var(--gold);font-style:normal}
.band .attr{margin-top:22px;font-family:'JetBrains Mono',monospace;font-size:11px;
            letter-spacing:.14em;color:#ffffff66;text-transform:uppercase}

/* pillars */
.pillars{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:44px}
.pillar{border-top:3px solid var(--accent);background:#fff;border-left:1px solid var(--line);
        border-right:1px solid var(--line);border-bottom:1px solid var(--line);
        border-radius:0 0 12px 12px;padding:22px}
.pillar .n{font-family:'JetBrains Mono',monospace;font-size:10px;color:var(--faint);letter-spacing:.14em}
.pillar h3{font-size:15.5px;font-weight:700;color:var(--ink);margin:8px 0 6px}
.pillar p{font-size:13px;color:var(--muted)}

/* how it works */
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:44px}
.step{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:26px}
.step .num{width:34px;height:34px;border-radius:50%;background:var(--navy);color:#fff;
           display:flex;align-items:center;justify-content:center;font-family:'JetBrains Mono',monospace;
           font-size:13px;font-weight:700;margin-bottom:16px}
.step .num span{color:var(--gold)}
.step h3{font-size:16px;font-weight:700;color:var(--ink);margin-bottom:8px}
.step p{font-size:13.5px;color:var(--muted)}

/* trust */
.trust{display:grid;grid-template-columns:repeat(2,1fr);gap:14px 32px;margin-top:40px}
.trust li{list-style:none;display:flex;gap:12px;font-size:14.5px;color:var(--body)}
.trust li::before{content:"✓";color:var(--accent);font-weight:700;flex-shrink:0}

/* founders / team (About) */
.people{display:grid;grid-template-columns:repeat(2,1fr);gap:20px;margin-top:40px}
.person{background:#fff;border:1px solid var(--line);border-top:3px solid var(--navy);
        border-radius:0 0 14px 14px;padding:28px;display:flex;gap:22px;align-items:center}
.headshot{width:96px;height:96px;border-radius:50%;flex-shrink:0;display:flex;align-items:center;
          justify-content:center;font-family:'JetBrains Mono',monospace;font-size:26px;font-weight:700;
          color:var(--navy);background:linear-gradient(135deg,#E7E3DA,#F3F1EC);border:1px solid var(--line)}
.headshot img{width:100%;height:100%;border-radius:50%;object-fit:cover}
.person .role{font-family:'JetBrains Mono',monospace;font-size:10.5px;letter-spacing:.14em;
              color:var(--accent);text-transform:uppercase}
.person h3{font-size:21px;font-weight:800;color:var(--ink);margin:6px 0 4px}
.person a.mail{font-family:'JetBrains Mono',monospace;font-size:13.5px;color:var(--info)}
.person a.mail:hover{text-decoration:underline}

.team-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:40px}
.teammate{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:22px;text-align:center}
.teammate .avatar{width:64px;height:64px;border-radius:50%;margin:0 auto 12px;background:var(--warm);
                  border:1px dashed var(--line);display:flex;align-items:center;justify-content:center;
                  color:var(--faint);font-size:22px}
.teammate h4{font-size:14.5px;font-weight:700;color:var(--ink)}
.teammate p{font-size:12px;color:var(--faint);margin-top:2px}
.teammate.placeholder h4{color:var(--faint)}

/* demo section + form */
.demo{background:var(--warm);border-top:1px solid var(--line)}
.demo-grid{display:grid;grid-template-columns:1fr 1fr;gap:40px;margin-top:40px;align-items:start}
.demo-copy p{font-size:15px;color:var(--muted);margin-bottom:16px}
.demo-copy .direct{font-family:'JetBrains Mono',monospace;font-size:13px}
.demo-copy .direct a{color:var(--info)}
.demo-copy .direct a:hover{text-decoration:underline}
form.demo-form{background:#fff;border:1px solid var(--line);border-radius:14px;padding:28px}
form.demo-form label{display:block;font-size:12px;font-weight:600;color:var(--body);margin:0 0 6px}
form.demo-form .field{margin-bottom:16px}
form.demo-form input,form.demo-form textarea{width:100%;border:1px solid var(--line);border-radius:8px;
  padding:11px 13px;font-size:14px;font-family:inherit;color:var(--ink);background:var(--page)}
form.demo-form input:focus,form.demo-form textarea:focus{outline:none;border-color:var(--accent)}
form.demo-form textarea{resize:vertical;min-height:88px}
form.demo-form button{width:100%;justify-content:center;margin-top:4px}

/* footer */
footer{padding:34px 0 44px;border-top:1px solid var(--line)}
.foot{display:flex;align-items:center;gap:12px;flex-wrap:wrap;font-size:12.5px;color:var(--faint)}
.foot img{width:24px;height:24px;object-fit:contain}
.foot .spacer{flex:1}
.foot a:hover{color:var(--ink)}

@media(max-width:900px){
  .hero-grid{grid-template-columns:1fr}
  .hero-art{max-width:320px;margin:0 auto}
  .cards,.steps{grid-template-columns:1fr 1fr}
  .pillars{grid-template-columns:1fr 1fr}
  .team-grid{grid-template-columns:1fr 1fr}
  .demo-grid{grid-template-columns:1fr}
}
@media(max-width:600px){
  .cards,.steps,.pillars,.trust,.people,.team-grid{grid-template-columns:1fr}
  .navlinks .hide-sm{display:none}
  .person{flex-direction:column;text-align:center}
}