enhanced styling

Author: dumartins

examples/Live-Digital-Clock/styles.css

@@ -9,7 +9,7 @@
 body {
     min-height: 100vh;
     font-family: 'Inter', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
-    background: #f5f6fa;
+    background: edf2fb;
     color: #1f2a44;
     display: flex;
     align-items: center;
@@ -25,7 +25,7 @@ body {
 
 .clock-card {
     width: 100%;
-    background: #ffffff;
+    background-color: rgba(202, 240, 248, 0.3);
     border: 1px solid #e4e7ee;
     border-radius: 14px;
     padding: 28px 22px;
@@ -39,16 +39,17 @@ body {
 
 
 .clock-header h1 {
-    font-size: clamp(1.8rem, 3vw, 2.4rem);
+    font-size: clamp(2.4rem, 4vw, 3rem);
+    color: #034078;
     font-weight: 700;
     margin-bottom: 4px;
 }
 
 .subtitle {
-    margin-top: 20px;
-    margin-bottom: 30px;
-    color: #6b7280;
-    font-size: 0.93rem;
+    margin-top: 15px;
+    margin-bottom: 25px;
+    color: #034078;
+    font-size: 1rem;
     line-height: 1.5;
 }
 
@@ -63,7 +64,8 @@ body {
 
 .time-block {
     text-align: center;
-    background: #ffffff;
+    color: #1282a2;
+    background-color: #ffffff;
     border-radius: 10px;
     padding: 10px 8px;
     border: 1px solid #e4e7ee;
@@ -73,8 +75,9 @@ body {
 
 .label {
     display: block;
-    color: #6b7280;
+    color: #034078;
     font-size: 0.85rem;
+    font-weight: 500;
     margin-bottom: 4px;
 }
 
@@ -89,16 +92,16 @@ body {
     text-align: center;
     font-size: clamp(2rem, 5vw, 2.4rem);
     font-weight: 700;
-    color: #2563eb;
+    color: #81c3d7;
     padding: 0 3px;
 }
 
 .ampm {
     justify-self: end;
     padding: 10px 12px;
     border-radius: 10px;
-    background: #e8f1ff;
-    color: #1d4ed8;
+    background: #34a0a4;
+    color: #ffffff;
     font-weight: 600;
     border: 1px solid #d6e5ff;
     letter-spacing: 0.05em;
@@ -116,12 +119,12 @@ body {
 }
 
 .controls button {
-    background: #2563eb;
+    background: #34a0a4;
     color: #ffffff;
     border: none;
     border-radius: 10px;
     padding: 12px 16px;
-    font-weight: 600;
+    font-weight: 700;
     cursor: pointer;
     transition: transform 0.15s ease, box-shadow 0.15s ease;
     box-shadow: 0 8px 18px rgba(37, 99, 235, 0.25);