/* Minification failed. Returning unminified contents. (15,22): run-time error CSS1039: Token not allowed after unary operator: '-primary-white' (36,22): run-time error CSS1039: Token not allowed after unary operator: '-primary-black' (66,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (67,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (68,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (69,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (70,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (71,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (72,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (73,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (74,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (75,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (76,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (77,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (78,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (79,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (80,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (81,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (82,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (83,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (84,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (85,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (86,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (92,17): run-time error CSS1039: Token not allowed after unary operator: '-gray-900' (93,28): run-time error CSS1039: Token not allowed after unary operator: '-primary-white' (133,17): run-time error CSS1039: Token not allowed after unary operator: '-gray-700' (149,25): run-time error CSS1039: Token not allowed after unary operator: '-border-radius' (151,26): run-time error CSS1039: Token not allowed after unary operator: '-transition-normal' (161,22): run-time error CSS1039: Token not allowed after unary operator: '-primary-black' (162,17): run-time error CSS1039: Token not allowed after unary operator: '-primary-white' (163,28): run-time error CSS1039: Token not allowed after unary operator: '-primary-black' (175,49): run-time error CSS1039: Token not allowed after unary operator: '-gray-800' (175,66): run-time error CSS1039: Token not allowed after unary operator: '-primary-black' (178,34): run-time error CSS1039: Token not allowed after unary operator: '-transition-normal' (193,17): run-time error CSS1039: Token not allowed after unary operator: '-primary-black' (194,28): run-time error CSS1039: Token not allowed after unary operator: '-primary-black' (198,26): run-time error CSS1039: Token not allowed after unary operator: '-primary-black' (199,21): run-time error CSS1039: Token not allowed after unary operator: '-primary-white' (201,26): run-time error CSS1039: Token not allowed after unary operator: '-shadow-lg' (206,17): run-time error CSS1039: Token not allowed after unary operator: '-primary-white' (207,28): run-time error CSS1039: Token not allowed after unary operator: '-primary-white' (211,26): run-time error CSS1039: Token not allowed after unary operator: '-primary-white' (212,21): run-time error CSS1039: Token not allowed after unary operator: '-primary-black' (230,26): run-time error CSS1039: Token not allowed after unary operator: '-transition-normal' (236,26): run-time error CSS1039: Token not allowed after unary operator: '-shadow-md' (237,39): run-time error CSS1039: Token not allowed after unary operator: '-gray-200' (253,17): run-time error CSS1039: Token not allowed after unary operator: '-primary-black' (257,46): run-time error CSS1039: Token not allowed after unary operator: '-primary-black' (257,71): run-time error CSS1039: Token not allowed after unary operator: '-gray-600' (282,22): run-time error CSS1039: Token not allowed after unary operator: '-transition' (313,17): run-time error CSS1039: Token not allowed after unary operator: '-gray-700' (317,26): run-time error CSS1039: Token not allowed after unary operator: '-transition-fast' (331,26): run-time error CSS1039: Token not allowed after unary operator: '-primary-black' (332,32): run-time error CSS1039: Token not allowed after unary operator: '-transition-fast' (343,21): run-time error CSS1039: Token not allowed after unary operator: '-primary-black' (368,26): run-time error CSS1039: Token not allowed after unary operator: '-primary-black' (369,30): run-time error CSS1039: Token not allowed after unary operator: '-transition-fast' (397,26): run-time error CSS1039: Token not allowed after unary operator: '-transition-normal' (403,22): run-time error CSS1039: Token not allowed after unary operator: '-shadow-md' (404,35): run-time error CSS1039: Token not allowed after unary operator: '-gray-200' (420,26): run-time error CSS1039: Token not allowed after unary operator: '-transition-fast' (430,21): run-time error CSS1039: Token not allowed after unary operator: '-primary-black' (436,21): run-time error CSS1039: Token not allowed after unary operator: '-gray-600' (472,38): run-time error CSS1039: Token not allowed after unary operator: '-gray-300' (491,37): run-time error CSS1039: Token not allowed after unary operator: '-gray-300' (507,21): run-time error CSS1039: Token not allowed after unary operator: '-primary-black' (520,30): run-time error CSS1039: Token not allowed after unary operator: '-primary-black' (525,21): run-time error CSS1039: Token not allowed after unary operator: '-primary-black' (545,26): run-time error CSS1039: Token not allowed after unary operator: '-primary-black' (546,30): run-time error CSS1039: Token not allowed after unary operator: '-transition-fast' (569,22): run-time error CSS1039: Token not allowed after unary operator: '-primary-white' (570,22): run-time error CSS1039: Token not allowed after unary operator: '-shadow-lg' (585,35): run-time error CSS1039: Token not allowed after unary operator: '-gray-200' (596,21): run-time error CSS1039: Token not allowed after unary operator: '-gray-600' (614,21): run-time error CSS1039: Token not allowed after unary operator: '-gray-700' (616,29): run-time error CSS1039: Token not allowed after unary operator: '-border-radius' (617,30): run-time error CSS1039: Token not allowed after unary operator: '-transition-fast' (621,30): run-time error CSS1039: Token not allowed after unary operator: '-gray-100' (622,25): run-time error CSS1039: Token not allowed after unary operator: '-primary-black' (626,30): run-time error CSS1039: Token not allowed after unary operator: '-primary-black' (627,25): run-time error CSS1039: Token not allowed after unary operator: '-primary-white' (645,21): run-time error CSS1039: Token not allowed after unary operator: '-gray-700' (649,26): run-time error CSS1039: Token not allowed after unary operator: '-primary-black' (650,21): run-time error CSS1039: Token not allowed after unary operator: '-primary-white' (663,21): run-time error CSS1039: Token not allowed after unary operator: '-gray-700' (698,28): run-time error CSS1039: Token not allowed after unary operator: '-primary-black' (699,17): run-time error CSS1039: Token not allowed after unary operator: '-primary-black' (701,25): run-time error CSS1039: Token not allowed after unary operator: '-border-radius' (703,26): run-time error CSS1039: Token not allowed after unary operator: '-transition-fast' (711,26): run-time error CSS1039: Token not allowed after unary operator: '-primary-black' (712,21): run-time error CSS1039: Token not allowed after unary operator: '-primary-white' (714,26): run-time error CSS1039: Token not allowed after unary operator: '-shadow-md' (719,22): run-time error CSS1039: Token not allowed after unary operator: '-primary-black' (720,17): run-time error CSS1039: Token not allowed after unary operator: '-primary-white' (721,28): run-time error CSS1039: Token not allowed after unary operator: '-primary-black' (722,25): run-time error CSS1039: Token not allowed after unary operator: '-border-radius' (724,26): run-time error CSS1039: Token not allowed after unary operator: '-transition-fast' (732,26): run-time error CSS1039: Token not allowed after unary operator: '-gray-800' (733,28): run-time error CSS1039: Token not allowed after unary operator: '-gray-800' (735,26): run-time error CSS1039: Token not allowed after unary operator: '-shadow-md' (736,21): run-time error CSS1039: Token not allowed after unary operator: '-primary-white' (741,22): run-time error CSS1039: Token not allowed after unary operator: '-gray-100' (743,25): run-time error CSS1039: Token not allowed after unary operator: '-border-radius' (752,21): run-time error CSS1039: Token not allowed after unary operator: '-primary-black' (784,25): run-time error CSS1039: Token not allowed after unary operator: '-border-radius' (920,46): run-time error CSS1039: Token not allowed after unary operator: '-primary-white' (920,71): run-time error CSS1039: Token not allowed after unary operator: '-gray-100' (938,45): run-time error CSS1039: Token not allowed after unary operator: '-primary-black' (954,22): run-time error CSS1039: Token not allowed after unary operator: '-primary-black' (963,22): run-time error CSS1039: Token not allowed after unary operator: '-gray-800' (972,22): run-time error CSS1039: Token not allowed after unary operator: '-gray-600' (1008,22): run-time error CSS1039: Token not allowed after unary operator: '-primary-black' (1009,17): run-time error CSS1039: Token not allowed after unary operator: '-primary-white' (1014,25): run-time error CSS1039: Token not allowed after unary operator: '-border-radius' (1025,46): run-time error CSS1039: Token not allowed after unary operator: '-primary-black' (1025,71): run-time error CSS1039: Token not allowed after unary operator: '-gray-600' (1033,17): run-time error CSS1039: Token not allowed after unary operator: '-gray-600' (1060,17): run-time error CSS1039: Token not allowed after unary operator: '-primary-black' (1065,17): run-time error CSS1039: Token not allowed after unary operator: '-gray-600' (1087,28): run-time error CSS1039: Token not allowed after unary operator: '-gray-300' (1124,22): run-time error CSS1039: Token not allowed after unary operator: '-primary-black' (1125,25): run-time error CSS1039: Token not allowed after unary operator: '-border-radius-lg' (1129,17): run-time error CSS1039: Token not allowed after unary operator: '-primary-white' (1131,22): run-time error CSS1039: Token not allowed after unary operator: '-shadow-xl' (1140,22): run-time error CSS1039: Token not allowed after unary operator: '-primary-white' (1149,28): run-time error CSS1039: Token not allowed after unary operator: '-gray-200' (1156,21): run-time error CSS1039: Token not allowed after unary operator: '-primary-black' (1196,17): run-time error CSS1039: Token not allowed after unary operator: '-gray-600' (1213,22): run-time error CSS1039: Token not allowed after unary operator: '-primary-white' (1224,22): run-time error CSS1039: Token not allowed after unary operator: '-gray-100' (1225,17): run-time error CSS1039: Token not allowed after unary operator: '-primary-black' (1230,25): run-time error CSS1039: Token not allowed after unary operator: '-border-radius' (1248,26): run-time error CSS1039: Token not allowed after unary operator: '-primary-black' (1254,17): run-time error CSS1039: Token not allowed after unary operator: '-gray-600' (1266,22): run-time error CSS1039: Token not allowed after unary operator: '-primary-white' (1268,25): run-time error CSS1039: Token not allowed after unary operator: '-border-radius-lg' (1269,28): run-time error CSS1039: Token not allowed after unary operator: '-gray-200' (1270,26): run-time error CSS1039: Token not allowed after unary operator: '-transition-normal' (1283,49): run-time error CSS1039: Token not allowed after unary operator: '-primary-black' (1283,71): run-time error CSS1039: Token not allowed after unary operator: '-gray-600' (1285,36): run-time error CSS1039: Token not allowed after unary operator: '-transition-normal' (1294,26): run-time error CSS1039: Token not allowed after unary operator: '-shadow-xl' (1295,28): run-time error CSS1039: Token not allowed after unary operator: '-primary-black' (1299,28): run-time error CSS1039: Token not allowed after unary operator: '-primary-black' (1300,26): run-time error CSS1039: Token not allowed after unary operator: '-gray-100' (1308,22): run-time error CSS1039: Token not allowed after unary operator: '-primary-black' (1309,17): run-time error CSS1039: Token not allowed after unary operator: '-primary-white' (1312,25): run-time error CSS1039: Token not allowed after unary operator: '-border-radius' (1318,22): run-time error CSS1039: Token not allowed after unary operator: '-primary-black' (1319,17): run-time error CSS1039: Token not allowed after unary operator: '-primary-white' (1324,25): run-time error CSS1039: Token not allowed after unary operator: '-border-radius' (1326,26): run-time error CSS1039: Token not allowed after unary operator: '-transition-normal' (1344,21): run-time error CSS1039: Token not allowed after unary operator: '-gray-600' (1351,21): run-time error CSS1039: Token not allowed after unary operator: '-primary-black' (1356,17): run-time error CSS1039: Token not allowed after unary operator: '-primary-black' (1362,26): run-time error CSS1039: Token not allowed after unary operator: '-transition-fast' (1372,22): run-time error CSS1039: Token not allowed after unary operator: '-gray-100' (1404,26): run-time error CSS1039: Token not allowed after unary operator: '-primary-black' (1405,21): run-time error CSS1039: Token not allowed after unary operator: '-primary-white' (1409,29): run-time error CSS1039: Token not allowed after unary operator: '-border-radius' (1418,21): run-time error CSS1039: Token not allowed after unary operator: '-gray-600' (1428,25): run-time error CSS1039: Token not allowed after unary operator: '-border-radius-lg' (1435,46): run-time error CSS1039: Token not allowed after unary operator: '-primary-black' (1435,71): run-time error CSS1039: Token not allowed after unary operator: '-gray-800' (1439,17): run-time error CSS1039: Token not allowed after unary operator: '-primary-white' (1441,25): run-time error CSS1039: Token not allowed after unary operator: '-border-radius-lg' (1446,22): run-time error CSS1039: Token not allowed after unary operator: '-primary-white' (1448,25): run-time error CSS1039: Token not allowed after unary operator: '-border-radius' (1449,22): run-time error CSS1039: Token not allowed after unary operator: '-shadow-lg' (1458,17): run-time error CSS1039: Token not allowed after unary operator: '-primary-black' (1463,17): run-time error CSS1039: Token not allowed after unary operator: '-gray-600' (1479,22): run-time error CSS1039: Token not allowed after unary operator: '-primary-white' (1493,28): run-time error CSS1039: Token not allowed after unary operator: '-gray-300' (1494,25): run-time error CSS1039: Token not allowed after unary operator: '-border-radius' (1497,26): run-time error CSS1039: Token not allowed after unary operator: '-transition-fast' (1502,26): run-time error CSS1039: Token not allowed after unary operator: '-primary-black' (1503,21): run-time error CSS1039: Token not allowed after unary operator: '-primary-white' (1504,28): run-time error CSS1039: Token not allowed after unary operator: '-primary-black' (1515,25): run-time error CSS1039: Token not allowed after unary operator: '-border-radius-lg' (1518,26): run-time error CSS1039: Token not allowed after unary operator: '-transition-normal' (1519,22): run-time error CSS1039: Token not allowed after unary operator: '-primary-white' (1520,28): run-time error CSS1039: Token not allowed after unary operator: '-gray-200' (1543,26): run-time error CSS1039: Token not allowed after unary operator: '-shadow-xl' (1555,36): run-time error CSS1039: Token not allowed after unary operator: '-transition-normal' (1575,30): run-time error CSS1039: Token not allowed after unary operator: '-transition-normal' (1584,17): run-time error CSS1039: Token not allowed after unary operator: '-primary-white' (1589,17): run-time error CSS1039: Token not allowed after unary operator: '-gray-400' (1604,21): run-time error CSS1039: Token not allowed after unary operator: '-primary-white' (1606,29): run-time error CSS1039: Token not allowed after unary operator: '-border-radius' (1612,22): run-time error CSS1039: Token not allowed after unary operator: '-gray-100' (1633,22): run-time error CSS1039: Token not allowed after unary operator: '-primary-white' (1635,25): run-time error CSS1039: Token not allowed after unary operator: '-border-radius' (1641,26): run-time error CSS1039: Token not allowed after unary operator: '-transition-normal' (1647,26): run-time error CSS1039: Token not allowed after unary operator: '-shadow-lg' (1648,28): run-time error CSS1039: Token not allowed after unary operator: '-primary-black' (1653,21): run-time error CSS1039: Token not allowed after unary operator: '-primary-black' (1658,21): run-time error CSS1039: Token not allowed after unary operator: '-gray-700' (1664,46): run-time error CSS1039: Token not allowed after unary operator: '-primary-black' (1664,71): run-time error CSS1039: Token not allowed after unary operator: '-gray-800' (1665,17): run-time error CSS1039: Token not allowed after unary operator: '-primary-white' (1670,17): run-time error CSS1039: Token not allowed after unary operator: '-primary-white' (1675,17): run-time error CSS1039: Token not allowed after unary operator: '-gray-300' (1690,22): run-time error CSS1039: Token not allowed after unary operator: '-primary-white' (1706,22): run-time error CSS1039: Token not allowed after unary operator: '-gray-100' (1708,25): run-time error CSS1039: Token not allowed after unary operator: '-border-radius-lg' (1710,26): run-time error CSS1039: Token not allowed after unary operator: '-transition-normal' (1715,26): run-time error CSS1039: Token not allowed after unary operator: '-shadow-lg' (1721,26): run-time error CSS1039: Token not allowed after unary operator: '-primary-black' (1722,21): run-time error CSS1039: Token not allowed after unary operator: '-primary-white' (1727,29): run-time error CSS1039: Token not allowed after unary operator: '-border-radius' (1736,21): run-time error CSS1039: Token not allowed after unary operator: '-gray-600' (1741,22): run-time error CSS1039: Token not allowed after unary operator: '-gray-100' (1743,25): run-time error CSS1039: Token not allowed after unary operator: '-border-radius-lg' (1758,28): run-time error CSS1039: Token not allowed after unary operator: '-gray-300' (1759,25): run-time error CSS1039: Token not allowed after unary operator: '-border-radius' (1762,26): run-time error CSS1039: Token not allowed after unary operator: '-transition-fast' (1763,22): run-time error CSS1039: Token not allowed after unary operator: '-primary-white' (1770,24): run-time error CSS1039: Token not allowed after unary operator: '-primary-black' (1779,22): run-time error CSS1039: Token not allowed after unary operator: '-primary-black' (1780,17): run-time error CSS1039: Token not allowed after unary operator: '-primary-white' (1799,17): run-time error CSS1039: Token not allowed after unary operator: '-primary-white' (1803,17): run-time error CSS1039: Token not allowed after unary operator: '-gray-400' (1815,25): run-time error CSS1039: Token not allowed after unary operator: '-gray-400' (1817,36): run-time error CSS1039: Token not allowed after unary operator: '-transition-fast' (1821,29): run-time error CSS1039: Token not allowed after unary operator: '-primary-white' (1834,21): run-time error CSS1039: Token not allowed after unary operator: '-primary-white' (1838,29): run-time error CSS1039: Token not allowed after unary operator: '-border-radius' (1839,30): run-time error CSS1039: Token not allowed after unary operator: '-transition-fast' (1843,30): run-time error CSS1039: Token not allowed after unary operator: '-primary-white' (1844,25): run-time error CSS1039: Token not allowed after unary operator: '-primary-black' (1858,29): run-time error CSS1039: Token not allowed after unary operator: '-border-radius' (1860,21): run-time error CSS1039: Token not allowed after unary operator: '-primary-white' (1864,25): run-time error CSS1039: Token not allowed after unary operator: '-gray-500' (1878,21): run-time error CSS1039: Token not allowed after unary operator: '-gray-400' (1888,21): run-time error CSS1039: Token not allowed after unary operator: '-gray-400' (1890,32): run-time error CSS1039: Token not allowed after unary operator: '-transition-fast' (1894,25): run-time error CSS1039: Token not allowed after unary operator: '-primary-white' (1902,22): run-time error CSS1039: Token not allowed after unary operator: '-primary-black' (1903,17): run-time error CSS1039: Token not allowed after unary operator: '-primary-white' (1906,22): run-time error CSS1039: Token not allowed after unary operator: '-shadow-xl' (1909,26): run-time error CSS1039: Token not allowed after unary operator: '-transition-normal' (1942,22): run-time error CSS1039: Token not allowed after unary operator: '-gray-800' (1943,17): run-time error CSS1039: Token not allowed after unary operator: '-primary-white' (1945,25): run-time error CSS1039: Token not allowed after unary operator: '-border-radius' (1950,30): run-time error CSS1039: Token not allowed after unary operator: '-transition-fast' (1963,28): run-time error CSS1039: Token not allowed after unary operator: '-gray-800' (1973,22): run-time error CSS1039: Token not allowed after unary operator: '-primary-black' (1974,17): run-time error CSS1039: Token not allowed after unary operator: '-primary-white' (1976,25): run-time error CSS1039: Token not allowed after unary operator: '-border-radius' (1983,26): run-time error CSS1039: Token not allowed after unary operator: '-transition-normal' (1993,26): run-time error CSS1039: Token not allowed after unary operator: '-gray-800' (2037,25): run-time error CSS1039: Token not allowed after unary operator: '-border-radius-lg' (2038,28): run-time error CSS1039: Token not allowed after unary operator: '-gray-200' (2045,21): run-time error CSS1039: Token not allowed after unary operator: '-gray-800' (2054,25): run-time error CSS1039: Token not allowed after unary operator: '-primary-black' (2065,22): run-time error CSS1039: Token not allowed after unary operator: '-primary-white' (2066,28): run-time error CSS1039: Token not allowed after unary operator: '-gray-300' (2067,25): run-time error CSS1039: Token not allowed after unary operator: '-border-radius' (2069,26): run-time error CSS1039: Token not allowed after unary operator: '-transition-normal' (2085,26): run-time error CSS1039: Token not allowed after unary operator: '-primary-black' (2087,36): run-time error CSS1039: Token not allowed after unary operator: '-transition-normal' (2092,26): run-time error CSS1039: Token not allowed after unary operator: '-shadow-md' (2093,28): run-time error CSS1039: Token not allowed after unary operator: '-gray-600' (2101,26): run-time error CSS1039: Token not allowed after unary operator: '-primary-black' (2102,21): run-time error CSS1039: Token not allowed after unary operator: '-primary-white' (2103,28): run-time error CSS1039: Token not allowed after unary operator: '-primary-black' (2125,17): run-time error CSS1039: Token not allowed after unary operator: '-primary-white' (2129,17): run-time error CSS1039: Token not allowed after unary operator: '-gray-300' (2135,17): run-time error CSS1039: Token not allowed after unary operator: '-primary-black' (2140,17): run-time error CSS1039: Token not allowed after unary operator: '-gray-600' (2148,46): run-time error CSS1039: Token not allowed after unary operator: '-gray-100' (2148,66): run-time error CSS1039: Token not allowed after unary operator: '-primary-white' (2149,25): run-time error CSS1039: Token not allowed after unary operator: '-border-radius-lg' (2150,28): run-time error CSS1039: Token not allowed after unary operator: '-gray-200' (2156,22): run-time error CSS1039: Token not allowed after unary operator: '-shadow-sm' (2164,17): run-time error CSS1039: Token not allowed after unary operator: '-gray-800' (2169,21): run-time error CSS1039: Token not allowed after unary operator: '-primary-black' (2174,22): run-time error CSS1039: Token not allowed after unary operator: '-primary-black' (2175,17): run-time error CSS1039: Token not allowed after unary operator: '-primary-white' (2176,25): run-time error CSS1039: Token not allowed after unary operator: '-border-radius' (2188,28): run-time error CSS1039: Token not allowed after unary operator: '-gray-300' (2189,25): run-time error CSS1039: Token not allowed after unary operator: '-border-radius' (2190,22): run-time error CSS1039: Token not allowed after unary operator: '-primary-white' (2194,26): run-time error CSS1039: Token not allowed after unary operator: '-transition-fast' (2200,28): run-time error CSS1039: Token not allowed after unary operator: '-primary-black' (2206,22): run-time error CSS1039: Token not allowed after unary operator: '-primary-black' (2207,17): run-time error CSS1039: Token not allowed after unary operator: '-primary-white' (2209,25): run-time error CSS1039: Token not allowed after unary operator: '-border-radius' (2212,26): run-time error CSS1039: Token not allowed after unary operator: '-transition-normal' (2219,26): run-time error CSS1039: Token not allowed after unary operator: '-gray-800' (2221,26): run-time error CSS1039: Token not allowed after unary operator: '-shadow-md' (2225,36): run-time error CSS1039: Token not allowed after unary operator: '-transition-normal' (2261,17): run-time error CSS1039: Token not allowed after unary operator: '-primary-white' (2273,21): run-time error CSS1039: Token not allowed after unary operator: '-primary-white' (2278,17): run-time error CSS1039: Token not allowed after unary operator: '-primary-white' (2284,17): run-time error CSS1039: Token not allowed after unary operator: '-gray-400' (2299,45): run-time error CSS1039: Token not allowed after unary operator: '-primary-white' (2299,70): run-time error CSS1039: Token not allowed after unary operator: '-gray-400' (2348,22): run-time error CSS1039: Token not allowed after unary operator: '-primary-black' (2349,17): run-time error CSS1039: Token not allowed after unary operator: '-primary-white' (2350,25): run-time error CSS1039: Token not allowed after unary operator: '-border-radius' (2351,22): run-time error CSS1039: Token not allowed after unary operator: '-shadow-xl' (2377,17): run-time error CSS1039: Token not allowed after unary operator: '-gray-300' (2438,26): run-time error CSS1039: Token not allowed after unary operator: '-primary-white' (2441,26): run-time error CSS1039: Token not allowed after unary operator: '-shadow-lg' (2627,25): run-time error CSS1039: Token not allowed after unary operator: '-border-radius' (2628,28): run-time error CSS1039: Token not allowed after unary operator: '-primary-black' (2662,24): run-time error CSS1039: Token not allowed after unary operator: '-primary-black' (3146,16): run-time error CSS1030: Expected identifier, found '.' (3146,35): run-time error CSS1031: Expected selector, found ')' (3146,35): run-time error CSS1025: Expected comma or open brace, found ')' (3154,10): run-time error CSS1030: Expected identifier, found '.' (3154,29): run-time error CSS1031: Expected selector, found ')' (3154,29): run-time error CSS1025: Expected comma or open brace, found ')' (3162,16): run-time error CSS1030: Expected identifier, found '.' (3162,35): run-time error CSS1031: Expected selector, found ')' (3162,35): run-time error CSS1025: Expected comma or open brace, found ')' (3168,10): run-time error CSS1030: Expected identifier, found '.' (3168,29): run-time error CSS1031: Expected selector, found ')' (3168,29): run-time error CSS1025: Expected comma or open brace, found ')' */ /* Reset and Base Styles */ * { margin: 0; padding: 0; box-sizing: border-box; } /* Preloader */ .preloader { position: fixed; top: 0; left: 0; right: 0; bottom: 0; background: var(--primary-white); z-index: 9999; display: flex; justify-content: center; align-items: center; transition: opacity 0.5s, visibility 0.5s; } .preloader.hidden { opacity: 0; visibility: hidden; } .loader { display: flex; gap: 10px; } .loader-circle { width: 15px; height: 15px; background: var(--primary-black); border-radius: 50%; animation: loaderPulse 1.5s infinite ease-in-out; } .loader-circle:nth-child(1) { animation-delay: 0s; } .loader-circle:nth-child(2) { animation-delay: 0.2s; } .loader-circle:nth-child(3) { animation-delay: 0.4s; } @keyframes loaderPulse { 0%, 80%, 100% { transform: scale(1); opacity: 1; } 40% { transform: scale(1.3); opacity: 0.5; } } :root { --primary-black: #000000; --primary-white: #ffffff; --gray-100: #f8f9fa; --gray-200: #e9ecef; --gray-300: #dee2e6; --gray-400: #ced4da; --gray-500: #adb5bd; --gray-600: #6c757d; --gray-700: #495057; --gray-800: #343a40; --gray-900: #212529; --shadow-sm: 0 2px 4px rgba(0, 0, 0, 0.1); --shadow-md: 0 4px 8px rgba(0, 0, 0, 0.15); --shadow-lg: 0 8px 16px rgba(0, 0, 0, 0.2); --shadow-xl: 0 16px 32px rgba(0, 0, 0, 0.25); --transition-fast: 0.2s cubic-bezier(0.4, 0, 0.2, 1); --transition-normal: 0.3s cubic-bezier(0.4, 0, 0.2, 1); --transition-slow: 0.5s cubic-bezier(0.4, 0, 0.2, 1); --border-radius: 8px; --border-radius-lg: 16px; --border-radius-xl: 24px; } body { font-family: 'Inter', sans-serif; line-height: 1.6; color: var(--gray-900); background-color: var(--primary-white); overflow-x: hidden; } html { scroll-behavior: smooth; } .container-home { max-width: 1400px; margin: 0 auto; padding: 0 20px; } /* Typography */ h1, h2, h3, h4, h5, h6 { font-weight: 700; line-height: 1.2; margin-bottom: 1rem; letter-spacing: -0.02em; } h1 { font-size: clamp(2.5rem, 5vw, 4rem); } h2 { font-size: clamp(2rem, 4vw, 3rem); } h3 { font-size: clamp(1.5rem, 3vw, 2rem); } h4 { font-size: clamp(1.2rem, 2.5vw, 1.5rem); } p { margin-bottom: 1rem; color: var(--gray-700); font-size: 1rem; line-height: 1.8; } .label-info{ background-color:black; color:white; } /* Buttons */ .btn-primary, .btn-outline, .btn-outline-white { padding: 12px 24px; font-size: 16px; font-weight: 600; border: none; border-radius: var(--border-radius); cursor: pointer; transition: all var(--transition-normal); display: inline-flex; align-items: center; gap: 8px; text-decoration: none; position: relative; overflow: hidden; } .btn-primary { background: var(--primary-black) !important; color: var(--primary-white) !important; border: 2px solid var(--primary-black) !important; position: relative; z-index: 1; } .btn-primary::before { content: ''; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: linear-gradient(45deg, var(--gray-800), var(--primary-black)); z-index: -1; opacity: 0; transition: opacity var(--transition-normal); border-radius: inherit; } .btn-primary:hover { transform: translateY(-2px); box-shadow: 0 10px 25px rgba(0, 0, 0, 0.2); } .btn-primary:hover::before { opacity: 1; } .btn-outline { background: transparent; color: var(--primary-black); border: 2px solid var(--primary-black); } .btn-outline:hover { background: var(--primary-black); color: var(--primary-white); transform: translateY(-2px); box-shadow: var(--shadow-lg); } .btn-outline-white { background: transparent; color: var(--primary-white); border: 2px solid var(--primary-white); } .btn-outline-white:hover { background: var(--primary-white); color: var(--primary-black); transform: translateY(-2px); } .btn-large { padding: 16px 32px; font-size: 18px; } /* Navigation */ .navbar { position: fixed; top: 0; width: 100%; background: rgba(255, 255, 255, 0.98); backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px); z-index: 1000; transition: all var(--transition-normal); border-bottom: 1px solid rgba(0, 0, 0, 0.05); } .navbar.scrolled { background: rgba(255, 255, 255, 0.98); box-shadow: var(--shadow-md); border-bottom: 1px solid var(--gray-200); } .nav-content { display: flex; justify-content: space-between; align-items: center; padding: 1rem 0; } .logo { font-size: 1.5rem; font-weight: 900; } .logo-text { color: var(--primary-black); } .logo-accent { background: linear-gradient(135deg, var(--primary-black) 0%, var(--gray-600) 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; } /* Logo Styles */ .logo-text-container { display: flex; align-items: center; } .logo-text-main { font-size: 32px; font-weight: 900; color: #000000; letter-spacing: -1px; line-height: 1; } /* Logo Image Styles (for footer) */ .logo-image { height: 45px; width: auto; object-fit: contain; transition: var(--transition); /* Convert any color image to pure black */ filter: brightness(0) saturate(100%) invert(0); -webkit-filter: brightness(0) saturate(100%) invert(0); } .logo-image:hover { transform: scale(1.05); filter: brightness(0) saturate(100%) invert(0); -webkit-filter: brightness(0) saturate(100%) invert(0); } /* Footer logo specific */ .footer-logo-img { height: 40px; filter: brightness(0) invert(1); opacity: 0.9; } .footer-logo-img:hover { opacity: 1; transform: scale(1.05); } .nav-menu { display: flex; list-style: none; gap: 2rem; } .nav-link { color: var(--gray-700); text-decoration: none; font-weight: 500; font-size: 0.95rem !important; transition: all var(--transition-fast); position: relative; white-space: nowrap; padding: 0.5rem 0; text-decoration: none; } .nav-link:after { content: ''; position: absolute; bottom: -5px; left: 0; width: 0; height: 2px; background: var(--primary-black); transition: width var(--transition-fast); } .nav-link:hover:after, .nav-link.active:after { width: 100%; text-decoration: none; } .nav-link:hover, .nav-link.active { color: var(--primary-black); text-decoration: none; } .nav-actions { display: flex; align-items: center; gap: 1rem; } .menu-toggle { display: none; flex-direction: column; justify-content: space-between; width: 30px; height: 22px; background: transparent; border: none; cursor: pointer; padding: 0; } .menu-toggle span { width: 100%; height: 3px; background: var(--primary-black); transition: all var(--transition-fast); border-radius: 2px; } .menu-toggle.active span:nth-child(1) { transform: translateY(9.5px) rotate(45deg); } .menu-toggle.active span:nth-child(2) { opacity: 0; } .menu-toggle.active span:nth-child(3) { transform: translateY(-9.5px) rotate(-45deg); } /* =================================== MODERN NAVBAR SPECIFIC STYLES =================================== */ .navbar-modern { position: fixed; top: 0; width: 100%; background: rgba(255, 255, 255, 0.98); backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px); z-index: 1000; transition: all var(--transition-normal); border-bottom: 1px solid rgba(0, 0, 0, 0.05); } .navbar-modern.scrolled { background: rgba(255, 255, 255, 0.98); box-shadow: var(--shadow-md); border-bottom: 1px solid var(--gray-200); } .navbar-content { display: flex; justify-content: space-between; align-items: center; padding: 1rem 0; position: relative; gap: 2rem; } .navbar-logo { display: flex; flex-direction: column; text-decoration: none; transition: all var(--transition-fast); } .navbar-logo:hover { transform: scale(1.02); } .navbar-logo .logo-text { font-size: 1.5rem; font-weight: 900; color: var(--primary-black); line-height: 1; } .navbar-logo .logo-tagline { font-size: 0.7rem; color: var(--gray-600); font-weight: 500; margin-top: 2px; } .navbar-menu { display: flex; align-items: center; flex: 1; list-style: none; margin: 0; padding: 0; /*gap: 3rem;*/ } .desktop-menu { display: flex; align-items: center; width: 100%; justify-content: space-between; } /* Navbar Groups - Organized Layout */ .navbar-group { display: flex; align-items: center; gap: 1.5rem; } .navbar-group-left { /* Environment + Admin - la stânga */ justify-content: flex-start; padding-right: 2rem; } .navbar-group-left:not(:empty) { border-right: 1px solid var(--gray-300); } .navbar-group-center { /* Homepage navigation - centru */ justify-content: center; flex: 1; gap: 2rem; padding: 0 2rem; } .navbar-group-right { /* Module + User - la dreapta */ justify-content: flex-end; gap: 1rem; padding-left: 2rem; } .navbar-group-right:not(:empty) { border-left: 1px solid var(--gray-300); } .nav-item { position: relative; text-decoration: none; } .nav-item.dropdown .nav-link { display: flex; align-items: center; gap: 0.5rem; text-decoration: none; } .nav-item .nav-link.active { color: var(--primary-black); font-weight: 700; position: relative; text-decoration: none; } .nav-item .nav-link.active::after { content: ''; position: absolute; bottom: -8px; left: 0; right: 0; height: 3px; background: var(--primary-black); border-radius: 3px; } .nav-item .nav-link:hover { color: var(--primary-black); } /* Mobile Menu Toggle */ .mobile-menu-toggle { display: none; flex-direction: column; justify-content: space-between; width: 30px; height: 22px; background: transparent; border: none; cursor: pointer; padding: 0; z-index: 1001; } .mobile-menu-toggle span { width: 100%; height: 3px; background: var(--primary-black); transition: all var(--transition-fast); border-radius: 2px; } .mobile-menu-toggle.active span:nth-child(1) { transform: translateY(9.5px) rotate(45deg); } .mobile-menu-toggle.active span:nth-child(2) { opacity: 0; } .mobile-menu-toggle.active span:nth-child(3) { transform: translateY(-9.5px) rotate(-45deg); } /* Mobile Menu */ .mobile-menu { display: none; position: fixed; top: 70px; left: 0; right: 0; background: var(--primary-white); box-shadow: var(--shadow-lg); max-height: 0; overflow: hidden; transition: max-height 0.3s ease-out; } .mobile-menu.active { max-height: calc(100vh - 70px); overflow-y: auto; padding: 1.5rem; } .mobile-nav-section { margin-bottom: 1.5rem; padding-bottom: 1.5rem; border-bottom: 1px solid var(--gray-200); } .mobile-nav-section:last-child { border-bottom: none; } .mobile-nav-section h4 { font-size: 0.85rem; font-weight: 700; text-transform: uppercase; color: var(--gray-600); margin-bottom: 1rem; letter-spacing: 1px; } .mobile-nav-section ul { list-style: none; padding: 0; margin: 0; } .mobile-nav-section li { margin-bottom: 0.5rem; } .mobile-nav-section a { display: block; padding: 0.75rem 1rem; color: var(--gray-700); text-decoration: none; border-radius: var(--border-radius); transition: all var(--transition-fast); } .mobile-nav-section a:hover { background: var(--gray-100); color: var(--primary-black); } .mobile-nav-section a.active { background: var(--primary-black); color: var(--primary-white); font-weight: 700; } /* User Menu Desktop */ .navbar-user-menu { display: flex; align-items: center; } .user-menu-link { display: flex; align-items: center; gap: 0.5rem; } .user-menu-link .username { font-weight: 600; color: var(--gray-700); } .user-menu-link .credits-badge { background: var(--primary-black); color: var(--primary-white); padding: 0.25rem 0.75rem; border-radius: 20px; font-size: 0.85rem; font-weight: 600; } .user-dropdown .dropdown-menu { min-width: 220px; } .user-dropdown .dropdown-menu .dropdown-header { font-weight: 700; color: var(--gray-700); padding: 0.75rem 1rem; } .user-dropdown .dropdown-menu li a { padding: 0.75rem 1rem; display: flex; align-items: center; gap: 0.75rem; } .user-dropdown .dropdown-menu li a i { width: 20px; text-align: center; } .logout-link, .logout-link-mobile { color: #dc3545 !important; } .logout-link:hover, .logout-link-mobile:hover { background: rgba(220, 53, 69, 0.1) !important; } /* Auth Buttons */ .navbar-auth-buttons { display: flex; align-items: center; gap: 1rem; } .btn-outline-register { padding: 0.5rem 1.5rem; border: 2px solid var(--primary-black); color: var(--primary-black); background: transparent; border-radius: var(--border-radius); font-weight: 600; transition: all var(--transition-fast); text-decoration: none; display: inline-flex; align-items: center; gap: 0.5rem; } .btn-outline-register:hover { background: var(--primary-black); color: var(--primary-white); transform: translateY(-2px); box-shadow: var(--shadow-md); } .btn-primary-login { padding: 0.5rem 1.5rem; background: var(--primary-black); color: var(--primary-white); border: 2px solid var(--primary-black); border-radius: var(--border-radius); font-weight: 600; transition: all var(--transition-fast); text-decoration: none; display: inline-flex; align-items: center; gap: 0.5rem; } .btn-primary-login:hover { background: var(--gray-800); border-color: var(--gray-800); transform: translateY(-2px); box-shadow: var(--shadow-md); color: var(--primary-white); } /* Mobile Credits Display */ .mobile-credits-display { background: var(--gray-100); padding: 1rem; border-radius: var(--border-radius); margin-bottom: 1rem; display: flex; align-items: center; gap: 0.5rem; font-size: 1.1rem; } .mobile-credits-display i { color: var(--primary-black); } /* Mobile Auth Buttons */ .mobile-auth-buttons { display: flex; flex-direction: column; gap: 1rem; } .mobile-auth-btn { width: 100%; justify-content: center; padding: 0.75rem 1.5rem; font-size: 1rem; } /* Visibility Classes */ .desktop-only { display: block; } .mobile-only { display: none; } /* Environment Indicator */ .environment-indicator { display: inline-flex; align-items: center; gap: 0.5rem; padding: 0.35rem 0.75rem; border-radius: var(--border-radius); font-size: 0.75rem; font-weight: 700; letter-spacing: 1px; text-transform: uppercase; } .env-dev { background: #28a745; color: white; } .env-stage { background: #ffc107; color: #212529; } /* ===== NAVBAR GLOBAL OVERRIDES - PE TOATE PAGINILE ===== */ /* Acestea se aplică peste tot pentru navbar consistent */ /* Force Inter font în navbar */ .navbar-modern, .navbar-modern *:not([class*="fa-"]):not(.fa):not(.glyphicon) { font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif !important; } /* Navbar font sizes - GLOBALE */ .navbar-logo .logo-text { font-size: 1.5rem !important; font-weight: 900 !important; } .navbar-logo .logo-tagline { font-size: 0.7rem !important; font-weight: 500 !important; } .navbar-modern .nav-link, .navbar-group .nav-link, .homepage-nav-link { font-size: 0.95rem !important; font-weight: 500 !important; } .navbar-modern .dropdown-toggle { font-size: 0.95rem !important; font-weight: 500 !important; } .navbar-modern .username { font-size: 0.95rem !important; font-weight: 600 !important; } .navbar-modern .credits-badge { font-size: 0.85rem !important; font-weight: 600 !important; } .navbar-modern .btn-outline-register, .navbar-modern .btn-primary-login { font-size: 0.95rem !important; font-weight: 600 !important; } /* Responsive Navbar - Tablets */ @media (max-width: 1400px) { .navbar-group-center { gap: 1.5rem; padding: 0 1.5rem; } .navbar-group-left, .navbar-group-right { gap: 1rem; } .nav-link { font-size: 0.9rem; } } /* Responsive Navbar - Mobile */ @media (max-width: 991px) { .desktop-menu { display: none; } .mobile-menu-toggle { display: flex; } .mobile-menu { display: block; } .desktop-only { display: none; } .mobile-only { display: block; } .navbar-content { padding: 0.75rem 0; } .navbar-logo .logo-text { font-size: 1.25rem; } .navbar-logo .logo-tagline { font-size: 0.65rem; } .environment-indicator { font-size: 0.65rem; padding: 0.25rem 0.5rem; } /* Remove group separators on mobile */ .navbar-group-left, .navbar-group-right { border: none !important; padding: 0; } } /* Hero Section */ .hero { min-height: 100vh; display: flex; /*align-items: center;*/ position: relative; padding: 50px 0 80px; background: linear-gradient(180deg, var(--primary-white) 0%, var(--gray-100) 100%); overflow: hidden; } .hero-bg { position: absolute; top: 0; left: 0; right: 0; bottom: 0; pointer-events: none; } .geometric-shape { position: absolute; border-radius: 30% 70% 70% 30% / 30% 30% 70% 70%; opacity: 0.03; animation: float 20s infinite ease-in-out, morph 8s infinite ease-in-out; background: linear-gradient(45deg, var(--primary-black), transparent); } @keyframes morph { 0%, 100% { border-radius: 30% 70% 70% 30% / 30% 30% 70% 70%; } 50% { border-radius: 70% 30% 30% 70% / 70% 70% 30% 30%; } } .shape-1 { width: 400px; height: 400px; background: var(--primary-black); top: -100px; right: -100px; animation-delay: 0s; } .shape-2 { width: 300px; height: 300px; background: var(--gray-800); bottom: -50px; left: -50px; animation-delay: 5s; } .shape-3 { width: 200px; height: 200px; background: var(--gray-600); top: 50%; left: 50%; animation-delay: 10s; } @keyframes float { 0%, 100% { transform: translate(0, 0) rotate(0deg); } 25% { transform: translate(30px, -30px) rotate(90deg); } 50% { transform: translate(-20px, 20px) rotate(180deg); } 75% { transform: translate(-30px, -20px) rotate(270deg); } } .hero-content { display: grid; grid-template-columns: 2fr 1fr; gap: 120px; align-items: center; position: relative; z-index: 2; } .hero-badge { display: inline-block; padding: 8px 16px; background: var(--primary-black); color: var(--primary-white); font-size: 12px; font-weight: 700; letter-spacing: 2px; text-transform: uppercase; border-radius: var(--border-radius); margin-bottom: 1rem; animation: slideInLeft 1s ease-out; } .hero-title { margin-bottom: 1.5rem; animation: slideInLeft 1s ease-out 0.2s backwards; } .text-gradient { background: linear-gradient(135deg, var(--primary-black) 0%, var(--gray-600) 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; } .hero-description { font-size: 1.2rem; color: var(--gray-600); margin-bottom: 2rem; animation: slideInLeft 1s ease-out 0.4s backwards; } .hero-buttons { display: flex; gap: 1rem; margin-bottom: 3rem; animation: slideInLeft 1s ease-out 0.6s backwards; } .hero-stats { display: flex; gap: 3rem; animation: slideInLeft 1s ease-out 0.8s backwards; } .stat { display: flex; flex-direction: column; margin-top:20px; } .stat-number { font-size: 2rem !important; font-weight: 800; color: var(--primary-black); } .stat-label { font-size: 0.9rem; color: var(--gray-600); } .hero-visual { position: relative; display: flex; justify-content: center; align-items: center; animation: slideInRight 1s ease-out; } .central-graphic { position: relative; width: 500px; height: 500px; display: flex; justify-content: center; align-items: center; } .orbit { position: absolute; border: 2px solid var(--gray-300); border-radius: 50%; animation: rotate 20s linear infinite; } .orbit-1 { width: 100%; height: 100%; animation-duration: 20s; } .orbit-2 { width: 80%; height: 80%; animation-duration: 15s; animation-direction: reverse; } .orbit-3 { width: 60%; height: 60%; animation-duration: 10s; } @keyframes rotate { from { transform: rotate(0deg); } to { transform: rotate(360deg); } } .core { width: 150px; height: 150px; background: var(--primary-black); border-radius: var(--border-radius-lg); display: flex; justify-content: center; align-items: center; color: var(--primary-white); font-size: 3rem; box-shadow: var(--shadow-xl); z-index: 10; } .core-icon{ font-size:65px; } .floating-card { position: absolute; background: var(--primary-white); padding: 1rem 1.5rem; border-radius: 50px; box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1); display: flex; align-items: center; gap: 0.75rem; font-weight: 600; animation: floatCard 4s ease-in-out infinite; border: 1px solid var(--gray-200); backdrop-filter: blur(10px); background: rgba(255, 255, 255, 0.95); } .floating-card i { font-size: 1.5rem; color: var(--primary-black); } .card-1 { top: 10px; left: 0px; animation-delay: 0s; } .card-2 { top: 50%; right: -100px; animation-delay: 1.5s; } .card-3 { bottom: 0; left: 0; animation-delay: 3s; } @keyframes floatCard { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-20px); } } .scroll-indicator { position: absolute; bottom: 60px; left: 50%; transform: translateX(-50%); display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--gray-600); animation: bounce 2s infinite; } @keyframes bounce { 0%, 100% { transform: translateX(-50%) translateY(0); } 50% { transform: translateX(-50%) translateY(10px); } } /* Services Section */ .services { padding: 80px 0; background: var(--primary-white); } .section-header { text-align: center; margin-bottom: 60px; } .section-badge { display: inline-block; padding: 8px 16px; background: var(--gray-100); color: var(--primary-black); font-size: 12px; font-weight: 700; letter-spacing: 2px; text-transform: uppercase; border-radius: var(--border-radius); margin-bottom: 1rem; } .section-title { margin-bottom: 1rem; position: relative; display: inline-block; } .section-title::after { content: ''; position: absolute; bottom: -10px; left: 50%; transform: translateX(-50%); width: 60px; height: 3px; background: var(--primary-black); border-radius: 2px; } .section-description { font-size: 1.1rem; color: var(--gray-600); max-width: 600px; margin: 0 auto; } .services-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(350px, 1fr)); gap: 30px; } .service-card { background: var(--primary-white); padding: 40px; border-radius: var(--border-radius-lg); border: 1px solid var(--gray-200); transition: all var(--transition-normal); position: relative; overflow: hidden; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05); } .service-card::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 3px; background: linear-gradient(90deg, var(--primary-black), var(--gray-600)); transform: translateX(-100%); transition: transform var(--transition-normal); } .service-card:hover::before { transform: translateX(0); } .service-card:hover { transform: translateY(-10px); box-shadow: var(--shadow-xl); border-color: var(--primary-black); } .service-card.featured { border-color: var(--primary-black); background: var(--gray-100); } .featured-badge { position: absolute; top: 20px; right: 20px; padding: 6px 12px; background: var(--primary-black); color: var(--primary-white); font-size: 12px; font-weight: 700; border-radius: var(--border-radius); } .service-icon { width: 60px; height: 60px; background: var(--primary-black); color: var(--primary-white); display: flex; justify-content: center; align-items: center; font-size: 1.5rem; border-radius: var(--border-radius); margin-bottom: 1.5rem; transition: all var(--transition-normal); } .service-card:hover .service-icon { transform: scale(1.1) rotate(5deg); } .service-card h3 { margin-bottom: 1rem; } .service-features { list-style: none; margin: 1.5rem 0; } .service-features li { padding: 0.5rem 0; color: var(--gray-600); display: flex; align-items: center; gap: 0.5rem; } .service-features i { color: var(--primary-black); font-size: 0.8rem; } .service-link { color: var(--primary-black); text-decoration: none; font-weight: 600; display: inline-flex; align-items: center; gap: 0.5rem; transition: gap var(--transition-fast); } .service-link:hover { gap: 1rem; } /* About Section */ .about { padding: 80px 0; background: var(--gray-100); } .about-content { display: grid; grid-template-columns: 1fr 1fr; gap: 60px; align-items: center; } .about-description { font-size: 1.1rem; line-height: 1.8; margin-bottom: 2rem; } .about-features { display: flex; flex-direction: column; gap: 1.5rem; margin-bottom: 2rem; } .feature { display: flex; gap: 1rem; align-items: start; } .feature i { width: 40px; height: 40px; background: var(--primary-black); color: var(--primary-white); display: flex; justify-content: center; align-items: center; border-radius: var(--border-radius); flex-shrink: 0; } .feature h4 { margin-bottom: 0.25rem; } .feature p { color: var(--gray-600); margin: 0; } .about-visual { position: relative; } .about-image { position: relative; border-radius: var(--border-radius-lg); overflow: hidden; } .image-placeholder { width: 100%; height: 400px; background: linear-gradient(135deg, var(--primary-black) 0%, var(--gray-800) 100%); display: flex; justify-content: center; align-items: center; color: var(--primary-white); font-size: 5rem; border-radius: var(--border-radius-lg); } .floating-stat { position: absolute; background: var(--primary-white); padding: 1rem 1.5rem; border-radius: var(--border-radius); box-shadow: var(--shadow-lg); display: flex; flex-direction: column; align-items: center; } .stat-value { font-size: 1.5rem; font-weight: 800; color: var(--primary-black); } .stat-text { font-size: 0.8rem; color: var(--gray-600); } .stat-1 { top: 30px; right: -12px !important; } .stat-2 { bottom: 30px; left: -12px !important; } /* Portfolio Section */ .portfolio { padding: 80px 0; background: var(--primary-white); } .portfolio-filters { display: flex; justify-content: center; gap: 1rem; margin-bottom: 40px; flex-wrap: wrap; } .filter-btn { padding: 10px 20px; background: transparent; border: 2px solid var(--gray-300); border-radius: var(--border-radius); cursor: pointer; font-weight: 600; transition: all var(--transition-fast); } .filter-btn:hover, .filter-btn.active { background: var(--primary-black); color: var(--primary-white); border-color: var(--primary-black); } .portfolio-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 30px; } .portfolio-item { position: relative; border-radius: var(--border-radius-lg); overflow: hidden; cursor: pointer; transition: all var(--transition-normal); background: var(--primary-white); border: 1px solid var(--gray-200); } .portfolio-item::after { content: ''; position: absolute; top: 50%; left: 50%; width: 0; height: 0; background: rgba(0, 0, 0, 0.1); border-radius: 50%; transform: translate(-50%, -50%); transition: width 0.6s, height 0.6s; } .portfolio-item:hover::after { width: 600px; height: 600px; } .portfolio-item:hover { transform: translateY(-10px); box-shadow: var(--shadow-xl); } .portfolio-image { position: relative; width: 100%; height: 300px; overflow: hidden; } .portfolio-image .image-placeholder { height: 100%; transition: transform var(--transition-normal); } .portfolio-item:hover .image-placeholder { transform: scale(1.1); } .portfolio-overlay { position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: rgba(0, 0, 0, 0.9); display: flex; flex-direction: column; justify-content: center; align-items: center; padding: 2rem; opacity: 0; transition: opacity var(--transition-normal); text-align: center; } .portfolio-item:hover .portfolio-overlay { opacity: 1; } .portfolio-overlay h4 { color: var(--primary-white); margin-bottom: 0.5rem; } .portfolio-overlay p { color: var(--gray-400); margin-bottom: 1rem; } .portfolio-tags { display: flex; gap: 0.5rem; margin-bottom: 1.5rem; flex-wrap: wrap; justify-content: center; } .portfolio-tags span { padding: 4px 12px; background: rgba(255, 255, 255, 0.1); color: var(--primary-white); font-size: 12px; border-radius: var(--border-radius); } /* Technologies Section */ .technologies { padding: 80px 0; background: var(--gray-100); } .tech-categories { display: grid; gap: 40px; } .tech-category h3 { text-align: center; margin-bottom: 2rem; } .tech-grid { display: flex; justify-content: center; flex-wrap: wrap; gap: 20px; } .tech-item { background: var(--primary-white); padding: 20px; border-radius: var(--border-radius); display: flex; flex-direction: column; align-items: center; gap: 10px; min-width: 120px; transition: all var(--transition-normal); border: 2px solid transparent; } .tech-item:hover { transform: translateY(-5px); box-shadow: var(--shadow-lg); border-color: var(--primary-black); } .tech-item i { font-size: 2rem; color: var(--primary-black); } .tech-item span { font-weight: 600; color: var(--gray-700); } /* CTA Section */ .cta { padding: 80px 0; background: linear-gradient(135deg, var(--primary-black) 0%, var(--gray-800) 100%); color: var(--primary-white); text-align: center; } .cta-content h2 { color: var(--primary-white); margin-bottom: 1rem; } .cta-content p { color: var(--gray-300); font-size: 1.2rem; margin-bottom: 2rem; } .cta-buttons { display: flex; justify-content: center; gap: 1rem; flex-wrap: wrap; } /* Contact Section */ .contact { padding: 80px 0; background: var(--primary-white); } .contact-content { display: grid; grid-template-columns: 1fr 1fr; gap: 60px; } .contact-info { display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px; } .contact-card { background: var(--gray-100); padding: 30px; border-radius: var(--border-radius-lg); text-align: center; transition: all var(--transition-normal); } .contact-card:hover { transform: translateY(-5px); box-shadow: var(--shadow-lg); } .contact-card i { width: 50px; height: 50px; background: var(--primary-black); color: var(--primary-white); display: flex; justify-content: center; align-items: center; font-size: 1.2rem; border-radius: var(--border-radius); margin: 0 auto 1rem; } .contact-card h4 { margin-bottom: 0.5rem; } .contact-card p { color: var(--gray-600); margin: 0; } .landing-page-scope .contact-form { background: var(--gray-100); padding: 40px; border-radius: var(--border-radius-lg); } .landing-page-scope .form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; margin-bottom: 20px; } .landing-page-scope .form-group input, .landing-page-scope .form-group select, .landing-page-scope .form-group textarea { width: 100%; padding: 12px; border: 2px solid var(--gray-300); border-radius: var(--border-radius); font-family: inherit; font-size: 16px; transition: all var(--transition-fast); background: var(--primary-white); } .landing-page-scope .form-group input:focus, .landing-page-scope .form-group select:focus, .landing-page-scope .form-group textarea:focus { outline: none; border-color: var(--primary-black); } .landing-page-scope .form-group textarea { resize: vertical; } /* Footer */ .footer { background: var(--primary-black); color: var(--primary-white); padding: 60px 0 20px; } .footer-content { display: grid; grid-template-columns: 2fr 1fr 1fr 2fr; gap: 40px; margin-bottom: 40px; } .footer-logo { font-size: 1.5rem; font-weight: 900; margin-bottom: 1rem; } .footer-section h4 { margin-bottom: 1rem; color: var(--primary-white); } .footer-section p { color: var(--gray-400); } .footer-section ul { list-style: none; } .footer-section ul li { margin-bottom: 0.5rem; } .footer-section ul li a { color: var(--gray-400); text-decoration: none; transition: color var(--transition-fast); } .footer-section ul li a:hover { color: var(--primary-white); } .social-links { display: flex; gap: 1rem; margin-top: 1rem; } .social-links a { width: 40px; height: 40px; background: rgba(255, 255, 255, 0.1); color: var(--primary-white); display: flex; justify-content: center; align-items: center; border-radius: var(--border-radius); transition: all var(--transition-fast); } .social-links a:hover { background: var(--primary-white); color: var(--primary-black); transform: translateY(-3px); } .newsletter-form { display: flex; gap: 10px; margin-top: 1rem; } .newsletter-form input { flex: 1; padding: 12px; border: none; border-radius: var(--border-radius); background: rgba(255, 255, 255, 0.1); color: var(--primary-white); } .newsletter-form input::placeholder { color: var(--gray-500); } .footer-bottom { padding-top: 20px; border-top: 1px solid rgba(255, 255, 255, 0.1); display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 20px; } .footer-bottom p { color: var(--gray-400); margin: 0; } .footer-links { display: flex; gap: 20px; } .footer-links a { color: var(--gray-400); text-decoration: none; transition: color var(--transition-fast); } .footer-links a:hover { color: var(--primary-white); } /* Floating Database Version Indicator */ .floating-db-indicator { position: fixed; bottom: 100px; right: 30px; background: var(--primary-black); color: var(--primary-white); padding: 12px 16px; border-radius: 50px; box-shadow: var(--shadow-xl); cursor: pointer; z-index: 998; transition: all var(--transition-normal); display: flex; align-items: center; gap: 0.5rem; } .floating-db-indicator:hover { transform: translateY(-5px) scale(1.05); box-shadow: 0 15px 30px rgba(0, 0, 0, 0.3); } .db-indicator-content { display: flex; align-items: center; gap: 0.5rem; } .db-indicator-content i { font-size: 1.2rem; } .db-version-text { font-size: 0.9rem; } .db-version-text strong { color: #4CAF50; } .db-indicator-tooltip { position: absolute; bottom: 60px; right: 0; background: var(--gray-800); color: var(--primary-white); padding: 8px 12px; border-radius: var(--border-radius); font-size: 0.75rem; white-space: nowrap; opacity: 0; pointer-events: none; transition: opacity var(--transition-fast); } .floating-db-indicator:hover .db-indicator-tooltip { opacity: 1; } .db-indicator-tooltip::after { content: ''; position: absolute; top: 100%; right: 20px; border: 5px solid transparent; border-top-color: var(--gray-800); } /* Back to Top Button */ .back-to-top { position: fixed; bottom: 30px; right: 30px; width: 50px; height: 50px; background: var(--primary-black); color: var(--primary-white); border: none; border-radius: var(--border-radius); display: flex; justify-content: center; align-items: center; cursor: pointer; opacity: 0; visibility: hidden; transition: all var(--transition-normal); z-index: 999; } .back-to-top.visible { opacity: 1; visibility: visible; } .back-to-top:hover { background: var(--gray-800); transform: translateY(-5px); } /* Animations */ @keyframes slideInLeft { from { opacity: 0; transform: translateX(-30px); } to { opacity: 1; transform: translateX(0); } } @keyframes slideInRight { from { opacity: 0; transform: translateX(30px); } to { opacity: 1; transform: translateX(0); } } @keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } } /* Database Version Selector */ .database-selector { margin-top: 3rem; padding: 2rem; background: rgba(255, 255, 255, 0.95); border-radius: var(--border-radius-lg); border: 1px solid var(--gray-200); backdrop-filter: blur(10px); } .database-selector label { display: block; font-weight: 600; color: var(--gray-800); margin-bottom: 1rem; font-size: 0.9rem; text-transform: uppercase; letter-spacing: 1px; } .database-selector label i { margin-right: 0.5rem; color: var(--primary-black); } .version-buttons { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 1rem; } .version-btn { padding: 1rem; background: var(--primary-white); border: 2px solid var(--gray-300); border-radius: var(--border-radius); cursor: pointer; transition: all var(--transition-normal); display: flex; flex-direction: column; align-items: center; gap: 0.25rem; position: relative; overflow: hidden; } .version-btn::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 3px; background: var(--primary-black); transform: translateX(-100%); transition: transform var(--transition-normal); } .version-btn:hover { transform: translateY(-2px); box-shadow: var(--shadow-md); border-color: var(--gray-600); } .version-btn:hover::before { transform: translateX(0); } .version-btn.active { background: var(--primary-black); color: var(--primary-white); border-color: var(--primary-black); transform: scale(1.05); box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3); } .version-btn.loading { pointer-events: none; opacity: 0.6; animation: pulse 1s infinite; } @keyframes pulse { 0%, 100% { opacity: 0.6; } 50% { opacity: 1; } } .version-btn.active .version-year { color: var(--primary-white); } .version-btn.active .version-label { color: var(--gray-300); } .version-year { font-size: 1.2rem; font-weight: 700; color: var(--primary-black); } .version-label { font-size: 0.75rem; color: var(--gray-600); text-align: center; } /* Database Version Bar in Services */ .database-version-bar { margin: 2rem 0 3rem; padding: 1.5rem; background: linear-gradient(135deg, var(--gray-100) 0%, var(--primary-white) 100%); border-radius: var(--border-radius-lg); border: 1px solid var(--gray-200); display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 1rem; box-shadow: var(--shadow-sm); } .version-info { display: flex; align-items: center; gap: 1rem; font-weight: 600; color: var(--gray-800); } .version-info i { font-size: 1.5rem; color: var(--primary-black); } .current-version { padding: 0.5rem 1rem; background: var(--primary-black); color: var(--primary-white); border-radius: var(--border-radius); font-size: 0.9rem; } .version-selector-compact { display: flex; gap: 1rem; align-items: center; } .version-dropdown { padding: 0.75rem 1rem; border: 2px solid var(--gray-300); border-radius: var(--border-radius); background: var(--primary-white); font-family: inherit; font-size: 0.95rem; cursor: pointer; transition: all var(--transition-fast); min-width: 250px; } .version-dropdown:hover, .version-dropdown:focus { border-color: var(--primary-black); outline: none; } .btn-update-db { padding: 0.75rem 1.5rem; background: var(--primary-black); color: var(--primary-white); border: none; border-radius: var(--border-radius); font-weight: 600; cursor: pointer; transition: all var(--transition-normal); display: flex; align-items: center; gap: 0.5rem; } .btn-update-db:hover { background: var(--gray-800); transform: translateY(-2px); box-shadow: var(--shadow-md); } .btn-update-db i { transition: transform var(--transition-normal); } .btn-update-db:hover i { transform: rotate(180deg); } /* Database Loading Overlay */ .db-loading-overlay { position: fixed; top: 0; left: 0; right: 0; bottom: 0; background: rgba(0, 0, 0, 0.9); backdrop-filter: blur(10px); z-index: 99999; display: flex; justify-content: center; align-items: center; opacity: 0; visibility: hidden; transition: all 0.3s ease-out; } .db-loading-overlay.show { opacity: 1; visibility: visible; } .db-loading-content { position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); text-align: center; color: var(--primary-white); z-index: 100000; width: auto; max-width: 90%; } .db-loading-spinner { margin-bottom: 1.5rem; } .db-loading-spinner i { font-size: 4rem; color: var(--primary-white); animation: spin 1s linear infinite; } .db-loading-content h3 { color: var(--primary-white); margin-bottom: 0.5rem; font-size: 1.5rem; } .db-loading-content p { color: var(--gray-400); margin-bottom: 1.5rem; } .loading-bar { width: 200px; height: 4px; background: rgba(255, 255, 255, 0.1); border-radius: 2px; margin: 0 auto; overflow: hidden; } .loading-progress { height: 100%; background: linear-gradient(90deg, var(--primary-white) 0%, var(--gray-400) 100%); width: 0; animation: loadingProgress 1.5s ease-out forwards; } @keyframes loadingProgress { to { width: 100%; } } @keyframes spin { from { transform: rotate(0deg); } to { transform: rotate(360deg); } } @keyframes countUp { from { transform: scale(0.5); opacity: 0; } to { transform: scale(1); opacity: 1; } } @keyframes bounce { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-10px); } } /* Database Version Notification */ .db-notification { position: fixed; top: 100px; right: 20px; padding: 1rem 1.5rem; background: var(--primary-black); color: var(--primary-white); border-radius: var(--border-radius); box-shadow: var(--shadow-xl); z-index: 10000; display: none; animation: slideInRight 0.3s ease-out; max-width: 350px; } .db-notification.show { display: flex; align-items: center; gap: 1rem; } .db-notification i { font-size: 1.5rem; color: #4CAF50; } .db-notification-content h4 { margin: 0 0 0.25rem; font-size: 1rem; } .db-notification-content p { margin: 0; font-size: 0.85rem; color: var(--gray-300); } /* Responsive Design */ @media (max-width: 1024px) { .hero-content { grid-template-columns: 1fr; text-align: center; } .hero-visual { margin-top: 40px; } .floating-card { display: none; } .about-content { grid-template-columns: 1fr; } .contact-content { grid-template-columns: 1fr; } } @media (max-width: 768px) { .database-selector { padding: 1.5rem; } .version-buttons { grid-template-columns: repeat(2, 1fr); } .database-version-bar { flex-direction: column; align-items: stretch; } .version-selector-compact { flex-direction: column; width: 100%; } .version-dropdown { width: 100%; } .btn-update-db { width: 100%; justify-content: center; } .nav-menu { display: none; position: fixed; top: 70px; left: 0; right: 0; background: var(--primary-white); flex-direction: column; padding: 2rem; box-shadow: var(--shadow-lg); } .nav-menu.active { display: flex; } .menu-toggle { display: flex; } .nav-actions .btn-primary { display: none; } .hero-buttons { flex-direction: column; width: 100%; } .hero-buttons button { width: 100%; } .services-grid { grid-template-columns: 1fr; } .footer-content { grid-template-columns: 1fr; text-align: center; } .social-links { justify-content: center; } .footer-bottom { flex-direction: column; text-align: center; } .form-row { grid-template-columns: 1fr; } .contact-info { grid-template-columns: 1fr; } } @media (max-width: 480px) { h1 { font-size: 2rem; } h2 { font-size: 1.5rem; } h3 { font-size: 1.2rem; } .hero-stats { flex-direction: column; gap: 1rem; } .portfolio-grid { grid-template-columns: 1fr; } .tech-grid { grid-template-columns: repeat(2, 1fr); } } /* =================================================================== BOOTSTRAP OVERRIDE - IMPORTANT FIXES Stiluri care suprascriu Bootstrap pentru a păstra designul landing page =================================================================== */ /* ===== CONTAINER-ELE INTERNE PENTRU HOMEPAGE ===== */ /* Container-ele interne (.container-home) rămân 1400px pe ecrane mari */ .landing-page-scope .container, .landing-page-scope .container-home { max-width: 1400px !important; width: 100% !important; margin: 0 auto !important; padding-left: 20px !important; padding-right: 20px !important; } /* Responsive pentru container-ele interne din homepage */ @media (max-width: 768px) { .landing-page-scope .container, .landing-page-scope .container-home { max-width: 100% !important; padding-left: 15px !important; padding-right: 15px !important; } } @media (min-width: 769px) and (max-width: 1399px) { .landing-page-scope .container, .landing-page-scope .container-home { max-width: 1140px !important; } } @media (min-width: 1400px) { .landing-page-scope .container, .landing-page-scope .container-home { max-width: 1400px !important; } } /* Typography overrides - DOAR PENTRU LANDING PAGE */ .landing-page-scope h1, .landing-page-scope h2, .landing-page-scope h3, .landing-page-scope h4, .landing-page-scope h5, .landing-page-scope h6 { font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif !important; font-weight: 700 !important; line-height: 1.2 !important; letter-spacing: -0.02em !important; } .landing-page-scope h1 { font-size: clamp(2.5rem, 5vw, 4rem) !important; } .landing-page-scope h2 { font-size: clamp(2rem, 4vw, 3rem) !important; } .landing-page-scope h3 { font-size: clamp(1.5rem, 3vw, 2rem) !important; } .landing-page-scope h4 { font-size: clamp(1.2rem, 2.5vw, 1.5rem) !important; } .landing-page-scope h5 { font-size: 1.1rem !important; } .landing-page-scope h6 { font-size: 1rem !important; } /* Paragraph overrides - DOAR pentru landing page */ .landing-page-scope p { font-size: 1rem !important; line-height: 1.8 !important; margin-bottom: 1rem !important; } /* Span și text general - DOAR pentru landing page */ .landing-page-scope span, .landing-page-scope div, .landing-page-scope a, .landing-page-scope label { /*font-size: inherit !important;*/ } /* Link-uri generale - DOAR pentru landing page */ .landing-page-scope a { font-size: inherit !important; text-decoration: none !important; } /* Button overrides - doar pentru landing page sections */ .hero .btn-primary, .services .btn-primary, .about .btn-primary, .cta .btn-primary, .contact .btn-primary { padding: 12px 24px !important; font-size: 16px !important; font-weight: 600 !important; border-radius: var(--border-radius) !important; border: 2px solid var(--primary-black) !important; } .btn-large { padding: 16px 32px !important; font-size: 18px !important; } /* Container padding override - DOAR pentru landing page */ .landing-page-scope .hero .container, .landing-page-scope .services .container, .landing-page-scope .about .container, .landing-page-scope .portfolio .container, .landing-page-scope .technologies .container, .landing-page-scope .cta .container, .landing-page-scope .contact .container { padding-left: 0px !important; padding-right: 0px !important; } /* Form overrides pentru landing page */ .landing-page-scope .contact-form input, .landing-page-scope .contact-form select, .landing-page-scope .contact-form textarea, .landing-page-scope .newsletter-form input { font-family: 'Inter', sans-serif !important; font-size: 16px !important; } .landing-page-scope .contact-form input:focus, .landing-page-scope .contact-form select:focus, .landing-page-scope .contact-form textarea:focus { box-shadow: none !important; outline: none !important; border-color: var(--primary-black) !important; } /* Previne Bootstrap să modific spacing-ul în landing page */ .hero, .services, .about, .portfolio, .technologies, .cta, .contact { font-size: 16px; line-height: 1.6; } /* Fix pentru button hover în landing page */ .hero .btn-outline:hover, .services .btn-outline:hover, .cta .btn-outline-white:hover { color: inherit !important; } /* Remove Bootstrap margin-bottom din headings în landing sections */ .section-header h2 { margin-bottom: 1rem !important; } .service-card h3, .feature h4 { margin-bottom: 0.5rem !important; } /* Fix pentru lists în service cards */ .service-features { padding-left: 0 !important; margin-top: 1.5rem !important; margin-bottom: 1.5rem !important; } .service-features li { list-style: none !important; } /* Override Bootstrap grid pentru landing sections */ /* Comentat temporar - nu este necesar .services-grid, .portfolio-grid, .tech-grid { display: grid !important; } */ /* Fix row în contact și footer */ .form-row { display: grid !important; margin-left: 0 !important; margin-right: 0 !important; } .footer-content { display: grid !important; } /* ===== NAVBAR FONT SIZES - FOARTE IMPORTANT ===== */ .navbar-modern { font-size: 16px !important; } .navbar-logo .logo-text { font-size: 2rem !important; font-weight: 900 !important; } .navbar-logo .logo-tagline { font-size: 0.7rem !important; font-weight: 500 !important; } /* Nav links în navbar - SIZE MARE */ .nav-link { display: inline-block !important; padding: 0.5rem 0 !important; line-height: 1.6 !important; font-size: 0.95rem !important; font-weight: 500 !important; } .navbar-group .nav-link { font-size: 0.95rem !important; text-decoration: none; } /* Homepage nav links */ .homepage-nav-link { font-size: 0.95rem !important; font-weight: 500 !important; } /* Dropdown toggle în navbar */ .dropdown-toggle { font-size: 0.95rem !important; font-weight: 500 !important; } /* Fix pentru dropdown menu în navbar */ .dropdown-menu { font-family: 'Inter', sans-serif !important; font-size: 14px !important; } .dropdown-menu li a { font-size: 14px !important; line-height: 1.6 !important; padding: 8px 20px !important; } /* Environment indicator */ .environment-indicator { font-size: 0.75rem !important; font-weight: 700 !important; } /* User menu în navbar */ .user-menu-link .username { font-size: 0.95rem !important; font-weight: 600 !important; } .credits-badge { font-size: 0.85rem !important; font-weight: 600 !important; } /* Auth buttons în navbar */ .btn-outline-register, .btn-primary-login { font-size: 0.95rem !important; font-weight: 600 !important; padding: 0.5rem 1.5rem !important; } /* ===== LANDING PAGE SECTIONS ===== */ /* Hero section */ .hero-badge { font-size: 12px !important; font-weight: 700 !important; letter-spacing: 2px !important; } .hero-description { font-size: 1.2rem !important; line-height: 1.8 !important; } .stat-number { font-size: 2rem !important; font-weight: 800 !important; } .stat-label { font-size: 0.9rem !important; } /* Section badges */ .section-badge { font-size: 12px !important; font-weight: 700 !important; letter-spacing: 2px !important; } .section-description { font-size: 1.1rem !important; line-height: 1.8 !important; } /* Service cards */ .service-card h3 { font-size: clamp(1.5rem, 3vw, 2rem) !important; } .service-card p { font-size: 1rem !important; } .service-features li { font-size: 1rem !important; } /* About section */ .about-description { font-size: 1.1rem !important; line-height: 1.8 !important; } .feature h4 { font-size: 1.2rem !important; } .feature p { font-size: 1rem !important; } /* Contact form - SCOPED */ .landing-page-scope .contact-form input, .landing-page-scope .contact-form select, .landing-page-scope .contact-form textarea { font-size: 16px !important; } .landing-page-scope .contact-card h4 { font-size: 1.2rem !important; } .landing-page-scope .contact-card p { font-size: 1rem !important; } /* Footer */ .footer { font-size: 16px !important; } .footer-logo { font-size: 1.5rem !important; font-weight: 900 !important; } .footer-section h4 { font-size: 1.2rem !important; } .footer-section p, .footer-section li { font-size: 1rem !important; } /* Database version selector */ .database-selector label { font-size: 0.9rem !important; } .version-year { font-size: 1.2rem !important; font-weight: 700 !important; } .version-label { font-size: 0.75rem !important; } /* Asigură că stilurile de tranziție funcționează */ * { box-sizing: border-box !important; } /* =================================================================== LANDING PAGE SCOPE - TOATE STILURILE SE APLICĂ DOAR PE HOMEPAGE CSS-ul se aplică doar înăuntrul div-ului cu clasa .landing-page-scope =================================================================== */ /* =================================================================== FIX CRUCIAL: ROOT FONT-SIZE pentru REM corect PE TOATE PAGINILE Bootstrap setează html la 10px (62.5%), noi forțăm 16px GLOBAL =================================================================== */ /* OVERRIDE GLOBAL - aplicat pe TOATE paginile pentru REM consistent */ html { scroll-behavior: smooth !important; font-size: 16px !important; /* FORȚAT pe toate paginile */ } /* Double-check cu :root */ :root { font-size: 16px !important; } /* Asigură că Bootstrap nu resetează la 10px pe niciun breakpoint */ @media (min-width: 1px) { html, :root { font-size: 16px !important; } } @media (min-width: 768px) { html, :root { font-size: 16px !important; } } @media (min-width: 992px) { html, :root { font-size: 16px !important; } } @media (min-width: 1400px) { html, :root { font-size: 16px !important; } } /* ===== SCOPED OVERRIDES - DOAR PENTRU LANDING PAGE ===== */ /* Forțează toate elementele din landing page să respecte size-urile noastre */ /* IMPORTANT: Excludem Font Awesome pentru a păstra iconițele! */ .landing-page-scope, .landing-page-scope *:not([class*="fa-"]):not(.fa):not(.glyphicon):not([class*="icon-"]) { font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif !important; } /* Resetare Bootstrap font-size pentru toate elementele comune DOAR în landing page */ .landing-page-scope button, .landing-page-scope input, .landing-page-scope select, .landing-page-scope textarea, .landing-page-scope label, .landing-page-scope .btn, .landing-page-scope .form-control { font-size: 16px !important; font-family: 'Inter', sans-serif !important; } /* Forțează dimensiuni în navbar - EXCLUS iconițe */ .navbar-modern *:not([class*="fa-"]):not(.fa):not(.glyphicon), .navbar-content *:not([class*="fa-"]):not(.fa):not(.glyphicon) { font-family: 'Inter', sans-serif !important; } /* Forțează în toate secțiunile landing page - EXCLUS iconițe */ .hero *:not([class*="fa-"]):not(.fa):not(.glyphicon), .services *:not([class*="fa-"]):not(.fa):not(.glyphicon), .about *:not([class*="fa-"]):not(.fa):not(.glyphicon), .portfolio *:not([class*="fa-"]):not(.fa):not(.glyphicon), .technologies *:not([class*="fa-"]):not(.fa):not(.glyphicon), .cta *:not([class*="fa-"]):not(.fa):not(.glyphicon), .contact *:not([class*="fa-"]):not(.fa):not(.glyphicon), .footer *:not([class*="fa-"]):not(.fa):not(.glyphicon) { font-family: 'Inter', sans-serif !important; } /* Override Bootstrap .small, .text-muted, etc - DOAR pentru landing page */ .landing-page-scope .small, .landing-page-scope small { font-size: 0.875rem !important; } .landing-page-scope .lead { font-size: 1.25rem !important; } /* Bootstrap list overrides - DOAR pentru landing page */ .landing-page-scope ul, .landing-page-scope ol { font-size: inherit !important; } .landing-page-scope li { font-size: inherit !important; } /* Bootstrap table overrides - DOAR pentru landing page */ .landing-page-scope table { font-size: inherit !important; } .landing-page-scope td, .landing-page-scope th { font-size: inherit !important; } /* Forțează code și pre - DOAR pentru landing page */ .landing-page-scope code, .landing-page-scope pre { font-size: inherit !important; } /* Badge și label overrides - DOAR pentru landing page */ .landing-page-scope .badge, .landing-page-scope .label { font-size: 0.75rem !important; } /* ===== PROTECȚIE FONT AWESOME - FOARTE IMPORTANT ===== */ /* Asigură că Font Awesome folosește fontul corect pentru iconițe */ .fa, [class^="fa-"], [class*=" fa-"], .glyphicon, [class^="glyphicon-"], [class*=" glyphicon-"], [class^="icon-"], [class*=" icon-"] { font-family: FontAwesome !important; font-style: normal !important; font-weight: normal !important; font-variant: normal !important; text-transform: none !important; line-height: 1 !important; -webkit-font-smoothing: antialiased !important; -moz-osx-font-smoothing: grayscale !important; } /* Glyphicons pentru Bootstrap (dacă există) */ .glyphicon, [class^="glyphicon-"], [class*=" glyphicon-"] { font-family: 'Glyphicons Halflings' !important; } /* END BOOTSTRAP OVERRIDE */ /* =================================================================== CONTAINER OVERRIDE - CONTROLEAZĂ LĂȚIMEA #container DIN _LAYOUT.CSHTML =================================================================== */ /* ===== NAVBAR CONTAINER OVERRIDE ===== */ /* Navbar container să aibă aceeași lățime ca #container principal pentru aliniere perfectă */ .navbar .container, .navbar-modern .container { max-width: 1400px !important; width: 100% !important; margin: 0 auto !important; padding-left: 20px !important; padding-right: 20px !important; } /* Responsive pentru navbar container */ @media (max-width: 768px) { .navbar .container, .navbar-modern .container { max-width: 100% !important; padding-left: 15px !important; padding-right: 15px !important; } } @media (min-width: 769px) and (max-width: 1399px) { .navbar .container, .navbar-modern .container { max-width: 1140px !important; } } @media (min-width: 1400px) { .navbar .container, .navbar-modern .container { max-width: 1400px !important; } } /* ===== MAIN CONTAINER OVERRIDE ===== */ /* OVERRIDE GLOBAL pentru #container - pe TOATE paginile (EXCEPT homepage) */ /* Forțăm max-width: 1400px în loc de valorile fixe Bootstrap */ #container { max-width: 1400px !important; width: 100% !important; margin: 0 auto !important; padding-left: 20px !important; padding-right: 20px !important; } /* Responsive adjustments pentru #container */ @media (max-width: 768px) { #container { max-width: 100% !important; padding-left: 15px !important; padding-right: 15px !important; } } @media (min-width: 769px) and (max-width: 1399px) { #container { max-width: 1140px !important; } } @media (min-width: 1400px) and (max-width: 1639px) { #container { max-width: 1400px !important; } } @media (min-width: 1640px) { #container { max-width: 1400px !important; } } /* EXCEPȚIE pentru HOMEPAGE - #container devine full-width (100vw) */ /* Când există .landing-page-scope în #container, îl facem full-width */ #container:has(.landing-page-scope) { width: 100vw !important; max-width: 100vw !important; padding: 0 !important; margin: 0 !important; } /* Fallback pentru browsere fără :has() */ body:has(.landing-page-scope) #container { width: 100vw !important; max-width: 100vw !important; padding: 0 !important; margin: 0 !important; } /* Ascunde footer-ul și hr din _Layout.cshtml pe homepage */ #container:has(.landing-page-scope) > hr, #container:has(.landing-page-scope) > footer { display: none !important; } /* Fallback pentru browsere fără :has() */ body:has(.landing-page-scope) #container > hr, body:has(.landing-page-scope) #container > footer { display: none !important; }