/*
Theme Name: Bridges Construction Reno Nevada
Theme URI: https://bridgesconst.com
Description: Bridges Construction Reno Nevada. Bootstrap - Wordpress.
Author: Quantum Marketing Design
Author URI: https://quantummarketing.design
Template: bootstrap-basic4
Version: 2.0
*/

/* Generated by Orbisius Child Theme Creator (https://orbisius.com/products/wordpress-plugins/orbisius-child-theme-creator/) on Thu, 05 Mar 2026 22:04:43 +0000 */ 
/* The plugin now uses the recommended approach for loading the css files.*/

html, body {
  overflow-y: scroll;
  overflow-x: hidden !important;
  scroll-behavior: smooth !important;
  -webkit-font-smoothing: antialiased !important;
  font-family: sans-serif;
  font-optical-sizing: auto;
  font-weight: normal;
  font-style: normal;
}
body {
  -webkit-font-smoothing: antialiased !important;
  padding: 0px;
  margin: 0px;
  background-color: #ce6738 !important;
  overflow: visible !important;
}
a:visited {
  text-decoration: none;
}
a:hover, a:active, a:focus {
  transition: all 0.3s ease 0s !important;
  text-decoration: none !important;
}
a:focus {
  outline: 0 !important;
  border: 0 !important;
}
td {
  text-decoration: none;
}
th {
  text-decoration: none;
}
img {
  border-style: none;
  max-width: 100%;
  display: block;
}
a img {
  border: none;
}

a:focus, a:active {
  outline: none !important;
}

input::-moz-focus-inner {
  outline: 0 !important;
  border: 0 !important;
}
input:focus, textarea:focus, select:focus {
  outline: 0 !important;
  outline: none !important;
}
*:focus {
  outline: 0 !important;
  outline: none !important
}

/* Main Headlines (Strong & Modern) */
h1, h2, .hero-title {
  font-family: 'Montserrat', sans-serif;
  font-weight: 700;
}

/* Sub-headlines or UI Elements (Clear & Technical) */
h3, h4, h5, h6, .nav-links, .button {
  font-family: 'Inter', sans-serif;
  font-weight: 600;
}

/* Body Text (Readable & Professional) */
body, p, li {
  font-family: 'Open Sans', sans-serif;
  font-weight: 400;
  line-height: 1.6;
}

/* Preloader */
#preloader {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 9999;
  overflow: hidden;
  background: #fff;
}
/* The Spinning Ring - Larger Scale */
#preloader:before {
  content: "";
  position: fixed;
  top: calc(50% - 60px); /* Half of 120px */
  left: calc(50% - 60px);
  width: 120px;
  height: 120px;
  border: 5px solid #efefef;
  border-top-color: #ce6738;
  border-radius: 50%;
  -webkit-animation: animate-preloader 1s linear infinite;
  animation: animate-preloader 1s linear infinite;
}
/* The Static Logo - Larger Scale */
#preloader:after {
  content: "";
  position: fixed;
  top: calc(50% - 40px); /* Half of 80px */
  left: calc(50% - 40px);
  width: 80px;
  height: 80px;
  background-image: url('/wp-content/uploads/2026/03/favicon.svg');
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
}
@keyframes animate-preloader {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}

/* End Preloader */

/* Header */
#mainHeader {
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 1050;
    transition: all 0.3s ease-in-out;
}

.bc-info-txt {
    transition: opacity 0.3s ease, height 0.3s ease, padding 0.3s ease;
    overflow: hidden;
	background-color: #ce6738;
	font-size: clamp(.7rem, 2.5vw + 0.5rem, .9rem);
}

.bc-info-txt a {
    color: #ffffff !important;
}

.bc-info-txt a:hover {
    color: #141414 !important;
}

@media (max-width: 991px) {
  .bc-info-txt {
    display: none !important;
  }
}

