diff --git a/src/components/HeroSection.module.css b/src/components/HeroSection.module.css
index 320a368..c1ad6b0 100644
--- a/src/components/HeroSection.module.css
+++ b/src/components/HeroSection.module.css
@@ -230,9 +230,9 @@
    MOBILE  ≤ 640px
    ================================================================ */
 /* ================================================================
-   TABLET  501px – 1100px — match the illustration breakpoint
+   TABLET  651px – 1100px — match the illustration breakpoint
    ================================================================ */
-@media (max-width: 1100px) and (min-width: 501px) {
+@media (max-width: 1100px) and (min-width: 651px) {
   .heroContentWrapper {
     height: auto;
     min-height: clamp(540px, 64vw, 640px);
@@ -266,9 +266,9 @@
 }
 
 /* ================================================================
-   MOBILE  ≤ 500px  (screensizes under 500px)
+   MOBILE  ≤ 650px  (screensizes under 650px)
    ================================================================ */
-@media (max-width: 500px) {
+@media (max-width: 650px) {
   .heroContentWrapper {
     height: auto;
     min-height: 540px;
diff --git a/src/components/ScenicHeroJourney.module.css b/src/components/ScenicHeroJourney.module.css
index 7b4450e..fc242d5 100644
--- a/src/components/ScenicHeroJourney.module.css
+++ b/src/components/ScenicHeroJourney.module.css
@@ -113,11 +113,11 @@
 }
 
 /* ================================================================
-   TABLET  501px – 1100px
+   TABLET  651px – 1100px
    Large illustrations with heavy bleed — bold fragments at edges.
    Width scales fluidly; fixed bleed offset keeps content clear.
    ================================================================ */
-@media (max-width: 1100px) and (min-width: 501px) {
+@media (max-width: 1100px) and (min-width: 651px) {
   .heroStage {
     height: auto;
     min-height: clamp(540px, 64vw, 640px);
@@ -147,13 +147,13 @@
 }
 
 /* ================================================================
-   MOBILE  ≤ 500px  (screensizes under 500px)
+   MOBILE  ≤ 650px  (screensizes under 650px)
    Assets moved UP to the sides (matching desktop/tablet aesthetic):
    - Anchored via top, flanking the avatar & title
    - Fluid side bleed maintains balance between visibility & clearance
    - Zero collision with central avatar, title, buttons, or contact bar
    ================================================================ */
-@media (max-width: 500px) {
+@media (max-width: 650px) {
   .heroStage {
     height: auto;
     min-height: 540px;