/* MugShotter — public marketing polish (landing, pricing, about, contact,
   downloads). Loaded on signed-out _layout pages via body.public-theme.
   Additive only — refines the public face; never touches the signed-in app. */

/* Hero */
.public-theme .landing-hero h1{ font-weight:800; letter-spacing:-.02em;
  background:linear-gradient(180deg,#ffffff 0%,#c9dcef 100%);
  -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
.public-theme .hero-lede{ color:#9fb0c4 !important; }

/* Product cards (class added in landing.ejs) */
.public-theme .product-card{
  transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease;
  box-shadow:0 16px 42px -26px rgba(0,0,0,.85); }
.public-theme .product-card:hover{ transform:translateY(-4px);
  box-shadow:0 28px 64px -26px rgba(0,0,0,.95); border-color:rgba(255,255,255,.28) !important; }
.public-theme .product-card h2{ letter-spacing:-.01em; }

/* Buttons */
.public-theme .btn{ transition:transform .08s ease, filter .15s ease, box-shadow .15s ease; font-weight:650; }
.public-theme .btn-primary:hover{ filter:brightness(1.07); transform:translateY(-1px); }
.public-theme .btn-ghost:hover{ border-color:rgba(255,255,255,.4); }

/* Content pages (pricing / about / contact / downloads) */
.public-theme .page h1{ letter-spacing:-.015em; }
.public-theme .page h2, .public-theme .page h3{ color:#e7eef6; }
.public-theme table{ border-collapse:collapse; width:100%; margin:1rem 0; }
.public-theme th, .public-theme td{ border:1px solid var(--border,#243040); padding:.72rem .9rem; text-align:left; }
.public-theme thead th{ background:rgba(54,197,176,.09); color:#dff3ef; font-weight:700; }
.public-theme tbody tr:hover{ background:rgba(255,255,255,.02); }

/* Topbar polish — sticky with a subtle blur on the public site */
.public-theme .topbar{ position:sticky; top:0; z-index:50;
  background:rgba(10,15,26,.78); backdrop-filter:saturate(1.3) blur(8px);
  border-bottom:1px solid rgba(255,255,255,.06); }

/* ============================================================
   Marketing component system — super-professional public pages
   (about / pricing / downloads / contact). Scoped to .public-theme.
   ============================================================ */
.public-theme .mkt-hero{ text-align:center; max-width:840px; margin:3.2rem auto 2.4rem; padding:0 1.25rem; }
.public-theme .mkt-eyebrow{ display:inline-block; font-family:"JetBrains Mono","SF Mono",Consolas,monospace;
  font-size:.7rem; letter-spacing:.24em; text-transform:uppercase; color:#36C5B0;
  border:1px solid rgba(54,197,176,.38); background:rgba(54,197,176,.07);
  padding:.36rem .8rem; border-radius:999px; margin-bottom:1.1rem; }
.public-theme .mkt-hero h1{ font-size:clamp(2rem,4.2vw,3.05rem); font-weight:800; letter-spacing:-.022em;
  margin:.2rem 0 .9rem; line-height:1.06;
  background:linear-gradient(180deg,#ffffff 0%,#c4d7ec 100%);
  -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
.public-theme .mkt-lede{ color:#9fb0c4; font-size:1.12rem; line-height:1.62; max-width:640px; margin:0 auto; }
.public-theme .mkt-section{ max-width:1120px; margin:0 auto 3.2rem; padding:0 1.25rem; }
.public-theme .mkt-section-head{ display:flex; align-items:center; gap:.85rem; margin:2.6rem 0 1.3rem; }
.public-theme .mkt-section-head h2{ font-size:1.5rem; font-weight:750; margin:0; letter-spacing:-.01em; white-space:nowrap; }
.public-theme .mkt-section-head .rule{ height:1px; flex:1; background:linear-gradient(90deg,rgba(255,255,255,.14),transparent); }
.public-theme .mkt-sub{ color:#9fb0c4; font-size:.96rem; margin:.1rem 0 1.2rem; max-width:680px; }
.public-theme .mkt-cta{ text-align:center; margin:2.6rem auto 0; color:#9fb0c4; }

/* Feature cards (about) */
.public-theme .feature-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(330px,1fr)); gap:1.3rem; }
.public-theme .feature-card{ position:relative; display:flex; flex-direction:column;
  background:linear-gradient(165deg,#101f30 0%,#0a131f 100%); border:1px solid var(--border,#243040);
  border-radius:16px; padding:1.7rem; overflow:hidden;
  transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease;
  box-shadow:0 14px 38px -26px rgba(0,0,0,.85); }
.public-theme .feature-card:hover{ transform:translateY(-4px); border-color:rgba(255,255,255,.22);
  box-shadow:0 30px 64px -28px rgba(0,0,0,.95); }
.public-theme .feature-card::before{ content:""; position:absolute; top:0; left:0; right:0; height:3px;
  background:var(--accent-bar,linear-gradient(90deg,#36C5B0,#00E5FF)); }
.public-theme .fc-head{ display:flex; align-items:center; gap:.8rem; margin-bottom:.7rem; }
.public-theme .fc-ico{ flex:0 0 auto; font-size:1.5rem; line-height:1; width:46px; height:46px;
  display:grid; place-items:center; border-radius:12px; background:rgba(255,255,255,.045);
  border:1px solid rgba(255,255,255,.09); }
.public-theme .fc-head h3{ margin:0; font-size:1.22rem; font-weight:750; letter-spacing:-.01em; }
.public-theme .feature-card > p{ color:#c4d2e0; font-size:.94rem; line-height:1.56; margin:.1rem 0 .85rem; }
.public-theme .feature-card ul{ list-style:none; margin:0 0 1rem; padding:0; display:grid; gap:.5rem; }
.public-theme .feature-card li{ position:relative; padding-left:1.45rem; color:#aebccb; font-size:.875rem; line-height:1.5; }
.public-theme .feature-card li b{ color:#e8eef5; }
.public-theme .feature-card li::before{ content:"▸"; position:absolute; left:.15rem; top:0; color:#36C5B0; }
.public-theme .fc-foot{ margin-top:auto; padding-top:.4rem; color:#7e8ea0; font-size:.82rem; }
.public-theme .fc-foot a{ color:#9fb0c4; }

/* Pricing tiers */
.public-theme .price-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(232px,1fr)); gap:1.1rem; }
.public-theme .price-card{ display:flex; flex-direction:column; background:linear-gradient(170deg,#101f30,#0a131f);
  border:1px solid var(--border,#243040); border-radius:16px; padding:1.55rem;
  transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease; }
.public-theme .price-card:hover{ transform:translateY(-3px); border-color:rgba(54,197,176,.42);
  box-shadow:0 24px 52px -28px rgba(0,0,0,.92); }
.public-theme .price-card.featured{ border-color:rgba(54,197,176,.6);
  box-shadow:inset 0 0 0 1px rgba(54,197,176,.25), 0 24px 52px -26px rgba(0,0,0,.92); }
.public-theme .price-tag{ display:inline-block; align-self:flex-start; font-size:.62rem; letter-spacing:.12em;
  text-transform:uppercase; font-weight:700; color:#06101f; background:#36C5B0; padding:.2rem .5rem; border-radius:6px; margin-bottom:.7rem; }
.public-theme .price-name{ font-size:1.02rem; font-weight:700; margin:0 0 .25rem; }
.public-theme .price-amt{ font-size:2rem; font-weight:800; color:#36C5B0; letter-spacing:-.02em; margin:.1rem 0 .85rem; line-height:1; }
.public-theme .price-amt small{ font-size:.78rem; font-weight:400; color:#8a9bad; letter-spacing:0; }
.public-theme .price-card ul{ list-style:none; margin:0 0 1.1rem; padding:0; display:grid; gap:.42rem; }
.public-theme .price-card li{ position:relative; padding-left:1.35rem; font-size:.86rem; color:#bccadb; line-height:1.45; }
.public-theme .price-card li b{ color:#fff; }
.public-theme .price-card li::before{ content:"✓"; position:absolute; left:0; color:#36C5B0; font-weight:700; }
.public-theme .price-card .btn{ margin-top:auto; }
.public-theme .price-foot{ color:#8a9bad; font-size:.84rem; margin:.7rem 0 0; }

/* Highlight banner (CPF combo, trial, etc.) */
.public-theme .mkt-highlight{ background:linear-gradient(135deg,rgba(54,197,176,.12),rgba(0,229,255,.07));
  border:1px solid rgba(54,197,176,.45); border-radius:16px; padding:1.8rem; margin:2rem 0; }
.public-theme .mkt-highlight h2{ margin:0 0 .35rem; font-size:1.3rem; color:#36C5B0; }
.public-theme .mkt-highlight .price-amt{ margin:.4rem 0 .7rem; }

/* Contact split */
.public-theme .contact-grid{ display:grid; grid-template-columns:1fr 1.15fr; gap:1.4rem; align-items:start; max-width:980px; margin:0 auto; }
.public-theme .info-card, .public-theme .form-card{ background:linear-gradient(170deg,#101f30,#0a131f);
  border:1px solid var(--border,#243040); border-radius:16px; padding:1.7rem; }
.public-theme .info-card h2, .public-theme .form-card h2{ margin:0 0 1rem; font-size:1.1rem; }
.public-theme .info-list{ list-style:none; margin:0; padding:0; display:grid; gap:1rem; }
.public-theme .info-list li{ display:flex; gap:.8rem; align-items:flex-start; font-size:.92rem; color:#c4d2e0; }
.public-theme .info-list .ico{ font-size:1.2rem; line-height:1.3; }
.public-theme .info-list a{ color:#36C5B0; }
.public-theme .form-card label{ display:grid; gap:.4rem; margin-bottom:1rem; font-size:.88rem; color:#cdd9e7; }
.public-theme .form-card input, .public-theme .form-card textarea{ width:100%; box-sizing:border-box;
  background:#0b1220; border:1px solid rgba(255,255,255,.14); border-radius:10px; padding:.72rem .85rem;
  color:#f1f5fb; font:inherit; font-size:.95rem; transition:border-color .15s, box-shadow .15s; }
.public-theme .form-card input:focus, .public-theme .form-card textarea:focus{ outline:none;
  border-color:#3b82f6; box-shadow:0 0 0 3px rgba(59,130,246,.25); }
.public-theme .form-card button{ width:100%; border:0; border-radius:11px; padding:.82rem; cursor:pointer;
  font-size:1rem; font-weight:700; color:#06101f; background:linear-gradient(135deg,#60a5fa,#3b82f6);
  box-shadow:0 10px 24px -8px rgba(59,130,246,.5); transition:filter .15s; }
.public-theme .form-card button:hover{ filter:brightness(1.07); }
@media (max-width:760px){ .public-theme .contact-grid{ grid-template-columns:1fr; } }
@media (max-width:520px){ .public-theme .mkt-section-head h2{ white-space:normal; } }

/* Public top-nav must fit on phones: shrink, then drop the wordmark for space */
@media (max-width:600px){
  .public-theme .topbar nav{ gap:.75rem; font-size:.86rem; }
  .public-theme .topbar .brand-wordmark{ font-size:.98rem; letter-spacing:.04em; }
}
@media (max-width:440px){
  .public-theme .topbar .brand-wordmark{ display:none; }
  .public-theme .topbar nav{ gap:.65rem; font-size:.82rem; }
}


/* ===== DESIGN ELEVATION LAYER (appended 2026-06-26) ===== */
/* ============================================================================
   MugShotter — DESIGN ELEVATION LAYER  (2026-06-26)
   Loaded LAST on every page. Refines depth, typography, spacing, radii, shadow
   and motion across the whole site while preserving the teal/cyan tactical
   brand. Purely additive — delete this file (and its <link>) to fully revert.
   ============================================================================ */

.public-theme{
  /* Deeper, cleaner navy depth ramp (no pure black) — scoped to public pages
     so the signed-in dashboard theme is untouched. */
  --bg:#080b11;
  --bg2:#0f151e;
  --surface:#141b26;
  --border:#1f2a39;
  --border-2:#2b3a4e;
  --fg:#eff4f9;
  --fg-dim:#9db0c4;
  /* Brand accent — refined teal + cyan glow (kept from existing identity) */
  --accent:#3ad0c8;
  --accent-ink:#042321;
  --cyan:#28e0ff;
  --accent-grad:linear-gradient(135deg,#3ad0c8 0%,#28e0ff 100%);
  --radius-sm:9px; --radius:13px; --radius-lg:18px; --radius-xl:24px;
  --shadow-2:0 12px 34px -14px rgba(0,0,0,.7);
  --shadow-3:0 34px 80px -30px rgba(0,0,0,.86);
  --ring:0 0 0 3px rgba(58,208,200,.26);
}

html{ scroll-behavior:smooth; }
body{ -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;
  text-rendering:optimizeLegibility; letter-spacing:.005em; }

/* Subtle ambient depth on the public face (one calm radial, no AI-purple) */
.public-theme{ position:relative;
  background:
    radial-gradient(1100px 560px at 50% -8%, rgba(58,208,200,.07), transparent 60%),
    var(--bg); }

/* --- Typography lift (system stack stays; sharpen scale + tracking) -------- */
h1{ letter-spacing:-.025em; line-height:1.04; }
h2{ letter-spacing:-.014em; }
h3{ letter-spacing:-.008em; }

/* --- Sticky public topbar: glassier, tighter --------------------------- */
.public-theme .topbar{ background:rgba(8,11,17,.72); backdrop-filter:saturate(1.4) blur(14px);
  -webkit-backdrop-filter:saturate(1.4) blur(14px); border-bottom:1px solid rgba(255,255,255,.07);
  padding-top:.85rem; padding-bottom:.85rem; }
.public-theme .topbar nav a{ position:relative; color:var(--fg-dim); transition:color .15s; }
.public-theme .topbar nav a:hover{ color:var(--fg); text-decoration:none; }

/* --- Hero: bigger, tighter, premium ------------------------------------ */
.public-theme .landing-hero{ padding-top:clamp(2.5rem,6vw,5rem); padding-bottom:1.5rem; }
.public-theme .landing-hero h1,
.public-theme .mkt-hero h1{ font-size:clamp(2.4rem,5.2vw,3.9rem); font-weight:850;
  letter-spacing:-.03em; line-height:1.02;
  background:linear-gradient(176deg,#ffffff 0%,#cfe6ef 62%,#8fdfe0 100%);
  -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
.public-theme .hero-lede,.public-theme .mkt-lede{ font-size:clamp(1.02rem,1.7vw,1.22rem);
  line-height:1.62; color:#a7b8cb !important; max-width:60ch; }

/* --- Buttons: tactile, gradient primary -------------------------------- */
.public-theme .btn,.btn{ border-radius:var(--radius-sm); font-weight:680;
  transition:transform .12s cubic-bezier(.16,1,.3,1), box-shadow .18s, filter .18s, border-color .18s; }
.public-theme .btn-primary,.btn-primary{ color:var(--accent-ink)!important;
  background:var(--accent-grad)!important; border:0!important;
  box-shadow:0 12px 26px -10px rgba(40,224,255,.5); }
.public-theme .btn-primary:hover,.btn-primary:hover{ transform:translateY(-2px);
  box-shadow:0 18px 36px -10px rgba(40,224,255,.7); filter:brightness(1.04); }
.public-theme .btn-primary:active,.btn-primary:active{ transform:translateY(0); }
.public-theme .btn-ghost{ border:1px solid rgba(255,255,255,.16); border-radius:var(--radius-sm);
  background:rgba(255,255,255,.02); }
.public-theme .btn-ghost:hover{ border-color:rgba(58,208,200,.5); background:rgba(58,208,200,.06); }

/* --- Product cards: depth, per-card accent edge, lift ------------------ */
.public-theme .product-card{ border-radius:var(--radius-lg)!important; overflow:hidden; position:relative;
  background:linear-gradient(168deg,#111f2e 0%,#0a131e 100%)!important;
  border:1px solid rgba(255,255,255,.08)!important;
  box-shadow:0 20px 50px -28px rgba(0,0,0,.9); }
.public-theme .product-card::before{ content:""; position:absolute; inset:0 0 auto 0; height:3px;
  background:var(--accent-grad); opacity:.9; }
.public-theme .product-card:hover{ transform:translateY(-6px)!important;
  border-color:rgba(58,208,200,.35)!important;
  box-shadow:0 36px 80px -30px rgba(0,0,0,.95), 0 0 0 1px rgba(58,208,200,.12)!important; }
.public-theme .product-card h2{ font-weight:780; letter-spacing:-.015em; }

/* --- Footer ------------------------------------------------------------- */
.public-theme .footer{ border-top:1px solid rgba(255,255,255,.06); color:#7e8ea2; }

/* --- Focus visibility (a11y) ------------------------------------------- */
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{
  outline:none; box-shadow:var(--ring); border-radius:6px; }

@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior:auto; }
  *{ transition:none!important; animation:none!important; }
}


/* ===== SELF-HOSTED FONT — Inter Variable (appended 2026-06-26) ===== */
@font-face{ font-family:"Inter"; font-style:normal; font-weight:100 900; font-display:swap; src:url("/fonts/InterVariable.woff2?v=1") format("woff2"); }
html,body{ font-family:"Inter",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif; }