.header-scrolled .bc-info-txt {
    opacity: 0;
    height: 0;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    margin: 0 !important;
}
/* End Header */

/* Nav */
.hdr_logo img {
	display: block !important;}

@media (min-width: 992px) {
  .nav-item.dropdown .dropdown-menu {
    display: block;
    opacity: 0;
    visibility: hidden;
    transform: translateY(10px);
    transition: all 0.3s ease-in-out;
    margin-top: 0;
  }

  .nav-item.dropdown:hover .dropdown-menu {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
  }

	.navbar-nav .dropdown-menu {margin-top: 0px !important;}
}

@media (max-width: 991.98px) {
  .navbar-nav .dropdown-menu {
    width: 90%;
    margin: 10px auto !important;
    float: none !important;
    text-align: center;
  }

  .link-grid-row {
    flex-direction: column;
  }
}

/* ============================
   Fully scrollable mobile navbar
   ============================ */
@media (max-width: 991.98px) { /* Bootstrap lg and below */

  /* 1. Make the entire collapsed navbar scrollable */
  .navbar-collapse {
    max-height: 80vh;       /* Menu max height relative to viewport */
    overflow-y: auto;       /* Enable vertical scroll */
    padding-right: 0.5rem;  /* Optional: keep some space for scrollbar */
  }

  /* Optional scrollbar styling */
  .navbar-collapse::-webkit-scrollbar {
    width: 6px;
  }
  .navbar-collapse::-webkit-scrollbar-thumb {
    background-color: rgba(0,0,0,0.3);
    border-radius: 3px;
  }

  /* 2. Make individual dropdown menus scrollable */
  .navbar-nav .dropdown-menu {
    max-height: 80vh;       /* Dropdown max height */
    overflow-y: auto;       /* Enable vertical scroll */
  }

  /* 3. Keep multi-column dropdowns scrollable */
  .navbar-nav .dropdown-menu .row {
    max-height: 80vh;
    overflow-y: auto;
  }

  /* 4. Wrap long text properly in dropdowns */
  .dropdown-menu .dropdown-item {
    white-space: normal;
  }
}

/* End Nav */

/* Toggler */

.toggler-icon {
    display: block;
    width: 25px;
    height: 3px;
    background-color: #ce6738;
    margin: 5px 0;
    transition: all 0.35s ease-in-out;
    transform-origin: center;
}

.navbar-toggler:not(.collapsed) .top-bar {
    transform: translateY(8px) rotate(45deg);
}

.navbar-toggler:not(.collapsed) .middle-bar {
    opacity: 0;
}

.navbar-toggler:not(.collapsed) .bottom-bar {
    transform: translateY(-8px) rotate(-45deg);
}


.navbar-nav .nav-link:active {
    background-color: #ce6738 !important;
    color: #fff !important;
	border-radius: 5px !important;
}


.dropdown-menu .dropdown-item:hover,
.dropdown-menu .dropdown-item:focus,
.dropdown-menu .dropdown-item:active,
.dropdown-menu .dropdown-item.active {
    background-color: #ce6738 !important;
    color: #ffffff !important;
    outline: none;
	border-radius: 5px !important;
}

.show > .nav-link.dropdown-toggle {
    background-color: #ce6738 !important;
    color: #ffffff !important;
}

/* End Toggler */

/* Breadcrumbs Nav */
/* Default for large screens and above */
.page-title {
  position: fixed;
  top: 109px; /* large screen default */
  left: 0;
  right: 0;
  width: 100%;
  z-index: 998;
}

/* Medium screens (Bootstrap md: 768px–991.98px) */
@media (max-width: 991.98px) {
  .page-title {
    top: 109px; /* adjust as needed for medium screens */
  }
}

/* Small screens (Bootstrap sm: 576px–767.98px) */
@media (max-width: 767.98px) {
  .page-title {
    top: 97px; /* adjust as needed for small screens */
  }
}

header { 
  z-index: 1000 !important; 
}

