:root {
    --primary-color: #073b4c;
    --primary-light: #e6ebee;
    --primary-dark: #052633;
    --secondary-color: #118ab2;
    --secondary-light: #e8f4f8;
    --tertiary-color: #ffd60a;
    --tertiary-light: #fff8dc;
    --accent-color: #f77f00;
    --accent-light: #fef0e6;
    --neutral-color: #6c757d;
    --neutral-light: #f8f9fa;
    --info-color: #17a2b8;
    --warning-color: #dc3545;
    --success-color: #28a745
}

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
    line-height: 1.6;
    color: var(--primary-dark);
    background-color: #ffffff;
    overflow-x: hidden
}

.mainHeader {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    background: rgba(255, 255, 255, 0.95);
    backdrop-filter: blur(12px);
    z-index: 1000;
    border-bottom: 1px solid var(--neutral-light);
    transition: all 0.3s ease
}

.navigationContainer {
    display: flex;
    justify-content: space-between;
    align-items: center;
    max-width: 1400px;
    margin: 0 auto;
    padding: 18px 24px;
}

.brandLogo {
    display: flex;
    align-items: center;
    gap: 12px
}

.logoImage {
    width: 42px;
    height: 42px;
    border-radius: 50%;
    object-fit: cover;
}

.brandText {
    font-family: 'Montserrat', sans-serif;
    font-weight: 600;
    font-size: 20px;
    color: var(--primary-color);
    letter-spacing: -0.5px
}

.navMenu {
    display: flex;
}

.nav-list {
    display: flex;
    list-style: none;
    gap: 32px;
    align-items: center;
}

.navLink, .nav_link {
    text-decoration: none;
    color: var(--primary-dark);
    font-weight: 500;
    font-size: 15px;
    transition: color 0.2s ease;
    position: relative;
}

.navLink:hover, .nav_link:hover {
    color: var(--accent-color);
}

.navLink.active::after {
    content: '';
    position: absolute;
    bottom: -6px;
    left: 0;
    width: 100%;
    height: 2px;
    background: var(--accent-color);
    border-radius: 9999px
}

.menuToggle {
    display: none;
    flex-direction: column;
    cursor: pointer;
    gap: 4px;
}

.menuToggle span {
    width: 24px;
    height: 3px;
    background: var(--primary-color);
    transition: 0.3s;
    border-radius: 9999px;
}

.heroSection {
    min-height: 100vh;
    display: flex;
    align-items: center;
    background: linear-gradient(135deg, var(--primary-light) 0%, #ffffff 100%);
    padding-top: 80px;
    position: relative;
    overflow: hidden
}

.heroSection::before {
    content: '';
    position: absolute;
    top: 0;
    right: -20%;
    width: 40%;
    height: 100%;
    background: radial-gradient(ellipse at center, rgba(7, 59, 76, 0.08) 0%, transparent 70%);
    transform: rotate(-12deg);
}

.heroContainer {
    max-width: 1400px;
    margin: 0 auto;
    padding: 48px 24px;
    width: 100%;
}

.heroContent {
    display: grid;
    grid-template-columns: 1.2fr 1fr;
    gap: 64px;
    align-items: center;
}

.heroText {
    max-width: 580px
}

.heroTitle {
    font-family: 'Montserrat', serif;
    font-size: clamp(38px, 5vw, 56px);
    font-weight: 700;
    line-height: 1.1;
    margin-bottom: 28px;
    color: var(--primary-dark);
    letter-spacing: -1.2px;
}

.highlight {
    color: var(--accent-color);
    position: relative;
}

.highlight::after {
    content: '';
    position: absolute;
    bottom: 4px;
    left: 0;
    width: 100%;
    height: 3px;
    background: var(--tertiary-color);
    transform: skew(-12deg);
    opacity: 0.6
}

.heroDescription {
    font-size: 19px;
    color: var(--neutral-color);
    margin-bottom: 36px;
    line-height: 1.7;
    font-weight: 400;
}

.heroButtons {
    display: flex;
    gap: 20px;
    flex-wrap: wrap;
}

.primaryButton {
    background: var(--accent-color);
    color: white;
    padding: 16px 32px;
    text-decoration: none;
    border-radius: 9999px;
    font-weight: 600;
    font-size: 16px;
    transition: all 0.25s ease;
    box-shadow: 0 4px 16px rgba(247, 127, 0, 0.25);
    border: none;
    cursor: pointer;
}

.primaryButton:hover {
    background: #e66d00;
    transform: translateY(-2px);
    box-shadow: 0 8px 24px rgba(247, 127, 0, 0.35)
}

.secondaryBtn {
    background: transparent;
    color: var(--primary-dark);
    padding: 16px 32px;
    text-decoration: none;
    border-radius: 9999px;
    font-weight: 600;
    font-size: 16px;
    border: 2px solid var(--neutral-color);
    transition: all 0.2s ease;
}

.secondaryBtn:hover {
    background: var(--primary-dark);
    color: white;
    border-color: var(--primary-dark);
}

.heroVisual {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
}

.visualElements {
    position: relative;
    width: 100%;
    max-width: 480px;
}

.chartContainer {
    position: relative;
    border-radius: 24px;
    overflow: hidden;
    box-shadow: 0 20px 60px rgba(7, 59, 76, 0.15);
    transform: rotate(2deg);
}

.dashboardImage {
    width: 100%;
    height: auto;
    display: block;
}

.floatingStats {
    position: absolute;
    top: -24px;
    right: -32px;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.stat_card, .statCard {
    background: white;
    padding: 20px 24px;
    border-radius: 20px;
    box-shadow: 0 12px 32px rgba(0, 0, 0, 0.08);
    text-align: center;
    min-width: 140px;
    border: 1px solid var(--primary-light);
    transform: rotate(-3deg)
}

.statCard {
    transform: rotate(1deg);
}

.statNumber {
    display: block;
    font-family: 'Montserrat', sans-serif;
    font-size: 24px;
    font-weight: 700;
    color: var(--accent-color);
    margin-bottom: 4px
}

.statLabel, .stat-label {
    font-size: 13px;
    color: var(--neutral-color);
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

@media (max-width: 1024px) {
    .heroContent {
        grid-template-columns: 1fr;
        gap: 48px;
        text-align: center;
    }
    
    .heroText {
        max-width: 100%;
    }
    
    .floatingStats {
        position: static;
        flex-direction: row;
        justify-content: center;
        margin-top: 24px;
    }
}

@media (max-width: 768px) {
    .navMenu {
        display: none;
    }
    
    .menuToggle {
        display: flex;
    }
    
    .navigationContainer {
        padding: 16px 20px
    }
    
    .heroSection {
        padding-top: 72px;
    }
    
    .heroContainer {
        padding: 32px 20px;
    }
    
    .heroButtons {
        justify-content: center;
    }
    
    .primaryButton, .secondaryBtn {
        padding: 14px 28px;
        font-size: 15px;
    }
}






















.servicesSection {
    padding: 120px 0;
    background: #ffffff;
    position: relative;
}

.servicesSection::before {
    content: '';
    position: absolute;
    top: 0;
    left: -10%;
    width: 30%;
    height: 60%;
    background: radial-gradient(ellipse at center, rgba(17, 138, 178, 0.04) 0%, transparent 70%);
    transform: rotate(8deg);
}

.servicesContainer {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 24px;
}

.sectionHeader {
    text-align: center;
    max-width: 720px;
    margin: 0 auto 80px auto
}

.sectionTag {
    display: inline-block;
    background: var(--accent-light);
    color: var(--accent-color);
    padding: 8px 20px;
    border-radius: 9999px;
    font-size: 14px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 1px;
    margin-bottom: 20px;
}

.sectionTitle {
    font-family: 'Montserrat', serif;
    font-size: clamp(32px, 4vw, 48px);
    font-weight: 700;
    line-height: 1.2;
    color: var(--primary-dark);
    margin-bottom: 24px;
    letter-spacing: -0.8px
}

.titleAccent {
    color: var(--accent-color);
    position: relative;
}

.titleAccent::after {
    content: '';
    position: absolute;
    bottom: 2px;
    left: 0;
    width: 100%;
    height: 2px;
    background: var(--tertiary-color);
    transform: skew(-8deg);
    opacity: 0.7;
}

.sectionDescription {
    font-size: 18px;
    color: var(--neutral-color);
    line-height: 1.6;
    font-weight: 400;
}

.servicesGrid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(380px, 1fr));
    gap: 32px;
    margin-bottom: 80px;
}

.serviceCard, .service-card {
    background: white;
    padding: 36px 28px;
    border-radius: 24px;
    border: 1px solid var(--primary-light);
    transition: all 0.25s ease;
    position: relative;
    overflow: hidden
}

.serviceCard::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 4px;
    background: linear-gradient(90deg, var(--accent-color) 0%, var(--tertiary-color) 100%);
    transform: translateX(-100%);
    transition: transform 0.4s ease;
}

.serviceCard:hover::before, .service-card:hover::before {
    transform: translateX(0);
}

.serviceCard:hover, .service-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 24px 48px rgba(7, 59, 76, 0.12);
    border-color: var(--accent-color);
}

.serviceIcon {
    margin-bottom: 24px;
}

.iconWrapper, .icon_wrapper {
    width: 64px;
    height: 64px;
    border-radius: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 20px;
    transition: all 0.3s ease;
}

