/* Atlas Portal — Momentum design language (portal chrome)
   Tokens from the Atlas–Momentum direction: violet core, soft canvas,
   14–20px radii, 120–420ms motion, visible focus, 48px touch targets.
   Partner co-branding: tenants may override --brand + --brand-soft only. */

:root{
  --brand:#6f5bd3; --brand-deep:#4e3fa3; --brand-soft:#ebe8fa;
  --canvas:#f7f7fb; --card:#ffffff; --ink:#211d33; --muted:#6b6685;
  --line:#e5e2f2; --gold:#e2a93b; --gold-soft:#fdf3df;
  --good:#2e7d32; --good-soft:#e7f3e7; --warn:#b3261e;
  --r-sm:10px; --r:14px; --r-lg:20px;
  --shadow:0 2px 10px rgba(33,29,51,.07), 0 12px 34px rgba(33,29,51,.06);
  --fast:140ms cubic-bezier(.2,.7,.3,1); --slow:340ms cubic-bezier(.2,.7,.3,1);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--canvas);color:var(--ink);
  font:16px/1.55 Lora,Georgia,serif;-webkit-font-smoothing:antialiased}
h1,h2,h3,h4,.f-head{font-family:Montserrat,system-ui,sans-serif}
h1{font-size:clamp(26px,4.5vw,40px);line-height:1.15;font-weight:800;margin:0 0 10px}
h2{font-size:clamp(20px,3vw,27px);font-weight:700;margin:0 0 8px}
h3{font-size:17px;font-weight:700;margin:0 0 6px}
a{color:var(--brand-deep)}
:focus-visible{outline:3px solid var(--brand);outline-offset:2px;border-radius:6px}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}

/* topbar */
.topbar{position:sticky;top:0;z-index:60;background:rgba(255,255,255,.92);
  backdrop-filter:blur(10px);border-bottom:1px solid var(--line);
  display:flex;align-items:center;gap:14px;padding:10px 18px}
.topbar .logo{display:flex;align-items:center;gap:9px;text-decoration:none;color:var(--ink)}
.topbar .logo b{font-family:Montserrat;font-size:17px;letter-spacing:.2px}
.topbar .powered{font-family:Montserrat;font-size:11px;color:var(--muted);
  border-left:1px solid var(--line);padding-left:12px;letter-spacing:.4px}
.topbar nav{margin-left:auto;display:flex;gap:6px;align-items:center;flex-wrap:nowrap;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none}
.topbar nav::-webkit-scrollbar{display:none}
.navlink{font-family:Montserrat;font-size:13.5px;font-weight:600;color:var(--ink);
  text-decoration:none;padding:9px 13px;border-radius:999px;transition:background var(--fast)}
.navlink:hover{background:var(--brand-soft)}
.navlink.cta{background:var(--brand);color:#fff}
.navlink.cta:hover{background:var(--brand-deep)}

/* layout */
.wrap{max-width:1080px;margin:0 auto;padding:26px 18px 80px}
.narrow{max-width:560px}
.grid{display:grid;gap:16px}
@media(min-width:760px){.g2{grid-template-columns:1fr 1fr}.g3{grid-template-columns:repeat(3,1fr)}}

/* cards */
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r-lg);
  padding:22px;box-shadow:var(--shadow)}
.card.tight{padding:16px}
.card h3{margin-top:0}
.kicker{font-family:Montserrat;font-size:11.5px;font-weight:700;letter-spacing:1.6px;
  text-transform:uppercase;color:var(--brand-deep);margin:0 0 8px}
.fine{font-size:13px;color:var(--muted)}
.pill{display:inline-block;font-family:Montserrat;font-size:11.5px;font-weight:700;
  padding:4px 11px;border-radius:999px;background:var(--brand-soft);color:var(--brand-deep)}
