/*! ============================================================
 *  Spector Craft v2.5.0
 *  For those who craft by hand
 *  
 *  © 2026 Спектор Дмитрий (SPECTOR & CO)
 *  Лицензия: MIT (https://opensource.org/licenses/MIT)
 *  
 *  Контакты:
 *    - Почта: web@spector.pw
 *    - Сайт: https://spector.pw
 *  
 *  ------------------------------------------------------------
 *  ИСТОРИЯ ИЗМЕНЕНИЙ:
 *  2.5.0 (2026-07-16) — Актуальная версия
 *  ------------------------------------------------------------
 *  ============================================================ */
* {padding: 0; margin: 0;box-sizing:border-box;}
*::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth;}
html,body {height:100%; min-height:100%!important;}
img {max-width:100%;width: auto; height: auto;}

/***********************
* Display
***********************/
.d-flex {display:flex;} .d-grid {display: grid;} .d-block {display:block;} .d-inline {display:inline;} .d-inbl {display:inline-block;} .d-none {display:none;} .d-table {display:table;} .d-inherit { display: inherit; }

/***********************
* Colors - Default
***********************/
.clr-white {color:white;} .bg-white {background: white;} /* Частно нужны */
:root {
 --gray-1: #F9F9F9; --gray-2: #f6f6f6; --gray-3: #f0f0f0; --gray-4: #eaeaea; --gray-5: #e2e2e2; --gray-6: #CFCFCF; --gray-7: #c3c3c3; --gray-8: #888; --gray-9: #777; --gray-10: #666;
 --black-1:#080808; --black-2:#111; --black-3:#161616; --black-4:#1b1b1b; --black-5:#222; --black-6:#282828; --black-7:#333; --black-8:#363636; --black-9:#444;--black-10:#555; 
 --primary: #4361ee; --secondary: #7209b7; --success: #4cc9f0; --warning: #f8961e; --danger: #f94144; --dark: #212529; --light: #f8f9fa;
 --a-1:clamp(5px, 1%, 15px); --a-2:clamp(10px, 2%, 20px); --a-3:clamp(10px, 3%, 30px); --a-4:clamp(10px, 4%, 40px); --a-5:clamp(10px, 5%, 50px); --a-6:clamp(10px, 10%, 80px);
 --w-1:clamp(0.25rem, 0.25rem + 0.42cqi, 0.88rem); --w-2:clamp(0.50rem, 0.50rem + 0.56cqi, 1.25rem); --w-3:clamp(0.75rem, 0.75rem + 0.84cqi, 1.88rem); --w-4:clamp(1.00rem, 1.00rem + 1.12cqi, 2.50rem); --w-5:clamp(1.25rem, 1.25rem + 1.40cqi, 3.13rem);
}

/***********************
* Flex 
***********************/
.fx-wrap {flex-wrap:wrap;}
.fx-cc {justify-content: center;align-items: center;}
/* horizont | justify-content */
.fx-jc-start {justify-content: flex-start; }
.fx-jc-end {justify-content: flex-end; }
.fx-jc-center {justify-content: center;}
.fx-jc-between {justify-content: space-between;}
.fx-jc-around {justify-content: space-around;}
.fx-jc-evenly {justify-content: space-evenly;}
/* vertical | align-items */
.fx-ai-end {align-items: flex-end;}
.fx-ai-start {align-items: flex-start;}
.fx-ai-center {align-items: center;}
.fx-ai-baseline {align-items: baseline;}
/*align-self | to flex -> children | Выравнивание дочернего еэлемента */
.fx-as-start {align-self: flex-start;}
.fx-as-end {align-self: flex-end;}
.fx-as-center {align-self: center;}
.fx-as-stretch {align-self: stretch;}
/*align-content | to flex -> children rows | Выравнивание дочернего еэлемента */
.fx-ac-start {align-content : flex-start;}
.fx-ac-end {align-content : flex-end;}
.fx-ac-center {align-content : center;}
.fx-ac-stretch {align-content : stretch;}
/* nexts */
.fx-1 {flex: 1;}
.fx-0 {flex: 0 0 auto;/*flex: 1 1 0%;*/}
.fx-column {flex-direction:column;}
.fx-auto {flex:auto;}
.fx-unset {flex:unset!important;}
.fx-none {flex:none!important;} /*аналог fx-0*/
/* GAP | Otstup flex/grid от 28.05 */
[class*="gap-"] {--gap: initial; gap: var(--gap,0);}
.gap-0 {--gap: 0;} .gap-1 {--gap: .25rem;} .gap-2 {--gap: .5rem;} .gap-3 {--gap: 1rem;} .gap-4 {--gap: 1.5rem;} .gap-5 {--gap: 3rem;}

