/*!
Theme Name: YYC taxPOD Theme
Theme URI: http://underscores.me/
Author: Lim Kah Beng
Author URI: http://kahbengl.com
Description: This is a theme for YYC taxPOD 2.0.
Version: 1.2.3
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: yyc-taxpod-theme
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.

YYC taxPOD Theme 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/
*/

/* Reset CSS */
* {
  box-sizing: border-box;
  margin-block-start: 0;
  margin-block-end: 0;
}

:root {
  --content-max-width: 1000px;
}

:root :where(.is-layout-flow)>* {
  margin-block-start: 0;
}

:root :where(.is-layout-constrained)>* {
  margin-block-start: 0;
}

a {
  color: #0B8EBB;
  font-weight: 600;
}

p {
  line-height: 22px;
}

/*Header Menu*/
.wp-block-navigation a {
  padding: 22.5px 0;
  font-family: var(--wp--preset--font-family--inter);
  font-weight: 500;
  font-size: 1.125rem;
}

.header-menu {
  position: fixed;
  z-index: 999;
  width: 100%;
  background-color: #ffffff;
}

.wp-block-navigation a:hover {
  box-shadow: inset 0 -4px 0 #00AFED;
}

.wp-block-navigation .current-menu-item {
  box-shadow: inset 0 -4px 0 #00AFED;
}

.wp-block-navigation-item.current-menu-ancestor>.wp-block-navigation-item__content {
  box-shadow: inset 0 -4px 0 #00AFED;
}

.wp-block-navigation-item.has-child:hover>.wp-block-navigation-item__content {
  box-shadow: inset 0 -4px 0 #00AFED;
}

.wp-block-navigation-item.has-child:hover .wp-block-navigation__submenu-container:hover~.wp-block-navigation-item__content,
.wp-block-navigation-item.has-child:hover .wp-block-navigation__submenu-container .wp-block-navigation-item:hover~.wp-block-navigation-item__content {
  box-shadow: inset 0 -4px 0 #00AFED;
}

.footer-menu .wp-block-navigation .current-menu-item {
  box-shadow: none;
}

.header-menu .wp-block-navigation {
  column-gap: 2.5rem;
}

.wp-block-navigation-submenu li a {
  padding: 0;
  padding-bottom: 1px;
}

ul.wp-block-navigation__submenu-container.wp-block-navigation-submenu {
  padding: 24px 16px;
  border-radius: 10px;
  gap: 1rem;
  box-shadow: 0px 1px 3px 0px rgba(10, 13, 18, 0.1);
  border: none !important;
  ;
}

.wp-block-navigation-submenu .current-menu-item {
  box-shadow: none;
  color: #00AFED;
}

.wp-block-navigation-submenu ul a:hover {
  box-shadow: none;
  color: #00AFED !important;
}

.wp-block-navigation-submenu li a span {
  font-family: var(--wp--preset--font-family--lato);
  font-weight: 400;
  line-height: 22px;
  font-size: 1rem;
}

.separator-line {
  border-top: 1px solid !important;
  flex-grow: 1;
}

h1 {
  /* font-family: var(--wp--preset--font-family--poppins); */
  font-family: var(--wp--preset--font-family--inter);
}

h2,
h3,
h4,
h5,
h6 {
  font-family: var(--wp--preset--font-family--inter);
}

body {
  font-family: var(--wp--preset--font-family--lato);
  margin: 0;
  padding: 0;
}

#player {
  border-radius: 16px;
}

.section-label,
.mainpage-hero-subtext {
  text-transform: uppercase;
  font-family: var(--wp--preset--font-family--inter);
}

/* Why Choose YYC section */
.mainpage-hero-subtext {
  font-family: var(--wp--preset--font-family--inter);
}

.why-choose-yyc-video {
  width: 396px;
  height: 222.5px;
  top: 22px;
  left: 20px;
  position: relative;
}

/* Page Design */
.is-layout-constrained .entry-content {
  margin-left: 0;
  margin-right: 0;
  max-width: none;
}

.page-heading-seperator {
  width: 66px;
  border: 3px solid #00AFED;
  padding-bottom: 0px !important;
  padding-top: 0px !important;
  margin: 0;
}

.page-hero-banner {
  position: relative;
  /* allow absolute positioning inside */
  z-index: 0;
  /* make sure overlay goes behind content */
}

/* Gradient overlay */
.page-hero-banner::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 1;
  /* sits above background image but below content */
  background:
    linear-gradient(0deg, rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4)),
    linear-gradient(285.32deg, rgba(0, 0, 0, 0) 44.33%, rgba(1, 8, 8, 0.21) 77.32%, rgba(1, 13, 13, 0.7) 98.59%);
}

/* Ensure content stays above overlay */
.page-hero-banner>* {
  position: relative;
  z-index: 2;
}

/* Our Tax Expert Page Design */
.wp-block-latest-posts.is-grid {
  gap: 1rem;
}

.wp-block-latest-posts.is-grid li {
  margin: 0;
}

/* Make each expert card consistent */
.wp-block-latest-posts__list li {
  list-style: none;
  max-width: 238px;
  border-radius: 24px;
  overflow: hidden;
  position: relative;
}

.tax-experts-profile .wp-block-latest-posts__featured-image img {
  height: revert-layer;
}

/* Tax Expert Article Design */
.rank-math-breadcrumb p {
  font-size: 14px;
}

.rank-math-breadcrumb a {
  color: #0B8EBB;
}

.rank-math-breadcrumb .last {
  color: #83858A;
}

.rank-math-breadcrumb .separator {
  color: #817F7F;
  margin: 0 0.5rem;
}

/* Featured image wrapper */
.wp-block-latest-posts__featured-image {
  position: relative;
  border-radius: 16px;
  overflow: hidden;
  background: linear-gradient(0deg, #E0F2FE, #E0F2FE), linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(1, 15, 20, 0.12) 46.64%, rgba(2, 26, 34, 0.4) 93.29%);
}

/* Overlay text container */
.latest-posts-text {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  text-align: center;
  color: #fff;
  padding: 0 24px 24px 24px;
  z-index: 2;
  display: flex;
  flex-direction: column;
  top: 214px;
}

/* Add gradient background for readability */
.wp-block-latest-posts__featured-image::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 40%;
  background: linear-gradient(to top, rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0));
  z-index: 1;
}

/* Name styling */
.wp-block-latest-posts__post-title {
  font-size: 1.125rem;
  font-weight: 600;
  margin-bottom: 4px;
  color: white;
  text-decoration: none;
  font-family: var(--wp--preset--font-family--inter);
}

/* Excerpt styling */
.wp-block-latest-posts__post-excerpt {
  font-size: 0.875rem;
  font-weight: 600;
  font-family: var(--wp--preset--font-family--inter);
}

/* Knowledge Hub Design */
.knowledge-hub-card-title {
  transition: color 300ms linear 0ms;
}

