body
{
   background-color: #ECCFF2;
   color: #000000;
   font-family: Arial;
   font-weight: normal;
   font-size: 13px;
   line-height: 1.1875;
   margin: 0;
   padding: 0;
}
#menuLayer
{
   background-color: transparent;
   background-image: none;
   border-radius: 0px;
   opacity: 0.77;
}
#upStickyLayer
{
   background-color: #E6C0EE;
   background-image: none;
   border: 1px solid #3E3E3E;
   border-radius: 5px;
   opacity: 0.77;
}
#wb_upIcon
{
   background-color: transparent;
   background-image: none;
   border: 0px solid #3E3E3E;
   border-radius: 0px;
   text-align: center;
   margin: 0;
   padding: 4px 4px 4px 4px;
   vertical-align: top;
}
#wb_upIcon a
{
   text-decoration: none;
}
#wb_upIcon a::after
{
   position: absolute;
   top: 0;
   right: 0;
   bottom: 0;
   left: 0;
   z-index: 1;
   pointer-events: auto;
   content: "";
}
#upIcon
{
   height: 24px;
   width: 24px;
   display: flex;
   flex-wrap: nowrap;
   justify-content: center;
}
#upIcon i
{
   color: #684270;
   display: inline-block;
   font-size: 24px;
   line-height: 24px;
   vertical-align: middle;
}
#wb_upIcon:hover #upIcon i
{
   color: #FFFFFF;
}
#wb_LayoutGrid1
{
   clear: both;
   position: relative;
   table-layout: fixed;
   display: table;
   text-align: center;
   width: 100%;
   background-color: transparent;
   background-image: none;
   border: 0px solid #DDDDDD;
   border-radius: 0px;
   box-sizing: border-box;
   margin: 0;
}
#LayoutGrid1
{
   box-sizing: border-box;
   display: flex;
   flex-direction: row;
   flex-wrap: wrap;
   padding: 7px 0 3px 0;
   margin-right: auto;
   margin-left: auto;
}
#LayoutGrid1 > .col-1
{
   box-sizing: border-box;
   font-size: 0;
   min-height: 1px;
   padding-right: 15px;
   padding-left: 15px;
   position: relative;
}
#LayoutGrid1 > .col-1
{
   flex: 0 0 auto;
}
#LayoutGrid1 > .col-1
{
   background-color: transparent;
   background-image: none;
   border: 0px solid #FFFFFF;
   border-radius: 0px;
   flex-basis: 100%;
   max-width: 100%;
   display: flex;
   flex-wrap: wrap;
   align-content: center;
   align-self: stretch;
   align-items: center;
   justify-content: center;
   text-align: center;
}
@media (max-width: 768px)
{
#LayoutGrid1 > .col-1
{
   flex-basis: 100% !important;
   max-width: 100% !important;
}
}
#wb_contador
{
   clear: both;
   position: relative;
   table-layout: fixed;
   display: table;
   text-align: center;
   width: 100%;
   background-color: transparent;
   background-image: none;
   border: 0px solid #DDDDDD;
   border-radius: 0px;
   box-sizing: border-box;
   margin: 0;
}
#contador
{
   box-sizing: border-box;
   display: flex;
   flex-direction: row;
   flex-wrap: wrap;
   padding: 10px 0 10px 0;
   margin-right: auto;
   margin-left: auto;
}
#contador > .col-1, #contador > .col-2
{
   box-sizing: border-box;
   font-size: 0;
   min-height: 1px;
   padding-right: 15px;
   padding-left: 15px;
   position: relative;
}
#contador > .col-1, #contador > .col-2
{
   flex: 0 0 auto;
}
#contador > .col-1
{
   background-color: transparent;
   background-image: none;
   border: 0px solid #FFFFFF;
   border-radius: 0px;
   flex-basis: 66.66666667%;
   max-width: 66.66666667%;
   display: flex;
   flex-wrap: wrap;
   align-content: center;
   align-self: stretch;
   align-items: center;
   justify-content: flex-end;
   text-align: right;
}
#contador > .col-2
{
   background-color: transparent;
   background-image: none;
   border: 0px solid #FFFFFF;
   border-radius: 0px;
   flex-basis: 33.33333333%;
   max-width: 33.33333333%;
   display: flex;
   flex-wrap: wrap;
   align-content: center;
   align-self: stretch;
   align-items: center;
   justify-content: flex-end;
   text-align: right;
}
@media (max-width: 768px)
{
#contador > .col-1, #contador > .col-2
{
   flex-basis: 100% !important;
   max-width: 100% !important;
}
}
#wb_Card1
{
   position: relative;
   display: flex;
   flex-direction: column;
   box-sizing: border-box;
   margin: 0;
   background-color: transparent;
   background-image: none;
   border: 1px solid transparent;
   border-radius: 3px;
   text-align: center;
}
#Card1-card-body
{
   padding: 0;
   flex: 1 1 auto;
   font-size: 0;
}
#Card1-card-item0
{
   box-sizing: border-box;
   border-radius: 3px 3px 0 0 !important;
   margin: 0;
   width: 100%;
   height: auto;
}
#wb_LayoutGrid3
{
   clear: both;
   position: relative;
   table-layout: fixed;
   display: table;
   text-align: center;
   width: 100%;
   background-color: transparent;
   background-image: none;
   border: 0px solid #DDDDDD;
   border-radius: 0px;
   box-sizing: border-box;
   margin: 0;
}
#LayoutGrid3
{
   box-sizing: border-box;
   display: flex;
   flex-direction: row;
   flex-wrap: wrap;
   padding: 7px 0 3px 0;
   margin-right: auto;
   margin-left: auto;
}
#LayoutGrid3 > .col-1
{
   box-sizing: border-box;
   font-size: 0;
   min-height: 1px;
   padding-right: 15px;
   padding-left: 15px;
   position: relative;
}
#LayoutGrid3 > .col-1
{
   flex: 0 0 auto;
}
#LayoutGrid3 > .col-1
{
   background-color: transparent;
   background-image: none;
   border: 0px solid #FFFFFF;
   border-radius: 0px;
   flex-basis: 100%;
   max-width: 100%;
   display: flex;
   flex-wrap: wrap;
   align-content: center;
   align-self: stretch;
   align-items: center;
   justify-content: center;
   text-align: center;
}
@media (max-width: 768px)
{
#LayoutGrid3 > .col-1
{
   flex-basis: 100% !important;
   max-width: 100% !important;
}
}
#wb_LayoutGrid2
{
   clear: both;
   position: relative;
   table-layout: fixed;
   display: table;
   text-align: center;
   width: 100%;
   background-color: transparent;
   background-image: none;
   border: 0px solid #DDDDDD;
   border-radius: 0px;
   box-sizing: border-box;
   margin: 0;
}
#LayoutGrid2
{
   box-sizing: border-box;
   display: flex;
   flex-direction: row;
   flex-wrap: wrap;
   padding: 10px 0 10px 0;
   margin-right: auto;
   margin-left: auto;
}
#LayoutGrid2 > .col-1
{
   box-sizing: border-box;
   font-size: 0;
   min-height: 1px;
   padding-right: 15px;
   padding-left: 15px;
   position: relative;
}
#LayoutGrid2 > .col-1
{
   flex: 0 0 auto;
}
#LayoutGrid2 > .col-1
{
   background-color: transparent;
   background-image: none;
   border: 0px solid #FFFFFF;
   border-radius: 0px;
   flex-basis: 100%;
   max-width: 100%;
   display: flex;
   flex-wrap: wrap;
   align-content: center;
   align-self: stretch;
   align-items: center;
   justify-content: center;
   text-align: center;
}
@media (max-width: 768px)
{
#LayoutGrid2 > .col-1
{
   flex-basis: 100% !important;
   max-width: 100% !important;
}
}
#wb_Card2
{
   position: relative;
   display: flex;
   flex-direction: column;
   box-sizing: border-box;
   margin: 0;
   background-color: transparent;
   background-image: none;
   border: 1px solid transparent;
   border-radius: 3px;
   text-align: center;
}
#Card2-card-body
{
   padding: 0;
   flex: 1 1 auto;
   font-size: 0;
}
#Card2-card-item0
{
   box-sizing: border-box;
   border-radius: 3px 3px 0 0 !important;
   margin: 0;
   width: 100%;
   height: auto;
}
.DropdownMenu1 .nav
{
   font-family: "Josefin Sans";
   font-weight: 700;
   font-size: 17px;
   font-style: normal;
   color: #191970;
   text-align: left;
   text-transform: none;
}
#DropdownMenu1, .DropdownMenu1 .nav, .DropdownMenu1 *
{
   margin: 0;
   padding: 0;
   box-sizing: border-box;
   line-height: 1;
   list-style: none;
}
.DropdownMenu1 .nav:before,
.DropdownMenu1 .nav:after 
{
   content: " ";
   display: table;
}
.DropdownMenu1 .nav:after 
{
   clear: both;
}
.DropdownMenu1 .nav a 
{
   text-decoration: none;
}
.DropdownMenu1 .nav ul
{
   margin-top: 0;
   margin-bottom: 0;
}
.DropdownMenu1 .nav ul ul
{
   margin-bottom: 0;
}
.DropdownMenu1 .container 
{
   margin-right: auto;
   margin-left: auto;
   padding: 0;
}
.DropdownMenu1 .container:before,
.DropdownMenu1 .container:after 
{
   content: " ";
   display: table;
}
.DropdownMenu1 .container:after 
{
   clear: both;
}
.DropdownMenu1 .collapse 
{
   display: none;
}
.DropdownMenu1 .collapse.show 
{
   display: block;
}
.DropdownMenu1 .collapsing 
{
   position: relative;
   height: 0;
   overflow: hidden;
   transition: height .35s ease;
}
.DropdownMenu1 .arrow, .DropdownMenu1 .arrow-right
{
   display: inline-block;
   margin-left: 4px;
   width: 0;
   height: 0;
   vertical-align: middle;
   border-top: 4px solid #000;
   border-right: 4px solid transparent;
   border-left: 4px solid transparent;
   border-bottom: 0 dotted;
   }