/**/
.gap-w-1 {--gap: var(--w-1);} .gap-w-2 {--gap: var(--w-2);} .gap-w-3 {--gap: var(--w-3);} .gap-w-4 {--gap: var(--w-4);} .gap-w-5 {--gap: var(--w-5);} 
.gap-a-1 {--gap: var(--a-1);} .gap-a-2 {--gap: var(--a-2);} .gap-a-3 {--gap: var(--a-3);} .gap-a-4 {--gap: var(--a-4);} .gap-a-5 {--gap: var(--a-5);} .gap-a-6 {--gap: var(--a-6);} 

/***********************
* Width size
***********************/
.w-auto {width: auto;flex:auto;}
.w-100 {width: 100%; }
.w-90 {width: 90%;}
.w-80 {width: 80%;flex: 1 0 80%;}
.w-75 {width: 75%;flex: 1 0 75%;}
.w-70 {width: 70%; flex: 1 0 70%;}
.w-66 {width: calc(200% / 3);flex: 1 0 calc(200% / 3);}
.w-60 {width: 60%;flex: 1 0 60%;}
.w-50 {width: 50%;flex: 1 0 50%;}
.w-40 {width: 40%;flex: 1 0 40%;}
.w-35 {width: 35%;flex: 1 0 35%;}
.w-33 {width: calc(100% / 3);flex: 1 0 calc(100% / 3);}
.w-30 {width: 30%;flex: 1 0 30%;}
.w-25 {width: 25%;flex: 1 0 25%;}
.w-20 {width: 20%;flex: 1 0 20%;}
.w-15 {width: 15%;}
.w-10 {width: 10%;}
/**/
[class*="w-max-"] {max-width: var(--w-max, none);}
.w-max-200 {--w-max: 200px;} .w-max-250 {--w-max:250px;} .w-max-300 {--w-max:300px;} .w-max-350 {--w-max:350px;} .w-max-400 {--w-max:400px;} .w-max-500 {--w-max:500px;} .w-max-1250 {--w-max: 1250px;} .w-max-1440 {--w-max: 1440px;} .w-max-1600 {--w-max: 1600px;} .w-max-1800 {--w-max: 1800px;}

/**/
[class*="w-min-"] {min-width: var(--w-min, 0);}
.w-min-0 {--w-min:0;}.w-min-100, .col-min-100{--w-min:100px;} .w-min-125, .col-min-125 {--w-min:125px;}.w-min-150, .col-min-150 {--w-min:150px;}.w-min-175, .col-min-175 {--w-min:175px;}.w-min-200, .col-min-200 {--w-min:200px;}.w-min-250, .col-min-250 {--w-min:250px;}
.w-min-275, .col-min-275 {--w-min:275px;}.w-min-300, .col-min-300 {--w-min:300px;}.w-min-325, .col-min-325 {--w-min:325px;}.w-min-350, .col-min-350 {--w-min:350px;}.w-min-content {--w-min: min-content;}

/***********************
* Cols - 30.05.26
***********************/
.d-flex[class*="cols-"]>* {/*min-width: 0;*/flex: 1 1 auto;flex-basis: calc((100% - (var(--gap, 0) * (var(--cols) - 1))) / var(--cols));}
.cols-2{--cols:2;}.cols-3{--cols:3;}.cols-4{--cols:4;}.cols-5{--cols:5;}.cols-6{--cols:6;}.cols-7{--cols:7;}.cols-8{--cols:8;}

/***********************
* Height size
***********************/
.h-100 {height: 100%;} .h-100vh {height: 100vh;} .h-auto {height: auto!important;}
.h-min-30vh {min-height: 30vh;min-height: 30dvh;} .h-min-50vh {min-height: 50vh;min-height: 50dvh;} .h-min-80vh {min-height: 80vh;min-height: 80dvh;} .h-min-100vh {min-height: 100vh; min-height: 100dvh;}

/***********************
* ICO - FontAwesome 4
***********************/
.ico:before { margin-right:5px; text-decoration: inherit;  font-family: FontAwesome;}

