/*
Template Name: Stack Code
Teme URI: https://programacionweb.com.mx
Author: Marco Antonio
Author URI: https://programacionweb.com.mx
Description: Diseño y programacion para todos.
Version: 1.0
*/

:root{
    --main-color: #6F5591;
    --second-color: #E9E1F3;
    --third-color: #B5E5F6;
    --fourth-color: #7FBF7D;
	--fiveth-color: #fbc261;
	--sixth-color: #E9E1F3B8;
}
html, body{font-family: "Madimi One", sans-serif;letter-spacing: 1.5px;}
p, ul li, a{font-family: "Manrope", sans-serif;font-size: 14px;letter-spacing:0;}
ul{padding-left:15px;}
.btn-main{background-color: var(--third-color);border:var(--third-color) solid 2px;color: black;font-family: "Madimi One", sans-serif;padding: 8px 20px;border-radius: 14px;display: inline-flex;align-items: center;gap: 15px;text-decoration:none;letter-spacing: 1px;transition:background-color .35s ease,border-color .35s ease,color .35s ease,box-shadow .35s ease,transform .35s ease;}
.btn-main img,
.btn-second img{max-width: 22px;height: auto;}
.btn-second{background-color: transparent;border:var(--third-color) solid 2px;color: var(--third-color);font-family: "Madimi One", sans-serif;padding: 8px 20px;border-radius: 14px;display: inline-flex;align-items: center;gap: 15px;text-decoration:none;letter-spacing: 1px;transition:background-color .35s ease,border-color .35s ease,color .35s ease,box-shadow .35s ease,transform .35s ease;}
.btn-main:hover,
.btn-second:hover{background-color:white;box-shadow:0 10px 20px rgba(24, 13, 48, .22);color: var(--main-color);border-color:white;transform:translateY(-2px);}
.btn-main:hover svg path,
.btn-second:hover svg path{fill: var(--main-color);}

/* Header */
header {background-color: var(--main-color);padding: 20px 0;}
header #main_nav li{padding: 0 5px;}
header #main_nav li a{color: white;font-family: "Madimi One", sans-serif;font-size: 16px;letter-spacing: 2px;position:relative;}
header #main_nav li a::after{background-color:var(--fiveth-color);bottom:0;content:"";height:3px;left:0;position:absolute;transition:width .3s ease;width:0;}
header #main_nav li a:hover::after,
header #main_nav li a:focus-visible::after{width:100%;}
header #main_shop_nav li a{color:white;padding: 10px 15px;font-size: 25px;}
header #main_shop_nav li:last-child a{padding-right: 0px;}
header #main_shop_nav li a img{max-width: 30px;height: auto;}
header #main_shop_nav .cart-header{position:relative;}
header #main_shop_nav .cart-header .cart-current-count{background-color:#FBC261;color:black !important;position:absolute;top:12px;right:-5px;font-size:12px;width:17px;height:17px;line-height:17px;border-radius:50%;text-align:center;}

/* Footer */
footer {background-color: transparent;color: white;padding: 0;}
footer .footer-wave {color: var(--main-color);display: block;height: auto;margin-bottom: -1px;overflow: visible;width: 100%;}
footer .footer-content {background-color: var(--main-color);padding: 20px 0;}
footer .footer-content .widget-footer .widget-title{font-size: 1rem;position: relative;margin-bottom: 25px;padding-bottom: 20px;}
footer .footer-content .widget-footer .widget-title::after{content: "";position: absolute;bottom: -5px;left: 0;width: 29px;height: 2px;background-color: var(--fourth-color);}
footer .footer-content .widget-footer ul.nav-list li {display: flex;align-items: flex-start;margin-bottom: 15px;}
footer .footer-content .widget-footer ul.nav-list li a{font-family: "Madimi One", sans-serif;color: white;}
footer .footer-content .widget-footer ul.nav-list li a:hover{color: var(--sixth-color);transition: all 0.3s ease-in-out;}
footer .footer-content .widget-footer ul.nav-list li img {margin-right: 10px;max-width: 24px;height: auto;}
footer .footer-content .widget-footer ul.list-social{display: flex;align-items: center;justify-content: flex-start;margin-top: 20px;padding: 0;list-style: none;gap: 15px;}
footer .footer-content .widget-footer ul.list-social li a{color: var(--main-color);background-color: var(--third-color);display: flex;align-items: center;justify-content: center;width: 40px;height: 40px;border-radius: 50%;transition: all 0.3s ease-in-out;font-size: 22px;}
footer .footer-content .widget-footer ul.list-social li a:hover{background-color: var(--fourth-color);color: white;}
footer a {text-decoration: none;}

