/* ===== Beamup Social (scoped) =========================================== */
:root{
  --bg-1:#0f172a; --bg-2:#1e293b; --bg-3:#0f172a;
  --text:#e2e8f0; --muted:#94a3b8; --muted-2:#cbd5e1;
  --glass: rgba(15,23,42,.65);
  --border: rgba(51,65,85,.45);
  --ring: rgba(59,130,246,.35);
  --brand-1:#3b82f6; --brand-2:#9333ea; --good:#10b981;
  --card:#0f172ab3; --card-2:#1e293bcc;
  --ok:#86efac;
}

.beamup-app, .beamup-app *{ box-sizing:border-box; }
.beamup-app{ color:var(--text); background:linear-gradient(to bottom,var(--bg-1),var(--bg-2),var(--bg-3)); min-height:100vh; overflow-x:hidden; font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,'Helvetica Neue',Arial,sans-serif; line-height:1.6; }
.beamup-app img{ display:block; max-width:100%; }
.beamup-app a{ color:inherit; text-decoration:none; }

.beamup-app .container{ max-width:1200px; margin:0 auto; padding:0 1rem; }
.beamup-app .section{ position:relative; z-index:1; padding:5rem 1.5rem; }
.beamup-app .section.tiny{ padding-top:3rem; padding-bottom:3rem; }
.beamup-app .muted{ color:var(--muted); }
.beamup-app .muted.large{ font-size:1.125rem; color:var(--muted-2); }

/* ===== Background FX (matches clean v4) ================================ */
.beamup-app .bgfx{ position:fixed; inset:-20vh 0 auto 0; height:140vh; z-index:0; pointer-events:none; filter:saturate(1.1) blur(.2px); }
.beamup-app .bgfx.fx-1{ background:radial-gradient(600px 600px at 70% 40%, rgba(147,51,234,.25), transparent 60%); }
.beamup-app .bgfx.fx-2{ background:radial-gradient(600px 600px at 30% 30%, rgba(59,130,246,.22), transparent 60%); }
.beamup-app .bgfx.fx-3{ display:none; } /* spare */

