.carousel{--carousel-arrow-size:48px;--carousel-arrow-bg:rgba(255,255,255,0.8);--carousel-arrow-hover-bg:#ffffff;--carousel-arrow-color:#333333;--carousel-dot-size:12px;--carousel-dot-bg:rgba(255,255,255,0.5);--carousel-dot-active-bg:#ffffff;--carousel-transition-duration:0.5s;--carousel-transition-timing:ease-in-out;max-width:100%;margin:0 auto}.carousel,.carousel__viewport{position:relative;width:100%;overflow:hidden}.carousel__track{display:flex;width:300%;height:100%}.carousel__track--no-transition{transition:none}.carousel__slide{flex:1 0;width:100%;display:flex;justify-content:center;align-items:center;position:relative;opacity:1}.carousel--fade .carousel__track{width:100%;display:grid;grid-template-columns:1fr;grid-template-rows:1fr;transition:none;transform:none!important}.carousel--fade .carousel__slide{grid-column:1;grid-row:1;opacity:0;z-index:0;pointer-events:none;transition:opacity .6s ease-in-out}.carousel--fade .carousel__slide--active{opacity:1;z-index:1;pointer-events:auto}.carousel__control{position:absolute;top:50%;transform:translateY(-50%);width:var(--carousel-arrow-size);height:var(--carousel-arrow-size);background:var(--carousel-arrow-bg);color:var(--carousel-arrow-color);border:none;border-radius:50%;cursor:pointer;z-index:10;display:flex;align-items:center;justify-content:center;transition:all .3s ease;opacity:0;box-shadow:0 4px 6px rgba(0,0,0,.1);padding:0}.carousel__control:hover{background:var(--carousel-arrow-hover-bg);transform:translateY(-50%) scale(1.1);box-shadow:0 6px 12px rgba(0,0,0,.15)}.carousel__control--prev{left:20px}.carousel__control--next{right:20px}.carousel__control svg{width:50%;height:50%}.carousel:hover .carousel__control{opacity:1}.carousel__pagination{position:absolute;bottom:20px;left:50%;transform:translateX(-50%);display:flex;gap:10px;z-index:10}.carousel__pagination-dot{width:var(--carousel-dot-size);height:var(--carousel-dot-size);border-radius:50%;background:var(--carousel-dot-bg);border:none;cursor:pointer;padding:0;transition:all .3s ease}.carousel__pagination-dot:hover{background:rgba(255,255,255,.8)}.carousel__pagination-dot--active{background:var(--carousel-dot-active-bg);transform:scale(1.2)}