/* ============================
   Banner Section
============================ */
.banner-block .banner-inner {
  flex-direction: column;
  gap: 30px;
  max-width: 1150px;
}

.banner-block .banner-inner .video-block {
  width: 100%;
}
.banner-block .banner-inner .video-block .paragraph--type--video{
  max-width: 1150px;
}
.banner-block .banner-inner .descp-block {
  padding-left: 0;
  width: 100%;
}
@media (min-width:1025px) and  (max-width:1200px)  {
  .banner-block .banner-inner{
    padding-left: 20px;
    padding-right: 20px;
  }
}
/* ============================
   Header Section (Desktop)
============================ */
@media (min-width:1200px) {
  .header .region-header #block-headerbar{
     width: 14%;
  }
}
@media (min-width: 1024px) {
   .header .region-header #block-headerbar{
     width: 10%;
  }
  .header #block-dodson-onlylogo .field--name-field-site-logo {
    margin-top: 0;
    width: 70px;
    margin-bottom: 0;
    display: block;
  }

  .header #block-dodson-onlylogo .header__wrapper {
    display: flex;
    align-items: center;
    height: 100%;
  }

  .header #block-headerbar {
    width: 25%;
    padding: 0;
  }
   header .menu--main{
    width: 100%;
    }
}

/* ============================
   Banner Buttons (Frontpage)
============================ */
.path-frontpage .banner-block .banner-inner .descp-block .field--name-field-button {
  display: flex;
  flex-wrap: wrap;
  column-gap: 20px;
}

.path-frontpage .banner-block .banner-inner .descp-block .field--name-field-button .field__item {
  flex: 1 1 48%;
}

.path-frontpage .banner-block .banner-inner .descp-block .field--name-field-button .field__item a {
  width: 100%;
  text-align: center;
}

/* ============================
   Grid Block Cards (Frontpage)
============================ */
.path-frontpage .grid-block .paragraph--type--card.item-list-vertical>.field--name-field-card-section {
  margin-bottom: 0;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 30px;
}

.path-frontpage .grid-block .paragraph--type--card.item-list-vertical>.field--name-field-card-section.paragraph--type--image img,
.path-frontpage .grid-block .paragraph--type--card.item-list-vertical>.field--name-field-card-section .field--name-field-image img {
  height: auto;
  aspect-ratio: 16 / 9;
}

.path-frontpage .grid-block.shop-block .field--name-field-text,
.path-frontpage .grid-block.shop-block .field.field--name-field-title {
  min-height: auto;
}

/* Card Titles */
.grid-block.cards .views-field-title {
  font-weight: 700;
  margin-top: 15px;
  font-family: 'Merriweather';
  font-size: 20px;
}

.path-frontpage .grid-block.cards .paragraph--type--card.item-list-vertical>.field--name-field-card-section {
  display: block;
}

/* Recent & Popular Articles Grid */
.path-frontpage .grid-block.cards .paragraph--type--card.item-list-vertical>.field--name-field-card-section .view-recent-articles .view-content,
.path-frontpage .grid-block.cards .paragraph--type--card.item-list-vertical>.field--name-field-card-section .view-popular-post .view-content {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 30px;
}

.path-frontpage .grid-block .paragraph--type--card.item-list-vertical>.field--name-field-card-section .paragraph--type--title {
  min-height: auto;
}

/* ============================
   Responsive Styles
============================ */
@media (min-width:768px) and (max-width: 1150px) {
    .footer-top-row .region.region-footer-top,
    footer .region-footer #block-stickyfooter {
        padding-left: 15px;
        padding-right: 15px;
    }
}

/* Tablet & Small Desktop */
@media (max-width: 1024px) {
  .path-frontpage .grid-block .paragraph--type--card.item-list-vertical>.field--name-field-card-section {
    width: 100%;
    max-width: 100%;
    padding: 0 30px;
  }

  .path-frontpage .grid-block>.paragraph--type--card>.field--name-field-card-section {
    width: 100%;
    max-width: 100%;
  }

  .header div#block-dodson-onlylogo {
    display: flex;
    justify-content: space-between;
    width: 100%;
  }

  .header #block-headerbar .header__wrapper {
    display: block;
    width: 100%;
  }

  .header #block-headerbar .field--name-field-site-logo {
    margin: auto;
    text-align: center;
  }

  .header #block-headerbar .search-icon {
    margin-top: 24px;
  }
  
}

/* Mobile */
@media (max-width: 767px) {

  .path-frontpage .grid-block .paragraph--type--card.item-list-vertical>.field--name-field-card-section.paragraph--type--image img,
  .path-frontpage .grid-block .paragraph--type--card.item-list-vertical>.field--name-field-card-section .field--name-field-image img {
    height: auto;
    aspect-ratio: 16 / 9;
  }

  .path-frontpage .grid-block .paragraph--type--card.item-list-vertical>.field--name-field-card-section {
    column-gap: 15px;
    row-gap: 30px;
    padding: 0 15px;
  }

  .path-frontpage .grid-block .paragraph--type--card.item-list-vertical>.field--name-field-card-section .paragraph--type--text,
  .path-frontpage .grid-block.cards .paragraph--type--card.item-list-vertical>.field--name-field-card-section .view-recent-articles .view-content .field--type-text-with-summary,
  .path-frontpage .grid-block.cards .paragraph--type--card.item-list-vertical>.field--name-field-card-section .view-popular-post .view-content .field--type-text-with-summary {
    line-height: normal;
  }

  .grid-block.cards .views-field-title {
    font-size: 18px;
    line-height: normal;
  }
  .path-frontpage .grid-block.cards .paragraph--type--card.item-list-vertical>.field--name-field-card-section .view-recent-articles .view-content, .path-frontpage .grid-block.cards .paragraph--type--card.item-list-vertical>.field--name-field-card-section .view-popular-post .view-content{
      column-gap:18px;
      
  }
}

/* Extra Small Devices */
@media (max-width: 420px) {
  .path-frontpage .grid-block .paragraph--type--atom-button a {
    padding: 10px 20px;
  }
}