From 02f7dc9c698ea79c9163415fa97bdba17ff7c74a Mon Sep 17 00:00:00 2001
From: Tony Klapatch <aklapatch@famous-smoke.com>
Date: Thu, 9 May 2024 10:59:01 -0400
Subject: [PATCH] LSD-1501 Fix mobile Safari, grid tpl on mobile

---
 best-cigars-guide/blocks/columns/columns.css |  2 +-
 best-cigars-guide/blocks/header/header.css   | 14 +++++++++-----
 best-cigars-guide/styles/styles.css          |  8 ++++----
 3 files changed, 14 insertions(+), 10 deletions(-)

diff --git a/best-cigars-guide/blocks/columns/columns.css b/best-cigars-guide/blocks/columns/columns.css
index 99eda08..b6cdee4 100644
--- a/best-cigars-guide/blocks/columns/columns.css
+++ b/best-cigars-guide/blocks/columns/columns.css
@@ -19,7 +19,7 @@
   display: block;
 }
 
-@media (width >= 900px) {
+@media (min-width: 900px) {
   .columns > div {
     align-items: center;
     flex-direction: unset;
diff --git a/best-cigars-guide/blocks/header/header.css b/best-cigars-guide/blocks/header/header.css
index 59e17a8..f26c731 100644
--- a/best-cigars-guide/blocks/header/header.css
+++ b/best-cigars-guide/blocks/header/header.css
@@ -28,13 +28,17 @@ header nav[aria-expanded="true"] {
   min-height: 100vh;
 }
 
-@media (width <= 600px) {
+@media (max-width: 600px) {
   header nav {
     grid-template:
-      'brand' calc(var(--nav-height) / 2)
+      'brand' auto
       'tools' auto
   }
 
+  header nav p {
+    font-size: 0.8em;
+  }
+
   header nav .brand-logo {
     flex-flow: column;
   }
@@ -44,7 +48,7 @@ header nav[aria-expanded="true"] {
   }
 }
 
-@media (width >= 900px) {
+@media (min-width: 900px) {
   header nav[aria-expanded="true"] {
     min-height: 0;
     overflow: visible;
@@ -135,7 +139,7 @@ header nav[aria-expanded="true"] .nav-hamburger-icon::after {
   transform: rotate(-45deg);
 }
 
-@media (width >= 900px) {
+@media (min-width: 900px) {
   header nav .nav-hamburger {
     display: none;
     visibility: hidden;
@@ -234,7 +238,7 @@ header nav .nav-sections ul > li > ul > li {
   font-weight: 500;
 }
 
-@media (width >= 900px) {
+@media (min-width: 900px) {
   header nav .nav-sections {
     display: block;
     visibility: visible;
diff --git a/best-cigars-guide/styles/styles.css b/best-cigars-guide/styles/styles.css
index e989c10..d0cee86 100644
--- a/best-cigars-guide/styles/styles.css
+++ b/best-cigars-guide/styles/styles.css
@@ -45,7 +45,7 @@
   --content-width: 1020px;
 }
 
-@media (width >= 900px) {
+@media (min-width: 900px) {
   :root {
     --heading-font-size-xxl: 60px;
     --heading-font-size-xl: 48px;
@@ -56,7 +56,7 @@
   }
 }
 
-@media (width <= 600px) {
+@media (max-width: 600px) {
   :root {
     --nav-height: 180px;
   }
@@ -203,13 +203,13 @@ main .section {
   padding: 64px 16px;
 }
 
-@media (width >= 600px) {
+@media (min-width: 600px) {
   main .section {
     padding: 64px 32px;
   }
 }
 
-@media (width >= 900px) {
+@media (min-width: 900px) {
   .section > div {
     max-width: var(--content-width);
     margin: auto;