/***********************
* ICO - FontAwesome 7
***********************/
.icon::before {display: inline-block; text-rendering: auto; -webkit-font-smoothing: antialiased;content: var(--fa);margin-right:.4rem;}
.icon-solid::before {font: var(--fa-font-solid);}
.icon-regular::before {font: var(--fa-font-regular);}
.icon-light::before {font: var(--fa-font-light);}
.icon-thin::before {font: var(--fa-font-thin);}
.icon-brand::before {font: var(--fa-font-brands);}

/***********************
* Padding
***********************/
.p-0 {padding: 0!important;} .p-1 {padding: .25rem;} .p-2 {padding: .5rem;} .p-3 {padding: 1rem;} .p-4 {padding: 1.5rem;} .p-5 {padding: 3rem;}
.pv-1 {padding-block: .25rem;} .pv-2 {padding-block: .5rem;} .pv-3 {padding-block: 1rem;} .pv-4 {padding-block: 1.5rem;} .pv-5 {padding-block: 3rem;} 
.pg-1 {padding-inline: .25rem;} .pg-2 {padding-inline: .5rem;} .pg-3 {padding-inline: 1rem;} .pg-4 {padding-inline: 1.5rem;} .pg-5 {padding-inline: 3rem;}
/**/
.p-a-1 {padding: var(--a-1);} .p-a-2 {padding: var(--a-2);}  .p-a-3 {padding: var(--a-3);}  .p-a-4 {padding:var(--a-4);}  .p-a-5 {padding: var(--a-5);} .p-a-6 {padding: var(--a-6);} 
.p-w-1 {padding: var(--w-1);} .p-w-2 {padding: var(--w-2);} .p-w-3 {padding: var(--w-3);} .p-w-4 {padding: var(--w-4);} .p-w-5 {padding: var(--w-5);}
/* add - 30.05.26 */
.pv-w-1 {padding-block: var(--w-1);} .pv-w-2 {padding-block: var(--w-2);} .pv-w-3 {padding-block: var(--w-3);} .pv-w-4 {padding-block: var(--w-4);} .pv-w-5 {padding-block: var(--w-5);}
.pg-w-1 {padding-inline: var(--w-1);} .pg-w-2 {padding-inline: var(--w-2);} .pg-w-3 {padding-inline: var(--w-3);} .pg-w-4 {padding-inline: var(--w-4);} .pg-w-5 {padding-inline: var(--w-5);}

/***********************
* Margin
***********************/
.m-center {margin:0 auto;}
.m-0 {margin:0!important;} .m-1 {margin: .25rem;} .m-2 {margin: .5rem;} .m-3 {margin: 1rem;} .m-4 {margin: 1.5rem;} .m-5 {margin: 3rem;}
.mv-1 {margin-block: .25rem;} .mv-2 {margin-block: .5rem;} .mv-3 {margin-block: 1rem;} .mv-4 {margin-block: 1.5rem;} .mv-5 {margin-block: 3rem;}
.mg-1 {margin-inline:.25rem;} .mg-2 {margin-inline:.5rem;} .mg-3 {margin-inline:1rem;} .mg-4 {margin-inline:1.5rem;} .mg-5 {margin-inline:3rem;}

