/*
Theme Name: Araba - Car, Bike, Taxi, Vehicle, Ride Share Rental, and Booking Elementor WordPress Theme.
Author: MhrTheme
Version: 1.0.0

* This file contains the styling for the actual template, this
is the file you need to edit to change the look of the
Template.

This files contents are outlined below >>>>

Search Each Section As It Comments, You Will Get The Right Section.

******************************************* 
*******************************************

==== CSS INDEX

Default CSS
Button CSS
Section Area CSS
Go Top CSS
Header Area CSS
Footer Area CSS
Page Title Area CSS
404 Page Error Area CSS
Blog Area CSS
Pagination Area CSS
Blog Sidebar Area CSS
Blog Details Area CSS
Search Area CSS
Comment Area CSS
*/

/*
Default CSS
<<<<======================================================>>>>*/
:root {
  --mainColor: #14AE34;
  --secondaryColor: #222222;
  --bgColor: #F9FaFb;
  --headingColor: #3C3C3C;
  --whiteColor: #FFFFFF;
  --blackColor: #222222;
  --fontSize: 16px;
  --transition: .5s;
  --border-radius: 4px;
--font-primary: "Roboto", sans-serif;
  --font-secondary: "Poppins", sans-serif;
}

input[type="checkbox"],
input[type="radio"] {
  accent-color: #000000; /* modern browsers support this */
}



body {
  padding: 0;
  font-family: var(--font-primary);
}

/* Sections
   ========================================================================== */

/**
 * Render the `main` element consistently in IE.
 */
main {
  display: block;
}

/* Grouping content
   ========================================================================== */

/**
 * 1. Add the correct box sizing in Firefox.
 * 2. Show the overflow in Edge and IE.
 */
hr {
  box-sizing: slider-content-box;
  height: 0;
  overflow: visible;
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */
pre {
  font-family: monospace, monospace;
  font-size: 1em;
}

/* Text-level semantics
   ========================================================================== */

/**
 * 1. Remove the bottom border in Chrome 57-
 * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
 */
abbr[title] {
  border-bottom: none;
  text-decoration: underline;
  text-decoration: underline dotted;
}

/**
 * Add the correct font weight in Chrome, Edge, and Safari.
 */
b,
strong {
  font-weight: bolder;
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */
code,
kbd,
samp {
  font-family: monospace, monospace;
  font-size: 1em;
}

/**
 * Add the correct font size in all browsers.
 */
small {
  font-size: 80%;
}

/**
 * Prevent `sub` and `sup` elements from affecting the line height in
 * all browsers.
 */
sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sub {
  bottom: -0.25em;
}

sup {
  top: -0.5em;
}

/* Embedded content
   ========================================================================== */

/**
 * Remove the border on images inside links in IE 10.
 */
img {
  border-style: none;
}

/* Forms
   ========================================================================== */

/* Forms
--------------------------------------------- */
button,
input[type="button"],
input[type="reset"],
input[type="submit"] {
  font-size: 16px;
  color: var(--whiteColor);
  padding: 16px 30px;
  -webkit-transition: all 0.5s;
  transition: all 0.5s;
  text-transform: capitalize;
  position: relative;
  cursor: pointer;
  border-radius: 4px;
  text-align: center;
  overflow: hidden;
  z-index: 1;
  line-height: 1;
  background-color: var(--mainColor);
  border: none;
}

button,
input[type="button"]:hover,
input[type="reset"]:hover,
input[type="submit"]:hover {
  color: var(--whiteColor);
  background-color: var(--blackColor);
}

input[type="text"],
input[type="email"],
input[type="url"],
input[type="password"],
input[type="number"],
input[type="tel"],
input[type="range"],
input[type="date"],
input[type="month"],
input[type="week"],
input[type="time"],
input[type="datetime"],
input[type="datetime-local"],
input[type="color"] {
  height: 50px;
  color: #db6429;
  border: 1px solid #eaedff;
  background-color: var(--whiteColor);
  border-radius: 0;
  font-size: 15px;
  padding: 10px 20px;
  width: 100%;
}

textarea {
  color: #271273;
  border: 1px solid #eaedff;
  background-color: var(--whiteColor);
  border-radius: 0;
  font-size: 15px;
  padding: 10px 20px;
  width: 100%;
}

input[type="text"]:focus,
input[type="email"]:focus,
input[type="url"]:focus,
input[type="password"]:focus,
input[type="number"]:focus,
input[type="tel"]:focus,
input[type="range"]:focus,
input[type="date"]:focus,
input[type="month"]:focus,
input[type="week"]:focus,
input[type="time"]:focus,
input[type="datetime"]:focus,
input[type="datetime-local"]:focus,
input[type="color"]:focus,
textarea:focus {
  color: #000000;
  background-color: transparent;
  -webkit-box-shadow: unset;
  box-shadow: unset;
  outline: 0;
  border: 1px solid var(--mainColor);
}




@media only screen and (max-width: 767px) {
  button, input[type="button"], input[type="reset"], input[type="submit"] {
   font-size: 15px;
   padding: 14px 24px;
  }
}

/**
 * Remove the inheritance of text transform in Edge, Firefox, and IE.
 * 1. Remove the inheritance of text transform in Firefox.
 */
button,
select {
  text-transform: none;
}

/**
 * Correct the inability to style clickable types in iOS and Safari.
 */
button,
[type="button"],
[type="reset"],
[type="submit"] {
  -webkit-appearance: button;
}

/**
 * Remove the inner border and padding in Firefox.
 */
button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
  border-style: none;
  padding: 0;
}

/**
 * Restore the focus styles unset by the previous rule.
 */
button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {
  outline: 1px dotted ButtonText;
}

/**
 * Correct the padding in Firefox.
 */
fieldset {
  padding: 0.35em 0.75em 0.625em;
}

/**
 * 1. Correct the text wrapping in Edge and IE.
 * 2. Correct the color inheritance from `fieldset` elements in IE.
 * 3. Remove the padding so developers are not caught out when they zero out
 *    `fieldset` elements in all browsers.
 */
legend {
  box-sizing: border-box;
  color: inherit;
  display: table;
  max-width: 100%;
  padding: 0;
  white-space: normal;
}

/**
 * Add the correct vertical alignment in Chrome, Firefox, and Opera.
 */
progress {
  vertical-align: baseline;
}

/**
 * Remove the default vertical scrollbar in IE 10+.
 */
textarea {
  overflow: auto;
}

/**
 * 1. Add the correct box sizing in IE 10.
 * 2. Remove the padding in IE 10.
 */
[type="checkbox"],
[type="radio"] {
  box-sizing: border-box;
  padding: 0;
}

/**
 * Correct the cursor style of increment and decrement buttons in Chrome.
 */
[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
  height: auto;
}

/**
 * Remove the inner padding in Chrome and Safari on macOS.
 */
[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none;
}

/**
 * 1. Correct the inability to style clickable types in iOS and Safari.
 * 2. Change font properties to `inherit` in Safari.
 */
::-webkit-file-upload-button {
  -webkit-appearance: button;
  font: inherit;
}

/* Interactive
   ========================================================================== */

/*
 * Add the correct display in Edge, IE 10+, and Firefox.
 */
details {
  display: block;
}

/*
 * Add the correct display in all browsers.
 */
summary {
  display: list-item;
}

/* Misc
   ========================================================================== */

/**
 * Add the correct display in IE 10+.
 */
template {
  display: none;
}

/**
 * Add the correct display in IE 10.
 */
[hidden] {
  display: none;
}

/* Box sizing
--------------------------------------------- */

/* Inherit box-sizing to more easily change it's value on a component level.
@link http://css-tricks.com/inheriting-box-sizing-probably-slightly-better-best-practice/ */
*,
*::before,
*::after {
  box-sizing: inherit;
}

html {
  box-sizing: border-box;
}

/*--------------------------------------------------------------
# Base
--------------------------------------------------------------*/

/* Typography
--------------------------------------------- */
h1,
h2,
h3,
h4,
h5,
h6 {
  clear: both;
}

dfn,
cite,
em,
i {
  font-style: italic;
}

pre {
  background: #eee;
  font-family: "Courier 10 Pitch", courier, monospace;
  line-height: 1.6;
  margin-bottom: 1.6em;
  max-width: 100%;
  overflow: auto;
  padding: 1.6em;
}

code,
kbd,
tt,
var {
  font-family: monaco, consolas, "Andale Mono", "DejaVu Sans Mono", monospace;
}

abbr,
acronym {
  cursor: help;
}

mark,
ins {
  text-decoration: none;
}

big {
  font-size: 125%;
}

:focus-visible {
  outline: 0;
}

/* Make sure embeds and iframes fit their containers. */
embed,
iframe,
object {
  max-width: 100%;
}

figure {
  margin: 1em 0;
}

table {
  width: 100%;
}

/* Links
--------------------------------------------- */
a:hover,
a:active {
  outline: 0;
}

a {
  display: inline-block;
  -webkit-transition: all 0.5s;
  transition: all 0.5s;
  color: var(--mainColor);
  text-decoration: none;
}

a:hover {
  text-decoration: none;
  color: var(--blackColor);
}

a:focus {
  text-decoration: none;
}

/*--------------------------------------------------------------
# Components
--------------------------------------------------------------*/

/* Comments
--------------------------------------------- */
.comment-content a {
  word-wrap: break-word;
}

.bypostauthor {
  display: block;
}

#reply-title {
  margin: 0 0 10px 0;
  font-size: 1.2rem;
}

#reply-title small {
  display: block;
  margin-top: 10px;
}

/* Widgets
--------------------------------------------- */
.widget select {
  max-width: 100%;
}

/* Media
--------------------------------------------- */
.page-content .wp-smiley,
.entry-content .wp-smiley,
.comment-content .wp-smiley {
  border: none;
  margin-bottom: 0;
  margin-top: 0;
  padding: 0;
}

/* Make sure logo link wraps around logo image. */
.custom-logo-link {
  display: inline-block;
}

/* Captions
--------------------------------------------- */
.wp-caption {
  margin-bottom: 1.5em;
  max-width: 100%;
}

.wp-caption img[class*="wp-image-"] {
  display: block;
  margin-left: auto;
  margin-right: auto;
}

.wp-caption .wp-caption-text {
  margin: 0.8075em 0;
}

.wp-caption-text {
  text-align: center;
}

/* Galleries
--------------------------------------------- */
.gallery {
  margin-bottom: 1.5em;
  display: grid;
  grid-gap: 1.5em;
}

.gallery-item {
  display: inline-block;
  text-align: center;
  width: 100%;
}

.gallery-columns-2 {
  grid-template-columns: repeat(2, 1fr);
}

.gallery-columns-3 {
  grid-template-columns: repeat(3, 1fr);
}

.gallery-columns-4 {
  grid-template-columns: repeat(4, 1fr);
}

.gallery-columns-5 {
  grid-template-columns: repeat(5, 1fr);
}

.gallery-columns-6 {
  grid-template-columns: repeat(6, 1fr);
}

.gallery-columns-7 {
  grid-template-columns: repeat(7, 1fr);
}

.gallery-columns-8 {
  grid-template-columns: repeat(8, 1fr);
}

.gallery-columns-9 {
  grid-template-columns: repeat(9, 1fr);
}

.gallery-caption {
  display: block;
}

/*--------------------------------------------------------------
# Plugins
--------------------------------------------------------------*/

/* Jetpack infinite scroll
--------------------------------------------- */

/* Hide the Posts Navigation and the Footer when Infinite Scroll is in use. */
.infinite-scroll .posts-navigation,
.infinite-scroll.neverending .site-footer {
  display: none;
}

/* Re-display the Theme Footer when Infinite Scroll has reached its end. */
.infinity-end.neverending .site-footer {
  display: block;
}

/*--------------------------------------------------------------
# Utilities
--------------------------------------------------------------*/

/* Accessibility
--------------------------------------------- */

/* Text meant only for screen readers. */
.screen-reader-text {
  border: 0;
  clip: rect(1px, 1px, 1px, 1px);
  clip-path: inset(50%);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute !important;
  width: 1px;
  word-wrap: normal !important;
}

.screen-reader-text:focus {
  background-color: #f1f1f1;
  border-radius: 3px;
  box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
  clip: auto !important;
  clip-path: none;
  color: #21759b;
  display: block;
  font-size: 0.875rem;
  font-weight: 700;
  height: auto;
  left: 5px;
  line-height: normal;
  padding: 15px 23px 14px;
  text-decoration: none;
  top: 5px;
  width: auto;
  z-index: 100000;
}

/* Do not show the outline on the skip link target. */
#primary[tabindex="-1"]:focus {
  outline: 0;
}

/* Alignments
--------------------------------------------- */
.alignleft {

  /*rtl:ignore*/
  float: left;

  /*rtl:ignore*/
  margin-right: 1.5em;
  margin-bottom: 1.5em;
}

.alignright {

  /*rtl:ignore*/
  float: right;

  /*rtl:ignore*/
  margin-left: 1.5em;
  margin-bottom: 1.5em;
}

.aligncenter {
  clear: both;
  display: block;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 1.5em;
}

/* Buttons
--------------------------------------------- */
button {
  outline: 0;
  -webkit-box-shadow: none;
          box-shadow: none;
  border: none;
}

button:focus {
  -webkit-box-shadow: none;
          box-shadow: none;
  outline: none;
}

.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {
  color: var(--headingColor);
  font-weight: 600;
  font-family: var(--font-secondary)
}

.d-table {
  width: 100%;
  height: 100%;
}

.d-table-cell {
  vertical-align: middle;
}

.owl-theme .owl-nav.disabled+.owl-dots {
  padding-top: 20px;
  padding-bottom: 20px;
}

.owl-theme .owl-dots .owl-dot.active span, 
.owl-theme .owl-dots .owl-dot:hover span {
  background: var(--mainColor);
}

.owl-theme .owl-dots {
  line-height: 1;
}

.owl-theme .owl-dots .owl-dot span {
  background-color: var(--blackColor);
  width: 20px;
  height: 5px;
  border-radius: 4px;
  -webkit-transition: all 0.5s;
  transition: all 0.5s;
  margin-top: 0;
  margin-bottom: 0;
}

.owl-theme .owl-dots .owl-dot:hover span {
  background-color: var(--mainColor);
}

.owl-theme .owl-dots .owl-dot.active span {
  background-color: var(--mainColor);
  width: 30px;
}

p {
  font-size: 16px;
  line-height: 1.8;
}

p:last-child {
  margin-bottom: 0;
}

p:empty {
  display: none;
}

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



ul {
  padding-left:0px ;
  margin: 0;
  list-style: none;
  line-height: 20px;
}

@media only screen and (max-width: 767px) {
  ul {
    padding-left: 0 !important;
  }
}



.form-control, input[type="search"] {
  height: 50px;
  color: #271273;
  border: 1px solid #eaedff;
  background-color: var(--whiteColor);
  border-radius: 0;
  font-size: 15px;
  padding: 10px 20px;
  width: 100%;
}

.form-control::-webkit-input-placeholder, input[type="search"]::-webkit-input-placeholder {
  color: #495057;
}

.form-control:-ms-input-placeholder, input[type="search"]:-ms-input-placeholder {
  color: #495057;
}

.form-control::-ms-input-placeholder, input[type="search"]::-ms-input-placeholder {
  color: #495057;
}

.form-control::placeholder, input[type="search"]::placeholder {
  color: #495057;
}

.form-control:focus, input[type="search"]:focus {
  color: #000000;
  background-color: transparent;
  -webkit-box-shadow: unset;
          box-shadow: unset;
  outline: 0;
  border: 1px solid var(--mainColor);
}

.form-control:hover:focus, .form-control:focus, 
input[type="search"]:hover:focus, input[type="search"]:focus {
  -webkit-box-shadow: unset;
          box-shadow: unset;
}

textarea.form-control {
  height: auto;
}

.ptb-100 {
  padding-top: 100px;
  padding-bottom: 100px;
}

.pt-100 {
  padding-top: 100px;
}

.pb-100 {
  padding-bottom: 100px;
}

.ptb-70 { /*Modified footer padding */
  padding-top: 30px;
  padding-bottom: 30px;
}

.pt-70 {
  padding-top: 70px;
}

.pb-70 {
  padding-bottom: 70px;
}

.ptb-40 {
  padding-top: 40px;
  padding-bottom: 40px;
}

.pt-40 {
  padding-top: 40px;
}

.pb-40 {
  padding-bottom: 40px;
}

.ptb-20 {
  padding-top: 20px;
  padding-bottom: 20px;
}

.pt-20 {
  padding-top: 20px;
}

.pb-20 {
  padding-bottom: 20px;
}

.mt-30 {
  margin-top: 30px;
}

.mb-30 {
  margin-bottom: 30px;
}

.pl-55 {
  padding-left: 55px;
}

.bg-color {
  background-color: var(--bgColor);
}

.black-color {
  background-color: #121212;
}

.page .wp-post-image {
  margin-bottom: 30px;
}

.page .entry-content {
  padding-top: 20px;
  padding-bottom: 20px;
}

.page.elementor-page .entry-content {
  padding-top: 0;
  padding-bottom: 0;
}

.page .entry-content .page-content {
  padding: 20px;
}

.page.elementor-page .entry-content .page-content {
  padding: 0;
}

.page .entry-content h1,
.page .entry-content h2,
.page .entry-content h3,
.page .entry-content h4,
.page .entry-content h5,
.page .entry-content h6 {
  margin-bottom: 1rem;
}

.elementor-lightbox {
  display: none !important;
}

@media (max-width: 419px) {
  .auto-container {
    max-width: 240px;
  }
}

@media (min-width: 420px) {
  .auto-container {
    max-width: 340px;
  }
}

@media (min-width: 576px) {
  .auto-container {
    max-width: 450px;
  }
}

@media (min-width: 992px) {
  .container, .container-lg, .container-md, .container-sm {
    max-width: 992px;
  }
  .auto-container {
    max-width: 700px;
  }
}

@media (min-width: 1200px) {
  .container, .container-lg, .container-md, .container-sm, .container-xl {
    max-width: 1200px;
  }
  .auto-container {
    max-width: 1000px;
  }
}

.container-fluid, .container-lg, .container-md, .container-sm, .container-xl {
  padding-right: 40px;
  padding-left: 40px;
}

