/*body {
    background: #0a0a0f;
    color: white;
    min-height: 100vh;
    overflow-x: hidden;
    position: relative;
}
body::before {
    content: '';
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: 
        radial-gradient(circle at 20% 80%, rgba(120, 119, 198, 0.3) 0%, transparent 50%),
        radial-gradient(circle at 80% 20%, rgba(255, 119, 198, 0.15) 0%, transparent 50%),
        radial-gradient(circle at 40% 40%, rgba(120, 219, 255, 0.1) 0%, transparent 50%);
    z-index: -2;
    animation: backgroundShift 20s ease-in-out infinite;
}*/

.portfolio-site-inner img {
    width: 100%;
    height: 1000px;
}
.portfolio-site-inner {
    margin: 0;
}
.portfolio-site.img .container-fluid {
  padding: 0;
}
.noise {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0.02;
    z-index: -1;
    background: url('data:image/svg+xml,<svg viewBox="0 0 256 256" xmlns="http://www.w3.org/2000/svg"><filter id="noiseFilter"><feTurbulence type="fractalNoise" baseFrequency="0.9" numOctaves="1"/></filter><rect width="100%" height="100%" filter="url(%23noiseFilter)" opacity="0.4"/></svg>');
    animation: noiseAnim 8s steps(10) infinite;
}

.container {
    /*max-width: 1400px;
    margin: 0 auto;
    padding: 0 2rem;
    position: relative;
    z-index: 1;*/
    font-family: "Poppins", serif;
}

