/***************************************************************************************************************
||||||||||||||||||||||||||       MASTER STYLESHEET FOR MECHANICHUB        ||||||||||||||||||||||||||||||||||||||
****************************************************************************************************************
||||||||||||||||||||||||||                TABLE OF CONTENT               |||||||||||||||||||||||||||||||||||||||
****************************************************************************************************************
****************************************************************************************************************

01. Imported styles
02. Flaticon reset styles
03. Header styles
04. Mainmenu styles
05. Rev_slider_wrapper styles
66. Call to action area Style
07. Categories area style
08. Fact counter area style
09. Latest Blog area style
10. Latest blog area style 
11. Testimonial area style
12. Brand area style
13. Single service style
14. Pricing table area style
15. About page style
16. Account page style
17. 404 page style style
18. Blog page style
19. Blog single style
20. Team page style
21. Shop page style style
22. Shop with sidebar Style
23. Shop single Style
24. Cart page style style
25. Contact page style

****************************************************************************************************************
||||||||||||||||||||||||||||            End TABLE OF CONTENT                ||||||||||||||||||||||||||||||||||||
****************************************************************************************************************/


/* Imported styles */
@import url('https://fonts.googleapis.com/css?family=Nunito:200,200i,300,300i,400,400i,600,600i,700,700i,800,800i,900,900i');
@import url('https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,600,600i,700,700i,800,800i');
@import url('https://fonts.googleapis.com/css?family=Lato:300,300i,400,400i,700,700i,900,900i');

@import url(imp.css);
@import url(bootstrap.min.css);
@import url(font-awesome.min.css);
@import url(hover.css);
@import url(jquery.bxslider.css);
@import url(owl.carousel.css);
@import url(owl.theme.default.min.css);
@import url(animate.css);
@import url(jquery.bootstrap-touchspin.css);
@import url('jquery.fancybox.css');
@import url('prettyPhoto.css');
/*** Flaticon css ***/
@import url(../fonts/flaticon/flaticon.css);
/*** Price filter***/
@import url(../assets/price-filter/nouislider.css);
@import url(../assets/price-filter/nouislider.pips.css);
/*** single shop slide ***/
@import url(flexslider.css);
/*** Time picker css ***/
@import url(../assets/timepicker/timePicker.css);
/*** Jquery ui css ***/
@import url(../assets/jquery-ui-1.11.4/jquery-ui.css);
/*** Revolution slider ***/
@import url(../assets/revolution/css/settings.css);
@import url(../assets/revolution/css/layers.css);
@import url(../assets/revolution/css/navigation.css);
/*** Bootstrap select picker css ***/
@import url(../assets/bootstrap-sl-1.12.1/bootstrap-select.css);
/*** Language Switcher ***/
@import url(../assets/language-switcher/polyglot-language-switcher.css);
@import url(../assets/js/main.css);

/* Global blurred background */
html {
    scroll-behavior: smooth;
}

.backtotop-wrap svg{
  display: none;
}
body {
    background: radial-gradient(
        circle at top left,
        #0f172a 0%,
        #070d1f 35%,
        #030816 70%,
        #020617 100%
    );
}



/*==============================================
   Base Css
===============================================*/
html,
body {
    margin: 0;
    padding: 0;
    width: 100%;
    overflow-x: hidden;
}

html,
body {
    height: 100%
}

body {
    font-family: 'Open Sans', sans-serif;
    color: #ffffff;
    font-size: 16px;
    font-weight: 500;
    margin: 40px 0 0;
    line-height: 30px;
}

p {
    font-family: 'Open Sans', sans-serif;
    font-size: 16px;
    font-weight: 500;
    line-height: 30px;
    color: #ffffff;
    margin-bottom: 20px;
    margin-top: 25px;
    text-align: justify;
}

button:focus {
    outline: none;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: 'Open Sans', sans-serif;
    color: #000000;
    margin: 12px;
    padding-top: -60px;
}

h3 {
    font-size: 20px;
    font-weight: 700;
}

.float_left {
    float: left;
}

.float_right {
    float: right;
}

h4 {}

a,
a:hover,
a:active,
a:focus {
    transition: all 0.5s ease 0s;
    text-decoration: none;
    outline: none;
}

img {
    max-width: 100%;
    height: auto;
}

i {
    font-style: normal;
}

ul,
li {
    list-style: none;
    margin: 0;
    padding: 0;
}

.sec-padding {}

button {
    border: none;
    background: transparent;
}

.thm-btn {
    text-align: center;
    font-size: 14px;
    font-weight: 700;
    text-transform: uppercase;
    transition: all 500ms ease;
    font-family: 'Nunito', sans-serif;
    display: block;
    border-radius: 30px;
    padding: 12px 25px 10px;
    transition: all 500ms ease;
}

.thm-btn:hover {
    color: #fbfbfb;
}

/* Scroll To Top styles */
.scroll-to-top {
    display: none !important;
    background: #d1162b;
    border: 1px solid #d1162b;
    bottom: 25px;
    color: #ffffff;
    cursor: pointer;
    font-size: 30px;
    font-weight: normal;
    height: 50px;
    line-height: 48px;
    position: fixed;
    right: 15px;
    text-align: center;
    transition: all 500ms ease 0s;
    width: 55px;
    z-index: 99999;
    -webkit-box-shadow: 0px 8px 23px -6px rgba(27, 27, 27, 1);
    -moz-box-shadow: 0px 8px 23px -6px rgba(27, 27, 27, 1);
    box-shadow: 0px 8px 23px -6px rgba(27, 27, 27, 1);
}

.scroll-to-top:hover {
    background: #111111;
    color: #fff;
}

/*Form validation styles */
input:focus,
textarea:focus,
select:focus {
    border-color: #43c3ea;
    outline: none;
}

/* Post pagination styles */
.post-pagination li {
    display: inline-block;
    margin: 0 3px;
}

.post-pagination li a {
    background: #fff none repeat scroll 0 0;
    border: 2px solid #e7e7e7;
    color: #848484;
    display: block;
    font-size: 20px;
    font-weight: 600;
    height: 55px;
    padding: 13px 0;
    transition: all 500ms ease 0s;
    width: 55px;
    font-family: 'Nunito', sans-serif;
    border-radius: 3px;
}

.post-pagination li.active a,
.post-pagination li:hover a {
    background: #d1162b;
    color: #fff;
    border: 2px solid #d1162b;
}

/* Overlay styles  */
.overlay-style-one {
    position: absolute;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    padding: 0px;
    color: #ffffff;
    opacity: 0;
    background: rgba(35, 53, 136, 0.9);
    -webkit-transform: perspective(400px) rotateX(-90deg);
    -moz-transform: perspective(400px) rotateX(-90deg);
    -ms-transform: perspective(400px) rotateX(-90deg);
    -o-transform: perspective(400px) rotateX(-90deg);
    transform: perspective(400px) rotateX(-90deg);
    -webkit-transform-origin: top;
    -moz-transform-origin: top;
    -ms-transform-origin: top;
    -o-transform-origin: top;
    transform-origin: top;
    -webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
    -o-transition: all 0.5s;
    transition: all 0.5s;
}

.overlay-style-one .box {
    display: table;
    height: 100%;
    width: 100%;
}

.overlay-style-one .box .content {
    display: table-cell;
    text-align: center;
    vertical-align: middle;
}

.review-box {}

.review-box ul {
    margin-left: -1px;
    margin-right: -1px;
}

.review-box ul li {
    display: inline-block;
    margin: 0 1px;
}

.review-box ul li i {
    color: #d1162b;
    font-size: 12px;
}

/*** 
=============================================
    Top bar area style
=============================================
***/
.top-bar-area {
    position: relative;
    z-index: 999;
    background: #f9f9f9;
    font-family: 'Lato', sans-serif;
    overflow: hidden;
    padding: 8px 0;
}

.top-contact-info {
    overflow: hidden;
    margin: 6px 0 5px;
}

.top-contact-info li {
    display: inline-block;
    float: left;
    padding-right: 25px;
    color: #b3b3b3;
    line-height: 24px;
    font-size: 16px;
    font-weight: 400;
}

.top-contact-info li:last-child {
    padding: 0;
}

.top-contact-info li span:before {
    font-size: 16px;
    line-height: 24px;
    display: inline-block;
    padding-right: 10px;
}

.top-bar-area .top-right {
    overflow: hidden;
}

.top-bar-area .top-right .social-links {
    overflow: hidden;
    padding-right: 30px;
    margin: 9px 0;
}

.top-bar-area .top-right .social-links li {
    display: inline-block;
    float: left;
    margin-right: 20px;
    line-height: 16px;
}

.top-bar-area .top-right .social-links li:last-child {
    margin: 0px;
}

.top-bar-area .top-right .social-links li a i {
    color: #afafb5;
    font-size: 15px;
    transition: all 500ms ease;
}

.top-bar-area .top-right .social-links li a:hover i {
    color: #d1162b;
}

.appoinment-button {
    margin: 0px;
}

.appoinment-button a {
    background: #d1162b;
    display: inline-block;
    font-family: 'Nunito', sans-serif;
    font-size: 16px;
    font-weight: 600;
    color: #ffffff;
    padding: 7px 15px 6px;
    line-height: initial;
    border-radius: 3px;
}

.appoinment-button a:hover {
    background: #162670;
}/* ==================================================
   WELCOME AREA – PROFESSIONAL ALIGNMENT (FINAL)
================================================== */

.welcome-area.sec-padding {
  padding: 70px 0;
  background: radial-gradient(circle at top left, #0c1220, #050914);
}

/* Layout */
.welcome-area .row {
  display: flex;
  align-items: center;
}

/* Columns */
.welcome-area .col-md-6 {
  padding: 0;
}

/* ===============================
   LEFT: TEXT CONTENT
================================ */

.welcome-area .text-holder {
  max-width: 520px;
}

.welcome-area .sec-title {
  margin-bottom: 18px;
}

.welcome-area .sec-title h1 {
  font-size: 44px;
  font-weight: 800;
  line-height: 1.25;
  margin: 0;
  color: #ffffff;
}

.welcome-area .sec-title h1 span {
  color: #e11d2a;
}

.welcome-area .text-holder .text-box {
  padding: 0;
}

.welcome-area .text-holder .text-box p {
  font-size: 20px;
  line-height: 28px;
  font-weight: 400;
  color: #e5e7eb;
  margin-bottom: 14px;
  text-align: justify;
  hyphens: auto;
  word-break: break-word;
}

/* ===============================
   RIGHT: CAROUSEL / IMAGE
================================ */

.welcome-area .col-md-6:last-child {
  display: flex;
  justify-content: center;
}

#welcomeCarousel,
#aboutCarousel,
#homeWelcomeCarousel {
  width: 100%;
  display: flex;
  justify-content: center;
}

#aboutCarousel .carousel-inner,
#homeWelcomeCarousel .carousel-inner {
  border-radius: 12px;
  overflow: hidden;
}

#aboutCarousel img,
#homeWelcomeCarousel img {
  width: 100%;
  max-width: 380px;
  height: 420px;
  object-fit: cover;
  border-radius: 12px;
  box-shadow: 0 25px 60px rgba(0, 0, 0, 0.45);
}

.carousel-item {
  transition: transform 0.8s ease-in-out;
}

/* ==================================================
   TABLET (≤ 992px)
================================================== */

@media (max-width: 992px) {

  .welcome-area.sec-padding {
    padding: 60px 0;
  }


  .welcome-area .text-holder {
    max-width: 100%;
    margin-bottom: 30px;
  }

  .welcome-area .sec-title h1 {
    font-size: 30px;
  }

  .welcome-area .text-holder .text-box p {
    font-size: 16px;
    line-height: 26px;
  }

  #aboutCarousel img,
  #homeWelcomeCarousel img {
    height: 300px;
  }
}
/* ==================================================
   FINAL MOBILE FIX – TEXT & IMAGE ALIGNMENT
   (Fixes current screenshot issue)
================================================== */

@media (max-width: 768px) {

  /* Stack layout cleanly */
  .welcome-area .row {
    flex-direction: column;
    align-items: center;
    gap: 20px;
  }

  /* Force SAME WIDTH for text & image */
  .welcome-area .text-holder,
  .welcome-area .welcome-image-wrap,
  #welcomeCarousel,
  #aboutCarousel,
  #homeWelcomeCarousel {
    width: 92%;
    max-width: 420px;
    margin: 0 auto;
  }

  /* Improve text readability */
  .welcome-area .sec-title h1 {
    text-align: center;
    font-size: 24px;
    line-height: 1.3;
  }

  .welcome-area .text-holder .text-box p {
    text-align: left;          /* ❗ stop justify on mobile */
    font-size: 15px;
    line-height: 24px;
  }

  /* HARD RESET IMAGE BEHAVIOR */
  #aboutCarousel img,
  #homeWelcomeCarousel img {
    width: 100% !important;
    height: auto !important;   /* 🔥 removes distortion */
    max-height: 240px;
    object-fit: cover;
    border-radius: 10px;
    display: block;
    margin: 0 auto;
  }
}


/* ==================================================
   MOBILE (≤ 576px)
================================================== */

@media (max-width: 764px) {

  .welcome-area.sec-padding {
    padding: 45px 0;
  }

  .welcome-area .sec-title h1 {
    font-size: 24px;
    line-height: 1.3;
    
  }

  .welcome-area .text-holder .text-box p {
    font-size: 15px;
    line-height: 24px;
  }

  #aboutCarousel img,
  #homeWelcomeCarousel img {
    max-width: 240px;
    height: 240px;
  }
}

/* ==================================================
   FINAL OVERRIDE – ABOUT CAROUSEL IMAGE
   (Fixes line 493 / 526 / 561 conflicts)
================================================== */

#welcomeCarousel img,
#aboutCarousel img,
#homeWelcomeCarousel img {
  width: 100% !important;
  max-width: 360px !important;
  height: 420px !important;
  object-fit: cover;
  border-radius: 12px;
  display: block;
  margin: 0 auto;
}


/* ==================================================
   FIX FOR 520px–768px (YOUR CURRENT ISSUE)
================================================== */

@media (max-width: 768px) {

  /* Group text + image better */
  .welcome-area .row {
    flex-direction: column;
    align-items: center;
    gap: 24px; /* 🔥 THIS FIXES THE VISUAL GAP */
  }

  /* Constrain text width for readability */
  .welcome-area .text-holder {
    max-width: 92%;
    margin: 0 auto;
  }

  /* Improve paragraph flow */
  .welcome-area .text-holder .text-box p {
    text-align: left;   /* ✅ justify looks bad on narrow screens */
    font-size: 15px;
    line-height: 25px;
  }

  /* Center and size carousel properly */
  .welcome-area .welcome-image-wrap,
  #welcomeCarousel,
  #aboutCarousel,
  #homeWelcomeCarousel {
    max-width: 300px;
    margin: 0 auto;
  }

  #aboutCarousel img,
  #homeWelcomeCarousel img {
    width: 100% !important;
    height: auto !important;   /* 🔥 MOST IMPORTANT */
    aspect-ratio: 4 / 3;       /* keeps image natural */
    max-height: 220px;
    border-radius: 10px;
  }
}


/* ==================================================
   WHY CHOOSE US – CLEAN FIX
================================================== */

.choosing-area .sec-title h1 {
  color: #ffffff;
  font-size: 36px;
  font-weight: 600;
  margin-bottom: 40px;
}

.choosing-area .row {
  display: flex;
  flex-wrap: wrap;
}

.choosing-area .row > [class*="col-"] {
  display: flex;
  margin-bottom: 30px;
}

.choosing-area .single-item {
  width: 100%;
  height: 100%;
}

/* ==================================================
   SERVICES TEXT FIX
================================================== */

.service-area .single-service-item .text-holder h3 {
  color: #000000;
}

.service-area .single-service-item .text-holder p {
  color: #000000;
  font-size: 15px;
  line-height: 26px;
  font-weight: 500;
}

/* ===============================
   CONTACT INFO SECTION
================================ */

.contact-info-area {
    padding: 40px 0;
    background: #f9f9f9;
}

.contact-info-area .title h2 {
    font-size: 28px;
    font-weight: 700;
    color: #ffffff;
    margin-bottom: 30px;
}

/* ===============================
   ROW LAYOUT
================================ */

.contact-info-area .contact-row {
    display: flex;
    justify-content: center;
    align-items: stretch; /* IMPORTANT for equal height */
    gap: 20px;
}

/* Desktop 3 cards */
@media (min-width: 992px) {
    .contact-info-area .contact-row > .col-md-4 {
        flex: 0 0 33.333%;
        max-width: 33.333%;
    }
}

/* Mobile single card */
@media (max-width: 767px) {
    .contact-info-area .contact-row {
        flex-direction: column;
    }

    .contact-info-area .contact-row > .col-md-4 {
        max-width: 100%;
    }
}

/* ===============================
   Vision & Mission Section
================================ */

.vision-mission-section {
  padding: 4rem 0;
 
}

/* Container */
.vm-container {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 1.5rem;
}

/* Section Title */
.section-title {
  text-align: center;
  font-size: 2.6rem;
  font-weight: 700;
  color: #ffffff;
  margin-bottom: 3rem;
}

/* ===============================
   Cards Grid (Desktop)
================================ */

.vm-row {

  display: grid;
  grid-template-columns: repeat(2, minmax(420px, 480px));
  justify-content: center;
  gap: 2rem;        /* ⬅ reduced gap */
}

/* ===============================
   Card Styling
================================ */

.vm-card {
  background: #ffffff;
  border-radius: 16px;
  padding: 1.3rem 1.5rem;   /* ⬅ reduced height */
  box-shadow: 0 10px 22px rgba(0,0,0,0.22);
  text-align:center;
}

.vm-header {
  display: flex;
  flex-direction: column;     /* ⬅ stack icon & text vertically */
  align-items: center;        /* ⬅ horizontal center */
  text-align: center;         /* ⬅ center heading text */
  gap: 10px;
  margin-bottom: 1.2rem;
}



.vm-header h4 {
  font-size: 24px;
  font-weight: 600;
  font-weight: 700;
  color: #d1162b;
  margin: 0;
}

/* ===============================
   Icons
================================ */
.vm-icon {
  width: 64px;              /* ⬅ increase icon container */
  height: 64px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;

  overflow: hidden;

  font-size: 26px;          /* ⬅ increase icon symbol size */
  color: #ffffff;
  flex-shrink: 0;
}


.vision-icon {
    justify-content: center;
  background: #d1162b;
}

.mission-icon {
  background: #d1162b;
}

.vm-card p {
  font-size: 15px;
  font-weight: 600;
  line-height: 24px;       /* ⬅ reduced from 28px */
  margin: 0;               /* ⬅ removes extra height */
  text-align: justify;
  color: #000;
}

/* Remove accent line if not needed */
.vm-card::before {
    display: none;
}
/* ===============================
   Tablet Responsiveness
================================ */

@media (max-width: 1024px) {
  .section-title {
    font-size: 2.3rem;
  }

  .vm-row {
    grid-template-columns: 1fr 1fr;
    gap: 1.8rem;
  }

  .vm-card.corporate {
    padding: 1.8rem 1.8rem;
  }
}

/* ===============================
   Mobile Responsiveness
================================ */

@media (max-width: 768px) {
  .section-title {
    font-size: 2rem;
    margin-bottom: 2rem;
  }

  .vm-row {
    grid-template-columns: 1fr;
    gap: 1.5rem;
  }

  .vm-card.corporate {
    padding: 1.6rem 1.5rem;
    border-radius: 16px;
  }

  .vm-header h4 {
    font-size: 16px;
  }

  .vm-list li {
    font-size: 14.5px;
    line-height: 24px;
  }
}




/* WORKING HOURS BOX */
.working-hours-box {
    padding: 30px;
    border-radius: 12px;
    box-shadow: 0 10px 25px rgba(255, 255, 255, 0.08);

    /* 🔥 REAL CENTER FIX */
    width: 100%;
    max-width: 520px;
    margin: 0 auto;
}

/* TITLE */
.working-hours-box .top h3 {
    text-align: center;
    font-size: 22px;
    font-weight: 700;
    margin-bottom: 25px;
}

/* LIST */
.working-hour-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.working-hour-list li {
    display: flex;
    justify-content: space-between;
    padding: 12px 0;
    border-bottom: 1px dashed #ddd;
    font-size: 15px;
}

.working-hour-list li span {
    color: #555;
}

.working-hour-list li strong {
    color: #222;
    font-weight: 600;
}

.working-hour-list li.closed strong {
    color: #d1162b;
    font-weight: 700;
}

.working-hour-list li:last-child {
    border-bottom: none;
}


/*________________Preloader_______________ */

.preloader {
    position: fixed;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    z-index: 999999999999;
    background-position: center center;
    background-repeat: no-repeat;
    background-image: url(../images/icon/preloader.gif);
}


/* Scroll To Top styles */
.scroll-to-top {
    display: none !important;
    background: #d1162b;
    border: 1px solid #d1162b;
    bottom: 25px;
    color: #ffffff;
    cursor: pointer;
    display: none;
    font-size: 30px;
    font-weight: normal;
    height: 50px;
    line-height: 48px;
    position: fixed;
    right: 15px;
    text-align: center;
    transition: all 500ms ease 0s;
    width: 55px;
    z-index: 99999;
    -webkit-box-shadow: 0px 8px 23px -6px rgba(27, 27, 27, 1);
    -moz-box-shadow: 0px 8px 23px -6px rgba(27, 27, 27, 1);
    box-shadow: 0px 8px 23px -6px rgba(27, 27, 27, 1);
}

.scroll-to-top:hover {
    background: #111111;
    color: #fff;
}


/*Form validation styles */
input:focus,
textarea:focus,
select:focus {
    border-color: #43c3ea;
    outline: none;
}

/* Post pagination styles */
.post-pagination li {
    display: inline-block;
    margin: 0 3px;
}

.post-pagination li a {
    background: #fff none repeat scroll 0 0;
    border: 2px solid #e7e7e7;
    color: #848484;
    display: block;
    font-size: 20px;
    font-weight: 600;
    height: 55px;
    padding: 13px 0;
    transition: all 500ms ease 0s;
    width: 55px;
    font-family: 'Nunito', sans-serif;
    border-radius: 3px;
}

.post-pagination li.active a,
.post-pagination li:hover a {
    background: #d1162b;
    color: #fff;
    border: 2px solid #d1162b;
}

/* Overlay styles  */
.overlay-style-one {
    position: absolute;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    padding: 0px;
    color: #ffffff;
    opacity: 0;
    background: rgba(35, 53, 136, 0.9);
    -webkit-transform: perspective(400px) rotateX(-90deg);
    -moz-transform: perspective(400px) rotateX(-90deg);
    -ms-transform: perspective(400px) rotateX(-90deg);
    -o-transform: perspective(400px) rotateX(-90deg);
    transform: perspective(400px) rotateX(-90deg);
    -webkit-transform-origin: top;
    -moz-transform-origin: top;
    -ms-transform-origin: top;
    -o-transform-origin: top;
    transform-origin: top;
    -webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
    -o-transition: all 0.5s;
    transition: all 0.5s;
}

.overlay-style-one .box {
    display: table;
    height: 100%;
    width: 100%;
}

.overlay-style-one .box .content {
    display: table-cell;
    text-align: center;
    vertical-align: middle;
}

.review-box {}

.review-box ul {
    margin-left: -1px;
    margin-right: -1px;
}

.review-box ul li {
    display: inline-block;
    margin: 0 1px;
}

.review-box ul li i {
    color: #d1162b;
    font-size: 12px;
}

/*** 
=============================================
    Top bar area style
=============================================
***/
.top-bar-area {
    position: relative;
    z-index: 999;
    background: #f9f9f9;
    font-family: 'Lato', sans-serif;
    overflow: hidden;
    padding: 8px 0;
}

.top-contact-info {
    overflow: hidden;
    margin: 6px 0 5px;
}

.top-contact-info li {
    display: inline-block;
    float: left;
    padding-right: 25px;
    color: #b3b3b3;
    line-height: 24px;
    font-size: 16px;
    font-weight: 400;
}

.top-contact-info li:last-child {
    padding: 0;
}

.top-contact-info li span:before {
    font-size: 16px;
    line-height: 24px;
    display: inline-block;
    padding-right: 10px;
}

.top-bar-area .top-right {
    overflow: hidden;
}

.top-bar-area .top-right .social-links {
    overflow: hidden;
    padding-right: 30px;
    margin: 9px 0;
}

.top-bar-area .top-right .social-links li {
    display: inline-block;
    float: left;
    margin-right: 20px;
    line-height: 16px;
}

.top-bar-area .top-right .social-links li:last-child {
    margin: 0px;
}

.top-bar-area .top-right .social-links li a i {
    color: #afafb5;
    font-size: 15px;
    transition: all 500ms ease;
}

.top-bar-area .top-right .social-links li a:hover i {
    color: #d1162b;
}

.appoinment-button {
    margin: 0px;
}

.appoinment-button a {
    background: #d1162b;
    display: inline-block;
    font-family: 'Nunito', sans-serif;
    font-size: 16px;
    font-weight: 600;
    color: #ffffff;
    padding: 7px 15px 6px;
    line-height: initial;
    border-radius: 3px;
}

.appoinment-button a:hover {
    background: #162670;
}

/*** 
=============================================
    Rev Slider Wrapper style
=============================================
***/
.rev_slider_wrapper {
    width: 100%;
    position: relative;
    overflow: hidden;
}

.rev_slider {
    display: block !important;
}

.rev_slider_wrapper .slide-content-box h1 {
    text-align: center;
    color: #ffffff;
    font-size: 70px;
    font-weight: 400;
    line-height: 80px;
    text-transform: none;
    font-family: 'Lato', sans-serif;
    margin: 0 0 17px;
}

.rev_slider_wrapper .slide-content-box h1 span {
    color: #f8ec30;
}

.rev_slider_wrapper .slide-content-box h2 {
    text-align: center;
    color: #ffffff;
    font-size: 24px;
    font-weight: 300;
    line-height: 36px;
    text-transform: none;
    font-family: 'Lato', sans-serif;
    margin: 0 0 45px;
}

.rev_slider_wrapper .slide-content-box h3 {
    color: #e3d828;
    font-size: 18px;
    font-weight: 400;
    line-height: 24px;
    margin: 42px 0 0;
    font-family: 'Lato', sans-serif;
}

.rev_slider_wrapper .slide-content-box h3 i {
    display: inline-block;
    padding-right: 7px;
}

.rev_slider_wrapper .slide-content-box .button a {
    border: 2px solid #d1162b;
    background: #d1162b;
    padding: 15px 50px 14px;
    color: #ffffff;
    font-size: 16px;
    font-weight: 700;
    text-transform: uppercase;
    font-family: 'Nunito', sans-serif;
    border-radius: 30px;
}

.rev_slider_wrapper .slide-content-box .button a:hover {
    background: #f8ec30;
    border-color: #fff;
    color: #252525;
}

.tparrows {
    background: rgba(0, 0, 0, 0.08);
    cursor: pointer;
    display: block;
    height: 50px;
    position: absolute;
    width: 50px;
    z-index: 1000;
    transition: all 500ms ease;
    border-radius: 50%;
}

.tparrows:before {
    font-size: 18px;
    font-weight: 700;
    color: #fff;
    display: block;
    line-height: 50px;
    text-align: center;
    transition: all 500ms ease;
}

.tparrows:hover {
    background: #d1162b;
}

