/* Minification failed. Returning unminified contents.
(37,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(38,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(39,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(40,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(41,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(42,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(43,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(44,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(45,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(49,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(50,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(52,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(53,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(54,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(55,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(58,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(58,30): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(58,58): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(59,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(59,30): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(60,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(60,30): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(61,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(61,30): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(62,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(63,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(71,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(72,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(73,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(74,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(75,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(76,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(77,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(78,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(80,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(81,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(82,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(83,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(86,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(87,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(88,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(89,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(90,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(91,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(92,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(95,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(98,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(99,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(100,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(101,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(102,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(105,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(108,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(109,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(111,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(112,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(113,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(114,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(117,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(126,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(127,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(128,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(129,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(130,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(131,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(132,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(133,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(135,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(136,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(137,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(138,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(140,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(141,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(142,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(143,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(144,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(145,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(146,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(148,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(150,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(151,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(152,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(153,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(154,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(156,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(159,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(160,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(162,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(163,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(164,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(165,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(169,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(179,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(179,23): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(179,44): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(179,65): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(180,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(180,23): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(180,65): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(183,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(183,23): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(183,44): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(183,65): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(184,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(184,23): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(184,65): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(187,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(187,23): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(187,44): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(187,65): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(188,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(188,23): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(188,65): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(191,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(191,23): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(191,44): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(191,65): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(192,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(192,23): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(192,65): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(197,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(197,23): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(197,44): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(197,65): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(198,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(198,23): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(198,65): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(201,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(201,23): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(201,44): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(201,65): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(202,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(202,23): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(202,65): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(205,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(205,23): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(205,44): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(205,65): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(206,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(206,23): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(206,65): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(209,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(209,23): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(209,44): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(209,65): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(210,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(210,23): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(210,65): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(218,28): run-time error CSS1039: Token not allowed after unary operator: '-bg'
(218,44): run-time error CSS1039: Token not allowed after unary operator: '-ink'
(228,81): run-time error CSS1039: Token not allowed after unary operator: '-ink'
(233,14): run-time error CSS1039: Token not allowed after unary operator: '-blue'
(233,64): run-time error CSS1039: Token not allowed after unary operator: '-fast'
(234,20): run-time error CSS1039: Token not allowed after unary operator: '-blue-l'
(236,39): run-time error CSS1039: Token not allowed after unary operator: '-blue'
(237,28): run-time error CSS1047: Expected number or percentage value in rgb function, found 'var('
(237,32): run-time error CSS1046: Expect comma, found '-'
(237,33): run-time error CSS1047: Expected number or percentage value in rgb function, found '-accent-rgb'
(237,44): run-time error CSS1046: Expect comma, found ')'
(237,51): run-time error CSS1062: Expected semicolon or closing curly-brace, found ')'
(237,64): run-time error CSS1039: Token not allowed after unary operator: '-ink'
(239,22): run-time error CSS1039: Token not allowed after unary operator: '-w'
(240,29): run-time error CSS1039: Token not allowed after unary operator: '-w-narrow'
(242,48): run-time error CSS1039: Token not allowed after unary operator: '-accent'
(242,68): run-time error CSS1039: Token not allowed after unary operator: '-on-accent'
(242,129): run-time error CSS1039: Token not allowed after unary operator: '-r-sm'
(247,60): run-time error CSS1039: Token not allowed after unary operator: '-blue'
(254,69): run-time error CSS1039: Token not allowed after unary operator: '-r-sm'
(256,30): run-time error CSS1039: Token not allowed after unary operator: '-fast'
(256,55): run-time error CSS1039: Token not allowed after unary operator: '-fast'
(256,73): run-time error CSS1039: Token not allowed after unary operator: '-fast'
(257,29): run-time error CSS1039: Token not allowed after unary operator: '-fast'
(257,52): run-time error CSS1039: Token not allowed after unary operator: '-fast'
(263,47): run-time error CSS1039: Token not allowed after unary operator: '-accent'
(263,61): run-time error CSS1039: Token not allowed after unary operator: '-accent-d'
(263,84): run-time error CSS1039: Token not allowed after unary operator: '-on-accent'
(264,35): run-time error CSS1047: Expected number or percentage value in rgb function, found 'var('
(264,39): run-time error CSS1046: Expect comma, found '-'
(264,40): run-time error CSS1047: Expected number or percentage value in rgb function, found '-accent-rgb'
(264,51): run-time error CSS1046: Expect comma, found ')'
(264,58): run-time error CSS1062: Expected semicolon or closing curly-brace, found ')'
(265,25): run-time error CSS1039: Token not allowed after unary operator: '-on-accent'
(265,70): run-time error CSS1047: Expected number or percentage value in rgb function, found 'var('
(265,74): run-time error CSS1046: Expect comma, found '-'
(265,75): run-time error CSS1047: Expected number or percentage value in rgb function, found '-accent-rgb'
(265,86): run-time error CSS1046: Expect comma, found ')'
(265,93): run-time error CSS1062: Expected semicolon or closing curly-brace, found ')'
(267,47): run-time error CSS1039: Token not allowed after unary operator: '-amber'
(267,60): run-time error CSS1039: Token not allowed after unary operator: '-amber-d'
(267,82): run-time error CSS1039: Token not allowed after unary operator: '-on-amber'
(268,35): run-time error CSS1047: Expected number or percentage value in rgb function, found 'var('
(268,39): run-time error CSS1046: Expect comma, found '-'
(268,40): run-time error CSS1047: Expected number or percentage value in rgb function, found '-amber-rgb'
(268,50): run-time error CSS1046: Expect comma, found ')'
(268,57): run-time error CSS1062: Expected semicolon or closing curly-brace, found ')'
(269,25): run-time error CSS1039: Token not allowed after unary operator: '-on-amber'
(269,69): run-time error CSS1047: Expected number or percentage value in rgb function, found 'var('
(269,73): run-time error CSS1046: Expect comma, found '-'
(269,74): run-time error CSS1047: Expected number or percentage value in rgb function, found '-amber-rgb'
(269,84): run-time error CSS1046: Expect comma, found ')'
(269,91): run-time error CSS1062: Expected semicolon or closing curly-brace, found ')'
(271,24): run-time error CSS1039: Token not allowed after unary operator: '-panel-2'
(271,45): run-time error CSS1039: Token not allowed after unary operator: '-ink'
(271,69): run-time error CSS1039: Token not allowed after unary operator: '-line-2'
(271,94): run-time error CSS1039: Token not allowed after unary operator: '-edge'
(272,30): run-time error CSS1039: Token not allowed after unary operator: '-panel-3'
(272,51): run-time error CSS1039: Token not allowed after unary operator: '-ink'
(272,75): run-time error CSS1039: Token not allowed after unary operator: '-line-3'
(274,26): run-time error CSS1039: Token not allowed after unary operator: '-line-2'
(274,46): run-time error CSS1039: Token not allowed after unary operator: '-ink'
(275,30): run-time error CSS1039: Token not allowed after unary operator: '-panel-2'
(275,58): run-time error CSS1039: Token not allowed after unary operator: '-blue'
(275,76): run-time error CSS1039: Token not allowed after unary operator: '-ink'
(276,25): run-time error CSS1039: Token not allowed after unary operator: '-ink'
(284,32): run-time error CSS1039: Token not allowed after unary operator: '-line'
(285,19): run-time error CSS1039: Token not allowed after unary operator: '-hdr-bg'
(288,30): run-time error CSS1039: Token not allowed after unary operator: '-slow'
(288,55): run-time error CSS1039: Token not allowed after unary operator: '-slow'
(288,78): run-time error CSS1039: Token not allowed after unary operator: '-slow'
(290,28): run-time error CSS1039: Token not allowed after unary operator: '-hdr-bg-stuck'
(290,59): run-time error CSS1039: Token not allowed after unary operator: '-sh-2'
(293,103): run-time error CSS1039: Token not allowed after unary operator: '-ink'
(294,38): run-time error CSS1039: Token not allowed after unary operator: '-blue'
(295,46): run-time error CSS1039: Token not allowed after unary operator: '-ink'
(299,85): run-time error CSS1039: Token not allowed after unary operator: '-dim'
(301,25): run-time error CSS1039: Token not allowed after unary operator: '-fast'
(301,48): run-time error CSS1039: Token not allowed after unary operator: '-fast'
(303,59): run-time error CSS1039: Token not allowed after unary operator: '-ink'
(304,24): run-time error CSS1039: Token not allowed after unary operator: '-ink'
(304,46): run-time error CSS1039: Token not allowed after unary operator: '-blue-a'
(307,73): run-time error CSS1039: Token not allowed after unary operator: '-dim'
(308,25): run-time error CSS1039: Token not allowed after unary operator: '-line'
(308,87): run-time error CSS1039: Token not allowed after unary operator: '-fast'
(309,31): run-time error CSS1039: Token not allowed after unary operator: '-blue'
(309,49): run-time error CSS1039: Token not allowed after unary operator: '-ink'
(309,92): run-time error CSS1039: Token not allowed after unary operator: '-blue-a'
(310,70): run-time error CSS1039: Token not allowed after unary operator: '-ink-2'
(311,23): run-time error CSS1039: Token not allowed after unary operator: '-ink'
(312,60): run-time error CSS1039: Token not allowed after unary operator: '-line'
(313,44): run-time error CSS1039: Token not allowed after unary operator: '-ink'
(319,19): run-time error CSS1039: Token not allowed after unary operator: '-glass-solid'
(321,25): run-time error CSS1039: Token not allowed after unary operator: '-line-2'
(321,53): run-time error CSS1039: Token not allowed after unary operator: '-r'
(322,69): run-time error CSS1039: Token not allowed after unary operator: '-sh-3'
(326,39): run-time error CSS1039: Token not allowed after unary operator: '-blue'
(327,89): run-time error CSS1039: Token not allowed after unary operator: '-dim'
(328,74): run-time error CSS1039: Token not allowed after unary operator: '-fast'
(329,26): run-time error CSS1039: Token not allowed after unary operator: '-ink'
(330,76): run-time error CSS1039: Token not allowed after unary operator: '-teal'
(336,32): run-time error CSS1039: Token not allowed after unary operator: '-line'
(344,19): run-time error CSS1039: Token not allowed after unary operator: '-scrim-hero'
(349,49): run-time error CSS1047: Expected number or percentage value in rgb function, found 'var('
(349,53): run-time error CSS1046: Expect comma, found '-'
(349,54): run-time error CSS1047: Expected number or percentage value in rgb function, found '-accent-rgb'
(349,65): run-time error CSS1046: Expect comma, found ')'
(349,89): run-time error CSS1062: Expected semicolon or closing curly-brace, found ')'
(358,42): run-time error CSS1039: Token not allowed after unary operator: '-accent'
(359,28): run-time error CSS1047: Expected number or percentage value in rgb function, found 'var('
(359,32): run-time error CSS1046: Expect comma, found '-'
(359,33): run-time error CSS1047: Expected number or percentage value in rgb function, found '-accent-rgb'
(359,44): run-time error CSS1046: Expect comma, found ')'
(359,51): run-time error CSS1062: Expected semicolon or closing curly-brace, found ')'
(360,23): run-time error CSS1039: Token not allowed after unary operator: '-ink-2'
(365,77): run-time error CSS1039: Token not allowed after unary operator: '-teal'
(366,25): run-time error CSS1039: Token not allowed after unary operator: '-teal-b'
(366,50): run-time error CSS1039: Token not allowed after unary operator: '-teal-a'
(371,83): run-time error CSS1039: Token not allowed after unary operator: '-line'
(372,25): run-time error CSS1039: Token not allowed after unary operator: '-line'
(372,51): run-time error CSS1039: Token not allowed after unary operator: '-r'
(373,48): run-time error CSS1039: Token not allowed after unary operator: '-glass-2'
(378,39): run-time error CSS1039: Token not allowed after unary operator: '-dim'
(382,19): run-time error CSS1039: Token not allowed after unary operator: '-glass'
(382,49): run-time error CSS1039: Token not allowed after unary operator: '-line-2'
(382,77): run-time error CSS1039: Token not allowed after unary operator: '-r-lg'
(383,32): run-time error CSS1039: Token not allowed after unary operator: '-sh-3'
(383,44): run-time error CSS1039: Token not allowed after unary operator: '-edge'
(387,77): run-time error CSS1039: Token not allowed after unary operator: '-dim'
(388,29): run-time error CSS1039: Token not allowed after unary operator: '-teal'
(389,92): run-time error CSS1039: Token not allowed after unary operator: '-teal'
(390,29): run-time error CSS1039: Token not allowed after unary operator: '-teal-a'
(393,22): run-time error CSS1039: Token not allowed after unary operator: '-gap'
(393,59): run-time error CSS1039: Token not allowed after unary operator: '-line'
(394,43): run-time error CSS1039: Token not allowed after unary operator: '-bg-2'
(396,45): run-time error CSS1047: Expected number or percentage value in rgb function, found 'var('
(396,49): run-time error CSS1046: Expect comma, found '-'
(396,50): run-time error CSS1047: Expected number or percentage value in rgb function, found '-accent-rgb'
(396,61): run-time error CSS1046: Expect comma, found ')'
(396,85): run-time error CSS1062: Expected semicolon or closing curly-brace, found ')'
(398,45): run-time error CSS1047: Expected number or percentage value in rgb function, found 'var('
(398,49): run-time error CSS1046: Expect comma, found '-'
(398,50): run-time error CSS1047: Expected number or percentage value in rgb function, found '-amber-rgb'
(398,60): run-time error CSS1046: Expect comma, found ')'
(398,84): run-time error CSS1062: Expected semicolon or closing curly-brace, found ')'
(402,39): run-time error CSS1039: Token not allowed after unary operator: '-blue'
(404,35): run-time error CSS1039: Token not allowed after unary operator: '-amber'
(406,21): run-time error CSS1039: Token not allowed after unary operator: '-dim'
(414,60): run-time error CSS1039: Token not allowed after unary operator: '-r'
(414,80): run-time error CSS1039: Token not allowed after unary operator: '-panel'
(415,25): run-time error CSS1039: Token not allowed after unary operator: '-line'
(418,33): run-time error CSS1039: Token not allowed after unary operator: '-ease'
(420,19): run-time error CSS1039: Token not allowed after unary operator: '-scrim-img'
(431,25): run-time error CSS1039: Token not allowed after unary operator: '-line'
(431,51): run-time error CSS1039: Token not allowed after unary operator: '-r'
(431,71): run-time error CSS1039: Token not allowed after unary operator: '-panel'
(432,19): run-time error CSS1039: Token not allowed after unary operator: '-sh-1'
(432,31): run-time error CSS1039: Token not allowed after unary operator: '-edge'
(433,29): run-time error CSS1039: Token not allowed after unary operator: '-slow'
(433,54): run-time error CSS1039: Token not allowed after unary operator: '-slow'
(433,77): run-time error CSS1039: Token not allowed after unary operator: '-slow'
(433,100): run-time error CSS1039: Token not allowed after unary operator: '-slow'
(436,78): run-time error CSS1039: Token not allowed after unary operator: '-r'
(436,87): run-time error CSS1039: Token not allowed after unary operator: '-r'
(438,28): run-time error CSS1039: Token not allowed after unary operator: '-panel-2'
(439,21): run-time error CSS1039: Token not allowed after unary operator: '-line-3'
(439,46): run-time error CSS1039: Token not allowed after unary operator: '-sh-2'
(439,58): run-time error CSS1039: Token not allowed after unary operator: '-edge'
(440,27): run-time error CSS1039: Token not allowed after unary operator: '-blue-l'
(442,73): run-time error CSS1039: Token not allowed after unary operator: '-blue'
(444,64): run-time error CSS1039: Token not allowed after unary operator: '-fast'
(445,19): run-time error CSS1039: Token not allowed after unary operator: '-dim'
(447,31): run-time error CSS1039: Token not allowed after unary operator: '-blue'
(448,30): run-time error CSS1039: Token not allowed after unary operator: '-blue-l'
(449,44): run-time error CSS1039: Token not allowed after unary operator: '-fast'
(456,33): run-time error CSS1039: Token not allowed after unary operator: '-ease'
(456,53): run-time error CSS1039: Token not allowed after unary operator: '-slow'
(458,19): run-time error CSS1039: Token not allowed after unary operator: '-scrim-card'
(465,38): run-time error CSS1039: Token not allowed after unary operator: '-line'
(465,64): run-time error CSS1039: Token not allowed after unary operator: '-r'
(466,19): run-time error CSS1039: Token not allowed after unary operator: '-panel'
(466,47): run-time error CSS1039: Token not allowed after unary operator: '-slow'
(468,53): run-time error CSS1039: Token not allowed after unary operator: '-panel-2'
(468,81): run-time error CSS1039: Token not allowed after unary operator: '-line-3'
(469,46): run-time error CSS1039: Token not allowed after unary operator: '-sh-2'
(470,30): run-time error CSS1039: Token not allowed after unary operator: '-blue-l'
(471,68): run-time error CSS1039: Token not allowed after unary operator: '-r-sm'
(471,91): run-time error CSS1039: Token not allowed after unary operator: '-bg-2'
(472,25): run-time error CSS1039: Token not allowed after unary operator: '-line'
(475,72): run-time error CSS1039: Token not allowed after unary operator: '-ease'
(477,78): run-time error CSS1039: Token not allowed after unary operator: '-teal'
(479,68): run-time error CSS1039: Token not allowed after unary operator: '-fast'
(480,23): run-time error CSS1039: Token not allowed after unary operator: '-dim'
(485,67): run-time error CSS1039: Token not allowed after unary operator: '-line'
(486,46): run-time error CSS1039: Token not allowed after unary operator: '-dim'
(486,72): run-time error CSS1039: Token not allowed after unary operator: '-fast'
(487,31): run-time error CSS1039: Token not allowed after unary operator: '-line-3'
(487,51): run-time error CSS1039: Token not allowed after unary operator: '-ink-2'
(488,29): run-time error CSS1039: Token not allowed after unary operator: '-panel-2'
(488,50): run-time error CSS1039: Token not allowed after unary operator: '-ink'
(488,74): run-time error CSS1039: Token not allowed after unary operator: '-line-2'
(492,59): run-time error CSS1039: Token not allowed after unary operator: '-line'
(492,85): run-time error CSS1039: Token not allowed after unary operator: '-r-lg'
(493,19): run-time error CSS1039: Token not allowed after unary operator: '-panel'
(494,19): run-time error CSS1039: Token not allowed after unary operator: '-sh-1'
(494,31): run-time error CSS1039: Token not allowed after unary operator: '-edge'
(494,58): run-time error CSS1039: Token not allowed after unary operator: '-slow'
(496,32): run-time error CSS1039: Token not allowed after unary operator: '-amber-b'
(496,58): run-time error CSS1039: Token not allowed after unary operator: '-sh-2'
(496,70): run-time error CSS1039: Token not allowed after unary operator: '-edge'
(498,80): run-time error CSS1039: Token not allowed after unary operator: '-r-lg'
(498,92): run-time error CSS1039: Token not allowed after unary operator: '-r-lg'
(501,21): run-time error CSS1039: Token not allowed after unary operator: '-dim'
(502,81): run-time error CSS1039: Token not allowed after unary operator: '-amber'
(503,62): run-time error CSS1039: Token not allowed after unary operator: '-amber-b'
(504,19): run-time error CSS1039: Token not allowed after unary operator: '-amber-a'
(504,48): run-time error CSS1039: Token not allowed after unary operator: '-r-sm'
(510,87): run-time error CSS1039: Token not allowed after unary operator: '-dim-2'
(515,59): run-time error CSS1039: Token not allowed after unary operator: '-line'
(515,85): run-time error CSS1039: Token not allowed after unary operator: '-r'
(516,19): run-time error CSS1039: Token not allowed after unary operator: '-panel'
(517,19): run-time error CSS1039: Token not allowed after unary operator: '-sh-1'
(517,31): run-time error CSS1039: Token not allowed after unary operator: '-edge'
(517,58): run-time error CSS1039: Token not allowed after unary operator: '-slow'
(519,79): run-time error CSS1039: Token not allowed after unary operator: '-teal-b'
(520,19): run-time error CSS1039: Token not allowed after unary operator: '-sh-2'
(520,31): run-time error CSS1039: Token not allowed after unary operator: '-edge'
(523,79): run-time error CSS1039: Token not allowed after unary operator: '-r'
(523,88): run-time error CSS1039: Token not allowed after unary operator: '-r'
(525,88): run-time error CSS1039: Token not allowed after unary operator: '-teal'
(527,65): run-time error CSS1039: Token not allowed after unary operator: '-fast'
(528,27): run-time error CSS1039: Token not allowed after unary operator: '-ink'
(529,61): run-time error CSS1039: Token not allowed after unary operator: '-dim-2'
(533,14): run-time error CSS1039: Token not allowed after unary operator: '-on-img-accent'
(536,25): run-time error CSS1039: Token not allowed after unary operator: '-line'
(536,59): run-time error CSS1039: Token not allowed after unary operator: '-blue'
(536,85): run-time error CSS1039: Token not allowed after unary operator: '-r'
(537,37): run-time error CSS1039: Token not allowed after unary operator: '-panel'
(537,70): run-time error CSS1039: Token not allowed after unary operator: '-edge'
(539,73): run-time error CSS1039: Token not allowed after unary operator: '-ink-2'
(540,62): run-time error CSS1039: Token not allowed after unary operator: '-dim-2'
(543,25): run-time error CSS1039: Token not allowed after unary operator: '-line'
(543,51): run-time error CSS1039: Token not allowed after unary operator: '-r'
(543,84): run-time error CSS1039: Token not allowed after unary operator: '-panel'
(545,15): run-time error CSS1039: Token not allowed after unary operator: '-logo-filter'
(545,61): run-time error CSS1039: Token not allowed after unary operator: '-slow'
(547,63): run-time error CSS1039: Token not allowed after unary operator: '-dim-2'
(550,75): run-time error CSS1039: Token not allowed after unary operator: '-dim-2'
(552,22): run-time error CSS1039: Token not allowed after unary operator: '-dim-2'
(553,28): run-time error CSS1039: Token not allowed after unary operator: '-dim'
(555,49): run-time error CSS1039: Token not allowed after unary operator: '-gap'
(555,84): run-time error CSS1039: Token not allowed after unary operator: '-line'
(557,65): run-time error CSS1039: Token not allowed after unary operator: '-ink-2'
(562,39): run-time error CSS1039: Token not allowed after unary operator: '-blue'
(565,51): run-time error CSS1039: Token not allowed after unary operator: '-ink-2'
(566,56): run-time error CSS1039: Token not allowed after unary operator: '-ink'
(567,56): run-time error CSS1039: Token not allowed after unary operator: '-ink'
(568,21): run-time error CSS1039: Token not allowed after unary operator: '-dim'
(569,26): run-time error CSS1039: Token not allowed after unary operator: '-ink'
(570,65): run-time error CSS1039: Token not allowed after unary operator: '-dim'
(572,39): run-time error CSS1039: Token not allowed after unary operator: '-blue-b'
(573,31): run-time error CSS1039: Token not allowed after unary operator: '-r'
(573,57): run-time error CSS1039: Token not allowed after unary operator: '-line'
(574,84): run-time error CSS1039: Token not allowed after unary operator: '-r-sm'
(575,43): run-time error CSS1039: Token not allowed after unary operator: '-line'
(576,27): run-time error CSS1039: Token not allowed after unary operator: '-panel-2'
(577,60): run-time error CSS1039: Token not allowed after unary operator: '-dim'
(581,38): run-time error CSS1039: Token not allowed after unary operator: '-line'
(581,64): run-time error CSS1039: Token not allowed after unary operator: '-r'
(582,19): run-time error CSS1039: Token not allowed after unary operator: '-panel'
(582,47): run-time error CSS1039: Token not allowed after unary operator: '-slow'
(583,35): run-time error CSS1039: Token not allowed after unary operator: '-line-3'
(583,60): run-time error CSS1039: Token not allowed after unary operator: '-panel-2'
(585,67): run-time error CSS1039: Token not allowed after unary operator: '-blue'
(586,25): run-time error CSS1039: Token not allowed after unary operator: '-blue-b'
(586,50): run-time error CSS1039: Token not allowed after unary operator: '-blue-a'
(589,21): run-time error CSS1039: Token not allowed after unary operator: '-dim'
(591,28): run-time error CSS1039: Token not allowed after unary operator: '-line'
(591,54): run-time error CSS1039: Token not allowed after unary operator: '-r'
(591,90): run-time error CSS1039: Token not allowed after unary operator: '-panel'
(592,43): run-time error CSS1039: Token not allowed after unary operator: '-line'
(595,87): run-time error CSS1039: Token not allowed after unary operator: '-ink'
(596,30): run-time error CSS1039: Token not allowed after unary operator: '-fast'
(597,36): run-time error CSS1039: Token not allowed after unary operator: '-panel-2'
(599,44): run-time error CSS1039: Token not allowed after unary operator: '-blue'
(602,44): run-time error CSS1039: Token not allowed after unary operator: '-panel-2'
(603,42): run-time error CSS1039: Token not allowed after unary operator: '-dim'
(606,29): run-time error CSS1039: Token not allowed after unary operator: '-line-2'
(608,47): run-time error CSS1047: Expected number or percentage value in rgb function, found 'var('
(608,51): run-time error CSS1046: Expect comma, found '-'
(608,52): run-time error CSS1047: Expected number or percentage value in rgb function, found '-accent-rgb'
(608,63): run-time error CSS1046: Expect comma, found ')'
(608,87): run-time error CSS1062: Expected semicolon or closing curly-brace, found ')'
(613,24): run-time error CSS1039: Token not allowed after unary operator: '-dim'
(616,31): run-time error CSS1039: Token not allowed after unary operator: '-amber-b'
(616,57): run-time error CSS1039: Token not allowed after unary operator: '-amber-a'
(616,78): run-time error CSS1039: Token not allowed after unary operator: '-amber'
(617,40): run-time error CSS1039: Token not allowed after unary operator: '-r-sm'
(620,22): run-time error CSS1039: Token not allowed after unary operator: '-bg-2'
(620,40): run-time error CSS1039: Token not allowed after unary operator: '-dim'
(620,92): run-time error CSS1039: Token not allowed after unary operator: '-line'
(623,39): run-time error CSS1039: Token not allowed after unary operator: '-blue'
(624,19): run-time error CSS1039: Token not allowed after unary operator: '-dim'
(625,25): run-time error CSS1039: Token not allowed after unary operator: '-ink'
(626,24): run-time error CSS1039: Token not allowed after unary operator: '-ink'
(627,73): run-time error CSS1039: Token not allowed after unary operator: '-dim'
(630,69): run-time error CSS1039: Token not allowed after unary operator: '-line'
(632,69): run-time error CSS1039: Token not allowed after unary operator: '-dim-2'
(638,29): run-time error CSS1039: Token not allowed after unary operator: '-fast'
(638,52): run-time error CSS1039: Token not allowed after unary operator: '-fast'
(651,32): run-time error CSS1039: Token not allowed after unary operator: '-ease'
(651,59): run-time error CSS1039: Token not allowed after unary operator: '-ease'
(668,21): run-time error CSS1039: Token not allowed after unary operator: '-glass-solid'
(670,34): run-time error CSS1039: Token not allowed after unary operator: '-line-2'
(671,44): run-time error CSS1039: Token not allowed after unary operator: '-sh-3'
(673,34): run-time error CSS1039: Token not allowed after unary operator: '-line'
(688,32): run-time error CSS1039: Token not allowed after unary operator: '-glass-solid'
(690,31): run-time error CSS1039: Token not allowed after unary operator: '-line-2'
(691,28): run-time error CSS1039: Token not allowed after unary operator: '-ink'
(693,48): run-time error CSS1039: Token not allowed after unary operator: '-line'
(724,14): run-time error CSS1039: Token not allowed after unary operator: '-blue'
(725,23): run-time error CSS1039: Token not allowed after unary operator: '-dim'
(734,23): run-time error CSS1039: Token not allowed after unary operator: '-amber'
(746,35): run-time error CSS1039: Token not allowed after unary operator: '-on-img'
(747,24): run-time error CSS1046: Expect comma, found '247'
(747,32): run-time error CSS1046: Expect comma, found '/'
(748,22): run-time error CSS1039: Token not allowed after unary operator: '-on-img-accent'
(749,28): run-time error CSS1039: Token not allowed after unary operator: '-on-img'
(750,32): run-time error CSS1039: Token not allowed after unary operator: '-on-img-accent'
(761,41): run-time error CSS1039: Token not allowed after unary operator: '-line'
(762,32): run-time error CSS1039: Token not allowed after unary operator: '-fast'
(762,55): run-time error CSS1039: Token not allowed after unary operator: '-fast'
(764,36): run-time error CSS1039: Token not allowed after unary operator: '-accent'
(764,61): run-time error CSS1039: Token not allowed after unary operator: '-accent-a'
(766,42): run-time error CSS1039: Token not allowed after unary operator: '-accent'
(766,60): run-time error CSS1039: Token not allowed after unary operator: '-ink'
(767,28): run-time error CSS1047: Expected number or percentage value in rgb function, found 'var('
(767,32): run-time error CSS1046: Expect comma, found '-'
(767,33): run-time error CSS1047: Expected number or percentage value in rgb function, found '-accent-rgb'
(767,44): run-time error CSS1046: Expect comma, found ')'
(767,51): run-time error CSS1062: Expected semicolon or closing curly-brace, found ')'
(772,19): run-time error CSS1039: Token not allowed after unary operator: '-glass-solid'
(772,55): run-time error CSS1039: Token not allowed after unary operator: '-line-2'
(773,22): run-time error CSS1039: Token not allowed after unary operator: '-r'
(773,42): run-time error CSS1039: Token not allowed after unary operator: '-sh-3'
(778,84): run-time error CSS1039: Token not allowed after unary operator: '-line'
(780,39): run-time error CSS1039: Token not allowed after unary operator: '-dim'
(782,47): run-time error CSS1039: Token not allowed after unary operator: '-line'
(785,14): run-time error CSS1039: Token not allowed after unary operator: '-dim'
(785,57): run-time error CSS1039: Token not allowed after unary operator: '-fast'
(787,55): run-time error CSS1039: Token not allowed after unary operator: '-line'
(788,36): run-time error CSS1039: Token not allowed after unary operator: '-ink'
(788,58): run-time error CSS1039: Token not allowed after unary operator: '-panel-2'
(791,19): run-time error CSS1039: Token not allowed after unary operator: '-accent'
(791,39): run-time error CSS1039: Token not allowed after unary operator: '-on-accent'
(795,28): run-time error CSS1046: Expect comma, found '255'
(795,36): run-time error CSS1046: Expect comma, found '/'
(796,29): run-time error CSS1039: Token not allowed after unary operator: '-fast'
(796,52): run-time error CSS1039: Token not allowed after unary operator: '-fast'
(809,66): run-time error CSS1039: Token not allowed after unary operator: '-bg'
(809,86): run-time error CSS1039: Token not allowed after unary operator: '-accent'
 */
