/* Reset and base */
* {margin:0;padding:0;box-sizing:border-box;}
body {font-family:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;background-color:#ffffff;color:#1f2937;line-height:1.5;}
img,video {display:block;max-width:100%;height:auto;}

/* Spacing & layout */
.p-2 {padding:.5rem;}
.p-4 {padding:1rem;}
.p-6 {padding:1.5rem;}
.p-12 {padding:3rem;}
.p-20 {padding:5rem;}
.px-2 {padding-left:.5rem;padding-right:.5rem;}
.px-4 {padding-left:1rem;padding-right:1rem;}
.px-6 {padding-left:1.5rem;padding-right:1.5rem;}
.px-20 {padding-left:5rem;padding-right:5rem;}
.py-2 {padding-top:.5rem;padding-bottom:.5rem;}
.py-4 {padding-top:1rem;padding-bottom:1rem;}
.py-6 {padding-top:1.5rem;padding-bottom:1.5rem;}
.py-12 {padding-top:3rem;padding-bottom:3rem;}
.py-20 {padding-top:5rem;padding-bottom:5rem;}
.mb-2 {margin-bottom:.5rem;}
.mb-4 {margin-bottom:1rem;}
.mb-6 {margin-bottom:1.5rem;}
.mb-12 {margin-bottom:3rem;}
.mt-2 {margin-top:.5rem;}
.space-y-4 > :not([hidden]) ~ :not([hidden]) {margin-top:1rem;}
.space-y-6 > :not([hidden]) ~ :not([hidden]) {margin-top:1.5rem;}
.space-x-4 > :not([hidden]) ~ :not([hidden]) {margin-left:1rem;}

/* Typography */
.text-2xl {font-size:1.5rem;line-height:2rem;}
.text-4xl {font-size:2.25rem;line-height:2.5rem;}
.text-center {text-align:center;}
.font-bold {font-weight:700;}
.text-gray-600 {color:#4b5563;}
.text-gray-300 {color:#d1d5db;}
.text-white {color:#ffffff;}

/* Backgrounds */
.bg-white {background-color:#ffffff;}
.bg-gray-800 {background-color:#1f2937;}
.bg-gray-900 {background-color:#111827;}
.bg-gray-100 {background-color:#f3f4f6;}
.bg-green-700 {background-color:#047857;}
.bg-opacity-80 {background-color:rgba(255,255,255,.8);}
.hover\:bg-opacity-100:hover {background-color:rgba(255,255,255,1);}
.hover\:text-white:hover {color:#ffffff;}

/* Borders & rounding */
.border {border-width:1px;border-color:#d1d5db;border-style:solid;}
.rounded {border-radius:.25rem;}
.rounded-lg {border-radius:.5rem;}

/* Shadows */
.shadow {box-shadow:0 1px 2px 0 rgba(0,0,0,0.05);}
.shadow-md {box-shadow:0 4px 6px -1px rgba(0,0,0,0.1),0 2px 4px -2px rgba(0,0,0,0.1);}

/* Flex & grid */
.flex {display:flex;}
.items-center {align-items:center;}
.justify-center {justify-content:center;}
.grid {display:grid;}
.md\:grid-cols-2 {grid-template-columns:repeat(2,minmax(0,1fr));}
.md\:flex {display:flex;}
.overflow-auto {overflow:auto;}

/* Width & height */
.w-full {width:100%;}
.w-6 {width:1.5rem;}
.w-12 {width:3rem;}
.h-6 {height:1.5rem;}
.h-12 {height:3rem;}
.min-h-200px {min-height:200px;}

/* Position & transform */
.absolute {position:absolute;}
.relative {position:relative;}
.left-2 {left:.5rem;}
.right-2 {right:.5rem;}
.top-1\/2 {top:50%;}
.-translate-y-1\/2 {transform:translateY(-50%);}

/* Forms */
input,textarea,select,button {font-family:inherit;font-size:1rem;}
input,textarea {outline:none;}
input[type=text],input[type=email],textarea {width:100%;padding:.5rem 1rem;border:1px solid #d1d5db;border-radius:.25rem;}
textarea {resize:vertical;min-height:120px;}
button {cursor:pointer;border:none;}

/* Accessibility & hidden */
.hidden {display:none !important;}
[aria-hidden="true"] {display:none !important;}

/* Responsive (md = 768px) */
@media (min-width:768px){
  .md\:flex {display:flex !important;}
  .md\:grid-cols-2 {grid-template-columns:repeat(2,minmax(0,1fr)) !important;}
  .md\:px-20 {padding-left:5rem !important;padding-right:5rem !important;}
}