.breadcrumbs { font-weight: normal; }
.page-title .container { margin: 0; padding: 0; }
.page-title nav {
  background-color: #ce6738 !important;
  padding: 0 0 9px 0 !important;
  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.07);
}

.page-title nav a { color: #ffffff !important; transition: color 0.3s ease; }
.page-title nav a:hover { color: #ffefe7 !important; transition: color 0.3s ease; }
.page-title nav ol { 
  display: flex !important; 
  flex-wrap: wrap !important; 
  list-style: none !important; 
  margin: 0 !important; 
  padding: 0 12px; 
  font-size: .8rem !important; 
  color: #ffffff !important; 
}
.page-title nav ol li + li::before { 
  content: "|" !important; 
  display: inline-block !important; 
  padding-right: 5px !important; 
  color: rgba(255, 255, 255, 0.5) !important; 
}

/* End Breadcrumbs Nav */

/* Content & Extras */

.txt-brn {color: #ce6738}

.text-content a {color: #ce6738}

.text-content a:hover {text-decoration: underline !important;}

.dropshadow {
    text-shadow: 2px 2px 4px rgba(0,0,0,0.8);
  }
.bc-light-bg {background-color: #ffefe7;}

.bc-brn-bg {background-color: #ce6738;}

.get-quote {
  background: linear-gradient(rgb(0, 0, 0, 0.8), rgb(0, 0, 0, 0.6)), url("/wp-content/uploads/2026/03/bridges-construction_kitchen-95.webp") center center; /* Chrome 10-25, Safari 5.1-6 */
  background: linear-gradient(rgb(0, 0, 0, 0.8), rgb(0, 0, 0, 0.6)), url("/wp-content/uploads/2026/03/bridges-construction_kitchen-95.webp") center center; /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
  padding: 120px 0;
  /* Full height */
  height: 100%;
  /* Create the parallax scrolling effect */
  background-attachment: fixed;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

.map-responsive {
  min-height: 380px;
  border: 1px solid #ececec;
  background-color: #ececec;
  overflow: hidden;
  position: relative;
  height: 100%;
}

.bc-awards {max-width: 95px;}

/* Start with solid orange fill and a subtle shadow */
.btn-outline-light {
  background-color: #ce6738 !important;
  border-color: #ce6738 !important;
  color: #ffffff !important;
  transition: all 0.3s ease;
  /* Subtle drop shadow: slightly blurred and soft */
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); 
}

/* Hover: White background and a slightly stronger shadow */
.btn-outline-light:hover, 
.btn-outline-light:active, 
.btn-outline-light:focus {
  background-color: #ffffff !important;
  border-color: #ffffff !important;
  color: #ce6738 !important;
  /* Increases the shadow and lifts the button 2px for a 'floating' feel */
  box-shadow: 0 6px 12px rgba(0, 0, 0, 0.15);
  transform: translateY(-2px);
}

/* Pressed state: Shadow shrinks to look like it's touching the page */
.btn-outline-light:active {
  transform: translateY(0px);
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}


/* End Content & Extras */

/* Home Page BC Reviews */

.ti-widget.ti-goog .ti-controls .ti-next, .ti-widget.ti-goog .ti-controls .ti-prev {background-color: #ce6738 !important;}

.ti-widget.ti-goog .ti-controls .ti-next:before {border-color: #ffffff !important;}

.ti-widget.ti-goog .ti-controls .ti-prev:before {border-color: #ffffff !important;}

.bridges-review-carousel{
  position:relative;
  height:300px!important;
}
.bridges-review-carousel .carousel-inner{
  height:100%;
  overflow:hidden;
  background:transparent !important;
  border:none !important;
  box-shadow:none !important;
}
.bridges-review-carousel .carousel-item{
  height:300px!important;
  padding-right:70px;
  transition: transform 1s ease-in-out; /* slower slide */
}
.bridges-review-text{
  height:100%;
  display:flex;
  align-items:center;
  overflow-y:auto;
}
	  
p.bc-review {
  font-size: clamp(0.7rem, 2.5vw + 0.5rem, 0.9rem);
  line-height: 1.4; /* makes spacing proportional to font size */
  margin-bottom: 0.5rem; /* optional: space before reviewer name */
}


.bi-star-fill {color: #edbc41 !important;}

/* Controls for right side */
.bridges-review-controls{
  position:absolute;
  bottom:0;
  right:0;
  display:flex;
  gap:6px;
}

/* Controls for left side */
.bridges-review-controls-left{
  position:absolute;
  bottom:0;
  left:0;
  display:flex;
  gap:6px;
}

/* All buttons identical style */
.bridges-review-controls button,
.bridges-review-controls-left button {
  border: none;
  background: #ce6738;
  width: 36px;
  height: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 4px;
  cursor: pointer;
  /* Smoothly animate the color change */
  transition: background-color 0.2s ease;
}

/* Hover state: Makes the orange slightly darker */
.bridges-review-controls button:hover,
.bridges-review-controls-left button:hover {
  background: #b5562d; 
}

/* Active state: Makes it look 'pressed' when clicked */
.bridges-review-controls button:active,
.bridges-review-controls-left button:active {
  background: #9a4825;
  transform: translateY(1px);
}

.bridges-review-controls i,
.bridges-review-controls-left i {
  font-size: 18px;
  color: #fff;
}

.bridges-review-text {
  display: flex;
  flex-direction: column; /* stack content vertically */
  justify-content: center; /* center review text vertically in carousel-item */
  height: 100%;
  overflow-y: auto;
  gap: 0.5rem; /* optional spacing between text and reviewer */
}

.bridges-review-text .reviewer {
  align-self: flex-start; /* keep reviewer aligned left; change to center if desired */
  margin-top: 0.5rem; /* optional spacing */
  font-style: italic;
  color: #333;
}
/* End Home Page BC Reviews */


/* Home Page Hero Carousel */

.heroCarousel,
.hero-carousel,
#heroCarousel {
  height: 70vh;
  max-height: 700px;
  overflow: hidden;
}

/* Larger screens */
@media (min-width: 1200px) {
  .heroCarousel,
  .hero-carousel,
  #heroCarousel {
    height: 80vh;
    max-height: 850px;
  }
}

@media (min-width: 1600px) {
  .heroCarousel,
  .hero-carousel,
  #heroCarousel {
    height: 88vh;
    max-height: 950px;
  }
}

.heroCarousel .carousel-inner,
.hero-carousel .carousel-inner,
#heroCarousel .carousel-inner {
  height: 100%;
}

.heroCarousel .carousel-item,
.hero-carousel .carousel-item,
#heroCarousel .carousel-item {
  height: 100%;
}

/* Default image behavior */
.heroCarousel img,
.hero-carousel img,
#heroCarousel img {
  height: 100%;
  width: 100%;
  object-fit: cover;
  object-position: center;
}

/* Mobile portrait */
@media (max-width: 768px) and (orientation: portrait) {
  .heroCarousel,
  .hero-carousel,
  #heroCarousel {
    height: 60vh;
  }

  .heroCarousel img,
  .hero-carousel img,
  #heroCarousel img {
    object-position: center top; /* show top content */
  }
}

/* Mobile landscape fix (key issue you’re seeing) */
@media (max-width: 768px) and (orientation: landscape) {
  .heroCarousel,
  .hero-carousel,
  #heroCarousel {
    height: 100vh; /* use full height so it doesn't crop too hard */
    max-height: none;
  }

  .heroCarousel img,
  .hero-carousel img,
  #heroCarousel img {
    object-position: center center;
  }
}