/***********************
* Breakpoint's
***********************/
@media (max-width:480px)  {/*xxs*/
	.view-xxs {display:block;} .hidden-xxs {display:none;}
	.cols-xxs-1{--cols: 1;}.cols-xxs-2{--cols:2;}.cols-xxs-3{--cols:3;}.cols-xxs-4{--cols:4;}.cols-xxs-5{--cols:5;}.cols-xxs-6{--cols:6;}.cols-xxs-7{--cols:7;}.cols-xxs-8{--cols:8;}
	.w-xxs-100 {width: 100%;} .w-xxs-90 {width: 90%;} .w-xxs-80 {width: 80%;flex: 1 0 80%;}	.w-xxs-75 {width: 75%;flex: 1 0 75%;} .w-xxs-70 {width: 70%; flex: 1 0 70%;}
	.w-xxs-60 {width: 60%;flex: 1 0 60%;} .w-xxs-50 {width: 50%;flex: 1 0 50%;} .w-xxs-40 {width: 40%;flex: 1 0 40%;} .w-xxs-33 {width: 33.3%;flex: 1 0 33.3%;}
	.w-xxs-30 {width: 30%;flex: 1 0 30%;} .w-xxs-25 {width: 25%;flex: 1 0 25%;} .w-xxs-20 {width: 20%;flex: 1 0 20%;}
} 
@media (min-width:480px) and (max-width:600px)  {/*xs*/
	.view-xs {display:block;} .hidden-xs {display:none;}
	.cols-xs-1{--cols: 1;}.cols-xs-2{--cols:2;}.cols-xs-3{--cols:3;}.cols-xs-4{--cols:4;}.cols-xs-5{--cols:5;}.cols-xs-6{--cols:6;}.cols-xs-7{--cols:7;}.cols-xs-8{--cols:8;}
	.w-xs-100 {width: 100%;} .w-xs-90 {width: 90%;}	.w-xs-80 {width: 80%;flex: 1 0 80%;} .w-xs-75 {width: 75%;flex: 1 0 75%;} .w-xs-70 {width: 70%; flex: 1 0 70%;}
	.w-xs-60 {width: 60%;flex: 1 0 60%;} .w-xs-50 {width: 50%;flex: 1 0 50%;} .w-xs-40 {width: 40%;flex: 1 0 40%;} .w-xs-33 {width: 33.3%;flex: 1 0 33.3%;}
	.w-xs-30 {width: 30%;flex: 1 0 30%;} .w-xs-25 {width: 25%;flex: 1 0 25%;} .w-xs-20 {width: 20%;flex: 1 0 20%;}
} 
@media (min-width:600px) and (max-width:800px)  {/*sm*/
	.view-sm {display:block;} .hidden-sm {display:none;}
	.cols-sm-1{--cols: 1;}.cols-sm-2{--cols:2;}.cols-sm-3{--cols:3;}.cols-sm-4{--cols:4;}.cols-sm-5{--cols:5;}.cols-sm-6{--cols:6;}.cols-sm-7{--cols:7;}.cols-sm-8{--cols:8;}
	.w-sm-100 {width: 100%;} .w-sm-90 {width: 90%;}	.w-sm-80 {width: 80%;flex: 1 0 80%;} .w-sm-75 {width: 75%;flex: 1 0 75%;} .w-sm-70 {width: 70%; flex: 1 0 70%;}
	.w-sm-60 {width: 60%;flex: 1 0 60%;} .w-sm-50 {width: 50%;flex: 1 0 50%;} .w-sm-40 {width: 40%;flex: 1 0 40%;} .w-sm-33 {width: 33.3%;flex: 1 0 33.3%;}
	.w-sm-30 {width: 30%;flex: 1 0 30%;} .w-sm-25 {width: 25%;flex: 1 0 25%;} .w-sm-20 {width: 20%;flex: 1 0 20%;}
} 
@media (min-width:800px) and (max-width:1024px)  {/*md*/ 
	.view-md {display:block;} .hidden-md {display:none;}
	.cols-md-1{--cols: 1;}.cols-md-2{--cols:2;}.cols-md-3{--cols:3;}.cols-md-4{--cols:4;}.cols-md-5{--cols:5;}.cols-md-6{--cols:6;}.cols-md-7{--cols:7;}.cols-md-8{--cols:8;}
	.w-md-100 {width: 100%;} .w-md-90 {width: 90%;}	.w-md-80 {width: 80%;flex: 1 0 80%;} .w-md-75 {width: 75%;flex: 1 0 75%;} .w-md-70 {width: 70%; flex: 1 0 70%;}
	.w-md-60 {width: 60%;flex: 1 0 60%;} .w-md-50 {width: 50%;flex: 1 0 50%;} .w-md-40 {width: 40%;flex: 1 0 40%;} .w-md-33 {width: 33.3%;flex: 1 0 33.3%;}
	.w-md-30 {width: 30%;flex: 1 0 30%;} .w-md-25 {width: 25%;flex: 1 0 25%;} .w-md-20 {width: 20%;flex: 1 0 20%;}
} 
@media (min-width:1024px) and (max-width:1280px)  {/*lg*/
	.view-lg {display:block;} .hidden-lg {display:none;}
	.cols-lg-1{--cols: 1;}.cols-lg-2{--cols:2;}.cols-lg-3{--cols:3;}.cols-lg-4{--cols:4;}.cols-lg-5{--cols:5;}.cols-lg-6{--cols:6;}.cols-lg-7{--cols:7;}.cols-lg-8{--cols:8;}
	.w-lg-100 {width: 100%;} .w-lg-90 {width: 90%;}	.w-lg-80 {width: 80%;flex: 1 0 80%;} .w-lg-75 {width: 75%;flex: 1 0 75%;} .w-lg-70 {width: 70%; flex: 1 0 70%;}
	.w-lg-60 {width: 60%;flex: 1 0 60%;} .w-lg-50 {width: 50%;flex: 1 0 50%;} .w-lg-40 {width: 40%;flex: 1 0 40%;} .w-lg-33 {width: 33.3%;flex: 1 0 33.3%;}
	.w-lg-30 {width: 30%;flex: 1 0 30%;} .w-lg-25 {width: 25%;flex: 1 0 25%;} .w-lg-20 {width: 20%;flex: 1 0 20%;}
} 
@media (min-width:1280px) and (max-width:1536px)  {/*xl*/
	.view-xl {display:block;} .hidden-xl {display:none;}
	.cols-xl-1{--cols: 1;}.cols-xl-2{--cols:2;}.cols-xl-3{--cols:3;}.cols-xl-4{--cols:4;}.cols-xl-5{--cols:5;}.cols-xl-6{--cols:6;}.cols-xl-7{--cols:7;}.cols-xl-8{--cols:8;}
	.w-xl-100 {width: 100%;} .w-xl-90 {width: 90%;}	.w-xl-80 {width: 80%;flex: 1 0 80%;} .w-xl-75 {width: 75%;flex: 1 0 75%;} .w-xl-70 {width: 70%; flex: 1 0 70%;}
	.w-xl-60 {width: 60%;flex: 1 0 60%;} .w-xl-50 {width: 50%;flex: 1 0 50%;} .w-xl-40 {width: 40%;flex: 1 0 40%;} .w-xl-33 {width: 33.3%;flex: 1 0 33.3%;}
	.w-xl-30 {width: 30%;flex: 1 0 30%;} .w-xl-25 {width: 25%;flex: 1 0 25%;} .w-xl-20 {width: 20%;flex: 1 0 20%;}
} 
@media (min-width:1536px)  { /*xxl*/
	.view-xxl {display:block;} .hidden-xxl {display:none;}
	.cols-xxl-1{--cols: 1;}.cols-xxl-2{--cols:2;}.cols-xxl-3{--cols:3;}.cols-xxl-4{--cols:4;}.cols-xxl-5{--cols:5;}.cols-xxl-6{--cols:6;}.cols-xxl-7{--cols:7;}.cols-xxl-8{--cols:8;}
	.w-xxl-100 {width: 100%;} .w-xxl-90 {width: 90%;} .w-xxl-80 {width: 80%;flex: 1 0 80%;}	.w-xxl-75 {width: 75%;flex: 1 0 75%;} .w-xxl-70 {width: 70%; flex: 1 0 70%;}
	.w-xxl-60 {width: 60%;flex: 1 0 60%;} .w-xxl-50 {width: 50%;flex: 1 0 50%;} .w-xxl-40 {width: 40%;flex: 1 0 40%;} .w-xxl-33 {width: 33.3%;flex: 1 0 33.3%;}
	.w-xxl-30 {width: 30%;flex: 1 0 30%;} .w-xxl-25 {width: 25%;flex: 1 0 25%;} .w-xxl-20 {width: 20%;flex: 1 0 20%;}
} 

