diff --git a/buy.html b/buy.html
index 4d3d34a7..f99accc9 100644
--- a/buy.html
+++ b/buy.html
@@ -40,29 +40,118 @@
padding: 40px 20px;
}
- .buy-header {
- text-align: center;
- margin-bottom: 50px;
- }
-
- .buy-header h1 {
- font-size: 3rem;
- color: #1565c0;
- margin-bottom: 10px;
- }
-
- .buy-header p {
- font-size: 1.2rem;
- color: #666;
- }
-
- body.dark-mode .buy-header h1 {
- color: #4299e1;
- }
-
- body.dark-mode .buy-header p {
- color: #e2e8f0;
- }
+ /* ---------- HEADER ---------- */
+ .header {
+ position: fixed;
+ top: 0; left: 0; right: 0;
+ background: linear-gradient(180deg, rgba(255, 255, 255, .95), rgba(255, 255, 255, .9));
+ backdrop-filter: blur(20px);
+ border-bottom: 1px solid var(--vehigo-border);
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ padding: 1rem 2rem;
+ box-shadow: var(--shadow-1);
+ z-index: 1000;
+ transition: all 0.3s ease;
+ }
+
+ body.dark-mode .header {
+ background: linear-gradient(180deg, rgba(16, 25, 39, .95), rgba(16, 25, 39, .9));
+ }
+
+ .logo img {
+ height: 45px;
+ transition: transform 0.3s ease;
+ }
+
+ .logo:hover img {
+ transform: scale(1.05);
+ }
+
+ .dark-mode .logo img {
+ filter: brightness(0) invert(1);
+ opacity: 1;
+ transition: opacity 0.3s ease;
+ }
+
+ .dark-mode .logo:hover img {
+ opacity: 0.8;
+ }
+
+ .navbar .navbar-list {
+ display: flex;
+ gap: 2rem;
+ list-style: none;
+ margin: 0; padding: 0;
+ }
+
+ .navbar-link {
+ text-decoration: none;
+ font-weight: 600;
+ color: var(--vehigo-text);
+ padding: 8px 16px;
+ border-radius: var(--radius-md);
+ transition: all 0.3s ease;
+ position: relative;
+ }
+
+ .navbar-link:hover {
+ color: var(--vehigo-primary);
+ background: rgba(37, 99, 235, .08);
+ }
+
+ .navbar-link.active {
+ color: var(--vehigo-primary);
+ background: linear-gradient(90deg, rgba(37, 99, 235, .12), rgba(78, 127, 180, .12));
+ }
+
+ /* ---------- THEME SWITCH ---------- */
+ .theme-switch {
+ display: flex;
+ align-items: center;
+ cursor: pointer;
+ margin-left: 1rem;
+ }
+
+ .theme-switch input { display: none; }
+
+ .slider {
+ display: flex;
+ align-items: center;
+ gap: 0.5rem;
+ }
+
+ .btn-outline-light {
+ width: 100px;
+ height: 40px;
+ border-radius: var(--radius-md);
+ border: 1px solid var(--vehigo-border);
+ background: var(--vehigo-card);
+ color: var(--vehigo-text);
+ font-weight: 600;
+ font-size: 0.9rem;
+ cursor: pointer;
+ transition: all 0.3s ease;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ gap: 6px;
+ box-shadow: var(--shadow-1);
+ }
+
+ .btn-outline-light:hover {
+ transform: translateY(-2px);
+ box-shadow: var(--shadow-2);
+ background: linear-gradient(90deg, var(--vehigo-primary), var(--vehigo-primary-2));
+ color: white;
+ }
+
+ body.dark-mode .btn-outline-light {
+ background: var(--vehigo-card);
+ color: var(--vehigo-text);
+ border-color: var(--vehigo-border);
+ }
.filters-section {
background: rgba(255, 255, 255, 0.95);
@@ -619,67 +708,30 @@
-
+
-
-
-
-