/* ============================================================================
   ICOM Industries — public site
   Design direction A · "Blueprint", premium execution.

   Same DNA as the direction that was approved: dark ground, hairline rules,
   monospace identifiers, precision over persuasion. What changed is the
   execution — a wider type scale, real depth instead of flat panels, image-led
   sections, and motion that stays out of the way.

   Structure:
     01 tokens            06 sections & headers
     02 base              07 cards, grids, media
     03 buttons           08 detail pages
     04 header & nav      09 footer & floating actions
     05 hero              10 responsive, motion, print
   ============================================================================ */

/* ------------------------------------------------------------- 01 tokens
   Two independent axes, both stamped on <html> by the server:

     data-ground = dark | light          the surface the site sits on
     data-accent = blue | teal | amber | violet    the primary signal colour

   Every rule below section 01 is written against role tokens (--bg, --ink,
   --accent …), never against a literal. That is what lets eight combinations
   share one set of rules — and it is also the thing to preserve: a colour
   declared straight into a rule is a colour that will be wrong in one theme.

   The older names --blue / --teal / --amber are kept as aliases so the rest
   of the sheet, and the inline styles still living in a few views, keep
   working. --amber stays fixed on purpose: it marks the retail / exam line
   of business, which is a meaning, not a preference.
   -------------------------------------------------------------------------- */