/* Slider */
#main-slider{background-color: var(--main-color);isolation:isolate;overflow:hidden;padding:100px 0;position:relative;}
#main-slider .slider-decorations{inset:0;overflow:hidden;pointer-events:none;position:absolute;z-index:0;}
#main-slider .slider-decorations-motion{inset:-3%;position:absolute;transform:translate3d(var(--parallax-x, 0), var(--parallax-y, 0), 0);transition:transform .45s cubic-bezier(.2,.75,.25,1);will-change:transform;}
#main-slider .slider-decorations img{animation:slider-decorations-float 12s ease-in-out infinite;filter:drop-shadow(0 12px 14px rgba(27, 17, 52, .22));height:100%;object-fit:cover;width:100%;}
#main-slider .container{position:relative;z-index:1;}
#main-slider .slider-visual{align-self:stretch;min-height:580px;position:relative;}
#main-slider .slider-children-motion{position:absolute;right:-12%;top:25px;transform:translate3d(var(--parallax-x, 0), var(--parallax-y, 0), 0);transition:transform .38s cubic-bezier(.2,.75,.25,1);will-change:transform;}
#main-slider .slider-children{animation:slider-children-float 7s ease-in-out infinite;display:block;filter:drop-shadow(0 30px 24px rgba(27, 17, 52, .38));height:clamp(720px, 70vw, 900px);max-width:none;width:auto;}
#main-slider .slider-wave{bottom:-1px;color:#fff;display:block;height:clamp(42px, 4.77vw, 61px);left:0;pointer-events:none;position:absolute;width:100%;z-index:2;}
#main-slider h1{font-size: 3rem;}
#main-slider .content{position: relative;z-index: 9;background-color: #6F559166;padding: 15px 20px;border-radius: 20px;color:white;}
#main-slider .content .legend{background-color: #674692;color: white;padding: 2px 15px;border-radius: 20px;display: inline-block;font-weight: 600;}
#main-slider .content .legend img{max-width: 16px;position: relative;top: -1px;margin-right: 5px;height: auto;}
#main-slider .content .description{margin: 20px 0 25px 0;}
#main-slider .content .description p{margin-bottom: 20px;}
#main-slider .content .description ul{padding-left:0;list-style:none;}
#main-slider .content .description ul li {margin-bottom: 10px;}
#main-slider .content .description ul li img{max-width: 18px;height: auto;margin-right: 5px;}

@keyframes slider-children-float{0%,100%{transform:translateY(0) rotate(0deg)}50%{transform:translateY(-10px) rotate(.6deg)}}
@keyframes slider-decorations-float{0%,100%{transform:translateY(0) scale(1)}50%{transform:translateY(-7px) scale(1.012)}}

@media (max-width: 767.98px){
	#main-slider{padding:70px 0 0;}
	#main-slider .slider-visual{min-height:500px;}
	#main-slider .slider-children-motion{left:50%;right:auto;top:0;transform:translate3d(calc(-50% + var(--parallax-x, 0)), var(--parallax-y, 0), 0);}
	#main-slider .slider-children{height:650px;}
}

@media (prefers-reduced-motion: reduce){
	#main-slider .slider-decorations img,
	#main-slider .slider-children{animation:none;}
	#main-slider .slider-decorations-motion,
	#main-slider .slider-children-motion{transition:none;}
}