.container-block-fluid {
  padding-right: 20px;
  padding-left: 20px;
}

@media (max-width: 767px) {
  .container-fluid, .container-lg, .container-md, .container-sm, .container-xl {
    padding-right: 20px;
    padding-left: 20px;
  }
  .container-block-fluid {
    padding-right: 15px;
    padding-left: 15px;
  }
}

.container-fluid .row,
.container-block-fluid .row {
  padding: 0;
  margin: 0;
}

.container-fluid .full-col,
.container-block-fluid .full-col {
  padding: 0;
}

/*

/*
Button CSS
<<<<======================================================>>>>*/
.default-btn {
  font-size: 16px;
  color: var(--whiteColor);
  padding: 16px 30px;
  line-height: 1;
  -webkit-transition: all 0.5s;
  transition: all 0.5s;
  text-transform: capitalize;
  position: relative;
  cursor: pointer;
  border-radius: 8px;

border-style: solid;
border-width: 2px 2px 2px 2px;
border-color: #54595F66;

  text-align: center;
  overflow: hidden;
  z-index: 1;
  background-color: var(--mainColor);
}

.default-btn.icon {
  padding: 16px 30px 16px 60px;
}

.default-btn.icon i {
  position: absolute;
  left: 30px;
  top: 50%;
  right: initial;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  font-size: 20px;
}

.default-btn::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 0;
  height: 100%;
  background-color: var(--blackColor);
  z-index: -1;
  -webkit-transition: all 0.5s;
  transition: all 0.5s;
}

.default-btn::after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  width: 0;
  height: 100%;
  background-color: var(--blackColor);
  z-index: -1;
  -webkit-transition: all 0.5s;
  transition: all 0.5s;
}

.default-btn.active {
  color: var(--whiteColor);
  background-color: var(--blackColor);
  margin-right: 10px;
}

.default-btn.active::before {
  background-color: var(--mainColor);
}

.default-btn.active::after {
  background-color: var(--mainColor);
}

.default-btn:hover {
  color: var(--whiteColor);
}

.default-btn:hover::before {
  width: 50.2%;
}

.default-btn:hover::after {
  width: 50.2%;
}

.default-btn.extra-btn {
  margin: 20px auto;
  width: fit-content;
  display: flex;
}

.blog-area .default-btn.extra-btn {
  margin: 40px auto 20px;
}

.btn-area {
  margin-top: 20px;
  margin-bottom: 20px;
}

.blog-list .btn-area {
  margin-top: 40px;
  margin-bottom: 20px;
}

/*
Section Area CSS
<<<<======================================================>>>>*/
.section-title {
  max-width: 700px;
  margin: 20px auto 60px;
  text-align: center;
  position: relative;
}

.section-title::after {
  position: absolute;
  content: '';
  width: 25%;
  height: 4px;
  background: var(--mainColor);
  bottom: -30px;
  right: 38%;
}

.container-block-fluid .section-title {
  padding: 0 20px;
}

.section-title span {
  color: var(--mainColor);
  display: inline-block;
  margin-bottom: 8px;
  font-weight: 600;
  font-size: 14px;
}

.section-title h2 {
  font-size: 40px;
  margin-bottom: 15px;
  position: relative;
  display: block;
}

.section-title h2:last-child {
  margin-bottom: 0;
}

.section-title.white-title span {
  color: var(--whiteColor);
}

.section-title.white-title h2 {
  color: var(--whiteColor);
}

.section-title.white-title p {
  color: var(--whiteColor);
}

/*
Go Top Area CSS
<<<<======================================================>>>>*/
.go-top {
  position: fixed;
  cursor: pointer;
  top: 120%;
  right: 5%;
  background-color: var(--mainColor);
  z-index: 4;
  width: 40px;
  text-align: center;
  height: 42px;
  line-height: 42px;
  opacity: 0;
  visibility: hidden;
  -webkit-transition: .9s;
  transition: .9s;
}

.go-top i {
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  left: 0;
  right: 0;
  margin: 0 auto;
  color: var(--whiteColor);
  -webkit-transition: 0.5s;
  transition: 0.5s;
  font-size: 25px;
}

.go-top:hover {
  color: var(--whiteColor);
  background-color: var(--blackColor);
}

.go-top:hover i {
  color: var(--whiteColor);
}

.go-top.active {
  -webkit-transform: translateY(0);
          transform: translateY(0);
  opacity: 1;
  visibility: visible;
  right: 4%;
  top: 81.2%;
}

/*
Header Area CSS
<<<<======================================================>>>>
   ZUMI MODERN NAVIGATION SYSTEM
   One visual system for desktop, sticky, dropdown, tablet and mobile states.
*/
.main-header {
  --zumi-nav-accent: #E86A24;
  --zumi-nav-accent-hover: #F07A38;
  --zumi-nav-bg: #0D110F;
  --zumi-nav-bg-soft: #141916;
  --zumi-nav-panel: rgba(18, 23, 20, 0.985);
  --zumi-nav-text: #F7F8F7;
  --zumi-nav-muted: rgba(247, 248, 247, 0.66);
  --zumi-nav-border: rgba(255, 255, 255, 0.10);
  --zumi-nav-border-strong: rgba(255, 255, 255, 0.16);
  --zumi-nav-shadow: 0 18px 55px rgba(0, 0, 0, 0.24);
  --zumi-nav-radius: 16px;
  position: relative;
  z-index: 1100;
  isolation: isolate;
}

.main-header .main-mainmenu {
  position: relative;
  width: 100%;
  padding: 0;
  color: var(--zumi-nav-text);
  background: rgba(13, 17, 15, 0.94);
  border-bottom: 1px solid var(--zumi-nav-border);
  -webkit-backdrop-filter: saturate(140%) blur(14px);
  backdrop-filter: saturate(140%) blur(14px);
  transition: background-color 220ms ease, border-color 220ms ease, box-shadow 220ms ease;
}

.main-header .main-mainmenu.main-sticky {
  position: fixed;
  top: 0;
  right: 0;
  left: 0;
  z-index: 1100;
  padding: 0;
  background: rgba(10, 13, 11, 0.965);
  border-bottom-color: rgba(255, 255, 255, 0.08);
  box-shadow: 0 10px 35px rgba(0, 0, 0, 0.20);
  animation: zumiHeaderIn 260ms cubic-bezier(.2,.75,.3,1) both;
}

.admin-bar .main-header .main-mainmenu.main-sticky {
  top: 32px;
}

.main-header .main-mainmenu > .container,
.main-header .main-mainmenu > .container-fluid,
.main-header .main-mainmenu.main-sticky > .container,
.main-header .main-mainmenu.main-sticky > .container-fluid {
  width: 100%;
  max-width: none;
  margin: 0 auto;
  padding-left: clamp(18px, 2vw, 42px);
  padding-right: clamp(18px, 2vw, 42px);
}

.main-header .header-navbar {
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
  justify-content: space-between;
  min-width: 0;
  min-height: 82px;
  gap: clamp(10px, 1vw, 20px);
}

/* Brand */
.main-header .header-navbar .header-logo {
  flex: 0 0 clamp(190px, 15.2vw, 268px);
  width: clamp(190px, 15.2vw, 268px);
  min-width: 0;
  max-width: 268px;
}

.main-header .header-navbar .header-logo > a {
  display: flex;
  align-items: center;
  width: 100%;
  line-height: 1;
}

.main-header .header-navbar .header-logo img,
.main-header .main-mainmenu.main-sticky .header-navbar .header-logo img {
  display: block;
  width: 100%;
  max-width: 100%;
  height: auto;
  max-height: 60px;
  margin: 0;
  padding: 0;
  object-fit: contain;
  object-position: left center;
}

.main-header .header-navbar .header-logo .dark-version-logo,
.main-header .header-navbar .header-logo .sticky-logo {
  display: none;
}

.main-header.header-style-1 .main-mainmenu.main-sticky .header-navbar .header-logo .light-version-logo,
.main-header.header-style-3 .main-mainmenu.main-sticky .header-navbar .header-logo .light-version-logo {
  display: none;
}

.main-header.header-style-1 .main-mainmenu.main-sticky .header-navbar .header-logo .sticky-logo,
.main-header.header-style-3 .main-mainmenu.main-sticky .header-navbar .header-logo .sticky-logo {
  display: block;
}

/* Primary navigation */
.main-header .header-navbar .header-main-nav,
.main-header.header-style-1 .header-main-nav {
  flex: 1 1 auto;
  min-width: 0;
  margin: 0;
}

.main-header .mainmenu {
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
  justify-content: flex-end;
  width: 100%;
  margin: 0;
  padding: 0;
  list-style: none;
  white-space: nowrap;
}

.main-header .mainmenu > li {
  position: relative;
  flex: 0 0 auto;
  margin: 0;
}

.main-header .mainmenu > li > a {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 46px;
  padding: 0 10px;
  border-radius: 12px;
  color: var(--zumi-nav-text);
  font-family: var(--font-primary);
  font-size: clamp(14px, .92vw, 16px);
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: -0.01em;
  text-decoration: none;
  transition: color 160ms ease, background-color 160ms ease, transform 160ms ease;
}

.main-header .mainmenu > li > a::before {
  content: "";
  position: absolute;
  left: 12px;
  right: 12px;
  bottom: 5px;
  width: auto;
  height: 2px;
  border-radius: 999px;
  background: var(--zumi-nav-accent);
  opacity: 0;
  transform: scaleX(.25);
  transform-origin: center;
  transition: opacity 160ms ease, transform 180ms ease;
}

.main-header .mainmenu > li > a:hover,
.main-header .mainmenu > li.active > a,
.main-header .mainmenu > li.current-menu-item > a,
.main-header .mainmenu > li.current-menu-ancestor > a {
  color: #FFFFFF;
  background: rgba(255, 255, 255, 0.07);
}

.main-header .mainmenu > li > a:hover::before,
.main-header .mainmenu > li.active > a::before,
.main-header .mainmenu > li.current-menu-item > a::before,
.main-header .mainmenu > li.current-menu-ancestor > a::before {
  opacity: 1;
  transform: scaleX(1);
}

.main-header .mainmenu > li > a > i,
.main-header .mainmenu > li > a > svg,
.main-header .mainmenu > li > a > img {
  flex: 0 0 auto;
  margin: 0;
  line-height: 1;
}

.main-header .mainmenu > li > a > i {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 1.18em;
}

/* Pure-CSS chevrons: no icon-font dependency for dropdown arrows. */
.main-header .mainmenu > .menu-item-has-children > a {
  padding-right: 27px;
}

.main-header .mainmenu > .menu-item-has-children > a::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 11px;
  width: 7px;
  height: 7px;
  border-right: 1.5px solid currentColor;
  border-bottom: 1.5px solid currentColor;
  transform: translateY(-70%) rotate(45deg);
  transform-origin: center;
  transition: transform 160ms ease;
}

.main-header .mainmenu > .menu-item-has-children:hover > a::after,
.main-header .mainmenu > .menu-item-has-children:focus-within > a::after {
  transform: translateY(-35%) rotate(225deg);
}

/* Desktop dropdown cards */
.main-header .mainmenu .main-submenu {
  position: absolute;
  top: calc(100% + 10px);
  left: 0;
  z-index: 1200;
  display: block;
  width: max-content;
  min-width: 230px;
  max-width: min(360px, calc(100vw - 32px));
  margin: 0;
  padding: 8px;
  list-style: none;
  color: var(--zumi-nav-text);
  background: var(--zumi-nav-panel);
  border: 1px solid var(--zumi-nav-border-strong);
  border-radius: var(--zumi-nav-radius);
  box-shadow: var(--zumi-nav-shadow);
  -webkit-backdrop-filter: blur(18px) saturate(130%);
  backdrop-filter: blur(18px) saturate(130%);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translateY(8px) scale(.985);
  transform-origin: top left;
  transition: opacity 150ms ease, visibility 150ms ease, transform 180ms cubic-bezier(.2,.75,.3,1);
}

.main-header .mainmenu > li:nth-last-child(-n+2) > .main-submenu {
  right: 0;
  left: auto;
  transform-origin: top right;
}

.main-header .mainmenu .main-submenu li {
  position: relative;
  margin: 0;
  padding: 0;
  opacity: 1;
  transform: none;
}

.main-header .mainmenu .main-submenu > li > a {
  position: relative;
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 42px;
  padding: 9px 12px;
  border-radius: 10px;
  color: rgba(255, 255, 255, 0.88);
  font-size: 14.5px;
  font-weight: 550;
  line-height: 1.25;
  text-transform: none;
  white-space: nowrap;
  transition: color 150ms ease, background-color 150ms ease, padding-left 150ms ease;
}

.main-header .mainmenu .main-submenu > li > a:hover,
.main-header .mainmenu .main-submenu > li.active > a,
.main-header .mainmenu .main-submenu > li.current-menu-item > a {
  color: #FFFFFF;
  background: rgba(232, 106, 36, 0.14);
  padding-left: 15px;
}

.main-header .mainmenu .main-submenu .menu-item-has-children > a {
  padding-right: 34px;
}

.main-header .mainmenu .main-submenu .menu-item-has-children > a::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 14px;
  width: 7px;
  height: 7px;
  border-top: 1.5px solid currentColor;
  border-right: 1.5px solid currentColor;
  transform: translateY(-50%) rotate(45deg);
}

.main-header .mainmenu .main-submenu .main-submenu {
  top: -8px;
  left: calc(100% + 10px);
}

.main-header .mainmenu > li:nth-last-child(-n+2) .main-submenu .main-submenu {
  right: calc(100% + 10px);
  left: auto;
}

.main-header .mainmenu .menu-item-has-children:hover > .main-submenu,
.main-header .mainmenu .menu-item-has-children:focus-within > .main-submenu {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translateY(0) scale(1);
}

/* Header actions */
.main-header .header-navbar .header-action {
  flex: 0 0 auto;
  min-width: max-content;
}

.main-header .header-action > ul {
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
  width: max-content;
  margin: 0;
  padding: 0;
}

.main-header .header-action > ul > li {
  flex: 0 0 auto;
  margin: 0;
}

.main-header .header-action .my_switcher {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 44px;
  width: auto;
  height: 44px;
  margin: 0;
  padding: 0 11px;
  line-height: 1;
  color: var(--zumi-nav-text);
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid var(--zumi-nav-border);
  border-radius: 12px;
  transition: background-color 160ms ease, border-color 160ms ease;
}

.main-header .header-action .my_switcher:hover {
  background: rgba(255, 255, 255, 0.10);
  border-color: var(--zumi-nav-border-strong);
}

.main-header .header-action .my_switcher ul,
.main-header .header-action .my_switcher li,
.main-header .header-action .my_switcher a,
.main-header .header-action .my_switcher [role="button"] {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  margin: 0;
  padding: 0;
  color: inherit;
  line-height: 1;
  white-space: nowrap;
}

.main-header .header-action .my_switcher img,
.main-header .header-action .my_switcher svg {
  display: block;
  flex: 0 0 auto;
  margin: 0;
}

.main-header .header-action .header-btn {
  margin: 0;
}

.main-header .header-action .header-btn .main-btn,
.main-header .header-action .header-btn .default-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 46px;
  margin: 0;
  padding: 13px 18px;
  color: #FFFFFF;
  background: var(--zumi-nav-accent);
  border: 1px solid rgba(255, 255, 255, 0.10);
  border-radius: 12px;
  box-shadow: 0 8px 22px rgba(232, 106, 36, 0.22);
  font-size: 15px;
  font-weight: 700;
  line-height: 1;
  letter-spacing: -0.01em;
  white-space: nowrap;
  transition: transform 160ms ease, background-color 160ms ease, box-shadow 160ms ease;
}

.main-header .header-action .header-btn .main-btn:hover,
.main-header .header-action .header-btn .default-btn:hover {
  color: #FFFFFF;
  background: var(--zumi-nav-accent-hover);
  box-shadow: 0 10px 28px rgba(232, 106, 36, 0.30);
  transform: translateY(-1px);
}

.main-header .header-action .header-btn .default-btn::before,
.main-header .header-action .header-btn .default-btn::after,
.main-header .header-action .header-btn .main-btn::before,
.main-header .header-action .header-btn .main-btn::after {
  background: var(--zumi-nav-accent-hover);
}

.main-header .header-action .header-btn .main-btn.icon,
.main-header .header-action .header-btn .default-btn.icon {
  position: relative;
  padding-left: 46px;
}

.main-header .header-action .header-btn .main-btn.icon i,
.main-header .header-action .header-btn .default-btn.icon i {
  position: absolute;
  top: 50%;
  left: 17px;
  margin: 0;
  font-size: 19px;
  line-height: 1;
  transform: translateY(-50%);
}

/* Hamburger */
.main-header .header-action .mobile-menu-btn {
  display: none;
}

.main-header .header-action .mobile-menu-btn .btn-wrap,
.main-header .header-action .sidemenu-btn .btn-wrap {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 5px;
  width: 46px;
  height: 46px;
  margin: 0;
  padding: 0;
  color: var(--zumi-nav-text);
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid var(--zumi-nav-border);
  border-radius: 12px;
  box-shadow: none;
  transition: background-color 160ms ease, border-color 160ms ease;
}

.main-header .header-action .mobile-menu-btn .btn-wrap:hover,
.main-header .header-action .sidemenu-btn .btn-wrap:hover {
  background: rgba(255, 255, 255, 0.10);
  border-color: var(--zumi-nav-border-strong);
}

.main-header .header-action .mobile-menu-btn .btn-wrap span,
.main-header .header-action .sidemenu-btn .btn-wrap span {
  display: block;
  width: 19px;
  height: 2px;
  margin: 0;
  border-radius: 999px;
  background: currentColor;
}

/* Mobile drawer header */
.mobile-nav-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  margin: 0;
  padding: 2px 2px 18px;
  border-bottom: 1px solid var(--zumi-nav-border);
}

.mobile-nav-header .mobile-nav-logo {
  width: min(190px, 62vw);
  line-height: 1;
}

.mobile-nav-header .mobile-nav-logo img {
  display: block;
  width: 100%;
  max-width: 100%;
  height: auto;
}

.main-header.header-style-1 .mobile-nav-header .mobile-nav-logo .light-mode,
.mobile-nav-header .mobile-nav-logo .light-mode {
  display: block;
}

