* { font-family: "Work Sans", sans-serif; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; outline: none; letter-spacing: -0.3px; }
p { margin: 0; }
a { text-decoration: none !important; color: #212428 !important; }
body { background: #fff !important;}
.shadowCustom { box-shadow: 0px 18px 56px -18px rgba(0, 0, 0, 0.5), 0px 30px 45px -30px rgba(50, 50, 93, 0.25); }
.shadowCustomProduct { box-shadow: 0px 18px 56px -18px rgba(0, 0, 0, 0.1), 0px 30px 45px -30px rgba(50, 50, 93, 0.25); }

/* SCROLL */
::-webkit-scrollbar { width: 4px; height: 4px; border-radius: 20px; }
::-webkit-scrollbar-track { background: #f1f1f1; border-radius: 20px;  }
::-webkit-scrollbar-thumb { background: #b3b3b3; transition: all 0.3s; border-radius: 20px;  }
::-webkit-scrollbar-thumb:hover { background: #8e8e8e; }

header { background: transparent; padding: 25px 0 15px 0px; position: relative; z-index: 1; width: 100%; height: 100vh; overflow: hidden; }
header.bg { background: #5F27CD; height: auto; padding: 25px 0; width: 100%; }
header video { position: absolute; width: 100%; top: 0; z-index: -1; height: 100vh; object-fit: cover;  } 
header .mask { background: rgb(34, 52, 98); background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgb(0, 0, 0) 100%); width: 100%; height: 200px; position: absolute; bottom: 0px; z-index: 1;  }
header .maskTop { background: rgb(34, 52, 98); background: linear-gradient(-360deg, rgba(0, 0, 0, 0) 0%, rgb(0, 0, 0) 100%); width: 100%; height: 100px; position: absolute; top: 0px; z-index: 1;  }

header .container { display: flex; align-items: center; justify-content: space-between; z-index: 2; }
header .container .logo { display: flex; gap: 20px; }
header .container .logo img { width: 180px; position: relative; z-index: 2; transition: all 0.3s; }
header .container .logo img:hover { opacity: 0.8; }
header .container .logo small { color: rgba(255,255,255,0.7); z-index: 2; font-size: 12px; display: block; margin-top: 3px; }

header .container .nav ul { list-style: none; padding: 0; margin: 0; position: relative; z-index: 2;  }
header .container .nav ul li { display: inline-block; color: #fff; transition: all 0.3s; padding: 10px 18px; font-weight: 500; font-size: 17px; }
header .container .nav ul li a { color: #fff !important; transition: all 0.3s; }
header .container .nav ul li a:hover { color: rgba(255,255,255,0.8) !important; cursor: pointer; }
header .container .nav ul li:hover:not(:last-child) { color: rgba(255,255,255,0.8); cursor: pointer;  }
header .container .nav ul li:last-child { background: #5F27CD; border-radius: 25px; padding: 10px 30px; font-weight: 500; color: #fff; transition: all 0.3s; }
header .container .nav ul li:last-child a { color: #fff !important; }
header .container .nav ul li:last-child:hover { cursor:pointer; background: rgb(135, 81, 243); }

header.bg .container .nav ul li:last-child { background: rgb(135, 81, 243); border-radius: 25px; padding: 10px 30px; font-weight: 500; color: #fff; transition: all 0.3s; }
header.bg .container .nav ul li:last-child a { color: #fff; }
header.bg .container .nav ul li:last-child:hover { cursor:pointer; background: rgb(152, 104, 247); }


header .text { margin-top: 7%; position: relative; z-index: 1; height: 100vh; }
header .text .container { flex-direction: column; align-items: flex-start; padding: 0px 5px; }
header .text .container span { font-size: 70px; color: #fff; width: 60%; line-height: 80px; letter-spacing: -2px;  }
header .text .container p { color: #fff; font-size: 22px; position: absolute; bottom: 270px;  }
header .text .container button { background: #fff; border: none; padding: 10px 12px 10px 30px; width: auto; font-size: 20px; margin-top: 70px; border-radius: 50px; position: relative; text-align: left; display: flex; align-items: center; justify-content: space-between; gap:30px; transition: background 0.3s, color 0.3s; font-weight: 500; } 
header .text .container button img { background: #5F27CD; padding: 8px; width: 40px; border-radius: 100px; }
header .text .container button img:hover ~ button, header .text .container button:hover { background: #5F27CD;  color: #fff; }

@media only screen and (max-width:899px) {
    header { height: 700px; overflow: hidden; }
    header video { height: 700px; }
    header .container { padding: 0px 30px; }
    header .container .logo img { width: 130px; }
    header .container .logo small { display: none; }
    header .container .nav { display: block; }
    header .container .nav ul li:nth-child(1) { display: none; }
    header .container .nav ul li:nth-child(2) { display: none; }
    header .container .nav ul li:nth-child(3) { display: none; }
    header .container .nav ul li:nth-child(4) { display: none; }
    header .container .nav ul li:last-child { font-size: 15px; padding: 9px 30px; }

    header .text { margin-top: 50px; height: 600px; }
    header .text .container { padding: 0px 25px; }
    header .text .container a { color: #212428; }
    header .text .container span { font-size: 60px; line-height: 60px; width: 90%; }
    header .text .container button { font-size: 14px; padding: 5px 6px 5px 25px; color: #212428; }
    header .text .container p { font-size: 16px; bottom: 30px; padding-right: 40px; left: 0; right: 0; margin: 0 auto; width: 85%; }
    header .text .container p br { display: none; }
}





section.c2 { padding: 5% 0px; } 
section.c2 h2 { text-align: center; font-size: 60px; font-weight: 400; letter-spacing: -4px; }
section.c2 h2 b { color: #5F27CD; font-weight: 600; }
section.c2 p { text-align: center; font-size: 22px; opacity: 0.5; }
section.c2 button { background: #5F27CD; width: 20%; font-size: 18px; padding: 12px 15px; border-radius: 25px; border: none; color: #fff; display:block; margin:0 auto; margin-top: 40px; transition: all 0.3s; font-weight: 600;  }
section.c2 button:hover { background: #4a1fa1; cursor: pointer; }

section.c2 .title { margin-top: -30px; }
section.c2 .title p { text-align: left; opacity: 1; }
section.c2 .title p b { color: #5F27CD; font-weight: 600; }

section.c2 .estoque { margin-top: 50px; display: flex; gap: 30px; justify-content: space-between; flex-wrap: wrap; }
section.c2 .estoque div { width: 22.9%; border-radius: 20px; margin-bottom: 20px;}
section.c2 .estoque .photo { width: 100%; position: relative; }
section.c2 .estoque .photo img { display: block; border-radius: 25px; width: 100%; height: 300px; object-fit: cover; }
section.c2 .estoque .photo img.logo { position: absolute; width: 55px; bottom: -70px; right: 20px; padding: 10px; z-index: 1; height: auto; }

section.c2 .estoque .photo span.badge { position: absolute; background: rgb(135, 81, 243); color: rgba(255,255,255,0.8); z-index: 1; bottom: 17px; text-transform: uppercase; left: 18px; letter-spacing: 2px; font-size: 12px; border-radius: 30px; padding: 5px 12px; }
section.c2 .estoque .photo .mask { background: rgb(34, 52, 98); background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgb(0, 0, 0) 100%); width: 100%; height: 80px; position: absolute; bottom: -20px; border-radius: 0px 0px 25px 25px; }
section.c2 .estoque span { margin-top: 15px; display: block; font-weight: 600; font-size: 18px; }
section.c2 .estoque small { opacity: 0.6; } 

@media only screen and (max-width:899px) {
    section.c2 { padding: 10% 0; }
    section.c2 h2 { font-size: 30px; letter-spacing: -1px; text-align: left; }
    section.c2 p { font-size: 14px; text-align: left; }
    section.c2 .container { padding: 0px 30px; }
    section.c2 .estoque { margin-top: 15px; display: flex; gap: 30px; overflow-x: auto;  scroll-snap-type: x mandatory;  justify-content: flex-start;  flex-wrap: nowrap; }
    section.c2 .estoque div { flex: 0 0 auto;  width: calc(90% - 30px);  border-radius: 20px; margin-bottom: 20px; scroll-snap-align: start; }
    section.c2 button { width: 100%; padding: 9px; font-size: 15px; }
}

section.c3 { padding-bottom: 10%; }
section.c3 .container { display: flex; align-items: center; justify-content: space-between; border-top: 1px solid #dfdfdf; padding-top: 10%; margin-top: 5%; }
section.c3 .container h2 { color: #000; font-size: 60px; font-weight: 400; letter-spacing: -4px; }
section.c3 .container h2 b { color: #1DD1A1; font-weight: 400; letter-spacing: -4px; }
section.c3 .container p { font-size: 20px; padding-right: 18%; opacity: 1; line-height: 35px; }
section.c3 .container button { background: transparent; width: 50%; font-size: 18px; padding: 12px 15px; border-radius: 35px; border: 2px solid #000; color: #000; display: block; margin-top: 40px; transition: all 0.3s; font-weight: 600;  }
section.c3 .container button:hover { background: #000; cursor: pointer; color: #fff; }

@media only screen and (max-width:899px) {
    section.c3 { padding-top: 5%; padding-bottom: 20px; }
    section.c3 .container { flex-wrap: wrap; padding: 10% 30px; margin-top: -7px; }
    section.c3 .container div:nth-child(1) { order: 2; }
    section.c3 .container h2 { font-size: 30px; letter-spacing: -1px; text-align: left; }
    section.c3 .container h2 b { letter-spacing: -1px; }
    section.c3 .container p { font-size: 15px; line-height: 27px; padding-right: 0; }
    section.c3 .container button { width: 100%; padding: 9px; font-size: 15px; }
    section.c3 .container img { width: 100%; margin: 20px 0px; }
}

section.c4 .container { display: flex; gap: 30px; }
section.c4 .container div { width: 50%; border-radius: 30px; padding: 50px; }
section.c4 .container div img { margin: 10px 0px 40px 0px; width: 300px; }
section.c4 .container div h2 { color: #fff; font-size: 60px; font-weight: 400; letter-spacing: -4px; line-height: 65px; margin-bottom: 30px; }
section.c4 .container div p { font-size: 20px; color: rgba(255,255,255,0.8); padding-right: 20%; }
section.c4 .container div button { background: transparent; width: 40%; font-size: 18px; padding: 12px 15px; border-radius: 35px; border: 2px solid #fff; color: #fff; display: block; margin-top: 40px; transition: all 0.3s; font-weight: 600;  }
section.c4 .container div button:hover { background: #fff; cursor: pointer; color: #000; border: 2px solid transparent; }

section.c4 .container div:nth-child(1) { background: #5F27CD; }
section.c4 .container div:nth-child(2) { background: rgb(135, 81, 243); }

@media only screen and (max-width:899px) {
    section.c4 .container { flex-wrap: wrap; padding: 0px 30px; }
    section.c4 .container div { width: 100%; padding: 30px; }
    section.c4 .container div img { width: 100%; }
    section.c4 .container div h2 { font-size: 31px; letter-spacing: -1px; line-height: 40px; }
    section.c4 .container div p { font-size: 15px; line-height: 27px; padding-right: 0; }
    section.c4 .container button { width: 100% !important; padding: 9px !important; font-size: 15px !important; }
}

section.c5 { padding-bottom: 10%; }
section.c5 .container { display: flex; align-items: center; justify-content: space-between; border-top: 1px solid #dfdfdf; padding-top: 7%; margin-top: 8%; }
section.c5 .container div { width: 50%; }
section.c5 .container img { width: 90%; }
section.c5 .container ul { list-style: none; padding: 0; margin: 0; margin-top: 20px; }
section.c5 .container ul li { line-height: 30px; opacity: 0.6; }
section.c5 .container h2 { color: #000; font-size: 60px; font-weight: 400; letter-spacing: -4px; }
section.c5 .container p { font-size: 20px; padding-right: 18%; opacity: 1; line-height: 35px; }
section.c5 .container button { background: transparent; width:45%; font-size: 18px; padding: 12px 15px; border-radius: 35px; border: 2px solid #000; color: #000; display: block; margin-top: 40px; transition: all 0.3s; font-weight: 600;  }
section.c5 .container button:hover { background: #000; cursor: pointer; color: #fff; }

@media only screen and (max-width:899px) {
    section.c5 { padding-top: 5%; padding-bottom: 20px; }
    section.c5 .container { flex-wrap: wrap; padding: 10% 30px; margin-top: 40px; }
    section.c5 .container div { width: 100%; }
    section.c5 .container div:nth-child(2) { order: 2; }
    section.c5 .container h2 { font-size: 30px; letter-spacing: -1px; text-align: left; }
    section.c5 .container h2 b { letter-spacing: -1px; }
    section.c5 .container p { font-size: 15px; line-height: 27px; padding-right: 0; }
    section.c5 .container ul li { line-height: 25px; font-size: 13px; opacity: 0.6; }
    section.c5 .container button { width: 100%; padding: 9px; font-size: 15px; }
    section.c5 .container img { width: 100%; margin: 20px 0px; }
}


section.c6 { background: #f1f1f1; padding: 7% 0; }
section.c6 .container { display: flex; }
section.c6 .container div:nth-child(1) { width: 35%; }
section.c6 .container div:nth-child(1) span { font-size: 40px; font-weight: 500; letter-spacing: -4px; line-height: 65px; margin: 0; }

section.c6 .container div:nth-child(2) { width: 65%; display: flex; gap: 30px; justify-content: space-between; margin-top: 20px; }
section.c6 .container div:nth-child(2) div { width: 20%; display: initial; margin: 0; }
section.c6 .container div:nth-child(2) div img { width: 30px; margin-bottom: 15px; display: block; }
section.c6 .container div:nth-child(2) div p { font-size: 16px; }

@media only screen and (max-width:899px) {
    section.c6 { padding-top: 45px; padding-bottom: 55px; }
    section.c6 .container { flex-wrap: wrap; padding: 0px 30px; }
    section.c6 .container div { width: 100% !important; flex-wrap: wrap; }
    section.c6 .container div:nth-child(1) span { font-size: 30px; letter-spacing: -1px; text-align: left; line-height: 45px; display: block; margin-bottom: 30px; }
    section.c6 .container div:nth-child(2) div p { opacity: 0.7; font-size: 15px; line-height: 27px; padding-right: 0; }
}


/* FOOTER */
footer { padding: 5% 0 6% 0; background: #000; }
footer a { text-decoration: none; }
footer p { font-size: 16px; font-weight: 500; line-height: 30px; opacity: 0.5; color: #fff; margin-bottom: 35px; }
footer p span { font-weight: 300;  }
footer a { color: #000; }

footer .container { display: flex; justify-content: space-between; gap: 30px; border-bottom: 1px solid #4f586f18; padding-bottom: 50px; }
footer .container.noborder { border: none; margin-top: 30px; padding: 0; align-items: center; padding-bottom: 0px; }
footer .container.noborder div:nth-child(1) { margin-left: auto; width: 100%; }
footer .container.noborder div:nth-child(1) small { font-size: 12px; line-height: 20px; opacity: 0.54; }
footer .container.noborder div:nth-child(2) img { display: inline-block; }

footer .container div { width: auto; }
footer .container div:nth-child(1) { width: 30%; }
footer .container div:nth-child(1) .badges { width: 100%; display: flex; gap: 20px; margin: 0; padding: 0  ;}
footer .container div:nth-child(1) .badges img { width: 180px; height: 55px; }

footer .container div:nth-child(2) { width: 15%; }
footer .container div:nth-child(4) { width: 20%; }
footer .container div img { width: 90px; display: inline-block; transition: all 0.3s; }
footer .container div img.logoFooter { margin-bottom: 30px; width: 170px; }
footer .container div img.img1 { width: 60px; }
footer .container div img.img2 { width: 70px; }
footer .container div img.img3 { width: 80px; }

footer .container div h5 { font-weight: bold; color: #fff; font-size: 18px; }
footer .container div .support { background: rgb(135, 81, 243);color: #fff; padding: 12px 10px; border-radius: 20px; display: flex; align-items: center; gap: 20px; width: 100%; }
footer .container div .support img { width: 30px; margin: 0; margin-top: 3px; margin-left: 10px; }
footer .container div .support h3 { color: #fff; margin: 0; font-size: 20px; font-weight: bold; }
footer .container div .support h3 span { color: #fff; display: block; margin: 0; font-weight: 500; font-size: 13px; opacity: 0.5; letter-spacing: 1px; margin-top: 3px; }

footer .container div ul { list-style: none; padding: 0; margin: 0; }
footer .container div ul li { display: block; line-height: 40px; transition: all 0.3s; font-weight: 500; color: rgba(255,255,255,0.5); font-size: 15px; }
footer .container div ul li:hover { cursor:pointer; color: rgba(255,255,255,0.9);}
footer .container div span { display: inline-block; align-items: center; color: #fff; margin-bottom: 15px; transition: all 0.3s; margin-top: 0px; font-weight: 500; font-size: 18px; }
footer .container div span:nth-child(2) { margin-left: -15px; }

@media only screen and (max-width:899px) {
    footer { padding: 50px 0; }
    footer p { font-size: 15px; line-height: 27px; padding-right: 0; }
    footer .container { flex-wrap: wrap; padding: 0px 30px; }
    footer .container div { width: 100% !important; }
    footer .container div:nth-child(1) .badges img { width: 37%; height: 40px; }
    footer .container div ul li { line-height: 30px; }
    footer .container.noborder { padding: 0px 30px; }
    footer .container.noborder p { margin: 0; }
    footer .container div .support { justify-content: center; width: 63% !important; }
    footer .container div .support img { margin-left: 0px; }
}







/* MODAL */
.modal { background-color: #000000a1; }
.modal .modal-content { border-radius: 30px; padding: 30px; }
.modal .modal-content h2 { text-align: center; }

.modal .modal-content form { margin-top: 30px; }
.modal .modal-content form label { font-weight: 700; display: block; margin-bottom: 10px; opacity: 0.8; }
.modal .modal-content form .form-control { padding: 12px 20px; margin-bottom: 20px; border-radius: 20px; } 
.modal .modal-content form .form-control:focus { box-shadow: none; border: 1px solid #c5c5c5; }
.modal .modal-content form small { display: block; text-align: center; margin-top: 20px; }
.modal .modal-content form button { width:100%; margin-top:15px; padding:15px 42px; border: none; color:#fff; font-size: 20px; font-style: normal; font-weight: 700; line-height: normal; border-radius: 40px; background: #5F27CD; transition: all 0.3s; }
.modal .modal-content form button:disabled { opacity: 0.3; pointer-events: none;  }
.modal .modal-content form button:hover { background: #162C8C; color: #fff; border: none; }


/* FILTRO */
.filtro { padding: 15px; }
.filtro .container { display: flex; justify-content: space-between; gap: 20px; }
.filtro .container div { width: 16%; }
.filtro .container div.dropdown { width: 100%; }
.filtro .container div.dropdown .dropdown-toggle::after { content: url('../images/icons/icArrowDown.svg'); width: 20px; height: 20px; border: none; position: absolute; right: 20px; top: 11px; opacity: 0.6; }
.filtro .container div.dropdown button.results { background: #1DD1A1; width: 100%; font-size: 18px; padding: 12px 15px; height: auto; border-radius: 25px; border: none; color: #fff; display:block; margin:0 auto; margin-top: 30px; transition: all 0.3s; font-weight: 600;  }
.filtro .container div.dropdown button.results:hover { background: #17aa83; cursor: pointer; }


.filtro .container div.dropdown .dropdown-menu { width: 400px; border: none; border-radius: 20px; background: #fff; padding: 25px; box-shadow: 0 0 8px #00000029; }
.filtro .container div.dropdown .dropdown-menu h3 { margin-bottom: 20px; font-size: 22px; }
.filtro .container div.dropdown .dropdown-menu .block { display: flex; width: 100%; gap: 20px; justify-content: space-between; flex-wrap: wrap; }
.filtro .container div.dropdown .dropdown-menu .block div { width: 47%; background: #fff; height: 80px; border: 1px solid #c2c2c2; border-radius: 20px; display: flex; align-items: center; justify-content: center; transition: all 0.3s; }
.filtro .container div.dropdown .dropdown-menu .block div img { width: 30%; margin: 0 auto; display: block; }
.filtro .container div.dropdown .dropdown-menu .block div:hover { background: #5F27CD !important; color: #fff; border: 1px solid transparent; }
.filtro .container div.dropdown .dropdown-menu .block div span { font-weight: 600; font-size: 18px; }

.filtro .container div.dropdown .dropdown-menu .preco { display: flex; width: 100%; justify-content: space-between; gap: 20px; }
.filtro .container div.dropdown .dropdown-menu .preco div { width: 50%; position: relative; }
.filtro .container div.dropdown .dropdown-menu .preco div label { font-weight: 500; display: block; margin-bottom: 5px; font-size: 15px; }
.filtro .container div.dropdown .dropdown-menu .preco div .form-control { padding: 12px 20px; border-radius: 20px; font-size: 18px; }
.filtro .container div.dropdown .dropdown-menu .preco div .form-control:focus { box-shadow: none; border: 1px solid #8e8e8e; }
.filtro .container div.dropdown .dropdown-menu .preco div small { position: absolute; top: 43px; right: 20px; opacity: 0.5; }

.filtro .container div.dropdown .dropdown-menu .marca { display: flex; width: 100%; gap: 20px; justify-content: space-between; flex-wrap: wrap; }
.filtro .container div.dropdown .dropdown-menu .marca div { width: 47%; background: #fff; height: 80px; border: 1px solid #c2c2c2; border-radius: 20px; display: flex; align-items: center; justify-content: center; transition: all 0.3s; }
.filtro .container div.dropdown .dropdown-menu .marca div img { width: 30%; margin: 0 auto; display: block; }
.filtro .container div.dropdown .dropdown-menu .marca div:hover { background: #f1f1f1 !important; color: #fff; border: 1px solid transparent; }
.filtro .container div.dropdown .dropdown-menu .marca div span { font-weight: 600; font-size: 18px; }

.filtro .container button { width: 100%; display: flex; justify-content: flex-start; align-items: center; height: 44px; padding: 12px 20px; border-radius: 38px; border: 1px solid #c2c2c2; -webkit-user-select: none; user-select: none; background: #fff; font-size: 16px; transition: all 0.3s; font-weight: 500;} 
.filtro .container button:hover { background: #f1f1f1; }

@media only screen and (max-width:899px) {
    .filtro { display: none; }
    .filtro .container { display: flex; justify-content: space-between; gap: 20px; }
}
/* DETALHES */
.detalhes .container .block { display: flex; gap: 20px; margin-top: 30px; }
.detalhes .container .block div:nth-child(1) { width: 70%; }

@media only screen and (max-width:899px) {
    .detalhes .container { padding: 0px 25px; }
    .detalhes .container .block { flex-wrap: wrap; }
    .detalhes .container .block div:nth-child(1) { width: 100%; }
}

/* SLIDE */
.detalhes .container .block div:nth-child(1) .carousel { width: 100%; }
.detalhes .container .block div:nth-child(1) .carousel .carousel-inner { width: 100%; }
.detalhes .container .block div:nth-child(1) .carousel .carousel-inner .carousel-item { width: 100%; background: transparent; padding: 0; }
.detalhes .container .block div:nth-child(1) .carousel .carousel-inner .carousel-item img { width: 100%; display: block; margin: 0 auto; border-radius: 25px; }
.detalhes .container .block div:nth-child(1) .carousel .carousel-control-prev { background: #5F27CD; height: 50px; width: 50px; top: 44%; left: 30px; opacity: 1; border-radius: 22px; transition: all 0.3s; }
.detalhes .container .block div:nth-child(1) .carousel .carousel-control-prev:hover { background: #4a1fa1; }
.detalhes .container .block div:nth-child(1) .carousel .carousel-control-prev-icon { width: 22px; }

.detalhes .container .block div:nth-child(1) .carousel .carousel-control-next { background: #5F27CD; height: 50px; width: 50px; top: 44%; right:30px; opacity: 1; border-radius: 22px; transition: all 0.3s; }
.detalhes .container .block div:nth-child(1) .carousel .carousel-control-next:hover { background: #4a1fa1; }
.detalhes .container .block div:nth-child(1) .carousel .carousel-control-next-icon { width: 22px; }

/* INFO */
.detalhes .container { margin-top: 30px; }
.detalhes .container .title { display: flex; align-items: center; gap: 30px; }
.detalhes .container .title h2 { display: flex; gap: 30px; align-items: center; font-size: 40px; margin: 0; }
.detalhes .container .title h2 span { opacity: 0.6; font-size: 19px; margin: 0; }

.detalhes .container .title a { color: #000; }
.detalhes .container .title p { font-size: 16px; background: rgba(0, 0, 0, 0.05); padding: 10px 20px; border-radius: 25px; display: flex; align-items: center; gap: 10px; transition: all 0.3s; }
.detalhes .container .title p:hover { background: rgba(0, 0, 0, 0.2); cursor: pointer; }

.detalhes .container .title div:last-child { margin-left: auto; }
.detalhes .container .title div:last-child h2 { font-size: 20px; }

@media only screen and (max-width:899px) {
    .detalhes .container .title { flex-wrap: wrap; gap: 20px; }
    .detalhes .container .title h2 { flex-wrap: wrap; width: 100%; font-size: 26px; }
    .detalhes .container .title h2 span { display: none; }
    .detalhes .container .title p { font-size: 15px; padding: 7px 20px; }
    .detalhes .container .title p img { width: 20px; }
    .detalhes .container .title div:last-child { display: none; }
}

.detalhes .container .block div:nth-child(2) { width: 30%; background: rgb(135, 81, 243); border-radius: 25px; padding: 30px; position: relative; }
.detalhes .container .block div:nth-child(2) span { color: rgba(255,255,255,0.5); font-weight: 600; font-size: 22px; }
.detalhes .container .block div:nth-child(2) p { font-size: 40px; letter-spacing: -2px; color: #fff; }
.detalhes .container .block div:nth-child(2) .dropdown { width: 100%; margin-top: 10px; border-top: 1px solid rgba(255,255,255,0.2); padding-top: 20px; }
.detalhes .container .block div:nth-child(2) .dropdown .dropdown-menu { width: 305px; border: none; border-radius: 20px; background: #fff; padding: 20px 20px; box-shadow: 0 0 8px #00000029; }
.detalhes .container .block div:nth-child(2) .dropdown .dropdown-menu li { padding: 0; line-height: 25px; font-size: 14px; transition: all 0.3s; }
.detalhes .container .block div:nth-child(2) .dropdown .dropdown-menu li:hover { opacity: 0.6; }

.detalhes .container .block div:nth-child(2) .dropdown .dropdown-toggle::after { content: url('../images/icons/icArrowDownWhite.svg'); width: 20px; height: 20px; border: none; position: absolute; right: 0px; top: 31px; opacity:1; }
.detalhes .container .block div:nth-child(2) .dropdown button { background: transparent; padding: 0; border: none; color: #fff; font-weight: 600; text-align: left; }
.detalhes .container .block div:nth-child(2) .dropdown button small { display: block; font-size: 12px; font-weight: 400; }

.detalhes .container .block div:nth-child(2) .location { background: rgba(255,255,255,0.1); padding: 7px 20px; border-radius: 25px; margin-top: 15px; display: flex; align-items: center; width: 100%; gap: 20px; }
.detalhes .container .block div:nth-child(2) .location div { width: auto; background: transparent; padding: 0; }
.detalhes .container .block div:nth-child(2) .location div img { width: 30px; }
.detalhes .container .block div:nth-child(2) .location small { display: block; font-size: 11px; color: rgba(255,255,255,0.5); font-weight: 500; }
.detalhes .container .block div:nth-child(2) .location p { font-size: 18px; letter-spacing: 0px; font-weight: 600; margin-top: -3px; }

.detalhes .container .block div:nth-child(2) .buttons { margin-top: 30px; width: 80%; position: absolute; bottom: 29px; left: 0; right: 0; margin: 0 auto;}
.detalhes .container .block div:nth-child(2) .buttons button { width: 100%; border: none; padding: 12px 15px; margin-bottom: 20px; border-radius: 25px; }
.detalhes .container .block div:nth-child(2) .buttons button:nth-child(1) { background: #1DD1A1; color: #fff; font-weight: 600; transition: all 0.3s; }
.detalhes .container .block div:nth-child(2) .buttons button:nth-child(1):hover { background: #17aa82; }

.detalhes .container .block div:nth-child(2) .buttons button:nth-child(2) { background: transparent; border:2px solid #fff; color: #fff; font-weight: 600; transition: all 0.3s; }
.detalhes .container .block div:nth-child(2) .buttons button:nth-child(2):hover { background: #fff; border: 2px solid transparent; color: rgb(135, 81, 243); }

.detalhes .container .block div:nth-child(2) .buttons button:last-child { margin-bottom: 0; }

.detalhes .container .info { display: flex; justify-content: space-between; flex-wrap: wrap; }
.detalhes .container .info div { background: #f1f1f1; width: 32%; padding: 30px; border-radius: 25px; margin-bottom: 25px; }
.detalhes .container .info div img { width: 40px; display: block; margin-bottom: 20px; }
.detalhes .container .info div small { font-weight: 500; display: block; text-transform: uppercase; opacity: 0.5; }
.detalhes .container .info div p { font-size: 28px; }

.detalhes .container .otherInfo ul { columns: 3; -webkit-columns: 3; -moz-columns: 3; list-style: none; padding: 0; margin: 0; }
.detalhes .container .otherInfo ul li { line-height: 35px; font-size: 17px; }

.detalhes .container .qualidade { border-top: 1px solid #dfdfdf; padding-top: 10%; margin-top: 10%; padding-bottom: 10%; }
.detalhes .container .qualidade .block { display: flex; align-items: center; }
.detalhes .container .qualidade .block div { width: 50%; padding: 0; margin: 0; background: transparent; }
.detalhes .container .qualidade .block div h3 { font-size: 60px; letter-spacing: -2px; margin-bottom: 30px; }
.detalhes .container .qualidade .block div h3 b { font-weight: 500; letter-spacing: -2px; color: #5F27CD; }
.detalhes .container .qualidade .block div img { width: 100%; margin: 0 auto; display: block; }
.detalhes .container .qualidade .block div ul { margin: 0; padding: 0; list-style: none; }
.detalhes .container .qualidade .block div ul li { display: flex; font-size: 18px; gap: 10px; line-height: 40px; }
.detalhes .container .qualidade .block div ul li img { width: 25px; margin: initial; }

@media only screen and (max-width:899px) {
    .detalhes .container .block div:nth-child(2) { width: 100%; }
    .detalhes .container .block div:nth-child(2) .buttons { position: relative; width: 100%; bottom: 0; margin-top: 50px; }
    .detalhes .container .block div:nth-child(2) .buttons button { padding: 9px; }
    .detalhes .container .block div:nth-child(2) .dropdown .dropdown-menu { width: 320px; }
    .detalhes .container .info div { width: 100%; }
    .detalhes .container .otherInfo ul { columns: 1; -webkit-columns: 1; }
    .detalhes .container .qualidade { padding-top: 1%; }
    .detalhes .container .qualidade .block { width: 100%; flex-wrap: wrap; }
    .detalhes .container .qualidade .block div { width: 100%; } 
    .detalhes .container .qualidade .block div img { margin: 20px 0px; width: 100%; }
    .detalhes .container .qualidade .block div:nth-child(1) { order: 2; }
    .detalhes .container .qualidade .block div h3 { font-size: 30px; letter-spacing: -1px; text-align: left; margin-bottom: 20px; }
    .detalhes .container .qualidade .block div h3 br { display: none; }
    .detalhes .container .qualidade .block div ul li { font-size: 15px; line-height: 27px; padding-right: 0; }
    .detalhes .container .block div:nth-child(1) .carousel .carousel-control-next { width: 40px; height: 40px; top: 42%; }
    .detalhes .container .block div:nth-child(1) .carousel .carousel-control-prev { width: 40px; height: 40px; top: 42%; }
}