/* Responsive fixes for TheTaxBook website */

/* Why Try TheTaxBook section - Horizontal alignment of points */
.d-sm-flex.justify-content-center.py-5.bg-white .d-flex.my-4 {
  height: 120px; /* Set fixed height for all points */
  align-items: flex-start; /* Align items at the top */
  margin-top: 15px !important;
  margin-bottom: 15px !important;
}

.d-sm-flex.justify-content-center.py-5.bg-white .d-flex.my-4 .mr-3 {
  align-self: flex-start; /* Keep icons at the top */
}

.d-sm-flex.justify-content-center.py-5.bg-white .d-flex.my-4 h4 {
  margin-top: 0; /* Remove top margin from headings */
}

/* Responsive adjustments for the fixed height points */
@media (max-width: 992px) {
  .d-sm-flex.justify-content-center.py-5.bg-white .d-flex.my-4 {
    height: 140px; /* Increase height for smaller screens */
  }
}

@media (max-width: 768px) {
  .d-sm-flex.justify-content-center.py-5.bg-white .d-flex.my-4 {
    height: auto; /* Remove fixed height on mobile */
    min-height: 100px; /* Set minimum height instead */
  }
}

/* Extra Large Screen Fixes (>1800px) */
@media (min-width: 1800px) {
  /* Keep running man left-aligned in its container */
  .hero-section .running-man-container {
    left: 0 !important; /* Keep the image left-aligned */
  }
  
  /* Ensure the container has enough space */
  .hero-section .container-fluid {
    max-width: 1400px !important; /* Increase container width on very large screens */
  }
  
  /* Adjust text container to prevent overlap */
  .hero-section .col-md {
    max-width: 60% !important; /* Limit text width to prevent overlap */
  }
}

/* 1650px Breakpoint */
@media (min-width: 1650px) and (max-width: 1799px) {
  /* Adjust running man position */
  .hero-section .running-man-container {
    left: 0 !important; /* Keep the image left-aligned */
  }
  
  /* Ensure the container has enough space */
  .hero-section .container-fluid {
    max-width: 1350px !important;
  }
  
  /* Adjust text container to prevent overlap */
  .hero-section .col-md {
    max-width: 65% !important;
  }
}

/* 1500px Breakpoint */
@media (min-width: 1500px) and (max-width: 1649px) {
  /* Adjust running man position */
  .hero-section .running-man-container {
    left: 0 !important; /* Keep the image left-aligned */
  }
  
  /* Ensure the container has enough space */
  .hero-section .container-fluid {
    max-width: 1300px !important;
  }
  
  /* Adjust text container to prevent overlap */
  .hero-section .col-md {
    max-width: 70% !important;
  }
}

/* 1350px Breakpoint */
@media (min-width: 1350px) and (max-width: 1499px) {
  /* Adjust running man position */
  .hero-section .running-man-container {
    left: 0 !important; /* Keep the image left-aligned */
  }
  
  /* Ensure the container has enough space */
  .hero-section .container-fluid {
    max-width: 1250px !important;
  }
  
  /* Adjust text container to prevent overlap */
  .hero-section .col-md {
    max-width: 75% !important;
  }
  
  /* Adjust heading size */
  .hero-section h1 {
    font-size: 4.5rem !important;
  }
}