.knowledge-hub-card:hover .knowledge-hub-card-title {
  color: #00B0ED;
}

.wp-block-read-more {
  width: auto;
}

.stretched-link {
  position: absolute;
  inset: 0;
  z-index: 9999;
  text-indent: -9999px;
}

/* Footer Design */
.footer-menu {
  row-gap: 16px;
}

.footer-menu-container ul {
  list-style: none;
  display: flex;
  flex-direction: column;
  padding-inline-start: unset;
}

.footer-menu li.wp-block-navigation-item.wp-block-navigation-link {
  margin: 0;
}

.footer-menu li {
  display: inline-block;
  margin-bottom: 16px;
  transition: all 300ms linear 0ms;
}

.footer-menu a.wp-block-navigation-item__content {
  padding: 0;
}

.footer-menu li a {
  text-decoration-line: none;
}

.footer-menu li a::before {
  content: url("data:image/svg+xml,<svg xmlns=%27http://www.w3.org/2000/svg%27 width=%2717%27 height=%2716%27 viewBox=%270 0 17 16%27 fill=%27none%27><path fill-rule=%27evenodd%27 clip-rule=%27evenodd%27 d=%27M6.50366 2.66675L11.837 8.00008L6.50366 13.3334L5.16699 12.0001L9.17033 8.00008L5.16699 4.00008L6.50366 2.66675Z%27 fill=%27white%27/></svg>");
  ;
  font-weight: 900;
  margin-right: 8px;
  -webkit-transform: translate(0, -50%);
  -khtml-transform: translate(0, -50%);
  -moz-transform: translate(0, -50%);
  -ms-transform: translate(0, -50%);
  -o-transform: translate(0, -50%);
  transform: translate(0, -50%);
}

/* Footer Animation */
.footer-menu li:hover {
  transform: translateX(8px);
  transition: all 300ms linear 0ms;
}

/* Underline animation */
.footer-menu li a::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 0%;
  height: 2px;
  background-color: #fff;
  transition: width 0.3s ease;
}

.footer-menu .wp-block-navigation a:hover {
  box-shadow: none;
}

.footer-menu a:hover::after {
  width: 100%;
}

.footer-content {
  font-family: var(--wp--preset--font-family--inter);
}

.footer-copyright {
  font-family: var(--wp--preset--font-family--poppins);
}

/* Single Article */
.article-hero-banner {
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
}

.article-hero-banner::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 1;
  background: linear-gradient(0deg, rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4)), linear-gradient(285.32deg, rgba(0, 0, 0, 0) 44.33%, rgba(1, 8, 8, 0.21) 77.32%, rgba(1, 13, 13, 0.7) 98.59%);
}

.article-hero-inner {
  z-index: 2;
}

.article-hero-title {
  font-size: 50px;
  font-family: var(--wp--preset--font-family--poppins);
  font-weight: 600;
}

.article-hero-subtext {
  font-size: 1.25rem;
  color: #FFFFFF;
  margin-top: 1px;
  font-weight: 500;
  font-family: var(--wp--preset--font-family--inter);
}

.article-main {
  padding: 3rem 0 5.25rem 0;
}

.article-main .breadcrumb-wrap {
  margin-bottom: 1.5rem;
  max-width: var(--content-max-width);
  margin-inline: auto;
}

.article-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 268px);
  gap: 2rem;
  max-width: var(--content-max-width);
  margin-inline: auto;
}

.article-featured-image img {
  border-radius: 20px;
  max-height: 400px;
  margin-bottom: 2rem;
}

.article-post-title {
  font-family: var(--wp--preset--font-family--inter);
  font-weight: 600;
  font-size: 1.5rem;
  margin-bottom: 0.5rem;
  color: #231F20;
}

.meta-details {
  display: flex;
  gap: 1rem;
  font-family: var(--wp--preset--font-family--lato);
  color: #817F7F;
  margin-bottom: 2rem;
  font-size: 14px;
}

.post-date {
  display: flex;
  gap: 3px;
}

.article-tags-sharing {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.5rem 1rem;
  margin-top: 2rem;
  font-size: 14px;
  justify-content: space-between;
}

