/*
Theme Name: ARTGO Média Base
Description: Template de base Artgo Média.
Author: ARTGO Média
Author URI: https://www.artgomedia.com
Version: 1.0
*/

/****************** FONTS *****************/

@font-face {
  font-family: "Poppins";
  src: url(assets/fonts/Poppins-Regular.woff2) format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Poppins";
  src: url(assets/fonts/Poppins-Medium.woff2) format("woff2");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Poppins";
  src: url(assets/fonts/Poppins-SemiBold.woff2) format("woff2");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Poppins";
  src: url(assets/fonts/Poppins-Bold.woff2) format("woff2");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

/****************** VARIABLES *****************/

:root {
  /* colors */
  --primary-400: #1d0e46;
  --secondary-400: #38b399;
  --light-100: #fff;
  --dark-400: #1d1d1b;

  /* font sizes */
  --fontSizeXs: 12px;
  --fontSizeSm: 14px;
  --fontSizeBase: 16px;
  --fontSizeMedium: 18px;
  --fontSizeXl: clamp(20px, 1.823vw, 35px);
  --fontSizeXxl: clamp(25px, 2.344vw, 45px);
  --fontSizeH1: 30px;
  --fontSizeH2: clamp(20px, 1.458vw, 28px);
  --fontSizeH3: 18px;

  /* margins / paddings */
  --gutterBlocks: 40px;
  --gutterSection: 80px;

  /* fonts */

  --mainFont: "Poppins", sans-serif;
}

/****************** RESET *****************/

* {
  margin: 0;
  padding: 0;
  border: 0;
  box-sizing: border-box;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline;
  scroll-behavior: smooth;
}

a,
a:hover {
  text-decoration: none;
}

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

p,
ul,
ol {
  margin: 0;
  padding: 0;
}

ol,
ul {
  list-style-type: none;
  padding: 0;
}

/****************** GLOBAL *****************/

body {
  position: relative;
  -webkit-font-smoothing: subpixel-antialiased;
  font-family: var(--mainFont);
  font-size: var(--fontSizeBase);
  font-weight: 400;
  color: var(--dark-400);
  background-color: var(--light-100);
  overflow-x: hidden;
}

/* BOXING */

.boxed-xl {
  width: 90vw;
  max-width: 1720px;
  margin: 0 auto;
}

.boxed-base {
  width: 90vw;
  max-width: 1520px;
  margin: 0 auto;
}

.boxed-sm {
  width: 90vw;
  max-width: 1120px;
  margin: 0 auto;
}

.boxed-xs {
  width: 90vw;
  max-width: 1000px;
  margin: 0 auto;
}

section {
  padding: var(--gutterSection) 0;
}

.section-deco-left {
  background: url(assets/images/bg-plant-bottom.svg) no-repeat;
  background-size: clamp(80px, 15.625vw, 300px);
  background-position: bottom -100px left -100px;
}
.section-deco-right {
  background: url(assets/images/bg-plant-top.png) no-repeat;
  background-size: clamp(50px, 11.979vw, 230px);
  background-position: top right;
}

.section-dark {
  background: url(assets/images/bg-dark-section.svg), var(--primary-400);
  color: var(--light-100);
}

section > :last-child {
  margin-bottom: 0;
}

/* STYLING TEXTS */

strong {
  font-weight: 700;
}

em {
  font-style: italic;
}

.content :is(p, ul, ol) {
  margin-bottom: var(--fontSizeBase);
}

.content :is(ul, ol) {
  padding-left: 25px;
}

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

.content :is(ul li, ol li) {
  position: relative;
  padding-left: 30px;
  margin-bottom: 10px;
}

.content ul li::before {
  content: url(assets/images/check.svg);
  position: absolute;
  left: 0;
}

.content ol {
  counter-reset: item;
}

.content ol li::before {
  position: absolute;
  content: counter(item) ".";
  counter-increment: item;
  color: var(--secondary-400);
  left: 0;
}

.content a {
  color: var(--secondary-400);
}

.content a:hover {
  text-decoration: underline;
  text-underline-offset: 3px;
}

.content :is(h2, h3) {
  margin: var(--gutterBlocks) 0;
}

.content :is(h2:first-child, h3:first-child) {
  margin-top: 0;
}

.section-dark .content,
.section-dark .content h2 {
  color: var(--light-100);
}

.artgo-icon {
  width: 20px;
  height: 20px;
}

/* HEADINGS */

.artgo-h1 {
  font-size: var(--fontSizeH1);
  color: var(--light-100);
  font-weight: 700;
  max-width: 900px;
  text-align: center;
  text-wrap: balance;
  text-transform: uppercase;
}

.artgo-h1--home {
  font-size: var(--fontSizeXl);
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  padding: var(--gutterBlocks) 0;
}

.artgo-h1--home .first-line {
  color: var(--primary-400);
  font-weight: 700;
}

.artgo-h1--home .second-line {
  color: var(--secondary-400);
  font-weight: 500;
}

.artgo-h2,
.content h2 {
  font-size: var(--fontSizeH2);
  color: var(--primary-400);
  font-weight: 700;
  display: flex;
  gap: 15px;
}

.artgo-h2::before,
.content h2::before {
  content: url(assets/images/deco-h2.svg);
}

.section-dark :is(.artgo-h2, .content h2) {
  color: var(--light-100);
}

.artgo-h3,
.content h3 {
  font-size: var(--fontSizeH3);
  font-weight: 600;
  color: var(--secondary-400);
}

/* BUTTONS */

.artgo-btn {
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  line-height: 1;
  color: var(--dark-400);
  text-transform: uppercase;
  width: fit-content;
  background-color: transparent;
  border-radius: 50px;
  border: 2px solid var(--secondary-400);
  color: var(--primary-400);
  padding: 10px 25px;
  font-weight: 600;
}

.artgo-btn:hover {
  background-color: var(--secondary-400);
  border-color: var(--secondary-400);
}

.artgo-btn--light {
  border-color: var(--light-100);
  color: var(--light-100);
}

.section-dark .artgo-btn {
  color: var(--light-100);
}

/******************** HEADER *******************/

header {
  position: sticky;
  top: 0;
  z-index: 500;
  transition: 0.3s ease;
  opacity: 1;
  visibility: visible;
}
header.hide {
  opacity: 0;
  visibility: hidden;
}

.header__top-bar {
  background-color: var(--secondary-400);
  color: var(--light-100);
}

.header__top-bar__wrapper {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 35px;
}

.header__top-bar__left,
.header__top-bar__right {
  display: flex;
  align-items: center;
}

.header__top-bar a {
  display: flex;
  align-items: center;
  gap: 10px;
  color: var(--light-100);
}

.header__top-bar a:hover {
  text-decoration: underline;
  text-underline-offset: 3px;
}

.header__top-bar__right {
  justify-content: end;
  gap: 10px;
}

.header__top-bar__right a:hover img {
  filter: brightness(0) saturate(100%) invert(7%) sepia(29%) saturate(7487%)
    hue-rotate(250deg) brightness(99%) contrast(102%);
}

.header__top-bar__icon {
  height: 15px;
  width: 15px;
}

/* MENU */

.header__menu {
  background-color: var(--primary-400);
}

.header__menu__wrapper {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 90px;
}

.header__menu__left,
.header__menu__right {
  height: 100%;
}

.header__menu__right {
  display: flex;
  gap: clamp(16px, 2.604vw, 50px);
}

.header__menu__right nav {
  height: 100%;
}

.top-menu {
  display: flex;
  gap: clamp(16px, 2.604vw, 50px);
  width: 100%;
  height: 100%;
}

.top-menu .sub-menu {
  position: absolute;
  top: calc(100% - 10px);
  left: 50%;
  transform: translateX(-50%);
  background-color: var(--light-100);
  border-radius: 10px;
  display: flex;
  flex-direction: column;
  width: 100%;
  min-width: 250px;
  opacity: 0;
  max-height: 0;
  overflow: hidden;
  box-shadow: 0px 14px 15px 4px rgba(0, 0, 0, 0.1);
  transition: opacity 0.2s ease;
}

.top-menu > li {
  position: relative;
  height: 100%;
  display: flex;
  align-items: center;
}

.top-menu > li.menu-item-has-children > a::after {
  content: url(./assets/images/chevron-down.svg);
}

.top-menu > li:not(.top-menu--contact) > a {
  font-size: clamp(14px, 0.833vw, 16px);
  color: var(--light-100);
  font-weight: 600;
  letter-spacing: 0.3px;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 0;
  text-transform: uppercase;
  transition: gap 0.2s ease;
}

.top-menu > li:not(.top-menu--contact) > a::after {
  content: "";
  height: 2px;
  width: 100%;
  opacity: 0;
  background-color: var(--secondary-400);
  transition: opacity 0.2s ease;
}

.top-menu > li:not(.top-menu--contact):hover > a {
  gap: 5px;
}

.top-menu > li:not(.top-menu--contact):hover > a::after {
  opacity: 1;
}

.top-menu .top-menu--contact a {
  margin: auto;
  color: var(--primary-400);
  font-weight: 600;
  text-transform: uppercase;
  background-color: var(--secondary-400);
  border-radius: 50px;
  border: 1px solid var(--secondary-400);
  padding: 10px 25px;
  height: fit-content;
  line-height: 1;
}

.top-menu .top-menu--contact a:hover {
  background-color: transparent;
  color: var(--light-100);
}

.top-menu > li:hover > .sub-menu {
  max-height: unset;
  padding: 20px;
  opacity: 1;
}

.top-menu > li.menu-item-has-children::before {
  content: "";
  width: 10px;
  height: 10px;
  background-color: var(--light-100);
  position: absolute;
  bottom: 5px;
  left: 50%;
  transform: translateX(-50%) rotate(45deg);
  opacity: 0;
}

.top-menu > li:hover::before {
  opacity: 1;
  transition: opacity 0.2s ease;
}

.top-menu > li > .sub-menu > li {
  display: flex;
}

.top-menu > li > .sub-menu > li > a {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: var(--fontSizeSm);
  font-weight: 500;
  color: var(--primary-400);
  padding: 12px 0;
}

.top-menu > li > .sub-menu > li > a::before {
  content: "";
  display: inline-block;
  background-image: url(assets/images/deco-h2.svg);
  background-size: 16px 16px;
  width: 16px;
  height: 16px;
}

.top-menu > li > .sub-menu > li > a:hover {
  color: var(--secondary-400);
}

#mobile-menu-toggle {
  display: none;
  background: transparent;
  border: 0;
  align-items: center;
  justify-content: center;
  height: 100%;
  margin-left: auto;
  cursor: pointer;
}

