/* =================================================================== */
/* === GLOBAL & GENERAL FRONT PAGE STYLES ============================ */
/* =================================================================== */

/* Hide the page title "home" on the front page */
.path-frontpage .page-title,
.path-frontpage h1#page-title,
.path-frontpage #block-barrio-boostrap-5-makehaven-page-title {
  display: none !important;
}

.info-line-section.larger.no-bg { width: 100%; padding: 0; }
.service { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 20px; text-align: center; margin-bottom: 30px; }
.service-content { text-align: center; padding: 20px; background: #f9f9f9; border: 1px solid #ddd; border-radius: 10px; }
.front-icons { width: 150px; height: 150px; margin-bottom: 15px; }
.service-title { font: 700 24px/1.2 Montserrat, Verdana, sans-serif; text-transform: uppercase; margin-top: 15px; margin-bottom: 15px; }
.service-title.title-underblock.dark { color: #333; }
.service p { font-size: 16px; color: #666; margin: 10px 0 15px; }
.service-content a { color: #007bff; text-decoration: none; transition: color 0.3s ease; }
.service-content a:hover { color: #0056b3; }
.section { padding: 60px 0; position: relative; }
.section-header { margin-bottom: 40px; }
.section-title.shadow-title { font-size: 36px; font-weight: 700; text-align: center; text-transform: uppercase; color: #333; position: relative; z-index: 1; }
.section-title.shadow-title:before { content: attr(data-title); position: absolute; top: 0; left: 50%; transform: translateX(-50%); font-size: 48px; color: rgba(0, 0, 0, 0.1); z-index: -1; }
.container img { max-width: 100%; height: auto; border-radius: 10px; margin-bottom: 15px; }
.callout { padding: 30px; background-color: #eee; border: 2px solid #ddd; border-radius: 10px; margin-top: 30px; }
.callout-wrapper { display: flex; justify-content: space-between; }
.mb30 { margin-bottom: 30px; }
.mb10 { margin-bottom: 10px; }
.social-icons { text-align: center; margin: 20px 0; }
.social-icons img { width: 75px; height: 75px; margin: 0 15px; transition: transform 0.3s ease; }
.social-icons img:hover { transform: scale(1.1); }
.social-icons p { text-align: center; }
.social-icons p a { display: inline-block; margin: 0 10px; vertical-align: middle; }
html, body { overflow-x: hidden; }

/* =================================================================== */
/* === HERO SLIDESHOW (FINAL, CLEANED VERSION) ======================= */
/* =================================================================== */

/* 1. The main hero wrapper */
#block-slideshow-front-slideshow {
  position: relative;
  width: 100%;
  height: 90vh;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: #2c2c2c; /* Fallback color */
}

/* 2. All inner containers of the slideshow must fill the wrapper */
#block-slideshow-front-slideshow .view-content,
#block-slideshow-front-slideshow .skin-default,
#block-slideshow-front-slideshow .views_slideshow_cycle_main,
#block-slideshow-front-slideshow .views_slideshow_cycle_teaser_section {
  position: relative;
  width: 100% !important;
  height: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* 3. Each individual slide stacks on top of each other */
#block-slideshow-front-slideshow .views_slideshow_cycle_slide {
  position: absolute !important;
  top: 0; left: 0; right: 0; bottom: 0;
}

/* 4. The image itself must cover the entire slide */
#block-slideshow-front-slideshow .views_slideshow_cycle_slide img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

/* 5. The text overlay container */
#block-slideshow-front-slideshow .view-header {
  position: absolute;
  top: 0; left: 0; right: 0; bottom: 0;
  z-index: 10;
  pointer-events: none; /* Allows clicks to pass through empty space */
}

/* 6. Position and style the text and buttons */
#block-slideshow-front-slideshow .vcenter-container.front-text {
  position: absolute;
  top: 250px; /* Your desired vertical offset */
  left: 50%;
  transform: translateX(-50%);
  width: min(92%, 1200px);
  text-align: center;
  pointer-events: auto; /* Re-enables clicks on this specific element */
}

#block-slideshow-front-slideshow h1.text-white {
  color: #fff;
  margin: 0 0 18px;
  font: 700 clamp(38px, 6vw, 68px)/1.15 Montserrat, Verdana, sans-serif;
  text-shadow: 0 0 8px rgba(0,0,0,.95), 0 0 14px rgba(0,0,0,.85);
}

#block-slideshow-front-slideshow .block-action .btn {
  color: #fff !important;
  background: #8b1919  !important;
  border: 2px solid #fff !important;
  font-weight: 700;
  padding: 12px 22px;
  margin: 10px 8px;
  text-transform: uppercase;
  border-radius: 4px;
  transition: all .2s ease;
}

#block-slideshow-front-slideshow .block-action .btn:hover {
  background: #fff !important;
  color: #8b1919 !important;
  transform: translateY(-2px);
}

