8787 margin-top : 1.5rem ;
8888}
8989
90+ /* Pipeline Section */
91+ .pipeline-section {
92+ padding : 24px 0 ;
93+ background : var (--bg-light );
94+ border-bottom : 1px solid var (--border );
95+ }
96+
97+ .pipeline-flow {
98+ display : flex;
99+ align-items : center;
100+ justify-content : center;
101+ gap : 0.75rem ;
102+ flex-wrap : wrap;
103+ }
104+
105+ .pipeline-step {
106+ display : flex;
107+ align-items : center;
108+ gap : 0.5rem ;
109+ background : white;
110+ padding : 0.5rem 1rem ;
111+ border-radius : 0.5rem ;
112+ border : 1px solid var (--border );
113+ font-size : 0.9rem ;
114+ font-weight : 600 ;
115+ color : var (--secondary );
116+ }
117+
118+ .pipeline-icon {
119+ color : var (--primary );
120+ font-size : 1rem ;
121+ }
122+
123+ .pipeline-arrow {
124+ color : var (--text-light );
125+ font-size : 0.85rem ;
126+ }
127+
90128/* Hugging Face Section */
91129.huggingface-section {
92130 padding : 80px 0 ;
@@ -104,12 +142,61 @@ h3 {
104142 background : white;
105143 border : 1px solid # fef3c7 ;
106144 box-shadow : 0 4px 6px -1px rgba (0 , 0 , 0 , 0.05 );
145+ padding : 1.5rem ;
146+ border-radius : 0.75rem ;
107147}
108148
109149.hf-card : hover {
110150 border-color : # facc15 ;
111151}
112152
153+ .grid-3 {
154+ display : grid;
155+ grid-template-columns : repeat (auto-fit, minmax (280px , 1fr ));
156+ gap : 1.5rem ;
157+ }
158+
159+ .code-inline {
160+ margin-top : 1rem ;
161+ background : # 1e293b ;
162+ color : # e2e8f0 ;
163+ padding : 0.5rem 0.75rem ;
164+ border-radius : 0.375rem ;
165+ font-family : 'Menlo' , 'Monaco' , monospace;
166+ font-size : 0.8rem ;
167+ overflow-x : auto;
168+ }
169+
170+ .btn-hf {
171+ background : # facc15 ;
172+ color : # 1e293b ;
173+ border-color : # facc15 ;
174+ font-weight : 700 ;
175+ }
176+
177+ .btn-hf : hover {
178+ background : # eab308 ;
179+ border-color : # eab308 ;
180+ }
181+
182+ .btn-outline-hero {
183+ border-color : rgba (255 , 255 , 255 , 0.4 );
184+ color : white;
185+ background : rgba (255 , 255 , 255 , 0.1 );
186+ backdrop-filter : blur (5px );
187+ }
188+
189+ .btn-outline-hero : hover {
190+ background : rgba (255 , 255 , 255 , 0.2 );
191+ border-color : rgba (255 , 255 , 255 , 0.6 );
192+ }
193+
194+ .module-desc {
195+ color : var (--text-light );
196+ font-size : 0.9rem ;
197+ margin-bottom : 0.5rem ;
198+ }
199+
113200
114201
115202/* Buttons */
0 commit comments