/* Hero Section */
.hero-main {
    position: relative;
    height: 600px;
    display: flex;
    align-items: center;
    overflow: hidden;
}

.hero-main-bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: 1;
}

.hero-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    z-index: 2;
}

.hero-main .container {
    position: relative;
    z-index: 3;
}

.hero-main .breadcrumb {
    background: transparent;
    padding: 0;
    margin-bottom: 30px;
}

.hero-main .breadcrumb-item a {
    color: rgba(255, 255, 255, 0.8);
    text-decoration: none;
}

.hero-main .breadcrumb-item.active {
    color: #ffffff;
}

.hero-main-content {
    max-width: 600px;
}

.hero-main-title {
    font-size: 48px;
    font-weight: 600;
    color: #ffffff;
    margin-bottom: 20px;
    line-height: 1.2;
}

.hero-main-text {
    font-size: 18px;
    color: rgba(255, 255, 255, 0.9);
    margin-bottom: 30px;
    line-height: 1.6;
}

.hero-main-btn {
    background: #92C820;
    color: #ffffff;
    padding: 15px 30px;
    font-size: 16px;
    font-weight: 600;
    border: none;
    border-radius: 6px;
    text-decoration: none;
    display: inline-block;
    transition: all 0.3s ease;
}

.hero-main-btn:hover {
    background: #7BA01A;
    color: #ffffff;
    text-decoration: none;
    transform: translateY(-2px);
}

/* Mobile Responsive */
@media (max-width: 768px) {
    .hero-main {
        height: 500px;
    }
    
    .hero-main-title {
        font-size: 32px;
    }
    
    .hero-main-text {
        font-size: 16px;
    }
}

/* Benefits Section */
.benefits-section {
    padding: 80px 0;
    background: #F6F6F6;
}

.benefits-header {
    text-align: center;
    margin-bottom: 60px;
}

.benefits-title {
    font-size: 36px;
    font-weight: 600;
    color: #414141;
    margin-bottom: 15px;
    line-height: 1.3;
}

.benefits-subtitle {
    font-size: 18px;
    color: #777777;
    max-width: 600px;
    margin: 0 auto;
    line-height: 1.6;
}

.benefit-item {
    text-align: center;
    padding: 30px 20px;
    height: 100%;
    background: #ffffff;
    border-radius: 12px;
    margin-bottom: 30px;
    transition: all 0.3s ease;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.08);
}

.benefit-item:hover {
    transform: translateY(-5px);
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.15);
}

.benefit-icon {
    width: 60px;
    height: 60px;
    background: #92C820;
    border-radius: 50%;
    margin: 0 auto 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
}

.benefit-icon::before {
    content: "";
    width: 24px;
    height: 24px;
    background: #ffffff;
    border-radius: 2px;
}

/* Icon variations */
.icon-expand::before {
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='white' viewBox='0 0 24 24'%3E%3Cpath d='M9 11H7v2h2v-2zm4 0h-2v2h2v-2zm4 0h-2v2h2v-2zm2-7h-1V2h-2v2H8V2H6v2H5c-1.1 0-1.99.9-1.99 2L3 20c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2zm0 16H5V9h14v11z'/%3E%3C/svg%3E") center/20px no-repeat;
}

.icon-family::before {
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='white' viewBox='0 0 24 24'%3E%3Cpath d='M16 4c0-1.11.89-2 2-2s2 .89 2 2-.89 2-2 2-2-.89-2-2zm4 18v-6h2.5l-2.54-7.63A1.5 1.5 0 0 0 18.54 7h-2.08A1.5 1.5 0 0 0 15.04 8.37L12.5 16H15v6h5zM12.5 11.5c.83 0 1.5-.67 1.5-1.5s-.67-1.5-1.5-1.5S11 9.17 11 10s.67 1.5 1.5 1.5zM5.5 6c1.11 0 2-.89 2-2s-.89-2-2-2-2 .89-2 2 .89 2 2 2zm2 16v-7H9l-1.87-5.61C7.01 9.15 6.8 9 6.56 9H4.44c-.24 0-.45.15-.57.39L2 15h1.5v7h4z'/%3E%3C/svg%3E") center/20px no-repeat;
}

.icon-calendar::before {
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='white' viewBox='0 0 24 24'%3E%3Cpath d='M19 3h-1V1h-2v2H8V1H6v2H5c-1.11 0-1.99.9-1.99 2L3 19c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm0 16H5V8h14v11zM7 10h5v5H7z'/%3E%3C/svg%3E") center/20px no-repeat;
}

.icon-money::before {
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='white' viewBox='0 0 24 24'%3E%3Cpath d='M11.8 10.9c-2.27-.59-3-1.2-3-2.15 0-1.09 1.01-1.85 2.7-1.85 1.78 0 2.44.85 2.5 2.1h2.21c-.07-1.72-1.12-3.3-3.21-3.81V3h-3v2.16c-1.94.42-3.5 1.68-3.5 3.61 0 2.31 1.91 3.46 4.7 4.13 2.5.6 3 1.48 3 2.41 0 .69-.49 1.79-2.7 1.79-2.06 0-2.87-.92-2.98-2.1h-2.2c.12 2.19 1.76 3.42 3.68 3.83V21h3v-2.15c1.95-.37 3.5-1.5 3.5-3.55 0-2.84-2.43-3.81-4.7-4.4z'/%3E%3C/svg%3E") center/20px no-repeat;
}

.benefit-content h4 {
    font-size: 20px;
    font-weight: 600;
    color: #414141;
    margin-bottom: 15px;
    line-height: 1.3;
}

.benefit-content p {
    font-size: 14px;
    color: #777777;
    line-height: 1.5;
    margin: 0;
}

/* Mobile Responsive */
@media (max-width: 768px) {
    .benefits-section {
        padding: 60px 0;
    }
    
    .benefits-title {
        font-size: 28px;
    }
    
    .benefit-item {
        margin-bottom: 20px;
    }
}

/* Functional Zones Section */
.functional-zones-section {
    padding: 80px 0;
    background: #ffffff;
}

.zones-header {
    text-align: center;
    margin-bottom: 60px;
}

.zones-title {
    font-size: 36px;
    font-weight: 600;
    color: #414141;
    margin-bottom: 15px;
    line-height: 1.3;
}

.zones-subtitle {
    font-size: 18px;
    color: #777777;
    max-width: 700px;
    margin: 0 auto;
    line-height: 1.6;
}

.zone-item {
    background: #ffffff;
    border: 1px solid #e5e5e5;
    border-radius: 12px;
    padding: 30px 25px;
    margin-bottom: 30px;
    transition: all 0.3s ease;
    height: 100%;
}