.top-menu.active {
  transform: translateX(0);
}

.header__content-top__btns {
  display: flex;
  align-items: center;
  justify-content: end;
  gap: 10px;
}

.header__content-top__btns > * {
  display: flex;
  align-items: center;
  gap: 10px;
  font-weight: 600;
}

.cart-icon {
  gap: 5px;
}

.cart-icon .wc-block-mini-cart__button {
  padding: 0;
}

.cart-icon .wc-block-mini-cart__button .wc-block-mini-cart__icon {
  width: 30px;
  height: 30px;
}

/* TOP PAGE */

.hero-banner-home {
  position: relative;
  width: 100%;
  min-height: 715px;
  background: var(--hero-home);
  display: flex;
  flex-direction: column;
  align-items: center;
  padding-top: 140px;
}

.hero-banner-home__logo img {
  transform: translateY(25px);
  animation: appear 1s ease forwards;
  animation-delay: 650ms;
  opacity: 0;
}

.hero-banner-home__logo p {
  color: var(--light-100);
  text-align: center;
  font-size: var(--fontSizeXl);
  font-weight: 500;
  margin-top: 20px;
  animation: appear 1s ease forwards;
  animation-delay: 1.2s;
  transform: translateY(25px);
  opacity: 0;
}

.product-cards {
  display: flex;
  justify-content: center;
  gap: 2vw;
  margin: -225px auto var(--gutterSection);
}

.product-cards__item:nth-child(1) {
  --color: #38b399;
}
.product-cards__item:nth-child(2) {
  --color: #ea570f;
}
.product-cards__item:nth-child(3) {
  --color: #009fe3;
}

.product-cards__item:nth-child(4) {
  --color: #009fe3;
}

.product-cards__item {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: end;
  text-align: center;
  background: url(assets/images/bg-dark-section.svg), var(--primary-400);
  color: var(--light-100);
  border-top: 3px solid var(--color);
  border-right: 3px solid var(--color);
  border-radius: 10px;
  padding: var(--gutterBlocks);
  width: 340px;
  height: 330px;
  transform: translateY(50px);
  opacity: 0;
  animation: appear 700ms ease forwards;
}
.product-cards__item:nth-child(1) {
  animation-delay: 200ms;
}
.product-cards__item:nth-child(2) {
  animation-delay: 400ms;
}
.product-cards__item:nth-child(3) {
  animation-delay: 600ms;
}
.product-cards__item:nth-child(4) {
  animation-delay: 800ms;
}

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