/***********************
* Font-Family 
***********************/
.ff-roboto-slab {font-family: 'Roboto Slab', Georgia, 'Times New Roman', serif;}
.ff-roboto {font-family: 'Roboto', Arial, Helvetica, sans-serif;}
.ff-lora {font-family: 'Lora', 'Times New Roman', Times, serif;}
.ff-open-sans {font-family: 'Open Sans', Verdana, Geneva, sans-serif;}
.ff-montserrat {font-family: 'Montserrat', Impact, 'Arial Black', Gadget, sans-serif; /*letter-spacing: -0.5px;*/}
.ff-inter {font-family: 'Inter', Arial, Helvetica, sans-serif;}
.ff-georgia {font-family: Georgia, 'Times New Roman', Times, serif;}
.ff-poppins {font-family: 'Poppins', Arial, Helvetica, sans-serif;}
.ff-raleway {font-family: 'Raleway', Arial, Helvetica, sans-serif;}
.ff-merriweather {font-family: 'Merriweather', Georgia, 'Times New Roman', serif;}
.ff-source-sans {font-family: 'Source Sans Pro', Arial, Helvetica, sans-serif;}

/***********************
* line-height 
***********************/
.lh-100 {line-height: 1;} .lh-125 {line-height: 1.25;} .lh-140 {line-height: 1.4;} .lh-150 {line-height: 1.5;} .lh-160 {line-height: 1.6;} .lh-180 {line-height: 1.8;}