.pill.gold{background:var(--gold-soft);color:#8a5f0e}
.pill.good{background:var(--good-soft);color:var(--good)}
.hr{border:0;border-top:1px solid var(--line);margin:18px 0}

/* hero */
.hero{border-radius:var(--r-lg);padding:44px 30px;color:#fff;position:relative;overflow:hidden;
  background:linear-gradient(135deg,var(--brand) 0%,var(--brand-deep) 78%)}
.hero .kicker{color:rgba(255,255,255,.85)}
.hero p.lede{font-size:17.5px;max-width:640px;color:rgba(255,255,255,.94)}
.hero .weave{position:absolute;inset:0;opacity:.07;background-size:420px;pointer-events:none}

/* buttons */
.btn{display:inline-block;font-family:Montserrat;font-weight:700;font-size:15px;
  border:none;border-radius:999px;padding:13px 24px;min-height:48px;cursor:pointer;
  text-decoration:none;text-align:center;transition:transform var(--fast),background var(--fast)}
.btn:active{transform:scale(.98)}
.btn.primary{background:var(--brand);color:#fff}
.btn.primary:hover{background:var(--brand-deep)}
.btn.gold{background:var(--gold);color:#3d2c05}
.btn.ghost{background:transparent;color:var(--brand-deep);border:2px solid var(--brand)}
.btn.onlight{background:#fff;color:var(--brand-deep)}
.btn.wide{display:block;width:100%}
.btn[disabled]{opacity:.5;cursor:not-allowed}

/* forms */
label.f{display:block;font-family:Montserrat;font-size:13px;font-weight:700;margin:14px 0 5px}
input.f,select.f,textarea.f{width:100%;font:15px Lora,serif;padding:12px 14px;
  border:1.5px solid var(--line);border-radius:var(--r-sm);background:#fff;min-height:48px}
input.f:focus,select.f:focus{border-color:var(--brand);outline:none}
.formerr{background:#fdecea;color:var(--warn);border-radius:var(--r-sm);
  padding:10px 14px;font-size:14px;margin:12px 0}
.formok{background:var(--good-soft);color:var(--good);border-radius:var(--r-sm);
  padding:10px 14px;font-size:14px;margin:12px 0}

/* plan cards */
.plan{display:flex;flex-direction:column;gap:10px}
.plan .price{font-family:Montserrat;font-weight:800;font-size:32px}
.plan .price span{font-size:14px;font-weight:600;color:var(--muted)}
.plan ul{margin:0;padding-left:20px;font-size:14.5px}
.plan li{margin:5px 0}
.plan.featured{border:2px solid var(--brand);position:relative}
.plan.featured::before{content:"Most popular";position:absolute;top:-12px;left:20px;
  font-family:Montserrat;font-size:11px;font-weight:800;background:var(--gold);
  color:#3d2c05;padding:3px 12px;border-radius:999px}

/* journey / feature tiles */
.tile{display:block;text-decoration:none;color:var(--ink);background:var(--card);
  border:1px solid var(--line);border-radius:var(--r);padding:18px;
  transition:transform var(--fast),box-shadow var(--fast)}
.tile:hover{transform:translateY(-2px);box-shadow:var(--shadow)}
.tile .ic{font-size:24px}
.tile h3{margin:8px 0 4px}
.tile p{margin:0;font-size:14px;color:var(--muted)}
.locked{position:relative;opacity:.68}
.locked::after{content:"🔒 upgrade";position:absolute;top:12px;right:14px;
  font-family:Montserrat;font-size:11px;font-weight:700;color:var(--brand-deep)}

/* portal shell */
.portal-head{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-bottom:20px}
.portal-head .who{margin-left:auto;font-size:13px;color:var(--muted)}
.statrow{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px}
.stat{background:var(--card);border:1px solid var(--line);border-radius:var(--r);
  padding:14px 16px}
.stat .v{font-family:Montserrat;font-weight:800;font-size:23px;color:var(--brand-deep)}
.stat .l{font-size:12.5px;color:var(--muted)}

/* tables */
table.t{width:100%;border-collapse:collapse;font-size:14px}
table.t th{font-family:Montserrat;font-size:12px;text-align:left;color:var(--muted);
  border-bottom:2px solid var(--line);padding:8px 10px}
table.t td{padding:9px 10px;border-bottom:1px solid var(--line)}
table.t tr:hover td{background:var(--brand-soft)}

/* banners */
.testmode{background:var(--gold-soft);border:1.5px dashed var(--gold);color:#7a5410;
  border-radius:var(--r-sm);padding:10px 16px;font:600 13px Montserrat;margin-bottom:16px}
.footer{margin-top:60px;border-top:1px solid var(--line);padding:26px 18px;
  font-size:13px;color:var(--muted);text-align:center}
.footer .powered-mark{font-family:Montserrat;font-weight:700;color:var(--brand-deep)}

/* ---- mission + audience router ---- */
.mission-band{background:var(--card);border:1px solid var(--line);border-radius:var(--r-lg);
  padding:28px;box-shadow:var(--shadow)}
.mission-band .vision{font-family:Montserrat;font-weight:800;
  font-size:clamp(19px,2.6vw,25px);color:var(--brand-deep)}
.pillar-strip{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:10px;margin-top:16px}
.pillar{background:var(--brand-soft);border-radius:var(--r);padding:12px 14px}
.pillar b{font-family:Montserrat;font-size:13.5px;display:block}
.pillar span{font-size:12.5px;color:var(--muted)}
.door-grid{display:grid;gap:16px;margin-top:20px}
@media(min-width:760px){.door-grid{grid-template-columns:repeat(3,1fr)}}
.door-card{display:block;text-decoration:none;color:var(--ink);background:var(--card);
  border:1.5px solid var(--line);border-radius:var(--r-lg);padding:26px 22px;
  transition:transform var(--fast),box-shadow var(--fast),border-color var(--fast)}
.door-card:hover{transform:translateY(-3px);box-shadow:var(--shadow);border-color:var(--brand)}
.door-card .big{font-size:34px}
.door-card h3{font-size:19px;margin:10px 0 6px}
.door-card .go{font-family:Montserrat;font-weight:700;color:var(--brand-deep);font-size:14px}

/* ---- market comparison pricing ---- */
.compare-table{width:100%;border-collapse:collapse;font-size:14px}
.compare-table th{font-family:Montserrat;font-size:12px;text-align:left;color:var(--muted);
  border-bottom:2px solid var(--line);padding:10px}
.compare-table td{padding:12px 10px;border-bottom:1px solid var(--line);vertical-align:top}
.market-rate{color:var(--muted);text-decoration:line-through;white-space:nowrap}
.market-basis{display:block;font-size:11.5px;color:var(--muted);text-decoration:none}
.our-price{font-family:Montserrat;font-weight:800;color:var(--brand-deep);white-space:nowrap}
.our-price.free{color:var(--good)}
.disc-badge{display:inline-block;font-family:Montserrat;font-size:11px;font-weight:800;
  background:var(--good-soft);color:var(--good);padding:3px 10px;border-radius:999px;
  margin-left:6px;white-space:nowrap}
.local-badge{display:inline-block;font-family:Montserrat;font-size:10.5px;font-weight:800;
  letter-spacing:.5px;background:var(--gold-soft);color:#8a5f0e;padding:3px 10px;
  border-radius:999px;text-transform:uppercase}
.geo-cols{display:grid;gap:14px;margin-top:14px}
@media(min-width:760px){.geo-cols{grid-template-columns:1fr 1fr}}
.geo-col{border:1.5px solid var(--line);border-radius:var(--r);padding:16px}
.geo-col.local{border-color:var(--gold);background:linear-gradient(180deg,var(--gold-soft),#fff 40%)}
.geo-col h4{font-family:Montserrat;margin:0 0 4px;font-size:15px}
.why-free{background:var(--brand-soft);border-radius:var(--r);padding:16px 18px;font-size:14px}
.aud-tabs{display:flex;gap:8px;flex-wrap:wrap;margin:18px 0}
.aud-tab{font-family:Montserrat;font-weight:700;font-size:14px;padding:10px 18px;
  border-radius:999px;border:1.5px solid var(--line);background:#fff;cursor:pointer;
  text-decoration:none;color:var(--ink)}
.aud-tab.on{background:var(--brand);color:#fff;border-color:var(--brand)}

/* ---- motion + rhythm (design pass 2026-07-16) ---- */
@keyframes fadeUp{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
.hero,.mission-band,.why-free{animation:fadeUp .55s cubic-bezier(.2,.7,.3,1) both}
.door-grid .door-card{animation:fadeUp .55s cubic-bezier(.2,.7,.3,1) both}
.door-grid .door-card:nth-child(2){animation-delay:.08s}
.door-grid .door-card:nth-child(3){animation-delay:.16s}
@media (prefers-reduced-motion:reduce){.hero,.mission-band,.why-free,.door-grid .door-card{animation:none}}
.door-card .big{display:inline-flex;align-items:center;justify-content:center;
  width:58px;height:58px;border-radius:18px;background:var(--brand-soft)}
table.t tr:nth-child(even) td{background:#fbfaff}
table.t tr:hover td{background:var(--brand-soft)}
.compare-table tr:nth-child(even) td{background:#fbfaff}
h2{margin-top:8px}
.card+.card{margin-top:0}

/* demo walkthrough banner */
.demobar{background:var(--brand-soft);border:1.5px solid var(--brand);
  color:var(--brand-deep);border-radius:var(--r-sm);padding:10px 16px;
  font:600 13px Montserrat;margin-bottom:16px}
.demobar a{font-weight:800}

/* entitlement matrix */
.matrix{width:100%;border-collapse:collapse;font-size:13.5px}
.matrix th{font-family:Montserrat;font-size:11.5px;color:var(--muted);
  border-bottom:2px solid var(--line);padding:8px 8px;text-align:center}
.matrix th:first-child{text-align:left}
.matrix td{padding:8px;border-bottom:1px solid var(--line);text-align:center}
.matrix td:first-child{text-align:left}
.matrix .yes{color:var(--good);font-weight:800}
.matrix .no{color:var(--line)}

/* C-Suite audit 2026-07-16: byline wrapped to 4 lines and crowded the
   brand in the phone nav; the footer mark carries attribution there */
@media (max-width: 560px) {
  .topbar .powered { display: none; }
}