.zone-item:hover {
    border-color: #92C820;
    box-shadow: 0 8px 25px rgba(146, 200, 32, 0.15);
    transform: translateY(-3px);
}

.zone-icon {
    width: 50px;
    height: 50px;
    background: #92C820;
    border-radius: 8px;
    margin-bottom: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
}

.zone-icon::before {
    content: "";
    width: 20px;
    height: 20px;
    background: #ffffff;
}

/* Zone Icon variations */
.icon-bbq::before {
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='white' viewBox='0 0 24 24'%3E%3Cpath d='M9.6 17c.8.8 2 .8 2.8 0l3.6-3.6V11h-1l-3 3-1.4-1.4L12 11.2V9.8L10.6 11 9.2 9.6 11.6 7.2C11.8 7 12 6.5 12 6c0-1.1-.9-2-2-2s-2 .9-2 2c0 .5.2 1 .4 1.2L11.6 10 9.6 12l-2-2 1.4-1.4L7.6 7.2C7.2 6.8 7 6.4 7 6c0-1.1-.9-2-2-2s-2 .9-2 2c0 .4.2.8.6 1.2L4 7.6l-1.4 1.4L4 10.4 2.6 12C2.2 12.4 2 12.8 2 13.2c0 1.1.9 2 2 2 .4 0 .8-.2 1.2-.6L6.4 13l1.4 1.4L6.4 15.8c-.4.4-.6.8-.6 1.2 0 1.1.9 2 2 2 .4 0 .8-.2 1.2-.6L9.6 17M19 7h-3v2h3v2l4-3-4-3v2z'/%3E%3C/svg%3E") center/18px no-repeat;
}

.icon-sink::before {
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='white' viewBox='0 0 24 24'%3E%3Cpath d='M18,16V14H22L20.5,9H18V7A1,1 0 0,0 17,6H15A1,1 0 0,0 14,7V9H10V7A1,1 0 0,0 9,6H7A1,1 0 0,0 6,7V9H3.5L2,14H6V16H4V18H20V16H18M8,8V7H9V9H8V8M15,8V7H16V9H15V8Z'/%3E%3C/svg%3E") center/18px no-repeat;
}

.icon-storage::before {
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='white' viewBox='0 0 24 24'%3E%3Cpath d='M12,2A10,10 0 0,0 2,12A10,10 0 0,0 12,22A10,10 0 0,0 22,12A10,10 0 0,0 12,2M12,4A8,8 0 0,1 20,12A8,8 0 0,1 12,20A8,8 0 0,1 4,12A8,8 0 0,1 12,4M12,7A5,5 0 0,0 7,12A5,5 0 0,0 12,17A5,5 0 0,0 17,12A5,5 0 0,0 12,7M12,9A3,3 0 0,1 15,12A3,3 0 0,1 12,15A3,3 0 0,1 9,12A3,3 0 0,1 12,9Z'/%3E%3C/svg%3E") center/18px no-repeat;
}

.icon-cooking::before {
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='white' viewBox='0 0 24 24'%3E%3Cpath d='M8.1,13.34L3.91,9.16C2.35,7.59 2.35,5.06 3.91,3.5L10.93,10.5L8.1,13.34M14.88,11.53C16.28,12.92 16.28,15.18 14.88,16.58C13.5,17.96 11.22,17.96 9.83,16.58L9.09,15.83L11.93,13L14.88,11.53M19.5,2.5L18.09,3.91L15.26,1.08L16.67,2.5L19.5,2.5M12.26,4.93L14.07,6.74L12.26,8.55L10.45,6.74L12.26,4.93M18.74,12.26L20.55,14.07L18.74,15.88L16.93,14.07L18.74,12.26M8.5,12.5A2,2 0 0,1 10.5,14.5A2,2 0 0,1 8.5,16.5A2,2 0 0,1 6.5,14.5A2,2 0 0,1 8.5,12.5M15.91,20.09L14.5,21.5L11.67,18.67L13.08,20.09L15.91,20.09Z'/%3E%3C/svg%3E") center/18px no-repeat;
}

.icon-dining::before {
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='white' viewBox='0 0 24 24'%3E%3Cpath d='M12,3C13.11,3 14,3.89 14,5V7H10V5C10,3.89 10.89,3 12,3M21,9V7L12,9L3,7V9L10.5,10L11,20H13L13.5,10L21,9Z'/%3E%3C/svg%3E") center/18px no-repeat;
}

.icon-bar::before {
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='white' viewBox='0 0 24 24'%3E%3Cpath d='M4,17H20V19H4V17M1,3H3V16H5V3H17V16H19V3H21V16C21,17.1 20.1,18 19,18H17V21H15V18H9V21H7V18H5C3.9,18 3,17.1 3,16V3H1V1H23V3H1V3Z'/%3E%3C/svg%3E") center/18px no-repeat;
}

.zone-content h4 {
    font-size: 20px;
    font-weight: 600;
    color: #414141;
    margin-bottom: 10px;
    line-height: 1.3;
}

.zone-description {
    font-size: 14px;
    color: #777777;
    margin-bottom: 15px;
    line-height: 1.5;
}

.zone-features {
    list-style: none;
    padding: 0;
    margin: 0;
}

.zone-features li {
    font-size: 13px;
    color: #555555;
    padding: 4px 0;
    padding-left: 20px;
    position: relative;
    line-height: 1.4;
}

.zone-features li::before {
    content: "✓";
    position: absolute;
    left: 0;
    color: #92C820;
    font-weight: bold;
    font-size: 12px;
}

/* Mobile Responsive */
@media (max-width: 768px) {
    .functional-zones-section {
        padding: 60px 0;
    }
    
    .zones-title {
        font-size: 28px;
    }
    
    .zone-item {
        margin-bottom: 20px;
    }
}
/* Technical Solutions Section */
.technical-solutions-section {
    padding: 80px 0;
    background: #F6F6F6;
}

.technical-header {
    text-align: center;
    margin-bottom: 50px;
}

.technical-title {
    font-size: 36px;
    font-weight: 600;
    color: #414141;
    margin-bottom: 15px;
    line-height: 1.3;
}

.technical-subtitle {
    font-size: 18px;
    color: #777777;
    max-width: 700px;
    margin: 0 auto;
    line-height: 1.6;
}

.technical-item {
    background: #ffffff;
    border-radius: 12px;
    padding: 25px 20px;
    margin-bottom: 30px;
    box-shadow: 0 2px 15px rgba(0, 0, 0, 0.08);
    transition: all 0.3s ease;
    height: 100%;
    text-align: center;
}