/* Navigation */
.navilink {
    position: fixed;
    top: 35rem;
    left: 2rem;
    right: 2rem;
    z-index: 1000;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.back-btn {
    background: rgba(255, 255, 255, 0.08);
    backdrop-filter: blur(20px);
    border: 1px solid rgba(255, 255, 255, 0.1);
    padding: 1rem 1.5rem;
    border-radius: 60px;
    cursor: pointer;
    transition: all 0.4s cubic-bezier(0.23, 1, 0.320, 1);
    color: white;
    font-size: 0.9rem;
    font-weight: 500;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.back-btn:hover {
    background: rgba(255, 255, 255, 0.15);
    transform: translateX(-8px);
    box-shadow: 0 8px 32px rgba(255, 255, 255, 0.1);
}

.nav-menu {
    background: rgba(255, 255, 255, 0.08);
    backdrop-filter: blur(20px);
    border: 1px solid rgba(255, 255, 255, 0.1);
    padding: 1rem 2rem;
    border-radius: 60px;
    display: flex;
    gap: 2rem;
}

.nav-link {
    color: rgba(255, 255, 255, 0.7);
    text-decoration: none;
    font-size: 0.9rem;
    font-weight: 500;
    transition: all 0.3s ease;
}

.nav-link:hover {
    color: white;
}

/* Hero Section */
.hero {
    /*min-height: 100vh;*/
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
    position: relative;
    padding: 2rem 0 4rem;
    background: #fff;
}

.hero-badge {
    background: linear-gradient(135deg, rgba(120, 119, 198, 0.2), rgba(255, 119, 198, 0.2));
    border: 1px solid rgba(255, 255, 255, 0.1);
    padding: 0.8rem 2rem;
    border-radius: 50px;
    font-size: 0.9rem;
    font-weight: 500;
    margin-bottom: 2rem;
    backdrop-filter: blur(10px);
    opacity: 0;
    transform: translateY(20px);
    animation: fadeInUp 0.8s ease 0.2s forwards;
}

.hero-title {
    font-size: clamp(3rem, 8vw, 8rem);
    font-weight: 700;
    line-height: 1.1;
    margin-bottom: 1.5rem;
    /*background: linear-gradient(135deg, #fff 0%, rgba(255, 255, 255, 0.8) 50%, rgba(120, 119, 198, 0.8) 100%);*/
    -webkit-background-clip: text;
    /*background-clip: text;*/
    /*-webkit-text-fill-color: transparent;*/
    opacity: 0;
    transform: translateY(30px);
    animation: fadeInUp 0.8s ease 0.4s forwards;
    font-family: var(--font-01);
    color: #000;
}

.hero-subtitle {
    font-size: 1.5rem;
    color: rgb(0 0 0 / 70%);
    max-width: 600px;
    /*margin: 0 auto 3rem;*/
    line-height: 1.6;
    opacity: 0;
    transform: translateY(20px);
    animation: fadeInUp 0.8s ease 0.6s forwards;
    font-family: var(--font-02);
    display: inline;
}

.hero-stats {
    display: flex;
    gap: 3rem;
    justify-content: center;
    flex-wrap: wrap;
    opacity: 0;
    transform: translateY(20px);
    animation: fadeInUp 0.8s ease 0.8s forwards;
}

.stat-item {
    text-align: center;
}

.stat-number {
    font-size: 2.5rem;
    font-weight: 700;
    color: #06b453;
    display: block;
    margin-bottom: 0.5rem;
    font-family: var(--font-01);
}

.stat-label {
    font-size: 0.9rem;
    color: rgb(0 0 0 / 60%);
    text-transform: uppercase;
    letter-spacing: 1px;
    font-family: var(--font-02);
}

/* Project Overview */
.project-overview {
    padding: 8rem 0 0;
    position: relative;
}

.section-header {
    text-align: center;
    margin-bottom: 4rem;
}

.section-title {
    /*font-size: 3rem;
    font-weight: 700;
    margin-bottom: 1rem;*/
    background: linear-gradient(135deg, #fff 0%, rgba(255, 255, 255, 0.7) 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: #06b453;
}

.section-subtitle {
    font-size: 1.2rem;
    color: rgb(255 255 255 / 60%);
    max-width: 600px;
    margin: 0 auto;
    font-family: var(--font-02);
}

.overview-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 4rem;
    align-items: center;
    margin-bottom: 6rem;
}

.overview-content {
    space-y: 2rem;
}

.overview-text {
    font-size: 1.1rem;
    line-height: 1.8;
    color: rgba(255, 255, 255, 0.8);
    margin-bottom: 2rem;
}

.feature-list {
    list-style: none;
    space-y: 1rem;
}

.feature-item {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1rem 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    transition: all 0.3s ease;
}

.feature-item:hover {
    transform: translateX(10px);
    border-bottom-color: rgba(120, 119, 198, 0.3);
}

.feature-icon {
    width: 40px;
    height: 40px;
    background: linear-gradient(135deg, rgba(120, 119, 198, 0.2), rgba(255, 119, 198, 0.2));
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.2rem;
    flex-shrink: 0;
}

.feature-text {
    font-size: 1rem;
    color: rgba(255, 255, 255, 0.8);
    font-family: var(--font-02);
}

/* Website Preview */
.preview-container {
    position: relative;
    max-width: 800px;
}

.device-frame {
    background: linear-gradient(145deg, #1a1a2e, #16213e);
    padding: 2rem;
    border-radius: 30px;
    box-shadow: 
        0 0 0 1px rgba(255, 255, 255, 0.1),
        0 20px 60px rgba(0, 0, 0, 0.3),
        inset 0 1px 0 rgba(255, 255, 255, 0.1);
    position: relative;
    overflow: hidden;
}

.device-frame::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(135deg, rgba(120, 119, 198, 0.1) 0%, transparent 50%, rgba(255, 119, 198, 0.1) 100%);
    border-radius: 30px;
    pointer-events: none;
}

.browser-header {
    background: rgba(255, 255, 255, 0.05);
    border-radius: 15px 15px 0 0;
    padding: 1rem 1.5rem;
    display: flex;
    align-items: center;
    gap: 1rem;
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-bottom: none;
}

.browser-dots {
    display: flex;
    gap: 0.5rem;
}

.dot {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: linear-gradient(135deg, #ff6b5b, #ff8e7b);
}

.dot:nth-child(2) {
    background: linear-gradient(135deg, #feca57, #ff9ff3);
}

.dot:nth-child(3) {
    background: linear-gradient(135deg, #48dbfb, #0abde3);
}

.address-bar {
    flex: 1;
    background: rgba(0, 0, 0, 0.2);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 8px;
    padding: 0.5rem 1rem;
    color: rgba(255, 255, 255, 0.7);
    font-size: 0.9rem;
    font-family: var(--font-02);
}

.website-content {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    min-height: 500px;
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-top: none;
    border-radius: 0 0 15px 15px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    position: relative;
    overflow: hidden;
}

.website-content::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: 
        radial-gradient(circle at 30% 20%, rgba(255, 255, 255, 0.1) 0%, transparent 50%),
        radial-gradient(circle at 70% 80%, rgba(255, 255, 255, 0.05) 0%, transparent 50%);
    animation: float 6s ease-in-out infinite;
}

.website-logo {
    font-size: 3rem;
    font-weight: 700;
    margin-bottom: 1rem;
    z-index: 1;
    display: flex;
    align-items: center;
    gap: 1rem;
}

.website-tagline {
    font-size: 1.3rem;
    opacity: 0.9;
    z-index: 1;
    max-width: 500px;
    line-height: 1.5;
}

/* Tech Stack */
.tech-stack-section {
    /*padding: 6rem 0;*/
    text-align: center;
}

.tech-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
    gap: 2rem;
    max-width: 800px;
    margin: 3rem auto 0;
}

.tech-item {
    background: rgba(255, 255, 255, 0.05);
    backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 20px;
    padding: 2rem 1rem;
    text-align: center;
    transition: all 0.4s cubic-bezier(0.23, 1, 0.320, 1);
    cursor: pointer;
}

.tech-item:hover {
    transform: translateY(-10px) scale(1.05);
    background: rgba(255, 255, 255, 0.1);
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.2);
}

.tech-icon {
    font-size: 2.5rem;
    margin-bottom: 1rem;
    display: block;
    color: #06b453;
}

.tech-name {
    font-weight: 600;
    color: white;
    font-size: 0.9rem;
    font-family: var(--font-01);
}

/* Process Section */
.process-section {
    padding: 6rem 0;
    background: rgb(255 255 255);
    border-radius: 40px;
    margin: 4rem 0;
    position: relative;
}

.process-timeline {
    max-width: 1000px;
    margin: 3rem auto 0;
    position: relative;
}

.timeline-line {
    position: absolute;
    left: 50%;
    top: 0;
    bottom: 0;
    width: 2px;
    background: linear-gradient(180deg, rgb(6 180 83), rgb(49 167 101));
    transform: translateX(-50%);
}

.process-step {
    display: flex;
    align-items: center;
    margin-bottom: 4rem;
    position: relative;
}

.process-step:nth-child(even) {
    flex-direction: row-reverse;
}

.step-content {
    flex: 1;
    background: rgb(0 0 0 / 5%);
    backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 20px;
    padding: 2rem;
    margin: 0 3rem;
    transition: all 0.3s ease;
}

.step-content:hover {
    transform: translateY(-5px);
    background: rgba(255, 255, 255, 0.08);
}

.step-number {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 50px;
    height: 50px;
    background: linear-gradient(135deg, #499f6f, #06b453);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 1.2rem;
    z-index: 1;
    font-family: var(--font-01);
}

.step-title {
    font-size: 1.3rem;
    font-weight: 600;
    margin-bottom: 0.5rem;
    font-family: var(--font-01);
    color: #000;
}

.step-description {
    color: rgb(0 0 0 / 70%);
    line-height: 1.6;
    font-family: var(--font-02);
}

/* Results Section */
.results-section {
    padding: 6rem 0;
    text-align: center;
}

.results-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 2rem;
    margin-top: 3rem;
}

.result-card {
    background: rgba(255, 255, 255, 0.05);
    backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 25px;
    padding: 3rem 2rem;
    text-align: center;
    transition: all 0.4s ease;
    position: relative;
    overflow: hidden;
}

.result-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(135deg, rgba(120, 119, 198, 0.1) 0%, transparent 50%, rgba(255, 119, 198, 0.1) 100%);
    opacity: 0;
    transition: opacity 0.3s ease;
}

.result-card:hover::before {
    opacity: 1;
}

.result-card:hover {
    transform: translateY(-10px);
}

.result-icon {
    font-size: 3rem;
    margin-bottom: 1.5rem;
    display: block;
}

.result-title {
    font-size: 1.5rem;
    font-weight: 600;
    margin-bottom: 1rem;
    font-family: var(--font-01);
}

.result-description {
    color: rgba(255, 255, 255, 0.7);
    line-height: 1.6;
}

/* CTA Section */
.cta-section {
    padding: 6rem 0;
    text-align: center;
}

.cta-buttons {
    display: flex;
    justify-content: center;
    gap: 2rem;
    flex-wrap: wrap;
    margin-top: 3rem;
}

.cta-btn {
    background: linear-gradient(135deg, #499f6f, #06b453);
    color: white;
    padding: 1.2rem 3rem;
    border: none;
    border-radius: 60px;
    font-size: 1.1rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.4s cubic-bezier(0.23, 1, 0.320, 1);
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    position: relative;
    overflow: hidden;
    font-family: var(--font-02);
}

.cta-btn::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.2), transparent);
    transition: left 0.5s ease;
}