:root{
  /* geometry and motion — identical in every theme */
  --r:14px;
  --r-sm:9px;
  --r-lg:20px;
  --ease:cubic-bezier(.22,.61,.36,1);
  --fast:.18s var(--ease);
  --slow:.42s var(--ease);
  --w:1200px;
  --w-narrow:920px;
  --gap:clamp(64px,8vw,116px);

  /* tints are derived from whichever accent is active, so they are declared
     once here and follow the accent automatically */
  --on-img:#F2F7FC;
  --on-img-accent:#3BE8CE;

  --accent-a:rgb(var(--accent-rgb) / .10);
  --accent-b:rgb(var(--accent-rgb) / .26);
  --accent-2-a:rgb(var(--accent-2-rgb) / .10);
  --accent-2-b:rgb(var(--accent-2-rgb) / .26);

  /* compatibility aliases — the rest of the sheet speaks in these */
  --blue:var(--accent);      --blue-d:var(--accent-d);   --blue-l:var(--accent-l);
  --blue-a:var(--accent-a);  --blue-b:var(--accent-b);
  --teal:var(--accent-2);    --teal-d:var(--accent-2-d);
  --teal-a:var(--accent-2-a);--teal-b:var(--accent-2-b);
  --ent:var(--accent);
  --ret:var(--amber);
}