/***********************
*  Font-size
***********************/
.fs-075 {font-size: 0.75rem;} .fs-087 {font-size: 0.875rem;} .fs-100 {font-size: 1rem;} .fs-110 {font-size: 1.1rem;} .fs-125 {font-size: 1.25rem;} .fs-150 {font-size: 1.5rem;} .fs-175 {font-size: 1.75rem;} .fs-200 {font-size: 2rem;} .fs-250 {font-size: 2.5rem;} .fs-300 {font-size: 3rem;}
/* Font-weight */
.fw-100 {font-weight: 100;} .fw-200 {font-weight: 200;} .fw-300 {font-weight: 300;} .fw-400 {font-weight: 400;} .fw-500 {font-weight: 500;} .fw-600 {font-weight: 600;} .fw-700 {font-weight: 700;} .fw-800 {font-weight:800;} .fw-900 {font-weight:900;}

/***********************
* img
***********************/
.img-cover {object-fit: cover;  object-position: center;}
.img-contain {object-fit: contain;  object-position: center;}
.bg-cover {background-size: cover;background-position: center;background-repeat: no-repeat;}
.bg-fixed {background-attachment: fixed;}

/***********************
* position
***********************/
.pos-absolute {position:absolute;}
.pos-fixed {position:fixed;}
.pos-relative {position:relative;}
.pos-sticky {position: sticky;}
.pos-center {top: 50%; left: 50%; transform: translate(-50%, -50%);}
/**/
.pos-inset {inset: 0;} .pos-top {top:0;} .pos-left {left:0;} .pos-right {right:0;} .pos-bottom {bottom:0;}

/***********************
* list-style ul/ol
***********************/
.ls-none {list-style:none;}
.ls-square {list-style-type: square;}

/***********************
* text: decoration
***********************/
.td-none {text-decoration:none;}
.td-dotted {text-decoration: underline dotted;}
.td-underline {text-decoration: underline;}
.no-wrap {white-space: nowrap;}

/***********************
* Text Wrap (Modern CSS)
***********************/
.tw-balance {text-wrap: balance;}
.tw-pretty  {text-wrap: pretty;}

/***********************
* Transition / Animations
***********************/
.tr-25 {transition: 0.25s;}
.tr-50 {transition: 0.5s;}
.tr-100 {transition: 1s;}
.tr-cb {transition: all 0.4s cubic-bezier(0.5, 2, 0.5, 1);}

/***********************
* text utils
***********************/
.tt-upper {text-transform: uppercase;} 
.tt-lower {text-transform: lowercase;}
.fst-normal {font-style: normal;} 
.fst-italic {font-style: italic;}
.no-select {user-select: none;}

/***********************
* Order - Под вопросом!
***********************/
/*.order-m1 {order: -1;} .order-0 {order: 0;} .order-1 {order: 1;} .order-2 {order: 2;} .order-3 {order: 3;}*/

/***********************
* text align
***********************/
.text-left {text-align:left;}
.text-right {text-align:right;}
.text-center {text-align:center;}

/***********************
* float
***********************/
.float-left {float:left;}
.float-right {float:right;}
.float-clear {clear: both;}

/***********************
* Aspect-ratio
***********************/
.aspect-16x9 {aspect-ratio: 16/9;} .aspect-9x16 {aspect-ratio: 9/16;} .aspect-6x9 {aspect-ratio: 6/9;} .aspect-1x1 {aspect-ratio: 1/1;} .aspect-2x1 {aspect-ratio: 2/1;}

/***********************
* Три точки вместо переноса + 
***********************/
.text-ellips {white-space: nowrap;  overflow: hidden;  text-overflow: ellipsis;}
.text-transparent {background-clip: text; color: transparent;}

