/*!
Theme Name: HondaFiji
Theme URI: http://underscores.me/
Author: Power Marketing
Author URI: https://powermarketing.online
Description: Description
Version: 1.0.0
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: hondafiji
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned.

HondaFiji is based on Underscores https://underscores.me/, (C) 2012-2020 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
*/

/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
# Generic
	- Normalize
	- Box sizing
# Base
	- Typography
	- Elements
	- Links
	- Forms
## Layouts
# Components
	- Navigation
	- Posts and pages
	- Comments
	- Widgets
	- Media
	- Captions
	- Galleries
# plugins
	- Jetpack infinite scroll
# Utilities
	- Accessibility
	- Alignments

--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Generic
--------------------------------------------------------------*/

/* Normalize
--------------------------------------------- */

/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */

/* Document
	 ========================================================================== */

/**
 * 1. Correct the line height in all browsers.
 * 2. Prevent adjustments of font size after orientation changes in iOS.
 */
@import url('https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300..800;1,300..800&family=Sofia+Sans+Extra+Condensed:ital,wght@0,1..1000;1,1..1000&family=Sofia+Sans+Semi+Condensed:ital,wght@0,1..1000;1,1..1000&display=swap');
html {
  line-height: 1.15;
  -webkit-text-size-adjust: 100%;
}

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

/**
	* Remove the margin in all browsers.
	*/
body {
  margin: 0;
  font-family: 'Open Sans', serif;
  color: #0d0e0d;
}
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: 'Sofia Sans Semi Condensed', serif;
  margin: 0;
}
/**
	* Render the `main` element consistently in IE.
	*/
main {
  display: block;
}

/**
	* Correct the font size and margin on `h1` elements within `section` and
	* `article` contexts in Chrome, Firefox, and Safari.
	*/
h1 {
  font-size: 2em;
  margin: 0.67em 0;
}

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

/**
	* 1. Add the correct box sizing in Firefox.
	* 2. Show the overflow in Edge and IE.
	*/
hr {
  box-sizing: 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
	  ========================================================================== */

/**
	* Remove the gray background on active links in IE 10.
	*/
a {
  background-color: transparent;
}

/**
	* 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
	  ========================================================================== */

/**
	* 1. Change the font styles in all browsers.
	* 2. Remove the margin in Firefox and Safari.
	*/
button,
input,
optgroup,
select,
textarea {
  font-size: 100%;
  line-height: 1.15;
  margin: 0;
}

/**
	* Show the overflow in IE.
	* 1. Show the overflow in Edge.
	*/
button,
input {
  overflow: visible;
}

/**
	* 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;
}

/**
	* 1. Correct the odd appearance in Chrome and Safari.
	* 2. Correct the outline style in Safari.
	*/
[type='search'] {
  -webkit-appearance: textfield;
  outline-offset: -2px;
}

/**
	* 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
   --------------------------------------------- */
body,
button,
input,
select,
optgroup,
textarea {
  font-size: 1rem;
  line-height: 1.5;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  clear: both;
}

p {
  margin: 0 0 12px;
}
p:last-child {
  margin-bottom: 0;
}
dfn,
cite,
em,
i {
  font-style: italic;
}

blockquote {
  margin: 0 1.5em;
}

address {
  margin: 0 0 1.5em;
}

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 {
  border-bottom: 1px dotted #666;
  cursor: help;
}

mark,
ins {
  background: #fff9c0;
  text-decoration: none;
}

big {
  font-size: 125%;
}

/* Elements
   --------------------------------------------- */
body {
  background: #fff;
}

hr {
  background-color: #ccc;
  border: 0;
  height: 1px;
  margin-bottom: 1.5em;
}

ul,
ol {
  margin: 0 0 15px;
}

ul {
  list-style: disc;
}

ol {
  list-style: decimal;
}

li > ul,
li > ol {
  margin-bottom: 0;
  margin-left: 1.5em;
}

dt {
  font-weight: 700;
}

dd {
  margin: 0 1.5em 1.5em;
}

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

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

figure {
  margin: 1em 0;
}

table {
  margin: 0 0 1.5em;
  width: 100%;
}

/* Links
   --------------------------------------------- */
a {
  color: #002d72;
  outline: none;
  text-decoration: none;
}

/* a:visited {
	 color: #800080;
   }
   
   a:hover,
   a:focus,
   a:active {
	 color: #191970;
   }
   
   a:focus {
	 outline: thin dotted;
   }
   
   a:hover,
   a:active {
	 outline: 0;
   } */

/* Forms
   --------------------------------------------- */
button,
input[type='button'],
input[type='reset'],
input[type='submit'] {
  border: 1px solid;
  border-color: #ccc #ccc #bbb;
  border-radius: 3px;
  background: #e6e6e6;
  color: rgba(0, 0, 0, 0.8);
  line-height: 1;
  padding: 0.6em 1em 0.4em;
}

button:hover,
input[type='button']:hover,
input[type='reset']:hover,
input[type='submit']:hover {
  border-color: #ccc #bbb #aaa;
}

button:active,
button:focus,
input[type='button']:active,
input[type='button']:focus,
input[type='reset']:active,
input[type='reset']:focus,
input[type='submit']:active,
input[type='submit']:focus {
  border-color: #aaa #bbb #bbb;
}

input[type='text'],
input[type='email'],
input[type='url'],
input[type='password'],
input[type='search'],
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'],
textarea {
  color: #666;
  border: 1px solid #ccc;
  border-radius: 3px;
  padding: 3px;
}

input[type='text']:focus,
input[type='email']:focus,
input[type='url']:focus,
input[type='password']:focus,
input[type='search']: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: #111;
}

select {
  border: 1px solid #ccc;
}

textarea {
  width: 100%;
}

/*--------------------------------------------------------------
   # Layouts
   --------------------------------------------------------------*/

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

/* Navigation
   --------------------------------------------- */
.main-navigation {
  display: block;
  width: 100%;
}

.main-navigation ul {
  display: none;
  list-style: none;
  margin: 0;
  padding-left: 0;
}

.main-navigation ul ul {
  box-shadow: 0 3px 3px rgba(0, 0, 0, 0.2);
  float: left;
  position: absolute;
  top: 100%;
  left: -999em;
  z-index: 99999;
}

.main-navigation ul ul ul {
  left: -999em;
  top: 0;
}

.main-navigation ul ul li:hover > ul,
.main-navigation ul ul li.focus > ul {
  display: block;
  left: auto;
}

.main-navigation ul ul a {
  width: 200px;
}

.main-navigation ul li:hover > ul,
.main-navigation ul li.focus > ul {
  left: auto;
}

.main-navigation li {
  position: relative;
}

.main-navigation a {
  display: block;
  text-decoration: none;
}

/* Small menu. */
.menu-toggle,
.main-navigation.toggled ul {
  display: block;
}

@media screen and (min-width: 37.5em) {
  .menu-toggle {
    display: none;
  }

  .main-navigation ul {
    display: flex;
  }
}

.site-main .comment-navigation,
.site-main .posts-navigation,
.site-main .post-navigation {
  margin: 0 0 1.5em;
}

.comment-navigation .nav-links,
.posts-navigation .nav-links,
.post-navigation .nav-links {
  display: flex;
}

.comment-navigation .nav-previous,
.posts-navigation .nav-previous,
.post-navigation .nav-previous {
  flex: 1 0 50%;
}

.comment-navigation .nav-next,
.posts-navigation .nav-next,
.post-navigation .nav-next {
  text-align: end;
  flex: 1 0 50%;
}

/* Posts and pages
   --------------------------------------------- */
.sticky {
  display: block;
}

/* .post,
   .page {
	 margin: 0 0 1.5em;
   } */

.updated:not(.published) {
  display: none;
}

.page-content,
.entry-content,
.entry-summary {
  margin: 1.5em 0 0;
}

.page-links {
  clear: both;
  margin: 0 0 1.5em;
}

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

.bypostauthor {
  display: block;
}

/* Widgets
   --------------------------------------------- */
.widget {
  margin: 0 0 1.5em;
}

