:root{--clr-primary: #645cff;--clr-primary-dark: #282566;--clr-primary-light: #a29dff;--clr-grey-1: #102a42;--clr-grey-5: #617d98;--clr-grey-10: #f1f5f8;--clr-white: #fff;--clr-red-dark: hsl(360, 67%, 44%);--clr-red-light: hsl(360, 71%, 66%);--transition: all .3s linear;--spacing: .25rem;--radius: .25rem;--large-screen-width: 1170px;--small-screen-width: 90vw;--fixed-width: 50rem}*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Open Sans,Helvetica Neue,sans-serif;background:var(--clr-grey-10);color:var(--clr-grey-1);line-height:1.5;font-size:.875rem}a{text-decoration:none}img{width:100%;display:block}h1,h2,h3,h4{letter-spacing:var(--spacing);text-transform:capitalize;line-height:1.25;margin-bottom:.75rem}h1{font-size:3rem}h2{font-size:2rem}h3{font-size:1.5rem}h4{font-size:.875rem}p{margin-bottom:1.25rem}@media screen and (min-width: 800px){h1{font-size:4rem}h2{font-size:2.5rem}h3{font-size:2rem}h4,body{font-size:1rem}h1,h2,h3,h4{line-height:1}}.btn{text-transform:uppercase;background:var(--clr-primary);color:var(--clr-white);padding:.375rem .75rem;letter-spacing:var(--spacing);display:inline-block;font-weight:700;transition:var(--transition);font-size:.875rem;border:none;cursor:pointer;box-shadow:0 1px 3px #0003}.btn:hover{color:var(--clr-primary);background:var(--clr-primary-light)}.loading{text-align:center;margin-top:5rem}nav{background:var(--clr-primary);padding:1.25rem 2rem}.nav-center{max-width:var(--fixed-width);width:100%;margin:0 auto;display:flex;justify-content:space-between;align-items:center}nav h3{margin-bottom:0;letter-spacing:1px;color:var(--clr-white)}.nav-container{display:block;position:relative}nav svg{width:40px;color:var(--clr-white)}.amount-container{position:absolute;top:-.6rem;right:-.6rem;width:1.75rem;height:1.75rem;border-radius:50%;background:var(--clr-primary-light);display:flex;align-items:center;justify-content:center}.total-amount{color:var(--clr-white);margin-bottom:0;font-size:1.25rem}.cart{min-height:calc(100vh - 120px);width:90vw;margin:40px auto 0;padding:2.5rem 0;max-width:var(--fixed-width)}.cart h2{text-transform:uppercase;text-align:center;margin-bottom:3rem}.empty-cart{text-transform:lowercase;color:var(--clr-grey-5);margin-top:1rem;text-align:center}.cart footer{margin-top:4rem;text-align:center}.cart-total h4{text-transform:capitalize;display:flex;justify-content:space-between;margin-top:1rem}.clear-btn,.confirm-btn{background:transparent;padding:.5rem 1rem;color:var(--clr-red-dark);border:1px solid var(--clr-red-dark);margin-top:2.25rem;border-radius:var(--radius)}.clear-btn:hover{background:var(--clr-red-light);color:var(--clr-red-dark);border-color:var(--clr-red-light)}.confirm-btn{border-color:var(--clr-primary);color:var(--clr-primary)}.cart-item{display:grid;align-items:center;grid-template-columns:auto 1fr auto;grid-column-gap:1.5rem;margin:1.5rem 0}.cart-item img{width:5rem;height:5rem;object-fit:cover}.cart-item h4{margin-bottom:.5rem;font-weight:500;letter-spacing:2px}.item-price{color:var(--clr-grey-5)}.remove-btn{color:var(--clr-primary);letter-spacing:var(--spacing);cursor:pointer;font-size:.85rem;background:transparent;border:none;margin-top:.375rem;transition:var(--transition)}.remove-btn:hover{color:var(--clr-primary-light)}.amount-btn{width:24px;background:transparent;border:none;cursor:pointer}.amount-btn svg{color:var(--clr-primary)}.amount-btn:hover svg{color:var(--clr-primary-light)}.amount{text-align:center;margin-bottom:0;font-size:1.25rem;line-height:1}hr{background:var(--clr-grey-5);border-color:transparent;border-width:.25px}.modal-container{position:fixed;top:0;left:0;width:100%;height:100%;background:#000000b3;z-index:10;display:flex;align-items:center;justify-content:center}.modal{background:var(--clr-white);width:80vw;max-width:400px;border-radius:var(--radius);padding:2rem 1rem;text-align:center}.modal h4{margin-bottom:0;line-height:1.5}.modal .clear-btn,.modal .confirm-btn{margin-top:1rem}.btn-container{display:flex;justify-content:space-around}