@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Gabriela&family=Rubik:ital,wght@0,300..900;1,300..900&display=swap');


:root { 
	/* cores */
    --primary: #051a53;
    --primary-hover: #04133d;
    --primary-active: #040e2b;
    --secondary: #ffdd02;
    --secondary-hover: #e6c809;
    --secondary-active: #d6ba0a;
    --green:#09B217;
	--green-hover: #0d9118;
	--green-active: #0f7b18;
	/* cores */

	/* header */
	--header-topbar-background-color: var(--primary);
	--header-topbar-text-color: #fff;
	--header-topbar-icon-color: #fff;
	--header-background-color: var(--primary);
	--header-border-color: #eee;
	--header-color-text: #fff;
	--header-svg-color: var(--secondary);
	--header-svg-width: 26px;
	--header-svg-height: 26px;
	--header-search-background-color: #f9f9f9;
	--header-search-background-color-focus: var(--header-search-background-color);
	--header-search-color: #000;
	--header-menu-color-text: #000;
	--header-menu-font-size: 11px;
	--header-menu-text-height: 48px;
	/* header */

	/* footer */
	--footer-background-color: #f9f9f9;
	--footer-border-color: #D8D8D7;
	--footer-color-text: var(--text);
	/* footer */

	/* fontes */
    --font-primary: 'Roboto', sans-serif;
	--font-secondary: 'Taruno Wide', sans-serif;
	--font-tertiary: 'Verbatim', sans-serif;
	/* fontes */
   
	/* botões */
    --btn-product-thumb:var(--green);
    --btn-product-thumb-hover: var(--green-hover);
    --btn-product-thumb-active: var(--green-active);
    --btn-product-thumb-radius: 6px;

	/* --btn-add-cart: var(--green);
	--btn-add-cart-hover: var(--green-hover);
	--btn-add-cart-active: var(--green-active);
	--btn-add-cart-color: #fff; */

	/* botões */

	/* geral */
	--spacing-sections-home: 64px;
    --text: #1E1D1C;
	--background: #fff;
    --container-xxl: 1460px;
    --logo-max-height: 56px;
	@media (max-width: 991px) {
		--header-svg-width: 22px;
		--header-svg-height: 22px;
		 --logo-max-height: 40px;

		--spacing-sections-home: 40px;
	}
	/* geral */
}

.heading-title {font-size: 28px; font-family: var(--font-tertiary);}

/* Top-bar */
.top-bar {padding: 12px 0;}
.top-bar-items {justify-content: center; gap: 48px; font-weight: 400;}

