/*
 * Extra Tailwind-style utilities missing from the v3 style.css compile.
 * Loaded after style.css, before components.css.
 * Add new utility classes here instead of recompiling Tailwind.
 *
 * Format: use v3-compatible syntax (physical properties, fixed values).
 */

/* === Gradient variable init (v3-compatible, overrides v4 @property defaults) === */
*,::before,::after{--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-gradient-from:transparent;--tw-gradient-to:transparent}

/* === Colors & Backgrounds === */
.bg-dark-200\/95{background-color:rgba(18,18,20,0.95)}
.bg-dark-300\/80{background-color:rgba(31,41,55,0.8)}
.bg-dark-400{background-color:#374151}
.bg-white{background-color:#fff}
.bg-white\/5{background-color:rgba(255,255,255,0.05)}
.bg-white\/90{background-color:rgba(255,255,255,0.9)}
.text-\[\#0A66C2\]{color:#0A66C2}
.text-\[\#1877F2\]{color:#1877F2}
.text-blue-400{color:#0057a7}
.text-gray-600{color:#4b5563}
.text-gray-700{color:#374151}
.text-gray-900{color:#111827}
.text-light-100\/30{color:rgba(255,255,255,0.3)}
.text-yellow-600{color:#ca8a04}

/* === Borders === */
.border-blue-300\/30{border-color:rgba(0,133,255,0.3)}
.border-gray-300{border-color:#d1d5db}
.border-l-4{border-left-width:4px}

/* === Layout & Sizing === */
.col-span-full{grid-column:1/-1}
.gap-7{gap:1.75rem}
.grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.order-3{order:3}
.h-18{height:4.5rem}
.w-18{width:4.5rem}
.max-h-\[400px\]{max-height:400px}
.max-h-\[40vh\]{max-height:40vh}
.max-w-full{max-width:100%}
.max-w-xl{max-width:36rem}
.min-w-\[180px\]{min-width:180px}

/* === Spacing === */
.mt-16{margin-top:4rem}
.mx-1{margin-left:0.25rem;margin-right:0.25rem}
.my-6{margin-top:1.5rem;margin-bottom:1.5rem}
.p-1\.5{padding:0.375rem}
.pl-0{padding-left:0}
.py-2\.5{padding-top:0.625rem;padding-bottom:0.625rem}

/* === Typography === */
.italic{font-style:italic}
.text-6xl{font-size:3.75rem;line-height:1}

/* === Effects === */
.drop-shadow-md{filter:drop-shadow(0 4px 3px rgba(0,0,0,0.07)) drop-shadow(0 2px 2px rgba(0,0,0,0.06))}
.shadow-2xl{box-shadow:0 25px 50px -12px rgba(0,0,0,0.25)}

/* === Position === */
.top-\[70px\]{top:70px}
.z-40{z-index:40}
.z-\[9999\]{z-index:9999}

/* === Gradients (v3-compatible, overrides v4's broken variable chain) === */
.bg-gradient-to-b{background-image:linear-gradient(to bottom,var(--tw-gradient-stops))}
.bg-gradient-to-br{background-image:linear-gradient(to bottom right,var(--tw-gradient-stops))}
.bg-gradient-to-r{background-image:linear-gradient(to right,var(--tw-gradient-stops))}
.bg-gradient-to-tr{background-image:linear-gradient(to top right,var(--tw-gradient-stops))}
.from-dark-200\/80{--tw-gradient-from:rgba(18,18,20,.8) var(--tw-gradient-from-position);--tw-gradient-to:rgba(18,18,20,0) var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to)}
.via-dark-200\/70{--tw-gradient-to:rgba(18,18,20,0) var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from),rgba(18,18,20,.7) var(--tw-gradient-via-position),var(--tw-gradient-to)}
.to-dark-200{--tw-gradient-to:#121214 var(--tw-gradient-to-position)}
.from-blue-300\/10{--tw-gradient-from:rgba(0,133,255,0.1) var(--tw-gradient-from-position);--tw-gradient-to:rgba(0,133,255,0) var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to)}
.from-blue-500\/0{--tw-gradient-from:rgba(0,61,117,0) var(--tw-gradient-from-position);--tw-gradient-to:rgba(0,61,117,0) var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to)}
.to-blue-300\/5{--tw-gradient-to:rgba(0,133,255,0.05) var(--tw-gradient-to-position)}
.to-blue-500\/0{--tw-gradient-to:rgba(0,61,117,0) var(--tw-gradient-to-position)}
.via-blue-500\/20{--tw-gradient-to:rgba(0,61,117,0) var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from),rgba(0,61,117,0.2) var(--tw-gradient-via-position),var(--tw-gradient-to)}

/* === Space between children === */
.space-x-3>:not([hidden])~:not([hidden]){--tw-space-x-reverse:0;margin-right:calc(0.75rem*var(--tw-space-x-reverse));margin-left:calc(0.75rem*calc(1 - var(--tw-space-x-reverse)))}
.space-y-0\.5>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-top:calc(0.125rem*calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(0.125rem*var(--tw-space-y-reverse))}
.space-y-3>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-top:calc(0.75rem*calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(0.75rem*var(--tw-space-y-reverse))}

/* === Hover states === */
.hover\:bg-white\/10:hover{background-color:rgba(255,255,255,0.1)}
.hover\:bg-dark-300\/30:hover{background-color:rgba(31,41,55,0.3)}
.hover\:bg-dark-300\/50:hover{background-color:rgba(31,41,55,0.5)}
.hover\:bg-dark-300\/80:hover{background-color:rgba(31,41,55,0.8)}
.hover\:bg-dark-400:hover{background-color:#374151}
.hover\:bg-primary-dark:hover{background-color:#0057a7}
.hover\:opacity-80:hover{opacity:.8}
.hover\:text-primary-dark:hover{color:#0057a7}

/* === Responsive: md (768px) === */
@media(min-width:768px){
.md\:gap-2{gap:0.5rem}
.md\:gap-4{gap:1rem}
.md\:gap-8{gap:2rem}
.md\:gap-12{gap:3rem}
.md\:block{display:block}
.md\:h-auto{height:auto}
.md\:items-center{align-items:center}
.md\:items-start{align-items:flex-start}
.md\:justify-start{justify-content:flex-start}
.md\:mb-0{margin-bottom:0}
.md\:mb-3{margin-bottom:0.75rem}
.md\:mb-6{margin-bottom:1.5rem}
.md\:mb-8{margin-bottom:2rem}
.md\:mb-12{margin-bottom:3rem}
.md\:mt-12{margin-top:3rem}
.md\:mt-16{margin-top:4rem}
.md\:p-5{padding:1.25rem}
.md\:p-6{padding:1.5rem}
.md\:px-0{padding-left:0;padding-right:0}
.md\:px-6{padding-left:1.5rem;padding-right:1.5rem}
.md\:py-6{padding-top:1.5rem;padding-bottom:1.5rem}
.md\:py-16{padding-top:4rem;padding-bottom:4rem}
.md\:text-sm{font-size:0.875rem;line-height:1.25rem}
.md\:text-8xl{font-size:6rem;line-height:1}
.md\:text-base{font-size:1rem;line-height:1.5rem}
.md\:text-left{text-align:left}
.md\:w-1\/3{width:33.333333%}
.md\:w-2\/3{width:66.666667%}
.md\:w-2\/5{width:40%}
.md\:w-3\/5{width:60%}
.md\:w-64{width:16rem}
}

/* === Responsive: lg (1024px) === */
@media(min-width:1024px){
.lg\:block{display:block}
.lg\:hidden{display:none}
.lg\:text-4xl{font-size:2.25rem;line-height:2.5rem}
.lg\:w-1\/4{width:25%}
.lg\:w-3\/4{width:75%}
.lg\:w-80{width:20rem}
}

/* === Arbitrary value utilities === */
.max-h-\[250px\]{max-height:250px}

/* === Dark mode (prefers-color-scheme) === */
@media(prefers-color-scheme:dark){
.dark\:bg-gray-700{background-color:#374151}
.dark\:bg-gray-800{background-color:#1f2937}
.dark\:border-gray-600{border-color:#4b5563}
.dark\:text-gray-100{color:#f3f4f6}
.dark\:text-gray-300{color:#d1d5db}
.dark\:text-gray-400{color:#9ca3af}
.dark\:text-yellow-400{color:#facc15}
}