.main-header.header-style-1 .mobile-nav-header .mobile-nav-logo .dark-mode,
.mobile-nav-header .mobile-nav-logo .dark-mode {
  display: none;
}

.mobile-nav-header .mobile-menu-close,
.main-header.header-style-1 .mobile-nav-header .mobile-menu-close {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  min-width: 40px;
  padding: 0;
  color: var(--zumi-nav-text);
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid var(--zumi-nav-border);
  border-radius: 12px;
  font-size: 15px;
  line-height: 1;
  transition: color 160ms ease, background-color 160ms ease, border-color 160ms ease;
}

.mobile-nav-header .mobile-menu-close:hover {
  color: #FFFFFF;
  background: rgba(232, 106, 36, 0.14);
  border-color: rgba(232, 106, 36, 0.35);
}

/* Optional theme side-offcanvas menu follows the same premium surface. */
.header-offcanvasmenu {
  width: min(460px, 92vw);
  color: var(--zumi-nav-text);
  background: var(--zumi-nav-bg);
  border-left: 1px solid var(--zumi-nav-border);
  box-shadow: -18px 0 60px rgba(0, 0, 0, 0.24);
}

.header-offcanvasmenu .offcanvas-header,
.header-offcanvasmenu .offcanvas-body {
  padding-left: clamp(28px, 5vw, 52px);
  padding-right: clamp(28px, 5vw, 52px);
}

.header-offcanvasmenu .offcanvas-header {
  padding-top: 30px;
  padding-bottom: 10px;
}

.header-offcanvasmenu .offcanvas-body {
  padding-top: 28px;
  padding-bottom: 40px;
}

.header-offcanvasmenu .offcanvas-body .main-navigation {
  margin: 0 0 36px;
}

.header-offcanvasmenu .offcanvas-body .main-navigation li {
  margin: 4px 0;
}

.header-offcanvasmenu .offcanvas-body .main-navigation li a {
  display: block;
  padding: 11px 0;
  color: var(--zumi-nav-text);
  font-size: clamp(20px, 2vw, 28px);
  font-weight: 600;
  letter-spacing: -0.025em;
}

.header-offcanvasmenu .offcanvas-body .main-navigation li a:hover,
.header-offcanvasmenu .offcanvas-body .main-navigation li a.active {
  color: var(--zumi-nav-accent);
}

/* Restore a visible keyboard focus treatment inside the navigation. */
.main-header a:focus-visible,
.main-header button:focus-visible,
.header-offcanvasmenu a:focus-visible,
.header-offcanvasmenu button:focus-visible {
  outline: 2px solid var(--zumi-nav-accent);
  outline-offset: 3px;
}

@keyframes zumiHeaderIn {
  from { opacity: 0; transform: translateY(-10px); }
  to { opacity: 1; transform: translateY(0); }
}

@media (prefers-reduced-motion: reduce) {
  .main-header *,
  .main-header *::before,
  .main-header *::after {
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
  }
}


/*
Footer Area CSS
<<<<======================================================>>>>*/
.footer-area {
  background-size: cover;
}

.footer-area .footer-top {
  background: #121212;
}

.footer-area .footer-top .footer-title {
  font-size: 20px;
  line-height: 30px;
  font-weight: 600;
  color: var(--whiteColor);
  letter-spacing: 0;
  position: relative;
  margin-bottom: 30px;
  text-transform: uppercase;
  padding-bottom: 14px;
}

.footer-area .footer-top .footer-title:after {
  content: "";
  width: 50px;
  height: 4px;
  background: var(--mainColor);
  position: absolute;
  bottom: -4px;
  right: 0;
  left: 0;
  margin-left: 0;
  border-radius: 0;
  -webkit-transition: all .3s ease;
  transition: all .3s ease;
  z-index: 0;
}

.footer-area .footer-top .menu li {
  margin-bottom: 16px;
}

.footer-area .footer-top .menu li a {
  font-size: 15px;
  color: var(--whiteColor);
}

.footer-area .footer-top .menu li a:hover {
  color: var(--mainColor);
}

.footer-area .footer-top .menu li:last-child {
  margin-bottom: 0;
}

.bxl-twitter:before {
  content: "𝕏" !important;
}

.footer-area .footer-bottom .footer-social li {
  display: inline;
  margin-right: 5px;
}

.footer-area .footer-bottom .footer-social li a i {
  padding: 0;
  font-size: 15px;
  margin-right: 3px;
  transition: all .8s ease;
  background: #1c2024;
  width: 35px;
  height: 35px;
  line-height: 35px;
  border-radius: 0;
  color: #fff;
  text-align: center;
}

.footer-area .footer-bottom .footer-social li a i:hover {
  color: var(--whiteColor);
  background: var(--mainColor);
}

.footer-area .footer-bottom .footer-social li:last-child {
  margin: 0;
}

.footer-area .footer-top .address-widget li {
  padding: 0px 0px 20px 40px;
  position: relative;
}

.footer-area .footer-top .address-widget li .desc {
  color: var(--whiteColor);
  font-size: 16px;
}

.footer-area .footer-top .address-widget li .desc a {
  color: var(--whiteColor);
}

.footer-area .footer-top .address-widget li .desc a:hover {
  color: var(--mainColor);
}

.footer-area .footer-top .address-widget li i {
  color: var(--mainColor);
  position: absolute;
  left: 0px;
}

.footer-area .footer-top .address-widget li i:before {
  font-size: 20px;
}

.footer-area .footer-top .widget-desc {
  margin: 0;
}

.footer-area .footer-top p {
  margin: 25px 0 0;
  position: relative;
  color: var(--whiteColor);
}

.footer-area .footer-top p input[type=email] {
  border: none;
  background: #fff;
}

.footer-area .footer-top p input[type="submit"] {
  border: none;
  border-radius: 0px;
  margin-top: 15px;
  text-transform: uppercase;
  font-weight: 500;
  transition: all .5s ease;
}

.footer-area .footer-top p input[type=submit]:hover {
  opacity: .9;
}

.footer-area .footer-top p ::-webkit-input-placeholder {
  /* Chrome/Opera/Safari */
  color: #0a0a0a;
  opacity: 1;
}

.footer-area .footer-top p ::-moz-placeholder {
  /* Firefox 19+ */
  color: #0a0a0a;
  opacity: 1;
}

.footer-area .footer-top p :-ms-input-placeholder {
  /* IE 10+ */
  color: #0a0a0a;
  opacity: 1;
}

.footer-area .footer-top p :-moz-placeholder {
  /* Firefox 18- */
  color: #0a0a0a;
  opacity: 1;
}

.footer-area .footer-bottom {
  padding: 20px 0;
  background: #000;
}

.footer-area .footer-bottom .copyright p {
  margin: 0;
  color: var(--whiteColor);
}

/*================================================
Page Title Area CSS
=================================================*/
.page-title-area {
  z-index: 1;
  position: relative;
  background: -webkit-gradient(linear, left top, right top, from(var(--mainColor)), to(var(--secondaryColor)));
  background: linear-gradient(90deg, var(--mainColor) 0%, var(--secondaryColor) 100%);
  padding-top: 20px;
  padding-bottom: 20px;
}

.page-title-area::before {
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  content: '';
  z-index: -1;
  opacity: .2;
  height: 100%;
  position: absolute;
  background-image: url(../../assets/img/bg_lines.svg);
  background-position: center center;
  background-repeat: no-repeat;
  background-size: 200%;
}

.page-title-content {
  text-align: center;
  line-height: 2px;
}

.page-title-content h2 {
  margin-bottom: 0;
  color: var(--whiteColor);
  font-size: 45px;
}

.page-title-content ul {
  padding-left: 0;
  margin-bottom: 0;
  list-style-type: none;
  margin-bottom: 0;
  margin-top: 12px;
}

.page-title-content ul li {
  font-size: 17px;
  position: relative;
  display: inline-block;
  margin-left: 13px;
  margin-right: 13px;
}

.page-title-content ul li.active {
  color: var(--whiteColor);
}

.page-title-content ul li::before {
  top: 50%;
  opacity: .7;
  right: -26px;
  content: "\e9f9";
  position: absolute;
  color: var(--whiteColor);
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  font-family: 'boxicons';
  font-size: 24px;
}

.page-title-content ul li a {
  color: var(--whiteColor);
}

.page-title-content ul li a:hover {
  color: var(--bgColor);
  opacity: 0.7;
}

.page-title-content ul li:last-child {
  margin-right: 0;
}

.page-title-content ul li:last-child::before {
  display: none;
}

.page-title-content ul li:first-child {
  margin-left: 0;
}

/*==========================
404 Page Error Area CSS
============================*/
.page-error-content {
  text-align: center;
}

.page-error-content img {
  margin: 0 auto;
}

.page-error-content h3 {
  font-size: 35px;
  margin-bottom: 20px;
  margin-top: 45px;
}

.page-error-content p {
  max-width: 550px;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 0;
}

.page-error-content .search-form {
  margin-top: 20px;
}

.page-error-content .default-btn {
  margin-top: 30px;
}

/*================================================
Blog Area CSS
=================================================*/
.single-blog-inner {
  overflow: hidden;
  -webkit-transition: 0.4s;
  transition: 0.4s;
  padding: 20px;
  margin-bottom: 20px;
}

.single-blog-inner .share-area-wrap {
  position: relative;
}

.single-blog-inner .share-area-wrap:hover .share-hover-icons {
  visibility: visible;
  opacity: 1;
}

.single-blog-inner .share-wrap {
  cursor: pointer;
  -webkit-transition: 0.4s;
  transition: 0.4s;
}

.single-blog-inner .share-wrap.active {
  color: var(--mainColor);
}

.single-blog-inner .share-hover-icons {
  display: inline-block;
  background-color: var(--mainColor);
  padding: 3px 6px 2px 6px;
  width: auto;
  position: absolute;
  border-radius: 3px;
  right: 0;
  top: -40px;
  visibility: hidden;
  opacity: 0;
  -webkit-transition: 0.4s;
  transition: 0.4s;
}

.single-blog-inner .share-hover-icons ul {
  margin: 0;
  padding: 0;
}

.single-blog-inner .share-hover-icons ul li {
  display: inline-block;
  list-style: none;
}

.single-blog-inner .share-hover-icons ul li a {
  color: #fff;
  padding: 0 2px;
  font-size: 13px;
}

.single-blog-inner .share-hover-icons ul li a:hover {
  color: var(--heading-color);
}

.single-blog-inner .share-hover-icons.active {
  visibility: visible;
  opacity: 1;
}

.single-blog-inner .share-hover-icons:after {
  content: "";
  position: absolute;
  right: 5px;
  bottom: -4px;
  -webkit-transform: rotate(53deg);
  transform: rotate(53deg);
  height: 11px;
  width: 10px;
  background: var(--mainColor);
}

.single-blog-inner .blog-thumb-slider {
  margin-bottom: 20px;
}

.single-blog-inner .thumb {
  position: relative;
  overflow: hidden;
  margin-bottom: 20px;
}

.single-blog-inner .thumb .video-play-btn {
  position: absolute;
  left: 50%;
  top: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}

.single-blog-inner .thumb img {
  -webkit-transform: scale(1.05);
  transform: scale(1.05);
  -webkit-transition: 0.9s;
  transition: 0.9s;
}

.blog-list .single-blog-inner .thumb img {
  width: 100%;
}

.single-blog-inner .thumb .blog-meta {
  background: var(--mainColor);
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  margin-bottom: 0;
  margin: 0 30px;
  padding: 10px 20px;
}
 
.single-blog-inner .thumb .blog-meta li a {
  color: #fff;
}

.single-blog-inner .thumb .blog-meta li a:hover {
  opacity: 0.7;
}

.single-blog-inner .blog-meta {
  margin: 0;
  padding: 0;
  margin-bottom: 15px;
}

.single-blog-inner .blog-meta li {
  display: inline-block;
  margin-right: 12px;
  color: #8A8A8A;
  font-size: 14px;
}

.single-blog-inner .blog-meta li i {
  margin-right: 4px;
  color: var(--whiteColor);
}

.single-blog-inner .blog-meta li:last-child {
  margin-right: 0;
}

.single-blog-inner .details {
  position: relative;
}

.single-blog-inner .details h2 {
  margin-bottom: 3px;
}

.single-blog-inner .details h2:hover a {
  color: var(--mainColor);
}

.single-blog-inner .details h4 {
  font-size: 20px;
  margin-bottom: 15px;
}

.single-blog-inner .details h4 a {
  color: var(--blackColor);
}

.single-blog-inner .details h4 a:hover {
  color: var(--mainColor);
}

.single-blog-inner .details .title {
  margin-bottom: 17px;
}

.single-blog-inner .details p {
  margin-bottom: 20px;
}

.single-blog-inner .details .read-more-text {
  font-weight: 600;
}

.single-blog-inner .details .read-more-btn {
  height: 45px;
  width: 45px;
  line-height: 45px;
  text-align: center;
  background: var(--mainColor);
  display: inline-block;
  color: #fff;
  border-radius: 50%;
  position: absolute;
  left: 50%;
  bottom: -20px;
  margin-left: -23px;
  -webkit-transition: 0.4s;
  transition: 0.4s;
}

.single-blog-inner .details .read-more-btn i {
  font-size: 30px;
  top: 50%;
  position: relative;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
}

.single-blog-inner:hover .thumb img {
  -webkit-transform: scale(1.1);
  transform: scale(1.1);
}

.single-blog-inner .thumb {
  margin-bottom: 0;
}

.single-blog-inner .details {
  background: var(--bgColor);
  padding: 20px;
  margin: 0 30px;
}

.bg-color .single-blog-inner .details {
  background-color: var(--whiteColor);
}

.single-blog-inner:hover .details .read-more-btn {
  background: var(--blackColor);
}

/*================================================
Pagination Area CSS
=================================================*/
.pagination-area {
  text-align: center;
  margin-top: 40px;
  margin-bottom: 20px;
}

.pagination-area .pagination {
  display: block;
}

.pagination-area .page-numbers {
  width: 45px;
  height: 45px;
  line-height: 45px;
  color: var(--blackColor);
  text-align: center;
  display: inline-block;
  position: relative;
  margin-left: 3px;
  margin-right: 3px;
  font-size: 17px;
  background-color: var(--bgColor);
  border: 1px solid #ebebeb;
}

.pagination-area .page-numbers:hover {
  color: var(--whiteColor);
  border-color: var(--mainColor);
  background-color: var(--mainColor);
}

.pagination-area .page-numbers i {
  font-size: 20px;
  top: 2px;
  position: relative;
}

.pagination-area .page-numbers.current {
  color: var(--whiteColor);
  border-color: var(--mainColor);
  background-color: var(--mainColor);
}

/*================================================
Blog Sidebar Area CSS
=================================================*/
.blog-details-right-area.blog-left-sidebar {
  padding: 0 20px;
  margin-top: 20px;
}

.blog-details-right-area.blog-right-sidebar {
  padding: 0 20px;
  margin-top: 20px;
}

.blog-details-right-area .widget_block {
  margin-bottom: 40px;
  background-color: #ffffff;
  -webkit-box-shadow: 0 0 20px 3px rgba(0, 0, 0, 0.05);
          box-shadow: 0 0 20px 3px rgba(0, 0, 0, 0.05);
  padding: 30px;
}

.blog-details-right-area .widget_block:last-child {
  margin-bottom: 20px;
}

.blog-details-right-area .widget_block ul li a {
  font-size: 15px;
}

.blog-details-right-area .widget_block h2 {
  padding-bottom: 10px;
  border-bottom: 1px solid #eeeeee;
  margin-bottom: 15px;
  font-size: 20px;
  position: relative;
}

.blog-details-right-area .widget_block h2::before {
  content: "";
  position: absolute;
  bottom: -1px;
  width: 50px;
  height: 1px;
  background-color: var(--mainColor);
}

.blog-details-right-area .widget_block.widget_search .wp-block-search {
  position: relative;
}

.blog-details-right-area .widget_block.widget_search .wp-block-search .wp-block-search__input {
  height: 50px;
  border: 1px solid #ffffff;
  background-color: #ffffff;
  -webkit-box-shadow: 0 0 20px 3px rgba(0, 0, 0, 0.05);
          box-shadow: 0 0 20px 3px rgba(0, 0, 0, 0.05);
  padding: 10px;
  width: 100%;
}

.blog-details-right-area .widget_block.widget_search .wp-block-search label {
  padding-bottom: 10px;
  border-bottom: 1px solid #eeeeee;
  margin-bottom: 15px;
  font-size: 20px;
  position: relative;
}

.blog-details-right-area .widget_block.widget_search .wp-block-search label::before {
  content: "";
  position: absolute;
  bottom: -1px;
  width: 50px;
  height: 1px;
  background-color: var(--mainColor);
}

.blog-details-right-area .widget_block.widget_search .wp-block-search .wp-block-search__input:focus {
  border-color: var(--mainColor);
}

.blog-details-right-area .widget_block.widget_search .wp-block-search button {
  position: absolute;
  right: 0;
  height: 50px;
  background-color: var(--mainColor);
  color: #fff;
  -webkit-transition: all 0.5s;
  transition: all 0.5s;
}

.blog-details-right-area .widget_block.widget_search .wp-block-search button:hover {
  background-color: #122738;
}

.blog-details-right-area .widget_block.widget_search .wp-block-search button i {
  color: #ffffff;
}

.blog-details-right-area .widget_block ul, 
.blog-details-right-area .widget_block ol {
  padding: 0;
  margin: 0;
}

.blog-details-right-area .widget_block ul li, 
.blog-details-right-area .widget_block ol li {
  border-bottom: 1px solid #eeeeee;
  padding-bottom: 10px;
  margin-bottom: 10px;
  line-height: inherit;
}

.blog-details-right-area .widget_block ul li:last-child, 
.blog-details-right-area .widget_block ol li:last-child {
  padding-bottom: 0;
  border-bottom: none;
  margin-bottom: 0;
}

.blog-details-right-area .widget_block ul li a, 
.blog-details-right-area .widget_block ol li a {
  position: relative;
}

.blog-details-right-area .widget_block ul li a, 
.blog-details-right-area .widget_block ol li a {
  font-size: 15px;
  -webkit-transition: all 0.5s;
  transition: all 0.5s;
  font-weight: 500;
  color: #545454;
}