.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;
}
svg {
  max-width: 30px;
}
.container {
  width: 100%;
  max-width: 1600px;
  padding-left: 30px;
  padding-right: 30px;
  margin: auto;
}
.button {
  height: 50px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid #002d72;
  color: #002d72;
  padding: 0rem 2.5rem;
  text-transform: uppercase;
  transition: all 0.2s ease-in-out;
  white-space: nowrap;
  font-weight: 500;
  font-size: 15px;
  min-width: 200px;
  border-radius: 2px;
  letter-spacing: 1px;
  gap: 10px;
  line-height: 1.2;
}
.button:hover {
  background: rgba(0, 45, 114, 0.1);
}
.button.fill {
  background: #002d72;
  color: #fff;
}
.button.fill:hover {
  background: #132047;
  border-color: #132047;
}
/* ===================== Header ===================== */
header.site-header {
  position: sticky;
  top: 0;
  z-index: 9999;
  background-color: #fff;
  height: 85px;
  display: flex;
  align-items: center;
}
.logged-in header.site-header {
  top: 32px;
}
header.site-header.fixed,
.tax-product-category header.site-header {
  box-shadow: 0px 4px 10px 0px rgba(28, 28, 28, 0.05);
}
header.site-header .container {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
header.site-header .left {
  display: flex;
  align-items: center;
  gap: 40px;
}
header.site-header .left .site-branding a {
  display: flex;
  align-items: center;
}
header.site-header .left .site-branding a img {
  height: 55px;
}
header.site-header .right {
  position: relative;
  display: flex;
  align-items: center;
  gap: 15px;
}
header.site-header .right button.search-toggle {
  padding: 0;
  margin: 0;
  background-color: transparent;
  border: none;
  outline: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 5px;
  font-size: 16px;
  color: #0d0e0d;
}
header.site-header .right button.search-toggle svg {
  width: 30px;
}
header.site-header .right .search-wrap {
  position: absolute;
  right: 0;
  top: 56px;
  transition: all 0.3s ease-in;
  opacity: 0;
  visibility: hidden;
}
header.site-header .right .search-wrap.activated {
  opacity: 1;
  visibility: visible;
}
header.site-header .right .search-wrap form {
  width: 240px;
  height: 46px;
  background-color: #fff;
  border: 1px solid;
  position: relative;
  border-radius: 3px;
  color: #0d0e0d;
  font-size: 15px;
}
header.site-header .right .search-wrap form input#search {
  width: 100%;
  height: 100%;
  border: none;
  padding: 0 15px;
}
header.site-header .right .search-wrap form button {
  position: absolute;
  padding: 0px 8px 0 0;
  margin: 0;
  background-color: transparent;
  top: 50%;
  transform: translateY(-50%);
  width: 38px;
  height: 100%;
  border: none;
  right: 0;
  z-index: 2;
  cursor: pointer;
}
header.site-header .right button.menu-trigger {
  width: 35px;
  height: 35px;
  border: none;
  padding: 0;
  margin: 0;
  background-color: transparent;
  cursor: pointer;
  position: relative;
  display: none;
}
header.site-header .right button.menu-trigger span {
  position: absolute;
  content: '';
  width: 100%;
  height: 2px;
  background-color: #002d72;
  left: 0;
  top: 7px;
  transition: all 0.3s ease-in;
}
header.site-header .right button.menu-trigger span:last-child {
  bottom: 15%;
  top: auto;
  width: 80%;
}
header.site-header .right button.menu-trigger span:nth-child(2) {
  top: 48%;
}
header.site-header .right button.menu-trigger.active span:nth-child(2) {
  opacity: 0;
}
header.site-header .right button.menu-trigger.active span:first-child {
  transform: rotate(45deg);
  top: 45%;
}
header.site-header .right button.menu-trigger.active span:last-child {
  bottom: 45%;
  transform: rotate(-45deg);
  width: 100%;
}
.top-header {
  background-color: #eceeec;
}
.top-header .container {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  height: 32px;
}
.top-header .header-sign-in {
  display: flex;
  gap: 6px;
  font-size: 14px;
  color: #0d0e0d;
  align-items: center;
  line-height: 1;
}
.top-header .header-sign-in svg {
  width: 14px;
}
header.site-header .left .menu ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
.top-header .menu-alternate-site-menu-container {
  /*padding-right: 70px;*/
}
.top-header ul.menu {
  padding: 0;
  margin: auto;
  list-style: none;
  display: flex;
  gap: 30px;
}
.top-header ul.menu li a {
  color: #0d0e0d;
  font-size: 14px;
  font-weight: 400;
  letter-spacing: 0;
}
header.site-header .left .menu-primary-menu-container {
  /* position: relative; */
}
header.site-header .left .menu-primary-menu-container ul.menu {
  padding: 0;
  margin: 0;
  list-style: none;
  display: flex;
}
header.site-header .left .menu-primary-menu-container ul.menu li {
  /* position: relative; */
}
header.site-header .left .menu-primary-menu-container ul.menu li a {
  padding: 0px 18px 30px;
  font-size: 16px;
  color: #333;
  font-family: 'Sofia Sans Semi Condensed', serif;
}
header.site-header .left .menu-primary-menu-container ul.menu li ul.sub-menu {
  position: absolute;
  width: 100%;
  left: 0;
  background-color: #fff;
  top: 65px;
  transition: all 0.3s ease-in;
  opacity: 0;
  visibility: hidden;
  border-top: 1px solid #eceeec;
}
header.site-header
  .left
  .menu-primary-menu-container
  ul.menu
  li
  ul.sub-menu
  .wrap {
  width: 100%;
  max-width: 1200px;
  padding-left: 30px;
  padding-right: 30px;
  margin: auto;
  display: grid;
  gap: 8px;
  border-left: 1px solid #eceeec;
  padding-top: 30px;
  padding-bottom: 30px;
}
header.site-header
  .left
  .menu-primary-menu-container
  ul.menu
  li:hover
  ul.sub-menu {
  opacity: 1;
  visibility: visible;
  top: 85px;
}
header.site-header .left .menu-primary-menu-container ul.menu li ul.sub-menu a {
  padding: 0;
  color: #0d0e0d;
  line-height: 1.4;
  transition: all 0.3s ease-in;
}
header.site-header
  .left
  .menu-primary-menu-container
  ul.menu
  li
  ul.sub-menu
  li:hover
  a {
  color: #002d72;
}
/* ===================== Header ===================== */
/* ===================== Home Hero ===================== */
section.home-hero {
  position: relative;
  overflow: hidden;
}
section.home-hero .slide-item {
  display: flex;
  align-items: center;
  height: 720px;
}
section.home-hero .slide-item img {
  position: absolute;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}
section.home-hero .slide-item img.mobile-image {
  display: none;
}
section.home-hero .slide-item .container {
  z-index: 9;
  color: #fff;
}
section.home-hero .slide-item .sub-headline {
  margin: 0;
  font-size: 16px;
  padding: 0 0 10px;
  color: #ffffff;
}
section.home-hero .slide-item .headline {
  font-size: 92px;
  line-height: 1;
  margin: 0;
  padding-bottom: 40px;
  font-family: 'Sofia Sans Extra Condensed', serif;
  letter-spacing: -1.5px;
  font-weight: 500;
}
section.home-hero .slide-item .button {
  font-size: 18px;
  min-width: 270px;
}
section.home-hero .owl-dots {
  position: absolute;
  width: 100%;
  max-width: 1600px;
  padding: 0 30px;
  left: 0;
  right: 0;
  margin: auto;
  bottom: 100px;
  display: flex;
  gap: 8px;
}
section.home-hero .owl-dots .owl-dot {
  display: grid;
  place-items: center;
  transition: all 0.2s ease;
  width: 18px;
  height: 18px;
}
section.home-hero .owl-dots .owl-dot.active,
section.home-hero .owl-dots .owl-dot:hover {
  border: 2px solid #fff;
  border-radius: 50%;
}
section.home-hero .owl-dots .owl-dot span {
  margin: 2px;
  width: 10px;
  height: 10px;
  background-color: #fff;
  border-radius: 50%;
  opacity: 0.5;
}
section.home-hero .owl-dots .owl-dot.active span,
section.home-hero .owl-dots .owl-dot:hover span {
  opacity: 1;
}
/* ===================== Home Hero ===================== */
/* ===================== Browse the Range ===================== */
section.browse-the-range {
  position: relative;
  overflow: hidden;
  padding: 80px 0 50px;
  text-align: center;
}
section.browse-the-range .headline {
  font-family: 'Sofia Sans Extra Condensed', sans-serif;
  font-weight: 500;
  font-size: 36px;
  line-height: 1.2;
  letter-spacing: 0;
  margin: auto;
  color: rgb(13, 14, 13);
  margin-bottom: 20px;
}
section.browse-the-range .categories-card {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 20px;
}
section.browse-the-range .categories-card .card-item {
  overflow: hidden;
  border-radius: 10px;
  display: flex;
  position: relative;
}
section.browse-the-range .categories-card .card-item img {
  object-fit: cover;
  transition: all 0.3s ease-in;
}
section.browse-the-range .categories-card .card-item a {
  position: absolute;
  width: 100%;
  height: 100%;
  z-index: 9;
  display: flex;
  align-items: flex-end;
  left: 0;
}
section.browse-the-range .categories-card .card-item:hover img {
  transform: scale(1.1);
}
section.browse-the-range .categories-card .card-item .title {
  margin: 0;
  width: 100%;
  font-family: 'Sofia Sans Extra Condensed', sans-serif;
  font-weight: 500;
  font-size: 36px;
  color: #fff;
  padding: 0 20px 30px;
  line-height: 1;
}
section.browse-the-range .button {
  margin-top: 50px;
}
/* ===================== Browse the Range ===================== */
/* ===================== Why Us ===================== */
section.home-why-us {
  position: relative;
  overflow: hidden;
  padding: 30px 0 75px;
}
section.home-why-us .container {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 20px;
}
section.home-why-us .container.align-center {
    align-items: center;
}
/* section.home-why-us .left {
   width: 50%;
 } */