.DropdownMenu1 .dropdown 
{
   position: relative;
}
.DropdownMenu1 .dropdown-toggle:focus 
{
   outline: 0;
}
.DropdownMenu1 .dropdown-menu 
{
   position: absolute;
   top: 100%;
   left: 0;
   z-index: 1000;
   display: none;
   float: left;
   min-width: 160px;
   padding: 5px 0;
   margin: 2px 0 0;
   list-style: none;
   font-size: 17px;
   background-color: #FFFFFF;
   background-image: none;
   border: 1px solid rgba(197,197,197,1.00);
   border-radius: 6px;
   background-clip: padding-box;
}
.DropdownMenu1 .dropdown-menu .divider
{
   height: 1px;
   margin: 9px 0;
   overflow: hidden;
   background-color: #C5C5C5;
}
.DropdownMenu1 .dropdown-menu > li > a
{
   display: block;
   padding: 3px 20px 3px 20px;
   clear: both;
   line-height: 1.428571429;
   color: #191970;
   text-transform: none;
   white-space: nowrap;
}
.DropdownMenu1 .dropdown-menu > li > a:hover,
.DropdownMenu1 .dropdown-menu > li > a:focus 
{
   text-decoration: none;
   color: #2B2B2B;
   background-color: #EDEDED;
   background-image: none;
}
.DropdownMenu1 .dropdown-menu > li > a.active,
.DropdownMenu1 .dropdown-menu > li > a.active:hover,
.DropdownMenu1 .dropdown-menu > li > a.active:focus
{
   color: #2B2B2B;
   background-color: #EDEDED;
   background-image: none;
   text-decoration: none;
   outline: 0;
}
.DropdownMenu1 .show > .dropdown-menu
{
   display: block;
}
.DropdownMenu1 .show > a
{
   outline: 0;
}
.DropdownMenu1 .dropdown-header
{
   display: block;
   padding: 3px 20px;
   line-height: 1.428571429;
   color: #aeaeae;
}
.DropdownMenu1 .dropdown-backdrop
{
   position: fixed;
   left: 0;
   right: 0;
   bottom: 0;
   top: 0;
   z-index: 990;
}
.DropdownMenu1 .nav > li 
{
   position: relative;
   display: block;
}
.DropdownMenu1 .nav > li > a
{
   position: relative;
   display: block;
   padding: 10px 15px 10px 15px;
}
.DropdownMenu1 .nav .show > a,
.DropdownMenu1 .nav .show > a:hover,
.DropdownMenu1 .nav .show > a:focus
{
    border-color: #343A40;
}
.DropdownMenu1 .nav .nav-divider
{
   height: 1px;
   margin: 9px 0;
   overflow: hidden;
   background-color: #C5C5C5;
}
.DropdownMenu1 .nav .arrow
{
   border-top-color: #343A40;
   border-bottom-color: #343A40;
}
.DropdownMenu1
{
   position: relative;
}
.DropdownMenu1:before,
.DropdownMenu1:after
{
   content: " ";
   display: table;
}
.DropdownMenu1:after
{
   clear: both;
}
.DropdownMenu1 .navbar-header:before,
.DropdownMenu1 .navbar-header:after
{
   content: " ";
   display: table;
}
.DropdownMenu1 .navbar-header:after
{
   clear: both;
}
.DropdownMenu1-navbar-collapse 
{
   overflow-x: visible;
   -webkit-overflow-scrolling: touch;
}
.DropdownMenu1-navbar-collapse:before,
.DropdownMenu1-navbar-collapse:after
{
   content: " ";
   display: table;
}
.DropdownMenu1-navbar-collapse:after
{
   clear: both;
}
.DropdownMenu1-navbar-collapse.show
{
   overflow-y: auto;
}
.DropdownMenu1 .navbar-toggle 
{
   position: relative;
   float: right;
   width: 52px;
   height: 42px;
   padding: 10px 15px 10px 15px;
   background-color: transparent;
   border: 1px solid transparent;
   border-radius: 6px;
}
.DropdownMenu1 .navbar-toggle .line
{
   background-color: #4B0082;
}
.DropdownMenu1 .navbar-toggle .line
{
   display: block;
   width: 22px;
   height: 4px;
   border-radius: 0px;
   transition: all 500ms linear;
}
.DropdownMenu1 .navbar-toggle .line
{
   margin: 4px auto;
}
.DropdownMenu1 .navbar-toggle  .line:first-child
{
   margin-top: 0px !important;
}
.DropdownMenu1 .navbar-toggle  .line:last-child
{
   margin-bottom: 0px !important;
}
.DropdownMenu1 .navbar-nav
{
   margin: 6px -15px;
}
.DropdownMenu1 .navbar-nav > li > .dropdown-menu
{
   margin-top: 0;
}
.DropdownMenu1 .navbar-nav > li > a
{
   color: #191970;
}
.DropdownMenu1 .navbar-nav > li > a:hover,
.DropdownMenu1 .navbar-nav > li > a:focus
{
   background-color: #EDEDED;
   background-image: none;
   color: #2B2B2B;
   text-decoration: none;
}
.DropdownMenu1 .navbar-nav > li > a.active,
.DropdownMenu1 .navbar-nav > li > a.active:hover,
.DropdownMenu1 .navbar-nav > li > a.active:focus
{
   color: #2B2B2B;
   background-color: #EDEDED;
   background-image: none;
}
.DropdownMenu1 .navbar-toggle
{
   border: 1px solid transparent;
}
.DropdownMenu1 .navbar-toggle:hover,
.DropdownMenu1 .navbar-toggle:focus
{
   background-color: transparent;
}
.DropdownMenu1-navbar-collapse
{
   border-color: rgba(197,197,197,1.00);
}
.DropdownMenu1 .navbar-nav > .dropdown > a:hover .arrow,
.DropdownMenu1 .navbar-nav > .dropdown > a:focus .arrow
{
   border-top-color: #2B2B2B;
   border-bottom-color: #2B2B2B;
}
.DropdownMenu1 .navbar-nav > .show > a,
.DropdownMenu1 .navbar-nav > .show > a:hover,
.DropdownMenu1 .navbar-nav > .show > a:focus
{
   background-color: #EDEDED;
   background-image: none;
   color: #2B2B2B;
}
.DropdownMenu1 .navbar-nav > .show > a .arrow,
.DropdownMenu1 .navbar-nav > .show > a:hover .arrow,
.DropdownMenu1 .navbar-nav > .show > a:focus .arrow
{
   border-top-color: #2B2B2B;
   border-bottom-color: #2B2B2B;
}
.DropdownMenu1 .navbar-nav > .dropdown > a .arrow
{
   border-top-color: #191970;
   border-bottom-color: #191970;
}
.DropdownMenu1 .navbar-link
{
   color: #191970;
}
.DropdownMenu1 .navbar-link:hover
{
   color: #2B2B2B;
}
.DropdownMenu1 .navbar-header
{
   color: #4B0082;
}
@media (min-width: 480px) 
{
.DropdownMenu1 .navbar-right .dropdown-menu
{
   right: 0;
   left: auto;
}
.DropdownMenu1 .navbar-header
{
   float: left;
}
.DropdownMenu1-navbar-collapse
{
   width: auto;
   border-top: 0;
   box-shadow: none;
}
.DropdownMenu1-navbar-collapse.collapse
{
   display: block!important;
   height: auto!important;
   padding-bottom: 0;
   overflow: visible!important;
}
.DropdownMenu1-navbar-collapse.show
{
   overflow-y: auto;
}
.DropdownMenu1 .navbar-toggle
{
   display: none;
}
.DropdownMenu1 .navbar-nav
{
   display: flex;
   flex-direction: row;
   justify-content: center;
   margin: 0;
}
.DropdownMenu1 .navbar-nav > li
{
   float: left;
}
.DropdownMenu1 .container > .navbar-header,
.DropdownMenu1 .container > .DropdownMenu1-navbar-collapse
{
   margin-right: 0;
   margin-left: 0;
}
.DropdownMenu1 .navbar-nav > .dropdown > a:hover .arrow,
.DropdownMenu1 .navbar-nav > .dropdown > a:focus .arrow
{
   border-top-color: #FFFFFF;
   border-bottom-color: #FFFFFF;
}
}
@media (max-width: 480px) 
{
.DropdownMenu1 
{
   background-color: transparent;
   background-image: none;
   border: 1px solid rgba(255,255,255,0.00);
}
.DropdownMenu1 .navbar-nav
{
   margin: 0;
   background-color: #FFFFFF;
   background-image: none;
}
.DropdownMenu1 .navbar-nav .show .dropdown-menu
{
   position: static !important;
   transform: translate3d(0px, 0px, 0px) !important;
   float: none;
   width: auto;
   margin-top: 0;
   background-color: transparent;
   border: 0;
   box-shadow: none;
}
.DropdownMenu1 .navbar-nav .show .dropdown-menu > li > a,
.DropdownMenu1 .navbar-nav .show .dropdown-menu .dropdown-header
{
   padding: 5px 15px 5px 15px;
}
.DropdownMenu1 .navbar-nav .show .dropdown-menu > li > a
{
   line-height: 20px;
}
}
@media (min-width: 480px) 
{
.DropdownMenu1 
{
   background-color: transparent;
   background-image: none;
   border: 1px solid rgba(255,255,255,0.00);
   border-radius: 6px;
}
.DropdownMenu1 .navbar-nav > li > a
{
   color: #4B0082;
}
.DropdownMenu1 .navbar-nav > li > a:hover,
.DropdownMenu1 .navbar-nav > li > a:focus
{
   color: #FFFFFF;
   background-color: #684270;
   background-image: none;
}
.DropdownMenu1 .navbar-nav > li > a.active,
.DropdownMenu1 .navbar-nav > li > a.active:hover,
.DropdownMenu1 .navbar-nav > li > a.active:focus
{
   color: #FFFFFF;
   background-color: #684270;
   background-image: none;
}
.DropdownMenu1 .navbar-nav > .show > a,
.DropdownMenu1 .navbar-nav > .show > a:hover,
.DropdownMenu1 .navbar-nav > .show > a:focus
{
   background-color: #684270;
   background-image: none;
   color: #FFFFFF;
}
.DropdownMenu1 .navbar-nav > .dropdown > a:hover .arrow
{
   border-top-color: #FFFFFF;
   border-bottom-color: #FFFFFF;
}
.DropdownMenu1 .navbar-nav > .dropdown > a .arrow
{
   border-top-color: #4B0082;
   border-bottom-color: #4B0082;
}
.DropdownMenu1 .navbar-nav > li > a.active > .arrow,
.DropdownMenu1 .navbar-nav > li > a.active:hover > .arrow,
.DropdownMenu1 .navbar-nav > li > a.active:focus > .arrow
{
   border-top-color: #FFFFFF;
   border-bottom-color: #FFFFFF;
}
.DropdownMenu1 .navbar-nav > .show > a .arrow,
.DropdownMenu1 .navbar-nav > .show > a:hover .arrow,
.DropdownMenu1 .navbar-nav > .show > a:focus .arrow
{
   border-top-color: #FFFFFF;
   border-bottom-color: #FFFFFF;
}
.DropdownMenu1 .navbar-link
{
   color: #4B0082;
}
.DropdownMenu1 .navbar-link:hover 
{
   color: #fff;
}
}
.DropdownMenu1 .navbar-nav > li:first-child > a
{
   border-top-left-radius: 6px;
   border-bottom-left-radius: 6px;
}
.DropdownMenu1 .dropdown-menu > li:last-child > a
{
   border-bottom-left-radius: 6px;
   border-bottom-right-radius: 6px;
}
#DropdownMenu1 i
{
   font-size: 16px;
   position: relative;
   left: 0;
   top: 0;
   margin-right: 4px;
   width: 16px;
}
#wb_DropdownMenu1
{
   z-index: 1111 !important;
}
#wb_Card3
{
   position: relative;
   display: flex;
   flex-direction: column;
   box-sizing: border-box;
   margin: 0;
   background-color: transparent;
   background-image: none;
   border: 1px solid transparent;
   border-radius: 3px;
   text-align: center;
}
#Card3-card-body
{
   padding: 0;
   flex: 1 1 auto;
   font-size: 0;
}
#Card3-card-item0
{
   box-sizing: border-box;
   border-radius: 3px 3px 0 0 !important;
   margin: 0;
   width: 100%;
   height: auto;
}
#wb_adopciones
{
   clear: both;
   position: relative;
   table-layout: fixed;
   display: table;
   text-align: center;
   width: 100%;
   background-color: transparent;
   background-image: none;
   border: 0px solid #DDDDDD;
   border-radius: 0px;
   box-sizing: border-box;
   margin: 0;
}
#adopciones
{
   box-sizing: border-box;
   display: flex;
   flex-direction: row;
   flex-wrap: wrap;
   padding: 10px 0 10px 0;
   margin-right: auto;
   margin-left: auto;
}
#adopciones > .col-1
{
   box-sizing: border-box;
   font-size: 0;
   min-height: 1px;
   padding-right: 15px;
   padding-left: 15px;
   position: relative;
}
#adopciones > .col-1
{
   flex: 0 0 auto;
}
#adopciones > .col-1
{
   background-color: transparent;
   background-image: none;
   border: 0px solid #FFFFFF;
   border-radius: 0px;
   flex-basis: 100%;
   max-width: 100%;
   display: flex;
   flex-wrap: wrap;
   align-content: center;
   align-self: stretch;
   align-items: center;
   justify-content: center;
   text-align: center;
}
@media (max-width: 768px)
{
#adopciones > .col-1
{
   flex-basis: 100% !important;
   max-width: 100% !important;
}
}
#wb_Card4
{
   position: relative;
   display: flex;
   flex-direction: column;
   box-sizing: border-box;
   margin: 0;
   background-color: transparent;
   background-image: none;
   border: 1px solid transparent;
   border-radius: 3px;
   text-align: center;
}
#Card4-card-body
{
   padding: 0;
   flex: 1 1 auto;
   font-size: 0;
}
#Card4-card-item0
{
   box-sizing: border-box;
   border-radius: 3px 3px 0 0 !important;
   margin: 0;
   width: 100%;
   height: auto;
}
#wb_donaciones
{
   clear: both;
   position: relative;
   table-layout: fixed;
   display: table;
   text-align: center;
   width: 100%;
   background-color: transparent;
   background-image: none;
   border: 0px solid #DDDDDD;
   border-radius: 0px;
   box-sizing: border-box;
   margin: 0;
}
#donaciones
{
   box-sizing: border-box;
   display: flex;
   flex-direction: row;
   flex-wrap: wrap;
   padding: 10px 0 10px 0;
   margin-right: auto;
   margin-left: auto;
}
#donaciones > .col-1
{
   box-sizing: border-box;
   font-size: 0;
   min-height: 1px;
   padding-right: 15px;
   padding-left: 15px;
   position: relative;
}
#donaciones > .col-1
{
   flex: 0 0 auto;
}
#donaciones > .col-1
{
   background-color: transparent;
   background-image: none;
   border: 0px solid #FFFFFF;
   border-radius: 0px;
   flex-basis: 100%;
   max-width: 100%;
   display: flex;
   flex-wrap: wrap;
   align-content: center;
   align-self: stretch;
   align-items: center;
   justify-content: center;
   text-align: center;
}
@media (max-width: 768px)
{
#donaciones > .col-1
{
   flex-basis: 100% !important;
   max-width: 100% !important;
}
}
#wb_Card5
{
   position: relative;
   display: flex;
   flex-direction: column;
   box-sizing: border-box;
   margin: 0;
   background-color: transparent;
   background-image: none;
   border: 1px solid transparent;
   border-radius: 3px;
   text-align: center;
}
#Card5-card-body
{
   padding: 0;
   flex: 1 1 auto;
   font-size: 0;
}
#Card5-card-item0
{
   box-sizing: border-box;
   border-radius: 3px 3px 0 0 !important;
   margin: 0;
   width: 100%;
   height: auto;
}
#wb_reportes
{
   clear: both;
   position: relative;
   table-layout: fixed;
   display: table;
   text-align: center;
   width: 100%;
   background-color: transparent;
   background-image: none;
   border: 0px solid #DDDDDD;
   border-radius: 0px;
   box-sizing: border-box;
   margin: 0;
}
#reportes
{
   box-sizing: border-box;
   display: flex;
   flex-direction: row;
   flex-wrap: wrap;
   padding: 10px 0 10px 0;
   margin-right: auto;
   margin-left: auto;
}
#reportes > .col-1
{
   box-sizing: border-box;
   font-size: 0;
   min-height: 1px;
   padding-right: 15px;
   padding-left: 15px;
   position: relative;
}
#reportes > .col-1
{
   flex: 0 0 auto;
}
#reportes > .col-1
{
   background-color: transparent;
   background-image: none;
   border: 0px solid #FFFFFF;
   border-radius: 0px;
   flex-basis: 100%;
   max-width: 100%;
   display: flex;
   flex-wrap: wrap;
   align-content: center;
   align-self: stretch;
   align-items: center;
   justify-content: center;
   text-align: center;
}
@media (max-width: 768px)
{
#reportes > .col-1
{
   flex-basis: 100% !important;
   max-width: 100% !important;
}
}
#wb_contact
{
   clear: both;
   position: relative;
   table-layout: fixed;
   display: table;
   text-align: center;
   width: 100%;
   background-color: transparent;
   background-image: none;
   border: 0px solid #DDDDDD;
   border-radius: 0px;
   box-sizing: border-box;
   margin: 0;
}
#contact
{
   box-sizing: border-box;
   display: flex;
   flex-direction: row;
   flex-wrap: wrap;
   padding: 10px 0 10px 0;
   margin-right: auto;
   margin-left: auto;
}
#contact > .col-1
{
   box-sizing: border-box;
   font-size: 0;
   min-height: 1px;
   padding-right: 15px;
   padding-left: 15px;
   position: relative;
}
#contact > .col-1
{
   flex: 0 0 auto;
}
#contact > .col-1
{
   background-color: transparent;
   background-image: none;
   border: 0px solid #FFFFFF;
   border-radius: 0px;
   flex-basis: 100%;
   max-width: 100%;
   display: flex;
   flex-wrap: wrap;
   align-content: center;
   align-self: stretch;
   align-items: center;
   justify-content: center;
   text-align: center;
}
@media (max-width: 768px)
{
#contact > .col-1
{
   flex-basis: 100% !important;
   max-width: 100% !important;
}
}
#wb_Card6
{
   position: relative;
   display: flex;
   flex-direction: column;
   box-sizing: border-box;
   margin: 0;
   background-color: transparent;
   background-image: none;
   border: 1px solid transparent;
   border-radius: 3px;
   text-align: center;
}
#Card6-card-body
{
   padding: 0;
   flex: 1 1 auto;
   font-size: 0;
}
#Card6-card-item0
{
   box-sizing: border-box;
   border-radius: 3px 3px 0 0 !important;
   margin: 0;
   width: 100%;
   height: auto;
}
#wb_Card7
{
   position: relative;
   display: flex;
   flex-direction: column;
   box-sizing: border-box;
   margin: 0;
   background-color: transparent;
   background-image: none;
   border: 1px solid transparent;
   border-radius: 3px;
   text-align: center;
}
#Card7-card-body
{
   padding: 0;
   flex: 1 1 auto;
   font-size: 0;
}
#Card7-card-item0
{
   box-sizing: border-box;
   border-radius: 3px 3px 0 0 !important;
   margin: 0;
   width: 100%;
   height: auto;
}
* {
    box-sizing: border-box;
}