.blog-details-right-area .widget_block ul li a:hover, 
.blog-details-right-area .widget_block ol li a:hover {
  color: var(--mainColor);
}

.blog-details-right-area .widget_block.archives-widget ul li {
  border-bottom: 1px solid #eeeeee;
  padding-bottom: 10px;
  margin-bottom: 10px;
}

.blog-details-right-area .widget_block.archives-widget ul li:last-child {
  padding-bottom: 0;
  border-bottom: none;
  margin-bottom: 0;
}

.blog-details-right-area .widget_block.archives-widget ul li a {
  position: relative;
  display: block;
  color: #545454;
}

.blog-details-right-area .widget_block.archives-widget ul li a span {
  display: block;
  margin-bottom: 5px;
  color: #545454;
  float: right;
}

.blog-details-right-area .widget_block.archives-widget ul li a:hover {
  color: var(--mainColor);
}

.blog-details-right-area .widget_block.archives-widget ul li a:hover span {
  color: var(--mainColor);
}

.blog-details-right-area .widget_block.categories-widget ul li {
  border-bottom: 1px solid #eeeeee;
  padding-bottom: 10px;
  margin-bottom: 10px;
}

.blog-details-right-area .widget_block.categories-widget ul li:last-child {
  padding-bottom: 0;
  border-bottom: none;
  margin-bottom: 0;
}

.blog-details-right-area .widget_block.categories-widget ul li a {
  position: relative;
  display: block;
  color: #545454;
}

.blog-details-right-area .widget_block.categories-widget ul li a span {
  display: block;
  margin-bottom: 5px;
  color: #545454;
  float: right;
}

.blog-details-right-area .widget_block.categories-widget ul li a:hover {
  color: var(--mainColor);
}

.blog-details-right-area .widget_block.categories-widget ul li a:hover span {
  color: var(--mainColor);
}

.blog-details-right-area .widget.widget_block .wp-block-tag-cloud a {
  border: 1px solid #eeeeee;
  padding: 10px 8px;
  margin-right: 5px;
  margin-bottom: 10px;
  display: inline-block;
  -webkit-transition: all 0.5s;
  transition: all 0.5s;
  position: relative;
  color: #545454;
  font-size: 15px !important;
}

.blog-details-right-area .widget.widget_block .wp-block-tag-cloud a:hover {
  background-color: var(--mainColor);
  color: #ffffff;
}

/*================================================
Blog Details Area CSS
=================================================*/
.blog-details-left-area {
  padding: 0px;
}

.blog-details-left-area .blog-details-single-post {
  margin-bottom: 30px;
}

.blog-details-left-area .blog-details-single-post h3 {
  font-size: 25px;
  margin-bottom: 15px;
}

.blog-details-left-area .blog-details-single-post ul {
  margin-bottom: 15px;
}

.blog-details-left-area .blog-details-single-post ul li {
  display: inline-block;
  padding: 0 10px;
  font-size: 15px;
}

.blog-details-left-area .blog-details-single-post ul li i {
  color: var(--mainColor);
  -webkit-transition: all 0.5s;
  transition: all 0.5s;
}

.blog-details-left-area .blog-details-single-post ul li:first-child {
  padding-left: 0;
  padding-right: 0;
}

.blog-details-left-area .blog-details-single-post ul li:last-child {
  padding-left: 0;
  padding-right: 0;
}

.blog-details-left-area .blog-details-single-post ul li a {
  color: #545454;
}

.blog-details-left-area .blog-details-single-post ul li a i {
  color: var(--mainColor);
  -webkit-transition: all 0.5s;
  transition: all 0.5s;
}

.blog-details-left-area .blog-details-single-post ul li a:hover {
  color: var(--mainColor);
}

.blog-details-left-area .blog-details-single-post ul li a:hover i {
  color: var(--mainColor);
}

.blog-details-left-area .blog-details-single-post ul li i {
  position: relative;
  top: 1px;
  margin-right: 5px;
}

.blog-details-left-area .blog-details-single-post .blog-details-img {
  margin-bottom: 30px;
}

.blog-details-left-area .wp-block-quote {
  background-color: var(--whiteColor);
  -webkit-box-shadow: 0 0 20px 3px rgba(0, 0, 0, 0.05);
          box-shadow: 0 0 20px 3px rgba(0, 0, 0, 0.05);
  position: relative;
  padding: 30px;
  margin-bottom: 30px;
  overflow: hidden;
}

.blog-details-left-area .wp-block-quote::before {
  content: "";
  position: absolute;
  top: 30px;
  left: 30px;
  width: 100%;
  height: 100%;
  background-image: url(../../assets/img/quate.png);
  background-position: top left;
  background-repeat: no-repeat;
}

.blog-details-left-area .wp-block-quote::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 2px;
  height: 100%;
  background-color: var(--mainColor);
}

.blog-details-left-area .wp-block-quote p {
  font-size: 20px;
  color: #595959;
  font-style: italic;
}

.blog-details-left-area .wp-block-quote span {
  font-size: 16px;
  color: var(--mainColor);
}

.blog-details-left-area .single-post-2 h3 {
  font-size: 25px;
  margin-bottom: 20px;
}

.blog-details-left-area .single-post-2 p {
  margin-bottom: 30px;
}

.blog-details-left-area .blog-details-sheare {
  margin-bottom: 35px;
}

.blog-details-left-area .blog-details-sheare .blog-sheare-tag ul li {
  display: inline-block;
  background-color: #eeeeee;
  padding: 5px 10px;
}

.blog-details-left-area .blog-details-sheare .social-icon {
  line-height: 1;
  text-align: right;
}

.blog-details-left-area .blog-details-sheare .social-icon .share {
  position: relative;
  top: -3px;
}

.blog-details-left-area .blog-details-sheare .social-icon li {
  display: inline-block;
}

.blog-details-left-area .blog-details-sheare .social-icon li a {
  padding: 0 5px;
}

.blog-details-left-area .blog-details-sheare .social-icon li a i {
  font-size: 20px;
  -webkit-transition: all 0.5s;
  transition: all 0.5s;
}

.blog-details-left-area .blog-details-sheare .social-icon li a:hover {
  color: #122738;
}

.blog-details-left-area .prev-next {
  border-top: 1px solid #eeeeee;
  border-bottom: 1px solid #eeeeee;
  padding-top: 15px;
  padding-bottom: 15px;
  position: relative;
  margin-bottom: 40px;
}

.blog-details-left-area .prev-next::before {
  content: "";
  position: absolute;
  top: 5px;
  left: 50%;
  height: 80%;
  width: 1px;
  background-color: #eeeeee;
}

.blog-details-left-area .prev-next .prev-post {
  font-size: 18px;
}

.blog-details-left-area .prev-next .prev-post a {
  color: #545454;
}

.blog-details-left-area .prev-next .prev-post a:hover {
  color: var(--mainColor);
}

.blog-details-left-area .prev-next .prev-post i {
  position: relative;
  top: 5px;
  color: var(--mainColor);
  font-size: 25px;
}

.blog-details-left-area .prev-next .next-post {
  font-size: 18px;
  float: right;
}

.blog-details-left-area .prev-next .next-post a {
  color: #545454;
}

.blog-details-left-area .prev-next .next-post a:hover {
  color: var(--mainColor);
}

.blog-details-left-area .prev-next .next-post i {
  position: relative;
  top: 6px;
  color: var(--mainColor);
  font-size: 25px;
}

.blog-details-left-area .profile {
  background-color: var(--whiteColor);
  -webkit-box-shadow: 0 0 20px 3px rgba(0, 0, 0, 0.05);
          box-shadow: 0 0 20px 3px rgba(0, 0, 0, 0.05);
  padding: 30px;
  margin-top: 40px;
  position: relative;
  padding-left: 210px;
  min-height: 160px;
}

.blog-details-left-area .profile img {
  position: absolute;
  left: 30px;
  border-radius: 50%;
}

.blog-details-left-area .profile .social-icon {
  line-height: 1;
}

.blog-details-left-area .profile .social-icon .share {
  position: relative;
  top: -3px;
}

.blog-details-left-area .profile .social-icon li {
  display: inline-block;
}

.blog-details-left-area .profile .social-icon li a {
  padding: 0 5px;
}

.blog-details-left-area .profile .social-icon li a i {
  font-size: 20px;
  -webkit-transition: all 0.5s;
  transition: all 0.5s;
}

.blog-details-left-area .profile .social-icon li a:hover {
  color: #122738;
}

.blog-details-left-area .bxl-twitter:before {
    position: relative;
    bottom: 2px;
    font-size: 18px;
}

.blog-details-left-area .comments-wrap .title {
  font-size: 25px;
  margin-top: 40px;
  margin-bottom: 40px;
}

.blog-details-left-area .comments-wrap .title span {
  font-size: 20px;
}

.blog-details-left-area .comments-wrap ul {
  margin-bottom: 0px;
}

.blog-details-left-area .comments-wrap ul li {
  position: relative;
  background-color: var(--whiteColor);
  -webkit-box-shadow: 0 0 20px 3px rgba(0, 0, 0, 0.05);
          box-shadow: 0 0 20px 3px rgba(0, 0, 0, 0.05);
  padding: 30px;
  padding-left: 150px;
  margin-bottom: 40px;
}

.blog-details-left-area .comments-wrap ul li:last-child {
  margin-bottom: 0;
}

.blog-details-left-area .comments-area.comments-wrap ul .children {
  padding: 0;
  margin: 20px 0;
}

.blog-details-left-area .comments-wrap ul li img {
  position: absolute;
  top: 35px;
  left: 30px;
}

.blog-details-left-area .comments-wrap ul li h3 {
  margin-bottom: 5px;
  font-size: 18px;
}

.blog-details-left-area .comments-wrap ul li span {
  margin-bottom: 10px;
  font-size: 15px;
}

.blog-details-left-area .comments-wrap ul li span.says {
  margin-left: 10px;
}

.blog-details-left-area .comments-wrap ul li a {
  margin: 10px 0;
}

.blog-details-left-area .comments-wrap ul .ml-30 {
  margin-left: 30px;
}

.blog-details-left-area .comments-wrap .comment-respond {
  padding: 40px;
  background-color: #ffffff;
  -webkit-box-shadow: 0 0 20px 3px rgb(0 0 0 / 5%);
  box-shadow: 0 0 20px 3px rgb(0 0 0 / 5%);
  margin: 40px 0 20px 0;
}

.blog-details-left-area .comments-wrap .comment-respond:last-child {
  margin-bottom: 0;
}

.blog-details-left-area .comment-form .comment-form-cookies-consent label {
  position: relative;
  top: -1px;
  left: 5px;
  display: inline;
}

.blog-details-left-area .comments-wrap .default-btn {
  margin: 15px 15px 0 15px;
}

@media only screen and (min-width: 768px) and (max-width: 1199px) {
  .blog-details-left-area .wp-block-image {
    width: 29.5%;
    margin: 10px 10px 30px;
    display: inline-block;
  }
}

@media only screen and (min-width: 1200px) {
  .blog-details-left-area .wp-block-image {
    width: 30.5%;
    margin: 10px 10px 30px;
    display: inline-block;
  }
}

/*================================================
Search Area CSS
=================================================*/
.search.search-results article {
  margin-bottom: 20px;
}

.search.search-results article img {
  margin-top: 20px;
  margin-bottom: 20px;
}

.search.search-results time {
  margin-right: 10px;
}

.search.search-results span {
  margin-top: 10px;
  margin-bottom: 10px;
  display: block;
}

/*================================================
Comment Area CSS
=================================================*/
ol.wp-block-latest-comments {
  box-sizing: border-box;
  margin-left: 0;
  padding: 0;
  list-style: none;
}

.has-avatars .wp-block-latest-comments__comment {
  list-style: none;
  min-height: 2.25em;
}

ol.wp-block-latest-comments__comment {
  list-style: none;
  margin-bottom: 1em;
}

.wp-block-latest-comments .avatar, .wp-block-latest-comments__comment-avatar, 
.wp-block-latest-comments .wp-block-latest-comments__comment img {
  border-radius: 1.5em;
  display: block;
  float: left;
  height: 2.5em;
  margin-right: 0.75em;
  width: 2.5em;
}

.has-avatars .wp-block-latest-comments__comment .wp-block-latest-comments__comment-excerpt, 
.has-avatars .wp-block-latest-comments__comment .wp-block-latest-comments__comment-meta {
  margin-left: 3.25em;
}

.wp-block-latest-comments__comment-date {
  display: block;
  font-size: .75em;
}

.has-avatars .wp-block-latest-comments__comment .wp-block-latest-comments__comment-excerpt, 
.has-avatars .wp-block-latest-comments__comment .wp-block-latest-comments__comment-meta {
  margin-left: 3.25em;
}

.wp-block-latest-comments__comment-excerpt p {
  font-size: .875em;
  margin: 0.36em 0 1.4em;
}

/*================================================
FAQ Area CSS
=================================================*/
.wpr-accordion-item-wrap ul {
  list-style: disc;
  padding: revert;
  margin: revert;
}

/*================================================
Vik Rent Car Area CSS
=================================================*/
.wrap.plugin-container .vrc-main-title {
  display: none;
}

.vrc-cdetails-cinfo .vrc-cdetails-cost.vrc-pref-color-text .vrcliststartfrom {
  position: relative;
  right: 10px;
  bottom: 2px;
}

.vrc-cardetails-legend form .vrcselectm {
  padding: 6px 26px 6px 10px;
}

.vrc-goback-block a, .btn, .car_buttons_box .vrc-goback-block a {
  background-color: var(--mainColor);
  color: var(--whiteColor);
}

.vrc-goback-block a:hover, .btn:hover {
  background-color: var(--secondaryColor);
  color: var(--whiteColor);
}

.vrc-oconfirm-footer .booknow {
  margin-top: 22px;
}

.vrcentercoupon .btn {
  margin-top: 10px;
}

.vrc-oconfirm-cfield-entry-checkbox > div [type="checkbox"] {
  position: relative;
  top: 2px;
  left: 4px;
}

.vrc-itinerary-confirmation .vrc-itinerary-pickup {
  padding-bottom: 24px;
}

.vrc-itinerary-confirmation > div h4 {
  margin-bottom: 0.5rem !important;
}

.vrc-alert-container-confirm, 
.wrap.plugin-container .vrc-alert-container-confirm {
  left: 35%;
  position: relative;
}

.vrclistgoon a, .vrc-car-bookingbtn .vrclistgoon a {
  text-transform: none;
}

.vrcdialog-reqinfo .vrcdialog-reqinfo-formcont input {
  width: auto;
  position: relative;
  top: 3px;
  left: 5px;
}

.vrc-cdetails-infocar .vrc-reqinfo-cont {
  margin-top: 20px;
  margin-bottom: 25px;
}

.vrc-itinerary-summary .vrc-itinerary-pickup-location, 
.vrc-itinerary-summary .vrc-itinerary-dropoff-location {
  margin-bottom: 10px;
}

.vrc-search-results-block-list .car_result {
  margin-bottom: 40px;
  padding: 10px 0;
}

.vrc-search-results-block-list .car_result:last-child {
  margin-bottom: 0px;
}

