:root{
  --brand:#5B73FF; --brand-2:#7A5BFF; --ink:#0f172a; --muted:#6b7280;
  --bg:#ffffff; --section:#f7f8ff; --card:#ffffff; --border:#e5e7eb;
  --radius:18px; --shadow:0 10px 30px rgba(91,115,255,.12);
}
html{scroll-behavior:smooth}
body{padding-top:4.25rem;background:var(--bg);color:var(--ink);font-family:Inter,system-ui,Segoe UI,Roboto,Helvetica,Arial}
.btn-brand{--bs-btn-bg:var(--brand);--bs-btn-border-color:var(--brand);--bs-btn-hover-bg:var(--brand-2);--bs-btn-hover-border-color:var(--brand-2);color:#fff;min-height:44px}
.btn,.form-select{min-height:44px}
.navbar{background:var(--bg);border-bottom:1px solid var(--border)}
.navbar .nav-link{color:var(--muted)} .navbar .nav-link.active,.navbar .nav-link:hover{color:var(--ink)}
.offcanvas-header{border-bottom:1px solid var(--border)}
.hero{background:radial-gradient(1100px 520px at 75% -10%, rgba(122,91,255,.25), transparent 60%),linear-gradient(180deg,#fff 0%,var(--section) 100%);border-radius:var(--radius);padding:clamp(1.5rem,5vw,4rem);box-shadow:var(--shadow)}
.hero h1{font-size:clamp(1.65rem, 4.5vw, 3rem);letter-spacing:-.02em}
.hero .lead{color:var(--muted);font-size:clamp(1rem,2.8vw,1.25rem)}
.trustbar{display:flex;gap:14px;overflow:auto;padding-bottom:.25rem;scrollbar-width:thin}
.trustbar img{opacity:.75;filter:grayscale(1);height:22px}
.section{padding:clamp(2rem,4.5vw,3.5rem) 0}
.feature-card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:1rem;height:100%}
.pricing-card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);position:relative}
.pricing-card .card-header{background:transparent;border-bottom:1px solid var(--border)}
.ribbon{position:absolute;top:12px;right:-8px;background:#fff0c2;color:#7a5b00;border:1px solid #ffd66c;padding:.25rem .6rem;border-radius:8px;transform:rotate(6deg)}
.price-display{font-size:clamp(1.5rem,3.8vw,2.2rem);font-weight:800;letter-spacing:-.02em}
.feature-list{list-style:none;padding:0;margin:0}
.feature-list li{display:flex;gap:.55rem;align-items:flex-start;margin:.45rem 0}
.feature-list .check{width:22px;height:22px;border-radius:50%;background:#eaf0ff;color:#3050ff;display:inline-flex;align-items:center;justify-content:center;font-weight:700;flex:0 0 22px}
.plan-footer{background:#fafbff;border-top:1px dashed var(--border);border-radius:0 0 var(--radius) var(--radius)}
.muted{color:var(--muted)}
.rounded-4{border-radius:var(--radius)!important}
.shadow-soft{box-shadow:var(--shadow)}
.scale-on-hover{transition:transform .15s ease} .scale-on-hover:hover{transform:translateY(-2px)}
.sticky-bar{position:fixed;left:0;right:0;bottom:0;z-index:1040;background:var(--bg);border-top:1px solid var(--border);box-shadow:0 -10px 30px rgba(0,0,0,.06);padding:.65rem 1rem;display:none;padding-bottom:calc(.65rem + env(safe-area-inset-bottom))}
.sticky-bar .summary{font-weight:600}
@media (min-width: 992px){ .sticky-bar{display:none!important} }
.collapse-toggle{cursor:pointer;user-select:none}

/* Outline brand button for Navbar/Login */
.btn-outline-brand{
  --bs-btn-color: var(--brand);
  --bs-btn-border-color: var(--brand);
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: var(--brand);
  --bs-btn-hover-border-color: var(--brand);
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: var(--brand-2);
  --bs-btn-active-border-color: var(--brand-2);
  --bs-btn-disabled-color: var(--brand);
  --bs-btn-disabled-border-color: var(--brand);
  min-height: 44px;
}

/* Dashboard layout */
.dash-wrap { min-height: 70vh; }
.dash-sidebar {
  border-right: 1px solid var(--border);
  position: sticky; top: 72px; /* account for navbar */
  padding-bottom: 1rem;
  height: calc(100vh - 72px);
  overflow: auto;
}
.dash-menu .list-group-item.active{
  background: var(--brand);
  border-color: var(--brand);
}
.dash-content { padding: 1rem; }
@media (max-width: 991.98px){
  .dash-sidebar { position: static; height: auto; }
}

/* NAVBAR TOGGLER FALLBACK */
.navbar .navbar-toggler {
  border-color: var(--border);
}
.navbar-light .navbar-toggler-icon {
  background-image: url("data:image/svg+xml,%3csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3e%3cpath stroke='rgba(15,23,42, 0.8)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}