From 7065ee730e69543f8e31c15198ec638033d83991 Mon Sep 17 00:00:00 2001
From: Keith Casko <kcasko@wgu.edu>
Date: Tue, 6 Oct 2026 10:52:59 -0400
Subject: [PATCH] Simplify hero and expand experience section

---
 css/styles.css | 39 ++++++++++++++++++++++------
 index.html     | 70 ++++++++++++++++++++++++--------------------------
 2 files changed, 64 insertions(+), 45 deletions(-)

diff --git a/css/styles.css b/css/styles.css
index 551730b..8833186 100644
--- a/css/styles.css
+++ b/css/styles.css
@@ -197,8 +197,8 @@ section { padding: 64px 0; }
   box-shadow: 0 2px 6px rgba(16, 38, 61, 0.06);
   padding: 40px;
   display: grid;
-  grid-template-columns: 1.1fr 1fr;
-  gap: 40px;
+  grid-template-columns: 1fr;
+  gap: 24px;
   align-items: center;
 }
 .hero h1 { font-size: 34px; margin-bottom: 18px; line-height: 1.2; }
@@ -211,6 +211,25 @@ section { padding: 64px 0; }
   margin-top: 24px;
 }
 
+.hero-facts {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 8px 10px;
+  margin-top: 24px;
+  padding-top: 18px;
+  border-top: 1px solid var(--rule-soft);
+}
+
+.hero-facts span {
+  background: #eef2f6;
+  border: 1px solid var(--rule);
+  border-radius: 3px;
+  padding: 6px 9px;
+  font-size: 12.5px;
+  color: var(--muted-2);
+  font-weight: 600;
+}
+
 .btn {
   display: inline-flex;
   align-items: center;
@@ -483,15 +502,14 @@ section { padding: 64px 0; }
 /* ---------- About ---------- */
 .about-grid {
   display: grid;
-  grid-template-columns: .9fr 1.45fr 1fr;
+  grid-template-columns: minmax(240px, .8fr) 1.7fr;
   gap: 24px;
-  align-items: stretch;
+  align-items: start;
 }
 .about-photo {
   background: #e9edf1;
   border: 1px solid var(--rule);
   border-radius: 3px;
-  aspect-ratio: 1 / 1;
   overflow: hidden;
 }
 .about-text {
@@ -544,6 +562,12 @@ section { padding: 64px 0; }
   grid-template-columns: 1fr 1fr;
   gap: 24px;
 }
+
+.experience-grid {
+  display: grid;
+  grid-template-columns: repeat(2, minmax(0, 1fr));
+  gap: 24px;
+}
 .panel {
   background: var(--panel);
   border: 1px solid var(--rule);
@@ -620,6 +644,7 @@ section { padding: 64px 0; }
   .skills-grid { grid-template-columns: repeat(2, 1fr); }
   .about-grid { grid-template-columns: 1fr; }
   .two-col { grid-template-columns: 1fr; }
+  .experience-grid { grid-template-columns: 1fr; }
   .contact-cta { flex-direction: column; align-items: flex-start; }
 }
 
@@ -654,9 +679,7 @@ section { padding: 64px 0; }
 
 .about-headshot {
   width: 100%;
-  height: 100%;
-  object-fit: cover;
-  object-position: center 20%;
+  height: auto;
   display: block;
 }
 
diff --git a/index.html b/index.html
index add5af9..b2e0c5e 100644
--- a/index.html
+++ b/index.html
@@ -66,15 +66,12 @@
               <a class="btn btn-primary" href="#projects">View Projects</a>
               <a class="btn btn-secondary" href="assets/resume/Keith_Casko_IT_Cloud_Resume.pdf" download>Download Resume</a>
             </div>
-          </div>
-          <div class="hero-montage" aria-label="Selected project screenshots">
-            <img class="montage-main"
-                 src="assets/images/homelab-topology.svg"
-                 alt="ByteGeist Active Directory homelab topology" />
-            <img src="assets/screenshots/bytegeist-infrastructure-live.png"
-                 alt="ByteGeist infrastructure monitoring dashboard" />
-            <img src="assets/screenshots/bytegeist-support-live.png"
-                 alt="ByteGeist Support Lab application" />
+            <div class="hero-facts" aria-label="Professional highlights">
+              <span>AWS Certified Cloud Practitioner</span>
+              <span>Google IT Support Professional</span>
+              <span>B.S. Software Engineering &mdash; In Progress</span>
+              <span>Kalamazoo, Michigan</span>
+            </div>
           </div>
         </div>
       </div>
@@ -308,20 +305,6 @@
             </p>
           </div>
 
-          <aside class="about-focus" aria-label="Current focus">
-            <h3>Current Focus</h3>
-            <ul>
-              <li>Windows Server &amp; Active Directory administration</li>
-              <li>AWS serverless applications and cloud operations</li>
-              <li>Linux, Docker, monitoring, and infrastructure troubleshooting</li>
-              <li>B.S. Software Engineering coursework at WGU</li>
-            </ul>
-            <div class="about-links">
-              <a href="https://github.com/kcasko" rel="noopener">GitHub</a>
-              <a href="https://www.linkedin.com/in/keith-casko/" rel="noopener">LinkedIn</a>
-              <a href="assets/resume/Keith_Casko_IT_Cloud_Resume.pdf" download>Resume</a>
-            </div>
-          </aside>
         </div>
       </div>
     </section>
@@ -334,35 +317,48 @@
           <span class="subtitle">Current study and professional background</span>
         </div>
 
-        <div class="two-col">
+        <div class="experience-grid">
 
           <div class="panel">
             <h3>Western Governors University</h3>
             <div class="meta">Bachelor of Science, Software Engineering &middot; In Progress</div>
-            <h4>Recent Coursework</h4>
+            <p>
+              Building a software engineering foundation alongside hands-on work in
+              systems administration, cloud infrastructure, networking, Java, and web development.
+            </p>
+          </div>
+
+          <div class="panel">
+            <h3>Hands-On Technical Experience</h3>
+            <div class="meta">Homelab, cloud projects, and deployed applications</div>
             <ul>
-              <li>Cloud Foundations &mdash; completed</li>
-              <li>Java Frameworks &mdash; completed project work</li>
-              <li>Hardware &amp; Operating Systems Essentials &mdash; current study</li>
+              <li>Windows Server 2022, Active Directory, DNS, SMB shares, permissions, and domain troubleshooting</li>
+              <li>Linux, Docker, reverse proxy, TLS, monitoring, and service administration</li>
+              <li>AWS Lambda, API Gateway, DynamoDB, Amplify, IAM, S3, EC2, and Systems Manager</li>
+              <li>Documented troubleshooting with verification steps rather than installation-only demos</li>
             </ul>
           </div>
 
           <div class="panel">
             <h3>Costco Wholesale &mdash; Baker</h3>
             <div class="meta">June 2015 &ndash; Present</div>
-            <h4>Transferable Experience</h4>
             <ul>
-              <li>High-volume production environment</li>
-              <li>Accuracy and process discipline</li>
-              <li>Prioritization under time pressure</li>
-              <li>Day-to-day troubleshooting of equipment and workflows</li>
-              <li>Coordinating with team members and supervisors</li>
-              <li>Training coworkers on procedures</li>
-              <li>Customer service and clear communication</li>
-              <li>Problem solving and follow-through</li>
+              <li>High-volume production work requiring accuracy, prioritization, and process discipline</li>
+              <li>Day-to-day troubleshooting of equipment and workflow problems</li>
+              <li>Training coworkers, customer service, and clear communication under time pressure</li>
             </ul>
           </div>
 
+          <div class="panel">
+            <h3>Earlier Grocery &amp; Bakery Experience</h3>
+            <div class="meta">Prior to Costco</div>
+            <p>
+              Additional long-term experience in bakery and grocery environments,
+              contributing to roughly three decades of customer service, production,
+              teamwork, training, and operational problem-solving.
+            </p>
+          </div>
+
         </div>
       </div>
     </section>