/*
Theme Name: Vietcoder Theme
Description: This is a child theme for Flatsome Theme
Author: UX Themes
Template: flatsome
Version: 3.18.6
*/

@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap');

:root {
    --color-primary: 58, 102, 58;
	--color-primary-light: 94, 161, 94;
	--color-primary-bold: 40, 64, 42;
    --color-secondary: 0, 0, 0;
    --color-alert: 236, 69, 60;
    --color-success: 74, 159, 83;
    --color-process: 63, 162, 246;
    --color-warning: 255, 175, 0;
    --color-border-1: 33, 35, 34;
    --color-border-opposite: 255, 255, 255;
    --bg: 255, 255, 255;
    --bg-2nd: 243, 244, 246;
    --bg-opposite: 33, 34, 38;
    --color-text-title: 40, 64, 42;
	--color-text-sub: 75, 85, 99;
	--color-text-primary-light: 198, 219, 198;

    --opacity-text-sub: 0.75;
	
    --blog-img-ratio: 64%;

    --radius-1: 6px;
    --radius-2: 10px;
    --radius-3: 16px;
    --radius-4: 28px;
    --radius-sm: 4px;

    --size-ratio: 1.175;
}


/* Header ------- */
.header {
    --color-menu: rgb(var(--color-text-title));
    --color-menu-hover: rgb(var(--color-primary));
}

.header .header-nav > .menu-item > a {
    font-size: 1rem;
    font-weight: 500;	
}

.header-button .button {
    border-radius: var(--radius-1) !important;
    font-size: var(--size-small);
    letter-spacing: 0;
    font-weight: 600;
    min-height: unset;
    line-height: 1.2;
    padding: 9px 14px;
    background: rgb(var(--color-primary));
	color: rgb(var(--bg));
    box-shadow: 0 5px 10px rgb(var(--color-primary), 30%);	
}

.header-button .button:hover {
    background: rgb(var(--bg-opposite));
	transform: translatey(-2px);
}

body .header-wrapper.stuck {
    box-shadow: unset;
    border-bottom: 1px solid rgb(var(--color-border-1), 6%);
}


/* Custom nav dropdown ---- */
#header .nav-dropdown .header-search-form {
	padding: 0 12px;
}

#header .sub-menu,
#header .nav-dropdown {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: stretch;
  padding:  0;
  min-width: 260px;
  background-color: rgb(var(--color-primary));
	border-radius: var(--radius-1);
}

header .nav .nav-dropdown li {
  width: 100%;
  margin: 0;
  border: 0;
  padding: 10px 20px;
  position: relative;
  transition: 300ms all;
}

header .nav .nav-dropdown li+li {
  border-top: 1px solid rgb(var(--bg),10%);
}

#header .sub-menu>li>a,
#header .nav-dropdown>li>a {
  padding: 0;
  margin: 0;
  border: 0px;
  text-transform: capitalize;
  color: rgb(var(--bg));
  font-size: 14px;
  font-weight: 500;
  position: relative;
}

#header .sub-menu li:hover,
#header .nav-dropdown li:hover {
	background: rgb(var(--bg), 8%);
}

header .menu-item-design-default .nav-dropdown-col>a:after {
  content: '\e5e1';
  font-family: var(--ff-material-round);
  float: right;
  margin-left: 5px;
  font-size: 1em;
  line-height: 1;
  vertical-align: text-top;
  transform: translateY(2px);
  display: inline-block;
}

header .menu-item-design-default .sub-menu .sub-menu {
  position: absolute;
  left: 80%;
  top: 0;
  opacity: 0;
  visibility: hidden;
  transition: 300ms all;
}

header .menu-item-design-default .sub-menu li:hover>.sub-menu {
  left: 100%;
  opacity: 1;
  visibility: visible;
} 


/* Header - Mobile ---- */
.nav-icon .qodef-m-line {
    height: 2px;
    border-radius: 50px;
    background-color: rgb(var(--color-primary));
}

/* Menu - Aside ------------ */
.off-canvas-left .mfp-content {
    background-color: var(--background);
    width: 100%;
    max-width: var(--drawer-width, 500px);
    --background: rgb(var(--bg));
    --on-background: rgb(var(--color-text-title));
    --color-border: rgb(var(--color-border-1), 10%);
}

/* Menu toggle ----- */
.mfp-content .nav-sidebar li+li {
    border-top: 0px;
}

