@import url("https://fonts.googleapis.com/css2?family=Jost:wght@300;400;500;600;700&display=swap");

:root { 
	/* cores */
    --primary: #cda667;
    --primary-hover: #b68e50;
    --primary-active: #a77d3e;
    --secondary: #111111;
    --secondary-hover: #242424;
    --secondary-active: #050505;
    --green:#24ae6b;
	--green-hover: #1f995e;
	--green-active: #187f4d;
    --gray:#e6e6e6;
	--gray-hover: #e1e1e1;
	--gray-active: #dadada;
    --gray-light:#f3f3f3;
	--gray-light-hover: #e8e8e8;
	--gray-light-active: #e2e2e2;
	--white: #F0EFEF;
	/* cores */

	/* header */
	--header-topbar-background-color: var(--primary);
	--header-topbar-text-color: #fafafa;
	--header-topbar-icon-color: #fafafa;
	--header-background-color: #fff;
	--header-border-color: #DAD7D7;
	--header-color-text: var(--text);
	--header-svg-color: var(--primary);
	--header-svg-width: 25px;
	--header-svg-height: 25px;
	--header-search-background-color: var(--white);
	--header-search-background-color-focus: var(--gray);
	--header-search-color: var(--text);

	--header-menu-background: #fff;
	--header-menu-color-text: var(--text);
	--header-menu-color-text-hover: var(--primary);
	--header-menu-mobile-color-text: var(--text);
	--header-menu-icon-color: currentColor;
	--header-menu-mobile-icon-color: currentColor;
	--header-menu-font-size: 14px;
	--header-menu-text-height: 46px;
	--header-menu-font-weight: 500;
	/* header */

	/* footer */
	--footer-background-color: #fff;
	--footer-border-color: #DAD7D7;
	--footer-color-text: var(--text);
	--footer-color-text-secondary: var(--text-secondary);
	--footer-space: 40px;
	/* footer */

	/* fontes */
    --font-primary: 'Jost', Arial, sans-serif;
	/* fontes */
   
	/* botões */
    --btn-primary:var(--primary);
    --btn-primary-hover: var(--primary-hover);
    --btn-primary-active: var(--primary-active);
    --btn-secondary: var(--secondary);
    --btn-secondary-hover: var(--secondary-hover);
    --btn-secondary-active: var(--secondary-active);

    --btn-product-thumb:var(--green);
    --btn-product-thumb-hover: var(--green-hover);
    --btn-product-thumb-active: var(--green-active);
    --btn-product-thumb-color: #fff;
    --btn-product-thumb-radius: 4px;

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

	/* thumb */
	--thumb-product-title-color: var(--text-black);
	/* thumb */

	/* produto */
	--spacing-sections-product: 40px;	
	--spacing-product-column-right: 24px;
	--spacing-product-images: 8px;
	--product-row-x: 24px;
	--product-row-y: 24px;
	--product-images-x: 4px;
	--product-images-y: 4px;
	/* produto */
	
	/* variações */
	--variant-button-background-color: #fff;
	--variant-button-color: var(--text), #141414;
	--variant-button-border-color: #DAD7D7;
	--variant-button-selected-background-color: var(--primary);
	--variant-button-selected-color: #fff;
	--variant-button-selected-border-color: var(--primary);
	--variant-button-border-radius: var(--border-radius-default);
	/* variações */

	/* radius */
	--border-radius-default: 4px;
	--btn-border-radius: var(--border-radius-default);
	--input-border-radius: var(--border-radius-default);
	/* radius */
	
	/* geral */
	--products-gutter-x: 8px;
	--products-gutter-y: 8px;
	--product-thumb-spacing: 4px;
	--plyr-color-main: var(--primary);
	--spacing-sections-home: 40px;
    --text: #151414;
	--text-secondary: #505050;
    --text-black: #151414;
    --text-gray: #6A6262;
	--background: #fff;
	--background-secondary: #fff;
    --container-xxl: 1680px;
    --container-small: 1450px;
	--coupons-available-bg: #f7f7f7;
    --container-large: 1920px;
    --logo-max-height: 52px;
	@media (max-width: 991px) {
		--header-svg-width: 22px;
		--header-svg-height: 22px;

		--spacing-sections-home: 36px;
		--footer-space: 24px;
		--logo-max-height: 40px;
	}
	/* geral */
}