/* Header */
.header-wrapper {gap: 24px;}
.header-wrapper .header-search {margin: 0 30px;}
.header-wrapper .search input {padding-left: 20px;}
.header-wrapper .search svg {fill: #000000;}
.header-bottom {background: #f9f9f9;}
.menu-advanced .title-principal {color: #000;}
.menu-advanced .lista-nivel-1 {justify-content: center;}
.menu-advanced .item-nivel-1-text {font-family: var(--font-tertiary);}
.menu-advanced .item-nivel-1 .item-nivel-1-text {padding: 0 10px;}
.menu-advanced .item-nivel-1:last-child .item-nivel-1-text {background: var(--secondary); border-radius: 100px; height: auto; padding: 8px 16px; transition: ease all .5s;}

/* Home */

.container- {background: var(--secondary); padding: 6px 4px; margin-top: calc(var(--spacing-sections-home) * -1);}
#marquee {font-size: 20px; font-weight: 600; overflow: hidden; text-transform: uppercase; letter-spacing: 1.5px;}
#marquee .swiper-wrapper {transition-timing-function: linear !important;}
#marquee .swiper-slide {display: flex; width: auto !important}
#marquee .swiper-slide-content {position: relative; display: flex;}
#marquee .swiper-slide-content:after {content: '•'; margin: auto 100px;}

/* Barra Promocional */
.promotional-bar .title {font-weight: 600; font-size: 15px; color: #494949;}
.promotional-bar .content {color: var(--text);}

.carousel-categories .carousel-categories-title {font-size: 14px; font-weight: 500; font-family: var(--font-tertiary); text-overflow: ellipsis; overflow: hidden;}
#swiperCategories {position: relative;}
.swiper-categories-prev, .swiper-categories-next {position: absolute; top: 50%; transform: translateY(-50%); width: 44px; height: 44px; display: flex; align-items: center; justify-content: center; cursor: pointer; z-index: 10; background: #e5e5e5; border-radius: 50%; user-select: none; box-shadow: 0 0 6px -2px rgb(0 0 0 / 30%);}
.swiper-categories-prev {left: 8px;}
.swiper-categories-next {right: 8px;}

.product-list-carousel.title-left .heading-title {border-bottom: none;}
.product-list-description {display: none;}
.product-thumb {padding: 16px; border-radius: 12px; border: none; background: #f8f8f8; gap: 12px;}
.product-thumb-title {line-height: 20px; min-height: 40px; margin: 12px 0 12px; font-family: var(--font-tertiary);}
.product-thumb-center {gap: 12px;}
.product-thumb .product-pix {margin-top: 12px; padding: 10px 16px;}
.product-thumb .product-pix-icon svg {width: 18px; height: 18px; fill: var(--primary);}
.product-thumb .btn-product-thumb {font-size: 15px; font-weight: 500; padding: 11px;}

.banners-grade {display: flex; gap: 16px; flex-wrap: wrap;}
.banners-grade .banner {overflow: hidden; border-radius: 12px; flex: 1; max-width: fit-content; flex-basis: 32%; flex-grow: 1; min-height: 400px;}
.banners-grade img {height: 100%; transition: ease .5s all; width: 100%; object-fit: cover;}
.banners-grade .banner:hover img {transform: scale(1.05);}
.banners-grade .infos-banner {position: absolute; bottom: 40px; left: 40px; color: #fff; z-index: 1; display: flex; flex-direction: column; gap: 8px; align-items: start;}
.banners-grade .title-banner {font-size: 32px; font-weight: 600;}
.banners-grade .infos-banner a {color: #fff; font-size: 13px; font-weight: 600; padding: 12px 24px; border: 1px solid #fff; border-radius: 100px;}
.banners-grade .infos-banner a:hover {background: #fff; color: #000;}
.banners-grade .infos-banner a i {font-size: 10px;}
.banners-grade .shadow {position: absolute; height: 100%; width: 100%; left: 0; bottom: 0; background: linear-gradient(0deg, rgb(0 0 0 / 50%) 0%, rgba(253, 187, 45, 0) 100%); z-index: 1;}

.banners-medium {display: flex; gap: 16px;}
.banners-medium .banner {overflow: hidden; border-radius: 12px;}
.banners-medium img {height: 100%; transition: ease .5s all;}
.banners-medium .banner:hover img {transform: scale(1.05);}
.banners-medium .infos-banner {position: absolute; bottom: 56px; left: 56px; color: #fff; z-index: 1; display: flex; flex-direction: column; gap: 8px; align-items: start;}
.banners-medium .title-banner {font-size: 32px; font-weight: 600;}
.banners-medium .infos-banner a {color: #fff; font-size: 13px; font-weight: 600; padding: 12px 24px; border: 1px solid #fff; border-radius: 100px;}
.banners-medium .infos-banner a:hover {background: #fff; color: #000;}
.banners-medium .infos-banner a i {font-size: 10px;}
.banners-medium .shadow {position: absolute; height: 100%; width: 100%; left: 0; bottom: 0; background: linear-gradient(0deg, rgb(0 0 0 / 50%) 0%, rgba(253, 187, 45, 0) 100%); z-index: 1;}

/* vídeo home */
#videos-product .container {max-width: 1466px;}
.shorts-videos .swiper-slide {width: 30%; margin-right: 16px; transition: all 0.5s ease; transform: scale(0.85);}
.shorts-videos .swiper-slide-active {transform: scale(1.1); z-index: 3;}
.shorts-videos .swiper-slide-prev, .shorts-videos .swiper-slide-next {transform: scale(0.9); z-index: 2;}
.shorts-videos .video-wrapper {overflow: hidden; display: flex; align-items: center; justify-content: center;}
.shorts-videos iframe.shorts-video {aspect-ratio: 9/16; width: 100%; border-radius: 16px; border: none;}
.swiper-shorts-videos-prev .container-arrow, .swiper-shorts-videos-next .container-arrow {border: 1px solid #000; background: #000; width: 44px; height: 44px; display: flex; align-items: center; justify-content: center; cursor: pointer; border-radius: 50%;}
.swiper-shorts-videos-prev .container-arrow i, .swiper-shorts-videos-next .container-arrow i {color: #fff;}
.swiper-shorts-videos-prev .container-arrow { margin-left: 10px; }
.swiper-shorts-videos-next .container-arrow { margin-right: 10px; }
/* video home

footer .logo {display: none;}

/* INTERNO */
/* Produto */
#product h1 {font-weight: 500; line-height: 34px; font-family: var(--font-tertiary);}
.stock-alert {color: #b22222; font-size: 12px; font-weight: 600; font-family: var(--font-tertiary); gap: 12px;}

.promotion-icon svg {width: 32px; height: 32px; fill: var(--primary);}
.promotion {border: 2px solid #051a53; background-color: transparent; color: #051a53; padding: 12px; border-radius: 6px; text-align: center; max-width: 400px; margin: 10px auto;}
.promotion-name {font-size: 18px; font-weight: 500; margin: 0; font-family: var(--font-tertiary); line-height: 26px;}
.promotion-name a {font-weight: 700;}
.promotion-description {color: #051a53; font-weight: 700;}

.whatsapp-order p {font-size: 16px; font-family: var(--font-tertiary); font-weight: 500; margin-bottom: 8px; line-height: 24px; color: #202020;}

#product .shipping-simulator .btn-shipping-simulator {background: #f1f1f1; color: #000;}

.feature-icon svg, .feature-icon svg path {width: 32px; height: 32px; fill: var(--primary);}
.feature-name {font-size: 15px; font-weight: 600; margin-bottom: 4px;}
.feature {background: #f4f4f3; padding: 12px 16px; border-radius: 4px;}

/* Mobile  */
@media (max-width: 991px) {
	.header-wrapper {gap: 10px;}
	.header-wrapper .header-search {margin: 0;}
	
	.offcanvas .header_logo {display: none;}
	
	#marquee {font-size: 16px;}
	#marquee .swiper-slide-content:after {margin: auto 60px;}
	
	.banners-grade {flex-direction: column;}
	.banners-grade .banner {height: 400px; flex: none; }
	.banners-grade .infos-banner {bottom: 20px; left: 20px;}
	.banners-grade .title-banner {font-size: 32px;}
	.banners-grade .infos-banner a {font-size: 12px;}
	.banners-grade img {object-position: right;}
	.banners-grade .infos-banner a {font-size: 16px;}
	.banners-grade .infos-banner a i {font-size: 12px;}
	
	.banners-medium {flex-direction: column;}
	.banners-medium .infos-banner {bottom: 20px; left: 20px;}
	.banners-medium .title-banner {font-size: 20px;}
	.banners-medium .infos-banner a {font-size: 12px;}
	
	.swiper-categories-prev, .swiper-categories-next {width: 37px; height: 37px;}
	
	.vowt-prev i, .vowt-next i {font-size: 11px;}

	/*video home */
	.shorts-videos { padding: 32px 0; }
	.shorts-videos .vowt-prev,
	.shorts-videos .vowt-next { display: none; }
}