/* Minimal Tailwind-like utilities for offline preview of training page */
/* Preflight basics */
*,*::before,*::after{box-sizing:border-box}
html{line-height:1.5;-webkit-text-size-adjust:100%}
body{margin:0;font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,"Noto Sans SC",sans-serif;color:#262626;background-color:#fff}
img{display:block;max-width:100%;height:auto}

/* Display helpers */
.hidden{display:none!important}
.block{display:block}
.inline-block{display:inline-block}
.flex{display:flex}
.inline-flex{display:inline-flex}
.grid{display:grid}
.relative{position:relative}
.absolute{position:absolute}
.sticky{position:sticky}
.top-0{top:0}
.inset-0{top:0;right:0;bottom:0;left:0}
.overflow-hidden{overflow:hidden}
.object-cover{object-fit:cover}
.flex-shrink-0{flex-shrink:0}
.z-10{z-index:10}
.z-50{z-index:50}

/* Container */
.container{width:100%;max-width:1200px;margin-left:auto;margin-right:auto}
.mx-auto{margin-left:auto;margin-right:auto}

/* Flex alignment */
.items-center{align-items:center}
.justify-between{justify-content:space-between}
.justify-center{justify-content:center}

/* Grid columns and gaps */
.grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}
.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.gap-8{gap:2rem}

/* Spacing */
.px-4{padding-left:1rem;padding-right:1rem}
.px-6{padding-left:1.5rem;padding-right:1.5rem}
.py-1{padding-top:.25rem;padding-bottom:.25rem}
.py-3{padding-top:.75rem;padding-bottom:.75rem}
.py-4{padding-top:1rem;padding-bottom:1rem}
.py-12{padding-top:3rem;padding-bottom:3rem}
.py-16{padding-top:4rem;padding-bottom:4rem}
.pt-6{padding-top:1.5rem}
.mt-8{margin-top:2rem}
.mb-3{margin-bottom:.75rem}
.mb-4{margin-bottom:1rem}
.mb-6{margin-bottom:1.5rem}
.mb-12{margin-bottom:3rem}
.mb-16{margin-bottom:4rem}
.mr-2{margin-right:.5rem}
.mr-6{margin-right:1.5rem}
.ml-2{margin-left:.5rem}

/* Sizing */
.w-full{width:100%}
.w-12{width:3rem}
.h-12{height:3rem}
.w-20{width:5rem}
.h-1{height:.25rem}
.h-16{height:4rem}
.min-w-full{min-width:100%}
.h-64{height:16rem}

/* Typography */
.font-sans{font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,"Noto Sans SC",sans-serif}
.font-bold{font-weight:700}
.font-medium{font-weight:500}
.italic{font-style:italic}
.text-center{text-align:center}
.text-xs{font-size:.75rem;line-height:1rem}
.text-lg{font-size:1.125rem;line-height:1.75rem}
.text-xl{font-size:1.25rem;line-height:1.75rem}
.text-2xl{font-size:1.5rem;line-height:2rem}
.text-3xl{font-size:1.875rem;line-height:2.25rem}
.text-5xl{font-size:3rem;line-height:1}

/* Colors */
.bg-white{background-color:#fff}
.text-white{color:#fff}
.bg-primary{background-color:#C8102E}
.text-primary{color:#C8102E}
.bg-dark{background-color:#1E293B}
.text-neutral-900{color:#171717}
.text-neutral-800{color:#262626}
.text-neutral-700{color:#404040}
.text-neutral-600{color:#525252}
.text-gray-400{color:#9CA3AF}
.text-gray-500{color:#6B7280}
.text-yellow-400{color:#F59E0B}
.border-gray-800{border-color:#1F2937}
.bg-primary\/10{background-color:rgba(200,16,46,.1)}
.bg-white\/10{background-color:rgba(255,255,255,.1)}

/* Opacity */
.opacity-10{opacity:.1}
.opacity-90{opacity:.9}

/* Radius */
.rounded-lg{border-radius:.5rem}
.rounded-xl{border-radius:.75rem}
.rounded-full{border-radius:9999px}

/* Shadows */
.shadow-md{box-shadow:0 4px 6px rgba(0,0,0,.1)}
.shadow-lg{box-shadow:0 10px 15px rgba(0,0,0,.15)}
.hover\:shadow-lg:hover{box-shadow:0 10px 15px rgba(0,0,0,.15)}

/* Transitions */
.transition-all{transition-property:all;transition-duration:.2s;transition-timing-function:cubic-bezier(.4,0,.2,1)}
.duration-300{transition-duration:300ms}
.transition-colors{transition:color .2s ease}
.hover\:underline:hover{text-decoration:underline}
.backdrop-blur-sm{backdrop-filter:blur(4px)}
.transition-custom{transition:all .3s cubic-bezier(.4,0,.2,1)}

/* Gradients */
.bg-gradient-to-t{--tw-gradient-from:#fff;--tw-gradient-to:transparent;background-image:linear-gradient(to top,var(--tw-gradient-from),var(--tw-gradient-to))}
.from-white{--tw-gradient-from:#fff}
.to-transparent{--tw-gradient-to:transparent}

/* Responsive */
@media (min-width:640px){
  .sm\:px-6{padding-left:1.5rem;padding-right:1.5rem}
}
@media (min-width:768px){
  .md\:flex{display:flex!important}
  .md\:hidden{display:none!important}
  .md\:py-24{padding-top:6rem;padding-bottom:6rem}
  .md\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}
  .md\:h-80{height:20rem}
}
@media (min-width:1024px){
  .lg\:px-8{padding-left:2rem;padding-right:2rem}
  .lg\:flex-row{flex-direction:row}
  .lg\:flex-row-reverse{flex-direction:row-reverse}
  .lg\:w-1\/2{width:50%}
}