html { scroll-behavior: smooth; }
body { color: var(--text); font-family: var(--font-primary); font-size: 14px; overflow-x: hidden; }
a { color: var(--text); }
a:hover { color: var(--primary-active); }
.container { max-width: var(--container-xxl); }
.container-small { max-width: var(--container-small); }

/* Cabeçalho em três níveis, como na referência */
.top-bar { background: var(--background) !important; color: var(--text) !important; height: 94px; overflow: visible; padding: 0 !important; }
.top-bar > div, .top-bar > div > div { height: 100%; }
.fb-reference-top { background: #fff; width: 100%; }
.fb-offer { align-items: center; background: var(--secondary-active); color: #fff; display: flex; font-size: 15px; font-weight: 500; gap: 24px; height: 64px; justify-content: center; letter-spacing: -.01em; text-transform: uppercase; }
.fb-offer > span { max-width: 720px; text-align: center; }
.fb-offer > a { background: var(--primary); border: 1px solid #fff; border-radius: 8px; color: #fff; font-size: 12px; font-weight: 600; padding: 11px 17px; }
.fb-countdown { align-items: center; display: grid; grid-template-columns: 26px 11px 26px 11px 26px; grid-template-rows: 23px 14px; line-height: 1; min-width: 122px; text-align: center; }
.fb-countdown b { font-size: 19px; grid-row: 1; }
.fb-countdown i { font-size: 18px; font-style: normal; grid-row: 1; }
.fb-countdown small { font-size: 10px; font-weight: 400; grid-row: 2; }
.fb-countdown small:nth-of-type(1) { grid-column: 1; }
.fb-countdown small:nth-of-type(2) { grid-column: 3; }
.fb-countdown small:nth-of-type(3) { grid-column: 5; }
.fb-utility { align-items: center; display: flex; height: 30px !important; justify-content: space-between; margin: 0 auto; max-width: var(--container-xxl); padding: 0 18px; }
.fb-utility nav { display: flex; gap: 24px; }
.fb-utility a { color: #7c7c7c; font-size: 12px; }

#header { background: #fff; box-shadow: 0 2px 7px rgba(0,0,0,.07); position: sticky; top: 0; z-index: 1000; }
#header > .container { max-width: var(--container-xxl); }
#header .header-wrapper { align-items: center; display: flex; height: 96px; justify-content: space-between; position: relative; }
#header .logo-wrapper { left: 50%; margin: 0; position: absolute; top: 50%; transform: translate(-50%,-50%); }
#header .logo-wrapper h1 { margin: 0; }
#header .logo { max-height: 76px; width: 255px; }
#header .header-search { flex: 0 0 390px; margin-right: auto; max-width: 390px; width: 390px; }
#header #searchDesktop .search { border: 1px solid var(--primary); border-radius: 24px; height: 44px; overflow: hidden; }
#header #searchDesktop input { font-size: 14px; padding-left: 18px; }
#header #searchDesktop .btn svg { color: var(--primary); height: 22px; width: 22px; }
#header .tracking, #header .header-contact { display: none !important; }
#header .header_account_info { margin-left: auto; }
#header .header-account-desktop .header-info-wrapper { display: none; }
#header .header-account-desktop .header-info, #header .cart-wrapper, #header .header-cart { color: var(--primary); }
#header .header-account-desktop svg, #header .cart-wrapper svg { height: 27px; width: 27px; }
#header .header-bottom { background: #fff; border: 0; height: 47px; }
#header .header-bottom > .container { max-width: 1900px; padding: 0 18px; }
#header .menu-categorias { border: 0 !important; height: 47px; }
#header .menu-categorias a { color: var(--text) !important; font-size: 12px; font-weight: 500; text-transform: uppercase; white-space: nowrap; }
#header .menu-smart-item-level-1.is-active > .menu-smart-link-level-1 {
  background: var(--primary);
  color: #fff !important;
  height: 30px;
}
#header .menu-smart-submenu {
  background: var(--primary);
  border-radius: 0;
  box-shadow: 0 5px 10px rgba(0,0,0,.12);
  min-width: 190px;
}
#header .menu-smart-submenu-content { max-height: none; }
#header .menu-smart-level-2-wrapper { margin: 0; overflow: visible; }
#header .menu-smart-submenu-categories {
  gap: 0;
  max-height: none;
  min-width: 190px;
  padding: 0;
}
#header .menu-smart-submenu .menu-smart-link {
  color: #fff !important;
  font-size: 12px;
  font-weight: 500;
  line-height: 17px;
  min-height: 37px;
  padding: 10px 20px;
  text-transform: uppercase;
}
#header .menu-smart-submenu .menu-smart-link:hover,
#header .menu-smart-submenu .menu-smart-link:focus { background: rgba(255,255,255,.12); }