/* ====================================================== GROUND: dark ===== */
/* Bare :root carries the dark set, so a document with no data-ground still
   renders the Blueprint identity rather than an unstyled half-theme. */
:root,
:root[data-ground="dark"]{
  --bg:#0A1420;
  --bg-2:#08111C;
  --panel:#0F1E2E;
  --panel-2:#132539;
  --panel-3:#172B41;
  --line:#1C3247;
  --line-2:#27455F;
  --line-3:#33566F;

  --ink:#E8F0F8;
  --ink-2:#C3D4E4;
  --dim:#8FA6BC;
  --dim-2:#7C93A9;

  /* the retail / exam line, and error */
  --amber:#FFB347;
  --amber-d:#E89A2E;
  --amber-a:rgba(255,179,71,.10);
  --amber-b:rgba(255,179,71,.28);
  --amber-rgb:255 179 71;
  --on-amber:#1A1103;
  --red:#FF6B6B;

  /* text that sits ON a filled accent button */
  --on-accent:#04121F;

  /* translucent surfaces */
  --glass:rgba(15,30,46,.78);
  --glass-2:rgba(15,30,46,.66);
  --glass-solid:rgba(15,30,46,.97);
  --hdr-bg:rgba(8,17,28,.72);
  --hdr-bg-stuck:rgba(8,17,28,.94);

  /* scrims laid over photography */
  --scrim-hero:linear-gradient(100deg,var(--bg) 6%,rgba(10,20,32,.90) 34%,
               rgba(10,20,32,.45) 62%,rgba(10,20,32,.72) 100%),
               linear-gradient(180deg,rgba(8,17,28,.55),transparent 26%,rgba(10,20,32,.92));
  --scrim-img:linear-gradient(180deg,transparent 46%,rgba(8,17,28,.72));
  --scrim-card:linear-gradient(175deg,rgba(10,20,32,.10) 0%,rgba(10,20,32,.62) 46%,rgba(8,17,28,.94) 88%);

  --edge:inset 0 1px 0 rgba(255,255,255,.055);
  --sh-1:0 1px 2px rgba(0,0,0,.35);
  --sh-2:0 10px 26px -12px rgba(0,0,0,.65);
  --sh-3:0 26px 60px -22px rgba(0,0,0,.80);

  /* the sample art is light-on-dark, so on this ground it needs no help */
  --logo-filter:grayscale(1) brightness(1.7);

  color-scheme:dark;
}

/* ===================================================== GROUND: light ===== */
/* Not an inversion. A dark-first design flipped mechanically comes out grey
   and washed; this set keeps the same contrast intent with its own values. */
:root[data-ground="light"]{
  --bg:#F6F9FC;
  --bg-2:#FFFFFF;
  --panel:#FFFFFF;
  --panel-2:#F2F6FA;
  --panel-3:#E8EFF7;
  --line:#E2EAF3;
  --line-2:#C9D8E6;
  --line-3:#A7BCD1;

  --ink:#0B1724;
  --ink-2:#2C4155;
  --dim:#57708A;
  --dim-2:#5E7387;

  --amber:#9C5800;
  --amber-d:#7E4700;
  --amber-a:rgba(156,88,0,.09);
  --amber-b:rgba(156,88,0,.26);
  --amber-rgb:156 88 0;
  --on-amber:#FFFFFF;
  --red:#C0392B;

  --on-accent:#FFFFFF;

  --glass:rgba(255,255,255,.82);
  --glass-2:rgba(255,255,255,.72);
  --glass-solid:rgba(255,255,255,.98);
  --hdr-bg:rgba(246,249,252,.80);
  --hdr-bg-stuck:rgba(246,249,252,.96);

  --scrim-hero:linear-gradient(100deg,var(--bg) 6%,rgba(246,249,252,.93) 34%,
               rgba(246,249,252,.52) 62%,rgba(246,249,252,.78) 100%),
               linear-gradient(180deg,rgba(255,255,255,.55),transparent 26%,rgba(246,249,252,.90));
  --scrim-img:linear-gradient(180deg,transparent 52%,rgba(11,23,36,.55));
  --scrim-card:linear-gradient(175deg,rgba(11,23,36,.20) 0%,rgba(11,23,36,.58) 46%,rgba(11,23,36,.88) 88%);

  --edge:inset 0 1px 0 rgba(255,255,255,.9);
  --sh-1:0 1px 2px rgba(13,30,50,.06);
  --sh-2:0 10px 26px -14px rgba(13,30,50,.28);
  --sh-3:0 26px 60px -26px rgba(13,30,50,.38);

  /* the marks are light-on-transparent, so on white they must be inverted
     or they simply disappear */
  --logo-filter:grayscale(1) brightness(.55) contrast(1.6) invert(1) brightness(.42);

  color-scheme:light;
}