/* End Home Page Hero Carousel */

/* Sub-Page Hero */

.ux-hero-container {
    position: relative;
    width: 100%;
    min-height: 700px;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

/* Taller on desktop */
@media (min-width: 1200px) {
    .ux-hero-container {
        min-height: 950px;
    }
}

/* Extra tall on large monitors */
@media (min-width: 1600px) {
    .ux-hero-container {
        min-height: 1100px;
    }
}

.ux-hero-overlay {
    position: absolute;
    inset: 0;
    /* Gradient: Transparent at the top, darker at the bottom */
    background: linear-gradient(
        to bottom,
        rgba(0, 0, 0, 0.1) 0%,
        rgba(0, 0, 0, 0.4) 100%
    );
    z-index: 1;
}

.ux-hero-content {
    position: relative;
    z-index: 2;
    color: #ffffff;
    text-align: center;
    padding: 120px 0;
    width: 100%;
}

.ux-hero-curve {
    position: absolute;
    bottom: -1px;
    left: 0;
    width: 100%;
    line-height: 0;
    z-index: 3;
}

.ux-hero-curve svg {
    display: block;
    width: 100%;
    height: 100px;
}

/* End Sub-Page Hero */


.carousel-control-prev-icon,
.carousel-control-next-icon {
  width: 50px;
  height: 50px;
  background-color: rgba(0, 0, 0, 0.4);
  background-size: 50% 50%;
  border-radius: 50%;
  transition: background-color 0.3s ease;
}

.carousel-control-prev-icon {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cpath d='M 75,10 L 35,50 L 75,90 L 65,100 L 15,50 L 65,0 Z' fill='%23fff'/%3E%3C/svg%3E");
}

.carousel-control-next-icon {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cpath d='M 25,10 L 65,50 L 25,90 L 35,100 L 85,50 L 35,0 Z' fill='%23fff'/%3E%3C/svg%3E");
}

.carousel-control-prev:hover .carousel-control-prev-icon,
.carousel-control-next:hover .carousel-control-next-icon {
  background-color: #ce6738; /* Your brand orange */
}

.carousel-control-prev:active .carousel-control-prev-icon,
.carousel-control-next:active .carousel-control-next-icon {
  background-color: #ce6738;
  box-shadow: inset 0 4px 8px rgba(0, 0, 0, 0.3);
}

/* Target the indicator buttons */
.carousel-indicators [data-bs-target] {
  width: 12px;           /* Set equal width and height */
  height: 12px;
  border-radius: 50%;    /* Makes them perfect circles */
  background-color: #fff; 
  border: 2px solid transparent; /* Prevents clicking issues */
  margin-left: 6px;
  margin-right: 6px;
  opacity: 0.5;
  transition: all 0.3s ease;
}

/* Style for the active dot */
.carousel-indicators .active {
  opacity: 1;
  background-color: #ce6738; /* Uses your brand orange */
  transform: scale(1.2);     /* Makes the active dot slightly larger */
}

/* Optional: Hover effect */
.carousel-indicators [data-bs-target]:hover {
  opacity: 0.8;
}


/* Before & After Slider */
#before-after-carousel {
    height: auto !important; 
    max-height: none !important;
    min-height: 0 !important;
	max-width: 850px;
	margin: auto;
  }

  #before-after-carousel .carousel-inner,
  #before-after-carousel .carousel-item {
    height: auto !important;
    max-height: none !important;
    min-height: 0 !important;
    aspect-ratio: 16 / 9 !important;
    background-color: transparent !important;
    overflow: hidden !important;
  }

  .ba-container {
    position: relative !important;
    width: 100% !important;
    height: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  .ba-container img {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    pointer-events: none !important;
  }

  .ba-before {
    z-index: 2 !important;
    clip-path: inset(0 50% 0 0);
  }

  .ba-input {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    opacity: 0 !important;
    z-index: 30 !important;
    cursor: ew-resize !important;
    margin: 0 !important;
  }

  .ba-line {
    position: absolute !important;
    top: 0 !important;
    bottom: 0 !important;
    left: 50%;
    width: 4px !important;
    background: #fff !important;
    z-index: 10 !important;
    pointer-events: none !important;
  }

  .ba-handle {
    position: absolute !important;
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    width: 44px !important;
    height: 44px !important;
    background: #fff !important;
    border-radius: 50% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-shadow: 0 4px 12px rgba(0,0,0,0.5) !important;
    color: #333 !important;
    font-size: 20px !important;
  }

  .ba-caption {
    position: absolute !important;
    bottom: 15px !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    z-index: 25 !important;
    background: rgba(0, 0, 0, 0.8) !important;
    color: #fff !important;
    padding: 10px 25px !important;
    border-radius: 40px !important;
    white-space: nowrap !important;
    pointer-events: none !important;
    font-family: sans-serif !important;
  }

  #before-after-carousel .carousel-control-prev,
  #before-after-carousel .carousel-control-next {
    z-index: 40 !important;
    width: 10% !important;
  }