/* 1200px Breakpoint - Large Screen Responsive Fixes (Small Desktops) */
@media (min-width: 1200px) and (max-width: 1349px) {
  /* Improve text readability on medium screens */
  body {
    font-size: 16px !important;
  }
  
  /* Adjust headings for medium screens */
  h1 {
    font-size: 3.5rem !important;
    line-height: 1.2 !important;
  }
  
  h2 {
    font-size: 2.5rem !important;
    line-height: 1.2 !important;
  }
  
  /* Improve container widths */
  .w-sm-1200px {
    width: 95% !important;
    max-width: 1100px !important;
  }
  
  .w-sm-1000px {
    width: 95% !important;
    max-width: 950px !important;
  }
  
  /* Hero Section Adjustments */
  .hero-section .running-man-container {
    left: 0 !important; /* Keep the image left-aligned */
  }
  
  /* Adjust Online Tax Research section */
  .d-sm-flex.justify-content-center.bg-gray .col-md-8 .d-flex {
    flex-wrap: wrap !important;
  }
  
  /* Adjust Additional Products section */
  .d-sm-flex.justify-content-center.text-center.bg-black .col-md-6 {
    padding: 0 10px !important;
  }
  
  /* Adjust Why Try TheTaxBook section */
  .d-sm-flex.justify-content-center.py-5.bg-white .position-absolute.d-none.d-md-block img {
    max-height: 400px !important;
  }
  
  /* Adjust About TheTaxBook section */
  .position-relative .w-100 .d-flex.justify-content-center img {
    width: 70% !important;
  }
  
  .position-absolute.d-flex.justify-content-center > div {
    width: 70% !important;
  }
}

/* 1050px Breakpoint */
@media (min-width: 993px) and (max-width: 1199px) {
  /* Improve text readability */
  body {
    font-size: 16px !important;
  }
  
  /* Adjust headings */
  h1 {
    font-size: 3.2rem !important;
    line-height: 1.2 !important;
  }
  
  h2 {
    font-size: 2.3rem !important;
    line-height: 1.2 !important;
  }
  
  /* Improve container widths */
  .w-sm-1200px {
    width: 92% !important;
    max-width: 1000px !important;
  }
  
  .w-sm-1000px {
    width: 92% !important;
    max-width: 900px !important;
  }
  
  /* Hero Section Adjustments */
  .hero-section .running-man-container {
    left: 0 !important;
    max-height: 700px !important;
  }
  
  /* Adjust Online Tax Research section */
  .d-sm-flex.justify-content-center.bg-gray .col-md-8 .d-flex {
    flex-wrap: wrap !important;
  }
  
  /* Adjust Additional Products section */
  .d-sm-flex.justify-content-center.text-center.bg-black .col-md-6 {
    padding: 0 8px !important;
  }
  
  /* Adjust Why Try TheTaxBook section */
  .d-sm-flex.justify-content-center.py-5.bg-white .position-absolute.d-none.d-md-block img {
    max-height: 450px !important;
    left: -20px !important;
  }
  
  /* Adjust About TheTaxBook section */
  .position-relative .w-100 .d-flex.justify-content-center img {
    width: 75% !important;
  }
  
  .position-absolute.d-flex.justify-content-center > div {
    width: 75% !important;
  }
}

/* 992px Breakpoint - Medium Screen Responsive Fixes (Tablets) */
@media (min-width: 901px) and (max-width: 992px) {
  /* Adjust headings for tablet screens */
  h1 {
    font-size: 3rem !important;
    line-height: 1.2 !important;
  }
  
  h2 {
    font-size: 2.2rem !important;
  }
  
  h3 {
    font-size: 1.8rem !important;
  }
  
  /* Improve container widths for tablets */
  .w-sm-1200px,
  .w-sm-1000px {
    width: 90% !important;
  }
  
  /* Hero Section Tablet Adjustments */
  .hero-section .running-man-container {
    left: 0 !important; /* Keep the image left-aligned */
    max-height: 600px !important;
  }
  
  .hero-section h1 {
    font-size: 3rem !important;
  }
  
  /* Book Carousel Tablet Adjustments */
  .book-carousel {
    padding: 0 35px !important;
  }
  
  /* Online Tax Research Section Tablet Adjustments */
  .d-sm-flex.justify-content-center.bg-gray .col-md-8 .d-flex {
    flex-direction: column !important;
  }
  
  .d-sm-flex.justify-content-center.bg-gray .col-md-8 .d-flex .ml-3 {
    margin-left: 0 !important;
    margin-top: 20px !important;
    text-align: center !important;
  }
  
  /* Additional Products Section Tablet Adjustments */
  .d-sm-flex.justify-content-center.text-center.bg-black .d-sm-flex.justify-content-center.mb-4 {
    flex-wrap: wrap !important;
  }
  
  .d-sm-flex.justify-content-center.text-center.bg-black .col-md-6 {
    flex: 0 0 100% !important;
    margin-bottom: 20px !important;
  }
  
  /* Why Try TheTaxBook Section Tablet Adjustments */
  .d-sm-flex.justify-content-center.py-5.bg-white .position-absolute.d-none.d-md-block {
    left: -50px !important;
  }
  
  .d-sm-flex.justify-content-center.py-5.bg-white .row .col-md-5 {
    padding-left: 60px !important;
  }
  
  /* Customer Feedback Section Tablet Adjustments */
  .container .row {
    flex-wrap: wrap !important;
  }
  
  .container .row .col-md-3,
  .container .row .col-md-4,
  .container .row .col-md-5 {
    flex: 0 0 100% !important;
    margin-bottom: 20px !important;
    text-align: center !important;
  }
  
  /* About TheTaxBook Section Tablet Adjustments */
  .position-absolute.d-flex.justify-content-center > div .d-flex {
    flex-wrap: wrap !important;
  }
  
  .position-absolute.d-flex.justify-content-center > div .d-flex > div {
    width: 100% !important;
    margin-bottom: 15px !important;
    text-align: center !important;
  }
  
  .position-absolute.d-flex.justify-content-center > div .d-flex > div:first-child {
    width: 100% !important;
  }
  
  .position-absolute.d-flex.justify-content-center > div .d-flex > div:first-child div {
    margin: 0 auto !important;
  }
}

