/* reset by rafaux */
* { margin: 0px; padding: 0px; border: 0px; font-weight: normal; font-size: 100%; list-style: none; line-height: 1; outline: 0px; background: none; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; text-rendering: optimizeLegibility; -webkit-font-smoothing: antialiased; -moz-font-smoothing: antialiased; -ms-font-smoothing: antialiased; -o-font-smoothing: antialiased; font-smoothing: antialiased; }

/* var */
:root { --blue: #213b87; --blue2: #4366D0; --cyan: #97B9E2; --gray: #777; --white: #ccc; }

/* global class */
.block { position: relative; float: left; width: 100%; height: auto; padding: 60px 0px; }
.container { display: block; width: 1300px; height: auto; margin: 0px auto; }

/* base */
a { text-decoration: none; color: var(--blue); transition: all .5s ease; }
body { background-color: #fff; color: var(--blue); font: normal 16px 'Ubuntu', sans-serif; }
input, textarea, select, button { font: normal 16px 'Ubuntu', sans-serif; appearance: none; -webkit-appearance: none; border-radius: 0px; cursor: pointer; }
input[type=submit], button { transition: all .5s ease; }
img { pointer-events: none; }

/* header */
#header { position: absolute; z-index: 10; top: 0px; left: 0px; width: 100%; height: 140px; background-color: #fff; }
#header span.logo { float: left; width: 280px; height: auto; margin-top: 24px; }
#header span.logo img { display: block; width: 100%; height: auto; }
#header nav { float: left; width: auto; margin: 58px 0px 0px 62px; }
#header nav li { float: left; width: auto; text-transform: uppercase; font-size: 14px; }
#header nav li a { position: relative; display: block; padding: 0px 20px; color: var(--gray); }
#header nav li a::after { position: absolute; top: 50%; right: 0px; width: 5px; height: 5px; background-color: #ddd; border-radius: 100%; transform: translateY(-50%); content: ''; }
#header nav li:last-of-type a::after { display: none; }
#header nav li a:hover { color: var(--blue); }
#header span.right { float: right; display: flex; width: auto; margin-top: 34px; align-items: center; gap: 15px; }
#header span.right a.tele { display: block; width: 200px; height: 68px; padding-top: 7px; border-radius: 58px; background-color: var(--blue); color: #fff; text-align: center; }
#header span.right a.tele small { display: block; font-size: 10px; }
#header span.right a.tele small:first-of-type { text-transform: uppercase; }
#header span.right a.tele strong { display: block; margin: 4px 0px; font-weight: bold; font-size: 20px; }
#header span.right a.clie { width: auto; height: 68px; padding: 0px 20px; background-color: var(--blue2); border-radius: 68px; line-height: 60px; color: #fff; font-size: 14px; font-weight: bold; }
#header span.right a.clie i { display: inline-block; margin-right: 5px; font-size: 24px; vertical-align: middle; }
#header span.right a:hover { background-color: var(--blue2); }

    /* header -> head */
    header.head h6 { display: block; margin-bottom: 40px; text-align: center; font-weight: bold; font-size: 20px; letter-spacing: 6px; text-transform: uppercase; }

    /* header -> toggle */
    #header b { display: none; position: absolute; top: 27px; right: 20px; width: 20px; height: 30px; border-top: 3px solid var(--blue); transition: all .5s ease; cursor: pointer; }
    #header b::before { position: absolute; top: 5px; left: 0px; width: 100%; height: 3px; background-color: var(--blue); transition: all .5s ease; content: ''; }
    #header b::after { position: absolute; top: 13px; left: 0px; width: 100%; height: 3px; background-color: var(--blue); transition: all .5s ease; content: ''; }
    #header b.on { border-top: transparent; }
    #header b.on::before { top: 8px; transform: rotate(45deg); }
    #header b.on::after { top: 8px; transform: rotate(-45deg); }

/* feat */
#feat { position: relative; height: calc(100vh - 140px); margin-top: 140px; padding: 0px !important; background-color: #000; }
#feat::before { position: absolute; z-index: 3; top: 0px; left: 0px; width: 20px; height: 100%; background-color: var(--blue); content: ''; }
#feat::after { position: absolute; z-index: 3; top: 0px; right: 0px; width: 20px; height: 100%; background-color: var(--blue); content: ''; }
#feat section { position: absolute; top: 0px; left: 0px; width: 100%; height: calc(100vh - 140px); }
#feat section figure img { width: 100%; height: calc(100vh - 140px); object-fit: cover; }
#feat ul.slick-dots { position: absolute; bottom: 30px; left: 50%; width: auto; transform: translateX(-50%); text-align: center; }
#feat ul.slick-dots li { display: inline-block; width: 14px; height: 14px; margin: 0px 10px; border: 2px solid var(--blue2); border-radius: 100%; text-indent: -9999em; cursor: pointer; }
#feat ul.slick-dots li.slick-active { background-color: var(--blue2) !important; }

/* cover */
#cover { position: relative; height: auto; margin-top: 140px; padding: 0px; }
#cover::before { position: absolute; z-index: 3; top: 0px; left: 0px; width: 20px; height: 100%; background-color: var(--blue); content: ''; }
#cover::after { position: absolute; z-index: 3; top: 0px; right: 0px; width: 20px; height: 100%; background-color: var(--blue); content: ''; }
#cover img { float: left; width: 100%; height: auto; }

/* filters */
#filters { padding: 60px 0px; background-color: var(--blue); }
#filters::before { position: absolute; z-index: 3; top: 0px; left: 0px; width: 20px; height: 100%; background-color: var(--cyan); content: ''; }
#filters::after { position: absolute; z-index: 3; top: 0px; right: 0px; width: 20px; height: 100%; background-color: var(--cyan); content: ''; }
#filters header.head h6 { color: #fff; }
#filters section { display: inline-block; width: 100%; height: auto; padding: 40px; border: 1px solid rgba(255,255,255,.5); border-radius: 20px; }
#filters nav ul { display:  grid; grid-template-columns: 1fr 1fr 1fr; grid-gap: 30px; }
#filters nav ul li a { display: block; color: #fff; font-weight: bold; opacity: .5; }
#filters nav ul li a img { display: inline-block; width: 25px; margin-right: 8px; vertical-align: middle; }
#filters nav ul li a.on,
#filters nav ul li a:hover { opacity: 1; }

/* product cover */
#product-cover { z-index: 2; min-height: 600px; margin-top: 140px; margin-bottom: 100px; background-color: #CDD9E8; }
#product-cover::before { position: absolute; z-index: 3; top: 0px; left: 0px; width: 20px; height: 100%; background-color: var(--blue); content: ''; }
#product-cover::after { position: absolute; z-index: 3; top: 0px; right: 0px; width: 20px; height: 100%; background-color: var(--blue); content: ''; }
#product-cover figure img { position: absolute; top: 50%; left: 50%; width: auto; max-width: 520px; height: auto; margin-left: -600px; transform: translateY(-50%); }
#product-cover section { position: absolute; top: 50%; right: 50%; width: 320px; height: auto; margin-right: -350px; transform: translateY(-50%); }
#product-cover section img { position: absolute; top: 0px; left: -100px; width: 80px; height: auto; }
#product-cover section h1 { display: block; font-weight: bold; font-size: 48px; }
#product-cover section p { display: block; margin-top: 20px; line-height: 1.6; }

/* single */
#single section { display: inline-block; width: 100%; height: auto; margin-bottom: 20px; padding: 40px; background-color: #E5EDF9; border-radius: 20px; }
#single section header h6 { display: block; margin-bottom: 30px; font-weight: bold; font-size: 20px; }
#single section header em { display: inline-block; width: 100%; height: auto; margin-bottom: 40px; font-style: normal; }
#single section header strong { display: inline-block; width: 100%; height: auto; min-height: 30px; margin-bottom: 10px; padding-left: 30px; background: transparent url('../img/arrow-right.svg') no-repeat; background-size: 20px; font-weight: 600; }
#single section nav li { display: inline-block; width: 100%; height: auto; min-height: 30px; margin-bottom: 10px; padding-left: 30px; background: transparent url('../img/arrow-right.svg') no-repeat; background-size: 20px; line-height: 1.4; }
#single section span { display: inline-block; width: 100%; padding: 12px 30px; }
#single section span strong { float: left; width: auto; font-size: 14px; }
#single section span em { float: right; width: auto; text-align: right; font-style: normal; font-size: 14px; }
#single section span:nth-of-type(odd) { background-color: #CFDCF2; }
#single .box-videos .item { display: block; padding: 20px; background-color: #E5EDF9; border-radius: 20px; }
#single .box-videos .item h5 { display: block; margin-bottom: 20px; font-weight: bold; font-size: 20px; }
#single .box-videos .item p { display: block; margin-bottom: 20px; line-height: 1.6; }
#single .box-videos .slick-dots { display: block; width: 100%; margin-top: 20px; text-align: center; }
#single .box-videos .slick-dots li { display: inline-block; width: 10px; height: 10px; margin: 0px 10px; border: 2px solid var(--blue2); text-indent: -9999em; cursor: pointer; border-radius: 20px; transition: all .5s ease; }
#single .box-videos .slick-dots li.slick-active { width: 25px; background-color: var(--blue2); }
#single iframe { display: block; width: 100%; height: 400px; margin: 40px auto; border-radius: 20px; }
#single footer { display: inline-block; width: 100%; height: auto; margin-top: 40px; text-align: center; }
#single footer span a { display: inline-block; width: auto; padding: 20px; border: 1px solid var(--blue); border-radius: 60px; }
#single footer span a:hover { background-color: var(--cyan); }
#single footer span a i { display: inline-block; width: auto; margin-right: 10px; vertical-align: middle; font-size: 24px; }
#single footer span a img { display: inline-block; width: 26px; height: auto; margin-right: 10px; vertical-align: middle; }

/* search */
#search input { display: inline-block; width: 100%; height: 60px; padding: 0px 20px 0px 60px; border-radius: 40px; border: 1px solid var(--blue); background: #fff url('../img/arrow-right.svg') no-repeat 24px center; background-size: 20px; color: var(--blue); }
#search input::placeholder { color: var(--white); }
#search section { position: relative; display: inline-block; width: 100%; height: auto; margin-top: 40px; padding: 40px; border: 1px solid var(--blue); border-radius: 20px; }
#search section::before { position: absolute; top: -20px; left: 50%; width: 50px; height: 20px; background: transparent url('../img/search-arrow-top.png') no-repeat; background-size: contain; transform: translateX(-50%); content: ''; }
#search section ul { display: grid; grid-template-columns: 1fr 1fr 1fr; grid-gap: 30px; }
#search section nav ul li a { display: block; font-weight: bold; }
#search section nav ul li img { display: inline-block; width: 25px; margin-right: 8px; vertical-align: middle; }

/* cats */
#cats { background-color: var(--blue); }
#cats::before { position: absolute; z-index: 3; top: 0px; left: 0px; width: 20px; height: 100%; background-color: var(--cyan); content: ''; }
#cats::after { position: absolute; z-index: 3; top: 0px; right: 0px; width: 20px; height: 100%; background-color: var(--cyan); content: ''; }
#cats nav ul { display: inline-block; width: 100%; height: auto; text-align: center; }
#cats nav ul li { display: inline-block; width: 120px; height: auto; margin: 0px 20px; padding-top: 20px; }
#cats nav ul li figure { position: relative; display: block; width: 100px; height: 100px; margin: 0px auto; border-radius: 20px; background-color: rgba(255,255,255,.8); transition: all .5s ease; }
#cats nav ul li:hover figure { background-color: #fff; }
#cats nav ul li figure::before { position: absolute; top: -6px; left: -6px; width: 110px; height: 110px; border: 1px solid #fff; border-radius: 20px; content: ''; }
#cats nav ul li figure img { position: absolute; top: 50%; left: 50%; width: auto; max-width: 50%; height: auto; max-height: 50%; transform: translate(-50%, -50%); }
#cats nav ul li strong { display: block; margin-top: 20px; font-size: 12px; text-transform: uppercase; color: #fff; }
#cats ul.slick-dots { display: inline-block; width: 100%; height: auto; margin-top: 20px; text-align: center; }
#cats ul.slick-dots li { display: inline-block; width: 14px; height: 14px; margin: 0px 10px; padding-top: 0px; border: 2px solid var(--white); border-radius: 100%; text-indent: -9999em; cursor: pointer; }
#cats ul.slick-dots li.slick-active { background-color: var(--white); }
#cats ul.slick-dots li:only-child { display: none; }

/* search cover */
#search-cover { margin-top: 140px; background-color: var(--cyan); text-align: center; }
#search-cover::before { position: absolute; z-index: 3; top: 0px; left: 0px; width: 20px; height: 100%; background-color: var(--blue); content: ''; }
#search-cover::after { position: absolute; z-index: 3; top: 0px; right: 0px; width: 20px; height: 100%; background-color: var(--blue); content: ''; }
#search-cover strong { font-weight: bold; font-size: 60px; color: var(--blue); }
#search-cover strong img { display: inline-block; width: 60px; vertical-align: middle; }

/* linhas */
#linhas section article { display: inline-block; width: 100%; height: auto; margin-bottom: 20px; padding: 20px; background-color: #E5EDF9; border-radius: 20px; }
#linhas section article figure { position: relative; float: left; width: 250px; height: 250px; border-radius: 100%; background-color: #fff; }
#linhas section article figure img { position: absolute; top: 50%; left: 50%; width: auto; max-width: 100%; height: auto; max-height: 100%; padding: 20px; transform: translate(-50%, -50%); }
#linhas section article figcaption { position: relative; float: left; width: calc(100% - 250px); height: 300px; padding-left: 40px; }
#linhas section article figcaption h1 { display: block; margin-top: 30px; font-weight: bold; font-size: 20px; }
#linhas section article figcaption p { display: block; margin-top: 30px; line-height: 1.6; }
#linhas section article figcaption span.more a { position: absolute; bottom: 30px; font-weight: bold; font-size: 12px; }
#linhas section article figcaption span.more a img { display: inline-block; width: 30px; height: auto; margin-right: 10px; vertical-align: middle; }
#linhas section article figcaption span.whatsapp a { position: absolute; bottom: 20px; right: 20px; width: auto; padding: 10px 20px; background-color: #25d366; color: #fff; font-weight: bold; border-radius: 30px; font-weight: bold; font-size: 12px; }
#linhas section article figcaption span.whatsapp a i { display: inline-block; margin-right: 5px; font-size: 18px; vertical-align: sub; }
#linhas section article figcaption span.whatsapp a:hover { background-color: #65BC54; }

    /* linhas -> especial */
    #linhas.esp { padding-top: 0px; }
    #linhas.esp section article { background-color: #FEEDD8; }

/* list */
#list section { display: grid; grid-template-columns: 1fr 1fr 1fr; padding: 20px; background-color: #e5edf9; border-radius: 20px; }
#list section article { padding: 60px; border-right: 2px dashed var(--cyan); border-bottom: 2px dashed var(--cyan); }
#list section article:nth-of-type(3n) { border-right: none; }
#list section article:nth-last-child(1),
#list section article:nth-last-child(2),
#list section article:nth-last-child(3) { border-bottom: none; }
#list section article figure { position: relative; display: inline-block; width: 100%; height: 200px; }
#list section article figure img { display: block; width: auto; max-width: 100%; height: 200px; margin-bottom: 20px; object-fit: contain; }
#list section article figure sub { position: absolute; bottom: 30px; right: 30px; width: 80px; height: 80px; padding-top: 22px; background-color: var(--blue); color: #fff; border-radius: 100%; font-weight: bold; font-size: 12px; text-transform: uppercase; text-align: center; }
#list section article figure sub::after { display: block; margin-top: 5px; font-family: 'Font Awesome 5 Pro'; content: '\f141'; }
#list section article h1 { display: block; font-weight: 300; font-size: 30px; line-height: 1.4; }
#list section article h1 strong { font-weight: bold; }
#list section article p { display: block; margin: 20px 0px; line-height: 1.6; }
#list section article span { display: inline-block; width: auto; font-weight: bold; }
#list section article span img { display: inline-block; width: 30px; margin-right: 10px; vertical-align: middle; }

/* products */
#products section { padding: 0px 100px; }
#products section article { display: block; text-align: center; }
#products section article figure { position: relative; display: block; width: 180px; height: 180px; margin: 10px auto 40px auto; border-radius: 100%; }
#products section article figure::before { position: absolute; top: -10px; left: -10px; width: 200px; height: 200px; border: 1px solid var(--blue); border-radius: 100%; content: ''; }
#products section article figure img { position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; border-radius: 100%; object-fit: cover; }
#products section article figure sub { position: absolute; bottom: -20px; right: -30px; width: 80px; height: 80px; padding-top: 22px; background-color: var(--blue); color: #fff; border-radius: 100%; font-weight: bold; font-size: 12px; text-transform: uppercase; }
#products section article figure sub::after { display: block; margin-top: 5px; font-family: 'Font Awesome 5 Pro'; content: '\f141'; }
#products section article strong img { display: block; width: auto; max-width: 80%; margin: 20px auto 0px auto; }
#products section .arrow { position: absolute; top: 50%; transform: translateY(-50%); }
#products section .arrow.prev { left: 0px; }
#products section .arrow.next { right: 0px; }

/* quem somos */
#quem-somos { margin-top: 80px; }
#quem-somos header strong { display: inline-block; width: 100%; height: auto; padding: 60px 0px; background-color: var(--blue); color: #fff; text-align: center; font-weight: bold; font-size: 36px; }
#quem-somos p { display: block; margin-top: 30px; line-height: 2; }
#quem-somos iframe { display: block; width: 100%; height: 300px; margin: 40px auto; }
#quem-somos footer { display: inline-block; width: 100%; height: auto; margin-top: 60px; text-align: center; }
#quem-somos footer span { display: inline-block; width: auto; margin: 0px 10px; }
#quem-somos footer span a { display: inline-block; width: auto; padding: 16px 20px; background-color: var(--blue2); color: #fff; font-weight: bold; border-radius: 30px; font-weight: bold; }
#quem-somos footer span a i { display: inline-block; margin-right: 5px; font-size: 20px; vertical-align: middle; }
#quem-somos footer span a:hover { background-color: var(--blue); }

/* videos */
#videos { margin-top: 80px; }
#videos header strong { display: inline-block; width: 100%; height: auto; padding: 60px 0px; background-color: var(--blue); color: #fff; text-align: center; font-weight: bold; font-size: 36px; }
#videos h6 { display: block; margin: 40px 0px 20px 0px; font-weight: bold; text-transform: uppercase; }
#videos .group { display: block; padding: 20px; background-color: #E5EDF9; border-radius: 20px; }
#videos .group .item { display: block; margin: 0px 20px; text-align: center; }
#videos .group .item iframe { display: block; width: 100%; height: 200px; margin-bottom: 20px; border-radius: 20px; }
#videos .group .item strong { display: block; font-weight: bold; line-height: 1.6; }
#videos .group .item p { font-size: 14px; line-height: 1.4; }
#videos .slick-dots { display: block; width: 100%; margin-top: 20px; text-align: center; }
#videos .slick-dots li { display: inline-block; width: 10px; height: 10px; margin: 0px 10px; border: 2px solid var(--blue2); text-indent: -9999em; cursor: pointer; border-radius: 20px; transition: all .5s ease; }
#videos .slick-dots li.slick-active { width: 25px; background-color: var(--blue2); }
#videos .slick-dots li:only-child { display: none; }

/* instagram */
#instagram { background-color: var(--blue); }
#instagram::before { position: absolute; z-index: 3; top: 0px; left: 0px; width: 20px; height: 100%; background-color: var(--cyan); content: ''; }
#instagram::after { position: absolute; z-index: 3; top: 0px; right: 0px; width: 20px; height: 100%; background-color: var(--cyan); content: ''; }
#instagram header.head h6 { color: #fff; }

/* partners */
#partners section { padding: 0px 100px; }
#partners section article figure { position: relative; display: block; width: 100%; height: 100px; }
#partners section article figure img { position: absolute; top: 50%; left: 50%; width: auto; max-width: 80%; height: auto; max-height: 100%; transform: translate(-50%, -50%); filter: grayscale(100%); opacity: .4; transition: all .5s ease; }
#partners section article:hover figure img { opacity: 1; filter: grayscale(0%); }
#partners section .arrow { position: absolute; top: 50%; transform: translateY(-50%); }
#partners section .arrow.prev { left: 0px; }
#partners section .arrow.next { right: 0px; }

/* contact */
#contact label { float: left; width: 100%; height: auto; margin-bottom: 30px; padding: 0px 10px; text-align: center; }
#contact label.lb50 { width: 50%; }
#contact label strong { display: block; margin-bottom: 20px; }
#contact label input { display: inline-block; width: 100%; height: 60px; padding: 0px 20px; border: 1px solid var(--blue); border-radius: 30px; }
#contact label textarea { display: inline-block; width: 100%; height: 160px; padding: 0px 20px; border: 1px solid var(--blue); border-radius: 20px; }
#contact label input[type=submit] { float: none; display: inline-block; width: 227px; padding-left: 40px; background: var(--blue) url('../img/arrow-right-white.svg') no-repeat 50px center; color: #fff; font-weight: bold; }
#contact footer { display: inline-block; width: 100%; height: auto; margin-top: 30px; text-align: center; }
#contact footer span { display: inline-block; width: 300px; vertical-align: top; }
#contact footer span a { font-weight: bold; }
#contact footer span i { display: block; margin-bottom: 20px; color: var(--blue); font-size: 40px; }
#contact footer span:first-of-type i { transform: rotate(-30deg); }
#contact footer span em { font-style: normal; }
#contact span.whats { display: inline-block; width: 100%; height: auto; margin: 20px 0px; text-align: center; }
#contact span.whats a { display: inline-block; width: auto; padding: 16px 20px; background-color: #25d366; color: #fff; font-weight: bold; border-radius: 30px; font-weight: bold; }
#contact span.whats a i { display: inline-block; margin-right: 5px; font-size: 20px; vertical-align: middle; }
#contact span.whats a:hover { background-color: #65BC54; }

/* bar cliente */
#bar-cliente { padding: 20px 0px; background-color: var(--blue2); text-align: center; }
#bar-cliente a { display: block; font-size: 14px; color: #fff; text-decoration: underline; }

/* footer */
#footer { padding: 60px 0px; background-color: var(--blue); text-align: center; }
#footer::before { position: absolute; z-index: 3; top: 0px; left: 0px; width: 20px; height: 100%; background-color: var(--cyan); content: ''; }
#footer::after { position: absolute; z-index: 3; top: 0px; right: 0px; width: 20px; height: 100%; background-color: var(--cyan); content: ''; }
#footer nav { display: inline-block; width: 100%; height: auto; text-align: center; }
#footer nav li { display: inline-block; width: auto; text-transform: uppercase; font-size: 12px; }
#footer nav li a { position: relative; display: block; padding: 0px 20px; color: #fff; }
#footer nav li a::after { position: absolute; top: 50%; right: -3px; width: 3px; height: 3px; background-color: #fff; border-radius: 100%; transform: translateY(-50%); content: ''; }
#footer nav li:last-of-type a::after { display: none; }
#footer nav li a:hover { text-decoration: underline; }
#footer span.logo { display: inline-block; width: 100%; height: auto; margin: 80px 0px 20px 0px; text-align: center; }
#footer span.logo img { display: inline-block; width: auto; max-width: 290px; height: auto; }
#footer small { display: block; color: var(--cyan); font-size: 10px; }

/* fixed */
#fixed { position: fixed; z-index: 20; top: 50%; right: 20px; width: 50px; transform: translateY(-50%); }
#fixed nav li a { display: block; width: 40px; height: 40px; margin-bottom: 10px; border-radius: 100%; color: #fff; text-align: center; line-height: 40px; }
#fixed nav li:nth-of-type(1) a { background-color: var(--blue); }
#fixed nav li:nth-of-type(2) a { background-color: var(--blue2); }
#fixed nav li:nth-of-type(3) a { background-color: #E30518; }

/* sidebar */
#sidebar { position: fixed; z-index: 100; top: 0px; left: -250px; width: 250px; height: 100vh; padding: 40px 0px; background-color: #fff; border-left: 20px solid var(--blue); box-shadow: 0px 10px 40px rgba(0,0,0,.3); transition: all .5s ease; }
#sidebar.on { left: 0px; }
#sidebar span.logo img { display: block; width: 160px; height: auto; margin: 0px auto 40px auto; }
#sidebar nav li a { display: block; padding: 15px 0px; text-align: center; font-weight: bold; font-size: 13px; text-transform: uppercase; }
#sidebar span.right { position: absolute; bottom: 20px; left: 50%; width: auto; transform: translateX(-50%); }
#sidebar span.right a { display: block; width: 200px; height: 68px; padding-top: 7px; border-radius: 58px; background-color: var(--blue); color: #fff; text-align: center; }
#sidebar span.right a small { display: block; font-size: 10px; }
#sidebar span.right a small:first-of-type { text-transform: uppercase; }
#sidebar span.right a strong { display: block; margin: 4px 0px; font-weight: bold; font-size: 20px; }
#sidebar span.right a:hover { background-color: var(--blue2); }
#sidebar span.clie a { position: absolute; bottom: 100px; left: 50%; width: 200px; height: 68px; transform: translateX(-50%); background-color: var(--blue2); color: #fff; font-weight: bold; text-align: center; border-radius: 68px; line-height: 62px; }
#sidebar span.clie a i { display: inline-block; margin-right: 10px; font-size: 20px; vertical-align: middle; }

/* wpcf7 */
.wpcf7 { position: relative; }
.wpcf7 br { display: none; }
.wpcf7-response-output { margin: 20px 0px !important; padding: 0px !important; border: none !important; text-align: center; font-weight: bold; }
.wpcf7 .ajax-loader { position: absolute !important; bottom: 0px; right: 0px; }

/* pagina /produtos/ */
body.page-template-page-produtos .produtos-cats-top { margin-top: 140px !important; }

/* secao "Todas as categorias" - 100% da largura da tela */
body.page-template-page-produtos #cats .container { width: 100%; max-width: 100%; padding: 0px 60px; }

#produtos-filtros.block { padding: 20px 0px; background-color: var(--blue); text-align: center; }
#produtos-filtros::before { position: absolute; z-index: 3; top: 0px; left: 0px; width: 20px; height: 100%; background-color: var(--cyan); content: ''; }
#produtos-filtros::after { position: absolute; z-index: 3; top: 0px; right: 0px; width: 20px; height: 100%; background-color: var(--cyan); content: ''; }
#produtos-filtros select { display: inline-block; width: 100%; max-width: 400px; height: 50px; padding: 0px 40px 0px 20px; border-radius: 40px; background: #fff url('../img/arrow-right.svg') no-repeat 95% center; background-size: 16px; color: var(--blue); font-weight: bold; }

/* produtos em cards - grid compacto, agrupados por categoria */
#produtos-atuais.block { padding: 30px 0px; }
#produtos-atuais .produtos-grupo { margin-bottom: 30px; }
#produtos-atuais .produtos-grupo:last-child { margin-bottom: 0px; }
#produtos-atuais .produtos-grupo h2 { display: block; margin-bottom: 15px; font-weight: bold; font-size: 18px; text-transform: uppercase; color: var(--blue); }
#produtos-atuais .produtos-lista { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 15px; }
#produtos-atuais .produtos-lista article { display: flex; flex-direction: column; padding: 15px; background-color: #E5EDF9; border-radius: 16px; text-align: center; }
#produtos-atuais .produtos-lista article figure { display: block; width: 100%; height: 120px; margin-bottom: 10px; background-color: #fff; border-radius: 12px; overflow: hidden; }
#produtos-atuais .produtos-lista article figure img { display: block; width: 100%; height: 100%; padding: 10px; object-fit: contain; }
#produtos-atuais .produtos-lista article h1 { flex: 1; display: block; margin-bottom: 10px; font-weight: bold; font-size: 13px; line-height: 1.3; }
#produtos-atuais .produtos-lista article .actions { display: flex; align-items: center; justify-content: center; gap: 8px; }
#produtos-atuais .produtos-lista article .actions a.more { display: block; flex: 1; padding: 8px 0px; font-weight: bold; font-size: 11px; }
#produtos-atuais .produtos-lista article .actions a.more img { display: inline-block; width: 16px; height: auto; margin-right: 4px; vertical-align: middle; }
#produtos-atuais .produtos-lista article .actions a.whatsapp { display: block; width: 32px; height: 32px; line-height: 32px; border-radius: 100%; background-color: #25d366; color: #fff; font-size: 16px; }
#produtos-atuais .produtos-lista article .actions a.whatsapp:hover { background-color: #65BC54; }