.fb-profit-strip { align-items: center; background: var(--primary); color: #fff; display: flex; font-size: 14px; font-weight: 600; height: 38px; justify-content: center; text-transform: uppercase; width: 100%; }

/* Vídeo principal e slideshow comercial */
#common-home .top-bar-marquee + .slideshow { margin: -40px 0 0; }
#common-home .slideshow .swiper { width: 100%; }
#common-home .slideshow-link, #common-home .slideshow-video-wrapper { display: block; width: 100%; }
#common-home .slideshow-video-wrapper { aspect-ratio: 1920 / 714; background: var(--secondary); }
#common-home .slideshow-video-wrapper video { display: block; height: 100%; object-fit: cover; width: 100%; }
#common-home .top-bar-marquee + .slideshow .vowt-prev,
#common-home .top-bar-marquee + .slideshow .vowt-next,
#common-home .top-bar-marquee + .slideshow .vowt-pagination { display: none; }
#common-home .slideshow + .slideshow { margin-top: -40px; }
#common-home .slideshow + .slideshow .slideshow-picture,
#common-home .slideshow + .slideshow .slideshow-picture img { display: block; width: 100%; }
#common-home .slideshow + .slideshow .slideshow-picture img { aspect-ratio: 1920 / 700; height: auto; object-fit: cover; }
#common-home .banners-large { margin: 48px 0 0; padding: 0; }
#common-home .carousel-categories + .banners-large { margin-top: 48px; }
#common-home .banners-large .container { max-width: none; padding: 0 15px; }
#common-home .banners-large img { display: block; height: auto; width: 100%; }

/* Marquee comercial nativo */
.top-bar-marquee {
  background: var(--secondary-active);
  color: #fff;
  height: 38px;
  margin-top: -40px;
  overflow: hidden;
  width: 100%;
}
.top-bar-marquee .swiper,
.top-bar-marquee .swiper-wrapper,
.top-bar-marquee .swiper-slide { height: 100%; }
.top-bar-marquee .swiper-slide { align-items: center; }
.top-bar-marquee .swiper-slide-content {
  align-items: center;
  color: #fff;
  display: flex;
  font-size: 12px;
  font-weight: 600;
  line-height: 1;
  text-transform: uppercase;
  white-space: nowrap;
}
.top-bar-marquee .swiper-slide-content::after {
  background: #fff;
  height: 6px;
  margin-left: 52px;
  margin-right: 52px;
  width: 6px;
}

.section-marquee { background: var(--background); border-bottom: 1px solid var(--gray); border-top: 1px solid var(--gray); color: var(--text); height: 39px; overflow: hidden; }
.section-marquee .swiper, .section-marquee .swiper-wrapper, .section-marquee .swiper-slide { height: 100%; }
.section-marquee .swiper-slide { align-items: center; display: flex; gap: 30px; width: auto; }
.section-marquee .swiper-slide-content { align-items: center; display: flex; font-size: 12px; font-weight: 600; gap: 24px; text-transform: uppercase; white-space: nowrap; }
.section-marquee .swiper-slide-content::after { content: "●"; font-size: 7px; }

/* Categorias */
.carousel-categories { padding: 64px 0 55px; }
.carousel-categories .container { max-width: 1780px; }
.carousel-categories .heading-title { font-size: 30px; font-weight: 500; letter-spacing: .27em; margin-bottom: 8px; text-align: center; }
.carousel-categories .heading-title::after { content: "Conheça as categorias mais procuradas por nossas clientes."; display: block; font-size: 15px; font-weight: 500; letter-spacing: 0; margin-top: 8px; text-transform: none; }
.carousel-categories .wrapper-bg-image { background: #fff !important; }
.carousel-categories .wrapper-bg-image img { aspect-ratio: 1 / 1; object-fit: contain; width: 100%; }
.carousel-categories .bg-item-category { display: none; }
.carousel-categories-title { color: #222; font-size: 27px; font-weight: 400; letter-spacing: .02em; margin-top: 2px; text-transform: uppercase; }

/* Números da marca */
.fb-stats { align-items: stretch; display: grid; gap: 0; grid-template-columns: repeat(3,1fr); margin: 72px auto 82px; max-width: 1680px; padding: 0 32px; }
.fb-stats > div { align-items: center; display: flex; flex-direction: column; justify-content: center; min-height: 160px; text-align: center; }
.fb-stats > div + div { border-left: 1px solid #ddc8a8; }
.fb-stats strong { font-size: clamp(44px,4.2vw,78px); font-weight: 700; line-height: 1; }
.fb-stats span { color: var(--primary); font-size: clamp(26px,2.3vw,44px); font-weight: 400; line-height: 1.1; margin-top: 20px; }

/* Vitrines */
.product-list { background: var(--background) !important; padding: 42px 0 54px; }
.product-list .container { max-width: 1840px; padding-left: 34px; padding-right: 34px; }
.heading-title-wrapper { margin-bottom: 25px; text-align: center; }
.heading-title { color: var(--text) !important; font-size: 29px; font-weight: 500; letter-spacing: .28em; line-height: 1.25; text-transform: uppercase; }
.product-list-description { color: #111 !important; font-size: 14px; }
.product-list-carousel-bg .product-list-description, .product-list-carousel-bg .product-list-link a { color: #111 !important; }
.product-thumb { background: var(--gray-light); border: 0 !important; border-radius: 0 !important; box-shadow: none !important; display: flex; flex-direction: column; height: 100%; overflow: hidden; padding: 8px 8px 12px; }
.product-thumb-top { flex: 0 0 auto; }
.product-thumb .image, .product-thumb .images { background: #fff; }
.product-thumb .images { aspect-ratio: 3 / 4; overflow: hidden; }
.product-thumb .images img, .product-thumb .images video { height: 100%; object-fit: contain; width: 100%; }
.product-thumb-center { min-height: 122px; padding: 16px 14px 5px !important; }
.product-thumb-title { font-size: 14px !important; font-weight: 400 !important; line-height: 1.25; min-height: 36px; }
.product-thumb .product-price-value { color: #111 !important; font-size: 17px; font-weight: 600; }
.product-thumb .product-pix-value, .product-thumb .product-pix-text { color: var(--green) !important; font-size: 16px; font-weight: 600; }
.product-thumb .product-pix-icon { color: var(--green); }
.product-short-installments { color: var(--text-gray); font-size: 11px; }
.product-thumb-bottom { margin-top: auto; padding: 8px 14px 0 !important; }
.product-thumb .btn-product-thumb { background: var(--btn-product-thumb); }
.product-thumb .btn-product-thumb-view { margin-bottom: 7px; }
.product-thumb .product-thumb-input-quantity { display: none; }
.product-thumb .bootstrap-touchspin { max-width: 92px; }
.product-list-link { margin-top: 26px; text-align: center; }

/* Vídeo Commerce oficial da plataforma */
#common-home .video-commerce { background: var(--gray-light); padding: 48px 0 52px; }
#common-home .video-commerce-carousel > .container-fluid { max-width: 1880px; padding: 0 18px; }
#common-home .video-commerce-carousel__heading { text-align: center; }
#common-home .video-commerce-carousel__heading .heading-title { color: var(--primary) !important; font-size: 27px; letter-spacing: 0; margin-bottom: 35px; }
#common-home .video-commerce-carousel__media { border-radius: 12px; }
#common-home .video-commerce--border { --video-commerce-border-size: 2px; --video-commerce-border-gap: 0px; }
#common-home .video-commerce-carousel__nav { background: rgba(24,29,43,.8); border-radius: 50%; color: #fff; height: 44px; width: 44px; }

.product-column-right .video-commerce .heading-title {
	font-size: 14px;
}

/* Loja física */
.fb-store { display: grid; gap: 30px; grid-template-columns: 1fr 1fr; margin: 74px auto 0; max-width: 1680px; padding: 0 20px; }
.fb-store-photo { height: 710px; overflow: hidden; }
.fb-store-photo img { height: 100%; object-fit: cover; width: 100%; }
.fb-store-info { background: #f4f4f4; padding: 32px; }
.fb-store-info > span { font-size: 14px; letter-spacing: .25em; }
.fb-store-info > span i { color: var(--primary); }
.fb-store-info h2 { font-size: 42px; font-weight: 600; margin: 20px 0 28px; }
.fb-store-info iframe { border: 0; height: 510px; width: 100%; }
.fb-store-actions { display: grid; grid-template-columns: 1fr 1fr; margin-top: 0; }
.fb-store-actions a { background: #fff; font-weight: 600; padding: 14px; text-align: center; }
.fb-store-info p { margin: 22px 0 0; text-align: center; }
#common-home .banners-large:last-child { margin-top: 10px; }
#common-home .banners-large:last-child .container { padding-left: 7px; padding-right: 7px; }
#common-home .banners-large:last-child img { border-radius: 0; }

/* Rodapé */
.section-newsletter { background: var(--primary) !important; color: #fff; padding: 34px 0 !important; }
.section-newsletter .heading-title { color: #fff !important; font-size: 25px; }
.section-newsletter .newsletter-fields { align-items: end; }
.section-newsletter .btn-newsletter { background: #fff !important; color: #9d753b !important; }
footer { background: #f1f1f1 !important; color: #333; }
footer .footer-content { background: transparent !important; }

@media (max-width: 1199px) {
  #header .header-search { flex-basis: 310px; max-width: 310px; width: 310px; }
  #header .menu-categorias a { font-size: 10px; }
  .carousel-categories-title { font-size: 21px; }
}

@media (max-width: 991px) {
  body { font-size: 13px; padding-bottom: 0; }
  .top-bar { height: 42px; }
  .fb-offer { height: 42px; padding: 0 8px; }
  .fb-offer > span { font-size: 9px; line-height: 1.1; max-width: 180px; }
  .fb-offer > a { border-radius: 4px; font-size: 9px; padding: 7px 8px; }
  .fb-countdown { grid-template-columns: 20px 6px 20px 6px 20px; min-width: 72px; }
  .fb-countdown b { font-size: 13px; }
  .fb-countdown i { font-size: 12px; }
  .fb-countdown small { font-size: 7px; }
  .fb-utility { display: none; }
  #header { height: 60px; }
  #header .header-wrapper { height: 60px; padding: 0 4px; }
  #header .logo-wrapper { left: 50%; }
  #header .logo { max-height: 43px; width: 118px; }
  #header .header-search { flex: 0 0 auto; margin-left: auto; margin-right: 5px; max-width: none; width: auto; }
  #header .header-bottom { display: none; }
  #header .button-canvas-mobile, #header .header-account-mobile-icon { color: var(--primary); }
  .fb-profit-strip { font-size: 9px; height: 30px; }
  #common-home .slideshow-video-wrapper { aspect-ratio: 16 / 9; }
  #common-home .slideshow + .slideshow .slideshow-picture img { aspect-ratio: 768 / 1000; }
  #common-home .banners-large .container { padding: 0; }
  #common-home .banners-large .row { margin-left: 0; margin-right: 0; }
  #common-home .banners-large .col-12 { padding-left: 0; padding-right: 0; }
  #common-home .banners-large img { min-height: 112px; object-fit: cover; }
  #common-home .carousel-categories + .banners-large { margin-top: 30px; }
  .section-marquee { height: 32px; }
  .section-marquee .swiper-slide-content { font-size: 9px; }
  .top-bar-marquee { height: 32px; margin-top: -36px; }
  .top-bar-marquee .swiper-slide-content { font-size: 9px; }
  .top-bar-marquee .swiper-slide-content::after { margin-left: 28px; margin-right: 28px; }
  #common-home .top-bar-marquee + .slideshow { margin-top: -36px; }
  #common-home .slideshow + .slideshow { margin-top: -36px; }
  .carousel-categories { padding: 40px 0 36px; }
  .carousel-categories .container { padding: 0 15px; }
  .carousel-categories .heading-title { font-size: 20px; letter-spacing: .2em; }
  .carousel-categories .heading-title::after { font-size: 11px; }
  .carousel-categories-title { font-size: 15px; }
  .fb-stats { margin: 38px auto 45px; padding: 0 8px; }
  .fb-stats > div { min-height: 86px; padding: 0 4px; }
  .fb-stats strong { font-size: 20px; }
  .fb-stats span { font-size: 12px; margin-top: 10px; }
  .product-list { padding: 32px 0 38px; }
  .product-list .container { padding-left: 14px; padding-right: 14px; }
  .heading-title-wrapper { margin-bottom: 18px; }
  .heading-title { font-size: 20px; letter-spacing: .22em; }
  .product-list-description { font-size: 11px; }
  .product-thumb { padding: 5px 5px 8px; }
  .product-thumb-center { min-height: 130px; padding: 10px 7px 3px !important; }
  .product-thumb-title { font-size: 11px !important; min-height: 42px; }
  .product-thumb .product-price-value { font-size: 13px; }
  .product-thumb .product-pix-value, .product-thumb .product-pix-text { font-size: 12px; }
  .product-short-installments { font-size: 9px; }
  .product-thumb-bottom { padding: 7px 7px 0 !important; }
  .product-thumb .btn-product-thumb { font-size: 9px; min-height: 34px; }
  .product-thumb .bootstrap-touchspin { display: none; }
  .video-commerce { padding: 35px 0 40px; }
  .video-commerce-carousel__heading .heading-title { font-size: 20px; margin-bottom: 22px; }
  .video-commerce-carousel > .container-fluid { padding: 0 12px; }
  .fb-store { display: block; margin: 45px auto 0; padding: 0 14px; }
  .fb-store-photo { height: 430px; }
  .fb-store-info { padding: 24px 14px; }
  .fb-store-info h2 { font-size: 30px; margin: 14px 0 20px; }
  .fb-store-info iframe { height: 330px; }
  .fb-store-actions a { font-size: 11px; padding: 12px 4px; }
  .fb-store-info p { font-size: 11px; }
  #common-home .banners-large:last-child { margin-top: 0; }
  #common-home .banners-large:last-child .container { padding-left: 0; padding-right: 0; }
  .section-newsletter { padding: 28px 14px !important; }
  .section-newsletter .heading-title { font-size: 20px; }
}