/* 900px Breakpoint */
@media (min-width: 769px) and (max-width: 900px) {
  /* Adjust headings for tablet screens */
  h1 {
    font-size: 2.9rem !important;
    line-height: 1.2 !important;
  }
  
  h2 {
    font-size: 2.1rem !important;
  }
  
  h3 {
    font-size: 1.7rem !important;
  }
  
  /* Improve container widths for tablets */
  .w-sm-1200px,
  .w-sm-1000px {
    width: 88% !important;
  }
  
  /* Hero Section Tablet Adjustments */
  .hero-section .running-man-container {
    left: 0 !important;
    max-height: 550px !important;
    opacity: 0.9 !important;
  }
  
  .hero-section h1 {
    font-size: 2.8rem !important;
  }
  
  /* Book Carousel Tablet Adjustments */
  .book-carousel {
    padding: 0 40px !important;
  }
  
  /* Online Tax Research Section Tablet Adjustments */
  .d-sm-flex.justify-content-center.bg-gray .col-md-8 .d-flex {
    flex-direction: column !important;
  }
  
  .d-sm-flex.justify-content-center.bg-gray .col-md-8 .d-flex .ml-3 {
    margin-left: 0 !important;
    margin-top: 20px !important;
    text-align: center !important;
  }
  
  /* Additional Products Section Tablet Adjustments */
  .d-sm-flex.justify-content-center.text-center.bg-black .d-sm-flex.justify-content-center.mb-4 {
    flex-wrap: wrap !important;
  }
  
  .d-sm-flex.justify-content-center.text-center.bg-black .col-md-6 {
    flex: 0 0 100% !important;
    margin-bottom: 20px !important;
  }
  
  /* Why Try TheTaxBook Section Tablet Adjustments */
  .d-sm-flex.justify-content-center.py-5.bg-white .position-absolute.d-none.d-md-block {
    left: -40px !important;
  }
  
  .d-sm-flex.justify-content-center.py-5.bg-white .row .col-md-5 {
    padding-left: 50px !important;
  }
}