.product-cards__item > img {
  position: absolute;
  top: -150px;
  left: 50%;
  transform: translateX(-50%);
  width: auto;
  height: 250px;
  transition: top 0.3s ease;
}

.product-cards__item:hover > img {
  top: -175px;
}

.product-cards__item:nth-child(1) > img {
  transform: translateX(-50%) rotate(-15deg);
}

.product-cards__item:nth-child(4) > img {
  transform: translateX(-50%) rotate(15deg);
}

.product-cards__item__top-text {
  font-weight: 500;
  text-transform: uppercase;
}

.product-cards__item__middle-text {
  font-size: clamp(16px, 1.302vw, 25px);
  font-weight: 700;
  text-transform: uppercase;
  color: var(--color);
}

.product-cards__item__bottom-text {
  font-weight: 600;
  text-wrap: balance;
  margin: 15px 0;
}

.product-cards__item .artgo-btn {
  position: relative;
  color: var(--primary-400);
  background-color: var(--color);
  border-color: var(--color);
  margin: 0 auto;
  gap: 16px;
}

.product-cards__item:hover .artgo-btn {
  --color: var(--light-100);
}

.product-cards__item .artgo-btn::before {
  content: url(assets/images/cart.svg);
}

.top-page {
  background: url(assets/images/top-page-bg.jpg) no-repeat;
  background-position: center left;
  padding: var(--gutterBlocks);
  min-height: 195px;
  display: flex;
  flex-direction: column;
  gap: 20px;
  align-items: center;
  justify-content: center;
  border-radius: 10px;
  margin-top: 30px;
}

.top-page__breadcrumb {
  font-size: 12px;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 10px;
  font-weight: 400;
  color: var(--light-100);
}

.top-page__breadcrumb span a {
  color: var(--light-100);
  font-weight: 400;
}

.top-page__breadcrumb span a:hover {
  text-decoration: underline;
  text-underline-offset: 3px;
}

.top-page__meta {
  display: flex;
  gap: 10px;
  color: var(--light-100);
  font-size: var(--fontSizeXs);
}

/****************** INNER BLOCKS *****************/

/* Title block */
.title-block {
  margin-bottom: var(--gutterBlocks);
  display: flex;
  justify-content: var(--title-block-alignement);
  text-align: center;
}

/* WYSIWYG block */
.text-block {
  display: flex;
  justify-content: center;
  gap: 5vw;
  margin-bottom: var(--gutterBlocks);
}