/* ====================================================== ACCENT sets ====== */
/* On the dark ground the accent has to glow; on the light ground the same hue
   has to hold contrast against white, so each accent is declared twice. */
:root,
:root[data-accent="blue"]{
  --accent:#4DA3FF;   --accent-d:#2E8AE8;  --accent-l:#8FC6FF;  --accent-rgb:77 163 255;
  --accent-2:#00D2B4; --accent-2-d:#00B39A;                     --accent-2-rgb:0 210 180;
}
:root[data-accent="teal"]{
  --accent:#00D2B4;   --accent-d:#00B39A;  --accent-l:#5BEBD6;  --accent-rgb:0 210 180;
  --accent-2:#4DA3FF; --accent-2-d:#2E8AE8;                     --accent-2-rgb:77 163 255;
}
:root[data-accent="amber"]{
  --accent:#FFB347;   --accent-d:#E89A2E;  --accent-l:#FFD08C;  --accent-rgb:255 179 71;
  --accent-2:#00D2B4; --accent-2-d:#00B39A;                     --accent-2-rgb:0 210 180;
}
:root[data-accent="violet"]{
  --accent:#A78BFA;   --accent-d:#8B6BEA;  --accent-l:#C9B6FF;  --accent-rgb:167 139 250;
  --accent-2:#00D2B4; --accent-2-d:#00B39A;                     --accent-2-rgb:0 210 180;
}

:root[data-ground="light"],
:root[data-ground="light"][data-accent="blue"]{
  --accent:#1665C8;   --accent-d:#0F4E9E;  --accent-l:#0C4183;  --accent-rgb:22 101 200;
  --accent-2:#0A7D71; --accent-2-d:#08655C;                     --accent-2-rgb:10 125 113;
}
:root[data-ground="light"][data-accent="teal"]{
  --accent:#0A7D71;   --accent-d:#08655C;  --accent-l:#065048;  --accent-rgb:10 125 113;
  --accent-2:#1665C8; --accent-2-d:#0F4E9E;                     --accent-2-rgb:22 101 200;
}
:root[data-ground="light"][data-accent="amber"]{
  --accent:#9C5800;   --accent-d:#7E4700;  --accent-l:#653900;  --accent-rgb:156 88 0;
  --accent-2:#0A7D71; --accent-2-d:#08655C;                     --accent-2-rgb:10 125 113;
}
:root[data-ground="light"][data-accent="violet"]{
  --accent:#6D46C8;   --accent-d:#573AA0;  --accent-l:#472F82;  --accent-rgb:109 70 200;
  --accent-2:#0A7D71; --accent-2-d:#08655C;                     --accent-2-rgb:10 125 113;
}

/* --------------------------------------------------------------- 02 base */
*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}

body{
  margin:0;background:var(--bg);color:var(--ink);
  font-family:"IBM Plex Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
  font-size:16.5px;line-height:1.65;
  -webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;
  overflow-x:hidden;
}
:lang(mr) body,.mr{font-family:"Noto Sans Devanagari","IBM Plex Sans",sans-serif;line-height:1.85}

h1,h2,h3,h4,.disp{
  font-family:Archivo,"IBM Plex Sans",sans-serif;font-weight:700;
  letter-spacing:-.028em;margin:0;line-height:1.08;text-wrap:balance;color:var(--ink);
}
h1{letter-spacing:-.034em}
.mono,.id,.k,.idband,code,.eyebrow{font-family:"IBM Plex Mono",ui-monospace,Menlo,Consolas,monospace}
p{margin:0 0 1em}
a{color:var(--blue);text-decoration:none;transition:color var(--fast)}
a:hover{color:var(--blue-l)}
img{max-width:100%;display:block}
:focus-visible{outline:2px solid var(--blue);outline-offset:3px;border-radius:2px}
::selection{background:rgb(var(--accent-rgb) / .30);color:var(--ink)}

.wrap{max-width:var(--w);margin:0 auto;padding:0 clamp(20px,4.5vw,34px)}
.wrap.narrow{max-width:var(--w-narrow)}
.skip{position:absolute;left:-9999px}
.skip:focus{left:12px;top:12px;background:var(--accent);color:var(--on-accent);padding:11px 17px;z-index:200;border-radius:var(--r-sm)}

/* a small, reusable label — used above headings and inside cards */
.eyebrow{
  display:inline-flex;align-items:center;gap:9px;font-size:10.5px;font-weight:600;
  letter-spacing:.17em;text-transform:uppercase;color:var(--blue);
}
.eyebrow::before{content:"";width:16px;height:1px;background:currentColor;opacity:.6}

/* ------------------------------------------------------------ 03 buttons */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:9px;
  padding:13px 22px;border:1px solid transparent;border-radius:var(--r-sm);
  font-weight:600;font-size:14.5px;cursor:pointer;font-family:inherit;line-height:1.3;
  transition:background var(--fast),border-color var(--fast),color var(--fast),
             transform var(--fast),box-shadow var(--fast);
  will-change:transform;
}
.btn:hover{text-decoration:none;transform:translateY(-1px)}
.btn:active{transform:translateY(0)}

.btn-e{background:linear-gradient(180deg,var(--accent),var(--accent-d));color:var(--on-accent);
  box-shadow:0 8px 20px -10px rgb(var(--accent-rgb) / .70),var(--edge)}
.btn-e:hover{color:var(--on-accent);box-shadow:0 14px 30px -12px rgb(var(--accent-rgb) / .85),var(--edge)}

.btn-r{background:linear-gradient(180deg,var(--amber),var(--amber-d));color:var(--on-amber);
  box-shadow:0 8px 20px -10px rgb(var(--amber-rgb) / .70),var(--edge)}
.btn-r:hover{color:var(--on-amber);box-shadow:0 14px 30px -12px rgb(var(--amber-rgb) / .85),var(--edge)}

.btn-d{background:var(--panel-2);color:var(--ink);border-color:var(--line-2);box-shadow:var(--edge)}
.btn-d:hover{background:var(--panel-3);color:var(--ink);border-color:var(--line-3)}

.btn-o{border-color:var(--line-2);color:var(--ink);background:rgba(255,255,255,.02)}
.btn-o:hover{background:var(--panel-2);border-color:var(--blue);color:var(--ink)}
.btn-o.light{color:var(--ink)}

.btn-sm{padding:9px 16px;font-size:13.5px;border-radius:7px}
.btn-lg{padding:16px 28px;font-size:15.5px}

/* --------------------------------------------------- 04 header & nav */
.hdr{
  position:sticky;top:0;z-index:60;
  border-bottom:1px solid var(--line);
  background:var(--hdr-bg);
  -webkit-backdrop-filter:saturate(160%) blur(16px);
  backdrop-filter:saturate(160%) blur(16px);
  transition:background var(--slow),border-color var(--slow),box-shadow var(--slow);
}
.hdr.stuck{background:var(--hdr-bg-stuck);box-shadow:var(--sh-2)}
.hdr-in{display:flex;align-items:center;gap:26px;padding-top:15px;padding-bottom:15px}

.brand{font-family:Archivo,sans-serif;font-weight:800;font-size:20px;letter-spacing:-.04em;color:var(--ink)}
.brand::after{content:".";color:var(--blue)}
.brand:hover{text-decoration:none;color:var(--ink)}

.nav{display:flex;gap:6px;align-items:center}
.nav > a,.nav > .has-mega > button{
  background:none;border:0;font:inherit;font-size:14.5px;font-weight:500;color:var(--dim);
  cursor:pointer;padding:8px 12px;border-radius:7px;display:inline-flex;align-items:center;gap:6px;
  transition:color var(--fast),background var(--fast);
}
.nav > a:hover,.nav > .has-mega > button:hover{color:var(--ink);background:rgba(255,255,255,.04);text-decoration:none}
.nav > a.on{color:var(--ink);background:var(--blue-a)}

.hdr-right{margin-left:auto;display:flex;align-items:center;gap:12px}
.lang{font-family:"IBM Plex Mono",monospace;font-size:12.5px;color:var(--dim);
  border:1px solid var(--line);border-radius:7px;padding:7px 11px;transition:all var(--fast)}
.lang:hover{border-color:var(--blue);color:var(--ink);text-decoration:none;background:var(--blue-a)}
.tel{font-family:"IBM Plex Mono",monospace;font-size:14px;color:var(--ink-2)}
.tel:hover{color:var(--ink)}
.burger{display:none;background:none;border:1px solid var(--line);border-radius:7px;
  font-size:18px;cursor:pointer;color:var(--ink);padding:6px 11px}

/* mega menu */
.has-mega{position:relative}
.mega{
  position:absolute;top:calc(100% + 14px);left:-14px;
  background:var(--glass-solid);
  -webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);
  border:1px solid var(--line-2);border-radius:var(--r);padding:28px;
  display:none;min-width:min(920px,92vw);z-index:70;box-shadow:var(--sh-3);
}
.has-mega.open .mega{display:grid;grid-template-columns:repeat(4,1fr);gap:26px}
.mega h3{font-family:"IBM Plex Mono",monospace;font-size:10.5px;letter-spacing:.16em;
  text-transform:uppercase;color:var(--blue);font-weight:600;margin-bottom:14px}