/* ===== Header =========================================================== */
.beamup-app .site-hdr{ position:fixed; top:0; left:0; right:0; z-index:50; border-bottom:1px solid transparent; transition:background-color .25s ease, border-color .25s ease, backdrop-filter .25s ease; }
.beamup-app .site-hdr.scrolled{ background:var(--glass); border-color:var(--border); backdrop-filter:blur(18px); }
.beamup-app .site-hdr .row{ display:flex; align-items:center; justify-content:space-between; padding:12px 0; gap:1rem; }
.beamup-app .brand{ font-weight:800; color:#fff; }
.beamup-app .nav{ display:flex; gap:1rem; }
.beamup-app .nav a{ color:var(--muted-2); }
.beamup-app .nav a:hover{ color:#fff; }

body.admin-bar .beamup-app .site-hdr{ top:32px; }
@media (max-width:782px){ body.admin-bar .beamup-app .site-hdr{ top:46px; } }

/* ===== Buttons / badges ================================================= */
.beamup-app .btn{ display:inline-flex; align-items:center; justify-content:center; gap:.5rem; font-weight:700; color:#fff; padding:.85rem 1.25rem; border:0; cursor:pointer; border-radius:.75rem; background:linear-gradient(to right,var(--brand-1),var(--brand-2)); box-shadow:0 10px 25px rgba(0,0,0,.22); transition:transform .2s ease, box-shadow .2s ease, opacity .2s ease; }
.beamup-app .btn:hover{ transform:translateY(-2px); box-shadow:0 16px 32px rgba(0,0,0,.28); }
.beamup-app .btn.sm{ padding:.6rem .9rem; border-radius:.65rem; }
.beamup-app .btn.lg{ padding:1rem 1.35rem; border-radius:.85rem; }
.beamup-app .arr{ font-weight:900; }

.beamup-app .badge{ display:inline-flex; align-items:center; gap:.5rem; border:1px solid var(--border); background:rgba(30,41,59,.55); color:#cbd5e1; border-radius:9999px; padding:.35rem .75rem; }
.beamup-app .badge.small{ font-size:11px; padding:.25rem .5rem; }

/* ===== Hero ============================================================= */
.beamup-app .hero{ min-height:100vh; display:flex; align-items:center; padding-top:8rem; padding-bottom:6rem; text-align:center; }
.beamup-app .xxl{ font-weight:900; letter-spacing:-.02em; font-size:clamp(2.25rem, 6vw + .5rem, 5rem); line-height:1.05; margin:.75rem 0 1.75rem; background:linear-gradient(to bottom,#e5e7eb,#94a3b8); -webkit-background-clip:text; background-clip:text; color:transparent; }
.beamup-app .grad{ background:linear-gradient(to right,#60a5fa,#a78bfa,#9333ea); -webkit-background-clip:text; background-clip:text; color:transparent; }
.beamup-app .lead{ max-width:52rem; margin:0 auto 2rem; color:#cbd5e1; font-size:1.25rem; }

/* hero icons (NOT links) */
.beamup-app .icons{ display:flex; align-items:center; justify-content:center; gap:1rem; margin:1.75rem 0 2.25rem; }
.beamup-app .icon-card{ position:relative; width:56px; height:56px; border-radius:14px; border:1px solid var(--border); background:rgba(2,6,23,.6); display:flex; align-items:center; justify-content:center; box-shadow:0 0 0 1px rgba(99,102,241,.15), 0 8px 22px rgba(0,0,0,.25); transition:transform .25s ease, box-shadow .25s ease, opacity .25s ease; opacity:.75; }
.beamup-app .icon-card.active{ transform:scale(1.12); opacity:1; box-shadow:0 0 0 2px var(--ring), 0 14px 30px rgba(0,0,0,.35); }
.beamup-app .icon-card .dot{ position:absolute; top:-4px; right:-4px; width:16px; height:16px; border-radius:9999px; background:var(--good); box-shadow:0 0 0 0 rgba(16,185,129,.55); animation:pulse 1.4s ease-in-out infinite; }
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(16,185,129,.55)}70%{box-shadow:0 0 0 12px rgba(16,185,129,0)}100%{box-shadow:0 0 0 0 rgba(16,185,129,0)}}

/* ===== Cards & grid ===================================================== */
.beamup-app .cardish{ background:var(--card); border:1px solid var(--border); border-radius:16px; overflow:hidden; backdrop-filter:blur(8px); }
.beamup-app .pad{ padding:1.5rem; }

.beamup-app .grid{ display:grid; gap:1.25rem; }
.beamup-app .grid.two{ grid-template-columns:repeat(1,minmax(0,1fr)); }
.beamup-app .grid.three{ grid-template-columns:repeat(1,minmax(0,1fr)); }
@media (min-width:768px){ .beamup-app .grid.two{ grid-template-columns:repeat(2,minmax(0,1fr)); } .beamup-app .grid.three{ grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (min-width:1024px){ .beamup-app .grid.three{ grid-template-columns:repeat(3,minmax(0,1fr)); } }

.beamup-app h2{ font-weight:800; font-size:clamp(1.75rem, 2.2vw + 1rem, 2.25rem); margin-bottom:.5rem; color:#fff; }
.beamup-app .center{ text-align:center; }

/* ===== Video tile ======================================================= */
.beamup-app .video .video-tile{ width:100%; border:1px solid var(--border); border-radius:16px; background:rgba(2,6,23,.55); cursor:pointer; padding:0; }
.beamup-app .video .tile-head{ display:flex; align-items:center; gap:.75rem; padding:1rem 1.25rem; }
.beamup-app .video .tile-title{ font-weight:700; }
.beamup-app .i-24{ width:24px; height:24px; }

/* ===== Features grid ==================================================== */
.beamup-app .features{ display:grid; gap:1.25rem; grid-template-columns:repeat(1,minmax(0,1fr)); margin-top:1.5rem; }
@media(min-width:768px){ .beamup-app .features{ grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(min-width:1024px){ .beamup-app .features{ grid-template-columns:repeat(3,minmax(0,1fr)); } }

.beamup-app .feature{ background:var(--card); border:1px solid var(--border); border-radius:16px; overflow:hidden; transition:transform .2s ease, box-shadow .2s ease; }
.beamup-app .feature:hover{ transform:translateY(-3px); box-shadow:0 14px 30px rgba(0,0,0,.25); }
.beamup-app .feature .tool-head{ display:flex; align-items:center; gap:.75rem; padding:1.25rem 1.25rem .25rem; }
.beamup-app .feature p{ color:var(--muted); padding:0 1.25rem 1.25rem; margin:0; }

.beamup-app .icon-pill{ position:relative; border-radius:12px; padding:.75rem; background:var(--card-2); border:1px solid var(--border); }
.beamup-app .icon-glow{ position:absolute; inset:0; border-radius:12px; filter:blur(16px); opacity:.22; }

/* ===== Tool cards (2-col sections) ===================================== */
.beamup-app .tool-card{ background:var(--card); border:1px solid var(--border); border-radius:16px; overflow:hidden; }
.beamup-app .tool-card .tool-head{ display:flex; align-items:center; gap:.75rem; padding:1.25rem 1.25rem 0; }
.beamup-app .tool-card .tool-head h3{ font-weight:700; }
.beamup-app .tool-card .tool-body{ padding:1rem 1.25rem 1.25rem; }
.beamup-app .tool-card .stat{ display:flex; justify-content:space-between; margin:.45rem 0; }
.beamup-app .tool-card .list{ margin-top:.75rem; border-top:1px solid var(--border); padding-top:.75rem; }
.beamup-app .tool-card .list .row{ display:flex; justify-content:space-between; align-items:center; padding:.45rem .6rem; border-radius:10px; background:rgba(51,65,85,.35); }
.beamup-app .tool-card .list .row + .row{ margin-top:.35rem; }

.beamup-app code{ font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace; color:#c084fc; background:rgba(2,6,23,.45); padding:.15rem .35rem; border-radius:.35rem; }

.beamup-app .tool-card.purple   .i-24{ color:#c084fc; }
.beamup-app .tool-card.green    .i-24{ color:#4ade80; }
.beamup-app .tool-card.blue     .i-24{ color:#60a5fa; }
.beamup-app .tool-card.teal     .i-24{ color:#2dd4bf; }
.beamup-app .tool-card.orange   .i-24{ color:#fb923c; }
.beamup-app .tool-card .ok{ color:var(--ok); background:rgba(34,197,94,.2); border:1px solid rgba(34,197,94,.35); border-radius:9999px; padding:.2rem .5rem; font-size:.85rem; }

/* split rows (security list) */
.beamup-app .row.split{ display:flex; justify-content:space-between; align-items:center; padding:.55rem .75rem; border-radius:10px; background:rgba(51,65,85,.35); }
.beamup-app .row.split + .row.split{ margin-top:.4rem; }

/* flow (team workflow) */
.beamup-app .flow{ display:grid; gap:.6rem; }
.beamup-app .flow-row{ display:flex; gap:.75rem; align-items:center; padding:.55rem .75rem; border-radius:10px; background:var(--card-2); }
.beamup-app .dot{ width:10px; height:10px; border-radius:9999px; display:inline-block; }
.beamup-app .dot.yellow{ background:#f59e0b; }
.beamup-app .dot.blue{ background:#60a5fa; }
.beamup-app .dot.green{ background:#10b981; }
.beamup-app .dot.purple{ background:#a78bfa; }

/* calendar (right tool) */
.beamup-app .calendar{ display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); gap:.35rem; margin:.5rem 0 .75rem; }
.beamup-app .calendar .cell{ aspect-ratio:1/1; border-radius:8px; display:flex; align-items:center; justify-content:center; background:rgba(51,65,85,.35); color:#94a3b8; font-size:.85rem; }
.beamup-app .calendar .cell.live{ background:rgba(34,197,94,.28); color:#86efac; }

/* mini stats (analytics top row) */
.beamup-app .stats .mini{ background:var(--card-2); border-radius:12px; padding:1rem; text-align:center; }
.beamup-app .big{ font-weight:800; font-size:1.75rem; color:#fff; }

/* bar chart (mock) */
.beamup-app .chart{ position:relative; background:var(--card-2); border-radius:12px; padding:1rem; margin:.75rem 0 1rem; }
.beamup-app .chart .legend{ position:absolute; top:10px; right:12px; font-size:.9rem; display:flex; gap:1rem; color:#94a3b8; }
.beamup-app .chart .legend .o{ color:#fb923c; } .beamup-app .chart .legend .b{ color:#60a5fa; }
.beamup-app .chart .bar{ display:inline-block; width:calc((100% - 11*8px)/12); margin-right:8px; height:60px; border-radius:6px; vertical-align:bottom; background:linear-gradient(to top, rgba(251,146,60,.6), rgba(251,146,60,.28)); }
.beamup-app .chart .bar:last-child{ margin-right:0; }

/* progress bars */
.beamup-app .prog{ display:flex; align-items:center; gap:.75rem; }
.beamup-app .prog + .prog{ margin-top:.55rem; }
.beamup-app .prog > span:first-child{ width:80px; }
.beamup-app .prog > div{ flex:1; background:#334155; border-radius:9999px; height:8px; overflow:hidden; }
.beamup-app .prog > div i{ display:block; height:8px; background:#ec4899; border-radius:9999px; }
.beamup-app .prog:nth-child(2) > div i{ background:#60a5fa; }
.beamup-app .prog:nth-child(3) > div i{ background:#2563eb; }
.beamup-app .prog:nth-child(4) > div i{ background:#3b82f6; }

/* ===== Forms ============================================================ */
.beamup-app .form-card{ max-width:64rem; margin:1.25rem auto 0; }
.beamup-app .form{ background:var(--card); border:1px solid var(--border); border-radius:16px; padding:1.25rem; }
.beamup-app .form label{ display:block; color:var(--muted); }
.beamup-app .form input, .beamup-app .form textarea{
  width:100%; margin-top:.35rem; padding:.9rem 1rem; border-radius:.75rem; background:#0b1220; border:1px solid #1f2937; color:#fff; outline:none;
}
.beamup-app .form textarea{ resize:vertical; }
.beamup-app .form .grid.two{ display:grid; grid-template-columns:repeat(1,minmax(0,1fr)); gap:1rem; }
@media(min-width:768px){ .beamup-app .form .grid.two{ grid-template-columns:repeat(2,minmax(0,1fr)); } }

/* ===== Footer =========================================================== */
.beamup-app .site-ftr{ border-top:1px solid var(--border); background:#0b1324; padding:2rem 1.5rem; }
.beamup-app .site-ftr .ftr{ grid-template-columns:repeat(1,minmax(0,1fr)); gap:1.25rem; }
@media(min-width:900px){ .beamup-app .site-ftr .ftr{ grid-template-columns:repeat(4,minmax(0,1fr)); } }
.beamup-app .site-ftr h4{ font-weight:700; margin-bottom:.6rem; }
.beamup-app .site-ftr .social{ display:flex; gap:.75rem; margin-top:.75rem; }
.beamup-app .copy{ border-top:1px solid var(--border); margin-top:1rem; padding-top:1rem; text-align:center; color:var(--muted); }

/* utility spacing */
.beamup-app .mt{ margin-top:.75rem; }