.text-block__item {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.text-block__item img {
  max-height: 250px;
  min-height: 60px;
  width: fit-content;
  margin: 0 auto;
}

.text-block__item .content {
  margin-bottom: auto;
}

/* TEXT / IMG BLOCK */

.text-img-block {
  display: flex;
  justify-content: space-between;
  gap: 5vw;
  flex-direction: var(--text-img-block-orientation);
  margin-bottom: var(--gutterBlocks);
}

.text-img-block__text {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: var(--gutterBlocks);
}

.text-img-block__img {
  flex: 1;
}

.text-img-block__img img {
  border-radius: 10px;
  width: fit-content;
  max-width: 100%;
  margin: 0 auto;
}

.text-img-block__img .video-block {
  max-width: 710px;
  aspect-ratio: 710 / 400;
}

.text-img-block__numbers {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 15px;
}

.text-img-block__numbers__item {
  width: 220px;
  display: flex;
  align-items: center;
  flex-direction: column;
  gap: 5px;
}

.text-img-block__numbers__item__number {
  color: var(--secondary-400);
  font-size: var(--fontSizeXxl);
  font-weight: 700;
}

.text-img-block__numbers__item__legend {
  text-align: center;
  max-width: 190px;
  text-wrap: balance;
  text-align: center;
}

/* IMAGE BLOCK */

.image-block {
  margin: 0 auto var(--gutterBlocks);
  display: flex;
  gap: 16px;
  width: 100%;
}

.image-block__item {
  flex: 1;
  display: flex;
  justify-content: center;
  margin: auto;
  border-radius: 10px;
  overflow: hidden;
}

.image-block__item img {
  width: auto;
  border-radius: 10px;
}

/* GALLERY BLOCK */

.gallery-block {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
  margin-bottom: var(--gutterBlocks);
}

.gallery-block__item {
  position: relative;
  overflow: hidden;
  aspect-ratio: 500 / 300;
  border-radius: 10px;
}

.gallery-block__item--hover {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  background-color: rgba(30, 30, 59, 0.5);
  transition: opacity 0.3s ease;
}

.gallery-block__item--hover img {
  width: 50px;
}

.gallery-block__item:hover .gallery-block__item--hover {
  opacity: 1;
}

.gallery-block__item > img {
  object-fit: cover;
  width: 100%;
  height: 100%;
}

/* LIGHT BOX */

.sl-wrapper {
  z-index: 9999;
}

.sl-overlay {
  background: var(--primary-400);
  z-index: 9400;
}

.sl-wrapper .sl-close,
.sl-wrapper .sl-navigation button,
.sl-wrapper .sl-counter {
  color: var(--light-100);
}

.sl-next div,
.sl-prev div {
  background-color: var(--secondary-400);
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 5px;
  height: 50px;
  width: 50px;
  transition: 0.3s ease;
}

.sl-next div:hover,
.sl-prev div:hover {
  background-color: var(--primary-400);
}

/* FORM BLOCK */

.grecaptcha-badge {
  display: none !important;
  visibility: hidden !important;
}

.form-block {
  max-width: 900px;
  margin: auto;
  margin-bottom: var(--gutterBlocks);
  background: url(assets/images/bg-dark-section.svg), var(--primary-400);
  color: var(--light-100);
  padding: var(--gutterSection);
  border-radius: 10px;
}

.form-block .gform_wrapper .gfield_label {
  color: var(--light-100);
}

.form-block .gform_wrapper .gfield_required {
  display: inline-block;
  color: var(--light-100);
}

.form-block .gform_wrapper .ginput_container_email input,
.form-block .gform_wrapper .ginput_container_text input,
.form-block .gform_wrapper .ginput_container_phone input,
.form-block .gform_wrapper .ginput_container_select select,
.form-block .gform_wrapper .ginput_container_textarea textarea {
  background-color: transparent;
  outline: none;
  color: var(--light-100);
  border: 1px solid var(--light-100);
  border-radius: 5px;
  padding: 10px 15px !important;
}

.form-block .gform_wrapper .ginput_container_select select {
  padding: 0 15px !important;
  cursor: pointer;
  background-image: url(./assets/images/chevron-down.svg);
}

.form-block .gform_wrapper .ginput_container_select select > * {
  background-color: var(--primary-400);
  color: var(--light-100);
}

.form-block .gform_wrapper .ginput_container_textarea textarea {
  min-block-size: 150px !important;
}

.form-block .gform_wrapper .ginput_container_email input::placeholder,
.form-block .gform_wrapper .ginput_container_text input::placeholder,
.form-block .gform_wrapper .ginput_container_phone input::placeholder,
.form-block
  .gform_wrapper
  .ginput_container_select
  select
  option.gf_placeholder,
.form-block .gform_wrapper .ginput_container_textarea textarea::placeholder {
  opacity: 0.8;
}

.form-block .gform_wrapper .ginput_container_email input:focus,
.form-block .gform_wrapper .ginput_container_text input:focus,
.form-block .gform_wrapper .ginput_container_phone input:focus,
.form-block .gform_wrapper .ginput_container_select select:focus,
.form-block .gform_wrapper .ginput_container_textarea textarea:focus {
  outline: 2px solid var(--secondary-400);
}

.form-block .gform_wrapper div.gform_drop_area {
  border: 1px dashed var(--light-100);
  border-radius: 3px;
  background: transparent;
  color: var(--light-100);
}

.form-block .gform_wrapper div.gform_drop_area::before {
  color: var(--light-100);
}

.form-block
  .gform_wrapper
  div.gform_drop_area
  button[type="button"].gform_button_select_files {
  background: transparent;
  color: var(--light-100);
  text-transform: uppercase;
  border: 1px solid var(--light-100);
  padding: 10px 20px;
  border-radius: 2px;
  cursor: pointer;
}

.form-block
  .gform_wrapper
  div.gform_drop_area
  button[type="button"].gform_button_select_files:hover {
  background: var(--light-100);
  color: var(--primary-400);
}

.form-block .gform_wrapper span.gfield_description,
.form-block .gform_wrapper .ginput_preview span.gfield_fileupload_percent,
.form-block .gform_wrapper .ginput_preview span.gfield_fileupload_filename,
.form-block .gform_wrapper .ginput_preview span.gfield_fileupload_filesize,
.form-block
  .gform_wrapper
  div.ginput_preview
  button.gform_delete_file
  span.dashicons.dashicons-trash:before {
  color: var(--light-100) !important;
}

.form-block
  .gform_wrapper
  .ginput_preview
  span.gfield_fileupload_progressbar_progress {
  background-color: var(--secondary-400);
}

.grecaptcha-badge {
  display: none !important;
  visibility: hidden !important;
}

.form-block .gform_wrapper .gfield_consent_label {
  color: var(--light-100);
}

.form-block .gform_wrapper .gform_footer.top_label .artgo-btn.artgo-btn--gform {
  font-size: var(--fontSizeBase);
  margin: auto;
  cursor: pointer;
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  line-height: 1;
  color: var(--dark-400);
  text-transform: uppercase;
  width: fit-content;
  background-color: var(--secondary-400);
  border-radius: 50px;
  border: 2px solid var(--secondary-400);
  color: var(--primary-400);
  padding: 10px 25px;
}

.form-block
  .gform_wrapper
  .gform_footer.top_label
  .artgo-btn.artgo-btn--gform:hover {
  background: transparent;
  color: var(--light-100);
  border-color: var(--light-100);
}

.form-block
  .gform_wrapper
  input[type="checkbox"]:where(
    :not(.gform-theme__disable):not(.gform-theme__disable *):not(
        .gform-theme__disable-framework
      ):not(.gform-theme__disable-framework *)
  )::before {
  color: var(--primary-400);
}

.form-block h2 {
  margin-bottom: var(--gutterBlocks);
  color: var(--light-100);
}

/* VIDEO BLOCK */

.video-block {
  position: relative;
  aspect-ratio: 16/9;
  margin: 0 auto var(--gutterBlocks);
}

.video-block a,
.video-block iframe {
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
}

.video-block iframe {
  border: 0;
}

.video-block a::before {
  content: "▶";
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  border-radius: 100%;
  height: 50px;
  width: 50px;
  background-color: var(--light-100);
  color: var(--secondary-400);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 1;
  /* filter: brightness(0.8); */
  transition: 0.3s;
}
.video-block img {
  object-fit: cover;
  height: 100%;
  width: 100%;
  border-radius: 15px;
  filter: brightness(0.5);
  transition: 0.3s;
}
.video-block:hover a::before {
  /* filter: brightness(1); */
  height: 65px;
  width: 65px;
}

.video-block:hover img {
  filter: brightness(1);
}

/* PUSH CONTENT BLOCK */

.push-content-block {
  padding: 20px;
  margin-bottom: var(--gutterBlocks);
  border-radius: 10px;
  border: 2px solid var(--secondary-400);
}

.push-content-block__content {
  font-size: var(--fontSizeMedium);
  font-weight: 500;
  line-height: 2;
}

.push-content-block__content strong {
  color: var(--secondary-400);
}

/* TABLEPRESS BLOCK */

.tablepress-block {
  overflow-x: auto;
  margin-bottom: var(--gutterBlocks);
}

.tablepress-block .tablepress {
  border: 0;
}

.tablepress-block .tablepress tfoot th,
.tablepress-block .tablepress thead th {
  background-color: var(--secondary-400);
  color: var(--primary-400);
  text-align: center;
  text-transform: uppercase;
}

.tablepress-block .tablepress .sorting:hover,
.tablepress-block .tablepress .sorting_asc,
.tablepress-block .tablepress .sorting_desc {
  background-color: var(--primary-400);
  color: var(--light-100);
}

.tablepress-block .tablepress td,
.tablepress-block .tablepress th {
  padding: 14px;
  font-size: var(--fontSizeBase);
  color: var(--light-100);
  border: none !important;
  text-align: center;
  min-width: 100px;
}

.tablepress-block .tablepress tr td:first-child,
.tablepress-block .tablepress tr th:first-child {
  text-align: left;
}

.tablepress-block .tablepress .odd td,
.tablepress-block .tablepress tr.odd:hover td {
  background-color: var(--primary-400);
  color: var(--light-100);
}

.tablepress-block .tablepress .even td,
.tablepress-block .tablepress tr.even:hover td {
  background-color: transparent;
  color: var(--primary-400);
}

.section-dark .tablepress-block .tablepress .even td,
.section-dark .tablepress-block .tablepress tr.even:hover td {
  color: var(--light-100);
}

.dataTables_length,
.dataTables_info {
  font-size: var(--fontSizeSm);
}

.dataTables_filter,
.dataTables_length {
  margin-bottom: var(--fontSizeBase);
}

.section-dark .dataTables_length,
.section-dark .dataTables_info {
  color: var(--light-100);
}

.dataTables_paginate {
  color: var(--primary-400);
}

.dataTables_filter label input {
  border: 1px solid var(--primary-400);
}

.dataTables_wrapper label select {
  border: 1px solid var(--primary-400);
}

.section-dark .tablepress-block label {
  color: var(--light-100);
}

.paginate_button.disabled {
  color: var(--primary-400) !important;
  text-decoration: none;
  cursor: default;
}

.paging_simple .paginate_button.next:after {
  color: var(--primary-400) !important;
}

.paging_simple .paginate_button.previous:after {
  color: var(--primary-400) !important;
}

/* BUTTONS BLOCK */

.btn-block {
  display: flex;
  justify-content: center;
  margin-bottom: var(--gutterBlocks);
}

/* FAQ block */

.faq-block {
  margin-bottom: var(--gutterBlocks);
}

.faq__item__question {
  font-size: var(--fontSizeMedium);
  font-weight: 600;
  cursor: pointer;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  padding-bottom: 20px;
  margin-bottom: 20px;
  border-bottom: 1px solid var(--secondary-400);
  transition: 0.3s ease;
}

.faq__item:first-child .faq__item__question {
  padding-top: 20px;
  border-top: 1px solid var(--secondary-400);
}

.faq__item__question::after {
  content: url(./assets/images/chevron-down.svg);
  transform: rotate(-90deg) scale(1.5);
  transition: transform 0.3s ease;
  filter: invert(1);
}

.faq__item__question.active::after {
  transform: rotate(0) scale(1.5);
}

.faq__item__answer {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.3s ease;
}

.faq__item__answer .content {
  margin-bottom: 20px;
  padding: calc(var(--gutterBlocks) / 2);
}

/* Pictos block */

.picto-block {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  justify-content: center;
  margin-bottom: var(--gutterBlocks);
}

.picto-block__item {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  width: calc(20% - 16px);
  min-width: 100px;
}

.picto-block__item img {
  width: auto;
  height: 60px;
  margin-bottom: 16px;
}

.picto-block__item__legend {
  font-size: var(--fontSizeBase);
  font-weight: 600;
}

.picto-block__item__description {
  font-size: var(--fontSizeSm);
  font-style: italic;
}

/* Push FAQ Block */

.push-faq-block {
  background-color: var(--light-100);
  color: var(--primary-400);
  padding: var(--gutterBlocks);
  border-radius: 10px;
}

.push-faq-block :is(.content, .artgo-h2, .content h2, .artgo-btn) {
  color: var(--dark-400);
}

.push-faq-block .artgo-btn:hover {
  color: var(--dark-400);
  background-color: var(--secondary-400);
}

.push-faq-block .text-block {
  justify-content: flex-start;
}

/* PUSH POSTS bLOCK */

.push-post-block {
  display: flex;
  gap: 60px;
  margin-bottom: var(--gutterBlocks);
}

/* LISTINGS */

.listing-posts,
.push-post-block {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  column-gap: clamp(16px, 3.125vw, 60px);
  row-gap: 25px;
}

.listing-posts__item {
  display: flex;
  flex-direction: column;
  gap: 15px;
  background-color: var(--light-100);
  border: 1px solid var(--primary-400);
  border-radius: 10px;
  color: var(--dark-400);
  height: auto;
}

.listing-posts__item:hover {
  border-color: var(--secondary-400);
}

.listing-posts__item__img {
  overflow: hidden;
  border-radius: 10px 10px 0 0;
  height: 50%;
}

.listing-posts__item__img img {
  object-fit: cover;
  width: 100%;
  height: 100%;
  transition: 0.3s ease;
}

.listing-posts__item__content {
  display: flex;
  flex-direction: column;
  gap: 15px;
  padding: 20px;
}

.listing-posts__item__content__meta {
  font-size: var(--fontSizeXs);
  color: var(--secondary-400);
}

.listing-posts__item__content h3 {
  display: flex;
  gap: 10px;
  font-size: var(--fontSizeMedium);
  color: var(--primary-400);
  font-weight: 600;
  margin-bottom: auto;
}

.listing-posts__item:hover h3 {
  color: var(--secondary-400);
}

.listing-posts__item:hover .listing-posts__item__img img {
  transform: scale(1.1);
  filter: brightness(0.8);
}

.listing-posts__item__content__btn {
  display: flex;
  gap: 4px;
  width: fit-content;
  font-weight: 500;
  margin-top: auto;
}

.listing-posts__item__content__btn::after {
  content: ">";
}

.listing-posts__item:hover .listing-posts__item__content__btn {
  color: var(--secondary-400);
}

.wp-pagenavi {
  display: flex;
  justify-content: center;
  margin: var(--gutterBlocks) 0;
}

.wp-pagenavi .current,
.wp-pagenavi .page,
.wp-pagenavi .nextpostslink,
.wp-pagenavi .previouspostslink {
  width: 30px;
  height: 30px;
  display: flex;
  justify-content: center;
  align-items: center;
  color: var(--dark-400);
  font-size: var(--fontSizeBase);
}

.wp-pagenavi .nextpostslink,
.wp-pagenavi .previouspostslink {
  width: auto;
}

.wp-pagenavi span.current {
  border: 1px solid var(--secondary-400);
  background: none;
  border-radius: 50%;
}

.wp-pagenavi a:hover {
  text-decoration: underline;
}

.wp-pagenavi a,
.wp-pagenavi span {
  text-decoration: none;
  border: none;
  padding: 3px 5px;
  margin: 2px;
}

.listing-subpages {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-auto-rows: 300px;
  gap: 20px;
}

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

.listing-subpages__item {
  position: relative;
  background: var(--bg-push-grid) no-repeat, var(--bg-default);
  background-size: cover, cover;
  background-position: center;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  justify-content: end;
  transition: 0.3s ease;
  color: var(--light-100);
  padding: 20px;
  border-radius: 20px;
}

.listing-subpages__item::before {
  content: "";
  position: absolute;
  inset: 0;
  background-color: var(--dark-400);
  mix-blend-mode: multiply;
  opacity: 0;
  transition: 0.3s ease;
}

.listing-subpages__item:hover::before {
  opacity: 0.5;
}

.listing-subpages__item__title {
  position: relative;
  display: flex;
  justify-content: space-between;
  align-items: end;
  text-transform: uppercase;
  font-weight: 600;
  margin-bottom: 10px;
  transform: translateY(50px);
  transition: transform 0.3s ease;
}

.listing-subpages__item-icon {
  width: auto;
  height: 55px;
}

.listing-subpages__item__btn {
  position: relative;
  font-weight: 400;
  font-size: var(--fontSizeSm);
  border-top: 2px solid var(--secondary-400);
  padding-top: 10px;
  transform: translateY(100px);
  transition: transform 0.3s ease;
}

.listing-subpages__item:hover
  :is(.listing-subpages__item__title, .listing-subpages__item__btn) {
  transform: translateY(0);
}

/****************** CONTACT PAGE *****************/

#contact-page-top {
  margin-top: var(--gutterSection);
  margin-bottom: 0;
}