.tparrows:hover:before {
    color: #fff;
}

.rev_slider_wrapper .slotholder:before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 9;
}

/*** 
=============================================
    Callto Action Area style
=============================================
***/
.welcome-area {}

/* TEXT HOLDER */
.text-holder{
  padding: 0;
  margin: 0;
  text-align: left;
}

/* MAIN HEADING */
.welcome-title{
  margin: 0 0 18px 0;
  padding: 0;
  font-size: 46px;
  font-weight: 800;
  line-height: 1.15;
  color: #ffffff;
  max-width: 100%;
}

/* COLOR SPANS (no spacing change) */
.brand-red{
  color: #d1162b;
}
.brand-white{
  color: #ffffff;
}

/* PARAGRAPHS */
.welcome-text{
  margin: 0 0 14px 0;
  padding: 0;
  font-size: 16px;
  line-height: 30px;
  color: rgba(255,255,255,0.85);
  max-width: 100%;
}

/* REMOVE ANY DEFAULT BOOTSTRAP SHIFT */
.text-holder *{
  margin-left: 0 !important;
  padding-left: 0 !important;
  text-indent: 0 !important;
}

.welcome-area .text-holder {
    position: relative;
    overflow: hidden;
    margin-top: 60px;
    margin-left: 10px;
    margin-right: 10px;
}

.welcome-area .text-holder .text-box {
    margin-top: -7px;
}

.welcome-area .text-holder .text-box .name-signature {
    overflow: hidden;
    margin-top: 30px;
}

.welcome-area .text-holder .text-box .name-signature .name {
    display: inline-block;
    float: left;
    margin-right: 30px;
}

.welcome-area .text-holder .text-box .name-signature .name h3 {
    color: #222222;
    font-size: 18px;
    font-weight: 700;
    margin: 0 0 5px;
}

.welcome-area .text-holder .text-box .name-signature .name h3 span {
    color: #848484;
    font-style: italic;
    font-weight: 400;
}

.welcome-area .text-holder .text-box .name-signature .name p {
    margin: 0;
    color: #d1162b;
    font-style: italic;
}

.welcome-area .text-holder .text-box .name-signature .signature {
    float: left;
}

.welcome-area .img-holder {
    position: relative;
    overflow: hidden;
    display: block;
    margin-left: 10px;
    margin-right: 5px;
    margin-top: 0px;
    margin-bottom: 70px;
    
}

.welcome-area .img-holder {
    max-height: 450px;        /* 🔽 reduce overall image area */
    overflow: hidden;        /* hide extra image part */
}

.welcome-area .img-holder img {
    width: 800px;
    height: 450px;           /* 🔽 control image height */
    object-fit: cover;       /* keeps image clean & professional */
}


.welcome-area .inner-content {
    position: absolute;
    bottom: 10px;
    left: 10px;
    right: 10px;
    background: #d1162b;
    display: block;
    padding: 17px 0 17px;
}

.welcome-area .inner-content h3 {
    color: #ffffff;
    font-size: 24px;
    font-weight: 400;
    font-style: italic;
    font-family: 'Open Sans', sans-serif;
}

/*** 
=============================================
    Service Area style
=============================================
***/
.features-area {
    background: #d1162b;
    display: block;
    position: relative;
}

.features-area .single-features-item {
    text-align: center;
    color: #fff;
    padding: 100px 0;
    position: relative;
    transition: all 0.5s ease;
}

.features-area .single-features-item .overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-size: cover;
    transition: all 0.5s ease;
    opacity: 0;
    overflow-y: hidden;
}

.features-area .single-features-item .overlay:before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    background: rgba(9, 29, 49, 0.0);
    opacity: 1;
    transition: all 0.5s ease;
}

.features-area .single-features-item .overlay .box {
    display: table;
    width: 100%;
    height: 100%;
}

.features-area .single-features-item .overlay .box .box-content {
    display: table-cell;
    vertical-align: bottom;
    text-align: center;
}

.features-area .single-features-item .overlay .box .box-content a {
    text-transform: uppercase;
    background: transparent;
    font-weight: 500;
    font-size: 14px;
    line-height: 45px;
    display: inline-block;
    padding: 0 55px;
    position: relative;
    top: 0px;
    transform: translate3d(0, 45px, 0);
    transition: all 0.5s ease;
    color: #fff;
    border: 1px solid #fff;
    border-radius: 30px;
    font-family: 'Nunito', sans-serif;
}

.features-area .single-features-item .overlay .box .box-content a:hover {
    background: #d1162b;
}

.features-area .single-features-item .iocn-box {
    width: 100px;
    text-align: center;
    position: relative;
    margin-left: auto;
    margin-right: auto;
    height: 100px;
    line-height: 100px;
    margin-bottom: 30px;
    transform: translate3d(0, 0, 0);
    transition: all 0.5s ease;
}

.features-area .single-features-item .iocn-box:before {
    content: "\f100";
    font-family: Flaticon;
    font-size: 100px;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}

.features-area .single-features-item .iocn-box span:before {
    font-size: 40px;
    line-height: 100px;
    display: block;
    vertical-align: bottom;
}

.features-area .single-features-item .text-box {
    margin: 0;
    position: relative;
    transform: translate3d(0, 0, 0);
    transition: all 0.5s ease;
}

.features-area .single-features-item .text-box h3 {
    color: #ffffff;
    font-size: 24px;
    font-weight: 700;
    margin: 0 0 15px;
}

.features-area .single-features-item .text-box p {
    color: #c5cdf3;
    font-size: 16px;
    font-weight: 300;
    margin: 0;
    line-height: 26px;
}

.features-area .single-features-item:hover .iocn-box {
    transform: translate3d(0, -40px, 0);
}

.features-area .single-features-item:hover .text-box {
    transform: translate3d(0, -40px, 0);
    transition: all 0.5s ease;
}

.features-area .single-features-item:hover .overlay {
    opacity: 1;
}

.features-area .single-features-item:hover .overlay .box .box-content a {
    transform: translate3d(0, -70px, 0);
}

/*** 
=============================================
    Service Area style
=============================================
***/
.service-area {
    padding-top: 80px;
    padding-bottom: 80px;
    background: #ffffff;
    position: relative;
    overflow: hidden;
}

.service-area .sec-title {
    padding-bottom: 60px;
}

.single-service-item {
    position: relative;
    overflow: hidden;
    display: block;
}

.single-service-item .icon-holder {
    margin: 0 0 26px;
}

.single-service-item .icon-holder span:before {
    color: #303443;
    font-size: 50px;
    line-height: 50px;
}

.single-service-item .text-holder {}

.single-service-item .text-holder h3 {
    color: #343434;
    font-size: 20px;
    font-weight: 700;
    text-transform: capitalize;
    margin: 0 0 14px;
}

.single-service-item .text-holder h3:hover {
    color: #d1162b;
}

.single-service-item .text-holder p {
    margin: 0;
}

.service-area .hr-line {
    height: 1px;
    width: 100%;
    display: block;
    background: #f6f6f6;
    margin-top: 33px;
    margin-bottom: 40px;
}

/*** 
=============================================
    Project Area style
=============================================
***/
.project-area {
    position: relative;
    overflow: hidden;
    display: block;
}

.project-area .mar0 {
    margin: 0;
}

.single-project-item.span-20per {
    width: 20%;
    float: left;
}

/*** 
=============================================
    slogan Area style
=============================================
***/
.slogan-area {
    padding: 30px 0;
    background: #d1162b;
    position: relative;
    overflow: hidden;
}

.slogan-area h1 {
    color: #ffffff;
    font-size: 24px;
    font-weight: 400;
    font-style: italic;
    line-height: 32px;
    font-family: 'Open Sans', sans-serif;
    margin: 9px 0;
}

.slogan-area p {
    color: #ffffff;
    font-size: 14px;
    margin: 0;
}

.slogan-area a {
    width: 230px;
    border: 1px solid #ffffff;
}

.product-category-slider {
  
  padding: 70px 0;
  overflow: hidden;
}

.product-category-slider .container {
  max-width: 1200px;
  margin: auto;
  padding: 0 20px;
}

.section-title {
  text-align: center;
  color: #fff;
  font-size: 32px;
  font-weight: 800;
  margin-bottom: 50px;
}

/* Slider wrapper */
.category-slider {
  overflow: hidden;
  width: 100%;
}

/* Track */
.category-track {
  display: flex;
  gap: 60px;
  width: max-content;
  animation: slideCategories 35s linear infinite;
}

/* Pause on hover */
.category-slider:hover .category-track {
  animation-play-state: paused;
}

/* Category card */
.category-item {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 18px 24px;
  border-radius: 14px;
  background: rgba(255,255,255,0.05);
  border: 1px solid rgba(255,255,255,0.12);
  transition: all 0.3s ease;
}

/* Hover */
.category-item:hover {
  transform: translateY(-4px);
  border-color: #ff2a2a;
  box-shadow: 0 12px 25px rgba(255,42,42,0.25);
}

/* SVG icon */
.category-item svg {
  width: 36px;
  height: 36px;
  fill: #ff2a2a;
  flex-shrink: 0;
}

/* Text */
.category-item span {
  color: #fff;
  font-size: 14px;
  font-weight: 600;
  white-space: nowrap;
}

/* Animation */
@keyframes slideCategories {
  from {
    transform: translateX(0);
  }
  to {
    transform: translateX(-50%);
  }
}

/* Mobile */
@media (max-width: 768px) {
  .category-track {
    gap: 40px;
    animation-duration: 26s;
  }

  .category-item {
    padding: 14px 18px;
  }

  .category-item svg {
    width: 30px;
    height: 30px;
  }
}

/* OUR CLIENTS SECTION */
.our-clients{
  background:#f8f9fc;
  padding:40px 0;
  overflow:hidden;
}

.clients-title{
  text-align:center;
  font-size:30px;
  font-weight:700;
  margin:0 0 80px; /* a bit more balanced */
  color:#ffffff;
}
.clients-slider{
  width: 100%;
  overflow: hidden;
  position: relative;
}

.clients-track{
  display: flex;
  align-items: center;
  gap: 12px;
  width: max-content;
  animation: scrollClients 25s linear infinite;
}

.client-logo{
  flex: 0 0 auto;
  width: 180px;
  height: 90px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.client-logo img{
  max-width: 160px;
  max-height: 70px;
  object-fit: contain;
  display: block;
}

/* animation */
@keyframes scrollClients{
  from { transform: translateX(0); }
  to   { transform: translateX(-50%); }
}

/* Mobile */
@media (max-width:768px){
  .clients-track{
    animation-duration: 18s;
  }

  .client-logo{
    width: 140px;
    height: 70px;
  }

  .client-logo img{
    max-width: 120px;
    max-height: 50px;
  }
}
.google-reviews-footer {
  margin-top: 15px;
}

.google-map-review-btn {
  display: flex;
  align-items: center;
  gap: 10px;
  background: #ffffff;
  padding: 10px 14px;
  border-radius: 6px;
  text-decoration: none;
  color: #000;
  font-size: 14px;
  font-weight: 600;
}

.google-map-review-btn img {
  height: 18px;
}

.google-map-review-btn small {
  display: block;
  font-size: 12px;
  color: #fbbc05;
}
.google-map-review-btn img.google-icon {
  width: 24px !important;
  height: auto !important;
  max-width: 24px !important;
  display: inline-block;
}

/* SECTION */
.testimonials {
    
    padding: 90px 0;
}

/* TITLE */
.section-title {
    text-align: center;
    color: #fff;
    font-size: 40px;
    font-weight: 700;
    margin-bottom: 60px;
    font-family: 'Open Sans', sans-serif;
}

/* SLIDER */
.testimonial-slider {
    overflow: hidden;
}

/* TRACK */
.testimonial-track {
    display: flex;
    gap: 30px;
    align-items: stretch; /* SAME HEIGHT */
}
.testimonial-card {
    position: relative;
    padding: 34px 32px 34px 56px; /* ⬅ extra left padding */
}


/* CARD */
.testimonial-card {
    flex: 0 0 calc((100% - 60px) / 3);
    background: #fff;
    border-radius: 18px;
    display: flex;
    flex-direction: column;
    box-shadow: 0 18px 40px rgba(0, 0, 0, 0.12);
    transition: transform 0.3s ease, box-shadow 0.3s ease;

    min-height: 320px; /* 🔒 LOCK CARD HEIGHT */
}

/* HOVER EFFECT */
.testimonial-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 26px 55px rgba(0, 0, 0, 0.18);
}
.testimonial-card::before {
    content: "“";
    position: absolute;
    top: 28px;
    left: 24px; /* ⬅ fixed position */
    font-size: 46px;
    color: #d1162b;
    font-weight: 700;
    line-height: 1;
}

.testimonial-content,
.testimonial-footer h4,
.testimonial-footer span {
    margin-left: 0;
    padding-left: 0;
    text-align: left;
}

/* TEXT */
.testimonial-content {
    color: #000;
    font-size: 16px;
    line-height: 1.75;
    font-weight: 600;

    /* ✅ FIX WORD GAP ISSUE */
    text-align:justify;          /* ❌ remove justify */
    hyphens: none;

    margin-bottom: 28px;
}

/* FOOTER — ALWAYS AT SAME POSITION */
.testimonial-footer {
    margin-top: auto;          /* 🔥 KEY FIX */
    border-top: 1px solid #eee;
    padding-top: 10px;
}

/* NAME */
.testimonial-footer h4 {
    font-size: 16px;
    font-weight: 700;
    color: #000;
    margin-bottom: px;
}

/* DESIGNATION */
.testimonial-footer span {
    font-size: 14px;
    color: #555;
}



/* Responsive */
@media (max-width: 991px) {
    .testimonial-card {
        flex: 0 0 100%;
    }
}
@media (max-width: 1199px) and (min-width: 768px) {

    .testimonial-slider {
        overflow-x: auto;
        scroll-snap-type: x mandatory;
        padding: 0 12px;
    }

    .testimonial-track {
        gap: 20px;
    }

    .testimonial-card {
        flex: 0 0 calc((100% - 20px) / 2); /* ✅ 2 CARDS */
        scroll-snap-align: start;
    }

    /* Hide scrollbar */
    .testimonial-slider::-webkit-scrollbar {
        display: none;
    }
}


/*** 
=============================================
    Appoinment Area style
=============================================
***/
.appoinment-area {
    position: relative;
    background: #303443;
}

.appoinment-area .row {
    justify-content: center;
}

.appoinment-area .container {
    position: relative;
}

.appoinment-area .appoinment {
    padding: 80px 0;
}

.appoinment-area .appoinment-form {
    max-width: 900px;
    margin: 0 auto;
}

.appoinment-area .sec-title {
    text-align: center;
}

.appoinment-area .appoinment .sec-title h1 {
    color: #ffffff;
}

.appoinment-area .appoinment .sec-title .border:before {
    background: #ffffff;
}

.appoinment-area .appoinment .sec-title .border:after {
    background: #ffffff;
}

.appoinment-area .appoinment .appoinment-form {
    display: block;
}

.appoinment-area .appoinment .appoinment-form .input-label label {
    color: #ffffff;
    font-size: 16px;
    font-weight: 400;
    margin: 0 30px 3px;

}

.appoinment-area .appoinment .appoinment-form .input-box {
    position: relative;
    margin-bottom: 24px;
    margin-left: 30px;
}

.appoinment-area .appoinment .appoinment-form .input-box .icon-box {
    position: absolute;
    right: 10px;
    left: 10px;
    top: 11px;
}

.appoinment-area .appoinment .appoinment-form .input-box .icon-box i {
    color: #ffffff;
    font-size: 14px;
}

.appoinment-area .appoinment .appoinment-form .input-box input[type=text],
.appoinment-area .appoinment .appoinment-form .input-box input[type=email] {

    width: 90%;
    /* reduced width */
    margin: 0 auto;
    /* center */
    display: block;
    border: 1px solid #ffffff;
    height: 50px;
    padding: 0 15px;
    color: #ffffff;
    font-size: 15px;
    font-weight: 400;
    transition: all 500ms ease;
    font-family: 'Nunito', sans-serif;
}

.appoinment-area .appoinment .appoinment-form .input-box input[type=text]:focus {
    border-color: #d1162b;
}

.appoinment-area .appoinment .appoinment-form .input-box input[type=email]:focus {
    border-color: #d1162b;
}

.appoinment-area .appoinment .appoinment-form button {
    border: 1px solid #ffffff;
    color: #ffffff;
    padding: 12px 30px 10px;
    width: 100%;  
}

.appoinment-area .appoinment .appoinment-form button:hover {
    background: #d1162b;
    border-color: #d1162b;
}

.appoinment-area .appoinment .appoinment-form .text p {
    color: #ffffff;
    font-size: 16px;
    font-weight: 300;
    line-height: 28px;
    margin: 11px 0;
}
/* ===============================
   MOBILE FORM WIDTH FIX
================================ */
@media (max-width: 768px) {

    .appoinment-area .row {
        margin-left: 0;
        margin-right: 0;
    }

    .appoinment-area [class*="col-"] {
        width: 100% !important;
        max-width: 100% !important;
        flex: 0 0 100% !important;
    }

    .appoinment-area .input-box input,
    .appoinment-area .input-box select,
    .appoinment-area .input-box textarea {
        width: 100% !important;
        box-sizing: border-box;
    }
}

/*** 
=============================================
    Latest blog area style
=============================================
***/
.latest-blog-area {
    position: relative;
    overflow: hidden;
    padding-bottom: 50px;
}

.single-blog-item {
    position: relative;
    overflow: hidden;
    display: block;
    border: 1px solid #f4f4f4;
    padding: 24px;
    margin-bottom: 30px;
}

.single-blog-item .img-holder {
    overflow: hidden;
    position: relative;
}

.single-blog-item .img-holder img {
    transform: scale(1.1, 1.1);
    transition: all 0.5s ease 0s;
    width: 100%;
}

.single-blog-item:hover .img-holder .overlay-style-one {
    opacity: 1;
    -webkit-transform: perspective(400px) rotateX(0deg);
    -moz-transform: perspective(400px) rotateX(0deg);
    -ms-transform: perspective(400px) rotateX(0deg);
    -o-transform: perspective(400px) rotateX(0deg);
    transform: perspective(400px) rotateX(0deg);
}

.single-blog-item .img-holder .overlay-style-one .content a i {
    transition: all 500ms ease;
    font-size: 20px;
}

.single-blog-item .img-holder .overlay-style-one .content a:hover i {
    color: #b6b6b6;
}

.single-blog-item:hover .img-holder img {
    transform: scale(1, 1);
}

.single-blog-item .text-holder {
    background: #ffffff;
    margin-top: 20px;
}

.single-blog-item .text-holder .blog-title {
    color: #222222;
    font-size: 20px;
    font-weight: 700;
    line-height: 26px;
    display: block;
    transition: all 500ms ease;
}

.single-blog-item .text-holder .blog-title:hover {
    color: #d1162b;
}

.single-blog-item .text-holder .text {
    margin-top: 12px;
}

.single-blog-item .text-holder .text p {
    margin: 0;
}

.single-blog-item .text-holder .meta-info {
    overflow: hidden;
    padding-top: 22px;
    text-align: center;
    border-top: 1px solid #f4f4f4;
    margin-top: 18px;
}

.single-blog-item .text-holder .meta-info li {
    display: inline-block;
    float: left;
    line-height: 24px;
    margin-right: 20px;
}

.single-blog-item .text-holder .meta-info li:last-child {
    margin-right: 0;
}

.single-blog-item .text-holder .meta-info li a {
    color: #848484;
    font-size: 16px;
    font-weight: 300;
    font-style: italic;
}

.single-blog-item .text-holder .meta-info li a i {
    display: inline-block;
    padding-right: 4px;
    font-size: 15px;
}

.single-blog-item .text-holder .meta-info li a:hover {
    color: #d1162b;
}

/*** 
=======================================================
    Model area style
=======================================================
***/
.model-area {
    background: #f9f9f9;
    padding-top: 80px;
    padding-bottom: 40px;
}

.model-area .single-model-item {
    padding-bottom: 40px;
}

/* =========================
   FAQ AREA
========================= */
.faq-area {
    padding: 80px 0;
    background: #f8f9fc;
}

/* FAQ title color fix */
.faq-area .sec-title h1 {
    color: #ffffff !important;
    margin-bottom: 50px;
}

/* Optional: border color under title */

.faq-wrapper {
    max-width: 900px;
    margin: 0 auto;
}

.faq-item {
    background: #ffffff;
    padding: 25px 25px;
    border-radius: 12px;
    margin-bottom: 20px;
    border-left: 5px solid #d1162b;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.08);
}

.faq-item h3 {
    font-size: 18px;
    font-weight: 700;
    color: #000000;
    margin-bottom: 10px;
}

.faq-item p {
    font-size: 15px;
    line-height: 26px;
    color: #333333;
    margin: 0;
}

/* Mobile friendly */
@media (max-width: 768px) {
    .faq-item {
        padding: 20px;
    }

    .faq-item h3 {
        font-size: 16px;
    }
}

/*** 
=============================================
    Footer area style
=============================================
***/
.footer-area {
    position: relative;
    padding-top: 50px;     /* reduced by 5px */
    padding-bottom: 10px;  /* reduce footer height slightly */
    z-index: 1;
    text-align: left;      /* left align all footer content */

    /* Gradient like Welcome section */
    background: linear-gradient(135deg,
            #4b1f2a 0%,
            /* maroon */
            #1f2a38 50%,
            /* dark blue */
            #1b3a45 100%
            /* teal-dark */
        );
}

.single-footer-widget {
    position: relative;
    overflow: hidden;
}

.single-footer-widget .title {
   
    margin-top: -3px;
}

.single-footer-widget .title h3 {
    color: #ffffff;
    font-size: 20px;
    font-weight: 700;
    text-transform: capitalize;
    margin: 0 0 16px;
}

.single-footer-widget .footer-logo a {
    display: inline-block;

}

.single-footer-widget .our-info {
    overflow: hidden;
}

.single-footer-widget .our-info p {
    color: #c1c2c7;
    font-size: 16px;
    margin: 0;
}

.single-footer-widget .our-info a {
    border: 1px solid #ffffff;
    width: 230px;
    margin: 33px 0 0;
    overflow: hidden;
}

.single-footer-widget .latest-blog {
    margin-top: -11px;
}

.single-footer-widget .latest-blog li {
    border-bottom: 1px solid #363b4b;
    padding-bottom: 22px;
    margin-bottom: 24px;
}

.single-footer-widget .latest-blog li:last-child {
    border-bottom: none;
    padding-bottom: 0;
    margin-bottom: 0;
}

.single-footer-widget .latest-blog li .text-holder a {
    color: #c1c2c7;
    font-size: 16px;
}

.single-footer-widget .latest-blog li .text-holder a:hover {
    color: #ffffff;
}

.single-footer-widget .latest-blog li .text-holder span {
    color: #ffffff;
    font-size: 14px;
    font-style: italic;
    display: block;
    margin: 7px 0 0;
}

.single-footer-widget .latest-blog li .text-holder span i {
    display: inline-block;
    padding-right: 8px;
}

.single-footer-widget .footer-contact-info {
    overflow: hidden;
    display: block;
    position: relative;
    margin: -11px 0 25px;
    z-index: 1;
}

.single-footer-widget .footer-contact-info:before {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: url(../images/footer/map.png);
    content: "";
    z-index: -5;
}

.single-footer-widget .footer-contact-info li {
    padding-left: 30px;
    position: relative;
    margin-bottom: 16px;
}

.single-footer-widget .footer-contact-info li:last-child {
    margin-bottom: 0;
}

.single-footer-widget .footer-contact-info li .icon-holder {
    position: absolute;
    top: 1px;
    left: 0;
}

.single-footer-widget .footer-contact-info li .icon-holder span:before {
    color: #c1c2c7;
    font-size: 16px;
    line-height: 16px;
}

.single-footer-widget .footer-contact-info li .icon-holder span.flaticon-arrows:before {
    position: relative;
    top: 5px;
}

.single-footer-widget .footer-contact-info li .text-holder {}

.single-footer-widget .footer-contact-info li .text-holder h5 {
    color: #c1c2c7;
    font-size: 16px;
    font-weight: 300;
    line-height: 26px;
    font-family: 'Open Sans', sans-serif;
}

.single-footer-widget .map a {
    color: #ffffff;
    font-size: 14px;
    font-weight: 400;
    text-decoration: underline;
    transition: all 500ms ease;
}

.single-footer-widget .map a:hover {
    color: #dddddd;
}
/* Align Quick Links column with other footer columns */
.footer-area .single-footer-widget:has(.working-hours) {
    margin-left: 54px;
    margin-right: 0;
}

/* Left align footer columns */
.footer-area .single-footer-widget .title {
    text-align: left;
}

.footer-area .single-footer-widget .working-hours {
    text-align: left;
    margin: 0;
    padding-left: 0;
}

.footer-area .single-footer-widget .working-hours li {
    text-align: left;
    line-height: 40px;
}

.footer-area .single-footer-widget .working-hours li a {
    color: #c1c2c7;
}

.footer-area .single-footer-widget .working-hours li a:hover,
.footer-area .single-footer-widget .working-hours li a:focus {
    color: #c1c2c7;
}
.single-footer-widget .working-hours li:last-child {}

.single-footer-widget .working-hours li span {
    float: right;
}

.single-footer-widget .working-hours li span.closed {
    color: #ffffff;
    font-size: 15px;
    font-weight: 400;
}

.footer-logos {
    display: flex;
    align-items: center;
    /* vertical alignment */
    gap: 16px;
    margin-bottom: 16px;
}

.footer-logo-item {
    width: 160px;
    /* BIG width */
    height: 80px;
    /* SAME HEIGHT */
    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 4px;
    padding: 4px;
}

.footer-logo-item img {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
}

/* SEO Keywords Section Styling */
.single-footer-widget .seo-keywords {
    color: #c1c2c7;
    font-size: 14px;
    margin-top: 50px;
}
.single-footer-widget .seo-keywords p {
    color: #c1c2c7;
    font-size: 14px;
    margin-top: 30px;
    text-align: justify;
}

/* SEO Keywords Section */
.seo-keywords ul {
    list-style-type: disc; /* Adds bullet points */
    padding-left: 20px; /* Adds left padding for spacing */
    color: #c1c2c7; /* Set text color to white */
    font-size: 16px; /* Set font size */
    font-weight: 200;
    text-align: justify;
/* Set font weight */
}

.seo-keywords li {
    margin-bottom: 10px; /* Adds space between list items */
}


/* Add Google Map Icon */
.single-footer-widget .google-reviews-footer {
    display: flex;
    align-items: center;
    gap: 2px;
    margin-top: 15px;
}
/* ===============================
   MOBILE FOOTER SPACING FIX
=============================== */
@media (max-width: 767px) {

  /* Reduce gap above SEO keywords */
  .single-footer-widget .seo-keywords {
    margin-top: 10px !important;
  }

  .single-footer-widget .seo-keywords p {
    margin-top: 20px !important;
  }

  .seo-keywords ul {
    margin-top: 20px !important;
  }
  

  /* Reduce gap below "View Our Store on Google" */
  .single-footer-widget .google-reviews-footer {
    margin-bottom: 1px;
  }
}



/* 
=============================================
    Footer Bottom area style
============================================= */
.footer-bottom-area {
    /* Gradient like Welcome section */
    background: linear-gradient(135deg,
            #4b1f2a 0%,
            /* maroon */
            #1f2a38 50%,
            /* dark blue */
            #1b3a45 100%
            /* teal-dark */
        );
    padding: 15px 0;
    border-top: 1px solid #e5e5e5;
    font-size: 14px;
}

