/* SafeAI shared stylesheet — load on every page */
/* SafeAI — minimal utility CSS replacing Tailwind CDN */
/* Generated April 2026 — covers only classes used in SafeAI suite */

/* ── RESET ── */
*,::before,::after{box-sizing:border-box;}
html{line-height:1.5;-webkit-text-size-adjust:100%;}
body{margin:0;}
img,svg{display:block;vertical-align:middle;}
input,button,select,textarea{font-family:inherit;font-size:100%;line-height:inherit;margin:0;}
button{cursor:pointer;}
a{color:inherit;text-decoration:inherit;}

/* ── LAYOUT ── */
.block{display:block!important;}
.inline-block{display:inline-block!important;}
.inline-flex{display:inline-flex!important;}
.flex{display:flex!important;}
.grid{display:grid!important;}
.hidden{display:none!important;}
.fixed{position:fixed!important;}
.absolute{position:absolute!important;}
.relative{position:relative!important;}
.sticky{position:sticky!important;}

/* ── FLEX ── */
.flex-col{flex-direction:column!important;}
.flex-wrap{flex-wrap:wrap!important;}
.flex-1{flex:1 1 0%!important;}
.flex-shrink{flex-shrink:1!important;}
.items-center{align-items:center!important;}
.items-start{align-items:flex-start!important;}
.justify-center{justify-content:center!important;}
.justify-between{justify-content:space-between!important;}
.self-center{align-self:center!important;}

/* ── GRID ── */
.grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))!important;}
.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))!important;}
.gap-2{gap:.5rem!important;}
.gap-3{gap:.75rem!important;}
.gap-4{gap:1rem!important;}
.gap-5{gap:1.25rem!important;}
.gap-6{gap:1.5rem!important;}
.gap-10{gap:2.5rem!important;}
.col-span-1{grid-column:span 1/span 1!important;}

/* ── OVERFLOW ── */
.overflow-x-auto{overflow-x:auto!important;}
.overflow-hidden{overflow:hidden!important;}

/* ── SIZING ── */
.w-5{width:1.25rem!important;}
.w-full{width:100%!important;}
.h-5{height:1.25rem!important;}
.min-h-screen{min-height:100vh!important;}
.max-w-md{max-width:28rem!important;}
.max-w-2xl{max-width:42rem!important;}
.max-w-3xl{max-width:48rem!important;}
.max-w-7xl{max-width:80rem!important;}

/* ── SPACING — padding ── */
.p-3{padding:.75rem!important;}
.p-4{padding:1rem!important;}
.p-5{padding:1.25rem!important;}
.p-6{padding:1.5rem!important;}
.p-8{padding:2rem!important;}
.px-1\.5{padding-left:.375rem!important;padding-right:.375rem!important;}
.px-3{padding-left:.75rem!important;padding-right:.75rem!important;}
.px-4{padding-left:1rem!important;padding-right:1rem!important;}
.px-5{padding-left:1.25rem!important;padding-right:1.25rem!important;}
.px-8{padding-left:2rem!important;padding-right:2rem!important;}
.py-0\.5{padding-top:.125rem!important;padding-bottom:.125rem!important;}
.py-1{padding-top:.25rem!important;padding-bottom:.25rem!important;}
.py-2{padding-top:.5rem!important;padding-bottom:.5rem!important;}
.py-2\.5{padding-top:.625rem!important;padding-bottom:.625rem!important;}
.py-3{padding-top:.75rem!important;padding-bottom:.75rem!important;}
.py-6{padding-top:1.5rem!important;padding-bottom:1.5rem!important;}
.py-8{padding-top:2rem!important;padding-bottom:2rem!important;}
.py-10{padding-top:2.5rem!important;padding-bottom:2.5rem!important;}
.py-12{padding-top:3rem!important;padding-bottom:3rem!important;}
.py-14{padding-top:3.5rem!important;padding-bottom:3.5rem!important;}
.py-16{padding-top:4rem!important;padding-bottom:4rem!important;}
.py-20{padding-top:5rem!important;padding-bottom:5rem!important;}