@media only screen and (max-width: 767px) {
  .vrc-alert-container-confirm, 
  .wrap.plugin-container .vrc-alert-container-confirm {
    left: 15%;
    width: 70%;
    padding: 10px;
  }
  .car_buttons_box .booknow, .vrc-showprc-form .car_buttons_box .booknow {
    margin: 0;
  }
  .vrc-oconfirm-footer .booknow {
    margin-top: 10px;
  }
  .vrcordcancbox h3 {
    font-size: 16px;
  }
  .vrc-oconfirm-footer .vrc-goback-block {
    margin: 30px 0 0;
  }
  .vrc-oconfirm-footer .vrc-save-order-block {
    margin-top: 20px;
  }
  .vrc-docsupload-container .vrc-oconfirm-footer .vrc-goback-block {
    margin: 20px 0 0;
  }
  .vrc-search-results-block-list .car_result {
    margin-bottom: 20px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991.9999px) {
  .vrc-alert-container-confirm, 
  .wrap.plugin-container .vrc-alert-container-confirm {
    left: 25%;
    width: 31%;
  }
  .vrc-search-results-block-list .car_result {
    margin-bottom: 30px;
  }
}


.mainmenu i {
  margin-right: 8px;
  color: black;
  font-size: 25px;

}

/* ========================================================================
   ZUMI DESKTOP HEADER — AUTHORITATIVE RESPONSIVE LAYOUT

   Applies only at the theme's existing desktop breakpoint (992px+).
   The mobile navigation and hamburger menu are intentionally untouched.

   This version keeps the header on one row, keeps normal/sticky logos the
   same size, gives menu sections more breathing room at intermediate widths,
   vertically centres each leading icon, and normalizes the flag-to-text gap.
   ======================================================================== */

@media only screen and (min-width: 992px) {
  /* Narrow-desktop defaults. Larger tiers below only change these variables. */
  .main-header .main-mainmenu {
    --zumi-header-side-padding: 6px;
    --zumi-logo-width: 185px;
    --zumi-nav-margin: 4px;
    --zumi-menu-font-size: 14.5px;
    --zumi-menu-item-margin: 5px;
    --zumi-menu-icon-size: 18px;
    --zumi-menu-icon-gap: 7px;
    --zumi-language-icon-gap: var(--zumi-menu-icon-gap);
    --zumi-dropdown-reserve: 10px;
    --zumi-dropdown-arrow-size: 14px;
    --zumi-action-gap: 9px;
    --zumi-action-font-size: 15px;
    --zumi-button-font-size: 15px;
    --zumi-button-padding-y: 13px;
    --zumi-button-padding-x: 14px;
    --zumi-button-icon-space: 42px;
  }

  /* Keep identical usable width before and after the header becomes sticky. */
  .main-header .main-mainmenu > .container,
  .main-header .main-mainmenu > .container-fluid,
  .main-header .main-mainmenu.main-sticky > .container,
  .main-header .main-mainmenu.main-sticky > .container-fluid {
    padding-left: var(--zumi-header-side-padding) !important;
    padding-right: var(--zumi-header-side-padding) !important;
  }

  /* The desktop logo, navigation and action columns always stay on one row. */
  .main-header .header-navbar {
    display: flex !important;
    flex-flow: row nowrap !important;
    align-items: center !important;
    justify-content: space-between !important;
    min-width: 0;
  }

  /* Normal and sticky states share one stable logo box. */
  .main-header .header-navbar .header-logo {
    flex: 0 0 var(--zumi-logo-width) !important;
    width: var(--zumi-logo-width) !important;
    max-width: var(--zumi-logo-width) !important;
    min-width: var(--zumi-logo-width) !important;
  }

  .main-header .header-navbar .header-logo > a {
    display: block;
    width: 100%;
    line-height: 1;
  }

  .main-header .header-navbar .header-logo img,
  .main-header .main-mainmenu.main-sticky .header-navbar .header-logo img {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    height: auto !important;
    max-height: none !important;
    padding: 0 !important;
    margin: 0 !important;
    object-fit: contain;
  }

  /* Navigation takes the remaining width but never wraps. */
  .main-header .header-navbar .header-main-nav,
  .main-header.header-style-1 .header-main-nav {
    flex: 1 1 auto !important;
    min-width: 0 !important;
    margin-left: var(--zumi-nav-margin) !important;
    margin-right: var(--zumi-nav-margin) !important;
  }

  .main-header .mainmenu,
  .main-header.header-style-1 .mainmenu {
    display: flex !important;
    flex-flow: row nowrap !important;
    align-items: center !important;
    justify-content: flex-end !important;
    width: 100%;
    white-space: nowrap;
  }

  .main-header .mainmenu > li,
  .main-header.header-style-1 .mainmenu > li {
    flex: 0 0 auto !important;
    margin-left: var(--zumi-menu-item-margin) !important;
    margin-right: var(--zumi-menu-item-margin) !important;
  }

  .main-header .mainmenu > li:first-child,
  .main-header.header-style-1 .mainmenu > li:first-child {
    margin-left: 0 !important;
  }

  /* Flex alignment fixes the icon baseline and creates a controlled text gap. */
  .main-header .mainmenu > li > a,
  .main-header.header-style-1 .mainmenu > li > a {
    display: flex !important;
    flex-flow: row nowrap !important;
    align-items: center !important;
    justify-content: flex-start !important;
    column-gap: var(--zumi-menu-icon-gap) !important;
    height: 60px;
    line-height: 1.2 !important;
    font-size: var(--zumi-menu-font-size) !important;
    white-space: nowrap !important;
  }

  .main-header .mainmenu > li > a > i,
  .main-header.header-style-1 .mainmenu > li > a > i {
    display: inline-flex !important;
    flex: 0 0 auto !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 0 !important;
    line-height: 1 !important;
    vertical-align: middle !important;
    font-size: var(--zumi-menu-icon-size) !important;
  }

  /* Image-based menu icons, including language flags, use the same controlled
     gap as the font icons instead of retaining plugin/theme margins. */
  .main-header .mainmenu > li > a > img,
  .main-header.header-style-1 .mainmenu > li > a > img {
    display: block !important;
    flex: 0 0 auto !important;
    margin: 0 !important;
    vertical-align: middle !important;
  }

  .main-header .mainmenu > .menu-item-has-children > a,
  .main-header.header-style-1 .mainmenu > .menu-item-has-children > a {
    margin-right: var(--zumi-dropdown-reserve) !important;
  }

  /* Centre dropdown arrows against the label instead of the link's top edge. */
  .main-header .mainmenu > .menu-item-has-children > a::after,
  .main-header.header-style-1 .mainmenu > .menu-item-has-children > a::after {
    top: 50% !important;
    right: calc(var(--zumi-dropdown-reserve) * -1) !important;
    transform: translateY(-50%) !important;
    line-height: 1 !important;
    font-size: var(--zumi-dropdown-arrow-size) !important;
  }

  /* Language selector and CTA remain beside each other and never stack. */
  .main-header .header-navbar .header-action {
    flex: 0 0 auto !important;
    min-width: max-content;
    white-space: nowrap;
  }

  .main-header .header-action > ul {
    display: flex !important;
    flex-flow: row nowrap !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: var(--zumi-action-gap) !important;
    width: max-content;
    white-space: nowrap;
  }

  .main-header .header-action > ul > li {
    flex: 0 0 auto !important;
    margin: 0 !important;
    white-space: nowrap;
  }

  .main-header .header-action > ul > li > a,
  .main-header .header-action > ul > li > span,
  .main-header .header-action .my_switcher {
    font-size: var(--zumi-action-font-size) !important;
    white-space: nowrap;
  }

  /* Keep the flag as close to “English” as every other icon is to its label.
     These selectors cover direct links and common nested translation widgets. */
  .main-header .header-action > ul > li:not(.header-btn) > a,
  .main-header .header-action > ul > li:not(.header-btn) > span,
  .main-header .header-action > ul > li:not(.header-btn) a,
  .main-header .header-action > ul > li:not(.header-btn) [role="button"] {
    display: inline-flex !important;
    flex-flow: row nowrap !important;
    align-items: center !important;
    justify-content: flex-start !important;
    column-gap: var(--zumi-language-icon-gap) !important;
    white-space: nowrap !important;
  }

  .main-header .header-action > ul > li:not(.header-btn) img,
  .main-header .header-action > ul > li:not(.header-btn) svg {
    display: block !important;
    flex: 0 0 auto !important;
    margin: 0 !important;
    vertical-align: middle !important;
  }

  .main-header .header-action .my_switcher,
  .main-header .header-action .header-btn {
    margin: 0 !important;
  }

  .main-header .header-action .header-btn .main-btn,
  .main-header .header-action .header-btn .default-btn {
    font-size: var(--zumi-button-font-size) !important;
    line-height: 1 !important;
    white-space: nowrap !important;
    padding-top: var(--zumi-button-padding-y) !important;
    padding-right: var(--zumi-button-padding-x) !important;
    padding-bottom: var(--zumi-button-padding-y) !important;
  }

  /* Preserve enough left padding for the absolutely positioned CTA icon. */
  .main-header .header-action .header-btn .main-btn.icon,
  .main-header .header-action .header-btn .default-btn.icon {
    padding-left: var(--zumi-button-icon-space) !important;
  }

  .main-header .header-action .header-btn .main-btn.icon i,
  .main-header .header-action .header-btn .default-btn.icon i {
    top: 50% !important;
    left: var(--zumi-button-padding-x) !important;
    transform: translateY(-50%) !important;
    line-height: 1 !important;
  }
}

/* 1080–1199px: larger logo and less compressed menu spacing. */
@media only screen and (min-width: 1080px) and (max-width: 1199px) {
  .main-header .main-mainmenu {
    --zumi-header-side-padding: 10px;
    --zumi-logo-width: 205px;
    --zumi-nav-margin: 6px;
    --zumi-menu-font-size: 15.5px;
    --zumi-menu-item-margin: 7px;
    --zumi-menu-icon-size: 20px;
    --zumi-menu-icon-gap: 8px;
    --zumi-language-icon-gap: var(--zumi-menu-icon-gap);
    --zumi-dropdown-reserve: 11px;
    --zumi-dropdown-arrow-size: 15px;
    --zumi-action-gap: 11px;
    --zumi-action-font-size: 15.5px;
    --zumi-button-font-size: 16px;
    --zumi-button-padding-y: 14px;
    --zumi-button-padding-x: 16px;
    --zumi-button-icon-space: 44px;
  }
}

/* 1200–1349px: medium desktop with comfortable separation. */
@media only screen and (min-width: 1200px) and (max-width: 1349px) {
  .main-header .main-mainmenu {
    --zumi-header-side-padding: 14px;
    --zumi-logo-width: 230px;
    --zumi-nav-margin: 8px;
    --zumi-menu-font-size: 16.5px;
    --zumi-menu-item-margin: 9px;
    --zumi-menu-icon-size: 21px;
    --zumi-menu-icon-gap: 9px;
    --zumi-language-icon-gap: var(--zumi-menu-icon-gap);
    --zumi-dropdown-reserve: 12px;
    --zumi-dropdown-arrow-size: 16px;
    --zumi-action-gap: 13px;
    --zumi-action-font-size: 16.5px;
    --zumi-button-font-size: 16.5px;
    --zumi-button-padding-y: 14px;
    --zumi-button-padding-x: 20px;
    --zumi-button-icon-space: 48px;
  }
}

/* 1350–1499px: standard desktop sizing with a fuller logo. */
@media only screen and (min-width: 1350px) and (max-width: 1499px) {
  .main-header .main-mainmenu {
    --zumi-header-side-padding: 18px;
    --zumi-logo-width: 255px;
    --zumi-nav-margin: 12px;
    --zumi-menu-font-size: 17.5px;
    --zumi-menu-item-margin: 12px;
    --zumi-menu-icon-size: 22px;
    --zumi-menu-icon-gap: 10px;
    --zumi-language-icon-gap: var(--zumi-menu-icon-gap);
    --zumi-dropdown-reserve: 14px;
    --zumi-dropdown-arrow-size: 17px;
    --zumi-action-gap: 16px;
    --zumi-action-font-size: 17px;
    --zumi-button-font-size: 17px;
    --zumi-button-padding-y: 15px;
    --zumi-button-padding-x: 24px;
    --zumi-button-icon-space: 50px;
  }
}

/* 1500–1699px: near-full desktop with reduced squashing. */
@media only screen and (min-width: 1500px) and (max-width: 1699px) {
  .main-header .main-mainmenu {
    --zumi-header-side-padding: 24px;
    --zumi-logo-width: 280px;
    --zumi-nav-margin: 14px;
    --zumi-menu-font-size: 18.5px;
    --zumi-menu-item-margin: 16px;
    --zumi-menu-icon-size: 23px;
    --zumi-menu-icon-gap: 11px;
    --zumi-language-icon-gap: var(--zumi-menu-icon-gap);
    --zumi-dropdown-reserve: 16px;
    --zumi-dropdown-arrow-size: 18px;
    --zumi-action-gap: 22px;
    --zumi-action-font-size: 18px;
    --zumi-button-font-size: 18px;
    --zumi-button-padding-y: 16px;
    --zumi-button-padding-x: 28px;
    --zumi-button-icon-space: 56px;
  }
}

/* 1700px and above: retain the intended large-screen appearance. */
@media only screen and (min-width: 1700px) {
  .main-header .main-mainmenu {
    --zumi-header-side-padding: 40px;
    --zumi-logo-width: 300px;
    --zumi-nav-margin: 14px;
    --zumi-menu-font-size: 20px;
    --zumi-menu-item-margin: 20px;
    --zumi-menu-icon-size: 25px;
    --zumi-menu-icon-gap: 12px;
    --zumi-language-icon-gap: var(--zumi-menu-icon-gap);
    --zumi-dropdown-reserve: 20px;
    --zumi-dropdown-arrow-size: 18px;
    --zumi-action-gap: 30px;
    --zumi-action-font-size: 20px;
    --zumi-button-font-size: 20px;
    --zumi-button-padding-y: 16px;
    --zumi-button-padding-x: 30px;
    --zumi-button-icon-space: 60px;
  }
}

/* ==========================================================================
   ZUMI HEADER — WIDTH-SAFE RESPONSIVE HEADER

   This final block fixes the two remaining edge cases:

   1. At intermediate desktop widths, the navigation and CTA are sized from
      continuous clamp() values instead of oversized step changes. The button
      therefore remains fully inside the viewport at every desktop width.
   2. Below the existing 992px desktop breakpoint, the logo is explicitly
      constrained and the CTA/hamburger row cannot force the logo to expand.

   The mobile drawer and the 992px hamburger breakpoint are not changed.
   ========================================================================== */

/* ----------------------------- DESKTOP ----------------------------------- */
@media only screen and (min-width: 992px) {
  .main-header .main-mainmenu {
    /*
     * Continuous scaling prevents the abrupt width jumps that previously
     * created a narrow range where the CTA was pushed beyond the viewport.
     */
    --zumi-header-side-padding: clamp(12px, 1.35vw, 28px);
    --zumi-logo-width: clamp(200px, 16vw, 300px);
    --zumi-nav-margin: clamp(4px, 0.45vw, 9px);

    --zumi-menu-font-size: clamp(14.5px, 1.02vw, 19px);
    --zumi-menu-item-margin: clamp(5px, 0.60vw, 12px);
    --zumi-menu-icon-size: clamp(18px, 1.25vw, 24px);
    --zumi-menu-icon-gap: clamp(6px, 0.48vw, 10px);

    --zumi-dropdown-arrow-size: clamp(14px, 1vw, 18px);
    --zumi-dropdown-label-gap: clamp(7px, 0.48vw, 10px);

    --zumi-action-gap: clamp(9px, 0.85vw, 17px);
    --zumi-action-font-size: clamp(14.5px, 1vw, 18px);

    --zumi-button-font-size: clamp(14.5px, 1vw, 18px);
    --zumi-button-padding-y: clamp(13px, 0.85vw, 16px);
    --zumi-button-padding-x: clamp(14px, 1.25vw, 24px);
    --zumi-button-icon-space: clamp(42px, 3.1vw, 56px);
  }

  /*
   * The header containers must calculate their padding inside the viewport.
   * max-width:100% prevents a Bootstrap/container rule from creating a box
   * wider than the visible browser area.
   */
  .main-header,
  .main-header .main-mainmenu,
  .main-header .main-mainmenu > .container,
  .main-header .main-mainmenu > .container-fluid,
  .main-header .main-mainmenu.main-sticky > .container,
  .main-header .main-mainmenu.main-sticky > .container-fluid {
    box-sizing: border-box !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  .main-header .main-mainmenu > .container,
  .main-header .main-mainmenu > .container-fluid,
  .main-header .main-mainmenu.main-sticky > .container,
  .main-header .main-mainmenu.main-sticky > .container-fluid {
    padding-left: var(--zumi-header-side-padding) !important;
    padding-right: var(--zumi-header-side-padding) !important;
  }

  .main-header .header-navbar {
    display: flex !important;
    flex-flow: row nowrap !important;
    align-items: center !important;
    justify-content: space-between !important;
    box-sizing: border-box !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
  }

  /* Stable logo width in both normal and sticky states. */
  .main-header .header-navbar .header-logo {
    flex: 0 0 var(--zumi-logo-width) !important;
    width: var(--zumi-logo-width) !important;
    min-width: var(--zumi-logo-width) !important;
    max-width: var(--zumi-logo-width) !important;
  }

  .main-header .header-navbar .header-logo > a {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    line-height: 1 !important;
  }

  .main-header .header-navbar .header-logo img,
  .main-header .main-mainmenu.main-sticky .header-navbar .header-logo img {
    display: block !important;
    box-sizing: border-box !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    height: auto !important;
    max-height: none !important;
    margin: 0 !important;
    padding: 0 !important;
    object-fit: contain !important;
  }

  /*
   * Navigation owns the flexible middle column. flex-basis:0 is important:
   * it makes the browser divide the real available width instead of treating
   * the menu's intrinsic no-wrap width as a minimum.
   */
  .main-header .header-navbar .header-main-nav,
  .main-header.header-style-1 .header-main-nav {
    flex: 1 1 0 !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    margin-left: var(--zumi-nav-margin) !important;
    margin-right: var(--zumi-nav-margin) !important;
  }

  .main-header .mainmenu,
  .main-header.header-style-1 .mainmenu {
    display: flex !important;
    flex-flow: row nowrap !important;
    align-items: center !important;
    justify-content: flex-end !important;
    width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    white-space: nowrap !important;
  }

  .main-header .mainmenu > li,
  .main-header.header-style-1 .mainmenu > li {
    flex: 0 0 auto !important;
    margin-left: var(--zumi-menu-item-margin) !important;
    margin-right: var(--zumi-menu-item-margin) !important;
  }

  .main-header .mainmenu > li:first-child,
  .main-header.header-style-1 .mainmenu > li:first-child {
    margin-left: 0 !important;
  }

  .main-header .mainmenu > li > a,
  .main-header.header-style-1 .mainmenu > li > a {
    display: flex !important;
    flex-flow: row nowrap !important;
    align-items: center !important;
    justify-content: flex-start !important;
    column-gap: var(--zumi-menu-icon-gap) !important;
    height: 60px !important;
    line-height: 1.2 !important;
    font-size: var(--zumi-menu-font-size) !important;
    white-space: nowrap !important;
  }

  .main-header .mainmenu > li > a > i,
  .main-header.header-style-1 .mainmenu > li > a > i {
    display: inline-flex !important;
    flex: 0 0 auto !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 0 !important;
    line-height: 1 !important;
    font-size: var(--zumi-menu-icon-size) !important;
  }

  /*
   * Reserve the dropdown arrow inside the link. The category name, arrow and
   * following category now each have their own independent spacing.
   */
  .main-header .mainmenu > .menu-item-has-children > a,
  .main-header.header-style-1 .mainmenu > .menu-item-has-children > a {
    box-sizing: border-box !important;
    margin-right: 0 !important;
    padding-right:
      calc(var(--zumi-dropdown-arrow-size) + var(--zumi-dropdown-label-gap))
      !important;
  }

  .main-header .mainmenu > .menu-item-has-children > a::after,
  .main-header.header-style-1 .mainmenu > .menu-item-has-children > a::after {
    top: 50% !important;
    right: 0 !important;
    transform: translateY(-50%) !important;
    margin: 0 !important;
    line-height: 1 !important;
    font-size: var(--zumi-dropdown-arrow-size) !important;
  }

  /*
   * Do not use min-width:max-content here. That declaration was the direct
   * reason the action column could push the CTA past the right viewport edge.
   */
  .main-header .header-navbar .header-action {
    flex: 0 1 auto !important;
    box-sizing: border-box !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: calc(100% - var(--zumi-logo-width) - 20px) !important;
    margin: 0 !important;
    padding-right: 2px !important;
    white-space: nowrap !important;
  }

  .main-header .header-action > ul {
    display: flex !important;
    flex-flow: row nowrap !important;
    align-items: center !important;
    justify-content: flex-end !important;
    box-sizing: border-box !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: 100% !important;
    gap: var(--zumi-action-gap) !important;
    margin: 0 !important;
    white-space: nowrap !important;
  }

  .main-header .header-action > ul > li {
    flex: 0 1 auto !important;
    min-width: 0 !important;
    margin: 0 !important;
    white-space: nowrap !important;
  }

  .main-header .header-action .my_switcher,
  .main-header .header-action .header-btn {
    margin: 0 !important;
  }

  .main-header .header-action .header-btn,
  .main-header .header-action .header-btn > a {
    box-sizing: border-box !important;
    max-width: 100% !important;
  }

  .main-header .header-action .header-btn .main-btn,
  .main-header .header-action .header-btn .default-btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-sizing: border-box !important;
    max-width: 100% !important;
    font-size: var(--zumi-button-font-size) !important;
    line-height: 1 !important;
    white-space: nowrap !important;
    padding-top: var(--zumi-button-padding-y) !important;
    padding-right: var(--zumi-button-padding-x) !important;
    padding-bottom: var(--zumi-button-padding-y) !important;
  }

  .main-header .header-action .header-btn .main-btn.icon,
  .main-header .header-action .header-btn .default-btn.icon {
    padding-left: var(--zumi-button-icon-space) !important;
  }

  .main-header .header-action .header-btn .main-btn.icon i,
  .main-header .header-action .header-btn .default-btn.icon i {
    top: 50% !important;
    left: var(--zumi-button-padding-x) !important;
    transform: translateY(-50%) !important;
    line-height: 1 !important;
  }
}

/*
 * Extra safety close to the desktop breakpoint. This still uses the normal
 * desktop menu; it does not activate or alter the hamburger menu.
 */
@media only screen and (min-width: 992px) and (max-width: 1099px) {
  .main-header .main-mainmenu {
    --zumi-logo-width: 190px;
    --zumi-menu-font-size: 14px;
    --zumi-menu-item-margin: 4px;
    --zumi-menu-icon-size: 18px;
    --zumi-menu-icon-gap: 5px;
    --zumi-dropdown-label-gap: 6px;
    --zumi-action-gap: 7px;
    --zumi-action-font-size: 14px;
    --zumi-button-font-size: 14px;
    --zumi-button-padding-x: 12px;
    --zumi-button-icon-space: 39px;
  }
}

/* ------------------------ MOBILE HEADER ROW ------------------------------ */
@media only screen and (max-width: 991.9999px) {
  .main-header .main-mainmenu,
  .main-header .main-mainmenu.main-sticky,
  .main-header .main-mainmenu > .container,
  .main-header .main-mainmenu > .container-fluid,
  .main-header .main-mainmenu.main-sticky > .container,
  .main-header .main-mainmenu.main-sticky > .container-fluid {
    box-sizing: border-box !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  .main-header .main-mainmenu > .container,
  .main-header .main-mainmenu > .container-fluid,
  .main-header .main-mainmenu.main-sticky > .container,
  .main-header .main-mainmenu.main-sticky > .container-fluid {
    padding-left: 16px !important;
    padding-right: 16px !important;
  }

  .main-header .header-navbar {
    display: flex !important;
    flex-flow: row nowrap !important;
    align-items: center !important;
    justify-content: space-between !important;
    box-sizing: border-box !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
  }

  /*
   * Strong max-width rules prevent the uploaded high-resolution logo from
   * expanding to its intrinsic image width at the mobile breakpoint.
   */
  .main-header .header-navbar .header-logo {
    flex: 0 1 clamp(190px, 30vw, 250px) !important;
    width: clamp(190px, 30vw, 250px) !important;
    min-width: 0 !important;
    max-width: 250px !important;
  }

  .main-header .header-navbar .header-logo > a {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    line-height: 1 !important;
  }

  .main-header .header-navbar .header-logo img,
  .main-header .main-mainmenu.main-sticky .header-navbar .header-logo img {
    display: block !important;
    box-sizing: border-box !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    height: auto !important;
    max-height: none !important;
    margin: 0 !important;
    padding: 0 !important;
    object-fit: contain !important;
  }

  .main-header .header-navbar .header-main-nav,
  .main-header.header-style-1 .header-main-nav {
    margin: 0 !important;
  }

  .main-header .header-navbar .header-action {
    flex: 0 1 auto !important;
    min-width: 0 !important;
    max-width: calc(100% - 202px) !important;
    margin-left: auto !important;
  }

  .main-header .header-action > ul {
    display: flex !important;
    flex-flow: row nowrap !important;
    align-items: center !important;
    justify-content: flex-end !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: 100% !important;
    gap: 10px !important;
    margin: 0 !important;
  }

  .main-header .header-action > ul > li {
    flex: 0 1 auto !important;
    min-width: 0 !important;
    margin: 0 !important;
  }

  .main-header .header-action .header-btn {
    margin: 0 !important;
  }

  .main-header .header-action .header-btn .main-btn,
  .main-header .header-action .header-btn .default-btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-sizing: border-box !important;
    max-width: 100% !important;
    font-size: 14px !important;
    line-height: 1 !important;
    white-space: nowrap !important;
    padding: 12px 14px 12px 42px !important;
  }

  .main-header .header-action .header-btn .main-btn.icon i,
  .main-header .header-action .header-btn .default-btn.icon i {
    left: 14px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
  }
}

/* Slightly tighter header row before the existing 575px CTA-hide rule. */
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .main-header .main-mainmenu > .container,
  .main-header .main-mainmenu > .container-fluid,
  .main-header .main-mainmenu.main-sticky > .container,
  .main-header .main-mainmenu.main-sticky > .container-fluid {
    padding-left: 12px !important;
    padding-right: 12px !important;
  }

  .main-header .header-navbar .header-logo {
    flex-basis: clamp(180px, 31vw, 220px) !important;
    width: clamp(180px, 31vw, 220px) !important;
    max-width: 220px !important;
  }

  .main-header .header-navbar .header-action {
    max-width: calc(100% - 190px) !important;
  }

  .main-header .header-action > ul {
    gap: 8px !important;
  }

  .main-header .header-action .header-btn .main-btn,
  .main-header .header-action .header-btn .default-btn {
    font-size: 13.5px !important;
    padding: 11px 12px 11px 38px !important;
  }

  .main-header .header-action .header-btn .main-btn.icon i,
  .main-header .header-action .header-btn .default-btn.icon i {
    left: 12px !important;
  }
}

