.uf-skills {
  --bs-blue: #0d6efd; --bs-indigo: #6610f2; --bs-purple: #6f42c1; --bs-pink: #d63384; --bs-red: #dc3545; --bs-orange: #fd7e14; --bs-yellow: #ffc107; --bs-green: #198754; --bs-teal: #20c997; --bs-cyan: #0dcaf0; --bs-black: #000; --bs-white: #fff; --bs-gray: #6c757d; --bs-gray-dark: #343a40; --bs-gray-100: #f8f9fa; --bs-gray-200: #e9ecef; --bs-gray-300: #dee2e6; --bs-gray-400: #ced4da; --bs-gray-500: #adb5bd; --bs-gray-600: #6c757d; --bs-gray-700: #495057; --bs-gray-800: #343a40; --bs-gray-900: #212529; --bs-primary: #0d6efd; --bs-secondary: #6c757d; --bs-success: #198754; --bs-info: #0dcaf0; --bs-warning: #ffc107; --bs-danger: #dc3545; --bs-light: #f8f9fa; --bs-dark: #212529; --bs-primary-rgb: 13, 110, 253; --bs-secondary-rgb: 108, 117, 125; --bs-success-rgb: 25, 135, 84; --bs-info-rgb: 13, 202, 240; --bs-warning-rgb: 255, 193, 7; --bs-danger-rgb: 220, 53, 69; --bs-light-rgb: 248, 249, 250; --bs-dark-rgb: 33, 37, 41; --bs-primary-text-emphasis: #052c65; --bs-secondary-text-emphasis: #2b2f32; --bs-success-text-emphasis: #0a3622; --bs-info-text-emphasis: #055160; --bs-warning-text-emphasis: #664d03; --bs-danger-text-emphasis: #58151c; --bs-light-text-emphasis: #495057; --bs-dark-text-emphasis: #495057; --bs-primary-bg-subtle: #cfe2ff; --bs-secondary-bg-subtle: #e2e3e5; --bs-success-bg-subtle: #d1e7dd; --bs-info-bg-subtle: #cff4fc; --bs-warning-bg-subtle: #fff3cd; --bs-danger-bg-subtle: #f8d7da; --bs-light-bg-subtle: #fcfcfd; --bs-dark-bg-subtle: #ced4da; --bs-primary-border-subtle: #9ec5fe; --bs-secondary-border-subtle: #c4c8cb; --bs-success-border-subtle: #a3cfbb; --bs-info-border-subtle: #9eeaf9; --bs-warning-border-subtle: #ffe69c; --bs-danger-border-subtle: #f1aeb5; --bs-light-border-subtle: #e9ecef; --bs-dark-border-subtle: #adb5bd; --bs-white-rgb: 255, 255, 255; --bs-black-rgb: 0, 0, 0; --bs-font-sans-serif: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", "Liberation Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; --bs-font-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; --bs-gradient: linear-gradient( 180deg, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0) ); --bs-body-font-family: var(--bs-font-sans-serif); --bs-body-font-size: 1rem; --bs-body-font-weight: 400; --bs-body-line-height: 1.5; --bs-body-color: #212529; --bs-body-color-rgb: 33, 37, 41; --bs-body-bg: #fff; --bs-body-bg-rgb: 255, 255, 255; --bs-emphasis-color: #000; --bs-emphasis-color-rgb: 0, 0, 0; --bs-secondary-color: rgba(33, 37, 41, 0.75); --bs-secondary-color-rgb: 33, 37, 41; --bs-secondary-bg: #e9ecef; --bs-secondary-bg-rgb: 233, 236, 239; --bs-tertiary-color: rgba(33, 37, 41, 0.5); --bs-tertiary-color-rgb: 33, 37, 41; --bs-tertiary-bg: #f8f9fa; --bs-tertiary-bg-rgb: 248, 249, 250; --bs-heading-color: inherit; --bs-link-color: #0d6efd; --bs-link-color-rgb: 13, 110, 253; --bs-link-decoration: underline; --bs-link-hover-color: #0a58ca; --bs-link-hover-color-rgb: 10, 88, 202; --bs-code-color: #d63384; --bs-highlight-color: #212529; --bs-highlight-bg: #fff3cd; --bs-border-width: 1px; --bs-border-style: solid; --bs-border-color: #dee2e6; --bs-border-color-translucent: rgba(0, 0, 0, 0.175); --bs-border-radius: 0.375rem; --bs-border-radius-sm: 0.25rem; --bs-border-radius-lg: 0.5rem; --bs-border-radius-xl: 1rem; --bs-border-radius-xxl: 2rem; --bs-border-radius-2xl: var(--bs-border-radius-xxl); --bs-border-radius-pill: 50rem; --bs-box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15); --bs-box-shadow-sm: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075); --bs-box-shadow-lg: 0 1rem 3rem rgba(0, 0, 0, 0.175); --bs-box-shadow-inset: inset 0 1px 2px rgba(0, 0, 0, 0.075); --bs-focus-ring-width: 0.25rem; --bs-focus-ring-opacity: 0.25; --bs-focus-ring-color: rgba(13, 110, 253, 0.25); --bs-form-valid-color: #198754; --bs-form-valid-border-color: #198754; --bs-form-invalid-color: #dc3545; --bs-form-invalid-border-color: #dc3545;
  scroll-behavior: smooth;
  --bs-breakpoint-xs: 0; --bs-breakpoint-sm: 576px; --bs-breakpoint-md: 768px; --bs-breakpoint-lg: 992px; --bs-breakpoint-xl: 1200px; --bs-breakpoint-xxl: 1400px;
  --heading-font: "Phudu", sans-serif; --body-font: "Instrument Sans", sans-serif; --heading-one: clamp(2rem, -0.0733rem + 6.3692vw, 4.25rem); --heading-two: clamp(1.75rem, 0.7133rem + 2.8846vw, 2.875rem); --heading-three: clamp(1.5rem, 0.3353rem + 2.1661vw, 2.5rem); --heading-four: clamp(1.25rem, 0.5569rem + 1.444vw, 2rem); --heading-five: clamp(1.125rem, 1.2rem + 0.722vw, 1.75rem); --heading-six: clamp(1rem, 0.769rem + 0.6813vw, 1.25rem); --main-h: 72; --main-s: 99%; --main-l: 50%; --main: var(--main-h) var(--main-s) var(--main-l); --main-two-h: 19; --main-two-s: 100%; --main-two-l: 50%; --main-two: var(--main-two-h) var(--main-two-s) var(--main-two-l); --white: 0 0% 100%; --black: 208 76% 3%; --body: 204 16% 24%; --heading-color: var(--black); --body-color: var(--body); --translate-x-50: translateX(-50%); --translate-y-50: translateY(-50%); --size-05: 0.125rem; --size-1: 0.25rem; --size-105: 0.375rem; --size-2: 0.5rem; --size-205: 0.625rem; --size-3: 0.75rem; --size-305: 0.875rem; --size-4: 1rem; --size-405: 1.125rem; --size-5: 1.25rem; --size-505: 1.375rem; --size-6: 1.5rem; --size-605: 1.625rem; --size-7: 1.75rem; --size-705: 1.875rem; --size-8: 2rem; --size-9: 2.25rem; --size-10: 2.5rem; --size-101: 2.625rem; --size-11: 2.75rem; --size-12: 3rem; --size-120: 3.125rem; --size-13: 3.25rem; --size-14: 3.5rem; --size-15: 3.75rem; --size-16: 4rem; --size-17: 4.25rem; --size-170: 4.375rem; --size-18: 4.625rem; --size-20: 5rem; --size-21: 5.25rem; --size-22: 5.5rem; --size-220: 5.625rem; --size-25: 6.25rem; --size-28: 7rem; --size-30: 7.5rem; --main-50: hsl( var(--main-h), var(--main-s), calc(var(--main-l) + (100% - var(--main-l)) * 0.9) ); --main-100: hsl( var(--main-h), var(--main-s), calc(var(--main-l) + (100% - var(--main-l)) * 0.8) ); --main-200: hsl( var(--main-h), var(--main-s), calc(var(--main-l) + (100% - var(--main-l)) * 0.7) ); --main-300: hsl( var(--main-h), var(--main-s), calc(var(--main-l) + (100% - var(--main-l)) * 0.6) ); --main-400: hsl( var(--main-h), var(--main-s), calc(var(--main-l) + (100% - var(--main-l)) * 0.5) ); --main-500: hsl( var(--main-h), var(--main-s), calc(var(--main-l) + (100% - var(--main-l)) * 0.4) ); --main-600: hsl(var(--main-h), var(--main-s), var(--main-l)); --main-700: hsl( var(--main-h), var(--main-s), calc(var(--main-l) - var(--main-l) * 0.1) ); --main-800: hsl( var(--main-h), var(--main-s), calc(var(--main-l) - var(--main-l) * 0.2) ); --main-900: hsl( var(--main-h), var(--main-s), calc(var(--main-l) - var(--main-l) * 0.3) ); --main-two-50: hsl( var(--main-two-h), var(--main-two-s), calc(var(--main-two-l) + (100% - var(--main-two-l)) * 0.9) ); --main-two-100: hsl( var(--main-two-h), var(--main-two-s), calc(var(--main-two-l) + (100% - var(--main-two-l)) * 0.8) ); --main-two-200: hsl( var(--main-two-h), var(--main-two-s), calc(var(--main-two-l) + (100% - var(--main-two-l)) * 0.7) ); --main-two-300: hsl( var(--main-two-h), var(--main-two-s), calc(var(--main-two-l) + (100% - var(--main-two-l)) * 0.6) ); --main-two-400: hsl( var(--main-two-h), var(--main-two-s), calc(var(--main-two-l) + (100% - var(--main-two-l)) * 0.5) ); --main-two-500: hsl( var(--main-two-h), var(--main-two-s), calc(var(--main-two-l) + (100% - var(--main-two-l)) * 0.4) ); --main-two-600: hsl(var(--main-two-h), var(--main-two-s), var(--main-two-l)); --main-two-700: hsl( var(--main-two-h), var(--main-two-s), calc(var(--main-two-l) - var(--main-two-l) * 0.1) ); --main-two-800: hsl( var(--main-two-h), var(--main-two-s), calc(var(--main-two-l) - var(--main-two-l) * 0.2) ); --main-two-900: hsl( var(--main-two-h), var(--main-two-s), calc(var(--main-two-l) - var(--main-two-l) * 0.3) ); --neutral-50: #f9fafb; --neutral-100: #f3f4f6; --neutral-200: #e5e7eb; --neutral-300: #d1d5db; --neutral-400: #9ca3af; --neutral-500: #6b7280; --neutral-600: #4b5563; --neutral-700: #374151; --neutral-800: #1f2937; --neutral-900: #111827; --neutral-950: #030712; --font-xs: 0.75rem; --font-sm: 0.875rem; --font-base: 1rem; --font-lg: 1.125rem; --font-xl: 1.25rem; --font-2xl: 1.5rem; --font-3xl: 1.875rem;
  --success-600: #16a34a; --danger-600: #dc2626; --warning-600: #d97706; --info-600: #0284c7;
  font-family: var(--body-font); color: hsl(var(--body-color)); word-break: break-word; overflow: hidden;
}
.uf-skills, .uf-skills *, .uf-skills *::before, .uf-skills *::after { box-sizing: border-box; }
.uf-skills * { margin: 0; padding: 0; }
.uf-skills ul { list-style: none; }
.uf-skills img { max-width: 100%; height: auto; }
.uf-skills a { display: inline-block; transition: 0.2s linear; text-decoration: none; color: inherit; }
.uf-skills h2 { margin: 0; font-family: var(--heading-font); font-weight: 600; font-size: var(--heading-two); line-height: 1.2; color: hsl(var(--heading-color)); }
.uf-skills h2 > a { font-weight: inherit; font-size: inherit; color: inherit; line-height: inherit; }
.uf-skills .uf-container { --bs-gutter-x: 1.5rem; --bs-gutter-y: 0; width: 100%; padding-right: calc(var(--bs-gutter-x) * 0.5); padding-left: calc(var(--bs-gutter-x) * 0.5); margin-right: auto; margin-left: auto; }
@media (min-width: 576px) {
  .uf-skills .uf-container { max-width: 540px; }
}
@media (min-width: 768px) {
  .uf-skills .uf-container { max-width: 720px; }
}
@media (min-width: 992px) {
  .uf-skills .uf-container { max-width: 960px; }
}
@media (min-width: 1200px) {
  .uf-skills .uf-container { max-width: 1140px; }
}
@media (min-width: 1400px) {
  .uf-skills .uf-container { max-width: 1320px; }
}
.uf-skills .uf-row { --bs-gutter-x: 1.5rem; --bs-gutter-y: 0; display: flex; flex-wrap: wrap; margin-top: calc(-1 * var(--bs-gutter-y)); margin-right: calc(-0.5 * var(--bs-gutter-x)); margin-left: calc(-0.5 * var(--bs-gutter-x)); }
.uf-skills .uf-row > * { flex-shrink: 0; width: 100%; max-width: 100%; padding-right: calc(var(--bs-gutter-x) * 0.5); padding-left: calc(var(--bs-gutter-x) * 0.5); margin-top: var(--bs-gutter-y); }
.uf-skills .col-12 { flex: 0 0 auto; width: 100%; }
.uf-skills .overflow-hidden { overflow: hidden !important; }
.uf-skills .d-flex { display: flex !important; }
.uf-skills .d-inline-flex { display: inline-flex !important; }
.uf-skills .position-relative { position: relative !important; }
.uf-skills .flex-wrap { flex-wrap: wrap !important; }
.uf-skills .justify-content-between { justify-content: space-between !important; }
.uf-skills .align-items-center { align-items: center !important; }
.uf-skills .ms-auto { margin-left: auto !important; }
.uf-skills .fw-medium { font-weight: 500 !important; }
.uf-skills .lh-1 { line-height: 1 !important; }
.uf-skills .text-uppercase { text-transform: uppercase !important; }