body {
    margin: 0;
    font-family: Arial, sans-serif;
    background: #cbb6d4;
}

/* HEADER */
.mia-header {
    width: 100%;
    padding: 22px 16px; /* 🔥 espacio para que se vean los bordes */
}

/* CONTENEDOR */
.mia-header-card {
    position: relative;
    width: 100%;
    min-height: 190px;
    border-radius: 28px; /* 🔥 ESQUINAS REDONDEADAS */
    overflow: hidden;
    background: linear-gradient(135deg, #ffffff 0%, #f6edf8 55%, #ead8ef 100%);
    box-shadow: 0 18px 40px rgba(75, 46, 131, 0.18);
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 28px 6vw;
    isolation: isolate;
}

/* EFECTOS */
.mia-header-card::before {
    content: "";
    position: absolute;
    width: 260px;
    height: 260px;
    border-radius: 50%;
    background: rgba(151, 91, 169, 0.16);
    top: -90px;
    right: -70px;
    z-index: -1;
}

.mia-header-card::after {
    content: "🐾";
    position: absolute;
    font-size: 150px;
    opacity: 0.07;
    left: 30px;
    bottom: -45px;
    transform: rotate(-18deg);
    z-index: -1;
}

/* TEXTO */
.mia-header-text {
    max-width: 560px;
}

.mia-title {
    margin: 0;
    font-size: clamp(30px, 5vw, 52px);
    line-height: 1.05;
    color: #4b2e83;
    font-weight: 900;
}

.mia-subtitle {
    margin: 12px 0 0;
    color: #6b5670;
    font-size: clamp(13px, 1.6vw, 16px);
    line-height: 1.5;
}

/* IMAGEN */
.mia-image-wrap {
    position: relative;
    flex-shrink: 0;
}

.mia-image-wrap::before {
    content: "";
    position: absolute;
    inset: -9px;
    border-radius: 50%;
    background: linear-gradient(135deg, #9b6bb0, #f7d7ef, #ffffff);
    animation: glow 3s ease-in-out infinite;
    z-index: 0;
}

.mia-image {
    position: relative;
    z-index: 1;
    width: clamp(120px, 22vw, 190px);
    height: clamp(120px, 22vw, 190px);
    object-fit: cover;
    border-radius: 50%;
    border: 6px solid #ffffff;
    box-shadow: 0 12px 28px rgba(75, 46, 131, 0.25);
    animation: floatMia 4s ease-in-out infinite;
}

/* ANIMACIONES */
@keyframes floatMia {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-8px); }
}

