/* Center align on mobile */ 

@media (max-width: 650px) { 
    
.mobile-center-view { text-align: center !important; } 

.mobile-center-view .btn { margin-left: auto; margin-right: auto; display: block; } 

}

.customfontcolour {
    color: rgb(73 182 73) !important;/* solid green */
}

.customfontcolour2 {
    color:#800080 !important; /* solid purple */
}

.customfontcolour3 {
   color: #787873 !important;
}



.custombackground1 {
    background-color: rgb(107, 124, 107) !important;/* solid green */
}

.custombackground2 {
    background-color: rgb(73 182 73) !important;/* solid green */
}


.logo-small {
  max-width: 140px;   /* adjust size to taste */
  height: auto;       /* keeps proportions */
}


.archivo { font-family: 'Archivo Black', sans-serif; }

.impact { font-family: Impact, Haettenschweiler, 'Arial Narrow Bold', sans-serif; }

.roboto {
  font-family: "Roboto", sans-serif;
  font-optical-sizing: auto;
  font-weight: 900;
  font-style: normal;
  letter-spacing: -2px;
  font-variation-settings: "wdth" 100;
}

.robotonormal {
  font-family: "Roboto", sans-serif;
  font-optical-sizing: auto;
  font-weight: 500;
  font-style: normal;
  font-variation-settings: "wdth" 100;
}

.pacifico-regular {
  font-family: "Pacifico", cursive;
  font-weight: 100;
  font-style: normal;
}

.text_shadow{
text-shadow: 2px 2px 4px rgba(0,0,0,0.4);
}
.hero-banner-custom {
  width: 100%;
  background-image: url('images/banner3.jpg');
  background-size: cover;        /* Ensures full coverage */
  background-position: center;   /* Keeps focal point centered */
  background-repeat: no-repeat;
  display: flex;
  align-items: center;           /* Vertically center content */
  justify-content: center;       /* Horizontally center content */
  color: white;
  text-align: center;
  padding: 2rem;
  background-attachment: fixed;

  
}

.hero-content-custom {
  max-width: 800px;
}


.hero-banner-custom2 {
  position: relative;
  width: 100%;
  background-image: url('images/banner2.jpg');
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  display: flex;
  align-items: center;
  justify-content: center;
  color: white;
  text-align: center;
  padding: 2rem;
  background-attachment: fixed;
  overflow: hidden; /* ensures blur stays inside */
}

/* Blurred overlay */
.hero-banner-custom2::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image: inherit;
  background-size: inherit;
  background-position: inherit;
  background-repeat: inherit;
  filter: blur(4px); /* adjust blur strength */
  transform: scale(1.1); /* prevents edge clipping */
  z-index: 0;
}

/* Keep content above the blur */
.hero-banner-custom2 > * {
  position: relative;
  z-index: 1;
}



.glass-box {
  background: rgb(124 118 110 / 26%); /* translucent layer */
  backdrop-filter: blur(12px);           /* frosted glass blur */
  -webkit-backdrop-filter: blur(12px);   /* Safari support */
  padding: 2rem;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.2);
  color: #fff;
}

.service-image {
  width: 100%;
  height: 200px;              /* Adjust height to suit your design */
  object-fit: cover;          /* Ensures images fill the box without distortion */
  border-radius: 0.5rem;      /* Matches Bootstrap rounded-3 look */
}

@media (min-width: 768px) {
  .service-image {
    height: 250px;            /* Slightly taller on tablets/desktops */
  }
}


.shadow-strong {
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.35) !important;
    transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.shadow-strong:hover {
    transform: translateY(-5px);
    box-shadow: 0 12px 35px rgba(0, 0, 0, 0.45) !important;
}


.journey-card {
    position: relative;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
  }
  .journey-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 8px 20px rgba(0,0,0,0.15);
  }
  .step-number {
    position: absolute;
    top: -15px;
    left: 15px;
    background: #198754;
    color: #fff;
    font-weight: bold;
    padding: 6px 14px;
    border-radius: 30px;
    font-size: 1rem;
  }