.article-tags,
.article-sharing {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.article-tags-sharing-text {
  font-weight: 600;
  color: #333;
}

.article-tags-sharing-text {
  font-weight: 700;
  color: #231F20;
}

.taxonomy-post_tag a {
  color: #F7752C;
  font-weight: 400;
}

.article-main hr {
  color: #CFD9DD;
  margin: 2rem 0;
}

.related-links {
  margin-bottom: 2rem;
}

.related-links h3 {
  font-family: var(--wp--preset--font-family--inter);
  font-weight: 600;
  font-size: 1.5rem;
  margin-bottom: 0.5rem;
}

.related-links h5 {
  color: #4B4848;
  font-family: var(--wp--preset--font-family--inter);
  font-weight: 600;
  font-size: 1.125rem;
  margin-bottom: 0.5rem;
}

.related-links p {
  color: #4B4848;
  line-height: 1.375rem;
  margin-bottom: 1.5rem;
}

.article-navigation a {
  font-weight: 400;
}

/* Sidebar */
.article-sidebar .popular-reading h3,
.article-sidebar .discover-more h3 {
  font-weight: 600;
  font-size: 1.3125rem;
  margin-bottom: 1rem;
}

.wpp-list {
  list-style: none;
  padding-inline-start: 0;
  margin-bottom: 2rem;
}

.wpp-list li {
  margin: 1rem 0;
  border-bottom: 1px solid #CFD9DD;
  padding-bottom: 16px;
}

.wpp-list a {
  font-weight: 400;
}

.discover-tags a {
  padding: .5rem 1rem;
  background-color: #F0F1F3;
  border-radius: 1rem;
  opacity: 80%;
  color: #231F20;
  text-decoration: none;
  line-height: 22px;
  margin: 0 0.5rem 0.5rem 0;
  display: inline-block;
}

/* Archive Article */
.article-post-card {
  position: relative;
  cursor: pointer;
}

.article-post-card a:first-of-type::before {
  content: '';
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 1;
  /* Ensures the link is above all other content */
}

.article-post-card:hover .article-title a {
  color: #00B0ED;
  transition: all ease 0.2s 0s;
}

.article-excrept {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

/* === Pagination === */
.article-page-main-content {
  margin-bottom: 5.25rem;
}

.gp-pagination-count {
  color: #5F5B5B;
}

/*=== TAGS PAGE ===*/
.tag-archive-wrapper {
  max-width: 1000px;
  display: flex;
  flex-direction: column;
  margin: 84px 0;
  justify-self: center;
  margin-left: auto;
  margin-right: auto;
}

.tag-archive-wrapper .breadcrumb-wrap {
  margin-bottom: 57px;
}

.tag-heading {
  margin-bottom: 3rem;
}

.result-count {
  display: flex;
  align-items: center;
  font-size: 30px;
}

.result-count p {
  margin-right: 5px;
}

.tag-post-card-columns {
  gap: 1.5rem;
}

.tag-meta {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  margin-bottom: 1rem;
}

.tag-post-date {
  text-transform: uppercase;
  color: #817F7F;
  font-size: 12px;
  font-weight: 500;
  font-family: var(--wp--preset--font-family--inter);
  display: flex;
  gap: 3px;
}

.wp-block-post-featured-image img {
  border-radius: 20px;
  max-height: 200px;
  height: 200px;
  object-fit: cover;
}

.tag-post-card {
  transition: all 0.3s linear 0s;
  border: 1px solid rgba(0, 0, 0, 0);
  border-radius: 1.25rem;
  margin-bottom: 1.5rem;
  padding: 1.5rem;
}

.tag-post-card:hover {
  border: 1px solid #00b0ed;
  border-radius: 1.25rem;
}

.post-title a {
  font-size: 18px;
  font-weight: 600;
  color: #231F20;
}

.wp-block-post-excerpt {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

p.wp-block-post-excerpt__excerpt {
  font-size: 16px;
  font-weight: 400;
  color: #4B4848;
}

p.wp-block-post-excerpt__more-text {
  font-size: 1rem;
  color: #0B8EBB;
  font-weight: 400;
  margin-top: 0;
}

.tag-pagination {
  align-items: center;
  column-gap: 10px;
  display: flex;
  justify-content: space-between;
  margin-top: 3rem;
  row-gap: 10px;
}

.wp-block-post-excerpt__more-linka:first-of-type::before {
  content: '';
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 1;
}

.tag-post-card {
  position: relative;
  z-index: 0;
}

.tag-post-card a:first-of-type::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 5;
}

.wp-block-query-pagination-numbers {
  align-items: center;
  column-gap: 0.625rem;
  display: flex;
  justify-content: center;
  row-gap: 0.625rem;
}

.tag-pagination .wp-block-query-pagination {
  column-gap: 0.625rem;
}

.page-numbers {
  text-decoration: none;
  font-size: 14px;
  max-width: 36px;
  max-height: 36px;
  align-items: center;
  font-weight: 700;
  justify-content: center;
  border: 1px solid #cfd9dd;
  border-radius: 2rem;
  padding: 17px;
  display: flex;
  color: #4b4848;
}

.wp-block-query-pagination-next,
.wp-block-query-pagination-previous {
  font-size: 0 !important; /* hide text */
  line-height: 0 !important;
}

.wp-block-query-pagination-next span,
.wp-block-query-pagination-previous span {
  display: none !important; /* hide label span */
}

span.page-numbers.current {
  background-color: #007da9;
  color: #ffffff;
  display: inline-flex;
  border: 1px solid #cfd9dd;
}

.tag-previous-button {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='36' height='36' viewBox='0 0 36 36' fill='none'%3E%3Crect x='0.5' y='0.5' width='35' height='35' rx='17.5' fill='%23F5F5F5'/%3E%3Crect x='0.5' y='0.5' width='35' height='35' rx='17.5' stroke='%23CFD9DD'/%3E%3Cg clip-path='url(%23clip0_1526_6503)'%3E%3Cpath d='M20.7064 22.715C20.8922 22.5322 20.9965 22.2847 20.9965 22.0268C20.9965 21.7688 20.8922 21.5214 20.7064 21.3385L17.3122 18.0109L20.7064 14.685C20.8038 14.5958 20.8819 14.4883 20.936 14.3689C20.9901 14.2495 21.0191 14.1207 21.0213 13.9901C21.0236 13.8595 20.9989 13.7298 20.9489 13.6087C20.8989 13.4876 20.8245 13.3776 20.7302 13.2852C20.6359 13.1929 20.5236 13.12 20.4 13.0711C20.2763 13.0221 20.1439 12.998 20.0105 13.0001C19.8772 13.0023 19.7456 13.0307 19.6237 13.0837C19.5018 13.1367 19.3921 13.2132 19.3009 13.3086L15.2005 17.3227C15.0147 17.5055 14.9104 17.753 14.9104 18.0109C14.9104 18.2689 15.0147 18.5163 15.2005 18.6992L19.2992 22.715C19.4859 22.8975 19.739 23 20.0028 23C20.2666 23 20.5197 22.8975 20.7064 22.715Z' fill='%23A4A7AE'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_1526_6503'%3E%3Crect width='10' height='10' fill='white' transform='translate(13 13)'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E");
  width: 36px;
  height: 36px
}

.tag-next-button {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='36' height='36' viewBox='0 0 36 36' fill='none'%3E%3Crect x='0.5' y='0.5' width='35' height='35' rx='17.5' fill='white'/%3E%3Crect x='0.5' y='0.5' width='35' height='35' rx='17.5' stroke='%23CFD9DD'/%3E%3Cg clip-path='url(%23clip0_1526_6518)'%3E%3Cpath d='M15.8502 22.715C15.6644 22.5322 15.5601 22.2847 15.5601 22.0268C15.5601 21.7688 15.6644 21.5214 15.8502 21.3385L19.2444 18.0109L15.8502 14.685C15.7528 14.5958 15.6748 14.4883 15.6206 14.3689C15.5665 14.2495 15.5375 14.1207 15.5353 13.9901C15.5331 13.8595 15.5577 13.7298 15.6077 13.6087C15.6577 13.4876 15.7321 13.3776 15.8264 13.2852C15.9207 13.1929 16.033 13.12 16.1567 13.0711C16.2803 13.0221 16.4127 12.998 16.5461 13.0001C16.6795 13.0023 16.811 13.0307 16.9329 13.0837C17.0548 13.1367 17.1646 13.2132 17.2557 13.3086L21.3561 17.3227C21.542 17.5055 21.6463 17.753 21.6463 18.0109C21.6463 18.2689 21.542 18.5163 21.3561 18.6992L17.2575 22.715C17.0707 22.8975 16.8177 23 16.5538 23C16.29 23 16.037 22.8975 15.8502 22.715Z' fill='%235F5B5B'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_1526_6518'%3E%3Crect width='10' height='10' fill='white' transform='translate(13 13)'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E");
  width: 36px;
  height: 36px
}

.tag-next-button:is(:hover,:focus), .tag-previous-button:is(:hover,:focus) {
  color: #f5f5f5;
  transition: all 0.1s ease 0s;
} 

.tag-pagination .page-numbers:is(:hover,:focus) {
  background-color: #007da9;
  color: #ffffff;
  transition: all 0.1s ease 0s;
}

/*=== CONTACT US ===*/
.contact-us-details {
  font-size: 1rem;
  line-height: 22px;
}

.contact-us-details h4 {
  font-family: var(--wp--preset--font-family--lato);
  font-weight: 700;
  color: #231F20;
}

.contact-us-details p {
  font-family: var(--wp--preset--font-family--lato);
  color: #4B4848;
}

.wpcf7-form-control-wrap {
  width: 100%;
}

.wpcf7-form input[type="text"],
.wpcf7-form input[type="email"],
.wpcf7-form textarea,
.wpcf7-form select {
  width: 100%;
  box-sizing: border-box;
  /* Ensures padding and border are included in the 100% width */
}

.contact-us-form {
  max-width: 502px;
  grid-area: form;
}

.contact-us-details {
  grid-area: details;
}

.contact-us-content-grid {
  grid-template-areas: "form details";
}

.contact-us-form p {
  margin-bottom: 1.5rem;
}

.contact-us-form label {
  font-family: var(--wp--preset--font-family--lato);
  font-size: 1rem;
  font-weight: 700;
  line-height: 22px;
  color: #231F20;
  position: relative;
  margin-bottom: 10px;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.contact-us-form span input,
.contact-us-form textarea {
  border-radius: .5rem;
  border: 1px solid #C1CBCE;
  padding: 8px 14px;
}

.contact-us-form span input {
  height: 44px;
}

/* Career Vacancies Deesign */
.current-vacancies-title a {
  text-decoration: none;
  color: #231F20;
}

/* Career Form Search Design */
.career-filter-form {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 1rem;
  background: #F2F5F9;
  padding: 1.5rem 2rem;
  border-radius: 10px;
  margin: 0 auto 3rem;
}

/* Input and select wrapper */
.filter-field {
  position: relative;
  display: flex;
  align-items: center;
  background: #FFFFFF;
  border: 1px solid #C1CBCE;
  border-radius: 4px;
  padding: 12px 14px;
  flex: 1 1 220px;
  min-width: 220px;
}

.filter-field input,
.filter-field select {
  border: none;
  background: transparent;
  font-size: 0.95rem;
  width: 100%;
  outline: none;
  color: #4B4848;
  line-height: 22px;
  font-family: var(--wp--preset--font-family--lato);
}

.filter-field select {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  /* background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='14' viewBox='0 0 16 14' fill='none'%3E%3Cpath d='M15.2157 4.14525C14.9368 3.91741 14.5592 3.7895 14.1657 3.7895C13.7722 3.7895 13.3947 3.91741 13.1157 4.14525L8.03917 8.30713L2.96522 4.14525C2.82908 4.02582 2.66507 3.93008 2.48293 3.86374C2.30079 3.7974 2.10424 3.76181 1.905 3.75908C1.70575 3.75635 1.50787 3.78655 1.32314 3.84787C1.1384 3.90919 0.97059 4.00039 0.829683 4.11603C0.688775 4.23167 0.577654 4.36939 0.502932 4.52099C0.42821 4.6726 0.391416 4.83499 0.394738 4.9985C0.39806 5.16202 0.44143 5.32331 0.522268 5.47279C0.603107 5.62227 0.71976 5.75687 0.865287 5.86859L6.9892 10.8965C7.26812 11.1243 7.64563 11.2522 8.03917 11.2522C8.4327 11.2522 8.81022 11.1243 9.08913 10.8965L15.2157 5.87075C15.4941 5.64176 15.6505 5.33148 15.6505 5.008C15.6505 4.68451 15.4941 4.37423 15.2157 4.14525Z' fill='%23231F20'/%3E%3C/svg%3E"); */
  background-repeat: no-repeat;
  background-position: right 0.75rem center;
  background-size: 0.9em;
  cursor: pointer;
}

/* Icon inside input/select */
.career-dropdown-icon {
  position: absolute;
  right: 14px;
  top: 50%;
  transform: translateY(-50%);
  width: 16px;
  height: 14px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='14' viewBox='0 0 16 14' fill='none'%3E%3Cpath d='M15.2157 4.14525C14.9368 3.91741 14.5592 3.7895 14.1657 3.7895C13.7722 3.7895 13.3947 3.91741 13.1157 4.14525L8.03917 8.30713L2.96522 4.14525C2.82908 4.02582 2.66507 3.93008 2.48293 3.86374C2.30079 3.7974 2.10424 3.76181 1.905 3.75908C1.70575 3.75635 1.50787 3.78655 1.32314 3.84787C1.1384 3.90919 0.97059 4.00039 0.829683 4.11603C0.688775 4.23167 0.577654 4.36939 0.502932 4.52099C0.42821 4.6726 0.391416 4.83499 0.394738 4.9985C0.39806 5.16202 0.44143 5.32331 0.522268 5.47279C0.603107 5.62227 0.71976 5.75687 0.865287 5.86859L6.9892 10.8965C7.26812 11.1243 7.64563 11.2522 8.03917 11.2522C8.4327 11.2522 8.81022 11.1243 9.08913 10.8965L15.2157 5.87075C15.4941 5.64176 15.6505 5.33148 15.6505 5.008C15.6505 4.68451 15.4941 4.37423 15.2157 4.14525Z' fill='%23231F20'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-size: contain;
  transition: transform 0.25s ease;
  pointer-events: none;
}

/* .filter-field select:focus + .career-dropdown-icon {
  transform: translateY(-50%) rotate(180deg);
} */

.career-dropdown-icon.open {
  transform: translateY(-50%) rotate(180deg);
}


/* Submit Button */
.filter-submit {
  background: #0094ff;
  color: #ffffff;
  border: 1.5px solid #0094ff;
  border-radius: 8px;
  padding: 12px 18px;
  font-weight: 700;
  font-size: 16px;
  cursor: pointer;
  transition: all 0.25s ease;
  line-height: 22px;
  font-family: var(--wp--preset--font-family--lato);
}

.filter-submit:hover {
  background: #007ed6;
  transform: translateY(-1px);
}

/* Responsive Layout */
@media (max-width: 768px) {
  .career-filter-form {
    flex-direction: column;
    align-items: stretch;
  }

  .filter-field {
    width: 100%;
  }

  .filter-submit {
    width: 100%;
    padding: 1rem;
  }
}

/* ===== CAREER APPLICATION FORM DESIGN ===== */
/* Modal Base */
.application-modal {
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.45);
  justify-content: center;
  align-items: center;
  z-index: 9999;
}

.application-modal.show {
  display: flex;
}

.application-content {
  background: #fff;
  border-radius: 10px;
  padding: 1.25rem 1rem 0 1rem;
  max-width: 36vw;
  max-height: 90vh;
  width: 90%;
  position: relative;
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.15);
  overflow: hidden;
  display: flex;
  flex-direction: column;
}

.application-content h4 {
  font-size: 21px;
  font-weight: 600;
  margin-bottom: 1rem;
  color: #231F20;
  margin: 0;
  border-bottom: 1px solid #eee;
  padding-bottom: 8px;
}

.application-form-container {
  display: flex;
  flex-direction: column;
  height: 100%;
  overflow: hidden;
}

.application-form-scrollable {
  flex: 1;
  overflow-y: auto;
  padding: 1.25rem 0.5rem 0 0;
  background: #fff;
  -webkit-overflow-scrolling: touch;
  scroll-behavior: smooth;
}

h5.application-job-title {
  font-size: 18px;
  font-weight: 600;
  margin-bottom: 0.5rem;
  color: #5F5B5B;
}

.application-content .job-description {
  color: #4B4848;
}

.application-content label {
  color: #231F20;
  font-weight: 600;
  margin-bottom: 0.5rem;
}

.button-group {
  position: sticky;
  bottom: 0;
  background: #fff;
  gap: 1rem;
  padding: 1rem 1.5rem 0.5rem;
  border-top: 1px solid #eee;
  flex-shrink: 0;
  flex-direction: row;
}

.application-content .button-group p {
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
  gap: 0.5rem;
}

.application-content p {
  margin-bottom: 0.5rem;
}

.application-content li {
  margin-bottom: 2rem;
}

.word-counter {
  font-size: 14px;
  font-weight: 500;
  color: #231F20;
  text-align: right;
  margin-top: 6px;
  font-family: var(--wp--preset--font-family--lato, 'Lato', sans-serif);
}

.experience-field {
  height: 120px;
}

.word-counter span {
  font-weight: 700;
  color: #231F20;
  transition: color 0.25s ease;
}

.button-group .cf7-cancel-button,
.button-group .wpcf7-submit {
  padding: 12px 18px;
  border-radius: 0.5rem;
  background: none;
  font-weight: 700;
  line-height: 22px;
  font-family: var(--wp--preset--font-family--lato);
  max-width: 100px;
  font-size: 1rem;
}

.button-group .wpcf7-submit {
  color: #817F7F;
  border: 1.5px solid #E5E7EB;
  background-color: #E5E7EB;
  cursor: not-allowed;
  margin-left: 0 !important;
}

.button-group .wpcf7-submit:disabled {
  color: #817F7F;
  border: 1.5px solid #E5E7EB;
  background-color: #E5E7EB;
  cursor: not-allowed;
}

/* Active state when .filled-button is added */
.button-group .wpcf7-submit.filled-button:not(:disabled) {
  color: #FFFFFF !important;
  border-color: #00AFED !important;
  background-color: #00AFED !important;
  cursor: pointer !important;
  opacity: 1 !important;
}

.button-group .wpcf7-submit .filled-button {
  color: #FFFFFF;
  border: 1.5px solid #00AFED;
  background-color: #00AFED;
  transition: background-color .2s ease, border-color .2s ease;
  cursor: pointer;
}

.wpcf7-spinner {
  display: none;
}

.application-content .button-group .cf7-cancel-button {
  color: #00AFED;
  border: 1.5px solid #00AFED;
  cursor: pointer;
}

.close-modal {
  position: absolute;
  right: 16px;
  top: 12px;
  font-size: 24px;
  color: #999;
  cursor: pointer;
}

/* Input Styles */
.wpcf7-form input[type="text"],
.wpcf7-form input[type="email"],
.wpcf7-form textarea,
.wpcf7-form select {
  width: 100%;
  padding: 10px 12px;
  border: 1px solid #C1CBCE;
  border-radius: 6px;
  font-size: 15px;
  font-family: var(--wp--preset--font-family--lato);
}

.wpcf7-form select {
  cursor: pointer;
}

/* File upload */
.wpcf7-form input[type="file"] {
  border: 1px dashed #C1CBCE;
  background: #F9FAFB;
  padding: 1.25rem;
  border-radius: 6px;
  width: 100%;
}

/* Custom Upload File */
.custom-file-upload {
  border: 1px dashed #96A9B1;
  border-radius: 8px;
  padding: 20px;
  text-align: center;
  transition: border-color 0.3s ease;
  cursor: pointer;
  /* background: #f9f9f9; */
}

.custom-file-upload.drag-over {
  border-color: #2a6edc;
  background: #eef5ff;
}

/* Hide the default CF7 file input */
.custom-file-upload input[type="file"] {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.file-name {
  display: block;
  margin-top: 10px;
  font-size: 14px;
  color: #28a745;
  font-weight: 500;
}

.file-upload-description p {
  margin-bottom: 0;
  font-family: 'Lato';
  font-size: 14px;
  color: #4B4848;
}

/* Responsive */
@media (max-width: 768px) {
  .file-upload-label {
    flex-direction: column;
    text-align: center;
  }

  .file-upload-description {
    text-align: center;
  }
}

/* Buttons */
.cancel-btn {
  background: #fff;
  color: #0094ff;
  border: 1.5px solid #0094ff;
  border-radius: 6px;
  padding: 0.75rem 1.5rem;
  font-weight: 600;
  cursor: pointer;
}

.wpcf7-submit {
  background: #0094ff;
  color: #fff;
  border: none;
  border-radius: 6px;
  padding: 0.75rem 1.5rem;
  font-weight: 600;
  margin-left: 10px;
}

/* Application Successful Message */
.wpcf7-response-output {
  display: none !important;
}

/* Spinner */
/* .cf7-loading-spinner {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 2rem 0;
  text-align: center;
}

.cf7-loading-spinner p {
  color: #4b4848;
  font-size: 14px;
  margin-top: 1rem;
}

.spinner {
  width: 36px;
  height: 36px;
  border: 3px solid rgba(0, 0, 0, 0.15);
  border-top: 3px solid #0094ff;
  border-radius: 50%;
  animation: spin 0.8s linear infinite;
} */

/* @keyframes spin {
  0% {
    transform: rotate(0deg);
  }

  100% {
    transform: rotate(360deg);
  }
} */

.application-success {
  position: fixed;
  inset: 0;
  display: none;
  align-items: center;
  justify-content: center;
  background: rgba(0, 0, 0, 0.6);
  z-index: 9999;
}

.application-success.show {
  display: flex;
  animation: fadeIn 0.3s ease;
}

.thank-you-icon {
  margin-bottom: 1rem;
}

.thank-you-message {
  margin-bottom: 1rem;
}

.enquires-message {
  margin-bottom: 1.5rem;
}

@keyframes fadeIn {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

.success-content {
  background: #fff;
  border-radius: 12px;
  text-align: center;
  padding: 2rem;
  max-width: 600px;
  width: 90%;
  animation: slideUp 0.3s ease;
}

@keyframes slideUp {
  from {
    transform: translateY(20px);
    opacity: 0;
  }

  to {
    transform: translateY(0);
    opacity: 1;
  }
}

.success-content h4 {
  font-size: 20px;
  font-weight: 700;
  color: #0F0D0E;
  margin-bottom: 0.5rem;
  font-family: var(--wp--preset--font-family--lato, 'Lato', sans-serif);
}

.success-content p {
  color: #4B4848;
  font-size: 1rem;
  line-height: 1.375rem;
}

.enquires-message a {
  color: #0B8EBB;
  font-weight: 400;
}

.success-close-btn {
  background: #00AFED;
  color: #fff;
  border: 1.5px solid #00AFED;
  padding: 0.75rem 1.125rem;
  border-radius: 0.5rem;
  font-size: 1rem;
  cursor: pointer;
  font-weight: 600;
  transition: background 0.25s ease;
  height: 46px;
  width: 150px;
}

.success-close-btn:hover {
  background: #007ed6;
  border: 1.5px solid #007ed6;
}

/* Career Single Post Design */
.career-hero-banner {
  background-position: center;
  background-size: cover;
  min-height: 400px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  text-align: center;
  padding: 80px 20px;
}

.career-hero-title {
  font-size: 3rem;
  font-weight: 700;
  margin-bottom: 0.5rem;
}

.career-hero-subtext {
  font-size: 1.25rem;
  opacity: 0.9;
}

.career-section ul {
  margin-left: 0;
  list-style-type: disc;
  padding-inline-start: 15px;
}

.career-section li::marker {
  color: #00B0ED;
}

.career-main {
  padding: 3rem 0 5.25rem 0;
}

.career-main .breadcrumb-wrap {
  margin-bottom: 1.5rem;
  max-width: var(--content-max-width);
  margin-inline: auto;
}

.career-content-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 300px);
  gap: 3rem;
  max-width: var(--content-max-width);
  margin-inline: auto;
}

/* Left Column */
.career-details {
  display: flex;
  flex-direction: column;
  gap: 2rem;
}

.career-title-meta h2 {
  color: #231F20;
  font-size: 30px;
  font-weight: 600;
}

.career-date-meta {
  display: inline-flex;
  gap: 5px;
  font-size: 14px;
}

.career-date,
.career-date-text {
  color: #4B4848;
  align-content: center;
}

.career-date-text {
  margin-bottom: 0;
}

.career-summary {
  color: #231F20;
  line-height: 1.7;
}

.career-summary h3 {
  font-weight: 600;
  font-size: 18px;
  margin-bottom: 10px;
}

.career-section h3 {
  font-weight: 600;
  margin-bottom: 1rem;
  font-size: 18px;
  color: #231F20;
}

.career-section p,
.career-section li {
  color: #4B4848;
  line-height: 22px;
}

.career-section li {
  margin-bottom: 16px;
}

.career-section li:last-child {
  margin-bottom: 0;
}

.career-section p {
  margin-bottom: 0.5rem;
}

.career-section ul {
  margin-left: 1.5rem;
  list-style-type: disc;
}


/* Sidebar */
.career-sidebar {
  position: sticky;
  top: 100px;
  align-self: start;
}

.career-icon {
  display: inline-block;
  width: 16px;
  height: 16px;
  background-size: contain;
  background-repeat: no-repeat;
  margin-right: 8px;
  vertical-align: middle;
}

.career-location-icon {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M8 8.66675C9.10457 8.66675 10 7.77132 10 6.66675C10 5.56218 9.10457 4.66675 8 4.66675C6.89543 4.66675 6 5.56218 6 6.66675C6 7.77132 6.89543 8.66675 8 8.66675Z' stroke='%23231F20' stroke-width='1.33333' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M8.0013 1.33337C6.58681 1.33337 5.23026 1.89528 4.23007 2.89547C3.22987 3.89567 2.66797 5.25222 2.66797 6.66671C2.66797 7.92804 2.93597 8.75337 3.66797 9.66671L8.0013 14.6667L12.3346 9.66671C13.0666 8.75337 13.3346 7.92804 13.3346 6.66671C13.3346 5.25222 12.7727 3.89567 11.7725 2.89547C10.7723 1.89528 9.41579 1.33337 8.0013 1.33337Z' stroke='%23231F20' stroke-width='1.33333' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

.career-job-type-icon {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M2.66536 13.3333C2.2987 13.3333 1.98492 13.2028 1.72403 12.942C1.46314 12.6811 1.33248 12.3671 1.33203 12V3.99996C1.33203 3.63329 1.4627 3.31951 1.72403 3.05863C1.98536 2.79774 2.29914 2.66707 2.66536 2.66663H6.66536L7.9987 3.99996H13.332C13.6987 3.99996 14.0127 4.13063 14.274 4.39196C14.5354 4.65329 14.6658 4.96707 14.6654 5.33329V12C14.6654 12.3666 14.5349 12.6806 14.274 12.942C14.0131 13.2033 13.6991 13.3337 13.332 13.3333H2.66536ZM2.66536 12H13.332V5.33329H7.4487L6.11537 3.99996H2.66536V12Z' fill='%23231F20'/%3E%3C/svg%3E");
}

.career-department-icon {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M2.66536 14C2.2987 14 1.98492 13.8696 1.72403 13.6087C1.46314 13.3478 1.33248 13.0338 1.33203 12.6667V5.33337C1.33203 4.96671 1.4627 4.65293 1.72403 4.39204C1.98536 4.13115 2.29914 4.00049 2.66536 4.00004H5.33203V2.66671C5.33203 2.30004 5.4627 1.98626 5.72403 1.72537C5.98536 1.46449 6.29914 1.33382 6.66536 1.33337H9.33203C9.6987 1.33337 10.0127 1.46404 10.274 1.72537C10.5354 1.98671 10.6658 2.30049 10.6654 2.66671V4.00004H13.332C13.6987 4.00004 14.0127 4.13071 14.274 4.39204C14.5354 4.65337 14.6658 4.96715 14.6654 5.33337V12.6667C14.6654 13.0334 14.5349 13.3474 14.274 13.6087C14.0131 13.87 13.6991 14.0005 13.332 14H2.66536ZM2.66536 12.6667H13.332V5.33337H2.66536V12.6667ZM6.66536 4.00004H9.33203V2.66671H6.66536V4.00004Z' fill='%23231F20'/%3E%3C/svg%3E");
}

.career-overview {
  padding: 1.5rem;
  border-radius: 1rem;
  background-color: #E8F7FF;
  display: flex;
  flex-direction: column;
}

.career-overview h4 {
  font-size: 18px;
  font-weight: 600;
  margin-bottom: 1.5rem;
  color: #231F20;
}

.career-overview-item {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  margin-bottom: 1.5rem;
}

.submit-text {
  margin-bottom: 0.25rem !important;
}

.red-asterisk {
  color: #E73A3A;
  font-weight: 700;
}

.upload-file-text {
  font-size: 14px;
  color: #5F5B5B;
  margin-bottom: 14px !important;
}

.apply-btn {
  display: inline-block;
  background: #00AFED;
  color: #fff;
  text-decoration: none;
  font-weight: 600;
  text-align: center;
  padding: 0.75rem 1.5rem;
  border-radius: 6px;
  transition: all 0.25s ease;

  &:hover {
    background: #007ed6;
  }
}

/*=== 404 PAGE ===*/
.error-page-contents {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 1.5rem;
  padding: 4rem 1rem;
}

.error-page-title {
  font-size: 30px;
  color: #4B4848;
}

.error-page-text {
  font-size: 18px;
  color: #4B4848;
}

.back-to-home-button {
  align-items: center;
  background-color: #ffffff;
  color: #00afed;
  display: inline-flex;
  text-decoration: none;
  width: max-content;
  border: 1.5px solid #00b0ed;
  border-radius: 0.5rem;
  padding: 0.75rem 1.125rem;
  max-height: 43px;
}

/* ===  WOOCOMMERCE PAGE === */

.yyc-woocommerce-product {
	justify-self: center;
}
.woocommerce .quantity .qty {
  width: 70px;
}

/* ===  BOOK A DEMO PAGE === */
/*Tablet View*/
@media screen and (max-width: 1024px) {
  .form-height {
    min-height: 50vh !important;
  }
}

/*Mobile View*/
@media screen and (max-width: 767px) {
  .col {
    flex-basis: auto;
  }
}

/*Upscaled setting: 150%*/
@media screen and (max-width: 2880px) {
  .card-title {
    text-align: center;
  }
    
  .form-label label{
    font-size: 18px;
  }
}

/*=== MOBILE RESPONSIVE DESIGN ===*/
@media (max-width: 768px) {
  .header-menu {
    width: 100%;
    max-width: 400px;
  }

  .wp-block-navigation__responsive-container {
    background-color: #ffffff;
    height: 100vh;
    padding: 24px 16px;
  }

  .why-choose-yyc-video {
    height: auto;
    width: 315px;
    top: 14px;
    left: 12px;
  }

  /* Single Article Mobile*/
  .article-layout {
    grid-template-columns: 1fr;
  }

  .article-sidebar {
    margin-top: 2rem;
  }

  /* Archive Article Mobile */
  .wp-block-query .wp-block-post-template {
    grid-template-columns: 1fr;
  }

  /* Contact Us Mobile */
  .contact-us-content-grid {
    grid-template-areas:
      "form"
      "details";
  }

  /* Careers Mobile */
  .career-hero-banner {
    min-height: 300px;

    .career-hero-title {
      font-size: 2.25rem;
    }

    .career-hero-subtext {
      font-size: 1rem;
    }
  }

  .career-main {
    padding: 3rem 1.25rem 5.25rem 1.25rem;
  }

  .career-content-layout {
    grid-template-columns: 1fr;
    gap: 1.5rem;
  }

  .result-count {
    font-size: 26px;
  }
}

html,
body {
  overflow-x: hidden;
}

/*=== TABLET RESPONSIVE DESIGN ===*/
@media (max-width: 1249px) {
  .header-menu {
    width: 100%;
    max-width: 1000px;
    padding-bottom: 15px;
  }

  .wp-block-navigation-item.has-child:hover>.wp-block-navigation-item__content {
    box-shadow: none;
  }

  /* Also when hovering submenu links specifically */
  .wp-block-navigation-item.has-child:hover .wp-block-navigation__submenu-container:hover~.wp-block-navigation-item__content,
  .wp-block-navigation-item.has-child:hover .wp-block-navigation__submenu-container .wp-block-navigation-item:hover~.wp-block-navigation-item__content {
    box-shadow: none;
  }

  .tag-archive-wrapper {
    padding: 0 1.25rem;
  }

  .wp-block-navigation .current-menu-item {
    box-shadow: none;
  }

  /* .article-layout {
    grid-template-columns: 1fr;
  }
  .article-sidebar {
    margin-top: 2rem;
    position: static;
  }

  .career-content-layout {
    grid-template-columns: 1fr;
    gap: 2rem;
  } */
}

/*=== START OF CODES FROM ADDITIONAL CSS ===*/
@media screen and (min-device-width: 1250px) and (max-device-width: 1478px) {
  nav.wp-block-navigation ul.header-menu .wp-block-navigation {
    width: 100%;
    max-width: 100vw !important;

  }

  .header-menu .wp-block-navigation {
    column-gap: 0.5rem !important;
  }
}

@media (max-width: 1227px) {
  .header-menu {
    width: 100%;
    max-width: 100vw !important;
  }
}

@media screen and (max-width: 1249px ) {
  .header-menu {
    padding-left: 30px !important;
    padding-right: 30px !important;
  }

  .single-career .article-hero-banner {
    min-height: 290px !important;
  }

  #whyChooseYYC .why-choose-yyc-video {
    width: 88%;
  }

  .main-banner .main-banner-pic {
    width: 641px;
  }

  .gb-element-b365b7c4.contact-us-content-grid {
    padding-left: 0px;
    padding-right: 0px;
  }

  .contact-us-content-grid .contact-us-form {
    max-width: 100%;
  }

  iframe.googleMap {
    width: 85vw;
    height: 300px;
  }

  .article-hero-banner,
  .page-hero-banner {
    min-height: 290px !important;
    max-height: 290px !important;
    height: 290px;
  }

  .article-hero-banner .article-hero-title {
    font-size: 44px;
  }

  .article-content {
    padding-left: 30px;
  }

  .article-sidebar {
    padding-right: 30px;
  }

  .mobile-header-menu.wp-block-navigation .current-menu-item {
    box-shadow: none;
  }

  .mobile-header-menu.wp-block-navigation .current-menu-item span.wp-block-navigation-item__label {
    color: #00AFED;
  }

  .desktop-header-menu {
    display: none !important;
  }

  .mobile-header-menu {
    display: flex !important;
  }

  .desktop-header-icon {
    display: none !important;
  }

  .wp-block-navigation ul li {
    padding: 10px 30px;
  }

  .wp-block-navigation__responsive-container-close {
    right: 20px;
    top: 20px;
  }

  .wp-block-navigation.items-justified-center {
    --navigation-layout-justification-setting: left;
    --navigation-layout-justify: left;
  }

  ul.wp-block-navigation-submenu li {
    padding: 10px 0px !important;
  }

  .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content .has-child .wp-block-navigation__submenu-container {
    padding-left: 1rem;
    padding-bottom: 0px;

  }

  .eCourseFreeDemoBtn .icon-container {
    width: 60% !important;
  }

  .page-hero-banner .gb-element-1f9a8c82 {
    margin-top: 1rem;
    font-size: 44px;
  }

  .article-hero-title {
    font-size: 44px;
  }

  .article-hero-title {
    padding-top: 2rem;
  }

  .gb-element-0e6bdd6c {
    min-height: initial;
  }

  .gb-element-1f9a8c82 {
    padding-top: 0rem;
  }

  #mainbannerContainer.gb-element-c9d390c6 {
    padding-top: 0px;
  }

  .article-hero-banner,
  .page-hero-banner,
  .page-hero-banner-career,
  .gb-element-0e6bdd6c {
    min-height: 0px !important;
    padding-top: 0rem;

  }

  .article-hero-banner .article-hero-inner {
    text-align: center;
    color: #fff;
    padding: 130px 20px 80px !important;
  }

  .page-hero-banner .gb-text-9b7e27fe {
    padding-top: 0em;
  }

  .page-hero-banner .gb-text-9b7e27fe {
    font-size: 33px;
  }

  .knowledgeHubBanner .gb-element-1f9a8c82 {
    padding-top: 1em;
  }

  .careers .gb-element-1f9a8c82 {
    padding-top: 2em;
  }

  .open-on-hover-click ul.wp-block-navigation__submenu-container.wp-block-navigation-submenu,
  li.wp-block-navigation-item a.wp-block-navigation-item__content:hover,
  li.wp-block-navigation-item a.wp-block-navigation-item__content,
  .wp-block-navigation-item.has-child:hover>.wp-block-navigation-item__content {
    box-shadow: none;
    border: 0px;
  }

  .btnBudgetDwl {
    max-width: 200px;
    margin: 0 auto !important;
  }

  .gb-text-ade072c9,
  .gb-text-afa617e6 {
    font-size: 18px !important;

  }

  .languageVsersion {
    margin-top: -10px;
  }

  nav.rank-math-breadcrumb {
    padding: 0 30px;
  }

  .wp-block-navigation-item.current-menu-ancestor>.wp-block-navigation-item__content {
    box-shadow: none !important;
  }

  form.career-filter-form {
    display: block;
  }

  .filter-field {
    margin-bottom: 6px;
  }

  button.filter-submit {
    width: 200px;
    margin-top: 10px;
  }

  .career .gb-text-15673bb1 {
    margin-top: 20px;
  }

  .career-content-layout {
    padding-left: 30px;
    padding-right: 30px;
  }

  .application-content label {
    display: block;
    margin-bottom: 0.4rem;
  }

  .single-career .article-hero-banner,
  .page-hero-banner.careers {
    min-height: 290px !important;
    max-height: 290px;
  }

  .currentVacanciesContainer {
    padding-left: 30px;
    padding-right: 30px;
  }

  .currentVacanciesContainer .gb-loop-item-68b4bc2e {
    padding: 0px 0px 32px 0px;
  }

  .currentVacanciesContainer .gb-looper-a7aa6ab7 {
    row-gap: 0px;
  }

  .footer-copyright .is-layout-flex {
    gap: 0px !important;
  }

  .smAppContainer .gb-element-c02bb78c {
    display: block !important;
  }

  .smAppContainer .gb-element-c02bb78c>div.wp-block-outermost-icon-block {
    padding-bottom: 10px !important;
  }

  /* APPLICATION FORM MOBILE */
  .application-content {
    max-width: 600px;
    /* display: flex;
    flex-direction: column;
    overflow: hidden;
    padding: 1.25rem 1rem 0 1rem; */
  }
  .application-form-container {
    display: flex;
    flex-direction: column;
    height: 100%;
    overflow: hidden;
  }
  .button-group {
    position: sticky;
    bottom: 0;
    background: #fff;
    gap: 1rem;
    padding: 1rem 1.5rem 0.5rem;
    border-top: 1px solid #eee;
    flex-shrink: 0;
    flex-direction: row;
  }
}