/* 768px Breakpoint - Small Tablet Responsive Fixes */
@media (min-width: 750px) and (max-width: 768px) {
  /* Adjust headings for small tablets */
  h1 {
    font-size: 2.8rem !important;
    line-height: 1.2 !important;
  }
  
  h2 {
    font-size: 2rem !important;
  }
  
  h3 {
    font-size: 1.6rem !important;
  }
  
  /* Hero Section Small Tablet Adjustments */
  .hero-section .running-man-container {
    left: 0 !important;
    max-height: 500px !important;
    opacity: 0.7 !important;
  }
  
  /* Book Carousel Small Tablet Adjustments */
  .book-card {
    width: 200px !important;
    margin: 0 8px !important;
  }
  
  /* Additional Products Section Small Tablet Adjustments */
  .d-sm-flex.justify-content-center.text-center.bg-black .bg-white.d-flex,
  .d-sm-flex.justify-content-center.text-center.bg-black .bg-red.d-flex {
    flex-direction: row !important;
    text-align: left !important;
  }
  
  /* Why Try TheTaxBook Section Small Tablet Adjustments */
  .d-sm-flex.justify-content-center.py-5.bg-white .row {
    margin-left: 50px !important;
  }
}

/* 750px Breakpoint */
@media (min-width: 601px) and (max-width: 749px) {
  /* Adjust headings for small tablets */
  h1 {
    font-size: 2.7rem !important;
    line-height: 1.2 !important;
  }
  
  h2 {
    font-size: 1.9rem !important;
  }
  
  h3 {
    font-size: 1.5rem !important;
  }
  
  /* Hero Section Small Tablet Adjustments */
  .hero-section .running-man-container {
    left: 0 !important;
    max-height: 480px !important;
    opacity: 0.6 !important;
  }
  
  /* Book Carousel Small Tablet Adjustments */
  .book-card {
    width: 190px !important;
    margin: 0 7px !important;
  }
  
  /* Additional Products Section Small Tablet Adjustments */
  .d-sm-flex.justify-content-center.text-center.bg-black .bg-white.d-flex,
  .d-sm-flex.justify-content-center.text-center.bg-black .bg-red.d-flex {
    flex-direction: row !important;
    text-align: left !important;
  }
  
  /* Why Try TheTaxBook Section Small Tablet Adjustments */
  .d-sm-flex.justify-content-center.py-5.bg-white .row {
    margin-left: 40px !important;
  }
}

/* 600px Breakpoint */
@media (min-width: 577px) and (max-width: 600px) {
  /* Adjust headings for small tablets */
  h1 {
    font-size: 2.6rem !important;
    line-height: 1.2 !important;
  }
  
  h2 {
    font-size: 1.8rem !important;
  }
  
  h3 {
    font-size: 1.4rem !important;
  }
  
  /* Hero Section Small Tablet Adjustments */
  .hero-section .running-man-container {
    left: 0 !important;
    max-height: 450px !important;
    opacity: 0.5 !important;
  }
  
  /* Book Carousel Small Tablet Adjustments */
  .book-card {
    width: 185px !important;
    margin: 0 6px !important;
  }
}

/* 576px Breakpoint - Mobile Responsive Fixes */
@media (min-width: 451px) and (max-width: 576px) {
  /* Improve text readability on small screens */
  body {
    font-size: 16px !important;
  }
  
  /* Make headings more readable on mobile */
  h1 {
    font-size: 2.5rem !important;
    line-height: 1.2 !important;
  }
  
  h2 {
    font-size: 2rem !important;
    line-height: 1.2 !important;
  }
  
  h3 {
    font-size: 1.5rem !important;
    line-height: 1.3 !important;
  }
  
  /* Fix button text size on mobile */
  .btn h4 {
    font-size: 1rem !important;
  }
  
  /* Improve spacing for all sections */
  .d-sm-flex {
    padding-left: 15px !important;
    padding-right: 15px !important;
  }
  
  /* Header button adjustments for mobile */
  #loginDropdownButton, #cartButton {
    padding: 0.375rem 0.375rem !important;
    min-width: 36px !important;
  }
}

/* Hero Section Improvements */
@media (max-width: 768px) {
  /* Hide review carousel on mobile */
  #review_carousel {
    display: none !important;
  }
  
  /* Fix hero section heading */
  .hero-section h1 {
    font-size: 2.5rem !important; /* Smaller font on mobile */
    line-height: 1.2 !important;
    text-align: center !important;
  }
  
  /* Fix hero section padding */
  .hero-section .col-md div {
    padding-left: 15px !important; /* Override the fixed padding */
  }
  
  /* Fix button layout */
  .hero-section .d-flex.flex-column.flex-md-row {
    flex-direction: column !important;
  }
  
  .hero-section .justify-content-md-start {
    justify-content: center !important;
  }
  
  /* Hide the running man image on small screens */
  .hero-section .running-man-container {
    display: none !important; /* Hide the image on very small screens */
  }
  
  /* Improve award box on mobile */
  .hero-section .box-shadow {
    margin: 0 auto !important;
    max-width: 90% !important;
  }
}