.mfp-content .nav-sidebar>li.menu-item.active,
.mfp-content .nav-sidebar>li.menu-item:hover {
    background-color: transparent;
}

.mfp-content .nav.nav-sidebar .children {
    padding-bottom: 0;
    padding-left: 15px;
    padding-top: 10px;
}


.mfp-content .nav .menu-item {
    padding: 10px 20px;
}

.mfp-content .off-canvas:not(.off-canvas-center) li.html {
    padding: 10px 20px;
}

.off-canvas .mfp-content .nav .menu-item>a {
    color: rgba(var(--color-primary));
    font-size: 16px;
    font-weight: 500;
    text-transform: capitalize;
    transition: 300ms all;
    padding: 8px 15px;
    border-radius: var(--radius-1);
	background-color: rgba(var(--color-primary), 8%);
}

.off-canvas .mfp-content .nav .menu-item-has-children >a {
	padding-right: 35px;
}

.off-canvas .mfp-content .nav .menu-item>a:hover {
}

.off-canvas .mfp-content .nav .menu-item .menu-item>a {
    font-weight: 500;
    font-size: 14px;
    text-transform: capitalize;
    justify-content: flex-start;
    text-align: left;
    width: 100%;
    padding: 8px 0px;
	background-color: transparent;

}

.off-canvas .mfp-content .nav .menu-item .menu-item {
    margin: 0;
    padding: 0;
} 

.mfp-content .header-logo-link  {
	padding-left: 0!important;
}

.mfp-content .header-logo-link img {
	width: 60%;
    margin: 10px auto 20px;
    height: 30px;
    display: block;
    object-fit: contain;
}

.mfp-content .header-button .button {
	display: block;
}

.mfp-content .toggle {
    margin: 0;
    opacity: 1;
    color: rgb(var(--color-primary));
    width: 34px;
    height: 34px;
    position: absolute;
    right: 20px;
    top: 14px;
    min-height: unset;
    line-height: 1;
}

.mfp-content .toggle i {
    line-height: 1;
    display: flex;
    width: 100%;
    height: 100%;
    align-items: center;
    justify-content: center;
    text-align: center;	
}


.searchform .flex-row {
    background-color: rgba(var(--color-primary), 6%);
    border-radius: var(--radius-1);
    border: 1px solid rgb(var(--color-primary), 15%);
}

.searchform .button.icon i {
    font-size: 1.2em;
    color: rgb(var(--color-primary));
}

.searchform .autocomplete-suggestions {
    background: rgb(var(--bg-2nd));
    color: rgb(var(--color-text-sub));
    font-size: var(--size-small);
    margin-top: 10px;
    border-radius: var(--radius-1);
}


/* Plugn - Gtranslate --- */
.gtranslate_wrapper .gt_switcher-popup span:nth-child(2){
	display: none;
}

.gtranslate_wrapper .gt_white_content {
    border-radius: var(--radius-1);
    padding: 10px 22px;
    height: fit-content;
    max-height: 50vh;
}

.gtranslate_wrapper  .gt_white_content a {
    display: flex;
    align-items: center;
    gap: 10px;
    color: rgb(var(--color-text-title));
    border: 0;
}

.gtranslate_wrapper .gt_black_overlay {
    width: 100vw;
	height: 100vh; 
}

.gtranslate_wrapper a.glink.gt-current-lang {
    font-weight: 600;
}


/* Ux - Pt button --- */
body .pt-btn {
	--btn-radius: var(--radius-1);
	color: var(--btn-color);
	font-weight: 500;
}

body .pt-btn:hover {
	color: var(--btn-color-hover);
}

body .pt-btn-size--md {
    --btn-padding: 5px 22px;
    --btn-size: 44px;
    --btn-font-size: 14px;
    --btn-line-height: 1.4;
}

body .pt-btn svg path,
body .pt-btn svg rect  {
	stroke: currentcolor;
}

body .pt-btn-kind--text-only {
    padding: 0;
	min-height: unset;
}


/* Home - Hero ---- */
.home-hero {
    --icon-size: 80px;	
}

.home-hero h1 {
    font-weight: 600;
    letter-spacing: 0;
    font-size: var(--size-8);
    line-height: 1.15;
    margin-bottom: 18px;
}

.home-hero h5 {
    font-size: var(--size-3);
    font-weight: 500;
    line-height: 1.5;
    margin-bottom: 18px;
    color: rgb(var(--color-text-sub));	
}