.cta-btn:hover::before {
    left: 100%;
}

.cta-btn:hover {
    transform: translateY(-3px);
    box-shadow: 0 15px 40px rgb(6 180 83 / 40%);
}

.cta-btn.secondary {
    background: transparent;
    border: 2px solid rgba(255, 255, 255, 0.3);
}

.cta-btn.secondary:hover {
    background: rgba(255, 255, 255, 0.1);
    box-shadow: 0 15px 40px rgba(255, 255, 255, 0.1);
}
.cib--jquery {
  display: inline-block;
  width: 40px;
  height: 40px;
  background-repeat: no-repeat;
  background-size: 100% 100%;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath fill='%2306b453' d='M2.047 7.833c-2.833 4.068-2.479 9.354-.318 13.672c.052.109.104.208.156.307q.048.103.104.198a1 1 0 0 0 .063.109c.036.073.073.135.109.203l.208.354q.055.1.12.193c.073.125.161.25.234.375l.104.156q.196.304.417.594q.155.211.318.422c.036.047.078.099.115.151l.297.359c.036.042.068.089.109.13c.13.156.271.313.406.464c0 .005.005.005.005.01q.256.322.568.589c.109.109.214.219.328.323l.135.13c.146.141.292.276.448.411c.005 0 .005 0 .01.005l.073.063c.135.12.276.24.417.349l.167.141c.109.089.229.177.344.266l.182.141c.125.094.255.182.38.276c.047.031.094.068.146.094l.036.031l.375.25l.161.104c.193.125.391.245.583.365q.084.04.161.089c.146.083.297.167.443.245c.078.047.161.083.245.125c.099.057.203.109.307.167a.3.3 0 0 1 .078.031l.125.063q.242.118.5.229c.031.016.068.026.104.047c.193.083.38.167.583.245c.042.01.089.036.135.052c.182.068.37.135.552.203l.063.021c.208.073.406.135.615.203c.047.01.099.031.146.042c.214.068.417.141.63.182c13.682 2.495 17.656-8.224 17.656-8.224c-3.339 4.349-9.266 5.495-14.88 4.219c-.208-.047-.411-.115-.625-.177c-.25-.073-.505-.156-.755-.24l-.083-.031q-.265-.095-.531-.198c-.047-.021-.099-.036-.146-.057a18 18 0 0 1-.578-.24c-.042-.016-.073-.036-.115-.052q-.242-.108-.484-.224a2 2 0 0 1-.141-.073c-.125-.057-.25-.125-.375-.188q-.126-.063-.245-.125l-.453-.25a2 2 0 0 0-.151-.089q-.296-.18-.583-.359q-.078-.048-.156-.104a12 12 0 0 1-.417-.276a2 2 0 0 1-.135-.099a7 7 0 0 1-.396-.281c-.057-.047-.115-.089-.177-.135c-.115-.089-.234-.177-.349-.276l-.161-.125q-.225-.18-.443-.375c-.016-.016-.031-.026-.052-.042l-.458-.417l-.135-.125c-.109-.115-.219-.219-.333-.328l-.13-.135a11 11 0 0 1-.411-.432l-.021-.021c-.141-.151-.276-.313-.417-.469c-.036-.042-.068-.089-.104-.13l-.302-.37a17 17 0 0 1-.453-.599C2.88 15.715 1.755 9.85 4.245 5.038zm8.781-3.427c-2.052 2.948-1.938 6.885-.339 10q.4.783.901 1.51c.307.438.646.958 1.057 1.313c.141.161.297.318.458.479l.12.12q.226.22.469.432l.021.021q.264.234.552.453c.042.031.083.068.125.099q.28.212.568.417l.021.016q.125.086.266.172c.036.026.078.057.12.078c.141.094.281.177.422.266c.026.01.042.021.063.031c.12.073.255.141.38.208c.042.026.083.047.13.073q.134.064.26.135l.047.016q.267.132.542.255a14 14 0 0 0 .568.234c.068.021.13.047.193.068c.135.052.281.099.417.146l.182.057c.198.063.396.141.599.172c10.563 1.75 13.005-6.38 13.005-6.38c-2.203 3.167-6.458 4.677-11 3.5c-.203-.052-.401-.115-.599-.177c-.063-.016-.12-.036-.182-.052c-.135-.052-.281-.099-.411-.146l-.193-.073c-.151-.063-.302-.115-.448-.182c-.047-.021-.089-.031-.12-.052a18 18 0 0 1-.557-.255l-.276-.146l-.156-.078a6 6 0 0 1-.354-.198l-.083-.047c-.141-.089-.286-.172-.422-.266a1 1 0 0 1-.13-.083l-.276-.177c-.193-.135-.38-.281-.573-.417a1 1 0 0 0-.125-.104c-1.995-1.573-3.568-3.719-4.318-6.146c-.786-2.526-.609-5.359.745-7.656zm7.386-2.562c-1.208 1.776-1.328 3.984-.495 5.943c.885 2.078 2.698 3.714 4.807 4.484c.089.036.172.063.26.094l.115.036c.125.036.25.083.375.115c5.833 1.125 7.411-3 7.839-3.604c-1.391 1.995-3.719 2.474-6.578 1.781a9 9 0 0 1-1.511-.553a9 9 0 0 1-1.438-.88c-2.563-1.943-4.146-5.641-2.474-8.656z'/%3E%3C/svg%3E");
}
.devicon-plain--codeigniter {
  display: inline-block;
  width: 40px;
  height: 40px;
  background-repeat: no-repeat;
  background-size: 100% 100%;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 128 128'%3E%3Cpath fill='%2306b453' d='m89.708 48.868l-.758-.414c.399.964.529 1.786.515 2.521a8.6 8.6 0 0 0 .248-1.847a8.2 8.2 0 0 1-.273 2.231l.025-.385a8.5 8.5 0 0 1-1.074 2.558l.235-.25c-2.88 4.819-10.737 5.872-14.612.895c-6.22-7.99.128-16.604 1.017-25.065c1.111-10.604-5.538-20.899-13.783-27.06c4.541 7.346-1.442 17.066-6.229 22.498c-4.642 5.269-10.286 9.667-15.41 14.451c-5.503 5.143-10.797 10.555-15.319 16.588c-9.049 12.074-14.59 27.26-10.518 42.325c4.068 15.056 17.108 24.639 31.834 28.027c-7.429-3.212-14.381-11.373-14.397-19.723c-.019-9.106 5.75-16.835 12.927-21.914c-.863 3.259-1.334 6.24.803 9.155c1.988 2.711 5.468 4.027 8.753 3.312c7.679-1.679 8.03-10.12 3.479-15.038c-4.501-4.868-8.855-10.371-7.143-17.433c.858-3.54 3.032-6.854 5.787-9.226c-2.118 5.563 3.897 11.049 7.859 13.779c6.876 4.741 14.416 8.325 20.738 13.881c6.648 5.84 11.559 13.736 10.567 22.896c-1.076 9.927-8.964 16.832-17.811 20.317c18.696-4.128 38.018-18.639 38.411-39.376c.329-17.058-11.373-30.187-25.871-37.703'/%3E%3C/svg%3E");
}
.cib--mysql {
  display: inline-block;
  width: 40px;
  height: 40px;
  background-repeat: no-repeat;
  background-size: 100% 100%;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath fill='%2306b453' d='M21.875 7.568c-.156 0-.26.021-.365.047v.016h.016c.073.135.193.24.286.365c.073.141.135.286.203.427l.021-.021c.125-.089.188-.229.188-.443c-.052-.063-.063-.13-.109-.188c-.052-.089-.167-.135-.24-.203M7.693 25.161H6.459a70 70 0 0 0-.359-5.88h-.01l-1.88 5.88h-.943l-1.865-5.88h-.016a99 99 0 0 0-.26 5.88H.001a75 75 0 0 1 .547-7.375h1.531l1.781 5.417h.01l1.797-5.417h1.458q.486 4.032.573 7.375zm5.354-5.442c-.5 2.729-1.167 4.714-1.984 5.948q-.968 1.43-2.115 1.432q-.303 0-.755-.188v-.656c.151.021.323.036.516.036c.359 0 .646-.104.865-.297q.39-.36.391-.807c0-.208-.099-.625-.307-1.26l-1.349-4.208h1.214l.969 3.146c.219.719.313 1.214.271 1.5c.536-1.417.906-2.969 1.115-4.646zm16.437 5.442h-3.51v-7.375h1.182v6.469h2.328zm-4.427.178l-1.354-.667q.18-.147.339-.333c.578-.672.865-1.677.865-3q0-3.663-2.875-3.661q-1.408-.002-2.198.927c-.573.677-.865 1.677-.865 2.995c0 1.297.255 2.245.766 2.854c.469.542 1.172.818 2.115.818q.525.001.964-.13l1.766 1.031l.484-.833zm-4.39-1.657c-.302-.479-.448-1.25-.448-2.313q-.001-2.787 1.693-2.786c.589 0 1.026.224 1.302.667c.297.484.448 1.245.448 2.297c0 1.87-.568 2.813-1.693 2.813c-.594 0-1.026-.224-1.307-.667zm-2.209-.562c0 .625-.229 1.141-.693 1.536c-.458.401-1.068.604-1.844.604c-.724 0-1.417-.229-2.099-.688l.318-.635c.583.292 1.109.438 1.589.438q.666-.001 1.042-.292c.25-.198.401-.474.401-.823c0-.438-.307-.813-.865-1.125c-.516-.286-1.552-.875-1.552-.875c-.563-.411-.839-.849-.839-1.573q0-.897.625-1.443c.422-.375.958-.557 1.625-.557a3.37 3.37 0 0 1 1.87.547l-.286.635a3.6 3.6 0 0 0-1.417-.307q-.57.002-.875.276c-.305.274-.328.411-.328.698c0 .438.313.813.885 1.135c.526.286 1.583.891 1.583.891c.578.406.865.844.865 1.557zm12.506-7.807c-.714-.016-1.266.057-1.729.255c-.13.052-.344.052-.365.219c.073.073.083.188.146.286c.109.177.292.417.464.542c.188.146.375.292.568.417c.349.214.74.339 1.083.552c.193.125.391.286.583.417c.099.068.161.188.286.229v-.026c-.063-.078-.078-.193-.141-.286c-.089-.089-.177-.167-.266-.255a4.2 4.2 0 0 0-.927-.901c-.286-.193-.911-.464-1.026-.792l-.016-.021c.193-.016.422-.089.609-.141c.302-.078.583-.063.896-.141a7 7 0 0 0 .427-.125v-.078c-.161-.161-.281-.38-.448-.531a12 12 0 0 0-1.469-1.094c-.281-.182-.635-.297-.932-.448c-.104-.052-.286-.078-.344-.167c-.161-.198-.255-.453-.37-.688a24 24 0 0 1-.729-1.552c-.161-.349-.255-.693-.453-1.016c-.917-1.516-1.917-2.432-3.448-3.333c-.328-.188-.724-.266-1.141-.365c-.224-.01-.443-.026-.667-.036c-.146-.063-.286-.229-.411-.313c-.51-.323-1.823-1.016-2.193-.099c-.24.583.354 1.151.563 1.443c.151.208.344.438.453.667c.063.156.078.318.141.479c.141.391.276.828.464 1.193c.099.188.203.385.328.552c.073.099.198.141.224.302c-.125.182-.135.448-.203.667c-.323 1.01-.198 2.255.255 3c.146.224.484.714.938.526c.401-.161.313-.667.427-1.115c.026-.109.01-.177.063-.25v.021c.13.25.255.49.37.74c.271.438.755.891 1.156 1.193c.214.161.38.438.646.536v-.026h-.021c-.057-.078-.13-.115-.203-.177a5 5 0 0 1-.469-.536c-.37-.5-.703-1.052-.995-1.62a11 11 0 0 1-.385-.859c-.052-.104-.052-.266-.141-.318c-.135.193-.333.359-.427.604c-.172.38-.188.854-.255 1.344c-.031.01-.016 0-.031.021c-.286-.073-.385-.365-.49-.615c-.271-.635-.313-1.651-.083-2.38c.063-.188.328-.776.224-.953c-.057-.172-.234-.271-.328-.406c-.12-.167-.24-.38-.323-.568c-.214-.5-.318-1.052-.552-1.552c-.104-.229-.292-.469-.443-.682c-.172-.24-.359-.411-.49-.693c-.047-.099-.109-.26-.036-.365c.016-.073.052-.099.125-.12c.115-.099.448.026.563.083c.328.13.604.255.88.443c.125.089.26.255.422.302h.188c.286.063.604.016.87.099c.474.151.901.37 1.286.609a7.96 7.96 0 0 1 2.776 3.052c.109.203.156.391.255.604c.182.443.417.885.604 1.307s.365.849.635 1.198c.135.188.667.286.911.38c.177.083.453.156.609.25c.307.188.609.401.896.609c.146.099.589.323.615.5z'/%3E%3C/svg%3E");
}
.mingcute--stripe-line {
  display: inline-block;
  width: 40px;
  height: 40px;
  background-repeat: no-repeat;
  background-size: 100% 100%;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cpath d='m12.593 23.258l-.011.002l-.071.035l-.02.004l-.014-.004l-.071-.035q-.016-.005-.024.005l-.004.01l-.017.428l.005.02l.01.013l.104.074l.015.004l.012-.004l.104-.074l.012-.016l.004-.017l-.017-.427q-.004-.016-.017-.018m.265-.113l-.013.002l-.185.093l-.01.01l-.003.011l.018.43l.005.012l.008.007l.201.093q.019.005.029-.008l.004-.014l-.034-.614q-.005-.018-.02-.022m-.715.002a.02.02 0 0 0-.027.006l-.006.014l-.034.614q.001.018.017.024l.015-.002l.201-.093l.01-.008l.004-.011l.017-.43l-.003-.012l-.01-.01z'/%3E%3Cpath fill='%2306b453' d='M6.936 3.715C8.326 2.567 10.24 2 12.404 2c1.746 0 3.49.275 5.259.981a1 1 0 0 1 .629.929v3.64c0 1.244-1.286 1.916-2.291 1.5c-1.198-.494-2.532-.759-3.597-.759q-.324.002-.512.04q-.074.015-.12.03c.089.072.25.17.528.29c.309.134.68.263 1.129.416l.061.02c.42.144.892.305 1.367.495c.99.396 2.094.954 2.95 1.882c.885.957 1.445 2.241 1.45 3.954v.003c0 2.065-.835 3.755-2.305 4.904C15.511 21.454 13.542 22 11.34 22a14.6 14.6 0 0 1-5.777-1.21a1 1 0 0 1-.604-.918V16.18c0-1.241 1.297-1.937 2.322-1.47c1.39.636 2.901 1.038 4.059 1.038c.497 0 .761-.073.87-.134l.017-.01a.4.4 0 0 0 .005-.062v-.005a.3.3 0 0 0-.04-.05c-.084-.086-.25-.205-.56-.353a13 13 0 0 0-1.112-.444l-.22-.08c-.373-.135-.782-.283-1.189-.448c-.973-.395-2.066-.935-2.916-1.81c-.882-.908-1.453-2.127-1.453-3.753c0-2.026.782-3.717 2.194-4.883ZM8.21 5.257c-.918.758-1.467 1.866-1.467 3.34c0 1.104.366 1.824.888 2.361c.555.571 1.334.985 2.233 1.349c.369.15.736.283 1.107.417l.234.085c.437.16.888.329 1.288.519c.713.34 1.74.97 1.74 2.213c0 .375-.083.744-.277 1.077a2 2 0 0 1-.766.74c-.561.314-1.243.39-1.85.39c-1.373 0-2.957-.408-4.38-.998v2.447c1.503.562 3.001.803 4.38.803c1.898 0 3.388-.473 4.381-1.249c.964-.754 1.537-1.852 1.538-3.327c-.005-1.234-.39-2.03-.92-2.602c-.556-.603-1.334-1.026-2.223-1.382c-.426-.17-.855-.316-1.285-.463l-.047-.017a18 18 0 0 1-1.278-.473c-.387-.168-.809-.387-1.142-.703c-.362-.344-.634-.819-.634-1.424c0-.72.328-1.323.936-1.683c.52-.308 1.157-.385 1.739-.385c1.203 0 2.597.259 3.888.728V4.608C15.002 4.177 13.717 4 12.404 4c-1.836 0-3.255.481-4.195 1.257Z'/%3E%3C/g%3E%3C/svg%3E");
}
.simple-icons--googlemaps {
  display: inline-block;
  width: 40px;
  height: 40px;
  background-repeat: no-repeat;
  background-size: 100% 100%;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%2306b453' d='M19.527 4.799c1.212 2.608.937 5.678-.405 8.173c-1.101 2.047-2.744 3.74-4.098 5.614c-.619.858-1.244 1.75-1.669 2.727c-.141.325-.263.658-.383.992c-.121.333-.224.673-.34 1.008c-.109.314-.236.684-.627.687h-.007c-.466-.001-.579-.53-.695-.887c-.284-.874-.581-1.713-1.019-2.525c-.51-.944-1.145-1.817-1.79-2.671zM8.545 7.705l-3.959 4.707c.724 1.54 1.821 2.863 2.871 4.18q.371.465.737.936l4.984-5.925l-.029.01c-1.741.601-3.691-.291-4.392-1.987a3.4 3.4 0 0 1-.209-.716c-.063-.437-.077-.761-.004-1.198zM5.492 3.149l-.003.004c-1.947 2.466-2.281 5.88-1.117 8.77l4.785-5.689l-.058-.05zM14.661.436l-3.838 4.563l.027-.01c1.6-.551 3.403.15 4.22 1.626c.176.319.323.683.377 1.045c.068.446.085.773.012 1.22l-.003.016l3.836-4.561A8.38 8.38 0 0 0 14.67.439zM9.466 5.868L14.162.285l-.047-.012A8.3 8.3 0 0 0 11.986 0a8.44 8.44 0 0 0-6.169 2.766l-.016.018z'/%3E%3C/svg%3E");
}
/* Animations */
@keyframes fadeInUp {
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes backgroundShift {
    0%, 100% { transform: translate(0, 0) rotate(0deg); }
    33% { transform: translate(30px, -50px) rotate(0.5deg); }
    66% { transform: translate(-20px, 20px) rotate(-0.5deg); }
}

@keyframes float {
    0%, 100% { transform: translateY(0px); }
    50% { transform: translateY(-20px); }
}

@keyframes noiseAnim {
    0%, 100% { transform: translate(0, 0); }
    10% { transform: translate(-5%, -5%); }
    20% { transform: translate(-10%, 5%); }
    30% { transform: translate(5%, -10%); }
    40% { transform: translate(-5%, 15%); }
    50% { transform: translate(-10%, 5%); }
    60% { transform: translate(15%, 0%); }
    70% { transform: translate(0%, 15%); }
    80% { transform: translate(-15%, 10%); }
    90% { transform: translate(10%, 5%); }
}

.home-technology {
  background:#1a1a1a
}
.home-technology-tabbing-icon img {
  max-width:80px
}
.home-technology-tabbing-wapper {
  background:#252525;
  display:flex;
  align-items:center;
  justify-content:center;
  flex-direction:column;
  row-gap:10px;
  max-width:190px;
  height:180px;
  width:100%;
  border-radius:5px;
  list-style:none
}
.home-technology-tabbing-first {
    display: flex;
    align-items: end;
    justify-content: center;
    padding: 0;
    column-gap: 20px;
}
.home-technology-tabbing-wapper h3 {
    color: #f7f7f7;
    font-size: 16px;
    font-weight: 700;
    font-family: var(--font-03);
}
.home-technology-tabbing-icon {
  margin:0
}
.home-technology-bottom .nav {
  display:flex;
  align-items:center;
  justify-content:center;
  column-gap:20px;
/*  margin-bottom:-30px!important*/
}
.home-technology-bottom .nav .nav-link {
    background: #252525;
    padding: 5px 20px;
    border-radius: 30px;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 15px;
    line-height: 23px;
    position: relative;
    font-family: var(--font-03);
}
.home-technology-bottom .nav .nav-link.active {
    background: #06b453;
}
.home-technology-bottom .nav .nav-link::after {
    content: "";
    position: absolute;
    bottom: -10px;
    left: 50%;
    transform: translate(-50%);
    background: #06b453;
    clip-path: polygon(51% 100%,0 0,100% 0);
    width: 20px;
    height: 20px;
    opacity: 0;
}
.home-technology-head h2 {
    font-size: 32px;
    font-family: var(--font-02);
}
.home-technology-bottom .nav .nav-link.active::after {
  opacity:1
}
/*.home-technology-tabbing-first.top .home-technology-tabbing-wapper:first-child {
  height:280px
}
.home-technology-tabbing-first.top .home-technology-tabbing-wapper:last-child {
  height:280px
}*/
.technology-img img {
  width:100%;
  height:500px;
  border-radius:20px;
  object-fit:cover
}
.technology-inner {
  background:#F3F6FD;
  padding:60px 60px 90px 60px;
  border-radius:20px
}
.technology-content {
  padding:30px 0;
  border-bottom:1px solid rgb(28 28 28 / 20%);
  margin:0 40px 35px
}
.technology-head {
  padding-bottom:30px
}
.technology-end h3 {
  font-size:24px;
  font-weight:600;
  color:var(--color-3)
}
.technology-bullet-point {
  padding:0;
  display:flex;
  flex-wrap:wrap;
  gap:15px;
  margin:0
}
.technology-bullet-point li {
  width:32%;
  list-style:none;
  display:flex;
  align-items:center;
  column-gap:15px;
  font-size:16px;
  font-weight:500;
  color:#1c1c1c;
  line-height:25px
}
.technology-bullet-point li span {
  color:var(--color-3);
  font-size:18px
}
.technology-end {
  display:flex;
  flex-direction:column;
  row-gap:20px;
  padding:0 30px
}
.home-technology .hr-title {
  color:#f7f7f7;
  display:block;
  margin:0
}
.home-provide-head.home-technology-head p {
  color:#fff;
  text-align:center
}
.home-technology-head {
  display:flex;
  align-items:center;
  flex-direction:column;
  justify-content:center
}
.home-proivde-inner {
    display: flex;
    flex-direction: column;
    row-gap: 50px;
}

/*portfolio-client-review*/
.portfolio-client-review {
    background: #121212;
    padding: 40px;
    border-radius: 20px;
    box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;
    margin-bottom: 100px;
}
.portfolio-client-review-right p {
  color: #fff;
  font-size: 17px;
}
.portfolio-client-review .row {
  align-items: center;
}
.portfolio-client-review-left {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.portfolio-client-review-left figure img {
  border-radius: 50%;
  width: 120px;
  height: 110px;
  height: 120px;
  width: 120px;
}
.portfolio-client-review-content h2 {
  font-size: 16px;
  color: #fff;
  text-align: center;
  font-family: var(--font-02);
  margin: 0;
}
.portfolio-client-review-content h3 {
  color: #7d7d7d;
  font-size: 14px;
  text-align: center;
  font-family: var(--font-01);
}
.portfolio-quote {
  text-align: center;
  display: flex;
  justify-content: center;
  font-size: 42px;
  color: #06b453;
}
.portfolio-client-review-right {
    padding-left: 30px;
}
/*portfolio-client-review*/


@media(max-width:991px) {
  .technology-inner {
    padding:25px
  }
  .technology-img img {
    height:auto
  }
  .technology-content {
    margin:0
  }
  .technology-bullet-point {
    flex-direction:column
  }
  .technology-bullet-point li {
    width:100%
  }
  .portfolio-client-review-right p {
    text-align: center;
}
.portfolio-client-review-right {
    padding-left: 0;
}
.portfolio-site-inner img {
    width: 100%;
    height: auto;
}
}
@media(max-width:767px) {
  .home-provide-head .hr-title {
    text-align:center
  }
  .home-proivde-inner {
    row-gap:30px
  }
  .home-technology-tabbing-first.top .home-technology-tabbing-wapper:first-child {
    height:170px
  }
  .home-technology-tabbing-first.top .home-technology-tabbing-wapper:last-child {
    height:170px
  }
  .home-technology-tabbing-first {
    column-gap:10px
  }
  .home-technology-tabbing-wapper {
    max-width:90px;
    height:100px;
    padding:20px 5px
  }
  .home-technology-tabbing-icon img {
    max-width:50px
  }
  .home-technology-tabbing-wapper h3 {
    font-size:14px
  }
  .home-technology-bottom .nav {
    column-gap:10px
  }
  .home-technology-bottom .nav .nav-link {
    padding:3px 10px;
    font-size:14px
  }
  .technology-inner {
    padding:15px
  }
  .technology-img img {
    height:auto
  }
  .technology-content {
    margin:0
  }
  .technology-bullet-point {
    flex-direction:column
  }
  .technology-bullet-point li {
    width:100%
  }
}
@media(max-width:576px) {
  .home-technology-bottom .nav .nav-link::after {
    bottom:-14px
  }
  .home-technology-bottom .nav .nav-link {
    padding:3px 10px;
    font-size:14px
  }
  .home-technology-bottom .nav .nav-link {
    padding:3px 10px;
    font-size:11px
  }
  .portfolio-client-review {
    padding: 40px 20px;
}
}




/* Responsive */
@media (max-width: 768px) {
    .nav {
        position: static;
        flex-direction: column;
        gap: 1rem;
        margin-bottom: 2rem;
    }

    .nav-menu {
        display: none;
    }

    .hero-title {
        font-size: 3rem;
    }

    .overview-grid {
        grid-template-columns: 1fr;
        gap: 2rem;
    }

    .hero-stats {
        gap: 1rem;
        flex-direction: column;
    }

    .process-step,
    .process-step:nth-child(even) {
        flex-direction: column;
    }

    .step-content {
        margin: 2rem 0;
    }

    .timeline-line {
        display: none;
    }

    .cta-buttons {
        flex-direction: column;
        align-items: center;
    }
}
/*
.portfolio-head img {
  width: 100%;
  max-width: 980px;
}
.hr-port-swiper figure {
  text-align: center;
}
.portfolio-bottom-right img {
  width: 100%;
}

.portfolio-detail-right-bottom {
  display: flex;
  padding: 0;
  margin: 0;
  column-gap: 20px;
  padding-top: 20px;
  margin-bottom: 20px;
}
.portfolio-detail-right-bottom li a {
  color: #fff;
  padding: 10px 24px;
  text-transform: uppercase;
  transition: all .3s ease-in-out 0s;
  border-radius: 3px;
  background: #06b453;
}
.portfolio-detail-right-bottom li {
  list-style: none;
}
.back-btn {
  background: #000 !important;
}
.portfolio-head-content {
  padding: 0;
  margin: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.portfolio-head-wapper {
  display: flex;
  align-items: center;
  column-gap: 10px;
}
.portfolio-head-content li {
  list-style: none;
}
.portfolio-head-wapper p {
  margin: 0;
}
.portfolio-head-wapper h3 {
  font-size: 30px;
  line-height: 1.4em;
  font-family: var(--font-01);
  font-weight: 700;
}
.portfolio-head {
  display: flex;
  flex-direction: column;
  row-gap: 40px;
}
.portfolio-head figure {
  margin: 0;
}
.portfolio-inner {
  display: flex;
  flex-direction: column;
  row-gap: 80px;
}
.portfolio-detail {
  background: #f6f5ef;
}
.portfolio-bottom-wapper-inner h4 {
  font-size: 30px;
  line-height: 1.4em;
  font-family: var(--font-01);
  font-weight: 700;
}
.portfolio-bottom-left-wapper {
  display: flex;
  flex-direction: column;
  row-gap: 10px;
}
.portfolio-bottom-left {
	display: flex;
	flex-direction: column;
	row-gap: 20px;
	padding-right: 50px;
}

@media(max-width:1200px){
	.portfolio-head-wapper h3 {
	font-size: 24px;
}
.portfolio-head-wapper p {
	margin: 0;
	font-size: 18px;
}
.portfolio-bottom-wapper-inner h4 {
	font-size: 24px;
}
}

@media(max-width:991px){
	.portfolio-head-content {
	flex-wrap: wrap;
}
.portfolio-bottom .row {
	row-gap: 20px;
	flex-direction: column-reverse;
}
}

@media(max-width:575px){
	.portfolio-head-wapper h3 {
	font-size: 20px;
}
.portfolio-head-wapper p {
	font-size: 16px;
}
.portfolio-head-content {
	column-gap: 10px;
}
.portfolio-bottom-wapper-inner h4 {
	font-size: 20px;
}
.portfolio-bottom-left {
	padding-right: 0;
}
}*/

@media(max-width:480px){
    .home-technology-tabbing-wapper h3 {
    font-size: 12px;
    text-align: center;
}

    .home-technology-tabbing-icon img {
    max-width: 30px;
}
}