.uf-skills { --skill-blue: #455ce9; }
.uf-skills .text-white { color: #1c1d20 !important; }
.uf-skills .service-three-single .text-white { color: #fff !important; }
.uf-skills .bg-black { background-color: #fff !important; }
.uf-skills .z-1 { z-index: 1 !important; }
.uf-skills .hover-bg-main-two-600:hover { background-color: var(--skill-blue) !important; }
.uf-skills .hover-border-main-two-600:hover { border-color: var(--skill-blue) !important; }
.uf-skills .hover-text-heading:hover { color: #fff !important; }
.uf-skills .tw-text-sm { font-size: 0.875rem; }
.uf-skills .tw-text-xl { font-size: 1.25rem; }
.uf-skills .tw-text-15 { font-size: 3.75rem; }
.uf-skills .tw-gap-205 { gap: var(--size-205); }
.uf-skills .tw-gap-3 { gap: var(--size-3); }
.uf-skills .tw-gap-14 { gap: var(--size-14); }
.uf-skills .tw-gap-16 { gap: var(--size-16); }
.uf-skills .tw-mt-5 { margin-block-start: var(--size-5); }
.uf-skills .tw-mb-4 { margin-block-end: var(--size-4); }
.uf-skills .tw-pt-17 { padding-block-start: var(--size-17); }
.uf-skills .tw-pb-15 { padding-block-end: 20px; }
.uf-skills .pt-120 { padding-block-start: 60px; }
@media (min-width: 576px) {
  .uf-skills .pt-120 { padding-block-start: 80px; }
}
@media (min-width: 992px) {
  .uf-skills .pt-120 { padding-block-start: 40px; }
}
.uf-skills .tw-transition-3 { transition: 0.3s; }
.uf-skills .tw-container-1800-px { max-width: 1800px; }
.uf-skills .marquee { display: flex; flex-direction: column; }
.uf-skills .marquee_left { padding-block: 16px; }
.uf-skills .js-marquee { display: flex; gap: 64px; min-width: max-content; }
.uf-skills .js-marquee-wrapper { display: flex; gap: 64px; }
.uf-skills .marquee-two-title { font-size: 165px; line-height: 95%; }
.uf-skills .marquee-three-title.text-stroke { -webkit-text-stroke-width: 1px; color: #ffffff; -webkit-text-stroke-color: #1c1d20; }
.uf-skills .portfolio-list ul li a { border: 1px solid rgba(2, 9, 15, 0.1); border-radius: 90px; padding: 6px 20px 6px 40px; }
.uf-skills .portfolio-list ul li a::before { content: ""; position: absolute; width: 10px; height: 10px; inset-block-start: 50%; inset-inline-start: 20px; background: hsl(var(--black)); border-radius: 50%; transform: translateY(-50%); transition: 0.4s; }
.uf-skills .portfolio-list ul li a:hover::before { background: hsl(var(--white)); }
.uf-skills .portfolio-two-list ul li a { border: 1px solid rgba(255, 255, 255, 0.2); border-radius: 90px; padding: 6px 20px 6px 40px; }
.uf-skills .portfolio-two-list ul li a::before { background: #fff; }
.uf-skills .portfolio-two-list ul li a:hover::before { background: #fff; }
.uf-skills .service-three-single { background: #000; border: 2px solid rgba(255, 255, 255, 0.1); padding: 30px 30px 30px 60px; border-radius: 200px; margin-block-end: 60px; max-width: 1500px; width: 100%; transition: 0.5s; }
@media screen and (max-width: 767px) {
  .uf-skills .service-three-single { border-radius: 100px; }
}
.uf-skills .service-three-single:hover { border: 2px solid var(--skill-blue); }

.uf-skills .service-three-single:hover .portfolio-list ul li a { background-color: var(--skill-blue); border-color: var(--skill-blue); }
@media screen and (max-width: 767px) {
  .uf-skills .service-three-item { flex-wrap: wrap; row-gap: 30px; }
}
@media screen and (max-width: 991px) {
  .uf-skills .service-three-content { align-items: center; gap: var(--size-4); }
}
@media screen and (max-width: 767px) {
  .uf-skills .service-three-content { flex-wrap: wrap; }
}
.uf-skills .service-three-number { width: 86px; }
.uf-skills .service-three-number img { filter: brightness(0) invert(1); }
@media screen and (max-width: 1199px) {
  .uf-skills .service-three-title { font-size: 2.6rem; }
}

.uf-skills.uf-ready .uf-fade { will-change: transform; }
.uf-skills + .footer-rounded-div .rounded-div { background: #fff; }

.uf-skills .service-three-title { word-break: normal; overflow-wrap: normal; }
@media screen and (max-width: 991px) {
  .uf-skills .service-three-title { font-size: 2.1rem; }
  .uf-skills .service-three-single { padding: 26px 26px 26px 40px; }
  .uf-skills .service-three-content { gap: var(--size-6); }
}
@media screen and (max-width: 767px) {
  .uf-skills .service-three-title { font-size: clamp(1.6rem, 7.2vw, 2.1rem); }
  .uf-skills .service-three-single { padding: 26px 22px 26px 28px; margin-block-end: 36px; }
  .uf-skills .service-three-number { width: auto; }
  .uf-skills .service-three-item > div:last-child { max-width: 100%; }
}

/* keep the picture at full size, long chip lists wrap instead of squeezing it */
@media screen and (min-width: 1200px) {
  .uf-skills .service-three-thumb { flex-shrink: 0; }
}