/* End Before & After Slider */

 /* Carousels */
/* --- PREVIOUS MOBILE & LANDSCAPE STYLES --- */
.carousel, .carousel-inner, .carousel-item, .carousel-item img {
  height: 65vh;
  object-fit: cover;
}
.carousel-caption {
  position: absolute;
  top: 0; left: 0; right: 0; bottom: 0;
  background: rgba(0, 0, 0, 0.4);
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

@media only screen and (min-width: 320px) {
 .carousel-caption h2 {
    font-size: 1.4rem; /* Reduced from typical desktop sizes */
  }
}

@media only screen and (min-width: 480px) {
  .carousel-caption h2 {
    font-size: 1.65rem; /* Reduced from typical desktop sizes */
  }
}

/* --- NEW: MEDIUM & LARGE SCREEN OVERRIDES --- */

/* Medium Screens (Tablets, small laptops - 768px and up) */
@media (min-width: 768px) {
  .carousel-caption h2 {
    font-size: 1.85rem; /* Reduced from typical desktop sizes */
  }
  .carousel-caption .btn {
    font-size: 0.9rem;
    padding: 8px 16px;
  }
}

/* Large Screens (Desktops - 992px and up) */
@media (min-width: 992px) {
  .carousel-caption h2 {
    font-size: 2.5rem; /* Still smaller than standard display headings */
  }
  .carousel-caption .btn {
    font-size: 0.95rem;
    padding: 10px 20px;
  }
}

@media (max-height: 480px) and (orientation: landscape) {
  .carousel, .carousel-inner, .carousel-item, .carousel-item img { height: 100vh; }
  .carousel-caption h2 { font-size: 1.5rem !important; }
  .carousel-caption .btn { font-size: 0.8rem !important; padding: 4px 10px !important; }
}

 #bridgesCustomSlider.carousel {
      height: 190px;
      overflow: hidden;
    }
    #bridgesCustomSlider .carousel-inner,
    #bridgesCustomSlider .carousel-item {
      height: 190px;
    }
    #bridgesCustomSlider .carousel-item img {
      height: 190px;
      width: 100%;
      object-fit: cover;
    }