.home-hero .el-step {
	overflow: hidden;
}

.home-hero .el-step > .wrap-inner {
	min-width: max-content;
    display: flex;
    align-items: flex-start;
    gap: 30px;
    justify-content: space-between;
    position: relative;	
}


.home-hero .el-step >.wrap-inner:before {
	content:'';
	display: block;
    width: 100%;
    height: 3px;
    background: rgb(var(--bg-2nd));
    position: absolute;
    top: calc(var(--icon-size) + 12px);
}

.home-hero .el-step h6 {
	opacity: 1;
    text-transform: unset;
    letter-spacing: 0;
    font-weight: 500;
    font-size: 1rem;
    margin-bottom: 3px;
    line-height: 1.3;
}

.home-hero .el-step .icon-box.current h6,
.home-hero .el-step .icon-box.current p {
    color: rgb(var(--color-primary));	
}

.home-hero .el-step p {
    font-size: var(--size-small);
    color: rgb(var(--color-text-sub));	
}

.home-hero .el-step svg {
	padding: 0;
    width: calc(var(--icon-size) * 0.5);	
}

.home-hero .el-step .icon-box-img {
    width: var(--icon-size) !important;
    height: var(--icon-size);
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 50%;
    margin: 0 auto 25px;
    background: rgb(var(--bg-2nd));	
}

.home-hero .el-step .current .icon-box-img {
    background: rgb(var(--color-primary));		
}

.home-hero .el-step .icon-inner {
	color: rgb(var(--color-text-sub)) !important;
}

.home-hero .el-step .current .icon-inner {
	color: rgb(var(--bg)) !important;
}

.home-hero .el-step svg path {
    fill: transparent;
	stroke: currentColor;
}

.home-hero .el-meta {
    border-radius: var(--radius-1);
    border: 1px solid rgb(var(--color-primary-light), 20%);
    padding: 18px 4%;
    background: rgb(var(--color-primary-light), 5%);	
}

.home-hero .el-meta .pt-btn {
	width: max-content;
}



/* Home - Title ------ */
.home-title h6 {
	display: block;
    width: fit-content;
    background-color: rgb(var(--color-primary-light), 5%);
    text-transform: unset;
    opacity: 1;
    font-weight: 500;
    margin-bottom:  14px;
    color: rgb(var(--color-primary));
    letter-spacing: 0;
    font-size: 14px;
    padding: 5px 14px;
    border-radius: 100px;
    line-height: 1.4;
    border: 1px solid rgb(var(--color-primary-light), 40%);	
}

.text-center .home-title h6 {
	margin-left:  auto; 
	margin-right: auto;
}

.home-title .el-text {
    font-size: var(--size-6);
    font-weight: 500;
    line-height: 1.3;
    margin-bottom: 15px;	
}


.home-title .is-big .el-text {
    font-size: var(--size-7);
}

.home-title p {
	font-size: var(--size-2);
    color: rgb(var(--color-text-sub));	
	line-height: 1.5;
}

.home-title.is-light   p {
	color:rgb(var(--bg));
}

.home-title:has(.is-big) p {
	font-size: var(--size-3);	
}

.home-title.is-bg p {
	color: rgb(var(--bg),0.8);	
}

.home-title.is-bg h6 {
	color: rgb(var(--bg));
    background-color: rgb(var(--bg), 7%);
    border-color: rgb(var(--bg), 20%);	
}


/* UX  - Slider infinity */
#wrapper .slider-infinity .slider-item,
#wrapper .slider-infinity .post-item {
  opacity: 1;
  max-width: var(--item-w)!important;
  padding: var(--item-p);
	min-height: 100%;
}


/* Home - Architecture ---- */
.home-architecture {
  --item-w: calc(100% / 1.4);
  --item-p: 0 8px;
}

.home-architecture .slider-item .image-cover {
    border-radius: var(--radius-3);	
}