.mega a{display:grid;grid-template-columns:28px 1fr;gap:8px;font-size:13.5px;color:var(--dim);
  padding:7px 8px;margin-left:-8px;border-radius:6px;transition:all var(--fast)}
.mega a:hover{color:var(--ink);text-decoration:none;background:rgba(255,255,255,.05)}
.mega a .c{font-family:"IBM Plex Mono",monospace;font-size:11px;color:var(--teal)}

/* ---------------------------------------------------------------- 05 hero */
.hero{
  position:relative;overflow:hidden;isolation:isolate;
  padding:clamp(70px,9vw,132px) 0 clamp(58px,7vw,96px);
  border-bottom:1px solid var(--line);
}
/* the art itself — a real image, so the copy on top stays HTML */
.hero-art{position:absolute;top:0;left:0;right:0;bottom:0;z-index:-2}
.hero-art img{width:100%;height:100%;object-fit:cover;object-position:70% 50%}
/* scrim: keeps the headline legible whatever the image does */
.hero::before{
  content:"";position:absolute;top:0;left:0;right:0;bottom:0;z-index:-1;
  background:var(--scrim-hero);
}
/* fallback texture when no banner image is set */
.hero.no-art{
  background:
    radial-gradient(1100px 520px at 74% 34%,rgb(var(--accent-rgb) / .16),transparent 68%),
    radial-gradient(760px 420px at 12% 88%,rgb(var(--accent-2-rgb) / .08),transparent 70%),
    repeating-linear-gradient(90deg,rgb(var(--accent-rgb) / .035) 0 1px,transparent 1px 72px),
    repeating-linear-gradient(0deg,rgb(var(--accent-rgb) / .035) 0 1px,transparent 1px 72px);
}
.hero.no-art::before{display:none}

.hero-grid{display:grid;grid-template-columns:1.08fr .92fr;gap:clamp(34px,5vw,64px);align-items:center}
.hero h1{font-size:clamp(36px,5.6vw,68px);font-weight:800;line-height:1.02;max-width:16ch}
.hero h1 em{font-style:normal;color:var(--accent);
  text-shadow:0 0 44px rgb(var(--accent-rgb) / .38)}
.hero .sub{color:var(--ink-2);font-size:clamp(17px,1.5vw,19.5px);margin:24px 0 34px;max-width:50ch;line-height:1.6}
.hero .acts{display:flex;gap:13px;flex-wrap:wrap}

.tag{
  display:inline-flex;gap:9px;align-items:center;font-family:"IBM Plex Mono",monospace;
  font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--teal);
  border:1px solid var(--teal-b);background:var(--teal-a);padding:7px 13px;
  border-radius:100px;margin-bottom:24px;
  -webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);
}

.metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);
  border:1px solid var(--line);border-radius:var(--r);overflow:hidden;margin-top:46px}
.metrics div{padding:20px 18px;background:var(--glass-2);
  -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.metrics b{display:block;font-family:Archivo,sans-serif;font-size:clamp(22px,2.4vw,30px);
  font-weight:700;font-variant-numeric:tabular-nums;letter-spacing:-.03em;margin-bottom:2px}
.metrics span{font-family:"IBM Plex Mono",monospace;font-size:10px;letter-spacing:.12em;
  text-transform:uppercase;color:var(--dim)}

/* the cluster diagram, now a floating glass panel */
.diagram{
  background:var(--glass);border:1px solid var(--line-2);border-radius:var(--r-lg);
  padding:24px;box-shadow:var(--sh-3),var(--edge);
  -webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);
}
.diagram .dh{display:flex;justify-content:space-between;font-family:"IBM Plex Mono",monospace;
  font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--dim);margin-bottom:16px}
.diagram .dh .ok{color:var(--teal);display:inline-flex;align-items:center;gap:7px}
.diagram .dh .ok::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--teal);
  box-shadow:0 0 0 3px var(--teal-a)}

/* ------------------------------------------------------------ 06 sections */
section{padding:var(--gap) 0;border-bottom:1px solid var(--line);position:relative}
section.dark,section.wash{background:var(--bg-2)}
section.wash{background:
  radial-gradient(900px 400px at 84% 0%,rgb(var(--accent-rgb) / .07),transparent 70%),var(--bg-2)}
section.dark{background:
  radial-gradient(900px 420px at 16% 0%,rgb(var(--amber-rgb) / .07),transparent 70%),var(--bg-2)}

.shead{margin-bottom:clamp(34px,4vw,52px);max-width:78ch}
.shead .k{display:inline-flex;align-items:center;gap:9px;font-size:11px;letter-spacing:.17em;
  text-transform:uppercase;color:var(--blue);font-weight:600;margin-bottom:16px}
.shead .k::after{content:"";width:26px;height:1px;background:currentColor;opacity:.45}
section.dark .shead .k{color:var(--amber)}
.shead h2{font-size:clamp(28px,3.6vw,44px);letter-spacing:-.032em}
.shead p{color:var(--dim);margin:16px 0 0;font-size:17px;max-width:64ch;line-height:1.62}