@media screen and (max-width: 769px) {
  .header-menu {
    padding-left: 20px;
    padding-right: 20px;
    padding-bottom: 20px;
  }

  #whyChooseYYC {
    background-size: cover;
    width: 429px;
  }


  #whyChooseYYC .why-choose-yyc-video {
    width: 92%;
    top: 20px;
    left: 17px;
  }

  .main-banner .gb-text-1070b0a9 {
    width: 70%;
  }

  .contact-us-content-grid .contact-us-form {
    max-width: 100%;
  }

  .contact-us-content-grid .contact-us-form label {
    width: 100% !important;
  }

  .contact-us-content-grid .contact-us-details {
    width: 90%;
  }

  nav.rank-math-breadcrumb {
    padding-left: 30px;
    padding-right: 30px;
    padding-bottom: 10px;
  }

  .article-content,
  .article-sidebar {
    padding-left: 20px;
    padding-right: 20px;
  }

  .yyc-modules-carousel {
    padding: 1rem 0;
  }

  .gb-element-bdbb5693 {

    padding-top: 0px;
  }

  .article-hero-title {
    font-size: 44px;
    padding-top: 0rem;
  }

  .page-hero-banner .gb-element-1f9a8c82 {

    font-size: 36px;

  }

  .article-hero-banner .article-hero-inner {
    padding: 120px 20px 80px !important;
  }

  .wpcf7-submit {
    margin-left: 0px;
  }
}