/* ── SPACING — margin ── */
.mx-auto{margin-left:auto!important;margin-right:auto!important;}
.ml-auto{margin-left:auto!important;}
.mt-1{margin-top:.25rem!important;}
.mt-2{margin-top:.5rem!important;}
.mt-3{margin-top:.75rem!important;}
.mt-4{margin-top:1rem!important;}
.mt-5{margin-top:1.25rem!important;}
.mt-6{margin-top:1.5rem!important;}
.mt-8{margin-top:2rem!important;}
.mb-1{margin-bottom:.25rem!important;}
.mb-2{margin-bottom:.5rem!important;}
.mb-3{margin-bottom:.75rem!important;}
.mb-4{margin-bottom:1rem!important;}
.mb-5{margin-bottom:1.25rem!important;}
.mb-6{margin-bottom:1.5rem!important;}
.mb-7{margin-bottom:1.75rem!important;}
.mb-8{margin-bottom:2rem!important;}
.mb-10{margin-bottom:2.5rem!important;}

/* ── SPACE-Y ── */
.space-y-2>:not([hidden])~:not([hidden]){margin-top:.5rem!important;}

/* ── TYPOGRAPHY ── */
.font-bold{font-weight:700!important;}
.font-semibold{font-weight:600!important;}
.font-mono{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace!important;}
.text-xs{font-size:.75rem!important;line-height:1rem!important;}
.text-sm{font-size:.875rem!important;line-height:1.25rem!important;}
.text-base{font-size:1rem!important;line-height:1.5rem!important;}
.text-lg{font-size:1.125rem!important;line-height:1.75rem!important;}
.text-xl{font-size:1.25rem!important;line-height:1.75rem!important;}
.text-2xl{font-size:1.5rem!important;line-height:2rem!important;}
.text-3xl{font-size:1.875rem!important;line-height:2.25rem!important;}
.text-4xl{font-size:2.25rem!important;line-height:2.5rem!important;}
.text-center{text-align:center!important;}
.text-right{text-align:right!important;}
.uppercase{text-transform:uppercase!important;}
.leading-tight{line-height:1.25!important;}
.leading-relaxed{line-height:1.625!important;}
.tracking-wide{letter-spacing:.025em!important;}
.tracking-wider{letter-spacing:.05em!important;}
.tracking-\[0\.25em\]{letter-spacing:.25em!important;}