.contact-page-details {
  display: flex;
}

.contact-page-details .artgo-icon {
  filter: brightness(0) saturate(100%) invert(58%) sepia(91%) saturate(316%)
    hue-rotate(117deg) brightness(88%) contrast(81%);
}

.contact-page-details__left,
.contact-page-details__right {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.contact-page-details__right {
  flex: 2;
}

.contact-page-details__logo {
  max-width: 300px;
  display: flex;
  width: fit-content;
}

.contact-page-details__left__address,
.contact-page-details__left__phone {
  display: flex;
  gap: 20px;
}

.contact-page-details__left__phone a {
  color: var(--primary-400);
}

.contact-page-details__left__phone a:hover {
  text-decoration: underline;
}

.contact-page-details__right img {
  border-radius: 10px;
}

#contact-page .form-block {
  padding: 0;
  background: transparent;
}

/****************** FOOTER *****************/

.pre-footer {
  background: var(--secondary-400);
  padding: var(--gutterBlocks) 0;
}

.pre-footer-block {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 2vw;
  color: var(--primary-400);
  font-weight: 500;
}

.pre-footer-block__item {
  width: calc(25% - 2vw);
  display: flex;
  align-items: center;
  gap: 15px;
}

.pre-footer-block__item img {
  height: 40px;
  width: auto;
}