/* =================================================================== */
/* === OTHER FRONT PAGE BLOCKS & GLOBAL RULES ======================== */
/* =================================================================== */

.highlighted, .block-system-breadcrumb-block, .tabs { display: none; }
#main-wrapper { max-width: 100%; margin: auto; }
@media (min-width: 1400px) { .container { max-width: 100%; margin: 0; padding: 0; } }

div#block-barrio-boostrap-5-makehaven-fronttoolstomakeanything,
div#block-barrio-boostrap-5-makehaven-frontemailsignup,
div#block-barrio-boostrap-5-makehaven-frontthreethingsfront {
  z-index:10; background: #d3d3d39c;
}
div#block-barrio-boostrap-5-makehaven-frontthreethingsfront,
div#block-barrio-boostrap-5-makehaven-frontemailsignup {
	background-color: #8b1919;
}
div#block-barrio-boostrap-5-makehaven-fronttoolstomakeanything .content,
div#block-barrio-boostrap-5-makehaven-frontemailsignup .content,
div#block-barrio-boostrap-5-makehaven-frontthreethingsfront .content {
  max-width: 1000px; margin: auto;
}
main#content .section { padding: 0; }
.block-content-basic h2 { font-family: 'Roboto Condensed',sans-serif; font-weight: 700; text-align: center; color: white; font-size: 50px; padding-top: 50px; }
.callout.bordered.no-margin, .path-frontpage .node__content { display: none; }

/* Desktop styles for other blocks */
div#block-barrio-boostrap-5-makehaven-frontthreethingsfront { min-height: 630px; }
div#block-barrio-boostrap-5-makehaven-fronttoolstomakeanything { min-height: 1400px; }
div#block-barrio-boostrap-5-makehaven-fronttoolstomakeanything h2 { color: darkslategrey; }
#block-barrio-boostrap-5-makehaven-frontthreethingsfront .service-content { background: transparent; border: 0; }
#block-barrio-boostrap-5-makehaven-frontthreethingsfront .service-title.title-underblock.dark,
#block-barrio-boostrap-5-makehaven-frontthreethingsfront .service p,
div#block-barrio-boostrap-5-makehaven-frontemailsignup p { color: white; }

/* Mailchimp form styles */
div#block-barrio-boostrap-5-makehaven-frontemailsignup {
  min-height: 250px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding: 3rem 1rem;
}
#mc_embed_signup { background-color: transparent; border: none; padding: 0; margin: 0; width: 100%; text-align: center;}
#mc_embed_signup_scroll { display: inline-flex; flex-direction: column; align-items: center; justify-content: center; }
#mc_embed_signup_scroll .button {
  background-color: #8b1919;
  color: white;
  border: none;
  padding: 10px 20px;
  border-radius: 3px;
  font-size: 16px;
  cursor: pointer;
}
#mc_embed_signup_scroll .button:hover { background-color: #0056b3; }
#mc_embed_signup_scroll .mc-field-group,
#mc_embed_signup_scroll .optionalParent,
#mc_embed_signup_scroll .indicates-required,
#mc_embed_signup_scroll h2 {
    display: none;
}

/* Mobile styles */
@media (max-width: 767px) {
  #block-slideshow-front-slideshow h1.text-white { font-size: 40px; }
  div#block-barrio-boostrap-5-makehaven-frontthreethingsfront { min-height: 1600px; z-index: 10; }
  div#block-barrio-boostrap-5-makehaven-fronttoolstomakeanything { min-height: 3200px; }
  div#block-barrio-boostrap-5-makehaven-frontemailsignup { min-height: 250px; }
}