/***********************
* box-shadow
***********************/
.bs-1 {box-shadow: 0px 0px 10px 2px rgba(0,0,0,0.1);} .bs-2 {box-shadow: 0px 0px 5px -1px rgba(0,0,0,.2);} .bs-3 {box-shadow: 0px 0px 15px -5px rgba(0,0,0,.5);}
/**/
.bs-xs {box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);}
.bs-sm {box-shadow: 0 2px 4px rgba(0, 0, 0, 0.08);}
.bs-md {box-shadow: 0 4px 8px rgba(0, 0, 0, 0.12);}
.bs-lg {box-shadow: 0 8px 16px rgba(0, 0, 0, 0.15);}
.bs-xl {box-shadow: 0 12px 24px rgba(0, 0, 0, 0.18);}
.bs-inner {box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.06);}
.bs-top {box-shadow: 0 -2px 4px rgba(0, 0, 0, 0.08);}
.bs-right {box-shadow: 2px 0 4px rgba(0, 0, 0, 0.08);}
.bs-flat {box-shadow: 0 1px 0 rgba(0, 0, 0, 0.1);}
/**/
.hvr\:bs:hover { --he-bs: 0 6px 12px rgba(0, 0, 0, 0.15); }
.hvr\:bs-lg:hover { --he-bs: 0 12px 24px rgba(0, 0, 0, 0.2); }
.hvr\:bs-inner:hover { --he-bs: inset 0 2px 8px rgba(0, 0, 0, 0.1); }

/***********************
* box-shadow-inside
***********************/
.bsi-1 {box-shadow: 0px 0px 5px 0px rgba(34, 60, 80, 0.22) inset;}

/***********************
* border-radius 
***********************/
.br-1 {border-radius: .25rem;} .br-2 {border-radius: .5rem;} .br-3 {border-radius: 1rem;} .br-4 {border-radius: 1.5rem;} .br-5 {border-radius: 3rem;}

/***********************
* z-index 
***********************/
.zi-m1 {z-index:-1;} .zi-0 {z-index:0;} .zi-1 {z-index:1;} .zi-2 {z-index:2;} .zi-10 {z-index:10;} .zi-100 {z-index:100;} .zi-250 {z-index:250;} .zi-500 {z-index:500;} .zi-999 {z-index:999;}

/***********************
* background blur  
***********************/
.bf-blur-1{backdrop-filter: blur(1px);}
.bf-blur-2{backdrop-filter: blur(2px);}
.bf-blur-3{backdrop-filter: blur(3px);}
.bf-blur-4{backdrop-filter: blur(5px);}
.bf-blur-5{backdrop-filter: blur(10px);}

/***********************
* Hover system
***********************/
[class*="hvr:clr-"]:hover,.hvr\:p:hover [class*="hvr:clr-"]:not(.hvr\:s) {color: var(--he-clr);}
[class*="hvr:bg-"]:hover,.hvr\:p:hover [class*="hvr:bg-"]:not(.hvr\:s) {background-color: var(--he-bg);}
[class*="hvr:op-"]:hover,.hvr\:p:hover [class*="hvr:op-"]:not(.hvr\:s) {opacity: var(--he-op);}
[class*="hvr:bdr-"]:hover,.hvr\:p:hover [class*="hvr:bdr-"]:not(.hvr\:s) {border: var(--he-bdr);}
[class*="hvr:tf-"]:hover,.hvr\:p:hover [class*="hvr:tf-"]:not(.hvr\:s) {transform: var(--he-tf); transform-style: var(--he-tf-style, flat);}
[class*="hvr:bs-"]:hover,.hvr\:p:hover [class*="hvr:bs-"]:not(.hvr\:s) {box-shadow: var(--he-bs);}
[class*="hvr:fi-"]:hover,[class*="hvr:fb-"]:hover,.hvr\:p:hover [class*="hvr:fi-"]:not(.hvr\:s),.hvr\:p:hover [class*="hvr:fb-"]:not(.hvr\:s) { filter: var(--he-filter);}
[class*="hvr:tdu-"]:hover,.hvr\:p:hover [class*="hvr:tdu-"]:not(.hvr\:s) {text-decoration: var(--he-tdu);}