footer {
  background-color: var(--primary-400);
  color: var(--light-100);
}

.footer-top {
  display: flex;
  align-items: center;
  gap: 5vw;
  padding: var(--gutterSection) 0;
}

.footer-top > * {
  flex: 1;
}

.footer-top__left {
  display: flex;
  flex-direction: column;
  gap: var(--gutterBlocks);
}

.footer-top__left > a {
  max-width: 240px;
}

.footer-top__center {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 15px;
  text-align: center;
  position: relative;
  z-index: 0;
}

.footer-top__center > a:not(.artgo-btn) {
  color: var(--light-100);
  width: fit-content;
  display: flex;
  gap: 10px;
}

.footer-top__center__address {
  display: flex;
  gap: 10px;
}

.footer-top__center > a:not(.artgo-btn):hover {
  text-decoration: underline;
  text-underline-offset: 3px;
}

.footer-top__right {
  display: flex;
  justify-content: center;
  align-items: center;
}

.footer-top__right img {
  max-width: 250px;
  height: auto;
}

.footer-top__right__socials {
  margin-top: var(--fontSizeSm);
  display: flex;
  gap: 10px;
  justify-content: center;
}

.footer-top__right__socials > a > img {
  filter: brightness(0) invert(1);
}

.footer-top__right__socials > a:hover > img {
  filter: brightness(0) saturate(100%) invert(58%) sepia(91%) saturate(316%)
    hue-rotate(117deg) brightness(88%) contrast(81%);
}

.footer-bottom {
  padding: 10px 0;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 5px;
  border-top: 1px solid var(--secondary-400);
}

.footer-bottom li {
  display: flex;
  align-items: center;
  justify-content: center;
}

.footer-bottom li:not(:first-child)::before {
  content: "-";
  margin-right: 5px;
}

.footer-bottom li a {
  font-size: var(--fontSizeXs);
  color: var(--light-100);
}

.footer-bottom li a:hover {
  text-decoration: underline;
  text-underline-offset: 3px;
}

/****************** WOOCOMMERCE *****************/

/* Account page */
.content ul .woocommerce-MyAccount-navigation-link {
  padding: 15px 5vw 15px 0;
  border-bottom: 1px solid var(--secondary-400);
}

.content ul .woocommerce-MyAccount-navigation-link::before {
  content: "";
}

.content ul .woocommerce-MyAccount-navigation-link a {
  font-size: var(--fontSizeMedium);
  color: var(--dark-400);
  font-weight: 700;
  line-height: 1.2;
}

.content ul .woocommerce-MyAccount-navigation-link--customer-logout a {
  color: red;
}

.content ul .woocommerce-MyAccount-navigation-link a:hover {
  color: var(--secondary-400);
  text-decoration: none;
}

.content ul .woocommerce-MyAccount-navigation-link--customer-logout a:hover {
  color: var(--dark-400);
}

.woocommerce form .form-row {
  margin-bottom: var(--gutterBlocks);
}

.woocommerce form .form-row label {
  font-size: var(--fontSizeSm);
}

.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row input[type="date"] {
  border: 1px solid var(--dark-400);
  padding: 10px 20px;
}

.woocommerce form .form-row .required {
  color: var(--dark-400);
}

.select2-container--default .select2-selection--single {
  border: 1px solid var(--dark-400);
  height: 45px;
  padding: 10px;
}

.select2-container--default
  .select2-selection--single
  .select2-selection__rendered {
  line-height: 1.5;
}

.select2-container--default
  .select2-selection--single
  .select2-selection__arrow {
  top: 50%;
  transform: translateY(-50%);
}

.woocommerce-Address-title.title {
  background-color: transparent;
  color: var(--dark-400);
  padding: 16px;
  border: 1px solid var(--primary-400);
  display: flex;
  flex-direction: column;
  gap: 16px;
  border-radius: 20px;
}

.woocommerce-account .addresses .title .edit {
  color: var(--primary-400);
  text-decoration: underline;
  font-style: italic;
}

/* MiniCart */

.wc-block-mini-cart__empty-cart-wrapper {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 20px;
}

span:where(.wc-block-mini-cart__badge) {
  background-color: var(--light-100) !important;
  color: var(--primary-400) !important;
}

h2.wc-block-mini-cart__title {
  font-size: var(--fontSizeMedium);
  text-transform: uppercase;
  font-weight: 700;
}

.wc-block-components-button.wc-block-components-drawer__close {
  right: 20px;
  top: 20px;
}

.wc-block-components-button:not(.is-link) .wc-block-components-button__text {
  font-size: var(--fontSizeSm);
}

/* WC notifications */

.woocommerce-error,
.woocommerce-info,
.woocommerce-message {
  background-color: #e9f7f4;
  color: var(--primary-400);
  max-width: 1200px;
  margin: 0 auto 2em;
  border-radius: 20px;
  border-top-width: 1px;
}