/* ZUMI DESKTOP DROPDOWNS — COMPACT, CONTENT-SIZED, SINGLE-LINE */
@media only screen and (min-width: 992px) {
  /* Shrink each dropdown to its longest item instead of using the old 265px box. */
  .main-header .mainmenu > .menu-item-has-children > .main-submenu,
  .main-header.header-style-1 .mainmenu > .menu-item-has-children > .main-submenu,
  .main-header .mainmenu .main-submenu .main-submenu,
  .main-header.header-style-1 .mainmenu .main-submenu .main-submenu {
    box-sizing: border-box !important;
    width: max-content !important;
    min-width: 0 !important;
    max-width: calc(100vw - 24px) !important;
    padding: 7px !important;
    border-radius: 6px !important;
  }

  .main-header .mainmenu .main-submenu > li,
  .main-header.header-style-1 .mainmenu .main-submenu > li {
    box-sizing: border-box !important;
    width: 100% !important;
  }

  /* Keep the icon and label together on one clean row. */
  .main-header .mainmenu .main-submenu > li > a,
  .main-header.header-style-1 .mainmenu .main-submenu > li > a {
    display: flex !important;
    flex-flow: row nowrap !important;
    align-items: center !important;
    column-gap: 8px !important;
    box-sizing: border-box !important;
    width: 100% !important;
    min-width: max-content !important;
    padding: 7px 10px !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    line-height: 1.2 !important;
    white-space: nowrap !important;
  }

  .main-header .mainmenu .main-submenu > li > a > i,
  .main-header.header-style-1 .mainmenu .main-submenu > li > a > i {
    display: inline-flex !important;
    flex: 0 0 18px !important;
    align-items: center !important;
    justify-content: center !important;
    width: 18px !important;
    margin: 0 !important;
    font-size: 17px !important;
    line-height: 1 !important;
  }
}


/* ========================================================================
   ZUMI FINAL HEADER FIX — 991px TABLET TRANSITION + LARGE DESKTOP DROPDOWNS
   ======================================================================== */

/*
 * The theme changes from the desktop navigation to the mobile navigation at
 * 991px. Keep the tablet/mobile header visually close to the 992px desktop
 * size so the logo, language switcher and controls do not suddenly enlarge.
 */
@media only screen and (min-width: 768px) and (max-width: 991.9999px) {
  .main-header .header-navbar .header-logo {
    flex: 0 0 clamp(190px, 21vw, 210px) !important;
    width: clamp(190px, 21vw, 210px) !important;
    min-width: clamp(190px, 21vw, 210px) !important;
    max-width: 210px !important;
  }

  .main-header .header-navbar .header-action {
    max-width: calc(100% - 206px) !important;
  }
}

/* Prevent the circular language image from escaping its 50px switcher box. */
@media only screen and (max-width: 991.9999px) {
  .main-header .header-action .my_switcher {
    flex: 0 0 44px !important;
    width: 44px !important;
    min-width: 44px !important;
    max-width: 44px !important;
    height: 44px !important;
    min-height: 44px !important;
    max-height: 44px !important;
    line-height: 44px !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
  }

  .main-header .header-action .my_switcher > *,
  .main-header .header-action .my_switcher ul,
  .main-header .header-action .my_switcher li,
  .main-header .header-action .my_switcher a {
    box-sizing: border-box !important;
    width: 100% !important;
    max-width: 44px !important;
    height: 100% !important;
    max-height: 44px !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  .main-header .header-action .my_switcher img,
  .main-header .header-action .my_switcher svg {
    display: block !important;
    width: 44px !important;
    max-width: 44px !important;
    height: 44px !important;
    max-height: 44px !important;
    margin: 0 !important;
    object-fit: contain !important;
  }
}

/* Make dropdown panels and their rows proportionally larger only on the
   largest desktop tier. Smaller desktop and hamburger layouts are untouched. */
@media only screen and (min-width: 1700px) {
  .main-header .mainmenu > .menu-item-has-children > .main-submenu,
  .main-header.header-style-1 .mainmenu > .menu-item-has-children > .main-submenu,
  .main-header .mainmenu .main-submenu .main-submenu,
  .main-header.header-style-1 .mainmenu .main-submenu .main-submenu {
    padding: 11px !important;
    border-radius: 8px !important;
  }

  .main-header .mainmenu .main-submenu > li > a,
  .main-header.header-style-1 .mainmenu .main-submenu > li > a {
    column-gap: 10px !important;
    padding: 11px 16px !important;
    font-size: 17px !important;
    line-height: 1.3 !important;
  }

  .main-header .mainmenu .main-submenu > li > a > i,
  .main-header.header-style-1 .mainmenu .main-submenu > li > a > i {
    flex-basis: 22px !important;
    width: 22px !important;
    font-size: 21px !important;
  }
}

/* ========================================================================
   ZUMI FINAL DESKTOP SCALE — MODERATELY LARGER, STILL WIDTH-SAFE

   Slightly enlarges every fluid desktop header value without recreating the
   excessive jump from the previous extra-large version. Mobile/hamburger
   sizing at 991px and below remains unchanged.
   ======================================================================== */
@media only screen and (min-width: 992px) {
  .main-header .main-mainmenu {
    --zumi-header-side-padding: clamp(13px, 1.42vw, 30px);
    --zumi-logo-width: clamp(205px, 16.4vw, 310px);
    --zumi-nav-margin: clamp(5px, 0.50vw, 10px);

    --zumi-menu-font-size: clamp(15px, 1.06vw, 20px);
    --zumi-menu-item-margin: clamp(5.5px, 0.64vw, 13px);
    --zumi-menu-icon-size: clamp(19px, 1.30vw, 25px);
    --zumi-menu-icon-gap: clamp(7px, 0.52vw, 11px);
    --zumi-language-icon-gap: var(--zumi-menu-icon-gap);

    --zumi-dropdown-arrow-size: clamp(15px, 1.03vw, 19px);
    --zumi-dropdown-label-gap: clamp(8px, 0.52vw, 11px);

    --zumi-action-gap: clamp(10px, 0.92vw, 19px);
    --zumi-action-font-size: clamp(15px, 1.04vw, 19px);

    --zumi-button-font-size: clamp(15px, 1.04vw, 19px);
    --zumi-button-padding-y: clamp(14px, 0.90vw, 17px);
    --zumi-button-padding-x: clamp(15px, 1.32vw, 26px);
    --zumi-button-icon-space: clamp(44px, 3.20vw, 58px);
  }

  .main-header .mainmenu > li > a,
  .main-header.header-style-1 .mainmenu > li > a {
    height: 62px !important;
  }

  /* Dropdowns now scale gently with the desktop viewport. */
  .main-header .mainmenu > .menu-item-has-children > .main-submenu,
  .main-header.header-style-1 .mainmenu > .menu-item-has-children > .main-submenu,
  .main-header .mainmenu .main-submenu .main-submenu,
  .main-header.header-style-1 .mainmenu .main-submenu .main-submenu {
    padding: clamp(8px, 0.55vw, 11px) !important;
    border-radius: clamp(7px, 0.45vw, 8px) !important;
  }

  .main-header .mainmenu .main-submenu > li > a,
  .main-header.header-style-1 .mainmenu .main-submenu > li > a {
    column-gap: clamp(9px, 0.55vw, 11px) !important;
    padding:
      clamp(8px, 0.62vw, 11px)
      clamp(11px, 0.90vw, 16px) !important;
    font-size: clamp(15px, 0.92vw, 17px) !important;
    line-height: 1.25 !important;
  }

  .main-header .mainmenu .main-submenu > li > a > i,
  .main-header.header-style-1 .mainmenu .main-submenu > li > a > i {
    flex-basis: clamp(19px, 1.20vw, 22px) !important;
    width: clamp(19px, 1.20vw, 22px) !important;
    font-size: clamp(18px, 1.15vw, 21px) !important;
  }
}

/* Preserve the same restrained increase close to the desktop breakpoint. */
@media only screen and (min-width: 992px) and (max-width: 1099px) {
  .main-header .main-mainmenu {
    --zumi-logo-width: 195px;
    --zumi-menu-font-size: 14.5px;
    --zumi-menu-item-margin: 4.5px;
    --zumi-menu-icon-size: 19px;
    --zumi-menu-icon-gap: 6px;
    --zumi-dropdown-label-gap: 7px;
    --zumi-action-gap: 8px;
    --zumi-action-font-size: 14.5px;
    --zumi-button-font-size: 14.5px;
    --zumi-button-padding-x: 13px;
    --zumi-button-icon-space: 41px;
  }
}

/* Largest monitors receive one additional small step, not an oversized jump. */
@media only screen and (min-width: 1700px) {
  .main-header .mainmenu > .menu-item-has-children > .main-submenu,
  .main-header.header-style-1 .mainmenu > .menu-item-has-children > .main-submenu,
  .main-header .mainmenu .main-submenu .main-submenu,
  .main-header.header-style-1 .mainmenu .main-submenu .main-submenu {
    padding: 12px !important;
  }

  .main-header .mainmenu .main-submenu > li > a,
  .main-header.header-style-1 .mainmenu .main-submenu > li > a {
    column-gap: 11px !important;
    padding: 12px 17px !important;
    font-size: 18px !important;
  }

  .main-header .mainmenu .main-submenu > li > a > i,
  .main-header.header-style-1 .mainmenu .main-submenu > li > a > i {
    flex-basis: 23px !important;
    width: 23px !important;
    font-size: 22px !important;
  }
}


/* ========================================================================
   ZUMI LARGEST DESKTOP — SMALL ADDITIONAL SCALE STEP

   A restrained increase for very large displays only. All lower desktop
   tiers and the 991px-and-below hamburger header remain unchanged.
   ======================================================================== */
@media only screen and (min-width: 1700px) {
  .main-header .main-mainmenu {
    --zumi-header-side-padding: 31px;
    --zumi-logo-width: 320px;
    --zumi-nav-margin: 11px;

    --zumi-menu-font-size: 21px;
    --zumi-menu-item-margin: 14px;
    --zumi-menu-icon-size: 26px;
    --zumi-menu-icon-gap: 11px;
    --zumi-language-icon-gap: var(--zumi-menu-icon-gap);

    --zumi-dropdown-arrow-size: 20px;
    --zumi-dropdown-label-gap: 12px;

    --zumi-action-gap: 20px;
    --zumi-action-font-size: 20px;

    --zumi-button-font-size: 20px;
    --zumi-button-padding-y: 18px;
    --zumi-button-padding-x: 27px;
    --zumi-button-icon-space: 60px;
  }

  .main-header .mainmenu > li > a,
  .main-header.header-style-1 .mainmenu > li > a {
    height: 64px !important;
  }

  .main-header .mainmenu > .menu-item-has-children > .main-submenu,
  .main-header.header-style-1 .mainmenu > .menu-item-has-children > .main-submenu,
  .main-header .mainmenu .main-submenu .main-submenu,
  .main-header.header-style-1 .mainmenu .main-submenu .main-submenu {
    padding: 13px !important;
    border-radius: 9px !important;
  }

  .main-header .mainmenu .main-submenu > li > a,
  .main-header.header-style-1 .mainmenu .main-submenu > li > a {
    column-gap: 12px !important;
    padding: 13px 18px !important;
    font-size: 19px !important;
    line-height: 1.28 !important;
  }

  .main-header .mainmenu .main-submenu > li > a > i,
  .main-header.header-style-1 .mainmenu .main-submenu > li > a > i {
    flex-basis: 24px !important;
    width: 24px !important;
    font-size: 23px !important;
  }
}

/* ========================================================================
   ZUMI 991PX BREAKPOINT LOCK — FINAL

   The existing mobile/tablet rules now remain active through 991.9999px.
   Desktop behavior still begins at 992px, so every fractional viewport width
   resolves to one complete layout instead of falling between both tiers.
   ======================================================================== */
/* Shadow on the normal header only */
.main-header .main-mainmenu:not(.main-sticky) {
  position: relative;
  z-index: 5;
  background-color: var(--whiteColor);
  box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.1);
}

/* Ensure the scrolled header remains fixed and visible */
.main-header .main-mainmenu.main-sticky {
  position: fixed;
  top: 0;
  right: 0;
  left: 0;
  z-index: 9999;
  background-color: var(--whiteColor);
  box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.1);
}