/* section.home-why-us .right {
   width: 50%;
 } */
section.home-why-us .right img {
  border-radius: 10px;
}
section.home-why-us .left .inner {
  max-width: 600px;
  padding-top: 20px;
}
section.home-why-us .left .headline {
  font-family: 'Sofia Sans Extra Condensed', sans-serif;
  font-weight: 600;
  font-size: 52px;
  line-height: 1;
  letter-spacing: 0;
  margin-bottom: 20px;
}
section.home-why-us .left .descriptions {
  font-size: 15px;
}
section.home-why-us .left .button {
  margin-top: 30px;
}
/* section.home-why-us .container.reverse-column {
   flex-flow: row-reverse;
 }
 section.home-why-us .container.reverse-column .left .inner {
   padding-right: 0;
   padding-left: 20px;
 } */
section.home-why-us .container.reverse-column .left {
  order: 2;
}
/* ===================== Why Us ===================== */
/* ===================== Featured Products ===================== */
section.home-featured-products {
  position: relative;
  overflow: hidden;
  padding: 75px 0 80px;
}
section.home-featured-products .headline {
  font-family: 'Sofia Sans Extra Condensed', sans-serif;
  font-weight: 500;
  font-size: 36px;
  line-height: 1.2;
  letter-spacing: 0;
  margin: auto;
  margin-bottom: 20px;
  text-align: center;
}
/* ===================== Featured Products ===================== */
/* ===================== Perfect Outboard ===================== */
section.home-perfect-outboard {
  position: relative;
  overflow: hidden;
  padding: 80px 0;
}
section.home-perfect-outboard .container {
  padding: 0;
  max-width: 1540px;
}
section.home-perfect-outboard .gallery {
  margin: 0;
  gap: 0;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  overflow: hidden;
  border-radius: 10px;
}
section.home-perfect-outboard .gallery .item {
  height: 458px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}