.footer-bottom-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;
}

.copyright-text {
    text-align: center;
    width: 100%;
}

.copyright-text strong {
    color: #ffffff;
}

.copyright-text .designer {
    margin-left: 6px;
}

.copyright-text a {
    color: #d1162b;
    text-decoration: none;
    font-weight: 500;
}

.copyright-text a:hover {
    text-decoration: underline;
}

/* Social icons */
.footer-social-links {
    list-style: none;
    display: flex;
    gap: 12px;
    margin: 0;
    padding: 0;
}

.footer-social-links li a {
    width: 36px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #f4f4f4;
    color: #555;
    border-radius: 50%;
    transition: all 0.3s ease;
}

.footer-social-links li a:hover {
    background: #d1162b;
    color: #fff;
}

/* Mobile responsive */
@media (max-width: 768px) {
    .footer-bottom-inner {
        flex-direction: column;
        text-align: center;
    }
}

/***=============================================Top bar area style two style=============================================***/ 
.top-bar-area.style-two {
    background: transparent;
    padding: 30px 0 10px;
}

.top-bar-area.style-two .top-contact-info li {
    color: #ffffff;
}

.top-bar-area.style-two .top-contact-info li span:before {
    color: #d1162b;
}

.top-bar-area.style-two .top-right .social-links li a i {
    color: #ffffff;
}

.top-bar-area.style-two .top-right .social-links li a:hover i {
    color: #d1162b;
}


/*** 
=============================================
    Rev slider wrapper style two style
=============================================
***/
.rev_slider_wrapper.style-two {
    margin-top: -175px;
}

.rev_slider_wrapper.style-two .slide-content-box h1 {
    text-align: left;
    color: #ffffff;
    font-size: 70px;
    font-weight: 400;
    line-height: 80px;
    text-transform: none;
    font-family: 'Lato', sans-serif;
    margin: 0 0 17px;
}

.rev_slider_wrapper.style-two .slide-content-box h1 span {
    color: #f8ec30;
}

.rev_slider_wrapper.style-two .slide-content-box h2 {
    text-align: left;
    color: #ffffff;
    font-size: 24px;
    font-weight: 300;
    line-height: 36px;
    text-transform: none;
    font-family: 'Lato', sans-serif;
    margin: 0 0 45px;
}

.rev_slider_wrapper.style-two .slide-content-box h3 {
    color: #e3d828;
    font-size: 18px;
    font-weight: 400;
    line-height: 24px;
    margin: 42px 0 0;
    font-family: 'Lato', sans-serif;
}

.rev_slider_wrapper.style-two .slide-content-box h3 i {
    display: inline-block;
    padding-right: 7px;
}

.rev_slider_wrapper.style-two .slide-content-box .button a {
    border: 2px solid #d1162b;
    background: #d1162b;
    padding: 15px 50px 14px;
    color: #ffffff;
    font-size: 16px;
    font-weight: 700;
    text-transform: uppercase;
    font-family: 'Nunito', sans-serif;
    border-radius: 30px;
}

.rev_slider_wrapper.style-two .slide-content-box .button a:hover {
    background: #f8ec30;
    border-color: #fff;
    color: #252525;
}

.rev_slider_wrapper.style-two .tparrows {
    background: #3d3f3c;
    cursor: pointer;
    display: block;
    height: 70px;
    position: absolute;
    width: 70px;
    z-index: 1000;
    transition: all 500ms ease;
    border-radius: 0;
}

.rev_slider_wrapper.style-two .tparrows:before {
    font-size: 18px;
    font-weight: 700;
    color: #fff;
    display: block;
    line-height: 70px;
    text-align: center;
    transition: all 500ms ease;
}

.rev_slider_wrapper.style-two .tparrows:hover {
    background: #d1162b;
}

.rev_slider_wrapper.style-two .tparrows:hover:before {
    color: #fff;
}

.rev_slider_wrapper.style-two .slotholder:before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(34, 36, 38, 0.40);
    z-index: 9;
}

/*** 
=============================================
    Reapir Service Area style
=============================================
***/
.reapir-service-area {
    padding-top: 80px;
    padding-bottom: 20px;
}

.reapir-service-area .container.bottom {
    border-top: 1px solid #f4f4f4;
    margin-top: 20px;
    padding-top: 70px;
}

.reapir-service-area .single-item {
    display: block;
    margin-bottom: 40px;
    overflow: hidden;
}

.reapir-service-area .single-item .img-holder {
    position: relative;
    overflow: hidden;
}

.reapir-service-area .single-item .img-holder img {
    width: 100%;
}

.reapir-service-area .single-item .img-holder .title {
    position: absolute;
    bottom: 10px;
    left: 10px;
    right: 10px;
    height: auto;
    background: #ffffff;
    padding: 20px 0;
    text-align: center;
}

.reapir-service-area .single-item .img-holder .title h3 {}

.reapir-service-area .single-item .img-holder .icon-box {
    position: absolute;
    top: -17px;
    right: -50px;
    background: #303443;
    display: block;
    width: 165px;
    height: 70px;
    transform: rotate(45deg);
}

.reapir-service-area .single-item .img-holder .icon-box span:before {
    color: #ffffff;
    font-size: 25px;
    line-height: 25px;
    display: block;
    text-align: center;
    transform: rotate(-45deg);
    padding-top: 40px;
    padding-bottom: 45px;
    padding-left: 70px;
    padding-right: 30px;
}

.reapir-service-area .single-thumb {
    position: relative;
    overflow: hidden;
    display: block;
    padding-left: 110px;
    padding-bottom: 60px;
}

.reapir-service-area .single-thumb .img-holder {
    position: absolute;
    top: 0;
    left: 0;
}

.reapir-service-area .single-thumb .img-holder .overlay-style-one .content a span:before {
    color: #ffffff;
    font-size: 30px;
    line-height: 30px;
}

.reapir-service-area .single-thumb .text-holder {
    padding-left: 30px;
}

.reapir-service-area .single-thumb .text-holder a h3 {
    margin: -3px 0 3px;
}

.reapir-service-area .single-thumb .text-holder a h3:hover {
    color: #d1162b;
}

.reapir-service-area .single-thumb .text-holder p {
    margin: 0;
}

.reapir-service-area .single-thumb:hover .img-holder .overlay-style-one {
    opacity: 1;
    -webkit-transform: perspective(400px) rotateX(0deg);
    -moz-transform: perspective(400px) rotateX(0deg);
    -ms-transform: perspective(400px) rotateX(0deg);
    -o-transform: perspective(400px) rotateX(0deg);
    transform: perspective(400px) rotateX(0deg);
}

/*** 
=============================================
    Fact counter Area style
=============================================
***/
.fact-counter-area {
    background-attachment: scroll;
    background-position: center top;
    background-repeat: no-repeat;
    background-size: cover;
    padding-bottom: 40px;
    padding-top: 72px;
    position: relative;
    z-index: 1;
}

.fact-counter-area::before {
    background: rgba(35, 53, 136, 0.85);
    content: "";
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: -1;
}

.fact-counter-area .title h1 {
    color: #ffffff;
    font-size: 48px;
    font-weight: 700;
    line-height: 52px;
    margin: 0 0 60px;
}

.fact-counter-area .single-item {
    width: 100%;
    display: block;
    margin-bottom: 30px;
    transition: all 500ms ease;
    position: relative;
    padding-left: 90px;
}

.fact-counter-area .single-item:hover {}

.fact-counter-area .single-item .icon-holder {
    position: absolute;
    top: 0;
    left: 0;
}

.fact-counter-area .single-item .icon-holder span:before {
    color: #f8ec30;
    font-size: 60px;
    line-height: 95px;
}

.fact-counter-area .single-item h1 span {
    color: #ffffff;
    font-size: 60px;
    font-weight: 400;
}

.fact-counter-area .single-item h3 {
    color: #c1c2c7;
    font-size: 18px;
    line-height: 26px;
    font-weight: 300;
    text-transform: capitalize;
    font-family: 'Open Sans', sans-serif;
    margin: 1px 0 0;
}

/*** 
=============================================
    Faq team area style
=============================================
***/
.faq-team-area {
    padding-top: 80px;
    padding-bottom: 80px;
}

.accordion-box {
    display: block;
}

.accordion-box .accordion {
    margin-bottom: 20px;
    display: block;
    border-radius: 30px;
    position: relative;
}

.accordion-box .accordion.last {
    margin-bottom: 0;
}

.accordion-box .accordion .accord-btn {
    border: 1px solid #f4f4f4;
    cursor: pointer;
    position: relative;
    transition: all 500ms ease;
    display: block;
    padding: 16px 25px 16px;
    border-radius: 30px;
}

.accordion-box .accordion .accord-btn.last {}

.accordion-box .accordion .accord-btn h4 {
    color: #222222;
    font-size: 20px;
    font-weight: 700;
    line-height: 26px;
    transition: all 500ms ease;
}

.accordion-box .accordion .accord-btn::after {
    color: #a8a8a8;
    content: "\f055";
    font-family: FontAwesome;
    font-size: 18px;
    font-weight: 400;
    line-height: 42px;
    margin: 6px 0;
    position: absolute;
    right: 10px;
    top: 0;
    transition: all 500ms ease 0s;
    width: 45px;
    height: 45px;
    border-radius: 50%;
    border: 1px solid #e4e4e4;
    text-align: center;
}

.accordion-box .accordion .accord-btn.active {
    transition: all 500ms ease;
}

.accordion-box .accordion .accord-btn.active h4 {
    color: #d1162b;
}

.accordion-box .accordion .accord-btn.active:after {
    content: "\f056";
    border: 1px solid #d1162b;
    color: #d1162b;
    background: transparent;
}

.accordion-box .accordion .accord-content {
    display: none;
    position: relative;
    padding-left: 30px;
    padding-top: 23px;
    padding-bottom: 5px;
}

.accordion-box .accordion .accord-content.last {}

.accordion-box .accordion .accord-content.collapsed {
    display: block;
}

.accordion-box .accordion .accord-content p {
    margin: 0;
}

.faq-team-area .faq-content .more-button a {
    border: 1px solid #e9e9e9;
    width: 190px;
    color: #d1162b;
    margin: 40px 0 0;
}

.faq-team-area .faq-content .more-button a:hover {
    background: #d1162b;
    color: #ffffff;
    border-color: #d1162b;
}

.single-team-member {
    display: block;
}

.single-team-member .img-holder {
    position: relative;
    display: block;
    overflow: hidden;
}

.single-team-member .img-holder img {
    transition: all 0.5s ease 0s;
    width: 100%;
}

.single-team-member:hover .img-holder img {}

.single-team-member:hover .img-holder .overlay-style-one {
    opacity: 1;
    -webkit-transform: perspective(400px) rotateX(0deg);
    -moz-transform: perspective(400px) rotateX(0deg);
    -ms-transform: perspective(400px) rotateX(0deg);
    -o-transform: perspective(400px) rotateX(0deg);
    transform: perspective(400px) rotateX(0deg);
}

.single-team-member .img-holder .overlay-style-one .box .content ul {
    overflow: hidden;
}

.single-team-member .img-holder .overlay-style-one .box .content ul li {
    display: inline-block;
    margin: 0 3px;
}

.single-team-member .img-holder .overlay-style-one .box .content ul li a i {
    background: rgba(255, 255, 255, 0.95);
    height: 40px;
    width: 40px;
    display: block;
    border-radius: 50%;
    color: #172b42;
    font-size: 13px;
    line-height: 42px;
    transition: all 500ms ease;
}

.single-team-member .img-holder .overlay-style-one .box .content ul li a:hover i {
    background: #f8ec30;
}

.single-team-member .text-holder {
    background: #ffffff;
    padding-top: 22px;
    padding-bottom: 10px;
}

.single-team-member .text-holder h3 {
    color: #222222;
    font-size: 20px;
    font-weight: 700;
    text-transform: none;
    margin: 0 0 3px;
}

.single-team-member .text-holder span {
    color: #d1162b;
    font-size: 16px;
    font-weight: 300;
    font-family: 'Open Sans', sans-serif;
}

.single-team-member .text-holder .text {
    padding-top: 12px;
}

.single-team-member .text-holder .text p {
    margin: 0;
}

.single-team-member .bottom {
    border-top: 1px solid #f4f4f4;
    padding-top: 17px;
    margin-top: 18px;
}

.single-team-member .bottom ul li {
    line-height: 28px;
    font-size: 14px;
    color: #848484;
}

.single-team-member .bottom ul li i {
    display: inline-block;
    padding-right: 8px;
}

/***=============================================Latest blog area style two style=============================================***/ .parts-area {
    padding-top: 80px;
    padding-bottom: 50px;
}

.single-product-item {
    background: #fff;
    margin-bottom: 30px;
    transition: all 0.7s ease;
}

.single-product-item:hover {}

.single-product-item .img-holder {
    display: block;
    overflow: hidden;
    position: relative;
    border: 1px solid #f5f4f3;
}

.single-product-item .img-holder img {
    -webkit-transition: all 0.7s ease;
    transition: all 0.7s ease;
    width: 100%;
}

.single-product-item:hover .img-holder img {
    transform: scale(1.1);
}

.single-product-item:hover .img-holder .overlay-style-one {
    opacity: 1;
    -webkit-transform: perspective(400px) rotateX(0deg);
    -moz-transform: perspective(400px) rotateX(0deg);
    -ms-transform: perspective(400px) rotateX(0deg);
    -o-transform: perspective(400px) rotateX(0deg);
    transform: perspective(400px) rotateX(0deg);
}

.single-product-item .img-holder .overlay-style-one .box .content a {
    display: inline-block;
    color: #ffffff;
    font-size: 16px;
    border: 1px solid #ffffff;
    padding: 6px 12px;
}

.single-product-item .img-holder .overlay-style-one .box .content a:hover {
    background: #ffffff;
    color: #d1162b;

}

.single-product-item .title-holder {
    padding: 20px 0 0px;
}

.single-product-item .title-holder .top {
    overflow: hidden;
    margin-bottom: 10px;
}

.single-product-item .title-holder .top .product-title {}

.single-product-item .title-holder .top .product-title h5 {
    color: #222222;
    font-size: 20px;
    font-weight: 700;
    text-transform: capitalize;
    line-height: 26px;
}

.single-product-item .title-holder .top .review-box {}

.single-product-item .title-holder .top .review-box ul {
    line-height: 26px;
}

.single-product-item .title-holder .top .review-box ul li i {
    color: #d1162b;
}

.single-product-item .title-holder .product-value h4 {
    color: #d1162b;
    font-size: 18px;
    font-weight: 400;
    text-transform: capitalize;
    font-family: 'Open Sans', sans-serif;
}

.single-product-item .title-holder .product-value h4 del {
    color: #848484;
    font-size: 16px;
    display: inline-block;
    padding-left: 5px;
}

.single-product-item .title-holder .button a {
    background: #f7f7f7;
    width: 160px;
    color: #222222;
    margin: 22px 0 0;
}

.single-product-item .title-holder .button a:hover {
    background: #d1162b;
    color: #ffffff;
}

/* General Styling */
body {
    font-family: Arial, sans-serif;
    background-color: #00061b; /* Dark background */
    color: #fafafa;
    margin: 0;
    padding: 0;
}
/* ===============================
   BRAND SECTION (PROFESSIONAL)
================================ */

.brand-area {
  padding: 80px 20px;
}
/* section.brand-area {
    background-color: #d1162b !important;
} */

.brand-area .container {
  width: min(1200px, 90%);
  margin: 0 auto;
}

.brand-area .sec-title {
  text-align: center;
  margin-bottom: 40px;
}

.brand-area .sec-title h1 {
  font-size: 34px;
  font-weight: 800;
  color: #fafafa;
  margin-bottom: 12px;
}

.brand-area .sec-title .border {
  display: block;
  margin: 0 auto;
  width: 70px;
  height: 3px;
  background: rgba(255, 255, 255, 0.18);
  border-radius: 2px;
}

/* Grid */
.brand-area .brand-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 28px;
  margin-top: 45px;
}

/* Card */
.brand-area .single-item {
  background: #ffffff;
  border-radius: 12px;
  padding: 22px 18px;
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.18);
  transition: transform 0.25s ease, box-shadow 0.25s ease;

  height: 320px;                 /* ✅ same height */
  display: flex;
  flex-direction: column;
  text-align: center;
}

.brand-area .single-item:hover {
  transform: translateY(-8px);
  box-shadow: 0 16px 40px rgba(0, 0, 0, 0.25);
}

/* Logo Container */
.brand-area .brand-logo {
  height: 120px;                  /* ✅ fixed logo area */
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 10px;
}

.brand-area .brand-logo img {
  max-height: 92px;
  max-width: 100%;
  object-fit: contain;
  display: block;
}

/* Brand Name (slightly upper) */
.brand-area h4 {
  font-size: 18px;
  font-weight: 700;
  color: #111;
  margin-top: -4px;               /* ✅ pushes name slightly upward */
  margin-bottom: 6px;

  min-height: 44px;               /* ✅ keeps same line-height space */
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  line-height: 1.2;
}

/* Tagline below brand name – PROFESSIONAL ALIGNMENT */
.brand-area .brand-tagline {
    font-size: 15px;
    font-weight: 500;
    color: #000000;          /* subtle professional grey */
    
    text-align: center;
    line-height: 1.4;

    margin: 0 0 16px;        /* even spacing */
    
    min-height: 22px;        /* 🔥 keeps all cards aligned */
    
    display: flex;           /* 🔥 ensures perfect centering */
    align-items: center;
    justify-content: center;
}

/* Button stays bottom */
.brand-area .single-item button {
  margin-top: auto;               /* ✅ pushes button to bottom */
  width: 88%;
  align-self: center;

  padding: 12px 18px;
  border: none;
  border-radius: 8px;

  background: #d1162b;
  color: #fff;

  font-size: 15px;
  font-weight: 700;

  cursor: pointer;
  transition: background 0.25s ease, transform 0.25s ease;
}

.brand-area .single-item button:hover {
  background: #b81425;
  transform: translateY(-1px);
}

/* Button Styling */
button {
 
    color: white;
    padding: 12px 25px;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    font-size: 16px;
    width: 80%;
    margin-top: 2px;
    margin-bottom: 10px; 
    transition: background-color 0.3s;
}

button:hover {
    background-color:#d1162b;
}

