:root{
  --bg:#060913;
  --bg-soft:#0d1122;
  --surface:#0f162c;
  --text:#ecf0ff;
  --muted:#8b9bbf;
  --line:#1e2d52;
  --accent:#ff4fd8;
  --accent-2:#7c5cfc;
  --primary:#5a6bef;
  --primary-soft:#9aa8ff;
  --success:#22d3a8;
  --warn:#fbbf24;
  --radius:14px;
  --max:1160px;
  --pad:1.5rem;
  --glass:rgba(255,255,255,0.03);
}

*{box-sizing:border-box;}
html,body{height:100%;}
body{
  margin:0;
  font-family:Inter,system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial;
  color:var(--text);
  background:
    radial-gradient(ellipse 75% 55% at 8% -8%,#200d44 0%,transparent 50%),
    radial-gradient(ellipse 60% 45% at 92% 4%,#2d0e42 0%,transparent 45%),
    var(--bg);
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  -webkit-text-size-adjust:100%;
}
a{text-decoration:none;color:inherit;}

/* ── Layout ───────────────────────────────── */
.container{
  width:min(var(--max),92vw);
  margin:0 auto;
  padding:0 var(--pad);
}

/* ── Background grid ──────────────────────── */
.bg-grid{
  position:fixed;inset:0;pointer-events:none;
  background-image:
    linear-gradient(color-mix(in srgb,var(--accent-2),transparent 91%) 1px,transparent 1px),
    linear-gradient(90deg,color-mix(in srgb,var(--accent-2),transparent 91%) 1px,transparent 1px);
  background-size:80px 80px;
  opacity:.45;
  mask-image:radial-gradient(ellipse 80% 55% at center,black 15%,transparent 75%);
  z-index:-1;
}

/* ── Header ───────────────────────────────── */
.site-header{
  position:sticky;top:0;z-index:20;
  background:linear-gradient(180deg,rgba(6,9,19,0.72),rgba(6,9,19,0.52));
  border-bottom:1px solid rgba(255,255,255,0.03);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
}
.nav-wrap{
  display:flex;align-items:center;justify-content:space-between;
  gap:1rem;min-height:68px;
}
.brand{
  font-weight:800;letter-spacing:0.01em;font-size:1.1rem;
  background:linear-gradient(90deg,#fff 0%,#a0b4ff 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent;
  flex-shrink:0;
}
.nav-links{display:flex;align-items:center;gap:0.4rem;}
.nav-links a{
  color:var(--muted);font-weight:600;font-size:0.88rem;
  padding:0.4rem 0.7rem;border-radius:8px;
  transition:color .15s,background .15s;
}
.nav-links a:hover,.nav-links a.active{color:var(--text);}
.menu-toggle{
  display:none;z-index:30; /* ensure the button sits above the full‑screen nav */
  border:1px solid rgba(255,255,255,0.07);
  background:transparent;color:var(--text);
  padding:0.4rem 0.75rem;border-radius:8px;
  font-size:0.85rem;cursor:pointer;font-family:inherit;
  /* hide the word "Menu" visually, keep it for screen readers */
  text-indent:-9999px;
  position:relative;
  width:2.4rem; height:2.4rem;
}

/* three‑bar hamburger using a single pseudo‑element */
.menu-toggle::before{
  content:'';
  display:block;
  width:1.4rem; height:2px;
  background:currentColor;
  position:absolute; top:50%; left:50%;
  transform:translate(-50%,-50%);
  box-shadow:0 -6px currentColor,0 6px currentColor;
}
/* simple cross when open */
.menu-toggle.is-open::before{
  transform:translate(-50%,-50%) rotate(45deg);
  box-shadow:0 0 currentColor,0 0 currentColor;
}

/* ── Buttons ──────────────────────────────── */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:0.5rem;
  border-radius:999px;font-weight:700;font-size:0.95rem;
  padding:0.7rem 1.5rem;cursor:pointer;
  transition:transform .18s ease,box-shadow .18s ease;
  border:0;color:var(--text);white-space:nowrap;font-family:inherit;
}
.btn:hover{transform:translateY(-2px);}
.btn-sm{padding:0.42rem 1rem;font-size:0.82rem;}
.btn-primary{
  background:linear-gradient(115deg,var(--accent-2),var(--accent));
  color:#fff;
  box-shadow:0 8px 28px rgba(124,92,252,0.28),0 2px 6px rgba(0,0,0,0.3);
}
.btn-primary:hover{box-shadow:0 14px 36px rgba(124,92,252,0.38),0 4px 10px rgba(0,0,0,0.3);}
.btn-outline{
  background:transparent;
  border:1px solid rgba(255,255,255,0.1);
  color:var(--text);
}
.btn-outline:hover{border-color:rgba(255,255,255,0.22);background:rgba(255,255,255,0.04);}

/* ── Section spacing ─────────────────────── */
.section{padding:5.5rem 0;}
.section-alt{
  padding:5.5rem 0;
  background:linear-gradient(180deg,rgba(255,255,255,0.007) 0%,transparent 100%);
  border-top:1px solid rgba(255,255,255,0.025);
  border-bottom:1px solid rgba(255,255,255,0.025);
}

/* ── Hero ─────────────────────────────────── */
.saas-hero{padding:6.5rem 0 5rem;}
.page-hero{padding:5rem 0 3rem;}
.hero-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:3.5rem;
  align-items:center;
}
.hero-text{max-width:560px;}
.eyebrow,.section-label{
  margin:0 0 0.75rem;
  color:var(--primary-soft);
  text-transform:uppercase;font-weight:800;
  font-size:0.7rem;letter-spacing:0.16em;
}
.saas-hero h1{
  font-size:clamp(2.2rem,4.5vw,4rem);
  line-height:1.03;font-weight:800;
  margin:0 0 1.1rem;letter-spacing:-0.025em;
}
.text-gradient{
  display:inline;
  background:linear-gradient(90deg,#c084fc,#ff4fd8 60%,#ff8ce9);
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
.hero-subtitle{
  font-size:1.05rem;color:var(--muted);
  max-width:50ch;line-height:1.72;margin:0 0 2rem;
}
.hero-actions{display:flex;gap:0.75rem;flex-wrap:wrap;margin-bottom:2.5rem;}
.hero-proof{
  display:flex;align-items:center;gap:0.6rem;
  font-size:0.82rem;color:var(--muted);
}
.hero-proof strong{color:var(--text);}
.proof-avatars{display:flex;}
.proof-avatars span{
  width:28px;height:28px;border-radius:50%;
  border:2px solid var(--bg);
  background:linear-gradient(135deg,var(--accent-2),var(--accent));
  margin-left:-8px;
  display:flex;align-items:center;justify-content:center;
  font-size:0.62rem;font-weight:700;color:#fff;
}
.proof-avatars span:first-child{margin-left:0;}

/* ── Dashboard mockup ─────────────────────── */
.hero-visual{position:relative;}
.hero-visual::before{
  content:'';position:absolute;inset:-30px;
  background:radial-gradient(ellipse at center,rgba(124,92,252,0.13) 0%,transparent 68%);
  pointer-events:none;
}
.dash-mock{
  background:linear-gradient(180deg,#0e1428,#090d1e);
  border:1px solid rgba(255,255,255,0.08);
  border-radius:16px;overflow:hidden;
  box-shadow:
    0 48px 96px rgba(0,0,0,0.55),
    0 0 0 1px rgba(124,92,252,0.1),
    inset 0 1px 0 rgba(255,255,255,0.04);
}
.dash-topbar{
  display:flex;align-items:center;justify-content:space-between;
  padding:0.65rem 1rem;
  border-bottom:1px solid rgba(255,255,255,0.04);
  background:rgba(255,255,255,0.015);
}
.dash-dots{display:flex;gap:6px;}
.dash-dot{width:10px;height:10px;border-radius:50%;}
.dash-dot.r{background:#ff5f57;}
.dash-dot.y{background:#febc2e;}
.dash-dot.g{background:#28c840;}
.dash-title{font-size:0.7rem;color:var(--muted);font-weight:600;}
.dash-badge{
  font-size:0.62rem;font-weight:700;padding:0.2rem 0.55rem;
  border-radius:999px;background:rgba(34,211,168,0.12);color:var(--success);
}
.dash-body{padding:1rem;}
.dash-metrics{
  display:grid;grid-template-columns:repeat(3,1fr);
  gap:0.6rem;margin-bottom:1rem;
}
.dash-metric{
  background:rgba(255,255,255,0.025);
  border:1px solid rgba(255,255,255,0.045);
  border-radius:10px;padding:0.7rem;
}
.dash-metric-label{font-size:0.62rem;color:var(--muted);font-weight:600;text-transform:uppercase;letter-spacing:0.06em;}
.dash-metric-val{font-size:1.2rem;font-weight:800;margin:0.2rem 0 0;color:var(--text);}
.dash-metric-delta{font-size:0.62rem;color:var(--success);font-weight:700;}
.dash-section-label{
  font-size:0.65rem;color:var(--muted);font-weight:700;
  text-transform:uppercase;letter-spacing:0.1em;margin-bottom:0.5rem;
}
.dash-orders{display:grid;gap:0.35rem;}
.dash-order{
  display:flex;align-items:center;justify-content:space-between;
  padding:0.5rem 0.65rem;
  background:rgba(255,255,255,0.015);
  border:1px solid rgba(255,255,255,0.03);
  border-radius:8px;font-size:0.7rem;gap:0.5rem;
}
.dash-order-id{color:var(--muted);font-weight:600;flex-shrink:0;}
.dash-order-name{color:var(--text);font-weight:600;flex:1;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;}
.dash-order-amt{color:var(--text);font-weight:700;flex-shrink:0;}
.dash-status{
  font-size:0.6rem;font-weight:700;padding:0.2rem 0.5rem;
  border-radius:999px;flex-shrink:0;
}
.status-shipped{background:rgba(34,211,168,0.12);color:var(--success);}
.status-processing{background:rgba(124,92,252,0.15);color:#a78bfa;}
.status-pending{background:rgba(251,191,36,0.12);color:var(--warn);}

/* ── Trust bar ────────────────────────────── */
.trust-bar{
  padding:2.5rem 0;
  border-top:1px solid rgba(255,255,255,0.03);
  border-bottom:1px solid rgba(255,255,255,0.03);
}
.trust-bar-inner{
  display:flex;flex-direction:column;align-items:center;gap:1.2rem;
}
.trust-label{
  font-size:0.72rem;color:var(--muted);font-weight:600;
  text-transform:uppercase;letter-spacing:0.12em;
}
.trust-logos{
  display:flex;flex-wrap:wrap;gap:2.5rem;
  align-items:center;justify-content:center;
}
.trust-logo{
  font-size:0.82rem;font-weight:800;color:var(--muted);
  opacity:0.4;letter-spacing:0.08em;text-transform:uppercase;
}

/* ── Module cards ─────────────────────────── */
.module-grid{
  display:grid;gap:1rem;
  grid-template-columns:repeat(auto-fit,minmax(240px,1fr));
  margin-top:2.5rem;
}
.module-card{
  background:linear-gradient(180deg,rgba(255,255,255,0.018),rgba(255,255,255,0.004));
  border:1px solid rgba(255,255,255,0.055);
  border-radius:var(--radius);padding:1.6rem;
  transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease;
}
.module-card:hover{
  transform:translateY(-5px);
  box-shadow:0 22px 52px rgba(0,0,0,0.42);
  border-color:rgba(124,92,252,0.22);
}
.module-icon{
  width:46px;height:46px;border-radius:12px;
  display:flex;align-items:center;justify-content:center;
  margin-bottom:1.1rem;
  border:1px solid rgba(255,255,255,0.06);
}
.module-icon svg{width:22px;height:22px;}
.module-card h3{font-size:1.02rem;font-weight:700;margin:0 0 0.5rem;}
.module-card p{font-size:0.88rem;color:var(--muted);margin:0;line-height:1.65;}

/* ── Steps / How it works ─────────────────── */
.steps-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:0.5rem;
  margin-top:2.5rem;
}
.step{padding:1.2rem 1.5rem;}
.step-num{
  width:52px;height:52px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  font-size:0.88rem;font-weight:800;
  background:linear-gradient(135deg,rgba(124,92,252,0.18),rgba(255,79,216,0.12));
  border:1px solid rgba(124,92,252,0.25);
  margin-bottom:1.2rem;
  color:var(--primary-soft);
}
.step h3{font-size:1rem;font-weight:700;margin:0 0 0.5rem;}
.step p{font-size:0.875rem;color:var(--muted);margin:0;line-height:1.65;}

/* ── Comparison ───────────────────────────── */
.compare-grid{
  display:grid;grid-template-columns:1fr 1fr;
  gap:1rem;margin-top:2.5rem;
}
.compare-col{
  border-radius:var(--radius);padding:1.8rem;
  border:1px solid rgba(255,255,255,0.05);
}
.compare-col.nexalab{
  background:linear-gradient(145deg,rgba(124,92,252,0.08),rgba(255,79,216,0.04));
  border-color:rgba(124,92,252,0.2);
}
.compare-col.others{background:rgba(255,255,255,0.012);}
.compare-col-label{
  font-size:0.72rem;font-weight:800;text-transform:uppercase;
  letter-spacing:0.12em;margin:0 0 1.2rem;
}
.compare-col.nexalab .compare-col-label{color:var(--primary-soft);}
.compare-col.others .compare-col-label{color:var(--muted);}
.compare-list{list-style:none;padding:0;margin:0;display:grid;gap:0.65rem;}
.compare-list li{display:flex;align-items:flex-start;gap:0.65rem;font-size:0.9rem;}
.compare-list .icon{flex-shrink:0;margin-top:1px;font-style:normal;}
.nexalab .compare-list li{color:var(--text);}
.others .compare-list li{color:var(--muted);}
.nexalab .icon{color:var(--success);}
.others .icon{color:rgba(255,255,255,0.2);}

/* ── Pricing ──────────────────────────────── */
.pricing-grid{
  display:grid;grid-template-columns:repeat(3,1fr);
  gap:1rem;margin-top:2.5rem;align-items:start;
}
.pricing-card{
  background:linear-gradient(180deg,rgba(255,255,255,0.018),rgba(255,255,255,0.004));
  border:1px solid rgba(255,255,255,0.055);
  border-radius:var(--radius);padding:1.8rem;
  position:relative;
}
.pricing-card.featured{
  background:linear-gradient(155deg,rgba(124,92,252,0.1),rgba(255,79,216,0.06));
  border-color:rgba(124,92,252,0.28);
}
.pricing-badge{
  position:absolute;top:-13px;left:50%;transform:translateX(-50%);
  background:linear-gradient(90deg,var(--accent-2),var(--accent));
  color:#fff;font-size:0.68rem;font-weight:800;
  padding:0.25rem 0.85rem;border-radius:999px;white-space:nowrap;
  letter-spacing:0.04em;
}
.pricing-card h3{font-size:1.1rem;font-weight:800;margin:0 0 0.3rem;}
.pricing-card .price{font-size:2rem;font-weight:800;margin:0.85rem 0 0.2rem;color:var(--text);}
.pricing-card .price sup{font-size:1rem;vertical-align:super;font-weight:700;}
.price-note{font-size:0.8rem;color:var(--muted);margin:0 0 1.4rem;}
.pricing-features{
  list-style:none;padding:0;margin:0 0 1.6rem;
  display:grid;gap:0.55rem;
}
.pricing-features li{
  display:flex;align-items:flex-start;gap:0.5rem;
  font-size:0.875rem;color:var(--muted);
}
.pricing-features .chk{color:var(--success);flex-shrink:0;}
.pricing-card .btn{width:100%;justify-content:center;}

/* ── CTA section ──────────────────────────── */
.cta-section{padding:6.5rem 0;text-align:center;}
.cta-section h2{
  font-size:clamp(1.7rem,3.5vw,2.6rem);
  margin:0 0 1rem;font-weight:800;letter-spacing:-0.02em;
}
.cta-section p{color:var(--muted);max-width:50ch;margin:0 auto 2rem;font-size:1rem;}
.cta-actions{display:flex;gap:0.75rem;justify-content:center;flex-wrap:wrap;}

/* ── Typography ───────────────────────────── */
h1,h2,h3{line-height:1.1;margin:0 0 0.6rem;letter-spacing:-0.015em;}
h2{font-size:clamp(1.5rem,2.8vw,2.1rem);font-weight:800;}
h3{font-size:1rem;font-weight:700;}
.subtitle{font-size:1rem;color:var(--muted);max-width:62ch;margin:0.4rem 0 0;line-height:1.7;}
.muted{color:var(--muted);}
.price{font-weight:800;color:var(--text);}

/* ── Legacy / contact-page cards ─────────── */
.card,.highlight-card,.tool-card,.stat-card{
  background:linear-gradient(180deg,rgba(255,255,255,0.015),transparent);
  border:1px solid rgba(255,255,255,0.055);
  border-radius:var(--radius);padding:1.5rem;
  transition:transform .22s ease,box-shadow .22s ease;
}
.card:hover,.tool-card:hover{
  transform:translateY(-4px);
  box-shadow:0 20px 50px rgba(0,0,0,0.42);
}
.two-col{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem;align-items:start;}
.list{padding-left:1.2rem;color:var(--muted);}
.list li{margin-bottom:0.45rem;font-size:0.9rem;}

/* ── Forms ────────────────────────────────── */
.form-grid{display:grid;gap:0.9rem;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));}
.form-field{display:block;color:var(--muted);font-weight:600;font-size:0.875rem;}
.form-field input,.form-field select,.form-field textarea{
  width:100%;margin-top:0.5rem;
  padding:0.65rem 0.85rem;border-radius:10px;
  border:1px solid rgba(255,255,255,0.08);
  background:rgba(255,255,255,0.025);
  color:var(--text);font-size:0.95rem;
  outline:none;transition:border-color .15s;font-family:inherit;
}
.form-field input:focus,.form-field select:focus,.form-field textarea:focus{
  border-color:rgba(124,92,252,0.45);
}
.form-field textarea{min-height:130px;resize:vertical;}
.error-text{color:#ffb3d9;margin-top:0.65rem;font-weight:700;font-size:0.875rem;}

/* ── Footer ───────────────────────────────── */
.site-footer{
  padding:2.5rem 0;
  border-top:1px solid rgba(255,255,255,0.03);
}
.footer-wrap{
  display:flex;gap:1rem;align-items:center;
  justify-content:space-between;flex-wrap:wrap;
}
.footer-wrap p,.footer-links a{font-size:0.85rem;color:var(--muted);}
.footer-links{display:flex;gap:1.5rem;flex-wrap:wrap;}
.footer-links a:hover,.footer-wrap a:hover{color:var(--text);}

/* ── FAQ ──────────────────────────────────── */
.faq-list{display:grid;gap:0.6rem;}
.faq-item{overflow:hidden;}
.faq-toggle{
  width:100%;text-align:left;padding:0.8rem 1rem;
  border-radius:10px;background:rgba(255,255,255,0.015);
  border:1px solid rgba(255,255,255,0.045);
  color:var(--text);font-weight:700;cursor:pointer;
  font-size:0.9rem;font-family:inherit;transition:border-color .15s;
}
.faq-toggle.is-open{border-color:rgba(124,92,252,0.22);}
.faq-panel{overflow:hidden;max-height:0;transition:max-height .26s ease;padding:0 1rem;}

/* ── Stats bar ────────────────────────────── */
.stats-section{
  padding:3.5rem 0;
  background:linear-gradient(180deg,rgba(124,92,252,0.05) 0%,rgba(124,92,252,0.01) 100%);
  border-top:1px solid rgba(124,92,252,0.1);
  border-bottom:1px solid rgba(124,92,252,0.1);
}
.stats-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:1rem;
}
.stat-item{text-align:center;padding:1rem 0.5rem;}
.stat-val{
  display:block;
  font-size:clamp(2rem,3.8vw,3rem);
  font-weight:800;letter-spacing:-0.03em;
  background:linear-gradient(135deg,var(--text) 0%,var(--primary-soft) 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent;
  line-height:1;
}
.stat-label{
  display:block;font-size:0.75rem;color:var(--muted);
  font-weight:600;margin-top:0.4rem;
  text-transform:uppercase;letter-spacing:0.1em;
}

/* ── Testimonials ─────────────────────────── */
.testimonials-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:1rem;margin-top:2.5rem;
}
.testimonial-card{
  background:linear-gradient(180deg,rgba(255,255,255,0.018),rgba(255,255,255,0.004));
  border:1px solid rgba(255,255,255,0.055);
  border-radius:var(--radius);padding:1.6rem;
  display:flex;flex-direction:column;gap:1.5rem;
  transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease;
}
.testimonial-card:hover{
  transform:translateY(-5px);
  box-shadow:0 22px 52px rgba(0,0,0,0.42);
  border-color:rgba(124,92,252,0.18);
}
.testimonial-quote{
  font-size:0.95rem;line-height:1.75;
  color:var(--text);margin:0;flex:1;
}
.testimonial-quote::before{content:'\201C';font-size:1.4rem;line-height:0;vertical-align:-0.3em;color:var(--primary-soft);margin-right:0.15em;}
.testimonial-quote::after{content:'\201D';font-size:1.4rem;line-height:0;vertical-align:-0.3em;color:var(--primary-soft);margin-left:0.15em;}
.testimonial-footer{
  display:flex;align-items:center;gap:0.75rem;flex-wrap:wrap;
}
.testimonial-avatar{
  width:38px;height:38px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  font-size:0.68rem;font-weight:800;color:#fff;flex-shrink:0;
}
.testimonial-meta{flex:1;min-width:0;}
.testimonial-name{font-size:0.875rem;font-weight:700;color:var(--text);}
.testimonial-role{font-size:0.75rem;color:var(--muted);}
.testimonial-metric{
  font-size:0.7rem;font-weight:800;
  color:var(--success);background:rgba(34,211,168,0.1);
  padding:0.25rem 0.65rem;border-radius:999px;
  white-space:nowrap;flex-shrink:0;
}

/* ── Integrations ─────────────────────────── */
.integrations-container{max-width:860px;}
.integrations-categories{
  display:grid;gap:1.8rem;margin-top:2.5rem;
}
.integrations-group-label{
  display:block;
  font-size:0.72rem;font-weight:800;color:var(--muted);
  text-transform:uppercase;letter-spacing:0.12em;
  margin-bottom:0.75rem;
}
.integrations-chips{
  display:flex;flex-wrap:wrap;gap:0.5rem;
}
.integration-chip{
  display:inline-flex;align-items:center;gap:0.45rem;
  padding:0.42rem 0.85rem;
  background:rgba(255,255,255,0.025);
  border:1px solid rgba(255,255,255,0.06);
  border-radius:999px;
  font-size:0.82rem;font-weight:600;color:var(--muted);
  transition:border-color .18s,color .18s,background .18s;
}
.integration-chip:hover{
  border-color:rgba(124,92,252,0.28);
  color:var(--text);
  background:rgba(124,92,252,0.06);
}
.chip-dot{
  width:7px;height:7px;border-radius:50%;flex-shrink:0;opacity:0.8;
}

/* ── FAQ ──────────────────────────────────── */
.faq-container{max-width:720px;}
.faq-list{display:grid;gap:0.6rem;}
.faq-item{overflow:hidden;}
.faq-toggle{
  width:100%;text-align:left;padding:0.9rem 1.1rem;
  border-radius:10px;background:rgba(255,255,255,0.015);
  border:1px solid rgba(255,255,255,0.045);
  color:var(--text);font-weight:700;cursor:pointer;
  font-size:0.9rem;font-family:inherit;
  transition:border-color .15s,background .15s;
  display:flex;align-items:center;justify-content:space-between;gap:1rem;
}
.faq-toggle::after{
  content:'↓';font-size:0.75rem;color:var(--muted);
  transition:transform .26s ease;flex-shrink:0;
}
.faq-toggle.is-open{
  border-color:rgba(124,92,252,0.25);
  background:rgba(124,92,252,0.04);
}
.faq-toggle.is-open::after{transform:rotate(180deg);}
.faq-panel{
  overflow:hidden;max-height:0;
  transition:max-height .28s ease;
}
.faq-panel p{
  padding:0.9rem 1.1rem 1.1rem;
  font-size:0.9rem;color:var(--muted);
  line-height:1.72;margin:0;
}

/* ── Reveal animation ─────────────────────── */
.reveal{opacity:0;transform:translateY(8px);transition:opacity .5s ease,transform .5s ease;}
.in-view{opacity:1;transform:none;}

/* ── Responsive ───────────────────────────── */
@media(max-width:1000px){
  .hero-grid{grid-template-columns:1fr;}
  .hero-text{max-width:none;}
  .hero-visual{display:none;}
  .steps-grid{grid-template-columns:1fr;gap:1.5rem;}
  .pricing-grid{grid-template-columns:1fr;}
  .compare-grid{grid-template-columns:1fr;}
  .two-col{grid-template-columns:1fr;}
  .stats-grid{grid-template-columns:repeat(2,1fr);}
  .testimonials-grid{grid-template-columns:1fr;}
  .menu-toggle{display:inline-flex;} /* show hamburger earlier */
}
@media(max-width:768px){
  .saas-hero{padding:4rem 0 3.5rem;}
  .section,.section-alt{padding:4rem 0;}
  .module-grid{grid-template-columns:repeat(auto-fit,minmax(200px,1fr));}
  .menu-toggle{display:inline-flex;}

  /* mobile navigation: cover entire screen and slide from top */
  .nav-links{
    position:absolute;      /* drop down from header rather than cover screen */
    top:100%;left:0;right:0;
    z-index:25;
    background:rgba(6,9,19,0.97);
    display:flex;
    flex-direction:column;
    align-items:center;     /* center horizontally */
    padding:1.2rem 0 1.2rem;
    transform-origin:top;
    transform:scaleY(0);
    transition:transform .22s ease;
    backdrop-filter:blur(14px);
    /* no overflow; size will grow with content */
  }
  .nav-links.open{transform:scaleY(1);}
  .nav-links a{padding:0.8rem 1rem;width:100%;text-align:center;}
  /* ensure the nav pushes page content down when active */
  .nav-links.open + main,
  .nav-links.open + header + main {
    /* nothing required; the absolute element floats over content */
  }
}

/* ─────────────────────────────────────────── */
/* ── Platform page                         ── */
/* ─────────────────────────────────────────── */

/* Stack visual */
.stack-visual{
  display:grid;gap:0.6rem;
  max-width:580px;margin:3rem auto 0;
  text-align:left;
}
.stack-layer{
  display:flex;align-items:center;gap:1rem;
  padding:1rem 1.3rem;border-radius:12px;
  border:1px solid rgba(255,255,255,0.055);
  background:linear-gradient(135deg,rgba(255,255,255,0.02),rgba(255,255,255,0.008));
  transition:border-color .2s,transform .2s;
  cursor:default;
}
.stack-layer:hover{
  border-color:rgba(124,92,252,0.25);
  transform:translateX(5px);
}
.stack-icon{
  width:38px;height:38px;border-radius:10px;
  display:flex;align-items:center;justify-content:center;
  flex-shrink:0;
}
.stack-icon svg{width:18px;height:18px;}
.stack-info{flex:1;}
.stack-name{font-weight:700;font-size:0.9rem;color:var(--text);}
.stack-desc{font-size:0.77rem;color:var(--muted);margin-top:0.12rem;}
.stack-arrow{
  font-size:0.72rem;color:var(--muted);
  width:20px;text-align:center;flex-shrink:0;
}

/* Feature row layout */
.feature-section{overflow:hidden;}
.feature-row{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:4rem;align-items:center;
}
.feature-row.flip .feature-content{order:2;}
.feature-row.flip .feature-visual{order:1;}
.feature-content{
  display:flex;flex-direction:column;gap:0;
}
.feature-tag{
  display:inline-flex;align-items:center;
  font-size:0.7rem;font-weight:800;
  padding:0.3rem 0.75rem;border-radius:999px;
  text-transform:uppercase;letter-spacing:0.1em;
  margin-bottom:1rem;width:fit-content;
}
.feature-content h2{
  font-size:clamp(1.4rem,2.5vw,2rem);
  margin:0 0 0.8rem;
}
.feature-desc{
  font-size:0.92rem;color:var(--muted);
  line-height:1.72;margin:0 0 0;
}
.feature-bullet-list{
  list-style:none;padding:0;
  margin:1.4rem 0 1.8rem;
  display:grid;gap:0.6rem;
}
.feature-bullet-list li{
  display:flex;align-items:flex-start;gap:0.6rem;
  font-size:0.875rem;color:var(--muted);line-height:1.55;
}
.feature-bullet-list li::before{
  content:"→";
  color:var(--primary-soft);
  flex-shrink:0;margin-top:0.05em;
}

/* Store mockup */
.store-mock{
  background:linear-gradient(180deg,#0e1428,#090d1e);
  border:1px solid rgba(255,255,255,0.08);
  border-radius:16px;overflow:hidden;
  box-shadow:0 40px 80px rgba(0,0,0,0.5),0 0 0 1px rgba(124,92,252,0.08);
}
.store-lock{font-size:0.65rem;color:var(--success);font-weight:700;}
.store-body{display:grid;grid-template-columns:1fr 1fr;gap:0;}
.store-img-placeholder{
  background:linear-gradient(135deg,rgba(124,92,252,0.08),rgba(255,79,216,0.06));
  display:flex;align-items:center;justify-content:center;
  min-height:220px;position:relative;
  border-right:1px solid rgba(255,255,255,0.04);
}
.store-img-inner{opacity:0.4;}
.store-img-badge{
  position:absolute;top:0.7rem;left:0.7rem;
  font-size:0.62rem;font-weight:800;letter-spacing:0.06em;text-transform:uppercase;
  background:rgba(255,79,216,0.15);color:var(--accent);
  padding:0.2rem 0.55rem;border-radius:999px;
  border:1px solid rgba(255,79,216,0.2);
}
.store-details{padding:1rem 1rem 1rem;}
.store-brand-tag{
  font-size:0.65rem;font-weight:800;text-transform:uppercase;
  letter-spacing:0.1em;color:var(--muted);margin-bottom:0.4rem;
}
.store-product-name{
  font-size:0.85rem;font-weight:700;color:var(--text);
  line-height:1.3;margin-bottom:0.5rem;
}
.store-price-row{display:flex;align-items:baseline;gap:0.5rem;margin-bottom:0.8rem;}
.store-price{font-size:1.1rem;font-weight:800;color:var(--text);}
.store-price-orig{font-size:0.8rem;color:var(--muted);text-decoration:line-through;}
.store-variants-label{font-size:0.65rem;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:0.06em;margin-bottom:0.4rem;}
.store-variants{display:flex;gap:0.35rem;margin-bottom:0.8rem;}
.variant-chip{
  width:28px;height:28px;border-radius:7px;
  display:flex;align-items:center;justify-content:center;
  font-size:0.65rem;font-weight:700;
  border:1px solid rgba(255,255,255,0.08);
  color:var(--muted);background:rgba(255,255,255,0.02);
  cursor:pointer;
}
.variant-chip.active{
  border-color:var(--primary-soft);
  color:var(--primary-soft);
  background:rgba(124,92,252,0.1);
}
.store-atc-btn{
  width:100%;padding:0.55rem;border-radius:8px;
  background:linear-gradient(115deg,var(--accent-2),var(--accent));
  color:#fff;font-weight:700;font-size:0.78rem;
  border:0;cursor:pointer;margin-bottom:0.6rem;
}
.store-trust-row{
  display:flex;gap:0.75rem;flex-wrap:wrap;
  font-size:0.62rem;color:var(--muted);
}

/* Inventory mockup */
.inventory-mock{
  background:linear-gradient(180deg,#0e1428,#090d1e);
  border:1px solid rgba(255,255,255,0.08);
  border-radius:16px;overflow:hidden;
  box-shadow:0 40px 80px rgba(0,0,0,0.5);
}
.inv-body{padding:0.8rem;}
.inv-header-row{
  display:grid;grid-template-columns:0.6fr 1.4fr 0.6fr 0.8fr;
  gap:0.5rem;padding:0.4rem 0.5rem;
  font-size:0.62rem;font-weight:700;color:var(--muted);
  text-transform:uppercase;letter-spacing:0.08em;
  border-bottom:1px solid rgba(255,255,255,0.04);margin-bottom:0.3rem;
}
.inv-row{
  display:grid;grid-template-columns:0.6fr 1.4fr 0.6fr 0.8fr;
  gap:0.5rem;align-items:center;
  padding:0.45rem 0.5rem;font-size:0.72rem;
  border-radius:6px;
}
.inv-row:hover{background:rgba(255,255,255,0.015);}
.inv-row-warn{background:rgba(251,191,36,0.03) !important;}
.inv-sku{color:var(--muted);font-weight:600;}
.inv-name{color:var(--text);font-weight:600;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;}
.inv-stock{font-weight:700;color:var(--text);}
.inv-alert{
  margin-top:0.6rem;padding:0.5rem 0.65rem;
  background:rgba(251,191,36,0.06);
  border:1px solid rgba(251,191,36,0.12);
  border-radius:8px;font-size:0.68rem;color:var(--warn);font-weight:600;
}

/* Shipping tracking mockup */
.tracking-mock{
  background:linear-gradient(180deg,#0e1428,#090d1e);
  border:1px solid rgba(255,255,255,0.08);
  border-radius:16px;overflow:hidden;
  box-shadow:0 40px 80px rgba(0,0,0,0.5);
}
.tracking-body{padding:1.1rem;}
.tracking-order-header{
  display:flex;justify-content:space-between;align-items:flex-start;
  margin-bottom:1.2rem;
}
.tracking-order-id{font-weight:800;font-size:0.95rem;color:var(--text);}
.tracking-carrier{font-size:0.7rem;color:var(--muted);margin-top:0.2rem;}
.tracking-eta{text-align:right;}
.track-timeline{display:grid;gap:0;position:relative;}
.track-step{
  display:flex;align-items:flex-start;gap:0.8rem;
  padding-bottom:1.1rem;position:relative;
}
.track-step:last-child{padding-bottom:0;}
.track-step::before{
  content:'';position:absolute;
  left:9px;top:20px;bottom:0;
  width:1px;background:rgba(255,255,255,0.06);
}
.track-step:last-child::before{display:none;}
.track-dot{
  width:18px;height:18px;border-radius:50%;flex-shrink:0;
  border:2px solid rgba(255,255,255,0.1);
  background:rgba(255,255,255,0.03);
  position:relative;z-index:1;margin-top:1px;
}
.track-dot.done{
  border-color:var(--success);
  background:rgba(34,211,168,0.15);
}
.track-dot.active{
  border-color:var(--primary-soft);
  background:rgba(124,92,252,0.2);
  box-shadow:0 0 0 3px rgba(124,92,252,0.12);
}
.track-label{font-size:0.78rem;font-weight:600;color:var(--muted);}
.track-time{font-size:0.68rem;color:var(--muted);opacity:0.6;margin-top:0.1rem;}

/* Analytics mockup */
.analytics-mock{
  background:linear-gradient(180deg,#0e1428,#090d1e);
  border:1px solid rgba(255,255,255,0.08);
  border-radius:16px;overflow:hidden;
  box-shadow:0 40px 80px rgba(0,0,0,0.5);
}
.analytics-body{padding:1.1rem;}
.analytics-header{
  display:flex;justify-content:space-between;align-items:flex-start;
  margin-bottom:1rem;
}
.analytics-title{font-size:0.7rem;color:var(--muted);font-weight:600;text-transform:uppercase;letter-spacing:0.08em;}
.analytics-val{font-size:1.4rem;font-weight:800;color:var(--text);margin-top:0.2rem;}
.analytics-delta{
  font-size:0.75rem;font-weight:800;
  color:var(--success);background:rgba(34,211,168,0.1);
  padding:0.3rem 0.7rem;border-radius:999px;
  align-self:flex-start;
}
.bar-chart{
  display:flex;gap:0.5rem;align-items:flex-end;
  height:80px;margin-bottom:1rem;
  padding:0 0.2rem;
}
.bar-group{
  flex:1;display:flex;flex-direction:column;
  align-items:center;justify-content:flex-end;gap:0.3rem;
  height:100%;
}
.bar{
  width:100%;border-radius:4px 4px 0 0;
  background:rgba(124,92,252,0.25);
  transition:background .2s;
}
.bar.active{background:linear-gradient(180deg,var(--accent-2),rgba(124,92,252,0.6));}
.bar-label{font-size:0.62rem;color:var(--muted);font-weight:600;}
.analytics-metrics{
  display:grid;grid-template-columns:repeat(3,1fr);
  gap:0.5rem;margin-bottom:0.8rem;
}
.analytics-metric-item{
  background:rgba(255,255,255,0.02);
  border:1px solid rgba(255,255,255,0.04);
  border-radius:8px;padding:0.5rem;
}
.analytics-metric-label{font-size:0.6rem;color:var(--muted);font-weight:600;text-transform:uppercase;letter-spacing:0.06em;}
.analytics-metric-val{font-size:0.95rem;font-weight:800;color:var(--text);margin:0.15rem 0 0.1rem;}
.analytics-metric-delta{font-size:0.62rem;font-weight:700;}
.experiment-pill{
  padding:0.5rem 0.7rem;
  background:rgba(124,92,252,0.06);
  border:1px solid rgba(124,92,252,0.14);
  border-radius:8px;font-size:0.7rem;color:var(--muted);
  display:flex;flex-wrap:wrap;gap:0.3rem;
}

/* Security section */
.security-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:1rem;
}
.security-item{
  display:flex;align-items:flex-start;gap:1rem;
  padding:1.3rem;
  background:linear-gradient(180deg,rgba(255,255,255,0.018),rgba(255,255,255,0.004));
  border:1px solid rgba(255,255,255,0.055);
  border-radius:var(--radius);
  transition:border-color .2s,transform .2s;
}
.security-item:hover{
  border-color:rgba(124,92,252,0.18);
  transform:translateY(-3px);
}
.security-icon{
  width:40px;height:40px;border-radius:10px;
  display:flex;align-items:center;justify-content:center;
  flex-shrink:0;color:var(--primary-soft);
  background:rgba(124,92,252,0.08);
  border:1px solid rgba(124,92,252,0.12);
}
.security-name{font-weight:700;font-size:0.875rem;color:var(--text);margin-bottom:0.3rem;}
.security-desc{font-size:0.82rem;color:var(--muted);line-height:1.6;}

/* Platform responsive */
@media(max-width:1000px){
  .feature-row,.feature-row.flip{
    grid-template-columns:1fr;gap:2rem;
  }
  .feature-row.flip .feature-content{order:0;}
  .feature-row.flip .feature-visual{order:0;}
  .security-grid{grid-template-columns:1fr 1fr;}
  .store-body{grid-template-columns:1fr;}
  .store-img-placeholder{min-height:140px;}
}
@media(max-width:640px){
  .security-grid{grid-template-columns:1fr;}
}

/* ─────────────────────────────────────────── */
/* ── Contact page                          ── */
/* ─────────────────────────────────────────── */

.contact-hero{padding-bottom:1rem;}
.contact-section{padding-top:2rem;}

.contact-layout{
  display:grid;
  grid-template-columns:340px 1fr;
  gap:3.5rem;
  align-items:start;
}

/* Sidebar */
.contact-sidebar{
  position:sticky;top:88px;
  display:grid;gap:1.6rem;
}
.sidebar-block{
  background:linear-gradient(180deg,rgba(255,255,255,0.018),rgba(255,255,255,0.004));
  border:1px solid rgba(255,255,255,0.055);
  border-radius:var(--radius);
  padding:1.4rem;
}
.sidebar-label{
  font-size:0.68rem;font-weight:800;color:var(--muted);
  text-transform:uppercase;letter-spacing:0.12em;margin:0 0 1.1rem;
}

/* What's next steps */
.next-steps{
  list-style:none;margin:0;padding:0;
  display:grid;gap:1.1rem;
}
.next-step{
  display:flex;align-items:flex-start;gap:0.85rem;
}
.next-num{
  font-size:0.65rem;font-weight:800;color:var(--primary-soft);
  background:rgba(124,92,252,0.1);border:1px solid rgba(124,92,252,0.18);
  border-radius:6px;width:24px;height:24px;
  display:flex;align-items:center;justify-content:center;
  flex-shrink:0;margin-top:0.05rem;
}
.next-step strong{display:block;font-size:0.82rem;color:var(--text);margin-bottom:0.2rem;}
.next-step p{font-size:0.77rem;color:var(--muted);margin:0;line-height:1.5;}

/* Service chips */
.service-chips{
  list-style:none;margin:0;padding:0;
  display:flex;flex-wrap:wrap;gap:0.4rem;
}
.service-chips li{
  font-size:0.75rem;font-weight:600;color:var(--muted);
  background:rgba(255,255,255,0.025);
  border:1px solid rgba(255,255,255,0.05);
  border-radius:999px;padding:0.28rem 0.75rem;
}

/* Trust items */
.sidebar-trust{display:grid;gap:0.65rem;}
.trust-row-item{
  display:flex;align-items:center;gap:0.6rem;
  font-size:0.8rem;color:var(--muted);
}

/* Form wrap */
.contact-form-wrap{
  background:linear-gradient(180deg,rgba(255,255,255,0.018),rgba(255,255,255,0.004));
  border:1px solid rgba(255,255,255,0.055);
  border-radius:var(--radius);
  padding:2rem 2rem 2.2rem;
}
.form-title{font-size:1.3rem;font-weight:800;margin:0 0 0.25rem;}
.form-subtitle{font-size:0.82rem;color:var(--muted);margin:0 0 2rem;}

.form-section{margin-bottom:1.8rem;}
.form-section-label{
  font-size:0.68rem;font-weight:800;color:var(--muted);
  text-transform:uppercase;letter-spacing:0.1em;
  margin:0 0 0.85rem;
}
.form-label-muted{font-weight:500;text-transform:none;letter-spacing:0;opacity:0.7;}

/* Form grid and fields */
.form-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:0.9rem;
}
.form-field{
  display:flex;flex-direction:column;gap:0.4rem;
  font-size:0.8rem;font-weight:600;color:var(--muted);
}
.form-field input,
.form-field select,
.form-field textarea{
  background:rgba(255,255,255,0.03);
  border:1px solid rgba(255,255,255,0.07);
  border-radius:9px;
  color:var(--text);font-size:0.88rem;
  font-family:inherit;padding:0.6rem 0.8rem;
  transition:border-color .15s,background .15s;
  outline:none;
  width:100%;
}
.form-field input:focus,
.form-field select:focus,
.form-field textarea:focus{
  border-color:rgba(124,92,252,0.42);
  background:rgba(124,92,252,0.04);
}
.form-field input::placeholder,
.form-field textarea::placeholder{color:rgba(139,155,191,0.4);}
.form-field select option{background:var(--bg-soft);}
.form-field textarea{resize:vertical;}

/* Checkboxes */
.checkbox-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:0.5rem;
}
.checkbox-field{
  display:flex;align-items:center;gap:0.55rem;
  font-size:0.8rem;font-weight:600;color:var(--muted);
  cursor:pointer;padding:0.55rem 0.7rem;
  border:1px solid rgba(255,255,255,0.05);
  border-radius:9px;
  background:rgba(255,255,255,0.015);
  transition:border-color .15s,background .15s,color .15s;
}
.checkbox-field:hover{
  border-color:rgba(124,92,252,0.2);
  color:var(--text);
}
.checkbox-field input{position:absolute;opacity:0;width:0;height:0;}
.checkbox-field input:checked~.checkbox-box{
  background:var(--primary-soft);
  border-color:var(--primary-soft);
}
.checkbox-field input:checked~.checkbox-box::after{
  content:'✓';position:absolute;
  font-size:0.55rem;color:#fff;
  top:50%;left:50%;
  transform:translate(-50%,-50%);
}
.checkbox-field:has(input:checked){
  border-color:rgba(124,92,252,0.28);
  background:rgba(124,92,252,0.05);
  color:var(--text);
}
.checkbox-box{
  width:15px;height:15px;border-radius:4px;flex-shrink:0;
  border:1.5px solid rgba(255,255,255,0.18);
  background:transparent;position:relative;
  transition:background .12s,border-color .12s;
}

/* Submit row */
.form-submit-row{display:flex;align-items:center;gap:1.2rem;flex-wrap:wrap;margin-top:0.5rem;}
.btn-lg{padding:0.78rem 1.8rem;font-size:0.95rem;}
.submit-note{font-size:0.75rem;color:var(--muted);margin:0;}
.error-text{font-size:0.8rem;color:#f87171;min-height:1.1rem;margin:0.6rem 0 0;}

/* Spinner */
.spinner{display:inline-block;animation:spin .75s linear infinite;}
@keyframes spin{to{transform:rotate(360deg);}}

/* Success panel */
.intake-success[hidden]{display:none;}
.intake-success{
  text-align:center;padding:3rem 1rem;
  display:flex;flex-direction:column;align-items:center;gap:1rem;
}
.success-icon{
  width:60px;height:60px;border-radius:50%;
  background:rgba(34,211,168,0.1);border:1px solid rgba(34,211,168,0.2);
  display:flex;align-items:center;justify-content:center;
}
.intake-success h3{font-size:1.3rem;font-weight:800;margin:0;}
.intake-success p{font-size:0.9rem;color:var(--muted);margin:0;max-width:380px;}

/* Contact responsive */
@media(max-width:1000px){
  .contact-layout{grid-template-columns:1fr;}
  .contact-sidebar{position:static;}
  .checkbox-grid{grid-template-columns:repeat(2,1fr);}
}
@media(max-width:600px){
  .contact-form-wrap{padding:1.4rem 1.2rem 1.6rem;}
  .form-grid{grid-template-columns:1fr;}
  .checkbox-grid{grid-template-columns:1fr 1fr;}
}

/* ─────────────────────────────────────────── */
/* ── Dashboard / Client portal             ── */
/* ─────────────────────────────────────────── */

.dashboard-body{
  display:grid;
  grid-template-columns:240px 1fr;
  min-height:100vh;
  background:
    radial-gradient(ellipse 60% 40% at 8% 0%,#1a0a34 0%,transparent 50%),
    var(--bg);
}

/* Sidebar */
.dash-sidebar{
  position:fixed;top:0;left:0;bottom:0;width:240px;
  background:rgba(8,10,20,0.88);
  border-right:1px solid rgba(255,255,255,0.045);
  backdrop-filter:blur(16px);
  display:flex;flex-direction:column;
  padding:0;overflow-y:auto;
  z-index:30;transition:transform .22s ease;
}
.dash-brand{
  display:flex;align-items:center;justify-content:space-between;
  padding:1.1rem 1.2rem 0.8rem;
  border-bottom:1px solid rgba(255,255,255,0.04);
}
.dash-portal-badge{
  font-size:0.6rem;font-weight:800;color:var(--muted);
  text-transform:uppercase;letter-spacing:0.1em;
  background:rgba(255,255,255,0.04);
  border:1px solid rgba(255,255,255,0.06);
  border-radius:999px;padding:0.18rem 0.55rem;
}
.dash-client-card{
  display:flex;align-items:center;gap:0.75rem;
  padding:0.9rem 1.2rem;
  border-bottom:1px solid rgba(255,255,255,0.04);
}
.dash-avatar{
  width:36px;height:36px;border-radius:10px;
  background:linear-gradient(135deg,var(--accent-2),var(--accent));
  display:flex;align-items:center;justify-content:center;
  font-size:0.7rem;font-weight:800;color:#fff;flex-shrink:0;
}
.dash-client-name{font-size:0.82rem;font-weight:700;color:var(--text);margin:0;}
.dash-client-company{font-size:0.72rem;color:var(--muted);margin:0;}

/* Sidebar nav */
.dash-nav{
  display:flex;flex-direction:column;gap:0.15rem;
  padding:0.8rem 0.7rem;flex:1;
}
.dash-nav-item{
  display:flex;align-items:center;gap:0.7rem;
  padding:0.6rem 0.8rem;border-radius:9px;
  font-size:0.83rem;font-weight:600;color:var(--muted);
  transition:color .14s,background .14s;position:relative;
}
.dash-nav-item:hover{color:var(--text);background:rgba(255,255,255,0.04);}
.dash-nav-item.is-active{
  color:var(--text);
  background:rgba(124,92,252,0.1);
  border:1px solid rgba(124,92,252,0.14);
}
.dash-badge{
  margin-left:auto;
  font-size:0.62rem;font-weight:800;
  background:var(--accent);color:#fff;
  border-radius:999px;padding:0.12rem 0.45rem;
}
.dash-sidebar-footer{
  padding:0.8rem 1.2rem 1.2rem;
  border-top:1px solid rgba(255,255,255,0.04);
  display:flex;flex-direction:column;gap:0.4rem;
}
.dash-sidebar-link{
  font-size:0.78rem;color:var(--muted);
  transition:color .14s;
}
.dash-sidebar-link:hover{color:var(--text);}

/* Main area */
.dash-main{
  grid-column:2;
  min-height:100vh;
  display:flex;flex-direction:column;
}

/* Top bar */
.dash-topbar{
  position:sticky;top:0;z-index:20;
  display:flex;align-items:center;gap:1rem;
  padding:0.85rem 2rem;
  background:rgba(6,9,19,0.75);
  border-bottom:1px solid rgba(255,255,255,0.04);
  backdrop-filter:blur(12px);
}
.dash-menu-btn{
  display:none;background:none;border:none;
  color:var(--muted);cursor:pointer;padding:0.2rem;
}
.dash-topbar-left{display:flex;align-items:center;gap:0.9rem;flex:1;}
.dash-page-title{font-size:1rem;font-weight:800;margin:0;color:var(--text);}
.dash-status-pill{
  display:flex;align-items:center;gap:0.4rem;
  font-size:0.7rem;font-weight:700;
  color:var(--success);
  background:rgba(34,211,168,0.08);
  border:1px solid rgba(34,211,168,0.14);
  border-radius:999px;padding:0.22rem 0.7rem;
}
.dash-status-dot{
  width:6px;height:6px;border-radius:50%;
  background:var(--success);flex-shrink:0;
}
.dash-status-pill--paused{color:#f59e0b;background:rgba(245,158,11,0.08);border-color:rgba(245,158,11,0.18);}
.dash-status-dot--paused{background:#f59e0b;}
.dash-status-pill--complete{color:var(--success);background:rgba(34,211,168,0.08);border-color:rgba(34,211,168,0.14);}
.dash-status-dot--complete{background:var(--success);}
.dash-topbar-right{display:flex;align-items:center;gap:0.9rem;}
.dash-date{font-size:0.75rem;color:var(--muted);}
.dash-avatar-sm{
  width:30px;height:30px;border-radius:8px;
  background:linear-gradient(135deg,var(--accent-2),var(--accent));
  display:flex;align-items:center;justify-content:center;
  font-size:0.62rem;font-weight:800;color:#fff;
}

/* Sections */
.dash-section{
  padding:1.8rem 2rem;
  display:flex;flex-direction:column;gap:1.4rem;
  flex:1;
}
.dash-welcome{margin-bottom:0.2rem;}
.dash-welcome-text{font-size:0.9rem;color:var(--muted);margin:0;}
.dash-welcome-text strong{color:var(--text);}

/* Stat cards */
.dash-stats{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:1rem;
}
.dash-stat-card{
  background:linear-gradient(180deg,rgba(255,255,255,0.018),rgba(255,255,255,0.004));
  border:1px solid rgba(255,255,255,0.055);
  border-radius:var(--radius);padding:1.1rem 1.2rem;
}
.dash-stat-label{font-size:0.7rem;font-weight:700;color:var(--muted);margin:0 0 0.35rem;text-transform:uppercase;letter-spacing:0.06em;}
.dash-stat-val{font-size:1.65rem;font-weight:800;color:var(--text);margin:0 0 0.25rem;letter-spacing:-0.03em;}
.dash-stat-of{font-size:1rem;font-weight:600;color:var(--muted);}
.dash-stat-sub{font-size:0.72rem;color:var(--muted);margin:0.2rem 0 0;}
.dash-stat-warn{color:var(--warn);}
.dash-stat-green{color:var(--success);}

/* Progress bar */
.progress-bar{
  height:4px;border-radius:999px;
  background:rgba(255,255,255,0.06);
  margin-top:0.5rem;overflow:hidden;
}
.progress-fill{
  height:100%;border-radius:999px;
  background:linear-gradient(90deg,var(--accent-2),var(--accent));
}

/* Generic card */
.dash-card{
  background:linear-gradient(180deg,rgba(255,255,255,0.018),rgba(255,255,255,0.004));
  border:1px solid rgba(255,255,255,0.055);
  border-radius:var(--radius);padding:1.3rem 1.4rem;
}
.dash-card-title{font-size:0.88rem;font-weight:800;color:var(--text);margin:0 0 0.2rem;display:flex;align-items:center;gap:0.4rem;}
.dash-card-sub{font-size:0.77rem;color:var(--muted);margin:0 0 1.2rem;}

/* Two-col layout inside dashboard */
.dash-two-col{
  display:grid;grid-template-columns:1fr 1fr;gap:1.2rem;
}

/* Activity list */
.activity-list{list-style:none;margin:0.8rem 0 0;padding:0;display:grid;gap:0.9rem;}
.activity-item{display:flex;align-items:flex-start;gap:0.75rem;}
.activity-dot{
  width:8px;height:8px;border-radius:50%;flex-shrink:0;margin-top:0.28rem;
}
.activity-dot--green{background:var(--success);}
.activity-dot--blue{background:#38bdf8;}
.activity-dot--purple{background:var(--primary-soft);}
.activity-dot--gray{background:rgba(255,255,255,0.15);}
.activity-text{font-size:0.82rem;color:var(--text);margin:0;}
.activity-time{font-size:0.72rem;color:var(--muted);margin:0.15rem 0 0;}

/* Next milestone */
.next-milestone-card{margin-top:0.8rem;}
.milestone-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:0.6rem;}
.milestone-tag{
  font-size:0.65rem;font-weight:800;color:var(--primary-soft);
  background:rgba(124,92,252,0.1);border:1px solid rgba(124,92,252,0.16);
  border-radius:999px;padding:0.2rem 0.6rem;text-transform:uppercase;letter-spacing:0.08em;
}
.milestone-due{font-size:0.72rem;color:var(--muted);}
.milestone-name{font-size:0.95rem;font-weight:700;color:var(--text);margin:0 0 0.4rem;}
.milestone-desc{font-size:0.8rem;color:var(--muted);line-height:1.55;margin:0 0 0.9rem;}
.milestone-progress{display:flex;align-items:center;gap:0.7rem;margin-bottom:1rem;}
.milestone-progress-bar{
  flex:1;height:5px;border-radius:999px;
  background:rgba(255,255,255,0.06);overflow:hidden;
}
.milestone-progress-fill{
  height:100%;border-radius:999px;
  background:linear-gradient(90deg,var(--accent-2),var(--accent));
}
.milestone-progress-pct{font-size:0.72rem;font-weight:700;color:var(--primary-soft);flex-shrink:0;}
.milestone-tasks-label{font-size:0.65rem;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:0.08em;margin:0 0 0.5rem;}
.milestone-task-list{list-style:none;margin:0;padding:0;display:grid;gap:0.35rem;}
.mtask{
  font-size:0.8rem;color:var(--muted);
  padding-left:1.2rem;position:relative;
}
.mtask::before{
  content:'○';position:absolute;left:0;
  font-size:0.6rem;color:var(--muted);top:0.1em;
}
.mtask.done{color:var(--success);}
.mtask.done::before{content:'✓';color:var(--success);}
.mtask.active{color:var(--text);font-weight:600;}
.mtask.active::before{content:'●';color:var(--primary-soft);}

/* Project timeline */
.timeline-list{display:grid;gap:0;margin-top:1rem;padding-left:0.5rem;}
.tl-item{
  display:flex;align-items:flex-start;gap:1rem;
  padding-bottom:1.4rem;position:relative;
}
.tl-item:last-child{padding-bottom:0;}
.tl-marker{
  width:14px;height:14px;border-radius:50%;flex-shrink:0;
  border:2px solid rgba(255,255,255,0.12);
  background:rgba(255,255,255,0.04);
  margin-top:0.2rem;position:relative;z-index:1;
}
.tl-item::before{
  content:'';position:absolute;
  left:6px;top:18px;bottom:0;
  width:1px;background:rgba(255,255,255,0.06);
}
.tl-item:last-child::before{display:none;}
.tl-done .tl-marker{border-color:var(--success);background:rgba(34,211,168,0.15);}
.tl-active .tl-marker{
  border-color:var(--primary-soft);
  background:rgba(124,92,252,0.2);
  box-shadow:0 0 0 3px rgba(124,92,252,0.1);
}
.tl-content{flex:1;}
.tl-head{display:flex;justify-content:space-between;align-items:flex-start;gap:0.5rem;margin-bottom:0.2rem;}
.tl-name{font-size:0.85rem;font-weight:700;color:var(--text);}
.tl-date{font-size:0.72rem;color:var(--muted);flex-shrink:0;}
.tl-desc{font-size:0.78rem;color:var(--muted);line-height:1.5;margin:0 0 0.5rem;}
.tl-badge{font-size:0.62rem;font-weight:800;border-radius:999px;padding:0.18rem 0.6rem;text-transform:uppercase;letter-spacing:0.06em;}
.tl-badge--done{background:rgba(34,211,168,0.1);color:var(--success);}
.tl-badge--active{background:rgba(124,92,252,0.12);color:var(--primary-soft);}
.tl-badge--pending{background:rgba(255,255,255,0.04);color:var(--muted);}

/* Deliverables */
.dlv-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem;}
.dlv-count{font-size:0.75rem;color:var(--muted);}
.dlv-list{display:grid;gap:0.5rem;}
.dlv-item{
  display:flex;align-items:center;gap:0.9rem;
  padding:0.7rem 0.8rem;border-radius:10px;
  border:1px solid rgba(255,255,255,0.04);
  background:rgba(255,255,255,0.01);
  transition:border-color .14s,background .14s;
}
.dlv-item:hover{border-color:rgba(255,255,255,0.08);background:rgba(255,255,255,0.025);}
.dlv-upcoming{opacity:0.55;}
.dlv-icon{
  width:30px;height:30px;border-radius:8px;
  display:flex;align-items:center;justify-content:center;
  flex-shrink:0;
}
.dlv-icon--doc{background:rgba(99,102,241,0.12);color:#818cf8;}
.dlv-icon--code{background:rgba(34,211,168,0.1);color:var(--success);}
.dlv-icon--link{background:rgba(56,189,248,0.1);color:#38bdf8;}
.dlv-icon--pending{background:rgba(255,255,255,0.04);color:var(--muted);}
.dlv-info{flex:1;min-width:0;}
.dlv-name{font-size:0.82rem;font-weight:600;color:var(--text);margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.dlv-meta{font-size:0.72rem;color:var(--muted);margin:0.1rem 0 0;}
.dlv-dl-btn{
  font-size:0.72rem;font-weight:700;
  color:var(--primary-soft);
  background:rgba(124,92,252,0.08);
  border:1px solid rgba(124,92,252,0.14);
  border-radius:7px;padding:0.3rem 0.75rem;
  cursor:pointer;flex-shrink:0;
  transition:background .14s,border-color .14s;
  font-family:inherit;
}
.dlv-dl-btn:hover{background:rgba(124,92,252,0.16);border-color:rgba(124,92,252,0.28);}
.dlv-upcoming-badge{
  font-size:0.65rem;font-weight:700;color:var(--muted);
  background:rgba(255,255,255,0.04);
  border:1px solid rgba(255,255,255,0.06);
  border-radius:999px;padding:0.2rem 0.6rem;flex-shrink:0;
}

/* Analytics notes */
.analytics-notes{
  list-style:none;margin:0.8rem 0 0;padding:0;
  display:grid;gap:0.5rem;
}
.analytics-notes li{
  font-size:0.82rem;color:var(--muted);
  padding-left:1rem;position:relative;
}
.analytics-notes li::before{
  content:'·';position:absolute;left:0;
  color:var(--primary-soft);font-size:1.1rem;top:-0.1em;
}

/* Ticket list */
.ticket-list{display:grid;gap:0.75rem;margin-top:0.8rem;}
.ticket-item{
  padding:0.9rem 1rem;border-radius:10px;
  border:1px solid rgba(255,255,255,0.05);
  background:rgba(255,255,255,0.01);
}
.ticket-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:0.4rem;}
.ticket-id{font-size:0.68rem;font-weight:700;color:var(--muted);}
.ticket-status{font-size:0.65rem;font-weight:800;border-radius:999px;padding:0.18rem 0.6rem;}
.ticket-status--review{background:rgba(251,191,36,0.1);color:var(--warn);}
.ticket-title{font-size:0.82rem;font-weight:600;color:var(--text);margin:0 0 0.25rem;}
.ticket-meta{font-size:0.72rem;color:var(--muted);margin:0;}

/* Account lead */
.lead-card{display:flex;align-items:center;gap:0.8rem;margin-bottom:1rem;margin-top:0.8rem;}
.lead-avatar{
  width:42px;height:42px;border-radius:12px;
  background:linear-gradient(135deg,#3b82f6,#6366f1);
  display:flex;align-items:center;justify-content:center;
  font-size:0.72rem;font-weight:800;color:#fff;flex-shrink:0;
}
.lead-name{font-size:0.88rem;font-weight:700;color:var(--text);margin:0;}
.lead-role{font-size:0.75rem;color:var(--muted);margin:0;}
.lead-details{display:grid;gap:0.55rem;}
.lead-detail-row{display:flex;justify-content:space-between;align-items:center;font-size:0.8rem;}
.lead-detail-label{color:var(--muted);}
.lead-detail-val{color:var(--text);font-weight:600;}

/* Dashboard responsive */
@media(max-width:1024px){
  .dashboard-body{grid-template-columns:1fr;}
  .dash-sidebar{
    transform:translateX(-100%);
    width:260px;
  }
  .dash-sidebar.is-open{transform:translateX(0);}
  .dash-main{grid-column:1;}
  .dash-menu-btn{display:flex;}
  .dash-stats{grid-template-columns:repeat(2,1fr);}
  .dash-two-col{grid-template-columns:1fr;}
}
@media(max-width:600px){
  .dash-section{padding:1.2rem 1rem;}
  .dash-topbar{padding:0.7rem 1rem;}
  .dash-stats{grid-template-columns:1fr 1fr;}
}

/* ─────────────────────────────────────────── */
/* ── Auth page                             ── */
/* ─────────────────────────────────────────── */

.auth-wrap{
  min-height:100vh;
  display:flex;flex-direction:column;
  align-items:center;justify-content:center;
  padding:2rem 1rem;
}
.auth-card{
  width:100%;max-width:420px;
  background:linear-gradient(180deg,rgba(255,255,255,0.022),rgba(255,255,255,0.005));
  border:1px solid rgba(255,255,255,0.06);
  border-radius:18px;padding:2.2rem 2rem;
}
.auth-brand{
  font-size:1.1rem;font-weight:800;
  background:linear-gradient(90deg,#fff,#a0b4ff);
  -webkit-background-clip:text;background-clip:text;color:transparent;
  display:block;margin-bottom:0.3rem;
}
.auth-portal-label{
  font-size:0.7rem;font-weight:700;color:var(--muted);
  text-transform:uppercase;letter-spacing:0.1em;
  margin:0 0 1.6rem;
}
.auth-tabs{
  display:flex;gap:0.25rem;
  background:rgba(255,255,255,0.03);
  border:1px solid rgba(255,255,255,0.05);
  border-radius:10px;padding:0.25rem;
  margin-bottom:1.6rem;
}
.auth-tab{
  flex:1;padding:0.5rem;border-radius:7px;
  font-size:0.82rem;font-weight:700;
  color:var(--muted);background:none;border:none;
  cursor:pointer;transition:color .14s,background .14s;
  font-family:inherit;
}
.auth-tab.is-active{
  background:rgba(124,92,252,0.12);
  border:1px solid rgba(124,92,252,0.18);
  color:var(--text);
}
.auth-form{display:flex;flex-direction:column;gap:1rem;}
.auth-form[hidden]{display:none;}
.auth-grid-2{display:grid;grid-template-columns:1fr 1fr;gap:0.75rem;}
.auth-field{
  display:flex;flex-direction:column;gap:0.4rem;
  font-size:0.78rem;font-weight:600;color:var(--muted);
}
.auth-field-hint{font-weight:500;color:rgba(139,155,191,0.6);font-size:0.72rem;}
.auth-field input{
  background:rgba(255,255,255,0.03);
  border:1px solid rgba(255,255,255,0.07);
  border-radius:9px;color:var(--text);
  font-size:0.88rem;font-family:inherit;
  padding:0.6rem 0.8rem;outline:none;width:100%;
  transition:border-color .15s,background .15s;
}
.auth-field input:focus{
  border-color:rgba(124,92,252,0.42);
  background:rgba(124,92,252,0.04);
}
.auth-field input::placeholder{color:rgba(139,155,191,0.35);}
.auth-row{display:flex;justify-content:flex-end;}
.auth-link{
  font-size:0.78rem;font-weight:600;color:var(--primary-soft);
  background:none;border:none;cursor:pointer;padding:0;
  font-family:inherit;transition:opacity .14s;
}
.auth-link:hover{opacity:0.75;}
.auth-error{
  font-size:0.78rem;color:#f87171;
  min-height:1rem;margin:0;
}
.auth-submit{width:100%;justify-content:center;}
.auth-footer-note{
  font-size:0.74rem;color:var(--muted);
  text-align:center;margin:0;line-height:1.5;
}
.auth-success-icon{
  width:52px;height:52px;border-radius:50%;
  background:rgba(34,211,168,0.08);border:1px solid rgba(34,211,168,0.18);
  display:flex;align-items:center;justify-content:center;
  margin:0 auto 1rem;
}
.auth-success-title{font-size:1.1rem;font-weight:800;text-align:center;margin:0 0 0.5rem;}
.auth-success-body{font-size:0.84rem;color:var(--muted);text-align:center;line-height:1.6;margin:0;}
.auth-back{
  margin-top:1.2rem;font-size:0.8rem;
  color:var(--muted);text-align:center;
}
.auth-back a{color:var(--muted);transition:color .14s;}
.auth-back a:hover{color:var(--text);}

/* ── Social login buttons ──────────────────────────────── */
#social-section[hidden]{display:none;}
.auth-social-btns{display:flex;flex-direction:column;gap:0.6rem;margin-bottom:1.1rem;}
.auth-social-btn{
  display:flex;align-items:center;justify-content:center;gap:0.55rem;
  width:100%;padding:0.65rem 1rem;
  background:rgba(255,255,255,0.04);
  border:1px solid rgba(255,255,255,0.1);
  border-radius:0.5rem;
  color:var(--text);font-size:0.875rem;font-weight:500;
  cursor:pointer;transition:background .15s,border-color .15s;
  font-family:inherit;
}
.auth-social-btn:hover{
  background:rgba(255,255,255,0.09);
  border-color:rgba(255,255,255,0.22);
}
.auth-divider{
  display:flex;align-items:center;gap:0.6rem;
  margin-bottom:1.1rem;
  color:var(--text-muted,var(--muted));font-size:0.75rem;
}
.auth-divider::before,.auth-divider::after{
  content:'';flex:1;height:1px;
  background:rgba(255,255,255,0.08);
}

/* Logout button */
.dash-logout-btn{
  background:none;border:none;cursor:pointer;
  padding:0;font-family:inherit;
  color:var(--muted);font-size:0.78rem;
  text-align:left;transition:color .14s;
}
.dash-logout-btn:hover{color:#f87171;}

@media(max-width:480px){
  .auth-card{padding:1.6rem 1.2rem;}
  .auth-grid-2{grid-template-columns:1fr;}
}

/* ─────────────────────────────────────────── */
/* ── Admin portal                          ── */
/* ─────────────────────────────────────────── */

.adm-portal-badge{
  background:rgba(248,113,113,0.12);
  color:#f87171;
  border-color:rgba(248,113,113,0.22)!important;
}

/* ── Client grid ──────────────────────────── */
.adm-client-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(280px,1fr));
  gap:1rem;
  margin-bottom:1rem;
}
.adm-client-card{
  background:rgba(255,255,255,0.02);
  border:1px solid rgba(255,255,255,0.06);
  border-radius:14px;padding:1rem 1.2rem;
  display:flex;align-items:center;gap:1rem;
  transition:border-color .15s;
}
.adm-client-card.is-selected{
  border-color:rgba(124,92,252,0.35);
  background:rgba(124,92,252,0.04);
}
.adm-client-avatar{
  width:40px;height:40px;border-radius:50%;
  background:var(--primary);
  display:flex;align-items:center;justify-content:center;
  font-size:0.85rem;font-weight:800;color:#fff;flex-shrink:0;
}
.adm-client-info{flex:1;min-width:0;}
.adm-client-name{font-size:0.88rem;font-weight:700;color:var(--text);margin:0;}
.adm-client-meta{
  font-size:0.73rem;color:var(--muted);margin:0.1rem 0;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.adm-client-proj{font-size:0.72rem;color:var(--primary-soft);font-weight:600;margin:0;}

/* ── Client detail view ───────────────────── */
.adm-detail-topbar{
  display:flex;align-items:center;gap:1.2rem;
  padding-bottom:1.2rem;margin-bottom:1.2rem;
  border-bottom:1px solid rgba(255,255,255,0.06);
}
.adm-back-btn{
  display:flex;align-items:center;gap:0.3rem;
  background:none;border:none;cursor:pointer;
  font-size:0.78rem;font-weight:700;color:var(--muted);
  font-family:inherit;padding:0;transition:color .14s;flex-shrink:0;
}
.adm-back-btn:hover{color:var(--text);}
.adm-detail-name{font-size:1rem;font-weight:800;margin:0;}
.adm-detail-sub{font-size:0.74rem;color:var(--muted);margin:0.15rem 0 0;}

/* ── Tabs ─────────────────────────────────── */
.adm-tabs{
  display:flex;gap:0.25rem;flex-wrap:wrap;
  background:rgba(255,255,255,0.02);
  border:1px solid rgba(255,255,255,0.05);
  border-radius:10px;padding:0.25rem;
  margin-bottom:1.5rem;
}
.adm-tab{
  flex:1;min-width:80px;padding:0.42rem 0.8rem;
  border-radius:7px;font-size:0.78rem;font-weight:700;
  color:var(--muted);background:none;border:none;
  cursor:pointer;font-family:inherit;transition:color .14s,background .14s;
}
.adm-tab.is-active{
  background:rgba(124,92,252,0.12);
  border:1px solid rgba(124,92,252,0.18);
  color:var(--text);
}
.adm-form-card{margin-top:1.2rem;}

/* ── Tables ───────────────────────────────── */
.adm-table-wrap{overflow-x:auto;}
.adm-table{
  width:100%;border-collapse:collapse;
  font-size:0.8rem;
}
.adm-table th{
  text-align:left;font-size:0.68rem;font-weight:700;
  text-transform:uppercase;letter-spacing:0.07em;
  color:var(--muted);padding:0.5rem 0.75rem;
  border-bottom:1px solid rgba(255,255,255,0.07);
  white-space:nowrap;
}
.adm-td{
  padding:0.7rem 0.75rem;
  border-bottom:1px solid rgba(255,255,255,0.04);
  vertical-align:middle;color:var(--text);
}
.adm-td--name{font-weight:600;}
.adm-td--date{white-space:nowrap;color:var(--muted);font-size:0.75rem;}
.adm-td--ref{font-family:monospace;font-size:0.75rem;color:var(--muted);}
.adm-td--services{font-size:0.74rem;color:var(--muted);max-width:160px;}
.adm-tr:hover td{background:rgba(255,255,255,0.012);}
.adm-table-header{
  display:flex;align-items:center;justify-content:space-between;
  flex-wrap:wrap;gap:0.75rem;margin-bottom:1.2rem;
}

/* ── Inline controls ─────────────────────── */
.adm-select{
  background:rgba(255,255,255,0.04);
  border:1px solid rgba(255,255,255,0.09);
  border-radius:7px;color:var(--text);
  font-size:0.78rem;font-family:inherit;
  padding:0.3rem 0.55rem;outline:none;cursor:pointer;
}
.adm-select:focus{border-color:rgba(124,92,252,0.4);}
.adm-inline-select{font-size:0.75rem;padding:0.22rem 0.45rem;}
.adm-inline-select--sm{font-size:0.7rem;}
.adm-inline-input{
  background:rgba(255,255,255,0.03);
  border:1px solid rgba(255,255,255,0.07);
  border-radius:7px;color:var(--text);
  font-size:0.78rem;font-family:inherit;
  padding:0.28rem 0.6rem;outline:none;flex:1;
}
.adm-inline-input:focus{border-color:rgba(124,92,252,0.4);}
.adm-inline-input::placeholder{color:rgba(139,155,191,0.35);}

/* ── Badges ───────────────────────────────── */
.adm-badge{
  display:inline-flex;align-items:center;
  padding:0.18rem 0.5rem;border-radius:999px;
  font-size:0.66rem;font-weight:700;
  text-transform:uppercase;letter-spacing:0.05em;
  white-space:nowrap;
}
.adm-badge--green {background:rgba(34,211,168,0.12);color:#22d3a8;}
.adm-badge--blue  {background:rgba(99,130,255,0.12);color:#6382ff;}
.adm-badge--purple{background:rgba(124,92,252,0.12);color:#b69dff;}
.adm-badge--red   {background:rgba(248,113,113,0.12);color:#f87171;}
.adm-badge--gray  {background:rgba(139,155,191,0.08);color:var(--muted);}

/* ── Links / misc ────────────────────────── */
.adm-link{color:var(--primary-soft);text-decoration:none;}
.adm-link:hover{text-decoration:underline;}
.adm-expand-btn{
  font-size:0.72rem;font-weight:600;color:var(--primary-soft);
  background:none;border:none;cursor:pointer;
  font-family:inherit;padding:0;
}
.adm-goal-cell{
  padding:0.75rem 1rem;
  background:rgba(124,92,252,0.04);
  border-bottom:1px solid rgba(255,255,255,0.04);
  font-size:0.82rem;color:var(--text);line-height:1.6;
}
.adm-form-error{
  font-size:0.78rem;color:#f87171;
  min-height:1rem;margin:0.5rem 0 0;
}
.adm-empty{font-size:0.84rem;color:var(--muted);padding:0.4rem 0;}

/* ── Overview lists ───────────────────────── */
.adm-simple-list{display:flex;flex-direction:column;gap:0.75rem;margin-top:0.6rem;}
.adm-simple-row{display:flex;align-items:center;justify-content:space-between;gap:1rem;}
.adm-simple-name{font-size:0.82rem;font-weight:600;color:var(--text);margin:0;}
.adm-simple-sub{font-size:0.72rem;color:var(--muted);margin:0.1rem 0 0;}

/* ── Milestone cards ─────────────────────── */
.adm-milestone-card{
  background:rgba(255,255,255,0.02);
  border:1px solid rgba(255,255,255,0.06);
  border-radius:12px;padding:1rem 1.2rem;
  margin-bottom:0.75rem;
}
.adm-milestone-header{
  display:flex;align-items:center;
  justify-content:space-between;gap:1rem;
  flex-wrap:wrap;margin-bottom:0.5rem;
}
.adm-milestone-num{
  font-size:0.66rem;font-weight:800;
  text-transform:uppercase;letter-spacing:0.08em;
  color:var(--primary-soft);margin-right:0.35rem;
}
.adm-milestone-name{font-size:0.85rem;font-weight:700;color:var(--text);}
.adm-milestone-due{font-size:0.72rem;color:var(--muted);margin-left:0.4rem;}
.adm-milestone-desc{font-size:0.78rem;color:var(--muted);margin:0.3rem 0 0.75rem;}
.adm-task-list{
  display:flex;flex-direction:column;gap:0.4rem;
  margin-top:0.75rem;padding-top:0.75rem;
  border-top:1px solid rgba(255,255,255,0.05);
}
.adm-task-row{display:flex;align-items:center;justify-content:space-between;gap:0.75rem;}
.adm-task-name{font-size:0.78rem;color:var(--text);flex:1;}
.adm-add-task-form{display:flex;gap:0.4rem;margin-top:0.4rem;}

/* ── Deliverable rows ────────────────────── */
.adm-dlv-admin-list{display:flex;flex-direction:column;gap:0.5rem;}
.adm-dlv-row{
  display:flex;align-items:center;justify-content:space-between;
  gap:1rem;padding:0.6rem 0.8rem;border-radius:8px;
  background:rgba(255,255,255,0.02);
  border:1px solid rgba(255,255,255,0.05);
}
.adm-dlv-info{display:flex;align-items:center;gap:0.5rem;flex:1;min-width:0;}
.adm-dlv-type{
  font-size:0.62rem;font-weight:800;text-transform:uppercase;
  letter-spacing:0.07em;padding:0.15rem 0.4rem;border-radius:4px;
  flex-shrink:0;
}
.adm-dlv-type--doc {background:rgba(99,130,255,0.12);color:#6382ff;}
.adm-dlv-type--code{background:rgba(34,211,168,0.12);color:#22d3a8;}
.adm-dlv-type--link{background:rgba(124,92,252,0.12);color:#b69dff;}
.adm-dlv-name{font-size:0.82rem;font-weight:600;color:var(--text);}
.adm-dlv-meta{font-size:0.72rem;color:var(--muted);}
.adm-dlv-url{font-size:0.75rem;flex-shrink:0;}

/* ── Toast ────────────────────────────────── */
.adm-toast{
  position:fixed;bottom:1.5rem;right:1.5rem;
  background:rgba(18,14,30,0.97);
  border:1px solid rgba(255,255,255,0.1);
  border-radius:10px;padding:0.7rem 1.2rem;
  font-size:0.82rem;font-weight:600;color:var(--text);
  z-index:9999;transform:translateY(80px);opacity:0;
  transition:transform .22s,opacity .22s;pointer-events:none;
}
.adm-toast--visible{transform:none;opacity:1;}
.adm-toast--error{border-color:rgba(248,113,113,0.3);color:#f87171;}

@media(max-width:640px){
  .adm-client-grid{grid-template-columns:1fr;}
  .adm-tabs{gap:0.15rem;}
  .adm-tab{min-width:60px;font-size:0.72rem;padding:0.35rem 0.5rem;}
  .adm-table th,.adm-td{padding:0.5rem;}
}

/* ── Admin: edit/delete controls ─────────────────────────── */
.adm-milestone-title-group{display:flex;align-items:center;gap:0.5rem;flex:1;min-width:0;}
.adm-milestone-controls{display:flex;align-items:center;gap:0.4rem;flex-shrink:0;}
.adm-task-controls{display:flex;align-items:center;gap:0.3rem;}
.adm-dlv-controls{display:flex;align-items:center;gap:0.4rem;flex-shrink:0;}

/* Icon buttons (edit ✎ / delete ✕) */
.adm-icon-btn{
  display:inline-flex;align-items:center;justify-content:center;
  width:1.6rem;height:1.6rem;border:1px solid rgba(255,255,255,0.1);
  border-radius:0.3rem;background:rgba(255,255,255,0.04);
  color:var(--text-muted);font-size:0.8rem;cursor:pointer;
  transition:background .15s,color .15s,border-color .15s;
  flex-shrink:0;
}
.adm-icon-btn:hover{background:rgba(255,255,255,0.1);color:var(--text);}
.adm-icon-btn--danger{border-color:rgba(248,113,113,0.2);color:rgba(248,113,113,0.6);}
.adm-icon-btn--danger:hover{background:rgba(248,113,113,0.12);color:#f87171;border-color:rgba(248,113,113,0.4);}
.adm-icon-btn--xs{width:1.2rem;height:1.2rem;font-size:0.65rem;}

/* Inline edit forms */
.adm-inline-edit-wrap{
  margin:0.75rem 0 0.5rem;
  padding:1rem;
  background:rgba(255,255,255,0.03);
  border:1px solid rgba(255,255,255,0.08);
  border-radius:0.6rem;
}
.adm-dlv-edit-wrap{margin-left:0;margin-right:0;}
.adm-inline-edit-form .form-grid{gap:0.75rem;}
.adm-inline-edit-actions{display:flex;gap:0.5rem;margin-top:0.75rem;}

/* Milestone header updates */
.adm-milestone-header{display:flex;align-items:center;justify-content:space-between;gap:0.75rem;flex-wrap:wrap;}

/* Deliverable row updates */
.adm-dlv-row{display:flex;align-items:flex-start;justify-content:space-between;gap:0.75rem;flex-wrap:wrap;padding:0.65rem 0;border-bottom:1px solid rgba(255,255,255,0.05);}
.adm-dlv-row:last-child{border-bottom:none;}

/* Nav auth — hide Sign in when logged in (handled by JS) */

/* ── Contact form — plan banner ────────────────────────── */
.intake-plan-banner{
  display:flex;align-items:center;justify-content:space-between;
  padding:0.6rem 0.9rem;margin-bottom:1.25rem;
  background:rgba(124,92,252,0.1);border:1px solid rgba(124,92,252,0.25);
  border-radius:0.5rem;font-size:0.85rem;font-weight:600;color:#a78bfa;
}
.intake-plan-change{font-size:0.78rem;font-weight:400;color:var(--muted);text-decoration:underline;}

/* ── Dashboard — pending / rejected project state ──────── */
.project-status-card{
  max-width:520px;margin:3rem auto;text-align:center;
  padding:2.5rem 2rem;
}
.project-status-icon{font-size:2.5rem;margin-bottom:1rem;}
.project-status-title{font-size:1.25rem;font-weight:700;margin:0 0 0.75rem;}
.project-status-body{color:var(--muted);font-size:0.9rem;line-height:1.6;margin-bottom:0.5rem;}
.project-status-sub{font-size:0.82rem;color:var(--text-muted);}

/* ── Dashboard — ticket thread / reply bubbles ──────────── */
.ticket-thread{display:flex;flex-direction:column;gap:1rem;}
.ticket-thread-header{
  display:flex;align-items:flex-start;gap:0.75rem;
  padding-bottom:0.75rem;border-bottom:1px solid rgba(255,255,255,0.07);
}
.ticket-thread-title{font-weight:600;font-size:0.95rem;margin:0;}
.ticket-thread-meta{font-size:0.78rem;color:var(--muted);margin:0.15rem 0 0;}
.ticket-thread-messages{
  display:flex;flex-direction:column;gap:0.75rem;
  max-height:340px;overflow-y:auto;padding:0.25rem 0;
}
.reply-bubble{padding:0.6rem 0.85rem;border-radius:0.6rem;max-width:88%;}
.reply-bubble--client{
  background:rgba(255,255,255,0.05);border:1px solid rgba(255,255,255,0.08);
  align-self:flex-start;
}
.reply-bubble--admin{
  background:rgba(124,92,252,0.12);border:1px solid rgba(124,92,252,0.2);
  align-self:flex-end;
}
.reply-author{font-size:0.72rem;color:var(--muted);margin:0 0 0.25rem;}
.reply-content{font-size:0.85rem;margin:0;line-height:1.5;}
.ticket-reply-form{display:flex;flex-direction:column;gap:0.5rem;margin-top:0.5rem;}
.ticket-reply-form textarea{
  width:100%;padding:0.6rem 0.75rem;
  background:rgba(255,255,255,0.05);border:1px solid rgba(255,255,255,0.1);
  border-radius:0.45rem;color:var(--text);font-family:inherit;font-size:0.85rem;
  resize:vertical;
}
.ticket-view-link{color:var(--primary-soft);font-size:0.78rem;}

/* ── Admin — pending approvals ──────────────────────────── */
.adm-pending-card{margin-bottom:1.25rem;}
.adm-pending-card-header{display:flex;align-items:center;gap:0.75rem;margin-bottom:1rem;}
.adm-pending-details{
  display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:0.4rem 1rem;
  padding:0.75rem;background:rgba(255,255,255,0.02);border-radius:0.45rem;
  border:1px solid rgba(255,255,255,0.06);
}
.adm-pending-row{display:flex;flex-direction:column;gap:0.1rem;font-size:0.82rem;}
.adm-pending-label{font-size:0.7rem;color:var(--muted);text-transform:uppercase;letter-spacing:0.07em;}
.adm-pending-goal{
  grid-column:1/-1;font-size:0.82rem;padding-top:0.5rem;
  border-top:1px solid rgba(255,255,255,0.06);margin-top:0.25rem;
}

/* ── Admin — tickets two-pane ───────────────────────────── */
.adm-tickets-layout{display:grid;grid-template-columns:320px 1fr;gap:1.25rem;align-items:start;}
@media(max-width:900px){.adm-tickets-layout{grid-template-columns:1fr;}}
.adm-ticket-list-item{
  padding:0.7rem 0.85rem;border-bottom:1px solid rgba(255,255,255,0.05);cursor:pointer;
  transition:background .15s;
}
.adm-ticket-list-item:last-child{border-bottom:none;}
.adm-ticket-list-item:hover{background:rgba(255,255,255,0.04);}
.adm-ticket-list-item.is-active{background:rgba(124,92,252,0.1);}
.adm-ticket-list-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:0.2rem;}
.adm-ticket-list-title{font-size:0.85rem;font-weight:600;margin:0 0 0.2rem;}
.adm-ticket-list-meta{font-size:0.75rem;color:var(--muted);margin:0;}
.adm-thread-header{margin-bottom:0.75rem;padding-bottom:0.75rem;border-bottom:1px solid rgba(255,255,255,0.07);}
.adm-thread-title{font-weight:600;font-size:0.95rem;margin:0;}
.adm-thread-meta{font-size:0.78rem;color:var(--muted);margin:0.15rem 0 0;}
#adm-thread-messages{
  display:flex;flex-direction:column;gap:0.75rem;
  max-height:380px;overflow-y:auto;margin:1rem 0;padding:0.25rem 0;
}

/* ── Admin — inquiry review / approve / decline ─────────── */
.adm-inq-status-badge{
  display:inline-block;padding:0.2rem 0.5rem;border-radius:999px;
  font-size:0.72rem;font-weight:600;text-transform:capitalize;
}
.adm-inq-status--new{background:rgba(90,107,239,0.15);color:#9aa8ff;}
.adm-inq-status--contacted{background:rgba(251,191,36,0.12);color:#fbbf24;}
.adm-inq-status--converted{background:rgba(34,211,168,0.12);color:#22d3a8;}
.adm-inq-status--closed{background:rgba(255,255,255,0.06);color:var(--muted);}

.adm-inq-detail{
  display:flex;flex-direction:column;gap:0.5rem;
  padding:0.85rem 1rem;
}
.adm-inq-detail-row{display:flex;gap:0.6rem;font-size:0.83rem;align-items:baseline;}
.adm-inq-detail-label{
  min-width:72px;font-size:0.7rem;font-weight:600;
  text-transform:uppercase;letter-spacing:0.06em;color:var(--muted);
}
.adm-inq-goal{align-items:flex-start;}
.adm-inq-actions{display:flex;gap:0.6rem;margin-top:0.5rem;flex-wrap:wrap;}
.adm-approve-inq-btn{background:rgba(34,211,168,0.15);border:1px solid rgba(34,211,168,0.3);color:#22d3a8;}
.adm-approve-inq-btn:hover{background:rgba(34,211,168,0.25);}
.adm-decline-inq-btn{background:rgba(255,80,80,0.1);border:1px solid rgba(255,80,80,0.25);color:#ff7070;}
.adm-decline-inq-btn:hover{background:rgba(255,80,80,0.2);}
.adm-inq-done-note{font-size:0.8rem;color:var(--muted);margin:0.4rem 0 0;}

/* ── Admin — client project status badge ────────────────── */
.adm-client-status{
  display:inline-block;margin-top:0.25rem;
  padding:0.15rem 0.5rem;border-radius:999px;
  font-size:0.7rem;font-weight:600;text-transform:capitalize;
}
.adm-client-status--active{background:rgba(34,211,168,0.12);color:#22d3a8;}
.adm-client-status--pending{background:rgba(251,191,36,0.12);color:#fbbf24;}
.adm-client-status--rejected{background:rgba(255,80,80,0.1);color:#ff7070;}
.adm-client-status--none{background:rgba(255,255,255,0.05);color:var(--muted);}

/* ── Admin — delete client button ───────────────────────── */
.adm-delete-client-btn{
  margin-left:auto;display:flex;align-items:center;gap:0.4rem;
  background:rgba(255,80,80,0.08);border:1px solid rgba(255,80,80,0.22);
  color:#ff7070;font-size:0.78rem;
}
.adm-delete-client-btn:hover{background:rgba(255,80,80,0.18);}

/* ── Admin — inquiry status change row ──────────────────── */
.adm-inq-status-row{
  display:flex;align-items:center;gap:0.6rem;
  padding-top:0.5rem;border-top:1px solid rgba(255,255,255,0.06);
  margin-top:0.25rem;
}

/* ══ Store Integration — Admin connect form ════════════════ */
.adm-integration-header{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;margin-bottom:1rem;}
.adm-integration-status-badge{font-size:0.72rem;font-weight:600;color:#22d3a8;background:rgba(34,211,168,0.1);padding:0.2rem 0.6rem;border-radius:999px;white-space:nowrap;}
.adm-integration-details{display:flex;flex-direction:column;gap:0.4rem;margin-bottom:1rem;}
.adm-integration-actions{display:flex;gap:0.6rem;flex-wrap:wrap;}
.adm-integration-help{border:1px solid rgba(255,255,255,0.07);border-radius:0.45rem;padding:0.6rem 0.85rem;}
.adm-integration-help-body{margin-top:0.6rem;font-size:0.8rem;color:var(--muted);display:flex;flex-direction:column;gap:0.4rem;}
.adm-integration-help-body p{margin:0;}

/* ══ Store section — Client Dashboard ═════════════════════ */
.store-summary-bar{
  display:flex;align-items:center;gap:0.75rem;flex-wrap:wrap;
  margin-bottom:1.25rem;font-size:0.82rem;
}
.store-platform-badge{
  padding:0.2rem 0.65rem;border-radius:999px;font-size:0.7rem;font-weight:700;
  background:rgba(124,92,252,0.15);color:#a78bfa;text-transform:uppercase;letter-spacing:0.07em;
}
.store-url-link{color:var(--muted);text-decoration:underline;font-size:0.8rem;}
.store-sync-label{color:var(--muted);font-size:0.75rem;margin-left:auto;}

/* KPI grid */
.store-kpi-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:1rem;}
.store-kpi-card{padding:1.25rem 1.4rem;}
.store-kpi-label{font-size:0.72rem;font-weight:600;text-transform:uppercase;letter-spacing:0.07em;color:var(--muted);margin:0 0 0.5rem;}
.store-kpi-value{font-size:1.75rem;font-weight:800;margin:0 0 0.2rem;line-height:1.1;}
.store-kpi-sub{font-size:0.75rem;margin:0;min-height:1.1em;}

/* Orders table */
.store-orders-table{display:flex;flex-direction:column;gap:0;}
.store-order-row{
  display:grid;grid-template-columns:1fr auto auto auto;gap:0.75rem;align-items:center;
  padding:0.65rem 0;border-bottom:1px solid rgba(255,255,255,0.05);
}
.store-order-row:last-child{border-bottom:none;}
.store-order-customer{display:flex;flex-direction:column;gap:0.1rem;min-width:0;}
.store-order-name{font-size:0.85rem;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.store-order-email{font-size:0.72rem;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.store-order-amount{font-size:0.88rem;font-weight:700;white-space:nowrap;}
.store-order-status{font-size:0.72rem;font-weight:600;text-transform:capitalize;white-space:nowrap;}
.store-order-date{font-size:0.75rem;color:var(--muted);white-space:nowrap;}
@media(max-width:640px){.store-order-row{grid-template-columns:1fr auto;}.store-order-status,.store-order-date{display:none;}}

/* Status breakdown bars */
.store-status-row{
  display:grid;grid-template-columns:90px 1fr 36px;align-items:center;gap:0.6rem;
  padding:0.4rem 0;
}
.store-status-name{font-size:0.75rem;font-weight:600;text-transform:capitalize;}
.store-status-bar-wrap{height:6px;background:rgba(255,255,255,0.06);border-radius:999px;overflow:hidden;}
.store-status-bar{height:100%;border-radius:999px;transition:width .4s ease;}
.store-status-count{font-size:0.75rem;font-weight:700;text-align:right;color:var(--muted);}

/* ── Tab/sub-view transitions (within a page) ───────────── */
@keyframes tabIn{from{opacity:0;transform:translateY(8px);}}
.adm-tab-pane:not([hidden]),
.adm-view:not([hidden]){
  animation:tabIn .18s ease-out both;
}
@keyframes tabOut{to{opacity:0;transform:translateY(-5px);}}
.is-leaving{
  animation:tabOut .11s ease-in forwards !important;
  pointer-events:none !important;
}

/* ── Analytics section ───────────────────────────────────── */
.analytics-kpi-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:1rem;}

/* Bar chart */
.analytics-chart{
  display:flex;align-items:flex-end;gap:3px;
  height:90px;padding:0 0 0;margin-bottom:0.35rem;
}
.analytics-bar{
  flex:1;border-radius:3px 3px 0 0;
  background:linear-gradient(180deg,var(--accent-2),rgba(124,92,252,0.4));
  transition:opacity .15s;cursor:default;min-width:0;
}
.analytics-bar:hover{opacity:0.75;}
.analytics-bar--empty{background:rgba(255,255,255,0.05);}
.analytics-chart-labels{
  display:flex;gap:3px;
}
.analytics-chart-labels span{
  flex:1;font-size:0.6rem;color:var(--muted);text-align:center;
  white-space:nowrap;overflow:hidden;text-overflow:clip;min-width:0;
}

/* Highlights */
.analytics-hl-row{
  display:flex;align-items:center;justify-content:space-between;
  padding:0.6rem 0;border-bottom:1px solid rgba(255,255,255,0.05);
}
.analytics-hl-row:last-child{border-bottom:none;}
.analytics-hl-label{font-size:0.75rem;color:var(--muted);margin:0;}
.analytics-hl-val{font-size:0.95rem;font-weight:700;margin:0;text-align:right;}
.analytics-hl-sub{font-size:0.68rem;color:var(--muted);margin:0;text-align:right;}

/* Top customers */
.analytics-customer-row{
  display:flex;align-items:center;justify-content:space-between;gap:0.75rem;
  padding:0.55rem 0;border-bottom:1px solid rgba(255,255,255,0.05);
}
.analytics-customer-row:last-child{border-bottom:none;}
.analytics-customer-name{font-size:0.82rem;font-weight:600;margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:160px;}
.analytics-customer-meta{font-size:0.68rem;color:var(--muted);margin:0.1rem 0 0;}
.analytics-customer-total{font-size:0.85rem;font-weight:700;white-space:nowrap;margin:0;}

/* ═══════════════════════════════════════════════════════════
   MPA — New page-specific components
   ═══════════════════════════════════════════════════════════ */

/* ── Admin overview: Quick-action cards ─────────────────── */
.adm-quick-actions{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(160px,1fr));
  gap:0.75rem;margin-bottom:1.5rem;
}
.adm-quick-action-btn{
  display:flex;flex-direction:column;gap:0.35rem;
  padding:1rem 1.1rem;border-radius:12px;
  background:rgba(255,255,255,0.02);
  border:1px solid rgba(255,255,255,0.07);
  color:var(--text);font-size:0.82rem;font-weight:600;
  transition:background .15s,border-color .15s,transform .15s;
  position:relative;
}
.adm-quick-action-btn:hover{
  background:rgba(255,255,255,0.05);
  border-color:rgba(124,92,252,0.28);
  transform:translateY(-2px);
}
.adm-quick-action-btn .dash-badge{
  position:static;margin:0;width:fit-content;
}
.adm-view-all-link{
  font-size:0.78rem;font-weight:600;color:var(--primary-soft);
  opacity:0.75;transition:opacity .14s;
}
.adm-view-all-link:hover{opacity:1;}

/* ── Client overview: Quick-nav cards ───────────────────── */
.dash-quicknav{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(155px,1fr));
  gap:0.75rem;margin:1.25rem 0 1.5rem;
}
.dash-quicknav-card{
  display:flex;align-items:center;gap:0.75rem;
  padding:0.9rem 1rem;border-radius:12px;
  background:rgba(255,255,255,0.02);
  border:1px solid rgba(255,255,255,0.06);
  color:var(--text);
  transition:background .15s,border-color .15s,transform .15s;
}
.dash-quicknav-card:hover{
  background:rgba(255,255,255,0.05);
  border-color:rgba(124,92,252,0.25);
  transform:translateY(-2px);
}
.dash-quicknav-card svg{flex-shrink:0;opacity:0.55;}
.dash-quicknav-label{font-size:0.82rem;font-weight:700;color:var(--text);margin:0;}
.dash-quicknav-sub{font-size:0.68rem;color:var(--muted);margin:0.1rem 0 0;}

/* ── Client overview: Project health bar ────────────────── */
.dash-project-health{margin:0 0 1.25rem;}
.dash-health-bar{
  background:rgba(255,255,255,0.02);
  border:1px solid rgba(255,255,255,0.06);
  border-radius:12px;padding:0.9rem 1.1rem;
}
.dash-health-labels{
  display:flex;justify-content:space-between;align-items:baseline;
  margin-bottom:0.5rem;
}
.dash-health-label{font-size:0.78rem;color:var(--muted);}
.dash-health-pct{font-size:0.82rem;font-weight:700;color:var(--primary-soft);}
.dash-health-progress{margin-bottom:0.5rem;}
.dash-health-phase{font-size:0.78rem;color:var(--muted);margin:0;}
.dash-health-phase strong{color:var(--text);}

/* ── Stats bar (deliverables, support, tickets pages) ────── */
.ticket-stats-bar{
  display:flex;align-items:center;gap:0.75rem;flex-wrap:wrap;
  padding:0.65rem 1rem;border-radius:10px;
  background:rgba(255,255,255,0.02);
  border:1px solid rgba(255,255,255,0.06);
  font-size:0.8rem;
}
.ticket-stat strong{color:var(--text);}
.ticket-stat-sep{color:rgba(255,255,255,0.12);}

/* ── Deliverables: Filter tabs ──────────────────────────── */
.dlv-filter-tabs{display:flex;gap:0.4rem;flex-wrap:wrap;}
.dlv-tab{
  padding:0.35rem 0.9rem;border-radius:999px;
  font-size:0.78rem;font-weight:600;
  background:transparent;
  border:1px solid rgba(255,255,255,0.08);
  color:var(--muted);cursor:pointer;font-family:inherit;
  transition:color .13s,background .13s,border-color .13s;
}
.dlv-tab:hover{color:var(--text);border-color:rgba(255,255,255,0.18);}
.dlv-tab.is-active{
  background:rgba(124,92,252,0.12);
  border-color:rgba(124,92,252,0.3);
  color:var(--primary-soft);
}

/* ── Deliverables: Instruction box ─────────────────────── */
.dlv-instructions{display:grid;gap:0.9rem;margin-top:0.5rem;}
.dlv-instruction-row{display:flex;align-items:flex-start;gap:0.85rem;}
.dlv-instruction-icon{font-size:1.2rem;flex-shrink:0;margin-top:0.05rem;}
.dlv-instruction-label{font-size:0.82rem;font-weight:700;color:var(--text);margin:0 0 0.2rem;}
.dlv-instruction-desc{font-size:0.78rem;color:var(--muted);margin:0;line-height:1.55;}

/* ── Analytics: Hero summary ────────────────────────────── */
.analytics-hero{
  display:flex;align-items:center;justify-content:space-between;gap:1rem;
  padding:1.1rem 1.3rem;border-radius:14px;
  background:linear-gradient(135deg,rgba(124,92,252,0.1),rgba(255,79,216,0.06));
  border:1px solid rgba(124,92,252,0.18);
  margin-bottom:0.5rem;
}
.analytics-hero-label{font-size:0.72rem;color:var(--muted);margin:0;text-transform:uppercase;letter-spacing:0.08em;}
.analytics-hero-val{font-size:2rem;font-weight:800;margin:0.1rem 0;background:linear-gradient(90deg,#fff,#c4b5fd);-webkit-background-clip:text;background-clip:text;color:transparent;}
.analytics-hero-sub{font-size:0.75rem;color:var(--muted);margin:0;}
.analytics-platform-badge{
  font-size:0.72rem;font-weight:700;padding:0.3rem 0.75rem;border-radius:999px;
  background:rgba(34,211,168,0.1);color:var(--success);
  border:1px solid rgba(34,211,168,0.18);white-space:nowrap;
}

/* ── Project: Brief card ────────────────────────────────── */
.proj-brief-card{}
.proj-brief-top{
  display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;
  margin-bottom:0.85rem;
}
.proj-brief-desc{font-size:0.82rem;color:var(--muted);margin:0.3rem 0 0;line-height:1.6;}
.proj-brief-meta{
  display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));
  gap:0.4rem 1.5rem;margin-top:0.6rem;
}
.proj-brief-meta-item{display:flex;flex-direction:column;gap:0.1rem;font-size:0.82rem;}
.proj-brief-meta-label{font-size:0.68rem;color:var(--muted);text-transform:uppercase;letter-spacing:0.07em;}

/* ── Store page ─────────────────────────────────────────── */
.store-sync-info{padding:0.25rem 0;}
.store-sync-desc{font-size:0.82rem;color:var(--muted);margin:0;line-height:1.6;}
.store-orders-table{display:grid;gap:0;}
.store-order-row:hover{background:rgba(255,255,255,0.025);}

/* ── Support: Lead card wrapper ─────────────────────────── */
.support-lead-card{}
.lead-header{display:flex;align-items:center;gap:0.85rem;margin-bottom:1rem;}

/* ── FAQ ─────────────────────────────────────────────────── */
.faq-card{}
.faq-question{
  font-size:0.84rem;font-weight:600;cursor:pointer;
  list-style:none;padding:0.6rem 0;
  border-bottom:1px solid rgba(255,255,255,0.05);
  color:var(--text);
}
.faq-question::-webkit-details-marker{display:none;}
.faq-question::before{content:'+ ';color:var(--primary-soft);}
details[open] .faq-question::before{content:'− ';color:var(--muted);}
.faq-answer{font-size:0.82rem;color:var(--muted);line-height:1.65;padding:0.6rem 0;margin:0;}
.faq-answer a{color:var(--primary-soft);}

/* ── Admin tickets: Two-pane layout ─────────────────────── */
.adm-tickets-two-pane{
  display:grid;grid-template-columns:320px 1fr;gap:1.25rem;
  align-items:start;
}
@media(max-width:900px){.adm-tickets-two-pane{grid-template-columns:1fr;}}
.adm-ticket-list-panel{
  background:rgba(255,255,255,0.01);
  border:1px solid rgba(255,255,255,0.06);
  border-radius:12px;overflow:hidden;
}
.adm-ticket-thread-panel{
  background:rgba(255,255,255,0.01);
  border:1px solid rgba(255,255,255,0.06);
  border-radius:12px;padding:1.1rem;min-height:300px;
}
.adm-thread-placeholder{
  display:flex;align-items:center;justify-content:center;
  min-height:220px;
}
.adm-thread-placeholder p{font-size:0.82rem;color:var(--muted);}

/* ── Thread header flex (two-pane admin tickets) ────────── */
.adm-thread-header{
  display:flex;align-items:flex-start;justify-content:space-between;
  gap:1rem;margin-bottom:0.75rem;padding-bottom:0.75rem;
  border-bottom:1px solid rgba(255,255,255,0.07);
}

/* ── Ticket messages container ──────────────────────────── */
.ticket-messages{
  display:flex;flex-direction:column;gap:0.75rem;
  max-height:340px;overflow-y:auto;
  margin:0.75rem 0;padding-right:0.25rem;
}

/* ── Sidebar nav SVG icon visibility ────────────────────── */
.dash-nav-item svg{flex-shrink:0;display:block;}

/* ── Section hint text (admin pages) ────────────────────── */
.adm-section-hint{font-size:0.82rem;color:var(--muted);margin-bottom:1rem;}

/* ── Responsive: Quicknav smaller screens ───────────────── */
@media(max-width:640px){
  .dash-quicknav{grid-template-columns:repeat(2,1fr);}
  .adm-quick-actions{grid-template-columns:repeat(2,1fr);}
  .analytics-hero{flex-direction:column;gap:0.75rem;}
}

/* ── Status pill: hide when no project ──────────────────── */
.dash-status-pill:empty{display:none;}

/* ── Admin overview quick-action badge position ─────────── */
.adm-quick-action-btn .dash-badge{
  align-self:flex-start;margin-top:0.1rem;
}

/* ── Client portal: stat card progress bar spacing ─────── */
.dash-stat-card .progress-bar{margin-top:0.6rem;}

/* ── Admin clients: tab pane fade-in ────────────────────── */
.adm-tab-pane{animation:tabIn .18s ease-out both;}

/* ── Store: connection card layout ──────────────────────── */
.adm-integration-header{
  display:flex;align-items:center;justify-content:space-between;
  gap:1rem;margin-bottom:1rem;
}
.adm-integration-details{margin-bottom:1rem;}
.adm-integration-actions{display:flex;gap:0.6rem;flex-wrap:wrap;}

/* ── Analytics: Hero main flex item ─────────────────────── */
.analytics-hero-main{flex:1;min-width:0;}

/* ── Proj phase card ─────────────────────────────────────── */
.proj-phase-card{margin-bottom:1.25rem;}

/* ── Ticket item hover ───────────────────────────────────── */
.ticket-item{cursor:pointer;transition:border-color .13s,background .13s;}
.ticket-item:hover{border-color:rgba(255,255,255,0.1);background:rgba(255,255,255,0.025);}

/* ── Dash badge inside topbar ────────────────────────────── */
.dash-topbar .dash-badge{margin-left:0.4rem;vertical-align:middle;}