@media only screen and (max-width: 767px) {
    .go-top {
        display: none !important;
    }
}
/* ========================================================================
   ZUMI NAVIGATION PALETTE LOCK — LIGHT / PROFESSIONAL
   Layout and spacing intentionally unchanged.
   ======================================================================== */
.main-header {
  --zumi-nav-accent: #E86A24;
  --zumi-nav-accent-hover: #F07836;
  --zumi-nav-bg: #FFFFFF;
  --zumi-nav-bg-soft: #F6F7F5;
  --zumi-nav-panel: rgba(255, 255, 255, 0.985);
  --zumi-nav-text: #444A46;
  --zumi-nav-muted: #707671;
  --zumi-nav-border: rgba(17, 24, 20, 0.10);
  --zumi-nav-border-strong: rgba(17, 24, 20, 0.16);
  --zumi-nav-shadow: 0 18px 50px rgba(18, 24, 20, 0.13);
}

/* Main header surface — normal and sticky. */
.main-header .main-mainmenu,
.main-header .main-mainmenu:not(.main-sticky),
.main-header .main-mainmenu.main-sticky,
.main-header.header-style-1 .main-mainmenu,
.main-header.header-style-1 .main-mainmenu.main-sticky {
  color: var(--zumi-nav-text) !important;
  background: rgba(255, 255, 255, 0.975) !important;
  border-bottom-color: rgba(17, 24, 20, 0.09) !important;
}

.main-header .main-mainmenu.main-sticky,
.main-header.header-style-1 .main-mainmenu.main-sticky {
  box-shadow: 0 8px 28px rgba(18, 24, 20, 0.10) !important;
}

/* Primary labels are charcoal; icons stay true black. */
.main-header .mainmenu > li > a,
.main-header.header-style-1 .mainmenu > li > a {
  color: #444A46 !important;
}

.main-header .mainmenu > li > a > i,
.main-header.header-style-1 .mainmenu > li > a > i,
.main-header .mainmenu > li > a > svg,
.main-header.header-style-1 .mainmenu > li > a > svg {
  color: #101211 !important;
}

.main-header .mainmenu > li > a > svg,
.main-header.header-style-1 .mainmenu > li > a > svg {
  fill: currentColor;
  stroke: currentColor;
}

.main-header .mainmenu > li > a:hover,
.main-header .mainmenu > li.active > a,
.main-header .mainmenu > li.current-menu-item > a,
.main-header .mainmenu > li.current-menu-ancestor > a,
.main-header.header-style-1 .mainmenu > li > a:hover,
.main-header.header-style-1 .mainmenu > li.active > a,
.main-header.header-style-1 .mainmenu > li.current-menu-item > a,
.main-header.header-style-1 .mainmenu > li.current-menu-ancestor > a {
  color: #242825 !important;
  background: rgba(17, 24, 20, 0.045) !important;
}

/* Keep the icon black even when the parent link is hovered/active. */
.main-header .mainmenu > li > a:hover > i,
.main-header .mainmenu > li.active > a > i,
.main-header .mainmenu > li.current-menu-item > a > i,
.main-header .mainmenu > li.current-menu-ancestor > a > i {
  color: #000000 !important;
}

/* Dropdown cards — bright surface, dark labels, restrained orange hover. */
.main-header .mainmenu .main-submenu,
.main-header.header-style-1 .mainmenu .main-submenu {
  color: #3F4541 !important;
  background: rgba(255, 255, 255, 0.99) !important;
  border-color: rgba(17, 24, 20, 0.11) !important;
  box-shadow: 0 18px 48px rgba(18, 24, 20, 0.15) !important;
}

.main-header .mainmenu .main-submenu > li > a,
.main-header.header-style-1 .mainmenu .main-submenu > li > a {
  color: #4A504C !important;
}

.main-header .mainmenu .main-submenu > li > a > i,
.main-header.header-style-1 .mainmenu .main-submenu > li > a > i {
  color: #000000 !important;
}

.main-header .mainmenu .main-submenu > li > a:hover,
.main-header .mainmenu .main-submenu > li.active > a,
.main-header .mainmenu .main-submenu > li.current-menu-item > a,
.main-header.header-style-1 .mainmenu .main-submenu > li > a:hover,
.main-header.header-style-1 .mainmenu .main-submenu > li.active > a,
.main-header.header-style-1 .mainmenu .main-submenu > li.current-menu-item > a {
  color: #272C28 !important;
  background: rgba(232, 106, 36, 0.09) !important;
}

/* Language selector. */
.main-header .header-action .my_switcher {
  color: #444A46 !important;
  background: #F6F7F5 !important;
  border-color: rgba(17, 24, 20, 0.10) !important;
}

.main-header .header-action .my_switcher:hover {
  color: #262A27 !important;
  background: #EFF1EE !important;
  border-color: rgba(17, 24, 20, 0.16) !important;
}

.main-header .header-action .my_switcher a,
.main-header .header-action .my_switcher span,
.main-header .header-action .my_switcher [role="button"],
.main-header .header-action .my_switcher li {
  color: inherit !important;
}

/* Hamburger / auxiliary controls use a light button with black glyphs. */
.main-header .header-action .mobile-menu-btn .btn-wrap,
.main-header .header-action .sidemenu-btn .btn-wrap {
  color: #111311 !important;
  background: #F6F7F5 !important;
  border-color: rgba(17, 24, 20, 0.10) !important;
}

.main-header .header-action .mobile-menu-btn .btn-wrap:hover,
.main-header .header-action .sidemenu-btn .btn-wrap:hover {
  color: #000000 !important;
  background: #ECEEEC !important;
  border-color: rgba(17, 24, 20, 0.16) !important;
}

/* Drawer header controls and optional off-canvas surface follow the light palette. */
.mobile-nav-header {
  border-bottom-color: rgba(17, 24, 20, 0.10) !important;
}

.mobile-nav-header .mobile-menu-close,
.main-header.header-style-1 .mobile-nav-header .mobile-menu-close {
  color: #111311 !important;
  background: #F3F4F2 !important;
  border-color: rgba(17, 24, 20, 0.10) !important;
}

.mobile-nav-header .mobile-menu-close:hover {
  color: #000000 !important;
  background: rgba(232, 106, 36, 0.10) !important;
  border-color: rgba(232, 106, 36, 0.28) !important;
}

.header-offcanvasmenu {
  color: #444A46 !important;
  background: #FFFFFF !important;
  border-left-color: rgba(17, 24, 20, 0.10) !important;
}

.header-offcanvasmenu .offcanvas-body .main-navigation li a {
  color: #444A46 !important;
}

.header-offcanvasmenu .offcanvas-body .main-navigation li a:hover,
.header-offcanvasmenu .offcanvas-body .main-navigation li a.active {
  color: var(--zumi-nav-accent) !important;
}

/* CTA intentionally remains orange with white copy for contrast. */
.main-header .header-action .header-btn .main-btn,
.main-header .header-action .header-btn .default-btn,
.main-header .header-action .header-btn .main-btn:hover,
.main-header .header-action .header-btn .default-btn:hover,
.main-header .header-action .header-btn .main-btn i,
.main-header .header-action .header-btn .default-btn i {
  color: #FFFFFF !important;
}

/* ========================================================================
   ZUMI NAVIGATION TYPOGRAPHY + CARET POLISH — FINAL
   Layout/spacing is intentionally unchanged.
   ======================================================================== */
@media only screen and (min-width: 992px) {
  .main-header .mainmenu > li > a,
  .main-header.header-style-1 .mainmenu > li > a {
    font-weight: 500 !important;
  }

  .main-header .mainmenu .main-submenu > li > a,
  .main-header.header-style-1 .mainmenu .main-submenu > li > a {
    font-weight: 450 !important;
  }

  /* A simple typographic caret is cleaner than the old hand-drawn border arrow. */
  .main-header .mainmenu > .menu-item-has-children > a::after,
  .main-header.header-style-1 .mainmenu > .menu-item-has-children > a::after {
    content: "▾" !important;
    display: block !important;
    top: 50% !important;
    right: 8px !important;
    width: auto !important;
    height: auto !important;
    margin: 0 !important;
    border: 0 !important;
    color: #737A75 !important;
    font-family: Arial, sans-serif !important;
    font-size: 12px !important;
    font-weight: 400 !important;
    line-height: 1 !important;
    transform: translateY(-50%) !important;
    transition: color 150ms ease !important;
  }

  .main-header .mainmenu > .menu-item-has-children:hover > a::after,
  .main-header .mainmenu > .menu-item-has-children:focus-within > a::after,
  .main-header.header-style-1 .mainmenu > .menu-item-has-children:hover > a::after,
  .main-header.header-style-1 .mainmenu > .menu-item-has-children:focus-within > a::after {
    content: "▴" !important;
    color: #252925 !important;
    transform: translateY(-50%) !important;
  }
}


/* ========================================================================
   ZUMI NAVIGATION — VERTICAL ACCENTS + RELIABLE DESKTOP HOVER CORRIDORS
   Final override. Keeps approved sizing/spacing and light palette intact.
   ======================================================================== */
@media only screen and (min-width: 992px) {
  /* Replace the old horizontal active underline with a restrained vertical rail. */
  .main-header .mainmenu > li > a::before,
  .main-header.header-style-1 .mainmenu > li > a::before {
    content: "" !important;
    position: absolute !important;
    top: 50% !important;
    bottom: auto !important;
    left: 2px !important;
    right: auto !important;
    width: 2px !important;
    height: 22px !important;
    border-radius: 999px !important;
    background: var(--zumi-nav-accent) !important;
    opacity: 0.38 !important;
    transform: translateY(-50%) scaleY(.72) !important;
    transform-origin: center !important;
    transition: opacity 150ms ease, transform 150ms ease !important;
  }

  .main-header .mainmenu > li > a:hover::before,
  .main-header .mainmenu > li.active > a::before,
  .main-header .mainmenu > li.current-menu-item > a::before,
  .main-header .mainmenu > li.current-menu-ancestor > a::before,
  .main-header.header-style-1 .mainmenu > li > a:hover::before,
  .main-header.header-style-1 .mainmenu > li.active > a::before,
  .main-header.header-style-1 .mainmenu > li.current-menu-item > a::before,
  .main-header.header-style-1 .mainmenu > li.current-menu-ancestor > a::before {
    opacity: 1 !important;
    transform: translateY(-50%) scaleY(1) !important;
  }

  /* Dropdown rows get the same orange language in a smaller form. */
  .main-header .mainmenu .main-submenu > li > a,
  .main-header.header-style-1 .mainmenu .main-submenu > li > a {
    position: relative !important;
  }

  .main-header .mainmenu .main-submenu > li > a::before,
  .main-header.header-style-1 .mainmenu .main-submenu > li > a::before {
    content: "" !important;
    position: absolute !important;
    top: 50% !important;
    left: 4px !important;
    width: 2px !important;
    height: 18px !important;
    border-radius: 999px !important;
    background: var(--zumi-nav-accent) !important;
    opacity: .24 !important;
    transform: translateY(-50%) scaleY(.72) !important;
    transition: opacity 140ms ease, transform 140ms ease !important;
  }

  .main-header .mainmenu .main-submenu > li > a:hover::before,
  .main-header .mainmenu .main-submenu > li.active > a::before,
  .main-header .mainmenu .main-submenu > li.current-menu-item > a::before,
  .main-header.header-style-1 .mainmenu .main-submenu > li > a:hover::before,
  .main-header.header-style-1 .mainmenu .main-submenu > li.active > a::before,
  .main-header.header-style-1 .mainmenu .main-submenu > li.current-menu-item > a::before {
    opacity: 1 !important;
    transform: translateY(-50%) scaleY(1) !important;
  }

  /*
   * Eliminate the mouse dead-zone between a parent item and its dropdown.
   * The panel may still look visually separated, but its hover hit-area now
   * reaches back to the parent so the menu cannot collapse mid-move.
   */
  .main-header .mainmenu > .menu-item-has-children > .main-submenu,
  .main-header.header-style-1 .mainmenu > .menu-item-has-children > .main-submenu {
    top: calc(100% + 6px) !important;
  }

  .main-header .mainmenu > .menu-item-has-children > .main-submenu::before,
  .main-header.header-style-1 .mainmenu > .menu-item-has-children > .main-submenu::before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: -8px;
    height: 8px;
    background: transparent;
    pointer-events: auto;
  }

  /* Nested dropdowns get a horizontal hover corridor as well. */
  .main-header .mainmenu .main-submenu .menu-item-has-children > .main-submenu,
  .main-header.header-style-1 .mainmenu .main-submenu .menu-item-has-children > .main-submenu {
    top: -8px !important;
    left: calc(100% + 6px) !important;
  }

  .main-header .mainmenu > li:nth-last-child(-n+2) .main-submenu .menu-item-has-children > .main-submenu,
  .main-header.header-style-1 .mainmenu > li:nth-last-child(-n+2) .main-submenu .menu-item-has-children > .main-submenu {
    right: calc(100% + 6px) !important;
    left: auto !important;
  }

  .main-header .mainmenu .main-submenu .menu-item-has-children > .main-submenu::before,
  .main-header.header-style-1 .mainmenu .main-submenu .menu-item-has-children > .main-submenu::before {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: -8px;
    width: 8px;
    height: auto;
    background: transparent;
    pointer-events: auto;
  }

  .main-header .mainmenu > li:nth-last-child(-n+2) .main-submenu .menu-item-has-children > .main-submenu::before,
  .main-header.header-style-1 .mainmenu > li:nth-last-child(-n+2) .main-submenu .menu-item-has-children > .main-submenu::before {
    left: auto;
    right: -8px;
  }

  /* Keep the panel interactive while the pointer is over the bridge or panel. */
  .main-header .mainmenu .main-submenu:hover,
  .main-header.header-style-1 .mainmenu .main-submenu:hover {
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    transform: translateY(0) scale(1) !important;
  }
}

/* ========================================================================
   ZUMI MOBILE LOGO — SLIGHT SIZE INCREASE
   Final override. Keeps existing header controls and spacing unchanged.
   ======================================================================== */
@media only screen and (max-width: 767.9999px) {
  .main-header .header-navbar .header-logo {
    flex: 0 1 clamp(168px, 46vw, 205px) !important;
    flex-basis: clamp(168px, 46vw, 205px) !important;
    width: clamp(168px, 46vw, 205px) !important;
    max-width: 205px !important;
  }
}

@media only screen and (max-width: 419.9999px) {
  .main-header .header-navbar .header-logo {
    flex: 0 1 clamp(154px, 44vw, 182px) !important;
    flex-basis: clamp(154px, 44vw, 182px) !important;
    width: clamp(154px, 44vw, 182px) !important;
    max-width: 182px !important;
  }
}

/* ========================================================================
   ZUMI FINAL ICON + CARET OVERRIDES — 2026-09-11
   - Larger dropdown carets
   - Plan Your Adventure SVG icon
   - Scroll-to-top SVG icon
   - Mobile drawer close SVG icon
   ======================================================================== */

/* ------------------------------------------------------------------------
   PLAN YOUR ADVENTURE — replace the legacy icon-font glyph with the SVG.
   The SVG is used as a mask so the button icon always remains white.
   ------------------------------------------------------------------------ */
.main-header .header-action .header-btn .main-btn.icon,
.main-header .header-action .header-btn .default-btn.icon {
  position: relative !important;
}

.main-header .header-action .header-btn .main-btn.icon > i,
.main-header .header-action .header-btn .default-btn.icon > i,
.main-header .header-action .header-btn .main-btn > i,
.main-header .header-action .header-btn .default-btn > i {
  display: block !important;
  position: absolute !important;
  top: 50% !important;
  left: 17px !important;
  width: 21px !important;
  min-width: 21px !important;
  height: 21px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  font-size: 0 !important;
  line-height: 0 !important;
  color: transparent !important;
  background-color: #FFFFFF !important;
  background-image: none !important;
  -webkit-mask-image: url("https://zumirentals.com/wp-content/uploads/2026/09/plan-adventure-icon.svg") !important;
  mask-image: url("https://zumirentals.com/wp-content/uploads/2026/09/plan-adventure-icon.svg") !important;
  -webkit-mask-position: center !important;
  mask-position: center !important;
  -webkit-mask-repeat: no-repeat !important;
  mask-repeat: no-repeat !important;
  -webkit-mask-size: contain !important;
  mask-size: contain !important;
  transform: translateY(-50%) !important;
}

.main-header .header-action .header-btn .main-btn > i::before,
.main-header .header-action .header-btn .default-btn > i::before,
.main-header .header-action .header-btn .main-btn > i::after,
.main-header .header-action .header-btn .default-btn > i::after {
  content: none !important;
  display: none !important;
}

/* ------------------------------------------------------------------------
   SCROLL TO TOP — replace bx-chevrons-up / legacy icon with custom SVG.
   Uses a mask so the icon stays white on the orange circular button.
   ------------------------------------------------------------------------ */
.go-top i,
.zumi-go-top.go-top i,
.go-top.zumi-go-top i {
  display: block !important;
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  right: auto !important;
  width: 22px !important;
  min-width: 22px !important;
  height: 22px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  font-size: 0 !important;
  line-height: 0 !important;
  color: transparent !important;
  background-color: #FFFFFF !important;
  background-image: none !important;
  -webkit-mask-image: url("https://zumirentals.com/wp-content/uploads/2026/09/up-chevron-scroll.svg") !important;
  mask-image: url("https://zumirentals.com/wp-content/uploads/2026/09/up-chevron-scroll.svg") !important;
  -webkit-mask-position: center !important;
  mask-position: center !important;
  -webkit-mask-repeat: no-repeat !important;
  mask-repeat: no-repeat !important;
  -webkit-mask-size: contain !important;
  mask-size: contain !important;
  -webkit-transform: translate(-50%, -50%) !important;
  transform: translate(-50%, -50%) !important;
}

.go-top i::before,
.zumi-go-top.go-top i::before,
.go-top.zumi-go-top i::before,
.go-top i::after,
.zumi-go-top.go-top i::after,
.go-top.zumi-go-top i::after {
  content: none !important;
  display: none !important;
}