.modal {
    display: none;
    position: fixed;
    z-index: 9999;
    inset: 0; 
    background-color: #d1162b
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Modal Box */
.modal-content {
    background-color: #fff;
    margin-top: 30px;
    padding: 25px;
    width: 100%;
    max-width: 420px;   
    max-height: 85vh;   
    overflow-y: auto;   
    border-radius: 12px;
    position: relative;
    box-shadow: 0 10p;x 40px rgba(0, 0, 0, 0.35);
}

.close {
    position: absolute;
    top: 12px;
    right: 15px;
    font-size: 26px;
    font-weight: bold;
    color: #000000;
    cursor: pointer;
}

h2 {
    text-align: center;
    font-size: 24px;
    margin-bottom: 20px;
}

/* Form Styling */
form {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

label {
    font-size: 14px;
    font-weight: 600;
    color: #000000;
}

input {
    padding: 10px;
    font-size: 14px;
    border: 1px solid #ccc;
    border-radius: 5px;
}

button {
    padding: 12px 25px;
    color: #ffffff;
    background-color: #d1162b;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    font-size: 16px;
    width: 100%;
}

button:hover {
    background-color: #d1162b;
}


/* ===============================
   RESPONSIVE
================================ */
@media (max-width: 1024px) {
  .brand-area .brand-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 768px) {
  .brand-area {
    padding: 60px 16px;
  }

  .brand-area .brand-grid {
    grid-template-columns: 1fr;
    gap: 18px;
  }

  .brand-area .single-item {
    height: auto;                 /* better on mobile */
    padding: 20px 16px;
  }

  .brand-area .single-item button {
    width: 100%;
  }
}

/*** 
=============================================
    Latest blog area style two style
=============================================
***/
.latest-blog-area.style-two {
    background: #f9f9f9;
}

.latest-blog-area.style-two .more-button {
    margin-top: 3px;
}

.latest-blog-area.style-two .more-button a {
    color: #d1162b;
    font-size: 16px;
    font-weight: 700;
    text-transform: uppercase;
    border: 1px solid #e9e9e9;
    width: 190px;
    display: block;
    text-align: center;
    border-radius: 30px;
    padding: 10px 0;
}

.latest-blog-area.style-two .more-button a:hover {
    background: #d1162b;
    border: 1px solid #d1162b;
    color: #ffffff;
}

.latest-blog-area.style-two .single-blog-item {
    position: relative;
    overflow: hidden;
    display: block;
    border: none;
    padding: 0;
    margin-bottom: 30px;
}

.latest-blog-area.style-two .single-blog-item .text-holder {
    background: #f9f9f9;
    margin-top: 0;
}

.latest-blog-area.style-two .single-blog-item .text-holder .meta-info {
    overflow: hidden;
    padding-top: 22px;
    border-top: none;
    margin-top: auto;
    padding-bottom: 15px;
}



/*** 
=============================================
    Top bar area style three  style
=============================================
***/
.top-bar-area.style-three {
    background: #303443;
}

.top-bar-area.style-three .top-right .social-links {
    padding-right: 0;
}

.top-bar-area.style-three .top-right .social-links li a:hover i {
    color: #ffffff;
}



/*** 
=============================================
    Header Area style three   style
=============================================
***/
header {
    position: relative;
    z-index: 9999;
    background: #fff;
}

.header-area.style-three .logo {
    display: inline-block;
    padding-right: 120px;
    padding-top: 45px;
    padding-bottom: 45px;
}

.header-area.style-three .logo a {
    display: inline-block;
}

.header-area.style-three .header-contact-info {
    display: inline-block;
    padding: 37px 0;
}

.header-area.style-three .header-contact-info ul li {
    display: inline-block;
    float: left;
    border-right: 1px solid #efefef;
    padding-right: 30px;
    margin-right: 30px;
}

.header-area.style-three .header-contact-info ul li:last-child {
    border-right: 0;
    padding-right: 0;
    margin-right: 0;
}

.header-area.style-three .header-contact-info ul li .icon-holder {
    width: 50px;
    height: 50px;
    position: relative;
}

.header-area.style-three .header-contact-info ul li .icon-holder:before {
    content: "\f100";
    color: #d1162b;
    font-family: Flaticon;
    font-size: 55px;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    line-height: 55px;
}

.header-area.style-three .header-contact-info ul li .icon-holder span:before {
    color: #d1162b;
    font-size: 20px;
    line-height: 20px;
    text-align: center;
    display: block;
    padding: 18px 17px;
}

.header-area.style-three .header-contact-info ul li .icon-holder,
.header-area.style-three .header-contact-info ul li .text-holder {
    display: table-cell;
    vertical-align: middle;
}

.header-area.style-three .header-contact-info ul li .text-holder {
    padding-left: 20px;
}

.header-area.style-three .header-contact-info ul li .text-holder h3 {
    margin: 0 0 3px;
}

.header-area.style-three .header-contact-info ul li .text-holder span {}

.header-area.style-three .appoinment-button a {
    background: transparent;
    color: #d1162b;
    text-transform: uppercase;
    font-weight: 700;
    border: 1px solid #f7f7f7;
    padding: 10px 15px 9px;
    margin: 43px 0 44px;
}

.header-area.style-three .appoinment-button a:hover {
    background: #d1162b;
    border-color: #d1162b;
    color: #ffffff;
}


/*** 
=============================================
    Rev Slider Wrapper style three style
=============================================
***/
.rev_slider_wrapper.style-three {}

.rev_slider_wrapper.style-three .slide-content-box {
    padding-bottom: 20px;
}

.rev_slider_wrapper.style-three .slide-content-box h1 {
    text-align: left;
    color: #ffffff;
    font-size: 70px;
    font-weight: 400;
    line-height: 72px;
    text-transform: none;
    font-family: 'Lato', sans-serif;
    margin: 0 0 22px;
}

.rev_slider_wrapper.style-three .slide-content-box h2 {
    text-align: left;
    color: #ffffff;
    font-size: 24px;
    font-weight: 300;
    line-height: 36px;
    text-transform: none;
    font-family: 'Lato', sans-serif;
    margin: 0 0 55px;
}

.rev_slider_wrapper .slide-content-box .button a {
    border: 2px solid #d1162b;
    background: #d1162b;
    padding: 15px 50px 14px;
    color: #ffffff;
    font-size: 16px;
    font-weight: 700;
    text-transform: uppercase;
    font-family: 'Nunito', sans-serif;
    border-radius: 30px;
    margin: 0 0 10px;
}

.rev_slider_wrapper .slide-content-box .button a:hover {
    background: #f8ec30;
    border-color: #fff;
    color: #252525;
}

.rev_slider_wrapper.style-three .tparrows {
    background: rgba(255, 255, 255, 0.35);
    cursor: pointer;
    display: block;
    height: 50px;
    position: absolute;
    width: 50px;
    z-index: 1000;
    transition: all 500ms ease;
    border-radius: 50%;
}

.tparrows:before {
    font-size: 18px;
    font-weight: 700;
    color: #fff;
    display: block;
    line-height: 50px;
    text-align: center;
    transition: all 500ms ease;
}

.rev_slider_wrapper.style-three .tparrows:hover {
    background: #d1162b;
}

.tparrows:hover:before {
    color: #fff;
}

.rev_slider_wrapper.style-three .slotholder:before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(34, 36, 38, 0.40);
    z-index: 9;
}

/***
=============================================
    Welcome area v2 style
=============================================
***/

.welcome-area-v2 {
    padding-top: 40px;
    padding-bottom: 40px;
}

.welcome-area-v2 .sec-title {
    padding-bottom: 60px;
}

.welcome-area-v2 .single-item {
    position: relative;
    background: #ffffff;
    margin-bottom: 40px;
    text-align: center;
    border: 1px solid #f4f4f4;
    display: block;
    padding: 50px 30px 42px;
    transition: all 500ms ease;
}

.welcome-area-v2 .single-item .icon-holder {
    width: 100px;
    text-align: center;
    position: relative;
    margin-left: auto;
    margin-right: auto;
    height: 100px;
    line-height: 100px;
    margin-bottom: 30px;
    transition: all 0.5s ease;
}

.welcome-area-v2 .single-item:hover .icon-holder {}

.welcome-area-v2 .single-item .icon-holder:after {
    content: "\f100";
    font-family: Flaticon;
    font-size: 100px;
    color: #d1162b;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    transition: all 300ms ease;
}

.welcome-area-v2 .single-item:hover .icon-holder:after {
    opacity: 0;
}

.welcome-area-v2 .single-item .icon-holder span:before {
    font-size: 40px;
    color: #d1162b;
    line-height: 100px;
    display: block;
    vertical-align: bottom;
    opacity: 1;
}

.welcome-area-v2 .single-item .text-holder {
    overflow: hidden;
    position: relative;
    transition: all 0.5s ease;
}

.welcome-area-v2 .single-item .text-holder h3 {
    margin: 0 0 9px;
    text-align: center;
}

.welcome-area-v2 .single-item .text-holder p {
    margin: 0;
}

.welcome-area-v2 .single-item .overlay-content .read-more {
    border: 1px solid #f4f4f4;
    width: 180px;
    margin: 30px auto 0;
    color: #d1162b;
    transition: all 500ms ease;
}

.welcome-area-v2 .single-item .overlay-content .read-more:hover {
    background: #d1162b;
    border-color: #d1162b;
    color: #ffffff;
}


.welcome-area-v2 .single-item .overlay-content {
    position: absolute;
    top: 0;
    bottom: 0;
    left: -1px;
    right: -1px;
    opacity: 0;
    display: block;
    transition: all 0.5s ease;
    background: #ffffff;
    box-shadow:
        -webkit-box-shadow: 0px 1px 19px -7px rgba(158, 153, 158, 1);
    -moz-box-shadow: 0px 1px 19px -7px rgba(158, 153, 158, 1);
    box-shadow: 0px 1px 19px -7px rgba(158, 153, 158, 1);
    padding-top: 50px;
    padding-left: 30px;
    padding-right: 30px;
    padding-bottom: 50px;
}

.welcome-area-v2 .single-item .overlay-content .icon-holder {
    width: 100px;
    text-align: center;
    position: relative;
    margin-left: auto;
    margin-right: auto;
    height: 100px;
    line-height: 100px;
    margin-bottom: 30px;
    transition: all 0.5s ease;
}

.welcome-area-v2 .single-item .overlay-content .icon-holder:before {
    content: "\f100";
    font-family: Flaticon;
    font-size: 100px;
    color: #d1162b;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    transition: all 300ms ease;
}

.welcome-area-v2 .single-item:hover .overlay-content {
    opacity: 1;
    top: -45px;
    bottom: -45px;
    transition: all 0.7s ease;
}

/*** 
=============================================
    Slogan area style two style
=============================================
***/
.slogan-area.style-two {
    background: #f9f9f9;
}

.slogan-area.style-two .sec-title {
    padding-bottom: 50px;
}

.slogan-area.style-two h1 {
    color: #222222;
}

.slogan-area.style-two a {
    width: 230px;
    border: 1px solid #efefef;
    color: #d1162b;
    font-size: 15px;
}

/*** 
=============================================
    Service area v2 style
=============================================
***/
.service-area-v2 {
    padding-top: 80px;
    padding-bottom: 80px;
}

.service-area-v2 .single-item {
    overflow: hidden;
}

.service-area-v2 .single-item .img-holder {
    display: block;
    overflow: hidden;
    position: relative;
}

.service-area-v2 .single-item .img-holder img {
    transform: scale(1.1, 1.1);
    transition: all 0.5s ease 0s;
    width: 100%;
}

.service-area-v2 .single-item:hover .img-holder img {
    transform: scale(1, 1);
}

.service-area-v2 .single-item .img-holder .overlay-style-one .content a i {
    font-size: 20px;
    color: #ffffff;
}

.service-area-v2 .single-item:hover .img-holder .overlay-style-one {
    opacity: 1;
    -webkit-transform: perspective(400px) rotateX(0deg);
    -moz-transform: perspective(400px) rotateX(0deg);
    -ms-transform: perspective(400px) rotateX(0deg);
    -o-transform: perspective(400px) rotateX(0deg);
    transform: perspective(400px) rotateX(0deg);
}

.service-area-v2 .single-item .text-holder {
    border: 1px solid #f4f4f4;
    display: block;
}

.service-area-v2 .single-item .text-holder .top {
    border-bottom: 1px solid #f4f4f4;
    display: block;
    padding-left: 20px;
}

.service-area-v2 .single-item .text-holder .top .title h3 {
    line-height: 32px;
    margin: 10px 0px;
}

.service-area-v2 .single-item .text-holder .top .icon {
    border-left: 1px solid #f4f4f4;
    display: block;
    padding: 11px 15px 9px;
}

.service-area-v2 .single-item .text-holder .top .icon span:before {
    color: #303443;
    font-size: 30px;
    line-height: 30px;
}

.service-area-v2 .single-item .text-holder .text {
    display: block;
    padding: 23px 20px 23px;
}

.service-area-v2 .single-item .text-holder .text p {
    margin: 0;
}

.service-area-v2 .owl-controls {
    position: absolute;
    right: 0;
    top: -90px;
}

.service-area-v2 .owl-theme .owl-nav {
    margin: 0;
}

.service-area-v2 .owl-theme .owl-nav [class*="owl-"] {
    background: transparent;
    border-radius: 0;
    color: #888888;
    font-size: 24px;
    font-weight: 700;
    height: 50px;
    line-height: 48x;
    margin: 0 0 0 0px;
    padding: 10px 0;
    width: 50px;
    border: 1px solid #f5f5f5;
    border-radius: 50%;
    transition: all 700ms ease 0s;
}

.service-area-v2 .owl-theme .owl-nav .owl-next {
    margin-left: 10px;
}

.service-area-v2 .owl-theme .owl-nav [class*="owl-"]:hover {
    border-color: #d1162b;
    color: #d1162b;
}

/*** 
=============================================
    Latest work area style
=============================================
***/
.latest-work-area {
    background: #303443;
    position: relative;
    padding-top: 80px;
    padding-bottom: 50px;
}

.latest-work-area .sec-title h1 {
    color: #ffffff;
}

.latest-work-area .sec-title .border:before {
    background: #ffffff;
}

.latest-work-area .sec-title .border:after {
    background: #ffffff;
}

.project-filter {
    margin-bottom: 40px;
}

.project-filter li {
    display: inline-block;
    margin: 0 5px;
}

.project-filter li span {
    position: relative;
    background: transparent;
    color: #c1c2c7;
    cursor: pointer;
    display: block;
    font-size: 16px;
    font-weight: 400;
    text-transform: capitalize;
    transition: all 500ms ease 0s;
    font-family: 'Open Sans', sans-serif;
    padding: 7px 20px 7px;
    border-radius: 3px;
}

.project-filter li.active span,
.project-filter li:hover span {
    color: #ffffff;
    background: #272b3b;
}

.latest-work-area .single-project-item {
    margin-bottom: 30px;
}

.latest-work-area .single-project-item .img-holder .overlay-style-one .box .content a.zoom i {
    font-size: 20px;
    width: auto;
    height: auto;
    background: transparent;
    color: #ffffff;
    border-radius: 0;
    line-height: initial;
    border: none;
}

.latest-work-area .single-project-item .img-holder .overlay-style-one .box .content .bottom {
    bottom: 13px;
    left: 20px;
}

/*** 
=============================================
    Appoinment area style two style
=============================================
***/
.appoinment-area.style-two {
    background: #ffffff;
    padding-top: 80px;
    padding-bottom: 80px;
}

.appoinment-area.style-two .appoinment {
    padding: 30px;
    border: 1px solid #f4f4f4;
}

.appoinment-area.style-two .appoinment .appoinment-form .input-box input[type=text],
.appoinment-area.style-two .appoinment .appoinment-form .input-box input[type=email],
.appoinment-area.style-two .appoinment .appoinment-form .input-box textarea {
    background: #ffffff;
    width: 100%;
    border: 1px solid #f4f4f4;
    height: 50px;
    display: block;
    padding: 0 15px;
    color: #222222;
    font-size: 15px;
    font-weight: 400;
    transition: all 500ms ease;
    font-family: 'Nunito', sans-serif;
}

.appoinment-area.style-two .appoinment .appoinment-form .input-box textarea {
    height: 115px;
    display: block;
    padding: 10px 15px;
}

.appoinment-area.style-two .appoinment .appoinment-form button {
    border: none;
    color: #222222;
    padding: 13px 30px 12px;
    width: 100%;
    background: #f7f7f7;
    font-size: 16px;
}

.appoinment-area.style-two .appoinment .appoinment-form button:hover {
    background: #d1162b;
    color: #ffffff;
}

.appoinment-area.style-two .appoinment .appoinment-form .text p {
    color: #848484;
    margin: 11px 0;
}

.more-features-content {
    display: block;
}

.more-features-content ul li {
    display: block;
    padding-left: 65px;
    margin-bottom: 30px;
    position: relative;
}

.more-features-content ul li:last-child {
    margin-bottom: 0;
}

.more-features-content ul li .icon-holder {
    position: absolute;
    top: 3px;
    left: 0;
}

.more-features-content ul li .icon-holder span:before {
    color: #292929;
    font-size: 45px;
    line-height: 45px;
}

.more-features-content ul li .text-holder {}

.more-features-content ul li .text-holder h3 {
    margin: 0 0 4px;
}

.more-features-content ul li .text-holder span {
    color: #d1162b;
}

.more-features-content ul li .text-holder p {
    margin: 9px 0 0;
}

/*** 
=============================================
    Team area style
=============================================
***/
.team-area {
    padding-top: 80px;
    padding-bottom: 145px;
}

.team-area .single-team-member {
    margin-bottom: 40px;
}

.team-area .single-team-member .text-holder {
    padding-top: 22px;
    padding-bottom: 18px;
    border-bottom: 1px solid #f4f4f4;
}

.team-area .owl-controls {
    max-width: 100px;
    margin: -25px auto 0;
    position: relative;
}

.team-area .owl-theme .owl-nav {}

.team-area .owl-theme .owl-nav .owl-prev {
    background: transparent none repeat scroll 0 0;
    border: 1px solid #f4f4f4;
    border-radius: 3px;
    height: 40px;
    left: 0;
    position: absolute;
    top: 25px;
    width: 40px;
    margin: 0;
    padding: 0;
    display: block;
    padding: 9px 0;
    transition: all 50ms ease;
}

.team-area .owl-theme .owl-nav .owl-next {
    background: transparent none repeat scroll 0 0;
    border: 1px solid #f4f4f4;
    border-radius: 3px;
    height: 40px;
    right: 0;
    position: absolute;
    top: 25px;
    width: 40px;
    margin: 0;
    padding: 0;
    display: block;
    padding: 9px 0;
    transition: all 500ms ease;
}

.team-area .owl-theme .owl-nav .owl-prev:hover {
    border-color: #d1162b;
}

.team-area .owl-theme .owl-nav .owl-next:hover {
    border-color: #d1162b;
}

.team-area .owl-theme .owl-nav div .fa {
    color: #222;
    font-size: 20px;
    display: block;
    text-align: center;
    transition: all 500ms ease;
}

.team-area .owl-theme .owl-nav .owl-next:hover .fa {
    color: #d1162b;
}

.team-area .owl-theme .owl-nav .owl-prev:hover .fa {
    color: #d1162b;
}

/*** 
=============================================
    Latest blog area style three style
=============================================
***/
.latest-blog-area.style-three {
    background: #f9f9f9;
}

.latest-blog-area.style-three .single-blog-item {
    background: #ffffff;
}

/*** 
=============================================
    Top bar area style four style
=============================================
***/
.top-bar-area.style-four {
    background: #303443;
    border: none;
}

.top-bar-area.style-four .top-right .social-links li a:hover i {
    color: #ffffff;
}

.top-bar-area.style-four .appoinment-button a {
    background: #3b3f4e;
}

.top-bar-area.style-four .appoinment-button a:hover {
    background: #2a2d38;
}



/*** 
=============================================
    Rev slider wrapper style four style
=============================================
***/
.rev_slider_wrapper.style-four {
    margin-top: -101px;
}

.rev_slider_wrapper.style-four .slide-content-box {
    background: rgba(0, 0, 0, 0.25);
    display: block;
    padding: 23px 30px 54px;
}

.rev_slider_wrapper.style-four .slide-content-box .title h3 {
    margin: 0;
    padding: 0;
}

.rev_slider_wrapper.style-four .slide-content-box .title h3 b {
    background: #d1162b;
    display: inline-block;
    color: #ffffff;
    font-size: 20px;
    font-weight: 700;
    text-transform: capitalize;
    padding: 11px 20px 10px;
    border-radius: 3px;
}

.rev_slider_wrapper.style-four .slide-content-box .title h3 span {
    color: #f8ec30;
    font-size: 48px;
    font-weight: 700;
    line-height: 60px;
    margin-left: 66px;
    position: relative;
    top: 9px;
}

.rev_slider_wrapper.style-four .slide-content-box .title h3 span:before {
    position: absolute;
    top: 5px;
    left: -40px;
    width: 60px;
    height: 43px;
    content: "";
    background: url(../images/icon/slide-icon.png);
}

.rev_slider_wrapper.style-four .slide-content-box h1 {
    color: #ffffff;
    font-size: 60px;
    line-height: 70px;
    font-weight: 400;
    text-align: left;
    margin: 21px 0 15px;
}

.rev_slider_wrapper.style-four .slide-content-box.middle h1 {
    text-align: center;
}

.rev_slider_wrapper.style-four .slide-content-box h2 {
    color: #dedede;
    font-size: 20px;
    font-weight: 400;
    line-height: 32px;
    font-family: 'Open Sans', sans-serif;
    text-align: left;
    margin: 0 0 45px;
}

.rev_slider_wrapper.style-four .slide-content-box.middle h2 {
    text-align: center;
}

.rev_slider_wrapper.style-four .slide-content-box.bgnone {
    background: transparent;
}

.rev_slider_wrapper.style-four .tparrows {
    background: rgba(0, 0, 0, 0.09);
    cursor: pointer;
    display: block;
    height: 50px;
    position: absolute;
    width: 50px;
    z-index: 1000;
    transition: all 500ms ease;
    border-radius: 50%;
}

.rev_slider_wrapper.style-four .tparrows:before {
    font-size: 18px;
    font-weight: 700;
    color: #fff;
    display: block;
    line-height: 50px;
    text-align: center;
    transition: all 500ms ease;
}

.rev_slider_wrapper.style-four .tparrows:hover {
    background: #d1162b;
}

.rev_slider_wrapper.style-four .tparrows:hover:before {
    color: #fff;
}

.rev_slider_wrapper.style-four .slotholder:before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(34, 36, 38, 0.40);
    z-index: 9;
}

/*** 
=============================================
    Welcome area v2 home4 style
=============================================
***/
.welcome-area-v2.home4 {
    padding: 0;
    margin-top: -100px;
}

.welcome-area-v2.home4 .single-item .icon-holder {
    background: #f9f9f9;
    border-radius: 50%;
}

.welcome-area-v2.home4 .single-item .icon-holder:after {
    display: none;
}

.welcome-area-v2.home4 .single-item:hover .icon-holder {
    background: #d1162b;
}

.welcome-area-v2.home4 .single-item:hover .icon-holder span:before {
    color: #ffffff;
}

/*** 
=============================================
    Welcome area home 4 style
=============================================
***/
.welcome-area.home-4 {
    padding-top: 40px;
}

/*** 
=============================================
    Choose us area style
=============================================
***/
.choose-us-area {
    position: relative;
    overflow: hidden;
    display: block;
    background: #f9f9f9;
}

.choose-us-area .right-img-holder {
    position: absolute;
    bottom: 0;
    right: 0;
}

.choose-us-area .mar-left-minus {
    margin-left: -30px;
}

.choose-us-area .img-holder img {
    max-width: none;
    float: right;
}

.choose-us-area .text-box {
    padding-top: 93px;
    padding-bottom: 92px;
    padding-left: 10px;
    margin-right: 50px;
    background: #F9F9F9;
}

.choose-us-area .more-features-content {
    display: block;
    margin-top: 10px;
}

.choose-us-area .more-features-content ul li .text-holder h3 {
    margin: 0 0 14px;
}

/*** 
=============================================
    Repair service area v2 style
=============================================
***/
.repair-service-area-v2 {
    padding-top: 80px;
    padding-bottom: 70px;
}

.repair-service-area-v2 .single-item {}

.repair-service-area-v2 .single-item .img-holder {
    position: relative;
    overflow: hidden;
    display: block;
}

.repair-service-area-v2 .single-item .img-holder img {
    transition: all 0.5s ease 0s;
    width: 100%;
}

.repair-service-area-v2 .single-item .img-holder .box {
    position: absolute;
    bottom: 10px;
    right: 10px;
    width: 85px;
    height: 70px;
    background: #ffffff;
    text-align: center;
}

.repair-service-area-v2 .single-item .img-holder .box h3 {
    background: #303443;
    color: #ffffff;
    font-size: 18px;
    font-weight: 700;
    display: block;
    padding: 10px 0 8px;
}

.repair-service-area-v2 .single-item .img-holder .box p {
    margin: 0;
    color: #d1162b;
    font-weight: 400;
    line-height: 32px;
}

.repair-service-area-v2 .single-item .text-holder {
    padding-top: 28px;
}

.repair-service-area-v2 .single-item .text-holder h3 {}

.repair-service-area-v2 .single-item .text-holder .text {
    overflow: hidden;
    display: block;
    border-top: 1px solid #f4f4f4;
    padding-top: 24px;
    margin-top: 15px;
}

.repair-service-area-v2 .single-item .text-holder .text p {
    margin: 0;
}

.repair-service-area-v2 .single-item .text-holder a {
    background: #f9f9f9;
    color: #d1162b;
    font-size: 16px;
    font-weight: 600;
    text-transform: uppercase;
    display: block;
    padding: 12px 0;
    margin-top: 23px;
    transition: all 500ms ease;
}

.repair-service-area-v2 .single-item .text-holder a:hover {
    background: #d1162b;
    color: #ffffff;
}

.repair-service-area-v2 .owl-dots {
    position: relative;
    margin-top: 36px;
}

.repair-service-area-v2 .owl-dots .owl-dot {
    background-image: none;
    width: 13px;
    height: 13px;
    margin: 5px 7px;
    border: 2px solid #d5d9e8;
    padding: 0px;
    background: #f4f4f4;
    border-radius: 50%;
    -webkit-border-radius: 50%;
    -ms-border-radius: 50%;
    -o-border-radius: 50%;
    -moz-border-radius: 50%;
    transition: all 500ms ease;
    display: inline-block;
}

.repair-service-area-v2 .owl-dots .owl-dot span {
    display: none;
}

.repair-service-area-v2 .owl-dots .owl-dot.active {
    background: #d1162b;
    border-radius: 15px;
}

.repair-service-area-v2 .owl-dots .owl-dot:hover {
    background: #d1162b;
}

/*** 
=============================================
    Latest work area v2 style
=============================================
***/
.latest-work-area-v2 {
    padding-top: 80px;
    padding-bottom: 30px;
    background: #f9f9f9;
}

.latest-work-area-v2 .sec-title {}

.latest-work-area-v2 .single-project-item {
    margin-bottom: 42px;
}

.latest-work-area-v2 .project-filter li span {
    border: 1px solid #efefef;
}

.latest-work-area-v2 .single-project-item .text-holder {
    padding-top: 25px;
}

.latest-work-area-v2 .single-project-item .text-holder a {
    color: #222222;
    font-size: 20px;
    font-weight: 700;
    text-transform: capitalize;
    margin: 0 0 10px;
}

.latest-work-area-v2 .single-project-item .text-holder p {
    margin: 0;
}

/*** 
=============================================
    Latest blog area style four style
=============================================
***/
.latest-blog-area.style-four {}

.latest-blog-area.style-four .more-button a {
    border: 1px solid #e9e9e9;
    color: #d1162b;
    padding: 12px 30px 10px;
    margin-top: 1px;
}

.latest-blog-area.style-four .more-button a:hover {
    background: #d1162b;
    border-color: #d1162b;
    color: #ffffff;
}

.latest-blog-area.style-four .single-blog-item {
    padding: 0;
}

.latest-blog-area.style-four .single-blog-item .img-holder .post-date {
    background: #d1162b;
    position: absolute;
    top: 10px;
    right: 10px;
    width: 70px;
    height: 60px;
    text-align: center;
    transform: translate3d(0px, 0px, 0px);
    transition: all 500ms ease;
    transition-delay: 0.5s;
}

.latest-blog-area.style-four .single-blog-item:hover .img-holder .post-date {
    transform: translate3d(0px, -70px, 0px);

}

.latest-blog-area.style-four .single-blog-item .img-holder .post-date h3 {
    color: #ffffff;
    font-size: 18px;
    font-weight: 700;
    line-height: 24px;
    display: block;
    padding: 6px 0;
}

.latest-blog-area.style-four .single-blog-item .text-holder {
    background: #ffffff;
    margin-top: 20px;
    display: block;
    padding: 0 24px 25px;
}

/*** 
=============================================
    Breadcrumb area style
=============================================
***/
/*** 
=============================================
    Breadcrumb area – FINAL (FULL IMAGE)
=============================================
***/
.breadcrumb-area {
    width: 100%;
    height: 250px;                     /* Desktop size */

    background-position: right center;
    background-repeat: no-repeat;
    background-size: auto 100%;        /* ✅ NO IMAGE CUT */

    display: flex;
    align-items: center;
    justify-content: center;

    padding: 0;
    margin: 0;
}

/* Text wrapper */
.breadcrumb-area .breadcrumbs {
    padding: 0;
    width: 100%;
    text-align: center;
}

.breadcrumb-area .breadcrumbs h1 {
    margin: 0;
    font-size: 48px;
    font-weight: 700;
    color: #ffffff;
    text-align: center;
}


.breadcrumb-botton {
    position: relative;
    overflow: hidden;
    z-index: 1;
}

.breadcrumb-botton ul {
    text-align: center;
    background: #d1162b;
    display: inline-block;
    padding: 8px 15px 8px;
}

.breadcrumb-botton ul li {
    display: inline-block;
    margin: 0 3px;
    color: #ffffff;
    font-size: 16px;
    font-weight: 400;
    text-transform: capitalize;
    line-height: 20px;
}

.breadcrumb-botton ul li i {
    display: inline-block;
    font-size: 16px;
}

.breadcrumb-botton ul li a {
    transition: all 500ms ease;
    color: #ffffff;
}

.breadcrumb-botton ul li a:hover {
    color: #fff;
}

.breadcrumb-botton ul li.active {
    color: #fff;
}

.breadcrumb-botton .share-button a {
    color: #fdc900;
    font-size: 16px;
    font-weight: 300;
    transition: all 500ms ease;
}

.breadcrumb-botton .share-button a:hover {
    color: #fff;
}

.breadcrumb-botton .share-button {
    margin: 16px 0;
}

.breadcrumb-botton .share-button a i {
    display: inline-block;
    padding-right: 7px;
    position: relative;
    top: 0px;
}

/* =====================================
/* =====================================
   BREADCRUMB – FULL IMAGE ON MOBILE
===================================== */
@media (max-width: 767px) {

    .breadcrumb-area {
        height: 65px;                  /* mobile-friendly */
        background-size: contain;       /* 🔥 SHOW FULL IMAGE */
        background-repeat: no-repeat;
        background-position: center;
    }

    /* Remove any extra gaps */
    .breadcrumb-area {
        margin-top: 0 !important;
        padding-top: 0 !important;
    }
}




/*** 
=============================================
    Welcome area style
=============================================
***/
.welcome-area .video-holder {
    width: 100%;
    height: auto;
    text-align: center;
    position: relative;
    overflow: hidden;
}

.welcome-area .video-holder img {
    transform: scale(1);
    transition: all 0.5s ease 0s;
    width: 100%;
}

.welcome-area .video-holder .overlay-gallery {
    background-color: transparent;
    bottom: 0;
    height: 100%;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    width: 100%;
    transition: all 500ms ease;
}

.welcome-area .video-holder .overlay-gallery .icon-holder {
    display: table;
    height: 100%;
    width: 100%;
}

.welcome-area .video-holder .overlay-gallery .icon-holder .icon {
    display: table-cell;
    vertical-align: middle;
}

.welcome-area .video-holder .overlay-gallery .icon-holder .icon a img {
    width: auto;
    transform: scale(1);
    transition: all 0.5s ease 0s;
}

.welcome-area .video-holder:hover .overlay-gallery {
    background-color: rgba(35, 53, 136, 0.60);
}

.welcome-area .video-holder:hover img {
    transform: scale(1.1);
}

.welcome-area .video-holder .overlay-gallery .icon-holder .icon a:hover img {
    transform: scale(1.1);
}

/*** 
=============================================
    Contact Info area bottom style
=============================================
***/
/*** 
=============================================
Contact Info Area – FINAL STABLE VERSION
=============================================
***/

.contact-info-area {
    padding: 40px 0;
}

/* Force equal height columns */
.contact-info-area .row {
    display: flex;
    align-items: stretch;
}

.contact-info-area .col-md-4 {
    display: flex;
}

/* ================= CARD ================= */

.contact-card {
    width: 100%;
    height: 100%;
    padding: 24px 30px;
    background: #fff;
    border: 1px solid #eee;
    box-shadow: 0 8px 20px rgba(0,0,0,0.06);

    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
}

/* ================= ICON ZONE ================= */

.contact-card i {
    font-size: 34px;
    color: #d1162b;

    width: 50px;
    height: 50px;

    display: flex;
    align-items: center;
    justify-content: center;

    margin-bottom: 14px;
}

/* Normalize phone icon visually */
.contact-card i.fa-phone {
    transform: translateY(6px);
}

/* ================= TITLE ================= */

.contact-card h4 {
    font-size: 18px;
    font-weight: 600;
    color: #000;
    margin-bottom: 12px;
}

/* ================= CONTENT ZONE ================= */

.contact-card .main-text {
    font-size: 16px;
    font-weight: 700;
    color: #d1162b;
    line-height: 1.25;   /* 🔥 tight spacing */
    text-decoration: none;
}

/* Phone number spacing */
.contact-card .phone-link {
    display: block;
    margin: 2px 0;      /* 🔥 NO BIG GAP */
}

/* Hover */
.contact-card a.main-text:hover {
    text-decoration: underline;
}

/* ================= RESPONSIVE ================= */

@media (max-width: 767px) {
    .contact-card {
        margin-bottom: 25px;
    }
}

/* Industries We Serve Section */
/* FORCE red background for Industries section */
section.industries-area {
    background-color: #d1162b !important;
}

.industries-area {
    padding: 80px 0;
    background: #d1162b;
    
}
/* Grid */
.industries-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 30px;
    align-items: stretch; /* IMPORTANT */
}
/* ===============================
   INDUSTRIES – WHITE CARDS
================================ */

.industry-item {
                        /* ✅ WHITE CARD */
    border: 5px solid #fff;               /* subtle light border */
    border-radius: 10px;

    height: 220px;
    padding: 22px;

    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;

    transition: all 0.35s ease;
}

/* Icon */
.industry-item i {
    font-size: 48px;
    color: #d1162b;                          /* brand red icon */
    margin-bottom: 14px;
    opacity: 1;
}

/* Title */
.industry-item h4 {
    font-size: 22px;
    font-weight: 700;
    color: #ffffff;                          /* dark readable text */
    letter-spacing: 0.3px;
    line-height: 1.3;
}