/* End Carousel */

/* Logo Carousel */
/* Logo Carousel Container */
.logo-carousel {
  margin: 0 auto;
  max-width: 100%;
  overflow: hidden;
  display: flex;
  user-select: none;
}

/* The horizontal track */
.group {
  display: flex;
  flex-shrink: 0;
  align-items: center;
  justify-content: space-around;
  min-width: 100%;
  gap: 40px; /* Adjust spacing between logos here */
  animation: scrolling 30s linear infinite; /* Increase time for slower/smoother speed */
}

/* Pause on hover */
.logo-carousel:hover .group {
  animation-play-state: paused;
}

/* Individual Card Styling */
.logo-carousel-card {
  flex: 0 0 auto;
  display: flex;
  justify-content: center;
  align-items: center;
}

.vendor-logo {
  max-height: 70px; /* Scaled down slightly for better alignment */
  width: auto;
  object-fit: contain;
}

@keyframes scrolling {
  from { transform: translateX(0); }
  to { transform: translateX(-100%); }
}

/* End Logo Carousel */

/* Product Pages */

.product-media {
  max-width: 1024px;
  margin: 0 auto;
}

.product-media img {
  width: 100%;
  height: auto;
  object-fit: cover;
}

.product-logo {
  max-width: 180px;
}

