fix: Remove transparency from mobile buttons and fix landscape layout

Mobile Button Opacity (No Transparency):
- Changed all mobile button backgrounds from rgba(x,x,x,0.5) to rgba(x,x,x,1)
- Added opacity: 1 !important to override base opacity: 0.6 rules
- Buttons now display at full opacity with iOS blur bar backdrop
- Affected buttons: download, print-friendly, shortcuts, info, back-to-top, theme-switcher

Landscape Layout Fix:
- Added single-column grid rule for landscape orientation
- Media query: @media (max-width: 915px) and (orientation: landscape)
- Forces grid-template-columns: 1fr for both page-1 and page-2
- Prevents 2-column layout on iPhone landscape (844px wide)

Files Modified:
- static/css/04-interactive/_scroll-behavior.css: Button opacity overrides
- static/css/05-responsive/_breakpoints.css: Landscape single-column grid
- static/css/color-theme.css: Theme switcher opacity override

Visual Changes:
- Mobile buttons: Full color, no transparency (vibrant appearance)
- Landscape: Single column layout (sidebar top, content below)
- Maintains footer-hovered transparency for footer interaction

static/css/04-interactive/_scroll-behavior.css

@@ -132,13 +132,15 @@
         transform: none !important;
     }
 
-    /* Mobile: Show colors at 50% transparency by default */
+    /* Mobile: Show colors at full opacity (no transparency with blur bar) */
     .download-btn {
-        background: rgba(205, 96, 96, 0.5) !important; /* PDF red at 50% */
+        background: rgba(205, 96, 96, 1) !important; /* PDF red - full opacity */
+        opacity: 1 !important; /* Override base opacity */
     }
 
     .print-friendly-btn {
-        background: rgba(255, 255, 255, 0.5) !important; /* White at 50% */
+        background: rgba(255, 255, 255, 1) !important; /* White - full opacity */
+        opacity: 1 !important; /* Override base opacity */
     }
 
     .print-friendly-btn iconify-icon {
@@ -146,16 +148,18 @@
     }
 
     .shortcuts-btn {
-        background: rgba(243, 156, 18, 0.5) !important; /* Orange at 50% */
+        background: rgba(243, 156, 18, 1) !important; /* Orange - full opacity */
+        opacity: 1 !important; /* Override base opacity */
     }
 
     .info-button {
-        background: rgba(39, 174, 96, 0.5) !important; /* Green at 50% */
+        background: rgba(39, 174, 96, 1) !important; /* Green - full opacity */
+        opacity: 1 !important; /* Override base opacity */
     }
 
     .back-to-top {
-        background: rgba(39, 174, 96, 0.5) !important; /* Green at 50% */
+        background: rgba(39, 174, 96, 1) !important; /* Green - full opacity */
-        opacity: 0.5; /* Semi-transparent by default, full opacity when at-bottom */
+        opacity: 1 !important; /* Full opacity (no transparency with blur bar) */
     }
 
     /* Flexbox container behavior - buttons arrange themselves */

static/css/05-responsive/_breakpoints.css

@@ -699,6 +699,13 @@
    ======================================== */
 
 @media (max-width: 915px) and (orientation: landscape) {
+    /* Force single column layout in landscape mobile */
+    .page-1 .page-content,
+    .page-2 .page-content {
+        grid-template-columns: 1fr !important;
+        grid-template-rows: auto auto;
+    }
+
     /* Reduce header size in landscape */
     .cv-header {
         margin-bottom: 1rem !important;

static/css/color-theme.css

@@ -284,7 +284,7 @@
     right: auto !important;
     width: 50px !important;
     height: 50px !important;
-    /* Removed opacity: 1 !important to allow .footer-hovered to work */
+    opacity: 1 !important; /* Full opacity on mobile (no transparency with blur bar) */
     transform: none !important;
     /* Position before info button: 5 buttons total */
     /* Download, Print, Shortcuts, Theme, Info */
@@ -292,17 +292,20 @@
     left: calc(50% + 35px) !important; /* Fourth button */
   }
 
-  /* Show theme colors at 50% transparency by default on mobile */
+  /* Show theme colors at full opacity on mobile (no transparency with blur bar) */
   .color-theme-switcher[data-theme-mode="light"] {
-    background: rgba(212, 178, 0, 0.5) !important; /* Gold at 50% */
+    background: rgba(212, 178, 0, 1) !important; /* Gold - full opacity */
+    opacity: 1 !important; /* Override base opacity */
   }
 
   .color-theme-switcher[data-theme-mode="dark"] {
-    background: rgba(1, 60, 119, 0.5) !important; /* Blue at 50% */
+    background: rgba(1, 60, 119, 1) !important; /* Blue - full opacity */
+    opacity: 1 !important; /* Override base opacity */
   }
 
   .color-theme-switcher[data-theme-mode="auto"] {
-    background: rgba(155, 89, 182, 0.5) !important; /* Purple at 50% */
+    background: rgba(155, 89, 182, 1) !important; /* Purple - full opacity */
+    opacity: 1 !important; /* Override base opacity */
   }
 
   /* Full color opacity on hover */