/* 450px Breakpoint */
@media (min-width: 376px) and (max-width: 450px) {
  /* Improve text readability on small screens */
  body {
    font-size: 15px !important;
  }
  
  /* Make headings more readable on mobile */
  h1 {
    font-size: 2.3rem !important;
    line-height: 1.2 !important;
  }
  
  h2 {
    font-size: 1.8rem !important;
    line-height: 1.2 !important;
  }
  
  h3 {
    font-size: 1.4rem !important;
    line-height: 1.3 !important;
  }
  
  /* Fix button text size on mobile */
  .btn h4 {
    font-size: 0.9rem !important;
  }
  
  /* Improve spacing for all sections */
  .d-sm-flex {
    padding-left: 10px !important;
    padding-right: 10px !important;
  }
  
  /* Hero section adjustments */
  .hero-section h1 {
    font-size: 2.3rem !important;
  }
  
  /* Adjust award box */
  .hero-section .box-shadow {
    max-width: 95% !important;
    padding: 10px !important;
  }
  
  /* Book carousel adjustments */
  .book-card {
    width: 160px !important;
    margin: 0 4px !important;
  }
  
  /* Customer Feedback Section Adjustments */
  .container .row .col-md-3,
  .container .row .col-md-4,
  .container .row .col-md-5 {
    width: 100% !important;
    margin-bottom: 12px !important;
    text-align: center !important;
  }
  
  /* Adjust padding for feedback section */
  div[style*="background-color: #f23a3a"] {
    padding: 25px 0 90px 0 !important;
  }
  
  /* Fix rating boxes on mobile */
  .bg-white.p-3.mb-3.d-flex.align-items-center {
    justify-content: center !important;
    padding: 10px !important;
  }
  
  /* About TheTaxBook Section Adjustments */
  .position-relative .w-100 .d-flex.justify-content-center img {
    width: 95% !important;
  }
  
  .position-absolute.d-flex.justify-content-center > div {
    width: 95% !important;
    padding: 20px 15px !important;
  }
  
  .position-absolute.d-flex.justify-content-center > div .d-flex {
    flex-direction: column !important;
  }
  
  .position-absolute.d-flex.justify-content-center > div .d-flex > div {
    width: 100% !important;
    margin-bottom: 15px !important;
    text-align: center !important;
  }
  
  .position-absolute.d-flex.justify-content-center > div .d-flex > div:last-child {
    margin-bottom: 0 !important;
  }
  
  .position-absolute.d-flex.justify-content-center > div .d-flex > div:first-child div {
    width: 150px !important;
    margin: 0 auto !important;
  }
  
  .book-carousel-inner {
    padding: 8px 0 !important;
  }
  
  .book-card-title {
    font-size: 0.85rem !important;
  }
  
  .book-card-price {
    font-size: 1rem !important;
  }
  
  .book-carousel {
    padding: 0 25px !important;
  }
  
  .book-carousel-nav {
    width: 25px !important;
    height: 25px !important;
  }
  
  .book-section-title {
    font-size: 1.7rem !important;
  }
  
  .book-section-subtitle {
    font-size: 1.1rem !important;
  }
  
  .view-all-books {
    width: 170px !important;
    font-size: 0.85rem !important;
  }
}

