/* base */
@import "base.css";

/* style */
@import "style/blocks.css";
@import "style/ui.css";


/* libs */
@import "libs/bootstrap-grid.css";
@import "libs/animate-css.css";
@import "libs/swiper.css";
@import "libs/magnific.css";


@keyframes rotation {
	to {
		transform: rotate(360deg);
	}
}

@keyframes transformScale {
	from {
		transform: scale(0);
	}

	to {
		transform: scale(1);
	}
}

@keyframes pulseInfinite {
    0% {
        transform: scale(1.1);
    }
    50% {
        transform: scale(1.175);
    }
    100% {
        transform: scale(1.1);
    }
}

@keyframes adwsdwdqw {
    0% {
        transform: translateY(0) rotate(90deg);
    }
    50% {
        transform: translateY(15px) rotate(90deg);
    }
    100% {
        transform: translateY(0) rotate(90deg);
    }
}

.darkmode-btn {
	width: 4.4rem;
	height: 4.4rem;
	align-items: center;
	cursor: pointer;
	padding: 0;
	border: 0;
	background-color: transparent;
	cursor: pointer;
	border-radius: .8rem;
}

.darkmode-btn__indicator {
	background-color: #0081ff;
	width: 4.4rem;
	height: 4.4rem;
	border-radius: .8rem;
	transition: .5s ease-out;
}
.darkmode-btn__indicator:hover {
	background-color: var(--color-accent-hover);
	transform: scale(1.075);
}

.darkmode-btn__icon-container {
	width: 100%;
	height: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
}

.darkmode-btn__icon {
	display: flex;
	justify-content: center;
	align-items: center;
	height: 100%;
	fill: #fff;
}
.darkmode-btn__icon svg {
	width: 2.5rem;
	height: 2.5rem;
}

.darkmode-btn__icon-moon,
.darkmode-btn__icon-sun {
	display: none;
}

.darkmode-btn__icon.darkmode-moon .darkmode-btn__icon-sun {
	display: block;
}

.darkmode-btn__icon.darkmode-moon.animated .darkmode-btn__icon-sun {
	animation: transformScale 0.5s;
}

.darkmode-btn__icon.darkmode-sun .darkmode-btn__icon-moon {
	display: block;
}

.darkmode-btn__icon.darkmode-sun.animated .darkmode-btn__icon-moon {
	animation: rotation 0.5s;
}

.darkmode {
	--color-silver: #e3e3e3;
	--color-darklight: #acbfdc;
	--color-black: #101a2a;

	background-color: var(--color-black);
	color: #fff;
}

.darkmode .header-top {
	background-color: rgba(5, 7, 12, 0.75);
}
.darkmode .hero-content__heading ._normal {
	color: white;
}
.darkmode .hero-content__heading .-color-accent {
	color: var(--color-accent);
}
.darkmode .hero-content__heading ._small {
	color: white;
}
.darkmode .hero-content__text {
	color: var(--color-silver);
}

.darkmode ._scrolled .logo-text {
	color: var(--color-light);
}

.darkmode .logo__icon,
.darkmode .logo__text {
	fill: var(--color-light);
}

.darkmode .portfolio-card:after {
    content: "";
    width: 100%;
    height: 30rem;
    background: linear-gradient(to bottom, rgba(0,0,0,0) 0%,rgba(7, 27, 75, 0.85) 100%);
    position: absolute;
    left: 0;
    bottom: 0;
}

.darkmode .portfolio-card__info ._text {
	text-shadow: 0 1px 1px rgba(0,0,0,.4);
}

.darkmode .lead-form {
    border: 1px solid rgba(255,255,255,.1);
}
.darkmode .lead-form._free-audit {
	background: linear-gradient(to top, var(--color-darkaccent) 0%,var(--color-black) 100%);
	border: 1px solid rgba(255,255,255,.15);
}
.darkmode .work-steps-post__block {
	background-color: var(--color-darkaccent);
	border: 1px solid rgba(255,255,255,.1);
}
.darkmode .work-steps-post__title {
	color: white;
}
.darkmode .work-steps-post__item ._corner {
	fill: #3f4761;
}
.darkmode .working {
	background-color: var(--color-darkaccent);
}
.darkmode .working__corner-top {
	fill: var(--color-darkaccent);
}
.darkmode .working__arrow-down {
	fill: var(--color-light);
}
.darkmode .working-item {
	background-color: var(--color-black);
	border: 1px solid rgba(255,255,255,.15);
}
.darkmode .reviews__block {
	background-color: var(--color-darkaccent);
	border-color: rgba(255,255,255,.1);
}
.darkmode .reviews__name,
.darkmode .reviews__descrp {
	color: white;
}
.darkmode .contact {
	background-color: var(--color-darkaccent);
	border: 1px solid rgba(255,255,255,.1);
}
.darkmode .contact__link-big {
	color: white;
}
.darkmode .contact-form {
	background-color: var(--color-black);
	border: 1px solid rgba(255,255,255,.15);
}
.darkmode .job-beefup__item {
	background-color: var(--color-darkaccent);
	border-color: rgba(255,255,255,.1);
	color: white;
}
.darkmode .beefup__heading {
	color: white;
}
.darkmode .beefup__body {
	color: var(--color-silver);
}
.darkmode .footer__policy {
	color: white;
}
.darkmode .portfolio-modal {
	background-color: var(--color-black);
}
.darkmode .portfolio-modal__aside {
	background-color: var(--color-black);
}
.darkmode {
	
}
.article-context-links{margin:36px 0;padding:22px 24px;border:1px solid rgba(137,164,221,.14);border-radius:18px;background:rgba(16,31,66,.30)}
.article-context-links>p{margin:8px 0 14px;color:#8fa2c2;font-size:14px;line-height:1.6}
.article-context-links-row{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.article-context-links-row a{display:flex;justify-content:space-between;gap:12px;padding:11px 13px;border:1px solid rgba(137,164,221,.12);border-radius:12px;color:#dce7fb;text-decoration:none;background:rgba(7,14,30,.28);font-size:12px;line-height:1.4}
.article-context-links-row a b{color:#2f80ed;flex:0 0 auto}
@media(max-width:680px){.article-context-links-row{grid-template-columns:1fr}}