.pattern-green {
  background-color: #49B649;
  background-image:
    linear-gradient(rgba(255,255,255,0.15) 2px, transparent 2px),
    linear-gradient(90deg, rgba(255,255,255,0.15) 2px, transparent 2px),
    linear-gradient(rgba(255,255,255,0.10) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,0.10) 1px, transparent 1px);
  background-size: 120px 120px, 120px 120px, 40px 40px, 40px 40px;
}


.hero-section {
  background: url("images/banner2.webp") center/cover no-repeat;
  min-height: 50vh;
  background-attachment: fixed;
}

.hero-section-other {
  background: url("images/banner2.webp") center/cover no-repeat;
  background-attachment: fixed;
 
}

.hero-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(
    to right,
    #49B649,
    rgba(255, 255, 255, 0.25)
  );
}

.min-vh-75 {
  min-height: 75vh;
}

@media (max-width: 576px) {
.min-vh-75 {
  min-height: 0vh;
  padding-top: 40px;
}}



@media (max-width: 576px) { .navbar-brand h1 { font-size: 1.2rem; line-height: 1.3; } .slogan { font-size: 0.9rem; display: block; } }



@media (max-width: 576px) { .topbar-row { display: flex; justify-content: space-between; align-items: center; flex-wrap: nowrap; /* prevents wrapping */ white-space: nowrap; } .topbar-row .col-lg-6 { flex: 1 1 auto; /* makes both sides share the same line */ text-align: left; /* optional: adjust as needed */ } .topbar-row .text-end { text-align: right !important; } }


.special-offer-banner {
  background: linear-gradient(
    135deg,
    #49B649,
    #198754
  );
  
}


 .sticky-buttons {
    position: fixed;
    top: 50%;
    right: 0;
    transform: translateY(-50%);
    z-index: 1050;
    width: 220px;
  }

  .sticky-buttons a {
    border-radius: 0;
    white-space: nowrap;
  }

  @media (max-width: 768px) {
    .sticky-buttons {
      width: 100%;
      right: auto;
      left: 0;
      top: auto;
      bottom: 0;
      transform: none;
      flex-direction: row;
      justify-content: space-around;
    }

    .sticky-buttons a {
      flex: 1;
      border-radius: 0;
      font-size: 0.9rem;
      padding: 0.45rem;
    }
  }

 /* =========================
   MODERN PRODUCT MODALS
========================= */

/* Offer badge */
.offer-badge {
  position: absolute;
  top: 16px;
  right: 16px;
  background: #dc3545;
  color: #fff;
  padding: 6px 14px;
  border-radius: 999px;
  font-size: 0.85rem;
  font-weight: 600;
  letter-spacing: 0.3px;
}

/* Image wrapper */
.modal-product-img {
  position: relative;
}

.modal-product-img img {
  border-radius: 16px;
  box-shadow: 0 10px 30px rgba(0,0,0,0.12);
}

/* Feature list */
.modal-features {
  padding-left: 1.1rem;
}

.modal-features li {
  margin-bottom: 10px;
}

/* Colour options */
.colour-options {
  display: flex;
  gap: 10px;
  margin-top: 8px;
}

.colour-dot {
  width: 18px;
  height: 18px;
  border-radius: 50%;
  border: 1px solid #ccc;
}

/* Example colours */
.colour-white { background: #ffffff; }
.colour-grey { background: #8c8c8c; }
.colour-black { background: #000000; }
.colour-oak { background: #b88a5a; }
.colour-anthracite { background: #2f343a; }

/* Modal CTA polish */
.modal-footer {
  justify-content: space-between;
}

.modal-footer .btn {
  padding: 10px 22px;
  font-weight: 600;
}


html, body {
    height: 100%;
    margin: 0;
    padding: 0;
}

.full-height-iframe {
    height: 100vh; /* full viewport height */
    width: 100%;
    border: none;
}