/* ------------------------------------------------------------------------
   MOBILE DRAWER CLOSE — custom SVG replaces the old X/icon-font glyph.
   Put the SVG directly on the close control so this also works when the
   theme's original close markup is only text or an <i> element.
   ------------------------------------------------------------------------ */
.mobile-nav-header .mobile-menu-close,
.main-header.header-style-1 .mobile-nav-header .mobile-menu-close {
  position: relative !important;
  font-size: 0 !important;
  color: transparent !important;
  overflow: hidden !important;
}

.mobile-nav-header .mobile-menu-close > *,
.main-header.header-style-1 .mobile-nav-header .mobile-menu-close > * {
  visibility: hidden !important;
  opacity: 0 !important;
}

.mobile-nav-header .mobile-menu-close::before,
.main-header.header-style-1 .mobile-nav-header .mobile-menu-close::before {
  content: "" !important;
  display: block !important;
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  width: 19px !important;
  height: 19px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: #111311 !important;
  -webkit-mask-image: url("https://zumirentals.com/wp-content/uploads/2026/09/close-icon-cancel.svg") !important;
  mask-image: url("https://zumirentals.com/wp-content/uploads/2026/09/close-icon-cancel.svg") !important;
  -webkit-mask-position: center !important;
  mask-position: center !important;
  -webkit-mask-repeat: no-repeat !important;
  mask-repeat: no-repeat !important;
  -webkit-mask-size: contain !important;
  mask-size: contain !important;
  transform: translate(-50%, -50%) !important;
  opacity: 1 !important;
  visibility: visible !important;
}

.mobile-nav-header .mobile-menu-close::after,
.main-header.header-style-1 .mobile-nav-header .mobile-menu-close::after {
  content: none !important;
  display: none !important;
}

/* ------------------------------------------------------------------------
   DESKTOP DROPDOWN CARETS — intentionally larger and easier to read.
   ------------------------------------------------------------------------ */
@media only screen and (min-width: 992px) {
  .main-header .mainmenu > .menu-item-has-children > a::after,
  .main-header.header-style-1 .mainmenu > .menu-item-has-children > a::after {
    content: "▾" !important;
    display: block !important;
    top: 50% !important;
    right: 7px !important;
    width: auto !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    color: #666D68 !important;
    font-family: Arial, sans-serif !important;
    font-size: 17px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    transform: translateY(-52%) !important;
  }

  .main-header .mainmenu > .menu-item-has-children:hover > a::after,
  .main-header .mainmenu > .menu-item-has-children:focus-within > a::after,
  .main-header.header-style-1 .mainmenu > .menu-item-has-children:hover > a::after,
  .main-header.header-style-1 .mainmenu > .menu-item-has-children:focus-within > a::after {
    content: "▴" !important;
    color: #252925 !important;
    transform: translateY(-48%) !important;
  }
}

/* ------------------------------------------------------------------------
   TABLET / MOBILE DROPDOWN CARETS — larger closed and open states.
   ------------------------------------------------------------------------ */
@media only screen and (max-width: 991.9999px) {
  .main-header .mainmenu-nav .mainmenu .menu-item-has-children > a::after,
  .main-header.header-style-1 .mainmenu-nav .mainmenu .menu-item-has-children > a::after {
    content: "▾" !important;
    right: 13px !important;
    width: auto !important;
    height: auto !important;
    border: 0 !important;
    font-family: Arial, sans-serif !important;
    font-size: 19px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    transform: translateY(-52%) !important;
  }

  .main-header .mainmenu-nav .mainmenu .menu-item-has-children.menu-item-open > a::after,
  .main-header .mainmenu-nav .mainmenu .menu-item-has-children.open > a::after,
  .main-header .mainmenu-nav .mainmenu .menu-item-has-children.submenu-open > a::after,
  .main-header .mainmenu-nav .mainmenu .menu-item-has-children > a[aria-expanded="true"]::after,
  .main-header.header-style-1 .mainmenu-nav .mainmenu .menu-item-has-children.menu-item-open > a::after,
  .main-header.header-style-1 .mainmenu-nav .mainmenu .menu-item-has-children.open > a::after,
  .main-header.header-style-1 .mainmenu-nav .mainmenu .menu-item-has-children.submenu-open > a::after,
  .main-header.header-style-1 .mainmenu-nav .mainmenu .menu-item-has-children > a[aria-expanded="true"]::after,
  .main-header .mainmenu-nav .mainmenu .menu-item-has-children:has(> .main-submenu[style*="display: block"]) > a::after,
  .main-header .mainmenu-nav .mainmenu .menu-item-has-children:has(> .main-submenu-menu[style*="display: block"]) > a::after {
    content: "▴" !important;
    font-size: 19px !important;
    font-weight: 700 !important;
    transform: translateY(-48%) !important;
  }

  /* Keep the CTA SVG correctly proportioned at tablet/mobile sizes. */
  .main-header .header-action .header-btn .main-btn.icon > i,
  .main-header .header-action .header-btn .default-btn.icon > i,
  .main-header .header-action .header-btn .main-btn > i,
  .main-header .header-action .header-btn .default-btn > i {
    left: 12px !important;
    width: 19px !important;
    min-width: 19px !important;
    height: 19px !important;
  }
}

/* ========================================================================
   ZUMI FINAL ICON SPACING + SCROLL ICON PATCH — 2026-09-11
   - Keeps menu icons comfortably separated from their labels as the viewport
     narrows.
   - Makes the Plan Your Adventure SVG participate in flex layout instead of
     sitting absolutely over the button text.
   - The scroll-to-top SVG URL is the new up-chevron-scroll.svg asset.
   ======================================================================== */

/* Desktop navigation: do not let icon-to-label spacing collapse too tightly. */
@media only screen and (min-width: 992px) {
  .main-header .mainmenu > li > a,
  .main-header.header-style-1 .mainmenu > li > a {
    column-gap: clamp(9px, 0.65vw, 12px) !important;
  }

  /* Keep image/flag-based controls from crowding their text as well. */
  .main-header .header-action > ul > li:not(.header-btn) > a,
  .main-header .header-action > ul > li:not(.header-btn) > span,
  .main-header .header-action > ul > li:not(.header-btn) a,
  .main-header .header-action > ul > li:not(.header-btn) [role="button"] {
    column-gap: clamp(9px, 0.65vw, 12px) !important;
  }

  /*
   * PLAN YOUR ADVENTURE
   * The icon is now a real flex item. This guarantees a physical gap between
   * the SVG and the text at every desktop width and prevents overlap.
   */
  .main-header .header-action .header-btn .main-btn.icon,
  .main-header .header-action .header-btn .default-btn.icon {
    display: inline-flex !important;
    flex-flow: row nowrap !important;
    align-items: center !important;
    justify-content: center !important;
    gap: clamp(10px, 0.72vw, 14px) !important;
    padding-left: clamp(14px, 1.15vw, 22px) !important;
    padding-right: clamp(14px, 1.15vw, 22px) !important;
  }

  .main-header .header-action .header-btn .main-btn.icon > i,
  .main-header .header-action .header-btn .default-btn.icon > i,
  .main-header .header-action .header-btn .main-btn > i,
  .main-header .header-action .header-btn .default-btn > i {
    position: static !important;
    top: auto !important;
    left: auto !important;
    right: auto !important;
    flex: 0 0 clamp(19px, 1.2vw, 22px) !important;
    width: clamp(19px, 1.2vw, 22px) !important;
    min-width: clamp(19px, 1.2vw, 22px) !important;
    height: clamp(19px, 1.2vw, 22px) !important;
    margin: 0 !important;
    transform: none !important;
    -webkit-transform: none !important;
  }
}

/* Very tight desktop: retain the gap without making the CTA unnecessarily wide. */
@media only screen and (min-width: 992px) and (max-width: 1099.9999px) {
  .main-header .mainmenu > li > a,
  .main-header.header-style-1 .mainmenu > li > a {
    column-gap: 9px !important;
  }

  .main-header .header-action .header-btn .main-btn.icon,
  .main-header .header-action .header-btn .default-btn.icon {
    gap: 8px !important;
    padding-left: 10px !important;
    padding-right: 10px !important;
  }

  .main-header .header-action .header-btn .main-btn.icon > i,
  .main-header .header-action .header-btn .default-btn.icon > i,
  .main-header .header-action .header-btn .main-btn > i,
  .main-header .header-action .header-btn .default-btn > i {
    flex-basis: 18px !important;
    width: 18px !important;
    min-width: 18px !important;
    height: 18px !important;
  }
}

/* Tablet/mobile header: same no-overlap treatment if the CTA is shown. */
@media only screen and (max-width: 991.9999px) {
  .main-header .header-action .header-btn .main-btn.icon,
  .main-header .header-action .header-btn .default-btn.icon {
    display: inline-flex !important;
    flex-flow: row nowrap !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 9px !important;
    padding-left: 12px !important;
    padding-right: 12px !important;
  }

  .main-header .header-action .header-btn .main-btn.icon > i,
  .main-header .header-action .header-btn .default-btn.icon > i,
  .main-header .header-action .header-btn .main-btn > i,
  .main-header .header-action .header-btn .default-btn > i {
    position: static !important;
    top: auto !important;
    left: auto !important;
    right: auto !important;
    flex: 0 0 18px !important;
    width: 18px !important;
    min-width: 18px !important;
    height: 18px !important;
    margin: 0 !important;
    transform: none !important;
    -webkit-transform: none !important;
  }
}


/* ========================================================================
   ZUMI FINAL DESKTOP RAIL-TO-ICON SPACING PATCH — 2026-09-11
   Keeps the orange vertical accent visually separated from the menu icon
   without materially widening the navigation at tighter desktop widths.
   ======================================================================== */
@media only screen and (min-width: 1100px) {
  .main-header .mainmenu > li > a,
  .main-header.header-style-1 .mainmenu > li > a {
    padding-left: clamp(8px, 0.62vw, 11px) !important;
  }

  .main-header .mainmenu > li > a::before,
  .main-header.header-style-1 .mainmenu > li > a::before {
    left: -4px !important;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1099.9999px) {
  .main-header .mainmenu > li > a,
  .main-header.header-style-1 .mainmenu > li > a {
    padding-left: 6px !important;
  }

  .main-header .mainmenu > li > a::before,
  .main-header.header-style-1 .mainmenu > li > a::before {
    left: -5px !important;
  }
}


/* ========================================================================
   ZUMI HEADER EMERGENCY CTA — 2026-09-17
   Separate red action beside Plan Your Adventure; NOT a navigation menu item.
   Uses the official Zumi warning SVG on desktop, tablet and mobile.
   ======================================================================== */

.main-header .header-action .header-emergency-btn .zumi-emergency-btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 9px !important;
  min-height: 44px !important;
  padding: 12px 16px !important;
  color: #FFFFFF !important;
  background: #C93434 !important;
  border-color: #B72A2A !important;
  border-radius: 11px !important;
  box-shadow: 0 7px 20px rgba(201, 52, 52, 0.20) !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  white-space: nowrap !important;
}

.main-header .header-action .header-emergency-btn .zumi-emergency-btn::before,
.main-header .header-action .header-emergency-btn .zumi-emergency-btn::after {
  background-color: #A92525 !important;
}

.main-header .header-action .header-emergency-btn .zumi-emergency-btn:hover,
.main-header .header-action .header-emergency-btn .zumi-emergency-btn:focus-visible {
  color: #FFFFFF !important;
  border-color: #982020 !important;
  box-shadow: 0 8px 22px rgba(169, 37, 37, 0.24) !important;
}

.main-header .header-action .header-emergency-btn .zumi-emergency-btn-icon {
  display: block !important;
  flex: 0 0 20px !important;
  width: 20px !important;
  min-width: 20px !important;
  max-width: 20px !important;
  height: 20px !important;
  margin: 0 !important;
  object-fit: contain !important;
  /* Force the supplied monochrome warning SVG to white against the red CTA. */
  filter: brightness(0) invert(1) !important;
}

.main-header .header-action .header-emergency-btn .zumi-emergency-btn > span {
  display: inline-block !important;
  color: #FFFFFF !important;
  line-height: 1.1 !important;
}

/* Keep the two action CTAs visually grouped. */
.main-header .header-action > ul {
  align-items: center !important;
}

.main-header .header-action .header-emergency-btn,
.main-header .header-action .header-booking-btn {
  flex: 0 0 auto !important;
}

/* Full text CTA on comfortable desktop widths. */
@media only screen and (min-width: 1100px) {
  .main-header .header-action .header-emergency-btn .zumi-emergency-btn {
    min-height: clamp(42px, 2.9vw, 46px) !important;
    padding: clamp(11px, .8vw, 13px) clamp(13px, 1vw, 17px) !important;
    gap: clamp(8px, .6vw, 11px) !important;
    font-size: clamp(12.5px, .82vw, 14px) !important;
  }
}

/* ========================================================================
   ZUMI EMERGENCY HEADER CTA — FINAL FORCE OVERRIDE — 2026-09-17
   Keep Emergency visually distinct from the orange booking CTA everywhere.
   ======================================================================== */
html body .main-header .header-navbar .header-action > ul > li.header-btn.header-emergency-btn > a.default-btn.zumi-emergency-btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0 !important;
  color: #FFFFFF !important;
  background: #C92E2E !important;
  background-color: #C92E2E !important;
  background-image: none !important;
  border: 2px solid #B62424 !important;
  box-shadow: 0 8px 22px rgba(201, 46, 46, 0.24) !important;
}

/* Disable the theme's animated orange button layers on Emergency only. */
html body .main-header .header-navbar .header-action > ul > li.header-btn.header-emergency-btn > a.default-btn.zumi-emergency-btn::before,
html body .main-header .header-navbar .header-action > ul > li.header-btn.header-emergency-btn > a.default-btn.zumi-emergency-btn::after {
  content: none !important;
  display: none !important;
  width: 0 !important;
  background: transparent !important;
}

html body .main-header .header-navbar .header-action > ul > li.header-btn.header-emergency-btn > a.default-btn.zumi-emergency-btn:hover,
html body .main-header .header-navbar .header-action > ul > li.header-btn.header-emergency-btn > a.default-btn.zumi-emergency-btn:focus-visible {
  color: #FFFFFF !important;
  background: #A92323 !important;
  background-color: #A92323 !important;
  background-image: none !important;
  border-color: #941E1E !important;
}

html body .main-header .header-navbar .header-action > ul > li.header-btn.header-emergency-btn > a.default-btn.zumi-emergency-btn .zumi-emergency-btn-icon {
  display: block !important;
  flex: 0 0 20px !important;
  width: 20px !important;
  min-width: 20px !important;
  max-width: 20px !important;
  height: 20px !important;
  margin: 0 10px 0 0 !important;
  padding: 0 !important;
  object-fit: contain !important;
  filter: brightness(0) invert(1) !important;
}

html body .main-header .header-navbar .header-action > ul > li.header-btn.header-emergency-btn > a.default-btn.zumi-emergency-btn > span {
  display: inline-block !important;
  color: #FFFFFF !important;
  margin: 0 !important;
  padding: 0 !important;
  line-height: 1.1 !important;
}

/* The same red treatment is retained for the full-width mobile drawer CTA. */
@media only screen and (max-width: 767.9999px) {
  html body .main-header .header-action > ul > li.header-btn.header-emergency-btn > a.default-btn.zumi-emergency-btn {
    width: 100% !important;
    min-height: 50px !important;
    color: #FFFFFF !important;
    background: #C92E2E !important;
    background-color: #C92E2E !important;
    background-image: none !important;
    border-color: #B62424 !important;
  }

  html body .main-header .header-action > ul > li.header-btn.header-emergency-btn > a.default-btn.zumi-emergency-btn .zumi-emergency-btn-icon {
    margin-right: 10px !important;
  }
}

/* ========================================================================
   ZUMI EMERGENCY CTA — ISOLATED FINAL BUTTON RULES — 2026-09-17
   Emergency intentionally does NOT use .default-btn. This prevents the
   theme's orange button paint/animation from overriding the red emergency CTA.
   ======================================================================== */
html body .main-header .header-navbar .header-action > ul > li.header-btn.header-emergency-btn > a.zumi-emergency-btn {
  display: inline-flex !important;
  flex-flow: row nowrap !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  min-height: 44px !important;
  padding: 12px 16px !important;
  color: #FFFFFF !important;
  background: #C92E2E !important;
  background-color: #C92E2E !important;
  background-image: none !important;
  border: 2px solid #B62424 !important;
  border-radius: 11px !important;
  box-shadow: 0 8px 22px rgba(201, 46, 46, 0.24) !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  white-space: nowrap !important;
  overflow: visible !important;
  text-transform: none !important;
  transition: background-color 150ms ease, border-color 150ms ease, box-shadow 150ms ease !important;
}

html body .main-header .header-navbar .header-action > ul > li.header-btn.header-emergency-btn > a.zumi-emergency-btn::before,
html body .main-header .header-navbar .header-action > ul > li.header-btn.header-emergency-btn > a.zumi-emergency-btn::after {
  content: none !important;
  display: none !important;
}

html body .main-header .header-navbar .header-action > ul > li.header-btn.header-emergency-btn > a.zumi-emergency-btn:hover,
html body .main-header .header-navbar .header-action > ul > li.header-btn.header-emergency-btn > a.zumi-emergency-btn:focus-visible {
  color: #FFFFFF !important;
  background: #A92323 !important;
  background-color: #A92323 !important;
  background-image: none !important;
  border-color: #941E1E !important;
  box-shadow: 0 9px 24px rgba(169, 35, 35, 0.28) !important;
}

html body .main-header .header-navbar .header-action > ul > li.header-btn.header-emergency-btn > a.zumi-emergency-btn .zumi-emergency-btn-icon {
  display: block !important;
  position: static !important;
  flex: 0 0 20px !important;
  width: 20px !important;
  min-width: 20px !important;
  max-width: 20px !important;
  height: 20px !important;
  margin: 0 !important;
  padding: 0 !important;
  object-fit: contain !important;
  filter: brightness(0) invert(1) !important;
}

html body .main-header .header-navbar .header-action > ul > li.header-btn.header-emergency-btn > a.zumi-emergency-btn > span {
  display: inline-block !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  color: #FFFFFF !important;
  line-height: 1.1 !important;
}