.industry-item.highlight {
    background: linear-gradient(135deg, #c9a24d, #b8923d);
    border-color: #ffffff;
}

.industry-item.highlight i,


.industry-item:hover {
    transform: translateY(-6px);
    box-shadow: 0 18px 40px rgba(0, 0, 0, 0.15);
    border-color: #fff;
}

.industry-item i {
    font-size: 48px;
    color: #ffffff;
    margin-bottom: 14px;
}



/* Title */
.industries-area .section-title h2 {
    color: #ffffff;
    font-size: 30px;
    font-weight: 800;
    margin-bottom: 40px;
}

/* Responsive */
@media (max-width: 991px) {
    .industries-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .industry-item:nth-child(2n) {
        border-right: none;
    }

    .industry-item:nth-child(n+3) {
        border-bottom: none;
    }
}

@media (max-width: 575px) {
    .industries-grid {
        grid-template-columns: 1fr;
    }

    .industry-item {
        border-right: none;
        border-bottom: 1px solid rgba(255, 255, 255, 0.4);
    }
}
/* SECTION */
.choosing-area {
  padding: 70px 0;
}

section.choosing-area {
    background-color: #d1162b !important;
}

.sec-title h1 {
  font-size: 40px;
  font-weight: 600;
  margin-bottom: 50px;
  text-align: center;
}

/* CARD */
.choose-card {
  background: #fff;
  border-radius: 18px;
  padding: 28px;
  height: 100%;
  gap: 20px;

  box-shadow: 0 12px 30px rgba(0,0,0,0.08);
}

/* TITLE */
.choose-card h3 {
  text-align: center;       /* 🔥 CENTERED TO CARD */
  font-size: 18px;
  font-weight: 800;
  margin: 0 0 18px 0;       /* 🔥 controlled spacing */
}

.card-body {
  display: flex;
  align-items: flex-start;
  gap: 18px;
}

.card-body p {
  margin: 0;

  font-size: 15px;
  font-weight: 500;
  line-height: 1.7;
  color: #222;

  /* ✅ PROFESSIONAL TYPOGRAPHY */
  text-align: left;

  /* optical consistency */
  max-width: 260px;

  word-spacing: normal;
  letter-spacing: 0;
}


/* ICON */
.icon-box {
  flex-shrink: 0;
}

.icon-box span {
  display: flex;
  align-items: center;
  justify-content: center;

  width: 64px;
  height: 64px;

  font-size: 28px;
  border-radius: 14px;
  border: 2px solid #eee;
  background: #fff;
}
.card-body p {
  margin: 0;

  font-size: 15px;
  font-weight: 600;
  line-height: 1.7;
  color: #000;

  /* ✅ Proper justification */
  text-align: justify;
  text-justify: inter-word;

  /* ✅ Prevent ugly spacing */
  hyphens: auto;
  -webkit-hyphens: auto;
  -ms-hyphens: auto;

  /* ✅ VERY IMPORTANT */
  text-align-last: left;

  /* cleanup */
  word-spacing: 0;
  letter-spacing: 0;
}



/* ICON COLOR */
.icon-box span {
  color: #d1162b;           /* 🔴 icon color */
  border-color: #f0f0f0;
}

/* ICON HOVER */
.choose-card:hover .icon-box span {
  background: #d1162b;
  color: #ffffff;           /* icon turns white on hover */
  border-color: #d1162b;
}

/* MOBILE */
@media (max-width: 767px) {
  .card-body {
    flex-direction: row;
  }

  .choose-card h3 {
    font-size: 17px;
  }
}

/* ===============================
   CERTIFICATION SECTION
================================ */

.certification-area {
    padding: 70px 0;
    
}

/* Section Title */
.cert-section-title {
    text-align: center;
    font-weight: 800;
    color: #ffffff;
    margin-bottom: 45px;
    font-size: 30px;
    letter-spacing: 0.4px;
}

/* Grid Layout */
.certification-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr); /* ✅ 3 cards */
    gap: 35px;
    align-items: stretch;
}

/* Card */
.certification-box {
    background: #ffffff;
    padding: 26px 22px;
    border-radius: 10px;
    text-align: center;

    display: flex;
    flex-direction: column;
    justify-content: space-between;

    box-shadow: 0 12px 30px rgba(0, 0, 0, 0.25);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.certification-box:hover {
    transform: translateY(-6px);
    box-shadow: 0 18px 40px rgba(0, 0, 0, 0.35);
}

/* Card Title */
.certification-box h3 {
    font-size: 20px;
    font-weight: 700;
    color: #111;
    margin-bottom: 18px;
    min-height: 52px; /* keeps all titles aligned */
}

/* Certificate Frame */
.certificate-frame {
    padding: 18px;
    background: #ffffff;
    border: 5px solid #eeeeee;
    border-radius: 6px;
    flex-grow: 1;

    display: flex;
    align-items: center;
    justify-content: center;
}

/* Certificate Image */
.certificate-frame img {
    width: 100%;
    height: auto;
    max-height: 380px;
    object-fit: contain;
    display: block;
}

/* ===============================
   RESPONSIVE
================================ */

/* Tablet */
@media (max-width: 1024px) {
    .certification-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

/* Mobile */
@media (max-width: 768px) {
    .certification-area {
        padding: 55px 0;
    }

    .cert-section-title {
        font-size: 26px;
        margin-bottom: 30px;
    }

    .certification-grid {
        grid-template-columns: 1fr;
        gap: 28px;
    }

    .certification-box {
        padding: 22px 18px;
    }

    .certificate-frame img {
        max-height: 320px;
    }
}

/*** 
=============================================
    Team page area style
=============================================
***/
.team-page-area {
    padding-top: 80px;
    padding-bottom: 40px;
}

.team-page-area .single-team-member {
    display: block;
    padding-bottom: 40px;
}
/* =========================
   FAQ SECTION
========================= */

section.faq-area {
    background-color: #d1162b !important;
}
.faq-area {
  background: #0b1220;
  padding: 80px 20px;
}

.faq-area .sec-title h1 {
  color: #ffffff;
  font-size: 36px;
  font-weight: 800;
  margin-bottom: 50px;
}

/* Grid */
.faq-grid {
  max-width: 1100px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 30px;
}

/* Card */
.faq-card {
  background: #ffffff;
  border-radius: 14px;
  box-shadow: 0 14px 40px rgba(0,0,0,0.15);
  position: relative;
  min-height: 220px; /* ✅ SAME HEIGHT */
  display: flex;
  align-items: center;
}

/* Red vertical accent */
.faq-card::before {
  content: "";
  position: absolute;
  left: 22px;
  top: 22px;
  bottom: 22px;
  width: 4px;
  background: #d1162b;
  border-radius: 4px;
}

/* Content wrapper – THIS FIXES ALIGNMENT */
.faq-content {
  padding: 28px 30px 28px 52px; /* same start for h3 & p */
}


/* Question */
.faq-content h3 {
  font-size: 18px;
  font-weight: 700;
  color: #0f172a;
  margin-bottom: 12px;
}

/* Answer */
.faq-content p {
  font-size: 15.5px;
  line-height: 1.75;
  color: #374151;
  margin: 0;
}

/*** 
=============================================
    Pricing Plan Area style
=============================================
***/
.pricing-plan-area {
    padding-top: 75px;
    padding-bottom: 40px;
}

.pricing-plan-area .sec-title {
    max-width: 800px;
    margin: 0 auto;
    padding-bottom: 42px;
}

.pricing-plan-area .sec-title p {
    margin: 22px 0 0;
}

.pricing-plan-area .single-price-box {
    background: #f9f9f9;
    display: block;
    margin-bottom: 40px;
    position: relative;
    transition: all 500ms ease;
    z-index: 1;
}

.pricing-plan-area .single-price-box.hvr-float-shadow:before {
    background: none;
}

.pricing-plan-area .single-price-box .table-header {}

.pricing-plan-area .single-price-box .table-header .top {
    background: #d1162b;
    transition: all 500ms ease;
    transition-delay: 0.10s;
    padding-bottom: 25px;
    padding-top: 25px;
}

.pricing-plan-area .single-price-box .table-header .top h3 {
    background: #2f4297;
    color: #ffffff;
    font-size: 20px;
    font-weight: 700;
    border: 1px solid #394a94;
    text-transform: capitalize;
    display: block;
    width: 155px;
    height: 40px;
    border-radius: 30px;
    line-height: 40px;
    margin: 0 auto;
    transition: all 500ms ease;
    transition-delay: 0.10s;
}

.pricing-plan-area .single-price-box .table-header .package {
    display: block;
    padding: 20px 0 2px;
}

.pricing-plan-area .single-price-box .table-header .package h1 {
    color: #222222;
    font-size: 72px;
    line-height: 72px;
    font-weight: 400;
    position: relative;
    transition: all 500ms ease;
}

.pricing-plan-area .single-price-box .table-header .package h1 span {
    font-size: 20px;
    font-weight: 400;
    display: inline-block;
    line-height: 20px;
    padding-left: 3px;
    position: relative;
    top: -2px;
}

.pricing-plan-area .single-price-box .table-header .package h1 b {
    font-size: 24px;
    font-weight: 400;
    display: inline-block;
    padding-right: 3px;
    position: relative;
    top: -3px;
}

.pricing-plan-area .single-price-box .price-list {
    display: block;
    background: #ffffff;
    padding: 19px 0px 25px;
    border-left: 1px solid #f7f7f7;
    border-right: 1px solid #f7f7f7;
}

.pricing-plan-area .single-price-box .price-list ul {
    text-align: center;
}

.pricing-plan-area .single-price-box .price-list ul li {
    color: #848484;
    font-size: 16px;
    font-weight: 300;
    font-family: 'Open Sans', sans-serif;
    padding-bottom: 13px;
    margin-bottom: 12px;
    border-bottom: 1px solid #f4f4f4;
    transition: all 500ms ease;
    position: relative;
}

.pricing-plan-area .single-price-box .price-list ul li:last-child {
    margin-bottom: 0;
}

.pricing-plan-area .single-price-box .table-footer {
    background: #ffffff;
    border-left: 1px solid #f7f7f7;
    border-right: 1px solid #f7f7f7;
    border-bottom: 1px solid #f7f7f7;
    padding-bottom: 25px;
}

.pricing-plan-area .single-price-box .table-footer a {
    width: 160px;
    margin: 0 auto;
    padding: 10px 0px 8px;
    color: #222222;
    background: #f7f7f7;
    display: block;
    transition: all 500ms ease;
}

.pricing-plan-area .single-price-box .table-footer a:hover {
    background: #d1162b;
    color: #fff;
}

/*** 
=============================================
    Not found area style
=============================================
***/
.not-found-area {
    background: #ffffff none repeat scroll 0 0;
    border-top: 1px solid #f4f4f4;
    padding-bottom: 100px;
    padding-top: 74px;
}

.not-found-content h1 {
    color: #222222;
    font-size: 150px;
    font-weight: 700;
    margin: 0 0 7px;
    text-shadow: 1px 4px 5px #999999;
}

.not-found-content h3 {
    color: #222;
    font-size: 20px;
    line-height: 26px font-weight: 400;
    margin: 0 0 20px;
    font-family: 'Open Sans', sans-serif;
    text-transform: uppercase;
}

.not-found-content p {
    color: #d1162b;
    font-weight: 400;
    font-size: 18px;
    margin: 0 0 42px;
}

.not-found-content .search-form {
    width: 432px;
    position: relative;
    margin: 0 auto;
}

.not-found-content .search-form input[type="text"] {
    background: #fff;
    border: 1px solid #f1f1f1;
    color: #9a9a9a;
    display: inline-block;
    font-size: 16px;
    font-weight: 300;
    height: 55px;
    letter-spacing: 1px;
    padding-left: 20px;
    padding-right: 60px;
    position: relative;
    -webkit-transition: all 500ms ease 0s;
    transition: all 500ms ease 0s;
    width: 432px;
}

.not-found-content .search-form button {
    background: #d1162b none repeat scroll 0 0;
    border: medium none;
    color: #fff;
    display: inline-block;
    height: 55px;
    padding: 11px 0;
    position: absolute;
    right: 0;
    text-align: center;
    top: 0;
    -webkit-transition: all 500ms ease 0s;
    transition: all 500ms ease 0s;
    width: 55px;
}

.not-found-content .search-form button i {
    font-size: 14px
}

.not-found-content .search-form input[type="text"]:focus {
    border: 1px solid #142573;
    background: #fff;
    color: #000;
}

.not-found-content .search-form input[type="text"]:focus+button,
.not-found-content .search-form button:hover {
    background: #142573 none repeat scroll 0 0;
    color: #fff;
}

/*** 
=============================================
    Service area service page style
=============================================
***/
.service-area.service-page {}

.service-area.service-page .single-service-item .img-holder {
    position: relative;
    overflow: hidden;
}

.service-area.service-page .single-service-item .img-holder img {
    transform: scale(1.1, 1.1);
    transition: all 0.5s ease 0s;
    width: 100%;
}

.service-area.service-page .single-service-item:hover .img-holder img {
    transform: scale(1, 1);
}

.service-area.service-page .single-service-item:hover .img-holder .overlay-style-one {
    opacity: 1;
    -webkit-transform: perspective(400px) rotateX(0deg);
    -moz-transform: perspective(400px) rotateX(0deg);
    -ms-transform: perspective(400px) rotateX(0deg);
    -o-transform: perspective(400px) rotateX(0deg);
    transform: perspective(400px) rotateX(0deg);
}

.service-area.service-page .single-service-item .img-holder .overlay-style-one a i {
    border: 1px solid #ffffff;
    display: inline-block;
    width: 40px;
    height: 40px;
    font-size: 18px;
    line-height: 40px;
    transition: all 500ms ease;
}

.service-area.service-page .single-service-item .img-holder .overlay-style-one a:hover i {
    background: #ffffff;
    color: #d1162b;
}

.service-area.service-page .single-service-item .text-holder {
    padding-top: 27px;
}

.service-area.service-page .single-service-item .text-holder a h3 {
    margin: 0 0 9px;
}

.service-area.service-page .single-service-item .text-holder a:hover h3 {
    color: #d1162b;
}



/*** 
=============================================
   Service Single Area style
=============================================
***/
#service-single-area {
    padding-bottom: 80px;
    padding-top: 80px;
}

#service-single-area .service-single-sidebar .single-sidebar {
    padding-bottom: 50px;
}

#service-single-area .service-single-sidebar .single-sidebar .title {
    padding-bottom: 30px;
}

#service-single-area .service-single-sidebar .single-sidebar .title h3 {
    color: #222222;
    font-size: 24px;
    font-weight: 700;
}

#service-single-area .service-single-sidebar .service-lists {
    display: block;
    padding: 0 20px;
    border: 1px solid #f4f4f4;
}

#service-single-area .service-single-sidebar .service-lists li {
    position: relative;
}

#service-single-area .service-single-sidebar .service-lists li a {
    background: #ffffff none repeat scroll 0 0;
    display: block;
    color: #848484;
    font-size: 16px;
    font-weight: 400;
    text-transform: none;
    position: relative;
    border-bottom: 1px solid #f4f4f4;
    transition: all 500ms ease;
    transition-delay: 0.10s;
    padding: 14px 20px 13px;
}

#service-single-area .service-single-sidebar .service-lists li:last-child a {
    border-bottom: none;
}

#service-single-area .service-single-sidebar .service-lists li a::before {
    content: "\f0da";
    font-family: FontAwesome;
    color: #848484;
    height: 10px;
    left: 0;
    position: absolute;
    top: 14px;
    width: 10px;
    z-index: 1;
    transition: all 500ms ease;
    transition-delay: 0.5s;
}

#service-single-area .service-single-sidebar .service-lists li a:hover,
#service-single-area .service-single-sidebar .service-lists li.active a {
    color: #d1162b;
}

#service-single-area .service-single-sidebar .service-lists li a:hover::before,
#service-single-area .service-single-sidebar .service-lists li.active a::before {
    color: #d1162b;
}

#service-single-area .service-single-sidebar .single-sidebar .brochures-dwn-link {
    overflow: hidden;
}

#service-single-area .service-single-sidebar .single-sidebar .brochures-dwn-link li {
    margin-bottom: 10px;
}

#service-single-area .service-single-sidebar .single-sidebar .brochures-dwn-link li:last-child {
    margin-bottom: 0;
}

#service-single-area .service-single-sidebar .single-sidebar .brochures-dwn-link li a {
    background: #f7f7f7;
    font-size: 18px;
    display: block;
    padding: 15px 20px 14px;
    transition: all 500ms ease;
}

#service-single-area .service-single-sidebar .single-sidebar .brochures-dwn-link li a:hover {
    background: #d1162b;
}

#service-single-area .service-single-sidebar .single-sidebar .brochures-dwn-link li a .icon-holder {
    width: 35px;
}

#service-single-area .service-single-sidebar .single-sidebar .brochures-dwn-link li a .icon-holder span:before {
    color: #848484;
    font-size: 25px;
    line-height: 25px;
    transition: all 500ms ease;
}

#service-single-area .service-single-sidebar .single-sidebar .brochures-dwn-link li a:hover .icon-holder span:before {
    color: #ffffff;
}

#service-single-area .service-single-sidebar .single-sidebar .brochures-dwn-link li a .icon-holder,
#service-single-area .service-single-sidebar .single-sidebar .brochures-dwn-link li a .title-holder {
    display: table-cell;
    vertical-align: middle;
}

#service-single-area .service-single-sidebar .single-sidebar .brochures-dwn-link li a .title-holder h5 {
    font-size: 16px;
    color: #222222;
    font-weight: 600;
    margin: 0;
    transition: all 500ms ease;
}

#service-single-area .service-single-sidebar .single-sidebar .brochures-dwn-link li a:hover .title-holder h5 {
    color: #ffffff;
}

#service-single-area .service-single-sidebar .single-sidebar .brochures-dwn-link li a .title-holder span {
    color: #848484;
    font-size: 14px;
    transition: all 500ms ease;
}

#service-single-area .service-single-sidebar .single-sidebar .brochures-dwn-link li a:hover .title-holder span {
    color: #ffffff;
}

#service-single-area .service-single-content {}

#service-single-area .service-single-content .sec-title {
    padding-bottom: 35px;
}

#service-single-area .service-single-content .sec-title h1 {
    font-size: 30px;
}

#service-single-area .service-single-content .top-content {
    overflow: hidden;
    margin-bottom: 60px;
}

#service-single-area .service-single-content .top-content .img-holder {
    margin-right: 0;
}

#service-single-area .service-single-content .top-content .img-holder img {}

#service-single-area .service-single-content .top-content .text-holder {}

#service-single-area .service-single-content .top-content .text-holder span {
    color: #222222;
    font-weight: 400;
    font-style: italic;
    font-size: 20px;
}

#service-single-area .service-single-content .top-content .text-holder p.top {
    margin: 15px 0 15px;
}

#service-single-area .service-single-content .top-content .img-box {
    overflow: hidden;
}

#service-single-area .service-single-content .top-content .img-box .single-img-box {
    margin-bottom: 30px;
}

#service-single-area .service-single-content .border {
    height: 1px;
    background: #f4f4f4;
}

#service-single-area .service-single-content .middle-content {
    margin-top: 60px;
}

#service-single-area .service-single-content .middle-content .sec-title {
    padding-left: 15px;
}

#service-single-area .service-single-content .middle-content .text-holder {
    overflow: hidden;
}

#service-single-area .service-single-content .middle-content .text-holder ul {
    overflow: hidden;
    margin: 15px 0 0;
}

#service-single-area .service-single-content .middle-content .text-holder ul li {
    line-height: 32px;
}

#service-single-area .service-single-content .middle-content .text-holder ul li i {
    display: inline-block;
    color: #d1162b;
    padding-right: 7px;
}


#service-single-area .service-single-content .middle-content .video-holder {
    display: block;
    overflow: hidden;
    position: relative;
}

#service-single-area .service-single-content .middle-content .video-holder img {
    transform: scale(1);
    transition: all 0.5s ease 0s;
    width: 100%;
}

#service-single-area .service-single-content .middle-content .video-holder .overlay-gallery {
    background-color: transparent;
    bottom: 0;
    height: 100%;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    width: 100%;
    transition: all 500ms ease;
}

#service-single-area .service-single-content .middle-content .video-holder .overlay-gallery .icon-holder {
    display: table;
    height: 100%;
    width: 100%;
}

#service-single-area .service-single-content .middle-content .video-holder .overlay-gallery .icon-holder .icon {
    display: table-cell;
    vertical-align: middle;
    text-align: center;
}

#service-single-area .service-single-content .middle-content .video-holder .overlay-gallery .icon-holder .icon a img {
    width: auto;
    transform: scale(1);
    transition: all 0.5s ease 0s;
}

#service-single-area .service-single-content .middle-content .video-holder:hover .overlay-gallery {
    background-color: rgba(35, 53, 136, 0.70);
}

#service-single-area .service-single-content .middle-content .video-holder:hover img {
    transform: scale(1.1);
}

#service-single-area .service-single-content .middle-content .video-holder .overlay-gallery .icon-holder .icon a:hover img {
    transform: scale(1.1);
}

#service-single-area .service-single-content .bottom-content {
    margin-top: 70px;
}


#service-single-area .service-single-content .bottom-content .accordion-box {
    border: 1px solid #f4f4f4;
    display: block;
    padding: 20px 20px 0px;
    border-radius: 30px;
}


#service-single-area .service-single-content .plans-content {
    overflow: hidden;
    padding-top: 60px;
}

#service-single-area .service-single-content .plans-content .single-box {
    border: 1px solid #f4f4f4;
    display: block;
    padding: 0 0 29px;
    text-align: center;
}

#service-single-area .service-single-content .plans-content .single-box .title {
    display: block;
    border-bottom: 1px solid #f4f4f4;
}

#service-single-area .service-single-content .plans-content .single-box .title h3 {
    display: block;
    padding: 16px 0 14px;
}

#service-single-area .service-single-content .plans-content .single-box .content {
    overflow: hidden;
    padding-top: 20px;
}

#service-single-area .service-single-content .plans-content .single-box .content h1 {
    color: #252525;
    font-size: 56px;
    font-weight: 400;
    position: relative;
    margin: 0 0 5px;
}

#service-single-area .service-single-content .plans-content .single-box .content h1 span {
    font-size: 20px;
    position: relative;
    top: -23px;
    left: -1px;
}

#service-single-area .service-single-content .plans-content .single-box .content h1 b {
    font-size: 20px;
    position: relative;
    top: -2px;
    right: -2px;
}

#service-single-area .service-single-content .plans-content .single-box .content span {
    font-weight: 400;
    font-size: 14px;
}

#service-single-area .service-single-content .plans-content .single-box .button {
    margin-top: 22px;
}

#service-single-area .service-single-content .plans-content .single-box .button a {
    border: 1px solid #f4f4f4;
    color: #d1162b;
    font-weight: 700;
    height: 45px;
    width: 130px;
    margin: 0 auto;
    padding: 10px 0;
    transition: all 500ms ease;
}

#service-single-area .service-single-content .plans-content .single-box .button a:hover {
    background: #d1162b;
    color: #ffffff;
    border-color: #d1162b;
}

/*** 
=============================================
    Project area project page style
=============================================
***/
.project-area.project-page {
    padding: 80px 0;
}

.project-area.project-page .gallery-menu {
    background: #303443;
    margin-bottom: 50px;
}

.project-area.project-page .gallery-menu .project-filter {
    margin-bottom: 0;
    padding: 20px 0;
}

.project-area.project-page .load-more-button {
    margin-top: 50px;
}

.project-area.project-page .load-more-button a {
    display: block;
    color: #222222;
    font-size: 16px;
    font-weight: 700;
    text-transform: uppercase;
    font-family: 'Nunito', sans-serif;
    width: 230px;
    height: 50px;
    text-align: center;
    margin: 0 auto;
    border: 1px solid #f4f4f4;
    border-radius: 30px;
    line-height: 48px;
    transition: all 500ms ease;
}

.project-area.project-page .load-more-button a:hover {
    background: #d1162b;
    border-color: #d1162b;
    color: #ffffff;
}

/*** 
=============================================
    Project Single Area style
=============================================
***/
#project-single-area {
    padding-top: 80px;
    padding-bottom: 80px;
}

#project-single-area .owl-theme .owl-nav {
    margin-top: 0px;
}

#project-single-area .owl-theme .owl-dots {
    text-align: center;
}

#project-single-area .owl-theme .owl-dots .owl-dot {
    display: inline-block;
}

#project-single-area .owl-theme .owl-dots {
    position: absolute;
    top: 90%;
    left: 0;
    right: 0;
}

#project-single-area .owl-dots .owl-dot {
    background-image: none;
    background-color: #fff;
    width: 12px;
    height: 12px;
    margin: 6px;
    padding: 0px;
    border: 2px solid #fff;
    background: none;
    border-radius: 50%;
    -webkit-border-radius: 50%;
    -ms-border-radius: 50%;
    -o-border-radius: 50%;
    -moz-border-radius: 50%;
    transition: all 500ms ease;
}

#project-single-area .owl-dots .owl-dot span {
    display: none;
}

#project-single-area .owl-dots .owl-dot.active {
    border: 2px solid #d1162b;
    background: #d1162b;
}

#project-single-area .project-info {}

#project-single-area .sec-title {
    padding-bottom: 20px;
}

#project-single-area .sec-title h2 {
    color: #404040;
    font-size: 24px;
    line-height: 32px;
    font-weight: 700;
    text-transform: uppercase;
    margin: 0;
}

#project-single-area .project-info .project-info-list {
    overflow: hidden;
    margin-top: 30px;
}

#project-single-area .project-info .project-info-list li {
    border-bottom: 1px solid #f7f7f7;
    display: block;
    overflow: hidden;
    position: relative;
    line-height: 50px;
}

#project-single-area .project-info .project-info-list li .icon-holder {}

#project-single-area .project-info .project-info-list li .icon-holder i {
    font-size: 14px;
    color: #d1162b;
    display: inline-block;
    padding-right: 5px;
}

#project-single-area .project-info .project-info-list li .icon-holder span {
    font-size: 18px;
    color: #222222;
    font-weight: 600;
    font-family: 'Nunito', sans-serif;
}

#project-single-area .project-info .project-info-list li .text-holder p {
    margin: 0;
}

#project-single-area .project-description {
    padding-top: 40px;
    padding-bottom: 30px;
}

#project-single-area .project-manager {
    position: relative;
    background: #f7f7f7;
    display: block;
    padding: 17px 75px 21px;
    border-left: 1px solid #d1162b;
    margin-bottom: 40px;
}

#project-single-area .project-manager:before {
    position: absolute;
    top: 0;
    left: 1px;
    width: 1px;
    height: 80%;
    content: "";
    background: #d1162b;
}

#project-single-area .project-manager:after {
    content: "\f10d";
    font-family: FontAwesome;
    color: #e6e6e6;
    font-size: 25px;
    position: absolute;
    top: 25px;
    left: 40px;
}

#project-single-area .project-manager p {
    color: #848484;
    font-size: 18px;
    line-height: 30px;
    font-style: italic;
}

#project-single-area .project-manager h3 {
    color: #222222;
    font-size: 18px;
    font-weight: 700;
    margin: 10px 0 0;
}

#project-single-area .project-manager h3 span {
    color: #d1162b;
    font-size: 16px;
    font-weight: 300;
    font-family: 'Open Sans', sans-serif;
}


#project-single-area .social-share-box {
    overflow: hidden;
}

#project-single-area .social-share-box h3 {
    color: #222222;
    font-size: 20px;
    font-weight: 700;
    display: inline-block;
    float: left;
    padding-right: 20px;
    margin: 9px 0;
}

#project-single-area .social-share-box .social-links li {
    display: inline-block;
    float: left;
    margin-right: 10px;
}

#project-single-area .social-share-box .social-links li a i {
    background: #f7f7f7;
    width: 40px;
    height: 40px;
    display: block;
    text-align: center;
    color: #848484;
    font-size: 15px;
    border-radius: 50%;
    line-height: 40px;
    transition: all 500ms ease;
}

#project-single-area .social-share-box .social-links li a:hover i {
    background: #d1162b;
    color: #ffffff;
}