/* Remove extra spacing around carousels */
.product-media {
  padding: 0 !important; /* No extra padding */
}

/* Make carousel fit its image exactly */
.product-media .carousel,
.product-media .carousel-inner,
.product-media .carousel-item {
  margin: 0;
  padding: 0;
  height: auto; /* Allow height to wrap content */
}

/* Ensure images control the height */
.product-media .carousel-item img {
  display: block;   /* Remove inline spacing */
  width: 100%;      /* Full width responsive */
  height: auto;     /* Maintain aspect ratio */
}

/* Remove potential gap caused by line-height in carousel */
.carousel-item > img {
  vertical-align: top;
}

/* End Product Pages */

/* Footer */
.site-footer {background-color: #141414;
color: #ffffff;
border-top: 0;}

.site-footer address {
	font-size: clamp(.9rem, 2.5vw + 0.5rem, 1rem);
}

.site-footer p {
	font-size: clamp(.9rem, 2.5vw + 0.5rem, 1rem);
}

.site-footer p a {
	font-size: clamp(.9rem, 2.5vw + 0.5rem, 1rem);
    color: #ce6738 !important;
}

.site-footer p a:hover {
    color: #ffffff !important;
}

.site-footer h3 {font-size: clamp(1.2rem, 2vw, 1.5rem);
text-transform: uppercase;}

.link-list-column ul li {
    border-bottom: 1px solid rgba(255, 255, 255, 0.15); /* 1px light line (adjusted for dark backgrounds) */
    padding: 10px 0;
    display: flex;
    align-items: center;
}

.link-list-column ul li:last-child {
    border-bottom: none;
}

.link-list-column ul li a {
	font-size: clamp(.9rem, 2.5vw + 0.5rem, 1rem);
    text-decoration: none;
    color: #ffffff;
    transition: all 0.3s ease;
}

.link-list-column ul li a:hover {
    color: #ce6738 !important;
}

.link-list-column ul li i {
    color: #ffffff;
    font-size: 0.8rem;
    opacity: 0.6;
    margin-right: 10px;
}

.icon-flags {
  max-width: 32px !important;
  display: inline;
  position: relative;
  padding-right: 2px;
  padding-left: 2px;
}

#sub-contact {font-size: clamp(.9rem, 2.5vw + 0.5rem, 1rem);}

#sub-contact a {
    color: #ffffff !important;
}

#sub-contact a:hover {
    color: #ce6738 !important;
}

#sub-bar {
	background-color: #ce6738;
	color: #ffffff;
	z-index: 1030;
	display: none;
	font-size: clamp(.9rem, 2.5vw + 0.5rem, 1rem);
}

#sub-bar a {
    color: #ffffff !important;
}

#sub-bar a:hover {
    color: #141414 !important;
}

/* End Footer */

/* WPForms */

/* Labels & Sublabels */
.wpforms-field-label, 
.wpforms-field-sublabel {
    color: #ffffff !important;
}

/* Input Borders */
.wpforms-field-medium,
.wpforms-field-large,
.wpforms-field-name-first,
.wpforms-field-name-last {
    border: 0 !important;
	border-radius: 5px !important;
}

/* Submit Button */
.wpforms-submit {
    border: 1px solid #ffffff !important;
    background: transparent !important;
    color: #ffffff !important;
}