section.home-perfect-outboard .box-area {
  width: 100%;
  background: #fff;
  padding: 40px 40px 50px;
  border-radius: 10px;
  box-shadow: 0 20px 50px 0 rgba(0, 0, 0, 0.12);
  max-width: 700px;
  margin: -108px auto 0;
  text-align: center;
  z-index: 9;
  position: relative;
}
section.home-perfect-outboard .box-area .headline {
  font-family: 'Sofia Sans Extra Condensed', sans-serif;
  font-weight: 600;
  font-size: 52px;
  line-height: 1;
  margin-bottom: 25px;
}
/* ===================== Perfect Outboard ===================== */
/* ===================== News & Events ===================== */
section.home-news-events {
  position: relative;
  overflow: hidden;
  padding: 80px 0;
  text-align: center;
}
section.home-news-events .tagline {
  font-size: 16px;
  font-family: 'Sofia Sans Semi Condensed', sans-serif;
  font-weight: 500;
  letter-spacing: 1px;
  text-transform: uppercase;
}
section.home-news-events .headline {
  font-family: 'Sofia Sans Extra Condensed', sans-serif;
  font-weight: 500;
  font-size: 36px;
  line-height: 38px;
  letter-spacing: 0;
  margin-bottom: 30px;
}
section.home-news-events .button {
  margin-top: 40px;
}
section.home-news-events .home-news-events-wrap {
  text-align: left;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 40px;
  width: 100%;
  max-width: 960px;
  margin: auto;
}
.blog-post-item {
  position: relative;
  overflow: hidden;
  border-radius: 10px;
  transition: all 0.2s linear;
  background-color: #f7f8f7;
}
.blog-post-item:hover {
  background-color: #002d72;
  color: #fff;
}
.whole-div-link {
  position: absolute;
  z-index: 9;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
}
.blog-post-item .thumbnail {
  height: 300px;
  display: flex;
  overflow: hidden;
}
.blog-post-item .thumbnail img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: all 0.3s ease-in;
}
.blog-post-item:hover .thumbnail img {
  transform: scale(1.05);
}
.blog-post-item .info {
  padding: 30px 30px 50px;
}
.blog-post-item .info .title {
  font-family: 'Sofia Sans Extra Condensed', sans-serif;
  font-weight: 500;
  font-size: 32px;
  line-height: 32px;
  letter-spacing: -0.2px;
  margin-bottom: 15px;
}
.blog-post-item .info .excerpt {
  font-size: 15px;
  margin-bottom: 20px;
}
.blog-post-item .info .link {
  display: flex;
  align-items: center;
  font-size: 15px;
  color: #002d72;
  gap: 10px;
  transition: all 0.3s ease-in;
}
.blog-post-item:hover .info .link {
  color: #fff;
}
.blog-post-item .info .link svg {
  width: 20px;
}
/* ===================== News & Events ===================== */
/* ===================== Footer ===================== */
.footer-cta {
  position: relative;
}
.footer-cta .container {
  display: flex;
  flex-wrap: wrap;
  padding-top: 30px;
  padding-bottom: 40px;
  align-items: flex-end;
}
footer.site-footer .container {
  max-width: 1440px;
}
.footer-cta .left {
  width: 25%;
  color: #fff;
}
.footer-cta .middle {
  width: calc(75% - 330px);
}
.footer-cta .right {
  width: 330px;
  position: relative;
  padding-left: 50px;
  text-align: right;
}
.footer-cta .right img {
  position: absolute;
  bottom: -50px;
  max-width: 280px;
  right: 0;
}
.footer-cta .left h3 {
  font-family: 'Sofia Sans Extra Condensed', sans-serif;
  font-weight: 500;
  font-size: 32px;
  line-height: 32px;
  letter-spacing: -0.2px;
  margin-bottom: 14px;
}
.footer-cta .left p {
  font-size: 15px;
  margin: 0;
  max-width: 300px;
}
.stay-up-to-date {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 20px;
}
.stay-up-to-date .item,
.stay-up-to-date .item p,
.stay-up-to-date .item p span {
  position: relative;
  width: 100%;
  display: block;
}
.stay-up-to-date .item input {
  width: 100%;
  height: 50px;
  background-color: transparent;
  border: 1px solid #fff;
  padding: 10px 20px;
  border-radius: 3px;
  color: #fff;
  margin: 0;
  font-size: 15px;
  outline: none;
}
.stay-up-to-date .item input::placeholder {
  color: #fff;
}
.stay-up-to-date .item input.wpcf7-submit {
  background-color: #fff;
  letter-spacing: 1px;
  color: #002d72;
  text-transform: uppercase;
  cursor: pointer;
}
.stay-up-to-date .item span.wpcf7-spinner {
  position: absolute;
  width: auto;
  margin: 0;
}
footer.site-footer .main-footer {
  padding: 60px 0 30px;
}
footer.site-footer {
  background-color: #2b2d2b;
}
footer.site-footer .top-main-footer {
  display: flex;
  flex-wrap: wrap;
  margin-bottom: 20px;
}
footer.site-footer .top-main-footer .left {
  width: 30%;
  padding-right: 20px;
}
footer.site-footer .top-main-footer .right {
  width: 70%;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 20px;
  padding-left: 20px;
}
footer.site-footer .top-main-footer .left img {
  height: 55px;
}
footer.site-footer .top-main-footer .left p {
  margin-top: 50px;
  color: #fff;
  font-size: 15px;
  max-width: 300px;
}
footer.site-footer .top-main-footer .right h3.title {
  color: #5f645f;
  font-size: 16px;
  letter-spacing: 1px;
  line-height: 17px;
  font-weight: 500;
  text-transform: uppercase;
  margin-bottom: 15px;
}
footer.site-footer .top-main-footer .right ul.menu {
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  gap: 10px;
}
footer.site-footer .top-main-footer .right ul.menu li a {
  color: #fff;
  font-size: 13px;
  line-height: 1;
  transition: color 0.2s linear;
}
footer.site-footer .top-main-footer .right ul.menu ul.sub-menu {
  padding-left: 10px;
  padding-top: 5px;
}
footer.site-footer .bottom-main-footer {
  display: flex;
  justify-content: end;
  flex-wrap: wrap;
}
footer.site-footer .bottom-main-footer .social-links {
  width: 100%;
  display: flex;
  justify-content: flex-end;
  gap: 15px;
}
footer.site-footer .bottom-main-footer button.back-to-top {
  padding: 0;
  border: none;
  background-color: transparent;
  color: #8a8e8a;
  padding-bottom: 30px;
  display: flex;
  align-items: center;
  transition: color 0.2s linear;
  width: 110px;
  gap: 8px;
  justify-content: flex-end;
  cursor: pointer;
}
footer.site-footer .bottom-main-footer button.back-to-top svg {
  width: 18px;
}
footer.site-footer .bottom-main-footer .social-links a {
  display: flex;
  width: 30px;
  height: 30px;
  background-color: #8a8e8a;
  align-items: center;
  justify-content: center;
  padding: 3px;
  border-radius: 4px;
  transition: all 0.3s ease-in;
}
footer.site-footer .bottom-main-footer .social-links a:hover {
  background-color: #fff;
}
footer.site-footer .bottom-main-footer button.back-to-top:hover {
  color: #fff;
}
footer.site-footer .bottom-footer {
  background-color: #1f211f;
}
footer.site-footer .bottom-footer .container {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
}
footer.site-footer .bottom-footer .copy-right {
  height: 52px;
  display: flex;
  align-items: center;
  color: #fff;
  font-size: 11px;
}
footer.site-footer .bottom-footer .copy-right a {
  color: #fff;
  padding-left: 2px;
}
footer.site-footer .bottom-footer ul.menu {
  padding: 0;
  margin: 0;
  list-style: none;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 30px;
}
footer.site-footer .bottom-footer ul.menu li a {
  font-size: 15px;
  color: #fff;
  font-family: 'Sofia Sans Semi Condensed', sans-serif;
  line-height: 32px;
  font-weight: 400;
  text-align: center;
  transition: color 0.2s linear;
}
footer.site-footer .bottom-footer ul.menu li a:hover {
  opacity: 0.5;
}
footer.site-footer .top-main-footer .right ul.menu li a:hover {
  opacity: 0.5;
}
/* ===================== Footer ===================== */
/* ===================== About ===================== */
section.about-hero {
  overflow: hidden;
  position: relative;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  height: 372px;
  display: flex;
  align-items: center;
}
section.about-hero .headline {
  font-family: 'Sofia Sans Extra Condensed', sans-serif;
  font-weight: 600;
  font-size: 52px;
  line-height: 1;
  letter-spacing: 0;
  color: #fff;
  margin: 0;
}
section.about-text-block {
  position: relative;
  overflow: hidden;
  padding: 100px 0 70px;
}
section.about-text-block .headline {
  font-family: 'Sofia Sans Extra Condensed', sans-serif;
  font-weight: 600;
  font-size: 52px;
  line-height: 1;
  letter-spacing: 0;
  margin-bottom: 20px;
}
section.about-text-block .text_block {
  font-size: 15px;
  max-width: 950px;
}
section.celebrating-text-block {
  padding: 70px 0 50px;
}
section.celebrating-text-block .tagline {
  text-align: center;
  font-size: 16px;
  font-family: 'Sofia Sans Semi Condensed', sans-serif;
  font-weight: 500;
  letter-spacing: 1px;
  text-transform: uppercase;
}
section.celebrating-text-block .headline {
  text-align: center;
  margin-bottom: 80px;
}
section.celebrating-text-block .text_block {
  max-width: 100%;
}
/* ===================== About ===================== */
/* ===================== Honda Smart Technologies  ===================== */
section.honda-technologies {
  overflow: hidden;
  position: relative;
  padding: 50px 0 150px;
}
section.honda-technologies .container {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 60px;
}
section.honda-technologies .item {
  position: relative;
  text-align: center;
}
section.honda-technologies .item .logo {
  max-height: 130px;
  display: flex;
  justify-content: center;
}
section.honda-technologies .item .logo img {
  object-fit: contain;
}
section.honda-technologies .item .contents-wrap {
  font-size: 15px;
}
section.honda-technologies .item .contents-wrap .headline {
  font-family: 'Sofia Sans Semi Condensed', sans-serif;
  font-weight: 700;
  font-size: 20px;
  line-height: 1;
  letter-spacing: 0.024rem;
  padding: 10px 0 15px;
}
section.honda-technologies .item .contents-wrap .descriptions {
  padding-bottom: 10px;
}
section.honda-technologies .item .contents-wrap .btn-wrap {
  margin-top: 20px;
}
section.honda-technologies .item .contents-wrap .btn-wrap a {
  padding: 0;
  min-width: 240px;
}
/* ===================== Honda Smart Technologies  ===================== */
/* ===================== Meet the Range  ===================== */
section.meet-the-range {
  position: relative;
  overflow: hidden;
  padding: 70px 0 50px;
}
section.meet-the-range .headline {
  font-family: 'Sofia Sans Extra Condensed', sans-serif;
  font-weight: 500;
  font-size: 88px;
  line-height: 1;
  letter-spacing: -1.5px;
}
section.meet-the-range .text_block {
  font-size: 15px;
}
section.meet-the-range .text_block iframe {
  width: 100%;
  position: absolute;
  height: 100%;
}
section.meet-the-range .text_block p:has(iframe) {
  padding-bottom: 56.25%;
  position: relative;
}
/* ===================== Meet the Range  ===================== */
/* ===================== All News & events  ===================== */
section.all-news-events {
  position: relative;
  overflow: hidden;
  padding: 60px 0 150px;
}
section.all-news-events .headline {
  text-align: center;
  font-family: 'Sofia Sans Extra Condensed', sans-serif;
  font-weight: 600;
  font-size: 52px;
  line-height: 0.9;
  letter-spacing: 0;
  margin-bottom: 20px;
}
section.all-news-events .descriptions {
  font-size: 15px;
  text-align: center;
  max-width: 540px;
  margin: auto;
  margin-bottom: 50px;
}
section.all-news-events .home-news-events-wrap {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 20px;
}
body.news-events header.site-header,
body.single-post header.site-header {
  box-shadow: 0px 4px 10px 0px rgba(28, 28, 28, 0.05);
}
/* ===================== All News & events  ===================== */
/* ===================== Single Blog Page  ===================== */
section.single-blog .container {
  max-width: 1155px;
  display: flex;
  align-items: flex-start;
}
section.single-blog .left {
  width: calc(100% - 290px);
  padding-right: 30px;
}
section.single-blog .right {
  position: sticky;
  top: 200px;
  width: 290px;
  background: #f1f2f1;
  padding: 20px 15px;
  border-radius: 10px;
  margin-top: 70px;
}
section.single-blog .left .headline {
  margin: 0;
  text-align: center;
  font-family: 'Sofia Sans Extra Condensed', sans-serif;
  font-weight: 600;
  font-size: 52px;
  line-height: 1;
  letter-spacing: 0;
  margin-bottom: 20px;
}
section.single-blog {
  padding: 60px 0 200px;
}
section.single-blog .left .thumbnail {
  display: flex;
}
section.single-blog .left .thumbnail img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 10px;
}
section.single-blog .left .single-blog-contents {
  max-width: 640px;
  margin: 30px auto 60px;
}
section.single-blog .left .single-blog-contents a {
  text-decoration: underline;
}
section.single-blog .right h4 {
  color: #0d0e0d;
  font-size: 15px;
  font-weight: 600;
  margin-bottom: 20px;
}
section.single-blog .right .related-posts a {
  font-weight: 400;
  font-size: 13px;
  line-height: 1.5;
  letter-spacing: 0;
  color: #0d0e0d;
  display: block;
  transition: all 0.3s ease-in;
}
section.single-blog .right .related-posts a:hover {
  opacity: 0.7;
}
section.single-blog .right .related-posts {
  display: grid;
  gap: 15px;
}
section.single-blog .left nav.navigation {
  margin: 0 auto;
  max-width: 640px;
}
section.single-blog .left nav.navigation a {
  position: relative;
  padding-right: 30px;
}
section.single-blog .left nav.navigation a::before {
  position: absolute;
  content: '';
  background-image: url(/wp-content/uploads/2025/01/right-arrow.svg);
  width: 20px;
  height: 20px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  right: 0;
  top: 2px;
}
section.single-blog .left nav.navigation .nav-previous a {
  padding-left: 30px;
  padding-right: 0;
}
section.single-blog .left nav.navigation .nav-previous a::before {
  right: auto;
  left: 0;
  transform: rotate(180deg);
}
blockquote {
  margin: 0;
  margin-bottom: 20px;
  padding: 15px 20px;
  box-shadow: 0px 4px 10px 0px rgba(28, 28, 28, 0.05);
  border-radius: 0 10px 10px 0;
  border-left: 4px solid #002d72;
}
.single-blog-contents h2 {
  font-size: 42px;
}
.single-blog-contents h2,
.single-blog-contents h3,
.single-blog-contents h4,
.single-blog-contents h5,
.single-blog-contents h6 {
  font-family: 'Sofia Sans Extra Condensed', serif;
  line-height: 1;
  margin-bottom: 20px;
}
.single-blog-contents h3 {
  font-size: 35px;
}
.single-blog-contents h4 {
  font-size: 30px;
}
.single-blog-contents h5 {
  font-size: 25px;
}
.single-blog-contents h6 {
  font-size: 20px;
}
/* ===================== Single Blog Page  ===================== */
/* ===================== Product Category Page  ===================== */
section.product-cat-hero {
  position: relative;
  overflow: hidden;
}
section.product-cat-hero .container {
  display: flex;
  flex-wrap: wrap;
}
section.product-cat-hero .left {
  width: 50%;
  padding-bottom: 50px;
  padding-right: 30px;
}
section.product-cat-hero .left .headline {
  font-family: 'Sofia Sans Extra Condensed', sans-serif;
  font-weight: 600;
  font-size: 52px;
  line-height: 1;
  letter-spacing: 0;
  margin: 0;
  padding: 40px 0 30px;
}
section.product-cat-hero .left .archive-description {
  font-size: 15px;
  max-width: 670px;
}
section.product-cat-hero .right {
  width: 50%;
  display: flex;
}
section.product-cat-hero .right img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-end-start-radius: 50px;
  border-end-end-radius: 50px;
}
/* ===================== Product Category Page  ===================== */
/* ===================== Product Hero  ===================== */
section.product-hero {
  position: relative;
  overflow: hidden;
  min-height: calc(100vh - 150px);
}
section.product-hero .container {
  position: absolute;
  z-index: 2;
  bottom: 0;
  left: 0;
  right: 0;
}
section.product-hero .bg-area {
  position: absolute;
  width: 100%;
  height: 100%;
  display: flex;
}
section.product-hero .bg-area video,
section.product-hero .bg-area img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
section.product-hero .contents-wrap {
  text-align: center;
  padding: 70px 0 30px;
  color: #fff;
}
section.product-hero .contents-wrap h1 {
  margin: 0;
  font-family: 'Sofia Sans Extra Condensed', sans-serif;
  font-weight: 600;
  font-size: 52px;
  line-height: 1;
  letter-spacing: 0;
  margin-bottom: 20px;
}
section.product-hero .contents-wrap .descriptions {
  font-family: 'Sofia Sans Extra Condensed', sans-serif;
  font-weight: 500;
  font-size: 32px;
  line-height: 1;
  letter-spacing: -0.2px;
  padding-bottom: 20px;
}
section.product-hero .contents-wrap .arrow {
  opacity: 0.3;
}
section.product-hero::before {
  position: absolute;
  content: '';
  width: 100%;
  height: 100%;
  z-index: 1;
  background: rgb(0, 0, 0, 0.3);
  background: linear-gradient(
    180deg,
    rgba(0, 0, 0, 0) 20%,
    rgba(0, 0, 0, 0.5) 100%
  );
}
/* ===================== Product Hero  ===================== */
/* ===================== Product Descriptions Section  ===================== */
section.product-descriptions {
  position: relative;
  overflow: hidden;
  padding: 80px 0;
  color: #fff;
}
section.product-descriptions .container {
  display: flex;
  flex-wrap: wrap;
  max-width: 1280px;
}
section.product-descriptions .descriptions {
  width: 60%;
  padding-right: 50px;
  font-size: 18px;
}
section.product-descriptions .descriptions-features-grid {
  width: 40%;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  text-align: center;
  gap: 40px;
  align-content: baseline;
}
section.product-descriptions .descriptions-features-grid .descriptions {
  width: 100%;
  font-size: 13px;
  padding: 0;
}
section.product-descriptions .descriptions-features-grid .thumbnail {
  height: 70px;
  display: flex;
  justify-content: center;
}
section.product-descriptions .descriptions-features-grid .thumbnail img {
  object-fit: contain;
}
section.product-descriptions .descriptions .headline {
  font-size: 64px;
  font-weight: 600;
  letter-spacing: 0px;
  line-height: 1;
  font-family: 'Sofia Sans Extra Condensed', sans-serif;
  margin-bottom: 20px;
}
section.product-feature-image {
  text-align: center;
  padding: 80px 0;
  min-height: 800px;
}
section.product-feature-image .container {
  position: relative;
}
section.product-feature-image img.offer {
  position: absolute;
  left: 0;
  top: 0;
  width: 200px;
}
/* ===================== Product Descriptions Section  ===================== */
/* ===================== Product BG Contents  ===================== */
section.product-bg-hero-w-contents {
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  padding: 150px 0;
  position: relative;
}
/* section.product-bg-hero-w-contents::before {
  position: absolute;
  content: '';
  height: 100%;
  width: 100%;
  left: 0;
  top: 0;
  background-color: rgba(0, 0, 0, 0.4);
} */
section.product-bg-hero-w-contents .container {
  height: 376px;
  display: flex;
  z-index: 9;
  position: relative;
}
section.product-bg-hero-w-contents .contents-wrap {
  max-width: 600px;
  color: #fff;
}
section.product-bg-hero-w-contents .contents-wrap .headline {
  font-family: 'Sofia Sans Extra Condensed', sans-serif;
  font-weight: 500;
  font-size: 42px;
  letter-spacing: 0;
  line-height: 1.3;
}
section.product-bg-hero-w-contents .contents-wrap .textblock {
  font-size: 15px;
  line-height: 1.5;
}
section.product-bg-hero-w-contents .bottom-left {
  align-items: flex-end;
}
section.product-bg-hero-w-contents .top-right {
  justify-content: flex-end;
}
section.product-bg-hero-w-contents .bottom-right {
  align-items: flex-end;
  justify-content: flex-end;
}
.single-product section.about-text-block .inner {
  max-width: 680px;
  margin: auto;
}
.single-product:not(.pc-rigging, .pc-accessories) section.home-why-us .left .headline {
  font-size: 36px;
  margin-bottom: 10px;
}
/* ===================== Product BG Contents  ===================== */
/* ===================== Product Slides Section  ===================== */
.take-closer-look-gallery .owl-stage {
  display: flex;
  align-items: center;
}
.take-closer-look-gallery .owl-item {
  transform: scale(0.9) !important;
  transition: all 0.3s ease-in;
  opacity: 0.5;
  width: 50% !important;
}
.take-closer-look-gallery .owl-item.active.center {
  transform: scale(1) !important;
  opacity: 1;
}
.related-information-gallery .owl-stage {
  display: flex;
  align-items: center;
}
.related-information-gallery .owl-item {
  transform: scale(0.9) !important;
  transition: all 0.3s ease-in;
  opacity: 0.5;
  width: 40% !important;
}
.related-information-gallery .owl-item.active.center {
  transform: scale(1) !important;
  opacity: 1;
}
.product-headline {
  text-align: center;
  color: rgb(13, 14, 13);
  padding: 60px 0 30px;
}
.product-headline .tagline {
  font-size: 16px;
  font-family: 'Sofia Sans Semi Condensed', sans-serif;
  font-weight: 500;
  letter-spacing: 1px;
  text-transform: uppercase;
  margin-bottom: 10px;
}
.product-headline .headline {
  font-family: 'Sofia Sans Extra Condensed', sans-serif;
  font-weight: 500;
  font-size: 36px;
  line-height: 38px;
  letter-spacing: 0;
}
section.product-honda-advantage {
  overflow: hidden;
  padding-bottom: 150px;
  position: relative;
}
section.product-honda-advantage .top {
  color: #000;
}
section.product-related-information {
  position: relative;
  overflow: hidden;
  padding-bottom: 60px;
}
section.product-take-closer-look .top {
  color: #fff;
}
section.product-take-closer-look {
  position: relative;
  overflow: hidden;
  padding-bottom: 60px;
  color: #fff;
}
.related-information-gallery .owl-item .descriptions,
.take-closer-look-gallery .owl-item .descriptions {
  font-size: 13px;
  line-height: 1.5;
  padding: 30px 20px 10px;
}
.related-information-gallery .owl-item .descriptions h3,
.take-closer-look-gallery .owl-item .descriptions h3 {
  font-family: 'Sofia Sans Semi Condensed', sans-serif;
  font-weight: 700;
  font-size: 20px;
  line-height: 1.2;
  letter-spacing: 0.024rem;
  margin-bottom: 10px;
}
.related-information-gallery .owl-item .thumbnail,
.take-closer-look-gallery .owl-item .thumbnail {
  display: flex;
  overflow: hidden;
  border-radius: 10px;
}
.related-information-gallery .owl-item .thumbnail img,
.take-closer-look-gallery .owl-item .thumbnail img {
  width: 100%;
  height: 100%;
}
.related-information-gallery .owl-item .link {
  margin-left: 20px;
  font-size: 15px;
  color: #0d0e0d;
}
.related-information-gallery .owl-item .descriptions,
.related-information-gallery .owl-item .link,
.take-closer-look-gallery .owl-item .descriptions,
.take-closer-look-gallery .owl-item .link {
  opacity: 0;
  transition: all 0.3s ease-in;
}
.related-information-gallery .owl-item.active.center .descriptions,
.related-information-gallery .owl-item.active.center .link,
.take-closer-look-gallery .owl-item.active.center .descriptions,
.take-closer-look-gallery .owl-item.active.center .link {
  opacity: 1;
}
.product-honda-advantage-gallery {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  text-align: center;
  gap: 60px;
}
.product-honda-advantage-gallery img {
  height: 130px;
  object-fit: contain;
}
.product-honda-advantage-gallery .thumbnail {
  display: flex;
  justify-content: center;
}
.product-honda-advantage-gallery .title {
  font-family: 'Sofia Sans Semi Condensed', sans-serif;
  font-weight: 700;
  font-size: 20px;
  line-height: 1.2;
  letter-spacing: 0.024rem;
  padding: 10px 0;
}
.product-honda-advantage-gallery .descriptions {
  font-size: 15px;
}
.product-honda-advantage-gallery .button {
  margin-top: 30px;
}
.single-product .owl-nav {
  position: absolute;
  width: 100%;
  top: 25%;
  display: flex;
  justify-content: space-between;
  pointer-events: none;
}
.single-product .owl-nav button {
  background: rgba(0, 0, 0, 0.3) !important;
  border: none !important;
  height: 180px;
  width: 90px;
  z-index: 2;
  display: flex;
  color: #fff !important;
  align-items: center;
  pointer-events: auto;
}
.single-product .owl-nav button svg {
  width: 70px;
  height: auto;
  max-width: 100%;
}
.single-product .owl-nav button.owl-next {
  border-radius: 90px 0 0 90px;
  justify-content: flex-end;
}
.single-product .owl-nav button.owl-prev {
  border-radius: 0 90px 90px 0;
}
.single-product .owl-dots {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 15px;
  padding-top: 60px;
}
.single-product .owl-dots .owl-dot {
  width: 10px;
  height: 10px;
  background-color: #0d0e0d;
  opacity: 0.2;
  border-radius: 50%;
}
.single-product .owl-dots .owl-dot.active {
  opacity: 1;
  height: 14px;
  width: 14px;
}
.single-product section.product-take-closer-look .owl-dots .owl-dot {
  background-color: #fff;
}
/* ===================== Product Slides Section  ===================== */
/* ===================== Product Features Grid  ===================== */
section.product-feature-grid {
  overflow: hidden;
  position: relative;
  padding: 50px 0;
}
section.product-feature-grid .feature-grid {
  display: grid;
  gap: 40px 20px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  color: #fff;
  font-size: 13px;
}
section.product-feature-grid .feature-grid .item {
  position: relative;
  overflow: hidden;
}
section.product-feature-grid .feature-grid .item .image-popup-grid {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 2;
}
section.product-feature-grid .feature-grid .item .thumbnail {
  position: relative;
  display: flex;
  max-height: 330px;
  border-radius: 10px;
  overflow: hidden;
  margin-bottom: 10px;
}
section.product-feature-grid .feature-grid .item .thumbnail img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
section.product-feature-grid .feature-grid .item .thumbnail .overlay {
  position: absolute;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.6);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  transition: all 0.3s ease-in;
  text-align: center;
  opacity: 0;
}
section.product-feature-grid .feature-grid .item .thumbnail .overlay span {
  display: block;
  font-weight: 300;
}
section.product-feature-grid .feature-grid .item .thumbnail .overlay svg {
  max-width: 40px;
}
section.product-feature-grid .feature-grid .item:hover .thumbnail .overlay {
  opacity: 1;
}
section.product-feature-grid .feature-grid .item .headline {
  font-weight: 600;
  font-size: 15px;
  font-family: 'Open Sans', serif;
  margin-bottom: 6px;
}
.mfp-bg,
.mfp-wrap {
  z-index: 999999 !important;
}
/* ===================== Product Features Grid  ===================== */
/* ===================== Product Specifications  ===================== */
section.product-specification {
  position: relative;
  overflow: hidden;
  padding: 70px 0;
}
section.product-specification .container {
  display: flex;
  flex-wrap: wrap;
}
section.product-specification .left {
  width: 50%;
}
section.product-specification .right {
  width: 50%;
  text-align: center;
}
section.product-specification .left .headline {
  font-size: 16px;
  font-family: 'Sofia Sans Semi Condensed', sans-serif;
  font-weight: 500;
  letter-spacing: 1px;
  text-transform: uppercase;
  margin-bottom: 20px;
}
section.product-specification .left .faq-item {
  border-bottom: 1px solid #e3e3e3;
}
section.product-specification .left .faq-question {
  padding: 15px 30px 15px 0;
  position: relative;
  cursor: pointer;
}
section.product-specification .left .faq-question .icon {
  position: absolute;
  right: 5px;
  top: 50%;
  transform: translateY(-50%);
  width: 26px;
  height: 26px;
  display: flex;
  align-items: center;
  justify-content: center;
}
section.product-specification .left .faq-question .icon svg {
  position: absolute;
}
section.product-specification .left .faq-question .icon svg.minus {
  opacity: 0;
}
section.product-specification .left .faq-question.active .icon svg.minus {
  opacity: 1;
}
section.product-specification .left .faq-answers {
  position: relative;
  margin-bottom: 20px;
  display: none;
}
section.product-specification .left .faq-answers .item {
  display: flex;
  align-items: center;
}
section.product-specification .left .faq-answers .item .name {
  width: 40%;
  border-right: 4px solid #fff;
}
section.product-specification .left .faq-answers .item .desc {
  width: 60%;
}
section.product-specification .left .faq-answers .item:nth-child(odd) {
  background-color: #f7f8f7;
}
section.product-specification .left .faq-answers .item div {
  display: flex;
  align-items: center;
  min-height: 42px;
  padding: 5px 9px;
}
/* ===================== Product Specifications  ===================== */
.product-cat-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 20px;
  padding: 50px 0 150px;
}
.product-item-card {
  position: relative;
  background-color: #f7f8f7;
  transition: background 0.3s cubic-bezier(0.42, 0, 0.61, 0.97) 0s;
  font-size: 14px;
  border-radius: 10px;
  overflow: hidden;
  padding: 30px 30px 30px;
  min-height: 435px;
}
.product-item-card .thumbnail {
  position: relative;
  height: 210px;
  display: flex;
  margin-bottom: 30px;
}
.product-item-card .thumbnail img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.product-item-card .descriptions-area .title {
  font-family: 'Sofia Sans Extra Condensed', sans-serif;
  font-size: 32px;
  line-height: 1;
  letter-spacing: -0.2px;
  display: block;
  hyphens: auto;
  margin: 5px 0 10px;
  word-wrap: break-word;
  font-weight: 600;
  overflow: hidden;
}
.product-item-card .descriptions-area .specification {
  font-size: 13px;
  letter-spacing: 0;
  line-height: 16px;
  overflow: hidden;
  margin: 0;
  box-sizing: unset !important;
  text-overflow: ellipsis;
  max-width: 100%;
  transition: color 0.3s cubic-bezier(0.42, 0, 0.61, 0.97) 0s;
}
.product-item-card .descriptions-area .specification p {
  padding: 4px 0;
  margin: 0;
}
.product-item-card .descriptions-area .specification p span {
  color: #8a8e8a;
}
.product-item-card .descriptions-area .price {
  font-family: 'Sofia Sans Semi Condensed', sans-serif;
  font-weight: 700;
  font-size: 20px;
  line-height: 1.3;
  letter-spacing: 0.024rem;
  white-space: nowrap;
  padding-top: 13px;
  transition: color 0.3s cubic-bezier(0.42, 0, 0.61, 0.97) 0s;
}
.product-item-card .descriptions-area .price span {
  font-size: 13px;
  font-weight: 400;
}
.product-item-card .hover-card {
  position: absolute;
  bottom: 30px;
  left: 30px;
  width: calc(100% - 60px);
  display: grid;
  gap: 5px;
  z-index: 10;
  opacity: 0;
  transition: opacity 0.3s cubic-bezier(0.42, 0, 0.61, 0.97) 0s;
}
.product-item-card .hover-card a {
  height: 44px;
}
.product-item-card:hover {
  background-color: #002d72;
  color: #fff;
}
.product-item-card:hover .descriptions-area .specification {
  opacity: 0;
}
.product-item-card:hover .descriptions-area .price {
  opacity: 0;
}
.product-item-card:hover .hover-card {
  opacity: 1;
}
.product-item-card .hover-card a.fill {
  background-color: #fff;
  color: #0d0e0d;
  border-color: #fff;
}
.product-item-card .hover-card a.transparent {
  border-color: #fff;
  color: #fff;
}
.product-item-card .thumbnail img.offer {
  width: 84px;
  height: auto;
  position: absolute;
  left: -25px;
  top: -20px;
}
.featured-products .owl-nav {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  pointer-events: none;
}
.featured-products .owl-nav button {
  width: 90px;
  height: 180px;
  z-index: 2;
  color: #fff !important;
  background: rgba(0, 0, 0, 0.3) !important;
  display: flex;
  align-items: center;
  border-radius: 0 90px 90px 0;
  pointer-events: auto;
}
.featured-products .owl-nav button svg {
  max-width: 70px;
}
.featured-products .owl-nav button.owl-next {
  border-radius: 90px 0 0 90px;
  justify-content: flex-end;
}
.featured-products .owl-nav button.disabled {
  opacity: 0.2;
}