.woocommerce-info {
  border-top-color: var(--secondary-400);
}

.woocommerce-info::before {
  color: var(--primary-400);
}

.woocommerce-message {
  border-top-color: var(--secondary-400);
}

/* WC Buttons */

body:not(.woocommerce-block-theme-has-button-styles)
  .wc-block-components-button:not(.is-link),
.wc-block-components-button:not(.is-link).is-style-outline:not(:focus),
.wc-block-components-button:not(.is-link).outlined:not(:focus),
.woocommerce :is(a.button, button.button, .wp-element-button),
.woocommerce-page
  :is(.wc-block-components-totals-coupon-link, .wp-element-button) {
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  line-height: 1;
  color: var(--dark-400) !important;
  text-transform: uppercase;
  width: fit-content;
  background-color: transparent !important;
  border-radius: 50px;
  border: 2px solid var(--secondary-400) !important;
  padding: 10px 25px !important;
  font-weight: 600;
  outline: 0 !important;
  box-shadow: none !important;
}

body:not(.woocommerce-block-theme-has-button-styles)
  .wc-block-components-button:not(.is-link):hover,
.wc-block-components-button:not(.is-link).is-style-outline:not(:focus):hover,
.wc-block-components-button:not(.is-link).outlined:not(:focus):hover,
.woocommerce :is(a.button, button.button, .wp-element-button):hover,
.woocommerce-page :is(a.button, button.button, .wp-element-button):hover {
  background-color: var(--secondary-400) !important;
  border-color: var(--secondary-400) !important;
  color: var(--primary-400) !important;
  text-decoration: none;
}

.wc-block-cart__submit-container {
  display: flex;
  justify-content: center;
}

.woocommerce-page
  :is(
    .wc-block-cart__submit-button,
    .wc-block-components-totals-coupon__button
  ) {
  background-color: var(--dark-400);
}

.woocommerce-page
  :is(
    a.wc-block-cart__submit-button,
    .wc-block-components-totals-coupon__button
  ):after {
  border-color: var(--dark-400);
}

.woocommerce-page :is(.wc-block-components-checkout-place-order-button) {
  background-color: var(--dark-400);
}

/* Login page */

#customer_login h2 {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.woocommerce form.login,
.woocommerce form.register {
  border-color: var(--secondary-400);
  margin-top: 0;
  border-radius: 20px;
}

.woocommerce-privacy-policy-text {
  font-size: var(--fontSizeXs);
  font-style: italic;
  font-weight: 400;
  margin-bottom: 30px;
}

.woocommerce .woocommerce-form-login .woocommerce-form-login__rememberme {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 30px;
  cursor: pointer;
  width: 100%;
}

.woocommerce .woocommerce-form-login .woocommerce-form-login__rememberme input {
  cursor: pointer;
  accent-color: var(--secondary-400);
  width: 20px;
  height: 20px;
}

.content ul.wc-block-components-totals-discount__coupon-list li::before {
  content: "";
}

#subscribe-to-newsletter ~ span {
  line-height: 1.5em;
}

/* Single product */

.single-product main {
  padding-top: var(--gutterBlocks);
}

.woocommerce div.product {
  display: flex;
  flex-wrap: wrap;
  gap: 5vw;
  padding-top: 20px;
}

.single-product__images {
  position: relative;
  display: flex;
  max-width: 660px;
  width: 50vw;
  flex: 1;
}

.woocommerce div.product div.images {
  margin-bottom: 0;
}

.woocommerce div.product div.images img {
  border-radius: 5px;
}

.images.wpgs-wrapper {
  padding-bottom: 0;
}

.single-product__images .artgo-label-wrapper span {
  /* top: 25px;
  left: calc(20% + 25px);
   */
  position: absolute;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  right: 10px;
  top: 10px;
  background-color: var(--secondary-400);
  border-radius: 5px;
  font-weight: 700;
  font-size: 12px;
  z-index: 100;
  padding: 5px 10px;
  pointer-events: none;
}

.woocommerce div.product div.images.woocommerce-product-gallery {
  width: 100%;
}

.woocommerce div.product div.summary {
  display: flex;
  flex-direction: column;
  float: unset;
  flex: 1;
}

.woocommerce div.product .product_title {
  font-size: var(--fontSizeH1);
  font-weight: 700;
  text-wrap: balance;
  text-transform: uppercase;
}

.woocommerce div.artgo-single-product p.price,
.woocommerce div.artgo-single-product span.price {
  font-size: var(--fontSizeH2);
  font-weight: 700;
  color: var(--secondary-400);
  line-height: 1.4;
  margin: 10px 0 20px;
}

.woocommerce div.artgo-single-product p.price ins,
.woocommerce div.artgo-single-product span.price ins {
  text-decoration: none;
}

.woocommerce
  div.artgo-single-product
  .woocommerce-product-details__short-description {
  margin-bottom: 20px;
}

.woocommerce-variation-price {
  margin-bottom: 16px;
}

.woocommerce div.product form.cart {
  display: flex;
  gap: 16px;
}

.woocommerce div.product form.cart::after,
.woocommerce div.product form.cart::before {
  display: none;
}

.woocommerce .quantity span {
  font-weight: 700;
  text-transform: uppercase;
  color: var(--primary-400);
}

.woocommerce-variation-add-to-cart {
  display: flex;
  align-items: center;
}

.woocommerce div.product form.cart div.quantity {
  height: 45px;
  display: flex;
  align-items: center;
  gap: 16px;
  float: none;
}

.woocommerce .quantity .qty {
  border: 2px solid var(--secondary-400);
  border-radius: 25px;
  height: 100%;
  padding: 0 20px;
  min-width: 95px;
  float: none;
}

.woocommerce div.product form.cart .button {
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  line-height: 1;
  color: var(--dark-400);
  text-transform: uppercase;
  width: fit-content;
  background-color: transparent;
  border-radius: 50px;
  border: 2px solid var(--secondary-400);
  color: var(--primary-400);
  padding: 10px 25px;
  font-weight: 600;
}

.woocommerce div.product form.cart .button:hover {
  background-color: var(--secondary-400);
  border-color: var(--secondary-400);
}

.artgo-single-product-inner-page {
  width: 100%;
}

.artgo-single-product__description {
  padding-top: 0;
}

/* Cart page */

table.wc-block-cart-items .wc-block-cart-items__header th {
  font-weight: 600;
  font-size: var(--fontSizeBase);
}

table.wc-block-cart-items
  .wc-block-cart-items__row
  .wc-block-components-product-name {
  font-weight: 500;
  color: var(--secondary-400);
}