/*Effects to new hover system */
.hvr\:tf-scale     {--he-tf: scale(1.05);}
.hvr\:tf-scale-m   {--he-tf: scale(0.95);}
.hvr\:tf-rotate-s  {--he-tf: rotate(-5deg) scale(1.02);}
.hvr\:tf-lift      {--he-tf: translateY(-5px);}
.hvr\:tf-tt-r      {--he-tf: translateX(0.5rem);}
.hvr\:tf-tilt      {--he-tf: perspective(500px) rotateX(5deg) rotateY(5deg);}
.hvr\:tf-rotate-m  {--he-tf: perspective(800px) rotateY(20deg) rotateX(10deg) translateZ(20px); --he-tf-style: preserve-3d;}
.hvr\:bs-tilt      {--he-bs: 10px 10px 20px rgba(0,0,0,0.2);}
.hvr\:bs-rotate-m  {--he-bs: 0 20px 40px rgba(0,0,0,0.2);}
.hvr\:tdu-underline {--he-tdu: underline;}
.hvr\:fi-10  {--he-filter: invert(10%);}
.hvr\:fb-150 {--he-filter: brightness(150%);}
.hvr\:fb-50  {--he-filter: brightness(50%);}

/***********************
* Opacity  
***********************/
.op-0 {opacity: 0;} .op-100 {opacity: 1;} .op-90 {opacity: .9;} .op-75 {opacity: 0.75;} .op-50 {opacity: 0.5;} .op-25 {opacity: 0.25;}
.hvr\:op-0:hover {--he-op: 0;} .hvr\:op-100:hover {--he-op: 1;} .hvr\:op-80:hover {--he-op: .8;} .hvr\:op-60:hover {--he-op: .6;} .hvr\:op-40:hover {--he-op: .4;} .hvr\:op-20:hover {--he-op: .2;}

/***********************
* border
***********************/
.bdr-none {border: none;}
.bdr-0 {border: 1px solid transparent;} .bdr-1 {border: 1px solid rgba(248,245,242,0.1);} .bdr-2 {border: 1px solid #e5e7eb;} .bdr-3 {border: 1px solid rgba(0,0,0,.1);}
.hvr\:bdr-1:hover {--he-bdr: 1px solid rgba(248,245,242,0.1);} .hvr\:bdr-2:hover {--he-bdr: 1px solid #e5e7eb;} .hvr\:bdr-3:hover {--he-bdr: 1px solid rgba(0,0,0,.1);}

/***********************
* old - no cat
***********************/
.cr-pointer {cursor:pointer;}
.cr-help {cursor: help;}
.cr-not-allowed {cursor: not-allowed;}
.resize-none {resize:none;}

/***********************
 * Grid Utilities
 ***********************/
/* Grid‑сетка (без переноса, равные колонки) */
.d-grid[class*="cols-"] {grid-template-columns: repeat(var(--cols), minmax(var(--w-min, 0), 1fr));}
/* Расположение элементов */
.col-span-2 {grid-column: span 2 / span 2;}
.col-span-3 {grid-column: span 3 / span 3;}
.col-span-full {grid-column: 1 / -1;}
.row-span-2 {grid-row: span 2 / span 2;}
.row-span-3 {grid-row: span 3 / span 3;}
/* Grid размещение */
.place-items-center {place-items: center;}
.place-content-center {place-content: center;}
/* Auto-fit/auto-fill (Авто-ячейки с переносом + растягивание или без) */
.gd-auto-fit {grid-template-columns: repeat(auto-fit, minmax(min(var(--w-min, 80px), 100%), 1fr));}
.gd-auto-fill {grid-template-columns: repeat(auto-fill, minmax(min(var(--w-min, 80px), 100%), 1fr));}

/***********************
* Experemental
***********************/
.view_row {display: -webkit-box;  -webkit-box-orient: vertical;  overflow: hidden; }
.vr-1 {-webkit-line-clamp: 1;} .vr-2 {-webkit-line-clamp: 2;} .vr-3 {-webkit-line-clamp: 3;} .vr-4 {-webkit-line-clamp: 4;} .vr-5 {-webkit-line-clamp: 5;}
.bg-scroll-fix { background-attachment: fixed;  background-size: cover;}

/***********************
* Оverflow
***********************/
.overflow-hidden {overflow: hidden;}
.overflow-auto {overflow:auto;}
.overflow-y-hidden {overflow-y: hidden;} /*V*/
.overflow-x-hidden {overflow-x: hidden;} /*G*/
.overflow-y-auto {overflow-y: auto;} /*V*/
.overflow-x-auto {overflow-x: auto;} /*G*/