/* ── COLOURS — text ── */
.text-white{color:#fff!important;}
.text-slate-200{color:#e2e8f0!important;}
.text-slate-400{color:#94a3b8!important;}
.text-slate-500{color:#64748b!important;}
.text-slate-600{color:#475569!important;}
.text-slate-700{color:#334155!important;}
.text-slate-800{color:#1e293b!important;}
.text-slate-900{color:#0f172a!important;}
.text-blue-100{color:#dbeafe!important;}
.text-blue-200{color:#bfdbfe!important;}
.text-blue-700{color:#1d4ed8!important;}
.text-blue-800{color:#1e40af!important;}
.text-amber-600{color:#d97706!important;}
.text-amber-700{color:#b45309!important;}
.text-amber-800{color:#92400e!important;}
.text-green-700{color:#15803d!important;}
.text-green-800{color:#166534!important;}
.text-purple-600{color:#9333ea!important;}
.text-purple-700{color:#7e22ce!important;}
.text-purple-800{color:#6b21a8!important;}
.text-red-600{color:#dc2626!important;}
.text-red-700{color:#b91c1c!important;}
.text-red-800{color:#991b1b!important;}
.text-teal-800{color:#115e59!important;}
/* brand colours */
.text-brand-700{color:#194cab!important;}
.text-brand-800{color:#1b418c!important;}
/* opacity variants */
.text-blue-50\/90{color:rgba(239,246,255,.9)!important;}
.text-blue-50\/95{color:rgba(239,246,255,.95)!important;}
.text-blue-100\/80{color:rgba(219,234,254,.8)!important;}
.text-blue-100\/90{color:rgba(219,234,254,.9)!important;}
.text-blue-200\/80{color:rgba(191,219,254,.8)!important;}

/* ── COLOURS — backgrounds ── */
.bg-white{background-color:#fff!important;}
.bg-slate-50{background-color:#f8fafc!important;}
.bg-slate-100{background-color:#f1f5f9!important;}
.bg-slate-900{background-color:#0f172a!important;}
.bg-blue-50{background-color:#eff6ff!important;}
.bg-blue-100{background-color:#dbeafe!important;}
.bg-blue-500{background-color:#3b82f6!important;}
.bg-blue-600{background-color:#2563eb!important;}
.bg-amber-50{background-color:#fffbeb!important;}
.bg-amber-100{background-color:#fef3c7!important;}
.bg-green-100{background-color:#dcfce7!important;}
.bg-purple-50{background-color:#faf5ff!important;}
.bg-purple-100{background-color:#f3e8ff!important;}
.bg-purple-600{background-color:#9333ea!important;}
.bg-red-100{background-color:#fee2e2!important;}
.bg-teal-100{background-color:#ccfbf1!important;}
.bg-brand-50{background-color:#eef6ff!important;}
/* opacity variants */
.bg-white\/10{background-color:rgba(255,255,255,.1)!important;}

/* ── GRADIENTS ── */
.bg-gradient-to-r{background-image:linear-gradient(to right,var(--tw-gradient-stops))!important;}
.from-brand-900{--tw-gradient-from:#1c386f;--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to,rgba(28,56,111,0))!important;}
.via-brand-800{--tw-gradient-stops:var(--tw-gradient-from),#1b418c,var(--tw-gradient-to,rgba(27,65,140,0))!important;}
.to-brand-600{--tw-gradient-to:#1e5fd6!important;}
.from-blue-950{--tw-gradient-from:#172554;--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to,rgba(23,37,84,0))!important;}
.via-blue-800{--tw-gradient-stops:var(--tw-gradient-from),#1e40af,var(--tw-gradient-to,rgba(30,64,175,0))!important;}
.to-blue-600{--tw-gradient-to:#2563eb!important;}
.from-slate-900{--tw-gradient-from:#0f172a;--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to,rgba(15,23,42,0))!important;}
.to-slate-700{--tw-gradient-to:#334155!important;}

/* ── BORDERS ── */
.border{border-width:1px!important;border-style:solid!important;}
.border-2{border-width:2px!important;border-style:solid!important;}
.border-t{border-top-width:1px!important;border-top-style:solid!important;}
.border-b{border-bottom-width:1px!important;border-bottom-style:solid!important;}
.border-y{border-top-width:1px!important;border-bottom-width:1px!important;border-style:solid!important;}
.border-slate-100{border-color:#f1f5f9!important;}
.border-slate-200{border-color:#e2e8f0!important;}
.border-blue-200{border-color:#bfdbfe!important;}
.border-amber-200{border-color:#fde68a!important;}
.border-green-200{border-color:#bbf7d0!important;}
.border-purple-200{border-color:#e9d5ff!important;}
.border-purple-300{border-color:#d8b4fe!important;}
.border-red-200{border-color:#fecaca!important;}
.border-brand-200{border-color:#b9dbff!important;}
.border-brand-600{border-color:#1e5fd6!important;}
.border-white\/15{border-color:rgba(255,255,255,.15)!important;}
.border-white\/20{border-color:rgba(255,255,255,.2)!important;}
.border-white\/30{border-color:rgba(255,255,255,.3)!important;}

/* ── BORDER RADIUS ── */
.rounded{border-radius:.25rem!important;}
.rounded-lg{border-radius:.5rem!important;}
.rounded-xl{border-radius:.75rem!important;}
.rounded-2xl{border-radius:1rem!important;}
.rounded-3xl{border-radius:1.5rem!important;}
.rounded-full{border-radius:9999px!important;}

/* ── SHADOWS ── */
.shadow-soft{box-shadow:0 12px 30px rgba(15,23,42,.08)!important;}

/* ── TRANSITIONS ── */
.transition{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s!important;}

/* ── CURSOR ── */
.cursor-pointer{cursor:pointer!important;}

/* ── HOVER states ── */
.hover\:-translate-y-1:hover{transform:translateY(-.25rem)!important;}
.hover\:bg-blue-50:hover{background-color:#eff6ff!important;}
.hover\:bg-blue-500:hover{background-color:#3b82f6!important;}
.hover\:bg-blue-700:hover{background-color:#1d4ed8!important;}
.hover\:bg-purple-100:hover{background-color:#f3e8ff!important;}
.hover\:bg-purple-700:hover{background-color:#7e22ce!important;}
.hover\:bg-slate-100:hover{background-color:#f1f5f9!important;}
.hover\:bg-white\/10:hover{background-color:rgba(255,255,255,.1)!important;}
.hover\:text-brand-900:hover{color:#1c386f!important;}
.hover\:text-white:hover{color:#fff!important;}

/* ── FOCUS states ── */
.focus\:outline-none:focus{outline:none!important;}
.focus\:border-blue-400:focus{border-color:#60a5fa!important;}

/* ── RESPONSIVE — md: (768px) ── */
@media(min-width:768px){
  .md\:col-span-2{grid-column:span 2/span 2!important;}
  .md\:flex-row{flex-direction:row!important;}
  .md\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))!important;}
  .md\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))!important;}
  .md\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))!important;}
  .md\:grid-cols-5{grid-template-columns:repeat(5,minmax(0,1fr))!important;}
  .md\:items-center{align-items:center!important;}
  .md\:p-10{padding:2.5rem!important;}
  .md\:py-18{padding-top:4.5rem!important;padding-bottom:4.5rem!important;}
  .md\:py-20{padding-top:5rem!important;padding-bottom:5rem!important;}
  .md\:py-24{padding-top:6rem!important;padding-bottom:6rem!important;}
  .md\:text-4xl{font-size:2.25rem!important;line-height:2.5rem!important;}
  .md\:text-5xl{font-size:3rem!important;line-height:1!important;}
}

/* ── RESPONSIVE — sm: (640px) ── */
@media(min-width:640px){
  .sm\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))!important;}
  .sm\:px-6{padding-left:1.5rem!important;padding-right:1.5rem!important;}
}

/* ── RESPONSIVE — lg: (1024px) ── */
@media(min-width:1024px){
  .lg\:col-span-2{grid-column:span 2/span 2!important;}
  .lg\:col-span-3{grid-column:span 3/span 3!important;}
  .lg\:grid-cols-5{grid-template-columns:repeat(5,minmax(0,1fr))!important;}
  .lg\:px-8{padding-left:2rem!important;padding-right:2rem!important;}
}

/* ── RESPONSIVE — xl: (1280px) ── */
@media(min-width:1280px){
  .xl\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))!important;}
}

body{padding-top:64px!important;}
/* ── SAFEAI HAMBURGER NAV ──────────────────────────────── */
.suite-header{
  position:fixed!important;top:0!important;left:0!important;right:0!important;
  z-index:9000!important;
  background:rgba(255,255,255,.97)!important;
  backdrop-filter:blur(12px);
  border-bottom:1px solid #E2E8F0!important;
  height:64px!important;box-sizing:border-box!important;
}
.suite-nav{
  max-width:1200px!important;margin:0 auto!important;padding:0 20px!important;
  height:64px!important;display:flex!important;align-items:center!important;
  justify-content:space-between!important;gap:16px!important;
}
.suite-logo{
  text-decoration:none!important;font-size:1.25rem!important;font-weight:800!important;
  color:#2563EB!important;letter-spacing:-.01em!important;flex-shrink:0!important;
  font-family:Inter,-apple-system,sans-serif!important;
}
.nav-toggle{
  display:flex!important;flex-direction:column!important;justify-content:center!important;
  align-items:center!important;gap:5px!important;
  width:38px!important;height:38px!important;
  background:none!important;border:1px solid #E2E8F0!important;
  cursor:pointer!important;padding:6px!important;border-radius:8px!important;
  flex-shrink:0!important;
}
.nav-toggle:hover{background:#F1F5F9!important;}
.nav-toggle span{
  display:block!important;height:2px!important;width:20px!important;
  background:#334155!important;border-radius:2px!important;
  transform-origin:center;transition:transform .25s,opacity .2s;
}
.nav-toggle.open span:nth-child(1){transform:translateY(7px) rotate(45deg);}
.nav-toggle.open span:nth-child(2){opacity:0;}
.nav-toggle.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}

/* Drawer — display:none is immune to Tailwind preflight */
.nav-drawer{
  display:none!important;
  position:fixed!important;top:64px!important;left:0!important;right:0!important;
  z-index:8999!important;
  background:#ffffff!important;
  border-bottom:1px solid #E2E8F0!important;
  box-shadow:0 8px 32px rgba(15,23,42,.14)!important;
  max-height:calc(100vh - 64px)!important;overflow-y:auto!important;
}
.nav-drawer.open{display:block!important;}

.nav-drawer-inner{
  max-width:1200px!important;margin:0 auto!important;
  padding:20px 24px 8px!important;
  display:grid!important;grid-template-columns:repeat(4,1fr)!important;gap:0!important;
}
.nav-group{
  padding:0 20px 16px 0!important;
  border-right:1px solid #F1F5F9!important;
  margin-right:4px!important;
}
.nav-group:last-child{border-right:none!important;padding-right:0!important;}
.nav-group-label{
  font-size:10px!important;font-weight:700!important;text-transform:uppercase!important;
  letter-spacing:.1em!important;color:#94A3B8!important;
  margin:0 0 8px 0!important;
  font-family:Inter,-apple-system,sans-serif!important;
}
.nav-group a{
  display:block!important;text-decoration:none!important;color:#1E293B!important;
  font-size:13px!important;font-weight:500!important;
  padding:6px 8px!important;border-radius:8px!important;
  margin-bottom:2px!important;
  font-family:Inter,-apple-system,sans-serif!important;
  line-height:1.3!important;
}
.nav-group a:hover{background:#F1F5F9!important;color:#2563EB!important;}
.nav-group a.active{background:#DBEAFE!important;color:#1D4ED8!important;font-weight:600!important;}
.nav-desc{
  display:block!important;font-size:11px!important;color:#94A3B8!important;
  font-weight:400!important;margin-top:1px!important;
}
.nav-footer{
  border-top:1px solid #F1F5F9!important;
  padding:10px 24px 14px!important;
  max-width:1200px!important;margin:0 auto!important;
  display:flex!important;justify-content:space-between!important;align-items:center!important;
}
.nav-footer-back{
  text-decoration:none!important;color:#64748B!important;
  font-size:12px!important;font-weight:600!important;
  font-family:Inter,-apple-system,sans-serif!important;
}
.nav-footer-back:hover{color:#2563EB!important;}

/* Overlay — also display:none */
.nav-overlay{
  display:none!important;
  position:fixed!important;inset:0!important;top:64px!important;
  z-index:8998!important;
  background:rgba(15,23,42,.2)!important;
}
.nav-overlay.open{display:block!important;}

@media(max-width:680px){
  .nav-drawer-inner{grid-template-columns:1fr 1fr!important;}
  .nav-group{
    border-right:none!important;padding-right:0!important;
    border-bottom:1px solid #F1F5F9!important;margin-bottom:8px!important;
  }
  .nav-group:last-child{border-bottom:none!important;margin-bottom:0!important;}
}