.home-architecture .slider-item .overlay {
	background: linear-gradient(0deg, #000 -60%, transparent 40%);	
}

.home-architecture .slider-item p{
	font-size: var(--size-2);
    line-height: 1.4;
    letter-spacing: 0;
    font-weight: 500;	
}


/* Home - State ---- */
.home-state .tab-area-title-item {
    color: rgb(var(--color-primary));
}

.home-state .tab-area-titles {
    padding: 0 15px;
}

.home-state .tab-area-contents {
	padding: 2.5rem 15px 0;
}

.home-state .icon-box {
	background: rgb(var(--color-primary-light), 10%);
    border: 1px solid rgb(var(--color-primary-light), 15%);
    padding: 25px 30px;
    border-radius: var(--radius-3);
    flex-wrap: nowrap;
    align-items: center;
    gap: 30px;
    flex-direction: row;	
}

.home-state .icon-box h6 {
	opacity: 1;
    text-transform: unset;
    letter-spacing: 0;
    line-height: 1.3;
    font-size: var(--size-4);
    font-weight: 600;
    color: rgb(var(--color-primary));
    margin-bottom: 16px;	
}

.home-state .icon-box p {
    font-size: 1rem;
    color: rgb(var(--color-primary));	
}

.home-state .icon-inner {
    display: flex;
    width: 100px;
    height: 100px;
    background: rgb(var(--bg), 50%);
    border-radius: 50%;
    padding: 25%;
    color: rgb(var(--color-primary));	
}

.home-state .icon-inner svg {
    padding: 0;
    width: 100%;	
}

.home-state .icon-box-img {
	width: max-content !important;	
	padding: 0 4%;
}

.home-state .tab-area svg path {
    fill: transparent;
	stroke: currentColor;
}

.home-state .icon-box .icon-box-text {
    padding-left: 0;
}

.home-state .el-note {
	background: rgb(var(--bg), 40%);
    width: fit-content;
    padding: 8px 16px;
    border-radius: var(--radius-1);	
}

/* Img radius ---- */
.img.img-radius-1 {
    border-radius: var(--radius-1);
    overflow: hidden;	
}

.img.img-radius-2 {
    border-radius: var(--radius-2);
    overflow: hidden;	
}

/* Ux - Home Card -------- */
.home-card {
	--icon-color: var(--color-primary);
    --card-bg: rgb(var(--color-primary-light), 5%);
    --card-border-color: var(--color-text-title);
	--size-ratio: 1.2;
    --size-2: calc(1rem * var(--size-ratio) - 1px);
    --size-3: calc(var(--size-2) * var(--size-ratio));
    --size-4: calc(var(--size-3) * var(--size-ratio));
    background: var(--card-bg);
    padding: min(30px, 6%);
    border-radius: var(--radius-2);
    border: 1px solid rgb(var(--card-border-color), 10%);
}

.home-card__ghost-primary-10 {
    --icon-color: var(--color-primary-light);
    --card-bg: rgb(var(--color-primary-light), 10%);
    --card-border-color: var(--color-primary-light);	
}

.home-card__ghost-bg {
    --icon-color: var(--bg);
    --card-bg: rgb(var(--bg), 5%);
	--card-border-color: var(--bg); 
}

.home-card__bg {
	 --icon-color: var(--bg);
    --card-bg: rgb(var(--bg));
    --card-border-color: var(--color-primary);
}

.home-card__primary {
    --icon-color: var(--bg);
    --card-bg: rgb(var(--color-primary));
	--card-border-color: var(--color-primary);
}

.home-card .icon-box-img svg path,
.home-card .icon-box-img svg rect {
    fill: transparent;
    stroke: currentColor;
}

.home-card .icon-box-img svg {
    color: rgb(var(--icon-color));
    background: rgb(var(--icon-color), 10%);
    padding: 20%;
    border-radius: var(--radius-2);	
}

.home-card .icon-circle svg {
    border-radius: 50%;	
}


.home-card .icon-box .icon-box-text {
    padding-left: 0;
}

.home-card .icon-box {
    flex-wrap: nowrap;
    gap: 1rem;	
}

.icon-box.icon-left-center {
	align-items: center;
	flex-wrap: nowrap;
}

.home-card :is(h6, h5, h4){
	font-size: var(--size-2);
    letter-spacing: 0;
    opacity: 1;
    text-transform: unset;
    line-height: 1.4;
    margin-bottom: 14px;
    font-weight: 600;	
}

.home-card h5 {
	font-size: var(--size-3);	
}

.home-card h4 {
	font-size: var(--size-4);	
}

.home-card .el-tag {
	font-size: var(--size-small-a);
    color: rgb(var(--color-primary));
    font-weight: 600;
    display: inline-block;
    width: fit-content;
    background: rgb(var(--color-primary), 8%);
    padding: 4px 12px;
    border-radius: 500px;
}

div.home-card li {
    margin-bottom: 8px;
    margin-left: 0;
}


ul.list-checked li,
ol.list-checked li {
	margin-left: 0;
}

ul.list-checked,
ol.list-checked{
	list-style: none;
}


ul.list-checked li:before,
ol.list-checked li:before {
	content: '\e5ca';
	display: inline-block;
    margin-right: 8px;
    font-family: var(--ff-material-outline);
    font-size: 1.2em;
    line-height: 1;
    vertical-align: top;
    transform: translateY(0.08em);
} 



ul.list-checked-filled li,
ol.list-checked-filled li {
	margin-left: 0;
}

ul.list-checked-filled,
ol.list-checked-filled{
	list-style: none;
}


ul.list-checked-filled li:before,
ol.list-checked-filled li:before {
	content: '\e5ca';
    color: rgb(var(--color-primary-light));
    background: rgb(var(--color-primary-light), 13%);
	font-family: var(--ff-material-round);
	display: inline-flex;
	width: 1.2em;
	height: 1.2em;
	min-width: 1.2em;
	justify-content: center;
	align-items: center;
	line-height: 1;
	border-radius: 50%;
	font-size: 1.2em;
	transform: translateY(0.15em);
	margin-right: 7px;
} 

.pt-min-w-max {
	min-width: max-content;
	max-width: 100%;
}


/* Home - Opportunity ---- */
.home-opportunity .el-count-text {
    font-size: var(--size-small);
    text-align: center;
    background: rgb(var(--bg), 7%);
    padding: 20px 20px 10px;
    border-radius: var(--radius-2);	
}

.home-opportunity .el-count-text h5 {
	font-size: var(--size-6);
    line-height: 1.1;
    margin-bottom: 12px;	
}

.home-opportunity .el-count-text h6 {
	opacity: 1;
    text-transform: unset;
    letter-spacing: 0;
    font-weight: 600;
    font-size: var(--size-2);
    line-height: 1.4;
    margin-bottom: 4px;	
}

/* Ux-  Table comapre ----- */
.pt-tab-compare {
    max-width: 100%;
    overflow-x: auto;
    overflow-y: hidden;	
}

.pt-tab-compare .el-tr {
	display: grid;
    grid-template-columns: 300px 1fr 1fr;	
	border-bottom: 1px solid rgb(var(--color-border-1), 5%);
}

.pt-tab-compare .el-thead {
	border-color:rgb(var(--color-border-1), 15%);
}

.pt-tab-compare .el-th {
	font-size: 1rem;
    color: rgb(var(--color-text-sub));
    font-weight: 500;
    line-height: 1.4;	
}

.pt-tab-compare :is(.el-td,.el-th) {
	padding: 16px 12px;	
}

.pt-tab-compare .el-td {
	color:rgb(var(--color-text-sub));
	line-height: 1.5;
}

.pt-tab-compare .el-td.label {
    font-weight: 500;
    color: rgb(var(--color-text-title));	
}

.pt-tab-compare .el-td.value {
	color: rgb(var(--color-text-title));
	display: flex;
    gap: 8px;
}

.pt-tab-compare .el-td.value:before {
	content: '\e5cd';
	font-family: var(--ff-material-round);
    display: inline-flex;
    width: 22px;
    height: 22px;
	min-width: 22px;
    justify-content: center;
    align-items: center;
    line-height: 1;
    border-radius: 50%;
    background: rgb(var(--color-text-title), 8%);
    font-size: 19px;
    transform: translateY(3px);
    color: rgb(var(--color-text-title), 40%);	
}

.pt-tab-compare .el-td.value.has:before {
	content: '\e5ca';
	color: rgb(var(--color-primary-light));
    background: rgb(var(--color-primary-light), 13%);
}


/* Home - Ecosystem ------- */
.home-ecosystem .tab-area {
    display: grid;
    grid-template-columns: 320px 1fr;
    gap: 15px 18px;	
}

.home-ecosystem .tab-area-titles {
	background: rgb(var(--bg));
    border: 1px solid rgb(var(--color-border-1), 10%);
    border-radius: var(--radius-2);
    padding: 20px 16px;	
}

.home-ecosystem .tab-area-titles-inner {
	display: flex;
    flex-direction: column;
    gap: 8px;
}

.home-ecosystem .tab-area-contents {
    padding-top: 0;
}

.home-ecosystem .tab-area-content-item {
    background: rgb(var(--bg));
    border: 1px solid rgb(var(--color-border-1), 10%);
    border-radius: var(--radius-2);
    padding: 30px;	
	position: relative;
	overflow: hidden;
	isolation: isolate;
}

.home-ecosystem .tab-area-content-item:before {
	content: '';
	display: block;
    width: 120px;
    height: 120px;
    border-radius: 50%;
    background: rgb(var(--color-primary-light), 8%);
    position: absolute;
    top: 0;
    left: 70%;
    transform: translateY(-55%);
    z-index: -1;
}


.home-ecosystem .tab-area-contents h3 {
    font-weight: 500;
    font-size: var(--size-4);
    line-height: 1.3;	
}

.home-ecosystem .tab-area-contents .icon-box {
	margin-bottom: 14px;	
}

.icon-box.is-icon-filled .icon-box-img {
	--icon-size: 48px;
    width: var(--icon-size)!important;
    height: var(--icon-size);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 10px;
    background: rgb(var(--color-primary-light), 15%);
    border-radius: var(--radius-1);
    line-height: 1;	
}

.icon-box.is-icon-filled  svg {
	padding: 0;
}

.icon-box.is-icon-filled  path,
.icon-box.is-icon-filled  rect {
	fill: none;
	stroke: currentcolor;
}

.icon-box.is-icon-filled .icon {
	margin: auto;
}

.home-ecosystem .tab-area-title-item {
    gap: 10px;
    background-color: rgb(var(--color-primary), 8%);
    border-radius: var(--radius-2);
    padding: 12px 14px;
	background-color: transparent;
}

.home-ecosystem .tab-area-title-item:hover {
    background-color: rgb(var(--bg-opposite), 5%);
}

.home-ecosystem .tab-area-title-item.active {
    background: rgb(var(--color-primary-light), 20%);
    color: rgb(var(--color-primary));
}


/* Ux - Pt tab icon ----*/
.tab-area.is-title-small .tab-area-title-item  {
    padding: 10px 18px;
    font-weight: 500;
    font-size: var(--size-small);	
}

.tab-area-title-item {
    color: rgb(var(--color-text-title));
}

.tab-area.is-big-gap .tab-area-contents {
    padding-top: 2.2rem;
}

/* Home- Certification -------- */
.home-certifi h3 {
    font-weight: 600;
	font-size: var(--size-3);
}

.home-certifi h4 {
    font-weight: 600;
	font-size: var(--size-2);
}

.home-certifi .col-card >.col-inner {
    background-color: rgb(var(--bg));
    padding: 24px;
    border-radius: var(--radius-2);
    box-shadow: 0 5px 10px rgb(0 0 0 / 4%);	
}

.home-certifi .col-card .icon-box {
    text-align: left;	
	align-items: center;
    flex-wrap: nowrap;
}

.home-certifi .col-card .icon-box.is-icon-filled .icon-box-img {
    --icon-size: 55px;
    padding: 6px;
	border-radius: 50%; 
}

.home-certifi li {
	margin-left: 0;
}


/* Home - Trusted */
.home-trusted .el-card {
    text-align: center;
    background: rgb(var(--bg));
    border: 1px solid rgb(var(--color-primary-light), 20%);
    border-radius: var(--radius-2);
    padding: 25px 20px 20px;	
}

.home-trusted .el-card .img {
    width: 100px !important;
    margin: 0 auto 12px;	
}

.home-trusted .el-card img {
	object-fit: contain;	
}

.home-trusted .el-card h5 {
    font-size: 1rem;
    font-weight: 600;
    color: rgb(var(--color-primary));
    line-height: 1.4;
    margin-bottom: 12px;	
}

.home-trusted .el-card h6 {
	display: block;
    width: fit-content;
    font-size: var(--size-small-a);
    letter-spacing: 0;
    font-weight: 500;
    text-transform: unset;
    margin: auto;
    color: rgb(var(--color-primary));
    background: rgb(var(--color-primary-light), 20%);
    padding: 5px 10px;
    border-radius: 100px;
    opacity: 1;
    line-height: 1.3;	
}

.home-trusted .el-counts{
    background: rgb(var(--color-primary-light), 10%);
    border: 1px solid rgb(var(--color-primary-light), 20%);
    border-radius: var(--radius-2);
    padding: 18px 10px 6px;
    text-align: center;
    font-size: 1rem;
    font-weight: 500;
    color: rgb(var(--color-primary));	
}


.home-trusted .el-count h6 {
    opacity: 1;
    line-height: 1.1;
    text-transform: unset;
    color: rgb(var(--color-primary));
    letter-spacing: 0;
    font-size: var(--size-5);
    margin-bottom: 5px;	
}


/* Bux - Blog ----- */
.box.box-blog-post .is-divider {
	display: none;
}

.box.box-blog-post .image-cover {
	padding-top: var(--blog-img-ratio)!important;
    border-radius: var(--radius-2);	
}

.box-blog-post .box-text {
	padding-top: 14px;
	padding-bottom: 2px;
}

.box-blog-post .post-title {
    margin-bottom: 6px;
}

.box-blog-post .post-title a {
    -webkit-line-clamp: 2;
    line-height: 1.4;
    font-weight: 500;
    font-size: var(--size-2);
}

.box-blog-post .from_the_blog_excerpt {
    font-size: var(--size-small);
    line-height: 1.5;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}

.box.box-blog-post .box-text-inner {
    display: grid;
    grid-template-columns: 1fr;	
}

.box-blog-post .post-meta {
    opacity: 75%;
    font-size: var(--size-small);
    order: 20;
    margin-top: 10px;
    letter-spacing: 0;
}

.box-blog-post .cat-label {
    width: fit-content;
    font-size: var(--size-small-a);
    opacity: 1;
    margin-bottom: 7px;
    max-width: 50%;
    color: rgb(var(--color-primary));
    font-weight: 500;
    letter-spacing: 0;
    background: rgb(var(--color-primary-light), 12%);
    border-radius: 300px;
    padding: 7px 15px;
}

/* --- */
.box-vertical.box-blog-post {
    display: grid;
    grid-template-columns: 6fr 10fr;
    gap: 20px 24px;	
	--blog-img-ratio: 64%;
}

.box-vertical.box-blog-post .box-text {
	padding: 0;
}

.box-vertical.box-blog-post .box-image {
	width: 100%;
}

.box-vertical.box-blog-post .from_the_blog_excerpt {
	font-size: 1rem; 
}


.box-vertical.box-blog-post .post-title a {
    font-size: var(--size-3);
}

.post-item + .post-item .box-vertical.box-blog-post {
    border-top: 1px solid rgb(var(--color-border-1), 10%);
    padding-top: 30px;	
}


/* Archive - Blog ------ */
.archive-page-header .page-title {
    position: relative;
    font-size: var(--size-5);
    line-height: 1.3;
    text-transform: capitalize;
    letter-spacing: 0;
    font-weight: 600;
}

.widget {
    margin-bottom: 30px;
}

.widget .widget-title {
    font-size: var(--size-4);
    font-weight: 600;
    letter-spacing: 0;
    color: rgb(var(--color-text-title));
    line-height: 1.4;
    margin-bottom: 12px;
    display: block;
}

aside.widget .cat-item {
	font-size: max(1rem, 16px);
    line-height: 1.4;
    color: rgb(var(--color-text-title), 0.5);
    position: relative;
    padding-right: 24px;
    display: flex;
    justify-content: space-between;
    gap: 12px;
}

aside.widget .cat-item a {
    font-size: inherit;
    color: rgb(var(--color-text-title));
    text-decoration: none;
    transition: 200ms all;
    padding: 0;
}

aside.widget .cat-item a:hover {
    color: rgb(var(--color-primary));
}

aside.widget .cat-item.current-cat>a {
    color: rgb(var(--color-primary));
    font-weight: inherit;
}

.widget .searchform .flex-row {
    background-color: transparent;
}

aside.widget .cat-item .children {
    border-left: 0;
    margin-top: -2px;
    margin-left: 10px;
    padding-left: 0;
}

aside.widget .cat-item .cat-item {
	padding-right: 0;
}

.widget .cat-item .children .children {
	display: none;
}


.tagcloud {
    display: flex;
    gap: 5px 10px;
    flex-wrap: wrap;	
}

.tagcloud .tag-cloud-link {
	transition: 320ms all;
    font-size: var(--size-small)!important;
    display: block;
    opacity: 1;
    color: rgb(var(--color-text-sub));
    background: rgb(var(--color-text-sub), 8%);
    line-height: 1.2;
    padding: 4px 12px;
    border-radius: 500px;	
}

.tagcloud .tag-cloud-link:hover {
    color: rgb(var(--color-text-sub));
    background: rgb(var(--color-text-sub), 18%);
}


/* Single - Post ------ */
.single-post .page-title .title-bg {
	height: unset!important;
	transform: none!important;
}

.single-post .page-wrapper {
	padding-bottom: 0; 
	padding-top: 10px;
}

.single-post .featured-title .page-title-inner {
    padding: 140px 15px;
    text-align: left;
    min-height: unset !important;
}

.single-post .entry-divider {
	display: none;
}

.single-post .page-title-inner > .flex-col {
    width: 100%;
    text-align: left;	
}

.single-post .entry-title {
	font-weight: 500;
    letter-spacing: 0;
    font-size: var(--size-7);
    line-height: 1.2;
    margin-bottom: 18px;	
}

.page-title .entry-meta  {
    text-shadow: none;
    font-size: 14px;
    letter-spacing: 0;
    font-weight: 500;
    color: rgb(255 255 255 / 80%);	
}

.page-title .entry-meta a {
    text-transform: capitalize;
    font-weight: inherit;
    color: inherit;
    text-underline-offset: 2px;
}

.page-title .entry-meta a:hover {
    text-decoration: underline 1px;
}

.page-title .entry-category {
	font-size: 0;
	text-shadow: none;
	margin-bottom: 15px;
	opacity: 1;
    display: flex;
    gap: 12px 7px;
    flex-wrap: wrap;
}

.page-title .entry-category a {
    font-size: var(--size-small);
    font-weight: 500;
    text-transform: none;
    color: rgb(var(--bg));
    opacity: 1;
    background: rgb(var(--bg), 10%);
    padding: 5px 12px;
    border-radius: 500px;
    letter-spacing: 0;
	transition: 220ms all;
}

.page-title .entry-category a:first-child {
    background: rgb(var(--color-primary-light));
}

.page-title .entry-category a:hover {
    background: rgb(var(--color-primary));
}

.page-title .entry-category a:hover {
	
}


.single-blog_release h3 {
    font-size: var(--size-6);
    line-height: 1.3;
    margin-bottom: 24px;
    font-weight: 600;
    text-align: center;
}

.single-post-relate {
    background: rgb(var(--color-primary-light), 9%);
    padding: 40px 0 10px;	
}







/* Ux - Footer ------- */
footer .absolute-footer {
	display: none;
}

.footer-info .logo img {
	height: var(--size-4);
    margin-bottom: 18px;	
}

.footer-info h5 {
    font-size: var(--size-4);
    font-weight: 600;
    color: rgb(var(--color-text-title));
    margin-bottom: 14px;
    line-height: 1.15;	
}

.footer-info {
	font-size: 14px;
    color: rgb(var(--color-primary));	
}

.footer-info .ux-menu-link__link {
	min-height: unset;
    line-height: 1.4;
    padding: 5px 0;	
}

.footer-info p {
	margin-bottom: 10px;
}

.footer-info .col-copyright .ux-menu{
    text-align: right;
    justify-content: flex-end;
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    gap: 0 20px;	
}




























/* Responsive ---------------- */
@media only screen and (min-width: 1025px) and (max-width: 1600px) {}

@media only screen and (max-width: 1024px) {}

@media only screen and (max-width: 849px) {
	:root {
		--size-ratio: 1.15;
		font-size: 14px;
	}
	
	.home-hero {
		--icon-size: 60px;
	}
	.home-hero  br {
		display: none;
	}
	
	.home-architecture {
	  --item-w: calc(100% / 1.15);
	}
	
	.home-state .icon-box {
		flex-direction: column;
		padding: 25px 20px;
	}
	
	.pt-tab-compare .el-tr {
		grid-template-columns: 120px 200px 200px;
		width: max-content;
	}
	
	.home-ecosystem .tab-area {
		grid-template-columns: 1fr; 
	}
	
	.footer-info .col-copyright {
		text-align: center;
	}
	.footer-info .col-copyright .ux-menu {
		justify-content: center;
		text-align: center;
	}
	
	.box-vertical.box-blog-post {
		grid-template-columns: 1fr;
		--blog-img-ratio: 50%;
	}
	
	.single-post .featured-title .page-title-inner {
		padding: 80px 15px; 
	}
	
}

@media only screen and (max-width: 549px) {
	.icon-box.icon-sm-top-center  {
		flex-direction: column;
	}
	
	
}