/*
 * tailwind-static.css — Marqstats Site-Wide
 * Pre-built replacement for cdn.tailwindcss.com
 * Covers: site_header, site_footer, index.php, view.php (RD pages)
 * 
 * Upload to: public_html/assets/css/tailwind-static.css
 */

/* ═══ RESET (Tailwind Preflight) ═══ */
*,::before,::after{box-sizing:border-box;border-width:0;border-style:solid;border-color:#e5e7eb}
html{line-height:1.5;-webkit-text-size-adjust:100%;font-family:Inter,ui-sans-serif,system-ui,sans-serif}
body{margin:0;line-height:inherit}
h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}
a{color:inherit;text-decoration:inherit}
b,strong{font-weight:bolder}
img,svg,video,canvas{display:block;vertical-align:middle}
img,video{max-width:100%;height:auto}
button,input,select,textarea{font-family:inherit;font-size:100%;font-weight:inherit;line-height:inherit;color:inherit;margin:0;padding:0}
button,[role="button"]{cursor:pointer}
ul,ol{list-style:none;margin:0;padding:0}
p,h1,h2,h3,h4,h5,h6{margin:0}
table{border-collapse:collapse;border-spacing:0}

/* ═══ CSS VARIABLES ═══ */
:root{
  --tw-brand-50:#eff6ff;--tw-brand-600:#2563eb;--tw-brand-900:#0a1e3b;
  --tw-slate-100:#f1f5f9;--tw-slate-200:#e2e8f0;--tw-slate-500:#64748b;
  --tw-slate-600:#475569;--tw-slate-700:#334155;--tw-slate-900:#0f172a;
  --tw-blue-100:#dbeafe;--tw-blue-200:#bfdbfe;
  --tw-shadow-soft:0 12px 30px rgba(2,8,23,0.08);
}

/* ═══ LAYOUT ═══ */
.relative{position:relative}.absolute{position:absolute}.sticky{position:sticky}.fixed{position:fixed}
.top-0{top:0}.top-full{top:100%}.left-0{left:0}.z-50{z-index:50}
.block{display:block}.flex{display:flex}.grid{display:grid}.hidden{display:none}.inline-flex{display:inline-flex}
.flex-col{flex-direction:column}.flex-wrap{flex-wrap:wrap}.flex-1{flex:1 1 0%}
.items-center{align-items:center}.items-stretch{align-items:stretch}
.justify-between{justify-content:space-between}.justify-center{justify-content:center}
.place-items-center{place-items:center}
.gap-2{gap:.5rem}.gap-3{gap:.75rem}.gap-4{gap:1rem}.gap-5{gap:1.25rem}.gap-6{gap:1.5rem}.gap-8{gap:2rem}.gap-10{gap:2.5rem}
.mx-auto{margin-left:auto;margin-right:auto}
.space-y-3>:not([hidden])~:not([hidden]){margin-top:.75rem}
.grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}

/* ═══ SIZING ═══ */
.h-1{height:.25rem}.h-10{height:2.5rem}.h-12{height:3rem}.h-18{height:4.5rem}.h-40{height:10rem}
.h-full{height:100%}.h-px{height:1px}.h-\[240px\]{height:240px}.min-h-screen{min-height:100vh}.min-h-\[100svh\]{min-height:100svh}
.w-10{width:2.5rem}.w-12{width:3rem}.w-16{width:4rem}.w-56{width:14rem}.w-72{width:18rem}.w-80{width:20rem}
.w-auto{width:auto}.w-full{width:100%}
.max-w-\[1400px\]{max-width:1400px}.max-w-sm{max-width:24rem}.max-w-3xl{max-width:48rem}
.object-contain{object-fit:contain}

/* ═══ SPACING ═══ */
.p-2{padding:.5rem}.p-6{padding:1.5rem}.p-7{padding:1.75rem}
.px-3{padding-left:.75rem;padding-right:.75rem}.px-4{padding-left:1rem;padding-right:1rem}
.px-5{padding-left:1.25rem;padding-right:1.25rem}.px-6{padding-left:1.5rem;padding-right:1.5rem}
.px-8{padding-left:2rem;padding-right:2rem}
.py-1{padding-top:.25rem;padding-bottom:.25rem}.py-2{padding-top:.5rem;padding-bottom:.5rem}
.py-2\.5{padding-top:.625rem;padding-bottom:.625rem}.py-3{padding-top:.75rem;padding-bottom:.75rem}
.py-4{padding-top:1rem;padding-bottom:1rem}.py-8{padding-top:2rem;padding-bottom:2rem}
.py-14{padding-top:3.5rem;padding-bottom:3.5rem}.py-16{padding-top:4rem;padding-bottom:4rem}
.pl-3{padding-left:.75rem}.pt-3{padding-top:.75rem}.pt-6{padding-top:1.5rem}.pt-8{padding-top:2rem}
.pt-10{padding-top:2.5rem}.pt-28{padding-top:7rem}
.pb-3{padding-bottom:.75rem}.pb-6{padding-bottom:1.5rem}.pb-10{padding-bottom:2.5rem}.pb-20{padding-bottom:5rem}
.mt-2{margin-top:.5rem}.mt-3{margin-top:.75rem}.mt-4{margin-top:1rem}.mt-5{margin-top:1.25rem}
.mt-6{margin-top:1.5rem}.mt-7{margin-top:1.75rem}.mt-8{margin-top:2rem}.mt-10{margin-top:2.5rem}
.mt-12{margin-top:3rem}.mt-16{margin-top:4rem}