/* Submit Button Hover */
.wpforms-submit:hover {
    background: #ffffff !important;
    color: #ce6738 !important;
}

.wpforms-error::before {
color: #FDCC0D !important;
}

/* Your original rule to ensure the error text matches */
.wpforms-error {
    color: #FDCC0D !important;
}

/* End WPForms */

/* Custom, iPhone Retina */
@media only screen and (min-width: 320px) {
  .hdr_logo {
    max-width: 150px !important;
  }
	
	.ftr_logo {
    max-width: 150px !important;
  }
}

/* Extra Small Devices, Phones */
/* --- Mid-Mobile Breakpoint (480px+) --- */
@media only screen and (min-width: 480px) {
  .hdr_logo {
    max-width: 175px !important;
  }
	.ftr_logo {
    max-width: 125px !important;
  }
}
/* Small Devices, Tablets */
@media only screen and (min-width: 768px) {
  .hdr_logo {
    max-width: 200px !important;
  }
	.ftr_logo {
    max-width: 185px !important;
  }
}
/* Medium Devices, Desktops */
@media only screen and (min-width: 992px) {
  
}
/* Large Devices, Wide Screens */
@media only screen and (min-width: 1200px) {
  
}
/* X-Large Devices, Wide Screens */
@media (min-width: 1400px) {}

/* flickity.css */
* {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

.gallery {
  margin-bottom: 0;
}

/* Gallery cell */
.gallery-cell {
  width: 50%;
  margin-right: 10px;
  background: #000;
  border-radius: 8px;
  overflow: hidden;
}

.gallery-img-container {
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  background: #000;
}

.gallery-cell img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: contain;   /* shows the whole image */
  display: block;
}

/* Caption */
.gallery-img-caption {
  position: absolute;
  bottom: 20px;
  left: 50%;
  transform: translateX(-50%);
  color: white;
  font-weight: bold;
  text-shadow: 2px 2px 5px rgba(0,0,0,0.9);
  font-size: 1.25rem;
  pointer-events: none;
  width: 90%;
  text-align: center;
  z-index: 2;
}

/* --- Flickity Arrows --- */

.flickity-prev-next-button {
  width: 50px;
  height: 50px;
  border-radius: 50%;
  background: rgba(0, 0, 0, 0.3) !important;
  transition: all 0.3s ease;
  opacity: 1 !important;
  display: block !important;
}

.flickity-prev-next-button:disabled {
  opacity: 0.2 !important;
  cursor: not-allowed;
}

.flickity-prev-next-button:hover {
  background: #ce6738 !important;
}

.flickity-prev-next-button .arrow {
  fill: #fff;
  transition: fill 0.3s ease;
}

.flickity-prev-next-button:hover .arrow {
  fill: white;
}

.flickity-prev-next-button.previous {
  left: 20px;
}

.flickity-prev-next-button.next {
  right: 20px;
}

/* Active click state */
.flickity-prev-next-button:active {
  background: #ce6738 !important;
  box-shadow: inset 0 4px 8px rgba(0, 0, 0, 0.3);
  outline: none;
}

/* Hide dots */
ol.flickity-page-dots {
  display: none !important;
}

/* ---------------- RESPONSIVE ---------------- */

@media screen and (max-width: 992px) {
  .gallery-cell {
    width: 70%;
  }
}

@media screen and (max-width: 768px) {
  .gallery-cell {
    width: 100%;
    margin-right: 0;
  }

  .gallery-img-caption {
    font-size: 1rem;
    bottom: 15px;
  }

  .flickity-prev-next-button {
    width: 40px;
    height: 40px;
  }

  .flickity-prev-next-button.previous {
    left: 10px;
  }

  .flickity-prev-next-button.next {
    right: 10px;
  }
}

@media screen and (max-width: 480px) {
  .gallery-img-caption {
    font-size: 0.9rem;
    width: 95%;
  }
}

/* end flickity.css */