.technical-item:hover {
    transform: translateY(-3px);
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.15);
}

.technical-icon {
    width: 50px;
    height: 50px;
    background: #92C820;
    border-radius: 10px;
    margin: 0 auto 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
}

/* Detailed Water Icon */
.icon-water {
    background: linear-gradient(135deg, #92C820 0%, #7BA01A 100%);
}

.icon-water::before {
    content: "";
    width: 24px;
    height: 24px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='white' viewBox='0 0 24 24'%3E%3Cpath d='M6 2v6h.01L6 8.01 10 12l-4 4-.01.01H6V22h12v-5.99h-.01L18 16l-4-4 4-3.99.01-.01H18V2H6zm10 14.5V20H8v-3.5l4-4 4 4zm0-9V11l-4 4-4-4V7.5l4-4 4 4zM16 4v1.5L12 9.5 8 5.5V4h8z'/%3E%3C/svg%3E");
    background-size: 20px;
    background-repeat: no-repeat;
    background-position: center;
}

/* Detailed Electric Icon */
.icon-electric {
    background: linear-gradient(135deg, #92C820 0%, #7BA01A 100%);
}

.icon-electric::before {
    content: "";
    width: 24px;
    height: 24px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='white' viewBox='0 0 24 24'%3E%3Cpath d='M14.69 2.21L4.33 11.49c-.64.58-.28 1.65.58 1.73L13 14l-8.69 8.79c-.64.58-.28 1.65.58 1.73L23 18.75c.93-.09 1.23-1.25.45-1.72L14.69 2.21z'/%3E%3C/svg%3E");
    background-size: 18px;
    background-repeat: no-repeat;
    background-position: center;
}

/* Detailed Ventilation Icon */
.icon-ventilation {
    background: linear-gradient(135deg, #92C820 0%, #7BA01A 100%);
}

.icon-ventilation::before {
    content: "";
    width: 24px;
    height: 24px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='white' viewBox='0 0 24 24'%3E%3Cpath d='M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.41 0-8-3.59-8-8 0-1.82.62-3.49 1.64-4.83L9.17 12l-3.53 3.53A5.98 5.98 0 0112 18zm6.36-3.17A5.98 5.98 0 0112 6c1.66 0 3.14.69 4.22 1.78L14.83 12l1.39 1.39c.38.39.38 1.01 0 1.4-.39.39-1.01.39-1.4 0L12 12l-2.83 2.83c-.39.39-1.01.39-1.4 0-.39-.39-.39-1.01 0-1.4L10.59 12 7.76 9.17A5.98 5.98 0 0118.36 14.83z'/%3E%3C/svg%3E");
    background-size: 20px;
    background-repeat: no-repeat;
    background-position: center;
}

/* Detailed Safety Icon */
.icon-safety {
    background: linear-gradient(135deg, #92C820 0%, #7BA01A 100%);
}

.icon-safety::before {
    content: "";
    width: 24px;
    height: 24px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='white' viewBox='0 0 24 24'%3E%3Cpath d='M12,1L3,5V11C3,16.55 6.84,21.74 12,23C17.16,21.74 21,16.55 21,11V5L12,1M11,7H13V13H11V7M11,15H13V17H11V15Z'/%3E%3C/svg%3E");
    background-size: 20px;
    background-repeat: no-repeat;
    background-position: center;
}

.technical-item h4 {
    font-size: 18px;
    font-weight: 600;
    color: #414141;
    margin-bottom: 15px;
    line-height: 1.3;
}

.technical-list {
    list-style: none;
    padding: 0;
    margin: 0;
    text-align: left;
}

.technical-list li {
    font-size: 13px;
    color: #555555;
    padding: 3px 0;
    padding-left: 18px;
    position: relative;
    line-height: 1.4;
}

.technical-list li::before {
    content: "•";
    position: absolute;
    left: 0;
    color: #92C820;
    font-weight: bold;
    font-size: 16px;
}

/* Equipment Notice */
.equipment-notice {
    background: linear-gradient(135deg, #f8fdf0 0%, #f0f8e8 100%);
    border: 1px solid #92C820;
    border-radius: 12px;
    padding: 20px 25px;
    margin-top: 30px;
    display: flex;
    align-items: flex-start;
    gap: 15px;
}

.notice-icon {
    flex-shrink: 0;
    width: 35px;
    height: 35px;
    background: rgba(146, 200, 32, 0.1);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.notice-content h5 {
    font-size: 16px;
    font-weight: 600;
    color: #414141;
    margin-bottom: 8px;
    line-height: 1.3;
}

.notice-content p {
    font-size: 13px;
    color: #555555;
    margin: 0;
    line-height: 1.5;
}

/* Mobile Responsive */
@media (max-width: 768px) {
    .technical-solutions-section {
        padding: 60px 0;
    }
    
    .technical-title {
        font-size: 28px;
    }
    
    .technical-item {
        margin-bottom: 20px;
    }
    
    .equipment-notice {
        flex-direction: column;
        text-align: center;
    }
    
    .notice-icon {
        align-self: center;
    }
}
/* Materials Section */
.materials-section {
    padding: 80px 0;
    background: #ffffff;
}

.materials-header {
    text-align: center;
    margin-bottom: 50px;
}

.materials-title {
    font-size: 36px;
    font-weight: 600;
    color: #414141;
    margin-bottom: 15px;
    line-height: 1.3;
}

.materials-subtitle {
    font-size: 18px;
    color: #777777;
    max-width: 700px;
    margin: 0 auto;
    line-height: 1.6;
}

/* Tabs Navigation */
.materials-tabs {
    display: flex;
    justify-content: center;
    list-style: none;
    padding: 0;
    margin: 0 0 40px 0;
    border-bottom: 1px solid #e5e5e5;
}

.materials-tab {
    padding: 15px 25px;
    margin: 0 5px;
    cursor: pointer;
    font-size: 16px;
    font-weight: 500;
    color: #777777;
    border-bottom: 3px solid transparent;
    transition: all 0.3s ease;
}

.materials-tab:hover,
.materials-tab.active {
    color: #92C820;
    border-bottom-color: #92C820;
}

/* Tab Content */
.materials-tab-content {
    min-height: 400px;
}

.tab-pane {
    display: none;
}

.tab-pane.active {
    display: block;
}

.material-item {
    background: #F6F6F6;
    border-radius: 12px;
    padding: 25px;
    margin-bottom: 30px;
    height: 100%;
}

.material-icon {
    width: 50px;
    height: 50px;
    background: #92C820;
    border-radius: 10px;
    margin-bottom: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
}

/* Material Icons */
.icon-dpk::before {
    content: "";
    width: 24px;
    height: 24px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='white' viewBox='0 0 24 24'%3E%3Cpath d='M19 3H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm-8 14H9v-4h2v4zm0-6H9V7h2v4zm6 6h-2v-4h2v4zm0-6h-2V7h2v4z'/%3E%3C/svg%3E");
    background-size: 20px;
    background-repeat: no-repeat;
    background-position: center;
}

.icon-wood::before {
    content: "";
    width: 24px;
    height: 24px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='white' viewBox='0 0 24 24'%3E%3Cpath d='M12,2A10,10 0 0,1 22,12A10,10 0 0,1 12,22A10,10 0 0,1 2,12A10,10 0 0,1 12,2M12,4A8,8 0 0,0 4,12A8,8 0 0,0 12,20A8,8 0 0,0 20,12A8,8 0 0,0 12,4M12,6A6,6 0 0,1 18,12A6,6 0 0,1 12,18A6,6 0 0,1 6,12A6,6 0 0,1 12,6M12,8A4,4 0 0,0 8,12A4,4 0 0,0 12,16A4,4 0 0,0 16,12A4,4 0 0,0 12,8Z'/%3E%3C/svg%3E");
    background-size: 20px;
    background-repeat: no-repeat;
    background-position: center;
}

.icon-ceramic::before {
    content: "";
    width: 24px;
    height: 24px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='white' viewBox='0 0 24 24'%3E%3Cpath d='M3,3V21H21V3H3M19,19H5V5H19V19M15,7H9V9H15V7M15,11H9V13H15V11M15,15H9V17H15V15Z'/%3E%3C/svg%3E");
    background-size: 20px;
    background-repeat: no-repeat;
    background-position: center;
}

.icon-stone::before {
    content: "";
    width: 24px;
    height: 24px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='white' viewBox='0 0 24 24'%3E%3Cpath d='M12,2L14,8L21,6L18,12L22,18L14,19L12,22L10,19L2,18L6,12L3,6L10,8L12,2M12,4.7L10.5,9.3L6.1,7.8L8.1,11.7L5.2,16.3L10.5,15.5L12,18.3L13.5,15.5L18.8,16.3L15.9,11.7L17.9,7.8L13.5,9.3L12,4.7Z'/%3E%3C/svg%3E");
    background-size: 20px;
    background-repeat: no-repeat;
    background-position: center;
}

.material-item h4 {
    font-size: 20px;
    font-weight: 600;
    color: #414141;
    margin-bottom: 12px;
    line-height: 1.3;
}

.material-item p {
    font-size: 14px;
    color: #777777;
    margin-bottom: 15px;
    line-height: 1.5;
}

.material-features {
    list-style: none;
    padding: 0;
    margin-bottom: 15px;
}

.material-features li {
    font-size: 13px;
    color: #555555;
    padding: 3px 0;
    padding-left: 18px;
    position: relative;
    line-height: 1.4;
}

.material-features li::before {
    content: "✓";
    position: absolute;
    left: 0;
    color: #92C820;
    font-weight: bold;
    font-size: 12px;
}

.material-note {
    background: #92C820;
    color: #ffffff;
    padding: 6px 12px;
    border-radius: 15px;
    font-size: 12px;
    font-weight: 500;
    display: inline-block;
}

/* Surface Items */
.surface-item {
    background: #F6F6F6;
    border-radius: 8px;
    padding: 20px;
    margin-bottom: 20px;
    text-align: center;
    height: 100%;
}

.surface-item h5 {
    font-size: 16px;
    font-weight: 600;
    color: #414141;
    margin-bottom: 10px;
}

.surface-item p {
    font-size: 13px;
    color: #555555;
    margin: 0;
    line-height: 1.4;
}

.material-consultation {
    background: #fff3cd;
    border: 1px solid #ffeaa7;
    border-radius: 8px;
    padding: 15px;
    margin-top: 20px;
}

.material-consultation p {
    margin: 0;
    font-size: 14px;
    color: #856404;
    line-height: 1.5;
}

/* Showroom Notice */
.showroom-notice {
    background: linear-gradient(135deg, #f8fdf0 0%, #f0f8e8 100%);
    border: 1px solid #92C820;
    border-radius: 12px;
    padding: 25px;
    margin-top: 40px;
    display: flex;
    align-items: flex-start;
    gap: 20px;
}

.showroom-icon {
    flex-shrink: 0;
    width: 50px;
    height: 50px;
    background: rgba(146, 200, 32, 0.1);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.showroom-content h5 {
    font-size: 18px;
    font-weight: 600;
    color: #414141;
    margin-bottom: 10px;
    line-height: 1.3;
}

.showroom-content p {
    font-size: 14px;
    color: #555555;
    margin: 0;
    line-height: 1.6;
}

/* Mobile Responsive */
@media (max-width: 768px) {
    .materials-section {
        padding: 60px 0;
    }
    
    .materials-title {
        font-size: 28px;
    }
    
    .materials-tabs {
        flex-wrap: wrap;
        justify-content: center;
    }
    
    .materials-tab {
        padding: 10px 15px;
        margin: 5px;
    }
    
    .showroom-notice {
        flex-direction: column;
        text-align: center;
    }
    
    .showroom-icon {
        align-self: center;
    }
}
/* Projects Section */
.projects-section {
    padding: 80px 0;
    background: #F6F6F6;
}

.projects-header {
    text-align: center;
    margin-bottom: 50px;
}

.projects-title {
    font-size: 36px;
    font-weight: 600;
    color: #414141;
    margin-bottom: 15px;
    line-height: 1.3;
}

.projects-subtitle {
    font-size: 18px;
    color: #777777;
    max-width: 600px;
    margin: 0 auto;
    line-height: 1.6;
}

.project-card {
    background: #ffffff;
    border-radius: 12px;
    overflow: hidden;
    margin-bottom: 30px;
    box-shadow: 0 3px 15px rgba(0, 0, 0, 0.1);
    transition: all 0.3s ease;
    height: 100%;
}

.project-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.15);
}

.project-image {
    position: relative;
    height: 350px;
    overflow: hidden;
}

.project-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.3s ease;
}

.project-card:hover .project-image img {
    transform: scale(1.05);
}

.project-badge {
    position: absolute;
    top: 15px;
    right: 15px;
    background: #92C820;
    color: #ffffff;
    padding: 6px 12px;
    border-radius: 20px;
    font-size: 12px;
    font-weight: 600;
}

.project-content {
    padding: 25px;
}

.project-content h4 {
    font-size: 20px;
    font-weight: 600;
    color: #414141;
    margin-bottom: 8px;
    line-height: 1.3;
}

.project-location {
    font-size: 14px;
    color: #777777;
    margin-bottom: 5px;
    font-style: italic;
}

.project-area {
    font-size: 13px;
    color: #92C820;
    font-weight: 600;
    margin-bottom: 15px;
}

.project-materials {
    margin-bottom: 15px;
}

.project-materials h6 {
    font-size: 14px;
    font-weight: 600;
    color: #414141;
    margin-bottom: 8px;
}

.project-materials ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.project-materials li {
    font-size: 12px;
    color: #555555;
    padding: 2px 0;
    padding-left: 15px;
    position: relative;
    line-height: 1.4;
}

.project-materials li::before {
    content: "▪";
    position: absolute;
    left: 0;
    color: #92C820;
    font-weight: bold;
}

.project-result {
    background: #f8fdf0;
    border-left: 3px solid #92C820;
    padding: 10px 15px;
    border-radius: 0 6px 6px 0;
    font-size: 13px;
    color: #555555;
    line-height: 1.4;
}

.project-result strong {
    color: #414141;
}

/* Construction Focus Notice */
.construction-focus {
    background: linear-gradient(135deg, #ffffff 0%, #f8fdf0 100%);
    border: 2px solid #92C820;
    border-radius: 15px;
    padding: 30px;
    margin-top: 50px;
    display: flex;
    align-items: center;
    gap: 25px;
    box-shadow: 0 5px 20px rgba(146, 200, 32, 0.1);
}

.focus-icon {
    flex-shrink: 0;
    width: 60px;
    height: 60px;
    background: rgba(146, 200, 32, 0.1);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.focus-content h5 {
    font-size: 20px;
    font-weight: 600;
    color: #414141;
    margin-bottom: 12px;
    line-height: 1.3;
}

.focus-content p {
    font-size: 15px;
    color: #555555;
    margin: 0;
    line-height: 1.6;
}

/* Mobile Responsive */
@media (max-width: 768px) {
    .projects-section {
        padding: 60px 0;
    }
    
    .projects-title {
        font-size: 28px;
    }
    
    .project-card {
        margin-bottom: 25px;
    }
    
    .project-image {
        height: 180px;
    }
    
    .project-content {
        padding: 20px;
    }
    
    .construction-focus {
        flex-direction: column;
        text-align: center;
        padding: 25px;
    }
    
    .focus-icon {
        align-self: center;
    }
}

@media (max-width: 576px) {
    .project-content h4 {
        font-size: 18px;
    }
    
    .project-materials li {
        font-size: 11px;
    }
}
/* Construction Stages Section */
.construction-stages-section {
    padding: 80px 0;
    background: #ffffff;
}

.stages-header {
    text-align: center;
    margin-bottom: 60px;
}

.stages-title {
    font-size: 36px;
    font-weight: 600;
    color: #414141;
    margin-bottom: 15px;
    line-height: 1.3;
}

.stages-subtitle {
    font-size: 18px;
    color: #777777;
    max-width: 700px;
    margin: 0 auto;
    line-height: 1.6;
}

.stages-list {
    position: relative;
}

.stage-item {
    position: relative;
    background: #F6F6F6;
    border-radius: 15px;
    padding: 30px 25px;
    margin-bottom: 30px;
    transition: all 0.3s ease;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
}

.stage-item:hover {
    background: #ffffff;
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.1);
    transform: translateY(-5px);
}

.stage-number {
    position: absolute;
    top: -15px;
    left: 25px;
    width: 35px;
    height: 35px;
    background: #92C820;
    color: #ffffff;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    font-weight: 600;
    box-shadow: 0 3px 10px rgba(146, 200, 32, 0.3);
}

.stage-icon-wrapper {
    margin-bottom: 20px;
    margin-top: 10px;
}

.stage-icon {
    width: 60px;
    height: 60px;
    background: linear-gradient(135deg, #92C820 0%, #7BA01A 100%);
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
}

/* Stage Icons */
.icon-consultation::before {
    content: "";
    width: 28px;
    height: 28px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='white' viewBox='0 0 24 24'%3E%3Cpath d='M12 2C13.1 2 14 2.9 14 4C14 5.1 13.1 6 12 6C10.9 6 10 5.1 10 4C10 2.9 10.9 2 12 2ZM21 9V7L12 9L3 7V9L12 11L21 9ZM12 13L3 11V13L12 15L21 13V11L12 13Z'/%3E%3C/svg%3E");
    background-size: 24px;
    background-repeat: no-repeat;
    background-position: center;
}

.icon-measurement::before {
    content: "";
    width: 28px;
    height: 28px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='white' viewBox='0 0 24 24'%3E%3Cpath d='M3 17H21V19H3V17M3 5H21V7H3V5M15 9V11H17V13H15V15H13V13H11V11H13V9H15M9 9V11H7V9H9M9 13V15H7V13H9Z'/%3E%3C/svg%3E");
    background-size: 24px;
    background-repeat: no-repeat;
    background-position: center;
}

.icon-foundation::before {
    content: "";
    width: 28px;
    height: 28px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='white' viewBox='0 0 24 24'%3E%3Cpath d='M12 1L21 5V11C21 16.55 17.16 21.74 12 23C6.84 21.74 3 16.55 3 11V5L12 1M12 3.18L5 6.3V11.22C5 15.54 8.34 19.42 12 20.25C15.66 19.42 19 15.54 19 11.22V6.3L12 3.18Z'/%3E%3C/svg%3E");
    background-size: 24px;
    background-repeat: no-repeat;
    background-position: center;
}

.icon-communications::before {
    content: "";
    width: 28px;
    height: 28px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='white' viewBox='0 0 24 24'%3E%3Cpath d='M4 2C2.89 2 2 2.9 2 4V20C2 21.1 2.89 22 4 22H20C21.1 22 22 21.1 22 20V4C22 2.9 21.1 2 20 2H4M4 4H20V20H4V4M6 6V8H8V6H6M10 6V8H12V6H10M14 6V8H16V6H14M18 6V8H20V6H18M6 10V12H8V10H6M10 10V12H12V10H10M14 10V12H16V10H14M18 10V12H20V10H18Z'/%3E%3C/svg%3E");
    background-size: 24px;
    background-repeat: no-repeat;
    background-position: center;
}

.icon-frame::before {
    content: "";
    width: 28px;
    height: 28px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='white' viewBox='0 0 24 24'%3E%3Cpath d='M19 7V5C19 3.9 18.1 3 17 3H7C5.9 3 5 3.9 5 5V7H3V9H5V15H3V17H5V19C5 20.1 5.9 21 7 21H17C18.1 21 19 20.1 19 19V17H21V15H19V9H21V7H19M7 5H17V7H7V5M7 9H17V15H7V9M7 17H17V19H7V17Z'/%3E%3C/svg%3E");
    background-size: 24px;
    background-repeat: no-repeat;
    background-position: center;
}

.icon-decking::before {
    content: "";
    width: 28px;
    height: 28px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='white' viewBox='0 0 24 24'%3E%3Cpath d='M19 3H5C3.9 3 3 3.9 3 5V19C3 20.1 3.9 21 5 21H19C20.1 21 21 20.1 21 19V5C21 3.9 20.1 3 19 3M19 5V8H5V5H19M5 10H8V14H5V10M10 10H14V14H10V10M16 10H19V14H16V10M5 16H8V19H5V16M10 16H14V19H10V16M16 16H19V19H16V16Z'/%3E%3C/svg%3E");
    background-size: 24px;
    background-repeat: no-repeat;
    background-position: center;
}

.icon-finishing::before {
    content: "";
    width: 28px;
    height: 28px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='white' viewBox='0 0 24 24'%3E%3Cpath d='M20.71 7.04C21.1 6.65 21.1 6 20.71 5.63L18.37 3.29C18 2.9 17.35 2.9 16.96 3.29L15.12 5.12L18.87 8.87M3 17.25V21H6.75L17.81 9.93L14.06 6.18L3 17.25Z'/%3E%3C/svg%3E");
    background-size: 24px;
    background-repeat: no-repeat;
    background-position: center;
}

.icon-handover::before {
    content: "";
    width: 28px;
    height: 28px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='white' viewBox='0 0 24 24'%3E%3Cpath d='M12 2C6.48 2 2 6.48 2 12S6.48 22 12 22 22 17.52 22 12 17.52 2 12 2M10 17L5 12L6.41 10.59L10 14.17L17.59 6.58L19 8L10 17Z'/%3E%3C/svg%3E");
    background-size: 24px;
    background-repeat: no-repeat;
    background-position: center;
}

.stage-content {
    flex-grow: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.stage-content h4 {
    font-size: 20px;
    font-weight: 600;
    color: #414141;
    margin-bottom: 15px;
    line-height: 1.3;
}

.stage-content p {
    font-size: 14px;
    color: #555555;
    line-height: 1.5;
    margin-bottom: 15px;
    flex-grow: 1;
}

.stage-duration {
    font-size: 13px;
    color: #92C820;
    font-weight: 600;
    background: rgba(146, 200, 32, 0.1);
    padding: 6px 12px;
    border-radius: 15px;
    display: inline-block;
}

/* Timeline Summary */
.timeline-summary {
    background: linear-gradient(135deg, #f8fdf0 0%, #f0f8e8 100%);
    border: 2px solid #92C820;
    border-radius: 15px;
    padding: 30px;
    margin-top: 50px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 30px;
}

.timeline-content h5 {
    font-size: 22px;
    font-weight: 600;
    color: #414141;
    margin-bottom: 10px;
    line-height: 1.3;
}

.timeline-content p {
    font-size: 15px;
    color: #555555;
    margin: 0;
    line-height: 1.6;
}

.timeline-icon {
    flex-shrink: 0;
    width: 70px;
    height: 70px;
    background: rgba(146, 200, 32, 0.1);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Mobile Responsive */
@media (max-width: 768px) {
    .construction-stages-section {
        padding: 60px 0;
    }
    
    .stages-title {
        font-size: 28px;
    }
    
    .stage-item {
        margin-bottom: 25px;
        padding: 25px 20px;
    }
    
    .stage-content h4 {
        font-size: 18px;
    }
    
    .timeline-summary {
        flex-direction: column;
        text-align: center;
        padding: 25px;
    }
    
    .timeline-content h5 {
        font-size: 20px;
    }
}

@media (max-width: 576px) {
    .stage-number {
        width: 30px;
        height: 30px;
        font-size: 14px;
        top: -12px;
        left: 20px;
    }
    
    .stage-icon {
        width: 50px;
        height: 50px;
    }
}

/* Kitchen Styles Section */
.kitchen-styles-section {
    padding: 80px 0;
    background: #F6F6F6;
}

.styles-header {
    text-align: center;
    margin-bottom: 50px;
}

.styles-title {
    font-size: 36px;
    font-weight: 600;
    color: #414141;
    margin-bottom: 15px;
    line-height: 1.3;
}

.styles-subtitle {
    font-size: 18px;
    color: #777777;
    max-width: 600px;
    margin: 0 auto;
    line-height: 1.6;
}

.style-card {
    background: #ffffff;
    border-radius: 15px;
    overflow: hidden;
    margin-bottom: 30px;
    box-shadow: 0 3px 20px rgba(0, 0, 0, 0.08);
    transition: all 0.3s ease;
    height: 100%;
}

.style-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.15);
}

.style-image {
    position: relative;
    height: 200px;
    overflow: hidden;
}

.style-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.3s ease;
}

.style-card:hover .style-image img {
    transform: scale(1.05);
}

.style-overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(135deg, rgba(0, 0, 0, 0.4) 0%, rgba(0, 0, 0, 0.6) 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    transition: opacity 0.3s ease;
}

.style-card:hover .style-overlay {
    opacity: 1;
}

.style-features {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
}

.style-features span {
    background: rgba(146, 200, 32, 0.9);
    color: #ffffff;
    padding: 4px 12px;
    border-radius: 12px;
    font-size: 12px;
    font-weight: 500;
}

.style-content {
    padding: 25px;
}

.style-content h4 {
    font-size: 20px;
    font-weight: 600;
    color: #414141;
    margin-bottom: 10px;
    line-height: 1.3;
}

.style-description {
    font-size: 14px;
    color: #777777;
    margin-bottom: 20px;
    line-height: 1.5;
}

.style-details > div {
    margin-bottom: 12px;
}

.style-details strong {
    font-size: 13px;
    font-weight: 600;
    color: #414141;
    display: block;
    margin-bottom: 5px;
}

.style-materials span,
.style-suitable {
    font-size: 12px;
    color: #555555;
    line-height: 1.4;
}

.style-colors {
    display: flex;
    align-items: center;
    gap: 10px;
}

.color-palette {
    display: flex;
    gap: 6px;
}

.color-dot {
    width: 20px;
    height: 20px;
    border-radius: 50%;
    border: 2px solid #ffffff;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
}

/* Style Help */
.style-help {
    background: linear-gradient(135deg, #f8fdf0 0%, #f0f8e8 100%);
    border: 1px solid #92C820;
    border-radius: 12px;
    padding: 25px;
    margin-top: 40px;
    display: flex;
    align-items: flex-start;
    gap: 20px;
}

.help-icon {
    flex-shrink: 0;
    width: 40px;
    height: 40px;
    background: rgba(146, 200, 32, 0.1);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.help-content h5 {
    font-size: 18px;
    font-weight: 600;
    color: #414141;
    margin-bottom: 10px;
    line-height: 1.3;
}

.help-content p {
    font-size: 14px;
    color: #555555;
    margin: 0;
    line-height: 1.6;
}

/* Mobile Responsive */
@media (max-width: 768px) {
    .kitchen-styles-section {
        padding: 60px 0;
    }
    
    .styles-title {
        font-size: 28px;
    }
    
    .style-card {
        margin-bottom: 25px;
    }
    
    .style-image {
        height: 180px;
    }
    
    .style-content {
        padding: 20px;
    }
    
    .style-help {
        flex-direction: column;
        text-align: center;
    }
    
    .help-icon {
        align-self: center;
    }
}

@media (max-width: 576px) {
    .style-content h4 {
        font-size: 18px;
    }
    
    .style-features {
        flex-direction: row;
        flex-wrap: wrap;
        gap: 5px;
    }
    
    .style-features span {
        font-size: 11px;
        padding: 3px 8px;
    }
}

/* FAQ Section */
.faq-section {
    padding: 80px 0;
    background: #F6F6F6;
}

.faq-header {
    text-align: center;
    margin-bottom: 60px;
}

.faq-title {
    font-size: 36px;
    font-weight: 600;
    color: #414141;
    margin-bottom: 15px;
    line-height: 1.3;
}

.faq-subtitle {
    font-size: 18px;
    color: #777777;
    max-width: 600px;
    margin: 0 auto;
    line-height: 1.6;
}

.faq-item {
    background: #ffffff;
    border-radius: 12px;
    margin-bottom: 20px;
    overflow: hidden;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
    transition: all 0.3s ease;
}

.faq-item:hover {
    box-shadow: 0 5px 20px rgba(0, 0, 0, 0.1);
}

.faq-question {
    width: 100%;
    background: none;
    border: none;
    padding: 25px 30px;
    text-align: left;
    font-size: 18px;
    font-weight: 600;
    color: #414141;
    line-height: 1.4;
    display: flex;
    justify-content: space-between;
    align-items: center;
    cursor: pointer;
    transition: all 0.3s ease;
}

.faq-question:hover {
    background: #f8f9fa;
    color: #92C820;
}

.faq-question:focus {
    outline: none;
    box-shadow: none;
}

.faq-icon {
    width: 20px;
    height: 20px;
    flex-shrink: 0;
    margin-left: 20px;
    transition: transform 0.3s ease;
    fill: #777777;
}

.faq-question:not(.collapsed) .faq-icon {
    transform: rotate(180deg);
    fill: #92C820;
}

.faq-question:not(.collapsed) {
    color: #92C820;
    background: #f8fdf0;
    border-bottom: 1px solid #e5f3d3;
}

.faq-answer {
    padding: 0 30px 25px 30px;
}

.faq-answer p {
    font-size: 15px;
    color: #555555;
    line-height: 1.6;
    margin: 0;
}

/* Collapse animation */
.collapse {
    transition: all 0.3s ease;
}

.collapsing {
    transition: height 0.3s ease;
}

/* Mobile Responsive */
@media (max-width: 768px) {
    .faq-section {
        padding: 60px 0;
    }
    
    .faq-title {
        font-size: 28px;
    }
    
    .faq-question {
        padding: 20px;
        font-size: 16px;
    }
    
    .faq-icon {
        margin-left: 15px;
        width: 18px;
        height: 18px;
    }
    
    .faq-answer {
        padding: 0 20px 20px 20px;
    }
    
    .faq-answer p {
        font-size: 14px;
    }
}

@media (max-width: 576px) {
    .faq-question {
        padding: 18px 15px;
        font-size: 15px;
    }
    
    .faq-answer {
        padding: 0 15px 18px 15px;
    }
}

/* Cost Calculator Section - ПОЛНАЯ ЗАМЕНА */
.cost-calculator-section {
    padding: 80px 0;
    background: linear-gradient(135deg, #f8fdf0 0%, #f0f8e8 100%);
}

.calculator-header {
    text-align: center;
    margin-bottom: 50px;
}

.calculator-title {
    font-size: 36px;
    font-weight: 600;
    color: #414141;
    margin-bottom: 15px;
    line-height: 1.3;
}

.calculator-subtitle {
    font-size: 18px;
    color: #777777;
    max-width: 700px;
    margin: 0 auto;
    line-height: 1.6;
}

.calculator-card {
    background: #ffffff;
    border-radius: 20px;
    padding: 30px;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.1);
    border: 1px solid #e5f3d3;
    max-width: 100%;
    overflow: hidden;
}

.form-group {
    margin-bottom: 20px;
}

.form-label {
    font-size: 14px;
    font-weight: 600;
    color: #414141;
    margin-bottom: 8px;
    display: block;
}

.calculator-input,
.calculator-select,
.calculator-textarea {
    border: 2px solid #e5e5e5;
    border-radius: 8px;
    padding: 12px 16px;
    font-size: 15px;
    color: #414141;
    transition: all 0.3s ease;
    width: 100%;
    box-sizing: border-box;
    max-width: 100%;
}

.calculator-input:focus,
.calculator-select:focus,
.calculator-textarea:focus {
    border-color: #92C820;
    box-shadow: 0 0 0 3px rgba(146, 200, 32, 0.1);
    outline: none;
}

.input-group {
    display: flex;
    width: 100%;
    max-width: 100%;
}

.input-group .form-control {
    flex: 1;
    border-radius: 8px 0 0 8px;
    border-right: none;
}

.input-group-append {
    display: flex;
}

.input-group-text {
    background: #f8f9fa;
    border: 2px solid #e5e5e5;
    border-left: none;
    color: #777777;
    font-weight: 500;
    border-radius: 0 8px 8px 0;
    padding: 12px 16px;
    display: flex;
    align-items: center;
    white-space: nowrap;
}

/* Checkbox Group */
.checkbox-group {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 12px;
    width: 100%;
}

.checkbox-item {
    display: flex;
    align-items: center;
    cursor: pointer;
    font-size: 14px;
    color: #555555;
    position: relative;
    padding-left: 25px;
    min-height: 20px;
    word-break: break-word;
}

.checkbox-item input[type="checkbox"] {
    position: absolute;
    opacity: 0;
    cursor: pointer;
}

.checkmark {
    position: absolute;
    left: 0;
    top: 2px;
    height: 18px;
    width: 18px;
    background-color: #ffffff;
    border: 2px solid #e5e5e5;
    border-radius: 4px;
    transition: all 0.3s ease;
}

.checkbox-item:hover input ~ .checkmark {
    border-color: #92C820;
}

.checkbox-item input:checked ~ .checkmark {
    background-color: #92C820;
    border-color: #92C820;
}

.checkmark:after {
    content: "";
    position: absolute;
    display: none;
    left: 5px;
    top: 2px;
    width: 4px;
    height: 8px;
    border: solid white;
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
}

.checkbox-item input:checked ~ .checkmark:after {
    display: block;
}

/* Radio Group */
.radio-group {
    display: flex;
    flex-direction: column;
    gap: 8px;
    width: 100%;
}

.radio-item {
    display: flex;
    align-items: center;
    cursor: pointer;
    font-size: 14px;
    color: #555555;
    position: relative;
    padding-left: 25px;
    min-height: 20px;
    word-break: break-word;
}

.radio-item input[type="radio"] {
    position: absolute;
    opacity: 0;
    cursor: pointer;
}

.radiomark {
    position: absolute;
    left: 0;
    top: 2px;
    height: 18px;
    width: 18px;
    background-color: #ffffff;
    border: 2px solid #e5e5e5;
    border-radius: 50%;
    transition: all 0.3s ease;
}

.radio-item:hover input ~ .radiomark {
    border-color: #92C820;
}

.radio-item input:checked ~ .radiomark {
    border-color: #92C820;
}

.radiomark:after {
    content: "";
    position: absolute;
    display: none;
    left: 3px;
    top: 3px;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #92C820;
}

.radio-item input:checked ~ .radiomark:after {
    display: block;
}

/* Form Submit */
.form-submit {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 20px;
    margin-top: 30px;
    padding-top: 30px;
    border-top: 1px solid #e5e5e5;
    flex-wrap: wrap;
}

.submit-benefits {
    flex: 1;
    min-width: 280px;
}

.submit-benefits h5 {
    font-size: 16px;
    font-weight: 600;
    color: #414141;
    margin-bottom: 12px;
}

.submit-benefits ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.submit-benefits li {
    font-size: 13px;
    color: #555555;
    padding: 3px 0;
    padding-left: 18px;
    position: relative;
    line-height: 1.4;
}

.submit-benefits li::before {
    content: "✓";
    position: absolute;
    left: 0;
    color: #92C820;
    font-weight: bold;
    font-size: 12px;
}

.submit-action {
    flex-shrink: 0;
    min-width: 250px;
    text-align: center;
}

.calculator-submit-btn {
    background: #92C820;
    color: #ffffff;
    border: none;
    padding: 15px 25px;
    font-size: 16px;
    font-weight: 600;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    transition: all 0.3s ease;
    margin-bottom: 15px;
    width: 100%;
    max-width: 300px;
}

.calculator-submit-btn:hover {
    background: #7BA01A;
    color: #ffffff;
    transform: translateY(-2px);
    box-shadow: 0 5px 15px rgba(146, 200, 32, 0.3);
}

.btn-icon {
    flex-shrink: 0;
}

.privacy-notice {
    text-align: center;
}

.privacy-checkbox {
    font-size: 12px;
    justify-content: center;
}

.privacy-checkbox a {
    color: #92C820;
    text-decoration: none;
}

.privacy-checkbox a:hover {
    text-decoration: underline;
}

/* Calculator Info */
.calculator-info {
    margin-top: 60px;
}

.info-item {
    text-align: center;
    padding: 20px;
}

.info-icon {
    width: 50px;
    height: 50px;
    background: #92C820;
    border-radius: 50%;
    margin: 0 auto 15px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
}

.info-icon::before {
    content: "";
    width: 24px;
    height: 24px;
    background: #ffffff;
}

.icon-time::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='white' viewBox='0 0 24 24'%3E%3Cpath d='M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm-2 15l-5-5 1.41-1.41L10 14.17l7.59-7.59L19 8l-9 9z'/%3E%3C/svg%3E");
    background-size: 20px;
    background-repeat: no-repeat;
    background-position: center;
}

.icon-materials::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='white' viewBox='0 0 24 24'%3E%3Cpath d='M12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z'/%3E%3C/svg%3E");
    background-size: 20px;
    background-repeat: no-repeat;
    background-position: center;
}

.icon-guarantee::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='white' viewBox='0 0 24 24'%3E%3Cpath d='M12 1L3 5V11C3 16.55 6.84 21.74 12 23C17.16 21.74 21 16.55 21 11V5L12 1M12 7C13.4 7 14.8 8.6 14.8 10V11.5C15.4 11.5 16 12.1 16 12.7V16.7C16 17.4 15.4 18 14.8 18H9.2C8.6 18 8 17.4 8 16.8V12.8C8 12.1 8.6 11.5 9.2 11.5V10C9.2 8.6 10.6 7 12 7Z'/%3E%3C/svg%3E");
    background-size: 20px;
    background-repeat: no-repeat;
    background-position: center;
}

.info-item h6 {
    font-size: 16px;
    font-weight: 600;
    color: #414141;
    margin-bottom: 5px;
}

.info-item p {
    font-size: 13px;
    color: #777777;
    margin: 0;
    line-height: 1.4;
}

/* Mobile Responsive */
@media (max-width: 768px) {
    .cost-calculator-section {
        padding: 60px 0;
    }
    
    .calculator-title {
        font-size: 28px;
    }
    
    .calculator-card {
        padding: 20px;
        margin: 0 10px;
    }
    
    .form-submit {
        flex-direction: column;
        gap: 20px;
        text-align: center;
    }
    
    .submit-benefits,
    .submit-action {
        min-width: auto;
        width: 100%;
    }
    
    .checkbox-group {
        grid-template-columns: 1fr;
        gap: 10px;
    }
    
    .calculator-submit-btn {
        max-width: 100%;
    }
}

@media (max-width: 576px) {
    .cost-calculator-section {
        padding: 60px 15px;
    }
    
    .calculator-card {
        padding: 15px;
        margin: 0;
        border-radius: 15px;
    }
    
    .calculator-input,
    .calculator-select,
    .calculator-textarea {
        padding: 10px 12px;
        font-size: 14px;
    }
    
    .input-group-text {
        padding: 9px 12px;
        font-size: 14px;
    }
    
    .checkbox-item,
    .radio-item {
        font-size: 13px;
    }
    
    .form-label {
        font-size: 13px;
    }
}