/* ═══ TYPOGRAPHY ═══ */
.font-sans{font-family:Inter,ui-sans-serif,system-ui,sans-serif}
.font-bold{font-weight:700}.font-extrabold{font-weight:800}.font-semibold{font-weight:600}
.text-xs{font-size:.75rem;line-height:1rem}.text-sm{font-size:.875rem;line-height:1.25rem}
.text-lg{font-size:1.125rem;line-height:1.75rem}.text-xl{font-size:1.25rem;line-height:1.75rem}
.text-3xl{font-size:1.875rem;line-height:2.25rem}.text-4xl{font-size:2.25rem;line-height:2.5rem}
.text-\[11px\]{font-size:11px}.text-\[13px\]{font-size:13px}
.text-center{text-align:center}.uppercase{text-transform:uppercase}
.tracking-wide{letter-spacing:.025em}.tracking-widest{letter-spacing:.1em}
.leading-snug{line-height:1.375}.leading-tight{line-height:1.25}.leading-relaxed{line-height:1.625}
.text-white{color:#fff}
.text-slate-500{color:var(--tw-slate-500)}.text-slate-600{color:var(--tw-slate-600)}
.text-slate-700{color:var(--tw-slate-700)}.text-slate-900{color:var(--tw-slate-900)}
.text-brand-600{color:var(--tw-brand-600)}.text-brand-900{color:var(--tw-brand-900)}
.text-blue-100{color:var(--tw-blue-100)}.text-blue-200{color:var(--tw-blue-200)}

/* ═══ BACKGROUNDS ═══ */
.bg-white{background-color:#fff}
.bg-brand-50{background-color:var(--tw-brand-50)}.bg-brand-600{background-color:var(--tw-brand-600)}
.bg-slate-100{background-color:var(--tw-slate-100)}.bg-slate-200{background-color:var(--tw-slate-200)}
.bg-\[\#0b1426\]{background-color:#0b1426}
.bg-\[\#06152c\]\/15{background-color:rgba(6,21,44,0.15)}
.bg-white\/5{background-color:rgba(255,255,255,0.05)}
.bg-white\/10{background-color:rgba(255,255,255,0.1)}
.bg-white\/20{background-color:rgba(255,255,255,0.2)}
.bg-gradient-to-r{background-image:linear-gradient(to right,var(--tw-gradient-stops))}

/* ═══ BORDERS ═══ */
.border{border-width:1px}.border-b{border-bottom-width:1px}.border-t{border-top-width:1px}
.border-slate-100{border-color:var(--tw-slate-100)}.border-slate-200{border-color:var(--tw-slate-200)}
.border-blue-100{border-color:var(--tw-blue-100)}.border-brand-600{border-color:var(--tw-brand-600)}
.border-white\/10{border-color:rgba(255,255,255,0.1)}.border-white\/15{border-color:rgba(255,255,255,0.15)}
.border-white\/30{border-color:rgba(255,255,255,0.3)}
.rounded-xl{border-radius:.75rem}.rounded-2xl{border-radius:1rem}
.rounded-full{border-radius:9999px}.rounded-\[2\.2rem\]{border-radius:2.2rem}

/* ═══ EFFECTS ═══ */
.shadow-soft{box-shadow:var(--tw-shadow-soft)}
.outline-none{outline:2px solid transparent;outline-offset:2px}
.overflow-hidden{overflow:hidden}

/* ═══ TRANSFORMS ═══ */
.-translate-y-1\/2{transform:translateY(-50%)}.-translate-x-1\/2{transform:translateX(-50%)}

/* ═══ HOVER ═══ */
.hover\:bg-brand-50:hover{background-color:var(--tw-brand-50)}
.hover\:bg-brand-600:hover{background-color:var(--tw-brand-600)}
.hover\:bg-white\/10:hover{background-color:rgba(255,255,255,0.1)}
.hover\:text-brand-600:hover{color:var(--tw-brand-600)}
.hover\:text-brand-900:hover{color:var(--tw-brand-900)}
.hover\:text-white:hover{color:#fff}
.hover\:opacity-95:hover{opacity:.95}.hover\:opacity-100:hover{opacity:1}
.hover\:shadow-lg:hover{box-shadow:0 10px 15px -3px rgba(0,0,0,0.1),0 4px 6px -4px rgba(0,0,0,0.1)}

/* ═══ RESPONSIVE: sm (640px+) ═══ */
@media(min-width:640px){
  .sm\:h-14{height:3.5rem}.sm\:h-20{height:5rem}
  .sm\:pl-5{padding-left:1.25rem}.sm\:px-6{padding-left:1.5rem;padding-right:1.5rem}
  .sm\:block{display:block}.sm\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}
}

/* ═══ RESPONSIVE: md (768px+) ═══ */
@media(min-width:768px){
  .md\:flex{display:flex}.md\:hidden{display:none}.md\:block{display:block}
  .md\:flex-row{flex-direction:row}.md\:justify-start{justify-content:flex-start}
  .md\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}
  .md\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}
  .md\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}
  .md\:gap-0{gap:0}
  .md\:p-12{padding:3rem}.md\:px-8{padding-left:2rem;padding-right:2rem}
  .md\:py-10{padding-top:2.5rem;padding-bottom:2.5rem}.md\:pt-32{padding-top:8rem}
  .md\:text-2xl{font-size:1.5rem;line-height:2rem}
  .md\:text-4xl{font-size:2.25rem;line-height:2.5rem}
  .md\:text-5xl{font-size:3rem;line-height:1}
  .md\:text-6xl{font-size:3.75rem;line-height:1}
  .md\:h-\[260px\]{height:260px}
}

/* ═══ RESPONSIVE: lg (1024px+) ═══ */
@media(min-width:1024px){
  .lg\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}
  .lg\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}
  .lg\:grid-cols-12{grid-template-columns:repeat(12,minmax(0,1fr))}
  .lg\:col-span-5{grid-column:span 5/span 5}
  .lg\:col-span-7{grid-column:span 7/span 7}
}