/* ------------------------------------------------- 07 cards, grids, media */
.g4{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.g3{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.g2{display:grid;grid-template-columns:repeat(2,1fr);gap:20px}

/* ratio box — works everywhere, no aspect-ratio dependency */
.shot{position:relative;overflow:hidden;border-radius:var(--r);background:var(--panel);
  border:1px solid var(--line)}
.shot::before{content:"";display:block;padding-top:62.5%}
.shot > img{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover;
  transition:transform .7s var(--ease)}
.shot::after{content:"";position:absolute;top:0;left:0;right:0;bottom:0;pointer-events:none;
  background:var(--scrim-img);opacity:0}
/* only where something is actually laid over the picture */
.case > .shot::after,.page-hero .shot::after{opacity:1}
.shot.tall::before{padding-top:125%}
.shot.wide::before{padding-top:44%}
.shot.square::before{padding-top:100%}
.shot.plain::after{display:none}

/* the workhorse card */
.blk{
  position:relative;display:flex;flex-direction:column;color:inherit;overflow:hidden;
  border:1px solid var(--line);border-radius:var(--r);background:var(--panel);
  box-shadow:var(--sh-1),var(--edge);
  transition:transform var(--slow),border-color var(--slow),box-shadow var(--slow),background var(--slow);
}
.blk{padding:24px 22px}
.blk > .shot:first-child{margin:-24px -22px 20px;border:0;border-radius:var(--r) var(--r) 0 0}
.blk > .shot:first-child > img{filter:saturate(1.12) brightness(1.1)}
.blk:hover{background:var(--panel-2);text-decoration:none;transform:translateY(-3px);
  border-color:var(--line-3);box-shadow:var(--sh-2),var(--edge)}
a.blk:hover h3{color:var(--blue-l)}
a.blk:hover .shot > img{transform:scale(1.055)}
.blk .n{font-family:"IBM Plex Mono",monospace;font-size:11px;color:var(--blue);
  margin-bottom:11px;letter-spacing:.06em}
.blk h3{font-size:18px;margin-bottom:9px;transition:color var(--fast)}
.blk p{color:var(--dim);font-size:14.5px;margin:0}
.blk .more{margin-top:auto;padding-top:18px;font-family:"IBM Plex Mono",monospace;
  font-size:11.5px;color:var(--blue);display:inline-flex;align-items:center;gap:7px}
a.blk:hover .more{color:var(--blue-l)}
a.blk .more span{transition:transform var(--fast);display:inline-block}
a.blk:hover .more span{transform:translateX(4px)}

/* division cards carry art behind the text */
.dcard{position:relative;min-height:228px;justify-content:flex-end;isolation:isolate;padding:24px 22px}
.dcard .bg{position:absolute;top:0;left:0;right:0;bottom:0;z-index:-2;overflow:hidden}
.dcard .bg img{width:100%;height:100%;object-fit:cover;opacity:.9;
  transition:transform .8s var(--ease),opacity var(--slow)}
.dcard::after{content:"";position:absolute;top:0;left:0;right:0;bottom:0;z-index:-1;
  background:var(--scrim-card)}
.dcard:hover .bg img{transform:scale(1.07);opacity:1}

/* service index — a scannable list with a thumbnail */
.svc-list{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
.svc-row{
  display:grid;grid-template-columns:96px 1fr;gap:18px;align-items:center;
  padding:14px;border:1px solid var(--line);border-radius:var(--r);color:inherit;
  background:var(--panel);transition:all var(--slow);
}
.svc-row:hover{text-decoration:none;background:var(--panel-2);border-color:var(--line-3);
  transform:translateY(-2px);box-shadow:var(--sh-2)}
.svc-row:hover h3{color:var(--blue-l)}
.svc-row .pic{position:relative;overflow:hidden;border-radius:var(--r-sm);background:var(--bg-2);
  border:1px solid var(--line)}
.svc-row .pic::before{content:"";display:block;padding-top:72%}
.svc-row .pic img{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover;
  filter:saturate(1.15) brightness(1.12);transition:transform .7s var(--ease)}
.svc-row:hover .pic img{transform:scale(1.08)}
.svc-row .id{font-family:"IBM Plex Mono",monospace;font-size:11px;color:var(--teal);
  letter-spacing:.08em;display:block;margin-bottom:4px}
.svc-row h3{font-size:16px;margin-bottom:5px;transition:color var(--fast)}
.svc-row p{color:var(--dim);font-size:13.5px;margin:0;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.svc-row .go{display:none}

.chips{display:flex;gap:9px;flex-wrap:wrap;margin-top:26px}
.chip{font-family:"IBM Plex Mono",monospace;border:1px solid var(--line);border-radius:100px;
  padding:6px 13px;font-size:12px;color:var(--dim);transition:all var(--fast)}
.chip:hover{border-color:var(--line-3);color:var(--ink-2)}
.chip.solid{background:var(--panel-2);color:var(--ink);border-color:var(--line-2)}

/* --------------------------------------------------------------- products */
.pcard{
  position:relative;overflow:hidden;border:1px solid var(--line);border-radius:var(--r-lg);
  background:var(--panel);display:flex;flex-direction:column;
  box-shadow:var(--sh-1),var(--edge);transition:all var(--slow);
}
.pcard:hover{border-color:var(--amber-b);box-shadow:var(--sh-2),var(--edge)}
.pcard{padding:28px}
.pcard > .shot:first-child{margin:-28px -28px 24px;border:0;border-radius:var(--r-lg) var(--r-lg) 0 0}
.pcard .shot::before{padding-top:56%}
.pcard h3{font-size:22px;margin-bottom:10px}
.pcard p{color:var(--dim);margin:0 0 20px;font-size:15px}
.pcard .tiers{font-family:"IBM Plex Mono",monospace;font-size:12.5px;color:var(--amber);
  margin-bottom:22px;padding:11px 14px;border:1px solid var(--amber-b);
  background:var(--amber-a);border-radius:var(--r-sm)}
.pcard .acts{display:flex;gap:11px;flex-wrap:wrap;margin-top:auto}

/* a strip of product screenshots */
.gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:26px}
.gallery figure{margin:0}
.gallery figcaption{font-family:"IBM Plex Mono",monospace;font-size:11.5px;color:var(--dim-2);
  margin-top:10px;line-height:1.5}

/* --------------------------------------------------- case / evidence */
.case{
  position:relative;overflow:hidden;border:1px solid var(--line);border-radius:var(--r);
  background:var(--panel);display:flex;flex-direction:column;color:inherit;
  box-shadow:var(--sh-1),var(--edge);transition:all var(--slow);
}
.case:hover{text-decoration:none;transform:translateY(-3px);border-color:var(--teal-b);
  box-shadow:var(--sh-2),var(--edge)}
.case:hover .shot > img{transform:scale(1.06)}
.case{padding:24px 22px}
.case > .shot:first-child{margin:-24px -22px 20px;border:0;border-radius:var(--r) var(--r) 0 0}
.case .shot::before{padding-top:58%}
.case .metric{font-family:Archivo,sans-serif;font-weight:800;font-size:34px;color:var(--teal);
  line-height:1;margin-bottom:12px;letter-spacing:-.03em}
.case h3{font-size:17px;margin-bottom:9px;transition:color var(--fast)}
.case:hover h3{color:var(--ink)}
.case .who{font-family:"IBM Plex Mono",monospace;color:var(--dim-2);font-size:11.5px;
  margin-top:auto;padding-top:18px}
/* the metric can also sit on the image */
.case .shot .metric{position:absolute;left:20px;bottom:16px;margin:0;z-index:2;
  color:var(--on-img-accent);text-shadow:0 2px 18px rgba(0,0,0,.85)}

.quote{
  border:1px solid var(--line);border-left:2px solid var(--blue);border-radius:var(--r);
  padding:26px 24px;background:var(--panel);margin:0;box-shadow:var(--edge);
}
.quote p{font-size:16.5px;line-height:1.6;margin-bottom:16px;color:var(--ink-2)}
.quote .who{font-family:"IBM Plex Mono",monospace;color:var(--dim-2);font-size:11.5px;line-height:1.7}

.logos{display:grid;grid-template-columns:repeat(6,1fr);gap:14px;align-items:center;
  border:1px solid var(--line);border-radius:var(--r);padding:10px;background:var(--panel)}
.logos img{height:74px;width:100%;object-fit:contain;padding:16px 14px;
  filter:var(--logo-filter);opacity:.55;transition:all var(--slow)}
.logos img:hover{filter:none;opacity:1}
.logos .name{font-family:"IBM Plex Mono",monospace;color:var(--dim-2);font-size:13px;text-align:center}

/* ------------------------------------------------------- 08 detail pages */
.crumbs{font-family:"IBM Plex Mono",monospace;font-size:11.5px;color:var(--dim-2);
  padding-top:20px;padding-bottom:20px}
.crumbs a{color:var(--dim-2)}
.crumbs a:hover{color:var(--dim)}

.page-hero{padding-top:18px;padding-bottom:var(--gap);border-bottom:1px solid var(--line);position:relative}
.page-hero h1{font-size:clamp(32px,4.6vw,56px);max-width:20ch}
.page-hero .intro{font-size:clamp(17px,1.5vw,19.5px);color:var(--ink-2);max-width:62ch;
  margin:22px 0 0;line-height:1.6}
.page-hero .shot{margin-top:40px}
.page-hero .shot::before{padding-top:38%}
.idband{display:inline-flex;align-items:center;gap:9px;font-size:11px;letter-spacing:.17em;
  text-transform:uppercase;color:var(--blue);margin-bottom:18px}
.idband::before{content:"";width:18px;height:1px;background:currentColor;opacity:.6}

.prose{max-width:70ch;font-size:16.5px;color:var(--ink-2)}
.prose h2{font-size:26px;margin:42px 0 15px;color:var(--ink)}
.prose h3{font-size:19px;margin:30px 0 10px;color:var(--ink)}
.prose p{color:var(--dim)}
.prose strong{color:var(--ink)}
.prose ul,.prose ol{padding-left:22px;margin:0 0 1em;color:var(--dim)}
.prose li{margin-bottom:8px}
.prose a{border-bottom:1px solid var(--blue-b)}
.prose img{border-radius:var(--r);border:1px solid var(--line);margin:24px 0}
.prose table{width:100%;border-collapse:collapse;margin:0 0 1em;border-radius:var(--r-sm);overflow:hidden}
.prose th,.prose td{border:1px solid var(--line);padding:11px 14px;text-align:left;font-size:14.5px}
.prose th{background:var(--panel-2);font-family:"IBM Plex Mono",monospace;font-size:11px;
  letter-spacing:.11em;text-transform:uppercase;color:var(--dim)}

.steps{counter-reset:s;list-style:none;padding:0;margin:0}
.steps li{counter-increment:s;display:grid;grid-template-columns:52px 1fr;gap:18px;
  padding:22px;border:1px solid var(--line);border-radius:var(--r);margin-bottom:12px;
  background:var(--panel);transition:all var(--slow)}
.steps li:hover{border-color:var(--line-3);background:var(--panel-2)}
.steps li::before{content:counter(s,decimal-leading-zero);
  font-family:"IBM Plex Mono",monospace;font-size:14px;color:var(--blue);
  border:1px solid var(--blue-b);background:var(--blue-a);border-radius:8px;
  width:40px;height:40px;display:flex;align-items:center;justify-content:center}
.steps h3{font-size:17px;margin-bottom:6px}
.steps p{color:var(--dim);font-size:14.5px;margin:0}

.faq{border:1px solid var(--line);border-radius:var(--r);overflow:hidden;background:var(--panel)}
.faq details{border-bottom:1px solid var(--line)}
.faq details:last-child{border-bottom:0}
.faq summary{cursor:pointer;padding:20px 24px;font-weight:600;font-size:16.5px;list-style:none;
  display:flex;justify-content:space-between;gap:20px;align-items:baseline;color:var(--ink);
  transition:background var(--fast)}
.faq summary:hover{background:var(--panel-2)}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";color:var(--blue);font-family:"IBM Plex Mono",monospace;
  font-size:19px;flex:0 0 auto}
.faq details[open] summary::after{content:"–"}
.faq details[open] summary{background:var(--panel-2)}
.faq .a{padding:4px 24px 22px;color:var(--dim);max-width:74ch}

.cta-band{
  border-top:1px solid var(--line-2);border-bottom:0;position:relative;overflow:hidden;
  background:
    radial-gradient(880px 400px at 50% 0%,rgb(var(--accent-rgb) / .14),transparent 70%),
    var(--bg-2);
}
.cta-band .wrap{position:relative;z-index:1;text-align:center}
.cta-band h2{font-size:clamp(28px,3.8vw,44px);max-width:22ch;margin:0 auto}
.cta-band p{color:var(--dim);max-width:58ch;margin:18px auto 30px;font-size:17px}
.cta-band .acts{justify-content:center}

.notice{border:1px solid var(--amber-b);background:var(--amber-a);color:var(--amber);
  padding:15px 19px;border-radius:var(--r-sm);font-size:14.5px;margin-bottom:28px}

/* ------------------------------------------- 09 footer & floating actions */
.ftr{background:var(--bg-2);color:var(--dim);padding:64px 0 28px;border-top:1px solid var(--line)}
.ftr-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:38px}
.ftr h4{font-family:"IBM Plex Mono",monospace;font-weight:600;font-size:10.5px;letter-spacing:.17em;
  text-transform:uppercase;color:var(--blue);margin-bottom:16px}
.ftr a{color:var(--dim);display:block;padding:5px 0;font-size:14.5px}
.ftr a:hover{color:var(--ink);text-decoration:none}
.ftr .brand{color:var(--ink);font-size:22px;display:block;margin-bottom:12px}
.ftr .tag{background:none;border:0;padding:0;margin:0 0 10px;color:var(--dim);font-size:14.5px;
  max-width:36ch;display:block;font-family:inherit;letter-spacing:0;text-transform:none;
  -webkit-backdrop-filter:none;backdrop-filter:none}
.ftr-btm{margin-top:46px;padding-top:22px;border-top:1px solid var(--line);
  display:flex;gap:20px;flex-wrap:wrap;align-items:center;
  font-family:"IBM Plex Mono",monospace;font-size:11.5px;color:var(--dim-2)}
.ftr-btm .r{margin-left:auto}

.wa{position:fixed;right:20px;bottom:20px;z-index:80;background:#25D366;color:#04121F;
  width:56px;height:56px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  font-weight:700;font-size:13px;box-shadow:0 10px 30px -8px rgba(37,211,102,.6);
  transition:transform var(--fast),box-shadow var(--fast)}
.wa:hover{text-decoration:none;color:#04121F;transform:scale(1.06);
  box-shadow:0 14px 36px -8px rgba(37,211,102,.75)}
.mobile-bar{display:none}

/* ------------------------------------------- 10 responsive, motion, print */

/* reveal on scroll; JS adds .in. Without JS nothing is ever hidden. */
/* Default is VISIBLE. Only once an inline script has proved scripting works
   does .js appear on <html> and the reveal animation take over - so a broken
   or blocked script file can never leave the page blank. */
.rise{opacity:1;transform:none}
.js .rise{opacity:0;transform:translateY(18px);
  transition:opacity .65s var(--ease),transform .65s var(--ease)}
.js .rise.in{opacity:1;transform:none}

@media (max-width:1100px){
  .ftr-grid{grid-template-columns:1fr 1fr}
  .g4{grid-template-columns:1fr 1fr}
  .logos{grid-template-columns:repeat(3,1fr)}
}
@media (max-width:900px){
  .g3{grid-template-columns:1fr 1fr}
  .gallery{grid-template-columns:1fr 1fr}
  .svc-list{grid-template-columns:1fr}
}
@media (max-width:820px){
  .nav{display:none}
  .burger{display:block}
  .hdr.open .nav{display:flex;position:absolute;top:100%;left:0;right:0;
    background:var(--glass-solid);
    -webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);
    border-bottom:1px solid var(--line-2);flex-direction:column;align-items:stretch;gap:0;
    padding:14px 24px 22px;box-shadow:var(--sh-3)}
  .hdr.open .nav > a,.hdr.open .nav > .has-mega > button{padding:13px 0;border-radius:0;
    border-bottom:1px solid var(--line);justify-content:space-between}
  .hdr.open .has-mega.open .mega{position:static;border:0;padding:8px 0 14px;
    grid-template-columns:1fr;background:none;box-shadow:none;min-width:0}
  .hero{padding-top:clamp(46px,10vw,70px)}
  .hero-grid{grid-template-columns:1fr}
  .hero h1{max-width:none}
  .diagram{order:0}
  .metrics{grid-template-columns:1fr 1fr}
  .g3,.g2{grid-template-columns:1fr}
  .g4{grid-template-columns:1fr}
  .tel{display:none}
  .hdr-in{gap:12px;padding-top:12px;padding-bottom:12px}
  .hdr-right{gap:8px}
  .wa{bottom:78px}
  .mobile-bar{display:grid;grid-template-columns:repeat(3,1fr);position:fixed;left:0;right:0;bottom:0;
    z-index:75;background:var(--glass-solid);
    -webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);
    border-top:1px solid var(--line-2)}
  .mobile-bar a{color:var(--ink);text-align:center;padding:15px 6px;font-size:13px;font-weight:600}
  .mobile-bar a:hover{text-decoration:none}
  .mobile-bar a + a{border-left:1px solid var(--line)}
  body{padding-bottom:54px}
}
@media (max-width:620px){
  .ftr-grid{grid-template-columns:1fr}
  .gallery{grid-template-columns:1fr}
  .logos{grid-template-columns:1fr 1fr}
  .svc-row{grid-template-columns:74px 1fr;gap:14px}
  .metrics{grid-template-columns:1fr 1fr}
  .acts .btn{width:100%}
  .hero .acts .btn,.cta-band .acts .btn{width:auto;flex:1 1 auto}
  .hdr .btn,.hdr-right .btn{width:auto}
}