@media screen and (min-device-width: 320px) and (max-device-width: 468px) {
  #whyChooseYYC {
    background-size: contain;
  }

  #whyChooseYYC .why-choose-yyc-video {
    width: 92%;
    height: 295px;
    top: 17px;
    left: 16px;
  }

  .main-banner .gb-text-1070b0a9 {
    width: 100%;
  }

  .wpcf7-form .wpcf7-submit {
    width: 100%;
  }

  nav.rank-math-breadcrumb {
    padding-left: 20px;
    padding-right: 20px;
  }

  .eCourseFreeDemoBtn {
    text-align: center;
  }

  .gb-element-9e6d2298 {
    padding: 0px;
  }

  .eCourseFreeDemoBtn .icon-container {
    width: 70% !important;
  }

  .article-hero-title {
    font-size: 36px !important;
    /*	padding-top: 2rem; */
  }

  .article-hero-banner,
  .page-hero-banner,
  .page-hero-banner-career,
  .gb-element-0e6bdd6c {
    min-height: 0px !important;
    padding-top: 1rem;
  }

  .knowledge-hub-card .viewMore {
    width: 200px;
    margin: 0 auto;
    text-align: center;
  }

  .wp-block-group.is-layout-constrained.wp-block-group-is-layout-constrained {
    padding-top: 48px !important;
    padding-bottom: 48px !important;
  }

  .btnJoinUs {
    padding: 0px 20px;
  }

  button.filter-submit {
    width: 100%;

  }

  .gb-text-e2f25822 {
    margin-top: -15px;
  }

  .currentVacanciesContainer {
    padding-left: 20px;
    padding-right: 20px;
  }

  .career .wp-block-outermost-icon-block {
    width: 16px;
  }

  .career .gb-text-15673bb1 {
    width: 100%;
    max-width: 100%;
    text-align: center;
    display: grid;
  }

  .career-content-layout {
    padding-left: 0px;
    padding-right: 0px;
  }

  .career-main nav.rank-math-breadcrumb {
    padding-left: 0px;
    padding-right: 0px;
  }

  .career-section ul {
    padding-inline-start: 0px !important;
  }

  .application-content label {
    display: block;
    margin-bottom: 0.3rem;
  }

  .application-content .button-group p {
    flex-direction: column-reverse !important;
    gap: 0;
  }

  .button-group p {
    line-height: 10px;
  }

  .application-content .button-group .cf7-cancel-button,
  .application-content .button-group .wpcf7-submit {
    width: 100%;
    max-width: 100%;
  }

  .career-filter-form {
    padding: 1.5rem !important;
  }
}

/*=== END OF CODES ===*/