#project-single-area .bottom {
    border-bottom: 1px solid #f7f7f7;
    border-top: 1px solid #f7f7f7;
    margin: 50px 0 0;
    overflow: hidden;
    padding-bottom: 20px;
    padding-top: 21px;
}

#project-single-area .bottom .button a {
    color: #1c1c1c;
    font-size: 16px;
    font-weight: 700;
    text-transform: uppercase;
    transition: all 500ms ease;
}

#project-single-area .bottom .button a:hover {
    color: #d1162b;
}

#project-single-area .bottom .button a i {
    display: inline-block;
    font-size: 18px;
    padding-right: 10px;
    position: relative;
    top: 1px;
}

#project-single-area .bottom .button.next a i {
    padding-right: 0px;
    padding-left: 10px;
}

#project-single-area .bottom .icon-holder a i {
    color: #1c1c1c;
    font-size: 24px;
    position: relative;
    top: 4px;
    transition: all 500ms ease 0s;
}

#project-single-area .bottom .icon-holder a:hover i {
    color: #d1162b;
}

/* ===============================
   CONTACT MAP HEIGHT CONTROL
================================ */

#contact-google-map {
    width: 100%;
    height: 600px;   /* 🔥 increase height here */
    border: 0;
    display: block;
}

/* Tablet */
@media (max-width: 1024px) {
    #contact-google-map {
        height: 520px;
    }
}

/* Mobile */
@media (max-width: 768px) {
    #contact-google-map {
        height: 420px;
    }
}

/*** 
=============================================
    Get Touch Area style
=============================================
***/
.get-touch-area {
    padding-top: 100px;
    padding-bottom: 80px;
}

.get-touch-area .single-item {
    border: 1px solid #f4f4f4;
    display: block;
    padding: 39px 20px 32px;
}

.get-touch-area .single-item .icon-holder {
    padding-bottom: 25px;
}

.get-touch-area .single-item .icon-holder span:before {
    color: #d1162b;
    font-size: 50px;
    line-height: 50px;
}

.get-touch-area .single-item .text-holder {}

.get-touch-area .single-item .text-holder h3 {
    color: #000000;
    font-size: 20px;
    font-weight: 600;
    line-height: 18px;
}

.get-touch-area .single-item .text-holder .border {
    height: 1px;
    width: 60px;
    background: #f4f4f4;
    display: inline-block;
}

.get-touch-area .single-item .text-holder p {
    margin: 15px 0 0;
    color: #000000;
    font-weight: 600;
    text-align: center;
}

.get-touch-area .single-item .text-holder p a {
    color: #ff5353;
}
/* ==================================
   GLOBAL RESET & BODY
================================== */
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

body {
  background-color: #0b0f1a;
  color: #ffffff;
  font-family: inherit;
}

/* ==================================
   ENQUIRY FORM SECTION
================================== */
.enquiry-form-section {
  background-color: #0b0f1a;
  padding: 80px 0;
}

/* Container fix */
.enquiry-form-section .container,
.enquiry-form-section .row {
  background-color: transparent;
}

/* ==================================
   FORM CARD
================================== */
.enquiry-form-section .appoinment {
  background-color: #0b0f1a;
  padding: 36px;
  border-radius: 18px;
  border: 1px solid rgba(255,255,255,0.15);
}

/* ==================================
   TITLE
================================== */
.enquiry-form-section .sec-title {
  text-align: center;
  margin-bottom: 40px;
}

.enquiry-form-section .sec-title h1 {
  color: #ffffff;
  margin-bottom: 12px;
}

.enquiry-form-section .title-line {
  margin: 0 auto;
}

/* ==================================
   FORM GROUP
================================== */
.form-group {
  width: 100%;
  margin-bottom: 14px;
}

/* Labels */
.form-group label {
  display: block;
  margin-bottom: 4px;
  color: #ffffff;
  font-size: 14px;
  font-weight: 600;
}

/* Inputs / Select / Textarea */
.form-group input,
.form-group select,
.form-group textarea {
  width: 100%;
  padding: 14px 16px;
  border-radius: 10px;

  /* PURE COLOR — NO GRADIENT */
  background-color: #0b0f1a;

  border: 1px solid rgba(255,255,255,0.25);
  color: #ffffff;
  font-size: 14px;
  outline: none;
}

/* Textarea */
.form-group textarea {
  min-height: 160px;
  resize: vertical;
}

/* Placeholder */
.form-group input::placeholder,
.form-group textarea::placeholder {
  color: rgba(255,255,255,0.6);
}

/* Focus */
.form-group input:focus,
.form-group select:focus,
.form-group textarea:focus {
  border-color: #ff2a2a;
  box-shadow: 0 0 0 2px rgba(255,42,42,0.25);
}

/* Select dropdown */
.form-group select option {
  background-color: #0b0f1a;
  color: #ffffff;
}
/* ==================================
   BUTTON
================================== */
.enquire-btn {
  width: 100%;
  height: 56px;
  margin-top: 10px;

  background-color: #d1162b;   /* 🔴 BRAND RED */
  border: none;
  border-radius: 10px;

  color: #ffffff;
  font-size: 16px;
  font-weight: 700;

  cursor: pointer;
  transition: background-color 0.3s ease;
}

.enquire-btn:hover {
  background-color: #b91225;   /* 🔥 darker red on hover */
}


/* ==================================
   NOTE TEXT
================================== */
.form-note {
  margin-top: 12px;
  font-size: 14px;
  color: rgba(255,255,255,0.8);
}

/* ==================================
   BOOTSTRAP GRID FIXES
================================== */
.enquiry-form-section .appoinment-form .row {
gap: 16px !important;

}

.enquiry-form-section .col-md-4,
.enquiry-form-section .col-md-6,
.enquiry-form-section .col-md-8,
.enquiry-form-section .col-md-12 {
  margin-bottom: 12px;
}

/* ==================================
   MOBILE
================================== */
@media (max-width: 768px) {
  .enquiry-form-section {
    padding: 60px 0;
  }

  .enquiry-form-section .appoinment {
    padding: 28px;
  }
}

/*** 
=============================================
    Blog Grid Area style
=============================================
***/
.blog-grid-area {
    padding-top: 80px;
    padding-bottom: 80px;
}

.blog-grid-area .blog-post {}

.blog-grid-area .blog-post .single-blog-item {
    margin-bottom: 30px;
}

.blog-grid-area .blog-post .post-pagination {
    border-top: 1px solid #f4f4f4;
    padding-top: 50px;
    margin-top: 10px;
}

.sidebar-wrapper {
    position: relative;
    display: block;
    overflow: hidden;
}

.sidebar-wrapper .single-sidebar {
    overflow: hidden;
    margin-bottom: 50px;
    position: relative;
}

.sidebar-wrapper .single-sidebar .sec-title {
    overflow: hidden;
    padding-bottom: 25px;
    margin-top: -6px;
}

.sidebar-wrapper .single-sidebar .sec-title h3 {
    color: #222222;
    font-size: 22px;
    font-weight: 600;
    text-transform: capitalize;
    font-family: 'Nunito', sans-serif;
}

.sidebar-wrapper .single-sidebar form.search-form {
    position: relative
}

.sidebar-wrapper .single-sidebar .search-form input[type="text"] {
    background: #fff;
    border: 1px solid #f7f7f7;
    color: #ababab;
    display: block;
    font-size: 14px;
    font-weight: 500;
    height: 50px;
    letter-spacing: 1px;
    padding-left: 15px;
    padding-right: 55px;
    position: relative;
    -webkit-transition: all 500ms ease 0s;
    transition: all 500ms ease 0s;
    width: 100%;
}

.sidebar-wrapper .single-sidebar .search-form button {
    background: #f7f7f7 none repeat scroll 0 0;
    color: #333333;
    display: block;
    height: 50px;
    padding: 12px 0;
    position: absolute;
    right: 0;
    text-align: center;
    top: 0;
    -webkit-transition: all 500ms ease 0s;
    transition: all 500ms ease 0s;
    width: 50px;
}

.sidebar-wrapper .single-sidebar .search-form button i {
    font-size: 14px
}

.sidebar-wrapper .single-sidebar .search-form input[type="text"]:focus {
    border: 1px solid #d1162b;
    background: #fff;
    color: #000;
}

.sidebar-wrapper .single-sidebar .search-form input[type="text"]:focus+button,
.sidebar-wrapper .single-sidebar .search-form button:hover {
    background: #d1162b none repeat scroll 0 0;
    color: #ddd;
}

.single-sidebar .categories {
    background: #ffffff;
    display: block;
}

.single-sidebar .categories li {
    border-bottom: 1px solid #f4f4f4;
    margin-bottom: 12px;
    padding-bottom: 9px;
}

.single-sidebar .categories li:last-child {
    margin-bottom: 0;
}

.single-sidebar .categories li a {
    position: relative;
    padding-left: 25px;
    color: #848484;
    transition: all 500ms ease;
    font-size: 16px;
    font-weight: 300;
    font-family: 'Open Sans', sans-serif;
    position: relative;
}

.single-sidebar .categories li a:before {
    content: "\f114";
    font-family: FontAwesome;
    font-style: normal;
    font-weight: normal;
    text-decoration: inherit;
    color: #999999;
    font-size: 16px;
    position: absolute;
    top: -2px;
    left: 0;
    transition: all 500ms ease;
}

.single-sidebar .categories li a:hover:before {
    color: #d1162b;
}

.single-sidebar .categories li a:hover {
    color: #d1162b;
}

.single-sidebar .popular-post {}

.single-sidebar .popular-post li {
    margin-bottom: 25px;
    padding-bottom: 25px;
    padding-left: 75px;
    position: relative;
    border-bottom: 1px solid #f4f4f4;
}

.single-sidebar .popular-post li:last-child {
    margin-bottom: 0;
    padding-bottom: 0;
    border-bottom: none;
}

.single-sidebar .popular-post li .img-holder {
    display: block;
    left: 0;
    overflow: hidden;
    position: absolute;
    top: 0px;
    width: 75px;
    height: 75px;
    border-radius: 0%;
}

.single-sidebar .popular-post li .img-holder img {
    -webkit-transition: all 0.7s ease;
    transition: all 0.7s ease;
    width: auto;
}

.single-sidebar .popular-post li .img-holder .overlay-style-one .box .content a i {
    color: #fff;
    font-size: 16px;
    transition: all 500ms ease;
}

.single-sidebar .popular-post li:hover .img-holder .overlay-style-one {
    opacity: 1;
    -webkit-transform: perspective(400px) rotateX(0deg);
    -moz-transform: perspective(400px) rotateX(0deg);
    -ms-transform: perspective(400px) rotateX(0deg);
    -o-transform: perspective(400px) rotateX(0deg);
    transform: perspective(400px) rotateX(0deg);
}

.single-sidebar .popular-post li:hover .img-holder img {
    transform: scale(1.1);
}

.single-sidebar .popular-post li .img-holder .overlay-style-one .box .content a:hover i {
    color: #ddd;
}

.single-sidebar .popular-post li .title-holder {
    padding-left: 20px;
}

.single-sidebar .popular-post li .title-holder a .post-title {
    color: #222222;
    font-size: 16px;
    line-height: 24px;
    position: relative;
    font-weight: 700;
    margin: 0 0 7px;
    font-family: 'Nunito', sans-serif;
    transition: all 500ms ease;
}

.single-sidebar .popular-post li .title-holder a:hover .post-title {
    color: #d1162b;
}

.single-sidebar .popular-post li .title-holder .post-date {
    color: #d1162b;
    display: block;
    transition: all 500ms ease;
    font-weight: 400;
    font-size: 14px;
    font-family: 'Open Sans', sans-serif;
}

.single-sidebar .popular-tag {
    margin-left: -3px;
    margin-right: -3px;
    margin-top: -5px;
}

.single-sidebar .popular-tag li {
    display: inline-block;
    margin: 0 3px 10px;
}

.single-sidebar .popular-tag li a {
    border: 1px solid #f4f4f4;
    color: #848484;
    display: block;
    font-size: 16px;
    font-weight: 300;
    padding: 4px 12px 4px;
    font-family: 'Open Sans', sans-serif;
    transition: all 500ms ease 0s;
}

.single-sidebar .popular-tag li a:hover {
    background: #d1162b;
    border-color: #d1162b;
    color: #fff;
}

/*** 
=============================================
    Blog Large Area style
=============================================
***/
.blog-large-area {
    padding-top: 80px;
    padding-bottom: 80px;
}

.blog-large-area .blog-post {}

.blog-large-area .single-blog-item {
    margin-bottom: 50px;
}

.blog-large-area .single-blog-item .img-holder .overlay-style-one .box .content a i {
    width: 45px;
    height: 45px;
    border: 2px solid #ffffff;
    background: #000;
    font-size: 15px;
    line-height: 42px;
    transition: all 500ms ease;
}

.blog-large-area .single-blog-item .img-holder .overlay-style-one .box .content a:hover i {
    background: #d1162b;
    color: #ffffff;
}

.blog-large-area .single-blog-item .text-holder {}

.blog-large-area .single-blog-item .text-holder .blog-title {
    font-size: 24px;
    padding: 4px 0 0px;
    line-height: 30px;
}

.blog-large-area .single-blog-item .text-holder .meta-info {
    margin-top: 23px;
}

.blog-large-area .blog-post .post-pagination {}

.blog-large-area .sidebar-wrapper {}


/*** 
=============================================
    Blog Single Area style
=============================================
***/
.blog-single-area {
    padding-top: 80px;
    padding-bottom: 80px;
}

.blog-single-area .single-blog-item {
    margin-bottom: 33px;
}

.blog-single-area .sec-title h3 {
    font-size: 30px;
    color: #222222;
    font-family: 'Nunito', sans-serif;
    margin: 0 0 17px;
    line-height: 34px;
}

.blog-single-area .single-blog-item .text-holder {
    margin-top: 10px;
}

.blog-single-area .single-blog-item .img-holder img {
    transform: none;
}

.blog-single-area .single-blog-item .text-holder .blog-title {
    font-size: 24px;
    padding: 15px 0 15px;
}

.blog-single-area .single-blog-item .text-holder .blog-title:hover {
    color: #404040;
}

.blog-single-area .single-blog-item .text-holder .meta-info {
    overflow: hidden;
    padding-top: 0px;
    text-align: center;
    border-top: none;
    margin-top: 0;
    border-bottom: 1px solid #f4f4f4;
    padding-bottom: 15px;
}

.blog-single-area .single-blog-item .text-holder .text {
    margin-top: 25px;
}

.blog-single-area .single-blog-item .text-holder .text .mar-btm {
    margin-bottom: 10px;
}

.blog-single-area .project-manager {
    border-left: 3px solid #d1162b;
    padding-left: 30px;
    padding-top: 20px;
    padding-bottom: 20px;
    margin: 35px 0 40px;
}

.blog-single-area .project-manager p {
    margin: 0;
}

.blog-single-area .project-manager h3 {
    color: #222222;
    font-size: 20px;
    font-weight: 700;
    margin: 20px 0 0;
}

.blog-single-area .project-manager h3 span {
    color: #848484;
    font-weight: 300;
    font-style: italic;
}

.blog-single-area .middle-content-box {
    margin: 0px 0 33px;
    overflow: hidden;
}

.blog-single-area .middle-content-box .img-holder {
    width: 340px;
}

.blog-single-area .middle-content-box .img-holder,
.blog-single-area .middle-content-box .text-holder {
    display: table-cell;
    vertical-align: top;
}

.blog-single-area .middle-content-box .text-holder {
    padding-left: 30px;
    position: relative;
}

.blog-single-area .middle-content-box .text-holder h2 {
    color: #222;
    font-size: 24px;
    font-weight: 700;
    margin: 0px 0 10px;
}

.blog-single-area .middle-content-box .text-holder ul {
    margin-top: 20px;
}

.blog-single-area .middle-content-box .text-holder ul li {
    line-height: 36px;
}

.blog-single-area .middle-content-box .text-holder ul li i {
    display: inline-block;
    padding-right: 7px;
}

.blog-single-area .tag-social-share-box {
    overflow: hidden;
    padding-bottom: 0px;
    padding-top: 6px;
}

.blog-single-area .tag-social-share-box .tag p {
    color: #d1162b;
    font-size: 16px;
    margin: 0;
}

.blog-single-area .tag-social-share-box .tag p span {
    color: #222222;
    font-weight: 700;
    text-transform: capitalize;
    font-family: 'Nunito', sans-serif;
}

.blog-single-area .tag-social-share-box .social-share {}

.blog-single-area .tag-social-share-box .social-share h5 {
    color: #222222;
    display: inline-block;
    float: left;
    font-size: 16px;
    font-weight: 400;
    text-transform: capitalize;
    position: relative;
    top: 7px;
}

.blog-single-area .tag-social-share-box .social-share i {
    padding-left: 10px;
    display: inline-block;
}

.blog-single-area .tag-social-share-box .social-share .social-share-links {
    display: inline-block;
    float: left;
    margin-left: -3px;
    margin-right: -3px;
    padding-left: 20px;
    position: relative;
    top: -6px;
}

.blog-single-area .tag-social-share-box .social-share .social-share-links li {
    display: inline-block;
    margin: 0 3px;
}

.blog-single-area .tag-social-share-box .social-share .social-share-links li a i {
    border: 2px solid #f7f7f7;
    border-radius: 50%;
    color: #c1c1c1;
    font-size: 14px;
    height: 40px;
    line-height: 36px;
    padding: 0;
    text-align: center;
    transition: all 500ms ease 0s;
    width: 40px;
    transition: all 500ms ease;
}

.blog-single-area .tag-social-share-box .social-share .social-share-links li a:hover i {
    background: #d1162b;
    border-color: #d1162b;
    color: #fff;
}


.blog-single-area .author-box {
    background: #ffffff none repeat scroll 0 0;
    display: block;
    position: relative;
    margin-top: 60px;
}

.blog-single-area .author-box .img-holder {
    width: 85px;
}

.blog-single-area .author-box .img-holder,
.blog-single-area .author-box .text-holder {
    display: table-cell;
    vertical-align: top;
}

.blog-single-area .author-box .text-holder {
    padding-left: 30px;
}

.blog-single-area .author-box .text-holder h3 {
    color: #222222;
    font-size: 20px;
    font-weight: 700;
    margin: -2px 0 10px;
    text-transform: capitalize;
    font-family: 'Nunito', sans-serif;
}

.blog-single-area .author-box .text-holder p {}

.blog-single-area .author-box .text-holder .social-link {
    margin-left: -6px;
    margin-right: -6px;
    overflow: hidden;
}

.blog-single-area .author-box .text-holder .social-link li {
    display: inline-block;
    margin: 0 6px;
}

.blog-single-area .author-box .text-holder .social-link li a i {
    color: #9a9a9a;
    font-size: 14px;
    transition: all 500ms ease;
}

.blog-single-area .author-box .text-holder .social-link li a:hover i {
    color: #d1162b;
}

.blog-single-area .comment-box {
    overflow: hidden;
    padding-bottom: 50px;
    padding-top: 60px;
}

.blog-single-area .comment-box .single-comment-box {
    padding-left: 100px;
    position: relative;
    margin-bottom: 30px;
    border-bottom: 1px solid #f4f4f4;
    padding-bottom: 30px;
}

.blog-single-area .comment-box .single-comment-box .img-holder {
    left: 0;
    position: absolute;
    top: 0;
}

.blog-single-area .comment-box .single-comment-box .text-holder {
    margin-left: 20px;
    padding: 0px;
}

.blog-single-area .comment-box .single-comment-box .text-holder .top {
    overflow: hidden;
    padding-bottom: 8px;
}

.blog-single-area .comment-box .single-comment-box .text-holder .top .name h5 {
    color: #222222;
    font-size: 20px;
    font-weight: 700;
}

.blog-single-area .comment-box .single-comment-box .text-holder .top .review-box {
    position: relative;
    top: -3px;
    padding-left: 25px;
}

.blog-single-area .comment-box .single-comment-box .text-holder .top .review-box ul {
    margin-left: -0.5px;
    margin-right: -0.5px;
    overflow: hidden;
}

.blog-single-area .comment-box .single-comment-box .text-holder .top .review-box ul li {
    display: inline-block;
    margin: 0 0.5px;
}

.blog-single-area .comment-box .single-comment-box .text-holder .top .review-box ul li i {
    color: #d1162b;
    font-size: 14px;
}

.blog-single-area .comment-box .single-comment-box .text-holder .reply {
    color: #222222;
    font-size: 16px;
    font-weight: 700;
    font-family: 'Nunito', sans-serif;
}

.blog-single-area .add-comment-box {
    overflow: hidden;
}

.blog-single-area .add-comment-box .sec-title {
    padding-bottom: 32px;
}

.blog-single-area .add-comment-box .sec-title h1 {
    font-size: 24px;
}

.blog-single-area .add-comment-box .add-rating-box {
    padding-bottom: 17px;
}

.blog-single-area .add-comment-box .add-rating-box h4 {
    color: #9a9a9a;
    font-size: 16px;
    font-weight: 300;
    margin: 0 0 12px;
}

.blog-single-area .add-comment-box .add-rating-box ul {}

.blog-single-area .add-comment-box .add-rating-box ul li {
    border-right: 1px solid #ebebeb;
    display: inline-block;
    line-height: 20px;
    margin-right: 6px;
    padding-right: 10px;
}

.blog-single-area .add-comment-box .add-rating-box ul li:last-child {
    border-right: none;
    margin-right: 0;
    padding-right: 0;
}

.blog-single-area .add-comment-box .add-rating-box ul li a i {
    color: #d6d6d6;
    font-size: 12px;
}

.blog-single-area .add-comment-box .add-rating-box ul li a:hover i {
    color: #d1162b;
    transition: all 500ms ease;
}

.blog-single-area .add-comment-box #add-comment-form {}

.blog-single-area .add-comment-box #add-comment-form .field-label {
    color: #848484;
    display: block;
    font-size: 16px;
    font-weight: 400;
    padding: 0 0 2px;
}

.blog-single-area .add-comment-box #add-comment-form input[type="text"],
.blog-single-area .add-comment-box #add-comment-form input[type="email"],
.blog-single-area .add-comment-box #add-comment-form textarea {
    background: #f7f7f7 none repeat scroll 0 0;
    border: 1px solid transparent;
    display: block;
    font-size: 16px;
    font-weight: 400;
    height: 50px;
    padding: 0 15px;
    width: 100%;
    margin-bottom: 12px;
    transition: all 500ms ease;
}

.blog-single-area .add-comment-box #add-comment-form textarea {
    height: 100px;
    padding: 10px 15px;
    margin-bottom: 30px;
    transition: all 500ms ease;
}

.blog-single-area .add-comment-box #add-comment-form input[type="text"]:focus {
    border-color: #d1162b;
}

.blog-single-area .add-comment-box #add-comment-form input[type="email"]:focus {
    border-color: #d1162b;
}

.blog-single-area .add-comment-box #add-comment-form textarea:focus {
    border-color: #d1162b;
}

.blog-single-area .add-comment-box #add-comment-form button {
    padding: 11px 40px 9px;
    border: 2px solid #d1162b;
    background: #d1162b;
    color: #ffffff;
}

.blog-single-area .add-comment-box #add-comment-form button:hover {
    background: transparent;
    color: #d1162b;
}

/*** 
=============================================
    Shop Area style
=============================================
***/
.shop-area {
    padding-top: 80px;
    padding-bottom: 80px;
}

.shop-area .sidebar-wrapper .single-sidebar .sec-title {
    padding-bottom: 30px;
}

.shop-area .shop-content {
    overflow: hidden;
}

.shop-area .showing-result-shorting {
    overflow: hidden;
    padding-bottom: 20px;
}

.shop-area .showing-result-shorting .showing {}

.shop-area .showing-result-shorting .shorting {}

.shop-area .showing-result-shorting .showing p {
    color: #848484;
    font-size: 16px;
    font-weight: 400;
    margin: 5px 0;
}

.shop-area .post-pagination {
    margin-top: 20px;
}

.single-sidebar .price-ranger {}

.single-sidebar .price-ranger .ui-widget-content {
    background: #e5e5e5;
    border: none;
    height: 2px;
    position: relative;
}

.single-sidebar .price-ranger .ui-widget-content:before {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 1px;
    background: #f0f0f0;
    content: "";
}

.single-sidebar .price-ranger .ui-slider-handle {
    background: #d1162b none repeat scroll 0 0;
    border: 2px solid #252525;
    border-radius: 50%;
    height: 10px;
    margin-left: -4px;
    outline: medium none;
    width: 10px;
    cursor: pointer;
}

.single-sidebar .price-ranger .ui-slider-horizontal .ui-slider-handle {
    top: -4px;
}

.single-sidebar .price-ranger .ui-slider .ui-slider-range {
    background: #252525;
}

.single-sidebar .price-ranger #slider-range {
    margin-left: 4px;
    margin-right: 6px;
    margin-top: 0;
}

.single-sidebar .price-ranger .ranger-min-max-block {
    margin-bottom: 0px;
    margin-top: 30px;
    overflow: hidden;
}

.single-sidebar .price-ranger .ranger-min-max-block input {
    display: inline-block;
}

.single-sidebar .price-ranger .ranger-min-max-block input[type="submit"] {
    float: left;
    margin-right: 20px;
    padding: 6px 0px 5px;
    text-align: center;
    width: 80px;
    border: none;
    background: #d1162b;
    color: #fff;
    font-size: 15px;
    font-weight: 700;
    border-radius: 3px;
    transition: all 500ms ease;
}

.single-sidebar .price-ranger .ranger-min-max-block input[type="submit"]:hover {
    background: #d1162b;
}

.single-sidebar .price-ranger .ranger-min-max-block input[type="text"] {
    border: medium none;
    color: #999999;
    font-size: 14px;
    font-weight: 400;
    outline: medium none;
    text-align: right;
    width: 40px;
    margin: 6px 0 0;
}

.single-sidebar .price-ranger .ranger-min-max-block input[type='text'].max {}

.single-sidebar .price-ranger .ranger-min-max-block span {
    color: #999999;
    font-weight: 600;
    font-size: 16px;
}

.sidebar-wrapper .single-sidebar .popular-product {}

.sidebar-wrapper .single-sidebar .popular-product li {
    border-bottom: 1px solid #f7f7f7;
    margin-bottom: 25px;
    overflow: hidden;
    padding-bottom: 25px;
    padding-left: 70px;
    position: relative;
}

.sidebar-wrapper .single-sidebar .popular-product li:last-child {
    margin-bottom: 0px;
}

.sidebar-wrapper .single-sidebar .popular-product li .img-holder {
    display: block;
    overflow: hidden;
    position: absolute;
    width: 70px;
    min-height: 70px;
    top: 0;
    left: 0;
}

.sidebar-wrapper .single-sidebar .popular-product li .img-holder img {
    border: 1px solid #f5f4f3;
    transition: all 0.5s ease 0s;
    width: 100%;
}

.sidebar-wrapper .single-sidebar .popular-product li:hover .img-holder img {}

.sidebar-wrapper .single-sidebar .popular-product li .img-holder .overlay-style-one .box .content a i {
    opacity: 0;
    font-size: 16px;
    color: #fff;
    transition: all 500ms ease;
}

.sidebar-wrapper .single-sidebar .popular-product li .img-holder .overlay-style-one .box .content a:hover i {
    color: #d1162b;
}

.sidebar-wrapper .single-sidebar .popular-product li:hover .img-holder .overlay-style-one .box .content a i {
    opacity: 1;
}

