{"version":3,"sources":["portfolio-grid.scss"],"names":[],"mappings":"AAGA,mB,CACE,iB,CACA,a,CACA,S,CACA,U,CACA,Y,CACA,U,CACA,kB,CACA,2B,CAAA,0B,CAEE,a,CACA,U,CACA,W,CACA,Q,CAEF,0B,CACE,mB,CAAA,gB,CACA,yB,CAAA,sB,CAEF,6B,CACE,uB,CApBJ,uC,CAuBI,iB,CAEF,yB,CACE,iB,CACA,K,CACA,M,CACA,e,CACA,U,CACA,W,CACA,S,CACA,2B,CAEF,4B,CACE,iB,CACA,K,CACA,Q,CACA,U,CACA,iB,CAEF,6B,CACE,kB,CACA,kB,CACA,wB,CACA,e,CACA,gB,CACA,S,CACA,2B,CACA,uD,CACA,qC,CAEF,0B,CACE,e,CACA,e,CACA,U,CACA,S,CACA,2B,CAEF,yB,CACE,yB,CACA,wB,CACA,U,CACA,iB,CACA,S,CACA,W,CACA,c,CACA,S,CACA,S,CACA,2B,CAIA,gC,CACE,oC,CACA,uB,CAiBF,2B,CACA,U,CACA,W,CACA,e,CACA,S,CACA,c,CACA,mB,CACA,2B,CA1BC,uC,CAAA,wC,CAKG,6B,CAMH,sC,CAEG,0B,CAcJ,sC,CACE,c,CAtGN,0D,CAAA,uD,CAAA,mD,CAAA,mD,CAAA,oD,CAiHQ,mB,CAjHR,mD,CAoHQ,U","file":"../portfolio-grid.css","sourcesContent":["@import \"../../assets/styles/variables\";\r\n@import \"../../assets/styles/mixins\";\r\n\r\n.brk-portfolio-card {\r\n  position: relative;\r\n  display: block;\r\n  flex: none;\r\n  width: 100%;\r\n  height: 380px;\r\n  color: $white;\r\n  perspective: 1000px;\r\n  &__figure,\r\n  &__image {\r\n    display: block;\r\n    width: 100%;\r\n    height: 100%;\r\n    margin: 0;\r\n  }\r\n  &__image {\r\n    object-fit: cover;\r\n    object-position: center;\r\n  }\r\n  &__figure > * {\r\n    transform: translateZ(0px);\r\n  }\r\n  .brk-tilter__figure {\r\n    position: relative;\r\n  }\r\n  &__deco {\r\n    position: absolute;\r\n    top: 0;\r\n    left: 0;\r\n    overflow: hidden;\r\n    width: 100%;\r\n    height: 100%;\r\n    opacity: 0;\r\n    transition: opacity 0.3s ease;\r\n  }\r\n  &__caption {\r\n    position: absolute;\r\n    top: 0;\r\n    bottom: 0;\r\n    width: 100%;\r\n    padding: 42px 34px 42px 34px;\r\n  }\r\n  &__category {\r\n    color: var(--white);\r\n    border-radius: 20px;\r\n    text-transform: uppercase;\r\n    margin-left: 1px;\r\n    padding: 5px 18px;\r\n    opacity: 0;\r\n    transition: opacity 0.3s ease;\r\n    box-shadow: 0 5px 16px rgba(var(--brand-primary-rgb), 0.5);\r\n    background-color: var(--brand-primary);\r\n  }\r\n  &__title {\r\n    margin-top: 20px;\r\n    margin-left: 4px;\r\n    color: $white;\r\n    opacity: 0;\r\n    transition: opacity 0.3s ease;\r\n  }\r\n  &__link {\r\n    text-decoration: underline;\r\n    text-transform: uppercase;\r\n    color: $white;\r\n    position: absolute;\r\n    left: 41px;\r\n    bottom: 41px;\r\n    cursor: pointer;\r\n    z-index: 4;\r\n    opacity: 0;\r\n    transition: opacity 0.3s ease;\r\n  }\r\n\r\n  &__btn {\r\n    &-reverse {\r\n      color: var(--brand-primary) !important;\r\n      background: var(--white);\r\n\r\n      .before {\r\n        background-color: var(--white);\r\n      }\r\n      .after {\r\n        background-color: var(--white);\r\n      }\r\n    }\r\n    &__icon {\r\n      &::before {\r\n        color: var(--brand-primary);\r\n      }\r\n    }\r\n  }\r\n\r\n  &__btn-reverse {\r\n    position: absolute !important;\r\n    right: 28px;\r\n    bottom: 23px;\r\n    font-weight: 100;\r\n    z-index: 4;\r\n    cursor: pointer;\r\n    opacity: 0 !important;\r\n    transition: opacity 0.3s ease;\r\n    &__icon {\r\n      font-size: 18px;\r\n    \r\n    }\r\n  }\r\n  &:hover {\r\n    .brk-portfolio-card {\r\n      &__deco,\r\n      &__category,\r\n      &__title,\r\n      &__link,\r\n      &__btn-reverse {\r\n        opacity: 1 !important;\r\n      }\r\n      &__link {\r\n        color: $white;\r\n      }\r\n    }\r\n  }\r\n}\r\n"]}