@keyframes glow {
    0%, 100% { transform: scale(1); opacity: 0.75; }
    50% { transform: scale(1.04); opacity: 1; }
}

/* RESPONSIVE */
@media (max-width: 768px) {
    .mia-header-card {
        flex-direction: column-reverse;
        text-align: center;
        padding: 28px 20px;
        gap: 18px;
        border-radius: 24px;
    }
}

@media (max-width: 480px) {
    .mia-header {
        padding: 14px 10px;
    }

    .mia-header-card {
        padding: 24px 16px;
        min-height: auto;
        border-radius: 22px;
    }

    .mia-title {
        font-size: 32px;
    }
}
/* CONTENEDOR GENERAL */
.hm-counter-wrap{
    width:100%;

    display:flex;
    justify-content:flex-end;
    align-items:center;

    padding:18px 30px 8px 30px;

    box-sizing:border-box;
}

/* CARD */
.hm-live-counter{
    display:flex;
    align-items:center;
    gap:14px;

    width:max-content;

    padding:14px 22px;

    border-radius:999px;

    background:
    rgba(255,255,255,0.82);

    backdrop-filter:blur(12px);

    border:1px solid rgba(122,76,194,.12);

    box-shadow:
    0 10px 30px rgba(109,59,189,.10);

    position:relative;

    overflow:hidden;
}