@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.01ms !important;animation-iteration-count:1 !important;
    transition-duration:.01ms !important}
  .rise,.js .rise{opacity:1 !important;transform:none !important}
}

@media print{
  .hdr,.ftr,.wa,.mobile-bar,.cta-band{display:none}
  body{background:#fff;color:#000}
  section{border:0;padding:14px 0}
}

/* ------------------------------------------------------------ error pages */
.err{min-height:70vh;display:flex;align-items:center;justify-content:center;padding:40px 20px}
.err-box{max-width:540px;text-align:center}
.err-box h1{font-family:"IBM Plex Mono",monospace;font-size:clamp(46px,8vw,88px);
  color:var(--blue);margin-bottom:16px;letter-spacing:-.03em}
.err-box p{color:var(--dim);margin-bottom:26px}

/* ------------------------------------------------ 11 small utilities
   Added with the image-led homepage. Kept at the end so the sections above
   stay readable as a system rather than a pile of one-offs. */
.acts{display:flex;gap:13px;flex-wrap:wrap;align-items:center}
.mb-lg{margin-bottom:44px}
.shot{display:block}
.dcard .bg{display:block}
.pcard .pt{color:var(--amber);font-size:11px;letter-spacing:.07em;margin-bottom:10px}

/* a card whose image is its subject wants the picture to breathe, so the
   division tiles get a taller box than the article cards */
.g4 .dcard h3{font-size:19px}
.g4 .dcard p{font-size:14px;
  display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}

/* ------------------------------------------- 12 text laid over photography
   The sample art is dark in both themes, so anything printed on top of it
   must take its colour from the on-image tokens rather than from the ground.
   Without this the light theme prints navy text on a near-black picture. */
.dcard h3,.dcard .more{color:var(--on-img)}
.dcard p{color:rgb(242 247 252 / .76)}
.dcard .n{color:var(--on-img-accent)}
.dcard:hover h3{color:var(--on-img)}
a.dcard:hover .more{color:var(--on-img-accent)}

/* ------------------------------------------------------- 13 theme picker
   Ground and accent are separate choices, so the control shows them as two
   separate rows rather than cycling one button through eight states. The
   swatches are painted from literals on purpose: a swatch has to show the
   colour it will apply, not the colour that is currently active. */
.theme{position:relative}
.theme-btn{
  display:flex;align-items:center;justify-content:center;
  width:34px;height:34px;padding:0;cursor:pointer;
  background:none;border:1px solid var(--line);border-radius:7px;
  transition:border-color var(--fast),background var(--fast);
}
.theme-btn:hover{border-color:var(--accent);background:var(--accent-a)}
.theme-dot{width:14px;height:14px;border-radius:50%;
  background:linear-gradient(140deg,var(--accent) 50%,var(--ink) 50%);
  box-shadow:0 0 0 1px rgb(var(--accent-rgb) / .45)}

.theme-pop{
  position:absolute;top:calc(100% + 10px);right:0;z-index:90;display:none;
  min-width:236px;padding:16px;
  background:var(--glass-solid);border:1px solid var(--line-2);
  border-radius:var(--r);box-shadow:var(--sh-3);
  -webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);
}
.theme.open .theme-pop{display:block}
.theme-row{display:flex;align-items:center;justify-content:space-between;gap:16px}
.theme-row + .theme-row{margin-top:14px;padding-top:14px;border-top:1px solid var(--line)}
.theme-lbl{font-family:"IBM Plex Mono",monospace;font-size:10px;letter-spacing:.15em;
  text-transform:uppercase;color:var(--dim)}

.theme-seg{display:flex;border:1px solid var(--line);border-radius:7px;overflow:hidden}
.theme-seg button{
  background:none;border:0;cursor:pointer;font:inherit;font-size:12.5px;font-weight:500;
  color:var(--dim);padding:6px 12px;transition:all var(--fast);
}
.theme-seg button + button{border-left:1px solid var(--line)}
.theme-seg button:hover{color:var(--ink);background:var(--panel-2)}
:root[data-ground="dark"] .theme-seg button[data-ground-set="dark"],
:root[data-ground="light"] .theme-seg button[data-ground-set="light"]{
  background:var(--accent);color:var(--on-accent)}

.theme-swatches{display:flex;gap:8px}
.sw{width:22px;height:22px;padding:0;cursor:pointer;border-radius:50%;
  border:1px solid rgb(255 255 255 / .22);
  transition:transform var(--fast),box-shadow var(--fast)}
.sw:hover{transform:scale(1.12)}
.sw-blue{background:#4DA3FF}
.sw-teal{background:#00D2B4}
.sw-amber{background:#FFB347}
.sw-violet{background:#A78BFA}
:root[data-ground="light"] .sw-blue{background:#1665C8}
:root[data-ground="light"] .sw-teal{background:#0A7D71}
:root[data-ground="light"] .sw-amber{background:#A85F00}
:root[data-ground="light"] .sw-violet{background:#6D46C8}
:root[data-accent="blue"]   .sw-blue,
:root[data-accent="teal"]   .sw-teal,
:root[data-accent="amber"]  .sw-amber,
:root[data-accent="violet"] .sw-violet{box-shadow:0 0 0 2px var(--bg),0 0 0 4px var(--accent)}

@media (max-width:820px){
  .theme-pop{right:auto;left:50%;transform:translateX(-50%)}
}