section.enquire-form {
  box-shadow: 0 20px 30px -20px rgba(0, 0, 0, 0.12) inset;
  padding-top: 60px;
  padding-bottom: 120px;
  background-color: #f7f8f7;
}
section.enquire-form .inner {
  max-width: 420px;
  margin: auto;
}
section.enquire-form .inner .headline {
  font-family: 'Sofia Sans Extra Condensed', sans-serif;
  font-weight: 500;
  font-size: 36px;
  line-height: 1.1;
  letter-spacing: 0;
  margin-bottom: 20px;
}
section.enquire-form .inner .description {
  font-size: 15px;
  margin-bottom: 20px;
}
.default-form {
  display: grid;
  gap: 20px;
  font-size: 14px;
}
.default-form input,
.default-form select,
.default-form textarea {
  width: 100%;
  color: #0d0e0d;
  border: 1px solid #d2d6d3;
  background-color: #fff;
  box-shadow: none;
  padding: 13px 15px;
  min-height: 46px;
  border-radius: 3px;
  font-size: 15px;
  line-height: 20px;
  outline: none;
  transition: all 0.3s ease-in;
  margin-top: 6px;
}
.default-form input:focus,
.default-form select:focus,
.default-form textarea:focus {
  border: 1px solid #002d72;
}
.default-form .two {
  display: flex;
  gap: 20px;
}
.default-form textarea {
  height: 88px;
}
.default-form .submit input {
  height: 50px;
  width: 200px;
  background-color: #002d72;
  border-color: #002d72;
  color: #fff;
  text-transform: uppercase;
  letter-spacing: 1px;
  font-family: 'Sofia Sans Semi Condensed', sans-serif;
}
.default-form .text {
  font-size: 13px;
  color: #8a8e8a;
}
@media screen and (min-width: 1024px) {
  .mobile-menu-wrapper {
    display: none !important;
  }
}
@media screen and (max-width: 1280px) {
  header.site-header .right button.search-toggle span {
    display: none;
  }
}
@media screen and (max-width: 1180px) {
  section.home-hero .slide-item img.mobile-image {
    display: block;
  }
  section.home-hero .slide-item img.desktop-image {
    display: none;
  }
  section.home-hero .slide-item {
    height: 550px;
  }
  section.home-hero .slide-item .headline {
    font-size: 70px;
  }
  section.home-hero .owl-dots {
    bottom: 50px;
  }
  .footer-cta .right {
    position: absolute;
    padding-bottom: 0;
    top: -40px;
    padding-left: 0;
    text-align: left;
    width: auto;
  }
  .footer-cta .container {
    padding-top: 100px;
  }
  .footer-cta .right img {
    position: relative;
    top: 0;
    max-width: 200px;
  }
  .footer-cta .left {
    width: 35%;
  }
  .footer-cta .middle {
    width: 65%;
    padding-left: 20px;
  }
  section.about-hero {
    height: 330px;
  }
  section.about-text-block {
    padding: 70px 0 50px;
  }
  section.home-why-us .left .headline {
    font-size: 42px;
  }
  section.home-why-us {
    padding: 30px 0 50px;
  }
  section.single-blog .left .headline {
    font-size: 45px;
  }
  .single-blog-contents h2 {
    font-size: 37px;
  }
  .single-blog-contents h3 {
    font-size: 32px;
  }
  .single-blog-contents h4 {
    font-size: 28px;
  }
  section.celebrating-text-block .headline {
    margin-bottom: 40px;
  }
  section.meet-the-range .headline {
    font-size: 60px;
  }
  .product-cat-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .product-honda-advantage-gallery .item:last-child {
    display: none;
  }
  .product-honda-advantage-gallery {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  section.about-text-block .headline {
    font-size: 45px;
  }
  section.product-honda-advantage {
    padding-bottom: 100px;
  }
}
@media screen and (max-width: 1023px) {
  header.site-header .left .menu-primary-menu-container {
    display: none;
  }
  .top-header {
    display: none;
  }
  header.site-header {
    height: 55px;
  }
  header.site-header .left .site-branding a img {
    height: 36px;
  }
  section.browse-the-range {
    padding: 50px 0 50px;
  }
  section.browse-the-range .categories-card {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  section.home-why-us .left .headline {
    font-size: 37px;
  }
  section.home-why-us .left .descriptions {
    font-size: 14px;
  }
  section.home-why-us {
    padding: 30px 0 50px;
  }
  section.home-perfect-outboard .gallery .item {
    height: 300px;
  }
  section.home-perfect-outboard .box-area .headline {
    font-size: 37px;
  }
  section.home-perfect-outboard .box-area {
    max-width: 500px;
    padding: 25px 30px 35px;
    margin: -85px auto 0;
  }
  section.home-perfect-outboard {
    padding: 50px 0;
  }
  section.home-news-events {
    padding: 50px 0;
  }
  .blog-post-item .info {
    padding: 20px 20px 30px;
  }
  footer.site-footer .top-main-footer .right {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    padding-left: 50px;
  }
  section.about-hero .headline {
    font-size: 45px;
  }
  section.about-hero {
    height: 300px;
  }
  section.about-text-block {
    padding: 50px 0 30px;
  }
  section.about-text-block .headline {
    font-size: 40px;
  }
  section.honda-technologies .container {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  section.honda-technologies {
    padding: 20px 0 120px;
  }
  section.all-news-events .home-news-events-wrap {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  section.all-news-events {
    padding: 30px 0 120px;
  }
  section.all-news-events .headline {
    font-size: 45px;
  }
  section.single-blog .right {
    width: 210px;
    padding-right: 5px;
  }
  section.single-blog .left {
    width: calc(100% - 210px);
  }
  section.single-blog .left .headline {
    font-size: 37px;
  }
  .single-blog-contents h2 {
    font-size: 32px;
  }
  .single-blog-contents h3 {
    font-size: 30px;
  }
  .single-blog-contents h4 {
    font-size: 25px;
  }
  section.celebrating-text-block .headline {
    margin-bottom: 20px;
  }
  section.meet-the-range .headline {
    font-size: 45px;
  }
  .product-cat-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  section.product-cat-hero .left .headline {
    font-size: 42px;
  }
  section.product-hero .contents-wrap h1 {
    font-size: 45px;
    margin-bottom: 10px;
  }
  section.product-hero .contents-wrap .descriptions {
    font-size: 25px;
    padding-bottom: 10px;
  }
  section.product-hero {
    min-height: calc(100vh - 60px);
  }
  section.product-descriptions .descriptions .headline {
    font-size: 50px;
  }
  section.product-descriptions .descriptions {
    font-size: 15px;
    width: 55%;
    padding-right: 40px;
  }
  section.product-descriptions .descriptions-features-grid {
    width: 45%;
    gap: 40px 15px;
  }
  section.product-feature-image {
    padding: 50px 0;
  }
  section.product-bg-hero-w-contents {
    padding: 70px 0;
  }
  section.product-feature-grid .feature-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  section.product-specification .left .faq-answers {
    font-size: 15px;
  }
  .product-honda-advantage-gallery img {
    height: 80px;
  }
  .product-honda-advantage-gallery .title {
    font-size: 18px;
  }
  .product-honda-advantage-gallery .descriptions {
    font-size: 14px;
  }
  .product-honda-advantage-gallery {
    gap: 40px;
  }
  header.site-header .right button.menu-trigger {
    display: block;
  }
  .logged-in .mobile-menu-wrapper {
    height: calc(100% - 87px);
    top: 87px;
  }
  .mobile-menu-wrapper {
    position: fixed;
    width: 100%;
    height: calc(100% - 53px);
    top: 55px;
    background-color: #fff;
    z-index: 999;
    overflow: auto;
    padding: 20px 30px;
  }
  .mobile-menu-wrapper::-webkit-scrollbar {
    display: none;
  }
  .mobile-menu-wrapper ul {
    list-style: none;
    padding: 0;
    margin: 0;
    display: grid;
    gap: 20px;
  }
  .mobile-menu-wrapper ul ul.sub-menu {
    padding: 10px 0 0px 10px;
    display: none;
  }
  .mobile-menu-wrapper ul li a {
    font-size: 22px;
    font-weight: 600;
    display: block;
    position: relative;
  }
  .mobile-menu-wrapper ul li a span.icon {
    position: absolute;
    right: 0;
    top: 50%;
    display: flex;
    transform: translateY(-50%);
  }
  .mobile-menu-wrapper ul li a span.icon svg {
    width: 20px;
    transition: all 0.3s ease-in;
  }
  .mobile-menu-wrapper ul li a.active span.icon svg {
    transform: rotate(180deg);
  }
  .mobile-menu-wrapper ul ul.sub-menu li a {
    font-size: 18px;
    font-weight: 500;
  }
  .mobile-menu-wrapper ul ul.sub-menu .wrap {
    display: grid;
    gap: 10px;
  }
}
@media screen and (max-width: 767px) {
  section.home-hero .slide-item {
    height: 480px;
  }
  section.home-hero .slide-item .headline {
    font-size: 45px;
  }
  .button {
    height: 43px;
  }
  section.home-hero .slide-item .button {
    font-size: 15px;
    min-width: 235px;
  }
  section.home-hero .slide-item .sub-headline {
    font-size: 15px;
  }
  .container {
    padding-left: 20px;
    padding-right: 20px;
  }
  footer.site-footer .top-main-footer {
    flex-flow: column-reverse;
  }
  footer.site-footer .top-main-footer .left {
    width: 100%;
    padding: 40px 0 0;
    text-align: center;
  }
  footer.site-footer .top-main-footer .right {
    width: 100%;
    padding: 0;
  }
  footer.site-footer .main-footer {
    padding: 40px 0 30px;
  }
  footer.site-footer .top-main-footer .left p {
    margin: 20px auto 0;
  }
  footer.site-footer .bottom-main-footer {
    justify-content: center;
    padding-top: 20px;
  }
  footer.site-footer .bottom-main-footer .social-links {
    justify-content: center;
  }
  footer.site-footer .bottom-footer .copy-right {
    width: 100%;
    height: auto;
    justify-content: center;
    padding-top: 16px;
  }
  footer.site-footer .bottom-footer .container {
    justify-content: center;
    padding: 20px 20px 30px;
  }
  .footer-cta .left {
    width: 100%;
  }
  .footer-cta .middle {
    width: 100%;
    padding: 20px 0 0;
  }
  .stay-up-to-date {
    grid-template-columns: repeat(1, minmax(0, 1fr));
    gap: 10px;
  }
  .stay-up-to-date .item input.wpcf7-submit {
    margin-top: 10px;
  }
  .featured-products .owl-nav button {
    width: 60px;
    height: 120px;
  }
  .featured-products .owl-nav button svg {
    max-width: 50px;
  }
  section.home-featured-products {
    padding: 30px 20px 20px;
  }
  .featured-products .owl-nav {
    width: calc(100% + 40px);
    left: -20px;
  }
  section.home-why-us .container {
    display: flex;
    flex-flow: column-reverse;
  }
  section.home-why-us .container.reverse-column {
    flex-flow: column;
  }
  section.home-why-us .left .inner {
    padding: 0;
    max-width: 100%;
  }
  section.home-perfect-outboard .gallery {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    border-radius: 0;
  }
  section.home-perfect-outboard .container {
    position: relative;
  }
  section.home-perfect-outboard .box-area {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    margin: 0 auto;
    width: 96%;
    left: 0;
    right: 0;
  }
  section.home-perfect-outboard .box-area .headline {
    font-size: 35px;
  }
  section.home-perfect-outboard .gallery .item {
    height: 250px;
  }
  section.home-perfect-outboard {
    padding: 50px 0 0;
  }
  section.home-news-events .headline {
    font-size: 32px;
  }
  section.home-news-events .tagline {
    font-size: 14px;
    margin-bottom: 0;
  }
  section.home-news-events .home-news-events-wrap {
    grid-template-columns: repeat(1, minmax(0, 1fr));
  }
  .blog-post-item .info .title {
    font-size: 28px;
  }
  section.home-news-events {
    padding: 50px 0 80px;
  }
  section.browse-the-range .categories-card .card-item .title {
    font-size: 32px;
    padding: 0 10px 20px;
  }
  section.browse-the-range .button {
    margin-top: 30px;
  }
  section.home-why-us .left .headline {
    font-size: 30px;
  }
  section.about-text-block .headline {
    font-size: 32px;
  }
  section.about-hero .headline {
    font-size: 35px;
  }
  section.about-hero {
    height: 250px;
  }
  section.honda-technologies .container {
    grid-template-columns: repeat(1, minmax(0, 1fr));
  }
  section.all-news-events .headline {
    font-size: 35px;
  }
  section.all-news-events .home-news-events-wrap {
    grid-template-columns: repeat(1, minmax(0, 1fr));
  }
  .blog-post-item .thumbnail {
    height: 220px;
  }
  section.single-blog .right {
    position: initial;
    width: 100%;
    margin-top: 30px;
  }
  section.single-blog .container {
    flex-wrap: wrap;
  }
  section.single-blog .left {
    width: 100%;
    padding: 0 0 0;
  }
  section.single-blog {
    padding: 50px 0 100px;
  }
  section.single-blog .left .headline {
    font-size: 35px;
  }
  section.single-blog .left .single-blog-contents {
    max-width: 100%;
  }
  section.meet-the-range {
    padding-top: 0;
  }
  .default-form .two {
    flex-wrap: wrap;
  }
  section.product-cat-hero .container {
    flex-flow: column-reverse;
    padding: 0;
  }
  section.product-cat-hero .left {
    width: 100%;
    padding: 0 20px;
  }
  section.product-cat-hero .left .headline {
    font-size: 35px;
    padding-bottom: 10px;
  }
  section.product-cat-hero .right {
    width: 100%;
  }
  section.product-cat-hero .right img {
    border-end-start-radius: 20px;
    border-end-end-radius: 20px;
  }
  .single-product .owl-nav button {
    width: 60px;
    height: 120px;
  }
  .single-product .owl-nav button svg {
    width: 45px;
  }
  section.product-hero .contents-wrap h1 {
    font-size: 40px;
  }
  section.product-hero .contents-wrap .descriptions {
    font-size: 22px;
  }
  section.product-descriptions .descriptions {
    width: 100%;
    padding: 0;
  }
  section.product-descriptions .descriptions-features-grid {
    width: 100%;
    padding-top: 30px;
  }
  section.product-descriptions {
    padding: 50px 0;
  }
  section.product-descriptions .descriptions .headline {
    font-size: 40px;
  }
  section.product-feature-image {
    min-height: auto;
    padding: 30px 0;
  }
  section.product-feature-image img.offer {
    width: 90px;
  }
  section.product-bg-hero-w-contents .contents-wrap .headline {
    font-size: 35px;
  }
  .product-headline .headline {
    font-size: 32px;
  }
  .product-headline .tagline {
    font-size: 14px;
    margin-bottom: 5px;
  }
  .product-headline {
    padding: 40px 0 20px;
  }
  section.product-take-closer-look {
    padding-bottom: 30px;
  }
  .single-product .owl-dots {
    padding-top: 30px;
  }
  section.product-feature-grid .feature-grid {
    grid-template-columns: repeat(1, minmax(0, 1fr));
  }
  section.product-specification .left {
    width: 100%;
  }
  section.product-specification .right {
    width: 100%;
  }
  section.product-specification {
    padding: 50px 0;
  }
  .product-honda-advantage-gallery {
    grid-template-columns: repeat(1, minmax(0, 1fr));
  }
  .product-honda-advantage-gallery .item:last-child {
    display: block;
  }
  section.product-honda-advantage {
    padding-bottom: 50px;
  }
  .mobile-menu-wrapper {
    padding: 20px 20px;
  }
}
@media screen and (max-width: 580px) {
  .product-cat-grid {
    grid-template-columns: repeat(1, minmax(0, 1fr));
  }
}