.sidebar-wrapper .single-sidebar .popular-product li:hover .img-holder .overlay-style-one {
    opacity: 1;
    -webkit-transform: perspective(400px) rotateX(0deg);
    -moz-transform: perspective(400px) rotateX(0deg);
    -ms-transform: perspective(400px) rotateX(0deg);
    -o-transform: perspective(400px) rotateX(0deg);
    transform: perspective(400px) rotateX(0deg);
}

.sidebar-wrapper .single-sidebar .popular-product li .title-holder {
    padding-left: 20px;
}

.sidebar-wrapper .single-sidebar .popular-product li .title-holder a h4 {
    color: #404040;
    font-size: 16px;
    font-weight: 600;
    text-transform: capitalize;
    margin: 0 0 10px;
    transition: all 500ms ease;
}

.sidebar-wrapper .single-sidebar .popular-product li .title-holder h5 {
    color: #d1162b;
    font-size: 15px;
    font-weight: 400;
    text-transform: capitalize;
    font-family: 'Open Sans', sans-serif;
}

.sidebar-wrapper .single-sidebar .popular-product li .title-holder .review-box {
    line-height: 14px;
    margin: 10px 0 0;
}

.sidebar-wrapper .single-sidebar .popular-product li .title-holder .review-box li {
    display: inline-block;
    margin: 0 1px;
    position: static;
    padding: 0;
    border: none;
}

.sidebar-wrapper .single-sidebar .popular-product li .title-holder .review-box li i {
    font-size: 12px;
    color: #d1162b;
}

.sidebar-wrapper .single-sidebar .popular-product li .title-holder a:hover h4 {
    color: #d1162b;
}

.sidebar-wrapper .single-sidebar .product-tag {
    margin-left: -3px;
    margin-right: -3px;
    margin-top: -5px;
}

.sidebar-wrapper .single-sidebar .product-tag li {
    display: inline-block;
    margin: 0 3px 10px;
}

.sidebar-wrapper .single-sidebar .product-tag li a {
    border: 1px solid #f4f4f4;
    color: #888888;
    display: block;
    font-size: 14px;
    font-weight: 400;
    padding: 4px 10px 3px;
    font-family: 'Open Sans', sans-serif;
    transition: all 500ms ease 0s;
}

.sidebar-wrapper .single-sidebar .product-tag li a:hover {
    background: #d1162b;
    border-color: #d1162b;
    color: #fff;
}

/*** 
=============================================
    Checkout Area style
=============================================
***/
.checkout-area {
    padding-bottom: 80px;
    padding-top: 80px;
}

.checkout-area .sec-title {
    padding-bottom: 40px;
}

.checkout-area .sec-title h1 {
    color: #222;
    font-size: 24px;
    text-transform: none;
}

.checkout-area .exisitng-customer {
    background: #f7f7f7;
    display: block;
    padding: 20px 28px 21px;
    position: relative;
    margin-bottom: 20px;
}

.checkout-area .exisitng-customer:before {
    position: absolute;
    top: 0;
    left: 0;
    width: 2px;
    height: 100%;
    background: #d1162b;
    content: "";
}

.checkout-area .exisitng-customer h5 {
    color: #222222;
    font-size: 16px;
    font-weight: 400;
}

.checkout-area .exisitng-customer h5 a {
    color: #d1162b;
    display: inline-block;
    padding-left: 15px;
}

.checkout-area .coupon {
    background: #f7f7f7;
    display: block;
    padding: 20px 28px 21px;
    position: relative;
    margin-bottom: 60px;
}

.checkout-area .coupon:before {
    position: absolute;
    top: 0;
    left: 0;
    width: 2px;
    height: 100%;
    background: #d1162b;
    content: "";
}

.checkout-area .coupon h5 {
    color: #222222;
    font-size: 16px;
    font-weight: 400;
}

.checkout-area .coupon h5 a {
    color: #d1162b;
    display: inline-block;
    padding-left: 15px;
}

.checkout-area .form form .field-label {
    color: #222222;
    font-size: 16px;
    font-weight: 400;
    margin: 0 0 3px;
    text-transform: capitalize;
    font-family: 'Open Sans', sans-serif;
}

.checkout-area .form form .field-input input[type="text"] {
    border: 2px solid #f4f4f4;
    color: #999999;
    display: block;
    font-size: 14px;
    height: 48px;
    margin-bottom: 23px;
    padding: 0 15px;
    width: 100%;
    transition: all 500ms ease;
    -moz-transition: all 500ms ease;
    -webkit-transition: all 500ms ease;
    -ms-transition: all 500ms ease;
    -o-transition: all 500ms ease;
}

.checkout-area .form form .field-input input[type="text"]:focus {
    border: 2px solid #d1162b;
}

.checkout-area .create-acc .checkbox {
    margin: 7px 0 0;
}

.checkout-area .create-acc .checkbox label {
    color: #d1162b;
    font-weight: 400;
    font-size: 16px;
}

.checkout-area .create-acc .checkbox input {
    margin-top: 7px;
}

.checkout-area .shipping-info input[type="checkbox"] {
    cursor: pointer;
    display: inline-block;
    margin: 0 0 0 25px;
    position: relative;
    top: 0px;
    vertical-align: middle;
}

.checkout-area .form form .field-input textarea {
    border: 2px solid #f4f4f4;
    color: #999;
    display: block;
    font-size: 14px;
    height: 119px;
    padding: 10px 15px;
    width: 100%;
    transition: all 500ms ease;
    -moz-transition: all 500ms ease;
    -webkit-transition: all 500ms ease;
    -ms-transition: all 500ms ease;
    -o-transition: all 500ms ease;
}

.checkout-area .form form .field-input textarea:focus {
    border-color: #d1162b;
}

.checkout-area .bottom {
    padding-top: 60px
}

.checkout-area .table {
    overflow-x: auto;
    position: relative;
    width: 100%;
    margin-bottom: 0;
}

.checkout-area .table .cart-table {
    min-width: auto;
    width: 100%;
}

.checkout-area .table .cart-table .cart-header {
    background: #f7f7f7;
    color: #222222;
    font-size: 16px;
    position: relative;
    text-transform: capitalize;
    width: 100%;
    font-family: 'Nunito', sans-serif;
}

.checkout-area .table .cart-table thead tr th {
    font-weight: 400;
    line-height: 24px;
    min-width: 110px;
    padding: 19px 30px 17px;
}

.checkout-area .table .cart-table thead tr th.product-column {
    padding-left: 30px;
    text-align: left;
}

.checkout-area .table .cart-table tbody tr {
    border-bottom: 1px solid #f7f7f7;
}

.checkout-area .table .cart-table tbody tr td {
    vertical-align: middle
}

.checkout-area .table .cart-table tbody tr td {
    min-width: 110px;
    padding: 25px 20px;
}

.checkout-area .table .cart-table tbody tr .product-column .column-box {
    min-height: 70px;
}

.checkout-area .table .cart-table tbody tr .product-column .column-box .prod-thumb {
    width: 70px;
    border: 2px solid #f7f7f7;
    padding: 3px;
}

.checkout-area .table .cart-table tbody tr .product-column .column-box .prod-thumb img {
    display: block;
    max-width: 100%;
}

.checkout-area .table .cart-table tbody tr .product-column .column-box .prod-thumb,
.checkout-area .table .cart-table tbody tr .product-column .column-box .product-title {
    display: table-cell;
    vertical-align: middle;
}

.checkout-area .table .cart-table tbody tr .product-column .column-box .product-title {
    padding-left: 15px;
}

.checkout-area .table .cart-table tbody tr .product-column .column-box .product-title h3 {
    color: #222222;
    font-size: 16px;
    font-weight: 400;
    text-transform: capitalize;
    font-family: 'Nunito', sans-serif;
}

.checkout-area .table .cart-table tbody tr .qty {
    padding-right: 30px;
    width: 130px;
}

.checkout-area .table .cart-table tbody tr .qty .input-group.bootstrap-touchspin {
    float: right;
    width: 60px;
}

.checkout-area .table .cart-table tbody tr .qty .form-control {
    background-color: #fff;
    background-image: none;
    border: 1px solid #ccc;
    border-radius: 0;
    box-shadow: none;
    color: #252525;
    display: block;
    font-size: 18px;
    font-weight: 400;
    height: 34px;
    padding: 6px 0;
    text-align: center;
}

.checkout-area .table .cart-table tbody tr .qty .bootstrap-touchspin .input-group-btn-vertical .bootstrap-touchspin-up {
    border-radius: 0;
}

.checkout-area .table .cart-table tbody tr .qty .btn-default {
    background-color: #d1162b;
    border-color: #1b2b77;
    color: #fff;
}

.checkout-area .table .cart-table tbody tr .qty .bootstrap-touchspin .input-group-btn-vertical .bootstrap-touchspin-down {
    border-radius: 0;
    margin-top: -2px;
}

.checkout-area .table .cart-table tbody tr td.price {
    color: #d1162b;
    font-size: 18px;
    font-weight: 400;
}

.cart-total {

}

.cart-total-table {
    border: 2px solid #f7f7f7
}

.cart-total-table li {
    border-bottom: 1px solid #f7f7f7
}

.cart-total-table li:last-child {
    border-bottom: none
}

.cart-total-table li span.col.col-title {
    border-right: 1px solid #f7f7f7;
    color: #222222;
    display: block;
    float: left;
    font-size: 16px;
    font-weight: 400;
    line-height: 28px;
    padding: 10px 18px;
    position: relative;
    width: 50%;
    font-family: 'Nunito', sans-serif;
}

.cart-total-table li span.col {
    color: #999999;
    display: block;
    float: left;
    font-size: 16px;
    font-weight: 400;
    line-height: 28px;
    padding: 10px 18px;
    position: relative;
    width: 50%;
    font-family: 'Nunito', sans-serif;
}

.cart-total-table li span.col b {
    color: #d1162b;
    font-weight: 300;
    text-decoration: underline;
}

.cart-total .payment-options {
    background: #f7f7f7 none repeat scroll 0 0;
    margin-top: 30px;
    overflow: hidden;
    padding: 23px 20px 30px;
}

.cart-total .payment-options .option-block {
    margin-bottom: 14px
}

.cart-total .payment-options .option-block .checkbox {
    margin: 0 0 5px;
}

.cart-total .payment-options .option-block .checkbox label {
    font-weight: 700;
    min-height: 20px;
    padding-left: 20px;
}

.cart-total .payment-options .option-block .checkbox label input {
    position: relative;
    top: 1px;
}

.cart-total .payment-options .option-block .checkbox label span {
    color: #222222;
    font-size: 16px;
    padding-left: 10px;
    font-weight: 400;
    font-family: 'Poppins', sans-serif;
}

.cart-total .payment-options .option-block .checkbox label span b {
    color: #d1162b;
    display: inline-block;
    font-size: 14px;
    font-weight: 400;
    padding-left: 25px;
    text-decoration: underline;
}

.cart-total .payment-options .option-block .text {
    padding-left: 30px;
}

.cart-total .payment-options .option-block .text p {
    margin: 0;
    line-height: 28px;
}

.placeorder-button button {
    padding: 11px 40px 9px;
    margin-top: 20px;
    background: #d1162b;
    border: 2px solid #d1162b;
    color: #ffffff;
}

/*** 
=============================================
    Login Register Area style
=============================================
***/
.login-register-area {
    padding-bottom: 80px;
    padding-top: 80px;
}

.login-register-area .form .sec-title {
    padding-bottom: 40px;
}

.login-register-area .form .sec-title h1 {
    font-size: 24px;
    text-transform: none;
    margin: 0;
}

.login-register-area .form .input-field {
    position: relative;
}

.login-register-area .form .input-field input[type="text"] {
    border: 2px solid #f4f4f4;
    color: #777;
    font-size: 15px;
    height: 50px;
    margin-bottom: 30px;
    padding-left: 15px;
    padding-right: 50px;
    width: 100%;
    transition: all 700ms ease 0s;
}

.login-register-area .form .input-field .icon-holder {
    position: absolute;
    right: 20px;
    top: 11px;
}

.login-register-area .form .input-field .icon-holder i {
    color: #777;
    font-size: 14px;
    font-weight: 400;
}

.login-register-area .form button {
    margin-top: 10px;
    padding: 13px 35px 11px;
    background: #d1162b;
    border-radius: 5px;
    color: #ffffff;
}

.login-register-area .form button:hover {
    background: #303443;
}

.login-register-area .form .remember-text {
    margin-top: 19px;
}

.login-register-area .form .remember-text .checkbox label {
    color: #222222;
    font-size: 16px;
    font-weight: 400;
    font-family: 'Nunito', sans-serif;
}

.login-register-area .form .remember-text .checkbox input {
    margin-top: 5px;
}

.login-register-area .form .social-icon {
    float: right;
    margin-right: -8px;
    margin-top: 15px;
    position: relative;
}

.login-register-area .form .social-icon .login-with {
    display: inline-block;
    left: -100px;
    position: absolute;
    top: 8px;
}

.login-register-area .form .social-icon li {
    display: inline-block;
    margin: 0 8px;
}

.login-register-area .form .social-icon li a i {
    background: #3b5998 none repeat scroll 0 0;
    border-radius: 50%;
    color: #fff;
    display: block;
    font-size: 14px;
    font-weight: 100;
    height: 40px;
    line-height: 24px;
    padding: 8px 0;
    text-align: center;
    transition: all 700ms ease 0s;
    width: 40px;
}

.login-register-area .form .social-icon li a i.twitter {
    background: #33ccfe none repeat scroll 0 0;
}

.login-register-area .form .social-icon li a i.gplus {
    background: #dd4b39 none repeat scroll 0 0;
}

.login-register-area .form a.forgot-password {
    color: #d1162b;
    float: right;
    font-weight: 700;
    margin: 20px 0 0;
    font-family: 'Nunito', sans-serif;
}

.login-register-area .form h6 {
    color: #848484;
    float: left;
    font-size: 14px;
    font-family: 'Open Sans', sans-serif;
    padding-left: 10px;
    overflow: hidden;
    margin-left: -40px;
    margin-top: 28px;
}

.login-register-area .form .input-field input[type="text"]:focus {
    border: 2px solid #d1162b;
}

.login-register-area .form .social-icon li a:hover i {
    background: #18387b;
}

.login-register-area .form .social-icon li a:hover i.twitter {
    background: #12addf;
}

.login-register-area .form .social-icon li a:hover i.gplus {
    background: #c62d1a;
}

/*** 
=============================================
   Cart area  style
=============================================
***/
.cart-area {
    padding-bottom: 80px;
    padding-top: 80px;
}

.cart-area .sec-title {
    padding-bottom: 32px;
}

.cart-area .sec-title h1 {
    font-size: 24px;
    margin: 0;
}

.cart-area .table-outer {
    overflow-x: auto;
    position: relative;
    width: 100%;
}

.cart-area .cart-table {
    min-width: 1024px;
    width: 100%;
}

.cart-area .cart-table .cart-header {
    background: #f7f7f7;
    color: #222222;
    font-family: 'Nunito', sans-serif;
    font-size: 18px;
    position: relative;
    text-transform: capitalize;
    width: 100%;
}

.cart-area .cart-table thead tr th {
    font-weight: 700;
    line-height: 24px;
    min-width: 110px;
    padding: 20px 25px;
}

.cart-area .cart-table thead tr th.prod-column {
    padding-left: 30px;
    text-align: left;
}

.cart-area .cart-table thead tr th.availability {
    padding: 0 40px
}

.cart-area .cart-table tbody tr {
    border-bottom: 1px solid #f7f7f7;
}

.cart-area .cart-table tbody tr td {
    color: #999999;
    font-family: 'Open Sans', sans-serif;
    font-size: 14px;
    font-weight: 400;
    line-height: 20px;
    min-width: 100px;
    padding: 27.5px 25px;
}

.cart-area .cart-table tbody tr .prod-column .column-box {
    min-height: 70px;
    position: relative;
}

.cart-area .cart-table tbody tr .prod-column .column-box .prod-thumb {
    width: 70px;
    border: 2px solid #f7f7f7;
    padding: 3px;
}

.cart-area .cart-table tbody tr .prod-column .column-box .prod-thumb img {
    display: block;
    max-width: 100%;
}

.cart-area .cart-table tbody tr .prod-column .column-box .prod-thumb,
.cart-area .cart-table tbody tr .prod-column .column-box .title {
    display: table-cell;
    vertical-align: middle;
}

.cart-area .cart-table tbody tr .prod-column .column-box .title {
    padding-left: 20px;
}

.cart-area .cart-table tbody tr .prod-column .column-box .title h3 {
    color: #222222;
    font-size: 16px;
    font-weight: 600;
    text-transform: capitalize;
    font-family: 'Nunito', sans-serif;
}

.cart-area .cart-table tbody tr .qty {
    padding-right: 25px;
    width: 120px;
}

.cart-area .cart-table tbody tr .qty .input-group.bootstrap-touchspin {}

.cart-area .cart-table tbody tr .qty .bootstrap-touchspin .input-group-btn-vertical .bootstrap-touchspin-up {
    border-radius: 0;
    margin-left: 0;
    padding: 11px;
}

.cart-area .cart-table tbody tr .qty .btn-default {
    background-color: #e0dcdc;
    border-color: #ababab;
    color: #fff;
}

.cart-area .cart-table tbody tr .qty .bootstrap-touchspin .input-group-btn-vertical .bootstrap-touchspin-down {
    border-radius: 0;
    margin-left: 0;
    margin-top: -1px;
    padding: 10px;
}

.cart-area .cart-table tbody tr .qty .bootstrap-touchspin .input-group-btn-vertical i {
    font-size: 9px;
    left: 6px;
    top: 6px;
}

.cart-area .cart-table tbody tr td.unit-price {
    padding-left: 40px;
    padding-right: 20px;
}

.cart-area .cart-table tbody .available-info {
    color: #999999;
    font-size: 14px;
    font-weight: 400;
    line-height: 20px;
    padding-left: 50px;
    position: relative;
}

.cart-area .cart-table tbody .available-info .icon {
    background: #d1162b none repeat scroll 0 0;
    border-radius: 50%;
    color: #ffffff;
    font-size: 18px;
    height: 40px;
    left: 0;
    line-height: 40px;
    position: absolute;
    text-align: center;
    top: 0px;
    width: 40px;
}

.cart-area .cart-table tbody tr td.price {
    color: #999999;
    font-size: 18px;
    font-weight: 400;
}

.cart-area .cart-table tbody tr .sub-total {
    color: #d1162b;
    font-weight: 400;
    font-size: 18px;
}

.cart-area .cart-table tbody tr td .remove {}

.cart-area .cart-table tbody tr td .remove .checkbox label {
    color: #777;
    font-size: 16px;
    font-weight: 400;
}

.cart-area .cart-table tbody tr td .remove .checkbox label input[type="checkbox"] {
    display: inline-block;
    position: relative;
    top: 1px;
}

.cart-middle {
    padding-top: 30px
}

.cart-middle .apply-coupon {
    padding-left: 245px;
    position: relative;
}

.cart-middle .apply-coupon input[type="text"] {
    border: 2px solid #f7f7f7;
    color: #777;
    font-size: 14px;
    font-weight: 400;
    height: 50px;
    left: 0;
    padding: 0 15px;
    position: absolute;
    text-transform: capitalize;
    top: 0;
    transition: all 500ms ease 0s;
    width: 225px;
}

.cart-middle .apply-coupon input[type="text"]:focus {
    border: 2px solid #d1162b;
}

.cart-middle .apply-coupon .apply-coupon-button button {
    padding: 13px 45px 11px;
    background: #d1162b;
    color: #ffffff;
    border-radius: 4px;
}

.cart-middle .apply-coupon .apply-coupon-button button:hover {
    background: #122372;
    color: #dddddd;
}

.cart-middle .update-cart button {
    padding: 13px 45px 11px;
    background: #f7f7f7;
    color: #222222;
    border-radius: 4px;
}

.cart-middle .update-cart button:hover {
    background: #d1162b;
    color: #fff;
}

.cart-bottom {
    overflow: hidden;
    padding-top: 76px;
}

.cart-bottom .calculate-shipping {}

.cart-bottom .calculate-shipping .ui-state-default .ui-icon {}

.cart-bottom .calculate-shipping .ui-selectmenu-button span.ui-icon {
    border-left: 2px solid #f7f7f7;
    display: block;
    float: right;
    height: 41px;
    text-indent: 0;
    top: 8px;
    width: 45px;
    position: absolute;
    right: 0;
    display: block;
    background-image: none;
}

.cart-bottom .calculate-shipping .ui-selectmenu-button span.ui-icon::before {
    color: #ababae;
    content: "\f107";
    font-family: FontAwesome;
    font-size: 20px;
    overflow: visible;
    position: absolute;
    right: 14px;
    top: 8px;
}

.cart-bottom .calculate-shipping .ui-selectmenu-button span.ui-selectmenu-text {
    display: block;
    line-height: 18px;
    overflow: hidden;
    padding: 12px 17px;
    text-align: left;
}

.cart-bottom .calculate-shipping input[type="text"] {
    border: 2px solid #f7f7f7;
    color: #777;
    display: block;
    font-size: 14px;
    height: 45px;
    padding: 0 18px;
    width: 100%;
    font-weight: 400;
    margin-bottom: 30px;
    transition: all 500ms ease;
    -moz-transition: all 500ms ease;
    -webkit-transition: all 500ms ease;
    -ms-transition: all 500ms ease;
    -o-transition: all 500ms ease;
}

.cart-bottom .calculate-shipping input[type="text"]:focus {
    border: 2px solid #d1162b;
}

.cart-bottom .calculate-shipping button {
    padding: 13px 40px 11px;
    background: #f7f7f7;
    border-color: #f7f7f7;
    color: #222222;
    border-radius: 4px;
}

.cart-bottom .calculate-shipping button:hover {
    background: #303443;
    color: #ffffff;
}

.cart-bottom button.checkout-btn {
    padding: 13px 40px 11px;
    margin-top: 30px;
    float: right;
    border-radius: 4px;
    background: #d1162b;
    color: #ffffff;
}

.cart-bottom button.checkout-btn:hover {
    background: #0f1d5d;
    color: #dddddd;
}

/*** 
=============================================
   Single Shop Area style
=============================================
***/
.single-shop-area {
    padding-top: 80px;
    padding-bottom: 40px;
}

.single-shop-content .img-holder {
    margin-right: 50px;
}

.single-shop-content .img-holder img {
    border: 1px solid #f5f4f3;
}

.single-shop-content .content-box {
    margin-left: -50px;
}

.single-shop-content .content-box h3 {
    color: #222222;
    font-size: 24px;
    font-weight: 400;
    margin: 0 0 8px;
    text-transform: capitalize;
}

.single-shop-content .content-box .review-box {
    margin: 0 0 15px;
}

.single-shop-content .content-box .review-box ul {}

.single-shop-content .content-box .review-box ul li {}

.single-shop-content .content-box .review-box ul li i {
    color: #d1162b;
    font-size: 15px;
}

.single-shop-content .content-box span.price {
    color: #d1162b;
    font-size: 22px;
    font-weight: 400;
    font-family: 'Open Sans', sans-serif;
}

.single-shop-content .content-box .text {
    overflow: hidden;
    padding: 21px 0 9px;
}

.single-shop-content .content-box .location-box {
    margin: 4px 0 20px;
}

.single-shop-content .content-box .location-box p {
    color: #222222;
    font-size: 16px;
    font-weight: 400;
    margin: 0 0 12px;
}

.single-shop-content .content-box .location-box form input {
    border: 2px solid #f7f7f7;
    height: 40px;
    padding-left: 10px;
    padding-right: 10px;
    width: 170px;
    transition: all 500ms ease;
    margin: 0 0 15px;
}

.single-shop-content .content-box .location-box form input:focus {
    border-color: #d1162b;
}

.single-shop-content .content-box .location-box form button {
    background: #f7f7f7 none repeat scroll 0 0;
    border: medium none;
    color: #252525;
    font-size: 14px;
    font-weight: 700;
    height: 40px;
    margin-left: 6px;
    padding: 0;
    text-align: center;
    text-transform: uppercase;
    transition: all 500ms ease 0s;
    width: 95px;
    position: relative;
    top: 0px;
    padding-top: 2px;
}

.single-shop-content .content-box .location-box form button:hover {
    background: #d1162b;
    color: #fff;
}

.single-shop-content .content-box .location-box form span {
    color: #d1162b;
}

.single-shop-content .content-box .addto-cart-box {}

.single-shop-content .content-box .addto-cart-box .input-group.bootstrap-touchspin {
    float: left;
    width: 70px;
}

.single-shop-content .content-box .addto-cart-box .bootstrap-touchspin .input-group-btn-vertical .bootstrap-touchspin-up {
    border-radius: 0
}

.single-shop-content .content-box .addto-cart-box .bootstrap-touchspin .input-group-btn-vertical .bootstrap-touchspin-down {
    border-radius: 0;
    margin-top: -2px;
}

.single-shop-content .content-box .addto-cart-box .bootstrap-touchspin .input-group-btn-vertical>.btn {
    display: block;
    float: none;
    margin-left: -1px;
    max-width: 100%;
    padding: 12px 12px;
    position: relative;
    width: 100%;
}

.single-shop-content .content-box .addto-cart-box .btn-default {
    background-color: #efefef;
    border-color: #efefef;
    color: #9e9e9e;
}

.single-shop-content .content-box .addto-cart-box .bootstrap-touchspin .input-group-btn-vertical i {
    color: #9e9e9e;
    font-weight: normal;
    left: 8px;
    position: absolute;
    top: 7px;
}

.single-shop-content .content-box .addto-cart-box button.addtocart {
    margin-left: 95px;
    padding: 13px 30px 11px;
    border-radius: 4px;
    background: #d1162b;
    color: #ffffff;
}

.single-shop-content .content-box .addto-cart-box button.addtocart:hover {
    background: #0e1a51;
}


.product-tab-box {
    border: 1px solid #ececec;
    border-top: none;
    border-right: none;
    border-left: none;
    overflow: hidden;
    margin-top: 80px;
}

.product-tab-box .tab-menu {
    border-bottom: 1px solid #ececec;
    margin-bottom: 30px;
}

.product-tab-box .tab-menu li {
    display: inline-block;
    float: left;
    margin-bottom: -1px;
    margin-right: 3px;
}

.product-tab-box .tab-menu li a {
    background: #f7f7f7;
    border-top: 1px solid #ececec;
    border-left: 1px solid #ececec;
    border-right: 1px solid #ececec;
    border-bottom: 1px solid transparent;
    border-radius: 0;
    display: block;
    margin-right: 1px;
    padding: 15px 30px 13px;
    color: #222222;
    font-size: 16px;
    font-weight: 600;
    text-transform: capitalize;
    background: #f7f7f7;
    transition: all 500ms ease;
}

.product-tab-box .tab-menu li.active a,
.product-tab-box .tab-menu li:hover a {
    background: #ffffff;
    color: #d1162b;
    border-left-color: #ececec;
    border-top-color: #ececec;
    border-right-color: #ececec;
}

.product-tab-box .tab-content {
    border-left: 1px solid #ececec;
    border-right: 1px solid #ececec;
    margin-top: -30px;
    padding: 30px 30px 40px;
}

.product-tab-box .tab-content .review-box {}

.product-tab-box .tab-content .review-box .title {
    margin-top: 3px;
    padding-bottom: 25px;
}