.financial {
    background: linear-gradient(135deg, #e8f5e8 0%, #d4edda 100%);
    color: var(--success-color)
}

.marketing {
    background: linear-gradient(135deg, var(--secondary-light) 0%, #cce7f0 100%);
    color: var(--secondary-color);
}

.operational {
    background: linear-gradient(135deg, var(--tertiary-light) 0%, #fff3cd 100%);
    color: #b8860b;
}

.sales {
    background: linear-gradient(135deg, var(--accent-light) 0%, #fde2cc 100%);
    color: var(--accent-color);
}

.predictive {
    background: linear-gradient(135deg, #f3e5f5 0%, #e1bee7 100%);
    color: #7b1fa2
}

.dashboards {
    background: linear-gradient(135deg, #e3f2fd 0%, #bbdefb 100%);
    color: var(--info-color);
}

.benchmarking {
    background: linear-gradient(135deg, #fce4ec 0%, #f8bbd9 100%);
    color: #c2185b;
}

.serviceTitle, .service_title {
    font-family: 'Montserrat', sans-serif;
    font-size: 20px;
    font-weight: 600;
    color: var(--primary-dark);
    margin-bottom: 16px;
    line-height: 1.3;
}

.serviceDesc, .service_desc {
    color: var(--neutral-color);
    font-size: 15px;
    line-height: 1.6;
    font-weight: 400
}

.ctaSection {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-dark) 100%);
    border-radius: 32px;
    padding: 48px 40px;
    text-align: center;
    position: relative;
    overflow: hidden;
}

.ctaSection::before {
    content: '';
    position: absolute;
    top: -50%;
    right: -20%;
    width: 40%;
    height: 200%;
    background: radial-gradient(ellipse at center, rgba(255, 255, 255, 0.08) 0%, transparent 60%);
    transform: rotate(-15deg)
}

.ctaContent {
    position: relative;
    z-index: 2;
    max-width: 600px;
    margin: 0 auto;
}

.ctaTitle {
    font-family: 'Montserrat', serif;
    font-size: 28px;
    font-weight: 600;
    color: white;
    margin-bottom: 16px;
    letter-spacing: -0.5px;
}

.ctaText {
    color: var(--primary-light);
    font-size: 16px;
    line-height: 1.5;
    margin-bottom: 32px;
    opacity: 0.9;
}

.ctaButton {
    background: var(--accent-color);
    color: white;
    padding: 16px 40px;
    text-decoration: none;
    border-radius: 9999px;
    font-weight: 600;
    font-size: 16px;
    display: inline-block;
    transition: all 0.25s ease;
    box-shadow: 0 6px 20px rgba(247, 127, 0, 0.3);
}

.ctaButton:hover {
    background: #e66d00;
    transform: translateY(-3px);
    box-shadow: 0 12px 32px rgba(247, 127, 0, 0.4)
}

@media (max-width: 1024px) {
    .servicesGrid {
        grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
        gap: 24px;
    }
    
    .serviceCard, .service-card {
        padding: 28px 24px;
    }
}

@media (max-width: 768px) {
    .servicesSection {
        padding: 80px 0;
    }
    
    .servicesContainer {
        padding: 0 20px;
    }
    
    .sectionHeader {
        margin-bottom: 60px;
    }
    
    .servicesGrid {
        grid-template-columns: 1fr;
        gap: 20px;
        margin-bottom: 60px;
    }
    
    .ctaSection {
        padding: 36px 24px;
        border-radius: 24px;
    }
    
    .ctaTitle {
        font-size: 24px;
    }
    
    .ctaText {
        font-size: 15px;
    }
}



















.processSection {
    padding: 120px 0;
    background: linear-gradient(180deg, #ffffff 0%, var(--primary-light) 100%);
    position: relative;
    overflow: hidden;
}

.processSection::before {
    content: '';
    position: absolute;
    top: 20%;
    right: -15%;
    width: 35%;
    height: 40%;
    background: radial-gradient(ellipse at center, rgba(247, 127, 0, 0.06) 0%, transparent 70%);
    transform: rotate(-25deg)
}

.processContainer {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 24px;
}

.processHeader {
    text-align: center;
    max-width: 800px;
    margin: 0 auto 100px auto;
}

.processTag {
    display: inline-block;
    background: var(--secondary-light);
    color: var(--secondary-color);
    padding: 10px 24px;
    border-radius: 9999px;
    font-size: 14px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 1.2px;
    margin-bottom: 24px;
}

.processTitle {
    font-family: 'Montserrat', serif;
    font-size: clamp(36px, 4.5vw, 52px);
    font-weight: 700;
    line-height: 1.15;
    color: var(--primary-dark);
    margin-bottom: 28px;
    letter-spacing: -1px
}

.process_accent {
    color: var(--secondary-color);
    position: relative;
}

.process_accent::after {
    content: '';
    position: absolute;
    bottom: 3px;
    left: 0;
    width: 100%;
    height: 3px;
    background: var(--tertiary-color);
    transform: skew(-10deg);
    opacity: 0.8;
}

.processDescription {
    font-size: 18px;
    color: var(--neutral-color);
    line-height: 1.7;
    font-weight: 400;
}

.processFlow {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(360px, 1fr));
    gap: 40px;
    margin-bottom: 100px;
    position: relative
}

.processFlow::before {
    content: '';
    position: absolute;
    top: 0;
    left: 50%;
    width: 2px;
    height: 100%;
    background: linear-gradient(180deg, var(--accent-color) 0%, var(--secondary-color) 50%, var(--tertiary-color) 100%);
    transform: translateX(-50%);
    opacity: 0.3;
    z-index: 1;
}

.process_step, .processStep {
    background: white;
    padding: 40px 32px;
    border-radius: 28px;
    box-shadow: 0 8px 32px rgba(7, 59, 76, 0.08);
    border: 1px solid var(--primary-light);
    position: relative;
    transition: all 0.3s ease;
    z-index: 2;
}

.process_step:hover, .processStep:hover {
    transform: translateY(-12px);
    box-shadow: 0 24px 64px rgba(7, 59, 76, 0.15);
    border-color: var(--secondary-color);
}

.stepNumber {
    position: absolute;
    top: -16px;
    left: 32px;
    background: linear-gradient(135deg, var(--accent-color) 0%, #e66d00 100%);
    color: white;
    width: 48px;
    height: 48px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: 'Montserrat', sans-serif;
    font-weight: 700;
    font-size: 16px;
    box-shadow: 0 4px 16px rgba(247, 127, 0, 0.3)
}

.stepContent {
    padding-top: 20px;
}

.stepTitle {
    font-family: 'Montserrat', sans-serif;
    font-size: 22px;
    font-weight: 600;
    color: var(--primary-dark);
    margin-bottom: 16px;
    line-height: 1.3;
}

.stepDesc {
    color: var(--neutral-color);
    font-size: 15px;
    line-height: 1.6;
    margin-bottom: 24px;
    font-weight: 400;
}

.stepFeatures {
    display: flex;
    flex-direction: column;
    gap: 8px
}

.feature {
    display: inline-flex;
    align-items: center;
    font-size: 13px;
    color: var(--secondary-color);
    font-weight: 500;
    position: relative;
    padding-left: 20px;
}

.feature::before {
    content: '✓';
    position: absolute;
    left: 0;
    color: var(--success-color);
    font-weight: bold;
}

.processGallery {
    margin-bottom: 80px;
}

.galleryGrid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 32px;
    max-width: 1000px;
    margin: 0 auto;
}

.gallery_item, .galleryItem {
    position: relative;
    border-radius: 24px;
    overflow: hidden;
    aspect-ratio: 16/10;
    box-shadow: 0 16px 48px rgba(7, 59, 76, 0.12);
    transition: all 0.3s ease;
}

.gallery_item:hover, .galleryItem:hover {
    transform: scale(1.05);
    box-shadow: 0 24px 64px rgba(7, 59, 76, 0.2);
}

.galleryImage {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.4s ease;
}

.gallery_item:hover .galleryImage, .galleryItem:hover .galleryImage {
    transform: scale(1.1);
}

.imageOverlay {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    background: linear-gradient(transparent, rgba(0, 0, 0, 0.8));
    padding: 32px 24px 24px;
    color: white;
    transform: translateY(100%);
    transition: transform 0.3s ease;
}

.gallery_item:hover .imageOverlay, .galleryItem:hover .imageOverlay {
    transform: translateY(0);
}

.overlayTitle {
    font-family: 'Montserrat', sans-serif;
    font-size: 18px;
    font-weight: 600;
    margin-bottom: 8px
}

.overlayText {
    font-size: 14px;
    line-height: 1.4;
    opacity: 0.9;
}

.transparencyBox {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--secondary-color) 100%);
    border-radius: 32px;
    padding: 60px 48px;
    position: relative;
    overflow: hidden;
}

.transparencyBox::before {
    content: '';
    position: absolute;
    top: -30%;
    left: -20%;
    width: 60%;
    height: 160%;
    background: radial-gradient(ellipse at center, rgba(255, 255, 255, 0.1) 0%, transparent 60%);
    transform: rotate(-20deg);
}

.transparencyContent {
    position: relative;
    z-index: 2;
    text-align: center;
    max-width: 800px;
    margin: 0 auto;
}

.transparencyTitle {
    font-family: 'Montserrat', serif;
    font-size: 32px;
    font-weight: 700;
    color: white;
    margin-bottom: 20px;
    letter-spacing: -0.5px;
}

.transparencyText {
    color: var(--primary-light);
    font-size: 17px;
    line-height: 1.6;
    margin-bottom: 40px;
    opacity: 0.95;
}

.transparencyFeatures {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 32px;
}

.transparencyFeature {
    text-align: center;
    color: white
}

.transparencyFeature strong {
    display: block;
    font-family: 'Montserrat', sans-serif;
    font-size: 18px;
    font-weight: 600;
    margin-bottom: 8px;
}

.transparencyFeature span {
    font-size: 14px;
    opacity: 0.9;
    line-height: 1.4;
}

@media (max-width: 1024px) {
    .processFlow {
        grid-template-columns: 1fr;
        gap: 32px;
        margin-bottom: 80px;
    }
    
    .processFlow::before {
        display: none;
    }
    
    .galleryGrid {
        grid-template-columns: 1fr;
        gap: 24px;
    }
}

@media (max-width: 768px) {
    .processSection {
        padding: 80px 0;
    }
    
    .processContainer {
        padding: 0 20px;
    }
    
    .processHeader {
        margin-bottom: 60px;
    }
    
    .process_step, .processStep {
        padding: 32px 24px;
    }
    
    .transparencyBox {
        padding: 40px 24px;
        border-radius: 24px;
    }
    
    .transparencyFeatures {
        grid-template-columns: 1fr;
        gap: 24px;
    }
}

















.advantagesSection {
    padding: 120px 0;
    background: #ffffff;
    position: relative;
}

.advantagesSection::before {
    content: '';
    position: absolute;
    top: 0;
    left: -5%;
    width: 25%;
    height: 50%;
    background: radial-gradient(ellipse at center, rgba(17, 138, 178, 0.05) 0%, transparent 70%);
    transform: rotate(-25deg);
}

.advantagesContainer {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 24px;
}

.advantagesLayout {
    display: grid;
    grid-template-columns: 2fr 1fr;
    gap: 60px;
    align-items: start;
    margin-top: 80px;
}

.advantagesGrid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 32px;
}

.advantageCard, .advantage-card {
    background: white;
    padding: 32px 28px;
    border-radius: 28px;
    border: 2px solid var(--primary-light);
    transition: all 0.3s ease;
    position: relative;
    overflow: hidden
}

.advantageCard::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 3px;
    background: linear-gradient(90deg, var(--accent-color) 0%, var(--secondary-color) 100%);
    transform: translateX(-100%);
    transition: transform 0.5s ease;
}

.advantageCard:hover::before, .advantage-card:hover::before {
    transform: translateX(0);
}

.advantageCard:hover, .advantage-card:hover {
    transform: translateY(-6px);
    border-color: var(--accent-color);
    box-shadow: 0 20px 40px rgba(7, 59, 76, 0.1);
}

.advantageIcon, .advantage_icon {
    width: 64px;
    height: 64px;
    background: linear-gradient(135deg, var(--accent-color) 0%, #ff8c42 100%);
    border-radius: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    margin-bottom: 24px;
    transition: all 0.3s ease
}

.advantageCard:hover .advantageIcon,
.advantage-card:hover .advantageIcon,
.advantageCard:hover .advantage_icon {
    transform: scale(1.1) rotate(5deg);
    box-shadow: 0 8px 20px rgba(247, 127, 0, 0.3);
}

.advantageTitle, .advantage_title {
    font-family: 'Montserrat', sans-serif;
    font-size: 20px;
    font-weight: 600;
    color: var(--primary-dark);
    margin-bottom: 16px;
    line-height: 1.3;
}

.advantageDesc {
    color: var(--neutral-color);
    font-size: 15px;
    line-height: 1.6;
    margin-bottom: 20px;
    font-weight: 400;
}

.expertiseList {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.expertiseTag {
    background: var(--secondary-light);
    color: var(--secondary-color);
    padding: 6px 12px;
    border-radius: 9999px;
    font-size: 12px;
    font-weight: 500;
}

.dataMetrics, .implementationStats {
    margin-top: 16px;
}

.metric, .stat {
    text-align: center;
    padding: 16px;
    background: var(--neutral-light);
    border-radius: 16px;
}

.metricNumber, .statValue {
    display: block;
    font-family: 'Montserrat', sans-serif;
    font-size: 24px;
    font-weight: 700;
    color: var(--accent-color);
    margin-bottom: 4px
}

.metricLabel, .stat_label {
    font-size: 12px;
    color: var(--neutral-color);
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.toolsGrid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 8px;
    margin-top: 16px;
}

.toolItem, .tool_item {
    background: var(--primary-light);
    color: var(--primary-dark);
    padding: 8px 12px;
    border-radius: 12px;
    text-align: center;
}

.toolName {
    font-size: 13px;
    font-weight: 500;
}

.certificationsList {
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin-top: 16px;
}

.certBadge {
    background: linear-gradient(135deg, var(--success-color) 0%, #20c997 100%);
    color: white;
    padding: 6px 12px;
    border-radius: 9999px;
    font-size: 11px;
    font-weight: 500;
    text-align: center;
}

.transparencyFeatures {
    margin-top: 16px;
}

.feature {
    color: var(--success-color);
    font-size: 14px;
    font-weight: 500;
    margin-bottom: 6px;
}

.teamImage {
    position: sticky;
    top: 120px;
}

.imageWrapper {
    position: relative;
    border-radius: 28px;
    overflow: hidden;
    box-shadow: 0 20px 60px rgba(7, 59, 76, 0.15);
    transition: all 0.3s ease;
}

.imageWrapper:hover {
    transform: translateY(-8px);
    box-shadow: 0 28px 80px rgba(7, 59, 76, 0.2);
}

.teamPhoto {
    width: 100%;
    height: 480px;
    object-fit: cover;
    transition: transform 0.4s ease;
}

.imageWrapper:hover .teamPhoto {
    transform: scale(1.05);
}

.imageOverlay {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    background: linear-gradient(transparent, rgba(7, 59, 76, 0.9));
    color: white;
    padding: 40px 24px 24px 24px;
}

.overlayTitle {
    font-family: 'Montserrat', serif;
    font-size: 20px;
    font-weight: 600;
    margin-bottom: 8px;
    letter-spacing: -0.3px;
}

.overlayText {
    font-size: 14px;
    opacity: 0.9;
    margin: 0;
}

.resultsPromise {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-dark) 100%);
    border-radius: 32px;
    padding: 40px;
    margin-top: 80px;
    position: relative;
    overflow: hidden;
}

.resultsPromise::before {
    content: '';
    position: absolute;
    top: -30%;
    right: -20%;
    width: 40%;
    height: 160%;
    background: radial-gradient(ellipse at center, rgba(255, 255, 255, 0.08) 0%, transparent 60%);
    transform: rotate(-20deg)
}

.promiseContent {
    display: flex;
    align-items: center;
    gap: 24px;
    position: relative;
    z-index: 2;
}

.promiseIcon {
    width: 80px;
    height: 80px;
    background: rgba(255, 255, 255, 0.15);
    border-radius: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    flex-shrink: 0;
}

.promiseText {
    flex: 1;
}

.promiseTitle {
    font-family: 'Montserrat', serif;
    font-size: 28px;
    font-weight: 600;
    color: white;
    margin-bottom: 12px;
    letter-spacing: -0.5px;
}

.promiseDesc {
    color: var(--primary-light);
    font-size: 16px;
    line-height: 1.5;
    margin: 0;
    opacity: 0.95;
}

@media (max-width: 1024px) {
    .advantagesLayout {
        grid-template-columns: 1fr;
        gap: 40px;
    }
    
    .advantagesGrid {
        grid-template-columns: 1fr;
        gap: 24px;
    }
    
    .teamImage {
        position: static;
    }
    
    .teamPhoto {
        height: 320px;
    }
}

@media (max-width: 768px) {
    .advantagesSection {
        padding: 80px 0;
    }
    
    .advantagesContainer {
        padding: 0 20px;
    }
    
    .advantagesLayout {
        margin-top: 60px;
    }
    
    .advantageCard, .advantage-card {
        padding: 24px 20px;
    }
    
    .toolsGrid {
        grid-template-columns: 1fr;
    }
    
    .promiseContent {
        flex-direction: column;
        text-align: center;
        gap: 20px;
    }
    
    .resultsPromise {
        padding: 32px 24px;
        margin-top: 60px;
        border-radius: 24px;
    }
    
    .promiseTitle {
        font-size: 24px;
    }
}



















.pricingSection {
    padding: 120px 0;
    background: linear-gradient(135deg, var(--neutral-light) 0%, #ffffff 100%);
    position: relative;
}

.pricingSection::before {
    content: '';
    position: absolute;
    top: 10%;
    right: -10%;
    width: 30%;
    height: 60%;
    background: radial-gradient(ellipse at center, rgba(247, 127, 0, 0.04) 0%, transparent 70%);
    transform: rotate(15deg);
}

.pricingContainer {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 24px;
}

.pricingLayout {
    display: grid;
    grid-template-columns: 2fr 1fr;
    gap: 60px;
    margin-top: 80px;
    align-items: start;
}

.pricingCards {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
}

.pricingCard, .pricing-card {
    background: white;
    border-radius: 32px;
    padding: 36px 28px;
    border: 2px solid var(--primary-light);
    transition: all 0.3s ease;
    position: relative;
    overflow: hidden
}

.pricingCard:hover, .pricing-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 24px 48px rgba(7, 59, 76, 0.12);
    border-color: var(--accent-color);
}

.popular {
    border-color: var(--accent-color);
    transform: scale(1.05);
    box-shadow: 0 16px 40px rgba(247, 127, 0, 0.15);
}

.popular:hover {
    transform: scale(1.05) translateY(-8px);
}

.popularBadge {
    position: absolute;
    top: -12px;
    left: 50%;
    transform: translateX(-50%);
    background: var(--accent-color);
    color: white;
    padding: 8px 24px;
    border-radius: 9999px;
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    box-shadow: 0 4px 12px rgba(247, 127, 0, 0.3)
}

.cardHeader {
    text-align: center;
    margin-bottom: 32px;
}

.planIcon {
    width: 64px;
    height: 64px;
    background: linear-gradient(135deg, var(--secondary-light) 0%, var(--primary-light) 100%);
    color: var(--secondary-color);
    border-radius: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 20px auto;
    transition: all 0.3s ease;
}

.popular .planIcon {
    background: linear-gradient(135deg, var(--accent-color) 0%, #ff8c42 100%);
    color: white;
}

.pricingCard:hover .planIcon, .pricing-card:hover .planIcon {
    transform: scale(1.1) rotate(5deg);
}

.planName {
    font-family: 'Montserrat', sans-serif;
    font-size: 22px;
    font-weight: 600;
    color: var(--primary-dark);
    margin-bottom: 8px;
    letter-spacing: -0.3px;
}

.planDesc {
    color: var(--neutral-color);
    font-size: 14px;
    line-height: 1.4;
    margin: 0;
}

.priceSection {
    text-align: center;
    margin-bottom: 32px;
    padding: 24px 0;
    border-top: 1px solid var(--primary-light);
    border-bottom: 1px solid var(--primary-light)
}

.price {
    display: flex;
    align-items: baseline;
    justify-content: center;
    gap: 4px;
    margin-bottom: 8px;
}

.currency {
    font-family: 'Montserrat', sans-serif;
    font-size: 20px;
    font-weight: 600;
    color: var(--neutral-color);
}

.amount {
    font-family: 'Montserrat', serif;
    font-size: 42px;
    font-weight: 700;
    color: var(--primary-dark);
    letter-spacing: -1px;
}

.period {
    color: var(--neutral-color);
    font-size: 14px;
    font-weight: 500;
}

.featuresList {
    list-style: none;
    margin-bottom: 32px;
}

.feature, .feature_item {
    color: var(--primary-dark);
    font-size: 14px;
    line-height: 1.5;
    margin-bottom: 12px;
    padding-left: 4px
}

.pricingButton {
    width: 100%;
    padding: 16px 24px;
    border-radius: 9999px;
    text-decoration: none;
    font-weight: 600;
    font-size: 15px;
    text-align: center;
    transition: all 0.25s ease;
    display: block;
    border: none;
    cursor: pointer;
}

.pricingButton.primary {
    background: var(--accent-color);
    color: white;
    box-shadow: 0 6px 20px rgba(247, 127, 0, 0.3);
}

.pricingButton.primary:hover {
    background: #e66d00;
    transform: translateY(-2px);
    box-shadow: 0 12px 32px rgba(247, 127, 0, 0.4);
}

.pricingButton.secondary {
    background: transparent;
    color: var(--primary-dark);
    border: 2px solid var(--neutral-color);
}

.pricingButton.secondary:hover {
    background: var(--primary-dark);
    color: white;
    border-color: var(--primary-dark);
}

.pricingImage {
    position: sticky;
    top: 120px;
}

.imageContainer {
    position: relative;
    border-radius: 28px;
    overflow: hidden;
    box-shadow: 0 20px 60px rgba(7, 59, 76, 0.15);
}

.consultingPhoto {
    width: 100%;
    height: 400px;
    object-fit: cover;
    transition: transform 0.4s ease;
}

.imageContainer:hover .consultingPhoto {
    transform: scale(1.05);
}

.imageStats {
    position: absolute;
    bottom: 24px;
    left: 24px;
    right: 24px;
    display: flex;
    gap: 16px;
}

.statItem, .stat_item {
    background: rgba(255, 255, 255, 0.95);
    backdrop-filter: blur(12px);
    padding: 16px 20px;
    border-radius: 16px;
    text-align: center;
    flex: 1;
    border: 1px solid rgba(255, 255, 255, 0.2);
}

.statNumber {
    display: block;
    font-family: 'Montserrat', sans-serif;
    font-size: 20px;
    font-weight: 700;
    color: var(--accent-color);
    margin-bottom: 4px;
}

.statLabel {
    font-size: 12px;
    color: var(--neutral-color);
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.valueProposition {
    background: white;
    border-radius: 32px;
    padding: 48px 40px;
    margin-top: 80px;
    border: 2px solid var(--primary-light);
}

.valueTitle {
    font-family: 'Montserrat', serif;
    font-size: 28px;
    font-weight: 600;
    color: var(--primary-dark);
    text-align: center;
    margin-bottom: 40px;
    letter-spacing: -0.5px;
}

.valuePoints {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 32px;
}

.valuePoint {
    display: flex;
    align-items: flex-start;
    gap: 16px;
}

.valueIcon {
    width: 48px;
    height: 48px;
    background: var(--success-color);
    color: white;
    border-radius: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.valuePointTitle {
    font-family: 'Montserrat', sans-serif;
    font-size: 16px;
    font-weight: 600;
    color: var(--primary-dark);
    margin-bottom: 8px;
}

.valuePointDesc {
    color: var(--neutral-color);
    font-size: 14px;
    line-height: 1.5;
    margin: 0;
}

.customQuote {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-dark) 100%);
    border-radius: 32px;
    padding: 48px 40px;
    text-align: center;
    margin-top: 60px;
    position: relative;
    overflow: hidden;
}

.customQuote::before {
    content: '';
    position: absolute;
    top: -40%;
    left: -20%;
    width: 40%;
    height: 180%;
    background: radial-gradient(ellipse at center, rgba(255, 255, 255, 0.06) 0%, transparent 60%);
    transform: rotate(-15deg)
}

.quoteContent {
    position: relative;
    z-index: 2;
    max-width: 600px;
    margin: 0 auto;
}

.quoteTitle {
    font-family: 'Montserrat', serif;
    font-size: 28px;
    font-weight: 600;
    color: white;
    margin-bottom: 16px;
    letter-spacing: -0.5px;
}

.quoteText {
    color: var(--primary-light);
    font-size: 16px;
    line-height: 1.5;
    margin-bottom: 32px;
    opacity: 0.9;
}

.quoteButton {
    background: var(--accent-color);
    color: white;
    padding: 16px 32px;
    text-decoration: none;
    border-radius: 9999px;
    font-weight: 600;
    font-size: 16px;
    display: inline-block;
    transition: all 0.25s ease;
    box-shadow: 0 6px 20px rgba(247, 127, 0, 0.3);
}

.quoteButton:hover {
    background: #e66d00;
    transform: translateY(-3px);
    box-shadow: 0 12px 32px rgba(247, 127, 0, 0.4);
}

@media (max-width: 1200px) {
    .pricingCards {
        grid-template-columns: 1fr;
        gap: 20px;
    }
    
    .popular {
        transform: none;
    }
    
    .popular:hover {
        transform: translateY(-8px);
    }
}

@media (max-width: 1024px) {
    .pricingLayout {
        grid-template-columns: 1fr;
        gap: 40px;
    }
    
    .pricingImage {
        position: static;
    }
    
    .valuePoints {
        grid-template-columns: 1fr;
        gap: 24px;
    }
}

@media (max-width: 768px) {
    .pricingSection {
        padding: 80px 0;
    }
    
    .pricingContainer {
        padding: 0 20px;
    }
    
    .pricingLayout {
        margin-top: 60px;
    }
    
    .pricingCard, .pricing-card {
        padding: 28px 20px;
    }
    
    .amount {
        font-size: 36px;
    }
    
    .consultingPhoto {
        height: 280px;
    }
    
    .imageStats {
        flex-direction: column;
        gap: 12px;
    }
    
    .valueProposition {
        padding: 32px 24px;
    }
    
    .valueTitle {
        font-size: 24px;
    }
    
    .customQuote {
        padding: 32px 24px;
    }
    
    .quoteTitle {
        font-size: 24px;
    }
}

















.mainFooter {
    background: linear-gradient(135deg, var(--primary-dark) 0%, #041920 100%);
    color: var(--primary-light);
    padding: 80px 0 0 0;
    position: relative;
    overflow: hidden;
}

.mainFooter::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 1px;
    background: linear-gradient(90deg, transparent 0%, var(--accent-color) 50%, transparent 100%);
}

.footerContainer {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 24px;
}

.footerContent {
    display: grid;
    grid-template-columns: 1.5fr 1fr;
    gap: 60px;
    margin-bottom: 60px;
}

.footerBrand {
    max-width: 480px;
}

.brandLogo {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 24px;
}

.footerLogo {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    object-fit: cover;
}

.brandName {
    font-family: 'Montserrat', sans-serif;
    font-size: 20px;
    font-weight: 600;
    color: white;
    letter-spacing: -0.3px
}

.brandDescription {
    color: var(--primary-light);
    font-size: 16px;
    line-height: 1.6;
    margin-bottom: 32px;
    opacity: 0.9;
}

.contactInfo {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.contactItem, .contact_item {
    display: flex;
    align-items: center;
    gap: 12px;
}

.contactItem svg, .contact_item svg {
    color: var(--accent-color);
    flex-shrink: 0;
}

.contactLink {
    color: var(--primary-light);
    text-decoration: none;
    font-size: 15px;
    transition: color 0.2s ease;
}

.contactLink:hover {
    color: var(--accent-color);
}

.contactText {
    color: var(--primary-light);
    font-size: 15px;
    line-height: 1.4;
}

.footerLinks {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 40px;
}

.columnTitle {
    font-family: 'Montserrat', sans-serif;
    font-size: 18px;
    font-weight: 600;
    color: white;
    margin-bottom: 20px;
    letter-spacing: -0.2px;
}

.linksList {
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.footerLink, .footer_link {
    color: var(--primary-light);
    text-decoration: none;
    font-size: 15px;
    transition: all 0.2s ease;
    opacity: 0.8;
    padding-left: 0;
    border-left: 2px solid transparent;
    padding-left: 8px;
}

.footerLink:hover, .footer_link:hover {
    color: var(--accent-color);
    opacity: 1;
    border-left-color: var(--accent-color);
    padding-left: 12px;
}

.footerBottom {
    border-top: 1px solid rgba(230, 235, 238, 0.15);
    padding: 32px 0;
}

.bottomContent {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 20px;
}

.copyright p {
    color: var(--primary-light);
    font-size: 14px;
    margin: 0;
    opacity: 0.8;
}

.bottomLinks {
    display: flex;
    align-items: center;
    gap: 16px;
}

.bottomLink {
    color: var(--primary-light);
    text-decoration: none;
    font-size: 14px;
    transition: color 0.2s ease;
    opacity: 0.8;
}

.bottomLink:hover {
    color: var(--accent-color);
    opacity: 1;
}

.separator {
    color: var(--primary-light);
    opacity: 0.4;
    font-size: 12px
}

@media (max-width: 1024px) {
    .footerContent {
        grid-template-columns: 1fr;
        gap: 40px;
    }
    
    .footerLinks {
        grid-template-columns: repeat(2, 1fr);
        gap: 32px;
    }
}

@media (max-width: 768px) {
    .mainFooter {
        padding: 60px 0 0 0;
    }
    
    .footerContainer {
        padding: 0 20px;
    }
    
    .footerContent {
        gap: 32px;
        margin-bottom: 40px;
    }
    
    .footerLinks {
        grid-template-columns: 1fr;
        gap: 24px;
    }
    
    .contactInfo {
        gap: 12px;
    }
    
    .contactItem, .contact_item {
        flex-wrap: wrap;
    }
    
    .bottomContent {
        flex-direction: column;
        text-align: center;
        gap: 16px;
    }
    
    .bottomLinks {
        justify-content: center;
    }
}

@media (max-width: 480px) {
    .brandLogo {
        flex-direction: column;
        text-align: center;
        gap: 8px;
    }
    
    .contactItem, .contact_item {
        font-size: 14px;
    }
    
    .footerBottom {
        padding: 24px 0;
    }
}


















        .aboutHeroSection {
            min-height: 60vh;
            display: flex;
            align-items: center;
            background: linear-gradient(135deg, var(--primary-light) 0%, #ffffff 100%);
            padding-top: 120px;
            position: relative;
            overflow: hidden;
        }

        .aboutHeroSection::before {
            content: '';
            position: absolute;
            top: 0;
            right: -20%;
            width: 40%;
            height: 100%;
            background: radial-gradient(ellipse at center, rgba(7, 59, 76, 0.08) 0%, transparent 70%);
            transform: rotate(-12deg);
        }

        .aboutHeroContent {
            text-align: center;
            max-width: 800px;
            margin: 0 auto;
        }

        .aboutHeroTitle {
            font-family: 'Montserrat', serif;
            font-size: clamp(42px, 5vw, 64px);
            font-weight: 700;
            line-height: 1.1;
            margin-bottom: 28px;
            color: var(--primary-dark);
            letter-spacing: -1.2px;
        }

        .aboutHeroDescription {
            font-size: 20px;
            color: var(--neutral-color);
            line-height: 1.7;
            font-weight: 400;
            max-width: 600px;
            margin: 0 auto;
        }

        .storySection {
            padding: 120px 0;
            background: #ffffff;
        }

        .storyContainer {
            max-width: 1400px;
            margin: 0 auto;
            padding: 0 24px;
        }

        .storyLayout {
            display: grid;
            grid-template-columns: 1.5fr 1fr;
            gap: 80px;
            align-items: start;
        }

        .storyText {
            margin-top: 40px;
        }

        .storyParagraph {
            font-size: 16px;
            line-height: 1.7;
            color: var(--neutral-color);
            margin-bottom: 24px;
            font-weight: 400;
        }

        .storyImage {
            position: sticky;
            top: 120px;
        }

        .foundingPhoto {
            width: 100%;
            height: 500px;
            object-fit: cover;
            transition: transform 0.4s ease;
        }

        .missionSection {
            padding: 120px 0;
            background: linear-gradient(180deg, #ffffff 0%, var(--primary-light) 100%);
        }

        .missionContainer {
            max-width: 1400px;
            margin: 0 auto;
            padding: 0 24px;
        }

        .missionGrid {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 60px;
            margin-top: 80px;
        }

        .missionCard {
            background: white;
            padding: 48px 40px;
            border-radius: 32px;
            border: 2px solid var(--primary-light);
            transition: all 0.3s ease;
            text-align: center;
        }

        .missionCard:hover {
            transform: translateY(-8px);
            box-shadow: 0 24px 48px rgba(7, 59, 76, 0.12);
            border-color: var(--accent-color);
        }

        .missionIcon {
            margin-bottom: 32px;
        }

        .missionIconStyle {
            background: linear-gradient(135deg, var(--accent-color) 0%, #ff8c42 100%);
            color: white;
        }

        .visionIconStyle {
            background: linear-gradient(135deg, var(--secondary-color) 0%, #0e7a94 100%);
            color: white;
        }

        .missionTitle {
            font-family: 'Montserrat', sans-serif;
            font-size: 28px;
            font-weight: 600;
            color: var(--primary-dark);
            margin-bottom: 24px;
            letter-spacing: -0.5px;
        }

        .missionDesc {
            color: var(--neutral-color);
            font-size: 16px;
            line-height: 1.6;
            font-weight: 400;
        }

        .valuesSection {
            padding: 120px 0;
            background: #ffffff;
        }

        .valuesContainer {
            max-width: 1400px;
            margin: 0 auto;
            padding: 0 24px;
        }

        .valuesGrid {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
            gap: 32px;
            margin-top: 80px;
        }

        .valueCard {
            background: white;
            padding: 40px 32px;
            border-radius: 28px;
            border: 2px solid var(--primary-light);
            transition: all 0.3s ease;
            text-align: center;
            position: relative;
            overflow: hidden;
        }

        .valueCard::before {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 4px;
            background: linear-gradient(90deg, var(--accent-color) 0%, var(--tertiary-color) 100%);
            transform: translateX(-100%);
            transition: transform 0.4s ease;
        }

        .valueCard:hover::before {
            transform: translateX(0);
        }

        .valueCard:hover {
            transform: translateY(-8px);
            box-shadow: 0 24px 48px rgba(7, 59, 76, 0.12);
            border-color: var(--accent-color);
        }

        .valueIcon {
            margin-bottom: 24px;
        }

        .precisionIcon {
            background: linear-gradient(135deg, var(--accent-color) 0%, #ff8c42 100%);
            color: white;
        }

        .efficiencyIcon {
            background: linear-gradient(135deg, var(--secondary-color) 0%, #0e7a94 100%);
            color: white;
        }

        .partnershipIcon {
            background: linear-gradient(135deg, var(--success-color) 0%, #20c997 100%);
            color: white;
        }

        .innovationIcon {
            background: linear-gradient(135deg, #7b1fa2 0%, #9c27b0 100%);
            color: white;
        }

        .valueTitle {
            font-family: 'Montserrat', sans-serif;
            font-size: 24px;
            font-weight: 600;
            color: var(--primary-dark);
            margin-bottom: 20px;
            letter-spacing: -0.3px;
        }

        .valueDesc {
            color: var(--neutral-color);
            font-size: 15px;
            line-height: 1.6;
            margin-bottom: 28px;
            font-weight: 400;
        }

        .valueMetric {
            background: var(--neutral-light);
            padding: 20px;
            border-radius: 16px;
            text-align: center;
        }

        .teamPromiseSection {
            padding: 120px 0;
            background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-dark) 100%);
            position: relative;
            overflow: hidden;
        }

        .teamPromiseSection::before {
            content: '';
            position: absolute;
            top: -30%;
            right: -20%;
            width: 40%;
            height: 160%;
            background: radial-gradient(ellipse at center, rgba(255, 255, 255, 0.08) 0%, transparent 60%);
            transform: rotate(-20deg);
        }

        .promiseContainer {
            max-width: 1000px;
            margin: 0 auto;
            padding: 0 24px;
            position: relative;
            z-index: 2;
        }

        .promiseContent {
            text-align: center;
        }

        .promiseTitle {
            font-family: 'Montserrat', serif;
            font-size: clamp(36px, 4vw, 48px);
            font-weight: 700;
            color: white;
            margin-bottom: 24px;
            letter-spacing: -0.8px;
        }

        .promiseDescription {
            color: var(--primary-light);
            font-size: 18px;
            line-height: 1.6;
            margin-bottom: 48px;
            opacity: 0.95;
        }

        .promiseFeatures {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
            gap: 24px;
            margin-bottom: 48px;
        }

        .promiseFeature {
            display: flex;
            align-items: center;
            gap: 16px;
            background: rgba(255, 255, 255, 0.1);
            padding: 20px 24px;
            border-radius: 16px;
            color: white;
        }

        .featureIcon {
            font-size: 24px;
            flex-shrink: 0;
        }

        .featureText {
            font-size: 15px;
            font-weight: 500;
        }

        .promiseButton {
            background: var(--accent-color);
            color: white;
            padding: 18px 40px;
            text-decoration: none;
            border-radius: 9999px;
            font-weight: 600;
            font-size: 16px;
            display: inline-block;
            transition: all 0.25s ease;
            box-shadow: 0 6px 20px rgba(247, 127, 0, 0.3);
        }

        .promiseButton:hover {
            background: #e66d00;
            transform: translateY(-3px);
            box-shadow: 0 12px 32px rgba(247, 127, 0, 0.4);
        }

        @media (max-width: 1024px) {
            .storyLayout {
                grid-template-columns: 1fr;
                gap: 40px;
            }

            .storyImage {
                position: static;
            }

            .missionGrid {
                grid-template-columns: 1fr;
                gap: 32px;
            }

            .valuesGrid {
                grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
                gap: 24px;
            }
        }

        @media (max-width: 768px) {
            .aboutHeroSection {
                padding-top: 100px;
                min-height: 50vh;
            }

            .storySection, .missionSection, .valuesSection, .teamPromiseSection {
                padding: 80px 0;
            }

            .storyContainer, .missionContainer, .valuesContainer, .promiseContainer {
                padding: 0 20px;
            }

            .foundingPhoto {
                height: 320px;
            }

            .missionCard {
                padding: 32px 24px;
            }

            .valueCard {
                padding: 32px 24px;
            }

            .promiseFeatures {
                grid-template-columns: 1fr;
                gap: 16px;
            }

            .promiseFeature {
                padding: 16px 20px;
            }
        }
    





        .cookiesHeroSection {
            min-height: 50vh;
            display: flex;
            align-items: center;
            background: linear-gradient(135deg, var(--primary-light) 0%, #ffffff 100%);
            padding-top: 120px;
            position: relative;
            overflow: hidden;
        }

        .cookiesHeroSection::before {
            content: '';
            position: absolute;
            top: 0;
            right: -15%;
            width: 35%;
            height: 100%;
            background: radial-gradient(ellipse at center, rgba(7, 59, 76, 0.06) 0%, transparent 70%);
            transform: rotate(-8deg);
        }

        .cookiesHeroContent {
            text-align: center;
            max-width: 700px;
            margin: 0 auto;
        }

        .cookiesHeroTitle {
            font-family: 'Montserrat', serif;
            font-size: clamp(36px, 4.5vw, 52px);
            font-weight: 700;
            line-height: 1.1;
            margin-bottom: 24px;
            color: var(--primary-dark);
            letter-spacing: -1px;
        }

        .cookiesHeroDescription {
            font-size: 18px;
            color: var(--neutral-color);
            line-height: 1.6;
            font-weight: 400;
        }

        .cookiesContentSection {
            padding: 100px 0;
            background: #ffffff;
        }

        .cookiesContainer {
            max-width: 1400px;
            margin: 0 auto;
            padding: 0 24px;
        }

        .cookiesLayout {
            display: grid;
            grid-template-columns: 2fr 1fr;
            gap: 60px;
            align-items: start;
        }

        .cookiesMainContent {
            display: flex;
            flex-direction: column;
            gap: 80px;
        }

        .summaryHeader {
            text-align: center;
            margin-bottom: 60px;
        }

        .summaryGrid {
            display: grid;
            grid-template-columns: repeat(3, 1fr);
            gap: 32px;
        }

        .summaryCard {
            background: white;
            padding: 32px 24px;
            border-radius: 24px;
            border: 2px solid var(--primary-light);
            text-align: center;
            transition: all 0.3s ease;
            position: relative;
            overflow: hidden;
        }

        .summaryCard::before {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 3px;
            transform: translateX(-100%);
            transition: transform 0.4s ease;
        }

        .summaryCard.essential::before {
            background: var(--accent-color);
        }

        .summaryCard.analytics::before {
            background: var(--secondary-color);
        }

        .summaryCard.preference::before {
            background: var(--success-color);
        }

        .summaryCard:hover::before {
            transform: translateX(0);
        }

        .summaryCard:hover {
            transform: translateY(-6px);
            box-shadow: 0 20px 40px rgba(7, 59, 76, 0.1);
        }

        .summaryIcon {
            margin-bottom: 20px;
        }

        .iconSymbol {
            font-size: 32px;
            display: block;
        }

        .summaryTitle {
            font-family: 'Montserrat', sans-serif;
            font-size: 18px;
            font-weight: 600;
            color: var(--primary-dark);
            margin-bottom: 12px;
        }

        .summaryText {
            color: var(--neutral-color);
            font-size: 14px;
            line-height: 1.5;
            margin-bottom: 16px;
        }

        .summaryStatus {
            display: inline-block;
            padding: 6px 16px;
            border-radius: 9999px;
            font-size: 12px;
            font-weight: 600;
            text-transform: uppercase;
            letter-spacing: 0.5px;
        }

        .summaryStatus.required {
            background: var(--accent-light);
            color: var(--accent-color);
        }

        .summaryStatus.optional {
            background: var(--secondary-light);
            color: var(--secondary-color);
        }

        .detailsHeader {
            text-align: center;
            margin-bottom: 60px;
        }

        .detailsContent {
            display: flex;
            flex-direction: column;
            gap: 40px;
        }

        .cookieCategory {
            background: white;
            border-radius: 20px;
            border: 1px solid var(--primary-light);
            overflow: hidden;
        }

        .categoryHeader {
            background: var(--neutral-light);
            padding: 24px 32px;
            display: flex;
            justify-content: space-between;
            align-items: center;
        }

        .categoryTitle {
            font-family: 'Montserrat', sans-serif;
            font-size: 20px;
            font-weight: 600;
            color: var(--primary-dark);
            margin: 0;
        }

        .categoryBadge {
            padding: 6px 12px;
            border-radius: 9999px;
            font-size: 11px;
            font-weight: 600;
            text-transform: uppercase;
            letter-spacing: 0.5px;
        }

        .categoryBadge.essential {
            background: var(--accent-color);
            color: white;
        }

        .categoryBadge.analytics {
            background: var(--secondary-color);
            color: white;
        }

        .categoryBadge.preference {
            background: var(--success-color);
            color: white;
        }

        .categoryContent {
            padding: 32px;
        }

        .categoryDescription {
            color: var(--neutral-color);
            font-size: 15px;
            line-height: 1.6;
            margin-bottom: 24px;
        }

        .cookiesList {
            display: flex;
            flex-direction: column;
            gap: 12px;
        }

        .cookieItem {
            color: var(--primary-dark);
            font-size: 14px;
            line-height: 1.5;
            padding: 12px 16px;
            background: var(--primary-light);
            border-radius: 12px;
        }

        .controlHeader {
            text-align: center;
            margin-bottom: 40px;
        }

        .controlOptions {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 32px;
        }

        .controlCard {
            background: white;
            padding: 32px 28px;
            border-radius: 20px;
            border: 2px solid var(--primary-light);
            display: flex;
            gap: 20px;
            align-items: flex-start;
            transition: all 0.3s ease;
        }

        .controlCard:hover {
            border-color: var(--accent-color);
            transform: translateY(-4px);
            box-shadow: 0 16px 32px rgba(7, 59, 76, 0.08);
        }

        .controlIcon {
            flex-shrink: 0;
        }

        .controlIcon .iconSymbol {
            font-size: 28px;
        }

        .controlTitle {
            font-family: 'Montserrat', sans-serif;
            font-size: 16px;
            font-weight: 600;
            color: var(--primary-dark);
            margin-bottom: 8px;
        }

        .controlDesc {
            color: var(--neutral-color);
            font-size: 14px;
            line-height: 1.5;
            margin: 0;
        }

        .cookiesSidebar {
            position: sticky;
            top: 120px;
            display: flex;
            flex-direction: column;
            gap: 32px;
        }

        .sidebarCard {
            background: white;
            border-radius: 24px;
            border: 2px solid var(--primary-light);
            overflow: hidden;
        }

        .sidebarCard.commitment {
            background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-dark) 100%);
            color: white;
            border-color: var(--primary-color);
        }

        .sidebarHeader {
            padding: 24px 24px 0 24px;
        }

        .sidebarTitle {
            font-family: 'Montserrat', sans-serif;
            font-size: 18px;
            font-weight: 600;
            color: var(--primary-dark);
            margin: 0;
        }

        .sidebarCard.commitment .sidebarTitle {
            color: white;
        }

        .sidebarContent {
            padding: 20px 24px 24px 24px;
        }

        .sidebarItem {
            display: flex;
            justify-content: space-between;
            align-items: center;
            padding: 12px 0;
            border-bottom: 1px solid var(--primary-light);
        }

        .sidebarItem:last-child {
            border-bottom: none;
        }

        .itemLabel {
            font-size: 13px;
            color: var(--neutral-color);
            font-weight: 500;
        }

        .itemValue {
            font-size: 13px;
            color: var(--primary-dark);
            font-weight: 600;
        }

        .commitmentText {
            color: var(--primary-light);
            font-size: 14px;
            line-height: 1.5;
            margin-bottom: 20px;
            opacity: 0.9;
        }

        .commitmentFeatures {
            display: flex;
            flex-direction: column;
            gap: 8px;
        }

        .commitmentFeature {
            display: flex;
            align-items: center;
            gap: 8px;
            color: white;
            font-size: 13px;
            font-weight: 500;
        }

        .commitmentFeature span {
            color: var(--tertiary-color);
            font-weight: bold;
        }

        @media (max-width: 1024px) {
            .cookiesLayout {
                grid-template-columns: 1fr;
                gap: 40px;
            }

            .cookiesSidebar {
                position: static;
                flex-direction: row;
            }

            .summaryGrid {
                grid-template-columns: 1fr;
                gap: 24px;
            }

            .controlOptions {
                grid-template-columns: 1fr;
                gap: 20px;
            }
        }

        @media (max-width: 768px) {
            .cookiesHeroSection {
                padding-top: 100px;
                min-height: 40vh;
            }

            .cookiesContentSection {
                padding: 60px 0;
            }

            .cookiesContainer {
                padding: 0 20px;
            }

            .cookiesMainContent {
                gap: 60px;
            }

            .summaryHeader {
                margin-bottom: 40px;
            }

            .detailsHeader, .controlHeader {
                margin-bottom: 40px;
            }

            .categoryContent {
                padding: 24px 20px;
            }

            .categoryHeader {
                padding: 20px 24px;
                flex-direction: column;
                gap: 12px;
                text-align: center;
            }

            .controlCard {
                padding: 24px 20px;
            }

            .cookiesSidebar {
                flex-direction: column;
            }
        }
    

















  
        .privacyHeroSection {
            min-height: 50vh;
            display: flex;
            align-items: center;
            background: linear-gradient(135deg, var(--primary-light) 0%, #ffffff 100%);
            padding-top: 120px;
            position: relative;
            overflow: hidden;
        }

        .privacyHeroSection::before {
            content: '';
            position: absolute;
            top: 0;
            left: -15%;
            width: 35%;
            height: 100%;
            background: radial-gradient(ellipse at center, rgba(17, 138, 178, 0.06) 0%, transparent 70%);
            transform: rotate(8deg);
        }

        .privacyHeroContent {
            text-align: center;
            max-width: 700px;
            margin: 0 auto;
        }

        .privacyHeroTitle {
            font-family: 'Montserrat', serif;
            font-size: clamp(36px, 4.5vw, 52px);
            font-weight: 700;
            line-height: 1.1;
            margin-bottom: 24px;
            color: var(--primary-dark);
            letter-spacing: -1px;
        }

        .privacyHeroDescription {
            font-size: 18px;
            color: var(--neutral-color);
            line-height: 1.6;
            font-weight: 400;
        }

        .privacyContentSection {
            padding: 100px 0;
            background: #ffffff;
        }

        .privacyContainer {
            max-width: 1400px;
            margin: 0 auto;
            padding: 0 24px;
        }

        .privacyLayout {
            display: grid;
            grid-template-columns: 2fr 1fr;
            gap: 60px;
            align-items: start;
        }

        .privacyMainContent {
            display: flex;
            flex-direction: column;
            gap: 80px;
        }

        .principlesHeader {
            text-align: center;
            margin-bottom: 60px;
        }

        .principlesGrid {
            display: grid;
            grid-template-columns: repeat(3, 1fr);
            gap: 32px;
        }

        .principleCard {
            background: white;
            padding: 32px 24px;
            border-radius: 24px;
            border: 2px solid var(--primary-light);
            text-align: center;
            transition: all 0.3s ease;
            position: relative;
            overflow: hidden;
        }

        .principleCard::before {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 3px;
            transform: translateX(-100%);
            transition: transform 0.4s ease;
        }

        .principleCard.security::before {
            background: var(--accent-color);
        }

        .principleCard.transparency::before {
            background: var(--secondary-color);
        }

        .principleCard.control::before {
            background: var(--success-color);
        }

        .principleCard:hover::before {
            transform: translateX(0);
        }

        .principleCard:hover {
            transform: translateY(-6px);
            box-shadow: 0 20px 40px rgba(7, 59, 76, 0.1);
        }

        .principleIcon {
            margin-bottom: 20px;
        }

        .iconSymbol {
            font-size: 32px;
            display: block;
        }

        .principleTitle {
            font-family: 'Montserrat', sans-serif;
            font-size: 18px;
            font-weight: 600;
            color: var(--primary-dark);
            margin-bottom: 12px;
        }

        .principleText {
            color: var(--neutral-color);
            font-size: 14px;
            line-height: 1.5;
        }

        .processingHeader {
            text-align: center;
            margin-bottom: 60px;
        }

        .processingContent {
            display: flex;
            flex-direction: column;
            gap: 40px;
        }

        .dataCategory {
            background: white;
            border-radius: 20px;
            border: 1px solid var(--primary-light);
            overflow: hidden;
        }

        .categoryHeader {
            background: var(--neutral-light);
            padding: 24px 32px;
            display: flex;
            justify-content: space-between;
            align-items: center;
        }

        .categoryTitle {
            font-family: 'Montserrat', sans-serif;
            font-size: 20px;
            font-weight: 600;
            color: var(--primary-dark);
            margin: 0;
        }

        .categoryType {
            padding: 6px 12px;
            border-radius: 9999px;
            font-size: 11px;
            font-weight: 600;
            text-transform: uppercase;
            letter-spacing: 0.5px;
        }

        .categoryType.automatic {
            background: var(--info-color);
            color: white;
        }

        .categoryType.voluntary {
            background: var(--success-color);
            color: white;
        }

        .categoryContent {
            padding: 32px;
        }

        .categoryDescription {
            color: var(--neutral-color);
            font-size: 15px;
            line-height: 1.6;
            margin-bottom: 24px;
        }

        .dataList {
            display: flex;
            flex-direction: column;
            gap: 16px;
        }

        .dataItem {
            display: flex;
            gap: 12px;
            padding: 16px 20px;
            background: var(--primary-light);
            border-radius: 12px;
            align-items: flex-start;
        }

        .dataLabel {
            font-weight: 600;
            color: var(--primary-dark);
            font-size: 14px;
            min-width: 140px;
            flex-shrink: 0;
        }

        .dataValue {
            color: var(--neutral-color);
            font-size: 14px;
            line-height: 1.4;
        }

        .rightsHeader {
            text-align: center;
            margin-bottom: 40px;
        }

        .rightsGrid {
            display: grid;
            grid-template-columns: repeat(2, 1fr);
            gap: 24px;
        }

        .rightCard {
            background: white;
            padding: 28px 24px;
            border-radius: 20px;
            border: 2px solid var(--primary-light);
            display: flex;
            gap: 20px;
            align-items: flex-start;
            transition: all 0.3s ease;
        }

        .rightCard:hover {
            border-color: var(--secondary-color);
            transform: translateY(-4px);
            box-shadow: 0 16px 32px rgba(7, 59, 76, 0.08);
        }

        .rightIcon {
            flex-shrink: 0;
        }

        .rightIcon .iconSymbol {
            font-size: 28px;
        }

        .rightTitle {
            font-family: 'Montserrat', sans-serif;
            font-size: 16px;
            font-weight: 600;
            color: var(--primary-dark);
            margin-bottom: 8px;
        }

        .rightDesc {
            color: var(--neutral-color);
            font-size: 14px;
            line-height: 1.5;
            margin: 0;
        }

        .privacySidebar {
            position: sticky;
            top: 120px;
            display: flex;
            flex-direction: column;
            gap: 32px;
        }

        .sidebarCard {
            background: white;
            border-radius: 24px;
            border: 2px solid var(--primary-light);
            overflow: hidden;
        }

        .sidebarCard.security {
            background: linear-gradient(135deg, var(--secondary-color) 0%, #0e7a94 100%);
            color: white;
            border-color: var(--secondary-color);
        }

        .sidebarCard.commitment {
            background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-dark) 100%);
            color: white;
            border-color: var(--primary-color);
        }

        .sidebarHeader {
            padding: 24px 24px 0 24px;
        }

        .sidebarTitle {
            font-family: 'Montserrat', sans-serif;
            font-size: 18px;
            font-weight: 600;
            color: var(--primary-dark);
            margin: 0;
        }

        .sidebarCard.security .sidebarTitle,
        .sidebarCard.commitment .sidebarTitle {
            color: white;
        }

        .sidebarContent {
            padding: 20px 24px 24px 24px;
        }

        .sidebarItem {
            display: flex;
            justify-content: space-between;
            align-items: center;
            padding: 12px 0;
            border-bottom: 1px solid var(--primary-light);
        }

        .sidebarItem:last-child {
            border-bottom: none;
        }

        .itemLabel {
            font-size: 13px;
            color: var(--neutral-color);
            font-weight: 500;
        }

        .itemValue {
            font-size: 13px;
            color: var(--primary-dark);
            font-weight: 600;
        }

        .securityFeatures {
            display: flex;
            flex-direction: column;
            gap: 12px;
        }

        .securityFeature {
            display: flex;
            align-items: center;
            gap: 12px;
            color: white;
        }

        .featureIcon {
            font-size: 16px;
            flex-shrink: 0;
        }

        .featureText {
            font-size: 14px;
            font-weight: 500;
        }

        .commitmentText {
            color: var(--primary-light);
            font-size: 14px;
            line-height: 1.5;
            opacity: 0.9;
        }

        @media (max-width: 1024px) {
            .privacyLayout {
                grid-template-columns: 1fr;
                gap: 40px;
            }

            .privacySidebar {
                position: static;
                flex-direction: row;
                flex-wrap: wrap;
            }

            .principlesGrid {
                grid-template-columns: 1fr;
                gap: 24px;
            }

            .rightsGrid {
                grid-template-columns: 1fr;
                gap: 20px;
            }
        }

        @media (max-width: 768px) {
            .privacyHeroSection {
                padding-top: 100px;
                min-height: 40vh;
            }

            .privacyContentSection {
                padding: 60px 0;
            }

            .privacyContainer {
                padding: 0 20px;
            }

            .privacyMainContent {
                gap: 60px;
            }

            .principlesHeader, .processingHeader, .rightsHeader {
                margin-bottom: 40px;
            }

            .categoryContent {
                padding: 24px 20px;
            }

            .categoryHeader {
                padding: 20px 24px;
                flex-direction: column;
                gap: 12px;
                text-align: center;
            }

            .dataItem {
                flex-direction: column;
                gap: 8px;
            }

            .dataLabel {
                min-width: auto;
            }

            .rightCard {
                padding: 24px 20px;
            }

            .privacySidebar {
                flex-direction: column;
            }
        }
    






















          .thankyouSection {
            min-height: 90vh;
            display: flex;
            align-items: center;
            background: linear-gradient(135deg, var(--primary-light) 0%, #ffffff 100%);
            padding: 120px 0 80px 0;
            position: relative;
            overflow: hidden;
        }

        .thankyouSection::before {
            content: '';
            position: absolute;
            top: 0;
            right: -20%;
            width: 40%;
            height: 100%;
            background: radial-gradient(ellipse at center, rgba(7, 59, 76, 0.08) 0%, transparent 70%);
            transform: rotate(-12deg);
        }

        .thankyouContainer {
            max-width: 1200px;
            margin: 0 auto;
            padding: 0 24px;
            width: 100%;
        }

        .thankyouContent {
            text-align: center;
            position: relative;
            z-index: 2;
        }

        .successIcon {
            margin-bottom: 40px;
        }

        .iconWrapper {
            width: 100px;
            height: 100px;
            background: linear-gradient(135deg, var(--success-color) 0%, #20c997 100%);
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            margin: 0 auto;
            box-shadow: 0 12px 32px rgba(40, 167, 69, 0.3);
            animation: successPulse 2s ease-in-out infinite;
        }

        @keyframes successPulse {
            0%, 100% { transform: scale(1); }
            50% { transform: scale(1.05); }
        }

        .checkmark {
            color: white;
            font-size: 48px;
            font-weight: bold;
        }

        .thankyouTitle {
            font-family: 'Montserrat', serif;
            font-size: clamp(32px, 4vw, 48px);
            font-weight: 700;
            line-height: 1.2;
            margin-bottom: 24px;
            color: var(--primary-dark);
            letter-spacing: -0.8px;
        }

        .thankyouDescription {
            font-size: 18px;
            color: var(--neutral-color);
            line-height: 1.6;
            margin-bottom: 60px;
            max-width: 700px;
            margin-left: auto;
            margin-right: auto;
        }

        .nextSteps {
            margin-bottom: 60px;
        }

        .stepsHeader {
            margin-bottom: 40px;
        }

        .stepsTitle {
            font-family: 'Montserrat', sans-serif;
            font-size: 28px;
            font-weight: 600;
            color: var(--primary-dark);
            margin-bottom: 16px;
        }

        .stepsGrid {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
            gap: 32px;
            max-width: 1000px;
            margin: 0 auto;
        }

        .stepCard {
            background: white;
            padding: 32px 24px;
            border-radius: 24px;
            border: 2px solid var(--primary-light);
            text-align: left;
            transition: all 0.3s ease;
            position: relative;
            overflow: hidden;
        }

        .stepCard::before {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 4px;
            background: linear-gradient(90deg, var(--accent-color) 0%, var(--secondary-color) 100%);
            transform: translateX(-100%);
            transition: transform 0.4s ease;
        }

        .stepCard:hover::before {
            transform: translateX(0);
        }

        .stepCard:hover {
            transform: translateY(-8px);
            box-shadow: 0 20px 40px rgba(7, 59, 76, 0.12);
            border-color: var(--accent-color);
        }

        .stepNumber {
            position: absolute;
            top: -12px;
            left: 24px;
            background: var(--accent-color);
            color: white;
            width: 40px;
            height: 40px;
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            font-family: 'Montserrat', sans-serif;
            font-weight: 700;
            font-size: 14px;
            box-shadow: 0 4px 12px rgba(247, 127, 0, 0.3);
        }

        .stepContent {
            padding-top: 20px;
        }

        .stepTitle {
            font-family: 'Montserrat', sans-serif;
            font-size: 18px;
            font-weight: 600;
            color: var(--primary-dark);
            margin-bottom: 12px;
        }

        .stepDesc {
            color: var(--neutral-color);
            font-size: 14px;
            line-height: 1.5;
            margin-bottom: 16px;
        }

        .stepTime {
            display: inline-block;
            background: var(--secondary-light);
            color: var(--secondary-color);
            padding: 6px 12px;
            border-radius: 9999px;
            font-size: 12px;
            font-weight: 600;
            text-transform: uppercase;
            letter-spacing: 0.5px;
        }

        .additionalInfo {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(400px, 1fr));
            gap: 32px;
            margin-bottom: 60px;
            max-width: 900px;
            margin-left: auto;
            margin-right: auto;
        }

        .infoCard {
            background: white;
            padding: 32px 28px;
            border-radius: 20px;
            border: 1px solid var(--primary-light);
            display: flex;
            gap: 20px;
            align-items: flex-start;
            text-align: left;
            transition: all 0.3s ease;
        }

        .infoCard:hover {
            transform: translateY(-4px);
            box-shadow: 0 16px 32px rgba(7, 59, 76, 0.08);
        }

        .infoIcon {
            flex-shrink: 0;
        }

        .iconSymbol {
            font-size: 28px;
        }

        .infoTitle {
            font-family: 'Montserrat', sans-serif;
            font-size: 16px;
            font-weight: 600;
            color: var(--primary-dark);
            margin-bottom: 8px;
        }

        .infoText {
            color: var(--neutral-color);
            font-size: 14px;
            line-height: 1.5;
            margin: 0;
        }

        .thankyouActions {
            display: flex;
            gap: 20px;
            justify-content: center;
            margin-bottom: 60px;
            flex-wrap: wrap;
        }

        .contactReminder {
            background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-dark) 100%);
            border-radius: 24px;
            padding: 40px 32px;
            color: white;
            max-width: 600px;
            margin: 0 auto;
            position: relative;
            overflow: hidden;
        }

        .contactReminder::before {
            content: '';
            position: absolute;
            top: -30%;
            right: -20%;
            width: 40%;
            height: 160%;
            background: radial-gradient(ellipse at center, rgba(255, 255, 255, 0.08) 0%, transparent 60%);
            transform: rotate(-15deg);
        }

        .reminderContent {
            position: relative;
            z-index: 2;
            text-align: center;
        }

        .reminderTitle {
            font-family: 'Montserrat', sans-serif;
            font-size: 20px;
            font-weight: 600;
            margin-bottom: 12px;
            letter-spacing: -0.3px;
        }

        .reminderText {
            color: var(--primary-light);
            font-size: 15px;
            line-height: 1.5;
            margin-bottom: 20px;
            opacity: 0.9;
        }

        .urgentContact {
            display: flex;
            justify-content: center;
            align-items: center;
            gap: 12px;
            flex-wrap: wrap;
        }

        .contactLabel {
            font-size: 14px;
            opacity: 0.8;
        }

        .contactValue {
            font-family: 'Montserrat', sans-serif;
            font-size: 16px;
            font-weight: 600;
            color: var(--tertiary-color);
        }

        @media (max-width: 768px) {
            .thankyouSection {
                padding: 100px 0 60px 0;
                min-height: 80vh;
            }

            .thankyouContainer {
                padding: 0 20px;
            }

            .thankyouDescription {
                margin-bottom: 50px;
            }

            .stepsGrid {
                grid-template-columns: 1fr;
                gap: 24px;
            }

            .additionalInfo {
                grid-template-columns: 1fr;
                gap: 20px;
                margin-bottom: 50px;
            }

            .infoCard {
                padding: 24px 20px;
            }

            .thankyouActions {
                flex-direction: column;
                align-items: center;
                margin-bottom: 50px;
            }

            .primaryButton, .secondaryBtn {
                width: 100%;
                max-width: 280px;
            }

            .contactReminder {
                padding: 32px 24px;
            }

            .urgentContact {
                flex-direction: column;
                gap: 4px;
            }
        }

        @media (max-width: 480px) {
            .iconWrapper {
                width: 80px;
                height: 80px;
            }

            .checkmark {
                font-size: 36px;
            }

            .stepCard {
                padding: 28px 20px;
            }

            .stepNumber {
                width: 36px;
                height: 36px;
                font-size: 12px;
            }
        }





        .contactHeroSection {
            min-height: 50vh;
            display: flex;
            align-items: center;
            background: linear-gradient(135deg, var(--primary-light) 0%, #ffffff 100%);
            padding-top: 120px;
            position: relative;
            overflow: hidden;
        }

        .contactHeroSection::before {
            content: '';
            position: absolute;
            top: 0;
            left: -15%;
            width: 35%;
            height: 100%;
            background: radial-gradient(ellipse at center, rgba(17, 138, 178, 0.06) 0%, transparent 70%);
            transform: rotate(-8deg);
        }

        .contactHeroContent {
            text-align: center;
            max-width: 700px;
            margin: 0 auto;
        }

        .contactHeroTitle {
            font-family: 'Montserrat', serif;
            font-size: clamp(36px, 4.5vw, 52px);
            font-weight: 700;
            line-height: 1.1;
            margin-bottom: 24px;
            color: var(--primary-dark);
            letter-spacing: -1px;
        }

        .contactHeroDescription {
            font-size: 18px;
            color: var(--neutral-color);
            line-height: 1.6;
            font-weight: 400;
        }

        .contactFormSection {
            padding: 100px 0;
            background: #ffffff;
        }

        .contactContainer {
            max-width: 1400px;
            margin: 0 auto;
            padding: 0 24px;
        }

        .contactLayout {
            display: grid;
            grid-template-columns: 2fr 1fr;
            gap: 80px;
            align-items: start;
        }

        .formHeader {
            text-align: center;
            margin-bottom: 60px;
        }

        .contactForm {
            background: white;
            padding: 48px 40px;
            border-radius: 32px;
            border: 2px solid var(--primary-light);
            box-shadow: 0 12px 48px rgba(7, 59, 76, 0.08);
        }

        .formGrid {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 24px;
            margin-bottom: 40px;
        }

        .inputGroup {
            display: flex;
            flex-direction: column;
        }

        .inputGroup.fullWidth {
            grid-column: 1 / -1;
        }

        .inputLabel {
            font-family: 'Montserrat', sans-serif;
            font-size: 14px;
            font-weight: 600;
            color: var(--primary-dark);
            margin-bottom: 8px;
            letter-spacing: -0.1px;
        }

        .formInput, .formSelect, .formTextarea {
            padding: 16px 20px;
            border: 2px solid var(--primary-light);
            border-radius: 16px;
            font-size: 15px;
            font-family: inherit;
            transition: all 0.3s ease;
            background: #ffffff;
        }

        .formInput:focus, .formSelect:focus, .formTextarea:focus {
            outline: none;
            border-color: var(--accent-color);
            box-shadow: 0 0 0 3px rgba(247, 127, 0, 0.1);
        }

        .formInput::placeholder, .formTextarea::placeholder {
            color: var(--neutral-color);
            opacity: 0.7;
        }

        .formTextarea {
            resize: vertical;
            min-height: 120px;
            font-family: inherit;
            line-height: 1.5;
        }

        .checkboxContainer {
            display: flex;
            align-items: flex-start;
            gap: 12px;
            cursor: pointer;
            font-size: 14px;
            line-height: 1.5;
        }

        .checkboxContainer input[type="checkbox"] {
            display: none;
        }

        .checkmark {
            width: 20px;
            height: 20px;
            border: 2px solid var(--primary-light);
            border-radius: 6px;
            background: white;
            display: flex;
            align-items: center;
            justify-content: center;
            transition: all 0.3s ease;
            flex-shrink: 0;
            margin-top: 2px;
        }

        .checkboxContainer input[type="checkbox"]:checked + .checkmark {
            background: var(--accent-color);
            border-color: var(--accent-color);
        }

        .checkboxContainer input[type="checkbox"]:checked + .checkmark::after {
            content: '✓';
            color: white;
            font-size: 12px;
            font-weight: bold;
        }

        .checkboxText {
            color: var(--neutral-color);
            flex: 1;
        }

        .privacyLink {
            color: var(--accent-color);
            text-decoration: none;
            font-weight: 500;
        }

        .privacyLink:hover {
            text-decoration: underline;
        }

        .formActions {
            text-align: center;
        }

        .submitButton {
            background: var(--accent-color);
            color: white;
            padding: 18px 40px;
            border: none;
            border-radius: 9999px;
            font-family: 'Montserrat', sans-serif;
            font-weight: 600;
            font-size: 16px;
            cursor: pointer;
            transition: all 0.25s ease;
            display: inline-flex;
            align-items: center;
            gap: 12px;
            box-shadow: 0 6px 20px rgba(247, 127, 0, 0.3);
            margin-bottom: 16px;
        }

        .submitButton:hover {
            background: #e66d00;
            transform: translateY(-2px);
            box-shadow: 0 12px 32px rgba(247, 127, 0, 0.4);
        }

        .buttonIcon {
            font-size: 18px;
            transition: transform 0.2s ease;
        }

        .submitButton:hover .buttonIcon {
            transform: translateX(4px);
        }

        .formNote {
            color: var(--neutral-color);
            font-size: 13px;
            margin: 0;
            opacity: 0.8;
        }

        .contactInfo {
            position: sticky;
            top: 120px;
            display: flex;
            flex-direction: column;
            gap: 32px;
        }

        .infoCard {
            background: white;
            border-radius: 24px;
            border: 2px solid var(--primary-light);
            overflow: hidden;
        }

        .infoCard.stats {
            background: linear-gradient(135deg, var(--accent-color) 0%, #ff8c42 100%);
            color: white;
            border-color: var(--accent-color);
        }

        .infoCard.process {
            background: linear-gradient(135deg, var(--secondary-color) 0%, #0e7a94 100%);
            color: white;
            border-color: var(--secondary-color);
        }

        .infoHeader {
            padding: 24px 24px 0 24px;
        }

        .infoTitle {
            font-family: 'Montserrat', sans-serif;
            font-size: 18px;
            font-weight: 600;
            color: var(--primary-dark);
            margin: 0;
        }

        .infoCard.stats .infoTitle,
        .infoCard.process .infoTitle {
            color: white;
        }

        .infoContent {
            padding: 20px 24px 24px 24px;
        }

        .infoItem {
            display: flex;
            gap: 16px;
            align-items: flex-start;
            margin-bottom: 20px;
        }

        .infoItem:last-child {
            margin-bottom: 0;
        }

        .infoIcon {
            flex-shrink: 0;
        }

        .iconSymbol {
            font-size: 24px;
        }

        .infoItemTitle {
            font-family: 'Montserrat', sans-serif;
            font-size: 14px;
            font-weight: 600;
            color: var(--primary-dark);
            margin-bottom: 4px;
        }

        .infoItemDesc {
            color: var(--neutral-color);
            font-size: 13px;
            line-height: 1.4;
            margin: 0;
        }

        .statsGrid {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 20px;
            padding: 20px 24px 24px 24px;
        }

        .statItem {
            text-align: center;
        }

        .statNumber {
            display: block;
            font-family: 'Montserrat', sans-serif;
            font-size: 24px;
            font-weight: 700;
            color: white;
            margin-bottom: 4px;
        }

        .statLabel {
            font-size: 12px;
            color: white;
            opacity: 0.9;
            font-weight: 500;
            text-transform: uppercase;
            letter-spacing: 0.5px;
        }

        .processSteps {
            padding: 20px 24px 24px 24px;
        }

        .processStep {
            display: flex;
            align-items: center;
            gap: 16px;
            margin-bottom: 16px;
            color: white;
        }

        .processStep:last-child {
            margin-bottom: 0;
        }

        .stepNumber {
            width: 32px;
            height: 32px;
            background: rgba(255, 255, 255, 0.2);
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            font-family: 'Montserrat', sans-serif;
            font-weight: 700;
            font-size: 14px;
            flex-shrink: 0;
        }

        .stepText {
            font-size: 14px;
            font-weight: 500;
        }

        @media (max-width: 1024px) {
            .contactLayout {
                grid-template-columns: 1fr;
                gap: 40px;
            }

            .contactInfo {
                position: static;
                flex-direction: row;
                flex-wrap: wrap;
            }

            .infoCard {
                flex: 1;
                min-width: 280px;
            }
        }

        @media (max-width: 768px) {
            .contactHeroSection {
                padding-top: 100px;
                min-height: 40vh;
            }

            .contactFormSection {
                padding: 60px 0;
            }

            .contactContainer {
                padding: 0 20px;
            }

            .contactForm {
                padding: 32px 24px;
            }

            .formGrid {
                grid-template-columns: 1fr;
                gap: 20px;
            }

            .formHeader {
                margin-bottom: 40px;
            }

            .contactInfo {
                flex-direction: column;
            }

            .statsGrid {
                grid-template-columns: 1fr;
                gap: 16px;
            }
        }