/* 375px Breakpoint */
@media (max-width: 375px) {
  /* Improve text readability on small screens */
  body {
    font-size: 14px !important;
  }
  
  /* Make headings more readable on mobile */
  h1 {
    font-size: 2rem !important;
    line-height: 1.2 !important;
  }
  
  h2 {
    font-size: 1.6rem !important;
    line-height: 1.2 !important;
  }
  
  h3 {
    font-size: 1.3rem !important;
    line-height: 1.3 !important;
  }
  
  /* Fix button text size on mobile */
  .btn h4 {
    font-size: 0.8rem !important;
  }
  
  /* Improve spacing for all sections */
  .d-sm-flex {
    padding-left: 8px !important;
    padding-right: 8px !important;
  }
  
  /* Hero section adjustments */
  .hero-section h1 {
    font-size: 2rem !important;
  }
  
  /* Adjust award box */
  .hero-section .box-shadow {
    max-width: 100% !important;
    padding: 8px !important;
  }
  
  .hero-section .box-shadow img {
    max-width: 100px !important;
  }
  
  /* Book carousel adjustments */
  .book-card {
    width: 140px !important;
    margin: 0 3px !important;
  }
  
  /* Customer Feedback Section Adjustments */
  .container .row .col-md-3,
  .container .row .col-md-4,
  .container .row .col-md-5 {
    width: 100% !important;
    margin-bottom: 10px !important;
    text-align: center !important;
  }
  
  /* Adjust padding for feedback section */
  div[style*="background-color: #f23a3a"] {
    padding: 20px 0 80px 0 !important;
  }
  
  /* Fix rating boxes on mobile */
  .bg-white.p-3.mb-3.d-flex.align-items-center {
    justify-content: center !important;
    padding: 8px !important;
  }
  
  .h1.mb-0.text-danger {
    font-size: 2rem !important;
  }
  
  .font-weight-bold {
    font-size: 0.8rem !important;
  }
  
  /* About TheTaxBook Section Adjustments */
  .position-relative .w-100 .d-flex.justify-content-center img {
    width: 98% !important;
    border-width: 3px !important;
    top: -50px !important;
  }
  
  .position-absolute.d-flex.justify-content-center > div {
    width: 98% !important;
    padding: 15px 10px !important;
    top: -50px !important;
  }
  
  .position-absolute.d-flex.justify-content-center > div .d-flex {
    flex-direction: column !important;
  }
  
  .position-absolute.d-flex.justify-content-center > div .d-flex > div {
    width: 100% !important;
    margin: 0 0 15px 0 !important;
    text-align: center !important;
  }
  
  .position-absolute.d-flex.justify-content-center > div .d-flex > div:last-child {
    margin-bottom: 0 !important;
  }
  
  .position-absolute.d-flex.justify-content-center > div .d-flex > div:nth-child(1) h2 {
    font-size: 1.4rem !important;
    margin-bottom: 10px !important;
  }
  
  .position-absolute.d-flex.justify-content-center > div .d-flex > div:nth-child(2) p {
    font-size: 0.9rem !important;
    line-height: 1.4 !important;
  }
  
  .bg-danger.text-white.p-3.rounded.border.border-white {
    padding: 10px !important;
  }
  
  .btn.btn-lg.mb-md-0.mr-md-2.p-2 {
    padding: 5px !important;
    font-size: 16px !important;
  }
  
  .book-carousel-inner {
    padding: 5px 0 !important;
  }
  
  .book-card-title {
    font-size: 0.8rem !important;
  }
  
  .book-card-price {
    font-size: 0.9rem !important;
  }
  
  .book-carousel {
    padding: 0 20px !important;
  }
  
  .book-carousel-nav {
    width: 20px !important;
    height: 20px !important;
  }
  
  .book-section-title {
    font-size: 1.5rem !important;
  }
  
  .book-section-subtitle {
    font-size: 1rem !important;
  }
  
  .view-all-books {
    width: 150px !important;
    font-size: 0.8rem !important;
  }
}