.product-tab-box .tab-content .review-box .title h3 {
    color: #3d3d3d;
    font-size: 20px;
    font-weight: 400;
    text-transform: capitalize;
}

.product-tab-box .tab-content .review-box .single-review-box {
    margin-bottom: 30px;
    padding-left: 60px;
    position: relative;
}

.product-tab-box .tab-content .review-box .single-review-box .img-holder {
    left: 0;
    position: absolute;
    top: 0;
}

.product-tab-box .tab-content .review-box .single-review-box .text-holder {
    border: 1px solid #ececec;
    margin-left: 20px;
    padding: 17px 20px 12px;
}

.product-tab-box .tab-content .review-box .single-review-box .text-holder .top {
    margin: 0 0 10px;
    overflow: hidden;
}

.product-tab-box .tab-content .review-box .single-review-box .text-holder .top .name h4 {
    color: #3d3d3d;
    font-size: 16px;
    font-weight: 400;
    margin: 0;
    text-transform: capitalize;
}

.product-tab-box .tab-content .review-box .single-review-box .text-holder .top .review-box ul {
    margin-top: -2px;
    padding-left: 0px;
    position: relative;
}

.product-tab-box .tab-content .review-box .single-review-box .text-holder .top .review-box ul li {
    display: inline-block;
    margin-right: 1px;
}

.product-tab-box .tab-content .review-box .single-review-box .text-holder .top .review-box ul li i {
    color: #d1162b;
    font-size: 14px;
}

.product-tab-box .tab-content .review-box .single-review-box .text-holder .text p {
    margin: 0;
}

.product-tab-box .tab-content .review-form .title {}

.product-tab-box .tab-content .review-form .title h3 {
    margin: 0 0 15px;
}

.product-tab-box .tab-content .review-form .add-rating-box {
    margin: 0 0 20px;
}

.product-tab-box .tab-content .review-form .add-rating-box .add-rating-title h4 {
    color: #848484;
    font-size: 16px;
    font-weight: 400;
    margin: 0 0 10px;
    font-family: 'Open Sans', sans-serif;
    text-transform: none;
}

.product-tab-box .tab-content .review-form .add-rating-box ul li {
    border-right: 1px solid #ebebeb;
    display: inline-block;
    line-height: 20px;
    margin-right: 10px;
    padding-right: 10px;
}

.product-tab-box .tab-content .review-form .add-rating-box ul li:last-child {
    margin-right: 0px;
    padding-right: 0px;
    border-right: 0px solid #ebebeb;
}

.product-tab-box .tab-content .review-form .add-rating-box ul li a i {
    color: #d6d6d6;
    font-size: 12px;
    line-height: 20px;
    margin-right: 1px;
    opacity: 0.9;
    transition: all 500ms ease 0s;
}

.product-tab-box .tab-content .review-form form .field-label p {
    color: #848484;
    font-size: 16px;
    font-weight: 400;
    margin: 0 0 3px;
}

.product-tab-box .tab-content .review-form form input[type="text"],
.product-tab-box .tab-content .review-form form input[type="email"],
.product-tab-box .tab-content .review-form form textarea {
    background: #fff;
    height: 50px;
    width: 100%;
    border: 1px solid #ececec;
    color: #252525;
    font-size: 14px;
    padding: 0 15px;
    margin-bottom: 20px;
    transition: all 500ms ease;
}

.product-tab-box .tab-content .review-form form textarea {
    height: 110px;
    padding: 10px 15px;
    margin-bottom: 25px;
}

.product-tab-box .tab-content .review-form form button {
    padding: 11px 35px 9px;
    background: #d1162b;
    border-radius: 4px;
    color: #ffffff;
}

.product-tab-box .tab-content .review-form form button:hover {}

.product-tab-box .tab-content .review-form .add-rating-box ul li:hover a i {
    opacity: 1;
    color: #d1162b;
}

.product-tab-box .tab-content .review-form form input[type="text"]:focus {
    border-color: #d1162b;
}

.product-tab-box .tab-content .review-form form input[type="email"]:focus {
    border-color: #d1162b;
}

.product-tab-box .tab-content .review-form form textarea:focus {
    border-color: #d1162b;
}

.related-product {
    padding-top: 70px;
}

.related-product .sec-title {
    padding-bottom: 40px;
}

.related-product .single-product-item {}

.single-shop-area .sidebar-wrapper .single-sidebar .sec-title {
    overflow: hidden;
    padding-bottom: 30px;
}

/*** 
=============================================
    Callto action area bottom style
=============================================
***/
.callto-action-area .bottom {
    padding-top: 60px;
}

.callto-action-area .border {
    margin-top: 50px;
    margin-bottom: 0;
}

.callto-action-area .bottom .single-item {
    border: 1px solid #f4f4f4;
    display: block;
    padding: 30px 20px 22px;
}

.callto-action-area .bottom .single-item .year {
    border: 1px solid #f4f4f4;
    display: inline-block;
    overflow: hidden;
    padding: 8px 23px 5px;
}

.callto-action-area .bottom .single-item .year h3 {
    color: #404040;
    font-size: 20px;
    font-weight: 600;
}

.callto-action-area .bottom .single-item h4 {
    color: #404040;
    font-size: 18px;
    font-weight: 600;
    margin: 19px 0 15px;
}

.callto-action-area .bottom .single-item .readmore {
    color: #949494;
    font-size: 14px;
    font-weight: 700;
    text-transform: uppercase;
    transition: all 500ms ease;
}

.callto-action-area .bottom .single-item .readmore i {
    display: inline-block;
    padding-left: 10px;
    font-size: 16px;
}

.callto-action-area .bottom .single-item:hover .readmore {
    color: #2acb35;
}



/*** 
=============================================
    Main Project Area style
=============================================
***/
.main-project-area {
    padding-top: 80px;
    padding-bottom: 80px;
}

.main-project-area .single-project-item {
    margin-bottom: 30px;
}

.single-project-item {
    position: relative;
    overflow: hidden;
    display: block;
}

.single-project-item .img-holder {
    display: block;
    overflow: hidden;
    position: relative;
}

.single-project-item .img-holder img {
    transform: scale(1.1, 1.1);
    transition: all 0.5s ease 0s;
    width: 100%;
}

.single-project-item:hover .img-holder img {
    transform: scale(1, 1);
}

.single-project-item:hover .img-holder .overlay-style-one {
    opacity: 1;
    -webkit-transform: perspective(400px) rotateX(0deg);
    -moz-transform: perspective(400px) rotateX(0deg);
    -ms-transform: perspective(400px) rotateX(0deg);
    -o-transform: perspective(400px) rotateX(0deg);
    transform: perspective(400px) rotateX(0deg);
}

.single-project-item .img-holder .overlay-style-one .box .content a.zoom i {
    font-size: 18px;
    transition: all 500ms ease;
    width: 45px;
    height: 45px;
    background: #ffffff;
    color: #252525;
    display: inline-block;
    border-radius: 3px;
    line-height: 42px;
    border: 2px solid #ffffff;
}

.single-project-item .img-holder .overlay-style-one .box .content a.zoom i:hover {
    background: transparent;
    color: #ffffff;
}

.single-project-item .img-holder .overlay-style-one .box .content .bottom {
    position: absolute;
    bottom: 23px;
    left: 30px;
    text-align: left;
}

.single-project-item .img-holder .overlay-style-one .box .content .bottom a {
    color: #ffffff;
    font-size: 20px;
    font-weight: 600;
}

.single-project-item .img-holder .overlay-style-one .box .content .bottom p {
    color: #ffffff;
    font-size: 16px;
    font-weight: 300;
    margin: 0;
}



#ui-datepicker-div.ui-widget-content {
    border: 1px solid #c5c5c5;
    background: #fff none repeat scroll 0 0;
    border: 1px solid #777;
    color: #252525;
    font-family: 'Nunito', sans-serif;
    font-size: 14px;
    border-radius: 0px;
    width: 270px;
    padding: 5px;
    text-align: center;
}

#ui-datepicker-div.ui-datepicker .ui-datepicker-header {
    background: #d1162b none repeat scroll 0 0;
    border: 2px solid #252525;
    border-radius: 0;
    color: #fff;
    font-weight: 700;
    padding: 5px 0;
    position: relative;
}

.ui-datepicker .ui-datepicker-prev {
    left: 5px;
}

.ui-datepicker .ui-datepicker-prev,
.ui-datepicker .ui-datepicker-next {
    border-radius: 30%;
    height: 20px;
    position: absolute;
    top: 7px;
    width: 20px;
    transition: all 500ms ease;
    cursor: pointer;
}

.ui-datepicker .ui-datepicker-next {
    right: 5px;
}

.ui-datepicker .ui-datepicker-prev:hover,
.ui-datepicker .ui-datepicker-next:hover {
    top: 7px;
    background: #fff;
    border: none;
}

.ui-datepicker table {
    border-collapse: collapse;
    font-size: 13px;
    margin: 0 0 0.4em;
    width: 100%;
}

.ui-datepicker th {
    border: medium none;
    font-weight: 600;
    padding: 2px 3px;
    text-align: center;
}

.ui-datepicker-calendar .ui-state-default {
    text-align: center;
}

#ui-datepicker-div .ui-state-highlight {
    border: 1px solid #d3d3d3;
    background: #ffffff;
}

#ui-datepicker-div .ui-state-default {
    border: 1px solid #d3d3d3;
    background: #ffffff;
}

#ui-datepicker-div .ui-datepicker-calendar .ui-state-default:hover,
#ui-datepicker-div .ui-datepicker-calendar .ui-state-default:active {
    background: #d1162b;
    color: #fff;
    border-color: #d1162b;
}
/* ===============================
   WHATSAPP FLOAT (MASTER)
================================ */
.float {
  --fab-size: clamp(38px, 3.8vw, 46px);
  --fab-right: 32px;
  --fab-bottom: 24px;
  --fab-gap: 14px;

  position: fixed;
  width: var(--fab-size);
  height: var(--fab-size);
  right: var(--fab-right);
  bottom: calc(var(--fab-bottom) + var(--fab-size) + var(--fab-gap) + env(safe-area-inset-bottom, 0px));
  background-color: #25d366;
  border-radius: 999px;
  box-shadow: 0 10px 25px rgba(0,0,0,.25);
  z-index: 10001;

  display: flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  -webkit-tap-highlight-color: transparent;

  transition: transform .2s ease, box-shadow .2s ease, filter .2s ease;
}

.float i {
  color: #fff;
  font-size: clamp(16px, 1.7vw, 22px);
  line-height: 1;
}

.float:hover {
  transform: translateY(-2px);
  box-shadow: 0 14px 30px rgba(0,0,0,.28);
}

.float:active {
  transform: translateY(0);
  filter: brightness(0.98);
}

/* ===============================
   BACK TO TOP (MASTER)
================================ */
.backtotop-wrap{
  --fab-size: clamp(38px, 3.8vw, 46px);
  --fab-right: 32px;
  --fab-bottom: 24px;

  position: fixed;
  width: var(--fab-size);
  height: var(--fab-size);
  right: var(--fab-right);
  bottom: calc(var(--fab-bottom) + env(safe-area-inset-bottom, 0px));
  border-radius: 50%;
  background: #d11a2a;
  box-shadow: 0 10px 25px rgba(0,0,0,.25);
  z-index: 10000;

  display: flex;
  align-items: center;
  justify-content: center;

  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  -webkit-tap-highlight-color: transparent;
  transition: opacity .25s ease, transform .25s ease, box-shadow .2s ease;
}

.backtotop-wrap.show{
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}

.backtotop-wrap::before{
  content: "↑";
  color: #fff;
  font-size: clamp(14px, 1.6vw, 18px);
  font-weight: 900;
  line-height: 1;

  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  margin: 0;
}

.backtotop-wrap:hover{
  transform: translateY(-2px);
  box-shadow: 0 14px 30px rgba(0,0,0,.28);
}

.backtotop-wrap:active{
  transform: translateY(0);
}

@media (max-width: 576px) {

  .float {
    --fab-right: 26px;
    --fab-bottom: 18px;
    --fab-gap: 12px;
  }

  .backtotop-wrap {
    --fab-right: 26px;
    --fab-bottom: 18px;
  }
}
@media (min-width: 768px) and (max-width: 1024px) {

  .float {
    --fab-right: 30px;
    --fab-bottom: 20px;
    --fab-gap: 12px;
    
  }

  .backtotop-wrap {
    --fab-right: 30px;
    --fab-bottom: 20px;

  }
}




.google-reviews-footer {
    margin-top: 20px;
    padding-top: 15px;
    border-top: 1px solid rgba(255,255,255,0.15);
}

.google-reviews-footer a {
    display: flex;
    align-items: center;
    gap: 10px;
    text-decoration: none;
    color: #fff;
}

.google-logo {
    width: 60px;
    background: #fff;
    padding: 4px 6px;
    border-radius: 4px;
}
.google-map-review-btn {
  display: flex;
  flex-direction: column;
  gap: 6px;
  background: #ffffff;
  padding: 12px 16px;
  border-radius: 8px;
  text-decoration: none;
  color: #000;
}

.google-top-text {
  font-size: 13px;
  font-weight: 600;
  color: #555;
}

.google-review-row {
  display: flex;
  align-items: center;
  gap: 8px;
}

.google-icon {
  width: 22px !important;
  max-width: 22px !important;
}

.google-text {
  font-size: 14px;
  font-weight: 600;
  color: #fbbc05;
}


.rating-text strong {
    font-size: 16px;
    display: block;
}

.rating-text span {
    font-size: 13px;
    opacity: 0.85;
}
.footer-brand-logos {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-top: -50px;
    margin-bottom: 10px;
}

/* First logo (RTHS / main brand) */
.footer-brand-logos .logo-primary {
    height: 70px;     /* bigger */
    width: auto;
    opacity: 0.95;
}

/* Second logo (ISO / partner / certification) */
.footer-brand-logos .logo-secondary {
    height: 120px;     /* smaller */
    width: auto;
    opacity: 0.85;
}

/* Optional hover polish */
.footer-brand-logos img:hover {
    opacity: 1;
    transform: scale(1.05);
    transition: 0.3s ease;
}

/* Remove top space above footer logo column */
.footer-area .single-footer-widget.martop-minus {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* FOOTER LOGO FIX - left aligned */
.footer-area .footer-logo {
    margin: 0;
    padding: 0;
    text-align: left;
}

/* Anchor cleanup */
.footer-area .footer-logo a {
    display: inline-block;
    padding: 0;
    margin: 0;
}

/* RTHS logo size & spacing */
.footer-area .footer-logo img {
    height: 70px;       /* 🔥 increase logo height here */
    width: auto;
    display: block;
    margin: 0;          /* remove all around space */
    padding: 0;
}
@media (max-width: 768px) {
    .footer-area .footer-logo img {
        height: 50px;
    }
}

/* SECTION */
.map-form-section{
  position: relative;
  width: 100%;
  height: 520px;           /* overall section height */
  overflow: hidden;
}

/* MAP BACKGROUND */
.map-form-section .map-bg{
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
  filter: grayscale(100%); /* optional like your screenshot */
}

/* OVERLAY LAYER */
.map-form-section .map-overlay{
  position: absolute;
  inset: 0;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  padding: 60px 15px;
  z-index: 2;
}

/* FORM CARD */
.map-form-section .map-card{
  width: min(980px, 92%);
  background: rgba(255,255,255,0.96);
  border-radius: 10px;
  padding: 28px 28px 22px;
  box-shadow: 0 18px 60px rgba(0,0,0,0.25);
}

.map-form-section .map-card h2{
  text-align: center;
  font-size: 28px;
  font-weight: 700;
  margin: 0 0 18px;
}

/* FORM */
.contact-overlay-form{
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.contact-overlay-form input,
.contact-overlay-form textarea{
  width: 100%;
  padding: 14px 14px;
  border: 1px solid #ddd;
  border-radius: 6px;
  font-size: 15px;
  outline: none;
}

.contact-overlay-form textarea{
  resize: none;
}

.contact-overlay-form .row-2{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
}

/* BUTTON */
.contact-overlay-form button{
  width: 260px;
  margin: 10px auto 0;
  padding: 13px 18px;
  border: 0;
  border-radius: 6px;
  background: #0b5dbb; /* like your screenshot button */
  color: #fff;
  font-size: 16px;
  font-weight: 600;
  cursor: pointer;
}

.contact-overlay-form button:hover{
  opacity: 0.92;
}

/* ✅ MOBILE RESPONSIVE */
@media(max-width: 768px){
  .map-form-section{
    height: 620px;
  }

  .map-form-section .map-overlay{
    padding: 35px 12px;
  }

  .map-form-section .map-card{
    padding: 18px;
    width: 94%;
  }

  .contact-overlay-form .row-2{
    grid-template-columns: 1fr; /* stack fields */
  }

  .contact-overlay-form button{
    width: 100%;
  }
}
.map-form-section {
    position: relative;
    width: 100%;
    height: 700px; /* adjust height if needed */
    overflow: hidden;
}

.map-form-section iframe {
    width: 100%;
    height: 100%;
    border: 0;

    /* Black & White Effect */
    filter: grayscale(100%) contrast(1.1) brightness(0.9);
}


/* REMOVE CENTER LOADING / SPINNER */
.loader,
.loading,
.preloader,
.rs-loader,
.rs-loading,
.spinner,
.swiper-preloader,
.swiper-lazy-preloader {
    display: none !important;
}

/* ===== Core Values section text should be black ===== */
.service-area {
    background: #ffffff;
}

.service-area .sec-title h1 {
    color: #000000;
}

.service-area .sec-title .border:before,
.service-area .sec-title .border:after {
    background: #000000;
}

.service-area .single-service-item .text-holder h3 {
    color: #000000;
}

.service-area .single-service-item .text-holder p {
    color: #000000;
}

/* =====================================
   iPAD RESPONSIVE FIX (768px–1024px)
===================================== */

/* Target all iPads (portrait + landscape) */
@media only screen 
and (min-width: 768px) 
and (max-width: 1024px) {

  /* Prevent horizontal scroll */
  html, body {
    overflow-x: hidden;
  }

  /* Container width control */
  .container {
    width: 94%;
    max-width: 100%;
  }

  

  /* ===============================
     SECTIONS & HEADINGS
  =============================== */

 
  h1 { font-size: 34px; }
  h2 { font-size: 28px; font-weight: 700; }
  h3 { font-size: 22px; }

  /* ===============================
     GRID / CARDS (Brands, Services)
  =============================== */

  .brand-grid,
  .grid-4,
  .grid-3 {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 24px;
  }

  .single-item {
    height: auto; /* remove fixed height on iPad */
    padding: 22px;
  }

  /* ===============================
     FORMS (Enquiry / Contact)
  =============================== */

  .appoinment {
    padding: 30px 28px;
  }

  .input-box input,
  .input-box select,
  textarea {
    height: 48px;
    font-size: 15px;
  }

  textarea {
    min-height: 140px; /* better description box */
  }

  /* ===============================
     MAP SECTION
  =============================== */

  .map-section iframe,
  .contact-map iframe {
    width: 100%;
    height: 380px;
  }

  /* ===============================
     FOOTER
  =============================== */

  .footer-area .col-lg-3,
  .footer-area .col-lg-4 {
    width: 50%;
    float: left;
    margin-bottom: 25px;
  }

  
  /* ===============================
     BACK TO TOP & WHATSAPP
  =============================== */

  .backtotop-wrap {
   
    right: 18px;
  }
}

/* =====================================
   FORCE SAME BACKGROUND EVERYWHERE
===================================== */

/* BODY */
body {
  background-color: #0b0f1a !important;
}

/* ALL SECTIONS */
section {
  background-color: #0b0f1a !important;
}

/* COMMON WRAPPERS (themes usually use these) */
.container,
.container-fluid,
.row,
.wrapper,
.main-wrapper {
  background-color: transparent !important;
}

/* REMOVE ALL GRADIENTS / OVERLAYS */
section::before,
section::after,
div::before,
div::after {
  background: none !important;
  box-shadow: none !important;
}

/* KILL ANY DARK / BLUE / GRADIENT CLASSES */
.dark-bg,
.bg-dark,
.bg-blue,
.bg-gradient,
.gradient-bg,
.overlay,
.section-overlay {
  background: #0b0f1a !important;
}

/* FIX SPECIFIC AREAS (your form + neighbors) */
.enquiry-form-section,
.enquiry-form-section *,
.previous-section,
.next-section {
  background-color: #0b0f1a !important;
}
/* ================================
   NAVBAR BASE
================================ */
.mainmenu-area {
  position: sticky;
  top: 0;
  z-index: 999;
  background: #ffffff;
  border-bottom: 2px solid #d1162b;
  box-shadow: 0 2px 12px rgba(0,0,0,0.08);
}

.nav-container {
  max-width: 1200px;
  margin: auto;
  padding: 14px 20px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

/* ================================
   LOGO
================================ */
.logo img {
  height: 55px;
}

/* ================================
   MENU DESKTOP
================================ */
.main-menu {
  display: flex;
  align-items: center;
}

.navigation {
  list-style: none;
  display: flex;
  gap: 30px;
  margin: 0;
  padding: 0;
}

.navigation li a {
  text-decoration: none;
  font-weight: 600;
  color: #111;
  padding: 8px 0;
  position: relative;
}

.navigation li a:hover,
.navigation li.current a {
  color: #d1162b;
}

.navigation li a::after {
  content: "";
  position: absolute;
  width: 0;
  height: 2px;
  background: #d1162b;
  left: 0;
  bottom: -4px;
  transition: 0.3s;
}

.navigation li a:hover::after,
.navigation li.current a::after {
  width: 100%;
}

/* ================================
   CALL BUTTON
================================ */
.call-btn-desktop {
  background: #d1162b;
  color: #fff;
  padding: 10px 18px;
  border-radius: 30px;
  font-weight: 600;
  text-decoration: none;
  transition: 0.3s;
}

.call-btn-desktop i {
  color: #fff;
  margin-right: 6px;
}

.call-btn-desktop:hover {
  background: #b31224;
  color: #fff;
}

.call-btn-desktop:hover i,
.call-btn-desktop:focus i,
.call-btn-desktop:focus {
  color: #fff;
}

/* ================================
   TOGGLE BUTTON
================================ */
.nav-toggle {
  display: none;
  background: #d1162b;
  border: none;
  padding: 10px;
  border-radius: 6px;
  cursor: pointer;
}

.nav-toggle span {
  display: block;
  width: 22px;
  height: 2px;
  background: #fff;
  margin: 4px 0;
}

/* ================================
   MOBILE STYLES
================================ */
@media (max-width: 991px) {

  .nav-toggle {
    display: block;
  }

  .call-btn-desktop {
    display: none;
  }

  .main-menu {
    position: absolute;
    top: 100%;
    left: 0;
    width: 100%;
    background: #ffffff;
    flex-direction: column;
    align-items: center;
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.3s ease;
    box-shadow: 0 10px 20px rgba(0,0,0,0.1);
  }

  .main-menu.active {
    max-height: 400px;
  }

  .navigation {
    flex-direction: column;
    gap: 0 !important;
    width: 100%;
  }

  .navigation li {
    width: 100%;
    text-align: center;
    border-bottom: 1px solid #eee;
  }

  .navigation li a {
    display: block;
    padding: 14px;
  }

  .mobile-call-btn {
    margin: 15px 0 20px;
    background: #d1162b;
    color: #fff;
    padding: 12px 20px;
    border-radius: 30px;
    text-decoration: none;
    font-weight: 600;
  }
}
/* ================================
   NAVBAR BASE – WHITE EVERYWHERE
================================ */
.mainmenu-area {
  background: #ffffff !important;
  border-bottom: none !important; /* remove red line */
  box-shadow: 0 2px 12px rgba(0,0,0,0.06);
}

/* ================================
   DESKTOP MENU SPACING
================================ */
.navigation {
  gap: 55px; /* MORE SPACE BETWEEN MENU ITEMS */
}

.navigation li a {
  color: #111;
  font-weight: 600;
}

.navigation li a::after {
  display: none !important; /* remove underline effect */
}

/* ================================
   REMOVE ANY OLD COLORED BACKGROUND
================================ */
.main-menu,
.nav-container,
.navbar,
header {
  background: #ffffff !important;
}

/* ================================
   TOGGLE BUTTON – CLEAN & SMALL
================================ */
.nav-toggle {
  width: auto;
  padding: 8px 10px;
  background: #d1162b;
  border-radius: 6px;
  margin-right: 10px; /* EXACT 10px FROM RIGHT */
}

.nav-toggle span {
  width: 18px;
  height: 2px;
  margin: 4px 0;
}

/* ================================
   MOBILE & TABLET FIX
================================ */
@media (max-width: 991px) {

  .nav-container {
    padding-right: 10px; /* RIGHT ALIGN FIX */
  }

  .main-menu {
    background: #ffffff;
  }

  .navigation li {
    border-bottom: 1px solid #eee;
  }

  .navigation li a {
    padding: 14px;
    color: #111;
  }

  .navigation li a:hover {
    color: #d1162b;
  }
}

/* ================================
   REMOVE ANY STRAY RED LINE
================================ */
.mainmenu-area::after,
.mainmenu-area::before {
  display: none !important;
}
/* =====================================
   FIX HUGE MENU HEIGHT (TABLET + MOBILE)
===================================== */
@media (max-width: 991px) {

  /* Reduce overall dropdown height */
  .main-menu.active {
    max-height: 500px !important;
  }

  
  /* UL reset */
  .navigation {
    margin: 0 !important;
    padding: 0 !important;
  }

  /* EACH MENU ITEM */
  .navigation li {
    padding: 0 !important;
    margin: 0 !important;
    border-bottom: 1px solid #eee;
  }

  /* MENU LINKS – THIS IS THE KEY FIX */
  .navigation li a {
    padding: 10px 12px !important;   /* 🔥 REDUCES HEIGHT */
    line-height: 1.3 !important;     /* 🔥 PREVENTS TALL BLOCK */
    font-size: 15px;
    text-align: center;
    display: block;
  }

  /* Remove accidental spacing from legacy styles */
  .navigation li a br,
  .navigation li a p {
    display: none !important;
  }

  /* Mobile Call button tighter */
  .mobile-call-btn {
    margin: 10px auto 12px !important;
    padding: 9px 20px;
    font-size: 14px;
  }
}/* =====================================
   TABLET MENU – FINAL SAFE HEIGHT FIX
===================================== */
@media (min-width: 768px) and (max-width: 991px) {

  .main-menu.active {
    max-height: 600px !important; /* ✅ fits 3 links + button */
    overflow: hidden;
  }

  .navigation {
    margin: 0 !important;
    padding: 0 !important;
  }

  .navigation li {
    margin: 0 !important;
    padding: 0 !important;
    border-bottom: 1px solid #eee;
  }

  .navigation li a {
    padding: 10px 0 !important;
    line-height: 1.2 !important;
    font-size: 15px;
    display: block;
    text-align: center;
  }

  .mobile-call-btn {
    margin: 10px auto 14px !important;
    padding: 9px 22px;
    font-size: 14px;
    display: block;
  }
}
@media (max-width: 991px) {

  .main-menu {
    position: absolute;
    top: 100%;
    left: 0;
    width: 100%;
    background: #ffffff;
    overflow: hidden;

    max-height: 0;
    transition: max-height 0.35s ease;
    box-shadow: 0 10px 20px rgba(0,0,0,0.12);
  }

  .main-menu.active {
    max-height: 700px; /* ✅ SAFE NOW */
  }
}