/* EFECTO LUZ */
.hm-live-counter::before{
    content:"";

    position:absolute;

    width:120px;
    height:120px;

    right:-50px;
    top:-50px;

    background:
    radial-gradient(circle,
    rgba(255,223,120,.35),
    transparent 70%);
}

/* PUNTO LIVE */
.hm-live-dot{
    width:10px;
    height:10px;

    border-radius:50%;

    background:#7b4dff;

    box-shadow:
    0 0 0 6px rgba(123,77,255,.12);

    animation:hmPulse 2s infinite;
}

@keyframes hmPulse{

    0%{
        transform:scale(1);
        opacity:1;
    }

    70%{
        transform:scale(1.4);
        opacity:.3;
    }

    100%{
        transform:scale(1);
        opacity:1;
    }
}

/* ICONO */
.hm-live-icon{
    width:52px;
    height:52px;

    border-radius:18px;

    display:flex;
    align-items:center;
    justify-content:center;

    font-size:24px;

    background:
    linear-gradient(135deg,#7a4cc2,#b56cff);

    color:#fff;

    box-shadow:
    0 8px 18px rgba(122,76,194,.25);

    position:relative;
    z-index:2;
}

/* INFO */
.hm-live-info{
    display:flex;
    flex-direction:column;
    line-height:1.05;

    position:relative;
    z-index:2;
}

.hm-live-label{
    font-size:13px;
    font-weight:800;
    color:#7a4cc2;
    letter-spacing:.8px;
    text-transform:uppercase;
}

.hm-live-number{
    font-size:34px;
    font-weight:900;
    color:#4b2e83;
}

/* TABLET */
@media(max-width:991px){

    .hm-counter-wrap{
        padding:16px 24px 8px 24px;
    }

}

/* MOBILE */
@media(max-width:768px){

    .hm-counter-wrap{
        justify-content:flex-end;

        padding:14px 18px 6px 18px;
    }

    .hm-live-counter{
        padding:12px 18px;
        gap:12px;
    }

    .hm-live-icon{
        width:46px;
        height:46px;
        font-size:21px;
    }

    .hm-live-number{
        font-size:28px;
    }

}

    :root {
      --morado: #3c245f;
      --morado-2: #6f48aa;
      --morado-3: #8b63c7;
      --morado-suave: #f1eafa;
      --amarillo: #f4d76d;
      --verde-suave: #edf7ed;
      --verde: #356d3d;
      --texto: #352052;
      --texto-suave: #6f6380;
      --blanco: #ffffff;
      --sombra: 0 24px 60px rgba(75, 43, 117, 0.18);
    }

    * {
      margin: 0;
      padding: 0;
      box-sizing: border-box;
    }

    html {
      scroll-behavior: smooth;
    }

    body {
      font-family: "Inter", "Segoe UI", Arial, sans-serif;
      background:
        radial-gradient(circle at 12% 10%, #f4edff 0%, transparent 36%),
        radial-gradient(circle at 90% 15%, rgba(244, 215, 109, 0.18) 0%, transparent 28%),
        linear-gradient(135deg, #faf7ff 0%, #ffffff 54%, #f5effc 100%);
      color: var(--texto);
      min-height: 100vh;
    }

    .hero {
      min-height: 100vh;
      display: flex;
      align-items: center;
      padding: 58px 6%;
      overflow: hidden;
    }

    .hero-content {
      width: 100%;
      max-width: 1480px;
      margin: auto;
      display: grid;
      grid-template-columns: 1.08fr 0.92fr;
      gap: 68px;
      align-items: center;
    }

    .text {
      text-align: center;
      animation: fadeUp 0.9s ease both;
    }

    .badge {
      display: flex;
      justify-content: center;
      align-items: center;
      gap: 9px;
      width: fit-content;
      margin: 0 auto 28px auto;
      padding: 12px 22px;
      border-radius: 999px;
      background: rgba(255,255,255,0.86);
      color: var(--morado);
      font-size: 14px;
      font-weight: 850;
      box-shadow: 0 10px 28px rgba(75, 43, 117, 0.12);
      backdrop-filter: blur(14px);
      border: 1px solid rgba(255,255,255,0.85);
    }

    h1 {
      max-width: 820px;
      margin: 0 auto 18px auto;
      font-size: clamp(44px, 5.8vw, 78px);
      line-height: 1.04;
      letter-spacing: -2.4px;
      font-weight: 950;
      color: var(--texto);
    }

    .intro {
      max-width: 820px;
      margin: 0 auto 30px auto;
      color: var(--texto-suave);
      font-size: clamp(16px, 1.35vw, 19px);
      line-height: 1.65;
      font-weight: 650;
    }

    .actions {
      display: flex;
      justify-content: center;
      flex-wrap: wrap;
      gap: 14px;
      margin-bottom: 38px;
    }

    .btn {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 9px;
      min-height: 52px;
      padding: 14px 26px;
      border-radius: 999px;
      border: 2px solid transparent;
      text-decoration: none;
      font-size: 15.5px;
      font-weight: 900;
      transition: all 0.28s ease;
      white-space: nowrap;
      cursor: pointer;
      position: relative;
      overflow: hidden;
    }

    .btn::before{
      content:"";
      position:absolute;
      inset:0;
      background:linear-gradient(
        120deg,
        transparent 20%,
        rgba(255,255,255,.22) 50%,
        transparent 80%
      );
      transform:translateX(-120%);
      transition:0.7s ease;
    }

    .btn:hover::before{
      transform:translateX(120%);
    }

    .btn-primary {
      color: var(--blanco);
      background: linear-gradient(135deg, var(--morado-3), var(--morado));
      box-shadow: 0 15px 30px rgba(75, 43, 117, 0.24);
    }

    .btn-yellow {
      color: #3d2d10;
      background: linear-gradient(135deg, #ffe98d, var(--amarillo));
      box-shadow: 0 15px 28px rgba(244, 215, 109, 0.34);
    }

    .btn-light {
      color: var(--morado);
      background: rgba(255,255,255,0.86);
      border-color: #e8def2;
      box-shadow: 0 10px 25px rgba(75, 43, 117, 0.07);
    }

    /* NUEVO CHIP CASOS URGENTES */
    .btn-urgent{
      color:#fff;
      background: linear-gradient(135deg, #ff7a18, #ff3d54);
      box-shadow: 0 15px 30px rgba(255, 82, 82, 0.28);
      animation: pulseUrgent 2s infinite;
    }

    .btn-urgent:hover{
      transform: translateY(-4px) scale(1.03);
      box-shadow: 0 22px 42px rgba(255, 82, 82, 0.38);
    }

    .btn:hover {
      transform: translateY(-4px) scale(1.02);
      box-shadow: 0 22px 42px rgba(75, 43, 117, 0.28);
    }

    .mini-cards {
      max-width: 850px;
      margin: 0 auto;
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 16px;
    }

    .mini-card {
      min-height: 145px;
      padding: 22px 20px;
      border-radius: 24px;
      background: rgba(255, 255, 255, 0.9);
      box-shadow: 0 16px 38px rgba(75, 43, 117, 0.10);
      border: 1px solid rgba(255,255,255,0.8);
      transition: all 0.28s ease;
    }

    .mini-card:hover {
      transform: translateY(-6px);
      box-shadow: 0 22px 46px rgba(75, 43, 117, 0.16);
    }

    .mini-card .icon {
      display: block;
      margin-bottom: 10px;
      font-size: 27px;
    }

    .mini-card h3 {
      margin-bottom: 8px;
      color: var(--morado-2);
      font-size: 23px;
      line-height: 1;
      font-weight: 950;
    }

    .mini-card p {
      color: #514462;
      font-size: 14px;
      line-height: 1.45;
      font-weight: 800;
    }

    .visual {
      position: relative;
      display: flex;
      justify-content: center;
      align-items: center;
      animation: fadeZoom 0.95s ease 0.15s both;
    }

    .purple-frame {
      position: relative;
      width: min(100%, 540px);
      padding: 58px 44px;
      border-radius: 42px;
      background:
        radial-gradient(circle at 15% 20%, rgba(255,255,255,0.16), transparent 34%),
        linear-gradient(145deg, #6640a0, #9366c9);
      box-shadow:
        0 28px 70px rgba(75, 43, 117, 0.24),
        inset 0 1px 0 rgba(255,255,255,0.22);
    }

    .purple-frame::before {
      content: "";
      position: absolute;
      inset: 16px;
      border-radius: 34px;
      border: 1px solid rgba(255,255,255,0.18);
      pointer-events: none;
    }

    .floating-paw {
      position: absolute;
      top: 25px;
      right: 26px;
      z-index: 4;
      width: 76px;
      height: 76px;
      display: grid;
      place-items: center;
      border-radius: 50%;
      background: linear-gradient(135deg, #ffe985, var(--amarillo));
      font-size: 34px;
      box-shadow: 0 20px 38px rgba(244, 215, 109, 0.42);
      animation: float 3.4s ease-in-out infinite;
    }

    .main-card {
      position: relative;
      z-index: 2;
      padding: 20px;
      border-radius: 32px;
      background: rgba(255,255,255,0.96);
      box-shadow:
        0 26px 52px rgba(43, 24, 76, 0.18),
        inset 0 1px 0 rgba(255,255,255,0.95);
      text-align: center;
      overflow: hidden;
    }

    .photo-shell {
      position: relative;
      overflow: hidden;
      border-radius: 30px;
      background: linear-gradient(135deg, #f8f4ff, #ffffff);
      border: 1px solid #eee7f7;
      box-shadow: 0 14px 32px rgba(75, 43, 117, 0.14);
    }

    .photo-shell::after {
      content: "";
      position: absolute;
      inset: 0;
      border-radius: 30px;
      box-shadow: inset 0 0 0 1px rgba(255,255,255,0.75);
      pointer-events: none;
    }

    .mia-photo {
      width: 100%;
      height: 300px;
      display: block;
      object-fit: contain;
      object-position: center;
      padding: 10px;
      border-radius: 30px;
      transition: transform 0.55s ease, filter 0.55s ease;
    }

    .photo-shell:hover .mia-photo {
      transform: scale(1.035);
      filter: saturate(1.05) contrast(1.02);
    }

    .tag-wrap {
      display: flex;
      justify-content: center;
      width: 100%;
    }

    .tag {
      display: inline-flex;
      justify-content: center;
      align-items: center;
      gap: 7px;
      width: fit-content;
      margin: 14px auto 12px auto;
      padding: 8px 14px;
      border-radius: 999px;
      background: var(--verde-suave);
      color: var(--verde);
      font-size: 13px;
      font-weight: 900;
      text-align: center;
      box-shadow: 0 8px 18px rgba(53, 109, 61, 0.10);
    }

    .main-card h2 {
      max-width: 460px;
      margin: 0 auto 12px auto;
      color: var(--texto);
      font-size: clamp(23px, 2vw, 28px);
      line-height: 1.35;
      letter-spacing: -0.35px;
      font-weight: 950;
    }

    .main-card p {
      max-width: 450px;
      margin: 0 auto 16px auto;
      color: var(--texto-suave);
      font-size: 15.2px;
      line-height: 1.58;
      font-weight: 650;
    }

    .rainbow-note {
      max-width: 440px;
      margin: 18px auto 2px auto;
      padding: 14px 16px;
      border-radius: 18px;
      border-left: 5px solid var(--morado-3);
      background: var(--morado-suave);
      color: var(--texto);
      font-size: 13.5px;
      line-height: 1.45;
      font-weight: 850;
      text-align: center;
      box-shadow: inset 0 1px 0 rgba(255,255,255,0.75);
    }

    .main-card .btn {
      margin-top: 16px;
      padding-inline: 28px;
    }

    @keyframes pulseUrgent{
      0%{
        box-shadow:0 0 0 0 rgba(255,61,84,.45);
      }
      70%{
        box-shadow:0 0 0 16px rgba(255,61,84,0);
      }
      100%{
        box-shadow:0 0 0 0 rgba(255,61,84,0);
      }
    }

    @keyframes float {
      0%, 100% { transform: translateY(0); }
      50% { transform: translateY(-12px); }
    }

    @keyframes fadeUp {
      from {
        opacity: 0;
        transform: translateY(22px);
      }
      to {
        opacity: 1;
        transform: translateY(0);
      }
    }

    @keyframes fadeZoom {
      from {
        opacity: 0;
        transform: translateY(18px) scale(0.96);
      }
      to {
        opacity: 1;
        transform: translateY(0) scale(1);
      }
    }

    @media (max-width: 1120px) {
      .hero {
        padding: 44px 5%;
      }

      .hero-content {
        grid-template-columns: 1fr;
        gap: 46px;
      }

      .visual {
        order: -1;
      }

      .purple-frame {
        max-width: 580px;
      }
    }

    @media (max-width: 760px) {
      .hero {
        padding: 28px 18px 42px;
      }

      .hero-content {
        gap: 34px;
      }

      .badge {
        flex-wrap: wrap;
        padding: 11px 16px;
        font-size: 12.5px;
        margin-bottom: 22px;
      }

      h1 {
        font-size: clamp(38px, 12vw, 56px);
        letter-spacing: -1.5px;
        margin-bottom: 18px;
      }

      .intro {
        font-size: 16px;
        line-height: 1.62;
        margin-bottom: 24px;
      }

      .actions {
        flex-direction: column;
        gap: 12px;
        margin-bottom: 30px;
      }

      .btn {
        width: 100%;
        min-height: 50px;
        font-size: 15px;
      }

      .mini-cards {
        grid-template-columns: 1fr;
        gap: 14px;
      }

      .mini-card {
        min-height: auto;
        padding: 20px;
      }

      .purple-frame {
        padding: 24px;
        border-radius: 34px;
      }

      .floating-paw {
        width: 64px;
        height: 64px;
        font-size: 30px;
        top: 8px;
        right: 8px;
      }

      .main-card {
        padding: 15px;
        border-radius: 28px;
      }

      .photo-shell,
      .photo-shell::after,
      .mia-photo {
        border-radius: 24px;
      }

      .mia-photo {
        height: 270px;
      }

      .main-card h2 {
        font-size: 23px;
      }

      .main-card p {
        font-size: 15px;
      }
    }

    @media (max-width: 420px) {
      .badge {
        max-width: 100%;
        text-align: center;
        line-height: 1.35;
      }

      .mia-photo {
        height: 235px;
      }

      .purple-frame {
        padding: 18px;
      }
    }
  :root{
  --morado:#4b2e78;
  --morado-oscuro:#321d57;
  --dorado:#f4cf63;
  --fondo:#faf7ff;
  --texto:#5f5472;
  --blanco:#ffffff;
}

*{
  box-sizing:border-box;
}

body{
  margin:0;
  font-family:Arial, Helvetica, sans-serif;
  background:var(--fondo);
  color:var(--morado-oscuro);
}

.hm-section{
  width:100%;
  padding:44px 5%;
}

/* HERO SUPERIOR */
.hm-hero{
  position:relative;
  overflow:hidden;
  max-width:1500px;
  margin:0 auto 150px;
  min-height:280px;
  border-radius:48px;
  padding:72px 70px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:30px;
  background:
    linear-gradient(90deg, rgba(65,34,105,.96), rgba(87,54,137,.88)),
    url("https://huellasdemia.com/mia1.jpeg") center/cover no-repeat;
  box-shadow:0 24px 60px rgba(75,46,120,.18);
}

.hm-hero::after{
  content:"";
  position:absolute;
  inset:0;
  background:radial-gradient(circle at right, rgba(255,255,255,.12), transparent 42%);
  pointer-events:none;
}

.hm-hero-content{
  position:relative;
  z-index:2;
  max-width:970px;
}

.hm-hero h1{
  margin:0 0 18px;
  color:#fff;
  font-size:clamp(34px, 5vw, 68px);
  line-height:1.05;
  font-weight:900;
  letter-spacing:-1.8px;
}

.hm-hero p{
  margin:0;
  color:rgba(255,255,255,.92);
  font-size:clamp(17px, 2vw, 23px);
  line-height:1.55;
  max-width:1000px;
}

.hm-btn{
  position:relative;
  z-index:2;
  flex:0 0 auto;
  text-decoration:none;
  background:var(--dorado);
  color:#3b2a22;
  font-size:19px;
  font-weight:900;
  padding:23px 34px;
  border-radius:999px;
  box-shadow:0 12px 24px rgba(244,207,99,.28);
  transition:all .25s ease;
  white-space:nowrap;
}

.hm-btn:hover{
  transform:translateY(-3px);
  box-shadow:0 18px 34px rgba(244,207,99,.42);
  filter:saturate(1.08);
}

/* SECCIÓN APOYO */
.hm-support{
  max-width:1500px;
  margin:0 auto;
  text-align:center;
}

.hm-support h2{
  margin:0 0 14px;
  color:var(--morado);
  font-size:clamp(36px, 5vw, 68px);
  line-height:1.05;
  font-weight:900;
  letter-spacing:-1.4px;
}

.hm-support > p{
  margin:0 auto 56px;
  max-width:900px;
  color:var(--texto);
  font-size:clamp(17px, 1.8vw, 21px);
  line-height:1.5;
}

.hm-cards{
  display:grid;
  grid-template-columns:repeat(4, 1fr);
  gap:28px;
}

.hm-card-link{
  text-decoration:none;
  color:inherit;
  display:flex;
}

.hm-card{
  background:var(--blanco);
  border:1px solid rgba(75,46,120,.10);
  border-radius:28px;
  padding:34px 32px;
  text-align:left;
  min-height:270px;
  box-shadow:0 16px 44px rgba(52,31,87,.06);
  transition:all .25s ease;
  cursor:pointer;
  height:100%;
}

.hm-card:hover{
  transform:translateY(-6px);
  box-shadow:0 22px 56px rgba(52,31,87,.12);
}

.hm-number{
  width:48px;
  height:48px;
  border-radius:50%;
  background:#6c46ad;
  color:#fff;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:21px;
  font-weight:900;
  margin-bottom:28px;
}

.hm-card h3{
  margin:0 0 16px;
  font-size:25px;
  color:var(--morado-oscuro);
}

.hm-card p{
  margin:0;
  color:var(--texto);
  font-size:18px;
  line-height:1.55;
}

/* RESPONSIVE */
@media(max-width:1100px){
  .hm-hero{
    margin-bottom:100px;
    padding:58px 44px;
    border-radius:38px;
  }

  .hm-cards{
    grid-template-columns:repeat(2, 1fr);
  }
}

@media(max-width:760px){
  .hm-section{
    padding:26px 18px;
  }

  .hm-hero{
    margin-bottom:72px;
    padding:42px 28px;
    min-height:auto;
    flex-direction:column;
    align-items:flex-start;
    border-radius:30px;
  }

  .hm-hero h1{
    letter-spacing:-.8px;
  }

  .hm-btn{
    width:100%;
    text-align:center;
    padding:19px 26px;
    font-size:17px;
  }

  .hm-cards{
    grid-template-columns:1fr;
    gap:20px;
  }

  .hm-card{
    min-height:auto;
    padding:28px 26px;
  }

  .hm-support > p{
    margin-bottom:36px;
  }
}

@media(max-width:420px){
  .hm-hero{
    padding:34px 22px;
    border-radius:24px;
  }

  .hm-card h3{
    font-size:22px;
  }

  .hm-card p{
    font-size:16px;
  }
}
    .hm-ayuda-section {
      width: 100%;
      padding: 70px 18px;
      background:
        radial-gradient(circle at top left, rgba(255, 206, 132, .35), transparent 35%),
        radial-gradient(circle at bottom right, rgba(129, 202, 154, .28), transparent 35%),
        linear-gradient(135deg, #fff8ec 0%, #fff3f5 48%, #f3fff7 100%);
      font-family: "Poppins", Arial, sans-serif;
    }

    .hm-ayuda-chip-top {
      width: 100%;
      text-align: center;
      margin-bottom: 30px;
    }

    .hm-ayuda-chip {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      padding: 9px 18px;
      border-radius: 999px;
      background: rgba(255, 255, 255, .9);
      color: #5d3b86;
      font-size: 14px;
      font-weight: 700;
      box-shadow: 0 10px 28px rgba(68, 42, 98, .12);
    }

    .hm-ayuda-wrap {
      max-width: 1180px;
      margin: 0 auto;
      display: grid;
      grid-template-columns: 1.05fr .95fr;
      gap: 42px;
      align-items: center;
    }

    .hm-ayuda-content {
      z-index: 2;
    }

    .hm-ayuda-title {
      margin: 0;
      font-size: clamp(34px, 5vw, 62px);
      line-height: 1.03;
      color: #2f2352;
      font-weight: 900;
    }

    .hm-ayuda-title span {
      color: #e85d75;
    }

    .hm-ayuda-text {
      margin-top: 22px;
      color: #4c465c;
      font-size: 18px;
      line-height: 1.7;
    }

    /* BOTÓN DONACIONES */
    .hm-wa-btn {
      margin-top: 30px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 12px;
      padding: 16px 28px;
      border-radius: 999px;
      background: linear-gradient(135deg, #ff7b54, #ff477e);
      color: #fff;
      text-decoration: none;
      font-weight: 800;
      font-size: 16px;
      box-shadow: 0 15px 35px rgba(255, 71, 126, .30);
      transition: all .3s ease;
    }

    .hm-wa-btn:hover {
      transform: translateY(-3px) scale(1.03);
      box-shadow: 0 18px 45px rgba(255, 71, 126, .42);
    }

    .hm-wa-btn img {
      width: 22px;
      height: 22px;
      object-fit: contain;
    }

    .hm-ayuda-image-box {
      position: relative;
      display: flex;
      justify-content: center;
    }

    .hm-ayuda-img {
      width: min(100%, 500px);
      border-radius: 30px;
    }

    @media (max-width: 920px) {
      .hm-ayuda-wrap {
        grid-template-columns: 1fr;
        text-align: center;
      }

      .hm-wa-btn {
        width: 100%;
        max-width: 320px;
      }

      .hm-ayuda-image-box {
        margin-top: 10px;
      }
    }
  .hm-report-widget,
.hm-report-widget *{
  box-sizing:border-box;
}

.hm-report-widget{
  position:relative;
  z-index:999999999 !important;
}

/* BOTÓN FLOTANTE */
.hm-paw-report-btn{
  position:fixed !important;
  left:24px !important;
  bottom:24px !important;
  z-index:999999998 !important;
  border:none;
  background:transparent;
  padding:0;
  cursor:pointer;
  display:flex;
  align-items:center;
  gap:16px;
}

.hm-paw-circle{
  width:84px;
  height:84px;
  border-radius:50%;
  background:linear-gradient(135deg,#ff8a3d,#ff5e62);
  display:flex;
  align-items:center;
  justify-content:center;
  position:relative;
  box-shadow:0 22px 45px rgba(255,94,98,.35);
  animation:hmPulse 2.4s infinite ease-in-out;
}

.hm-paw-circle::before{
  content:"";
  position:absolute;
  inset:-8px;
  border-radius:50%;
  background:rgba(255,138,61,.18);
  animation:hmRipple 2.4s infinite ease-out;
  z-index:-1;
}

.hm-paw-circle img{
  width:50px;
  height:50px;
  object-fit:contain;
}

.hm-paw-label{
  background:#fff;
  color:#ff5e62;
  padding:18px 28px;
  border-radius:999px;
  font-size:18px;
  font-weight:900;
  white-space:nowrap;
  box-shadow:0 18px 45px rgba(255,94,98,.18);
}

/* OVERLAY SIEMPRE ENCIMA */
.hm-report-overlay{
  position:fixed !important;
  inset:0 !important;
  width:100vw !important;
  height:100vh !important;
  z-index:2147483647 !important;
  background:rgba(20,14,35,.72);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
  display:none;
  align-items:center;
  justify-content:center;
  padding:20px;
  isolation:isolate !important;
  pointer-events:auto !important;
}

.hm-report-overlay.active{
  display:flex !important;
}

/* POPUP */
.hm-report-popup{
  position:relative !important;
  z-index:2147483647 !important;
  width:min(92vw,560px);
  background:#fff;
  border-radius:34px;
  overflow:hidden;
  box-shadow:0 45px 120px rgba(0,0,0,.55);
  animation:hmPopupIn .28s ease;
}

/* HEADER */
.hm-report-header{
  position:relative;
  padding:40px 30px 34px;
  text-align:center;
  overflow:hidden;
  background:
    radial-gradient(circle at 20% 10%,rgba(255,255,255,.16),transparent 28%),
    linear-gradient(135deg,#ff9a57,#ff6666);
  color:#fff;
}

.hm-close-report{
  position:absolute !important;
  top:18px !important;
  right:18px !important;
  z-index:2147483647 !important;
  width:52px;
  height:52px;
  border:none;
  border-radius:50%;
  background:rgba(255,255,255,.20);
  color:#fff;
  font-size:34px;
  line-height:1;
  cursor:pointer;
}

.hm-big-paw{
  width:105px;
  height:105px;
  margin:0 auto 22px;
  border-radius:30px;
  background:rgba(255,255,255,.18);
  display:flex;
  align-items:center;
  justify-content:center;
}

.hm-big-paw img{
  width:64px;
  height:64px;
}

.hm-report-header h3{
  margin:0;
  font-size:34px;
  font-weight:950;
  line-height:1.1;
  color:#000;
}

.hm-report-header p{
  margin:18px auto 0;
  max-width:400px;
  font-size:16px;
  line-height:1.7;
  color:rgba(255,255,255,.96);
}

/* BODY */
.hm-report-body{
  padding:34px 30px;
  text-align:center;
  background:#fffdfc;
}

.hm-report-note{
  margin:0 0 24px;
  color:#6f6478;
  font-size:17px;
  line-height:1.7;
}

.hm-report-actions{
  display:grid;
  gap:14px;
}

.hm-main-report-link{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  width:100%;
  min-height:64px;
  border-radius:20px;
  text-decoration:none;
  background:linear-gradient(135deg,#ff9a57,#ff6666);
  color:#fff !important;
  font-size:20px;
  font-weight:900;
  box-shadow:0 22px 40px rgba(255,102,102,.28);
}

.hm-secondary-close{
  min-height:58px;
  border:none;
  border-radius:18px;
  background:#fff0eb;
  color:#ff6666;
  font-size:18px;
  font-weight:900;
  cursor:pointer;
}

/* CUANDO EL POPUP ESTÁ ABIERTO, BAJA MENÚS */
body.hm-report-open header,
body.hm-report-open nav,
body.hm-report-open .navbar,
body.hm-report-open .DropdownMenu1,
body.hm-report-open .DropdownMenu1-navbar-collapse,
body.hm-report-open .navbar-nav,
body.hm-report-open .nav,
body.hm-report-open .main-header,
body.hm-report-open .menu,
body.hm-report-open .main-menu,
body.hm-report-open .site-header,
body.hm-report-open [class*="header"],
body.hm-report-open [class*="menu"],
body.hm-report-open [id*="header"],
body.hm-report-open [id*="menu"]{
  z-index:1 !important;
}

/* ANIMACIONES */
@keyframes hmPulse{
  0%,100%{transform:scale(1);}
  50%{transform:scale(1.05);}
}

@keyframes hmRipple{
  0%{transform:scale(.85);opacity:.65;}
  100%{transform:scale(1.35);opacity:0;}
}

@keyframes hmPopupIn{
  from{opacity:0;transform:translateY(14px) scale(.94);}
  to{opacity:1;transform:translateY(0) scale(1);}
}

/* MOBILE */
@media(max-width:600px){
  .hm-paw-report-btn{
    left:16px !important;
    bottom:16px !important;
  }

  .hm-paw-circle{
    width:70px;
    height:70px;
  }

  .hm-paw-circle img{
    width:42px;
    height:42px;
  }

  .hm-paw-label{
    display:none;
  }

  .hm-report-popup{
    width:100%;
    max-width:360px;
    border-radius:28px;
  }

  .hm-report-header{
    padding:30px 20px 26px;
  }

  .hm-report-header h3{
    font-size:28px;
  }

  .hm-report-header p{
    font-size:14px;
  }

  .hm-report-body{
    padding:24px 20px;
  }

  .hm-main-report-link{
    font-size:16px;
    min-height:56px;
  }

  .hm-secondary-close{
    min-height:52px;
    font-size:16px;
  }
}
.hm-footer {
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(circle at 10% 10%, rgba(226, 196, 255, .55), transparent 28%),
    radial-gradient(circle at 95% 90%, rgba(255, 220, 150, .35), transparent 24%),
    linear-gradient(135deg, #fbf8ff 0%, #f3ecfb 100%);
  padding: 70px 20px 28px;
  font-family: Arial, sans-serif;
  color: #44384f;
}

.hm-footer__container {
  max-width: 1220px;
  margin: auto;
  display: grid;
  grid-template-columns: 1.15fr .9fr .95fr;
  gap: 34px;
}

.hm-footer__card {
  background: rgba(255,255,255,.78);
  border: 1px solid rgba(92, 54, 125, .10);
  border-radius: 34px;
  padding: 34px;
  box-shadow: 0 22px 55px rgba(75,46,131,.12);
  backdrop-filter: blur(12px);
}

.hm-footer__brand {
  text-align: center;
}

.hm-footer__logoBox {
  width: 145px;
  height: 145px;
  margin: 0 auto 28px;
  display: grid;
  place-items: center;
  border-radius: 32px;
  background: #e6c2f0;
  box-shadow: 0 16px 35px rgba(75,46,131,.14);
}

.hm-footer__logoBox img {
  width: 115px;
  display: block;
}

.hm-footer__brand p {
  margin: 0 auto;
  max-width: 470px;
  color: #62596c;
  font-size: 16px;
  line-height: 1.75;
}

.hm-footer__chips {
  margin-top: 28px;
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 12px;
}

.hm-footer__chips span {
  background: #fff;
  color: #4b2e83;
  padding: 11px 16px;
  border-radius: 999px;
  font-weight: 800;
  font-size: 14px;
  box-shadow: 0 10px 22px rgba(75,46,131,.10);
}

.hm-footer h3 {
  margin: 0 0 25px;
  text-align: center;
  color: #4b2e83;
  font-size: 30px;
}

.hm-footer__links,
.hm-footer__contact {
  display: grid;
  gap: 16px;
}

.hm-footer__links a,
.hm-footer__contact a {
  display: flex;
  align-items: center;
  gap: 16px;
  background: #fff;
  padding: 16px;
  border-radius: 22px;
  text-decoration: none;
  color: #4b2e83;
  box-shadow: 0 12px 26px rgba(75,46,131,.08);
  transition: .25s ease;
}

.hm-footer__links a:hover,
.hm-footer__contact a:hover {
  transform: translateY(-4px);
  box-shadow: 0 18px 34px rgba(75,46,131,.16);
}

.hm-icon {
  width: 48px;
  height: 48px;
  min-width: 48px;
  display: grid;
  place-items: center;
  border-radius: 17px;
  background: #efe4ff;
  font-size: 23px;
}

.hm-footer strong {
  display: block;
  color: #4b2e83;
  font-size: 16px;
  margin-bottom: 4px;
}

.hm-footer small {
  display: block;
  color: #6f6678;
  font-size: 13.5px;
  line-height: 1.35;
}

.hm-footer__bottom {
  max-width: 1220px;
  margin: 38px auto 0;
  padding-top: 20px;
  border-top: 1px solid rgba(75,46,131,.14);
  text-align: center;
  color: #706779;
  font-size: 14px;
}

@media (max-width: 1000px) {
  .hm-footer__container {
    grid-template-columns: 1fr;
  }

  .hm-footer__card {
    max-width: 720px;
    width: 100%;
    margin: auto;
  }
}

@media (max-width: 600px) {
  .hm-footer {
    padding: 45px 14px 22px;
  }

  .hm-footer__card {
    padding: 26px 18px;
    border-radius: 26px;
  }

  .hm-footer h3 {
    font-size: 26px;
  }

  .hm-footer__links a,
  .hm-footer__contact a {
    padding: 14px;
    border-radius: 19px;
  }

  .hm-icon {
    width: 42px;
    height: 42px;
    min-width: 42px;
    font-size: 20px;
  }
}