.wc-block-cart-item__total-price-and-sale-badge-wrapper {
  color: var(--dark-400);
  font-weight: 500;
  font-size: var(--fontSizeBase);
}

.woocommerce-cart .is-large.wc-block-cart .wc-block-cart-items,
.woocommerce-cart .is-large.wc-block-cart .wc-block-cart-items td {
  border-color: var(--secondary-400);
}

.woocommerce-cart .wc-block-components-sidebar {
  background-color: transparent;
  border: 1px solid var(--secondary-400);
  border-radius: 5px;
  color: var(--dark-400);
  padding: 30px !important;
  height: fit-content;
}

.woocommerce-cart .is-large.wc-block-cart .wc-block-cart__totals-title {
  font-size: var(--fontSizeH2);
  font-weight: 700;
  text-align: center;
  display: flex;
  align-items: center;
  color: var(--primary-400);
  gap: 15px;
  text-transform: capitalize;
}

.woocommerce-page
  .wc-block-components-totals-coupon__form
  .wc-block-components-totals-coupon__input
  input,
.woocommerce-page
  .wc-block-components-totals-coupon__form
  .wc-block-components-totals-coupon__input
  input:focus {
  background: none;
  border-color: var(--secondary-400);
  color: var(--dark-400);
}
.woocommerce-page
  .wc-block-components-totals-coupon__form
  .wc-block-components-totals-coupon__input
  label {
  color: var(--dark-400);
}

.woocommerce-cart .wc-block-components-totals-wrapper {
  border-color: transparent;
}

.woocommerce-cart .wc-block-components-totals-wrapper:last-child {
  border-color: var(--secondary-400);
}

.woocommerce-cart
  .is-large.wc-block-cart
  .wc-block-components-sidebar
  .wc-block-components-totals-item__description.wc-block-components-totals-shipping__via,
.is-large.wc-block-cart
  .wc-block-components-sidebar
  .wc-block-components-totals-shipping__change-address__link {
  color: var(--secondary-400);
}

/* Checkout page */

.woocommerce-checkout .wp-block-woocommerce-checkout-order-summary-block {
  background-color: var(--neutral-900);
  color: var(--neutral-50);
  padding: var(--gutter-blocks);
}

.woocommerce-checkout .wc-block-components-totals-wrapper:last-child {
  border-color: var(--orange-450);
}

.woocommerce-page .wc-block-components-checkout-step__heading {
  font-family: var(--secondary-font);
}

.woocommerce-cart .wc-ppcp-paylater-msg__container,
.woocommerce-checkout .wc-ppcp-paylater-msg__container {
  display: none;
}

.ppcp-messages {
  display: none !important;
}

.wp-block-woocommerce-empty-cart-block h2 {
  flex-direction: column !important;
}

/****************** RESPONSIVE *****************/

@media only screen and (max-width: 991px) {
  #mobile-menu-toggle {
    display: flex;
  }
  .top-menu {
    position: fixed;
    top: 125px;
    left: 0;
    right: 0;
    bottom: 0;
    height: calc(100vh - 125px);
    background-color: var(--primary-400);
    transform: translateX(100vw);
    transition: transform 0.3s ease;
    flex-direction: column;
    padding: 5vh 5vw;
    overflow-y: auto;
    z-index: 999;
    border-top: 2px solid var(--secondary-400);
  }

  .top-menu > li {
    height: auto;
    display: inline-block;
  }

  .top-menu > li > a {
    padding-bottom: 2vh;
  }

  .top-menu > li:not(.top-menu--contact) > a {
    height: auto;
    align-items: flex-start;
  }

  .top-menu .top-menu--contact a {
    margin: 0;
  }

  .top-menu .sub-menu {
    position: relative;
    opacity: 1;
    max-height: unset;
    inset: unset;
    transform: none;
    background-color: transparent;
    padding-bottom: 15px;
    box-shadow: 0;
  }

  .top-menu > li > .sub-menu > li > a {
    font-size: var(--fontSizeSm);
    color: var(--light-100);
    padding: 12px 5vw 0;
  }

  .top-menu > li:hover::before,
  .top-menu > li:not(.top-menu--contact) > a::after {
    content: unset;
  }

  .top-menu > li:hover > .sub-menu {
    padding: unset;
  }

  .hero-banner-home {
    min-height: 0;
    height: 300px;
    padding: 0;
    justify-content: center;
  }

  .product-cards {
    margin: 0 auto;
  }

  .text-img-block {
    flex-direction: column-reverse;
  }

  .text-img-block__txt,
  .text-img-block__img {
    width: 100%;
  }

  .text-img-block .artgo-btn {
    margin: 0 auto;
  }

  .text-block {
    flex-direction: column;
  }

  .product-cards {
    flex-direction: column;
    margin-top: var(--gutterBlocks);
  }

  .product-cards__item {
    width: 70vw !important;
    height: auto;
    max-width: 500px;
    margin: auto;
  }

  .product-cards__item img {
    position: relative;
    top: unset;
    left: unset;
    transform: none !important;
    width: 125px;
    height: auto;
    margin: auto;
  }

  .product-cards__item:hover img {
    top: unset;
  }

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

  #contact-page section {
    flex-direction: column;
    gap: var(--gutterBlocks);
  }

  .pre-footer-block__item {
    width: calc(50% - 2vw);
  }
}

@media only screen and (max-width: 768px) {
  .listing-posts,
  .push-post-block {
    grid-template-columns: repeat(2, 1fr);
  }
  .gallery-block {
    grid-template-columns: repeat(2, 1fr);
  }
  .picto-block {
    grid-template-columns: repeat(2, 1fr);
  }
  .header__top-bar__right {
    display: none;
  }
}

@media only screen and (max-width: 576px) {
  .header__top-bar__center {
    display: none;
  }
  .top-page__breadcrumb {
    font-size: 10px;
    gap: 4px;
  }
  .header__menu__logo {
    max-width: 120px;
  }
  .hero-banner-home {
    height: 200px;
  }
  .hero-banner-home__logo img {
    max-width: 250px;
  }

  .product-cards__item {
    padding: 16px;
  }

  .form-block {
    padding: 5vw;
  }

  .call-btn {
    display: none;
  }

  .listing-posts,
  .listing-subpages,
  .push-post-block {
    grid-template-columns: 1fr;
  }

  .pre-footer-block__item {
    width: 100%;
  }

  .pre-footer-block__item img {
    width: 40px;
  }

  .footer-top {
    flex-direction: column;
  }
  .footer-top__left > a {
    margin: auto;
  }
}