/* Book Carousel Improvements */
@media (min-width: 451px) and (max-width: 576px) {
  .book-card {
    width: 180px !important; /* Smaller cards on mobile */
    margin: 0 5px !important;
  }
  
  .book-carousel-inner {
    padding: 10px 0 !important;
  }
  
  .book-card-title {
    font-size: 0.9rem !important;
  }
  
  .book-card-price {
    font-size: 1.1rem !important;
  }
  
  .book-carousel {
    padding: 0 30px !important;
  }
  
  .book-carousel-nav {
    width: 30px !important;
    height: 30px !important;
  }
  
  .book-section-title {
    font-size: 1.8rem !important;
  }
  
  .book-section-subtitle {
    font-size: 1.2rem !important;
  }
  
  .view-all-books {
    width: 180px !important;
    font-size: 0.9rem !important;
  }
}

/* Online Tax Research Section Improvements */
@media (max-width: 768px) {
  /* Better stacking for two-column layouts */
  .d-sm-flex .col-md-4, 
  .d-sm-flex .col-md-8 {
    width: 100% !important;
    margin-bottom: 20px !important;
  }
  
  /* Fix flex direction for stacked columns */
  .d-flex.flex-column.flex-md-row {
    flex-direction: column !important;
  }
  
  /* Center content on mobile */
  .justify-content-md-start {
    justify-content: center !important;
  }
  
  /* Fix alignment in Online Tax Research section */
  .d-sm-flex.justify-content-center.bg-gray .w-sm-1200px {
    width: 100% !important;
    padding: 0 15px !important;
  }
  
  /* Fix TaxBert box on mobile */
  .d-sm-flex.justify-content-center.bg-gray .col-md-4 {
    margin-bottom: 30px !important;
  }
  
  /* Fix WebLibrary section on mobile */
  .d-sm-flex.justify-content-center.bg-gray .col-md-8 .d-flex {
    flex-direction: column !important;
  }
  
  .d-sm-flex.justify-content-center.bg-gray .col-md-8 .d-flex .ml-3 {
    margin-left: 0 !important;
    margin-top: 20px !important;
  }
  
  /* Fix features display on mobile */
  .d-sm-flex.justify-content-center.bg-gray .d-flex.mt-3 {
    flex-direction: column !important;
  }
  
  .d-sm-flex.justify-content-center.bg-gray .d-flex.mt-3 .d-flex.align-items-center {
    margin-bottom: 15px !important;
  }
}

/* The overlay width is now controlled by JavaScript */

/* About TheTaxBook Section Mobile Improvements */
@media (max-width: 767px) {
  /* Add padding to the customer feedback section to prevent overlap */
  div[style*="background-color: #f23a3a"] {
    padding-bottom: 150px !important;
  }
  
  /* Adjust the About section container */
  .container-fluid.py-5.bg-dark {
    padding-top: 2rem !important;
    padding-bottom: 2rem !important;
  }
  
  /* Improve image display on mobile */
  .container-fluid.py-5.bg-dark .col-md-8 img {
    max-width: 100% !important;
    margin-bottom: 1rem !important;
  }
  
  /* Center text on mobile */
  .container-fluid.py-5.bg-dark .text-md-left {
    text-align: center !important;
  }
  
  /* Adjust the Experience Box */
  .bg-danger.text-white.p-3.rounded.border.border-white {
    padding: 12px !important;
    max-width: 280px !important;
    margin: 0 auto 1rem auto !important;
  }
  
  /* Adjust the Learn More button */
  .container-fluid.py-5.bg-dark .btn-light {
    padding: 8px 15px !important;
    font-size: 16px !important;
  }
}

/* Extra small devices (portrait phones) */
@media (max-width: 575px) {
  /* Further reduce padding for very small screens */
  .container-fluid.py-5.bg-dark {
    padding: 1.5rem 1rem !important;
  }
  
  /* Make text smaller on very small screens */
  .container-fluid.py-5.bg-dark p {
    font-size: 0.9rem !important;
  }
  
  /* Adjust heading size */
  .container-fluid.py-5.bg-dark h2 {
    font-size: 1.8rem !important;
  }
  
  /* Header button adjustments for mobile */
  #loginDropdownButton, #cartButton {
    padding: 0.375rem 0.375rem !important;
    min-width: 36px !important;
  }
  
  /* Ensure the logo has enough space */
  #headerSmallLogo {
    max-width: 180px !important;
  }
}